@pactor-app/ui 1.3.0 → 1.7.0

package/dist/components/index.cjs

@@ -51,6 +51,7 @@ __export(components_exports, {
   Content: () => Content,
   ContextMenu: () => ContextMenu2,
   DataTable: () => DataTable,
+  DatePicker: () => DatePicker,
   Dialog: () => Dialog2,
   Drawer: () => Drawer2,
   DropdownMenu: () => DropdownMenu2,
@@ -903,11 +904,11 @@ function Calendar({
           defaultClassNames.day_button
         ),
         selected: cn(
-          "[&>button]:bg-(--calendar-selected-background) [&>button]:text-(--calendar-selected-foreground) [&>button]:hover:bg-(--calendar-selected-background)",
+          "[&>button]:bg-(--calendar-selected-background) [&>button]:text-(--calendar-selected-foreground) [&>button]:hover:bg-(--calendar-selected-background) [&>button]:hover:text-(--calendar-selected-foreground)",
           defaultClassNames.selected
         ),
         today: cn(
-          "[&>button]:bg-(--calendar-today-background) [&>button]:text-(--calendar-today-foreground)",
+          "[&>button]:bg-(--calendar-today-background) [&>button]:text-(--calendar-today-foreground) [&>button]:hover:bg-(--calendar-today-background) [&>button]:hover:text-(--calendar-today-foreground) [&>button]:border [&>button]:border-(--calendar-today-border)",
           defaultClassNames.today
         ),
         outside: cn(
@@ -2550,34 +2551,323 @@ function DataTable({
   ] });
 }
 
-// src/components/components/Dialog/index.tsx
+// src/components/components/DatePicker/index.tsx
 var import_runtime7 = require("@pactor-app/runtime");
+var import_date_fns2 = require("date-fns");
+var import_locale = require("date-fns/locale");
+var import_lucide_react13 = require("lucide-react");
 var import_react11 = require("react");
+var import_jsx_runtime46 = require("react/jsx-runtime");
+function toDateFnsLocale(locale) {
+  switch (locale) {
+    case "zh-CN":
+      return import_locale.zhCN;
+    case "en-US":
+      return import_locale.enUS;
+    default:
+      return import_locale.enUS;
+  }
+}
+function parseDate(value) {
+  if (typeof value !== "string" || value === "") return void 0;
+  const date = (0, import_date_fns2.parseISO)(value);
+  return (0, import_date_fns2.isValid)(date) ? date : void 0;
+}
+function parseRange(value) {
+  if (typeof value !== "object" || value === null) return void 0;
+  const { start, end } = value;
+  const from = parseDate(start);
+  const to = parseDate(end);
+  return from && to ? { from, to } : void 0;
+}
+var RANGE_ENDPOINT_CLASSES = "[&>button]:bg-(--calendar-selected-background) [&>button]:text-(--calendar-selected-foreground) [&>button]:hover:bg-(--calendar-selected-background) [&>button]:hover:text-(--calendar-selected-foreground)";
+var IN_RANGE_CLASSES = "[&>button]:bg-(--calendar-range-background) [&>button]:text-(--calendar-range-foreground) [&>button]:rounded-none";
+function DatePicker(props) {
+  const {
+    name,
+    label,
+    rules,
+    placeholder,
+    disabled,
+    presets,
+    className,
+    style
+  } = props;
+  const mode = props.mode ?? "single";
+  const isRange = mode === "range";
+  const value = props.value;
+  const onChange = props.onChange;
+  const form = useFormContext();
+  const { locale, t } = (0, import_runtime7.useI18n)();
+  const dfLocale = toDateFnsLocale(locale);
+  const controlId = (0, import_react11.useId)();
+  const inForm = form?.inForm === true && typeof name === "string" && name !== "";
+  const [open, setOpen] = (0, import_react11.useState)(false);
+  (0, import_react11.useEffect)(() => {
+    if (inForm && form && name) {
+      form.registerField(name, rules, value);
+      return () => form.unregisterField(name);
+    }
+    return void 0;
+  });
+  const [innerValue, setInnerValue] = (0, import_react11.useState)(value);
+  (0, import_react11.useEffect)(() => {
+    if (!inForm) setInnerValue(value);
+  }, [inForm, value]);
+  const [pendingStart, setPendingStart] = (0, import_react11.useState)();
+  const [startMonth, setStartMonth] = (0, import_react11.useState)(
+    () => (0, import_date_fns2.startOfMonth)(/* @__PURE__ */ new Date())
+  );
+  const [endMonth, setEndMonth] = (0, import_react11.useState)(
+    () => (0, import_date_fns2.startOfMonth)((0, import_date_fns2.addMonths)(/* @__PURE__ */ new Date(), 1))
+  );
+  const current = inForm && form && name ? form.values[name] : innerValue;
+  const setPanelMonths = (start, end) => {
+    const s = (0, import_date_fns2.startOfMonth)(start);
+    const e = (0, import_date_fns2.startOfMonth)(end);
+    setStartMonth(s);
+    setEndMonth((0, import_date_fns2.isBefore)(e, (0, import_date_fns2.addMonths)(s, 1)) ? (0, import_date_fns2.addMonths)(s, 1) : e);
+  };
+  const handleStartMonthChange = (month) => {
+    const s = (0, import_date_fns2.startOfMonth)(month);
+    setStartMonth(s);
+    setEndMonth((prev) => (0, import_date_fns2.isBefore)(s, prev) ? prev : (0, import_date_fns2.addMonths)(s, 1));
+  };
+  const handleEndMonthChange = (month) => {
+    const e = (0, import_date_fns2.startOfMonth)(month);
+    setEndMonth(e);
+    setStartMonth((prev) => (0, import_date_fns2.isBefore)(prev, e) ? prev : (0, import_date_fns2.subMonths)(e, 1));
+  };
+  (0, import_react11.useEffect)(() => {
+    if (!isRange) return;
+    const parsed = parseRange(current);
+    setPendingStart(void 0);
+    setPanelMonths(
+      parsed?.from ?? /* @__PURE__ */ new Date(),
+      parsed?.to ?? (0, import_date_fns2.addMonths)(/* @__PURE__ */ new Date(), 1)
+    );
+  }, [isRange, current]);
+  const commit = (next) => {
+    if (inForm && form && name) {
+      form.setValue(name, next);
+    } else {
+      setInnerValue(next);
+    }
+    onChange?.(next);
+  };
+  const commitRange = (from, to) => {
+    commit({ start: (0, import_date_fns2.format)(from, "yyyy-MM-dd"), end: (0, import_date_fns2.format)(to, "yyyy-MM-dd") });
+  };
+  const handleSingleSelect = (date) => {
+    commit(date ? (0, import_date_fns2.format)(date, "yyyy-MM-dd") : void 0);
+  };
+  const parsedRange = isRange ? parseRange(current) : void 0;
+  const rangeStart = pendingStart ?? parsedRange?.from;
+  const rangeEnd = pendingStart !== void 0 ? void 0 : parsedRange?.to;
+  const handleRangeDaySelect = (date) => {
+    if (!date) return;
+    const day = (0, import_date_fns2.startOfDay)(date);
+    if (pendingStart) {
+      if ((0, import_date_fns2.isBefore)(day, pendingStart)) {
+        setPendingStart(day);
+      } else {
+        commitRange(pendingStart, day);
+      }
+    } else {
+      setPendingStart(day);
+    }
+  };
+  const presetList = presets === false ? [] : presets ?? (isRange ? [{ key: "today" }, { key: "thisWeek" }, { key: "thisMonth" }] : []);
+  const resolvePreset = (preset) => {
+    const now = /* @__PURE__ */ new Date();
+    if ("key" in preset) {
+      const key = preset.key;
+      const label2 = preset.label ?? t(`pactor.datePicker.${key}`);
+      if (key === "today") return { label: label2, from: now, to: now };
+      if (key === "thisWeek") {
+        return {
+          label: label2,
+          from: (0, import_date_fns2.startOfWeek)(now, { locale: dfLocale }),
+          to: (0, import_date_fns2.endOfWeek)(now, { locale: dfLocale })
+        };
+      }
+      return { label: label2, from: (0, import_date_fns2.startOfMonth)(now), to: (0, import_date_fns2.endOfMonth)(now) };
+    }
+    if ("days" in preset) {
+      return { label: preset.label, from: (0, import_date_fns2.subDays)(now, preset.days - 1), to: now };
+    }
+    return {
+      label: preset.label,
+      from: parseDate(preset.range.start) ?? now,
+      to: parseDate(preset.range.end) ?? now
+    };
+  };
+  const handlePresetClick = (preset, from, to) => {
+    if ("key" in preset && preset.key === "today") {
+      const today = (0, import_date_fns2.startOfDay)(/* @__PURE__ */ new Date());
+      if (isRange) {
+        setPendingStart(today);
+        setPanelMonths(today, (0, import_date_fns2.addMonths)(today, 1));
+      } else {
+        commit((0, import_date_fns2.format)(today, "yyyy-MM-dd"));
+      }
+      return;
+    }
+    commitRange(from, to);
+  };
+  const singleDate = isRange ? void 0 : parseDate(current);
+  const hasInnerRange = isRange && rangeStart !== void 0 && rangeEnd !== void 0 && (0, import_date_fns2.isBefore)((0, import_date_fns2.startOfDay)(rangeStart), (0, import_date_fns2.startOfDay)(rangeEnd));
+  const rangeModifiers = isRange ? {
+    ...rangeStart ? { rangeStart } : {},
+    ...rangeEnd ? { rangeEnd } : {},
+    ...hasInnerRange ? { inRange: { after: rangeStart, before: rangeEnd } } : {}
+  } : void 0;
+  const rangeModifierClassNames = rangeModifiers ? {
+    ...rangeStart ? { rangeStart: RANGE_ENDPOINT_CLASSES } : {},
+    ...rangeEnd ? { rangeEnd: RANGE_ENDPOINT_CLASSES } : {},
+    ...hasInnerRange ? { inRange: IN_RANGE_CLASSES } : {}
+  } : void 0;
+  const displayText = isRange ? typeof current === "object" && current !== null ? `${current.start} ~ ${current.end}` : "" : typeof current === "string" ? current : "";
+  const placeholderText = placeholder ?? t(isRange ? "pactor.datePicker.placeholderRange" : "pactor.datePicker.placeholder");
+  const calendar = isRange ? /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+      "div",
+      {
+        "data-slot": "datepicker-start-panel",
+        className: "border-r border-border",
+        children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+          Calendar,
+          {
+            mode: "single",
+            month: startMonth,
+            onMonthChange: handleStartMonthChange,
+            onSelect: handleRangeDaySelect,
+            modifiers: rangeModifiers,
+            modifiersClassNames: rangeModifierClassNames,
+            locale: dfLocale
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { "data-slot": "datepicker-end-panel", children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+      Calendar,
+      {
+        mode: "single",
+        month: endMonth,
+        onMonthChange: handleEndMonthChange,
+        onSelect: handleRangeDaySelect,
+        modifiers: rangeModifiers,
+        modifiersClassNames: rangeModifierClassNames,
+        locale: dfLocale
+      }
+    ) })
+  ] }) : /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+    Calendar,
+    {
+      mode: "single",
+      selected: singleDate,
+      onSelect: handleSingleSelect,
+      locale: dfLocale
+    }
+  );
+  const control = /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
+      PopoverTrigger,
+      {
+        id: controlId,
+        type: "button",
+        disabled,
+        "data-slot": "datepicker-trigger",
+        className: cn(
+          "flex h-9 w-full min-w-0 cursor-pointer items-center justify-between gap-2 rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-xs transition-colors outline-none hover:bg-accent focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50",
+          displayText === "" && "text-muted-foreground",
+          !inForm && className
+        ),
+        style: inForm ? void 0 : style,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: "min-w-0 flex-1 truncate text-left", children: displayText === "" ? placeholderText : displayText }),
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_lucide_react13.Calendar, { className: "size-4 shrink-0 opacity-50" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(PopoverContent, { className: "w-auto p-0", children: presetList.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+        "div",
+        {
+          "data-slot": "datepicker-presets",
+          className: "flex flex-col gap-1 border-r border-border p-3",
+          children: presetList.map((preset, index) => {
+            const resolved = resolvePreset(preset);
+            return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+              "button",
+              {
+                type: "button",
+                className: "cursor-pointer rounded-md px-3 py-1.5 text-left text-sm whitespace-nowrap hover:bg-accent hover:text-accent-foreground",
+                onClick: () => handlePresetClick(preset, resolved.from, resolved.to),
+                children: resolved.label
+              },
+              `${resolved.label}-${index}`
+            );
+          })
+        }
+      ),
+      calendar
+    ] }) : calendar })
+  ] });
+  if (inForm && form && name) {
+    const error = form.errors[name];
+    return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
+      "div",
+      {
+        "data-slot": "form-item",
+        className: cn(formItemClass(form.layout), className),
+        style,
+        children: [
+          label ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+            "label",
+            {
+              htmlFor: controlId,
+              className: "shrink-0 text-sm leading-none font-medium whitespace-nowrap",
+              children: label
+            }
+          ) : null,
+          control,
+          error ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { "data-slot": "form-error", className: "text-sm text-destructive", children: error }) : null
+        ]
+      }
+    );
+  }
+  return control;
+}
+
+// src/components/components/Dialog/index.tsx
+var import_runtime8 = require("@pactor-app/runtime");
+var import_react12 = require("react");
 
 // src/ui/dialog.tsx
 var import_dialog = require("@base-ui/react/dialog");
-var import_lucide_react13 = require("lucide-react");
-var import_jsx_runtime46 = require("react/jsx-runtime");
+var import_lucide_react14 = require("lucide-react");
+var import_jsx_runtime47 = require("react/jsx-runtime");
 function Dialog({
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_dialog.Dialog.Root, { "data-slot": "dialog", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_dialog.Dialog.Root, { "data-slot": "dialog", ...props });
 }
 function DialogTrigger({
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_dialog.Dialog.Trigger, { "data-slot": "dialog-trigger", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_dialog.Dialog.Trigger, { "data-slot": "dialog-trigger", ...props });
 }
 function DialogPortal({
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_dialog.Dialog.Portal, { "data-slot": "dialog-portal", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_dialog.Dialog.Portal, { "data-slot": "dialog-portal", ...props });
 }
 function DialogOverlay({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
     import_dialog.Dialog.Backdrop,
     {
       "data-slot": "dialog-overlay",
@@ -2595,9 +2885,9 @@ function DialogContent({
   showCloseButton = true,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(DialogPortal, { "data-slot": "dialog-portal", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(DialogOverlay, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(DialogPortal, { "data-slot": "dialog-portal", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(DialogOverlay, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
       import_dialog.Dialog.Popup,
       {
         "data-slot": "dialog-content",
@@ -2608,11 +2898,11 @@ function DialogContent({
         ...props,
         children: [
           children,
-          showCloseButton && /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
+          showCloseButton && /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
             import_dialog.Dialog.Close,
             {
               "data-slot": "dialog-close",
-              render: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+              render: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
                 "button",
                 {
                   type: "button",
@@ -2620,8 +2910,8 @@ function DialogContent({
                 }
               ),
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_lucide_react13.XIcon, {}),
-                /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: "sr-only", children: "Close" })
+                /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_lucide_react14.XIcon, {}),
+                /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: "sr-only", children: "Close" })
               ]
             }
           )
@@ -2631,7 +2921,7 @@ function DialogContent({
   ] });
 }
 function DialogHeader({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
     "div",
     {
       "data-slot": "dialog-header",
@@ -2644,7 +2934,7 @@ function DialogTitle({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
     import_dialog.Dialog.Title,
     {
       "data-slot": "dialog-title",
@@ -2657,7 +2947,7 @@ function DialogDescription({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
     import_dialog.Dialog.Description,
     {
       "data-slot": "dialog-description",
@@ -2668,7 +2958,7 @@ function DialogDescription({
 }
 
 // src/components/components/Dialog/index.tsx
-var import_jsx_runtime47 = require("react/jsx-runtime");
+var import_jsx_runtime48 = require("react/jsx-runtime");
 function Dialog2({
   title,
   description,
@@ -2679,11 +2969,11 @@ function Dialog2({
   className,
   style
 }) {
-  const { renderChildren } = (0, import_runtime7.useRenderer)();
-  const [innerOpen, setInnerOpen] = (0, import_react11.useState)(false);
+  const { renderChildren } = (0, import_runtime8.useRenderer)();
+  const [innerOpen, setInnerOpen] = (0, import_react12.useState)(false);
   const controlled = open !== void 0;
   const visible = controlled ? open : innerOpen;
-  return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
     Dialog,
     {
       open: visible,
@@ -2696,7 +2986,7 @@ function Dialog2({
         }
       },
       children: [
-        trigger ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+        trigger ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
           DialogTrigger,
           {
             nativeButton: false,
@@ -2704,10 +2994,10 @@ function Dialog2({
             children: renderChildren([trigger])
           }
         ) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(DialogContent, { className, style, children: [
-          title || description ? /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(DialogHeader, { children: [
-            title ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(DialogTitle, { children: title }) : null,
-            description ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(DialogDescription, { children: description }) : null
+        /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(DialogContent, { className, style, children: [
+          title || description ? /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(DialogHeader, { children: [
+            title ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(DialogTitle, { children: title }) : null,
+            description ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(DialogDescription, { children: description }) : null
           ] }) : null,
           children
         ] })
@@ -2718,22 +3008,22 @@ function Dialog2({
 
 // src/ui/drawer.tsx
 var import_vaul = require("vaul");
-var import_jsx_runtime48 = require("react/jsx-runtime");
+var import_jsx_runtime49 = require("react/jsx-runtime");
 function Drawer({
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_vaul.Drawer.Root, { "data-slot": "drawer", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_vaul.Drawer.Root, { "data-slot": "drawer", ...props });
 }
 function DrawerPortal({
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_vaul.Drawer.Portal, { "data-slot": "drawer-portal", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_vaul.Drawer.Portal, { "data-slot": "drawer-portal", ...props });
 }
 function DrawerOverlay({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
     import_vaul.Drawer.Overlay,
     {
       "data-slot": "drawer-overlay",
@@ -2747,9 +3037,9 @@ function DrawerContent({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(DrawerPortal, { "data-slot": "drawer-portal", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(DrawerOverlay, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(DrawerPortal, { "data-slot": "drawer-portal", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(DrawerOverlay, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(
       import_vaul.Drawer.Content,
       {
         "data-slot": "drawer-content",
@@ -2763,7 +3053,7 @@ function DrawerContent({
         ),
         ...props,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full bg-muted group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }),
+          /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full bg-muted group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }),
           children
         ]
       }
@@ -2771,7 +3061,7 @@ function DrawerContent({
   ] });
 }
 function DrawerHeader({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
     "div",
     {
       "data-slot": "drawer-header",
@@ -2784,7 +3074,7 @@ function DrawerTitle({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
     import_vaul.Drawer.Title,
     {
       "data-slot": "drawer-title",
@@ -2795,7 +3085,7 @@ function DrawerTitle({
 }
 
 // src/components/components/Drawer/index.tsx
-var import_jsx_runtime49 = require("react/jsx-runtime");
+var import_jsx_runtime50 = require("react/jsx-runtime");
 function Drawer2({
   title,
   open,
@@ -2805,7 +3095,7 @@ function Drawer2({
   className,
   style
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
     Drawer,
     {
       direction: placement,
@@ -2815,9 +3105,9 @@ function Drawer2({
           onClose?.();
         }
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(DrawerContent, { className, style, children: [
-        title ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(DrawerHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(DrawerTitle, { children: title }) }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "flex-1 overflow-auto p-4", children })
+      children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(DrawerContent, { className, style, children: [
+        title ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(DrawerHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(DrawerTitle, { children: title }) }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "flex-1 overflow-auto p-4", children })
       ] })
     }
   );
@@ -2825,17 +3115,17 @@ function Drawer2({
 
 // src/ui/dropdown-menu.tsx
 var import_menu = require("@base-ui/react/menu");
-var import_lucide_react14 = require("lucide-react");
-var import_jsx_runtime50 = require("react/jsx-runtime");
+var import_lucide_react15 = require("lucide-react");
+var import_jsx_runtime51 = require("react/jsx-runtime");
 function DropdownMenu({
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_menu.Menu.Root, { "data-slot": "dropdown-menu", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_menu.Menu.Root, { "data-slot": "dropdown-menu", ...props });
 }
 function DropdownMenuTrigger({
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_menu.Menu.Trigger, { "data-slot": "dropdown-menu-trigger", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_menu.Menu.Trigger, { "data-slot": "dropdown-menu-trigger", ...props });
 }
 function DropdownMenuContent({
   className,
@@ -2844,14 +3134,14 @@ function DropdownMenuContent({
   sideOffset = 4,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_menu.Menu.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_menu.Menu.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
     import_menu.Menu.Positioner,
     {
       align,
       side,
       sideOffset,
       className: "isolate z-50",
-      children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
         import_menu.Menu.Popup,
         {
           "data-slot": "dropdown-menu-content",
@@ -2870,7 +3160,7 @@ function DropdownMenuItem({
   variant = "default",
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
     import_menu.Menu.Item,
     {
       "data-slot": "dropdown-menu-item",
@@ -2886,14 +3176,14 @@ function DropdownMenuItem({
 function DropdownMenuSub({
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_menu.Menu.SubmenuRoot, { "data-slot": "dropdown-menu-sub", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_menu.Menu.SubmenuRoot, { "data-slot": "dropdown-menu-sub", ...props });
 }
 function DropdownMenuSubTrigger({
   className,
   children,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
     import_menu.Menu.SubmenuTrigger,
     {
       "data-slot": "dropdown-menu-sub-trigger",
@@ -2904,7 +3194,7 @@ function DropdownMenuSubTrigger({
       ...props,
       children: [
         children,
-        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_lucide_react14.ChevronRightIcon, { className: "ml-auto" })
+        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_lucide_react15.ChevronRightIcon, { className: "ml-auto" })
       ]
     }
   );
@@ -2914,7 +3204,7 @@ function DropdownMenuSubContent({
   sideOffset = 2,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_menu.Menu.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_menu.Menu.Positioner, { sideOffset, className: "isolate z-50", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_menu.Menu.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_menu.Menu.Positioner, { sideOffset, className: "isolate z-50", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
     import_menu.Menu.Popup,
     {
       "data-slot": "dropdown-menu-sub-content",
@@ -2928,7 +3218,7 @@ function DropdownMenuSubContent({
 }
 
 // src/components/components/DropdownMenu/index.tsx
-var import_jsx_runtime51 = require("react/jsx-runtime");
+var import_jsx_runtime52 = require("react/jsx-runtime");
 function DropdownMenu2({
   items = [],
   onSelect,
@@ -2936,8 +3226,8 @@ function DropdownMenu2({
   className,
   style
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(DropdownMenu, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(DropdownMenu, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
       DropdownMenuTrigger,
       {
         nativeButton: false,
@@ -2945,14 +3235,14 @@ function DropdownMenu2({
         children
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(DropdownMenuContent, { className, style, children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(DropdownMenuContent, { className, style, children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
       DropdownMenuItem,
       {
         variant: item.danger ? "destructive" : "default",
         disabled: item.disabled,
         onClick: () => onSelect?.(item.value),
         children: [
-          item.icon ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
+          item.icon ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
           item.label
         ]
       },
@@ -2962,9 +3252,9 @@ function DropdownMenu2({
 }
 
 // src/ui/empty.tsx
-var import_jsx_runtime52 = require("react/jsx-runtime");
+var import_jsx_runtime53 = require("react/jsx-runtime");
 function Empty({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
     "div",
     {
       "data-slot": "empty",
@@ -2977,7 +3267,7 @@ function Empty({ className, ...props }) {
   );
 }
 function EmptyHeader({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
     "div",
     {
       "data-slot": "empty-header",
@@ -2987,7 +3277,7 @@ function EmptyHeader({ className, ...props }) {
   );
 }
 function EmptyTitle({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
     "div",
     {
       "data-slot": "empty-title",
@@ -2997,7 +3287,7 @@ function EmptyTitle({ className, ...props }) {
   );
 }
 function EmptyDescription({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
     "p",
     {
       "data-slot": "empty-description",
@@ -3007,7 +3297,7 @@ function EmptyDescription({ className, ...props }) {
   );
 }
 function EmptyContent({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
     "div",
     {
       "data-slot": "empty-content",
@@ -3021,22 +3311,22 @@ function EmptyContent({ className, ...props }) {
 }
 
 // src/components/components/Empty/index.tsx
-var import_jsx_runtime53 = require("react/jsx-runtime");
+var import_jsx_runtime54 = require("react/jsx-runtime");
 function Empty2({ title, description, children, className, style }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(Empty, { className, style, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(EmptyHeader, { children: [
-      title ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(EmptyTitle, { children: title }) : null,
-      description ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(EmptyDescription, { children: description }) : null
+  return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(Empty, { className, style, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(EmptyHeader, { children: [
+      title ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(EmptyTitle, { children: title }) : null,
+      description ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(EmptyDescription, { children: description }) : null
     ] }),
-    children ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(EmptyContent, { children }) : null
+    children ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(EmptyContent, { children }) : null
   ] });
 }
 
 // src/ui/field.tsx
 var import_field = require("@base-ui/react/field");
-var import_jsx_runtime54 = require("react/jsx-runtime");
+var import_jsx_runtime55 = require("react/jsx-runtime");
 function Field({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
     import_field.Field.Root,
     {
       "data-slot": "field",
@@ -3046,7 +3336,7 @@ function Field({ className, ...props }) {
   );
 }
 function FieldLabel({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
     import_field.Field.Label,
     {
       "data-slot": "field-label",
@@ -3056,7 +3346,7 @@ function FieldLabel({ className, ...props }) {
   );
 }
 function FieldDescription({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
     import_field.Field.Description,
     {
       "data-slot": "field-description",
@@ -3066,7 +3356,7 @@ function FieldDescription({ className, ...props }) {
   );
 }
 function FieldError({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
     import_field.Field.Error,
     {
       "data-slot": "field-error",
@@ -3077,18 +3367,18 @@ function FieldError({ className, ...props }) {
 }
 
 // src/components/components/Field/index.tsx
-var import_jsx_runtime55 = require("react/jsx-runtime");
+var import_jsx_runtime56 = require("react/jsx-runtime");
 function Field2({ label, description, error, children, className, style }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(Field, { className, style, children: [
-    label ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(FieldLabel, { children: label }) : null,
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(Field, { className, style, children: [
+    label ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(FieldLabel, { children: label }) : null,
     children,
-    description ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(FieldDescription, { children: description }) : null,
-    error ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(FieldError, { match: true, children: error }) : null
+    description ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(FieldDescription, { children: description }) : null,
+    error ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(FieldError, { match: true, children: error }) : null
   ] });
 }
 
 // src/components/components/Flex/index.tsx
-var import_jsx_runtime56 = require("react/jsx-runtime");
+var import_jsx_runtime57 = require("react/jsx-runtime");
 var gapClass = {
   small: "gap-(--flex-gap-sm)",
   middle: "gap-(--flex-gap-md)",
@@ -3118,7 +3408,7 @@ function Flex({
   style,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
     "div",
     {
       "data-slot": "flex",
@@ -3138,9 +3428,9 @@ function Flex({
 }
 
 // src/components/components/Footer/index.tsx
-var import_jsx_runtime57 = require("react/jsx-runtime");
+var import_jsx_runtime58 = require("react/jsx-runtime");
 function Footer({ className, style, children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
     "footer",
     {
       "data-slot": "layout-footer",
@@ -3155,9 +3445,9 @@ function Footer({ className, style, children }) {
 }
 
 // src/components/components/Form/index.tsx
-var import_runtime8 = require("@pactor-app/runtime");
-var import_react12 = require("react");
-var import_jsx_runtime58 = require("react/jsx-runtime");
+var import_runtime9 = require("@pactor-app/runtime");
+var import_react13 = require("react");
+var import_jsx_runtime59 = require("react/jsx-runtime");
 function isEmpty(value) {
   return value === void 0 || value === null || value === "";
 }
@@ -3171,23 +3461,23 @@ function Form({
   onSubmit,
   onValuesChange
 }) {
-  const { context } = (0, import_runtime8.useRenderer)();
-  const [values, setValues] = (0, import_react12.useState)(() => ({
+  const { context } = (0, import_runtime9.useRenderer)();
+  const [values, setValues] = (0, import_react13.useState)(() => ({
     ...initialValues
   }));
-  const [errors, setErrors] = (0, import_react12.useState)({});
-  const fieldRulesRef = (0, import_react12.useRef)(/* @__PURE__ */ new Map());
-  const mergedInitialFieldsRef = (0, import_react12.useRef)(/* @__PURE__ */ new Set());
-  const setValuesBatch = (0, import_react12.useCallback)((partial) => {
+  const [errors, setErrors] = (0, import_react13.useState)({});
+  const fieldRulesRef = (0, import_react13.useRef)(/* @__PURE__ */ new Map());
+  const mergedInitialFieldsRef = (0, import_react13.useRef)(/* @__PURE__ */ new Set());
+  const setValuesBatch = (0, import_react13.useCallback)((partial) => {
     setValues((prev) => ({ ...prev, ...partial }));
   }, []);
-  (0, import_react12.useEffect)(() => {
+  (0, import_react13.useEffect)(() => {
     context.forms.register(name, { setValues: setValuesBatch });
     return () => {
       context.forms.unregister(name);
     };
   }, [context, name, setValuesBatch]);
-  const formContext = (0, import_react12.useMemo)(
+  const formContext = (0, import_react13.useMemo)(
     () => ({
       inForm: true,
       layout,
@@ -3238,7 +3528,7 @@ function Form({
     context.state.set("form", values);
     onSubmit?.(values);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(FormContextProvider, { value: formContext, children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(FormContextProvider, { value: formContext, children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
     "form",
     {
       "data-slot": "form",
@@ -3251,11 +3541,11 @@ function Form({
 }
 
 // src/components/components/Grid/index.tsx
-var import_react13 = require("react");
-var import_jsx_runtime59 = require("react/jsx-runtime");
+var import_react14 = require("react");
+var import_jsx_runtime60 = require("react/jsx-runtime");
 function Grid({ columns = 1, gap, className, style, children }) {
   const cols = Math.max(1, columns);
-  return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
     "div",
     {
       "data-slot": "grid",
@@ -3266,15 +3556,15 @@ function Grid({ columns = 1, gap, className, style, children }) {
         ...gap !== void 0 ? { gap } : {},
         ...style
       },
-      children: import_react13.Children.map(children, (child, index) => /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { "data-slot": "grid-item", children: child }, index))
+      children: import_react14.Children.map(children, (child, index) => /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { "data-slot": "grid-item", children: child }, index))
     }
   );
 }
 
 // src/components/components/Header/index.tsx
-var import_runtime9 = require("@pactor-app/runtime");
-var import_lucide_react15 = require("lucide-react");
-var import_jsx_runtime60 = require("react/jsx-runtime");
+var import_runtime10 = require("@pactor-app/runtime");
+var import_lucide_react16 = require("lucide-react");
+var import_jsx_runtime61 = require("react/jsx-runtime");
 var menuItemClass = "flex items-center gap-1 rounded-md px-3 py-2 text-sm transition-colors text-muted-foreground hover:bg-accent/50 hover:text-foreground";
 function Header({
   logo,
@@ -3305,10 +3595,10 @@ function Header({
     className
   );
   if (!hasBrand && !dropdown && !hasMenu && !hasUser && !hasLocales) {
-    return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("header", { "data-slot": "layout-header", className: rootClass, style, children });
+    return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("header", { "data-slot": "layout-header", className: rootClass, style, children });
   }
-  const brandNode = hasBrand && /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { "data-slot": "header-brand", className: "flex items-center gap-2", children: [
-    logo !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+  const brandNode = hasBrand && /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { "data-slot": "header-brand", className: "flex items-center gap-2", children: [
+    logo !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
       "img",
       {
         "data-slot": "header-brand-logo",
@@ -3317,23 +3607,23 @@ function Header({
         className: "h-8 w-8 shrink-0 object-contain"
       }
     ),
-    title !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { "data-slot": "header-brand-title", className: "text-base font-semibold", children: title })
+    title !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("span", { "data-slot": "header-brand-title", className: "text-base font-semibold", children: title })
   ] });
-  const dropdownNode = dropdown !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(HeaderDropdownArea, { dropdown, onSelect: onDropdownSelect });
+  const dropdownNode = dropdown !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(HeaderDropdownArea, { dropdown, onSelect: onDropdownSelect });
   const showLeft = brandLeft || dropdownLeft || hasMenu;
   const showRight = dropdownRight || brandRight || hasLocales || hasUser;
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("header", { "data-slot": "layout-header", className: rootClass, style, children: [
-    showLeft && /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { "data-slot": "header-left", className: "flex items-center gap-4", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("header", { "data-slot": "layout-header", className: rootClass, style, children: [
+    showLeft && /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { "data-slot": "header-left", className: "flex items-center gap-4", children: [
       brandLeft && brandNode,
       dropdownLeft && dropdownNode,
-      hasMenu && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(HeaderMenuArea, { items: menu, onSelect: onMenuSelect })
+      hasMenu && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(HeaderMenuArea, { items: menu, onSelect: onMenuSelect })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { "data-slot": "header-center", className: "flex flex-1 items-center gap-4", children }),
-    showRight && /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { "data-slot": "header-right", className: "flex items-center gap-4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { "data-slot": "header-center", className: "flex flex-1 items-center gap-4", children }),
+    showRight && /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { "data-slot": "header-right", className: "flex items-center gap-4", children: [
       dropdownRight && dropdownNode,
       brandRight && brandNode,
-      hasLocales && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(HeaderLocalesArea, { locales, onSelect: onLocaleChange }),
-      hasUser && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(HeaderUserArea, { user, onSelect: onUserSelect })
+      hasLocales && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(HeaderLocalesArea, { locales, onSelect: onLocaleChange }),
+      hasUser && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(HeaderUserArea, { user, onSelect: onUserSelect })
     ] })
   ] });
 }
@@ -3341,25 +3631,25 @@ function HeaderDropdownArea({
   dropdown,
   onSelect
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(DropdownMenu, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(DropdownMenu, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
       DropdownMenuTrigger,
       {
         "data-slot": "header-dropdown",
         className: cn(menuItemClass, "outline-hidden cursor-pointer"),
         children: [
           dropdown.label,
-          /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_lucide_react15.ChevronDownIcon, { className: "size-3.5", "aria-hidden": "true" })
+          /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_lucide_react16.ChevronDownIcon, { className: "size-3.5", "aria-hidden": "true" })
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(DropdownMenuContent, { children: dropdown.items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(DropdownMenuContent, { children: dropdown.items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
       DropdownMenuItem,
       {
         disabled: item.disabled,
         onClick: () => onSelect?.(item.value),
         children: [
-          item.icon ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
+          item.icon ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
           item.label
         ]
       },
@@ -3371,23 +3661,23 @@ function HeaderMenuArea({
   items,
   onSelect
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("nav", { "data-slot": "header-menu", className: "flex items-center gap-1", children: items.map(
-    (item) => item.children !== void 0 && item.children.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(DropdownMenu, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("nav", { "data-slot": "header-menu", className: "flex items-center gap-1", children: items.map(
+    (item) => item.children !== void 0 && item.children.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(DropdownMenu, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
         DropdownMenuTrigger,
         {
           "data-slot": "header-menu-item",
           "data-key": item.key,
           className: cn(menuItemClass, "outline-hidden cursor-pointer"),
           children: [
-            item.icon ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
+            item.icon ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
             item.label,
-            /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_lucide_react15.ChevronDownIcon, { className: "size-3.5", "aria-hidden": "true" })
+            /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_lucide_react16.ChevronDownIcon, { className: "size-3.5", "aria-hidden": "true" })
           ]
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(DropdownMenuContent, { children: item.children.map((child) => /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(HeaderMenuEntry, { item: child, onSelect }, child.key)) })
-    ] }, item.key) : /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(DropdownMenuContent, { children: item.children.map((child) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(HeaderMenuEntry, { item: child, onSelect }, child.key)) })
+    ] }, item.key) : /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
       "button",
       {
         type: "button",
@@ -3396,7 +3686,7 @@ function HeaderMenuArea({
         className: menuItemClass,
         onClick: () => onSelect?.(item.key),
         children: [
-          item.icon ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
+          item.icon ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
           item.label
         ]
       },
@@ -3409,16 +3699,16 @@ function HeaderMenuEntry({
   onSelect
 }) {
   if (item.children !== void 0 && item.children.length > 0) {
-    return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(DropdownMenuSub, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(DropdownMenuSubTrigger, { "data-key": item.key, className: "cursor-pointer", children: [
-        item.icon ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
+    return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(DropdownMenuSub, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(DropdownMenuSubTrigger, { "data-key": item.key, className: "cursor-pointer", children: [
+        item.icon ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
         item.label
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(DropdownMenuSubContent, { children: item.children.map((child) => /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(HeaderMenuEntry, { item: child, onSelect }, child.key)) })
+      /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(DropdownMenuSubContent, { children: item.children.map((child) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(HeaderMenuEntry, { item: child, onSelect }, child.key)) })
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(DropdownMenuItem, { "data-key": item.key, onClick: () => onSelect?.(item.key), children: [
-    item.icon ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(DropdownMenuItem, { "data-key": item.key, onClick: () => onSelect?.(item.key), children: [
+    item.icon ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
     item.label
   ] });
 }
@@ -3426,18 +3716,18 @@ function HeaderUserArea({
   user,
   onSelect
 }) {
-  const identity = /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(import_jsx_runtime60.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(Avatar, { className: "size-7", children: [
-      user.avatar !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(AvatarImage, { src: user.avatar, alt: user.name }),
-      /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(AvatarFallback, { children: user.name.charAt(0) })
+  const identity = /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_jsx_runtime61.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(Avatar, { className: "size-7", children: [
+      user.avatar !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(AvatarImage, { src: user.avatar, alt: user.name }),
+      /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(AvatarFallback, { children: user.name.charAt(0) })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "text-sm", children: user.name })
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("span", { className: "text-sm", children: user.name })
   ] });
   if (user.items === void 0 || user.items.length === 0) {
-    return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("div", { "data-slot": "header-user", className: "flex items-center gap-2", children: identity });
+    return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { "data-slot": "header-user", className: "flex items-center gap-2", children: identity });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(DropdownMenu, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(DropdownMenu, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
       DropdownMenuTrigger,
       {
         "data-slot": "header-user",
@@ -3445,8 +3735,8 @@ function HeaderUserArea({
         children: identity
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(DropdownMenuContent, { align: "end", children: user.items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(DropdownMenuItem, { onClick: () => onSelect?.(item.value), children: [
-      item.icon ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(DropdownMenuContent, { align: "end", children: user.items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(DropdownMenuItem, { onClick: () => onSelect?.(item.value), children: [
+      item.icon ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
       item.label
     ] }, item.value)) })
   ] });
@@ -3455,21 +3745,21 @@ function HeaderLocalesArea({
   locales,
   onSelect
 }) {
-  const { locale } = (0, import_runtime9.useI18n)();
+  const { locale } = (0, import_runtime10.useI18n)();
   const current = locales.find((option) => option.value === locale);
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(DropdownMenu, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(DropdownMenu, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
       DropdownMenuTrigger,
       {
         "data-slot": "header-locales",
         className: cn(menuItemClass, "outline-hidden cursor-pointer"),
         children: [
           current?.label ?? locale,
-          /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_lucide_react15.ChevronDownIcon, { className: "size-3.5", "aria-hidden": "true" })
+          /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_lucide_react16.ChevronDownIcon, { className: "size-3.5", "aria-hidden": "true" })
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(DropdownMenuContent, { align: "end", children: locales.map((option) => /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(DropdownMenuContent, { align: "end", children: locales.map((option) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
       DropdownMenuItem,
       {
         onClick: () => onSelect?.(option.value),
@@ -3481,20 +3771,20 @@ function HeaderLocalesArea({
 }
 
 // src/components/components/HoverCard/index.tsx
-var import_runtime10 = require("@pactor-app/runtime");
+var import_runtime11 = require("@pactor-app/runtime");
 
 // src/ui/hover-card.tsx
 var import_preview_card = require("@base-ui/react/preview-card");
-var import_jsx_runtime61 = require("react/jsx-runtime");
+var import_jsx_runtime62 = require("react/jsx-runtime");
 function HoverCard({
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_preview_card.PreviewCard.Root, { "data-slot": "hover-card", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_preview_card.PreviewCard.Root, { "data-slot": "hover-card", ...props });
 }
 function HoverCardTrigger({
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_preview_card.PreviewCard.Trigger, { "data-slot": "hover-card-trigger", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_preview_card.PreviewCard.Trigger, { "data-slot": "hover-card-trigger", ...props });
 }
 function HoverCardContent({
   className,
@@ -3503,14 +3793,14 @@ function HoverCardContent({
   sideOffset = 4,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_preview_card.PreviewCard.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_preview_card.PreviewCard.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
     import_preview_card.PreviewCard.Positioner,
     {
       align,
       side,
       sideOffset,
       className: "isolate z-50",
-      children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
         import_preview_card.PreviewCard.Popup,
         {
           "data-slot": "hover-card-content",
@@ -3526,21 +3816,21 @@ function HoverCardContent({
 }
 
 // src/components/components/HoverCard/index.tsx
-var import_jsx_runtime62 = require("react/jsx-runtime");
+var import_jsx_runtime63 = require("react/jsx-runtime");
 function isDslNode2(value) {
   return typeof value === "object" && value !== null && typeof value.type === "string";
 }
 function HoverCard2({ content, children, className, style }) {
-  const { renderChildren } = (0, import_runtime10.useRenderer)();
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(HoverCard, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(HoverCardTrigger, { render: triggerWrapper("hover-card-trigger-wrap"), children }),
-    /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(HoverCardContent, { className, style, children: isDslNode2(content) ? renderChildren([content]) : content })
+  const { renderChildren } = (0, import_runtime11.useRenderer)();
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(HoverCard, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(HoverCardTrigger, { render: triggerWrapper("hover-card-trigger-wrap"), children }),
+    /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(HoverCardContent, { className, style, children: isDslNode2(content) ? renderChildren([content]) : content })
   ] });
 }
 
 // src/components/components/Input/index.tsx
-var import_react14 = require("react");
-var import_jsx_runtime63 = require("react/jsx-runtime");
+var import_react15 = require("react");
+var import_jsx_runtime64 = require("react/jsx-runtime");
 function Input2({
   name,
   label,
@@ -3554,9 +3844,9 @@ function Input2({
   style
 }) {
   const form = useFormContext();
-  const controlId = (0, import_react14.useId)();
+  const controlId = (0, import_react15.useId)();
   const inForm = form?.inForm === true && typeof name === "string" && name !== "";
-  (0, import_react14.useEffect)(() => {
+  (0, import_react15.useEffect)(() => {
     if (inForm && form && name) {
       form.registerField(name, rules, value);
       return () => form.unregisterField(name);
@@ -3566,14 +3856,14 @@ function Input2({
   if (inForm && form && name) {
     const fieldValue = form.values[name];
     const error = form.errors[name];
-    return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(
       "div",
       {
         "data-slot": "form-item",
         className: cn(formItemClass(form.layout), className),
         style,
         children: [
-          label ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+          label ? /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
             "label",
             {
               htmlFor: controlId,
@@ -3581,7 +3871,7 @@ function Input2({
               children: label
             }
           ) : null,
-          /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
             Input,
             {
               id: controlId,
@@ -3595,12 +3885,12 @@ function Input2({
               }
             }
           ),
-          error ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { "data-slot": "form-error", className: "text-sm text-destructive", children: error }) : null
+          error ? /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("div", { "data-slot": "form-error", className: "text-sm text-destructive", children: error }) : null
         ]
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
     Input,
     {
       type,
@@ -3615,9 +3905,9 @@ function Input2({
 }
 
 // src/ui/input-group.tsx
-var import_jsx_runtime64 = require("react/jsx-runtime");
+var import_jsx_runtime65 = require("react/jsx-runtime");
 function InputGroup({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
     "div",
     {
       "data-slot": "input-group",
@@ -3636,25 +3926,25 @@ function InputGroup({ className, ...props }) {
 }
 
 // src/components/components/InputGroup/index.tsx
-var import_jsx_runtime65 = require("react/jsx-runtime");
+var import_jsx_runtime66 = require("react/jsx-runtime");
 function InputGroup2({ className, style, children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(InputGroup, { className, style, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(InputGroup, { className, style, children });
 }
 
 // src/components/components/InputOTP/index.tsx
-var import_react15 = require("react");
+var import_react16 = require("react");
 
 // src/ui/input-otp.tsx
 var import_input_otp = require("input-otp");
-var import_lucide_react16 = require("lucide-react");
+var import_lucide_react17 = require("lucide-react");
 var React3 = __toESM(require("react"), 1);
-var import_jsx_runtime66 = require("react/jsx-runtime");
+var import_jsx_runtime67 = require("react/jsx-runtime");
 function InputOTP({
   className,
   containerClassName,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
     import_input_otp.OTPInput,
     {
       "data-slot": "input-otp",
@@ -3668,7 +3958,7 @@ function InputOTP({
   );
 }
 function InputOTPGroup({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
     "div",
     {
       "data-slot": "input-otp-group",
@@ -3684,7 +3974,7 @@ function InputOTPSlot({
 }) {
   const inputOTPContext = React3.useContext(import_input_otp.OTPInputContext);
   const { char, hasFakeCaret, isActive } = inputOTPContext?.slots[index] ?? {};
-  return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(
     "div",
     {
       "data-slot": "input-otp-slot",
@@ -3696,14 +3986,14 @@ function InputOTPSlot({
       ...props,
       children: [
         char,
-        hasFakeCaret ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "h-4 w-px animate-caret-blink bg-foreground duration-1000" }) }) : null
+        hasFakeCaret ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: "h-4 w-px animate-caret-blink bg-foreground duration-1000" }) }) : null
       ]
     }
   );
 }
 
 // src/components/components/InputOTP/index.tsx
-var import_jsx_runtime67 = require("react/jsx-runtime");
+var import_jsx_runtime68 = require("react/jsx-runtime");
 function InputOTP2({
   name,
   label,
@@ -3718,15 +4008,15 @@ function InputOTP2({
 }) {
   const form = useFormContext();
   const inForm = form?.inForm === true && typeof name === "string" && name !== "";
-  (0, import_react15.useEffect)(() => {
+  (0, import_react16.useEffect)(() => {
     if (inForm && form && name) {
       form.registerField(name, rules, value);
       return () => form.unregisterField(name);
     }
     return void 0;
   });
-  const [innerValue, setInnerValue] = (0, import_react15.useState)(typeof value === "string" ? value : "");
-  (0, import_react15.useEffect)(() => {
+  const [innerValue, setInnerValue] = (0, import_react16.useState)(typeof value === "string" ? value : "");
+  (0, import_react16.useEffect)(() => {
     if (!inForm) setInnerValue(typeof value === "string" ? value : "");
   }, [inForm, value]);
   const current = inForm && form && name ? typeof form.values[name] === "string" ? form.values[name] : "" : innerValue;
@@ -3741,42 +4031,42 @@ function InputOTP2({
       onComplete?.(next);
     }
   };
-  const control = /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+  const control = /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
     InputOTP,
     {
       maxLength: length,
       value: current,
       onChange: handleChange,
       disabled,
-      children: /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(InputOTPGroup, { children: Array.from({ length }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(InputOTPSlot, { index }, index)) })
+      children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(InputOTPGroup, { children: Array.from({ length }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(InputOTPSlot, { index }, index)) })
     }
   );
   if (inForm && form && name) {
     const error = form.errors[name];
-    return /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
       "div",
       {
         "data-slot": "form-item",
         className: cn(formItemClass(form.layout), className),
         style,
         children: [
-          label ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("label", { className: "shrink-0 text-sm leading-none font-medium whitespace-nowrap", children: label }) : null,
+          label ? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("label", { className: "shrink-0 text-sm leading-none font-medium whitespace-nowrap", children: label }) : null,
           control,
-          error ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { "data-slot": "form-error", className: "text-sm text-destructive", children: error }) : null
+          error ? /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { "data-slot": "form-error", className: "text-sm text-destructive", children: error }) : null
         ]
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { "data-slot": "input-otp-field", className: cn("inline-block", className), style, children: control });
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("div", { "data-slot": "input-otp-field", className: cn("inline-block", className), style, children: control });
 }
 
 // src/components/components/Item/index.tsx
-var import_runtime11 = require("@pactor-app/runtime");
+var import_runtime12 = require("@pactor-app/runtime");
 
 // src/ui/item.tsx
-var import_jsx_runtime68 = require("react/jsx-runtime");
+var import_jsx_runtime69 = require("react/jsx-runtime");
 function Item({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
     "div",
     {
       "data-slot": "item",
@@ -3789,7 +4079,7 @@ function Item({ className, ...props }) {
   );
 }
 function ItemMedia({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
     "div",
     {
       "data-slot": "item-media",
@@ -3802,7 +4092,7 @@ function ItemMedia({ className, ...props }) {
   );
 }
 function ItemContent({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
     "div",
     {
       "data-slot": "item-content",
@@ -3812,7 +4102,7 @@ function ItemContent({ className, ...props }) {
   );
 }
 function ItemTitle({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
     "div",
     {
       "data-slot": "item-title",
@@ -3822,7 +4112,7 @@ function ItemTitle({ className, ...props }) {
   );
 }
 function ItemDescription({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
     "p",
     {
       "data-slot": "item-description",
@@ -3832,7 +4122,7 @@ function ItemDescription({ className, ...props }) {
   );
 }
 function ItemActions({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
     "div",
     {
       "data-slot": "item-actions",
@@ -3843,7 +4133,7 @@ function ItemActions({ className, ...props }) {
 }
 
 // src/components/components/Item/index.tsx
-var import_jsx_runtime69 = require("react/jsx-runtime");
+var import_jsx_runtime70 = require("react/jsx-runtime");
 function Item2({
   title,
   description,
@@ -3852,22 +4142,22 @@ function Item2({
   className,
   style
 }) {
-  const { renderChildren } = (0, import_runtime11.useRenderer)();
+  const { renderChildren } = (0, import_runtime12.useRenderer)();
   const mediaNodes = media === void 0 ? [] : Array.isArray(media) ? media : [media];
-  return /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(Item, { className, style, children: [
-    mediaNodes.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ItemMedia, { children: renderChildren(mediaNodes) }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(ItemContent, { children: [
-      title ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ItemTitle, { children: title }) : null,
-      description ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ItemDescription, { children: description }) : null
+  return /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(Item, { className, style, children: [
+    mediaNodes.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(ItemMedia, { children: renderChildren(mediaNodes) }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(ItemContent, { children: [
+      title ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(ItemTitle, { children: title }) : null,
+      description ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(ItemDescription, { children: description }) : null
     ] }),
-    actions && actions.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(ItemActions, { children: renderChildren(actions) }) : null
+    actions && actions.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(ItemActions, { children: renderChildren(actions) }) : null
   ] });
 }
 
 // src/ui/kbd.tsx
-var import_jsx_runtime70 = require("react/jsx-runtime");
+var import_jsx_runtime71 = require("react/jsx-runtime");
 function Kbd({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
     "kbd",
     {
       "data-slot": "kbd",
@@ -3881,18 +4171,18 @@ function Kbd({ className, ...props }) {
 }
 
 // src/components/components/Kbd/index.tsx
-var import_jsx_runtime71 = require("react/jsx-runtime");
+var import_jsx_runtime72 = require("react/jsx-runtime");
 function Kbd2({ text, className, style }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Kbd, { className, style, children: text });
+  return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(Kbd, { className, style, children: text });
 }
 
 // src/ui/label.tsx
-var import_jsx_runtime72 = require("react/jsx-runtime");
+var import_jsx_runtime73 = require("react/jsx-runtime");
 function Label({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
     "label",
     {
       "data-slot": "label",
@@ -3906,22 +4196,22 @@ function Label({
 }
 
 // src/components/components/Label/index.tsx
-var import_jsx_runtime73 = require("react/jsx-runtime");
+var import_jsx_runtime74 = require("react/jsx-runtime");
 function Label2({ text, htmlFor, className, style }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(Label, { htmlFor, className, style, children: text });
+  return /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(Label, { htmlFor, className, style, children: text });
 }
 
 // src/components/components/Layout/index.tsx
 var import_core = require("@pactor-app/core");
-var import_runtime12 = require("@pactor-app/runtime");
-var import_jsx_runtime74 = require("react/jsx-runtime");
+var import_runtime13 = require("@pactor-app/runtime");
+var import_jsx_runtime75 = require("react/jsx-runtime");
 function Layout({ direction, className, style, dslChildren }) {
-  const { renderChildren, context } = (0, import_runtime12.useRenderer)();
+  const { renderChildren, context } = (0, import_runtime13.useRenderer)();
   const hasSider = Array.isArray(dslChildren) ? dslChildren.some(
     (child) => !(0, import_core.isDslSourceRef)(child) && resolveRootType(child, context) === "Sider"
   ) : false;
   const dir = direction ?? (hasSider ? "horizontal" : "vertical");
-  return /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
     "div",
     {
       "data-slot": "layout",
@@ -3945,9 +4235,9 @@ function resolveRootType(node, context) {
 }
 
 // src/components/components/Link/index.tsx
-var import_jsx_runtime75 = require("react/jsx-runtime");
+var import_jsx_runtime76 = require("react/jsx-runtime");
 function Link2({ href, text, target, className, style, children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
     "a",
     {
       "data-slot": "link",
@@ -3961,14 +4251,17 @@ function Link2({ href, text, target, className, style, children }) {
   );
 }
 
+// src/components/components/Menu/index.tsx
+var import_react19 = require("react");
+
 // src/ui/tooltip.tsx
 var import_tooltip = require("@base-ui/react/tooltip");
-var import_jsx_runtime76 = require("react/jsx-runtime");
+var import_jsx_runtime77 = require("react/jsx-runtime");
 function TooltipProvider({
   delay = 0,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
     import_tooltip.Tooltip.Provider,
     {
       "data-slot": "tooltip-provider",
@@ -3980,12 +4273,12 @@ function TooltipProvider({
 function Tooltip2({
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(TooltipProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(import_tooltip.Tooltip.Root, { "data-slot": "tooltip", ...props }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(TooltipProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(import_tooltip.Tooltip.Root, { "data-slot": "tooltip", ...props }) });
 }
 function TooltipTrigger({
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(import_tooltip.Tooltip.Trigger, { "data-slot": "tooltip-trigger", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(import_tooltip.Tooltip.Trigger, { "data-slot": "tooltip-trigger", ...props });
 }
 function TooltipContent({
   className,
@@ -3995,14 +4288,14 @@ function TooltipContent({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(import_tooltip.Tooltip.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(import_tooltip.Tooltip.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
     import_tooltip.Tooltip.Positioner,
     {
       align,
       side,
       sideOffset,
       className: "isolate z-50",
-      children: /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(
         import_tooltip.Tooltip.Popup,
         {
           "data-slot": "tooltip-content",
@@ -4013,7 +4306,7 @@ function TooltipContent({
           ...props,
           children: [
             children,
-            /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(import_tooltip.Tooltip.Arrow, { className: "z-50 size-2.5 rotate-45 rounded-[2px] bg-primary fill-primary data-[side=top]:-bottom-1 data-[side=bottom]:-top-1 data-[side=left]:-right-1 data-[side=right]:-left-1" })
+            /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(import_tooltip.Tooltip.Arrow, { className: "z-50 size-2.5 rotate-45 rounded-[2px] bg-primary fill-primary data-[side=top]:-bottom-1 data-[side=bottom]:-top-1 data-[side=left]:-right-1 data-[side=right]:-left-1" })
           ]
         }
       )
@@ -4022,34 +4315,34 @@ function TooltipContent({
 }
 
 // src/components/components/Sidebar/rail-tooltip.tsx
-var import_jsx_runtime77 = require("react/jsx-runtime");
+var import_jsx_runtime78 = require("react/jsx-runtime");
 function RailTooltip({
   label,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(Tooltip2, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(TooltipTrigger, { render: children }),
-    /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(TooltipContent, { side: "right", sideOffset: 8, children: label })
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(Tooltip2, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(TooltipTrigger, { render: children }),
+    /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(TooltipContent, { side: "right", sideOffset: 8, children: label })
   ] });
 }
 
 // src/components/components/Sidebar/index.tsx
-var import_runtime13 = require("@pactor-app/runtime");
-var import_react17 = require("react");
+var import_runtime14 = require("@pactor-app/runtime");
+var import_react18 = require("react");
 
 // src/ui/sidebar.tsx
 var React4 = __toESM(require("react"), 1);
 var import_class_variance_authority5 = require("class-variance-authority");
-var import_lucide_react18 = require("lucide-react");
+var import_lucide_react19 = require("lucide-react");
 
 // src/hooks/use-mobile.ts
-var import_react16 = require("react");
+var import_react17 = require("react");
 var MOBILE_MEDIA_QUERY = "(max-width: 767px)";
 function useIsMobile() {
-  const [isMobile, setIsMobile] = (0, import_react16.useState)(
+  const [isMobile, setIsMobile] = (0, import_react17.useState)(
     () => typeof window !== "undefined" && typeof window.matchMedia === "function" && window.matchMedia(MOBILE_MEDIA_QUERY).matches
   );
-  (0, import_react16.useEffect)(() => {
+  (0, import_react17.useEffect)(() => {
     if (typeof window.matchMedia !== "function") {
       return;
     }
@@ -4066,14 +4359,14 @@ function useIsMobile() {
 
 // src/ui/separator.tsx
 var import_separator = require("@base-ui/react/separator");
-var import_jsx_runtime78 = require("react/jsx-runtime");
+var import_jsx_runtime79 = require("react/jsx-runtime");
 function Separator({
   className,
   orientation = "horizontal",
   decorative: _decorative,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
     import_separator.Separator,
     {
       "data-slot": "separator",
@@ -4089,24 +4382,24 @@ function Separator({
 
 // src/ui/sheet.tsx
 var import_dialog3 = require("@base-ui/react/dialog");
-var import_lucide_react17 = require("lucide-react");
+var import_lucide_react18 = require("lucide-react");
 var import_class_variance_authority4 = require("class-variance-authority");
-var import_jsx_runtime79 = require("react/jsx-runtime");
+var import_jsx_runtime80 = require("react/jsx-runtime");
 function Sheet({
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(import_dialog3.Dialog.Root, { "data-slot": "sheet", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(import_dialog3.Dialog.Root, { "data-slot": "sheet", ...props });
 }
 function SheetPortal({
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(import_dialog3.Dialog.Portal, { "data-slot": "sheet-portal", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(import_dialog3.Dialog.Portal, { "data-slot": "sheet-portal", ...props });
 }
 function SheetOverlay({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
     import_dialog3.Dialog.Backdrop,
     {
       "data-slot": "sheet-overlay",
@@ -4140,9 +4433,9 @@ function SheetContent({
   side = "right",
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)(SheetPortal, { "data-slot": "sheet-portal", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(SheetOverlay, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(SheetPortal, { "data-slot": "sheet-portal", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(SheetOverlay, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(
       import_dialog3.Dialog.Popup,
       {
         "data-slot": "sheet-content",
@@ -4150,11 +4443,11 @@ function SheetContent({
         ...props,
         children: [
           children,
-          /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(
             import_dialog3.Dialog.Close,
             {
               "data-slot": "sheet-close",
-              render: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+              render: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
                 "button",
                 {
                   type: "button",
@@ -4162,8 +4455,8 @@ function SheetContent({
                 }
               ),
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(import_lucide_react17.XIcon, {}),
-                /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("span", { className: "sr-only", children: "Close" })
+                /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(import_lucide_react18.XIcon, {}),
+                /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: "sr-only", children: "Close" })
               ]
             }
           )
@@ -4173,7 +4466,7 @@ function SheetContent({
   ] });
 }
 function SheetHeader({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
     "div",
     {
       "data-slot": "sheet-header",
@@ -4186,7 +4479,7 @@ function SheetTitle({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
     import_dialog3.Dialog.Title,
     {
       "data-slot": "sheet-title",
@@ -4199,7 +4492,7 @@ function SheetDescription({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
     import_dialog3.Dialog.Description,
     {
       "data-slot": "sheet-description",
@@ -4210,9 +4503,9 @@ function SheetDescription({
 }
 
 // src/ui/skeleton.tsx
-var import_jsx_runtime80 = require("react/jsx-runtime");
+var import_jsx_runtime81 = require("react/jsx-runtime");
 function Skeleton({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
     "div",
     {
       "data-slot": "skeleton",
@@ -4223,7 +4516,7 @@ function Skeleton({ className, ...props }) {
 }
 
 // src/ui/sidebar.tsx
-var import_jsx_runtime81 = require("react/jsx-runtime");
+var import_jsx_runtime82 = require("react/jsx-runtime");
 var SIDEBAR_COOKIE_NAME = "sidebar_state";
 var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
 var SIDEBAR_WIDTH = "16rem";
@@ -4289,7 +4582,7 @@ function SidebarProvider({
     }),
     [state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(TooltipProvider, { delay: 0, children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(TooltipProvider, { delay: 0, children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
     "div",
     {
       "data-slot": "sidebar-wrapper",
@@ -4317,7 +4610,7 @@ function SidebarRoot({
 }) {
   const { isMobile, state, openMobile, setOpenMobile } = useSidebar();
   if (collapsible === "none") {
-    return /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
       "div",
       {
         "data-slot": "sidebar",
@@ -4331,7 +4624,7 @@ function SidebarRoot({
     );
   }
   if (isMobile) {
-    return /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(Sheet, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Sheet, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
       SheetContent,
       {
         "data-sidebar": "sidebar",
@@ -4343,16 +4636,16 @@ function SidebarRoot({
         },
         side,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(SheetHeader, { className: "sr-only", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(SheetTitle, { children: "Sidebar" }),
-            /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(SheetDescription, { children: "Displays the mobile sidebar." })
+          /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(SheetHeader, { className: "sr-only", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(SheetTitle, { children: "Sidebar" }),
+            /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(SheetDescription, { children: "Displays the mobile sidebar." })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("div", { className: "flex h-full w-full flex-col", children })
+          /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "flex h-full w-full flex-col", children })
         ]
       }
     ) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
     "div",
     {
       className: "group peer hidden text-sidebar-foreground md:block",
@@ -4362,7 +4655,7 @@ function SidebarRoot({
       "data-side": side,
       "data-slot": "sidebar",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
           "div",
           {
             "data-slot": "sidebar-gap",
@@ -4374,7 +4667,7 @@ function SidebarRoot({
             )
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
           "div",
           {
             "data-slot": "sidebar-container",
@@ -4385,7 +4678,7 @@ function SidebarRoot({
               className
             ),
             ...props,
-            children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
               "div",
               {
                 "data-sidebar": "sidebar",
@@ -4401,7 +4694,7 @@ function SidebarRoot({
   );
 }
 function SidebarInset({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
     "main",
     {
       "data-slot": "sidebar-inset",
@@ -4415,7 +4708,7 @@ function SidebarInset({ className, ...props }) {
   );
 }
 function SidebarHeader({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
     "div",
     {
       "data-slot": "sidebar-header",
@@ -4426,7 +4719,7 @@ function SidebarHeader({ className, ...props }) {
   );
 }
 function SidebarFooter({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
     "div",
     {
       "data-slot": "sidebar-footer",
@@ -4437,7 +4730,7 @@ function SidebarFooter({ className, ...props }) {
   );
 }
 function SidebarContent({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
     "div",
     {
       "data-slot": "sidebar-content",
@@ -4464,7 +4757,7 @@ function renderAsChild(children, dataSlot, className, rest) {
   });
 }
 function SidebarMenu({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
     "ul",
     {
       "data-slot": "sidebar-menu",
@@ -4475,7 +4768,7 @@ function SidebarMenu({ className, ...props }) {
   );
 }
 function SidebarMenuItem({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
     "li",
     {
       "data-slot": "sidebar-menu-item",
@@ -4522,7 +4815,7 @@ function SidebarMenuButton({
     "data-size": size,
     "data-active": isActive,
     ...props
-  }) : /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
+  }) : /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
     "button",
     {
       "data-slot": "sidebar-menu-button",
@@ -4542,9 +4835,9 @@ function SidebarMenuButton({
       children: tooltip
     };
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(Tooltip2, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(TooltipTrigger, { render: button }),
-    /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(Tooltip2, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(TooltipTrigger, { render: button }),
+    /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
       TooltipContent,
       {
         side: "right",
@@ -4557,7 +4850,7 @@ function SidebarMenuButton({
 }
 
 // src/components/components/Sidebar/index.tsx
-var import_jsx_runtime82 = require("react/jsx-runtime");
+var import_jsx_runtime83 = require("react/jsx-runtime");
 function useSidebarDrawer() {
   try {
     const ctx = useSidebar();
@@ -4571,7 +4864,7 @@ function useSidebarDrawer() {
 }
 function useOptionalRenderer() {
   try {
-    return (0, import_runtime13.useRenderer)();
+    return (0, import_runtime14.useRenderer)();
   } catch {
     return null;
   }
@@ -4579,9 +4872,9 @@ function useOptionalRenderer() {
 function SidebarContentSlot({ content }) {
   const renderer = useOptionalRenderer();
   if (renderer !== null && typeof content === "object" && content !== null && !("$$typeof" in content) && "type" in content) {
-    return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(import_jsx_runtime82.Fragment, { children: renderer.renderChildren([content]) });
+    return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(import_jsx_runtime83.Fragment, { children: renderer.renderChildren([content]) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(import_jsx_runtime82.Fragment, { children: content });
+  return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(import_jsx_runtime83.Fragment, { children: content });
 }
 function isBrandObject(brand) {
   return typeof brand === "object" && brand !== null && !("$$typeof" in brand) && "title" in brand;
@@ -4591,8 +4884,8 @@ function BrandNode({ brand, collapsed }) {
     return null;
   }
   if (isBrandObject(brand)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(import_jsx_runtime82.Fragment, { children: [
-      brand.logo ? /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(import_jsx_runtime83.Fragment, { children: [
+      brand.logo ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
         "img",
         {
           "data-slot": "sidebar-brand-logo",
@@ -4601,27 +4894,27 @@ function BrandNode({ brand, collapsed }) {
           className: "size-6 shrink-0"
         }
       ) : null,
-      collapsed ? null : /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "truncate text-sm font-semibold", children: brand.title })
+      collapsed ? null : /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: "truncate text-sm font-semibold", children: brand.title })
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(import_jsx_runtime82.Fragment, { children: brand });
+  return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(import_jsx_runtime83.Fragment, { children: brand });
 }
 function SidebarNavItems({ items }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(SidebarMenu, { children: items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(SidebarNavEntry, { item, depth: 0 }, item.href ?? item.label ?? index)) });
+  return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(SidebarMenu, { children: items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(SidebarNavEntry, { item, depth: 0 }, item.href ?? item.label ?? index)) });
 }
 function SidebarNavEntry({ item, depth }) {
-  const iconNode = item.icon ? /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Icon, { name: item.icon, size: "sm" }) : null;
+  const iconNode = item.icon ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Icon, { name: item.icon, size: "sm" }) : null;
   const labelNode = item.label;
-  const button = item.href ? /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(SidebarMenuButton, { asChild: true, tooltip: item.label, children: /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)("a", { href: item.href, children: [
+  const button = item.href ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(SidebarMenuButton, { asChild: true, tooltip: item.label, children: /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("a", { href: item.href, children: [
     iconNode,
-    /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { children: labelNode })
-  ] }) }) : /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(SidebarMenuButton, { tooltip: item.label, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { children: labelNode })
+  ] }) }) : /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(SidebarMenuButton, { tooltip: item.label, children: [
     iconNode,
-    /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { children: labelNode })
+    /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { children: labelNode })
   ] });
-  return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(SidebarMenuItem, { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(SidebarMenuItem, { children: [
     button,
-    item.children && item.children.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: cn("ml-4"), children: item.children.map((child, index) => /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
+    item.children && item.children.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("div", { className: cn("ml-4"), children: item.children.map((child, index) => /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
       SidebarNavEntry,
       {
         item: child,
@@ -4644,13 +4937,13 @@ function Sidebar({
   style,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
     SidebarProvider,
     {
       defaultOpen: true,
       className,
       style,
-      children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
         SidebarInner,
         {
           brand,
@@ -4678,32 +4971,32 @@ function SidebarInner({
   drawer = true,
   children
 }) {
-  const { t } = (0, import_runtime13.useI18n)();
+  const { t } = (0, import_runtime14.useI18n)();
   const isMobile = useIsMobile();
   const { state, setOpenMobile, toggleSidebar } = useSidebar();
   const collapsed = state === "collapsed";
-  const prevCollapsed = (0, import_react17.useRef)(collapsed);
-  (0, import_react17.useEffect)(() => {
+  const prevCollapsed = (0, import_react18.useRef)(collapsed);
+  (0, import_react18.useEffect)(() => {
     if (prevCollapsed.current !== collapsed) {
       prevCollapsed.current = collapsed;
       onCollapse?.(collapsed);
     }
   }, [collapsed, onCollapse]);
-  (0, import_react17.useEffect)(() => {
+  (0, import_react18.useEffect)(() => {
     if (locationKey !== void 0) {
       setOpenMobile(false);
     }
   }, [locationKey, setOpenMobile]);
   const collapsedEffective = collapsible === true && collapsed && !isMobile;
-  const brandNode = /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(BrandNode, { brand, collapsed: collapsedEffective });
-  const sidebarContent = content !== void 0 && content !== null ? /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(SidebarContentSlot, { content }) : items.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(SidebarNavItems, { items }) : null;
-  return /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(import_jsx_runtime82.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
+  const brandNode = /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(BrandNode, { brand, collapsed: collapsedEffective });
+  const sidebarContent = content !== void 0 && content !== null ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(SidebarContentSlot, { content }) : items.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(SidebarNavItems, { items }) : null;
+  return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(import_jsx_runtime83.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(
       SidebarRoot,
       {
         collapsible: collapsible ? "icon" : "offcanvas",
         children: [
-          (brand !== void 0 || collapsible) && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(SidebarHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
+          (brand !== void 0 || collapsible) && /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(SidebarHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(
             "div",
             {
               "data-slot": "sidebar-brand",
@@ -4712,8 +5005,8 @@ function SidebarInner({
                 collapsedEffective && "justify-center px-0"
               ),
               children: [
-                collapsedEffective ? null : /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: brandNode }),
-                collapsible && !isMobile && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
+                collapsedEffective ? null : /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: brandNode }),
+                collapsible && !isMobile && /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
                   "button",
                   {
                     type: "button",
@@ -4722,25 +5015,25 @@ function SidebarInner({
                     "aria-expanded": !collapsedEffective,
                     className: "flex size-8 shrink-0 cursor-pointer items-center justify-center rounded-md text-sidebar-foreground/60 transition-colors hover:bg-sidebar-accent hover:text-sidebar-foreground",
                     onClick: toggleSidebar,
-                    children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Icon, { name: collapsedEffective ? "chevron-right" : "chevron-left", size: 16 })
+                    children: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Icon, { name: collapsedEffective ? "chevron-right" : "chevron-left", size: 16 })
                   }
                 )
               ]
             }
           ) }),
-          /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(SidebarContent, { children: sidebarContent }),
-          sidebarFooter !== void 0 && sidebarFooter !== null && !collapsedEffective && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(SidebarFooter, { children: sidebarFooter })
+          /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(SidebarContent, { children: sidebarContent }),
+          sidebarFooter !== void 0 && sidebarFooter !== null && !collapsedEffective && /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(SidebarFooter, { children: sidebarFooter })
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(SidebarInset, { children: [
-      drawer && /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(SidebarInset, { children: [
+      drawer && /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(
         "div",
         {
           "data-slot": "sidebar-topbar",
           className: "flex h-14 items-center gap-2 border-b border-sidebar-border bg-sidebar px-3 md:hidden",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
               "button",
               {
                 type: "button",
@@ -4748,7 +5041,7 @@ function SidebarInner({
                 "aria-label": t("pactor.layout.openNavigation"),
                 className: "flex size-8 items-center justify-center rounded-md text-sidebar-foreground/60 transition-colors hover:bg-sidebar-accent hover:text-sidebar-foreground",
                 onClick: toggleSidebar,
-                children: /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Icon, { name: "menu", size: 18 })
+                children: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Icon, { name: "menu", size: 18 })
               }
             ),
             brandNode
@@ -4761,19 +5054,52 @@ function SidebarInner({
 }
 
 // src/components/components/Menu/index.tsx
-var import_jsx_runtime83 = require("react/jsx-runtime");
+var import_jsx_runtime84 = require("react/jsx-runtime");
+function collectAncestors(items, target, into, trail = []) {
+  for (const item of items) {
+    if (item.key === target) {
+      for (const key of trail) into.add(key);
+      return true;
+    }
+    if (item.children?.length && collectAncestors(item.children, target, into, [...trail, item.key])) {
+      return true;
+    }
+  }
+  return false;
+}
 function Menu2({
   items = [],
   mode = "inline",
   selectedKey,
+  collapsible = false,
+  defaultExpandedKeys,
   onSelect,
   className,
   style
 }) {
   const drawer = useSidebarDrawer();
   const collapsed = mode === "inline" && drawer?.collapsed === true;
+  const collapsibleOn = collapsible && mode === "inline" && !collapsed;
+  const [expandedKeys, setExpandedKeys] = (0, import_react19.useState)(() => {
+    const initial = new Set(defaultExpandedKeys ?? []);
+    if (selectedKey !== void 0) {
+      collectAncestors(items, selectedKey, initial);
+    }
+    return initial;
+  });
+  const toggleExpanded = (key) => {
+    setExpandedKeys((prev) => {
+      const next = new Set(prev);
+      if (next.has(key)) {
+        next.delete(key);
+      } else {
+        next.add(key);
+      }
+      return next;
+    });
+  };
   let previousGroup;
-  return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
     "nav",
     {
       "data-slot": "menu",
@@ -4790,8 +5116,8 @@ function Menu2({
           groupLabel = item.group;
         }
         previousGroup = item.group;
-        return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { "data-slot": "menu-group-entry", children: [
-          groupLabel !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { "data-slot": "menu-group-entry", children: [
+          groupLabel !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
             "div",
             {
               "data-slot": "menu-group",
@@ -4799,7 +5125,7 @@ function Menu2({
               children: groupLabel
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
             MenuEntry,
             {
               item,
@@ -4807,7 +5133,10 @@ function Menu2({
               depth: 0,
               selectedKey,
               onSelect,
-              collapsed
+              collapsed,
+              collapsible: collapsibleOn,
+              expandedKeys,
+              onToggle: toggleExpanded
             }
           )
         ] }, item.key);
@@ -4821,15 +5150,34 @@ function MenuEntry({
   depth,
   selectedKey,
   onSelect,
-  collapsed = false
+  collapsed = false,
+  collapsible = false,
+  expandedKeys,
+  onToggle
 }) {
   const selected = item.key === selectedKey;
-  const button = /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)(
+  const hasChildren = (item.children?.length ?? 0) > 0;
+  const isDirectory = collapsible && hasChildren;
+  const expanded = isDirectory && expandedKeys?.has(item.key) === true;
+  const railDirectory = collapsed && hasChildren;
+  const [flyoutOpen, setFlyoutOpen] = (0, import_react19.useState)(false);
+  const flyoutTimer = (0, import_react19.useRef)(void 0);
+  const flyoutOpenNow = () => {
+    window.clearTimeout(flyoutTimer.current);
+    setFlyoutOpen(true);
+  };
+  const flyoutCloseLater = () => {
+    window.clearTimeout(flyoutTimer.current);
+    flyoutTimer.current = window.setTimeout(() => setFlyoutOpen(false), 200);
+  };
+  (0, import_react19.useEffect)(() => () => window.clearTimeout(flyoutTimer.current), []);
+  const button = /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)(
     "button",
     {
       type: "button",
       "data-slot": "menu-item",
       "aria-current": selected ? "page" : void 0,
+      "aria-expanded": isDirectory ? expanded : railDirectory ? flyoutOpen : void 0,
       disabled: item.disabled,
       className: cn(
         "flex w-full items-center gap-2 rounded-md text-sm transition-colors",
@@ -4839,29 +5187,80 @@ function MenuEntry({
         item.disabled && "cursor-not-allowed opacity-50 hover:bg-transparent hover:text-muted-foreground"
       ),
       style: mode === "inline" && depth > 0 && !collapsed ? { paddingLeft: 12 + depth * 16 } : void 0,
+      onMouseEnter: railDirectory ? flyoutOpenNow : void 0,
+      onMouseLeave: railDirectory ? flyoutCloseLater : void 0,
       onClick: () => {
-        if (!item.disabled) {
+        if (item.disabled) return;
+        if (railDirectory) return;
+        if (isDirectory) {
+          onToggle?.(item.key);
+        } else {
           onSelect?.(item.key);
         }
       },
       children: [
-        item.icon ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
-        collapsed ? null : /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: "min-w-0 flex-1 truncate text-left", children: item.label }),
-        item.dot && !collapsed ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { "data-slot": "menu-item-dot", className: "size-1.5 shrink-0 rounded-full bg-destructive" }) : null,
-        item.badge !== void 0 && !collapsed ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
+        item.icon ? /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
+        collapsed ? null : /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: "min-w-0 flex-1 truncate text-left", children: item.label }),
+        item.dot && !collapsed ? /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { "data-slot": "menu-item-dot", className: "size-1.5 shrink-0 rounded-full bg-destructive" }) : null,
+        item.badge !== void 0 && !collapsed ? /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
           "span",
           {
             "data-slot": "menu-item-badge",
             className: "shrink-0 rounded-full bg-muted px-1.5 py-0.5 text-xs text-muted-foreground",
             children: item.badge
           }
+        ) : null,
+        isDirectory ? /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
+          "span",
+          {
+            "data-slot": "menu-item-chevron",
+            className: cn(
+              "shrink-0 transition-transform",
+              expanded && "rotate-180"
+            ),
+            children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(Icon, { name: "chevron-down", size: "sm" })
+          }
         ) : null
       ]
     }
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { "data-slot": "menu-entry", "data-key": item.key, children: [
-    collapsed ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(RailTooltip, { label: item.label, children: button }) : button,
-    item.children?.map((child) => /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)("div", { "data-slot": "menu-entry", "data-key": item.key, children: [
+    railDirectory ? /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)(Popover, { open: flyoutOpen, onOpenChange: setFlyoutOpen, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(PopoverTrigger, { render: button }),
+      /* @__PURE__ */ (0, import_jsx_runtime84.jsxs)(
+        PopoverContent,
+        {
+          "data-slot": "menu-flyout",
+          side: "right",
+          align: "start",
+          sideOffset: 8,
+          className: "max-h-[70vh] w-48 overflow-auto p-1",
+          initialFocus: false,
+          onMouseEnter: flyoutOpenNow,
+          onMouseLeave: flyoutCloseLater,
+          onClick: (event) => {
+            if (event.target.closest("[data-slot=menu-item]")) {
+              setFlyoutOpen(false);
+            }
+          },
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("div", { className: "px-3 pt-2 pb-1 text-xs font-semibold text-muted-foreground", children: item.label }),
+            item.children?.map((child) => /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
+              MenuEntry,
+              {
+                item: child,
+                mode: "inline",
+                depth: 0,
+                selectedKey,
+                onSelect
+              },
+              child.key
+            ))
+          ]
+        }
+      )
+    ] }) : collapsed ? /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(RailTooltip, { label: item.label, children: button }) : button,
+    railDirectory || isDirectory && !expanded ? null : item.children?.map((child) => /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
       MenuEntry,
       {
         item: child,
@@ -4869,7 +5268,10 @@ function MenuEntry({
         depth: depth + 1,
         selectedKey,
         onSelect,
-        collapsed
+        collapsed,
+        collapsible,
+        expandedKeys,
+        onToggle
       },
       child.key
     ))
@@ -4879,12 +5281,12 @@ function MenuEntry({
 // src/ui/menubar.tsx
 var import_menu2 = require("@base-ui/react/menu");
 var import_menubar = require("@base-ui/react/menubar");
-var import_jsx_runtime84 = require("react/jsx-runtime");
+var import_jsx_runtime85 = require("react/jsx-runtime");
 function Menubar({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
     import_menubar.Menubar,
     {
       "data-slot": "menubar",
@@ -4899,13 +5301,13 @@ function Menubar({
 function MenubarMenu({
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(import_menu2.Menu.Root, { "data-slot": "menubar-menu", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(import_menu2.Menu.Root, { "data-slot": "menubar-menu", ...props });
 }
 function MenubarTrigger({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
     import_menu2.Menu.Trigger,
     {
       "data-slot": "menubar-trigger",
@@ -4924,14 +5326,14 @@ function MenubarContent({
   sideOffset = 8,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(import_menu2.Menu.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(import_menu2.Menu.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
     import_menu2.Menu.Positioner,
     {
       align,
       side,
       sideOffset,
       className: "isolate z-50",
-      children: /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
         import_menu2.Menu.Popup,
         {
           "data-slot": "menubar-content",
@@ -4950,7 +5352,7 @@ function MenubarItem({
   variant = "default",
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
     import_menu2.Menu.Item,
     {
       "data-slot": "menubar-item",
@@ -4965,17 +5367,17 @@ function MenubarItem({
 }
 
 // src/components/components/Menubar/index.tsx
-var import_jsx_runtime85 = require("react/jsx-runtime");
+var import_jsx_runtime86 = require("react/jsx-runtime");
 function Menubar2({ menus = [], onSelect, className, style }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Menubar, { className, style, children: menus.map((menu) => /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)(MenubarMenu, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(MenubarTrigger, { children: menu.label }),
-    /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(MenubarContent, { children: menu.items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime85.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(Menubar, { className, style, children: menus.map((menu) => /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)(MenubarMenu, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(MenubarTrigger, { children: menu.label }),
+    /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(MenubarContent, { children: menu.items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)(
       MenubarItem,
       {
         disabled: item.disabled,
         onClick: () => onSelect?.(item.value),
         children: [
-          item.icon ? /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
+          item.icon ? /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
           item.label
         ]
       },
@@ -4986,15 +5388,15 @@ function Menubar2({ menus = [], onSelect, className, style }) {
 
 // src/ui/navigation-menu.tsx
 var import_navigation_menu = require("@base-ui/react/navigation-menu");
-var import_lucide_react19 = require("lucide-react");
+var import_lucide_react20 = require("lucide-react");
 var import_class_variance_authority6 = require("class-variance-authority");
-var import_jsx_runtime86 = require("react/jsx-runtime");
+var import_jsx_runtime87 = require("react/jsx-runtime");
 function NavigationMenu({
   className,
   children,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)(
     import_navigation_menu.NavigationMenu.Root,
     {
       "data-slot": "navigation-menu",
@@ -5002,7 +5404,7 @@ function NavigationMenu({
       ...props,
       children: [
         children,
-        /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(NavigationMenuViewport, {})
+        /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(NavigationMenuViewport, {})
       ]
     }
   );
@@ -5011,7 +5413,7 @@ function NavigationMenuList({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
     import_navigation_menu.NavigationMenu.List,
     {
       "data-slot": "navigation-menu-list",
@@ -5024,7 +5426,7 @@ function NavigationMenuItem({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
     import_navigation_menu.NavigationMenu.Item,
     {
       "data-slot": "navigation-menu-item",
@@ -5041,7 +5443,7 @@ function NavigationMenuTrigger({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)(
     import_navigation_menu.NavigationMenu.Trigger,
     {
       "data-slot": "navigation-menu-trigger",
@@ -5049,8 +5451,8 @@ function NavigationMenuTrigger({
       ...props,
       children: [
         children,
-        /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
-          import_lucide_react19.ChevronDownIcon,
+        /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
+          import_lucide_react20.ChevronDownIcon,
           {
             className: "relative top-px ml-1 size-3 transition-transform duration-200 group-data-open/navigation-menu-trigger:rotate-180",
             "aria-hidden": "true"
@@ -5064,7 +5466,7 @@ function NavigationMenuContent({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
     import_navigation_menu.NavigationMenu.Content,
     {
       "data-slot": "navigation-menu-content",
@@ -5077,13 +5479,13 @@ function NavigationMenuContent({
   );
 }
 function NavigationMenuViewport({ className }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(import_navigation_menu.NavigationMenu.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(import_navigation_menu.NavigationMenu.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
     import_navigation_menu.NavigationMenu.Positioner,
     {
       side: "bottom",
       align: "start",
       className: "isolate z-50",
-      children: /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
         import_navigation_menu.NavigationMenu.Popup,
         {
           "data-slot": "navigation-menu-popup",
@@ -5091,7 +5493,7 @@ function NavigationMenuViewport({ className }) {
             "origin-(--transform-origin) overflow-hidden rounded-md border border-border bg-popover text-popover-foreground shadow-md shadow-(color:--shadow-color) duration-200 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
             className
           ),
-          children: /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(import_navigation_menu.NavigationMenu.Viewport, { "data-slot": "navigation-menu-viewport" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(import_navigation_menu.NavigationMenu.Viewport, { "data-slot": "navigation-menu-viewport" })
         }
       )
     }
@@ -5101,7 +5503,7 @@ function NavigationMenuLink({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
     import_navigation_menu.NavigationMenu.Link,
     {
       "data-slot": "navigation-menu-link",
@@ -5115,33 +5517,33 @@ function NavigationMenuLink({
 }
 
 // src/components/components/NavigationMenu/index.tsx
-var import_jsx_runtime87 = require("react/jsx-runtime");
+var import_jsx_runtime88 = require("react/jsx-runtime");
 function NavigationMenu2({ items = [], className, style }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(NavigationMenu, { className, style, children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(NavigationMenuList, { children: items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(NavigationMenuItem, { value: `item-${index}`, children: item.children && item.children.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)(import_jsx_runtime87.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(NavigationMenu, { className, style, children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(NavigationMenuList, { children: items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(NavigationMenuItem, { value: `item-${index}`, children: item.children && item.children.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(import_jsx_runtime88.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(
       NavigationMenuTrigger,
       {
         className: item.icon !== void 0 ? "gap-2" : void 0,
         children: [
-          item.icon ? /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
+          item.icon ? /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
           item.label
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(NavigationMenuContent, { children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)("ul", { className: "grid w-64 gap-1", children: item.children.map((child) => /* @__PURE__ */ (0, import_jsx_runtime87.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)(NavigationMenuLink, { href: child.href, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(NavigationMenuContent, { children: /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("ul", { className: "grid w-64 gap-1", children: item.children.map((child) => /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(NavigationMenuLink, { href: child.href, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(
         "span",
         {
           className: child.icon !== void 0 ? "flex items-center gap-2 font-medium" : "font-medium",
           children: [
-            child.icon ? /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(Icon, { name: child.icon, size: "sm" }) : null,
+            child.icon ? /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(Icon, { name: child.icon, size: "sm" }) : null,
             child.label
           ]
         }
       ),
-      child.description ? /* @__PURE__ */ (0, import_jsx_runtime87.jsx)("span", { className: "text-muted-foreground", children: child.description }) : null
+      child.description ? /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("span", { className: "text-muted-foreground", children: child.description }) : null
     ] }) }, child.href)) }) })
-  ] }) : /* @__PURE__ */ (0, import_jsx_runtime87.jsxs)(
+  ] }) : /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)(
     NavigationMenuLink,
     {
       href: item.href,
@@ -5150,7 +5552,7 @@ function NavigationMenu2({ items = [], className, style }) {
         item.icon !== void 0 && "gap-2"
       ),
       children: [
-        item.icon ? /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
+        item.icon ? /* @__PURE__ */ (0, import_jsx_runtime88.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
         item.label
       ]
     }
@@ -5158,22 +5560,22 @@ function NavigationMenu2({ items = [], className, style }) {
 }
 
 // src/components/components/Page/index.tsx
-var import_jsx_runtime88 = require("react/jsx-runtime");
+var import_jsx_runtime89 = require("react/jsx-runtime");
 function Page({ title, className, style, children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("div", { "data-slot": "page", className: cn("p-6", className), style, children: [
-    title ? /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("h2", { "data-slot": "page-title", className: "mb-5 text-xl font-semibold", children: title }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("div", { "data-slot": "page-content", className: "space-y-5", children })
+  return /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)("div", { "data-slot": "page", className: cn("p-6", className), style, children: [
+    title ? /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("h2", { "data-slot": "page-title", className: "mb-5 text-xl font-semibold", children: title }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("div", { "data-slot": "page-content", className: "space-y-5", children })
   ] });
 }
 
 // src/components/components/Pagination/index.tsx
-var import_react18 = require("react");
+var import_react20 = require("react");
 
 // src/ui/pagination.tsx
-var import_lucide_react20 = require("lucide-react");
-var import_jsx_runtime89 = require("react/jsx-runtime");
+var import_lucide_react21 = require("lucide-react");
+var import_jsx_runtime90 = require("react/jsx-runtime");
 function Pagination({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
     "nav",
     {
       role: "navigation",
@@ -5185,7 +5587,7 @@ function Pagination({ className, ...props }) {
   );
 }
 function PaginationContent({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
     "ul",
     {
       "data-slot": "pagination-content",
@@ -5195,7 +5597,7 @@ function PaginationContent({ className, ...props }) {
   );
 }
 function PaginationItem({ ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("li", { "data-slot": "pagination-item", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)("li", { "data-slot": "pagination-item", ...props });
 }
 function PaginationLink({
   className,
@@ -5203,7 +5605,7 @@ function PaginationLink({
   disabled,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
     "a",
     {
       "aria-current": isActive ? "page" : void 0,
@@ -5227,15 +5629,15 @@ function PaginationPrevious({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)(
     PaginationLink,
     {
       "aria-label": "Go to previous page",
       className: cn("gap-1 px-2.5 sm:pl-2.5", className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_lucide_react20.ChevronLeftIcon, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("span", { className: "hidden sm:block", children: "Previous" })
+        /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(import_lucide_react21.ChevronLeftIcon, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime90.jsx)("span", { className: "hidden sm:block", children: "Previous" })
       ]
     }
   );
@@ -5244,21 +5646,21 @@ function PaginationNext({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)(
     PaginationLink,
     {
       "aria-label": "Go to next page",
       className: cn("gap-1 px-2.5 sm:pr-2.5", className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("span", { className: "hidden sm:block", children: "Next" }),
-        /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_lucide_react20.ChevronRightIcon, {})
+        /* @__PURE__ */ (0, import_jsx_runtime90.jsx)("span", { className: "hidden sm:block", children: "Next" }),
+        /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(import_lucide_react21.ChevronRightIcon, {})
       ]
     }
   );
 }
 function PaginationEllipsis({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)(
     "span",
     {
       "aria-hidden": true,
@@ -5266,15 +5668,15 @@ function PaginationEllipsis({ className, ...props }) {
       className: cn("flex size-9 items-center justify-center", className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(import_lucide_react20.MoreHorizontalIcon, { className: "size-4" }),
-        /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("span", { className: "sr-only", children: "More pages" })
+        /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(import_lucide_react21.MoreHorizontalIcon, { className: "size-4" }),
+        /* @__PURE__ */ (0, import_jsx_runtime90.jsx)("span", { className: "sr-only", children: "More pages" })
       ]
     }
   );
 }
 
 // src/components/components/Pagination/index.tsx
-var import_jsx_runtime90 = require("react/jsx-runtime");
+var import_jsx_runtime91 = require("react/jsx-runtime");
 function pageItems(current, count) {
   if (count <= 7) {
     return Array.from({ length: count }, (_, i) => i + 1);
@@ -5295,7 +5697,7 @@ function Pagination2({
   className,
   style
 }) {
-  const [innerPage, setInnerPage] = (0, import_react18.useState)(1);
+  const [innerPage, setInnerPage] = (0, import_react20.useState)(1);
   const pageCount = Math.max(1, Math.ceil(total / Math.max(1, pageSize)));
   const current = Math.min(Math.max(1, page ?? innerPage), pageCount);
   const goTo = (next) => {
@@ -5308,8 +5710,8 @@ function Pagination2({
     }
     onChange?.(target);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(Pagination, { className, style, children: /* @__PURE__ */ (0, import_jsx_runtime90.jsxs)(PaginationContent, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(PaginationItem, { children: /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(Pagination, { className, style, children: /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)(PaginationContent, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(PaginationItem, { children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
       PaginationPrevious,
       {
         href: "#",
@@ -5320,7 +5722,7 @@ function Pagination2({
         }
       }
     ) }),
-    pageItems(current, pageCount).map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(PaginationItem, { children: item === "ellipsis" ? /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(PaginationEllipsis, {}) : /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
+    pageItems(current, pageCount).map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(PaginationItem, { children: item === "ellipsis" ? /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(PaginationEllipsis, {}) : /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
       PaginationLink,
       {
         href: "#",
@@ -5332,7 +5734,7 @@ function Pagination2({
         children: item
       }
     ) }, item === "ellipsis" ? `ellipsis-${index}` : item)),
-    /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(PaginationItem, { children: /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(PaginationItem, { children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
       PaginationNext,
       {
         href: "#",
@@ -5347,15 +5749,15 @@ function Pagination2({
 }
 
 // src/components/components/Popover/index.tsx
-var import_runtime14 = require("@pactor-app/runtime");
-var import_jsx_runtime91 = require("react/jsx-runtime");
+var import_runtime15 = require("@pactor-app/runtime");
+var import_jsx_runtime92 = require("react/jsx-runtime");
 function isDslNode3(value) {
   return typeof value === "object" && value !== null && typeof value.type === "string";
 }
 function Popover2({ content, children, className, style }) {
-  const { renderChildren } = (0, import_runtime14.useRenderer)();
-  return /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)(Popover, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
+  const { renderChildren } = (0, import_runtime15.useRenderer)();
+  return /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)(Popover, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
       PopoverTrigger,
       {
         nativeButton: false,
@@ -5363,15 +5765,15 @@ function Popover2({ content, children, className, style }) {
         children
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(PopoverContent, { className, style, children: isDslNode3(content) ? renderChildren([content]) : content })
+    /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(PopoverContent, { className, style, children: isDslNode3(content) ? renderChildren([content]) : content })
   ] });
 }
 
 // src/ui/progress.tsx
 var import_progress = require("@base-ui/react/progress");
-var import_jsx_runtime92 = require("react/jsx-runtime");
+var import_jsx_runtime93 = require("react/jsx-runtime");
 function Progress({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
     import_progress.Progress.Root,
     {
       "data-slot": "progress",
@@ -5381,7 +5783,7 @@ function Progress({ className, ...props }) {
   );
 }
 function ProgressTrack({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
     import_progress.Progress.Track,
     {
       "data-slot": "progress-track",
@@ -5394,7 +5796,7 @@ function ProgressIndicator({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
     import_progress.Progress.Indicator,
     {
       "data-slot": "progress-indicator",
@@ -5408,21 +5810,21 @@ function ProgressIndicator({
 }
 
 // src/components/components/Progress/index.tsx
-var import_jsx_runtime93 = require("react/jsx-runtime");
+var import_jsx_runtime94 = require("react/jsx-runtime");
 function Progress2({ value, className, style }) {
   const resolved = typeof value === "number" && Number.isFinite(value) ? Math.min(100, Math.max(0, value)) : null;
-  return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(Progress, { value: resolved, className, style, children: /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(ProgressTrack, { children: /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(ProgressIndicator, {}) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(Progress, { value: resolved, className, style, children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(ProgressTrack, { children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(ProgressIndicator, {}) }) });
 }
 
 // src/components/components/RadioGroup/index.tsx
-var import_react19 = require("react");
+var import_react21 = require("react");
 
 // src/ui/radio-group.tsx
 var import_radio = require("@base-ui/react/radio");
 var import_radio_group = require("@base-ui/react/radio-group");
-var import_jsx_runtime94 = require("react/jsx-runtime");
+var import_jsx_runtime95 = require("react/jsx-runtime");
 function RadioGroup({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
     import_radio_group.RadioGroup,
     {
       "data-slot": "radio-group",
@@ -5432,7 +5834,7 @@ function RadioGroup({ className, ...props }) {
   );
 }
 function RadioGroupItem({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
     import_radio.Radio.Root,
     {
       "data-slot": "radio-group-item",
@@ -5441,12 +5843,12 @@ function RadioGroupItem({ className, ...props }) {
         className
       ),
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
         import_radio.Radio.Indicator,
         {
           "data-slot": "radio-group-indicator",
           className: "flex items-center justify-center",
-          children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { className: "size-2 rounded-full bg-(--radio-checked)" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime95.jsx)("span", { className: "size-2 rounded-full bg-(--radio-checked)" })
         }
       )
     }
@@ -5454,7 +5856,7 @@ function RadioGroupItem({ className, ...props }) {
 }
 
 // src/components/components/Form/form-item.tsx
-var import_jsx_runtime95 = require("react/jsx-runtime");
+var import_jsx_runtime96 = require("react/jsx-runtime");
 function FieldShell({
   layout,
   label,
@@ -5464,14 +5866,14 @@ function FieldShell({
   style,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime95.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)(
     "div",
     {
       "data-slot": "form-item",
       className: cn(formItemClass(layout), className),
       style,
       children: [
-        label ? /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
+        label ? /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
           "label",
           {
             htmlFor,
@@ -5480,14 +5882,14 @@ function FieldShell({
           }
         ) : null,
         children,
-        error ? /* @__PURE__ */ (0, import_jsx_runtime95.jsx)("div", { "data-slot": "form-error", className: "text-sm text-destructive", children: error }) : null
+        error ? /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("div", { "data-slot": "form-error", className: "text-sm text-destructive", children: error }) : null
       ]
     }
   );
 }
 
 // src/components/components/RadioGroup/index.tsx
-var import_jsx_runtime96 = require("react/jsx-runtime");
+var import_jsx_runtime97 = require("react/jsx-runtime");
 function RadioGroup2({
   name,
   label,
@@ -5500,9 +5902,9 @@ function RadioGroup2({
   style
 }) {
   const form = useFormContext();
-  const controlId = (0, import_react19.useId)();
+  const controlId = (0, import_react21.useId)();
   const inForm = form?.inForm === true && typeof name === "string" && name !== "";
-  (0, import_react19.useEffect)(() => {
+  (0, import_react21.useEffect)(() => {
     if (inForm && form && name) {
       form.registerField(name, rules, value);
       return () => form.unregisterField(name);
@@ -5517,7 +5919,7 @@ function RadioGroup2({
     onChange?.(next);
   };
   const groupValue = current ?? "";
-  const group = /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
+  const group = /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
     RadioGroup,
     {
       value: groupValue,
@@ -5528,8 +5930,8 @@ function RadioGroup2({
       style: inForm ? void 0 : style,
       children: options.map((option, index) => {
         const optionId = `${controlId}-${index}`;
-        return /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)("span", { className: "inline-flex items-center gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("span", { className: "inline-flex items-center gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
             RadioGroupItem,
             {
               id: optionId,
@@ -5537,13 +5939,13 @@ function RadioGroup2({
               disabled: option.disabled
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("label", { htmlFor: optionId, className: "text-sm leading-none font-medium", children: option.label })
+          /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("label", { htmlFor: optionId, className: "text-sm leading-none font-medium", children: option.label })
         ] }, String(option.value));
       })
     }
   );
   if (inForm && form && name) {
-    return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
       FieldShell,
       {
         layout: form.layout,
@@ -5559,18 +5961,18 @@ function RadioGroup2({
 }
 
 // src/components/components/Resizable/index.tsx
-var import_runtime15 = require("@pactor-app/runtime");
-var import_react20 = require("react");
+var import_runtime16 = require("@pactor-app/runtime");
+var import_react22 = require("react");
 
 // src/ui/resizable.tsx
-var import_lucide_react21 = require("lucide-react");
+var import_lucide_react22 = require("lucide-react");
 var import_react_resizable_panels = require("react-resizable-panels");
-var import_jsx_runtime97 = require("react/jsx-runtime");
+var import_jsx_runtime98 = require("react/jsx-runtime");
 function PanelGroup({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
     import_react_resizable_panels.Group,
     {
       "data-slot": "resizable-panel-group",
@@ -5583,14 +5985,14 @@ function PanelGroup({
   );
 }
 function Panel({ ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_react_resizable_panels.Panel, { "data-slot": "resizable-panel", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_react_resizable_panels.Panel, { "data-slot": "resizable-panel", ...props });
 }
 function ResizableHandle({
   withHandle,
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
     import_react_resizable_panels.Separator,
     {
       "data-slot": "resizable-handle",
@@ -5599,23 +6001,23 @@ function ResizableHandle({
         className
       ),
       ...props,
-      children: withHandle ? /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "z-10 flex h-4 w-3 items-center justify-center rounded-xs border border-border bg-border", children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react21.GripVerticalIcon, { className: "size-2.5" }) }) : null
+      children: withHandle ? /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("div", { className: "z-10 flex h-4 w-3 items-center justify-center rounded-xs border border-border bg-border", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(import_lucide_react22.GripVerticalIcon, { className: "size-2.5" }) }) : null
     }
   );
 }
 
 // src/components/components/Resizable/index.tsx
-var import_jsx_runtime98 = require("react/jsx-runtime");
+var import_jsx_runtime99 = require("react/jsx-runtime");
 function Resizable({
   panels = [],
   direction = "horizontal",
   className,
   style
 }) {
-  const { renderChildren } = (0, import_runtime15.useRenderer)();
-  return /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(PanelGroup, { orientation: direction, className, style, children: panels.map((panel, index) => /* @__PURE__ */ (0, import_jsx_runtime98.jsxs)(import_react20.Fragment, { children: [
-    index > 0 ? /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(ResizableHandle, { withHandle: true }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime98.jsx)(
+  const { renderChildren } = (0, import_runtime16.useRenderer)();
+  return /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(PanelGroup, { orientation: direction, className, style, children: panels.map((panel, index) => /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(import_react22.Fragment, { children: [
+    index > 0 ? /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(ResizableHandle, { withHandle: true }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
       Panel,
       {
         defaultSize: typeof panel.defaultSizePx === "number" ? `${panel.defaultSizePx}px` : typeof panel.defaultSize === "number" ? `${panel.defaultSize}%` : void 0,
@@ -5629,20 +6031,20 @@ function Resizable({
 
 // src/ui/scroll-area.tsx
 var import_scroll_area = require("@base-ui/react/scroll-area");
-var import_jsx_runtime99 = require("react/jsx-runtime");
+var import_jsx_runtime100 = require("react/jsx-runtime");
 function ScrollArea({
   className,
   children,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)(
     import_scroll_area.ScrollArea.Root,
     {
       "data-slot": "scroll-area",
       className: cn("relative overflow-hidden", className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
           import_scroll_area.ScrollArea.Viewport,
           {
             "data-slot": "scroll-area-viewport",
@@ -5650,8 +6052,8 @@ function ScrollArea({
             children
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(ScrollBar, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(import_scroll_area.ScrollArea.Corner, {})
+        /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ScrollBar, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(import_scroll_area.ScrollArea.Corner, {})
       ]
     }
   );
@@ -5661,7 +6063,7 @@ function ScrollBar({
   orientation = "vertical",
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
     import_scroll_area.ScrollArea.Scrollbar,
     {
       "data-slot": "scroll-area-scrollbar",
@@ -5673,7 +6075,7 @@ function ScrollBar({
         className
       ),
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime99.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
         import_scroll_area.ScrollArea.Thumb,
         {
           "data-slot": "scroll-area-thumb",
@@ -5685,7 +6087,7 @@ function ScrollBar({
 }
 
 // src/components/components/ScrollArea/index.tsx
-var import_jsx_runtime100 = require("react/jsx-runtime");
+var import_jsx_runtime101 = require("react/jsx-runtime");
 function ScrollArea2({
   maxHeight,
   maxWidth,
@@ -5693,7 +6095,7 @@ function ScrollArea2({
   style,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
     ScrollArea,
     {
       className,
@@ -5704,18 +6106,18 @@ function ScrollArea2({
 }
 
 // src/components/components/Select/index.tsx
-var import_runtime16 = require("@pactor-app/runtime");
-var import_react21 = require("react");
+var import_runtime17 = require("@pactor-app/runtime");
+var import_react23 = require("react");
 
 // src/ui/select.tsx
 var import_select = require("@base-ui/react/select");
-var import_lucide_react22 = require("lucide-react");
-var import_jsx_runtime101 = require("react/jsx-runtime");
+var import_lucide_react23 = require("lucide-react");
+var import_jsx_runtime102 = require("react/jsx-runtime");
 var Select = import_select.Select.Root;
 function SelectValue({
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_select.Select.Value, { "data-slot": "select-value", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(import_select.Select.Value, { "data-slot": "select-value", ...props });
 }
 function SelectTrigger({
   className,
@@ -5723,7 +6125,7 @@ function SelectTrigger({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(
     import_select.Select.Trigger,
     {
       "data-slot": "select-trigger",
@@ -5735,10 +6137,10 @@ function SelectTrigger({
       ...props,
       children: [
         children,
-        /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
           import_select.Select.Icon,
           {
-            render: /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_lucide_react22.ChevronDownIcon, { className: "size-4 opacity-50" })
+            render: /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(import_lucide_react23.ChevronDownIcon, { className: "size-4 opacity-50" })
           }
         )
       ]
@@ -5754,7 +6156,7 @@ function SelectContent({
   alignItemWithTrigger = false,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_select.Select.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(import_select.Select.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
     import_select.Select.Positioner,
     {
       side,
@@ -5762,7 +6164,7 @@ function SelectContent({
       align,
       alignItemWithTrigger,
       className: "isolate z-50",
-      children: /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(
         import_select.Select.Popup,
         {
           "data-slot": "select-content",
@@ -5772,9 +6174,9 @@ function SelectContent({
           ),
           ...props,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(SelectScrollUpButton, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_select.Select.List, { className: "p-1", children }),
-            /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(SelectScrollDownButton, {})
+            /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(SelectScrollUpButton, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(import_select.Select.List, { className: "p-1", children }),
+            /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(SelectScrollDownButton, {})
           ]
         }
       )
@@ -5786,7 +6188,7 @@ function SelectItem({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(
     import_select.Select.Item,
     {
       "data-slot": "select-item",
@@ -5796,8 +6198,8 @@ function SelectItem({
       ),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime101.jsx)("span", { className: "absolute right-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_select.Select.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_lucide_react22.CheckIcon, { className: "size-4" }) }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_select.Select.ItemText, { children })
+        /* @__PURE__ */ (0, import_jsx_runtime102.jsx)("span", { className: "absolute right-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(import_select.Select.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(import_lucide_react23.CheckIcon, { className: "size-4" }) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(import_select.Select.ItemText, { children })
       ]
     }
   );
@@ -5806,7 +6208,7 @@ function SelectScrollUpButton({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
     import_select.Select.ScrollUpArrow,
     {
       "data-slot": "select-scroll-up-button",
@@ -5815,7 +6217,7 @@ function SelectScrollUpButton({
         className
       ),
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_lucide_react22.ChevronUpIcon, { className: "size-4" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(import_lucide_react23.ChevronUpIcon, { className: "size-4" })
     }
   );
 }
@@ -5823,7 +6225,7 @@ function SelectScrollDownButton({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
     import_select.Select.ScrollDownArrow,
     {
       "data-slot": "select-scroll-down-button",
@@ -5832,13 +6234,13 @@ function SelectScrollDownButton({
         className
       ),
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_lucide_react22.ChevronDownIcon, { className: "size-4" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(import_lucide_react23.ChevronDownIcon, { className: "size-4" })
     }
   );
 }
 
 // src/components/components/Select/index.tsx
-var import_jsx_runtime102 = require("react/jsx-runtime");
+var import_jsx_runtime103 = require("react/jsx-runtime");
 function Select2({
   name,
   label,
@@ -5853,10 +6255,10 @@ function Select2({
   style
 }) {
   const form = useFormContext();
-  const { t } = (0, import_runtime16.useI18n)();
-  const controlId = (0, import_react21.useId)();
+  const { t } = (0, import_runtime17.useI18n)();
+  const controlId = (0, import_react23.useId)();
   const inForm = form?.inForm === true && typeof name === "string" && name !== "";
-  (0, import_react21.useEffect)(() => {
+  (0, import_react23.useEffect)(() => {
     if (inForm && form && name) {
       form.registerField(name, rules, value);
       return () => form.unregisterField(name);
@@ -5872,13 +6274,13 @@ function Select2({
     onChange?.(next ?? void 0);
   };
   const inFormRoot = inForm === true;
-  const select = /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(
+  const select = /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)(
     "span",
     {
       className: cn("inline-flex items-center gap-1", !inFormRoot && className),
       style: inFormRoot ? void 0 : style,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)(
           Select,
           {
             items: options,
@@ -5887,8 +6289,8 @@ function Select2({
             disabled,
             name: inForm ? name : void 0,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(SelectTrigger, { id: controlId, children: /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(SelectValue, { placeholder }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(SelectContent, { children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(SelectTrigger, { id: controlId, children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(SelectValue, { placeholder }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(SelectContent, { children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
                 SelectItem,
                 {
                   value: option.value,
@@ -5900,7 +6302,7 @@ function Select2({
             ]
           }
         ),
-        allowClear && selectedValue !== null && !disabled ? /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
+        allowClear && selectedValue !== null && !disabled ? /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
           "button",
           {
             type: "button",
@@ -5920,14 +6322,14 @@ function Select2({
   );
   if (inForm && form && name) {
     const error = form.errors[name];
-    return /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)(
       "div",
       {
         "data-slot": "form-item",
         className: cn(formItemClass(form.layout), className),
         style,
         children: [
-          label ? /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
+          label ? /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
             "label",
             {
               htmlFor: controlId,
@@ -5936,7 +6338,7 @@ function Select2({
             }
           ) : null,
           select,
-          error ? /* @__PURE__ */ (0, import_jsx_runtime102.jsx)("div", { "data-slot": "form-error", className: "text-sm text-destructive", children: error }) : null
+          error ? /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("div", { "data-slot": "form-error", className: "text-sm text-destructive", children: error }) : null
         ]
       }
     );
@@ -5945,13 +6347,13 @@ function Select2({
 }
 
 // src/components/components/Separator/index.tsx
-var import_jsx_runtime103 = require("react/jsx-runtime");
+var import_jsx_runtime104 = require("react/jsx-runtime");
 function Separator2({ orientation = "horizontal", className, style }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(Separator, { orientation, className, style });
+  return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(Separator, { orientation, className, style });
 }
 
 // src/components/components/Sheet/index.tsx
-var import_jsx_runtime104 = require("react/jsx-runtime");
+var import_jsx_runtime105 = require("react/jsx-runtime");
 function Sheet2({
   title,
   open,
@@ -5961,7 +6363,7 @@ function Sheet2({
   className,
   style
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
     Sheet,
     {
       open: open ?? false,
@@ -5970,17 +6372,17 @@ function Sheet2({
           onClose?.();
         }
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)(SheetContent, { side, className, style, children: [
-        title ? /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(SheetHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(SheetTitle, { children: title }) }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("div", { className: "flex-1 overflow-auto px-4", children })
+      children: /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(SheetContent, { side, className, style, children: [
+        title ? /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(SheetHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(SheetTitle, { children: title }) }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("div", { className: "flex-1 overflow-auto px-4", children })
       ] })
     }
   );
 }
 
 // src/components/components/Sider/index.tsx
-var import_lucide_react23 = require("lucide-react");
-var import_jsx_runtime105 = require("react/jsx-runtime");
+var import_lucide_react24 = require("lucide-react");
+var import_jsx_runtime106 = require("react/jsx-runtime");
 function Sider({
   width = 200,
   collapsible,
@@ -5992,7 +6394,7 @@ function Sider({
   children
 }) {
   const current = collapsed ? collapsedWidth : width;
-  return /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(
     "aside",
     {
       "data-slot": "layout-sider",
@@ -6003,15 +6405,15 @@ function Sider({
       ),
       style: { width: current, ...style },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("div", { className: "min-h-0 flex-1 overflow-auto", children }),
-        collapsible ? /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime106.jsx)("div", { className: "min-h-0 flex-1 overflow-auto", children }),
+        collapsible ? /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
           "button",
           {
             type: "button",
             "aria-label": collapsed ? "expand sider" : "collapse sider",
             className: "flex h-10 shrink-0 items-center justify-center border-t text-muted-foreground hover:text-foreground",
             onClick: () => onCollapse?.(!collapsed),
-            children: collapsed ? /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(import_lucide_react23.ChevronRight, { "aria-hidden": true, className: "size-4" }) : /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(import_lucide_react23.ChevronLeft, { "aria-hidden": true, className: "size-4" })
+            children: collapsed ? /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_lucide_react24.ChevronRight, { "aria-hidden": true, className: "size-4" }) : /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_lucide_react24.ChevronLeft, { "aria-hidden": true, className: "size-4" })
           }
         ) : null
       ]
@@ -6020,7 +6422,7 @@ function Sider({
 }
 
 // src/components/components/Skeleton/index.tsx
-var import_jsx_runtime106 = require("react/jsx-runtime");
+var import_jsx_runtime107 = require("react/jsx-runtime");
 var shapeDefaults = {
   line: { className: "h-4 w-full", style: {} },
   circle: { className: "rounded-full", style: { width: 40, height: 40 } },
@@ -6031,7 +6433,7 @@ function toSize(value) {
 }
 function Skeleton2({ shape = "line", width, height, className, style }) {
   const defaults = shapeDefaults[shape];
-  return /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
     Skeleton,
     {
       className: cn(defaults.className, className),
@@ -6046,13 +6448,13 @@ function Skeleton2({ shape = "line", width, height, className, style }) {
 }
 
 // src/components/components/Slider/index.tsx
-var import_react22 = require("react");
+var import_react24 = require("react");
 
 // src/ui/slider.tsx
 var import_slider = require("@base-ui/react/slider");
-var import_jsx_runtime107 = require("react/jsx-runtime");
+var import_jsx_runtime108 = require("react/jsx-runtime");
 function Slider({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
     import_slider.Slider.Root,
     {
       "data-slot": "slider",
@@ -6065,7 +6467,7 @@ function Slider({ className, ...props }) {
   );
 }
 function SliderControl({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
     import_slider.Slider.Control,
     {
       "data-slot": "slider-control",
@@ -6075,7 +6477,7 @@ function SliderControl({ className, ...props }) {
   );
 }
 function SliderTrack({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
     import_slider.Slider.Track,
     {
       "data-slot": "slider-track",
@@ -6088,7 +6490,7 @@ function SliderTrack({ className, ...props }) {
   );
 }
 function SliderIndicator({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
     import_slider.Slider.Indicator,
     {
       "data-slot": "slider-indicator",
@@ -6098,7 +6500,7 @@ function SliderIndicator({ className, ...props }) {
   );
 }
 function SliderThumb({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
     import_slider.Slider.Thumb,
     {
       "data-slot": "slider-thumb",
@@ -6112,7 +6514,7 @@ function SliderThumb({ className, ...props }) {
 }
 
 // src/components/components/Slider/index.tsx
-var import_jsx_runtime108 = require("react/jsx-runtime");
+var import_jsx_runtime109 = require("react/jsx-runtime");
 function Slider2({
   name,
   label,
@@ -6128,7 +6530,7 @@ function Slider2({
 }) {
   const form = useFormContext();
   const inForm = form?.inForm === true && typeof name === "string" && name !== "";
-  (0, import_react22.useEffect)(() => {
+  (0, import_react24.useEffect)(() => {
     if (inForm && form && name) {
       form.registerField(name, rules, value);
       return () => form.unregisterField(name);
@@ -6143,7 +6545,7 @@ function Slider2({
     }
     onChange?.(next);
   };
-  const slider = /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+  const slider = /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
     Slider,
     {
       value: numberValue,
@@ -6155,14 +6557,14 @@ function Slider2({
       onValueChange: handleChange,
       className: inForm ? void 0 : className,
       style: inForm ? void 0 : style,
-      children: /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(SliderControl, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(SliderTrack, { children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(SliderIndicator, {}) }),
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(SliderThumb, {})
+      children: /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(SliderControl, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(SliderTrack, { children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(SliderIndicator, {}) }),
+        /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(SliderThumb, {})
       ] })
     }
   );
   if (inForm && form && name) {
-    return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
       FieldShell,
       {
         layout: form.layout,
@@ -6178,13 +6580,13 @@ function Slider2({
 }
 
 // src/components/components/Sonner/index.tsx
-var import_runtime17 = require("@pactor-app/runtime");
-var import_react23 = require("react");
+var import_runtime18 = require("@pactor-app/runtime");
+var import_react25 = require("react");
 
 // src/ui/toast.tsx
 var import_toast = require("@base-ui/react/toast");
-var import_lucide_react24 = require("lucide-react");
-var import_jsx_runtime109 = require("react/jsx-runtime");
+var import_lucide_react25 = require("lucide-react");
+var import_jsx_runtime110 = require("react/jsx-runtime");
 var toastManager = import_toast.Toast.createToastManager();
 function toast(message, options = {}) {
   return toastManager.add({
@@ -6200,7 +6602,7 @@ var toastVariantClass = {
 };
 function ToasterViewport({ className }) {
   const { toasts } = import_toast.Toast.useToastManager();
-  return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(import_toast.Toast.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(import_toast.Toast.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
     import_toast.Toast.Viewport,
     {
       "data-slot": "toast-viewport",
@@ -6208,7 +6610,7 @@ function ToasterViewport({ className }) {
         "fixed top-4 right-4 z-[100] flex w-80 flex-col gap-2 outline-none",
         className
       ),
-      children: toasts.map((item) => /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+      children: toasts.map((item) => /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
         import_toast.Toast.Root,
         {
           toast: item,
@@ -6218,16 +6620,16 @@ function ToasterViewport({ className }) {
             "rounded-md border border-border bg-popover px-4 py-3 text-sm text-popover-foreground shadow-md shadow-(color:--shadow-color) transition-[opacity,transform] duration-200 data-ending-style:animate-toast-out data-starting-style:animate-toast-in",
             toastVariantClass[item.type ?? "info"] ?? toastVariantClass.info
           ),
-          children: /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(import_toast.Toast.Content, { className: "flex items-start justify-between gap-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "grid gap-0.5", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(import_toast.Toast.Content, { className: "flex items-start justify-between gap-2", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)("div", { className: "grid gap-0.5", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
                 import_toast.Toast.Title,
                 {
                   "data-slot": "toast-title",
                   className: "font-medium"
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
                 import_toast.Toast.Description,
                 {
                   "data-slot": "toast-description",
@@ -6235,13 +6637,13 @@ function ToasterViewport({ className }) {
                 }
               )
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
               import_toast.Toast.Close,
               {
                 "data-slot": "toast-close",
                 "aria-label": "Close",
                 className: "cursor-pointer rounded-xs opacity-70 transition-opacity hover:opacity-100 focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-none [&_svg]:size-3.5",
-                children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(import_lucide_react24.XIcon, {})
+                children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(import_lucide_react25.XIcon, {})
               }
             )
           ] })
@@ -6252,14 +6654,14 @@ function ToasterViewport({ className }) {
   ) });
 }
 function Toaster({ className }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(import_toast.Toast.Provider, { toastManager, children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(ToasterViewport, { className }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(import_toast.Toast.Provider, { toastManager, children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(ToasterViewport, { className }) });
 }
 
 // src/components/components/Sonner/index.tsx
-var import_jsx_runtime110 = require("react/jsx-runtime");
+var import_jsx_runtime111 = require("react/jsx-runtime");
 function Sonner({ className, style }) {
-  const { context } = (0, import_runtime17.useRenderer)();
-  (0, import_react23.useEffect)(() => {
+  const { context } = (0, import_runtime18.useRenderer)();
+  (0, import_react25.useEffect)(() => {
     const { actions } = context;
     if (actions.has("toast")) {
       return;
@@ -6273,15 +6675,15 @@ function Sonner({ className, style }) {
       return { ok: true };
     });
   }, [context]);
-  return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)("div", { "data-slot": "sonner", className, style, children: /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(Toaster, {}) });
+  return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("div", { "data-slot": "sonner", className, style, children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(Toaster, {}) });
 }
 
 // src/ui/spinner.tsx
-var import_lucide_react25 = require("lucide-react");
-var import_jsx_runtime111 = require("react/jsx-runtime");
+var import_lucide_react26 = require("lucide-react");
+var import_jsx_runtime112 = require("react/jsx-runtime");
 function Spinner({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
-    import_lucide_react25.Loader2Icon,
+  return /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
+    import_lucide_react26.Loader2Icon,
     {
       role: "status",
       "aria-label": "Loading",
@@ -6293,37 +6695,37 @@ function Spinner({ className, ...props }) {
 }
 
 // src/components/components/Spinner/index.tsx
-var import_jsx_runtime112 = require("react/jsx-runtime");
+var import_jsx_runtime113 = require("react/jsx-runtime");
 var sizeClass = {
   sm: "size-3",
   default: "size-4",
   lg: "size-6"
 };
 function Spinner2({ size = "default", className, style }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(Spinner, { className: cn(sizeClass[size], className), style });
+  return /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(Spinner, { className: cn(sizeClass[size], className), style });
 }
 
 // src/components/components/Statistic/index.tsx
-var import_jsx_runtime113 = require("react/jsx-runtime");
+var import_jsx_runtime114 = require("react/jsx-runtime");
 function Statistic({ title, value, precision, suffix, className, style }) {
   const display = typeof value === "number" && precision !== void 0 ? value.toFixed(precision) : value;
-  return /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)("div", { "data-slot": "statistic", className: cn(className), style, children: [
-    title ? /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("div", { "data-slot": "statistic-title", className: "text-sm text-muted-foreground", children: title }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)("div", { "data-slot": "statistic-value", className: "text-2xl font-bold tabular-nums", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)("div", { "data-slot": "statistic", className: cn(className), style, children: [
+    title ? /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("div", { "data-slot": "statistic-title", className: "text-sm text-muted-foreground", children: title }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)("div", { "data-slot": "statistic-value", className: "text-2xl font-bold tabular-nums", children: [
       display,
-      suffix ? /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("span", { className: "ml-1 text-sm font-normal text-muted-foreground", children: suffix }) : null
+      suffix ? /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("span", { className: "ml-1 text-sm font-normal text-muted-foreground", children: suffix }) : null
     ] })
   ] });
 }
 
 // src/components/components/Switch/index.tsx
-var import_react24 = require("react");
+var import_react26 = require("react");
 
 // src/ui/switch.tsx
 var import_switch = require("@base-ui/react/switch");
-var import_jsx_runtime114 = require("react/jsx-runtime");
+var import_jsx_runtime115 = require("react/jsx-runtime");
 function Switch({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
     import_switch.Switch.Root,
     {
       "data-slot": "switch",
@@ -6332,7 +6734,7 @@ function Switch({ className, ...props }) {
         className
       ),
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
         import_switch.Switch.Thumb,
         {
           "data-slot": "switch-thumb",
@@ -6344,7 +6746,7 @@ function Switch({ className, ...props }) {
 }
 
 // src/components/components/Switch/index.tsx
-var import_jsx_runtime115 = require("react/jsx-runtime");
+var import_jsx_runtime116 = require("react/jsx-runtime");
 function Switch2({
   name,
   label,
@@ -6356,9 +6758,9 @@ function Switch2({
   style
 }) {
   const form = useFormContext();
-  const controlId = (0, import_react24.useId)();
+  const controlId = (0, import_react26.useId)();
   const inForm = form?.inForm === true && typeof name === "string" && name !== "";
-  (0, import_react24.useEffect)(() => {
+  (0, import_react26.useEffect)(() => {
     if (inForm && form && name) {
       form.registerField(name, rules, value);
       return () => form.unregisterField(name);
@@ -6373,13 +6775,13 @@ function Switch2({
     }
     onChange?.(next);
   };
-  const control = /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(
+  const control = /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(
     "span",
     {
       className: cn("inline-flex items-center gap-2", !inForm && className),
       style: inForm ? void 0 : style,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
           Switch,
           {
             id: controlId,
@@ -6389,12 +6791,12 @@ function Switch2({
             onCheckedChange: handleChange
           }
         ),
-        label ? /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("label", { htmlFor: controlId, className: "text-sm leading-none font-medium", children: label }) : null
+        label ? /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("label", { htmlFor: controlId, className: "text-sm leading-none font-medium", children: label }) : null
       ]
     }
   );
   if (inForm && form && name) {
-    return /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(
       "div",
       {
         "data-slot": "form-item",
@@ -6402,7 +6804,7 @@ function Switch2({
         style,
         children: [
           control,
-          form.errors[name] ? /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("div", { "data-slot": "form-error", className: "mt-1.5 text-sm text-destructive", children: form.errors[name] }) : null
+          form.errors[name] ? /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("div", { "data-slot": "form-error", className: "mt-1.5 text-sm text-destructive", children: form.errors[name] }) : null
         ]
       }
     );
@@ -6411,9 +6813,9 @@ function Switch2({
 }
 
 // src/components/components/Table/index.tsx
-var import_runtime18 = require("@pactor-app/runtime");
-var import_react25 = require("react");
-var import_jsx_runtime116 = require("react/jsx-runtime");
+var import_runtime19 = require("@pactor-app/runtime");
+var import_react27 = require("react");
+var import_jsx_runtime117 = require("react/jsx-runtime");
 function renderCellValue2(value) {
   if (value === void 0 || value === null) {
     return "";
@@ -6433,9 +6835,9 @@ function Table3({
   className,
   style
 }) {
-  const { renderChildren } = (0, import_runtime18.useRenderer)();
-  const { t } = (0, import_runtime18.useI18n)();
-  const [current, setCurrent] = (0, import_react25.useState)(1);
+  const { renderChildren } = (0, import_runtime19.useRenderer)();
+  const { t } = (0, import_runtime19.useI18n)();
+  const [current, setCurrent] = (0, import_react27.useState)(1);
   const pageSize = pagination === false ? void 0 : pagination?.pageSize;
   const total = dataSource.length;
   const pageCount = pageSize !== void 0 && pageSize > 0 ? Math.max(1, Math.ceil(total / pageSize)) : 1;
@@ -6444,8 +6846,8 @@ function Table3({
     setCurrent(page);
     onChange?.({ current: page, pageSize, total });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("div", { "data-slot": "dsl-table", className: cn("relative", className), style, children: [
-    loading ? /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("div", { "data-slot": "dsl-table", className: cn("relative", className), style, children: [
+    loading ? /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
       "div",
       {
         "data-slot": "table-loading",
@@ -6453,8 +6855,8 @@ function Table3({
         children: t("pactor.table.loading")
       }
     ) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(Table2, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(TableHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(TableRow, { className: "hover:bg-transparent", children: columns.map((column, index) => /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(Table2, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(TableHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(TableRow, { className: "hover:bg-transparent", children: columns.map((column, index) => /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
         TableHead,
         {
           style: column.width !== void 0 ? { width: column.width } : void 0,
@@ -6462,7 +6864,7 @@ function Table3({
         },
         column.dataIndex ?? String(index)
       )) }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(TableBody, { children: pageRows.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(TableRow, { className: "hover:bg-transparent", children: /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(TableCell, { colSpan: Math.max(1, columns.length), children: /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(TableBody, { children: pageRows.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(TableRow, { className: "hover:bg-transparent", children: /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(TableCell, { colSpan: Math.max(1, columns.length), children: /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
         "div",
         {
           "data-slot": "table-empty",
@@ -6471,10 +6873,10 @@ function Table3({
         }
       ) }) }) : pageRows.map((row, rowIndex) => {
         const key = row[rowKey];
-        return /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
           TableRow,
           {
-            children: columns.map((column, columnIndex) => /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(TableCell, { children: column.cell ? renderChildren([column.cell], { row, rowIndex }) : renderCellValue2(
+            children: columns.map((column, columnIndex) => /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(TableCell, { children: column.cell ? renderChildren([column.cell], { row, rowIndex }) : renderCellValue2(
               column.dataIndex === void 0 ? void 0 : row[column.dataIndex]
             ) }, column.dataIndex ?? String(columnIndex)))
           },
@@ -6482,8 +6884,8 @@ function Table3({
         );
       }) })
     ] }),
-    pageSize !== void 0 && pageSize > 0 ? /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("div", { "data-slot": "table-pagination", className: "mt-3 flex justify-end gap-1", children: Array.from({ length: pageCount }, (_, index) => index + 1).map(
-      (page) => /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+    pageSize !== void 0 && pageSize > 0 ? /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("div", { "data-slot": "table-pagination", className: "mt-3 flex justify-end gap-1", children: Array.from({ length: pageCount }, (_, index) => index + 1).map(
+      (page) => /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
         Button,
         {
           type: "button",
@@ -6500,16 +6902,16 @@ function Table3({
 }
 
 // src/components/components/Tabs/index.tsx
-var import_runtime19 = require("@pactor-app/runtime");
+var import_runtime20 = require("@pactor-app/runtime");
 
 // src/ui/tabs.tsx
 var import_tabs = require("@base-ui/react/tabs");
-var import_jsx_runtime117 = require("react/jsx-runtime");
+var import_jsx_runtime118 = require("react/jsx-runtime");
 function Tabs({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
     import_tabs.Tabs.Root,
     {
       "data-slot": "tabs",
@@ -6522,7 +6924,7 @@ function TabsList({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
     import_tabs.Tabs.List,
     {
       "data-slot": "tabs-list",
@@ -6538,7 +6940,7 @@ function TabsTrigger({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
     import_tabs.Tabs.Tab,
     {
       "data-slot": "tabs-trigger",
@@ -6554,7 +6956,7 @@ function TabsContent({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
     import_tabs.Tabs.Panel,
     {
       "data-slot": "tabs-content",
@@ -6565,10 +6967,10 @@ function TabsContent({
 }
 
 // src/components/components/Tabs/index.tsx
-var import_jsx_runtime118 = require("react/jsx-runtime");
+var import_jsx_runtime119 = require("react/jsx-runtime");
 function Tabs2({ items = [], activeKey, onChange, className, style }) {
-  const { renderChildren } = (0, import_runtime19.useRenderer)();
-  return /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)(
+  const { renderChildren } = (0, import_runtime20.useRenderer)();
+  return /* @__PURE__ */ (0, import_jsx_runtime119.jsxs)(
     Tabs,
     {
       value: activeKey,
@@ -6577,15 +6979,15 @@ function Tabs2({ items = [], activeKey, onChange, className, style }) {
       className,
       style,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(TabsList, { children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(TabsTrigger, { value: item.key, children: item.label }, item.key)) }),
-        items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(TabsContent, { value: item.key, children: renderChildren(item.children) }, item.key))
+        /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(TabsList, { children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(TabsTrigger, { value: item.key, children: item.label }, item.key)) }),
+        items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(TabsContent, { value: item.key, children: renderChildren(item.children) }, item.key))
       ]
     }
   );
 }
 
 // src/components/components/Text/index.tsx
-var import_jsx_runtime119 = require("react/jsx-runtime");
+var import_jsx_runtime120 = require("react/jsx-runtime");
 var typeClassMap = {
   default: "",
   secondary: "text-muted-foreground",
@@ -6604,7 +7006,7 @@ function Text({
   style,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
     "span",
     {
       "data-slot": "text",
@@ -6624,8 +7026,8 @@ function Text({
 }
 
 // src/components/components/Textarea/index.tsx
-var import_react26 = require("react");
-var import_jsx_runtime120 = require("react/jsx-runtime");
+var import_react28 = require("react");
+var import_jsx_runtime121 = require("react/jsx-runtime");
 function Textarea2({
   name,
   label,
@@ -6639,9 +7041,9 @@ function Textarea2({
   style
 }) {
   const form = useFormContext();
-  const controlId = (0, import_react26.useId)();
+  const controlId = (0, import_react28.useId)();
   const inForm = form?.inForm === true && typeof name === "string" && name !== "";
-  (0, import_react26.useEffect)(() => {
+  (0, import_react28.useEffect)(() => {
     if (inForm && form && name) {
       form.registerField(name, rules, value);
       return () => form.unregisterField(name);
@@ -6650,7 +7052,7 @@ function Textarea2({
   });
   if (inForm && form && name) {
     const fieldValue = form.values[name];
-    return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
       FieldShell,
       {
         layout: form.layout,
@@ -6659,7 +7061,7 @@ function Textarea2({
         error: form.errors[name],
         className,
         style,
-        children: /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
           Textarea,
           {
             id: controlId,
@@ -6676,7 +7078,7 @@ function Textarea2({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
     Textarea,
     {
       value: value ?? "",
@@ -6693,7 +7095,7 @@ function Textarea2({
 // src/ui/toggle.tsx
 var import_toggle = require("@base-ui/react/toggle");
 var import_class_variance_authority7 = require("class-variance-authority");
-var import_jsx_runtime121 = require("react/jsx-runtime");
+var import_jsx_runtime122 = require("react/jsx-runtime");
 var toggleVariants = (0, import_class_variance_authority7.cva)(
   "inline-flex cursor-pointer items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap transition-colors outline-none hover:bg-muted hover:text-muted-foreground focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 data-pressed:bg-accent data-pressed:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
   {
@@ -6720,7 +7122,7 @@ function Toggle({
   size,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
     import_toggle.Toggle,
     {
       "data-slot": "toggle",
@@ -6731,7 +7133,7 @@ function Toggle({
 }
 
 // src/components/components/Toggle/index.tsx
-var import_jsx_runtime122 = require("react/jsx-runtime");
+var import_jsx_runtime123 = require("react/jsx-runtime");
 function Toggle2({
   text,
   pressed,
@@ -6742,7 +7144,7 @@ function Toggle2({
   className,
   style
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
     Toggle,
     {
       pressed,
@@ -6761,7 +7163,7 @@ function Toggle2({
 var import_toggle3 = require("@base-ui/react/toggle");
 var import_toggle_group = require("@base-ui/react/toggle-group");
 var React5 = __toESM(require("react"), 1);
-var import_jsx_runtime123 = require("react/jsx-runtime");
+var import_jsx_runtime124 = require("react/jsx-runtime");
 var ToggleGroupContext = React5.createContext({
   size: "default",
   variant: "default"
@@ -6773,18 +7175,18 @@ function ToggleGroup({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
     import_toggle_group.ToggleGroup,
     {
       "data-slot": "toggle-group",
       "data-variant": variant,
       "data-size": size,
       className: cn(
-        "group/toggle-group flex w-fit items-center rounded-md [&>[data-slot=toggle]]:rounded-none [&>[data-slot=toggle]]:first:rounded-l-md [&>[data-slot=toggle]]:last:rounded-r-md",
+        "group/toggle-group flex w-fit items-center gap-1 rounded-md",
         className
       ),
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(ToggleGroupContext.Provider, { value: { variant, size }, children })
+      children: /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(ToggleGroupContext.Provider, { value: { variant, size }, children })
     }
   );
 }
@@ -6796,7 +7198,7 @@ function ToggleGroupItem({
   ...props
 }) {
   const context = React5.useContext(ToggleGroupContext);
-  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
     import_toggle3.Toggle,
     {
       "data-slot": "toggle-group-item",
@@ -6817,7 +7219,7 @@ function ToggleGroupItem({
 }
 
 // src/components/components/ToggleGroup/index.tsx
-var import_jsx_runtime124 = require("react/jsx-runtime");
+var import_jsx_runtime125 = require("react/jsx-runtime");
 function ToggleGroup2({
   options = [],
   value,
@@ -6837,7 +7239,7 @@ function ToggleGroup2({
       onChange?.(added ?? void 0);
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
     ToggleGroup,
     {
       value: groupValue,
@@ -6846,7 +7248,7 @@ function ToggleGroup2({
       onValueChange: (next) => handleChange(next),
       className,
       style,
-      children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
+      children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
         ToggleGroupItem,
         {
           value: option.value,
@@ -6860,17 +7262,17 @@ function ToggleGroup2({
 }
 
 // src/components/components/Tooltip/index.tsx
-var import_jsx_runtime125 = require("react/jsx-runtime");
+var import_jsx_runtime126 = require("react/jsx-runtime");
 function Tooltip3({ content, children, className, style }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime125.jsxs)(Tooltip2, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(TooltipTrigger, { render: triggerWrapper("tooltip-trigger-wrap"), children }),
-    /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(TooltipContent, { className, style, children: content })
+  return /* @__PURE__ */ (0, import_jsx_runtime126.jsxs)(Tooltip2, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(TooltipTrigger, { render: triggerWrapper("tooltip-trigger-wrap"), children }),
+    /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(TooltipContent, { className, style, children: content })
   ] });
 }
 
 // src/ui/typography.tsx
 var import_class_variance_authority8 = require("class-variance-authority");
-var import_jsx_runtime126 = require("react/jsx-runtime");
+var import_jsx_runtime127 = require("react/jsx-runtime");
 var typographyVariants = (0, import_class_variance_authority8.cva)("", {
   variants: {
     variant: {
@@ -6906,7 +7308,7 @@ var variantTagMap = {
 };
 function Typography({ className, variant = "p", ...props }) {
   const Tag2 = variantTagMap[variant ?? "p"];
-  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
     Tag2,
     {
       "data-slot": "typography",
@@ -6918,14 +7320,14 @@ function Typography({ className, variant = "p", ...props }) {
 }
 
 // src/components/components/Typography/index.tsx
-var import_jsx_runtime127 = require("react/jsx-runtime");
+var import_jsx_runtime128 = require("react/jsx-runtime");
 function Typography2({
   variant = "p",
   text,
   className,
   style
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(Typography, { variant, className, style, children: text });
+  return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(Typography, { variant, className, style, children: text });
 }
 
 // src/components/register.ts
@@ -6990,6 +7392,7 @@ var builtinComponents = {
   HoverCard: HoverCard2,
   // 复合类扩展组件（第三批）
   Calendar: Calendar2,
+  DatePicker,
   InputOTP: InputOTP2,
   Combobox: Combobox2,
   Carousel: Carousel2,
@@ -7042,6 +7445,7 @@ function createComponentRegistry() {
   Content,
   ContextMenu,
   DataTable,
+  DatePicker,
   Dialog,
   Drawer,
   DropdownMenu,