@godxjp/ui 6.12.0 → 8.0.0

package/README.md

@@ -126,8 +126,13 @@ pnpm preview          # preview app → http://localhost:6008 (fixed port, kills
 pnpm preview:build    # static build — the integration test for examples + docs
 pnpm docs:sync-primitives   # regenerate docs/primitives/**/*.md from source
 pnpm typecheck && pnpm audit && pnpm test
+pnpm check:mcp-sync   # MCP registry ↔ library export drift guard (also in verify)
+pnpm release --ui <patch|minor|major> --mcp <…|skip>   # publish lib + MCP in lockstep
 ```
 
+This repo ships two packages — `@godxjp/ui` (this dir) and `@godxjp/ui-mcp` (`mcp/`). They keep
+separate version lines but release together via `pnpm release`; see DEVELOPMENT.md §6.
+
 → **[docs/DEVELOPMENT.md](./docs/DEVELOPMENT.md)** is the contributor guideline (the
 boundary, the layers, how to add/extend a component, verification).
 

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-IobwLwaM.js';
+import { a as AppProviderProp, A as AppContextValue } from '../app.prop-DnIXFzLi.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-BNRJc9K0.js';
+import '../shared.prop-BsNSXeqD.js';
 import 'react';
 import '@date-fns/tz';
 

package/dist/{app.prop-IobwLwaM.d.ts → app.prop-DnIXFzLi.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, D as DisabledProp, I as IdProp } from './shared.prop-BNRJc9K0.js';
+import { C as ChildrenProp, a as ClassNameProp, c as DisabledProp, I as IdProp, V as ValueProp, g as OnValueChangeProp } from './shared.prop-BsNSXeqD.js';
 
 /** App shell prop types — @see docs/COMPONENTS.md#app */
 
@@ -40,16 +40,16 @@ type LocalePickerProp = {
     disabled?: DisabledProp;
     id?: IdProp;
     /** Controlled value; default reads/writes AppProvider. */
-    value?: AppLocale;
-    onChange?: (locale: AppLocale) => void;
+    value?: ValueProp<AppLocale>;
+    onValueChange?: OnValueChangeProp<AppLocale>;
 };
 /** @see TimezonePicker */
 type TimezonePickerProp = {
     className?: ClassNameProp;
     disabled?: DisabledProp;
     id?: IdProp;
-    value?: AppTimezone;
-    onChange?: (timezone: AppTimezone) => void;
+    value?: ValueProp<AppTimezone>;
+    onValueChange?: OnValueChangeProp<AppTimezone>;
     /** Override AppProvider list; omit to use context or full IANA. */
     options?: readonly AppTimezone[];
 };
@@ -58,16 +58,16 @@ type TimeFormatPickerProp = {
     className?: ClassNameProp;
     disabled?: DisabledProp;
     id?: IdProp;
-    value?: AppTimeFormat;
-    onChange?: (timeFormat: AppTimeFormat) => void;
+    value?: ValueProp<AppTimeFormat>;
+    onValueChange?: OnValueChangeProp<AppTimeFormat>;
 };
 /** @see DateFormatPicker */
 type DateFormatPickerProp = {
     className?: ClassNameProp;
     disabled?: DisabledProp;
     id?: IdProp;
-    value?: AppDateFormat;
-    onChange?: (dateFormat: AppDateFormat) => void;
+    value?: ValueProp<AppDateFormat>;
+    onValueChange?: OnValueChangeProp<AppDateFormat>;
 };
 /** Value exposed by `useAppContext`. */
 type AppContextValue = {

package/dist/aspect-ratio-DGoYrOry.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import * as AspectRatioPrimitive from '@radix-ui/react-aspect-ratio';
+
+declare const AspectRatio: React.ForwardRefExoticComponent<Omit<AspectRatioPrimitive.AspectRatioProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+
+export { AspectRatio as A };

package/dist/avatar-D9MdXzfF.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import * as AvatarPrimitive from '@radix-ui/react-avatar';
+
+declare const Avatar: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarProps & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+declare const AvatarImage: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarImageProps & React.RefAttributes<HTMLImageElement>, "ref"> & React.RefAttributes<HTMLImageElement>>;
+declare const AvatarFallback: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarFallbackProps & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+
+export { Avatar as A, AvatarFallback as a, AvatarImage as b };

package/dist/{checkbox-9w-eF8sM.d.ts → checkbox-ChRsR7Nk.d.ts}

@@ -1,9 +1,9 @@
 import * as React from 'react';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { c as CheckboxGroupProp } from './data-entry.prop-Cjidhei7.js';
+import { c as CheckboxGroupProp } from './data-entry.prop-CDkOajPj.js';
 
-declare function CheckboxGroup({ value: controlledValue, defaultValue, onChange, options, orientation, disabled, name, className, children, }: CheckboxGroupProp): react_jsx_runtime.JSX.Element;
+declare function CheckboxGroup({ value: controlledValue, defaultValue, onValueChange, options, orientation, disabled, name, className, children, }: CheckboxGroupProp): react_jsx_runtime.JSX.Element;
 
 /** Checkbox — dùng standalone hoặc `Checkbox.Group` với `options` (Ant Design style). */
 declare const Checkbox: React.ForwardRefExoticComponent<Omit<CheckboxPrimitive.CheckboxProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>> & {

package/dist/{chunk-3UGU5TYP.js → chunk-25RYBC5T.js}

@@ -1,4 +1,4 @@
-import { ChoiceField, choiceGroupClassName } from './chunk-CQBADMFG.js';
+import { Field, choiceGroupClassName } from './chunk-26CPAKUP.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import * as React from 'react';
 import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
@@ -61,7 +61,7 @@ function RadioGroupOptions({
         className: choiceGroupClassName(orientation, className),
         children: options.map((opt, index) => {
           const id = `${reactId}-${opt.value}-${index}`;
-          return /* @__PURE__ */ jsx(ChoiceField, { id, label: opt.label, description: opt.description, children: /* @__PURE__ */ jsx(RadioItem, { id, value: opt.value, disabled: opt.disabled }) }, opt.value);
+          return /* @__PURE__ */ jsx(Field, { id, label: opt.label, description: opt.description, children: /* @__PURE__ */ jsx(RadioItem, { id, value: opt.value, disabled: opt.disabled }) }, opt.value);
         })
       }
     );

package/dist/{chunk-CQBADMFG.js → chunk-26CPAKUP.js}

@@ -2,7 +2,7 @@ import { Label } from './chunk-7PWBC4BY.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
-function ChoiceField({ id, label, description, className, children }) {
+function Field({ id, label, description, className, children }) {
   return /* @__PURE__ */ jsxs("div", { className: cn("ui-choice-field", className), children: [
     /* @__PURE__ */ jsx("div", { className: "ui-choice-control", children }),
     /* @__PURE__ */ jsxs("div", { className: "ui-choice-content", children: [
@@ -11,10 +11,11 @@ function ChoiceField({ id, label, description, className, children }) {
     ] })
   ] });
 }
+var ChoiceField = Field;
 
 // src/components/data-entry/choice-option.ts
 function choiceGroupClassName(_orientation = "vertical", className) {
   return cn("ui-choice-group", className);
 }
 
-export { ChoiceField, choiceGroupClassName };
+export { ChoiceField, Field, choiceGroupClassName };

package/dist/{chunk-ZTYEH3UW.js → chunk-3TS3G4U3.js}

@@ -1,5 +1,5 @@
 import { Input } from './chunk-VOHTRR5X.js';
-import { controlIconClass } from './chunk-ICM6XBST.js';
+import { controlIconClass } from './chunk-IBK5D2Q6.js';
 import { useTranslation } from './chunk-RLGHEV4A.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import * as React from 'react';
@@ -12,7 +12,7 @@ function normalizeHex(value) {
 }
 function ColorPicker({
   value = "#2563eb",
-  onChange,
+  onValueChange,
   disabled,
   className,
   id,
@@ -28,7 +28,7 @@ function ColorPicker({
       return;
     }
     setDraft(null);
-    onChange?.(normalized);
+    onValueChange?.(normalized);
   };
   return /* @__PURE__ */ jsxs("div", { className: cn("ui-color-picker", className), children: [
     /* @__PURE__ */ jsxs("div", { className: cn("ui-color-picker-swatch", controlIconClass), children: [

package/dist/{chunk-ZS6DTAM2.js → chunk-4MMIMZMK.js}

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

package/dist/{chunk-T2S3IGZG.js → chunk-4R7RQDXI.js}

@@ -1,5 +1,5 @@
-import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from './chunk-EE3B3TEQ.js';
-import { Button } from './chunk-HJEBRCXL.js';
+import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from './chunk-G2WYOCDL.js';
+import { Button } from './chunk-M4PZNAMV.js';
 import { useTranslation, useOptionalAppContext, APP_LOCALES, resolveTimezonePickerOptions, getTimezoneLabel, APP_TIME_FORMAT_OPTIONS, getTimeFormatLabel } from './chunk-RLGHEV4A.js';
 import { APP_DATE_FORMAT_OPTIONS, getDateFormatLabel } from './chunk-FXFJF4YA.js';
 import { cn } from './chunk-U7N2A7A3.js';
@@ -8,27 +8,29 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { Link } from 'react-router-dom';
 import * as React from 'react';
 
-function FilterBar({
+function Toolbar({
   onClear,
   hasActiveFilters = true,
   className,
   children
 }) {
   const { t } = useTranslation();
-  return /* @__PURE__ */ jsxs("div", { className: cn("ui-filter-bar", className), children: [
+  return /* @__PURE__ */ jsxs("div", { className: cn("ui-toolbar", className), children: [
     children,
-    onClear && hasActiveFilters && /* @__PURE__ */ jsxs(Button, { variant: "ghost", size: "sm", onClick: onClear, className: "ui-filter-clear", children: [
+    onClear && hasActiveFilters && /* @__PURE__ */ jsxs(Button, { variant: "ghost", size: "sm", onClick: onClear, className: "ui-toolbar-clear", children: [
       /* @__PURE__ */ jsx(X, { "aria-hidden": "true" }),
       t("common.clearFilters")
     ] })
   ] });
 }
-function FilterGroup({ label, className, children }) {
-  return /* @__PURE__ */ jsxs("div", { className: cn("ui-stack-xs ui-filter-group", className), children: [
-    /* @__PURE__ */ jsx("div", { className: "ui-filter-label", children: label }),
+function ToolbarGroup({ label, className, children }) {
+  return /* @__PURE__ */ jsxs("div", { className: cn("ui-stack-xs ui-toolbar-group", className), children: [
+    /* @__PURE__ */ jsx("div", { className: "ui-toolbar-label", children: label }),
     children
   ] });
 }
+var FilterBar = Toolbar;
+var FilterGroup = ToolbarGroup;
 function PageHeader({ title, description, breadcrumb, actions, className }) {
   return /* @__PURE__ */ jsxs("header", { className: cn("ui-page-header", className), children: [
     breadcrumb && breadcrumb.length > 0 && /* @__PURE__ */ jsx("nav", { "aria-label": "Breadcrumb", className: "ui-breadcrumb", children: /* @__PURE__ */ jsx("ol", { className: "ui-breadcrumb-list", children: breadcrumb.map((item, i) => {
@@ -54,13 +56,13 @@ function PageHeader({ title, description, breadcrumb, actions, className }) {
     ] })
   ] });
 }
-function LocalePicker({ className, disabled, id, value, onChange }) {
+function LocalePicker({ className, disabled, id, value, onValueChange }) {
   const ctx = useOptionalAppContext();
   const { t } = useTranslation();
   const current = value ?? ctx?.locale;
-  const handleChange = onChange ?? ctx?.setLocale;
+  const handleChange = onValueChange ?? ctx?.setLocale;
   if (current === void 0 || !handleChange) {
-    throw new Error("LocalePicker requires <AppProvider> or controlled value + onChange");
+    throw new Error("LocalePicker requires <AppProvider> or controlled value + onValueChange");
   }
   return /* @__PURE__ */ jsxs(Select, { value: current, onValueChange: handleChange, disabled, children: [
     /* @__PURE__ */ jsxs(
@@ -83,16 +85,16 @@ function TimezonePicker({
   disabled,
   id,
   value,
-  onChange,
+  onValueChange,
   options: optionsProp
 }) {
   const ctx = useOptionalAppContext();
   const { t, locale, fallbackLocale } = useTranslation();
   const current = value ?? ctx?.timezone;
-  const handleChange = onChange ?? ctx?.setTimezone;
+  const handleChange = onValueChange ?? ctx?.setTimezone;
   const configured = optionsProp ?? ctx?.timezoneOptions;
   if (current === void 0 || !handleChange) {
-    throw new Error("TimezonePicker requires <AppProvider> or controlled value + onChange");
+    throw new Error("TimezonePicker requires <AppProvider> or controlled value + onValueChange");
   }
   const options = React.useMemo(
     () => resolveTimezonePickerOptions(configured, current),
@@ -119,14 +121,14 @@ function TimeFormatPicker({
   disabled,
   id,
   value,
-  onChange
+  onValueChange
 }) {
   const ctx = useOptionalAppContext();
   const { t, locale, fallbackLocale } = useTranslation();
   const current = value ?? ctx?.timeFormat;
-  const handleChange = onChange ?? ctx?.setTimeFormat;
+  const handleChange = onValueChange ?? ctx?.setTimeFormat;
   if (current === void 0 || !handleChange) {
-    throw new Error("TimeFormatPicker requires <AppProvider> or controlled value + onChange");
+    throw new Error("TimeFormatPicker requires <AppProvider> or controlled value + onValueChange");
   }
   return /* @__PURE__ */ jsxs(Select, { value: current, onValueChange: handleChange, disabled, children: [
     /* @__PURE__ */ jsxs(
@@ -149,14 +151,14 @@ function DateFormatPicker({
   disabled,
   id,
   value,
-  onChange
+  onValueChange
 }) {
   const ctx = useOptionalAppContext();
   const { t, locale, fallbackLocale } = useTranslation();
   const current = value ?? ctx?.dateFormat;
-  const handleChange = onChange ?? ctx?.setDateFormat;
+  const handleChange = onValueChange ?? ctx?.setDateFormat;
   if (current === void 0 || !handleChange) {
-    throw new Error("DateFormatPicker requires <AppProvider> or controlled value + onChange");
+    throw new Error("DateFormatPicker requires <AppProvider> or controlled value + onValueChange");
   }
   return /* @__PURE__ */ jsxs(Select, { value: current, onValueChange: handleChange, disabled, children: [
     /* @__PURE__ */ jsxs(
@@ -175,4 +177,4 @@ function DateFormatPicker({
   ] });
 }
 
-export { DateFormatPicker, FilterBar, FilterGroup, LocalePicker, PageHeader, TimeFormatPicker, TimezonePicker };
+export { DateFormatPicker, FilterBar, FilterGroup, LocalePicker, PageHeader, TimeFormatPicker, TimezonePicker, Toolbar, ToolbarGroup };

package/dist/{chunk-Y7AV7QJO.js → chunk-6QXQQAOQ.js}

@@ -1,7 +1,7 @@
-import { Command, CommandList, CommandItem, CommandGroup } from './chunk-V6UWJKZF.js';
+import { Command, CommandList, CommandItem, CommandGroup } from './chunk-HTEL5DQI.js';
 import { Input } from './chunk-VOHTRR5X.js';
 import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
-import { Button } from './chunk-HJEBRCXL.js';
+import { Button } from './chunk-M4PZNAMV.js';
 import { useTranslation } from './chunk-RLGHEV4A.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import * as React from 'react';
@@ -11,7 +11,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 var DEBOUNCE_MS = 250;
 function SearchSelect({
   value = "",
-  onChange,
+  onValueChange,
   options: staticOptions,
   loadOptions,
   renderOption,
@@ -103,12 +103,12 @@ function SearchSelect({
   const select = (option) => {
     if (option.disabled) return;
     setPicked(option);
-    onChange?.(option.value, option);
+    onValueChange?.(option.value, option);
     setOpen(false);
   };
   const clear = () => {
     setPicked(null);
-    onChange?.("", void 0);
+    onValueChange?.("", void 0);
     setOpen(false);
   };
   const onScroll = (event) => {

package/dist/{chunk-JJCGMCTL.js → chunk-A22MCA3X.js}

@@ -1,9 +1,9 @@
 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 { Checkbox } from './chunk-O24Z3ULJ.js';
 import { ScrollArea } from './chunk-3KPEZ5CF.js';
-import { Button } from './chunk-HJEBRCXL.js';
+import { Command, CommandInput } from './chunk-HTEL5DQI.js';
+import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
+import { Button } from './chunk-M4PZNAMV.js';
 import { useTranslation } from './chunk-RLGHEV4A.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import * as React from 'react';
@@ -38,7 +38,7 @@ function TreeSelectRoot({
   treeData: treeDataProp,
   value,
   defaultValue,
-  onChange,
+  onValueChange,
   multiple,
   treeCheckable,
   treeCheckStrictly,
@@ -73,7 +73,7 @@ function TreeSelectRoot({
   }, [options, expandedKeys, search, showSearch]);
   const commit = (next) => {
     if (!isControlled) setInternal(next);
-    onChange?.(checkable || multiple ? next : next[0] ?? void 0);
+    onValueChange?.(checkable || multiple ? next : next[0] ?? void 0);
   };
   const toggleExpand = (key) => {
     setExpandedKeys((prev) => {

package/dist/{chunk-TW4IRRAX.js → chunk-A7PKMT7Y.js}

@@ -1,12 +1,12 @@
-import { Inline, densityClass } from './chunk-S66TJXJU.js';
-import { Table, TableHeader, TableRow, TableHead, TableBody, TableCell } from './chunk-ZS6DTAM2.js';
-import { tableCellPaddingClass, tableRowHeightClass, controlIconSmClass, toneNeutralClass, toneInfoClass, toneDestructiveClass, toneWarningClass, toneSuccessClass } from './chunk-ICM6XBST.js';
-import { Button } from './chunk-HJEBRCXL.js';
+import { Inline, densityClass } from './chunk-TILFZBTE.js';
+import { Table, TableHeader, TableRow, TableHead, TableBody, TableCell } from './chunk-4MMIMZMK.js';
+import { Button } from './chunk-M4PZNAMV.js';
+import { tableCellPaddingClass, tableRowHeightClass, controlIconSmClass } from './chunk-IBK5D2Q6.js';
 import { useTranslation } from './chunk-RLGHEV4A.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { Layers, Layers2, ArrowUp, ArrowDown, ChevronsUpDown, MoreHorizontal, XCircle, Pause, CheckCircle2, Circle, Trash2, AlertCircle, Clock, Play } from 'lucide-react';
 import * as React from 'react';
+import { Layers, Layers2, ArrowUp, ArrowDown, ChevronsUpDown, MoreHorizontal } from 'lucide-react';
 
 function EmptyState({ icon: Icon, title, description, action, className }) {
   return /* @__PURE__ */ jsxs("div", { "data-slot": "empty-state", className: cn("ui-empty-state", className), children: [
@@ -16,52 +16,11 @@ function EmptyState({ icon: Icon, title, description, action, className }) {
     action && /* @__PURE__ */ jsx("div", { children: action })
   ] });
 }
-var STATUS_MAP = {
-  active: { tone: "success", icon: CheckCircle2 },
-  completed: { tone: "success", icon: CheckCircle2 },
-  delivered: { tone: "success", icon: CheckCircle2 },
-  done: { tone: "success", icon: CheckCircle2 },
-  permanent: { tone: "success", icon: CheckCircle2 },
-  succeeded: { tone: "success", icon: CheckCircle2 },
-  draft: { tone: "neutral", icon: Circle },
-  pending: { tone: "warning", icon: Clock },
-  scheduled: { tone: "info", icon: Clock },
-  sending: { tone: "info", icon: Play },
-  temporary: { tone: "warning", icon: Clock },
-  bounced: { tone: "destructive", icon: AlertCircle },
-  cancelled: { tone: "neutral", icon: Pause },
-  deleted: { tone: "destructive", icon: Trash2 },
-  failed: { tone: "destructive", icon: XCircle },
-  private: { tone: "neutral", icon: Circle },
-  internal: { tone: "info", icon: Circle },
-  public: { tone: "info", icon: Circle },
-  ASSIGNMENT_STATUS_ACTIVE: { tone: "success", icon: CheckCircle2 },
-  ASSIGNMENT_STATUS_SUSPENDED: { tone: "warning", icon: Pause },
-  ASSIGNMENT_STATUS_TERMINATED: { tone: "destructive", icon: XCircle }
-};
-var TONE_CLASSES = {
-  success: toneSuccessClass,
-  warning: toneWarningClass,
-  destructive: toneDestructiveClass,
-  info: toneInfoClass,
-  neutral: toneNeutralClass
-};
-function StatusBadge({ status, className, label: labelOverride, tone, icon }) {
-  const { t } = useTranslation();
-  const def = STATUS_MAP[status] ?? { tone: "neutral", icon: Circle };
-  const resolvedTone = tone ?? def.tone;
-  const ResolvedIcon = icon === void 0 ? def.icon : icon;
-  const resolvedLabel = labelOverride ?? (status in STATUS_MAP ? t(`status.${status}`) : status);
-  return /* @__PURE__ */ jsxs("span", { "data-slot": "status-badge", className: cn(TONE_CLASSES[resolvedTone], className), children: [
-    ResolvedIcon ? /* @__PURE__ */ jsx(ResolvedIcon, { "data-slot": "status-badge-icon", "aria-hidden": "true" }) : null,
-    /* @__PURE__ */ jsx("span", { children: resolvedLabel })
-  ] });
-}
-function KeyValueGrid({ columns = 2, className, children }) {
+function Descriptions({ columns = 2, className, children }) {
   const colsClass = columns === 1 ? "grid-cols-1" : columns === 3 ? "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3" : "grid-cols-1 sm:grid-cols-2";
   return /* @__PURE__ */ jsx("dl", { className: cn("grid gap-x-6 gap-y-3", colsClass, className), children });
 }
-KeyValueGrid.Item = function KeyValueGridItem({
+Descriptions.Item = function DescriptionsItem({
   label,
   mono,
   span,
@@ -412,4 +371,4 @@ DataTable.RowActions = function DataTableRowActions({ ariaLabel, children }) {
 };
 DataTable.RowActions.displayName = "DataTable.RowActions";
 
-export { DataTable, EmptyState, KeyValueGrid, StatusBadge };
+export { DataTable, Descriptions, EmptyState };

package/dist/chunk-AINW5WYN.js

@@ -0,0 +1,57 @@
+import { tableCellPaddingClass, tableRowHeightClass } from './chunk-IBK5D2Q6.js';
+import { cn } from './chunk-U7N2A7A3.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function Skeleton({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "aria-busy": "true",
+      "aria-live": "polite",
+      className: cn("ui-skeleton-block", className),
+      ...props
+    }
+  );
+}
+function SkeletonRows({ rows = 6, columns = 4, className }) {
+  return /* @__PURE__ */ jsx("div", { className: cn("ui-skeleton-rows", className), "aria-busy": "true", children: Array.from({ length: rows }).map((_, i) => /* @__PURE__ */ jsx("div", { className: "ui-skeleton-row", children: Array.from({ length: columns }).map((_2, j) => /* @__PURE__ */ jsx(
+    Skeleton,
+    {
+      className: cn("h-4", j === 0 ? "w-1/4" : j === columns - 1 ? "w-1/6" : "flex-1")
+    },
+    j
+  )) }, i)) });
+}
+function SkeletonTable({ rows = 8, columns = 5 }) {
+  return /* @__PURE__ */ jsxs("div", { className: "ui-skeleton-table", "aria-busy": "true", children: [
+    /* @__PURE__ */ jsx("div", { className: cn("ui-skeleton-table-head", tableCellPaddingClass, tableRowHeightClass), children: Array.from({ length: columns }).map((_, j) => /* @__PURE__ */ jsx(Skeleton, { className: cn("h-3", j === 0 ? "w-1/5" : "flex-1") }, j)) }),
+    /* @__PURE__ */ jsx("div", { className: "ui-skeleton-table-body", children: Array.from({ length: rows }).map((_, i) => /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn("ui-skeleton-table-row", tableCellPaddingClass, tableRowHeightClass),
+        children: Array.from({ length: columns }).map((_2, j) => /* @__PURE__ */ jsx(Skeleton, { className: cn("h-4", j === 0 ? "w-1/5" : "flex-1") }, j))
+      },
+      i
+    )) })
+  ] });
+}
+function SkeletonDetail() {
+  return /* @__PURE__ */ jsxs("div", { className: "ui-skeleton-detail ui-skeleton-detail-stack", "aria-busy": "true", children: [
+    /* @__PURE__ */ jsx(Skeleton, { className: "h-7 w-1/3" }),
+    /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-1/2" }),
+    /* @__PURE__ */ jsx("div", { className: "ui-skeleton-detail-box ui-skeleton-detail-stack", children: Array.from({ length: 6 }).map((_, i) => /* @__PURE__ */ jsxs("div", { className: "ui-skeleton-detail-stack", children: [
+      /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-24" }),
+      /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-full max-w-md" })
+    ] }, i)) })
+  ] });
+}
+function SkeletonStat() {
+  return /* @__PURE__ */ jsxs("div", { className: "ui-skeleton-stat", "aria-busy": "true", children: [
+    /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-24" }),
+    /* @__PURE__ */ jsx(Skeleton, { className: "h-[length:var(--control-height)] w-32" }),
+    /* @__PURE__ */ jsx(Skeleton, { className: "h-3 w-20" })
+  ] });
+}
+var SkeletonCard = SkeletonStat;
+
+export { Skeleton, SkeletonCard, SkeletonDetail, SkeletonRows, SkeletonStat, SkeletonTable };

package/dist/chunk-B3WX53JQ.js

@@ -0,0 +1,40 @@
+import { toast as toast$1 } from 'sonner';
+
+// src/components/feedback/use-toast.ts
+function nodeText(value) {
+  if (value == null) return "";
+  if (typeof value === "string") return value;
+  if (typeof value === "number" || typeof value === "boolean") return String(value);
+  return "";
+}
+function legacyToast(options) {
+  const { title, description, variant, ...rest } = options;
+  const titleText = nodeText(title);
+  const descText = nodeText(description);
+  const message = titleText || descText;
+  const desc = titleText && descText ? descText : void 0;
+  const sonnerOptions = { ...rest, description: desc };
+  switch (variant) {
+    case "destructive":
+      return toast$1.error(message, sonnerOptions);
+    case "success":
+      return toast$1.success(message, sonnerOptions);
+    default:
+      return toast$1(message, sonnerOptions);
+  }
+}
+var toast = Object.assign((messageOrOptions) => {
+  if (typeof messageOrOptions === "string") {
+    return toast$1(messageOrOptions);
+  }
+  return legacyToast(messageOrOptions);
+}, toast$1);
+function useToast() {
+  return {
+    toast: (options) => legacyToast(options),
+    dismiss: toast$1.dismiss,
+    toasts: []
+  };
+}
+
+export { toast, useToast };