@fabio.caffarello/react-design-system 3.8.0 → 3.9.0

package/dist/granular/ui/tokens/colors/semantic.js

@@ -0,0 +1,212 @@
+"use client";
+import { SLATE as r, SKY as t, ROSE as a, AMBER as i, EMERALD as l, CYAN as s } from "./primitives.js";
+import { BRAND_SECONDARY as c, BRAND_PRIMARY as o } from "./brand.js";
+const e = {
+  primary: {
+    light: o[400],
+    DEFAULT: o[500],
+    dark: o[600],
+    contrast: {
+      hex: "#ffffff",
+      rgb: "255, 255, 255",
+      hsl: "0, 0%, 100%",
+      cssVar: "var(--color-white)",
+      tailwind: "white"
+    }
+  },
+  secondary: {
+    light: c[400],
+    DEFAULT: c[500],
+    dark: c[600],
+    contrast: {
+      hex: "#ffffff",
+      rgb: "255, 255, 255",
+      hsl: "0, 0%, 100%",
+      cssVar: "var(--color-white)",
+      tailwind: "white"
+    }
+  },
+  accent: {
+    light: s[400],
+    DEFAULT: s[500],
+    dark: s[600],
+    contrast: {
+      hex: "#ffffff",
+      rgb: "255, 255, 255",
+      hsl: "0, 0%, 100%",
+      cssVar: "var(--color-white)",
+      tailwind: "white"
+    }
+  },
+  success: {
+    light: l[400],
+    DEFAULT: l[500],
+    dark: l[600],
+    contrast: {
+      hex: "#ffffff",
+      rgb: "255, 255, 255",
+      hsl: "0, 0%, 100%",
+      cssVar: "var(--color-white)",
+      tailwind: "white"
+    }
+  },
+  warning: {
+    light: i[400],
+    DEFAULT: i[500],
+    dark: i[600],
+    contrast: {
+      hex: "#000000",
+      rgb: "0, 0, 0",
+      hsl: "0, 0%, 0%",
+      cssVar: "var(--color-black)",
+      tailwind: "black"
+    }
+  },
+  error: {
+    light: a[400],
+    DEFAULT: a[500],
+    dark: a[600],
+    contrast: {
+      hex: "#ffffff",
+      rgb: "255, 255, 255",
+      hsl: "0, 0%, 100%",
+      cssVar: "var(--color-white)",
+      tailwind: "white"
+    }
+  },
+  info: {
+    light: t[400],
+    DEFAULT: t[500],
+    dark: t[600],
+    contrast: {
+      hex: "#ffffff",
+      rgb: "255, 255, 255",
+      hsl: "0, 0%, 100%",
+      cssVar: "var(--color-white)",
+      tailwind: "white"
+    }
+  },
+  neutral: {
+    light: r[100],
+    DEFAULT: r[500],
+    dark: r[700],
+    contrast: {
+      hex: "#ffffff",
+      rgb: "255, 255, 255",
+      hsl: "0, 0%, 100%",
+      cssVar: "var(--color-white)",
+      tailwind: "white"
+    }
+  }
+}, w = {
+  primary: {
+    light: o[500],
+    DEFAULT: o[400],
+    dark: o[300],
+    contrast: {
+      hex: "#ffffff",
+      rgb: "255, 255, 255",
+      hsl: "0, 0%, 100%",
+      cssVar: "var(--color-white)",
+      tailwind: "white"
+    }
+  },
+  secondary: {
+    light: c[500],
+    DEFAULT: c[400],
+    dark: c[300],
+    contrast: {
+      hex: "#ffffff",
+      rgb: "255, 255, 255",
+      hsl: "0, 0%, 100%",
+      cssVar: "var(--color-white)",
+      tailwind: "white"
+    }
+  },
+  accent: {
+    light: s[500],
+    DEFAULT: s[400],
+    dark: s[300],
+    contrast: {
+      hex: "#000000",
+      rgb: "0, 0, 0",
+      hsl: "0, 0%, 0%",
+      cssVar: "var(--color-black)",
+      tailwind: "black"
+    }
+  },
+  success: {
+    light: l[500],
+    DEFAULT: l[400],
+    dark: l[300],
+    contrast: {
+      hex: "#000000",
+      rgb: "0, 0, 0",
+      hsl: "0, 0%, 0%",
+      cssVar: "var(--color-black)",
+      tailwind: "black"
+    }
+  },
+  warning: {
+    light: i[500],
+    DEFAULT: i[400],
+    dark: i[300],
+    contrast: {
+      hex: "#000000",
+      rgb: "0, 0, 0",
+      hsl: "0, 0%, 0%",
+      cssVar: "var(--color-black)",
+      tailwind: "black"
+    }
+  },
+  error: {
+    light: a[500],
+    DEFAULT: a[400],
+    dark: a[300],
+    contrast: {
+      hex: "#ffffff",
+      rgb: "255, 255, 255",
+      hsl: "0, 0%, 100%",
+      cssVar: "var(--color-white)",
+      tailwind: "white"
+    }
+  },
+  info: {
+    light: t[500],
+    DEFAULT: t[400],
+    dark: t[300],
+    contrast: {
+      hex: "#ffffff",
+      rgb: "255, 255, 255",
+      hsl: "0, 0%, 100%",
+      cssVar: "var(--color-white)",
+      tailwind: "white"
+    }
+  },
+  neutral: {
+    light: r[700],
+    DEFAULT: r[400],
+    dark: r[300],
+    contrast: {
+      hex: "#ffffff",
+      rgb: "255, 255, 255",
+      hsl: "0, 0%, 100%",
+      cssVar: "var(--color-white)",
+      tailwind: "white"
+    }
+  }
+}, k = e;
+function E(f, h = "DEFAULT", n = "light") {
+  return (n === "dark" ? w : e)[f][h];
+}
+function b(f, h = "light") {
+  return (h === "dark" ? w : e)[f];
+}
+export {
+  k as SEMANTIC_COLORS,
+  w as SEMANTIC_COLORS_DARK,
+  e as SEMANTIC_COLORS_LIGHT,
+  E as getSemanticColor,
+  b as getSemanticColorRole
+};
+//# sourceMappingURL=semantic.js.map

package/dist/granular/ui/tokens/colors/semantic.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"semantic.js","sources":["../../../../../src/ui/tokens/colors/semantic.ts"],"sourcesContent":["/**\n * Design System - Semantic Color Tokens\n *\n * Semantic colors that reference primitive palettes.\n * These are the colors you should use in components.\n *\n * @brand brasil-a-vera (default, overridable)\n * @version 1.0.0\n */\n\nimport type {\n  SemanticColor,\n  SemanticColorName,\n  SemanticColorPalette,\n  ColorToken,\n} from \"./types\";\nimport { CYAN, SLATE, EMERALD, AMBER, ROSE, SKY } from \"./primitives\";\nimport { BRAND_PRIMARY, BRAND_SECONDARY } from \"./brand\";\n\n/**\n * Light theme semantic colors\n */\nexport const SEMANTIC_COLORS_LIGHT: SemanticColorPalette = {\n  primary: {\n    light: BRAND_PRIMARY[400],\n    DEFAULT: BRAND_PRIMARY[500],\n    dark: BRAND_PRIMARY[600],\n    contrast: {\n      hex: \"#ffffff\",\n      rgb: \"255, 255, 255\",\n      hsl: \"0, 0%, 100%\",\n      cssVar: \"var(--color-white)\",\n      tailwind: \"white\",\n    },\n  },\n  secondary: {\n    light: BRAND_SECONDARY[400],\n    DEFAULT: BRAND_SECONDARY[500],\n    dark: BRAND_SECONDARY[600],\n    contrast: {\n      hex: \"#ffffff\",\n      rgb: \"255, 255, 255\",\n      hsl: \"0, 0%, 100%\",\n      cssVar: \"var(--color-white)\",\n      tailwind: \"white\",\n    },\n  },\n  accent: {\n    light: CYAN[400],\n    DEFAULT: CYAN[500],\n    dark: CYAN[600],\n    contrast: {\n      hex: \"#ffffff\",\n      rgb: \"255, 255, 255\",\n      hsl: \"0, 0%, 100%\",\n      cssVar: \"var(--color-white)\",\n      tailwind: \"white\",\n    },\n  },\n  success: {\n    light: EMERALD[400],\n    DEFAULT: EMERALD[500],\n    dark: EMERALD[600],\n    contrast: {\n      hex: \"#ffffff\",\n      rgb: \"255, 255, 255\",\n      hsl: \"0, 0%, 100%\",\n      cssVar: \"var(--color-white)\",\n      tailwind: \"white\",\n    },\n  },\n  warning: {\n    light: AMBER[400],\n    DEFAULT: AMBER[500],\n    dark: AMBER[600],\n    contrast: {\n      hex: \"#000000\",\n      rgb: \"0, 0, 0\",\n      hsl: \"0, 0%, 0%\",\n      cssVar: \"var(--color-black)\",\n      tailwind: \"black\",\n    },\n  },\n  error: {\n    light: ROSE[400],\n    DEFAULT: ROSE[500],\n    dark: ROSE[600],\n    contrast: {\n      hex: \"#ffffff\",\n      rgb: \"255, 255, 255\",\n      hsl: \"0, 0%, 100%\",\n      cssVar: \"var(--color-white)\",\n      tailwind: \"white\",\n    },\n  },\n  info: {\n    light: SKY[400],\n    DEFAULT: SKY[500],\n    dark: SKY[600],\n    contrast: {\n      hex: \"#ffffff\",\n      rgb: \"255, 255, 255\",\n      hsl: \"0, 0%, 100%\",\n      cssVar: \"var(--color-white)\",\n      tailwind: \"white\",\n    },\n  },\n  neutral: {\n    light: SLATE[100],\n    DEFAULT: SLATE[500],\n    dark: SLATE[700],\n    contrast: {\n      hex: \"#ffffff\",\n      rgb: \"255, 255, 255\",\n      hsl: \"0, 0%, 100%\",\n      cssVar: \"var(--color-white)\",\n      tailwind: \"white\",\n    },\n  },\n};\n\n/**\n * Dark theme semantic colors\n */\nexport const SEMANTIC_COLORS_DARK: SemanticColorPalette = {\n  primary: {\n    light: BRAND_PRIMARY[500],\n    DEFAULT: BRAND_PRIMARY[400],\n    dark: BRAND_PRIMARY[300],\n    contrast: {\n      hex: \"#ffffff\",\n      rgb: \"255, 255, 255\",\n      hsl: \"0, 0%, 100%\",\n      cssVar: \"var(--color-white)\",\n      tailwind: \"white\",\n    },\n  },\n  secondary: {\n    light: BRAND_SECONDARY[500],\n    DEFAULT: BRAND_SECONDARY[400],\n    dark: BRAND_SECONDARY[300],\n    contrast: {\n      hex: \"#ffffff\",\n      rgb: \"255, 255, 255\",\n      hsl: \"0, 0%, 100%\",\n      cssVar: \"var(--color-white)\",\n      tailwind: \"white\",\n    },\n  },\n  accent: {\n    light: CYAN[500],\n    DEFAULT: CYAN[400],\n    dark: CYAN[300],\n    contrast: {\n      hex: \"#000000\",\n      rgb: \"0, 0, 0\",\n      hsl: \"0, 0%, 0%\",\n      cssVar: \"var(--color-black)\",\n      tailwind: \"black\",\n    },\n  },\n  success: {\n    light: EMERALD[500],\n    DEFAULT: EMERALD[400],\n    dark: EMERALD[300],\n    contrast: {\n      hex: \"#000000\",\n      rgb: \"0, 0, 0\",\n      hsl: \"0, 0%, 0%\",\n      cssVar: \"var(--color-black)\",\n      tailwind: \"black\",\n    },\n  },\n  warning: {\n    light: AMBER[500],\n    DEFAULT: AMBER[400],\n    dark: AMBER[300],\n    contrast: {\n      hex: \"#000000\",\n      rgb: \"0, 0, 0\",\n      hsl: \"0, 0%, 0%\",\n      cssVar: \"var(--color-black)\",\n      tailwind: \"black\",\n    },\n  },\n  error: {\n    light: ROSE[500],\n    DEFAULT: ROSE[400],\n    dark: ROSE[300],\n    contrast: {\n      hex: \"#ffffff\",\n      rgb: \"255, 255, 255\",\n      hsl: \"0, 0%, 100%\",\n      cssVar: \"var(--color-white)\",\n      tailwind: \"white\",\n    },\n  },\n  info: {\n    light: SKY[500],\n    DEFAULT: SKY[400],\n    dark: SKY[300],\n    contrast: {\n      hex: \"#ffffff\",\n      rgb: \"255, 255, 255\",\n      hsl: \"0, 0%, 100%\",\n      cssVar: \"var(--color-white)\",\n      tailwind: \"white\",\n    },\n  },\n  neutral: {\n    light: SLATE[700],\n    DEFAULT: SLATE[400],\n    dark: SLATE[300],\n    contrast: {\n      hex: \"#ffffff\",\n      rgb: \"255, 255, 255\",\n      hsl: \"0, 0%, 100%\",\n      cssVar: \"var(--color-white)\",\n      tailwind: \"white\",\n    },\n  },\n};\n\n/**\n * Default semantic colors (light theme)\n */\nexport const SEMANTIC_COLORS = SEMANTIC_COLORS_LIGHT;\n\n/**\n * Get semantic color by role and shade\n */\nexport function getSemanticColor(\n  role: SemanticColorName,\n  shade: \"light\" | \"DEFAULT\" | \"dark\" | \"contrast\" = \"DEFAULT\",\n  theme: \"light\" | \"dark\" = \"light\",\n): ColorToken {\n  const colors =\n    theme === \"dark\" ? SEMANTIC_COLORS_DARK : SEMANTIC_COLORS_LIGHT;\n  return colors[role][shade];\n}\n\n/**\n * Get all shades for a semantic color role\n */\nexport function getSemanticColorRole(\n  role: SemanticColorName,\n  theme: \"light\" | \"dark\" = \"light\",\n): SemanticColor {\n  const colors =\n    theme === \"dark\" ? SEMANTIC_COLORS_DARK : SEMANTIC_COLORS_LIGHT;\n  return colors[role];\n}\n"],"names":["SEMANTIC_COLORS_LIGHT","BRAND_PRIMARY","BRAND_SECONDARY","CYAN","EMERALD","AMBER","ROSE","SKY","SLATE","SEMANTIC_COLORS_DARK","SEMANTIC_COLORS","getSemanticColor","role","shade","theme","getSemanticColorRole"],"mappings":"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"}

package/dist/granular/ui/tokens/colors/types.js

@@ -0,0 +1,18 @@
+"use client";
+const e = [
+  50,
+  100,
+  200,
+  300,
+  400,
+  500,
+  600,
+  700,
+  800,
+  900,
+  950
+];
+export {
+  e as COLOR_SCALES
+};
+//# sourceMappingURL=types.js.map

package/dist/granular/ui/tokens/colors/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sources":["../../../../../src/ui/tokens/colors/types.ts"],"sourcesContent":["/**\n * Design System - Color Token Types\n *\n * TypeScript types for the color system.\n *\n * @brand brasil-a-vera (default, overridable)\n * @version 1.0.0\n */\n\n/**\n * Color scale values (50-950)\n * Standard Tailwind-compatible color scale\n */\nexport type ColorScale =\n  | 50\n  | 100\n  | 200\n  | 300\n  | 400\n  | 500\n  | 600\n  | 700\n  | 800\n  | 900\n  | 950;\n\n/**\n * All available color scale values as array\n */\nexport const COLOR_SCALES: ColorScale[] = [\n  50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950,\n];\n\n/**\n * Primitive color names (raw color palettes)\n *\n * Two families coexist:\n * - Tailwind tones (indigo, violet, ..., lime) — honest to Tailwind v4 HEX.\n * - Brand primitives (brand-primary, brand-secondary) — the design system's\n *   own scales, declared in src/styles/primitives/brand.css and mirrored\n *   in src/ui/tokens/colors/brand.ts. These are the reskin surface;\n *   semantic tokens reference them, not Tailwind tones.\n */\nexport type PrimitiveColorName =\n  | \"brand-primary\"\n  | \"brand-secondary\"\n  | \"indigo\"\n  | \"violet\"\n  | \"cyan\"\n  | \"slate\"\n  | \"gray\"\n  | \"emerald\"\n  | \"green\"\n  | \"amber\"\n  | \"yellow\"\n  | \"orange\"\n  | \"rose\"\n  | \"red\"\n  | \"sky\"\n  | \"blue\"\n  | \"fuchsia\"\n  | \"pink\"\n  | \"purple\"\n  | \"teal\"\n  | \"lime\";\n\n/**\n * Semantic color names (meaningful colors)\n */\nexport type SemanticColorName =\n  | \"primary\"\n  | \"secondary\"\n  | \"accent\"\n  | \"success\"\n  | \"warning\"\n  | \"error\"\n  | \"info\"\n  | \"neutral\";\n\n/**\n * Text color semantic names\n */\nexport type TextColorName =\n  | \"primary\"\n  | \"secondary\"\n  | \"tertiary\"\n  | \"quaternary\"\n  | \"placeholder\"\n  | \"disabled\"\n  | \"inverse\"\n  | \"link\"\n  | \"success\"\n  | \"warning\"\n  | \"error\"\n  | \"info\";\n\n/**\n * Background color semantic names\n */\nexport type BgColorName =\n  | \"base\"\n  | \"subtle\"\n  | \"muted\"\n  | \"emphasis\"\n  | \"strong\"\n  | \"inverse\"\n  | \"brand\"\n  | \"secondary\"\n  | \"accent\";\n\n/**\n * Border color semantic names\n */\nexport type BorderColorName =\n  | \"default\"\n  | \"muted\"\n  | \"subtle\"\n  | \"emphasis\"\n  | \"strong\"\n  | \"focus\"\n  | \"brand\";\n\n/**\n * State color names\n */\nexport type StateColorName =\n  | \"hover\"\n  | \"active\"\n  | \"selected\"\n  | \"disabled\"\n  | \"focus\";\n\n/**\n * Theme mode\n */\nexport type ThemeMode = \"light\" | \"dark\";\n\n/**\n * Theme variant (visual style)\n */\nexport type ThemeVariant = \"tech\" | \"creative\" | \"minimal\";\n\n/**\n * Single color token with multiple formats\n */\nexport interface ColorToken {\n  /** Hex color value (e.g., #6366f1) */\n  hex: string;\n  /** RGB values as string (e.g., \"99, 102, 241\") */\n  rgb: string;\n  /** HSL values as string (e.g., \"239, 84%, 67%\") */\n  hsl: string;\n  /** CSS variable reference (e.g., \"var(--color-indigo-500)\") */\n  cssVar: string;\n  /** Tailwind class suffix (e.g., \"indigo-500\") */\n  tailwind: string;\n}\n\n/**\n * Complete color palette (all shades)\n */\nexport type ColorPalette = Record<ColorScale, ColorToken>;\n\n/**\n * Semantic color with light/dark/contrast variants\n */\nexport interface SemanticColor {\n  light: ColorToken;\n  DEFAULT: ColorToken;\n  dark: ColorToken;\n  contrast: ColorToken;\n}\n\n/**\n * Complete semantic color palette\n */\nexport type SemanticColorPalette = Record<SemanticColorName, SemanticColor>;\n\n/**\n * All primitive colors\n */\nexport type PrimitiveColors = Record<PrimitiveColorName, ColorPalette>;\n\n/**\n * Theme color configuration\n */\nexport interface ThemeColors {\n  /** Brand colors */\n  brand: {\n    primary: ColorToken;\n    primaryLight: ColorToken;\n    primaryDark: ColorToken;\n    secondary: ColorToken;\n    secondaryLight: ColorToken;\n    secondaryDark: ColorToken;\n    accent: ColorToken;\n    accentLight: ColorToken;\n    accentDark: ColorToken;\n  };\n  /** Text colors */\n  text: Record<TextColorName, ColorToken>;\n  /** Background colors */\n  bg: Record<BgColorName, ColorToken>;\n  /** Border colors */\n  border: Record<BorderColorName, ColorToken>;\n  /** State colors */\n  state: Record<StateColorName, ColorToken>;\n  /** Feedback colors */\n  feedback: {\n    success: ColorToken;\n    successBg: ColorToken;\n    warning: ColorToken;\n    warningBg: ColorToken;\n    error: ColorToken;\n    errorBg: ColorToken;\n    info: ColorToken;\n    infoBg: ColorToken;\n  };\n}\n\n/**\n * Color utility function options\n */\nexport interface GetColorOptions {\n  /** Output format */\n  format?: \"hex\" | \"rgb\" | \"hsl\" | \"cssVar\" | \"tailwind\";\n  /** Include opacity */\n  opacity?: number;\n}\n\n/**\n * Color class generation options\n */\nexport interface GetColorClassOptions {\n  /** Class type */\n  type?: \"text\" | \"bg\" | \"border\" | \"ring\" | \"fill\" | \"stroke\";\n  /** Include hover variant */\n  hover?: boolean;\n  /** Include focus variant */\n  focus?: boolean;\n  /** Include active variant */\n  active?: boolean;\n}\n"],"names":["COLOR_SCALES"],"mappings":";AA6BO,MAAMA,IAA6B;AAAA,EACxC;AAAA,EAAI;AAAA,EAAK;AAAA,EAAK;AAAA,EAAK;AAAA,EAAK;AAAA,EAAK;AAAA,EAAK;AAAA,EAAK;AAAA,EAAK;AAAA,EAAK;AACnD;"}

package/dist/granular/ui/tokens/colors/utils.js

@@ -0,0 +1,131 @@
+"use client";
+import { getPrimitiveColor as l } from "./primitives.js";
+import { getSemanticColor as u } from "./semantic.js";
+function v(n, t, r = {}) {
+  const { format: e = "hex", opacity: a } = r, o = l(n, t);
+  let s;
+  switch (e) {
+    case "rgb":
+      s = a !== void 0 ? `rgba(${o.rgb}, ${a})` : `rgb(${o.rgb})`;
+      break;
+    case "hsl":
+      s = a !== void 0 ? `hsla(${o.hsl}, ${a})` : `hsl(${o.hsl})`;
+      break;
+    case "cssVar":
+      s = o.cssVar;
+      break;
+    case "tailwind":
+      s = o.tailwind;
+      break;
+    default:
+      s = o.hex;
+  }
+  return s;
+}
+function p(n, t = "DEFAULT", r = {}) {
+  const { format: e = "hex", opacity: a } = r, o = u(n, t);
+  let s;
+  switch (e) {
+    case "rgb":
+      s = a !== void 0 ? `rgba(${o.rgb}, ${a})` : `rgb(${o.rgb})`;
+      break;
+    case "hsl":
+      s = a !== void 0 ? `hsla(${o.hsl}, ${a})` : `hsl(${o.hsl})`;
+      break;
+    case "cssVar":
+      s = o.cssVar;
+      break;
+    case "tailwind":
+      s = o.tailwind;
+      break;
+    default:
+      s = o.hex;
+  }
+  return s;
+}
+function C(n, t, r = {}) {
+  const {
+    type: e = "text",
+    hover: a = !1,
+    focus: o = !1,
+    active: s = !1
+  } = r, i = l(n, t), c = [`${e}-${i.tailwind}`];
+  return a && c.push(`hover:${e}-${i.tailwind}`), o && c.push(`focus:${e}-${i.tailwind}`), s && c.push(`active:${e}-${i.tailwind}`), c.join(" ");
+}
+function w(n, t = "DEFAULT", r = {}) {
+  const {
+    type: e = "text",
+    hover: a = !1,
+    focus: o = !1,
+    active: s = !1
+  } = r, i = u(n, t), c = [`${e}-${i.tailwind}`];
+  if (a) {
+    const f = u(
+      n,
+      t === "DEFAULT" ? "dark" : "DEFAULT"
+    );
+    c.push(`hover:${e}-${f.tailwind}`);
+  }
+  if (o && c.push(`focus:${e}-${i.tailwind}`), s) {
+    const f = u(n, "dark");
+    c.push(`active:${e}-${f.tailwind}`);
+  }
+  return c.join(" ");
+}
+function m(n, t, r = "bg") {
+  const e = l(n, t);
+  return `hover:${r}-${e.tailwind}`;
+}
+function x(n, t, r = "border") {
+  const e = l(n, t);
+  return `focus:${r}-${e.tailwind}`;
+}
+function T(n, t) {
+  return `focus:ring-${l(n, t).tailwind}`;
+}
+function y(n, t) {
+  return `rgba(${n.rgb}, ${t})`;
+}
+function h(n) {
+  const t = $(n);
+  return t ? 0.299 * t[0] + 0.587 * t[1] + 0.114 * t[2] > 128 : !0;
+}
+function F(n) {
+  return h(n) ? "#000000" : "#ffffff";
+}
+function $(n) {
+  const t = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(n);
+  return t ? [
+    parseInt(t[1], 16),
+    parseInt(t[2], 16),
+    parseInt(t[3], 16)
+  ] : null;
+}
+function b(n, t, r = 0.5) {
+  const e = $(n), a = $(t);
+  if (!e || !a) return n;
+  const o = Math.round(e[0] * (1 - r) + a[0] * r), s = Math.round(e[1] * (1 - r) + a[1] * r), i = Math.round(e[2] * (1 - r) + a[2] * r);
+  return `#${((1 << 24) + (o << 16) + (s << 8) + i).toString(16).slice(1)}`;
+}
+function A(n, t) {
+  return b(n, "#ffffff", t / 100);
+}
+function L(n, t) {
+  return b(n, "#000000", t / 100);
+}
+export {
+  b as blendColors,
+  L as darken,
+  v as getColor,
+  C as getColorClass,
+  F as getContrastColor,
+  x as getFocusColorClass,
+  T as getFocusRingClass,
+  m as getHoverColorClass,
+  w as getSemanticColorClass,
+  p as getSemanticColorValue,
+  h as isLightColor,
+  A as lighten,
+  y as withOpacity
+};
+//# sourceMappingURL=utils.js.map

package/dist/granular/ui/tokens/colors/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sources":["../../../../../src/ui/tokens/colors/utils.ts"],"sourcesContent":["/**\n * Design System - Color Utilities\n *\n * Helper functions for working with colors.\n *\n * @brand brasil-a-vera (default, overridable)\n * @version 1.0.0\n */\n\nimport type {\n  ColorToken,\n  ColorScale,\n  PrimitiveColorName,\n  SemanticColorName,\n  GetColorOptions,\n  GetColorClassOptions,\n} from \"./types\";\nimport { getPrimitiveColor } from \"./primitives\";\nimport { getSemanticColor } from \"./semantic\";\n\n/**\n * Get a primitive color value in the specified format\n */\nexport function getColor(\n  name: PrimitiveColorName,\n  scale: ColorScale,\n  options: GetColorOptions = {},\n): string {\n  const { format = \"hex\", opacity } = options;\n  const token = getPrimitiveColor(name, scale);\n\n  let value: string;\n  switch (format) {\n    case \"rgb\":\n      value =\n        opacity !== undefined\n          ? `rgba(${token.rgb}, ${opacity})`\n          : `rgb(${token.rgb})`;\n      break;\n    case \"hsl\":\n      value =\n        opacity !== undefined\n          ? `hsla(${token.hsl}, ${opacity})`\n          : `hsl(${token.hsl})`;\n      break;\n    case \"cssVar\":\n      value = token.cssVar;\n      break;\n    case \"tailwind\":\n      value = token.tailwind;\n      break;\n    case \"hex\":\n    default:\n      value = token.hex;\n  }\n\n  return value;\n}\n\n/**\n * Get a semantic color value in the specified format\n */\nexport function getSemanticColorValue(\n  role: SemanticColorName,\n  shade: \"light\" | \"DEFAULT\" | \"dark\" | \"contrast\" = \"DEFAULT\",\n  options: GetColorOptions = {},\n): string {\n  const { format = \"hex\", opacity } = options;\n  const token = getSemanticColor(role, shade);\n\n  let value: string;\n  switch (format) {\n    case \"rgb\":\n      value =\n        opacity !== undefined\n          ? `rgba(${token.rgb}, ${opacity})`\n          : `rgb(${token.rgb})`;\n      break;\n    case \"hsl\":\n      value =\n        opacity !== undefined\n          ? `hsla(${token.hsl}, ${opacity})`\n          : `hsl(${token.hsl})`;\n      break;\n    case \"cssVar\":\n      value = token.cssVar;\n      break;\n    case \"tailwind\":\n      value = token.tailwind;\n      break;\n    case \"hex\":\n    default:\n      value = token.hex;\n  }\n\n  return value;\n}\n\n/**\n * Get Tailwind color class for a primitive color\n */\nexport function getColorClass(\n  name: PrimitiveColorName,\n  scale: ColorScale,\n  options: GetColorClassOptions = {},\n): string {\n  const {\n    type = \"text\",\n    hover = false,\n    focus = false,\n    active = false,\n  } = options;\n  const token = getPrimitiveColor(name, scale);\n  const base = `${type}-${token.tailwind}`;\n\n  const classes: string[] = [base];\n\n  if (hover) {\n    classes.push(`hover:${type}-${token.tailwind}`);\n  }\n  if (focus) {\n    classes.push(`focus:${type}-${token.tailwind}`);\n  }\n  if (active) {\n    classes.push(`active:${type}-${token.tailwind}`);\n  }\n\n  return classes.join(\" \");\n}\n\n/**\n * Get Tailwind color class for a semantic color\n */\nexport function getSemanticColorClass(\n  role: SemanticColorName,\n  shade: \"light\" | \"DEFAULT\" | \"dark\" = \"DEFAULT\",\n  options: GetColorClassOptions = {},\n): string {\n  const {\n    type = \"text\",\n    hover = false,\n    focus = false,\n    active = false,\n  } = options;\n  const token = getSemanticColor(role, shade);\n  const base = `${type}-${token.tailwind}`;\n\n  const classes: string[] = [base];\n\n  if (hover) {\n    const hoverToken = getSemanticColor(\n      role,\n      shade === \"DEFAULT\" ? \"dark\" : \"DEFAULT\",\n    );\n    classes.push(`hover:${type}-${hoverToken.tailwind}`);\n  }\n  if (focus) {\n    classes.push(`focus:${type}-${token.tailwind}`);\n  }\n  if (active) {\n    const activeToken = getSemanticColor(role, \"dark\");\n    classes.push(`active:${type}-${activeToken.tailwind}`);\n  }\n\n  return classes.join(\" \");\n}\n\n/**\n * Get hover color class\n */\nexport function getHoverColorClass(\n  name: PrimitiveColorName,\n  scale: ColorScale,\n  type: \"text\" | \"bg\" | \"border\" = \"bg\",\n): string {\n  const token = getPrimitiveColor(name, scale);\n  return `hover:${type}-${token.tailwind}`;\n}\n\n/**\n * Get focus color class\n */\nexport function getFocusColorClass(\n  name: PrimitiveColorName,\n  scale: ColorScale,\n  type: \"text\" | \"bg\" | \"border\" = \"border\",\n): string {\n  const token = getPrimitiveColor(name, scale);\n  return `focus:${type}-${token.tailwind}`;\n}\n\n/**\n * Get focus ring class for a color\n */\nexport function getFocusRingClass(\n  name: PrimitiveColorName,\n  scale: ColorScale,\n): string {\n  const token = getPrimitiveColor(name, scale);\n  return `focus:ring-${token.tailwind}`;\n}\n\n/**\n * Generate a color with opacity\n */\nexport function withOpacity(token: ColorToken, opacity: number): string {\n  return `rgba(${token.rgb}, ${opacity})`;\n}\n\n/**\n * Check if a color is considered \"light\" (for contrast calculations)\n */\nexport function isLightColor(hex: string): boolean {\n  const rgb = hexToRgbArray(hex);\n  if (!rgb) return true;\n\n  // Calculate relative luminance\n  const luminance = 0.299 * rgb[0] + 0.587 * rgb[1] + 0.114 * rgb[2];\n  return luminance > 128;\n}\n\n/**\n * Get contrast color (black or white) for a given color\n */\nexport function getContrastColor(hex: string): \"#000000\" | \"#ffffff\" {\n  return isLightColor(hex) ? \"#000000\" : \"#ffffff\";\n}\n\n/**\n * Convert hex to RGB array\n */\nfunction hexToRgbArray(hex: string): [number, number, number] | null {\n  const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);\n  if (!result) return null;\n  return [\n    parseInt(result[1], 16),\n    parseInt(result[2], 16),\n    parseInt(result[3], 16),\n  ];\n}\n\n/**\n * Blend two colors together\n */\nexport function blendColors(\n  color1: string,\n  color2: string,\n  weight: number = 0.5,\n): string {\n  const rgb1 = hexToRgbArray(color1);\n  const rgb2 = hexToRgbArray(color2);\n\n  if (!rgb1 || !rgb2) return color1;\n\n  const r = Math.round(rgb1[0] * (1 - weight) + rgb2[0] * weight);\n  const g = Math.round(rgb1[1] * (1 - weight) + rgb2[1] * weight);\n  const b = Math.round(rgb1[2] * (1 - weight) + rgb2[2] * weight);\n\n  return `#${((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)}`;\n}\n\n/**\n * Lighten a color by a percentage\n */\nexport function lighten(hex: string, percent: number): string {\n  return blendColors(hex, \"#ffffff\", percent / 100);\n}\n\n/**\n * Darken a color by a percentage\n */\nexport function darken(hex: string, percent: number): string {\n  return blendColors(hex, \"#000000\", percent / 100);\n}\n"],"names":["getColor","name","scale","options","format","opacity","token","getPrimitiveColor","value","getSemanticColorValue","role","shade","getSemanticColor","getColorClass","type","hover","focus","active","classes","getSemanticColorClass","hoverToken","activeToken","getHoverColorClass","getFocusColorClass","getFocusRingClass","withOpacity","isLightColor","hex","rgb","hexToRgbArray","getContrastColor","result","blendColors","color1","color2","weight","rgb1","rgb2","r","g","b","lighten","percent","darken"],"mappings":"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"}

package/dist/granular/ui/tokens/opacity.js

@@ -0,0 +1,59 @@
+"use client";
+class i {
+  /**
+   * Create an opacity token
+   */
+  static create(a) {
+    const c = a / 100, o = {
+      0: "Fully transparent",
+      5: "Very light overlay",
+      10: "Light overlay",
+      20: "Subtle overlay",
+      25: "Quarter opacity",
+      30: "Light background",
+      40: "Semi-transparent",
+      50: "Half opacity",
+      60: "Semi-opaque",
+      70: "Mostly opaque",
+      75: "Three-quarter opacity",
+      80: "High opacity",
+      90: "Very high opacity",
+      95: "Nearly opaque",
+      100: "Fully opaque"
+    };
+    return {
+      value: a,
+      decimal: c,
+      tailwind: {
+        0: "opacity-0",
+        5: "opacity-5",
+        10: "opacity-10",
+        20: "opacity-20",
+        25: "opacity-25",
+        30: "opacity-30",
+        40: "opacity-40",
+        50: "opacity-50",
+        60: "opacity-60",
+        70: "opacity-70",
+        75: "opacity-75",
+        80: "opacity-80",
+        90: "opacity-90",
+        95: "opacity-95",
+        100: "opacity-100"
+      }[a],
+      description: o[a]
+    };
+  }
+}
+function e(t) {
+  return i.create(t);
+}
+function y(t) {
+  return i.create(t).tailwind;
+}
+export {
+  i as OpacityTokenFactory,
+  e as getOpacity,
+  y as getOpacityClass
+};
+//# sourceMappingURL=opacity.js.map

package/dist/granular/ui/tokens/opacity.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"opacity.js","sources":["../../../../src/ui/tokens/opacity.ts"],"sourcesContent":["/**\n * Opacity Tokens\n *\n * Centralized opacity system for consistent transparency values.\n * Uses Factory Pattern for type-safe token creation.\n */\n\nexport type OpacityValue =\n  | 0\n  | 5\n  | 10\n  | 20\n  | 25\n  | 30\n  | 40\n  | 50\n  | 60\n  | 70\n  | 75\n  | 80\n  | 90\n  | 95\n  | 100;\n\nexport interface OpacityToken {\n  value: OpacityValue;\n  decimal: number;\n  tailwind: string;\n  description: string;\n}\n\n/**\n * Opacity Token Factory\n * Creates opacity tokens with consistent values\n */\nexport class OpacityTokenFactory {\n  /**\n   * Create an opacity token\n   */\n  static create(value: OpacityValue): OpacityToken {\n    const decimal = value / 100;\n\n    const descriptionMap: Record<OpacityValue, string> = {\n      0: \"Fully transparent\",\n      5: \"Very light overlay\",\n      10: \"Light overlay\",\n      20: \"Subtle overlay\",\n      25: \"Quarter opacity\",\n      30: \"Light background\",\n      40: \"Semi-transparent\",\n      50: \"Half opacity\",\n      60: \"Semi-opaque\",\n      70: \"Mostly opaque\",\n      75: \"Three-quarter opacity\",\n      80: \"High opacity\",\n      90: \"Very high opacity\",\n      95: \"Nearly opaque\",\n      100: \"Fully opaque\",\n    };\n\n    // Map to Tailwind classes\n    const tailwindMap: Record<OpacityValue, string> = {\n      0: \"opacity-0\",\n      5: \"opacity-5\",\n      10: \"opacity-10\",\n      20: \"opacity-20\",\n      25: \"opacity-25\",\n      30: \"opacity-30\",\n      40: \"opacity-40\",\n      50: \"opacity-50\",\n      60: \"opacity-60\",\n      70: \"opacity-70\",\n      75: \"opacity-75\",\n      80: \"opacity-80\",\n      90: \"opacity-90\",\n      95: \"opacity-95\",\n      100: \"opacity-100\",\n    };\n\n    return {\n      value,\n      decimal,\n      tailwind: tailwindMap[value],\n      description: descriptionMap[value],\n    };\n  }\n}\n\n/**\n * Pre-defined opacity tokens\n */\nexport const OPACITY_TOKENS = {\n  transparent: OpacityTokenFactory.create(0),\n  \"5\": OpacityTokenFactory.create(5),\n  \"10\": OpacityTokenFactory.create(10),\n  \"20\": OpacityTokenFactory.create(20),\n  \"25\": OpacityTokenFactory.create(25),\n  \"30\": OpacityTokenFactory.create(30),\n  \"40\": OpacityTokenFactory.create(40),\n  \"50\": OpacityTokenFactory.create(50),\n  \"60\": OpacityTokenFactory.create(60),\n  \"70\": OpacityTokenFactory.create(70),\n  \"75\": OpacityTokenFactory.create(75),\n  \"80\": OpacityTokenFactory.create(80),\n  \"90\": OpacityTokenFactory.create(90),\n  \"95\": OpacityTokenFactory.create(95),\n  opaque: OpacityTokenFactory.create(100),\n} as const;\n\n/**\n * Helper function to get opacity token\n */\nexport function getOpacity(value: OpacityValue): OpacityToken {\n  return OpacityTokenFactory.create(value);\n}\n\n/**\n * Helper function to get opacity as Tailwind class\n */\nexport function getOpacityClass(value: OpacityValue): string {\n  return OpacityTokenFactory.create(value).tailwind;\n}\n"],"names":["OpacityTokenFactory","value","decimal","descriptionMap","getOpacity","getOpacityClass"],"mappings":";AAmCO,MAAMA,EAAoB;AAAA;AAAA;AAAA;AAAA,EAI/B,OAAO,OAAOC,GAAmC;AAC/C,UAAMC,IAAUD,IAAQ,KAElBE,IAA+C;AAAA,MACnD,GAAG;AAAA,MACH,GAAG;AAAA,MACH,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,KAAK;AAAA,IAAA;AAsBP,WAAO;AAAA,MACL,OAAAF;AAAA,MACA,SAAAC;AAAA,MACA,UArBgD;AAAA,QAChD,GAAG;AAAA,QACH,GAAG;AAAA,QACH,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,KAAK;AAAA,MAAA,EAMiBD,CAAK;AAAA,MAC3B,aAAaE,EAAeF,CAAK;AAAA,IAAA;AAAA,EAErC;AACF;AA0BO,SAASG,EAAWH,GAAmC;AAC5D,SAAOD,EAAoB,OAAOC,CAAK;AACzC;AAKO,SAASI,EAAgBJ,GAA6B;AAC3D,SAAOD,EAAoB,OAAOC,CAAK,EAAE;AAC3C;"}

package/dist/granular/ui/tokens/radius.js

@@ -0,0 +1,76 @@
+"use client";
+class e {
+  /**
+   * Create a radius token
+   */
+  static create(n) {
+    const r = {
+      none: {
+        px: 0,
+        tailwind: "rounded-none",
+        description: "No border radius"
+      },
+      sm: {
+        px: 2,
+        tailwind: "rounded-sm",
+        description: "Small radius (2px) for subtle rounding"
+      },
+      md: {
+        px: 6,
+        tailwind: "rounded-md",
+        description: "Medium radius (6px) for buttons and inputs"
+      },
+      lg: {
+        px: 8,
+        tailwind: "rounded-lg",
+        description: "Large radius (8px) for cards and containers"
+      },
+      xl: {
+        px: 12,
+        tailwind: "rounded-xl",
+        description: "Extra large radius (12px) for prominent elements"
+      },
+      "2xl": {
+        px: 16,
+        tailwind: "rounded-2xl",
+        description: "2X large radius (16px) for large containers"
+      },
+      "3xl": {
+        px: 24,
+        tailwind: "rounded-3xl",
+        description: "3X large radius (24px) for very large containers"
+      },
+      full: {
+        px: 9999,
+        tailwind: "rounded-full",
+        description: "Full radius for circular elements"
+      }
+    }[n];
+    return {
+      value: r.px,
+      rem: `${r.px / 16}rem`,
+      px: `${r.px}px`,
+      tailwind: r.tailwind,
+      description: r.description
+    };
+  }
+}
+const d = {
+  none: e.create("none"),
+  sm: e.create("sm"),
+  md: e.create("md"),
+  lg: e.create("lg"),
+  xl: e.create("xl"),
+  "2xl": e.create("2xl"),
+  "3xl": e.create("3xl"),
+  full: e.create("full")
+};
+function t(i) {
+  return d[i].tailwind;
+}
+export {
+  d as RADIUS_TOKENS,
+  e as RadiusTokenFactory,
+  t as getRadiusClass
+};
+//# sourceMappingURL=radius.js.map

package/dist/granular/ui/tokens/radius.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"radius.js","sources":["../../../../src/ui/tokens/radius.ts"],"sourcesContent":["/**\n * Border Radius Tokens\n *\n * Centralized border radius system for consistent rounded corners.\n * Uses Factory Pattern for type-safe token creation.\n */\n\nexport type RadiusSize =\n  | \"none\"\n  | \"sm\"\n  | \"md\"\n  | \"lg\"\n  | \"xl\"\n  | \"2xl\"\n  | \"3xl\"\n  | \"full\";\n\nexport interface RadiusToken {\n  value: number;\n  rem: string;\n  px: string;\n  tailwind: string;\n  description: string;\n}\n\n/**\n * Radius Token Factory\n * Creates radius tokens with consistent values\n */\nexport class RadiusTokenFactory {\n  /**\n   * Create a radius token\n   */\n  static create(size: RadiusSize): RadiusToken {\n    const radiusMap: Record<\n      RadiusSize,\n      { px: number; tailwind: string; description: string }\n    > = {\n      none: {\n        px: 0,\n        tailwind: \"rounded-none\",\n        description: \"No border radius\",\n      },\n      sm: {\n        px: 2,\n        tailwind: \"rounded-sm\",\n        description: \"Small radius (2px) for subtle rounding\",\n      },\n      md: {\n        px: 6,\n        tailwind: \"rounded-md\",\n        description: \"Medium radius (6px) for buttons and inputs\",\n      },\n      lg: {\n        px: 8,\n        tailwind: \"rounded-lg\",\n        description: \"Large radius (8px) for cards and containers\",\n      },\n      xl: {\n        px: 12,\n        tailwind: \"rounded-xl\",\n        description: \"Extra large radius (12px) for prominent elements\",\n      },\n      \"2xl\": {\n        px: 16,\n        tailwind: \"rounded-2xl\",\n        description: \"2X large radius (16px) for large containers\",\n      },\n      \"3xl\": {\n        px: 24,\n        tailwind: \"rounded-3xl\",\n        description: \"3X large radius (24px) for very large containers\",\n      },\n      full: {\n        px: 9999,\n        tailwind: \"rounded-full\",\n        description: \"Full radius for circular elements\",\n      },\n    };\n\n    const config = radiusMap[size];\n    return {\n      value: config.px,\n      rem: `${config.px / 16}rem`,\n      px: `${config.px}px`,\n      tailwind: config.tailwind,\n      description: config.description,\n    };\n  }\n}\n\n/**\n * Pre-defined radius tokens\n */\nexport const RADIUS_TOKENS = {\n  none: RadiusTokenFactory.create(\"none\"),\n  sm: RadiusTokenFactory.create(\"sm\"),\n  md: RadiusTokenFactory.create(\"md\"),\n  lg: RadiusTokenFactory.create(\"lg\"),\n  xl: RadiusTokenFactory.create(\"xl\"),\n  \"2xl\": RadiusTokenFactory.create(\"2xl\"),\n  \"3xl\": RadiusTokenFactory.create(\"3xl\"),\n  full: RadiusTokenFactory.create(\"full\"),\n} as const;\n\n/**\n * Helper function to get radius token\n */\nexport function getRadius(size: keyof typeof RADIUS_TOKENS): RadiusToken {\n  return RADIUS_TOKENS[size];\n}\n\n/**\n * Helper function to get radius as Tailwind class\n */\nexport function getRadiusClass(size: keyof typeof RADIUS_TOKENS): string {\n  return RADIUS_TOKENS[size].tailwind;\n}\n"],"names":["RadiusTokenFactory","size","config","RADIUS_TOKENS","getRadiusClass"],"mappings":";AA6BO,MAAMA,EAAmB;AAAA;AAAA;AAAA;AAAA,EAI9B,OAAO,OAAOC,GAA+B;AA+C3C,UAAMC,IA3CF;AAAA,MACF,MAAM;AAAA,QACJ,IAAI;AAAA,QACJ,UAAU;AAAA,QACV,aAAa;AAAA,MAAA;AAAA,MAEf,IAAI;AAAA,QACF,IAAI;AAAA,QACJ,UAAU;AAAA,QACV,aAAa;AAAA,MAAA;AAAA,MAEf,IAAI;AAAA,QACF,IAAI;AAAA,QACJ,UAAU;AAAA,QACV,aAAa;AAAA,MAAA;AAAA,MAEf,IAAI;AAAA,QACF,IAAI;AAAA,QACJ,UAAU;AAAA,QACV,aAAa;AAAA,MAAA;AAAA,MAEf,IAAI;AAAA,QACF,IAAI;AAAA,QACJ,UAAU;AAAA,QACV,aAAa;AAAA,MAAA;AAAA,MAEf,OAAO;AAAA,QACL,IAAI;AAAA,QACJ,UAAU;AAAA,QACV,aAAa;AAAA,MAAA;AAAA,MAEf,OAAO;AAAA,QACL,IAAI;AAAA,QACJ,UAAU;AAAA,QACV,aAAa;AAAA,MAAA;AAAA,MAEf,MAAM;AAAA,QACJ,IAAI;AAAA,QACJ,UAAU;AAAA,QACV,aAAa;AAAA,MAAA;AAAA,IACf,EAGuBD,CAAI;AAC7B,WAAO;AAAA,MACL,OAAOC,EAAO;AAAA,MACd,KAAK,GAAGA,EAAO,KAAK,EAAE;AAAA,MACtB,IAAI,GAAGA,EAAO,EAAE;AAAA,MAChB,UAAUA,EAAO;AAAA,MACjB,aAAaA,EAAO;AAAA,IAAA;AAAA,EAExB;AACF;AAKO,MAAMC,IAAgB;AAAA,EAC3B,MAAMH,EAAmB,OAAO,MAAM;AAAA,EACtC,IAAIA,EAAmB,OAAO,IAAI;AAAA,EAClC,IAAIA,EAAmB,OAAO,IAAI;AAAA,EAClC,IAAIA,EAAmB,OAAO,IAAI;AAAA,EAClC,IAAIA,EAAmB,OAAO,IAAI;AAAA,EAClC,OAAOA,EAAmB,OAAO,KAAK;AAAA,EACtC,OAAOA,EAAmB,OAAO,KAAK;AAAA,EACtC,MAAMA,EAAmB,OAAO,MAAM;AACxC;AAYO,SAASI,EAAeH,GAA0C;AACvE,SAAOE,EAAcF,CAAI,EAAE;AAC7B;"}

package/dist/granular/ui/tokens/shadows.js

@@ -0,0 +1,63 @@
+"use client";
+class e {
+  /**
+   * Create a shadow token
+   */
+  static create(n) {
+    return {
+      none: {
+        value: "none",
+        tailwind: "shadow-none",
+        description: "No shadow"
+      },
+      sm: {
+        value: "0 1px 2px 0 rgb(0 0 0 / 0.05)",
+        tailwind: "shadow-sm",
+        description: "Small shadow for subtle elevation"
+      },
+      md: {
+        value: "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)",
+        tailwind: "shadow-md",
+        description: "Medium shadow for cards and elevated elements"
+      },
+      lg: {
+        value: "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)",
+        tailwind: "shadow-lg",
+        description: "Large shadow for modals and dropdowns"
+      },
+      xl: {
+        value: "0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)",
+        tailwind: "shadow-xl",
+        description: "Extra large shadow for prominent modals"
+      },
+      "2xl": {
+        value: "0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)",
+        tailwind: "shadow-2xl",
+        description: "2X large shadow for maximum elevation"
+      },
+      inner: {
+        value: "inset 0 2px 4px 0 rgb(0 0 0 / 0.05)",
+        tailwind: "shadow-inner",
+        description: "Inner shadow for inset elements"
+      }
+    }[n];
+  }
+}
+const o = {
+  none: e.create("none"),
+  sm: e.create("sm"),
+  md: e.create("md"),
+  lg: e.create("lg"),
+  xl: e.create("xl"),
+  "2xl": e.create("2xl"),
+  inner: e.create("inner")
+};
+function d(a) {
+  return o[a].tailwind;
+}
+export {
+  o as SHADOW_TOKENS,
+  e as ShadowTokenFactory,
+  d as getShadowClass
+};
+//# sourceMappingURL=shadows.js.map

package/dist/granular/ui/tokens/shadows.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shadows.js","sources":["../../../../src/ui/tokens/shadows.ts"],"sourcesContent":["/**\n * Shadow Tokens\n *\n * Centralized shadow system for consistent elevation and depth.\n * Uses Factory Pattern for type-safe token creation.\n */\n\nexport type ShadowSize = \"none\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\" | \"inner\";\n\nexport interface ShadowToken {\n  value: string;\n  tailwind: string;\n  description: string;\n}\n\n/**\n * Shadow Token Factory\n * Creates shadow tokens with consistent values\n */\nexport class ShadowTokenFactory {\n  /**\n   * Create a shadow token\n   */\n  static create(size: ShadowSize): ShadowToken {\n    const shadowMap: Record<\n      ShadowSize,\n      { value: string; tailwind: string; description: string }\n    > = {\n      none: {\n        value: \"none\",\n        tailwind: \"shadow-none\",\n        description: \"No shadow\",\n      },\n      sm: {\n        value: \"0 1px 2px 0 rgb(0 0 0 / 0.05)\",\n        tailwind: \"shadow-sm\",\n        description: \"Small shadow for subtle elevation\",\n      },\n      md: {\n        value: \"0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)\",\n        tailwind: \"shadow-md\",\n        description: \"Medium shadow for cards and elevated elements\",\n      },\n      lg: {\n        value:\n          \"0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)\",\n        tailwind: \"shadow-lg\",\n        description: \"Large shadow for modals and dropdowns\",\n      },\n      xl: {\n        value:\n          \"0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)\",\n        tailwind: \"shadow-xl\",\n        description: \"Extra large shadow for prominent modals\",\n      },\n      \"2xl\": {\n        value:\n          \"0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)\",\n        tailwind: \"shadow-2xl\",\n        description: \"2X large shadow for maximum elevation\",\n      },\n      inner: {\n        value: \"inset 0 2px 4px 0 rgb(0 0 0 / 0.05)\",\n        tailwind: \"shadow-inner\",\n        description: \"Inner shadow for inset elements\",\n      },\n    };\n\n    return shadowMap[size];\n  }\n}\n\n/**\n * Pre-defined shadow tokens\n */\nexport const SHADOW_TOKENS = {\n  none: ShadowTokenFactory.create(\"none\"),\n  sm: ShadowTokenFactory.create(\"sm\"),\n  md: ShadowTokenFactory.create(\"md\"),\n  lg: ShadowTokenFactory.create(\"lg\"),\n  xl: ShadowTokenFactory.create(\"xl\"),\n  \"2xl\": ShadowTokenFactory.create(\"2xl\"),\n  inner: ShadowTokenFactory.create(\"inner\"),\n} as const;\n\n/**\n * Helper function to get shadow token\n */\nexport function getShadow(size: keyof typeof SHADOW_TOKENS): ShadowToken {\n  return SHADOW_TOKENS[size];\n}\n\n/**\n * Helper function to get shadow as Tailwind class\n */\nexport function getShadowClass(size: keyof typeof SHADOW_TOKENS): string {\n  return SHADOW_TOKENS[size].tailwind;\n}\n"],"names":["ShadowTokenFactory","size","SHADOW_TOKENS","getShadowClass"],"mappings":";AAmBO,MAAMA,EAAmB;AAAA;AAAA;AAAA;AAAA,EAI9B,OAAO,OAAOC,GAA+B;AA6C3C,WAzCI;AAAA,MACF,MAAM;AAAA,QACJ,OAAO;AAAA,QACP,UAAU;AAAA,QACV,aAAa;AAAA,MAAA;AAAA,MAEf,IAAI;AAAA,QACF,OAAO;AAAA,QACP,UAAU;AAAA,QACV,aAAa;AAAA,MAAA;AAAA,MAEf,IAAI;AAAA,QACF,OAAO;AAAA,QACP,UAAU;AAAA,QACV,aAAa;AAAA,MAAA;AAAA,MAEf,IAAI;AAAA,QACF,OACE;AAAA,QACF,UAAU;AAAA,QACV,aAAa;AAAA,MAAA;AAAA,MAEf,IAAI;AAAA,QACF,OACE;AAAA,QACF,UAAU;AAAA,QACV,aAAa;AAAA,MAAA;AAAA,MAEf,OAAO;AAAA,QACL,OACE;AAAA,QACF,UAAU;AAAA,QACV,aAAa;AAAA,MAAA;AAAA,MAEf,OAAO;AAAA,QACL,OAAO;AAAA,QACP,UAAU;AAAA,QACV,aAAa;AAAA,MAAA;AAAA,IACf,EAGeA,CAAI;AAAA,EACvB;AACF;AAKO,MAAMC,IAAgB;AAAA,EAC3B,MAAMF,EAAmB,OAAO,MAAM;AAAA,EACtC,IAAIA,EAAmB,OAAO,IAAI;AAAA,EAClC,IAAIA,EAAmB,OAAO,IAAI;AAAA,EAClC,IAAIA,EAAmB,OAAO,IAAI;AAAA,EAClC,IAAIA,EAAmB,OAAO,IAAI;AAAA,EAClC,OAAOA,EAAmB,OAAO,KAAK;AAAA,EACtC,OAAOA,EAAmB,OAAO,OAAO;AAC1C;AAYO,SAASG,EAAeF,GAA0C;AACvE,SAAOC,EAAcD,CAAI,EAAE;AAC7B;"}