@eqtylab/equality 0.0.0

package/dist/index.js

@@ -0,0 +1,3134 @@
+import * as React15 from 'react';
+import { forwardRef, useRef, useMemo, useEffect, useSyncExternalStore, useState } from 'react';
+import { cva } from 'class-variance-authority';
+import styles from './alert.module.module.css.module.css';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
+import styles3 from './alert-dialog.module.module.css.module.css';
+import { Slot } from '@radix-ui/react-slot';
+import styles2 from './button.module.module.css.module.css';
+import * as AvatarPrimitive from '@radix-ui/react-avatar';
+import styles4 from './avatar.module.module.css.module.css';
+import * as LucideIcons from 'lucide-react';
+import { Check, ChevronRight, Circle, ChevronDown, ChevronUp, X, SearchIcon, CalendarDays, ChevronLeft, Grid3X3, List, AlertOctagon, Home, Search, ArrowUp, ArrowDown, ArrowUpDown, TriangleAlert } from 'lucide-react';
+import styles7 from './badge.module.module.css.module.css';
+import styles5 from './icon.module.module.css.module.css';
+import * as TooltipPrimitive from '@radix-ui/react-tooltip';
+import styles6 from './tooltip.module.module.css.module.css';
+import styles8 from './bg-gradient.module.module.css.module.css';
+import styles9 from './resource-badge.module.module.css.module.css';
+import styles10 from './card-content-header.module.module.css.module.css';
+import styles11 from './card.module.module.css.module.css';
+import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
+import styles12 from './checkbox.module.module.css.module.css';
+import { Prism } from 'react-syntax-highlighter';
+import darkStyle from 'react-syntax-highlighter/dist/esm/styles/prism/a11y-dark';
+import lightStyle from 'react-syntax-highlighter/dist/esm/styles/prism/prism';
+import styles14 from './code-block.module.module.css.module.css';
+import styles13 from './icon-button.module.module.css.module.css';
+import { Command as Command$1 } from 'cmdk';
+import styles16 from './command.module.module.css.module.css';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+import styles15 from './dialog.module.module.css.module.css';
+import styles18 from './date-range-picker.module.module.css.module.css';
+import * as PopoverPrimitive from '@radix-ui/react-popover';
+import styles17 from './popover.module.module.css.module.css';
+import Truncate from 'react-truncate-inside';
+import styles19 from './display-field.module.module.css.module.css';
+import { Drawer as Drawer$1 } from 'vaul';
+import styles20 from './drawer.module.module.css.module.css';
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+import styles21 from './dropdown-menu.module.module.css.module.css';
+import styles22 from './empty-table-state.module.module.css.module.css';
+import styles23 from './filter-dropdown.module.module.css.module.css';
+import { useFormContext, FormProvider, Controller } from 'react-hook-form';
+import styles25 from './form.module.module.css.module.css';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import styles24 from './label.module.module.css.module.css';
+import styles26 from './info-card.module.module.css.module.css';
+import styles27 from './input.module.module.css.module.css';
+import styles28 from './list-or-grid-view-toggle.module.module.css.module.css';
+import styles30 from './loading-overlay.module.module.css.module.css';
+import styles29 from './spinner.module.module.css.module.css';
+import styles31 from './metric-card.module.module.css.module.css';
+import { AnimatePresence, motion } from 'motion/react';
+import styles32 from './motion-collapsible.module.module.css.module.css';
+import styles33 from './page-not-found.module.module.css.module.css';
+import styles35 from './pagination.module.module.css.module.css';
+import * as SelectPrimitive from '@radix-ui/react-select';
+import styles34 from './select.module.module.css.module.css';
+import styles36 from './panel-label.module.module.css.module.css';
+import * as ProgressPrimitive from '@radix-ui/react-progress';
+import styles37 from './progress.module.module.css.module.css';
+import styles38 from './radial-graph.module.module.css.module.css';
+import styles39 from './radio-dropdown.module.module.css.module.css';
+import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
+import styles40 from './radio-group.module.module.css.module.css';
+import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
+import styles41 from './scroll-area.module.module.css.module.css';
+import styles42 from './search-bar.module.module.css.module.css';
+import styles43 from './section-heading.module.module.css.module.css';
+import * as SeparatorPrimitive from '@radix-ui/react-separator';
+import styles44 from './separator.module.module.css.module.css';
+import styles45 from './sheet.module.module.css.module.css';
+import styles46 from './skeleton.module.module.css.module.css';
+import styles47 from './sort-selector.module.module.css.module.css';
+import * as SwitchPrimitives from '@radix-ui/react-switch';
+import styles48 from './switch.module.module.css.module.css';
+import styles49 from './sort-button.module.module.css.module.css';
+import styles50 from './table-components.module.module.css.module.css';
+import styles51 from './table.module.module.css.module.css';
+import * as TabsPrimitive from '@radix-ui/react-tabs';
+import styles52 from './tabs-components.module.module.css.module.css';
+import styles53 from './tabs.module.module.css.module.css';
+import styles54 from './textarea.module.module.css.module.css';
+import * as ToastPrimitives from '@radix-ui/react-toast';
+import styles55 from './toast-components.module.module.css.module.css';
+import styles56 from './toast.module.module.css.module.css';
+import styles57 from './truncated-description.module.module.css.module.css';
+import styles58 from './heading.module.module.css.module.css';
+import styles59 from './control-status-badge.module.module.css.module.css';
+import styles60 from './theme.module.module.css.module.css';
+
+// src/components/alert/alert.tsx
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+function getThemeProviderRoot() {
+  return document.getElementById("equality-theme-provider-root-portal");
+}
+var alertVariants = cva(styles["alert"], {
+  variants: {
+    variant: {
+      default: styles["alert--default"],
+      success: styles["alert--success"],
+      warning: styles["alert--warning"],
+      danger: styles["alert--danger"]
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
+});
+var Alert = React15.forwardRef(({ className, variant, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, role: "alert", className: cn(alertVariants({ variant }), className), ...props }));
+Alert.displayName = "Alert";
+var AlertTitle = React15.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("h5", { ref, className: cn(styles["alert-title"], className), ...props })
+);
+AlertTitle.displayName = "AlertTitle";
+var AlertDescription = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn(styles["alert-description"], className), ...props }));
+AlertDescription.displayName = "AlertDescription";
+var buttonVariants = cva(styles2["button"], {
+  variants: {
+    variant: {
+      primary: styles2["button--primary"],
+      danger: styles2["button--danger"],
+      secondary: styles2["button--secondary"],
+      tertiary: styles2["button--tertiary"],
+      link: styles2["button--link"]
+    },
+    size: {
+      sm: styles2["size--sm"],
+      md: styles2["size--md"],
+      lg: styles2["size--lg"]
+    }
+  },
+  defaultVariants: {
+    variant: "primary",
+    size: "md"
+  }
+});
+var Button = React15.forwardRef(
+  ({ className, variant, size, asChild = false, prefix, suffix, children, ...props }, ref) => {
+    const isLink = "href" in props && props.href;
+    if (isLink) {
+      const { href, target, rel, download, ...anchorProps } = props;
+      return /* @__PURE__ */ jsxs(
+        "a",
+        {
+          href,
+          target,
+          rel,
+          download,
+          className: cn(buttonVariants({ variant, size, className })),
+          ref,
+          ...anchorProps,
+          children: [
+            prefix,
+            children,
+            suffix
+          ]
+        }
+      );
+    }
+    const Comp = asChild ? Slot : "button";
+    return /* @__PURE__ */ jsxs(
+      Comp,
+      {
+        className: cn(buttonVariants({ variant, size, className })),
+        ref,
+        ...props,
+        children: [
+          prefix,
+          children,
+          suffix
+        ]
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+var AlertDialog = AlertDialogPrimitive.Root;
+var AlertDialogTrigger = AlertDialogPrimitive.Trigger;
+var AlertDialogPortal = ({ children }) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Portal, { container: getThemeProviderRoot(), children });
+var AlertDialogOverlay = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  AlertDialogPrimitive.Overlay,
+  {
+    className: cn(styles3["alert-dialog-overlay"], className),
+    ...props,
+    ref
+  }
+));
+AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName;
+var AlertDialogContent = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [
+  /* @__PURE__ */ jsx(AlertDialogOverlay, {}),
+  /* @__PURE__ */ jsx(
+    AlertDialogPrimitive.Content,
+    {
+      ref,
+      className: cn(styles3["alert-dialog-content"], className),
+      ...props
+    }
+  )
+] }));
+AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName;
+var AlertDialogHeader = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn(styles3["alert-dialog-header"], className), ...props });
+AlertDialogHeader.displayName = "AlertDialogHeader";
+var AlertDialogFooter = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn(styles3["alert-dialog-footer"], className), ...props });
+AlertDialogFooter.displayName = "AlertDialogFooter";
+var AlertDialogTitle = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  AlertDialogPrimitive.Title,
+  {
+    ref,
+    className: cn(styles3["alert-dialog-title"], className),
+    ...props
+  }
+));
+AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName;
+var AlertDialogDescription = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  AlertDialogPrimitive.Description,
+  {
+    ref,
+    className: cn(styles3["alert-dialog-description"], className),
+    ...props
+  }
+));
+AlertDialogDescription.displayName = AlertDialogPrimitive.Description.displayName;
+var AlertDialogAction = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  AlertDialogPrimitive.Action,
+  {
+    ref,
+    className: cn(buttonVariants({ variant: "primary", size: "sm" }), className),
+    ...props
+  }
+));
+AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName;
+var AlertDialogCancel = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  AlertDialogPrimitive.Cancel,
+  {
+    ref,
+    className: cn(
+      buttonVariants({ variant: "tertiary", size: "sm" }),
+      styles3["alert-dialog-cancel"],
+      className
+    ),
+    ...props
+  }
+));
+AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName;
+var Avatar = React15.forwardRef(
+  ({ className, size = "md", shape = "circle", ...props }, ref) => /* @__PURE__ */ jsx(
+    AvatarPrimitive.Root,
+    {
+      ref,
+      className: cn(styles4.avatar, styles4[size], styles4[shape], className),
+      ...props
+    }
+  )
+);
+Avatar.displayName = AvatarPrimitive.Root.displayName;
+var AvatarImage = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(AvatarPrimitive.Image, { ref, className: cn(styles4["avatar-image"], className), ...props }));
+AvatarImage.displayName = AvatarPrimitive.Image.displayName;
+var AvatarFallback = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  AvatarPrimitive.Fallback,
+  {
+    ref,
+    className: cn(styles4["avatar-fallback"], className),
+    ...props
+  }
+));
+AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;
+var ELEVATION = {
+  SUNKEN: "sunken",
+  BASE: "base",
+  RAISED: "raised",
+  OVERLAY: "overlay",
+  FLOATING: "floating"
+};
+var generateElevationVariants = (styles61, baseClassName, defaultElevation) => {
+  const classNames = {};
+  Object.values(ELEVATION).forEach((elevation) => {
+    classNames[elevation] = styles61[`${baseClassName}--${elevation}`];
+  });
+  const variants = cva(styles61[baseClassName], {
+    variants: {
+      elevation: classNames
+    },
+    defaultVariants: {
+      elevation: defaultElevation
+    }
+  });
+  return variants;
+};
+var getRelativeElevation = (elevation, offset) => {
+  const elevationIndex = Object.values(ELEVATION).indexOf(elevation);
+  const newElevationIndex = elevationIndex + offset;
+  const relativeElevation = Object.values(ELEVATION)[newElevationIndex];
+  if (!relativeElevation) {
+    console.warn(`Invalid elevation offset: from ${elevation} with offset ${offset}`);
+  }
+  return relativeElevation || elevation;
+};
+var iconVariants = cva(styles5["icon-container"], {
+  variants: {
+    size: {
+      xs: styles5["size--xs"],
+      sm: styles5["size--sm"],
+      md: styles5["size--md"],
+      lg: styles5["size--lg"]
+    },
+    background: {
+      square: styles5["background--square"],
+      circle: styles5["background--circle"],
+      transparent: styles5["background--transparent"]
+    }
+  },
+  defaultVariants: {
+    size: "md",
+    background: "transparent"
+  }
+});
+var iconElevationVariants = generateElevationVariants(styles5, "icon-container", ELEVATION.RAISED);
+var Icon = forwardRef(
+  ({ className, size, background, icon, elevation = ELEVATION.RAISED, ...props }, ref) => {
+    let renderedIcon;
+    if (typeof icon === "string") {
+      const LucideIcon = LucideIcons[icon];
+      if (!LucideIcon) {
+        throw new Error(`Icon "${icon}" not found in lucide-react`);
+      }
+      renderedIcon = /* @__PURE__ */ jsx(LucideIcon, { className: cn(styles5["icon"]) });
+    } else if (React15.isValidElement(icon)) {
+      const existingProps = icon.props;
+      renderedIcon = React15.cloneElement(
+        icon,
+        {
+          ...existingProps,
+          className: cn(styles5["icon"], existingProps.className)
+        }
+      );
+    } else {
+      throw new Error("Icon must be either a string (Lucide icon name) or a React element");
+    }
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(
+          iconVariants({ size, background }),
+          iconElevationVariants({ elevation }),
+          className
+        ),
+        ...props,
+        children: renderedIcon
+      }
+    );
+  }
+);
+Icon.displayName = "Icon";
+var TooltipProvider = TooltipPrimitive.Provider;
+var Tooltip = TooltipPrimitive.Root;
+var TooltipTrigger = TooltipPrimitive.Trigger;
+var TooltipPortal = ({ children }) => /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { container: getThemeProviderRoot(), children });
+var TooltipContent = React15.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx(TooltipPortal, { children: /* @__PURE__ */ jsxs(
+  TooltipPrimitive.Content,
+  {
+    ref,
+    sideOffset,
+    className: cn(styles6["tooltip-content"], className),
+    ...props,
+    children: [
+      props.children,
+      /* @__PURE__ */ jsx(TooltipPrimitive.Arrow, { width: 18, height: 6, className: styles6["tooltip-arrow"] })
+    ]
+  }
+) }));
+TooltipContent.displayName = TooltipPrimitive.Content.displayName;
+var XIcon = X;
+var badgeVariants = cva(styles7["badge"], {
+  variants: {
+    variant: {
+      primary: styles7["badge--primary"],
+      danger: styles7["badge--danger"],
+      neutral: styles7["badge--neutral"],
+      warning: styles7["badge--warning"],
+      success: styles7["badge--success"]
+    }
+  },
+  defaultVariants: {
+    variant: "primary"
+  }
+});
+var defaultVariantIcons = {
+  success: "Check",
+  warning: "OctagonAlert",
+  danger: "TriangleAlert"
+};
+function Badge({
+  className,
+  variant,
+  closeable,
+  handleClosable,
+  truncate = false,
+  truncateLength = 50,
+  icon,
+  display = "both",
+  ...props
+}) {
+  const effectiveIcon = icon ?? (variant ? defaultVariantIcons[variant] : void 0);
+  const renderClosable = () => {
+    if (closeable && handleClosable)
+      return /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "tertiary",
+          size: "sm",
+          onClick: handleClosable,
+          className: styles7["closable-btn"],
+          children: /* @__PURE__ */ jsx(XIcon, {})
+        }
+      );
+    return null;
+  };
+  const renderChildren = () => {
+    const children = props.children;
+    if (truncate && typeof children === "string" && children.length > truncateLength) {
+      const displayLabel = children.slice(0, truncateLength) + "...";
+      return /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsxs(Tooltip, { children: [
+        /* @__PURE__ */ jsx(TooltipTrigger, { children: displayLabel }),
+        /* @__PURE__ */ jsx(TooltipContent, { className: styles7["tooltip"], children })
+      ] }) });
+    }
+    return children;
+  };
+  const renderIcon = () => {
+    if (effectiveIcon && display !== "text-only") {
+      return /* @__PURE__ */ jsx(Icon, { icon: effectiveIcon, size: "xs", className: styles7["icon"] });
+    }
+    return null;
+  };
+  const effectiveDisplay = display === "icon-only" && !effectiveIcon ? "both" : display;
+  const shouldShowChildren = effectiveDisplay !== "icon-only";
+  const isIconOnly = effectiveDisplay === "icon-only" && effectiveIcon;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        variant !== null && badgeVariants({ variant }),
+        variant === null && styles7["badge"],
+        isIconOnly && styles7["badge--icon-only"],
+        className
+      ),
+      ...props,
+      children: [
+        renderIcon(),
+        shouldShowChildren && renderChildren(),
+        renderClosable()
+      ]
+    }
+  );
+}
+
+// ../tokens/equality-tokens.json
+var equality_tokens_default = {
+  Light: {
+    color: {
+      brand: {
+        green: {
+          $type: "color",
+          $value: {
+            colorSpace: "display-p3",
+            components: [0.4374, 0.6383, 0.4134],
+            hex: "#70A369"
+          }
+        },
+        primary: {
+          $type: "color",
+          $value: {
+            colorSpace: "display-p3",
+            components: [0.7319, 0.6108, 0.8873],
+            hex: "#BB9CE2"
+          }
+        },
+        red: {
+          $type: "color",
+          $value: {
+            colorSpace: "display-p3",
+            components: [0.8114, 0.4167, 0.3761],
+            hex: "#CF6A60"
+          }
+        },
+        secondary: {
+          $type: "color",
+          $value: {
+            colorSpace: "display-p3",
+            components: [0.3895, 0.4853, 0.8187],
+            hex: "#637CD1"
+          }
+        },
+        yellow: {
+          $type: "color",
+          $value: {
+            colorSpace: "display-p3",
+            components: [0.863, 0.6958, 0.4108],
+            hex: "#DCB169"
+          }
+        }
+      }}
+  }
+};
+var getBrandColors = () => {
+  const brandColors = equality_tokens_default.Light.color.brand;
+  const colors = {};
+  Object.entries(brandColors).forEach(([key, value]) => {
+    if (value.$value) {
+      const hex = value.$value.hex;
+      colors[key] = // Remove alpha channel on hex string (last 2 chars)
+      hex.slice(0, 7) || "#000000";
+    }
+  });
+  return colors;
+};
+var getThemeColour = (theme, brandColors) => {
+  return brandColors[theme] || "#000000";
+};
+var BgGradient = ({
+  theme,
+  placement = "full"
+}) => {
+  const canvasRef = useRef(null);
+  const brandColors = useMemo(() => getBrandColors(), []);
+  useEffect(() => {
+    const canvas = canvasRef.current;
+    if (!canvas) return;
+    const ctx = canvas.getContext("2d");
+    if (!ctx) return;
+    const updateSize = () => {
+      canvas.width = window.innerWidth;
+      canvas.height = window.innerHeight;
+    };
+    updateSize();
+    window.addEventListener("resize", updateSize);
+    const blobs = placement === "full" ? [
+      {
+        x: -0.15,
+        y: -0.15,
+        size: 0.45,
+        animation: { duration: 1e4, offset: 0 }
+      },
+      {
+        x: 1.25,
+        y: 0,
+        size: 0.45,
+        animation: { duration: 12e3, offset: 2e3 }
+      },
+      {
+        x: 0,
+        y: 1.5,
+        size: 0.4,
+        animation: { duration: 14e3, offset: 1e3 }
+      },
+      {
+        x: 0.9,
+        y: 1.25,
+        size: 0.6,
+        animation: { duration: 14e3, offset: 0 }
+      }
+    ] : [
+      {
+        x: -0.1,
+        y: -0.25,
+        size: 0.3,
+        animation: { duration: 1e4, offset: 0 }
+      },
+      {
+        x: 1,
+        y: -0.25,
+        size: 0.3,
+        animation: { duration: 12e3, offset: 2e3 }
+      }
+    ];
+    const themeColourBlobs = getThemeColour(theme, brandColors);
+    let animationFrame;
+    const animate = () => {
+      ctx.clearRect(0, 0, canvas.width, canvas.height);
+      const currentTime = Date.now();
+      blobs.forEach((blob) => {
+        const progress = (currentTime + blob.animation.offset) % blob.animation.duration / blob.animation.duration;
+        const scale = 1 + Math.sin(progress * Math.PI * 2) * 0.2;
+        const moveX = Math.sin(progress * Math.PI * 2) * 0.1;
+        const moveY = Math.cos(progress * Math.PI * 2) * 0.1;
+        const gradient = ctx.createRadialGradient(
+          (blob.x + moveX) * canvas.width,
+          (blob.y + moveY) * canvas.height,
+          0,
+          (blob.x + moveX) * canvas.width,
+          (blob.y + moveY) * canvas.height,
+          blob.size * Math.max(canvas.width, 800) * scale
+        );
+        const opacity = 85;
+        gradient.addColorStop(0, `${themeColourBlobs}${opacity}` || "#00000040");
+        gradient.addColorStop(1, "transparent");
+        ctx.fillStyle = gradient;
+        ctx.fillRect(0, 0, canvas.width, canvas.height);
+      });
+      animationFrame = requestAnimationFrame(animate);
+    };
+    animate();
+    return () => {
+      window.removeEventListener("resize", updateSize);
+      cancelAnimationFrame(animationFrame);
+    };
+  }, [theme, placement, brandColors]);
+  return /* @__PURE__ */ jsx("canvas", { ref: canvasRef, className: styles8["bg-gradient"] });
+};
+var ResourceBadge = ({ type, display = "both" }) => {
+  const config = getTypeConfig(type);
+  return /* @__PURE__ */ jsx(Badge, { icon: config.icon, display, className: config.className, variant: null, children: config.label });
+};
+var getTypeConfig = (type) => {
+  switch (type) {
+    case "agent":
+      return {
+        icon: "Bot",
+        className: styles9["badge--agent"],
+        label: "Agent"
+      };
+    case "benchmark":
+      return {
+        icon: "LineChart",
+        className: styles9["badge--benchmark"],
+        label: "Benchmark"
+      };
+    case "code":
+      return {
+        icon: "Code",
+        className: styles9["badge--code"],
+        label: "Code"
+      };
+    case "compute":
+      return {
+        icon: "Cpu",
+        className: styles9["badge--compute"],
+        label: "Compute"
+      };
+    case "database":
+      return {
+        icon: "Database",
+        className: styles9["badge--database"],
+        label: "Database"
+      };
+    case "dataset":
+      return {
+        icon: "Table",
+        className: styles9["badge--dataset"],
+        label: "Dataset"
+      };
+    case "document":
+      return {
+        icon: "FileText",
+        className: styles9["badge--document"],
+        label: "Document"
+      };
+    case "guard":
+      return {
+        icon: "Shield",
+        className: styles9["badge--guard"],
+        label: "Guard"
+      };
+    case "guardrail":
+      return {
+        icon: "Fence",
+        className: styles9["badge--guardrail"],
+        label: "Guardrail"
+      };
+    case "inference":
+      return {
+        icon: "Zap",
+        className: styles9["badge--inference"],
+        label: "Inference"
+      };
+    case "model":
+      return {
+        icon: "Brain",
+        className: styles9["badge--model"],
+        label: "Model"
+      };
+    case "prompt":
+      return {
+        icon: "MessageSquareText",
+        className: styles9["badge--prompt"],
+        label: "Prompt"
+      };
+    case "system-prompt":
+      return {
+        icon: "MessageSquareCode",
+        className: styles9["badge--system-prompt"],
+        label: "System Prompt"
+      };
+    case "context":
+      return {
+        icon: "MessageSquareQuote",
+        className: styles9["badge--context"],
+        label: "Context"
+      };
+    case "reasoning":
+      return {
+        icon: "MessageSquareMore",
+        className: styles9["badge--reasoning"],
+        label: "Reasoning"
+      };
+    case "token":
+      return {
+        icon: "Coins",
+        className: styles9["badge--token"],
+        label: "Token"
+      };
+    case "tools":
+      return {
+        icon: "Wrench",
+        className: styles9["badge--tools"],
+        label: "Tools"
+      };
+    case "system-parameters":
+      return {
+        icon: "Settings2",
+        className: styles9["badge--system-parameters"],
+        label: "System Parameters"
+      };
+    case "unknown":
+      return {
+        icon: "Box",
+        className: styles9["badge--unknown"],
+        label: "Unknown"
+      };
+  }
+};
+var CardContentHeader = forwardRef(
+  ({ className, icon, heading, onButtonClick, ...props }, ref) => {
+    const shouldRender = heading || onButtonClick;
+    const shouldWrap = !!onButtonClick;
+    if (!shouldRender) {
+      return null;
+    }
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          styles10["card-content-header"],
+          shouldWrap && styles10["card-content-header--wrap"],
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx(Icon, { icon, background: "circle", elevation: "overlay" }),
+          onButtonClick && /* @__PURE__ */ jsx(Button, { className: styles10.button, variant: "tertiary", size: "sm", onClick: onButtonClick, children: "See All" }),
+          heading && /* @__PURE__ */ jsx("h3", { className: cn(styles10.title, onButtonClick && styles10["title--button-click"]), children: heading })
+        ]
+      }
+    );
+  }
+);
+CardContentHeader.displayName = "CardContentHeader";
+var cardElevationVariants = generateElevationVariants(styles11, "card", ELEVATION.RAISED);
+var Card = React15.forwardRef(({ className, hoverGradientClassName, elevation = ELEVATION.RAISED, ...props }, ref) => {
+  const shouldHaveHoverStyle = props.onClick !== void 0;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      className: cn(
+        styles11.card,
+        shouldHaveHoverStyle && styles11["card--hover"],
+        cardElevationVariants({ elevation }),
+        className
+      ),
+      ...props,
+      children: [
+        shouldHaveHoverStyle && /* @__PURE__ */ jsx("div", { className: cn(styles11["card-hover-gradient"], hoverGradientClassName) }),
+        props.children
+      ]
+    }
+  );
+});
+Card.displayName = "Card";
+var CardHeader = React15.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn(styles11["card-header"], className), ...props })
+);
+CardHeader.displayName = "CardHeader";
+var CardTitle = React15.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn(styles11["card-title"], className), ...props })
+);
+CardTitle.displayName = "CardTitle";
+var CardDescription = React15.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn(styles11["card-description"], className), ...props })
+);
+CardDescription.displayName = "CardDescription";
+var CardContent = React15.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn(styles11["card-content"], className), ...props })
+);
+CardContent.displayName = "CardContent";
+var CardFooter = React15.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn(styles11["card-footer"], className), ...props })
+);
+CardFooter.displayName = "CardFooter";
+var CheckIcon = Check;
+var Checkbox = React15.forwardRef(
+  ({ className, icon: Icon3, size = "md", ...props }, ref) => /* @__PURE__ */ jsx(
+    CheckboxPrimitive.Root,
+    {
+      ref,
+      className: cn(styles12.checkbox, styles12[size], className),
+      ...props,
+      children: /* @__PURE__ */ jsx(CheckboxPrimitive.Indicator, { className: styles12.indicator, children: /* @__PURE__ */ jsx(CheckIcon, { className: styles12.check }) })
+    }
+  )
+);
+Checkbox.displayName = CheckboxPrimitive.Root.displayName;
+var iconButtonVariants = cva(styles13["icon-btn"], {
+  variants: {
+    size: {
+      sm: styles13["size--sm"],
+      md: styles13["size--md"],
+      lg: styles13["size--lg"]
+    },
+    variant: {
+      primary: styles13["icon-btn--primary"],
+      danger: styles13["icon-btn--danger"]
+    }
+  },
+  defaultVariants: {
+    size: "sm",
+    variant: "primary"
+  }
+});
+var iconSizeMap = {
+  sm: 16,
+  md: 20,
+  lg: 32
+};
+function IconButton({
+  className,
+  size = "sm",
+  variant = "primary",
+  name,
+  label,
+  href,
+  target,
+  download,
+  disabled,
+  ...props
+}) {
+  const Icon3 = LucideIcons[name];
+  const iconSize = iconSizeMap[size || "sm"];
+  const IconComponent = Icon3;
+  if (!Icon3) {
+    console.warn(`Icon "${name}" not found in lucide-react`);
+    return null;
+  }
+  const content = /* @__PURE__ */ jsx(IconComponent, { size: iconSize });
+  if (href && !disabled) {
+    return /* @__PURE__ */ jsx(
+      "a",
+      {
+        href,
+        target,
+        download,
+        "aria-label": label,
+        rel: target === "_blank" ? "noopener noreferrer" : void 0,
+        className: cn(iconButtonVariants({ size, variant }), className),
+        children: content
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      "aria-label": label,
+      disabled,
+      className: cn(iconButtonVariants({ size, variant }), className),
+      ...props,
+      children: content
+    }
+  );
+}
+function CopyButton({
+  value,
+  label = "Copy to clipboard",
+  size = "sm",
+  className,
+  onClick
+}) {
+  const [copied, setCopied] = React15.useState(false);
+  const handleCopy = async () => {
+    try {
+      if (navigator.clipboard && navigator.clipboard.writeText) {
+        await navigator.clipboard.writeText(value);
+        setCopied(true);
+        setTimeout(() => setCopied(false), 2e3);
+        return;
+      }
+      const textArea = document.createElement("textarea");
+      textArea.value = value;
+      textArea.style.position = "fixed";
+      textArea.style.left = "-999999px";
+      textArea.style.top = "-999999px";
+      document.body.appendChild(textArea);
+      textArea.focus();
+      textArea.select();
+      const successful = document.execCommand("copy");
+      document.body.removeChild(textArea);
+      if (successful) {
+        setCopied(true);
+        setTimeout(() => setCopied(false), 2e3);
+      } else {
+        throw new Error("Copy command failed");
+      }
+    } catch (err) {
+      console.error("Failed to copy text:", err);
+    }
+  };
+  const handleClick = () => {
+    handleCopy();
+    onClick?.();
+  };
+  return /* @__PURE__ */ jsx(
+    IconButton,
+    {
+      name: copied ? "Check" : "Copy",
+      label: copied ? "Copied!" : label,
+      size,
+      onClick: handleClick,
+      className
+    }
+  );
+}
+
+// src/theme/lib/utils.ts
+var STORAGE_KEY = "equality-theme";
+var UPDATE_EVENT = "equality-theme-change";
+var FALLBACK_THEME = "light";
+var getFallbackTheme = (options = {}) => {
+  const { canFallbackToBrowserSettings = false } = options;
+  if (typeof window === "undefined" || !canFallbackToBrowserSettings) {
+    return FALLBACK_THEME;
+  }
+  return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+};
+var getDefaultTheme = () => {
+  const themeProviderRootElement = document.querySelector("[data-equality-theme]") || document.documentElement;
+  if (themeProviderRootElement) {
+    return themeProviderRootElement.getAttribute("data-equality-theme") || void 0;
+  } else {
+    return void 0;
+  }
+};
+var getThemeFromLocalStorage = () => {
+  const safeReadStorage = (key) => {
+    try {
+      return window.localStorage.getItem(key);
+    } catch {
+      return null;
+    }
+  };
+  const themeLocalStorageValue = safeReadStorage(STORAGE_KEY);
+  return themeLocalStorageValue;
+};
+var getThemeFromWindow = () => {
+  return window.__equalityTheme;
+};
+var applyThemeToDom = (theme) => {
+  const themeProviderRootElement = document.querySelector("[data-equality-theme]") || document.documentElement;
+  if (themeProviderRootElement) {
+    themeProviderRootElement.setAttribute("data-equality-theme", theme);
+  }
+};
+var setThemeInLocalStorage = (theme) => {
+  try {
+    window.localStorage.setItem(STORAGE_KEY, theme);
+    window.dispatchEvent(new CustomEvent(UPDATE_EVENT, { detail: theme }));
+  } catch {
+    console.error("Failed to set theme in localStorage");
+  }
+};
+var setThemeOnWindow = (theme) => {
+  window.__equalityTheme = theme;
+  window.dispatchEvent(new CustomEvent(UPDATE_EVENT, { detail: theme }));
+};
+var setTheme = (theme) => {
+  const isUsingLocalStorage = window.__equalityIsUsingLocalStorage;
+  if (isUsingLocalStorage) {
+    setThemeInLocalStorage(theme);
+  } else {
+    setThemeOnWindow(theme);
+  }
+  applyThemeToDom(theme);
+};
+var getCurrentThemeState = (options = {}) => {
+  const { canFallbackToBrowserSettings = false } = options;
+  if (typeof window === "undefined") {
+    return void 0;
+  }
+  const isUsingLocalStorage = window.__equalityIsUsingLocalStorage;
+  const storedTheme = isUsingLocalStorage ? getThemeFromLocalStorage() : getThemeFromWindow();
+  const theme = storedTheme || getDefaultTheme() || getFallbackTheme({ canFallbackToBrowserSettings });
+  if (!storedTheme) {
+    setTheme(theme);
+  }
+  return theme;
+};
+var subscribeToThemeChange = (listener) => {
+  if (typeof window === "undefined") {
+    return () => {
+    };
+  }
+  const isUsingLocalStorage = window.__equalityIsUsingLocalStorage;
+  if (isUsingLocalStorage) {
+    const storageListener = (event) => {
+      if (event.key === STORAGE_KEY) listener();
+    };
+    const updateListener = () => listener();
+    window.addEventListener("storage", storageListener);
+    window.addEventListener(UPDATE_EVENT, updateListener);
+    return () => {
+      window.removeEventListener("storage", storageListener);
+      window.removeEventListener(UPDATE_EVENT, updateListener);
+    };
+  } else {
+    const windowListener = () => {
+      listener();
+    };
+    window.addEventListener(UPDATE_EVENT, windowListener);
+    return () => {
+      window.removeEventListener(UPDATE_EVENT, windowListener);
+    };
+  }
+};
+
+// src/theme/hooks/use-theme.ts
+var subscribe = (listener) => {
+  return subscribeToThemeChange(listener);
+};
+var getSnapshot = () => {
+  return getCurrentThemeState();
+};
+var getServerSnapshot = () => {
+  return void 0;
+};
+var useTheme = () => {
+  const theme = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
+  return [theme, setTheme];
+};
+var WRAP = true;
+var CodeBlock = ({
+  className,
+  title,
+  code,
+  language = "text",
+  variant = "neutral",
+  codeLabel,
+  copy
+}) => {
+  const [theme] = useTheme();
+  return /* @__PURE__ */ jsxs("div", { className: cn(styles14["code-block"], styles14[variant], className), children: [
+    /* @__PURE__ */ jsxs("div", { className: styles14.header, children: [
+      /* @__PURE__ */ jsxs("div", { className: styles14["header-left"], children: [
+        title && /* @__PURE__ */ jsx("span", { className: styles14.title, children: title }),
+        /* @__PURE__ */ jsx(Badge, { variant: "neutral", className: styles14["badge"], children: language })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: styles14["header-right"], children: /* @__PURE__ */ jsx(CopyButton, { value: copy || code, size: "sm" }) })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: cn(styles14.content), children: /* @__PURE__ */ jsx(
+      Prism,
+      {
+        language,
+        style: theme === "dark" ? darkStyle : lightStyle,
+        wrapLines: WRAP,
+        wrapLongLines: WRAP,
+        className: styles14.pre,
+        codeTagProps: { className: cn(styles14.code, { [styles14.wrap]: WRAP }) },
+        children: code
+      }
+    ) }),
+    codeLabel && /* @__PURE__ */ jsx("div", { className: styles14["code-label"], children: /* @__PURE__ */ jsx("p", { className: styles14["code-label-text"], children: codeLabel }) })
+  ] });
+};
+var Dialog = DialogPrimitive.Root;
+var DialogTrigger = DialogPrimitive.Trigger;
+var DialogPortal = ({ children }) => /* @__PURE__ */ jsx(DialogPrimitive.Portal, { container: getThemeProviderRoot(), children });
+var DialogClose = DialogPrimitive.Close;
+var DialogOverlay = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DialogPrimitive.Overlay,
+  {
+    ref,
+    className: cn(styles15["dialog-overlay"], className),
+    ...props
+  }
+));
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+var DialogContainer = React15.forwardRef(({ className, children, size = "md", ...props }, ref) => /* @__PURE__ */ jsxs(DialogPortal, { children: [
+  /* @__PURE__ */ jsx(DialogOverlay, {}),
+  /* @__PURE__ */ jsx(
+    DialogPrimitive.Content,
+    {
+      ref,
+      className: cn(styles15["dialog-content"], styles15[`dialog-content--size-${size}`], className),
+      onCloseAutoFocus: (event) => {
+        event.preventDefault();
+        document.body.style.pointerEvents = "";
+      },
+      ...props,
+      children
+    }
+  )
+] }));
+DialogContainer.displayName = DialogPrimitive.Content.displayName;
+var DialogHeader = ({ className, children, ...props }) => /* @__PURE__ */ jsxs("div", { className: cn(styles15["dialog-header"], className), ...props, children: [
+  /* @__PURE__ */ jsx("div", { className: styles15["dialog-header-content"], children }),
+  /* @__PURE__ */ jsx(DialogPrimitive.Close, { asChild: true, children: /* @__PURE__ */ jsx(IconButton, { name: "X", label: "Close", size: "sm" }) })
+] });
+DialogHeader.displayName = "DialogHeader";
+var DialogFooter = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn(styles15["dialog-footer"], className), ...props });
+DialogFooter.displayName = "DialogFooter";
+var DialogTitle = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(DialogPrimitive.Title, { ref, className: cn(styles15["dialog-title"], className), ...props }));
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
+var DialogDescription = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DialogPrimitive.Description,
+  {
+    ref,
+    className: cn(styles15["dialog-description"], className),
+    ...props
+  }
+));
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
+var DialogContent = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn(styles15["dialog-body"], "styled-vertical-scrollbar", className), ...props });
+DialogContent.displayName = "DialogContent";
+function Command({ className, ...props }) {
+  return /* @__PURE__ */ jsx(Command$1, { "data-slot": "command", className: cn(styles16.command, className), ...props });
+}
+function CommandDialog({
+  title = "Command Palette",
+  description = "Search for a command to run...",
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(Dialog, { ...props, children: [
+    /* @__PURE__ */ jsxs(DialogHeader, { className: styles16["command-dialog-header"], children: [
+      /* @__PURE__ */ jsx(DialogTitle, { children: title }),
+      /* @__PURE__ */ jsx(DialogDescription, { children: description })
+    ] }),
+    /* @__PURE__ */ jsx(DialogContent, { className: styles16["command-dialog-content"], children: /* @__PURE__ */ jsx(Command, { className: styles16["command-dialog-content-inner"], children }) })
+  ] });
+}
+function CommandInput({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs("div", { "data-slot": "command-input-wrapper", className: styles16["command-input"], children: [
+    /* @__PURE__ */ jsx(SearchIcon, { className: styles16["command-input-icon"] }),
+    /* @__PURE__ */ jsx(
+      Command$1.Input,
+      {
+        "data-slot": "command-input",
+        className: cn(styles16["command-input-input"], className),
+        ...props
+      }
+    )
+  ] });
+}
+function CommandList({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    Command$1.List,
+    {
+      "data-slot": "command-list",
+      className: cn(styles16["command-list"], className),
+      ...props
+    }
+  );
+}
+function CommandEmpty({ ...props }) {
+  return /* @__PURE__ */ jsx(
+    Command$1.Empty,
+    {
+      "data-slot": "command-empty",
+      className: styles16["command-empty"],
+      ...props
+    }
+  );
+}
+function CommandGroup({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Command$1.Group,
+    {
+      "data-slot": "command-group",
+      className: cn(styles16["command-group"], className),
+      ...props
+    }
+  );
+}
+function CommandSeparator({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Command$1.Separator,
+    {
+      "data-slot": "command-separator",
+      className: cn(styles16["command-separator"], className),
+      ...props
+    }
+  );
+}
+function CommandItem({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    Command$1.Item,
+    {
+      "data-slot": "command-item",
+      className: cn(styles16["command-item"], className),
+      ...props
+    }
+  );
+}
+function CommandShortcut({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      "data-slot": "command-shortcut",
+      className: cn(styles16["command-shortcut"], className),
+      ...props
+    }
+  );
+}
+var Popover = PopoverPrimitive.Root;
+var PopoverTrigger = PopoverPrimitive.Trigger;
+var PopoverPortal = ({ children }) => /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { container: getThemeProviderRoot(), children });
+var PopoverContent = React15.forwardRef(({ className, align = "center", sideOffset = 4, arrow = false, children, ...props }, ref) => /* @__PURE__ */ jsx(PopoverPortal, { children: /* @__PURE__ */ jsxs(
+  PopoverPrimitive.Content,
+  {
+    ref,
+    align,
+    sideOffset,
+    className: cn(styles17["popover-content"], className),
+    ...props,
+    children: [
+      arrow && /* @__PURE__ */ jsx(PopoverPrimitive.Arrow, { className: styles17["popover-arrow"] }),
+      children
+    ]
+  }
+) }));
+PopoverContent.displayName = PopoverPrimitive.Content.displayName;
+var CalendarDaysIcon = CalendarDays;
+var ChevronLeftIcon = ChevronLeft;
+var ChevronRightIcon = ChevronRight;
+var DateRangePicker = ({ dateRange, onSelect, className }) => {
+  const [selecting, setSelecting] = useState(null);
+  const [displayedMonth, setDisplayedMonth] = useState((/* @__PURE__ */ new Date()).getMonth());
+  const [displayedYear, setDisplayedYear] = useState((/* @__PURE__ */ new Date()).getFullYear());
+  const daysInMonth = new Date(displayedYear, displayedMonth + 1, 0).getDate();
+  const firstDayOfMonth = new Date(displayedYear, displayedMonth, 1).getDay();
+  const days = Array.from(
+    { length: daysInMonth },
+    (_, i) => new Date(displayedYear, displayedMonth, i + 1)
+  );
+  const paddingDays = Array.from({ length: firstDayOfMonth }, (_, _i) => null);
+  const hasSelection = dateRange.from || dateRange.to;
+  const MONTHS = [
+    "January",
+    "February",
+    "March",
+    "April",
+    "May",
+    "June",
+    "July",
+    "August",
+    "September",
+    "October",
+    "November",
+    "December"
+  ];
+  const DAY_HEADERS = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
+  const formatDate = (date) => {
+    return date.toLocaleDateString("en-US", {
+      year: "numeric",
+      month: "2-digit",
+      day: "2-digit"
+    });
+  };
+  const formatRange = (range) => {
+    if (!range.from && !range.to) return "Select Date Range";
+    if (!range.to) return `From ${formatDate(range.from)}`;
+    if (!range.from) return `Until ${formatDate(range.to)}`;
+    return `${formatDate(range.from)} - ${formatDate(range.to)}`;
+  };
+  const isDateSelected = (day, dateRange2) => {
+    const matchesFrom = dateRange2.from && day.getDate() === dateRange2.from.getDate() && day.getMonth() === dateRange2.from.getMonth() && day.getFullYear() === dateRange2.from.getFullYear();
+    const matchesTo = dateRange2.to && day.getDate() === dateRange2.to.getDate() && day.getMonth() === dateRange2.to.getMonth() && day.getFullYear() === dateRange2.to.getFullYear();
+    return !!matchesFrom || !!matchesTo;
+  };
+  const checkIsToday = (day) => {
+    const today = /* @__PURE__ */ new Date();
+    return day.getDate() === today.getDate() && day.getMonth() === today.getMonth() && day.getFullYear() === today.getFullYear();
+  };
+  const goToPreviousMonth = () => {
+    if (displayedMonth === 0) {
+      setDisplayedMonth(11);
+      setDisplayedYear(displayedYear - 1);
+    } else {
+      setDisplayedMonth(displayedMonth - 1);
+    }
+  };
+  const goToNextMonth = () => {
+    if (displayedMonth === 11) {
+      setDisplayedMonth(0);
+      setDisplayedYear(displayedYear + 1);
+    } else {
+      setDisplayedMonth(displayedMonth + 1);
+    }
+  };
+  const isInRange = (date) => {
+    if (!dateRange.from || !dateRange.to) return false;
+    return date >= dateRange.from && date <= dateRange.to;
+  };
+  const handleDateSelect = (selectedDate) => {
+    const startOfDay = (date) => {
+      const d = new Date(date);
+      d.setHours(0, 0, 0, 0);
+      return d;
+    };
+    const endOfDay = (date) => {
+      const d = new Date(date);
+      d.setHours(23, 59, 59, 999);
+      return d;
+    };
+    if (!selecting || !dateRange) {
+      onSelect({ from: startOfDay(selectedDate), to: void 0 });
+      setSelecting("to");
+      return;
+    }
+    if (selecting === "to") {
+      if (dateRange.from && selectedDate < dateRange.from) {
+        onSelect({ from: startOfDay(selectedDate), to: endOfDay(dateRange.from) });
+      } else {
+        onSelect({ from: startOfDay(dateRange.from), to: endOfDay(selectedDate) });
+      }
+      setSelecting(null);
+    }
+  };
+  const clearSelection = () => {
+    onSelect({ from: void 0, to: void 0 });
+    setSelecting(null);
+  };
+  const handleClearClick = (e) => {
+    e.stopPropagation();
+    clearSelection();
+  };
+  return /* @__PURE__ */ jsxs(Popover, { children: [
+    /* @__PURE__ */ jsx("div", { className: styles18["popover-header"], children: /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "tertiary",
+        prefix: /* @__PURE__ */ jsx(CalendarDaysIcon, {}),
+        suffix: hasSelection && /* @__PURE__ */ jsx(
+          IconButton,
+          {
+            name: "X",
+            size: "sm",
+            onClick: handleClearClick,
+            label: "Clear dates"
+          }
+        ),
+        className: cn(dateRange.from && dateRange.to && styles18, className),
+        children: /* @__PURE__ */ jsx("span", { className: styles18["date-range"], children: formatRange(dateRange) })
+      }
+    ) }) }),
+    /* @__PURE__ */ jsxs(PopoverContent, { className: styles18["popover-content"], align: "end", children: [
+      /* @__PURE__ */ jsxs("div", { className: styles18["month-navigation"], children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "tertiary",
+            size: "sm",
+            className: styles18["month-navigation-btn"],
+            onClick: goToPreviousMonth,
+            children: /* @__PURE__ */ jsx(ChevronLeftIcon, {})
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: styles18["month-date-display"], children: [
+          /* @__PURE__ */ jsx("div", { className: styles18["month-date-display-title"], children: `${MONTHS[displayedMonth]} ${displayedYear}` }),
+          selecting && /* @__PURE__ */ jsx("div", { className: styles18["month-date-display-subtitle"], children: selecting === "from" ? "Select start date" : "Select end date" })
+        ] }),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "tertiary",
+            size: "sm",
+            className: styles18["month-navigation-btn"],
+            onClick: goToNextMonth,
+            children: /* @__PURE__ */ jsx(ChevronRightIcon, {})
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: styles18["day-headers"], children: DAY_HEADERS.map((day) => /* @__PURE__ */ jsx("div", { className: styles18["day-headers-inner"], children: day }, day)) }),
+      /* @__PURE__ */ jsxs("div", { className: styles18["calendar-grid"], children: [
+        paddingDays.map((_, index) => /* @__PURE__ */ jsx("div", {}, `padding-${index}`)),
+        days.map((day, index) => {
+          const isSelected = isDateSelected(day, dateRange);
+          const isToday = checkIsToday(day);
+          const inRange = isInRange(day);
+          return /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "tertiary",
+              className: cn(
+                styles18["calendar-day-btn"],
+                isSelected && styles18["calendar-day-btn--selected"],
+                isToday && !isSelected && styles18["calendar-day-btn--today"],
+                inRange && !isSelected && styles18["calendar-day-btn--in-range"]
+              ),
+              onClick: () => handleDateSelect(day),
+              children: day.getDate()
+            },
+            index
+          );
+        })
+      ] })
+    ] })
+  ] });
+};
+var displayFieldVariants = cva("", {
+  variants: {
+    variant: {
+      neutral: styles19["display-field--neutral"],
+      neutralCheck: styles19["display-field--neutral"],
+      success: styles19["display-field--success"],
+      failure: styles19["display-field--failure"]
+    }
+  },
+  defaultVariants: {
+    variant: "neutral"
+  }
+});
+var displayFieldElevationVariants = generateElevationVariants(
+  styles19,
+  "display-field",
+  ELEVATION.BASE
+);
+function DisplayField({
+  className,
+  variant,
+  elevation = ELEVATION.BASE,
+  children,
+  prefix,
+  truncate = false,
+  copy = true,
+  actions,
+  slot,
+  ...props
+}) {
+  const middleTruncationContainerRef = useRef(null);
+  const [middleTruncationWidth, setMiddleTruncationWidth] = useState(void 0);
+  const getIcon = () => {
+    if (variant === "success" || variant === "neutralCheck") {
+      return /* @__PURE__ */ jsx(Check, { className: styles19["icon-width"] });
+    }
+    if (variant === "failure") {
+      return /* @__PURE__ */ jsx(TriangleAlert, { className: styles19["icon-width"] });
+    }
+    return null;
+  };
+  const renderContent = () => {
+    if (truncate === "middle" && typeof children === "string") {
+      return /* @__PURE__ */ jsx("div", { ref: middleTruncationContainerRef, children: /* @__PURE__ */ jsx(Truncate, { text: children, offset: 8, ellipsis: "\u2026", width: middleTruncationWidth }) });
+    }
+    return children;
+  };
+  const getTruncateClass = () => {
+    if (truncate === "middle") return styles19["overflow-hidden"];
+    if (truncate === true) return styles19["truncate"];
+    return styles19["overflow-x-scroll"];
+  };
+  const getValueForCopy = () => {
+    if (typeof children === "string") {
+      return children;
+    }
+    return "";
+  };
+  const showActions = copy || actions;
+  useEffect(() => {
+    const calcMiddleTruncationWidth = () => {
+      const targetW = middleTruncationContainerRef.current?.getBoundingClientRect().width;
+      setMiddleTruncationWidth(targetW);
+    };
+    const observer = new ResizeObserver((entries) => {
+      if (entries.length > 0) {
+        calcMiddleTruncationWidth();
+      }
+    });
+    if (middleTruncationContainerRef.current) {
+      observer.observe(middleTruncationContainerRef.current);
+    }
+    return () => {
+      observer.disconnect();
+    };
+  }, []);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        styles19["display-field"],
+        displayFieldElevationVariants({ elevation }),
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: styles19["display-field-inner"], children: [
+          prefix && /* @__PURE__ */ jsxs("div", { className: cn(styles19["prefix"], displayFieldVariants({ variant })), children: [
+            getIcon(),
+            prefix
+          ] }),
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: cn(styles19["content"], getTruncateClass()),
+              style: { scrollbarWidth: "thin" },
+              children: renderContent()
+            }
+          ),
+          showActions && /* @__PURE__ */ jsxs("div", { className: styles19["actions"], children: [
+            actions,
+            copy && /* @__PURE__ */ jsx(CopyButton, { value: getValueForCopy(), size: "sm" })
+          ] })
+        ] }),
+        slot && /* @__PURE__ */ jsx("div", { className: styles19["slot"], children: /* @__PURE__ */ jsx("div", { className: styles19["slot-inner"], children: slot }) })
+      ]
+    }
+  );
+}
+var Drawer = ({
+  shouldScaleBackground = true,
+  ...props
+}) => /* @__PURE__ */ jsx(Drawer$1.Root, { shouldScaleBackground, ...props });
+Drawer.displayName = "Drawer";
+var DrawerTrigger = Drawer$1.Trigger;
+var DrawerPortal = ({ children }) => /* @__PURE__ */ jsx(Drawer$1.Portal, { container: getThemeProviderRoot(), children });
+var DrawerClose = Drawer$1.Close;
+var DrawerOverlay = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  Drawer$1.Overlay,
+  {
+    ref,
+    className: cn(styles20["drawer-overlay"], className),
+    ...props
+  }
+));
+DrawerOverlay.displayName = Drawer$1.Overlay.displayName;
+var DrawerContent = React15.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(DrawerPortal, { children: [
+  /* @__PURE__ */ jsx(DrawerOverlay, {}),
+  /* @__PURE__ */ jsxs(
+    Drawer$1.Content,
+    {
+      ref,
+      className: cn(styles20["drawer-content"], className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("div", { className: styles20["drawer-content-divider"] }),
+        children
+      ]
+    }
+  )
+] }));
+DrawerContent.displayName = "DrawerContent";
+var DrawerHeader = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn(styles20["drawer-header"], className), ...props });
+DrawerHeader.displayName = "DrawerHeader";
+var DrawerHeaderActions = React15.forwardRef(({ className, rowSpan, style, ...props }, ref) => {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn(styles20["drawer-header-actions"], className),
+      style: { "--row-span": rowSpan },
+      ...props
+    }
+  );
+});
+DrawerHeaderActions.displayName = "DrawerHeaderActions";
+var DrawerFooter = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn(styles20["drawer-footer"], className), ...props });
+DrawerFooter.displayName = "DrawerFooter";
+var DrawerTitle = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Drawer$1.Title, { ref, className: cn(styles20["drawer-title"], className), ...props }));
+DrawerTitle.displayName = Drawer$1.Title.displayName;
+var DrawerDescription = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  Drawer$1.Description,
+  {
+    ref,
+    className: cn(styles20["drawer-description"], className),
+    ...props
+  }
+));
+DrawerDescription.displayName = Drawer$1.Description.displayName;
+var DrawerInnerContent = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn(styles20["drawer-inner-content"], className), ...props });
+DrawerInnerContent.displayName = "DrawerInnerContent";
+var CheckIcon2 = Check;
+var ChevronRightIcon2 = ChevronRight;
+var CircleIcon = Circle;
+var DropdownMenu = DropdownMenuPrimitive.Root;
+var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
+var DropdownMenuGroup = DropdownMenuPrimitive.Group;
+var DropdownMenuPortal = ({ children }) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { container: getThemeProviderRoot(), children });
+var DropdownMenuSub = DropdownMenuPrimitive.Sub;
+var DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
+var DropdownMenuSubTrigger = React15.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+  DropdownMenuPrimitive.SubTrigger,
+  {
+    ref,
+    className: cn(
+      styles21["dropdown-menu-trigger"],
+      inset && styles21["dropdown-menu-inset"],
+      className
+    ),
+    ...props,
+    children: [
+      children,
+      /* @__PURE__ */ jsx(ChevronRightIcon2, { className: "ml-auto" })
+    ]
+  }
+));
+DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
+var DropdownMenuSubContent = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.SubContent,
+  {
+    ref,
+    className: cn(styles21["dropdown-menu-sub-content"], className),
+    ...props
+  }
+));
+DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
+var DropdownMenuContent = React15.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx(DropdownMenuPortal, { children: /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.Content,
+  {
+    ref,
+    sideOffset,
+    className: cn(styles21["dropdown-menu-content"], className),
+    ...props
+  }
+) }));
+DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
+var DropdownMenuItem = React15.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.Item,
+  {
+    ref,
+    className: cn(styles21["dropdown-menu-item"], inset && styles21["dropdown-menu-inset"], className),
+    ...props
+  }
+));
+DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
+var DropdownMenuCheckboxItem = React15.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs(
+  DropdownMenuPrimitive.CheckboxItem,
+  {
+    ref,
+    className: cn(styles21["dropdown-menu-checkbox-item"], className),
+    checked,
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx("span", { className: styles21["dropdown-menu-item-indicator-checkbox"], children: /* @__PURE__ */ jsx(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(CheckIcon2, { className: styles21["icon-size"] }) }) }),
+      children
+    ]
+  }
+));
+DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
+var DropdownMenuRadioItem = React15.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+  DropdownMenuPrimitive.RadioItem,
+  {
+    ref,
+    className: cn(styles21["dropdown-menu-radio-item"], className),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx("span", { className: styles21["dropdown-menu-item-indicator-radio"], children: /* @__PURE__ */ jsx(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(CircleIcon, { className: styles21["radio-icon"] }) }) }),
+      children
+    ]
+  }
+));
+DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
+var DropdownMenuLabel = React15.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.Label,
+  {
+    ref,
+    className: cn(styles21["dropdown-menu-label"], inset && styles21["dropdown-menu-inset"], className),
+    ...props
+  }
+));
+DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
+var DropdownMenuSeparator = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.Separator,
+  {
+    ref,
+    className: cn(styles21["dropdown-menu-separator"], className),
+    ...props
+  }
+));
+DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
+var DropdownMenuShortcut = ({ className, ...props }) => {
+  return /* @__PURE__ */ jsx("span", { className: cn(styles21["dropdown-menu-shortcut"], className), ...props });
+};
+DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
+var EmptyTableState = ({
+  icon,
+  title,
+  description,
+  showClearButton = false,
+  onClear,
+  className
+}) => {
+  const showButton = showClearButton && onClear;
+  return /* @__PURE__ */ jsxs("div", { className: cn(styles22["empty-table-state"], className), children: [
+    /* @__PURE__ */ jsxs("div", { className: styles22["icon-and-title-container"], children: [
+      /* @__PURE__ */ jsx(Icon, { icon, size: "md", background: "circle" }),
+      /* @__PURE__ */ jsx("span", { className: styles22["title"], children: title })
+    ] }),
+    description && /* @__PURE__ */ jsx("span", { className: styles22["description"], children: description }),
+    showButton && /* @__PURE__ */ jsx(Button, { variant: "tertiary", size: "sm", onClick: onClear, className: styles22["clear-button"], children: "Clear Filters" })
+  ] });
+};
+var ChevronDownIcon = ChevronDown;
+var FilterDropdown = ({
+  label,
+  options,
+  selectedFilters,
+  onToggleFilter,
+  onClearAll,
+  buttonClassName,
+  contentClassName
+}) => {
+  const hasSelectedFilters = selectedFilters.length > 0;
+  const filteredOptions = options.filter(
+    (option) => option.value && option.value.trim() !== "" && option.label && option.label.trim() !== ""
+  ).sort((a, b) => a.label.localeCompare(b.label));
+  return /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(Button, { variant: "tertiary", className: cn(styles23["selector-button"], buttonClassName), children: [
+      /* @__PURE__ */ jsxs("span", { className: styles23["selector-button-inner"], children: [
+        label,
+        hasSelectedFilters && /* @__PURE__ */ jsx(Badge, { variant: "primary", children: selectedFilters.length })
+      ] }),
+      /* @__PURE__ */ jsx(ChevronDownIcon, { className: styles23["chevron-icon"] })
+    ] }) }),
+    /* @__PURE__ */ jsxs(
+      DropdownMenuContent,
+      {
+        align: "end",
+        className: cn(styles23["dropdown-menu-content"], contentClassName),
+        children: [
+          /* @__PURE__ */ jsxs(DropdownMenuLabel, { children: [
+            "Filters",
+            hasSelectedFilters && /* @__PURE__ */ jsx(Button, { variant: "link", size: "sm", onClick: onClearAll, children: "Clear all" })
+          ] }),
+          /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+          filteredOptions.map((option) => {
+            const isSelected = selectedFilters.includes(option.value);
+            return /* @__PURE__ */ jsx(
+              DropdownMenuCheckboxItem,
+              {
+                checked: isSelected,
+                onCheckedChange: () => onToggleFilter(option.value),
+                onSelect: (e) => e.preventDefault(),
+                children: option.label
+              },
+              option.value
+            );
+          })
+        ]
+      }
+    )
+  ] });
+};
+var labelVariants = cva(styles24["label"]);
+var Label2 = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(LabelPrimitive.Root, { ref, className: cn(labelVariants(), className), ...props }));
+Label2.displayName = LabelPrimitive.Root.displayName;
+var Form = FormProvider;
+var FormFieldContext = React15.createContext({});
+var FormField = ({
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsx(Controller, { ...props }) });
+};
+var useFormField = () => {
+  const fieldContext = React15.useContext(FormFieldContext);
+  const itemContext = React15.useContext(FormItemContext);
+  const { getFieldState, formState } = useFormContext();
+  const fieldState = getFieldState(fieldContext.name, formState);
+  if (!fieldContext) {
+    throw new Error("useFormField should be used within <FormField>");
+  }
+  const { id } = itemContext;
+  return {
+    id,
+    name: fieldContext.name,
+    formItemId: `${id}-form-item`,
+    formDescriptionId: `${id}-form-item-description`,
+    formMessageId: `${id}-form-item-message`,
+    ...fieldState
+  };
+};
+var FormItemContext = React15.createContext({});
+var FormItem = React15.forwardRef(
+  ({ className, ...props }, ref) => {
+    const id = React15.useId();
+    return /* @__PURE__ */ jsx(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ jsx("div", { ref, className: cn(styles25["form-item"], className), ...props }) });
+  }
+);
+FormItem.displayName = "FormItem";
+var FormLabel = React15.forwardRef(({ className, ...props }, ref) => {
+  const { error, formItemId } = useFormField();
+  return /* @__PURE__ */ jsx(
+    Label2,
+    {
+      ref,
+      className: cn(styles25["form-label"], error && styles25["form-label--failure"], className),
+      htmlFor: formItemId,
+      ...props
+    }
+  );
+});
+FormLabel.displayName = "FormLabel";
+var FormControl = React15.forwardRef(({ ...props }, ref) => {
+  const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
+  return /* @__PURE__ */ jsx(
+    Slot,
+    {
+      ref,
+      id: formItemId,
+      "aria-describedby": !error ? `${formDescriptionId}` : `${formDescriptionId} ${formMessageId}`,
+      "aria-invalid": !!error,
+      ...props
+    }
+  );
+});
+FormControl.displayName = "FormControl";
+var FormDescription = React15.forwardRef(({ className, ...props }, ref) => {
+  const { formDescriptionId } = useFormField();
+  return /* @__PURE__ */ jsx(
+    "p",
+    {
+      ref,
+      id: formDescriptionId,
+      className: cn(styles25["form-description"], className),
+      ...props
+    }
+  );
+});
+FormDescription.displayName = "FormDescription";
+var FormMessage = React15.forwardRef(({ className, children, ...props }, ref) => {
+  const { error, formMessageId } = useFormField();
+  const body = error ? String(error?.message ?? "") : children;
+  if (!body) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx("p", { ref, id: formMessageId, className: cn(styles25["form-message"], className), ...props, children: body });
+});
+FormMessage.displayName = "FormMessage";
+var InfoCard = ({
+  label,
+  description,
+  icon,
+  elevation = ELEVATION.RAISED,
+  className,
+  onClick,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx(Card, { className, onClick, elevation, ...props, children: /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsxs("div", { className: styles26["info-card-content"], children: [
+    /* @__PURE__ */ jsx(
+      Icon,
+      {
+        icon,
+        size: "sm",
+        background: "square",
+        elevation: elevation === ELEVATION.SUNKEN ? ELEVATION.BASE : getRelativeElevation(elevation, -1)
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: styles26["copy-container"], children: [
+      /* @__PURE__ */ jsx("p", { className: styles26["label"], children: label }),
+      /* @__PURE__ */ jsx("div", { className: styles26["description"], children: description })
+    ] })
+  ] }) }) });
+};
+var Input = React15.forwardRef(
+  ({ className, type, prefix, suffix, ...props }, ref) => {
+    return /* @__PURE__ */ jsxs("div", { className: cn(styles27["input-wrapper"], className), children: [
+      prefix && /* @__PURE__ */ jsx("span", { className: styles27["input-prefix"], children: prefix }),
+      /* @__PURE__ */ jsx("input", { type, className: styles27["input-element"], ref, ...props }),
+      suffix && /* @__PURE__ */ jsx("span", { className: styles27["input-suffix"], children: suffix })
+    ] });
+  }
+);
+Input.displayName = "Input";
+var ListOrGridViewToggle = ({
+  viewMode,
+  onViewModeChange,
+  order = ["grid", "list"],
+  className
+}) => {
+  const currentActiveIndex = order.indexOf(viewMode);
+  const handleGridClick = () => {
+    onViewModeChange("grid");
+  };
+  const handleListClick = () => {
+    onViewModeChange("list");
+  };
+  return /* @__PURE__ */ jsxs("div", { className: cn(styles28["list-or-grid-view-toggle"], className), children: [
+    order.map((mode) => {
+      const currentlyActive = mode === viewMode;
+      const Icon3 = mode === "grid" ? Grid3X3 : List;
+      return /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          "aria-label": mode === "grid" ? "Grid view" : "List view",
+          className: cn(
+            styles28["icon-button"],
+            currentlyActive ? styles28["icon-button--active"] : styles28["icon-button--inactive"]
+          ),
+          onClick: mode === "grid" ? handleGridClick : handleListClick,
+          children: /* @__PURE__ */ jsx(Icon3, { size: 16 })
+        },
+        mode
+      );
+    }),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: styles28["active-button-indicator"],
+        style: {
+          transform: `translateX(${currentActiveIndex * 100}%)`,
+          width: `${100 / order.length}%`
+        }
+      }
+    )
+  ] });
+};
+var Spinner = ({ size = "md", variant = "neutral" }) => {
+  return /* @__PURE__ */ jsxs("div", { className: styles29["spinner-container"], children: [
+    /* @__PURE__ */ jsx("div", { className: cn(styles29["spinner"], styles29[size], styles29[variant]) }),
+    /* @__PURE__ */ jsx("div", { className: cn(styles29["spinner-background"], styles29[size]) })
+  ] });
+};
+function LoadingOverlay({ isVisible, message = "Loading..." }) {
+  if (!isVisible) return null;
+  return /* @__PURE__ */ jsx("div", { className: styles30["loading-overlay"], children: /* @__PURE__ */ jsxs("div", { className: styles30["content"], children: [
+    /* @__PURE__ */ jsx(Spinner, { variant: "primary" }),
+    /* @__PURE__ */ jsx("p", { className: styles30["message"], children: message })
+  ] }) });
+}
+var metricCardElevationVariants = generateElevationVariants(
+  styles31,
+  "metric-card",
+  ELEVATION.RAISED
+);
+var VARIANTS = {
+  default: {
+    text: styles31["text-default"],
+    iconBg: styles31["bg-default"]
+  },
+  primary: {
+    text: styles31["text-primary"],
+    iconBg: styles31["bg-primary"]
+  },
+  danger: {
+    text: styles31["text-danger"],
+    iconBg: styles31["bg-danger"]
+  },
+  success: {
+    text: styles31["text-success"],
+    iconBg: styles31["bg-success"]
+  },
+  warning: {
+    text: styles31["text-warning"],
+    iconBg: styles31["bg-warning"]
+  }
+};
+var MetricCard = ({
+  value,
+  label,
+  icon,
+  variant = "default",
+  elevation = ELEVATION.RAISED,
+  className
+}) => {
+  const variantStyles = VARIANTS[variant];
+  return /* @__PURE__ */ jsxs("div", { className: cn(metricCardElevationVariants({ elevation }), className), children: [
+    /* @__PURE__ */ jsxs("div", { className: styles31["value-container"], children: [
+      /* @__PURE__ */ jsx("p", { className: cn(styles31.value), children: value }),
+      /* @__PURE__ */ jsx(
+        Icon,
+        {
+          icon,
+          size: "md",
+          background: "circle",
+          className: cn(variantStyles.iconBg, variantStyles.text)
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("p", { className: styles31.label, children: label })
+  ] });
+};
+var MotionCollapsibleContent = ({
+  isOpen,
+  children,
+  className
+}) => {
+  const [contentHeight, setContentHeight] = useState(0);
+  const contentRef = useRef(null);
+  useEffect(() => {
+    if (contentRef.current) {
+      const resizeObserver = new ResizeObserver(() => {
+        if (contentRef.current) {
+          setContentHeight(contentRef.current.scrollHeight);
+        }
+      });
+      resizeObserver.observe(contentRef.current);
+      setContentHeight(contentRef.current.scrollHeight);
+      return () => resizeObserver.disconnect();
+    }
+  }, [children]);
+  return /* @__PURE__ */ jsx(AnimatePresence, { initial: false, mode: "wait", children: isOpen && /* @__PURE__ */ jsx(
+    motion.div,
+    {
+      initial: { height: 0, opacity: 0 },
+      animate: { height: contentHeight, opacity: 1 },
+      exit: { height: 0, opacity: 0 },
+      transition: { duration: 0.3, ease: "easeInOut" },
+      className: cn(styles32["motion-collapsible"], className),
+      children: /* @__PURE__ */ jsx("div", { ref: contentRef, children })
+    },
+    "motion-content"
+  ) });
+};
+var OctagonAlert = AlertOctagon;
+var HomeIcon = Home;
+var NotFound = ({
+  className,
+  title = "Oops! Page Not Found",
+  description = "The page or resource you're looking for doesn't exist or has been moved.",
+  showHomeButton = true,
+  onHomeClick = () => window.location.href = "/"
+}) => {
+  return /* @__PURE__ */ jsx("div", { className: cn(styles33["page-not-found"], className), children: /* @__PURE__ */ jsxs("div", { className: styles33["page-not-found-inner"], children: [
+    /* @__PURE__ */ jsx("div", { className: styles33["icon-container"], children: /* @__PURE__ */ jsx(OctagonAlert, { className: styles33["alert-icon"] }) }),
+    /* @__PURE__ */ jsx("h1", { className: styles33["title"], children: title }),
+    /* @__PURE__ */ jsx("p", { className: styles33["description"], children: description }),
+    /* @__PURE__ */ jsx("div", { className: styles33["actions"], children: showHomeButton && /* @__PURE__ */ jsxs(Button, { onClick: onHomeClick, variant: "secondary", children: [
+      /* @__PURE__ */ jsx(HomeIcon, { className: styles33["home-icon"] }),
+      "Return Home"
+    ] }) })
+  ] }) });
+};
+var CheckIcon3 = Check;
+var ChevronDownIcon2 = ChevronDown;
+var ChevronUpIcon = ChevronUp;
+var Select = SelectPrimitive.Root;
+var SelectGroup = SelectPrimitive.Group;
+var SelectValue = SelectPrimitive.Value;
+var SelectTrigger = React15.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(SelectPrimitive.Trigger, { ref, className: cn(styles34["select-trigger"], className), ...props, children: [
+  children,
+  /* @__PURE__ */ jsx(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx(ChevronDownIcon2, { className: cn(styles34["select-icon"], styles34["select-icon--low-opacity"]) }) })
+] }));
+SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
+var SelectScrollUpButton = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  SelectPrimitive.ScrollUpButton,
+  {
+    ref,
+    className: cn(styles34["select-scroll-button"], className),
+    ...props,
+    children: /* @__PURE__ */ jsx(ChevronUpIcon, { className: styles34["select-icon"] })
+  }
+));
+SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
+var SelectScrollDownButton = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  SelectPrimitive.ScrollDownButton,
+  {
+    ref,
+    className: cn(styles34["select-scroll-button"], className),
+    ...props,
+    children: /* @__PURE__ */ jsx(ChevronDownIcon2, { className: styles34["select-icon"] })
+  }
+));
+SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
+var SelectPortal = ({ children }) => /* @__PURE__ */ jsx(SelectPrimitive.Portal, { container: getThemeProviderRoot(), children });
+var selectContentElevationVariants = generateElevationVariants(
+  styles34,
+  "select-content",
+  ELEVATION.OVERLAY
+);
+var SelectContent = React15.forwardRef(({ className, children, position = "popper", elevation = ELEVATION.OVERLAY, ...props }, ref) => /* @__PURE__ */ jsx(SelectPortal, { children: /* @__PURE__ */ jsxs(
+  SelectPrimitive.Content,
+  {
+    ref,
+    className: cn(
+      styles34["select-content"],
+      position === "popper" && styles34["select-content--popper"],
+      selectContentElevationVariants({ elevation }),
+      className
+    ),
+    position,
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx(SelectScrollUpButton, {}),
+      /* @__PURE__ */ jsx(
+        SelectPrimitive.Viewport,
+        {
+          className: cn(
+            styles34["select-viewport"],
+            position === "popper" && styles34["select-viewport--popper"]
+          ),
+          children
+        }
+      ),
+      /* @__PURE__ */ jsx(SelectScrollDownButton, {})
+    ]
+  }
+) }));
+SelectContent.displayName = SelectPrimitive.Content.displayName;
+var SelectLabel = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(SelectPrimitive.Label, { ref, className: cn(styles34["select-label"], className), ...props }));
+SelectLabel.displayName = SelectPrimitive.Label.displayName;
+var SelectItem = React15.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(SelectPrimitive.Item, { ref, className: cn(styles34["select-item"], className), ...props, children: [
+  /* @__PURE__ */ jsx("span", { className: styles34["select-item-indicator"], children: /* @__PURE__ */ jsx(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(CheckIcon3, { className: styles34["select-icon"] }) }) }),
+  /* @__PURE__ */ jsx(SelectPrimitive.ItemText, { children })
+] }));
+SelectItem.displayName = SelectPrimitive.Item.displayName;
+var SelectSeparator = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  SelectPrimitive.Separator,
+  {
+    ref,
+    className: cn(styles34["select-separator"], className),
+    ...props
+  }
+));
+SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
+var ChevronLeftIcon2 = ChevronLeft;
+var ChevronRightIcon3 = ChevronRight;
+var Pagination = ({
+  currentPage,
+  totalItems,
+  filteredItems,
+  itemsPerPage,
+  onPageChange,
+  onItemsPerPageChange,
+  itemsPerPageOptions = [10, 25, 50, 100],
+  showInfo = true,
+  maxVisiblePages = 5,
+  className = "",
+  type = "",
+  scrollTargetRef
+}) => {
+  const totalPages = Math.ceil(filteredItems / itemsPerPage);
+  const startItem = Math.min(filteredItems, 1 + (currentPage - 1) * itemsPerPage);
+  const endItem = Math.min(currentPage * itemsPerPage, filteredItems);
+  const hasFilteredItems = filteredItems > 0;
+  const isFirstPage = currentPage === 1;
+  const isLastPage = currentPage === totalPages;
+  if (totalItems <= itemsPerPageOptions[0]) {
+    return null;
+  }
+  const handlePageChange = (page) => {
+    onPageChange(page);
+    if (scrollTargetRef) {
+      if (typeof scrollTargetRef === "string") {
+        const target = document.getElementById(scrollTargetRef);
+        if (target) {
+          target.scrollIntoView({ behavior: "smooth" });
+        }
+      } else {
+        if (scrollTargetRef.current) {
+          scrollTargetRef.current.scrollIntoView({ behavior: "smooth" });
+        }
+      }
+      const viewport = document.querySelector("[data-radix-scroll-area-viewport]");
+      if (viewport) {
+        viewport.scrollTop = 0;
+      }
+    }
+  };
+  const handleItemsPerPageChange = (value) => {
+    const newItemsPerPage = parseInt(value);
+    onItemsPerPageChange?.(newItemsPerPage);
+    onPageChange(1);
+  };
+  const handlePreviousPage = () => {
+    handlePageChange(Math.max(1, currentPage - 1));
+  };
+  const handleNextPage = () => {
+    handlePageChange(Math.min(totalPages, currentPage + 1));
+  };
+  const getVisiblePages = () => {
+    const pageButtons = [];
+    let startPage = 1;
+    let endPage = totalPages;
+    if (totalPages > maxVisiblePages) {
+      const halfVisible = Math.floor(maxVisiblePages / 2);
+      if (currentPage <= halfVisible + 1) {
+        endPage = maxVisiblePages;
+      } else if (currentPage >= totalPages - halfVisible) {
+        startPage = totalPages - maxVisiblePages + 1;
+      } else {
+        startPage = currentPage - halfVisible;
+        endPage = currentPage + halfVisible;
+      }
+    }
+    for (let i = startPage; i <= endPage; i++) {
+      pageButtons.push(
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: currentPage === i ? "primary" : "tertiary",
+            size: "sm",
+            onClick: () => handlePageChange(i),
+            children: i
+          },
+          i
+        )
+      );
+    }
+    return pageButtons;
+  };
+  return /* @__PURE__ */ jsxs("div", { className: cn(styles35["pagination"], className), children: [
+    /* @__PURE__ */ jsx("div", { className: styles35["info-container"], children: showInfo && hasFilteredItems && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs("span", { children: [
+        "Showing ",
+        startItem,
+        " to"
+      ] }),
+      onItemsPerPageChange ? /* @__PURE__ */ jsxs(Select, { value: itemsPerPage.toString(), onValueChange: handleItemsPerPageChange, children: [
+        /* @__PURE__ */ jsx(SelectTrigger, { children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+        /* @__PURE__ */ jsx(SelectContent, { children: itemsPerPageOptions.map((option) => /* @__PURE__ */ jsx(SelectItem, { value: option.toString(), children: option }, option)) })
+      ] }) : /* @__PURE__ */ jsx("span", { children: endItem }),
+      /* @__PURE__ */ jsxs("span", { children: [
+        "of ",
+        filteredItems,
+        " ",
+        type
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsxs("div", { className: styles35["page-navigation-container"], children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "tertiary",
+          size: "sm",
+          onClick: handlePreviousPage,
+          disabled: isFirstPage,
+          "aria-label": "Previous page",
+          children: /* @__PURE__ */ jsx(ChevronLeftIcon2, {})
+        }
+      ),
+      getVisiblePages(),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "tertiary",
+          size: "sm",
+          onClick: handleNextPage,
+          disabled: isLastPage,
+          "aria-label": "Next page",
+          children: /* @__PURE__ */ jsx(ChevronRightIcon3, {})
+        }
+      )
+    ] })
+  ] });
+};
+var PanelLabel = ({ className, label }) => {
+  return /* @__PURE__ */ jsx("div", { className: cn(styles36["panel-label"], className), children: label });
+};
+var Progress = React15.forwardRef(
+  ({ className, value, color = "primary", ...props }, ref) => /* @__PURE__ */ jsx(ProgressPrimitive.Root, { ref, className: cn(styles37["progress"], className), ...props, children: /* @__PURE__ */ jsx(
+    ProgressPrimitive.Indicator,
+    {
+      className: cn(styles37["progress-indicator"], styles37[color]),
+      style: { transform: `translateX(-${100 - (value || 0)}%)` }
+    }
+  ) })
+);
+Progress.displayName = ProgressPrimitive.Root.displayName;
+var RadialGraph = forwardRef(
+  ({
+    percentage,
+    displayLabel,
+    className,
+    subLabel,
+    graphSize = "md",
+    variant = "primary",
+    ...props
+  }, ref) => {
+    const bars = Array.from({ length: 100 });
+    const label = displayLabel ?? `${Math.round(percentage)}%`;
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(styles38["radial-graph"], styles38[graphSize], className),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx("div", { className: styles38["bars-container"], children: bars.map((_, i) => {
+            const isActive = i < percentage;
+            const delay = `${i * 10}ms`;
+            return /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: styles38["bar"],
+                style: {
+                  transform: `rotate(${i * 3.6}deg)`
+                },
+                children: /* @__PURE__ */ jsxs(
+                  "div",
+                  {
+                    className: cn(
+                      styles38["bar-inner"],
+                      isActive ? styles38["bar-inner--active"] : styles38["bar-inner--inactive"]
+                    ),
+                    style: {
+                      transitionDelay: delay,
+                      animationDelay: delay
+                    },
+                    children: [
+                      /* @__PURE__ */ jsx("div", { className: styles38["bar-background"] }),
+                      /* @__PURE__ */ jsx(
+                        "div",
+                        {
+                          className: cn(
+                            styles38["bar-gradient"],
+                            styles38[`bar-gradient--${variant}`],
+                            isActive ? styles38["bar-gradient--active"] : styles38["bar-gradient--inactive"]
+                          ),
+                          style: {
+                            transitionDelay: delay,
+                            animationDelay: delay
+                          }
+                        }
+                      )
+                    ]
+                  }
+                )
+              },
+              i
+            );
+          }) }),
+          /* @__PURE__ */ jsxs("div", { className: styles38["label-container"], children: [
+            /* @__PURE__ */ jsx("p", { className: cn(styles38["label"], styles38[graphSize]), children: label }),
+            subLabel && /* @__PURE__ */ jsx("p", { className: styles38["sub-label"], children: subLabel })
+          ] })
+        ]
+      }
+    );
+  }
+);
+RadialGraph.displayName = "RadialGraph";
+var ChevronDownIcon3 = ChevronDown;
+var RadioDropdown = ({
+  label,
+  options,
+  selectedValue,
+  onSelect,
+  className
+}) => {
+  const selectedOption = options.find((opt) => opt.value === selectedValue);
+  const hasSelectedCount = selectedOption?.count !== void 0;
+  const filteredOptions = options.filter(
+    (option) => option.value && option.value.trim() !== "" && option.label && option.label.trim() !== ""
+  );
+  return /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(Button, { variant: "tertiary", className, children: [
+      /* @__PURE__ */ jsxs("span", { className: styles39["selector-button-inner"], children: [
+        selectedOption?.label || label,
+        hasSelectedCount && /* @__PURE__ */ jsx(Badge, { variant: "primary", children: selectedOption.count })
+      ] }),
+      /* @__PURE__ */ jsx(ChevronDownIcon3, { className: styles39["chevron-icon"] })
+    ] }) }),
+    /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", className: styles39["dropdown-menu-content"], children: [
+      /* @__PURE__ */ jsx(DropdownMenuLabel, { children: label }),
+      /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+      /* @__PURE__ */ jsx(DropdownMenuRadioGroup, { value: selectedValue, onValueChange: onSelect, children: filteredOptions.map((option) => {
+        const hasCount = option.count !== void 0;
+        return /* @__PURE__ */ jsxs(DropdownMenuRadioItem, { value: option.value, children: [
+          option.label,
+          hasCount && ` (${option.count})`
+        ] }, option.value);
+      }) })
+    ] })
+  ] });
+};
+var CircleIcon2 = Circle;
+var RadioGroup2 = React15.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx(
+    RadioGroupPrimitive.Root,
+    {
+      className: cn(styles40["radio-group"], className),
+      ...props,
+      ref
+    }
+  );
+});
+RadioGroup2.displayName = RadioGroupPrimitive.Root.displayName;
+var RadioGroupItem = React15.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx(
+    RadioGroupPrimitive.Item,
+    {
+      ref,
+      className: cn(styles40["radio-group-item"], className),
+      ...props,
+      children: /* @__PURE__ */ jsx(RadioGroupPrimitive.Indicator, { className: styles40["radio-group-item-indicator"], children: /* @__PURE__ */ jsx(CircleIcon2, { className: styles40["indicator-icon"] }) })
+    }
+  );
+});
+RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;
+var ScrollArea = React15.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(ScrollAreaPrimitive.Root, { ref, className: cn(styles41["scroll-area"], className), ...props, children: [
+  /* @__PURE__ */ jsx(ScrollAreaPrimitive.Viewport, { className: styles41["scroll-area-viewport"], children }),
+  /* @__PURE__ */ jsx(ScrollBar, {}),
+  /* @__PURE__ */ jsx(ScrollAreaPrimitive.Corner, {})
+] }));
+ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
+var ScrollBar = React15.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsx(
+  ScrollAreaPrimitive.ScrollAreaScrollbar,
+  {
+    ref,
+    orientation,
+    className: cn(
+      styles41["scroll-bar"],
+      orientation === "vertical" && styles41["scroll-bar--vertical"],
+      orientation === "horizontal" && styles41["scroll-bar--horizontal"],
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsx(ScrollAreaPrimitive.ScrollAreaThumb, { className: styles41["scroll-area-thumb"] })
+  }
+));
+ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
+var SearchIcon2 = Search;
+var SearchBar = ({
+  searchQuery,
+  setSearchQuery,
+  placeholder = "Search...",
+  className
+}) => {
+  const handleChange = (e) => {
+    setSearchQuery(e.target.value);
+  };
+  const handleClear = () => {
+    setSearchQuery("");
+  };
+  return /* @__PURE__ */ jsx("div", { className: cn(styles42["search-bar"], className), children: /* @__PURE__ */ jsx(
+    Input,
+    {
+      placeholder,
+      value: searchQuery,
+      onChange: handleChange,
+      className: styles42["input"],
+      prefix: /* @__PURE__ */ jsx(SearchIcon2, { className: styles42["search-icon"] }),
+      suffix: searchQuery && /* @__PURE__ */ jsx(
+        IconButton,
+        {
+          name: "XIcon",
+          onClick: handleClear,
+          className: styles42["clear-button"],
+          label: "Clear search"
+        }
+      )
+    }
+  ) });
+};
+var SectionHeading = ({
+  heading,
+  description,
+  renderRightContent,
+  className
+}) => {
+  const hasRightContent = !!renderRightContent;
+  return /* @__PURE__ */ jsxs("div", { className: cn(hasRightContent && styles43["section-heading--right-content"], className), children: [
+    /* @__PURE__ */ jsxs("div", { className: styles43["content"], children: [
+      /* @__PURE__ */ jsx("h3", { className: styles43["heading"], children: heading }),
+      description && /* @__PURE__ */ jsx("p", { className: styles43["description"], children: description })
+    ] }),
+    hasRightContent && renderRightContent()
+  ] });
+};
+var Separator3 = React15.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ jsx(
+  SeparatorPrimitive.Root,
+  {
+    ref,
+    decorative,
+    orientation,
+    className: cn(
+      styles44["separator"],
+      orientation === "horizontal" ? styles44["separator--horizontal"] : styles44["separator--vertical"],
+      className
+    ),
+    ...props
+  }
+));
+Separator3.displayName = SeparatorPrimitive.Root.displayName;
+var Sheet = DialogPrimitive.Root;
+var SheetTrigger = DialogPrimitive.Trigger;
+var SheetClose = DialogPrimitive.Close;
+var SheetPortal = ({ children }) => /* @__PURE__ */ jsx(DialogPrimitive.Portal, { container: getThemeProviderRoot(), children });
+var SheetOverlay = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(DialogPrimitive.Overlay, { className: cn(styles45["sheet-overlay"], className), ...props, ref }));
+SheetOverlay.displayName = DialogPrimitive.Overlay.displayName;
+var sheetVariants = cva(styles45["sheet-content"], {
+  variants: {
+    side: {
+      top: styles45["sheet-content--side-top"],
+      bottom: styles45["sheet-content--side-bottom"],
+      left: styles45["sheet-content--side-left"],
+      right: styles45["sheet-content--side-right"]
+    }
+  },
+  defaultVariants: {
+    side: "right"
+  }
+});
+var SheetContainer = React15.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxs(SheetPortal, { children: [
+  /* @__PURE__ */ jsx(SheetOverlay, {}),
+  /* @__PURE__ */ jsx(DialogPrimitive.Content, { ref, className: cn(sheetVariants({ side }), className), ...props, children })
+] }));
+SheetContainer.displayName = DialogPrimitive.Content.displayName;
+var SheetHeaderIcon = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn(styles45["sheet-header-icon"], className), ...props });
+SheetHeaderIcon.displayName = "SheetHeaderIcon";
+var SheetHeader = ({ className, children, ...props }) => {
+  const childrenArray = React15.Children.toArray(children);
+  const icon = childrenArray.find(
+    (child) => React15.isValidElement(child) && child.type === SheetHeaderIcon
+  );
+  const otherChildren = childrenArray.filter(
+    (child) => !(React15.isValidElement(child) && child.type === SheetHeaderIcon)
+  );
+  return /* @__PURE__ */ jsxs("div", { className: cn(styles45["sheet-header"], className), ...props, children: [
+    icon,
+    /* @__PURE__ */ jsx("div", { className: styles45["sheet-header-text-content"], children: otherChildren }),
+    /* @__PURE__ */ jsx(DialogPrimitive.Close, { asChild: true, children: /* @__PURE__ */ jsx(IconButton, { name: "X", label: "Close", className: styles45["sheet-close"] }) })
+  ] });
+};
+SheetHeader.displayName = "SheetHeader";
+var SheetFooter = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn(styles45["sheet-footer"], className), ...props });
+SheetFooter.displayName = "SheetFooter";
+var SheetTitle = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(DialogPrimitive.Title, { ref, className: cn(styles45["sheet-title"], className), ...props }));
+SheetTitle.displayName = DialogPrimitive.Title.displayName;
+var SheetDescription = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DialogPrimitive.Description,
+  {
+    ref,
+    className: cn(styles45["sheet-description"], className),
+    ...props
+  }
+));
+SheetDescription.displayName = DialogPrimitive.Description.displayName;
+var SheetContent = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn(styles45["sheet-body"], "styled-vertical-scrollbar", className), ...props });
+SheetContent.displayName = "SheetContent";
+function Skeleton({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { className: cn(styles46["skeleton"], className), ...props });
+}
+var ChevronDownIcon4 = ChevronDown;
+function SortSelector({
+  sortField,
+  defaultSortField = "name",
+  sortOrder,
+  defaultSortOrder = "asc",
+  sortMode = "created",
+  setSortField,
+  setSortOrder,
+  setCurrentPage,
+  showDateOptions = true,
+  className
+}) {
+  const options = [
+    { value: "name-asc", label: "Name (A-Z)" },
+    { value: "name-desc", label: "Name (Z-A)" },
+    ...showDateOptions ? sortMode === "created" ? [
+      { value: "createdAt-desc", label: "Recently Created" },
+      { value: "createdAt-asc", label: "Oldest Created" }
+    ] : [
+      { value: "updatedAt-desc", label: "Recently Updated" },
+      { value: "updatedAt-asc", label: "Oldest Updated" }
+    ] : []
+  ];
+  const currentValue = `${sortField}-${sortOrder}`;
+  const currentLabel = options.find((option) => option.value === currentValue)?.label || "Sort";
+  const isDefaultSort = sortField === defaultSortField && sortOrder === defaultSortOrder;
+  const filteredOptions = options.filter(
+    (option) => option.value && option.value.trim() !== "" && option.label && option.label.trim() !== ""
+  );
+  const handleChange = (value) => {
+    const [field, order] = value.split("-");
+    setSortField(field);
+    setSortOrder(order);
+    setCurrentPage?.(1);
+  };
+  const handleReset = () => {
+    setSortField(defaultSortField);
+    setSortOrder(defaultSortOrder);
+    setCurrentPage?.(1);
+  };
+  return /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(Button, { variant: "tertiary", className: cn(styles47["sort-selector-trigger"], className), children: [
+      /* @__PURE__ */ jsx("span", { children: currentLabel }),
+      /* @__PURE__ */ jsx(ChevronDownIcon4, { className: styles47["chevron-down-icon"] })
+    ] }) }),
+    /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", className: styles47["dropdown-menu-content"], children: [
+      /* @__PURE__ */ jsxs(DropdownMenuLabel, { children: [
+        "Sort",
+        !isDefaultSort && /* @__PURE__ */ jsx(Button, { variant: "link", size: "sm", onClick: handleReset, children: "Reset" })
+      ] }),
+      /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+      filteredOptions.map((option) => {
+        const isSelected = currentValue === option.value;
+        return /* @__PURE__ */ jsx(
+          DropdownMenuCheckboxItem,
+          {
+            checked: isSelected,
+            onCheckedChange: () => handleChange(option.value),
+            onSelect: (e) => e.preventDefault(),
+            children: option.label
+          },
+          option.value
+        );
+      })
+    ] })
+  ] });
+}
+var Switch = React15.forwardRef(
+  ({ className, size = "md", variant = "default", thumbIcon, ...props }, ref) => {
+    const iconSize = size === "sm" ? "xs" : size === "md" ? "sm" : "md";
+    return /* @__PURE__ */ jsx(
+      SwitchPrimitives.Root,
+      {
+        className: cn(styles48["switch"], styles48[size], styles48[variant], className),
+        ...props,
+        ref,
+        children: /* @__PURE__ */ jsx(SwitchPrimitives.Thumb, { className: cn(styles48["thumb"], styles48[size]), children: thumbIcon && /* @__PURE__ */ jsx(Icon, { icon: thumbIcon, className: styles48["thumb-icon"], size: iconSize }) })
+      }
+    );
+  }
+);
+Switch.displayName = SwitchPrimitives.Root.displayName;
+var ArrowDownIcon = ArrowDown;
+var ArrowUpIcon = ArrowUp;
+var ArrowUpDownIcon = ArrowUpDown;
+function SortButton({
+  field,
+  children,
+  icon,
+  sortField,
+  sortDirection,
+  onSort
+}) {
+  const isActive = sortField === field;
+  const isAscending = sortDirection === "asc";
+  const handleClick = () => {
+    onSort(field);
+  };
+  return /* @__PURE__ */ jsxs("button", { type: "button", onClick: handleClick, className: styles49["sort-button"], children: [
+    icon,
+    children,
+    /* @__PURE__ */ jsx("div", { className: styles49["arrow-container"], children: isActive ? isAscending ? /* @__PURE__ */ jsx(ArrowUpIcon, {}) : /* @__PURE__ */ jsx(ArrowDownIcon, {}) : /* @__PURE__ */ jsx(ArrowUpDownIcon, { className: styles49["arrow-up-down-icon"] }) })
+  ] });
+}
+var tableElevationVariants = generateElevationVariants(styles50, "table", ELEVATION.RAISED);
+var TableContainer = React15.forwardRef(({ className, elevation = ELEVATION.RAISED, ...props }, ref) => /* @__PURE__ */ jsx("div", { className: (styles50["table"], tableElevationVariants({ elevation })), children: /* @__PURE__ */ jsx("table", { ref, className: styles50["table-inner"], ...props }) }));
+TableContainer.displayName = "Table";
+var TableHeader = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("thead", { ref, className: cn(styles50["table-header"], className), ...props }));
+TableHeader.displayName = "TableHeader";
+var TableBody = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("tbody", { ref, className: cn(styles50["table-body"], className), ...props }));
+TableBody.displayName = "TableBody";
+var TableFooter = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("tfoot", { ref, className: cn(styles50["table-footer"], className), ...props }));
+TableFooter.displayName = "TableFooter";
+var TableRow = React15.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("tr", { ref, className: cn(styles50["table-row"], className), ...props })
+);
+TableRow.displayName = "TableRow";
+var TableHead = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("th", { ref, className: cn(styles50["table-head"], className), ...props }));
+TableHead.displayName = "TableHead";
+var TableCell = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("td", { ref, className: styles50["table-cell"], ...props }));
+TableCell.displayName = "TableCell";
+var TableCaption = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("caption", { ref, className: styles50["table-caption"], ...props }));
+TableCaption.displayName = "TableCaption";
+var tableElevationVariants2 = generateElevationVariants(styles51, "table", ELEVATION.BASE);
+var Table = ({
+  columns,
+  rows,
+  className,
+  border = false,
+  elevation = ELEVATION.BASE
+}) => {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        styles51["table"],
+        border && styles51["table-border"],
+        tableElevationVariants2({ elevation }),
+        className
+      ),
+      children: /* @__PURE__ */ jsxs(TableContainer, { elevation, children: [
+        /* @__PURE__ */ jsx(TableHeader, { children: /* @__PURE__ */ jsx(TableRow, { children: columns.map((column) => /* @__PURE__ */ jsx(TableHead, { className: column.className, children: column.content }, column.key)) }) }),
+        /* @__PURE__ */ jsx(TableBody, { children: rows.map((row) => /* @__PURE__ */ jsx(
+          TableRow,
+          {
+            className: cn(row.className, row.onClick && styles51["table-row-clickable"]),
+            onClick: row.onClick,
+            children: row.cells.map((cell) => /* @__PURE__ */ jsx(TableCell, { className: cell.className, children: cell.content }, cell.key))
+          },
+          row.key
+        )) })
+      ] })
+    }
+  );
+};
+var TabsContainer = TabsPrimitive.Root;
+var TabsList = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(TabsPrimitive.List, { ref, className: cn(styles52["tabs-list"], className), ...props }));
+TabsList.displayName = TabsPrimitive.List.displayName;
+var TabsTrigger = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(TabsPrimitive.Trigger, { ref, className: cn(styles52["tabs-trigger"], className), ...props }));
+TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
+var TabsContent = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(TabsPrimitive.Content, { ref, className: cn(styles52["tabs-content"], className), ...props }));
+TabsContent.displayName = TabsPrimitive.Content.displayName;
+var Tabs = ({ id, items, className, tabsListBackground = "transparent" }) => {
+  const [activeTab, setActiveTab] = useState(items[0].value);
+  const isFilled = tabsListBackground === "filled";
+  const handleValueChange = (newTab) => {
+    setActiveTab(newTab);
+  };
+  const renderIcon = (icon) => {
+    if (icon) {
+      return /* @__PURE__ */ jsx(Icon, { icon, size: "sm", className: styles53["tabs-icon"] });
+    }
+    return null;
+  };
+  const renderActiveStyle = (isActive) => {
+    if (isActive) {
+      return /* @__PURE__ */ jsx(
+        motion.span,
+        {
+          className: cn(
+            styles53["active-tab-indicator"],
+            isFilled ? styles53["active-tab-indicator--filled"] : styles53["active-tab-indicator--transparent"]
+          ),
+          initial: false,
+          layoutId: `${id}-active-tab-indicator`
+        }
+      );
+    }
+    return null;
+  };
+  return /* @__PURE__ */ jsxs(
+    TabsContainer,
+    {
+      value: activeTab,
+      onValueChange: handleValueChange,
+      className: cn(styles53["tabs"], className),
+      children: [
+        /* @__PURE__ */ jsx(
+          TabsList,
+          {
+            className: cn(
+              styles53["tabs-list"],
+              isFilled ? styles53["tabs-list--filled"] : styles53["tabs-list--transparent"]
+            ),
+            children: items.map(({ label, value, icon }) => {
+              const isActive = activeTab === value;
+              return /* @__PURE__ */ jsxs(
+                TabsTrigger,
+                {
+                  value,
+                  className: cn(
+                    styles53["tabs-trigger"],
+                    isFilled ? styles53["tabs-trigger--filled"] : styles53["tabs-trigger--transparent"]
+                  ),
+                  "data-tour": `${value}-tab-overview`,
+                  children: [
+                    renderIcon(icon),
+                    label,
+                    renderActiveStyle(isActive)
+                  ]
+                },
+                value
+              );
+            })
+          }
+        ),
+        items.map(({ value, content }) => /* @__PURE__ */ jsx(TabsContent, { value, className: styles53["content"], children: content }, value))
+      ]
+    }
+  );
+};
+var Textarea = React15.forwardRef(
+  ({ className, ...props }, ref) => {
+    return /* @__PURE__ */ jsx("textarea", { className: cn(styles54["textarea"], className), ref, ...props });
+  }
+);
+Textarea.displayName = "Textarea";
+var XIcon2 = X;
+var ToastProvider = ToastPrimitives.Provider;
+var ToastViewport = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  ToastPrimitives.Viewport,
+  {
+    ref,
+    className: cn(styles55["toast-viewport"], className),
+    ...props
+  }
+));
+ToastViewport.displayName = ToastPrimitives.Viewport.displayName;
+var toastVariants = cva(styles55["toast"], {
+  variants: {
+    variant: {
+      default: styles55["toast--default"],
+      danger: styles55["toast--danger"],
+      warning: styles55["toast--warning"],
+      success: styles55["toast--success"]
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
+});
+var ToastContainer = React15.forwardRef(({ className, variant, ...props }, ref) => {
+  return /* @__PURE__ */ jsx(
+    ToastPrimitives.Root,
+    {
+      ref,
+      className: cn(toastVariants({ variant }), className),
+      ...props
+    }
+  );
+});
+ToastContainer.displayName = ToastPrimitives.Root.displayName;
+var ToastAction = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(ToastPrimitives.Action, { ref, className: cn(styles55["toast-action"], className), ...props }));
+ToastAction.displayName = ToastPrimitives.Action.displayName;
+var ToastClose = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(ToastPrimitives.Close, { ref, className: cn(styles55["toast-close"], className), ...props, children: /* @__PURE__ */ jsx(XIcon2, { className: styles55["toast-close-icon"] }) }));
+ToastClose.displayName = ToastPrimitives.Close.displayName;
+var ToastTitle = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(ToastPrimitives.Title, { ref, className: cn(styles55["toast-title"], className), ...props }));
+ToastTitle.displayName = ToastPrimitives.Title.displayName;
+var ToastDescription = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  ToastPrimitives.Description,
+  {
+    ref,
+    className: cn(styles55["toast-description"], className),
+    ...props
+  }
+));
+ToastDescription.displayName = ToastPrimitives.Description.displayName;
+var TOAST_LIMIT = 1;
+var TOAST_REMOVE_DELAY = 1e6;
+var count = 0;
+function genId() {
+  count = (count + 1) % Number.MAX_SAFE_INTEGER;
+  return count.toString();
+}
+var toastTimeouts = /* @__PURE__ */ new Map();
+var addToRemoveQueue = (toastId) => {
+  if (toastTimeouts.has(toastId)) {
+    return;
+  }
+  const timeout = setTimeout(() => {
+    toastTimeouts.delete(toastId);
+    dispatch({
+      type: "REMOVE_TOAST",
+      toastId
+    });
+  }, TOAST_REMOVE_DELAY);
+  toastTimeouts.set(toastId, timeout);
+};
+var reducer = (state, action) => {
+  switch (action.type) {
+    case "ADD_TOAST":
+      return {
+        ...state,
+        toasts: [action.toast, ...state.toasts].slice(0, TOAST_LIMIT)
+      };
+    case "UPDATE_TOAST":
+      return {
+        ...state,
+        toasts: state.toasts.map((t) => t.id === action.toast.id ? { ...t, ...action.toast } : t)
+      };
+    case "DISMISS_TOAST": {
+      const { toastId } = action;
+      if (toastId) {
+        addToRemoveQueue(toastId);
+      } else {
+        state.toasts.forEach((toast2) => {
+          addToRemoveQueue(toast2.id);
+        });
+      }
+      return {
+        ...state,
+        toasts: state.toasts.map(
+          (t) => t.id === toastId || toastId === void 0 ? {
+            ...t,
+            open: false
+          } : t
+        )
+      };
+    }
+    case "REMOVE_TOAST":
+      if (action.toastId === void 0) {
+        return {
+          ...state,
+          toasts: []
+        };
+      }
+      return {
+        ...state,
+        toasts: state.toasts.filter((t) => t.id !== action.toastId)
+      };
+  }
+};
+var listeners = [];
+var memoryState = { toasts: [] };
+function dispatch(action) {
+  memoryState = reducer(memoryState, action);
+  listeners.forEach((listener) => {
+    listener(memoryState);
+  });
+}
+function toast({ ...props }) {
+  const id = genId();
+  const update = (props2) => dispatch({
+    type: "UPDATE_TOAST",
+    toast: { ...props2, id }
+  });
+  const dismiss = () => dispatch({ type: "DISMISS_TOAST", toastId: id });
+  dispatch({
+    type: "ADD_TOAST",
+    toast: {
+      ...props,
+      id,
+      open: true,
+      onOpenChange: (open) => {
+        if (!open) dismiss();
+      }
+    }
+  });
+  return {
+    id,
+    dismiss,
+    update
+  };
+}
+function useToast() {
+  const [state, setState] = useState(memoryState);
+  useEffect(() => {
+    listeners.push(setState);
+    return () => {
+      const index = listeners.indexOf(setState);
+      if (index > -1) {
+        listeners.splice(index, 1);
+      }
+    };
+  }, []);
+  return {
+    ...state,
+    toast,
+    dismiss: (toastId) => dispatch({ type: "DISMISS_TOAST", toastId })
+  };
+}
+var Toast = ({ toast: toast2 }) => {
+  const { id, title, description, action, ...props } = toast2;
+  return /* @__PURE__ */ jsxs(ToastContainer, { ...props, children: [
+    /* @__PURE__ */ jsxs("div", { className: styles56["toast-copy"], children: [
+      title && /* @__PURE__ */ jsx(ToastTitle, { children: title }),
+      description && /* @__PURE__ */ jsx(ToastDescription, { children: description })
+    ] }),
+    action && /* @__PURE__ */ jsx("div", { className: styles56["toast-action"], children: action }),
+    /* @__PURE__ */ jsx(ToastClose, {})
+  ] });
+};
+var Toaster = () => {
+  const { toasts } = useToast();
+  return toasts.map(function(toast2) {
+    return /* @__PURE__ */ jsx(Toast, { toast: toast2 }, toast2.id);
+  });
+};
+var ToastRoot = () => {
+  return /* @__PURE__ */ jsxs(ToastProvider, { children: [
+    /* @__PURE__ */ jsx(Toaster, {}),
+    /* @__PURE__ */ jsx(ToastViewport, {})
+  ] });
+};
+var TruncatedDescription = ({
+  className,
+  description,
+  maxLength = 120
+}) => {
+  const plainText = removeHtmlTags(description);
+  const isLongDescription = plainText.length > maxLength;
+  const truncatedDescription = isLongDescription ? `${description.slice(0, maxLength)}...` : description;
+  const [expanded, setExpanded] = useState(!isLongDescription);
+  const displayDescription = expanded ? description : truncatedDescription;
+  const handleToggle = (e) => {
+    e.stopPropagation();
+    setExpanded(!expanded);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: cn(styles57["truncated-description"], className), children: [
+    /* @__PURE__ */ jsx("div", { dangerouslySetInnerHTML: { __html: displayDescription } }),
+    isLongDescription && /* @__PURE__ */ jsx(Button, { variant: "link", size: "sm", onClick: handleToggle, children: expanded ? "Show less" : "Show more" })
+  ] });
+};
+var removeHtmlTags = (html) => {
+  return html.replace(/<[^>]*>/g, "");
+};
+var Heading = forwardRef(
+  ({ className, as, displayAs, children, ...props }, ref) => {
+    const displayClasses = {
+      h1: styles58["h1"],
+      h2: styles58["h2"],
+      h3: styles58["h3"],
+      h4: styles58["h4"],
+      h5: styles58["h5"],
+      h6: styles58["h6"]
+    };
+    const displayClass = displayClasses[displayAs] || displayClasses[as];
+    const HeadingTag = as;
+    return /* @__PURE__ */ jsx(HeadingTag, { ref, className: cn(displayClass, className), ...props, children });
+  }
+);
+Heading.displayName = "Heading";
+var ControlStatusBadge = ({ status, display = "both" }) => {
+  const config = getStatusConfig(status);
+  return /* @__PURE__ */ jsx(Badge, { icon: config.icon, display, className: config.className, variant: null, children: config.label });
+};
+var getStatusConfig = (status) => {
+  switch (status) {
+    case "in-progress":
+      return {
+        icon: "Clock",
+        className: styles59["badge--in-progress"],
+        label: "In Progress"
+      };
+    case "not-started":
+      return {
+        icon: "Circle",
+        className: styles59["badge--not-started"],
+        label: "Not Started"
+      };
+    case "ready-for-review":
+      return {
+        icon: "ClipboardCheck",
+        className: styles59["badge--ready-for-review"],
+        label: "Ready for Review"
+      };
+    case "in-review":
+      return {
+        icon: "Eye",
+        className: styles59["badge--in-review"],
+        label: "In Review"
+      };
+    case "comment":
+      return {
+        icon: "MessageCircle",
+        className: styles59["badge--comment"],
+        label: "Comment"
+      };
+    case "not-applicable":
+      return {
+        icon: "MinusCircle",
+        className: styles59["badge--not-applicable"],
+        label: "Not Applicable"
+      };
+    case "accepted":
+      return {
+        icon: /* @__PURE__ */ jsx(MessageCircleCheckIcon, {}),
+        className: styles59["badge--accepted"],
+        label: "Accepted"
+      };
+    case "questioned":
+      return {
+        icon: "MessageCircleQuestion",
+        className: styles59["badge--question"],
+        label: "Questioned"
+      };
+    case "general":
+      return {
+        icon: "MessageCircle",
+        className: styles59["badge--comment"],
+        label: "General"
+      };
+    case "compliant":
+      return {
+        icon: "Check",
+        className: styles59["badge--compliant"],
+        label: "Compliant"
+      };
+    case "non-compliant":
+      return {
+        icon: "X",
+        className: styles59["badge--non-compliant"],
+        label: "Non-compliant"
+      };
+    default:
+      return {
+        icon: "Circle",
+        className: styles59["badge--not-started"],
+        label: status
+      };
+  }
+};
+var MessageCircleCheckIcon = ({ className }) => {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "12",
+      height: "12",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-width": "2",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      children: [
+        /* @__PURE__ */ jsx("path", { d: "M2.992 16.342a2 2 0 0 1 .094 1.167l-1.065 3.29a1 1 0 0 0 1.236 1.168l3.413-.998a2 2 0 0 1 1.099.092 10 10 0 1 0-4.777-4.719" }),
+        /* @__PURE__ */ jsx("path", { d: "m9 12 2 2 4-4" })
+      ]
+    }
+  );
+};
+var Portal8 = () => {
+  return /* @__PURE__ */ jsx("div", { id: "equality-theme-provider-root-portal" });
+};
+var ThemeProvider = ({ customVars, children }) => {
+  return /* @__PURE__ */ jsxs("div", { id: "equality-theme-provider-root", className: styles60.root, style: customVars, children: [
+    children,
+    /* @__PURE__ */ jsx(Portal8, {})
+  ] });
+};
+
+export { Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, Avatar, AvatarFallback, AvatarImage, Badge, BgGradient, Button, Card, CardContent, CardContentHeader, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, CodeBlock, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ControlStatusBadge, CopyButton, DateRangePicker, Dialog, DialogClose, DialogContainer, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DisplayField, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerHeaderActions, DrawerInnerContent, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, ELEVATION, EmptyTableState, FilterDropdown, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, Heading, Icon, IconButton, InfoCard, Input, Label2 as Label, ListOrGridViewToggle, LoadingOverlay, MetricCard, MotionCollapsibleContent, NotFound, Pagination, PanelLabel, Popover, PopoverContent, PopoverTrigger, Progress, RadialGraph, RadioDropdown, RadioGroup2 as RadioGroup, RadioGroupItem, ResourceBadge, ScrollArea, ScrollBar, SearchBar, SectionHeading, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator3 as Separator, Sheet, SheetClose, SheetContainer, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetHeaderIcon, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, SortButton, SortSelector, Spinner, Switch, Table, TableBody, TableCaption, TableCell, TableContainer, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContainer, TabsContent, TabsList, TabsTrigger, Textarea, ThemeProvider, Toast, ToastAction, ToastClose, ToastContainer, ToastDescription, ToastProvider, ToastRoot, ToastTitle, ToastViewport, Toaster, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TruncatedDescription, badgeVariants, buttonVariants, displayFieldVariants, iconButtonVariants, reducer, toast, useFormField, useTheme, useToast };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map