{"_id":"@bryophyte/storybook-addon","name":"@bryophyte/storybook-addon","dist-tags":{"latest":"0.1.0"},"versions":{"0.1.0":{"name":"@bryophyte/storybook-addon","version":"0.1.0","private":false,"type":"module","description":"Storybook addon for Bryophyte analysis data","keywords":["storybook-addon","storybook","bryophyte","analysis","props"],"main":"dist/index.js","module":"dist/index.js","types":"dist/index.d.ts","exports":{".":{"import":"./dist/index.js","types":"./dist/index.d.ts"},"./styles.css":"./dist/styles.css","./manager":"./dist/manager.js","./preview":"./dist/preview.js","./preset":"./dist/preset.js","./package.json":"./package.json"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"scripts":{"build":"tsup --config tsup.config.ts && tailwindcss -i src/styles.css -o dist/styles.css","build:styles":"tailwindcss -i src/styles.css -o dist/styles.css","dev":"tsup --config tsup.config.ts --watch","prepack":"bun run build","publish:dry-run":"npm publish --dry-run --access public","typecheck":"tsc --noEmit","clean":"rimraf dist"},"dependencies":{"@radix-ui/react-icons":"1.3.2","@radix-ui/react-select":"2.2.6","class-variance-authority":"0.7.1","clsx":"2.1.1","lucide-react":"0.562.0","radix-ui":"^1.4.3","tailwind-merge":"3.4.0"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0","storybook":"^8.0.0 || ^9.0.0 || ^10.0.0"},"devDependencies":{"@fontsource-variable/inter":"5.2.8","@tailwindcss/cli":"4.1.18","@types/react":"18.3.18","@types/react-dom":"18.3.5","react":"18.3.1","react-dom":"18.3.1","rimraf":"6.0.1","shadcn":"3.6.1","storybook":"10.1.11","tailwindcss":"4.1.18","tsup":"8.5.1","tw-animate-css":"1.4.0","typescript":"5.9.3"},"_id":"@bryophyte/storybook-addon@0.1.0","gitHead":"34f2bc148ad294bc0cab6146e3c56a3656db539c","_nodeVersion":"22.14.0","_npmVersion":"11.1.0","dist":{"integrity":"sha512-aq8ZEIp9eCvqRK86HgBbMWrob0atZYaYXTo1mX2BO327CPpbnptZjCTwNAyQE1dYwd5DS7MUwZMpKQXUH2hQLg==","shasum":"387f528f55081bff68153d5645be21bf7da420ac","tarball":"https://registry.npmjs.org/@bryophyte/storybook-addon/-/storybook-addon-0.1.0.tgz","fileCount":7,"unpackedSize":89999,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIDuF8PwTs/SXPfTktTojqVySf+U24MOE86PKRdMjdPwXAiEA4r5CjeHTFowGFihWK9mJqhF/A3uJRFvNK+OQFHlMYQI="}]},"_npmUser":{"name":"muell_morty","email":"maarten.schmidt98@gmail.com"},"directories":{},"maintainers":[{"name":"muell_morty","email":"maarten.schmidt98@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/storybook-addon_0.1.0_1771176122264_0.9060496970034213"},"_hasShrinkwrap":false}},"time":{"created":"2026-02-15T17:22:02.124Z","0.1.0":"2026-02-15T17:22:02.409Z","modified":"2026-02-15T17:22:02.926Z"},"maintainers":[{"name":"muell_morty","email":"maarten.schmidt98@gmail.com"}],"description":"Storybook addon for Bryophyte analysis data","keywords":["storybook-addon","storybook","bryophyte","analysis","props"],"readme":"# @bryophyte/storybook-addon\r\n\r\nStorybook addon that surfaces Bryophyte analysis data inside Storybook. It renders a Bryophyte panel and provides React blocks you can drop into Docs/MDX.\r\n\r\n## Prerequisites\r\n\r\nThis addon expects analysis data generated by the Bryophyte CLI. The CLI stores analysis files in a centralized `.bryophyte/analyses/` folder at your project root.\r\n\r\n### Generate analysis data\r\n\r\nFirst, initialize the `.bryophyte` folder at your monorepo/project root:\r\n\r\n```bash\r\nbunx bryophyte init <rootPath>\r\n```\r\n\r\nThen analyze the packages you want to track:\r\n\r\n```bash\r\nbunx bryophyte analyse <projectPath>\r\n```\r\n\r\nThis creates files in the structure:\r\n```\r\n.bryophyte/\r\n  config.json\r\n  analyses/\r\n    _packagename.json           # e.g., _test_package.json\r\n    _other_package.json\r\n```\r\n\r\nThe filename is derived from the package name (e.g., `@test/package` becomes `_test_package.json`).\r\n\r\n### Serving analysis data in Storybook\r\n\r\nThe recommended approach is to serve the `.bryophyte` folder via Storybook's `staticDirs` and reference files via `analysisUrl`:\r\n\r\n```ts\r\n// .storybook/main.ts\r\nexport default {\r\n  staticDirs: ['../public', '.bryophyte'],  // Adjust path based on your structure\r\n  // ...\r\n}\r\n```\r\n\r\n## Install\r\n\r\n```bash\r\nbun add -D @bryophyte/storybook-addon\r\n```\r\n\r\n## Storybook setup\r\n\r\nAdd the addon to `.storybook/main.ts`:\r\n\r\n```ts\r\nexport default {\r\n  addons: ['@bryophyte/storybook-addon/manager'],\r\n}\r\n```\r\n\r\n## Usage (Panel)\r\n\r\nProvide Bryophyte data via story parameters using `analysisUrl` (recommended for monorepos):\r\n\r\n```ts\r\nexport default {\r\n  component: Button,\r\n  parameters: {\r\n    bryophyte: {\r\n      analysisUrl: '/analyses/_test_package.json',  // Served from staticDirs\r\n      componentName: 'Button',\r\n    },\r\n  },\r\n}\r\n```\r\n\r\nOr import the analysis JSON directly:\r\n\r\n```ts\r\nimport analysis from '.bryophyte/analyses/_test_package.json'\r\n\r\nexport default {\r\n  component: Button,\r\n  parameters: {\r\n    bryophyte: {\r\n      analysis,\r\n      componentName: 'Button',\r\n    },\r\n  },\r\n}\r\n```\r\n\r\n## Usage (Docs / MDX block)\r\n\r\n```tsx\r\nimport { PropUsageBlock } from '@bryophyte/storybook-addon'\r\nimport analysis from '.bryophyte/analysis.json'\r\n\r\n<PropUsageBlock\r\n  analysis={analysis}\r\n  componentName='Button'\r\n  title='Button prop usage'\r\n/>\r\n```\r\n\r\n## Parameters\r\n\r\n- `bryophyte.analysis`: Analysis JSON (object or array).\r\n- `bryophyte.analysisUrl`: URL to the analysis JSON.\r\n- `bryophyte.packageName`: Select from an array of analyses.\r\n- `bryophyte.componentName`: Component export name (required).\r\n- `bryophyte.componentFile`: Optional file path match for disambiguation.\r\n","readmeFilename":"README.md","_rev":"1-0fd590426c8f03ed800bfde5eb54a451"}