@godxjp/ui 12.1.0 → 13.1.0

package/dist/app/index.d.ts

@@ -5,12 +5,12 @@ import * as date_fns from 'date-fns';
 import { Locale } from 'date-fns';
 import { vi } from 'react-day-picker/locale';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as AppProviderProp, A as AppContextValue } from '../app.prop-Cy6dJnU8.js';
+import { a as AppProviderProp, A as AppContextValue } from '../app.prop-CVY8V4ss.js';
 import { j as formatDate, a as FormatDateOptions } from '../format-date-ByyZoqI5.js';
 export { F as FormatDateKind, b as FormatDatetimeOptions, d as detectFormatDateKind, f as formatAppDate, c as formatAppDateLong, e as formatAppDateTime, g as formatAppRelative, h as formatAppTime, i as formatCalendarDate, k as formatTimeOfDay, m as isFormatDateValue } from '../format-date-ByyZoqI5.js';
 export { getDatetimeContext, isValidHhmm, normalizeHhmm, parseDateInput, syncDatetimeContext } from '../lib/datetime/index.js';
 export { usePickerLocales, useTranslation } from '../i18n/index.js';
-import '../shared.prop-BsNSXeqD.js';
+import '../shared.prop-BvMSLFJ6.js';
 import 'react';
 import '@date-fns/tz';
 

package/dist/app/index.js

@@ -1,7 +1,7 @@
-import { useAppContext } from '../chunk-TXRYSMOD.js';
-export { APP_LOCALES, APP_REQUEST_HEADER_LOCALE, APP_REQUEST_HEADER_TIMEZONE, APP_TIMEZONE_PRESET, APP_TIME_FORMAT_OPTIONS, AppProvider, DEFAULT_STORAGE_KEY, TIMEZONE_ALIASES, formatTimezoneDisplayLabel, getAllIanaTimezones, getAppRequestHeaders, getBrowserTimezone, getTimeFormatLabel, getTimezoneCityName, getTimezoneLabel, getTimezoneOffsetLabel, isValidIanaTimezone, readStoredPreferences, resetAppRequestHeaders, resetIanaTimezoneCacheForTests, resolveDefaultTimeFormat, resolveDefaultTimezone, resolveTimezoneForIntl, resolveTimezonePickerOptions, syncAppRequestHeaders, useAppContext, useAppDateFormat, useAppLocale, useAppTimeFormat, useAppTimezone, useOptionalAppContext, usePickerLocales, useTranslation, writeStoredPreferences } from '../chunk-TXRYSMOD.js';
-import { formatDate } from '../chunk-3ELRYXJK.js';
-export { APP_DATE_FORMATS, APP_DATE_FORMAT_OPTIONS, APP_LOCALE_CONFIG, APP_REQUEST_HEADER_DATE_FORMAT, APP_REQUEST_HEADER_TIME_FORMAT, APP_TIME_FORMATS, detectFormatDateKind, formatAppDate, formatAppDateLong, formatAppDateTime, formatAppRelative, formatAppTime, formatCalendarDate, formatDate, formatTimeOfDay, getDateFnsLocale, getDateFormatLabel, getDatePattern, getDateTimePattern, getDatetimeContext, getDayPickerLocale, getTimePattern, isAppDateFormat, isAppLocale, isAppTimeFormat, isFormatDateValue, isValidHhmm, normalizeHhmm, parseDateInput, resolveDefaultDateFormat, syncDatetimeContext } from '../chunk-3ELRYXJK.js';
+import { useAppContext } from '../chunk-H2TX3OPW.js';
+export { APP_LOCALES, APP_REQUEST_HEADER_LOCALE, APP_REQUEST_HEADER_TIMEZONE, APP_TIMEZONE_PRESET, APP_TIME_FORMAT_OPTIONS, AppProvider, DEFAULT_STORAGE_KEY, TIMEZONE_ALIASES, formatTimezoneDisplayLabel, getAllIanaTimezones, getAppRequestHeaders, getBrowserTimezone, getTimeFormatLabel, getTimezoneCityName, getTimezoneLabel, getTimezoneOffsetLabel, isValidIanaTimezone, readStoredPreferences, resetAppRequestHeaders, resetIanaTimezoneCacheForTests, resolveDefaultTimeFormat, resolveDefaultTimezone, resolveTimezoneForIntl, resolveTimezonePickerOptions, syncAppRequestHeaders, useAppContext, useAppDateFormat, useAppLocale, useAppTimeFormat, useAppTimezone, useOptionalAppContext, usePickerLocales, useTranslation, writeStoredPreferences } from '../chunk-H2TX3OPW.js';
+import { formatDate } from '../chunk-JEIUEOTJ.js';
+export { APP_DATE_FORMATS, APP_DATE_FORMAT_OPTIONS, APP_LOCALE_CONFIG, APP_REQUEST_HEADER_DATE_FORMAT, APP_REQUEST_HEADER_TIME_FORMAT, APP_TIME_FORMATS, detectFormatDateKind, formatAppDate, formatAppDateLong, formatAppDateTime, formatAppRelative, formatAppTime, formatCalendarDate, formatDate, formatTimeOfDay, getDateFnsLocale, getDateFormatLabel, getDatePattern, getDateTimePattern, getDatetimeContext, getDayPickerLocale, getTimePattern, isAppDateFormat, isAppLocale, isAppTimeFormat, isFormatDateValue, isValidHhmm, normalizeHhmm, parseDateInput, resolveDefaultDateFormat, syncDatetimeContext } from '../chunk-JEIUEOTJ.js';
 import { useMemo } from 'react';
 
 function useFormatting() {

package/dist/{app.prop-Cy6dJnU8.d.ts → app.prop-CVY8V4ss.d.ts}

@@ -1,7 +1,7 @@
 import { Locale } from 'date-fns';
 import { DayPickerProps } from 'react-day-picker';
 import { h as AppLocale, l as AppTimezoneDefault, k as AppTimezone, j as AppTimeFormat, g as AppDateFormat, i as AppRequestHeaders } from './types-mvzYGrma.js';
-import { C as ChildrenProp, a as ClassNameProp, c as DisabledProp, I as IdProp, N as NameProp, V as ValueProp, g as OnValueChangeProp } from './shared.prop-BsNSXeqD.js';
+import { C as ChildrenProp, a as ClassNameProp, c as DisabledProp, I as IdProp, N as NameProp, V as ValueProp, g as OnValueChangeProp } from './shared.prop-BvMSLFJ6.js';
 
 /** App shell prop types — @see docs/COMPONENTS.md#app */
 

package/dist/{checkbox-DPFcnsMZ.d.ts → checkbox-shzpQ_Xo.d.ts}

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { b as CheckboxGroupProp } from './data-entry.prop-6J0o45se.js';
+import { b as CheckboxGroupProp } from './data-entry.prop-DL7kUcJh.js';
 
 declare function CheckboxGroup({ value: controlledValue, defaultValue, onValueChange, options, orientation, disabled, name, className, children, }: CheckboxGroupProp): react_jsx_runtime.JSX.Element;
 

package/dist/{chunk-COD66MFF.js → chunk-2BR7KFCP.js}

@@ -1,4 +1,4 @@
-import { tableCellPaddingClass, tableRowHeightClass } from './chunk-IBK5D2Q6.js';
+import { tableCellPaddingClass, tableRowHeightClass } from './chunk-B4K4BXEF.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 

package/dist/chunk-2H65B4JA.js

@@ -0,0 +1 @@
+

package/dist/{chunk-JSQOCVM6.js → chunk-2M57K2VW.js}

@@ -1,9 +1,9 @@
-import { SearchInput } from './chunk-BCBK4FLV.js';
 import { reactNodeText } from './chunk-SMLKNECP.js';
+import { SearchInput } from './chunk-ZFBIKJSJ.js';
 import { Checkbox } from './chunk-BE6GJGKJ.js';
 import { Button } from './chunk-M4PZNAMV.js';
 import { ScrollArea } from './chunk-3KPEZ5CF.js';
-import { useTranslation } from './chunk-TXRYSMOD.js';
+import { useTranslation } from './chunk-H2TX3OPW.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import * as React from 'react';
 import { ChevronRight, ChevronLeft } from 'lucide-react';

package/dist/{chunk-HTEL5DQI.js → chunk-3R3QVJCB.js}

@@ -1,4 +1,4 @@
-import { controlIconLeadingClass } from './chunk-IBK5D2Q6.js';
+import { controlIconLeadingClass } from './chunk-B4K4BXEF.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import * as React from 'react';
 import { Command as Command$1 } from 'cmdk';

package/dist/{chunk-FK2JDABO.js → chunk-55S5N667.js}

@@ -1,9 +1,10 @@
 import { normalizeTreeOptions, formatPathLabels, getNodeByPath, filterTreeOptions, pathsEqual, pathKey } from './chunk-SMLKNECP.js';
-import { Command, CommandInput } from './chunk-HTEL5DQI.js';
+import { Command, CommandInput } from './chunk-3R3QVJCB.js';
 import { Button } from './chunk-M4PZNAMV.js';
 import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
 import { ScrollArea, ScrollBar } from './chunk-3KPEZ5CF.js';
-import { useTranslation } from './chunk-TXRYSMOD.js';
+import { controlOpenRingClass } from './chunk-B4K4BXEF.js';
+import { useTranslation } from './chunk-H2TX3OPW.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import * as React from 'react';
 import { Check, X, ChevronsUpDown, ChevronRight, Minus } from 'lucide-react';
@@ -234,6 +235,7 @@ function Cascader({
           disabled,
           className: cn(
             "w-full justify-start font-normal",
+            controlOpenRingClass,
             // Reserve trailing room for the clear + chevron overlay rendered below.
             showClear ? "pe-14" : "pe-9",
             !displayLabel && "text-muted-foreground"

package/dist/{chunk-YGD4CCQC.js → chunk-5KK3KJ6L.js}

@@ -1,8 +1,8 @@
-import { Input } from './chunk-VOHTRR5X.js';
+import { Input } from './chunk-BNXPDUO4.js';
 import { Button } from './chunk-M4PZNAMV.js';
 import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
-import { useTranslation, usePickerLocales } from './chunk-TXRYSMOD.js';
-import { normalizeHhmm, isValidHhmm } from './chunk-3ELRYXJK.js';
+import { useTranslation, usePickerLocales } from './chunk-H2TX3OPW.js';
+import { normalizeHhmm, isValidHhmm } from './chunk-JEIUEOTJ.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import * as React from 'react';
 import { Clock } from 'lucide-react';

package/dist/chunk-76S3TQFH.js

@@ -0,0 +1,109 @@
+import { ResponsiveGrid } from './chunk-C3PKEV6S.js';
+import { Label } from './chunk-7PWBC4BY.js';
+import { cn } from './chunk-U7N2A7A3.js';
+import * as React from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var FormLayoutContext = React.createContext(null);
+function useFormLayout() {
+  return React.useContext(FormLayoutContext);
+}
+var Form = React.forwardRef(function Form2({
+  layout = "vertical",
+  labelWidth,
+  controlWidth,
+  labelAlign = "end",
+  collapseBelow = "md",
+  columns,
+  density,
+  className,
+  children,
+  ...props
+}, ref) {
+  const ctx = React.useMemo(
+    () => ({ layout, labelWidth, controlWidth, labelAlign, collapseBelow }),
+    [layout, labelWidth, controlWidth, labelAlign, collapseBelow]
+  );
+  const content = columns != null ? /* @__PURE__ */ jsx(ResponsiveGrid, { columns, children }) : children;
+  return /* @__PURE__ */ jsx(
+    "form",
+    {
+      ref,
+      "data-slot": "form",
+      "data-layout": layout,
+      className: cn("ui-form", density && `ui-density-${density}`, className),
+      ...props,
+      children: /* @__PURE__ */ jsx(FormLayoutContext.Provider, { value: ctx, children: content })
+    }
+  );
+});
+var toCssLength = (v) => typeof v === "number" ? `${v}px` : v;
+function FormField({
+  id,
+  label,
+  required,
+  helper,
+  error,
+  labelAddon,
+  layout: layoutProp,
+  labelWidth: labelWidthProp,
+  controlWidth: controlWidthProp,
+  colSpan,
+  className,
+  children
+}) {
+  const form = useFormLayout();
+  const layout = layoutProp ?? form?.layout ?? "vertical";
+  const labelWidth = labelWidthProp ?? form?.labelWidth;
+  const controlWidth = controlWidthProp ?? form?.controlWidth;
+  const labelAlign = form?.labelAlign ?? "end";
+  const collapseBelow = form?.collapseBelow ?? "md";
+  const helperId = helper ? `${id}-helper` : void 0;
+  const errorId = error ? `${id}-error` : void 0;
+  if (typeof process !== "undefined" && process.env?.NODE_ENV !== "production" && !React.isValidElement(children)) {
+    console.warn(
+      "FormField expects a single React element child to receive aria-describedby/aria-errormessage; the helper text and error message will not be associated with the control."
+    );
+  }
+  const childWithA11y = React.isValidElement(children) ? React.cloneElement(children, {
+    // Helper and error can coexist: helper stays on aria-describedby, the error on
+    // aria-errormessage (surfaced when aria-invalid is true).
+    "aria-describedby": helperId,
+    "aria-errormessage": errorId,
+    "aria-required": required ? true : void 0,
+    "aria-invalid": !!error || void 0
+  }) : children;
+  const style = {};
+  if (labelWidth != null)
+    style["--form-label-width"] = toCssLength(labelWidth);
+  if (controlWidth != null)
+    style["--form-control-width"] = toCssLength(controlWidth);
+  if (colSpan != null) style.gridColumn = `span ${colSpan}`;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "form-field",
+      "data-layout": layout,
+      "data-collapse-below": String(collapseBelow),
+      "data-label-align": labelAlign,
+      style: Object.keys(style).length ? style : void 0,
+      className: cn("ui-form-field", className),
+      children: [
+        /* @__PURE__ */ jsxs("div", { "data-slot": "form-field-label", className: "ui-form-field-label", children: [
+          /* @__PURE__ */ jsxs(Label, { htmlFor: id, className: "ui-inline-xs", children: [
+            /* @__PURE__ */ jsx("span", { children: label }),
+            required && /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "text-destructive", children: "*" })
+          ] }),
+          labelAddon
+        ] }),
+        /* @__PURE__ */ jsxs("div", { "data-slot": "form-field-control", className: "ui-form-field-control", children: [
+          childWithA11y,
+          helper ? /* @__PURE__ */ jsx("p", { id: helperId, className: "text-muted-foreground text-xs", children: helper }) : null,
+          error ? /* @__PURE__ */ jsx("p", { id: errorId, role: "alert", className: "text-destructive text-xs", children: error }) : null
+        ] })
+      ]
+    }
+  );
+}
+
+export { Form, FormField, useFormLayout };

package/dist/{chunk-6WSWK7TU.js → chunk-7HEFQDN5.js}

@@ -1,6 +1,6 @@
-import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from './chunk-2TYRT5XH.js';
+import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from './chunk-I2CYVA7B.js';
 import { Button } from './chunk-M4PZNAMV.js';
-import { useTranslation } from './chunk-TXRYSMOD.js';
+import { useTranslation } from './chunk-H2TX3OPW.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import * as React from 'react';
 import { MoreHorizontal, ChevronLeft, ChevronRight } from 'lucide-react';

package/dist/{chunk-LCQFYL44.js → chunk-7MXIPSYM.js}

@@ -1,7 +1,8 @@
-import { Input } from './chunk-VOHTRR5X.js';
+import { Input } from './chunk-BNXPDUO4.js';
+import { overlayHeaderToneClass } from './chunk-VU4GFGDG.js';
 import { buttonVariants, Button } from './chunk-M4PZNAMV.js';
 import { Label } from './chunk-7PWBC4BY.js';
-import { useTranslation } from './chunk-TXRYSMOD.js';
+import { useTranslation } from './chunk-H2TX3OPW.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import * as React from 'react';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
@@ -67,8 +68,35 @@ var DialogContent = React.forwardRef(({ className, children, showClose, showClos
   ] });
 });
 DialogContent.displayName = "DialogContent";
-var DialogHeader = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { "data-slot": "dialog-header", className, ...props });
+var DialogHeader = ({
+  className,
+  title,
+  subtitle,
+  extra,
+  tone = "default",
+  children,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "dialog-header",
+      "data-tone": tone,
+      className: cn(overlayHeaderToneClass[tone], className),
+      ...props,
+      children: children ?? /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-[var(--space-3)] pe-[var(--space-8)]", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col gap-[var(--space-1)]", children: [
+          title != null && /* @__PURE__ */ jsx(DialogTitle, { children: title }),
+          subtitle != null && /* @__PURE__ */ jsx(DialogDescription, { children: subtitle })
+        ] }),
+        extra != null && /* @__PURE__ */ jsx("div", { className: "flex shrink-0 items-center gap-[var(--space-2)] whitespace-nowrap", children: extra })
+      ] })
+    }
+  );
+};
 DialogHeader.displayName = "DialogHeader";
+var DialogBody = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { "data-slot": "dialog-body", className, ...props });
+DialogBody.displayName = "DialogBody";
 var DialogFooter = ({ className, ...props }) => (
   // Layout (right-aligned actions, mobile column-reverse) lives in feedback-layout.css
   // [data-slot="dialog-footer"]. Destructive action goes far-left via `className="mr-auto"`.
@@ -136,7 +164,32 @@ var AlertDialogContent = React.forwardRef(({ className, children, showClose, sho
   );
 });
 AlertDialogContent.displayName = "AlertDialogContent";
-var AlertDialogHeader = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { "data-slot": "dialog-header", className: cn(className), ...props });
+var AlertDialogHeader = ({
+  className,
+  title,
+  subtitle,
+  extra,
+  tone = "default",
+  children,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "dialog-header",
+      "data-tone": tone,
+      className: cn(overlayHeaderToneClass[tone], className),
+      ...props,
+      children: children ?? /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-[var(--space-3)] pe-[var(--space-8)]", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col gap-[var(--space-1)]", children: [
+          title != null && /* @__PURE__ */ jsx(AlertDialogTitle, { children: title }),
+          subtitle != null && /* @__PURE__ */ jsx(AlertDialogDescription, { children: subtitle })
+        ] }),
+        extra != null && /* @__PURE__ */ jsx("div", { className: "flex shrink-0 items-center gap-[var(--space-2)] whitespace-nowrap", children: extra })
+      ] })
+    }
+  );
+};
 AlertDialogHeader.displayName = "AlertDialogHeader";
 var AlertDialogFooter = ({ className, ...props }) => (
   // Layout lives in feedback-layout.css [data-slot="dialog-footer"] (right-aligned actions).
@@ -266,6 +319,7 @@ var Dialog = Object.assign(DialogRoot, {
   Overlay: DialogOverlay,
   Content: DialogContent,
   Header: DialogHeader,
+  Body: DialogBody,
   Footer: DialogFooter,
   Title: DialogTitle,
   Description: DialogDescription,
@@ -274,4 +328,4 @@ var Dialog = Object.assign(DialogRoot, {
   Cancel: DialogCancel
 });
 
-export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, Dialog, DialogAction, DialogCancel, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogRoot, DialogTitle, DialogTrigger };
+export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, Dialog, DialogAction, DialogBody, DialogCancel, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogRoot, DialogTitle, DialogTrigger };

package/dist/{chunk-WBUUCU7R.js → chunk-AKFR72DQ.js}

@@ -1,9 +1,9 @@
-import { Calendar } from './chunk-FTOG7D4T.js';
-import { Input } from './chunk-VOHTRR5X.js';
+import { Calendar } from './chunk-KQ36FDEE.js';
+import { Input } from './chunk-BNXPDUO4.js';
 import { Button } from './chunk-M4PZNAMV.js';
 import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
-import { useTranslation, usePickerLocales } from './chunk-TXRYSMOD.js';
-import { toIsoDate, parseDateInput } from './chunk-3ELRYXJK.js';
+import { useTranslation, usePickerLocales } from './chunk-H2TX3OPW.js';
+import { toIsoDate, parseDateInput } from './chunk-JEIUEOTJ.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import * as React from 'react';
 import { CalendarIcon } from 'lucide-react';

package/dist/{chunk-IBK5D2Q6.js → chunk-B4K4BXEF.js}

@@ -1,6 +1,7 @@
 // src/lib/control-styles.ts
 var controlMultilineClass = "ui-control-multiline w-full rounded-lg border border-input bg-background ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-ring/25 disabled:cursor-not-allowed disabled:opacity-50";
-var controlTriggerClass = "ui-control flex w-full items-center justify-between gap-2 whitespace-nowrap rounded-lg border border-input bg-background shadow-sm focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-ring/25 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1";
+var controlOpenRingClass = "data-[state=open]:border-ring data-[state=open]:ring-ring/50 data-[state=open]:ring-[3px]";
+var controlTriggerClass = "ui-control flex w-full items-center justify-between gap-2 whitespace-nowrap rounded-lg border border-input bg-background shadow-sm transition-[color,box-shadow] focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-ring/25 data-[state=open]:border-ring data-[state=open]:ring-ring/50 data-[state=open]:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1";
 var controlIconClass = "size-[length:var(--control-height)] shrink-0";
 var controlIconSmClass = "size-[calc(var(--control-height)-0.5rem)] shrink-0";
 var controlIconLeadingClass = "size-[length:var(--control-icon-size)] shrink-0";
@@ -14,4 +15,4 @@ var toneDestructiveClass = "border-destructive/30 bg-destructive/10 text-destruc
 var toneMutedClass = "border-border bg-muted text-muted-foreground";
 var toneNeutralClass = "border-border bg-muted text-muted-foreground";
 
-export { controlIconClass, controlIconLeadingClass, controlIconSmClass, controlMultilineClass, controlTriggerClass, tableCellPaddingClass, tableHeadHeightClass, tableRowHeightClass, toneDestructiveClass, toneInfoClass, toneMutedClass, toneNeutralClass, toneSuccessClass, toneWarningClass };
+export { controlIconClass, controlIconLeadingClass, controlIconSmClass, controlMultilineClass, controlOpenRingClass, controlTriggerClass, tableCellPaddingClass, tableHeadHeightClass, tableRowHeightClass, toneDestructiveClass, toneInfoClass, toneMutedClass, toneNeutralClass, toneSuccessClass, toneWarningClass };

package/dist/{chunk-VOHTRR5X.js → chunk-BNXPDUO4.js}

@@ -10,7 +10,7 @@ var Input = React.forwardRef(
       "data-slot": "input",
       ref,
       className: cn(
-        "ui-control border-input bg-background w-full min-w-0 rounded-md border px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none md:text-sm",
+        "ui-control border-input bg-background w-full min-w-0 rounded-md border px-3 py-1 text-sm shadow-xs transition-[color,box-shadow] outline-none",
         "selection:bg-primary selection:text-primary-foreground",
         "file:text-foreground file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium",
         "placeholder:text-muted-foreground",

package/dist/chunk-C3PKEV6S.js

@@ -0,0 +1,22 @@
+import { jsx } from 'react/jsx-runtime';
+
+// src/components/layout/responsive-grid.tsx
+function resolveColumns(columns) {
+  if (typeof columns === "number") {
+    return {
+      "--responsive-grid-sm": Math.min(columns, 2),
+      "--responsive-grid-md": Math.min(columns, 3),
+      "--responsive-grid-lg": columns
+    };
+  }
+  return {
+    "--responsive-grid-sm": columns.sm ?? 1,
+    "--responsive-grid-md": columns.md ?? columns.sm ?? 1,
+    "--responsive-grid-lg": columns.lg ?? columns.md ?? columns.sm ?? 1
+  };
+}
+function ResponsiveGrid({ columns = 4, children }) {
+  return /* @__PURE__ */ jsx("div", { className: "ui-responsive-grid", style: resolveColumns(columns), children });
+}
+
+export { ResponsiveGrid };

package/dist/{chunk-MMFIL33F.js → chunk-C6OEAQTO.js}

@@ -1,4 +1,4 @@
-import { normalizeHhmm, isValidHhmm } from './chunk-3ELRYXJK.js';
+import { normalizeHhmm, isValidHhmm } from './chunk-JEIUEOTJ.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import * as React from 'react';
 import { jsx } from 'react/jsx-runtime';

package/dist/{chunk-ASMTSQWA.js → chunk-DWYRIKVD.js}

@@ -1,10 +1,10 @@
 import { EmptyState } from './chunk-YD7V2HGZ.js';
-import { Flex, densityClass } from './chunk-INIIF7F7.js';
 import { Checkbox } from './chunk-BE6GJGKJ.js';
+import { Flex, densityClass } from './chunk-INIIF7F7.js';
 import { Button } from './chunk-M4PZNAMV.js';
-import { Table, TableHeader, TableRow, TableHead, TableBody, TableCell } from './chunk-4MMIMZMK.js';
-import { tableCellPaddingClass, tableRowHeightClass, controlIconSmClass } from './chunk-IBK5D2Q6.js';
-import { useTranslation } from './chunk-TXRYSMOD.js';
+import { Table, TableHeader, TableRow, TableHead, TableBody, TableCell } from './chunk-IJ5ALJGA.js';
+import { tableCellPaddingClass, tableRowHeightClass, controlIconSmClass } from './chunk-B4K4BXEF.js';
+import { useTranslation } from './chunk-H2TX3OPW.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import * as React from 'react';
@@ -22,10 +22,13 @@ Descriptions.Item = function DescriptionsItem({
   children
 }) {
   const spanClass = span === 2 ? "sm:col-span-2" : span === 3 ? "sm:col-span-2 lg:col-span-3" : "";
-  return /* @__PURE__ */ jsxs("div", { className: cn(spanClass, className), children: [
-    /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground text-xs", children: label }),
-    /* @__PURE__ */ jsx("dd", { className: cn("text-sm break-all", mono && "font-mono"), children })
-  ] });
+  return (
+    // grid + the shared --field-label-gap so the label→value gap matches FormField / Form everywhere.
+    /* @__PURE__ */ jsxs("div", { className: cn("grid gap-[var(--field-label-gap)]", spanClass, className), children: [
+      /* @__PURE__ */ jsx("dt", { className: "text-muted-foreground text-xs", children: label }),
+      /* @__PURE__ */ jsx("dd", { className: cn("text-sm break-all", mono && "font-mono"), children })
+    ] })
+  );
 };
 var DataTableContext = React.createContext(null);
 function useDataTableContext() {

package/dist/chunk-ES4Q3KGL.js

@@ -0,0 +1 @@
+export { toast as sonnerToast } from 'sonner';

package/dist/{chunk-XVD5SLDL.js → chunk-FJBVDJGL.js}

@@ -1,4 +1,4 @@
-import { useTranslation } from './chunk-TXRYSMOD.js';
+import { useTranslation } from './chunk-H2TX3OPW.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import * as React from 'react';
 import useEmblaCarousel from 'embla-carousel-react';
@@ -18,16 +18,21 @@ var Carousel = React.forwardRef(({ className, opts, plugins, setApi, children, .
   const [emblaRef, api] = useEmblaCarousel(opts, plugins);
   const [canScrollPrev, setCanScrollPrev] = React.useState(false);
   const [canScrollNext, setCanScrollNext] = React.useState(false);
+  const [selectedIndex, setSelectedIndex] = React.useState(0);
+  const [scrollSnaps, setScrollSnaps] = React.useState([]);
   const onSelect = React.useCallback(() => {
     if (!api) return;
     setCanScrollPrev(api.canScrollPrev());
     setCanScrollNext(api.canScrollNext());
+    setSelectedIndex(api.selectedScrollSnap());
   }, [api]);
   React.useEffect(() => {
     if (!api) return void 0;
     onSelect();
+    setScrollSnaps(api.scrollSnapList());
     setApi?.(api);
     api.on("reInit", onSelect);
+    api.on("reInit", () => setScrollSnaps(api.scrollSnapList()));
     api.on("select", onSelect);
     return () => {
       api.off("reInit", onSelect);
@@ -50,12 +55,23 @@ var Carousel = React.forwardRef(({ className, opts, plugins, setApi, children, .
     () => ({
       canScrollPrev,
       canScrollNext,
+      selectedIndex,
+      scrollSnaps,
       api,
       scrollPrev,
       scrollNext,
       scrollTo
     }),
-    [canScrollPrev, canScrollNext, api, scrollPrev, scrollNext, scrollTo]
+    [
+      canScrollPrev,
+      canScrollNext,
+      selectedIndex,
+      scrollSnaps,
+      api,
+      scrollPrev,
+      scrollNext,
+      scrollTo
+    ]
   );
   return /* @__PURE__ */ jsx(CarouselContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
     "div",
@@ -158,5 +174,42 @@ var CarouselNext = React.forwardRef(({ className, ...props }, ref) => {
   );
 });
 CarouselNext.displayName = "CarouselNext";
+var CarouselDots = React.forwardRef(
+  ({ className, ...props }, ref) => {
+    const { t } = useTranslation();
+    const { scrollSnaps, selectedIndex, scrollTo } = useCarousel();
+    if (scrollSnaps.length <= 1) return null;
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        "data-slot": "carousel-dots",
+        className: cn("ui-carousel-dots", className),
+        role: "tablist",
+        "aria-label": t("dataDisplay.carousel.dotsLabel"),
+        ...props,
+        children: scrollSnaps.map((_, index) => {
+          const active = index === selectedIndex;
+          return /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              role: "tab",
+              "data-slot": "carousel-dot",
+              "data-active": active ? "" : void 0,
+              className: "ui-carousel-dot",
+              "aria-selected": active,
+              "aria-current": active ? "true" : void 0,
+              "aria-label": t("dataDisplay.carousel.goToSlide", { index: index + 1 }),
+              onClick: () => scrollTo(index)
+            },
+            index
+          );
+        })
+      }
+    );
+  }
+);
+CarouselDots.displayName = "CarouselDots";
 
-export { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, useCarousel };
+export { Carousel, CarouselContent, CarouselDots, CarouselItem, CarouselNext, CarouselPrevious, useCarousel };

package/dist/{chunk-FK5QEFVY.js → chunk-GDHDJAVB.js}

@@ -1,4 +1,4 @@
-import { getSyncedLocale, translateCurrent } from './chunk-3ELRYXJK.js';
+import { getSyncedLocale, translateCurrent } from './chunk-JEIUEOTJ.js';
 
 // src/lib/format.ts
 function formatBytes(n, locale = getSyncedLocale()) {

package/dist/{chunk-TXRYSMOD.js → chunk-H2TX3OPW.js}

@@ -1,4 +1,4 @@
-import { APP_TIME_FORMATS, isAppDateFormat, isAppTimeFormat, isAppLocale, translate, getDateFnsLocale, syncI18nLocale, syncDatetimeContext, disableLiveRelativeFormatting, enableLiveRelativeFormatting, getDayPickerLocale, APP_REQUEST_HEADER_DATE_FORMAT, APP_REQUEST_HEADER_TIME_FORMAT, resolveDefaultDateFormat } from './chunk-3ELRYXJK.js';
+import { APP_TIME_FORMATS, isAppDateFormat, isAppTimeFormat, isAppLocale, translate, getDateFnsLocale, syncI18nLocale, syncDatetimeContext, disableLiveRelativeFormatting, enableLiveRelativeFormatting, getDayPickerLocale, APP_REQUEST_HEADER_DATE_FORMAT, APP_REQUEST_HEADER_TIME_FORMAT, resolveDefaultDateFormat } from './chunk-JEIUEOTJ.js';
 import * as React from 'react';
 import { useMemo } from 'react';
 import { jsx } from 'react/jsx-runtime';

package/dist/{chunk-EOTOCNT7.js → chunk-HCCID4YY.js}

@@ -1,4 +1,4 @@
-import { controlMultilineClass } from './chunk-IBK5D2Q6.js';
+import { controlMultilineClass } from './chunk-B4K4BXEF.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import * as React from 'react';
 import { jsx } from 'react/jsx-runtime';