{"_id":"@beckharrisdesign/mvds","_rev":"3-7e0e7aba925af02d2d35470e2c03c1b0","name":"@beckharrisdesign/mvds","dist-tags":{"latest":"0.4.0"},"versions":{"0.2.0":{"name":"@beckharrisdesign/mvds","version":"0.2.0","_id":"@beckharrisdesign/mvds@0.2.0","maintainers":[{"name":"katybeckharris","email":"katy@beckharrisdesign.com"}],"dist":{"shasum":"818ab0d9fb942e8aa24b8230a56b65ba6c5abeca","tarball":"https://registry.npmjs.org/@beckharrisdesign/mvds/-/mvds-0.2.0.tgz","fileCount":7,"integrity":"sha512-no0PQah5FrXJeZXJ8O+CrfSZD+pkmgHKTYqcx76G4ljSaK5RjMhcmT3uF8DPCJOfbw+J1OEu9XYwzvZCeGMeLA==","signatures":[{"sig":"MEYCIQCYAhcmGhuSdPs4Ee6yfuR7iJ37AoRdkCdjfVZ8T859DAIhAI22KEhmR7/oz8j0WC9AORaTwiTBH6ucHSJ67DNylcpN","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":84166},"main":"./dist-lib/index.js","type":"module","types":"./dist-lib/index.d.ts","module":"./dist-lib/index.js","exports":{".":{"types":"./dist-lib/index.d.ts","import":"./dist-lib/index.js"},"./styles.css":"./dist-lib/styles.css","./tokens.css":"./dist-lib/tokens.css","./package.json":"./package.json"},"gitHead":"30cc3d96d5b558d2dc5f2af633cf03fcc6819b44","scripts":{"dev":"vite","lint":"eslint .","test":"npm run test:light && npm run test:dark","build":"tsc -b && vite build","prepack":"npm run build:lib","prepare":"git config core.hooksPath .githooks || true","preview":"vite preview","prebuild":"npm run generate:snapshot","build:lib":"tsup","storybook":"storybook dev -p 6006","test:dark":"VITE_SB_THEME=dark vitest --project storybook run","build:site":"node scripts/build-site.mjs","test:light":"vitest --project storybook run","check:figma":"node scripts/check-figma-manifest.mjs","check:contrast":"node scripts/check-contrast.mjs","build-storybook":"storybook build","check:principles":"node scripts/check-principles.mjs","generate:snapshot":"node scripts/generate-manifest-snapshot.mjs"},"_npmUser":{"name":"katybeckharris","email":"katy@beckharrisdesign.com"},"_npmVersion":"11.9.0","description":"MVDS — Minimum Viable Design System. An agent-first design system for early startup prototyping with solid foundational design strategy.","directories":{},"_nodeVersion":"25.6.1","dependencies":{"clsx":"^2.1.1","shadcn":"^4.10.0","radix-ui":"^1.4.3","lucide-react":"^1.17.0","tailwind-merge":"^3.6.0","tw-animate-css":"^1.4.0","class-variance-authority":"^0.7.1","@fontsource-variable/inter":"^5.2.8"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.5.0","vite":"^8.0.12","react":"^19.2.6","eslint":"^10.3.0","vitest":"^4.1.8","globals":"^17.6.0","react-dom":"^19.2.6","storybook":"^10.4.2","@eslint/js":"^10.0.1","playwright":"^1.60.0","typescript":"~6.0.2","@types/node":"^24.12.3","tailwindcss":"^4.3.0","@types/react":"^19.2.14","@types/react-dom":"^19.2.3","@tailwindcss/vite":"^4.3.0","typescript-eslint":"^8.59.2","@vitest/coverage-v8":"^4.1.8","@storybook/addon-mcp":"^0.6.0","@vitejs/plugin-react":"^6.0.1","@storybook/addon-a11y":"^10.4.2","@storybook/addon-docs":"^10.4.2","@storybook/react-vite":"^10.4.2","@storybook/addon-vitest":"^10.4.2","eslint-plugin-storybook":"^10.4.2","@chromatic-com/storybook":"^5.2.1","eslint-plugin-react-hooks":"^7.1.1","@vitest/browser-playwright":"^4.1.8","eslint-plugin-react-refresh":"^0.5.2"},"peerDependencies":{"react":"^19","react-dom":"^19","tailwindcss":"^4"},"_npmOperationalInternal":{"tmp":"tmp/mvds_0.2.0_1784158357800_0.8418421786219024","host":"s3://npm-registry-packages-npm-production"}},"0.3.0":{"name":"@beckharrisdesign/mvds","version":"0.3.0","license":"MIT","_id":"@beckharrisdesign/mvds@0.3.0","maintainers":[{"name":"katybeckharris","email":"katy@beckharrisdesign.com"}],"homepage":"https://github.com/beckharrisdesign/mvds#readme","bugs":{"url":"https://github.com/beckharrisdesign/mvds/issues"},"dist":{"shasum":"f4ca379043682f8629674da0cca73e4b24e33cc8","tarball":"https://registry.npmjs.org/@beckharrisdesign/mvds/-/mvds-0.3.0.tgz","fileCount":7,"integrity":"sha512-YwHW4v5z1k0rJMCGUVuCaTkiqWdHOBkmvemE1agX1axSMwXsX9IGBFxpybnW9IK7F+b0Kh1LrUs9gHb2tzDncA==","signatures":[{"sig":"MEYCIQCFhBq1/vdbuA8o8kXuaE1NzCCPwy5aojH4SQTNsTwwigIhAI8Tri3oTd1QlNTdDrOUzDN6LMvE0IVseX6tffqbaPLc","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@beckharrisdesign%2fmvds@0.3.0","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":84685},"main":"./dist-lib/index.js","type":"module","types":"./dist-lib/index.d.ts","module":"./dist-lib/index.js","exports":{".":{"types":"./dist-lib/index.d.ts","import":"./dist-lib/index.js"},"./styles.css":"./dist-lib/styles.css","./tokens.css":"./dist-lib/tokens.css","./package.json":"./package.json"},"gitHead":"8f791b1634e16e8c4ea9a135061084126dfcfa7c","scripts":{"dev":"vite","lint":"eslint .","test":"npm run test:light && npm run test:dark","build":"tsc -b && vite build","prepack":"npm run build:lib","prepare":"git config core.hooksPath .githooks || true","preview":"vite preview","prebuild":"npm run generate:snapshot","build:lib":"tsup","storybook":"storybook dev -p 6006","test:dark":"VITE_SB_THEME=dark vitest --project storybook run","build:site":"node scripts/build-site.mjs","test:light":"vitest --project storybook run","check:figma":"node scripts/check-figma-manifest.mjs","export:figma":"node scripts/export-figma.mjs","check:contrast":"node scripts/check-contrast.mjs","build-storybook":"storybook build","verify:consumer":"node scripts/verify-consumer.mjs","check:principles":"node scripts/check-principles.mjs","generate:snapshot":"node scripts/generate-manifest-snapshot.mjs","verify:figma-share":"node scripts/verify-figma-share.mjs"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:b59cddf5-2ed6-4122-ad72-b14da30200a7"}},"repository":{"url":"git+https://github.com/beckharrisdesign/mvds.git","type":"git"},"_npmVersion":"11.18.0","description":"MVDS — Minimum Viable Design System. An agent-first design system for early startup prototyping with solid foundational design strategy.","directories":{},"_nodeVersion":"22.23.1","dependencies":{"clsx":"^2.1.1","shadcn":"^4.10.0","radix-ui":"^1.4.3","lucide-react":"^1.17.0","tailwind-merge":"^3.6.0","tw-animate-css":"^1.4.0","class-variance-authority":"^0.7.1","@fontsource-variable/inter":"^5.2.8"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.5.0","vite":"^8.0.12","react":"^19.2.6","eslint":"^10.3.0","vitest":"^4.1.8","globals":"^17.6.0","react-dom":"^19.2.6","storybook":"^10.4.2","@eslint/js":"^10.0.1","playwright":"^1.60.0","typescript":"~6.0.2","@types/node":"^24.12.3","tailwindcss":"^4.3.0","@types/react":"^19.2.14","@types/react-dom":"^19.2.3","@tailwindcss/vite":"^4.3.0","typescript-eslint":"^8.59.2","@vitest/coverage-v8":"^4.1.8","@storybook/addon-mcp":"^0.6.0","@vitejs/plugin-react":"^6.0.1","@storybook/addon-a11y":"^10.4.2","@storybook/addon-docs":"^10.4.2","@storybook/react-vite":"^10.4.2","@storybook/addon-vitest":"^10.4.2","eslint-plugin-storybook":"^10.4.2","@chromatic-com/storybook":"^5.2.1","eslint-plugin-react-hooks":"^7.1.1","@vitest/browser-playwright":"^4.1.8","eslint-plugin-react-refresh":"^0.5.2"},"peerDependencies":{"react":"^19","react-dom":"^19","tailwindcss":"^4"},"_npmOperationalInternal":{"tmp":"tmp/mvds_0.3.0_1785355222431_0.5532317645622844","host":"s3://npm-registry-packages-npm-production"}},"0.4.0":{"name":"@beckharrisdesign/mvds","version":"0.4.0","publishConfig":{"registry":"https://registry.npmjs.org","access":"public"},"description":"MVDS — Minimum Viable Design System. An agent-first design system for early startup prototyping with solid foundational design strategy.","license":"MIT","homepage":"https://github.com/beckharrisdesign/mvds#readme","repository":{"type":"git","url":"git+https://github.com/beckharrisdesign/mvds.git"},"bugs":{"url":"https://github.com/beckharrisdesign/mvds/issues"},"type":"module","exports":{".":{"types":"./dist-lib/index.d.ts","import":"./dist-lib/index.js"},"./styles.css":"./dist-lib/styles.css","./tokens.css":"./dist-lib/tokens.css","./themes/*":"./dist-lib/themes/*","./package.json":"./package.json"},"main":"./dist-lib/index.js","module":"./dist-lib/index.js","types":"./dist-lib/index.d.ts","scripts":{"prepare":"git config core.hooksPath .githooks || true","prepack":"npm run build:lib","dev":"vite","generate:snapshot":"node scripts/generate-manifest-snapshot.mjs","prebuild":"npm run generate:snapshot","build":"tsc -b && vite build","build:lib":"tsup","lint":"eslint .","preview":"vite preview","storybook":"storybook dev -p 6006","build-storybook":"storybook build","build:site":"node scripts/build-site.mjs","check:contrast":"node scripts/check-contrast.mjs","verify:consumer":"node scripts/verify-consumer.mjs","verify:figma-share":"node scripts/verify-figma-share.mjs","export:figma":"node scripts/export-figma.mjs","check:principles":"node scripts/check-principles.mjs","check:figma":"node scripts/check-figma-manifest.mjs","check:upstream-drift":"node scripts/check-upstream-drift.mjs","test":"npm run test:light && npm run test:dark","test:light":"vitest --project storybook run","test:dark":"VITE_SB_THEME=dark vitest --project storybook run"},"peerDependencies":{"react":"^19","react-dom":"^19","tailwindcss":"^4"},"dependencies":{"@fontsource-variable/inter":"^5.2.8","class-variance-authority":"^0.7.1","clsx":"^2.1.1","lucide-react":"^1.17.0","radix-ui":"^1.4.3","shadcn":"^4.10.0","tailwind-merge":"^3.6.0","tw-animate-css":"^1.4.0"},"devDependencies":{"@chromatic-com/storybook":"^5.2.1","@eslint/js":"^10.0.1","@fission-ai/openspec":"^1.10.0","@storybook/addon-a11y":"^10.4.2","@storybook/addon-docs":"^10.4.2","@storybook/addon-mcp":"^0.6.0","@storybook/addon-vitest":"^10.4.2","@storybook/react-vite":"^10.4.2","@tailwindcss/vite":"^4.3.0","@types/node":"^24.12.3","@types/react":"^19.2.14","@types/react-dom":"^19.2.3","@vitejs/plugin-react":"^6.0.1","@vitest/browser-playwright":"^4.1.8","@vitest/coverage-v8":"^4.1.8","eslint":"^10.3.0","eslint-plugin-react-hooks":"^7.1.1","eslint-plugin-react-refresh":"^0.5.2","eslint-plugin-storybook":"^10.4.2","globals":"^17.6.0","playwright":"^1.60.0","react":"^19.2.6","react-dom":"^19.2.6","storybook":"^10.4.2","tailwindcss":"^4.3.0","tsup":"^8.5.0","typescript":"~6.0.2","typescript-eslint":"^8.59.2","vite":"^8.0.12","vitest":"^4.1.8"},"gitHead":"99d771393df053a5fbb39533aa2d1f6aa0915f1d","_id":"@beckharrisdesign/mvds@0.4.0","_nodeVersion":"22.23.2","_npmVersion":"11.19.0","dist":{"integrity":"sha512-0N10PTDENwpAFeC6yvfzX7eizHVUTJOTIgjWVHCDo73RAn3ZNH6BF56Ao+NLsiZuM5eszPVsZC8g9JDAzCxmJQ==","shasum":"01bf91a560bce77e6a00f60cb6f3fac29036771a","tarball":"https://registry.npmjs.org/@beckharrisdesign/mvds/-/mvds-0.4.0.tgz","fileCount":8,"unpackedSize":98736,"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@beckharrisdesign%2fmvds@0.4.0","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCICIFL9rPIllSS+HRkIsSbDKJaKXdL2+Z95eOMIqxzjBPAiEA4ZkvUvkgVG8Hv2O7G73jyx224hk1/wUABWJ7pH3wQuE="}]},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:b59cddf5-2ed6-4122-ad72-b14da30200a7"}},"directories":{},"maintainers":[{"name":"katybeckharris","email":"katy@beckharrisdesign.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/mvds_0.4.0_1787509735702_0.27997947450089367"},"_hasShrinkwrap":false}},"time":{"created":"2026-07-15T23:32:37.681Z","modified":"2026-08-23T18:28:56.222Z","0.2.0":"2026-07-15T23:32:37.949Z","0.3.0":"2026-07-29T20:00:22.573Z","0.4.0":"2026-08-23T18:28:55.873Z"},"bugs":{"url":"https://github.com/beckharrisdesign/mvds/issues"},"license":"MIT","homepage":"https://github.com/beckharrisdesign/mvds#readme","repository":{"type":"git","url":"git+https://github.com/beckharrisdesign/mvds.git"},"description":"MVDS — Minimum Viable Design System. An agent-first design system for early startup prototyping with solid foundational design strategy.","maintainers":[{"name":"katybeckharris","email":"katy@beckharrisdesign.com"}],"readme":"# MVDS — Minimum Viable Design System\n\nAn **agent-first design system** for early startup prototyping with solid\nfoundational design strategy. It encodes intent in code — tokens, an 8-point\nspacing grid, a type ramp, and layout primitives — so both people and LLM agents\ngenerate consistent, on-brand UI from day one.\n\nUnder the hood it proves a strong link between shadcn/ui + Tailwind code and Figma\ncomponents, with **code as the single source of truth**.\n\n> Built for a **Figma Pro** plan (not Enterprise). The sync is intentionally\n> **one-way, code → Figma**, and re-runnable. See [`docs/SYNC.md`](docs/SYNC.md).\n>\n> **Live Figma mirror:** [MVDS Core](https://www.figma.com/design/C20nU0mROzk3Zr0I9BELJF/MVDS-Core?node-id=0-1&t=w5EqXarr3p4eYxpC-1) (public view-only)\n\n## Stack\n\n| Layer | Choice |\n| --- | --- |\n| Build | Vite 8 + React 19 + TypeScript 6 |\n| Styling | Tailwind CSS v4 (CSS-first `@theme`) |\n| Components | shadcn/ui (`radix-nova`, CSS variables) |\n| Gallery | Storybook 10 (`@storybook/react-vite`) |\n| Figma link | Figma MCP `/figma-generate-library` (Plugin API) |\n\n## The keystone\n\n[`src/index.css`](src/index.css) is the **token layer** — the single source of truth.\nEdit tokens only there. `:root` is the light mode, `.dark` is the dark mode; these are\nthe two modes that map to Figma variable modes. Tailwind, Storybook, and the Figma\ngenerator all read this one file.\n\n## Foundations (app DNA)\n\nThe scales and layout primitives that sit *beneath* components:\n\n- **Spacing scale** — 8-point grid (multiples of 8, with 4 as the only half-step);\n  primitive props take px values directly (`gap={16}`). Tailwind's 4px atomic unit\n  is kept so shadcn control internals keep their optical metrics.\n- **Typography ramp** — semantic `text-display` → `text-caption`, each carrying\n  size + line-height + weight + tracking (defined in [`src/index.css`](src/index.css)).\n- **Breakpoints** — `sm`/`md`/`lg`/`xl`/`2xl`, used by the Container and `@container` queries.\n- **Layout primitives** ([`src/components/layout/`](src/components/layout)) — `Container`,\n  `Stack`, `Inline`, `Grid`/`GridItem` (responsive cols), `Spacer`, `Section`,\n  `Layer`, `Chrome`. Thin typed Tailwind wrappers whose props snap to the\n  spacing/breakpoint scales. *shadcn ships none of these — this is the\n  deliberate, opinionated layout layer.*\n\nSee them under **Foundations/** in Storybook.\n\n## Components\n\nDeliberately small, but complete enough that a first screen needs zero custom\ncontrols:\n\n- **Controls** (`src/components/ui/`, shadcn-sourced + MVDS-tuned) — `Button`,\n  `Badge`, `Card`, `Label`, `Input`, `Textarea`, `Select`, `Checkbox`,\n  `RadioGroup`, `Switch`.\n- **Form patterns** (`src/components/forms/`, MVDS-authored) — `Field` (the\n  label/help/error scaffold every control plugs into) and `Dropzone`\n  (drag / drop / paste / picker file selection).\n- **Blocks** (`src/components/blocks/`) — `Hero`, `Callout`, `Blockquote`,\n  `MediaFrame`.\n\nAdd more anytime: `npx shadcn@latest add dialog tabs …` — then re-apply the\n8-grid tuning pass (`src/components/ui/CLAUDE.md`).\n\n## Getting started\n\n```bash\nnpm install\nnpm run dev              # demo app — Card + Button, with a light/dark toggle\nnpm run storybook        # the living component gallery at http://localhost:6006\n```\n\n`npm install` also provides the repo's dev CLIs — notably `npx openspec` for the\npropose → design → apply loop in [`openspec/`](openspec/README.md). Working in a\n**git worktree**? Run `npm install` inside it; it needs its own `node_modules`.\n\n## Using MVDS in an app\n\nPublished to the **public npm registry** — no `.npmrc`, no login, no token.\nTwo steps:\n\n**1. Install:**\n```bash\nnpm install @beckharrisdesign/mvds\n```\n\n**2. Wire the CSS** (in your global stylesheet, e.g. `app/globals.css`):\n```css\n@import \"@beckharrisdesign/mvds/styles.css\";\n@source \"../node_modules/@beckharrisdesign/mvds/dist-lib/**/*.js\";\n@source \"../**/*.{ts,tsx}\";\n```\n> The `@source` line pointing at `dist-lib` is the one people forget — without it\n> Tailwind never generates the components' utilities and they render unstyled.\n\nOr skip the wiring entirely and copy [`examples/starter/`](examples/starter) — a\ncomplete working app. CI builds it against the published package on every PR\n(`npm run verify:consumer`), so those instructions are verified, not just written.\n\nThen import components:\n```tsx\nimport { Button, Card, Input, Field, Dropzone, Stack, Inline, Grid, Container } from \"@beckharrisdesign/mvds\"\n```\n\nFull ingestion runbook (auth, dark mode, theming, troubleshooting):\n[`docs/CONSUMING.md`](docs/CONSUMING.md). Brand overrides (colors, font, radius):\n[`docs/THEMING.md`](docs/THEMING.md). Reference consumer: `bhd-headless-notion`.\n\n## The code → Figma sync\n\n```bash\n# 1. build / edit components in src/components/ui/*  (tokens in src/index.css)\n# 2. verify in Storybook\n# 3. push to Figma — in this agent, run:\n/figma-generate-library\n```\n\nFull workflow, Pro-tier constraints, and the future-proofing notes live in\n[`docs/SYNC.md`](docs/SYNC.md).\n\n## Project layout\n\n```\nsrc/\n  index.css              ← TOKEN LAYER (source of truth: @theme + :root + .dark)\n  components/ui/         ← shadcn-sourced controls, MVDS-tuned (+ co-located stories)\n  components/forms/      ← Field + Dropzone (MVDS-authored form patterns)\n  components/layout/     ← the layout primitives + scales.ts\n  components/blocks/     ← Hero, Callout, Blockquote, MediaFrame\n  lib/utils.ts           ← cn() helper\n  App.tsx                ← demo composition\n.storybook/              ← Storybook config (preview imports the token layer)\ndocs/SYNC.md             ← the re-runnable code → Figma workflow\ndocs/CONSUMING.md        ← install + wire MVDS into an app (agent-followable)\ndocs/THEMING.md          ← brand a consumer app via the token cascade\ndocs/VERIFICATION.md     ← How we enforce (plan → code → test → out in the world)\ncode-connect/            ← dormant on Pro; activate after an Org/Enterprise upgrade\n```\n","readmeFilename":"README.md"}