npm - @northslopetech/altitude-ui - Versions diffs - 3.0.0-alpha.2 → 3.0.0-alpha.4 - Mend

@northslopetech/altitude-ui 3.0.0-alpha.2 → 3.0.0-alpha.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/dist/index.mjs CHANGED Viewed

@@ -12,74 +12,68 @@ function cn(...inputs) {
 }
 // src/components/ui/button.tsx
-import { jsxs } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 var buttonVariants = cva2(
   "inline-flex items-center justify-center gap-2 whitespace-nowrap transition-colors focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
   {
     variants: {
       variant: {
-        default: "bg-primary text-light shadow-sm hover:brightness-[60%] active:brightness-[80%] focus-visible:ring-2 focus-visible:ring-interactive focus-visible:ring-offset-2",
-        outline: "bg-light text-dark border border-strong shadow-sm hover:brightness-[70%] active:brightness-[90%] focus-visible:ring-2 focus-visible:ring-interactive focus-visible:ring-offset-2",
-        destructive: "bg-error text-light shadow-sm hover:brightness-[60%] active:brightness-[80%] focus-visible:ring-2 focus-visible:ring-error focus-visible:ring-offset-2",
-        "destructive-subtle": "bg-light text-error border border-secondary shadow-sm hover:brightness-[70%] active:brightness-[90%] focus-visible:ring-2 focus-visible:ring-error focus-visible:ring-offset-2",
-        ghost: "bg-light text-dark hover:brightness-[70%] active:brightness-[90%] focus-visible:ring-2 focus-visible:ring-interactive focus-visible:ring-offset-2",
-        link: "bg-light text-dark underline underline-offset-4 hover:cursor-pointer active:text-info"
+        default: "interactive-default interactive-default-fg border border-default shadow-sm hover:brightness-[90%] dark:hover:brightness-[130%] active:brightness-[80%] dark:active:brightness-[120%] focus-visible:ring-2 focus-visible:ring-focus-default focus-visible:border-strong",
+        primary: "interactive-accent interactive-accent-fg hover:brightness-[90%] dark:hover:brightness-[130%] active:brightness-[80%] dark:active:brightness-[120%] focus-visible:ring-2 focus-visible:ring-focus-default",
+        destructive: "interactive-destructive interactive-destructive-fg hover:brightness-[90%] dark:hover:brightness-[130%] active:brightness-[80%] dark:active:brightness-[120%] focus-visible:ring-3 focus-visible:ring-focus-error",
+        ghost: "interactive-default interactive-default-fg hover:brightness-[90%] dark:hover:brightness-[130%] active:brightness-[80%] dark:active:brightness-[120%] focus-visible:ring-2 focus-visible:ring-focus-default",
+        link: "h-6 px-0 py-0 rounded-sm text-default underline underline-offset-2 focus-visible:ring-2 focus-visible:ring-focus-default"
       },
       size: {
-        sm: "h-8 rounded-md px-2 py-2 min-w-[120px]",
-        default: "h-10 rounded-lg px-3 py-2 min-w-[125px]",
-        lg: "h-12 rounded-lg px-4 py-2 min-w-[141px]",
-        icon: "h-10 w-10 rounded-lg"
+        default: "h-9 rounded-md px-4 py-2 type-label-sm-medium",
+        lg: "h-10 rounded-md px-4 py-2.5 type-label-md-medium",
+        sm: "h-8 rounded-sm px-3 py-1.5 type-label-sm-medium",
+        mini: "h-6 rounded-sm px-2 py-1 type-label-xs-medium"
       }
     },
-    compoundVariants: [],
+    compoundVariants: [
+      {
+        variant: "link",
+        size: ["default", "sm"],
+        className: "type-body-sm-regular hover:type-body-sm-semibold active:type-body-sm-semibold"
+      },
+      {
+        variant: "link",
+        size: "lg",
+        className: "type-body-md-regular hover:type-body-md-semibold active:type-body-md-semibold"
+      },
+      {
+        variant: "link",
+        size: "mini",
+        className: "type-body-xs-regular hover:type-body-xs-semibold active:type-body-xs-semibold"
+      }
+    ],
     defaultVariants: {
       variant: "default",
       size: "default"
     }
   }
 );
-function getButtonTypographyStyles(size) {
-  switch (size) {
-    case "sm":
-      return { font: "var(--typography-label-sm-bold)" };
-    case "lg":
-      return { font: "var(--typography-label-lg-bold)" };
-    case "icon":
-    case "default":
-    default:
-      return { font: "var(--typography-label-md-bold)" };
-  }
-}
+var hasTextChildren = (children) => React.Children.toArray(children).some(
+  (child) => typeof child === "string" && child.trim().length > 0
+);
 var Button = React.forwardRef(
-  ({
-    className,
-    style,
-    variant,
-    size,
-    icon,
-    iconPosition = "left",
-    children,
-    ...props
-  }, ref) => {
-    const typographyStyles = getButtonTypographyStyles(size);
-    const tokenStyles = {
-      ...typographyStyles,
-      ...style
-    };
-    return /* @__PURE__ */ jsxs(
+  ({ className, style, variant, size, children, ...props }, ref) => {
+    const isIconOnly = !hasTextChildren(children);
+    const iconOnlyClasses = isIconOnly ? "aspect-square px-0 py-0" : void 0;
+    return /* @__PURE__ */ jsx(
       ButtonPrimitive,
       {
         "data-slot": "button",
-        className: cn(buttonVariants({ variant, size }), className),
-        style: tokenStyles,
+        className: cn(
+          buttonVariants({ variant, size }),
+          iconOnlyClasses,
+          className
+        ),
+        style,
         ref,
         ...props,
-        children: [
-          icon && iconPosition === "left" && icon,
-          children,
-          icon && iconPosition === "right" && icon
-        ]
+        children
       }
     );
   }
@@ -89,7 +83,7 @@ Button.displayName = "Button";
 // src/components/ui/text.tsx
 import * as React2 from "react";
 import { cva as cva3 } from "class-variance-authority";
-import { jsx } from "react/jsx-runtime";
+import { jsx as jsx2 } from "react/jsx-runtime";
 var textVariants = cva3("", {
   variants: {
     variant: {
@@ -144,7 +138,7 @@ function getDefaultElement(variant) {
 var Text = React2.forwardRef(
   ({ className, variant, as, style, ...props }, ref) => {
     const Component = as || getDefaultElement(variant);
-    return /* @__PURE__ */ jsx(
+    return /* @__PURE__ */ jsx2(
       Component,
       {
         className: cn(textVariants({ variant }), className),
@@ -159,9 +153,9 @@ Text.displayName = "Text";
 // src/components/ui/card.tsx
 import * as React3 from "react";
-import { jsx as jsx2 } from "react/jsx-runtime";
+import { jsx as jsx3 } from "react/jsx-runtime";
 var Card = React3.forwardRef(
-  ({ className, size = "default", ...props }, ref) => /* @__PURE__ */ jsx2(
+  ({ className, size = "default", ...props }, ref) => /* @__PURE__ */ jsx3(
     "div",
     {
       ref,
@@ -177,7 +171,7 @@ var Card = React3.forwardRef(
 );
 Card.displayName = "Card";
 var CardHeader = React3.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx2(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx3(
     "div",
     {
       ref,
@@ -192,7 +186,7 @@ var CardHeader = React3.forwardRef(
 );
 CardHeader.displayName = "CardHeader";
 var CardTitle = React3.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx2(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx3(
     Text,
     {
       ref,
@@ -205,7 +199,7 @@ var CardTitle = React3.forwardRef(
 );
 CardTitle.displayName = "CardTitle";
 var CardDescription = React3.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx2(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx3(
     Text,
     {
       ref,
@@ -218,7 +212,7 @@ var CardDescription = React3.forwardRef(
 );
 CardDescription.displayName = "CardDescription";
 var CardAction = React3.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx2(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx3(
     "div",
     {
       ref,
@@ -233,7 +227,7 @@ var CardAction = React3.forwardRef(
 );
 CardAction.displayName = "CardAction";
 var CardContent = React3.forwardRef(
-  ({ className, bleed, ...props }, ref) => /* @__PURE__ */ jsx2(
+  ({ className, bleed, ...props }, ref) => /* @__PURE__ */ jsx3(
     "div",
     {
       ref,
@@ -248,7 +242,7 @@ var CardContent = React3.forwardRef(
 );
 CardContent.displayName = "CardContent";
 var CardFooter = React3.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx2(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx3(
     "div",
     {
       ref,
@@ -266,7 +260,7 @@ CardFooter.displayName = "CardFooter";
 // src/components/ui/typography.tsx
 import * as React4 from "react";
 import { cva as cva4 } from "class-variance-authority";
-import { jsx as jsx3 } from "react/jsx-runtime";
+import { jsx as jsx4 } from "react/jsx-runtime";
 var typographyVariants = cva4("", {
   variants: {
     variant: {
@@ -311,7 +305,7 @@ function getDefaultElement2(variant) {
 var Typography = React4.forwardRef(
   ({ className, variant, as, style, ...props }, ref) => {
     const Component = as || getDefaultElement2(variant);
-    return /* @__PURE__ */ jsx3(
+    return /* @__PURE__ */ jsx4(
       Component,
       {
         className: cn(typographyVariants({ variant }), className),
@@ -389,7 +383,7 @@ import { SquaresFourIcon as PhosphorSquaresFour } from "@phosphor-icons/react/Sq
 import { MagnifyingGlassPlusIcon as PhosphorMagnifyingGlassPlus } from "@phosphor-icons/react/MagnifyingGlassPlus";
 import { MagnifyingGlassMinusIcon as PhosphorMagnifyingGlassMinus } from "@phosphor-icons/react/MagnifyingGlassMinus";
 import { SidebarSimpleIcon as PhosphorSidebarSimple } from "@phosphor-icons/react/SidebarSimple";
-import { jsx as jsx4 } from "react/jsx-runtime";
+import { jsx as jsx5 } from "react/jsx-runtime";
 var getVariantStyles = (variant = "dark") => {
   const variants = {
     dark: "text-dark",
@@ -402,7 +396,7 @@ var getVariantStyles = (variant = "dark") => {
 };
 function createIcon(PhosphorIcon) {
   const Wrapped = React5.forwardRef(
-    ({ className, variant = "dark", size, weight = "regular", ...props }, ref) => /* @__PURE__ */ jsx4(
+    ({ className, variant = "dark", size, weight = "regular", ...props }, ref) => /* @__PURE__ */ jsx5(
       PhosphorIcon,
       {
         ref,
@@ -476,7 +470,7 @@ var ZoomInIcon = createIcon(PhosphorMagnifyingGlassPlus);
 var ZoomOutIcon = createIcon(PhosphorMagnifyingGlassMinus);
 // src/components/ui/select.tsx
-import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx6, jsxs } from "react/jsx-runtime";
 var selectTriggerVariants = cva5(
   "flex items-center justify-between border bg-light text-dark focus:outline-none disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1 transition-colors rounded-md px-3 border-secondary focus-visible:border-2 focus-visible:border-strong aria-invalid:border-error aria-invalid:focus-visible:border-error",
   {
@@ -517,7 +511,7 @@ var SelectTrigger = React6.forwardRef(({ className, children, style, width, ...p
     font: "var(--typography-label-md-regular)",
     ...style
   };
-  return /* @__PURE__ */ jsxs2(
+  return /* @__PURE__ */ jsxs(
     SelectPrimitive.Trigger,
     {
       ref,
@@ -529,8 +523,8 @@ var SelectTrigger = React6.forwardRef(({ className, children, style, width, ...p
       style: tokenStyles,
       ...props,
       children: [
-        /* @__PURE__ */ jsx5("span", { className: "flex-1 text-left truncate", children }),
-        /* @__PURE__ */ jsx5(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx5(
+        /* @__PURE__ */ jsx6("span", { className: "flex-1 text-left truncate", children }),
+        /* @__PURE__ */ jsx6(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx6(
           CaretDownIcon,
           {
             size: 20,
@@ -542,7 +536,7 @@ var SelectTrigger = React6.forwardRef(({ className, children, style, width, ...p
   );
 });
 SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
-var SelectScrollUpButton = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx5(
+var SelectScrollUpButton = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
   SelectPrimitive.ScrollUpButton,
   {
     ref,
@@ -551,11 +545,11 @@ var SelectScrollUpButton = React6.forwardRef(({ className, ...props }, ref) => /
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx5(CaretUpIcon, {})
+    children: /* @__PURE__ */ jsx6(CaretUpIcon, {})
   }
 ));
 SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
-var SelectScrollDownButton = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx5(
+var SelectScrollDownButton = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
   SelectPrimitive.ScrollDownButton,
   {
     ref,
@@ -564,13 +558,13 @@ var SelectScrollDownButton = React6.forwardRef(({ className, ...props }, ref) =>
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx5(CaretDownIcon, {})
+    children: /* @__PURE__ */ jsx6(CaretDownIcon, {})
   }
 ));
 SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
 var SelectContent = React6.forwardRef(({ className, children, position = "popper", ...props }, ref) => {
   const contentPosition = position || "popper";
-  return /* @__PURE__ */ jsx5(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs2(
+  return /* @__PURE__ */ jsx6(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
     SelectPrimitive.Content,
     {
       ref,
@@ -581,8 +575,8 @@ var SelectContent = React6.forwardRef(({ className, children, position = "popper
       position: contentPosition,
       ...props,
       children: [
-        /* @__PURE__ */ jsx5(SelectScrollUpButton, {}),
-        /* @__PURE__ */ jsx5(
+        /* @__PURE__ */ jsx6(SelectScrollUpButton, {}),
+        /* @__PURE__ */ jsx6(
           SelectPrimitive.Viewport,
           {
             className: cn(
@@ -592,13 +586,13 @@ var SelectContent = React6.forwardRef(({ className, children, position = "popper
             children
           }
         ),
-        /* @__PURE__ */ jsx5(SelectScrollDownButton, {})
+        /* @__PURE__ */ jsx6(SelectScrollDownButton, {})
       ]
     }
   ) });
 });
 SelectContent.displayName = SelectPrimitive.Content.displayName;
-var SelectLabel = React6.forwardRef(({ className, children, style, ...props }, ref) => /* @__PURE__ */ jsx5(
+var SelectLabel = React6.forwardRef(({ className, children, style, ...props }, ref) => /* @__PURE__ */ jsx6(
   SelectPrimitive.Label,
   {
     ref,
@@ -609,7 +603,7 @@ var SelectLabel = React6.forwardRef(({ className, children, style, ...props }, r
   }
 ));
 SelectLabel.displayName = SelectPrimitive.Label.displayName;
-var SelectItem = React6.forwardRef(({ className, children, style, ...props }, ref) => /* @__PURE__ */ jsxs2(
+var SelectItem = React6.forwardRef(({ className, children, style, ...props }, ref) => /* @__PURE__ */ jsxs(
   SelectPrimitive.Item,
   {
     ref,
@@ -624,13 +618,13 @@ var SelectItem = React6.forwardRef(({ className, children, style, ...props }, re
     style: { font: "var(--typography-label-md-regular)", ...style },
     ...props,
     children: [
-      /* @__PURE__ */ jsx5(SelectPrimitive.ItemText, { className: "flex-1 truncate", children }),
-      /* @__PURE__ */ jsx5(SelectPrimitive.ItemIndicator, { className: "flex h-4 w-4 items-center justify-center ml-auto", children: /* @__PURE__ */ jsx5(CheckIcon, { className: "text-strong" }) })
+      /* @__PURE__ */ jsx6(SelectPrimitive.ItemText, { className: "flex-1 truncate", children }),
+      /* @__PURE__ */ jsx6(SelectPrimitive.ItemIndicator, { className: "flex h-4 w-4 items-center justify-center ml-auto", children: /* @__PURE__ */ jsx6(CheckIcon, { className: "text-strong" }) })
     ]
   }
 ));
 SelectItem.displayName = SelectPrimitive.Item.displayName;
-var SelectSeparator = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx5(
+var SelectSeparator = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
   SelectPrimitive.Separator,
   {
     ref,
@@ -645,31 +639,30 @@ import { useMemo } from "react";
 import { cva as cva6 } from "class-variance-authority";
 // src/components/ui/label.tsx
-import * as LabelPrimitive from "@radix-ui/react-label";
-import { jsx as jsx6 } from "react/jsx-runtime";
-function Label2({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx6(
-    LabelPrimitive.Root,
-    {
-      "data-slot": "label",
-      className: cn(
-        "flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
-        className
-      ),
-      ...props
-    }
-  );
-}
+import * as React7 from "react";
+import { jsx as jsx7 } from "react/jsx-runtime";
+var labelClasses = "type-label-sm-medium flex flex-row items-center gap-2 text-default select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50";
+var Label2 = React7.forwardRef(
+  ({ className, ...props }, ref) => {
+    return /* @__PURE__ */ jsx7(
+      "label",
+      {
+        ref,
+        "data-slot": "label",
+        className: cn(labelClasses, className),
+        ...props
+      }
+    );
+  }
+);
+Label2.displayName = "Label";
 // src/components/ui/separator.tsx
-import * as React7 from "react";
+import * as React8 from "react";
 import { Separator as SeparatorPrimitive } from "@base-ui/react/separator";
-import { jsx as jsx7 } from "react/jsx-runtime";
-var Separator2 = React7.forwardRef(
-  ({ className, orientation = "horizontal", ...props }, ref) => /* @__PURE__ */ jsx7(
+import { jsx as jsx8 } from "react/jsx-runtime";
+var Separator2 = React8.forwardRef(
+  ({ className, orientation = "horizontal", ...props }, ref) => /* @__PURE__ */ jsx8(
     SeparatorPrimitive,
     {
       ref,
@@ -686,9 +679,9 @@ var Separator2 = React7.forwardRef(
 Separator2.displayName = "Separator";
 // src/components/ui/field.tsx
-import { jsx as jsx8, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs2 } from "react/jsx-runtime";
 function FieldSet({ className, ...props }) {
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(
     "fieldset",
     {
       "data-slot": "field-set",
@@ -706,7 +699,7 @@ function FieldLegend({
   variant = "legend",
   ...props
 }) {
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(
     "legend",
     {
       "data-slot": "field-legend",
@@ -722,7 +715,7 @@ function FieldLegend({
   );
 }
 function FieldGroup({ className, ...props }) {
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(
     "div",
     {
       "data-slot": "field-group",
@@ -762,7 +755,7 @@ function Field({
   orientation = "vertical",
   ...props
 }) {
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(
     "div",
     {
       role: "group",
@@ -774,7 +767,7 @@ function Field({
   );
 }
 function FieldContent({ className, ...props }) {
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(
     "div",
     {
       "data-slot": "field-content",
@@ -790,7 +783,7 @@ function FieldLabel({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(
     Label2,
     {
       "data-slot": "field-label",
@@ -805,7 +798,7 @@ function FieldLabel({
   );
 }
 function FieldTitle({ className, ...props }) {
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(
     "div",
     {
       "data-slot": "field-label",
@@ -818,7 +811,7 @@ function FieldTitle({ className, ...props }) {
   );
 }
 function FieldDescription({ className, ...props }) {
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(
     "p",
     {
       "data-slot": "field-description",
@@ -837,7 +830,7 @@ function FieldSeparator({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs3(
+  return /* @__PURE__ */ jsxs2(
     "div",
     {
       "data-slot": "field-separator",
@@ -848,8 +841,8 @@ function FieldSeparator({
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx8(Separator2, { className: "absolute inset-0 top-1/2" }),
-        children && /* @__PURE__ */ jsx8(
+        /* @__PURE__ */ jsx9(Separator2, { className: "absolute inset-0 top-1/2" }),
+        children && /* @__PURE__ */ jsx9(
           "span",
           {
             className: "bg-light text-secondary relative mx-auto block w-fit px-2",
@@ -877,14 +870,14 @@ function FieldError({
     if (errors?.length === 1 && errors[0]?.message) {
       return errors[0].message;
     }
-    return /* @__PURE__ */ jsx8("ul", { className: "ml-4 flex list-disc flex-col gap-1", children: errors.map(
-      (error, index) => error?.message && /* @__PURE__ */ jsx8("li", { children: error.message }, index)
+    return /* @__PURE__ */ jsx9("ul", { className: "ml-4 flex list-disc flex-col gap-1", children: errors.map(
+      (error, index) => error?.message && /* @__PURE__ */ jsx9("li", { children: error.message }, index)
     ) });
   }, [children, errors]);
   if (!content) {
     return null;
   }
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(
     "div",
     {
       role: "alert",
@@ -896,13 +889,136 @@ function FieldError({
   );
 }
+// src/components/ui/dialog.tsx
+import * as React9 from "react";
+import { Dialog as DialogPrimitive } from "@base-ui/react/dialog";
+import { jsx as jsx10, jsxs as jsxs3 } from "react/jsx-runtime";
+var DialogChromeContext = React9.createContext(null);
+function useDialogChrome() {
+  return React9.useContext(DialogChromeContext) ?? { showCloseButton: false };
+}
+var DialogCloseControl = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs3(
+  DialogPrimitive.Close,
+  {
+    ref,
+    type: "button",
+    className: cn(
+      "shrink-0 rounded-md p-1 text-secondary transition-colors",
+      "hover:bg-subtle focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-interactive focus-visible:ring-offset-2",
+      className
+    ),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx10(CloseIcon, { size: 16, "aria-hidden": "true" }),
+      /* @__PURE__ */ jsx10("span", { className: "sr-only", children: "Close" })
+    ]
+  }
+));
+DialogCloseControl.displayName = "DialogCloseControl";
+var DIALOG_DESKTOP_FRAME = "h-[480px] w-[640px] max-w-[calc(100vw-2rem)] max-h-[calc(100dvh-2rem)]";
+var DIALOG_MOBILE_FRAME = "w-[320px] min-h-[240px] max-w-[calc(100vw-2rem)] max-h-[min(640px,calc(100dvh-2rem))] overflow-x-hidden [&_input]:!min-w-0";
+var Dialog = DialogPrimitive.Root;
+var DialogTrigger = DialogPrimitive.Trigger;
+var DialogOverlay = React9.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx10(
+    DialogPrimitive.Backdrop,
+    {
+      ref,
+      className: cn(
+        "fixed inset-0 z-40 bg-dark/60 backdrop-blur-sm data-[hidden]:animate-out data-[hidden]:fade-out-0 data-[open]:animate-in data-[open]:fade-in-0",
+        className
+      ),
+      ...props
+    }
+  )
+);
+DialogOverlay.displayName = "DialogOverlay";
+var DialogContent = React9.forwardRef(
+  ({ className, children, showCloseButton = true, size = "desktop", ...props }, ref) => /* @__PURE__ */ jsxs3(DialogPrimitive.Portal, { children: [
+    /* @__PURE__ */ jsx10(DialogOverlay, {}),
+    /* @__PURE__ */ jsx10(DialogPrimitive.Viewport, { className: "fixed inset-0 z-50 flex items-start justify-center overflow-y-auto p-4 sm:items-center sm:p-6", children: /* @__PURE__ */ jsx10(
+      DialogPrimitive.Popup,
+      {
+        ref,
+        "data-slot": "dialog",
+        className: cn(
+          "relative my-auto flex flex-col overflow-hidden rounded-[10px] border border-default surface-default shadow-lg outline-none focus-visible:ring-2 focus-visible:ring-interactive focus-visible:ring-offset-2",
+          size === "desktop" && DIALOG_DESKTOP_FRAME,
+          size === "mobile" && DIALOG_MOBILE_FRAME,
+          className
+        ),
+        ...props,
+        children: /* @__PURE__ */ jsx10(DialogChromeContext.Provider, { value: { showCloseButton }, children })
+      }
+    ) })
+  ] })
+);
+DialogContent.displayName = "DialogContent";
+var DialogBody = React9.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx10(
+    "div",
+    {
+      ref,
+      "data-slot": "dialog-body",
+      className: cn(
+        "min-h-0 flex-1 overflow-y-auto overscroll-contain p-6",
+        className
+      ),
+      ...props
+    }
+  )
+);
+DialogBody.displayName = "DialogBody";
+var DialogFooter = React9.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx10(
+    "div",
+    {
+      ref,
+      className: cn(
+        "shrink-0 flex flex-col-reverse gap-2 p-4 sm:flex-row sm:justify-end sm:gap-2",
+        className
+      ),
+      ...props
+    }
+  )
+);
+DialogFooter.displayName = "DialogFooter";
+var DialogTitle = React9.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    const { showCloseButton } = useDialogChrome();
+    return /* @__PURE__ */ jsxs3("div", { className: "shrink-0 flex items-center justify-between p-4", children: [
+      /* @__PURE__ */ jsx10(
+        DialogPrimitive.Title,
+        {
+          ref,
+          className: cn("type-h4-medium text-default", className),
+          ...props,
+          children
+        }
+      ),
+      showCloseButton ? /* @__PURE__ */ jsx10(DialogCloseControl, {}) : null
+    ] });
+  }
+);
+DialogTitle.displayName = "DialogTitle";
+var DialogDescription = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx10(
+  DialogPrimitive.Description,
+  {
+    ref,
+    className: cn("type-body-sm-regular text-secondary", className),
+    ...props
+  }
+));
+DialogDescription.displayName = "DialogDescription";
+var DialogClose = DialogPrimitive.Close;
 // src/components/ui/breadcrumb.tsx
-import * as React8 from "react";
+import * as React10 from "react";
 import { mergeProps } from "@base-ui/react/merge-props";
 import { useRender } from "@base-ui/react/use-render";
-import { jsx as jsx9, jsxs as jsxs4 } from "react/jsx-runtime";
-var Breadcrumb = React8.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx9(
+import { jsx as jsx11, jsxs as jsxs4 } from "react/jsx-runtime";
+var Breadcrumb = React10.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
     "nav",
     {
       "aria-label": "breadcrumb",
@@ -914,8 +1030,8 @@ var Breadcrumb = React8.forwardRef(
   )
 );
 Breadcrumb.displayName = "Breadcrumb";
-var BreadcrumbList = React8.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx9(
+var BreadcrumbList = React10.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
     "ol",
     {
       "data-slot": "breadcrumb-list",
@@ -929,8 +1045,8 @@ var BreadcrumbList = React8.forwardRef(
   )
 );
 BreadcrumbList.displayName = "BreadcrumbList";
-var BreadcrumbItem = React8.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx9(
+var BreadcrumbItem = React10.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
     "li",
     {
       "data-slot": "breadcrumb-item",
@@ -941,7 +1057,7 @@ var BreadcrumbItem = React8.forwardRef(
   )
 );
 BreadcrumbItem.displayName = "BreadcrumbItem";
-var BreadcrumbLink = React8.forwardRef(
+var BreadcrumbLink = React10.forwardRef(
   ({ className, render, ...props }, ref) => useRender({
     ref,
     defaultTagName: "a",
@@ -958,8 +1074,8 @@ var BreadcrumbLink = React8.forwardRef(
   })
 );
 BreadcrumbLink.displayName = "BreadcrumbLink";
-var BreadcrumbPage = React8.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx9(
+var BreadcrumbPage = React10.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
     "span",
     {
       "data-slot": "breadcrumb-page",
@@ -973,7 +1089,7 @@ var BreadcrumbPage = React8.forwardRef(
   )
 );
 BreadcrumbPage.displayName = "BreadcrumbPage";
-var BreadcrumbSeparator = React8.forwardRef(({ children, className, ...props }, ref) => /* @__PURE__ */ jsx9(
+var BreadcrumbSeparator = React10.forwardRef(({ children, className, ...props }, ref) => /* @__PURE__ */ jsx11(
   "li",
   {
     "data-slot": "breadcrumb-separator",
@@ -982,11 +1098,11 @@ var BreadcrumbSeparator = React8.forwardRef(({ children, className, ...props },
     className: cn("[&>svg]:size-3.5", className),
     ref,
     ...props,
-    children: children ?? /* @__PURE__ */ jsx9(CaretRightIcon, { className: "cn-rtl-flip" })
+    children: children ?? /* @__PURE__ */ jsx11(CaretRightIcon, { className: "cn-rtl-flip" })
   }
 ));
 BreadcrumbSeparator.displayName = "BreadcrumbSeparator";
-var BreadcrumbEllipsis = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs4(
+var BreadcrumbEllipsis = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs4(
   "span",
   {
     "data-slot": "breadcrumb-ellipsis",
@@ -999,22 +1115,22 @@ var BreadcrumbEllipsis = React8.forwardRef(({ className, ...props }, ref) => /*
     ref,
     ...props,
     children: [
-      /* @__PURE__ */ jsx9(MoreMenuIcon, {}),
-      /* @__PURE__ */ jsx9("span", { className: "sr-only", children: "More" })
+      /* @__PURE__ */ jsx11(MoreMenuIcon, {}),
+      /* @__PURE__ */ jsx11("span", { className: "sr-only", children: "More" })
     ]
   }
 ));
 BreadcrumbEllipsis.displayName = "BreadcrumbEllipsis";
 // src/components/ui/tooltip.tsx
-import * as React9 from "react";
+import * as React11 from "react";
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
-import { jsx as jsx10, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs5 } from "react/jsx-runtime";
 function TooltipProvider({
   delayDuration = 0,
   ...props
 }) {
-  return /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsx12(
     TooltipPrimitive.Provider,
     {
       "data-slot": "tooltip-provider",
@@ -1025,11 +1141,11 @@ function TooltipProvider({
 }
 TooltipProvider.displayName = "TooltipProvider";
 function Tooltip({ delayDuration, ...props }) {
-  return /* @__PURE__ */ jsx10(TooltipProvider, { delayDuration, children: /* @__PURE__ */ jsx10(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props }) });
+  return /* @__PURE__ */ jsx12(TooltipProvider, { delayDuration, children: /* @__PURE__ */ jsx12(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props }) });
 }
 Tooltip.displayName = "Tooltip";
-var TooltipTrigger = React9.forwardRef(({ ...props }, ref) => {
-  return /* @__PURE__ */ jsx10(
+var TooltipTrigger = React11.forwardRef(({ ...props }, ref) => {
+  return /* @__PURE__ */ jsx12(
     TooltipPrimitive.Trigger,
     {
       ref,
@@ -1039,8 +1155,8 @@ var TooltipTrigger = React9.forwardRef(({ ...props }, ref) => {
   );
 });
 TooltipTrigger.displayName = "TooltipTrigger";
-var TooltipContent = React9.forwardRef(({ className, sideOffset = 2, children, ...props }, ref) => {
-  return /* @__PURE__ */ jsx10(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs5(
+var TooltipContent = React11.forwardRef(({ className, sideOffset = 2, children, ...props }, ref) => {
+  return /* @__PURE__ */ jsx12(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs5(
     TooltipPrimitive.Content,
     {
       ref,
@@ -1052,7 +1168,7 @@ var TooltipContent = React9.forwardRef(({ className, sideOffset = 2, children, .
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx10(TooltipPrimitive.Arrow, { className: "fill-dark", width: 10, height: 9 }),
+        /* @__PURE__ */ jsx12(TooltipPrimitive.Arrow, { className: "fill-dark", width: 10, height: 9 }),
         children
       ]
     }
@@ -1061,21 +1177,21 @@ var TooltipContent = React9.forwardRef(({ className, sideOffset = 2, children, .
 TooltipContent.displayName = "TooltipContent";
 // src/components/ui/sidebar.tsx
-import * as React10 from "react";
-import { jsx as jsx11, jsxs as jsxs6 } from "react/jsx-runtime";
+import * as React12 from "react";
+import { jsx as jsx13, jsxs as jsxs6 } from "react/jsx-runtime";
 var SIDEBAR_CONSTANTS = {
   WIDTH: "144px",
   WIDTH_ICON: "48px"
 };
-var SidebarContext = React10.createContext(null);
+var SidebarContext = React12.createContext(null);
 function useSidebar() {
-  const context = React10.useContext(SidebarContext);
+  const context = React12.useContext(SidebarContext);
   if (!context) {
     throw new Error("useSidebar must be used within a SidebarProvider.");
   }
   return context;
 }
-var SidebarProvider = React10.forwardRef(
+var SidebarProvider = React12.forwardRef(
   ({
     defaultOpen = true,
     open: openProp,
@@ -1085,9 +1201,9 @@ var SidebarProvider = React10.forwardRef(
     children,
     ...props
   }, ref) => {
-    const [_open, _setOpen] = React10.useState(defaultOpen);
+    const [_open, _setOpen] = React12.useState(defaultOpen);
     const open = openProp ?? _open;
-    const setOpen = React10.useCallback(
+    const setOpen = React12.useCallback(
       (value) => {
         const openState = typeof value === "function" ? value(open) : value;
         if (setOpenProp) {
@@ -1098,11 +1214,11 @@ var SidebarProvider = React10.forwardRef(
       },
       [setOpenProp, open]
     );
-    const toggleSidebar = React10.useCallback(() => {
+    const toggleSidebar = React12.useCallback(() => {
       return setOpen((open2) => !open2);
     }, [setOpen]);
     const state = open ? "expanded" : "collapsed";
-    const contextValue = React10.useMemo(
+    const contextValue = React12.useMemo(
       () => ({
         state,
         open,
@@ -1111,7 +1227,7 @@ var SidebarProvider = React10.forwardRef(
       }),
       [state, open, setOpen, toggleSidebar]
     );
-    return /* @__PURE__ */ jsx11(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx11(
+    return /* @__PURE__ */ jsx13(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx13(
       "div",
       {
         style: {
@@ -1131,7 +1247,7 @@ var SidebarProvider = React10.forwardRef(
   }
 );
 SidebarProvider.displayName = "SidebarProvider";
-var Sidebar = React10.forwardRef(
+var Sidebar = React12.forwardRef(
   ({ collapsible = "icon", className, children, ...props }, ref) => {
     const { state } = useSidebar();
     return /* @__PURE__ */ jsxs6(
@@ -1145,7 +1261,7 @@ var Sidebar = React10.forwardRef(
         "aria-expanded": state === "expanded",
         role: "navigation",
         children: [
-          /* @__PURE__ */ jsx11(
+          /* @__PURE__ */ jsx13(
             "div",
             {
               className: cn(
@@ -1154,7 +1270,7 @@ var Sidebar = React10.forwardRef(
               )
             }
           ),
-          /* @__PURE__ */ jsx11(
+          /* @__PURE__ */ jsx13(
             "div",
             {
               className: cn(
@@ -1163,7 +1279,7 @@ var Sidebar = React10.forwardRef(
                 className
               ),
               ...props,
-              children: /* @__PURE__ */ jsx11(
+              children: /* @__PURE__ */ jsx13(
                 "div",
                 {
                   "data-sidebar": "sidebar",
@@ -1179,9 +1295,9 @@ var Sidebar = React10.forwardRef(
   }
 );
 Sidebar.displayName = "Sidebar";
-var SidebarInset = React10.forwardRef(
+var SidebarInset = React12.forwardRef(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx11(
+    return /* @__PURE__ */ jsx13(
       "main",
       {
         ref,
@@ -1195,9 +1311,9 @@ var SidebarInset = React10.forwardRef(
   }
 );
 SidebarInset.displayName = "SidebarInset";
-var SidebarHeader = React10.forwardRef(
+var SidebarHeader = React12.forwardRef(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx11(
+    return /* @__PURE__ */ jsx13(
       "div",
       {
         ref,
@@ -1213,9 +1329,9 @@ var SidebarHeader = React10.forwardRef(
   }
 );
 SidebarHeader.displayName = "SidebarHeader";
-var SidebarFooter = React10.forwardRef(
+var SidebarFooter = React12.forwardRef(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx11(
+    return /* @__PURE__ */ jsx13(
       "div",
       {
         ref,
@@ -1227,9 +1343,9 @@ var SidebarFooter = React10.forwardRef(
   }
 );
 SidebarFooter.displayName = "SidebarFooter";
-var SidebarContent = React10.forwardRef(
+var SidebarContent = React12.forwardRef(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx11(
+    return /* @__PURE__ */ jsx13(
       "div",
       {
         ref,
@@ -1244,9 +1360,9 @@ var SidebarContent = React10.forwardRef(
   }
 );
 SidebarContent.displayName = "SidebarContent";
-var SidebarGroup = React10.forwardRef(
+var SidebarGroup = React12.forwardRef(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx11(
+    return /* @__PURE__ */ jsx13(
       "div",
       {
         ref,
@@ -1258,7 +1374,7 @@ var SidebarGroup = React10.forwardRef(
   }
 );
 SidebarGroup.displayName = "SidebarGroup";
-var SidebarGroupContent = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
+var SidebarGroupContent = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
   "div",
   {
     ref,
@@ -1268,8 +1384,8 @@ var SidebarGroupContent = React10.forwardRef(({ className, ...props }, ref) => /
   }
 ));
 SidebarGroupContent.displayName = "SidebarGroupContent";
-var SidebarMenu = React10.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
+var SidebarMenu = React12.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
     "ul",
     {
       ref,
@@ -1280,8 +1396,8 @@ var SidebarMenu = React10.forwardRef(
   )
 );
 SidebarMenu.displayName = "SidebarMenu";
-var SidebarMenuItem = React10.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
+var SidebarMenuItem = React12.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
     "li",
     {
       ref,
@@ -1292,9 +1408,9 @@ var SidebarMenuItem = React10.forwardRef(
   )
 );
 SidebarMenuItem.displayName = "SidebarMenuItem";
-var SidebarMenuButton = React10.forwardRef(({ isActive = false, tooltip, className, children, ...props }, ref) => {
+var SidebarMenuButton = React12.forwardRef(({ isActive = false, tooltip, className, children, ...props }, ref) => {
   const { state } = useSidebar();
-  const button = /* @__PURE__ */ jsx11(
+  const button = /* @__PURE__ */ jsx13(
     "button",
     {
       ref,
@@ -1314,21 +1430,21 @@ var SidebarMenuButton = React10.forwardRef(({ isActive = false, tooltip, classNa
   }
   const tooltipProps = typeof tooltip === "string" ? { children: tooltip } : tooltip;
   return /* @__PURE__ */ jsxs6(Tooltip, { delayDuration: 0, children: [
-    /* @__PURE__ */ jsx11(TooltipTrigger, { asChild: true, children: button }),
-    /* @__PURE__ */ jsx11(TooltipContent, { side: "right", align: "center", ...tooltipProps })
+    /* @__PURE__ */ jsx13(TooltipTrigger, { asChild: true, children: button }),
+    /* @__PURE__ */ jsx13(TooltipContent, { side: "right", align: "center", ...tooltipProps })
   ] });
 });
 SidebarMenuButton.displayName = "SidebarMenuButton";
 // src/components/ui/date-picker.tsx
-import * as React12 from "react";
+import * as React14 from "react";
 import * as PopoverPrimitive from "@radix-ui/react-popover";
 // src/components/ui/input.tsx
-import * as React11 from "react";
-import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
+import * as React13 from "react";
+import { jsx as jsx14, jsxs as jsxs7 } from "react/jsx-runtime";
 var inputBaseStyles = "flex h-10 py-2 w-full border bg-light text-dark focus:outline-none disabled:cursor-not-allowed disabled:opacity-50 transition-colors rounded-md px-3 min-w-80 placeholder:text-secondary read-only:bg-gray read-only:cursor-default read-only:border-transparent read-only:text-secondary read-only:focus-visible:border-transparent border-secondary focus-visible:border-2 focus-visible:border-strong disabled:border-secondary aria-invalid:border-error aria-invalid:focus-visible:border-error";
-var Input = React11.forwardRef(
+var Input = React13.forwardRef(
   ({
     className,
     style,
@@ -1339,7 +1455,7 @@ var Input = React11.forwardRef(
     readOnly,
     ...props
   }, ref) => {
-    const [internalValue, setInternalValue] = React11.useState(value || "");
+    const [internalValue, setInternalValue] = React13.useState(value || "");
     const isControlled = value !== void 0;
     const currentValue = isControlled ? value : internalValue;
     const showClear = showClearProp !== false && currentValue && currentValue.toString().length > 0 && !readOnly;
@@ -1370,7 +1486,7 @@ var Input = React11.forwardRef(
       onClear?.();
     };
     return /* @__PURE__ */ jsxs7("div", { className: "relative", children: [
-      /* @__PURE__ */ jsx12(
+      /* @__PURE__ */ jsx14(
         "input",
         {
           className: cn(
@@ -1386,23 +1502,23 @@ var Input = React11.forwardRef(
           ...props
         }
       ),
-      showClear && /* @__PURE__ */ jsx12(
+      showClear && /* @__PURE__ */ jsx14(
         "button",
         {
           type: "button",
           onClick: handleClear,
           className: "absolute right-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-secondary hover:text-dark transition-colors",
-          children: /* @__PURE__ */ jsx12(CloseIcon, {})
+          children: /* @__PURE__ */ jsx14(CloseIcon, {})
         }
       ),
-      showLock && /* @__PURE__ */ jsx12(LockIcon, { className: "absolute right-3 top-1/2 transform -translate-y-1/2 text-secondary" })
+      showLock && /* @__PURE__ */ jsx14(LockIcon, { className: "absolute right-3 top-1/2 transform -translate-y-1/2 text-secondary" })
     ] });
   }
 );
 Input.displayName = "Input";
 // src/components/ui/date-picker.tsx
-import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs8 } from "react/jsx-runtime";
 var getDayNames = () => {
   const days = [];
   for (let i = 0; i < 7; i++) {
@@ -1438,7 +1554,7 @@ var formatDateInput = (date) => {
     day: "2-digit"
   });
 };
-var DatePicker = React12.forwardRef(
+var DatePicker = React14.forwardRef(
   ({
     value,
     onValueChange,
@@ -1457,19 +1573,19 @@ var DatePicker = React12.forwardRef(
       if (isNaN(parsed.getTime())) return void 0;
       return parsed;
     };
-    const [selectedDate, setSelectedDate] = React12.useState(
+    const [selectedDate, setSelectedDate] = React14.useState(
       value || parseDate(defaultValue)
     );
-    const [currentMonth, setCurrentMonth] = React12.useState(() => {
+    const [currentMonth, setCurrentMonth] = React14.useState(() => {
       const date = value || parseDate(defaultValue) || /* @__PURE__ */ new Date();
       return new Date(date.getFullYear(), date.getMonth());
     });
-    const [open, setOpen] = React12.useState(false);
-    const [inputValue, setInputValue] = React12.useState(() => {
+    const [open, setOpen] = React14.useState(false);
+    const [inputValue, setInputValue] = React14.useState(() => {
       const initialDate = value || parseDate(defaultValue);
       return initialDate ? formatDateInput(initialDate) : "";
     });
-    React12.useEffect(() => {
+    React14.useEffect(() => {
       setSelectedDate(value);
       if (value) {
         setCurrentMonth(new Date(value.getFullYear(), value.getMonth()));
@@ -1480,7 +1596,7 @@ var DatePicker = React12.forwardRef(
         setInputValue("");
       }
     }, [value]);
-    React12.useEffect(() => {
+    React14.useEffect(() => {
       if (value) return;
       const parsedDefault = parseDate(defaultValue);
       if (!parsedDefault) return;
@@ -1610,7 +1726,7 @@ var DatePicker = React12.forwardRef(
         onOpenChange: disabled ? void 0 : setOpen,
         children: [
           /* @__PURE__ */ jsxs8("div", { className: "relative", children: [
-            /* @__PURE__ */ jsx13(
+            /* @__PURE__ */ jsx15(
               Input,
               {
                 ref,
@@ -1623,7 +1739,7 @@ var DatePicker = React12.forwardRef(
                 ...props
               }
             ),
-            /* @__PURE__ */ jsx13(PopoverPrimitive.Trigger, { asChild: true, children: /* @__PURE__ */ jsx13("button", { className: "absolute right-3 top-1/2 transform -translate-y-1/2 hover:bg-gray rounded p-0.5 transition-colors", children: /* @__PURE__ */ jsx13(
+            /* @__PURE__ */ jsx15(PopoverPrimitive.Trigger, { asChild: true, children: /* @__PURE__ */ jsx15("button", { className: "absolute right-3 top-1/2 transform -translate-y-1/2 hover:bg-gray rounded p-0.5 transition-colors", children: /* @__PURE__ */ jsx15(
               CalendarIcon,
               {
                 size: 20,
@@ -1634,7 +1750,7 @@ var DatePicker = React12.forwardRef(
               }
             ) }) })
           ] }),
-          /* @__PURE__ */ jsx13(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx13(
+          /* @__PURE__ */ jsx15(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx15(
             PopoverPrimitive.Content,
             {
               className: "z-50 w-80 rounded-lg border border-secondary bg-light text-dark shadow-lg animate-in fade-in-0 zoom-in-95 duration-200",
@@ -1645,12 +1761,12 @@ var DatePicker = React12.forwardRef(
               sticky: "always",
               children: /* @__PURE__ */ jsxs8("div", { className: "p-4", children: [
                 /* @__PURE__ */ jsxs8("div", { className: "flex items-center justify-between mb-4 gap-1", children: [
-                  /* @__PURE__ */ jsx13(
+                  /* @__PURE__ */ jsx15(
                     "button",
                     {
                       onClick: () => handleMonthChange("prev"),
                       className: "p-1 hover:bg-gray rounded transition-colors flex-shrink-0",
-                      children: /* @__PURE__ */ jsx13(ArrowLeftIcon, {})
+                      children: /* @__PURE__ */ jsx15(ArrowLeftIcon, {})
                     }
                   ),
                   /* @__PURE__ */ jsxs8("div", { className: "flex gap-1 flex-1 min-w-0", children: [
@@ -1660,8 +1776,8 @@ var DatePicker = React12.forwardRef(
                         value: currentMonth.getMonth().toString(),
                         onValueChange: handleMonthSelect,
                         children: [
-                          /* @__PURE__ */ jsx13(SelectTrigger, { className: "min-w-fit h-8 text-sm", children: /* @__PURE__ */ jsx13(SelectValue, {}) }),
-                          /* @__PURE__ */ jsx13(SelectContent, { children: months.map((month, index) => /* @__PURE__ */ jsx13(SelectItem, { value: index.toString(), children: month }, month)) })
+                          /* @__PURE__ */ jsx15(SelectTrigger, { className: "min-w-fit h-8 text-sm", children: /* @__PURE__ */ jsx15(SelectValue, {}) }),
+                          /* @__PURE__ */ jsx15(SelectContent, { children: months.map((month, index) => /* @__PURE__ */ jsx15(SelectItem, { value: index.toString(), children: month }, month)) })
                         ]
                       }
                     ),
@@ -1671,23 +1787,23 @@ var DatePicker = React12.forwardRef(
                         value: currentMonth.getFullYear().toString(),
                         onValueChange: handleYearSelect,
                         children: [
-                          /* @__PURE__ */ jsx13(SelectTrigger, { className: "min-w-fit h-8 text-sm", children: /* @__PURE__ */ jsx13(SelectValue, {}) }),
-                          /* @__PURE__ */ jsx13(SelectContent, { children: years.map((year) => /* @__PURE__ */ jsx13(SelectItem, { value: year.toString(), children: year }, year)) })
+                          /* @__PURE__ */ jsx15(SelectTrigger, { className: "min-w-fit h-8 text-sm", children: /* @__PURE__ */ jsx15(SelectValue, {}) }),
+                          /* @__PURE__ */ jsx15(SelectContent, { children: years.map((year) => /* @__PURE__ */ jsx15(SelectItem, { value: year.toString(), children: year }, year)) })
                         ]
                       }
                     )
                   ] }),
-                  /* @__PURE__ */ jsx13(
+                  /* @__PURE__ */ jsx15(
                     "button",
                     {
                       onClick: () => handleMonthChange("next"),
                       className: "p-1 hover:bg-gray rounded transition-colors flex-shrink-0",
-                      children: /* @__PURE__ */ jsx13(ArrowRightIcon, {})
+                      children: /* @__PURE__ */ jsx15(ArrowRightIcon, {})
                     }
                   )
                 ] }),
                 /* @__PURE__ */ jsxs8("div", { className: "space-y-1", children: [
-                  /* @__PURE__ */ jsx13("div", { className: "grid grid-cols-7 gap-1 mb-2", children: dayNames.map((day) => /* @__PURE__ */ jsx13(
+                  /* @__PURE__ */ jsx15("div", { className: "grid grid-cols-7 gap-1 mb-2", children: dayNames.map((day) => /* @__PURE__ */ jsx15(
                     Typography,
                     {
                       variant: "label-xs-bold",
@@ -1697,11 +1813,11 @@ var DatePicker = React12.forwardRef(
                     },
                     day
                   )) }),
-                  /* @__PURE__ */ jsx13("div", { className: "grid grid-cols-7 gap-1", children: days.map((date, index) => /* @__PURE__ */ jsx13(
+                  /* @__PURE__ */ jsx15("div", { className: "grid grid-cols-7 gap-1", children: days.map((date, index) => /* @__PURE__ */ jsx15(
                     "div",
                     {
                       className: "h-8 w-8 flex items-center justify-center",
-                      children: date && /* @__PURE__ */ jsx13(
+                      children: date && /* @__PURE__ */ jsx15(
                         "button",
                         {
                           onClick: () => handleDateSelect(date),
@@ -1715,7 +1831,7 @@ var DatePicker = React12.forwardRef(
                             isToday(date) && !isDateSelected(date) && !isDateDisabled(date) && "text-blue-600 after:content-[''] after:absolute after:bottom-1 after:left-1/2 after:-translate-x-1/2 after:w-1 after:h-1 after:bg-blue-600 after:rounded-full",
                             isDateDisabled(date) && "text-secondary/40 cursor-not-allowed opacity-50"
                           ),
-                          children: /* @__PURE__ */ jsx13(Typography, { variant: "label-sm", as: "span", children: date.getDate() })
+                          children: /* @__PURE__ */ jsx15(Typography, { variant: "label-sm", as: "span", children: date.getDate() })
                         }
                       )
                     },
@@ -1733,9 +1849,9 @@ var DatePicker = React12.forwardRef(
 DatePicker.displayName = "DatePicker";
 // src/components/ui/upload.tsx
-import * as React13 from "react";
+import * as React15 from "react";
 import { cva as cva7 } from "class-variance-authority";
-import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
 var DEFAULT_MAX_FILE_SIZE = 10 * 1024 * 1024;
 var uploadVariants = cva7(
   "relative flex flex-col items-center justify-center rounded-lg transition-all duration-200 ease-in-out overflow-hidden",
@@ -1759,7 +1875,7 @@ var uploadVariants = cva7(
     }
   }
 );
-var Upload = React13.forwardRef(
+var Upload = React15.forwardRef(
   ({
     className,
     onFileSelect,
@@ -1772,8 +1888,8 @@ var Upload = React13.forwardRef(
     selectedFiles = [],
     ...props
   }, ref) => {
-    const fileInputRef = React13.useRef(null);
-    const [isDragOver, setIsDragOver] = React13.useState(false);
+    const fileInputRef = React15.useRef(null);
+    const [isDragOver, setIsDragOver] = React15.useState(false);
     const getFileTypeDisplay = () => {
       const typeMap = {
         "application/pdf": "PDF",
@@ -1844,10 +1960,10 @@ var Upload = React13.forwardRef(
               style: { gap: "32px" },
               children: [
                 /* @__PURE__ */ jsxs9("div", { className: "space-y-4", children: [
-                  /* @__PURE__ */ jsx14(Typography, { variant: "heading-lg", children: "Upload fail" }),
-                  /* @__PURE__ */ jsx14(Typography, { variant: "body-md", className: "text-error", children: errorMessage })
+                  /* @__PURE__ */ jsx16(Typography, { variant: "heading-lg", children: "Upload fail" }),
+                  /* @__PURE__ */ jsx16(Typography, { variant: "body-md", className: "text-error", children: errorMessage })
                 ] }),
-                /* @__PURE__ */ jsx14(
+                /* @__PURE__ */ jsx16(
                   Button,
                   {
                     variant: "destructive",
@@ -1867,9 +1983,9 @@ var Upload = React13.forwardRef(
               className: "flex flex-col items-center text-center max-w-[289px]",
               style: { gap: "32px" },
               children: [
-                /* @__PURE__ */ jsx14(Typography, { variant: "heading-lg", className: "text-dark", children: "Uploading files" }),
+                /* @__PURE__ */ jsx16(Typography, { variant: "heading-lg", className: "text-dark", children: "Uploading files" }),
                 /* @__PURE__ */ jsxs9("div", { className: "w-full max-w-[720px] space-y-2", children: [
-                  /* @__PURE__ */ jsx14("div", { className: "w-full bg-gray rounded-full h-2", children: /* @__PURE__ */ jsx14(
+                  /* @__PURE__ */ jsx16("div", { className: "w-full bg-gray rounded-full h-2", children: /* @__PURE__ */ jsx16(
                     "div",
                     {
                       className: "bg-canvas-primary h-2 rounded-full transition-all duration-300 ease-in-out",
@@ -1892,14 +2008,14 @@ var Upload = React13.forwardRef(
             }
           );
         case "success":
-          return /* @__PURE__ */ jsx14(
+          return /* @__PURE__ */ jsx16(
             "div",
             {
               className: "flex flex-col items-center text-center max-w-[289px]",
               style: { gap: "32px" },
               children: /* @__PURE__ */ jsxs9("div", { className: "space-y-4", children: [
-                /* @__PURE__ */ jsx14(Typography, { variant: "heading-lg", className: "text-success", children: "Upload successful!" }),
-                selectedFiles.length > 0 && /* @__PURE__ */ jsx14("div", { className: "text-center", children: selectedFiles.map((file, index) => /* @__PURE__ */ jsx14(Typography, { variant: "body-sm", children: file.name }, index)) })
+                /* @__PURE__ */ jsx16(Typography, { variant: "heading-lg", className: "text-success", children: "Upload successful!" }),
+                selectedFiles.length > 0 && /* @__PURE__ */ jsx16("div", { className: "text-center", children: selectedFiles.map((file, index) => /* @__PURE__ */ jsx16(Typography, { variant: "body-sm", children: file.name }, index)) })
               ] })
             }
           );
@@ -1911,10 +2027,10 @@ var Upload = React13.forwardRef(
               style: { gap: "32px" },
               children: [
                 /* @__PURE__ */ jsxs9("div", { className: "space-y-4", children: [
-                  /* @__PURE__ */ jsx14(Typography, { variant: "heading-lg", className: "text-dark", children: "Drag & drop files here" }),
-                  /* @__PURE__ */ jsx14(Typography, { variant: "body-md", className: "text-secondary", children: "or click to browse from your computer" })
+                  /* @__PURE__ */ jsx16(Typography, { variant: "heading-lg", className: "text-dark", children: "Drag & drop files here" }),
+                  /* @__PURE__ */ jsx16(Typography, { variant: "body-md", className: "text-secondary", children: "or click to browse from your computer" })
                 ] }),
-                /* @__PURE__ */ jsx14(
+                /* @__PURE__ */ jsx16(
                   Button,
                   {
                     variant: "default",
@@ -1931,7 +2047,7 @@ var Upload = React13.forwardRef(
                 /* @__PURE__ */ jsxs9(Typography, { variant: "body-sm", className: "text-secondary", children: [
                   "Supported file: ",
                   getFileTypeDisplay(),
-                  /* @__PURE__ */ jsx14("br", {}),
+                  /* @__PURE__ */ jsx16("br", {}),
                   "Max: ",
                   Math.round(maxFileSize / 1024 / 1024),
                   " MB each"
@@ -1965,7 +2081,7 @@ var Upload = React13.forwardRef(
         "aria-disabled": disabled,
         ...props,
         children: [
-          /* @__PURE__ */ jsx14(
+          /* @__PURE__ */ jsx16(
             "input",
             {
               ref: fileInputRef,
@@ -1985,29 +2101,75 @@ var Upload = React13.forwardRef(
 Upload.displayName = "Upload";
 // src/components/ui/checkbox.tsx
-import * as React14 from "react";
-import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
+import * as React16 from "react";
+import { Checkbox as CheckboxPrimitive } from "@base-ui/react/checkbox";
 import { cva as cva8 } from "class-variance-authority";
-import { jsx as jsx15 } from "react/jsx-runtime";
-var checkboxVariants = cva8(
-  "peer size-4 shrink-0 rounded-[4px] border bg-light hover:bg-info-subtle transition-colors focus-visible:outline-none focus-visible:border-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:border-primary data-[state=checked]:text-light [&_svg]:pointer-events-none [&_svg]:shrink-0 border-strong focus-visible:border-interactive aria-invalid:border-error aria-invalid:focus-visible:border-error"
-);
-var Checkbox = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx15(
-  CheckboxPrimitive.Root,
-  {
-    ref,
-    className: cn(checkboxVariants(), className),
-    ...props,
-    children: /* @__PURE__ */ jsx15(CheckboxPrimitive.Indicator, { className: "flex items-center justify-center text-current", children: /* @__PURE__ */ jsx15(CheckIcon, { variant: "light", size: 14 }) })
-  }
-));
-Checkbox.displayName = CheckboxPrimitive.Root.displayName;
+import { jsx as jsx17, jsxs as jsxs10 } from "react/jsx-runtime";
+var checkboxVariants = cva8([
+  // Base layout & appearance
+  "peer group relative size-4 shrink-0",
+  "rounded-xs border border-default surface-default shadow-xs",
+  // Transitions & hover
+  "transition-colors hover:brightness-[90%]",
+  // Focus
+  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus-default",
+  // Disabled
+  "data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50",
+  // Checked
+  "data-[checked]:border-0 data-[checked]:focus-visible:border-0",
+  "data-[checked]:interactive-accent data-[checked]:interactive-accent-fg",
+  // Indeterminate
+  "data-[indeterminate]:border-0 data-[indeterminate]:focus-visible:border-0",
+  "data-[indeterminate]:interactive-accent data-[indeterminate]:interactive-accent-fg",
+  // Error (aria-invalid) — only applies to unchecked/checked states.
+  // Indeterminate has no error state per design.
+  "aria-invalid:border-error",
+  "aria-invalid:data-[checked]:border-0 aria-invalid:data-[checked]:interactive-destructive aria-invalid:data-[checked]:interactive-destructive-fg",
+  "aria-invalid:focus-visible:ring-3 aria-invalid:focus-visible:ring-focus-error",
+  // SVG children
+  "[&_svg]:pointer-events-none [&_svg]:shrink-0"
+]);
+var Checkbox = React16.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx17(
+    CheckboxPrimitive.Root,
+    {
+      "data-slot": "checkbox",
+      ref,
+      className: cn(checkboxVariants(), className),
+      ...props,
+      children: /* @__PURE__ */ jsxs10(
+        CheckboxPrimitive.Indicator,
+        {
+          "data-slot": "checkbox-indicator",
+          className: "absolute inset-0 flex items-center justify-center text-current",
+          children: [
+            /* @__PURE__ */ jsx17(
+              CheckmarkIcon,
+              {
+                size: 14,
+                className: "text-current hidden group-data-[checked]:block"
+              }
+            ),
+            /* @__PURE__ */ jsx17(
+              MinusIcon,
+              {
+                size: 14,
+                className: "text-current hidden group-data-[indeterminate]:block"
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+});
+Checkbox.displayName = "Checkbox";
 // src/components/ui/switch.tsx
-import * as React15 from "react";
+import * as React17 from "react";
 import { Switch as SwitchPrimitive } from "@base-ui/react/switch";
 import { cva as cva9 } from "class-variance-authority";
-import { jsx as jsx16 } from "react/jsx-runtime";
+import { jsx as jsx18 } from "react/jsx-runtime";
 var switchVariants = cva9(
   "peer inline-flex shrink-0 items-center rounded-full border border-transparent transition-all outline-none after:absolute after:-inset-x-3 after:-inset-y-2 relative focus-visible:ring-3 focus-visible:ring-focus-default aria-invalid:border-error aria-invalid:ring-3 aria-invalid:ring-focus-error data-checked:interactive-accent data-unchecked:interactive-secondary data-unchecked:border-default data-disabled:cursor-not-allowed data-disabled:opacity-50",
   {
@@ -2036,16 +2198,16 @@ var switchThumbVariants = cva9(
     }
   }
 );
-var Switch = React15.forwardRef(
+var Switch = React17.forwardRef(
   ({ className, size, ...props }, ref) => {
-    return /* @__PURE__ */ jsx16(
+    return /* @__PURE__ */ jsx18(
       SwitchPrimitive.Root,
       {
         ref,
         "data-slot": "switch",
         className: cn(switchVariants({ size }), className),
         ...props,
-        children: /* @__PURE__ */ jsx16(
+        children: /* @__PURE__ */ jsx18(
           SwitchPrimitive.Thumb,
           {
             "data-slot": "switch-thumb",
@@ -2059,22 +2221,18 @@ var Switch = React15.forwardRef(
 Switch.displayName = "Switch";
 // src/components/ui/textarea.tsx
-import * as React16 from "react";
-import { jsx as jsx17 } from "react/jsx-runtime";
-var Textarea = React16.forwardRef(
+import * as React18 from "react";
+import { jsx as jsx19 } from "react/jsx-runtime";
+var Textarea = React18.forwardRef(
   ({ className, style, ...props }, ref) => {
-    const tokenStyles = {
-      font: "var(--typography-label-md-regular)",
-      ...style
-    };
-    return /* @__PURE__ */ jsx17(
+    return /* @__PURE__ */ jsx19(
       "textarea",
       {
         className: cn(
-          "flex min-h-[80px] w-full rounded-md border bg-light text-dark px-3 pt-3 pb-2 placeholder:text-secondary focus:outline-none disabled:cursor-not-allowed disabled:opacity-50 transition-colors resize-y border-secondary focus-visible:border-2 focus-visible:border-strong disabled:border-secondary aria-invalid:border-error aria-invalid:focus-visible:border-error",
+          "type-body-sm-regular flex min-h-20 w-full rounded-md border surface-default text-default px-3 pt-3 pb-2 shadow-xs placeholder:text-secondary focus:outline-none disabled:cursor-not-allowed disabled:opacity-30 transition-colors resize-y border-secondary read-only:surface-muted read-only:cursor-default read-only:border-transparent read-only:text-secondary read-only:resize-none focus-visible:ring-2 focus-visible:ring-focus-default focus-visible:border-strong disabled:border-secondary aria-invalid:border-error aria-invalid:focus-visible:ring-3 aria-invalid:focus-visible:ring-focus-error",
           className
         ),
-        style: tokenStyles,
+        style,
         ref,
         ...props
       }
@@ -2084,65 +2242,285 @@ var Textarea = React16.forwardRef(
 Textarea.displayName = "Textarea";
 // src/components/ui/badge.tsx
-import * as React17 from "react";
+import * as React19 from "react";
 import { cva as cva10 } from "class-variance-authority";
-import { jsx as jsx18 } from "react/jsx-runtime";
+import { jsx as jsx20 } from "react/jsx-runtime";
 var badgeVariants = cva10(
-  "inline-flex items-center justify-center gap-1 whitespace-nowrap transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2",
+  "px-2 py-1 inline-flex items-center justify-center gap-1 whitespace-nowrap transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus-default",
   {
     variants: {
       variant: {
-        primary: "bg-primary text-light",
-        secondary: "bg-light text-dark border border-strong",
-        accent: "bg-blue-300 text-dark",
-        success: "bg-success-subtle text-success",
-        warning: "bg-warning-subtle text-warning",
-        error: "bg-error-subtle text-error",
-        neutral: "bg-neutral-300 text-dark"
+        primary: "interactive-accent interactive-accent-fg type-label-xs-medium",
+        secondary: "interactive-secondary interactive-secondary-fg type-label-xs-medium",
+        outline: "interactive-default interactive-default-fg border border-default type-label-xs-medium",
+        ghost: "interactive-default interactive-default-fg type-label-xs-medium",
+        destructive: "interactive-destructive interactive-destructive-fg type-label-xs-medium focus-visible:ring-3 focus-visible:ring-focus-error"
+      },
+      rounded: {
+        true: "rounded-full",
+        false: "rounded-md"
       }
     },
     defaultVariants: {
-      variant: "primary"
+      variant: "primary",
+      rounded: false
     }
   }
 );
-function getBadgeTypographyStyles() {
-  return { font: "var(--typography-label-sm-bold)" };
+function isSingleDisplayCharacter(node) {
+  if (node == null || typeof node === "boolean") return false;
+  if (typeof node === "string" || typeof node === "number") {
+    const trimmed = String(node).trim();
+    return trimmed.length === 1;
+  }
+  if (Array.isArray(node)) {
+    const parts = node.filter((x) => x != null && typeof x !== "boolean");
+    if (parts.length !== 1) return false;
+    return isSingleDisplayCharacter(parts[0]);
+  }
+  if (React19.isValidElement(node)) {
+    return isSingleDisplayCharacter(
+      node.props.children
+    );
+  }
+  return false;
 }
-var Badge = React17.forwardRef(
-  ({ className, variant, style, ...props }, ref) => {
+var Badge = React19.forwardRef(
+  ({ className, variant, rounded, style, children, ...props }, ref) => {
     if (!variant) {
       return null;
     }
-    const typographyStyles = getBadgeTypographyStyles();
-    const tokenStyles = {
-      ...typographyStyles,
-      ...style
-    };
-    return /* @__PURE__ */ jsx18(
+    const circle = isSingleDisplayCharacter(children);
+    return /* @__PURE__ */ jsx20(
       "span",
       {
         className: cn(
-          badgeVariants({ variant }),
-          "rounded-full px-3 py-1",
+          badgeVariants({ variant, rounded }),
+          circle ? "size-5 shrink-0 p-0" : "",
           className
         ),
-        style: tokenStyles,
+        style,
         ref,
-        ...props
+        ...props,
+        children
       }
     );
   }
 );
 Badge.displayName = "Badge";
+// src/components/ui/item.tsx
+import * as React20 from "react";
+import { mergeProps as mergeProps2 } from "@base-ui/react/merge-props";
+import { useRender as useRender2 } from "@base-ui/react/use-render";
+import { cva as cva11 } from "class-variance-authority";
+import { jsx as jsx21 } from "react/jsx-runtime";
+var ItemGroupContext = React20.createContext(false);
+var ItemGroup = React20.forwardRef(
+  ({ className, ...props }, ref) => {
+    return /* @__PURE__ */ jsx21(ItemGroupContext.Provider, { value: true, children: /* @__PURE__ */ jsx21(
+      "div",
+      {
+        ref,
+        role: "list",
+        "data-slot": "item-group",
+        className: cn(
+          "gap-4 has-data-[size=sm]:gap-2.5 group/item-group flex w-full flex-col",
+          className
+        ),
+        ...props
+      }
+    ) });
+  }
+);
+var ItemSeparator = React20.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx21(
+    Separator2,
+    {
+      ref,
+      "data-slot": "item-separator",
+      orientation: "horizontal",
+      className: cn("my-2", className),
+      ...props
+    }
+  );
+});
+var itemVariants = cva11(
+  "surface-default rounded-md border group/item flex w-full flex-wrap transition-colors duration-100 outline-none [a]:relative [a]:isolate [a]:after:absolute [a]:after:inset-0 [a]:after:rounded-[inherit] [a]:after:-z-10 [a]:after:pointer-events-none [a]:after:transition-colors",
+  {
+    variants: {
+      variant: {
+        default: "border-transparent [a]:hover:after:bg-black/10",
+        outline: "border-default [a]:hover:after:bg-black/10",
+        muted: "surface-secondary border-transparent"
+      },
+      size: {
+        default: "items-start gap-4 p-4",
+        sm: "items-center gap-2 px-4 py-3"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+var Item2 = ({
+  className,
+  variant = "default",
+  size = "default",
+  render,
+  ...props
+}) => {
+  const insideGroup = React20.useContext(ItemGroupContext);
+  return useRender2({
+    defaultTagName: "div",
+    props: mergeProps2(
+      {
+        role: insideGroup ? "listitem" : void 0,
+        className: cn(itemVariants({ variant, size, className }))
+      },
+      props
+    ),
+    render,
+    state: {
+      slot: "item",
+      variant,
+      size
+    }
+  });
+};
+var itemMediaVariants = cva11(
+  "gap-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none",
+  {
+    variants: {
+      variant: {
+        default: "bg-transparent",
+        icon: "[&_svg:not([class*='size-'])]:size-5",
+        iconBadge: "size-8 overflow-hidden rounded bg-surface-secondary p-2 [&_svg:not([class*='size-'])]:size-4",
+        image: "size-10 overflow-hidden rounded-md group-data-[size=sm]/item:size-8 [&_img]:size-full [&_img]:object-cover"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+var ItemMedia = React20.forwardRef(
+  ({ className, variant = "default", ...props }, ref) => {
+    return /* @__PURE__ */ jsx21(
+      "div",
+      {
+        ref,
+        "data-slot": "item-media",
+        "data-variant": variant,
+        className: cn(itemMediaVariants({ variant, className })),
+        ...props
+      }
+    );
+  }
+);
+var ItemContent = React20.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx21(
+    "div",
+    {
+      ref,
+      "data-slot": "item-content",
+      className: cn(
+        "gap-1 group-data-[size=sm]/item:gap-0 flex flex-1 flex-col [&+[data-slot=item-content]]:flex-none",
+        className
+      ),
+      ...props
+    }
+  );
+});
+var ItemTitle = React20.forwardRef(
+  ({ className, ...props }, ref) => {
+    return /* @__PURE__ */ jsx21(
+      "div",
+      {
+        ref,
+        "data-slot": "item-title",
+        className: cn(
+          "type-label-sm-medium gap-2 text-default underline-offset-4 line-clamp-1 flex w-full items-center",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+var ItemDescription = React20.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx21(
+    "p",
+    {
+      ref,
+      "data-slot": "item-description",
+      className: cn(
+        "type-body-sm-regular text-secondary text-left line-clamp-2 [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary",
+        className
+      ),
+      ...props
+    }
+  );
+});
+var ItemActions = React20.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx21(
+    "div",
+    {
+      ref,
+      "data-slot": "item-actions",
+      className: cn("gap-2 flex items-center", className),
+      ...props
+    }
+  );
+});
+var ItemHeader = React20.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx21(
+    "div",
+    {
+      ref,
+      "data-slot": "item-header",
+      className: cn(
+        "gap-2 flex basis-full items-center justify-between",
+        className
+      ),
+      ...props
+    }
+  );
+});
+var ItemFooter = React20.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx21(
+    "div",
+    {
+      ref,
+      "data-slot": "item-footer",
+      className: cn(
+        "gap-2 flex basis-full items-center justify-between",
+        className
+      ),
+      ...props
+    }
+  );
+});
+Item2.displayName = "Item";
+ItemMedia.displayName = "ItemMedia";
+ItemGroup.displayName = "ItemGroup";
+ItemSeparator.displayName = "ItemSeparator";
+ItemContent.displayName = "ItemContent";
+ItemTitle.displayName = "ItemTitle";
+ItemDescription.displayName = "ItemDescription";
+ItemActions.displayName = "ItemActions";
+ItemHeader.displayName = "ItemHeader";
+ItemFooter.displayName = "ItemFooter";
 // src/components/pdf-viewer/index.tsx
-import * as React27 from "react";
+import * as React30 from "react";
 import "react-pdf/dist/Page/TextLayer.css";
 // src/components/pdf-viewer/components/CustomScrollbar.tsx
-import * as React18 from "react";
-import { Fragment, jsx as jsx19, jsxs as jsxs10 } from "react/jsx-runtime";
+import * as React21 from "react";
+import { Fragment, jsx as jsx22, jsxs as jsxs11 } from "react/jsx-runtime";
 var scrollbarStyles = `
   .custom-scrollbar-content {
     overflow: auto;
@@ -2210,15 +2588,15 @@ function CustomScrollbar({
   backgroundColor = "#F5F5F5",
   className
 }) {
-  const internalContainerRef = React18.useRef(null);
+  const internalContainerRef = React21.useRef(null);
   const containerRef = externalContainerRef || internalContainerRef;
-  const wrapperRef = React18.useRef(null);
-  const thumbVerticalRef = React18.useRef(null);
-  const thumbHorizontalRef = React18.useRef(null);
-  const lastScrollPosRef = React18.useRef({ top: 0, left: 0 });
-  const scrollTimeoutsRef = React18.useRef({ vertical: null, horizontal: null });
+  const wrapperRef = React21.useRef(null);
+  const thumbVerticalRef = React21.useRef(null);
+  const thumbHorizontalRef = React21.useRef(null);
+  const lastScrollPosRef = React21.useRef({ top: 0, left: 0 });
+  const scrollTimeoutsRef = React21.useRef({ vertical: null, horizontal: null });
   const WHEEL_LINE_HEIGHT_PX = 16;
-  const showScrollbar = React18.useCallback(
+  const showScrollbar = React21.useCallback(
     (direction) => {
       const wrapper = wrapperRef.current;
       if (!wrapper) return;
@@ -2232,7 +2610,7 @@ function CustomScrollbar({
     },
     [autoHideDelay]
   );
-  const updateScrollbarThumbPosition = React18.useCallback(() => {
+  const updateScrollbarThumbPosition = React21.useCallback(() => {
     const container = containerRef.current;
     const thumbVertical = thumbVerticalRef.current;
     const thumbHorizontal = thumbHorizontalRef.current;
@@ -2270,7 +2648,7 @@ function CustomScrollbar({
       }
     }
   }, [containerRef]);
-  React18.useEffect(() => {
+  React21.useEffect(() => {
     const container = containerRef.current;
     if (!container) return;
     lastScrollPosRef.current = {
@@ -2303,7 +2681,7 @@ function CustomScrollbar({
       if (rafId) cancelAnimationFrame(rafId);
     };
   }, [containerRef, showScrollbar, updateScrollbarThumbPosition]);
-  React18.useEffect(() => {
+  React21.useEffect(() => {
     const container = containerRef.current;
     if (!container) return;
     const normalizeWheelDelta = (delta, deltaMode, axisSize) => {
@@ -2359,7 +2737,7 @@ function CustomScrollbar({
       container.removeEventListener("wheel", handleWheel);
     };
   }, [containerRef, showScrollbar]);
-  React18.useEffect(() => {
+  React21.useEffect(() => {
     const thumbVertical = thumbVerticalRef.current;
     const thumbHorizontal = thumbHorizontalRef.current;
     const container = containerRef.current;
@@ -2419,19 +2797,19 @@ function CustomScrollbar({
       document.removeEventListener("mouseup", handleMouseUp);
     };
   }, [containerRef, showScrollbar]);
-  React18.useEffect(() => {
+  React21.useEffect(() => {
     updateScrollbarThumbPosition();
   }, [children, updateScrollbarThumbPosition]);
-  return /* @__PURE__ */ jsxs10(Fragment, { children: [
-    /* @__PURE__ */ jsx19("style", { children: scrollbarStyles }),
-    /* @__PURE__ */ jsxs10(
+  return /* @__PURE__ */ jsxs11(Fragment, { children: [
+    /* @__PURE__ */ jsx22("style", { children: scrollbarStyles }),
+    /* @__PURE__ */ jsxs11(
       "div",
       {
         ref: wrapperRef,
         className: `flex-1 min-w-0 custom-scrollbar-wrapper ${className || ""}`,
         style: { background: backgroundColor },
         children: [
-          /* @__PURE__ */ jsx19(
+          /* @__PURE__ */ jsx22(
             "div",
             {
               ref: containerRef,
@@ -2440,8 +2818,8 @@ function CustomScrollbar({
               children
             }
           ),
-          /* @__PURE__ */ jsx19("div", { className: "scrollbar-track-vertical", children: /* @__PURE__ */ jsx19("div", { ref: thumbVerticalRef, className: "scrollbar-thumb-vertical" }) }),
-          /* @__PURE__ */ jsx19("div", { className: "scrollbar-track-horizontal", children: /* @__PURE__ */ jsx19(
+          /* @__PURE__ */ jsx22("div", { className: "scrollbar-track-vertical", children: /* @__PURE__ */ jsx22("div", { ref: thumbVerticalRef, className: "scrollbar-thumb-vertical" }) }),
+          /* @__PURE__ */ jsx22("div", { className: "scrollbar-track-horizontal", children: /* @__PURE__ */ jsx22(
             "div",
             {
               ref: thumbHorizontalRef,
@@ -2455,7 +2833,7 @@ function CustomScrollbar({
 }
 // src/components/pdf-viewer/components/PdfControls.tsx
-import * as React19 from "react";
+import * as React22 from "react";
 // src/components/pdf-viewer/utils/types.ts
 var DEFAULT_BOUNDING_BOX_STYLE = {
@@ -2471,7 +2849,7 @@ var PDF_ZOOM = {
 };
 // src/components/pdf-viewer/components/PdfControls.tsx
-import { jsx as jsx20, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx23, jsxs as jsxs12 } from "react/jsx-runtime";
 var PdfControls = ({
   currentPage,
   totalPages,
@@ -2485,11 +2863,11 @@ var PdfControls = ({
   const canGoNext = currentPage < totalPages;
   const canZoomIn = zoom < PDF_ZOOM.MAX;
   const canZoomOut = zoom > PDF_ZOOM.MIN;
-  const [pageInputValue, setPageInputValue] = React19.useState(
+  const [pageInputValue, setPageInputValue] = React22.useState(
     String(currentPage)
   );
-  const isEscapeRef = React19.useRef(false);
-  React19.useEffect(() => {
+  const isEscapeRef = React22.useRef(false);
+  React22.useEffect(() => {
     setPageInputValue(String(currentPage));
   }, [currentPage]);
   const handlePageInputChange = (e) => {
@@ -2525,14 +2903,14 @@ var PdfControls = ({
     const newZoom = Math.max(zoom - PDF_ZOOM.STEP, PDF_ZOOM.MIN);
     onZoomChange(newZoom);
   };
-  return /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs12(
     "div",
     {
       className: "flex flex-col items-center justify-end py-2 px-1 gap-4",
       style: { background: "#DEDEDE" },
       children: [
-        /* @__PURE__ */ jsxs11("div", { className: "flex flex-col items-center gap-1", children: [
-          /* @__PURE__ */ jsx20(
+        /* @__PURE__ */ jsxs12("div", { className: "flex flex-col items-center gap-1", children: [
+          /* @__PURE__ */ jsx23(
             "button",
             {
               onClick: onPreviousPage,
@@ -2540,10 +2918,10 @@ var PdfControls = ({
               className: "p-1.5 rounded transition-colors hover:bg-neutral-400 disabled:opacity-40 disabled:cursor-not-allowed",
               "aria-label": "Previous page",
               type: "button",
-              children: /* @__PURE__ */ jsx20(CaretUpIcon, { size: 16, style: { color: "#666666" } })
+              children: /* @__PURE__ */ jsx23(CaretUpIcon, { size: 16, style: { color: "#666666" } })
             }
           ),
-          /* @__PURE__ */ jsx20("div", { className: "flex flex-col items-center", children: totalPages > 0 ? /* @__PURE__ */ jsx20(
+          /* @__PURE__ */ jsx23("div", { className: "flex flex-col items-center", children: totalPages > 0 ? /* @__PURE__ */ jsx23(
             "input",
             {
               type: "text",
@@ -2559,8 +2937,8 @@ var PdfControls = ({
               },
               "aria-label": "Current page"
             }
-          ) : /* @__PURE__ */ jsx20("span", { className: "text-sm", style: { color: "#666666" }, children: "-" }) }),
-          /* @__PURE__ */ jsx20(
+          ) : /* @__PURE__ */ jsx23("span", { className: "text-sm", style: { color: "#666666" }, children: "-" }) }),
+          /* @__PURE__ */ jsx23(
             "button",
             {
               onClick: onNextPage,
@@ -2568,12 +2946,12 @@ var PdfControls = ({
               className: "p-1.5 rounded transition-colors hover:bg-neutral-400 disabled:opacity-40 disabled:cursor-not-allowed",
               "aria-label": "Next page",
               type: "button",
-              children: /* @__PURE__ */ jsx20(CaretDownIcon, { size: 16, style: { color: "#666666" } })
+              children: /* @__PURE__ */ jsx23(CaretDownIcon, { size: 16, style: { color: "#666666" } })
             }
           )
         ] }),
-        /* @__PURE__ */ jsxs11("div", { className: "flex flex-col items-center gap-1", children: [
-          /* @__PURE__ */ jsx20(
+        /* @__PURE__ */ jsxs12("div", { className: "flex flex-col items-center gap-1", children: [
+          /* @__PURE__ */ jsx23(
             "button",
             {
               onClick: handleZoomIn,
@@ -2581,10 +2959,10 @@ var PdfControls = ({
               className: "p-1.5 rounded transition-colors hover:bg-neutral-400 disabled:opacity-40 disabled:cursor-not-allowed",
               "aria-label": "Zoom in",
               type: "button",
-              children: /* @__PURE__ */ jsx20(ZoomInIcon, { size: 16, style: { color: "#666666" } })
+              children: /* @__PURE__ */ jsx23(ZoomInIcon, { size: 16, style: { color: "#666666" } })
             }
           ),
-          /* @__PURE__ */ jsx20(
+          /* @__PURE__ */ jsx23(
             "button",
             {
               onClick: handleZoomOut,
@@ -2592,7 +2970,7 @@ var PdfControls = ({
               className: "p-1.5 rounded transition-colors hover:bg-neutral-400 disabled:opacity-40 disabled:cursor-not-allowed",
               "aria-label": "Zoom out",
               type: "button",
-              children: /* @__PURE__ */ jsx20(ZoomOutIcon, { size: 16, style: { color: "#666666" } })
+              children: /* @__PURE__ */ jsx23(ZoomOutIcon, { size: 16, style: { color: "#666666" } })
             }
           )
         ] })
@@ -2603,7 +2981,7 @@ var PdfControls = ({
 PdfControls.displayName = "PdfControls";
 // src/components/pdf-viewer/components/PdfDocument.tsx
-import * as React21 from "react";
+import * as React24 from "react";
 import { Document, Page } from "react-pdf";
 // src/components/pdf-viewer/utils/constants.ts
@@ -2629,7 +3007,7 @@ var INTERSECTION_OBSERVER_CONFIG = {
 };
 // src/components/pdf-viewer/components/BoundingBoxOverlay.tsx
-import * as React20 from "react";
+import * as React23 from "react";
 // src/components/pdf-viewer/utils/boundingBoxUtils.ts
 function clamp01(value) {
@@ -2656,7 +3034,7 @@ function normalizeBoundingBox(box) {
 }
 // src/components/pdf-viewer/components/BoundingBoxOverlay.tsx
-import { jsx as jsx21 } from "react/jsx-runtime";
+import { jsx as jsx24 } from "react/jsx-runtime";
 var BoundingBoxOverlayInner = ({
   boxes,
   highlightedIds,
@@ -2666,11 +3044,11 @@ var BoundingBoxOverlayInner = ({
   onBoxMouseEnter,
   onBoxMouseLeave
 }) => {
-  const validBoxes = React20.useMemo(
+  const validBoxes = React23.useMemo(
     () => boxes.map(normalizeBoundingBox).filter((b) => b !== null),
     [boxes]
   );
-  const sortedBoxes = React20.useMemo(
+  const sortedBoxes = React23.useMemo(
     () => [...validBoxes].sort((a, b) => {
       const aHighlighted = highlightedIds.has(a.id);
       const bHighlighted = highlightedIds.has(b.id);
@@ -2681,7 +3059,7 @@ var BoundingBoxOverlayInner = ({
     [validBoxes, highlightedIds]
   );
   if (sortedBoxes.length === 0) return null;
-  return /* @__PURE__ */ jsx21(
+  return /* @__PURE__ */ jsx24(
     "svg",
     {
       viewBox: "0 0 1 1",
@@ -2701,7 +3079,7 @@ var BoundingBoxOverlayInner = ({
         const baseStyle = isHighlighted ? { ...DEFAULT_BOUNDING_BOX_STYLE, ...highlightStyle } : { ...DEFAULT_BOUNDING_BOX_STYLE, ...defaultStyle };
         const style = { ...baseStyle, ...box.style };
         const isInteractive = !!(onBoxClick || onBoxMouseEnter);
-        return /* @__PURE__ */ jsx21(
+        return /* @__PURE__ */ jsx24(
           "rect",
           {
             x: box.x1,
@@ -2721,7 +3099,7 @@ var BoundingBoxOverlayInner = ({
             onMouseLeave: onBoxMouseLeave ? (e) => onBoxMouseLeave(box, e) : void 0,
             "aria-label": box.label,
             role: onBoxClick ? "button" : void 0,
-            children: box.label && /* @__PURE__ */ jsx21("title", { children: box.label })
+            children: box.label && /* @__PURE__ */ jsx24("title", { children: box.label })
           },
           box.id
         );
@@ -2729,11 +3107,11 @@ var BoundingBoxOverlayInner = ({
     }
   );
 };
-var BoundingBoxOverlay = React20.memo(BoundingBoxOverlayInner);
+var BoundingBoxOverlay = React23.memo(BoundingBoxOverlayInner);
 BoundingBoxOverlay.displayName = "BoundingBoxOverlay";
 // src/components/pdf-viewer/components/PdfDocument.tsx
-import { jsx as jsx22, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs13 } from "react/jsx-runtime";
 var PdfDocument = ({
   file,
   pageWidth,
@@ -2755,14 +3133,14 @@ var PdfDocument = ({
   onBoxMouseEnter,
   onBoxMouseLeave
 }) => {
-  const mountedRef = React21.useRef(true);
-  React21.useEffect(() => {
+  const mountedRef = React24.useRef(true);
+  React24.useEffect(() => {
     mountedRef.current = true;
     return () => {
       mountedRef.current = false;
     };
   }, []);
-  const boxesByPage = React21.useMemo(() => {
+  const boxesByPage = React24.useMemo(() => {
     const map = /* @__PURE__ */ new Map();
     boundingBoxes?.forEach((box) => {
       const pageBoxes = map.get(box.page) || [];
@@ -2771,7 +3149,7 @@ var PdfDocument = ({
     });
     return map;
   }, [boundingBoxes]);
-  const highlightedIdsSet = React21.useMemo(
+  const highlightedIdsSet = React24.useMemo(
     () => new Set(highlightedBoxIds),
     [highlightedBoxIds]
   );
@@ -2810,14 +3188,14 @@ var PdfDocument = ({
   function renderCurrentPage() {
     const placeholderHeight = getPlaceholderHeight(currentPage);
     const boxesForPage = boxesByPage.get(currentPage) ?? [];
-    return /* @__PURE__ */ jsx22(
+    return /* @__PURE__ */ jsx25(
       "div",
       {
         ref: (el) => registerPageRef(currentPage, el),
         "data-page-num": currentPage,
         className: "flex justify-center",
-        children: /* @__PURE__ */ jsxs12("div", { style: { position: "relative" }, children: [
-          /* @__PURE__ */ jsx22(
+        children: /* @__PURE__ */ jsxs13("div", { style: { position: "relative" }, children: [
+          /* @__PURE__ */ jsx25(
             Page,
             {
               pageNumber: currentPage,
@@ -2825,12 +3203,12 @@ var PdfDocument = ({
               className: "shadow-sm",
               renderTextLayer: enableTextLayer,
               renderAnnotationLayer: false,
-              loading: /* @__PURE__ */ jsx22(
+              loading: /* @__PURE__ */ jsx25(
                 "div",
                 {
                   className: "flex items-center justify-center bg-white",
                   style: { width: pageWidth, height: placeholderHeight },
-                  children: /* @__PURE__ */ jsxs12(Typography, { variant: "body-sm", className: "text-secondary", children: [
+                  children: /* @__PURE__ */ jsxs13(Typography, { variant: "body-sm", className: "text-secondary", children: [
                     "Loading page ",
                     currentPage,
                     "..."
@@ -2839,7 +3217,7 @@ var PdfDocument = ({
               )
             }
           ),
-          /* @__PURE__ */ jsx22(
+          /* @__PURE__ */ jsx25(
             BoundingBoxOverlay,
             {
               boxes: boxesForPage,
@@ -2862,7 +3240,7 @@ var PdfDocument = ({
       const shouldRender = visiblePages.has(pageNum);
       const placeholderHeight = getPlaceholderHeight(pageNum);
       const boxesForPage = boxesByPage.get(pageNum) ?? [];
-      return /* @__PURE__ */ jsx22(
+      return /* @__PURE__ */ jsx25(
         "div",
         {
           ref: (el) => registerPageRef(pageNum, el),
@@ -2871,8 +3249,8 @@ var PdfDocument = ({
           style: {
             minHeight: shouldRender ? void 0 : placeholderHeight
           },
-          children: shouldRender ? /* @__PURE__ */ jsxs12("div", { style: { position: "relative" }, children: [
-            /* @__PURE__ */ jsx22(
+          children: shouldRender ? /* @__PURE__ */ jsxs13("div", { style: { position: "relative" }, children: [
+            /* @__PURE__ */ jsx25(
               Page,
               {
                 pageNumber: pageNum,
@@ -2880,12 +3258,12 @@ var PdfDocument = ({
                 className: "shadow-sm",
                 renderTextLayer: enableTextLayer,
                 renderAnnotationLayer: false,
-                loading: /* @__PURE__ */ jsx22(
+                loading: /* @__PURE__ */ jsx25(
                   "div",
                   {
                     className: "flex items-center justify-center bg-white",
                     style: { width: pageWidth, height: placeholderHeight },
-                    children: /* @__PURE__ */ jsxs12(Typography, { variant: "body-sm", className: "text-secondary", children: [
+                    children: /* @__PURE__ */ jsxs13(Typography, { variant: "body-sm", className: "text-secondary", children: [
                       "Loading page ",
                       pageNum,
                       "..."
@@ -2894,7 +3272,7 @@ var PdfDocument = ({
                 )
               }
             ),
-            /* @__PURE__ */ jsx22(
+            /* @__PURE__ */ jsx25(
               BoundingBoxOverlay,
               {
                 boxes: boxesForPage,
@@ -2906,7 +3284,7 @@ var PdfDocument = ({
                 onBoxMouseLeave
               }
             )
-          ] }) : /* @__PURE__ */ jsx22(
+          ] }) : /* @__PURE__ */ jsx25(
             "div",
             {
               className: "flex items-center justify-center bg-white shadow-sm",
@@ -2914,7 +3292,7 @@ var PdfDocument = ({
                 width: pageWidth,
                 height: placeholderHeight
               },
-              children: /* @__PURE__ */ jsxs12(Typography, { variant: "body-sm", className: "text-secondary", children: [
+              children: /* @__PURE__ */ jsxs13(Typography, { variant: "body-sm", className: "text-secondary", children: [
                 "Page ",
                 pageNum
               ] })
@@ -2926,16 +3304,16 @@ var PdfDocument = ({
     });
   }
   if (!file) {
-    return /* @__PURE__ */ jsx22("div", { className: "flex items-center justify-center h-64", children: /* @__PURE__ */ jsx22(Typography, { variant: "body-md", className: "text-secondary", children: "No PDF available" }) });
+    return /* @__PURE__ */ jsx25("div", { className: "flex items-center justify-center h-64", children: /* @__PURE__ */ jsx25(Typography, { variant: "body-md", className: "text-secondary", children: "No PDF available" }) });
   }
-  return /* @__PURE__ */ jsx22(
+  return /* @__PURE__ */ jsx25(
     Document,
     {
       file,
       onLoadSuccess: handleDocumentLoadSuccess,
       onLoadError,
-      loading: /* @__PURE__ */ jsx22("div", { className: "flex items-center justify-center h-64", children: /* @__PURE__ */ jsx22(Typography, { variant: "body-md", className: "text-secondary", children: "Rendering PDF..." }) }),
-      error: /* @__PURE__ */ jsx22("div", { className: "flex items-center justify-center h-64", children: /* @__PURE__ */ jsx22(Typography, { variant: "body-md", className: "text-error", children: "Failed to render PDF" }) }),
+      loading: /* @__PURE__ */ jsx25("div", { className: "flex items-center justify-center h-64", children: /* @__PURE__ */ jsx25(Typography, { variant: "body-md", className: "text-secondary", children: "Rendering PDF..." }) }),
+      error: /* @__PURE__ */ jsx25("div", { className: "flex items-center justify-center h-64", children: /* @__PURE__ */ jsx25(Typography, { variant: "body-md", className: "text-error", children: "Failed to render PDF" }) }),
       className: "flex flex-col items-center p-4 min-w-fit",
       children: numPages > 0 && pageWidth > 0 && (viewMode === "single" ? renderCurrentPage() : renderPagesWithVirtualization())
     }
@@ -2944,19 +3322,19 @@ var PdfDocument = ({
 PdfDocument.displayName = "PdfDocument";
 // src/components/pdf-viewer/components/PdfHeader.tsx
-import { jsx as jsx23, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx26, jsxs as jsxs14 } from "react/jsx-runtime";
 var PdfHeader = ({
   title,
   onDownload,
   onPrint
 }) => {
-  return /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs14(
     "div",
     {
       className: "flex items-center justify-between gap-4 px-4 py-1",
       style: { background: "#B5B5B5" },
       children: [
-        /* @__PURE__ */ jsx23("div", { className: "flex-shrink min-w-0", children: /* @__PURE__ */ jsx23(
+        /* @__PURE__ */ jsx26("div", { className: "flex-shrink min-w-0", children: /* @__PURE__ */ jsx26(
           Typography,
           {
             variant: "label-md-bold",
@@ -2965,25 +3343,25 @@ var PdfHeader = ({
             children: title || "Untitled Document"
           }
         ) }),
-        /* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-2 flex-shrink-0", children: [
-          /* @__PURE__ */ jsx23(
+        /* @__PURE__ */ jsxs14("div", { className: "flex items-center gap-2 flex-shrink-0", children: [
+          /* @__PURE__ */ jsx26(
             "button",
             {
               onClick: onDownload,
               className: "p-1 hover:bg-neutral-500 rounded transition-colors",
               "aria-label": "Download PDF",
               type: "button",
-              children: /* @__PURE__ */ jsx23(DownloadIcon, { variant: "dark", size: 16 })
+              children: /* @__PURE__ */ jsx26(DownloadIcon, { variant: "dark", size: 16 })
             }
           ),
-          /* @__PURE__ */ jsx23(
+          /* @__PURE__ */ jsx26(
             "button",
             {
               onClick: onPrint,
               className: "p-1 hover:bg-neutral-500 rounded transition-colors",
               "aria-label": "Print PDF",
               type: "button",
-              children: /* @__PURE__ */ jsx23(PrintIcon, { variant: "dark", size: 16 })
+              children: /* @__PURE__ */ jsx26(PrintIcon, { variant: "dark", size: 16 })
             }
           )
         ] })
@@ -2994,12 +3372,12 @@ var PdfHeader = ({
 PdfHeader.displayName = "PdfHeader";
 // src/components/pdf-viewer/hooks/useContainerWidth.ts
-import * as React22 from "react";
+import * as React25 from "react";
 function useContainerWidth(padding = 32) {
-  const [containerWidth, setContainerWidth] = React22.useState(0);
-  const containerRef = React22.useRef(null);
-  const lastWidthRef = React22.useRef(0);
-  React22.useEffect(() => {
+  const [containerWidth, setContainerWidth] = React25.useState(0);
+  const containerRef = React25.useRef(null);
+  const lastWidthRef = React25.useRef(0);
+  React25.useEffect(() => {
     const element = containerRef.current;
     if (!element) return;
     const resizeObserver = new ResizeObserver((entries) => {
@@ -3023,9 +3401,9 @@ function useContainerWidth(padding = 32) {
 }
 // src/components/pdf-viewer/hooks/usePdfDownload.ts
-import * as React23 from "react";
+import * as React26 from "react";
 function usePdfDownload(file, title) {
-  const download = React23.useCallback(async () => {
+  const download = React26.useCallback(async () => {
     if (!file) return;
     try {
       let blob;
@@ -3057,11 +3435,11 @@ function usePdfDownload(file, title) {
 }
 // src/components/pdf-viewer/hooks/usePdfPrint.ts
-import * as React24 from "react";
+import * as React27 from "react";
 function usePdfPrint(file) {
-  const [printBlobUrl, setPrintBlobUrl] = React24.useState(null);
-  const printFrameRef = React24.useRef(null);
-  const preparePrint = React24.useCallback(async () => {
+  const [printBlobUrl, setPrintBlobUrl] = React27.useState(null);
+  const printFrameRef = React27.useRef(null);
+  const preparePrint = React27.useCallback(async () => {
     if (!file) return;
     try {
       let blob;
@@ -3077,14 +3455,14 @@ function usePdfPrint(file) {
       console.error("Failed to prepare PDF for printing:", error);
     }
   }, [file]);
-  React24.useEffect(() => {
+  React27.useEffect(() => {
     return () => {
       if (printBlobUrl) {
         URL.revokeObjectURL(printBlobUrl);
       }
     };
   }, [printBlobUrl]);
-  const print = React24.useCallback(() => {
+  const print = React27.useCallback(() => {
     if (printFrameRef.current?.contentWindow) {
       printFrameRef.current.contentWindow.print();
     }
@@ -3093,7 +3471,7 @@ function usePdfPrint(file) {
 }
 // src/components/pdf-viewer/hooks/usePdfScroll.ts
-import * as React25 from "react";
+import * as React28 from "react";
 function usePdfScroll({
   containerRef,
   numPages,
@@ -3104,30 +3482,30 @@ function usePdfScroll({
   effectiveWidth,
   viewportBuffer
 }) {
-  const [internalPage, setInternalPage] = React25.useState(1);
+  const [internalPage, setInternalPage] = React28.useState(1);
   const isControlled = scrollTo !== void 0;
   const currentPage = isControlled ? scrollTo.page : internalPage;
-  const scrollOperationRef = React25.useRef({
+  const scrollOperationRef = React28.useRef({
     isProgrammatic: false,
     targetPage: null,
     lastReportedPage: 1,
     notifyOnComplete: false
   });
-  const [visibleRange, setVisibleRange] = React25.useState({
+  const [visibleRange, setVisibleRange] = React28.useState({
     start: 1,
     end: Math.min(1 + viewportBuffer, numPages || 1 + viewportBuffer)
   });
-  const visiblePages = React25.useMemo(() => {
+  const visiblePages = React28.useMemo(() => {
     const pages = /* @__PURE__ */ new Set();
     for (let i = visibleRange.start; i <= visibleRange.end; i++) {
       pages.add(i);
     }
     return pages;
   }, [visibleRange.start, visibleRange.end]);
-  const observerRef = React25.useRef(null);
-  const intersectionRatiosRef = React25.useRef(/* @__PURE__ */ new Map());
-  const pageRefsMapRef = React25.useRef(/* @__PURE__ */ new Map());
-  const cumulativeOffsets = React25.useMemo(() => {
+  const observerRef = React28.useRef(null);
+  const intersectionRatiosRef = React28.useRef(/* @__PURE__ */ new Map());
+  const pageRefsMapRef = React28.useRef(/* @__PURE__ */ new Map());
+  const cumulativeOffsets = React28.useMemo(() => {
     if (!pageDimensions?.size) return null;
     const offsets = [CONTAINER_PADDING];
     let cumulative = CONTAINER_PADDING;
@@ -3139,7 +3517,7 @@ function usePdfScroll({
     }
     return offsets;
   }, [pageDimensions, effectiveWidth]);
-  const calculatePageOffset = React25.useCallback(
+  const calculatePageOffset = React28.useCallback(
     (pageNum) => {
       if (cumulativeOffsets && pageNum <= cumulativeOffsets.length) {
         return cumulativeOffsets[pageNum - 1];
@@ -3154,11 +3532,11 @@ function usePdfScroll({
     },
     [cumulativeOffsets, pageDimensions, effectiveWidth]
   );
-  const onPageChangeRef = React25.useRef(onPageChange);
-  React25.useEffect(() => {
+  const onPageChangeRef = React28.useRef(onPageChange);
+  React28.useEffect(() => {
     onPageChangeRef.current = onPageChange;
   }, [onPageChange]);
-  const updatePage = React25.useCallback(
+  const updatePage = React28.useCallback(
     (pageNum) => {
       scrollOperationRef.current.lastReportedPage = pageNum;
       if (isControlled) {
@@ -3170,7 +3548,7 @@ function usePdfScroll({
     [isControlled]
     // Removed onPageChange - now uses ref
   );
-  const onProgrammaticScrollComplete = React25.useCallback((pageNum) => {
+  const onProgrammaticScrollComplete = React28.useCallback((pageNum) => {
     const shouldNotify = scrollOperationRef.current.notifyOnComplete;
     scrollOperationRef.current.isProgrammatic = false;
     scrollOperationRef.current.targetPage = null;
@@ -3180,7 +3558,7 @@ function usePdfScroll({
       onPageChangeRef.current?.(pageNum);
     }
   }, []);
-  const scrollToPage = React25.useCallback(
+  const scrollToPage = React28.useCallback(
     (pageNum) => {
       const container = containerRef.current;
       if (!container || !pageDimensions?.size) return;
@@ -3211,7 +3589,7 @@ function usePdfScroll({
       onProgrammaticScrollComplete
     ]
   );
-  const scrollToPosition = React25.useCallback(
+  const scrollToPosition = React28.useCallback(
     (target) => {
       const container = containerRef.current;
       if (!container || !pageDimensions?.size) return;
@@ -3252,7 +3630,7 @@ function usePdfScroll({
       onProgrammaticScrollComplete
     ]
   );
-  const handlePageChange = React25.useCallback(
+  const handlePageChange = React28.useCallback(
     (pageNum) => {
       const clampedPage = Math.max(1, Math.min(pageNum, numPages));
       scrollOperationRef.current.lastReportedPage = clampedPage;
@@ -3266,12 +3644,12 @@ function usePdfScroll({
     },
     [numPages, scrollToPage, isControlled, onPageChange]
   );
-  const updatePageRef = React25.useRef(updatePage);
-  React25.useEffect(() => {
+  const updatePageRef = React28.useRef(updatePage);
+  React28.useEffect(() => {
     updatePageRef.current = updatePage;
   }, [updatePage]);
-  const lastBufferRef = React25.useRef({ start: 1, end: 1 + viewportBuffer });
-  React25.useEffect(() => {
+  const lastBufferRef = React28.useRef({ start: 1, end: 1 + viewportBuffer });
+  React28.useEffect(() => {
     const container = containerRef.current;
     if (!container) return;
     const observer = new IntersectionObserver(
@@ -3331,7 +3709,7 @@ function usePdfScroll({
       ratiosMap.clear();
     };
   }, [containerRef, numPages, viewportBuffer]);
-  const observePage = React25.useCallback(
+  const observePage = React28.useCallback(
     (pageNum, element) => {
       const prevElement = pageRefsMapRef.current.get(pageNum);
       if (element) {
@@ -3352,7 +3730,7 @@ function usePdfScroll({
     },
     []
   );
-  React25.useEffect(() => {
+  React28.useEffect(() => {
     const container = containerRef.current;
     if (!container) return;
     const handleUserScroll = () => {
@@ -3410,9 +3788,9 @@ function usePdfScroll({
       }
     };
   }, [containerRef, onProgrammaticScrollComplete]);
-  const lastScrollTargetRef = React25.useRef(null);
-  const prevEffectiveWidthRef = React25.useRef(effectiveWidth);
-  React25.useEffect(() => {
+  const lastScrollTargetRef = React28.useRef(null);
+  const prevEffectiveWidthRef = React28.useRef(effectiveWidth);
+  React28.useEffect(() => {
     if (prevEffectiveWidthRef.current !== effectiveWidth) {
       prevEffectiveWidthRef.current = effectiveWidth;
       const lastScrollTarget = lastScrollTargetRef.current;
@@ -3421,7 +3799,7 @@ function usePdfScroll({
       }
     }
   }, [effectiveWidth]);
-  React25.useEffect(() => {
+  React28.useEffect(() => {
     if (!isControlled || !scrollTo || numPages <= 0) return;
     if (!pageDimensions?.size) return;
     const lastScrollTarget = lastScrollTargetRef.current;
@@ -3454,7 +3832,7 @@ function usePdfScroll({
     pageDimensions,
     effectiveWidth
   ]);
-  React25.useEffect(() => {
+  React28.useEffect(() => {
     const pageRefs = pageRefsMapRef.current;
     const ratios = intersectionRatiosRef.current;
     for (const pageNum of pageRefs.keys()) {
@@ -3478,14 +3856,14 @@ function usePdfScroll({
 }
 // src/components/pdf-viewer/hooks/useZoomControl.ts
-import * as React26 from "react";
+import * as React29 from "react";
 function useZoomControl({
   containerRef,
   initialZoom = PDF_ZOOM.DEFAULT
 }) {
-  const [zoom, setZoom] = React26.useState(initialZoom);
-  const scrollRatioRef = React26.useRef({ x: 0.5, y: 0 });
-  const handleZoomChange = React26.useCallback(
+  const [zoom, setZoom] = React29.useState(initialZoom);
+  const scrollRatioRef = React29.useRef({ x: 0.5, y: 0 });
+  const handleZoomChange = React29.useCallback(
     (newZoom) => {
       const container = containerRef.current;
       if (container) {
@@ -3506,7 +3884,7 @@ function useZoomControl({
     },
     [containerRef]
   );
-  React26.useEffect(() => {
+  React29.useEffect(() => {
     const container = containerRef.current;
     if (!container) return;
     requestAnimationFrame(() => {
@@ -3531,9 +3909,9 @@ function initializePdfWorker(workerUrl) {
 }
 // src/components/pdf-viewer/index.tsx
-import { jsx as jsx24, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs15 } from "react/jsx-runtime";
 var DEFAULT_VIEWPORT_BUFFER = 1;
-var PdfViewer = React27.forwardRef(
+var PdfViewer = React30.forwardRef(
   ({
     file,
     title,
@@ -3560,15 +3938,15 @@ var PdfViewer = React27.forwardRef(
     className,
     ...props
   }, ref) => {
-    const [numPages, setNumPages] = React27.useState(0);
-    const [pageDimensions, setPageDimensions] = React27.useState(null);
+    const [numPages, setNumPages] = React30.useState(0);
+    const [pageDimensions, setPageDimensions] = React30.useState(null);
     const { containerWidth, containerRef } = useContainerWidth();
     const { zoom, handleZoomChange } = useZoomControl({ containerRef });
     const { printFrameRef, printBlobUrl, preparePrint, print } = usePdfPrint(file);
     const download = usePdfDownload(file, title);
     const baseWidth = Math.min(pageWidth || containerWidth, 800);
     const effectiveWidth = Math.round(baseWidth * (zoom / 100));
-    const handleDimensionsLoaded = React27.useCallback(
+    const handleDimensionsLoaded = React30.useCallback(
       (dimensions) => {
         setPageDimensions(dimensions);
         onDimensionsReady?.(dimensions);
@@ -3585,7 +3963,7 @@ var PdfViewer = React27.forwardRef(
       effectiveWidth,
       viewportBuffer
     });
-    const handleLoadSuccess = React27.useCallback(
+    const handleLoadSuccess = React30.useCallback(
       async (pages) => {
         setNumPages(pages);
         onLoadSuccess?.(pages);
@@ -3593,28 +3971,28 @@ var PdfViewer = React27.forwardRef(
       },
       [onLoadSuccess, preparePrint]
     );
-    const handleDownload = React27.useCallback(() => {
+    const handleDownload = React30.useCallback(() => {
       if (onDownload) {
         onDownload();
         return;
       }
       download();
     }, [onDownload, download]);
-    const handlePrint = React27.useCallback(() => {
+    const handlePrint = React30.useCallback(() => {
       if (onPrint) {
         onPrint();
         return;
       }
       print();
     }, [onPrint, print]);
-    return /* @__PURE__ */ jsxs14(
+    return /* @__PURE__ */ jsxs15(
       "div",
       {
         ref,
         className: cn("h-full flex flex-col", className),
         ...props,
         children: [
-          printBlobUrl && /* @__PURE__ */ jsx24(
+          printBlobUrl && /* @__PURE__ */ jsx27(
             "iframe",
             {
               ref: printFrameRef,
@@ -3623,7 +4001,7 @@ var PdfViewer = React27.forwardRef(
               title: "PDF for printing"
             }
           ),
-          /* @__PURE__ */ jsx24(
+          /* @__PURE__ */ jsx27(
             PdfHeader,
             {
               title,
@@ -3631,8 +4009,8 @@ var PdfViewer = React27.forwardRef(
               onPrint: handlePrint
             }
           ),
-          /* @__PURE__ */ jsxs14("div", { className: "flex-1 flex overflow-hidden min-h-0", children: [
-            /* @__PURE__ */ jsx24(CustomScrollbar, { containerRef, children: /* @__PURE__ */ jsx24(
+          /* @__PURE__ */ jsxs15("div", { className: "flex-1 flex overflow-hidden min-h-0", children: [
+            /* @__PURE__ */ jsx27(CustomScrollbar, { containerRef, children: /* @__PURE__ */ jsx27(
               PdfDocument,
               {
                 file,
@@ -3656,7 +4034,7 @@ var PdfViewer = React27.forwardRef(
                 onBoxMouseLeave
               }
             ) }),
-            showControls && /* @__PURE__ */ jsx24(
+            showControls && /* @__PURE__ */ jsx27(
               PdfControls,
               {
                 currentPage,
@@ -3677,10 +4055,10 @@ var PdfViewer = React27.forwardRef(
 PdfViewer.displayName = "PdfViewer";
 // src/components/ui/tabs.tsx
-import * as React28 from "react";
-import { cva as cva11 } from "class-variance-authority";
-import { jsx as jsx25 } from "react/jsx-runtime";
-var tabsVariants = cva11(
+import * as React31 from "react";
+import { cva as cva12 } from "class-variance-authority";
+import { jsx as jsx28 } from "react/jsx-runtime";
+var tabsVariants = cva12(
   "inline-flex items-center justify-start whitespace-nowrap transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-interactive focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 h-10",
   {
     variants: {
@@ -3693,17 +4071,17 @@ var tabsVariants = cva11(
     }
   }
 );
-var TabsContext = React28.createContext(
+var TabsContext = React31.createContext(
   void 0
 );
 function useTabsContext() {
-  const context = React28.useContext(TabsContext);
+  const context = React31.useContext(TabsContext);
   if (!context) {
     throw new Error("Tabs components must be used within a Tabs provider");
   }
   return context;
 }
-var Tabs = React28.forwardRef((props, ref) => {
+var Tabs = React31.forwardRef((props, ref) => {
   const {
     className,
     value,
@@ -3712,7 +4090,7 @@ var Tabs = React28.forwardRef((props, ref) => {
     children,
     ...restProps
   } = props;
-  const contextValue = React28.useMemo(
+  const contextValue = React31.useMemo(
     () => ({
       activeTab: value,
       setActiveTab: onValueChange,
@@ -3720,13 +4098,13 @@ var Tabs = React28.forwardRef((props, ref) => {
     }),
     [value, onValueChange, variant]
   );
-  return /* @__PURE__ */ jsx25(TabsContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx25("div", { ref, className: cn("w-full", className), ...restProps, children }) });
+  return /* @__PURE__ */ jsx28(TabsContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx28("div", { ref, className: cn("w-full", className), ...restProps, children }) });
 });
 Tabs.displayName = "Tabs";
-var TabsList = React28.forwardRef(
+var TabsList = React31.forwardRef(
   (props, ref) => {
     const { className, children, ...restProps } = props;
-    return /* @__PURE__ */ jsx25(
+    return /* @__PURE__ */ jsx28(
       "div",
       {
         ref,
@@ -3742,7 +4120,7 @@ TabsList.displayName = "TabsList";
 var getTabTypographyStyles = (isActive) => ({
   font: isActive ? "var(--typography-label-sm-bold)" : "var(--typography-label-sm-regular)"
 });
-var TabsTrigger = React28.forwardRef(
+var TabsTrigger = React31.forwardRef(
   (props, ref) => {
     const { className, value, disabled, style, children, ...restProps } = props;
     const { activeTab, setActiveTab, variant } = useTabsContext();
@@ -3750,22 +4128,22 @@ var TabsTrigger = React28.forwardRef(
       throw new Error("TabsTrigger must have a value prop");
     }
     const isActive = activeTab === value;
-    const tokenStyles = React28.useMemo(
+    const tokenStyles = React31.useMemo(
       () => ({
         ...getTabTypographyStyles(isActive),
         ...style
       }),
       [isActive, style]
     );
-    const triggerClassName = React28.useMemo(
+    const triggerClassName = React31.useMemo(
       () => cn(tabsVariants({ variant }), className),
       [variant, className]
     );
-    const handleClick = React28.useCallback(() => {
+    const handleClick = React31.useCallback(() => {
       if (disabled) return;
       setActiveTab(value);
     }, [disabled, setActiveTab, value]);
-    return /* @__PURE__ */ jsx25(
+    return /* @__PURE__ */ jsx28(
       "button",
       {
         ref,
@@ -3779,13 +4157,13 @@ var TabsTrigger = React28.forwardRef(
         disabled,
         onClick: handleClick,
         ...restProps,
-        children: /* @__PURE__ */ jsx25("span", { className: "pl-3 pr-6 py-2", children })
+        children: /* @__PURE__ */ jsx28("span", { className: "pl-3 pr-6 py-2", children })
       }
     );
   }
 );
 TabsTrigger.displayName = "TabsTrigger";
-var TabsContent = React28.forwardRef(
+var TabsContent = React31.forwardRef(
   (props, ref) => {
     const { className, value, children, ...restProps } = props;
     const { activeTab } = useTabsContext();
@@ -3796,7 +4174,7 @@ var TabsContent = React28.forwardRef(
     if (!isActive) {
       return null;
     }
-    return /* @__PURE__ */ jsx25(
+    return /* @__PURE__ */ jsx28(
       "div",
       {
         ref,
@@ -3814,11 +4192,11 @@ var TabsContent = React28.forwardRef(
 TabsContent.displayName = "TabsContent";
 // src/components/ui/dropdown-menu.tsx
-import * as React29 from "react";
+import * as React32 from "react";
 import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
-import { jsx as jsx26, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx29, jsxs as jsxs16 } from "react/jsx-runtime";
 var DropdownMenu = DropdownMenuPrimitive.Root;
-var DropdownMenuTrigger = React29.forwardRef(({ className, icon, children, ...props }, ref) => /* @__PURE__ */ jsxs15(
+var DropdownMenuTrigger = React32.forwardRef(({ className, icon, children, ...props }, ref) => /* @__PURE__ */ jsxs16(
   DropdownMenuPrimitive.Trigger,
   {
     ref,
@@ -3828,7 +4206,7 @@ var DropdownMenuTrigger = React29.forwardRef(({ className, icon, children, ...pr
     ),
     ...props,
     children: [
-      icon || /* @__PURE__ */ jsx26(MoreMenuIcon, {}),
+      icon || /* @__PURE__ */ jsx29(MoreMenuIcon, {}),
       children
     ]
   }
@@ -3838,7 +4216,7 @@ var DropdownMenuGroup = DropdownMenuPrimitive.Group;
 var DropdownMenuPortal = DropdownMenuPrimitive.Portal;
 var DropdownMenuSub = DropdownMenuPrimitive.Sub;
 var DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
-var DropdownMenuSubTrigger = React29.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs15(
+var DropdownMenuSubTrigger = React32.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs16(
   DropdownMenuPrimitive.SubTrigger,
   {
     ref,
@@ -3851,12 +4229,12 @@ var DropdownMenuSubTrigger = React29.forwardRef(({ className, inset, children, .
     ...props,
     children: [
       children,
-      /* @__PURE__ */ jsx26(ArrowRightIcon, { className: "ml-auto" })
+      /* @__PURE__ */ jsx29(ArrowRightIcon, { className: "ml-auto" })
     ]
   }
 ));
 DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
-var DropdownMenuSubContent = React29.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx26(
+var DropdownMenuSubContent = React32.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx29(
   DropdownMenuPrimitive.SubContent,
   {
     ref,
@@ -3868,7 +4246,7 @@ var DropdownMenuSubContent = React29.forwardRef(({ className, ...props }, ref) =
   }
 ));
 DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
-var DropdownMenuContent = React29.forwardRef(({ className, sideOffset = 4, align = "end", ...props }, ref) => /* @__PURE__ */ jsx26(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx26(
+var DropdownMenuContent = React32.forwardRef(({ className, sideOffset = 4, align = "end", ...props }, ref) => /* @__PURE__ */ jsx29(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx29(
   DropdownMenuPrimitive.Content,
   {
     ref,
@@ -3882,7 +4260,7 @@ var DropdownMenuContent = React29.forwardRef(({ className, sideOffset = 4, align
   }
 ) }));
 DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
-var DropdownMenuItem = React29.forwardRef(({ className, inset, style, ...props }, ref) => /* @__PURE__ */ jsx26(
+var DropdownMenuItem = React32.forwardRef(({ className, inset, style, ...props }, ref) => /* @__PURE__ */ jsx29(
   DropdownMenuPrimitive.Item,
   {
     ref,
@@ -3899,7 +4277,7 @@ var DropdownMenuItem = React29.forwardRef(({ className, inset, style, ...props }
   }
 ));
 DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
-var DropdownMenuCheckboxItem = React29.forwardRef(({ className, children, style, checked, ...props }, ref) => /* @__PURE__ */ jsxs15(
+var DropdownMenuCheckboxItem = React32.forwardRef(({ className, children, style, checked, ...props }, ref) => /* @__PURE__ */ jsxs16(
   DropdownMenuPrimitive.CheckboxItem,
   {
     ref,
@@ -3914,7 +4292,7 @@ var DropdownMenuCheckboxItem = React29.forwardRef(({ className, children, style,
     },
     ...props,
     children: [
-      /* @__PURE__ */ jsx26(
+      /* @__PURE__ */ jsx29(
         Checkbox,
         {
           checked: checked === true,
@@ -3922,12 +4300,12 @@ var DropdownMenuCheckboxItem = React29.forwardRef(({ className, children, style,
           "aria-hidden": "true"
         }
       ),
-      /* @__PURE__ */ jsx26("span", { className: "flex-1", children })
+      /* @__PURE__ */ jsx29("span", { className: "flex-1", children })
     ]
   }
 ));
 DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
-var DropdownMenuRadioItem = React29.forwardRef(({ className, children, style, ...props }, ref) => /* @__PURE__ */ jsxs15(
+var DropdownMenuRadioItem = React32.forwardRef(({ className, children, style, ...props }, ref) => /* @__PURE__ */ jsxs16(
   DropdownMenuPrimitive.RadioItem,
   {
     ref,
@@ -3941,13 +4319,13 @@ var DropdownMenuRadioItem = React29.forwardRef(({ className, children, style, ..
     },
     ...props,
     children: [
-      /* @__PURE__ */ jsx26("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx26(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx26("span", { className: "h-2 w-2 rounded-full bg-current" }) }) }),
+      /* @__PURE__ */ jsx29("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx29(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx29("span", { className: "h-2 w-2 rounded-full bg-current" }) }) }),
       children
     ]
   }
 ));
 DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
-var DropdownMenuLabel = React29.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx26(
+var DropdownMenuLabel = React32.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx29(
   DropdownMenuPrimitive.Label,
   {
     ref,
@@ -3960,7 +4338,7 @@ var DropdownMenuLabel = React29.forwardRef(({ className, inset, ...props }, ref)
   }
 ));
 DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
-var DropdownMenuSeparator = React29.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx26(
+var DropdownMenuSeparator = React32.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx29(
   DropdownMenuPrimitive.Separator,
   {
     ref,
@@ -3973,7 +4351,7 @@ var DropdownMenuShortcut = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ jsx26(
+  return /* @__PURE__ */ jsx29(
     "span",
     {
       className: cn("ml-auto text-xs tracking-widest opacity-60", className),
@@ -3984,21 +4362,21 @@ var DropdownMenuShortcut = ({
 DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
 // src/components/ui/charts/chart-legend.tsx
-import { jsx as jsx27, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx30, jsxs as jsxs17 } from "react/jsx-runtime";
 function ChartLegend({
   items,
   x = 0,
   y = 550,
   className = ""
 }) {
-  return /* @__PURE__ */ jsx27("foreignObject", { x, y, width: "100%", height: "40", children: /* @__PURE__ */ jsx27(
+  return /* @__PURE__ */ jsx30("foreignObject", { x, y, width: "100%", height: "40", children: /* @__PURE__ */ jsx30(
     "div",
     {
       className: `flex justify-center items-center gap-6 ${className}`,
       style: { height: "100%" },
-      children: items.map(({ key, color, label }) => /* @__PURE__ */ jsxs16("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx27("div", { className: "w-3 h-3", style: { backgroundColor: color } }),
-        /* @__PURE__ */ jsx27(Typography, { variant: "body-xs", children: label || key })
+      children: items.map(({ key, color, label }) => /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx30("div", { className: "w-3 h-3", style: { backgroundColor: color } }),
+        /* @__PURE__ */ jsx30(Typography, { variant: "body-xs", children: label || key })
       ] }, key))
     }
   ) });
@@ -4116,12 +4494,12 @@ var formatLargeNumber = (value) => {
 };
 // src/components/ui/charts/chart-labels.tsx
-import { jsx as jsx28 } from "react/jsx-runtime";
+import { jsx as jsx31 } from "react/jsx-runtime";
 var createCustomXAxisLabel = (text, yOffset = 40) => {
   const CustomXAxisLabel = ({ viewBox }) => {
     if (!viewBox) return null;
     const { x, y, width } = viewBox;
-    return /* @__PURE__ */ jsx28("g", { children: /* @__PURE__ */ jsx28("foreignObject", { x, y: y + yOffset, width, height: 20, children: /* @__PURE__ */ jsx28("div", { className: "flex justify-center w-full", children: /* @__PURE__ */ jsx28(Typography, { variant: "label-xs-bold", className: "text-secondary", children: text }) }) }) });
+    return /* @__PURE__ */ jsx31("g", { children: /* @__PURE__ */ jsx31("foreignObject", { x, y: y + yOffset, width, height: 20, children: /* @__PURE__ */ jsx31("div", { className: "flex justify-center w-full", children: /* @__PURE__ */ jsx31(Typography, { variant: "label-xs-bold", className: "text-secondary", children: text }) }) }) });
   };
   CustomXAxisLabel.displayName = "CustomXAxisLabel";
   return CustomXAxisLabel;
@@ -4131,7 +4509,7 @@ var createCustomYAxisLabel = (text, leftMargin) => {
     if (!viewBox) return null;
     const { x, y, height } = viewBox;
     const offset = leftMargin ? leftMargin + 10 : 110;
-    return /* @__PURE__ */ jsx28("g", { children: /* @__PURE__ */ jsx28("foreignObject", { x: x - offset, y, width: 100, height, children: /* @__PURE__ */ jsx28("div", { className: "flex items-center justify-center h-full transform -rotate-90 whitespace-nowrap", children: /* @__PURE__ */ jsx28(Typography, { variant: "label-xs-bold", className: "text-secondary", children: text }) }) }) });
+    return /* @__PURE__ */ jsx31("g", { children: /* @__PURE__ */ jsx31("foreignObject", { x: x - offset, y, width: 100, height, children: /* @__PURE__ */ jsx31("div", { className: "flex items-center justify-center h-full transform -rotate-90 whitespace-nowrap", children: /* @__PURE__ */ jsx31(Typography, { variant: "label-xs-bold", className: "text-secondary", children: text }) }) }) });
   };
   CustomYAxisLabel.displayName = "CustomYAxisLabel";
   return CustomYAxisLabel;
@@ -4140,14 +4518,14 @@ var createCustomYAxisRightLabel = (text) => {
   const CustomYAxisRightLabel = ({ viewBox }) => {
     if (!viewBox) return null;
     const { x, y, width, height } = viewBox;
-    return /* @__PURE__ */ jsx28("g", { children: /* @__PURE__ */ jsx28("foreignObject", { x: x + width - 70, y, width: 120, height, children: /* @__PURE__ */ jsx28("div", { className: "flex items-center justify-center h-full transform rotate-90 whitespace-nowrap", children: /* @__PURE__ */ jsx28(Typography, { variant: "label-xs-bold", className: "text-secondary", children: text }) }) }) });
+    return /* @__PURE__ */ jsx31("g", { children: /* @__PURE__ */ jsx31("foreignObject", { x: x + width - 70, y, width: 120, height, children: /* @__PURE__ */ jsx31("div", { className: "flex items-center justify-center h-full transform rotate-90 whitespace-nowrap", children: /* @__PURE__ */ jsx31(Typography, { variant: "label-xs-bold", className: "text-secondary", children: text }) }) }) });
   };
   CustomYAxisRightLabel.displayName = "CustomYAxisRightLabel";
   return CustomYAxisRightLabel;
 };
 var customXAxisTick = (props) => {
   const { x, y, payload } = props;
-  return /* @__PURE__ */ jsx28("g", { transform: `translate(${x},${y})`, children: /* @__PURE__ */ jsx28(
+  return /* @__PURE__ */ jsx31("g", { transform: `translate(${x},${y})`, children: /* @__PURE__ */ jsx31(
     "foreignObject",
     {
       x: -20,
@@ -4155,12 +4533,12 @@ var customXAxisTick = (props) => {
       width: 40,
       height: 20,
       style: { overflow: "visible" },
-      children: /* @__PURE__ */ jsx28(
+      children: /* @__PURE__ */ jsx31(
         "div",
         {
           className: "flex items-start justify-center h-full",
           style: { overflow: "visible" },
-          children: /* @__PURE__ */ jsx28(
+          children: /* @__PURE__ */ jsx31(
             Typography,
             {
               variant: "body-xs",
@@ -4175,7 +4553,7 @@ var customXAxisTick = (props) => {
 };
 var customXAxisTickRotated = (props) => {
   const { x, y, payload } = props;
-  return /* @__PURE__ */ jsx28("g", { transform: `translate(${x},${y})`, children: /* @__PURE__ */ jsx28(
+  return /* @__PURE__ */ jsx31("g", { transform: `translate(${x},${y})`, children: /* @__PURE__ */ jsx31(
     "text",
     {
       x: 0,
@@ -4194,25 +4572,25 @@ var customYAxisTick = (props) => {
   const { x, y, payload } = props;
   const text = String(payload.value);
   const estimatedWidth = Math.max(text.length * 8, 80);
-  return /* @__PURE__ */ jsx28(
+  return /* @__PURE__ */ jsx31(
     "foreignObject",
     {
       x: x - estimatedWidth + 5,
       y: y - 6,
       width: estimatedWidth,
       height: 15,
-      children: /* @__PURE__ */ jsx28("div", { className: "flex justify-end w-full", children: /* @__PURE__ */ jsx28(Typography, { variant: "body-xs", className: "text-secondary", children: payload.value }) })
+      children: /* @__PURE__ */ jsx31("div", { className: "flex justify-end w-full", children: /* @__PURE__ */ jsx31(Typography, { variant: "body-xs", className: "text-secondary", children: payload.value }) })
     }
   );
 };
 // src/components/ui/charts/chart-tooltip.tsx
-import { Fragment as Fragment2, jsx as jsx29, jsxs as jsxs17 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx32, jsxs as jsxs18 } from "react/jsx-runtime";
 function TooltipContainer({
   children,
   className = ""
 }) {
-  return /* @__PURE__ */ jsx29(
+  return /* @__PURE__ */ jsx32(
     "div",
     {
       className: `bg-light border border-subtle rounded p-2.5 text-dark ${className}`,
@@ -4226,10 +4604,10 @@ function TooltipItem({
   value,
   className = ""
 }) {
-  return /* @__PURE__ */ jsxs17(Fragment2, { children: [
-    /* @__PURE__ */ jsx29("br", {}),
-    /* @__PURE__ */ jsxs17(Typography, { variant: "label-sm", className, children: [
-      /* @__PURE__ */ jsx29(
+  return /* @__PURE__ */ jsxs18(Fragment2, { children: [
+    /* @__PURE__ */ jsx32("br", {}),
+    /* @__PURE__ */ jsxs18(Typography, { variant: "label-sm", className, children: [
+      /* @__PURE__ */ jsx32(
         "span",
         {
           className: "inline-block w-3 h-3 mr-1.5",
@@ -4247,9 +4625,9 @@ function GenericTooltip({
   items,
   className = ""
 }) {
-  return /* @__PURE__ */ jsxs17(TooltipContainer, { className, children: [
-    title && /* @__PURE__ */ jsx29(Typography, { variant: "label-sm-bold", children: title }),
-    items.map((item, index) => /* @__PURE__ */ jsx29(
+  return /* @__PURE__ */ jsxs18(TooltipContainer, { className, children: [
+    title && /* @__PURE__ */ jsx32(Typography, { variant: "label-sm-bold", children: title }),
+    items.map((item, index) => /* @__PURE__ */ jsx32(
       TooltipItem,
       {
         color: item.color,
@@ -4262,7 +4640,7 @@ function GenericTooltip({
 }
 // src/components/ui/charts/bar-chart.tsx
-import { forwardRef as forwardRef21 } from "react";
+import { forwardRef as forwardRef24 } from "react";
 import {
   BarChart as RechartsBarChart,
   Bar,
@@ -4271,8 +4649,8 @@ import {
   Tooltip as Tooltip2,
   ResponsiveContainer
 } from "recharts";
-import { jsx as jsx30, jsxs as jsxs18 } from "react/jsx-runtime";
-var BarChart = forwardRef21(
+import { jsx as jsx33, jsxs as jsxs19 } from "react/jsx-runtime";
+var BarChart = forwardRef24(
   ({
     data,
     xAxisKey,
@@ -4298,19 +4676,19 @@ var BarChart = forwardRef21(
     };
     const defaultLegendItems = showLegend && legendItems.length === 0 ? [{ key: yAxisKey, color: barColor, label: yAxisKey }] : legendItems;
     const hasData = data && data.length > 0;
-    return /* @__PURE__ */ jsxs18(
+    return /* @__PURE__ */ jsxs19(
       "div",
       {
         ref,
         className: `bg-light border border-subtle mx-6 ${className}`,
         children: [
-          /* @__PURE__ */ jsx30("div", { className: "flex items-center justify-between px-3 py-2 border-b border-subtle", children: /* @__PURE__ */ jsx30(Typography, { variant: "label-sm-bold", children: title }) }),
-          /* @__PURE__ */ jsx30("div", { className: "pt-2 px-2", children: hasData ? /* @__PURE__ */ jsx30(
+          /* @__PURE__ */ jsx33("div", { className: "flex items-center justify-between px-3 py-2 border-b border-subtle", children: /* @__PURE__ */ jsx33(Typography, { variant: "label-sm-bold", children: title }) }),
+          /* @__PURE__ */ jsx33("div", { className: "pt-2 px-2", children: hasData ? /* @__PURE__ */ jsx33(
             ResponsiveContainer,
             {
               width: "100%",
               height: CHART_CONSTANTS.STANDARD_HEIGHT,
-              children: /* @__PURE__ */ jsxs18(
+              children: /* @__PURE__ */ jsxs19(
                 RechartsBarChart,
                 {
                   data,
@@ -4322,7 +4700,7 @@ var BarChart = forwardRef21(
                   onClick: handleClick,
                   layout,
                   children: [
-                    /* @__PURE__ */ jsx30(
+                    /* @__PURE__ */ jsx33(
                       XAxis,
                       {
                         dataKey: xAxisKey,
@@ -4336,7 +4714,7 @@ var BarChart = forwardRef21(
                         label: xAxisLabel ? createCustomXAxisLabel(xAxisLabel, 80) : void 0
                       }
                     ),
-                    /* @__PURE__ */ jsx30(
+                    /* @__PURE__ */ jsx33(
                       YAxis,
                       {
                         axisLine: false,
@@ -4347,7 +4725,7 @@ var BarChart = forwardRef21(
                         type: yAxisType
                       }
                     ),
-                    /* @__PURE__ */ jsx30(
+                    /* @__PURE__ */ jsx33(
                       Tooltip2,
                       {
                         content: ({
@@ -4356,7 +4734,7 @@ var BarChart = forwardRef21(
                           label
                         }) => {
                           if (active && payload && payload.length) {
-                            return /* @__PURE__ */ jsx30(
+                            return /* @__PURE__ */ jsx33(
                               GenericTooltip,
                               {
                                 title: label?.toString(),
@@ -4372,7 +4750,7 @@ var BarChart = forwardRef21(
                         }
                       }
                     ),
-                    /* @__PURE__ */ jsx30(
+                    /* @__PURE__ */ jsx33(
                       Bar,
                       {
                         dataKey: barDataKey || yAxisKey,
@@ -4380,12 +4758,12 @@ var BarChart = forwardRef21(
                         name: barDataKey || yAxisKey
                       }
                     ),
-                    showLegend && defaultLegendItems.length > 0 && /* @__PURE__ */ jsx30(ChartLegend, { items: defaultLegendItems })
+                    showLegend && defaultLegendItems.length > 0 && /* @__PURE__ */ jsx33(ChartLegend, { items: defaultLegendItems })
                   ]
                 }
               )
             }
-          ) : /* @__PURE__ */ jsx30("div", { className: "flex items-center justify-center h-[500px]", children: /* @__PURE__ */ jsx30(Typography, { variant: "body-md", className: "text-secondary", children: "No data is available" }) }) })
+          ) : /* @__PURE__ */ jsx33("div", { className: "flex items-center justify-center h-[500px]", children: /* @__PURE__ */ jsx33(Typography, { variant: "body-md", className: "text-secondary", children: "No data is available" }) }) })
         ]
       }
     );
@@ -4394,7 +4772,7 @@ var BarChart = forwardRef21(
 BarChart.displayName = "BarChart";
 // src/components/ui/charts/line-chart.tsx
-import { forwardRef as forwardRef22 } from "react";
+import { forwardRef as forwardRef25 } from "react";
 import {
   LineChart as RechartsLineChart,
   Line,
@@ -4403,8 +4781,8 @@ import {
   Tooltip as Tooltip3,
   ResponsiveContainer as ResponsiveContainer2
 } from "recharts";
-import { jsx as jsx31, jsxs as jsxs19 } from "react/jsx-runtime";
-var LineChart = forwardRef22(
+import { jsx as jsx34, jsxs as jsxs20 } from "react/jsx-runtime";
+var LineChart = forwardRef25(
   ({
     data,
     xAxisKey,
@@ -4432,19 +4810,19 @@ var LineChart = forwardRef22(
       )
     );
     const hasData = data && data.length > 0;
-    return /* @__PURE__ */ jsxs19(
+    return /* @__PURE__ */ jsxs20(
       "div",
       {
         ref,
         className: `bg-light border border-subtle mx-6 ${className}`,
         children: [
-          /* @__PURE__ */ jsx31("div", { className: "flex items-center justify-between px-3 py-2 border-b border-subtle", children: /* @__PURE__ */ jsx31(Typography, { variant: "label-sm-bold", children: title }) }),
-          /* @__PURE__ */ jsx31("div", { className: "pt-2 px-2", children: hasData ? /* @__PURE__ */ jsx31(
+          /* @__PURE__ */ jsx34("div", { className: "flex items-center justify-between px-3 py-2 border-b border-subtle", children: /* @__PURE__ */ jsx34(Typography, { variant: "label-sm-bold", children: title }) }),
+          /* @__PURE__ */ jsx34("div", { className: "pt-2 px-2", children: hasData ? /* @__PURE__ */ jsx34(
             ResponsiveContainer2,
             {
               width: "100%",
               height: CHART_CONSTANTS.STANDARD_HEIGHT,
-              children: /* @__PURE__ */ jsxs19(
+              children: /* @__PURE__ */ jsxs20(
                 RechartsLineChart,
                 {
                   data,
@@ -4455,7 +4833,7 @@ var LineChart = forwardRef22(
                   },
                   onClick: handleClick,
                   children: [
-                    /* @__PURE__ */ jsx31(
+                    /* @__PURE__ */ jsx34(
                       XAxis2,
                       {
                         dataKey: xAxisKey,
@@ -4467,7 +4845,7 @@ var LineChart = forwardRef22(
                         label: xAxisLabel ? createCustomXAxisLabel(xAxisLabel) : void 0
                       }
                     ),
-                    /* @__PURE__ */ jsx31(
+                    /* @__PURE__ */ jsx34(
                       YAxis2,
                       {
                         axisLine: false,
@@ -4476,7 +4854,7 @@ var LineChart = forwardRef22(
                         label: yAxisLabel ? createCustomYAxisLabel(yAxisLabel, 40) : void 0
                       }
                     ),
-                    /* @__PURE__ */ jsx31(
+                    /* @__PURE__ */ jsx34(
                       Tooltip3,
                       {
                         content: ({
@@ -4485,7 +4863,7 @@ var LineChart = forwardRef22(
                           label
                         }) => {
                           if (active && payload && payload.length) {
-                            return /* @__PURE__ */ jsx31(
+                            return /* @__PURE__ */ jsx34(
                               GenericTooltip,
                               {
                                 title: label?.toString(),
@@ -4501,7 +4879,7 @@ var LineChart = forwardRef22(
                         }
                       }
                     ),
-                    series.map((s, index) => /* @__PURE__ */ jsx31(
+                    series.map((s, index) => /* @__PURE__ */ jsx34(
                       Line,
                       {
                         type: "monotone",
@@ -4513,12 +4891,12 @@ var LineChart = forwardRef22(
                       },
                       s.dataKey
                     )),
-                    showLegend && defaultLegendItems.length > 0 && /* @__PURE__ */ jsx31(ChartLegend, { items: defaultLegendItems })
+                    showLegend && defaultLegendItems.length > 0 && /* @__PURE__ */ jsx34(ChartLegend, { items: defaultLegendItems })
                   ]
                 }
               )
             }
-          ) : /* @__PURE__ */ jsx31("div", { className: "flex items-center justify-center h-[500px]", children: /* @__PURE__ */ jsx31(Typography, { variant: "body-md", className: "text-secondary", children: "No data is available" }) }) })
+          ) : /* @__PURE__ */ jsx34("div", { className: "flex items-center justify-center h-[500px]", children: /* @__PURE__ */ jsx34(Typography, { variant: "body-md", className: "text-secondary", children: "No data is available" }) }) })
         ]
       }
     );
@@ -4527,10 +4905,10 @@ var LineChart = forwardRef22(
 LineChart.displayName = "LineChart";
 // src/components/ui/charts/pie-chart.tsx
-import { forwardRef as forwardRef23 } from "react";
+import { forwardRef as forwardRef26 } from "react";
 import { PieChart as RechartsPieChart, Pie, Cell, Tooltip as Tooltip4 } from "recharts";
-import { jsx as jsx32, jsxs as jsxs20 } from "react/jsx-runtime";
-var PieChart = forwardRef23(
+import { jsx as jsx35, jsxs as jsxs21 } from "react/jsx-runtime";
+var PieChart = forwardRef26(
   ({
     data,
     title,
@@ -4557,20 +4935,20 @@ var PieChart = forwardRef23(
       )
     );
     const hasData = data && data.length > 0;
-    return /* @__PURE__ */ jsxs20(
+    return /* @__PURE__ */ jsxs21(
       "div",
       {
         ref,
         className: `bg-light border border-subtle mx-6 ${className}`,
         children: [
-          /* @__PURE__ */ jsx32("div", { className: "flex items-center justify-between px-3 py-2 border-b border-subtle", children: /* @__PURE__ */ jsx32(Typography, { variant: "label-sm-bold", children: title }) }),
-          /* @__PURE__ */ jsx32("div", { className: "pt-2 px-2", children: hasData ? /* @__PURE__ */ jsx32("div", { className: "flex justify-center", children: /* @__PURE__ */ jsxs20(
+          /* @__PURE__ */ jsx35("div", { className: "flex items-center justify-between px-3 py-2 border-b border-subtle", children: /* @__PURE__ */ jsx35(Typography, { variant: "label-sm-bold", children: title }) }),
+          /* @__PURE__ */ jsx35("div", { className: "pt-2 px-2", children: hasData ? /* @__PURE__ */ jsx35("div", { className: "flex justify-center", children: /* @__PURE__ */ jsxs21(
             RechartsPieChart,
             {
               width: 600,
               height: CHART_CONSTANTS.LARGE_HEIGHT,
               children: [
-                /* @__PURE__ */ jsx32(
+                /* @__PURE__ */ jsx35(
                   Pie,
                   {
                     data,
@@ -4582,7 +4960,7 @@ var PieChart = forwardRef23(
                     label: showLabels,
                     labelLine: false,
                     onClick: handleClick,
-                    children: data.map((entry, index) => /* @__PURE__ */ jsx32(
+                    children: data.map((entry, index) => /* @__PURE__ */ jsx35(
                       Cell,
                       {
                         fill: entry.color || getSeriesColor(index)
@@ -4591,7 +4969,7 @@ var PieChart = forwardRef23(
                     ))
                   }
                 ),
-                /* @__PURE__ */ jsx32(
+                /* @__PURE__ */ jsx35(
                   Tooltip4,
                   {
                     content: ({
@@ -4600,7 +4978,7 @@ var PieChart = forwardRef23(
                     }) => {
                       if (active && payload && payload.length && payload[0]) {
                         const data2 = payload[0].payload;
-                        return /* @__PURE__ */ jsx32(
+                        return /* @__PURE__ */ jsx35(
                           GenericTooltip,
                           {
                             title: data2.name,
@@ -4618,10 +4996,10 @@ var PieChart = forwardRef23(
                     }
                   }
                 ),
-                showLegend && defaultLegendItems.length > 0 && /* @__PURE__ */ jsx32(ChartLegend, { items: defaultLegendItems, y: 400 })
+                showLegend && defaultLegendItems.length > 0 && /* @__PURE__ */ jsx35(ChartLegend, { items: defaultLegendItems, y: 400 })
               ]
             }
-          ) }) : /* @__PURE__ */ jsx32("div", { className: "flex items-center justify-center h-[500px]", children: /* @__PURE__ */ jsx32(Typography, { variant: "body-md", className: "text-secondary", children: "No data is available" }) }) })
+          ) }) : /* @__PURE__ */ jsx35("div", { className: "flex items-center justify-center h-[500px]", children: /* @__PURE__ */ jsx35(Typography, { variant: "body-md", className: "text-secondary", children: "No data is available" }) }) })
         ]
       }
     );
@@ -4634,7 +5012,7 @@ import { useCallback as useCallback9 } from "react";
 import {
   flexRender
 } from "@tanstack/react-table";
-import { Fragment as Fragment3, jsx as jsx33, jsxs as jsxs21 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx36, jsxs as jsxs22 } from "react/jsx-runtime";
 function Table({
   table,
   className,
@@ -4664,15 +5042,15 @@ function Table({
     },
     [table]
   );
-  return /* @__PURE__ */ jsxs21("div", { children: [
-    /* @__PURE__ */ jsx33("div", { className: cn("overflow-x-auto", className), children: /* @__PURE__ */ jsxs21("table", { className: "min-w-full divide-y divide-border", children: [
-      /* @__PURE__ */ jsx33("thead", { className: "bg-dark text-light", children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx33("tr", { children: headerGroup.headers.map((header) => /* @__PURE__ */ jsx33("th", { className: "px-6 py-3 text-left", children: /* @__PURE__ */ jsxs21(
+  return /* @__PURE__ */ jsxs22("div", { children: [
+    /* @__PURE__ */ jsx36("div", { className: cn("overflow-x-auto", className), children: /* @__PURE__ */ jsxs22("table", { className: "min-w-full divide-y divide-border", children: [
+      /* @__PURE__ */ jsx36("thead", { className: "bg-dark text-light", children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx36("tr", { children: headerGroup.headers.map((header) => /* @__PURE__ */ jsx36("th", { className: "px-6 py-3 text-left", children: /* @__PURE__ */ jsxs22(
         "div",
         {
           className: `flex items-center space-x-1 ${header.column.getCanSort() ? "cursor-pointer select-none" : ""}`,
           onClick: header.column.getToggleSortingHandler(),
           children: [
-            /* @__PURE__ */ jsx33(
+            /* @__PURE__ */ jsx36(
               Typography,
               {
                 variant: "label-xs",
@@ -4683,19 +5061,19 @@ function Table({
                 )
               }
             ),
-            header.column.getCanSort() && /* @__PURE__ */ jsxs21("span", { className: "ml-1", children: [
-              header.column.getIsSorted() === "asc" && /* @__PURE__ */ jsx33(CaretUpIcon, { className: "text-light" }),
-              header.column.getIsSorted() === "desc" && /* @__PURE__ */ jsx33(CaretDownIcon, { className: "text-light" })
+            header.column.getCanSort() && /* @__PURE__ */ jsxs22("span", { className: "ml-1", children: [
+              header.column.getIsSorted() === "asc" && /* @__PURE__ */ jsx36(CaretUpIcon, { className: "text-light" }),
+              header.column.getIsSorted() === "desc" && /* @__PURE__ */ jsx36(CaretDownIcon, { className: "text-light" })
             ] })
           ]
         }
       ) }, header.id)) }, headerGroup.id)) }),
-      /* @__PURE__ */ jsx33("tbody", { className: "bg-light divide-y divide-border", children: table.getRowModel().rows.map((row) => /* @__PURE__ */ jsx33("tr", { children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx33("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsx33(Typography, { variant: "body-sm", children: flexRender(
+      /* @__PURE__ */ jsx36("tbody", { className: "bg-light divide-y divide-border", children: table.getRowModel().rows.map((row) => /* @__PURE__ */ jsx36("tr", { children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx36("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsx36(Typography, { variant: "body-sm", children: flexRender(
         cell.column.columnDef.cell,
         cell.getContext()
       ) }) }, cell.id)) }, row.id)) })
     ] }) }),
-    showPagination && /* @__PURE__ */ jsxs21(
+    showPagination && /* @__PURE__ */ jsxs22(
       "div",
       {
         className: cn(
@@ -4703,9 +5081,9 @@ function Table({
           paginationClassName
         ),
         children: [
-          /* @__PURE__ */ jsx33("div", { className: "flex items-center", children: /* @__PURE__ */ jsx33(Typography, { variant: "body-sm", className: "text-secondary", children: showingText }) }),
-          /* @__PURE__ */ jsxs21("div", { className: "flex items-center space-x-1", children: [
-            /* @__PURE__ */ jsx33(
+          /* @__PURE__ */ jsx36("div", { className: "flex items-center", children: /* @__PURE__ */ jsx36(Typography, { variant: "body-sm", className: "text-secondary", children: showingText }) }),
+          /* @__PURE__ */ jsxs22("div", { className: "flex items-center space-x-1", children: [
+            /* @__PURE__ */ jsx36(
               Button,
               {
                 variant: "ghost",
@@ -4713,7 +5091,7 @@ function Table({
                 onClick: handlePreviousPage,
                 disabled: !table.getCanPreviousPage(),
                 className: "p-2",
-                children: /* @__PURE__ */ jsx33(ArrowLeftIcon, {})
+                children: /* @__PURE__ */ jsx36(ArrowLeftIcon, {})
               }
             ),
             Array.from(
@@ -4730,7 +5108,7 @@ function Table({
                   pageNumber = currentPage - 2 + i;
                 }
                 const isActive = pageNumber === currentPage;
-                return /* @__PURE__ */ jsx33(
+                return /* @__PURE__ */ jsx36(
                   Button,
                   {
                     variant: isActive ? "default" : "ghost",
@@ -4743,11 +5121,11 @@ function Table({
                 );
               }
             ),
-            table.getPageCount() > 5 && currentPage < totalPages - 3 && /* @__PURE__ */ jsxs21(Fragment3, { children: [
-              /* @__PURE__ */ jsx33("span", { className: "px-1 text-secondary", children: "..." }),
-              /* @__PURE__ */ jsx33(Typography, { variant: "body-sm", className: "text-secondary", children: totalPages })
+            table.getPageCount() > 5 && currentPage < totalPages - 3 && /* @__PURE__ */ jsxs22(Fragment3, { children: [
+              /* @__PURE__ */ jsx36("span", { className: "px-1 text-secondary", children: "..." }),
+              /* @__PURE__ */ jsx36(Typography, { variant: "body-sm", className: "text-secondary", children: totalPages })
             ] }),
-            /* @__PURE__ */ jsx33(
+            /* @__PURE__ */ jsx36(
               Button,
               {
                 variant: "ghost",
@@ -4755,12 +5133,12 @@ function Table({
                 onClick: handleNextPage,
                 disabled: !table.getCanNextPage(),
                 className: "p-2",
-                children: /* @__PURE__ */ jsx33(ArrowRightIcon, {})
+                children: /* @__PURE__ */ jsx36(ArrowRightIcon, {})
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs21("div", { className: "flex items-center gap-3 w-48", children: [
-            /* @__PURE__ */ jsx33(
+          /* @__PURE__ */ jsxs22("div", { className: "flex items-center gap-3 w-48", children: [
+            /* @__PURE__ */ jsx36(
               Typography,
               {
                 variant: "body-sm",
@@ -4768,14 +5146,14 @@ function Table({
                 children: "Rows per page:"
               }
             ),
-            /* @__PURE__ */ jsxs21(
+            /* @__PURE__ */ jsxs22(
               Select,
               {
                 value: table.getState().pagination.pageSize.toString(),
                 onValueChange: handlePageSizeChange,
                 children: [
-                  /* @__PURE__ */ jsx33(SelectTrigger, { className: "min-w-0 h-8", children: /* @__PURE__ */ jsx33(SelectValue, {}) }),
-                  /* @__PURE__ */ jsx33(SelectContent, { children: [10, 20, 50, 100].map((size) => /* @__PURE__ */ jsx33(SelectItem, { value: size.toString(), children: size }, size)) })
+                  /* @__PURE__ */ jsx36(SelectTrigger, { className: "min-w-0 h-8", children: /* @__PURE__ */ jsx36(SelectValue, {}) }),
+                  /* @__PURE__ */ jsx36(SelectContent, { children: [10, 20, 50, 100].map((size) => /* @__PURE__ */ jsx36(SelectItem, { value: size.toString(), children: size }, size)) })
                 ]
               }
             )
@@ -4827,6 +5205,15 @@ export {
   CogIcon,
   CredentialsIcon,
   DatePicker,
+  Dialog,
+  DialogBody,
+  DialogClose,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogOverlay,
+  DialogTitle,
+  DialogTrigger,
   DocumentIcon,
   DollarIcon,
   DownloadIcon,
@@ -4871,6 +5258,16 @@ export {
   HomeIcon,
   InformationIcon,
   Input,
+  Item2 as Item,
+  ItemActions,
+  ItemContent,
+  ItemDescription,
+  ItemFooter,
+  ItemGroup,
+  ItemHeader,
+  ItemMedia,
+  ItemSeparator,
+  ItemTitle,
   Label2 as Label,
   LineChart,
   LocationIcon,
@@ -4950,6 +5347,8 @@ export {
   getPerformanceColor,
   getSeriesColor,
   initializePdfWorker,
+  itemMediaVariants,
+  itemVariants,
   selectTriggerVariants,
   switchVariants,
   tabsVariants,