@godxjp/ui 6.12.0 → 8.0.0

package/dist/{chunk-XG7XDYIM.js → chunk-V3N266PT.js}

@@ -1,21 +1,67 @@
 import { cn } from './chunk-U7N2A7A3.js';
 import * as React from 'react';
 import * as TabsPrimitive from '@radix-ui/react-tabs';
-import { jsx } from 'react/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 function Tabs({
   className,
   orientation = "horizontal",
+  items,
+  value,
+  defaultValue,
+  variant = "default",
+  listClassName,
+  contentClassName,
   ...props
 }) {
+  const firstValue = items?.[0]?.value;
+  const resolvedDefault = defaultValue ?? firstValue;
   return /* @__PURE__ */ jsx(
     TabsPrimitive.Root,
     {
       "data-slot": "tabs",
       "data-orientation": orientation,
       orientation,
+      value,
+      defaultValue: value === void 0 ? resolvedDefault : void 0,
       className: cn("group/tabs flex gap-2 data-[orientation=horizontal]:flex-col", className),
-      ...props
+      ...props,
+      children: items ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(
+          TabsList,
+          {
+            "data-slot": "tabs-list",
+            className: cn(
+              variant === "line" && "h-auto w-full justify-start rounded-none border-b bg-transparent p-0",
+              variant === "card" && "w-full justify-start",
+              listClassName
+            ),
+            children: items.map((item) => /* @__PURE__ */ jsx(
+              TabsTrigger,
+              {
+                value: item.value,
+                disabled: item.disabled,
+                className: cn(
+                  variant === "line" && "data-[state=active]:border-primary rounded-none border-b-2 border-transparent bg-transparent px-4 py-2 shadow-none data-[state=active]:bg-transparent data-[state=active]:shadow-none",
+                  variant === "card" && "data-[state=active]:shadow-sm"
+                ),
+                children: item.label
+              },
+              item.value
+            ))
+          }
+        ),
+        items.map((item) => /* @__PURE__ */ jsx(
+          TabsContent,
+          {
+            value: item.value,
+            "data-slot": "tabs-panel",
+            className: cn(variant === "line" && "mt-0", contentClassName),
+            children: item.content
+          },
+          item.value
+        ))
+      ] }) : props.children
     }
   );
 }

package/dist/{chunk-I3272Y2C.js → chunk-WN52SCGE.js}

@@ -1,7 +1,7 @@
-import { Calendar } from './chunk-IK7I3ABN.js';
+import { Calendar } from './chunk-IOGU3ZWF.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, usePickerLocales } from './chunk-RLGHEV4A.js';
 import { toIsoDate, parseDateInput } from './chunk-FXFJF4YA.js';
 import { cn } from './chunk-U7N2A7A3.js';
@@ -12,7 +12,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 var ISO_HINT = "yyyy-mm-dd";
 function DateRangePicker({
   value,
-  onChange,
+  onValueChange,
   placeholder,
   disabled,
   className,
@@ -32,7 +32,7 @@ function DateRangePicker({
     setToText(toIsoDate(value?.to));
   }, [value?.from, value?.to]);
   const resolvedPlaceholder = placeholder ?? t("dataEntry.dateRangePicker.placeholder") ?? ISO_HINT;
-  const emit = (next) => onChange?.(next);
+  const emit = (next) => onValueChange?.(next);
   const commitEdge = (edge, raw) => {
     const parsed = raw.trim() === "" ? void 0 : parseDateInput(raw.trim()) ?? void 0;
     const next = { from: value?.from, to: value?.to, [edge]: parsed };

package/dist/{chunk-T4UT3B3K.js → chunk-WTVLZVBA.js}

@@ -1,16 +1,19 @@
-import { DropdownMenu, DropdownMenuTrigger } from './chunk-TO33OY4L.js';
 import { Tooltip, TooltipTrigger, TooltipContent } from './chunk-32WO3YLB.js';
+import { DropdownMenu, DropdownMenuTrigger } from './chunk-TO33OY4L.js';
 import { Collapsible, CollapsibleTrigger, CollapsibleContent } from './chunk-DV52WNXO.js';
-import { densityClass, pageContainerVariantClass, stackGapClass } from './chunk-S66TJXJU.js';
-import { Badge } from './chunk-PIIRNAXA.js';
+import { densityClass, pageContainerVariantClass, Flex } from './chunk-TILFZBTE.js';
 import { Popover, PopoverTrigger, PopoverContent } from './chunk-DY5C44UP.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import { Link } from 'react-router-dom';
 import { ChevronRight, ChevronDown, PanelLeftOpen, PanelLeftClose, Search, Bell, SlidersHorizontal } from 'lucide-react';
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as React from 'react';
+import * as SeparatorPrimitive from '@radix-ui/react-separator';
 
-function PageContainer({
+function PageContainerInset({ className, children, ...props }) {
+  return /* @__PURE__ */ jsx("div", { className: cn("ui-page-container-inset", className), ...props, children });
+}
+function PageContainerRoot({
   title,
   subtitle,
   extra,
@@ -62,11 +65,14 @@ function PageContainer({
     }
   );
 }
-function PageInset({ className, children, ...props }) {
-  return /* @__PURE__ */ jsx("div", { className: cn("ui-page-inset", className), ...props, children });
+var PageContainer = Object.assign(PageContainerRoot, {
+  Inset: PageContainerInset
+});
+function PageInset(props) {
+  return /* @__PURE__ */ jsx(PageContainerInset, { ...props });
 }
-function Stack({ gap = "md", className, children, ...props }) {
-  return /* @__PURE__ */ jsx("div", { className: cn(stackGapClass[gap], className), ...props, children });
+function Stack(props) {
+  return /* @__PURE__ */ jsx(Flex, { direction: "col", ...props });
 }
 function AppShell({
   sidebar,
@@ -95,131 +101,14 @@ function AppShell({
     footer !== void 0 && /* @__PURE__ */ jsx("footer", { className: "app-footer", children: footer })
   ] });
 }
-function Topbar({
-  product,
-  project,
-  productMenu,
-  projectMenu,
-  onProductOpen,
-  onProjectOpen,
-  onSearchOpen,
-  onTweaksOpen,
-  collapsed = false,
-  onToggleCollapsed,
-  rightSlot,
-  unread = false,
-  onNotificationsOpen,
-  user
-}) {
-  const productChip = /* @__PURE__ */ jsxs(
-    "button",
-    {
-      type: "button",
-      className: "tb-chip",
-      "aria-label": product.name,
-      onClick: productMenu ? void 0 : onProductOpen,
-      children: [
-        /* @__PURE__ */ jsx(
-          "span",
-          {
-            className: "tb-chip-icon",
-            style: { background: product.color ?? "hsl(var(--attention))" },
-            children: product.name[0]?.toUpperCase() ?? "?"
-          }
-        ),
-        /* @__PURE__ */ jsx("span", { className: "tb-chip-label", children: product.name }),
-        /* @__PURE__ */ jsx("span", { className: "tb-chip-caret", children: /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": "true" }) })
-      ]
-    }
-  );
-  const showProject = project != null || projectMenu != null;
-  const projectChip = /* @__PURE__ */ jsxs(
-    "button",
-    {
-      type: "button",
-      className: `tb-chip ${project ? "" : "tb-chip-empty"}`,
-      "aria-label": project ? project.name : "Pick project",
-      onClick: projectMenu ? void 0 : onProjectOpen,
-      children: [
-        /* @__PURE__ */ jsx("span", { className: "tb-chip-label", children: project ? project.name : "Pick project" }),
-        /* @__PURE__ */ jsx("span", { className: "tb-chip-caret", children: /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": "true" }) })
-      ]
-    }
-  );
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    onToggleCollapsed ? /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        className: "tb-icon-btn",
-        "aria-label": "Toggle sidebar",
-        "aria-pressed": collapsed,
-        onClick: onToggleCollapsed,
-        children: collapsed ? /* @__PURE__ */ jsx(PanelLeftOpen, { "aria-hidden": "true" }) : /* @__PURE__ */ jsx(PanelLeftClose, { "aria-hidden": "true" })
-      }
-    ) : null,
-    /* @__PURE__ */ jsxs("div", { className: "tb-switcher", children: [
-      productMenu ? /* @__PURE__ */ jsxs(DropdownMenu, { children: [
-        /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: productChip }),
-        productMenu
-      ] }) : productChip,
-      showProject ? /* @__PURE__ */ jsx("span", { className: "tb-chip-sep", children: "/" }) : null,
-      showProject ? projectMenu ? /* @__PURE__ */ jsxs(DropdownMenu, { children: [
-        /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: projectChip }),
-        projectMenu
-      ] }) : projectChip : null
-    ] }),
-    /* @__PURE__ */ jsxs("button", { type: "button", className: "tb-search", onClick: onSearchOpen, children: [
-      /* @__PURE__ */ jsx(Search, { "aria-hidden": "true" }),
-      /* @__PURE__ */ jsx("span", { children: "Search..." }),
-      /* @__PURE__ */ jsx("kbd", { className: "kbd", children: "\u2318K" })
-    ] }),
-    rightSlot,
-    onNotificationsOpen ? /* @__PURE__ */ jsxs(
-      "button",
-      {
-        type: "button",
-        className: "tb-icon-btn tb-bell",
-        "aria-label": "Notifications",
-        onClick: onNotificationsOpen,
-        children: [
-          /* @__PURE__ */ jsx(Bell, { "aria-hidden": "true" }),
-          unread ? /* @__PURE__ */ jsx("span", { className: "tb-bell-dot", "aria-hidden": "true" }) : null
-        ]
-      }
-    ) : null,
-    user,
-    onTweaksOpen ? /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        className: "tb-icon-btn",
-        "aria-label": "Open tweaks",
-        onClick: onTweaksOpen,
-        children: /* @__PURE__ */ jsx(SlidersHorizontal, { "aria-hidden": "true" })
-      }
-    ) : null
-  ] });
-}
-function ShellApp({ menu, breadcrumb, children }) {
-  return /* @__PURE__ */ jsx(
-    AppShell,
-    {
-      sidebar: menu,
-      breadcrumb,
-      topbar: /* @__PURE__ */ jsx(
-        Topbar,
-        {
-          product: { name: "GodX", color: "hsl(var(--attention))" },
-          project: { name: "Japan to SEA lanes" },
-          onSearchOpen: () => void 0,
-          onNotificationsOpen: () => void 0,
-          unread: true
-        }
-      ),
-      children
-    }
-  );
+function Breadcrumb({ items }) {
+  return /* @__PURE__ */ jsx("nav", { "aria-label": "Breadcrumb", className: "ui-breadcrumb", children: /* @__PURE__ */ jsx("ol", { className: "ui-breadcrumb-list", children: items.map((item, index) => {
+    const isLast = index === items.length - 1;
+    return /* @__PURE__ */ jsxs("li", { className: "ui-breadcrumb-item", children: [
+      item.to && !isLast ? /* @__PURE__ */ jsx(Link, { to: item.to, className: "ui-breadcrumb-link", children: item.label }) : /* @__PURE__ */ jsx("span", { className: "ui-breadcrumb-current", "aria-current": isLast ? "page" : void 0, children: item.label }),
+      !isLast ? /* @__PURE__ */ jsx(ChevronRight, { "aria-hidden": "true" }) : null
+    ] }, item.to ?? index);
+  }) }) });
 }
 function isItemActive(item, activeId) {
   if (item.id === activeId) return true;
@@ -376,32 +265,128 @@ function Sidebar({
     footer ? /* @__PURE__ */ jsx("div", { className: "sb-footer", children: footer }) : null
   ] });
 }
-function Menu({ items }) {
-  const sections = items.map((section) => ({
-    label: section.label,
-    items: section.items.map(({ active: _active, ...item }) => item)
-  }));
-  const activeId = items.flatMap((section) => section.items).find((item) => item.active)?.id ?? items[0]?.items[0]?.id ?? "";
-  return /* @__PURE__ */ jsx(
-    Sidebar,
+function Topbar({
+  product,
+  project,
+  productMenu,
+  projectMenu,
+  onProductOpen,
+  onProjectOpen,
+  onSearchOpen,
+  onTweaksOpen,
+  collapsed = false,
+  onToggleCollapsed,
+  rightSlot,
+  unread = false,
+  onNotificationsOpen,
+  user
+}) {
+  const productChip = /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      className: "tb-chip",
+      "aria-label": product.name,
+      onClick: productMenu ? void 0 : onProductOpen,
+      children: [
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: "tb-chip-icon",
+            style: { background: product.color ?? "hsl(var(--attention))" },
+            children: product.name[0]?.toUpperCase() ?? "?"
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { className: "tb-chip-label", children: product.name }),
+        /* @__PURE__ */ jsx("span", { className: "tb-chip-caret", children: /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": "true" }) })
+      ]
+    }
+  );
+  const showProject = project != null || projectMenu != null;
+  const projectChip = /* @__PURE__ */ jsxs(
+    "button",
     {
-      activeId,
-      sections,
-      product: { name: "Acme Console", role: "Workspace", color: "hsl(var(--attention))" }
+      type: "button",
+      className: `tb-chip ${project ? "" : "tb-chip-empty"}`,
+      "aria-label": project ? project.name : "Pick project",
+      onClick: projectMenu ? void 0 : onProjectOpen,
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "tb-chip-label", children: project ? project.name : "Pick project" }),
+        /* @__PURE__ */ jsx("span", { className: "tb-chip-caret", children: /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": "true" }) })
+      ]
     }
   );
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    onToggleCollapsed ? /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "tb-icon-btn",
+        "aria-label": "Toggle sidebar",
+        "aria-pressed": collapsed,
+        onClick: onToggleCollapsed,
+        children: collapsed ? /* @__PURE__ */ jsx(PanelLeftOpen, { "aria-hidden": "true" }) : /* @__PURE__ */ jsx(PanelLeftClose, { "aria-hidden": "true" })
+      }
+    ) : null,
+    /* @__PURE__ */ jsxs("div", { className: "tb-switcher", children: [
+      productMenu ? /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+        /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: productChip }),
+        productMenu
+      ] }) : productChip,
+      showProject ? /* @__PURE__ */ jsx("span", { className: "tb-chip-sep", children: "/" }) : null,
+      showProject ? projectMenu ? /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+        /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: projectChip }),
+        projectMenu
+      ] }) : projectChip : null
+    ] }),
+    /* @__PURE__ */ jsxs("button", { type: "button", className: "tb-search", onClick: onSearchOpen, children: [
+      /* @__PURE__ */ jsx(Search, { "aria-hidden": "true" }),
+      /* @__PURE__ */ jsx("span", { children: "Search..." }),
+      /* @__PURE__ */ jsx("kbd", { className: "kbd", children: "\u2318K" })
+    ] }),
+    rightSlot,
+    onNotificationsOpen ? /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: "tb-icon-btn tb-bell",
+        "aria-label": "Notifications",
+        onClick: onNotificationsOpen,
+        children: [
+          /* @__PURE__ */ jsx(Bell, { "aria-hidden": "true" }),
+          unread ? /* @__PURE__ */ jsx("span", { className: "tb-bell-dot", "aria-hidden": "true" }) : null
+        ]
+      }
+    ) : null,
+    user,
+    onTweaksOpen ? /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "tb-icon-btn",
+        "aria-label": "Open tweaks",
+        onClick: onTweaksOpen,
+        children: /* @__PURE__ */ jsx(SlidersHorizontal, { "aria-hidden": "true" })
+      }
+    ) : null
+  ] });
 }
-function Breadcrumb({ items }) {
-  return /* @__PURE__ */ jsx("nav", { "aria-label": "Breadcrumb", className: "ui-breadcrumb", children: /* @__PURE__ */ jsx("ol", { className: "ui-breadcrumb-list", children: items.map((item, index) => {
-    const isLast = index === items.length - 1;
-    return /* @__PURE__ */ jsxs("li", { className: "ui-breadcrumb-item", children: [
-      item.to && !isLast ? /* @__PURE__ */ jsx(Link, { to: item.to, className: "ui-breadcrumb-link", children: item.label }) : /* @__PURE__ */ jsx("span", { className: "ui-breadcrumb-current", "aria-current": isLast ? "page" : void 0, children: item.label }),
-      !isLast ? /* @__PURE__ */ jsx(ChevronRight, { "aria-hidden": "true" }) : null
-    ] }, item.to ?? index);
-  }) }) });
+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", "data-columns": columns, children });
+  return /* @__PURE__ */ jsx("div", { className: "ui-responsive-grid", style: resolveColumns(columns), children });
 }
 function SplitPane({ children, aside, asideWidth = "md" }) {
   return /* @__PURE__ */ jsxs("div", { className: "ui-split-pane", "data-aside-width": asideWidth, children: [
@@ -409,38 +394,18 @@ function SplitPane({ children, aside, asideWidth = "md" }) {
     /* @__PURE__ */ jsx("aside", { className: "ui-split-pane-aside", children: aside })
   ] });
 }
-function MobileFrame({
-  title,
-  subtitle,
-  status,
-  children,
-  navItems = []
-}) {
-  return /* @__PURE__ */ jsx("div", { className: "ui-mobile-stage", children: /* @__PURE__ */ jsxs("div", { className: "ui-mobile-frame", children: [
-    /* @__PURE__ */ jsxs("header", { className: "ui-mobile-header", children: [
-      /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx("div", { className: "ui-mobile-title", children: title }),
-        subtitle ? /* @__PURE__ */ jsx("div", { className: "ui-mobile-subtitle", children: subtitle }) : null
-      ] }),
-      status ? /* @__PURE__ */ jsx(Badge, { variant: "secondary", children: status }) : null
-    ] }),
-    /* @__PURE__ */ jsx("main", { className: "ui-mobile-main", children }),
-    navItems.length > 0 ? /* @__PURE__ */ jsx("footer", { className: "ui-mobile-nav", children: navItems.map((item) => {
-      const Icon = item.icon;
-      return /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: "ui-mobile-nav-item",
-          "data-active": item.active ? "true" : void 0,
-          children: [
-            /* @__PURE__ */ jsx(Icon, { "aria-hidden": "true" }),
-            /* @__PURE__ */ jsx("span", { children: item.label })
-          ]
-        },
-        item.label
-      );
-    }) }) : null
-  ] }) });
-}
+var Separator = React.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ jsx(
+  SeparatorPrimitive.Root,
+  {
+    ref,
+    "data-slot": "separator",
+    "data-orientation": orientation,
+    orientation,
+    decorative,
+    className: cn("ui-separator", className),
+    ...props
+  }
+));
+Separator.displayName = SeparatorPrimitive.Root.displayName;
 
-export { AppShell, Breadcrumb, Menu, MobileFrame, PageContainer, PageInset, ResponsiveGrid, ShellApp, Sidebar, SplitPane, Stack, Topbar };
+export { AppShell, Breadcrumb, PageContainer, PageInset, ResponsiveGrid, Separator, Sidebar, SplitPane, Stack, Topbar };

package/dist/{chunk-SWGQX3AP.js → chunk-XDUZ7JJL.js}

@@ -1,4 +1,4 @@
-import { SearchSelect } from './chunk-Y7AV7QJO.js';
+import { SearchSelect } from './chunk-6QXQQAOQ.js';
 import { jsx } from 'react/jsx-runtime';
 
 function Autocomplete({
@@ -17,7 +17,7 @@ function Autocomplete({
     {
       id,
       value,
-      onChange: (next) => onValueChange?.(next),
+      onValueChange: (next) => onValueChange?.(next),
       options,
       clearable: false,
       placeholder,

package/dist/chunk-XMBCNMJI.js

@@ -0,0 +1,61 @@
+import { Select, SelectTrigger, SelectValue, SelectContent, SelectGroup, SelectItem } from './chunk-G2WYOCDL.js';
+import { Inline } from './chunk-TILFZBTE.js';
+import { cn } from './chunk-U7N2A7A3.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function CountryOptionLabel({
+  country,
+  showCode = false,
+  className
+}) {
+  const code = country.value ?? country.code ?? "";
+  const text = country.nativeName != null && country.nativeName !== "" ? `${country.name} (${country.nativeName})` : country.name;
+  return /* @__PURE__ */ jsxs(Inline, { gap: "xs", className: cn("items-center", className), children: [
+    country.flagSvgPath != null && country.flagSvgPath !== "" && /* @__PURE__ */ jsx(
+      "img",
+      {
+        src: country.flagSvgPath,
+        alt: "",
+        className: "h-3 w-5 shrink-0 rounded-sm object-cover",
+        "aria-hidden": "true"
+      }
+    ),
+    /* @__PURE__ */ jsxs("span", { className: "truncate", children: [
+      text,
+      showCode && code !== "" && /* @__PURE__ */ jsxs("span", { className: "text-muted-foreground", children: [
+        " \xB7 ",
+        code
+      ] })
+    ] })
+  ] });
+}
+function CountrySelect({
+  id,
+  name,
+  options,
+  defaultValue,
+  required = false,
+  allowEmpty = false,
+  emptyLabel = "\u2014",
+  placeholder,
+  invalid = false
+}) {
+  const emptyValue = "0";
+  const resolvedDefault = defaultValue && defaultValue !== "" ? defaultValue : emptyValue;
+  return /* @__PURE__ */ jsxs(
+    Select,
+    {
+      name,
+      defaultValue: allowEmpty ? resolvedDefault : defaultValue ?? options[0]?.value,
+      children: [
+        /* @__PURE__ */ jsx(SelectTrigger, { id, className: "w-full", "aria-invalid": invalid, "aria-required": required, children: /* @__PURE__ */ jsx(SelectValue, { placeholder }) }),
+        /* @__PURE__ */ jsx(SelectContent, { children: /* @__PURE__ */ jsxs(SelectGroup, { children: [
+          allowEmpty && /* @__PURE__ */ jsx(SelectItem, { value: emptyValue, children: emptyLabel }),
+          options.map((option) => /* @__PURE__ */ jsx(SelectItem, { value: option.value ?? "", children: /* @__PURE__ */ jsx(CountryOptionLabel, { country: option }) }, option.value))
+        ] }) })
+      ]
+    }
+  );
+}
+
+export { CountryOptionLabel, CountrySelect };

package/dist/{chunk-RVY4F7LK.js → chunk-XZM2GNAY.js}

@@ -1,9 +1,9 @@
 import { normalizeTreeOptions, formatPathLabels, getNodeByPath, filterTreeOptions, pathsEqual, pathKey } 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, ScrollBar } 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';
@@ -21,7 +21,7 @@ function Cascader({
   options: optionsProp,
   value,
   defaultValue,
-  onChange,
+  onValueChange,
   multiple,
   changeOnSelect,
   showSearch,
@@ -62,14 +62,14 @@ function Cascader({
   }, [multiple, multiValue, singleValue, options]);
   const commitSingle = (path) => {
     if (!isControlledSingle) setInternalSingle(path);
-    onChange?.(path, getNodeByPath(options, path));
+    onValueChange?.(path, getNodeByPath(options, path));
     setOpen(false);
     setActivePath([]);
     setSearch("");
   };
   const commitMulti = (paths) => {
     if (!isControlledMulti) setInternalMulti(paths);
-    onChange?.(
+    onValueChange?.(
       paths,
       paths.map((p) => getNodeByPath(options, p))
     );

package/dist/{chunk-K27I23OA.js → chunk-Z6HNY2PL.js}

@@ -1,8 +1,8 @@
-import { Slider } from './chunk-CRERCLIZ.js';
 import { formatBytes } from './chunk-4R7QL3MW.js';
-import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from './chunk-2HLWHQJA.js';
-import { controlIconClass } from './chunk-ICM6XBST.js';
-import { Button } from './chunk-HJEBRCXL.js';
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from './chunk-P4HFJQID.js';
+import { Slider } from './chunk-CRERCLIZ.js';
+import { Button } from './chunk-M4PZNAMV.js';
+import { controlIconClass } from './chunk-IBK5D2Q6.js';
 import { useTranslation } from './chunk-RLGHEV4A.js';
 import { cn } from './chunk-U7N2A7A3.js';
 import * as React2 from 'react';
@@ -203,16 +203,16 @@ function fileMatchesAccept(file, accept) {
     return file.type === trimmed || file.name.endsWith(trimmed);
   });
 }
-function useUploadList(controlled, defaultValue, onChange) {
+function useUploadList(controlled, defaultValue, onValueChange) {
   const [internal, setInternal] = React2.useState(defaultValue ?? []);
   const items = controlled ?? internal;
   const setItems = React2.useCallback(
     (next) => {
       const resolved = typeof next === "function" ? next(items) : next;
       if (controlled === void 0) setInternal(resolved);
-      onChange?.(resolved);
+      onValueChange?.(resolved);
     },
-    [controlled, items, onChange]
+    [controlled, items, onValueChange]
   );
   return [items, setItems];
 }
@@ -243,7 +243,7 @@ function Upload({
   variant = "dropzone",
   value,
   defaultValue,
-  onChange,
+  onValueChange,
   accept: acceptProp,
   multiple: multipleProp,
   maxCount: maxCountProp,
@@ -261,7 +261,7 @@ function Upload({
   const inputRef = React2.useRef(null);
   const [dragActive, setDragActive] = React2.useState(false);
   const [cropFile, setCropFile] = React2.useState(null);
-  const [items, setItems] = useUploadList(value, defaultValue, onChange);
+  const [items, setItems] = useUploadList(value, defaultValue, onValueChange);
   const isSingleAvatar = variant === "avatar" || variant === "avatar-crop" || variant === "picture" && maxCount === 1;
   const singleItem = isSingleAvatar ? items[0] ?? null : null;
   const draft = useUploadDraft({