@yenio-pld/blocks 0.0.0 → 1.0.0-rc.2

package/dist/index.js

@@ -1,118 +1,61 @@
 "use client";
-import * as React from 'react';
 import { createContext, useContext, useState, useRef, useId, useEffect, useCallback, useLayoutEffect } from 'react';
-import { Loader2, AlertTriangle, Inbox, Bell, Moon, Sun, Monitor, Languages, Upload, Move, ZoomOut, ZoomIn, RotateCcw, RotateCw, Grid3X3, RefreshCw, X, User, Pencil, Check, Pause, Play, BarChart3, XIcon } from 'lucide-react';
+import { Skeleton } from './ui/skeleton.js';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { Loader2, AlertTriangle, Inbox, Bell, Moon, Sun, Monitor, Languages, Upload, Move, ZoomOut, ZoomIn, RotateCcw, RotateCw, Grid3X3, RefreshCw, X, User, Pencil, Check, Pause, Play, BarChart3 } from 'lucide-react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
+import { Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent } from './ui/empty.js';
 import { cva } from 'class-variance-authority';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
-import { Slot } from '@radix-ui/react-slot';
-import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+import { AlertDialog, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogCancel, AlertDialogAction } from './ui/alert-dialog.js';
+import { Button } from './ui/button.js';
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, miniMenuContentClassName, miniMenuContentDefaults, DropdownMenuItem } from './ui/dropdown-menu.js';
 import { useTheme } from 'next-themes';
-import * as SliderPrimitive from '@radix-ui/react-slider';
-import * as TogglePrimitive from '@radix-ui/react-toggle';
-import * as DialogPrimitive from '@radix-ui/react-dialog';
-import { Drawer as Drawer$1 } from 'vaul';
+import { Slider } from './ui/slider.js';
+import { Toggle } from './ui/toggle.js';
+import { DialogClose, Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from './ui/dialog.js';
+import { DrawerClose, Drawer, DrawerContent, DrawerHeader, DrawerTitle, DrawerFooter } from './ui/drawer.js';
 import { AnimatePresence, motion } from 'framer-motion';
 
 var LanguageContext = createContext(null);
 function useLanguageContext() {
   return useContext(LanguageContext);
 }
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-function Empty({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "empty",
-      className: cn(
-        "flex min-w-0 flex-1 flex-col items-center justify-center gap-6 rounded-lg p-6 text-center text-balance md:p-12",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function EmptyHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "empty-header",
-      className: cn(
-        "flex max-w-sm flex-col items-center gap-2 text-center",
-        className
-      ),
-      ...props
-    }
-  );
+function PageTitle({
+  title,
+  description
+}) {
+  return /* @__PURE__ */ jsxs("header", { className: "flex flex-col gap-1", children: [
+    /* @__PURE__ */ jsx("h1", { className: "text-2xl font-semibold tracking-tight", children: title }),
+    description ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: description }) : null
+  ] });
 }
-var emptyMediaVariants = cva(
-  "mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0",
-  {
-    variants: {
-      variant: {
-        default: "bg-transparent",
-        icon: "flex size-10 shrink-0 items-center justify-center rounded-lg bg-muted text-foreground [&_svg:not([class*='size-'])]:size-6"
-      }
-    },
-    defaultVariants: {
-      variant: "default"
-    }
-  }
-);
-function EmptyMedia({
-  className,
-  variant = "default",
-  ...props
+function Field({
+  label,
+  children
 }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "empty-icon",
-      "data-variant": variant,
-      className: cn(emptyMediaVariants({ variant, className })),
-      ...props
-    }
-  );
+  return /* @__PURE__ */ jsxs("label", { className: "flex flex-col gap-1 text-sm", children: [
+    /* @__PURE__ */ jsx("span", { className: "font-medium", children: label }),
+    children
+  ] });
 }
-function EmptyTitle({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "empty-title",
-      className: cn("text-lg font-medium tracking-tight", className),
-      ...props
-    }
-  );
+function ListSkeleton() {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx(Skeleton, { className: "h-8 w-48" }),
+    /* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-full" }),
+    /* @__PURE__ */ jsx(Skeleton, { className: "h-16 w-full" }),
+    /* @__PURE__ */ jsx(Skeleton, { className: "h-16 w-full" }),
+    /* @__PURE__ */ jsx(Skeleton, { className: "h-16 w-full" })
+  ] });
 }
-function EmptyDescription({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "empty-description",
-      className: cn(
-        "text-sm/relaxed text-muted-foreground [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary",
-        className
-      ),
-      ...props
-    }
-  );
+function TableSkeleton({
+  columns,
+  rows = 5
+}) {
+  return /* @__PURE__ */ jsx("div", { "aria-busy": "true", className: "flex flex-col gap-2", children: Array.from({ length: rows }, (_, row) => /* @__PURE__ */ jsx("div", { className: "flex gap-2", children: Array.from({ length: columns }, (_2, column) => /* @__PURE__ */ jsx(Skeleton, { className: "h-8 flex-1" }, column)) }, row)) });
 }
-function EmptyContent({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "empty-content",
-      className: cn(
-        "flex w-full max-w-sm min-w-0 flex-col items-center gap-4 text-sm text-balance",
-        className
-      ),
-      ...props
-    }
-  );
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
 }
 function LoadingState({
   label = "Loading\u2026",
@@ -206,187 +149,97 @@ function EmptyState({
     }
   );
 }
-var buttonVariants = cva(
-  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
+function Empty2({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "empty",
+      className: cn(
+        "flex min-w-0 flex-1 flex-col items-center justify-center gap-6 rounded-lg p-6 text-center text-balance md:p-12",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function EmptyHeader2({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "empty-header",
+      className: cn(
+        "flex max-w-sm flex-col items-center gap-2 text-center",
+        className
+      ),
+      ...props
+    }
+  );
+}
+var emptyMediaVariants = cva(
+  "mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0",
   {
     variants: {
       variant: {
-        default: "bg-primary text-primary-foreground hover:bg-primary/90",
-        destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
-        outline: "border bg-background text-foreground shadow-xs hover:bg-accent hover:text-accent-foreground dark:border-input dark:bg-input/30 dark:text-foreground dark:hover:bg-muted dark:hover:text-foreground",
-        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
-        ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50 dark:hover:text-foreground",
-        link: "text-primary underline-offset-4 hover:underline"
-      },
-      size: {
-        default: "h-9 px-4 py-2 has-[>svg]:px-3",
-        sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
-        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
-        icon: "size-9",
-        "icon-sm": "size-8",
-        "icon-lg": "size-10"
+        default: "bg-transparent",
+        icon: "flex size-10 shrink-0 items-center justify-center rounded-lg bg-muted text-foreground [&_svg:not([class*='size-'])]:size-6"
       }
     },
     defaultVariants: {
-      variant: "default",
-      size: "default"
+      variant: "default"
     }
   }
 );
-function Button({
+function EmptyMedia2({
   className,
   variant = "default",
-  size = "default",
-  asChild = false,
   ...props
 }) {
-  const Comp = asChild ? Slot : "button";
   return /* @__PURE__ */ jsx(
-    Comp,
+    "div",
     {
-      "data-slot": "button",
+      "data-slot": "empty-icon",
       "data-variant": variant,
-      "data-size": size,
-      className: cn(buttonVariants({ variant, size, className })),
+      className: cn(emptyMediaVariants({ variant, className })),
       ...props
     }
   );
 }
-function AlertDialog({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(AlertDialogPrimitive.Root, { "data-slot": "alert-dialog", ...props });
-}
-function AlertDialogPortal({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(AlertDialogPrimitive.Portal, { "data-slot": "alert-dialog-portal", ...props });
-}
-function AlertDialogOverlay({
-  className,
-  ...props
-}) {
+function EmptyTitle2({ className, ...props }) {
   return /* @__PURE__ */ jsx(
-    AlertDialogPrimitive.Overlay,
+    "div",
     {
-      "data-slot": "alert-dialog-overlay",
-      className: cn(
-        "fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0",
-        className
-      ),
+      "data-slot": "empty-title",
+      className: cn("text-lg font-medium tracking-tight", className),
       ...props
     }
   );
 }
-function AlertDialogContent({
-  className,
-  size = "default",
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [
-    /* @__PURE__ */ jsx(AlertDialogOverlay, {}),
-    /* @__PURE__ */ jsx(
-      AlertDialogPrimitive.Content,
-      {
-        "data-slot": "alert-dialog-content",
-        "data-size": size,
-        className: cn(
-          "group/alert-dialog-content fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border bg-background p-6 shadow-lg duration-200 data-[size=sm]:max-w-xs data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[size=default]:sm:max-w-lg",
-          className
-        ),
-        ...props
-      }
-    )
-  ] });
-}
-function AlertDialogHeader({
-  className,
-  ...props
-}) {
+function EmptyDescription2({ className, ...props }) {
   return /* @__PURE__ */ jsx(
     "div",
     {
-      "data-slot": "alert-dialog-header",
+      "data-slot": "empty-description",
       className: cn(
-        "flex flex-col gap-1.5 text-center sm:text-left",
+        "text-sm/relaxed text-muted-foreground [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary",
         className
       ),
       ...props
     }
   );
 }
-function AlertDialogFooter({
-  className,
-  ...props
-}) {
+function EmptyContent2({ className, ...props }) {
   return /* @__PURE__ */ jsx(
     "div",
     {
-      "data-slot": "alert-dialog-footer",
+      "data-slot": "empty-content",
       className: cn(
-        "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",
+        "flex w-full max-w-sm min-w-0 flex-col items-center gap-4 text-sm text-balance",
         className
       ),
       ...props
     }
   );
 }
-function AlertDialogTitle({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    AlertDialogPrimitive.Title,
-    {
-      "data-slot": "alert-dialog-title",
-      className: cn("text-lg font-semibold", className),
-      ...props
-    }
-  );
-}
-function AlertDialogDescription({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    AlertDialogPrimitive.Description,
-    {
-      "data-slot": "alert-dialog-description",
-      className: cn("text-sm text-muted-foreground", className),
-      ...props
-    }
-  );
-}
-function AlertDialogAction({
-  className,
-  variant = "default",
-  size = "default",
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(Button, { variant, size, asChild: true, children: /* @__PURE__ */ jsx(
-    AlertDialogPrimitive.Action,
-    {
-      "data-slot": "alert-dialog-action",
-      className: cn(className),
-      ...props
-    }
-  ) });
-}
-function AlertDialogCancel({
-  className,
-  variant = "outline",
-  size = "default",
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(Button, { variant, size, asChild: true, children: /* @__PURE__ */ jsx(
-    AlertDialogPrimitive.Cancel,
-    {
-      "data-slot": "alert-dialog-cancel",
-      className: cn(className),
-      ...props
-    }
-  ) });
-}
 function ConfirmDestructiveDialog({
   open,
   onOpenChange,
@@ -417,65 +270,6 @@ function ConfirmDestructiveDialog({
     ] })
   ] }) });
 }
-var miniMenuContentClassName = "max-h-none overflow-x-visible overflow-y-visible";
-var miniMenuContentDefaults = {
-  sideOffset: 8,
-  collisionPadding: 12
-};
-function DropdownMenu({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(DropdownMenuPrimitive.Root, { "data-slot": "dropdown-menu", ...props });
-}
-function DropdownMenuTrigger({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    DropdownMenuPrimitive.Trigger,
-    {
-      "data-slot": "dropdown-menu-trigger",
-      ...props
-    }
-  );
-}
-function DropdownMenuContent({
-  className,
-  sideOffset = 4,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
-    DropdownMenuPrimitive.Content,
-    {
-      "data-slot": "dropdown-menu-content",
-      sideOffset,
-      className: cn(
-        "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-[200] max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md",
-        className
-      ),
-      ...props
-    }
-  ) });
-}
-function DropdownMenuItem({
-  className,
-  inset,
-  variant = "default",
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    DropdownMenuPrimitive.Item,
-    {
-      "data-slot": "dropdown-menu-item",
-      "data-inset": inset,
-      "data-variant": variant,
-      className: cn(
-        "relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[highlighted]:[&_svg:not([class*='text-'])]:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:[&_svg:not([class*='text-'])]:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:data-[highlighted]:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 dark:data-[variant=destructive]:data-[highlighted]:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:data-[highlighted]:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-        className
-      ),
-      ...props
-    }
-  );
-}
 var DEFAULT_NOTIFICATION_BELL_LABELS = {
   title: "Notifications",
   empty: "You're all caught up.",
@@ -532,63 +326,76 @@ function NotificationBell({
   className
 }) {
   const labels = { ...DEFAULT_NOTIFICATION_BELL_LABELS, ...labelOverrides };
-  return /* @__PURE__ */ jsxs(DropdownMenu, { modal: false, onOpenChange, children: [
-    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
-      Button,
-      {
-        type: "button",
-        variant: "ghost",
-        size: "icon",
-        className: cn("relative size-9", className),
-        "aria-label": labels.title,
-        children: [
-          /* @__PURE__ */ jsx(Bell, { className: "size-4" }),
-          unreadCount > 0 ? /* @__PURE__ */ jsx("span", { className: "bg-destructive text-destructive-foreground absolute -top-0.5 -right-0.5 flex size-4 items-center justify-center rounded-full text-[10px] leading-none font-medium tabular-nums", children: formatUnreadBadge(unreadCount) }) : null
-        ]
-      }
-    ) }),
-    /* @__PURE__ */ jsxs(DropdownMenuContent, { align, className: "w-80 p-0", children: [
-      /* @__PURE__ */ jsx("div", { className: "flex items-center justify-between border-b px-4 py-3", children: /* @__PURE__ */ jsx("h4", { className: "font-semibold", children: labels.title }) }),
-      /* @__PURE__ */ jsx("div", { className: "max-h-80 overflow-y-auto", children: isLoading ? /* @__PURE__ */ jsx(NotificationListSkeleton, {}) : items.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-muted-foreground px-4 py-8 text-center text-sm", children: labels.empty }) : /* @__PURE__ */ jsx("div", { className: "flex flex-col", children: items.map((item, index) => {
-        const body = /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-1", children: [
-          /* @__PURE__ */ jsx("p", { className: "text-sm leading-none font-medium", children: item.title }),
-          /* @__PURE__ */ jsx("p", { className: "text-muted-foreground line-clamp-2 text-xs", children: item.message }),
-          /* @__PURE__ */ jsx("p", { className: "text-muted-foreground/70 text-xs", children: formatTime(item.createdAt) })
-        ] });
-        return /* @__PURE__ */ jsxs("div", { children: [
-          item.href ? /* @__PURE__ */ jsx(
-            "a",
-            {
-              href: item.href,
-              className: cn(
-                "hover:bg-muted/50 flex gap-3 px-4 py-3 motion-safe:transition-colors",
-                !item.read && "bg-muted/30"
+  return /* @__PURE__ */ jsxs(
+    DropdownMenu,
+    {
+      onOpenChange: (open) => {
+        onOpenChange?.(open);
+      },
+      children: [
+        /* @__PURE__ */ jsxs(
+          DropdownMenuTrigger,
+          {
+            render: /* @__PURE__ */ jsx(
+              Button,
+              {
+                type: "button",
+                variant: "ghost",
+                size: "icon",
+                className: cn("relative size-9", className),
+                "aria-label": labels.title
+              }
+            ),
+            children: [
+              /* @__PURE__ */ jsx(Bell, { className: "size-4" }),
+              unreadCount > 0 ? /* @__PURE__ */ jsx("span", { className: "bg-destructive text-destructive-foreground absolute -top-0.5 -right-0.5 flex size-4 items-center justify-center rounded-full text-[10px] leading-none font-medium tabular-nums", children: formatUnreadBadge(unreadCount) }) : null
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(DropdownMenuContent, { align, className: "w-80 p-0", children: [
+          /* @__PURE__ */ jsx("div", { className: "flex items-center justify-between border-b px-4 py-3", children: /* @__PURE__ */ jsx("h4", { className: "font-semibold", children: labels.title }) }),
+          /* @__PURE__ */ jsx("div", { className: "max-h-80 overflow-y-auto", children: isLoading ? /* @__PURE__ */ jsx(NotificationListSkeleton, {}) : items.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-muted-foreground px-4 py-8 text-center text-sm", children: labels.empty }) : /* @__PURE__ */ jsx("div", { className: "flex flex-col", children: items.map((item, index) => {
+            const body = /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-1", children: [
+              /* @__PURE__ */ jsx("p", { className: "text-sm leading-none font-medium", children: item.title }),
+              /* @__PURE__ */ jsx("p", { className: "text-muted-foreground line-clamp-2 text-xs", children: item.message }),
+              /* @__PURE__ */ jsx("p", { className: "text-muted-foreground/70 text-xs", children: formatTime(item.createdAt) })
+            ] });
+            return /* @__PURE__ */ jsxs("div", { children: [
+              item.href ? /* @__PURE__ */ jsx(
+                "a",
+                {
+                  href: item.href,
+                  className: cn(
+                    "hover:bg-muted/50 flex gap-3 px-4 py-3 motion-safe:transition-colors",
+                    !item.read && "bg-muted/30"
+                  ),
+                  children: body
+                }
+              ) : /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: cn(
+                    "flex gap-3 px-4 py-3",
+                    !item.read && "bg-muted/30"
+                  ),
+                  children: body
+                }
               ),
-              children: body
-            }
-          ) : /* @__PURE__ */ jsx(
-            "div",
+              index < items.length - 1 ? /* @__PURE__ */ jsx("div", { className: "bg-border h-px" }) : null
+            ] }, item.id);
+          }) }) }),
+          /* @__PURE__ */ jsx("div", { className: "border-t px-4 py-2", children: /* @__PURE__ */ jsx(
+            "a",
             {
-              className: cn(
-                "flex gap-3 px-4 py-3",
-                !item.read && "bg-muted/30"
-              ),
-              children: body
+              href: viewAllHref,
+              className: "text-primary block text-center text-sm font-medium hover:underline",
+              children: labels.viewAll
             }
-          ),
-          index < items.length - 1 ? /* @__PURE__ */ jsx("div", { className: "bg-border h-px" }) : null
-        ] }, item.id);
-      }) }) }),
-      /* @__PURE__ */ jsx("div", { className: "border-t px-4 py-2", children: /* @__PURE__ */ jsx(
-        "a",
-        {
-          href: viewAllHref,
-          className: "text-primary block text-center text-sm font-medium hover:underline",
-          children: labels.viewAll
-        }
-      ) })
-    ] })
-  ] });
+          ) })
+        ] })
+      ]
+    }
+  );
 }
 
 // src/components/editable/types.ts
@@ -1039,23 +846,28 @@ function ThemeSwitcher({
   }
   const currentTheme = storedTheme(theme);
   const TriggerIcon = currentTheme ? themeIcons[currentTheme] : Monitor;
-  return /* @__PURE__ */ jsxs(DropdownMenu, { modal: false, children: [
-    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
-      Button,
+  return /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx(
+      DropdownMenuTrigger,
       {
-        "data-testid": "theme-switcher",
-        variant: "outline",
-        size: "icon",
-        "aria-label": labels.theme,
-        className: cn(
-          sizes.button,
-          shapeClass,
-          iconTriggerClassName,
-          className
+        render: /* @__PURE__ */ jsx(
+          Button,
+          {
+            "data-testid": "theme-switcher",
+            variant: "outline",
+            size: "icon",
+            "aria-label": labels.theme,
+            className: cn(
+              sizes.button,
+              shapeClass,
+              iconTriggerClassName,
+              className
+            )
+          }
         ),
         children: /* @__PURE__ */ jsx(TriggerIcon, { className: sizes.icon })
       }
-    ) }),
+    ),
     /* @__PURE__ */ jsx(
       DropdownMenuContent,
       {
@@ -1121,22 +933,27 @@ function LanguageSwitcher({
   const sizes = sizeClasses2[size];
   const shapeClass = shapeClasses2[shape];
   const accessibleName = labels.language ?? "Language";
-  return /* @__PURE__ */ jsxs(DropdownMenu, { modal: false, children: [
-    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
-      Button,
+  return /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx(
+      DropdownMenuTrigger,
       {
-        variant: "outline",
-        size: "icon",
-        "aria-label": accessibleName,
-        className: cn(
-          sizes.button,
-          shapeClass,
-          iconTriggerClassName2,
-          className
+        render: /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "outline",
+            size: "icon",
+            "aria-label": accessibleName,
+            className: cn(
+              sizes.button,
+              shapeClass,
+              iconTriggerClassName2,
+              className
+            )
+          }
         ),
         children: /* @__PURE__ */ jsx(Languages, { className: sizes.icon })
       }
-    ) }),
+    ),
     /* @__PURE__ */ jsx(
       DropdownMenuContent,
       {
@@ -1161,97 +978,6 @@ function LanguageSwitcher({
     )
   ] });
 }
-function Slider({
-  className,
-  defaultValue,
-  value,
-  min = 0,
-  max = 100,
-  ...props
-}) {
-  const _values = React.useMemo(
-    () => Array.isArray(value) ? value : Array.isArray(defaultValue) ? defaultValue : [min, max],
-    [value, defaultValue, min, max]
-  );
-  return /* @__PURE__ */ jsxs(
-    SliderPrimitive.Root,
-    {
-      "data-slot": "slider",
-      defaultValue,
-      value,
-      min,
-      max,
-      className: cn(
-        "relative flex w-full touch-none items-center select-none data-[disabled]:opacity-50 data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col",
-        className
-      ),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsx(
-          SliderPrimitive.Track,
-          {
-            "data-slot": "slider-track",
-            className: cn(
-              "bg-muted relative grow overflow-hidden rounded-full data-[orientation=horizontal]:h-1.5 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1.5"
-            ),
-            children: /* @__PURE__ */ jsx(
-              SliderPrimitive.Range,
-              {
-                "data-slot": "slider-range",
-                className: cn(
-                  "bg-primary absolute data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full"
-                )
-              }
-            )
-          }
-        ),
-        Array.from({ length: _values.length }, (_, index) => /* @__PURE__ */ jsx(
-          SliderPrimitive.Thumb,
-          {
-            "data-slot": "slider-thumb",
-            className: "border-primary ring-ring/50 block size-4 shrink-0 rounded-full border bg-white shadow-sm transition-[color,box-shadow] hover:ring-4 focus-visible:ring-4 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50"
-          },
-          index
-        ))
-      ]
-    }
-  );
-}
-var toggleVariants = cva(
-  "inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium hover:bg-muted hover:text-muted-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none transition-[color,box-shadow] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive whitespace-nowrap",
-  {
-    variants: {
-      variant: {
-        default: "bg-transparent",
-        outline: "border border-input bg-transparent shadow-xs hover:bg-accent hover:text-accent-foreground"
-      },
-      size: {
-        default: "h-9 px-2 min-w-9",
-        sm: "h-8 px-1.5 min-w-8",
-        lg: "h-10 px-2.5 min-w-10"
-      }
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "default"
-    }
-  }
-);
-function Toggle({
-  className,
-  variant,
-  size,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    TogglePrimitive.Root,
-    {
-      "data-slot": "toggle",
-      className: cn(toggleVariants({ variant, size, className })),
-      ...props
-    }
-  );
-}
 var DEFAULT_LABELS = {
   uploadAria: "Upload image",
   uploadHint: "Click to upload",
@@ -1784,203 +1510,6 @@ function AvatarEditor({
     }
   );
 }
-function Dialog({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(DialogPrimitive.Root, { "data-slot": "dialog", ...props });
-}
-function DialogPortal({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(DialogPrimitive.Portal, { "data-slot": "dialog-portal", ...props });
-}
-function DialogClose({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(DialogPrimitive.Close, { "data-slot": "dialog-close", ...props });
-}
-function DialogOverlay({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    DialogPrimitive.Overlay,
-    {
-      "data-slot": "dialog-overlay",
-      className: cn(
-        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function DialogContent({
-  className,
-  children,
-  showCloseButton = true,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs(DialogPortal, { "data-slot": "dialog-portal", children: [
-    /* @__PURE__ */ jsx(DialogOverlay, {}),
-    /* @__PURE__ */ jsxs(
-      DialogPrimitive.Content,
-      {
-        "data-slot": "dialog-content",
-        className: cn(
-          "bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 outline-none sm:max-w-lg",
-          className
-        ),
-        ...props,
-        children: [
-          children,
-          showCloseButton && /* @__PURE__ */ jsxs(
-            DialogPrimitive.Close,
-            {
-              "data-slot": "dialog-close",
-              className: "ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-              children: [
-                /* @__PURE__ */ jsx(XIcon, {}),
-                /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
-              ]
-            }
-          )
-        ]
-      }
-    )
-  ] });
-}
-function DialogHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "dialog-header",
-      className: cn("flex flex-col gap-2 text-center sm:text-left", className),
-      ...props
-    }
-  );
-}
-function DialogFooter({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "dialog-footer",
-      className: cn(
-        "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function DialogTitle({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    DialogPrimitive.Title,
-    {
-      "data-slot": "dialog-title",
-      className: cn("text-lg leading-none font-semibold", className),
-      ...props
-    }
-  );
-}
-function Drawer({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(Drawer$1.Root, { "data-slot": "drawer", ...props });
-}
-function DrawerPortal({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(Drawer$1.Portal, { "data-slot": "drawer-portal", ...props });
-}
-function DrawerClose({
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(Drawer$1.Close, { "data-slot": "drawer-close", ...props });
-}
-function DrawerOverlay({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    Drawer$1.Overlay,
-    {
-      "data-slot": "drawer-overlay",
-      className: cn(
-        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function DrawerContent({
-  className,
-  children,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs(DrawerPortal, { "data-slot": "drawer-portal", children: [
-    /* @__PURE__ */ jsx(DrawerOverlay, {}),
-    /* @__PURE__ */ jsxs(
-      Drawer$1.Content,
-      {
-        "data-slot": "drawer-content",
-        className: cn(
-          "group/drawer-content bg-background fixed z-50 flex h-auto flex-col",
-          "data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-lg data-[vaul-drawer-direction=top]:border-b",
-          "data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-lg data-[vaul-drawer-direction=bottom]:border-t",
-          "data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:sm:max-w-sm",
-          "data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:sm:max-w-sm",
-          className
-        ),
-        ...props,
-        children: [
-          /* @__PURE__ */ jsx("div", { className: "bg-muted mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }),
-          children
-        ]
-      }
-    )
-  ] });
-}
-function DrawerHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "drawer-header",
-      className: cn(
-        "flex flex-col gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-1.5 md:text-left",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function DrawerFooter({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "drawer-footer",
-      className: cn("mt-auto flex flex-col gap-2 p-4", className),
-      ...props
-    }
-  );
-}
-function DrawerTitle({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    Drawer$1.Title,
-    {
-      "data-slot": "drawer-title",
-      className: cn("text-foreground font-semibold", className),
-      ...props
-    }
-  );
-}
 function useMediaQuery(query) {
   const [matches, setMatches] = useState(false);
   useEffect(() => {
@@ -2561,50 +2090,47 @@ function FileUploadMenu({
   const activeCount = visible.filter(
     (job) => isActiveStatus(job.status)
   ).length;
-  return /* @__PURE__ */ jsxs(
-    DropdownMenu,
-    {
-      modal: false,
-      open: resolvedOpen,
-      onOpenChange: setResolvedOpen,
-      children: [
-        /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsxs(DropdownMenu, { open: resolvedOpen, onOpenChange: setResolvedOpen, children: [
+    /* @__PURE__ */ jsxs(
+      DropdownMenuTrigger,
+      {
+        render: /* @__PURE__ */ jsx(
           Button,
           {
             type: "button",
             variant: "ghost",
             size: "icon",
             className: cn("relative size-9", className),
-            "aria-label": labels.title,
-            children: [
-              /* @__PURE__ */ jsx(Upload, { className: "size-4" }),
-              activeCount > 0 ? /* @__PURE__ */ jsx("span", { className: "bg-destructive text-destructive-foreground absolute -top-0.5 -right-0.5 flex size-4 items-center justify-center rounded-full text-[10px] leading-none font-medium tabular-nums", children: formatActiveBadge(activeCount) }) : null
-            ]
-          }
-        ) }),
-        /* @__PURE__ */ jsxs(
-          DropdownMenuContent,
-          {
-            align,
-            className: "w-80 min-w-0 max-w-[calc(100vw-2rem)] overflow-x-hidden p-0",
-            children: [
-              /* @__PURE__ */ jsx("div", { className: "flex items-center justify-between border-b px-4 py-3", children: /* @__PURE__ */ jsx("h4", { className: "font-semibold", children: labels.title }) }),
-              /* @__PURE__ */ jsx("div", { className: "max-h-80 min-w-0 overflow-x-hidden overflow-y-auto p-3", children: /* @__PURE__ */ jsx(
-                FileUploadTray,
-                {
-                  jobs: visible,
-                  labels,
-                  onPause,
-                  onResume,
-                  onCancel
-                }
-              ) })
-            ]
+            "aria-label": labels.title
           }
-        )
-      ]
-    }
-  );
+        ),
+        children: [
+          /* @__PURE__ */ jsx(Upload, { className: "size-4" }),
+          activeCount > 0 ? /* @__PURE__ */ jsx("span", { className: "bg-destructive text-destructive-foreground absolute -top-0.5 -right-0.5 flex size-4 items-center justify-center rounded-full text-[10px] leading-none font-medium tabular-nums", children: formatActiveBadge(activeCount) }) : null
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      DropdownMenuContent,
+      {
+        align,
+        className: "w-80 min-w-0 max-w-[calc(100vw-2rem)] overflow-x-hidden p-0",
+        children: [
+          /* @__PURE__ */ jsx("div", { className: "flex items-center justify-between border-b px-4 py-3", children: /* @__PURE__ */ jsx("h4", { className: "font-semibold", children: labels.title }) }),
+          /* @__PURE__ */ jsx("div", { className: "max-h-80 min-w-0 overflow-x-hidden overflow-y-auto p-3", children: /* @__PURE__ */ jsx(
+            FileUploadTray,
+            {
+              jobs: visible,
+              labels,
+              onPause,
+              onResume,
+              onCancel
+            }
+          ) })
+        ]
+      }
+    )
+  ] });
 }
 
 // src/components/upload/createMultipartUploadController.ts
@@ -3942,6 +3468,6 @@ function MatchReview({
   );
 }
 
-export { AuditTimeline, AvatarEditor, AvatarEditorDialog, COOKIE_CONSENT_MAX_AGE, COOKIE_CONSENT_NAME, COOKIE_CONSENT_VALUES, ConfirmDestructiveDialog, CookieConsentBanner, CostBreakdownCard, DEFAULT_AUDIT_TIMELINE_LABELS, DEFAULT_COOKIE_CONSENT_BANNER_LABELS, DEFAULT_EDITABLE_SECTION_LABELS, DEFAULT_ENTITY_GRAPH_LABELS, DEFAULT_FILE_DROPZONE_LABELS, DEFAULT_FILE_UPLOAD_LABELS, DEFAULT_FILE_UPLOAD_TRAY_LABELS, DEFAULT_LEGAL_ACCEPT_CHECKBOX_LABELS, DEFAULT_LEGAL_ACCEPT_DIALOG_LABELS, DEFAULT_MATCH_REVIEW_LABELS, DEFAULT_NOTIFICATION_BELL_LABELS, DEFAULT_RISK_BADGE_LABELS, DataList, DataListItem, DimensionBreakdownTable, EditableSection, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyState, EmptyTitle, EntityGraph, ErrorState, FieldMessage, FileDropzone, FileUploadMenu, FileUploadTray, LanguageContext, LanguageSwitcher, LegalAcceptCheckbox, LegalAcceptDialog, LegalMarkdown, LoadingState, MatchReview, MetricChartCard, MetricEmptyState, MetricSkeleton, NotificationBell, RiskBadge, SafeImage, SparklineStat, StatHighlightCard, THEME_INIT_SCRIPT, THEME_INIT_SCRIPT_ID, THEME_STORAGE_KEY, TIME_RANGE_OPTIONS, ThemeSwitcher, TimeRangePicker, avatarFallbackStyle, cn, cookieConsentAllowsReplay, cookieDomainFromHostname, createMultipartUploadController, defaultLanguages, fileMatchesAccept, getAvatarColors, getInitials, isCookieConsentValue, isEmbeddedWindow, matchClaimIsUnverified, parseCookieConsent, partRanges, progressFromBytes, readCookieConsent, serializeCookieConsent, sourceUrlIsHttps, useEditableSection, useLanguageContext, useMediaQuery2 as useMediaQuery, writeCookieConsent };
+export { AuditTimeline, AvatarEditor, AvatarEditorDialog, COOKIE_CONSENT_MAX_AGE, COOKIE_CONSENT_NAME, COOKIE_CONSENT_VALUES, ConfirmDestructiveDialog, CookieConsentBanner, CostBreakdownCard, DEFAULT_AUDIT_TIMELINE_LABELS, DEFAULT_COOKIE_CONSENT_BANNER_LABELS, DEFAULT_EDITABLE_SECTION_LABELS, DEFAULT_ENTITY_GRAPH_LABELS, DEFAULT_FILE_DROPZONE_LABELS, DEFAULT_FILE_UPLOAD_LABELS, DEFAULT_FILE_UPLOAD_TRAY_LABELS, DEFAULT_LEGAL_ACCEPT_CHECKBOX_LABELS, DEFAULT_LEGAL_ACCEPT_DIALOG_LABELS, DEFAULT_MATCH_REVIEW_LABELS, DEFAULT_NOTIFICATION_BELL_LABELS, DEFAULT_RISK_BADGE_LABELS, DataList, DataListItem, DimensionBreakdownTable, EditableSection, Empty2 as Empty, EmptyContent2 as EmptyContent, EmptyDescription2 as EmptyDescription, EmptyHeader2 as EmptyHeader, EmptyMedia2 as EmptyMedia, EmptyState, EmptyTitle2 as EmptyTitle, EntityGraph, ErrorState, Field, FieldMessage, FileDropzone, FileUploadMenu, FileUploadTray, LanguageContext, LanguageSwitcher, LegalAcceptCheckbox, LegalAcceptDialog, LegalMarkdown, ListSkeleton, LoadingState, MatchReview, MetricChartCard, MetricEmptyState, MetricSkeleton, NotificationBell, PageTitle, RiskBadge, SafeImage, SparklineStat, StatHighlightCard, THEME_INIT_SCRIPT, THEME_INIT_SCRIPT_ID, THEME_STORAGE_KEY, TIME_RANGE_OPTIONS, TableSkeleton, ThemeSwitcher, TimeRangePicker, avatarFallbackStyle, cn, cookieConsentAllowsReplay, cookieDomainFromHostname, createMultipartUploadController, defaultLanguages, fileMatchesAccept, getAvatarColors, getInitials, isCookieConsentValue, isEmbeddedWindow, matchClaimIsUnverified, parseCookieConsent, partRanges, progressFromBytes, readCookieConsent, serializeCookieConsent, sourceUrlIsHttps, useEditableSection, useLanguageContext, useMediaQuery2 as useMediaQuery, writeCookieConsent };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map