silver-ui 0.1.0

package/dist/chunk-NGWNIMMX.js

@@ -0,0 +1,247 @@
+import { fieldLabelRecipe, fieldStatusRecipe } from './chunk-RLQYXUDO.js';
+import { Text } from './chunk-PZO5MZ46.js';
+import { VisuallyHidden } from './chunk-V5W7NZN5.js';
+import { Tooltip } from './chunk-EB5EHX6I.js';
+import { Icon } from './chunk-4W7L63LH.js';
+import { cva } from './chunk-NAELQLZN.js';
+import { cx } from './chunk-PPNETWIP.js';
+import { css } from './chunk-UHQRL4OA.js';
+import { Info } from 'lucide-react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+var styles = {
+  root: css({
+    display: "flex",
+    flexDirection: "column",
+    gap: "1"
+  }),
+  indicator: css({
+    fontWeight: "normal",
+    color: "fg.muted"
+  }),
+  tooltipIcon: css({
+    display: "inline-flex",
+    color: "fg.muted"
+  }),
+  inputStatusWrapper: css({
+    display: "flex",
+    flexDirection: "column",
+    isolation: "isolate"
+  })
+};
+function Field({
+  children,
+  label,
+  isLabelHidden = false,
+  description,
+  inputId,
+  descriptionID,
+  isOptional = false,
+  isRequired = false,
+  isDisabled = false,
+  labelAs: LabelComponent = "label",
+  labelIcon,
+  labelId,
+  labelTooltip,
+  status,
+  statusVariant = "attached",
+  className,
+  "data-testid": dataTestId,
+  style,
+  ref
+}) {
+  const resolvedDescriptionID = descriptionID ?? (description != null ? `${inputId}-description` : void 0);
+  const resolvedStatusID = status?.messageID ?? (status?.message != null ? `${inputId}-status` : void 0);
+  const statusText = isOptional ? "Optional" : isRequired ? "Required" : null;
+  const labelNode = /* @__PURE__ */ jsxs(
+    LabelComponent,
+    {
+      className: fieldLabelRecipe({ isDisabled }),
+      ...LabelComponent === "label" ? { htmlFor: inputId } : void 0,
+      id: labelId,
+      children: [
+        labelIcon != null ? /* @__PURE__ */ jsx(Icon, { color: "secondary", icon: labelIcon, size: "sm" }) : null,
+        /* @__PURE__ */ jsx(Text, { as: "span", color: "inherit", type: "label", children: label }),
+        statusText != null ? /* @__PURE__ */ jsxs(Text, { as: "span", className: styles.indicator, type: "supporting", children: [
+          /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: " \xB7 " }),
+          statusText
+        ] }) : null,
+        labelTooltip != null ? /* @__PURE__ */ jsx(Tooltip, { content: labelTooltip, children: /* @__PURE__ */ jsx("span", { className: styles.tooltipIcon, children: /* @__PURE__ */ jsx(Icon, { icon: Info, size: "sm" }) }) }) : null
+      ]
+    }
+  );
+  const descriptionNode = description != null ? /* @__PURE__ */ jsx(
+    Text,
+    {
+      as: "span",
+      color: "secondary",
+      "data-testid": void 0,
+      id: resolvedDescriptionID,
+      type: "supporting",
+      children: description
+    }
+  ) : null;
+  const statusNode = status?.message != null ? /* @__PURE__ */ jsx(
+    "div",
+    {
+      "aria-live": status.type === "error" ? "assertive" : "polite",
+      className: fieldStatusRecipe({
+        statusType: status.type,
+        statusVariant
+      }),
+      id: resolvedStatusID,
+      role: status.type === "error" ? "alert" : "status",
+      children: status.message
+    }
+  ) : null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cx(styles.root, className),
+      "data-testid": dataTestId,
+      ref,
+      style,
+      children: [
+        isLabelHidden ? /* @__PURE__ */ jsxs(VisuallyHidden, { children: [
+          labelNode,
+          descriptionNode
+        ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+          labelNode,
+          descriptionNode
+        ] }),
+        statusVariant === "attached" ? /* @__PURE__ */ jsxs("div", { className: styles.inputStatusWrapper, children: [
+          children,
+          statusNode
+        ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+          children,
+          statusNode
+        ] })
+      ]
+    }
+  );
+}
+Field.displayName = "Field";
+
+// src/components/Field/inputStyles.ts
+var inputRecipe = cva({
+  base: {
+    boxSizing: "border-box",
+    position: "relative",
+    zIndex: 1,
+    display: "flex",
+    alignItems: "center",
+    gap: "2",
+    px: "3",
+    borderWidth: "default",
+    borderStyle: "solid",
+    borderColor: "border.emphasized",
+    borderRadius: "md",
+    bg: "bg",
+    transitionProperty: "border-color, box-shadow, opacity",
+    transitionDuration: "fast",
+    transitionTimingFunction: "default",
+    _hover: {
+      borderColor: "fg.muted"
+    },
+    _focusWithin: {
+      borderColor: "primary",
+      boxShadow: "focus"
+    }
+  },
+  variants: {
+    size: {
+      sm: { minH: "component.sm" },
+      md: { minH: "component.md" },
+      lg: { minH: "component.lg" }
+    },
+    status: {
+      warning: {
+        borderColor: "status.warning.border",
+        _hover: { borderColor: "status.warning.borderHover" },
+        _focusWithin: {
+          borderColor: "status.warning.border",
+          boxShadow: "focus.warning"
+        }
+      },
+      error: {
+        borderColor: "status.error.border",
+        _hover: { borderColor: "status.error.borderHover" },
+        _focusWithin: {
+          borderColor: "status.error.border",
+          boxShadow: "focus.error"
+        }
+      },
+      success: {
+        borderColor: "status.success.border",
+        _hover: { borderColor: "status.success.borderHover" },
+        _focusWithin: {
+          borderColor: "status.success.border",
+          boxShadow: "focus.success"
+        }
+      }
+    },
+    isDisabled: {
+      true: {
+        cursor: "not-allowed",
+        opacity: 0.55
+      },
+      false: {}
+    }
+  },
+  defaultVariants: {
+    size: "md",
+    isDisabled: false
+  }
+});
+var inputStyles = {
+  control: css({
+    display: "block",
+    flex: 1,
+    minW: 0,
+    borderWidth: 0,
+    borderStyle: "none",
+    p: 0,
+    fontFamily: "body",
+    fontSize: "md",
+    lineHeight: "normal",
+    color: "fg",
+    bg: "transparent",
+    outline: "none",
+    _placeholder: {
+      color: "fg.muted"
+    },
+    _disabled: {
+      cursor: "not-allowed"
+    }
+  }),
+  iconSlot: css({
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center",
+    flexShrink: 0,
+    color: "fg.muted"
+  }),
+  clearButton: css({
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center",
+    flexShrink: 0,
+    p: 0,
+    borderWidth: 0,
+    borderStyle: "none",
+    bg: "transparent",
+    color: "fg.muted",
+    cursor: "pointer",
+    borderRadius: "sm",
+    _focusVisible: {
+      outlineWidth: "focus",
+      outlineStyle: "solid",
+      outlineColor: "primary",
+      outlineOffset: "focusOffset"
+    }
+  })
+};
+
+export { Field, inputRecipe, inputStyles };
+//# sourceMappingURL=chunk-NGWNIMMX.js.map
+//# sourceMappingURL=chunk-NGWNIMMX.js.map

package/dist/chunk-NGWNIMMX.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Field/Field.tsx","../src/components/Field/inputStyles.ts"],"names":[],"mappings":"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","file":"chunk-NGWNIMMX.js","sourcesContent":["import {Info} from 'lucide-react';\nimport type {CSSProperties, ReactNode, Ref} from 'react';\nimport {css} from 'styled-system/css';\nimport {VisuallyHidden} from '../../internal/VisuallyHidden';\nimport {cx} from '../../internal/cx';\nimport {Icon, type IconComponent} from '../Icon';\nimport {Text} from '../Text';\nimport {Tooltip} from '../Tooltip';\nimport {fieldLabelRecipe, fieldStatusRecipe} from './Field.recipe';\nimport type {InputStatusType} from './types';\n\nexport type FieldStatusVariant = 'attached' | 'detached';\n\nexport interface FieldStatus {\n  /**\n   * Optional status text displayed below the input.\n   */\n  message?: string;\n  /**\n   * Status message ID used by `aria-describedby`.\n   */\n  messageID?: string;\n  /**\n   * Validation state for the field.\n   */\n  type: InputStatusType;\n}\n\ninterface FieldBaseProps {\n  /**\n   * The form control rendered inside the field.\n   */\n  children: ReactNode;\n  /**\n   * Additional CSS class names applied to the root element.\n   */\n  className?: string;\n  /**\n   * Test ID applied to the root element.\n   */\n  'data-testid'?: string;\n  /**\n   * Supporting text rendered between the label and control.\n   */\n  description?: ReactNode;\n  /**\n   * ID for the description element.\n   */\n  descriptionID?: string;\n  /**\n   * ID of the associated control.\n   */\n  inputId: string;\n  /**\n   * Whether the associated control is disabled.\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Whether to visually hide the label and description.\n   * @default false\n   */\n  isLabelHidden?: boolean;\n  /**\n   * Field label text.\n   */\n  label: string;\n  /**\n   * HTML element used for the label. Use 'span' for group controls\n   * (e.g., radiogroup) where `htmlFor` cannot target a labelable element.\n   * @default 'label'\n   */\n  labelAs?: 'label' | 'span';\n  /**\n   * Optional icon shown before the label.\n   */\n  labelIcon?: IconComponent;\n  /**\n   * ID applied to the label element, useful for `aria-labelledby`.\n   */\n  labelId?: string;\n  /**\n   * Tooltip content shown next to the label.\n   */\n  labelTooltip?: ReactNode;\n  /**\n   * Ref forwarded to the root element.\n   */\n  ref?: Ref<HTMLDivElement>;\n  /**\n   * Validation status displayed below the control.\n   */\n  status?: FieldStatus;\n  /**\n   * How the status message is positioned.\n   * @default 'attached'\n   */\n  statusVariant?: FieldStatusVariant;\n  /**\n   * Inline styles applied to the root element.\n   */\n  style?: CSSProperties;\n}\n\nexport interface FieldNecessity {\n  /**\n   * Whether the field is optional. Cannot be `true` when `isRequired` is `true`.\n   */\n  isOptional?: boolean;\n  /**\n   * Whether the field is required. Cannot be `true` when `isOptional` is `true`.\n   */\n  isRequired?: boolean;\n}\n\nexport type FieldProps = FieldBaseProps & FieldNecessity;\n\nconst styles = {\n  root: css({\n    display: 'flex',\n    flexDirection: 'column',\n    gap: '1',\n  }),\n  indicator: css({\n    fontWeight: 'normal',\n    color: 'fg.muted',\n  }),\n  tooltipIcon: css({\n    display: 'inline-flex',\n    color: 'fg.muted',\n  }),\n  inputStatusWrapper: css({\n    display: 'flex',\n    flexDirection: 'column',\n    isolation: 'isolate',\n  }),\n} as const;\n\n/**\n * A form field wrapper that renders a label, description, control slot, and validation status.\n */\nexport function Field({\n  children,\n  label,\n  isLabelHidden = false,\n  description,\n  inputId,\n  descriptionID,\n  isOptional = false,\n  isRequired = false,\n  isDisabled = false,\n  labelAs: LabelComponent = 'label',\n  labelIcon,\n  labelId,\n  labelTooltip,\n  status,\n  statusVariant = 'attached',\n  className,\n  'data-testid': dataTestId,\n  style,\n  ref,\n}: FieldProps): React.JSX.Element {\n  const resolvedDescriptionID =\n    descriptionID ??\n    (description != null ? `${inputId}-description` : undefined);\n  const resolvedStatusID =\n    status?.messageID ??\n    (status?.message != null ? `${inputId}-status` : undefined);\n  const statusText = isOptional ? 'Optional' : isRequired ? 'Required' : null;\n  const labelNode = (\n    <LabelComponent\n      className={fieldLabelRecipe({isDisabled})}\n      {...(LabelComponent === 'label' ? {htmlFor: inputId} : undefined)}\n      id={labelId}>\n      {labelIcon != null ? (\n        <Icon color=\"secondary\" icon={labelIcon} size=\"sm\" />\n      ) : null}\n      <Text as=\"span\" color=\"inherit\" type=\"label\">\n        {label}\n      </Text>\n      {statusText != null ? (\n        <Text as=\"span\" className={styles.indicator} type=\"supporting\">\n          <span aria-hidden=\"true\"> · </span>\n          {statusText}\n        </Text>\n      ) : null}\n      {labelTooltip != null ? (\n        <Tooltip content={labelTooltip}>\n          <span className={styles.tooltipIcon}>\n            <Icon icon={Info} size=\"sm\" />\n          </span>\n        </Tooltip>\n      ) : null}\n    </LabelComponent>\n  );\n  const descriptionNode =\n    description != null ? (\n      <Text\n        as=\"span\"\n        color=\"secondary\"\n        data-testid={undefined}\n        id={resolvedDescriptionID}\n        type=\"supporting\">\n        {description}\n      </Text>\n    ) : null;\n  const statusNode =\n    status?.message != null ? (\n      <div\n        aria-live={status.type === 'error' ? 'assertive' : 'polite'}\n        className={fieldStatusRecipe({\n          statusType: status.type,\n          statusVariant,\n        })}\n        id={resolvedStatusID}\n        role={status.type === 'error' ? 'alert' : 'status'}>\n        {status.message}\n      </div>\n    ) : null;\n\n  return (\n    <div\n      className={cx(styles.root, className)}\n      data-testid={dataTestId}\n      ref={ref}\n      style={style}>\n      {isLabelHidden ? (\n        <VisuallyHidden>\n          {labelNode}\n          {descriptionNode}\n        </VisuallyHidden>\n      ) : (\n        <>\n          {labelNode}\n          {descriptionNode}\n        </>\n      )}\n      {statusVariant === 'attached' ? (\n        <div className={styles.inputStatusWrapper}>\n          {children}\n          {statusNode}\n        </div>\n      ) : (\n        <>\n          {children}\n          {statusNode}\n        </>\n      )}\n    </div>\n  );\n}\n\nField.displayName = 'Field';\n","import {css, cva, type RecipeVariantProps} from 'styled-system/css';\n\nexport const inputRecipe = cva({\n  base: {\n    boxSizing: 'border-box',\n    position: 'relative',\n    zIndex: 1,\n    display: 'flex',\n    alignItems: 'center',\n    gap: '2',\n    px: '3',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'border.emphasized',\n    borderRadius: 'md',\n    bg: 'bg',\n    transitionProperty: 'border-color, box-shadow, opacity',\n    transitionDuration: 'fast',\n    transitionTimingFunction: 'default',\n    _hover: {\n      borderColor: 'fg.muted',\n    },\n    _focusWithin: {\n      borderColor: 'primary',\n      boxShadow: 'focus',\n    },\n  },\n  variants: {\n    size: {\n      sm: {minH: 'component.sm'},\n      md: {minH: 'component.md'},\n      lg: {minH: 'component.lg'},\n    },\n    status: {\n      warning: {\n        borderColor: 'status.warning.border',\n        _hover: {borderColor: 'status.warning.borderHover'},\n        _focusWithin: {\n          borderColor: 'status.warning.border',\n          boxShadow: 'focus.warning',\n        },\n      },\n      error: {\n        borderColor: 'status.error.border',\n        _hover: {borderColor: 'status.error.borderHover'},\n        _focusWithin: {\n          borderColor: 'status.error.border',\n          boxShadow: 'focus.error',\n        },\n      },\n      success: {\n        borderColor: 'status.success.border',\n        _hover: {borderColor: 'status.success.borderHover'},\n        _focusWithin: {\n          borderColor: 'status.success.border',\n          boxShadow: 'focus.success',\n        },\n      },\n    },\n    isDisabled: {\n      true: {\n        cursor: 'not-allowed',\n        opacity: 0.55,\n      },\n      false: {},\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n    isDisabled: false,\n  },\n});\n\nexport type InputVariants = RecipeVariantProps<typeof inputRecipe>;\n\nexport const inputStyles = {\n  control: css({\n    display: 'block',\n    flex: 1,\n    minW: 0,\n    borderWidth: 0,\n    borderStyle: 'none',\n    p: 0,\n    fontFamily: 'body',\n    fontSize: 'md',\n    lineHeight: 'normal',\n    color: 'fg',\n    bg: 'transparent',\n    outline: 'none',\n    _placeholder: {\n      color: 'fg.muted',\n    },\n    _disabled: {\n      cursor: 'not-allowed',\n    },\n  }),\n  iconSlot: css({\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    flexShrink: 0,\n    color: 'fg.muted',\n  }),\n  clearButton: css({\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    flexShrink: 0,\n    p: 0,\n    borderWidth: 0,\n    borderStyle: 'none',\n    bg: 'transparent',\n    color: 'fg.muted',\n    cursor: 'pointer',\n    borderRadius: 'sm',\n    _focusVisible: {\n      outlineWidth: 'focus',\n      outlineStyle: 'solid',\n      outlineColor: 'primary',\n      outlineOffset: 'focusOffset',\n    },\n  }),\n} as const;\n"]}

package/dist/chunk-NILB6Y4Z.cjs

@@ -0,0 +1,313 @@
+'use strict';
+
+var chunk2WP6NYYY_cjs = require('./chunk-2WP6NYYY.cjs');
+var chunkOA4KIVLO_cjs = require('./chunk-OA4KIVLO.cjs');
+var chunk2QM5XBX4_cjs = require('./chunk-2QM5XBX4.cjs');
+var chunkMKAOIB2O_cjs = require('./chunk-MKAOIB2O.cjs');
+var chunk2OXKEUKG_cjs = require('./chunk-2OXKEUKG.cjs');
+var chunkPHFEQG4E_cjs = require('./chunk-PHFEQG4E.cjs');
+var chunkJAX62FUE_cjs = require('./chunk-JAX62FUE.cjs');
+var chunkSPDVNY2Z_cjs = require('./chunk-SPDVNY2Z.cjs');
+var chunkAZDWQGAX_cjs = require('./chunk-AZDWQGAX.cjs');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/components/Button/Button.recipe.ts
+var buttonRecipe = chunkJAX62FUE_cjs.cva({
+  base: {
+    position: "relative",
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center",
+    borderWidth: 0,
+    borderStyle: "none",
+    fontFamily: "body",
+    fontWeight: "medium",
+    cursor: "pointer",
+    transitionProperty: "background-color, color, opacity, transform",
+    transitionDuration: "fast",
+    transitionTimingFunction: "default",
+    userSelect: "none",
+    lineHeight: "tight",
+    textDecoration: "none",
+    whiteSpace: "nowrap",
+    _active: {
+      transform: "scale(0.98)"
+    },
+    _disabled: {
+      opacity: 0.5,
+      cursor: "not-allowed",
+      pointerEvents: "none",
+      transform: "none"
+    },
+    '&[aria-disabled="true"]': {
+      opacity: 0.5,
+      cursor: "not-allowed",
+      pointerEvents: "auto",
+      transform: "none"
+    },
+    _focusVisible: {
+      outlineWidth: "focus",
+      outlineStyle: "solid",
+      outlineColor: "primary",
+      outlineOffset: "focusOffsetLoose"
+    }
+  },
+  variants: {
+    variant: {
+      primary: {
+        bg: "primary",
+        color: "fg.onPrimary",
+        _hover: { bg: "primary.hover" },
+        _active: { bg: "primary.active" }
+      },
+      secondary: {
+        bg: "bg.subtle",
+        color: "fg",
+        _hover: { bg: "bg.hover" },
+        _active: { bg: "surface.gray.hover" }
+      },
+      ghost: {
+        color: "fg",
+        bg: "transparent",
+        _hover: { bg: "bg.ghost.hover" },
+        _active: { bg: "bg.ghost.active" }
+      },
+      destructive: {
+        bg: "destructive",
+        color: "destructive.fg",
+        _hover: { bg: "destructive.hover" },
+        _active: { bg: "destructive.active" },
+        _focusVisible: {
+          outlineColor: "destructive"
+        }
+      },
+      onSolid: {
+        color: "inherit",
+        bg: "transparent",
+        _hover: { bg: "color-mix(in srgb, currentColor 15%, transparent)" },
+        _active: { bg: "color-mix(in srgb, currentColor 20%, transparent)" },
+        _focusVisible: {
+          outlineColor: "currentColor"
+        }
+      }
+    },
+    size: {
+      sm: {
+        h: "component.sm",
+        px: "component.sm",
+        fontSize: "component.sm",
+        gap: "1.5",
+        borderRadius: "component.sm",
+        "--button-icon-size": "var(--silver-sizes-icon-sm)"
+      },
+      md: {
+        h: "component.md",
+        px: "component.md",
+        fontSize: "component.md",
+        gap: "2",
+        borderRadius: "component.md",
+        "--button-icon-size": "var(--silver-sizes-icon-md)"
+      },
+      lg: {
+        h: "component.lg",
+        px: "component.lg",
+        fontSize: "component.lg",
+        gap: "2.5",
+        borderRadius: "component.lg",
+        "--button-icon-size": "var(--silver-sizes-icon-lg)"
+      }
+    },
+    iconOnly: {
+      true: {
+        aspectRatio: "square",
+        px: 0
+      },
+      false: {}
+    }
+  },
+  defaultVariants: {
+    variant: "secondary",
+    size: "md",
+    iconOnly: false
+  }
+});
+var styles = {
+  content: chunkAZDWQGAX_cjs.css({
+    display: "contents"
+  }),
+  label: chunkAZDWQGAX_cjs.css({
+    overflow: "hidden",
+    textOverflow: "ellipsis",
+    minW: 0
+  }),
+  icon: chunkAZDWQGAX_cjs.css({
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center",
+    flexShrink: 0
+  }),
+  endContent: chunkAZDWQGAX_cjs.css({
+    display: "inline-flex",
+    alignItems: "center",
+    color: "inherit"
+  }),
+  startContent: chunkAZDWQGAX_cjs.css({
+    display: "inline-flex",
+    alignItems: "center",
+    color: "inherit"
+  }),
+  loadingIndicator: chunkAZDWQGAX_cjs.css({
+    display: "inline-flex",
+    alignItems: "center",
+    color: "inherit"
+  })
+};
+function Button({
+  label,
+  "aria-controls": ariaControls,
+  "aria-current": ariaCurrent,
+  "aria-label": ariaLabelProp,
+  "aria-describedby": ariaDescribedby,
+  "aria-details": ariaDetails,
+  "aria-expanded": ariaExpanded,
+  "aria-haspopup": ariaHaspopup,
+  "aria-hidden": ariaHidden,
+  "aria-keyshortcuts": ariaKeyshortcuts,
+  "aria-labelledby": ariaLabelledby,
+  "aria-owns": ariaOwns,
+  "aria-pressed": ariaPressed,
+  "aria-roledescription": ariaRoledescription,
+  href,
+  as,
+  target,
+  rel,
+  variant,
+  size: sizeProp,
+  className,
+  "data-testid": dataTestId,
+  style,
+  type = "button",
+  ref,
+  isDisabled = false,
+  isLoading = false,
+  icon,
+  isIconOnly = false,
+  endContent,
+  startContent,
+  tooltip,
+  onClick,
+  onKeyDown,
+  form,
+  name,
+  value
+}) {
+  const LinkComponent = chunkOA4KIVLO_cjs.useLinkComponent(as);
+  const buttonGroup = chunk2OXKEUKG_cjs.useButtonGroup();
+  const size = sizeProp ?? buttonGroup?.size ?? "md";
+  const buttonDisabled = isDisabled || buttonGroup?.isDisabled === true || isLoading;
+  const useAriaDisabled = tooltip != null && buttonDisabled;
+  const renderAsLink = href != null && !buttonDisabled;
+  const opensInNewTab = renderAsLink && target === "_blank";
+  const ariaLabel = ariaLabelProp ?? chunkOA4KIVLO_cjs.getAriaLabel(
+    isIconOnly || isLoading || startContent != null || endContent != null || opensInNewTab ? label : void 0,
+    opensInNewTab
+  );
+  const linkRel = chunkOA4KIVLO_cjs.useRel({ target, rel });
+  const spinnerVariant = variant === "primary" || variant === "destructive" || variant === "onSolid" ? "onMedia" : "default";
+  const ariaAttrs = {
+    "aria-controls": ariaControls,
+    "aria-current": ariaCurrent,
+    "aria-describedby": ariaDescribedby,
+    "aria-details": ariaDetails,
+    "aria-expanded": ariaExpanded,
+    "aria-haspopup": ariaHaspopup,
+    "aria-hidden": ariaHidden,
+    "aria-keyshortcuts": ariaKeyshortcuts,
+    "aria-labelledby": ariaLabelledby,
+    "aria-owns": ariaOwns,
+    "aria-pressed": ariaPressed,
+    "aria-roledescription": ariaRoledescription
+  };
+  const handleButtonClick = (event) => {
+    if (buttonDisabled) {
+      event.preventDefault();
+      return;
+    }
+    onClick?.(event);
+  };
+  const handleLinkClick = (event) => {
+    onClick?.(event);
+  };
+  const handleButtonKeyDown = (event) => {
+    if (useAriaDisabled && (event.key === "Enter" || event.key === " ")) {
+      event.preventDefault();
+      return;
+    }
+    onKeyDown?.(event);
+  };
+  const handleLinkKeyDown = (event) => {
+    onKeyDown?.(event);
+  };
+  const buttonContent = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("span", { "aria-hidden": isLoading || void 0, className: styles.content, children: [
+      icon != null ? /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: styles.icon, children: /* @__PURE__ */ jsxRuntime.jsx(chunkPHFEQG4E_cjs.Icon, { icon, size }) }) : null,
+      !isIconOnly && startContent != null ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles.startContent, children: startContent }) : null,
+      !isIconOnly && /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles.label, children: label }),
+      !isIconOnly && endContent != null ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles.endContent, children: endContent }) : null,
+      !isIconOnly && isLoading ? /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: styles.loadingIndicator, children: /* @__PURE__ */ jsxRuntime.jsx(chunk2WP6NYYY_cjs.Spinner, { size, variant: spinnerVariant }) }) : null
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(chunk2QM5XBX4_cjs.VisuallyHidden, { "aria-live": "polite", role: "status", children: isLoading ? "Loading" : "" })
+  ] });
+  const rootClassName = chunkSPDVNY2Z_cjs.cx(
+    buttonRecipe({ variant, size, iconOnly: isIconOnly }),
+    className
+  );
+  const element = renderAsLink ? /* @__PURE__ */ jsxRuntime.jsx(
+    LinkComponent,
+    {
+      ...ariaAttrs,
+      "aria-label": ariaLabel,
+      className: rootClassName,
+      "data-testid": dataTestId,
+      href,
+      onClick: handleLinkClick,
+      onKeyDown: handleLinkKeyDown,
+      ref,
+      rel: linkRel,
+      style,
+      target,
+      to: LinkComponent === "a" ? void 0 : href,
+      children: buttonContent
+    }
+  ) : /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      ...ariaAttrs,
+      "aria-busy": isLoading || void 0,
+      "aria-disabled": useAriaDisabled || void 0,
+      "aria-label": ariaLabel,
+      className: rootClassName,
+      "data-testid": dataTestId,
+      disabled: useAriaDisabled ? void 0 : buttonDisabled,
+      form,
+      name,
+      onClick: handleButtonClick,
+      onKeyDown: handleButtonKeyDown,
+      ref,
+      style,
+      type,
+      value,
+      children: buttonContent
+    }
+  );
+  if (tooltip != null) {
+    return /* @__PURE__ */ jsxRuntime.jsx(chunkMKAOIB2O_cjs.Tooltip, { content: tooltip, children: element });
+  }
+  return element;
+}
+Button.displayName = "Button";
+
+exports.Button = Button;
+exports.buttonRecipe = buttonRecipe;
+//# sourceMappingURL=chunk-NILB6Y4Z.cjs.map
+//# sourceMappingURL=chunk-NILB6Y4Z.cjs.map

package/dist/chunk-NILB6Y4Z.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Button/Button.recipe.ts","../src/components/Button/Button.tsx"],"names":["cva","css","useLinkComponent","useButtonGroup","getAriaLabel","useRel","jsxs","Fragment","jsx","Icon","Spinner","VisuallyHidden","cx","Tooltip"],"mappings":"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","file":"chunk-NILB6Y4Z.cjs","sourcesContent":["import {cva, type RecipeVariantProps} from 'styled-system/css';\n\nexport const buttonRecipe = cva({\n  base: {\n    position: 'relative',\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    borderWidth: 0,\n    borderStyle: 'none',\n    fontFamily: 'body',\n    fontWeight: 'medium',\n    cursor: 'pointer',\n    transitionProperty: 'background-color, color, opacity, transform',\n    transitionDuration: 'fast',\n    transitionTimingFunction: 'default',\n    userSelect: 'none',\n    lineHeight: 'tight',\n    textDecoration: 'none',\n    whiteSpace: 'nowrap',\n    _active: {\n      transform: 'scale(0.98)',\n    },\n    _disabled: {\n      opacity: 0.5,\n      cursor: 'not-allowed',\n      pointerEvents: 'none',\n      transform: 'none',\n    },\n    '&[aria-disabled=\"true\"]': {\n      opacity: 0.5,\n      cursor: 'not-allowed',\n      pointerEvents: 'auto',\n      transform: 'none',\n    },\n    _focusVisible: {\n      outlineWidth: 'focus',\n      outlineStyle: 'solid',\n      outlineColor: 'primary',\n      outlineOffset: 'focusOffsetLoose',\n    },\n  },\n  variants: {\n    variant: {\n      primary: {\n        bg: 'primary',\n        color: 'fg.onPrimary',\n        _hover: {bg: 'primary.hover'},\n        _active: {bg: 'primary.active'},\n      },\n      secondary: {\n        bg: 'bg.subtle',\n        color: 'fg',\n        _hover: {bg: 'bg.hover'},\n        _active: {bg: 'surface.gray.hover'},\n      },\n      ghost: {\n        color: 'fg',\n        bg: 'transparent',\n        _hover: {bg: 'bg.ghost.hover'},\n        _active: {bg: 'bg.ghost.active'},\n      },\n      destructive: {\n        bg: 'destructive',\n        color: 'destructive.fg',\n        _hover: {bg: 'destructive.hover'},\n        _active: {bg: 'destructive.active'},\n        _focusVisible: {\n          outlineColor: 'destructive',\n        },\n      },\n      onSolid: {\n        color: 'inherit',\n        bg: 'transparent',\n        _hover: {bg: 'color-mix(in srgb, currentColor 15%, transparent)'},\n        _active: {bg: 'color-mix(in srgb, currentColor 20%, transparent)'},\n        _focusVisible: {\n          outlineColor: 'currentColor',\n        },\n      },\n    },\n    size: {\n      sm: {\n        h: 'component.sm',\n        px: 'component.sm',\n        fontSize: 'component.sm',\n        gap: '1.5',\n        borderRadius: 'component.sm',\n        '--button-icon-size': 'var(--silver-sizes-icon-sm)',\n      },\n      md: {\n        h: 'component.md',\n        px: 'component.md',\n        fontSize: 'component.md',\n        gap: '2',\n        borderRadius: 'component.md',\n        '--button-icon-size': 'var(--silver-sizes-icon-md)',\n      },\n      lg: {\n        h: 'component.lg',\n        px: 'component.lg',\n        fontSize: 'component.lg',\n        gap: '2.5',\n        borderRadius: 'component.lg',\n        '--button-icon-size': 'var(--silver-sizes-icon-lg)',\n      },\n    },\n    iconOnly: {\n      true: {\n        aspectRatio: 'square',\n        px: 0,\n      },\n      false: {},\n    },\n  },\n  defaultVariants: {\n    variant: 'secondary',\n    size: 'md',\n    iconOnly: false,\n  },\n});\n\nexport type ButtonVariants = RecipeVariantProps<typeof buttonRecipe>;\n","/* eslint-disable @eslint-react/static-components -- intentional polymorphism via as prop */\n\nimport type {\n  CSSProperties,\n  JSX,\n  KeyboardEvent,\n  MouseEvent,\n  MouseEventHandler,\n  ReactNode,\n  Ref,\n} from 'react';\nimport {css} from 'styled-system/css';\nimport {VisuallyHidden} from '../../internal';\nimport {cx} from '../../internal/cx';\nimport {getAriaLabel, useRel} from '../../internal/linkAccessibility';\nimport {useButtonGroup} from '../ButtonGroup/ButtonGroupContext';\nimport {Icon, type IconComponent} from '../Icon';\nimport type {LinkComponent} from '../Link';\nimport {useLinkComponent} from '../Link';\nimport {Spinner} from '../Spinner';\nimport {Tooltip} from '../Tooltip';\nimport {buttonRecipe, type ButtonVariants} from './Button.recipe';\n\nexport type ButtonSize = NonNullable<ButtonVariants>['size'];\ntype ButtonVariant = NonNullable<ButtonVariants>['variant'];\n\n/**\n * A versatile action element that renders as a `<button>` or a link depending\n * on whether `href` is provided. Supports explicit loading states, icon-only\n * modes, link buttons, and tooltips.\n */\ninterface ButtonBaseProps {\n  /**\n   * Identifies the element(s) whose contents are controlled by the button.\n   */\n  'aria-controls'?: string;\n  /**\n   * Indicates the current item in a set.\n   */\n  'aria-current'?: 'page' | 'step' | 'location' | 'date' | 'time';\n  /**\n   * Identifies the element(s) that describe the button.\n   */\n  'aria-describedby'?: string;\n  /**\n   * Identifies the element that provides a detailed description.\n   */\n  'aria-details'?: string;\n  /**\n   * Indicates whether a controlled element is expanded or collapsed.\n   */\n  'aria-expanded'?: boolean;\n  /**\n   * Indicates the button opens an interactive popup element.\n   */\n  'aria-haspopup'?: boolean | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog';\n  /**\n   * Indicates whether the element is exposed to the accessibility API.\n   */\n  'aria-hidden'?: boolean;\n  /**\n   * Keyboard shortcuts that activate or focus the button.\n   */\n  'aria-keyshortcuts'?: string;\n  /**\n   * Accessible label that overrides the visible `label` for assistive\n   * technologies. Use when the visible text is too terse (e.g. a page\n   * number) and a longer description is needed.\n   */\n  'aria-label'?: string;\n  /**\n   * Identifies the element(s) that label the button.\n   */\n  'aria-labelledby'?: string;\n  /**\n   * Identifies element(s) owned by the button that are not DOM children.\n   */\n  'aria-owns'?: string;\n  /**\n   * Indicates the current pressed state of a toggle button.\n   */\n  'aria-pressed'?: boolean | 'mixed';\n  /**\n   * Human-readable description of the role of the button.\n   */\n  'aria-roledescription'?: string;\n  /**\n   * Custom link component to render when `href` is set. Falls back to the\n   * component provided by `LinkProvider`, or a plain `<a>` tag.\n   */\n  as?: LinkComponent;\n  /**\n   * Additional CSS class names applied to the root element.\n   */\n  className?: string;\n  /**\n   * Test ID applied to the root element.\n   */\n  'data-testid'?: string;\n  /**\n   * Content rendered after the label, such as a badge or count. Hidden in\n   * icon-only mode.\n   */\n  endContent?: ReactNode;\n  /**\n   * HTML `form` attribute associating the button with a `<form>` by ID.\n   */\n  form?: string;\n  /**\n   * URL to navigate to. When set and the button is not disabled, the component\n   * renders as a link element.\n   */\n  href?: string;\n  /**\n   * Whether the button is disabled. Prevents interaction and applies disabled\n   * styling.\n   */\n  isDisabled?: boolean;\n  /**\n   * Whether the button is in a loading state. Shows a spinner overlay,\n   * disables interaction, and announces \"Loading\" to assistive technologies.\n   */\n  isLoading?: boolean;\n  /**\n   * Text label for the button. Always required for accessibility even when\n   * `isIconOnly` is true.\n   */\n  label: string;\n  /**\n   * HTML `name` attribute for form submission.\n   */\n  name?: string;\n  /**\n   * Click event handler.\n   */\n  onClick?: MouseEventHandler<HTMLElement>;\n  /**\n   * Keyboard event handler for the root element.\n   */\n  onKeyDown?: (event: KeyboardEvent<HTMLElement>) => void;\n  /**\n   * Ref forwarded to the root element.\n   */\n  ref?: Ref<HTMLElement>;\n  /**\n   * Link `rel` attribute (e.g., `\"noopener\"`). Only applies when rendering\n   * as a link.\n   */\n  rel?: string;\n  /**\n   * Visual size of the button.\n   */\n  size?: ButtonSize;\n  /**\n   * Arbitrary content rendered before the label (after the icon, if present).\n   * Hidden in icon-only mode.\n   */\n  startContent?: ReactNode;\n  /**\n   * Inline styles applied to the root element.\n   */\n  style?: CSSProperties;\n  /**\n   * Link `target` attribute (e.g., `\"_blank\"`). Only applies when rendering\n   * as a link.\n   */\n  target?: string;\n  /**\n   * Tooltip text shown on hover. When set on a disabled button,\n   * `aria-disabled` is used instead of the `disabled` attribute so the\n   * tooltip remains accessible.\n   */\n  tooltip?: string;\n  /**\n   * HTML button `type` attribute.\n   */\n  type?: 'button' | 'submit' | 'reset';\n  /**\n   * HTML `value` attribute for form submission.\n   */\n  value?: string;\n  /**\n   * Visual style variant.\n   */\n  variant?: ButtonVariant;\n}\n\nexport type ButtonProps =\n  | (ButtonBaseProps & {\n      /**\n       * Icon element rendered before the label. Required in icon-only mode.\n       */\n      icon: IconComponent;\n      /**\n       * Visually hides the label, showing only the icon. The `label` prop is\n       * still required and used as `aria-label`.\n       */\n      isIconOnly: true;\n    })\n  | (ButtonBaseProps & {\n      /**\n       * Icon element rendered before the label.\n       */\n      icon?: IconComponent;\n      /**\n       * Visually hides the label, showing only the icon. The `label` prop is\n       * still required and used as `aria-label`.\n       */\n      isIconOnly?: false;\n    });\n\nconst styles = {\n  content: css({\n    display: 'contents',\n  }),\n  label: css({\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    minW: 0,\n  }),\n  icon: css({\n    display: 'inline-flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    flexShrink: 0,\n  }),\n  endContent: css({\n    display: 'inline-flex',\n    alignItems: 'center',\n    color: 'inherit',\n  }),\n  startContent: css({\n    display: 'inline-flex',\n    alignItems: 'center',\n    color: 'inherit',\n  }),\n  loadingIndicator: css({\n    display: 'inline-flex',\n    alignItems: 'center',\n    color: 'inherit',\n  }),\n} as const;\n\nexport function Button({\n  label,\n  'aria-controls': ariaControls,\n  'aria-current': ariaCurrent,\n  'aria-label': ariaLabelProp,\n  'aria-describedby': ariaDescribedby,\n  'aria-details': ariaDetails,\n  'aria-expanded': ariaExpanded,\n  'aria-haspopup': ariaHaspopup,\n  'aria-hidden': ariaHidden,\n  'aria-keyshortcuts': ariaKeyshortcuts,\n  'aria-labelledby': ariaLabelledby,\n  'aria-owns': ariaOwns,\n  'aria-pressed': ariaPressed,\n  'aria-roledescription': ariaRoledescription,\n  href,\n  as,\n  target,\n  rel,\n  variant,\n  size: sizeProp,\n  className,\n  'data-testid': dataTestId,\n  style,\n  type = 'button',\n  ref,\n  isDisabled = false,\n  isLoading = false,\n  icon,\n  isIconOnly = false,\n  endContent,\n  startContent,\n  tooltip,\n  onClick,\n  onKeyDown,\n  form,\n  name,\n  value,\n}: ButtonProps): JSX.Element {\n  const LinkComponent = useLinkComponent(as);\n  const buttonGroup = useButtonGroup();\n  const size = sizeProp ?? buttonGroup?.size ?? 'md';\n  const buttonDisabled =\n    isDisabled || buttonGroup?.isDisabled === true || isLoading;\n  const useAriaDisabled = tooltip != null && buttonDisabled;\n  const renderAsLink = href != null && !buttonDisabled;\n  const opensInNewTab = renderAsLink && target === '_blank';\n  const ariaLabel =\n    ariaLabelProp ??\n    getAriaLabel(\n      isIconOnly ||\n        isLoading ||\n        startContent != null ||\n        endContent != null ||\n        opensInNewTab\n        ? label\n        : undefined,\n      opensInNewTab,\n    );\n  const linkRel = useRel({target, rel});\n  const spinnerVariant =\n    variant === 'primary' || variant === 'destructive' || variant === 'onSolid'\n      ? 'onMedia'\n      : 'default';\n\n  const ariaAttrs = {\n    'aria-controls': ariaControls,\n    'aria-current': ariaCurrent,\n    'aria-describedby': ariaDescribedby,\n    'aria-details': ariaDetails,\n    'aria-expanded': ariaExpanded,\n    'aria-haspopup': ariaHaspopup,\n    'aria-hidden': ariaHidden,\n    'aria-keyshortcuts': ariaKeyshortcuts,\n    'aria-labelledby': ariaLabelledby,\n    'aria-owns': ariaOwns,\n    'aria-pressed': ariaPressed,\n    'aria-roledescription': ariaRoledescription,\n  };\n\n  const handleButtonClick = (event: MouseEvent<HTMLButtonElement>) => {\n    if (buttonDisabled) {\n      event.preventDefault();\n      return;\n    }\n\n    onClick?.(event);\n  };\n\n  const handleLinkClick = (event: MouseEvent<HTMLAnchorElement>) => {\n    onClick?.(event);\n  };\n\n  const handleButtonKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n    if (useAriaDisabled && (event.key === 'Enter' || event.key === ' ')) {\n      event.preventDefault();\n      return;\n    }\n\n    onKeyDown?.(event);\n  };\n\n  const handleLinkKeyDown = (event: KeyboardEvent<HTMLAnchorElement>) => {\n    onKeyDown?.(event);\n  };\n\n  const buttonContent = (\n    <>\n      <span aria-hidden={isLoading || undefined} className={styles.content}>\n        {icon != null ? (\n          <span aria-hidden=\"true\" className={styles.icon}>\n            <Icon icon={icon} size={size} />\n          </span>\n        ) : null}\n        {!isIconOnly && startContent != null ? (\n          <span className={styles.startContent}>{startContent}</span>\n        ) : null}\n        {!isIconOnly && <span className={styles.label}>{label}</span>}\n        {!isIconOnly && endContent != null ? (\n          <span className={styles.endContent}>{endContent}</span>\n        ) : null}\n        {!isIconOnly && isLoading ? (\n          <span aria-hidden=\"true\" className={styles.loadingIndicator}>\n            <Spinner size={size} variant={spinnerVariant} />\n          </span>\n        ) : null}\n      </span>\n      <VisuallyHidden aria-live=\"polite\" role=\"status\">\n        {isLoading ? 'Loading' : ''}\n      </VisuallyHidden>\n    </>\n  );\n\n  const rootClassName = cx(\n    buttonRecipe({variant, size, iconOnly: isIconOnly}),\n    className,\n  );\n\n  const element = renderAsLink ? (\n    <LinkComponent\n      {...ariaAttrs}\n      aria-label={ariaLabel}\n      className={rootClassName}\n      data-testid={dataTestId}\n      href={href}\n      onClick={handleLinkClick}\n      onKeyDown={handleLinkKeyDown}\n      ref={ref as Ref<HTMLAnchorElement>}\n      rel={linkRel}\n      style={style}\n      target={target}\n      to={LinkComponent === 'a' ? undefined : href}>\n      {buttonContent}\n    </LinkComponent>\n  ) : (\n    <button\n      {...ariaAttrs}\n      aria-busy={isLoading || undefined}\n      aria-disabled={useAriaDisabled || undefined}\n      aria-label={ariaLabel}\n      className={rootClassName}\n      data-testid={dataTestId}\n      disabled={useAriaDisabled ? undefined : buttonDisabled}\n      form={form}\n      name={name}\n      onClick={handleButtonClick}\n      onKeyDown={handleButtonKeyDown}\n      ref={ref as Ref<HTMLButtonElement>}\n      style={style}\n      type={type}\n      value={value}>\n      {buttonContent}\n    </button>\n  );\n\n  if (tooltip != null) {\n    return <Tooltip content={tooltip}>{element}</Tooltip>;\n  }\n\n  return element;\n}\n\nButton.displayName = 'Button';\n"]}