{"_id":"@droppy-ui/design-system","_rev":"4-d1ca3713430041d983097aca2c0ce875","name":"@droppy-ui/design-system","dist-tags":{"latest":"0.3.1"},"versions":{"0.1.0":{"name":"@droppy-ui/design-system","version":"0.1.0","keywords":["design-system","react","base-ui","components","accessibility"],"license":"MIT","_id":"@droppy-ui/design-system@0.1.0","maintainers":[{"name":"yannbf","email":"yannbf@gmail.com"},{"name":"sdlazaro","email":"sdodierlazaro@gmail.com"}],"homepage":"https://github.com/yannbf/droppy-ds#readme","bugs":{"url":"https://github.com/yannbf/droppy-ds/issues"},"dist":{"shasum":"40a00d6a04fb2ab041a654dbece055113e4cf20b","tarball":"https://registry.npmjs.org/@droppy-ui/design-system/-/design-system-0.1.0.tgz","fileCount":8,"integrity":"sha512-w9Jf1HAv8VhnM1QNDtti7JYBtZNhwlFg7Fq6tz02p1ZVCBDHhXKWeGZDT8ukHj65wEm44dRL4aD2W7WwSfJDKA==","signatures":[{"sig":"MEYCIQDWrfLWu4W85121Sn7b7B9EJRXq4RDtiDJSP/aWFViwFAIhAOQeWKheevxOuF2WOlYW3SlzHjYO+fhakUVzKFfh0n8A","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":2097896},"main":"./dist/index.js","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","engines":{"node":">=20"},"exports":{".":{"types":"./dist/index.d.ts","default":"./dist/index.js"},"./styles.css":"./dist/styles.css","./package.json":"./package.json"},"gitHead":"e889522f796f360cee552d4144422bce98018006","scripts":{"lint":"eslint .","test":"terrazzo build && vitest","build":"terrazzo build && vite build","check":"tsc --noEmit","format":"prettier --write .","release":"changeset publish","test:ci":"terrazzo build && vitest run","lint:fix":"eslint --fix .","chromatic":"chromatic --project-token $CHROMATIC_PROJECT_TOKEN --exit-zero-on-changes","storybook":"terrazzo build && storybook dev -p 6007","build:tokens":"terrazzo build","format:check":"prettier --check .","prepublishOnly":"pnpm build","build-storybook":"terrazzo build && storybook build --output-dir build/storybook","experiment:test":"vitest run --config tools/storybook-freeze/vitest.config.ts","experiment:check":"tsc --noEmit -p tools/storybook-freeze","experiment:freeze":"tsx tools/storybook-freeze/src/cli.ts","experiment:publish-branches":"tsx tools/storybook-freeze/src/publish-branches.ts"},"_npmUser":{"name":"yannbf","email":"yannbf@gmail.com"},"repository":{"url":"git+https://github.com/yannbf/droppy-ds.git","type":"git"},"_npmVersion":"11.16.0","description":"Droppy design system — React components built on Base UI and the Droppy theme.","directories":{},"sideEffects":["*.css"],"_nodeVersion":"26.3.1","dependencies":{"embla-carousel-react":"^8.6.0","use-sync-external-store":"^1.6.0","embla-carousel-wheel-gestures":"^8.1.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"packageManager":"pnpm@10.33.0","devDependencies":{"tsx":"^4.23.12","vite":"^8.2.1","react":"^19.2.8","eslint":"^9.39.5","globby":"^16.2.3","vitest":"^4.1.10","globals":"^16.5.0","prettier":"^3.9.6","chromatic":"^18.2.0","react-dom":"^19.2.8","storybook":"^10.5.7","@eslint/js":"^9.39.5","oxc-parser":"^0.144.0","playwright":"^1.62.1","remark-gfm":"^4.0.1","simple-git":"^3.36.0","typescript":"^5.9.3","@types/node":"^26.2.0","@types/react":"^19.2.18","jsonc-parser":"^3.3.1","lottie-react":"^3.1.0","magic-string":"^1.2.0","@terrazzo/cli":"^2.7.1","@base-ui/react":"^1.7.0","@biomejs/biome":"^2.5.8","@clack/prompts":"^1.7.0","@changesets/cli":"^2.31.1","vite-plugin-dts":"^4.5.4","@types/react-dom":"^19.2.4","typescript-eslint":"^8.67.0","@vitest/coverage-v8":"^4.1.10","@storybook/addon-mcp":"^0.7.0","@terrazzo/plugin-css":"^2.7.1","@vitejs/plugin-react":"^6.0.5","@storybook/addon-a11y":"^10.5.7","@storybook/addon-docs":"^10.5.7","@storybook/react-vite":"^10.5.7","@terrazzo/token-tools":"2.7.1","eslint-config-prettier":"^10.1.8","eslint-plugin-jsx-a11y":"^6.10.2","@storybook/addon-vitest":"^10.5.7","eslint-plugin-storybook":"^10.5.7","eslint-plugin-react-hooks":"^5.2.0","@vitest/browser-playwright":"^4.1.10","storybook-addon-tag-badges":"^3.1.0","@component-anatomy/storybook":"^0.0.1","@unpunnyfuns/swatchbook-core":"^2.0.0","@unpunnyfuns/swatchbook-addon":"^2.0.0","@unpunnyfuns/swatchbook-blocks":"^2.0.0","@github-ui/storybook-addon-performance-panel":"^1.1.4"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/design-system_0.1.0_1787661375817_0.6691252809731143","host":"s3://npm-registry-packages-npm-production"}},"0.2.0":{"name":"@droppy-ui/design-system","version":"0.2.0","keywords":["design-system","react","base-ui","components","accessibility"],"license":"MIT","_id":"@droppy-ui/design-system@0.2.0","maintainers":[{"name":"yannbf","email":"yannbf@gmail.com"},{"name":"sdlazaro","email":"sdodierlazaro@gmail.com"}],"homepage":"https://github.com/yannbf/droppy-ds#readme","bugs":{"url":"https://github.com/yannbf/droppy-ds/issues"},"dist":{"shasum":"4366203031db1f3509af7df91909287a7b6d7a10","tarball":"https://registry.npmjs.org/@droppy-ui/design-system/-/design-system-0.2.0.tgz","fileCount":8,"integrity":"sha512-vWENTTfn690OR4kOe+fbiQT7booytHeHtj/IRS/TZC833Tyvwp+oIUomkxuiP98MBz++YPpa454HCmlJDQVy9A==","signatures":[{"sig":"MEYCIQCf0QcaojrPvkZkNZvU6lViUcshFSeMZx2Gr4025YXLngIhANCDWUKrJwpKs5aN0UvNKfscpbz2BVh5/gLL6lBdtve9","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@droppy-ui%2fdesign-system@0.2.0","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":2100461},"main":"./dist/index.js","type":"module","_from":"file:droppy-ui-design-system-0.2.0.tgz","types":"./dist/index.d.ts","module":"./dist/index.js","engines":{"node":">=20"},"exports":{".":{"types":"./dist/index.d.ts","default":"./dist/index.js"},"./styles.css":"./dist/styles.css","./package.json":"./package.json"},"scripts":{"lint":"eslint .","test":"terrazzo build && vitest","build":"terrazzo build && vite build","check":"tsc --noEmit","format":"prettier --write .","release":"changeset publish","test:ci":"terrazzo build && vitest run","lint:fix":"eslint --fix .","chromatic":"chromatic --project-token $CHROMATIC_PROJECT_TOKEN --exit-zero-on-changes","storybook":"terrazzo build && storybook dev -p 6007","build:tokens":"terrazzo build","format:check":"prettier --check .","build-storybook":"terrazzo build && storybook build --output-dir build/storybook","experiment:test":"vitest run --config tools/storybook-freeze/vitest.config.ts","experiment:check":"tsc --noEmit -p tools/storybook-freeze","experiment:freeze":"tsx tools/storybook-freeze/src/cli.ts","experiment:publish-branches":"tsx tools/storybook-freeze/src/publish-branches.ts"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:c06a03ed-74ca-4915-ad46-6d25bba28887"}},"_resolved":"/tmp/4208b555a41ba9cbad494fd9138f52f3/droppy-ui-design-system-0.2.0.tgz","_integrity":"sha512-vWENTTfn690OR4kOe+fbiQT7booytHeHtj/IRS/TZC833Tyvwp+oIUomkxuiP98MBz++YPpa454HCmlJDQVy9A==","repository":{"url":"git+https://github.com/yannbf/droppy-ds.git","type":"git"},"_npmVersion":"12.0.2","description":"Droppy design system — React components built on Base UI and the Droppy theme.","directories":{},"sideEffects":["*.css"],"_nodeVersion":"24.19.0","dependencies":{"embla-carousel-react":"^8.6.0","use-sync-external-store":"^1.6.0","embla-carousel-wheel-gestures":"^8.1.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"tsx":"^4.23.12","vite":"^8.2.1","react":"^19.2.8","eslint":"^9.39.5","globby":"^16.2.3","vitest":"^4.1.10","globals":"^16.5.0","prettier":"^3.9.6","chromatic":"^18.2.0","react-dom":"^19.2.8","storybook":"^10.5.7","@eslint/js":"^9.39.5","oxc-parser":"^0.144.0","playwright":"^1.62.1","remark-gfm":"^4.0.1","simple-git":"^3.36.0","typescript":"^5.9.3","@types/node":"^26.2.0","@types/react":"^19.2.18","jsonc-parser":"^3.3.1","lottie-react":"^3.1.0","magic-string":"^1.2.0","@terrazzo/cli":"^2.7.1","@base-ui/react":"^1.7.0","@biomejs/biome":"^2.5.8","@clack/prompts":"^1.7.0","@changesets/cli":"^2.31.1","vite-plugin-dts":"^4.5.4","@types/react-dom":"^19.2.4","typescript-eslint":"^8.67.0","@vitest/coverage-v8":"^4.1.10","@storybook/addon-mcp":"^0.7.0","@terrazzo/plugin-css":"^2.7.1","@vitejs/plugin-react":"^6.0.5","@storybook/addon-a11y":"^10.5.7","@storybook/addon-docs":"^10.5.7","@storybook/react-vite":"^10.5.7","@terrazzo/token-tools":"2.7.1","eslint-config-prettier":"^10.1.8","eslint-plugin-jsx-a11y":"^6.10.2","@storybook/addon-vitest":"^10.5.7","eslint-plugin-storybook":"^10.5.7","eslint-plugin-react-hooks":"^5.2.0","@vitest/browser-playwright":"^4.1.10","storybook-addon-tag-badges":"^3.1.0","@component-anatomy/storybook":"^0.0.1","@unpunnyfuns/swatchbook-core":"^2.0.0","@unpunnyfuns/swatchbook-addon":"^2.0.0","@unpunnyfuns/swatchbook-blocks":"^2.0.0","@github-ui/storybook-addon-performance-panel":"^1.1.4"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/design-system_0.2.0_1787662073952_0.7967206937637743","host":"s3://npm-registry-packages-npm-production"}},"0.3.0":{"name":"@droppy-ui/design-system","version":"0.3.0","keywords":["design-system","react","base-ui","components","accessibility"],"license":"MIT","_id":"@droppy-ui/design-system@0.3.0","maintainers":[{"name":"yannbf","email":"yannbf@gmail.com"},{"name":"sdlazaro","email":"sdodierlazaro@gmail.com"}],"homepage":"https://github.com/yannbf/droppy-ds#readme","bugs":{"url":"https://github.com/yannbf/droppy-ds/issues"},"dist":{"shasum":"1d450559b2a053a20f3591b725fa082d40a5f118","tarball":"https://registry.npmjs.org/@droppy-ui/design-system/-/design-system-0.3.0.tgz","fileCount":8,"integrity":"sha512-U6lo/IWzY0HXkhZ8UZFqfk9RnOjxIKO1kSwAKYzXeyNmMtWxDp1ganGEndFI8WVbUH2vN7Z52QBqsqLR3GxfKg==","signatures":[{"sig":"MEYCIQDNBe8edrctFs+6E6vSZfXFdhI5EARVOVIRl38MKznLSQIhAMU7XjcBjXHjmUkTxlNbHANoOp6MkYwQXs3nf86lYyL8","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@droppy-ui%2fdesign-system@0.3.0","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":2100138},"main":"./dist/index.js","type":"module","_from":"file:droppy-ui-design-system-0.3.0.tgz","types":"./dist/index.d.ts","module":"./dist/index.js","engines":{"node":">=20"},"exports":{".":{"types":"./dist/index.d.ts","default":"./dist/index.js"},"./styles.css":"./dist/styles.css","./package.json":"./package.json"},"scripts":{"lint":"eslint .","test":"terrazzo build && vitest","build":"terrazzo build && vite build","check":"tsc --noEmit","format":"prettier --write .","release":"changeset publish","test:ci":"terrazzo build && vitest run","lint:fix":"eslint --fix .","chromatic":"chromatic --project-token $CHROMATIC_PROJECT_TOKEN --exit-zero-on-changes","storybook":"terrazzo build && storybook dev -p 6007","build:tokens":"terrazzo build","format:check":"prettier --check .","build-storybook":"terrazzo build && storybook build --output-dir build/storybook","experiment:test":"vitest run --config tools/storybook-freeze/vitest.config.ts","experiment:check":"tsc --noEmit -p tools/storybook-freeze","experiment:freeze":"tsx tools/storybook-freeze/src/cli.ts","experiment:publish-branches":"tsx tools/storybook-freeze/src/publish-branches.ts"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:c06a03ed-74ca-4915-ad46-6d25bba28887"}},"_resolved":"/tmp/83ab05d5e7288a4f5309935a2a52c923/droppy-ui-design-system-0.3.0.tgz","_integrity":"sha512-U6lo/IWzY0HXkhZ8UZFqfk9RnOjxIKO1kSwAKYzXeyNmMtWxDp1ganGEndFI8WVbUH2vN7Z52QBqsqLR3GxfKg==","repository":{"url":"git+https://github.com/yannbf/droppy-ds.git","type":"git"},"_npmVersion":"12.0.2","description":"Droppy design system — React components built on Base UI and the Droppy theme.","directories":{},"sideEffects":["*.css"],"_nodeVersion":"24.19.0","dependencies":{"embla-carousel-react":"^8.6.0","use-sync-external-store":"^1.6.0","embla-carousel-wheel-gestures":"^8.1.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"tsx":"^4.23.12","vite":"^8.2.1","react":"^19.2.8","eslint":"^9.39.5","globby":"^16.2.3","vitest":"^4.1.10","globals":"^16.5.0","prettier":"^3.9.6","chromatic":"^18.2.0","react-dom":"^19.2.8","storybook":"^10.5.7","@eslint/js":"^9.39.5","oxc-parser":"^0.144.0","playwright":"^1.62.1","remark-gfm":"^4.0.1","simple-git":"^3.36.0","typescript":"^5.9.3","@types/node":"^26.2.0","@types/react":"^19.2.18","jsonc-parser":"^3.3.1","lottie-react":"^3.1.0","magic-string":"^1.2.0","@terrazzo/cli":"^2.7.1","@base-ui/react":"^1.7.0","@biomejs/biome":"^2.5.8","@clack/prompts":"^1.7.0","@changesets/cli":"^2.31.1","vite-plugin-dts":"^4.5.4","@types/react-dom":"^19.2.4","typescript-eslint":"^8.67.0","@vitest/coverage-v8":"^4.1.10","@storybook/addon-mcp":"^0.7.0","@terrazzo/plugin-css":"^2.7.1","@vitejs/plugin-react":"^6.0.5","@storybook/addon-a11y":"^10.5.7","@storybook/addon-docs":"^10.5.7","@storybook/react-vite":"^10.5.7","@terrazzo/token-tools":"2.7.1","eslint-config-prettier":"^10.1.8","eslint-plugin-jsx-a11y":"^6.10.2","@storybook/addon-vitest":"^10.5.7","eslint-plugin-storybook":"^10.5.7","eslint-plugin-react-hooks":"^5.2.0","@vitest/browser-playwright":"^4.1.10","storybook-addon-tag-badges":"^3.1.0","@component-anatomy/storybook":"^0.0.1","@unpunnyfuns/swatchbook-core":"^2.0.0","@unpunnyfuns/swatchbook-addon":"^2.0.0","@unpunnyfuns/swatchbook-blocks":"^2.0.0","@github-ui/storybook-addon-performance-panel":"^1.1.4"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/design-system_0.3.0_1787739860534_0.4056074265195775","host":"s3://npm-registry-packages-npm-production"}},"0.3.1":{"name":"@droppy-ui/design-system","version":"0.3.1","description":"Droppy design system — React components built on Base UI and the Droppy theme.","repository":{"type":"git","url":"git+https://github.com/yannbf/droppy-ds.git"},"license":"MIT","homepage":"https://github.com/yannbf/droppy-ds#readme","bugs":{"url":"https://github.com/yannbf/droppy-ds/issues"},"storybook":{"url":"https://main--6a6b3f5765e7f685e7f73656.chromatic.com","title":"Droppy Design System"},"type":"module","sideEffects":["*.css"],"main":"./dist/index.js","module":"./dist/index.js","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","default":"./dist/index.js"},"./styles.css":"./dist/styles.css","./package.json":"./package.json"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"dependencies":{"embla-carousel-react":"^8.6.0","embla-carousel-wheel-gestures":"^8.1.0","use-sync-external-store":"^1.6.0"},"devDependencies":{"@base-ui/react":"^1.7.0","@biomejs/biome":"^2.5.8","@changesets/cli":"^2.31.1","@clack/prompts":"^1.7.0","@component-anatomy/storybook":"^0.1.0","@eslint/js":"^9.39.5","@github-ui/storybook-addon-performance-panel":"^1.2.0","@storybook/addon-a11y":"^10.6.0","@storybook/addon-docs":"^10.6.0","@storybook/addon-mcp":"^10.6.0","@storybook/addon-vitest":"^10.6.0","@storybook/react-vite":"^10.6.0","@terrazzo/cli":"^2.7.1","@terrazzo/plugin-css":"^2.7.1","@terrazzo/token-tools":"2.7.1","@types/node":"^26.2.0","@types/react":"^19.2.18","@types/react-dom":"^19.2.4","@unpunnyfuns/swatchbook-addon":"^2.0.0","@unpunnyfuns/swatchbook-blocks":"^2.0.0","@unpunnyfuns/swatchbook-core":"^2.0.0","@vitejs/plugin-react":"^6.0.5","@vitest/browser-playwright":"^4.1.10","@vitest/coverage-v8":"^4.1.10","chromatic":"^18.2.0","eslint":"^9.39.5","eslint-config-prettier":"^10.1.8","eslint-plugin-jsx-a11y":"^6.10.2","eslint-plugin-react-hooks":"^5.2.0","eslint-plugin-storybook":"^10.6.0","globals":"^16.5.0","globby":"^16.2.3","jsonc-parser":"^3.3.1","lottie-react":"^3.1.0","magic-string":"^1.2.0","oxc-parser":"^0.144.0","playwright":"^1.62.1","prettier":"^3.9.6","react":"^19.2.8","react-dom":"^19.2.8","remark-gfm":"^4.0.1","simple-git":"^3.36.0","storybook":"^10.6.0","storybook-addon-tag-badges":"^3.1.0","tsx":"^4.23.12","typescript":"^5.9.3","typescript-eslint":"^8.67.0","vite":"^8.2.1","vite-plugin-dts":"^4.5.4","vitest":"^4.1.10"},"engines":{"node":">=20"},"keywords":["design-system","react","base-ui","components","accessibility"],"publishConfig":{"access":"public"},"scripts":{"build":"terrazzo build && vite build","check":"tsc --noEmit","storybook":"terrazzo build && storybook dev -p 6007","build-storybook":"terrazzo build && storybook build --output-dir build/storybook","test":"terrazzo build && vitest","test:ci":"terrazzo build && vitest run","build:tokens":"terrazzo build","lint":"eslint .","lint:fix":"eslint --fix .","format":"prettier --write .","format:check":"prettier --check .","chromatic":"chromatic --project-token $CHROMATIC_PROJECT_TOKEN --exit-zero-on-changes","release":"changeset publish","experiment:freeze":"tsx tools/storybook-freeze/src/cli.ts","experiment:publish-branches":"tsx tools/storybook-freeze/src/publish-branches.ts","experiment:check":"tsc --noEmit -p tools/storybook-freeze","experiment:test":"vitest run --config tools/storybook-freeze/vitest.config.ts"},"_id":"@droppy-ui/design-system@0.3.1","_integrity":"sha512-ei2rTBHeQd9Tc/7nIz1IT6v6AqkVpY1QV79li7rdI72B4ujH4qrs67AG+FPzufJmcoHQs0qXQwqNNJUrFiUAvQ==","_resolved":"/tmp/cd111a92d3cfa8fa1d1d13b5b9b937cb/droppy-ui-design-system-0.3.1.tgz","_from":"file:droppy-ui-design-system-0.3.1.tgz","_nodeVersion":"24.19.0","_npmVersion":"12.0.2","dist":{"integrity":"sha512-ei2rTBHeQd9Tc/7nIz1IT6v6AqkVpY1QV79li7rdI72B4ujH4qrs67AG+FPzufJmcoHQs0qXQwqNNJUrFiUAvQ==","shasum":"b45e6484a4a6671a1a4859fe2038743378967e66","tarball":"https://registry.npmjs.org/@droppy-ui/design-system/-/design-system-0.3.1.tgz","fileCount":8,"unpackedSize":2100264,"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@droppy-ui%2fdesign-system@0.3.1","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQDEJ0iUYYAXcdY8mwzQpBQGEtH5Rudq7qfkWPbKmdC9nwIgeeIB78S5h0gjHDjd0jwWQic3VS2VNxW0w+icmQySjnE="}]},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:c06a03ed-74ca-4915-ad46-6d25bba28887"}},"directories":{},"maintainers":[{"name":"yannbf","email":"yannbf@gmail.com"},{"name":"sdlazaro","email":"sdodierlazaro@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/design-system_0.3.1_1788439797950_0.6653000742783515"},"_hasShrinkwrap":false}},"time":{"created":"2026-08-25T12:36:15.544Z","modified":"2026-09-03T12:49:58.446Z","0.1.0":"2026-08-25T12:36:16.000Z","0.2.0":"2026-08-25T12:47:54.164Z","0.3.0":"2026-08-26T10:24:20.704Z","0.3.1":"2026-09-03T12:49:58.097Z"},"bugs":{"url":"https://github.com/yannbf/droppy-ds/issues"},"license":"MIT","homepage":"https://github.com/yannbf/droppy-ds#readme","keywords":["design-system","react","base-ui","components","accessibility"],"repository":{"type":"git","url":"git+https://github.com/yannbf/droppy-ds.git"},"description":"Droppy design system — React components built on Base UI and the Droppy theme.","maintainers":[{"name":"yannbf","email":"yannbf@gmail.com"},{"name":"sdlazaro","email":"sdodierlazaro@gmail.com"}],"readme":"# @droppy-ui/design-system\n\nReact components for the Droppy design language, built on [Base UI](https://base-ui.com).\n\nBase UI supplies the behaviour — focus management, dismissal, positioning, ARIA wiring. This\npackage ships its own theme — the design tokens and the chrome — plus a component layer on top:\ncomponents with props instead of class names, so consuming code says\n`<Button clear round icon=\"cross\" />` rather than binding theme classes at every call site.\n\n## Install\n\n```bash\nnpm install @droppy-ui/design-system\n```\n\n`react` and `react-dom` are peer dependencies — install them alongside. Base UI is bundled\ninside the package, so it never needs to be installed separately.\n\n## Use\n\nImport the stylesheet once, in your app entry:\n\n```tsx\nimport '@droppy-ui/design-system/styles.css'\n```\n\nIt carries the Droppy tokens and every component's styles. Then import components anywhere:\n\n```tsx\nimport { Button, Input, Modal } from '@droppy-ui/design-system'\n\nexport const RemoveItem = ({ isOpen, onClose }) => (\n  <Modal isOpen={isOpen} onClose={onClose}>\n    <Input label=\"Reason\" />\n    <Button large>Remove</Button>\n  </Modal>\n)\n```\n\n## Components\n\n| Component         | Built on                  | For                                                       |\n| ----------------- | ------------------------- | --------------------------------------------------------- |\n| `Button`          | `Base UI Button`          | Primary and secondary actions                             |\n| `IconButton`      | `Base UI Button`          | Floating icon-only affordances — carousel arrows          |\n| `Link`            | `Base UI useRender`       | Inline text links — a plain sentence link, not a button   |\n| `Icon`            | —                         | The icon set, inlined                                     |\n| `Heading`         | —                         | Display type, `h1`–`h5`, with `size` decoupled from level |\n| `Body`            | —                         | Body copy — `p` by default, or `span`, `label`            |\n| `Badge`           | —                         | Short inline status labels                                |\n| `Review`          | —                         | A star rating with a text line — \"★ 4.5 Very good\"        |\n| `Input`           | `Base UI Field`, `Input`  | Labelled text fields with a reserved error slot           |\n| `Select`          | native `select`           | A single choice from a short, known list                  |\n| `NumberField`     | `Base UI NumberField`     | A typeable number with stepper buttons and pointer scrub  |\n| `QuantityStepper` | —                         | A minus/plus pair flanking a single item's count          |\n| `Modal`           | `Base UI Dialog`          | A decision that blocks the page                           |\n| `Sidebar`         | `Base UI Drawer`          | A panel reviewed alongside the page — carts, filters      |\n| `Tooltip`         | `Base UI Tooltip`         | A hint for a control whose face doesn't explain it        |\n| `Toast`           | `Base UI Toast`           | Transient, self-dismissing corner notifications           |\n| `Accordion`       | `Base UI Accordion`       | Independently collapsible sections — FAQs, filter groups  |\n| `Tabs`            | `Base UI Tabs`            | Panels shown one at a time, switched by a row of tabs     |\n| `Skeleton`        | —                         | A loading placeholder for content not yet known           |\n| `Spinner`         | —                         | An indeterminate loading indicator                        |\n| `ProgressBar`     | —                         | Progress through a known number of steps                  |\n| `Progress`        | `Base UI Progress`        | A progress fill with a label and formatted value          |\n| `ErrorBlock`      | —                         | A titled message with one recovery action — 404s, errors  |\n| `TopBanner`       | —                         | A page-top banner: a title over an optional photo         |\n| `Breadcrumb`      | `Base UI useRender`       | A trail of ancestor pages leading to the current one      |\n| `Carousel`        | —                         | A horizontally scrolling row with drag, wheel and arrows  |\n| `ScrollArea`      | `Base UI ScrollArea`      | A scrollable panel with a themed, hover-revealed scrollbar |\n| `Separator`       | `Base UI Separator`       | A divider between two blocks of content                   |\n| `Container`       | —                         | The centered max-width wrapper for page content           |\n| `PageSection`     | —                         | A titled slice of a page with an optional top action      |\n| `PageTemplate`    | —                         | The page shell: header, `<main>`, footer                  |\n| `FooterCard`      | —                         | A grouped column of footer links                          |\n| `Card`            | —                         | A themed surface for grouped content                      |\n\nRun `pnpm storybook` in this repo for the props, the variants and what each one looks like in\nboth themes.\n\n## Dark mode\n\nSet `data-ds-theme=\"dark\"` on the root element. Unset, the tokens follow the OS preference.\n\n```tsx\ndocument.documentElement.dataset.dsTheme = isDark ? 'dark' : 'light'\n```\n\n## Styling from the outside\n\nEvery component merges an incoming `className` rather than replacing its own, so wrapping one\nin `styled()` or adding utility classes composes instead of stripping the design system's\nstyling.\n\nThe cascade is ordered: theme rules first, component rules second, and anything the app writes\nlast. App CSS wins at equal specificity without `!important`.\n\n## Experiment branches\n\n`experiment/*` branches each hold one subset of the Storybook corpus, for measuring what a given\nkind of documentation is worth to an agent. See\n[tools/storybook-freeze](./tools/storybook-freeze/README.md).\n\n## Contributing\n\nSee [CONTRIBUTING.md](./CONTRIBUTING.md).\n","readmeFilename":"README.md"}