@k3-universe/react-kit 0.0.14 → 0.0.16

package/dist/index.js

@@ -1,6 +1,6 @@
 import { jsx, Fragment, jsxs } from "react/jsx-runtime";
 import * as React from "react";
-import React__default, { forwardRef, createElement, useLayoutEffect, useState, useRef, useCallback, useEffect, useMemo, useId as useId$2, createContext, useContext, useReducer, useImperativeHandle, Fragment as Fragment$1, memo as memo$1, use, isValidElement, PureComponent, cloneElement } from "react";
+import React__default, { forwardRef, createElement, memo as memo$1, useLayoutEffect, useState, useRef, useCallback, useEffect, useMemo, useId as useId$2, createContext, useContext, useReducer, useImperativeHandle, Fragment as Fragment$1, use, isValidElement, PureComponent, cloneElement } from "react";
 import * as ReactDOM from "react-dom";
 import ReactDOM__default from "react-dom";
 import { useLocation, Link as Link$1 } from "@tanstack/react-router";
@@ -7609,7 +7609,7 @@ const buttonVariants = cva(
       variant: {
         default: "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
         destructive: "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
-        outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+        outline: "border border-border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-border dark:hover:bg-input/50",
         secondary: "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",
         ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
         link: "text-primary underline-offset-4 hover:underline"
@@ -13429,7 +13429,867 @@ function refine(fn, _params = {}) {
 function superRefine(fn) {
   return _superRefine(fn);
 }
-var NAME$5 = "Label";
+function Card({ className, ...props2 }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "card",
+      className: cn$1(
+        "bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",
+        className
+      ),
+      ...props2
+    }
+  );
+}
+function CardHeader({ className, ...props2 }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "card-header",
+      className: cn$1(
+        "@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6",
+        className
+      ),
+      ...props2
+    }
+  );
+}
+function CardTitle({ className, ...props2 }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "card-title",
+      className: cn$1("leading-none font-semibold", className),
+      ...props2
+    }
+  );
+}
+function CardDescription({ className, ...props2 }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "card-description",
+      className: cn$1("text-muted-foreground text-sm", className),
+      ...props2
+    }
+  );
+}
+function CardAction({ className, ...props2 }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "card-action",
+      className: cn$1(
+        "col-start-2 row-span-2 row-start-1 self-start justify-self-end",
+        className
+      ),
+      ...props2
+    }
+  );
+}
+function CardContent({ className, ...props2 }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "card-content",
+      className: cn$1("px-6", className),
+      ...props2
+    }
+  );
+}
+function CardFooter({ className, ...props2 }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "card-footer",
+      className: cn$1("flex items-center px-6 [.border-t]:pt-6", className),
+      ...props2
+    }
+  );
+}
+var NAME$5 = "Separator";
+var DEFAULT_ORIENTATION = "horizontal";
+var ORIENTATIONS = ["horizontal", "vertical"];
+var Separator$3 = React.forwardRef((props2, forwardedRef) => {
+  const { decorative, orientation: orientationProp = DEFAULT_ORIENTATION, ...domProps } = props2;
+  const orientation = isValidOrientation(orientationProp) ? orientationProp : DEFAULT_ORIENTATION;
+  const ariaOrientation = orientation === "vertical" ? orientation : void 0;
+  const semanticProps = decorative ? { role: "none" } : { "aria-orientation": ariaOrientation, role: "separator" };
+  return /* @__PURE__ */ jsx(
+    Primitive.div,
+    {
+      "data-orientation": orientation,
+      ...semanticProps,
+      ...domProps,
+      ref: forwardedRef
+    }
+  );
+});
+Separator$3.displayName = NAME$5;
+function isValidOrientation(orientation) {
+  return ORIENTATIONS.includes(orientation);
+}
+var Root$e = Separator$3;
+function Separator$2({
+  className,
+  orientation = "horizontal",
+  decorative = true,
+  ...props2
+}) {
+  return /* @__PURE__ */ jsx(
+    Root$e,
+    {
+      "data-slot": "separator",
+      decorative,
+      orientation,
+      className: cn$1(
+        "bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px",
+        className
+      ),
+      ...props2
+    }
+  );
+}
+function useCallbackRef$2(callback) {
+  const callbackRef = React.useRef(callback);
+  React.useEffect(() => {
+    callbackRef.current = callback;
+  });
+  return React.useMemo(() => (...args) => {
+    var _a;
+    return (_a = callbackRef.current) == null ? void 0 : _a.call(callbackRef, ...args);
+  }, []);
+}
+var ENTRY_FOCUS = "rovingFocusGroup.onEntryFocus";
+var EVENT_OPTIONS$1 = { bubbles: false, cancelable: true };
+var GROUP_NAME$5 = "RovingFocusGroup";
+var [Collection$5, useCollection$5, createCollectionScope$5] = createCollection(GROUP_NAME$5);
+var [createRovingFocusGroupContext, createRovingFocusGroupScope] = createContextScope(
+  GROUP_NAME$5,
+  [createCollectionScope$5]
+);
+var [RovingFocusProvider, useRovingFocusContext] = createRovingFocusGroupContext(GROUP_NAME$5);
+var RovingFocusGroup = React.forwardRef(
+  (props2, forwardedRef) => {
+    return /* @__PURE__ */ jsx(Collection$5.Provider, { scope: props2.__scopeRovingFocusGroup, children: /* @__PURE__ */ jsx(Collection$5.Slot, { scope: props2.__scopeRovingFocusGroup, children: /* @__PURE__ */ jsx(RovingFocusGroupImpl, { ...props2, ref: forwardedRef }) }) });
+  }
+);
+RovingFocusGroup.displayName = GROUP_NAME$5;
+var RovingFocusGroupImpl = React.forwardRef((props2, forwardedRef) => {
+  const {
+    __scopeRovingFocusGroup,
+    orientation,
+    loop = false,
+    dir,
+    currentTabStopId: currentTabStopIdProp,
+    defaultCurrentTabStopId,
+    onCurrentTabStopIdChange,
+    onEntryFocus,
+    preventScrollOnEntryFocus = false,
+    ...groupProps
+  } = props2;
+  const ref = React.useRef(null);
+  const composedRefs = useComposedRefs$1(forwardedRef, ref);
+  const direction = useDirection(dir);
+  const [currentTabStopId, setCurrentTabStopId] = useControllableState$1({
+    prop: currentTabStopIdProp,
+    defaultProp: defaultCurrentTabStopId ?? null,
+    onChange: onCurrentTabStopIdChange,
+    caller: GROUP_NAME$5
+  });
+  const [isTabbingBackOut, setIsTabbingBackOut] = React.useState(false);
+  const handleEntryFocus = useCallbackRef$2(onEntryFocus);
+  const getItems = useCollection$5(__scopeRovingFocusGroup);
+  const isClickFocusRef = React.useRef(false);
+  const [focusableItemsCount, setFocusableItemsCount] = React.useState(0);
+  React.useEffect(() => {
+    const node = ref.current;
+    if (node) {
+      node.addEventListener(ENTRY_FOCUS, handleEntryFocus);
+      return () => node.removeEventListener(ENTRY_FOCUS, handleEntryFocus);
+    }
+  }, [handleEntryFocus]);
+  return /* @__PURE__ */ jsx(
+    RovingFocusProvider,
+    {
+      scope: __scopeRovingFocusGroup,
+      orientation,
+      dir: direction,
+      loop,
+      currentTabStopId,
+      onItemFocus: React.useCallback(
+        (tabStopId) => setCurrentTabStopId(tabStopId),
+        [setCurrentTabStopId]
+      ),
+      onItemShiftTab: React.useCallback(() => setIsTabbingBackOut(true), []),
+      onFocusableItemAdd: React.useCallback(
+        () => setFocusableItemsCount((prevCount) => prevCount + 1),
+        []
+      ),
+      onFocusableItemRemove: React.useCallback(
+        () => setFocusableItemsCount((prevCount) => prevCount - 1),
+        []
+      ),
+      children: /* @__PURE__ */ jsx(
+        Primitive.div,
+        {
+          tabIndex: isTabbingBackOut || focusableItemsCount === 0 ? -1 : 0,
+          "data-orientation": orientation,
+          ...groupProps,
+          ref: composedRefs,
+          style: { outline: "none", ...props2.style },
+          onMouseDown: composeEventHandlers$1(props2.onMouseDown, () => {
+            isClickFocusRef.current = true;
+          }),
+          onFocus: composeEventHandlers$1(props2.onFocus, (event) => {
+            const isKeyboardFocus = !isClickFocusRef.current;
+            if (event.target === event.currentTarget && isKeyboardFocus && !isTabbingBackOut) {
+              const entryFocusEvent = new CustomEvent(ENTRY_FOCUS, EVENT_OPTIONS$1);
+              event.currentTarget.dispatchEvent(entryFocusEvent);
+              if (!entryFocusEvent.defaultPrevented) {
+                const items = getItems().filter((item) => item.focusable);
+                const activeItem = items.find((item) => item.active);
+                const currentItem = items.find((item) => item.id === currentTabStopId);
+                const candidateItems = [activeItem, currentItem, ...items].filter(
+                  Boolean
+                );
+                const candidateNodes = candidateItems.map((item) => item.ref.current);
+                focusFirst$3(candidateNodes, preventScrollOnEntryFocus);
+              }
+            }
+            isClickFocusRef.current = false;
+          }),
+          onBlur: composeEventHandlers$1(props2.onBlur, () => setIsTabbingBackOut(false))
+        }
+      )
+    }
+  );
+});
+var ITEM_NAME$8 = "RovingFocusGroupItem";
+var RovingFocusGroupItem = React.forwardRef(
+  (props2, forwardedRef) => {
+    const {
+      __scopeRovingFocusGroup,
+      focusable = true,
+      active = false,
+      tabStopId,
+      children,
+      ...itemProps
+    } = props2;
+    const autoId = useId$1();
+    const id = tabStopId || autoId;
+    const context = useRovingFocusContext(ITEM_NAME$8, __scopeRovingFocusGroup);
+    const isCurrentTabStop = context.currentTabStopId === id;
+    const getItems = useCollection$5(__scopeRovingFocusGroup);
+    const { onFocusableItemAdd, onFocusableItemRemove, currentTabStopId } = context;
+    React.useEffect(() => {
+      if (focusable) {
+        onFocusableItemAdd();
+        return () => onFocusableItemRemove();
+      }
+    }, [focusable, onFocusableItemAdd, onFocusableItemRemove]);
+    return /* @__PURE__ */ jsx(
+      Collection$5.ItemSlot,
+      {
+        scope: __scopeRovingFocusGroup,
+        id,
+        focusable,
+        active,
+        children: /* @__PURE__ */ jsx(
+          Primitive.span,
+          {
+            tabIndex: isCurrentTabStop ? 0 : -1,
+            "data-orientation": context.orientation,
+            ...itemProps,
+            ref: forwardedRef,
+            onMouseDown: composeEventHandlers$1(props2.onMouseDown, (event) => {
+              if (!focusable) event.preventDefault();
+              else context.onItemFocus(id);
+            }),
+            onFocus: composeEventHandlers$1(props2.onFocus, () => context.onItemFocus(id)),
+            onKeyDown: composeEventHandlers$1(props2.onKeyDown, (event) => {
+              if (event.key === "Tab" && event.shiftKey) {
+                context.onItemShiftTab();
+                return;
+              }
+              if (event.target !== event.currentTarget) return;
+              const focusIntent = getFocusIntent(event, context.orientation, context.dir);
+              if (focusIntent !== void 0) {
+                if (event.metaKey || event.ctrlKey || event.altKey || event.shiftKey) return;
+                event.preventDefault();
+                const items = getItems().filter((item) => item.focusable);
+                let candidateNodes = items.map((item) => item.ref.current);
+                if (focusIntent === "last") candidateNodes.reverse();
+                else if (focusIntent === "prev" || focusIntent === "next") {
+                  if (focusIntent === "prev") candidateNodes.reverse();
+                  const currentIndex = candidateNodes.indexOf(event.currentTarget);
+                  candidateNodes = context.loop ? wrapArray$3(candidateNodes, currentIndex + 1) : candidateNodes.slice(currentIndex + 1);
+                }
+                setTimeout(() => focusFirst$3(candidateNodes));
+              }
+            }),
+            children: typeof children === "function" ? children({ isCurrentTabStop, hasTabStop: currentTabStopId != null }) : children
+          }
+        )
+      }
+    );
+  }
+);
+RovingFocusGroupItem.displayName = ITEM_NAME$8;
+var MAP_KEY_TO_FOCUS_INTENT = {
+  ArrowLeft: "prev",
+  ArrowUp: "prev",
+  ArrowRight: "next",
+  ArrowDown: "next",
+  PageUp: "first",
+  Home: "first",
+  PageDown: "last",
+  End: "last"
+};
+function getDirectionAwareKey(key, dir) {
+  if (dir !== "rtl") return key;
+  return key === "ArrowLeft" ? "ArrowRight" : key === "ArrowRight" ? "ArrowLeft" : key;
+}
+function getFocusIntent(event, orientation, dir) {
+  const key = getDirectionAwareKey(event.key, dir);
+  if (orientation === "vertical" && ["ArrowLeft", "ArrowRight"].includes(key)) return void 0;
+  if (orientation === "horizontal" && ["ArrowUp", "ArrowDown"].includes(key)) return void 0;
+  return MAP_KEY_TO_FOCUS_INTENT[key];
+}
+function focusFirst$3(candidates, preventScroll = false) {
+  const PREVIOUSLY_FOCUSED_ELEMENT = document.activeElement;
+  for (const candidate of candidates) {
+    if (candidate === PREVIOUSLY_FOCUSED_ELEMENT) return;
+    candidate.focus({ preventScroll });
+    if (document.activeElement !== PREVIOUSLY_FOCUSED_ELEMENT) return;
+  }
+}
+function wrapArray$3(array2, startIndex) {
+  return array2.map((_2, index2) => array2[(startIndex + index2) % array2.length]);
+}
+var Root$d = RovingFocusGroup;
+var Item$2 = RovingFocusGroupItem;
+var TABS_NAME = "Tabs";
+var [createTabsContext, createTabsScope] = createContextScope(TABS_NAME, [
+  createRovingFocusGroupScope
+]);
+var useRovingFocusGroupScope$4 = createRovingFocusGroupScope();
+var [TabsProvider, useTabsContext] = createTabsContext(TABS_NAME);
+var Tabs$1 = React.forwardRef(
+  (props2, forwardedRef) => {
+    const {
+      __scopeTabs,
+      value: valueProp,
+      onValueChange,
+      defaultValue,
+      orientation = "horizontal",
+      dir,
+      activationMode = "automatic",
+      ...tabsProps
+    } = props2;
+    const direction = useDirection(dir);
+    const [value, setValue] = useControllableState$1({
+      prop: valueProp,
+      onChange: onValueChange,
+      defaultProp: defaultValue ?? "",
+      caller: TABS_NAME
+    });
+    return /* @__PURE__ */ jsx(
+      TabsProvider,
+      {
+        scope: __scopeTabs,
+        baseId: useId$1(),
+        value,
+        onValueChange: setValue,
+        orientation,
+        dir: direction,
+        activationMode,
+        children: /* @__PURE__ */ jsx(
+          Primitive.div,
+          {
+            dir: direction,
+            "data-orientation": orientation,
+            ...tabsProps,
+            ref: forwardedRef
+          }
+        )
+      }
+    );
+  }
+);
+Tabs$1.displayName = TABS_NAME;
+var TAB_LIST_NAME = "TabsList";
+var TabsList$1 = React.forwardRef(
+  (props2, forwardedRef) => {
+    const { __scopeTabs, loop = true, ...listProps } = props2;
+    const context = useTabsContext(TAB_LIST_NAME, __scopeTabs);
+    const rovingFocusGroupScope = useRovingFocusGroupScope$4(__scopeTabs);
+    return /* @__PURE__ */ jsx(
+      Root$d,
+      {
+        asChild: true,
+        ...rovingFocusGroupScope,
+        orientation: context.orientation,
+        dir: context.dir,
+        loop,
+        children: /* @__PURE__ */ jsx(
+          Primitive.div,
+          {
+            role: "tablist",
+            "aria-orientation": context.orientation,
+            ...listProps,
+            ref: forwardedRef
+          }
+        )
+      }
+    );
+  }
+);
+TabsList$1.displayName = TAB_LIST_NAME;
+var TRIGGER_NAME$a = "TabsTrigger";
+var TabsTrigger$1 = React.forwardRef(
+  (props2, forwardedRef) => {
+    const { __scopeTabs, value, disabled = false, ...triggerProps } = props2;
+    const context = useTabsContext(TRIGGER_NAME$a, __scopeTabs);
+    const rovingFocusGroupScope = useRovingFocusGroupScope$4(__scopeTabs);
+    const triggerId = makeTriggerId$1(context.baseId, value);
+    const contentId = makeContentId$1(context.baseId, value);
+    const isSelected = value === context.value;
+    return /* @__PURE__ */ jsx(
+      Item$2,
+      {
+        asChild: true,
+        ...rovingFocusGroupScope,
+        focusable: !disabled,
+        active: isSelected,
+        children: /* @__PURE__ */ jsx(
+          Primitive.button,
+          {
+            type: "button",
+            role: "tab",
+            "aria-selected": isSelected,
+            "aria-controls": contentId,
+            "data-state": isSelected ? "active" : "inactive",
+            "data-disabled": disabled ? "" : void 0,
+            disabled,
+            id: triggerId,
+            ...triggerProps,
+            ref: forwardedRef,
+            onMouseDown: composeEventHandlers$1(props2.onMouseDown, (event) => {
+              if (!disabled && event.button === 0 && event.ctrlKey === false) {
+                context.onValueChange(value);
+              } else {
+                event.preventDefault();
+              }
+            }),
+            onKeyDown: composeEventHandlers$1(props2.onKeyDown, (event) => {
+              if ([" ", "Enter"].includes(event.key)) context.onValueChange(value);
+            }),
+            onFocus: composeEventHandlers$1(props2.onFocus, () => {
+              const isAutomaticActivation = context.activationMode !== "manual";
+              if (!isSelected && !disabled && isAutomaticActivation) {
+                context.onValueChange(value);
+              }
+            })
+          }
+        )
+      }
+    );
+  }
+);
+TabsTrigger$1.displayName = TRIGGER_NAME$a;
+var CONTENT_NAME$c = "TabsContent";
+var TabsContent$1 = React.forwardRef(
+  (props2, forwardedRef) => {
+    const { __scopeTabs, value, forceMount, children, ...contentProps } = props2;
+    const context = useTabsContext(CONTENT_NAME$c, __scopeTabs);
+    const triggerId = makeTriggerId$1(context.baseId, value);
+    const contentId = makeContentId$1(context.baseId, value);
+    const isSelected = value === context.value;
+    const isMountAnimationPreventedRef = React.useRef(isSelected);
+    React.useEffect(() => {
+      const rAF = requestAnimationFrame(() => isMountAnimationPreventedRef.current = false);
+      return () => cancelAnimationFrame(rAF);
+    }, []);
+    return /* @__PURE__ */ jsx(Presence, { present: forceMount || isSelected, children: ({ present }) => /* @__PURE__ */ jsx(
+      Primitive.div,
+      {
+        "data-state": isSelected ? "active" : "inactive",
+        "data-orientation": context.orientation,
+        role: "tabpanel",
+        "aria-labelledby": triggerId,
+        hidden: !present,
+        id: contentId,
+        tabIndex: 0,
+        ...contentProps,
+        ref: forwardedRef,
+        style: {
+          ...props2.style,
+          animationDuration: isMountAnimationPreventedRef.current ? "0s" : void 0
+        },
+        children: present && children
+      }
+    ) });
+  }
+);
+TabsContent$1.displayName = CONTENT_NAME$c;
+function makeTriggerId$1(baseId, value) {
+  return `${baseId}-trigger-${value}`;
+}
+function makeContentId$1(baseId, value) {
+  return `${baseId}-content-${value}`;
+}
+var Root2$a = Tabs$1;
+var List$1 = TabsList$1;
+var Trigger$9 = TabsTrigger$1;
+var Content$4 = TabsContent$1;
+function Tabs({
+  className,
+  ...props2
+}) {
+  return /* @__PURE__ */ jsx(
+    Root2$a,
+    {
+      "data-slot": "tabs",
+      className: cn$1("flex flex-col gap-2", className),
+      ...props2
+    }
+  );
+}
+function TabsList({
+  className,
+  ...props2
+}) {
+  return /* @__PURE__ */ jsx(
+    List$1,
+    {
+      "data-slot": "tabs-list",
+      className: cn$1(
+        "bg-muted text-muted-foreground inline-flex h-9 w-fit items-center justify-center rounded-lg p-[3px]",
+        className
+      ),
+      ...props2
+    }
+  );
+}
+function TabsTrigger({
+  className,
+  ...props2
+}) {
+  return /* @__PURE__ */ jsx(
+    Trigger$9,
+    {
+      "data-slot": "tabs-trigger",
+      className: cn$1(
+        "data-[state=active]:bg-background dark:data-[state=active]:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 text-foreground dark:text-muted-foreground inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      ...props2
+    }
+  );
+}
+function TabsContent({
+  className,
+  ...props2
+}) {
+  return /* @__PURE__ */ jsx(
+    Content$4,
+    {
+      "data-slot": "tabs-content",
+      className: cn$1("flex-1 outline-none", className),
+      ...props2
+    }
+  );
+}
+const GRID_COLS = {
+  base: {
+    1: "grid-cols-1",
+    2: "grid-cols-2",
+    3: "grid-cols-3",
+    4: "grid-cols-4",
+    5: "grid-cols-5",
+    6: "grid-cols-6",
+    7: "grid-cols-7",
+    8: "grid-cols-8",
+    9: "grid-cols-9",
+    10: "grid-cols-10",
+    11: "grid-cols-11",
+    12: "grid-cols-12"
+  },
+  sm: {
+    1: "sm:grid-cols-1",
+    2: "sm:grid-cols-2",
+    3: "sm:grid-cols-3",
+    4: "sm:grid-cols-4",
+    5: "sm:grid-cols-5",
+    6: "sm:grid-cols-6",
+    7: "sm:grid-cols-7",
+    8: "sm:grid-cols-8",
+    9: "sm:grid-cols-9",
+    10: "sm:grid-cols-10",
+    11: "sm:grid-cols-11",
+    12: "sm:grid-cols-12"
+  },
+  md: {
+    1: "md:grid-cols-1",
+    2: "md:grid-cols-2",
+    3: "md:grid-cols-3",
+    4: "md:grid-cols-4",
+    5: "md:grid-cols-5",
+    6: "md:grid-cols-6",
+    7: "md:grid-cols-7",
+    8: "md:grid-cols-8",
+    9: "md:grid-cols-9",
+    10: "md:grid-cols-10",
+    11: "md:grid-cols-11",
+    12: "md:grid-cols-12"
+  },
+  lg: {
+    1: "lg:grid-cols-1",
+    2: "lg:grid-cols-2",
+    3: "lg:grid-cols-3",
+    4: "lg:grid-cols-4",
+    5: "lg:grid-cols-5",
+    6: "lg:grid-cols-6",
+    7: "lg:grid-cols-7",
+    8: "lg:grid-cols-8",
+    9: "lg:grid-cols-9",
+    10: "lg:grid-cols-10",
+    11: "lg:grid-cols-11",
+    12: "lg:grid-cols-12"
+  },
+  xl: {
+    1: "xl:grid-cols-1",
+    2: "xl:grid-cols-2",
+    3: "xl:grid-cols-3",
+    4: "xl:grid-cols-4",
+    5: "xl:grid-cols-5",
+    6: "xl:grid-cols-6",
+    7: "xl:grid-cols-7",
+    8: "xl:grid-cols-8",
+    9: "xl:grid-cols-9",
+    10: "xl:grid-cols-10",
+    11: "xl:grid-cols-11",
+    12: "xl:grid-cols-12"
+  }
+};
+const COL_SPAN = {
+  base: {
+    1: "col-span-1",
+    2: "col-span-2",
+    3: "col-span-3",
+    4: "col-span-4",
+    5: "col-span-5",
+    6: "col-span-6",
+    7: "col-span-7",
+    8: "col-span-8",
+    9: "col-span-9",
+    10: "col-span-10",
+    11: "col-span-11",
+    12: "col-span-12"
+  },
+  sm: {
+    1: "sm:col-span-1",
+    2: "sm:col-span-2",
+    3: "sm:col-span-3",
+    4: "sm:col-span-4",
+    5: "sm:col-span-5",
+    6: "sm:col-span-6",
+    7: "sm:col-span-7",
+    8: "sm:col-span-8",
+    9: "sm:col-span-9",
+    10: "sm:col-span-10",
+    11: "sm:col-span-11",
+    12: "sm:col-span-12"
+  },
+  md: {
+    1: "md:col-span-1",
+    2: "md:col-span-2",
+    3: "md:col-span-3",
+    4: "md:col-span-4",
+    5: "md:col-span-5",
+    6: "md:col-span-6",
+    7: "md:col-span-7",
+    8: "md:col-span-8",
+    9: "md:col-span-9",
+    10: "md:col-span-10",
+    11: "md:col-span-11",
+    12: "md:col-span-12"
+  },
+  lg: {
+    1: "lg:col-span-1",
+    2: "lg:col-span-2",
+    3: "lg:col-span-3",
+    4: "lg:col-span-4",
+    5: "lg:col-span-5",
+    6: "lg:col-span-6",
+    7: "lg:col-span-7",
+    8: "lg:col-span-8",
+    9: "lg:col-span-9",
+    10: "lg:col-span-10",
+    11: "lg:col-span-11",
+    12: "lg:col-span-12"
+  },
+  xl: {
+    1: "xl:col-span-1",
+    2: "xl:col-span-2",
+    3: "xl:col-span-3",
+    4: "xl:col-span-4",
+    5: "xl:col-span-5",
+    6: "xl:col-span-6",
+    7: "xl:col-span-7",
+    8: "xl:col-span-8",
+    9: "xl:col-span-9",
+    10: "xl:col-span-10",
+    11: "xl:col-span-11",
+    12: "xl:col-span-12"
+  }
+};
+function gridClasses(options) {
+  const cols = (options == null ? void 0 : options.cols) ?? 1;
+  const sm = options == null ? void 0 : options.smCols;
+  const md = options == null ? void 0 : options.mdCols;
+  const lg = options == null ? void 0 : options.lgCols;
+  const xl = options == null ? void 0 : options.xlCols;
+  const gap = (options == null ? void 0 : options.gap) ?? "gap-4";
+  return cn$1(
+    "grid",
+    GRID_COLS.base[cols],
+    sm ? GRID_COLS.sm[sm] : void 0,
+    md ? GRID_COLS.md[md] : void 0,
+    lg ? GRID_COLS.lg[lg] : void 0,
+    xl ? GRID_COLS.xl[xl] : void 0,
+    gap
+  );
+}
+function flexClasses(options) {
+  const direction = (options == null ? void 0 : options.direction) ?? "col";
+  const wrap = (options == null ? void 0 : options.wrap) ? "flex-wrap" : "flex-nowrap";
+  const gap = (options == null ? void 0 : options.gap) ?? "gap-4";
+  const align = (options == null ? void 0 : options.align) ?? "stretch";
+  const justify = (options == null ? void 0 : options.justify) ?? "start";
+  const alignClass = align === "start" ? "items-start" : align === "center" ? "items-center" : align === "end" ? "items-end" : "items-stretch";
+  const justifyClass = justify === "start" ? "justify-start" : justify === "center" ? "justify-center" : justify === "between" ? "justify-between" : "justify-end";
+  return cn$1("flex", `flex-${direction}`, wrap, gap, alignClass, justifyClass);
+}
+function leafSpanClasses(leaf) {
+  if (!leaf.span) return void 0;
+  const parts = [];
+  if (leaf.span.base) parts.push(COL_SPAN.base[leaf.span.base]);
+  if (leaf.span.sm) parts.push(COL_SPAN.sm[leaf.span.sm]);
+  if (leaf.span.md) parts.push(COL_SPAN.md[leaf.span.md]);
+  if (leaf.span.lg) parts.push(COL_SPAN.lg[leaf.span.lg]);
+  if (leaf.span.xl) parts.push(COL_SPAN.xl[leaf.span.xl]);
+  return parts.join(" ");
+}
+function isLeaf(child) {
+  return child.content !== void 0;
+}
+function shallowEqualSpan(a2, b2) {
+  if (a2 === b2) return true;
+  if (!a2 || !b2) return !a2 && !b2;
+  return a2.base === b2.base && a2.sm === b2.sm && a2.md === b2.md && a2.lg === b2.lg && a2.xl === b2.xl;
+}
+function shallowEqualLeaf(a2, b2) {
+  const renderKeyEqual = (a2.renderKey ?? null) === (b2.renderKey ?? null);
+  return a2.key === b2.key && a2.hidden === b2.hidden && a2.className === b2.className && a2.labelLayout === b2.labelLayout && a2.labelClassName === b2.labelClassName && a2.valueClassName === b2.valueClassName && a2.inlineLabelWidthClass === b2.inlineLabelWidthClass && shallowEqualSpan(a2.span, b2.span) && renderKeyEqual;
+}
+const SectionLeafRenderer = memo$1(
+  function SectionLeafRenderer2({ leaf, renderLeaf }) {
+    if (leaf.hidden) return null;
+    const span = leafSpanClasses(leaf);
+    if (renderLeaf) {
+      return /* @__PURE__ */ jsx("div", { className: cn$1(span, leaf.className), children: renderLeaf(leaf) });
+    }
+    const hasLabel = leaf.label !== void 0 && leaf.label !== null && leaf.label !== "";
+    const layout = leaf.labelLayout ?? "stacked";
+    const labelBaseCls = "text-xs text-muted-foreground";
+    const valueBaseCls = "text-sm leading-6";
+    if (!hasLabel) {
+      return /* @__PURE__ */ jsx("div", { className: cn$1(span, leaf.className, leaf.valueClassName), children: leaf.content });
+    }
+    if (layout === "inline") {
+      const labelWidth = leaf.inlineLabelWidthClass ?? "w-32";
+      return /* @__PURE__ */ jsxs("div", { className: cn$1(span, leaf.className, "flex items-start gap-4"), children: [
+        /* @__PURE__ */ jsx("div", { className: cn$1(labelWidth, labelBaseCls, leaf.labelClassName), children: leaf.label }),
+        /* @__PURE__ */ jsxs("div", { className: cn$1("flex-1", valueBaseCls, leaf.valueClassName), children: [
+          leaf.content,
+          leaf.description ? /* @__PURE__ */ jsx("div", { className: cn$1("mt-1", labelBaseCls), children: leaf.description }) : null
+        ] })
+      ] });
+    }
+    return /* @__PURE__ */ jsxs("div", { className: cn$1(span, leaf.className, "flex flex-col"), children: [
+      /* @__PURE__ */ jsx("div", { className: cn$1(labelBaseCls, leaf.labelClassName), children: leaf.label }),
+      /* @__PURE__ */ jsx("div", { className: cn$1(valueBaseCls, leaf.valueClassName), children: leaf.content }),
+      leaf.description ? /* @__PURE__ */ jsx("div", { className: cn$1("mt-1", labelBaseCls), children: leaf.description }) : null
+    ] });
+  },
+  (prev, next) => shallowEqualLeaf(prev.leaf, next.leaf) && prev.renderLeaf === next.renderLeaf
+);
+function SectionNodeRenderer({ node, renderLeaf }) {
+  var _a;
+  if (node.hidden) return null;
+  const layout = node.layout ?? "grid";
+  const containerClass = layout === "grid" ? gridClasses(node.grid) : layout === "flex" ? flexClasses(node.flex) : "";
+  const SectionContainer = ({ children }) => {
+    const title = node.title;
+    const description = node.subtitle;
+    const variant = node.variant ?? "card";
+    const className = node.className;
+    const headerClassName = node.headerClassName;
+    const contentClassName = node.contentClassName;
+    const renderHeader = () => {
+      if (!title && !description) return null;
+      return /* @__PURE__ */ jsxs("div", { className: cn$1("space-y-1", headerClassName), children: [
+        title && /* @__PURE__ */ jsx("h3", { className: "text-lg font-medium leading-none", children: title }),
+        description && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: description })
+      ] });
+    };
+    const renderContent2 = () => /* @__PURE__ */ jsx("div", { className: cn$1("space-y-4", contentClassName), children });
+    switch (variant) {
+      case "card":
+        return /* @__PURE__ */ jsxs(Card, { className, children: [
+          (title || description) && /* @__PURE__ */ jsxs(CardHeader, { children: [
+            title && /* @__PURE__ */ jsx(CardTitle, { children: title }),
+            description && /* @__PURE__ */ jsx(CardDescription, { children: description })
+          ] }),
+          /* @__PURE__ */ jsx(CardContent, { children: renderContent2() })
+        ] });
+      case "separator":
+        return /* @__PURE__ */ jsxs("div", { className: cn$1("space-y-6", className), children: [
+          (title || description) && /* @__PURE__ */ jsxs(Fragment, { children: [
+            renderHeader(),
+            /* @__PURE__ */ jsx(Separator$2, {})
+          ] }),
+          renderContent2()
+        ] });
+      default:
+        return /* @__PURE__ */ jsxs("div", { className: cn$1("space-y-6", className), children: [
+          renderHeader(),
+          renderContent2()
+        ] });
+    }
+  };
+  if (layout === "tabs" && node.tabs && node.tabs.length > 0) {
+    const defaultTabId = node.defaultTabId ?? ((_a = node.tabs[0]) == null ? void 0 : _a.id);
+    return /* @__PURE__ */ jsx(SectionContainer, { children: /* @__PURE__ */ jsxs(Tabs, { defaultValue: defaultTabId, className: cn$1("space-y-2"), children: [
+      /* @__PURE__ */ jsx(TabsList, { className: cn$1(node.tabsListClassName), children: node.tabs.map((tab) => /* @__PURE__ */ jsx(TabsTrigger, { value: tab.id, className: cn$1(tab.className), children: tab.label }, tab.id)) }),
+      node.tabs.map((tab) => /* @__PURE__ */ jsx(TabsContent, { value: tab.id, className: cn$1(node.tabsContentClassName, tab.contentClassName), children: /* @__PURE__ */ jsx(SectionNodeRenderer, { node: tab.node, renderLeaf }) }, tab.id))
+    ] }) });
+  }
+  return /* @__PURE__ */ jsx(SectionContainer, { children: /* @__PURE__ */ jsx("div", { className: containerClass, children: (node.children ?? []).map((child) => {
+    if (isLeaf(child)) {
+      return /* @__PURE__ */ jsx(SectionLeafRenderer, { leaf: child, renderLeaf }, child.key);
+    }
+    if (child.hidden) return null;
+    return /* @__PURE__ */ jsx("div", { className: "col-span-full", children: /* @__PURE__ */ jsx(SectionNodeRenderer, { node: child, renderLeaf }) }, child.id);
+  }) }) });
+}
+function SectionBuilder({ sections, className, renderLeaf }) {
+  return /* @__PURE__ */ jsx("div", { className: cn$1("space-y-6", className), children: sections.map((section) => /* @__PURE__ */ jsx(SectionNodeRenderer, { node: section, renderLeaf }, section.id)) });
+}
+var NAME$4 = "Label";
 var Label$3 = React.forwardRef((props2, forwardedRef) => {
   return /* @__PURE__ */ jsx(
     Primitive.label,
@@ -13446,14 +14306,14 @@ var Label$3 = React.forwardRef((props2, forwardedRef) => {
     }
   );
 });
-Label$3.displayName = NAME$5;
-var Root$e = Label$3;
+Label$3.displayName = NAME$4;
+var Root$c = Label$3;
 function Label$2({
   className,
   ...props2
 }) {
   return /* @__PURE__ */ jsx(
-    Root$e,
+    Root$c,
     {
       "data-slot": "label",
       className: cn$1(
@@ -13464,16 +14324,6 @@ function Label$2({
     }
   );
 }
-function useCallbackRef$2(callback) {
-  const callbackRef = React.useRef(callback);
-  React.useEffect(() => {
-    callbackRef.current = callback;
-  });
-  return React.useMemo(() => (...args) => {
-    var _a;
-    return (_a = callbackRef.current) == null ? void 0 : _a.call(callbackRef, ...args);
-  }, []);
-}
 function useEscapeKeydown(onEscapeKeyDownProp, ownerDocument = globalThis == null ? void 0 : globalThis.document) {
   const onEscapeKeyDown = useCallbackRef$2(onEscapeKeyDownProp);
   React.useEffect(() => {
@@ -13714,7 +14564,7 @@ function createFocusGuard() {
 }
 var AUTOFOCUS_ON_MOUNT = "focusScope.autoFocusOnMount";
 var AUTOFOCUS_ON_UNMOUNT = "focusScope.autoFocusOnUnmount";
-var EVENT_OPTIONS$1 = { bubbles: false, cancelable: true };
+var EVENT_OPTIONS = { bubbles: false, cancelable: true };
 var FOCUS_SCOPE_NAME = "FocusScope";
 var FocusScope = React.forwardRef((props2, forwardedRef) => {
   const {
@@ -13779,11 +14629,11 @@ var FocusScope = React.forwardRef((props2, forwardedRef) => {
       const previouslyFocusedElement = document.activeElement;
       const hasFocusedCandidate = container.contains(previouslyFocusedElement);
       if (!hasFocusedCandidate) {
-        const mountEvent = new CustomEvent(AUTOFOCUS_ON_MOUNT, EVENT_OPTIONS$1);
+        const mountEvent = new CustomEvent(AUTOFOCUS_ON_MOUNT, EVENT_OPTIONS);
         container.addEventListener(AUTOFOCUS_ON_MOUNT, onMountAutoFocus);
         container.dispatchEvent(mountEvent);
         if (!mountEvent.defaultPrevented) {
-          focusFirst$3(removeLinks(getTabbableCandidates$1(container)), { select: true });
+          focusFirst$2(removeLinks(getTabbableCandidates$1(container)), { select: true });
           if (document.activeElement === previouslyFocusedElement) {
             focus(container);
           }
@@ -13792,7 +14642,7 @@ var FocusScope = React.forwardRef((props2, forwardedRef) => {
       return () => {
         container.removeEventListener(AUTOFOCUS_ON_MOUNT, onMountAutoFocus);
         setTimeout(() => {
-          const unmountEvent = new CustomEvent(AUTOFOCUS_ON_UNMOUNT, EVENT_OPTIONS$1);
+          const unmountEvent = new CustomEvent(AUTOFOCUS_ON_UNMOUNT, EVENT_OPTIONS);
           container.addEventListener(AUTOFOCUS_ON_UNMOUNT, onUnmountAutoFocus);
           container.dispatchEvent(unmountEvent);
           if (!unmountEvent.defaultPrevented) {
@@ -13832,7 +14682,7 @@ var FocusScope = React.forwardRef((props2, forwardedRef) => {
   return /* @__PURE__ */ jsx(Primitive.div, { tabIndex: -1, ...scopeProps, ref: composedRefs, onKeyDown: handleKeyDown });
 });
 FocusScope.displayName = FOCUS_SCOPE_NAME;
-function focusFirst$3(candidates, { select = false } = {}) {
+function focusFirst$2(candidates, { select = false } = {}) {
   const previouslyFocusedElement = document.activeElement;
   for (const candidate of candidates) {
     focus(candidate, { select });
@@ -15781,7 +16631,7 @@ const arrow = (options, deps) => ({
   ...arrow$1(options),
   options: [options, deps]
 });
-var NAME$4 = "Arrow";
+var NAME$3 = "Arrow";
 var Arrow$1 = React.forwardRef((props2, forwardedRef) => {
   const { children, width = 10, height = 5, ...arrowProps } = props2;
   return /* @__PURE__ */ jsx(
@@ -15797,8 +16647,8 @@ var Arrow$1 = React.forwardRef((props2, forwardedRef) => {
     }
   );
 });
-Arrow$1.displayName = NAME$4;
-var Root$d = Arrow$1;
+Arrow$1.displayName = NAME$3;
+var Root$b = Arrow$1;
 var POPPER_NAME = "Popper";
 var [createPopperContext, createPopperScope] = createContextScope(POPPER_NAME);
 var [PopperProvider, usePopperContext] = createPopperContext(POPPER_NAME);
@@ -15827,8 +16677,8 @@ var PopperAnchor = React.forwardRef(
   }
 );
 PopperAnchor.displayName = ANCHOR_NAME$2;
-var CONTENT_NAME$c = "PopperContent";
-var [PopperContentProvider, useContentContext] = createPopperContext(CONTENT_NAME$c);
+var CONTENT_NAME$b = "PopperContent";
+var [PopperContentProvider, useContentContext] = createPopperContext(CONTENT_NAME$b);
 var PopperContent = React.forwardRef(
   (props2, forwardedRef) => {
     var _a, _b, _c, _d, _e2, _f;
@@ -15848,7 +16698,7 @@ var PopperContent = React.forwardRef(
       onPlaced,
       ...contentProps
     } = props2;
-    const context = usePopperContext(CONTENT_NAME$c, __scopePopper);
+    const context = usePopperContext(CONTENT_NAME$b, __scopePopper);
     const [content, setContent] = React.useState(null);
     const composedRefs = useComposedRefs$1(forwardedRef, (node) => setContent(node));
     const [arrow$12, setArrow] = React.useState(null);
@@ -15971,7 +16821,7 @@ var PopperContent = React.forwardRef(
     );
   }
 );
-PopperContent.displayName = CONTENT_NAME$c;
+PopperContent.displayName = CONTENT_NAME$b;
 var ARROW_NAME$8 = "PopperArrow";
 var OPPOSITE_SIDE = {
   top: "bottom",
@@ -16011,7 +16861,7 @@ var PopperArrow = React.forwardRef(function PopperArrow2(props2, forwardedRef) {
           visibility: contentContext.shouldHideArrow ? "hidden" : void 0
         },
         children: /* @__PURE__ */ jsx(
-          Root$d,
+          Root$b,
           {
             ...arrowProps,
             ref: forwardedRef,
@@ -16066,9 +16916,9 @@ function getSideAndAlignFromPlacement(placement) {
   const [side, align = "center"] = placement.split("-");
   return [side, align];
 }
-var Root2$a = Popper;
+var Root2$9 = Popper;
 var Anchor = PopperAnchor;
-var Content$4 = PopperContent;
+var Content$3 = PopperContent;
 var Arrow = PopperArrow;
 var PORTAL_NAME$a = "Portal";
 var Portal$7 = React.forwardRef((props2, forwardedRef) => {
@@ -16904,7 +17754,7 @@ var Popover$1 = (props2) => {
     onChange: onOpenChange,
     caller: POPOVER_NAME
   });
-  return /* @__PURE__ */ jsx(Root2$a, { ...popperScope, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(Root2$9, { ...popperScope, children: /* @__PURE__ */ jsx(
     PopoverProvider,
     {
       scope: __scopePopover,
@@ -16937,11 +17787,11 @@ var PopoverAnchor$1 = React.forwardRef(
   }
 );
 PopoverAnchor$1.displayName = ANCHOR_NAME$1;
-var TRIGGER_NAME$a = "PopoverTrigger";
+var TRIGGER_NAME$9 = "PopoverTrigger";
 var PopoverTrigger$1 = React.forwardRef(
   (props2, forwardedRef) => {
     const { __scopePopover, ...triggerProps } = props2;
-    const context = usePopoverContext(TRIGGER_NAME$a, __scopePopover);
+    const context = usePopoverContext(TRIGGER_NAME$9, __scopePopover);
     const popperScope = usePopperScope$4(__scopePopover);
     const composedTriggerRef = useComposedRefs$1(forwardedRef, context.triggerRef);
     const trigger = /* @__PURE__ */ jsx(
@@ -16960,7 +17810,7 @@ var PopoverTrigger$1 = React.forwardRef(
     return context.hasCustomAnchor ? trigger : /* @__PURE__ */ jsx(Anchor, { asChild: true, ...popperScope, children: trigger });
   }
 );
-PopoverTrigger$1.displayName = TRIGGER_NAME$a;
+PopoverTrigger$1.displayName = TRIGGER_NAME$9;
 var PORTAL_NAME$9 = "PopoverPortal";
 var [PortalProvider$4, usePortalContext$4] = createPopoverContext(PORTAL_NAME$9, {
   forceMount: void 0
@@ -16971,20 +17821,20 @@ var PopoverPortal = (props2) => {
   return /* @__PURE__ */ jsx(PortalProvider$4, { scope: __scopePopover, forceMount, children: /* @__PURE__ */ jsx(Presence, { present: forceMount || context.open, children: /* @__PURE__ */ jsx(Portal$7, { asChild: true, container, children }) }) });
 };
 PopoverPortal.displayName = PORTAL_NAME$9;
-var CONTENT_NAME$b = "PopoverContent";
+var CONTENT_NAME$a = "PopoverContent";
 var PopoverContent$1 = React.forwardRef(
   (props2, forwardedRef) => {
-    const portalContext = usePortalContext$4(CONTENT_NAME$b, props2.__scopePopover);
+    const portalContext = usePortalContext$4(CONTENT_NAME$a, props2.__scopePopover);
     const { forceMount = portalContext.forceMount, ...contentProps } = props2;
-    const context = usePopoverContext(CONTENT_NAME$b, props2.__scopePopover);
+    const context = usePopoverContext(CONTENT_NAME$a, props2.__scopePopover);
     return /* @__PURE__ */ jsx(Presence, { present: forceMount || context.open, children: context.modal ? /* @__PURE__ */ jsx(PopoverContentModal, { ...contentProps, ref: forwardedRef }) : /* @__PURE__ */ jsx(PopoverContentNonModal, { ...contentProps, ref: forwardedRef }) });
   }
 );
-PopoverContent$1.displayName = CONTENT_NAME$b;
+PopoverContent$1.displayName = CONTENT_NAME$a;
 var Slot$3 = /* @__PURE__ */ createSlot("PopoverContent.RemoveScroll");
 var PopoverContentModal = React.forwardRef(
   (props2, forwardedRef) => {
-    const context = usePopoverContext(CONTENT_NAME$b, props2.__scopePopover);
+    const context = usePopoverContext(CONTENT_NAME$a, props2.__scopePopover);
     const contentRef = React.useRef(null);
     const composedRefs = useComposedRefs$1(forwardedRef, contentRef);
     const isRightClickOutsideRef = React.useRef(false);
@@ -17025,7 +17875,7 @@ var PopoverContentModal = React.forwardRef(
 );
 var PopoverContentNonModal = React.forwardRef(
   (props2, forwardedRef) => {
-    const context = usePopoverContext(CONTENT_NAME$b, props2.__scopePopover);
+    const context = usePopoverContext(CONTENT_NAME$a, props2.__scopePopover);
     const hasInteractedOutsideRef = React.useRef(false);
     const hasPointerDownOutsideRef = React.useRef(false);
     return /* @__PURE__ */ jsx(
@@ -17079,7 +17929,7 @@ var PopoverContentImpl = React.forwardRef(
       onInteractOutside,
       ...contentProps
     } = props2;
-    const context = usePopoverContext(CONTENT_NAME$b, __scopePopover);
+    const context = usePopoverContext(CONTENT_NAME$a, __scopePopover);
     const popperScope = usePopperScope$4(__scopePopover);
     useFocusGuards();
     return /* @__PURE__ */ jsx(
@@ -17101,7 +17951,7 @@ var PopoverContentImpl = React.forwardRef(
             onFocusOutside,
             onDismiss: () => context.onOpenChange(false),
             children: /* @__PURE__ */ jsx(
-              Content$4,
+              Content$3,
               {
                 "data-state": getState$3(context.open),
                 role: "dialog",
@@ -17157,20 +18007,20 @@ PopoverArrow.displayName = ARROW_NAME$7;
 function getState$3(open) {
   return open ? "open" : "closed";
 }
-var Root2$9 = Popover$1;
+var Root2$8 = Popover$1;
 var Anchor2$1 = PopoverAnchor$1;
-var Trigger$9 = PopoverTrigger$1;
+var Trigger$8 = PopoverTrigger$1;
 var Portal$6 = PopoverPortal;
 var Content2$8 = PopoverContent$1;
 function Popover({
   ...props2
 }) {
-  return /* @__PURE__ */ jsx(Root2$9, { "data-slot": "popover", ...props2 });
+  return /* @__PURE__ */ jsx(Root2$8, { "data-slot": "popover", ...props2 });
 }
 function PopoverTrigger({
   ...props2
 }) {
-  return /* @__PURE__ */ jsx(Trigger$9, { "data-slot": "popover-trigger", ...props2 });
+  return /* @__PURE__ */ jsx(Trigger$8, { "data-slot": "popover-trigger", ...props2 });
 }
 function PopoverContent({
   className,
@@ -17185,7 +18035,7 @@ function PopoverContent({
       align,
       sideOffset,
       className: cn$1(
-        "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
+        "border-border bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
         className
       ),
       ...props2
@@ -17250,11 +18100,11 @@ var Dialog$1 = (props2) => {
   );
 };
 Dialog$1.displayName = DIALOG_NAME;
-var TRIGGER_NAME$9 = "DialogTrigger";
+var TRIGGER_NAME$8 = "DialogTrigger";
 var DialogTrigger$1 = React.forwardRef(
   (props2, forwardedRef) => {
     const { __scopeDialog, ...triggerProps } = props2;
-    const context = useDialogContext(TRIGGER_NAME$9, __scopeDialog);
+    const context = useDialogContext(TRIGGER_NAME$8, __scopeDialog);
     const composedTriggerRef = useComposedRefs$1(forwardedRef, context.triggerRef);
     return /* @__PURE__ */ jsx(
       Primitive.button,
@@ -17271,7 +18121,7 @@ var DialogTrigger$1 = React.forwardRef(
     );
   }
 );
-DialogTrigger$1.displayName = TRIGGER_NAME$9;
+DialogTrigger$1.displayName = TRIGGER_NAME$8;
 var PORTAL_NAME$8 = "DialogPortal";
 var [PortalProvider$3, usePortalContext$3] = createDialogContext(PORTAL_NAME$8, {
   forceMount: void 0
@@ -17312,19 +18162,19 @@ var DialogOverlayImpl = React.forwardRef(
     );
   }
 );
-var CONTENT_NAME$a = "DialogContent";
+var CONTENT_NAME$9 = "DialogContent";
 var DialogContent$1 = React.forwardRef(
   (props2, forwardedRef) => {
-    const portalContext = usePortalContext$3(CONTENT_NAME$a, props2.__scopeDialog);
+    const portalContext = usePortalContext$3(CONTENT_NAME$9, props2.__scopeDialog);
     const { forceMount = portalContext.forceMount, ...contentProps } = props2;
-    const context = useDialogContext(CONTENT_NAME$a, props2.__scopeDialog);
+    const context = useDialogContext(CONTENT_NAME$9, props2.__scopeDialog);
     return /* @__PURE__ */ jsx(Presence, { present: forceMount || context.open, children: context.modal ? /* @__PURE__ */ jsx(DialogContentModal, { ...contentProps, ref: forwardedRef }) : /* @__PURE__ */ jsx(DialogContentNonModal, { ...contentProps, ref: forwardedRef }) });
   }
 );
-DialogContent$1.displayName = CONTENT_NAME$a;
+DialogContent$1.displayName = CONTENT_NAME$9;
 var DialogContentModal = React.forwardRef(
   (props2, forwardedRef) => {
-    const context = useDialogContext(CONTENT_NAME$a, props2.__scopeDialog);
+    const context = useDialogContext(CONTENT_NAME$9, props2.__scopeDialog);
     const contentRef = React.useRef(null);
     const composedRefs = useComposedRefs$1(forwardedRef, context.contentRef, contentRef);
     React.useEffect(() => {
@@ -17359,7 +18209,7 @@ var DialogContentModal = React.forwardRef(
 );
 var DialogContentNonModal = React.forwardRef(
   (props2, forwardedRef) => {
-    const context = useDialogContext(CONTENT_NAME$a, props2.__scopeDialog);
+    const context = useDialogContext(CONTENT_NAME$9, props2.__scopeDialog);
     const hasInteractedOutsideRef = React.useRef(false);
     const hasPointerDownOutsideRef = React.useRef(false);
     return /* @__PURE__ */ jsx(
@@ -17402,7 +18252,7 @@ var DialogContentNonModal = React.forwardRef(
 var DialogContentImpl = React.forwardRef(
   (props2, forwardedRef) => {
     const { __scopeDialog, trapFocus, onOpenAutoFocus, onCloseAutoFocus, ...contentProps } = props2;
-    const context = useDialogContext(CONTENT_NAME$a, __scopeDialog);
+    const context = useDialogContext(CONTENT_NAME$9, __scopeDialog);
     const contentRef = React.useRef(null);
     const composedRefs = useComposedRefs$1(forwardedRef, contentRef);
     useFocusGuards();
@@ -17477,7 +18327,7 @@ function getState$2(open) {
 }
 var TITLE_WARNING_NAME = "DialogTitleWarning";
 var [WarningProvider, useWarningContext] = createContext2(TITLE_WARNING_NAME, {
-  contentName: CONTENT_NAME$a,
+  contentName: CONTENT_NAME$9,
   titleName: TITLE_NAME$1,
   docsSlug: "dialog"
 });
@@ -17510,11 +18360,11 @@ var DescriptionWarning$1 = ({ contentRef, descriptionId }) => {
   }, [MESSAGE, contentRef, descriptionId]);
   return null;
 };
-var Root$c = Dialog$1;
-var Trigger$8 = DialogTrigger$1;
+var Root$a = Dialog$1;
+var Trigger$7 = DialogTrigger$1;
 var Portal$5 = DialogPortal$1;
 var Overlay$1 = DialogOverlay$1;
-var Content$3 = DialogContent$1;
+var Content$2 = DialogContent$1;
 var Title = DialogTitle$1;
 var Description = DialogDescription$1;
 var Close = DialogClose$1;
@@ -17746,7 +18596,7 @@ var N$1 = '[cmdk-group=""]', Y$1 = '[cmdk-group-items=""]', be = '[cmdk-group-he
   }, []), React.createElement(Primitive.div, { ref: composeRefs$1(d, o2), ...c2, "cmdk-list": "", role: "listbox", tabIndex: -1, "aria-activedescendant": p2, "aria-label": u2, id: b2.listId }, B(r2, (m2) => React.createElement("div", { ref: composeRefs$1(f, b2.listInnerRef), "cmdk-list-sizer": "" }, m2)));
 }), xe = React.forwardRef((r2, o2) => {
   let { open: n2, onOpenChange: u2, overlayClassName: c2, contentClassName: d, container: f, ...p2 } = r2;
-  return React.createElement(Root$c, { open: n2, onOpenChange: u2 }, React.createElement(Portal$5, { container: f }, React.createElement(Overlay$1, { "cmdk-overlay": "", className: c2 }), React.createElement(Content$3, { "aria-label": r2.label, "cmdk-dialog": "", className: d }, React.createElement(me, { ref: o2, ...p2 }))));
+  return React.createElement(Root$a, { open: n2, onOpenChange: u2 }, React.createElement(Portal$5, { container: f }, React.createElement(Overlay$1, { "cmdk-overlay": "", className: c2 }), React.createElement(Content$2, { "aria-label": r2.label, "cmdk-dialog": "", className: d }, React.createElement(me, { ref: o2, ...p2 }))));
 }), Ie = React.forwardRef((r2, o2) => P((u2) => u2.filtered.count === 0) ? React.createElement(Primitive.div, { ref: o2, ...r2, "cmdk-empty": "", role: "presentation" }) : null), Pe = React.forwardRef((r2, o2) => {
   let { progress: n2, children: u2, label: c2 = "Loading...", ...d } = r2;
   return React.createElement(Primitive.div, { ref: o2, ...d, "cmdk-loading": "", role: "progressbar", "aria-valuenow": n2, "aria-valuemin": 0, "aria-valuemax": 100, "aria-label": c2 }, B(r2, (f) => React.createElement("div", { "aria-hidden": true }, f)));
@@ -17813,12 +18663,12 @@ var Te = { position: "absolute", width: "1px", height: "1px", padding: "0", marg
 function Dialog({
   ...props2
 }) {
-  return /* @__PURE__ */ jsx(Root$c, { "data-slot": "dialog", ...props2 });
+  return /* @__PURE__ */ jsx(Root$a, { "data-slot": "dialog", ...props2 });
 }
 function DialogTrigger({
   ...props2
 }) {
-  return /* @__PURE__ */ jsx(Trigger$8, { "data-slot": "dialog-trigger", ...props2 });
+  return /* @__PURE__ */ jsx(Trigger$7, { "data-slot": "dialog-trigger", ...props2 });
 }
 function DialogPortal({
   ...props2
@@ -17855,7 +18705,7 @@ function DialogContent({
   return /* @__PURE__ */ jsxs(DialogPortal, { "data-slot": "dialog-portal", children: [
     /* @__PURE__ */ jsx(DialogOverlay, {}),
     /* @__PURE__ */ jsxs(
-      Content$3,
+      Content$2,
       {
         "data-slot": "dialog-content",
         className: cn$1(
@@ -17977,7 +18827,7 @@ function CommandInput({
     "div",
     {
       "data-slot": "command-input-wrapper",
-      className: "flex h-9 items-center gap-2 border-b px-3",
+      className: "flex h-9 items-center gap-2 border-b border-border px-3",
       children: [
         /* @__PURE__ */ jsx(Search, { className: "size-4 shrink-0 opacity-50" }),
         /* @__PURE__ */ jsx(
@@ -18438,7 +19288,7 @@ function Autocomplete({
         tabIndex: disabled ? -1 : 0,
         "aria-disabled": disabled || void 0,
         className: cn$1(
-          "w-full inline-flex items-center justify-between rounded-md border bg-background px-3 py-2 text-sm shadow-sm transition-colors",
+          "w-full inline-flex items-center justify-between rounded-md border border-border bg-background px-3 py-2 text-sm shadow-sm transition-colors",
           "hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
           disabled && "opacity-50 pointer-events-none",
           className
@@ -18831,7 +19681,7 @@ function Input({ className, type, ...props2 }) {
       type,
       "data-slot": "input",
       className: cn$1(
-        "file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+        "file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-border flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
         "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
         "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
         className
@@ -18874,7 +19724,7 @@ function Textarea({ className, ...props2 }) {
     {
       "data-slot": "textarea",
       className: cn$1(
-        "border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+        "border-border placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
         className
       ),
       ...props2
@@ -18910,7 +19760,7 @@ var VISUALLY_HIDDEN_STYLES = Object.freeze({
   whiteSpace: "nowrap",
   wordWrap: "normal"
 });
-var NAME$3 = "VisuallyHidden";
+var NAME$2 = "VisuallyHidden";
 var VisuallyHidden = React.forwardRef(
   (props2, forwardedRef) => {
     return /* @__PURE__ */ jsx(
@@ -18923,14 +19773,14 @@ var VisuallyHidden = React.forwardRef(
     );
   }
 );
-VisuallyHidden.displayName = NAME$3;
-var Root$b = VisuallyHidden;
+VisuallyHidden.displayName = NAME$2;
+var Root$9 = VisuallyHidden;
 var OPEN_KEYS = [" ", "Enter", "ArrowUp", "ArrowDown"];
 var SELECTION_KEYS$1 = [" ", "Enter"];
 var SELECT_NAME = "Select";
-var [Collection$5, useCollection$5, createCollectionScope$5] = createCollection(SELECT_NAME);
+var [Collection$4, useCollection$4, createCollectionScope$4] = createCollection(SELECT_NAME);
 var [createSelectContext, createSelectScope] = createContextScope(SELECT_NAME, [
-  createCollectionScope$5,
+  createCollectionScope$4,
   createPopperScope
 ]);
 var usePopperScope$3 = createPopperScope();
@@ -18974,7 +19824,7 @@ var Select$2 = (props2) => {
   const isFormControl = trigger ? form || !!trigger.closest("form") : true;
   const [nativeOptionsSet, setNativeOptionsSet] = React.useState(/* @__PURE__ */ new Set());
   const nativeSelectKey = Array.from(nativeOptionsSet).map((option) => option.props.value).join(";");
-  return /* @__PURE__ */ jsx(Root2$a, { ...popperScope, children: /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(Root2$9, { ...popperScope, children: /* @__PURE__ */ jsxs(
     SelectProvider,
     {
       required: required2,
@@ -18994,7 +19844,7 @@ var Select$2 = (props2) => {
       triggerPointerDownPosRef,
       disabled,
       children: [
-        /* @__PURE__ */ jsx(Collection$5.Provider, { scope: __scopeSelect, children: /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx(Collection$4.Provider, { scope: __scopeSelect, children: /* @__PURE__ */ jsx(
           SelectNativeOptionsProvider,
           {
             scope: props2.__scopeSelect,
@@ -19035,15 +19885,15 @@ var Select$2 = (props2) => {
   ) });
 };
 Select$2.displayName = SELECT_NAME;
-var TRIGGER_NAME$8 = "SelectTrigger";
+var TRIGGER_NAME$7 = "SelectTrigger";
 var SelectTrigger$1 = React.forwardRef(
   (props2, forwardedRef) => {
     const { __scopeSelect, disabled = false, ...triggerProps } = props2;
     const popperScope = usePopperScope$3(__scopeSelect);
-    const context = useSelectContext(TRIGGER_NAME$8, __scopeSelect);
+    const context = useSelectContext(TRIGGER_NAME$7, __scopeSelect);
     const isDisabled = context.disabled || disabled;
     const composedRefs = useComposedRefs$1(forwardedRef, context.onTriggerChange);
-    const getItems = useCollection$5(__scopeSelect);
+    const getItems = useCollection$4(__scopeSelect);
     const pointerTypeRef = React.useRef("touch");
     const [searchRef, handleTypeaheadSearch, resetTypeahead] = useTypeaheadSearch((search) => {
       const enabledItems = getItems().filter((item) => !item.disabled);
@@ -19112,7 +19962,7 @@ var SelectTrigger$1 = React.forwardRef(
     ) });
   }
 );
-SelectTrigger$1.displayName = TRIGGER_NAME$8;
+SelectTrigger$1.displayName = TRIGGER_NAME$7;
 var VALUE_NAME = "SelectValue";
 var SelectValue$1 = React.forwardRef(
   (props2, forwardedRef) => {
@@ -19149,10 +19999,10 @@ var SelectPortal = (props2) => {
   return /* @__PURE__ */ jsx(Portal$7, { asChild: true, ...props2 });
 };
 SelectPortal.displayName = PORTAL_NAME$7;
-var CONTENT_NAME$9 = "SelectContent";
+var CONTENT_NAME$8 = "SelectContent";
 var SelectContent$1 = React.forwardRef(
   (props2, forwardedRef) => {
-    const context = useSelectContext(CONTENT_NAME$9, props2.__scopeSelect);
+    const context = useSelectContext(CONTENT_NAME$8, props2.__scopeSelect);
     const [fragment, setFragment] = React.useState();
     useLayoutEffect2(() => {
       setFragment(new DocumentFragment());
@@ -19160,16 +20010,16 @@ var SelectContent$1 = React.forwardRef(
     if (!context.open) {
       const frag = fragment;
       return frag ? ReactDOM.createPortal(
-        /* @__PURE__ */ jsx(SelectContentProvider, { scope: props2.__scopeSelect, children: /* @__PURE__ */ jsx(Collection$5.Slot, { scope: props2.__scopeSelect, children: /* @__PURE__ */ jsx("div", { children: props2.children }) }) }),
+        /* @__PURE__ */ jsx(SelectContentProvider, { scope: props2.__scopeSelect, children: /* @__PURE__ */ jsx(Collection$4.Slot, { scope: props2.__scopeSelect, children: /* @__PURE__ */ jsx("div", { children: props2.children }) }) }),
         frag
       ) : null;
     }
     return /* @__PURE__ */ jsx(SelectContentImpl, { ...props2, ref: forwardedRef });
   }
 );
-SelectContent$1.displayName = CONTENT_NAME$9;
+SelectContent$1.displayName = CONTENT_NAME$8;
 var CONTENT_MARGIN = 10;
-var [SelectContentProvider, useSelectContentContext] = createSelectContext(CONTENT_NAME$9);
+var [SelectContentProvider, useSelectContentContext] = createSelectContext(CONTENT_NAME$8);
 var CONTENT_IMPL_NAME = "SelectContentImpl";
 var Slot$1 = /* @__PURE__ */ createSlot("SelectContent.RemoveScroll");
 var SelectContentImpl = React.forwardRef(
@@ -19195,7 +20045,7 @@ var SelectContentImpl = React.forwardRef(
       //
       ...contentProps
     } = props2;
-    const context = useSelectContext(CONTENT_NAME$9, __scopeSelect);
+    const context = useSelectContext(CONTENT_NAME$8, __scopeSelect);
     const [content, setContent] = React.useState(null);
     const [viewport, setViewport] = React.useState(null);
     const composedRefs = useComposedRefs$1(forwardedRef, (node) => setContent(node));
@@ -19203,7 +20053,7 @@ var SelectContentImpl = React.forwardRef(
     const [selectedItemText, setSelectedItemText] = React.useState(
       null
     );
-    const getItems = useCollection$5(__scopeSelect);
+    const getItems = useCollection$4(__scopeSelect);
     const [isPositioned, setIsPositioned] = React.useState(false);
     const firstValidItemFoundRef = React.useRef(false);
     React.useEffect(() => {
@@ -19410,12 +20260,12 @@ SelectContentImpl.displayName = CONTENT_IMPL_NAME;
 var ITEM_ALIGNED_POSITION_NAME = "SelectItemAlignedPosition";
 var SelectItemAlignedPosition = React.forwardRef((props2, forwardedRef) => {
   const { __scopeSelect, onPlaced, ...popperProps } = props2;
-  const context = useSelectContext(CONTENT_NAME$9, __scopeSelect);
-  const contentContext = useSelectContentContext(CONTENT_NAME$9, __scopeSelect);
+  const context = useSelectContext(CONTENT_NAME$8, __scopeSelect);
+  const contentContext = useSelectContentContext(CONTENT_NAME$8, __scopeSelect);
   const [contentWrapper, setContentWrapper] = React.useState(null);
   const [content, setContent] = React.useState(null);
   const composedRefs = useComposedRefs$1(forwardedRef, (node) => setContent(node));
-  const getItems = useCollection$5(__scopeSelect);
+  const getItems = useCollection$4(__scopeSelect);
   const shouldExpandOnScrollRef = React.useRef(false);
   const shouldRepositionRef = React.useRef(true);
   const { viewport, selectedItem, selectedItemText, focusSelectedItem } = contentContext;
@@ -19581,7 +20431,7 @@ var SelectPopperPosition = React.forwardRef((props2, forwardedRef) => {
   } = props2;
   const popperScope = usePopperScope$3(__scopeSelect);
   return /* @__PURE__ */ jsx(
-    Content$4,
+    Content$3,
     {
       ...popperScope,
       ...popperProps,
@@ -19605,7 +20455,7 @@ var SelectPopperPosition = React.forwardRef((props2, forwardedRef) => {
   );
 });
 SelectPopperPosition.displayName = POPPER_POSITION_NAME;
-var [SelectViewportProvider, useSelectViewportContext] = createSelectContext(CONTENT_NAME$9, {});
+var [SelectViewportProvider, useSelectViewportContext] = createSelectContext(CONTENT_NAME$8, {});
 var VIEWPORT_NAME$2 = "SelectViewport";
 var SelectViewport = React.forwardRef(
   (props2, forwardedRef) => {
@@ -19624,7 +20474,7 @@ var SelectViewport = React.forwardRef(
           nonce
         }
       ),
-      /* @__PURE__ */ jsx(Collection$5.Slot, { scope: __scopeSelect, children: /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsx(Collection$4.Slot, { scope: __scopeSelect, children: /* @__PURE__ */ jsx(
         Primitive.div,
         {
           "data-radix-select-viewport": "",
@@ -19674,8 +20524,8 @@ var SelectViewport = React.forwardRef(
   }
 );
 SelectViewport.displayName = VIEWPORT_NAME$2;
-var GROUP_NAME$5 = "SelectGroup";
-var [SelectGroupContextProvider, useSelectGroupContext] = createSelectContext(GROUP_NAME$5);
+var GROUP_NAME$4 = "SelectGroup";
+var [SelectGroupContextProvider, useSelectGroupContext] = createSelectContext(GROUP_NAME$4);
 var SelectGroup$1 = React.forwardRef(
   (props2, forwardedRef) => {
     const { __scopeSelect, ...groupProps } = props2;
@@ -19683,7 +20533,7 @@ var SelectGroup$1 = React.forwardRef(
     return /* @__PURE__ */ jsx(SelectGroupContextProvider, { scope: __scopeSelect, id: groupId, children: /* @__PURE__ */ jsx(Primitive.div, { role: "group", "aria-labelledby": groupId, ...groupProps, ref: forwardedRef }) });
   }
 );
-SelectGroup$1.displayName = GROUP_NAME$5;
+SelectGroup$1.displayName = GROUP_NAME$4;
 var LABEL_NAME$4 = "SelectLabel";
 var SelectLabel$1 = React.forwardRef(
   (props2, forwardedRef) => {
@@ -19693,8 +20543,8 @@ var SelectLabel$1 = React.forwardRef(
   }
 );
 SelectLabel$1.displayName = LABEL_NAME$4;
-var ITEM_NAME$8 = "SelectItem";
-var [SelectItemContextProvider, useSelectItemContext] = createSelectContext(ITEM_NAME$8);
+var ITEM_NAME$7 = "SelectItem";
+var [SelectItemContextProvider, useSelectItemContext] = createSelectContext(ITEM_NAME$7);
 var SelectItem$1 = React.forwardRef(
   (props2, forwardedRef) => {
     const {
@@ -19704,8 +20554,8 @@ var SelectItem$1 = React.forwardRef(
       textValue: textValueProp,
       ...itemProps
     } = props2;
-    const context = useSelectContext(ITEM_NAME$8, __scopeSelect);
-    const contentContext = useSelectContentContext(ITEM_NAME$8, __scopeSelect);
+    const context = useSelectContext(ITEM_NAME$7, __scopeSelect);
+    const contentContext = useSelectContentContext(ITEM_NAME$7, __scopeSelect);
     const isSelected = context.value === value;
     const [textValue, setTextValue] = React.useState(textValueProp ?? "");
     const [isFocused, setIsFocused] = React.useState(false);
@@ -19741,7 +20591,7 @@ var SelectItem$1 = React.forwardRef(
           setTextValue((prevTextValue) => prevTextValue || ((node == null ? void 0 : node.textContent) ?? "").trim());
         }, []),
         children: /* @__PURE__ */ jsx(
-          Collection$5.ItemSlot,
+          Collection$4.ItemSlot,
           {
             scope: __scopeSelect,
             value,
@@ -19801,7 +20651,7 @@ var SelectItem$1 = React.forwardRef(
     );
   }
 );
-SelectItem$1.displayName = ITEM_NAME$8;
+SelectItem$1.displayName = ITEM_NAME$7;
 var ITEM_TEXT_NAME = "SelectItemText";
 var SelectItemText = React.forwardRef(
   (props2, forwardedRef) => {
@@ -19917,7 +20767,7 @@ var SelectScrollButtonImpl = React.forwardRef((props2, forwardedRef) => {
   const { __scopeSelect, onAutoScroll, ...scrollIndicatorProps } = props2;
   const contentContext = useSelectContentContext("SelectScrollButton", __scopeSelect);
   const autoScrollTimerRef = React.useRef(null);
-  const getItems = useCollection$5(__scopeSelect);
+  const getItems = useCollection$4(__scopeSelect);
   const clearAutoScrollTimer = React.useCallback(() => {
     if (autoScrollTimerRef.current !== null) {
       window.clearInterval(autoScrollTimerRef.current);
@@ -20041,7 +20891,7 @@ function findNextItem(items, search, currentItem) {
   const isRepeated = search.length > 1 && Array.from(search).every((char) => char === search[0]);
   const normalizedSearch = isRepeated ? search[0] : search;
   const currentItemIndex = currentItem ? items.indexOf(currentItem) : -1;
-  let wrappedItems = wrapArray$3(items, Math.max(currentItemIndex, 0));
+  let wrappedItems = wrapArray$2(items, Math.max(currentItemIndex, 0));
   const excludeCurrentItem = normalizedSearch.length === 1;
   if (excludeCurrentItem) wrappedItems = wrappedItems.filter((v) => v !== currentItem);
   const nextItem = wrappedItems.find(
@@ -20049,11 +20899,11 @@ function findNextItem(items, search, currentItem) {
   );
   return nextItem !== currentItem ? nextItem : void 0;
 }
-function wrapArray$3(array2, startIndex) {
+function wrapArray$2(array2, startIndex) {
   return array2.map((_2, index2) => array2[(startIndex + index2) % array2.length]);
 }
-var Root2$8 = Select$2;
-var Trigger$7 = SelectTrigger$1;
+var Root2$7 = Select$2;
+var Trigger$6 = SelectTrigger$1;
 var Value = SelectValue$1;
 var Icon = SelectIcon;
 var Portal$4 = SelectPortal;
@@ -20061,16 +20911,16 @@ var Content2$7 = SelectContent$1;
 var Viewport$2 = SelectViewport;
 var Group$1 = SelectGroup$1;
 var Label$1 = SelectLabel$1;
-var Item$2 = SelectItem$1;
+var Item$1 = SelectItem$1;
 var ItemText = SelectItemText;
 var ItemIndicator$1 = SelectItemIndicator;
 var ScrollUpButton = SelectScrollUpButton$1;
 var ScrollDownButton = SelectScrollDownButton$1;
-var Separator$3 = SelectSeparator$1;
+var Separator$1 = SelectSeparator$1;
 function Select$1({
   ...props2
 }) {
-  return /* @__PURE__ */ jsx(Root2$8, { "data-slot": "select", ...props2 });
+  return /* @__PURE__ */ jsx(Root2$7, { "data-slot": "select", ...props2 });
 }
 function SelectGroup({
   ...props2
@@ -20089,12 +20939,12 @@ function SelectTrigger({
   ...props2
 }) {
   return /* @__PURE__ */ jsxs(
-    Trigger$7,
+    Trigger$6,
     {
       "data-slot": "select-trigger",
       "data-size": size2,
       className: cn$1(
-        "border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "border-border data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         className
       ),
       ...props2,
@@ -20158,7 +21008,7 @@ function SelectItem({
   ...props2
 }) {
   return /* @__PURE__ */ jsxs(
-    Item$2,
+    Item$1,
     {
       "data-slot": "select-item",
       className: cn$1(
@@ -20178,7 +21028,7 @@ function SelectSeparator({
   ...props2
 }) {
   return /* @__PURE__ */ jsx(
-    Separator$3,
+    Separator$1,
     {
       "data-slot": "select-separator",
       className: cn$1("bg-border pointer-events-none -mx-1 my-1 h-px", className),
@@ -20431,14 +21281,14 @@ SwitchBubbleInput.displayName = BUBBLE_INPUT_NAME$2;
 function getState$1(checked) {
   return checked ? "checked" : "unchecked";
 }
-var Root$a = Switch$1;
+var Root$8 = Switch$1;
 var Thumb$1 = SwitchThumb;
 function Switch({
   className,
   ...props2
 }) {
   return /* @__PURE__ */ jsx(
-    Root$a,
+    Root$8,
     {
       "data-slot": "switch",
       className: cn$1(
@@ -20509,215 +21359,6 @@ function SwitchField({ field, fieldPath, value, onChange, className }) {
     ] })
   ] });
 }
-var ENTRY_FOCUS = "rovingFocusGroup.onEntryFocus";
-var EVENT_OPTIONS = { bubbles: false, cancelable: true };
-var GROUP_NAME$4 = "RovingFocusGroup";
-var [Collection$4, useCollection$4, createCollectionScope$4] = createCollection(GROUP_NAME$4);
-var [createRovingFocusGroupContext, createRovingFocusGroupScope] = createContextScope(
-  GROUP_NAME$4,
-  [createCollectionScope$4]
-);
-var [RovingFocusProvider, useRovingFocusContext] = createRovingFocusGroupContext(GROUP_NAME$4);
-var RovingFocusGroup = React.forwardRef(
-  (props2, forwardedRef) => {
-    return /* @__PURE__ */ jsx(Collection$4.Provider, { scope: props2.__scopeRovingFocusGroup, children: /* @__PURE__ */ jsx(Collection$4.Slot, { scope: props2.__scopeRovingFocusGroup, children: /* @__PURE__ */ jsx(RovingFocusGroupImpl, { ...props2, ref: forwardedRef }) }) });
-  }
-);
-RovingFocusGroup.displayName = GROUP_NAME$4;
-var RovingFocusGroupImpl = React.forwardRef((props2, forwardedRef) => {
-  const {
-    __scopeRovingFocusGroup,
-    orientation,
-    loop = false,
-    dir,
-    currentTabStopId: currentTabStopIdProp,
-    defaultCurrentTabStopId,
-    onCurrentTabStopIdChange,
-    onEntryFocus,
-    preventScrollOnEntryFocus = false,
-    ...groupProps
-  } = props2;
-  const ref = React.useRef(null);
-  const composedRefs = useComposedRefs$1(forwardedRef, ref);
-  const direction = useDirection(dir);
-  const [currentTabStopId, setCurrentTabStopId] = useControllableState$1({
-    prop: currentTabStopIdProp,
-    defaultProp: defaultCurrentTabStopId ?? null,
-    onChange: onCurrentTabStopIdChange,
-    caller: GROUP_NAME$4
-  });
-  const [isTabbingBackOut, setIsTabbingBackOut] = React.useState(false);
-  const handleEntryFocus = useCallbackRef$2(onEntryFocus);
-  const getItems = useCollection$4(__scopeRovingFocusGroup);
-  const isClickFocusRef = React.useRef(false);
-  const [focusableItemsCount, setFocusableItemsCount] = React.useState(0);
-  React.useEffect(() => {
-    const node = ref.current;
-    if (node) {
-      node.addEventListener(ENTRY_FOCUS, handleEntryFocus);
-      return () => node.removeEventListener(ENTRY_FOCUS, handleEntryFocus);
-    }
-  }, [handleEntryFocus]);
-  return /* @__PURE__ */ jsx(
-    RovingFocusProvider,
-    {
-      scope: __scopeRovingFocusGroup,
-      orientation,
-      dir: direction,
-      loop,
-      currentTabStopId,
-      onItemFocus: React.useCallback(
-        (tabStopId) => setCurrentTabStopId(tabStopId),
-        [setCurrentTabStopId]
-      ),
-      onItemShiftTab: React.useCallback(() => setIsTabbingBackOut(true), []),
-      onFocusableItemAdd: React.useCallback(
-        () => setFocusableItemsCount((prevCount) => prevCount + 1),
-        []
-      ),
-      onFocusableItemRemove: React.useCallback(
-        () => setFocusableItemsCount((prevCount) => prevCount - 1),
-        []
-      ),
-      children: /* @__PURE__ */ jsx(
-        Primitive.div,
-        {
-          tabIndex: isTabbingBackOut || focusableItemsCount === 0 ? -1 : 0,
-          "data-orientation": orientation,
-          ...groupProps,
-          ref: composedRefs,
-          style: { outline: "none", ...props2.style },
-          onMouseDown: composeEventHandlers$1(props2.onMouseDown, () => {
-            isClickFocusRef.current = true;
-          }),
-          onFocus: composeEventHandlers$1(props2.onFocus, (event) => {
-            const isKeyboardFocus = !isClickFocusRef.current;
-            if (event.target === event.currentTarget && isKeyboardFocus && !isTabbingBackOut) {
-              const entryFocusEvent = new CustomEvent(ENTRY_FOCUS, EVENT_OPTIONS);
-              event.currentTarget.dispatchEvent(entryFocusEvent);
-              if (!entryFocusEvent.defaultPrevented) {
-                const items = getItems().filter((item) => item.focusable);
-                const activeItem = items.find((item) => item.active);
-                const currentItem = items.find((item) => item.id === currentTabStopId);
-                const candidateItems = [activeItem, currentItem, ...items].filter(
-                  Boolean
-                );
-                const candidateNodes = candidateItems.map((item) => item.ref.current);
-                focusFirst$2(candidateNodes, preventScrollOnEntryFocus);
-              }
-            }
-            isClickFocusRef.current = false;
-          }),
-          onBlur: composeEventHandlers$1(props2.onBlur, () => setIsTabbingBackOut(false))
-        }
-      )
-    }
-  );
-});
-var ITEM_NAME$7 = "RovingFocusGroupItem";
-var RovingFocusGroupItem = React.forwardRef(
-  (props2, forwardedRef) => {
-    const {
-      __scopeRovingFocusGroup,
-      focusable = true,
-      active = false,
-      tabStopId,
-      children,
-      ...itemProps
-    } = props2;
-    const autoId = useId$1();
-    const id = tabStopId || autoId;
-    const context = useRovingFocusContext(ITEM_NAME$7, __scopeRovingFocusGroup);
-    const isCurrentTabStop = context.currentTabStopId === id;
-    const getItems = useCollection$4(__scopeRovingFocusGroup);
-    const { onFocusableItemAdd, onFocusableItemRemove, currentTabStopId } = context;
-    React.useEffect(() => {
-      if (focusable) {
-        onFocusableItemAdd();
-        return () => onFocusableItemRemove();
-      }
-    }, [focusable, onFocusableItemAdd, onFocusableItemRemove]);
-    return /* @__PURE__ */ jsx(
-      Collection$4.ItemSlot,
-      {
-        scope: __scopeRovingFocusGroup,
-        id,
-        focusable,
-        active,
-        children: /* @__PURE__ */ jsx(
-          Primitive.span,
-          {
-            tabIndex: isCurrentTabStop ? 0 : -1,
-            "data-orientation": context.orientation,
-            ...itemProps,
-            ref: forwardedRef,
-            onMouseDown: composeEventHandlers$1(props2.onMouseDown, (event) => {
-              if (!focusable) event.preventDefault();
-              else context.onItemFocus(id);
-            }),
-            onFocus: composeEventHandlers$1(props2.onFocus, () => context.onItemFocus(id)),
-            onKeyDown: composeEventHandlers$1(props2.onKeyDown, (event) => {
-              if (event.key === "Tab" && event.shiftKey) {
-                context.onItemShiftTab();
-                return;
-              }
-              if (event.target !== event.currentTarget) return;
-              const focusIntent = getFocusIntent(event, context.orientation, context.dir);
-              if (focusIntent !== void 0) {
-                if (event.metaKey || event.ctrlKey || event.altKey || event.shiftKey) return;
-                event.preventDefault();
-                const items = getItems().filter((item) => item.focusable);
-                let candidateNodes = items.map((item) => item.ref.current);
-                if (focusIntent === "last") candidateNodes.reverse();
-                else if (focusIntent === "prev" || focusIntent === "next") {
-                  if (focusIntent === "prev") candidateNodes.reverse();
-                  const currentIndex = candidateNodes.indexOf(event.currentTarget);
-                  candidateNodes = context.loop ? wrapArray$2(candidateNodes, currentIndex + 1) : candidateNodes.slice(currentIndex + 1);
-                }
-                setTimeout(() => focusFirst$2(candidateNodes));
-              }
-            }),
-            children: typeof children === "function" ? children({ isCurrentTabStop, hasTabStop: currentTabStopId != null }) : children
-          }
-        )
-      }
-    );
-  }
-);
-RovingFocusGroupItem.displayName = ITEM_NAME$7;
-var MAP_KEY_TO_FOCUS_INTENT = {
-  ArrowLeft: "prev",
-  ArrowUp: "prev",
-  ArrowRight: "next",
-  ArrowDown: "next",
-  PageUp: "first",
-  Home: "first",
-  PageDown: "last",
-  End: "last"
-};
-function getDirectionAwareKey(key, dir) {
-  if (dir !== "rtl") return key;
-  return key === "ArrowLeft" ? "ArrowRight" : key === "ArrowRight" ? "ArrowLeft" : key;
-}
-function getFocusIntent(event, orientation, dir) {
-  const key = getDirectionAwareKey(event.key, dir);
-  if (orientation === "vertical" && ["ArrowLeft", "ArrowRight"].includes(key)) return void 0;
-  if (orientation === "horizontal" && ["ArrowUp", "ArrowDown"].includes(key)) return void 0;
-  return MAP_KEY_TO_FOCUS_INTENT[key];
-}
-function focusFirst$2(candidates, preventScroll = false) {
-  const PREVIOUSLY_FOCUSED_ELEMENT = document.activeElement;
-  for (const candidate of candidates) {
-    if (candidate === PREVIOUSLY_FOCUSED_ELEMENT) return;
-    candidate.focus({ preventScroll });
-    if (document.activeElement !== PREVIOUSLY_FOCUSED_ELEMENT) return;
-  }
-}
-function wrapArray$2(array2, startIndex) {
-  return array2.map((_2, index2) => array2[(startIndex + index2) % array2.length]);
-}
-var Root$9 = RovingFocusGroup;
-var Item$1 = RovingFocusGroupItem;
 var RADIO_NAME = "Radio";
 var [createRadioContext, createRadioScope] = createContextScope(RADIO_NAME);
 var [RadioProvider, useRadioContext] = createRadioContext(RADIO_NAME);
@@ -20854,7 +21495,7 @@ var [createRadioGroupContext, createRadioGroupScope] = createContextScope(RADIO_
   createRovingFocusGroupScope,
   createRadioScope
 ]);
-var useRovingFocusGroupScope$4 = createRovingFocusGroupScope();
+var useRovingFocusGroupScope$3 = createRovingFocusGroupScope();
 var useRadioScope = createRadioScope();
 var [RadioGroupProvider$1, useRadioGroupContext$1] = createRadioGroupContext(RADIO_GROUP_NAME$4);
 var RadioGroup$2 = React.forwardRef(
@@ -20872,7 +21513,7 @@ var RadioGroup$2 = React.forwardRef(
       onValueChange,
       ...groupProps
     } = props2;
-    const rovingFocusGroupScope = useRovingFocusGroupScope$4(__scopeRadioGroup);
+    const rovingFocusGroupScope = useRovingFocusGroupScope$3(__scopeRadioGroup);
     const direction = useDirection(dir);
     const [value, setValue] = useControllableState$1({
       prop: valueProp,
@@ -20890,7 +21531,7 @@ var RadioGroup$2 = React.forwardRef(
         value,
         onValueChange: setValue,
         children: /* @__PURE__ */ jsx(
-          Root$9,
+          Root$d,
           {
             asChild: true,
             ...rovingFocusGroupScope,
@@ -20922,7 +21563,7 @@ var RadioGroupItem$1 = React.forwardRef(
     const { __scopeRadioGroup, disabled, ...itemProps } = props2;
     const context = useRadioGroupContext$1(ITEM_NAME$6, __scopeRadioGroup);
     const isDisabled = context.disabled || disabled;
-    const rovingFocusGroupScope = useRovingFocusGroupScope$4(__scopeRadioGroup);
+    const rovingFocusGroupScope = useRovingFocusGroupScope$3(__scopeRadioGroup);
     const radioScope = useRadioScope(__scopeRadioGroup);
     const ref = React.useRef(null);
     const composedRefs = useComposedRefs$1(forwardedRef, ref);
@@ -20943,7 +21584,7 @@ var RadioGroupItem$1 = React.forwardRef(
       };
     }, []);
     return /* @__PURE__ */ jsx(
-      Item$1,
+      Item$2,
       {
         asChild: true,
         ...rovingFocusGroupScope,
@@ -20983,7 +21624,7 @@ var RadioGroupIndicator = React.forwardRef(
   }
 );
 RadioGroupIndicator.displayName = INDICATOR_NAME2;
-var Root2$7 = RadioGroup$2;
+var Root2$6 = RadioGroup$2;
 var Item2$4 = RadioGroupItem$1;
 var Indicator$2 = RadioGroupIndicator;
 function RadioGroup$1({
@@ -20991,7 +21632,7 @@ function RadioGroup$1({
   ...props2
 }) {
   return /* @__PURE__ */ jsx(
-    Root2$7,
+    Root2$6,
     {
       "data-slot": "radio-group",
       className: cn$1("grid gap-3", className),
@@ -23384,7 +24025,7 @@ function PreviousMonthButton(props2) {
   const { components: components2 } = useDayPicker();
   return React__default.createElement(components2.Button, { ...props2 });
 }
-function Root$8(props2) {
+function Root$7(props2) {
   const { rootRef, ...rest } = props2;
   return React__default.createElement("div", { ...rest, ref: rootRef });
 }
@@ -23438,7 +24079,7 @@ const components = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePr
   NextMonthButton,
   Option,
   PreviousMonthButton,
-  Root: Root$8,
+  Root: Root$7,
   Select,
   Week,
   WeekNumber,
@@ -30730,7 +31371,7 @@ function getInvalidValueError(propValue, componentName) {
 
 Defaulting to \`null\`.`;
 }
-var Root$7 = Progress$1;
+var Root$6 = Progress$1;
 var Indicator$1 = ProgressIndicator;
 function Progress({
   className,
@@ -30738,7 +31379,7 @@ function Progress({
   ...props2
 }) {
   return /* @__PURE__ */ jsx(
-    Root$7,
+    Root$6,
     {
       "data-slot": "progress",
       className: cn$1(
@@ -30871,7 +31512,7 @@ var Tooltip$2 = (props2) => {
       }
     };
   }, []);
-  return /* @__PURE__ */ jsx(Root2$a, { ...popperScope, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(Root2$9, { ...popperScope, children: /* @__PURE__ */ jsx(
     TooltipContextProvider,
     {
       scope: __scopeTooltip,
@@ -30900,12 +31541,12 @@ var Tooltip$2 = (props2) => {
   ) });
 };
 Tooltip$2.displayName = TOOLTIP_NAME;
-var TRIGGER_NAME$7 = "TooltipTrigger";
+var TRIGGER_NAME$6 = "TooltipTrigger";
 var TooltipTrigger$1 = React.forwardRef(
   (props2, forwardedRef) => {
     const { __scopeTooltip, ...triggerProps } = props2;
-    const context = useTooltipContext(TRIGGER_NAME$7, __scopeTooltip);
-    const providerContext = useTooltipProviderContext(TRIGGER_NAME$7, __scopeTooltip);
+    const context = useTooltipContext(TRIGGER_NAME$6, __scopeTooltip);
+    const providerContext = useTooltipProviderContext(TRIGGER_NAME$6, __scopeTooltip);
     const popperScope = usePopperScope$2(__scopeTooltip);
     const ref = React.useRef(null);
     const composedRefs = useComposedRefs$1(forwardedRef, ref, context.onTriggerChange);
@@ -30949,7 +31590,7 @@ var TooltipTrigger$1 = React.forwardRef(
     ) });
   }
 );
-TooltipTrigger$1.displayName = TRIGGER_NAME$7;
+TooltipTrigger$1.displayName = TRIGGER_NAME$6;
 var PORTAL_NAME$6 = "TooltipPortal";
 var [PortalProvider$2, usePortalContext$2] = createTooltipContext(PORTAL_NAME$6, {
   forceMount: void 0
@@ -30960,18 +31601,18 @@ var TooltipPortal = (props2) => {
   return /* @__PURE__ */ jsx(PortalProvider$2, { scope: __scopeTooltip, forceMount, children: /* @__PURE__ */ jsx(Presence, { present: forceMount || context.open, children: /* @__PURE__ */ jsx(Portal$7, { asChild: true, container, children }) }) });
 };
 TooltipPortal.displayName = PORTAL_NAME$6;
-var CONTENT_NAME$8 = "TooltipContent";
+var CONTENT_NAME$7 = "TooltipContent";
 var TooltipContent$1 = React.forwardRef(
   (props2, forwardedRef) => {
-    const portalContext = usePortalContext$2(CONTENT_NAME$8, props2.__scopeTooltip);
+    const portalContext = usePortalContext$2(CONTENT_NAME$7, props2.__scopeTooltip);
     const { forceMount = portalContext.forceMount, side = "top", ...contentProps } = props2;
-    const context = useTooltipContext(CONTENT_NAME$8, props2.__scopeTooltip);
+    const context = useTooltipContext(CONTENT_NAME$7, props2.__scopeTooltip);
     return /* @__PURE__ */ jsx(Presence, { present: forceMount || context.open, children: context.disableHoverableContent ? /* @__PURE__ */ jsx(TooltipContentImpl, { side, ...contentProps, ref: forwardedRef }) : /* @__PURE__ */ jsx(TooltipContentHoverable, { side, ...contentProps, ref: forwardedRef }) });
   }
 );
 var TooltipContentHoverable = React.forwardRef((props2, forwardedRef) => {
-  const context = useTooltipContext(CONTENT_NAME$8, props2.__scopeTooltip);
-  const providerContext = useTooltipProviderContext(CONTENT_NAME$8, props2.__scopeTooltip);
+  const context = useTooltipContext(CONTENT_NAME$7, props2.__scopeTooltip);
+  const providerContext = useTooltipProviderContext(CONTENT_NAME$7, props2.__scopeTooltip);
   const ref = React.useRef(null);
   const composedRefs = useComposedRefs$1(forwardedRef, ref);
   const [pointerGraceArea, setPointerGraceArea] = React.useState(null);
@@ -31042,7 +31683,7 @@ var TooltipContentImpl = React.forwardRef(
       onPointerDownOutside,
       ...contentProps
     } = props2;
-    const context = useTooltipContext(CONTENT_NAME$8, __scopeTooltip);
+    const context = useTooltipContext(CONTENT_NAME$7, __scopeTooltip);
     const popperScope = usePopperScope$2(__scopeTooltip);
     const { onClose } = context;
     React.useEffect(() => {
@@ -31069,7 +31710,7 @@ var TooltipContentImpl = React.forwardRef(
         onFocusOutside: (event) => event.preventDefault(),
         onDismiss: onClose,
         children: /* @__PURE__ */ jsxs(
-          Content$4,
+          Content$3,
           {
             "data-state": context.stateAttribute,
             ...popperScope,
@@ -31088,7 +31729,7 @@ var TooltipContentImpl = React.forwardRef(
             },
             children: [
               /* @__PURE__ */ jsx(Slottable$1, { children }),
-              /* @__PURE__ */ jsx(VisuallyHiddenContentContextProvider, { scope: __scopeTooltip, isInside: true, children: /* @__PURE__ */ jsx(Root$b, { id: context.contentId, role: "tooltip", children: ariaLabel || children }) })
+              /* @__PURE__ */ jsx(VisuallyHiddenContentContextProvider, { scope: __scopeTooltip, isInside: true, children: /* @__PURE__ */ jsx(Root$9, { id: context.contentId, role: "tooltip", children: ariaLabel || children }) })
             ]
           }
         )
@@ -31096,7 +31737,7 @@ var TooltipContentImpl = React.forwardRef(
     );
   }
 );
-TooltipContent$1.displayName = CONTENT_NAME$8;
+TooltipContent$1.displayName = CONTENT_NAME$7;
 var ARROW_NAME$5 = "TooltipArrow";
 var TooltipArrow = React.forwardRef(
   (props2, forwardedRef) => {
@@ -31227,7 +31868,7 @@ function getHullPresorted(points) {
 }
 var Provider = TooltipProvider$1;
 var Root3$2 = Tooltip$2;
-var Trigger$6 = TooltipTrigger$1;
+var Trigger$5 = TooltipTrigger$1;
 var Portal$3 = TooltipPortal;
 var Content2$6 = TooltipContent$1;
 var Arrow2$1 = TooltipArrow;
@@ -31252,7 +31893,7 @@ function Tooltip$1({
 function TooltipTrigger({
   ...props2
 }) {
-  return /* @__PURE__ */ jsx(Trigger$6, { "data-slot": "tooltip-trigger", ...props2 });
+  return /* @__PURE__ */ jsx(Trigger$5, { "data-slot": "tooltip-trigger", ...props2 });
 }
 function TooltipContent({
   className,
@@ -31697,85 +32338,6 @@ function FileField({ field, value, onChange, className }) {
     }
   );
 }
-function Card({ className, ...props2 }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "card",
-      className: cn$1(
-        "bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",
-        className
-      ),
-      ...props2
-    }
-  );
-}
-function CardHeader({ className, ...props2 }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "card-header",
-      className: cn$1(
-        "@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6",
-        className
-      ),
-      ...props2
-    }
-  );
-}
-function CardTitle({ className, ...props2 }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "card-title",
-      className: cn$1("leading-none font-semibold", className),
-      ...props2
-    }
-  );
-}
-function CardDescription({ className, ...props2 }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "card-description",
-      className: cn$1("text-muted-foreground text-sm", className),
-      ...props2
-    }
-  );
-}
-function CardAction({ className, ...props2 }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "card-action",
-      className: cn$1(
-        "col-start-2 row-span-2 row-start-1 self-start justify-self-end",
-        className
-      ),
-      ...props2
-    }
-  );
-}
-function CardContent({ className, ...props2 }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "card-content",
-      className: cn$1("px-6", className),
-      ...props2
-    }
-  );
-}
-function CardFooter({ className, ...props2 }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "card-footer",
-      className: cn$1("flex items-center px-6 [.border-t]:pt-6", className),
-      ...props2
-    }
-  );
-}
 function ObjectField({ field, control, fieldPath }) {
   if (!field.fields) return null;
   return /* @__PURE__ */ jsxs(Card, { className: cn$1(field.className), children: [
@@ -32198,620 +32760,136 @@ function FormBuilderField({ field, control, onChange, parentPath }) {
             className: baseClassName
           }
         );
-      default:
-        return /* @__PURE__ */ jsx(
-          TextField,
-          {
-            field,
-            control,
-            fieldPath,
-            value: controllerField.value,
-            onChange: handleChange,
-            className: baseClassName
-          }
-        );
-    }
-  };
-  if (field.type === "checkbox" || field.type === "switch") {
-    return /* @__PURE__ */ jsxs("div", { className: cn$1("space-y-2", field.gridCols && `md:col-span-${field.gridCols}`), children: [
-      renderField(),
-      field.description && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: field.description }),
-      error && /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: error.message })
-    ] });
-  }
-  const placement = field.labelPlacement ?? "stacked";
-  if (placement === "hidden" || field.type === "array") {
-    return /* @__PURE__ */ jsxs("div", { className: cn$1("space-y-2", field.gridCols && `md:col-span-${field.gridCols}`), children: [
-      renderField(),
-      field.description && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: field.description }),
-      error && /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: error.message })
-    ] });
-  }
-  if (placement === "inline") {
-    return /* @__PURE__ */ jsxs("div", { className: cn$1("space-y-1", field.gridCols && `md:col-span-${field.gridCols}`), children: [
-      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsxs(Label$2, { htmlFor: fieldPath, className: "text-sm font-medium", children: [
-          field.label,
-          field.required && /* @__PURE__ */ jsx("span", { className: "text-destructive ml-1", children: "*" })
-        ] }),
-        renderField()
-      ] }),
-      field.description && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: field.description }),
-      error && /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: error.message })
-    ] });
-  }
-  return /* @__PURE__ */ jsxs("div", { className: cn$1("space-y-2", field.gridCols && `md:col-span-${field.gridCols}`), children: [
-    /* @__PURE__ */ jsxs(Label$2, { htmlFor: fieldPath, className: "text-sm font-medium", children: [
-      field.label,
-      field.required && /* @__PURE__ */ jsx("span", { className: "text-destructive ml-1", children: "*" })
-    ] }),
-    renderField(),
-    field.description && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: field.description }),
-    error && /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: error.message })
-  ] });
-}
-var NAME$2 = "Separator";
-var DEFAULT_ORIENTATION = "horizontal";
-var ORIENTATIONS = ["horizontal", "vertical"];
-var Separator$2 = React.forwardRef((props2, forwardedRef) => {
-  const { decorative, orientation: orientationProp = DEFAULT_ORIENTATION, ...domProps } = props2;
-  const orientation = isValidOrientation(orientationProp) ? orientationProp : DEFAULT_ORIENTATION;
-  const ariaOrientation = orientation === "vertical" ? orientation : void 0;
-  const semanticProps = decorative ? { role: "none" } : { "aria-orientation": ariaOrientation, role: "separator" };
-  return /* @__PURE__ */ jsx(
-    Primitive.div,
-    {
-      "data-orientation": orientation,
-      ...semanticProps,
-      ...domProps,
-      ref: forwardedRef
-    }
-  );
-});
-Separator$2.displayName = NAME$2;
-function isValidOrientation(orientation) {
-  return ORIENTATIONS.includes(orientation);
-}
-var Root$6 = Separator$2;
-function Separator$1({
-  className,
-  orientation = "horizontal",
-  decorative = true,
-  ...props2
-}) {
-  return /* @__PURE__ */ jsx(
-    Root$6,
-    {
-      "data-slot": "separator",
-      decorative,
-      orientation,
-      className: cn$1(
-        "bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px",
-        className
-      ),
-      ...props2
-    }
-  );
-}
-var TABS_NAME = "Tabs";
-var [createTabsContext, createTabsScope] = createContextScope(TABS_NAME, [
-  createRovingFocusGroupScope
-]);
-var useRovingFocusGroupScope$3 = createRovingFocusGroupScope();
-var [TabsProvider, useTabsContext] = createTabsContext(TABS_NAME);
-var Tabs$1 = React.forwardRef(
-  (props2, forwardedRef) => {
-    const {
-      __scopeTabs,
-      value: valueProp,
-      onValueChange,
-      defaultValue,
-      orientation = "horizontal",
-      dir,
-      activationMode = "automatic",
-      ...tabsProps
-    } = props2;
-    const direction = useDirection(dir);
-    const [value, setValue] = useControllableState$1({
-      prop: valueProp,
-      onChange: onValueChange,
-      defaultProp: defaultValue ?? "",
-      caller: TABS_NAME
-    });
-    return /* @__PURE__ */ jsx(
-      TabsProvider,
-      {
-        scope: __scopeTabs,
-        baseId: useId$1(),
-        value,
-        onValueChange: setValue,
-        orientation,
-        dir: direction,
-        activationMode,
-        children: /* @__PURE__ */ jsx(
-          Primitive.div,
-          {
-            dir: direction,
-            "data-orientation": orientation,
-            ...tabsProps,
-            ref: forwardedRef
-          }
-        )
-      }
-    );
-  }
-);
-Tabs$1.displayName = TABS_NAME;
-var TAB_LIST_NAME = "TabsList";
-var TabsList$1 = React.forwardRef(
-  (props2, forwardedRef) => {
-    const { __scopeTabs, loop = true, ...listProps } = props2;
-    const context = useTabsContext(TAB_LIST_NAME, __scopeTabs);
-    const rovingFocusGroupScope = useRovingFocusGroupScope$3(__scopeTabs);
-    return /* @__PURE__ */ jsx(
-      Root$9,
-      {
-        asChild: true,
-        ...rovingFocusGroupScope,
-        orientation: context.orientation,
-        dir: context.dir,
-        loop,
-        children: /* @__PURE__ */ jsx(
-          Primitive.div,
-          {
-            role: "tablist",
-            "aria-orientation": context.orientation,
-            ...listProps,
-            ref: forwardedRef
-          }
-        )
-      }
-    );
-  }
-);
-TabsList$1.displayName = TAB_LIST_NAME;
-var TRIGGER_NAME$6 = "TabsTrigger";
-var TabsTrigger$1 = React.forwardRef(
-  (props2, forwardedRef) => {
-    const { __scopeTabs, value, disabled = false, ...triggerProps } = props2;
-    const context = useTabsContext(TRIGGER_NAME$6, __scopeTabs);
-    const rovingFocusGroupScope = useRovingFocusGroupScope$3(__scopeTabs);
-    const triggerId = makeTriggerId$1(context.baseId, value);
-    const contentId = makeContentId$1(context.baseId, value);
-    const isSelected = value === context.value;
-    return /* @__PURE__ */ jsx(
-      Item$1,
-      {
-        asChild: true,
-        ...rovingFocusGroupScope,
-        focusable: !disabled,
-        active: isSelected,
-        children: /* @__PURE__ */ jsx(
-          Primitive.button,
+      default:
+        return /* @__PURE__ */ jsx(
+          TextField,
           {
-            type: "button",
-            role: "tab",
-            "aria-selected": isSelected,
-            "aria-controls": contentId,
-            "data-state": isSelected ? "active" : "inactive",
-            "data-disabled": disabled ? "" : void 0,
-            disabled,
-            id: triggerId,
-            ...triggerProps,
-            ref: forwardedRef,
-            onMouseDown: composeEventHandlers$1(props2.onMouseDown, (event) => {
-              if (!disabled && event.button === 0 && event.ctrlKey === false) {
-                context.onValueChange(value);
-              } else {
-                event.preventDefault();
-              }
-            }),
-            onKeyDown: composeEventHandlers$1(props2.onKeyDown, (event) => {
-              if ([" ", "Enter"].includes(event.key)) context.onValueChange(value);
-            }),
-            onFocus: composeEventHandlers$1(props2.onFocus, () => {
-              const isAutomaticActivation = context.activationMode !== "manual";
-              if (!isSelected && !disabled && isAutomaticActivation) {
-                context.onValueChange(value);
-              }
-            })
+            field,
+            control,
+            fieldPath,
+            value: controllerField.value,
+            onChange: handleChange,
+            className: baseClassName
           }
-        )
-      }
-    );
-  }
-);
-TabsTrigger$1.displayName = TRIGGER_NAME$6;
-var CONTENT_NAME$7 = "TabsContent";
-var TabsContent$1 = React.forwardRef(
-  (props2, forwardedRef) => {
-    const { __scopeTabs, value, forceMount, children, ...contentProps } = props2;
-    const context = useTabsContext(CONTENT_NAME$7, __scopeTabs);
-    const triggerId = makeTriggerId$1(context.baseId, value);
-    const contentId = makeContentId$1(context.baseId, value);
-    const isSelected = value === context.value;
-    const isMountAnimationPreventedRef = React.useRef(isSelected);
-    React.useEffect(() => {
-      const rAF = requestAnimationFrame(() => isMountAnimationPreventedRef.current = false);
-      return () => cancelAnimationFrame(rAF);
-    }, []);
-    return /* @__PURE__ */ jsx(Presence, { present: forceMount || isSelected, children: ({ present }) => /* @__PURE__ */ jsx(
-      Primitive.div,
-      {
-        "data-state": isSelected ? "active" : "inactive",
-        "data-orientation": context.orientation,
-        role: "tabpanel",
-        "aria-labelledby": triggerId,
-        hidden: !present,
-        id: contentId,
-        tabIndex: 0,
-        ...contentProps,
-        ref: forwardedRef,
-        style: {
-          ...props2.style,
-          animationDuration: isMountAnimationPreventedRef.current ? "0s" : void 0
-        },
-        children: present && children
-      }
-    ) });
-  }
-);
-TabsContent$1.displayName = CONTENT_NAME$7;
-function makeTriggerId$1(baseId, value) {
-  return `${baseId}-trigger-${value}`;
-}
-function makeContentId$1(baseId, value) {
-  return `${baseId}-content-${value}`;
-}
-var Root2$6 = Tabs$1;
-var List$1 = TabsList$1;
-var Trigger$5 = TabsTrigger$1;
-var Content$2 = TabsContent$1;
-function Tabs({
-  className,
-  ...props2
-}) {
-  return /* @__PURE__ */ jsx(
-    Root2$6,
-    {
-      "data-slot": "tabs",
-      className: cn$1("flex flex-col gap-2", className),
-      ...props2
-    }
-  );
-}
-function TabsList({
-  className,
-  ...props2
-}) {
-  return /* @__PURE__ */ jsx(
-    List$1,
-    {
-      "data-slot": "tabs-list",
-      className: cn$1(
-        "bg-muted text-muted-foreground inline-flex h-9 w-fit items-center justify-center rounded-lg p-[3px]",
-        className
-      ),
-      ...props2
-    }
-  );
-}
-function TabsTrigger({
-  className,
-  ...props2
-}) {
-  return /* @__PURE__ */ jsx(
-    Trigger$5,
-    {
-      "data-slot": "tabs-trigger",
-      className: cn$1(
-        "data-[state=active]:bg-background dark:data-[state=active]:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 text-foreground dark:text-muted-foreground inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-        className
-      ),
-      ...props2
-    }
-  );
-}
-function TabsContent({
-  className,
-  ...props2
-}) {
-  return /* @__PURE__ */ jsx(
-    Content$2,
-    {
-      "data-slot": "tabs-content",
-      className: cn$1("flex-1 outline-none", className),
-      ...props2
+        );
     }
-  );
-}
-const GRID_COLS = {
-  base: {
-    1: "grid-cols-1",
-    2: "grid-cols-2",
-    3: "grid-cols-3",
-    4: "grid-cols-4",
-    5: "grid-cols-5",
-    6: "grid-cols-6",
-    7: "grid-cols-7",
-    8: "grid-cols-8",
-    9: "grid-cols-9",
-    10: "grid-cols-10",
-    11: "grid-cols-11",
-    12: "grid-cols-12"
-  },
-  sm: {
-    1: "sm:grid-cols-1",
-    2: "sm:grid-cols-2",
-    3: "sm:grid-cols-3",
-    4: "sm:grid-cols-4",
-    5: "sm:grid-cols-5",
-    6: "sm:grid-cols-6",
-    7: "sm:grid-cols-7",
-    8: "sm:grid-cols-8",
-    9: "sm:grid-cols-9",
-    10: "sm:grid-cols-10",
-    11: "sm:grid-cols-11",
-    12: "sm:grid-cols-12"
-  },
-  md: {
-    1: "md:grid-cols-1",
-    2: "md:grid-cols-2",
-    3: "md:grid-cols-3",
-    4: "md:grid-cols-4",
-    5: "md:grid-cols-5",
-    6: "md:grid-cols-6",
-    7: "md:grid-cols-7",
-    8: "md:grid-cols-8",
-    9: "md:grid-cols-9",
-    10: "md:grid-cols-10",
-    11: "md:grid-cols-11",
-    12: "md:grid-cols-12"
-  },
-  lg: {
-    1: "lg:grid-cols-1",
-    2: "lg:grid-cols-2",
-    3: "lg:grid-cols-3",
-    4: "lg:grid-cols-4",
-    5: "lg:grid-cols-5",
-    6: "lg:grid-cols-6",
-    7: "lg:grid-cols-7",
-    8: "lg:grid-cols-8",
-    9: "lg:grid-cols-9",
-    10: "lg:grid-cols-10",
-    11: "lg:grid-cols-11",
-    12: "lg:grid-cols-12"
-  },
-  xl: {
-    1: "xl:grid-cols-1",
-    2: "xl:grid-cols-2",
-    3: "xl:grid-cols-3",
-    4: "xl:grid-cols-4",
-    5: "xl:grid-cols-5",
-    6: "xl:grid-cols-6",
-    7: "xl:grid-cols-7",
-    8: "xl:grid-cols-8",
-    9: "xl:grid-cols-9",
-    10: "xl:grid-cols-10",
-    11: "xl:grid-cols-11",
-    12: "xl:grid-cols-12"
+  };
+  if (field.type === "checkbox" || field.type === "switch") {
+    return /* @__PURE__ */ jsxs("div", { className: cn$1("space-y-2", field.gridCols && `md:col-span-${field.gridCols}`), children: [
+      renderField(),
+      field.description && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: field.description }),
+      error && /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: error.message })
+    ] });
   }
-};
-const COL_SPAN = {
-  base: {
-    1: "col-span-1",
-    2: "col-span-2",
-    3: "col-span-3",
-    4: "col-span-4",
-    5: "col-span-5",
-    6: "col-span-6",
-    7: "col-span-7",
-    8: "col-span-8",
-    9: "col-span-9",
-    10: "col-span-10",
-    11: "col-span-11",
-    12: "col-span-12"
-  },
-  sm: {
-    1: "sm:col-span-1",
-    2: "sm:col-span-2",
-    3: "sm:col-span-3",
-    4: "sm:col-span-4",
-    5: "sm:col-span-5",
-    6: "sm:col-span-6",
-    7: "sm:col-span-7",
-    8: "sm:col-span-8",
-    9: "sm:col-span-9",
-    10: "sm:col-span-10",
-    11: "sm:col-span-11",
-    12: "sm:col-span-12"
-  },
-  md: {
-    1: "md:col-span-1",
-    2: "md:col-span-2",
-    3: "md:col-span-3",
-    4: "md:col-span-4",
-    5: "md:col-span-5",
-    6: "md:col-span-6",
-    7: "md:col-span-7",
-    8: "md:col-span-8",
-    9: "md:col-span-9",
-    10: "md:col-span-10",
-    11: "md:col-span-11",
-    12: "md:col-span-12"
-  },
-  lg: {
-    1: "lg:col-span-1",
-    2: "lg:col-span-2",
-    3: "lg:col-span-3",
-    4: "lg:col-span-4",
-    5: "lg:col-span-5",
-    6: "lg:col-span-6",
-    7: "lg:col-span-7",
-    8: "lg:col-span-8",
-    9: "lg:col-span-9",
-    10: "lg:col-span-10",
-    11: "lg:col-span-11",
-    12: "lg:col-span-12"
-  },
-  xl: {
-    1: "xl:col-span-1",
-    2: "xl:col-span-2",
-    3: "xl:col-span-3",
-    4: "xl:col-span-4",
-    5: "xl:col-span-5",
-    6: "xl:col-span-6",
-    7: "xl:col-span-7",
-    8: "xl:col-span-8",
-    9: "xl:col-span-9",
-    10: "xl:col-span-10",
-    11: "xl:col-span-11",
-    12: "xl:col-span-12"
+  const placement = field.labelPlacement ?? "stacked";
+  if (placement === "hidden" || field.type === "array") {
+    return /* @__PURE__ */ jsxs("div", { className: cn$1("space-y-2", field.gridCols && `md:col-span-${field.gridCols}`), children: [
+      renderField(),
+      field.description && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: field.description }),
+      error && /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: error.message })
+    ] });
   }
-};
-function gridClasses(options) {
-  const cols = (options == null ? void 0 : options.cols) ?? 1;
-  const sm = options == null ? void 0 : options.smCols;
-  const md = options == null ? void 0 : options.mdCols;
-  const lg = options == null ? void 0 : options.lgCols;
-  const xl = options == null ? void 0 : options.xlCols;
-  const gap = (options == null ? void 0 : options.gap) ?? "gap-4";
-  return cn$1(
-    "grid",
-    GRID_COLS.base[cols],
-    sm ? GRID_COLS.sm[sm] : void 0,
-    md ? GRID_COLS.md[md] : void 0,
-    lg ? GRID_COLS.lg[lg] : void 0,
-    xl ? GRID_COLS.xl[xl] : void 0,
-    gap
-  );
-}
-function flexClasses(options) {
-  const direction = (options == null ? void 0 : options.direction) ?? "col";
-  const wrap = (options == null ? void 0 : options.wrap) ? "flex-wrap" : "flex-nowrap";
-  const gap = (options == null ? void 0 : options.gap) ?? "gap-4";
-  const align = (options == null ? void 0 : options.align) ?? "stretch";
-  const justify = (options == null ? void 0 : options.justify) ?? "start";
-  const alignClass = align === "start" ? "items-start" : align === "center" ? "items-center" : align === "end" ? "items-end" : "items-stretch";
-  const justifyClass = justify === "start" ? "justify-start" : justify === "center" ? "justify-center" : justify === "between" ? "justify-between" : "justify-end";
-  return cn$1("flex", `flex-${direction}`, wrap, gap, alignClass, justifyClass);
-}
-function leafSpanClasses(leaf) {
-  if (!leaf.span) return void 0;
-  const parts = [];
-  if (leaf.span.base) parts.push(COL_SPAN.base[leaf.span.base]);
-  if (leaf.span.sm) parts.push(COL_SPAN.sm[leaf.span.sm]);
-  if (leaf.span.md) parts.push(COL_SPAN.md[leaf.span.md]);
-  if (leaf.span.lg) parts.push(COL_SPAN.lg[leaf.span.lg]);
-  if (leaf.span.xl) parts.push(COL_SPAN.xl[leaf.span.xl]);
-  return parts.join(" ");
-}
-function isLeaf(child) {
-  return child.content !== void 0;
-}
-function shallowEqualSpan(a2, b2) {
-  if (a2 === b2) return true;
-  if (!a2 || !b2) return !a2 && !b2;
-  return a2.base === b2.base && a2.sm === b2.sm && a2.md === b2.md && a2.lg === b2.lg && a2.xl === b2.xl;
-}
-function shallowEqualLeaf(a2, b2) {
-  const renderKeyEqual = (a2.renderKey ?? null) === (b2.renderKey ?? null);
-  return a2.key === b2.key && a2.hidden === b2.hidden && a2.className === b2.className && a2.labelLayout === b2.labelLayout && a2.labelClassName === b2.labelClassName && a2.valueClassName === b2.valueClassName && a2.inlineLabelWidthClass === b2.inlineLabelWidthClass && shallowEqualSpan(a2.span, b2.span) && renderKeyEqual;
-}
-const SectionLeafRenderer = memo$1(
-  function SectionLeafRenderer2({ leaf, renderLeaf }) {
-    if (leaf.hidden) return null;
-    const span = leafSpanClasses(leaf);
-    if (renderLeaf) {
-      return /* @__PURE__ */ jsx("div", { className: cn$1(span, leaf.className), children: renderLeaf(leaf) });
-    }
-    const hasLabel = leaf.label !== void 0 && leaf.label !== null && leaf.label !== "";
-    const layout = leaf.labelLayout ?? "stacked";
-    const labelBaseCls = "text-xs text-muted-foreground";
-    const valueBaseCls = "text-sm leading-6";
-    if (!hasLabel) {
-      return /* @__PURE__ */ jsx("div", { className: cn$1(span, leaf.className, leaf.valueClassName), children: leaf.content });
-    }
-    if (layout === "inline") {
-      const labelWidth = leaf.inlineLabelWidthClass ?? "w-32";
-      return /* @__PURE__ */ jsxs("div", { className: cn$1(span, leaf.className, "flex items-start gap-4"), children: [
-        /* @__PURE__ */ jsx("div", { className: cn$1(labelWidth, labelBaseCls, leaf.labelClassName), children: leaf.label }),
-        /* @__PURE__ */ jsxs("div", { className: cn$1("flex-1", valueBaseCls, leaf.valueClassName), children: [
-          leaf.content,
-          leaf.description ? /* @__PURE__ */ jsx("div", { className: cn$1("mt-1", labelBaseCls), children: leaf.description }) : null
-        ] })
-      ] });
-    }
-    return /* @__PURE__ */ jsxs("div", { className: cn$1(span, leaf.className, "flex flex-col"), children: [
-      /* @__PURE__ */ jsx("div", { className: cn$1(labelBaseCls, leaf.labelClassName), children: leaf.label }),
-      /* @__PURE__ */ jsx("div", { className: cn$1(valueBaseCls, leaf.valueClassName), children: leaf.content }),
-      leaf.description ? /* @__PURE__ */ jsx("div", { className: cn$1("mt-1", labelBaseCls), children: leaf.description }) : null
+  if (placement === "inline") {
+    return /* @__PURE__ */ jsxs("div", { className: cn$1("space-y-1", field.gridCols && `md:col-span-${field.gridCols}`), children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsxs(Label$2, { htmlFor: fieldPath, className: "text-sm font-medium", children: [
+          field.label,
+          field.required && /* @__PURE__ */ jsx("span", { className: "text-destructive ml-1", children: "*" })
+        ] }),
+        renderField()
+      ] }),
+      field.description && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: field.description }),
+      error && /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: error.message })
     ] });
-  },
-  (prev, next) => shallowEqualLeaf(prev.leaf, next.leaf) && prev.renderLeaf === next.renderLeaf
-);
-function SectionNodeRenderer({ node, renderLeaf }) {
-  var _a;
-  if (node.hidden) return null;
-  const layout = node.layout ?? "grid";
-  const containerClass = layout === "grid" ? gridClasses(node.grid) : layout === "flex" ? flexClasses(node.flex) : "";
-  const SectionContainer = ({ children }) => {
-    const title = node.title;
-    const description = node.subtitle;
-    const variant = node.variant ?? "card";
-    const className = node.className;
-    const headerClassName = node.headerClassName;
-    const contentClassName = node.contentClassName;
-    const renderHeader = () => {
-      if (!title && !description) return null;
-      return /* @__PURE__ */ jsxs("div", { className: cn$1("space-y-1", headerClassName), children: [
-        title && /* @__PURE__ */ jsx("h3", { className: "text-lg font-medium leading-none", children: title }),
-        description && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: description })
-      ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: cn$1("space-y-2", field.gridCols && `md:col-span-${field.gridCols}`), children: [
+    /* @__PURE__ */ jsxs(Label$2, { htmlFor: fieldPath, className: "text-sm font-medium", children: [
+      field.label,
+      field.required && /* @__PURE__ */ jsx("span", { className: "text-destructive ml-1", children: "*" })
+    ] }),
+    renderField(),
+    field.description && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: field.description }),
+    error && /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: error.message })
+  ] });
+}
+function buildSectionNodes(options) {
+  const {
+    sections,
+    control,
+    handleFieldDependencies,
+    handleFieldChange,
+    onFieldChange,
+    getValues
+  } = options;
+  const buildLeavesFromFields = (fields) => (fields ?? []).map((field) => {
+    const fieldState = handleFieldDependencies(field);
+    if (field.hidden || fieldState.hidden) return null;
+    const spanMd = Math.max(1, Math.min(12, field.gridCols ?? 1));
+    return {
+      key: field.name,
+      span: { base: 1, md: spanMd },
+      className: field.wrapperClassName,
+      hidden: field.hidden,
+      content: /* @__PURE__ */ jsx(
+        FormBuilderField,
+        {
+          field: {
+            ...field,
+            disabled: field.disabled || fieldState.disabled
+          },
+          control,
+          onChange: (value, ...extras) => {
+            handleFieldChange(field, value, ...extras);
+            onFieldChange == null ? void 0 : onFieldChange(field.name, value, getValues());
+          },
+          onFieldChange
+        },
+        field.name
+      )
     };
-    const renderContent2 = () => /* @__PURE__ */ jsx("div", { className: cn$1("space-y-4", contentClassName), children });
-    switch (variant) {
-      case "card":
-        return /* @__PURE__ */ jsxs(Card, { className, children: [
-          (title || description) && /* @__PURE__ */ jsxs(CardHeader, { children: [
-            title && /* @__PURE__ */ jsx(CardTitle, { children: title }),
-            description && /* @__PURE__ */ jsx(CardDescription, { children: description })
-          ] }),
-          /* @__PURE__ */ jsx(CardContent, { children: renderContent2() })
-        ] });
-      case "separator":
-        return /* @__PURE__ */ jsxs("div", { className: cn$1("space-y-6", className), children: [
-          (title || description) && /* @__PURE__ */ jsxs(Fragment, { children: [
-            renderHeader(),
-            /* @__PURE__ */ jsx(Separator$1, {})
-          ] }),
-          renderContent2()
-        ] });
-      default:
-        return /* @__PURE__ */ jsxs("div", { className: cn$1("space-y-6", className), children: [
-          renderHeader(),
-          renderContent2()
-        ] });
+  }).filter(Boolean);
+  const buildSectionNode = (section, sectionIndex) => {
+    var _a;
+    const baseNode = {
+      id: section.id ?? `section-${sectionIndex}`,
+      title: section.title,
+      subtitle: section.description,
+      variant: section.variant ?? "plain",
+      className: section.className,
+      layout: section.layout ?? (section.tabs && section.tabs.length > 0 ? "tabs" : "grid"),
+      grid: section.grid ?? { cols: 1, mdCols: 2, gap: "gap-4" },
+      flex: section.flex,
+      hidden: section.hidden
+    };
+    if (baseNode.layout === "tabs" && section.tabs && section.tabs.length > 0) {
+      baseNode.defaultTabId = section.defaultTabId ?? ((_a = section.tabs[0]) == null ? void 0 : _a.id);
+      baseNode.tabsListClassName = section.tabsListClassName;
+      baseNode.tabsContentClassName = section.tabsContentClassName;
+      baseNode.tabs = section.tabs.map((tab, _tabIdx) => {
+        const nestedNodes = tab.sections.map((subSection, subIdx) => buildSectionNode(subSection, subIdx));
+        const containerNode = {
+          id: `${baseNode.id}-tab-${tab.id}`,
+          variant: "plain",
+          layout: "grid",
+          grid: section.grid ?? { cols: 1, mdCols: 2, gap: "gap-4" },
+          children: nestedNodes
+        };
+        return {
+          id: tab.id,
+          label: tab.label,
+          className: tab.className,
+          contentClassName: tab.contentClassName,
+          node: containerNode
+        };
+      });
+      return baseNode;
     }
+    baseNode.children = buildLeavesFromFields(section.fields);
+    return baseNode;
   };
-  if (layout === "tabs" && node.tabs && node.tabs.length > 0) {
-    const defaultTabId = node.defaultTabId ?? ((_a = node.tabs[0]) == null ? void 0 : _a.id);
-    return /* @__PURE__ */ jsx(SectionContainer, { children: /* @__PURE__ */ jsxs(Tabs, { defaultValue: defaultTabId, className: cn$1("space-y-2"), children: [
-      /* @__PURE__ */ jsx(TabsList, { className: cn$1(node.tabsListClassName), children: node.tabs.map((tab) => /* @__PURE__ */ jsx(TabsTrigger, { value: tab.id, className: cn$1(tab.className), children: tab.label }, tab.id)) }),
-      node.tabs.map((tab) => /* @__PURE__ */ jsx(TabsContent, { value: tab.id, className: cn$1(node.tabsContentClassName, tab.contentClassName), children: /* @__PURE__ */ jsx(SectionNodeRenderer, { node: tab.node, renderLeaf }) }, tab.id))
-    ] }) });
-  }
-  return /* @__PURE__ */ jsx(SectionContainer, { children: /* @__PURE__ */ jsx("div", { className: containerClass, children: (node.children ?? []).map((child) => {
-    if (isLeaf(child)) {
-      return /* @__PURE__ */ jsx(SectionLeafRenderer, { leaf: child, renderLeaf }, child.key);
-    }
-    if (child.hidden) return null;
-    return /* @__PURE__ */ jsx("div", { className: "col-span-full", children: /* @__PURE__ */ jsx(SectionNodeRenderer, { node: child, renderLeaf }) }, child.id);
-  }) }) });
-}
-function SectionBuilder({ sections, className, renderLeaf }) {
-  return /* @__PURE__ */ jsx("div", { className: cn$1("space-y-6", className), children: sections.map((section) => /* @__PURE__ */ jsx(SectionNodeRenderer, { node: section, renderLeaf }, section.id)) });
+  return sections.map((section, sectionIndex) => buildSectionNode(section, sectionIndex));
 }
+const FormBuilderContext = createContext(null);
 function FormBuilder({
   sections,
   schema,
@@ -32829,7 +32907,8 @@ function FormBuilder({
   actionsClassName,
   showActions = true,
   customActions,
-  showActionsSeparator = true
+  showActionsSeparator = true,
+  form
 }) {
   const generatedSchema = useMemo(() => {
     if (schema) return schema;
@@ -33074,13 +33153,14 @@ function FormBuilder({
     forEachSection(sections);
     return values;
   }, [sections, defaultValues]);
-  const form = useForm({
+  const internalForm = useForm({
     // Dynamic schema shape: cast to any to satisfy resolver generics
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     resolver: a$2(generatedSchema),
     defaultValues: generatedDefaultValues
   });
-  const { control, handleSubmit, reset: reset2, setValue, getValues } = form;
+  const activeForm = form ?? internalForm;
+  const { control, handleSubmit, reset: reset2, setValue, getValues } = activeForm;
   const dependencyFields = useMemo(() => {
     const set2 = /* @__PURE__ */ new Set();
     const forEachField = (secs) => {
@@ -33191,85 +33271,29 @@ function FormBuilder({
     reset2(generatedDefaultValues);
     onReset == null ? void 0 : onReset();
   }, [reset2, generatedDefaultValues, onReset]);
-  const sectionNodes = useMemo(() => {
-    const buildLeavesFromFields = (fields) => (fields ?? []).map((field) => {
-      const fieldState = handleFieldDependencies(field);
-      if (field.hidden || fieldState.hidden) return null;
-      const spanMd = Math.max(1, Math.min(12, field.gridCols ?? 1));
-      return {
-        key: field.name,
-        span: { base: 1, md: spanMd },
-        className: field.wrapperClassName,
-        hidden: field.hidden,
-        content: /* @__PURE__ */ jsx(
-          FormBuilderField,
-          {
-            field: {
-              ...field,
-              disabled: field.disabled || fieldState.disabled
-            },
-            control,
-            onChange: (value, ...extras) => {
-              handleFieldChange(field, value, ...extras);
-              onFieldChange == null ? void 0 : onFieldChange(field.name, value, getValues());
-            },
-            onFieldChange
-          },
-          field.name
-        )
-      };
-    }).filter(Boolean);
-    const buildSectionNode = (section, sectionIndex) => {
-      var _a;
-      const baseNode = {
-        id: section.id ?? `section-${sectionIndex}`,
-        title: section.title,
-        subtitle: section.description,
-        variant: section.variant ?? "plain",
-        className: section.className,
-        layout: section.layout ?? (section.tabs && section.tabs.length > 0 ? "tabs" : "grid"),
-        grid: section.grid ?? { cols: 1, mdCols: 2, gap: "gap-4" },
-        flex: section.flex,
-        hidden: section.hidden
-      };
-      if (baseNode.layout === "tabs" && section.tabs && section.tabs.length > 0) {
-        baseNode.defaultTabId = section.defaultTabId ?? ((_a = section.tabs[0]) == null ? void 0 : _a.id);
-        baseNode.tabsListClassName = section.tabsListClassName;
-        baseNode.tabsContentClassName = section.tabsContentClassName;
-        baseNode.tabs = section.tabs.map((tab, _tabIdx) => {
-          const nestedNodes = tab.sections.map((subSection, subIdx) => buildSectionNode(subSection, subIdx));
-          const containerNode = {
-            id: `${baseNode.id}-tab-${tab.id}`,
-            title: void 0,
-            subtitle: void 0,
-            variant: "plain",
-            layout: "grid",
-            grid: section.grid ?? { cols: 1, mdCols: 2, gap: "gap-4" },
-            children: nestedNodes
-          };
-          return {
-            id: tab.id,
-            label: tab.label,
-            className: tab.className,
-            contentClassName: tab.contentClassName,
-            node: containerNode
-          };
-        });
-        return baseNode;
-      }
-      baseNode.children = buildLeavesFromFields(section.fields);
-      return baseNode;
-    };
-    return sections.map((section, sectionIndex) => buildSectionNode(section, sectionIndex));
-  }, [
-    sections,
-    control,
-    handleFieldDependencies,
-    handleFieldChange,
-    onFieldChange,
-    getValues
-  ]);
-  return /* @__PURE__ */ jsx("div", { className: cn$1("space-y-6", className), children: /* @__PURE__ */ jsxs(
+  const sectionNodes = useMemo(
+    () => buildSectionNodes({
+      sections,
+      control,
+      handleFieldDependencies,
+      handleFieldChange,
+      onFieldChange,
+      getValues
+    }),
+    [sections, control, handleFieldDependencies, handleFieldChange, onFieldChange, getValues]
+  );
+  const contextValue = useMemo(
+    () => ({
+      control,
+      getValues,
+      setValue,
+      onFieldChange,
+      handleFieldDependencies,
+      handleFieldChange
+    }),
+    [control, getValues, setValue, onFieldChange, handleFieldDependencies, handleFieldChange]
+  );
+  return /* @__PURE__ */ jsx(FormBuilderContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx("div", { className: cn$1("space-y-6", className), children: /* @__PURE__ */ jsxs(
     "form",
     {
       onSubmit: handleSubmit(handleFormSubmit),
@@ -33321,7 +33345,7 @@ function FormBuilder({
         )
       ]
     }
-  ) });
+  ) }) });
 }
 const commonValidations = {
   email: string().email("Please enter a valid email address"),
@@ -33782,7 +33806,7 @@ var Menu$1 = (props2) => {
       document.removeEventListener("pointermove", handlePointer, { capture: true });
     };
   }, []);
-  return /* @__PURE__ */ jsx(Root2$a, { ...popperScope, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(Root2$9, { ...popperScope, children: /* @__PURE__ */ jsx(
     MenuProvider,
     {
       scope: __scopeMenu,
@@ -33990,7 +34014,7 @@ var MenuContentImpl = React.forwardRef(
                 onInteractOutside,
                 onDismiss,
                 children: /* @__PURE__ */ jsx(
-                  Root$9,
+                  Root$d,
                   {
                     asChild: true,
                     ...rovingFocusGroupScope,
@@ -34004,7 +34028,7 @@ var MenuContentImpl = React.forwardRef(
                     }),
                     preventScrollOnEntryFocus: true,
                     children: /* @__PURE__ */ jsx(
-                      Content$4,
+                      Content$3,
                       {
                         role: "menu",
                         "aria-orientation": "vertical",
@@ -34153,7 +34177,7 @@ var MenuItemImpl = React.forwardRef(
         scope: __scopeMenu,
         disabled,
         textValue: textValue ?? textContent,
-        children: /* @__PURE__ */ jsx(Item$1, { asChild: true, ...rovingFocusGroupScope, focusable: !disabled, children: /* @__PURE__ */ jsx(
+        children: /* @__PURE__ */ jsx(Item$2, { asChild: true, ...rovingFocusGroupScope, focusable: !disabled, children: /* @__PURE__ */ jsx(
           Primitive.div,
           {
             role: "menuitem",
@@ -34315,7 +34339,7 @@ var MenuSub = (props2) => {
     if (parentMenuContext.open === false) handleOpenChange(false);
     return () => handleOpenChange(false);
   }, [parentMenuContext.open, handleOpenChange]);
-  return /* @__PURE__ */ jsx(Root2$a, { ...popperScope, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(Root2$9, { ...popperScope, children: /* @__PURE__ */ jsx(
     MenuProvider,
     {
       scope: __scopeMenu,
@@ -35191,10 +35215,9 @@ function DataTable({
   }, [onRefresh]);
   const renderActionButton = (action, key) => {
     if (action.element) return /* @__PURE__ */ jsx(React.Fragment, { children: action.element }, key);
-    const content = /* @__PURE__ */ jsxs(Fragment, { children: [
-      action.icon && action.iconPosition !== "right" && /* @__PURE__ */ jsx("span", { className: "mr-2", children: action.icon }),
-      action.label,
-      action.icon && action.iconPosition === "right" && /* @__PURE__ */ jsx("span", { className: "ml-2", children: action.icon })
+    const content = /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-2", children: [
+      action.icon && /* @__PURE__ */ jsx("span", { className: cn$1(action.iconPosition === "right" ? "order-last" : ""), children: action.icon }),
+      action.label
     ] });
     return /* @__PURE__ */ jsx(
       Button$1,
@@ -35215,10 +35238,9 @@ function DataTable({
       var _a2;
       return (_a2 = action.onClick) == null ? void 0 : _a2.call(action, { selectedRows, clearSelection: () => table.resetRowSelection() });
     };
-    const content = /* @__PURE__ */ jsxs(Fragment, { children: [
-      action.icon && action.iconPosition !== "right" && /* @__PURE__ */ jsx("span", { className: "mr-2", children: action.icon }),
-      action.label,
-      action.icon && action.iconPosition === "right" && /* @__PURE__ */ jsx("span", { className: "ml-2", children: action.icon })
+    const content = /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-2", children: [
+      action.icon && /* @__PURE__ */ jsx("span", { className: cn$1(action.iconPosition === "right" ? "order-last" : ""), children: action.icon }),
+      action.label
     ] });
     return /* @__PURE__ */ jsx(
       Button$1,
@@ -40854,7 +40876,7 @@ var useDialogScope = createDialogScope();
 var AlertDialog$1 = (props2) => {
   const { __scopeAlertDialog, ...alertDialogProps } = props2;
   const dialogScope = useDialogScope(__scopeAlertDialog);
-  return /* @__PURE__ */ jsx(Root$c, { ...dialogScope, ...alertDialogProps, modal: true });
+  return /* @__PURE__ */ jsx(Root$a, { ...dialogScope, ...alertDialogProps, modal: true });
 };
 AlertDialog$1.displayName = ROOT_NAME;
 var TRIGGER_NAME$4 = "AlertDialogTrigger";
@@ -40862,7 +40884,7 @@ var AlertDialogTrigger$1 = React.forwardRef(
   (props2, forwardedRef) => {
     const { __scopeAlertDialog, ...triggerProps } = props2;
     const dialogScope = useDialogScope(__scopeAlertDialog);
-    return /* @__PURE__ */ jsx(Trigger$8, { ...dialogScope, ...triggerProps, ref: forwardedRef });
+    return /* @__PURE__ */ jsx(Trigger$7, { ...dialogScope, ...triggerProps, ref: forwardedRef });
   }
 );
 AlertDialogTrigger$1.displayName = TRIGGER_NAME$4;
@@ -40899,7 +40921,7 @@ var AlertDialogContent$1 = React.forwardRef(
         titleName: TITLE_NAME,
         docsSlug: "alert-dialog",
         children: /* @__PURE__ */ jsx(AlertDialogContentProvider, { scope: __scopeAlertDialog, cancelRef, children: /* @__PURE__ */ jsxs(
-          Content$3,
+          Content$2,
           {
             role: "alertdialog",
             ...dialogScope,
@@ -41305,14 +41327,18 @@ const StackDialogContext = createContext({
   }
 });
 function StackDialogRenderer(props2) {
-  const handleCloseDialog = (id) => () => {
-    props2.closeDialog(id);
+  const handleCloseDialog = (dialog) => () => {
+    if (dialog.onInterruptClosing == null) {
+      props2.closeDialog(dialog.id);
+    } else if (dialog.onInterruptClosing()) {
+      props2.closeDialog(dialog.id);
+    }
   };
   return props2.dialogs.map((dialog, i2) => /* @__PURE__ */ jsx(
     Dialog,
     {
       open: !!props2.dialogs[i2],
-      onOpenChange: handleCloseDialog(dialog.id),
+      onOpenChange: handleCloseDialog(dialog),
       children: /* @__PURE__ */ jsx(
         DialogContent,
         {
@@ -41333,15 +41359,10 @@ function StackDialogContextProvider(props2) {
   const [activeDialogs, setActiveDialogs] = useState([]);
   const ids = useRef(0);
   const handleCreateDialog = useCallback((config2) => {
-    const dialogId = config2.id || (ids.current++).toString();
+    const dialogId = config2.id ?? (ids.current++).toString();
     setActiveDialogs((prev) => {
       const clone2 = [...prev];
-      clone2.push({
-        id: dialogId,
-        template: config2.template,
-        closeOnEscapePressed: config2.closeOnEscapePressed,
-        closeOnInteractOutside: config2.closeOnInteractOutside
-      });
+      clone2.push({ ...config2, id: dialogId });
       return clone2;
     });
     return dialogId;
@@ -41452,12 +41473,12 @@ function useIsMobile() {
   return !!isMobile;
 }
 function Sheet({ ...props2 }) {
-  return /* @__PURE__ */ jsx(Root$c, { "data-slot": "sheet", ...props2 });
+  return /* @__PURE__ */ jsx(Root$a, { "data-slot": "sheet", ...props2 });
 }
 function SheetTrigger({
   ...props2
 }) {
-  return /* @__PURE__ */ jsx(Trigger$8, { "data-slot": "sheet-trigger", ...props2 });
+  return /* @__PURE__ */ jsx(Trigger$7, { "data-slot": "sheet-trigger", ...props2 });
 }
 function SheetClose({
   ...props2
@@ -41494,7 +41515,7 @@ function SheetContent({
   return /* @__PURE__ */ jsxs(SheetPortal, { children: [
     /* @__PURE__ */ jsx(SheetOverlay, {}),
     /* @__PURE__ */ jsxs(
-      Content$3,
+      Content$2,
       {
         "data-slot": "sheet-content",
         className: cn$1(
@@ -41845,7 +41866,7 @@ function SidebarSeparator({
   ...props2
 }) {
   return /* @__PURE__ */ jsx(
-    Separator$1,
+    Separator$2,
     {
       "data-slot": "sidebar-separator",
       "data-sidebar": "separator",
@@ -42472,7 +42493,7 @@ function AdminLayoutContent({
           /* @__PURE__ */ jsx(SidebarGroupLabel, { className: "text-xs font-semibold text-muted-foreground uppercase tracking-wider px-3 mb-2 group-data-[collapsible=icon]:hidden", children: group.label }),
           /* @__PURE__ */ jsx(SidebarGroupContent, { children: /* @__PURE__ */ jsx(SidebarMenu, { className: "group-data-[collapsible=icon]:items-center", children: group.items.map((item) => renderItem(item, 0)) }) })
         ] }),
-        idx < sidebarGroups.length - 1 && /* @__PURE__ */ jsx(Separator$1, { orientation: "horizontal", className: "bg-sidebar-border group-data-[collapsible=icon]:hidden" })
+        idx < sidebarGroups.length - 1 && /* @__PURE__ */ jsx(Separator$2, { orientation: "horizontal", className: "bg-sidebar-border group-data-[collapsible=icon]:hidden" })
       ] }, group.id)) }),
       /* @__PURE__ */ jsx(SidebarFooter, { className: "bg-sidebar border-t border-sidebar-border px-2 py-3", children: /* @__PURE__ */ jsx(SidebarMenu, { children: /* @__PURE__ */ jsx(SidebarMenuItem, { className: "group-data-[collapsible=icon]:flex group-data-[collapsible=icon]:w-full group-data-[collapsible=icon]:justify-center", children: /* @__PURE__ */ jsx(
         SidebarMenuButton,
@@ -52518,7 +52539,7 @@ function Root$3({ open: openProp, onOpenChange, children, onDrag: onDragProp, on
   }, [
     modal
   ]);
-  return /* @__PURE__ */ React__default.createElement(Root$c, {
+  return /* @__PURE__ */ React__default.createElement(Root$a, {
     defaultOpen,
     onOpenChange: (open) => {
       if (!dismissible && !open) return;
@@ -52629,7 +52650,7 @@ const Content$1 = /* @__PURE__ */ React__default.forwardRef(function({ onPointer
     wasBeyondThePointRef.current = false;
     onRelease(event);
   }
-  return /* @__PURE__ */ React__default.createElement(Content$3, {
+  return /* @__PURE__ */ React__default.createElement(Content$2, {
     "data-vaul-drawer-direction": direction,
     "data-vaul-drawer": "",
     "data-vaul-delayed-snap-points": delayedSnapPoints ? "true" : "false",
@@ -52792,7 +52813,7 @@ const Drawer$1 = {
   Root: Root$3,
   Content: Content$1,
   Overlay,
-  Trigger: Trigger$8,
+  Trigger: Trigger$7,
   Portal: Portal$1,
   Close,
   Title,
@@ -53067,7 +53088,7 @@ var HoverCard$1 = (props2) => {
       onDismiss: handleDismiss,
       hasSelectionRef,
       isPointerDownOnContentRef,
-      children: /* @__PURE__ */ jsx(Root2$a, { ...popperScope, children })
+      children: /* @__PURE__ */ jsx(Root2$9, { ...popperScope, children })
     }
   );
 };
@@ -53187,7 +53208,7 @@ var HoverCardContentImpl = React.forwardRef((props2, forwardedRef) => {
       }),
       onDismiss: context.onDismiss,
       children: /* @__PURE__ */ jsx(
-        Content$4,
+        Content$3,
         {
           ...popperScope,
           ...contentProps,
@@ -53576,7 +53597,7 @@ var Menubar$1 = React.forwardRef(
         dir: direction,
         loop,
         children: /* @__PURE__ */ jsx(Collection$2.Provider, { scope: __scopeMenubar, children: /* @__PURE__ */ jsx(Collection$2.Slot, { scope: __scopeMenubar, children: /* @__PURE__ */ jsx(
-          Root$9,
+          Root$d,
           {
             asChild: true,
             ...rovingFocusGroupScope,
@@ -53646,7 +53667,7 @@ var MenubarTrigger$1 = React.forwardRef(
     const [isFocused, setIsFocused] = React.useState(false);
     const open = context.value === menuContext.value;
     return /* @__PURE__ */ jsx(Collection$2.ItemSlot, { scope: __scopeMenubar, value: menuContext.value, disabled, children: /* @__PURE__ */ jsx(
-      Item$1,
+      Item$2,
       {
         asChild: true,
         ...rovingFocusGroupScope,
@@ -54501,7 +54522,7 @@ var NavigationMenuTrigger$1 = React.forwardRef((props2, forwardedRef) => {
     ) }) }),
     open && /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(
-        Root$b,
+        Root$9,
         {
           "aria-hidden": true,
           tabIndex: 0,
@@ -59924,7 +59945,7 @@ var ToggleGroupImpl = React__default.forwardRef(
     const direction = useDirection(dir);
     const commonProps = { role: "group", dir: direction, ...toggleGroupProps };
     return /* @__PURE__ */ jsx(ToggleGroupContext$1, { scope: __scopeToggleGroup, rovingFocus, disabled, children: rovingFocus ? /* @__PURE__ */ jsx(
-      Root$9,
+      Root$d,
       {
         asChild: true,
         ...rovingFocusGroupScope,
@@ -59947,7 +59968,7 @@ var ToggleGroupItem$1 = React__default.forwardRef(
     const commonProps = { ...props2, pressed, disabled };
     const ref = React__default.useRef(null);
     return context.rovingFocus ? /* @__PURE__ */ jsx(
-      Item$1,
+      Item$2,
       {
         asChild: true,
         ...rovingFocusGroupScope,
@@ -60273,7 +60294,7 @@ export {
   SelectSeparator,
   SelectTrigger,
   SelectValue,
-  Separator$1 as Separator,
+  Separator$2 as Separator,
   Sheet,
   SheetClose,
   SheetContent,