@yuva-devlab/ui 1.3.2 → 1.4.1

package/dist/index.js

@@ -1637,14 +1637,18 @@ import {
 import * as React21 from "react";
 import * as LabelPrimitive from "@radix-ui/react-label";
 import { cva as cva4 } from "class-variance-authority";
-import { jsx as jsx22 } from "react/jsx-runtime";
+import { jsx as jsx22, jsxs as jsxs13 } from "react/jsx-runtime";
 var labelVariants = cva4("dl-label");
-var Label3 = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
+var Label3 = React21.forwardRef(({ className, children, required = false, ...props }, ref) => /* @__PURE__ */ jsxs13(
   LabelPrimitive.Root,
   {
     ref,
     className: cn(labelVariants(), className),
-    ...props
+    ...props,
+    children: [
+      children,
+      required && /* @__PURE__ */ jsx22("span", { className: "dl-label-required text-destructive ml-0.5", children: "*" })
+    ]
   }
 ));
 Label3.displayName = LabelPrimitive.Root.displayName;
@@ -1766,7 +1770,7 @@ HoverCardContent.displayName = HoverCardPrimitive.Content.displayName;
 
 // src/components/input/input.tsx
 import * as React24 from "react";
-import { jsx as jsx25, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs14 } from "react/jsx-runtime";
 var Input = React24.forwardRef(
   ({ className, type, startIcon, endIcon, ...props }, ref) => {
     const inputEl = /* @__PURE__ */ jsx25(
@@ -1786,7 +1790,7 @@ var Input = React24.forwardRef(
     if (!startIcon && !endIcon) {
       return inputEl;
     }
-    return /* @__PURE__ */ jsxs13("div", { className: "dl-input-wrapper", children: [
+    return /* @__PURE__ */ jsxs14("div", { className: "dl-input-wrapper", children: [
       startIcon && /* @__PURE__ */ jsx25("span", { className: "dl-input-icon dl-input-icon--start", children: startIcon }),
       inputEl,
       endIcon && /* @__PURE__ */ jsx25("span", { className: "dl-input-icon dl-input-icon--end", children: endIcon })
@@ -1799,7 +1803,7 @@ Input.displayName = "Input";
 import * as React25 from "react";
 import { OTPInput, OTPInputContext } from "input-otp";
 import { Minus } from "lucide-react";
-import { jsx as jsx26, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx26, jsxs as jsxs15 } from "react/jsx-runtime";
 var InputOTP = React25.forwardRef(({ className, containerClassName, ...props }, ref) => /* @__PURE__ */ jsx26(
   OTPInput,
   {
@@ -1819,7 +1823,7 @@ var InputOTPSlot = React25.forwardRef(({ index, className, ...props }, ref) => {
     hasFakeCaret: false,
     isActive: false
   };
-  return /* @__PURE__ */ jsxs14(
+  return /* @__PURE__ */ jsxs15(
     "div",
     {
       ref,
@@ -1847,7 +1851,7 @@ function Skeleton({ className, ...props }) {
 }
 
 // src/components/loading-state/loading-state.tsx
-import { jsx as jsx28, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx28, jsxs as jsxs16 } from "react/jsx-runtime";
 function LoadingState({
   rows = 3,
   message,
@@ -1855,7 +1859,7 @@ function LoadingState({
   ...props
 }) {
   if (message) {
-    return /* @__PURE__ */ jsxs15("div", { className: cn("dl-loading", className), ...props, children: [
+    return /* @__PURE__ */ jsxs16("div", { className: cn("dl-loading", className), ...props, children: [
       /* @__PURE__ */ jsx28(
         "svg",
         {
@@ -1874,7 +1878,7 @@ function LoadingState({
       /* @__PURE__ */ jsx28("span", { children: message })
     ] });
   }
-  return /* @__PURE__ */ jsxs15("div", { className: cn("dl-loading-skeleton", className), ...props, children: [
+  return /* @__PURE__ */ jsxs16("div", { className: cn("dl-loading-skeleton", className), ...props, children: [
     /* @__PURE__ */ jsx28(Skeleton, { style: { height: "2rem", width: "33.333%" } }),
     /* @__PURE__ */ jsx28("div", { className: "dl-loading-skeleton__list", children: Array.from({ length: rows }).map((_, i) => /* @__PURE__ */ jsx28(
       Skeleton,
@@ -1894,7 +1898,7 @@ function LoadingState({
 import * as React26 from "react";
 import * as MenubarPrimitive from "@radix-ui/react-menubar";
 import { Check as Check4, ChevronRight as ChevronRight4, Circle as Circle3 } from "lucide-react";
-import { jsx as jsx29, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx29, jsxs as jsxs17 } from "react/jsx-runtime";
 function MenubarMenu(props) {
   return /* @__PURE__ */ jsx29(MenubarPrimitive.Menu, { ...props });
 }
@@ -1928,7 +1932,7 @@ var MenubarTrigger = React26.forwardRef(({ className, ...props }, ref) => /* @__
   }
 ));
 MenubarTrigger.displayName = MenubarPrimitive.Trigger.displayName;
-var MenubarSubTrigger = React26.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs16(
+var MenubarSubTrigger = React26.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs17(
   MenubarPrimitive.SubTrigger,
   {
     ref,
@@ -1977,7 +1981,7 @@ var MenubarItem = React26.forwardRef(({ className, inset, ...props }, ref) => /*
   }
 ));
 MenubarItem.displayName = MenubarPrimitive.Item.displayName;
-var MenubarCheckboxItem = React26.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs16(
+var MenubarCheckboxItem = React26.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs17(
   MenubarPrimitive.CheckboxItem,
   {
     ref,
@@ -1991,7 +1995,7 @@ var MenubarCheckboxItem = React26.forwardRef(({ className, children, checked, ..
   }
 ));
 MenubarCheckboxItem.displayName = MenubarPrimitive.CheckboxItem.displayName;
-var MenubarRadioItem = React26.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs16(
+var MenubarRadioItem = React26.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs17(
   MenubarPrimitive.RadioItem,
   {
     ref,
@@ -2032,8 +2036,8 @@ import * as React27 from "react";
 import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
 import { cva as cva5 } from "class-variance-authority";
 import { ChevronDown as ChevronDown2 } from "lucide-react";
-import { jsx as jsx30, jsxs as jsxs17 } from "react/jsx-runtime";
-var NavigationMenu = React27.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs17(
+import { jsx as jsx30, jsxs as jsxs18 } from "react/jsx-runtime";
+var NavigationMenu = React27.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs18(
   NavigationMenuPrimitive.Root,
   {
     ref,
@@ -2057,7 +2061,7 @@ var NavigationMenuList = React27.forwardRef(({ className, ...props }, ref) => /*
 NavigationMenuList.displayName = NavigationMenuPrimitive.List.displayName;
 var NavigationMenuItem = NavigationMenuPrimitive.Item;
 var navigationMenuTriggerStyle = cva5("dl-navigation-menu-trigger");
-var NavigationMenuTrigger = React27.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs17(
+var NavigationMenuTrigger = React27.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs18(
   NavigationMenuPrimitive.Trigger,
   {
     ref,
@@ -2104,7 +2108,7 @@ NavigationMenuIndicator.displayName = NavigationMenuPrimitive.Indicator.displayN
 // src/components/pagination/pagination.tsx
 import * as React28 from "react";
 import { ChevronLeft, ChevronRight as ChevronRight5, MoreHorizontal as MoreHorizontal2 } from "lucide-react";
-import { jsx as jsx31, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx31, jsxs as jsxs19 } from "react/jsx-runtime";
 var Pagination = ({ className, ...props }) => /* @__PURE__ */ jsx31(
   "nav",
   {
@@ -2144,7 +2148,7 @@ PaginationLink.displayName = "PaginationLink";
 var PaginationPrevious = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsxs18(
+}) => /* @__PURE__ */ jsxs19(
   PaginationLink,
   {
     "aria-label": "Go to previous page",
@@ -2158,7 +2162,7 @@ var PaginationPrevious = ({
   }
 );
 PaginationPrevious.displayName = "PaginationPrevious";
-var PaginationNext = ({ className, ...props }) => /* @__PURE__ */ jsxs18(
+var PaginationNext = ({ className, ...props }) => /* @__PURE__ */ jsxs19(
   PaginationLink,
   {
     "aria-label": "Go to next page",
@@ -2175,7 +2179,7 @@ PaginationNext.displayName = "PaginationNext";
 var PaginationEllipsis = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsxs18(
+}) => /* @__PURE__ */ jsxs19(
   "span",
   {
     "aria-hidden": true,
@@ -2191,11 +2195,11 @@ PaginationEllipsis.displayName = "PaginationEllipsis";
 
 // src/components/panel/panel.tsx
 import * as React29 from "react";
-import { jsx as jsx32, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx32, jsxs as jsxs20 } from "react/jsx-runtime";
 var Panel = React29.forwardRef(
   ({ title, meta, children, className, ...props }, ref) => {
-    return /* @__PURE__ */ jsxs19("section", { ref, className: cn("dl-panel", className), ...props, children: [
-      title ? /* @__PURE__ */ jsxs19("div", { className: "dl-panel__header", children: [
+    return /* @__PURE__ */ jsxs20("section", { ref, className: cn("dl-panel", className), ...props, children: [
+      title ? /* @__PURE__ */ jsxs20("div", { className: "dl-panel__header", children: [
         /* @__PURE__ */ jsx32("h2", { className: "dl-panel__title", children: title }),
         meta ? /* @__PURE__ */ jsx32("div", { className: "dl-panel__meta", children: meta }) : null
       ] }) : null,
@@ -2273,8 +2277,8 @@ var ResizableHandle = ({
 // src/components/scroll-area/scroll-area.tsx
 import * as React32 from "react";
 import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
-import { jsx as jsx36, jsxs as jsxs20 } from "react/jsx-runtime";
-var ScrollArea = React32.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs20(
+import { jsx as jsx36, jsxs as jsxs21 } from "react/jsx-runtime";
+var ScrollArea = React32.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs21(
   ScrollAreaPrimitive.Root,
   {
     ref,
@@ -2303,7 +2307,7 @@ ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
 // src/components/searchable-select/searchable-select.tsx
 import * as React33 from "react";
 import { Search as Search2, Plus, Check as Check5, ChevronDown as ChevronDown3 } from "lucide-react";
-import { jsx as jsx37, jsxs as jsxs21 } from "react/jsx-runtime";
+import { jsx as jsx37, jsxs as jsxs22 } from "react/jsx-runtime";
 function SearchableSelect({
   options,
   value,
@@ -2411,8 +2415,8 @@ function SearchableSelect({
     }
   };
   let currentIndex = 0;
-  return /* @__PURE__ */ jsxs21(Popover, { open, onOpenChange: handleOpenChange, children: [
-    /* @__PURE__ */ jsx37(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs21(
+  return /* @__PURE__ */ jsxs22(Popover, { open, onOpenChange: handleOpenChange, children: [
+    /* @__PURE__ */ jsx37(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs22(
       Button,
       {
         id,
@@ -2432,14 +2436,14 @@ function SearchableSelect({
         ]
       }
     ) }),
-    /* @__PURE__ */ jsxs21(
+    /* @__PURE__ */ jsxs22(
       PopoverContent,
       {
         align: "start",
         className: "dl-searchable-select-content",
         onKeyDown: handleKeyDown,
         children: [
-          /* @__PURE__ */ jsxs21("div", { className: "dl-searchable-select-search", children: [
+          /* @__PURE__ */ jsxs22("div", { className: "dl-searchable-select-search", children: [
             /* @__PURE__ */ jsx37(Search2, { className: "dl-searchable-select-search-icon" }),
             /* @__PURE__ */ jsx37(
               Input,
@@ -2458,13 +2462,13 @@ function SearchableSelect({
               ref: listRef,
               onWheel: (e) => e.stopPropagation(),
               className: "dl-searchable-select-list",
-              children: Object.keys(groupedOptions).length === 0 || filteredOptions.length === 0 && !onAddNew ? /* @__PURE__ */ jsx37("div", { className: "dl-searchable-select-empty", children: "No matching options found." }) : Object.entries(groupedOptions).map(([groupName, groupOpts]) => /* @__PURE__ */ jsxs21("div", { className: "py-1", children: [
+              children: Object.keys(groupedOptions).length === 0 || filteredOptions.length === 0 && !onAddNew ? /* @__PURE__ */ jsx37("div", { className: "dl-searchable-select-empty", children: "No matching options found." }) : Object.entries(groupedOptions).map(([groupName, groupOpts]) => /* @__PURE__ */ jsxs22("div", { className: "py-1", children: [
                 groupName !== "Default" && /* @__PURE__ */ jsx37("div", { className: "dl-searchable-select-group-header", children: groupName }),
                 groupOpts.map((option) => {
                   const isSelected = option.value === value;
                   const itemIndex = currentIndex++;
                   const isHighlighted = itemIndex === highlightedIndex;
-                  return /* @__PURE__ */ jsxs21(
+                  return /* @__PURE__ */ jsxs22(
                     "div",
                     {
                       "data-highlighted": isHighlighted,
@@ -2486,7 +2490,7 @@ function SearchableSelect({
               ] }, groupName))
             }
           ),
-          onAddNew && /* @__PURE__ */ jsx37("div", { className: "dl-searchable-select-add", children: /* @__PURE__ */ jsxs21(
+          onAddNew && /* @__PURE__ */ jsx37("div", { className: "dl-searchable-select-add", children: /* @__PURE__ */ jsxs22(
             "button",
             {
               type: "button",
@@ -2508,11 +2512,11 @@ function SearchableSelect({
 import * as React34 from "react";
 import * as SelectPrimitive from "@radix-ui/react-select";
 import { Check as Check6, ChevronDown as ChevronDown4, ChevronUp } from "lucide-react";
-import { jsx as jsx38, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx38, jsxs as jsxs23 } from "react/jsx-runtime";
 var Select = SelectPrimitive.Root;
 var SelectGroup = SelectPrimitive.Group;
 var SelectValue = SelectPrimitive.Value;
-var SelectTrigger = React34.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs22(
+var SelectTrigger = React34.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs23(
   SelectPrimitive.Trigger,
   {
     ref,
@@ -2550,7 +2554,7 @@ var SelectScrollDownButton = React34.forwardRef(({ className, ...props }, ref) =
   }
 ));
 SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
-var SelectContent = React34.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx38(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs22(
+var SelectContent = React34.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx38(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs23(
   SelectPrimitive.Content,
   {
     ref,
@@ -2574,7 +2578,7 @@ var SelectLabel = React34.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 SelectLabel.displayName = SelectPrimitive.Label.displayName;
-var SelectItem = React34.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs22(
+var SelectItem = React34.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs23(
   SelectPrimitive.Item,
   {
     ref,
@@ -2620,7 +2624,7 @@ import * as React36 from "react";
 import * as SheetPrimitive from "@radix-ui/react-dialog";
 import { cva as cva6 } from "class-variance-authority";
 import { X as X2 } from "lucide-react";
-import { jsx as jsx40, jsxs as jsxs23 } from "react/jsx-runtime";
+import { jsx as jsx40, jsxs as jsxs24 } from "react/jsx-runtime";
 var Sheet = SheetPrimitive.Root;
 var SheetTrigger = SheetPrimitive.Trigger;
 var SheetClose = SheetPrimitive.Close;
@@ -2647,9 +2651,9 @@ var sheetVariants = cva6("dl-sheet-content", {
     side: "right"
   }
 });
-var SheetContent = React36.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxs23(SheetPortal, { children: [
+var SheetContent = React36.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxs24(SheetPortal, { children: [
   /* @__PURE__ */ jsx40(SheetOverlay, {}),
-  /* @__PURE__ */ jsxs23(
+  /* @__PURE__ */ jsxs24(
     SheetPrimitive.Content,
     {
       ref,
@@ -2657,7 +2661,7 @@ var SheetContent = React36.forwardRef(({ side = "right", className, children, ..
       "data-side": side,
       ...props,
       children: [
-        /* @__PURE__ */ jsxs23(SheetPrimitive.Close, { className: "dl-sheet-close", children: [
+        /* @__PURE__ */ jsxs24(SheetPrimitive.Close, { className: "dl-sheet-close", children: [
           /* @__PURE__ */ jsx40(X2, { style: { width: "1rem", height: "1rem" } }),
           /* @__PURE__ */ jsx40("span", { className: "sr-only", children: "Close" })
         ] }),
@@ -2721,7 +2725,7 @@ var TooltipContent = React37.forwardRef(({ className, sideOffset = 4, ...props }
 TooltipContent.displayName = TooltipPrimitive.Content.displayName;
 
 // src/components/sidebar/sidebar.tsx
-import { jsx as jsx42, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx42, jsxs as jsxs25 } from "react/jsx-runtime";
 var SIDEBAR_COOKIE_NAME = "sidebar_state";
 var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
 var SIDEBAR_WIDTH = "16rem";
@@ -2841,7 +2845,7 @@ var Sidebar = React38.forwardRef(
       );
     }
     if (isMobile) {
-      return /* @__PURE__ */ jsx42(Sheet, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ jsxs24(
+      return /* @__PURE__ */ jsx42(Sheet, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ jsxs25(
         SheetContent,
         {
           "data-sidebar": "sidebar",
@@ -2852,7 +2856,7 @@ var Sidebar = React38.forwardRef(
           },
           side,
           children: [
-            /* @__PURE__ */ jsxs24(SheetHeader, { className: "sr-only", children: [
+            /* @__PURE__ */ jsxs25(SheetHeader, { className: "sr-only", children: [
               /* @__PURE__ */ jsx42(SheetTitle, { children: "Sidebar" }),
               /* @__PURE__ */ jsx42(SheetDescription, { children: "Displays the mobile sidebar." })
             ] }),
@@ -2861,7 +2865,7 @@ var Sidebar = React38.forwardRef(
         }
       ) });
     }
-    return /* @__PURE__ */ jsxs24(
+    return /* @__PURE__ */ jsxs25(
       "div",
       {
         ref,
@@ -2911,7 +2915,7 @@ var Sidebar = React38.forwardRef(
 Sidebar.displayName = "Sidebar";
 var SidebarTrigger = React38.forwardRef(({ className, onClick, ...props }, ref) => {
   const { toggleSidebar } = useSidebar();
-  return /* @__PURE__ */ jsxs24(
+  return /* @__PURE__ */ jsxs25(
     Button,
     {
       ref,
@@ -3180,7 +3184,7 @@ var SidebarMenuButton = React38.forwardRef(
         children: tooltip
       };
     }
-    return /* @__PURE__ */ jsxs24(Tooltip2, { children: [
+    return /* @__PURE__ */ jsxs25(Tooltip2, { children: [
       /* @__PURE__ */ jsx42(TooltipTrigger, { asChild: true, children: button }),
       /* @__PURE__ */ jsx42(
         TooltipContent,
@@ -3240,7 +3244,7 @@ var SidebarMenuSkeleton = React38.forwardRef(({ className, showIcon = false, ...
   const width = React38.useMemo(() => {
     return `${Math.floor(Math.random() * 40) + 50}%`;
   }, []);
-  return /* @__PURE__ */ jsxs24(
+  return /* @__PURE__ */ jsxs25(
     "div",
     {
       ref,
@@ -3314,8 +3318,8 @@ SidebarMenuSubButton.displayName = "SidebarMenuSubButton";
 // src/components/slider/slider.tsx
 import * as React39 from "react";
 import * as SliderPrimitive from "@radix-ui/react-slider";
-import { jsx as jsx43, jsxs as jsxs25 } from "react/jsx-runtime";
-var Slider = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs25(
+import { jsx as jsx43, jsxs as jsxs26 } from "react/jsx-runtime";
+var Slider = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs26(
   SliderPrimitive.Root,
   {
     ref,
@@ -3377,7 +3381,7 @@ var Toaster = ({ theme: propTheme, ...props }) => {
 
 // src/components/status-badge/status-badge.tsx
 import * as React41 from "react";
-import { jsx as jsx45, jsxs as jsxs26 } from "react/jsx-runtime";
+import { jsx as jsx45, jsxs as jsxs27 } from "react/jsx-runtime";
 var statusCategoryMap = {
   Completed: "dl-status-badge--success",
   COMPLETED: "dl-status-badge--success",
@@ -3401,7 +3405,7 @@ var StatusBadge = React41.forwardRef(
   ({ status, className, ...props }, ref) => {
     const normalizedStatus = status?.trim() ?? "";
     const colorClass = statusCategoryMap[normalizedStatus] ?? "dl-status-badge--muted";
-    return /* @__PURE__ */ jsxs26(
+    return /* @__PURE__ */ jsxs27(
       "span",
       {
         ref,
@@ -3419,7 +3423,7 @@ StatusBadge.displayName = "StatusBadge";
 
 // src/components/status-chip/status-chip.tsx
 import * as React42 from "react";
-import { jsx as jsx46, jsxs as jsxs27 } from "react/jsx-runtime";
+import { jsx as jsx46, jsxs as jsxs28 } from "react/jsx-runtime";
 var statusToneMap = {
   active: "dl-status-chip--primary",
   running: "dl-status-chip--primary",
@@ -3444,7 +3448,7 @@ var statusToneMap = {
 var StatusChip = React42.forwardRef(
   ({ status, className, ...props }, ref) => {
     const toneClass = statusToneMap[status] ?? "dl-status-chip--muted";
-    return /* @__PURE__ */ jsxs27(
+    return /* @__PURE__ */ jsxs28(
       "span",
       {
         ref,
@@ -3626,6 +3630,112 @@ var ToggleGroupItem = React48.forwardRef(({ className, children, variant, size,
   );
 });
 ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName;
+
+// src/components/metric-card/metric-card.tsx
+import * as React49 from "react";
+import { jsx as jsx53, jsxs as jsxs29 } from "react/jsx-runtime";
+var MetricCard = React49.forwardRef(
+  ({ label, value, note, positive, icon, className, ...props }, ref) => {
+    return /* @__PURE__ */ jsxs29("div", { ref, className: cn("dl-metric-card", className), ...props, children: [
+      /* @__PURE__ */ jsxs29("div", { className: "dl-metric-card__header", children: [
+        /* @__PURE__ */ jsx53("span", { className: "dl-metric-card__label", children: label }),
+        icon && /* @__PURE__ */ jsx53("span", { className: "dl-metric-card__icon", children: icon })
+      ] }),
+      /* @__PURE__ */ jsx53("div", { className: "dl-metric-card__value-row", children: /* @__PURE__ */ jsx53("span", { className: "dl-metric-card__value", children: value }) }),
+      note && /* @__PURE__ */ jsx53(
+        "div",
+        {
+          className: cn(
+            "dl-metric-card__note",
+            positive === true && "dl-metric-card__note--positive",
+            positive === false && "dl-metric-card__note--negative"
+          ),
+          children: note
+        }
+      )
+    ] });
+  }
+);
+MetricCard.displayName = "MetricCard";
+var MetricsGrid = React49.forwardRef(
+  ({ children, className, ...props }, ref) => {
+    return /* @__PURE__ */ jsx53("div", { ref, className: cn("dl-metrics-grid", className), ...props, children });
+  }
+);
+MetricsGrid.displayName = "MetricsGrid";
+
+// src/components/copy-button/copy-button.tsx
+import * as React50 from "react";
+import { Check as Check7, Copy } from "lucide-react";
+import { jsx as jsx54, jsxs as jsxs30 } from "react/jsx-runtime";
+var CopyButton = React50.forwardRef(
+  ({
+    textToCopy,
+    label = "Copy",
+    copiedLabel = "Copied",
+    resetTimeoutMs = 2e3,
+    className,
+    onClick,
+    ...props
+  }, ref) => {
+    const [isCopied, setIsCopied] = React50.useState(false);
+    const handleCopy = async (e) => {
+      onClick?.(e);
+      if (e.defaultPrevented) return;
+      try {
+        await navigator.clipboard.writeText(textToCopy);
+        setIsCopied(true);
+        setTimeout(() => setIsCopied(false), resetTimeoutMs);
+      } catch {
+      }
+    };
+    return /* @__PURE__ */ jsxs30(
+      "button",
+      {
+        ref,
+        type: "button",
+        className: cn(
+          "dl-copy-button",
+          isCopied && "dl-copy-button--copied",
+          className
+        ),
+        onClick: handleCopy,
+        ...props,
+        children: [
+          isCopied ? /* @__PURE__ */ jsx54(Check7, { className: "dl-copy-button__icon" }) : /* @__PURE__ */ jsx54(Copy, { className: "dl-copy-button__icon" }),
+          /* @__PURE__ */ jsx54("span", { children: isCopied ? copiedLabel : label })
+        ]
+      }
+    );
+  }
+);
+CopyButton.displayName = "CopyButton";
+
+// src/components/secret-reveal-card/secret-reveal-card.tsx
+import * as React51 from "react";
+import { AlertTriangle } from "lucide-react";
+import { jsx as jsx55, jsxs as jsxs31 } from "react/jsx-runtime";
+var SecretRevealCard = React51.forwardRef(
+  ({
+    secret,
+    warningMessage = "One-time reveal. Please copy and store this credential securely before closing.",
+    copyLabel = "Copy Secret",
+    className,
+    ...props
+  }, ref) => {
+    return /* @__PURE__ */ jsxs31("div", { ref, className: cn("dl-secret-reveal", className), ...props, children: [
+      warningMessage && /* @__PURE__ */ jsxs31("div", { className: "dl-secret-reveal__warning", children: [
+        /* @__PURE__ */ jsx55(AlertTriangle, { className: "shrink-0 size-4" }),
+        /* @__PURE__ */ jsx55("span", { children: warningMessage })
+      ] }),
+      /* @__PURE__ */ jsxs31("div", { className: "dl-secret-reveal__code-wrap", children: [
+        /* @__PURE__ */ jsx55("code", { className: "dl-secret-reveal__code", children: secret }),
+        /* @__PURE__ */ jsx55(CopyButton, { textToCopy: secret, label: copyLabel })
+      ] })
+    ] });
+  }
+);
+SecretRevealCard.displayName = "SecretRevealCard";
 export {
   Accordion,
   AccordionContent,
@@ -3707,6 +3817,7 @@ export {
   ContextMenuSubContent,
   ContextMenuSubTrigger,
   ContextMenuTrigger,
+  CopyButton,
   DatePicker,
   Dialog,
   DialogBody,
@@ -3777,6 +3888,8 @@ export {
   MenubarSubContent,
   MenubarSubTrigger,
   MenubarTrigger,
+  MetricCard,
+  MetricsGrid,
   NavigationMenu,
   NavigationMenuContent,
   NavigationMenuIndicator,
@@ -3806,6 +3919,7 @@ export {
   ScrollArea,
   ScrollBar,
   SearchableSelect,
+  SecretRevealCard,
   Select,
   SelectContent,
   SelectGroup,