@ktnpm_devops/react-component 0.12.0 → 0.13.0

package/dist/index7.cjs

@@ -1,68 +1,36 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const truncateWithEllipsis = (value, maxLength = 36) => {
-  if (value.length <= maxLength) return value;
-  if (maxLength <= 3) return value.slice(0, maxLength);
-  return `${value.slice(0, maxLength - 3)}...`;
+const react = require("react");
+const THEME_ATTRIBUTE = "data-theme";
+const DARK_QUERY = "(prefers-color-scheme: dark)";
+const readThemeMode = () => {
+  var _a;
+  if (typeof document === "undefined") return "light";
+  const explicit = document.documentElement.getAttribute(THEME_ATTRIBUTE);
+  if (explicit === "dark" || explicit === "light") return explicit;
+  return typeof window !== "undefined" && ((_a = window.matchMedia) == null ? void 0 : _a.call(window, DARK_QUERY).matches) ? "dark" : "light";
 };
-const formatNumber = (value, options) => Number.isFinite(value) ? value.toLocaleString(void 0, options) : "0";
-const formatBytes = (value) => {
-  if (!Number.isFinite(value) || value === 0) return "0 B";
-  const units = ["B", "KB", "MB", "GB", "TB", "PB"];
-  let index = 0;
-  let current = Math.abs(value);
-  while (current >= 1024 && index < units.length - 1) {
-    current /= 1024;
-    index += 1;
-  }
-  const formatted = current.toFixed(current >= 10 || index === 0 ? 0 : 1);
-  return `${value < 0 ? "-" : ""}${formatted} ${units[index]}`;
-};
-const DATETIME_FORMATTERS = /* @__PURE__ */ new Map();
-const getDateTimeFormatter = (timeZone, withSeconds) => {
-  const key = `${timeZone}-${withSeconds ? "s" : "n"}`;
-  const cached = DATETIME_FORMATTERS.get(key);
-  if (cached) return cached;
-  const formatter = new Intl.DateTimeFormat(void 0, {
-    year: "numeric",
-    month: "2-digit",
-    day: "2-digit",
-    hour: "2-digit",
-    minute: "2-digit",
-    second: withSeconds ? "2-digit" : void 0,
-    hour12: false,
-    timeZone
-  });
-  DATETIME_FORMATTERS.set(key, formatter);
-  return formatter;
-};
-const formatDataTimestamp = (value, options = {}) => {
-  const { fallback = "Unknown", withSeconds = false, timeZone = "UTC", showTimeZoneLabel = false } = options;
-  if (!value) return fallback;
-  const date = new Date(value);
-  if (Number.isNaN(date.getTime())) return typeof value === "string" ? value : fallback;
-  const formatter = getDateTimeFormatter(timeZone, withSeconds);
-  const formatted = formatter.format(date);
-  return showTimeZoneLabel ? `${formatted} ${timeZone}` : formatted;
-};
-const formatLocalISOString = (date) => {
-  const pad = (n) => `${n}`.padStart(2, "0");
-  return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}T${pad(date.getHours())}:${pad(date.getMinutes())}:${pad(date.getSeconds())}`;
-};
-const generateUUID = () => {
-  if (typeof crypto !== "undefined" && typeof crypto.randomUUID === "function") {
-    return crypto.randomUUID();
-  }
-  return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (c) => {
-    const r = Math.random() * 16 | 0;
-    const v = c === "x" ? r : r & 3 | 8;
-    return v.toString(16);
-  });
-};
-exports.formatBytes = formatBytes;
-exports.formatDataTimestamp = formatDataTimestamp;
-exports.formatLocalISOString = formatLocalISOString;
-exports.formatNumber = formatNumber;
-exports.generateUUID = generateUUID;
-exports.truncateWithEllipsis = truncateWithEllipsis;
+function useThemeMode() {
+  const [mode, setMode] = react.useState(readThemeMode);
+  react.useEffect(() => {
+    var _a, _b;
+    if (typeof document === "undefined") return;
+    const sync = () => setMode(readThemeMode());
+    sync();
+    const observer = new MutationObserver(sync);
+    observer.observe(document.documentElement, {
+      attributes: true,
+      attributeFilter: [THEME_ATTRIBUTE]
+    });
+    const media = (_a = window.matchMedia) == null ? void 0 : _a.call(window, DARK_QUERY);
+    (_b = media == null ? void 0 : media.addEventListener) == null ? void 0 : _b.call(media, "change", sync);
+    return () => {
+      var _a2;
+      observer.disconnect();
+      (_a2 = media == null ? void 0 : media.removeEventListener) == null ? void 0 : _a2.call(media, "change", sync);
+    };
+  }, []);
+  return mode;
+}
+exports.useThemeMode = useThemeMode;
 //# sourceMappingURL=index7.cjs.map

package/dist/index7.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index7.cjs","sources":["../src/utils/format.ts"],"sourcesContent":["export const truncateWithEllipsis = (value: string, maxLength = 36) => {\n  if (value.length <= maxLength) return value;\n  if (maxLength <= 3) return value.slice(0, maxLength);\n  return `${value.slice(0, maxLength - 3)}...`;\n};\n\nexport const formatNumber = (value: number, options?: Intl.NumberFormatOptions) =>\n  Number.isFinite(value) ? value.toLocaleString(undefined, options) : '0';\n\nexport const formatBytes = (value: number): string => {\n  if (!Number.isFinite(value) || value === 0) return '0 B';\n  const units = ['B', 'KB', 'MB', 'GB', 'TB', 'PB'];\n  let index = 0;\n  let current = Math.abs(value);\n  while (current >= 1024 && index < units.length - 1) {\n    current /= 1024;\n    index += 1;\n  }\n  const formatted = current.toFixed(current >= 10 || index === 0 ? 0 : 1);\n  return `${value < 0 ? '-' : ''}${formatted} ${units[index]}`;\n};\n\ninterface FormatDataTimestampOptions {\n  fallback?: string;\n  withSeconds?: boolean;\n  timeZone?: string;\n  showTimeZoneLabel?: boolean;\n}\n\nconst DATETIME_FORMATTERS = new Map<string, Intl.DateTimeFormat>();\n\nconst getDateTimeFormatter = (timeZone: string, withSeconds: boolean) => {\n  const key = `${timeZone}-${withSeconds ? 's' : 'n'}`;\n  const cached = DATETIME_FORMATTERS.get(key);\n  if (cached) return cached;\n  const formatter = new Intl.DateTimeFormat(undefined, {\n    year: 'numeric',\n    month: '2-digit',\n    day: '2-digit',\n    hour: '2-digit',\n    minute: '2-digit',\n    second: withSeconds ? '2-digit' : undefined,\n    hour12: false,\n    timeZone,\n  });\n  DATETIME_FORMATTERS.set(key, formatter);\n  return formatter;\n};\n\nexport const formatDataTimestamp = (\n  value: string | null | undefined,\n  options: FormatDataTimestampOptions = {},\n): string => {\n  const { fallback = 'Unknown', withSeconds = false, timeZone = 'UTC', showTimeZoneLabel = false } =\n    options;\n  if (!value) return fallback;\n  const date = new Date(value);\n  if (Number.isNaN(date.getTime())) return typeof value === 'string' ? value : fallback;\n  const formatter = getDateTimeFormatter(timeZone, withSeconds);\n  const formatted = formatter.format(date);\n  return showTimeZoneLabel ? `${formatted} ${timeZone}` : formatted;\n};\n\nexport const formatLocalISOString = (date: Date): string => {\n  const pad = (n: number) => `${n}`.padStart(2, '0');\n  return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}T${pad(date.getHours())}:${pad(date.getMinutes())}:${pad(date.getSeconds())}`;\n};\n\nexport const generateUUID = (): string => {\n  if (typeof crypto !== 'undefined' && typeof crypto.randomUUID === 'function') {\n    return crypto.randomUUID();\n  }\n  return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => {\n    const r = (Math.random() * 16) | 0;\n    const v = c === 'x' ? r : (r & 0x3) | 0x8;\n    return v.toString(16);\n  });\n};\n"],"names":[],"mappings":";;AAAO,MAAM,uBAAuB,CAAC,OAAe,YAAY,OAAO;AACrE,MAAI,MAAM,UAAU,UAAW,QAAO;AACtC,MAAI,aAAa,EAAG,QAAO,MAAM,MAAM,GAAG,SAAS;AACnD,SAAO,GAAG,MAAM,MAAM,GAAG,YAAY,CAAC,CAAC;AACzC;AAEO,MAAM,eAAe,CAAC,OAAe,YAC1C,OAAO,SAAS,KAAK,IAAI,MAAM,eAAe,QAAW,OAAO,IAAI;AAE/D,MAAM,cAAc,CAAC,UAA0B;AACpD,MAAI,CAAC,OAAO,SAAS,KAAK,KAAK,UAAU,EAAG,QAAO;AACnD,QAAM,QAAQ,CAAC,KAAK,MAAM,MAAM,MAAM,MAAM,IAAI;AAChD,MAAI,QAAQ;AACZ,MAAI,UAAU,KAAK,IAAI,KAAK;AAC5B,SAAO,WAAW,QAAQ,QAAQ,MAAM,SAAS,GAAG;AAClD,eAAW;AACX,aAAS;AAAA,EACX;AACA,QAAM,YAAY,QAAQ,QAAQ,WAAW,MAAM,UAAU,IAAI,IAAI,CAAC;AACtE,SAAO,GAAG,QAAQ,IAAI,MAAM,EAAE,GAAG,SAAS,IAAI,MAAM,KAAK,CAAC;AAC5D;AASA,MAAM,0CAA0B,IAAA;AAEhC,MAAM,uBAAuB,CAAC,UAAkB,gBAAyB;AACvE,QAAM,MAAM,GAAG,QAAQ,IAAI,cAAc,MAAM,GAAG;AAClD,QAAM,SAAS,oBAAoB,IAAI,GAAG;AAC1C,MAAI,OAAQ,QAAO;AACnB,QAAM,YAAY,IAAI,KAAK,eAAe,QAAW;AAAA,IACnD,MAAM;AAAA,IACN,OAAO;AAAA,IACP,KAAK;AAAA,IACL,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,QAAQ,cAAc,YAAY;AAAA,IAClC,QAAQ;AAAA,IACR;AAAA,EAAA,CACD;AACD,sBAAoB,IAAI,KAAK,SAAS;AACtC,SAAO;AACT;AAEO,MAAM,sBAAsB,CACjC,OACA,UAAsC,OAC3B;AACX,QAAM,EAAE,WAAW,WAAW,cAAc,OAAO,WAAW,OAAO,oBAAoB,MAAA,IACvF;AACF,MAAI,CAAC,MAAO,QAAO;AACnB,QAAM,OAAO,IAAI,KAAK,KAAK;AAC3B,MAAI,OAAO,MAAM,KAAK,QAAA,CAAS,EAAG,QAAO,OAAO,UAAU,WAAW,QAAQ;AAC7E,QAAM,YAAY,qBAAqB,UAAU,WAAW;AAC5D,QAAM,YAAY,UAAU,OAAO,IAAI;AACvC,SAAO,oBAAoB,GAAG,SAAS,IAAI,QAAQ,KAAK;AAC1D;AAEO,MAAM,uBAAuB,CAAC,SAAuB;AAC1D,QAAM,MAAM,CAAC,MAAc,GAAG,CAAC,GAAG,SAAS,GAAG,GAAG;AACjD,SAAO,GAAG,KAAK,YAAA,CAAa,IAAI,IAAI,KAAK,SAAA,IAAa,CAAC,CAAC,IAAI,IAAI,KAAK,SAAS,CAAC,IAAI,IAAI,KAAK,SAAA,CAAU,CAAC,IAAI,IAAI,KAAK,WAAA,CAAY,CAAC,IAAI,IAAI,KAAK,WAAA,CAAY,CAAC;AAC7J;AAEO,MAAM,eAAe,MAAc;AACxC,MAAI,OAAO,WAAW,eAAe,OAAO,OAAO,eAAe,YAAY;AAC5E,WAAO,OAAO,WAAA;AAAA,EAChB;AACA,SAAO,uCAAuC,QAAQ,SAAS,CAAC,MAAM;AACpE,UAAM,IAAK,KAAK,OAAA,IAAW,KAAM;AACjC,UAAM,IAAI,MAAM,MAAM,IAAK,IAAI,IAAO;AACtC,WAAO,EAAE,SAAS,EAAE;AAAA,EACtB,CAAC;AACH;;;;;;;"}
+{"version":3,"file":"index7.cjs","sources":["../src/hooks/useThemeMode.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nexport type ThemeMode = 'light' | 'dark';\n\nconst THEME_ATTRIBUTE = 'data-theme';\nconst DARK_QUERY = '(prefers-color-scheme: dark)';\n\n/**\n * An explicit `data-theme` on `<html>` wins; otherwise the OS preference decides.\n * Server-side there is neither, so `light` is the answer.\n */\nconst readThemeMode = (): ThemeMode => {\n  if (typeof document === 'undefined') return 'light';\n\n  const explicit = document.documentElement.getAttribute(THEME_ATTRIBUTE);\n  if (explicit === 'dark' || explicit === 'light') return explicit;\n\n  return typeof window !== 'undefined' && window.matchMedia?.(DARK_QUERY).matches ? 'dark' : 'light';\n};\n\n/**\n * Current theme, for the components that must hand colours to something the CSS\n * custom properties cannot reach — a canvas, an SVG drawn by a third party, a\n * remote tile server. Anything styled with CSS should use the tokens instead.\n */\nexport function useThemeMode(): ThemeMode {\n  const [mode, setMode] = useState<ThemeMode>(readThemeMode);\n\n  useEffect(() => {\n    if (typeof document === 'undefined') return;\n\n    const sync = () => setMode(readThemeMode());\n    sync();\n\n    const observer = new MutationObserver(sync);\n    observer.observe(document.documentElement, {\n      attributes: true,\n      attributeFilter: [THEME_ATTRIBUTE],\n    });\n\n    const media = window.matchMedia?.(DARK_QUERY);\n    media?.addEventListener?.('change', sync);\n\n    return () => {\n      observer.disconnect();\n      media?.removeEventListener?.('change', sync);\n    };\n  }, []);\n\n  return mode;\n}\n"],"names":["useState","useEffect","_a"],"mappings":";;;AAIA,MAAM,kBAAkB;AACxB,MAAM,aAAa;AAMnB,MAAM,gBAAgB,MAAiB;;AACrC,MAAI,OAAO,aAAa,YAAa,QAAO;AAE5C,QAAM,WAAW,SAAS,gBAAgB,aAAa,eAAe;AACtE,MAAI,aAAa,UAAU,aAAa,QAAS,QAAO;AAExD,SAAO,OAAO,WAAW,iBAAe,YAAO,eAAP,gCAAoB,YAAY,WAAU,SAAS;AAC7F;AAOO,SAAS,eAA0B;AACxC,QAAM,CAAC,MAAM,OAAO,IAAIA,MAAAA,SAAoB,aAAa;AAEzDC,QAAAA,UAAU,MAAM;;AACd,QAAI,OAAO,aAAa,YAAa;AAErC,UAAM,OAAO,MAAM,QAAQ,eAAe;AAC1C,SAAA;AAEA,UAAM,WAAW,IAAI,iBAAiB,IAAI;AAC1C,aAAS,QAAQ,SAAS,iBAAiB;AAAA,MACzC,YAAY;AAAA,MACZ,iBAAiB,CAAC,eAAe;AAAA,IAAA,CAClC;AAED,UAAM,SAAQ,YAAO,eAAP,gCAAoB;AAClC,yCAAO,qBAAP,+BAA0B,UAAU;AAEpC,WAAO,MAAM;;AACX,eAAS,WAAA;AACT,OAAAC,MAAA,+BAAO,wBAAP,gBAAAA,IAAA,YAA6B,UAAU;AAAA,IACzC;AAAA,EACF,GAAG,CAAA,CAAE;AAEL,SAAO;AACT;;"}

package/dist/index7.js

@@ -1,68 +1,36 @@
-const truncateWithEllipsis = (value, maxLength = 36) => {
-  if (value.length <= maxLength) return value;
-  if (maxLength <= 3) return value.slice(0, maxLength);
-  return `${value.slice(0, maxLength - 3)}...`;
-};
-const formatNumber = (value, options) => Number.isFinite(value) ? value.toLocaleString(void 0, options) : "0";
-const formatBytes = (value) => {
-  if (!Number.isFinite(value) || value === 0) return "0 B";
-  const units = ["B", "KB", "MB", "GB", "TB", "PB"];
-  let index = 0;
-  let current = Math.abs(value);
-  while (current >= 1024 && index < units.length - 1) {
-    current /= 1024;
-    index += 1;
-  }
-  const formatted = current.toFixed(current >= 10 || index === 0 ? 0 : 1);
-  return `${value < 0 ? "-" : ""}${formatted} ${units[index]}`;
-};
-const DATETIME_FORMATTERS = /* @__PURE__ */ new Map();
-const getDateTimeFormatter = (timeZone, withSeconds) => {
-  const key = `${timeZone}-${withSeconds ? "s" : "n"}`;
-  const cached = DATETIME_FORMATTERS.get(key);
-  if (cached) return cached;
-  const formatter = new Intl.DateTimeFormat(void 0, {
-    year: "numeric",
-    month: "2-digit",
-    day: "2-digit",
-    hour: "2-digit",
-    minute: "2-digit",
-    second: withSeconds ? "2-digit" : void 0,
-    hour12: false,
-    timeZone
-  });
-  DATETIME_FORMATTERS.set(key, formatter);
-  return formatter;
-};
-const formatDataTimestamp = (value, options = {}) => {
-  const { fallback = "Unknown", withSeconds = false, timeZone = "UTC", showTimeZoneLabel = false } = options;
-  if (!value) return fallback;
-  const date = new Date(value);
-  if (Number.isNaN(date.getTime())) return typeof value === "string" ? value : fallback;
-  const formatter = getDateTimeFormatter(timeZone, withSeconds);
-  const formatted = formatter.format(date);
-  return showTimeZoneLabel ? `${formatted} ${timeZone}` : formatted;
-};
-const formatLocalISOString = (date) => {
-  const pad = (n) => `${n}`.padStart(2, "0");
-  return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}T${pad(date.getHours())}:${pad(date.getMinutes())}:${pad(date.getSeconds())}`;
-};
-const generateUUID = () => {
-  if (typeof crypto !== "undefined" && typeof crypto.randomUUID === "function") {
-    return crypto.randomUUID();
-  }
-  return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (c) => {
-    const r = Math.random() * 16 | 0;
-    const v = c === "x" ? r : r & 3 | 8;
-    return v.toString(16);
-  });
+import { useState, useEffect } from "react";
+const THEME_ATTRIBUTE = "data-theme";
+const DARK_QUERY = "(prefers-color-scheme: dark)";
+const readThemeMode = () => {
+  var _a;
+  if (typeof document === "undefined") return "light";
+  const explicit = document.documentElement.getAttribute(THEME_ATTRIBUTE);
+  if (explicit === "dark" || explicit === "light") return explicit;
+  return typeof window !== "undefined" && ((_a = window.matchMedia) == null ? void 0 : _a.call(window, DARK_QUERY).matches) ? "dark" : "light";
 };
+function useThemeMode() {
+  const [mode, setMode] = useState(readThemeMode);
+  useEffect(() => {
+    var _a, _b;
+    if (typeof document === "undefined") return;
+    const sync = () => setMode(readThemeMode());
+    sync();
+    const observer = new MutationObserver(sync);
+    observer.observe(document.documentElement, {
+      attributes: true,
+      attributeFilter: [THEME_ATTRIBUTE]
+    });
+    const media = (_a = window.matchMedia) == null ? void 0 : _a.call(window, DARK_QUERY);
+    (_b = media == null ? void 0 : media.addEventListener) == null ? void 0 : _b.call(media, "change", sync);
+    return () => {
+      var _a2;
+      observer.disconnect();
+      (_a2 = media == null ? void 0 : media.removeEventListener) == null ? void 0 : _a2.call(media, "change", sync);
+    };
+  }, []);
+  return mode;
+}
 export {
-  formatBytes,
-  formatDataTimestamp,
-  formatLocalISOString,
-  formatNumber,
-  generateUUID,
-  truncateWithEllipsis
+  useThemeMode
 };
 //# sourceMappingURL=index7.js.map

package/dist/index7.js.map

@@ -1 +1 @@
-{"version":3,"file":"index7.js","sources":["../src/utils/format.ts"],"sourcesContent":["export const truncateWithEllipsis = (value: string, maxLength = 36) => {\n  if (value.length <= maxLength) return value;\n  if (maxLength <= 3) return value.slice(0, maxLength);\n  return `${value.slice(0, maxLength - 3)}...`;\n};\n\nexport const formatNumber = (value: number, options?: Intl.NumberFormatOptions) =>\n  Number.isFinite(value) ? value.toLocaleString(undefined, options) : '0';\n\nexport const formatBytes = (value: number): string => {\n  if (!Number.isFinite(value) || value === 0) return '0 B';\n  const units = ['B', 'KB', 'MB', 'GB', 'TB', 'PB'];\n  let index = 0;\n  let current = Math.abs(value);\n  while (current >= 1024 && index < units.length - 1) {\n    current /= 1024;\n    index += 1;\n  }\n  const formatted = current.toFixed(current >= 10 || index === 0 ? 0 : 1);\n  return `${value < 0 ? '-' : ''}${formatted} ${units[index]}`;\n};\n\ninterface FormatDataTimestampOptions {\n  fallback?: string;\n  withSeconds?: boolean;\n  timeZone?: string;\n  showTimeZoneLabel?: boolean;\n}\n\nconst DATETIME_FORMATTERS = new Map<string, Intl.DateTimeFormat>();\n\nconst getDateTimeFormatter = (timeZone: string, withSeconds: boolean) => {\n  const key = `${timeZone}-${withSeconds ? 's' : 'n'}`;\n  const cached = DATETIME_FORMATTERS.get(key);\n  if (cached) return cached;\n  const formatter = new Intl.DateTimeFormat(undefined, {\n    year: 'numeric',\n    month: '2-digit',\n    day: '2-digit',\n    hour: '2-digit',\n    minute: '2-digit',\n    second: withSeconds ? '2-digit' : undefined,\n    hour12: false,\n    timeZone,\n  });\n  DATETIME_FORMATTERS.set(key, formatter);\n  return formatter;\n};\n\nexport const formatDataTimestamp = (\n  value: string | null | undefined,\n  options: FormatDataTimestampOptions = {},\n): string => {\n  const { fallback = 'Unknown', withSeconds = false, timeZone = 'UTC', showTimeZoneLabel = false } =\n    options;\n  if (!value) return fallback;\n  const date = new Date(value);\n  if (Number.isNaN(date.getTime())) return typeof value === 'string' ? value : fallback;\n  const formatter = getDateTimeFormatter(timeZone, withSeconds);\n  const formatted = formatter.format(date);\n  return showTimeZoneLabel ? `${formatted} ${timeZone}` : formatted;\n};\n\nexport const formatLocalISOString = (date: Date): string => {\n  const pad = (n: number) => `${n}`.padStart(2, '0');\n  return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}T${pad(date.getHours())}:${pad(date.getMinutes())}:${pad(date.getSeconds())}`;\n};\n\nexport const generateUUID = (): string => {\n  if (typeof crypto !== 'undefined' && typeof crypto.randomUUID === 'function') {\n    return crypto.randomUUID();\n  }\n  return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => {\n    const r = (Math.random() * 16) | 0;\n    const v = c === 'x' ? r : (r & 0x3) | 0x8;\n    return v.toString(16);\n  });\n};\n"],"names":[],"mappings":"AAAO,MAAM,uBAAuB,CAAC,OAAe,YAAY,OAAO;AACrE,MAAI,MAAM,UAAU,UAAW,QAAO;AACtC,MAAI,aAAa,EAAG,QAAO,MAAM,MAAM,GAAG,SAAS;AACnD,SAAO,GAAG,MAAM,MAAM,GAAG,YAAY,CAAC,CAAC;AACzC;AAEO,MAAM,eAAe,CAAC,OAAe,YAC1C,OAAO,SAAS,KAAK,IAAI,MAAM,eAAe,QAAW,OAAO,IAAI;AAE/D,MAAM,cAAc,CAAC,UAA0B;AACpD,MAAI,CAAC,OAAO,SAAS,KAAK,KAAK,UAAU,EAAG,QAAO;AACnD,QAAM,QAAQ,CAAC,KAAK,MAAM,MAAM,MAAM,MAAM,IAAI;AAChD,MAAI,QAAQ;AACZ,MAAI,UAAU,KAAK,IAAI,KAAK;AAC5B,SAAO,WAAW,QAAQ,QAAQ,MAAM,SAAS,GAAG;AAClD,eAAW;AACX,aAAS;AAAA,EACX;AACA,QAAM,YAAY,QAAQ,QAAQ,WAAW,MAAM,UAAU,IAAI,IAAI,CAAC;AACtE,SAAO,GAAG,QAAQ,IAAI,MAAM,EAAE,GAAG,SAAS,IAAI,MAAM,KAAK,CAAC;AAC5D;AASA,MAAM,0CAA0B,IAAA;AAEhC,MAAM,uBAAuB,CAAC,UAAkB,gBAAyB;AACvE,QAAM,MAAM,GAAG,QAAQ,IAAI,cAAc,MAAM,GAAG;AAClD,QAAM,SAAS,oBAAoB,IAAI,GAAG;AAC1C,MAAI,OAAQ,QAAO;AACnB,QAAM,YAAY,IAAI,KAAK,eAAe,QAAW;AAAA,IACnD,MAAM;AAAA,IACN,OAAO;AAAA,IACP,KAAK;AAAA,IACL,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,QAAQ,cAAc,YAAY;AAAA,IAClC,QAAQ;AAAA,IACR;AAAA,EAAA,CACD;AACD,sBAAoB,IAAI,KAAK,SAAS;AACtC,SAAO;AACT;AAEO,MAAM,sBAAsB,CACjC,OACA,UAAsC,OAC3B;AACX,QAAM,EAAE,WAAW,WAAW,cAAc,OAAO,WAAW,OAAO,oBAAoB,MAAA,IACvF;AACF,MAAI,CAAC,MAAO,QAAO;AACnB,QAAM,OAAO,IAAI,KAAK,KAAK;AAC3B,MAAI,OAAO,MAAM,KAAK,QAAA,CAAS,EAAG,QAAO,OAAO,UAAU,WAAW,QAAQ;AAC7E,QAAM,YAAY,qBAAqB,UAAU,WAAW;AAC5D,QAAM,YAAY,UAAU,OAAO,IAAI;AACvC,SAAO,oBAAoB,GAAG,SAAS,IAAI,QAAQ,KAAK;AAC1D;AAEO,MAAM,uBAAuB,CAAC,SAAuB;AAC1D,QAAM,MAAM,CAAC,MAAc,GAAG,CAAC,GAAG,SAAS,GAAG,GAAG;AACjD,SAAO,GAAG,KAAK,YAAA,CAAa,IAAI,IAAI,KAAK,SAAA,IAAa,CAAC,CAAC,IAAI,IAAI,KAAK,SAAS,CAAC,IAAI,IAAI,KAAK,SAAA,CAAU,CAAC,IAAI,IAAI,KAAK,WAAA,CAAY,CAAC,IAAI,IAAI,KAAK,WAAA,CAAY,CAAC;AAC7J;AAEO,MAAM,eAAe,MAAc;AACxC,MAAI,OAAO,WAAW,eAAe,OAAO,OAAO,eAAe,YAAY;AAC5E,WAAO,OAAO,WAAA;AAAA,EAChB;AACA,SAAO,uCAAuC,QAAQ,SAAS,CAAC,MAAM;AACpE,UAAM,IAAK,KAAK,OAAA,IAAW,KAAM;AACjC,UAAM,IAAI,MAAM,MAAM,IAAK,IAAI,IAAO;AACtC,WAAO,EAAE,SAAS,EAAE;AAAA,EACtB,CAAC;AACH;"}
+{"version":3,"file":"index7.js","sources":["../src/hooks/useThemeMode.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nexport type ThemeMode = 'light' | 'dark';\n\nconst THEME_ATTRIBUTE = 'data-theme';\nconst DARK_QUERY = '(prefers-color-scheme: dark)';\n\n/**\n * An explicit `data-theme` on `<html>` wins; otherwise the OS preference decides.\n * Server-side there is neither, so `light` is the answer.\n */\nconst readThemeMode = (): ThemeMode => {\n  if (typeof document === 'undefined') return 'light';\n\n  const explicit = document.documentElement.getAttribute(THEME_ATTRIBUTE);\n  if (explicit === 'dark' || explicit === 'light') return explicit;\n\n  return typeof window !== 'undefined' && window.matchMedia?.(DARK_QUERY).matches ? 'dark' : 'light';\n};\n\n/**\n * Current theme, for the components that must hand colours to something the CSS\n * custom properties cannot reach — a canvas, an SVG drawn by a third party, a\n * remote tile server. Anything styled with CSS should use the tokens instead.\n */\nexport function useThemeMode(): ThemeMode {\n  const [mode, setMode] = useState<ThemeMode>(readThemeMode);\n\n  useEffect(() => {\n    if (typeof document === 'undefined') return;\n\n    const sync = () => setMode(readThemeMode());\n    sync();\n\n    const observer = new MutationObserver(sync);\n    observer.observe(document.documentElement, {\n      attributes: true,\n      attributeFilter: [THEME_ATTRIBUTE],\n    });\n\n    const media = window.matchMedia?.(DARK_QUERY);\n    media?.addEventListener?.('change', sync);\n\n    return () => {\n      observer.disconnect();\n      media?.removeEventListener?.('change', sync);\n    };\n  }, []);\n\n  return mode;\n}\n"],"names":["_a"],"mappings":";AAIA,MAAM,kBAAkB;AACxB,MAAM,aAAa;AAMnB,MAAM,gBAAgB,MAAiB;;AACrC,MAAI,OAAO,aAAa,YAAa,QAAO;AAE5C,QAAM,WAAW,SAAS,gBAAgB,aAAa,eAAe;AACtE,MAAI,aAAa,UAAU,aAAa,QAAS,QAAO;AAExD,SAAO,OAAO,WAAW,iBAAe,YAAO,eAAP,gCAAoB,YAAY,WAAU,SAAS;AAC7F;AAOO,SAAS,eAA0B;AACxC,QAAM,CAAC,MAAM,OAAO,IAAI,SAAoB,aAAa;AAEzD,YAAU,MAAM;;AACd,QAAI,OAAO,aAAa,YAAa;AAErC,UAAM,OAAO,MAAM,QAAQ,eAAe;AAC1C,SAAA;AAEA,UAAM,WAAW,IAAI,iBAAiB,IAAI;AAC1C,aAAS,QAAQ,SAAS,iBAAiB;AAAA,MACzC,YAAY;AAAA,MACZ,iBAAiB,CAAC,eAAe;AAAA,IAAA,CAClC;AAED,UAAM,SAAQ,YAAO,eAAP,gCAAoB;AAClC,yCAAO,qBAAP,+BAA0B,UAAU;AAEpC,WAAO,MAAM;;AACX,eAAS,WAAA;AACT,OAAAA,MAAA,+BAAO,wBAAP,gBAAAA,IAAA,YAA6B,UAAU;AAAA,IACzC;AAAA,EACF,GAAG,CAAA,CAAE;AAEL,SAAO;AACT;"}

package/dist/index70.cjs

@@ -1,9 +1,18 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const root = "krc-root-bWynN";
+const root = "krc-root-GPZXT";
+const sm = "krc-sm-QGnvH";
+const md = "krc-md-rQKlJ";
+const lg = "krc-lg-eC2yT";
 const styles = {
-  root
+  root,
+  sm,
+  md,
+  lg
 };
 exports.default = styles;
+exports.lg = lg;
+exports.md = md;
 exports.root = root;
+exports.sm = sm;
 //# sourceMappingURL=index70.cjs.map

package/dist/index70.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index70.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
+{"version":3,"file":"index70.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;"}

package/dist/index70.js

@@ -1,9 +1,18 @@
-const root = "krc-root-bWynN";
+const root = "krc-root-GPZXT";
+const sm = "krc-sm-QGnvH";
+const md = "krc-md-rQKlJ";
+const lg = "krc-lg-eC2yT";
 const styles = {
-  root
+  root,
+  sm,
+  md,
+  lg
 };
 export {
   styles as default,
-  root
+  lg,
+  md,
+  root,
+  sm
 };
 //# sourceMappingURL=index70.js.map

package/dist/index70.js.map

@@ -1 +1 @@
-{"version":3,"file":"index70.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
+{"version":3,"file":"index70.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}

package/dist/index71.cjs

@@ -1,18 +1,24 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const root = "krc-root-AouLD";
-const header = "krc-header-pNze5";
-const content = "krc-content-egG2e";
-const footer = "krc-footer-WJw5Z";
+const root = "krc-root-p3Y59";
+const plain = "krc-plain-VC-9I";
+const icon = "krc-icon-ix2Mi";
+const title = "krc-title--QtUj";
+const description = "krc-description-Qrtj7";
+const action = "krc-action-NBNpI";
 const styles = {
   root,
-  header,
-  content,
-  footer
+  plain,
+  icon,
+  title,
+  description,
+  action
 };
-exports.content = content;
+exports.action = action;
 exports.default = styles;
-exports.footer = footer;
-exports.header = header;
+exports.description = description;
+exports.icon = icon;
+exports.plain = plain;
 exports.root = root;
+exports.title = title;
 //# sourceMappingURL=index71.cjs.map

package/dist/index71.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index71.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index71.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/index71.js

@@ -1,18 +1,24 @@
-const root = "krc-root-AouLD";
-const header = "krc-header-pNze5";
-const content = "krc-content-egG2e";
-const footer = "krc-footer-WJw5Z";
+const root = "krc-root-p3Y59";
+const plain = "krc-plain-VC-9I";
+const icon = "krc-icon-ix2Mi";
+const title = "krc-title--QtUj";
+const description = "krc-description-Qrtj7";
+const action = "krc-action-NBNpI";
 const styles = {
   root,
-  header,
-  content,
-  footer
+  plain,
+  icon,
+  title,
+  description,
+  action
 };
 export {
-  content,
+  action,
   styles as default,
-  footer,
-  header,
-  root
+  description,
+  icon,
+  plain,
+  root,
+  title
 };
 //# sourceMappingURL=index71.js.map

package/dist/index71.js.map

@@ -1 +1 @@
-{"version":3,"file":"index71.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}
+{"version":3,"file":"index71.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;"}

package/dist/index72.cjs

@@ -1,9 +1,87 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const root = "krc-root-FVKOX";
+const root = "krc-root-WYIsp";
+const trigger = "krc-trigger-UedSS";
+const active = "krc-active-cH8Tl";
+const triggerContent = "krc-triggerContent-Kkhoi";
+const chevron = "krc-chevron-NoNsI";
+const label = "krc-label-RPlXR";
+const valueGroup = "krc-valueGroup-xfNcx";
+const value = "krc-value-aKdIW";
+const badge = "krc-badge-yVq9o";
+const clear = "krc-clear-11V9Q";
+const panel = "krc-panel-xf2f8";
+const header = "krc-header--VMR-";
+const search = "krc-search-4gQgB";
+const headerActions = "krc-headerActions-orxXD";
+const chip = "krc-chip--n-9m";
+const chipGhost = "krc-chipGhost-oayjh";
+const list = "krc-list-NRoxf";
+const status = "krc-status-j7xbM";
+const statusError = "krc-statusError-u6rfB";
+const option = "krc-option-ZAXum";
+const optionLabel = "krc-optionLabel-MdDyI";
+const optionCount = "krc-optionCount-JSQl9";
+const create = "krc-create-hO8Cq";
+const footer = "krc-footer-2yk6S";
+const selection = "krc-selection-aYDH-";
+const selectionDelta = "krc-selectionDelta-S1dV7";
+const footerActions = "krc-footerActions-77iCX";
 const styles = {
-  root
+  root,
+  trigger,
+  active,
+  triggerContent,
+  chevron,
+  label,
+  valueGroup,
+  value,
+  badge,
+  clear,
+  panel,
+  header,
+  search,
+  headerActions,
+  chip,
+  chipGhost,
+  list,
+  status,
+  statusError,
+  option,
+  optionLabel,
+  optionCount,
+  create,
+  footer,
+  selection,
+  selectionDelta,
+  footerActions
 };
+exports.active = active;
+exports.badge = badge;
+exports.chevron = chevron;
+exports.chip = chip;
+exports.chipGhost = chipGhost;
+exports.clear = clear;
+exports.create = create;
 exports.default = styles;
+exports.footer = footer;
+exports.footerActions = footerActions;
+exports.header = header;
+exports.headerActions = headerActions;
+exports.label = label;
+exports.list = list;
+exports.option = option;
+exports.optionCount = optionCount;
+exports.optionLabel = optionLabel;
+exports.panel = panel;
 exports.root = root;
+exports.search = search;
+exports.selection = selection;
+exports.selectionDelta = selectionDelta;
+exports.status = status;
+exports.statusError = statusError;
+exports.trigger = trigger;
+exports.triggerContent = triggerContent;
+exports.value = value;
+exports.valueGroup = valueGroup;
 //# sourceMappingURL=index72.cjs.map

package/dist/index72.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index72.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
+{"version":3,"file":"index72.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/index72.js

@@ -1,9 +1,87 @@
-const root = "krc-root-FVKOX";
+const root = "krc-root-WYIsp";
+const trigger = "krc-trigger-UedSS";
+const active = "krc-active-cH8Tl";
+const triggerContent = "krc-triggerContent-Kkhoi";
+const chevron = "krc-chevron-NoNsI";
+const label = "krc-label-RPlXR";
+const valueGroup = "krc-valueGroup-xfNcx";
+const value = "krc-value-aKdIW";
+const badge = "krc-badge-yVq9o";
+const clear = "krc-clear-11V9Q";
+const panel = "krc-panel-xf2f8";
+const header = "krc-header--VMR-";
+const search = "krc-search-4gQgB";
+const headerActions = "krc-headerActions-orxXD";
+const chip = "krc-chip--n-9m";
+const chipGhost = "krc-chipGhost-oayjh";
+const list = "krc-list-NRoxf";
+const status = "krc-status-j7xbM";
+const statusError = "krc-statusError-u6rfB";
+const option = "krc-option-ZAXum";
+const optionLabel = "krc-optionLabel-MdDyI";
+const optionCount = "krc-optionCount-JSQl9";
+const create = "krc-create-hO8Cq";
+const footer = "krc-footer-2yk6S";
+const selection = "krc-selection-aYDH-";
+const selectionDelta = "krc-selectionDelta-S1dV7";
+const footerActions = "krc-footerActions-77iCX";
 const styles = {
-  root
+  root,
+  trigger,
+  active,
+  triggerContent,
+  chevron,
+  label,
+  valueGroup,
+  value,
+  badge,
+  clear,
+  panel,
+  header,
+  search,
+  headerActions,
+  chip,
+  chipGhost,
+  list,
+  status,
+  statusError,
+  option,
+  optionLabel,
+  optionCount,
+  create,
+  footer,
+  selection,
+  selectionDelta,
+  footerActions
 };
 export {
+  active,
+  badge,
+  chevron,
+  chip,
+  chipGhost,
+  clear,
+  create,
   styles as default,
-  root
+  footer,
+  footerActions,
+  header,
+  headerActions,
+  label,
+  list,
+  option,
+  optionCount,
+  optionLabel,
+  panel,
+  root,
+  search,
+  selection,
+  selectionDelta,
+  status,
+  statusError,
+  trigger,
+  triggerContent,
+  value,
+  valueGroup
 };
 //# sourceMappingURL=index72.js.map

package/dist/index72.js.map

@@ -1 +1 @@
-{"version":3,"file":"index72.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
+{"version":3,"file":"index72.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/index73.cjs

@@ -1,12 +1,54 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const container = "krc-container-cpDoQ";
-const root = "krc-root-20TMP";
+const root = "krc-root-zHJLB";
+const trigger = "krc-trigger-kRS4l";
+const isOpen = "krc-isOpen-4fsg7";
+const icon = "krc-icon-YS-DJ";
+const arrow = "krc-arrow-wiq8b";
+const pop = "krc-pop-boLzq";
+const head = "krc-head-FDhHr";
+const nav = "krc-nav-ZcR0Q";
+const title = "krc-title-MqB3H";
+const dows = "krc-dows-EshP3";
+const grid = "krc-grid-xiUF-";
+const day = "krc-day-2W9yq";
+const empty = "krc-empty-Mf05c";
+const off = "krc-off-tATo-";
+const able = "krc-able-bD-du";
+const selected = "krc-selected-Q1am3";
 const styles = {
-  container,
-  root
+  root,
+  trigger,
+  isOpen,
+  icon,
+  arrow,
+  pop,
+  head,
+  nav,
+  title,
+  dows,
+  grid,
+  day,
+  empty,
+  off,
+  able,
+  selected
 };
-exports.container = container;
+exports.able = able;
+exports.arrow = arrow;
+exports.day = day;
 exports.default = styles;
+exports.dows = dows;
+exports.empty = empty;
+exports.grid = grid;
+exports.head = head;
+exports.icon = icon;
+exports.isOpen = isOpen;
+exports.nav = nav;
+exports.off = off;
+exports.pop = pop;
 exports.root = root;
+exports.selected = selected;
+exports.title = title;
+exports.trigger = trigger;
 //# sourceMappingURL=index73.cjs.map