@cube-dev/ui-kit 0.182.0 → 0.183.0

package/dist/provider.js.map

@@ -1 +1 @@
-{"version":3,"file":"provider.js","names":[],"sources":["../src/provider.tsx"],"sourcesContent":["import {\n  createContext,\n  ForwardedRef,\n  PropsWithChildren,\n  ReactElement,\n  useContext,\n  useMemo,\n} from 'react';\n\nimport { NavigationAdapter } from './providers/navigation.types';\nimport { defaultNavigationAdapter } from './providers/navigationAdapter.default';\nimport { EventBusProvider } from './utils/react/useEventBus';\n\nimport type { Props } from './props';\n\nexport interface ProviderProps extends Props {\n  insideForm?: boolean;\n  isDisabled?: boolean;\n  isReadOnly?: boolean;\n  isRequired?: boolean;\n  isInvalid?: boolean;\n  isValid?: boolean;\n  navigation?: NavigationAdapter;\n  ref?: ReactElement;\n  root?: ForwardedRef<any>;\n}\n\nexport type ProviderInsideProps = Omit<ProviderProps, 'styles'>;\n\nexport const UIKitContext = createContext<ProviderInsideProps>({\n  navigation: defaultNavigationAdapter,\n});\n\nexport function Provider(allProps: PropsWithChildren<ProviderProps>) {\n  let {\n    children,\n    insideForm,\n    isDisabled,\n    isReadOnly,\n    isRequired,\n    isInvalid,\n    isValid,\n    navigation,\n    root,\n    ref,\n  } = allProps;\n\n  const parentContext = useContext(UIKitContext);\n\n  // Wrap with EventBusProvider for menu synchronization\n  children = <EventBusProvider>{children}</EventBusProvider>;\n\n  const props = useMemo(\n    () => ({\n      ref,\n      insideForm,\n      isDisabled,\n      isReadOnly,\n      isRequired,\n      isInvalid,\n      isValid,\n      navigation: navigation || defaultNavigationAdapter,\n      root,\n    }),\n    [\n      ref,\n      insideForm,\n      isDisabled,\n      isReadOnly,\n      isRequired,\n      isInvalid,\n      isValid,\n      navigation,\n      root,\n    ],\n  );\n\n  const newValue = useMemo(() => {\n    let newValue = Object.assign({}, parentContext);\n\n    Object.keys(props).forEach((key) => {\n      if (props[key] != null) {\n        newValue[key] = props[key];\n      }\n    });\n\n    return newValue;\n  }, [parentContext, props]);\n\n  return (\n    <UIKitContext.Provider value={newValue}>{children}</UIKitContext.Provider>\n  );\n}\n\nexport function useProviderProps<T extends ProviderProps = Props>(props: T): T {\n  const contextProps = useContext(UIKitContext);\n\n  return { ...contextProps, ...props } as T;\n}\n"],"mappings":";;;;;;;AA6BA,MAAa,eAAe,cAAmC,EAC7D,YAAY,0BACb,CAAC;AAEF,SAAgB,SAAS,UAA4C;CACnE,IAAI,EACF,UACA,YACA,YACA,YACA,YACA,WACA,SACA,YACA,MACA,QACE;CAEJ,MAAM,gBAAgB,WAAW,aAAa;AAG9C,YAAW,oBAAC,oBAAkB,WAA4B;CAE1D,MAAM,QAAQ,eACL;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YAAY,cAAc;EAC1B;EACD,GACD;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;CAED,MAAM,WAAW,cAAc;EAC7B,IAAI,WAAW,OAAO,OAAO,EAAE,EAAE,cAAc;AAE/C,SAAO,KAAK,MAAM,CAAC,SAAS,QAAQ;AAClC,OAAI,MAAM,QAAQ,KAChB,UAAS,OAAO,MAAM;IAExB;AAEF,SAAO;IACN,CAAC,eAAe,MAAM,CAAC;AAE1B,QACE,oBAAC,aAAa;EAAS,OAAO;EAAW;GAAiC;;AAI9E,SAAgB,iBAAkD,OAAa;AAG7E,QAAO;EAAE,GAFY,WAAW,aAAa;EAEnB,GAAG;EAAO"}
+{"version":3,"file":"provider.js","names":["createContext","ForwardedRef","PropsWithChildren","ReactElement","useContext","useMemo","NavigationAdapter","defaultNavigationAdapter","EventBusProvider","Props","ProviderProps","insideForm","isDisabled","isReadOnly","isRequired","isInvalid","isValid","navigation","ref","root","ProviderInsideProps","Omit","UIKitContext","Provider","allProps","children","parentContext","props","newValue","Object","assign","keys","forEach","key","useProviderProps","$","_c","contextProps","t0","T"],"sources":["../src/provider.tsx"],"sourcesContent":["import {\n  createContext,\n  ForwardedRef,\n  PropsWithChildren,\n  ReactElement,\n  useContext,\n  useMemo,\n} from 'react';\n\nimport { NavigationAdapter } from './providers/navigation.types';\nimport { defaultNavigationAdapter } from './providers/navigationAdapter.default';\nimport { EventBusProvider } from './utils/react/useEventBus';\n\nimport type { Props } from './props';\n\nexport interface ProviderProps extends Props {\n  insideForm?: boolean;\n  isDisabled?: boolean;\n  isReadOnly?: boolean;\n  isRequired?: boolean;\n  isInvalid?: boolean;\n  isValid?: boolean;\n  navigation?: NavigationAdapter;\n  ref?: ReactElement;\n  root?: ForwardedRef<any>;\n}\n\nexport type ProviderInsideProps = Omit<ProviderProps, 'styles'>;\n\nexport const UIKitContext = createContext<ProviderInsideProps>({\n  navigation: defaultNavigationAdapter,\n});\n\nexport function Provider(allProps: PropsWithChildren<ProviderProps>) {\n  let {\n    children,\n    insideForm,\n    isDisabled,\n    isReadOnly,\n    isRequired,\n    isInvalid,\n    isValid,\n    navigation,\n    root,\n    ref,\n  } = allProps;\n\n  const parentContext = useContext(UIKitContext);\n\n  // Wrap with EventBusProvider for menu synchronization\n  children = <EventBusProvider>{children}</EventBusProvider>;\n\n  const props = useMemo(\n    () => ({\n      ref,\n      insideForm,\n      isDisabled,\n      isReadOnly,\n      isRequired,\n      isInvalid,\n      isValid,\n      navigation: navigation || defaultNavigationAdapter,\n      root,\n    }),\n    [\n      ref,\n      insideForm,\n      isDisabled,\n      isReadOnly,\n      isRequired,\n      isInvalid,\n      isValid,\n      navigation,\n      root,\n    ],\n  );\n\n  const newValue = useMemo(() => {\n    let newValue = Object.assign({}, parentContext);\n\n    Object.keys(props).forEach((key) => {\n      if (props[key] != null) {\n        newValue[key] = props[key];\n      }\n    });\n\n    return newValue;\n  }, [parentContext, props]);\n\n  return (\n    <UIKitContext.Provider value={newValue}>{children}</UIKitContext.Provider>\n  );\n}\n\nexport function useProviderProps<T extends ProviderProps = Props>(props: T): T {\n  const contextProps = useContext(UIKitContext);\n\n  return { ...contextProps, ...props } as T;\n}\n"],"mappings":";;;;;;;;AA6BA,MAAasB,eAAetB,cAAmC,EAC7DiB,YAAYV,0BACb,CAAC;AAEF,SAAgBgB,SAASC,UAA4C;CACnE,IAAI,EACFC,UACAd,YACAC,YACAC,YACAC,YACAC,WACAC,SACAC,YACAE,MACAD,QACEM;CAEJ,MAAME,gBAAgBtB,WAAWkB,aAAa;AAG9CG,YAAW,oBAAC,oBAAkBA,WAA4B;CAE1D,MAAME,QAAQtB,eACL;EACLa;EACAP;EACAC;EACAC;EACAC;EACAC;EACAC;EACAC,YAAYA,cAAcV;EAC1BY;EACD,GACD;EACED;EACAP;EACAC;EACAC;EACAC;EACAC;EACAC;EACAC;EACAE;EAEJ,CAAC;CAED,MAAMS,aAAWvB,cAAc;EAC7B,IAAIuB,WAAWC,OAAOC,OAAO,EAAE,EAAEJ,cAAc;AAE/CG,SAAOE,KAAKJ,MAAM,CAACK,SAASC,QAAQ;AAClC,OAAIN,MAAMM,QAAQ,KAChBL,UAASK,OAAON,MAAMM;IAExB;AAEF,SAAOL;IACN,CAACF,eAAeC,MAAM,CAAC;AAE1B,QACE,oBAAC,aAAa;EAAS,OAAOC;EAAWH;GAAiC;;AAI9E,SAAOS,iBAAAP,OAAA;CAAA,MAAAQ,IAAAC,EAAA,EAAA;CACL,MAAAC,eAAqBjC,WAAWkB,aAAa;CAAC,IAAAgB;AAAA,KAAAH,EAAA,OAAAE,gBAAAF,EAAA,OAAAR,OAAA;AAEvCW,OAAA;GAAA,GAAKD;GAAY,GAAKV;GAAO;AAAAQ,IAAA,KAAAE;AAAAF,IAAA,KAAAR;AAAAQ,IAAA,KAAAG;OAAAA,MAAAH,EAAA;AAAA,QAA7BG"}

package/dist/providers/TrackingProvider.js

@@ -1,16 +1,40 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
-import { createContext, useContext, useMemo } from "react";
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
+import { c } from "react-compiler-runtime";
+import { createContext, useContext } from "react";
 import { Fragment as Fragment$1, jsx } from "react/jsx-runtime";
 
 //#region src/providers/TrackingProvider.tsx
 const TrackingContext = createContext({ event() {} });
-function TrackingProvider({ children, event }) {
-	const tracking = useMemo(() => ({ event }), [event]);
-	if (!event) return /* @__PURE__ */ jsx(Fragment$1, { children });
-	return /* @__PURE__ */ jsx(TrackingContext.Provider, {
-		value: tracking,
-		children
-	});
+function TrackingProvider(t0) {
+	const $ = c(7);
+	const { children, event } = t0;
+	let t1;
+	if ($[0] !== event) {
+		t1 = { event };
+		$[0] = event;
+		$[1] = t1;
+	} else t1 = $[1];
+	const tracking = t1;
+	if (!event) {
+		let t2;
+		if ($[2] !== children) {
+			t2 = /* @__PURE__ */ jsx(Fragment$1, { children });
+			$[2] = children;
+			$[3] = t2;
+		} else t2 = $[3];
+		return t2;
+	}
+	let t2;
+	if ($[4] !== children || $[5] !== tracking) {
+		t2 = /* @__PURE__ */ jsx(TrackingContext.Provider, {
+			value: tracking,
+			children
+		});
+		$[4] = children;
+		$[5] = tracking;
+		$[6] = t2;
+	} else t2 = $[6];
+	return t2;
 }
 function useTracking() {
 	return useContext(TrackingContext);

package/dist/providers/TrackingProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"TrackingProvider.js","names":[],"sources":["../../src/providers/TrackingProvider.tsx"],"sourcesContent":["import { createContext, ReactNode, useContext, useMemo } from 'react';\n\nexport interface TrackingProps {\n  event?: (\n    name: string,\n    data?: Record<string, any>,\n    element?: HTMLElement,\n  ) => void;\n}\n\nexport const TrackingContext = createContext<TrackingProps>({\n  event() {\n    // noop\n  },\n});\n\nexport interface CubeTrackingProviderProps extends TrackingProps {\n  children?: ReactNode;\n}\n\nexport function TrackingProvider({\n  children,\n  event,\n}: CubeTrackingProviderProps) {\n  const tracking = useMemo(() => ({ event }), [event]);\n\n  if (!event) return <>{children}</>;\n\n  return (\n    <TrackingContext.Provider value={tracking}>\n      {children}\n    </TrackingContext.Provider>\n  );\n}\n\nexport function useTracking() {\n  const tracking = useContext(TrackingContext);\n\n  return tracking;\n}\n"],"mappings":";;;;;AAUA,MAAa,kBAAkB,cAA6B,EAC1D,QAAQ,IAGT,CAAC;AAMF,SAAgB,iBAAiB,EAC/B,UACA,SAC4B;CAC5B,MAAM,WAAW,eAAe,EAAE,OAAO,GAAG,CAAC,MAAM,CAAC;AAEpD,KAAI,CAAC,MAAO,QAAO,kCAAG,WAAY;AAElC,QACE,oBAAC,gBAAgB;EAAS,OAAO;EAC9B;GACwB;;AAI/B,SAAgB,cAAc;AAG5B,QAFiB,WAAW,gBAAgB"}
+{"version":3,"file":"TrackingProvider.js","names":["createContext","ReactNode","useContext","useMemo","TrackingProps","event","name","data","Record","element","HTMLElement","TrackingContext","CubeTrackingProviderProps","children","TrackingProvider","t0","$","_c","t1","tracking","t2","useTracking"],"sources":["../../src/providers/TrackingProvider.tsx"],"sourcesContent":["import { createContext, ReactNode, useContext, useMemo } from 'react';\n\nexport interface TrackingProps {\n  event?: (\n    name: string,\n    data?: Record<string, any>,\n    element?: HTMLElement,\n  ) => void;\n}\n\nexport const TrackingContext = createContext<TrackingProps>({\n  event() {\n    // noop\n  },\n});\n\nexport interface CubeTrackingProviderProps extends TrackingProps {\n  children?: ReactNode;\n}\n\nexport function TrackingProvider({\n  children,\n  event,\n}: CubeTrackingProviderProps) {\n  const tracking = useMemo(() => ({ event }), [event]);\n\n  if (!event) return <>{children}</>;\n\n  return (\n    <TrackingContext.Provider value={tracking}>\n      {children}\n    </TrackingContext.Provider>\n  );\n}\n\nexport function useTracking() {\n  const tracking = useContext(TrackingContext);\n\n  return tracking;\n}\n"],"mappings":";;;;;;AAUA,MAAaW,kBAAkBX,cAA6B,EAC1DK,QAAQ,IAGT,CAAC;AAMF,SAAOS,iBAAAC,IAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAA0B,MAAA,EAAAJ,UAAAR,UAAAU;CAGL,IAAAG;AAAA,KAAAF,EAAA,OAAAX,OAAA;AACMa,OAAA,EAAAb,OAAS;AAAAW,IAAA,KAAAX;AAAAW,IAAA,KAAAE;OAAAA,MAAAF,EAAA;CAAzC,MAAAG,WAAgCD;AAEhC,KAAI,CAACb,OAAK;EAAA,IAAAe;AAAA,MAAAJ,EAAA,OAAAH,UAAA;AAASO,QAAA,kCAAGP,WAAY;AAAAG,KAAA,KAAAH;AAAAG,KAAA,KAAAI;QAAAA,MAAAJ,EAAA;AAAA,SAAfI;;CAAgB,IAAAA;AAAA,KAAAJ,EAAA,OAAAH,YAAAG,EAAA,OAAAG,UAAA;AAGjCC,OAAA,oBAAA,gBAAA;GAAiCD,OAAAA;GAC9BN;IACwB;AAAAG,IAAA,KAAAH;AAAAG,IAAA,KAAAG;AAAAH,IAAA,KAAAI;OAAAA,MAAAJ,EAAA;AAAA,QAF3BI;;AAMJ,SAAOC,cAAA;AACwC,QAA5BnB,WAAWS,gBAAgB"}

package/dist/providers/navigationAdapter.default.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 //#region src/providers/navigationAdapter.default.ts
 /**
 * Converts a Path object to a string URL

package/dist/providers/navigationAdapter.default.js.map

@@ -1 +1 @@
-{"version":3,"file":"navigationAdapter.default.js","names":[],"sources":["../../src/providers/navigationAdapter.default.ts"],"sourcesContent":["import {\n  NavigateLike,\n  NavigateOptions,\n  NavigationAdapter,\n  Path,\n  To,\n} from './navigation.types';\n\n/**\n * Converts a Path object to a string URL\n */\nfunction pathToString(path: Path): string {\n  let { pathname = '', search = '', hash = '' } = path;\n  if (pathname && !pathname.startsWith('/')) pathname = `/${pathname}`;\n  if (search && !search.startsWith('?')) search = `?${search}`;\n  if (hash && !hash.startsWith('#')) hash = `#${hash}`;\n  return `${pathname}${search}${hash}`;\n}\n\n/**\n * Default navigation adapter that provides native browser navigation\n * when no router is available. This ensures hooks are always callable.\n */\nexport const defaultNavigationAdapter: NavigationAdapter = {\n  useHref: (to: To) => {\n    // For strings, return as-is (SSR-safe, no window dependency)\n    if (typeof to === 'string') {\n      return to;\n    }\n    // For objects, normalize to string\n    return pathToString(to);\n  },\n\n  useNavigate: () => {\n    const navigate: NavigateLike = (to: any, options?: NavigateOptions) => {\n      // Handle history navigation (numbers)\n      if (typeof to === 'number') {\n        if (typeof window !== 'undefined') {\n          window.history.go(to);\n        }\n        return;\n      }\n\n      // Handle strings and objects - convert to string URL\n      const url = typeof to === 'string' ? to : pathToString(to);\n\n      if (typeof window !== 'undefined') {\n        if (options?.replace) {\n          window.location.replace(url);\n        } else {\n          window.location.assign(url);\n        }\n      }\n    };\n    return navigate;\n  },\n};\n"],"mappings":";;;;;AAWA,SAAS,aAAa,MAAoB;CACxC,IAAI,EAAE,WAAW,IAAI,SAAS,IAAI,OAAO,OAAO;AAChD,KAAI,YAAY,CAAC,SAAS,WAAW,IAAI,CAAE,YAAW,IAAI;AAC1D,KAAI,UAAU,CAAC,OAAO,WAAW,IAAI,CAAE,UAAS,IAAI;AACpD,KAAI,QAAQ,CAAC,KAAK,WAAW,IAAI,CAAE,QAAO,IAAI;AAC9C,QAAO,GAAG,WAAW,SAAS;;;;;;AAOhC,MAAa,2BAA8C;CACzD,UAAU,OAAW;AAEnB,MAAI,OAAO,OAAO,SAChB,QAAO;AAGT,SAAO,aAAa,GAAG;;CAGzB,mBAAmB;EACjB,MAAM,YAA0B,IAAS,YAA8B;AAErE,OAAI,OAAO,OAAO,UAAU;AAC1B,QAAI,OAAO,WAAW,YACpB,QAAO,QAAQ,GAAG,GAAG;AAEvB;;GAIF,MAAM,MAAM,OAAO,OAAO,WAAW,KAAK,aAAa,GAAG;AAE1D,OAAI,OAAO,WAAW,YACpB,KAAI,SAAS,QACX,QAAO,SAAS,QAAQ,IAAI;OAE5B,QAAO,SAAS,OAAO,IAAI;;AAIjC,SAAO;;CAEV"}
+{"version":3,"file":"navigationAdapter.default.js","names":["NavigateLike","NavigateOptions","NavigationAdapter","Path","To","pathToString","path","pathname","search","hash","startsWith","defaultNavigationAdapter","useHref","to","useNavigate","navigate","options","window","history","go","url","replace","location","assign"],"sources":["../../src/providers/navigationAdapter.default.ts"],"sourcesContent":["import {\n  NavigateLike,\n  NavigateOptions,\n  NavigationAdapter,\n  Path,\n  To,\n} from './navigation.types';\n\n/**\n * Converts a Path object to a string URL\n */\nfunction pathToString(path: Path): string {\n  let { pathname = '', search = '', hash = '' } = path;\n  if (pathname && !pathname.startsWith('/')) pathname = `/${pathname}`;\n  if (search && !search.startsWith('?')) search = `?${search}`;\n  if (hash && !hash.startsWith('#')) hash = `#${hash}`;\n  return `${pathname}${search}${hash}`;\n}\n\n/**\n * Default navigation adapter that provides native browser navigation\n * when no router is available. This ensures hooks are always callable.\n */\nexport const defaultNavigationAdapter: NavigationAdapter = {\n  useHref: (to: To) => {\n    // For strings, return as-is (SSR-safe, no window dependency)\n    if (typeof to === 'string') {\n      return to;\n    }\n    // For objects, normalize to string\n    return pathToString(to);\n  },\n\n  useNavigate: () => {\n    const navigate: NavigateLike = (to: any, options?: NavigateOptions) => {\n      // Handle history navigation (numbers)\n      if (typeof to === 'number') {\n        if (typeof window !== 'undefined') {\n          window.history.go(to);\n        }\n        return;\n      }\n\n      // Handle strings and objects - convert to string URL\n      const url = typeof to === 'string' ? to : pathToString(to);\n\n      if (typeof window !== 'undefined') {\n        if (options?.replace) {\n          window.location.replace(url);\n        } else {\n          window.location.assign(url);\n        }\n      }\n    };\n    return navigate;\n  },\n};\n"],"mappings":";;;;;AAWA,SAASK,aAAaC,MAAoB;CACxC,IAAI,EAAEC,WAAW,IAAIC,SAAS,IAAIC,OAAO,OAAOH;AAChD,KAAIC,YAAY,CAACA,SAASG,WAAW,IAAI,CAAEH,YAAW,IAAIA;AAC1D,KAAIC,UAAU,CAACA,OAAOE,WAAW,IAAI,CAAEF,UAAS,IAAIA;AACpD,KAAIC,QAAQ,CAACA,KAAKC,WAAW,IAAI,CAAED,QAAO,IAAIA;AAC9C,QAAO,GAAGF,WAAWC,SAASC;;;;;;AAOhC,MAAaE,2BAA8C;CACzDC,UAAUC,OAAW;AAEnB,MAAI,OAAOA,OAAO,SAChB,QAAOA;AAGT,SAAOR,aAAaQ,GAAG;;CAGzBC,mBAAmB;EACjB,MAAMC,YAA0BF,IAASG,YAA8B;AAErE,OAAI,OAAOH,OAAO,UAAU;AAC1B,QAAI,OAAOI,WAAW,YACpBA,QAAOC,QAAQC,GAAGN,GAAG;AAEvB;;GAIF,MAAMO,MAAM,OAAOP,OAAO,WAAWA,KAAKR,aAAaQ,GAAG;AAE1D,OAAI,OAAOI,WAAW,YACpB,KAAID,SAASK,QACXJ,QAAOK,SAASD,QAAQD,IAAI;OAE5BH,QAAOK,SAASC,OAAOH,IAAI;;AAIjC,SAAOL;;CAEV"}

package/dist/tokens/all-tokens.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 import { getPaletteVersion } from "./palette-config.js";
 import { BASE_TOKENS } from "./base.js";
 import { lazyStyles } from "./lazy-styles.js";

package/dist/tokens/all-tokens.js.map

@@ -1 +1 @@
-{"version":3,"file":"all-tokens.js","names":[],"sources":["../../src/tokens/all-tokens.ts"],"sourcesContent":["import { generateTypographyTokens } from '@tenphi/tasty';\n\nimport { BASE_TOKENS } from './base';\nimport { getColorTokens } from './colors';\nimport { LAYOUT_TOKENS } from './layout';\nimport { lazyStyles } from './lazy-styles';\nimport { getPaletteVersion } from './palette-config';\nimport { SHADOW_TOKENS } from './shadows';\nimport { SIZE_TOKENS } from './sizes';\nimport { SPACE_TOKENS } from './spacing';\nimport { TYPOGRAPHY_PRESETS } from './typography';\n\nimport type { Styles } from '@tenphi/tasty';\n\n/**\n * All design tokens combined into a single Styles object.\n * Keys use $ prefix for CSS custom properties.\n *\n * Color tokens resolve against the current palette config (see\n * {@link getColorTokens}), and this map is memoized against that config's\n * version so `setPaletteConfig()` invalidates it. Prefer this over the lazy\n * {@link TOKENS} proxy when applying styles from React (`GlobalStyles`).\n *\n * Includes:\n * - Base tokens ($gap, $radius, etc.)\n * - Space tokens ($space-xs, $space-sm, etc.)\n * - Size tokens ($size-xs, $size-sm, etc.)\n * - Shadow tokens ($shadow, $item-shadow, etc.)\n * - Layout tokens ($max-content-width, $topbar-height, etc.)\n * - Typography tokens ($h1-font-size, $t3-line-height, etc.)\n * - Color tokens ($purple-color, $danger-color, etc.)\n */\nlet tokensCache: Styles | null = null;\nlet cachedVersion = -1;\n\nexport function getTokens(): Styles {\n  const version = getPaletteVersion();\n\n  if (!tokensCache || cachedVersion !== version) {\n    tokensCache = {\n      ...BASE_TOKENS,\n      ...SPACE_TOKENS,\n      ...SIZE_TOKENS,\n      ...SHADOW_TOKENS,\n      ...LAYOUT_TOKENS,\n      ...generateTypographyTokens(TYPOGRAPHY_PRESETS),\n      ...getColorTokens(),\n    };\n    cachedVersion = version;\n  }\n  return tokensCache;\n}\n\n/** Lazy proxy of {@link getTokens}. Prefer `getTokens()` in new code. */\nexport const TOKENS: Styles = lazyStyles(getTokens);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCA,IAAI,cAA6B;AACjC,IAAI,gBAAgB;AAEpB,SAAgB,YAAoB;CAClC,MAAM,UAAU,mBAAmB;AAEnC,KAAI,CAAC,eAAe,kBAAkB,SAAS;AAC7C,gBAAc;GACZ,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG,yBAAyB,mBAAmB;GAC/C,GAAG,gBAAgB;GACpB;AACD,kBAAgB;;AAElB,QAAO;;;AAIT,MAAa,SAAiB,WAAW,UAAU"}
+{"version":3,"file":"all-tokens.js","names":["generateTypographyTokens","BASE_TOKENS","getColorTokens","LAYOUT_TOKENS","lazyStyles","getPaletteVersion","SHADOW_TOKENS","SIZE_TOKENS","SPACE_TOKENS","TYPOGRAPHY_PRESETS","Styles","tokensCache","cachedVersion","getTokens","version","TOKENS"],"sources":["../../src/tokens/all-tokens.ts"],"sourcesContent":["import { generateTypographyTokens } from '@tenphi/tasty';\n\nimport { BASE_TOKENS } from './base';\nimport { getColorTokens } from './colors';\nimport { LAYOUT_TOKENS } from './layout';\nimport { lazyStyles } from './lazy-styles';\nimport { getPaletteVersion } from './palette-config';\nimport { SHADOW_TOKENS } from './shadows';\nimport { SIZE_TOKENS } from './sizes';\nimport { SPACE_TOKENS } from './spacing';\nimport { TYPOGRAPHY_PRESETS } from './typography';\n\nimport type { Styles } from '@tenphi/tasty';\n\n/**\n * All design tokens combined into a single Styles object.\n * Keys use $ prefix for CSS custom properties.\n *\n * Color tokens resolve against the current palette config (see\n * {@link getColorTokens}), and this map is memoized against that config's\n * version so `setPaletteConfig()` invalidates it. Prefer this over the lazy\n * {@link TOKENS} proxy when applying styles from React (`GlobalStyles`).\n *\n * Includes:\n * - Base tokens ($gap, $radius, etc.)\n * - Space tokens ($space-xs, $space-sm, etc.)\n * - Size tokens ($size-xs, $size-sm, etc.)\n * - Shadow tokens ($shadow, $item-shadow, etc.)\n * - Layout tokens ($max-content-width, $topbar-height, etc.)\n * - Typography tokens ($h1-font-size, $t3-line-height, etc.)\n * - Color tokens ($purple-color, $danger-color, etc.)\n */\nlet tokensCache: Styles | null = null;\nlet cachedVersion = -1;\n\nexport function getTokens(): Styles {\n  const version = getPaletteVersion();\n\n  if (!tokensCache || cachedVersion !== version) {\n    tokensCache = {\n      ...BASE_TOKENS,\n      ...SPACE_TOKENS,\n      ...SIZE_TOKENS,\n      ...SHADOW_TOKENS,\n      ...LAYOUT_TOKENS,\n      ...generateTypographyTokens(TYPOGRAPHY_PRESETS),\n      ...getColorTokens(),\n    };\n    cachedVersion = version;\n  }\n  return tokensCache;\n}\n\n/** Lazy proxy of {@link getTokens}. Prefer `getTokens()` in new code. */\nexport const TOKENS: Styles = lazyStyles(getTokens);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCA,IAAIW,cAA6B;AACjC,IAAIC,gBAAgB;AAEpB,SAAgBC,YAAoB;CAClC,MAAMC,UAAUT,mBAAmB;AAEnC,KAAI,CAACM,eAAeC,kBAAkBE,SAAS;AAC7CH,gBAAc;GACZ,GAAGV;GACH,GAAGO;GACH,GAAGD;GACH,GAAGD;GACH,GAAGH;GACH,GAAGH,yBAAyBS,mBAAmB;GAC/C,GAAGP,gBAAe;GACnB;AACDU,kBAAgBE;;AAElB,QAAOH;;;AAIT,MAAaI,SAAiBX,WAAWS,UAAU"}

package/dist/tokens/base.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 //#region src/tokens/base.ts
 /**
 * Base design system tokens.

package/dist/tokens/base.js.map

@@ -1 +1 @@
-{"version":3,"file":"base.js","names":[],"sources":["../../src/tokens/base.ts"],"sourcesContent":["import type { Styles } from '@tenphi/tasty';\n\n/**\n * Base design system tokens.\n * These define the fundamental units and values used throughout the system.\n *\n * Keys use $ prefix for CSS custom properties.\n */\nexport const BASE_TOKENS: Styles = {\n  // Typography base\n  /** @deprecated Use preset tokens instead */\n  '$font-size': '14px',\n  /** @deprecated Use preset tokens instead */\n  '$line-height': '20px',\n\n  // Input typography\n  '$input-font-size': '14px',\n  '$input-line-height': '20px',\n  '$input-letter-spacing': '0.02em',\n\n  // Opacity & dimensions\n  /** Opacity for disabled elements */\n  '$disabled-opacity': '.4',\n  /** Base gap unit for spacing (used with `.5x`, `1x`, `2x` etc.) */\n  $gap: '8px',\n  /** Stroke width for icons */\n  '$stroke-width': 1.5,\n  /** Focus outline width */\n  '$outline-width': 'calc(1rem / 16 * 3)',\n  /** Border width for bordered elements */\n  '$border-width': '1px',\n\n  // Border radius\n  /** Base border radius (used with `1r`, `2r` etc.) */\n  $radius: '6px',\n  /** Larger radius using tasty calc: 1r + 0.5x */\n  '$large-radius': '(1r + .5x)',\n  /** Card border radius */\n  '$card-radius': '(1r + .5x)',\n  /** Sharp corner for leaf shapes */\n  '$sharp-radius': '0px',\n\n  // Misc dimensions\n  /**\n   * Minimum dialog width (responsive).\n   *\n   * The viewport term must match the `100dvw - 8x` max-width that `Dialog`,\n   * `Modal` and `Tray` set, because CSS resolves `min-width` *after*\n   * `max-width`: if this floor can exceed that ceiling, the floor wins and the\n   * dialog overflows its own viewport. It did, below ~352px — an Excel/Sheets\n   * task pane is 300-350px, so every dialog there rendered 288px wide inside a\n   * 236px box.\n   */\n  '$min-dialog-size': 'min(288px, calc(100dvw - (8 * var(--gap))))',\n\n  // Transitions\n  /** Default transition duration */\n  $transition: '80ms',\n  /** Transition for disclosure animations */\n  '$disclosure-transition': '120ms',\n  /** Transition for tab animations */\n  '$tab-transition': '120ms',\n  /** Transition for fade animations */\n  '$fade-transition': '200ms',\n\n  /**\n   * Marks an element as carrying the token block. Not a design value — nothing\n   * styles against it.\n   *\n   * `resolveTokenValue()` reads it to answer the one question a computed value\n   * cannot: \"are the kit's tokens in effect here?\" Tasty registers `@property`\n   * defaults with real initial values — `--gap` is `4px` off the block, not\n   * `0px` — so a token read from outside `<Root>` comes back plausible and\n   * wrong, and no amount of inspecting the value would reveal it. This is\n   * declared alongside the tokens, so it is present exactly where they are.\n   */\n  '$tokens-applied': '1',\n\n  // Scrollbar tokens\n  '$scrollbar-width': '1.5x',\n  '$scrollbar-outline-width': '1ow',\n  '$scrollbar-radius': '1.5r',\n  '#scrollbar-thumb': '#text.5',\n  '#scrollbar-outline': '#clear',\n  '#scrollbar-bg': '#surface-2',\n  '#scrollbar-corner': '#clear',\n};\n"],"mappings":";;;;;;;;AAQA,MAAa,cAAsB;CAGjC,cAAc;CAEd,gBAAgB;CAGhB,oBAAoB;CACpB,sBAAsB;CACtB,yBAAyB;CAIzB,qBAAqB;CAErB,MAAM;CAEN,iBAAiB;CAEjB,kBAAkB;CAElB,iBAAiB;CAIjB,SAAS;CAET,iBAAiB;CAEjB,gBAAgB;CAEhB,iBAAiB;CAajB,oBAAoB;CAIpB,aAAa;CAEb,0BAA0B;CAE1B,mBAAmB;CAEnB,oBAAoB;CAapB,mBAAmB;CAGnB,oBAAoB;CACpB,4BAA4B;CAC5B,qBAAqB;CACrB,oBAAoB;CACpB,sBAAsB;CACtB,iBAAiB;CACjB,qBAAqB;CACtB"}
+{"version":3,"file":"base.js","names":["Styles","BASE_TOKENS","$gap","$radius","$transition"],"sources":["../../src/tokens/base.ts"],"sourcesContent":["import type { Styles } from '@tenphi/tasty';\n\n/**\n * Base design system tokens.\n * These define the fundamental units and values used throughout the system.\n *\n * Keys use $ prefix for CSS custom properties.\n */\nexport const BASE_TOKENS: Styles = {\n  // Typography base\n  /** @deprecated Use preset tokens instead */\n  '$font-size': '14px',\n  /** @deprecated Use preset tokens instead */\n  '$line-height': '20px',\n\n  // Input typography\n  '$input-font-size': '14px',\n  '$input-line-height': '20px',\n  '$input-letter-spacing': '0.02em',\n\n  // Opacity & dimensions\n  /** Opacity for disabled elements */\n  '$disabled-opacity': '.4',\n  /** Base gap unit for spacing (used with `.5x`, `1x`, `2x` etc.) */\n  $gap: '8px',\n  /** Stroke width for icons */\n  '$stroke-width': 1.5,\n  /** Focus outline width */\n  '$outline-width': 'calc(1rem / 16 * 3)',\n  /** Border width for bordered elements */\n  '$border-width': '1px',\n\n  // Border radius\n  /** Base border radius (used with `1r`, `2r` etc.) */\n  $radius: '6px',\n  /** Larger radius using tasty calc: 1r + 0.5x */\n  '$large-radius': '(1r + .5x)',\n  /** Card border radius */\n  '$card-radius': '(1r + .5x)',\n  /** Sharp corner for leaf shapes */\n  '$sharp-radius': '0px',\n\n  // Misc dimensions\n  /**\n   * Minimum dialog width (responsive).\n   *\n   * The viewport term must match the `100dvw - 8x` max-width that `Dialog`,\n   * `Modal` and `Tray` set, because CSS resolves `min-width` *after*\n   * `max-width`: if this floor can exceed that ceiling, the floor wins and the\n   * dialog overflows its own viewport. It did, below ~352px — an Excel/Sheets\n   * task pane is 300-350px, so every dialog there rendered 288px wide inside a\n   * 236px box.\n   */\n  '$min-dialog-size': 'min(288px, calc(100dvw - (8 * var(--gap))))',\n\n  // Transitions\n  /** Default transition duration */\n  $transition: '80ms',\n  /** Transition for disclosure animations */\n  '$disclosure-transition': '120ms',\n  /** Transition for tab animations */\n  '$tab-transition': '120ms',\n  /** Transition for fade animations */\n  '$fade-transition': '200ms',\n\n  /**\n   * Marks an element as carrying the token block. Not a design value — nothing\n   * styles against it.\n   *\n   * `resolveTokenValue()` reads it to answer the one question a computed value\n   * cannot: \"are the kit's tokens in effect here?\" Tasty registers `@property`\n   * defaults with real initial values — `--gap` is `4px` off the block, not\n   * `0px` — so a token read from outside `<Root>` comes back plausible and\n   * wrong, and no amount of inspecting the value would reveal it. This is\n   * declared alongside the tokens, so it is present exactly where they are.\n   */\n  '$tokens-applied': '1',\n\n  // Scrollbar tokens\n  '$scrollbar-width': '1.5x',\n  '$scrollbar-outline-width': '1ow',\n  '$scrollbar-radius': '1.5r',\n  '#scrollbar-thumb': '#text.5',\n  '#scrollbar-outline': '#clear',\n  '#scrollbar-bg': '#surface-2',\n  '#scrollbar-corner': '#clear',\n};\n"],"mappings":";;;;;;;;AAQA,MAAaC,cAAsB;CAGjC,cAAc;CAEd,gBAAgB;CAGhB,oBAAoB;CACpB,sBAAsB;CACtB,yBAAyB;CAIzB,qBAAqB;CAErBC,MAAM;CAEN,iBAAiB;CAEjB,kBAAkB;CAElB,iBAAiB;CAIjBC,SAAS;CAET,iBAAiB;CAEjB,gBAAgB;CAEhB,iBAAiB;CAajB,oBAAoB;CAIpBC,aAAa;CAEb,0BAA0B;CAE1B,mBAAmB;CAEnB,oBAAoB;CAapB,mBAAmB;CAGnB,oBAAoB;CACpB,4BAA4B;CAC5B,qBAAqB;CACrB,oBAAoB;CACpB,sBAAsB;CACtB,iBAAiB;CACjB,qBAAqB;CACtB"}

package/dist/tokens/color-seed.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 import { glaze } from "@tenphi/glaze";
 
 //#region src/tokens/color-seed.ts

package/dist/tokens/color-seed.js.map

@@ -1 +1 @@
-{"version":3,"file":"color-seed.js","names":[],"sources":["../../src/tokens/color-seed.ts"],"sourcesContent":["import { glaze } from '@tenphi/glaze';\n\n/**\n * Turns a colour into the three numbers the palette is seeded from.\n *\n * A deliberate LEAF: it imports Glaze and nothing else. `./palette-config` reads it\n * from inside `resolveConfig`, and `./palette-config` is the one module the token\n * graph is not allowed to have a cycle through — so anything this file imported\n * would become a `palette-config` dependency too. Glaze has no edge back into the\n * token modules, so it is safe; `./palette` (which owns `TINT_RECIPE` and the global\n * `glaze.configure`) is not.\n *\n * There is no ordering hazard either, even though `./palette` runs\n * `glaze.configure()` at module scope and this file may be called before that\n * happens. A bare-string colour token defaults to `lightTone: false`, so its light\n * variant preserves the input tone exactly and its hue and saturation come straight\n * off the parse — all three readings are independent of the global config.\n */\n\n/** Hue, saturation and tone read off a colour, on the palette's own scales. */\nexport interface ColorSeed {\n  /** 0–360. */\n  hue: number;\n  /** 0–100 — the palette's seed scale, not Glaze's 0–1 factor. */\n  saturation: number;\n  /** 0–100 on the OKHST tone axis. */\n  tone: number;\n}\n\n/**\n * A colour picker being dragged emits a distinct string per frame, and\n * `resolveConfig` runs on every `setPaletteConfig` *and* every\n * `resolvePaletteConfig` preview. One resolve is only ~3µs, so this is insurance\n * against a drag rather than a hot path — hence a cap and a clear rather than an\n * LRU.\n */\nconst CACHE_LIMIT = 256;\nconst cache = new Map<string, ColorSeed | null>();\n\n/**\n * Read a colour's hue, saturation and tone.\n *\n * Accepts anything Glaze parses — hex, `rgb()`, `hsl()`, `okhsl()`, `okhst()`,\n * `oklch()`. CSS colour keywords (`rebeccapurple`) are **not** supported.\n *\n * Returns `null` on anything unparseable, having warned once, so a caller can fall\n * back to its numeric seed instead of throwing on a typo in a settings field.\n *\n * ```ts\n * colorSeed('#0ea5e9'); // → { hue: 237.32, saturation: 98.19, tone: 65.78 }\n * ```\n */\nexport function colorSeed(value: string): ColorSeed | null {\n  const cached = cache.get(value);\n\n  // `null` is a cached FAILURE, not a miss — which is also what dedupes the\n  // warning, so a bad value in a re-rendered config does not fill the console.\n  if (cached !== undefined) return cached;\n\n  let seed: ColorSeed | null = null;\n\n  try {\n    const { h, s, t } = glaze.color(value).resolve().light;\n\n    // Glaze reports saturation and tone as 0–1 factors; the palette's are 0–100.\n    seed = { hue: h, saturation: s * 100, tone: t * 100 };\n  } catch {\n    console.warn(\n      `[cube-ui-kit] could not parse palette colour ${JSON.stringify(value)}; ` +\n        `keeping the numeric seed. Accepted: hex, rgb(), hsl(), okhsl(), okhst(), ` +\n        `oklch() — CSS colour keywords are not supported.`,\n    );\n  }\n\n  if (cache.size >= CACHE_LIMIT) cache.clear();\n  cache.set(value, seed);\n\n  return seed;\n}\n"],"mappings":";;;;;;;;;;;AAoCA,MAAM,cAAc;AACpB,MAAM,wBAAQ,IAAI,KAA+B;;;;;;;;;;;;;;AAejD,SAAgB,UAAU,OAAiC;CACzD,MAAM,SAAS,MAAM,IAAI,MAAM;AAI/B,KAAI,WAAW,OAAW,QAAO;CAEjC,IAAI,OAAyB;AAE7B,KAAI;EACF,MAAM,EAAE,GAAG,GAAG,MAAM,MAAM,MAAM,MAAM,CAAC,SAAS,CAAC;AAGjD,SAAO;GAAE,KAAK;GAAG,YAAY,IAAI;GAAK,MAAM,IAAI;GAAK;SAC/C;AACN,UAAQ,KACN,gDAAgD,KAAK,UAAU,MAAM,CAAC,6HAGvE;;AAGH,KAAI,MAAM,QAAQ,YAAa,OAAM,OAAO;AAC5C,OAAM,IAAI,OAAO,KAAK;AAEtB,QAAO"}
+{"version":3,"file":"color-seed.js","names":["glaze","ColorSeed","hue","saturation","tone","CACHE_LIMIT","cache","Map","colorSeed","value","cached","get","undefined","seed","h","s","t","color","resolve","light","console","warn","JSON","stringify","size","clear","set"],"sources":["../../src/tokens/color-seed.ts"],"sourcesContent":["import { glaze } from '@tenphi/glaze';\n\n/**\n * Turns a colour into the three numbers the palette is seeded from.\n *\n * A deliberate LEAF: it imports Glaze and nothing else. `./palette-config` reads it\n * from inside `resolveConfig`, and `./palette-config` is the one module the token\n * graph is not allowed to have a cycle through — so anything this file imported\n * would become a `palette-config` dependency too. Glaze has no edge back into the\n * token modules, so it is safe; `./palette` (which owns `TINT_RECIPE` and the global\n * `glaze.configure`) is not.\n *\n * There is no ordering hazard either, even though `./palette` runs\n * `glaze.configure()` at module scope and this file may be called before that\n * happens. A bare-string colour token defaults to `lightTone: false`, so its light\n * variant preserves the input tone exactly and its hue and saturation come straight\n * off the parse — all three readings are independent of the global config.\n */\n\n/** Hue, saturation and tone read off a colour, on the palette's own scales. */\nexport interface ColorSeed {\n  /** 0–360. */\n  hue: number;\n  /** 0–100 — the palette's seed scale, not Glaze's 0–1 factor. */\n  saturation: number;\n  /** 0–100 on the OKHST tone axis. */\n  tone: number;\n}\n\n/**\n * A colour picker being dragged emits a distinct string per frame, and\n * `resolveConfig` runs on every `setPaletteConfig` *and* every\n * `resolvePaletteConfig` preview. One resolve is only ~3µs, so this is insurance\n * against a drag rather than a hot path — hence a cap and a clear rather than an\n * LRU.\n */\nconst CACHE_LIMIT = 256;\nconst cache = new Map<string, ColorSeed | null>();\n\n/**\n * Read a colour's hue, saturation and tone.\n *\n * Accepts anything Glaze parses — hex, `rgb()`, `hsl()`, `okhsl()`, `okhst()`,\n * `oklch()`. CSS colour keywords (`rebeccapurple`) are **not** supported.\n *\n * Returns `null` on anything unparseable, having warned once, so a caller can fall\n * back to its numeric seed instead of throwing on a typo in a settings field.\n *\n * ```ts\n * colorSeed('#0ea5e9'); // → { hue: 237.32, saturation: 98.19, tone: 65.78 }\n * ```\n */\nexport function colorSeed(value: string): ColorSeed | null {\n  const cached = cache.get(value);\n\n  // `null` is a cached FAILURE, not a miss — which is also what dedupes the\n  // warning, so a bad value in a re-rendered config does not fill the console.\n  if (cached !== undefined) return cached;\n\n  let seed: ColorSeed | null = null;\n\n  try {\n    const { h, s, t } = glaze.color(value).resolve().light;\n\n    // Glaze reports saturation and tone as 0–1 factors; the palette's are 0–100.\n    seed = { hue: h, saturation: s * 100, tone: t * 100 };\n  } catch {\n    console.warn(\n      `[cube-ui-kit] could not parse palette colour ${JSON.stringify(value)}; ` +\n        `keeping the numeric seed. Accepted: hex, rgb(), hsl(), okhsl(), okhst(), ` +\n        `oklch() — CSS colour keywords are not supported.`,\n    );\n  }\n\n  if (cache.size >= CACHE_LIMIT) cache.clear();\n  cache.set(value, seed);\n\n  return seed;\n}\n"],"mappings":";;;;;;;;;;;AAoCA,MAAMK,cAAc;AACpB,MAAMC,wBAAQ,IAAIC,KAA+B;;;;;;;;;;;;;;AAejD,SAAgBC,UAAUC,OAAiC;CACzD,MAAMC,SAASJ,MAAMK,IAAIF,MAAM;AAI/B,KAAIC,WAAWE,OAAW,QAAOF;CAEjC,IAAIG,OAAyB;AAE7B,KAAI;EACF,MAAM,EAAEC,GAAGC,GAAGC,MAAMhB,MAAMiB,MAAMR,MAAM,CAACS,SAAS,CAACC;AAGjDN,SAAO;GAAEX,KAAKY;GAAGX,YAAYY,IAAI;GAAKX,MAAMY,IAAI;GAAK;SAC/C;AACNI,UAAQC,KACN,gDAAgDC,KAAKC,UAAUd,MAAM,CAAA,6HAGtE;;AAGH,KAAIH,MAAMkB,QAAQnB,YAAaC,OAAMmB,OAAO;AAC5CnB,OAAMoB,IAAIjB,OAAOI,KAAK;AAEtB,QAAOA"}

package/dist/tokens/color-theme.js

@@ -1,7 +1,8 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 import { colorSeed } from "./color-seed.js";
 import { DEFAULT_HUE, DEFAULT_SATURATION, getPaletteConfig, getPaletteVersion, usePaletteVersion } from "./palette-config.js";
 import { tintRecipe } from "./palette.js";
+import { c } from "react-compiler-runtime";
 import { useGlobalStyles } from "@tenphi/tasty";
 import { glaze } from "@tenphi/glaze";
 
@@ -158,9 +159,23 @@ function getColorTheme(config) {
 * ```
 */
 function useColorTheme(config) {
+	const $ = c(4);
 	usePaletteVersion();
-	const theme = getColorTheme(config);
-	useGlobalStyles("body", theme.tokens, { id: `cube-color-theme-${theme.name}` });
+	let t0;
+	if ($[0] !== config) {
+		t0 = getColorTheme(config);
+		$[0] = config;
+		$[1] = t0;
+	} else t0 = $[1];
+	const theme = t0;
+	const t1 = `cube-color-theme-${theme.name}`;
+	let t2;
+	if ($[2] !== t1) {
+		t2 = { id: t1 };
+		$[2] = t1;
+		$[3] = t2;
+	} else t2 = $[3];
+	useGlobalStyles("body", theme.tokens, t2);
 	return theme;
 }
 

package/dist/tokens/color-theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"color-theme.js","names":[],"sources":["../../src/tokens/color-theme.ts"],"sourcesContent":["import { glaze } from '@tenphi/glaze';\nimport { useGlobalStyles } from '@tenphi/tasty';\n\n// Imported for its SIDE EFFECT as much as for `tintRecipe`.\n//\n// `palette.ts` runs `glaze.configure({ states: { dark: '@dark', highContrast:\n// '@hc' }, modes: …, darkTone: … })` at module scope, and that global config is\n// what makes a theme emit `'@dark'` / `'@hc'` keys at all. Without this import\n// a runtime theme falls back to Glaze's defaults — `@media(prefers-color-scheme:\n// dark)` keys and NO high-contrast tier — which still renders, so the failure is\n// silent. `color-theme.test.ts` asserts the `'@hc'` key exists to catch it.\nimport { colorSeed } from './color-seed';\nimport { tintRecipe } from './palette';\nimport {\n  DEFAULT_HUE,\n  DEFAULT_SATURATION,\n  getPaletteConfig,\n  getPaletteVersion,\n  usePaletteVersion,\n} from './palette-config';\n\nimport type { ColorMap, GlazeConfigOverride } from '@tenphi/glaze';\nimport type { Styles } from '@tenphi/tasty';\n\nexport interface ColorThemeConfig {\n  /**\n   * A hue in 0–360, or any colour Glaze parses — hex, `rgb()`, `hsl()`,\n   * `okhsl()`, `okhst()`, `oklch()`.\n   *\n   * From a colour only the HUE and SATURATION are taken; the lightness is\n   * discarded and re-derived per scheme. That is what makes the result adaptive\n   * rather than a value that happens to work in one theme.\n   */\n  hue: number | string;\n  /** 0–100. @default the palette's own saturation seed */\n  saturation?: number;\n  pastel?: boolean;\n  /**\n   * Extra colour definitions, merged over {@link tintRecipe}. Anything Glaze's\n   * `theme.colors()` accepts, including `contrast` floors against a sibling.\n   */\n  colors?: ColorMap;\n}\n\nexport interface ColorTheme {\n  /**\n   * A hash of the config, and the token prefix — `'tint-1a2b3c'`.\n   *\n   * Content-addressed rather than positional so two components asking for the\n   * same colour name the same theme, and therefore share one injection. Also\n   * makes it safe to stamp on the DOM as an identifier.\n   */\n  name: string;\n  /**\n   * Tasty token declarations, one state map per colour:\n   * `{ '#tint-1a2b3c-surface': { '': …, '@dark': …, '@hc': …, '@dark & @hc': … } }`\n   */\n  tokens: Styles;\n  /** Token references by their unprefixed name — `{ surface: '#tint-1a2b3c-surface' }`. */\n  colors: Record<string, string>;\n}\n\n/**\n * FNV-1a, base36. Short, stable and dependency-free.\n *\n * These hashes name CSS custom properties and land in DOM attributes, so they\n * have to be deterministic across processes (SSR and the client must agree) and\n * safe as identifiers — but not cryptographic.\n */\nexport function hashString(input: string): string {\n  let hash = 0x811c9dc5;\n\n  for (let i = 0; i < input.length; i++) {\n    hash ^= input.charCodeAt(i);\n    // >>> 0 keeps it an unsigned 32-bit int; `Math.imul` is the 32-bit multiply.\n    hash = Math.imul(hash, 0x01000193) >>> 0;\n  }\n\n  return hash.toString(36);\n}\n\n/**\n * Hashes the RESOLVED seed, not the config as written.\n *\n * `{ hue: '#0ea5e9' }` and `{ hue: 237.32, saturation: 98.19 }` are the same\n * colour said two ways; hashing the input would give them two names, two\n * injections and two sets of generated rules. Rounded, because a seed that\n * differs in the twelfth decimal is the same colour to every eye and every\n * renderer — and an unrounded float would defeat the deduplication it is here to\n * provide.\n */\nfunction hashSeed(seed: ResolvedSeed): string {\n  return `tint-${hashString(\n    JSON.stringify([\n      seed.hue.toFixed(4),\n      seed.saturation.toFixed(4),\n      seed.pastel,\n      seed.colors ? stableStringify(seed.colors) : null,\n    ]),\n  )}`;\n}\n\ninterface ResolvedSeed {\n  hue: number;\n  saturation: number;\n  pastel: boolean;\n  colors?: ColorMap;\n}\n\n/** Key order must not change the hash, or two identical configs get two slots. */\nfunction stableStringify(value: unknown): string {\n  if (value === null || typeof value !== 'object') return JSON.stringify(value);\n\n  if (Array.isArray(value)) {\n    return `[${value.map(stableStringify).join(',')}]`;\n  }\n\n  const entries = Object.entries(value as Record<string, unknown>).sort(\n    ([a], [b]) => (a < b ? -1 : a > b ? 1 : 0),\n  );\n\n  return `{${entries\n    .map(([key, item]) => `${JSON.stringify(key)}:${stableStringify(item)}`)\n    .join(',')}}`;\n}\n\n/**\n * The hue and saturation of a colour, for use as a theme seed.\n *\n * ```ts\n * colorThemeSeed('#0ea5e9'); // → { hue: 237.32, saturation: 98.19 }\n * ```\n *\n * The tone {@link colorSeed} also reads is dropped here on purpose: a tint theme\n * re-derives its lightness per scheme, which is what makes it adaptive. The palette's\n * The palette's accent zone keeps the tone, because a brand fill has to *be* the\n * colour.\n *\n * An unparseable value falls back to the shipped seed rather than throwing — a hue\n * typed into a settings field should not take the render down.\n */\nexport function colorThemeSeed(value: string): {\n  hue: number;\n  saturation: number;\n} {\n  const seed = colorSeed(value);\n\n  if (!seed) return { hue: DEFAULT_HUE, saturation: DEFAULT_SATURATION };\n\n  return { hue: seed.hue, saturation: seed.saturation };\n}\n\n/**\n * Cached by `${paletteVersion}:${name}`.\n *\n * The palette version is in the KEY rather than triggering a clear, so a stale\n * entry is simply unreachable. `lastVersion` still clears the map on a change,\n * or repeated `setPaletteConfig` calls would grow it without bound.\n */\nconst cache = new Map<string, ColorTheme>();\nlet lastVersion = -1;\n\n/**\n * Build (or reuse) an adaptive theme from a hue.\n *\n * Pure and memoized: the same config returns the same object identity until the\n * palette is re-seeded. Registering the tokens is {@link useColorTheme}'s job —\n * this only computes them, so it is safe to call while rendering or from a test.\n */\nexport function getColorTheme(config: ColorThemeConfig): ColorTheme {\n  const version = getPaletteVersion();\n\n  if (version !== lastVersion) {\n    cache.clear();\n    lastVersion = version;\n  }\n\n  const paletteConfig = getPaletteConfig();\n  const parsed =\n    typeof config.hue === 'string' ? colorThemeSeed(config.hue) : null;\n  const seed: ResolvedSeed = {\n    hue: parsed ? parsed.hue : (config.hue as number),\n    saturation:\n      config.saturation ??\n      parsed?.saturation ??\n      paletteConfig.saturation ??\n      DEFAULT_SATURATION,\n    pastel: config.pastel ?? paletteConfig.pastel ?? false,\n    colors: config.colors,\n  };\n\n  const name = hashSeed(seed);\n  const cached = cache.get(name);\n\n  if (cached) return cached;\n\n  const { hue, saturation } = seed;\n\n  // `pastel` and `contrastLevel` are instance-level in Glaze, not settable\n  // through `glaze.configure`, so a runtime theme has to carry them itself or it\n  // would ignore a pastel palette. Omitted entirely when off, so the default\n  // output is provably the same as passing nothing.\n  const overrides: GlazeConfigOverride = {\n    ...(paletteConfig.contrastLevel != null\n      ? { contrastLevel: paletteConfig.contrastLevel }\n      : null),\n    ...(seed.pastel ? { pastel: true } : null),\n  };\n\n  const theme = glaze(\n    hue,\n    saturation,\n    Object.keys(overrides).length ? overrides : undefined,\n  );\n\n  // The recipe follows the palette's `surfaceMode`, so a runtime tint sits the same\n  // distance off the page as a built-in status theme does. Safe to read here rather\n  // than hash into the seed: the cache is cleared on every palette version change,\n  // and `surfaceMode` is one of the fields that bumps it.\n  theme.colors({ ...tintRecipe(paletteConfig), ...config.colors });\n\n  // `prefix` is a palette-only option, so the keys are renamed here. `oklch`\n  // because that is what the palette emits; tasty converts to the configured\n  // colour space on the way out either way.\n  const raw = theme.tasty({ format: 'oklch' }) as Record<string, unknown>;\n  const tokens: Styles = {};\n  const colors: Record<string, string> = {};\n\n  for (const [key, value] of Object.entries(raw)) {\n    // Only the `#colour` entries are renamed; `splitHue` is off, so there are no\n    // `$…-hue` companions to worry about, but a future one must not be mangled.\n    if (!key.startsWith('#')) {\n      (tokens as Record<string, unknown>)[key] = value;\n      continue;\n    }\n\n    const bare = key.slice(1);\n    const token = `#${name}-${bare}`;\n\n    (tokens as Record<string, unknown>)[token] = value;\n    colors[bare] = token;\n  }\n\n  const result: ColorTheme = { name, tokens, colors };\n\n  cache.set(name, result);\n\n  return result;\n}\n\n/**\n * Register an adaptive theme's tokens once per document, and get it back.\n *\n * The tokens land on `body` under a slot keyed by the theme's name, which is a\n * hash of the config — so every component asking for the same colour shares one\n * injection no matter how many of them there are. Tasty's global-style slots are\n * also permanent, which is what makes that safe: one component unmounting cannot\n * strip tokens another is still referencing.\n *\n * `body` rather than `:root`, which emits nothing at all — the same selector\n * `GlobalStyles` uses for the palette's own tokens. Custom properties inherit, so\n * anything rendered inside the document sees them; the one thing this cannot\n * reach is content portalled outside `<body>`, which nothing does.\n *\n * Because the slot id hashes the CONFIG rather than the resolved values,\n * re-seeding the palette replaces the same slot instead of leaking a new one.\n *\n * ```tsx\n * const theme = useColorTheme({ hue: '#0ea5e9' });\n * // theme.colors.surface → '#tint-1a2b3c-surface'\n * ```\n */\nexport function useColorTheme(config: ColorThemeConfig): ColorTheme {\n  // Subscribes this component to a re-seed. `getColorTheme` reads the version\n  // itself for its cache, so the value is unused here — the subscription is the\n  // point, and it is what makes the tokens below re-inject.\n  usePaletteVersion();\n\n  const theme = getColorTheme(config);\n\n  useGlobalStyles('body', theme.tokens, {\n    id: `cube-color-theme-${theme.name}`,\n  });\n\n  return theme;\n}\n"],"mappings":"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"}
+{"version":3,"file":"color-theme.js","names":["glaze","useGlobalStyles","colorSeed","tintRecipe","DEFAULT_HUE","DEFAULT_SATURATION","getPaletteConfig","getPaletteVersion","usePaletteVersion","ColorMap","GlazeConfigOverride","Styles","ColorThemeConfig","hue","saturation","pastel","colors","ColorTheme","name","tokens","Record","hashString","input","hash","i","length","charCodeAt","Math","imul","toString","hashSeed","seed","ResolvedSeed","JSON","stringify","toFixed","stableStringify","value","Array","isArray","map","join","entries","Object","sort","a","b","key","item","colorThemeSeed","cache","Map","lastVersion","getColorTheme","config","version","clear","paletteConfig","parsed","cached","get","overrides","contrastLevel","theme","keys","undefined","raw","tasty","format","startsWith","bare","slice","token","result","set","useColorTheme","$","_c","t0","t1","t2","id"],"sources":["../../src/tokens/color-theme.ts"],"sourcesContent":["import { glaze } from '@tenphi/glaze';\nimport { useGlobalStyles } from '@tenphi/tasty';\n\n// Imported for its SIDE EFFECT as much as for `tintRecipe`.\n//\n// `palette.ts` runs `glaze.configure({ states: { dark: '@dark', highContrast:\n// '@hc' }, modes: …, darkTone: … })` at module scope, and that global config is\n// what makes a theme emit `'@dark'` / `'@hc'` keys at all. Without this import\n// a runtime theme falls back to Glaze's defaults — `@media(prefers-color-scheme:\n// dark)` keys and NO high-contrast tier — which still renders, so the failure is\n// silent. `color-theme.test.ts` asserts the `'@hc'` key exists to catch it.\nimport { colorSeed } from './color-seed';\nimport { tintRecipe } from './palette';\nimport {\n  DEFAULT_HUE,\n  DEFAULT_SATURATION,\n  getPaletteConfig,\n  getPaletteVersion,\n  usePaletteVersion,\n} from './palette-config';\n\nimport type { ColorMap, GlazeConfigOverride } from '@tenphi/glaze';\nimport type { Styles } from '@tenphi/tasty';\n\nexport interface ColorThemeConfig {\n  /**\n   * A hue in 0–360, or any colour Glaze parses — hex, `rgb()`, `hsl()`,\n   * `okhsl()`, `okhst()`, `oklch()`.\n   *\n   * From a colour only the HUE and SATURATION are taken; the lightness is\n   * discarded and re-derived per scheme. That is what makes the result adaptive\n   * rather than a value that happens to work in one theme.\n   */\n  hue: number | string;\n  /** 0–100. @default the palette's own saturation seed */\n  saturation?: number;\n  pastel?: boolean;\n  /**\n   * Extra colour definitions, merged over {@link tintRecipe}. Anything Glaze's\n   * `theme.colors()` accepts, including `contrast` floors against a sibling.\n   */\n  colors?: ColorMap;\n}\n\nexport interface ColorTheme {\n  /**\n   * A hash of the config, and the token prefix — `'tint-1a2b3c'`.\n   *\n   * Content-addressed rather than positional so two components asking for the\n   * same colour name the same theme, and therefore share one injection. Also\n   * makes it safe to stamp on the DOM as an identifier.\n   */\n  name: string;\n  /**\n   * Tasty token declarations, one state map per colour:\n   * `{ '#tint-1a2b3c-surface': { '': …, '@dark': …, '@hc': …, '@dark & @hc': … } }`\n   */\n  tokens: Styles;\n  /** Token references by their unprefixed name — `{ surface: '#tint-1a2b3c-surface' }`. */\n  colors: Record<string, string>;\n}\n\n/**\n * FNV-1a, base36. Short, stable and dependency-free.\n *\n * These hashes name CSS custom properties and land in DOM attributes, so they\n * have to be deterministic across processes (SSR and the client must agree) and\n * safe as identifiers — but not cryptographic.\n */\nexport function hashString(input: string): string {\n  let hash = 0x811c9dc5;\n\n  for (let i = 0; i < input.length; i++) {\n    hash ^= input.charCodeAt(i);\n    // >>> 0 keeps it an unsigned 32-bit int; `Math.imul` is the 32-bit multiply.\n    hash = Math.imul(hash, 0x01000193) >>> 0;\n  }\n\n  return hash.toString(36);\n}\n\n/**\n * Hashes the RESOLVED seed, not the config as written.\n *\n * `{ hue: '#0ea5e9' }` and `{ hue: 237.32, saturation: 98.19 }` are the same\n * colour said two ways; hashing the input would give them two names, two\n * injections and two sets of generated rules. Rounded, because a seed that\n * differs in the twelfth decimal is the same colour to every eye and every\n * renderer — and an unrounded float would defeat the deduplication it is here to\n * provide.\n */\nfunction hashSeed(seed: ResolvedSeed): string {\n  return `tint-${hashString(\n    JSON.stringify([\n      seed.hue.toFixed(4),\n      seed.saturation.toFixed(4),\n      seed.pastel,\n      seed.colors ? stableStringify(seed.colors) : null,\n    ]),\n  )}`;\n}\n\ninterface ResolvedSeed {\n  hue: number;\n  saturation: number;\n  pastel: boolean;\n  colors?: ColorMap;\n}\n\n/** Key order must not change the hash, or two identical configs get two slots. */\nfunction stableStringify(value: unknown): string {\n  if (value === null || typeof value !== 'object') return JSON.stringify(value);\n\n  if (Array.isArray(value)) {\n    return `[${value.map(stableStringify).join(',')}]`;\n  }\n\n  const entries = Object.entries(value as Record<string, unknown>).sort(\n    ([a], [b]) => (a < b ? -1 : a > b ? 1 : 0),\n  );\n\n  return `{${entries\n    .map(([key, item]) => `${JSON.stringify(key)}:${stableStringify(item)}`)\n    .join(',')}}`;\n}\n\n/**\n * The hue and saturation of a colour, for use as a theme seed.\n *\n * ```ts\n * colorThemeSeed('#0ea5e9'); // → { hue: 237.32, saturation: 98.19 }\n * ```\n *\n * The tone {@link colorSeed} also reads is dropped here on purpose: a tint theme\n * re-derives its lightness per scheme, which is what makes it adaptive. The palette's\n * The palette's accent zone keeps the tone, because a brand fill has to *be* the\n * colour.\n *\n * An unparseable value falls back to the shipped seed rather than throwing — a hue\n * typed into a settings field should not take the render down.\n */\nexport function colorThemeSeed(value: string): {\n  hue: number;\n  saturation: number;\n} {\n  const seed = colorSeed(value);\n\n  if (!seed) return { hue: DEFAULT_HUE, saturation: DEFAULT_SATURATION };\n\n  return { hue: seed.hue, saturation: seed.saturation };\n}\n\n/**\n * Cached by `${paletteVersion}:${name}`.\n *\n * The palette version is in the KEY rather than triggering a clear, so a stale\n * entry is simply unreachable. `lastVersion` still clears the map on a change,\n * or repeated `setPaletteConfig` calls would grow it without bound.\n */\nconst cache = new Map<string, ColorTheme>();\nlet lastVersion = -1;\n\n/**\n * Build (or reuse) an adaptive theme from a hue.\n *\n * Pure and memoized: the same config returns the same object identity until the\n * palette is re-seeded. Registering the tokens is {@link useColorTheme}'s job —\n * this only computes them, so it is safe to call while rendering or from a test.\n */\nexport function getColorTheme(config: ColorThemeConfig): ColorTheme {\n  const version = getPaletteVersion();\n\n  if (version !== lastVersion) {\n    cache.clear();\n    lastVersion = version;\n  }\n\n  const paletteConfig = getPaletteConfig();\n  const parsed =\n    typeof config.hue === 'string' ? colorThemeSeed(config.hue) : null;\n  const seed: ResolvedSeed = {\n    hue: parsed ? parsed.hue : (config.hue as number),\n    saturation:\n      config.saturation ??\n      parsed?.saturation ??\n      paletteConfig.saturation ??\n      DEFAULT_SATURATION,\n    pastel: config.pastel ?? paletteConfig.pastel ?? false,\n    colors: config.colors,\n  };\n\n  const name = hashSeed(seed);\n  const cached = cache.get(name);\n\n  if (cached) return cached;\n\n  const { hue, saturation } = seed;\n\n  // `pastel` and `contrastLevel` are instance-level in Glaze, not settable\n  // through `glaze.configure`, so a runtime theme has to carry them itself or it\n  // would ignore a pastel palette. Omitted entirely when off, so the default\n  // output is provably the same as passing nothing.\n  const overrides: GlazeConfigOverride = {\n    ...(paletteConfig.contrastLevel != null\n      ? { contrastLevel: paletteConfig.contrastLevel }\n      : null),\n    ...(seed.pastel ? { pastel: true } : null),\n  };\n\n  const theme = glaze(\n    hue,\n    saturation,\n    Object.keys(overrides).length ? overrides : undefined,\n  );\n\n  // The recipe follows the palette's `surfaceMode`, so a runtime tint sits the same\n  // distance off the page as a built-in status theme does. Safe to read here rather\n  // than hash into the seed: the cache is cleared on every palette version change,\n  // and `surfaceMode` is one of the fields that bumps it.\n  theme.colors({ ...tintRecipe(paletteConfig), ...config.colors });\n\n  // `prefix` is a palette-only option, so the keys are renamed here. `oklch`\n  // because that is what the palette emits; tasty converts to the configured\n  // colour space on the way out either way.\n  const raw = theme.tasty({ format: 'oklch' }) as Record<string, unknown>;\n  const tokens: Styles = {};\n  const colors: Record<string, string> = {};\n\n  for (const [key, value] of Object.entries(raw)) {\n    // Only the `#colour` entries are renamed; `splitHue` is off, so there are no\n    // `$…-hue` companions to worry about, but a future one must not be mangled.\n    if (!key.startsWith('#')) {\n      (tokens as Record<string, unknown>)[key] = value;\n      continue;\n    }\n\n    const bare = key.slice(1);\n    const token = `#${name}-${bare}`;\n\n    (tokens as Record<string, unknown>)[token] = value;\n    colors[bare] = token;\n  }\n\n  const result: ColorTheme = { name, tokens, colors };\n\n  cache.set(name, result);\n\n  return result;\n}\n\n/**\n * Register an adaptive theme's tokens once per document, and get it back.\n *\n * The tokens land on `body` under a slot keyed by the theme's name, which is a\n * hash of the config — so every component asking for the same colour shares one\n * injection no matter how many of them there are. Tasty's global-style slots are\n * also permanent, which is what makes that safe: one component unmounting cannot\n * strip tokens another is still referencing.\n *\n * `body` rather than `:root`, which emits nothing at all — the same selector\n * `GlobalStyles` uses for the palette's own tokens. Custom properties inherit, so\n * anything rendered inside the document sees them; the one thing this cannot\n * reach is content portalled outside `<body>`, which nothing does.\n *\n * Because the slot id hashes the CONFIG rather than the resolved values,\n * re-seeding the palette replaces the same slot instead of leaking a new one.\n *\n * ```tsx\n * const theme = useColorTheme({ hue: '#0ea5e9' });\n * // theme.colors.surface → '#tint-1a2b3c-surface'\n * ```\n */\nexport function useColorTheme(config: ColorThemeConfig): ColorTheme {\n  // Subscribes this component to a re-seed. `getColorTheme` reads the version\n  // itself for its cache, so the value is unused here — the subscription is the\n  // point, and it is what makes the tokens below re-inject.\n  usePaletteVersion();\n\n  const theme = getColorTheme(config);\n\n  useGlobalStyles('body', theme.tokens, {\n    id: `cube-color-theme-${theme.name}`,\n  });\n\n  return theme;\n}\n"],"mappings":"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"}

package/dist/tokens/colors.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 import { getPaletteVersion } from "./palette-config.js";
 import { BASE_TOKENS } from "./base.js";
 import { lazyStyles } from "./lazy-styles.js";

package/dist/tokens/colors.js.map

@@ -1 +1 @@
-{"version":3,"file":"colors.js","names":[],"sources":["../../src/tokens/colors.ts"],"sourcesContent":["import { BASE_TOKENS } from './base';\nimport { lazyStyles } from './lazy-styles';\nimport { getPaletteTokens, renderPaletteTokens } from './palette';\nimport { getPaletteVersion } from './palette-config';\nimport { SHADOW_TOKENS } from './shadows';\n\nimport type { Styles, Tokens } from '@tenphi/tasty';\nimport type { RenderPaletteOptions } from './palette';\n\n/**\n * Color tokens with `#` prefix for tasty color definitions.\n *\n * The base values come from the Glaze-generated palette (`palette.ts`):\n * `#surface`, `#surface-text*`, `#border`, `#focus`, `#disabled`, `#pink`,\n * `#shadow-*`, `#overlay`, the unprefixed `#accent-*` family, and the per-theme\n * `#primary-*` / `#purple-*` / `#success-*` / `#danger-*` / `#warning-*` /\n * `#note-*` families.\n *\n * Each Glaze token is a state map (`{ '': '...', '@dark': '...', '@hc': '...' }`),\n * giving us light, dark, and high-contrast variants for free. The `@dark` /\n * `@hc` predefined states are wired up globally in `src/components/Root.tsx`.\n *\n * The aliases below preserve backward compatibility with every legacy\n * `#name` used across components, stories, and tests. Each alias resolves\n * to a current Glaze token via tasty's `#token` reference syntax.\n */\n\nconst LEGACY_ALIASES: Styles = {\n  // ---- Neutral text scale (legacy `#dark*`) ----\n  '#text': '#surface-text-soft',\n  '#dark': '#surface-text',\n  '#dark-01': '#surface-text',\n  '#dark-02': '#surface-text-soft',\n  '#dark-03': '#surface-text-soft-2',\n  '#dark-04': '#placeholder',\n  '#dark-05': '#border',\n\n  // Fixed-mode counterpart to `#dark`. Resolves to the same L≈12 surface\n  // but uses Glaze `mode: 'fixed'` so it does NOT invert in dark schemes.\n  // Use this whenever the design intentionally pins a dark color regardless\n  // of scheme. Points at `#special-surface` (`mode: 'fixed'`, L=12),\n  // emitted by the standalone `specialTheme` in `palette.ts` — the canonical\n  // source of fixed-mode color tokens for `special`-variant components.\n  '#fixed-dark': '#special-surface',\n\n  // Fixed-mode counterpart to `#primary-text`. `#primary-text` is anchored\n  // to `surface` with `mode: 'auto'`, so it flips to a *light* purple in\n  // dark schemes (correct on body content, which also inverts). When the\n  // local fill is a fixed color instead (an always-white pill, etc.), the\n  // adaptive text loses contrast (light purple on white) in dark mode.\n  // Points at `#special-accent-text` (`mode: 'fixed'`, cr 6–8.5 vs fixed\n  // white) — a dark purple readable on a white surface that stays put\n  // across schemes.\n  '#fixed-primary-text': '#special-accent-text',\n\n  // ---- Misc neutral ----\n  '#minor': '#surface-text-soft.65',\n  '#shadow': '#shadow-md',\n  '#light': '#surface-3',\n  '#dark-bg': '#surface-2',\n  '#clear': 'transparent',\n\n  // Pink: independent hue, scheme-static (no Glaze adaptation). Kept as a raw\n  // literal rather than folded into a theme — nothing in the palette emits this\n  // hue as a standalone token, and it is a documented public alias (see\n  // `Usage.docs.mdx`, `tasty.config.ts`, and the `pink` key in\n  // `tasty-augment.d.ts`), so dropping it would silently break consumer styles\n  // while the types still advertised it.\n  '#pink': 'okhsl(5 100% 67%)',\n\n  // ---- Disabled state aliases ----\n  // `#disabled-surface` and `#disabled-surface-text` are emitted directly by\n  // the Glaze palette (`palette.ts`) as scheme-symmetric, contrast-driven\n  // tokens — no alias needed here. `#disabled` stays as a brand-tinted\n  // backwards-compat anchor for the per-theme `#<theme>-disabled` aliases below.\n\n  // ---- Primary / Purple legacy ----\n  '#primary': '#primary-accent-surface',\n  '#primary-text': '#primary-accent-text',\n  '#primary-text-soft': '#primary-accent-text-soft',\n  '#primary-bg': '#primary-surface',\n  '#primary-icon': '#primary-accent-icon',\n  '#primary-hover': '#primary-accent-surface-hover',\n  '#primary-desaturated': '#primary-accent-surface-2',\n  '#primary-disabled': '#disabled',\n\n  '#purple': '#purple-accent-surface',\n  '#purple-text': '#purple-accent-text',\n  '#purple-text-soft': '#purple-accent-text-soft',\n  '#purple-bg': '#purple-surface',\n  '#purple-icon': '#purple-accent-icon',\n  '#purple-hover': '#purple-accent-surface-hover',\n  '#purple-disabled': '#disabled',\n\n  // Purple scale (gradient/accent shades) — mapped to the accent-surface ramp.\n  '#purple-01': '#purple-accent-surface',\n  '#purple-02': '#purple-accent-surface-2',\n  '#purple-03': '#purple-accent-surface-3',\n  '#purple-04': '#purple-surface',\n\n  // ---- Danger ----\n  '#danger': '#danger-accent-surface',\n  '#danger-text': '#danger-accent-text',\n  '#danger-text-soft': '#danger-accent-text-soft',\n  '#danger-bg': '#danger-surface',\n  '#danger-icon': '#danger-accent-icon',\n  '#danger-hover': '#danger-accent-surface-hover',\n  '#danger-desaturated': '#danger-accent-surface-2',\n  '#danger-disabled': '#disabled',\n\n  // ---- Success ----\n  '#success': '#success-accent-surface',\n  '#success-text': '#success-accent-text',\n  '#success-text-soft': '#success-accent-text-soft',\n  '#success-bg': '#success-surface',\n  '#success-icon': '#success-accent-icon',\n  '#success-hover': '#success-accent-surface-hover',\n  '#success-desaturated': '#success-accent-surface-2',\n  '#success-disabled': '#disabled',\n\n  // ---- Warning ----\n  '#warning': '#warning-accent-surface',\n  '#warning-text': '#warning-accent-text',\n  '#warning-text-soft': '#warning-accent-text-soft',\n  '#warning-bg': '#warning-surface',\n  '#warning-icon': '#warning-accent-icon',\n  '#warning-hover': '#warning-accent-surface-hover',\n  '#warning-desaturated': '#warning-accent-surface-2',\n  '#warning-disabled': '#disabled',\n\n  // ---- Note ----\n  '#note': '#note-accent-surface',\n  '#note-text': '#note-accent-text',\n  '#note-text-soft': '#note-accent-text-soft',\n  '#note-bg': '#note-surface',\n  '#note-icon': '#note-accent-icon',\n  '#note-hover': '#note-accent-surface-hover',\n  '#note-desaturated': '#note-accent-surface-2',\n  '#note-disabled': '#disabled',\n};\n\n/**\n * Context hooks — tokens a CONTAINER sets to steer a component that cannot\n * resolve the color on its own.\n *\n * Declared with a default rather than read as `var(--x, fallback)` at every use\n * site, for two reasons: the default is stated once instead of repeated (and so\n * cannot drift), and a declared token gets its components companion for free —\n * which is the only way `#current-fill.5` can fade whatever the container\n * offered rather than the fallback.\n *\n * Included by reference in {@link renderColorTokens} alongside the legacy\n * aliases, so a region preview re-resolves the default against that region's own\n * `#surface` instead of freezing the outer theme's.\n */\nconst CONTEXT_TOKENS: Styles = {\n  // The label color `current.primary` punches out of its `currentcolor` chip —\n  // read by nothing else. That flavour fills with the color it INHERITS, so its\n  // label has to contrast with an arbitrary color, and the page only manages\n  // that while the inherited color sits away from the page. A container\n  // whose own text color IS the page breaks it: a `Banner` labels itself\n  // `#white`, and `#surface` is white in light mode, so label and chip collapse\n  // to cr 1.00.\n  //\n  // Such a container sets this to a color that contrasts with its own fill —\n  // usually its own surface — and the label, the rim and the icon slots all\n  // follow. See `CURRENT_PRIMARY_STYLES` in `src/data/item-themes.ts`.\n  '#current-fill': '#surface',\n};\n\n/**\n * Combined color token map: Glaze-generated palette + legacy aliases + context hooks.\n *\n * Memoized against the palette config version, so a runtime `setPaletteConfig()`\n * invalidates it while repeated reads stay free. Prefer {@link getColorTokens}\n * in new code.\n *\n * `#white` and `#black` are intentionally omitted — they are built-in\n * tasty named colors and resolve automatically.\n */\nlet colorTokensCache: Styles | null = null;\nlet cachedVersion = -1;\n\nexport function getColorTokens(): Styles {\n  const version = getPaletteVersion();\n\n  if (!colorTokensCache || cachedVersion !== version) {\n    colorTokensCache = {\n      ...getPaletteTokens(),\n      ...LEGACY_ALIASES,\n      ...CONTEXT_TOKENS,\n    };\n    cachedVersion = version;\n  }\n  return colorTokensCache;\n}\n\nexport const COLOR_TOKENS: Styles = lazyStyles(getColorTokens);\n\n/**\n * Tokens that live outside the palette but whose *values* reference a palette\n * color, so a region preview has to re-declare them. Kept by reference, exactly\n * as `<Root>` declares them — see {@link renderColorTokens}.\n *\n * Sourced from `./shadows` and the scrollbar block of `./base`; if either grows a\n * new colour-referencing token, add it here too.\n */\nconst COLOR_DEPENDENT_TOKENS: Styles = {\n  ...SHADOW_TOKENS,\n  '#scrollbar-thumb': BASE_TOKENS['#scrollbar-thumb'],\n  '#scrollbar-outline': BASE_TOKENS['#scrollbar-outline'],\n  '#scrollbar-bg': BASE_TOKENS['#scrollbar-bg'],\n  '#scrollbar-corner': BASE_TOKENS['#scrollbar-corner'],\n};\n\n/**\n * Render every UI Kit color for one config and one scheme, as flat literal\n * values ready to apply to a **region** via a tasty `tokens` prop.\n *\n * ```tsx\n * const preview = useMemo(\n *   () => renderColorTokens({ hue: 210, scheme: 'dark' }),\n *   [],\n * );\n *\n * <Block tokens={preview} fill=\"#surface\" color=\"#surface-text\">\n *   …renders in the previewed theme, inside a light page…\n * </Block>\n * ```\n *\n * Config fields merge over the *current* palette config, so\n * `renderColorTokens({ scheme: 'dark' })` previews the active theme in dark\n * without restating it. Nothing is applied globally — the live palette is\n * untouched.\n *\n * The legacy aliases are included **by reference** (`'#dark': '#surface-text'`),\n * not resolved: tasty re-declares them on the region, so each `var()` resolves\n * against that region's own overridden value. Resolving them here would instead\n * freeze them to the outer theme's colors.\n *\n * The shadow tokens and the scrollbar colors come along for the same reason: their\n * values embed a palette color (`$card-shadow` → `#shadow-md`, `#scrollbar-thumb`\n * → `#text.5`). They are declared on `<Root>`, so CSS has already substituted the\n * outer theme's colors into them by the time a region inherits — re-declaring them\n * here is what lets them re-resolve.\n *\n * Not included: typography, spacing, sizes and layout. Nothing in their values\n * references a color, so a region inherits them from `<Root>` unchanged.\n *\n * The result is memoized for the last config rendered, but callers driving this\n * from state should still `useMemo` — a rebuild resolves the whole palette.\n */\nexport function renderColorTokens(options?: RenderPaletteOptions): Tokens {\n  return {\n    ...renderPaletteTokens(options),\n    ...(LEGACY_ALIASES as Tokens),\n    ...(CONTEXT_TOKENS as Tokens),\n    ...(COLOR_DEPENDENT_TOKENS as Tokens),\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,MAAM,iBAAyB;CAE7B,SAAS;CACT,SAAS;CACT,YAAY;CACZ,YAAY;CACZ,YAAY;CACZ,YAAY;CACZ,YAAY;CAQZ,eAAe;CAUf,uBAAuB;CAGvB,UAAU;CACV,WAAW;CACX,UAAU;CACV,YAAY;CACZ,UAAU;CAQV,SAAS;CAST,YAAY;CACZ,iBAAiB;CACjB,sBAAsB;CACtB,eAAe;CACf,iBAAiB;CACjB,kBAAkB;CAClB,wBAAwB;CACxB,qBAAqB;CAErB,WAAW;CACX,gBAAgB;CAChB,qBAAqB;CACrB,cAAc;CACd,gBAAgB;CAChB,iBAAiB;CACjB,oBAAoB;CAGpB,cAAc;CACd,cAAc;CACd,cAAc;CACd,cAAc;CAGd,WAAW;CACX,gBAAgB;CAChB,qBAAqB;CACrB,cAAc;CACd,gBAAgB;CAChB,iBAAiB;CACjB,uBAAuB;CACvB,oBAAoB;CAGpB,YAAY;CACZ,iBAAiB;CACjB,sBAAsB;CACtB,eAAe;CACf,iBAAiB;CACjB,kBAAkB;CAClB,wBAAwB;CACxB,qBAAqB;CAGrB,YAAY;CACZ,iBAAiB;CACjB,sBAAsB;CACtB,eAAe;CACf,iBAAiB;CACjB,kBAAkB;CAClB,wBAAwB;CACxB,qBAAqB;CAGrB,SAAS;CACT,cAAc;CACd,mBAAmB;CACnB,YAAY;CACZ,cAAc;CACd,eAAe;CACf,qBAAqB;CACrB,kBAAkB;CACnB;;;;;;;;;;;;;;;AAgBD,MAAM,iBAAyB,EAY7B,iBAAiB,YAClB;;;;;;;;;;;AAYD,IAAI,mBAAkC;AACtC,IAAI,gBAAgB;AAEpB,SAAgB,iBAAyB;CACvC,MAAM,UAAU,mBAAmB;AAEnC,KAAI,CAAC,oBAAoB,kBAAkB,SAAS;AAClD,qBAAmB;GACjB,GAAG,kBAAkB;GACrB,GAAG;GACH,GAAG;GACJ;AACD,kBAAgB;;AAElB,QAAO;;AAGT,MAAa,eAAuB,WAAW,eAAe;;;;;;;;;AAU9D,MAAM,yBAAiC;CACrC,GAAG;CACH,oBAAoB,YAAY;CAChC,sBAAsB,YAAY;CAClC,iBAAiB,YAAY;CAC7B,qBAAqB,YAAY;CAClC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuCD,SAAgB,kBAAkB,SAAwC;AACxE,QAAO;EACL,GAAG,oBAAoB,QAAQ;EAC/B,GAAI;EACJ,GAAI;EACJ,GAAI;EACL"}
+{"version":3,"file":"colors.js","names":["BASE_TOKENS","lazyStyles","getPaletteTokens","renderPaletteTokens","getPaletteVersion","SHADOW_TOKENS","Styles","Tokens","RenderPaletteOptions","LEGACY_ALIASES","CONTEXT_TOKENS","colorTokensCache","cachedVersion","getColorTokens","version","COLOR_TOKENS","COLOR_DEPENDENT_TOKENS","renderColorTokens","options"],"sources":["../../src/tokens/colors.ts"],"sourcesContent":["import { BASE_TOKENS } from './base';\nimport { lazyStyles } from './lazy-styles';\nimport { getPaletteTokens, renderPaletteTokens } from './palette';\nimport { getPaletteVersion } from './palette-config';\nimport { SHADOW_TOKENS } from './shadows';\n\nimport type { Styles, Tokens } from '@tenphi/tasty';\nimport type { RenderPaletteOptions } from './palette';\n\n/**\n * Color tokens with `#` prefix for tasty color definitions.\n *\n * The base values come from the Glaze-generated palette (`palette.ts`):\n * `#surface`, `#surface-text*`, `#border`, `#focus`, `#disabled`, `#pink`,\n * `#shadow-*`, `#overlay`, the unprefixed `#accent-*` family, and the per-theme\n * `#primary-*` / `#purple-*` / `#success-*` / `#danger-*` / `#warning-*` /\n * `#note-*` families.\n *\n * Each Glaze token is a state map (`{ '': '...', '@dark': '...', '@hc': '...' }`),\n * giving us light, dark, and high-contrast variants for free. The `@dark` /\n * `@hc` predefined states are wired up globally in `src/components/Root.tsx`.\n *\n * The aliases below preserve backward compatibility with every legacy\n * `#name` used across components, stories, and tests. Each alias resolves\n * to a current Glaze token via tasty's `#token` reference syntax.\n */\n\nconst LEGACY_ALIASES: Styles = {\n  // ---- Neutral text scale (legacy `#dark*`) ----\n  '#text': '#surface-text-soft',\n  '#dark': '#surface-text',\n  '#dark-01': '#surface-text',\n  '#dark-02': '#surface-text-soft',\n  '#dark-03': '#surface-text-soft-2',\n  '#dark-04': '#placeholder',\n  '#dark-05': '#border',\n\n  // Fixed-mode counterpart to `#dark`. Resolves to the same L≈12 surface\n  // but uses Glaze `mode: 'fixed'` so it does NOT invert in dark schemes.\n  // Use this whenever the design intentionally pins a dark color regardless\n  // of scheme. Points at `#special-surface` (`mode: 'fixed'`, L=12),\n  // emitted by the standalone `specialTheme` in `palette.ts` — the canonical\n  // source of fixed-mode color tokens for `special`-variant components.\n  '#fixed-dark': '#special-surface',\n\n  // Fixed-mode counterpart to `#primary-text`. `#primary-text` is anchored\n  // to `surface` with `mode: 'auto'`, so it flips to a *light* purple in\n  // dark schemes (correct on body content, which also inverts). When the\n  // local fill is a fixed color instead (an always-white pill, etc.), the\n  // adaptive text loses contrast (light purple on white) in dark mode.\n  // Points at `#special-accent-text` (`mode: 'fixed'`, cr 6–8.5 vs fixed\n  // white) — a dark purple readable on a white surface that stays put\n  // across schemes.\n  '#fixed-primary-text': '#special-accent-text',\n\n  // ---- Misc neutral ----\n  '#minor': '#surface-text-soft.65',\n  '#shadow': '#shadow-md',\n  '#light': '#surface-3',\n  '#dark-bg': '#surface-2',\n  '#clear': 'transparent',\n\n  // Pink: independent hue, scheme-static (no Glaze adaptation). Kept as a raw\n  // literal rather than folded into a theme — nothing in the palette emits this\n  // hue as a standalone token, and it is a documented public alias (see\n  // `Usage.docs.mdx`, `tasty.config.ts`, and the `pink` key in\n  // `tasty-augment.d.ts`), so dropping it would silently break consumer styles\n  // while the types still advertised it.\n  '#pink': 'okhsl(5 100% 67%)',\n\n  // ---- Disabled state aliases ----\n  // `#disabled-surface` and `#disabled-surface-text` are emitted directly by\n  // the Glaze palette (`palette.ts`) as scheme-symmetric, contrast-driven\n  // tokens — no alias needed here. `#disabled` stays as a brand-tinted\n  // backwards-compat anchor for the per-theme `#<theme>-disabled` aliases below.\n\n  // ---- Primary / Purple legacy ----\n  '#primary': '#primary-accent-surface',\n  '#primary-text': '#primary-accent-text',\n  '#primary-text-soft': '#primary-accent-text-soft',\n  '#primary-bg': '#primary-surface',\n  '#primary-icon': '#primary-accent-icon',\n  '#primary-hover': '#primary-accent-surface-hover',\n  '#primary-desaturated': '#primary-accent-surface-2',\n  '#primary-disabled': '#disabled',\n\n  '#purple': '#purple-accent-surface',\n  '#purple-text': '#purple-accent-text',\n  '#purple-text-soft': '#purple-accent-text-soft',\n  '#purple-bg': '#purple-surface',\n  '#purple-icon': '#purple-accent-icon',\n  '#purple-hover': '#purple-accent-surface-hover',\n  '#purple-disabled': '#disabled',\n\n  // Purple scale (gradient/accent shades) — mapped to the accent-surface ramp.\n  '#purple-01': '#purple-accent-surface',\n  '#purple-02': '#purple-accent-surface-2',\n  '#purple-03': '#purple-accent-surface-3',\n  '#purple-04': '#purple-surface',\n\n  // ---- Danger ----\n  '#danger': '#danger-accent-surface',\n  '#danger-text': '#danger-accent-text',\n  '#danger-text-soft': '#danger-accent-text-soft',\n  '#danger-bg': '#danger-surface',\n  '#danger-icon': '#danger-accent-icon',\n  '#danger-hover': '#danger-accent-surface-hover',\n  '#danger-desaturated': '#danger-accent-surface-2',\n  '#danger-disabled': '#disabled',\n\n  // ---- Success ----\n  '#success': '#success-accent-surface',\n  '#success-text': '#success-accent-text',\n  '#success-text-soft': '#success-accent-text-soft',\n  '#success-bg': '#success-surface',\n  '#success-icon': '#success-accent-icon',\n  '#success-hover': '#success-accent-surface-hover',\n  '#success-desaturated': '#success-accent-surface-2',\n  '#success-disabled': '#disabled',\n\n  // ---- Warning ----\n  '#warning': '#warning-accent-surface',\n  '#warning-text': '#warning-accent-text',\n  '#warning-text-soft': '#warning-accent-text-soft',\n  '#warning-bg': '#warning-surface',\n  '#warning-icon': '#warning-accent-icon',\n  '#warning-hover': '#warning-accent-surface-hover',\n  '#warning-desaturated': '#warning-accent-surface-2',\n  '#warning-disabled': '#disabled',\n\n  // ---- Note ----\n  '#note': '#note-accent-surface',\n  '#note-text': '#note-accent-text',\n  '#note-text-soft': '#note-accent-text-soft',\n  '#note-bg': '#note-surface',\n  '#note-icon': '#note-accent-icon',\n  '#note-hover': '#note-accent-surface-hover',\n  '#note-desaturated': '#note-accent-surface-2',\n  '#note-disabled': '#disabled',\n};\n\n/**\n * Context hooks — tokens a CONTAINER sets to steer a component that cannot\n * resolve the color on its own.\n *\n * Declared with a default rather than read as `var(--x, fallback)` at every use\n * site, for two reasons: the default is stated once instead of repeated (and so\n * cannot drift), and a declared token gets its components companion for free —\n * which is the only way `#current-fill.5` can fade whatever the container\n * offered rather than the fallback.\n *\n * Included by reference in {@link renderColorTokens} alongside the legacy\n * aliases, so a region preview re-resolves the default against that region's own\n * `#surface` instead of freezing the outer theme's.\n */\nconst CONTEXT_TOKENS: Styles = {\n  // The label color `current.primary` punches out of its `currentcolor` chip —\n  // read by nothing else. That flavour fills with the color it INHERITS, so its\n  // label has to contrast with an arbitrary color, and the page only manages\n  // that while the inherited color sits away from the page. A container\n  // whose own text color IS the page breaks it: a `Banner` labels itself\n  // `#white`, and `#surface` is white in light mode, so label and chip collapse\n  // to cr 1.00.\n  //\n  // Such a container sets this to a color that contrasts with its own fill —\n  // usually its own surface — and the label, the rim and the icon slots all\n  // follow. See `CURRENT_PRIMARY_STYLES` in `src/data/item-themes.ts`.\n  '#current-fill': '#surface',\n};\n\n/**\n * Combined color token map: Glaze-generated palette + legacy aliases + context hooks.\n *\n * Memoized against the palette config version, so a runtime `setPaletteConfig()`\n * invalidates it while repeated reads stay free. Prefer {@link getColorTokens}\n * in new code.\n *\n * `#white` and `#black` are intentionally omitted — they are built-in\n * tasty named colors and resolve automatically.\n */\nlet colorTokensCache: Styles | null = null;\nlet cachedVersion = -1;\n\nexport function getColorTokens(): Styles {\n  const version = getPaletteVersion();\n\n  if (!colorTokensCache || cachedVersion !== version) {\n    colorTokensCache = {\n      ...getPaletteTokens(),\n      ...LEGACY_ALIASES,\n      ...CONTEXT_TOKENS,\n    };\n    cachedVersion = version;\n  }\n  return colorTokensCache;\n}\n\nexport const COLOR_TOKENS: Styles = lazyStyles(getColorTokens);\n\n/**\n * Tokens that live outside the palette but whose *values* reference a palette\n * color, so a region preview has to re-declare them. Kept by reference, exactly\n * as `<Root>` declares them — see {@link renderColorTokens}.\n *\n * Sourced from `./shadows` and the scrollbar block of `./base`; if either grows a\n * new colour-referencing token, add it here too.\n */\nconst COLOR_DEPENDENT_TOKENS: Styles = {\n  ...SHADOW_TOKENS,\n  '#scrollbar-thumb': BASE_TOKENS['#scrollbar-thumb'],\n  '#scrollbar-outline': BASE_TOKENS['#scrollbar-outline'],\n  '#scrollbar-bg': BASE_TOKENS['#scrollbar-bg'],\n  '#scrollbar-corner': BASE_TOKENS['#scrollbar-corner'],\n};\n\n/**\n * Render every UI Kit color for one config and one scheme, as flat literal\n * values ready to apply to a **region** via a tasty `tokens` prop.\n *\n * ```tsx\n * const preview = useMemo(\n *   () => renderColorTokens({ hue: 210, scheme: 'dark' }),\n *   [],\n * );\n *\n * <Block tokens={preview} fill=\"#surface\" color=\"#surface-text\">\n *   …renders in the previewed theme, inside a light page…\n * </Block>\n * ```\n *\n * Config fields merge over the *current* palette config, so\n * `renderColorTokens({ scheme: 'dark' })` previews the active theme in dark\n * without restating it. Nothing is applied globally — the live palette is\n * untouched.\n *\n * The legacy aliases are included **by reference** (`'#dark': '#surface-text'`),\n * not resolved: tasty re-declares them on the region, so each `var()` resolves\n * against that region's own overridden value. Resolving them here would instead\n * freeze them to the outer theme's colors.\n *\n * The shadow tokens and the scrollbar colors come along for the same reason: their\n * values embed a palette color (`$card-shadow` → `#shadow-md`, `#scrollbar-thumb`\n * → `#text.5`). They are declared on `<Root>`, so CSS has already substituted the\n * outer theme's colors into them by the time a region inherits — re-declaring them\n * here is what lets them re-resolve.\n *\n * Not included: typography, spacing, sizes and layout. Nothing in their values\n * references a color, so a region inherits them from `<Root>` unchanged.\n *\n * The result is memoized for the last config rendered, but callers driving this\n * from state should still `useMemo` — a rebuild resolves the whole palette.\n */\nexport function renderColorTokens(options?: RenderPaletteOptions): Tokens {\n  return {\n    ...renderPaletteTokens(options),\n    ...(LEGACY_ALIASES as Tokens),\n    ...(CONTEXT_TOKENS as Tokens),\n    ...(COLOR_DEPENDENT_TOKENS as Tokens),\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,MAAMS,iBAAyB;CAE7B,SAAS;CACT,SAAS;CACT,YAAY;CACZ,YAAY;CACZ,YAAY;CACZ,YAAY;CACZ,YAAY;CAQZ,eAAe;CAUf,uBAAuB;CAGvB,UAAU;CACV,WAAW;CACX,UAAU;CACV,YAAY;CACZ,UAAU;CAQV,SAAS;CAST,YAAY;CACZ,iBAAiB;CACjB,sBAAsB;CACtB,eAAe;CACf,iBAAiB;CACjB,kBAAkB;CAClB,wBAAwB;CACxB,qBAAqB;CAErB,WAAW;CACX,gBAAgB;CAChB,qBAAqB;CACrB,cAAc;CACd,gBAAgB;CAChB,iBAAiB;CACjB,oBAAoB;CAGpB,cAAc;CACd,cAAc;CACd,cAAc;CACd,cAAc;CAGd,WAAW;CACX,gBAAgB;CAChB,qBAAqB;CACrB,cAAc;CACd,gBAAgB;CAChB,iBAAiB;CACjB,uBAAuB;CACvB,oBAAoB;CAGpB,YAAY;CACZ,iBAAiB;CACjB,sBAAsB;CACtB,eAAe;CACf,iBAAiB;CACjB,kBAAkB;CAClB,wBAAwB;CACxB,qBAAqB;CAGrB,YAAY;CACZ,iBAAiB;CACjB,sBAAsB;CACtB,eAAe;CACf,iBAAiB;CACjB,kBAAkB;CAClB,wBAAwB;CACxB,qBAAqB;CAGrB,SAAS;CACT,cAAc;CACd,mBAAmB;CACnB,YAAY;CACZ,cAAc;CACd,eAAe;CACf,qBAAqB;CACrB,kBAAkB;CACnB;;;;;;;;;;;;;;;AAgBD,MAAMC,iBAAyB,EAY7B,iBAAiB,YAClB;;;;;;;;;;;AAYD,IAAIC,mBAAkC;AACtC,IAAIC,gBAAgB;AAEpB,SAAgBC,iBAAyB;CACvC,MAAMC,UAAUV,mBAAmB;AAEnC,KAAI,CAACO,oBAAoBC,kBAAkBE,SAAS;AAClDH,qBAAmB;GACjB,GAAGT,kBAAkB;GACrB,GAAGO;GACH,GAAGC;GACJ;AACDE,kBAAgBE;;AAElB,QAAOH;;AAGT,MAAaI,eAAuBd,WAAWY,eAAe;;;;;;;;;AAU9D,MAAMG,yBAAiC;CACrC,GAAGX;CACH,oBAAoBL,YAAY;CAChC,sBAAsBA,YAAY;CAClC,iBAAiBA,YAAY;CAC7B,qBAAqBA,YAAY;CAClC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuCD,SAAgBiB,kBAAkBC,SAAwC;AACxE,QAAO;EACL,GAAGf,oBAAoBe,QAAQ;EAC/B,GAAIT;EACJ,GAAIC;EACJ,GAAIM;EACL"}

package/dist/tokens/layout.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 //#region src/tokens/layout.ts
 /**
 * Layout-related tokens for common UI dimensions.

package/dist/tokens/layout.js.map

@@ -1 +1 @@
-{"version":3,"file":"layout.js","names":[],"sources":["../../src/tokens/layout.ts"],"sourcesContent":["import type { Styles } from '@tenphi/tasty';\n\n/**\n * Layout-related tokens for common UI dimensions.\n *\n * Keys use $ prefix for CSS custom properties.\n */\nexport const LAYOUT_TOKENS: Styles = {\n  /** Maximum width for main content areas */\n  '$max-content-width': '1440px',\n  /** Height of the top navigation bar */\n  '$topbar-height': '48px',\n  /** Height of the development mode indicator bar */\n  '$devmodebar-height': '54px',\n  /** Width of the sidebar navigation */\n  '$sidebar-width': '200px',\n  /** Base border radius (legacy, prefer `radius`) */\n  '$border-radius-base': '4px',\n};\n"],"mappings":";;;;;;;AAOA,MAAa,gBAAwB;CAEnC,sBAAsB;CAEtB,kBAAkB;CAElB,sBAAsB;CAEtB,kBAAkB;CAElB,uBAAuB;CACxB"}
+{"version":3,"file":"layout.js","names":["Styles","LAYOUT_TOKENS"],"sources":["../../src/tokens/layout.ts"],"sourcesContent":["import type { Styles } from '@tenphi/tasty';\n\n/**\n * Layout-related tokens for common UI dimensions.\n *\n * Keys use $ prefix for CSS custom properties.\n */\nexport const LAYOUT_TOKENS: Styles = {\n  /** Maximum width for main content areas */\n  '$max-content-width': '1440px',\n  /** Height of the top navigation bar */\n  '$topbar-height': '48px',\n  /** Height of the development mode indicator bar */\n  '$devmodebar-height': '54px',\n  /** Width of the sidebar navigation */\n  '$sidebar-width': '200px',\n  /** Base border radius (legacy, prefer `radius`) */\n  '$border-radius-base': '4px',\n};\n"],"mappings":";;;;;;;AAOA,MAAaC,gBAAwB;CAEnC,sBAAsB;CAEtB,kBAAkB;CAElB,sBAAsB;CAEtB,kBAAkB;CAElB,uBAAuB;CACxB"}

package/dist/tokens/lazy-styles.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 //#region src/tokens/lazy-styles.ts
 /**
 * Proxy that defers to `factory()` on every property / enumeration access.

package/dist/tokens/lazy-styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"lazy-styles.js","names":[],"sources":["../../src/tokens/lazy-styles.ts"],"sourcesContent":["import type { Styles } from '@tenphi/tasty';\n\n/**\n * Proxy that defers to `factory()` on every property / enumeration access.\n * Used so token exports stay import-safe while resolution waits until after a\n * host app calls `setPaletteConfig(...)` / `glaze.configure(...)`.\n *\n * The proxy holds no cache of its own — that is deliberate. Every factory here\n * memoizes against the palette config version, so delegating on each access is\n * what keeps these exports live when the palette is re-seeded at runtime. A\n * factory passed in must memoize.\n */\nexport function lazyStyles(factory: () => Styles): Styles {\n  const resolve = () => factory();\n  return new Proxy({} as Styles, {\n    get(_target, prop) {\n      if (prop === Symbol.toStringTag) return 'Object';\n      return Reflect.get(resolve(), prop);\n    },\n    ownKeys() {\n      return Reflect.ownKeys(resolve());\n    },\n    getOwnPropertyDescriptor(_target, prop) {\n      return Object.getOwnPropertyDescriptor(resolve(), prop);\n    },\n    has(_target, prop) {\n      return Reflect.has(resolve(), prop);\n    },\n    getPrototypeOf() {\n      return Object.prototype;\n    },\n  });\n}\n"],"mappings":";;;;;;;;;;;;AAYA,SAAgB,WAAW,SAA+B;CACxD,MAAM,gBAAgB,SAAS;AAC/B,QAAO,IAAI,MAAM,EAAE,EAAY;EAC7B,IAAI,SAAS,MAAM;AACjB,OAAI,SAAS,OAAO,YAAa,QAAO;AACxC,UAAO,QAAQ,IAAI,SAAS,EAAE,KAAK;;EAErC,UAAU;AACR,UAAO,QAAQ,QAAQ,SAAS,CAAC;;EAEnC,yBAAyB,SAAS,MAAM;AACtC,UAAO,OAAO,yBAAyB,SAAS,EAAE,KAAK;;EAEzD,IAAI,SAAS,MAAM;AACjB,UAAO,QAAQ,IAAI,SAAS,EAAE,KAAK;;EAErC,iBAAiB;AACf,UAAO,OAAO;;EAEjB,CAAC"}
+{"version":3,"file":"lazy-styles.js","names":["Styles","lazyStyles","factory","resolve","Proxy","get","_target","prop","Symbol","toStringTag","Reflect","ownKeys","getOwnPropertyDescriptor","Object","has","getPrototypeOf","prototype"],"sources":["../../src/tokens/lazy-styles.ts"],"sourcesContent":["import type { Styles } from '@tenphi/tasty';\n\n/**\n * Proxy that defers to `factory()` on every property / enumeration access.\n * Used so token exports stay import-safe while resolution waits until after a\n * host app calls `setPaletteConfig(...)` / `glaze.configure(...)`.\n *\n * The proxy holds no cache of its own — that is deliberate. Every factory here\n * memoizes against the palette config version, so delegating on each access is\n * what keeps these exports live when the palette is re-seeded at runtime. A\n * factory passed in must memoize.\n */\nexport function lazyStyles(factory: () => Styles): Styles {\n  const resolve = () => factory();\n  return new Proxy({} as Styles, {\n    get(_target, prop) {\n      if (prop === Symbol.toStringTag) return 'Object';\n      return Reflect.get(resolve(), prop);\n    },\n    ownKeys() {\n      return Reflect.ownKeys(resolve());\n    },\n    getOwnPropertyDescriptor(_target, prop) {\n      return Object.getOwnPropertyDescriptor(resolve(), prop);\n    },\n    has(_target, prop) {\n      return Reflect.has(resolve(), prop);\n    },\n    getPrototypeOf() {\n      return Object.prototype;\n    },\n  });\n}\n"],"mappings":";;;;;;;;;;;;AAYA,SAAgBC,WAAWC,SAA+B;CACxD,MAAMC,gBAAgBD,SAAS;AAC/B,QAAO,IAAIE,MAAM,EAAE,EAAY;EAC7BC,IAAIC,SAASC,MAAM;AACjB,OAAIA,SAASC,OAAOC,YAAa,QAAO;AACxC,UAAOC,QAAQL,IAAIF,SAAS,EAAEI,KAAK;;EAErCI,UAAU;AACR,UAAOD,QAAQC,QAAQR,SAAS,CAAC;;EAEnCS,yBAAyBN,SAASC,MAAM;AACtC,UAAOM,OAAOD,yBAAyBT,SAAS,EAAEI,KAAK;;EAEzDO,IAAIR,SAASC,MAAM;AACjB,UAAOG,QAAQI,IAAIX,SAAS,EAAEI,KAAK;;EAErCQ,iBAAiB;AACf,UAAOF,OAAOG;;EAEjB,CAAC"}

package/dist/tokens/legacy-color.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 import { parseSrgbColor } from "../utils/colors.js";
 import { srgbToHex } from "@tenphi/glaze";
 

package/dist/tokens/legacy-color.js.map

@@ -1 +1 @@
-{"version":3,"file":"legacy-color.js","names":[],"sources":["../../src/tokens/legacy-color.ts"],"sourcesContent":["import { srgbToHex } from '@tenphi/glaze';\n\nimport { parseSrgbColor } from '../utils/colors';\n\n/**\n * Converting a resolved color token into a form a third-party parser will\n * actually accept.\n *\n * Since Glaze every color token computes to `oklch(...)`, and a large class of\n * consumers validates colors against \"HEX, `rgb()`, or `hsl()`\" and *silently\n * drops* anything else — Stripe's Appearance API falls back to its own light\n * theme, `d3-color` (so Vega) throws, mapbox-gl's `csscolorparser` rejects even\n * an `#rrggbbaa` tail. A round trip through the DOM does not normalize it:\n * Chrome serializes `oklch` back as `oklch`.\n *\n * So the value `resolveTokenValue()` hands back is correct and unusable at the\n * same time, and this is the step between them.\n */\n\n/** Output form for a *translucent* color — see {@link ToLegacyColorOptions}. */\nexport type LegacyAlphaFormat = 'rgba' | 'hex';\n\nexport interface ToLegacyColorOptions {\n  /**\n   * How to carry alpha when the color is translucent. An opaque color is always\n   * `#rrggbb`, which every consumer accepts.\n   *\n   * - `'rgba'` (default) — `rgba(97, 71, 214, 0.4)`. The widest form: Stripe\n   *   takes it, mapbox-gl takes it, CSS takes it.\n   * - `'hex'` — `#rrggbbaa`. Shorter, and what Vega and plain CSS prefer, but\n   *   mapbox-gl's hex branch accepts only `#rgb` / `#rrggbb` and will drop it.\n   *\n   * When in doubt keep the default; pick `'hex'` only for a consumer known to\n   * read the tail.\n   */\n  alpha?: LegacyAlphaFormat;\n  /** Returned in place of `null` when the input is not a color we can read. */\n  fallback?: string;\n}\n\n/**\n * Convert a color literal — most usefully the `oklch(...)` a color token\n * resolves to — into a hex or `rgba()` string.\n *\n * ```ts\n * toLegacyColor(resolveTokenValue('#purple')); // '#6147d6'\n * toLegacyColor('oklch(0.55 0.21 285 / 0.4)'); // 'rgba(97, 71, 214, 0.4)'\n * toLegacyColor('oklch(0.55 0.21 285 / 0.4)', { alpha: 'hex' }); // '#6147d666'\n * ```\n *\n * Takes `null` / `undefined` so it composes with `resolveTokenValue()` without\n * a null check, and reads every notation the kit emits or accepts: `oklch()`,\n * `okhsl()`, `okhst()`, `rgb()`, `hsl()`, hex (3/4/6/8 digits) and\n * `transparent`, in either the modern slash or the legacy comma alpha syntax.\n *\n * Returns `options.fallback ?? null` rather than the input when the value\n * cannot be read — a color that is not `oklch()` but still not legacy-safe is\n * the failure this helper exists to prevent, so handing it back would defeat\n * the purpose. Named colors other than `transparent`, `color-mix()` and\n * relative syntax (`oklch(from …)`) are all unreadable here, the last two\n * because their value only exists inside a CSS engine.\n */\nexport function toLegacyColor(\n  value: string | null | undefined,\n  options: ToLegacyColorOptions = {},\n): string | null {\n  const { alpha: format = 'rgba', fallback = null } = options;\n\n  if (typeof value !== 'string') return fallback;\n\n  const parsed = parseSrgbColor(value);\n\n  if (!parsed) return fallback;\n\n  const hex = srgbToHex(parsed.rgb);\n\n  if (parsed.alpha >= 1) return hex;\n\n  if (format === 'hex') return `${hex}${toHexByte(parsed.alpha)}`;\n\n  const [r, g, b] = parsed.rgb.map(toByte);\n\n  return `rgba(${r}, ${g}, ${b}, ${round(parsed.alpha)})`;\n}\n\n/**\n * 8-bit channels rather than the fractional ones `formatRgb()` emits. The point\n * of this helper is a value a *legacy* parser accepts, and those commonly read\n * channels with an integer parse; the hex form is 8-bit regardless, so this also\n * keeps the two output forms describing the same color.\n */\nfunction toByte(channel: number): number {\n  return Math.round(Math.min(Math.max(channel, 0), 1) * 255);\n}\n\nfunction toHexByte(alpha: number): string {\n  return toByte(alpha).toString(16).padStart(2, '0');\n}\n\n/** Three decimals is finer than the 8-bit alpha the hex form can carry. */\nfunction round(alpha: number): number {\n  return Math.round(alpha * 1000) / 1000;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AA8DA,SAAgB,cACd,OACA,UAAgC,EAAE,EACnB;CACf,MAAM,EAAE,OAAO,SAAS,QAAQ,WAAW,SAAS;AAEpD,KAAI,OAAO,UAAU,SAAU,QAAO;CAEtC,MAAM,SAAS,eAAe,MAAM;AAEpC,KAAI,CAAC,OAAQ,QAAO;CAEpB,MAAM,MAAM,UAAU,OAAO,IAAI;AAEjC,KAAI,OAAO,SAAS,EAAG,QAAO;AAE9B,KAAI,WAAW,MAAO,QAAO,GAAG,MAAM,UAAU,OAAO,MAAM;CAE7D,MAAM,CAAC,GAAG,GAAG,KAAK,OAAO,IAAI,IAAI,OAAO;AAExC,QAAO,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,MAAM,OAAO,MAAM,CAAC;;;;;;;;AASvD,SAAS,OAAO,SAAyB;AACvC,QAAO,KAAK,MAAM,KAAK,IAAI,KAAK,IAAI,SAAS,EAAE,EAAE,EAAE,GAAG,IAAI;;AAG5D,SAAS,UAAU,OAAuB;AACxC,QAAO,OAAO,MAAM,CAAC,SAAS,GAAG,CAAC,SAAS,GAAG,IAAI;;;AAIpD,SAAS,MAAM,OAAuB;AACpC,QAAO,KAAK,MAAM,QAAQ,IAAK,GAAG"}
+{"version":3,"file":"legacy-color.js","names":["srgbToHex","parseSrgbColor","LegacyAlphaFormat","ToLegacyColorOptions","alpha","fallback","toLegacyColor","value","options","format","parsed","hex","rgb","toHexByte","r","g","b","map","toByte","round","channel","Math","min","max","toString","padStart"],"sources":["../../src/tokens/legacy-color.ts"],"sourcesContent":["import { srgbToHex } from '@tenphi/glaze';\n\nimport { parseSrgbColor } from '../utils/colors';\n\n/**\n * Converting a resolved color token into a form a third-party parser will\n * actually accept.\n *\n * Since Glaze every color token computes to `oklch(...)`, and a large class of\n * consumers validates colors against \"HEX, `rgb()`, or `hsl()`\" and *silently\n * drops* anything else — Stripe's Appearance API falls back to its own light\n * theme, `d3-color` (so Vega) throws, mapbox-gl's `csscolorparser` rejects even\n * an `#rrggbbaa` tail. A round trip through the DOM does not normalize it:\n * Chrome serializes `oklch` back as `oklch`.\n *\n * So the value `resolveTokenValue()` hands back is correct and unusable at the\n * same time, and this is the step between them.\n */\n\n/** Output form for a *translucent* color — see {@link ToLegacyColorOptions}. */\nexport type LegacyAlphaFormat = 'rgba' | 'hex';\n\nexport interface ToLegacyColorOptions {\n  /**\n   * How to carry alpha when the color is translucent. An opaque color is always\n   * `#rrggbb`, which every consumer accepts.\n   *\n   * - `'rgba'` (default) — `rgba(97, 71, 214, 0.4)`. The widest form: Stripe\n   *   takes it, mapbox-gl takes it, CSS takes it.\n   * - `'hex'` — `#rrggbbaa`. Shorter, and what Vega and plain CSS prefer, but\n   *   mapbox-gl's hex branch accepts only `#rgb` / `#rrggbb` and will drop it.\n   *\n   * When in doubt keep the default; pick `'hex'` only for a consumer known to\n   * read the tail.\n   */\n  alpha?: LegacyAlphaFormat;\n  /** Returned in place of `null` when the input is not a color we can read. */\n  fallback?: string;\n}\n\n/**\n * Convert a color literal — most usefully the `oklch(...)` a color token\n * resolves to — into a hex or `rgba()` string.\n *\n * ```ts\n * toLegacyColor(resolveTokenValue('#purple')); // '#6147d6'\n * toLegacyColor('oklch(0.55 0.21 285 / 0.4)'); // 'rgba(97, 71, 214, 0.4)'\n * toLegacyColor('oklch(0.55 0.21 285 / 0.4)', { alpha: 'hex' }); // '#6147d666'\n * ```\n *\n * Takes `null` / `undefined` so it composes with `resolveTokenValue()` without\n * a null check, and reads every notation the kit emits or accepts: `oklch()`,\n * `okhsl()`, `okhst()`, `rgb()`, `hsl()`, hex (3/4/6/8 digits) and\n * `transparent`, in either the modern slash or the legacy comma alpha syntax.\n *\n * Returns `options.fallback ?? null` rather than the input when the value\n * cannot be read — a color that is not `oklch()` but still not legacy-safe is\n * the failure this helper exists to prevent, so handing it back would defeat\n * the purpose. Named colors other than `transparent`, `color-mix()` and\n * relative syntax (`oklch(from …)`) are all unreadable here, the last two\n * because their value only exists inside a CSS engine.\n */\nexport function toLegacyColor(\n  value: string | null | undefined,\n  options: ToLegacyColorOptions = {},\n): string | null {\n  const { alpha: format = 'rgba', fallback = null } = options;\n\n  if (typeof value !== 'string') return fallback;\n\n  const parsed = parseSrgbColor(value);\n\n  if (!parsed) return fallback;\n\n  const hex = srgbToHex(parsed.rgb);\n\n  if (parsed.alpha >= 1) return hex;\n\n  if (format === 'hex') return `${hex}${toHexByte(parsed.alpha)}`;\n\n  const [r, g, b] = parsed.rgb.map(toByte);\n\n  return `rgba(${r}, ${g}, ${b}, ${round(parsed.alpha)})`;\n}\n\n/**\n * 8-bit channels rather than the fractional ones `formatRgb()` emits. The point\n * of this helper is a value a *legacy* parser accepts, and those commonly read\n * channels with an integer parse; the hex form is 8-bit regardless, so this also\n * keeps the two output forms describing the same color.\n */\nfunction toByte(channel: number): number {\n  return Math.round(Math.min(Math.max(channel, 0), 1) * 255);\n}\n\nfunction toHexByte(alpha: number): string {\n  return toByte(alpha).toString(16).padStart(2, '0');\n}\n\n/** Three decimals is finer than the 8-bit alpha the hex form can carry. */\nfunction round(alpha: number): number {\n  return Math.round(alpha * 1000) / 1000;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AA8DA,SAAgBM,cACdC,OACAC,UAAgC,EAAE,EACnB;CACf,MAAM,EAAEJ,OAAOK,SAAS,QAAQJ,WAAW,SAASG;AAEpD,KAAI,OAAOD,UAAU,SAAU,QAAOF;CAEtC,MAAMK,SAAST,eAAeM,MAAM;AAEpC,KAAI,CAACG,OAAQ,QAAOL;CAEpB,MAAMM,MAAMX,UAAUU,OAAOE,IAAI;AAEjC,KAAIF,OAAON,SAAS,EAAG,QAAOO;AAE9B,KAAIF,WAAW,MAAO,QAAO,GAAGE,MAAME,UAAUH,OAAON,MAAM;CAE7D,MAAM,CAACU,GAAGC,GAAGC,KAAKN,OAAOE,IAAIK,IAAIC,OAAO;AAExC,QAAO,QAAQJ,EAAC,IAAKC,EAAC,IAAKC,EAAC,IAAKG,MAAMT,OAAON,MAAM,CAAA;;;;;;;;AAStD,SAASc,OAAOE,SAAyB;AACvC,QAAOC,KAAKF,MAAME,KAAKC,IAAID,KAAKE,IAAIH,SAAS,EAAE,EAAE,EAAE,GAAG,IAAI;;AAG5D,SAASP,UAAUT,OAAuB;AACxC,QAAOc,OAAOd,MAAM,CAACoB,SAAS,GAAG,CAACC,SAAS,GAAG,IAAI;;;AAIpD,SAASN,MAAMf,OAAuB;AACpC,QAAOiB,KAAKF,MAAMf,QAAQ,IAAK,GAAG"}

package/dist/tokens/palette-config.js

@@ -1,5 +1,6 @@
-/** @license MIT | @cube-dev/ui-kit v0.182.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 import { colorSeed } from "./color-seed.js";
+import { c } from "react-compiler-runtime";
 import { useSyncExternalStore } from "react";
 
 //#region src/tokens/palette-config.ts
@@ -451,8 +452,14 @@ function usePaletteVersion() {
 * mounted `<Root>` — sees the same palette.
 */
 function usePaletteConfig() {
+	const $ = c(1);
 	usePaletteVersion();
-	return [getPaletteConfig(), setPaletteConfig];
+	let t0;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t0 = [getPaletteConfig(), setPaletteConfig];
+		$[0] = t0;
+	} else t0 = $[0];
+	return t0;
 }
 
 //#endregion