@etus/ui 0.4.0-beta.2 → 0.4.0-beta.21

package/dist/chunk-PEX7FCZC.js

@@ -0,0 +1,145 @@
+import { cn } from './chunk-RVAYDRMA.js';
+import { Drawer as Drawer$1 } from 'vaul';
+import { cva } from 'class-variance-authority';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var drawerOverlayVariants = cva([
+  "fixed inset-0 z-50 bg-[color:var(--drawer-overlay-bg)]",
+  "data-[state=open]:animate-in data-[state=closed]:animate-out",
+  "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0"
+]);
+var drawerContentBaseVariants = cva([
+  "group/drawer-content bg-[color:var(--drawer-content-bg)] fixed z-50 flex h-auto flex-col",
+  // Top direction styles
+  "data-[vaul-drawer-direction=top]:inset-x-0",
+  "data-[vaul-drawer-direction=top]:top-0",
+  "data-[vaul-drawer-direction=top]:mb-24",
+  "data-[vaul-drawer-direction=top]:max-h-[80vh]",
+  "data-[vaul-drawer-direction=top]:rounded-b-[var(--drawer-content-radius)]",
+  "data-[vaul-drawer-direction=top]:border-b data-[vaul-drawer-direction=top]:border-[color:var(--drawer-content-border)]",
+  // Bottom direction styles
+  "data-[vaul-drawer-direction=bottom]:inset-x-0",
+  "data-[vaul-drawer-direction=bottom]:bottom-0",
+  "data-[vaul-drawer-direction=bottom]:mt-24",
+  "data-[vaul-drawer-direction=bottom]:max-h-[80vh]",
+  "data-[vaul-drawer-direction=bottom]:rounded-t-[var(--drawer-content-radius)]",
+  "data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=bottom]:border-[color:var(--drawer-content-border)]",
+  // Right direction styles
+  "data-[vaul-drawer-direction=right]:inset-y-0",
+  "data-[vaul-drawer-direction=right]:right-0",
+  "data-[vaul-drawer-direction=right]:w-3/4",
+  "data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:border-[color:var(--drawer-content-border)]",
+  "data-[vaul-drawer-direction=right]:sm:max-w-sm",
+  // Left direction styles
+  "data-[vaul-drawer-direction=left]:inset-y-0",
+  "data-[vaul-drawer-direction=left]:left-0",
+  "data-[vaul-drawer-direction=left]:w-3/4",
+  "data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:border-[color:var(--drawer-content-border)]",
+  "data-[vaul-drawer-direction=left]:sm:max-w-sm"
+]);
+var drawerHandleVariants = cva([
+  "bg-[color:var(--drawer-handle-bg)] mx-auto mt-[var(--drawer-handle-margin-top)] h-[var(--drawer-handle-height)] w-[var(--drawer-handle-width)] shrink-0 rounded-full",
+  "hidden group-data-[vaul-drawer-direction=bottom]/drawer-content:block"
+]);
+var drawerHeaderVariants = cva([
+  "flex flex-col gap-[var(--drawer-header-gap)] p-[var(--drawer-header-padding)]",
+  "md:gap-1.5 md:text-left",
+  "group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center",
+  "group-data-[vaul-drawer-direction=top]/drawer-content:text-center"
+]);
+var drawerFooterVariants = cva([
+  "mt-auto flex flex-col gap-[var(--drawer-footer-gap)] p-[var(--drawer-footer-padding)]"
+]);
+var drawerTitleVariants = cva([
+  "text-foreground font-semibold"
+]);
+var drawerDescriptionVariants = cva([
+  "text-muted-foreground text-sm"
+]);
+function Drawer({ ...props }) {
+  return /* @__PURE__ */ jsx(Drawer$1.Root, { "data-slot": "drawer", ...props });
+}
+function DrawerTrigger({ ...props }) {
+  return /* @__PURE__ */ jsx(Drawer$1.Trigger, { "data-slot": "drawer-trigger", ...props });
+}
+function DrawerPortal({ ...props }) {
+  return /* @__PURE__ */ jsx(Drawer$1.Portal, { "data-slot": "drawer-portal", ...props });
+}
+function DrawerClose({ ...props }) {
+  return /* @__PURE__ */ jsx(Drawer$1.Close, { "data-slot": "drawer-close", ...props });
+}
+function DrawerOverlay({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    Drawer$1.Overlay,
+    {
+      className: cn(drawerOverlayVariants(), className),
+      "data-slot": "drawer-overlay",
+      ...props
+    }
+  );
+}
+function DrawerContent({
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(DrawerPortal, { "data-slot": "drawer-portal", children: [
+    /* @__PURE__ */ jsx(DrawerOverlay, {}),
+    /* @__PURE__ */ jsxs(
+      Drawer$1.Content,
+      {
+        className: cn(drawerContentBaseVariants(), className),
+        "data-slot": "drawer-content",
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx("div", { className: cn(drawerHandleVariants()) }),
+          children
+        ]
+      }
+    )
+  ] });
+}
+function DrawerHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(drawerHeaderVariants(), className),
+      "data-slot": "drawer-header",
+      ...props
+    }
+  );
+}
+function DrawerFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(drawerFooterVariants(), className),
+      "data-slot": "drawer-footer",
+      ...props
+    }
+  );
+}
+function DrawerTitle({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    Drawer$1.Title,
+    {
+      className: cn(drawerTitleVariants(), className),
+      "data-slot": "drawer-title",
+      ...props
+    }
+  );
+}
+function DrawerDescription({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    Drawer$1.Description,
+    {
+      className: cn(drawerDescriptionVariants(), className),
+      "data-slot": "drawer-description",
+      ...props
+    }
+  );
+}
+
+export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, drawerContentBaseVariants, drawerDescriptionVariants, drawerFooterVariants, drawerHandleVariants, drawerHeaderVariants, drawerOverlayVariants, drawerTitleVariants };
+//# sourceMappingURL=chunk-PEX7FCZC.js.map
+//# sourceMappingURL=chunk-PEX7FCZC.js.map

package/dist/chunk-PEX7FCZC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/navigation/Drawer/Drawer.variants.ts","../src/components/navigation/Drawer/Drawer.tsx"],"names":["DrawerPrimitive"],"mappings":"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","file":"chunk-PEX7FCZC.js","sourcesContent":["import { cva } from \"class-variance-authority\"\n\n/**\n * DrawerOverlay variant styles\n * Semi-transparent backdrop behind the drawer\n */\nexport const drawerOverlayVariants = cva([\n  \"fixed inset-0 z-50 bg-[color:var(--drawer-overlay-bg)]\",\n  \"data-[state=open]:animate-in data-[state=closed]:animate-out\",\n  \"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n])\n\n/**\n * DrawerContent base styles (direction handled by data attributes)\n * Use this when direction is controlled by vaul\n */\nexport const drawerContentBaseVariants = cva([\n  \"group/drawer-content bg-[color:var(--drawer-content-bg)] fixed z-50 flex h-auto flex-col\",\n  // Top direction styles\n  \"data-[vaul-drawer-direction=top]:inset-x-0\",\n  \"data-[vaul-drawer-direction=top]:top-0\",\n  \"data-[vaul-drawer-direction=top]:mb-24\",\n  \"data-[vaul-drawer-direction=top]:max-h-[80vh]\",\n  \"data-[vaul-drawer-direction=top]:rounded-b-[var(--drawer-content-radius)]\",\n  \"data-[vaul-drawer-direction=top]:border-b data-[vaul-drawer-direction=top]:border-[color:var(--drawer-content-border)]\",\n  // Bottom direction styles\n  \"data-[vaul-drawer-direction=bottom]:inset-x-0\",\n  \"data-[vaul-drawer-direction=bottom]:bottom-0\",\n  \"data-[vaul-drawer-direction=bottom]:mt-24\",\n  \"data-[vaul-drawer-direction=bottom]:max-h-[80vh]\",\n  \"data-[vaul-drawer-direction=bottom]:rounded-t-[var(--drawer-content-radius)]\",\n  \"data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=bottom]:border-[color:var(--drawer-content-border)]\",\n  // Right direction styles\n  \"data-[vaul-drawer-direction=right]:inset-y-0\",\n  \"data-[vaul-drawer-direction=right]:right-0\",\n  \"data-[vaul-drawer-direction=right]:w-3/4\",\n  \"data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:border-[color:var(--drawer-content-border)]\",\n  \"data-[vaul-drawer-direction=right]:sm:max-w-sm\",\n  // Left direction styles\n  \"data-[vaul-drawer-direction=left]:inset-y-0\",\n  \"data-[vaul-drawer-direction=left]:left-0\",\n  \"data-[vaul-drawer-direction=left]:w-3/4\",\n  \"data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:border-[color:var(--drawer-content-border)]\",\n  \"data-[vaul-drawer-direction=left]:sm:max-w-sm\",\n])\n\n/**\n * Drawer handle (drag indicator) variant styles\n */\nexport const drawerHandleVariants = cva([\n  \"bg-[color:var(--drawer-handle-bg)] mx-auto mt-[var(--drawer-handle-margin-top)] h-[var(--drawer-handle-height)] w-[var(--drawer-handle-width)] shrink-0 rounded-full\",\n  \"hidden group-data-[vaul-drawer-direction=bottom]/drawer-content:block\",\n])\n\n/**\n * DrawerHeader variant styles\n */\nexport const drawerHeaderVariants = cva([\n  \"flex flex-col gap-[var(--drawer-header-gap)] p-[var(--drawer-header-padding)]\",\n  \"md:gap-1.5 md:text-left\",\n  \"group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center\",\n  \"group-data-[vaul-drawer-direction=top]/drawer-content:text-center\",\n])\n\n/**\n * DrawerFooter variant styles\n */\nexport const drawerFooterVariants = cva([\n  \"mt-auto flex flex-col gap-[var(--drawer-footer-gap)] p-[var(--drawer-footer-padding)]\",\n])\n\n/**\n * DrawerTitle variant styles\n */\nexport const drawerTitleVariants = cva([\n  \"text-foreground font-semibold\",\n])\n\n/**\n * DrawerDescription variant styles\n */\nexport const drawerDescriptionVariants = cva([\n  \"text-muted-foreground text-sm\",\n])\n","\"use client\"\n\nimport type {\n  DrawerCloseProps,\n  DrawerContentProps,\n  DrawerDescriptionProps,\n  DrawerFooterProps,\n  DrawerHeaderProps,\n  DrawerOverlayProps,\n  DrawerPortalProps,\n  DrawerProps,\n  DrawerTitleProps,\n  DrawerTriggerProps,\n} from \"./Drawer.types\"\n\nimport { Drawer as DrawerPrimitive } from \"vaul\"\n\nimport { cn } from \"../../../lib/utils\"\nimport {\n  drawerContentBaseVariants,\n  drawerDescriptionVariants,\n  drawerFooterVariants,\n  drawerHandleVariants,\n  drawerHeaderVariants,\n  drawerOverlayVariants,\n  drawerTitleVariants,\n} from \"./Drawer.variants\"\n\n/**\n * Drawer - A drawer/slide-out panel component.\n *\n * Built on top of vaul for touch-friendly drawer behavior.\n * Supports all four directions: top, bottom, left, right.\n *\n * @example\n * <Drawer>\n *   <DrawerTrigger>Open Drawer</DrawerTrigger>\n *   <DrawerContent>\n *     <DrawerHeader>\n *       <DrawerTitle>Title</DrawerTitle>\n *       <DrawerDescription>Description</DrawerDescription>\n *     </DrawerHeader>\n *     <div className=\"p-4\">Content</div>\n *   </DrawerContent>\n * </Drawer>\n */\nfunction Drawer({ ...props }: DrawerProps) {\n  return <DrawerPrimitive.Root data-slot=\"drawer\" {...props} />\n}\n\n/**\n * DrawerTrigger - Button that opens the drawer.\n */\nfunction DrawerTrigger({ ...props }: DrawerTriggerProps) {\n  return <DrawerPrimitive.Trigger data-slot=\"drawer-trigger\" {...props} />\n}\n\n/**\n * DrawerPortal - Renders drawer content in a portal.\n */\nfunction DrawerPortal({ ...props }: DrawerPortalProps) {\n  return <DrawerPrimitive.Portal data-slot=\"drawer-portal\" {...props} />\n}\n\n/**\n * DrawerClose - Button that closes the drawer.\n */\nfunction DrawerClose({ ...props }: DrawerCloseProps) {\n  return <DrawerPrimitive.Close data-slot=\"drawer-close\" {...props} />\n}\n\n/**\n * DrawerOverlay - Semi-transparent backdrop behind the drawer.\n */\nfunction DrawerOverlay({ className, ...props }: DrawerOverlayProps) {\n  return (\n    <DrawerPrimitive.Overlay\n      className={cn(drawerOverlayVariants(), className)}\n      data-slot=\"drawer-overlay\"\n      {...props}\n    />\n  )\n}\n\n/**\n * DrawerContent - Main content container for the drawer.\n *\n * Automatically includes overlay and handles positioning based on direction.\n * Includes a drag handle for bottom drawers.\n */\nfunction DrawerContent({\n  className,\n  children,\n  ...props\n}: DrawerContentProps) {\n  return (\n    <DrawerPortal data-slot=\"drawer-portal\">\n      <DrawerOverlay />\n      <DrawerPrimitive.Content\n        className={cn(drawerContentBaseVariants(), className)}\n        data-slot=\"drawer-content\"\n        {...props}\n      >\n        <div className={cn(drawerHandleVariants())} />\n        {children}\n      </DrawerPrimitive.Content>\n    </DrawerPortal>\n  )\n}\n\n/**\n * DrawerHeader - Container for drawer title and description.\n *\n * Centered text for top/bottom drawers, left-aligned for side drawers on desktop.\n */\nfunction DrawerHeader({ className, ...props }: DrawerHeaderProps) {\n  return (\n    <div\n      className={cn(drawerHeaderVariants(), className)}\n      data-slot=\"drawer-header\"\n      {...props}\n    />\n  )\n}\n\n/**\n * DrawerFooter - Footer container for drawer actions.\n *\n * Positioned at the bottom with auto margin-top.\n */\nfunction DrawerFooter({ className, ...props }: DrawerFooterProps) {\n  return (\n    <div\n      className={cn(drawerFooterVariants(), className)}\n      data-slot=\"drawer-footer\"\n      {...props}\n    />\n  )\n}\n\n/**\n * DrawerTitle - Title text for the drawer.\n */\nfunction DrawerTitle({ className, ...props }: DrawerTitleProps) {\n  return (\n    <DrawerPrimitive.Title\n      className={cn(drawerTitleVariants(), className)}\n      data-slot=\"drawer-title\"\n      {...props}\n    />\n  )\n}\n\n/**\n * DrawerDescription - Description text for the drawer.\n */\nfunction DrawerDescription({ className, ...props }: DrawerDescriptionProps) {\n  return (\n    <DrawerPrimitive.Description\n      className={cn(drawerDescriptionVariants(), className)}\n      data-slot=\"drawer-description\"\n      {...props}\n    />\n  )\n}\n\nexport {\n  Drawer,\n  DrawerClose,\n  DrawerContent,\n  DrawerDescription,\n  DrawerFooter,\n  DrawerHeader,\n  DrawerOverlay,\n  DrawerPortal,\n  DrawerTitle,\n  DrawerTrigger,\n}\n"]}

package/dist/chunk-PI4WGIPG.js

@@ -0,0 +1,159 @@
+import { cn } from './chunk-RVAYDRMA.js';
+import * as React from 'react';
+import { cva } from 'class-variance-authority';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+var barListVariants = cva(
+  "flex flex-col gap-2",
+  {
+    variants: {},
+    defaultVariants: {}
+  }
+);
+var barListItemVariants = cva(
+  "relative flex items-center",
+  {
+    variants: {
+      clickable: {
+        true: "cursor-pointer",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      clickable: false
+    }
+  }
+);
+var barListBarVariants = cva(
+  "absolute left-0 h-full rounded-[var(--radius-sm)] transition-all duration-300",
+  {
+    variants: {
+      animated: {
+        true: "",
+        false: "!transition-none"
+      }
+    },
+    defaultVariants: {
+      animated: true
+    }
+  }
+);
+var barListContentVariants = cva(
+  "relative z-10 flex w-full items-center justify-between gap-2 px-2 py-1.5",
+  {
+    variants: {},
+    defaultVariants: {}
+  }
+);
+var barListNameVariants = cva(
+  "flex items-center gap-2 truncate text-sm font-medium",
+  {
+    variants: {},
+    defaultVariants: {}
+  }
+);
+var barListValueVariants = cva(
+  "text-sm tabular-nums text-muted-foreground",
+  {
+    variants: {},
+    defaultVariants: {}
+  }
+);
+function defaultValueFormatter(value) {
+  return value.toLocaleString();
+}
+function sortData(data, order) {
+  if (order === "none") return data;
+  return [...data].sort(
+    (a, b) => order === "ascending" ? a.value - b.value : b.value - a.value
+  );
+}
+function BarList({
+  className,
+  color = "var(--primary)",
+  data,
+  onClick,
+  showAnimation = true,
+  sortOrder = "descending",
+  valueFormatter = defaultValueFormatter,
+  ...props
+}) {
+  const sortedData = React.useMemo(
+    () => sortData(data, sortOrder),
+    [data, sortOrder]
+  );
+  const maxValue = React.useMemo(
+    () => Math.max(...sortedData.map((d) => d.value), 0),
+    [sortedData]
+  );
+  const isClickable = Boolean(onClick);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(barListVariants(), className),
+      "data-slot": "bar-list",
+      ...props,
+      children: sortedData.map((item, index) => {
+        const percentage = maxValue > 0 ? item.value / maxValue * 100 : 0;
+        const barColor = item.color ?? color;
+        const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              style: {
+                backgroundColor: barColor,
+                opacity: 0.15,
+                width: `${String(percentage)}%`
+              },
+              className: cn(barListBarVariants({ animated: showAnimation }))
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: barListContentVariants(), children: [
+            /* @__PURE__ */ jsxs("span", { className: barListNameVariants(), children: [
+              React.isValidElement(item.icon) ? item.icon : null,
+              item.href ? /* @__PURE__ */ jsx(
+                "a",
+                {
+                  className: "hover:underline focus:outline-none focus:underline",
+                  href: item.href,
+                  rel: item.target === "_blank" ? "noopener noreferrer" : void 0,
+                  target: item.target,
+                  onClick: (e) => {
+                    if (onClick) {
+                      e.preventDefault();
+                      onClick(item, index);
+                    }
+                  },
+                  children: item.name
+                }
+              ) : item.name
+            ] }),
+            /* @__PURE__ */ jsx("span", { className: barListValueVariants(), children: valueFormatter(item.value) })
+          ] })
+        ] });
+        return /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(barListItemVariants({ clickable: isClickable && !item.href })),
+            role: isClickable && !item.href ? "button" : void 0,
+            tabIndex: isClickable && !item.href ? 0 : void 0,
+            onClick: isClickable && !item.href ? () => onClick?.(item, index) : void 0,
+            onKeyDown: isClickable && !item.href ? (e) => {
+              if (e.key === "Enter" || e.key === " ") {
+                e.preventDefault();
+                onClick?.(item, index);
+              }
+            } : void 0,
+            children: content
+          },
+          item.name
+        );
+      })
+    }
+  );
+}
+BarList.displayName = "BarList";
+
+export { BarList };
+//# sourceMappingURL=chunk-PI4WGIPG.js.map
+//# sourceMappingURL=chunk-PI4WGIPG.js.map

package/dist/chunk-PI4WGIPG.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/BarList/BarList.variants.ts","../src/components/data-display/BarList/BarList.tsx"],"names":[],"mappings":";;;;;AAEO,IAAM,eAAA,GAAkB,GAAA;AAAA,EAC7B,qBAAA;AAAA,EACA;AAAA,IACE,UAAU,EAAC;AAAA,IACX,iBAAiB;AAAC;AAEtB,CAAA;AAEO,IAAM,mBAAA,GAAsB,GAAA;AAAA,EACjC,4BAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,SAAA,EAAW;AAAA,QACT,IAAA,EAAM,gBAAA;AAAA,QACN,KAAA,EAAO;AAAA;AACT,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,SAAA,EAAW;AAAA;AACb;AAEJ,CAAA;AAEO,IAAM,kBAAA,GAAqB,GAAA;AAAA,EAChC,+EAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,QAAA,EAAU;AAAA,QACR,IAAA,EAAM,EAAA;AAAA,QACN,KAAA,EAAO;AAAA;AACT,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,QAAA,EAAU;AAAA;AACZ;AAEJ,CAAA;AAEO,IAAM,sBAAA,GAAyB,GAAA;AAAA,EACpC,0EAAA;AAAA,EACA;AAAA,IACE,UAAU,EAAC;AAAA,IACX,iBAAiB;AAAC;AAEtB,CAAA;AAEO,IAAM,mBAAA,GAAsB,GAAA;AAAA,EACjC,sDAAA;AAAA,EACA;AAAA,IACE,UAAU,EAAC;AAAA,IACX,iBAAiB;AAAC;AAEtB,CAAA;AAEO,IAAM,oBAAA,GAAuB,GAAA;AAAA,EAClC,4CAAA;AAAA,EACA;AAAA,IACE,UAAU,EAAC;AAAA,IACX,iBAAiB;AAAC;AAEtB,CAAA;AC3CA,SAAS,sBAAsB,KAAA,EAAuB;AACpD,EAAA,OAAO,MAAM,cAAA,EAAe;AAC9B;AAKA,SAAS,QAAA,CACP,MACA,KAAA,EACmB;AACnB,EAAA,IAAI,KAAA,KAAU,QAAQ,OAAO,IAAA;AAE7B,EAAA,OAAO,CAAC,GAAG,IAAI,CAAA,CAAE,IAAA;AAAA,IAAK,CAAC,CAAA,EAAG,CAAA,KACxB,KAAA,KAAU,WAAA,GAAc,CAAA,CAAE,KAAA,GAAQ,CAAA,CAAE,KAAA,GAAQ,CAAA,CAAE,KAAA,GAAQ,CAAA,CAAE;AAAA,GAC1D;AACF;AAkCO,SAAS,OAAA,CAAQ;AAAA,EACtB,SAAA;AAAA,EACA,KAAA,GAAQ,gBAAA;AAAA,EACR,IAAA;AAAA,EACA,OAAA;AAAA,EACA,aAAA,GAAgB,IAAA;AAAA,EAChB,SAAA,GAAY,YAAA;AAAA,EACZ,cAAA,GAAiB,qBAAA;AAAA,EACjB,GAAG;AACL,CAAA,EAAiB;AACf,EAAA,MAAM,UAAA,GAAmB,KAAA,CAAA,OAAA;AAAA,IACvB,MAAM,QAAA,CAAS,IAAA,EAAM,SAAS,CAAA;AAAA,IAC9B,CAAC,MAAM,SAAS;AAAA,GAClB;AAGA,EAAA,MAAM,QAAA,GAAiB,KAAA,CAAA,OAAA;AAAA,IACrB,MAAM,IAAA,CAAK,GAAA,CAAI,GAAG,UAAA,CAAW,GAAA,CAAI,CAAC,CAAA,KAAM,CAAA,CAAE,KAAK,CAAA,EAAG,CAAC,CAAA;AAAA,IACnD,CAAC,UAAU;AAAA,GACb;AAEA,EAAA,MAAM,WAAA,GAAc,QAAQ,OAAO,CAAA;AAEnC,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,EAAA,CAAG,eAAA,EAAgB,EAAG,SAAS,CAAA;AAAA,MAC1C,WAAA,EAAU,UAAA;AAAA,MACT,GAAG,KAAA;AAAA,MAEH,QAAA,EAAA,UAAA,CAAW,GAAA,CAAI,CAAC,IAAA,EAAM,KAAA,KAAU;AAC/B,QAAA,MAAM,aAAa,QAAA,GAAW,CAAA,GAAK,IAAA,CAAK,KAAA,GAAQ,WAAY,GAAA,GAAM,CAAA;AAClE,QAAA,MAAM,QAAA,GAAW,KAAK,KAAA,IAAS,KAAA;AAE/B,QAAA,MAAM,0BACJ,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,KAAA,EAAO;AAAA,gBACL,eAAA,EAAiB,QAAA;AAAA,gBACjB,OAAA,EAAS,IAAA;AAAA,gBACT,KAAA,EAAO,CAAA,EAAG,MAAA,CAAO,UAAU,CAAC,CAAA,CAAA;AAAA,eAC9B;AAAA,cACA,WAAW,EAAA,CAAG,kBAAA,CAAmB,EAAE,QAAA,EAAU,aAAA,EAAe,CAAC;AAAA;AAAA,WAC/D;AAAA,0BACA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,sBAAA,EAAuB,EACrC,QAAA,EAAA;AAAA,4BAAA,IAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAW,mBAAA,EAAoB,EAClC,QAAA,EAAA;AAAA,cAAM,KAAA,CAAA,cAAA,CAAe,IAAA,CAAK,IAAI,CAAA,GAAI,KAAK,IAAA,GAAO,IAAA;AAAA,cAC9C,KAAK,IAAA,mBACJ,GAAA;AAAA,gBAAC,GAAA;AAAA,gBAAA;AAAA,kBACC,SAAA,EAAU,oDAAA;AAAA,kBACV,MAAM,IAAA,CAAK,IAAA;AAAA,kBACX,GAAA,EAAK,IAAA,CAAK,MAAA,KAAW,QAAA,GAAW,qBAAA,GAAwB,MAAA;AAAA,kBACxD,QAAQ,IAAA,CAAK,MAAA;AAAA,kBACb,OAAA,EAAS,CAAC,CAAA,KAAM;AACd,oBAAA,IAAI,OAAA,EAAS;AACX,sBAAA,CAAA,CAAE,cAAA,EAAe;AACjB,sBAAA,OAAA,CAAQ,MAAM,KAAK,CAAA;AAAA,oBACrB;AAAA,kBACF,CAAA;AAAA,kBAEC,QAAA,EAAA,IAAA,CAAK;AAAA;AAAA,kBAGR,IAAA,CAAK;AAAA,aAAA,EAET,CAAA;AAAA,4BACA,GAAA,CAAC,UAAK,SAAA,EAAW,oBAAA,IACd,QAAA,EAAA,cAAA,CAAe,IAAA,CAAK,KAAK,CAAA,EAC5B;AAAA,WAAA,EACF;AAAA,SAAA,EACF,CAAA;AAGF,QAAA,uBACE,GAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YAEC,SAAA,EAAW,EAAA,CAAG,mBAAA,CAAoB,EAAE,SAAA,EAAW,eAAe,CAAC,IAAA,CAAK,IAAA,EAAM,CAAC,CAAA;AAAA,YAC3E,IAAA,EAAM,WAAA,IAAe,CAAC,IAAA,CAAK,OAAO,QAAA,GAAW,MAAA;AAAA,YAC7C,QAAA,EAAU,WAAA,IAAe,CAAC,IAAA,CAAK,OAAO,CAAA,GAAI,MAAA;AAAA,YAC1C,OAAA,EACE,eAAe,CAAC,IAAA,CAAK,OACjB,MAAM,OAAA,GAAU,IAAA,EAAM,KAAK,CAAA,GAC3B,MAAA;AAAA,YAEN,WACE,WAAA,IAAe,CAAC,IAAA,CAAK,IAAA,GACjB,CAAC,CAAA,KAAM;AACL,cAAA,IAAI,CAAA,CAAE,GAAA,KAAQ,OAAA,IAAW,CAAA,CAAE,QAAQ,GAAA,EAAK;AACtC,gBAAA,CAAA,CAAE,cAAA,EAAe;AACjB,gBAAA,OAAA,GAAU,MAAM,KAAK,CAAA;AAAA,cACvB;AAAA,YACF,CAAA,GACA,MAAA;AAAA,YAGL,QAAA,EAAA;AAAA,WAAA;AAAA,UApBI,IAAA,CAAK;AAAA,SAqBZ;AAAA,MAEJ,CAAC;AAAA;AAAA,GACH;AAEJ;AAEA,OAAA,CAAQ,WAAA,GAAc,SAAA","file":"chunk-PI4WGIPG.js","sourcesContent":["import { cva } from \"class-variance-authority\"\n\nexport const barListVariants = cva(\n  \"flex flex-col gap-2\",\n  {\n    variants: {},\n    defaultVariants: {},\n  }\n)\n\nexport const barListItemVariants = cva(\n  \"relative flex items-center\",\n  {\n    variants: {\n      clickable: {\n        true: \"cursor-pointer\",\n        false: \"\",\n      },\n    },\n    defaultVariants: {\n      clickable: false,\n    },\n  }\n)\n\nexport const barListBarVariants = cva(\n  \"absolute left-0 h-full rounded-[var(--radius-sm)] transition-all duration-300\",\n  {\n    variants: {\n      animated: {\n        true: \"\",\n        false: \"!transition-none\",\n      },\n    },\n    defaultVariants: {\n      animated: true,\n    },\n  }\n)\n\nexport const barListContentVariants = cva(\n  \"relative z-10 flex w-full items-center justify-between gap-2 px-2 py-1.5\",\n  {\n    variants: {},\n    defaultVariants: {},\n  }\n)\n\nexport const barListNameVariants = cva(\n  \"flex items-center gap-2 truncate text-sm font-medium\",\n  {\n    variants: {},\n    defaultVariants: {},\n  }\n)\n\nexport const barListValueVariants = cva(\n  \"text-sm tabular-nums text-muted-foreground\",\n  {\n    variants: {},\n    defaultVariants: {},\n  }\n)\n","\"use client\"\n\nimport type { BarListDataItem, BarListProps } from \"./BarList.types\"\n\nimport * as React from \"react\"\n\nimport { cn } from \"../../../lib/utils\"\nimport {\n  barListBarVariants,\n  barListContentVariants,\n  barListItemVariants,\n  barListNameVariants,\n  barListValueVariants,\n  barListVariants,\n} from \"./BarList.variants\"\n\n/**\n * Default value formatter\n */\nfunction defaultValueFormatter(value: number): string {\n  return value.toLocaleString()\n}\n\n/**\n * Sort data by value\n */\nfunction sortData(\n  data: BarListDataItem[],\n  order: BarListProps[\"sortOrder\"]\n): BarListDataItem[] {\n  if (order === \"none\") return data\n\n  return [...data].sort((a, b) =>\n    order === \"ascending\" ? a.value - b.value : b.value - a.value\n  )\n}\n\n/**\n * BarList - Horizontal bar list for ranked data\n *\n * Displays items as horizontal bars proportional to their values.\n * Commonly used for top items, rankings, category breakdowns, etc.\n *\n * @example\n * ```tsx\n * const data = [\n *   { name: \"Twitter\", value: 456 },\n *   { name: \"Google\", value: 351 },\n *   { name: \"GitHub\", value: 271 },\n * ]\n *\n * <BarList data={data} />\n * ```\n *\n * @example\n * ```tsx\n * // With custom colors and click handler\n * const data = [\n *   { name: \"Direct\", value: 456, color: \"var(--chart-1)\" },\n *   { name: \"Organic\", value: 351, color: \"var(--chart-2)\" },\n * ]\n *\n * <BarList\n *   data={data}\n *   onClick={(item) => console.log(item.name)}\n *   valueFormatter={(v) => `${v} visits`}\n * />\n * ```\n */\nexport function BarList({\n  className,\n  color = \"var(--primary)\",\n  data,\n  onClick,\n  showAnimation = true,\n  sortOrder = \"descending\",\n  valueFormatter = defaultValueFormatter,\n  ...props\n}: BarListProps) {\n  const sortedData = React.useMemo(\n    () => sortData(data, sortOrder),\n    [data, sortOrder]\n  )\n\n  // Calculate max value for bar widths\n  const maxValue = React.useMemo(\n    () => Math.max(...sortedData.map((d) => d.value), 0),\n    [sortedData]\n  )\n\n  const isClickable = Boolean(onClick)\n\n  return (\n    <div\n      className={cn(barListVariants(), className)}\n      data-slot=\"bar-list\"\n      {...props}\n    >\n      {sortedData.map((item, index) => {\n        const percentage = maxValue > 0 ? (item.value / maxValue) * 100 : 0\n        const barColor = item.color ?? color\n\n        const content = (\n          <>\n            <div\n              style={{\n                backgroundColor: barColor,\n                opacity: 0.15,\n                width: `${String(percentage)}%`,\n              }}\n              className={cn(barListBarVariants({ animated: showAnimation }))}\n            />\n            <div className={barListContentVariants()}>\n              <span className={barListNameVariants()}>\n                {React.isValidElement(item.icon) ? item.icon : null}\n                {item.href ? (\n                  <a\n                    className=\"hover:underline focus:outline-none focus:underline\"\n                    href={item.href}\n                    rel={item.target === \"_blank\" ? \"noopener noreferrer\" : undefined}\n                    target={item.target}\n                    onClick={(e) => {\n                      if (onClick) {\n                        e.preventDefault()\n                        onClick(item, index)\n                      }\n                    }}\n                  >\n                    {item.name}\n                  </a>\n                ) : (\n                  item.name\n                )}\n              </span>\n              <span className={barListValueVariants()}>\n                {valueFormatter(item.value)}\n              </span>\n            </div>\n          </>\n        )\n\n        return (\n          <div\n            key={item.name}\n            className={cn(barListItemVariants({ clickable: isClickable && !item.href }))}\n            role={isClickable && !item.href ? \"button\" : undefined}\n            tabIndex={isClickable && !item.href ? 0 : undefined}\n            onClick={\n              isClickable && !item.href\n                ? () => onClick?.(item, index)\n                : undefined\n            }\n            onKeyDown={\n              isClickable && !item.href\n                ? (e) => {\n                    if (e.key === \"Enter\" || e.key === \" \") {\n                      e.preventDefault()\n                      onClick?.(item, index)\n                    }\n                  }\n                : undefined\n            }\n          >\n            {content}\n          </div>\n        )\n      })}\n    </div>\n  )\n}\n\nBarList.displayName = \"BarList\"\n"]}

package/dist/chunk-PTXC4KPQ.js

@@ -0,0 +1,177 @@
+import { buttonVariants } from './chunk-L4OQ6BJ5.js';
+import { cn } from './chunk-RVAYDRMA.js';
+import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
+import { cva } from 'class-variance-authority';
+import 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function AlertDialog({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(AlertDialogPrimitive.Root, { "data-slot": "alert-dialog", ...props });
+}
+function AlertDialogTrigger({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(AlertDialogPrimitive.Trigger, { "data-slot": "alert-dialog-trigger", ...props });
+}
+function AlertDialogPortal({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(AlertDialogPrimitive.Portal, { "data-slot": "alert-dialog-portal", ...props });
+}
+function AlertDialogOverlay({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    AlertDialogPrimitive.Overlay,
+    {
+      className: cn(
+        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-[color:var(--alert-dialog-overlay-bg)]",
+        className
+      ),
+      "data-slot": "alert-dialog-overlay",
+      ...props
+    }
+  );
+}
+function AlertDialogContent({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [
+    /* @__PURE__ */ jsx(AlertDialogOverlay, {}),
+    /* @__PURE__ */ jsx(
+      AlertDialogPrimitive.Content,
+      {
+        className: cn(
+          "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full translate-x-[-50%] translate-y-[-50%] duration-200",
+          "bg-[color:var(--alert-dialog-content-bg)] rounded-[var(--alert-dialog-content-radius)] border-[color:var(--alert-dialog-content-border)] shadow-[var(--alert-dialog-content-shadow)] gap-[var(--alert-dialog-content-gap)] p-[var(--alert-dialog-content-padding)] max-w-[var(--alert-dialog-content-max-width)]",
+          className
+        ),
+        "data-slot": "alert-dialog-content",
+        ...props
+      }
+    )
+  ] });
+}
+function AlertDialogHeader({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn("flex flex-col gap-[var(--alert-dialog-header-gap)] text-center sm:text-left", className),
+      "data-slot": "alert-dialog-header",
+      ...props
+    }
+  );
+}
+function AlertDialogFooter({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "flex flex-col-reverse gap-[var(--alert-dialog-footer-gap)] sm:flex-row sm:justify-end",
+        className
+      ),
+      "data-slot": "alert-dialog-footer",
+      ...props
+    }
+  );
+}
+function AlertDialogTitle({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    AlertDialogPrimitive.Title,
+    {
+      className: cn("text-lg font-semibold", className),
+      "data-slot": "alert-dialog-title",
+      ...props
+    }
+  );
+}
+function AlertDialogDescription({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    AlertDialogPrimitive.Description,
+    {
+      className: cn("text-muted-foreground text-sm", className),
+      "data-slot": "alert-dialog-description",
+      ...props
+    }
+  );
+}
+function AlertDialogAction({
+  className,
+  variant = "default",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    AlertDialogPrimitive.Action,
+    {
+      className: cn(buttonVariants({ variant }), className),
+      "data-slot": "alert-dialog-action",
+      ...props
+    }
+  );
+}
+function AlertDialogCancel({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    AlertDialogPrimitive.Cancel,
+    {
+      className: cn(buttonVariants({ variant: "outline" }), className),
+      "data-slot": "alert-dialog-cancel",
+      ...props
+    }
+  );
+}
+var alertDialogIconPillVariants = cva(
+  [
+    "flex size-fit items-center justify-center",
+    "rounded-[var(--alert-dialog-icon-pill-radius)] p-[var(--alert-dialog-icon-pill-padding)]",
+    "[&_svg]:size-[var(--alert-dialog-icon-pill-icon-size)] [&_svg]:shrink-0"
+  ],
+  {
+    variants: {
+      variant: {
+        default: "bg-[color:var(--alert-dialog-icon-pill-color-default-bg)] text-[color:var(--alert-dialog-icon-pill-color-default-fg)]",
+        warning: "bg-[color:var(--alert-dialog-icon-pill-color-warning-bg)] text-[color:var(--alert-dialog-icon-pill-color-warning-fg)]",
+        destructive: "bg-[color:var(--alert-dialog-icon-pill-color-destructive-bg)] text-[color:var(--alert-dialog-icon-pill-color-destructive-fg)]"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function AlertDialogIconPill({
+  className,
+  variant,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cn(alertDialogIconPillVariants({ variant }), className),
+      "data-slot": "alert-dialog-icon-pill",
+      ...props
+    }
+  );
+}
+
+export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogIconPill, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger };
+//# sourceMappingURL=chunk-PTXC4KPQ.js.map
+//# sourceMappingURL=chunk-PTXC4KPQ.js.map

package/dist/chunk-PTXC4KPQ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/feedback/AlertDialog/AlertDialog.tsx"],"names":[],"mappings":"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","file":"chunk-PTXC4KPQ.js","sourcesContent":["\"use client\"\n\nimport * as AlertDialogPrimitive from \"@radix-ui/react-alert-dialog\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport * as React from \"react\"\n\nimport { cn } from \"../../../lib/utils\"\nimport { buttonVariants } from \"../../primitives/Button\"\n\nfunction AlertDialog({\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Root>) {\n  return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props} />\n}\n\nfunction AlertDialogTrigger({\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Trigger>) {\n  return (\n    <AlertDialogPrimitive.Trigger data-slot=\"alert-dialog-trigger\" {...props} />\n  )\n}\n\nfunction AlertDialogPortal({\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Portal>) {\n  return (\n    <AlertDialogPrimitive.Portal data-slot=\"alert-dialog-portal\" {...props} />\n  )\n}\n\nfunction AlertDialogOverlay({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Overlay>) {\n  return (\n    <AlertDialogPrimitive.Overlay\n      className={cn(\n        \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-[color:var(--alert-dialog-overlay-bg)]\",\n        className\n      )}\n      data-slot=\"alert-dialog-overlay\"\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogContent({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Content>) {\n  return (\n    <AlertDialogPortal>\n      <AlertDialogOverlay />\n      <AlertDialogPrimitive.Content\n        className={cn(\n          \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full translate-x-[-50%] translate-y-[-50%] duration-200\",\n          \"bg-[color:var(--alert-dialog-content-bg)] rounded-[var(--alert-dialog-content-radius)] border-[color:var(--alert-dialog-content-border)] shadow-[var(--alert-dialog-content-shadow)] gap-[var(--alert-dialog-content-gap)] p-[var(--alert-dialog-content-padding)] max-w-[var(--alert-dialog-content-max-width)]\",\n          className\n        )}\n        data-slot=\"alert-dialog-content\"\n        {...props}\n      />\n    </AlertDialogPortal>\n  )\n}\n\nfunction AlertDialogHeader({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      className={cn(\"flex flex-col gap-[var(--alert-dialog-header-gap)] text-center sm:text-left\", className)}\n      data-slot=\"alert-dialog-header\"\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogFooter({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      className={cn(\n        \"flex flex-col-reverse gap-[var(--alert-dialog-footer-gap)] sm:flex-row sm:justify-end\",\n        className\n      )}\n      data-slot=\"alert-dialog-footer\"\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Title>) {\n  return (\n    <AlertDialogPrimitive.Title\n      className={cn(\"text-lg font-semibold\", className)}\n      data-slot=\"alert-dialog-title\"\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Description>) {\n  return (\n    <AlertDialogPrimitive.Description\n      className={cn(\"text-muted-foreground text-sm\", className)}\n      data-slot=\"alert-dialog-description\"\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogAction({\n  className,\n  variant = \"default\",\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Action> & {\n  variant?: \"default\" | \"destructive\"\n}) {\n  return (\n    <AlertDialogPrimitive.Action\n      className={cn(buttonVariants({ variant }), className)}\n      data-slot=\"alert-dialog-action\"\n      {...props}\n    />\n  )\n}\n\nfunction AlertDialogCancel({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Cancel>) {\n  return (\n    <AlertDialogPrimitive.Cancel\n      className={cn(buttonVariants({ variant: \"outline\" }), className)}\n      data-slot=\"alert-dialog-cancel\"\n      {...props}\n    />\n  )\n}\n\n\nconst alertDialogIconPillVariants = cva(\n  [\n    \"flex size-fit items-center justify-center\",\n    \"rounded-[var(--alert-dialog-icon-pill-radius)] p-[var(--alert-dialog-icon-pill-padding)]\",\n    \"[&_svg]:size-[var(--alert-dialog-icon-pill-icon-size)] [&_svg]:shrink-0\",\n  ],\n  {\n    variants: {\n      variant: {\n        default:\n          \"bg-[color:var(--alert-dialog-icon-pill-color-default-bg)] text-[color:var(--alert-dialog-icon-pill-color-default-fg)]\",\n        warning:\n          \"bg-[color:var(--alert-dialog-icon-pill-color-warning-bg)] text-[color:var(--alert-dialog-icon-pill-color-warning-fg)]\",\n        destructive:\n          \"bg-[color:var(--alert-dialog-icon-pill-color-destructive-bg)] text-[color:var(--alert-dialog-icon-pill-color-destructive-fg)]\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n)\n\n/**\n * AlertDialogIconPill - Tinted icon pill for the dialog header (Figma 1405:15827).\n */\nfunction AlertDialogIconPill({\n  className,\n  variant,\n  ...props\n}: React.ComponentProps<\"span\"> & VariantProps<typeof alertDialogIconPillVariants>) {\n  return (\n    <span\n      className={cn(alertDialogIconPillVariants({ variant }), className)}\n      data-slot=\"alert-dialog-icon-pill\"\n      {...props}\n    />\n  )\n}\n\nexport {\n  AlertDialog,\n  AlertDialogAction,\n  AlertDialogCancel,\n  AlertDialogContent,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogHeader,\n  AlertDialogIconPill,\n  AlertDialogOverlay,\n  AlertDialogPortal,\n  AlertDialogTitle,\n  AlertDialogTrigger,\n}\n"]}