{"_id":"@remix-run/ui-hmr","_rev":"3-b7f380427ef5933624d01116aca2718c","name":"@remix-run/ui-hmr","dist-tags":{"latest":"0.1.1"},"versions":{"0.0.0":{"name":"@remix-run/ui-hmr","version":"0.0.0","license":"MIT","_id":"@remix-run/ui-hmr@0.0.0","maintainers":[{"name":"mjackson","email":"mjijackson+npm@gmail.com"}],"homepage":"https://github.com/remix-run/remix#readme","bugs":{"url":"https://github.com/remix-run/remix/issues"},"dist":{"shasum":"2913be5389fdd1ba2acbf93ef1fd3850f0e064d9","tarball":"https://registry.npmjs.org/@remix-run/ui-hmr/-/ui-hmr-0.0.0.tgz","fileCount":2,"integrity":"sha512-0Leo9CeEVfwS75U6Flp/wr6uAabHgnlLSuvOwl9CSeRIglhztLDh38QWlJj0RVqYXD8p1bITncTFFIqpAh+7kw==","signatures":[{"sig":"MEQCIHpZ3+r/SdxB6YK/9vTMyWmLU6+3Ad42M9INm9QBxkJKAiAwm/qzSyDlsh+L1f9s5xO2LuqDUth+Wtcn75Rkyi+3yQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":461},"_npmUser":{"name":"mjackson","email":"mjijackson+npm@gmail.com"},"repository":{"url":"git+https://github.com/remix-run/remix.git","type":"git","directory":"packages/ui-hmr"},"_npmVersion":"12.0.2","description":"Placeholder package for Remix CI/OIDC setup","directories":{},"_nodeVersion":"24.15.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/ui-hmr_0.0.0_1786666282802_0.473626240926011","host":"s3://npm-registry-packages-npm-production"}},"0.1.0":{"name":"@remix-run/ui-hmr","version":"0.1.0","keywords":["remix","component","hmr","transform","ui"],"author":{"name":"Michael Jackson","email":"mjijackson@gmail.com"},"license":"MIT","_id":"@remix-run/ui-hmr@0.1.0","maintainers":[{"name":"mjackson","email":"mjijackson+npm@gmail.com"}],"homepage":"https://github.com/remix-run/remix/tree/main/packages/ui-hmr#readme","bugs":{"url":"https://github.com/remix-run/remix/issues"},"dist":{"shasum":"07f80ce2a4a8fc655962ce12dc1a701a172e4656","tarball":"https://registry.npmjs.org/@remix-run/ui-hmr/-/ui-hmr-0.1.0.tgz","fileCount":39,"integrity":"sha512-9hV0iNWBSjCmrA6b9/8uG7qWSHPXyy5XuIzfMayIH661YfmKuBFchkOIiTenadaI4g7ZxCBT+igh/HtRvyxS4Q==","signatures":[{"sig":"MEUCIQDgxOWjZNYhVHACbhXUC0cHr6cJM+xkbaZwdwSIGkyBJAIgK3xCzJNOPAARLDL5gckBZhGR7ZCjIyOXf2AP4AUvt5A=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@remix-run%2fui-hmr@0.1.0","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":133984},"type":"module","_from":"file:remix-run-ui-hmr-0.1.0.tgz","exports":{".":{"types":"./dist/index.d.ts","default":"./dist/index.js"},"./node":{"types":"./dist/node.d.ts","default":"./dist/node.js"},"./assets":{"types":"./dist/assets.d.ts","default":"./dist/assets.js"},"./package.json":"./package.json","./runtime/server":{"types":"./dist/runtime/server.d.ts","default":"./dist/runtime/server.js"},"./runtime/browser":{"types":"./dist/runtime/browser.d.ts","default":"./dist/runtime/browser.js"}},"scripts":{"test":"remix test","build":"tsc -p tsconfig.build.json","clean":"git clean -fdX","typecheck":"tsc --noEmit"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:9290efed-39a1-4e81-9917-c9c557bd2736"}},"_resolved":"/tmp/df56dc3cc6f64ac40021d1794975d14d/remix-run-ui-hmr-0.1.0.tgz","_integrity":"sha512-9hV0iNWBSjCmrA6b9/8uG7qWSHPXyy5XuIzfMayIH661YfmKuBFchkOIiTenadaI4g7ZxCBT+igh/HtRvyxS4Q==","repository":{"url":"git+https://github.com/remix-run/remix.git","type":"git","directory":"packages/ui-hmr"},"_npmVersion":"11.16.0","description":"Hot module replacement runtime and transforms for Remix UI components","directories":{},"_nodeVersion":"24.18.0","dependencies":{"oxc-parser":"^0.121.0","magic-string":"^0.30.21","source-map-js":"^1.2.1"},"_hasShrinkwrap":false,"devDependencies":{"chokidar":"^5.0.0","typescript":"^7.0.2","@types/node":"^24.6.0","@remix-run/ui":"0.5.0","@remix-run/test":"0.6.0","@remix-run/assert":"0.3.0","@remix-run/assets":"^0.5.0","@remix-run/node-hmr":"^0.1.0","@remix-run/node-tsx":"^0.1.1","@types/dom-navigation":"^1.0.7","@remix-run/fetch-proxy":"0.8.5","@remix-run/node-fetch-server":"0.14.1"},"_npmOperationalInternal":{"tmp":"tmp/ui-hmr_0.1.0_1786668503603_0.5739117350312568","host":"s3://npm-registry-packages-npm-production"}},"0.1.1":{"_id":"@remix-run/ui-hmr@0.1.1","bugs":{"url":"https://github.com/remix-run/remix/issues"},"dist":{"shasum":"73120424c3502f6843ab6ebb8515194a15cc81c5","tarball":"https://registry.npmjs.org/@remix-run/ui-hmr/-/ui-hmr-0.1.1.tgz","fileCount":39,"integrity":"sha512-uGEn7ghNxg8ip11wiTEuxO0Xdc7L5GSJ6LMMUfYfIpIx81BGmthriGXRZ6K7GrLmXpbQB1ImLe+aS3Isxz10qQ==","signatures":[{"sig":"MEQCIAPB0z6g4Zw2mQSCmohsIhFgJpaCAw7xIDspl2OjdR1fAiAF5KWh/+5qArwSPrSVnT/9QSxFed0WZtVRDIcdBXaRug==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"},{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIF8LxlwN/CsbyQcvaUdxDZZGOPJ2VoTgreR8fs1Irtt8AiEAwKPSKiEdHxD6+8LQjB8jFXM5E8GkzQF6FihnSZ/jQ4Y="}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@remix-run%2fui-hmr@0.1.1","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":137083},"name":"@remix-run/ui-hmr","type":"module","_from":"file:/tmp/remix-publish-ui-hmr-UEw0Eg/remix-run-ui-hmr-0.1.1.tgz","author":{"name":"Michael Jackson","email":"mjijackson@gmail.com"},"exports":{".":{"types":"./dist/index.d.ts","default":"./dist/index.js"},"./node":{"types":"./dist/node.d.ts","default":"./dist/node.js"},"./assets":{"types":"./dist/assets.d.ts","default":"./dist/assets.js"},"./package.json":"./package.json","./runtime/server":{"types":"./dist/runtime/server.d.ts","default":"./dist/runtime/server.js"},"./runtime/browser":{"types":"./dist/runtime/browser.d.ts","default":"./dist/runtime/browser.js"}},"license":"MIT","scripts":{"test":"remix test","build":"tsc -p tsconfig.build.json","clean":"git clean -fdX","typecheck":"tsc --noEmit"},"version":"0.1.1","_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"9290efed-39a1-4e81-9917-c9c557bd2736"}},"homepage":"https://github.com/remix-run/remix/tree/main/packages/ui-hmr#readme","keywords":["remix","component","hmr","transform","ui"],"_resolved":"/tmp/remix-publish-ui-hmr-UEw0Eg/remix-run-ui-hmr-0.1.1.tgz","_integrity":"sha512-uGEn7ghNxg8ip11wiTEuxO0Xdc7L5GSJ6LMMUfYfIpIx81BGmthriGXRZ6K7GrLmXpbQB1ImLe+aS3Isxz10qQ==","repository":{"url":"git+https://github.com/remix-run/remix.git","type":"git","directory":"packages/ui-hmr"},"_npmVersion":"11.19.0","description":"Hot module replacement runtime and transforms for Remix UI components","directories":{},"maintainers":[{"name":"mjackson","email":"mjijackson+npm@gmail.com"}],"sideEffects":["./src/node.ts","./dist/node.js"],"_nodeVersion":"24.21.0","dependencies":{"oxc-parser":"^0.121.0","magic-string":"^0.30.21","source-map-js":"^1.2.1"},"_hasShrinkwrap":false,"devDependencies":{"chokidar":"^5.0.0","playwright":"^1.60.0","typescript":"^7.0.2","@types/node":"^24.6.0","@remix-run/ui":"0.11.0","@remix-run/test":"0.6.2","@remix-run/assert":"0.3.1","@remix-run/assets":"^0.8.0","@remix-run/node-hmr":"^0.2.1","@remix-run/node-tsx":"^0.1.2","@remix-run/response":"^0.3.10","@types/dom-navigation":"^1.0.7","@remix-run/fetch-proxy":"0.9.0","@remix-run/node-fetch-server":"0.14.2"},"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/ui-hmr_0.1.1_1790631776446_0.5378251685767217"}}},"time":{"created":"2026-08-14T00:11:22.561Z","modified":"2026-09-28T21:42:56.936Z","0.0.0":"2026-08-14T00:11:22.936Z","0.1.0":"2026-08-14T00:48:23.760Z","0.1.1":"2026-09-28T21:42:56.543Z"},"bugs":{"url":"https://github.com/remix-run/remix/issues"},"author":{"name":"Michael Jackson","email":"mjijackson@gmail.com"},"license":"MIT","homepage":"https://github.com/remix-run/remix/tree/main/packages/ui-hmr#readme","keywords":["remix","component","hmr","transform","ui"],"repository":{"url":"git+https://github.com/remix-run/remix.git","type":"git","directory":"packages/ui-hmr"},"description":"Hot module replacement runtime and transforms for Remix UI components","maintainers":[{"name":"mjackson","email":"mjijackson+npm@gmail.com"}],"readme":"# ui-hmr\n\nHot module replacement transforms for Remix UI components, with integrations for Node and `remix/assets`.\n\n`ui-hmr` rewrites supported Remix UI component modules so they can use the standard `import.meta.hot` APIs provided by packages like [`assets`](https://github.com/remix-run/remix/tree/main/packages/assets) and [`node-hmr`](https://github.com/remix-run/remix/tree/main/packages/node-hmr).\n\n## Features\n\n- **Stable Components** - Keep component identity stable while swapping implementations\n- **Remount Fallbacks** - Mark components stale when their setup scope changes\n- **Node Module Hooks** - Transform server component modules through Node's module customization hooks API\n- **Assets Loader** - Transform component modules for the browser through `remix/assets`\n\n## Installation\n\n```sh\nnpm i remix\n```\n\n## Usage\n\nUse `remix/ui-hmr/node` as a Node import hook for server modules:\n\n```sh\nnode --import remix/node-tsx --import remix/ui-hmr/node ./server.ts\n```\n\nUse `uiHmr()` from `remix/ui-hmr/assets` with `remix/assets` for browser modules:\n\n```ts\nimport { createAssetServer } from 'remix/assets'\nimport { uiHmr } from 'remix/ui-hmr/assets'\n\nlet isDevelopment = process.env.NODE_ENV === 'development'\n\nlet assetServer = createAssetServer({\n  basePath: '/assets',\n  allowFiles: ['app/routes.ts', 'app/**/public/**'],\n  allowPackages: ['remix'],\n  denyFiles: ['app/**/*.test.*'],\n  hmr: isDevelopment\n    ? {\n        channel: async () => (await import('remix/node-hmr/runtime')).createBrowserHmrChannel(),\n        moduleImporter: 'remix/multiple-import-maps-polyfill',\n      }\n    : undefined,\n  scripts: {\n    loaders: isDevelopment ? [uiHmr()] : undefined,\n  },\n  watch: isDevelopment,\n})\n```\n\nHMR appends mappings for updated modules to the document in additional `<script type=\"importmap\">` elements. The module importer allows browsers without native support for multiple import maps to load these updates.\n\n## Direct Transforms\n\nUse the direct transform APIs when you are writing your own loader, Node module hooks, or build integration.\n\n```ts\nimport { transformComponentsForBrowser } from 'remix/ui-hmr'\n\nlet result = transformComponentsForBrowser(source, {\n  importSource: 'remix',\n  moduleUrl: '/assets/app/routes.tsx',\n})\n\nif (result.transformed) {\n  console.log(result.componentNames)\n}\n```\n\n`transformComponentsForBrowser(source, options)` rewrites browser component modules and emits `import.meta.hot.accept()` code for browser updates. The direct transform uses `importSource` to derive imports for the UI refresh runtime and browser HMR runtime.\n\n```ts\nimport { transformComponentsForServer } from 'remix/ui-hmr'\n\nlet result = transformComponentsForServer(source, {\n  importSource: 'remix',\n  moduleUrl: 'file:///app/routes.tsx',\n})\n```\n\n`transformComponentsForServer(source, options)` rewrites server component modules and registers updated component implementations for the current module URL. The direct transform uses `importSource` to derive imports for the server HMR runtime.\n\nBoth transforms return:\n\n```ts\ntype ComponentsHmrTransformResult = {\n  code: string\n  componentNames: string[]\n  map: string | null\n  transformed: boolean\n}\n```\n\nPass `sourceMap: true` to generate a source map.\n\nUse `importSource` to define where injected imports come from, typically either `remix` or `@remix-run`:\n\n```ts\ntransformComponentsForBrowser(source, {\n  importSource: 'remix',\n  moduleUrl: '/assets/app/routes.tsx',\n})\n\ntransformComponentsForServer(source, {\n  importSource: 'remix',\n  moduleUrl: 'file:///app/routes.tsx',\n})\n```\n\n`importSource: 'remix'` generates imports from `remix/ui` and `remix/ui-hmr`. `importSource: '@remix-run'` generates imports from `@remix-run/ui` and `@remix-run/ui-hmr`. Custom import sources follow the same nested import layout.\n\n## Related Packages\n\n- [`assets`](https://github.com/remix-run/remix/tree/main/packages/assets) - Runs loaders while compiling assets\n- [`node-hmr`](https://github.com/remix-run/remix/tree/main/packages/node-hmr) - Provides the server-side `import.meta.hot` runtime\n- [`ui`](https://github.com/remix-run/remix/tree/main/packages/ui) - Component APIs transformed by `ui-hmr`\n\n## License\n\nSee [LICENSE](https://github.com/remix-run/remix/blob/main/LICENSE)\n","readmeFilename":"README.md"}