silver-ui 0.1.0

package/dist/chunk-6SPQDYHC.cjs

@@ -0,0 +1,455 @@
+'use strict';
+
+var chunk6SHL7FYO_cjs = require('./chunk-6SHL7FYO.cjs');
+var chunkAZDWQGAX_cjs = require('./chunk-AZDWQGAX.cjs');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+// styled-system/css/cx.js
+function cx() {
+  let str = "", i = 0, arg;
+  for (; i < arguments.length; ) {
+    if ((arg = arguments[i++]) && typeof arg === "string") {
+      str && (str += " ");
+      str += arg;
+    }
+  }
+  return str;
+}
+var useIsomorphicLayoutEffect = typeof document !== "undefined" ? react.useLayoutEffect : react.useEffect;
+var styles = {
+  wrapperContents: chunkAZDWQGAX_cjs.css({
+    display: "contents"
+  }),
+  wrapperInline: chunkAZDWQGAX_cjs.css({
+    display: "inline"
+  }),
+  hoverIndication: chunkAZDWQGAX_cjs.css({
+    textDecorationLine: "underline",
+    textDecorationStyle: "dashed",
+    textDecorationColor: "fg.muted",
+    textUnderlineOffset: "2px"
+  })
+};
+function isTextOnly(children) {
+  return typeof children === "string" || typeof children === "number";
+}
+function mergeIds(...ids) {
+  const filtered = ids.filter(Boolean);
+  return filtered.length > 0 ? filtered.join(" ") : void 0;
+}
+function HoverLayerTrigger({
+  children,
+  className,
+  "data-testid": dataTestId,
+  describedBy,
+  hasHoverIndication = "auto",
+  layer,
+  nonTextWrapperElement = "span",
+  shouldForwardNonTextWrapperProps = true,
+  style,
+  triggerRef,
+  wrapperRef
+}) {
+  const ownWrapperRef = react.useRef(null);
+  const textOnly = isTextOnly(children);
+  const showHoverIndication = hasHoverIndication === true || hasHoverIndication === "auto" && textOnly;
+  useIsomorphicLayoutEffect(() => {
+    if (textOnly) {
+      return;
+    }
+    const firstChild = ownWrapperRef.current?.firstElementChild;
+    if (!(firstChild instanceof HTMLElement)) {
+      return;
+    }
+    triggerRef(firstChild);
+    const existingDescribedBy = firstChild.getAttribute("aria-describedby");
+    firstChild.setAttribute(
+      "aria-describedby",
+      mergeIds(existingDescribedBy, describedBy) ?? ""
+    );
+    return () => {
+      triggerRef(null);
+      if (existingDescribedBy != null) {
+        firstChild.setAttribute("aria-describedby", existingDescribedBy);
+        return;
+      }
+      firstChild.removeAttribute("aria-describedby");
+    };
+  }, [describedBy, textOnly, triggerRef]);
+  if (textOnly) {
+    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          "aria-describedby": describedBy,
+          className: cx(
+            styles.wrapperInline,
+            showHoverIndication ? styles.hoverIndication : void 0,
+            className
+          ),
+          "data-testid": dataTestId,
+          ref: chunk6SHL7FYO_cjs.mergeRefs(triggerRef, wrapperRef),
+          style,
+          tabIndex: 0,
+          children
+        }
+      ),
+      layer
+    ] });
+  }
+  const nonTextWrapperRef = shouldForwardNonTextWrapperProps ? chunk6SHL7FYO_cjs.mergeRefs(ownWrapperRef, wrapperRef) : ownWrapperRef;
+  const nonTextWrapperClassName = cx(
+    styles.wrapperContents,
+    shouldForwardNonTextWrapperProps ? className : void 0
+  );
+  const nonTextWrapperTestId = shouldForwardNonTextWrapperProps ? dataTestId : void 0;
+  const nonTextWrapperStyle = shouldForwardNonTextWrapperProps ? style : void 0;
+  const wrappedChildren = nonTextWrapperElement === "div" ? /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: nonTextWrapperClassName,
+      "data-testid": nonTextWrapperTestId,
+      ref: nonTextWrapperRef,
+      style: nonTextWrapperStyle,
+      children
+    }
+  ) : /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      className: nonTextWrapperClassName,
+      "data-testid": nonTextWrapperTestId,
+      ref: nonTextWrapperRef,
+      style: nonTextWrapperStyle,
+      children
+    }
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    wrappedChildren,
+    layer
+  ] });
+}
+var styles2 = {
+  layer: chunkAZDWQGAX_cjs.css({
+    m: 0,
+    p: 0,
+    borderWidth: 0,
+    borderStyle: "none",
+    borderColor: "transparent",
+    overflow: "visible",
+    bg: "transparent"
+  })
+};
+function getPositionArea(placement = "above", alignment = "center") {
+  const placementMap = {
+    above: "top",
+    below: "bottom",
+    start: "left",
+    end: "right"
+  };
+  const cssPlacement = placementMap[placement];
+  if (placement === "above" || placement === "below") {
+    if (alignment === "start") {
+      return `${cssPlacement} span-right`;
+    }
+    if (alignment === "end") {
+      return `${cssPlacement} span-left`;
+    }
+    return cssPlacement;
+  }
+  if (alignment === "start") {
+    return `${cssPlacement} span-bottom`;
+  }
+  if (alignment === "end") {
+    return `${cssPlacement} span-top`;
+  }
+  return `${cssPlacement} center`;
+}
+function useLayer({
+  onShow,
+  onHide,
+  hasLightDismiss = false
+} = {}) {
+  const id = react.useId();
+  const anchorId = `--silver-layer-${id.replace(/:/g, "")}`;
+  const [isOpen, setIsOpen] = react.useState(false);
+  const popoverRef = react.useRef(null);
+  const triggerRef = react.useRef(null);
+  const isOpenRef = react.useRef(false);
+  const show = react.useCallback(() => {
+    if (popoverRef.current == null || isOpenRef.current) {
+      return;
+    }
+    popoverRef.current.showPopover();
+    isOpenRef.current = true;
+    setIsOpen(true);
+    onShow?.();
+  }, [onShow]);
+  const hide = react.useCallback(() => {
+    if (!isOpenRef.current) {
+      return;
+    }
+    popoverRef.current?.hidePopover();
+    isOpenRef.current = false;
+    setIsOpen(false);
+    onHide?.();
+  }, [onHide]);
+  const ref = react.useCallback(
+    (element) => {
+      if (triggerRef.current != null) {
+        triggerRef.current.style.anchorName = "";
+      }
+      if (element != null) {
+        element.style.anchorName = anchorId;
+      }
+      triggerRef.current = element;
+    },
+    [anchorId]
+  );
+  const handleToggle = react.useCallback(
+    (event) => {
+      const toggleEvent = event;
+      if (toggleEvent.newState === "closed" && isOpenRef.current) {
+        isOpenRef.current = false;
+        setIsOpen(false);
+        onHide?.();
+      }
+    },
+    [onHide]
+  );
+  const popoverRefCallback = react.useCallback(
+    (element) => {
+      if (popoverRef.current != null) {
+        popoverRef.current.removeEventListener("toggle", handleToggle);
+      }
+      popoverRef.current = element;
+      if (element != null) {
+        element.addEventListener("toggle", handleToggle);
+      }
+    },
+    [handleToggle]
+  );
+  const render = react.useCallback(
+    (children, props) => {
+      const placement = props?.placement ?? "above";
+      const alignment = props?.alignment ?? "center";
+      const anchorStyle = {
+        border: "none",
+        positionAnchor: anchorId,
+        positionArea: getPositionArea(placement, alignment),
+        positionTryFallbacks: "flip-block, flip-inline, flip-block flip-inline"
+      };
+      const layerProps = {
+        ref: popoverRefCallback,
+        id,
+        role: props?.role,
+        popover: hasLightDismiss ? "auto" : "manual",
+        className: cx(styles2.layer, props?.className),
+        style: { ...anchorStyle, ...props?.style }
+      };
+      return react.createElement("div", layerProps, children);
+    },
+    [anchorId, hasLightDismiss, id, popoverRefCallback]
+  );
+  return {
+    ref,
+    anchorId,
+    show,
+    hide,
+    isOpen,
+    id,
+    render
+  };
+}
+function isFocusable(element) {
+  if (element.hasAttribute("tabindex")) {
+    return element.tabIndex >= 0;
+  }
+  if (["A", "BUTTON", "INPUT", "SELECT", "TEXTAREA"].includes(element.tagName)) {
+    return !element.disabled;
+  }
+  return element.isContentEditable;
+}
+function isTouchDevice() {
+  return typeof window !== "undefined" && typeof window.matchMedia === "function" && window.matchMedia("(hover: none)").matches;
+}
+function useHoverLayer({
+  delay = 200,
+  focusTrigger = "auto",
+  hideDelay = 0,
+  isEnabled = true,
+  onFocusIn,
+  onFocusOut,
+  onHide,
+  onShow,
+  onTriggerEscape,
+  shouldHide
+} = {}) {
+  const layer = useLayer({ onShow, onHide });
+  const showTimeoutRef = react.useRef(null);
+  const hideTimeoutRef = react.useRef(null);
+  const triggerRef = react.useRef(null);
+  const clearTimeouts = react.useCallback(() => {
+    if (showTimeoutRef.current != null) {
+      clearTimeout(showTimeoutRef.current);
+      showTimeoutRef.current = null;
+    }
+    if (hideTimeoutRef.current != null) {
+      clearTimeout(hideTimeoutRef.current);
+      hideTimeoutRef.current = null;
+    }
+  }, []);
+  const scheduleShow = react.useCallback(() => {
+    if (!isEnabled) {
+      return;
+    }
+    clearTimeouts();
+    showTimeoutRef.current = setTimeout(() => layer.show(), delay);
+  }, [clearTimeouts, delay, isEnabled, layer]);
+  const hideIfAllowed = react.useCallback(() => {
+    if (shouldHide?.() === false) {
+      return;
+    }
+    layer.hide();
+  }, [layer, shouldHide]);
+  const scheduleHide = react.useCallback(() => {
+    clearTimeouts();
+    if (hideDelay > 0) {
+      hideTimeoutRef.current = setTimeout(hideIfAllowed, hideDelay);
+      return;
+    }
+    hideIfAllowed();
+  }, [clearTimeouts, hideDelay, hideIfAllowed]);
+  const handleMouseEnter = react.useCallback(() => {
+    if (isTouchDevice()) {
+      return;
+    }
+    scheduleShow();
+  }, [scheduleShow]);
+  const handleMouseLeave = react.useCallback(() => {
+    scheduleHide();
+  }, [scheduleHide]);
+  const handleFocusIn = react.useCallback(
+    (event) => {
+      if (!isEnabled || onFocusIn?.(event) === false) {
+        return;
+      }
+      clearTimeouts();
+      layer.show();
+    },
+    [clearTimeouts, isEnabled, layer, onFocusIn]
+  );
+  const handleFocusOut = react.useCallback(
+    (event) => {
+      if (onFocusOut?.(event) === false) {
+        return;
+      }
+      scheduleHide();
+    },
+    [onFocusOut, scheduleHide]
+  );
+  const handleKeyDown = react.useCallback(
+    (event) => {
+      if (event.key === "Escape" && layer.isOpen) {
+        onTriggerEscape?.(event);
+      }
+    },
+    [layer.isOpen, onTriggerEscape]
+  );
+  const handlersRef = react.useRef({
+    focusIn: handleFocusIn,
+    focusOut: handleFocusOut,
+    keyDown: handleKeyDown,
+    mouseEnter: handleMouseEnter,
+    mouseLeave: handleMouseLeave
+  });
+  handlersRef.current = {
+    focusIn: handleFocusIn,
+    focusOut: handleFocusOut,
+    keyDown: handleKeyDown,
+    mouseEnter: handleMouseEnter,
+    mouseLeave: handleMouseLeave
+  };
+  const stableMouseEnter = react.useCallback(() => {
+    handlersRef.current.mouseEnter();
+  }, []);
+  const stableMouseLeave = react.useCallback(() => {
+    handlersRef.current.mouseLeave();
+  }, []);
+  const stableFocusIn = react.useCallback((event) => {
+    handlersRef.current.focusIn(event);
+  }, []);
+  const stableFocusOut = react.useCallback((event) => {
+    handlersRef.current.focusOut(event);
+  }, []);
+  const stableKeyDown = react.useCallback((event) => {
+    handlersRef.current.keyDown(event);
+  }, []);
+  const interactionRef = react.useCallback(
+    (element) => {
+      if (triggerRef.current != null) {
+        triggerRef.current.removeEventListener("mouseenter", stableMouseEnter);
+        triggerRef.current.removeEventListener("mouseleave", stableMouseLeave);
+        triggerRef.current.removeEventListener("focusin", stableFocusIn);
+        triggerRef.current.removeEventListener("focusout", stableFocusOut);
+        triggerRef.current.removeEventListener("keydown", stableKeyDown);
+      }
+      if (element != null) {
+        element.addEventListener("mouseenter", stableMouseEnter);
+        element.addEventListener("mouseleave", stableMouseLeave);
+        const shouldAttachFocus = focusTrigger === "always" || focusTrigger === "auto" && isFocusable(element);
+        if (shouldAttachFocus) {
+          element.addEventListener("focusin", stableFocusIn);
+          element.addEventListener("focusout", stableFocusOut);
+        }
+        if (onTriggerEscape != null) {
+          element.addEventListener("keydown", stableKeyDown);
+        }
+      }
+      triggerRef.current = element;
+    },
+    [
+      focusTrigger,
+      onTriggerEscape,
+      stableFocusIn,
+      stableFocusOut,
+      stableKeyDown,
+      stableMouseEnter,
+      stableMouseLeave
+    ]
+  );
+  const ref = react.useCallback(
+    (element) => {
+      layer.ref(element);
+      interactionRef(element);
+    },
+    [interactionRef, layer]
+  );
+  react.useEffect(() => {
+    return () => clearTimeouts();
+  }, [clearTimeouts]);
+  return react.useMemo(
+    () => ({
+      anchorId: layer.anchorId,
+      clearTimeouts,
+      describedBy: layer.id,
+      hide: layer.hide,
+      interactionRef,
+      layer,
+      positionRef: layer.ref,
+      ref,
+      scheduleHide,
+      show: layer.show,
+      triggerRef
+    }),
+    [clearTimeouts, interactionRef, layer, ref, scheduleHide]
+  );
+}
+
+exports.HoverLayerTrigger = HoverLayerTrigger;
+exports.cx = cx;
+exports.useHoverLayer = useHoverLayer;
+exports.useIsomorphicLayoutEffect = useIsomorphicLayoutEffect;
+exports.useLayer = useLayer;
+//# sourceMappingURL=chunk-6SPQDYHC.cjs.map
+//# sourceMappingURL=chunk-6SPQDYHC.cjs.map

package/dist/chunk-6SPQDYHC.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../styled-system/css/cx.js","../src/internal/useIsomorphicLayoutEffect.ts","../src/internal/HoverLayerTrigger.tsx","../src/internal/useLayer.tsx","../src/internal/useHoverLayer.ts"],"names":["useLayoutEffect","useEffect","css","useRef","jsxs","Fragment","jsx","mergeRefs","styles","useId","useState","useCallback","createElement","useMemo"],"mappings":"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","file":"chunk-6SPQDYHC.cjs","sourcesContent":["function cx() {\n  let str = '',\n    i = 0,\n    arg\n\n  for (; i < arguments.length; ) {\n    if ((arg = arguments[i++]) && typeof arg === 'string') {\n      str && (str += ' ')\n      str += arg\n    }\n  }\n  return str\n}\n\nexport { cx }","import {useEffect, useLayoutEffect} from 'react';\n\nexport const useIsomorphicLayoutEffect =\n  typeof document !== 'undefined' ? useLayoutEffect : useEffect;\n","import {\n  useRef,\n  type CSSProperties,\n  type ReactNode,\n  type Ref,\n  type RefCallback,\n} from 'react';\nimport {css, cx} from 'styled-system/css';\nimport {mergeRefs} from './mergeRefs';\nimport {useIsomorphicLayoutEffect} from './useIsomorphicLayoutEffect';\n\nexport type HoverLayerTriggerIndication = 'auto' | boolean;\n\nexport interface HoverLayerTriggerProps {\n  children: ReactNode;\n  className?: string;\n  'data-testid'?: string;\n  describedBy: string;\n  hasHoverIndication?: HoverLayerTriggerIndication;\n  layer: ReactNode;\n  nonTextWrapperElement?: 'div' | 'span';\n  shouldForwardNonTextWrapperProps?: boolean;\n  style?: CSSProperties;\n  triggerRef: RefCallback<HTMLElement>;\n  wrapperRef?: Ref<HTMLElement>;\n}\n\nconst styles = {\n  wrapperContents: css({\n    display: 'contents',\n  }),\n  wrapperInline: css({\n    display: 'inline',\n  }),\n  hoverIndication: css({\n    textDecorationLine: 'underline',\n    textDecorationStyle: 'dashed',\n    textDecorationColor: 'fg.muted',\n    textUnderlineOffset: '2px',\n  }),\n} as const;\n\nfunction isTextOnly(children: ReactNode): boolean {\n  return typeof children === 'string' || typeof children === 'number';\n}\n\nfunction mergeIds(...ids: (string | undefined | null)[]): string | undefined {\n  const filtered = ids.filter(Boolean);\n  return filtered.length > 0 ? filtered.join(' ') : undefined;\n}\n\nexport function HoverLayerTrigger({\n  children,\n  className,\n  'data-testid': dataTestId,\n  describedBy,\n  hasHoverIndication = 'auto',\n  layer,\n  nonTextWrapperElement = 'span',\n  shouldForwardNonTextWrapperProps = true,\n  style,\n  triggerRef,\n  wrapperRef,\n}: HoverLayerTriggerProps): React.JSX.Element {\n  const ownWrapperRef = useRef<HTMLDivElement | HTMLSpanElement>(null);\n  const textOnly = isTextOnly(children);\n  const showHoverIndication =\n    hasHoverIndication === true || (hasHoverIndication === 'auto' && textOnly);\n\n  useIsomorphicLayoutEffect(() => {\n    if (textOnly) {\n      return;\n    }\n\n    const firstChild = ownWrapperRef.current?.firstElementChild;\n    if (!(firstChild instanceof HTMLElement)) {\n      return;\n    }\n\n    triggerRef(firstChild);\n    const existingDescribedBy = firstChild.getAttribute('aria-describedby');\n    firstChild.setAttribute(\n      'aria-describedby',\n      mergeIds(existingDescribedBy, describedBy) ?? '',\n    );\n\n    return () => {\n      triggerRef(null);\n      if (existingDescribedBy != null) {\n        firstChild.setAttribute('aria-describedby', existingDescribedBy);\n        return;\n      }\n\n      firstChild.removeAttribute('aria-describedby');\n    };\n  }, [describedBy, textOnly, triggerRef]);\n\n  if (textOnly) {\n    return (\n      <>\n        <span\n          aria-describedby={describedBy}\n          className={cx(\n            styles.wrapperInline,\n            showHoverIndication ? styles.hoverIndication : undefined,\n            className,\n          )}\n          data-testid={dataTestId}\n          ref={mergeRefs(triggerRef as Ref<HTMLSpanElement>, wrapperRef)}\n          style={style}\n          tabIndex={0}>\n          {children}\n        </span>\n        {layer}\n      </>\n    );\n  }\n\n  const nonTextWrapperRef = shouldForwardNonTextWrapperProps\n    ? mergeRefs(ownWrapperRef, wrapperRef)\n    : ownWrapperRef;\n  const nonTextWrapperClassName = cx(\n    styles.wrapperContents,\n    shouldForwardNonTextWrapperProps ? className : undefined,\n  );\n  const nonTextWrapperTestId = shouldForwardNonTextWrapperProps\n    ? dataTestId\n    : undefined;\n  const nonTextWrapperStyle = shouldForwardNonTextWrapperProps\n    ? style\n    : undefined;\n  const wrappedChildren =\n    nonTextWrapperElement === 'div' ? (\n      <div\n        className={nonTextWrapperClassName}\n        data-testid={nonTextWrapperTestId}\n        ref={nonTextWrapperRef as Ref<HTMLDivElement>}\n        style={nonTextWrapperStyle}>\n        {children}\n      </div>\n    ) : (\n      <span\n        className={nonTextWrapperClassName}\n        data-testid={nonTextWrapperTestId}\n        ref={nonTextWrapperRef}\n        style={nonTextWrapperStyle}>\n        {children}\n      </span>\n    );\n\n  return (\n    <>\n      {wrappedChildren}\n      {layer}\n    </>\n  );\n}\n","import {\n  createElement,\n  useCallback,\n  useId,\n  useRef,\n  useState,\n  type ReactNode,\n  type RefCallback,\n} from 'react';\nimport {css, cx} from 'styled-system/css';\n\nexport type LayerPlacement = 'above' | 'below' | 'start' | 'end';\nexport type LayerAlignment = 'start' | 'center' | 'end';\n\nexport interface ContextRenderProps {\n  alignment?: LayerAlignment;\n  className?: string;\n  placement?: LayerPlacement;\n  role?: string;\n  style?: React.CSSProperties;\n}\n\ninterface LayerOptions {\n  hasLightDismiss?: boolean;\n  onHide?: () => void;\n  onShow?: () => void;\n}\n\ntype PopoverValue = 'auto' | 'manual' | 'hint' | '';\n\ntype LayerElementProps = React.HTMLAttributes<HTMLDivElement> & {\n  popover: PopoverValue;\n  ref: RefCallback<HTMLElement>;\n};\n\nexport interface LayerReturn {\n  anchorId: string;\n  hide: () => void;\n  id: string;\n  isOpen: boolean;\n  ref: RefCallback<HTMLElement>;\n  render: (children: ReactNode, props?: ContextRenderProps) => ReactNode;\n  show: () => void;\n}\n\nconst styles = {\n  layer: css({\n    m: 0,\n    p: 0,\n    borderWidth: 0,\n    borderStyle: 'none',\n    borderColor: 'transparent',\n    overflow: 'visible',\n    bg: 'transparent',\n  }),\n};\n\nfunction getPositionArea(\n  placement: LayerPlacement = 'above',\n  alignment: LayerAlignment = 'center',\n): string {\n  const placementMap: Record<LayerPlacement, string> = {\n    above: 'top',\n    below: 'bottom',\n    start: 'left',\n    end: 'right',\n  };\n\n  const cssPlacement = placementMap[placement];\n\n  if (placement === 'above' || placement === 'below') {\n    if (alignment === 'start') {\n      return `${cssPlacement} span-right`;\n    }\n    if (alignment === 'end') {\n      return `${cssPlacement} span-left`;\n    }\n    return cssPlacement;\n  }\n\n  if (alignment === 'start') {\n    return `${cssPlacement} span-bottom`;\n  }\n  if (alignment === 'end') {\n    return `${cssPlacement} span-top`;\n  }\n  return `${cssPlacement} center`;\n}\n\nexport function useLayer({\n  onShow,\n  onHide,\n  hasLightDismiss = false,\n}: LayerOptions = {}): LayerReturn {\n  const id = useId();\n  const anchorId = `--silver-layer-${id.replace(/:/g, '')}`;\n  const [isOpen, setIsOpen] = useState(false);\n  const popoverRef = useRef<HTMLElement | null>(null);\n  const triggerRef = useRef<HTMLElement | null>(null);\n  const isOpenRef = useRef(false);\n\n  const show = useCallback(() => {\n    if (popoverRef.current == null || isOpenRef.current) {\n      return;\n    }\n\n    popoverRef.current.showPopover();\n    isOpenRef.current = true;\n    setIsOpen(true);\n    onShow?.();\n  }, [onShow]);\n\n  const hide = useCallback(() => {\n    if (!isOpenRef.current) {\n      return;\n    }\n\n    popoverRef.current?.hidePopover();\n    isOpenRef.current = false;\n    setIsOpen(false);\n    onHide?.();\n  }, [onHide]);\n\n  const ref: RefCallback<HTMLElement> = useCallback(\n    element => {\n      if (triggerRef.current != null) {\n        (\n          triggerRef.current.style as unknown as Record<string, string>\n        ).anchorName = '';\n      }\n\n      if (element != null) {\n        (element.style as unknown as Record<string, string>).anchorName =\n          anchorId;\n      }\n\n      triggerRef.current = element;\n    },\n    [anchorId],\n  );\n\n  const handleToggle = useCallback(\n    (event: Event) => {\n      const toggleEvent = event as ToggleEvent;\n      if (toggleEvent.newState === 'closed' && isOpenRef.current) {\n        isOpenRef.current = false;\n        setIsOpen(false);\n        onHide?.();\n      }\n    },\n    [onHide],\n  );\n\n  const popoverRefCallback = useCallback(\n    (element: HTMLElement | null) => {\n      if (popoverRef.current != null) {\n        popoverRef.current.removeEventListener('toggle', handleToggle);\n      }\n\n      popoverRef.current = element;\n\n      if (element != null) {\n        element.addEventListener('toggle', handleToggle);\n      }\n    },\n    [handleToggle],\n  );\n\n  const render = useCallback(\n    (children: ReactNode, props?: ContextRenderProps) => {\n      const placement = props?.placement ?? 'above';\n      const alignment = props?.alignment ?? 'center';\n      const anchorStyle: React.CSSProperties = {\n        border: 'none',\n        positionAnchor: anchorId,\n        positionArea: getPositionArea(placement, alignment),\n        positionTryFallbacks: 'flip-block, flip-inline, flip-block flip-inline',\n      };\n\n      const layerProps: LayerElementProps = {\n        ref: popoverRefCallback,\n        id,\n        role: props?.role,\n        popover: hasLightDismiss ? 'auto' : 'manual',\n        className: cx(styles.layer, props?.className),\n        style: {...anchorStyle, ...props?.style},\n      };\n\n      return createElement('div', layerProps, children);\n    },\n    [anchorId, hasLightDismiss, id, popoverRefCallback],\n  );\n\n  return {\n    ref,\n    anchorId,\n    show,\n    hide,\n    isOpen,\n    id,\n    render,\n  };\n}\n","import {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  type RefCallback,\n  type RefObject,\n} from 'react';\nimport {useLayer, type LayerReturn} from './useLayer';\n\nexport type HoverLayerFocusTrigger = 'auto' | 'always' | 'never';\n\nexport interface UseHoverLayerOptions {\n  delay?: number;\n  focusTrigger?: HoverLayerFocusTrigger;\n  hideDelay?: number;\n  isEnabled?: boolean;\n  onFocusIn?: (event: FocusEvent) => boolean;\n  onFocusOut?: (event: FocusEvent) => boolean;\n  onHide?: () => void;\n  onShow?: () => void;\n  onTriggerEscape?: (event: KeyboardEvent) => void;\n  shouldHide?: () => boolean;\n}\n\nexport interface UseHoverLayerReturn {\n  anchorId: string;\n  clearTimeouts: () => void;\n  describedBy: string;\n  hide: () => void;\n  interactionRef: RefCallback<HTMLElement>;\n  layer: LayerReturn;\n  positionRef: RefCallback<HTMLElement>;\n  ref: RefCallback<HTMLElement>;\n  scheduleHide: () => void;\n  show: () => void;\n  triggerRef: RefObject<HTMLElement | null>;\n}\n\nfunction isFocusable(element: HTMLElement): boolean {\n  if (element.hasAttribute('tabindex')) {\n    return element.tabIndex >= 0;\n  }\n\n  if (\n    ['A', 'BUTTON', 'INPUT', 'SELECT', 'TEXTAREA'].includes(element.tagName)\n  ) {\n    return !(element as HTMLButtonElement).disabled;\n  }\n\n  return element.isContentEditable;\n}\n\nfunction isTouchDevice(): boolean {\n  return (\n    typeof window !== 'undefined' &&\n    typeof window.matchMedia === 'function' &&\n    window.matchMedia('(hover: none)').matches\n  );\n}\n\nexport function useHoverLayer({\n  delay = 200,\n  focusTrigger = 'auto',\n  hideDelay = 0,\n  isEnabled = true,\n  onFocusIn,\n  onFocusOut,\n  onHide,\n  onShow,\n  onTriggerEscape,\n  shouldHide,\n}: UseHoverLayerOptions = {}): UseHoverLayerReturn {\n  const layer = useLayer({onShow, onHide});\n  const showTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const hideTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const triggerRef = useRef<HTMLElement | null>(null);\n\n  const clearTimeouts = useCallback(() => {\n    if (showTimeoutRef.current != null) {\n      clearTimeout(showTimeoutRef.current);\n      showTimeoutRef.current = null;\n    }\n\n    if (hideTimeoutRef.current != null) {\n      clearTimeout(hideTimeoutRef.current);\n      hideTimeoutRef.current = null;\n    }\n  }, []);\n\n  const scheduleShow = useCallback(() => {\n    if (!isEnabled) {\n      return;\n    }\n\n    clearTimeouts();\n    showTimeoutRef.current = setTimeout(() => layer.show(), delay);\n  }, [clearTimeouts, delay, isEnabled, layer]);\n\n  const hideIfAllowed = useCallback(() => {\n    if (shouldHide?.() === false) {\n      return;\n    }\n\n    layer.hide();\n  }, [layer, shouldHide]);\n\n  const scheduleHide = useCallback(() => {\n    clearTimeouts();\n\n    if (hideDelay > 0) {\n      hideTimeoutRef.current = setTimeout(hideIfAllowed, hideDelay);\n      return;\n    }\n\n    hideIfAllowed();\n  }, [clearTimeouts, hideDelay, hideIfAllowed]);\n\n  const handleMouseEnter = useCallback(() => {\n    if (isTouchDevice()) {\n      return;\n    }\n\n    scheduleShow();\n  }, [scheduleShow]);\n\n  const handleMouseLeave = useCallback(() => {\n    scheduleHide();\n  }, [scheduleHide]);\n\n  const handleFocusIn = useCallback(\n    (event: FocusEvent) => {\n      if (!isEnabled || onFocusIn?.(event) === false) {\n        return;\n      }\n\n      clearTimeouts();\n      layer.show();\n    },\n    [clearTimeouts, isEnabled, layer, onFocusIn],\n  );\n\n  const handleFocusOut = useCallback(\n    (event: FocusEvent) => {\n      if (onFocusOut?.(event) === false) {\n        return;\n      }\n\n      scheduleHide();\n    },\n    [onFocusOut, scheduleHide],\n  );\n\n  const handleKeyDown = useCallback(\n    (event: KeyboardEvent) => {\n      if (event.key === 'Escape' && layer.isOpen) {\n        onTriggerEscape?.(event);\n      }\n    },\n    [layer.isOpen, onTriggerEscape],\n  );\n\n  const handlersRef = useRef({\n    focusIn: handleFocusIn,\n    focusOut: handleFocusOut,\n    keyDown: handleKeyDown,\n    mouseEnter: handleMouseEnter,\n    mouseLeave: handleMouseLeave,\n  });\n  // eslint-disable-next-line @eslint-react/refs -- latest-ref pattern for stable DOM listeners\n  handlersRef.current = {\n    focusIn: handleFocusIn,\n    focusOut: handleFocusOut,\n    keyDown: handleKeyDown,\n    mouseEnter: handleMouseEnter,\n    mouseLeave: handleMouseLeave,\n  };\n\n  const stableMouseEnter = useCallback(() => {\n    handlersRef.current.mouseEnter();\n  }, []);\n  const stableMouseLeave = useCallback(() => {\n    handlersRef.current.mouseLeave();\n  }, []);\n  const stableFocusIn = useCallback((event: Event) => {\n    handlersRef.current.focusIn(event as FocusEvent);\n  }, []);\n  const stableFocusOut = useCallback((event: Event) => {\n    handlersRef.current.focusOut(event as FocusEvent);\n  }, []);\n  const stableKeyDown = useCallback((event: Event) => {\n    handlersRef.current.keyDown(event as KeyboardEvent);\n  }, []);\n\n  const interactionRef: RefCallback<HTMLElement> = useCallback(\n    element => {\n      if (triggerRef.current != null) {\n        triggerRef.current.removeEventListener('mouseenter', stableMouseEnter);\n        triggerRef.current.removeEventListener('mouseleave', stableMouseLeave);\n        triggerRef.current.removeEventListener('focusin', stableFocusIn);\n        triggerRef.current.removeEventListener('focusout', stableFocusOut);\n        triggerRef.current.removeEventListener('keydown', stableKeyDown);\n      }\n\n      if (element != null) {\n        element.addEventListener('mouseenter', stableMouseEnter);\n        element.addEventListener('mouseleave', stableMouseLeave);\n\n        const shouldAttachFocus =\n          focusTrigger === 'always' ||\n          (focusTrigger === 'auto' && isFocusable(element));\n\n        if (shouldAttachFocus) {\n          element.addEventListener('focusin', stableFocusIn);\n          element.addEventListener('focusout', stableFocusOut);\n        }\n\n        if (onTriggerEscape != null) {\n          element.addEventListener('keydown', stableKeyDown);\n        }\n      }\n\n      triggerRef.current = element;\n    },\n    [\n      focusTrigger,\n      onTriggerEscape,\n      stableFocusIn,\n      stableFocusOut,\n      stableKeyDown,\n      stableMouseEnter,\n      stableMouseLeave,\n    ],\n  );\n\n  const ref: RefCallback<HTMLElement> = useCallback(\n    element => {\n      layer.ref(element);\n      interactionRef(element);\n    },\n    [interactionRef, layer],\n  );\n\n  useEffect(() => {\n    return () => clearTimeouts();\n  }, [clearTimeouts]);\n\n  return useMemo(\n    () => ({\n      anchorId: layer.anchorId,\n      clearTimeouts,\n      describedBy: layer.id,\n      hide: layer.hide,\n      interactionRef,\n      layer,\n      positionRef: layer.ref,\n      ref,\n      scheduleHide,\n      show: layer.show,\n      triggerRef,\n    }),\n    [clearTimeouts, interactionRef, layer, ref, scheduleHide],\n  );\n}\n"]}

package/dist/chunk-6UVJUY7Z.cjs

@@ -0,0 +1,142 @@
+'use strict';
+
+var chunkKXXRALHT_cjs = require('./chunk-KXXRALHT.cjs');
+var chunkJAX62FUE_cjs = require('./chunk-JAX62FUE.cjs');
+var chunkSPDVNY2Z_cjs = require('./chunk-SPDVNY2Z.cjs');
+var chunkAZDWQGAX_cjs = require('./chunk-AZDWQGAX.cjs');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/components/AvatarGroup/AvatarGroup.recipe.ts
+var avatarGroupRecipe = chunkJAX62FUE_cjs.cva({
+  base: {
+    display: "inline-flex",
+    alignItems: "center",
+    verticalAlign: "middle"
+  }
+});
+var OVERLAP_RATIO = 0.25;
+function AvatarGroup({
+  "aria-label": ariaLabel = "Avatars",
+  children,
+  className,
+  "data-testid": dataTestId,
+  ref,
+  size = "small",
+  style
+}) {
+  const numericSize = chunkKXXRALHT_cjs.resolveAvatarSize(size);
+  const overlap = Math.round(numericSize * OVERLAP_RATIO);
+  const contextValue = react.useMemo(
+    () => ({ numericSize, overlap, size }),
+    [numericSize, overlap, size]
+  );
+  const rootStyle = {
+    "--avatar-group-overlap": `${-overlap}px`,
+    ...style
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(chunkKXXRALHT_cjs.AvatarGroupContext, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "aria-label": ariaLabel,
+      className: chunkSPDVNY2Z_cjs.cx(avatarGroupRecipe(), className),
+      "data-testid": dataTestId,
+      ref,
+      role: "group",
+      style: rootStyle,
+      children
+    }
+  ) });
+}
+AvatarGroup.displayName = "AvatarGroup";
+var DEFAULT_SIZE = 36;
+var BORDER_WIDTH = 2;
+var OVERFLOW_FONT_RATIO = 0.35;
+var styles = {
+  root: chunkAZDWQGAX_cjs.css({
+    position: "relative",
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    borderRadius: "full",
+    borderWidth: `${BORDER_WIDTH}px`,
+    borderStyle: "solid",
+    borderColor: "bg",
+    boxSizing: "content-box",
+    bg: "bg.subtle",
+    color: "fg.muted",
+    fontFamily: "body",
+    fontWeight: "medium",
+    userSelect: "none",
+    "&:not(:first-child)": {
+      marginInlineStart: "var(--avatar-group-overlap)"
+    }
+  }),
+  button: chunkAZDWQGAX_cjs.css({
+    cursor: "pointer",
+    p: 0,
+    _focusVisible: {
+      outlineWidth: "focus",
+      outlineStyle: "solid",
+      outlineColor: "primary",
+      outlineOffset: "focusOffset"
+    }
+  })
+};
+function AvatarGroupOverflow({
+  children,
+  className,
+  count,
+  "data-testid": dataTestId,
+  onClick,
+  ref,
+  style
+}) {
+  const group = chunkKXXRALHT_cjs.useAvatarGroup();
+  if (count <= 0) {
+    return null;
+  }
+  const numericSize = group?.numericSize ?? DEFAULT_SIZE;
+  const label = `${count} more`;
+  const content = children ?? `+${count}`;
+  const rootStyle = {
+    width: numericSize,
+    height: numericSize,
+    fontSize: numericSize * OVERFLOW_FONT_RATIO,
+    ...style
+  };
+  if (onClick != null) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        "aria-label": label,
+        className: chunkSPDVNY2Z_cjs.cx(styles.root, styles.button, className),
+        "data-testid": dataTestId,
+        onClick,
+        ref,
+        style: rootStyle,
+        type: "button",
+        children: content
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      "aria-label": label,
+      className: chunkSPDVNY2Z_cjs.cx(styles.root, className),
+      "data-testid": dataTestId,
+      ref,
+      role: "img",
+      style: rootStyle,
+      children: content
+    }
+  );
+}
+AvatarGroupOverflow.displayName = "AvatarGroupOverflow";
+
+exports.AvatarGroup = AvatarGroup;
+exports.AvatarGroupOverflow = AvatarGroupOverflow;
+exports.avatarGroupRecipe = avatarGroupRecipe;
+//# sourceMappingURL=chunk-6UVJUY7Z.cjs.map
+//# sourceMappingURL=chunk-6UVJUY7Z.cjs.map

package/dist/chunk-6UVJUY7Z.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AvatarGroup/AvatarGroup.recipe.ts","../src/components/AvatarGroup/AvatarGroup.tsx","../src/components/AvatarGroup/AvatarGroupOverflow.tsx"],"names":["cva","resolveAvatarSize","useMemo","jsx","AvatarGroupContext","cx","css","useAvatarGroup"],"mappings":"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","file":"chunk-6UVJUY7Z.cjs","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 {cx} from '../../internal/cx';\nimport {resolveAvatarSize, type AvatarSize} from '../Avatar';\nimport {avatarGroupRecipe} from './AvatarGroup.recipe';\nimport {AvatarGroupContext} from './AvatarGroupContext';\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 {css} from 'styled-system/css';\nimport {cx} from '../../internal/cx';\nimport {useAvatarGroup} from './AvatarGroupContext';\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=\"img\"\n      style={rootStyle}>\n      {content}\n    </span>\n  );\n}\n\nAvatarGroupOverflow.displayName = 'AvatarGroupOverflow';\n"]}