@handijit/ui 1.0.0 → 2.0.0

package/build/helpers/theme.helper.js

@@ -1,75 +1,37 @@
-import { isClient as u } from "@handijit/utils";
-import { DARK_THEME as E, LIGHT_THEME as T } from "../theme/tokens.js";
-const i = "--ui-", m = "ui-theme-overrides", l = "data-ui-theme", p = "data-ui-density", H = "ui-theme-switching", y = "ui", o = "html:root", I = (t, e) => {
-  const n = t === "dark" ? E : T, r = (t === "dark" ? e == null ? void 0 : e.dark : e == null ? void 0 : e.light) ?? {};
-  return { ...n, ...r };
-}, k = (t) => {
-  const e = [], n = (s, c = "  ") => Object.entries(s).map(([h, $]) => `${c}${i}${h}: ${$};`).join(`
-`), r = t.fonts ?? {}, a = Object.entries(r).filter(([, s]) => !!s);
-  a.length > 0 && e.push(
-    `${o} {
-${a.map(([s, c]) => `  ${i}font-${s}: ${c};`).join(`
-`)}
-}`
-  );
-  const d = t.metrics ?? {};
-  if (Object.keys(d).length > 0) {
-    const s = n(d);
-    e.push(`${o} {
-${s}
-}`), e.push(`${o}[${p}='compact'] {
-${s}
-}`);
+import { THEME_STORAGE_KEY as r, THEME_ATTRIBUTE as o } from "@handijit/design";
+import { isClient as e } from "@handijit/utils";
+const a = "ui-theme-switching", n = "(prefers-color-scheme: dark)", s = (t) => t === "light" || t === "dark", m = () => {
+  var t;
+  return e() && ((t = window.matchMedia) != null && t.call(window, n).matches) ? "dark" : "light";
+}, d = () => {
+  if (!e()) return "system";
+  try {
+    const t = window.localStorage.getItem(r);
+    return s(t) ? t : "system";
+  } catch {
+    return "system";
   }
-  if (t.light && Object.keys(t.light).length > 0) {
-    const s = n(t.light);
-    e.push(`${o} {
-${s}
-}`), e.push(`${o}[${l}='light'] {
-${s}
-}`);
-  }
-  if (t.dark && Object.keys(t.dark).length > 0) {
-    const s = n(t.dark);
-    e.push(`${o}[${l}='dark'] {
-${s}
-}`), e.push(
-      `@media (prefers-color-scheme: dark) {
-  ${o}:not([${l}]) {
-${n(
-        t.dark,
-        "    "
-      )}
-  }
-}`
+}, h = () => {
+  if (!e()) return "light";
+  const t = document.documentElement.getAttribute(o);
+  return s(t) ? t : m();
+}, l = (t) => {
+  if (e()) {
+    try {
+      t === "system" ? window.localStorage.removeItem(r) : window.localStorage.setItem(r, t);
+    } catch {
+    }
+    document.documentElement.setAttribute(
+      o,
+      t === "system" ? m() : t
     );
   }
-  return e.length === 0 ? "" : `@layer ${y} {
-${e.join(`
-
-`).replace(/^(?=.)/gm, "  ")}
-}`;
-}, O = (t) => t.replace(/<\/style/gi, "<\\/style"), S = (t) => {
-  if (!u()) return;
-  const e = t ? k(t) : "", n = document.getElementById(m);
-  if (e === "") {
-    n == null || n.remove();
-    return;
-  }
-  const r = n ?? document.createElement("style");
-  r.id = m, r.textContent = e, n || document.head.appendChild(r);
-}, j = ({ storageKey: t }) => `(function(){try{var t=localStorage.getItem(${JSON.stringify(t)});if(t==="light"||t==="dark")document.documentElement.setAttribute("${l}",t)}catch(e){}})()`;
+};
 export {
-  p as DENSITY_ATTRIBUTE,
-  l as THEME_ATTRIBUTE,
-  y as THEME_LAYER,
-  m as THEME_STYLE_ID,
-  H as THEME_SWITCHING_CLASS,
-  i as TOKEN_PREFIX,
-  S as applyThemeConfig,
-  k as buildThemeCss,
-  I as resolveTokens,
-  j as themeBootScript,
-  O as toStyleHtml
+  a as THEME_SWITCHING_CLASS,
+  l as applyThemePreference,
+  h as readActiveTheme,
+  d as readStoredPreference,
+  m as readSystemTheme
 };
 //# sourceMappingURL=theme.helper.js.map

package/build/helpers/theme.helper.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme.helper.js","sources":["../../src/helpers/theme.helper.ts"],"sourcesContent":["import { isClient } from '@handijit/utils';\n\nimport { DARK_THEME, DEFAULT_FONTS, LIGHT_THEME } from '../theme/tokens';\nimport type { UiColorScheme, UiResolvedTokens, UiThemeConfig } from '@/types/theme.type';\n\n/** CSS özel özelliği öneki — `_tokens.generated.scss` ile aynı olmak zorunda. */\nexport const TOKEN_PREFIX = '--ui-';\n\n/** Ezme kurallarını taşıyan `<style>` etiketinin kimliği. */\nexport const THEME_STYLE_ID = 'ui-theme-overrides';\n\n/** Temanın taşındığı öznitelik. `<html data-ui-theme=\"dark\">`. */\nexport const THEME_ATTRIBUTE = 'data-ui-theme';\n\n/** Bilgi yoğunluğunun taşındığı öznitelik. `<html data-ui-density=\"compact\">`. */\nexport const DENSITY_ATTRIBUTE = 'data-ui-density';\n\n/** Geçiş animasyonlarını tek kare boyunca kapatan sınıf (bkz. `base.scss`). */\nexport const THEME_SWITCHING_CLASS = 'ui-theme-switching';\n\n/** Ezmelerin katmanı — `scripts/lib/postcss-ui-layer.mjs`in varsayılanıyla aynı olmak zorunda. */\nexport const THEME_LAYER = 'ui';\n\n/**\n * Ezme kurallarının kök seçicisi: `_tokens.generated.scss`teki karşılığından bir öğe (`html`) daha\n * özgül — (0,1,1) > (0,1,0), (0,2,1) > (0,2,0). Katman içinde ezme varsayılanı KAYNAK SIRASINDAN\n * bağımsız yener. Açık temanın `html:root`u (0,1,1) koyu varsayılanın `:root:not([…])`ına\n * (0,2,0) yenilir: açık ezme koyu temaya sızmaz.\n */\nconst THEME_ROOT = 'html:root';\n\n/** Verilen şemanın tam token eşlemesi — ezmeler uygulanmış hâliyle. */\nexport const resolveTokens = (scheme: UiColorScheme, config?: UiThemeConfig): UiResolvedTokens => {\n  const base = scheme === 'dark' ? DARK_THEME : LIGHT_THEME;\n  const overrides = (scheme === 'dark' ? config?.dark : config?.light) ?? {};\n\n  return { ...base, ...overrides };\n};\n\n/**\n * Yapılandırmayı CSS metnine çevirir. Çıktının tamamı `@layer ui` içinde: tüketicinin katmansız\n * her kuralı ezmeyi özgüllükten ve sıradan bağımsız yener (README, \"CSS'imizi ezmek\").\n * ⚠ 5.6.2'ye kadar ezme katmansızdı: `:root:not([data-ui-theme])` (0,2,0) tüketicinin `<html>`e\n * yazdığı ezmeyi (`html:has(.panel)`, 0,1,1) hidrasyondan SONRA eziyordu — sunucu çiziminde\n * tüketicinin rengi, bir kare sonra temanınki (ölçüldü: panelin kırmızı sil düğmesi koyu temada\n * beyaza dönüyordu). Katmansız açık ezme koyu varsayılanı da yeniyor, koyu temaya sızıyordu.\n */\nexport const buildThemeCss = (config: UiThemeConfig): string => {\n  const blocks: string[] = [];\n\n  const declarations = (tokens: Record<string, string>, indent = '  ') =>\n    Object.entries(tokens)\n      .map(([name, value]) => `${indent}${TOKEN_PREFIX}${name}: ${value};`)\n      .join('\\n');\n\n  const fonts = config.fonts ?? {};\n  const fontEntries = Object.entries(fonts).filter(([, value]) => Boolean(value)) as [\n    keyof typeof DEFAULT_FONTS,\n    string,\n  ][];\n\n  if (fontEntries.length > 0)\n    blocks.push(\n      `${THEME_ROOT} {\\n${fontEntries\n        .map(([role, stack]) => `  ${TOKEN_PREFIX}font-${role}: ${stack};`)\n        .join('\\n')}\\n}`,\n    );\n\n  /* OLCU EZMELERI TEMA BASINA DEGIL, TEK BLOKTA. */\n  const metrics = config.metrics ?? {};\n\n  if (Object.keys(metrics).length > 0) {\n    const body = declarations(metrics as Record<string, string>);\n    blocks.push(`${THEME_ROOT} {\\n${body}\\n}`);\n    blocks.push(`${THEME_ROOT}[${DENSITY_ATTRIBUTE}='compact'] {\\n${body}\\n}`);\n  }\n\n  /*\n   * Acik tema iki secicide birden yazilir: `html:root` (varsayilan) ve\n   * `html:root[data-ui-theme='light']` (kullanicinin acik secimi).\n   */\n  if (config.light && Object.keys(config.light).length > 0) {\n    const body = declarations(config.light);\n    blocks.push(`${THEME_ROOT} {\\n${body}\\n}`);\n    blocks.push(`${THEME_ROOT}[${THEME_ATTRIBUTE}='light'] {\\n${body}\\n}`);\n  }\n\n  if (config.dark && Object.keys(config.dark).length > 0) {\n    const body = declarations(config.dark);\n    blocks.push(`${THEME_ROOT}[${THEME_ATTRIBUTE}='dark'] {\\n${body}\\n}`);\n    blocks.push(\n      `@media (prefers-color-scheme: dark) {\\n  ${THEME_ROOT}:not([${THEME_ATTRIBUTE}]) {\\n${declarations(\n        config.dark,\n        '    ',\n      )}\\n  }\\n}`,\n    );\n  }\n\n  if (blocks.length === 0) return '';\n\n  return `@layer ${THEME_LAYER} {\\n${blocks.join('\\n\\n').replace(/^(?=.)/gm, '  ')}\\n}`;\n};\n\n/**\n * `<style>` içine HTML olarak yazılacak CSS: `</style` dizisi etiketi kapatamaz. Değerler\n * yapılandırmadan (kiracının veritabanındaki marka rengi) gelebilir; `\\/` CSS'te `/` demek.\n */\nexport const toStyleHtml = (css: string): string => css.replace(/<\\/style/gi, '<\\\\/style');\n\n/**\n * Ezmeleri `<head>`in sonuna yazar — React dışındaki yol (`initUi`); sağlayıcı ezmeyi ağaçta\n * çizer.\n * ⚠ Stil sayfalarından SONRA çağrılmalı: `@layer ui` belgede ilk kez burada görülürse katman\n * sırası buradan kurulur ve tüketicinin sonra gelen `@layer reset, ui;` bildirimi `reset`i\n * `ui`nin üstüne koyar.\n */\nexport const applyThemeConfig = (config: UiThemeConfig | undefined): void => {\n  if (!isClient()) return;\n\n  const css = config ? buildThemeCss(config) : '';\n  const existing = document.getElementById(THEME_STYLE_ID);\n\n  if (css === '') {\n    existing?.remove();\n    return;\n  }\n\n  const element = existing ?? document.createElement('style');\n  element.id = THEME_STYLE_ID;\n  element.textContent = css;\n\n  if (!existing) document.head.appendChild(element);\n};\n\n/**\n * İLK BOYAMADAN ÖNCE çalışacak tema betiği — `<head>` içine, React ağacından ÖNCE.\n * Kayıtlı açık seçimi (`light` / `dark`) `<html data-ui-theme>`e yazar; kayıt yoksa öznitelik\n * yazılmaz ve sistem tercihi izlenir.\n * ⚠ React ağacına konamaz: sağlayıcı ağaç monte olduktan sonra çalışıyor ve koyu tema seçmiş\n * kullanıcı o ana kadar bir kare beyaz ekran görüyordu. İki tüketici bu betiği ELLE yazıyordu.\n * ⚠ Depolama okunamazsa (gizli pencere, engellenmiş site verisi) sessizce sistem tercihine düşer.\n * @example <script dangerouslySetInnerHTML={{ __html: themeBootScript({ storageKey: 'theme' }) }} />\n */\nexport const themeBootScript = ({ storageKey }: { storageKey: string }): string =>\n  `(function(){try{var t=localStorage.getItem(${JSON.stringify(storageKey)});` +\n  `if(t===\"light\"||t===\"dark\")document.documentElement.setAttribute(\"${THEME_ATTRIBUTE}\",t)}` +\n  `catch(e){}})()`;\n"],"names":["TOKEN_PREFIX","THEME_STYLE_ID","THEME_ATTRIBUTE","DENSITY_ATTRIBUTE","THEME_SWITCHING_CLASS","THEME_LAYER","THEME_ROOT","resolveTokens","scheme","config","base","DARK_THEME","LIGHT_THEME","overrides","buildThemeCss","blocks","declarations","tokens","indent","name","value","fonts","fontEntries","role","stack","metrics","body","toStyleHtml","css","applyThemeConfig","isClient","existing","element","themeBootScript","storageKey"],"mappings":";;AAMO,MAAMA,IAAe,SAGfC,IAAiB,sBAGjBC,IAAkB,iBAGlBC,IAAoB,mBAGpBC,IAAwB,sBAGxBC,IAAc,MAQrBC,IAAa,aAGNC,IAAgB,CAACC,GAAuBC,MAA6C;AAChG,QAAMC,IAAOF,MAAW,SAASG,IAAaC,GACxCC,KAAaL,MAAW,SAASC,KAAA,gBAAAA,EAAQ,OAAOA,KAAA,gBAAAA,EAAQ,UAAU,CAAA;AAExE,SAAO,EAAE,GAAGC,GAAM,GAAGG,EAAA;AACvB,GAUaC,IAAgB,CAACL,MAAkC;AAC9D,QAAMM,IAAmB,CAAA,GAEnBC,IAAe,CAACC,GAAgCC,IAAS,SAC7D,OAAO,QAAQD,CAAM,EAClB,IAAI,CAAC,CAACE,GAAMC,CAAK,MAAM,GAAGF,CAAM,GAAGlB,CAAY,GAAGmB,CAAI,KAAKC,CAAK,GAAG,EACnE,KAAK;AAAA,CAAI,GAERC,IAAQZ,EAAO,SAAS,CAAA,GACxBa,IAAc,OAAO,QAAQD,CAAK,EAAE,OAAO,CAAC,GAAGD,CAAK,MAAM,EAAQA,CAAM;AAK9E,EAAIE,EAAY,SAAS,KACvBP,EAAO;AAAA,IACL,GAAGT,CAAU;AAAA,EAAOgB,EACjB,IAAI,CAAC,CAACC,GAAMC,CAAK,MAAM,KAAKxB,CAAY,QAAQuB,CAAI,KAAKC,CAAK,GAAG,EACjE,KAAK;AAAA,CAAI,CAAC;AAAA;AAAA,EAAA;AAIjB,QAAMC,IAAUhB,EAAO,WAAW,CAAA;AAElC,MAAI,OAAO,KAAKgB,CAAO,EAAE,SAAS,GAAG;AACnC,UAAMC,IAAOV,EAAaS,CAAiC;AAC3D,IAAAV,EAAO,KAAK,GAAGT,CAAU;AAAA,EAAOoB,CAAI;AAAA,EAAK,GACzCX,EAAO,KAAK,GAAGT,CAAU,IAAIH,CAAiB;AAAA,EAAkBuB,CAAI;AAAA,EAAK;AAAA,EAC3E;AAMA,MAAIjB,EAAO,SAAS,OAAO,KAAKA,EAAO,KAAK,EAAE,SAAS,GAAG;AACxD,UAAMiB,IAAOV,EAAaP,EAAO,KAAK;AACtC,IAAAM,EAAO,KAAK,GAAGT,CAAU;AAAA,EAAOoB,CAAI;AAAA,EAAK,GACzCX,EAAO,KAAK,GAAGT,CAAU,IAAIJ,CAAe;AAAA,EAAgBwB,CAAI;AAAA,EAAK;AAAA,EACvE;AAEA,MAAIjB,EAAO,QAAQ,OAAO,KAAKA,EAAO,IAAI,EAAE,SAAS,GAAG;AACtD,UAAMiB,IAAOV,EAAaP,EAAO,IAAI;AACrC,IAAAM,EAAO,KAAK,GAAGT,CAAU,IAAIJ,CAAe;AAAA,EAAewB,CAAI;AAAA,EAAK,GACpEX,EAAO;AAAA,MACL;AAAA,IAA4CT,CAAU,SAASJ,CAAe;AAAA,EAASc;AAAA,QACrFP,EAAO;AAAA,QACP;AAAA,MAAA,CACD;AAAA;AAAA;AAAA,IAAA;AAAA,EAEL;AAEA,SAAIM,EAAO,WAAW,IAAU,KAEzB,UAAUV,CAAW;AAAA,EAAOU,EAAO,KAAK;AAAA;AAAA,CAAM,EAAE,QAAQ,YAAY,IAAI,CAAC;AAAA;AAClF,GAMaY,IAAc,CAACC,MAAwBA,EAAI,QAAQ,cAAc,WAAW,GAS5EC,IAAmB,CAACpB,MAA4C;AAC3E,MAAI,CAACqB,IAAY;AAEjB,QAAMF,IAAMnB,IAASK,EAAcL,CAAM,IAAI,IACvCsB,IAAW,SAAS,eAAe9B,CAAc;AAEvD,MAAI2B,MAAQ,IAAI;AACd,IAAAG,KAAA,QAAAA,EAAU;AACV;AAAA,EACF;AAEA,QAAMC,IAAUD,KAAY,SAAS,cAAc,OAAO;AAC1D,EAAAC,EAAQ,KAAK/B,GACb+B,EAAQ,cAAcJ,GAEjBG,KAAU,SAAS,KAAK,YAAYC,CAAO;AAClD,GAWaC,IAAkB,CAAC,EAAE,YAAAC,EAAA,MAChC,8CAA8C,KAAK,UAAUA,CAAU,CAAC,uEACHhC,CAAe;"}
+{"version":3,"file":"theme.helper.js","sources":["../../src/helpers/theme.helper.ts"],"sourcesContent":["import {\n  THEME_ATTRIBUTE,\n  THEME_STORAGE_KEY,\n  type ThemeName,\n  type ThemePreference,\n} from '@handijit/design';\nimport { isClient } from '@handijit/utils';\n\n/** Turns transitions off for one frame while the theme flips (see `base.scss`). */\nexport const THEME_SWITCHING_CLASS = 'ui-theme-switching';\n\nconst DARK_QUERY = '(prefers-color-scheme: dark)';\n\nconst isThemeName = (value: unknown): value is ThemeName => value === 'light' || value === 'dark';\n\n/** The operating system's setting; `light` on the server. */\nexport const readSystemTheme = (): ThemeName =>\n  isClient() && window.matchMedia?.(DARK_QUERY).matches ? 'dark' : 'light';\n\n/**\n * The user's stored choice. \"System\" is the absence of the key, and a storage that throws (private\n * window, blocked site data) counts as no choice — the same reading as the design boot script.\n */\nexport const readStoredPreference = (): ThemePreference => {\n  if (!isClient()) return 'system';\n\n  try {\n    const stored = window.localStorage.getItem(THEME_STORAGE_KEY);\n    return isThemeName(stored) ? stored : 'system';\n  } catch {\n    return 'system';\n  }\n};\n\n/** The theme drawn on the page: the root attribute when it names a theme, else the system's. */\nexport const readActiveTheme = (): ThemeName => {\n  if (!isClient()) return 'light';\n\n  const attribute = document.documentElement.getAttribute(THEME_ATTRIBUTE);\n  return isThemeName(attribute) ? attribute : readSystemTheme();\n};\n\n/**\n * Stores the choice and applies it to the root element, the way `@handijit/design` documents it:\n * only `light` / `dark` are stored, \"system\" removes the key, and the attribute always carries the\n * resolved theme so the boot script and this function agree.\n */\nexport const applyThemePreference = (preference: ThemePreference): void => {\n  if (!isClient()) return;\n\n  try {\n    if (preference === 'system') window.localStorage.removeItem(THEME_STORAGE_KEY);\n    else window.localStorage.setItem(THEME_STORAGE_KEY, preference);\n  } catch {\n    /* The choice still applies for this page view; it just cannot be remembered. */\n  }\n\n  document.documentElement.setAttribute(\n    THEME_ATTRIBUTE,\n    preference === 'system' ? readSystemTheme() : preference,\n  );\n};\n"],"names":["THEME_SWITCHING_CLASS","DARK_QUERY","isThemeName","value","readSystemTheme","isClient","_a","readStoredPreference","stored","THEME_STORAGE_KEY","readActiveTheme","attribute","THEME_ATTRIBUTE","applyThemePreference","preference"],"mappings":";;AASO,MAAMA,IAAwB,sBAE/BC,IAAa,gCAEbC,IAAc,CAACC,MAAuCA,MAAU,WAAWA,MAAU,QAG9EC,IAAkB,MAAA;;AAC7B,SAAAC,EAAA,OAAcC,IAAA,OAAO,eAAP,QAAAA,EAAA,aAAoBL,GAAY,WAAU,SAAS;AAAA,GAMtDM,IAAuB,MAAuB;AACzD,MAAI,CAACF,EAAA,EAAY,QAAO;AAExB,MAAI;AACF,UAAMG,IAAS,OAAO,aAAa,QAAQC,CAAiB;AAC5D,WAAOP,EAAYM,CAAM,IAAIA,IAAS;AAAA,EACxC,QAAQ;AACN,WAAO;AAAA,EACT;AACF,GAGaE,IAAkB,MAAiB;AAC9C,MAAI,CAACL,EAAA,EAAY,QAAO;AAExB,QAAMM,IAAY,SAAS,gBAAgB,aAAaC,CAAe;AACvE,SAAOV,EAAYS,CAAS,IAAIA,IAAYP,EAAA;AAC9C,GAOaS,IAAuB,CAACC,MAAsC;AACzE,MAAKT,KAEL;AAAA,QAAI;AACF,MAAIS,MAAe,WAAU,OAAO,aAAa,WAAWL,CAAiB,IACxE,OAAO,aAAa,QAAQA,GAAmBK,CAAU;AAAA,IAChE,QAAQ;AAAA,IAER;AAEA,aAAS,gBAAgB;AAAA,MACvBF;AAAA,MACAE,MAAe,WAAWV,MAAoBU;AAAA,IAAA;AAAA;AAElD;"}

package/build/hooks/useUiTheme.cjs

@@ -1,2 +1,2 @@
-"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react"),c=require("@handijit/utils"),n=require("../helpers/theme.helper.cjs"),m=()=>{var e;return c.isClient()&&((e=window.matchMedia)!=null&&e.call(window,"(prefers-color-scheme: dark)").matches)?"dark":"light"},S=()=>{if(!c.isClient())return"system";const e=document.documentElement.getAttribute(n.THEME_ATTRIBUTE);return e==="dark"||e==="light"?e:"system"},T=()=>{const[e,o]=s.useState("light"),[l,u]=s.useState("light"),[d,h]=s.useState(!1);s.useEffect(()=>{o(S()),u(m()),h(!0)},[]),s.useEffect(()=>{if(!c.isClient()||!window.matchMedia)return;const r=window.matchMedia("(prefers-color-scheme: dark)"),t=()=>u(m());return r.addEventListener("change",t),()=>r.removeEventListener("change",t)},[]);const i=e==="system"?l:e,a=s.useCallback(r=>{if(!c.isClient())return;const t=document.documentElement;t.classList.add(n.THEME_SWITCHING_CLASS),r==="system"?t.removeAttribute(n.THEME_ATTRIBUTE):t.setAttribute(n.THEME_ATTRIBUTE,r),o(r),window.requestAnimationFrame(()=>{window.requestAnimationFrame(()=>t.classList.remove(n.THEME_SWITCHING_CLASS))})},[]),E=s.useCallback(()=>a(i==="dark"?"light":"dark"),[i,a]);return{scheme:i,preference:e,setScheme:a,toggle:E,isReady:d}};exports.default=T;
+"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react"),T=require("@handijit/design"),l=require("@handijit/utils"),e=require("../helpers/theme.helper.cjs"),E=()=>{const[m,o]=r.useState("system"),[c,i]=r.useState("light"),[h,S]=r.useState(!1);r.useEffect(()=>{var d;if(!l.isClient())return;const t=()=>{o(e.readStoredPreference()),i(e.readActiveTheme())};t(),S(!0);const n=new MutationObserver(t);n.observe(document.documentElement,{attributes:!0,attributeFilter:[T.THEME_ATTRIBUTE]});const s=(d=window.matchMedia)==null?void 0:d.call(window,"(prefers-color-scheme: dark)"),u=()=>{e.readStoredPreference()==="system"&&e.applyThemePreference("system"),t()};return s==null||s.addEventListener("change",u),()=>{n.disconnect(),s==null||s.removeEventListener("change",u)}},[]);const a=r.useCallback(t=>{if(!l.isClient())return;const n=document.documentElement;n.classList.add(e.THEME_SWITCHING_CLASS),e.applyThemePreference(t),o(t),i(e.readActiveTheme()),window.requestAnimationFrame(()=>{window.requestAnimationFrame(()=>n.classList.remove(e.THEME_SWITCHING_CLASS))})},[]),f=r.useCallback(()=>a(c==="dark"?"light":"dark"),[c,a]);return{scheme:c,preference:m,setScheme:a,toggle:f,isReady:h}};exports.default=E;
 //# sourceMappingURL=useUiTheme.cjs.map

package/build/hooks/useUiTheme.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useUiTheme.cjs","sources":["../../src/hooks/useUiTheme.ts"],"sourcesContent":["'use client';\n\nimport { useCallback, useEffect, useState } from 'react';\n\nimport { isClient } from '@handijit/utils';\n\nimport { THEME_ATTRIBUTE, THEME_SWITCHING_CLASS } from '../helpers/theme.helper';\nimport type { UiColorPreference, UiColorScheme, UiThemeState } from '@/types/theme.type';\n\n/** Sistem tercihini okur. */\nconst readSystemScheme = (): UiColorScheme =>\n  isClient() && window.matchMedia?.('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';\n\n/** `<html>` üzerindeki AÇIK seçim; öznitelik yoksa `system`. */\nconst readPreference = (): UiColorPreference => {\n  if (!isClient()) return 'system';\n\n  const attribute = document.documentElement.getAttribute(THEME_ATTRIBUTE);\n  return attribute === 'dark' || attribute === 'light' ? attribute : 'system';\n};\n\n/**\n * Açık/koyu seçimini okur ve değiştirir.\n * @example const { scheme, toggle, isReady } = useUiTheme();\n */\nconst useUiTheme = (): UiThemeState => {\n  /*\n   * Ilk deger SABIT 'light': sunucuda `document` yok ve istemcideki gercek degeri ilk render'da\n   * okumak hidrasyon uyusmazligi uretiyordu (sunucu \"light\"…\n   */\n  const [preference, setPreferenceState] = useState<UiColorPreference>('light');\n  const [systemScheme, setSystemScheme] = useState<UiColorScheme>('light');\n  const [isReady, setIsReady] = useState(false);\n\n  useEffect(() => {\n    setPreferenceState(readPreference());\n    setSystemScheme(readSystemScheme());\n    setIsReady(true);\n  }, []);\n\n  /* Sistem tercihi HER ZAMAN izlenir, `preference` ne olursa olsun. */\n  useEffect(() => {\n    if (!isClient() || !window.matchMedia) return;\n\n    const query = window.matchMedia('(prefers-color-scheme: dark)');\n    const handleChange = () => setSystemScheme(readSystemScheme());\n\n    query.addEventListener('change', handleChange);\n    return () => query.removeEventListener('change', handleChange);\n  }, []);\n\n  const scheme: UiColorScheme = preference === 'system' ? systemScheme : preference;\n\n  const setScheme = useCallback((next: UiColorPreference) => {\n    if (!isClient()) return;\n\n    const root = document.documentElement;\n\n    root.classList.add(THEME_SWITCHING_CLASS);\n\n    /*\n     * `system` bir DEGER degil, degerin YOKLUGU: oznitelik silinir ve `_tokens.generated.scss`\n     * icindeki `:not([data-ui-theme])` sorgusu devreye girer.…\n     */\n    if (next === 'system') root.removeAttribute(THEME_ATTRIBUTE);\n    else root.setAttribute(THEME_ATTRIBUTE, next);\n\n    setPreferenceState(next);\n\n    /* Sinif BIR SONRAKI karede kaldirilir. */\n    window.requestAnimationFrame(() => {\n      window.requestAnimationFrame(() => root.classList.remove(THEME_SWITCHING_CLASS));\n    });\n  }, []);\n\n  const toggle = useCallback(\n    () => setScheme(scheme === 'dark' ? 'light' : 'dark'),\n    [scheme, setScheme],\n  );\n\n  return { scheme, preference, setScheme, toggle, isReady };\n};\n\nexport default useUiTheme;\n"],"names":["readSystemScheme","isClient","_a","readPreference","attribute","THEME_ATTRIBUTE","useUiTheme","preference","setPreferenceState","useState","systemScheme","setSystemScheme","isReady","setIsReady","useEffect","query","handleChange","scheme","setScheme","useCallback","next","root","THEME_SWITCHING_CLASS","toggle"],"mappings":"wNASMA,EAAmB,IAAA,OACvBC,OAAAA,EAAAA,SAAA,KAAcC,EAAA,OAAO,aAAP,MAAAA,EAAA,YAAoB,gCAAgC,SAAU,OAAS,SAGjFC,EAAiB,IAAyB,CAC9C,GAAI,CAACF,EAAAA,SAAA,EAAY,MAAO,SAExB,MAAMG,EAAY,SAAS,gBAAgB,aAAaC,EAAAA,eAAe,EACvE,OAAOD,IAAc,QAAUA,IAAc,QAAUA,EAAY,QACrE,EAMME,EAAa,IAAoB,CAKrC,KAAM,CAACC,EAAYC,CAAkB,EAAIC,EAAAA,SAA4B,OAAO,EACtE,CAACC,EAAcC,CAAe,EAAIF,EAAAA,SAAwB,OAAO,EACjE,CAACG,EAASC,CAAU,EAAIJ,EAAAA,SAAS,EAAK,EAE5CK,EAAAA,UAAU,IAAM,CACdN,EAAmBL,GAAgB,EACnCQ,EAAgBX,GAAkB,EAClCa,EAAW,EAAI,CACjB,EAAG,CAAA,CAAE,EAGLC,EAAAA,UAAU,IAAM,CACd,GAAI,CAACb,EAAAA,SAAA,GAAc,CAAC,OAAO,WAAY,OAEvC,MAAMc,EAAQ,OAAO,WAAW,8BAA8B,EACxDC,EAAe,IAAML,EAAgBX,GAAkB,EAE7D,OAAAe,EAAM,iBAAiB,SAAUC,CAAY,EACtC,IAAMD,EAAM,oBAAoB,SAAUC,CAAY,CAC/D,EAAG,CAAA,CAAE,EAEL,MAAMC,EAAwBV,IAAe,SAAWG,EAAeH,EAEjEW,EAAYC,cAAaC,GAA4B,CACzD,GAAI,CAACnB,EAAAA,WAAY,OAEjB,MAAMoB,EAAO,SAAS,gBAEtBA,EAAK,UAAU,IAAIC,uBAAqB,EAMpCF,IAAS,SAAUC,EAAK,gBAAgBhB,EAAAA,eAAe,EACtDgB,EAAK,aAAahB,EAAAA,gBAAiBe,CAAI,EAE5CZ,EAAmBY,CAAI,EAGvB,OAAO,sBAAsB,IAAM,CACjC,OAAO,sBAAsB,IAAMC,EAAK,UAAU,OAAOC,EAAAA,qBAAqB,CAAC,CACjF,CAAC,CACH,EAAG,CAAA,CAAE,EAECC,EAASJ,EAAAA,YACb,IAAMD,EAAUD,IAAW,OAAS,QAAU,MAAM,EACpD,CAACA,EAAQC,CAAS,CAAA,EAGpB,MAAO,CAAE,OAAAD,EAAQ,WAAAV,EAAY,UAAAW,EAAW,OAAAK,EAAQ,QAAAX,CAAA,CAClD"}
+{"version":3,"file":"useUiTheme.cjs","sources":["../../src/hooks/useUiTheme.ts"],"sourcesContent":["'use client';\n\nimport { useCallback, useEffect, useState } from 'react';\n\nimport { THEME_ATTRIBUTE } from '@handijit/design';\nimport { isClient } from '@handijit/utils';\n\nimport {\n  applyThemePreference,\n  readActiveTheme,\n  readStoredPreference,\n  THEME_SWITCHING_CLASS,\n} from '../helpers/theme.helper';\nimport type { UiColorPreference, UiColorScheme, UiThemeState } from '@/types/theme.type';\n\n/**\n * Reads and changes the light/dark choice, on the `data-theme` contract of `@handijit/design`.\n *\n * The choice lives where the design boot script reads it (`localStorage[\"hd-theme\"]`), so a choice\n * made here survives a reload without a flash when `UiThemeScript` is in `<head>`.\n * @example const { scheme, toggle, isReady } = useUiTheme();\n */\nconst useUiTheme = (): UiThemeState => {\n  /*\n   * The first value is a constant: the server has no `document`, and reading the real value during\n   * the first client render produced a hydration mismatch. `isReady` tells when it is real.\n   */\n  const [preference, setPreferenceState] = useState<UiColorPreference>('system');\n  const [scheme, setSchemeState] = useState<UiColorScheme>('light');\n  const [isReady, setIsReady] = useState(false);\n\n  useEffect(() => {\n    if (!isClient()) return;\n\n    const sync = () => {\n      setPreferenceState(readStoredPreference());\n      setSchemeState(readActiveTheme());\n    };\n\n    sync();\n    setIsReady(true);\n\n    /* The boot script, another hook instance or the application may write the attribute. */\n    const observer = new MutationObserver(sync);\n    observer.observe(document.documentElement, {\n      attributes: true,\n      attributeFilter: [THEME_ATTRIBUTE],\n    });\n\n    /*\n     * Without the boot script nobody rewrites the attribute when the system setting changes; a page\n     * that follows the system has to be moved here.\n     */\n    const query = window.matchMedia?.('(prefers-color-scheme: dark)');\n    const handleSystemChange = () => {\n      if (readStoredPreference() === 'system') applyThemePreference('system');\n      sync();\n    };\n    query?.addEventListener('change', handleSystemChange);\n\n    return () => {\n      observer.disconnect();\n      query?.removeEventListener('change', handleSystemChange);\n    };\n  }, []);\n\n  const setScheme = useCallback((next: UiColorPreference) => {\n    if (!isClient()) return;\n\n    const root = document.documentElement;\n\n    root.classList.add(THEME_SWITCHING_CLASS);\n    applyThemePreference(next);\n    setPreferenceState(next);\n    setSchemeState(readActiveTheme());\n\n    /* The class comes off on the NEXT frame, after the new colours have been painted once. */\n    window.requestAnimationFrame(() => {\n      window.requestAnimationFrame(() => root.classList.remove(THEME_SWITCHING_CLASS));\n    });\n  }, []);\n\n  const toggle = useCallback(\n    () => setScheme(scheme === 'dark' ? 'light' : 'dark'),\n    [scheme, setScheme],\n  );\n\n  return { scheme, preference, setScheme, toggle, isReady };\n};\n\nexport default useUiTheme;\n"],"names":["useUiTheme","preference","setPreferenceState","useState","scheme","setSchemeState","isReady","setIsReady","useEffect","isClient","sync","readStoredPreference","readActiveTheme","observer","THEME_ATTRIBUTE","query","_a","handleSystemChange","applyThemePreference","setScheme","useCallback","next","root","THEME_SWITCHING_CLASS","toggle"],"mappings":"sPAqBMA,EAAa,IAAoB,CAKrC,KAAM,CAACC,EAAYC,CAAkB,EAAIC,EAAAA,SAA4B,QAAQ,EACvE,CAACC,EAAQC,CAAc,EAAIF,EAAAA,SAAwB,OAAO,EAC1D,CAACG,EAASC,CAAU,EAAIJ,EAAAA,SAAS,EAAK,EAE5CK,EAAAA,UAAU,IAAM,OACd,GAAI,CAACC,EAAAA,WAAY,OAEjB,MAAMC,EAAO,IAAM,CACjBR,EAAmBS,EAAAA,sBAAsB,EACzCN,EAAeO,EAAAA,iBAAiB,CAClC,EAEAF,EAAA,EACAH,EAAW,EAAI,EAGf,MAAMM,EAAW,IAAI,iBAAiBH,CAAI,EAC1CG,EAAS,QAAQ,SAAS,gBAAiB,CACzC,WAAY,GACZ,gBAAiB,CAACC,EAAAA,eAAe,CAAA,CAClC,EAMD,MAAMC,GAAQC,EAAA,OAAO,aAAP,YAAAA,EAAA,YAAoB,gCAC5BC,EAAqB,IAAM,CAC3BN,uBAAA,IAA2B,UAAUO,EAAAA,qBAAqB,QAAQ,EACtER,EAAA,CACF,EACA,OAAAK,GAAA,MAAAA,EAAO,iBAAiB,SAAUE,GAE3B,IAAM,CACXJ,EAAS,WAAA,EACTE,GAAA,MAAAA,EAAO,oBAAoB,SAAUE,EACvC,CACF,EAAG,CAAA,CAAE,EAEL,MAAME,EAAYC,cAAaC,GAA4B,CACzD,GAAI,CAACZ,EAAAA,WAAY,OAEjB,MAAMa,EAAO,SAAS,gBAEtBA,EAAK,UAAU,IAAIC,uBAAqB,EACxCL,EAAAA,qBAAqBG,CAAI,EACzBnB,EAAmBmB,CAAI,EACvBhB,EAAeO,EAAAA,iBAAiB,EAGhC,OAAO,sBAAsB,IAAM,CACjC,OAAO,sBAAsB,IAAMU,EAAK,UAAU,OAAOC,EAAAA,qBAAqB,CAAC,CACjF,CAAC,CACH,EAAG,CAAA,CAAE,EAECC,EAASJ,EAAAA,YACb,IAAMD,EAAUf,IAAW,OAAS,QAAU,MAAM,EACpD,CAACA,EAAQe,CAAS,CAAA,EAGpB,MAAO,CAAE,OAAAf,EAAQ,WAAAH,EAAY,UAAAkB,EAAW,OAAAK,EAAQ,QAAAlB,CAAA,CAClD"}

package/build/hooks/useUiTheme.d.ts

@@ -1,6 +1,9 @@
 import { UiThemeState } from '../types/theme.type';
 /**
- * Açık/koyu seçimini okur ve değiştirir.
+ * Reads and changes the light/dark choice, on the `data-theme` contract of `@handijit/design`.
+ *
+ * The choice lives where the design boot script reads it (`localStorage["hd-theme"]`), so a choice
+ * made here survives a reload without a flash when `UiThemeScript` is in `<head>`.
  * @example const { scheme, toggle, isReady } = useUiTheme();
  */
 declare const useUiTheme: () => UiThemeState;

package/build/hooks/useUiTheme.js

@@ -1,36 +1,42 @@
 "use client";
-import { useState as c, useEffect as d, useCallback as u } from "react";
-import { isClient as r } from "@handijit/utils";
-import { THEME_SWITCHING_CLASS as h, THEME_ATTRIBUTE as m } from "../helpers/theme.helper.js";
-const l = () => {
-  var e;
-  return r() && ((e = window.matchMedia) != null && e.call(window, "(prefers-color-scheme: dark)").matches) ? "dark" : "light";
-}, y = () => {
-  if (!r()) return "system";
-  const e = document.documentElement.getAttribute(m);
-  return e === "dark" || e === "light" ? e : "system";
-}, A = () => {
-  const [e, a] = c("light"), [f, i] = c("light"), [g, S] = c(!1);
-  d(() => {
-    a(y()), i(l()), S(!0);
-  }, []), d(() => {
-    if (!r() || !window.matchMedia) return;
-    const s = window.matchMedia("(prefers-color-scheme: dark)"), t = () => i(l());
-    return s.addEventListener("change", t), () => s.removeEventListener("change", t);
+import { useState as o, useEffect as g, useCallback as d } from "react";
+import { THEME_ATTRIBUTE as w } from "@handijit/design";
+import { isClient as u } from "@handijit/utils";
+import { THEME_SWITCHING_CLASS as l, applyThemePreference as f, readActiveTheme as h, readStoredPreference as E } from "../helpers/theme.helper.js";
+const L = () => {
+  const [S, c] = o("system"), [r, a] = o("light"), [p, T] = o(!1);
+  g(() => {
+    var m;
+    if (!u()) return;
+    const e = () => {
+      c(E()), a(h());
+    };
+    e(), T(!0);
+    const s = new MutationObserver(e);
+    s.observe(document.documentElement, {
+      attributes: !0,
+      attributeFilter: [w]
+    });
+    const t = (m = window.matchMedia) == null ? void 0 : m.call(window, "(prefers-color-scheme: dark)"), i = () => {
+      E() === "system" && f("system"), e();
+    };
+    return t == null || t.addEventListener("change", i), () => {
+      s.disconnect(), t == null || t.removeEventListener("change", i);
+    };
   }, []);
-  const n = e === "system" ? f : e, o = u((s) => {
-    if (!r()) return;
-    const t = document.documentElement;
-    t.classList.add(h), s === "system" ? t.removeAttribute(m) : t.setAttribute(m, s), a(s), window.requestAnimationFrame(() => {
-      window.requestAnimationFrame(() => t.classList.remove(h));
+  const n = d((e) => {
+    if (!u()) return;
+    const s = document.documentElement;
+    s.classList.add(l), f(e), c(e), a(h()), window.requestAnimationFrame(() => {
+      window.requestAnimationFrame(() => s.classList.remove(l));
     });
-  }, []), w = u(
-    () => o(n === "dark" ? "light" : "dark"),
-    [n, o]
+  }, []), v = d(
+    () => n(r === "dark" ? "light" : "dark"),
+    [r, n]
   );
-  return { scheme: n, preference: e, setScheme: o, toggle: w, isReady: g };
+  return { scheme: r, preference: S, setScheme: n, toggle: v, isReady: p };
 };
 export {
-  A as default
+  L as default
 };
 //# sourceMappingURL=useUiTheme.js.map

package/build/hooks/useUiTheme.js.map

@@ -1 +1 @@
-{"version":3,"file":"useUiTheme.js","sources":["../../src/hooks/useUiTheme.ts"],"sourcesContent":["'use client';\n\nimport { useCallback, useEffect, useState } from 'react';\n\nimport { isClient } from '@handijit/utils';\n\nimport { THEME_ATTRIBUTE, THEME_SWITCHING_CLASS } from '../helpers/theme.helper';\nimport type { UiColorPreference, UiColorScheme, UiThemeState } from '@/types/theme.type';\n\n/** Sistem tercihini okur. */\nconst readSystemScheme = (): UiColorScheme =>\n  isClient() && window.matchMedia?.('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';\n\n/** `<html>` üzerindeki AÇIK seçim; öznitelik yoksa `system`. */\nconst readPreference = (): UiColorPreference => {\n  if (!isClient()) return 'system';\n\n  const attribute = document.documentElement.getAttribute(THEME_ATTRIBUTE);\n  return attribute === 'dark' || attribute === 'light' ? attribute : 'system';\n};\n\n/**\n * Açık/koyu seçimini okur ve değiştirir.\n * @example const { scheme, toggle, isReady } = useUiTheme();\n */\nconst useUiTheme = (): UiThemeState => {\n  /*\n   * Ilk deger SABIT 'light': sunucuda `document` yok ve istemcideki gercek degeri ilk render'da\n   * okumak hidrasyon uyusmazligi uretiyordu (sunucu \"light\"…\n   */\n  const [preference, setPreferenceState] = useState<UiColorPreference>('light');\n  const [systemScheme, setSystemScheme] = useState<UiColorScheme>('light');\n  const [isReady, setIsReady] = useState(false);\n\n  useEffect(() => {\n    setPreferenceState(readPreference());\n    setSystemScheme(readSystemScheme());\n    setIsReady(true);\n  }, []);\n\n  /* Sistem tercihi HER ZAMAN izlenir, `preference` ne olursa olsun. */\n  useEffect(() => {\n    if (!isClient() || !window.matchMedia) return;\n\n    const query = window.matchMedia('(prefers-color-scheme: dark)');\n    const handleChange = () => setSystemScheme(readSystemScheme());\n\n    query.addEventListener('change', handleChange);\n    return () => query.removeEventListener('change', handleChange);\n  }, []);\n\n  const scheme: UiColorScheme = preference === 'system' ? systemScheme : preference;\n\n  const setScheme = useCallback((next: UiColorPreference) => {\n    if (!isClient()) return;\n\n    const root = document.documentElement;\n\n    root.classList.add(THEME_SWITCHING_CLASS);\n\n    /*\n     * `system` bir DEGER degil, degerin YOKLUGU: oznitelik silinir ve `_tokens.generated.scss`\n     * icindeki `:not([data-ui-theme])` sorgusu devreye girer.…\n     */\n    if (next === 'system') root.removeAttribute(THEME_ATTRIBUTE);\n    else root.setAttribute(THEME_ATTRIBUTE, next);\n\n    setPreferenceState(next);\n\n    /* Sinif BIR SONRAKI karede kaldirilir. */\n    window.requestAnimationFrame(() => {\n      window.requestAnimationFrame(() => root.classList.remove(THEME_SWITCHING_CLASS));\n    });\n  }, []);\n\n  const toggle = useCallback(\n    () => setScheme(scheme === 'dark' ? 'light' : 'dark'),\n    [scheme, setScheme],\n  );\n\n  return { scheme, preference, setScheme, toggle, isReady };\n};\n\nexport default useUiTheme;\n"],"names":["readSystemScheme","isClient","_a","readPreference","attribute","THEME_ATTRIBUTE","useUiTheme","preference","setPreferenceState","useState","systemScheme","setSystemScheme","isReady","setIsReady","useEffect","query","handleChange","scheme","setScheme","useCallback","next","root","THEME_SWITCHING_CLASS","toggle"],"mappings":";;;;AASA,MAAMA,IAAmB,MAAA;;AACvB,SAAAC,EAAA,OAAcC,IAAA,OAAO,eAAP,QAAAA,EAAA,aAAoB,gCAAgC,WAAU,SAAS;AAAA,GAGjFC,IAAiB,MAAyB;AAC9C,MAAI,CAACF,EAAA,EAAY,QAAO;AAExB,QAAMG,IAAY,SAAS,gBAAgB,aAAaC,CAAe;AACvE,SAAOD,MAAc,UAAUA,MAAc,UAAUA,IAAY;AACrE,GAMME,IAAa,MAAoB;AAKrC,QAAM,CAACC,GAAYC,CAAkB,IAAIC,EAA4B,OAAO,GACtE,CAACC,GAAcC,CAAe,IAAIF,EAAwB,OAAO,GACjE,CAACG,GAASC,CAAU,IAAIJ,EAAS,EAAK;AAE5C,EAAAK,EAAU,MAAM;AACd,IAAAN,EAAmBL,GAAgB,GACnCQ,EAAgBX,GAAkB,GAClCa,EAAW,EAAI;AAAA,EACjB,GAAG,CAAA,CAAE,GAGLC,EAAU,MAAM;AACd,QAAI,CAACb,EAAA,KAAc,CAAC,OAAO,WAAY;AAEvC,UAAMc,IAAQ,OAAO,WAAW,8BAA8B,GACxDC,IAAe,MAAML,EAAgBX,GAAkB;AAE7D,WAAAe,EAAM,iBAAiB,UAAUC,CAAY,GACtC,MAAMD,EAAM,oBAAoB,UAAUC,CAAY;AAAA,EAC/D,GAAG,CAAA,CAAE;AAEL,QAAMC,IAAwBV,MAAe,WAAWG,IAAeH,GAEjEW,IAAYC,EAAY,CAACC,MAA4B;AACzD,QAAI,CAACnB,IAAY;AAEjB,UAAMoB,IAAO,SAAS;AAEtB,IAAAA,EAAK,UAAU,IAAIC,CAAqB,GAMpCF,MAAS,WAAUC,EAAK,gBAAgBhB,CAAe,IACtDgB,EAAK,aAAahB,GAAiBe,CAAI,GAE5CZ,EAAmBY,CAAI,GAGvB,OAAO,sBAAsB,MAAM;AACjC,aAAO,sBAAsB,MAAMC,EAAK,UAAU,OAAOC,CAAqB,CAAC;AAAA,IACjF,CAAC;AAAA,EACH,GAAG,CAAA,CAAE,GAECC,IAASJ;AAAA,IACb,MAAMD,EAAUD,MAAW,SAAS,UAAU,MAAM;AAAA,IACpD,CAACA,GAAQC,CAAS;AAAA,EAAA;AAGpB,SAAO,EAAE,QAAAD,GAAQ,YAAAV,GAAY,WAAAW,GAAW,QAAAK,GAAQ,SAAAX,EAAA;AAClD;"}
+{"version":3,"file":"useUiTheme.js","sources":["../../src/hooks/useUiTheme.ts"],"sourcesContent":["'use client';\n\nimport { useCallback, useEffect, useState } from 'react';\n\nimport { THEME_ATTRIBUTE } from '@handijit/design';\nimport { isClient } from '@handijit/utils';\n\nimport {\n  applyThemePreference,\n  readActiveTheme,\n  readStoredPreference,\n  THEME_SWITCHING_CLASS,\n} from '../helpers/theme.helper';\nimport type { UiColorPreference, UiColorScheme, UiThemeState } from '@/types/theme.type';\n\n/**\n * Reads and changes the light/dark choice, on the `data-theme` contract of `@handijit/design`.\n *\n * The choice lives where the design boot script reads it (`localStorage[\"hd-theme\"]`), so a choice\n * made here survives a reload without a flash when `UiThemeScript` is in `<head>`.\n * @example const { scheme, toggle, isReady } = useUiTheme();\n */\nconst useUiTheme = (): UiThemeState => {\n  /*\n   * The first value is a constant: the server has no `document`, and reading the real value during\n   * the first client render produced a hydration mismatch. `isReady` tells when it is real.\n   */\n  const [preference, setPreferenceState] = useState<UiColorPreference>('system');\n  const [scheme, setSchemeState] = useState<UiColorScheme>('light');\n  const [isReady, setIsReady] = useState(false);\n\n  useEffect(() => {\n    if (!isClient()) return;\n\n    const sync = () => {\n      setPreferenceState(readStoredPreference());\n      setSchemeState(readActiveTheme());\n    };\n\n    sync();\n    setIsReady(true);\n\n    /* The boot script, another hook instance or the application may write the attribute. */\n    const observer = new MutationObserver(sync);\n    observer.observe(document.documentElement, {\n      attributes: true,\n      attributeFilter: [THEME_ATTRIBUTE],\n    });\n\n    /*\n     * Without the boot script nobody rewrites the attribute when the system setting changes; a page\n     * that follows the system has to be moved here.\n     */\n    const query = window.matchMedia?.('(prefers-color-scheme: dark)');\n    const handleSystemChange = () => {\n      if (readStoredPreference() === 'system') applyThemePreference('system');\n      sync();\n    };\n    query?.addEventListener('change', handleSystemChange);\n\n    return () => {\n      observer.disconnect();\n      query?.removeEventListener('change', handleSystemChange);\n    };\n  }, []);\n\n  const setScheme = useCallback((next: UiColorPreference) => {\n    if (!isClient()) return;\n\n    const root = document.documentElement;\n\n    root.classList.add(THEME_SWITCHING_CLASS);\n    applyThemePreference(next);\n    setPreferenceState(next);\n    setSchemeState(readActiveTheme());\n\n    /* The class comes off on the NEXT frame, after the new colours have been painted once. */\n    window.requestAnimationFrame(() => {\n      window.requestAnimationFrame(() => root.classList.remove(THEME_SWITCHING_CLASS));\n    });\n  }, []);\n\n  const toggle = useCallback(\n    () => setScheme(scheme === 'dark' ? 'light' : 'dark'),\n    [scheme, setScheme],\n  );\n\n  return { scheme, preference, setScheme, toggle, isReady };\n};\n\nexport default useUiTheme;\n"],"names":["useUiTheme","preference","setPreferenceState","useState","scheme","setSchemeState","isReady","setIsReady","useEffect","isClient","sync","readStoredPreference","readActiveTheme","observer","THEME_ATTRIBUTE","query","_a","handleSystemChange","applyThemePreference","setScheme","useCallback","next","root","THEME_SWITCHING_CLASS","toggle"],"mappings":";;;;;AAqBA,MAAMA,IAAa,MAAoB;AAKrC,QAAM,CAACC,GAAYC,CAAkB,IAAIC,EAA4B,QAAQ,GACvE,CAACC,GAAQC,CAAc,IAAIF,EAAwB,OAAO,GAC1D,CAACG,GAASC,CAAU,IAAIJ,EAAS,EAAK;AAE5C,EAAAK,EAAU,MAAM;;AACd,QAAI,CAACC,IAAY;AAEjB,UAAMC,IAAO,MAAM;AACjB,MAAAR,EAAmBS,GAAsB,GACzCN,EAAeO,GAAiB;AAAA,IAClC;AAEA,IAAAF,EAAA,GACAH,EAAW,EAAI;AAGf,UAAMM,IAAW,IAAI,iBAAiBH,CAAI;AAC1C,IAAAG,EAAS,QAAQ,SAAS,iBAAiB;AAAA,MACzC,YAAY;AAAA,MACZ,iBAAiB,CAACC,CAAe;AAAA,IAAA,CAClC;AAMD,UAAMC,KAAQC,IAAA,OAAO,eAAP,gBAAAA,EAAA,aAAoB,iCAC5BC,IAAqB,MAAM;AAC/B,MAAIN,EAAA,MAA2B,YAAUO,EAAqB,QAAQ,GACtER,EAAA;AAAA,IACF;AACA,WAAAK,KAAA,QAAAA,EAAO,iBAAiB,UAAUE,IAE3B,MAAM;AACX,MAAAJ,EAAS,WAAA,GACTE,KAAA,QAAAA,EAAO,oBAAoB,UAAUE;AAAA,IACvC;AAAA,EACF,GAAG,CAAA,CAAE;AAEL,QAAME,IAAYC,EAAY,CAACC,MAA4B;AACzD,QAAI,CAACZ,IAAY;AAEjB,UAAMa,IAAO,SAAS;AAEtB,IAAAA,EAAK,UAAU,IAAIC,CAAqB,GACxCL,EAAqBG,CAAI,GACzBnB,EAAmBmB,CAAI,GACvBhB,EAAeO,GAAiB,GAGhC,OAAO,sBAAsB,MAAM;AACjC,aAAO,sBAAsB,MAAMU,EAAK,UAAU,OAAOC,CAAqB,CAAC;AAAA,IACjF,CAAC;AAAA,EACH,GAAG,CAAA,CAAE,GAECC,IAASJ;AAAA,IACb,MAAMD,EAAUf,MAAW,SAAS,UAAU,MAAM;AAAA,IACpD,CAACA,GAAQe,CAAS;AAAA,EAAA;AAGpB,SAAO,EAAE,QAAAf,GAAQ,YAAAH,GAAY,WAAAkB,GAAW,QAAAK,GAAQ,SAAAlB,EAAA;AAClD;"}

package/build/hooks/useUiTokens.cjs

@@ -1,2 +1,2 @@
-"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const m=require("react"),v=require("@handijit/utils"),i=require("../helpers/theme.helper.cjs"),g=require("../theme/context.cjs"),E="currentColor",T=e=>{const r=getComputedStyle(document.documentElement);return Object.fromEntries(e.map(t=>[t,r.getPropertyValue(`${i.TOKEN_PREFIX}${t}`).trim()||E]))},f=(e,r)=>Object.keys(e).every(t=>e[t]===r[t]),p=e=>{const r=e.join("|"),{theme:t}=g.useUi(),[b,h]=m.useState(()=>Object.fromEntries(e.map(s=>[s,E])));return m.useEffect(()=>{var a;if(!v.isClient())return;const s=r.split("|"),o=()=>h(u=>{const d=T(s);return f(u,d)&&Object.keys(u).length===s.length?u:d});o();const c=new MutationObserver(o);c.observe(document.documentElement,{attributes:!0,attributeFilter:[i.THEME_ATTRIBUTE,"style"]}),c.observe(document.head,{childList:!0});const l=document.getElementById(i.THEME_STYLE_ID);l&&c.observe(l,{characterData:!0,childList:!0,subtree:!0});const n=(a=window.matchMedia)==null?void 0:a.call(window,"(prefers-color-scheme: dark)");return n==null||n.addEventListener("change",o),()=>{c.disconnect(),n==null||n.removeEventListener("change",o)}},[r,t]),b};exports.default=p;
+"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("react"),m=require("@handijit/design"),E=require("@handijit/utils"),b="currentColor",g=(e,t)=>{const s=getComputedStyle(t);return Object.fromEntries(e.map(r=>[r,s.getPropertyValue(m.cssVarName(r)).trim()||b]))},v=(e,t)=>Object.keys(e).every(s=>e[s]===t[s]),h=e=>{const t=e.join("|"),[s,r]=d.useState(()=>Object.fromEntries(e.map(c=>[c,b])));return d.useEffect(()=>{var l;if(!E.isClient())return;const c=t.split("|"),o=()=>r(i=>{const a=g(c,document.documentElement);return v(i,a)&&Object.keys(i).length===c.length?i:a});o();const u=new MutationObserver(o);u.observe(document.documentElement,{attributes:!0,attributeFilter:[m.THEME_ATTRIBUTE,"style","class"]}),u.observe(document.head,{childList:!0});const n=(l=window.matchMedia)==null?void 0:l.call(window,"(prefers-color-scheme: dark)");return n==null||n.addEventListener("change",o),()=>{u.disconnect(),n==null||n.removeEventListener("change",o)}},[t]),s};exports.default=h;
 //# sourceMappingURL=useUiTokens.cjs.map

package/build/hooks/useUiTokens.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useUiTokens.cjs","sources":["../../src/hooks/useUiTokens.ts"],"sourcesContent":["'use client';\n\nimport { useEffect, useState } from 'react';\n\nimport { isClient } from '@handijit/utils';\n\nimport { THEME_ATTRIBUTE, THEME_STYLE_ID, TOKEN_PREFIX } from '../helpers/theme.helper';\nimport { useUi } from '../theme/context';\nimport type { UiToken } from '@/types/theme.type';\n\n/** Sunucuda ve ilk karede dönen değer: çizim kütüphaneleri boş dizeyi siyah boyuyor. */\nconst FALLBACK = 'currentColor';\n\nconst read = <TName extends UiToken>(names: readonly TName[]): Record<TName, string> => {\n  const style = getComputedStyle(document.documentElement);\n\n  return Object.fromEntries(\n    names.map(name => [name, style.getPropertyValue(`${TOKEN_PREFIX}${name}`).trim() || FALLBACK]),\n  ) as Record<TName, string>;\n};\n\nconst isSame = (first: Record<string, string>, second: Record<string, string>): boolean =>\n  Object.keys(first).every(key => first[key] === second[key]);\n\n/**\n * Token'ların ÇÖZÜLMÜŞ değerleri — CSS değişkeni okuyamayan çizim kütüphaneleri için (recharts\n * `stroke`/`fill` prop'ları `var(--…)` kabul etmiyor).\n * Tema değiştiğinde (açık seçim, sistem tercihi, `UiProvider` ya da `initUi` ezmesi)\n * yeniden çizer.\n * ⚠ Sunucu çıktısında ve hidrasyondan önceki ilk karede her değer `currentColor`.\n * @example const colors = useUiTokens(['series-1', 'series-2', 'border']);\n */\nconst useUiTokens = <TName extends UiToken>(names: readonly TName[]): Record<TName, string> => {\n  /* Dizi her render'da yeni nesne olabilir; abonelik ADLARA bağlanır, kimliğe değil. */\n  const key = names.join('|');\n  /*\n   * Sağlayıcının ezmesi ağaçtaki `<style>`da; tema ilk kez verildiğinde o etiket `<head>`e değil\n   * ağaca eklenir ve aşağıdaki gözlemci onu görmez. Bağlamdaki tema nesnesi yalnızca İÇERİK\n   * değişince yenilenir (sağlayıcının `themeKey`i).\n   */\n  const { theme } = useUi();\n\n  const [values, setValues] = useState(\n    () => Object.fromEntries(names.map(name => [name, FALLBACK])) as Record<TName, string>,\n  );\n\n  useEffect(() => {\n    if (!isClient()) return;\n\n    const list = key.split('|') as TName[];\n    const update = () =>\n      setValues(previous => {\n        const next = read(list);\n        return isSame(previous, next) && Object.keys(previous).length === list.length\n          ? previous\n          : next;\n      });\n\n    update();\n\n    /* Açık seçim ve satır içi ezme `<html>`de; `initUi` ezmesi `<head>`deki tek `<style>`da. */\n    const observer = new MutationObserver(update);\n    observer.observe(document.documentElement, {\n      attributes: true,\n      attributeFilter: [THEME_ATTRIBUTE, 'style'],\n    });\n    observer.observe(document.head, { childList: true });\n\n    const overrides = document.getElementById(THEME_STYLE_ID);\n    if (overrides)\n      observer.observe(overrides, { characterData: true, childList: true, subtree: true });\n\n    const query = window.matchMedia?.('(prefers-color-scheme: dark)');\n    query?.addEventListener('change', update);\n\n    return () => {\n      observer.disconnect();\n      query?.removeEventListener('change', update);\n    };\n  }, [key, theme]);\n\n  return values;\n};\n\nexport default useUiTokens;\n"],"names":["FALLBACK","read","names","style","name","TOKEN_PREFIX","isSame","first","second","key","useUiTokens","theme","useUi","values","setValues","useState","useEffect","isClient","list","update","previous","next","observer","THEME_ATTRIBUTE","overrides","THEME_STYLE_ID","query","_a"],"mappings":"0PAUMA,EAAW,eAEXC,EAA+BC,GAAmD,CACtF,MAAMC,EAAQ,iBAAiB,SAAS,eAAe,EAEvD,OAAO,OAAO,YACZD,EAAM,IAAIE,GAAQ,CAACA,EAAMD,EAAM,iBAAiB,GAAGE,EAAAA,YAAY,GAAGD,CAAI,EAAE,EAAE,KAAA,GAAUJ,CAAQ,CAAC,CAAA,CAEjG,EAEMM,EAAS,CAACC,EAA+BC,IAC7C,OAAO,KAAKD,CAAK,EAAE,SAAaA,EAAME,CAAG,IAAMD,EAAOC,CAAG,CAAC,EAUtDC,EAAsCR,GAAmD,CAE7F,MAAMO,EAAMP,EAAM,KAAK,GAAG,EAMpB,CAAE,MAAAS,CAAA,EAAUC,QAAA,EAEZ,CAACC,EAAQC,CAAS,EAAIC,EAAAA,SAC1B,IAAM,OAAO,YAAYb,EAAM,OAAY,CAACE,EAAMJ,CAAQ,CAAC,CAAC,CAAA,EAG9DgB,OAAAA,EAAAA,UAAU,IAAM,OACd,GAAI,CAACC,EAAAA,WAAY,OAEjB,MAAMC,EAAOT,EAAI,MAAM,GAAG,EACpBU,EAAS,IACbL,EAAUM,GAAY,CACpB,MAAMC,EAAOpB,EAAKiB,CAAI,EACtB,OAAOZ,EAAOc,EAAUC,CAAI,GAAK,OAAO,KAAKD,CAAQ,EAAE,SAAWF,EAAK,OACnEE,EACAC,CACN,CAAC,EAEHF,EAAA,EAGA,MAAMG,EAAW,IAAI,iBAAiBH,CAAM,EAC5CG,EAAS,QAAQ,SAAS,gBAAiB,CACzC,WAAY,GACZ,gBAAiB,CAACC,EAAAA,gBAAiB,OAAO,CAAA,CAC3C,EACDD,EAAS,QAAQ,SAAS,KAAM,CAAE,UAAW,GAAM,EAEnD,MAAME,EAAY,SAAS,eAAeC,gBAAc,EACpDD,GACFF,EAAS,QAAQE,EAAW,CAAE,cAAe,GAAM,UAAW,GAAM,QAAS,GAAM,EAErF,MAAME,GAAQC,EAAA,OAAO,aAAP,YAAAA,EAAA,YAAoB,gCAClC,OAAAD,GAAA,MAAAA,EAAO,iBAAiB,SAAUP,GAE3B,IAAM,CACXG,EAAS,WAAA,EACTI,GAAA,MAAAA,EAAO,oBAAoB,SAAUP,EACvC,CACF,EAAG,CAACV,EAAKE,CAAK,CAAC,EAERE,CACT"}
+{"version":3,"file":"useUiTokens.cjs","sources":["../../src/hooks/useUiTokens.ts"],"sourcesContent":["'use client';\n\nimport { useEffect, useState } from 'react';\n\nimport { cssVarName, THEME_ATTRIBUTE, type TokenName } from '@handijit/design';\nimport { isClient } from '@handijit/utils';\n\n/** Returned on the server and in the first frame: drawing libraries paint an empty string black. */\nconst FALLBACK = 'currentColor';\n\nconst read = <TName extends TokenName>(\n  names: readonly TName[],\n  element: Element,\n): Record<TName, string> => {\n  const style = getComputedStyle(element);\n\n  return Object.fromEntries(\n    names.map(name => [name, style.getPropertyValue(cssVarName(name)).trim() || FALLBACK]),\n  ) as Record<TName, string>;\n};\n\nconst isSame = (first: Record<string, string>, second: Record<string, string>): boolean =>\n  Object.keys(first).every(key => first[key] === second[key]);\n\n/**\n * The RESOLVED values of design tokens — for drawing libraries that cannot read a CSS variable\n * (a canvas, an SVG attribute that rejects `var(--…)`).\n * Names are the token names of `@handijit/design` without the `--hd-` prefix. The values follow the\n * root theme (`data-theme`, the system setting, an inline override on `<html>`).\n * ⚠ Every value is `currentColor` in the server output and in the first frame before hydration.\n * @example const colors = useUiTokens(['chart-1', 'chart-2', 'border']);\n */\nconst useUiTokens = <TName extends TokenName>(names: readonly TName[]): Record<TName, string> => {\n  /* The array may be a new object on every render; the subscription follows the NAMES. */\n  const key = names.join('|');\n\n  const [values, setValues] = useState(\n    () => Object.fromEntries(names.map(name => [name, FALLBACK])) as Record<TName, string>,\n  );\n\n  useEffect(() => {\n    if (!isClient()) return;\n\n    const list = key.split('|') as TName[];\n    const update = () =>\n      setValues(previous => {\n        const next = read(list, document.documentElement);\n        return isSame(previous, next) && Object.keys(previous).length === list.length\n          ? previous\n          : next;\n      });\n\n    update();\n\n    const observer = new MutationObserver(update);\n    observer.observe(document.documentElement, {\n      attributes: true,\n      attributeFilter: [THEME_ATTRIBUTE, 'style', 'class'],\n    });\n    /* A stylesheet added later (the application's brand override) changes the values too. */\n    observer.observe(document.head, { childList: true });\n\n    const query = window.matchMedia?.('(prefers-color-scheme: dark)');\n    query?.addEventListener('change', update);\n\n    return () => {\n      observer.disconnect();\n      query?.removeEventListener('change', update);\n    };\n  }, [key]);\n\n  return values;\n};\n\nexport default useUiTokens;\n"],"names":["FALLBACK","read","names","element","style","name","cssVarName","isSame","first","second","key","useUiTokens","values","setValues","useState","useEffect","isClient","list","update","previous","next","observer","THEME_ATTRIBUTE","query","_a"],"mappings":"6MAOMA,EAAW,eAEXC,EAAO,CACXC,EACAC,IAC0B,CAC1B,MAAMC,EAAQ,iBAAiBD,CAAO,EAEtC,OAAO,OAAO,YACZD,EAAM,IAAIG,GAAQ,CAACA,EAAMD,EAAM,iBAAiBE,EAAAA,WAAWD,CAAI,CAAC,EAAE,KAAA,GAAUL,CAAQ,CAAC,CAAA,CAEzF,EAEMO,EAAS,CAACC,EAA+BC,IAC7C,OAAO,KAAKD,CAAK,EAAE,SAAaA,EAAME,CAAG,IAAMD,EAAOC,CAAG,CAAC,EAUtDC,EAAwCT,GAAmD,CAE/F,MAAMQ,EAAMR,EAAM,KAAK,GAAG,EAEpB,CAACU,EAAQC,CAAS,EAAIC,EAAAA,SAC1B,IAAM,OAAO,YAAYZ,EAAM,OAAY,CAACG,EAAML,CAAQ,CAAC,CAAC,CAAA,EAG9De,OAAAA,EAAAA,UAAU,IAAM,OACd,GAAI,CAACC,EAAAA,WAAY,OAEjB,MAAMC,EAAOP,EAAI,MAAM,GAAG,EACpBQ,EAAS,IACbL,EAAUM,GAAY,CACpB,MAAMC,EAAOnB,EAAKgB,EAAM,SAAS,eAAe,EAChD,OAAOV,EAAOY,EAAUC,CAAI,GAAK,OAAO,KAAKD,CAAQ,EAAE,SAAWF,EAAK,OACnEE,EACAC,CACN,CAAC,EAEHF,EAAA,EAEA,MAAMG,EAAW,IAAI,iBAAiBH,CAAM,EAC5CG,EAAS,QAAQ,SAAS,gBAAiB,CACzC,WAAY,GACZ,gBAAiB,CAACC,kBAAiB,QAAS,OAAO,CAAA,CACpD,EAEDD,EAAS,QAAQ,SAAS,KAAM,CAAE,UAAW,GAAM,EAEnD,MAAME,GAAQC,EAAA,OAAO,aAAP,YAAAA,EAAA,YAAoB,gCAClC,OAAAD,GAAA,MAAAA,EAAO,iBAAiB,SAAUL,GAE3B,IAAM,CACXG,EAAS,WAAA,EACTE,GAAA,MAAAA,EAAO,oBAAoB,SAAUL,EACvC,CACF,EAAG,CAACR,CAAG,CAAC,EAEDE,CACT"}

package/build/hooks/useUiTokens.d.ts

@@ -1,11 +1,11 @@
-import { UiToken } from '../types/theme.type';
+import { TokenName } from '@handijit/design';
 /**
- * Token'ların ÇÖZÜLMÜŞ değerleri — CSS değişkeni okuyamayan çizim kütüphaneleri için (recharts
- * `stroke`/`fill` prop'ları `var(--…)` kabul etmiyor).
- * Tema değiştiğinde (açık seçim, sistem tercihi, `UiProvider` ya da `initUi` ezmesi)
- * yeniden çizer.
- * ⚠ Sunucu çıktısında ve hidrasyondan önceki ilk karede her değer `currentColor`.
- * @example const colors = useUiTokens(['series-1', 'series-2', 'border']);
+ * The RESOLVED values of design tokens — for drawing libraries that cannot read a CSS variable
+ * (a canvas, an SVG attribute that rejects `var(--…)`).
+ * Names are the token names of `@handijit/design` without the `--hd-` prefix. The values follow the
+ * root theme (`data-theme`, the system setting, an inline override on `<html>`).
+ * ⚠ Every value is `currentColor` in the server output and in the first frame before hydration.
+ * @example const colors = useUiTokens(['chart-1', 'chart-2', 'border']);
  */
-declare const useUiTokens: <TName extends UiToken>(names: readonly TName[]) => Record<TName, string>;
+declare const useUiTokens: <TName extends TokenName>(names: readonly TName[]) => Record<TName, string>;
 export default useUiTokens;

package/build/hooks/useUiTokens.js

@@ -1,39 +1,36 @@
 "use client";
-import { useState as b, useEffect as f } from "react";
-import { isClient as h } from "@handijit/utils";
-import { THEME_ATTRIBUTE as p, THEME_STYLE_ID as v, TOKEN_PREFIX as T } from "../helpers/theme.helper.js";
-import { useUi as g } from "../theme/context.js";
-const d = "currentColor", L = (e) => {
-  const r = getComputedStyle(document.documentElement);
+import { useState as d, useEffect as b } from "react";
+import { THEME_ATTRIBUTE as E, cssVarName as f } from "@handijit/design";
+import { isClient as p } from "@handijit/utils";
+const l = "currentColor", h = (e, t) => {
+  const n = getComputedStyle(t);
   return Object.fromEntries(
-    e.map((t) => [t, r.getPropertyValue(`${T}${t}`).trim() || d])
+    e.map((s) => [s, n.getPropertyValue(f(s)).trim() || l])
   );
-}, O = (e, r) => Object.keys(e).every((t) => e[t] === r[t]), I = (e) => {
-  const r = e.join("|"), { theme: t } = g(), [l, E] = b(
-    () => Object.fromEntries(e.map((o) => [o, d]))
+}, v = (e, t) => Object.keys(e).every((n) => e[n] === t[n]), O = (e) => {
+  const t = e.join("|"), [n, s] = d(
+    () => Object.fromEntries(e.map((o) => [o, l]))
   );
-  return f(() => {
+  return b(() => {
     var m;
-    if (!h()) return;
-    const o = r.split("|"), s = () => E((i) => {
-      const a = L(o);
-      return O(i, a) && Object.keys(i).length === o.length ? i : a;
+    if (!p()) return;
+    const o = t.split("|"), c = () => s((a) => {
+      const u = h(o, document.documentElement);
+      return v(a, u) && Object.keys(a).length === o.length ? a : u;
     });
-    s();
-    const c = new MutationObserver(s);
-    c.observe(document.documentElement, {
+    c();
+    const i = new MutationObserver(c);
+    i.observe(document.documentElement, {
       attributes: !0,
-      attributeFilter: [p, "style"]
-    }), c.observe(document.head, { childList: !0 });
-    const u = document.getElementById(v);
-    u && c.observe(u, { characterData: !0, childList: !0, subtree: !0 });
-    const n = (m = window.matchMedia) == null ? void 0 : m.call(window, "(prefers-color-scheme: dark)");
-    return n == null || n.addEventListener("change", s), () => {
-      c.disconnect(), n == null || n.removeEventListener("change", s);
+      attributeFilter: [E, "style", "class"]
+    }), i.observe(document.head, { childList: !0 });
+    const r = (m = window.matchMedia) == null ? void 0 : m.call(window, "(prefers-color-scheme: dark)");
+    return r == null || r.addEventListener("change", c), () => {
+      i.disconnect(), r == null || r.removeEventListener("change", c);
     };
-  }, [r, t]), l;
+  }, [t]), n;
 };
 export {
-  I as default
+  O as default
 };
 //# sourceMappingURL=useUiTokens.js.map

package/build/hooks/useUiTokens.js.map

@@ -1 +1 @@
-{"version":3,"file":"useUiTokens.js","sources":["../../src/hooks/useUiTokens.ts"],"sourcesContent":["'use client';\n\nimport { useEffect, useState } from 'react';\n\nimport { isClient } from '@handijit/utils';\n\nimport { THEME_ATTRIBUTE, THEME_STYLE_ID, TOKEN_PREFIX } from '../helpers/theme.helper';\nimport { useUi } from '../theme/context';\nimport type { UiToken } from '@/types/theme.type';\n\n/** Sunucuda ve ilk karede dönen değer: çizim kütüphaneleri boş dizeyi siyah boyuyor. */\nconst FALLBACK = 'currentColor';\n\nconst read = <TName extends UiToken>(names: readonly TName[]): Record<TName, string> => {\n  const style = getComputedStyle(document.documentElement);\n\n  return Object.fromEntries(\n    names.map(name => [name, style.getPropertyValue(`${TOKEN_PREFIX}${name}`).trim() || FALLBACK]),\n  ) as Record<TName, string>;\n};\n\nconst isSame = (first: Record<string, string>, second: Record<string, string>): boolean =>\n  Object.keys(first).every(key => first[key] === second[key]);\n\n/**\n * Token'ların ÇÖZÜLMÜŞ değerleri — CSS değişkeni okuyamayan çizim kütüphaneleri için (recharts\n * `stroke`/`fill` prop'ları `var(--…)` kabul etmiyor).\n * Tema değiştiğinde (açık seçim, sistem tercihi, `UiProvider` ya da `initUi` ezmesi)\n * yeniden çizer.\n * ⚠ Sunucu çıktısında ve hidrasyondan önceki ilk karede her değer `currentColor`.\n * @example const colors = useUiTokens(['series-1', 'series-2', 'border']);\n */\nconst useUiTokens = <TName extends UiToken>(names: readonly TName[]): Record<TName, string> => {\n  /* Dizi her render'da yeni nesne olabilir; abonelik ADLARA bağlanır, kimliğe değil. */\n  const key = names.join('|');\n  /*\n   * Sağlayıcının ezmesi ağaçtaki `<style>`da; tema ilk kez verildiğinde o etiket `<head>`e değil\n   * ağaca eklenir ve aşağıdaki gözlemci onu görmez. Bağlamdaki tema nesnesi yalnızca İÇERİK\n   * değişince yenilenir (sağlayıcının `themeKey`i).\n   */\n  const { theme } = useUi();\n\n  const [values, setValues] = useState(\n    () => Object.fromEntries(names.map(name => [name, FALLBACK])) as Record<TName, string>,\n  );\n\n  useEffect(() => {\n    if (!isClient()) return;\n\n    const list = key.split('|') as TName[];\n    const update = () =>\n      setValues(previous => {\n        const next = read(list);\n        return isSame(previous, next) && Object.keys(previous).length === list.length\n          ? previous\n          : next;\n      });\n\n    update();\n\n    /* Açık seçim ve satır içi ezme `<html>`de; `initUi` ezmesi `<head>`deki tek `<style>`da. */\n    const observer = new MutationObserver(update);\n    observer.observe(document.documentElement, {\n      attributes: true,\n      attributeFilter: [THEME_ATTRIBUTE, 'style'],\n    });\n    observer.observe(document.head, { childList: true });\n\n    const overrides = document.getElementById(THEME_STYLE_ID);\n    if (overrides)\n      observer.observe(overrides, { characterData: true, childList: true, subtree: true });\n\n    const query = window.matchMedia?.('(prefers-color-scheme: dark)');\n    query?.addEventListener('change', update);\n\n    return () => {\n      observer.disconnect();\n      query?.removeEventListener('change', update);\n    };\n  }, [key, theme]);\n\n  return values;\n};\n\nexport default useUiTokens;\n"],"names":["FALLBACK","read","names","style","name","TOKEN_PREFIX","isSame","first","second","key","useUiTokens","theme","useUi","values","setValues","useState","useEffect","isClient","list","update","previous","next","observer","THEME_ATTRIBUTE","overrides","THEME_STYLE_ID","query","_a"],"mappings":";;;;;AAUA,MAAMA,IAAW,gBAEXC,IAAO,CAAwBC,MAAmD;AACtF,QAAMC,IAAQ,iBAAiB,SAAS,eAAe;AAEvD,SAAO,OAAO;AAAA,IACZD,EAAM,IAAI,CAAAE,MAAQ,CAACA,GAAMD,EAAM,iBAAiB,GAAGE,CAAY,GAAGD,CAAI,EAAE,EAAE,KAAA,KAAUJ,CAAQ,CAAC;AAAA,EAAA;AAEjG,GAEMM,IAAS,CAACC,GAA+BC,MAC7C,OAAO,KAAKD,CAAK,EAAE,MAAM,OAAOA,EAAME,CAAG,MAAMD,EAAOC,CAAG,CAAC,GAUtDC,IAAc,CAAwBR,MAAmD;AAE7F,QAAMO,IAAMP,EAAM,KAAK,GAAG,GAMpB,EAAE,OAAAS,EAAA,IAAUC,EAAA,GAEZ,CAACC,GAAQC,CAAS,IAAIC;AAAA,IAC1B,MAAM,OAAO,YAAYb,EAAM,IAAI,OAAQ,CAACE,GAAMJ,CAAQ,CAAC,CAAC;AAAA,EAAA;AAG9D,SAAAgB,EAAU,MAAM;;AACd,QAAI,CAACC,IAAY;AAEjB,UAAMC,IAAOT,EAAI,MAAM,GAAG,GACpBU,IAAS,MACbL,EAAU,CAAAM,MAAY;AACpB,YAAMC,IAAOpB,EAAKiB,CAAI;AACtB,aAAOZ,EAAOc,GAAUC,CAAI,KAAK,OAAO,KAAKD,CAAQ,EAAE,WAAWF,EAAK,SACnEE,IACAC;AAAA,IACN,CAAC;AAEH,IAAAF,EAAA;AAGA,UAAMG,IAAW,IAAI,iBAAiBH,CAAM;AAC5C,IAAAG,EAAS,QAAQ,SAAS,iBAAiB;AAAA,MACzC,YAAY;AAAA,MACZ,iBAAiB,CAACC,GAAiB,OAAO;AAAA,IAAA,CAC3C,GACDD,EAAS,QAAQ,SAAS,MAAM,EAAE,WAAW,IAAM;AAEnD,UAAME,IAAY,SAAS,eAAeC,CAAc;AACxD,IAAID,KACFF,EAAS,QAAQE,GAAW,EAAE,eAAe,IAAM,WAAW,IAAM,SAAS,IAAM;AAErF,UAAME,KAAQC,IAAA,OAAO,eAAP,gBAAAA,EAAA,aAAoB;AAClC,WAAAD,KAAA,QAAAA,EAAO,iBAAiB,UAAUP,IAE3B,MAAM;AACX,MAAAG,EAAS,WAAA,GACTI,KAAA,QAAAA,EAAO,oBAAoB,UAAUP;AAAA,IACvC;AAAA,EACF,GAAG,CAACV,GAAKE,CAAK,CAAC,GAERE;AACT;"}
+{"version":3,"file":"useUiTokens.js","sources":["../../src/hooks/useUiTokens.ts"],"sourcesContent":["'use client';\n\nimport { useEffect, useState } from 'react';\n\nimport { cssVarName, THEME_ATTRIBUTE, type TokenName } from '@handijit/design';\nimport { isClient } from '@handijit/utils';\n\n/** Returned on the server and in the first frame: drawing libraries paint an empty string black. */\nconst FALLBACK = 'currentColor';\n\nconst read = <TName extends TokenName>(\n  names: readonly TName[],\n  element: Element,\n): Record<TName, string> => {\n  const style = getComputedStyle(element);\n\n  return Object.fromEntries(\n    names.map(name => [name, style.getPropertyValue(cssVarName(name)).trim() || FALLBACK]),\n  ) as Record<TName, string>;\n};\n\nconst isSame = (first: Record<string, string>, second: Record<string, string>): boolean =>\n  Object.keys(first).every(key => first[key] === second[key]);\n\n/**\n * The RESOLVED values of design tokens — for drawing libraries that cannot read a CSS variable\n * (a canvas, an SVG attribute that rejects `var(--…)`).\n * Names are the token names of `@handijit/design` without the `--hd-` prefix. The values follow the\n * root theme (`data-theme`, the system setting, an inline override on `<html>`).\n * ⚠ Every value is `currentColor` in the server output and in the first frame before hydration.\n * @example const colors = useUiTokens(['chart-1', 'chart-2', 'border']);\n */\nconst useUiTokens = <TName extends TokenName>(names: readonly TName[]): Record<TName, string> => {\n  /* The array may be a new object on every render; the subscription follows the NAMES. */\n  const key = names.join('|');\n\n  const [values, setValues] = useState(\n    () => Object.fromEntries(names.map(name => [name, FALLBACK])) as Record<TName, string>,\n  );\n\n  useEffect(() => {\n    if (!isClient()) return;\n\n    const list = key.split('|') as TName[];\n    const update = () =>\n      setValues(previous => {\n        const next = read(list, document.documentElement);\n        return isSame(previous, next) && Object.keys(previous).length === list.length\n          ? previous\n          : next;\n      });\n\n    update();\n\n    const observer = new MutationObserver(update);\n    observer.observe(document.documentElement, {\n      attributes: true,\n      attributeFilter: [THEME_ATTRIBUTE, 'style', 'class'],\n    });\n    /* A stylesheet added later (the application's brand override) changes the values too. */\n    observer.observe(document.head, { childList: true });\n\n    const query = window.matchMedia?.('(prefers-color-scheme: dark)');\n    query?.addEventListener('change', update);\n\n    return () => {\n      observer.disconnect();\n      query?.removeEventListener('change', update);\n    };\n  }, [key]);\n\n  return values;\n};\n\nexport default useUiTokens;\n"],"names":["FALLBACK","read","names","element","style","name","cssVarName","isSame","first","second","key","useUiTokens","values","setValues","useState","useEffect","isClient","list","update","previous","next","observer","THEME_ATTRIBUTE","query","_a"],"mappings":";;;;AAOA,MAAMA,IAAW,gBAEXC,IAAO,CACXC,GACAC,MAC0B;AAC1B,QAAMC,IAAQ,iBAAiBD,CAAO;AAEtC,SAAO,OAAO;AAAA,IACZD,EAAM,IAAI,CAAAG,MAAQ,CAACA,GAAMD,EAAM,iBAAiBE,EAAWD,CAAI,CAAC,EAAE,KAAA,KAAUL,CAAQ,CAAC;AAAA,EAAA;AAEzF,GAEMO,IAAS,CAACC,GAA+BC,MAC7C,OAAO,KAAKD,CAAK,EAAE,MAAM,OAAOA,EAAME,CAAG,MAAMD,EAAOC,CAAG,CAAC,GAUtDC,IAAc,CAA0BT,MAAmD;AAE/F,QAAMQ,IAAMR,EAAM,KAAK,GAAG,GAEpB,CAACU,GAAQC,CAAS,IAAIC;AAAA,IAC1B,MAAM,OAAO,YAAYZ,EAAM,IAAI,OAAQ,CAACG,GAAML,CAAQ,CAAC,CAAC;AAAA,EAAA;AAG9D,SAAAe,EAAU,MAAM;;AACd,QAAI,CAACC,IAAY;AAEjB,UAAMC,IAAOP,EAAI,MAAM,GAAG,GACpBQ,IAAS,MACbL,EAAU,CAAAM,MAAY;AACpB,YAAMC,IAAOnB,EAAKgB,GAAM,SAAS,eAAe;AAChD,aAAOV,EAAOY,GAAUC,CAAI,KAAK,OAAO,KAAKD,CAAQ,EAAE,WAAWF,EAAK,SACnEE,IACAC;AAAA,IACN,CAAC;AAEH,IAAAF,EAAA;AAEA,UAAMG,IAAW,IAAI,iBAAiBH,CAAM;AAC5C,IAAAG,EAAS,QAAQ,SAAS,iBAAiB;AAAA,MACzC,YAAY;AAAA,MACZ,iBAAiB,CAACC,GAAiB,SAAS,OAAO;AAAA,IAAA,CACpD,GAEDD,EAAS,QAAQ,SAAS,MAAM,EAAE,WAAW,IAAM;AAEnD,UAAME,KAAQC,IAAA,OAAO,eAAP,gBAAAA,EAAA,aAAoB;AAClC,WAAAD,KAAA,QAAAA,EAAO,iBAAiB,UAAUL,IAE3B,MAAM;AACX,MAAAG,EAAS,WAAA,GACTE,KAAA,QAAAA,EAAO,oBAAoB,UAAUL;AAAA,IACvC;AAAA,EACF,GAAG,CAACR,CAAG,CAAC,GAEDE;AACT;"}

package/build/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const x=require("./theme/UiProvider.cjs"),$=require("./theme/initUi.cjs"),E=require("./theme/UiThemeScript.cjs"),S=require("./theme/context.cjs"),e=require("./theme/tokens.cjs"),r=require("./helpers/theme.helper.cjs"),_=require("./helpers/focus.helper.cjs"),A=require("./hooks/useAnnounce.cjs"),C=require("./hooks/useUiTheme.cjs"),B=require("./hooks/useUiTokens.cjs"),R=require("./hooks/useStickToBottom.cjs"),m=require("./hooks/useListboxNavigation.cjs"),I=require("./hooks/usePositioning.cjs"),p=require("./hooks/useVirtualList.cjs"),D=require("./enums/ui-variant.enum.cjs"),P=require("./enums/ui-size.enum.cjs"),t=require("./constants/breakpoint.constants.cjs"),d=require("./helpers/text.helper.cjs"),O=require("./components/Button/index.cjs"),h=require("./components/IconButton/index.cjs"),M=require("./components/TextLink/index.cjs"),U=require("./components/Tooltip/index.cjs"),a=require("./components/Menu/index.cjs"),b=require("./components/Popover/index.cjs"),g=require("./components/Chip/index.cjs"),y=require("./components/ChipGroup/index.cjs"),L=require("./components/Combobox/index.cjs"),k=require("./components/SegmentedControl/index.cjs"),F=require("./components/Select/index.cjs"),N=require("./components/Checkbox/index.cjs"),v=require("./components/Switch/index.cjs"),w=require("./components/Radio/index.cjs"),H=require("./components/RadioCard/index.cjs"),K=require("./components/RangeSlider/index.cjs"),V=require("./components/RatingInput/index.cjs"),Y=require("./components/QuantityStepper/index.cjs"),G=require("./components/TableCheckbox/index.cjs"),Q=require("./components/Input/index.cjs"),z=require("./components/PasswordInput/index.cjs"),J=require("./components/TagInput/index.cjs"),j=require("./components/Textarea/index.cjs"),l=require("./components/DateField/index.cjs"),W=require("./components/Field/index.cjs"),X=require("./components/FileUpload/index.cjs"),Z=require("./components/Alert/index.cjs"),ee=require("./components/Avatar/index.cjs"),re=require("./components/Badge/index.cjs"),te=require("./components/Breadcrumb/index.cjs"),i=require("./components/Card/index.cjs"),ie=require("./components/Carousel/index.cjs"),ne=require("./components/CodeBadge/index.cjs"),ue=require("./components/Kbd/index.cjs"),oe=require("./components/StatusDot/index.cjs"),de=require("./components/CopyField/index.cjs"),ae=require("./components/Divider/index.cjs"),n=require("./components/Directory/index.cjs"),le=require("./components/EmptyState/index.cjs"),se=require("./components/PageHeader/index.cjs"),o=require("./components/Panel/index.cjs"),ce=require("./components/Price/index.cjs"),Te=require("./components/Rating/index.cjs"),fe=require("./components/SectionHeader/index.cjs"),qe=require("./components/ScrollArea/index.cjs"),u=require("./components/Skeleton/index.cjs"),xe=require("./components/Stat/index.cjs"),$e=require("./components/SummaryCard/index.cjs"),s=require("./components/Progress/index.cjs"),Ee=require("./components/Spinner/index.cjs"),c=require("./components/Toast/index.cjs"),Se=require("./components/ToastPortal/index.cjs"),_e=require("./components/Accordion/index.cjs"),Ae=require("./components/Disclosure/index.cjs"),Ce=require("./components/Steps/index.cjs"),Be=require("./components/Tabs/index.cjs"),Re=require("./components/Tile/index.cjs"),me=require("./components/Timeline/index.cjs"),Ie=require("./components/BottomSheet/index.cjs"),pe=require("./components/Modal/index.cjs"),De=require("./components/CommandPalette/index.cjs"),Pe=require("./components/ConfirmDialog/index.cjs"),Oe=require("./components/Drawer/index.cjs"),he=require("./components/PromptDialog/index.cjs"),T=require("./components/Table/index.cjs"),f=require("./components/DataTable/index.cjs"),q=require("./components/FilterBar/index.cjs"),Me=require("./components/Pagination/index.cjs");exports.UiProvider=x.default;exports.initUi=$.default;exports.UiThemeScript=E.default;exports.useUi=S.useUi;exports.COMPACT_DENSITY=e.COMPACT_DENSITY;exports.DARK_THEME=e.DARK_THEME;exports.DEFAULT_FONTS=e.DEFAULT_FONTS;exports.LIGHT_THEME=e.LIGHT_THEME;exports.METRIC_TOKENS=e.METRIC_TOKENS;exports.DENSITY_ATTRIBUTE=r.DENSITY_ATTRIBUTE;exports.THEME_ATTRIBUTE=r.THEME_ATTRIBUTE;exports.applyThemeConfig=r.applyThemeConfig;exports.buildThemeCss=r.buildThemeCss;exports.resolveTokens=r.resolveTokens;exports.hasOpenSurface=_.hasOpenSurface;exports.useAnnounce=A.default;exports.useUiTheme=C.default;exports.useUiTokens=B.default;exports.useStickToBottom=R.default;exports.useListboxNavigation=m.default;exports.usePositioning=I.default;exports.useVirtualList=p.default;exports.UIVariant=D.default;exports.UISize=P.default;exports.ABOVE_MOBILE_MEDIA_QUERY=t.ABOVE_MOBILE_MEDIA_QUERY;exports.ABOVE_TABLET_MEDIA_QUERY=t.ABOVE_TABLET_MEDIA_QUERY;exports.MOBILE_BREAKPOINT=t.MOBILE_BREAKPOINT;exports.TABLET_BREAKPOINT=t.TABLET_BREAKPOINT;exports.TABLET_PORTRAIT_BREAKPOINT=t.TABLET_PORTRAIT_BREAKPOINT;exports.matchesSearch=d.matchesSearch;exports.normalizeSearchTerm=d.normalizeSearchTerm;exports.Button=O.default;exports.IconButton=h.default;exports.TextLink=M.default;exports.Tooltip=U.default;exports.ContextMenu=a.ContextMenu;exports.Menu=a.default;exports.Popover=b.default;exports.Chip=g.default;exports.ChipGroup=y.default;exports.Combobox=L.default;exports.SegmentedControl=k.default;exports.Select=F.default;exports.Checkbox=N.default;exports.Switch=v.default;exports.Radio=w.default;exports.RadioCard=H.default;exports.RangeSlider=K.default;exports.RatingInput=V.default;exports.QuantityStepper=Y.default;exports.TableCheckbox=G.default;exports.Input=Q.default;exports.PasswordInput=z.default;exports.TagInput=J.default;exports.Textarea=j.default;exports.DateField=l.default;exports.DateRange=l.DateRange;exports.Field=W.default;exports.FileUpload=X.default;exports.Alert=Z.default;exports.Avatar=ee.default;exports.Badge=re.default;exports.Breadcrumb=te.default;exports.Card=i.default;exports.CardBody=i.CardBody;exports.CardFooter=i.CardFooter;exports.CardMedia=i.CardMedia;exports.CardOverlay=i.CardOverlay;exports.Carousel=ie.default;exports.CodeBadge=ne.default;exports.Kbd=ue.default;exports.StatusDot=oe.default;exports.CopyField=de.default;exports.Divider=ae.default;exports.Directory=n.default;exports.DirectoryGroup=n.DirectoryGroup;exports.DirectoryJump=n.DirectoryJump;exports.DirectoryRow=n.DirectoryRow;exports.EmptyState=le.default;exports.PageHeader=se.default;exports.Panel=o.default;exports.PanelForm=o.PanelForm;exports.PanelRow=o.PanelRow;exports.Price=ce.default;exports.Rating=Te.default;exports.SectionHeader=fe.default;exports.ScrollArea=qe.default;exports.Skeleton=u.default;exports.SkeletonCard=u.SkeletonCard;exports.SkeletonRows=u.SkeletonRows;exports.SkeletonTable=u.SkeletonTable;exports.Stat=xe.default;exports.SummaryCard=$e.default;exports.Progress=s.default;exports.ProgressCircle=s.ProgressCircle;exports.Spinner=Ee.default;exports.ToastHub=c.default;exports.toast=c.toast;exports.ToastPortal=Se.default;exports.Accordion=_e.default;exports.Disclosure=Ae.default;exports.Steps=Ce.default;exports.Tabs=Be.default;exports.Tile=Re.default;exports.Timeline=me.default;exports.BottomSheet=Ie.default;exports.Modal=pe.default;exports.CommandPalette=De.default;exports.ConfirmDialog=Pe.default;exports.Drawer=Oe.default;exports.PromptDialog=he.default;exports.Table=T.default;exports.TableScroller=T.TableScroller;exports.DataTable=f.default;exports.DataTableRow=f.DataTableRow;exports.FilterBar=q.default;exports.FilterBarField=q.FilterBarField;exports.Pagination=Me.default;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const x=require("./theme/UiProvider.cjs"),T=require("./theme/UiThemeScript.cjs"),$=require("./theme/context.cjs"),t=require("@handijit/design"),E=require("./helpers/focus.helper.cjs"),S=require("./hooks/useAnnounce.cjs"),_=require("./hooks/useUiTheme.cjs"),B=require("./hooks/useUiTokens.cjs"),R=require("./hooks/useStickToBottom.cjs"),P=require("./hooks/useListboxNavigation.cjs"),A=require("./hooks/usePositioning.cjs"),m=require("./hooks/useVirtualList.cjs"),O=require("./enums/ui-variant.enum.cjs"),p=require("./enums/ui-size.enum.cjs"),e=require("./constants/breakpoint.constants.cjs"),o=require("./helpers/text.helper.cjs"),C=require("./components/Button/index.cjs"),I=require("./components/IconButton/index.cjs"),b=require("./components/TextLink/index.cjs"),g=require("./components/Tooltip/index.cjs"),d=require("./components/Menu/index.cjs"),D=require("./components/Popover/index.cjs"),M=require("./components/Chip/index.cjs"),y=require("./components/ChipGroup/index.cjs"),U=require("./components/Combobox/index.cjs"),h=require("./components/SegmentedControl/index.cjs"),H=require("./components/Select/index.cjs"),k=require("./components/Checkbox/index.cjs"),L=require("./components/Switch/index.cjs"),F=require("./components/Radio/index.cjs"),w=require("./components/RadioCard/index.cjs"),v=require("./components/RangeSlider/index.cjs"),K=require("./components/RatingInput/index.cjs"),N=require("./components/QuantityStepper/index.cjs"),V=require("./components/TableCheckbox/index.cjs"),Y=require("./components/Input/index.cjs"),Q=require("./components/PasswordInput/index.cjs"),j=require("./components/TagInput/index.cjs"),G=require("./components/Textarea/index.cjs"),a=require("./components/DateField/index.cjs"),z=require("./components/Field/index.cjs"),J=require("./components/FileUpload/index.cjs"),W=require("./components/Alert/index.cjs"),X=require("./components/Avatar/index.cjs"),Z=require("./components/Badge/index.cjs"),ee=require("./components/Breadcrumb/index.cjs"),r=require("./components/Card/index.cjs"),re=require("./components/Carousel/index.cjs"),te=require("./components/CodeBadge/index.cjs"),ie=require("./components/Kbd/index.cjs"),ne=require("./components/StatusDot/index.cjs"),ue=require("./components/CopyField/index.cjs"),oe=require("./components/Divider/index.cjs"),i=require("./components/Directory/index.cjs"),de=require("./components/EmptyState/index.cjs"),ae=require("./components/PageHeader/index.cjs"),u=require("./components/Panel/index.cjs"),le=require("./components/Price/index.cjs"),se=require("./components/Rating/index.cjs"),ce=require("./components/SectionHeader/index.cjs"),fe=require("./components/ScrollArea/index.cjs"),n=require("./components/Skeleton/index.cjs"),qe=require("./components/Stat/index.cjs"),xe=require("./components/SummaryCard/index.cjs"),l=require("./components/Progress/index.cjs"),Te=require("./components/Spinner/index.cjs"),s=require("./components/Toast/index.cjs"),$e=require("./components/ToastPortal/index.cjs"),Ee=require("./components/Accordion/index.cjs"),Se=require("./components/Disclosure/index.cjs"),_e=require("./components/Steps/index.cjs"),Be=require("./components/Tabs/index.cjs"),Re=require("./components/Tile/index.cjs"),Pe=require("./components/Timeline/index.cjs"),Ae=require("./components/BottomSheet/index.cjs"),me=require("./components/Modal/index.cjs"),Oe=require("./components/CommandPalette/index.cjs"),pe=require("./components/ConfirmDialog/index.cjs"),Ce=require("./components/Drawer/index.cjs"),Ie=require("./components/PromptDialog/index.cjs"),c=require("./components/Table/index.cjs"),f=require("./components/DataTable/index.cjs"),q=require("./components/FilterBar/index.cjs"),be=require("./components/Pagination/index.cjs");exports.UiProvider=x.default;exports.UiThemeScript=T.default;exports.useUi=$.useUi;Object.defineProperty(exports,"THEME_ATTRIBUTE",{enumerable:!0,get:()=>t.THEME_ATTRIBUTE});Object.defineProperty(exports,"THEME_BOOT_SCRIPT",{enumerable:!0,get:()=>t.THEME_BOOT_SCRIPT});Object.defineProperty(exports,"THEME_BOOT_SCRIPT_HASH",{enumerable:!0,get:()=>t.THEME_BOOT_SCRIPT_HASH});Object.defineProperty(exports,"THEME_STORAGE_KEY",{enumerable:!0,get:()=>t.THEME_STORAGE_KEY});exports.hasOpenSurface=E.hasOpenSurface;exports.useAnnounce=S.default;exports.useUiTheme=_.default;exports.useUiTokens=B.default;exports.useStickToBottom=R.default;exports.useListboxNavigation=P.default;exports.usePositioning=A.default;exports.useVirtualList=m.default;exports.UIVariant=O.default;exports.UISize=p.default;exports.ABOVE_MOBILE_MEDIA_QUERY=e.ABOVE_MOBILE_MEDIA_QUERY;exports.ABOVE_TABLET_MEDIA_QUERY=e.ABOVE_TABLET_MEDIA_QUERY;exports.MOBILE_BREAKPOINT=e.MOBILE_BREAKPOINT;exports.SHEET_MEDIA_QUERY=e.SHEET_MEDIA_QUERY;exports.TABLET_BREAKPOINT=e.TABLET_BREAKPOINT;exports.TABLET_PORTRAIT_BREAKPOINT=e.TABLET_PORTRAIT_BREAKPOINT;exports.matchesSearch=o.matchesSearch;exports.normalizeSearchTerm=o.normalizeSearchTerm;exports.Button=C.default;exports.IconButton=I.default;exports.TextLink=b.default;exports.Tooltip=g.default;exports.ContextMenu=d.ContextMenu;exports.Menu=d.default;exports.Popover=D.default;exports.Chip=M.default;exports.ChipGroup=y.default;exports.Combobox=U.default;exports.SegmentedControl=h.default;exports.Select=H.default;exports.Checkbox=k.default;exports.Switch=L.default;exports.Radio=F.default;exports.RadioCard=w.default;exports.RangeSlider=v.default;exports.RatingInput=K.default;exports.QuantityStepper=N.default;exports.TableCheckbox=V.default;exports.Input=Y.default;exports.PasswordInput=Q.default;exports.TagInput=j.default;exports.Textarea=G.default;exports.DateField=a.default;exports.DateRange=a.DateRange;exports.Field=z.default;exports.FileUpload=J.default;exports.Alert=W.default;exports.Avatar=X.default;exports.Badge=Z.default;exports.Breadcrumb=ee.default;exports.Card=r.default;exports.CardBody=r.CardBody;exports.CardFooter=r.CardFooter;exports.CardMedia=r.CardMedia;exports.CardOverlay=r.CardOverlay;exports.Carousel=re.default;exports.CodeBadge=te.default;exports.Kbd=ie.default;exports.StatusDot=ne.default;exports.CopyField=ue.default;exports.Divider=oe.default;exports.Directory=i.default;exports.DirectoryGroup=i.DirectoryGroup;exports.DirectoryJump=i.DirectoryJump;exports.DirectoryRow=i.DirectoryRow;exports.EmptyState=de.default;exports.PageHeader=ae.default;exports.Panel=u.default;exports.PanelForm=u.PanelForm;exports.PanelRow=u.PanelRow;exports.Price=le.default;exports.Rating=se.default;exports.SectionHeader=ce.default;exports.ScrollArea=fe.default;exports.Skeleton=n.default;exports.SkeletonCard=n.SkeletonCard;exports.SkeletonRows=n.SkeletonRows;exports.SkeletonTable=n.SkeletonTable;exports.Stat=qe.default;exports.SummaryCard=xe.default;exports.Progress=l.default;exports.ProgressCircle=l.ProgressCircle;exports.Spinner=Te.default;exports.ToastHub=s.default;exports.toast=s.toast;exports.ToastPortal=$e.default;exports.Accordion=Ee.default;exports.Disclosure=Se.default;exports.Steps=_e.default;exports.Tabs=Be.default;exports.Tile=Re.default;exports.Timeline=Pe.default;exports.BottomSheet=Ae.default;exports.Modal=me.default;exports.CommandPalette=Oe.default;exports.ConfirmDialog=pe.default;exports.Drawer=Ce.default;exports.PromptDialog=Ie.default;exports.Table=c.default;exports.TableScroller=c.TableScroller;exports.DataTable=f.default;exports.DataTableRow=f.DataTableRow;exports.FilterBar=q.default;exports.FilterBarField=q.FilterBarField;exports.Pagination=be.default;
 //# sourceMappingURL=index.cjs.map

package/build/index.d.ts

@@ -3,11 +3,9 @@
  * kadar kaldırılmaz ve davranışı sessizce değişmez.
  */
 export { default as UiProvider } from './theme/UiProvider';
-export { default as initUi } from './theme/initUi';
 export { default as UiThemeScript } from './theme/UiThemeScript';
 export { useUi } from './theme/context';
-export { COMPACT_DENSITY, DARK_THEME, DEFAULT_FONTS, LIGHT_THEME, METRIC_TOKENS, } from './theme/tokens';
-export { applyThemeConfig, buildThemeCss, DENSITY_ATTRIBUTE, resolveTokens, THEME_ATTRIBUTE, } from './helpers/theme.helper';
+export { THEME_ATTRIBUTE, THEME_BOOT_SCRIPT, THEME_BOOT_SCRIPT_HASH, THEME_STORAGE_KEY, } from '@handijit/design';
 export { hasOpenSurface } from './helpers/focus.helper';
 export { default as useAnnounce } from './hooks/useAnnounce';
 export { default as useUiTheme } from './hooks/useUiTheme';
@@ -20,7 +18,7 @@ export { default as UIVariant } from './enums/ui-variant.enum';
 export { default as UISize } from './enums/ui-size.enum';
 export type { CommonElementProps } from './types/common-element-props.type';
 export type { UiLinkComponent, UiLinkExtraProps, UiLinkProps } from './types/link.type';
-export { ABOVE_MOBILE_MEDIA_QUERY, ABOVE_TABLET_MEDIA_QUERY, MOBILE_BREAKPOINT, TABLET_BREAKPOINT, TABLET_PORTRAIT_BREAKPOINT, } from './constants/breakpoint.constants';
+export { ABOVE_MOBILE_MEDIA_QUERY, ABOVE_TABLET_MEDIA_QUERY, MOBILE_BREAKPOINT, SHEET_MEDIA_QUERY, TABLET_BREAKPOINT, TABLET_PORTRAIT_BREAKPOINT, } from './constants/breakpoint.constants';
 export { matchesSearch, normalizeSearchTerm } from './helpers/text.helper';
 export { default as Button } from './components/Button';
 export { default as IconButton, type IconButtonVariant } from './components/IconButton';
@@ -92,4 +90,4 @@ export { default as FilterBar, FilterBarField } from './components/FilterBar';
 export { default as Pagination } from './components/Pagination';
 export type { AnnouncePoliteness, ListboxNavigationOptions, VirtualRange } from './types/hook.type';
 export type { PositionAlign, PositionSide, PositioningOptions, PositioningState, } from './types/positioning.type';
-export type { UiColorPreference, UiColorScheme, UiContextValue, UiDensity, UiFonts, UiLabels, UiMetricToken, UiMetrics, UiResolvedTokens, UiThemeConfig, UiThemeTokens, UiToken, InitUiOptions, } from './types/theme.type';
+export type { UiColorPreference, UiColorScheme, UiContextValue, UiLabels, UiThemeState, } from './types/theme.type';