@camstack/ui-library 0.1.25

package/dist/theme/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/theme/index.ts","../../src/theme/defaults.ts","../../src/theme/create-theme.ts","../../src/theme/theme-to-css.ts","../../src/theme/theme-provider.tsx","../../src/theme/use-theme-mode.ts"],"sourcesContent":["export type {\n  CamStackColorTokens,\n  CamStackTheme,\n  ThemeMode,\n  DeepPartial,\n  UseThemeModeReturn,\n} from './types'\n\nexport { darkColors, lightColors, defaultTheme } from './defaults'\nexport { createTheme } from './create-theme'\nexport { themeToCss } from './theme-to-css'\nexport { ThemeProvider } from './theme-provider'\nexport { useThemeMode } from './use-theme-mode'\n","import type { CamStackColorTokens, CamStackTheme } from './types'\n\nconst providerColors: CamStackColorTokens['provider'] = {\n  frigate: '#3b82f6',\n  scrypted: '#a855f7',\n  reolink: '#06b6d4',\n  homeAssistant: '#22d3ee',\n  rtsp: '#78716c',\n}\n\nexport const darkColors: CamStackColorTokens = {\n  primary: '#f59e42',\n  primaryForeground: '#0c0a09',\n  background: '#0c0a09',\n  backgroundElevated: '#1c1917',\n  surface: '#1c1917',\n  surfaceHover: '#292524',\n  border: '#292524',\n  borderSubtle: '#1c1917',\n  foreground: '#fafaf9',\n  foregroundMuted: '#a8a29e',\n  foregroundSubtle: '#78716c',\n  foregroundDisabled: '#57534e',\n  success: '#4ade80',\n  warning: '#fbbf24',\n  danger: '#f87171',\n  info: '#60a5fa',\n  provider: providerColors,\n}\n\nexport const lightColors: CamStackColorTokens = {\n  primary: '#e67e22',\n  primaryForeground: '#ffffff',\n  background: '#fafaf9',\n  backgroundElevated: '#ffffff',\n  surface: '#f5f5f4',\n  surfaceHover: '#e7e5e4',\n  border: '#d6d3d1',\n  borderSubtle: '#e7e5e4',\n  foreground: '#1c1917',\n  foregroundMuted: '#57534e',\n  foregroundSubtle: '#78716c',\n  foregroundDisabled: '#a8a29e',\n  success: '#16a34a',\n  warning: '#d97706',\n  danger: '#dc2626',\n  info: '#2563eb',\n  provider: providerColors,\n}\n\nexport const defaultTheme: CamStackTheme = {\n  colors: {\n    dark: darkColors,\n    light: lightColors,\n  },\n  spacing: {\n    xs: 2,\n    sm: 4,\n    md: 8,\n    lg: 12,\n    xl: 16,\n    '2xl': 24,\n    '3xl': 32,\n  },\n  radius: {\n    sm: 4,\n    md: 6,\n    lg: 8,\n    xl: 12,\n  },\n  typography: {\n    fontFamily: '-apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif',\n    sizes: {\n      xs: { fontSize: 10, lineHeight: 14 },\n      sm: { fontSize: 11, lineHeight: 16 },\n      base: { fontSize: 12, lineHeight: 18 },\n      lg: { fontSize: 13, lineHeight: 18 },\n      xl: { fontSize: 14, lineHeight: 20 },\n      '2xl': { fontSize: 16, lineHeight: 22 },\n      '3xl': { fontSize: 20, lineHeight: 28 },\n    },\n    weights: {\n      regular: 400,\n      medium: 500,\n      semibold: 600,\n      bold: 700,\n    },\n  },\n  table: {\n    rowHeight: 28,\n    headerHeight: 24,\n    cellPaddingX: 8,\n    cellPaddingY: 6,\n  },\n  sidebar: {\n    width: 176,\n    itemHeight: 28,\n    iconSize: 14,\n  },\n}\n","import type { CamStackTheme, DeepPartial } from './types'\nimport { defaultTheme } from './defaults'\n\nfunction deepMerge<T extends object>(target: T, source: DeepPartial<T>): T {\n  const result = { ...target }\n  for (const key in source) {\n    const sourceVal = source[key]\n    const targetVal = target[key]\n    if (\n      sourceVal !== undefined &&\n      typeof sourceVal === 'object' &&\n      sourceVal !== null &&\n      !Array.isArray(sourceVal) &&\n      typeof targetVal === 'object' &&\n      targetVal !== null\n    ) {\n      result[key] = deepMerge(\n        targetVal as Record<string, unknown>,\n        sourceVal as Record<string, unknown>,\n      ) as T[typeof key]\n    } else if (sourceVal !== undefined) {\n      result[key] = sourceVal as T[typeof key]\n    }\n  }\n  return result\n}\n\nexport function createTheme(overrides?: DeepPartial<CamStackTheme>): CamStackTheme {\n  if (!overrides) return structuredClone(defaultTheme)\n  return deepMerge(structuredClone(defaultTheme), overrides)\n}\n","import type { CamStackColorTokens, CamStackTheme } from './types'\n\nfunction camelToKebab(str: string): string {\n  return str.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`)\n}\n\nfunction colorTokenToCssVar(key: string): string {\n  return `--color-${camelToKebab(key)}`\n}\n\nfunction generateColorBlock(colors: CamStackColorTokens): string {\n  const lines: string[] = []\n  for (const [key, value] of Object.entries(colors)) {\n    if (key === 'provider') continue\n    lines.push(`  ${colorTokenToCssVar(key)}: ${value};`)\n  }\n  return lines.join('\\n')\n}\n\nfunction generateProviderColors(provider: CamStackColorTokens['provider']): string {\n  const lines: string[] = []\n  for (const [key, value] of Object.entries(provider)) {\n    lines.push(`  --color-provider-${camelToKebab(key)}: ${value};`)\n  }\n  return lines.join('\\n')\n}\n\nfunction generateSpacingTokens(spacing: CamStackTheme['spacing']): string {\n  const lines: string[] = []\n  for (const [key, value] of Object.entries(spacing)) {\n    lines.push(`  --spacing-${key}: ${value}px;`)\n  }\n  return lines.join('\\n')\n}\n\nfunction generateRadiusTokens(radius: CamStackTheme['radius']): string {\n  const lines: string[] = []\n  for (const [key, value] of Object.entries(radius)) {\n    lines.push(`  --radius-${key}: ${value}px;`)\n  }\n  return lines.join('\\n')\n}\n\nexport function themeToCss(theme: CamStackTheme): string {\n  const darkColorBlock = generateColorBlock(theme.colors.dark)\n  const lightColorBlock = generateColorBlock(theme.colors.light)\n  const providerBlock = generateProviderColors(theme.colors.dark.provider)\n  const spacingBlock = generateSpacingTokens(theme.spacing)\n  const radiusBlock = generateRadiusTokens(theme.radius)\n\n  return `@theme {\n${providerBlock}\n${spacingBlock}\n${radiusBlock}\n}\n\n.dark {\n${darkColorBlock}\n}\n\n.light {\n${lightColorBlock}\n}\n\n@media (prefers-color-scheme: dark) {\n  :root {\n${darkColorBlock.replace(/^  /gm, '    ')}\n  }\n}\n\n@media (prefers-color-scheme: light) {\n  :root {\n${lightColorBlock.replace(/^  /gm, '    ')}\n  }\n}\n`\n}\n","import { createContext, useCallback, useEffect, useMemo, useState } from 'react'\nimport type { ReactNode } from 'react'\nimport type { ThemeMode, UseThemeModeReturn } from './types'\n\nexport const ThemeContext = createContext<UseThemeModeReturn | null>(null)\n\ninterface ThemeProviderProps {\n  children: ReactNode\n  defaultMode?: ThemeMode\n  storageKey?: string\n}\n\nconst TOGGLE_ORDER: readonly ThemeMode[] = ['dark', 'light', 'system'] as const\n\nfunction getSystemPreference(): 'dark' | 'light' {\n  if (typeof window === 'undefined') return 'dark'\n  return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'\n}\n\nfunction getInitialMode(storageKey: string, defaultMode: ThemeMode): ThemeMode {\n  if (typeof window === 'undefined') return defaultMode\n  const stored = localStorage.getItem(storageKey)\n  if (stored === 'dark' || stored === 'light' || stored === 'system') {\n    return stored\n  }\n  return defaultMode\n}\n\nfunction resolveMode(mode: ThemeMode): 'dark' | 'light' {\n  if (mode === 'system') return getSystemPreference()\n  return mode\n}\n\nexport function ThemeProvider({\n  children,\n  defaultMode = 'system',\n  storageKey = 'camstack-theme-mode',\n}: ThemeProviderProps) {\n  const [mode, setModeState] = useState<ThemeMode>(() => getInitialMode(storageKey, defaultMode))\n  const [resolvedMode, setResolvedMode] = useState<'dark' | 'light'>(() => resolveMode(mode))\n\n  const setMode = useCallback(\n    (newMode: ThemeMode) => {\n      setModeState(newMode)\n      setResolvedMode(resolveMode(newMode))\n      if (typeof window !== 'undefined') {\n        localStorage.setItem(storageKey, newMode)\n      }\n    },\n    [storageKey],\n  )\n\n  const toggleMode = useCallback(() => {\n    const currentIndex = TOGGLE_ORDER.indexOf(mode)\n    const nextIndex = (currentIndex + 1) % TOGGLE_ORDER.length\n    setMode(TOGGLE_ORDER[nextIndex] ?? 'dark')\n  }, [mode, setMode])\n\n  // Apply CSS class on document.documentElement\n  useEffect(() => {\n    if (typeof document === 'undefined') return\n\n    const root = document.documentElement\n    root.classList.remove('dark', 'light')\n    // Always apply the resolved class — even in 'system' mode, the CSS\n    // variables need the .dark or .light class to activate\n    root.classList.add(resolvedMode)\n  }, [mode, resolvedMode])\n\n  // Listen for system theme changes when in 'system' mode\n  useEffect(() => {\n    if (typeof window === 'undefined' || mode !== 'system') return\n\n    const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)')\n    const handleChange = () => {\n      setResolvedMode(getSystemPreference())\n    }\n\n    mediaQuery.addEventListener('change', handleChange)\n    return () => mediaQuery.removeEventListener('change', handleChange)\n  }, [mode])\n\n  const value = useMemo<UseThemeModeReturn>(\n    () => ({ mode, resolvedMode, setMode, toggleMode }),\n    [mode, resolvedMode, setMode, toggleMode],\n  )\n\n  return <ThemeContext.Provider value={value}>{children}</ThemeContext.Provider>\n}\n","import { useContext } from 'react'\nimport { ThemeContext } from './theme-provider'\nimport type { UseThemeModeReturn } from './types'\n\nexport function useThemeMode(): UseThemeModeReturn {\n  const context = useContext(ThemeContext)\n  if (!context) {\n    throw new Error('useThemeMode must be used within a ThemeProvider')\n  }\n  return context\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACEA,IAAM,iBAAkD;AAAA,EACtD,SAAS;AAAA,EACT,UAAU;AAAA,EACV,SAAS;AAAA,EACT,eAAe;AAAA,EACf,MAAM;AACR;AAEO,IAAM,aAAkC;AAAA,EAC7C,SAAS;AAAA,EACT,mBAAmB;AAAA,EACnB,YAAY;AAAA,EACZ,oBAAoB;AAAA,EACpB,SAAS;AAAA,EACT,cAAc;AAAA,EACd,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,iBAAiB;AAAA,EACjB,kBAAkB;AAAA,EAClB,oBAAoB;AAAA,EACpB,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,UAAU;AACZ;AAEO,IAAM,cAAmC;AAAA,EAC9C,SAAS;AAAA,EACT,mBAAmB;AAAA,EACnB,YAAY;AAAA,EACZ,oBAAoB;AAAA,EACpB,SAAS;AAAA,EACT,cAAc;AAAA,EACd,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,iBAAiB;AAAA,EACjB,kBAAkB;AAAA,EAClB,oBAAoB;AAAA,EACpB,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,UAAU;AACZ;AAEO,IAAM,eAA8B;AAAA,EACzC,QAAQ;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,EACT;AAAA,EACA,SAAS;AAAA,IACP,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AAAA,EACA,QAAQ;AAAA,IACN,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAAA,EACA,YAAY;AAAA,IACV,YAAY;AAAA,IACZ,OAAO;AAAA,MACL,IAAI,EAAE,UAAU,IAAI,YAAY,GAAG;AAAA,MACnC,IAAI,EAAE,UAAU,IAAI,YAAY,GAAG;AAAA,MACnC,MAAM,EAAE,UAAU,IAAI,YAAY,GAAG;AAAA,MACrC,IAAI,EAAE,UAAU,IAAI,YAAY,GAAG;AAAA,MACnC,IAAI,EAAE,UAAU,IAAI,YAAY,GAAG;AAAA,MACnC,OAAO,EAAE,UAAU,IAAI,YAAY,GAAG;AAAA,MACtC,OAAO,EAAE,UAAU,IAAI,YAAY,GAAG;AAAA,IACxC;AAAA,IACA,SAAS;AAAA,MACP,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,UAAU;AAAA,MACV,MAAM;AAAA,IACR;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IACL,WAAW;AAAA,IACX,cAAc;AAAA,IACd,cAAc;AAAA,IACd,cAAc;AAAA,EAChB;AAAA,EACA,SAAS;AAAA,IACP,OAAO;AAAA,IACP,YAAY;AAAA,IACZ,UAAU;AAAA,EACZ;AACF;;;AChGA,SAAS,UAA4B,QAAW,QAA2B;AACzE,QAAM,SAAS,EAAE,GAAG,OAAO;AAC3B,aAAW,OAAO,QAAQ;AACxB,UAAM,YAAY,OAAO,GAAG;AAC5B,UAAM,YAAY,OAAO,GAAG;AAC5B,QACE,cAAc,UACd,OAAO,cAAc,YACrB,cAAc,QACd,CAAC,MAAM,QAAQ,SAAS,KACxB,OAAO,cAAc,YACrB,cAAc,MACd;AACA,aAAO,GAAG,IAAI;AAAA,QACZ;AAAA,QACA;AAAA,MACF;AAAA,IACF,WAAW,cAAc,QAAW;AAClC,aAAO,GAAG,IAAI;AAAA,IAChB;AAAA,EACF;AACA,SAAO;AACT;AAEO,SAAS,YAAY,WAAuD;AACjF,MAAI,CAAC,UAAW,QAAO,gBAAgB,YAAY;AACnD,SAAO,UAAU,gBAAgB,YAAY,GAAG,SAAS;AAC3D;;;AC5BA,SAAS,aAAa,KAAqB;AACzC,SAAO,IAAI,QAAQ,UAAU,CAAC,MAAM,IAAI,EAAE,YAAY,CAAC,EAAE;AAC3D;AAEA,SAAS,mBAAmB,KAAqB;AAC/C,SAAO,WAAW,aAAa,GAAG,CAAC;AACrC;AAEA,SAAS,mBAAmB,QAAqC;AAC/D,QAAM,QAAkB,CAAC;AACzB,aAAW,CAAC,KAAK,KAAK,KAAK,OAAO,QAAQ,MAAM,GAAG;AACjD,QAAI,QAAQ,WAAY;AACxB,UAAM,KAAK,KAAK,mBAAmB,GAAG,CAAC,KAAK,KAAK,GAAG;AAAA,EACtD;AACA,SAAO,MAAM,KAAK,IAAI;AACxB;AAEA,SAAS,uBAAuB,UAAmD;AACjF,QAAM,QAAkB,CAAC;AACzB,aAAW,CAAC,KAAK,KAAK,KAAK,OAAO,QAAQ,QAAQ,GAAG;AACnD,UAAM,KAAK,sBAAsB,aAAa,GAAG,CAAC,KAAK,KAAK,GAAG;AAAA,EACjE;AACA,SAAO,MAAM,KAAK,IAAI;AACxB;AAEA,SAAS,sBAAsB,SAA2C;AACxE,QAAM,QAAkB,CAAC;AACzB,aAAW,CAAC,KAAK,KAAK,KAAK,OAAO,QAAQ,OAAO,GAAG;AAClD,UAAM,KAAK,eAAe,GAAG,KAAK,KAAK,KAAK;AAAA,EAC9C;AACA,SAAO,MAAM,KAAK,IAAI;AACxB;AAEA,SAAS,qBAAqB,QAAyC;AACrE,QAAM,QAAkB,CAAC;AACzB,aAAW,CAAC,KAAK,KAAK,KAAK,OAAO,QAAQ,MAAM,GAAG;AACjD,UAAM,KAAK,cAAc,GAAG,KAAK,KAAK,KAAK;AAAA,EAC7C;AACA,SAAO,MAAM,KAAK,IAAI;AACxB;AAEO,SAAS,WAAW,OAA8B;AACvD,QAAM,iBAAiB,mBAAmB,MAAM,OAAO,IAAI;AAC3D,QAAM,kBAAkB,mBAAmB,MAAM,OAAO,KAAK;AAC7D,QAAM,gBAAgB,uBAAuB,MAAM,OAAO,KAAK,QAAQ;AACvE,QAAM,eAAe,sBAAsB,MAAM,OAAO;AACxD,QAAM,cAAc,qBAAqB,MAAM,MAAM;AAErD,SAAO;AAAA,EACP,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,WAAW;AAAA;AAAA;AAAA;AAAA,EAIX,cAAc;AAAA;AAAA;AAAA;AAAA,EAId,eAAe;AAAA;AAAA;AAAA;AAAA;AAAA,EAKf,eAAe,QAAQ,SAAS,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMvC,gBAAgB,QAAQ,SAAS,MAAM,CAAC;AAAA;AAAA;AAAA;AAI1C;;;AC5EA,mBAAyE;AAuFhE;AAnFF,IAAM,mBAAe,4BAAyC,IAAI;AAQzE,IAAM,eAAqC,CAAC,QAAQ,SAAS,QAAQ;AAErE,SAAS,sBAAwC;AAC/C,MAAI,OAAO,WAAW,YAAa,QAAO;AAC1C,SAAO,OAAO,WAAW,8BAA8B,EAAE,UAAU,SAAS;AAC9E;AAEA,SAAS,eAAe,YAAoB,aAAmC;AAC7E,MAAI,OAAO,WAAW,YAAa,QAAO;AAC1C,QAAM,SAAS,aAAa,QAAQ,UAAU;AAC9C,MAAI,WAAW,UAAU,WAAW,WAAW,WAAW,UAAU;AAClE,WAAO;AAAA,EACT;AACA,SAAO;AACT;AAEA,SAAS,YAAY,MAAmC;AACtD,MAAI,SAAS,SAAU,QAAO,oBAAoB;AAClD,SAAO;AACT;AAEO,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA,cAAc;AAAA,EACd,aAAa;AACf,GAAuB;AACrB,QAAM,CAAC,MAAM,YAAY,QAAI,uBAAoB,MAAM,eAAe,YAAY,WAAW,CAAC;AAC9F,QAAM,CAAC,cAAc,eAAe,QAAI,uBAA2B,MAAM,YAAY,IAAI,CAAC;AAE1F,QAAM,cAAU;AAAA,IACd,CAAC,YAAuB;AACtB,mBAAa,OAAO;AACpB,sBAAgB,YAAY,OAAO,CAAC;AACpC,UAAI,OAAO,WAAW,aAAa;AACjC,qBAAa,QAAQ,YAAY,OAAO;AAAA,MAC1C;AAAA,IACF;AAAA,IACA,CAAC,UAAU;AAAA,EACb;AAEA,QAAM,iBAAa,0BAAY,MAAM;AACnC,UAAM,eAAe,aAAa,QAAQ,IAAI;AAC9C,UAAM,aAAa,eAAe,KAAK,aAAa;AACpD,YAAQ,aAAa,SAAS,KAAK,MAAM;AAAA,EAC3C,GAAG,CAAC,MAAM,OAAO,CAAC;AAGlB,8BAAU,MAAM;AACd,QAAI,OAAO,aAAa,YAAa;AAErC,UAAM,OAAO,SAAS;AACtB,SAAK,UAAU,OAAO,QAAQ,OAAO;AAGrC,SAAK,UAAU,IAAI,YAAY;AAAA,EACjC,GAAG,CAAC,MAAM,YAAY,CAAC;AAGvB,8BAAU,MAAM;AACd,QAAI,OAAO,WAAW,eAAe,SAAS,SAAU;AAExD,UAAM,aAAa,OAAO,WAAW,8BAA8B;AACnE,UAAM,eAAe,MAAM;AACzB,sBAAgB,oBAAoB,CAAC;AAAA,IACvC;AAEA,eAAW,iBAAiB,UAAU,YAAY;AAClD,WAAO,MAAM,WAAW,oBAAoB,UAAU,YAAY;AAAA,EACpE,GAAG,CAAC,IAAI,CAAC;AAET,QAAM,YAAQ;AAAA,IACZ,OAAO,EAAE,MAAM,cAAc,SAAS,WAAW;AAAA,IACjD,CAAC,MAAM,cAAc,SAAS,UAAU;AAAA,EAC1C;AAEA,SAAO,4CAAC,aAAa,UAAb,EAAsB,OAAe,UAAS;AACxD;;;ACxFA,IAAAA,gBAA2B;AAIpB,SAAS,eAAmC;AACjD,QAAM,cAAU,0BAAW,YAAY;AACvC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,kDAAkD;AAAA,EACpE;AACA,SAAO;AACT;","names":["import_react"]}

package/dist/theme/index.d.cts

@@ -0,0 +1,128 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+
+interface CamStackColorTokens {
+    primary: string;
+    primaryForeground: string;
+    background: string;
+    backgroundElevated: string;
+    surface: string;
+    surfaceHover: string;
+    border: string;
+    borderSubtle: string;
+    foreground: string;
+    foregroundMuted: string;
+    foregroundSubtle: string;
+    foregroundDisabled: string;
+    success: string;
+    warning: string;
+    danger: string;
+    info: string;
+    provider: {
+        frigate: string;
+        scrypted: string;
+        reolink: string;
+        homeAssistant: string;
+        rtsp: string;
+    };
+}
+interface CamStackTheme {
+    colors: {
+        dark: CamStackColorTokens;
+        light: CamStackColorTokens;
+    };
+    spacing: {
+        xs: number;
+        sm: number;
+        md: number;
+        lg: number;
+        xl: number;
+        '2xl': number;
+        '3xl': number;
+    };
+    radius: {
+        sm: number;
+        md: number;
+        lg: number;
+        xl: number;
+    };
+    typography: {
+        fontFamily: string;
+        sizes: {
+            xs: {
+                fontSize: number;
+                lineHeight: number;
+            };
+            sm: {
+                fontSize: number;
+                lineHeight: number;
+            };
+            base: {
+                fontSize: number;
+                lineHeight: number;
+            };
+            lg: {
+                fontSize: number;
+                lineHeight: number;
+            };
+            xl: {
+                fontSize: number;
+                lineHeight: number;
+            };
+            '2xl': {
+                fontSize: number;
+                lineHeight: number;
+            };
+            '3xl': {
+                fontSize: number;
+                lineHeight: number;
+            };
+        };
+        weights: {
+            regular: number;
+            medium: number;
+            semibold: number;
+            bold: number;
+        };
+    };
+    table: {
+        rowHeight: number;
+        headerHeight: number;
+        cellPaddingX: number;
+        cellPaddingY: number;
+    };
+    sidebar: {
+        width: number;
+        itemHeight: number;
+        iconSize: number;
+    };
+}
+type ThemeMode = 'dark' | 'light' | 'system';
+type DeepPartial<T> = {
+    [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];
+};
+interface UseThemeModeReturn {
+    mode: ThemeMode;
+    resolvedMode: 'dark' | 'light';
+    setMode: (mode: ThemeMode) => void;
+    toggleMode: () => void;
+}
+
+declare const darkColors: CamStackColorTokens;
+declare const lightColors: CamStackColorTokens;
+declare const defaultTheme: CamStackTheme;
+
+declare function createTheme(overrides?: DeepPartial<CamStackTheme>): CamStackTheme;
+
+declare function themeToCss(theme: CamStackTheme): string;
+
+interface ThemeProviderProps {
+    children: ReactNode;
+    defaultMode?: ThemeMode;
+    storageKey?: string;
+}
+declare function ThemeProvider({ children, defaultMode, storageKey, }: ThemeProviderProps): react_jsx_runtime.JSX.Element;
+
+declare function useThemeMode(): UseThemeModeReturn;
+
+export { type CamStackColorTokens, type CamStackTheme, type DeepPartial, type ThemeMode, ThemeProvider, type UseThemeModeReturn, createTheme, darkColors, defaultTheme, lightColors, themeToCss, useThemeMode };

package/dist/theme/index.d.ts

@@ -0,0 +1,128 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+
+interface CamStackColorTokens {
+    primary: string;
+    primaryForeground: string;
+    background: string;
+    backgroundElevated: string;
+    surface: string;
+    surfaceHover: string;
+    border: string;
+    borderSubtle: string;
+    foreground: string;
+    foregroundMuted: string;
+    foregroundSubtle: string;
+    foregroundDisabled: string;
+    success: string;
+    warning: string;
+    danger: string;
+    info: string;
+    provider: {
+        frigate: string;
+        scrypted: string;
+        reolink: string;
+        homeAssistant: string;
+        rtsp: string;
+    };
+}
+interface CamStackTheme {
+    colors: {
+        dark: CamStackColorTokens;
+        light: CamStackColorTokens;
+    };
+    spacing: {
+        xs: number;
+        sm: number;
+        md: number;
+        lg: number;
+        xl: number;
+        '2xl': number;
+        '3xl': number;
+    };
+    radius: {
+        sm: number;
+        md: number;
+        lg: number;
+        xl: number;
+    };
+    typography: {
+        fontFamily: string;
+        sizes: {
+            xs: {
+                fontSize: number;
+                lineHeight: number;
+            };
+            sm: {
+                fontSize: number;
+                lineHeight: number;
+            };
+            base: {
+                fontSize: number;
+                lineHeight: number;
+            };
+            lg: {
+                fontSize: number;
+                lineHeight: number;
+            };
+            xl: {
+                fontSize: number;
+                lineHeight: number;
+            };
+            '2xl': {
+                fontSize: number;
+                lineHeight: number;
+            };
+            '3xl': {
+                fontSize: number;
+                lineHeight: number;
+            };
+        };
+        weights: {
+            regular: number;
+            medium: number;
+            semibold: number;
+            bold: number;
+        };
+    };
+    table: {
+        rowHeight: number;
+        headerHeight: number;
+        cellPaddingX: number;
+        cellPaddingY: number;
+    };
+    sidebar: {
+        width: number;
+        itemHeight: number;
+        iconSize: number;
+    };
+}
+type ThemeMode = 'dark' | 'light' | 'system';
+type DeepPartial<T> = {
+    [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];
+};
+interface UseThemeModeReturn {
+    mode: ThemeMode;
+    resolvedMode: 'dark' | 'light';
+    setMode: (mode: ThemeMode) => void;
+    toggleMode: () => void;
+}
+
+declare const darkColors: CamStackColorTokens;
+declare const lightColors: CamStackColorTokens;
+declare const defaultTheme: CamStackTheme;
+
+declare function createTheme(overrides?: DeepPartial<CamStackTheme>): CamStackTheme;
+
+declare function themeToCss(theme: CamStackTheme): string;
+
+interface ThemeProviderProps {
+    children: ReactNode;
+    defaultMode?: ThemeMode;
+    storageKey?: string;
+}
+declare function ThemeProvider({ children, defaultMode, storageKey, }: ThemeProviderProps): react_jsx_runtime.JSX.Element;
+
+declare function useThemeMode(): UseThemeModeReturn;
+
+export { type CamStackColorTokens, type CamStackTheme, type DeepPartial, type ThemeMode, ThemeProvider, type UseThemeModeReturn, createTheme, darkColors, defaultTheme, lightColors, themeToCss, useThemeMode };

package/dist/theme/index.js

@@ -0,0 +1,273 @@
+// src/theme/defaults.ts
+var providerColors = {
+  frigate: "#3b82f6",
+  scrypted: "#a855f7",
+  reolink: "#06b6d4",
+  homeAssistant: "#22d3ee",
+  rtsp: "#78716c"
+};
+var darkColors = {
+  primary: "#f59e42",
+  primaryForeground: "#0c0a09",
+  background: "#0c0a09",
+  backgroundElevated: "#1c1917",
+  surface: "#1c1917",
+  surfaceHover: "#292524",
+  border: "#292524",
+  borderSubtle: "#1c1917",
+  foreground: "#fafaf9",
+  foregroundMuted: "#a8a29e",
+  foregroundSubtle: "#78716c",
+  foregroundDisabled: "#57534e",
+  success: "#4ade80",
+  warning: "#fbbf24",
+  danger: "#f87171",
+  info: "#60a5fa",
+  provider: providerColors
+};
+var lightColors = {
+  primary: "#e67e22",
+  primaryForeground: "#ffffff",
+  background: "#fafaf9",
+  backgroundElevated: "#ffffff",
+  surface: "#f5f5f4",
+  surfaceHover: "#e7e5e4",
+  border: "#d6d3d1",
+  borderSubtle: "#e7e5e4",
+  foreground: "#1c1917",
+  foregroundMuted: "#57534e",
+  foregroundSubtle: "#78716c",
+  foregroundDisabled: "#a8a29e",
+  success: "#16a34a",
+  warning: "#d97706",
+  danger: "#dc2626",
+  info: "#2563eb",
+  provider: providerColors
+};
+var defaultTheme = {
+  colors: {
+    dark: darkColors,
+    light: lightColors
+  },
+  spacing: {
+    xs: 2,
+    sm: 4,
+    md: 8,
+    lg: 12,
+    xl: 16,
+    "2xl": 24,
+    "3xl": 32
+  },
+  radius: {
+    sm: 4,
+    md: 6,
+    lg: 8,
+    xl: 12
+  },
+  typography: {
+    fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
+    sizes: {
+      xs: { fontSize: 10, lineHeight: 14 },
+      sm: { fontSize: 11, lineHeight: 16 },
+      base: { fontSize: 12, lineHeight: 18 },
+      lg: { fontSize: 13, lineHeight: 18 },
+      xl: { fontSize: 14, lineHeight: 20 },
+      "2xl": { fontSize: 16, lineHeight: 22 },
+      "3xl": { fontSize: 20, lineHeight: 28 }
+    },
+    weights: {
+      regular: 400,
+      medium: 500,
+      semibold: 600,
+      bold: 700
+    }
+  },
+  table: {
+    rowHeight: 28,
+    headerHeight: 24,
+    cellPaddingX: 8,
+    cellPaddingY: 6
+  },
+  sidebar: {
+    width: 176,
+    itemHeight: 28,
+    iconSize: 14
+  }
+};
+
+// src/theme/create-theme.ts
+function deepMerge(target, source) {
+  const result = { ...target };
+  for (const key in source) {
+    const sourceVal = source[key];
+    const targetVal = target[key];
+    if (sourceVal !== void 0 && typeof sourceVal === "object" && sourceVal !== null && !Array.isArray(sourceVal) && typeof targetVal === "object" && targetVal !== null) {
+      result[key] = deepMerge(
+        targetVal,
+        sourceVal
+      );
+    } else if (sourceVal !== void 0) {
+      result[key] = sourceVal;
+    }
+  }
+  return result;
+}
+function createTheme(overrides) {
+  if (!overrides) return structuredClone(defaultTheme);
+  return deepMerge(structuredClone(defaultTheme), overrides);
+}
+
+// src/theme/theme-to-css.ts
+function camelToKebab(str) {
+  return str.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`);
+}
+function colorTokenToCssVar(key) {
+  return `--color-${camelToKebab(key)}`;
+}
+function generateColorBlock(colors) {
+  const lines = [];
+  for (const [key, value] of Object.entries(colors)) {
+    if (key === "provider") continue;
+    lines.push(`  ${colorTokenToCssVar(key)}: ${value};`);
+  }
+  return lines.join("\n");
+}
+function generateProviderColors(provider) {
+  const lines = [];
+  for (const [key, value] of Object.entries(provider)) {
+    lines.push(`  --color-provider-${camelToKebab(key)}: ${value};`);
+  }
+  return lines.join("\n");
+}
+function generateSpacingTokens(spacing) {
+  const lines = [];
+  for (const [key, value] of Object.entries(spacing)) {
+    lines.push(`  --spacing-${key}: ${value}px;`);
+  }
+  return lines.join("\n");
+}
+function generateRadiusTokens(radius) {
+  const lines = [];
+  for (const [key, value] of Object.entries(radius)) {
+    lines.push(`  --radius-${key}: ${value}px;`);
+  }
+  return lines.join("\n");
+}
+function themeToCss(theme) {
+  const darkColorBlock = generateColorBlock(theme.colors.dark);
+  const lightColorBlock = generateColorBlock(theme.colors.light);
+  const providerBlock = generateProviderColors(theme.colors.dark.provider);
+  const spacingBlock = generateSpacingTokens(theme.spacing);
+  const radiusBlock = generateRadiusTokens(theme.radius);
+  return `@theme {
+${providerBlock}
+${spacingBlock}
+${radiusBlock}
+}
+
+.dark {
+${darkColorBlock}
+}
+
+.light {
+${lightColorBlock}
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+${darkColorBlock.replace(/^  /gm, "    ")}
+  }
+}
+
+@media (prefers-color-scheme: light) {
+  :root {
+${lightColorBlock.replace(/^  /gm, "    ")}
+  }
+}
+`;
+}
+
+// src/theme/theme-provider.tsx
+import { createContext, useCallback, useEffect, useMemo, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+var ThemeContext = createContext(null);
+var TOGGLE_ORDER = ["dark", "light", "system"];
+function getSystemPreference() {
+  if (typeof window === "undefined") return "dark";
+  return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+}
+function getInitialMode(storageKey, defaultMode) {
+  if (typeof window === "undefined") return defaultMode;
+  const stored = localStorage.getItem(storageKey);
+  if (stored === "dark" || stored === "light" || stored === "system") {
+    return stored;
+  }
+  return defaultMode;
+}
+function resolveMode(mode) {
+  if (mode === "system") return getSystemPreference();
+  return mode;
+}
+function ThemeProvider({
+  children,
+  defaultMode = "system",
+  storageKey = "camstack-theme-mode"
+}) {
+  const [mode, setModeState] = useState(() => getInitialMode(storageKey, defaultMode));
+  const [resolvedMode, setResolvedMode] = useState(() => resolveMode(mode));
+  const setMode = useCallback(
+    (newMode) => {
+      setModeState(newMode);
+      setResolvedMode(resolveMode(newMode));
+      if (typeof window !== "undefined") {
+        localStorage.setItem(storageKey, newMode);
+      }
+    },
+    [storageKey]
+  );
+  const toggleMode = useCallback(() => {
+    const currentIndex = TOGGLE_ORDER.indexOf(mode);
+    const nextIndex = (currentIndex + 1) % TOGGLE_ORDER.length;
+    setMode(TOGGLE_ORDER[nextIndex] ?? "dark");
+  }, [mode, setMode]);
+  useEffect(() => {
+    if (typeof document === "undefined") return;
+    const root = document.documentElement;
+    root.classList.remove("dark", "light");
+    root.classList.add(resolvedMode);
+  }, [mode, resolvedMode]);
+  useEffect(() => {
+    if (typeof window === "undefined" || mode !== "system") return;
+    const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+    const handleChange = () => {
+      setResolvedMode(getSystemPreference());
+    };
+    mediaQuery.addEventListener("change", handleChange);
+    return () => mediaQuery.removeEventListener("change", handleChange);
+  }, [mode]);
+  const value = useMemo(
+    () => ({ mode, resolvedMode, setMode, toggleMode }),
+    [mode, resolvedMode, setMode, toggleMode]
+  );
+  return /* @__PURE__ */ jsx(ThemeContext.Provider, { value, children });
+}
+
+// src/theme/use-theme-mode.ts
+import { useContext } from "react";
+function useThemeMode() {
+  const context = useContext(ThemeContext);
+  if (!context) {
+    throw new Error("useThemeMode must be used within a ThemeProvider");
+  }
+  return context;
+}
+export {
+  ThemeProvider,
+  createTheme,
+  darkColors,
+  defaultTheme,
+  lightColors,
+  themeToCss,
+  useThemeMode
+};
+//# sourceMappingURL=index.js.map

package/dist/theme/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/theme/defaults.ts","../../src/theme/create-theme.ts","../../src/theme/theme-to-css.ts","../../src/theme/theme-provider.tsx","../../src/theme/use-theme-mode.ts"],"sourcesContent":["import type { CamStackColorTokens, CamStackTheme } from './types'\n\nconst providerColors: CamStackColorTokens['provider'] = {\n  frigate: '#3b82f6',\n  scrypted: '#a855f7',\n  reolink: '#06b6d4',\n  homeAssistant: '#22d3ee',\n  rtsp: '#78716c',\n}\n\nexport const darkColors: CamStackColorTokens = {\n  primary: '#f59e42',\n  primaryForeground: '#0c0a09',\n  background: '#0c0a09',\n  backgroundElevated: '#1c1917',\n  surface: '#1c1917',\n  surfaceHover: '#292524',\n  border: '#292524',\n  borderSubtle: '#1c1917',\n  foreground: '#fafaf9',\n  foregroundMuted: '#a8a29e',\n  foregroundSubtle: '#78716c',\n  foregroundDisabled: '#57534e',\n  success: '#4ade80',\n  warning: '#fbbf24',\n  danger: '#f87171',\n  info: '#60a5fa',\n  provider: providerColors,\n}\n\nexport const lightColors: CamStackColorTokens = {\n  primary: '#e67e22',\n  primaryForeground: '#ffffff',\n  background: '#fafaf9',\n  backgroundElevated: '#ffffff',\n  surface: '#f5f5f4',\n  surfaceHover: '#e7e5e4',\n  border: '#d6d3d1',\n  borderSubtle: '#e7e5e4',\n  foreground: '#1c1917',\n  foregroundMuted: '#57534e',\n  foregroundSubtle: '#78716c',\n  foregroundDisabled: '#a8a29e',\n  success: '#16a34a',\n  warning: '#d97706',\n  danger: '#dc2626',\n  info: '#2563eb',\n  provider: providerColors,\n}\n\nexport const defaultTheme: CamStackTheme = {\n  colors: {\n    dark: darkColors,\n    light: lightColors,\n  },\n  spacing: {\n    xs: 2,\n    sm: 4,\n    md: 8,\n    lg: 12,\n    xl: 16,\n    '2xl': 24,\n    '3xl': 32,\n  },\n  radius: {\n    sm: 4,\n    md: 6,\n    lg: 8,\n    xl: 12,\n  },\n  typography: {\n    fontFamily: '-apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif',\n    sizes: {\n      xs: { fontSize: 10, lineHeight: 14 },\n      sm: { fontSize: 11, lineHeight: 16 },\n      base: { fontSize: 12, lineHeight: 18 },\n      lg: { fontSize: 13, lineHeight: 18 },\n      xl: { fontSize: 14, lineHeight: 20 },\n      '2xl': { fontSize: 16, lineHeight: 22 },\n      '3xl': { fontSize: 20, lineHeight: 28 },\n    },\n    weights: {\n      regular: 400,\n      medium: 500,\n      semibold: 600,\n      bold: 700,\n    },\n  },\n  table: {\n    rowHeight: 28,\n    headerHeight: 24,\n    cellPaddingX: 8,\n    cellPaddingY: 6,\n  },\n  sidebar: {\n    width: 176,\n    itemHeight: 28,\n    iconSize: 14,\n  },\n}\n","import type { CamStackTheme, DeepPartial } from './types'\nimport { defaultTheme } from './defaults'\n\nfunction deepMerge<T extends object>(target: T, source: DeepPartial<T>): T {\n  const result = { ...target }\n  for (const key in source) {\n    const sourceVal = source[key]\n    const targetVal = target[key]\n    if (\n      sourceVal !== undefined &&\n      typeof sourceVal === 'object' &&\n      sourceVal !== null &&\n      !Array.isArray(sourceVal) &&\n      typeof targetVal === 'object' &&\n      targetVal !== null\n    ) {\n      result[key] = deepMerge(\n        targetVal as Record<string, unknown>,\n        sourceVal as Record<string, unknown>,\n      ) as T[typeof key]\n    } else if (sourceVal !== undefined) {\n      result[key] = sourceVal as T[typeof key]\n    }\n  }\n  return result\n}\n\nexport function createTheme(overrides?: DeepPartial<CamStackTheme>): CamStackTheme {\n  if (!overrides) return structuredClone(defaultTheme)\n  return deepMerge(structuredClone(defaultTheme), overrides)\n}\n","import type { CamStackColorTokens, CamStackTheme } from './types'\n\nfunction camelToKebab(str: string): string {\n  return str.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`)\n}\n\nfunction colorTokenToCssVar(key: string): string {\n  return `--color-${camelToKebab(key)}`\n}\n\nfunction generateColorBlock(colors: CamStackColorTokens): string {\n  const lines: string[] = []\n  for (const [key, value] of Object.entries(colors)) {\n    if (key === 'provider') continue\n    lines.push(`  ${colorTokenToCssVar(key)}: ${value};`)\n  }\n  return lines.join('\\n')\n}\n\nfunction generateProviderColors(provider: CamStackColorTokens['provider']): string {\n  const lines: string[] = []\n  for (const [key, value] of Object.entries(provider)) {\n    lines.push(`  --color-provider-${camelToKebab(key)}: ${value};`)\n  }\n  return lines.join('\\n')\n}\n\nfunction generateSpacingTokens(spacing: CamStackTheme['spacing']): string {\n  const lines: string[] = []\n  for (const [key, value] of Object.entries(spacing)) {\n    lines.push(`  --spacing-${key}: ${value}px;`)\n  }\n  return lines.join('\\n')\n}\n\nfunction generateRadiusTokens(radius: CamStackTheme['radius']): string {\n  const lines: string[] = []\n  for (const [key, value] of Object.entries(radius)) {\n    lines.push(`  --radius-${key}: ${value}px;`)\n  }\n  return lines.join('\\n')\n}\n\nexport function themeToCss(theme: CamStackTheme): string {\n  const darkColorBlock = generateColorBlock(theme.colors.dark)\n  const lightColorBlock = generateColorBlock(theme.colors.light)\n  const providerBlock = generateProviderColors(theme.colors.dark.provider)\n  const spacingBlock = generateSpacingTokens(theme.spacing)\n  const radiusBlock = generateRadiusTokens(theme.radius)\n\n  return `@theme {\n${providerBlock}\n${spacingBlock}\n${radiusBlock}\n}\n\n.dark {\n${darkColorBlock}\n}\n\n.light {\n${lightColorBlock}\n}\n\n@media (prefers-color-scheme: dark) {\n  :root {\n${darkColorBlock.replace(/^  /gm, '    ')}\n  }\n}\n\n@media (prefers-color-scheme: light) {\n  :root {\n${lightColorBlock.replace(/^  /gm, '    ')}\n  }\n}\n`\n}\n","import { createContext, useCallback, useEffect, useMemo, useState } from 'react'\nimport type { ReactNode } from 'react'\nimport type { ThemeMode, UseThemeModeReturn } from './types'\n\nexport const ThemeContext = createContext<UseThemeModeReturn | null>(null)\n\ninterface ThemeProviderProps {\n  children: ReactNode\n  defaultMode?: ThemeMode\n  storageKey?: string\n}\n\nconst TOGGLE_ORDER: readonly ThemeMode[] = ['dark', 'light', 'system'] as const\n\nfunction getSystemPreference(): 'dark' | 'light' {\n  if (typeof window === 'undefined') return 'dark'\n  return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'\n}\n\nfunction getInitialMode(storageKey: string, defaultMode: ThemeMode): ThemeMode {\n  if (typeof window === 'undefined') return defaultMode\n  const stored = localStorage.getItem(storageKey)\n  if (stored === 'dark' || stored === 'light' || stored === 'system') {\n    return stored\n  }\n  return defaultMode\n}\n\nfunction resolveMode(mode: ThemeMode): 'dark' | 'light' {\n  if (mode === 'system') return getSystemPreference()\n  return mode\n}\n\nexport function ThemeProvider({\n  children,\n  defaultMode = 'system',\n  storageKey = 'camstack-theme-mode',\n}: ThemeProviderProps) {\n  const [mode, setModeState] = useState<ThemeMode>(() => getInitialMode(storageKey, defaultMode))\n  const [resolvedMode, setResolvedMode] = useState<'dark' | 'light'>(() => resolveMode(mode))\n\n  const setMode = useCallback(\n    (newMode: ThemeMode) => {\n      setModeState(newMode)\n      setResolvedMode(resolveMode(newMode))\n      if (typeof window !== 'undefined') {\n        localStorage.setItem(storageKey, newMode)\n      }\n    },\n    [storageKey],\n  )\n\n  const toggleMode = useCallback(() => {\n    const currentIndex = TOGGLE_ORDER.indexOf(mode)\n    const nextIndex = (currentIndex + 1) % TOGGLE_ORDER.length\n    setMode(TOGGLE_ORDER[nextIndex] ?? 'dark')\n  }, [mode, setMode])\n\n  // Apply CSS class on document.documentElement\n  useEffect(() => {\n    if (typeof document === 'undefined') return\n\n    const root = document.documentElement\n    root.classList.remove('dark', 'light')\n    // Always apply the resolved class — even in 'system' mode, the CSS\n    // variables need the .dark or .light class to activate\n    root.classList.add(resolvedMode)\n  }, [mode, resolvedMode])\n\n  // Listen for system theme changes when in 'system' mode\n  useEffect(() => {\n    if (typeof window === 'undefined' || mode !== 'system') return\n\n    const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)')\n    const handleChange = () => {\n      setResolvedMode(getSystemPreference())\n    }\n\n    mediaQuery.addEventListener('change', handleChange)\n    return () => mediaQuery.removeEventListener('change', handleChange)\n  }, [mode])\n\n  const value = useMemo<UseThemeModeReturn>(\n    () => ({ mode, resolvedMode, setMode, toggleMode }),\n    [mode, resolvedMode, setMode, toggleMode],\n  )\n\n  return <ThemeContext.Provider value={value}>{children}</ThemeContext.Provider>\n}\n","import { useContext } from 'react'\nimport { ThemeContext } from './theme-provider'\nimport type { UseThemeModeReturn } from './types'\n\nexport function useThemeMode(): UseThemeModeReturn {\n  const context = useContext(ThemeContext)\n  if (!context) {\n    throw new Error('useThemeMode must be used within a ThemeProvider')\n  }\n  return context\n}\n"],"mappings":"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","names":[]}

package/package.json

@@ -0,0 +1,58 @@
+{
+  "name": "@camstack/ui-library",
+  "version": "0.1.25",
+  "type": "module",
+  "main": "dist/index.cjs",
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    },
+    "./theme": {
+      "types": "./dist/theme/index.d.ts",
+      "import": "./dist/theme/index.js",
+      "require": "./dist/theme/index.cjs"
+    },
+    "./tailwind/*": "./src/tailwind/*"
+  },
+  "files": [
+    "dist",
+    "src/tailwind",
+    "assets"
+  ],
+  "scripts": {
+    "build": "tsup",
+    "typecheck": "tsc --noEmit"
+  },
+  "peerDependencies": {
+    "@tanstack/react-table": "^8.21.3",
+    "react": ">=18",
+    "react-dom": ">=18",
+    "tailwindcss": ">=4.0"
+  },
+  "peerDependenciesMeta": {
+    "react-dom": {
+      "optional": true
+    },
+    "@tanstack/react-table": {
+      "optional": true
+    }
+  },
+  "dependencies": {
+    "class-variance-authority": "^0.7",
+    "clsx": "^2.1",
+    "lucide-react": "^0.576",
+    "tailwind-merge": "^3.0"
+  },
+  "devDependencies": {
+    "@testing-library/dom": "^10.4.1",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^16.3.2",
+    "jsdom": "^29.0.1",
+    "tsup": "^8.5.1",
+    "typescript": "^5.7.0"
+  }
+}