@tantuui/tokens 0.0.1-rc1

package/dist/index.mjs

@@ -0,0 +1,754 @@
+// src/tokens/color.ts
+var color = {
+  // ── Primitives (raw scale) ──────────────────────────────────────────
+  primitive: {
+    // ── White / Black (brand colors) ───────────────────────────────────
+    white: "#ffffff",
+    black: "#000000",
+    // ── Brand White (scale from pure white) ────────────────────────────
+    brandWhite50: "#ffffff",
+    brandWhite100: "#fefefe",
+    brandWhite200: "#fafafa",
+    brandWhite300: "#f5f5f5",
+    brandWhite400: "#ededed",
+    brandWhite500: "#e0e0e0",
+    brandWhite600: "#c2c2c2",
+    brandWhite700: "#9e9e9e",
+    brandWhite800: "#757575",
+    brandWhite900: "#4a4a4a",
+    brandWhite950: "#2b2b2b",
+    brandWhiteDefault: "#ffffff",
+    // base from brand palette
+    // ── Brand Black (scale from pure black) ────────────────────────────
+    brandBlack50: "#f5f5f5",
+    brandBlack100: "#e8e8e8",
+    brandBlack200: "#d4d4d4",
+    brandBlack300: "#b0b0b0",
+    brandBlack400: "#8a8a8a",
+    brandBlack500: "#616161",
+    brandBlack600: "#4a4a4a",
+    brandBlack700: "#363636",
+    brandBlack800: "#242424",
+    brandBlack900: "#141414",
+    brandBlack950: "#000000",
+    brandBlackDefault: "#000000",
+    // base from brand palette
+    // ── Brand Navy (#0D132B base) ──────────────────────────────────────
+    brandNavy50: "#f3f4f7",
+    brandNavy100: "#e7e8ef",
+    brandNavy200: "#cacfe2",
+    brandNavy300: "#9da8d2",
+    brandNavy400: "#6377c5",
+    brandNavy500: "#354eb0",
+    brandNavy600: "#2c4091",
+    brandNavy700: "#223272",
+    brandNavy800: "#1a2656",
+    brandNavy900: "#121a3b",
+    brandNavy950: "#0a0e1f",
+    brandNavyDefault: "#2c4091",
+    // base from brand palette
+    // ── Brand Blue (#2563EB base) ──────────────────────────────────────
+    brandBlue50: "#eff4ff",
+    brandBlue100: "#dbe6fe",
+    brandBlue200: "#bfd3fe",
+    brandBlue300: "#93b4fd",
+    brandBlue400: "#6090fa",
+    brandBlue500: "#3b6ef6",
+    brandBlue600: "#2563eb",
+    brandBlue700: "#1d50d8",
+    brandBlue800: "#1e41af",
+    brandBlue900: "#1e398a",
+    brandBlue950: "#172554",
+    brandBlueDefault: "#2563EB",
+    // base from brand palette
+    // ── Brand Purple (#7C3AED base) ────────────────────────────────────
+    brandPurple50: "#f5f3ff",
+    brandPurple100: "#ede8ff",
+    brandPurple200: "#ddd6fe",
+    brandPurple300: "#c4b5fc",
+    brandPurple400: "#a78bfa",
+    brandPurple500: "#8b5cf6",
+    brandPurple600: "#7c3aed",
+    brandPurple700: "#6d28d9",
+    brandPurple800: "#5b21b6",
+    brandPurple900: "#4c1d95",
+    brandPurple950: "#2e1065",
+    brandPurpleDefault: "#7C3AED",
+    // base from brand palette
+    // ── Brand Pink (#D946EF base) ──────────────────────────────────────
+    brandPink50: "#fdf4ff",
+    brandPink100: "#fae8ff",
+    brandPink200: "#f5d0fe",
+    brandPink300: "#f0abfc",
+    brandPink400: "#e879f9",
+    brandPink500: "#d946ef",
+    brandPink600: "#c026d3",
+    brandPink700: "#a21caf",
+    brandPink800: "#86198f",
+    brandPink900: "#701a75",
+    brandPink950: "#4a044e",
+    brandPinkDefault: "#c026d3",
+    // base from brand palette
+    // ── Brand Gray (#4B5563 base) ──────────────────────────────────────
+    brandGray50: "#f9fafb",
+    brandGray100: "#f3f4f6",
+    brandGray200: "#e5e7eb",
+    brandGray300: "#d1d5db",
+    brandGray400: "#9ca3af",
+    brandGray500: "#6b7280",
+    brandGray600: "#4b5563",
+    brandGray700: "#374151",
+    brandGray800: "#1f2937",
+    brandGray900: "#111827",
+    brandGray950: "#030712",
+    brandGrayDefault: "#4B5563",
+    // base from brand palette
+    // ── Brand Light (#F3F4F6 base) ─────────────────────────────────────
+    brandLight50: "#fdfefe",
+    brandLight100: "#f9fafb",
+    brandLight200: "#f3f4f6",
+    brandLight300: "#e5e7eb",
+    brandLight400: "#d1d5db",
+    brandLight500: "#9ca3af",
+    brandLight600: "#6b7280",
+    brandLight700: "#4b5563",
+    brandLight800: "#374151",
+    brandLight900: "#1f2937",
+    brandLight950: "#111827",
+    brandLightDefault: "#F3F4F6",
+    // base from brand palette
+    // ── Success (green) ───────────────────────────────────────────────
+    success50: "#f0fdf4",
+    success100: "#dcfce7",
+    success200: "#bbf7d0",
+    success300: "#86efac",
+    success400: "#4ade80",
+    success500: "#22c55e",
+    success600: "#16a34a",
+    success700: "#15803d",
+    success800: "#166534",
+    success900: "#14532d",
+    success950: "#052e16",
+    successDefault: "#16a34a",
+    // ── Warning (amber) ────────────────────────────────────────────────
+    warning50: "#fffbeb",
+    warning100: "#fef3c7",
+    warning200: "#fde68a",
+    warning300: "#fcd34d",
+    warning400: "#fbbf24",
+    warning500: "#f59e0b",
+    warning600: "#d97706",
+    warning700: "#b45309",
+    warning800: "#92400e",
+    warning900: "#78350f",
+    warning950: "#451a03",
+    warningDefault: "#d97706",
+    // ── Danger (red) ───────────────────────────────────────────────────
+    danger50: "#fef2f2",
+    danger100: "#fee2e2",
+    danger200: "#fecaca",
+    danger300: "#fca5a5",
+    danger400: "#f87171",
+    danger500: "#ef4444",
+    danger600: "#dc2626",
+    danger700: "#b91c1c",
+    danger800: "#991b1b",
+    danger900: "#7f1d1d",
+    danger950: "#450a0a",
+    dangerDefault: "#dc2626",
+    // ── Info (blue) ────────────────────────────────────────────────────
+    info50: "#eff6ff",
+    info100: "#dbeafe",
+    info200: "#bfdbfe",
+    info300: "#93c5fd",
+    info400: "#60a5fa",
+    info500: "#3b82f6",
+    info600: "#2563eb",
+    info700: "#1d4ed8",
+    info800: "#1e40af",
+    info900: "#1e3a8a",
+    info950: "#172554",
+    infoDefault: "#2563eb",
+    // ── Teal (cyan/teal) ───────────────────────────────────────────────
+    teal50: "#f0fdfa",
+    teal100: "#ccfbf1",
+    teal200: "#99f6e4",
+    teal300: "#5eead4",
+    teal400: "#2dd4bf",
+    teal500: "#14b8a6",
+    teal600: "#0d9488",
+    teal700: "#0f766e",
+    teal800: "#115e59",
+    teal900: "#134e4a",
+    teal950: "#042f2e",
+    tealDefault: "#0d9488",
+    // ── Orange (deep orange) ───────────────────────────────────────────
+    orange50: "#fff7ed",
+    orange100: "#ffedd5",
+    orange200: "#fed7aa",
+    orange300: "#fdba74",
+    orange400: "#fb923c",
+    orange500: "#f97316",
+    orange600: "#ea580c",
+    orange700: "#c2410c",
+    orange800: "#9a3412",
+    orange900: "#7c2d12",
+    orange950: "#431407",
+    orangeDefault: "#ea580c",
+    // ── Rose (soft red/pink) ───────────────────────────────────────────
+    rose50: "#fff1f2",
+    rose100: "#ffe4e6",
+    rose200: "#fecdd3",
+    rose300: "#fda4af",
+    rose400: "#fb7185",
+    rose500: "#f43f5e",
+    rose600: "#e11d48",
+    rose700: "#be123c",
+    rose800: "#9f1239",
+    rose900: "#881337",
+    rose950: "#4c0519",
+    roseDefault: "#e11d48",
+    // ── Indigo (deep blue-purple) ──────────────────────────────────────
+    indigo50: "#eef2ff",
+    indigo100: "#e0e7ff",
+    indigo200: "#c7d2fe",
+    indigo300: "#a5b4fc",
+    indigo400: "#818cf8",
+    indigo500: "#6366f1",
+    indigo600: "#4f46e5",
+    indigo700: "#4338ca",
+    indigo800: "#3730a3",
+    indigo900: "#312e81",
+    indigo950: "#1e1b4b",
+    indigoDefault: "#4f46e5",
+    // ── Mint (fresh green) ─────────────────────────────────────────────
+    mint50: "#ecfdf5",
+    mint100: "#d1fae5",
+    mint200: "#a7f3d0",
+    mint300: "#6ee7b7",
+    mint400: "#34d399",
+    mint500: "#10b981",
+    mint600: "#059669",
+    mint700: "#047857",
+    mint800: "#065f46",
+    mint900: "#064e3b",
+    mint950: "#022c22",
+    mintDefault: "#059669",
+    // ── Coal (dark neutral state) ──────────────────────────────────────
+    coal50: "#f8fafc",
+    coal100: "#f1f5f9",
+    coal200: "#e2e8f0",
+    coal300: "#cbd5e1",
+    coal400: "#94a3b8",
+    coal500: "#64748b",
+    coal600: "#475569",
+    coal700: "#334155",
+    coal800: "#1e293b",
+    coal900: "#0f172a",
+    coal950: "#020617",
+    coalDefault: "#475569"
+  },
+  // ── Semantic aliases ────────────────────────────────────────────────
+  semantic: {
+    // Background
+    bgBase: "var(--tui-color-white)",
+    bgSubtle: "var(--tui-color-brand-black-50)",
+    bgMuted: "var(--tui-color-brand-black-100)",
+    bgInverse: "var(--tui-color-brand-black-900)",
+    // Surface (cards, panels)
+    surfaceDefault: "var(--tui-color-white)",
+    surfaceRaised: "var(--tui-color-brand-black-50)",
+    surfaceOverlay: "var(--tui-color-brand-black-100)",
+    // Text
+    textPrimary: "var(--tui-color-brand-black-900)",
+    textSecondary: "var(--tui-color-brand-gray-600)",
+    textTertiary: "var(--tui-color-brand-gray-400)",
+    textDisabled: "var(--tui-color-brand-black-300)",
+    textInverse: "var(--tui-color-white)",
+    textLink: "var(--tui-color-brand-blue-600)",
+    textLinkHover: "var(--tui-color-brand-blue-700)",
+    // Border
+    borderDefault: "var(--tui-color-brand-black-200)",
+    borderStrong: "var(--tui-color-brand-black-400)",
+    borderFocus: "var(--tui-color-brand-pink-500)",
+    // Focus ring
+    focusRing: "var(--tui-color-brand-black-500)",
+    focusRingGap: "var(--tui-color-white)",
+    // Brand interactive (uses brand-pink as primary)
+    brandDefault: "var(--tui-color-brand-pink-600)",
+    brandHover: "var(--tui-color-brand-pink-700)",
+    brandActive: "var(--tui-color-brand-pink-800)",
+    brandSubtle: "var(--tui-color-brand-pink-50)",
+    brandText: "var(--tui-color-white)",
+    // Status
+    successDefault: "var(--tui-color-success-600)",
+    successSubtle: "var(--tui-color-success-50)",
+    successText: "var(--tui-color-success-700)",
+    warningDefault: "var(--tui-color-warning-600)",
+    warningSubtle: "var(--tui-color-warning-50)",
+    warningText: "var(--tui-color-warning-700)",
+    dangerDefault: "var(--tui-color-danger-600)",
+    dangerSubtle: "var(--tui-color-danger-50)",
+    dangerText: "var(--tui-color-danger-700)",
+    infoDefault: "var(--tui-color-info-600)",
+    infoSubtle: "var(--tui-color-info-50)",
+    infoText: "var(--tui-color-info-700)",
+    tealDefault: "var(--tui-color-teal-600)",
+    tealSubtle: "var(--tui-color-teal-50)",
+    tealText: "var(--tui-color-teal-700)",
+    orangeDefault: "var(--tui-color-orange-600)",
+    orangeSubtle: "var(--tui-color-orange-50)",
+    orangeText: "var(--tui-color-orange-700)",
+    roseDefault: "var(--tui-color-rose-600)",
+    roseSubtle: "var(--tui-color-rose-50)",
+    roseText: "var(--tui-color-rose-700)",
+    indigoDefault: "var(--tui-color-indigo-600)",
+    indigoSubtle: "var(--tui-color-indigo-50)",
+    indigoText: "var(--tui-color-indigo-700)",
+    mintDefault: "var(--tui-color-mint-600)",
+    mintSubtle: "var(--tui-color-mint-50)",
+    mintText: "var(--tui-color-mint-700)",
+    coalDefault: "var(--tui-color-coal-600)",
+    coalSubtle: "var(--tui-color-coal-50)",
+    coalText: "var(--tui-color-coal-700)"
+  }
+};
+
+// src/tokens/spacing.ts
+var spacing = {
+  0: "0px",
+  px: "1px",
+  0.5: "0.125rem",
+  //  2px
+  1: "0.25rem",
+  //  4px
+  1.5: "0.375rem",
+  //  6px
+  2: "0.5rem",
+  //  8px
+  2.5: "0.625rem",
+  // 10px
+  3: "0.75rem",
+  // 12px
+  3.5: "0.875rem",
+  // 14px
+  4: "1rem",
+  // 16px
+  5: "1.25rem",
+  // 20px
+  6: "1.5rem",
+  // 24px
+  7: "1.75rem",
+  // 28px
+  8: "2rem",
+  // 32px
+  9: "2.25rem",
+  // 36px
+  10: "2.5rem",
+  // 40px
+  11: "2.75rem",
+  // 44px
+  12: "3rem",
+  // 48px
+  14: "3.5rem",
+  // 56px
+  16: "4rem",
+  // 64px
+  20: "5rem",
+  // 80px
+  24: "6rem",
+  // 96px
+  28: "7rem",
+  // 112px
+  32: "8rem",
+  // 128px
+  36: "9rem",
+  // 144px
+  40: "10rem",
+  // 160px
+  44: "11rem",
+  // 176px
+  48: "12rem",
+  // 192px
+  52: "13rem",
+  // 208px
+  56: "14rem",
+  // 224px
+  60: "15rem",
+  // 240px
+  64: "16rem",
+  // 256px
+  72: "18rem",
+  // 288px
+  80: "20rem",
+  // 320px
+  96: "24rem",
+  // 384px
+  // ── Semantic defaults ────────────────────────────────────────────────
+  componentXs: "var(--tui-spacing-1)",
+  // tight inner padding (badges)
+  componentSm: "var(--tui-spacing-2)",
+  // small component padding
+  componentMd: "var(--tui-spacing-3)",
+  // default component padding
+  componentLg: "var(--tui-spacing-4)",
+  // large component padding
+  componentXl: "var(--tui-spacing-6)",
+  // extra-large component padding
+  sectionSm: "var(--tui-spacing-6)",
+  // small section spacing
+  sectionMd: "var(--tui-spacing-8)",
+  // default section spacing
+  sectionLg: "var(--tui-spacing-12)",
+  // large section spacing
+  pagePadding: "var(--tui-spacing-4)",
+  // page-level side padding
+  cardPadding: "var(--tui-spacing-4)",
+  // card/panel inner padding
+  modalPadding: "var(--tui-spacing-6)",
+  // modal/dialog inner padding
+  stackSm: "var(--tui-spacing-2)",
+  // small vertical stack gap
+  stackMd: "var(--tui-spacing-4)",
+  // default vertical stack gap
+  stackLg: "var(--tui-spacing-6)",
+  // large vertical stack gap
+  inlineSm: "var(--tui-spacing-2)",
+  // small horizontal gap
+  inlineMd: "var(--tui-spacing-3)",
+  // default horizontal gap
+  inlineLg: "var(--tui-spacing-4)"
+  // large horizontal gap
+};
+
+// src/tokens/typography.ts
+var fontFamily = {
+  sans: "'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif",
+  serif: "'Georgia', ui-serif, serif",
+  mono: "'JetBrains Mono', ui-monospace, 'Cascadia Code', monospace"
+};
+var fontSize = {
+  "2xs": "0.625rem",
+  // 10px
+  xs: "0.75rem",
+  // 12px
+  sm: "0.875rem",
+  // 14px
+  md: "1rem",
+  // 16px  ← base
+  lg: "1.125rem",
+  // 18px
+  xl: "1.25rem",
+  // 20px
+  "2xl": "1.5rem",
+  // 24px
+  "3xl": "1.875rem",
+  // 30px
+  "4xl": "2.25rem",
+  // 36px
+  "5xl": "3rem",
+  // 48px
+  "6xl": "3.75rem",
+  // 60px
+  "7xl": "4.5rem"
+  // 72px
+};
+var fontWeight = {
+  thin: "100",
+  extralight: "200",
+  light: "300",
+  normal: "400",
+  medium: "500",
+  semibold: "600",
+  bold: "700",
+  extrabold: "800",
+  black: "900"
+};
+var lineHeight = {
+  none: "1",
+  tight: "1.25",
+  snug: "1.375",
+  normal: "1.5",
+  relaxed: "1.625",
+  loose: "2",
+  "3": "0.75rem",
+  "4": "1rem",
+  "5": "1.25rem",
+  "6": "1.5rem",
+  "7": "1.75rem",
+  "8": "2rem",
+  "9": "2.25rem",
+  "10": "2.5rem"
+};
+var letterSpacing = {
+  tighter: "-0.05em",
+  tight: "-0.025em",
+  normal: "0em",
+  wide: "0.025em",
+  wider: "0.05em",
+  widest: "0.1em"
+};
+var typography = {
+  fontFamily,
+  fontSize,
+  fontWeight,
+  lineHeight,
+  letterSpacing
+};
+
+// src/tokens/radius.ts
+var radius = {
+  none: "0px",
+  xs: "0.125rem",
+  //  2px
+  sm: "0.25rem",
+  //  4px
+  md: "0.375rem",
+  //  6px
+  lg: "0.5rem",
+  //  8px
+  xl: "0.75rem",
+  // 12px
+  "2xl": "1rem",
+  // 16px
+  "3xl": "1.5rem",
+  // 24px
+  full: "9999px",
+  // pill / circle
+  // ── Semantic defaults ────────────────────────────────────────────────
+  default: "var(--tui-radius-md)",
+  // default component radius
+  button: "var(--tui-radius-md)",
+  // buttons
+  input: "var(--tui-radius-md)",
+  // inputs, selects, textareas
+  card: "var(--tui-radius-lg)",
+  // cards, panels
+  badge: "var(--tui-radius-full)",
+  // badges, tags, pills
+  avatar: "var(--tui-radius-full)",
+  // avatar circles
+  modal: "var(--tui-radius-xl)",
+  // modals, dialogs
+  tooltip: "var(--tui-radius-sm)"
+  // tooltips, popovers
+};
+
+// src/tokens/shadow.ts
+var shadow = {
+  none: "none",
+  // Elevation scale
+  xs: "0 1px 2px 0 rgb(0 0 0 / 0.05)",
+  sm: "0 1px 3px 0 rgb(0 0 0 / 0.10), 0 1px 2px -1px rgb(0 0 0 / 0.10)",
+  md: "0 4px 6px -1px rgb(0 0 0 / 0.10), 0 2px 4px -2px rgb(0 0 0 / 0.10)",
+  lg: "0 10px 15px -3px rgb(0 0 0 / 0.10), 0 4px 6px -4px rgb(0 0 0 / 0.10)",
+  xl: "0 20px 25px -5px rgb(0 0 0 / 0.10), 0 8px 10px -6px rgb(0 0 0 / 0.10)",
+  "2xl": "0 25px 50px -12px rgb(0 0 0 / 0.25)",
+  // Inner
+  inner: "inset 0 2px 4px 0 rgb(0 0 0 / 0.05)",
+  // Focus ring (used for keyboard focus)
+  focus: "0 0 0 3px var(--tui-color-brand-pink-300, #f0abfc)",
+  // Brand focus ring
+  focusBrand: "0 0 0 3px var(--tui-color-brand-pink-400, #e879f9)",
+  // ── Semantic defaults ────────────────────────────────────────────────
+  default: "var(--tui-shadow-sm)",
+  // default component shadow
+  card: "var(--tui-shadow-md)",
+  // cards, panels
+  dropdown: "var(--tui-shadow-lg)",
+  // dropdowns, menus
+  modal: "var(--tui-shadow-xl)",
+  // modals, dialogs
+  tooltip: "var(--tui-shadow-md)",
+  // tooltips, popovers
+  button: "var(--tui-shadow-xs)"
+  // subtle button lift
+};
+
+// src/tokens/border.ts
+var borderWidth = {
+  0: "0px",
+  0.5: "0.5px",
+  1: "1px",
+  1.5: "1.5px",
+  2: "2px",
+  2.5: "2.5px",
+  3: "3px",
+  3.5: "3.5px",
+  4: "4px",
+  4.5: "4.5px",
+  5: "5px",
+  5.5: "5.5px",
+  8: "8px",
+  none: "0px",
+  xs: "0.5px",
+  sm: "1px",
+  md: "2px",
+  lg: "4px",
+  xl: "6px",
+  "2xl": "12px",
+  "3xl": "18px",
+  "4xl": "24px",
+  "5xl": "30px",
+  "6xl": "36px",
+  "7xl": "42px",
+  "8xl": "48px",
+  // ── Semantic defaults ────────────────────────────────────────────────
+  default: "var(--tui-border-width-1)",
+  // default border width
+  input: "var(--tui-border-width-1)",
+  // input/select border
+  card: "var(--tui-border-width-1)",
+  // card border
+  divider: "var(--tui-border-width-1)",
+  // horizontal/vertical dividers
+  thick: "var(--tui-border-width-2)"
+  // emphasized borders
+};
+var borderStyle = {
+  solid: "solid",
+  dashed: "dashed",
+  dotted: "dotted",
+  none: "none"
+};
+var border = {
+  width: borderWidth,
+  style: borderStyle
+};
+
+// src/tokens/zindex.ts
+var zIndex = {
+  hide: "-1",
+  auto: "auto",
+  base: "0",
+  raised: "1",
+  dropdown: "1000",
+  sticky: "1100",
+  overlay: "1200",
+  modal: "1300",
+  popover: "1400",
+  toast: "1500",
+  tooltip: "1600"
+};
+
+// src/tokens/animation.ts
+var duration = {
+  instant: "0ms",
+  fast: "100ms",
+  normal: "200ms",
+  slow: "300ms",
+  slower: "500ms",
+  slowest: "700ms",
+  // ── Semantic defaults ────────────────────────────────────────────────
+  default: "var(--tui-duration-normal)",
+  // default transition duration
+  hover: "var(--tui-duration-fast)",
+  // hover state transitions
+  modal: "var(--tui-duration-slow)",
+  // modal open/close
+  tooltip: "var(--tui-duration-fast)",
+  // tooltip show/hide
+  collapse: "var(--tui-duration-slow)"
+  // accordion/collapse
+};
+var easing = {
+  linear: "linear",
+  in: "cubic-bezier(0.4, 0, 1, 1)",
+  out: "cubic-bezier(0, 0, 0.2, 1)",
+  inOut: "cubic-bezier(0.4, 0, 0.2, 1)",
+  bounce: "cubic-bezier(0.34, 1.56, 0.64, 1)",
+  spring: "cubic-bezier(0.175, 0.885, 0.32, 1.275)",
+  // ── Semantic defaults ────────────────────────────────────────────────
+  default: "var(--tui-ease-in-out)",
+  // default easing
+  enter: "var(--tui-ease-out)",
+  // elements entering
+  exit: "var(--tui-ease-in)"
+  // elements exiting
+};
+var animation = {
+  duration,
+  easing
+};
+
+// src/tokens/breakpoint.ts
+var breakpoint = {
+  xs: "320px",
+  sm: "640px",
+  md: "768px",
+  lg: "1024px",
+  xl: "1280px",
+  "2xl": "1536px"
+};
+
+// src/tokens/opacity.ts
+var opacity = {
+  0: "0",
+  5: "0.05",
+  10: "0.1",
+  20: "0.2",
+  25: "0.25",
+  30: "0.3",
+  35: "0.35",
+  40: "0.4",
+  45: "0.45",
+  50: "0.5",
+  55: "0.55",
+  60: "0.6",
+  65: "0.65",
+  70: "0.7",
+  75: "0.75",
+  80: "0.8",
+  85: "0.55",
+  90: "0.9",
+  95: "0.95",
+  100: "1"
+};
+
+// src/css-generator.ts
+function toKebab(str) {
+  return str.replace(/\./g, "_").replace(/([a-z])([A-Z])/g, "$1-$2").replace(/([A-Z])([A-Z][a-z])/g, "$1-$2").replace(/([a-zA-Z])(\d)/g, "$1-$2").toLowerCase();
+}
+function flattenTokens(obj, prefix = "--tui", skipKeys = []) {
+  const result = {};
+  for (const [key, value] of Object.entries(obj)) {
+    const segment = toKebab(key);
+    const varName = skipKeys.includes(key) ? prefix : `${prefix}-${segment}`;
+    if (typeof value === "object" && value !== null) {
+      Object.assign(result, flattenTokens(value, varName, []));
+    } else {
+      result[varName] = String(value);
+    }
+  }
+  return result;
+}
+function toCSSRoot(flatTokens, selector = ":root") {
+  const lines = Object.entries(flatTokens).map(([prop, value]) => `  ${prop}: ${value};`).join("\n");
+  return `${selector} {
+${lines}
+}
+`;
+}
+function generateCSSCategory(categoryName, tokens2, selector = ":root", skipKeys = []) {
+  const prefix = `--tui-${toKebab(categoryName)}`;
+  const flat = flattenTokens(tokens2, prefix, skipKeys);
+  return toCSSRoot(flat, selector);
+}
+
+// src/index.ts
+var tokens = {
+  color,
+  spacing,
+  typography,
+  radius,
+  shadow,
+  border,
+  zIndex,
+  animation,
+  breakpoint,
+  opacity
+};
+
+export { animation, border, borderStyle, borderWidth, breakpoint, color, duration, easing, flattenTokens, fontFamily, fontSize, fontWeight, generateCSSCategory, letterSpacing, lineHeight, opacity, radius, shadow, spacing, toCSSRoot, tokens, typography, zIndex };
+//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.mjs.map