@vantageos/mosaic 0.3.0 → 0.4.0

package/dist/tokens.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../mosaic-tokens/src/tokens.ts"],"names":[],"mappings":";AA8BO,IAAM,MAAA,GAAiC,OAAO,MAAA,CAAO;AAAA,EAC1D,YAAA,EAAc,wBAAA;AAAA,EACd,aAAA,EAAe,wBAAA;AAAA,EACf,aAAA,EAAe,wBAAA;AAAA,EACf,YAAA,EAAc,uBAAA;AAAA,EACd,aAAA,EAAe,uBAAA;AAAA,EACf,aAAA,EAAe,uBAAA;AAAA,EACf,WAAA,EAAa,uBAAA;AAAA,EACb,YAAA,EAAc,uBAAA;AAAA,EACd,YAAA,EAAc,uBAAA;AAAA,EACd,SAAA,EAAW,wBAAA;AAAA,EACX,UAAA,EAAY,wBAAA;AAAA,EACZ,UAAA,EAAY,wBAAA;AAAA,EACZ,YAAA,EAAc,wBAAA;AAAA,EACd,aAAA,EAAe,wBAAA;AAAA,EACf,aAAA,EAAe;AACjB,CAAC;AAGM,IAAM,OAAA,GAAmC,OAAO,MAAA,CAAO;AAAA,EAC5D,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,MAAA;AAAA,EACL,GAAA,EAAK,MAAA;AAAA,EACL,GAAA,EAAK,MAAA;AAAA,EACL,GAAA,EAAK,MAAA;AAAA,EACL,IAAA,EAAM,MAAA;AAAA,EACN,IAAA,EAAM;AACR,CAAC;AAGM,IAAM,UAAA,GAAyC,OAAO,MAAA,CAAO;AAAA,EAClE,SAAA,EAAW,MAAA;AAAA,EACX,SAAA,EAAW,MAAA;AAAA,EACX,WAAA,EAAa,MAAA;AAAA,EACb,SAAA,EAAW,MAAA;AAAA,EACX,SAAA,EAAW,MAAA;AAAA,EACX,UAAA,EAAY,MAAA;AAAA,EACZ,UAAA,EAAY,MAAA;AAAA,EACZ,UAAA,EAAY,KAAA;AAAA,EACZ,WAAA,EAAa,KAAA;AAAA,EACb,YAAA,EAAc,KAAA;AAAA,EACd,gBAAA,EAAkB,KAAA;AAAA,EAClB,eAAA,EAAiB,KAAA;AAAA,EACjB,iBAAA,EAAmB,KAAA;AAAA,EACnB,aAAA,EAAe;AACjB,CAAC;AAGM,IAAM,OAAA,GAAmC,OAAO,MAAA,CAAO;AAAA,EAC5D,GAAA,EAAK,MAAA;AAAA,EACL,GAAA,EAAK,2CAAA;AAAA,EACL,GAAA,EAAK,4FAAA;AAAA,EACL,GAAA,EAAK,4FAAA;AAAA,EACL,GAAA,EAAK,6FAAA;AAAA,EACL,GAAA,EAAK;AACP,CAAC;AAGM,IAAM,KAAA,GAA+B,OAAO,MAAA,CAAO;AAAA,EACxD,IAAA,EAAM,KAAA;AAAA,EACN,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI,KAAA;AAAA,EACJ,EAAA,EAAI,MAAA;AAAA,EACJ,IAAA,EAAM;AACR,CAAC;AAGM,IAAM,MAAA,GAAiC,OAAO,MAAA,CAAO;AAAA,EAC1D,eAAA,EAAiB,MAAA;AAAA,EACjB,eAAA,EAAiB,OAAA;AAAA,EACjB,eAAA,EAAiB,OAAA;AAAA,EACjB,eAAA,EAAiB,QAAA;AAAA,EACjB,aAAA,EAAe,8BAAA;AAAA,EACf,WAAA,EAAa,4BAAA;AAAA,EACb,YAAA,EAAc,4BAAA;AAAA,EACd,eAAA,EAAiB;AACnB,CAAC;AAEM,IAAM,MAAA,GAAuB,OAAO,MAAA,CAAO;AAAA,EAChD,MAAA;AAAA,EACA,OAAA;AAAA,EACA,UAAA;AAAA,EACA,OAAA;AAAA,EACA,KAAA;AAAA,EACA;AACF,CAAC;AAED,IAAO,cAAA,GAAQ","file":"tokens.js","sourcesContent":["/**\n * @vantageos/mosaic-tokens — design tokens (T3-B implementation).\n *\n * Framework-free, OKLCH-based, mirror of the CSS custom properties in\n * tokens.css. Consumers can opt for either the CSS surface (Tailwind v4\n * + @theme inline) or the JS surface (typed runtime access in JSX styles,\n * Storybook stories, Playwright assertions, snapshot tests).\n *\n * Size targets (.size-limit.json): JS bundle ≤5 KB gz, CSS ≤3 KB gz.\n *\n * Schema invariants (enforced by mosaic-tokens-coherence-test in T3-C):\n *   - Every CSS var has a JS counterpart (and vice versa).\n *   - Color shades 50 < 500 < 700 monotonic luminance.\n *   - Spacing scale ascending, ratio 1.5x average (4 → 64 px).\n *   - Typography scale uses 1.25x ratio (12 → 38 px).\n *   - Shadow elevation 0 < 1 < 2 < 3 < 4 < 5 monotonic blur radius.\n *   - Radii strictly ascending (none → full).\n */\n\nexport interface MosaicTokens {\n  readonly colors: Readonly<Record<string, string>>;\n  readonly spacing: Readonly<Record<string, string>>;\n  readonly typography: Readonly<Record<string, string>>;\n  readonly shadows: Readonly<Record<string, string>>;\n  readonly radii: Readonly<Record<string, string>>;\n  readonly motion: Readonly<Record<string, string>>;\n}\n\n// Colors — semantic statuses × 3 shades (50/500/700), OKLCH.\n// 50 = surface tint, 500 = brand body, 700 = accessible contrast on light bg.\nexport const colors: MosaicTokens[\"colors\"] = Object.freeze({\n  \"success-50\": \"oklch(0.965 0.040 145)\",\n  \"success-500\": \"oklch(0.660 0.180 145)\",\n  \"success-700\": \"oklch(0.470 0.140 145)\",\n  \"warning-50\": \"oklch(0.975 0.045 85)\",\n  \"warning-500\": \"oklch(0.770 0.170 85)\",\n  \"warning-700\": \"oklch(0.560 0.145 65)\",\n  \"danger-50\": \"oklch(0.965 0.035 25)\",\n  \"danger-500\": \"oklch(0.640 0.205 25)\",\n  \"danger-700\": \"oklch(0.460 0.180 25)\",\n  \"info-50\": \"oklch(0.970 0.035 250)\",\n  \"info-500\": \"oklch(0.650 0.170 250)\",\n  \"info-700\": \"oklch(0.460 0.150 250)\",\n  \"neutral-50\": \"oklch(0.980 0.005 250)\",\n  \"neutral-500\": \"oklch(0.580 0.012 250)\",\n  \"neutral-700\": \"oklch(0.380 0.010 250)\",\n});\n\n// Spacing — 4 → 64 px scale.\nexport const spacing: MosaicTokens[\"spacing\"] = Object.freeze({\n  \"1\": \"4px\",\n  \"2\": \"8px\",\n  \"3\": \"12px\",\n  \"4\": \"16px\",\n  \"6\": \"24px\",\n  \"8\": \"32px\",\n  \"12\": \"48px\",\n  \"16\": \"64px\",\n});\n\n// Typography — 1.25x font-size scale + line-height + weight.\nexport const typography: MosaicTokens[\"typography\"] = Object.freeze({\n  \"size-xs\": \"12px\",\n  \"size-sm\": \"14px\",\n  \"size-base\": \"16px\",\n  \"size-lg\": \"20px\",\n  \"size-xl\": \"24px\",\n  \"size-2xl\": \"30px\",\n  \"size-3xl\": \"38px\",\n  \"lh-tight\": \"1.2\",\n  \"lh-normal\": \"1.5\",\n  \"lh-relaxed\": \"1.6\",\n  \"weight-regular\": \"400\",\n  \"weight-medium\": \"500\",\n  \"weight-semibold\": \"600\",\n  \"weight-bold\": \"700\",\n});\n\n// Shadows — 6 elevation steps, OKLCH neutral tint.\nexport const shadows: MosaicTokens[\"shadows\"] = Object.freeze({\n  \"0\": \"none\",\n  \"1\": \"0 1px 2px 0 oklch(0.200 0.010 250 / 0.05)\",\n  \"2\": \"0 2px 4px -1px oklch(0.200 0.010 250 / 0.08), 0 1px 2px -1px oklch(0.200 0.010 250 / 0.06)\",\n  \"3\": \"0 4px 8px -2px oklch(0.200 0.010 250 / 0.10), 0 2px 4px -2px oklch(0.200 0.010 250 / 0.06)\",\n  \"4\": \"0 8px 16px -4px oklch(0.200 0.010 250 / 0.12), 0 4px 8px -4px oklch(0.200 0.010 250 / 0.08)\",\n  \"5\": \"0 16px 32px -8px oklch(0.200 0.010 250 / 0.16), 0 8px 16px -8px oklch(0.200 0.010 250 / 0.10)\",\n});\n\n// Radii — strictly ascending (none → full).\nexport const radii: MosaicTokens[\"radii\"] = Object.freeze({\n  none: \"0px\",\n  xs: \"2px\",\n  sm: \"4px\",\n  md: \"6px\",\n  lg: \"8px\",\n  xl: \"12px\",\n  full: \"9999px\",\n});\n\n// Motion — durations + easing curves.\nexport const motion: MosaicTokens[\"motion\"] = Object.freeze({\n  \"duration-fast\": \"75ms\",\n  \"duration-base\": \"150ms\",\n  \"duration-slow\": \"300ms\",\n  \"easing-linear\": \"linear\",\n  \"easing-ease\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n  \"easing-in\": \"cubic-bezier(0.4, 0, 1, 1)\",\n  \"easing-out\": \"cubic-bezier(0, 0, 0.2, 1)\",\n  \"easing-in-out\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n});\n\nexport const tokens: MosaicTokens = Object.freeze({\n  colors,\n  spacing,\n  typography,\n  shadows,\n  radii,\n  motion,\n});\n\nexport default tokens;\n"]}
+{"version":3,"sources":["../../mosaic-tokens/src/tokens.ts"],"names":[],"mappings":"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","file":"tokens.js","sourcesContent":["/**\n * @vantageos/mosaic-tokens — design tokens (neutral generic semantic defaults).\n *\n * Default semantic palette: neutral shadcn-grayscale (light values below;\n * dark values live in tokens.css [data-theme=\"dark\"]), sourced from\n * @vantageos/mosaic-blocks src/styles.css (canonical). The any-debate-ai\n * design language (bright/clean light + sophisticated dark, blue accent\n * oklch(0.7 0.15 240)) is NOT the canonical default — it is an opt-in\n * consumer override, see examples/anydebate-override.css.\n *\n * The status triads below (success/warning/danger/info/neutral) still carry\n * their original any-debate-ai-derived values — unchanged by this realign.\n *\n * Framework-free, OKLCH-based, mirror of the CSS custom properties in\n * tokens.css. Consumers can opt for either the CSS surface (Tailwind v4\n * + @theme inline) or the JS surface (typed runtime access in JSX styles,\n * Storybook stories, Playwright assertions, snapshot tests).\n *\n * Size targets (.size-limit.json): JS bundle ≤5 KB gz, CSS ≤3 KB gz.\n *\n * Schema invariants (enforced by mosaic-tokens-coherence-test):\n *   - Every CSS var has a JS counterpart (and vice versa).\n *   - Color shades 50 < 500 < 700 monotonic luminance (light mode).\n *   - Spacing scale ascending, ratio 1.5x average (4 → 64 px).\n *   - Typography scale uses 1.25x ratio (12 → 38 px).\n *   - Shadow elevation 0 < 1 < 2 < 3 < 4 < 5 monotonic blur radius.\n *   - Radii strictly ascending (none → full).\n *\n * KEY COMPATIBILITY: all keys present in 0.2.1 are preserved unchanged.\n * New additive keys in 0.3.0:\n *   colors: background, foreground, card, card-foreground, popover,\n *           popover-foreground, primary, primary-foreground, secondary,\n *           secondary-foreground, muted, muted-foreground, accent,\n *           accent-foreground, destructive, destructive-foreground,\n *           border, input, ring (semantic UI slots from anydebate)\n *   typography: font-sans, font-mono (font-family tokens)\n *   motion: duration-slower (500ms entrance animation)\n */\n\nexport interface MosaicTokens {\n  readonly colors: Readonly<Record<string, string>>;\n  readonly spacing: Readonly<Record<string, string>>;\n  readonly typography: Readonly<Record<string, string>>;\n  readonly shadows: Readonly<Record<string, string>>;\n  readonly radii: Readonly<Record<string, string>>;\n  readonly motion: Readonly<Record<string, string>>;\n}\n\n// ---------------------------------------------------------------------------\n// Colors — semantic statuses × 3 shades (50/500/700) OKLCH + semantic UI slots.\n// 50 = surface tint, 500 = brand body, 700 = accessible contrast on light bg.\n//\n// Status triads (danger/info/neutral) and semantic UI slots (destructive/\n// primary/etc.) are SEPARATE token families that happen to share an OKLCH\n// design system — they are not aliases of each other:\n//   danger-500 (status, unchanged) = oklch(0.577 0.245 27) — close to, but\n//     NOT identical to, destructive (semantic slot, now neutral-sourced) =\n//     oklch(0.577 0.245 27.325). Coincidence of the neutral default, not a\n//     mapping.\n//   info-500 (status, unchanged, any-debate-ai blue) = oklch(0.7 0.15 240) —\n//     primary (semantic slot) is now neutral oklch(0.205 0 0), NOT the blue\n//     accent. An earlier version of this file conflated the two; they are\n//     different tokens.\n//   neutral-50/700 (status triad, unchanged) = oklch(0.98 0 0) / oklch(0.15 0 0).\n//\n// Additive semantic UI keys mirror shadcn's CSS custom property names\n// (background, foreground, card, etc.) for drop-in compatibility with\n// shadcn-based consumers (including any-debate-ai, via the opt-in override\n// in examples/anydebate-override.css).\n// ---------------------------------------------------------------------------\nexport const colors: MosaicTokens[\"colors\"] = Object.freeze({\n  // Status palette (preserved keys, anydebate-updated values)\n  \"success-50\": \"oklch(0.965 0.040 145)\",\n  \"success-500\": \"oklch(0.660 0.180 145)\",\n  \"success-700\": \"oklch(0.470 0.140 145)\",\n  \"warning-50\": \"oklch(0.975 0.045 85)\",\n  \"warning-500\": \"oklch(0.770 0.170 85)\",\n  \"warning-700\": \"oklch(0.560 0.145 65)\",\n  // anydebate destructive: oklch(0.577 0.245 27.325)\n  \"danger-50\": \"oklch(0.965 0.035 27)\",\n  \"danger-500\": \"oklch(0.577 0.245 27)\",\n  \"danger-700\": \"oklch(0.400 0.180 27)\",\n  // anydebate info/primary accent (dark mode blue): oklch(0.7 0.15 240)\n  \"info-50\": \"oklch(0.970 0.030 240)\",\n  \"info-500\": \"oklch(0.700 0.150 240)\",\n  \"info-700\": \"oklch(0.500 0.130 240)\",\n  // anydebate neutral axis — light: bg oklch(0.98 0 0), fg oklch(0.15 0 0)\n  \"neutral-50\": \"oklch(0.980 0 0)\",\n  \"neutral-500\": \"oklch(0.450 0 0)\",\n  \"neutral-700\": \"oklch(0.150 0 0)\",\n\n  // Additive semantic UI slots — neutral generic defaults (light mode),\n  // sourced from @vantageos/mosaic-blocks src/styles.css :root. Any-debate-ai's\n  // brand values now live only in examples/anydebate-override.css.\n  background: \"oklch(1 0 0)\",\n  foreground: \"oklch(0.145 0 0)\",\n  card: \"oklch(1 0 0)\",\n  \"card-foreground\": \"oklch(0.145 0 0)\",\n  popover: \"oklch(1 0 0)\",\n  \"popover-foreground\": \"oklch(0.145 0 0)\",\n  primary: \"oklch(0.205 0 0)\",\n  \"primary-foreground\": \"oklch(0.985 0 0)\",\n  secondary: \"oklch(0.97 0 0)\",\n  \"secondary-foreground\": \"oklch(0.205 0 0)\",\n  muted: \"oklch(0.97 0 0)\",\n  \"muted-foreground\": \"oklch(0.556 0 0)\",\n  accent: \"oklch(0.97 0 0)\",\n  \"accent-foreground\": \"oklch(0.205 0 0)\",\n  destructive: \"oklch(0.577 0.245 27.325)\",\n  \"destructive-foreground\": \"oklch(0.985 0 0)\",\n  border: \"oklch(0.922 0 0)\",\n  input: \"oklch(0.922 0 0)\",\n  ring: \"oklch(0.708 0 0)\",\n\n  // Sidebar (v0.3.1) — EXACTLY 4 keys, derived from real consumption on the\n  // one real consumer (mosaic-blocks). See tokens.css for the derivation\n  // command and the declared-divergence rationale for NOT shipping the\n  // other 4 of the shadcn 8-var convention.\n  sidebar: \"oklch(1 0 0)\",\n  \"sidebar-foreground\": \"oklch(0.145 0 0)\",\n  \"sidebar-accent\": \"oklch(0.97 0 0)\",\n  \"sidebar-border\": \"oklch(0.922 0 0)\",\n\n  // Chart series (v0.3.1) — declared divergence: added on request, not on\n  // measured consumer demand. See tokens.css for rationale. NO alias.\n  \"chart-1\": \"oklch(0.650 0.200 240)\",\n  \"chart-2\": \"oklch(0.650 0.180 145)\",\n  \"chart-3\": \"oklch(0.700 0.170 85)\",\n  \"chart-4\": \"oklch(0.600 0.220 27)\",\n  \"chart-5\": \"oklch(0.550 0.180 300)\",\n});\n\n// ---------------------------------------------------------------------------\n// Spacing — 4 → 64 px scale (unchanged from 0.2.1).\n// ---------------------------------------------------------------------------\nexport const spacing: MosaicTokens[\"spacing\"] = Object.freeze({\n  \"1\": \"4px\",\n  \"2\": \"8px\",\n  \"3\": \"12px\",\n  \"4\": \"16px\",\n  \"6\": \"24px\",\n  \"8\": \"32px\",\n  \"12\": \"48px\",\n  \"16\": \"64px\",\n});\n\n// ---------------------------------------------------------------------------\n// Typography — 1.25x font-size scale + line-height + weight + font families.\n// anydebate uses Inter (primary) and Geist Mono for code.\n// New additive keys: font-sans, font-mono.\n// ---------------------------------------------------------------------------\nexport const typography: MosaicTokens[\"typography\"] = Object.freeze({\n  // Font families (additive)\n  \"font-sans\": \"Inter, ui-sans-serif, system-ui, sans-serif\",\n  \"font-mono\": 'ui-monospace, \"Geist Mono\", \"Cascadia Code\", monospace',\n  // Size scale (preserved keys, values unchanged — scale invariant maintained)\n  \"size-xs\": \"12px\",\n  \"size-sm\": \"14px\",\n  \"size-base\": \"16px\",\n  \"size-lg\": \"20px\",\n  \"size-xl\": \"24px\",\n  \"size-2xl\": \"30px\",\n  \"size-3xl\": \"38px\",\n  // Line heights (preserved)\n  \"lh-tight\": \"1.2\",\n  \"lh-normal\": \"1.5\",\n  \"lh-relaxed\": \"1.6\",\n  // Weights (preserved)\n  \"weight-regular\": \"400\",\n  \"weight-medium\": \"500\",\n  \"weight-semibold\": \"600\",\n  \"weight-bold\": \"700\",\n});\n\n// ---------------------------------------------------------------------------\n// Shadows — 6 elevation steps, anydebate near-black tint (oklch(0.04 0 0)).\n// ---------------------------------------------------------------------------\nexport const shadows: MosaicTokens[\"shadows\"] = Object.freeze({\n  \"0\": \"none\",\n  \"1\": \"0 1px 2px 0 oklch(0.040 0 0 / 0.05)\",\n  \"2\": \"0 2px 4px -1px oklch(0.040 0 0 / 0.08), 0 1px 2px -1px oklch(0.040 0 0 / 0.06)\",\n  \"3\": \"0 4px 8px -2px oklch(0.040 0 0 / 0.10), 0 2px 4px -2px oklch(0.040 0 0 / 0.06)\",\n  \"4\": \"0 8px 16px -4px oklch(0.040 0 0 / 0.12), 0 4px 8px -4px oklch(0.040 0 0 / 0.08)\",\n  \"5\": \"0 16px 32px -8px oklch(0.040 0 0 / 0.16), 0 8px 16px -8px oklch(0.040 0 0 / 0.10)\",\n});\n\n// ---------------------------------------------------------------------------\n// Radii — anydebate base 0.75rem (12px), strictly ascending.\n// Source: --radius: 0.75rem + calc-derived scale in app/globals.css.\n// sm = 12px - 4px = 8px, md = 12px - 2px = 10px, lg = 12px, xl = 12px + 4px = 16px.\n// ---------------------------------------------------------------------------\nexport const radii: MosaicTokens[\"radii\"] = Object.freeze({\n  none: \"0px\",\n  xs: \"4px\",\n  sm: \"8px\",\n  md: \"10px\",\n  lg: \"12px\",\n  xl: \"16px\",\n  full: \"9999px\",\n});\n\n// ---------------------------------------------------------------------------\n// Motion — durations + easing curves.\n// anydebate uses tw-animate-css; durations tuned to Tailwind defaults.\n// New additive key: duration-slower (500ms) for entrance animations.\n// ---------------------------------------------------------------------------\nexport const motion: MosaicTokens[\"motion\"] = Object.freeze({\n  \"duration-fast\": \"100ms\",\n  \"duration-base\": \"200ms\",\n  \"duration-slow\": \"300ms\",\n  \"duration-slower\": \"500ms\",\n  \"easing-linear\": \"linear\",\n  \"easing-ease\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n  \"easing-in\": \"cubic-bezier(0.4, 0, 1, 1)\",\n  \"easing-out\": \"cubic-bezier(0, 0, 0.2, 1)\",\n  \"easing-in-out\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n  // Declared divergence (v0.3.1): no proven consumer, added per Pi\n  // arbitration. NO alias — see tokens.css for rationale.\n  \"easing-out-expo\": \"cubic-bezier(0.16, 1, 0.3, 1)\",\n});\n\nexport const tokens: MosaicTokens = Object.freeze({\n  colors,\n  spacing,\n  typography,\n  shadows,\n  radii,\n  motion,\n});\n\nexport default tokens;\n"]}

package/package.json

@@ -1,231 +1,234 @@
 {
-  "name": "@vantageos/mosaic",
-  "version": "0.3.0",
-  "description": "Fleet-wide MCP UI design system — 6-category taxonomy, Zod-validated, registry-gated, streaming-ready, cross-runtime (React 19 + Preact 10).",
-  "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"
-    },
-    "./progress": {
-      "types": "./dist/progress.d.ts",
-      "import": "./dist/progress.js",
-      "require": "./dist/progress.cjs"
-    },
-    "./input": {
-      "types": "./dist/input.d.ts",
-      "import": "./dist/input.js",
-      "require": "./dist/input.cjs"
-    },
-    "./display": {
-      "types": "./dist/display.d.ts",
-      "import": "./dist/display.js",
-      "require": "./dist/display.cjs"
-    },
-    "./artifacts": {
-      "types": "./dist/artifacts.d.ts",
-      "import": "./dist/artifacts.js",
-      "require": "./dist/artifacts.cjs"
-    },
-    "./confirmation": {
-      "types": "./dist/confirmation.d.ts",
-      "import": "./dist/confirmation.js",
-      "require": "./dist/confirmation.cjs"
-    },
-    "./media": {
-      "types": "./dist/media.d.ts",
-      "import": "./dist/media.js",
-      "require": "./dist/media.cjs"
-    },
-    "./forms": {
-      "types": "./dist/forms.d.ts",
-      "import": "./dist/forms.js",
-      "require": "./dist/forms.cjs"
-    },
-    "./react": {
-      "types": "./dist/react/index.d.ts",
-      "import": "./dist/react/index.js",
-      "require": "./dist/react/index.cjs"
-    },
-    "./react/progress": {
-      "types": "./dist/react/progress.d.ts",
-      "import": "./dist/react/progress.js",
-      "require": "./dist/react/progress.cjs"
-    },
-    "./react/input": {
-      "types": "./dist/react/input.d.ts",
-      "import": "./dist/react/input.js",
-      "require": "./dist/react/input.cjs"
-    },
-    "./react/display": {
-      "types": "./dist/react/display.d.ts",
-      "import": "./dist/react/display.js",
-      "require": "./dist/react/display.cjs"
-    },
-    "./react/artifacts": {
-      "types": "./dist/react/artifacts.d.ts",
-      "import": "./dist/react/artifacts.js",
-      "require": "./dist/react/artifacts.cjs"
-    },
-    "./react/confirmation": {
-      "types": "./dist/react/confirmation.d.ts",
-      "import": "./dist/react/confirmation.js",
-      "require": "./dist/react/confirmation.cjs"
-    },
-    "./react/media": {
-      "types": "./dist/react/media.d.ts",
-      "import": "./dist/react/media.js",
-      "require": "./dist/react/media.cjs"
-    },
-    "./react/forms": {
-      "types": "./dist/react/forms.d.ts",
-      "import": "./dist/react/forms.js",
-      "require": "./dist/react/forms.cjs"
-    },
-    "./preact": {
-      "types": "./dist/preact/index.d.ts",
-      "import": "./dist/preact/index.js"
-    },
-    "./preact/progress": {
-      "types": "./dist/preact/progress.d.ts",
-      "import": "./dist/preact/progress.js"
-    },
-    "./preact/input": {
-      "types": "./dist/preact/input.d.ts",
-      "import": "./dist/preact/input.js"
-    },
-    "./preact/display": {
-      "types": "./dist/preact/display.d.ts",
-      "import": "./dist/preact/display.js"
-    },
-    "./preact/artifacts": {
-      "types": "./dist/preact/artifacts.d.ts",
-      "import": "./dist/preact/artifacts.js"
-    },
-    "./preact/confirmation": {
-      "types": "./dist/preact/confirmation.d.ts",
-      "import": "./dist/preact/confirmation.js"
-    },
-    "./preact/media": {
-      "types": "./dist/preact/media.d.ts",
-      "import": "./dist/preact/media.js"
-    },
-    "./preact/forms": {
-      "types": "./dist/preact/forms.d.ts",
-      "import": "./dist/preact/forms.js"
-    },
-    "./tokens": {
-      "types": "./dist/tokens.d.ts",
-      "import": "./dist/tokens.js",
-      "require": "./dist/tokens.cjs"
-    },
-    "./server": {
-      "types": "./dist/server.d.ts",
-      "import": "./dist/server.js",
-      "require": "./dist/server.cjs"
-    },
-    "./registry.yaml": "./registry.yaml"
-  },
-  "files": [
-    "dist",
-    "registry.yaml",
-    "README.md",
-    "CHANGELOG.md"
-  ],
-  "sideEffects": false,
-  "scripts": {
-    "prebuild": "node -e \"require('node:fs').rmSync('dist',{recursive:true,force:true})\"",
-    "build": "NODE_OPTIONS=--max-old-space-size=8192 tsup",
-    "dev": "tsup --watch",
-    "test": "vitest run",
-    "lint": "biome check --error-on-warnings src",
-    "size-limit": "size-limit",
-    "build-storybook": "storybook build -o storybook-static",
-    "prepublishOnly": "pnpm run build && pnpm run test && pnpm run size-limit && node scripts/check-eta-gate.js"
-  },
-  "peerDependencies": {
-    "@hookform/resolvers": "^3.10.0",
-    "@mcp-ui/client": "7.1.1",
-    "preact": "^10.25.0",
-    "react": "^19.1.0",
-    "react-dom": "^19.1.0",
-    "react-hook-form": "^7.54.0",
-    "react-i18next": "15.5.2",
-    "rxjs": "^7.8.0"
-  },
-  "peerDependenciesMeta": {
-    "@hookform/resolvers": {
-      "optional": true
-    },
-    "@mcp-ui/client": {
-      "optional": true
-    },
-    "preact": {
-      "optional": true
-    },
-    "react": {
-      "optional": true
-    },
-    "react-dom": {
-      "optional": true
-    },
-    "react-hook-form": {
-      "optional": true
-    },
-    "react-i18next": {
-      "optional": true
-    },
-    "rxjs": {
-      "optional": true
-    }
-  },
-  "dependencies": {
-    "@lit-labs/react": "1.0.6",
-    "@mcp-ui/server": "6.1.0",
-    "@tanstack/react-virtual": "3.13.6",
-    "@vantageos/mosaic-tokens": "workspace:*",
-    "dompurify": "3.2.4",
-    "marked": "15.0.7",
-    "zod": "3.25.28"
-  },
-  "devDependencies": {
-    "@axe-core/playwright": "4.10.1",
-    "@babel/parser": "7.29.7",
-    "@babel/traverse": "7.29.7",
-    "@biomejs/biome": "1.9.4",
-    "@hookform/resolvers": "^3.10.0",
-    "@playwright/test": "1.50.1",
-    "@size-limit/preset-small-lib": "11.2.0",
-    "@storybook/builder-vite": "8.6.18",
-    "@storybook/react": "8.6.18",
-    "@storybook/react-vite": "8.6.18",
-    "@storybook/test-runner": "0.21.0",
-    "@tailwindcss/vite": "4.1.8",
-    "@testing-library/react": "16.3.0",
-    "@testing-library/user-event": "14.6.1",
-    "@types/babel__traverse": "7.28.0",
-    "@types/dompurify": "3.0.5",
-    "@types/react": "19.1.0",
-    "@types/react-dom": "19.1.0",
-    "@vitejs/plugin-react": "4.3.4",
-    "@vitest/coverage-v8": "3.2.2",
-    "jsdom": "26.0.0",
-    "preact": "10.27.1",
-    "react": "19.1.0",
-    "react-dom": "19.1.0",
-    "react-hook-form": "^7.54.0",
-    "size-limit": "11.2.0",
-    "storybook": "8.6.18",
-    "tailwindcss": "4.1.8",
-    "tsup": "8.4.0",
-    "typescript": "5.8.3",
-    "vite": "6.3.5",
-    "vite-plugin-singlefile": "2.1.0",
-    "vitest": "3.2.2"
-  }
-}
+	"name": "@vantageos/mosaic",
+	"version": "0.4.0",
+	"license": "FSL-1.1-Apache-2.0",
+	"description": "Fleet-wide MCP UI design system — 7-category taxonomy, Zod-validated, registry-gated, streaming-ready, cross-runtime (React 19 + Preact 10).",
+	"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"
+		},
+		"./progress": {
+			"types": "./dist/progress.d.ts",
+			"import": "./dist/progress.js",
+			"require": "./dist/progress.cjs"
+		},
+		"./input": {
+			"types": "./dist/input.d.ts",
+			"import": "./dist/input.js",
+			"require": "./dist/input.cjs"
+		},
+		"./display": {
+			"types": "./dist/display.d.ts",
+			"import": "./dist/display.js",
+			"require": "./dist/display.cjs"
+		},
+		"./artifacts": {
+			"types": "./dist/artifacts.d.ts",
+			"import": "./dist/artifacts.js",
+			"require": "./dist/artifacts.cjs"
+		},
+		"./confirmation": {
+			"types": "./dist/confirmation.d.ts",
+			"import": "./dist/confirmation.js",
+			"require": "./dist/confirmation.cjs"
+		},
+		"./media": {
+			"types": "./dist/media.d.ts",
+			"import": "./dist/media.js",
+			"require": "./dist/media.cjs"
+		},
+		"./forms": {
+			"types": "./dist/forms.d.ts",
+			"import": "./dist/forms.js",
+			"require": "./dist/forms.cjs"
+		},
+		"./react": {
+			"types": "./dist/react/index.d.ts",
+			"import": "./dist/react/index.js",
+			"require": "./dist/react/index.cjs"
+		},
+		"./react/progress": {
+			"types": "./dist/react/progress.d.ts",
+			"import": "./dist/react/progress.js",
+			"require": "./dist/react/progress.cjs"
+		},
+		"./react/input": {
+			"types": "./dist/react/input.d.ts",
+			"import": "./dist/react/input.js",
+			"require": "./dist/react/input.cjs"
+		},
+		"./react/display": {
+			"types": "./dist/react/display.d.ts",
+			"import": "./dist/react/display.js",
+			"require": "./dist/react/display.cjs"
+		},
+		"./react/artifacts": {
+			"types": "./dist/react/artifacts.d.ts",
+			"import": "./dist/react/artifacts.js",
+			"require": "./dist/react/artifacts.cjs"
+		},
+		"./react/confirmation": {
+			"types": "./dist/react/confirmation.d.ts",
+			"import": "./dist/react/confirmation.js",
+			"require": "./dist/react/confirmation.cjs"
+		},
+		"./react/media": {
+			"types": "./dist/react/media.d.ts",
+			"import": "./dist/react/media.js",
+			"require": "./dist/react/media.cjs"
+		},
+		"./react/forms": {
+			"types": "./dist/react/forms.d.ts",
+			"import": "./dist/react/forms.js",
+			"require": "./dist/react/forms.cjs"
+		},
+		"./preact": {
+			"types": "./dist/preact/index.d.ts",
+			"import": "./dist/preact/index.js"
+		},
+		"./preact/progress": {
+			"types": "./dist/preact/progress.d.ts",
+			"import": "./dist/preact/progress.js"
+		},
+		"./preact/input": {
+			"types": "./dist/preact/input.d.ts",
+			"import": "./dist/preact/input.js"
+		},
+		"./preact/display": {
+			"types": "./dist/preact/display.d.ts",
+			"import": "./dist/preact/display.js"
+		},
+		"./preact/artifacts": {
+			"types": "./dist/preact/artifacts.d.ts",
+			"import": "./dist/preact/artifacts.js"
+		},
+		"./preact/confirmation": {
+			"types": "./dist/preact/confirmation.d.ts",
+			"import": "./dist/preact/confirmation.js"
+		},
+		"./preact/media": {
+			"types": "./dist/preact/media.d.ts",
+			"import": "./dist/preact/media.js"
+		},
+		"./preact/forms": {
+			"types": "./dist/preact/forms.d.ts",
+			"import": "./dist/preact/forms.js"
+		},
+		"./tokens": {
+			"types": "./dist/tokens.d.ts",
+			"import": "./dist/tokens.js",
+			"require": "./dist/tokens.cjs"
+		},
+		"./server": {
+			"types": "./dist/server.d.ts",
+			"import": "./dist/server.js",
+			"require": "./dist/server.cjs"
+		},
+		"./registry.yaml": "./registry.yaml"
+	},
+	"files": [
+		"dist",
+		"registry.yaml",
+		"README.md",
+		"LICENSE",
+		"CHANGELOG.md"
+	],
+	"sideEffects": false,
+	"scripts": {
+		"prebuild": "node -e \"require('node:fs').rmSync('dist',{recursive:true,force:true})\"",
+		"build": "NODE_OPTIONS=--max-old-space-size=8192 tsup",
+		"dev": "tsup --watch",
+		"test": "vitest run",
+		"lint": "biome check --error-on-warnings src",
+		"size-limit": "size-limit",
+		"build-storybook": "storybook build -o storybook-static",
+		"prepublishOnly": "node scripts/rewrite-workspace-deps.mjs && pnpm run build && pnpm run test && pnpm run size-limit && node scripts/check-eta-gate.js",
+		"postpublish": "git checkout HEAD -- package.json && echo '[postpublish] reverted package.json — workspace:* refs restored for monorepo dev'"
+	},
+	"peerDependencies": {
+		"@hookform/resolvers": "^3.10.0",
+		"@mcp-ui/client": "7.1.1",
+		"preact": "^10.25.0",
+		"react": "^19.1.0",
+		"react-dom": "^19.1.0",
+		"react-hook-form": "^7.54.0",
+		"react-i18next": "15.5.2",
+		"rxjs": "^7.8.0"
+	},
+	"peerDependenciesMeta": {
+		"@hookform/resolvers": {
+			"optional": true
+		},
+		"@mcp-ui/client": {
+			"optional": true
+		},
+		"preact": {
+			"optional": true
+		},
+		"react": {
+			"optional": true
+		},
+		"react-dom": {
+			"optional": true
+		},
+		"react-hook-form": {
+			"optional": true
+		},
+		"react-i18next": {
+			"optional": true
+		},
+		"rxjs": {
+			"optional": true
+		}
+	},
+	"dependencies": {
+		"@lit-labs/react": "1.0.6",
+		"@mcp-ui/server": "6.1.0",
+		"@tanstack/react-virtual": "3.13.6",
+		"@vantageos/mosaic-tokens": "^0.7.0",
+		"dompurify": "3.2.4",
+		"marked": "15.0.7",
+		"zod": "3.25.28"
+	},
+	"devDependencies": {
+		"@axe-core/playwright": "4.10.1",
+		"@babel/parser": "7.29.7",
+		"@babel/traverse": "7.29.7",
+		"@biomejs/biome": "1.9.4",
+		"@hookform/resolvers": "^3.10.0",
+		"@playwright/test": "1.50.1",
+		"@size-limit/preset-small-lib": "11.2.0",
+		"@storybook/builder-vite": "8.6.18",
+		"@storybook/react": "8.6.18",
+		"@storybook/react-vite": "8.6.18",
+		"@storybook/test-runner": "0.21.0",
+		"@tailwindcss/vite": "4.1.8",
+		"@testing-library/react": "16.3.0",
+		"@testing-library/user-event": "14.6.1",
+		"@types/babel__traverse": "7.28.0",
+		"@types/dompurify": "3.0.5",
+		"@types/react": "19.1.0",
+		"@types/react-dom": "19.1.0",
+		"@vitejs/plugin-react": "4.3.4",
+		"@vitest/coverage-v8": "3.2.2",
+		"jsdom": "26.0.0",
+		"preact": "10.27.1",
+		"react": "19.1.0",
+		"react-dom": "19.1.0",
+		"react-hook-form": "^7.54.0",
+		"size-limit": "11.2.0",
+		"storybook": "8.6.18",
+		"tailwindcss": "4.1.8",
+		"tsup": "8.4.0",
+		"typescript": "5.8.3",
+		"vite": "6.3.5",
+		"vite-plugin-singlefile": "2.1.0",
+		"vitest": "3.2.2"
+	}
+}

package/registry.yaml

@@ -21,6 +21,13 @@ components:
     i18nKeys: ["TableView.aria.table", "TableView.pagination.next", "TableView.pagination.prev", "TableView.empty.message", "TableView.error.invalidProps"]
     sizeLimit: "80KB"
     a11yLevel: WCAG-AA
+  - name: Badge
+    category: display
+    schema: src/components/display/Badge.schema.ts
+    zodExport: BadgePropsSchema
+    i18nKeys: ["Badge.aria.label", "Badge.error.invalidProps"]
+    sizeLimit: "10KB"
+    a11yLevel: WCAG-AA
   - name: MarkdownRenderer
     category: artifacts
     schema: src/components/artifacts/MarkdownRenderer.schema.ts