silver-ui 0.1.1 → 0.2.0

package/dist/chunk-SXIBQQ55.js

@@ -0,0 +1,280 @@
+import { Button } from './chunk-RRNT32KY.js';
+import { Text } from './chunk-J2FCNWYM.js';
+import { sva } from './chunk-EHCAF6D3.js';
+import { Icon } from './chunk-7T3SWOY7.js';
+import { cx } from './chunk-PPNETWIP.js';
+import { ChevronDown, X, TriangleAlert, CheckCircle2, Info, XCircle } from 'lucide-react';
+import { useId, useState } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/components/Alert/Alert.recipe.ts
+var paddingVariants = {
+  0: { bodyContent: { px: "0", py: "0" } },
+  0.5: { bodyContent: { px: "0.5", py: "0.5" } },
+  1: { bodyContent: { px: "1", py: "1" } },
+  1.5: { bodyContent: { px: "1.5", py: "1.5" } },
+  2: { bodyContent: { px: "2", py: "2" } },
+  3: { bodyContent: { px: "3", py: "3" } },
+  4: { bodyContent: { px: "4", py: "4" } },
+  5: { bodyContent: { px: "5", py: "5" } },
+  6: { bodyContent: { px: "6", py: "6" } },
+  8: { bodyContent: { px: "8", py: "8" } },
+  10: { bodyContent: { px: "10", py: "10" } }
+};
+var alertRecipe = sva({
+  slots: [
+    "root",
+    "header",
+    "icon",
+    "content",
+    "endArea",
+    "chevron",
+    "body",
+    "bodyContent"
+  ],
+  base: {
+    root: {
+      display: "flex",
+      flexDirection: "column",
+      fontFamily: "body"
+    },
+    header: {
+      display: "flex",
+      alignItems: "flex-start",
+      gap: "2",
+      px: "4",
+      py: "3"
+    },
+    icon: {
+      display: "inline-flex",
+      alignItems: "center",
+      flexShrink: 0
+    },
+    content: {
+      display: "flex",
+      flex: 1,
+      flexDirection: "column",
+      minW: 0
+    },
+    endArea: {
+      display: "flex",
+      alignItems: "center",
+      flexShrink: 0,
+      gap: "2",
+      ms: "auto"
+    },
+    // The body stays mounted so child state and the `aria-controls` target are
+    // preserved; it is collapsed with a `grid-template-rows` 1fr -> 0fr
+    // transition (mirroring `AccordionItem`). `overflow: hidden` lives on this
+    // grid so the body chrome on `bodyContent` is fully clipped when collapsed.
+    body: {
+      display: "grid",
+      gridTemplateRows: "1fr",
+      overflow: "hidden",
+      // `visibility` is transitioned alongside the rows so the content stays
+      // readable while collapsing, then becomes `hidden` (removing it from the
+      // a11y tree and tab order) once closed. The inline `visibility` style in
+      // the component drives the open/closed value.
+      transitionProperty: "grid-template-rows, visibility",
+      transitionDuration: "normal",
+      transitionTimingFunction: "default",
+      "@media (prefers-reduced-motion: reduce)": {
+        transitionDuration: "0.01s"
+      }
+    },
+    bodyContent: {
+      minH: 0,
+      bg: "bg",
+      borderBlockEndWidth: "default",
+      borderColor: "border",
+      borderInlineWidth: "default",
+      borderStyle: "solid",
+      px: "4",
+      py: "3"
+    }
+  },
+  variants: {
+    status: {
+      error: {
+        header: {
+          bg: "surface.red",
+          color: "surface.red.fg",
+          "--silver-text-color": "token(colors.surface.red.fg)",
+          "--silver-text-color-muted": "token(colors.surface.red.fg)"
+        }
+      },
+      info: {
+        header: {
+          bg: "surface.blue",
+          color: "surface.blue.fg",
+          "--silver-text-color": "token(colors.surface.blue.fg)",
+          "--silver-text-color-muted": "token(colors.surface.blue.fg)"
+        }
+      },
+      success: {
+        header: {
+          bg: "surface.green",
+          color: "surface.green.fg",
+          "--silver-text-color": "token(colors.surface.green.fg)",
+          "--silver-text-color-muted": "token(colors.surface.green.fg)"
+        }
+      },
+      warning: {
+        header: {
+          bg: "surface.yellow",
+          color: "surface.yellow.fg",
+          "--silver-text-color": "token(colors.surface.yellow.fg)",
+          "--silver-text-color-muted": "token(colors.surface.yellow.fg)"
+        }
+      }
+    },
+    container: {
+      card: {
+        header: { borderTopRadius: "lg" },
+        bodyContent: { borderBottomRadius: "lg" }
+      },
+      section: {}
+    },
+    // Squares off the header's bottom corners while the body is revealed; the
+    // compound variant rounds them back when there is no expanded content.
+    hasContent: {
+      true: {},
+      false: {}
+    },
+    isCentered: {
+      true: { header: { alignItems: "center" } },
+      false: {}
+    },
+    isExpanded: {
+      true: { chevron: { transform: "rotate(180deg)" } },
+      false: { body: { gridTemplateRows: "0fr" } }
+    },
+    padding: paddingVariants
+  },
+  compoundVariants: [
+    {
+      container: "card",
+      css: { header: { borderBottomRadius: "lg" } },
+      hasContent: false
+    }
+  ],
+  defaultVariants: {
+    container: "card",
+    hasContent: false,
+    isCentered: false,
+    isExpanded: false,
+    status: "info"
+  }
+});
+var statusRole = {
+  error: "alert",
+  info: "status",
+  success: "status",
+  warning: "alert"
+};
+var defaultIcons = {
+  error: /* @__PURE__ */ jsx(Icon, { color: "error", icon: XCircle }),
+  info: /* @__PURE__ */ jsx(Icon, { color: "info", icon: Info }),
+  success: /* @__PURE__ */ jsx(Icon, { color: "success", icon: CheckCircle2 }),
+  warning: /* @__PURE__ */ jsx(Icon, { color: "warning", icon: TriangleAlert })
+};
+function Alert({
+  children,
+  className,
+  container = "card",
+  "data-testid": dataTestId,
+  description,
+  endContent,
+  icon,
+  isDefaultExpanded = false,
+  isDismissable = false,
+  onDismiss,
+  padding,
+  ref,
+  status,
+  style,
+  title
+}) {
+  const bodyId = useId();
+  const [isDismissed, setIsDismissed] = useState(false);
+  const [isExpanded, setIsExpanded] = useState(isDefaultExpanded);
+  const hasChildren = children != null;
+  const showContent = hasChildren && isExpanded;
+  const showEndArea = endContent != null || isDismissable || hasChildren;
+  const isSingleLine = description == null && (endContent != null || isDismissable || hasChildren);
+  if (isDismissed) {
+    return null;
+  }
+  const classes = alertRecipe({
+    container,
+    hasContent: showContent,
+    isCentered: isSingleLine,
+    isExpanded,
+    padding,
+    status
+  });
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cx(classes.root, className),
+      "data-testid": dataTestId,
+      ref,
+      role: statusRole[status],
+      style,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: classes.header, children: [
+          /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: classes.icon, children: icon ?? defaultIcons[status] }),
+          /* @__PURE__ */ jsxs("div", { className: classes.content, children: [
+            /* @__PURE__ */ jsx(Text, { as: "p", type: "label", weight: "semibold", children: title }),
+            description != null ? /* @__PURE__ */ jsx(Text, { as: "p", color: "secondary", type: "supporting", children: description }) : null
+          ] }),
+          showEndArea ? /* @__PURE__ */ jsxs("div", { className: classes.endArea, children: [
+            endContent,
+            hasChildren ? /* @__PURE__ */ jsx(
+              Button,
+              {
+                "aria-controls": bodyId,
+                "aria-expanded": isExpanded,
+                className: classes.chevron,
+                icon: ChevronDown,
+                isIconOnly: true,
+                label: isExpanded ? "Collapse" : "Expand",
+                onClick: () => setIsExpanded((value) => !value),
+                size: "sm",
+                variant: "ghost"
+              }
+            ) : null,
+            isDismissable ? /* @__PURE__ */ jsx(
+              Button,
+              {
+                icon: X,
+                isIconOnly: true,
+                label: "Dismiss",
+                onClick: () => {
+                  setIsDismissed(true);
+                  onDismiss?.();
+                },
+                size: "sm",
+                variant: "ghost"
+              }
+            ) : null
+          ] }) : null
+        ] }),
+        hasChildren ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: classes.body,
+            id: bodyId,
+            style: { visibility: isExpanded ? void 0 : "hidden" },
+            children: /* @__PURE__ */ jsx("div", { className: classes.bodyContent, children })
+          }
+        ) : null
+      ]
+    }
+  );
+}
+Alert.displayName = "Alert";
+
+export { Alert };
+//# sourceMappingURL=chunk-SXIBQQ55.js.map
+//# sourceMappingURL=chunk-SXIBQQ55.js.map

package/dist/chunk-SXIBQQ55.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Alert/Alert.recipe.ts","../src/components/Alert/Alert.tsx"],"names":[],"mappings":"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","file":"chunk-SXIBQQ55.js","sourcesContent":["import {sva, type RecipeVariantProps} from 'styled-system/css';\n\n/**\n * Symmetric padding overrides for the collapsible body. Keys mirror the\n * `SpacingToken` scale so the `padding` prop maps onto build-time-validated\n * spacing tokens instead of a runtime token lookup.\n */\nconst paddingVariants = {\n  0: {bodyContent: {px: '0', py: '0'}},\n  0.5: {bodyContent: {px: '0.5', py: '0.5'}},\n  1: {bodyContent: {px: '1', py: '1'}},\n  1.5: {bodyContent: {px: '1.5', py: '1.5'}},\n  2: {bodyContent: {px: '2', py: '2'}},\n  3: {bodyContent: {px: '3', py: '3'}},\n  4: {bodyContent: {px: '4', py: '4'}},\n  5: {bodyContent: {px: '5', py: '5'}},\n  6: {bodyContent: {px: '6', py: '6'}},\n  8: {bodyContent: {px: '8', py: '8'}},\n  10: {bodyContent: {px: '10', py: '10'}},\n};\n\nexport const alertRecipe = sva({\n  slots: [\n    'root',\n    'header',\n    'icon',\n    'content',\n    'endArea',\n    'chevron',\n    'body',\n    'bodyContent',\n  ],\n  base: {\n    root: {\n      display: 'flex',\n      flexDirection: 'column',\n      fontFamily: 'body',\n    },\n    header: {\n      display: 'flex',\n      alignItems: 'flex-start',\n      gap: '2',\n      px: '4',\n      py: '3',\n    },\n    icon: {\n      display: 'inline-flex',\n      alignItems: 'center',\n      flexShrink: 0,\n    },\n    content: {\n      display: 'flex',\n      flex: 1,\n      flexDirection: 'column',\n      minW: 0,\n    },\n    endArea: {\n      display: 'flex',\n      alignItems: 'center',\n      flexShrink: 0,\n      gap: '2',\n      ms: 'auto',\n    },\n    // The body stays mounted so child state and the `aria-controls` target are\n    // preserved; it is collapsed with a `grid-template-rows` 1fr -> 0fr\n    // transition (mirroring `AccordionItem`). `overflow: hidden` lives on this\n    // grid so the body chrome on `bodyContent` is fully clipped when collapsed.\n    body: {\n      display: 'grid',\n      gridTemplateRows: '1fr',\n      overflow: 'hidden',\n      // `visibility` is transitioned alongside the rows so the content stays\n      // readable while collapsing, then becomes `hidden` (removing it from the\n      // a11y tree and tab order) once closed. The inline `visibility` style in\n      // the component drives the open/closed value.\n      transitionProperty: 'grid-template-rows, visibility',\n      transitionDuration: 'normal',\n      transitionTimingFunction: 'default',\n      '@media (prefers-reduced-motion: reduce)': {\n        transitionDuration: '0.01s',\n      },\n    },\n    bodyContent: {\n      minH: 0,\n      bg: 'bg',\n      borderBlockEndWidth: 'default',\n      borderColor: 'border',\n      borderInlineWidth: 'default',\n      borderStyle: 'solid',\n      px: '4',\n      py: '3',\n    },\n  },\n  variants: {\n    status: {\n      error: {\n        header: {\n          bg: 'surface.red',\n          color: 'surface.red.fg',\n          '--silver-text-color': 'token(colors.surface.red.fg)',\n          '--silver-text-color-muted': 'token(colors.surface.red.fg)',\n        },\n      },\n      info: {\n        header: {\n          bg: 'surface.blue',\n          color: 'surface.blue.fg',\n          '--silver-text-color': 'token(colors.surface.blue.fg)',\n          '--silver-text-color-muted': 'token(colors.surface.blue.fg)',\n        },\n      },\n      success: {\n        header: {\n          bg: 'surface.green',\n          color: 'surface.green.fg',\n          '--silver-text-color': 'token(colors.surface.green.fg)',\n          '--silver-text-color-muted': 'token(colors.surface.green.fg)',\n        },\n      },\n      warning: {\n        header: {\n          bg: 'surface.yellow',\n          color: 'surface.yellow.fg',\n          '--silver-text-color': 'token(colors.surface.yellow.fg)',\n          '--silver-text-color-muted': 'token(colors.surface.yellow.fg)',\n        },\n      },\n    },\n    container: {\n      card: {\n        header: {borderTopRadius: 'lg'},\n        bodyContent: {borderBottomRadius: 'lg'},\n      },\n      section: {},\n    },\n    // Squares off the header's bottom corners while the body is revealed; the\n    // compound variant rounds them back when there is no expanded content.\n    hasContent: {\n      true: {},\n      false: {},\n    },\n    isCentered: {\n      true: {header: {alignItems: 'center'}},\n      false: {},\n    },\n    isExpanded: {\n      true: {chevron: {transform: 'rotate(180deg)'}},\n      false: {body: {gridTemplateRows: '0fr'}},\n    },\n    padding: paddingVariants,\n  },\n  compoundVariants: [\n    {\n      container: 'card',\n      css: {header: {borderBottomRadius: 'lg'}},\n      hasContent: false,\n    },\n  ],\n  defaultVariants: {\n    container: 'card',\n    hasContent: false,\n    isCentered: false,\n    isExpanded: false,\n    status: 'info',\n  },\n});\n\nexport type AlertVariants = RecipeVariantProps<typeof alertRecipe>;\n","import {\n  CheckCircle2,\n  ChevronDown,\n  Info,\n  TriangleAlert,\n  X,\n  XCircle,\n} from 'lucide-react';\nimport {\n  useId,\n  useState,\n  type CSSProperties,\n  type ReactNode,\n  type Ref,\n} from 'react';\nimport {cx} from '../../internal/cx';\nimport type {SpacingToken} from '../../internal/spacingTokens';\nimport {Button} from '../Button';\nimport {Icon} from '../Icon';\nimport {Text} from '../Text';\nimport {alertRecipe, type AlertVariants} from './Alert.recipe';\n\n/**\n * Derived from the recipe's `container` variant so the prop stays in sync with\n * the styles.\n */\nexport type AlertContainer = NonNullable<\n  NonNullable<AlertVariants>['container']\n>;\n/**\n * Derived from the recipe's `status` variant so the prop stays in sync with the\n * styles.\n */\nexport type AlertStatus = NonNullable<NonNullable<AlertVariants>['status']>;\n\nexport interface AlertProps {\n  /**\n   * Extra content rendered below the alert header in a collapsible area.\n   */\n  children?: ReactNode;\n  /**\n   * Additional CSS class names applied to the root element.\n   */\n  className?: string;\n  /**\n   * Visual container style.\n   * @default 'card'\n   */\n  container?: AlertContainer;\n  /**\n   * Test ID applied to the root element.\n   */\n  'data-testid'?: string;\n  /**\n   * Supporting description displayed below the title.\n   */\n  description?: ReactNode;\n  /**\n   * Content rendered at the end of the header, before collapse and dismiss controls.\n   */\n  endContent?: ReactNode;\n  /**\n   * Custom status icon. A default icon is rendered when omitted.\n   */\n  icon?: ReactNode;\n  /**\n   * Whether collapsible children are expanded initially.\n   * @default false\n   */\n  isDefaultExpanded?: boolean;\n  /**\n   * Whether the alert can be dismissed.\n   * @default false\n   */\n  isDismissable?: boolean;\n  /**\n   * Called when the dismiss button is clicked.\n   */\n  onDismiss?: () => void;\n  /**\n   * Inner padding step.\n   * @default 4\n   */\n  padding?: SpacingToken;\n  /**\n   * Ref forwarded to the root element.\n   */\n  ref?: Ref<HTMLDivElement>;\n  /**\n   * Status controlling role, icon, and color.\n   */\n  status: AlertStatus;\n  /**\n   * Inline styles applied to the root element.\n   */\n  style?: CSSProperties;\n  /**\n   * Primary alert title.\n   */\n  title: ReactNode;\n}\n\nconst statusRole: Record<AlertStatus, 'alert' | 'status'> = {\n  error: 'alert',\n  info: 'status',\n  success: 'status',\n  warning: 'alert',\n};\n\nconst defaultIcons: Record<AlertStatus, ReactNode> = {\n  error: <Icon color=\"error\" icon={XCircle} />,\n  info: <Icon color=\"info\" icon={Info} />,\n  success: <Icon color=\"success\" icon={CheckCircle2} />,\n  warning: <Icon color=\"warning\" icon={TriangleAlert} />,\n};\n\n/**\n * Displays a contextual message with status-based styling, an optional\n * collapsible body, and dismiss functionality.\n */\nexport function Alert({\n  children,\n  className,\n  container = 'card',\n  'data-testid': dataTestId,\n  description,\n  endContent,\n  icon,\n  isDefaultExpanded = false,\n  isDismissable = false,\n  onDismiss,\n  padding,\n  ref,\n  status,\n  style,\n  title,\n}: AlertProps): React.JSX.Element | null {\n  const bodyId = useId();\n  const [isDismissed, setIsDismissed] = useState(false);\n  const [isExpanded, setIsExpanded] = useState(isDefaultExpanded);\n  const hasChildren = children != null;\n  // The body is kept mounted whenever there are children (so child state and\n  // the `aria-controls` target survive collapsing); `isExpanded` only drives\n  // the visual collapse. `showContent` reflects whether the body is currently\n  // revealed, which the header uses to square off its bottom corners.\n  const showContent = hasChildren && isExpanded;\n  const showEndArea = endContent != null || isDismissable || hasChildren;\n  const isSingleLine =\n    description == null && (endContent != null || isDismissable || hasChildren);\n\n  if (isDismissed) {\n    return null;\n  }\n\n  const classes = alertRecipe({\n    container,\n    hasContent: showContent,\n    isCentered: isSingleLine,\n    isExpanded,\n    padding,\n    status,\n  });\n\n  return (\n    <div\n      className={cx(classes.root, className)}\n      data-testid={dataTestId}\n      ref={ref}\n      role={statusRole[status]}\n      style={style}>\n      <div className={classes.header}>\n        <span aria-hidden=\"true\" className={classes.icon}>\n          {icon ?? defaultIcons[status]}\n        </span>\n        <div className={classes.content}>\n          <Text as=\"p\" type=\"label\" weight=\"semibold\">\n            {title}\n          </Text>\n          {description != null ? (\n            <Text as=\"p\" color=\"secondary\" type=\"supporting\">\n              {description}\n            </Text>\n          ) : null}\n        </div>\n        {showEndArea ? (\n          <div className={classes.endArea}>\n            {endContent}\n            {hasChildren ? (\n              <Button\n                aria-controls={bodyId}\n                aria-expanded={isExpanded}\n                className={classes.chevron}\n                icon={ChevronDown}\n                isIconOnly\n                label={isExpanded ? 'Collapse' : 'Expand'}\n                onClick={() => setIsExpanded(value => !value)}\n                size=\"sm\"\n                variant=\"ghost\"\n              />\n            ) : null}\n            {isDismissable ? (\n              <Button\n                icon={X}\n                isIconOnly\n                label=\"Dismiss\"\n                onClick={() => {\n                  setIsDismissed(true);\n                  onDismiss?.();\n                }}\n                size=\"sm\"\n                variant=\"ghost\"\n              />\n            ) : null}\n          </div>\n        ) : null}\n      </div>\n      {hasChildren ? (\n        <div\n          className={classes.body}\n          id={bodyId}\n          style={{visibility: isExpanded ? undefined : 'hidden'}}>\n          <div className={classes.bodyContent}>{children}</div>\n        </div>\n      ) : null}\n    </div>\n  );\n}\n\nAlert.displayName = 'Alert';\n"]}

package/dist/{chunk-ZW4XKNDR.cjs → chunk-TH3H5UGK.cjs}

@@ -1,11 +1,11 @@
 'use strict';
 
-var chunkLBRKUZSQ_cjs = require('./chunk-LBRKUZSQ.cjs');
-var chunkUZNSGQT3_cjs = require('./chunk-UZNSGQT3.cjs');
-var chunkNILB6Y4Z_cjs = require('./chunk-NILB6Y4Z.cjs');
-var chunk47BELFYO_cjs = require('./chunk-47BELFYO.cjs');
-var jsxRuntime = require('react/jsx-runtime');
+var chunkIKF6VHA4_cjs = require('./chunk-IKF6VHA4.cjs');
+var chunkHMWV6KCW_cjs = require('./chunk-HMWV6KCW.cjs');
+var chunkO3T7Z6RH_cjs = require('./chunk-O3T7Z6RH.cjs');
+var chunkJMNH45Q3_cjs = require('./chunk-JMNH45Q3.cjs');
 var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
 
 function AlertDialog({
   actionLabel,
@@ -23,37 +23,54 @@ function AlertDialog({
   title,
   width = 400
 }) {
+  const actionFiredRef = react.useRef(false);
+  react.useEffect(() => {
+    if (!isActionLoading) {
+      actionFiredRef.current = false;
+    }
+  }, [isActionLoading]);
+  react.useEffect(() => {
+    if (!isOpen) {
+      actionFiredRef.current = false;
+    }
+  }, [isOpen]);
+  const handleAction = react.useCallback(() => {
+    if (actionFiredRef.current) {
+      return;
+    }
+    actionFiredRef.current = true;
+    onAction();
+  }, [onAction]);
   return /* @__PURE__ */ jsxRuntime.jsx(
-    chunkLBRKUZSQ_cjs.Dialog,
+    chunkIKF6VHA4_cjs.Dialog,
     {
       className,
       "data-testid": dataTestId,
       dismissBehavior: false,
       isOpen,
-      label: title,
       onOpenChange,
       ref,
       role: "alertdialog",
       style,
       width,
       children: /* @__PURE__ */ jsxRuntime.jsx(
-        chunkUZNSGQT3_cjs.Layout,
+        chunkHMWV6KCW_cjs.Layout,
         {
-          content: /* @__PURE__ */ jsxRuntime.jsx(chunkUZNSGQT3_cjs.LayoutContent, { children: /* @__PURE__ */ jsxRuntime.jsx(chunk47BELFYO_cjs.Text, { as: "p", color: "secondary", children: description }) }),
+          content: /* @__PURE__ */ jsxRuntime.jsx(chunkHMWV6KCW_cjs.LayoutContent, { children: /* @__PURE__ */ jsxRuntime.jsx(chunkJMNH45Q3_cjs.Text, { as: "p", color: "secondary", children: description }) }),
           footer: /* @__PURE__ */ jsxRuntime.jsx(
-            chunkUZNSGQT3_cjs.LayoutFooter,
+            chunkHMWV6KCW_cjs.LayoutFooter,
             {
               primaryButton: /* @__PURE__ */ jsxRuntime.jsx(
-                chunkNILB6Y4Z_cjs.Button,
+                chunkO3T7Z6RH_cjs.Button,
                 {
                   isLoading: isActionLoading,
                   label: actionLabel,
-                  onClick: onAction,
+                  onClick: handleAction,
                   variant: actionVariant
                 }
               ),
               secondaryButton: /* @__PURE__ */ jsxRuntime.jsx(
-                chunkNILB6Y4Z_cjs.Button,
+                chunkO3T7Z6RH_cjs.Button,
                 {
                   label: cancelLabel,
                   onClick: () => onOpenChange(false),
@@ -63,7 +80,7 @@ function AlertDialog({
             }
           ),
           hasDividers: true,
-          header: /* @__PURE__ */ jsxRuntime.jsx(chunkUZNSGQT3_cjs.LayoutHeader, { title })
+          header: /* @__PURE__ */ jsxRuntime.jsx(chunkHMWV6KCW_cjs.LayoutHeader, { title })
         }
       )
     }
@@ -77,15 +94,15 @@ function useAlertDialog() {
     setOptions(nextOptions);
     setIsOpen(true);
   }, []);
-  const hide = react.useCallback(() => setIsOpen(false), []);
-  const element = react.useMemo(
-    () => options == null ? null : /* @__PURE__ */ jsxRuntime.jsx(AlertDialog, { ...options, isOpen, onOpenChange: setIsOpen }),
-    [isOpen, options]
-  );
+  const hide = react.useCallback(() => {
+    setIsOpen(false);
+    setOptions(null);
+  }, []);
+  const element = options == null ? null : /* @__PURE__ */ jsxRuntime.jsx(AlertDialog, { ...options, isOpen, onOpenChange: setIsOpen });
   return { element, hide, isOpen, show };
 }
 
 exports.AlertDialog = AlertDialog;
 exports.useAlertDialog = useAlertDialog;
-//# sourceMappingURL=chunk-ZW4XKNDR.cjs.map
-//# sourceMappingURL=chunk-ZW4XKNDR.cjs.map
+//# sourceMappingURL=chunk-TH3H5UGK.cjs.map
+//# sourceMappingURL=chunk-TH3H5UGK.cjs.map

package/dist/chunk-TH3H5UGK.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AlertDialog/AlertDialog.tsx","../src/components/AlertDialog/useAlertDialog.tsx"],"names":["useRef","useEffect","useCallback","jsx","Dialog","Layout","LayoutContent","Text","LayoutFooter","Button","LayoutHeader","useState"],"mappings":"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","file":"chunk-TH3H5UGK.cjs","sourcesContent":["import {\n  useCallback,\n  useEffect,\n  useRef,\n  type CSSProperties,\n  type Ref,\n} from 'react';\nimport {Button} from '../Button';\nimport {Dialog} from '../Dialog';\nimport {Layout, LayoutContent, LayoutFooter, LayoutHeader} from '../Layout';\nimport {Text} from '../Text';\n\nexport type AlertDialogActionVariant = 'destructive' | 'primary';\n\nexport interface AlertDialogProps {\n  /**\n   * Action button label.\n   */\n  actionLabel: string;\n  /**\n   * Visual variant for the action button.\n   * @default 'destructive'\n   */\n  actionVariant?: AlertDialogActionVariant;\n  /**\n   * Cancel button label.\n   * @default 'Cancel'\n   */\n  cancelLabel?: string;\n  /**\n   * Additional CSS class names applied to the dialog.\n   */\n  className?: string;\n  /**\n   * Test ID applied to the dialog.\n   */\n  'data-testid'?: string;\n  /**\n   * Consequence description.\n   */\n  description: string;\n  /**\n   * Whether the action button is loading.\n   * @default false\n   */\n  isActionLoading?: boolean;\n  /**\n   * Whether the dialog is open.\n   */\n  isOpen: boolean;\n  /**\n   * Called when the primary action is clicked.\n   */\n  onAction: () => void;\n  /**\n   * Called when the dialog requests an open-state change.\n   */\n  onOpenChange: (isOpen: boolean) => void;\n  /**\n   * Ref forwarded to the dialog element.\n   */\n  ref?: Ref<HTMLDialogElement>;\n  /**\n   * Inline styles applied to the dialog.\n   */\n  style?: CSSProperties;\n  /**\n   * Dialog title.\n   */\n  title: string;\n  /**\n   * Dialog width. Numbers are treated as pixels.\n   * @default 400\n   */\n  width?: number | string;\n}\n\n/**\n * A modal confirmation dialog for destructive or irreversible actions.\n */\nexport function AlertDialog({\n  actionLabel,\n  actionVariant = 'destructive',\n  cancelLabel = 'Cancel',\n  className,\n  'data-testid': dataTestId,\n  description,\n  isActionLoading = false,\n  isOpen,\n  onAction,\n  onOpenChange,\n  ref,\n  style,\n  title,\n  width = 400,\n}: AlertDialogProps): React.JSX.Element | null {\n  /**\n   * Synchronous guard against rapid double-invocation of onAction.\n   * The ref flips immediately on the first call — before React can\n   * re-render with `isActionLoading=true` — so a second Enter/click\n   * in the same event-loop tick is ignored.\n   */\n  const actionFiredRef = useRef(false);\n\n  useEffect(() => {\n    if (!isActionLoading) {\n      actionFiredRef.current = false;\n    }\n  }, [isActionLoading]);\n\n  useEffect(() => {\n    if (!isOpen) {\n      actionFiredRef.current = false;\n    }\n  }, [isOpen]);\n\n  const handleAction = useCallback(() => {\n    if (actionFiredRef.current) {\n      return;\n    }\n    actionFiredRef.current = true;\n    onAction();\n  }, [onAction]);\n\n  return (\n    <Dialog\n      className={className}\n      data-testid={dataTestId}\n      dismissBehavior={false}\n      isOpen={isOpen}\n      onOpenChange={onOpenChange}\n      ref={ref}\n      role=\"alertdialog\"\n      style={style}\n      width={width}>\n      <Layout\n        content={\n          <LayoutContent>\n            <Text as=\"p\" color=\"secondary\">\n              {description}\n            </Text>\n          </LayoutContent>\n        }\n        footer={\n          <LayoutFooter\n            primaryButton={\n              <Button\n                isLoading={isActionLoading}\n                label={actionLabel}\n                onClick={handleAction}\n                variant={actionVariant}\n              />\n            }\n            secondaryButton={\n              <Button\n                label={cancelLabel}\n                onClick={() => onOpenChange(false)}\n                variant=\"ghost\"\n              />\n            }\n          />\n        }\n        hasDividers\n        header={<LayoutHeader title={title} />}\n      />\n    </Dialog>\n  );\n}\n\nAlertDialog.displayName = 'AlertDialog';\n","import {useCallback, useState, type ReactNode} from 'react';\nimport {AlertDialog, type AlertDialogProps} from './AlertDialog';\n\nexport type AlertDialogOptions = Omit<\n  AlertDialogProps,\n  'isOpen' | 'onOpenChange'\n>;\n\nexport interface UseAlertDialogReturn {\n  /**\n   * Render this element in your tree.\n   */\n  element: ReactNode;\n  /**\n   * Hide the current alert dialog.\n   */\n  hide: () => void;\n  /**\n   * Whether the alert dialog is open.\n   */\n  isOpen: boolean;\n  /**\n   * Show an alert dialog with the provided options.\n   */\n  show: (options: AlertDialogOptions) => void;\n}\n\nexport function useAlertDialog(): UseAlertDialogReturn {\n  const [isOpen, setIsOpen] = useState(false);\n  const [options, setOptions] = useState<AlertDialogOptions | null>(null);\n\n  const show = useCallback((nextOptions: AlertDialogOptions) => {\n    setOptions(nextOptions);\n    setIsOpen(true);\n  }, []);\n  const hide = useCallback(() => {\n    setIsOpen(false);\n    setOptions(null);\n  }, []);\n\n  const element: ReactNode =\n    options == null ? null : (\n      <AlertDialog {...options} isOpen={isOpen} onOpenChange={setIsOpen} />\n    );\n\n  return {element, hide, isOpen, show};\n}\n"]}

package/dist/{chunk-5EQN3YMQ.cjs → chunk-TO3ZPSYO.cjs}

@@ -1,33 +1,33 @@
 'use strict';
 
-var chunkYMC56K6R_cjs = require('./chunk-YMC56K6R.cjs');
-var chunk5G3BY75L_cjs = require('./chunk-5G3BY75L.cjs');
-var chunkG44NDBPN_cjs = require('./chunk-G44NDBPN.cjs');
-var chunk2WP6NYYY_cjs = require('./chunk-2WP6NYYY.cjs');
-var chunk47BELFYO_cjs = require('./chunk-47BELFYO.cjs');
-var chunk2QM5XBX4_cjs = require('./chunk-2QM5XBX4.cjs');
-var chunkMKAOIB2O_cjs = require('./chunk-MKAOIB2O.cjs');
+var chunk4I6VIR44_cjs = require('./chunk-4I6VIR44.cjs');
+var chunk2P6D43V2_cjs = require('./chunk-2P6D43V2.cjs');
+var chunkW5G7ZDQ6_cjs = require('./chunk-W5G7ZDQ6.cjs');
+var chunkYXYD5HKL_cjs = require('./chunk-YXYD5HKL.cjs');
+var chunkJMNH45Q3_cjs = require('./chunk-JMNH45Q3.cjs');
+var chunkWMXIUOOU_cjs = require('./chunk-WMXIUOOU.cjs');
+var chunk7GN6YTSS_cjs = require('./chunk-7GN6YTSS.cjs');
 var chunk6SHL7FYO_cjs = require('./chunk-6SHL7FYO.cjs');
-var chunkPHFEQG4E_cjs = require('./chunk-PHFEQG4E.cjs');
+var chunk4TIAKZ4Q_cjs = require('./chunk-4TIAKZ4Q.cjs');
 var chunkSPDVNY2Z_cjs = require('./chunk-SPDVNY2Z.cjs');
-var chunkAZDWQGAX_cjs = require('./chunk-AZDWQGAX.cjs');
+var chunkRU6JG3FS_cjs = require('./chunk-RU6JG3FS.cjs');
 var lucideReact = require('lucide-react');
 var react = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 
 var styles = {
-  root: chunkAZDWQGAX_cjs.css({
+  root: chunkRU6JG3FS_cjs.css({
     display: "flex",
     flexDirection: "column"
   }),
-  boxWrap: chunkAZDWQGAX_cjs.css({
+  boxWrap: chunkRU6JG3FS_cjs.css({
     position: "relative",
     display: "inline-flex",
     alignItems: "center",
     justifyContent: "center",
     flexShrink: 0
   }),
-  input: chunkAZDWQGAX_cjs.css({
+  input: chunkRU6JG3FS_cjs.css({
     position: "absolute",
     inset: 0,
     opacity: 0,
@@ -36,7 +36,7 @@ var styles = {
       cursor: "not-allowed"
     }
   }),
-  box: chunkAZDWQGAX_cjs.css({
+  box: chunkRU6JG3FS_cjs.css({
     display: "inline-flex",
     alignItems: "center",
     justifyContent: "center",
@@ -54,32 +54,32 @@ var styles = {
       outlineOffset: "focusOffset"
     }
   }),
-  boxChecked: chunkAZDWQGAX_cjs.css({
+  boxChecked: chunkRU6JG3FS_cjs.css({
     bg: "primary",
     borderColor: "primary"
   }),
-  boxDisabled: chunkAZDWQGAX_cjs.css({
+  boxDisabled: chunkRU6JG3FS_cjs.css({
     opacity: 0.55
   }),
   boxSize: {
-    sm: chunkAZDWQGAX_cjs.css({ w: "4.5", h: "4.5" }),
-    md: chunkAZDWQGAX_cjs.css({ w: "5.5", h: "5.5" })
+    sm: chunkRU6JG3FS_cjs.css({ w: "4.5", h: "4.5" }),
+    md: chunkRU6JG3FS_cjs.css({ w: "5.5", h: "5.5" })
   },
-  icon: chunkAZDWQGAX_cjs.css({
+  icon: chunkRU6JG3FS_cjs.css({
     w: "70%",
     h: "70%"
   }),
-  label: chunkAZDWQGAX_cjs.css({
+  label: chunkRU6JG3FS_cjs.css({
     cursor: "pointer"
   }),
-  labelDisabled: chunkAZDWQGAX_cjs.css({
+  labelDisabled: chunkRU6JG3FS_cjs.css({
     cursor: "not-allowed"
   }),
-  indicator: chunkAZDWQGAX_cjs.css({
+  indicator: chunkRU6JG3FS_cjs.css({
     fontWeight: "normal",
     color: "fg.muted"
   }),
-  tooltipIcon: chunkAZDWQGAX_cjs.css({
+  tooltipIcon: chunkRU6JG3FS_cjs.css({
     display: "inline-flex",
     color: "fg.muted"
   })
@@ -113,8 +113,8 @@ function CheckboxInput({
   const inputId = react.useId();
   const descriptionId = react.useId();
   const inputRef = react.useRef(null);
-  const statusMessageID = chunk5G3BY75L_cjs.getStatusMessageID(inputId, status);
-  const describedBy = chunk5G3BY75L_cjs.getDescribedBy(
+  const statusMessageID = chunk2P6D43V2_cjs.getStatusMessageID(inputId, status);
+  const describedBy = chunk2P6D43V2_cjs.getDescribedBy(
     description != null ? descriptionId : void 0,
     statusMessageID
   );
@@ -168,23 +168,23 @@ function CheckboxInput({
           isDisabled ? styles.boxDisabled : void 0
         ),
         children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx(
-          chunk2WP6NYYY_cjs.Spinner,
+          chunkYXYD5HKL_cjs.Spinner,
           {
             size: "sm",
             variant: isCheckedOrIndeterminate ? "onMedia" : "default"
           }
-        ) : isIndeterminate ? /* @__PURE__ */ jsxRuntime.jsx(chunkPHFEQG4E_cjs.Icon, { className: styles.icon, icon: lucideReact.Minus }) : isChecked ? /* @__PURE__ */ jsxRuntime.jsx(chunkPHFEQG4E_cjs.Icon, { className: styles.icon, icon: lucideReact.Check }) : null
+        ) : isIndeterminate ? /* @__PURE__ */ jsxRuntime.jsx(chunk4TIAKZ4Q_cjs.Icon, { className: styles.icon, icon: lucideReact.Minus }) : isChecked ? /* @__PURE__ */ jsxRuntime.jsx(chunk4TIAKZ4Q_cjs.Icon, { className: styles.icon, icon: lucideReact.Check }) : null
       }
     )
   ] });
   const labelContent = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    labelIcon != null ? /* @__PURE__ */ jsxRuntime.jsx(chunkPHFEQG4E_cjs.Icon, { color: "secondary", icon: labelIcon, size: "sm" }) : null,
+    labelIcon != null ? /* @__PURE__ */ jsxRuntime.jsx(chunk4TIAKZ4Q_cjs.Icon, { color: "secondary", icon: labelIcon, size: "sm" }) : null,
     label,
-    statusText != null ? /* @__PURE__ */ jsxRuntime.jsxs(chunk47BELFYO_cjs.Text, { as: "span", className: styles.indicator, type: "supporting", children: [
+    statusText != null ? /* @__PURE__ */ jsxRuntime.jsxs(chunkJMNH45Q3_cjs.Text, { as: "span", className: styles.indicator, type: "supporting", children: [
       /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children: " \xB7 " }),
       statusText
     ] }) : null,
-    labelTooltip != null ? /* @__PURE__ */ jsxRuntime.jsx(chunkMKAOIB2O_cjs.Tooltip, { content: labelTooltip, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles.tooltipIcon, children: /* @__PURE__ */ jsxRuntime.jsx(chunkPHFEQG4E_cjs.Icon, { icon: lucideReact.Info, size: "sm" }) }) }) : null
+    labelTooltip != null ? /* @__PURE__ */ jsxRuntime.jsx(chunk7GN6YTSS_cjs.Tooltip, { content: labelTooltip, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles.tooltipIcon, children: /* @__PURE__ */ jsxRuntime.jsx(chunk4TIAKZ4Q_cjs.Icon, { icon: lucideReact.Info, size: "sm" }) }) }) : null
   ] });
   const labelNode = /* @__PURE__ */ jsxRuntime.jsx(
     "label",
@@ -194,24 +194,24 @@ function CheckboxInput({
         isDisabled ? styles.labelDisabled : void 0
       ),
       htmlFor: inputId,
-      children: isLabelHidden ? /* @__PURE__ */ jsxRuntime.jsx(chunk2QM5XBX4_cjs.VisuallyHidden, { children: labelContent }) : labelContent
+      children: isLabelHidden ? /* @__PURE__ */ jsxRuntime.jsx(chunkWMXIUOOU_cjs.VisuallyHidden, { children: labelContent }) : labelContent
     }
   );
   const statusNode = status?.message != null ? /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
       "aria-live": status.type === "error" ? "assertive" : "polite",
-      className: chunkG44NDBPN_cjs.fieldStatusRecipe({
+      className: chunkW5G7ZDQ6_cjs.fieldRecipe({
         statusType: status.type,
         statusVariant: "detached"
-      }),
+      }).status,
       id: statusMessageID,
       role: status.type === "error" ? "alert" : "status",
       children: status.message
     }
   ) : null;
   const item = /* @__PURE__ */ jsxRuntime.jsx(
-    chunkYMC56K6R_cjs.Item,
+    chunk4I6VIR44_cjs.Item,
     {
       description: description != null ? /* @__PURE__ */ jsxRuntime.jsx("span", { id: descriptionId, children: description }) : void 0,
       endContent,
@@ -230,5 +230,5 @@ function CheckboxInput({
 CheckboxInput.displayName = "CheckboxInput";
 
 exports.CheckboxInput = CheckboxInput;
-//# sourceMappingURL=chunk-5EQN3YMQ.cjs.map
-//# sourceMappingURL=chunk-5EQN3YMQ.cjs.map
+//# sourceMappingURL=chunk-TO3ZPSYO.cjs.map
+//# sourceMappingURL=chunk-TO3ZPSYO.cjs.map