{"_id":"@dmc--98/dfe-tokens","name":"@dmc--98/dfe-tokens","dist-tags":{"latest":"1.0.0"},"versions":{"1.0.0":{"name":"@dmc--98/dfe-tokens","version":"1.0.0","description":"Canonical design tokens (Graphite & Teal) for Dynamic Form Engine — CSS custom properties + typed token object","license":"MIT","type":"module","main":"./dist/index.cjs","module":"./dist/index.js","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./tokens.css":"./tokens.css","./motion.css":"./motion.css"},"devDependencies":{"tsup":"^8.0.0","typescript":"^5.4.0","vitest":"^1.6.0"},"keywords":["design-tokens","css-variables","theme","dynamic-form-engine","design-system"],"repository":{"type":"git","url":"git+https://github.com/dmc-98/dynamic-form-engine.git","directory":"packages/tokens"},"homepage":"https://github.com/dmc-98/dynamic-form-engine#readme","bugs":{"url":"https://github.com/dmc-98/dynamic-form-engine/issues"},"scripts":{"build":"tsup src/index.ts --format cjs,esm --dts --clean","test":"vitest run","test:watch":"vitest","typecheck":"tsc --noEmit","lint":"eslint src/","clean":"rm -rf dist"},"_id":"@dmc--98/dfe-tokens@1.0.0","_integrity":"sha512-nkXvVJRd2dZKCBEJvxbvhfx6wd8pt/Rv+AeEx0Uwo6591CYxgc/ETrEmdpHu7z9GcfTWqnorD8qB5VwpehUbmA==","_resolved":"/tmp/537eb3abdd1b59b616b861a119d7d07b/dmc--98-dfe-tokens-1.0.0.tgz","_from":"file:dmc--98-dfe-tokens-1.0.0.tgz","_nodeVersion":"20.20.2","_npmVersion":"10.8.2","dist":{"integrity":"sha512-nkXvVJRd2dZKCBEJvxbvhfx6wd8pt/Rv+AeEx0Uwo6591CYxgc/ETrEmdpHu7z9GcfTWqnorD8qB5VwpehUbmA==","shasum":"3cb4f2781423111dc614ad11e8f54bb5dd17904b","tarball":"https://registry.npmjs.org/@dmc--98/dfe-tokens/-/dfe-tokens-1.0.0.tgz","fileCount":9,"unpackedSize":29898,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCICzGxXmUGUp327WHlFA/UbqTFunjhkErgsMeiYjio8RdAiEAli0SE5cQ7LrbWV4zDQkAn8nsUGR5zAVD0pu/fIBU5+4="}]},"_npmUser":{"name":"dmc--98","email":"snarjun98claude@gmail.com"},"directories":{},"maintainers":[{"name":"dmc--98","email":"snarjun98claude@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/dfe-tokens_1.0.0_1781264331383_0.49096610247079187"},"_hasShrinkwrap":false}},"time":{"created":"2026-06-12T11:38:51.242Z","1.0.0":"2026-06-12T11:38:51.495Z","modified":"2026-06-12T11:38:51.683Z"},"maintainers":[{"name":"dmc--98","email":"snarjun98claude@gmail.com"}],"description":"Canonical design tokens (Graphite & Teal) for Dynamic Form Engine — CSS custom properties + typed token object","homepage":"https://github.com/dmc-98/dynamic-form-engine#readme","keywords":["design-tokens","css-variables","theme","dynamic-form-engine","design-system"],"repository":{"type":"git","url":"git+https://github.com/dmc-98/dynamic-form-engine.git","directory":"packages/tokens"},"bugs":{"url":"https://github.com/dmc-98/dynamic-form-engine/issues"},"license":"MIT","readme":"# @dmc--98/dfe-tokens\n\nCanonical design tokens for Dynamic Form Engine — the **\"Graphite & Teal\"**\nvisual language. Framework-agnostic and the single source of truth every DFE\nsurface (renderer, builder, dashboard, playground, marketing, docs) consumes.\n\n## What ships\n\n- **`tokens.css`** — the full canonical set of `--dfe-*` CSS custom properties:\n  primitive ramps (slate, teal, status, data-viz), a semantic layer, dark mode\n  (`[data-dfe-color-scheme=\"dark\"]` / `auto`), plus motion, radius, elevation and\n  z-index scales. Scoped to `[data-dfe-theme]` so host pages stay isolated.\n- **`dfeDefaultTheme`** — the runtime-overridable semantic subset (light-mode\n  projection) used by the React `DfeThemeProvider`.\n- **`dfeDataPalette`** — 6-color categorical palette for dashboard charts.\n- **`DFE_BRAND`** — brand invariants (primary accent, font stack).\n\n## Usage\n\nStylesheet surfaces (Astro, Docusaurus, Storybook, plain HTML):\n\n```css\n@import \"@dmc--98/dfe-tokens/tokens.css\";\n```\n\n```html\n<div data-dfe-theme data-dfe-color-scheme=\"auto\"> … </div>\n```\n\nReact (runtime theming / overrides):\n\n```ts\nimport { dfeDefaultTheme, type DfeThemeTokens } from \"@dmc--98/dfe-tokens\"\n```\n\n## Layering rule\n\nComponents consume the **semantic** layer only (`--dfe-color-surface`,\n`--dfe-color-primary`, …). Never reference primitives (`--dfe-slate-500`) directly.\nDark mode and re-theming work by remapping the semantic layer; primitives are\nconstant.\n\nBrand/anti-drift invariants are enforced by `__tests__/tokens.test.ts`.\n","readmeFilename":"README.md","_rev":"1-b511132df11c71a51202686fcf0162c4"}