hazo_ui 4.9.0 → 5.1.1

package/dist/index.cjs

@@ -3,9 +3,9 @@
 
 var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
-var React26 = require('react');
+var React27 = require('react');
 var hazo_core = require('hazo_core');
-var client = require('hazo_core/client');
+var client$1 = require('hazo_core/client');
 var jsxRuntime = require('react/jsx-runtime');
 var reactSlot = require('@radix-ui/react-slot');
 var classVarianceAuthority = require('class-variance-authority');
@@ -31,6 +31,7 @@ var IoIcons = require('react-icons/io5');
 var RiIcons = require('react-icons/ri');
 var TbIcons = require('react-icons/tb');
 var CiIcons = require('react-icons/ci');
+var TabsPrimitive = require('@radix-ui/react-tabs');
 var react = require('@tiptap/react');
 var StarterKit = require('@tiptap/starter-kit');
 var extensionTextStyle = require('@tiptap/extension-text-style');
@@ -54,7 +55,6 @@ var TaskItem = require('@tiptap/extension-task-item');
 var lu = require('react-icons/lu');
 var rx = require('react-icons/rx');
 var core = require('@tiptap/core');
-var TabsPrimitive = require('@radix-ui/react-tabs');
 var reactMdEditor = require('@uiw/react-md-editor');
 require('@uiw/react-md-editor/markdown-editor.css');
 require('@uiw/react-markdown-preview/markdown.css');
@@ -76,7 +76,8 @@ var TogglePrimitive = require('@radix-ui/react-toggle');
 var ToggleGroupPrimitive = require('@radix-ui/react-toggle-group');
 var AlertDialogPrimitive = require('@radix-ui/react-alert-dialog');
 var sonner = require('sonner');
-var client$1 = require('hazo_state/client');
+var client$2 = require('hazo_state/client');
+var client = require('hazo_theme/client');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
@@ -98,7 +99,7 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React26__namespace = /*#__PURE__*/_interopNamespace(React26);
+var React27__namespace = /*#__PURE__*/_interopNamespace(React27);
 var DialogPrimitive__namespace = /*#__PURE__*/_interopNamespace(DialogPrimitive);
 var PopoverPrimitive__namespace = /*#__PURE__*/_interopNamespace(PopoverPrimitive);
 var SelectPrimitive__namespace = /*#__PURE__*/_interopNamespace(SelectPrimitive);
@@ -115,6 +116,7 @@ var IoIcons__namespace = /*#__PURE__*/_interopNamespace(IoIcons);
 var RiIcons__namespace = /*#__PURE__*/_interopNamespace(RiIcons);
 var TbIcons__namespace = /*#__PURE__*/_interopNamespace(TbIcons);
 var CiIcons__namespace = /*#__PURE__*/_interopNamespace(CiIcons);
+var TabsPrimitive__namespace = /*#__PURE__*/_interopNamespace(TabsPrimitive);
 var StarterKit__default = /*#__PURE__*/_interopDefault(StarterKit);
 var FontFamily__default = /*#__PURE__*/_interopDefault(FontFamily);
 var Underline__default = /*#__PURE__*/_interopDefault(Underline);
@@ -132,7 +134,6 @@ var TableCell__default = /*#__PURE__*/_interopDefault(TableCell);
 var TableHeader__default = /*#__PURE__*/_interopDefault(TableHeader);
 var TaskList__default = /*#__PURE__*/_interopDefault(TaskList);
 var TaskItem__default = /*#__PURE__*/_interopDefault(TaskItem);
-var TabsPrimitive__namespace = /*#__PURE__*/_interopNamespace(TabsPrimitive);
 var Suggestion__default = /*#__PURE__*/_interopDefault(Suggestion);
 var Cropper__default = /*#__PURE__*/_interopDefault(Cropper);
 var SliderPrimitive__namespace = /*#__PURE__*/_interopNamespace(SliderPrimitive);
@@ -208,21 +209,33 @@ var require_objectWithoutPropertiesLoose = __commonJS({
 function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
+function safeHref(url) {
+  if (!url) return void 0;
+  const trimmed = url.trim();
+  const lower = trimmed.toLowerCase();
+  if (lower.startsWith("http://") || lower.startsWith("https://") || lower.startsWith("mailto:")) {
+    return trimmed;
+  }
+  if (trimmed.startsWith("/") && !trimmed.startsWith("//")) {
+    return trimmed;
+  }
+  return void 0;
+}
 function HazoContextProvider({
   correlationId,
   userId,
   children
 }) {
-  const id = React26__namespace.useMemo(
+  const id = React27__namespace.useMemo(
     () => correlationId ?? hazo_core.generateRequestId(),
     [correlationId]
   );
-  React26__namespace.useEffect(() => {
-    client.withContext({ correlationId: id, userId }, () => {
-      client.setBrowserCorrelationId(id);
+  React27__namespace.useEffect(() => {
+    client$1.withContext({ correlationId: id, userId }, () => {
+      client$1.setBrowserCorrelationId(id);
     });
     return () => {
-      client.setBrowserCorrelationId(void 0);
+      client$1.setBrowserCorrelationId(void 0);
     };
   }, [id, userId]);
   return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
@@ -301,7 +314,7 @@ var buttonVariants = classVarianceAuthority.cva(
     }
   }
 );
-var Button = React26__namespace.forwardRef(
+var Button = React27__namespace.forwardRef(
   ({ className, variant, size, asChild = false, style, ...props }, ref) => {
     const Comp = asChild ? reactSlot.Slot : "button";
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -320,7 +333,7 @@ var Dialog = DialogPrimitive__namespace.Root;
 var DialogTrigger = DialogPrimitive__namespace.Trigger;
 var DialogPortal = DialogPrimitive__namespace.Portal;
 var DialogClose = DialogPrimitive__namespace.Close;
-var DialogOverlay = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DialogOverlay = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   DialogPrimitive__namespace.Overlay,
   {
     ref,
@@ -332,7 +345,7 @@ var DialogOverlay = React26__namespace.forwardRef(({ className, ...props }, ref)
   }
 ));
 DialogOverlay.displayName = DialogPrimitive__namespace.Overlay.displayName;
-var DialogContent = React26__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(DialogPortal, { children: [
+var DialogContent = React27__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(DialogPortal, { children: [
   /* @__PURE__ */ jsxRuntime.jsx(DialogOverlay, {}),
   /* @__PURE__ */ jsxRuntime.jsxs(
     DialogPrimitive__namespace.Content,
@@ -382,7 +395,7 @@ var DialogFooter = ({
   }
 );
 DialogFooter.displayName = "DialogFooter";
-var DialogTitle = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DialogTitle = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   DialogPrimitive__namespace.Title,
   {
     ref,
@@ -395,7 +408,7 @@ var DialogTitle = React26__namespace.forwardRef(({ className, ...props }, ref) =
   }
 ));
 DialogTitle.displayName = DialogPrimitive__namespace.Title.displayName;
-var DialogDescription = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DialogDescription = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   DialogPrimitive__namespace.Description,
   {
     ref,
@@ -404,7 +417,7 @@ var DialogDescription = React26__namespace.forwardRef(({ className, ...props },
   }
 ));
 DialogDescription.displayName = DialogPrimitive__namespace.Description.displayName;
-var Command = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var Command = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
@@ -416,7 +429,7 @@ var Command = React26__namespace.forwardRef(({ className, ...props }, ref) => /*
   }
 ));
 Command.displayName = "Command";
-var CommandInput = React26__namespace.forwardRef(({ className, onValueChange, onChange, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var CommandInput = React27__namespace.forwardRef(({ className, onValueChange, onChange, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "input",
   {
     ref,
@@ -432,7 +445,7 @@ var CommandInput = React26__namespace.forwardRef(({ className, onValueChange, on
   }
 ));
 CommandInput.displayName = "CommandInput";
-var CommandList = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var CommandList = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
@@ -441,7 +454,7 @@ var CommandList = React26__namespace.forwardRef(({ className, ...props }, ref) =
   }
 ));
 CommandList.displayName = "CommandList";
-var CommandEmpty = React26__namespace.forwardRef((props, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var CommandEmpty = React27__namespace.forwardRef((props, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
@@ -450,7 +463,7 @@ var CommandEmpty = React26__namespace.forwardRef((props, ref) => /* @__PURE__ */
   }
 ));
 CommandEmpty.displayName = "CommandEmpty";
-var CommandGroup = React26__namespace.forwardRef(({ className, heading, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+var CommandGroup = React27__namespace.forwardRef(({ className, heading, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
   "div",
   {
     ref,
@@ -466,7 +479,7 @@ var CommandGroup = React26__namespace.forwardRef(({ className, heading, children
   }
 ));
 CommandGroup.displayName = "CommandGroup";
-var CommandItem = React26__namespace.forwardRef(({ className, onSelect, value, selected, style, ...props }, ref) => {
+var CommandItem = React27__namespace.forwardRef(({ className, onSelect, value, selected, style, ...props }, ref) => {
   const handleClick = () => {
     if (onSelect && value) {
       onSelect(value);
@@ -497,7 +510,7 @@ var CommandItem = React26__namespace.forwardRef(({ className, onSelect, value, s
 CommandItem.displayName = "CommandItem";
 var Popover = PopoverPrimitive__namespace.Root;
 var PopoverTrigger = PopoverPrimitive__namespace.Trigger;
-var PopoverContent = React26__namespace.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(PopoverPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
+var PopoverContent = React27__namespace.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(PopoverPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
   PopoverPrimitive__namespace.Content,
   {
     ref,
@@ -511,7 +524,7 @@ var PopoverContent = React26__namespace.forwardRef(({ className, align = "center
   }
 ) }));
 PopoverContent.displayName = PopoverPrimitive__namespace.Content.displayName;
-var Input = React26__namespace.forwardRef(
+var Input = React27__namespace.forwardRef(
   ({ className, type, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "input",
@@ -531,7 +544,7 @@ Input.displayName = "Input";
 var Select = SelectPrimitive__namespace.Root;
 var SelectGroup = SelectPrimitive__namespace.Group;
 var SelectValue = SelectPrimitive__namespace.Value;
-var SelectTrigger = React26__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+var SelectTrigger = React27__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
   SelectPrimitive__namespace.Trigger,
   {
     ref,
@@ -547,7 +560,7 @@ var SelectTrigger = React26__namespace.forwardRef(({ className, children, ...pro
   }
 ));
 SelectTrigger.displayName = SelectPrimitive__namespace.Trigger.displayName;
-var SelectScrollUpButton = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var SelectScrollUpButton = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   SelectPrimitive__namespace.ScrollUpButton,
   {
     ref,
@@ -560,7 +573,7 @@ var SelectScrollUpButton = React26__namespace.forwardRef(({ className, ...props
   }
 ));
 SelectScrollUpButton.displayName = SelectPrimitive__namespace.ScrollUpButton.displayName;
-var SelectScrollDownButton = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var SelectScrollDownButton = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   SelectPrimitive__namespace.ScrollDownButton,
   {
     ref,
@@ -573,7 +586,7 @@ var SelectScrollDownButton = React26__namespace.forwardRef(({ className, ...prop
   }
 ));
 SelectScrollDownButton.displayName = SelectPrimitive__namespace.ScrollDownButton.displayName;
-var SelectContent = React26__namespace.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
+var SelectContent = React27__namespace.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
   SelectPrimitive__namespace.Content,
   {
     ref,
@@ -601,7 +614,7 @@ var SelectContent = React26__namespace.forwardRef(({ className, children, positi
   }
 ) }));
 SelectContent.displayName = SelectPrimitive__namespace.Content.displayName;
-var SelectLabel = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var SelectLabel = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   SelectPrimitive__namespace.Label,
   {
     ref,
@@ -610,7 +623,7 @@ var SelectLabel = React26__namespace.forwardRef(({ className, ...props }, ref) =
   }
 ));
 SelectLabel.displayName = SelectPrimitive__namespace.Label.displayName;
-var SelectItem = React26__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+var SelectItem = React27__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
   SelectPrimitive__namespace.Item,
   {
     ref,
@@ -626,7 +639,7 @@ var SelectItem = React26__namespace.forwardRef(({ className, children, ...props
   }
 ));
 SelectItem.displayName = SelectPrimitive__namespace.Item.displayName;
-var SelectSeparator = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var SelectSeparator = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   SelectPrimitive__namespace.Separator,
   {
     ref,
@@ -638,7 +651,7 @@ SelectSeparator.displayName = SelectPrimitive__namespace.Separator.displayName;
 var TooltipProvider = TooltipPrimitive__namespace.Provider;
 var Tooltip = TooltipPrimitive__namespace.Root;
 var TooltipTrigger = TooltipPrimitive__namespace.Trigger;
-var TooltipContent = React26__namespace.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var TooltipContent = React27__namespace.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   TooltipPrimitive__namespace.Content,
   {
     ref,
@@ -706,7 +719,7 @@ function FilterFieldItem({
   onOperatorChange,
   onDelete
 }) {
-  const [isCalendarOpen, setIsCalendarOpen] = React26.useState(false);
+  const [isCalendarOpen, setIsCalendarOpen] = React27.useState(false);
   const renderInput = () => {
     switch (fieldConfig.type) {
       case "text":
@@ -933,10 +946,10 @@ function HazoUiMultiFilterDialog({
     ...finalHeaderBgColor && { backgroundColor: finalHeaderBgColor },
     ...finalHeaderTextColor && { color: finalHeaderTextColor }
   };
-  const [isOpen, setIsOpen] = React26.useState(false);
-  const [filterFields, setFilterFields] = React26.useState(initialFilters);
-  const [isComboboxOpen, setIsComboboxOpen] = React26.useState(false);
-  React26.useEffect(() => {
+  const [isOpen, setIsOpen] = React27.useState(false);
+  const [filterFields, setFilterFields] = React27.useState(initialFilters);
+  const [isComboboxOpen, setIsComboboxOpen] = React27.useState(false);
+  React27.useEffect(() => {
     if (isOpen) {
       setFilterFields(initialFilters);
     }
@@ -1297,16 +1310,16 @@ function HazoUiMultiSortDialog({
     ...finalHeaderBgColor && { backgroundColor: finalHeaderBgColor },
     ...finalHeaderTextColor && { color: finalHeaderTextColor }
   };
-  const [isOpen, setIsOpen] = React26.useState(false);
-  const [sortFields, setSortFields] = React26.useState(initialSortFields);
-  const [isComboboxOpen, setIsComboboxOpen] = React26.useState(false);
+  const [isOpen, setIsOpen] = React27.useState(false);
+  const [sortFields, setSortFields] = React27.useState(initialSortFields);
+  const [isComboboxOpen, setIsComboboxOpen] = React27.useState(false);
   const sensors = core$1.useSensors(
     core$1.useSensor(core$1.PointerSensor, { activationConstraint: { distance: 4 } }),
     core$1.useSensor(core$1.KeyboardSensor, {
       coordinateGetter: sortable.sortableKeyboardCoordinates
     })
   );
-  React26.useEffect(() => {
+  React27.useEffect(() => {
     if (isOpen) {
       setSortFields(initialSortFields);
     }
@@ -1500,7 +1513,7 @@ function HazoUiMultiSortDialog({
     ] })
   ] });
 }
-var RadioGroup = React26__namespace.forwardRef(({ className, ...props }, ref) => {
+var RadioGroup = React27__namespace.forwardRef(({ className, ...props }, ref) => {
   return /* @__PURE__ */ jsxRuntime.jsx(
     RadioGroupPrimitive__namespace.Root,
     {
@@ -1511,7 +1524,7 @@ var RadioGroup = React26__namespace.forwardRef(({ className, ...props }, ref) =>
   );
 });
 RadioGroup.displayName = RadioGroupPrimitive__namespace.Root.displayName;
-var RadioGroupItem = React26__namespace.forwardRef(({ className, ...props }, ref) => {
+var RadioGroupItem = React27__namespace.forwardRef(({ className, ...props }, ref) => {
   return /* @__PURE__ */ jsxRuntime.jsx(
     RadioGroupPrimitive__namespace.Item,
     {
@@ -1874,6 +1887,368 @@ function HazoUiPillRadio({
     }
   ) });
 }
+var Tabs = TabsPrimitive__namespace.Root;
+var TabsList = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  TabsPrimitive__namespace.List,
+  {
+    ref,
+    className: cn(
+      "inline-flex h-9 items-center justify-center rounded-lg bg-muted p-1 text-muted-foreground",
+      className
+    ),
+    ...props
+  }
+));
+TabsList.displayName = TabsPrimitive__namespace.List.displayName;
+var TabsTrigger = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  TabsPrimitive__namespace.Trigger,
+  {
+    ref,
+    className: cn(
+      "inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow",
+      className
+    ),
+    ...props
+  }
+));
+TabsTrigger.displayName = TabsPrimitive__namespace.Trigger.displayName;
+var TabsContent = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  TabsPrimitive__namespace.Content,
+  {
+    ref,
+    className: cn(
+      "mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+      className
+    ),
+    ...props
+  }
+));
+TabsContent.displayName = TabsPrimitive__namespace.Content.displayName;
+function isLucideValue(value) {
+  return value.startsWith("lucide:");
+}
+function get_lucide_component(name) {
+  return lucideReact.icons[name] || null;
+}
+function HazoUiIcon({ value, size = 18, className }) {
+  if (isLucideValue(value)) {
+    const name = value.slice("lucide:".length);
+    const Cmp = get_lucide_component(name);
+    if (!Cmp) return null;
+    return /* @__PURE__ */ jsxRuntime.jsx(Cmp, { size, className });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("cls_hazo_ui_icon_emoji", className), style: { fontSize: size }, children: value });
+}
+var TOOLS_ICONS = [
+  "Wrench",
+  "Hammer",
+  "Drill",
+  "ToolCase",
+  "PaintRoller",
+  "PaintBucket",
+  "Ruler",
+  "Cog",
+  "Bolt",
+  "Pipette",
+  "Wind",
+  "Plug",
+  "Lightbulb",
+  "Axe",
+  "Shovel"
+];
+var HOME_ICONS = [
+  "House",
+  "DoorOpen",
+  "Bath",
+  "ShowerHead",
+  "Sofa",
+  "Bed",
+  "Refrigerator",
+  "WashingMachine",
+  "Fence",
+  "Key",
+  "Lock",
+  "Warehouse"
+];
+var WEATHER_ICONS = [
+  "Sun",
+  "CloudRain",
+  "Snowflake",
+  "Thermometer",
+  "Wind",
+  "Droplet",
+  "Flame",
+  "CloudSnow",
+  "Zap"
+];
+var NATURE_ICONS = ["Leaf", "TreePine", "Trees", "Flower", "Sprout", "Bug", "Sun", "Droplets"];
+var SYMBOLS_ICONS = [
+  "Star",
+  "Heart",
+  "Check",
+  "Circle",
+  "Square",
+  "Triangle",
+  "Hexagon",
+  "Tag",
+  "Bell",
+  "Settings",
+  "Wrench"
+];
+var LUCIDE_GROUPS = [
+  { key: "tools", label: "Tools", icons: TOOLS_ICONS },
+  { key: "home", label: "Home", icons: HOME_ICONS },
+  { key: "weather", label: "Weather", icons: WEATHER_ICONS },
+  { key: "nature", label: "Nature", icons: NATURE_ICONS },
+  { key: "symbols", label: "Symbols", icons: SYMBOLS_ICONS }
+];
+var EMOJI_ITEMS = [
+  // Faces
+  "\u{1F600}",
+  "\u{1F603}",
+  "\u{1F604}",
+  "\u{1F601}",
+  "\u{1F606}",
+  "\u{1F605}",
+  "\u{1F642}",
+  "\u{1F609}",
+  "\u{1F60A}",
+  "\u{1F60D}",
+  "\u{1F914}",
+  "\u{1F610}",
+  "\u{1F634}",
+  "\u{1F60E}",
+  "\u{1F917}",
+  "\u{1F973}",
+  "\u{1F607}",
+  "\u{1F643}",
+  "\u{1F62C}",
+  "\u{1F929}",
+  // People / hands
+  "\u{1F44D}",
+  "\u{1F44E}",
+  "\u{1F44F}",
+  "\u{1F64C}",
+  "\u{1F91D}",
+  "\u{1F44B}",
+  "\u{1F4AA}",
+  "\u{1F64F}",
+  "\u{1F440}",
+  "\u{1F9D1}\u200D\u{1F527}",
+  // Objects / tools
+  "\u{1F527}",
+  "\u{1F528}",
+  "\u{1F6E0}\uFE0F",
+  "\u2699\uFE0F",
+  "\u{1FA9B}",
+  "\u{1FA9A}",
+  "\u{1F9F0}",
+  "\u{1F529}",
+  "\u26CF\uFE0F",
+  "\u{1F9F1}",
+  "\u{1F511}",
+  "\u{1F512}",
+  "\u{1F50B}",
+  "\u{1F4A1}",
+  "\u{1F50C}",
+  "\u{1F9EF}",
+  "\u{1FA9C}",
+  "\u{1F9F2}",
+  "\u{1F4CF}",
+  "\u{1F4D0}",
+  // Home
+  "\u{1F3E0}",
+  "\u{1F3E1}",
+  "\u{1F3E2}",
+  "\u{1F3ED}",
+  "\u{1F6AA}",
+  "\u{1F6CB}\uFE0F",
+  "\u{1F6C1}",
+  "\u{1F6BF}",
+  "\u{1F6CF}\uFE0F",
+  "\u{1FA9F}",
+  // Weather / nature
+  "\u2600\uFE0F",
+  "\u{1F324}\uFE0F",
+  "\u26C5",
+  "\u{1F327}\uFE0F",
+  "\u26C8\uFE0F",
+  "\u{1F329}\uFE0F",
+  "\u2744\uFE0F",
+  "\u{1F32C}\uFE0F",
+  "\u{1F4A7}",
+  "\u{1F525}",
+  "\u{1F308}",
+  "\u{1F30A}",
+  "\u{1F331}",
+  "\u{1F333}",
+  "\u{1F332}",
+  "\u{1F343}",
+  "\u{1F338}",
+  "\u{1F33B}",
+  "\u{1F342}",
+  "\u{1F335}",
+  // Transport
+  "\u{1F697}",
+  "\u{1F69A}",
+  "\u{1F69B}",
+  "\u{1F69C}",
+  "\u{1F6B2}",
+  "\u2708\uFE0F",
+  "\u{1F680}",
+  "\u26F5",
+  // Symbols
+  "\u2B50",
+  "\u2764\uFE0F",
+  "\u2705",
+  "\u274C",
+  "\u26A0\uFE0F",
+  "\u{1F534}",
+  "\u{1F7E2}",
+  "\u{1F535}",
+  "\u{1F7E1}",
+  "\u2B1B",
+  "\u2B1C",
+  "\u{1F53A}",
+  "\u{1F536}",
+  "\u{1F537}",
+  "\u{1F4AF}",
+  "\u{1F514}",
+  "\u{1F4CC}",
+  "\u{1F4CD}",
+  "\u{1F3F7}\uFE0F",
+  "\u{1F3AF}",
+  // Misc
+  "\u{1F4E6}",
+  "\u{1F4C5}",
+  "\u{1F4C8}",
+  "\u{1F4DD}",
+  "\u{1F4B0}",
+  "\u{1F4B3}",
+  "\u{1F389}",
+  "\u{1F381}",
+  "\u2615",
+  "\u{1F37D}\uFE0F",
+  "\u{1F9FE}",
+  "\u{1F4DE}",
+  "\u2709\uFE0F",
+  "\u{1F310}"
+];
+function HazoUiIconPicker({
+  value,
+  onChange,
+  disabled,
+  className,
+  triggerClassName,
+  align = "start"
+}) {
+  const [open, set_open] = React27__namespace.useState(false);
+  const [search, set_search] = React27__namespace.useState("");
+  const handle_select = React27__namespace.useCallback(
+    (next_value) => {
+      onChange(next_value);
+      set_open(false);
+    },
+    [onChange]
+  );
+  const filtered_search_results = React27__namespace.useMemo(() => {
+    const query = search.trim().toLowerCase();
+    if (!query) return [];
+    return Object.keys(lucideReact.icons).filter((name) => name.toLowerCase().includes(query)).slice(0, 60);
+  }, [search]);
+  const has_search = search.trim().length > 0;
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("cls_hazo_ui_icon_picker", className), children: /* @__PURE__ */ jsxRuntime.jsxs(
+    Popover,
+    {
+      open,
+      onOpenChange: (next_open) => {
+        set_open(next_open);
+        if (!next_open) set_search("");
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            disabled,
+            className: cn(
+              "cls_hazo_ui_icon_picker_trigger",
+              "flex h-9 w-9 items-center justify-center rounded-md border border-input bg-card",
+              "text-foreground transition-colors hover:bg-accent/50",
+              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+              "disabled:cursor-not-allowed disabled:opacity-50",
+              triggerClassName
+            ),
+            children: /* @__PURE__ */ jsxRuntime.jsx(HazoUiIcon, { value })
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntime.jsxs(PopoverContent, { align, className: "w-72 p-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "input",
+            {
+              type: "text",
+              value: search,
+              onChange: (e) => set_search(e.target.value),
+              placeholder: "Search icons...",
+              className: cn(
+                "cls_hazo_ui_icon_picker_search",
+                "mb-2 flex h-9 w-full rounded-md border border-input bg-background px-3 py-1 text-sm",
+                "placeholder:text-muted-foreground",
+                "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
+              )
+            }
+          ),
+          has_search ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cls_hazo_ui_icon_picker_search_results grid max-h-56 grid-cols-8 gap-1 overflow-y-auto", children: [
+            filtered_search_results.map((name) => {
+              const Cmp = lucideReact.icons[name];
+              return /* @__PURE__ */ jsxRuntime.jsx(
+                "button",
+                {
+                  type: "button",
+                  title: name,
+                  onClick: () => handle_select(`lucide:${name}`),
+                  className: "flex h-8 w-8 items-center justify-center rounded-md hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                  children: /* @__PURE__ */ jsxRuntime.jsx(Cmp, { size: 16 })
+                },
+                name
+              );
+            }),
+            filtered_search_results.length === 0 && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "col-span-8 py-4 text-center text-sm text-muted-foreground", children: "No icons found" })
+          ] }) : /* @__PURE__ */ jsxRuntime.jsxs(Tabs, { defaultValue: "emoji", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(TabsList, { className: "grid w-full grid-cols-6", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(TabsTrigger, { value: "emoji", children: "Emoji" }),
+              LUCIDE_GROUPS.map((group) => /* @__PURE__ */ jsxRuntime.jsx(TabsTrigger, { value: group.key, children: group.label }, group.key))
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx(TabsContent, { value: "emoji", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid max-h-56 grid-cols-8 gap-1 overflow-y-auto", children: EMOJI_ITEMS.map((emoji, index) => /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                type: "button",
+                onClick: () => handle_select(emoji),
+                className: "flex h-8 w-8 items-center justify-center rounded-md text-lg hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                children: emoji
+              },
+              `${emoji}-${index}`
+            )) }) }),
+            LUCIDE_GROUPS.map((group) => /* @__PURE__ */ jsxRuntime.jsx(TabsContent, { value: group.key, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid max-h-56 grid-cols-8 gap-1 overflow-y-auto", children: group.icons.map((name) => {
+              const Cmp = lucideReact.icons[name];
+              return /* @__PURE__ */ jsxRuntime.jsx(
+                "button",
+                {
+                  type: "button",
+                  title: name,
+                  onClick: () => handle_select(`lucide:${name}`),
+                  className: "flex h-8 w-8 items-center justify-center rounded-md hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                  children: /* @__PURE__ */ jsxRuntime.jsx(Cmp, { size: 16 })
+                },
+                name
+              );
+            }) }) }, group.key))
+          ] })
+        ] })
+      ]
+    }
+  ) });
+}
 function validateInput(value, input_type, text_len_min, text_len_max, num_min, num_max, regex, num_decimals) {
   if (value === "") {
     return { isValid: true };
@@ -1968,7 +2343,7 @@ function filterInputValue(value, input_type, num_decimals) {
     }
   }
 }
-var HazoUiFlexInput = React26__namespace.forwardRef(
+var HazoUiFlexInput = React27__namespace.forwardRef(
   ({
     className,
     input_type = "mixed",
@@ -1985,13 +2360,13 @@ var HazoUiFlexInput = React26__namespace.forwardRef(
     onBlur,
     ...props
   }, ref) => {
-    const [internalValue, setInternalValue] = React26__namespace.useState(
+    const [internalValue, setInternalValue] = React27__namespace.useState(
       typeof controlledValue === "string" ? controlledValue : typeof controlledValue === "number" ? String(controlledValue) : ""
     );
-    const [errorMessage, setErrorMessage] = React26__namespace.useState();
+    const [errorMessage, setErrorMessage] = React27__namespace.useState();
     const isControlled = controlledValue !== void 0;
     const currentValue = isControlled ? typeof controlledValue === "string" ? controlledValue : String(controlledValue || "") : internalValue;
-    React26__namespace.useEffect(() => {
+    React27__namespace.useEffect(() => {
       if (isControlled) {
         const newValue = typeof controlledValue === "string" ? controlledValue : String(controlledValue || "");
         if (newValue !== internalValue) {
@@ -2071,7 +2446,7 @@ var HazoUiFlexInput = React26__namespace.forwardRef(
   }
 );
 HazoUiFlexInput.displayName = "HazoUiFlexInput";
-var ToolbarButton = React26__namespace.forwardRef(
+var ToolbarButton = React27__namespace.forwardRef(
   ({ onClick, is_active = false, disabled = false, tooltip, className, children }, ref) => {
     const button = /* @__PURE__ */ jsxRuntime.jsx(
       "button",
@@ -2308,11 +2683,11 @@ var validHex = (hex) => /^#?([A-Fa-f0-9]{3,4}){1,2}$/.test(hex);
 var import_extends2 = __toESM(require_extends());
 var import_objectWithoutPropertiesLoose = __toESM(require_objectWithoutPropertiesLoose());
 function useEventCallback(handler) {
-  var callbackRef = React26.useRef(handler);
-  React26.useEffect(() => {
+  var callbackRef = React27.useRef(handler);
+  React27.useEffect(() => {
     callbackRef.current = handler;
   });
-  return React26.useCallback((value, event) => callbackRef.current && callbackRef.current(value, event), []);
+  return React27.useCallback((value, event) => callbackRef.current && callbackRef.current(value, event), []);
 }
 var isTouch = (event) => "touches" in event;
 var preventDefaultMove = (event) => {
@@ -2340,11 +2715,11 @@ var getRelativePosition = (node, event) => {
   };
 };
 var _excluded = ["prefixCls", "className", "onMove", "onDown"];
-var Interactive = /* @__PURE__ */ React26__namespace.default.forwardRef((props, ref) => {
+var Interactive = /* @__PURE__ */ React27__namespace.default.forwardRef((props, ref) => {
   var _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? "w-color-interactive" : _props$prefixCls, className = props.className, onMove = props.onMove, onDown = props.onDown, reset = (0, import_objectWithoutPropertiesLoose.default)(props, _excluded);
-  var container = React26.useRef(null);
-  var hasTouched = React26.useRef(false);
-  var _useState = React26.useState(false), isDragging = _useState[0], setDragging = _useState[1];
+  var container = React27.useRef(null);
+  var hasTouched = React27.useRef(false);
+  var _useState = React27.useState(false), isDragging = _useState[0], setDragging = _useState[1];
   var onMoveCallback = useEventCallback(onMove);
   var onKeyCallback = useEventCallback(onDown);
   var isValid = (event) => {
@@ -2352,7 +2727,7 @@ var Interactive = /* @__PURE__ */ React26__namespace.default.forwardRef((props,
     hasTouched.current = isTouch(event);
     return true;
   };
-  var handleMove = React26.useCallback((event) => {
+  var handleMove = React27.useCallback((event) => {
     preventDefaultMove(event);
     if (!container.current) return;
     var isDown = isTouch(event) ? event.touches.length > 0 : event.buttons > 0;
@@ -2362,8 +2737,8 @@ var Interactive = /* @__PURE__ */ React26__namespace.default.forwardRef((props,
     }
     onMoveCallback == null || onMoveCallback(getRelativePosition(container.current, event), event);
   }, [onMoveCallback]);
-  var handleMoveEnd = React26.useCallback(() => setDragging(false), []);
-  var toggleDocumentEvents = React26.useCallback((state) => {
+  var handleMoveEnd = React27.useCallback(() => setDragging(false), []);
+  var toggleDocumentEvents = React27.useCallback((state) => {
     if (state) {
       window.addEventListener(hasTouched.current ? "touchmove" : "mousemove", handleMove);
       window.addEventListener(hasTouched.current ? "touchend" : "mouseup", handleMoveEnd);
@@ -2374,13 +2749,13 @@ var Interactive = /* @__PURE__ */ React26__namespace.default.forwardRef((props,
       window.removeEventListener("touchend", handleMoveEnd);
     }
   }, [handleMove, handleMoveEnd]);
-  React26.useEffect(() => {
+  React27.useEffect(() => {
     toggleDocumentEvents(isDragging);
     return () => {
       toggleDocumentEvents(false);
     };
   }, [isDragging, handleMove, handleMoveEnd, toggleDocumentEvents]);
-  var handleMoveStart = React26.useCallback((event) => {
+  var handleMoveStart = React27.useCallback((event) => {
     var activeEl = document.activeElement;
     activeEl == null || activeEl.blur();
     preventDefaultMove(event.nativeEvent);
@@ -2418,7 +2793,7 @@ var Pointer = (_ref) => {
     borderRadius: "50%",
     backgroundColor: color2
   };
-  return React26.useMemo(() => /* @__PURE__ */ jsxRuntime.jsx("div", {
+  return React27.useMemo(() => /* @__PURE__ */ jsxRuntime.jsx("div", {
     className: prefixCls + "-pointer " + (className || ""),
     style,
     children: /* @__PURE__ */ jsxRuntime.jsx("div", {
@@ -2428,7 +2803,7 @@ var Pointer = (_ref) => {
   }), [top, left, color2, className, prefixCls]);
 };
 var _excluded2 = ["prefixCls", "radius", "pointer", "className", "hue", "style", "hsva", "onChange"];
-var Saturation = /* @__PURE__ */ React26__namespace.default.forwardRef((props, ref) => {
+var Saturation = /* @__PURE__ */ React27__namespace.default.forwardRef((props, ref) => {
   var _hsva$h;
   var _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? "w-color-saturation" : _props$prefixCls, _props$radius = props.radius, radius = _props$radius === void 0 ? 0 : _props$radius, pointer = props.pointer, className = props.className, _props$hue = props.hue, hue = _props$hue === void 0 ? 0 : _props$hue, style = props.style, hsva = props.hsva, onChange = props.onChange, other = (0, import_objectWithoutPropertiesLoose2.default)(props, _excluded2);
   var containerStyle = (0, import_extends3.default)({
@@ -2438,8 +2813,8 @@ var Saturation = /* @__PURE__ */ React26__namespace.default.forwardRef((props, r
   }, style, {
     position: "relative"
   });
-  var containerRef = React26.useRef(null);
-  var combinedRef = React26.useCallback((node) => {
+  var containerRef = React27.useRef(null);
+  var combinedRef = React27.useCallback((node) => {
     containerRef.current = node;
     if (typeof ref === "function") {
       ref(node);
@@ -2447,7 +2822,7 @@ var Saturation = /* @__PURE__ */ React26__namespace.default.forwardRef((props, r
       ref.current = node;
     }
   }, [ref]);
-  var handleChange = React26.useCallback((interaction, event) => {
+  var handleChange = React27.useCallback((interaction, event) => {
     onChange && hsva && onChange({
       h: hsva.h,
       s: interaction.left * 100,
@@ -2460,7 +2835,7 @@ var Saturation = /* @__PURE__ */ React26__namespace.default.forwardRef((props, r
       element.focus();
     }
   }, [hsva, onChange]);
-  var handleKeyDown = React26.useCallback((event) => {
+  var handleKeyDown = React27.useCallback((event) => {
     if (!hsva || !onChange) return;
     var step = 1;
     var newS = hsva.s;
@@ -2499,7 +2874,7 @@ var Saturation = /* @__PURE__ */ React26__namespace.default.forwardRef((props, r
       });
     }
   }, [hsva, onChange]);
-  var pointerElement = React26.useMemo(() => {
+  var pointerElement = React27.useMemo(() => {
     if (!hsva) return null;
     var comProps = {
       top: 100 - hsva.v + "%",
@@ -2515,7 +2890,7 @@ var Saturation = /* @__PURE__ */ React26__namespace.default.forwardRef((props, r
       prefixCls
     }, comProps));
   }, [hsva, pointer, prefixCls]);
-  var handleClick = React26.useCallback((event) => {
+  var handleClick = React27.useCallback((event) => {
     event.target.focus();
   }, []);
   return /* @__PURE__ */ jsxRuntime.jsx(esm_default, (0, import_extends3.default)({
@@ -2577,16 +2952,16 @@ var Pointer2 = (_ref) => {
 };
 var _excluded4 = ["prefixCls", "className", "hsva", "background", "bgProps", "innerProps", "pointerProps", "radius", "width", "height", "direction", "reverse", "style", "onChange", "pointer"];
 var BACKGROUND_IMG = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAMUlEQVQ4T2NkYGAQYcAP3uCTZhw1gGGYhAGBZIA/nYDCgBDAm9BGDWAAJyRCgLaBCAAgXwixzAS0pgAAAABJRU5ErkJggg==";
-var Alpha = /* @__PURE__ */ React26__namespace.default.forwardRef((props, ref) => {
+var Alpha = /* @__PURE__ */ React27__namespace.default.forwardRef((props, ref) => {
   var _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? "w-color-alpha" : _props$prefixCls, className = props.className, hsva = props.hsva, background = props.background, _props$bgProps = props.bgProps, bgProps = _props$bgProps === void 0 ? {} : _props$bgProps, _props$innerProps = props.innerProps, innerProps = _props$innerProps === void 0 ? {} : _props$innerProps, _props$pointerProps = props.pointerProps, pointerProps = _props$pointerProps === void 0 ? {} : _props$pointerProps, _props$radius = props.radius, radius = _props$radius === void 0 ? 0 : _props$radius, width = props.width, _props$height = props.height, height = _props$height === void 0 ? 16 : _props$height, _props$direction = props.direction, direction = _props$direction === void 0 ? "horizontal" : _props$direction, _props$reverse = props.reverse, reverse = _props$reverse === void 0 ? false : _props$reverse, style = props.style, onChange = props.onChange, pointer = props.pointer, other = (0, import_objectWithoutPropertiesLoose4.default)(props, _excluded4);
-  var offsetToAlpha = React26.useCallback((offset) => {
+  var offsetToAlpha = React27.useCallback((offset) => {
     var value = direction === "horizontal" ? offset.left : offset.top;
     if (direction === "horizontal") {
       return reverse ? 1 - value : value;
     }
     return reverse ? value : 1 - value;
   }, [direction, reverse]);
-  var alphaToOffset = React26.useCallback((alpha) => {
+  var alphaToOffset = React27.useCallback((alpha) => {
     if (direction === "horizontal") {
       return reverse ? 1 - alpha : alpha;
     }
@@ -2623,7 +2998,7 @@ var Alpha = /* @__PURE__ */ React26__namespace.default.forwardRef((props, ref) =
   }, style, {
     position: "relative"
   });
-  var handleKeyDown = React26.useCallback((event) => {
+  var handleKeyDown = React27.useCallback((event) => {
     var step = 0.01;
     var currentAlpha = hsva.a;
     var newAlpha = currentAlpha;
@@ -2670,7 +3045,7 @@ var Alpha = /* @__PURE__ */ React26__namespace.default.forwardRef((props, ref) =
       }), syntheticOffset);
     }
   }, [alphaToOffset, hsva, direction, onChange, reverse]);
-  var handleClick = React26.useCallback((event) => {
+  var handleClick = React27.useCallback((event) => {
     event.target.focus();
   }, []);
   var pointerElement = pointer && typeof pointer === "function" ? pointer((0, import_extends5.default)({
@@ -2713,13 +3088,13 @@ var import_objectWithoutPropertiesLoose5 = __toESM(require_objectWithoutProperti
 var _excluded5 = ["prefixCls", "placement", "label", "value", "className", "style", "labelStyle", "inputStyle", "onChange", "onBlur", "renderInput"];
 var validHex2 = (hex) => /^#?([A-Fa-f0-9]{3,4}){1,2}$/.test(hex);
 var getNumberValue = (value) => Number(String(value).replace(/%/g, ""));
-var EditableInput = /* @__PURE__ */ React26__namespace.default.forwardRef((props, ref) => {
+var EditableInput = /* @__PURE__ */ React27__namespace.default.forwardRef((props, ref) => {
   var _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? "w-color-editable-input" : _props$prefixCls, _props$placement = props.placement, placement = _props$placement === void 0 ? "bottom" : _props$placement, label = props.label, initValue = props.value, className = props.className, style = props.style, labelStyle = props.labelStyle, inputStyle = props.inputStyle, onChange = props.onChange, onBlur = props.onBlur, renderInput = props.renderInput, other = (0, import_objectWithoutPropertiesLoose5.default)(props, _excluded5);
-  var _useState = React26.useState(initValue), value = _useState[0], setValue = _useState[1];
-  var isFocus = React26.useRef(false);
-  var inputIdRef = React26.useRef(other.id || prefixCls + "-" + Math.random().toString(36).slice(2, 11));
+  var _useState = React27.useState(initValue), value = _useState[0], setValue = _useState[1];
+  var isFocus = React27.useRef(false);
+  var inputIdRef = React27.useRef(other.id || prefixCls + "-" + Math.random().toString(36).slice(2, 11));
   var inputId = other.id || inputIdRef.current;
-  React26.useEffect(() => {
+  React27.useEffect(() => {
     if (props.value !== value) {
       if (!isFocus.current) {
         setValue(props.value);
@@ -2810,7 +3185,7 @@ var esm_default4 = EditableInput;
 var import_extends7 = __toESM(require_extends());
 var import_objectWithoutPropertiesLoose6 = __toESM(require_objectWithoutPropertiesLoose());
 var _excluded6 = ["prefixCls", "hsva", "placement", "rProps", "gProps", "bProps", "aProps", "className", "style", "onChange"];
-var EditableInputRGBA = /* @__PURE__ */ React26__namespace.default.forwardRef((props, ref) => {
+var EditableInputRGBA = /* @__PURE__ */ React27__namespace.default.forwardRef((props, ref) => {
   var _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? "w-color-editable-input-rgba" : _props$prefixCls, hsva = props.hsva, _props$placement = props.placement, placement = _props$placement === void 0 ? "bottom" : _props$placement, _props$rProps = props.rProps, rProps = _props$rProps === void 0 ? {} : _props$rProps, _props$gProps = props.gProps, gProps = _props$gProps === void 0 ? {} : _props$gProps, _props$bProps = props.bProps, bProps = _props$bProps === void 0 ? {} : _props$bProps, _props$aProps = props.aProps, aProps = _props$aProps === void 0 ? {} : _props$aProps, className = props.className, style = props.style, onChange = props.onChange, other = (0, import_objectWithoutPropertiesLoose6.default)(props, _excluded6);
   var rgba = hsva ? hsvaToRgba(hsva) : {};
   function handleBlur(evn) {
@@ -2924,9 +3299,9 @@ var import_objectWithoutPropertiesLoose7 = __toESM(require_objectWithoutProperti
 var _excluded7 = ["prefixCls", "className", "hue", "onChange", "direction", "reverse"];
 var NORMAL_COLORS = "rgb(255, 0, 0) 0%, rgb(255, 255, 0) 17%, rgb(0, 255, 0) 33%, rgb(0, 255, 255) 50%, rgb(0, 0, 255) 67%, rgb(255, 0, 255) 83%, rgb(255, 0, 0) 100%";
 var REVERSED_COLORS = "rgb(255, 0, 0) 0%, rgb(255, 0, 255) 17%, rgb(0, 0, 255) 33%, rgb(0, 255, 255) 50%, rgb(0, 255, 0) 67%, rgb(255, 255, 0) 83%, rgb(255, 0, 0) 100%";
-var Hue = /* @__PURE__ */ React26__namespace.default.forwardRef((props, ref) => {
+var Hue = /* @__PURE__ */ React27__namespace.default.forwardRef((props, ref) => {
   var _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? "w-color-hue" : _props$prefixCls, className = props.className, _props$hue = props.hue, hue = _props$hue === void 0 ? 0 : _props$hue, _onChange = props.onChange, _props$direction = props.direction, direction = _props$direction === void 0 ? "horizontal" : _props$direction, _props$reverse = props.reverse, reverse = _props$reverse === void 0 ? false : _props$reverse, other = (0, import_objectWithoutPropertiesLoose7.default)(props, _excluded7);
-  var getGradientBackground = React26.useCallback(() => {
+  var getGradientBackground = React27.useCallback(() => {
     if (direction === "horizontal") {
       var colors = reverse ? REVERSED_COLORS : NORMAL_COLORS;
       var gradientDirection = "right";
@@ -2937,7 +3312,7 @@ var Hue = /* @__PURE__ */ React26__namespace.default.forwardRef((props, ref) =>
       return "linear-gradient(to " + _gradientDirection + ", " + _colors + ")";
     }
   }, [direction, reverse]);
-  var getHueFromInteraction = React26.useCallback((interaction) => {
+  var getHueFromInteraction = React27.useCallback((interaction) => {
     var value = direction === "horizontal" ? interaction.left : interaction.top;
     var normalizedValue;
     if (direction === "horizontal") {
@@ -2947,7 +3322,7 @@ var Hue = /* @__PURE__ */ React26__namespace.default.forwardRef((props, ref) =>
     }
     return 360 * normalizedValue;
   }, [direction, reverse]);
-  var gradientBackground = React26.useMemo(() => getGradientBackground(), [getGradientBackground]);
+  var gradientBackground = React27.useMemo(() => getGradientBackground(), [getGradientBackground]);
   return /* @__PURE__ */ jsxRuntime.jsx(esm_default3, (0, import_extends8.default)({
     ref,
     className: prefixCls + " " + (className || "")
@@ -2975,7 +3350,7 @@ var esm_default6 = Hue;
 var import_extends9 = __toESM(require_extends());
 var import_objectWithoutPropertiesLoose8 = __toESM(require_objectWithoutPropertiesLoose());
 var _excluded8 = ["prefixCls", "className", "color", "colors", "style", "rectProps", "onChange", "addonAfter", "addonBefore", "rectRender"];
-var Swatch = /* @__PURE__ */ React26__namespace.default.forwardRef((props, ref) => {
+var Swatch = /* @__PURE__ */ React27__namespace.default.forwardRef((props, ref) => {
   var _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? "w-color-swatch" : _props$prefixCls, className = props.className, color2 = props.color, _props$colors = props.colors, colors = _props$colors === void 0 ? [] : _props$colors, style = props.style, _props$rectProps = props.rectProps, rectProps = _props$rectProps === void 0 ? {} : _props$rectProps, onChange = props.onChange, addonAfter = props.addonAfter, addonBefore = props.addonBefore, rectRender = props.rectRender, other = (0, import_objectWithoutPropertiesLoose8.default)(props, _excluded8);
   var rectStyle = (0, import_extends9.default)({
     "--swatch-background-color": "rgb(144, 19, 254)",
@@ -3001,7 +3376,7 @@ var Swatch = /* @__PURE__ */ React26__namespace.default.forwardRef((props, ref)
       flexWrap: "wrap",
       position: "relative"
     }, style),
-    children: [addonBefore && /* @__PURE__ */ React26__namespace.default.isValidElement(addonBefore) && addonBefore, colors && Array.isArray(colors) && colors.map((item, idx) => {
+    children: [addonBefore && /* @__PURE__ */ React27__namespace.default.isValidElement(addonBefore) && addonBefore, colors && Array.isArray(colors) && colors.map((item, idx) => {
       var title = "";
       var background = "";
       if (typeof item === "string") {
@@ -3023,11 +3398,11 @@ var Swatch = /* @__PURE__ */ React26__namespace.default.forwardRef((props, ref)
         onClick: (evn) => handleClick(background, evn)
       });
       if (render) {
-        return /* @__PURE__ */ jsxRuntime.jsx(React26.Fragment, {
+        return /* @__PURE__ */ jsxRuntime.jsx(React27.Fragment, {
           children: render
         }, idx);
       }
-      var child = rectProps.children && /* @__PURE__ */ React26__namespace.default.isValidElement(rectProps.children) ? /* @__PURE__ */ React26__namespace.default.cloneElement(rectProps.children, {
+      var child = rectProps.children && /* @__PURE__ */ React27__namespace.default.isValidElement(rectProps.children) ? /* @__PURE__ */ React27__namespace.default.cloneElement(rectProps.children, {
         color: background,
         checked
       }) : null;
@@ -3041,7 +3416,7 @@ var Swatch = /* @__PURE__ */ React26__namespace.default.forwardRef((props, ref)
           background
         })
       }), idx);
-    }), addonAfter && /* @__PURE__ */ React26__namespace.default.isValidElement(addonAfter) && addonAfter]
+    }), addonAfter && /* @__PURE__ */ React27__namespace.default.isValidElement(addonAfter) && addonAfter]
   }));
 });
 Swatch.displayName = "Swatch";
@@ -3060,15 +3435,15 @@ var Bar = (props) => /* @__PURE__ */ jsxRuntime.jsx("div", {
     backgroundColor: "#fff"
   }
 });
-var Sketch = /* @__PURE__ */ React26__namespace.default.forwardRef((props, ref) => {
+var Sketch = /* @__PURE__ */ React27__namespace.default.forwardRef((props, ref) => {
   var _props$prefixCls = props.prefixCls, prefixCls = _props$prefixCls === void 0 ? "w-color-sketch" : _props$prefixCls, className = props.className, onChange = props.onChange, _props$width = props.width, width = _props$width === void 0 ? 218 : _props$width, _props$presetColors = props.presetColors, presetColors = _props$presetColors === void 0 ? PRESET_COLORS : _props$presetColors, color2 = props.color, _props$editableDisabl = props.editableDisable, editableDisable = _props$editableDisabl === void 0 ? true : _props$editableDisabl, _props$disableAlpha = props.disableAlpha, disableAlpha = _props$disableAlpha === void 0 ? false : _props$disableAlpha, style = props.style, other = (0, import_objectWithoutPropertiesLoose9.default)(props, _excluded9);
-  var _useState = React26.useState({
+  var _useState = React27.useState({
     h: 209,
     s: 36,
     v: 90,
     a: 1
   }), hsva = _useState[0], setHsva = _useState[1];
-  React26.useEffect(() => {
+  React27.useEffect(() => {
     if (typeof color2 === "string" && validHex(color2)) {
       setHsva(hexToHsva(color2));
     }
@@ -3186,7 +3561,7 @@ var Sketch = /* @__PURE__ */ React26__namespace.default.forwardRef((props, ref)
           innerProps: {
             style: styleAlpha
           },
-          pointer: () => /* @__PURE__ */ jsxRuntime.jsx(React26.Fragment, {})
+          pointer: () => /* @__PURE__ */ jsxRuntime.jsx(React27.Fragment, {})
         })]
       })]
     }), editableDisable && /* @__PURE__ */ jsxRuntime.jsxs("div", {
@@ -3329,19 +3704,19 @@ var Toolbar = ({
   toolbar,
   font_families
 }) => {
-  const [link_url, set_link_url] = React26__namespace.useState("https://");
-  const [link_popover_open, set_link_popover_open] = React26__namespace.useState(false);
-  const [text_color_open, set_text_color_open] = React26__namespace.useState(false);
-  const [highlight_color_open, set_highlight_color_open] = React26__namespace.useState(false);
-  const [variables_menu_open, set_variables_menu_open] = React26__namespace.useState(false);
-  const [table_menu_open, set_table_menu_open] = React26__namespace.useState(false);
-  const [text_color, set_text_color] = React26__namespace.useState("#000000");
-  const [highlight_color, set_highlight_color] = React26__namespace.useState("#ffff00");
-  const [table_rows, set_table_rows] = React26__namespace.useState(3);
-  const [table_cols, set_table_cols] = React26__namespace.useState(3);
-  const [hovered_cell, set_hovered_cell] = React26__namespace.useState(null);
-  const file_input_ref = React26__namespace.useRef(null);
-  const image_input_ref = React26__namespace.useRef(null);
+  const [link_url, set_link_url] = React27__namespace.useState("https://");
+  const [link_popover_open, set_link_popover_open] = React27__namespace.useState(false);
+  const [text_color_open, set_text_color_open] = React27__namespace.useState(false);
+  const [highlight_color_open, set_highlight_color_open] = React27__namespace.useState(false);
+  const [variables_menu_open, set_variables_menu_open] = React27__namespace.useState(false);
+  const [table_menu_open, set_table_menu_open] = React27__namespace.useState(false);
+  const [text_color, set_text_color] = React27__namespace.useState("#000000");
+  const [highlight_color, set_highlight_color] = React27__namespace.useState("#ffff00");
+  const [table_rows, set_table_rows] = React27__namespace.useState(3);
+  const [table_cols, set_table_cols] = React27__namespace.useState(3);
+  const [hovered_cell, set_hovered_cell] = React27__namespace.useState(null);
+  const file_input_ref = React27__namespace.useRef(null);
+  const image_input_ref = React27__namespace.useRef(null);
   if (!editor) {
     return null;
   }
@@ -4155,7 +4530,7 @@ var Toolbar = ({
         disabled && "opacity-50 pointer-events-none"
       ),
       children: [
-        sections.map((items, i) => /* @__PURE__ */ jsxRuntime.jsxs(React26__namespace.Fragment, { children: [
+        sections.map((items, i) => /* @__PURE__ */ jsxRuntime.jsxs(React27__namespace.Fragment, { children: [
           i > 0 && /* @__PURE__ */ jsxRuntime.jsx(ToolbarSeparator, {}),
           items
         ] }, i)),
@@ -4407,43 +4782,6 @@ var VariableExtension = core.Node.create({
     };
   }
 });
-var Tabs = TabsPrimitive__namespace.Root;
-var TabsList = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
-  TabsPrimitive__namespace.List,
-  {
-    ref,
-    className: cn(
-      "inline-flex h-9 items-center justify-center rounded-lg bg-muted p-1 text-muted-foreground",
-      className
-    ),
-    ...props
-  }
-));
-TabsList.displayName = TabsPrimitive__namespace.List.displayName;
-var TabsTrigger = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
-  TabsPrimitive__namespace.Trigger,
-  {
-    ref,
-    className: cn(
-      "inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow",
-      className
-    ),
-    ...props
-  }
-));
-TabsTrigger.displayName = TabsPrimitive__namespace.Trigger.displayName;
-var TabsContent = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
-  TabsPrimitive__namespace.Content,
-  {
-    ref,
-    className: cn(
-      "mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
-      className
-    ),
-    ...props
-  }
-));
-TabsContent.displayName = TabsPrimitive__namespace.Content.displayName;
 function debounce_fn(func, wait) {
   let timeout_id = null;
   return (output) => {
@@ -4469,14 +4807,14 @@ var HazoUiRte = ({
   toolbar,
   font_families
 }) => {
-  const [attachments, set_attachments] = React26__namespace.useState(
+  const [attachments, set_attachments] = React27__namespace.useState(
     initial_attachments
   );
-  const [active_tab, set_active_tab] = React26__namespace.useState("html");
+  const [active_tab, set_active_tab] = React27__namespace.useState("html");
   const is_view_only = active_tab !== "html";
-  const attachments_ref = React26__namespace.useRef(attachments);
+  const attachments_ref = React27__namespace.useRef(attachments);
   attachments_ref.current = attachments;
-  const debounced_on_change = React26__namespace.useMemo(
+  const debounced_on_change = React27__namespace.useMemo(
     () => debounce_fn((output) => {
       if (on_change) {
         on_change(output);
@@ -4575,7 +4913,7 @@ var HazoUiRte = ({
       debounced_on_change(output);
     }
   });
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (editor && html !== void 0) {
       const current_html = editor.getHTML();
       if (html !== current_html && !editor.isFocused) {
@@ -4583,21 +4921,21 @@ var HazoUiRte = ({
       }
     }
   }, [html, editor]);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (editor) {
       editor.setEditable(!disabled);
     }
   }, [disabled, editor]);
-  const attachments_from_props_ref = React26__namespace.useRef(false);
-  const prev_initial_attachments_ref = React26__namespace.useRef(initial_attachments);
-  React26__namespace.useEffect(() => {
+  const attachments_from_props_ref = React27__namespace.useRef(false);
+  const prev_initial_attachments_ref = React27__namespace.useRef(initial_attachments);
+  React27__namespace.useEffect(() => {
     if (JSON.stringify(initial_attachments) !== JSON.stringify(prev_initial_attachments_ref.current)) {
       prev_initial_attachments_ref.current = initial_attachments;
       attachments_from_props_ref.current = true;
       set_attachments(initial_attachments);
     }
   }, [initial_attachments]);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (attachments_from_props_ref.current) {
       attachments_from_props_ref.current = false;
       return;
@@ -4843,7 +5181,7 @@ function CanvasTextToolbar({
     }
   ) });
 }
-var MdEditorLazy = React26.lazy(() => import('@uiw/react-md-editor'));
+var MdEditorLazy = React27.lazy(() => import('@uiw/react-md-editor'));
 var EDITOR_TEXTAREA_SELECTOR = ".w-md-editor-text-input";
 function MarkdownEditor({
   value,
@@ -4859,13 +5197,13 @@ function MarkdownEditor({
   renderPreview,
   showPreview = true
 }) {
-  const [mounted, setMounted] = React26.useState(false);
-  React26.useEffect(() => setMounted(true), []);
-  const valueRef = React26.useRef(value);
+  const [mounted, setMounted] = React27.useState(false);
+  React27.useEffect(() => setMounted(true), []);
+  const valueRef = React27.useRef(value);
   valueRef.current = value;
-  const wrapperRef = React26.useRef(null);
-  const [uploading, setUploading] = React26.useState(false);
-  const [error, setError] = React26.useState("");
+  const wrapperRef = React27.useRef(null);
+  const [uploading, setUploading] = React27.useState(false);
+  const [error, setError] = React27.useState("");
   function insertAtCursor(text) {
     const textarea = wrapperRef.current?.querySelector(
       EDITOR_TEXTAREA_SELECTOR
@@ -4880,7 +5218,7 @@ function MarkdownEditor({
     const end = textarea.selectionEnd ?? start;
     onChange(current.slice(0, start) + text + current.slice(end));
   }
-  const embedCommands = React26.useMemo(() => {
+  const embedCommands = React27.useMemo(() => {
     return (embeds ?? []).map((embed) => ({
       name: embed.name,
       keyCommand: embed.name,
@@ -4899,7 +5237,7 @@ function MarkdownEditor({
       }
     }));
   }, [embeds]);
-  const editorCommands = React26.useMemo(() => {
+  const editorCommands = React27.useMemo(() => {
     const defaults = reactMdEditor.commands.getCommands();
     const extras = [...embedCommands, ...extraCommands ?? []];
     if (extras.length === 0) return defaults;
@@ -4955,7 +5293,7 @@ function MarkdownEditor({
         ref: wrapperRef,
         children: [
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: useCustomPreview && showPreview ? "flex-1 min-w-0" : "w-full", children: mounted ? /* @__PURE__ */ jsxRuntime.jsx(
-            React26.Suspense,
+            React27.Suspense,
             {
               fallback: /* @__PURE__ */ jsxRuntime.jsx(
                 "div",
@@ -5410,12 +5748,12 @@ var CommandPopover = ({
   on_selection_change: _on_selection_change,
   prefix_color
 }) => {
-  const container_ref = React26__namespace.useRef(null);
-  const grouped_commands = React26__namespace.useMemo(
+  const container_ref = React27__namespace.useRef(null);
+  const grouped_commands = React27__namespace.useMemo(
     () => group_commands(commands),
     [commands]
   );
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     const handle_click_outside = (e) => {
       if (container_ref.current && !container_ref.current.contains(e.target)) {
         on_close();
@@ -5428,8 +5766,8 @@ var CommandPopover = ({
       };
     }
   }, [is_open, on_close]);
-  const [mounted, set_mounted] = React26__namespace.useState(false);
-  React26__namespace.useEffect(() => {
+  const [mounted, set_mounted] = React27__namespace.useState(false);
+  React27__namespace.useEffect(() => {
     set_mounted(true);
   }, []);
   if (!is_open || !mounted) return null;
@@ -5739,21 +6077,21 @@ var HazoUiTextbox = ({
   on_command_change,
   on_command_remove
 }) => {
-  const generated_instance_id = React26__namespace.useId();
+  const generated_instance_id = React27__namespace.useId();
   const instance_id = provided_instance_id || generated_instance_id;
-  const [suggestion_state, set_suggestion_state] = React26__namespace.useState(null);
-  const [selected_index, set_selected_index] = React26__namespace.useState(0);
-  const [popover_position, set_popover_position] = React26__namespace.useState({ top: 0, left: 0 });
-  const [edit_context, set_edit_context] = React26__namespace.useState(null);
-  const [edit_selected_index, set_edit_selected_index] = React26__namespace.useState(0);
+  const [suggestion_state, set_suggestion_state] = React27__namespace.useState(null);
+  const [selected_index, set_selected_index] = React27__namespace.useState(0);
+  const [popover_position, set_popover_position] = React27__namespace.useState({ top: 0, left: 0 });
+  const [edit_context, set_edit_context] = React27__namespace.useState(null);
+  const [edit_selected_index, set_edit_selected_index] = React27__namespace.useState(0);
   const is_controlled = value !== void 0;
-  const editor_container_ref = React26__namespace.useRef(null);
-  const edit_popover_ref = React26__namespace.useRef(null);
-  const [mounted, set_mounted] = React26__namespace.useState(false);
-  React26__namespace.useEffect(() => {
+  const editor_container_ref = React27__namespace.useRef(null);
+  const edit_popover_ref = React27__namespace.useRef(null);
+  const [mounted, set_mounted] = React27__namespace.useState(false);
+  React27__namespace.useEffect(() => {
     set_mounted(true);
   }, []);
-  const suggestion_extensions = React26__namespace.useMemo(() => {
+  const suggestion_extensions = React27__namespace.useMemo(() => {
     return create_command_suggestion_extension({
       prefixes,
       instance_id,
@@ -5804,7 +6142,7 @@ var HazoUiTextbox = ({
       }
     }
   });
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (suggestion_state?.is_active && editor) {
       requestAnimationFrame(() => {
         const { from } = suggestion_state.range;
@@ -5828,7 +6166,7 @@ var HazoUiTextbox = ({
       });
     }
   }, [suggestion_state, editor]);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (is_controlled && editor && !editor.isFocused) {
       const current_text = editor.getText();
       if (value !== current_text) {
@@ -5837,12 +6175,12 @@ var HazoUiTextbox = ({
       }
     }
   }, [value, editor, is_controlled, prefixes, pill_variant]);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (editor) {
       editor.setEditable(!disabled);
     }
   }, [disabled, editor]);
-  const handle_command_select = React26__namespace.useCallback(
+  const handle_command_select = React27__namespace.useCallback(
     (command) => {
       if (!editor || !suggestion_state) return;
       const prefix_config = prefixes.find((p) => p.char === suggestion_state.prefix);
@@ -5862,15 +6200,15 @@ var HazoUiTextbox = ({
     },
     [editor, suggestion_state, pill_variant, on_command_insert, prefixes]
   );
-  const handle_popover_close = React26__namespace.useCallback(() => {
+  const handle_popover_close = React27__namespace.useCallback(() => {
     set_suggestion_state(null);
     editor?.commands.focus();
   }, [editor]);
-  const handle_edit_close = React26__namespace.useCallback(() => {
+  const handle_edit_close = React27__namespace.useCallback(() => {
     set_edit_context(null);
     editor?.commands.focus();
   }, [editor]);
-  const handle_command_update = React26__namespace.useCallback(
+  const handle_command_update = React27__namespace.useCallback(
     (new_command) => {
       if (!editor || !edit_context) return;
       const old_command = edit_context.command;
@@ -5886,7 +6224,7 @@ var HazoUiTextbox = ({
     },
     [editor, edit_context, on_command_change]
   );
-  const handle_command_remove = React26__namespace.useCallback(() => {
+  const handle_command_remove = React27__namespace.useCallback(() => {
     if (!editor || !edit_context) return;
     const command = edit_context.command;
     editor.state.doc.descendants((node, pos) => {
@@ -5900,7 +6238,7 @@ var HazoUiTextbox = ({
     }
     set_edit_context(null);
   }, [editor, edit_context, on_command_remove]);
-  const filtered_commands = React26__namespace.useMemo(() => {
+  const filtered_commands = React27__namespace.useMemo(() => {
     if (!suggestion_state) return [];
     const query = suggestion_state.query.toLowerCase();
     if (!query) return suggestion_state.commands;
@@ -5908,7 +6246,7 @@ var HazoUiTextbox = ({
       (cmd) => cmd.action_label.toLowerCase().includes(query) || cmd.action.toLowerCase().includes(query) || cmd.action_description?.toLowerCase().includes(query)
     );
   }, [suggestion_state]);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (!suggestion_state?.is_active) return;
     const handle_keydown = (e) => {
       switch (e.key) {
@@ -5943,7 +6281,7 @@ var HazoUiTextbox = ({
     handle_command_select,
     handle_popover_close
   ]);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (!edit_context) return;
     const handle_click_outside = (e) => {
       if (edit_popover_ref.current && !edit_popover_ref.current.contains(e.target)) {
@@ -5958,12 +6296,12 @@ var HazoUiTextbox = ({
       document.removeEventListener("mousedown", handle_click_outside);
     };
   }, [edit_context]);
-  const edit_commands = React26__namespace.useMemo(() => {
+  const edit_commands = React27__namespace.useMemo(() => {
     if (!edit_context) return [];
     const prefix_config = prefixes.find((p) => p.char === edit_context.command.prefix);
     return prefix_config?.commands || [];
   }, [edit_context, prefixes]);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (!edit_context) return;
     const handle_keydown = (e) => {
       switch (e.key) {
@@ -6001,7 +6339,7 @@ var HazoUiTextbox = ({
     handle_command_remove,
     handle_edit_close
   ]);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     const handle_pill_click = (e) => {
       const detail = e.detail;
       const { id, prefix, action, action_label, node_pos } = detail;
@@ -6286,22 +6624,22 @@ var HazoUiTextarea = ({
   on_command_change,
   on_command_remove
 }) => {
-  const generated_instance_id = React26__namespace.useId();
+  const generated_instance_id = React27__namespace.useId();
   const instance_id = provided_instance_id || generated_instance_id;
-  const [suggestion_state, set_suggestion_state] = React26__namespace.useState(null);
-  const [selected_index, set_selected_index] = React26__namespace.useState(0);
-  const [popover_position, set_popover_position] = React26__namespace.useState({ top: 0, left: 0 });
-  const [edit_context, set_edit_context] = React26__namespace.useState(null);
-  const [edit_selected_index, set_edit_selected_index] = React26__namespace.useState(0);
+  const [suggestion_state, set_suggestion_state] = React27__namespace.useState(null);
+  const [selected_index, set_selected_index] = React27__namespace.useState(0);
+  const [popover_position, set_popover_position] = React27__namespace.useState({ top: 0, left: 0 });
+  const [edit_context, set_edit_context] = React27__namespace.useState(null);
+  const [edit_selected_index, set_edit_selected_index] = React27__namespace.useState(0);
   const is_controlled = value !== void 0;
-  const editor_container_ref = React26__namespace.useRef(null);
-  const edit_popover_ref = React26__namespace.useRef(null);
-  const [mounted, set_mounted] = React26__namespace.useState(false);
-  React26__namespace.useEffect(() => {
+  const editor_container_ref = React27__namespace.useRef(null);
+  const edit_popover_ref = React27__namespace.useRef(null);
+  const [mounted, set_mounted] = React27__namespace.useState(false);
+  React27__namespace.useEffect(() => {
     set_mounted(true);
   }, []);
   const calculated_min_height = rows ? `${rows * 1.5}em` : min_height;
-  const suggestion_extensions = React26__namespace.useMemo(() => {
+  const suggestion_extensions = React27__namespace.useMemo(() => {
     return create_command_suggestion_extension({
       prefixes,
       instance_id,
@@ -6350,7 +6688,7 @@ var HazoUiTextarea = ({
       }
     }
   });
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (suggestion_state?.is_active && editor) {
       requestAnimationFrame(() => {
         const { from } = suggestion_state.range;
@@ -6374,7 +6712,7 @@ var HazoUiTextarea = ({
       });
     }
   }, [suggestion_state, editor]);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (is_controlled && editor && !editor.isFocused) {
       const current_text = editor.getText();
       if (value !== current_text) {
@@ -6387,12 +6725,12 @@ var HazoUiTextarea = ({
       }
     }
   }, [value, editor, is_controlled, prefixes, pill_variant]);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (editor) {
       editor.setEditable(!disabled);
     }
   }, [disabled, editor]);
-  const handle_command_select = React26__namespace.useCallback(
+  const handle_command_select = React27__namespace.useCallback(
     (command) => {
       if (!editor || !suggestion_state) return;
       const prefix_config = prefixes.find((p) => p.char === suggestion_state.prefix);
@@ -6412,15 +6750,15 @@ var HazoUiTextarea = ({
     },
     [editor, suggestion_state, pill_variant, on_command_insert, prefixes]
   );
-  const handle_popover_close = React26__namespace.useCallback(() => {
+  const handle_popover_close = React27__namespace.useCallback(() => {
     set_suggestion_state(null);
     editor?.commands.focus();
   }, [editor]);
-  const handle_edit_close = React26__namespace.useCallback(() => {
+  const handle_edit_close = React27__namespace.useCallback(() => {
     set_edit_context(null);
     editor?.commands.focus();
   }, [editor]);
-  const handle_command_update = React26__namespace.useCallback(
+  const handle_command_update = React27__namespace.useCallback(
     (new_command) => {
       if (!editor || !edit_context) return;
       const old_command = edit_context.command;
@@ -6436,7 +6774,7 @@ var HazoUiTextarea = ({
     },
     [editor, edit_context, on_command_change]
   );
-  const handle_command_remove = React26__namespace.useCallback(() => {
+  const handle_command_remove = React27__namespace.useCallback(() => {
     if (!editor || !edit_context) return;
     const command = edit_context.command;
     editor.state.doc.descendants((node, pos) => {
@@ -6450,7 +6788,7 @@ var HazoUiTextarea = ({
     }
     set_edit_context(null);
   }, [editor, edit_context, on_command_remove]);
-  const filtered_commands = React26__namespace.useMemo(() => {
+  const filtered_commands = React27__namespace.useMemo(() => {
     if (!suggestion_state) return [];
     const query = suggestion_state.query.toLowerCase();
     if (!query) return suggestion_state.commands;
@@ -6458,7 +6796,7 @@ var HazoUiTextarea = ({
       (cmd) => cmd.action_label.toLowerCase().includes(query) || cmd.action.toLowerCase().includes(query) || cmd.action_description?.toLowerCase().includes(query)
     );
   }, [suggestion_state]);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (!suggestion_state?.is_active) return;
     const handle_keydown = (e) => {
       switch (e.key) {
@@ -6493,7 +6831,7 @@ var HazoUiTextarea = ({
     handle_command_select,
     handle_popover_close
   ]);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (!edit_context) return;
     const handle_click_outside = (e) => {
       if (edit_popover_ref.current && !edit_popover_ref.current.contains(e.target)) {
@@ -6508,12 +6846,12 @@ var HazoUiTextarea = ({
       document.removeEventListener("mousedown", handle_click_outside);
     };
   }, [edit_context]);
-  const edit_commands = React26__namespace.useMemo(() => {
+  const edit_commands = React27__namespace.useMemo(() => {
     if (!edit_context) return [];
     const prefix_config = prefixes.find((p) => p.char === edit_context.command.prefix);
     return prefix_config?.commands || [];
   }, [edit_context, prefixes]);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (!edit_context) return;
     const handle_keydown = (e) => {
       switch (e.key) {
@@ -6551,7 +6889,7 @@ var HazoUiTextarea = ({
     handle_command_remove,
     handle_edit_close
   ]);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     const handle_pill_click = (e) => {
       const detail = e.detail;
       const { id, prefix, action, action_label, node_pos } = detail;
@@ -6767,39 +7105,47 @@ function resolve_animation_classes(open_anim = "zoom", close_anim = "zoom") {
 }
 var VARIANT_PRESETS = {
   info: {
-    header_background_color: "rgb(191, 219, 254)",
-    description_background_color: "rgb(219, 234, 254)",
-    header_text_color: "rgb(30, 58, 138)",
-    border_color: "rgb(59, 130, 246)",
-    accent_color: "rgb(59, 130, 246)",
+    header_background_color: "var(--dialog-info-bg)",
+    description_background_color: "var(--dialog-info-bg)",
+    header_text_color: "var(--dialog-info-fg)",
+    border_color: "var(--dialog-info-fg)",
+    accent_color: "var(--dialog-info-fg)",
     overlay_class_name: "bg-blue-950/50"
   },
   success: {
-    header_background_color: "rgb(187, 247, 208)",
-    description_background_color: "rgb(220, 252, 231)",
-    header_text_color: "rgb(22, 101, 52)",
-    border_color: "rgb(34, 197, 94)",
-    accent_color: "rgb(34, 197, 94)",
+    header_background_color: "var(--dialog-success-bg)",
+    description_background_color: "var(--dialog-success-bg)",
+    header_text_color: "var(--dialog-success-fg)",
+    border_color: "var(--dialog-success-fg)",
+    accent_color: "var(--dialog-success-fg)",
     overlay_class_name: "bg-green-950/50"
   },
   warning: {
-    header_background_color: "rgb(253, 230, 138)",
-    description_background_color: "rgb(254, 249, 195)",
-    header_text_color: "rgb(113, 63, 18)",
-    border_color: "rgb(234, 179, 8)",
-    accent_color: "rgb(234, 179, 8)",
+    header_background_color: "var(--dialog-warning-bg)",
+    description_background_color: "var(--dialog-warning-bg)",
+    header_text_color: "var(--dialog-warning-fg)",
+    border_color: "var(--dialog-warning-fg)",
+    accent_color: "var(--dialog-warning-fg)",
     overlay_class_name: "bg-yellow-950/50"
   },
   destructive: {
-    header_background_color: "rgb(254, 202, 202)",
-    description_background_color: "rgb(254, 226, 226)",
-    header_text_color: "rgb(127, 29, 29)",
-    border_color: "rgb(239, 68, 68)",
-    accent_color: "rgb(239, 68, 68)",
+    header_background_color: "var(--dialog-destructive-bg)",
+    description_background_color: "var(--dialog-destructive-bg)",
+    header_text_color: "var(--dialog-destructive-fg)",
+    border_color: "var(--dialog-destructive-fg)",
+    accent_color: "var(--dialog-destructive-fg)",
     overlay_class_name: "bg-red-950/50",
     action_button_variant: "destructive"
   }
 };
+var NEUTRAL_VARIANT_PRESET = {
+  header_background_color: "hsl(var(--dialog-border) / 0.12)",
+  description_background_color: "hsl(var(--dialog-border) / 0.12)",
+  header_text_color: "hsl(var(--dialog-fg))",
+  border_color: "hsl(var(--dialog-border))",
+  accent_color: "hsl(var(--dialog-border))",
+  overlay_class_name: "bg-black/50"
+};
 function HazoUiDialog({
   open,
   onOpenChange,
@@ -6808,13 +7154,13 @@ function HazoUiDialog({
   onCancel,
   title = "Action required",
   description,
-  actionButtonText = "Confirm",
+  actionButtonText: actionButtonTextProp,
   actionButtonVariant,
   cancelButtonText = "Cancel",
-  showCancelButton = true,
+  showCancelButton: showCancelButtonProp,
   showActionButton = true,
-  closeOnConfirm = false,
-  actionButtonLoading = false,
+  closeOnConfirm: closeOnConfirmProp,
+  actionButtonLoading: actionButtonLoadingProp,
   actionButtonDisabled = false,
   actionButtonIcon,
   footerContent,
@@ -6834,18 +7180,46 @@ function HazoUiDialog({
   borderColor,
   accentColor,
   headerBar = false,
-  headerBarColor = "#1e293b",
+  headerBarColor,
   className,
   contentClassName,
   overlayClassName,
   headerClassName,
   footerClassName,
-  showCloseButton = true
+  showCloseButton = true,
+  kind
 }) {
   const config = get_hazo_ui_config();
-  const variant_preset = variant !== "default" ? VARIANT_PRESETS[variant] : void 0;
+  const is_confirm_kind = kind === "confirm";
+  const is_status_kind = kind === "status";
+  const [internal_confirm_loading, set_internal_confirm_loading] = React27__namespace.useState(false);
+  const cancel_ref = React27__namespace.useRef(null);
+  const variant_preset = variant !== "default" ? VARIANT_PRESETS[variant] : is_status_kind || is_confirm_kind ? NEUTRAL_VARIANT_PRESET : void 0;
   const resolved_action_button_variant = actionButtonVariant ?? variant_preset?.action_button_variant ?? "default";
+  const showCancelButton = showCancelButtonProp ?? (is_status_kind ? false : true);
+  const closeOnConfirm = closeOnConfirmProp ?? (is_status_kind || is_confirm_kind ? true : false);
+  const actionButtonText = actionButtonTextProp ?? (is_status_kind ? "OK" : is_confirm_kind ? showCancelButton ? "Confirm" : "OK" : "Confirm");
+  const actionButtonLoading = actionButtonLoadingProp ?? (is_confirm_kind ? internal_confirm_loading : false);
   const handleConfirm = () => {
+    if (is_confirm_kind) {
+      try {
+        const result = onConfirm?.();
+        if (result instanceof Promise) {
+          if (actionButtonLoadingProp === void 0) set_internal_confirm_loading(true);
+          result.then(() => {
+            if (closeOnConfirm) onOpenChange?.(false);
+          }).catch(() => {
+          }).finally(() => {
+            if (actionButtonLoadingProp === void 0) set_internal_confirm_loading(false);
+          });
+          return;
+        }
+      } catch {
+        return;
+      }
+      if (closeOnConfirm) onOpenChange?.(false);
+      return;
+    }
     onConfirm?.();
     if (closeOnConfirm) {
       onOpenChange?.(false);
@@ -6865,12 +7239,14 @@ function HazoUiDialog({
   const finalHeaderBackgroundColor = headerBackgroundColor ?? variant_preset?.header_background_color ?? config.header_background_color;
   const finalDescriptionBgColor = descriptionBackgroundColor ?? variant_preset?.description_background_color;
   const finalHeaderTextColor = headerTextColor ?? variant_preset?.header_text_color ?? config.header_text_color;
-  const is_variant_active = variant !== "default";
+  const is_variant_active = variant !== "default" || is_status_kind;
   const has_split_header = splitHeader && !headerBar && !!finalDescriptionBgColor && !!description;
   const has_merged_variant_header = !splitHeader && is_variant_active && !headerBar && !!description;
+  const resolvedHeaderBarColor = headerBarColor ?? (variant !== "default" && variant_preset ? variant_preset.header_text_color : "var(--dialog-header-bar-bg)");
   const headerStyles = {
     ...headerBar && {
-      backgroundColor: headerBarColor,
+      backgroundColor: resolvedHeaderBarColor,
+      color: "var(--dialog-header-bar-fg)",
       paddingTop: compact ? "0.625rem" : "1.5rem",
       paddingBottom: compact ? "0.625rem" : "1.5rem",
       paddingLeft: "1.5rem",
@@ -6880,15 +7256,19 @@ function HazoUiDialog({
     ...!has_split_header && finalHeaderTextColor && { color: finalHeaderTextColor }
   };
   const titleClassName = cn(
-    "cls_dialog_title",
-    headerBar && "!text-white"
+    "cls_dialog_title"
   );
   const descriptionClassName = cn(
-    "cls_dialog_description",
-    headerBar && "!text-white/80"
+    "cls_dialog_description"
   );
   const bodyStyles = {
-    ...bodyBackgroundColor && { backgroundColor: bodyBackgroundColor }
+    ...bodyBackgroundColor && { backgroundColor: bodyBackgroundColor },
+    // kind="form" gets a comfortable body/label typography scale via the
+    // hazo_theme --dialog-body-size token. --dialog-label-size is intentionally
+    // not re-applied here: CSS custom properties inherit, so a consumer's own
+    // <label> elements inside `children` can reference var(--dialog-label-size)
+    // directly without any extra plumbing from this component.
+    ...kind === "form" && { fontSize: "var(--dialog-body-size)" }
   };
   const footerStyles = {
     ...footerBackgroundColor && { backgroundColor: footerBackgroundColor }
@@ -6912,6 +7292,86 @@ function HazoUiDialog({
     ...finalCancelTextColor && { color: finalCancelTextColor },
     ...finalCancelBorderColor && { borderColor: finalCancelBorderColor }
   };
+  if (is_confirm_kind) {
+    const top_border_color = resolved_border_color ?? "hsl(var(--dialog-border))";
+    return /* @__PURE__ */ jsxRuntime.jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxRuntime.jsxs(DialogPortal, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        DialogOverlay,
+        {
+          className: cn(
+            "cls_confirm_dialog_overlay",
+            overlayClassName ?? variant_preset?.overlay_class_name
+          ),
+          style: { backdropFilter: "blur(4px)" }
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        DialogPrimitive__namespace.Content,
+        {
+          className: cn(
+            "cls_confirm_dialog_content",
+            "fixed left-[50%] top-[50%] z-50",
+            "translate-x-[-50%] translate-y-[-50%]",
+            "bg-background shadow-lg",
+            "duration-200",
+            animationClasses,
+            "overflow-hidden",
+            className
+          ),
+          style: {
+            width: "min(90vw, 420px)",
+            borderRadius: "12px",
+            borderTop: `4px solid ${top_border_color}`,
+            boxShadow: "0 20px 60px rgba(0,0,0,0.15)",
+            outline: "none"
+          },
+          onOpenAutoFocus: (e) => {
+            if ((variant === "destructive" || variant === "warning") && showCancelButton && cancel_ref.current) {
+              e.preventDefault();
+              cancel_ref.current.focus();
+            }
+          },
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cls_confirm_dialog_body px-6 pt-7 pb-5", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Title, { className: "cls_confirm_dialog_title text-[17px] font-semibold text-foreground mb-2.5", children: title }),
+              children ? /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cls_confirm_dialog_children text-sm text-muted-foreground leading-relaxed", children }) }) : description ? /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Description, { className: "cls_confirm_dialog_description text-sm text-muted-foreground leading-relaxed", children: description }) : null
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cls_confirm_dialog_separator border-t border-border" }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cls_confirm_dialog_actions px-6 py-4 flex justify-end gap-3", children: [
+              showCancelButton && /* @__PURE__ */ jsxRuntime.jsx(
+                Button,
+                {
+                  ref: cancel_ref,
+                  type: "button",
+                  className: "cls_confirm_cancel_button focus-visible:ring-0 focus-visible:ring-offset-0",
+                  variant: "outline",
+                  onClick: handleCancel,
+                  disabled: actionButtonLoading,
+                  style: cancelButtonStyles,
+                  children: cancelButtonText
+                }
+              ),
+              showActionButton && /* @__PURE__ */ jsxRuntime.jsxs(
+                Button,
+                {
+                  type: "button",
+                  className: "cls_confirm_action_button",
+                  variant: resolved_action_button_variant,
+                  onClick: handleConfirm,
+                  disabled: actionButtonLoading || actionButtonDisabled,
+                  style: actionButtonStyles,
+                  children: [
+                    actionButtonLoading && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 mr-2 animate-spin" }),
+                    actionButtonText
+                  ]
+                }
+              )
+            ] })
+          ]
+        }
+      )
+    ] }) });
+  }
   return /* @__PURE__ */ jsxRuntime.jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxRuntime.jsxs(DialogPortal, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       DialogOverlay,
@@ -6986,10 +7446,17 @@ function HazoUiDialog({
                 style: headerStyles,
                 children: [
                   /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { className: titleClassName, children: title }),
-                  description && /* @__PURE__ */ jsxRuntime.jsx(DialogDescription, { className: cn(
-                    descriptionClassName,
-                    has_merged_variant_header && "italic text-xs mt-1"
-                  ), children: description })
+                  description && /* @__PURE__ */ jsxRuntime.jsx(
+                    DialogDescription,
+                    {
+                      className: cn(
+                        descriptionClassName,
+                        has_merged_variant_header && "italic text-xs mt-1"
+                      ),
+                      style: headerBar ? { opacity: 0.8 } : void 0,
+                      children: description
+                    }
+                  )
                 ]
               }
             )
@@ -7055,7 +7522,7 @@ function HazoUiDialog({
             DialogPrimitive__namespace.Close,
             {
               className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground",
-              style: headerBar ? { color: "white" } : finalHeaderTextColor ? { color: finalHeaderTextColor } : void 0,
+              style: headerBar ? { color: "var(--dialog-header-bar-fg)" } : finalHeaderTextColor ? { color: finalHeaderTextColor } : void 0,
               children: [
                 /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4" }),
                 /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
@@ -7067,28 +7534,6 @@ function HazoUiDialog({
     )
   ] }) });
 }
-var CONFIRM_VARIANT_PRESETS = {
-  destructive: {
-    accent_color: "rgb(220, 38, 38)",
-    confirm_button_color: "rgb(220, 38, 38)",
-    overlay_class_name: "bg-red-950/50"
-  },
-  warning: {
-    accent_color: "rgb(245, 158, 11)",
-    confirm_button_color: "rgb(245, 158, 11)",
-    overlay_class_name: "bg-yellow-950/50"
-  },
-  info: {
-    accent_color: "rgb(37, 99, 235)",
-    confirm_button_color: "rgb(37, 99, 235)",
-    overlay_class_name: "bg-blue-950/50"
-  },
-  success: {
-    accent_color: "rgb(22, 163, 74)",
-    confirm_button_color: "rgb(22, 163, 74)",
-    overlay_class_name: "bg-green-950/50"
-  }
-};
 function HazoUiConfirmDialog({
   open,
   onOpenChange,
@@ -7101,128 +7546,39 @@ function HazoUiConfirmDialog({
   showCancelButton = true,
   onConfirm,
   onCancel,
-  loading: external_loading,
+  loading,
   disabled = false,
   accentColor,
   confirmButtonColor,
   openAnimation = "zoom",
   closeAnimation = "zoom"
 }) {
-  const [internal_loading, set_internal_loading] = React26__namespace.useState(false);
-  const config = get_hazo_ui_config();
-  const variant_preset = variant !== "default" ? CONFIRM_VARIANT_PRESETS[variant] : void 0;
-  const is_loading = external_loading ?? internal_loading;
-  const resolved_confirm_label = confirmLabel ?? (showCancelButton ? "Confirm" : "OK");
-  const resolved_accent_color = accentColor ?? variant_preset?.accent_color ?? "rgb(148, 163, 184)";
-  const resolved_confirm_button_color = confirmButtonColor ?? variant_preset?.confirm_button_color ?? config.submit_button_background_color;
-  const cancel_button_styles = {
-    ...config.cancel_button_background_color && { backgroundColor: config.cancel_button_background_color },
-    ...config.cancel_button_text_color && { color: config.cancel_button_text_color },
-    ...config.cancel_button_border_color && { borderColor: config.cancel_button_border_color }
-  };
-  const confirm_button_styles = {
-    ...resolved_confirm_button_color && {
-      backgroundColor: resolved_confirm_button_color,
-      borderColor: resolved_confirm_button_color,
-      color: "white"
-    }
-  };
-  const animation_classes = resolve_animation_classes(openAnimation, closeAnimation);
-  const handle_confirm = async () => {
-    try {
-      const result = onConfirm();
-      if (result instanceof Promise) {
-        set_internal_loading(true);
-        await result;
-      }
-      onOpenChange(false);
-    } catch {
-    } finally {
-      set_internal_loading(false);
+  const resolved_accent_color = confirmButtonColor ?? accentColor;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    HazoUiDialog,
+    {
+      kind: "confirm",
+      open,
+      onOpenChange,
+      title,
+      description,
+      variant,
+      actionButtonText: confirmLabel,
+      cancelButtonText: cancelLabel,
+      showCancelButton,
+      onConfirm,
+      onCancel,
+      actionButtonLoading: loading,
+      actionButtonDisabled: disabled,
+      accentColor: resolved_accent_color,
+      openAnimation,
+      closeAnimation,
+      closeOnConfirm: true,
+      children
     }
-  };
-  const handle_cancel = () => {
-    onCancel?.();
-    onOpenChange(false);
-  };
-  const cancel_ref = React26__namespace.useRef(null);
-  return /* @__PURE__ */ jsxRuntime.jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxRuntime.jsxs(DialogPortal, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      DialogOverlay,
-      {
-        className: cn(
-          "cls_confirm_dialog_overlay",
-          variant_preset?.overlay_class_name
-        ),
-        style: { backdropFilter: "blur(4px)" }
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      DialogPrimitive__namespace.Content,
-      {
-        className: cn(
-          "cls_confirm_dialog_content",
-          "fixed left-[50%] top-[50%] z-50",
-          "translate-x-[-50%] translate-y-[-50%]",
-          "bg-background shadow-lg",
-          "duration-200",
-          animation_classes,
-          "overflow-hidden"
-        ),
-        style: {
-          width: "min(90vw, 420px)",
-          borderRadius: "12px",
-          borderTop: `4px solid ${resolved_accent_color}`,
-          boxShadow: "0 20px 60px rgba(0,0,0,0.15)",
-          outline: "none"
-        },
-        onOpenAutoFocus: (e) => {
-          if ((variant === "destructive" || variant === "warning") && showCancelButton && cancel_ref.current) {
-            e.preventDefault();
-            cancel_ref.current.focus();
-          }
-        },
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cls_confirm_dialog_body px-6 pt-7 pb-5", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Title, { className: "cls_confirm_dialog_title text-[17px] font-semibold text-foreground mb-2.5", children: title }),
-            children ? /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cls_confirm_dialog_children text-sm text-muted-foreground leading-relaxed", children }) }) : description ? /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Description, { className: "cls_confirm_dialog_description text-sm text-muted-foreground leading-relaxed", children: description }) : null
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cls_confirm_dialog_separator border-t border-border" }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cls_confirm_dialog_actions px-6 py-4 flex justify-end gap-3", children: [
-            showCancelButton && /* @__PURE__ */ jsxRuntime.jsx(
-              Button,
-              {
-                ref: cancel_ref,
-                type: "button",
-                className: "cls_confirm_cancel_button focus-visible:ring-0 focus-visible:ring-offset-0",
-                variant: "outline",
-                onClick: handle_cancel,
-                disabled: is_loading,
-                style: cancel_button_styles,
-                children: cancelLabel
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsxs(
-              Button,
-              {
-                type: "button",
-                className: "cls_confirm_action_button",
-                onClick: handle_confirm,
-                disabled: is_loading || disabled,
-                style: confirm_button_styles,
-                children: [
-                  is_loading && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 mr-2 animate-spin" }),
-                  resolved_confirm_label
-                ]
-              }
-            )
-          ] })
-        ]
-      }
-    )
-  ] }) });
+  );
 }
-var Slider = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+var Slider = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
   SliderPrimitive__namespace.Root,
   {
     ref,
@@ -7275,7 +7631,7 @@ async function getCroppedImg(imageSrc, areaPixels, outputSize, quality) {
     );
   });
 }
-var HazoUiImageCropper = React26__namespace.forwardRef(function HazoUiImageCropper2({
+var HazoUiImageCropper = React27__namespace.forwardRef(function HazoUiImageCropper2({
   imageSrc,
   onCropped,
   outputSize = 512,
@@ -7283,19 +7639,19 @@ var HazoUiImageCropper = React26__namespace.forwardRef(function HazoUiImageCropp
   zoomLabel = "Zoom",
   className
 }, ref) {
-  const [crop, set_crop] = React26__namespace.useState({
+  const [crop, set_crop] = React27__namespace.useState({
     x: 0,
     y: 0
   });
-  const [zoom, set_zoom] = React26__namespace.useState(1);
-  const cropped_area_pixels_ref = React26__namespace.useRef(null);
-  const handle_crop_complete = React26__namespace.useCallback(
+  const [zoom, set_zoom] = React27__namespace.useState(1);
+  const cropped_area_pixels_ref = React27__namespace.useRef(null);
+  const handle_crop_complete = React27__namespace.useCallback(
     (_croppedArea, croppedAreaPixels) => {
       cropped_area_pixels_ref.current = croppedAreaPixels;
     },
     []
   );
-  React26__namespace.useImperativeHandle(
+  React27__namespace.useImperativeHandle(
     ref,
     () => ({
       getCroppedBlob: async () => {
@@ -7375,10 +7731,10 @@ function HazoUiImageCropperDialog({
   outputSize = 512,
   quality = 0.9
 }) {
-  const cropper_ref = React26__namespace.useRef(null);
-  const [image_src, set_image_src] = React26__namespace.useState(null);
-  const [is_confirming, set_is_confirming] = React26__namespace.useState(false);
-  React26__namespace.useEffect(() => {
+  const cropper_ref = React27__namespace.useRef(null);
+  const [image_src, set_image_src] = React27__namespace.useState(null);
+  const [is_confirming, set_is_confirming] = React27__namespace.useState(false);
+  React27__namespace.useEffect(() => {
     if (!file) {
       set_image_src(null);
       return;
@@ -7434,7 +7790,7 @@ Drawer.displayName = "Drawer";
 var DrawerTrigger = vaul.Drawer.Trigger;
 var DrawerPortal = vaul.Drawer.Portal;
 var DrawerClose = vaul.Drawer.Close;
-var DrawerOverlay = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DrawerOverlay = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   vaul.Drawer.Overlay,
   {
     ref,
@@ -7446,7 +7802,7 @@ var DrawerOverlay = React26__namespace.forwardRef(({ className, ...props }, ref)
   }
 ));
 DrawerOverlay.displayName = "DrawerOverlay";
-var DrawerContent = React26__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(DrawerPortal, { children: [
+var DrawerContent = React27__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(DrawerPortal, { children: [
   /* @__PURE__ */ jsxRuntime.jsx(DrawerOverlay, {}),
   /* @__PURE__ */ jsxRuntime.jsxs(
     vaul.Drawer.Content,
@@ -7487,7 +7843,7 @@ var DrawerFooter = ({
   }
 );
 DrawerFooter.displayName = "DrawerFooter";
-var DrawerTitle = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DrawerTitle = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   vaul.Drawer.Title,
   {
     ref,
@@ -7499,7 +7855,7 @@ var DrawerTitle = React26__namespace.forwardRef(({ className, ...props }, ref) =
   }
 ));
 DrawerTitle.displayName = "DrawerTitle";
-var DrawerDescription = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DrawerDescription = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   vaul.Drawer.Description,
   {
     ref,
@@ -7509,14 +7865,14 @@ var DrawerDescription = React26__namespace.forwardRef(({ className, ...props },
 ));
 DrawerDescription.displayName = "DrawerDescription";
 function useMediaQuery(query) {
-  const get_match = React26__namespace.useCallback(() => {
+  const get_match = React27__namespace.useCallback(() => {
     if (typeof window === "undefined" || typeof window.matchMedia !== "function") {
       return false;
     }
     return window.matchMedia(query).matches;
   }, [query]);
-  const [matches, set_matches] = React26__namespace.useState(false);
-  React26__namespace.useEffect(() => {
+  const [matches, set_matches] = React27__namespace.useState(false);
+  React27__namespace.useEffect(() => {
     if (typeof window === "undefined" || typeof window.matchMedia !== "function") {
       return;
     }
@@ -7533,7 +7889,7 @@ function useMediaQuery(query) {
   return matches;
 }
 var Accordion = AccordionPrimitive__namespace.Root;
-var AccordionItem = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var AccordionItem = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   AccordionPrimitive__namespace.Item,
   {
     ref,
@@ -7542,7 +7898,7 @@ var AccordionItem = React26__namespace.forwardRef(({ className, ...props }, ref)
   }
 ));
 AccordionItem.displayName = "AccordionItem";
-var AccordionTrigger = React26__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(AccordionPrimitive__namespace.Header, { className: "flex", children: /* @__PURE__ */ jsxRuntime.jsxs(
+var AccordionTrigger = React27__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(AccordionPrimitive__namespace.Header, { className: "flex", children: /* @__PURE__ */ jsxRuntime.jsxs(
   AccordionPrimitive__namespace.Trigger,
   {
     ref,
@@ -7558,7 +7914,7 @@ var AccordionTrigger = React26__namespace.forwardRef(({ className, children, ...
   }
 ) }));
 AccordionTrigger.displayName = AccordionPrimitive__namespace.Trigger.displayName;
-var AccordionContent = React26__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var AccordionContent = React27__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   AccordionPrimitive__namespace.Content,
   {
     ref,
@@ -7568,7 +7924,7 @@ var AccordionContent = React26__namespace.forwardRef(({ className, children, ...
   }
 ));
 AccordionContent.displayName = AccordionPrimitive__namespace.Content.displayName;
-var Checkbox = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var Checkbox = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   CheckboxPrimitive__namespace.Root,
   {
     ref,
@@ -7593,7 +7949,7 @@ var DropdownMenuGroup = DropdownMenuPrimitive__namespace.Group;
 var DropdownMenuPortal = DropdownMenuPrimitive__namespace.Portal;
 var DropdownMenuSub = DropdownMenuPrimitive__namespace.Sub;
 var DropdownMenuRadioGroup = DropdownMenuPrimitive__namespace.RadioGroup;
-var DropdownMenuSubTrigger = React26__namespace.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+var DropdownMenuSubTrigger = React27__namespace.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
   DropdownMenuPrimitive__namespace.SubTrigger,
   {
     ref,
@@ -7610,7 +7966,7 @@ var DropdownMenuSubTrigger = React26__namespace.forwardRef(({ className, inset,
   }
 ));
 DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive__namespace.SubTrigger.displayName;
-var DropdownMenuSubContent = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DropdownMenuSubContent = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   DropdownMenuPrimitive__namespace.SubContent,
   {
     ref,
@@ -7622,7 +7978,7 @@ var DropdownMenuSubContent = React26__namespace.forwardRef(({ className, ...prop
   }
 ));
 DropdownMenuSubContent.displayName = DropdownMenuPrimitive__namespace.SubContent.displayName;
-var DropdownMenuContent = React26__namespace.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
+var DropdownMenuContent = React27__namespace.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
   DropdownMenuPrimitive__namespace.Content,
   {
     ref,
@@ -7635,7 +7991,7 @@ var DropdownMenuContent = React26__namespace.forwardRef(({ className, sideOffset
   }
 ) }));
 DropdownMenuContent.displayName = DropdownMenuPrimitive__namespace.Content.displayName;
-var DropdownMenuItem = React26__namespace.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DropdownMenuItem = React27__namespace.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   DropdownMenuPrimitive__namespace.Item,
   {
     ref,
@@ -7648,7 +8004,7 @@ var DropdownMenuItem = React26__namespace.forwardRef(({ className, inset, ...pro
   }
 ));
 DropdownMenuItem.displayName = DropdownMenuPrimitive__namespace.Item.displayName;
-var DropdownMenuCheckboxItem = React26__namespace.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+var DropdownMenuCheckboxItem = React27__namespace.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
   DropdownMenuPrimitive__namespace.CheckboxItem,
   {
     ref,
@@ -7665,7 +8021,7 @@ var DropdownMenuCheckboxItem = React26__namespace.forwardRef(({ className, child
   }
 ));
 DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive__namespace.CheckboxItem.displayName;
-var DropdownMenuRadioItem = React26__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+var DropdownMenuRadioItem = React27__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
   DropdownMenuPrimitive__namespace.RadioItem,
   {
     ref,
@@ -7681,7 +8037,7 @@ var DropdownMenuRadioItem = React26__namespace.forwardRef(({ className, children
   }
 ));
 DropdownMenuRadioItem.displayName = DropdownMenuPrimitive__namespace.RadioItem.displayName;
-var DropdownMenuLabel = React26__namespace.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DropdownMenuLabel = React27__namespace.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   DropdownMenuPrimitive__namespace.Label,
   {
     ref,
@@ -7694,7 +8050,7 @@ var DropdownMenuLabel = React26__namespace.forwardRef(({ className, inset, ...pr
   }
 ));
 DropdownMenuLabel.displayName = DropdownMenuPrimitive__namespace.Label.displayName;
-var DropdownMenuSeparator = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DropdownMenuSeparator = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   DropdownMenuPrimitive__namespace.Separator,
   {
     ref,
@@ -7718,7 +8074,7 @@ var DropdownMenuShortcut = ({
 DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
 var HoverCard = HoverCardPrimitive__namespace.Root;
 var HoverCardTrigger = HoverCardPrimitive__namespace.Trigger;
-var HoverCardContent = React26__namespace.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var HoverCardContent = React27__namespace.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   HoverCardPrimitive__namespace.Content,
   {
     ref,
@@ -7732,7 +8088,7 @@ var HoverCardContent = React26__namespace.forwardRef(({ className, align = "cent
   }
 ));
 HoverCardContent.displayName = HoverCardPrimitive__namespace.Content.displayName;
-var Label3 = React26__namespace.forwardRef(
+var Label3 = React27__namespace.forwardRef(
   ({ className, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "label",
@@ -7748,7 +8104,7 @@ var Label3 = React26__namespace.forwardRef(
   }
 );
 Label3.displayName = "Label";
-var Switch = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var Switch = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   SwitchPrimitives__namespace.Root,
   {
     className: cn(
@@ -7768,7 +8124,7 @@ var Switch = React26__namespace.forwardRef(({ className, ...props }, ref) => /*
   }
 ));
 Switch.displayName = SwitchPrimitives__namespace.Root.displayName;
-var Textarea = React26__namespace.forwardRef(
+var Textarea = React27__namespace.forwardRef(
   ({ className, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "textarea",
@@ -7788,7 +8144,7 @@ var Textarea = React26__namespace.forwardRef(
   }
 );
 Textarea.displayName = "Textarea";
-var Separator3 = React26__namespace.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var Separator3 = React27__namespace.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   SeparatorPrimitive__namespace.Root,
   {
     ref,
@@ -7806,7 +8162,7 @@ Separator3.displayName = SeparatorPrimitive__namespace.Root.displayName;
 var Collapsible = CollapsiblePrimitive__namespace.Root;
 var CollapsibleTrigger2 = CollapsiblePrimitive__namespace.CollapsibleTrigger;
 var CollapsibleContent2 = CollapsiblePrimitive__namespace.CollapsibleContent;
-var ScrollArea = React26__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+var ScrollArea = React27__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
   ScrollAreaPrimitive__namespace.Root,
   {
     ref,
@@ -7820,7 +8176,7 @@ var ScrollArea = React26__namespace.forwardRef(({ className, children, ...props
   }
 ));
 ScrollArea.displayName = ScrollAreaPrimitive__namespace.Root.displayName;
-var ScrollBar = React26__namespace.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var ScrollBar = React27__namespace.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   ScrollAreaPrimitive__namespace.ScrollAreaScrollbar,
   {
     ref,
@@ -7836,27 +8192,27 @@ var ScrollBar = React26__namespace.forwardRef(({ className, orientation = "verti
   }
 ));
 ScrollBar.displayName = ScrollAreaPrimitive__namespace.ScrollAreaScrollbar.displayName;
-var Card = React26__namespace.forwardRef(
+var Card = React27__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("rounded-lg border bg-card text-card-foreground shadow-sm", className), ...props })
 );
 Card.displayName = "Card";
-var CardHeader = React26__namespace.forwardRef(
+var CardHeader = React27__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex flex-col space-y-1.5 p-6", className), ...props })
 );
 CardHeader.displayName = "CardHeader";
-var CardTitle = React26__namespace.forwardRef(
+var CardTitle = React27__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("h3", { ref, className: cn("text-2xl font-semibold leading-none tracking-tight", className), ...props })
 );
 CardTitle.displayName = "CardTitle";
-var CardDescription = React26__namespace.forwardRef(
+var CardDescription = React27__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("p", { ref, className: cn("text-sm text-muted-foreground", className), ...props })
 );
 CardDescription.displayName = "CardDescription";
-var CardContent = React26__namespace.forwardRef(
+var CardContent = React27__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("p-6 pt-0", className), ...props })
 );
 CardContent.displayName = "CardContent";
-var CardFooter = React26__namespace.forwardRef(
+var CardFooter = React27__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex items-center p-6 pt-0", className), ...props })
 );
 CardFooter.displayName = "CardFooter";
@@ -7889,16 +8245,16 @@ var toggleVariants = classVarianceAuthority.cva(
     defaultVariants: { variant: "default", size: "default" }
   }
 );
-var Toggle = React26__namespace.forwardRef(({ className, variant, size, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(TogglePrimitive__namespace.Root, { ref, className: cn(toggleVariants({ variant, size, className })), ...props }));
+var Toggle = React27__namespace.forwardRef(({ className, variant, size, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(TogglePrimitive__namespace.Root, { ref, className: cn(toggleVariants({ variant, size, className })), ...props }));
 Toggle.displayName = TogglePrimitive__namespace.Root.displayName;
-var ToggleGroupContext = React26__namespace.createContext({
+var ToggleGroupContext = React27__namespace.createContext({
   size: "default",
   variant: "default"
 });
-var ToggleGroup = React26__namespace.forwardRef(({ className, variant, size, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(ToggleGroupPrimitive__namespace.Root, { ref, className: cn("flex items-center justify-center gap-1", className), ...props, children: /* @__PURE__ */ jsxRuntime.jsx(ToggleGroupContext.Provider, { value: { variant, size }, children }) }));
+var ToggleGroup = React27__namespace.forwardRef(({ className, variant, size, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(ToggleGroupPrimitive__namespace.Root, { ref, className: cn("flex items-center justify-center gap-1", className), ...props, children: /* @__PURE__ */ jsxRuntime.jsx(ToggleGroupContext.Provider, { value: { variant, size }, children }) }));
 ToggleGroup.displayName = ToggleGroupPrimitive__namespace.Root.displayName;
-var ToggleGroupItem = React26__namespace.forwardRef(({ className, children, variant, size, ...props }, ref) => {
-  const context = React26__namespace.useContext(ToggleGroupContext);
+var ToggleGroupItem = React27__namespace.forwardRef(({ className, children, variant, size, ...props }, ref) => {
+  const context = React27__namespace.useContext(ToggleGroupContext);
   return /* @__PURE__ */ jsxRuntime.jsx(
     ToggleGroupPrimitive__namespace.Item,
     {
@@ -7913,7 +8269,7 @@ ToggleGroupItem.displayName = ToggleGroupPrimitive__namespace.Item.displayName;
 var AlertDialog = AlertDialogPrimitive__namespace.Root;
 var AlertDialogTrigger = AlertDialogPrimitive__namespace.Trigger;
 var AlertDialogPortal = AlertDialogPrimitive__namespace.Portal;
-var AlertDialogOverlay = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var AlertDialogOverlay = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   AlertDialogPrimitive__namespace.Overlay,
   {
     ref,
@@ -7922,7 +8278,7 @@ var AlertDialogOverlay = React26__namespace.forwardRef(({ className, ...props },
   }
 ));
 AlertDialogOverlay.displayName = AlertDialogPrimitive__namespace.Overlay.displayName;
-var AlertDialogContent = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(AlertDialogPortal, { children: [
+var AlertDialogContent = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(AlertDialogPortal, { children: [
   /* @__PURE__ */ jsxRuntime.jsx(AlertDialogOverlay, {}),
   /* @__PURE__ */ jsxRuntime.jsx(
     AlertDialogPrimitive__namespace.Content,
@@ -7938,13 +8294,13 @@ var AlertDialogHeader = ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.
 AlertDialogHeader.displayName = "AlertDialogHeader";
 var AlertDialogFooter = ({ className, ...props }) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className), ...props });
 AlertDialogFooter.displayName = "AlertDialogFooter";
-var AlertDialogTitle = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(AlertDialogPrimitive__namespace.Title, { ref, className: cn("text-lg font-semibold", className), ...props }));
+var AlertDialogTitle = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(AlertDialogPrimitive__namespace.Title, { ref, className: cn("text-lg font-semibold", className), ...props }));
 AlertDialogTitle.displayName = AlertDialogPrimitive__namespace.Title.displayName;
-var AlertDialogDescription = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(AlertDialogPrimitive__namespace.Description, { ref, className: cn("text-sm text-muted-foreground", className), ...props }));
+var AlertDialogDescription = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(AlertDialogPrimitive__namespace.Description, { ref, className: cn("text-sm text-muted-foreground", className), ...props }));
 AlertDialogDescription.displayName = AlertDialogPrimitive__namespace.Description.displayName;
-var AlertDialogAction = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(AlertDialogPrimitive__namespace.Action, { ref, className: cn(buttonVariants(), className), ...props }));
+var AlertDialogAction = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(AlertDialogPrimitive__namespace.Action, { ref, className: cn(buttonVariants(), className), ...props }));
 AlertDialogAction.displayName = AlertDialogPrimitive__namespace.Action.displayName;
-var AlertDialogCancel = React26__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(AlertDialogPrimitive__namespace.Cancel, { ref, className: cn(buttonVariants({ variant: "outline" }), "mt-2 sm:mt-0", className), ...props }));
+var AlertDialogCancel = React27__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(AlertDialogPrimitive__namespace.Cancel, { ref, className: cn(buttonVariants({ variant: "outline" }), "mt-2 sm:mt-0", className), ...props }));
 AlertDialogCancel.displayName = AlertDialogPrimitive__namespace.Cancel.displayName;
 var buttonGroupVariants = classVarianceAuthority.cva(
   "flex w-fit items-stretch [&>*]:focus-visible:relative [&>*]:focus-visible:z-10",
@@ -7972,7 +8328,7 @@ function ButtonGroupText({ className, asChild = false, ...props }) {
 function ButtonGroupSeparator({ className, orientation = "vertical", ...props }) {
   return /* @__PURE__ */ jsxRuntime.jsx(Separator3, { orientation, className: cn("bg-input relative !m-0 self-stretch data-[orientation=vertical]:h-auto", className), ...props });
 }
-var InputAffix = React26__namespace.forwardRef(
+var InputAffix = React27__namespace.forwardRef(
   ({ className, containerClassName, prefix, suffix, type = "text", ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
@@ -8004,7 +8360,7 @@ var InputAffix = React26__namespace.forwardRef(
   }
 );
 InputAffix.displayName = "InputAffix";
-var SkeletonBase = React26__namespace.forwardRef(
+var SkeletonBase = React27__namespace.forwardRef(
   ({ className, ...rest }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -8180,8 +8536,8 @@ function LoadingTimeout({
     firm: thresholds?.firm ?? 15e3,
     expired: thresholds?.expired ?? 3e4
   };
-  const [phase, setPhase] = React26__namespace.useState(active ? "silent" : "idle");
-  React26__namespace.useEffect(() => {
+  const [phase, setPhase] = React27__namespace.useState(active ? "silent" : "idle");
+  React27__namespace.useEffect(() => {
     if (!active) {
       setPhase("idle");
       return;
@@ -8240,7 +8596,7 @@ function ProgressiveImage({
   onLoad,
   onError
 }) {
-  const [loaded, setLoaded] = React26__namespace.useState(false);
+  const [loaded, setLoaded] = React27__namespace.useState(false);
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
@@ -8393,7 +8749,7 @@ function NotificationPanel({
   loading = false,
   className
 }) {
-  const hasChildren = React26__namespace.Children.count(children) > 0 && children !== null && children !== void 0;
+  const hasChildren = React27__namespace.Children.count(children) > 0 && children !== null && children !== void 0;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
@@ -8464,8 +8820,8 @@ function errorToast({ title, description, duration = 5e3, action }) {
   });
 }
 function useLoadingState(initial = false) {
-  const [isLoading, setLoading] = React26.useState(initial);
-  const withLoading = React26.useCallback(async (fn) => {
+  const [isLoading, setLoading] = React27.useState(initial);
+  const withLoading = React27.useCallback(async (fn) => {
     setLoading(true);
     try {
       return await fn();
@@ -8476,8 +8832,8 @@ function useLoadingState(initial = false) {
   return { isLoading, setLoading, withLoading };
 }
 function useErrorDisplay() {
-  const [error, setRaw] = React26.useState(null);
-  const setError = React26.useCallback((value) => {
+  const [error, setRaw] = React27.useState(null);
+  const setError = React27.useCallback((value) => {
     if (value == null) {
       setRaw(null);
       return;
@@ -8492,12 +8848,12 @@ function useErrorDisplay() {
     }
     setRaw(String(value));
   }, []);
-  const clearError = React26.useCallback(() => setRaw(null), []);
+  const clearError = React27.useCallback(() => setRaw(null), []);
   return { error, setError, clearError };
 }
 function useDebounce(value, delayMs) {
-  const [debounced_value, set_debounced_value] = React26.useState(value);
-  React26.useEffect(() => {
+  const [debounced_value, set_debounced_value] = React27.useState(value);
+  React27.useEffect(() => {
     const timer = setTimeout(() => {
       set_debounced_value(value);
     }, delayMs);
@@ -8506,8 +8862,8 @@ function useDebounce(value, delayMs) {
   return debounced_value;
 }
 function useCopyToClipboard() {
-  const [copied, set_copied] = React26.useState(false);
-  const copy = React26.useCallback(async (text) => {
+  const [copied, set_copied] = React27.useState(false);
+  const copy = React27.useCallback(async (text) => {
     if (typeof navigator === "undefined" || !navigator.clipboard) {
       return;
     }
@@ -8539,8 +8895,8 @@ function useLocalStorage(key, initialValue) {
       return initialValue;
     }
   };
-  const [stored_value, set_stored_value] = React26.useState(read_stored);
-  const set_value = React26.useCallback(
+  const [stored_value, set_stored_value] = React27.useState(read_stored);
+  const set_value = React27.useCallback(
     (value) => {
       set_stored_value((prev) => {
         const next = typeof value === "function" ? value(prev) : value;
@@ -8567,8 +8923,8 @@ function useSessionStorage(key, initialValue) {
       return initialValue;
     }
   };
-  const [stored_value, set_stored_value] = React26.useState(read_stored);
-  const set_value = React26.useCallback(
+  const [stored_value, set_stored_value] = React27.useState(read_stored);
+  const set_value = React27.useCallback(
     (value) => {
       set_stored_value((prev) => {
         const next = typeof value === "function" ? value(prev) : value;
@@ -8586,7 +8942,7 @@ function useSessionStorage(key, initialValue) {
   return [stored_value, set_value];
 }
 function useClickOutside(ref, handler) {
-  React26.useEffect(() => {
+  React27.useEffect(() => {
     if (typeof document === "undefined") return;
     const handle_event = (event) => {
       const target = event.target;
@@ -8605,9 +8961,9 @@ function useClickOutside(ref, handler) {
 }
 function useWakeLock() {
   const supported = typeof navigator !== "undefined" && "wakeLock" in navigator;
-  const sentinel_ref = React26.useRef(null);
-  const [acquired, set_acquired] = React26.useState(false);
-  const request = React26.useCallback(async () => {
+  const sentinel_ref = React27.useRef(null);
+  const [acquired, set_acquired] = React27.useState(false);
+  const request = React27.useCallback(async () => {
     if (!supported || sentinel_ref.current) return;
     try {
       const sentinel = await navigator.wakeLock.request("screen");
@@ -8620,7 +8976,7 @@ function useWakeLock() {
     } catch {
     }
   }, [supported]);
-  const release = React26.useCallback(async () => {
+  const release = React27.useCallback(async () => {
     if (!sentinel_ref.current) return;
     try {
       await sentinel_ref.current.release();
@@ -8630,7 +8986,7 @@ function useWakeLock() {
       set_acquired(false);
     }
   }, []);
-  React26.useEffect(() => {
+  React27.useEffect(() => {
     if (typeof document === "undefined") return;
     const handle_visibility = () => {
       if (document.visibilityState === "visible" && acquired && !sentinel_ref.current) {
@@ -8640,7 +8996,7 @@ function useWakeLock() {
     document.addEventListener("visibilitychange", handle_visibility);
     return () => document.removeEventListener("visibilitychange", handle_visibility);
   }, [acquired, request]);
-  React26.useEffect(() => {
+  React27.useEffect(() => {
     return () => {
       if (sentinel_ref.current) {
         void sentinel_ref.current.release().catch(() => void 0);
@@ -8651,8 +9007,8 @@ function useWakeLock() {
   return { supported, acquired, request, release };
 }
 function useFullscreen(elementRef) {
-  const [is_fullscreen, set_is_fullscreen] = React26.useState(false);
-  React26.useEffect(() => {
+  const [is_fullscreen, set_is_fullscreen] = React27.useState(false);
+  React27.useEffect(() => {
     if (typeof document === "undefined") return;
     const handle_change = () => {
       set_is_fullscreen(!!document.fullscreenElement);
@@ -8661,10 +9017,10 @@ function useFullscreen(elementRef) {
     set_is_fullscreen(!!document.fullscreenElement);
     return () => document.removeEventListener("fullscreenchange", handle_change);
   }, []);
-  const get_target = React26.useCallback(() => {
+  const get_target = React27.useCallback(() => {
     return elementRef?.current ?? document.documentElement;
   }, [elementRef]);
-  const enter = React26.useCallback(async () => {
+  const enter = React27.useCallback(async () => {
     if (typeof document === "undefined" || !document.documentElement.requestFullscreen) return;
     if (document.fullscreenElement) return;
     try {
@@ -8672,7 +9028,7 @@ function useFullscreen(elementRef) {
     } catch {
     }
   }, [get_target]);
-  const exit = React26.useCallback(async () => {
+  const exit = React27.useCallback(async () => {
     if (typeof document === "undefined") return;
     if (!document.fullscreenElement) return;
     try {
@@ -8680,7 +9036,7 @@ function useFullscreen(elementRef) {
     } catch {
     }
   }, []);
-  const toggle = React26.useCallback(async () => {
+  const toggle = React27.useCallback(async () => {
     if (document.fullscreenElement) {
       await exit();
     } else {
@@ -8691,13 +9047,13 @@ function useFullscreen(elementRef) {
 }
 function use_wake_lock(active) {
   const { acquired, request, release } = useWakeLock();
-  React26.useEffect(() => {
+  React27.useEffect(() => {
     if (active && !acquired) void request();
     if (!active && acquired) void release();
   }, [active, acquired, request, release]);
 }
 function use_fullscreen() {
-  const ref = React26.useRef(null);
+  const ref = React27.useRef(null);
   const { isFullscreen, toggle } = useFullscreen(ref);
   return { is_fullscreen: isFullscreen, toggle, ref };
 }
@@ -8744,6 +9100,9 @@ function KanbanCard({
       tabIndex: 0,
       "aria-roledescription": "draggable card",
       "aria-grabbed": isDragging,
+      onDoubleClick: () => {
+        if (showEdit && onEditRequest && !dragging) onEditRequest(item);
+      },
       children: [
         showEdit && onEditRequest && !dragging && /* @__PURE__ */ jsxRuntime.jsx(
           "button",
@@ -8850,29 +9209,29 @@ function KanbanEditor({
   onSave,
   onClose
 }) {
-  const [draft, set_draft] = React26__namespace.useState(item);
-  const [saving, set_saving] = React26__namespace.useState(false);
-  const [error, set_error] = React26__namespace.useState(null);
+  const [draft, set_draft] = React27__namespace.useState(item);
+  const [saving, set_saving] = React27__namespace.useState(false);
+  const [error, set_error] = React27__namespace.useState(null);
   const item_id = item?.id ?? null;
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     set_draft(item);
     set_error(null);
     set_saving(false);
   }, [item_id]);
   const resolved_columns = columns ?? [];
   const resolved_priorities = priorities ?? DEFAULT_PRIORITIES;
-  const resolved_fields = React26__namespace.useMemo(() => {
+  const resolved_fields = React27__namespace.useMemo(() => {
     if (fields) return fields;
     if (!item) return [];
     return auto_detect_fields(item, resolved_columns);
   }, [fields, item, resolved_columns]);
-  const required_keys = React26__namespace.useMemo(
+  const required_keys = React27__namespace.useMemo(
     () => resolved_fields.filter(
       (f) => f.required && (f.type === "text" || f.type === "textarea" || f.type === "number")
     ).map((f) => f.key),
     [resolved_fields]
   );
-  const all_required_filled = React26__namespace.useMemo(() => {
+  const all_required_filled = React27__namespace.useMemo(() => {
     if (!draft) return false;
     for (const key of required_keys) {
       const v = draft[key];
@@ -8881,7 +9240,7 @@ function KanbanEditor({
     }
     return true;
   }, [draft, required_keys]);
-  const is_dirty = React26__namespace.useMemo(() => {
+  const is_dirty = React27__namespace.useMemo(() => {
     if (!draft || !item) return false;
     try {
       return JSON.stringify(draft) !== JSON.stringify(item);
@@ -8889,7 +9248,7 @@ function KanbanEditor({
       return draft !== item;
     }
   }, [draft, item]);
-  const handle_save = React26__namespace.useCallback(async () => {
+  const handle_save = React27__namespace.useCallback(async () => {
     if (!draft || !item) return;
     if (saving) return;
     set_error(null);
@@ -9014,6 +9373,15 @@ function KanbanEditorFieldRow({
         onChange: (e) => set_value(e.target.value)
       }
     ),
+    field.type === "richtext" && /* @__PURE__ */ jsxRuntime.jsx(
+      HazoUiRte,
+      {
+        html: typeof value === "string" ? value : "",
+        min_height: "180px",
+        placeholder: field.placeholder,
+        on_change: (out) => set_value(out.html)
+      }
+    ),
     field.type === "textarea" && /* @__PURE__ */ jsxRuntime.jsx(
       Textarea,
       {
@@ -9108,11 +9476,11 @@ function HazoUiKanbanFilter({
   className
 }) {
   const is_controlled = value !== void 0;
-  const [internal, set_internal] = React26__namespace.useState(
+  const [internal, set_internal] = React27__namespace.useState(
     defaultValue ?? EMPTY_FILTER
   );
   const current = is_controlled ? value : internal;
-  const update = React26__namespace.useCallback(
+  const update = React27__namespace.useCallback(
     (next) => {
       if (!is_controlled) set_internal(next);
       onChange?.(next);
@@ -9275,29 +9643,29 @@ function HazoUiKanban({
   onCardSave,
   disableEdit = false
 }) {
-  const label_fn = React26__namespace.useCallback(
+  const label_fn = React27__namespace.useCallback(
     (item) => itemLabel ? itemLabel(item) : item.id,
     [itemLabel]
   );
-  const dnd_context_id = React26__namespace.useId();
-  const [overlay, set_overlay] = React26__namespace.useState(
+  const dnd_context_id = React27__namespace.useId();
+  const [overlay, set_overlay] = React27__namespace.useState(
     /* @__PURE__ */ new Map()
   );
-  const [active_id, set_active_id] = React26__namespace.useState(null);
-  const [active_tab, set_active_tab] = React26__namespace.useState(columns[0]?.key ?? "");
-  const [editing_item, set_editing_item] = React26__namespace.useState(null);
+  const [active_id, set_active_id] = React27__namespace.useState(null);
+  const [active_tab, set_active_tab] = React27__namespace.useState(columns[0]?.key ?? "");
+  const [editing_item, set_editing_item] = React27__namespace.useState(null);
   const show_edit = !disableEdit && typeof onCardSave === "function";
-  const handle_edit_request = React26__namespace.useCallback(
+  const handle_edit_request = React27__namespace.useCallback(
     (it) => {
       const typed = items.find((x) => x.id === it.id);
       if (typed) set_editing_item(typed);
     },
     [items]
   );
-  const handle_editor_close = React26__namespace.useCallback(() => {
+  const handle_editor_close = React27__namespace.useCallback(() => {
     set_editing_item(null);
   }, []);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (overlay.size === 0) return;
     set_overlay((prev) => {
       let changed = false;
@@ -9312,11 +9680,11 @@ function HazoUiKanban({
       return changed ? next : prev;
     });
   }, [items, overlay]);
-  const grouped = React26__namespace.useMemo(
+  const grouped = React27__namespace.useMemo(
     () => group_items_by_column(items, overlay, columns),
     [items, overlay, columns]
   );
-  const find_item = React26__namespace.useCallback(
+  const find_item = React27__namespace.useCallback(
     (id) => items.find((i) => i.id === id),
     [items]
   );
@@ -9324,7 +9692,7 @@ function HazoUiKanban({
     core$1.useSensor(core$1.PointerSensor, { activationConstraint: { distance: 5 } }),
     core$1.useSensor(core$1.KeyboardSensor, { coordinateGetter: sortable.sortableKeyboardCoordinates })
   );
-  const merged_announcements = React26__namespace.useMemo(() => {
+  const merged_announcements = React27__namespace.useMemo(() => {
     const defaults = default_announcements(label_fn);
     return {
       onDragStart: announcements?.onDragStart ?? defaults.onDragStart,
@@ -9333,7 +9701,7 @@ function HazoUiKanban({
       onDragCancel: announcements?.onDragCancel ?? defaults.onDragCancel
     };
   }, [announcements, label_fn]);
-  const dnd_announcements = React26__namespace.useMemo(
+  const dnd_announcements = React27__namespace.useMemo(
     () => ({
       onDragStart({ active }) {
         const id = String(active.id);
@@ -9391,10 +9759,10 @@ function HazoUiKanban({
     }),
     [find_item, columns, grouped, merged_announcements]
   );
-  const handle_drag_start = React26__namespace.useCallback((event) => {
+  const handle_drag_start = React27__namespace.useCallback((event) => {
     set_active_id(String(event.active.id));
   }, []);
-  const make_revert_handle = React26__namespace.useCallback(
+  const make_revert_handle = React27__namespace.useCallback(
     (item_id) => ({
       revert: () => {
         set_overlay((prev) => {
@@ -9407,7 +9775,7 @@ function HazoUiKanban({
     }),
     []
   );
-  const handle_drag_end = React26__namespace.useCallback(
+  const handle_drag_end = React27__namespace.useCallback(
     (event) => {
       const active_id_str = String(event.active.id);
       set_active_id(null);
@@ -9469,7 +9837,7 @@ function HazoUiKanban({
     },
     [find_item, columns, grouped, onMove, onReorder, make_revert_handle]
   );
-  const handle_drag_cancel = React26__namespace.useCallback(() => {
+  const handle_drag_cancel = React27__namespace.useCallback(() => {
     set_active_id(null);
   }, []);
   const active_item = active_id ? find_item(active_id) : null;
@@ -9560,7 +9928,7 @@ function HazoUiKanban({
     }
   );
 }
-var Table2 = React26__namespace.forwardRef(
+var Table2 = React27__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cls_table_wrap relative w-full overflow-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
     "table",
     {
@@ -9571,11 +9939,11 @@ var Table2 = React26__namespace.forwardRef(
   ) })
 );
 Table2.displayName = "Table";
-var TableHeader2 = React26__namespace.forwardRef(
+var TableHeader2 = React27__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("thead", { ref, className: cn("[&_tr]:border-b", className), ...props })
 );
 TableHeader2.displayName = "TableHeader";
-var TableBody = React26__namespace.forwardRef(
+var TableBody = React27__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "tbody",
     {
@@ -9586,7 +9954,7 @@ var TableBody = React26__namespace.forwardRef(
   )
 );
 TableBody.displayName = "TableBody";
-var TableFooter = React26__namespace.forwardRef(
+var TableFooter = React27__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "tfoot",
     {
@@ -9597,7 +9965,7 @@ var TableFooter = React26__namespace.forwardRef(
   )
 );
 TableFooter.displayName = "TableFooter";
-var TableRow2 = React26__namespace.forwardRef(
+var TableRow2 = React27__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "tr",
     {
@@ -9611,7 +9979,7 @@ var TableRow2 = React26__namespace.forwardRef(
   )
 );
 TableRow2.displayName = "TableRow";
-var TableHead = React26__namespace.forwardRef(
+var TableHead = React27__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "th",
     {
@@ -9625,7 +9993,7 @@ var TableHead = React26__namespace.forwardRef(
   )
 );
 TableHead.displayName = "TableHead";
-var TableCell2 = React26__namespace.forwardRef(
+var TableCell2 = React27__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "td",
     {
@@ -9636,7 +10004,7 @@ var TableCell2 = React26__namespace.forwardRef(
   )
 );
 TableCell2.displayName = "TableCell";
-var TableCaption = React26__namespace.forwardRef(
+var TableCaption = React27__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "caption",
     {
@@ -9691,64 +10059,64 @@ function TableMobileCards(props) {
 }
 var DEFAULT_DEBOUNCE_MS = 200;
 function useTableState(props) {
-  const [sortInternal, setSortInternal] = React26.useState(
+  const [sortInternal, setSortInternal] = React27.useState(
     () => normalizeSortProp(props.defaultSort)
   );
   const isSortControlled = props.sort !== void 0;
   const sort = isSortControlled ? normalizeSortProp(props.sort) : sortInternal;
-  const setSort = React26.useCallback(
+  const setSort = React27.useCallback(
     (next) => {
       if (!isSortControlled) setSortInternal(next);
       props.onSortChange?.(next);
     },
     [isSortControlled, props.onSortChange]
   );
-  const cycleHeaderSort = React26.useCallback(
+  const cycleHeaderSort = React27.useCallback(
     (key, append) => {
       const next = append ? cycleAppendColumn(sort, key) : cycleSingleColumn(sort, key);
       setSort(next);
     },
     [sort, setSort]
   );
-  const [filterInternal, setFilterInternal] = React26.useState(
+  const [filterInternal, setFilterInternal] = React27.useState(
     () => props.defaultFilter ?? {}
   );
   const isFilterControlled = props.filter !== void 0;
   const filter = isFilterControlled ? props.filter : filterInternal;
-  const setFilter = React26.useCallback(
+  const setFilter = React27.useCallback(
     (next) => {
       if (!isFilterControlled) setFilterInternal(next);
       props.onFilterChange?.(next);
     },
     [isFilterControlled, props.onFilterChange]
   );
-  const [searchDraft, setSearchDraft] = React26.useState(
+  const [searchDraft, setSearchDraft] = React27.useState(
     filter.search ?? ""
   );
   const debounceMs = props.searchDebounceMs ?? DEFAULT_DEBOUNCE_MS;
-  React26.useEffect(() => {
+  React27.useEffect(() => {
     const handle = setTimeout(() => {
       if (searchDraft === (filter.search ?? "")) return;
       setFilter({ ...filter, search: searchDraft || void 0 });
     }, debounceMs);
     return () => clearTimeout(handle);
   }, [searchDraft, debounceMs]);
-  const setSearch = React26.useCallback((s) => setSearchDraft(s), []);
-  const [pageInternal, setPageInternal] = React26.useState(
+  const setSearch = React27.useCallback((s) => setSearchDraft(s), []);
+  const [pageInternal, setPageInternal] = React27.useState(
     () => props.defaultPage ?? 0
   );
   const isPageControlled = props.page !== void 0;
   const page = isPageControlled ? props.page : pageInternal;
-  const setPage = React26.useCallback(
+  const setPage = React27.useCallback(
     (next) => {
       if (!isPageControlled) setPageInternal(next);
       props.onPageChange?.(next);
     },
     [isPageControlled, props.onPageChange]
   );
-  const prevSortKey = React26.useRef(serializeSort(sort));
-  const prevFilterKey = React26.useRef(serializeFilter(filter));
-  React26.useEffect(() => {
+  const prevSortKey = React27.useRef(serializeSort(sort));
+  const prevFilterKey = React27.useRef(serializeFilter(filter));
+  React27.useEffect(() => {
     const sk = serializeSort(sort);
     const fk = serializeFilter(filter);
     if (sk !== prevSortKey.current || fk !== prevFilterKey.current) {
@@ -9759,24 +10127,24 @@ function useTableState(props) {
   }, [sort, filter, isPageControlled]);
   const pageSize = props.pagination && typeof props.pagination === "object" ? props.pagination.pageSize : 0;
   const isServerMode = typeof props.onLoad === "function";
-  const filtered = React26.useMemo(
+  const filtered = React27.useMemo(
     () => isServerMode ? props.rows : applyFilter(props.rows, filter, props.columns),
     [props.rows, filter, props.columns, isServerMode]
   );
-  const sorted = React26.useMemo(
+  const sorted = React27.useMemo(
     () => isServerMode ? filtered : applySort(filtered, sort),
     [filtered, sort, isServerMode]
   );
-  const pagedInMemory = React26.useMemo(() => {
+  const pagedInMemory = React27.useMemo(() => {
     if (isServerMode || pageSize <= 0) return sorted;
     const start = page * pageSize;
     return sorted.slice(start, start + pageSize);
   }, [sorted, page, pageSize, isServerMode]);
-  const [serverRows, setServerRows] = React26.useState([]);
-  const [serverTotal, setServerTotal] = React26.useState(0);
-  const [serverError, setServerError] = React26.useState(null);
-  const reqIdRef = React26.useRef(0);
-  React26.useEffect(() => {
+  const [serverRows, setServerRows] = React27.useState([]);
+  const [serverTotal, setServerTotal] = React27.useState(0);
+  const [serverError, setServerError] = React27.useState(null);
+  const reqIdRef = React27.useRef(0);
+  React27.useEffect(() => {
     if (!isServerMode) return;
     const myId = ++reqIdRef.current;
     let cancelled = false;
@@ -10208,18 +10576,18 @@ function Toolbar2(props) {
     enableFilterDialog,
     searchPlaceholder
   } = props;
-  const sortFields = React26__namespace.useMemo(
+  const sortFields = React27__namespace.useMemo(
     () => deriveSortFields(columns),
     [columns]
   );
-  const filterFields = React26__namespace.useMemo(
+  const filterFields = React27__namespace.useMemo(
     () => deriveFilterFields(columns),
     [columns]
   );
-  const [searchValue, setSearchValue] = React26__namespace.useState(
+  const [searchValue, setSearchValue] = React27__namespace.useState(
     filter.search ?? ""
   );
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     setSearchValue(filter.search ?? "");
   }, [filter.search]);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cls_hazo_ui_table_toolbar flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between", children: [
@@ -10580,13 +10948,13 @@ function FunnelChart({
   showTooltip = true,
   className
 }) {
-  const [hover_idx, set_hover_idx] = React26__namespace.useState(null);
+  const [hover_idx, set_hover_idx] = React27__namespace.useState(null);
   const fmt = valueFormat ?? format_num;
   const totals = steps.map(step_total);
   const value_max = Math.max(1, ...totals);
   const plot_w = width - PAD_LEFT2 - PAD_RIGHT2;
   const vbox_h = height ?? PAD_TOP2 + steps.length * ROW_H + PAD_BOTTOM2;
-  const handle_mouse_move = React26__namespace.useCallback(
+  const handle_mouse_move = React27__namespace.useCallback(
     (e) => {
       if (steps.length === 0) return;
       const rect = e.currentTarget.getBoundingClientRect();
@@ -10601,7 +10969,7 @@ function FunnelChart({
     },
     [steps.length, vbox_h]
   );
-  const handle_mouse_leave = React26__namespace.useCallback(() => set_hover_idx(null), []);
+  const handle_mouse_leave = React27__namespace.useCallback(() => set_hover_idx(null), []);
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "svg",
     {
@@ -10789,21 +11157,21 @@ function celebrate(payload) {
   _enqueue(payload);
 }
 function CelebrationProvider({ children }) {
-  const [queue, set_queue] = React26__namespace.useState([]);
-  const enqueue = React26__namespace.useCallback((payload) => {
+  const [queue, set_queue] = React27__namespace.useState([]);
+  const enqueue = React27__namespace.useCallback((payload) => {
     const storage_key = `hazo_ui_celebration_${payload.id}`;
     if (typeof window !== "undefined" && sessionStorage.getItem(storage_key)) {
       return;
     }
     set_queue((q) => [...q, payload]);
   }, []);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     _enqueue = enqueue;
     return () => {
       _enqueue = null;
     };
   }, [enqueue]);
-  const handle_close = React26__namespace.useCallback(() => {
+  const handle_close = React27__namespace.useCallback(() => {
     set_queue((q) => q.slice(1));
   }, []);
   const current = queue[0] ?? null;
@@ -10832,14 +11200,14 @@ function CelebrationModalInner({
     autoDismissDelay = 8e3,
     audioChime = false
   } = payload;
-  const [visible, set_visible] = React26__namespace.useState(true);
-  const [is_downloading, set_is_downloading] = React26__namespace.useState(false);
-  const canvas_ref = React26__namespace.useRef(null);
-  const card_ref = React26__namespace.useRef(null);
-  React26__namespace.useEffect(() => {
+  const [visible, set_visible] = React27__namespace.useState(true);
+  const [is_downloading, set_is_downloading] = React27__namespace.useState(false);
+  const canvas_ref = React27__namespace.useRef(null);
+  const card_ref = React27__namespace.useRef(null);
+  React27__namespace.useEffect(() => {
     sessionStorage.setItem(`hazo_ui_celebration_${id}`, "1");
   }, [id]);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (!canvas_ref.current) return;
     let confetti_instance = null;
     import('canvas-confetti').then(({ default: confetti }) => {
@@ -10856,18 +11224,18 @@ function CelebrationModalInner({
       confetti_instance?.reset();
     };
   }, []);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (!audioChime) return;
     const audio = new Audio(celebration_chime_default);
     audio.play().catch(() => {
     });
   }, [audioChime]);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (!autoDismiss) return;
     const timer = window.setTimeout(close_modal, autoDismissDelay);
     return () => window.clearTimeout(timer);
   }, [autoDismiss, autoDismissDelay]);
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     const on_key = (e) => {
       if (e.key === "Escape") close_modal();
     };
@@ -11116,8 +11484,8 @@ function useEtaProgress(opts) {
     loadDurations,
     appendDuration
   } = opts;
-  const [value, setValue] = React26__namespace.useState(0);
-  const stateRef = React26__namespace.useRef({
+  const [value, setValue] = React27__namespace.useState(0);
+  const stateRef = React27__namespace.useRef({
     started: false,
     finished: false,
     startTime: 0,
@@ -11127,14 +11495,14 @@ function useEtaProgress(opts) {
     eta: 0,
     rafId: 0
   });
-  const stop = React26__namespace.useCallback(() => {
+  const stop = React27__namespace.useCallback(() => {
     if (stateRef.current.rafId) {
       cancelAnimationFrame(stateRef.current.rafId);
       stateRef.current.rafId = 0;
     }
   }, []);
-  React26__namespace.useEffect(() => stop, [stop]);
-  const tick = React26__namespace.useCallback(() => {
+  React27__namespace.useEffect(() => stop, [stop]);
+  const tick = React27__namespace.useCallback(() => {
     const s = stateRef.current;
     if (s.finished || !s.started) return;
     const elapsed = Date.now() - s.startTime;
@@ -11143,7 +11511,7 @@ function useEtaProgress(opts) {
     setValue(Math.max(timeValue, unitValue));
     s.rafId = requestAnimationFrame(tick);
   }, [unitCount]);
-  const start = React26__namespace.useCallback(() => {
+  const start = React27__namespace.useCallback(() => {
     const s = stateRef.current;
     if (s.started) return;
     const window2 = loadDurations();
@@ -11157,13 +11525,13 @@ function useEtaProgress(opts) {
     stop();
     s.rafId = requestAnimationFrame(tick);
   }, [loadDurations, unitCount, concurrency, fallbackUnitMs, stop, tick]);
-  const unitDone = React26__namespace.useCallback(() => {
+  const unitDone = React27__namespace.useCallback(() => {
     const s = stateRef.current;
     if (!s.started || s.finished) return;
     s.unitsDone = Math.min(s.unitsDone + 1, unitCount);
     s.unitTimestamps.push(Date.now());
   }, [unitCount]);
-  const finish = React26__namespace.useCallback(() => {
+  const finish = React27__namespace.useCallback(() => {
     const s = stateRef.current;
     if (s.finished) return;
     s.finished = true;
@@ -11191,14 +11559,14 @@ function HazoUiEtaProgress({
   handleRef,
   className
 }) {
-  const { value: stored, append } = client$1.useHazoState(estimateKey, {
+  const { value: stored, append } = client$2.useHazoState(estimateKey, {
     level,
     fallback: [],
     ...endpoint ? { endpoint } : {}
   });
   const durationWindow = Array.isArray(stored) ? stored : [];
-  const loadDurations = React26__namespace.useCallback(() => durationWindow, [durationWindow]);
-  const appendDuration = React26__namespace.useCallback(
+  const loadDurations = React27__namespace.useCallback(() => durationWindow, [durationWindow]);
+  const appendDuration = React27__namespace.useCallback(
     (ms) => {
       append(ms, windowSize);
     },
@@ -11211,7 +11579,7 @@ function HazoUiEtaProgress({
     loadDurations,
     appendDuration
   });
-  React26__namespace.useEffect(() => {
+  React27__namespace.useEffect(() => {
     if (handleRef) {
       handleRef.current = handle;
     }
@@ -11248,13 +11616,13 @@ function HazoUiMemoryDropdown({
   add_entry,
   empty_label = "No history yet"
 }) {
-  const { value: stored, setValue } = client$1.useHazoState(history_key, {
+  const { value: stored, setValue } = client$2.useHazoState(history_key, {
     level: "scope",
     fallback: []
   });
   const storedEntries = Array.isArray(stored) ? stored : [];
-  const [query, setQuery] = React26__namespace.useState("");
-  React26__namespace.useEffect(() => {
+  const [query, setQuery] = React27__namespace.useState("");
+  React27__namespace.useEffect(() => {
     if (!add_entry) return;
     const updated = upsertEntry(storedEntries, add_entry);
     setValue(updated);
@@ -11333,8 +11701,8 @@ function HazoUiMemoryDropdown({
   );
 }
 function EntryRow({ entry, on_select, onDelete }) {
-  const [deleteHovered, setDeleteHovered] = React26__namespace.useState(false);
-  const [rowHovered, setRowHovered] = React26__namespace.useState(false);
+  const [deleteHovered, setDeleteHovered] = React27__namespace.useState(false);
+  const [rowHovered, setRowHovered] = React27__namespace.useState(false);
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
@@ -11391,72 +11759,198 @@ function EntryRow({ entry, on_select, onDelete }) {
     }
   );
 }
-var ThemeContext = React26__namespace.createContext(void 0);
-function HazoThemeProvider({
-  children,
-  defaultTheme = "system",
-  storageKey = "theme"
+function Logo({
+  logoUrl,
+  logoUrlDark,
+  appTitle,
+  href,
+  height = 28,
+  className,
+  imgClassName
 }) {
-  const [theme, setTheme] = useLocalStorage(storageKey, defaultTheme);
-  const prefersDark = useMediaQuery("(prefers-color-scheme: dark)");
-  const resolvedTheme = theme === "system" ? prefersDark ? "dark" : "light" : theme;
-  React26__namespace.useEffect(() => {
-    document.documentElement.classList.toggle("dark", resolvedTheme === "dark");
-  }, [resolvedTheme]);
-  const toggleTheme = React26__namespace.useCallback(() => {
-    setTheme(resolvedTheme === "dark" ? "light" : "dark");
-  }, [resolvedTheme, setTheme]);
-  const value = React26__namespace.useMemo(
-    () => ({ theme, setTheme, resolvedTheme, toggleTheme }),
-    [theme, setTheme, resolvedTheme, toggleTheme]
-  );
-  return /* @__PURE__ */ jsxRuntime.jsx(ThemeContext.Provider, { value, children });
-}
-function useTheme() {
-  const context = React26__namespace.useContext(ThemeContext);
-  if (context === void 0) {
-    throw new Error("useTheme must be used within a <HazoThemeProvider>");
+  const alt = appTitle ?? "Logo";
+  let content = null;
+  if (logoUrl) {
+    content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "img",
+        {
+          src: logoUrl,
+          alt,
+          height,
+          style: { height },
+          className: cn("object-contain", logoUrlDark && "dark:hidden", imgClassName)
+        }
+      ),
+      logoUrlDark ? /* @__PURE__ */ jsxRuntime.jsx(
+        "img",
+        {
+          src: logoUrlDark,
+          alt,
+          height,
+          style: { height },
+          className: cn("hidden object-contain dark:block", imgClassName)
+        }
+      ) : null
+    ] });
+  } else if (appTitle) {
+    content = /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold text-navbar-fg", children: appTitle });
   }
-  return context;
+  if (content === null) return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {});
+  const resolvedHref = safeHref(href);
+  if (resolvedHref) {
+    return /* @__PURE__ */ jsxRuntime.jsx("a", { href: resolvedHref, className: cn("inline-flex items-center gap-2", className), children: content });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("inline-flex items-center gap-2", className), children: content });
 }
-function ThemeScript({ storageKey = "theme" }) {
-  const script = `(function(){try{var k=${JSON.stringify(
-    storageKey
-  )};var raw=localStorage.getItem(k);var t="system";if(raw){try{t=JSON.parse(raw);}catch(e){t=String(raw).replace(/^"|"$/g,"");}}var m=window.matchMedia("(prefers-color-scheme: dark)").matches;var isDark=t==="dark"||((t==="system"||!t)&&m);var c=document.documentElement.classList;if(isDark){c.add("dark");}else{c.remove("dark");}}catch(e){}})();`;
-  return /* @__PURE__ */ jsxRuntime.jsx("script", { dangerouslySetInnerHTML: { __html: script } });
+function AppHeader({ identity, homeHref, navItems, actions, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "header",
+    {
+      "aria-label": "Application header",
+      className: cn(
+        "flex w-full items-center justify-between gap-4 border-b bg-navbar text-navbar-fg border-navbar-border px-4 py-2.5",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            Logo,
+            {
+              logoUrl: identity?.logoUrl,
+              logoUrlDark: identity?.logoUrlDark,
+              appTitle: identity?.appTitle,
+              href: homeHref
+            }
+          ),
+          navItems
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-4", children: actions })
+      ]
+    }
+  );
 }
-var ThemeToggle = React26__namespace.forwardRef(
-  ({ className, ...props }, ref) => {
-    const { resolvedTheme, toggleTheme } = useTheme();
-    const [mounted, setMounted] = React26__namespace.useState(false);
-    React26__namespace.useEffect(() => {
-      setMounted(true);
-    }, []);
-    const isDark = mounted && resolvedTheme === "dark";
-    const label = isDark ? "Switch to light theme" : "Switch to dark theme";
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      "button",
+function AppFooter({ variant, footer, identity, className }) {
+  const cfg = footer ?? identity?.footer?.[variant];
+  if (variant === "app") {
+    const links = cfg?.columns?.[0]?.links;
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "footer",
       {
-        type: "button",
-        ref,
-        onClick: toggleTheme,
-        "aria-label": label,
         className: cn(
-          "inline-flex h-9 w-9 items-center justify-center rounded-full text-foreground transition-colors hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50",
+          "flex w-full items-center justify-between gap-4 border-t bg-footer-app text-footer-app-fg border-footer-app-border px-4 py-2 text-sm",
           className
         ),
-        ...props,
-        children: isDark ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Sun, { className: "h-4 w-4" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Moon, { className: "h-4 w-4" })
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-footer-app-fg-muted", children: cfg?.copyright }),
+          links && links.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-4", children: links.map((link, i) => /* @__PURE__ */ jsxRuntime.jsx(
+            "a",
+            {
+              href: safeHref(link.href),
+              className: "text-footer-app-fg-muted hover:text-footer-app-fg",
+              children: link.label
+            },
+            `${link.href}-${i}`
+          )) }) : null
+        ]
       }
     );
   }
-);
-ThemeToggle.displayName = "ThemeToggle";
+  const showBrandRow = Boolean(identity?.logoUrl || identity?.appTitle);
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "footer",
+    {
+      className: cn(
+        "w-full border-t bg-footer-public text-footer-public-fg border-footer-public-border px-6 py-10",
+        className
+      ),
+      children: [
+        showBrandRow ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-8", children: /* @__PURE__ */ jsxRuntime.jsx(
+          Logo,
+          {
+            logoUrl: identity?.logoUrl,
+            logoUrlDark: identity?.logoUrlDark,
+            appTitle: identity?.appTitle
+          }
+        ) }) : null,
+        cfg?.columns && cfg.columns.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 gap-8 md:grid-cols-4", children: cfg.columns.map((column, idx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
+          column.heading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-medium text-footer-public-fg", children: column.heading }) : null,
+          column.links.map((link, i) => /* @__PURE__ */ jsxRuntime.jsx(
+            "a",
+            {
+              href: safeHref(link.href),
+              className: "text-footer-public-fg-muted hover:text-footer-public-fg",
+              children: link.label
+            },
+            `${link.href}-${i}`
+          ))
+        ] }, column.heading ?? idx)) }) : null,
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-8 flex flex-wrap items-center justify-between gap-4", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-footer-public-fg-muted", children: cfg?.copyright }),
+          cfg?.social ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4", children: [
+            cfg.social.github ? /* @__PURE__ */ jsxRuntime.jsx(
+              "a",
+              {
+                href: safeHref(cfg.social.github),
+                className: "text-footer-public-fg-muted hover:text-footer-public-fg",
+                children: "GitHub"
+              }
+            ) : null,
+            cfg.social.twitter ? /* @__PURE__ */ jsxRuntime.jsx(
+              "a",
+              {
+                href: safeHref(cfg.social.twitter),
+                className: "text-footer-public-fg-muted hover:text-footer-public-fg",
+                children: "Twitter"
+              }
+            ) : null,
+            cfg.social.linkedin ? /* @__PURE__ */ jsxRuntime.jsx(
+              "a",
+              {
+                href: safeHref(cfg.social.linkedin),
+                className: "text-footer-public-fg-muted hover:text-footer-public-fg",
+                children: "LinkedIn"
+              }
+            ) : null,
+            cfg.social.website ? /* @__PURE__ */ jsxRuntime.jsx(
+              "a",
+              {
+                href: safeHref(cfg.social.website),
+                className: "text-footer-public-fg-muted hover:text-footer-public-fg",
+                children: "Website"
+              }
+            ) : null
+          ] }) : null
+        ] })
+      ]
+    }
+  );
+}
 
 Object.defineProperty(exports, "rawToast", {
   enumerable: true,
   get: function () { return sonner.toast; }
 });
+Object.defineProperty(exports, "HazoThemeProvider", {
+  enumerable: true,
+  get: function () { return client.HazoThemeProvider; }
+});
+Object.defineProperty(exports, "ThemeScript", {
+  enumerable: true,
+  get: function () { return client.ThemeScript; }
+});
+Object.defineProperty(exports, "ThemeSetPicker", {
+  enumerable: true,
+  get: function () { return client.ThemeSetPicker; }
+});
+Object.defineProperty(exports, "ThemeToggle", {
+  enumerable: true,
+  get: function () { return client.ThemeToggle; }
+});
+Object.defineProperty(exports, "useTheme", {
+  enumerable: true,
+  get: function () { return client.useTheme; }
+});
 exports.ANIMATION_PRESETS = ANIMATION_PRESETS;
 exports.Accordion = Accordion;
 exports.AccordionContent = AccordionContent;
@@ -11473,6 +11967,8 @@ exports.AlertDialogOverlay = AlertDialogOverlay;
 exports.AlertDialogPortal = AlertDialogPortal;
 exports.AlertDialogTitle = AlertDialogTitle;
 exports.AlertDialogTrigger = AlertDialogTrigger;
+exports.AppFooter = AppFooter;
+exports.AppHeader = AppHeader;
 exports.Button = Button;
 exports.ButtonGroup = ButtonGroup;
 exports.ButtonGroupSeparator = ButtonGroupSeparator;
@@ -11525,7 +12021,6 @@ exports.ErrorBanner = ErrorBanner;
 exports.ErrorPage = ErrorPage;
 exports.FunnelChart = FunnelChart;
 exports.HazoContextProvider = HazoContextProvider;
-exports.HazoThemeProvider = HazoThemeProvider;
 exports.HazoUiConfirmDialog = HazoUiConfirmDialog;
 exports.HazoUiDialog = HazoUiDialog;
 exports.HazoUiDialogClose = DialogClose;
@@ -11541,6 +12036,8 @@ exports.HazoUiDialogTrigger = DialogTrigger;
 exports.HazoUiEtaProgress = HazoUiEtaProgress;
 exports.HazoUiFlexInput = HazoUiFlexInput;
 exports.HazoUiFlexRadio = HazoUiFlexRadio;
+exports.HazoUiIcon = HazoUiIcon;
+exports.HazoUiIconPicker = HazoUiIconPicker;
 exports.HazoUiImageCropper = HazoUiImageCropper;
 exports.HazoUiImageCropperDialog = HazoUiImageCropperDialog;
 exports.HazoUiKanban = HazoUiKanban;
@@ -11563,6 +12060,7 @@ exports.InputAffix = InputAffix;
 exports.InverseSparkline = InverseSparkline;
 exports.Label = Label3;
 exports.LoadingTimeout = LoadingTimeout;
+exports.Logo = Logo;
 exports.MarkdownEditor = MarkdownEditor;
 exports.NotificationCountBadge = NotificationCountBadge;
 exports.NotificationItem = NotificationItem;
@@ -11615,8 +12113,6 @@ exports.TabsContent = TabsContent;
 exports.TabsList = TabsList;
 exports.TabsTrigger = TabsTrigger;
 exports.Textarea = Textarea;
-exports.ThemeScript = ThemeScript;
-exports.ThemeToggle = ThemeToggle;
 exports.Toggle = Toggle;
 exports.ToggleGroup = ToggleGroup;
 exports.ToggleGroupItem = ToggleGroupItem;
@@ -11636,11 +12132,13 @@ exports.format_num = format_num;
 exports.generateUUID = generateUUID;
 exports.get_hazo_ui_config = get_hazo_ui_config;
 exports.get_logger = get_logger;
+exports.isLucideValue = isLucideValue;
 exports.median = median;
 exports.parse_commands_from_text = parse_commands_from_text;
 exports.pick_x_label_indices = pick_x_label_indices;
 exports.reset_hazo_ui_config = reset_hazo_ui_config;
 exports.resolve_animation_classes = resolve_animation_classes;
+exports.safeHref = safeHref;
 exports.set_hazo_ui_config = set_hazo_ui_config;
 exports.set_logger = set_logger;
 exports.successToast = successToast;
@@ -11658,7 +12156,6 @@ exports.useLoadingState = useLoadingState;
 exports.useLocalStorage = useLocalStorage;
 exports.useMediaQuery = useMediaQuery;
 exports.useSessionStorage = useSessionStorage;
-exports.useTheme = useTheme;
 exports.useViewport = useViewport;
 exports.useWakeLock = useWakeLock;
 exports.use_fullscreen = use_fullscreen;