@godxjp/ui 5.0.2 → 6.0.1

package/dist/chunk-2XW7J3EI.js

@@ -0,0 +1,226 @@
+import { normalizeTreeOptions, collectAllExpandableKeys, filterVisibleTree, flattenVisibleTree, findNodeByValue, reactNodeText, getDescendantValues } from './chunk-SMLKNECP.js';
+import { Checkbox } from './chunk-E76QIYSY.js';
+import { Command, CommandInput } from './chunk-V6UWJKZF.js';
+import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
+import { ScrollArea } from './chunk-3KPEZ5CF.js';
+import { Button } from './chunk-HJEBRCXL.js';
+import { useTranslation } from './chunk-3F2AKYRD.js';
+import { cn } from './chunk-U7N2A7A3.js';
+import * as React from 'react';
+import { X, ChevronsUpDown, ChevronDown, ChevronRight } from 'lucide-react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/components/data-entry/tree-select-strategy.ts
+var SHOW_CHILD = "SHOW_CHILD";
+var SHOW_PARENT = "SHOW_PARENT";
+var SHOW_ALL = "SHOW_ALL";
+function toArray(value) {
+  if (value == null) return [];
+  return Array.isArray(value) ? value : [value];
+}
+function displayValues(values, options, showCheckedStrategy, treeCheckStrictly) {
+  if (treeCheckStrictly || showCheckedStrategy === SHOW_ALL) return values;
+  if (showCheckedStrategy === SHOW_PARENT) {
+    const filtered = values.filter((v) => {
+      const node = findNodeByValue(options, v);
+      if (!node?.children?.length) return true;
+      const desc = getDescendantValues(node).slice(1);
+      return !desc.every((d) => values.includes(d));
+    });
+    return filtered.length ? filtered : values;
+  }
+  return values.filter((v) => {
+    const node = findNodeByValue(options, v);
+    return !node?.children?.length;
+  });
+}
+function TreeSelectRoot({
+  treeData: treeDataProp,
+  value,
+  defaultValue,
+  onChange,
+  multiple,
+  treeCheckable,
+  treeCheckStrictly,
+  showSearch,
+  showCheckedStrategy = SHOW_CHILD,
+  treeDefaultExpandAll,
+  placeholder,
+  disabled,
+  allowClear = true,
+  className,
+  id,
+  fieldNames
+}) {
+  const { t } = useTranslation();
+  const options = React.useMemo(
+    () => normalizeTreeOptions(treeDataProp, fieldNames),
+    [treeDataProp, fieldNames]
+  );
+  const checkable = treeCheckable ?? multiple;
+  const [open, setOpen] = React.useState(false);
+  const [search, setSearch] = React.useState("");
+  const [expandedKeys, setExpandedKeys] = React.useState(
+    () => new Set(treeDefaultExpandAll ? collectAllExpandableKeys(options) : [])
+  );
+  const isControlled = value !== void 0;
+  const [internal, setInternal] = React.useState(() => toArray(defaultValue));
+  const selected = isControlled ? toArray(value) : internal;
+  const resolvedPlaceholder = placeholder ?? t("dataEntry.treeSelect.placeholder");
+  const visible = React.useMemo(() => {
+    if (showSearch && search.trim()) return filterVisibleTree(options, search);
+    return flattenVisibleTree(options, expandedKeys);
+  }, [options, expandedKeys, search, showSearch]);
+  const commit = (next) => {
+    if (!isControlled) setInternal(next);
+    onChange?.(checkable || multiple ? next : next[0] ?? void 0);
+  };
+  const toggleExpand = (key) => {
+    setExpandedKeys((prev) => {
+      const next = new Set(prev);
+      if (next.has(key)) next.delete(key);
+      else next.add(key);
+      return next;
+    });
+  };
+  const toggleSelect = (node) => {
+    if (node.disabled) return;
+    const key = node.value;
+    if (!checkable && !multiple) {
+      commit([key]);
+      setOpen(false);
+      return;
+    }
+    const isOn = selected.includes(key);
+    let next;
+    if (treeCheckStrictly) {
+      next = isOn ? selected.filter((v) => v !== key) : [...selected, key];
+    } else {
+      const related = getDescendantValues(node);
+      next = isOn ? selected.filter((v) => !related.includes(v)) : [.../* @__PURE__ */ new Set([...selected, ...related])];
+    }
+    commit(next);
+  };
+  const displayKeys = displayValues(selected, options, showCheckedStrategy, treeCheckStrictly);
+  const displayLabel = displayKeys.map((v) => {
+    const label = findNodeByValue(options, v)?.label;
+    return label ? reactNodeText(label) : v;
+  }).join(", ");
+  const clearValue = (e) => {
+    e.stopPropagation();
+    commit([]);
+  };
+  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+      Button,
+      {
+        id,
+        type: "button",
+        variant: "outline",
+        role: "combobox",
+        "aria-expanded": open,
+        disabled,
+        className: cn(
+          "w-full justify-between font-normal",
+          !displayKeys.length && "text-muted-foreground",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "truncate", children: displayKeys.length ? displayLabel : resolvedPlaceholder }),
+          /* @__PURE__ */ jsxs("span", { className: "ml-2 flex shrink-0 items-center gap-1", children: [
+            allowClear && displayKeys.length > 0 && !disabled && /* @__PURE__ */ jsx(
+              X,
+              {
+                className: "size-4 opacity-50 hover:opacity-100",
+                "aria-hidden": "true",
+                onClick: clearValue
+              }
+            ),
+            /* @__PURE__ */ jsx(ChevronsUpDown, { className: "size-4 opacity-50", "aria-hidden": "true" })
+          ] })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsxs(PopoverContent, { className: "w-[var(--radix-popover-trigger-width)] p-0", align: "start", children: [
+      showSearch && /* @__PURE__ */ jsx("div", { className: "border-b p-2", children: /* @__PURE__ */ jsx(Command, { shouldFilter: false, children: /* @__PURE__ */ jsx(
+        CommandInput,
+        {
+          placeholder: t("dataEntry.treeSelect.searchPlaceholder"),
+          value: search,
+          onValueChange: setSearch
+        }
+      ) }) }),
+      /* @__PURE__ */ jsx(ScrollArea, { className: "max-h-[min(300px,50vh)]", children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          role: "tree",
+          "aria-multiselectable": Boolean(checkable) || Boolean(multiple),
+          className: "p-1",
+          children: visible.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-muted-foreground py-6 text-center text-sm", children: t("dataEntry.treeSelect.empty") }) : visible.map(({ node, depth, hasChildren }) => {
+            const expanded = expandedKeys.has(node.value);
+            const isSelected = selected.includes(node.value);
+            return /* @__PURE__ */ jsxs(
+              "div",
+              {
+                role: "treeitem",
+                "aria-expanded": hasChildren ? expanded : void 0,
+                "aria-selected": isSelected,
+                className: cn(
+                  "flex items-center rounded-sm py-1.5 pr-2 text-sm outline-none",
+                  "hover:bg-accent hover:text-accent-foreground",
+                  isSelected && "bg-accent/60",
+                  node.disabled && "pointer-events-none opacity-50"
+                ),
+                style: { paddingLeft: `${depth * 1.25 + 0.5}rem` },
+                children: [
+                  /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      type: "button",
+                      tabIndex: -1,
+                      "aria-label": expanded ? t("dataEntry.treeSelect.collapse") : t("dataEntry.treeSelect.expand"),
+                      className: cn(
+                        "mr-1 flex size-5 shrink-0 items-center justify-center rounded-sm",
+                        !hasChildren && "invisible"
+                      ),
+                      onClick: () => toggleExpand(node.value),
+                      children: expanded ? /* @__PURE__ */ jsx(ChevronDown, { className: "size-4", "aria-hidden": "true" }) : /* @__PURE__ */ jsx(ChevronRight, { className: "size-4", "aria-hidden": "true" })
+                    }
+                  ),
+                  checkable ? /* @__PURE__ */ jsxs("label", { className: "flex flex-1 cursor-pointer items-center gap-2", children: [
+                    /* @__PURE__ */ jsx(
+                      Checkbox,
+                      {
+                        checked: isSelected,
+                        disabled: Boolean(node.disabled) || Boolean(node.disableCheckbox),
+                        onCheckedChange: () => toggleSelect(node)
+                      }
+                    ),
+                    /* @__PURE__ */ jsx("span", { className: "truncate", children: node.label })
+                  ] }) : /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      type: "button",
+                      className: "flex-1 truncate text-left",
+                      disabled: node.disabled,
+                      onClick: () => toggleSelect(node),
+                      children: node.label
+                    }
+                  )
+                ]
+              },
+              node.value
+            );
+          })
+        }
+      ) })
+    ] })
+  ] });
+}
+var TreeSelect = Object.assign(TreeSelectRoot, {
+  SHOW_CHILD,
+  SHOW_PARENT,
+  SHOW_ALL
+});
+
+export { SHOW_ALL, SHOW_CHILD, SHOW_PARENT, TreeSelect };

package/dist/chunk-3F2AKYRD.js

@@ -0,0 +1,416 @@
+import { APP_TIME_FORMATS, isAppDateFormat, isAppTimeFormat, isAppLocale, translate, syncI18nLocale, syncDatetimeContext, getDateFnsLocale, getDayPickerLocale, APP_REQUEST_HEADER_DATE_FORMAT, APP_REQUEST_HEADER_TIME_FORMAT, resolveDefaultDateFormat } from './chunk-YFCQKO3B.js';
+import * as React from 'react';
+import { useMemo } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+// src/app/types.ts
+var APP_LOCALES = ["vi", "en", "ja"];
+var APP_REQUEST_HEADER_LOCALE = "x-locale";
+var APP_REQUEST_HEADER_TIMEZONE = "x-timezone";
+
+// src/app/request-headers.ts
+var DEFAULT_HEADERS = {
+  [APP_REQUEST_HEADER_LOCALE]: "vi",
+  [APP_REQUEST_HEADER_TIMEZONE]: "Asia/Ho_Chi_Minh",
+  [APP_REQUEST_HEADER_TIME_FORMAT]: "24h",
+  [APP_REQUEST_HEADER_DATE_FORMAT]: "dmy"
+};
+var currentHeaders = { ...DEFAULT_HEADERS };
+function syncAppRequestHeaders(headers) {
+  currentHeaders = { ...currentHeaders, ...headers };
+}
+function getAppRequestHeaders() {
+  return { ...currentHeaders };
+}
+function resetAppRequestHeaders() {
+  currentHeaders = { ...DEFAULT_HEADERS };
+}
+
+// src/app/storage.ts
+var DEFAULT_STORAGE_KEY = "godxjp.app";
+function readStoredPreferences(storageKey) {
+  if (typeof window === "undefined") return {};
+  try {
+    const raw = window.localStorage.getItem(storageKey);
+    if (!raw) return {};
+    const parsed = JSON.parse(raw);
+    return {
+      locale: isAppLocale(parsed.locale) ? parsed.locale : void 0,
+      timezone: typeof parsed.timezone === "string" ? parsed.timezone : void 0,
+      timeFormat: isAppTimeFormat(parsed.timeFormat) ? parsed.timeFormat : void 0,
+      dateFormat: isAppDateFormat(parsed.dateFormat) ? parsed.dateFormat : void 0
+    };
+  } catch {
+    return {};
+  }
+}
+function writeStoredPreferences(storageKey, preferences) {
+  if (typeof window === "undefined") return;
+  try {
+    window.localStorage.setItem(storageKey, JSON.stringify(preferences));
+  } catch {
+  }
+}
+
+// src/app/time-format-labels.ts
+var APP_TIME_FORMAT_OPTIONS = APP_TIME_FORMATS.map((value) => ({ value }));
+function getTimeFormatLabel(timeFormat, locale, fallbackLocale = "en") {
+  return translate(locale, fallbackLocale, `timeFormat.${timeFormat}`);
+}
+function resolveDefaultTimeFormat(locale) {
+  return locale === "en" ? "12h" : "24h";
+}
+
+// src/app/timezones.ts
+var APP_TIMEZONE_PRESET = [
+  "UTC",
+  "Asia/Ho_Chi_Minh",
+  "Asia/Bangkok",
+  "Asia/Singapore",
+  "Asia/Jakarta",
+  "Asia/Manila",
+  "Asia/Kuala_Lumpur",
+  "Asia/Yangon",
+  "Asia/Phnom_Penh",
+  "Asia/Vientiane",
+  "Asia/Brunei",
+  "Asia/Tokyo",
+  "Asia/Seoul",
+  "Asia/Shanghai",
+  "Asia/Hong_Kong",
+  "Asia/Taipei",
+  "Asia/Ulaanbaatar",
+  "Asia/Kolkata",
+  "Asia/Karachi",
+  "Asia/Dhaka",
+  "Asia/Colombo",
+  "Asia/Dubai",
+  "Asia/Riyadh",
+  "Asia/Qatar",
+  "Asia/Tehran",
+  "Asia/Jerusalem",
+  "Europe/London",
+  "Europe/Paris",
+  "Europe/Berlin",
+  "Europe/Amsterdam",
+  "Europe/Rome",
+  "Europe/Madrid",
+  "Europe/Moscow",
+  "Europe/Istanbul",
+  "America/New_York",
+  "America/Chicago",
+  "America/Denver",
+  "America/Los_Angeles",
+  "America/Toronto",
+  "America/Vancouver",
+  "America/Mexico_City",
+  "America/Sao_Paulo",
+  "America/Buenos_Aires",
+  "Australia/Sydney",
+  "Australia/Melbourne",
+  "Australia/Perth",
+  "Pacific/Auckland"
+];
+var APP_TIMEZONE_OPTIONS = APP_TIMEZONE_PRESET;
+var TIMEZONE_ALIASES = {
+  "Asia/Ho_Chi_Minh": "Asia/Saigon"
+};
+var PREFERRED_TIMEZONE_IDS = Object.keys(TIMEZONE_ALIASES);
+function resolveTimezoneForIntl(timezone) {
+  return TIMEZONE_ALIASES[timezone] ?? timezone;
+}
+var FALLBACK_IANA_TIMEZONES = [...APP_TIMEZONE_PRESET];
+var cachedAllTimezones = null;
+var cachedTimezoneSet = null;
+function enrichTimezoneList(base) {
+  const set = new Set(base);
+  for (const preferred of PREFERRED_TIMEZONE_IDS) {
+    if (!set.has(preferred)) {
+      const canonical = TIMEZONE_ALIASES[preferred];
+      if (!canonical || set.has(canonical)) set.add(preferred);
+    }
+  }
+  return [...set].sort();
+}
+function getAllIanaTimezones() {
+  if (cachedAllTimezones) return cachedAllTimezones;
+  try {
+    const intl = Intl;
+    if (typeof intl.supportedValuesOf === "function") {
+      cachedAllTimezones = enrichTimezoneList(intl.supportedValuesOf("timeZone").slice().sort());
+      return cachedAllTimezones;
+    }
+  } catch {
+  }
+  cachedAllTimezones = FALLBACK_IANA_TIMEZONES;
+  return cachedAllTimezones;
+}
+function getIanaTimezoneSet() {
+  cachedTimezoneSet ??= new Set(getAllIanaTimezones());
+  return cachedTimezoneSet;
+}
+function isValidIanaTimezone(value) {
+  const set = getIanaTimezoneSet();
+  if (set.has(value)) return true;
+  const canonical = TIMEZONE_ALIASES[value];
+  return canonical ? set.has(canonical) : false;
+}
+function isKnownAppTimezone(value) {
+  return APP_TIMEZONE_PRESET.includes(value);
+}
+function resolveTimezonePickerOptions(configured, current) {
+  const base = configured && configured.length > 0 ? [...configured] : [...getAllIanaTimezones()];
+  if (current && !base.includes(current)) {
+    return [current, ...base];
+  }
+  return base;
+}
+function getBrowserTimezone() {
+  try {
+    return Intl.DateTimeFormat().resolvedOptions().timeZone;
+  } catch {
+    return "UTC";
+  }
+}
+function getTimezoneCityName(timezone) {
+  const segment = timezone.split("/").pop();
+  if (!segment) return timezone;
+  return segment.replace(/_/g, " ");
+}
+function getTimezoneOffsetLabel(timezone, locale = "en") {
+  if (timezone === "UTC") return "UTC";
+  try {
+    const parts = new Intl.DateTimeFormat(locale, {
+      timeZone: resolveTimezoneForIntl(timezone),
+      timeZoneName: "shortOffset"
+    }).formatToParts(/* @__PURE__ */ new Date());
+    return parts.find((part) => part.type === "timeZoneName")?.value ?? "";
+  } catch {
+    return "";
+  }
+}
+function formatTimezoneDisplayLabel(timezone, locale = "en") {
+  const city = getTimezoneCityName(timezone);
+  const offset = getTimezoneOffsetLabel(timezone, locale);
+  return offset ? `${city} (${offset})` : city;
+}
+function getTimezoneLabel(timezone, locale, fallbackLocale = "en") {
+  const key = `timezone.${timezone}`;
+  const translated = translate(locale, fallbackLocale, key);
+  if (translated !== key) return translated;
+  const offset = getTimezoneOffsetLabel(timezone, locale);
+  const city = getTimezoneCityName(timezone);
+  return offset ? `${city} (${offset})` : city;
+}
+function resolveDefaultTimezone(defaultTimezone, systemTimezone) {
+  if (defaultTimezone === "browser") return getBrowserTimezone();
+  if (defaultTimezone === "system") return systemTimezone ?? "UTC";
+  return defaultTimezone;
+}
+function resetIanaTimezoneCacheForTests() {
+  cachedAllTimezones = null;
+  cachedTimezoneSet = null;
+}
+var AppContext = React.createContext(null);
+function resolveInitialTimeFormat(stored, defaultTimeFormat, locale) {
+  if (stored) return stored;
+  if (defaultTimeFormat === "locale") return resolveDefaultTimeFormat(locale);
+  return defaultTimeFormat;
+}
+function resolveInitialDateFormat(stored, defaultDateFormat, locale) {
+  if (stored) return stored;
+  if (defaultDateFormat === "locale") return resolveDefaultDateFormat(locale);
+  return defaultDateFormat;
+}
+function buildRequestHeaders(locale, timezone, timeFormat, dateFormat) {
+  return {
+    [APP_REQUEST_HEADER_LOCALE]: locale,
+    [APP_REQUEST_HEADER_TIMEZONE]: timezone,
+    [APP_REQUEST_HEADER_TIME_FORMAT]: timeFormat,
+    [APP_REQUEST_HEADER_DATE_FORMAT]: dateFormat
+  };
+}
+function AppProvider({
+  children,
+  defaultLocale = "vi",
+  fallbackLocale = "en",
+  defaultTimezone = "browser",
+  systemTimezone,
+  defaultTimeFormat = "locale",
+  defaultDateFormat = "locale",
+  timezoneOptions,
+  storageKey = DEFAULT_STORAGE_KEY,
+  persist = true,
+  onLocaleChange,
+  onTimezoneChange,
+  onTimeFormatChange,
+  onDateFormatChange
+}) {
+  const stored = React.useMemo(
+    () => persist ? readStoredPreferences(storageKey) : {},
+    [persist, storageKey]
+  );
+  const initialLocale = stored.locale ?? defaultLocale;
+  const [locale, setLocaleState] = React.useState(initialLocale);
+  const [timezone, setTimezoneState] = React.useState(
+    stored.timezone ?? resolveDefaultTimezone(defaultTimezone, systemTimezone)
+  );
+  const [timeFormat, setTimeFormatState] = React.useState(
+    () => resolveInitialTimeFormat(stored.timeFormat, defaultTimeFormat, initialLocale)
+  );
+  const [dateFormat, setDateFormatState] = React.useState(
+    () => resolveInitialDateFormat(stored.dateFormat, defaultDateFormat, initialLocale)
+  );
+  const prefsRef = React.useRef({ locale, timezone, timeFormat, dateFormat });
+  React.useEffect(() => {
+    prefsRef.current = { locale, timezone, timeFormat, dateFormat };
+  }, [locale, timezone, timeFormat, dateFormat]);
+  const setLocale = React.useCallback(
+    (next) => {
+      prefsRef.current = { ...prefsRef.current, locale: next };
+      setLocaleState(next);
+      onLocaleChange?.(next);
+      if (persist) writeStoredPreferences(storageKey, prefsRef.current);
+    },
+    [onLocaleChange, persist, storageKey]
+  );
+  const setTimezone = React.useCallback(
+    (next) => {
+      prefsRef.current = { ...prefsRef.current, timezone: next };
+      setTimezoneState(next);
+      onTimezoneChange?.(next);
+      if (persist) writeStoredPreferences(storageKey, prefsRef.current);
+    },
+    [onTimezoneChange, persist, storageKey]
+  );
+  const setTimeFormat = React.useCallback(
+    (next) => {
+      prefsRef.current = { ...prefsRef.current, timeFormat: next };
+      setTimeFormatState(next);
+      onTimeFormatChange?.(next);
+      if (persist) writeStoredPreferences(storageKey, prefsRef.current);
+    },
+    [onTimeFormatChange, persist, storageKey]
+  );
+  const setDateFormat = React.useCallback(
+    (next) => {
+      prefsRef.current = { ...prefsRef.current, dateFormat: next };
+      setDateFormatState(next);
+      onDateFormatChange?.(next);
+      if (persist) writeStoredPreferences(storageKey, prefsRef.current);
+    },
+    [onDateFormatChange, persist, storageKey]
+  );
+  const requestHeaders = React.useMemo(
+    () => buildRequestHeaders(locale, timezone, timeFormat, dateFormat),
+    [locale, timezone, timeFormat, dateFormat]
+  );
+  React.useEffect(() => {
+    syncAppRequestHeaders(requestHeaders);
+    syncI18nLocale(locale, fallbackLocale);
+    syncDatetimeContext({
+      locale,
+      timezone,
+      timeFormat,
+      dateFormat,
+      dateFnsLocale: getDateFnsLocale(locale)
+    });
+  }, [requestHeaders, locale, fallbackLocale, timezone, timeFormat, dateFormat]);
+  const value = React.useMemo(
+    () => ({
+      locale,
+      fallbackLocale,
+      timezone,
+      timeFormat,
+      dateFormat,
+      dateFnsLocale: getDateFnsLocale(locale),
+      dayPickerLocale: getDayPickerLocale(locale),
+      requestHeaders,
+      timezoneOptions,
+      setLocale,
+      setTimezone,
+      setTimeFormat,
+      setDateFormat
+    }),
+    [
+      locale,
+      fallbackLocale,
+      timezone,
+      timeFormat,
+      dateFormat,
+      requestHeaders,
+      timezoneOptions,
+      setLocale,
+      setTimezone,
+      setTimeFormat,
+      setDateFormat
+    ]
+  );
+  return /* @__PURE__ */ jsx(AppContext.Provider, { value, children });
+}
+function useAppContext() {
+  const ctx = React.useContext(AppContext);
+  if (!ctx) {
+    throw new Error("useAppContext must be used within <AppProvider>");
+  }
+  return ctx;
+}
+function useOptionalAppContext() {
+  return React.useContext(AppContext);
+}
+function useAppLocale() {
+  const { locale, fallbackLocale, setLocale, dateFnsLocale, dayPickerLocale } = useAppContext();
+  return { locale, fallbackLocale, setLocale, dateFnsLocale, dayPickerLocale };
+}
+function useAppTimezone() {
+  const { timezone, setTimezone } = useAppContext();
+  return { timezone, setTimezone };
+}
+function useAppTimeFormat() {
+  const { timeFormat, setTimeFormat } = useAppContext();
+  return { timeFormat, setTimeFormat };
+}
+function useAppDateFormat() {
+  const { dateFormat, setDateFormat } = useAppContext();
+  return { dateFormat, setDateFormat };
+}
+var DEFAULT_LOCALE = "vi";
+var DEFAULT_FALLBACK = "en";
+function useTranslation() {
+  const ctx = useOptionalAppContext();
+  const locale = ctx?.locale ?? DEFAULT_LOCALE;
+  const fallbackLocale = ctx?.fallbackLocale ?? DEFAULT_FALLBACK;
+  return useMemo(
+    () => ({
+      locale,
+      fallbackLocale,
+      t: (key, params) => translate(locale, fallbackLocale, key, params)
+    }),
+    [locale, fallbackLocale]
+  );
+}
+function usePickerLocales(dayPickerOverride) {
+  const ctx = useOptionalAppContext();
+  const locale = ctx?.locale ?? DEFAULT_LOCALE;
+  return useMemo(
+    () => ({
+      locale,
+      timezone: ctx?.timezone ?? "Asia/Ho_Chi_Minh",
+      timeFormat: ctx?.timeFormat ?? "24h",
+      dateFormat: ctx?.dateFormat ?? "dmy",
+      dateFnsLocale: ctx?.dateFnsLocale ?? getDateFnsLocale(locale),
+      dayPickerLocale: dayPickerOverride ?? ctx?.dayPickerLocale ?? getDayPickerLocale(locale)
+    }),
+    [
+      ctx?.dateFnsLocale,
+      ctx?.dayPickerLocale,
+      ctx?.timeFormat,
+      ctx?.dateFormat,
+      ctx?.timezone,
+      dayPickerOverride,
+      locale
+    ]
+  );
+}
+
+export { APP_LOCALES, APP_REQUEST_HEADER_LOCALE, APP_REQUEST_HEADER_TIMEZONE, APP_TIMEZONE_OPTIONS, APP_TIMEZONE_PRESET, APP_TIME_FORMAT_OPTIONS, AppProvider, DEFAULT_STORAGE_KEY, TIMEZONE_ALIASES, formatTimezoneDisplayLabel, getAllIanaTimezones, getAppRequestHeaders, getBrowserTimezone, getTimeFormatLabel, getTimezoneCityName, getTimezoneLabel, getTimezoneOffsetLabel, isKnownAppTimezone, isValidIanaTimezone, readStoredPreferences, resetAppRequestHeaders, resetIanaTimezoneCacheForTests, resolveDefaultTimeFormat, resolveDefaultTimezone, resolveTimezoneForIntl, resolveTimezonePickerOptions, syncAppRequestHeaders, useAppContext, useAppDateFormat, useAppLocale, useAppTimeFormat, useAppTimezone, useOptionalAppContext, usePickerLocales, useTranslation, writeStoredPreferences };

package/dist/chunk-3KPEZ5CF.js

@@ -0,0 +1,37 @@
+import { cn } from './chunk-U7N2A7A3.js';
+import * as React from 'react';
+import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var ScrollArea = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+  ScrollAreaPrimitive.Root,
+  {
+    ref,
+    className: cn("relative overflow-hidden", className),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx(ScrollAreaPrimitive.Viewport, { className: "size-full rounded-[inherit]", children }),
+      /* @__PURE__ */ jsx(ScrollBar, {}),
+      /* @__PURE__ */ jsx(ScrollAreaPrimitive.Corner, {})
+    ]
+  }
+));
+ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
+var ScrollBar = React.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsx(
+  ScrollAreaPrimitive.ScrollAreaScrollbar,
+  {
+    ref,
+    orientation,
+    className: cn(
+      "flex touch-none transition-colors select-none",
+      orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent p-px",
+      orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent p-px",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsx(ScrollAreaPrimitive.ScrollAreaThumb, { className: "bg-border relative flex-1 rounded-full" })
+  }
+));
+ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
+
+export { ScrollArea, ScrollBar };