@intellectif/lk-react 23.0.1 → 23.1.1

package/dist/chunk-UHKZXOXD.js

@@ -1,128 +0,0 @@
-'use client';
-import { createContext, useSyncExternalStore, useMemo, useContext } from 'react';
-import { jsx } from 'react/jsx-runtime';
-
-// src/theme/ThemeProvider.tsx
-
-// src/theme/dark-theme.ts
-var darkTheme = {
-  "--lk-color-primary": "#fafafa",
-  "--lk-color-primary-hover": "#e4e4e7",
-  "--lk-color-surface": "#09090b",
-  "--lk-color-surface-raised": "#18181b",
-  "--lk-color-border": "#27272a",
-  "--lk-color-text": "#fafafa",
-  "--lk-color-text-muted": "#a1a1aa",
-  "--lk-color-success": "#4ade80",
-  "--lk-color-error": "#f87171",
-  "--lk-color-warning": "#fbbf24",
-  "--lk-color-focus-ring": "#fafafa"
-};
-
-// src/theme/tokens.ts
-var defaultTheme = {
-  // ── Colours (light) — neutral monochrome; semantic success/error/warning
-  //    retained for status legibility ────────────────────────────────────────
-  "--lk-color-primary": "#18181b",
-  "--lk-color-primary-hover": "#27272a",
-  "--lk-color-surface": "#ffffff",
-  "--lk-color-surface-raised": "#fafafa",
-  "--lk-color-border": "#e4e4e7",
-  "--lk-color-text": "#18181b",
-  "--lk-color-text-muted": "#52525b",
-  "--lk-color-success": "#15803d",
-  "--lk-color-error": "#b91c1c",
-  "--lk-color-warning": "#b45309",
-  "--lk-color-focus-ring": "#18181b",
-  "--lk-color-media-accent": "#ffffff",
-  // An interactive video's two caption lines. The second is warm yellow, the
-  // convention for a second subtitle line, and clears 4.5:1 on the caption box
-  // whatever the video shows through it (see contrast.test.ts).
-  "--lk-iv-caption-color": "#ffffff",
-  "--lk-iv-caption-secondary-color": "#ffe066",
-  "--lk-iv-caption-secondary-scale": "0.85",
-  "--lk-iv-caption-gap": "0.25em",
-  // ── Spacing ──────────────────────────────────────────────────────────────
-  "--lk-spacing-xs": "4px",
-  "--lk-spacing-sm": "8px",
-  "--lk-spacing-md": "16px",
-  "--lk-spacing-lg": "24px",
-  "--lk-spacing-xl": "32px",
-  // ── Typography ───────────────────────────────────────────────────────────
-  "--lk-font-family-base": 'system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif',
-  "--lk-font-size-sm": "0.875rem",
-  "--lk-font-size-base": "1rem",
-  "--lk-font-size-lg": "1.125rem",
-  "--lk-font-weight-normal": "400",
-  "--lk-font-weight-bold": "700",
-  "--lk-line-height-base": "1.5",
-  // ── Shape ────────────────────────────────────────────────────────────────
-  "--lk-radius-sm": "0.25rem",
-  "--lk-radius-base": "0.5rem",
-  "--lk-radius-lg": "0.75rem",
-  // ── Motion ───────────────────────────────────────────────────────────────
-  "--lk-transition-fast": "150ms ease",
-  "--lk-transition-base": "250ms ease"
-};
-
-// src/theme/tailwind.ts
-var BUCKETS = [
-  ["--lk-color-", "colors"],
-  ["--lk-spacing-", "spacing"],
-  ["--lk-radius-", "borderRadius"],
-  ["--lk-font-family-", "fontFamily"],
-  ["--lk-font-size-", "fontSize"]
-];
-function createTailwindTheme(theme) {
-  const merged = { ...defaultTheme, ...theme };
-  const extension = {
-    colors: {},
-    spacing: {},
-    borderRadius: {},
-    fontFamily: {},
-    fontSize: {}
-  };
-  for (const [tokenName, fallback] of Object.entries(merged)) {
-    for (const [prefix, bucket] of BUCKETS) {
-      if (tokenName.startsWith(prefix)) {
-        extension[bucket][`lk-${tokenName.slice(prefix.length)}`] = `var(${tokenName}, ${fallback})`;
-        break;
-      }
-    }
-  }
-  return extension;
-}
-var ThemeContext = createContext(defaultTheme);
-var DARK_QUERY = "(prefers-color-scheme: dark)";
-function subscribePrefersDark(onChange) {
-  if (typeof window === "undefined" || typeof window.matchMedia !== "function") {
-    return () => {
-    };
-  }
-  const mql = window.matchMedia(DARK_QUERY);
-  mql.addEventListener("change", onChange);
-  return () => mql.removeEventListener("change", onChange);
-}
-function getPrefersDark() {
-  if (typeof window === "undefined" || typeof window.matchMedia !== "function") {
-    return false;
-  }
-  return window.matchMedia(DARK_QUERY).matches;
-}
-function ThemeProvider({ theme, children }) {
-  const prefersDark = useSyncExternalStore(subscribePrefersDark, getPrefersDark, () => false);
-  const activeTheme = useMemo(() => {
-    if (theme !== void 0) {
-      return { ...defaultTheme, ...theme };
-    }
-    return prefersDark ? { ...defaultTheme, ...darkTheme } : defaultTheme;
-  }, [theme, prefersDark]);
-  return /* @__PURE__ */ jsx(ThemeContext.Provider, { value: activeTheme, children: /* @__PURE__ */ jsx("div", { style: activeTheme, children }) });
-}
-function useTheme() {
-  return useContext(ThemeContext);
-}
-
-export { ThemeProvider, createTailwindTheme, darkTheme, defaultTheme, useTheme };
-//# sourceMappingURL=chunk-UHKZXOXD.js.map
-//# sourceMappingURL=chunk-UHKZXOXD.js.map

package/dist/chunk-UHKZXOXD.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/theme/dark-theme.ts","../src/theme/tokens.ts","../src/theme/tailwind.ts","../src/theme/ThemeProvider.tsx"],"names":[],"mappings":";;;;;;AAOO,IAAM,SAAA,GAAkC;AAAA,EAC7C,oBAAA,EAAsB,SAAA;AAAA,EACtB,0BAAA,EAA4B,SAAA;AAAA,EAC5B,oBAAA,EAAsB,SAAA;AAAA,EACtB,2BAAA,EAA6B,SAAA;AAAA,EAC7B,mBAAA,EAAqB,SAAA;AAAA,EACrB,iBAAA,EAAmB,SAAA;AAAA,EACnB,uBAAA,EAAyB,SAAA;AAAA,EACzB,oBAAA,EAAsB,SAAA;AAAA,EACtB,kBAAA,EAAoB,SAAA;AAAA,EACpB,oBAAA,EAAsB,SAAA;AAAA,EACtB,uBAAA,EAAyB;AAC3B;;;ACVO,IAAM,YAAA,GAA4B;AAAA;AAAA;AAAA,EAGvC,oBAAA,EAAsB,SAAA;AAAA,EACtB,0BAAA,EAA4B,SAAA;AAAA,EAC5B,oBAAA,EAAsB,SAAA;AAAA,EACtB,2BAAA,EAA6B,SAAA;AAAA,EAC7B,mBAAA,EAAqB,SAAA;AAAA,EACrB,iBAAA,EAAmB,SAAA;AAAA,EACnB,uBAAA,EAAyB,SAAA;AAAA,EACzB,oBAAA,EAAsB,SAAA;AAAA,EACtB,kBAAA,EAAoB,SAAA;AAAA,EACpB,oBAAA,EAAsB,SAAA;AAAA,EACtB,uBAAA,EAAyB,SAAA;AAAA,EACzB,yBAAA,EAA2B,SAAA;AAAA;AAAA;AAAA;AAAA,EAI3B,uBAAA,EAAyB,SAAA;AAAA,EACzB,iCAAA,EAAmC,SAAA;AAAA,EACnC,iCAAA,EAAmC,MAAA;AAAA,EACnC,qBAAA,EAAuB,QAAA;AAAA;AAAA,EAGvB,iBAAA,EAAmB,KAAA;AAAA,EACnB,iBAAA,EAAmB,KAAA;AAAA,EACnB,iBAAA,EAAmB,MAAA;AAAA,EACnB,iBAAA,EAAmB,MAAA;AAAA,EACnB,iBAAA,EAAmB,MAAA;AAAA;AAAA,EAGnB,uBAAA,EACE,4EAAA;AAAA,EACF,mBAAA,EAAqB,UAAA;AAAA,EACrB,qBAAA,EAAuB,MAAA;AAAA,EACvB,mBAAA,EAAqB,UAAA;AAAA,EACrB,yBAAA,EAA2B,KAAA;AAAA,EAC3B,uBAAA,EAAyB,KAAA;AAAA,EACzB,uBAAA,EAAyB,KAAA;AAAA;AAAA,EAGzB,gBAAA,EAAkB,SAAA;AAAA,EAClB,kBAAA,EAAoB,QAAA;AAAA,EACpB,gBAAA,EAAkB,SAAA;AAAA;AAAA,EAGlB,sBAAA,EAAwB,YAAA;AAAA,EACxB,sBAAA,EAAwB;AAC1B;;;ACjCA,IAAM,OAAA,GAAU;AAAA,EACd,CAAC,eAAe,QAAQ,CAAA;AAAA,EACxB,CAAC,iBAAiB,SAAS,CAAA;AAAA,EAC3B,CAAC,gBAAgB,cAAc,CAAA;AAAA,EAC/B,CAAC,qBAAqB,YAAY,CAAA;AAAA,EAClC,CAAC,mBAAmB,UAAU;AAChC,CAAA;AAOO,SAAS,oBAAoB,KAAA,EAAqD;AACvF,EAAA,MAAM,MAAA,GAAiC,EAAE,GAAG,YAAA,EAAc,GAAG,KAAA,EAAM;AACnE,EAAA,MAAM,SAAA,GAAoC;AAAA,IACxC,QAAQ,EAAC;AAAA,IACT,SAAS,EAAC;AAAA,IACV,cAAc,EAAC;AAAA,IACf,YAAY,EAAC;AAAA,IACb,UAAU;AAAC,GACb;AAEA,EAAA,KAAA,MAAW,CAAC,SAAA,EAAW,QAAQ,KAAK,MAAA,CAAO,OAAA,CAAQ,MAAM,CAAA,EAAG;AAC1D,IAAA,KAAA,MAAW,CAAC,MAAA,EAAQ,MAAM,CAAA,IAAK,OAAA,EAAS;AACtC,MAAA,IAAI,SAAA,CAAU,UAAA,CAAW,MAAM,CAAA,EAAG;AAChC,QAAA,SAAA,CAAU,MAAM,CAAA,CAAE,CAAA,GAAA,EAAM,SAAA,CAAU,KAAA,CAAM,MAAA,CAAO,MAAM,CAAC,CAAA,CAAE,CAAA,GACtD,CAAA,IAAA,EAAO,SAAS,KAAK,QAAQ,CAAA,CAAA,CAAA;AAC/B,QAAA;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEA,EAAA,OAAO,SAAA;AACT;ACxCA,IAAM,YAAA,GAAe,cAA2B,YAAY,CAAA;AAE5D,IAAM,UAAA,GAAa,8BAAA;AAGnB,SAAS,qBAAqB,QAAA,EAAkC;AAC9D,EAAA,IAAI,OAAO,MAAA,KAAW,WAAA,IAAe,OAAO,MAAA,CAAO,eAAe,UAAA,EAAY;AAC5E,IAAA,OAAO,MAAM;AAAA,IAAC,CAAA;AAAA,EAChB;AACA,EAAA,MAAM,GAAA,GAAM,MAAA,CAAO,UAAA,CAAW,UAAU,CAAA;AACxC,EAAA,GAAA,CAAI,gBAAA,CAAiB,UAAU,QAAQ,CAAA;AACvC,EAAA,OAAO,MAAM,GAAA,CAAI,mBAAA,CAAoB,QAAA,EAAU,QAAQ,CAAA;AACzD;AAGA,SAAS,cAAA,GAA0B;AACjC,EAAA,IAAI,OAAO,MAAA,KAAW,WAAA,IAAe,OAAO,MAAA,CAAO,eAAe,UAAA,EAAY;AAC5E,IAAA,OAAO,KAAA;AAAA,EACT;AACA,EAAA,OAAO,MAAA,CAAO,UAAA,CAAW,UAAU,CAAA,CAAE,OAAA;AACvC;AAiBO,SAAS,aAAA,CAAc,EAAE,KAAA,EAAO,QAAA,EAAS,EAAuB;AACrE,EAAA,MAAM,WAAA,GAAc,oBAAA,CAAqB,oBAAA,EAAsB,cAAA,EAAgB,MAAM,KAAK,CAAA;AAE1F,EAAA,MAAM,WAAA,GAAc,QAAqB,MAAM;AAC7C,IAAA,IAAI,UAAU,MAAA,EAAW;AACvB,MAAA,OAAO,EAAE,GAAG,YAAA,EAAc,GAAG,KAAA,EAAM;AAAA,IACrC;AACA,IAAA,OAAO,cAAc,EAAE,GAAG,YAAA,EAAc,GAAG,WAAU,GAAI,YAAA;AAAA,EAC3D,CAAA,EAAG,CAAC,KAAA,EAAO,WAAW,CAAC,CAAA;AAEvB,EAAA,uBACE,GAAA,CAAC,YAAA,CAAa,QAAA,EAAb,EAAsB,KAAA,EAAO,WAAA,EAC5B,QAAA,kBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAO,WAAA,EAA+B,QAAA,EAAS,CAAA,EACtD,CAAA;AAEJ;AAGO,SAAS,QAAA,GAAwB;AACtC,EAAA,OAAO,WAAW,YAAY,CAAA;AAChC","file":"chunk-UHKZXOXD.js","sourcesContent":["import type { ThemeTokens } from '@intellectif/lk-core';\n\n/**\n * Dark-mode colour overrides, merged over {@link defaultTheme} by\n * `ThemeProvider`. Colours only — spacing/typography/shape/motion are\n * theme-invariant. All pairs verified WCAG 2.2 AA against the dark surface.\n */\nexport const darkTheme: Partial<ThemeTokens> = {\n  '--lk-color-primary': '#fafafa',\n  '--lk-color-primary-hover': '#e4e4e7',\n  '--lk-color-surface': '#09090b',\n  '--lk-color-surface-raised': '#18181b',\n  '--lk-color-border': '#27272a',\n  '--lk-color-text': '#fafafa',\n  '--lk-color-text-muted': '#a1a1aa',\n  '--lk-color-success': '#4ade80',\n  '--lk-color-error': '#f87171',\n  '--lk-color-warning': '#fbbf24',\n  '--lk-color-focus-ring': '#fafafa',\n};\n","import type { ThemeTokens } from '@intellectif/lk-core';\n\n/**\n * Canonical default theme token values. `defaults.css` mirrors these exactly.\n * Palette is a neutral monochrome, deliberately unbranded, so the SDK carries\n * nobody's look out of the box; consumers rebrand via `ThemeProvider`. All\n * colour pairs are verified to meet WCAG 2.2 AA: 4.5:1 for normal text, 3:1 for\n * UI / focus ring (see theme/__tests__/contrast.test.ts).\n */\nexport const defaultTheme: ThemeTokens = {\n  // ── Colours (light) — neutral monochrome; semantic success/error/warning\n  //    retained for status legibility ────────────────────────────────────────\n  '--lk-color-primary': '#18181b',\n  '--lk-color-primary-hover': '#27272a',\n  '--lk-color-surface': '#ffffff',\n  '--lk-color-surface-raised': '#fafafa',\n  '--lk-color-border': '#e4e4e7',\n  '--lk-color-text': '#18181b',\n  '--lk-color-text-muted': '#52525b',\n  '--lk-color-success': '#15803d',\n  '--lk-color-error': '#b91c1c',\n  '--lk-color-warning': '#b45309',\n  '--lk-color-focus-ring': '#18181b',\n  '--lk-color-media-accent': '#ffffff',\n  // An interactive video's two caption lines. The second is warm yellow, the\n  // convention for a second subtitle line, and clears 4.5:1 on the caption box\n  // whatever the video shows through it (see contrast.test.ts).\n  '--lk-iv-caption-color': '#ffffff',\n  '--lk-iv-caption-secondary-color': '#ffe066',\n  '--lk-iv-caption-secondary-scale': '0.85',\n  '--lk-iv-caption-gap': '0.25em',\n\n  // ── Spacing ──────────────────────────────────────────────────────────────\n  '--lk-spacing-xs': '4px',\n  '--lk-spacing-sm': '8px',\n  '--lk-spacing-md': '16px',\n  '--lk-spacing-lg': '24px',\n  '--lk-spacing-xl': '32px',\n\n  // ── Typography ───────────────────────────────────────────────────────────\n  '--lk-font-family-base':\n    'system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif',\n  '--lk-font-size-sm': '0.875rem',\n  '--lk-font-size-base': '1rem',\n  '--lk-font-size-lg': '1.125rem',\n  '--lk-font-weight-normal': '400',\n  '--lk-font-weight-bold': '700',\n  '--lk-line-height-base': '1.5',\n\n  // ── Shape ────────────────────────────────────────────────────────────────\n  '--lk-radius-sm': '0.25rem',\n  '--lk-radius-base': '0.5rem',\n  '--lk-radius-lg': '0.75rem',\n\n  // ── Motion ───────────────────────────────────────────────────────────────\n  '--lk-transition-fast': '150ms ease',\n  '--lk-transition-base': '250ms ease',\n};\n","import type { ThemeTokens } from '@intellectif/lk-core';\nimport { defaultTheme } from './tokens.js';\n\n/**\n * Shape consumed by a Tailwind config's `theme.extend`. Every entry is a\n * `var(--lk-token, <fallback>)` reference: the var keeps utilities live\n * (ThemeProvider / dark-mode override at runtime); the fallback makes them\n * work with zero setup (no provider, no `defaults.css` import).\n */\nexport interface TailwindThemeExtension {\n  colors: Record<string, string>;\n  spacing: Record<string, string>;\n  borderRadius: Record<string, string>;\n  fontFamily: Record<string, string>;\n  fontSize: Record<string, string>;\n}\n\n/**\n * Token-prefix → Tailwind bucket. `--lk-font-weight-*`, `--lk-line-height-*`\n * and `--lk-transition-*` are intentionally absent: the first two have no\n * matching `theme.extend` group here, and the transition tokens hold a\n * `<duration> <easing>` shorthand that would emit invalid\n * `transition-duration: 150ms ease` if mapped to Tailwind's `transitionDuration`.\n */\nconst BUCKETS = [\n  ['--lk-color-', 'colors'],\n  ['--lk-spacing-', 'spacing'],\n  ['--lk-radius-', 'borderRadius'],\n  ['--lk-font-family-', 'fontFamily'],\n  ['--lk-font-size-', 'fontSize'],\n] as const;\n\n/**\n * Converts SDK theme tokens into a Tailwind `theme.extend` object so Tailwind\n * projects consume the same `--lk-*` tokens as the components — one shared\n * source of truth rather than a parallel, conflicting palette.\n */\nexport function createTailwindTheme(theme: Partial<ThemeTokens>): TailwindThemeExtension {\n  const merged: Record<string, string> = { ...defaultTheme, ...theme };\n  const extension: TailwindThemeExtension = {\n    colors: {},\n    spacing: {},\n    borderRadius: {},\n    fontFamily: {},\n    fontSize: {},\n  };\n\n  for (const [tokenName, fallback] of Object.entries(merged)) {\n    for (const [prefix, bucket] of BUCKETS) {\n      if (tokenName.startsWith(prefix)) {\n        extension[bucket][`lk-${tokenName.slice(prefix.length)}`] =\n          `var(${tokenName}, ${fallback})`;\n        break;\n      }\n    }\n  }\n\n  return extension;\n}\n","'use client';\n\nimport type { ThemeTokens } from '@intellectif/lk-core';\nimport {\n  type CSSProperties,\n  createContext,\n  type ReactNode,\n  useContext,\n  useMemo,\n  useSyncExternalStore,\n} from 'react';\nimport { darkTheme } from './dark-theme.js';\nimport { defaultTheme } from './tokens.js';\n\nexport { darkTheme } from './dark-theme.js';\nexport { createTailwindTheme, type TailwindThemeExtension } from './tailwind.js';\nexport { defaultTheme } from './tokens.js';\n\nconst ThemeContext = createContext<ThemeTokens>(defaultTheme);\n\nconst DARK_QUERY = '(prefers-color-scheme: dark)';\n\n/** Subscribe to OS dark-mode changes; no-op when there is no `window`. */\nfunction subscribePrefersDark(onChange: () => void): () => void {\n  if (typeof window === 'undefined' || typeof window.matchMedia !== 'function') {\n    return () => {};\n  }\n  const mql = window.matchMedia(DARK_QUERY);\n  mql.addEventListener('change', onChange);\n  return () => mql.removeEventListener('change', onChange);\n}\n\n/** Current OS dark-mode preference; `false` when there is no `window`. */\nfunction getPrefersDark(): boolean {\n  if (typeof window === 'undefined' || typeof window.matchMedia !== 'function') {\n    return false;\n  }\n  return window.matchMedia(DARK_QUERY).matches;\n}\n\nexport interface ThemeProviderProps {\n  /** Partial token overrides. When provided, dark auto-detection is disabled. */\n  theme?: Partial<ThemeTokens>;\n  children: ReactNode;\n}\n\n/**\n * Provides theme tokens to descendant activity components as scoped inline CSS\n * custom properties on a wrapper `<div>`, and via {@link useTheme}.\n *\n * Resolution: an explicit `theme` prop merges over {@link defaultTheme} (and\n * suppresses dark auto-detect, per Req 13.5). With no `theme` prop, the OS\n * `prefers-color-scheme: dark` preference auto-applies {@link darkTheme}.\n * SSR-safe: the server snapshot is always light, so hydration never mismatches.\n */\nexport function ThemeProvider({ theme, children }: ThemeProviderProps) {\n  const prefersDark = useSyncExternalStore(subscribePrefersDark, getPrefersDark, () => false);\n\n  const activeTheme = useMemo<ThemeTokens>(() => {\n    if (theme !== undefined) {\n      return { ...defaultTheme, ...theme };\n    }\n    return prefersDark ? { ...defaultTheme, ...darkTheme } : defaultTheme;\n  }, [theme, prefersDark]);\n\n  return (\n    <ThemeContext.Provider value={activeTheme}>\n      <div style={activeTheme as CSSProperties}>{children}</div>\n    </ThemeContext.Provider>\n  );\n}\n\n/** Returns the currently active theme tokens (defaults when no provider). */\nexport function useTheme(): ThemeTokens {\n  return useContext(ThemeContext);\n}\n"]}