@timbenniks/contentstack-platform-sdk 0.1.0

package/dist/ui/index.cjs

@@ -0,0 +1,368 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/ui/index.ts
+var ui_exports = {};
+__export(ui_exports, {
+  CSS_TOKENS_PATH: () => CSS_TOKENS_PATH,
+  colorVar: () => colorVar,
+  colors: () => colors,
+  fontVar: () => fontVar,
+  getEffectiveTheme: () => getEffectiveTheme,
+  getTheme: () => getTheme,
+  initTheme: () => initTheme,
+  onThemeChange: () => onThemeChange,
+  setTheme: () => setTheme,
+  spaceVar: () => spaceVar,
+  spacing: () => spacing,
+  typography: () => typography
+});
+module.exports = __toCommonJS(ui_exports);
+
+// src/ui/tokens/colors.ts
+var colors = {
+  brand: {
+    primary: {
+      base: "#6c5ce7",
+      medium: "#9387ed",
+      dark: "#3e3871",
+      darker: "#5d50bf",
+      light: "#efedfc"
+    },
+    secondary: {
+      lightest: "#dde3ee",
+      lighter: "#edf1f7",
+      light: "#a9b6cb",
+      base: "#647696",
+      medium: "#c7d0e1",
+      dark: "#475161"
+    }
+  },
+  status: {
+    success: {
+      base: "#007a52",
+      dark: "#00472f",
+      light: "#f5fffc"
+    },
+    warning: {
+      base: "#d62400",
+      dark: "#701300",
+      light: "#ffeeeb",
+      medium: "#eb5646"
+    },
+    attention: {
+      base: "#ffae0a",
+      dark: "#704b00",
+      light: "#fff8eb"
+    },
+    info: {
+      base: "#00b9e0",
+      dark: "#003b47",
+      light: "#f5fdff"
+    }
+  },
+  base: {
+    purple: {
+      5: "#6c5ce7",
+      10: "#3e3871",
+      15: "#efedfc",
+      20: "#9387ed",
+      25: "#5d50bf"
+    },
+    gray: {
+      5: "#edf1f7",
+      10: "#a9b6cb",
+      15: "#647696",
+      20: "#475161",
+      25: "rgba(160, 174, 192, 0.5)",
+      30: "#f5f5f5",
+      35: "#c7d0e1",
+      40: "#dde3ee"
+    },
+    green: {
+      5: "#007a52",
+      10: "#00472f",
+      15: "#f5fffc"
+    },
+    orange: {
+      5: "#d62400",
+      10: "#701300",
+      15: "#ffeeeb",
+      20: "#eb5646"
+    },
+    blue: {
+      5: "#00b9e0",
+      10: "#003b47",
+      15: "#f5fdff"
+    },
+    yellow: {
+      5: "#ffae0a",
+      10: "#704b00",
+      15: "#fff8eb"
+    },
+    black: {
+      5: "#222222"
+    },
+    white: {
+      5: "#ffffff",
+      10: "#f7f9fc",
+      15: "#f5f5f5",
+      20: "#f7f9fc"
+    }
+  },
+  font: {
+    base: "#475161",
+    secondary: "#647696",
+    tertiary: "#a9b6cb",
+    quaternary: "#edf1f7",
+    link: "#6c5ce7",
+    active: "#647696",
+    warning: "#d62400",
+    attention: "#ffae0a",
+    success: "#007a52",
+    info: "#00b9e0",
+    disabled: "rgba(160, 174, 192, 0.5)",
+    white: "#ffffff",
+    black: "#222222",
+    sonicSilver: "#767676",
+    tarmacGrey: "#475161",
+    gray900: "#212121",
+    jetBlack: "#000000",
+    purpleGray: "#6e6b86"
+  },
+  border: {
+    lighter: "#f5f5f5",
+    light: "#a9b6cb",
+    base: "#647696",
+    dark: "#475161",
+    link: "#6c5ce7",
+    focus: "#edf1f7",
+    warning: "#d62400",
+    success: "#007a52"
+  },
+  bg: {
+    lavender: "#f8f6ff",
+    dolphinGrey: "#dde3ee",
+    pureWhite: "#ffffff",
+    milkybarWhite: "#f7f9fc",
+    hibiscus: "#ffeeeb",
+    cashew: "#fff8eb",
+    algae: "#f5fffc",
+    sky: "#f5fdff",
+    tulipPurple: "#f9f8ff",
+    lavenderBlue: "#fadeff"
+  },
+  accent: {
+    purple50: "#b6aef3",
+    mediumOrchid: "#bd59fa",
+    blueChalk: "#edebff",
+    paleAqua: "#bad4fb",
+    pastelBlue: "#43b7c2",
+    bottleGreen: "#003a25",
+    aquaDeep: "#00593b",
+    mint: "#47b0aa",
+    summerGreen: "#90bba5",
+    bean: "#4f0800",
+    rustOrange: "#ba5800",
+    salmonPink: "#e57872",
+    crayola: "#ffce6c",
+    sundown: "#fdafa3",
+    butterscotch: "#ffad48"
+  },
+  statusAccent: {
+    poppy: "#a31b00",
+    mango: "#ffae0a",
+    spinach: "#007a52",
+    aqua: "#0469e3",
+    maximumBluePurple: "#ada4f4"
+  }
+};
+function colorVar(name) {
+  return `var(--cs-color-${name})`;
+}
+
+// src/ui/tokens/typography.ts
+var typography = {
+  fontFamily: {
+    primary: "Inter, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif"
+  },
+  fontSize: {
+    tiny: "0.6875rem",
+    small: "0.75rem",
+    medium: "0.8125rem",
+    large: "0.875rem",
+    xl: "1rem",
+    "2xl": "1.125rem",
+    "3xl": "1.375rem",
+    "4xl": "1.875rem",
+    "5xl": "2.25rem",
+    "6xl": "2.625rem"
+  },
+  fontSizeV2: {
+    small: "0.75rem",
+    medium: "0.875rem",
+    large: "1rem",
+    xl: "1.25rem",
+    "2xl": "1.75rem",
+    "3xl": "2.125rem"
+  },
+  fontWeight: {
+    regular: 400,
+    medium: 500,
+    semiBold: 600,
+    bold: 700,
+    extraBold: 800
+  },
+  lineHeight: {
+    default: 1.5,
+    condensed: 1.25,
+    reset: 1
+  },
+  letterSpacing: {
+    tight: "0.01em",
+    normal: "0.02em"
+  }
+};
+function fontVar(name) {
+  return `var(--cs-${name})`;
+}
+
+// src/ui/tokens/spacing.ts
+var spacing = {
+  2: "0.125rem",
+  4: "0.25rem",
+  5: "0.3125rem",
+  6: "0.375rem",
+  8: "0.5rem",
+  10: "0.625rem",
+  12: "0.75rem",
+  14: "0.875rem",
+  15: "0.9375rem",
+  16: "1rem",
+  18: "1.125rem",
+  20: "1.25rem",
+  22: "1.375rem",
+  24: "1.5rem",
+  25: "1.5625rem",
+  26: "1.625rem",
+  28: "1.75rem",
+  30: "1.875rem",
+  32: "2rem",
+  34: "2.125rem",
+  35: "2.1875rem",
+  36: "2.25rem",
+  38: "2.375rem",
+  40: "2.5rem",
+  50: "3.125rem",
+  60: "3.75rem",
+  64: "4rem",
+  80: "5rem",
+  100: "6.25rem",
+  120: "7.5rem",
+  160: "10rem"
+};
+function spaceVar(size) {
+  return `var(--cs-space-${size})`;
+}
+
+// src/ui/theme/theme.ts
+var STORAGE_KEY = "cs-theme";
+var DATA_ATTR = "data-theme";
+function getTheme() {
+  if (typeof document === "undefined") return "system";
+  const attr = document.documentElement.getAttribute(DATA_ATTR);
+  if (attr === "light" || attr === "dark") return attr;
+  return "system";
+}
+function setTheme(theme) {
+  if (typeof document === "undefined") return;
+  if (theme === "system") {
+    document.documentElement.removeAttribute(DATA_ATTR);
+  } else {
+    document.documentElement.setAttribute(DATA_ATTR, theme);
+  }
+  try {
+    if (typeof localStorage !== "undefined") {
+      localStorage.setItem(STORAGE_KEY, theme);
+    }
+  } catch {
+  }
+}
+function initTheme() {
+  try {
+    if (typeof localStorage === "undefined") return;
+    const stored = localStorage.getItem(STORAGE_KEY);
+    if (stored === "light" || stored === "dark" || stored === "system") {
+      setTheme(stored);
+    }
+  } catch {
+  }
+}
+function onThemeChange(callback) {
+  if (typeof window === "undefined") return () => {
+  };
+  const observer = new MutationObserver(() => {
+    callback(getTheme());
+  });
+  observer.observe(document.documentElement, {
+    attributes: true,
+    attributeFilter: [DATA_ATTR]
+  });
+  let mediaQuery;
+  const mediaHandler = () => {
+    if (getTheme() === "system") {
+      callback("system");
+    }
+  };
+  if (typeof window.matchMedia === "function") {
+    mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+    mediaQuery.addEventListener("change", mediaHandler);
+  }
+  return () => {
+    observer.disconnect();
+    mediaQuery?.removeEventListener("change", mediaHandler);
+  };
+}
+function getEffectiveTheme() {
+  const theme = getTheme();
+  if (theme !== "system") return theme;
+  if (typeof window !== "undefined" && typeof window.matchMedia === "function") {
+    return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+  }
+  return "light";
+}
+
+// src/ui/css/index.ts
+var CSS_TOKENS_PATH = "@timbenniks/contentstack-platform-sdk/ui/tokens.css";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  CSS_TOKENS_PATH,
+  colorVar,
+  colors,
+  fontVar,
+  getEffectiveTheme,
+  getTheme,
+  initTheme,
+  onThemeChange,
+  setTheme,
+  spaceVar,
+  spacing,
+  typography
+});
+//# sourceMappingURL=index.cjs.map

package/dist/ui/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/ui/index.ts","../../src/ui/tokens/colors.ts","../../src/ui/tokens/typography.ts","../../src/ui/tokens/spacing.ts","../../src/ui/theme/theme.ts","../../src/ui/css/index.ts"],"sourcesContent":["export * from \"./tokens/index.js\"\nexport * from \"./theme/index.js\"\nexport { CSS_TOKENS_PATH } from \"./css/index.js\"\n","import type { ColorTokens } from \"./types.js\"\n\n/**\n * Contentstack Venus design system color tokens (light theme).\n * Values sourced from `@contentstack/venus-components` token definitions.\n */\nexport const colors: ColorTokens = {\n  brand: {\n    primary: {\n      base: \"#6c5ce7\",\n      medium: \"#9387ed\",\n      dark: \"#3e3871\",\n      darker: \"#5d50bf\",\n      light: \"#efedfc\",\n    },\n    secondary: {\n      lightest: \"#dde3ee\",\n      lighter: \"#edf1f7\",\n      light: \"#a9b6cb\",\n      base: \"#647696\",\n      medium: \"#c7d0e1\",\n      dark: \"#475161\",\n    },\n  },\n  status: {\n    success: {\n      base: \"#007a52\",\n      dark: \"#00472f\",\n      light: \"#f5fffc\",\n    },\n    warning: {\n      base: \"#d62400\",\n      dark: \"#701300\",\n      light: \"#ffeeeb\",\n      medium: \"#eb5646\",\n    },\n    attention: {\n      base: \"#ffae0a\",\n      dark: \"#704b00\",\n      light: \"#fff8eb\",\n    },\n    info: {\n      base: \"#00b9e0\",\n      dark: \"#003b47\",\n      light: \"#f5fdff\",\n    },\n  },\n  base: {\n    purple: {\n      5: \"#6c5ce7\",\n      10: \"#3e3871\",\n      15: \"#efedfc\",\n      20: \"#9387ed\",\n      25: \"#5d50bf\",\n    },\n    gray: {\n      5: \"#edf1f7\",\n      10: \"#a9b6cb\",\n      15: \"#647696\",\n      20: \"#475161\",\n      25: \"rgba(160, 174, 192, 0.5)\",\n      30: \"#f5f5f5\",\n      35: \"#c7d0e1\",\n      40: \"#dde3ee\",\n    },\n    green: {\n      5: \"#007a52\",\n      10: \"#00472f\",\n      15: \"#f5fffc\",\n    },\n    orange: {\n      5: \"#d62400\",\n      10: \"#701300\",\n      15: \"#ffeeeb\",\n      20: \"#eb5646\",\n    },\n    blue: {\n      5: \"#00b9e0\",\n      10: \"#003b47\",\n      15: \"#f5fdff\",\n    },\n    yellow: {\n      5: \"#ffae0a\",\n      10: \"#704b00\",\n      15: \"#fff8eb\",\n    },\n    black: {\n      5: \"#222222\",\n    },\n    white: {\n      5: \"#ffffff\",\n      10: \"#f7f9fc\",\n      15: \"#f5f5f5\",\n      20: \"#f7f9fc\",\n    },\n  },\n  font: {\n    base: \"#475161\",\n    secondary: \"#647696\",\n    tertiary: \"#a9b6cb\",\n    quaternary: \"#edf1f7\",\n    link: \"#6c5ce7\",\n    active: \"#647696\",\n    warning: \"#d62400\",\n    attention: \"#ffae0a\",\n    success: \"#007a52\",\n    info: \"#00b9e0\",\n    disabled: \"rgba(160, 174, 192, 0.5)\",\n    white: \"#ffffff\",\n    black: \"#222222\",\n    sonicSilver: \"#767676\",\n    tarmacGrey: \"#475161\",\n    gray900: \"#212121\",\n    jetBlack: \"#000000\",\n    purpleGray: \"#6e6b86\",\n  },\n  border: {\n    lighter: \"#f5f5f5\",\n    light: \"#a9b6cb\",\n    base: \"#647696\",\n    dark: \"#475161\",\n    link: \"#6c5ce7\",\n    focus: \"#edf1f7\",\n    warning: \"#d62400\",\n    success: \"#007a52\",\n  },\n  bg: {\n    lavender: \"#f8f6ff\",\n    dolphinGrey: \"#dde3ee\",\n    pureWhite: \"#ffffff\",\n    milkybarWhite: \"#f7f9fc\",\n    hibiscus: \"#ffeeeb\",\n    cashew: \"#fff8eb\",\n    algae: \"#f5fffc\",\n    sky: \"#f5fdff\",\n    tulipPurple: \"#f9f8ff\",\n    lavenderBlue: \"#fadeff\",\n  },\n  accent: {\n    purple50: \"#b6aef3\",\n    mediumOrchid: \"#bd59fa\",\n    blueChalk: \"#edebff\",\n    paleAqua: \"#bad4fb\",\n    pastelBlue: \"#43b7c2\",\n    bottleGreen: \"#003a25\",\n    aquaDeep: \"#00593b\",\n    mint: \"#47b0aa\",\n    summerGreen: \"#90bba5\",\n    bean: \"#4f0800\",\n    rustOrange: \"#ba5800\",\n    salmonPink: \"#e57872\",\n    crayola: \"#ffce6c\",\n    sundown: \"#fdafa3\",\n    butterscotch: \"#ffad48\",\n  },\n  statusAccent: {\n    poppy: \"#a31b00\",\n    mango: \"#ffae0a\",\n    spinach: \"#007a52\",\n    aqua: \"#0469e3\",\n    maximumBluePurple: \"#ada4f4\",\n  },\n} as const\n\n/**\n * Returns a CSS `var()` reference for a color token.\n *\n * @example\n * ```ts\n * colorVar(\"brand-primary-base\")   // \"var(--cs-color-brand-primary-base)\"\n * colorVar(\"font-link\")            // \"var(--cs-color-font-link)\"\n * ```\n */\nexport function colorVar(name: string): string {\n  return `var(--cs-color-${name})`\n}\n","import type { TypographyTokens } from \"./types.js\"\n\n/**\n * Contentstack Venus design system typography tokens.\n * Values sourced from `@contentstack/venus-components` token definitions.\n */\nexport const typography: TypographyTokens = {\n  fontFamily: {\n    primary: \"Inter, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif\",\n  },\n  fontSize: {\n    tiny: \"0.6875rem\",\n    small: \"0.75rem\",\n    medium: \"0.8125rem\",\n    large: \"0.875rem\",\n    xl: \"1rem\",\n    \"2xl\": \"1.125rem\",\n    \"3xl\": \"1.375rem\",\n    \"4xl\": \"1.875rem\",\n    \"5xl\": \"2.25rem\",\n    \"6xl\": \"2.625rem\",\n  },\n  fontSizeV2: {\n    small: \"0.75rem\",\n    medium: \"0.875rem\",\n    large: \"1rem\",\n    xl: \"1.25rem\",\n    \"2xl\": \"1.75rem\",\n    \"3xl\": \"2.125rem\",\n  },\n  fontWeight: {\n    regular: 400,\n    medium: 500,\n    semiBold: 600,\n    bold: 700,\n    extraBold: 800,\n  },\n  lineHeight: {\n    default: 1.5,\n    condensed: 1.25,\n    reset: 1,\n  },\n  letterSpacing: {\n    tight: \"0.01em\",\n    normal: \"0.02em\",\n  },\n} as const\n\n/**\n * Returns a CSS `var()` reference for a typography token.\n *\n * @example\n * ```ts\n * fontVar(\"size-font-large\")       // \"var(--cs-size-font-large)\"\n * fontVar(\"font-weight-bold\")      // \"var(--cs-font-weight-bold)\"\n * fontVar(\"font-family-primary\")   // \"var(--cs-font-family-primary)\"\n * ```\n */\nexport function fontVar(name: string): string {\n  return `var(--cs-${name})`\n}\n","import type { SpacingTokens } from \"./types.js\"\n\n/**\n * Contentstack Venus design system spacing tokens.\n * Values sourced from `@contentstack/venus-components` token definitions.\n * Names represent pixel values, values are in rem.\n */\nexport const spacing: SpacingTokens = {\n  2: \"0.125rem\",\n  4: \"0.25rem\",\n  5: \"0.3125rem\",\n  6: \"0.375rem\",\n  8: \"0.5rem\",\n  10: \"0.625rem\",\n  12: \"0.75rem\",\n  14: \"0.875rem\",\n  15: \"0.9375rem\",\n  16: \"1rem\",\n  18: \"1.125rem\",\n  20: \"1.25rem\",\n  22: \"1.375rem\",\n  24: \"1.5rem\",\n  25: \"1.5625rem\",\n  26: \"1.625rem\",\n  28: \"1.75rem\",\n  30: \"1.875rem\",\n  32: \"2rem\",\n  34: \"2.125rem\",\n  35: \"2.1875rem\",\n  36: \"2.25rem\",\n  38: \"2.375rem\",\n  40: \"2.5rem\",\n  50: \"3.125rem\",\n  60: \"3.75rem\",\n  64: \"4rem\",\n  80: \"5rem\",\n  100: \"6.25rem\",\n  120: \"7.5rem\",\n  160: \"10rem\",\n} as const\n\n/**\n * Returns a CSS `var()` reference for a spacing token.\n *\n * @example\n * ```ts\n * spaceVar(16)   // \"var(--cs-space-16)\"\n * spaceVar(4)    // \"var(--cs-space-4)\"\n * ```\n */\nexport function spaceVar(size: number): string {\n  return `var(--cs-space-${size})`\n}\n","import type { Theme } from \"../tokens/types.js\"\n\nconst STORAGE_KEY = \"cs-theme\"\nconst DATA_ATTR = \"data-theme\"\n\n/**\n * Get the current theme setting.\n * Returns `\"light\"`, `\"dark\"`, or `\"system\"` (when no `data-theme` attribute is set).\n */\nexport function getTheme(): Theme {\n  if (typeof document === \"undefined\") return \"system\"\n  const attr = document.documentElement.getAttribute(DATA_ATTR)\n  if (attr === \"light\" || attr === \"dark\") return attr\n  return \"system\"\n}\n\n/**\n * Set the theme. Applies `data-theme` attribute to `<html>` and\n * persists the choice to `localStorage`.\n *\n * - `\"light\"` or `\"dark\"` sets the attribute explicitly.\n * - `\"system\"` removes the attribute, deferring to `prefers-color-scheme`.\n */\nexport function setTheme(theme: Theme): void {\n  if (typeof document === \"undefined\") return\n\n  if (theme === \"system\") {\n    document.documentElement.removeAttribute(DATA_ATTR)\n  } else {\n    document.documentElement.setAttribute(DATA_ATTR, theme)\n  }\n\n  try {\n    if (typeof localStorage !== \"undefined\") {\n      localStorage.setItem(STORAGE_KEY, theme)\n    }\n  } catch {\n    // localStorage may be unavailable (e.g., iframe sandboxing)\n  }\n}\n\n/**\n * Initialize the theme from `localStorage` on page load.\n * Call this early (e.g., in a `<script>` tag or app init) to\n * prevent a flash of wrong theme.\n */\nexport function initTheme(): void {\n  try {\n    if (typeof localStorage === \"undefined\") return\n    const stored = localStorage.getItem(STORAGE_KEY)\n    if (stored === \"light\" || stored === \"dark\" || stored === \"system\") {\n      setTheme(stored)\n    }\n  } catch {\n    // localStorage may be unavailable\n  }\n}\n\n/**\n * Subscribe to theme changes (both programmatic and OS-level).\n * Returns an unsubscribe function.\n */\nexport function onThemeChange(callback: (theme: Theme) => void): () => void {\n  if (typeof window === \"undefined\") return () => {}\n\n  const observer = new MutationObserver(() => {\n    callback(getTheme())\n  })\n\n  observer.observe(document.documentElement, {\n    attributes: true,\n    attributeFilter: [DATA_ATTR],\n  })\n\n  let mediaQuery: MediaQueryList | undefined\n  const mediaHandler = () => {\n    if (getTheme() === \"system\") {\n      callback(\"system\")\n    }\n  }\n\n  if (typeof window.matchMedia === \"function\") {\n    mediaQuery = window.matchMedia(\"(prefers-color-scheme: dark)\")\n    mediaQuery.addEventListener(\"change\", mediaHandler)\n  }\n\n  return () => {\n    observer.disconnect()\n    mediaQuery?.removeEventListener(\"change\", mediaHandler)\n  }\n}\n\n/**\n * Get the resolved effective theme (never `\"system\"`).\n * Useful when you need to know the actual visual appearance.\n */\nexport function getEffectiveTheme(): \"light\" | \"dark\" {\n  const theme = getTheme()\n  if (theme !== \"system\") return theme\n\n  if (typeof window !== \"undefined\" && typeof window.matchMedia === \"function\") {\n    return window.matchMedia(\"(prefers-color-scheme: dark)\").matches ? \"dark\" : \"light\"\n  }\n  return \"light\"\n}\n","/**\n * Import path for the CSS tokens file.\n *\n * @example\n * ```ts\n * // In a bundler that supports CSS imports:\n * import \"@timbenniks/contentstack-platform-sdk/ui/tokens.css\"\n *\n * // Or reference the path programmatically:\n * import { CSS_TOKENS_PATH } from \"@timbenniks/contentstack-platform-sdk/ui/css\"\n * ```\n */\nexport const CSS_TOKENS_PATH = \"@timbenniks/contentstack-platform-sdk/ui/tokens.css\"\n"],"mappings":"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","names":[]}

package/dist/ui/index.d.cts

@@ -0,0 +1,4 @@
+export { A as AccentColors, B as BaseColorBlack, a as BaseColorGray, b as BaseColorOrange, c as BaseColorPurple, d as BaseColorTriple, e as BaseColorWhite, f as BaseColors, g as BgColors, h as BorderColors, i as BrandPrimaryColors, j as BrandSecondaryColors, C as ColorTokens, F as FontColors, S as SpacingTokens, k as StatusAccentColors, l as StatusColorScale, m as StatusColors, T as Theme, n as TypographyTokens, W as WarningColors } from '../types-DrMwdlH9.cjs';
+export { colorVar, colors, fontVar, spaceVar, spacing, typography } from './tokens/index.cjs';
+export { getEffectiveTheme, getTheme, initTheme, onThemeChange, setTheme } from './theme/index.cjs';
+export { CSS_TOKENS_PATH } from './css/index.cjs';

package/dist/ui/index.d.ts

@@ -0,0 +1,4 @@
+export { A as AccentColors, B as BaseColorBlack, a as BaseColorGray, b as BaseColorOrange, c as BaseColorPurple, d as BaseColorTriple, e as BaseColorWhite, f as BaseColors, g as BgColors, h as BorderColors, i as BrandPrimaryColors, j as BrandSecondaryColors, C as ColorTokens, F as FontColors, S as SpacingTokens, k as StatusAccentColors, l as StatusColorScale, m as StatusColors, T as Theme, n as TypographyTokens, W as WarningColors } from '../types-DrMwdlH9.js';
+export { colorVar, colors, fontVar, spaceVar, spacing, typography } from './tokens/index.js';
+export { getEffectiveTheme, getTheme, initTheme, onThemeChange, setTheme } from './theme/index.js';
+export { CSS_TOKENS_PATH } from './css/index.js';

package/dist/ui/index.mjs

@@ -0,0 +1,33 @@
+import {
+  colorVar,
+  colors,
+  fontVar,
+  spaceVar,
+  spacing,
+  typography
+} from "../chunk-JL2E3EOT.mjs";
+import {
+  CSS_TOKENS_PATH
+} from "../chunk-QGA4WBDC.mjs";
+import {
+  getEffectiveTheme,
+  getTheme,
+  initTheme,
+  onThemeChange,
+  setTheme
+} from "../chunk-BUZ6CQHE.mjs";
+export {
+  CSS_TOKENS_PATH,
+  colorVar,
+  colors,
+  fontVar,
+  getEffectiveTheme,
+  getTheme,
+  initTheme,
+  onThemeChange,
+  setTheme,
+  spaceVar,
+  spacing,
+  typography
+};
+//# sourceMappingURL=index.mjs.map

package/dist/ui/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/ui/theme/index.cjs

@@ -0,0 +1,105 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/ui/theme/index.ts
+var theme_exports = {};
+__export(theme_exports, {
+  getEffectiveTheme: () => getEffectiveTheme,
+  getTheme: () => getTheme,
+  initTheme: () => initTheme,
+  onThemeChange: () => onThemeChange,
+  setTheme: () => setTheme
+});
+module.exports = __toCommonJS(theme_exports);
+
+// src/ui/theme/theme.ts
+var STORAGE_KEY = "cs-theme";
+var DATA_ATTR = "data-theme";
+function getTheme() {
+  if (typeof document === "undefined") return "system";
+  const attr = document.documentElement.getAttribute(DATA_ATTR);
+  if (attr === "light" || attr === "dark") return attr;
+  return "system";
+}
+function setTheme(theme) {
+  if (typeof document === "undefined") return;
+  if (theme === "system") {
+    document.documentElement.removeAttribute(DATA_ATTR);
+  } else {
+    document.documentElement.setAttribute(DATA_ATTR, theme);
+  }
+  try {
+    if (typeof localStorage !== "undefined") {
+      localStorage.setItem(STORAGE_KEY, theme);
+    }
+  } catch {
+  }
+}
+function initTheme() {
+  try {
+    if (typeof localStorage === "undefined") return;
+    const stored = localStorage.getItem(STORAGE_KEY);
+    if (stored === "light" || stored === "dark" || stored === "system") {
+      setTheme(stored);
+    }
+  } catch {
+  }
+}
+function onThemeChange(callback) {
+  if (typeof window === "undefined") return () => {
+  };
+  const observer = new MutationObserver(() => {
+    callback(getTheme());
+  });
+  observer.observe(document.documentElement, {
+    attributes: true,
+    attributeFilter: [DATA_ATTR]
+  });
+  let mediaQuery;
+  const mediaHandler = () => {
+    if (getTheme() === "system") {
+      callback("system");
+    }
+  };
+  if (typeof window.matchMedia === "function") {
+    mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+    mediaQuery.addEventListener("change", mediaHandler);
+  }
+  return () => {
+    observer.disconnect();
+    mediaQuery?.removeEventListener("change", mediaHandler);
+  };
+}
+function getEffectiveTheme() {
+  const theme = getTheme();
+  if (theme !== "system") return theme;
+  if (typeof window !== "undefined" && typeof window.matchMedia === "function") {
+    return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+  }
+  return "light";
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  getEffectiveTheme,
+  getTheme,
+  initTheme,
+  onThemeChange,
+  setTheme
+});
+//# sourceMappingURL=index.cjs.map

package/dist/ui/theme/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/ui/theme/index.ts","../../../src/ui/theme/theme.ts"],"sourcesContent":["export { getTheme, setTheme, initTheme, onThemeChange, getEffectiveTheme } from \"./theme.js\"\n","import type { Theme } from \"../tokens/types.js\"\n\nconst STORAGE_KEY = \"cs-theme\"\nconst DATA_ATTR = \"data-theme\"\n\n/**\n * Get the current theme setting.\n * Returns `\"light\"`, `\"dark\"`, or `\"system\"` (when no `data-theme` attribute is set).\n */\nexport function getTheme(): Theme {\n  if (typeof document === \"undefined\") return \"system\"\n  const attr = document.documentElement.getAttribute(DATA_ATTR)\n  if (attr === \"light\" || attr === \"dark\") return attr\n  return \"system\"\n}\n\n/**\n * Set the theme. Applies `data-theme` attribute to `<html>` and\n * persists the choice to `localStorage`.\n *\n * - `\"light\"` or `\"dark\"` sets the attribute explicitly.\n * - `\"system\"` removes the attribute, deferring to `prefers-color-scheme`.\n */\nexport function setTheme(theme: Theme): void {\n  if (typeof document === \"undefined\") return\n\n  if (theme === \"system\") {\n    document.documentElement.removeAttribute(DATA_ATTR)\n  } else {\n    document.documentElement.setAttribute(DATA_ATTR, theme)\n  }\n\n  try {\n    if (typeof localStorage !== \"undefined\") {\n      localStorage.setItem(STORAGE_KEY, theme)\n    }\n  } catch {\n    // localStorage may be unavailable (e.g., iframe sandboxing)\n  }\n}\n\n/**\n * Initialize the theme from `localStorage` on page load.\n * Call this early (e.g., in a `<script>` tag or app init) to\n * prevent a flash of wrong theme.\n */\nexport function initTheme(): void {\n  try {\n    if (typeof localStorage === \"undefined\") return\n    const stored = localStorage.getItem(STORAGE_KEY)\n    if (stored === \"light\" || stored === \"dark\" || stored === \"system\") {\n      setTheme(stored)\n    }\n  } catch {\n    // localStorage may be unavailable\n  }\n}\n\n/**\n * Subscribe to theme changes (both programmatic and OS-level).\n * Returns an unsubscribe function.\n */\nexport function onThemeChange(callback: (theme: Theme) => void): () => void {\n  if (typeof window === \"undefined\") return () => {}\n\n  const observer = new MutationObserver(() => {\n    callback(getTheme())\n  })\n\n  observer.observe(document.documentElement, {\n    attributes: true,\n    attributeFilter: [DATA_ATTR],\n  })\n\n  let mediaQuery: MediaQueryList | undefined\n  const mediaHandler = () => {\n    if (getTheme() === \"system\") {\n      callback(\"system\")\n    }\n  }\n\n  if (typeof window.matchMedia === \"function\") {\n    mediaQuery = window.matchMedia(\"(prefers-color-scheme: dark)\")\n    mediaQuery.addEventListener(\"change\", mediaHandler)\n  }\n\n  return () => {\n    observer.disconnect()\n    mediaQuery?.removeEventListener(\"change\", mediaHandler)\n  }\n}\n\n/**\n * Get the resolved effective theme (never `\"system\"`).\n * Useful when you need to know the actual visual appearance.\n */\nexport function getEffectiveTheme(): \"light\" | \"dark\" {\n  const theme = getTheme()\n  if (theme !== \"system\") return theme\n\n  if (typeof window !== \"undefined\" && typeof window.matchMedia === \"function\") {\n    return window.matchMedia(\"(prefers-color-scheme: dark)\").matches ? \"dark\" : \"light\"\n  }\n  return \"light\"\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACEA,IAAM,cAAc;AACpB,IAAM,YAAY;AAMX,SAAS,WAAkB;AAChC,MAAI,OAAO,aAAa,YAAa,QAAO;AAC5C,QAAM,OAAO,SAAS,gBAAgB,aAAa,SAAS;AAC5D,MAAI,SAAS,WAAW,SAAS,OAAQ,QAAO;AAChD,SAAO;AACT;AASO,SAAS,SAAS,OAAoB;AAC3C,MAAI,OAAO,aAAa,YAAa;AAErC,MAAI,UAAU,UAAU;AACtB,aAAS,gBAAgB,gBAAgB,SAAS;AAAA,EACpD,OAAO;AACL,aAAS,gBAAgB,aAAa,WAAW,KAAK;AAAA,EACxD;AAEA,MAAI;AACF,QAAI,OAAO,iBAAiB,aAAa;AACvC,mBAAa,QAAQ,aAAa,KAAK;AAAA,IACzC;AAAA,EACF,QAAQ;AAAA,EAER;AACF;AAOO,SAAS,YAAkB;AAChC,MAAI;AACF,QAAI,OAAO,iBAAiB,YAAa;AACzC,UAAM,SAAS,aAAa,QAAQ,WAAW;AAC/C,QAAI,WAAW,WAAW,WAAW,UAAU,WAAW,UAAU;AAClE,eAAS,MAAM;AAAA,IACjB;AAAA,EACF,QAAQ;AAAA,EAER;AACF;AAMO,SAAS,cAAc,UAA8C;AAC1E,MAAI,OAAO,WAAW,YAAa,QAAO,MAAM;AAAA,EAAC;AAEjD,QAAM,WAAW,IAAI,iBAAiB,MAAM;AAC1C,aAAS,SAAS,CAAC;AAAA,EACrB,CAAC;AAED,WAAS,QAAQ,SAAS,iBAAiB;AAAA,IACzC,YAAY;AAAA,IACZ,iBAAiB,CAAC,SAAS;AAAA,EAC7B,CAAC;AAED,MAAI;AACJ,QAAM,eAAe,MAAM;AACzB,QAAI,SAAS,MAAM,UAAU;AAC3B,eAAS,QAAQ;AAAA,IACnB;AAAA,EACF;AAEA,MAAI,OAAO,OAAO,eAAe,YAAY;AAC3C,iBAAa,OAAO,WAAW,8BAA8B;AAC7D,eAAW,iBAAiB,UAAU,YAAY;AAAA,EACpD;AAEA,SAAO,MAAM;AACX,aAAS,WAAW;AACpB,gBAAY,oBAAoB,UAAU,YAAY;AAAA,EACxD;AACF;AAMO,SAAS,oBAAsC;AACpD,QAAM,QAAQ,SAAS;AACvB,MAAI,UAAU,SAAU,QAAO;AAE/B,MAAI,OAAO,WAAW,eAAe,OAAO,OAAO,eAAe,YAAY;AAC5E,WAAO,OAAO,WAAW,8BAA8B,EAAE,UAAU,SAAS;AAAA,EAC9E;AACA,SAAO;AACT;","names":[]}

package/dist/ui/theme/index.d.cts

@@ -0,0 +1,33 @@
+import { T as Theme } from '../../types-DrMwdlH9.cjs';
+
+/**
+ * Get the current theme setting.
+ * Returns `"light"`, `"dark"`, or `"system"` (when no `data-theme` attribute is set).
+ */
+declare function getTheme(): Theme;
+/**
+ * Set the theme. Applies `data-theme` attribute to `<html>` and
+ * persists the choice to `localStorage`.
+ *
+ * - `"light"` or `"dark"` sets the attribute explicitly.
+ * - `"system"` removes the attribute, deferring to `prefers-color-scheme`.
+ */
+declare function setTheme(theme: Theme): void;
+/**
+ * Initialize the theme from `localStorage` on page load.
+ * Call this early (e.g., in a `<script>` tag or app init) to
+ * prevent a flash of wrong theme.
+ */
+declare function initTheme(): void;
+/**
+ * Subscribe to theme changes (both programmatic and OS-level).
+ * Returns an unsubscribe function.
+ */
+declare function onThemeChange(callback: (theme: Theme) => void): () => void;
+/**
+ * Get the resolved effective theme (never `"system"`).
+ * Useful when you need to know the actual visual appearance.
+ */
+declare function getEffectiveTheme(): "light" | "dark";
+
+export { getEffectiveTheme, getTheme, initTheme, onThemeChange, setTheme };

package/dist/ui/theme/index.d.ts

@@ -0,0 +1,33 @@
+import { T as Theme } from '../../types-DrMwdlH9.js';
+
+/**
+ * Get the current theme setting.
+ * Returns `"light"`, `"dark"`, or `"system"` (when no `data-theme` attribute is set).
+ */
+declare function getTheme(): Theme;
+/**
+ * Set the theme. Applies `data-theme` attribute to `<html>` and
+ * persists the choice to `localStorage`.
+ *
+ * - `"light"` or `"dark"` sets the attribute explicitly.
+ * - `"system"` removes the attribute, deferring to `prefers-color-scheme`.
+ */
+declare function setTheme(theme: Theme): void;
+/**
+ * Initialize the theme from `localStorage` on page load.
+ * Call this early (e.g., in a `<script>` tag or app init) to
+ * prevent a flash of wrong theme.
+ */
+declare function initTheme(): void;
+/**
+ * Subscribe to theme changes (both programmatic and OS-level).
+ * Returns an unsubscribe function.
+ */
+declare function onThemeChange(callback: (theme: Theme) => void): () => void;
+/**
+ * Get the resolved effective theme (never `"system"`).
+ * Useful when you need to know the actual visual appearance.
+ */
+declare function getEffectiveTheme(): "light" | "dark";
+
+export { getEffectiveTheme, getTheme, initTheme, onThemeChange, setTheme };

package/dist/ui/theme/index.mjs

@@ -0,0 +1,15 @@
+import {
+  getEffectiveTheme,
+  getTheme,
+  initTheme,
+  onThemeChange,
+  setTheme
+} from "../../chunk-BUZ6CQHE.mjs";
+export {
+  getEffectiveTheme,
+  getTheme,
+  initTheme,
+  onThemeChange,
+  setTheme
+};
+//# sourceMappingURL=index.mjs.map

package/dist/ui/theme/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}