{"_id":"@duetds/stencil-react-output-target-next","_rev":"9-ad375555eba47bd47d78d39d45aee3be","name":"@duetds/stencil-react-output-target-next","dist-tags":{"latest":"1.0.3"},"versions":{"1.0.1":{"name":"@duetds/stencil-react-output-target-next","version":"1.0.1","author":{"name":"Ionic Team"},"license":"MIT","_id":"@duetds/stencil-react-output-target-next@1.0.1","maintainers":[{"name":"lennu","email":"lennunet@gmail.com"},{"name":"lahitapiola","email":"duetdesignsystem@lahitapiola.fi"},{"name":"klhdk","email":"klh@threads.dk"}],"homepage":"https://stenciljs.com/","bugs":{"url":"https://github.com/ionic-team/stencil-ds-output-targets/issues"},"dist":{"shasum":"06552ec7d08f803851409a9c0e5a90098ca7c8bb","tarball":"https://registry.npmjs.org/@duetds/stencil-react-output-target-next/-/stencil-react-output-target-next-1.0.1.tgz","fileCount":22,"integrity":"sha512-KzNAD6Y/aehgkEApGIf+11K/Bt3LfRa8VvPH+hLUfvA0sQZL9tCz408rsRxE0kdnyxERlLaCTjhkzGyhly061Q==","signatures":[{"sig":"MEUCIC4wKWyMp7UzpzRJyqhD0ztcb2GLDFzU5zkRTqzoWUmYAiEAsk+IPyEtQNdQsrL27UT/m3NhihgsP9m3X9iCtNdX5nM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":73825,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjEJRBACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrsQhAAkHppvla5AHneawGBel3hAaNFt7Nl7RBxn3g62OQ0jmnguy7d\r\nYTLd408wtC7LhrXZXtentlplntXdEIgcvDxWIco8hfV68J40U0d8/cafyr9a\r\np56vKjPU35ZA/roJS+GLJDNUMz1c2z6iN+Buh57m+MmufiypkQBx0zb2xuht\r\nSWmBvnksdQsOeLqim27oUC10mQaVHnh1Jqo9s9gGDDHKDqra8G7U2iLmHMmV\r\n60bChogOiMIkbLzpGNXgHG52SpIwlwTM5BjfBMkf3GhmEERMeYSRSNYDW27F\r\neum4sGR/KGopX79P77x2SxGrVvh0F44q5VpiiptdHikCBF8jcQ5VGuXOuYPY\r\nHAgT8/9AKFZRN9bhuEq1EPoh4ZBso1k3C6xGjExegPZQ+f0OmfLeczojU4wR\r\njtHhbNpiumpnYjkptCpRE75AgBo4R+GXsy7sNQtQ07DwSVhmvuhv3zesajRN\r\nBFMHUf1CVbfP37hPjhh6fnfuKK81J+mGP5I6ATAF+DXRXrml9Rhrdw26w6Yf\r\nD98wegXYZ3MPC3UG7rBOG52dM/YRNcCYskadqgthIgOFgRRYrIAk87LMie5A\r\nTZYMocSx4z5AHXWgNFuiDKDFleskjbxsxhdsP/FkM88elMIMJEze+55r7qCe\r\n3LhMkOqSXijhubhtsDupnI6m4/xC0zA4vMc=\r\n=gbn3\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testURL":"http://localhost","testRegex":"(\\.(test|spec))\\.(ts?|tsx?|jsx?)$","transform":{"^.+\\.(js|ts|tsx)$":"<rootDir>/test/jest.preprocessor.js"},"moduleFileExtensions":["ts","tsx","js","json","jsx"]},"main":"dist/index.cjs.js","types":"dist/index.d.ts","module":"dist/index.js","gitHead":"4d95f3268cebc764aa527b7255f376cefdb1f50f","scripts":{"test":"jest","build":"tsc && npm run rollup","watch":"tsc --watch","rollup":"rollup -c","release":"np","version":"npm run build","prebuild":"rimraf ./dist","prepublishOnly":"npm run build"},"_npmUser":{"name":"klhdk","email":"klh@threads.dk"},"repository":{"url":"git+https://github.com/ionic-team/stencil-ds-output-targets.git","type":"git"},"_npmVersion":"lerna/5.5.0/node@v18.8.0+arm64 (darwin)","description":"React output target for @stencil/core components.","directories":{},"_nodeVersion":"18.8.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"react":"^18.0.0","react-dom":"^18.0.18","@types/react":"18.0.18","@types/react-dom":"18.0.6","@testing-library/react":"13.3.0"},"peerDependencies":{"@stencil/core":"2.17.4"},"_npmOperationalInternal":{"tmp":"tmp/stencil-react-output-target-next_1.0.1_1662030913211_0.35357084847247977","host":"s3://npm-registry-packages"}},"1.0.2":{"name":"@duetds/stencil-react-output-target-next","version":"1.0.2","author":{"name":"Ionic Team"},"license":"MIT","_id":"@duetds/stencil-react-output-target-next@1.0.2","maintainers":[{"name":"lennu","email":"lennunet@gmail.com"},{"name":"lahitapiola","email":"duetdesignsystem@lahitapiola.fi"},{"name":"klhdk","email":"klh@threads.dk"}],"homepage":"https://stenciljs.com/","bugs":{"url":"https://github.com/ionic-team/stencil-ds-output-targets/issues"},"dist":{"shasum":"8f8d7751a2ebff1db12dce9860cfc1d33838cdb2","tarball":"https://registry.npmjs.org/@duetds/stencil-react-output-target-next/-/stencil-react-output-target-next-1.0.2.tgz","fileCount":22,"integrity":"sha512-LVjKuTls8FW6ptZoA7muwGP+/RQbX/jfIz5aL8gRZEaVbt1Gq/MrhJOYAB9dktZO071pqZLIxWkkSpXysd7rDA==","signatures":[{"sig":"MEQCICK3NkeiGbOoyvcOr11mKzAwxA41NWIoxs64LPT1QNAcAiAZ1a/MTxel1qIujwJ8vnPe6yc+me7S52EWjlODxIZ8CA==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":73825,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjEJsPACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr1pA/+InKfNHmic7cr7uBPNz+ai0buHYFqcvJdBEsOSwV40g4h5SlN\r\no5/QKtd+7pzJ2Uo2+bpTWeikj1CIIQNeG6JgEAAi+FUZ409SaRVdVGGwUr5p\r\nrq7AOoBUsEDsRpjphf1kGsszkvBZW51VoDkoTANqAWXXOpER8vTd5GPUb5ne\r\nzcuwSJbkcwKPe/dN5gulpHHwOFT2JbQkl78kybiM0Q76EK9Bbw1IeW8QUOQS\r\n5Nyi7EZJ2oSveUA7Sj/WemgT4Pl2/JcKGIzBKLJhiL5D3BEPBlAgY0xhFow1\r\nXOikriyq9j9T2KCsLWPX2yWnqW83PN1KOAjxJsJ2CIztKXA/n8MU7tAUattR\r\nC440bymtttHIbCtKNQIEhW/nurcwZqwbP97oIEulpM8TMlWjb2XimJXmoPvJ\r\nGf/uE7kQ0Gm1t8ES5thJ9jH1S+xlwdAyrPrC07n9nIANALACOM2evl0dUwyU\r\nUVs38tUoXJjsTpcguomkOAgl8Ms32fFOPBIkDM4OwKhxwygTswMBbVesVGo7\r\nnSCn3EPMHuQK7rWSWS53IQcztv7v9YNyy0YWcZs1qyQQDWg18v6xHkmewFav\r\nekZy9Cw8RpTwevWcLgU+kQ663zM3ftLHKBga4m+QjKVRCIg/sY3ajQvVERFK\r\nqi/+pL6teKJ2scQ34q+0bTPTJ7QyUxNR7fg=\r\n=/JFf\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testURL":"http://localhost","testRegex":"(\\.(test|spec))\\.(ts?|tsx?|jsx?)$","transform":{"^.+\\.(js|ts|tsx)$":"<rootDir>/test/jest.preprocessor.js"},"moduleFileExtensions":["ts","tsx","js","json","jsx"]},"main":"dist/index.cjs.js","types":"dist/index.d.ts","module":"dist/index.js","gitHead":"a3588e905186a0e86e7f88418fd5b2f9531b55e0","scripts":{"test":"jest","build":"tsc && npm run rollup","watch":"tsc --watch","rollup":"rollup -c","release":"np","version":"npm run build","prebuild":"rimraf ./dist","prepublishOnly":"npm run build"},"_npmUser":{"name":"klhdk","email":"klh@threads.dk"},"repository":{"url":"git+https://github.com/ionic-team/stencil-ds-output-targets.git","type":"git"},"_npmVersion":"8.18.0","description":"React output target for @stencil/core components.","directories":{},"_nodeVersion":"18.8.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"react":"^18.0.0","react-dom":"^18.0.18","@types/react":"18.0.18","@types/react-dom":"18.0.6","@testing-library/react":"13.3.0"},"peerDependencies":{"@stencil/core":"2.17.4"},"_npmOperationalInternal":{"tmp":"tmp/stencil-react-output-target-next_1.0.2_1662032655717_0.7317703357280494","host":"s3://npm-registry-packages"}},"1.0.3":{"name":"@duetds/stencil-react-output-target-next","version":"1.0.3","author":{"name":"Ionic Team"},"license":"MIT","_id":"@duetds/stencil-react-output-target-next@1.0.3","maintainers":[{"name":"lennu","email":"lennunet@gmail.com"},{"name":"lahitapiola","email":"duetdesignsystem@lahitapiola.fi"},{"name":"klhdk","email":"klh@threads.dk"}],"homepage":"https://stenciljs.com/","bugs":{"url":"https://github.com/ionic-team/stencil-ds-output-targets/issues"},"dist":{"shasum":"4036feb882ee73879f5c4b6321e3fb3bcb6a2121","tarball":"https://registry.npmjs.org/@duetds/stencil-react-output-target-next/-/stencil-react-output-target-next-1.0.3.tgz","fileCount":22,"integrity":"sha512-e/zap8cZ8hMwehdRvG3cTd4k6NRDmhJMM5G0O0N9cDO5x1sPyDUl0LXb/9EemYWmD8iQD76SZsrDqiE38glxrQ==","signatures":[{"sig":"MEUCIQDUkSb50kgvp4p+SrHVBNVDdC7JaNH1GoBJna1w5ms8AgIgKKxvBNdPLmIQX5ZK0Rh5qCE3PRTtOReeh9r01VnTbPM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":73815,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjEJvIACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqXZA//WwIhJRoueZoiRDFc1oeKhh+5feoMIwVFekFPXNqGEPgn5/yT\r\nnlVb1o7JdVi5xvmrU60jqfBSv3yKal6tMwMdZO6jkNW3Tuh7iltcLQVaFTUo\r\n+hSgotr42KCwurXCXr5hMF05ziyY3nfI99l/xJ8hUkjApi02hB8PQ9ZsZQPj\r\nGlpOZLuzndplAf6NUxS0xGwG/CSZNhWh/cVBYfIS9WcZD3M2gNBhm36s/kPn\r\nnDmv/gUqEjyj9bcoJ50fBymNse6usxXLeQSLQ2CLPjiWfHkuB9ICNZg3V2CF\r\nr1yLmebscgYvyyq5NjX8sPga9lkKP3Z6ADSAer+fUfyqivgDdecKdi+FGq7W\r\nDbp57Vd4wCr69FMYxC0/0TMoNdcr/1yofgceY2rt/ydhauJ3stjm22G3uknk\r\nryH71f0wXEEdOM0V8wCa7dJtDRSnjkrUbuPWMBbubyKnqz2zM2YjIqN9abbi\r\nCCAuCWfmMG8NTQDObJ6jMRm3AFuuPqrYHbtZBNNA4ZBnYT4NXucL7wBpRvsj\r\nljthDQ6fHSctMJDkWbLklybt7/617TQXBH8iDDQ/rdGUcP7e10DxjK/64RCp\r\ncpbVvCh3RoL+4TZQGCqo8ZuKujZfw6GXgQeiX9Wqxj+Z1M2YsFi9wg7bPZaq\r\nEBVWNbYZLXeJuRZuOg39GUBhtgJizV6vxEM=\r\n=HvvM\r\n-----END PGP SIGNATURE-----\r\n"},"jest":{"testURL":"http://localhost","testRegex":"(\\.(test|spec))\\.(ts?|tsx?|jsx?)$","transform":{"^.+\\.(js|ts|tsx)$":"<rootDir>/test/jest.preprocessor.js"},"moduleFileExtensions":["ts","tsx","js","json","jsx"]},"main":"dist/index.cjs.js","types":"dist/index.d.ts","module":"dist/index.js","gitHead":"a3588e905186a0e86e7f88418fd5b2f9531b55e0","scripts":{"test":"jest","build":"tsc && npm run rollup","watch":"tsc --watch","rollup":"rollup -c","release":"np","version":"npm run build","prebuild":"rimraf ./dist","prepublishOnly":"npm run build"},"_npmUser":{"name":"klhdk","email":"klh@threads.dk"},"repository":{"url":"git+https://github.com/ionic-team/stencil-ds-output-targets.git","type":"git"},"_npmVersion":"8.18.0","description":"React output target for @stencil/core components.","directories":{},"_nodeVersion":"18.8.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"react":"^18.0.0","react-dom":"^18.0.18","@types/react":"18.0.18","@types/react-dom":"18.0.6","@testing-library/react":"13.3.0"},"peerDependencies":{"@stencil/core":"2.17.4"},"_npmOperationalInternal":{"tmp":"tmp/stencil-react-output-target-next_1.0.3_1662032840257_0.5161259050134097","host":"s3://npm-registry-packages"}}},"time":{"created":"2022-09-01T11:15:13.147Z","modified":"2025-09-03T11:24:56.316Z","1.0.1":"2022-09-01T11:15:13.416Z","1.0.2":"2022-09-01T11:44:15.937Z","1.0.3":"2022-09-01T11:47:20.405Z"},"bugs":{"url":"https://github.com/ionic-team/stencil-ds-output-targets/issues"},"author":{"name":"Ionic Team"},"license":"MIT","homepage":"https://stenciljs.com/","repository":{"url":"git+https://github.com/ionic-team/stencil-ds-output-targets.git","type":"git"},"description":"React output target for @stencil/core components.","maintainers":[{"email":"duetdesignsystem@lahitapiola.fi","name":"lahitapiola"},{"email":"lennunet@gmail.com","name":"lennu"},{"email":"kasimir.pihlasviita@dka.io","name":"kasimir-dka"},{"email":"ere@mannisto.io","name":"eremannisto"},{"email":"leo.jappinen@dka.io","name":"leodka"}],"readme":"# @stencil/react-output-target\n\nStencil can generate React class component wrappers for your web components. This allows your Stencil components to be used within a React application. The benefits of using Stencil's component wrappers over the standard web components include:\n\n- Typings for your components\n- JSX bindings for custom events (event names are renamed to match React's convention of `onEventName`)\n- Tag names are renamed to match PascalCase convention.\n- Adds support for property types outside of string and number (supports: functions, objects and arrays).\n\nFor a detailed guide on how to add the react output target to a project, visit: https://stenciljs.com/docs/react.\n\n## Installation\n\n```bash\nnpm install @stencil/react-output-target\n```\n\n## Usage\n\nIn your `stencil.config.ts` add the following configuration to the `outputTargets` section:\n\n```ts\nimport { Config } from '@stencil/core';\nimport { reactOutputTarget } from '@stencil/react-output-target';\n\nexport const config: Config = {\n  namespace: 'demo',\n  outputTargets: [\n    reactOutputTarget({\n      componentCorePackage: 'example-component-library',\n      proxiesFile: '../component-library-react/src/components.ts',\n    }),\n    {\n      type: 'dist',\n      esmLoaderPath: '../loader',\n    },\n  ],\n};\n```\n\n## Config Options\n\n| Property                      | Description                                                                                                                                                                                                                                                                                                                      |\n| ----------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n| `componentCorePackage`        | The NPM package name of your Stencil component library. This package is used as a dependency for your React wrappers.                                                                                                                                                                                                            |\n| `proxiesFile`                 | The output file of all the component wrappers generated by the output target. This file path should point to a location within your React library/project.                                                                                                                                                                       |\n| `excludeComponents`           | An array of tag names to exclude from generating component wrappers for. This is helpful when have a custom framework implementation of a specific component or need to extend the base component wrapper behavior.                                                                                                              |\n| `loaderDir`                   | This is the path to where the `defineCustomElements` function exists in your built project. If `loaderDir` is not provided, the `/dist/loader` directory will be used.                                                                                                                                                           |\n| `includePolyfills`            | If `true`, polyfills will automatically be imported and the `applyPolyfills` function will be called in your proxies file. This can only be used when lazy loading Web Components and will not work when `includeImportCustomElements` is `true`.                                                                                |\n| `includeDefineCustomElements` | If `true`, all Web Components will automatically be registered with the Custom Elements Registry. This can only be used when lazy loading Web Components and will not work when `includeImportCustomElements` is `true`.                                                                                                         |\n| `includeImportCustomElements` | If `true`, the output target will import the custom element instance and register it with the Custom Elements Registry when the component is imported inside of a user's app. This can only be used with the [Custom Elements Bundle](https://stenciljs.com/docs/custom-elements) and will not work with lazy loaded components. |\n| `customElementsDir`           | This is the directory where the custom elements are imported from when using the [Custom Elements Bundle](https://stenciljs.com/docs/custom-elements). Defaults to the `components` directory. Only applies when `includeImportCustomElements` is `true`.                                                                        |\n","readmeFilename":"README.md"}