{"_id":"@cioky/vike-pandacss","_rev":"3-6543a721311e11a6d36f537287f8b21d","name":"@cioky/vike-pandacss","dist-tags":{"latest":"0.1.2"},"versions":{"0.1.0":{"name":"@cioky/vike-pandacss","version":"0.1.0","keywords":["pandacss","ripple","ripplets","vike"],"license":"MIT","_id":"@cioky/vike-pandacss@0.1.0","maintainers":[{"name":"cioky","email":"vgromania3@gmail.com"}],"homepage":"https://github.com/Opaius/vike-ripple","bugs":{"url":"https://github.com/Opaius/vike-ripple/issues"},"bin":{"vike-pandacss":"src/setup.js"},"dist":{"shasum":"13ef72641fd20f99ab0e8229086838f1268b9f96","tarball":"https://registry.npmjs.org/@cioky/vike-pandacss/-/vike-pandacss-0.1.0.tgz","fileCount":7,"integrity":"sha512-jiyYKXWC0mljC5fzy4UXY7Bv0N85yMvxDSlxgTyD6D4Br7tvUfOEFT01iAuwX1V4NUtvNsf7RZSjXAN48gvveA==","signatures":[{"sig":"MEUCIENRu9KsP5hmvHhZbCm6mPGR5ESj7l/Zc1UEAajl96esAiEAg4ENkjx/AJbNXEFY8TZCvsGqJsbPV1xSGzh1pMaZ5S4=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":10860},"main":"./src/index.js","type":"module","exports":{".":{"types":"./index.d.ts","default":"./src/index.js"},"./panda-plugin":{"types":"./index.d.ts","default":"./src/panda-plugin.js"}},"gitHead":"4010f9128c110f140151fee62c79d7cd34a23bb7","_npmUser":{"name":"cioky","email":"vgromania3@gmail.com"},"repository":{"url":"git+https://github.com/Opaius/vike-ripple.git","type":"git"},"_npmVersion":"11.16.0","description":"Panda CSS integration for Ripple TS — transforms .tsrx for Panda extraction, @apply in <style> blocks","directories":{},"_nodeVersion":"26.1.0","_hasShrinkwrap":false,"peerDependencies":{"@pandacss/dev":">=0.50.0","@ripple-ts/vite-plugin":">=0.3.0"},"_npmOperationalInternal":{"tmp":"tmp/vike-pandacss_0.1.0_1782405907938_0.9379670388660468","host":"s3://npm-registry-packages-npm-production"}},"0.1.1":{"name":"@cioky/vike-pandacss","version":"0.1.1","keywords":["pandacss","ripple","ripplets","vike"],"license":"MIT","_id":"@cioky/vike-pandacss@0.1.1","maintainers":[{"name":"cioky","email":"vgromania3@gmail.com"}],"homepage":"https://github.com/Opaius/vike-ripple","bugs":{"url":"https://github.com/Opaius/vike-ripple/issues"},"bin":{"vike-pandacss":"src/setup.js"},"dist":{"shasum":"2265308de83d857481140e3973d2b65ec7378f0c","tarball":"https://registry.npmjs.org/@cioky/vike-pandacss/-/vike-pandacss-0.1.1.tgz","fileCount":7,"integrity":"sha512-xYvXOWrRLdewEbvL+YkaRJix/MTryIE+bLPJSSbOR+qG0PSQ1PKH0eEeOKcGKjVrpWVa7TmHntJEPKQ6c84g6g==","signatures":[{"sig":"MEUCIG2ubeEneRekyWmInVSAtlAEJWI9udcCwKN3TS6KzEClAiEA3/2pcjYDCKpxw2aa+MGox3buFx+oRw/Wtt4PTMBhh54=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":10855},"main":"./src/index.js","type":"module","exports":{".":{"types":"./index.d.ts","default":"./src/index.js"},"./panda-plugin":{"types":"./index.d.ts","default":"./src/panda-plugin.js"}},"gitHead":"4010f9128c110f140151fee62c79d7cd34a23bb7","_npmUser":{"name":"cioky","email":"vgromania3@gmail.com"},"repository":{"url":"git+https://github.com/Opaius/vike-ripple.git","type":"git"},"_npmVersion":"11.16.0","description":"Panda CSS integration for Ripple TS — transforms .tsrx for Panda extraction, @apply in <style> blocks","directories":{},"_nodeVersion":"26.1.0","_hasShrinkwrap":false,"peerDependencies":{"@pandacss/dev":">=0.50.0","@ripple-ts/vite-plugin":">=0.3.0"},"_npmOperationalInternal":{"tmp":"tmp/vike-pandacss_0.1.1_1782405995621_0.8840858283480426","host":"s3://npm-registry-packages-npm-production"}},"0.1.2":{"name":"@cioky/vike-pandacss","version":"0.1.2","description":"Panda CSS integration for Ripple TS — transforms .tsrx for Panda extraction, @apply in <style> blocks","type":"module","main":"./src/index.js","exports":{".":{"types":"./index.d.ts","default":"./src/index.js"},"./panda-plugin":{"types":"./index.d.ts","default":"./src/panda-plugin.js"}},"bin":{"vike-pandacss":"src/setup.js"},"repository":{"type":"git","url":"git+https://github.com/Opaius/vike-ripple.git"},"homepage":"https://github.com/Opaius/vike-ripple","bugs":{"url":"https://github.com/Opaius/vike-ripple/issues"},"keywords":["pandacss","ripple","ripplets","vike"],"license":"MIT","peerDependencies":{"@pandacss/dev":">=0.50.0","@ripple-ts/vite-plugin":">=0.3.0"},"gitHead":"4010f9128c110f140151fee62c79d7cd34a23bb7","_id":"@cioky/vike-pandacss@0.1.2","_nodeVersion":"26.1.0","_npmVersion":"11.16.0","dist":{"integrity":"sha512-0KXJ97QaWVd6zkG5nJ4fX8oDCcC1F06g41T/to246xTi70fRlOc929KLiPD0H7tv3639d4qg/pGYBp8PU0f5ig==","shasum":"2bae56003f169e86ecfe7b218d0794b1f3c1f416","tarball":"https://registry.npmjs.org/@cioky/vike-pandacss/-/vike-pandacss-0.1.2.tgz","fileCount":7,"unpackedSize":10853,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQCF8XFDpax/vwppGFb7fyyYwqN0QVo6cQK+NVaAwgd4QgIhAKTJrg6eGNMmWU2sHdtRDYpNaF0irpjSr5T9sZAXq6HT"}]},"_npmUser":{"name":"cioky","email":"vgromania3@gmail.com"},"directories":{},"maintainers":[{"name":"cioky","email":"vgromania3@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/vike-pandacss_0.1.2_1782406023083_0.5320202616435099"},"_hasShrinkwrap":false}},"time":{"created":"2026-06-25T16:45:07.820Z","modified":"2026-06-25T16:47:03.304Z","0.1.0":"2026-06-25T16:45:08.079Z","0.1.1":"2026-06-25T16:46:35.777Z","0.1.2":"2026-06-25T16:47:03.219Z"},"bugs":{"url":"https://github.com/Opaius/vike-ripple/issues"},"license":"MIT","homepage":"https://github.com/Opaius/vike-ripple","keywords":["pandacss","ripple","ripplets","vike"],"repository":{"type":"git","url":"git+https://github.com/Opaius/vike-ripple.git"},"description":"Panda CSS integration for Ripple TS — transforms .tsrx for Panda extraction, @apply in <style> blocks","maintainers":[{"name":"cioky","email":"vgromania3@gmail.com"}],"readme":"# @cioky/vike-pandacss\n\n> ⚠️ **HIGHLY EXPERIMENTAL** — This package is in early development. APIs may change without notice, parts may not work, and documentation may be incomplete. Use at your own risk.\n\n[Panda CSS](https://panda-css.com) integration for [Ripple TS](https://ripple-ts.com) — transforms `.tsrx` files for Panda extraction and enables `@apply` in `<style>` blocks.\n\nPart of the [vike-ripple monorepo](https://github.com/Opaius/vike-ripple).\n\n## Quick Start\n\n```bash\nnpx @cioky/vike-create my-app --style pandacss\ncd my-app && npm run dev\n```\n\n## Manual Install\n\n```sh\nnpm install @cioky/vike-pandacss\n```\n\n## Setup\n\nTwo setup scripts must run **in order**:\n\n```bash\nnpx @cioky/vike-core setup          # core patches (.tsrx, server isolation, etc.)\nnpx @cioky/vike-pandacss setup  # replaces tailwind @apply with Panda @layer\n```\n\n## Usage\n\n### Vite plugin\n\n```ts\n// vite.config.ts\nimport vikeRipplePandacss from '@cioky/vike-pandacss'\n\nexport default defineConfig({\n  css: { postcss: './postcss.config.js' },\n  plugins: [\n    vikeRipplePandacss(),\n  ],\n})\n```\n\n### PostCSS config\n\n```js\n// postcss.config.js\nexport default { plugins: { '@pandacss/dev/postcss': {} } }\n```\n\n### Panda CSS plugin\n\n```ts\n// panda.config.ts\nimport { pluginRipple } from '@cioky/vike-pandacss/panda-plugin'\n\nexport default defineConfig({\n  plugins: [pluginRipple()],\n})\n```\n\nThe `pluginRipple()` implements Panda's `parser:before` hook to transform `.tsrx` content into valid TSX before Panda's ts-morph extracts `css()`/`cva()`/`sva()` calls.\n\n## How it works\n\n- **`parser:before` hook**: Strips Ripple's `@if`/`@for`/`@each` directives, `@{}` markers, and `<style>` blocks from `.tsrx` files so Panda's extraction engine can parse the remaining TSX.\n- **`@apply` patch**: Prepends `@layer reset, base, tokens, recipes, utilities;` to extracted CSS from `<style>` blocks so Panda CSS `@apply` directives resolve at build time.\n\n## Related Packages\n\n- [`@cioky/vike-core`](https://github.com/Opaius/vike-ripple/tree/main/vike-ripple) — Core Vike + Ripple integration\n- [`@cioky/vike-tailwindcss`](https://github.com/Opaius/vike-ripple/tree/main/vike-ripple-tailwindcss) — Tailwind CSS alternative\n- [`@cioky/vike-create`](https://github.com/Opaius/vike-ripple/tree/main/create-vike-ripple) — Project scaffold\n","readmeFilename":"README.md"}