silver-ui 0.4.0 → 0.6.0

package/dist/{chunk-GC5VUTUR.cjs → chunk-EZFQCREN.cjs}

@@ -1,6 +1,8 @@
 'use strict';
 
+var chunkCPDWUT2H_cjs = require('./chunk-CPDWUT2H.cjs');
 var chunkH7LOOHWU_cjs = require('./chunk-H7LOOHWU.cjs');
+var chunk3NIDAKCF_cjs = require('./chunk-3NIDAKCF.cjs');
 var chunk6SHL7FYO_cjs = require('./chunk-6SHL7FYO.cjs');
 var chunkZ6RT3WPE_cjs = require('./chunk-Z6RT3WPE.cjs');
 var chunkSPDVNY2Z_cjs = require('./chunk-SPDVNY2Z.cjs');
@@ -72,21 +74,6 @@ var dialogRecipe = chunkZ6RT3WPE_cjs.sva({
 function formatSize(value) {
   return typeof value === "number" ? `${value}px` : value;
 }
-function getDismissBehavior(dismissBehavior) {
-  if (dismissBehavior == null) {
-    return { isBackdropDismissEnabled: true, isEscapeDismissEnabled: true };
-  }
-  if (typeof dismissBehavior === "boolean") {
-    return {
-      isBackdropDismissEnabled: dismissBehavior,
-      isEscapeDismissEnabled: dismissBehavior
-    };
-  }
-  return {
-    isBackdropDismissEnabled: dismissBehavior.isBackdropDismissEnabled ?? true,
-    isEscapeDismissEnabled: dismissBehavior.isEscapeDismissEnabled ?? true
-  };
-}
 function Dialog({
   isOpen,
   label,
@@ -104,10 +91,13 @@ function Dialog({
   ref
 }) {
   const dialogRef = react.useRef(null);
-  const triggerRef = react.useRef(null);
   const titleId = react.useId();
   const isFullscreen = variant === "fullscreen";
-  const { isBackdropDismissEnabled, isEscapeDismissEnabled } = getDismissBehavior(dismissBehavior);
+  const { isBackdropDismissEnabled, isEscapeDismissEnabled } = chunkCPDWUT2H_cjs.resolveDismissBehavior(dismissBehavior);
+  const backdropDismiss = chunkCPDWUT2H_cjs.useBackdropDismiss({
+    isEnabled: isBackdropDismissEnabled,
+    onDismiss: () => onOpenChange(false)
+  });
   const dialogContextValue = react.useMemo(
     () => ({ onOpenChange, titleId }),
     [onOpenChange, titleId]
@@ -119,7 +109,6 @@ function Dialog({
       return;
     }
     if (isOpen) {
-      triggerRef.current = document.activeElement;
       if (!dialog.open) {
         dialog.showModal();
       }
@@ -127,20 +116,9 @@ function Dialog({
       autofocusTarget?.focus();
     } else if (dialog.open) {
       dialog.close();
-      triggerRef.current?.focus();
-      triggerRef.current = null;
     }
   }, [isOpen]);
-  react.useEffect(() => {
-    if (!isOpen) {
-      return;
-    }
-    const previousOverflow = document.body.style.overflow;
-    document.body.style.overflow = "hidden";
-    return () => {
-      document.body.style.overflow = previousOverflow;
-    };
-  }, [isOpen]);
+  chunk3NIDAKCF_cjs.useScrollLock(isOpen);
   const positionStyle = position != null && !isFullscreen ? {
     bottom: position.bottom == null ? "auto" : formatSize(position.bottom),
     left: position.left == null ? "auto" : formatSize(position.left),
@@ -161,11 +139,8 @@ function Dialog({
           onOpenChange(false);
         }
       },
-      onClick: (event) => {
-        if (event.target === event.currentTarget && isBackdropDismissEnabled) {
-          onOpenChange(false);
-        }
-      },
+      onClick: backdropDismiss.onClick,
+      onPointerDown: backdropDismiss.onPointerDown,
       ref: chunk6SHL7FYO_cjs.mergeRefs(ref, dialogRef),
       role: role === "dialog" ? void 0 : role,
       style: {
@@ -182,13 +157,11 @@ Dialog.displayName = "Dialog";
 function useDialog(defaultOptions) {
   const [isOpen, setIsOpen] = react.useState(false);
   const [content, setContent] = react.useState(null);
-  const [options, setOptions] = react.useState(
-    defaultOptions
-  );
+  const [callOptions, setCallOptions] = react.useState();
   const show = react.useCallback(
     (nextContent, nextOptions) => {
       setContent(nextContent);
-      setOptions((previous) => ({ ...previous, ...nextOptions }));
+      setCallOptions(nextOptions);
       setIsOpen(true);
     },
     []
@@ -199,19 +172,19 @@ function useDialog(defaultOptions) {
       Dialog,
       {
         ...defaultOptions ?? {},
-        ...options ?? {},
+        ...callOptions ?? {},
         isOpen,
-        label: options?.label ?? defaultOptions?.label ?? "Dialog",
+        label: callOptions?.label ?? defaultOptions?.label,
         onOpenChange: setIsOpen,
         children: content
       }
     ),
-    [content, defaultOptions, isOpen, options]
+    [content, defaultOptions, isOpen, callOptions]
   );
   return { element, hide, isOpen, show };
 }
 
 exports.Dialog = Dialog;
 exports.useDialog = useDialog;
-//# sourceMappingURL=chunk-GC5VUTUR.cjs.map
-//# sourceMappingURL=chunk-GC5VUTUR.cjs.map
+//# sourceMappingURL=chunk-EZFQCREN.cjs.map
+//# sourceMappingURL=chunk-EZFQCREN.cjs.map

package/dist/chunk-EZFQCREN.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Dialog/Dialog.recipe.ts","../src/components/Dialog/Dialog.tsx","../src/components/Dialog/useDialog.tsx"],"names":["sva","useRef","useId","resolveDismissBehavior","useBackdropDismiss","useMemo","useEffect","useScrollLock","jsx","cx","mergeRefs","DialogContext","useState","useCallback"],"mappings":"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","file":"chunk-EZFQCREN.cjs","sourcesContent":["import {sva, type RecipeVariantProps} from 'styled-system/css';\n\nexport const dialogRecipe = sva({\n  slots: ['root', 'inner'],\n  base: {\n    root: {\n      position: 'fixed',\n      m: 'auto',\n      p: 0,\n      borderWidth: 0,\n      bg: 'bg',\n      color: 'fg',\n      borderRadius: 'md',\n      boxShadow: 'xl',\n      flexDirection: 'column',\n      overscrollBehavior: 'contain',\n      _backdrop: {\n        bg: 'overlay.scrim',\n        backdropFilter: 'blur(2px)',\n      },\n      _focusVisible: {\n        outlineWidth: 'focus',\n        outlineStyle: 'solid',\n        outlineColor: 'primary',\n        outlineOffset: 'focusOffset',\n      },\n    },\n    inner: {\n      display: 'flex',\n      flexDirection: 'column',\n      flex: '1 1 auto',\n      minH: 0,\n      overflow: 'hidden',\n      borderRadius: 'inherit',\n    },\n  },\n  variants: {\n    // When closed, the native <dialog> UA style (display: none) applies; opening\n    // switches on the flex column layout.\n    isOpen: {\n      true: {root: {display: 'flex'}},\n      false: {},\n    },\n    variant: {\n      standard: {},\n      fullscreen: {\n        root: {\n          w: '100dvw',\n          h: '100dvh',\n          maxW: '100dvw',\n          maxH: '100dvh',\n          borderRadius: 0,\n          m: 0,\n          inset: 0,\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    isOpen: false,\n    variant: 'standard',\n  },\n});\n\nexport type DialogVariants = RecipeVariantProps<typeof dialogRecipe>;\n","/* eslint-disable jsx-a11y-x/click-events-have-key-events, jsx-a11y-x/no-noninteractive-element-interactions */\nimport {\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  type CSSProperties,\n  type ReactNode,\n  type Ref,\n} from 'react';\nimport {dialogRecipe} from 'components/Dialog/Dialog.recipe';\nimport {DialogContext} from 'components/Dialog/DialogContext';\nimport {cx} from 'internal/cx';\nimport {\n  resolveDismissBehavior,\n  type DismissBehavior,\n} from 'internal/dismissBehavior';\nimport {mergeRefs} from 'internal/mergeRefs';\nimport {useBackdropDismiss} from 'internal/useBackdropDismiss';\nimport {useScrollLock} from 'internal/useScrollLock';\n\nexport type DialogVariant = 'fullscreen' | 'standard';\nexport type DialogRole = 'alertdialog' | 'dialog';\nexport type DialogDismissBehavior = DismissBehavior;\n\nexport interface DialogPosition {\n  bottom?: number | string;\n  left?: number | string;\n  right?: number | string;\n  top?: number | string;\n}\n\nexport interface DialogProps {\n  /**\n   * Dialog body content.\n   */\n  children: ReactNode;\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   * Controls whether Escape and backdrop clicks request dismissal. Pass a\n   * boolean to enable or disable both behaviors together.\n   * @default {isEscapeDismissEnabled: true, isBackdropDismissEnabled: true}\n   */\n  dismissBehavior?: DialogDismissBehavior;\n  /**\n   * Whether the dialog is open.\n   */\n  isOpen: boolean;\n  /**\n   * Accessible label for the dialog. When provided, sets `aria-label`\n   * directly. When omitted, the dialog uses `aria-labelledby` to\n   * reference the heading rendered by a child `LayoutHeader`.\n   *\n   * Omit this prop when using a `LayoutHeader` inside the dialog.\n   * Set it when the dialog has no visible heading.\n   */\n  label?: string;\n  /**\n   * Maximum height of the dialog. Numbers are treated as pixels.\n   * @default '75vh'\n   */\n  maxHeight?: number | string;\n  /**\n   * Called when the dialog requests an open-state change.\n   */\n  onOpenChange: (isOpen: boolean) => void;\n  /**\n   * Fixed positioning offsets for the dialog.\n   */\n  position?: Readonly<DialogPosition>;\n  /**\n   * Ref forwarded to the dialog element.\n   */\n  ref?: Ref<HTMLDialogElement>;\n  /**\n   * ARIA role exposed by the dialog.\n   * @default 'dialog'\n   */\n  role?: DialogRole;\n  /**\n   * Inline styles applied to the dialog.\n   */\n  style?: CSSProperties;\n  /**\n   * Display variant.\n   * @default 'standard'\n   */\n  variant?: DialogVariant;\n  /**\n   * Dialog width. Numbers are treated as pixels.\n   * @default 400\n   */\n  width?: number | string;\n}\n\nfunction formatSize(value: number | string): string {\n  return typeof value === 'number' ? `${value}px` : value;\n}\n\n/**\n * A modal dialog surface with backdrop, focus management,\n * and configurable dismiss behavior.\n */\nexport function Dialog({\n  isOpen,\n  label,\n  onOpenChange,\n  width = 400,\n  maxHeight = '75vh',\n  position,\n  variant = 'standard',\n  dismissBehavior,\n  children,\n  className,\n  'data-testid': dataTestId,\n  role = 'dialog',\n  style,\n  ref,\n}: DialogProps): React.JSX.Element {\n  const dialogRef = useRef<HTMLDialogElement>(null);\n  const titleId = useId();\n  const isFullscreen = variant === 'fullscreen';\n  const {isBackdropDismissEnabled, isEscapeDismissEnabled} =\n    resolveDismissBehavior(dismissBehavior);\n  const backdropDismiss = useBackdropDismiss<HTMLDialogElement>({\n    isEnabled: isBackdropDismissEnabled,\n    onDismiss: () => onOpenChange(false),\n  });\n  const dialogContextValue = useMemo(\n    () => ({onOpenChange, titleId}),\n    [onOpenChange, titleId],\n  );\n  const classes = dialogRecipe({isOpen, variant});\n\n  useEffect(() => {\n    const dialog = dialogRef.current;\n    if (dialog == null) {\n      return;\n    }\n\n    if (isOpen) {\n      if (!dialog.open) {\n        dialog.showModal();\n      }\n      // Override the dialog's default initial focus when an autofocus target is\n      // present. Focus restoration on close is left to the native <dialog>,\n      // which restores focus to the element that was focused before\n      // showModal() — avoiding races with external focus management.\n      const autofocusTarget =\n        dialog.querySelector<HTMLElement>('[data-autofocus=\"true\"]') ??\n        dialog.querySelector<HTMLElement>('[data-dialog-autofocus=\"true\"]');\n      autofocusTarget?.focus();\n    } else if (dialog.open) {\n      dialog.close();\n    }\n  }, [isOpen]);\n\n  useScrollLock(isOpen);\n\n  const positionStyle =\n    position != null && !isFullscreen\n      ? {\n          bottom:\n            position.bottom == null ? 'auto' : formatSize(position.bottom),\n          left: position.left == null ? 'auto' : formatSize(position.left),\n          margin: 0,\n          right: position.right == null ? 'auto' : formatSize(position.right),\n          top: position.top == null ? 'auto' : formatSize(position.top),\n        }\n      : undefined;\n\n  return (\n    <dialog\n      aria-label={label}\n      aria-labelledby={label == null ? titleId : undefined}\n      className={cx(classes.root, className)}\n      data-testid={dataTestId}\n      onCancel={event => {\n        event.preventDefault();\n        if (isEscapeDismissEnabled) {\n          onOpenChange(false);\n        }\n      }}\n      onClick={backdropDismiss.onClick}\n      onPointerDown={backdropDismiss.onPointerDown}\n      ref={mergeRefs(ref, dialogRef)}\n      role={role === 'dialog' ? undefined : role}\n      style={{\n        width: isFullscreen ? undefined : formatSize(width),\n        maxHeight: isFullscreen ? undefined : formatSize(maxHeight),\n        ...positionStyle,\n        ...style,\n      }}>\n      <DialogContext value={dialogContextValue}>\n        <div className={classes.inner}>{children}</div>\n      </DialogContext>\n    </dialog>\n  );\n}\n\nDialog.displayName = 'Dialog';\n","import {useCallback, useMemo, useState, type ReactNode} from 'react';\nimport {Dialog, type DialogProps} from 'components/Dialog/Dialog';\n\nexport type DialogOptions = Partial<\n  Omit<DialogProps, 'children' | 'isOpen' | 'onOpenChange'>\n>;\n\nexport interface UseDialogReturn {\n  element: ReactNode;\n  hide: () => void;\n  isOpen: boolean;\n  show: (content: ReactNode, options?: DialogOptions) => void;\n}\n\nexport function useDialog(defaultOptions?: DialogOptions): UseDialogReturn {\n  const [isOpen, setIsOpen] = useState(false);\n  const [content, setContent] = useState<ReactNode>(null);\n  // Options passed to the most recent `show()` call. Each call replaces these\n  // rather than merging, so per-call options never bleed into later calls.\n  // `defaultOptions` remains the baseline, applied beneath them below.\n  const [callOptions, setCallOptions] = useState<DialogOptions | undefined>();\n\n  const show = useCallback(\n    (nextContent: ReactNode, nextOptions?: DialogOptions) => {\n      setContent(nextContent);\n      setCallOptions(nextOptions);\n      setIsOpen(true);\n    },\n    [],\n  );\n\n  const hide = useCallback(() => setIsOpen(false), []);\n\n  const element = useMemo(\n    () => (\n      <Dialog\n        {...(defaultOptions ?? {})}\n        {...(callOptions ?? {})}\n        isOpen={isOpen}\n        label={callOptions?.label ?? defaultOptions?.label}\n        onOpenChange={setIsOpen}>\n        {content}\n      </Dialog>\n    ),\n    [content, defaultOptions, isOpen, callOptions],\n  );\n\n  return {element, hide, isOpen, show};\n}\n"]}

package/dist/{chunk-FP5E5BUM.js → chunk-FIOCTAXT.js}

@@ -1,4 +1,4 @@
-import { getNecessity, Field } from './chunk-RLOGQBFD.js';
+import { getNecessity, Field } from './chunk-SEDUAMDW.js';
 import { isReactNode } from './chunk-2PSZAWLC.js';
 import { cva } from './chunk-FMEIPGUP.js';
 import { cx } from './chunk-PPNETWIP.js';
@@ -202,7 +202,7 @@ function InputGroupText({
   return /* @__PURE__ */ jsx(
     "div",
     {
-      className: cx(className),
+      className,
       "data-silver-input-group-text": "",
       "data-testid": dataTestId,
       ref,
@@ -214,5 +214,5 @@ function InputGroupText({
 InputGroupText.displayName = "InputGroupText";
 
 export { InputGroup, InputGroupContext, InputGroupText, useInputGroup };
-//# sourceMappingURL=chunk-FP5E5BUM.js.map
-//# sourceMappingURL=chunk-FP5E5BUM.js.map
+//# sourceMappingURL=chunk-FIOCTAXT.js.map
+//# sourceMappingURL=chunk-FIOCTAXT.js.map

package/dist/chunk-FIOCTAXT.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/InputGroup/InputGroup.recipe.ts","../src/components/InputGroup/InputGroupContext.ts","../src/components/InputGroup/InputGroup.tsx","../src/components/InputGroup/InputGroupText.tsx"],"names":["jsx"],"mappings":"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","file":"chunk-FIOCTAXT.js","sourcesContent":["import type {InputSize, InputStatusType} from 'components/Field';\nimport {cva, type RecipeVariantProps} from 'styled-system/css';\n\nconst addonSelector = '& > [data-silver-input-group-text]';\nconst controlSelector = '& > :not([data-silver-input-group-text])';\nconst itemSelector = '& > *';\n\nconst statusStyles = {\n  error: {\n    borderColor: 'status.error.border',\n    _focusWithin: {borderColor: 'status.error.border'},\n  },\n  success: {\n    borderColor: 'status.success.border',\n    _focusWithin: {borderColor: 'status.success.border'},\n  },\n  warning: {\n    borderColor: 'status.warning.border',\n    _focusWithin: {borderColor: 'status.warning.border'},\n  },\n} satisfies Record<InputStatusType, object>;\n\nexport const inputGroupRecipe = cva({\n  base: {\n    display: 'inline-flex',\n    alignItems: 'stretch',\n    isolation: 'isolate',\n    maxW: 'full',\n    [itemSelector]: {\n      position: 'relative',\n      borderRadius: 0,\n    },\n    [`${itemSelector}:not(:first-child)`]: {\n      marginInlineStart: '-1px',\n    },\n    [`${itemSelector}:first-child`]: {\n      borderStartStartRadius: 'md',\n      borderEndStartRadius: 'md',\n    },\n    [`${itemSelector}:last-child`]: {\n      borderStartEndRadius: 'md',\n      borderEndEndRadius: 'md',\n    },\n    [`${itemSelector}:focus-within`]: {\n      zIndex: 1,\n    },\n    [controlSelector]: {\n      flex: 1,\n      minW: 0,\n      h: 'full',\n    },\n    [addonSelector]: {\n      display: 'inline-flex',\n      alignItems: 'center',\n      flexShrink: 0,\n      px: '3',\n      borderWidth: 'default',\n      borderStyle: 'solid',\n      borderColor: 'border.emphasized',\n      bg: 'bg.subtle',\n      color: 'fg.muted',\n      fontFamily: 'body',\n      fontSize: 'md',\n      lineHeight: 'normal',\n      whiteSpace: 'nowrap',\n    },\n  },\n  variants: {\n    isDisabled: {\n      false: {},\n      true: {\n        cursor: 'not-allowed',\n        opacity: 0.55,\n      },\n    },\n    size: {\n      lg: {\n        [addonSelector]: {\n          minH: 'component.lg',\n        },\n      },\n      md: {\n        [addonSelector]: {\n          minH: 'component.md',\n        },\n      },\n      sm: {\n        [addonSelector]: {\n          minH: 'component.sm',\n        },\n      },\n    },\n    status: {\n      error: {\n        [addonSelector]: statusStyles.error,\n        [controlSelector]: statusStyles.error,\n      },\n      success: {\n        [addonSelector]: statusStyles.success,\n        [controlSelector]: statusStyles.success,\n      },\n      warning: {\n        [addonSelector]: statusStyles.warning,\n        [controlSelector]: statusStyles.warning,\n      },\n    },\n  },\n  defaultVariants: {\n    isDisabled: false,\n    size: 'md',\n  },\n});\n\nexport type InputGroupVariants = RecipeVariantProps<typeof inputGroupRecipe>;\nexport type InputGroupSize = InputSize;\n","import {createContext, use} from 'react';\nimport type {InputSize, InputStatusType} from 'components/Field';\n\nexport interface InputGroupContextValue {\n  isDisabled: boolean;\n  isInGroup: true;\n  label: string;\n  size: InputSize;\n  statusType?: InputStatusType;\n}\n\nexport const InputGroupContext = createContext<InputGroupContextValue | null>(\n  null,\n);\n\nInputGroupContext.displayName = 'InputGroupContext';\n\nexport function useInputGroup(): InputGroupContextValue | null {\n  return use(InputGroupContext);\n}\n","import {\n  useMemo,\n  useId,\n  type CSSProperties,\n  type ReactNode,\n  type Ref,\n} from 'react';\nimport {\n  Field,\n  getNecessity,\n  type FieldNecessity,\n  type InputSize,\n  type InputStatus,\n} from 'components/Field';\nimport {inputGroupRecipe} from 'components/InputGroup/InputGroup.recipe';\nimport {InputGroupContext} from 'components/InputGroup/InputGroupContext';\nimport {cx} from 'internal/cx';\nimport isReactNode from 'internal/isReactNode';\n\nexport type InputGroupProps = {\n  /**\n   * Grouped input children to render side-by-side.\n   */\n  children: ReactNode;\n  /**\n   * Additional CSS class names applied to the group wrapper.\n   */\n  className?: string;\n  /**\n   * Test ID applied to the group wrapper.\n   */\n  'data-testid'?: string;\n  /**\n   * Supporting text displayed below the label.\n   */\n  description?: ReactNode;\n  /**\n   * Whether all grouped inputs are disabled.\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Whether to visually hide the label.\n   * @default false\n   */\n  isLabelHidden?: boolean;\n  /**\n   * Label text for the input group.\n   */\n  label: string;\n  /**\n   * Tooltip content shown next to the label.\n   */\n  labelTooltip?: ReactNode;\n  /**\n   * Ref forwarded to the group wrapper.\n   */\n  ref?: Ref<HTMLDivElement>;\n  /**\n   * Visual size applied to the group.\n   * @default 'md'\n   */\n  size?: InputSize;\n  /**\n   * Validation status displayed below the group.\n   */\n  status?: InputStatus;\n  /**\n   * Inline styles applied to the group wrapper.\n   */\n  style?: CSSProperties;\n} & FieldNecessity;\n\n/**\n * Groups multiple inputs into a single visually connected row.\n */\nexport function InputGroup({\n  children,\n  label,\n  description,\n  isDisabled = false,\n  isLabelHidden = false,\n  isOptional,\n  isRequired,\n  size = 'md',\n  status,\n  labelTooltip,\n  className,\n  'data-testid': dataTestId,\n  style,\n  ref,\n}: InputGroupProps): React.JSX.Element {\n  const inputId = useId();\n  const labelId = `${inputId}-label`;\n  const descriptionID = isReactNode(description)\n    ? `${inputId}-description`\n    : undefined;\n  const statusID = status?.message != null ? `${inputId}-status` : undefined;\n  const describedBy =\n    [descriptionID, statusID].filter(Boolean).join(' ') || undefined;\n  const contextValue = useMemo(\n    () => ({\n      isInGroup: true as const,\n      isDisabled,\n      label,\n      size,\n      statusType: status?.type,\n    }),\n    [isDisabled, label, size, status?.type],\n  );\n\n  const necessity = getNecessity(isOptional, isRequired);\n\n  return (\n    <InputGroupContext value={contextValue}>\n      <Field\n        description={description}\n        descriptionID={descriptionID}\n        inputId={inputId}\n        isDisabled={isDisabled}\n        isLabelHidden={isLabelHidden}\n        labelAs=\"span\"\n        labelId={labelId}\n        {...necessity}\n        label={label}\n        labelTooltip={labelTooltip}\n        status={status == null ? undefined : {...status, messageID: statusID}}\n        statusVariant=\"detached\">\n        <div\n          aria-describedby={describedBy}\n          aria-disabled={isDisabled || undefined}\n          aria-labelledby={labelId}\n          className={cx(\n            inputGroupRecipe({\n              isDisabled,\n              size,\n              status: status?.type,\n            }),\n            className,\n          )}\n          data-testid={dataTestId}\n          ref={ref}\n          role=\"group\"\n          style={style}>\n          {children}\n        </div>\n      </Field>\n    </InputGroupContext>\n  );\n}\n\nInputGroup.displayName = 'InputGroup';\n","import type {CSSProperties, ReactNode, Ref} from 'react';\n\nexport interface InputGroupTextProps {\n  children: ReactNode;\n  className?: string;\n  'data-testid'?: string;\n  ref?: Ref<HTMLDivElement>;\n  style?: CSSProperties;\n}\n\nexport function InputGroupText({\n  children,\n  className,\n  'data-testid': dataTestId,\n  style,\n  ref,\n}: InputGroupTextProps): React.JSX.Element {\n  return (\n    <div\n      className={className}\n      data-silver-input-group-text=\"\"\n      data-testid={dataTestId}\n      ref={ref}\n      style={style}>\n      {children}\n    </div>\n  );\n}\n\nInputGroupText.displayName = 'InputGroupText';\n"]}

package/dist/{chunk-AWDIKDX5.cjs → chunk-FLDTPAG4.cjs}

@@ -1,9 +1,9 @@
 'use strict';
 
-var chunkJKERY7QF_cjs = require('./chunk-JKERY7QF.cjs');
-var chunkDP7VC4FW_cjs = require('./chunk-DP7VC4FW.cjs');
-var chunkQOKEU3DC_cjs = require('./chunk-QOKEU3DC.cjs');
-var chunkM26XECB2_cjs = require('./chunk-M26XECB2.cjs');
+var chunkDLIYUFTS_cjs = require('./chunk-DLIYUFTS.cjs');
+var chunkQB2BSOM4_cjs = require('./chunk-QB2BSOM4.cjs');
+var chunkVXOIOPGZ_cjs = require('./chunk-VXOIOPGZ.cjs');
+var chunkMHAXS4GO_cjs = require('./chunk-MHAXS4GO.cjs');
 var chunkZ6RT3WPE_cjs = require('./chunk-Z6RT3WPE.cjs');
 var chunkSPDVNY2Z_cjs = require('./chunk-SPDVNY2Z.cjs');
 var lucideReact = require('lucide-react');
@@ -284,7 +284,7 @@ function CodeBlock({
     } catch {
     }
   }, [code, onCopy]);
-  const paddingToken = chunkM26XECB2_cjs.token(`spacing.${padding}`);
+  const paddingToken = chunkMHAXS4GO_cjs.token(`spacing.${padding}`);
   const codeStyle = {
     ["--cb-padding"]: paddingToken,
     padding: paddingToken
@@ -305,7 +305,7 @@ function CodeBlock({
   };
   const copyLabel = copied ? "Copied" : "Copy code";
   const copyButton = hasCopyButton ? /* @__PURE__ */ jsxRuntime.jsx(
-    chunkQOKEU3DC_cjs.Button,
+    chunkVXOIOPGZ_cjs.Button,
     {
       icon: copied ? lucideReact.Check : lucideReact.Copy,
       isIconOnly: true,
@@ -320,7 +320,7 @@ function CodeBlock({
   ) : null;
   if (isInline) {
     return /* @__PURE__ */ jsxRuntime.jsxs(
-      chunkJKERY7QF_cjs.Card,
+      chunkDLIYUFTS_cjs.Card,
       {
         "aria-label": regionLabel,
         className: chunkSPDVNY2Z_cjs.cx(classes.root, className),
@@ -342,7 +342,7 @@ function CodeBlock({
           ),
           copyButton != null ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
             /* @__PURE__ */ jsxRuntime.jsx(
-              chunkDP7VC4FW_cjs.Divider,
+              chunkQB2BSOM4_cjs.Divider,
               {
                 className: classes.inlineDivider,
                 height: "auto",
@@ -357,7 +357,7 @@ function CodeBlock({
     );
   }
   return /* @__PURE__ */ jsxRuntime.jsxs(
-    chunkJKERY7QF_cjs.Card,
+    chunkDLIYUFTS_cjs.Card,
     {
       "aria-label": regionLabel,
       className: chunkSPDVNY2Z_cjs.cx(classes.root, className),
@@ -412,5 +412,5 @@ function CodeBlock({
 CodeBlock.displayName = "CodeBlock";
 
 exports.CodeBlock = CodeBlock;
-//# sourceMappingURL=chunk-AWDIKDX5.cjs.map
-//# sourceMappingURL=chunk-AWDIKDX5.cjs.map
+//# sourceMappingURL=chunk-FLDTPAG4.cjs.map
+//# sourceMappingURL=chunk-FLDTPAG4.cjs.map

package/dist/{chunk-AWDIKDX5.cjs.map → chunk-FLDTPAG4.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/CodeBlock/CodeBlock.recipe.ts","../src/components/CodeBlock/CodeBlock.tsx"],"names":["sva","useState","useRef","useMemo","useEffect","useCallback","token","jsx","Button","Check","Copy","jsxs","Card","cx","Fragment","Divider"],"mappings":"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","file":"chunk-AWDIKDX5.cjs","sourcesContent":["import {sva, type RecipeVariantProps} from 'styled-system/css';\n\nexport const codeBlockRecipe = sva({\n  slots: [\n    'root',\n    'header',\n    'headerTitle',\n    'scroll',\n    'body',\n    'gutter',\n    'gutterLine',\n    'pre',\n    'code',\n    'line',\n    'copyButtonFloating',\n    'inlineCode',\n    'inlineDivider',\n  ],\n  base: {\n    root: {\n      color: 'fg',\n      overflow: 'hidden',\n    },\n    header: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n      gap: '3',\n      px: '4',\n      py: '2',\n      borderBlockEndWidth: 'default',\n      borderBlockEndStyle: 'solid',\n      borderBlockEndColor: 'border',\n    },\n    headerTitle: {\n      minW: 0,\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n      whiteSpace: 'nowrap',\n      color: 'fg.muted',\n      fontFamily: 'mono',\n      fontSize: 'xs',\n      fontWeight: 'medium',\n    },\n    scroll: {\n      overflow: 'auto',\n    },\n    body: {\n      display: 'flex',\n      minW: 'fit-content',\n    },\n    gutter: {\n      flexShrink: 0,\n      py: '3',\n      ps: '4',\n      pe: '3',\n      borderInlineEndWidth: 'default',\n      borderInlineEndStyle: 'solid',\n      borderInlineEndColor: 'border',\n      color: 'fg.muted',\n      textAlign: 'end',\n      userSelect: 'none',\n    },\n    gutterLine: {\n      fontFamily: 'mono',\n      lineHeight: '1.5rem',\n    },\n    pre: {\n      m: 0,\n      flex: 1,\n      minW: 0,\n    },\n    code: {\n      display: 'flex',\n      flexDirection: 'column',\n      color: 'fg',\n      fontFamily: 'mono',\n      tabSize: 2,\n      whiteSpace: 'pre',\n      wordBreak: 'normal',\n      overflowWrap: 'normal',\n    },\n    line: {\n      display: 'block',\n      minH: '1.5rem',\n      '&[data-highlighted]': {\n        bg: 'bg.selected',\n        mx: 'calc(var(--cb-padding) * -1)',\n        px: 'var(--cb-padding)',\n      },\n    },\n    copyButtonFloating: {\n      position: 'absolute',\n      top: '3',\n      right: '3',\n      zIndex: 1,\n      // On hover-capable devices, hide until the block is hovered/focused (the\n      // root reveals it via [data-cb-copy]). On touch devices it stays visible.\n      '@media (hover: hover)': {\n        opacity: 0,\n        pointerEvents: 'none',\n        transitionProperty: 'opacity',\n        transitionDuration: 'fast',\n        transitionTimingFunction: 'default',\n        '@media (prefers-reduced-motion: reduce)': {\n          transitionDuration: '0s',\n        },\n      },\n    },\n    inlineCode: {\n      minW: 0,\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n      whiteSpace: 'pre',\n      fontFamily: 'mono',\n    },\n    inlineDivider: {\n      alignSelf: 'stretch',\n      ms: '1.5',\n    },\n  },\n  variants: {\n    container: {\n      card: {\n        root: {\n          position: 'relative',\n          isolation: 'isolate',\n          display: 'flex',\n          flexDirection: 'column',\n          borderRadius: 'md',\n          '&:hover [data-cb-copy], &:focus-within [data-cb-copy]': {\n            opacity: 1,\n            pointerEvents: 'auto',\n          },\n        },\n      },\n      section: {\n        root: {\n          position: 'relative',\n          isolation: 'isolate',\n          display: 'flex',\n          flexDirection: 'column',\n          '&:hover [data-cb-copy], &:focus-within [data-cb-copy]': {\n            opacity: 1,\n            pointerEvents: 'auto',\n          },\n        },\n      },\n      inline: {\n        root: {\n          display: 'inline-flex',\n          alignItems: 'center',\n          gap: '1',\n          maxWidth: '100%',\n          ps: '2.5',\n        },\n      },\n    },\n    size: {\n      sm: {\n        code: {fontSize: 'xs', lineHeight: '1.5rem'},\n        gutter: {fontSize: 'xs', lineHeight: '1.5rem'},\n        inlineCode: {fontSize: 'xs', lineHeight: '1.5rem'},\n      },\n      md: {\n        code: {fontSize: 'sm', lineHeight: '1.5rem'},\n        gutter: {fontSize: 'sm', lineHeight: '1.5rem'},\n        inlineCode: {fontSize: 'sm', lineHeight: '1.5rem'},\n      },\n    },\n    isWrapped: {\n      true: {\n        code: {\n          whiteSpace: 'pre-wrap',\n          wordBreak: 'break-word',\n          overflowWrap: 'anywhere',\n        },\n      },\n    },\n    hasFloatingCopy: {\n      true: {\n        code: {pe: '12'},\n      },\n    },\n  },\n  defaultVariants: {\n    container: 'card',\n    size: 'md',\n    isWrapped: false,\n    hasFloatingCopy: false,\n  },\n});\n\nexport type CodeBlockVariants = RecipeVariantProps<typeof codeBlockRecipe>;\n","'use client';\n\nimport {Check, Copy} from 'lucide-react';\nimport {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type CSSProperties,\n  type Ref,\n} from 'react';\nimport {token} from 'styled-system/tokens';\nimport {cx} from '../../internal/cx';\nimport type {SpacingToken} from '../../internal/spacingTokens';\nimport {Button} from '../Button';\nimport {Card} from '../Card';\nimport {Divider} from '../Divider';\nimport {codeBlockRecipe} from './CodeBlock.recipe';\n\nexport type CodeBlockContainer = 'card' | 'section' | 'inline';\nexport type CodeBlockSize = 'sm' | 'md';\n\nexport interface CodeBlockProps {\n  /**\n   * Additional CSS class names applied to the root element.\n   */\n  className?: string;\n  /**\n   * Source code to display.\n   */\n  code: string;\n  /**\n   * Container presentation style. Use `'inline'` for a compact, single-line\n   * snippet (e.g. an install command) with the copy button rendered inline;\n   * line numbers, titles, and `maxHeight` do not apply to inline blocks.\n   * @default 'card'\n   */\n  container?: CodeBlockContainer;\n  /**\n   * Test ID applied to the root element.\n   */\n  'data-testid'?: string;\n  /**\n   * Whether to show a copy button.\n   * @default true\n   */\n  hasCopyButton?: boolean;\n  /**\n   * Whether to render line numbers.\n   * @default false\n   */\n  hasLineNumbers?: boolean;\n  /**\n   * One-based line numbers to visually highlight.\n   */\n  highlightLines?: number[];\n  /**\n   * Whether long lines should wrap.\n   * @default false\n   */\n  isWrapped?: boolean;\n  /**\n   * Accessible label for the code block region.\n   */\n  label?: string;\n  /**\n   * Maximum scrollable body height. Numbers are treated as pixels.\n   */\n  maxHeight?: number | string;\n  /**\n   * Called after code is successfully copied.\n   */\n  onCopy?: () => 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   * Visual size.\n   * @default 'md'\n   */\n  size?: CodeBlockSize;\n  /**\n   * Inline styles applied to the root element.\n   */\n  style?: CSSProperties;\n  /**\n   * Optional header title.\n   */\n  title?: string;\n  /**\n   * Width of the code block. Accepts any CSS width value.\n   * @default 'fit-content'\n   */\n  width?: string;\n}\n\nfunction getLines(code: string): string[] {\n  const lines = code.split('\\n');\n  if (lines.length > 1 && lines[lines.length - 1] === '') {\n    lines.pop();\n  }\n  return lines;\n}\n\nfunction getLineEntries(code: string): {lineNumber: number; text: string}[] {\n  return getLines(code).map((text, index) => ({\n    lineNumber: index + 1,\n    text,\n  }));\n}\n\nfunction getRegionLabel({\n  label,\n  title,\n}: {\n  label?: string;\n  title?: string;\n}): string {\n  if (label != null) {\n    return label;\n  }\n\n  if (title != null && title.length > 0) {\n    return `${title} code block`;\n  }\n\n  return 'Code block';\n}\n\n/**\n * Read-only source code display.\n */\nexport function CodeBlock({\n  className,\n  code,\n  container = 'card',\n  'data-testid': dataTestId,\n  hasCopyButton = true,\n  hasLineNumbers = false,\n  highlightLines,\n  isWrapped = false,\n  label,\n  maxHeight,\n  onCopy,\n  padding = 4,\n  ref,\n  size = 'md',\n  style,\n  title,\n  width = 'fit-content',\n}: CodeBlockProps): React.JSX.Element {\n  const [copied, setCopied] = useState(false);\n  const copiedResetTimeoutRef = useRef<number | null>(null);\n  const lines = useMemo(() => getLineEntries(code), [code]);\n  const highlightLineKey = highlightLines?.join(',');\n  const highlightedLines = useMemo(\n    () =>\n      highlightLineKey == null || highlightLineKey.length === 0\n        ? null\n        : new Set(highlightLineKey.split(',').map(Number)),\n    [highlightLineKey],\n  );\n  const isInline = container === 'inline';\n  const showHeader = !isInline && title != null;\n  const regionLabel = getRegionLabel({label, title});\n\n  const classes = codeBlockRecipe({\n    container,\n    size,\n    isWrapped,\n    hasFloatingCopy: !showHeader && hasCopyButton,\n  });\n\n  useEffect(() => {\n    return () => {\n      if (copiedResetTimeoutRef.current != null) {\n        window.clearTimeout(copiedResetTimeoutRef.current);\n      }\n    };\n  }, []);\n\n  const handleCopy = useCallback(async () => {\n    try {\n      await navigator.clipboard.writeText(code);\n      setCopied(true);\n      onCopy?.();\n      if (copiedResetTimeoutRef.current != null) {\n        window.clearTimeout(copiedResetTimeoutRef.current);\n      }\n      copiedResetTimeoutRef.current = window.setTimeout(() => {\n        setCopied(false);\n        copiedResetTimeoutRef.current = null;\n      }, 2000);\n    } catch {\n      // Clipboard failures leave the copied state unchanged.\n    }\n  }, [code, onCopy]);\n\n  const paddingToken = token(`spacing.${padding}`);\n  const codeStyle: CSSProperties = {\n    ['--cb-padding' as string]: paddingToken,\n    padding: paddingToken,\n  };\n\n  const rootStyle: CSSProperties = isInline\n    ? {...style}\n    : {\n        width,\n        minWidth: width === 'fit-content' ? 'min(100%, 400px)' : undefined,\n        maxWidth: width === 'fit-content' ? '100%' : undefined,\n        ...style,\n      };\n  const scrollStyle: CSSProperties | undefined =\n    maxHeight == null\n      ? undefined\n      : {\n          maxHeight:\n            typeof maxHeight === 'number' ? `${maxHeight}px` : maxHeight,\n        };\n  const scrollRegionProps = {\n    'aria-label': `${regionLabel} scroll area`,\n    role: 'region',\n    tabIndex: 0,\n  } as const;\n\n  const copyLabel = copied ? 'Copied' : 'Copy code';\n  const copyButton = hasCopyButton ? (\n    <Button\n      icon={copied ? Check : Copy}\n      isIconOnly\n      label={copyLabel}\n      onClick={() => {\n        void handleCopy();\n      }}\n      size=\"sm\"\n      tooltip={copyLabel}\n      variant=\"ghost\"\n    />\n  ) : null;\n\n  if (isInline) {\n    return (\n      <Card\n        aria-label={regionLabel}\n        className={cx(classes.root, className)}\n        data-container={container}\n        data-size={size}\n        data-testid={dataTestId}\n        padding={1}\n        ref={ref}\n        role=\"group\"\n        style={rootStyle}>\n        <code\n          className={classes.inlineCode}\n          data-testid={dataTestId == null ? undefined : `${dataTestId}-code`}>\n          {code}\n        </code>\n        {copyButton != null ? (\n          <>\n            <Divider\n              className={classes.inlineDivider}\n              height=\"auto\"\n              isFullBleed\n              orientation=\"vertical\"\n            />\n            {copyButton}\n          </>\n        ) : null}\n      </Card>\n    );\n  }\n\n  return (\n    <Card\n      aria-label={regionLabel}\n      className={cx(classes.root, className)}\n      data-container={container}\n      data-size={size}\n      data-testid={dataTestId}\n      ref={ref}\n      role=\"region\"\n      style={rootStyle}\n      variant={container === 'section' ? 'section' : 'default'}>\n      {showHeader ? (\n        <div className={classes.header}>\n          <div className={classes.headerTitle}>{title}</div>\n          {copyButton}\n        </div>\n      ) : null}\n      <div\n        {...scrollRegionProps}\n        className={classes.scroll}\n        data-testid={dataTestId == null ? undefined : `${dataTestId}-scroll`}\n        style={scrollStyle}>\n        <div className={classes.body}>\n          {hasLineNumbers ? (\n            <div aria-hidden=\"true\" className={classes.gutter}>\n              {lines.map(line => (\n                <div className={classes.gutterLine} key={line.lineNumber}>\n                  {line.lineNumber}\n                </div>\n              ))}\n            </div>\n          ) : null}\n          <pre className={classes.pre}>\n            <code\n              className={classes.code}\n              data-testid={\n                dataTestId == null ? undefined : `${dataTestId}-code`\n              }\n              data-wrapped={isWrapped ? '' : undefined}\n              style={codeStyle}>\n              {lines.map(line => (\n                <span\n                  className={classes.line}\n                  data-highlighted={\n                    highlightedLines?.has(line.lineNumber) ? '' : undefined\n                  }\n                  data-line={line.lineNumber}\n                  key={line.lineNumber}>\n                  {line.text.length === 0 ? '\\u200b' : line.text}\n                </span>\n              ))}\n            </code>\n          </pre>\n        </div>\n      </div>\n      {!showHeader && copyButton != null ? (\n        <div className={classes.copyButtonFloating} data-cb-copy=\"\">\n          {copyButton}\n        </div>\n      ) : null}\n    </Card>\n  );\n}\n\nCodeBlock.displayName = 'CodeBlock';\n"]}
+{"version":3,"sources":["../src/components/CodeBlock/CodeBlock.recipe.ts","../src/components/CodeBlock/CodeBlock.tsx"],"names":["sva","useState","useRef","useMemo","useEffect","useCallback","token","jsx","Button","Check","Copy","jsxs","Card","cx","Fragment","Divider"],"mappings":"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","file":"chunk-FLDTPAG4.cjs","sourcesContent":["import {sva, type RecipeVariantProps} from 'styled-system/css';\n\nexport const codeBlockRecipe = sva({\n  slots: [\n    'root',\n    'header',\n    'headerTitle',\n    'scroll',\n    'body',\n    'gutter',\n    'gutterLine',\n    'pre',\n    'code',\n    'line',\n    'copyButtonFloating',\n    'inlineCode',\n    'inlineDivider',\n  ],\n  base: {\n    root: {\n      color: 'fg',\n      overflow: 'hidden',\n    },\n    header: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n      gap: '3',\n      px: '4',\n      py: '2',\n      borderBlockEndWidth: 'default',\n      borderBlockEndStyle: 'solid',\n      borderBlockEndColor: 'border',\n    },\n    headerTitle: {\n      minW: 0,\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n      whiteSpace: 'nowrap',\n      color: 'fg.muted',\n      fontFamily: 'mono',\n      fontSize: 'xs',\n      fontWeight: 'medium',\n    },\n    scroll: {\n      overflow: 'auto',\n    },\n    body: {\n      display: 'flex',\n      minW: 'fit-content',\n    },\n    gutter: {\n      flexShrink: 0,\n      py: '3',\n      ps: '4',\n      pe: '3',\n      borderInlineEndWidth: 'default',\n      borderInlineEndStyle: 'solid',\n      borderInlineEndColor: 'border',\n      color: 'fg.muted',\n      textAlign: 'end',\n      userSelect: 'none',\n    },\n    gutterLine: {\n      fontFamily: 'mono',\n      lineHeight: '1.5rem',\n    },\n    pre: {\n      m: 0,\n      flex: 1,\n      minW: 0,\n    },\n    code: {\n      display: 'flex',\n      flexDirection: 'column',\n      color: 'fg',\n      fontFamily: 'mono',\n      tabSize: 2,\n      whiteSpace: 'pre',\n      wordBreak: 'normal',\n      overflowWrap: 'normal',\n    },\n    line: {\n      display: 'block',\n      minH: '1.5rem',\n      '&[data-highlighted]': {\n        bg: 'bg.selected',\n        mx: 'calc(var(--cb-padding) * -1)',\n        px: 'var(--cb-padding)',\n      },\n    },\n    copyButtonFloating: {\n      position: 'absolute',\n      top: '3',\n      right: '3',\n      zIndex: 1,\n      // On hover-capable devices, hide until the block is hovered/focused (the\n      // root reveals it via [data-cb-copy]). On touch devices it stays visible.\n      '@media (hover: hover)': {\n        opacity: 0,\n        pointerEvents: 'none',\n        transitionProperty: 'opacity',\n        transitionDuration: 'fast',\n        transitionTimingFunction: 'default',\n        '@media (prefers-reduced-motion: reduce)': {\n          transitionDuration: '0s',\n        },\n      },\n    },\n    inlineCode: {\n      minW: 0,\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n      whiteSpace: 'pre',\n      fontFamily: 'mono',\n    },\n    inlineDivider: {\n      alignSelf: 'stretch',\n      ms: '1.5',\n    },\n  },\n  variants: {\n    container: {\n      card: {\n        root: {\n          position: 'relative',\n          isolation: 'isolate',\n          display: 'flex',\n          flexDirection: 'column',\n          borderRadius: 'md',\n          '&:hover [data-cb-copy], &:focus-within [data-cb-copy]': {\n            opacity: 1,\n            pointerEvents: 'auto',\n          },\n        },\n      },\n      section: {\n        root: {\n          position: 'relative',\n          isolation: 'isolate',\n          display: 'flex',\n          flexDirection: 'column',\n          '&:hover [data-cb-copy], &:focus-within [data-cb-copy]': {\n            opacity: 1,\n            pointerEvents: 'auto',\n          },\n        },\n      },\n      inline: {\n        root: {\n          display: 'inline-flex',\n          alignItems: 'center',\n          gap: '1',\n          maxWidth: '100%',\n          ps: '2.5',\n        },\n      },\n    },\n    size: {\n      sm: {\n        code: {fontSize: 'xs', lineHeight: '1.5rem'},\n        gutter: {fontSize: 'xs', lineHeight: '1.5rem'},\n        inlineCode: {fontSize: 'xs', lineHeight: '1.5rem'},\n      },\n      md: {\n        code: {fontSize: 'sm', lineHeight: '1.5rem'},\n        gutter: {fontSize: 'sm', lineHeight: '1.5rem'},\n        inlineCode: {fontSize: 'sm', lineHeight: '1.5rem'},\n      },\n    },\n    isWrapped: {\n      true: {\n        code: {\n          whiteSpace: 'pre-wrap',\n          wordBreak: 'break-word',\n          overflowWrap: 'anywhere',\n        },\n      },\n    },\n    hasFloatingCopy: {\n      true: {\n        code: {pe: '12'},\n      },\n    },\n  },\n  defaultVariants: {\n    container: 'card',\n    size: 'md',\n    isWrapped: false,\n    hasFloatingCopy: false,\n  },\n});\n\nexport type CodeBlockVariants = RecipeVariantProps<typeof codeBlockRecipe>;\n","'use client';\n\nimport {Check, Copy} from 'lucide-react';\nimport {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type CSSProperties,\n  type Ref,\n} from 'react';\nimport {Button} from 'components/Button';\nimport {Card} from 'components/Card';\nimport {codeBlockRecipe} from 'components/CodeBlock/CodeBlock.recipe';\nimport {Divider} from 'components/Divider';\nimport {cx} from 'internal/cx';\nimport type {SpacingToken} from 'internal/spacingTokens';\nimport {token} from 'styled-system/tokens';\n\nexport type CodeBlockContainer = 'card' | 'section' | 'inline';\nexport type CodeBlockSize = 'sm' | 'md';\n\nexport interface CodeBlockProps {\n  /**\n   * Additional CSS class names applied to the root element.\n   */\n  className?: string;\n  /**\n   * Source code to display.\n   */\n  code: string;\n  /**\n   * Container presentation style. Use `'inline'` for a compact, single-line\n   * snippet (e.g. an install command) with the copy button rendered inline;\n   * line numbers, titles, and `maxHeight` do not apply to inline blocks.\n   * @default 'card'\n   */\n  container?: CodeBlockContainer;\n  /**\n   * Test ID applied to the root element.\n   */\n  'data-testid'?: string;\n  /**\n   * Whether to show a copy button.\n   * @default true\n   */\n  hasCopyButton?: boolean;\n  /**\n   * Whether to render line numbers.\n   * @default false\n   */\n  hasLineNumbers?: boolean;\n  /**\n   * One-based line numbers to visually highlight.\n   */\n  highlightLines?: number[];\n  /**\n   * Whether long lines should wrap.\n   * @default false\n   */\n  isWrapped?: boolean;\n  /**\n   * Accessible label for the code block region.\n   */\n  label?: string;\n  /**\n   * Maximum scrollable body height. Numbers are treated as pixels.\n   */\n  maxHeight?: number | string;\n  /**\n   * Called after code is successfully copied.\n   */\n  onCopy?: () => 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   * Visual size.\n   * @default 'md'\n   */\n  size?: CodeBlockSize;\n  /**\n   * Inline styles applied to the root element.\n   */\n  style?: CSSProperties;\n  /**\n   * Optional header title.\n   */\n  title?: string;\n  /**\n   * Width of the code block. Accepts any CSS width value.\n   * @default 'fit-content'\n   */\n  width?: string;\n}\n\nfunction getLines(code: string): string[] {\n  const lines = code.split('\\n');\n  if (lines.length > 1 && lines[lines.length - 1] === '') {\n    lines.pop();\n  }\n  return lines;\n}\n\nfunction getLineEntries(code: string): {lineNumber: number; text: string}[] {\n  return getLines(code).map((text, index) => ({\n    lineNumber: index + 1,\n    text,\n  }));\n}\n\nfunction getRegionLabel({\n  label,\n  title,\n}: {\n  label?: string;\n  title?: string;\n}): string {\n  if (label != null) {\n    return label;\n  }\n\n  if (title != null && title.length > 0) {\n    return `${title} code block`;\n  }\n\n  return 'Code block';\n}\n\n/**\n * Read-only source code display.\n */\nexport function CodeBlock({\n  className,\n  code,\n  container = 'card',\n  'data-testid': dataTestId,\n  hasCopyButton = true,\n  hasLineNumbers = false,\n  highlightLines,\n  isWrapped = false,\n  label,\n  maxHeight,\n  onCopy,\n  padding = 4,\n  ref,\n  size = 'md',\n  style,\n  title,\n  width = 'fit-content',\n}: CodeBlockProps): React.JSX.Element {\n  const [copied, setCopied] = useState(false);\n  const copiedResetTimeoutRef = useRef<number | null>(null);\n  const lines = useMemo(() => getLineEntries(code), [code]);\n  const highlightLineKey = highlightLines?.join(',');\n  const highlightedLines = useMemo(\n    () =>\n      highlightLineKey == null || highlightLineKey.length === 0\n        ? null\n        : new Set(highlightLineKey.split(',').map(Number)),\n    [highlightLineKey],\n  );\n  const isInline = container === 'inline';\n  const showHeader = !isInline && title != null;\n  const regionLabel = getRegionLabel({label, title});\n\n  const classes = codeBlockRecipe({\n    container,\n    size,\n    isWrapped,\n    hasFloatingCopy: !showHeader && hasCopyButton,\n  });\n\n  useEffect(() => {\n    return () => {\n      if (copiedResetTimeoutRef.current != null) {\n        window.clearTimeout(copiedResetTimeoutRef.current);\n      }\n    };\n  }, []);\n\n  const handleCopy = useCallback(async () => {\n    try {\n      await navigator.clipboard.writeText(code);\n      setCopied(true);\n      onCopy?.();\n      if (copiedResetTimeoutRef.current != null) {\n        window.clearTimeout(copiedResetTimeoutRef.current);\n      }\n      copiedResetTimeoutRef.current = window.setTimeout(() => {\n        setCopied(false);\n        copiedResetTimeoutRef.current = null;\n      }, 2000);\n    } catch {\n      // Clipboard failures leave the copied state unchanged.\n    }\n  }, [code, onCopy]);\n\n  const paddingToken = token(`spacing.${padding}`);\n  const codeStyle: CSSProperties = {\n    ['--cb-padding' as string]: paddingToken,\n    padding: paddingToken,\n  };\n\n  const rootStyle: CSSProperties = isInline\n    ? {...style}\n    : {\n        width,\n        minWidth: width === 'fit-content' ? 'min(100%, 400px)' : undefined,\n        maxWidth: width === 'fit-content' ? '100%' : undefined,\n        ...style,\n      };\n  const scrollStyle: CSSProperties | undefined =\n    maxHeight == null\n      ? undefined\n      : {\n          maxHeight:\n            typeof maxHeight === 'number' ? `${maxHeight}px` : maxHeight,\n        };\n  const scrollRegionProps = {\n    'aria-label': `${regionLabel} scroll area`,\n    role: 'region',\n    tabIndex: 0,\n  } as const;\n\n  const copyLabel = copied ? 'Copied' : 'Copy code';\n  const copyButton = hasCopyButton ? (\n    <Button\n      icon={copied ? Check : Copy}\n      isIconOnly\n      label={copyLabel}\n      onClick={() => {\n        void handleCopy();\n      }}\n      size=\"sm\"\n      tooltip={copyLabel}\n      variant=\"ghost\"\n    />\n  ) : null;\n\n  if (isInline) {\n    return (\n      <Card\n        aria-label={regionLabel}\n        className={cx(classes.root, className)}\n        data-container={container}\n        data-size={size}\n        data-testid={dataTestId}\n        padding={1}\n        ref={ref}\n        role=\"group\"\n        style={rootStyle}>\n        <code\n          className={classes.inlineCode}\n          data-testid={dataTestId == null ? undefined : `${dataTestId}-code`}>\n          {code}\n        </code>\n        {copyButton != null ? (\n          <>\n            <Divider\n              className={classes.inlineDivider}\n              height=\"auto\"\n              isFullBleed\n              orientation=\"vertical\"\n            />\n            {copyButton}\n          </>\n        ) : null}\n      </Card>\n    );\n  }\n\n  return (\n    <Card\n      aria-label={regionLabel}\n      className={cx(classes.root, className)}\n      data-container={container}\n      data-size={size}\n      data-testid={dataTestId}\n      ref={ref}\n      role=\"region\"\n      style={rootStyle}\n      variant={container === 'section' ? 'section' : 'default'}>\n      {showHeader ? (\n        <div className={classes.header}>\n          <div className={classes.headerTitle}>{title}</div>\n          {copyButton}\n        </div>\n      ) : null}\n      <div\n        {...scrollRegionProps}\n        className={classes.scroll}\n        data-testid={dataTestId == null ? undefined : `${dataTestId}-scroll`}\n        style={scrollStyle}>\n        <div className={classes.body}>\n          {hasLineNumbers ? (\n            <div aria-hidden=\"true\" className={classes.gutter}>\n              {lines.map(line => (\n                <div className={classes.gutterLine} key={line.lineNumber}>\n                  {line.lineNumber}\n                </div>\n              ))}\n            </div>\n          ) : null}\n          <pre className={classes.pre}>\n            <code\n              className={classes.code}\n              data-testid={\n                dataTestId == null ? undefined : `${dataTestId}-code`\n              }\n              data-wrapped={isWrapped ? '' : undefined}\n              style={codeStyle}>\n              {lines.map(line => (\n                <span\n                  className={classes.line}\n                  data-highlighted={\n                    highlightedLines?.has(line.lineNumber) ? '' : undefined\n                  }\n                  data-line={line.lineNumber}\n                  key={line.lineNumber}>\n                  {line.text.length === 0 ? '\\u200b' : line.text}\n                </span>\n              ))}\n            </code>\n          </pre>\n        </div>\n      </div>\n      {!showHeader && copyButton != null ? (\n        <div className={classes.copyButtonFloating} data-cb-copy=\"\">\n          {copyButton}\n        </div>\n      ) : null}\n    </Card>\n  );\n}\n\nCodeBlock.displayName = 'CodeBlock';\n"]}

package/dist/{chunk-S7INL5NI.js → chunk-FQN22DO5.js}

@@ -1,10 +1,10 @@
 import { inputStyles, inputRecipe } from './chunk-3M23WX6K.js';
-import { getNecessity, Field } from './chunk-RLOGQBFD.js';
-import { getStatusMessageID, getDescribedBy, getStatusIcon } from './chunk-WOIWI2UO.js';
-import { Button } from './chunk-2LABTS4P.js';
-import { Spinner } from './chunk-6ULCJ3XZ.js';
+import { getNecessity, Field } from './chunk-SEDUAMDW.js';
+import { getStatusMessageID, getDescribedBy, getStatusIcon } from './chunk-G6HS52US.js';
+import { Button } from './chunk-HMJINNXZ.js';
+import { Spinner } from './chunk-QHXI2QDK.js';
 import { isReactNode } from './chunk-2PSZAWLC.js';
-import { Icon } from './chunk-7T3SWOY7.js';
+import { Icon } from './chunk-IUW777WZ.js';
 import { css } from './chunk-OD4DHHZH.js';
 import { cx } from './chunk-PPNETWIP.js';
 import { Temporal } from '@js-temporal/polyfill';
@@ -29,12 +29,12 @@ function toInputString(time, hasSeconds) {
 }
 function fromInputString(value) {
   if (value === "") {
-    return void 0;
+    return null;
   }
   try {
     return Temporal.PlainTime.from(value);
   } catch {
-    return void 0;
+    return null;
   }
 }
 function TimeInput({
@@ -128,7 +128,7 @@ function TimeInput({
                 icon: X,
                 isIconOnly: true,
                 label: `Clear ${label}`,
-                onClick: () => onChange(void 0),
+                onClick: () => onChange(null),
                 size: "sm",
                 variant: "ghost"
               }
@@ -144,5 +144,5 @@ function TimeInput({
 TimeInput.displayName = "TimeInput";
 
 export { TimeInput };
-//# sourceMappingURL=chunk-S7INL5NI.js.map
-//# sourceMappingURL=chunk-S7INL5NI.js.map
+//# sourceMappingURL=chunk-FQN22DO5.js.map
+//# sourceMappingURL=chunk-FQN22DO5.js.map

package/dist/chunk-FQN22DO5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/TimeInput/TimeInput.tsx"],"names":[],"mappings":"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","file":"chunk-FQN22DO5.js","sourcesContent":["import {Temporal} from '@js-temporal/polyfill';\nimport {Clock, X} from 'lucide-react';\nimport {\n  useId,\n  type CSSProperties,\n  type FocusEvent,\n  type ReactNode,\n  type Ref,\n} from 'react';\nimport {Button} from 'components/Button';\nimport {\n  Field,\n  getNecessity,\n  type FieldNecessity,\n  type InputSize,\n  type InputStatus,\n} from 'components/Field';\nimport {inputRecipe, inputStyles} from 'components/Field/inputStyles';\nimport {\n  getDescribedBy,\n  getStatusIcon,\n  getStatusMessageID,\n} from 'components/Field/inputUtils';\nimport {Icon, type IconComponent} from 'components/Icon';\nimport {Spinner} from 'components/Spinner';\nimport {cx} from 'internal/cx';\nimport isReactNode from 'internal/isReactNode';\nimport {css} from 'styled-system/css';\n\nconst styles = {\n  input: css({\n    '&::-webkit-calendar-picker-indicator': {\n      display: 'none',\n    },\n  }),\n} as const;\n\nexport type PlainTime = Temporal.PlainTime;\n\nexport type TimeInputProps = {\n  /**\n   * Additional CSS class names applied to the input wrapper.\n   */\n  className?: string;\n  /**\n   * Test ID applied to the input element.\n   */\n  'data-testid'?: string;\n  /**\n   * Supporting text displayed below the label.\n   */\n  description?: ReactNode;\n  /**\n   * Whether to focus the input on mount.\n   * @default false\n   */\n  hasAutoFocus?: boolean;\n  /**\n   * Whether to show a clear button when a value is set.\n   * @default false\n   */\n  hasClear?: boolean;\n  /**\n   * Whether the input includes a seconds field.\n   * @default false\n   */\n  hasSeconds?: boolean;\n  /**\n   * HTML name attribute.\n   */\n  htmlName?: string;\n  /**\n   * Whether the input is disabled.\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Whether to visually hide the label.\n   * @default false\n   */\n  isLabelHidden?: boolean;\n  /**\n   * Whether the input is loading.\n   * @default false\n   */\n  isLoading?: boolean;\n  /**\n   * Field label.\n   */\n  label: string;\n  /**\n   * Icon shown before the label.\n   */\n  labelIcon?: IconComponent;\n  /**\n   * Tooltip content shown next to the label.\n   */\n  labelTooltip?: ReactNode;\n  /**\n   * Latest allowed time.\n   */\n  max?: PlainTime;\n  /**\n   * Earliest allowed time.\n   */\n  min?: PlainTime;\n  /**\n   * Called when the input loses focus.\n   */\n  onBlur?: (event: FocusEvent<HTMLInputElement>) => void;\n  /**\n   * Called when the time value changes.\n   */\n  onChange: (value: PlainTime | null) => void;\n  /**\n   * Called when the input gains focus.\n   */\n  onFocus?: (event: FocusEvent<HTMLInputElement>) => void;\n  /**\n   * Placeholder text.\n   * @default 'Select a time'\n   */\n  placeholder?: string;\n  /**\n   * Ref forwarded to the input element.\n   */\n  ref?: Ref<HTMLInputElement>;\n  /**\n   * Visual size.\n   * @default 'md'\n   */\n  size?: InputSize;\n  /**\n   * Validation status displayed below the input.\n   */\n  status?: InputStatus;\n  /**\n   * Step increment in seconds for the time picker.\n   */\n  step?: number;\n  /**\n   * Inline styles applied to the input wrapper.\n   */\n  style?: CSSProperties;\n  /**\n   * Controlled time value. Pass `null` for an empty input.\n   */\n  value: PlainTime | null;\n} & FieldNecessity;\n\nfunction toInputString(\n  time: PlainTime | null | undefined,\n  hasSeconds: boolean,\n): string {\n  if (time == null) {\n    return '';\n  }\n  return time.toString({\n    smallestUnit: hasSeconds ? 'second' : 'minute',\n  });\n}\n\nfunction fromInputString(value: string): PlainTime | null {\n  if (value === '') {\n    return null;\n  }\n  try {\n    return Temporal.PlainTime.from(value);\n  } catch {\n    return null;\n  }\n}\n\n/**\n * Time picker input field with optional seconds granularity.\n */\nexport function TimeInput({\n  label,\n  value,\n  onBlur,\n  onChange,\n  onFocus,\n  hasSeconds = false,\n  hasClear = false,\n  hasAutoFocus = false,\n  min,\n  max,\n  step,\n  size = 'md',\n  description,\n  isLabelHidden = false,\n  isOptional,\n  isRequired,\n  isDisabled = false,\n  isLoading = false,\n  htmlName,\n  status,\n  labelIcon,\n  labelTooltip,\n  placeholder = 'Select a time',\n  className,\n  'data-testid': dataTestId,\n  style,\n  ref,\n}: TimeInputProps): React.JSX.Element {\n  const inputId = useId();\n  const descriptionID = isReactNode(description)\n    ? `${inputId}-description`\n    : undefined;\n  const statusMessageID = getStatusMessageID(inputId, status);\n  const describedBy = getDescribedBy(descriptionID, statusMessageID);\n\n  const necessity = getNecessity(isOptional, isRequired);\n\n  return (\n    <Field\n      className={className}\n      description={description}\n      descriptionID={descriptionID}\n      inputId={inputId}\n      isDisabled={isDisabled}\n      isLabelHidden={isLabelHidden}\n      {...necessity}\n      label={label}\n      labelIcon={labelIcon}\n      labelTooltip={labelTooltip}\n      status={\n        status == null ? undefined : {...status, messageID: statusMessageID}\n      }\n      style={style}>\n      <div\n        className={inputRecipe({\n          size,\n          status: status?.type,\n          isDisabled,\n        })}>\n        <span className={inputStyles.iconSlot}>\n          <Icon icon={Clock} size=\"sm\" />\n        </span>\n        <input\n          aria-busy={isLoading || undefined}\n          aria-describedby={describedBy}\n          aria-invalid={status?.type === 'error' || undefined}\n          aria-required={isRequired ?? undefined}\n          // eslint-disable-next-line jsx-a11y-x/no-autofocus\n          autoFocus={hasAutoFocus}\n          className={cx(inputStyles.control, styles.input)}\n          data-autofocus={hasAutoFocus || undefined}\n          data-testid={dataTestId}\n          disabled={isDisabled}\n          id={inputId}\n          max={toInputString(max, hasSeconds)}\n          min={toInputString(min, hasSeconds)}\n          name={htmlName}\n          onBlur={onBlur}\n          onChange={event => onChange(fromInputString(event.target.value))}\n          onFocus={onFocus}\n          placeholder={placeholder}\n          ref={ref}\n          step={step ?? (hasSeconds ? 1 : 60)}\n          type=\"time\"\n          value={toInputString(value, hasSeconds)}\n        />\n        {hasClear && value != null && !isDisabled ? (\n          <Button\n            icon={X}\n            isIconOnly\n            label={`Clear ${label}`}\n            onClick={() => onChange(null)}\n            size=\"sm\"\n            variant=\"ghost\"\n          />\n        ) : null}\n        {isLoading ? <Spinner size=\"sm\" /> : null}\n        {status != null ? (\n          <span className={inputStyles.iconSlot}>\n            {getStatusIcon(status.type)}\n          </span>\n        ) : null}\n      </div>\n    </Field>\n  );\n}\n\nTimeInput.displayName = 'TimeInput';\n"]}

package/dist/{chunk-AJ6X62AI.js → chunk-FQSVY4QB.js}

@@ -1,4 +1,4 @@
-import { resolveAvatarSize, AvatarGroupContext, useAvatarGroup } from './chunk-ZQUPAIBS.js';
+import { resolveAvatarSize, AvatarGroupContext, useAvatarGroup } from './chunk-WTCH3QCQ.js';
 import { cva } from './chunk-FMEIPGUP.js';
 import { css } from './chunk-OD4DHHZH.js';
 import { cx } from './chunk-PPNETWIP.js';
@@ -134,5 +134,5 @@ function AvatarGroupOverflow({
 AvatarGroupOverflow.displayName = "AvatarGroupOverflow";
 
 export { AvatarGroup, AvatarGroupOverflow };
-//# sourceMappingURL=chunk-AJ6X62AI.js.map
-//# sourceMappingURL=chunk-AJ6X62AI.js.map
+//# sourceMappingURL=chunk-FQSVY4QB.js.map
+//# sourceMappingURL=chunk-FQSVY4QB.js.map

package/dist/chunk-FQSVY4QB.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AvatarGroup/AvatarGroup.recipe.ts","../src/components/AvatarGroup/AvatarGroup.tsx","../src/components/AvatarGroup/AvatarGroupOverflow.tsx"],"names":["jsx"],"mappings":"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","file":"chunk-FQSVY4QB.js","sourcesContent":["import {cva} from 'styled-system/css';\n\nexport const avatarGroupRecipe = cva({\n  base: {\n    display: 'inline-flex',\n    alignItems: 'center',\n    verticalAlign: 'middle',\n  },\n});\n","import type {CSSProperties, ReactNode, Ref} from 'react';\nimport {useMemo} from 'react';\nimport {resolveAvatarSize, type AvatarSize} from 'components/Avatar';\nimport {avatarGroupRecipe} from 'components/AvatarGroup/AvatarGroup.recipe';\nimport {AvatarGroupContext} from 'components/AvatarGroup/AvatarGroupContext';\nimport {cx} from 'internal/cx';\n\nconst OVERLAP_RATIO = 0.25;\n\n/**\n * Displays a stacked group of Avatars with shared size and overlap.\n */\nexport interface AvatarGroupProps {\n  /**\n   * Accessible label for the group. Default is \"Avatars\".\n   */\n  'aria-label'?: string;\n  /**\n   * Avatar and AvatarGroupOverflow children.\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   * Ref forwarded to the root element.\n   */\n  ref?: Ref<HTMLDivElement>;\n  /**\n   * Size applied to child Avatars. Individual Avatar size props are ignored\n   * while inside the group so the stack remains visually consistent.\n   */\n  size?: AvatarSize;\n  /**\n   * Inline styles applied to the root element.\n   */\n  style?: CSSProperties;\n}\n\ntype AvatarGroupStyle = CSSProperties & {\n  '--avatar-group-overlap': string;\n};\n\n/**\n * Displays a stacked group of Avatars with shared size and overlap.\n */\nexport function AvatarGroup({\n  'aria-label': ariaLabel = 'Avatars',\n  children,\n  className,\n  'data-testid': dataTestId,\n  ref,\n  size = 'small',\n  style,\n}: AvatarGroupProps): React.JSX.Element {\n  const numericSize = resolveAvatarSize(size);\n  const overlap = Math.round(numericSize * OVERLAP_RATIO);\n  const contextValue = useMemo(\n    () => ({numericSize, overlap, size}),\n    [numericSize, overlap, size],\n  );\n  const rootStyle: AvatarGroupStyle = {\n    '--avatar-group-overlap': `${-overlap}px`,\n    ...style,\n  };\n\n  return (\n    <AvatarGroupContext value={contextValue}>\n      <div\n        aria-label={ariaLabel}\n        className={cx(avatarGroupRecipe(), className)}\n        data-testid={dataTestId}\n        ref={ref}\n        role=\"group\"\n        style={rootStyle}>\n        {children}\n      </div>\n    </AvatarGroupContext>\n  );\n}\n\nAvatarGroup.displayName = 'AvatarGroup';\n","import type {CSSProperties, MouseEventHandler, ReactNode, Ref} from 'react';\nimport {useAvatarGroup} from 'components/AvatarGroup/AvatarGroupContext';\nimport {cx} from 'internal/cx';\nimport {css} from 'styled-system/css';\n\nconst DEFAULT_SIZE = 36;\nconst BORDER_WIDTH = 2;\nconst OVERFLOW_FONT_RATIO = 0.35;\n\n/**\n * Overflow indicator for AvatarGroup.\n */\nexport interface AvatarGroupOverflowProps {\n  /**\n   * Custom content rendered instead of the default \"+N\" text.\n   */\n  children?: ReactNode;\n  /**\n   * Additional CSS class names applied to the root element.\n   */\n  className?: string;\n  /**\n   * Number of hidden avatars represented by the overflow indicator.\n   */\n  count: number;\n  /**\n   * Test ID applied to the root element.\n   */\n  'data-testid'?: string;\n  /**\n   * Click handler. When set, the overflow indicator renders as a button.\n   */\n  onClick?: MouseEventHandler<HTMLButtonElement>;\n  /**\n   * Ref forwarded to the root element.\n   */\n  ref?: Ref<HTMLElement>;\n  /**\n   * Inline styles applied to the root element.\n   */\n  style?: CSSProperties;\n}\n\nconst styles = {\n  root: css({\n    position: 'relative',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    borderRadius: 'full',\n    borderWidth: `${BORDER_WIDTH}px`,\n    borderStyle: 'solid',\n    borderColor: 'bg',\n    boxSizing: 'content-box',\n    bg: 'bg.subtle',\n    color: 'fg.muted',\n    fontFamily: 'body',\n    fontWeight: 'medium',\n    userSelect: 'none',\n    '&:not(:first-child)': {\n      marginInlineStart: 'var(--avatar-group-overlap)',\n    },\n  }),\n  button: css({\n    cursor: 'pointer',\n    p: 0,\n    _focusVisible: {\n      outlineWidth: 'focus',\n      outlineStyle: 'solid',\n      outlineColor: 'primary',\n      outlineOffset: 'focusOffset',\n    },\n  }),\n};\n\n/**\n * Overflow indicator showing the count of hidden avatars in an AvatarGroup.\n */\nexport function AvatarGroupOverflow({\n  children,\n  className,\n  count,\n  'data-testid': dataTestId,\n  onClick,\n  ref,\n  style,\n}: AvatarGroupOverflowProps): React.JSX.Element | null {\n  const group = useAvatarGroup();\n\n  if (count <= 0) {\n    return null;\n  }\n\n  const numericSize = group?.numericSize ?? DEFAULT_SIZE;\n  const label = `${count} more`;\n  const content = children ?? `+${count}`;\n  const rootStyle: CSSProperties = {\n    width: numericSize,\n    height: numericSize,\n    fontSize: numericSize * OVERFLOW_FONT_RATIO,\n    ...style,\n  };\n\n  if (onClick != null) {\n    return (\n      <button\n        aria-label={label}\n        className={cx(styles.root, styles.button, className)}\n        data-testid={dataTestId}\n        onClick={onClick}\n        ref={ref as Ref<HTMLButtonElement>}\n        style={rootStyle}\n        type=\"button\">\n        {content}\n      </button>\n    );\n  }\n\n  return (\n    <span\n      aria-label={label}\n      className={cx(styles.root, className)}\n      data-testid={dataTestId}\n      ref={ref}\n      role=\"status\"\n      style={rootStyle}>\n      {content}\n    </span>\n  );\n}\n\nAvatarGroupOverflow.displayName = 'AvatarGroupOverflow';\n"]}