{"_id":"@amollo-kit/components-override","_rev":"4-2d9d38111f2dabdc08b6131671d7da9c","name":"@amollo-kit/components-override","dist-tags":{"latest":"1.0.2"},"versions":{"0.1.0":{"name":"@amollo-kit/components-override","scopeCommitName":"@helpers/c_override","version":"0.1.0","license":"MIT","description":"","author":{"name":"amollo-ui","email":"amolloui@gmail.com"},"keywords":["amollo","override","components-override","react-override"],"main":"dist/index.js","module":"dist/components-override.esm.js","browser":"dist/components-override.esm.js","types":"dist/@types/index.d.ts","publishConfig":{"access":"public"},"homepage":"https://github.com/amollo-ui/amollo-kit/tree/master/packages/@helpers/components-override#readme","bugs":{"url":"https://github.com/amollo-ui/amollo-kit/issues"},"repository":{"type":"git","url":"git+ssh://git@github.com/amollo-ui/amollo-kit.git"},"scripts":{"lint":"eslint \"./**/*.{js,ts,jsx,tsx}\"","lint:fix":"yarn lint --fix","prepublishOnly":"yarn lint:fix && yarn lint && yarn build","build":"rimraf dist && tsdx build --format es,cjs --entry lib/index.ts"},"peerDependencies":{"react":">=16.x"},"devDependencies":{"@amollo-lint/eslint-config-ts":"^2.1.0","@types/react":"^17.0.39","eslint":"^8.10.0","rimraf":"^3.0.2","tsdx":"^0.14.1","typescript":"4.5.5"},"dependencies":{"react":"^17.0.2"},"gitHead":"3c91f104e9cec25b4cf9c358f18cf845f7721daa","_id":"@amollo-kit/components-override@0.1.0","_nodeVersion":"16.13.2","_npmVersion":"8.1.2","dist":{"integrity":"sha512-zkvgTLoOBA5lutqLCMvwJnWzl7OmRojvC9BPbww0TfSWMLOX3mAjHaJ0EL3StUgxXVRPEleJutA0TXcaJgaX+Q==","shasum":"dfe081901a9849797f0de49c470e4c7e7e799d86","tarball":"https://registry.npmjs.org/@amollo-kit/components-override/-/components-override-0.1.0.tgz","fileCount":12,"unpackedSize":17468,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiIdN9ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmquag//YYALMYdxLcbEZeCsIr/xVFYZ6XxM4QxlOLdNIX+tdQZb4+XG\r\nUdCl3KnENtszficxmlr1z8jMnsS6o4Yqp1QEvZ51V0AbY2yOjErc3x3RnlHo\r\n0QvdaTJ7rEcESGevJCqHkeETGXavSS7ie6E/fLPVrWepMUQ6dbLwLj8me1Ov\r\n3DWdRNsht3Gvtq0+GjIsDZSLUH46XnPGO2hmchsQgpLFbeawg+lir+2nywMy\r\nEVbLKTo/HTD5X+EsYrpGJhB1QznF/l5VYrBYjUPuHbk256n/JQpLc1aN36aL\r\nTyqQuCb/CMvCdWwbkU/ip0l4XM2n/Rb7TpOrPrixC6+3RxMZzkQicJWHNgGQ\r\nZQky4r8XK9eWTHsKugosqAwLBzdUpd3O6vnEL8em1b1IVhI5h/nOPbG5vrVX\r\n8Auk8rEl7Elt68ZtnKR25FwX1xQMh1FVqpBmY3gnVs1Jmnm2sbvsnIv+cOA/\r\nbD6kD1EEszN73wBKaNw7cUme2yEvC/yqUMetjPk6gM7fC9x5e6QLt8kXCIWq\r\nJ+0+vHar3nFvBWT9srUnXIcAJpRz+tCYKKiC2qtqgMtdV4yToFacVJ85RqXh\r\n1kFXjRyCb626+pK6wGd+h6h8SIZ39YUkHrvsmBl8En2EyAZK8WcJwzfb445u\r\nqgZruvQJj871KiT61n6mDt0ag9YQbhYfVKk=\r\n=l9ww\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDq9kOS/WEyK86ufeXUdgQutweVsCNssutpP63c+61uuwIgSPSVyHfJeiDVcv56UXlL4VwGZsfUU3FGjhiJtcIk5EM="}]},"_npmUser":{"name":"amollo","email":"amolloui@gmail.com"},"directories":{},"maintainers":[{"name":"amollo","email":"amolloui@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/components-override_0.1.0_1646383996939_0.17509711414336904"},"_hasShrinkwrap":false},"1.0.0":{"name":"@amollo-kit/components-override","scopeCommitName":"helpers/c_override","version":"1.0.0","license":"MIT","description":"Reusable react components with the overrides pattern","author":{"name":"amollo-ui","email":"amolloui@gmail.com"},"keywords":["amollo","override","components-override","react-override"],"main":"dist/index.js","module":"dist/components-override.esm.js","browser":"dist/components-override.esm.js","types":"dist/@types/index.d.ts","publishConfig":{"access":"public"},"homepage":"https://github.com/amollo-ui/amollo-kit/tree/master/packages/@helpers/components-override#readme","bugs":{"url":"https://github.com/amollo-ui/amollo-kit/issues"},"repository":{"type":"git","url":"git+ssh://git@github.com/amollo-ui/amollo-kit.git"},"scripts":{"lint":"eslint \"./**/*.{js,ts,jsx,tsx}\"","lint:fix":"yarn lint --fix","prepublishOnly":"yarn lint:fix && yarn lint && yarn build","build":"rimraf dist && tsdx build --format es,cjs --entry lib/index.ts"},"peerDependencies":{"react":">=16.x"},"devDependencies":{"@amollo-lint/eslint-config-ts":"^2.1.0","@types/react":"^17.0.39","eslint":"^8.10.0","rimraf":"^3.0.2","tsdx":"^0.14.1","typescript":"4.5.5"},"gitHead":"869c601b59b12c49ff6ef6bbe37459e53a3c51b7","_id":"@amollo-kit/components-override@1.0.0","_nodeVersion":"16.13.2","_npmVersion":"8.1.2","dist":{"integrity":"sha512-zMNx2SSFntmGn0lPYD3ofMCJlP4PmibifiJwMh90b7EqZ47BitFi5Iucxp3P1gobHhv7NTZLVqfhgsaXD0SHUg==","shasum":"021baa893414878eaa7442dd574cd384bb7724b5","tarball":"https://registry.npmjs.org/@amollo-kit/components-override/-/components-override-1.0.0.tgz","fileCount":12,"unpackedSize":19703,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiIe9gACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmppHw/9FtKURz2W6qgY3TqYZX4/dHDmmyGim/BGkNKtqnXMIuXu/b8b\r\nAv2W6S7lhHT8itAZA2DSq7JZPLCgOVbFK5vvdsVJYaERuVs+yol1LreSJgWd\r\nCe3eLZYQ/aaXo0ikvNEBQw0kWsrO5B2CIrztaqYc2fHCsaQ/c8qWlmTmCTXk\r\ne+Ki1xB5ljGWrnuxX/JVB40NOHdUGFmUg/R8Lf+AR8/Et9uBWpHuedJ2jUYV\r\nwtHHXVUU3++pslFYY/0mQgW8so5Yejp8WdubatBEKBaGAp+s8gKmpM2j+xuX\r\nxjwchRD4nn47Ck1TKmvIdKPNrZRbyFZL2wyCmr/mfWCKaA/fb4t8o0MeAWji\r\nmQUH7a4UKxsJRfS/ovWSx4QCx4dNrZlGs42rbcMCJcgHlPVoFO6N/j0m/rAc\r\nhzOQ1hk4NHIl0c4wYY2B4EBjer9aqInY+X49DmqtvU5p9aWNjeQW7W9gaIK+\r\nCA/ioZUpLHXVmTTuVqGGf+A5KZjrJxOmOVQ0Rt7TU7w41zH2aChq1k14hVU1\r\nSn8dyPQS81RcZ1NUkHr3+/WI8uvsVZhLWAU+7obfuV2Plf58QHJeRDpGG2J5\r\nm2wHfCc48ScsDe+OtijQ4aUlvEpLK7RcnlGTRB2mWZ8DyHv9ZgA3+vwQBITe\r\nDmRWJV3NY7RMi5lXYygkH63ntvcuTd32UgM=\r\n=z9K/\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGOXUBDTQHESKRxpY3b7loKuspjajt9F5qfOnrgR8wD+AiEAm0CoJzDjMHbLHKzTMbwPprpTfTVdZ+JJzN2Hukd1VtM="}]},"_npmUser":{"name":"amollo","email":"amolloui@gmail.com"},"directories":{},"maintainers":[{"name":"amollo","email":"amolloui@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/components-override_1.0.0_1646391136209_0.9605197196347075"},"_hasShrinkwrap":false},"1.0.1":{"name":"@amollo-kit/components-override","scopeCommitName":"h:covr","version":"1.0.1","license":"MIT","description":"Reusable react components with the overrides pattern","author":{"name":"amollo-ui","email":"amolloui@gmail.com"},"keywords":["amollo","override","components-override","react-override"],"main":"build/main/index.js","module":"build/module/index.js","types":"build/module/index.d.ts","publishConfig":{"access":"public"},"homepage":"https://github.com/amollo-ui/amollo-kit/tree/master/packages/@helpers/components-override#readme","bugs":{"url":"https://github.com/amollo-ui/amollo-kit/issues"},"repository":{"type":"git","url":"git+ssh://git@github.com/amollo-ui/amollo-kit.git"},"scripts":{"build":"rimraf build && run-p build:main build:module","build:main":"tsc -p tsconfig.json","build:module":"tsc -p tsconfig.json --target 'esnext' --outDir 'build/module' --module esnext","watch:build":"tsc -p tsconfig.json --incremental --inlineSourceMap -w","prepublishOnly":"run-s fix lint build","_________________________ lint _________________________":"______","lint:js":"eslint \"lib/**/*.{ts,tsx}\"","fix:js":"yarn lint:js --fix","lint":"run-s lint:js tsc:check","fix":"yarn fix:js","tsc:check":"tsc -v && tsc --noEmit"},"peerDependencies":{"react":">=16.x"},"devDependencies":{"@amollo-lint/eslint-config-ts-prettier":"^0.1.2","@types/react":"^17.0.39","eslint":"^8.10.0","npm-run-all":"^4.1.5","prettier":"^2.7.1","rimraf":"^3.0.2","tsdx":"^0.14.1","typescript":"4.5.5"},"gitHead":"58230280f2734a0a33a35d3a9cafa2a37f162025","_id":"@amollo-kit/components-override@1.0.1","_nodeVersion":"16.13.2","_npmVersion":"8.1.2","dist":{"integrity":"sha512-cg4BsbsGB0KuMtx3iGIu4UKR5QZdse0jysHPJQy+dstRm/BH8K0C0NVSLgu50jPUV95Q5iTq+i5PJz6bFmokpg==","shasum":"930af8418e6f6ee3075569c4c70e44511d48d655","tarball":"https://registry.npmjs.org/@amollo-kit/components-override/-/components-override-1.0.1.tgz","fileCount":3,"unpackedSize":5167,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIF11GscdYZaFsAjFza2Z2L2CehbeUgfp1FAhWkEcgrnQAiEA8Oj0qGGnNCammckzAOorQgZzN8l1gxahA72f1aljuTs="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjfseJACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqKDg//UovUer08nW9mzHNPxZ0B9rGGKZjXXE0aiG/F+JmlPWD1Ew6E\r\n2ShZ0Ib+/xBQ1IBL7wj2KJvwJwCcCnVzG4CLL/JIzjMviwjWJBpFGLbRdXEH\r\ncQ59v4awrLYLRfO+SZA9wlM/f7VeDWxu3XWgSfDcIXZW2qyNcaIJwerb2M1h\r\nkCWIirMFp65cuDNnsn5ZANjbnIexXc2YLi+ic8Ax0JeQipgC5FkvvFXb6oup\r\nLFixYJy2Ijw2WT+8Rm8SZ4JwDAMvEldOssln0xpuH8tw1Edu+MyIlgCH3OF4\r\nKY08QSoc74dz6B2Cctx5BE6VVyW/TcHmbKiBFeTCmjrMcBL6crm35j8cIZRY\r\negvgT0fVYcIvvSfl+B9z71/cOkxf2E7KDBXNGYLugdepWWOXtLkWk1oQ57VF\r\njpBmvM8RMAcyB7HcNWhIdcpvCIYPhHPQ1qiVZmjhSfh4Qf3o/aiTM6d0ktC7\r\nOkX38Tux7WCmyKh7Hh4V9xWp7Xo8aaOUMX/U1NfeU93X5kvdctmOYTDwoROj\r\nurfUu5/8YTd5//QlEZMRwPSZXDnFp3lmJKyLJS46vqmwHU6idYzGzvteQvkm\r\nGwj4O6XDpTjfLe0s59rd5HQX0HRBvIeJWKtaC8tcc9HZsVPSxClKsoF2ahNt\r\nGwhOq2cUsOBZNAdo8h9gydv/9LZVmvTVkwA=\r\n=VMYN\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"amollo","email":"amolloui@gmail.com"},"directories":{},"maintainers":[{"name":"amollo","email":"amolloui@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/components-override_1.0.1_1669253001677_0.9878184698808288"},"_hasShrinkwrap":false},"1.0.2":{"name":"@amollo-kit/components-override","scopeCommitName":"h:covr","version":"1.0.2","license":"MIT","description":"Reusable react components with the overrides pattern","author":{"name":"amollo-ui","email":"amolloui@gmail.com"},"keywords":["amollo","override","components-override","react-override"],"main":"build/main/index.js","module":"build/module/index.js","types":"build/module/index.d.ts","publishConfig":{"access":"public"},"homepage":"https://github.com/amollo-ui/amollo-kit/tree/master/packages/@helpers/components-override#readme","bugs":{"url":"https://github.com/amollo-ui/amollo-kit/issues"},"repository":{"type":"git","url":"git+ssh://git@github.com/amollo-ui/amollo-kit.git"},"scripts":{"build":"rimraf build && run-p build:main build:module","build:main":"tsc -p tsconfig.json","build:module":"tsc -p tsconfig.json --target 'esnext' --outDir 'build/module' --module esnext","watch:build":"tsc -p tsconfig.json --incremental --inlineSourceMap -w","prepublishOnly":"run-s fix lint build","_________________________ lint _________________________":"______","lint:js":"eslint \"lib/**/*.{ts,tsx}\"","fix:js":"yarn lint:js --fix","lint":"run-s lint:js tsc:check","fix":"yarn fix:js","tsc:check":"tsc -v && tsc --noEmit"},"peerDependencies":{"react":">=16.x"},"devDependencies":{"@amollo-lint/eslint-config-ts-prettier":"^0.1.2","@types/react":"^17.0.39","eslint":"^8.10.0","npm-run-all":"^4.1.5","prettier":"^2.7.1","rimraf":"^3.0.2","tsdx":"^0.14.1","typescript":"4.5.5"},"gitHead":"c6aeb7181e0ae19d406d7b076bd6b27be8e09467","_id":"@amollo-kit/components-override@1.0.2","_nodeVersion":"16.13.2","_npmVersion":"8.1.2","dist":{"integrity":"sha512-SpzBwZr3tSEeYlpH20jZeTt+s95tqjodxAVjv4WgP/xY9m9SV8i4s5QFj/m4rAAgMIhXs9ME6U3Xg2pjkY4d3g==","shasum":"15379b40d643f758b4e58801893935982f6bb7e5","tarball":"https://registry.npmjs.org/@amollo-kit/components-override/-/components-override-1.0.2.tgz","fileCount":15,"unpackedSize":13190,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC6L28lEoyzbz/5SS+sa0ZfiT4xRI8mMAnMCI2qqewEQgIhAPnii92RLfkba8mm8d5xwfyagGdE+zvXMgm/HcJArBJY"}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjfsnyACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr0Ww/8DJxeF3fVs4eI04O88HnRW+jE4ZsbJO0aL8imjHuJYPRzOp3Q\r\nTBxn6deeS3VEXdwZEc0RbCVzvrFVQxZnQ3dunXDFjJGcpX/1V0dQhDoGPL18\r\nbzO9/KXP9+lTc23Wb3YkbLQL2ybtWXed7nxBlU0wBHEFdJuoZ5Vupv1TVJAv\r\nTX3Sr3XFyp3l5aAR/KdINN+ZguC4TlxSnsBLM4mqjuDSAkzxeSv+sn35hnIB\r\nYw9bZerCqWeNLH4OLAqIJDcJeSV55P02NKAdo8e7vQnoAycmrDtTdL6wjg0R\r\noQrFI1M3LTuUsUHsaMhugjyA2u9xteCbnwQF+viLvd26woaB8L9hZYPexkLA\r\nsCsUWpc5YELqm6YOtYbu99Aznj/JionqsAXzPRQjYj22ujJAvbRkEP1+mrTe\r\ncRvimytrYAG8tYHteXFqkQGtT5TAlQ5DQidqJ2OFI5vQNoClzqXlzdenCI3E\r\nIbw5HX/Wr4SuT3iQUqJy4hfYS8RS2QIaOLhzB20s6ciTmw1uF7nrynpi2973\r\nMZC7DFnjvVG5mcGiB9skCEiHhJ1lJdn/VyzSYYVg3EOgCoJEmvhqqicD+vpu\r\nmfT1+3HSmSlXExTRoY9XQmqW1mBxY+Go48uTtB/X0EKk1Bzue/VRjo/XRbiN\r\nOHWqau62fxPPbIgLel07KJgUwqnJYkCM/D4=\r\n=yvNh\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"amollo","email":"amolloui@gmail.com"},"directories":{},"maintainers":[{"name":"amollo","email":"amolloui@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/components-override_1.0.2_1669253618182_0.2871615663688609"},"_hasShrinkwrap":false}},"time":{"created":"2022-03-04T08:53:16.873Z","0.1.0":"2022-03-04T08:53:17.082Z","modified":"2022-11-24T01:33:38.471Z","1.0.0":"2022-03-04T10:52:16.345Z","1.0.1":"2022-11-24T01:23:21.835Z","1.0.2":"2022-11-24T01:33:38.376Z"},"maintainers":[{"name":"amollo","email":"amolloui@gmail.com"}],"homepage":"https://github.com/amollo-ui/amollo-kit/tree/master/packages/@helpers/components-override#readme","keywords":["amollo","override","components-override","react-override"],"repository":{"type":"git","url":"git+ssh://git@github.com/amollo-ui/amollo-kit.git"},"author":{"name":"amollo-ui","email":"amolloui@gmail.com"},"bugs":{"url":"https://github.com/amollo-ui/amollo-kit/issues"},"license":"MIT","readme":"# components-override\n\n[![MIT License][license-image]][LICENSE]\n[![npm version][npm-img]][npm]\n\n> Reusable react components with the overrides pattern\n\nThe template for use in react components was implemented from an article by [David Schnurr](https://dschnurr.medium.com/better-reusable-react-components-with-the-overrides-pattern-9eca2339f646). For good experience, use it with typescript.\n\n## Installation\n- **npm**\n\n```\nnpm install @amollo-kit/components-override\n```\n\n- **yarn**\n\n```\nyarn add @amollo-kit/components-override\n```\n\n## Criteria requirement\n\n- Typescript can recognize types by default.\n- If a component is passed, then the parameter typing should be for the parameters of this component.\n- Don't skip more components not requiring the component to be overridden\n- The overridden component must be [generic](https://medium.com/edonec/creating-a-generic-component-with-react-typescript-2c17f8c4386e)\n\n## Usage\nReusable component:\n```tsx\nimport type { Override } from \"@amollo-kit/components-override\";\nimport { getComponentsWithOverride } from \"@amollo-kit/components-override\";\nimport * as defaultComponents from \"./components\";\n\ntype DefaultComponentsType = typeof defaultComponents;\n\nexport interface BoxInputProps<T extends Record<string, unknown>> {\n    overrides: Override<T, DefaultComponentsType>;\n}\n\n/**\n * @description must be a generic component\n */\nconst BoxInput = <T extends Record<string, unknown>>({\n    overrides,\n}: BoxInputProps<T>) => {\n    ....\n\n    const {\n        Root: { component: Root, props: rootProps },\n        Input: { component: Input, props: inputProps },\n    } = getComponentsWithOverride<DefaultComponentsType, T>(defaultComponents, overrides);\n\n    return (\n        <Root {...sharedProps} {...rootProps}>\n            <Input\n                type=\"text\"\n                value={query}\n                onChange={onInputChange}\n                {...sharedProps}\n                {...inputProps}\n            />\n        </Root>\n    );\n};\n\nexport default BoxInput;\n```\n\nComponent call:\n```tsx\n    <BoxInput\n        overrides={{\n            Root: {\n                props: { \"aria-label\": \"Select an option\" },\n            },\n            Input: {\n                component: TextField,\n                props: {\n                    type: \"text\",\n                    draggable: true,\n                },\n            }\n        }}\n    />\n```\n\n[license-image]: https://img.shields.io/npm/l/format-message.svg\n[LICENSE]: https://github.com/format-message/format-message/blob/master/LICENSE-MIT\n[npm-img]: https://img.shields.io/npm/v/@amollo-kit/components-override.svg?style=flat\n[npm]: https://www.npmjs.com/package/@amollo-kit/components-override\n","readmeFilename":"README.md","description":"Reusable react components with the overrides pattern"}