@nextop-os/ui-system 0.0.27 → 0.0.28

package/dist/{chunk-D5Y4OBKX.js → chunk-CBMNQQWH.js}

@@ -11,8 +11,10 @@ import {
   FolderFilledIcon,
   IssueIcon,
   LoadingIcon,
-  SuccessFilledIcon
-} from "./chunk-UELLN5VR.js";
+  SuccessFilledIcon,
+  WarningFilledIcon,
+  WarningLinedIcon
+} from "./chunk-3BPTHQCX.js";
 import {
   cn
 } from "./chunk-DGPY4WP3.js";
@@ -22,11 +24,12 @@ import { cva } from "class-variance-authority";
 import { Slot } from "radix-ui";
 import { jsx } from "react/jsx-runtime";
 var badgeVariants = cva(
-  "group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-[4px] border border-transparent px-2 py-0.5 text-[0.72rem] font-normal whitespace-nowrap transition-[background-color,border-color,color,box-shadow] focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/35 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3!",
+  "group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-[4px] border border-transparent px-1 py-0.5 text-[0.72rem] font-normal whitespace-nowrap transition-[background-color,border-color,color,box-shadow] focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/35 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3!",
   {
     variants: {
       variant: {
         default: "bg-[var(--transparency-block)] text-[var(--text-secondary)] [a]:hover:bg-[var(--transparency-hover)]",
+        accent: "bg-[var(--accent-bg)] text-[var(--accent)] [a]:hover:bg-[var(--accent-bg)]",
         secondary: "bg-[var(--transparency-block)] text-[var(--text-secondary)] [a]:hover:bg-[var(--transparency-hover)]",
         destructive: "bg-destructive/10 text-destructive focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:focus-visible:ring-destructive/40 [a]:hover:bg-destructive/18",
         outline: "border-border bg-card/90 text-foreground [a]:hover:bg-muted [a]:hover:text-foreground",
@@ -884,13 +887,139 @@ var DatePicker = React2.forwardRef(
 );
 DatePicker.displayName = "DatePicker";
 
+// src/components/drawer/drawer.tsx
+import { Drawer as DrawerPrimitive } from "vaul";
+import { jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
+function Drawer({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx8(DrawerPrimitive.Root, { "data-slot": "drawer", ...props });
+}
+function DrawerTrigger({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx8(DrawerPrimitive.Trigger, { "data-slot": "drawer-trigger", ...props });
+}
+function DrawerPortal({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx8(DrawerPrimitive.Portal, { "data-slot": "drawer-portal", ...props });
+}
+function DrawerClose({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx8(DrawerPrimitive.Close, { "data-slot": "drawer-close", ...props });
+}
+function DrawerOverlay({
+  className,
+  style,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx8(
+    DrawerPrimitive.Overlay,
+    {
+      "data-slot": "drawer-overlay",
+      className: cn(
+        "fixed inset-0 isolate bg-[var(--backdrop)] duration-150 supports-backdrop-filter:backdrop-blur-sm data-closed:animate-out data-closed:fade-out-0 data-open:animate-in data-open:fade-in-0",
+        className
+      ),
+      style: { zIndex: "var(--z-dialog-overlay)", ...style },
+      ...props
+    }
+  );
+}
+function DrawerContent({
+  className,
+  children,
+  portalContainer,
+  showOverlay = true,
+  style,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs4(DrawerPortal, { "data-slot": "drawer-portal", container: portalContainer, children: [
+    showOverlay ? /* @__PURE__ */ jsx8(DrawerOverlay, {}) : null,
+    /* @__PURE__ */ jsxs4(
+      DrawerPrimitive.Content,
+      {
+        "data-slot": "drawer-content",
+        className: cn(
+          "group/drawer-content fixed flex h-auto flex-col border-[var(--border-1)] bg-background-fronted text-sm text-foreground shadow-panel outline-none",
+          "data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-xl data-[vaul-drawer-direction=bottom]:border-t",
+          "data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:rounded-r-xl data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:sm:max-w-sm",
+          "data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:rounded-l-xl data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:sm:max-w-sm",
+          "data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-xl data-[vaul-drawer-direction=top]:border-b",
+          className
+        ),
+        style: { zIndex: "var(--z-dialog)", ...style },
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx8("div", { className: "mx-auto mt-4 hidden h-1 w-[100px] shrink-0 rounded-full bg-muted group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }),
+          children
+        ]
+      }
+    )
+  ] });
+}
+function DrawerHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsx8(
+    "div",
+    {
+      "data-slot": "drawer-header",
+      className: cn(
+        "flex flex-col gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-0.5 md:text-left",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function DrawerFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsx8(
+    "div",
+    {
+      "data-slot": "drawer-footer",
+      className: cn("mt-auto flex flex-col gap-2 p-4", className),
+      ...props
+    }
+  );
+}
+function DrawerTitle({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx8(
+    DrawerPrimitive.Title,
+    {
+      "data-slot": "drawer-title",
+      className: cn(
+        "text-base font-medium leading-[1.35] text-foreground",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function DrawerDescription({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx8(
+    DrawerPrimitive.Description,
+    {
+      "data-slot": "drawer-description",
+      className: cn("text-sm text-muted-foreground", className),
+      ...props
+    }
+  );
+}
+
 // src/components/dropdown-menu/dropdown-menu.tsx
 import { DropdownMenu as DropdownMenuPrimitive } from "radix-ui";
 
 // src/components/menu-surface/menu-surface.tsx
 import * as React3 from "react";
 import { Slot as Slot3 } from "radix-ui";
-import { jsx as jsx8 } from "react/jsx-runtime";
+import { jsx as jsx9 } from "react/jsx-runtime";
 var menuSurfaceClassName = "t-dropdown flex flex-col gap-0.5 rounded-[8px] border border-[var(--border-1)] bg-[var(--background-fronted)] p-1 text-sm text-[var(--text-primary)] shadow-panel outline-none";
 var menuItemClassName = "relative flex cursor-pointer items-center gap-1.5 rounded-sm px-2 py-1 text-sm text-[var(--text-primary)] outline-hidden transition-colors duration-200 select-none hover:bg-[var(--transparency-hover)] hover:text-[var(--text-primary)] focus:bg-[var(--transparency-hover)] focus:text-[var(--text-primary)] data-[highlighted]:bg-[var(--transparency-hover)] data-[highlighted]:text-[var(--text-primary)] data-disabled:pointer-events-none data-disabled:text-[var(--text-disabled)] [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2";
 var menuItemWithIndicatorClassName = `${menuItemClassName} pr-8`;
@@ -904,7 +1033,7 @@ var MenuSurface = React3.forwardRef(
     ...props
   }, ref) => {
     const Comp = asChild ? Slot3.Root : "div";
-    return /* @__PURE__ */ jsx8(
+    return /* @__PURE__ */ jsx9(
       Comp,
       {
         ...props,
@@ -918,21 +1047,21 @@ var MenuSurface = React3.forwardRef(
 MenuSurface.displayName = "MenuSurface";
 
 // src/components/dropdown-menu/dropdown-menu.tsx
-import { jsx as jsx9, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx10, jsxs as jsxs5 } from "react/jsx-runtime";
 function DropdownMenu({
   ...props
 }) {
-  return /* @__PURE__ */ jsx9(DropdownMenuPrimitive.Root, { "data-slot": "dropdown-menu", ...props });
+  return /* @__PURE__ */ jsx10(DropdownMenuPrimitive.Root, { "data-slot": "dropdown-menu", ...props });
 }
 function DropdownMenuPortal({
   ...props
 }) {
-  return /* @__PURE__ */ jsx9(DropdownMenuPrimitive.Portal, { "data-slot": "dropdown-menu-portal", ...props });
+  return /* @__PURE__ */ jsx10(DropdownMenuPrimitive.Portal, { "data-slot": "dropdown-menu-portal", ...props });
 }
 function DropdownMenuTrigger({
   ...props
 }) {
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(
     DropdownMenuPrimitive.Trigger,
     {
       "data-slot": "dropdown-menu-trigger",
@@ -948,7 +1077,7 @@ function DropdownMenuContent({
   style,
   ...props
 }) {
-  return /* @__PURE__ */ jsx9(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx10(
     DropdownMenuPrimitive.Content,
     {
       asChild: true,
@@ -956,7 +1085,7 @@ function DropdownMenuContent({
       align,
       sideOffset,
       ...props,
-      children: /* @__PURE__ */ jsx9(
+      children: /* @__PURE__ */ jsx10(
         MenuSurface,
         {
           "data-slot": "dropdown-menu-content",
@@ -975,7 +1104,7 @@ function DropdownMenuGroup({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(
     DropdownMenuPrimitive.Group,
     {
       "data-slot": "dropdown-menu-group",
@@ -990,7 +1119,7 @@ function DropdownMenuItem({
   variant = "default",
   ...props
 }) {
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(
     DropdownMenuPrimitive.Item,
     {
       "data-inset": inset,
@@ -1013,7 +1142,7 @@ function DropdownMenuCheckboxItem({
   inset,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs4(
+  return /* @__PURE__ */ jsxs5(
     DropdownMenuPrimitive.CheckboxItem,
     {
       checked,
@@ -1026,12 +1155,12 @@ function DropdownMenuCheckboxItem({
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx9(
+        /* @__PURE__ */ jsx10(
           "span",
           {
             className: menuItemIndicatorClassName,
             "data-slot": "dropdown-menu-checkbox-item-indicator",
-            children: /* @__PURE__ */ jsx9(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx9(CheckIcon, {}) })
+            children: /* @__PURE__ */ jsx10(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx10(CheckIcon, {}) })
           }
         ),
         children
@@ -1043,7 +1172,7 @@ function DropdownMenuRadioGroup({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(
     DropdownMenuPrimitive.RadioGroup,
     {
       "data-slot": "dropdown-menu-radio-group",
@@ -1058,7 +1187,7 @@ function DropdownMenuRadioItem({
   inset,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs4(
+  return /* @__PURE__ */ jsxs5(
     DropdownMenuPrimitive.RadioItem,
     {
       "data-inset": inset,
@@ -1070,12 +1199,12 @@ function DropdownMenuRadioItem({
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx9(
+        /* @__PURE__ */ jsx10(
           "span",
           {
             className: menuItemIndicatorClassName,
             "data-slot": "dropdown-menu-radio-item-indicator",
-            children: /* @__PURE__ */ jsx9(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx9(CheckIcon, {}) })
+            children: /* @__PURE__ */ jsx10(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx10(CheckIcon, {}) })
           }
         ),
         children
@@ -1088,7 +1217,7 @@ function DropdownMenuLabel({
   inset,
   ...props
 }) {
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(
     DropdownMenuPrimitive.Label,
     {
       "data-inset": inset,
@@ -1105,7 +1234,7 @@ function DropdownMenuSeparator({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(
     DropdownMenuPrimitive.Separator,
     {
       "data-slot": "dropdown-menu-separator",
@@ -1118,7 +1247,7 @@ function DropdownMenuShortcut({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(
     "span",
     {
       "data-slot": "dropdown-menu-shortcut",
@@ -1133,7 +1262,7 @@ function DropdownMenuShortcut({
 function DropdownMenuSub({
   ...props
 }) {
-  return /* @__PURE__ */ jsx9(DropdownMenuPrimitive.Sub, { "data-slot": "dropdown-menu-sub", ...props });
+  return /* @__PURE__ */ jsx10(DropdownMenuPrimitive.Sub, { "data-slot": "dropdown-menu-sub", ...props });
 }
 function DropdownMenuSubTrigger({
   className,
@@ -1141,7 +1270,7 @@ function DropdownMenuSubTrigger({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs4(
+  return /* @__PURE__ */ jsxs5(
     DropdownMenuPrimitive.SubTrigger,
     {
       "data-inset": inset,
@@ -1154,7 +1283,7 @@ function DropdownMenuSubTrigger({
       ...props,
       children: [
         children,
-        /* @__PURE__ */ jsx9(ArrowRightIcon, { className: "ml-auto" })
+        /* @__PURE__ */ jsx10(ArrowRightIcon, { className: "ml-auto" })
       ]
     }
   );
@@ -1165,13 +1294,13 @@ function DropdownMenuSubContent({
   style,
   ...props
 }) {
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(
     DropdownMenuPrimitive.SubContent,
     {
       asChild: true,
       "data-slot": "dropdown-menu-sub-content",
       ...props,
-      children: /* @__PURE__ */ jsx9(
+      children: /* @__PURE__ */ jsx10(
         MenuSurface,
         {
           "data-slot": "dropdown-menu-sub-content",
@@ -1188,7 +1317,7 @@ function DropdownMenuSubContent({
 }
 
 // src/components/input/input.tsx
-import { jsx as jsx10 } from "react/jsx-runtime";
+import { jsx as jsx11 } from "react/jsx-runtime";
 var inputVariantClassNames = {
   default: "h-8 rounded-[6px] px-3 py-0 text-sm leading-[1.3]",
   lg: "h-12 rounded-[8px] px-4 py-3 text-base leading-[1.3]",
@@ -1204,7 +1333,7 @@ function Input({
   ...props
 }) {
   const resolvedVariant = variant ?? (size === "sm" ? "sm" : "default");
-  return /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsx11(
     "input",
     {
       type,
@@ -1223,7 +1352,7 @@ function Input({
 }
 
 // src/components/mention-pill/mention-pill.tsx
-import { jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
 var mentionPillTokenByKind = {
   issue: "var(--rich-text-mention-issue)",
   session: "var(--rich-text-mention-session)",
@@ -1251,7 +1380,7 @@ function MentionPill({
   const dataKind = mentionPillDataKindByKind[kind];
   const iconSizeClassName = isFile ? "size-3.5" : "size-4";
   const iconShellClassName = isFile ? "size-3.5" : "size-[18px]";
-  return /* @__PURE__ */ jsxs5(
+  return /* @__PURE__ */ jsxs6(
     "span",
     {
       className: cn(
@@ -1268,7 +1397,7 @@ function MentionPill({
       },
       ...props,
       children: [
-        /* @__PURE__ */ jsxs5(
+        /* @__PURE__ */ jsxs6(
           "span",
           {
             "aria-hidden": removable ? void 0 : true,
@@ -1277,7 +1406,7 @@ function MentionPill({
               iconShellClassName
             ),
             children: [
-              /* @__PURE__ */ jsx11(
+              /* @__PURE__ */ jsx12(
                 Icon,
                 {
                   className: cn(
@@ -1287,7 +1416,7 @@ function MentionPill({
                   )
                 }
               ),
-              removable ? /* @__PURE__ */ jsx11(
+              removable ? /* @__PURE__ */ jsx12(
                 "button",
                 {
                   "aria-label": removeButtonProps?.["aria-label"],
@@ -1297,15 +1426,15 @@ function MentionPill({
                     "absolute top-1/2 left-1/2 inline-flex size-5 -translate-x-1/2 -translate-y-1/2 items-center justify-center rounded-sm text-[var(--text-secondary)] opacity-0 transition-opacity group-hover:opacity-100 hover:bg-transparency-block hover:text-[var(--text-primary)] focus-visible:opacity-100",
                     removeButtonProps?.className
                   ),
-                  children: /* @__PURE__ */ jsx11(CloseIcon, { className: "size-3.5" })
+                  children: /* @__PURE__ */ jsx12(CloseIcon, { className: "size-3.5" })
                 }
               ) : null
             ]
           }
         ),
-        /* @__PURE__ */ jsxs5("span", { className: "min-w-0 overflow-hidden text-ellipsis whitespace-nowrap", children: [
-          /* @__PURE__ */ jsx11("span", { children: label }),
-          summary ? /* @__PURE__ */ jsxs5("span", { className: "text-current", children: [
+        /* @__PURE__ */ jsxs6("span", { className: "min-w-0 overflow-hidden text-ellipsis whitespace-nowrap", children: [
+          /* @__PURE__ */ jsx12("span", { children: label }),
+          summary ? /* @__PURE__ */ jsxs6("span", { className: "text-current", children: [
             " ",
             summary
           ] }) : null
@@ -1317,26 +1446,26 @@ function MentionPill({
 
 // src/components/popover/popover.tsx
 import { Popover as PopoverPrimitive } from "radix-ui";
-import { jsx as jsx12 } from "react/jsx-runtime";
+import { jsx as jsx13 } from "react/jsx-runtime";
 function Popover({
   ...props
 }) {
-  return /* @__PURE__ */ jsx12(PopoverPrimitive.Root, { "data-slot": "popover", ...props });
+  return /* @__PURE__ */ jsx13(PopoverPrimitive.Root, { "data-slot": "popover", ...props });
 }
 function PopoverTrigger({
   ...props
 }) {
-  return /* @__PURE__ */ jsx12(PopoverPrimitive.Trigger, { "data-slot": "popover-trigger", ...props });
+  return /* @__PURE__ */ jsx13(PopoverPrimitive.Trigger, { "data-slot": "popover-trigger", ...props });
 }
 function PopoverPortal({
   ...props
 }) {
-  return /* @__PURE__ */ jsx12(PopoverPrimitive.Portal, { "data-slot": "popover-portal", ...props });
+  return /* @__PURE__ */ jsx13(PopoverPrimitive.Portal, { "data-slot": "popover-portal", ...props });
 }
 function PopoverClose({
   ...props
 }) {
-  return /* @__PURE__ */ jsx12(PopoverPrimitive.Close, { "data-slot": "popover-close", ...props });
+  return /* @__PURE__ */ jsx13(PopoverPrimitive.Close, { "data-slot": "popover-close", ...props });
 }
 function PopoverContent({
   className,
@@ -1344,7 +1473,7 @@ function PopoverContent({
   sideOffset = 4,
   ...props
 }) {
-  return /* @__PURE__ */ jsx12(PopoverPortal, { children: /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsx13(PopoverPortal, { children: /* @__PURE__ */ jsx13(
     PopoverPrimitive.Content,
     {
       "data-slot": "popover-content",
@@ -1362,18 +1491,18 @@ function PopoverContent({
 function PopoverAnchor({
   ...props
 }) {
-  return /* @__PURE__ */ jsx12(PopoverPrimitive.Anchor, { "data-slot": "popover-anchor", ...props });
+  return /* @__PURE__ */ jsx13(PopoverPrimitive.Anchor, { "data-slot": "popover-anchor", ...props });
 }
 
 // src/components/resizable/resizable.tsx
 import * as ResizablePrimitive from "react-resizable-panels";
-import { jsx as jsx13 } from "react/jsx-runtime";
+import { jsx as jsx14 } from "react/jsx-runtime";
 function ResizablePanelGroup({
   className,
   orientation = "horizontal",
   ...props
 }) {
-  return /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx14(
     ResizablePrimitive.Group,
     {
       "data-orientation": orientation,
@@ -1388,14 +1517,14 @@ function ResizablePanelGroup({
   );
 }
 function ResizablePanel(props) {
-  return /* @__PURE__ */ jsx13(ResizablePrimitive.Panel, { "data-slot": "resizable-panel", ...props });
+  return /* @__PURE__ */ jsx14(ResizablePrimitive.Panel, { "data-slot": "resizable-panel", ...props });
 }
 function ResizableHandle({
   className,
   withHandle,
   ...props
 }) {
-  return /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx14(
     ResizablePrimitive.Separator,
     {
       "data-slot": "resizable-handle",
@@ -1404,27 +1533,27 @@ function ResizableHandle({
         className
       ),
       ...props,
-      children: withHandle ? /* @__PURE__ */ jsx13("div", { className: "z-10 flex items-center justify-center rounded-full bg-border/85 opacity-0 transition-[background-color,opacity] group-hover:bg-border group-hover:opacity-100 group-focus-visible:bg-border group-focus-visible:opacity-100 group-aria-[orientation=horizontal]:h-[3px] group-aria-[orientation=horizontal]:w-10 group-aria-[orientation=vertical]:h-10 group-aria-[orientation=vertical]:w-[3px]" }) : null
+      children: withHandle ? /* @__PURE__ */ jsx14("div", { className: "z-10 flex items-center justify-center rounded-full bg-border/85 opacity-0 transition-[background-color,opacity] group-hover:bg-border group-hover:opacity-100 group-focus-visible:bg-border group-focus-visible:opacity-100 group-aria-[orientation=horizontal]:h-[3px] group-aria-[orientation=horizontal]:w-10 group-aria-[orientation=vertical]:h-10 group-aria-[orientation=vertical]:w-[3px]" }) : null
     }
   );
 }
 
 // src/components/scroll-area/scroll-area.tsx
 import { ScrollArea as ScrollAreaPrimitive } from "radix-ui";
-import { jsx as jsx14, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs7 } from "react/jsx-runtime";
 function ScrollArea({
   className,
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs6(
+  return /* @__PURE__ */ jsxs7(
     ScrollAreaPrimitive.Root,
     {
       "data-slot": "scroll-area",
       className: cn("group/scroll-area relative", className),
       ...props,
       children: [
-        /* @__PURE__ */ jsx14(
+        /* @__PURE__ */ jsx15(
           ScrollAreaPrimitive.Viewport,
           {
             "data-slot": "scroll-area-viewport",
@@ -1432,8 +1561,8 @@ function ScrollArea({
             children
           }
         ),
-        /* @__PURE__ */ jsx14(ScrollBar, {}),
-        /* @__PURE__ */ jsx14(ScrollAreaPrimitive.Corner, {})
+        /* @__PURE__ */ jsx15(ScrollBar, {}),
+        /* @__PURE__ */ jsx15(ScrollAreaPrimitive.Corner, {})
       ]
     }
   );
@@ -1443,7 +1572,7 @@ function ScrollBar({
   orientation = "vertical",
   ...props
 }) {
-  return /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsx15(
     ScrollAreaPrimitive.ScrollAreaScrollbar,
     {
       "data-slot": "scroll-area-scrollbar",
@@ -1454,7 +1583,7 @@ function ScrollBar({
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx14(
+      children: /* @__PURE__ */ jsx15(
         ScrollAreaPrimitive.ScrollAreaThumb,
         {
           "data-slot": "scroll-area-thumb",
@@ -1467,17 +1596,17 @@ function ScrollBar({
 
 // src/components/select/select.tsx
 import { Select as SelectPrimitive } from "radix-ui";
-import { jsx as jsx15, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs8 } from "react/jsx-runtime";
 function Select({
   ...props
 }) {
-  return /* @__PURE__ */ jsx15(SelectPrimitive.Root, { "data-slot": "select", ...props });
+  return /* @__PURE__ */ jsx16(SelectPrimitive.Root, { "data-slot": "select", ...props });
 }
 function SelectGroup({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx16(
     SelectPrimitive.Group,
     {
       "data-slot": "select-group",
@@ -1489,27 +1618,38 @@ function SelectGroup({
 function SelectValue({
   ...props
 }) {
-  return /* @__PURE__ */ jsx15(SelectPrimitive.Value, { "data-slot": "select-value", ...props });
+  return /* @__PURE__ */ jsx16(SelectPrimitive.Value, { "data-slot": "select-value", ...props });
 }
 function SelectTrigger({
   className,
   size = "default",
+  variant = "default",
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs7(
+  return /* @__PURE__ */ jsxs8(
     SelectPrimitive.Trigger,
     {
       "data-slot": "select-trigger",
       "data-size": size,
+      "data-variant": variant,
       className: cn(
-        "flex w-fit cursor-pointer items-center justify-between gap-1.5 rounded-lg border border-transparent bg-[var(--transparency-block)] py-2 pr-2 pl-2.5 text-sm text-[var(--text-primary)] whitespace-nowrap transition-colors outline-none select-none hover:bg-[var(--transparency-hover)] focus:bg-[var(--transparency-hover)] focus-visible:border-transparent focus-visible:bg-[var(--transparency-hover)] focus-visible:ring-0 disabled:cursor-not-allowed disabled:bg-[var(--transparency-block)] disabled:text-[var(--text-disabled)] disabled:opacity-100 aria-invalid:border-[var(--state-danger)] aria-invalid:bg-[var(--transparency-block)] aria-invalid:hover:bg-[var(--transparency-hover)] aria-invalid:focus:bg-[var(--transparency-hover)] aria-invalid:focus-visible:bg-[var(--transparency-hover)] aria-invalid:ring-0 aria-invalid:shadow-none data-placeholder:text-[var(--text-placeholder)] data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 [&[data-state=open]>svg]:rotate-180 [&>svg]:transition-transform [&>svg]:duration-200 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        variant === "button" ? buttonVariants({ variant: "default", size }) : "flex w-fit cursor-pointer items-center justify-between gap-1.5 rounded-lg border border-transparent bg-[var(--transparency-block)] py-2 pr-2 pl-2.5 text-sm text-[var(--text-primary)] whitespace-nowrap transition-colors outline-none select-none hover:bg-[var(--transparency-hover)] focus:bg-[var(--transparency-hover)] focus-visible:border-transparent focus-visible:bg-[var(--transparency-hover)] focus-visible:ring-0 disabled:cursor-not-allowed disabled:bg-[var(--transparency-block)] disabled:text-[var(--text-disabled)] disabled:opacity-100 aria-invalid:border-[var(--state-danger)] aria-invalid:bg-[var(--transparency-block)] aria-invalid:hover:bg-[var(--transparency-hover)] aria-invalid:focus:bg-[var(--transparency-hover)] aria-invalid:focus-visible:bg-[var(--transparency-hover)] aria-invalid:ring-0 aria-invalid:shadow-none data-placeholder:text-[var(--text-placeholder)] data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "[&[data-state=open]>svg]:rotate-180 [&>svg]:transition-transform [&>svg]:duration-200",
         className
       ),
       ...props,
       children: [
         children,
-        /* @__PURE__ */ jsx15(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx15(ChevronDownIcon, { className: "pointer-events-none size-4 text-[var(--text-secondary)]" }) })
+        /* @__PURE__ */ jsx16(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx16(
+          ChevronDownIcon,
+          {
+            className: cn(
+              "pointer-events-none size-4",
+              variant === "button" ? "text-current" : "text-[var(--text-secondary)]"
+            )
+          }
+        ) })
       ]
     }
   );
@@ -1522,7 +1662,7 @@ function SelectContent({
   style,
   ...props
 }) {
-  return /* @__PURE__ */ jsx15(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx16(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsx16(
     SelectPrimitive.Content,
     {
       asChild: true,
@@ -1531,7 +1671,7 @@ function SelectContent({
       position,
       align,
       ...props,
-      children: /* @__PURE__ */ jsxs7(
+      children: /* @__PURE__ */ jsxs8(
         MenuSurface,
         {
           "data-slot": "select-content",
@@ -1542,8 +1682,8 @@ function SelectContent({
           ),
           style: { zIndex: "var(--z-popover)", ...style },
           children: [
-            /* @__PURE__ */ jsx15(SelectScrollUpButton, {}),
-            /* @__PURE__ */ jsx15(
+            /* @__PURE__ */ jsx16(SelectScrollUpButton, {}),
+            /* @__PURE__ */ jsx16(
               SelectPrimitive.Viewport,
               {
                 "data-position": position,
@@ -1553,7 +1693,7 @@ function SelectContent({
                 children
               }
             ),
-            /* @__PURE__ */ jsx15(SelectScrollDownButton, {})
+            /* @__PURE__ */ jsx16(SelectScrollDownButton, {})
           ]
         }
       )
@@ -1564,7 +1704,7 @@ function SelectLabel({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx16(
     SelectPrimitive.Label,
     {
       "data-slot": "select-label",
@@ -1580,7 +1720,7 @@ function SelectSplitLayout({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx16(
     "div",
     {
       "data-slot": "select-split-layout",
@@ -1596,7 +1736,7 @@ function SelectSplitColumn({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx16(
     "div",
     {
       "data-slot": "select-split-column",
@@ -1609,7 +1749,7 @@ function SelectSplitColumnLabel({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx16(
     "div",
     {
       "data-slot": "select-split-column-label",
@@ -1625,7 +1765,7 @@ function SelectSplitColumnItems({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx16(
     "div",
     {
       "data-slot": "select-split-column-items",
@@ -1641,7 +1781,7 @@ function SelectSplitDivider({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx16(
     "div",
     {
       "aria-hidden": "true",
@@ -1657,17 +1797,24 @@ function SelectSplitDivider({
 function SelectItem({
   className,
   children,
+  forceSelectedIndicator = false,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs7(
+  return /* @__PURE__ */ jsxs8(
     SelectPrimitive.Item,
     {
       "data-slot": "select-item",
       className: cn("w-full", menuItemWithIndicatorClassName, className),
       ...props,
       children: [
-        /* @__PURE__ */ jsx15("span", { className: menuItemIndicatorClassName, children: /* @__PURE__ */ jsx15(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx15(CheckIcon, { className: "pointer-events-none" }) }) }),
-        /* @__PURE__ */ jsx15(SelectPrimitive.ItemText, { children })
+        /* @__PURE__ */ jsx16("span", { className: menuItemIndicatorClassName, children: forceSelectedIndicator ? /* @__PURE__ */ jsx16(
+          CheckIcon,
+          {
+            className: "pointer-events-none",
+            "data-slot": "select-item-forced-indicator"
+          }
+        ) : /* @__PURE__ */ jsx16(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx16(CheckIcon, { className: "pointer-events-none" }) }) }),
+        /* @__PURE__ */ jsx16(SelectPrimitive.ItemText, { children })
       ]
     }
   );
@@ -1676,7 +1823,7 @@ function SelectSeparator({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx16(
     SelectPrimitive.Separator,
     {
       "data-slot": "select-separator",
@@ -1692,7 +1839,7 @@ function SelectScrollUpButton({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx16(
     SelectPrimitive.ScrollUpButton,
     {
       "data-slot": "select-scroll-up-button",
@@ -1701,7 +1848,7 @@ function SelectScrollUpButton({
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx15(ChevronUpIcon, {})
+      children: /* @__PURE__ */ jsx16(ChevronUpIcon, {})
     }
   );
 }
@@ -1709,7 +1856,7 @@ function SelectScrollDownButton({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx16(
     SelectPrimitive.ScrollDownButton,
     {
       "data-slot": "select-scroll-down-button",
@@ -1718,21 +1865,21 @@ function SelectScrollDownButton({
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx15(ChevronDownIcon, {})
+      children: /* @__PURE__ */ jsx16(ChevronDownIcon, {})
     }
   );
 }
 
 // src/components/separator/separator.tsx
 import { Separator as SeparatorPrimitive } from "radix-ui";
-import { jsx as jsx16 } from "react/jsx-runtime";
+import { jsx as jsx17 } from "react/jsx-runtime";
 function Separator2({
   className,
   orientation = "horizontal",
   decorative = true,
   ...props
 }) {
-  return /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsx17(
     SeparatorPrimitive.Root,
     {
       "data-slot": "separator",
@@ -1747,17 +1894,65 @@ function Separator2({
   );
 }
 
+// src/components/sonner/sonner.tsx
+import {
+  Toaster as SonnerToaster,
+  toast
+} from "sonner";
+import { jsx as jsx18 } from "react/jsx-runtime";
+function Toaster({ toastOptions, style, ...props }) {
+  return /* @__PURE__ */ jsx18(
+    SonnerToaster,
+    {
+      closeButton: true,
+      expand: false,
+      gap: 8,
+      position: "top-right",
+      visibleToasts: 4,
+      icons: {
+        error: /* @__PURE__ */ jsx18(FailedFilledIcon, { className: "size-4" }),
+        info: /* @__PURE__ */ jsx18(WarningLinedIcon, { className: "size-4" }),
+        loading: /* @__PURE__ */ jsx18(LoadingIcon, { className: "size-4 animate-spin" }),
+        success: /* @__PURE__ */ jsx18(SuccessFilledIcon, { className: "size-4" }),
+        warning: /* @__PURE__ */ jsx18(WarningFilledIcon, { className: "size-4" })
+      },
+      style: {
+        "--normal-bg": "var(--background-fronted)",
+        "--normal-border": "var(--line-2)",
+        "--normal-text": "var(--text-primary)",
+        "--border-radius": "8px",
+        zIndex: "var(--z-toast)",
+        ...style
+      },
+      toastOptions: {
+        ...toastOptions,
+        classNames: {
+          toast: "group pointer-events-auto min-h-14 rounded-[8px] border border-[var(--line-2)] bg-[var(--background-fronted)] px-3.5 py-3 text-[var(--text-primary)] shadow-[0_14px_40px_var(--shadow-elevated)]",
+          title: "text-sm font-semibold leading-5 text-[var(--text-primary)]",
+          description: "mt-0.5 text-xs leading-5 text-[var(--text-secondary)]",
+          actionButton: "h-7 rounded-[6px] bg-[var(--text-primary)] px-2.5 text-xs font-normal text-[var(--text-inverted)] transition-colors hover:bg-[var(--text-primary-hover)]",
+          cancelButton: "h-7 rounded-[6px] bg-[var(--transparency-block)] px-2.5 text-xs font-normal text-[var(--text-primary)] transition-colors hover:bg-[var(--transparency-hover)]",
+          closeButton: "border-[var(--line-2)] bg-[var(--background-fronted)] text-[var(--text-secondary)] hover:bg-[var(--transparency-hover)] hover:text-[var(--text-primary)]",
+          icon: "text-[var(--accent)]",
+          ...toastOptions?.classNames
+        }
+      },
+      ...props
+    }
+  );
+}
+
 // src/components/spinner/spinner.tsx
-import { jsx as jsx17 } from "react/jsx-runtime";
+import { jsx as jsx19 } from "react/jsx-runtime";
 function Spinner({
   className,
   size = 16,
-  strokeWidth = 3,
+  strokeWidth = 2,
   style,
   testId,
   trackColor
 }) {
-  return /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx19(
     LoadingIcon,
     {
       "data-slot": "spinner",
@@ -1777,7 +1972,7 @@ function Spinner({
 
 // src/components/status-dot/status-dot.tsx
 import { cva as cva3 } from "class-variance-authority";
-import { jsx as jsx18 } from "react/jsx-runtime";
+import { jsx as jsx20 } from "react/jsx-runtime";
 var statusDotVariants = cva3("inline-flex shrink-0 rounded-full", {
   variants: {
     tone: {
@@ -1811,7 +2006,7 @@ function StatusDot({
   title,
   className
 }) {
-  return /* @__PURE__ */ jsx18(
+  return /* @__PURE__ */ jsx20(
     "span",
     {
       "aria-hidden": ariaLabel ? void 0 : true,
@@ -1829,13 +2024,13 @@ function StatusDot({
 
 // src/components/switch/switch.tsx
 import { Switch as SwitchPrimitive } from "radix-ui";
-import { jsx as jsx19 } from "react/jsx-runtime";
+import { jsx as jsx21 } from "react/jsx-runtime";
 function Switch({
   className,
   size = "default",
   ...props
 }) {
-  return /* @__PURE__ */ jsx19(
+  return /* @__PURE__ */ jsx21(
     SwitchPrimitive.Root,
     {
       "data-slot": "switch",
@@ -1845,7 +2040,7 @@ function Switch({
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx19(
+      children: /* @__PURE__ */ jsx21(
         SwitchPrimitive.Thumb,
         {
           "data-slot": "switch-thumb",
@@ -1857,9 +2052,9 @@ function Switch({
 }
 
 // src/components/textarea/textarea.tsx
-import { jsx as jsx20 } from "react/jsx-runtime";
+import { jsx as jsx22 } from "react/jsx-runtime";
 function Textarea({ className, ...props }) {
-  return /* @__PURE__ */ jsx20(
+  return /* @__PURE__ */ jsx22(
     "textarea",
     {
       "data-slot": "textarea",
@@ -1876,8 +2071,14 @@ function Textarea({ className, ...props }) {
 import * as React4 from "react";
 import { Toast as ToastPrimitive } from "radix-ui";
 import { cva as cva4 } from "class-variance-authority";
-import { jsx as jsx21, jsxs as jsxs8 } from "react/jsx-runtime";
-var ToastProvider = ToastPrimitive.Provider;
+import { jsx as jsx23, jsxs as jsxs9 } from "react/jsx-runtime";
+var toastDefaultDurationMs = 3e3;
+function ToastProvider({
+  duration = toastDefaultDurationMs,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx23(ToastPrimitive.Provider, { duration, ...props });
+}
 var ToastVisualContext = React4.createContext(null);
 var toastStatusIconByVariant = {
   destructive: FailedFilledIcon,
@@ -1934,7 +2135,7 @@ function ToastRoot({
   ...props
 }) {
   const isDestructive = variant === "destructive";
-  return /* @__PURE__ */ jsx21(
+  return /* @__PURE__ */ jsx23(
     ToastPrimitive.Root,
     {
       "aria-busy": busy,
@@ -1951,7 +2152,7 @@ function ToastRoot({
         ...style
       },
       ...props,
-      children: /* @__PURE__ */ jsx21(ToastVisualContext.Provider, { value: { busy, variant }, children: /* @__PURE__ */ jsx21("span", { className: "flex min-w-0 max-w-full flex-col items-center justify-center whitespace-normal break-words text-center", children }) })
+      children: /* @__PURE__ */ jsx23(ToastVisualContext.Provider, { value: { busy, variant }, children: /* @__PURE__ */ jsx23("span", { className: "flex min-w-0 max-w-full flex-col items-center justify-center whitespace-normal break-words text-center", children }) })
     }
   );
 }
@@ -1962,7 +2163,7 @@ function ToastTitle({
 }) {
   const toastVisual = React4.useContext(ToastVisualContext);
   const StatusIcon = toastVisual?.variant && hasToastStatusIcon(toastVisual.variant) ? toastStatusIconByVariant[toastVisual.variant] : null;
-  return /* @__PURE__ */ jsxs8(
+  return /* @__PURE__ */ jsxs9(
     ToastPrimitive.Title,
     {
       "data-slot": "toast-title",
@@ -1972,16 +2173,16 @@ function ToastTitle({
       ),
       ...props,
       children: [
-        toastVisual?.busy ? /* @__PURE__ */ jsx21(
+        toastVisual?.busy ? /* @__PURE__ */ jsx23(
           Spinner,
           {
             className: "shrink-0 text-current",
             size: 16,
-            strokeWidth: 3,
+            strokeWidth: 2,
             trackColor: "color-mix(in srgb, currentColor 28%, transparent)"
           }
-        ) : StatusIcon ? /* @__PURE__ */ jsx21(StatusIcon, { className: "size-4 shrink-0 text-current" }) : null,
-        /* @__PURE__ */ jsx21("span", { className: "min-w-0 break-words", children: formatToastText(children) })
+        ) : StatusIcon ? /* @__PURE__ */ jsx23(StatusIcon, { className: "size-4 shrink-0 text-current" }) : null,
+        /* @__PURE__ */ jsx23("span", { className: "min-w-0 break-words", children: formatToastText(children) })
       ]
     }
   );
@@ -1990,7 +2191,7 @@ function ToastDescription({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx21(
+  return /* @__PURE__ */ jsx23(
     ToastPrimitive.Description,
     {
       "data-slot": "toast-description",
@@ -2006,7 +2207,7 @@ function ToastClose({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx21(
+  return /* @__PURE__ */ jsx23(
     ToastPrimitive.Close,
     {
       "data-slot": "toast-close",
@@ -2015,7 +2216,7 @@ function ToastClose({
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx21(CloseIcon, { className: "size-4" })
+      children: /* @__PURE__ */ jsx23(CloseIcon, { className: "size-4" })
     }
   );
 }
@@ -2024,7 +2225,7 @@ function ToastViewport({
   style,
   ...props
 }) {
-  return /* @__PURE__ */ jsx21(
+  return /* @__PURE__ */ jsx23(
     ToastPrimitive.Viewport,
     {
       "data-slot": "toast-viewport",
@@ -2040,12 +2241,12 @@ function ToastViewport({
 
 // src/components/tooltip/tooltip.tsx
 import { Tooltip as TooltipPrimitive } from "radix-ui";
-import { jsx as jsx22 } from "react/jsx-runtime";
+import { jsx as jsx24 } from "react/jsx-runtime";
 function TooltipProvider({
   delayDuration = 0,
   ...props
 }) {
-  return /* @__PURE__ */ jsx22(
+  return /* @__PURE__ */ jsx24(
     TooltipPrimitive.Provider,
     {
       "data-slot": "tooltip-provider",
@@ -2057,25 +2258,26 @@ function TooltipProvider({
 function Tooltip({
   ...props
 }) {
-  return /* @__PURE__ */ jsx22(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props });
+  return /* @__PURE__ */ jsx24(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props });
 }
 function TooltipTrigger({
   ...props
 }) {
-  return /* @__PURE__ */ jsx22(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
+  return /* @__PURE__ */ jsx24(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
 }
 function TooltipPortal({
   ...props
 }) {
-  return /* @__PURE__ */ jsx22(TooltipPrimitive.Portal, { "data-slot": "tooltip-portal", ...props });
+  return /* @__PURE__ */ jsx24(TooltipPrimitive.Portal, { "data-slot": "tooltip-portal", ...props });
 }
 function TooltipContent({
   className,
   sideOffset = 8,
   children,
+  style,
   ...props
 }) {
-  return /* @__PURE__ */ jsx22(TooltipPortal, { children: /* @__PURE__ */ jsx22(
+  return /* @__PURE__ */ jsx24(TooltipPortal, { children: /* @__PURE__ */ jsx24(
     TooltipPrimitive.Content,
     {
       "data-slot": "tooltip-content",
@@ -2084,7 +2286,7 @@ function TooltipContent({
         "z-50 inline-flex w-fit max-w-xs origin-(--radix-tooltip-content-transform-origin) items-center gap-2 rounded-md border border-[var(--border-1)] bg-[var(--background-fronted)] px-2 py-1 text-sm leading-[1.3] text-popover-foreground shadow-soft outline-none 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 data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
         className
       ),
-      style: { zIndex: "var(--z-popover)" },
+      style: { zIndex: "var(--z-tooltip)", ...style },
       ...props,
       children
     }
@@ -2093,7 +2295,7 @@ function TooltipContent({
 
 // src/components/underline-tabs/underline-tabs.tsx
 import { useEffect as useEffect3, useLayoutEffect as useLayoutEffect2, useRef as useRef2, useState as useState3 } from "react";
-import { jsx as jsx23, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs10 } from "react/jsx-runtime";
 function UnderlineTabs({
   tabs,
   value,
@@ -2176,7 +2378,7 @@ function UnderlineTabs({
       behavior: "smooth"
     });
   };
-  return /* @__PURE__ */ jsxs9(
+  return /* @__PURE__ */ jsxs10(
     "div",
     {
       "aria-label": ariaLabel,
@@ -2188,7 +2390,7 @@ function UnderlineTabs({
       "data-testid": testId,
       role: "tablist",
       children: [
-        /* @__PURE__ */ jsx23(
+        /* @__PURE__ */ jsx25(
           "div",
           {
             ref: viewportRef,
@@ -2202,7 +2404,7 @@ function UnderlineTabs({
             "data-can-scroll-right": overflow.canScrollRight ? "true" : "false",
             "data-slot": "underline-tabs-viewport",
             "data-testid": viewportTestId,
-            children: /* @__PURE__ */ jsxs9(
+            children: /* @__PURE__ */ jsxs10(
               "div",
               {
                 ref: rowRef,
@@ -2210,7 +2412,7 @@ function UnderlineTabs({
                 children: [
                   tabs.map((tab) => {
                     const isActive = value === tab.value;
-                    return /* @__PURE__ */ jsxs9(
+                    return /* @__PURE__ */ jsxs10(
                       "button",
                       {
                         ref: (element) => {
@@ -2223,7 +2425,7 @@ function UnderlineTabs({
                         "aria-selected": isActive,
                         className: cn(
                           "relative inline-flex h-6 shrink-0 items-center gap-1.5 whitespace-nowrap border-0 bg-transparent p-0 text-[13px] font-semibold leading-6 text-[var(--text-secondary)] transition-colors hover:text-[var(--text-primary)] focus-visible:outline-none",
-                          isActive && "text-primary"
+                          isActive && "text-[var(--accent)]"
                         ),
                         "data-active": isActive ? "true" : "false",
                         "data-slot": "underline-tabs-tab",
@@ -2233,18 +2435,18 @@ function UnderlineTabs({
                         onClick: () => onValueChange(tab.value),
                         onMouseDown: preventMouseDownDefault ? (event) => event.preventDefault() : void 0,
                         children: [
-                          /* @__PURE__ */ jsx23("span", { children: tab.label }),
-                          tab.count !== void 0 ? /* @__PURE__ */ jsx23("span", { className: "text-xs font-semibold leading-6 text-[inherit] opacity-[0.58]", children: tab.count }) : null
+                          /* @__PURE__ */ jsx25("span", { children: tab.label }),
+                          tab.count !== void 0 ? /* @__PURE__ */ jsx25("span", { className: "text-xs font-semibold leading-6 text-[inherit]", children: tab.count }) : null
                         ]
                       },
                       tab.value
                     );
                   }),
-                  /* @__PURE__ */ jsx23(
+                  /* @__PURE__ */ jsx25(
                     "div",
                     {
                       "aria-hidden": true,
-                      className: "absolute bottom-0 left-0 z-[1] h-0.5 rounded-[1px] bg-primary transition-[transform,width] duration-[220ms] ease-[cubic-bezier(0.4,0,0.2,1)] motion-reduce:transition-none",
+                      className: "absolute bottom-0 left-0 z-[1] h-0.5 rounded-[1px] bg-[var(--accent)] transition-[transform,width] duration-[220ms] ease-[cubic-bezier(0.4,0,0.2,1)] motion-reduce:transition-none",
                       "data-slot": "underline-tabs-indicator",
                       style: {
                         transform: `translateX(${indicatorStyle.left}px)`,
@@ -2257,7 +2459,7 @@ function UnderlineTabs({
             )
           }
         ),
-        /* @__PURE__ */ jsx23(
+        /* @__PURE__ */ jsx25(
           "button",
           {
             "aria-label": scrollLeftLabel,
@@ -2268,10 +2470,10 @@ function UnderlineTabs({
             disabled: !overflow.canScrollLeft,
             type: "button",
             onClick: () => scrollTabs("left"),
-            children: /* @__PURE__ */ jsx23(ArrowLeftIcon, { size: 16 })
+            children: /* @__PURE__ */ jsx25(ArrowLeftIcon, { size: 16 })
           }
         ),
-        /* @__PURE__ */ jsx23(
+        /* @__PURE__ */ jsx25(
           "button",
           {
             "aria-label": scrollRightLabel,
@@ -2282,7 +2484,7 @@ function UnderlineTabs({
             disabled: !overflow.canScrollRight,
             type: "button",
             onClick: () => scrollTabs("right"),
-            children: /* @__PURE__ */ jsx23(ArrowRightIcon, { size: 16 })
+            children: /* @__PURE__ */ jsx25(ArrowRightIcon, { size: 16 })
           }
         )
       ]
@@ -2293,7 +2495,7 @@ function UnderlineTabs({
 // src/components/viewport-menu-surface/viewport-menu-surface.tsx
 import * as React5 from "react";
 import { createPortal as createPortal2 } from "react-dom";
-import { jsx as jsx24 } from "react/jsx-runtime";
+import { jsx as jsx26 } from "react/jsx-runtime";
 var VIEWPORT_MENU_PADDING = 12;
 var MENU_BOUNDARY_PADDING = 8;
 function clampMenuCoordinate(origin, size, viewportExtent, padding) {
@@ -2540,7 +2742,7 @@ var ViewportMenuSurface = React5.forwardRef(function ViewportMenuSurface2({
     return null;
   }
   return createPortal2(
-    /* @__PURE__ */ jsx24(
+    /* @__PURE__ */ jsx26(
       MenuSurface,
       {
         ...rest,
@@ -2598,6 +2800,16 @@ export {
   DialogDescription,
   ConfirmationDialog,
   DatePicker,
+  Drawer,
+  DrawerTrigger,
+  DrawerPortal,
+  DrawerClose,
+  DrawerOverlay,
+  DrawerContent,
+  DrawerHeader,
+  DrawerFooter,
+  DrawerTitle,
+  DrawerDescription,
   menuSurfaceClassName,
   menuItemClassName,
   menuItemWithIndicatorClassName,
@@ -2647,6 +2859,8 @@ export {
   SelectScrollUpButton,
   SelectScrollDownButton,
   Separator2 as Separator,
+  toast,
+  Toaster,
   Spinner,
   statusDotVariants,
   StatusDot,
@@ -2667,4 +2881,4 @@ export {
   UnderlineTabs,
   ViewportMenuSurface
 };
-//# sourceMappingURL=chunk-D5Y4OBKX.js.map
+//# sourceMappingURL=chunk-CBMNQQWH.js.map