silver-ui 0.1.0

package/dist/chunk-2PHHFBJ3.cjs

@@ -0,0 +1,102 @@
+'use strict';
+
+var chunk47BELFYO_cjs = require('./chunk-47BELFYO.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/EmptyState/EmptyState.recipe.ts
+var emptyStateRecipe = chunkJAX62FUE_cjs.cva({
+  base: {
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "center",
+    justifyContent: "center",
+    textAlign: "center",
+    gap: "4",
+    w: "full",
+    px: "6",
+    py: "8"
+  },
+  variants: {
+    isCompact: {
+      true: {
+        gap: "2",
+        px: "4",
+        py: "4"
+      },
+      false: {}
+    }
+  },
+  defaultVariants: {
+    isCompact: false
+  }
+});
+var styles = {
+  illustration: chunkAZDWQGAX_cjs.css({
+    display: "inline-flex",
+    color: "fg.muted",
+    w: "16",
+    h: "16",
+    "& > svg": {
+      w: "full",
+      h: "full"
+    }
+  }),
+  text: chunkAZDWQGAX_cjs.css({
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "center",
+    gap: "1",
+    maxW: "96"
+  }),
+  actions: chunkAZDWQGAX_cjs.css({
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    flexWrap: "wrap",
+    gap: "2",
+    mt: "1"
+  })
+};
+function EmptyState({
+  actions,
+  className,
+  "data-testid": dataTestId,
+  description,
+  headingLevel = 3,
+  illustration,
+  isCompact = false,
+  ref,
+  style,
+  title
+}) {
+  const headingId = react.useId();
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      "aria-labelledby": headingId,
+      className: chunkSPDVNY2Z_cjs.cx(emptyStateRecipe({ isCompact }), className),
+      "data-testid": dataTestId,
+      ref,
+      role: "region",
+      style,
+      children: [
+        illustration != null ? /* @__PURE__ */ jsxRuntime.jsx("div", { "aria-hidden": "true", className: styles.illustration, children: illustration }) : null,
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.text, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(chunk47BELFYO_cjs.Heading, { id: headingId, level: headingLevel, children: title }),
+          description != null ? /* @__PURE__ */ jsxRuntime.jsx(chunk47BELFYO_cjs.Text, { as: "p", color: "secondary", children: description }) : null
+        ] }),
+        actions != null ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.actions, children: actions }) : null
+      ]
+    }
+  );
+}
+EmptyState.displayName = "EmptyState";
+
+exports.EmptyState = EmptyState;
+exports.emptyStateRecipe = emptyStateRecipe;
+//# sourceMappingURL=chunk-2PHHFBJ3.cjs.map
+//# sourceMappingURL=chunk-2PHHFBJ3.cjs.map

package/dist/chunk-2PHHFBJ3.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/EmptyState/EmptyState.recipe.ts","../src/components/EmptyState/EmptyState.tsx"],"names":["cva","css","useId","jsxs","cx","jsx","Heading","Text"],"mappings":"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","file":"chunk-2PHHFBJ3.cjs","sourcesContent":["import {cva, type RecipeVariantProps} from 'styled-system/css';\n\nexport const emptyStateRecipe = cva({\n  base: {\n    display: 'flex',\n    flexDirection: 'column',\n    alignItems: 'center',\n    justifyContent: 'center',\n    textAlign: 'center',\n    gap: '4',\n    w: 'full',\n    px: '6',\n    py: '8',\n  },\n  variants: {\n    isCompact: {\n      true: {\n        gap: '2',\n        px: '4',\n        py: '4',\n      },\n      false: {},\n    },\n  },\n  defaultVariants: {\n    isCompact: false,\n  },\n});\n\nexport type EmptyStateVariants = RecipeVariantProps<typeof emptyStateRecipe>;\n","import {useId, type CSSProperties, type ReactNode, type Ref} from 'react';\nimport {css} from 'styled-system/css';\nimport {cx} from '../../internal/cx';\nimport {Heading, type HeadingLevel, Text} from '../Text';\nimport {emptyStateRecipe} from './EmptyState.recipe';\n\nexport interface EmptyStateProps {\n  /**\n   * Action controls rendered below the text.\n   */\n  actions?: ReactNode;\n  /**\n   * Additional CSS class names applied to the root element.\n   */\n  className?: string;\n  /**\n   * Test ID applied to the root element.\n   */\n  'data-testid'?: string;\n  /**\n   * Supporting text.\n   */\n  description?: string;\n  /**\n   * Semantic heading level for the title.\n   * @default 3\n   */\n  headingLevel?: HeadingLevel;\n  /**\n   * Decorative illustration or large icon rendered above the title.\n   */\n  illustration?: ReactNode;\n  /**\n   * Whether to use tighter spacing for constrained areas.\n   * @default false\n   */\n  isCompact?: boolean;\n  /**\n   * Ref forwarded to the root element.\n   */\n  ref?: Ref<HTMLDivElement>;\n  /**\n   * Inline styles applied to the root element.\n   */\n  style?: CSSProperties;\n  /**\n   * Primary empty-state message.\n   */\n  title: string;\n}\n\nconst styles = {\n  illustration: css({\n    display: 'inline-flex',\n    color: 'fg.muted',\n    w: '16',\n    h: '16',\n    '& > svg': {\n      w: 'full',\n      h: 'full',\n    },\n  }),\n  text: css({\n    display: 'flex',\n    flexDirection: 'column',\n    alignItems: 'center',\n    gap: '1',\n    maxW: '96',\n  }),\n  actions: css({\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    flexWrap: 'wrap',\n    gap: '2',\n    mt: '1',\n  }),\n} as const;\n\n/**\n * A placeholder for an empty data or content area.\n */\nexport function EmptyState({\n  actions,\n  className,\n  'data-testid': dataTestId,\n  description,\n  headingLevel = 3,\n  illustration,\n  isCompact = false,\n  ref,\n  style,\n  title,\n}: EmptyStateProps): React.JSX.Element {\n  const headingId = useId();\n\n  return (\n    <div\n      aria-labelledby={headingId}\n      className={cx(emptyStateRecipe({isCompact}), className)}\n      data-testid={dataTestId}\n      ref={ref}\n      role=\"region\"\n      style={style}>\n      {illustration != null ? (\n        <div aria-hidden=\"true\" className={styles.illustration}>\n          {illustration}\n        </div>\n      ) : null}\n      <div className={styles.text}>\n        <Heading id={headingId} level={headingLevel}>\n          {title}\n        </Heading>\n        {description != null ? (\n          <Text as=\"p\" color=\"secondary\">\n            {description}\n          </Text>\n        ) : null}\n      </div>\n      {actions != null ? <div className={styles.actions}>{actions}</div> : null}\n    </div>\n  );\n}\n\nEmptyState.displayName = 'EmptyState';\n"]}

package/dist/chunk-2QK2NZN5.js

@@ -0,0 +1,370 @@
+import { nowMonotonicMilliseconds } from './chunk-OX4ZMUF4.js';
+import { Button } from './chunk-VLIQPSPM.js';
+import { token } from './chunk-PZO5MZ46.js';
+import { useLayer, useIsomorphicLayoutEffect, cx } from './chunk-OKKL652L.js';
+import { css } from './chunk-UHQRL4OA.js';
+import { useRef, useEffect, useCallback, useMemo } from 'react';
+import { X } from 'lucide-react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+var FOCUSABLE_SELECTOR = 'button:not([disabled]), [href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"]):not([disabled])';
+function getFocusableElements(container) {
+  return Array.from(
+    container.querySelectorAll(FOCUSABLE_SELECTOR)
+  );
+}
+function focusFirstDescendant(container) {
+  getFocusableElements(container)[0]?.focus();
+}
+function focusLastDescendant(container) {
+  const elements = getFocusableElements(container);
+  elements.at(-1)?.focus();
+}
+function useFocusTrap({
+  isActive,
+  onEscape
+}) {
+  const containerRef = useRef(null);
+  const focusFirst = useCallback(() => {
+    if (containerRef.current != null) {
+      focusFirstDescendant(containerRef.current);
+    }
+  }, []);
+  useEffect(() => {
+    if (!isActive) {
+      return;
+    }
+    const handleKeyDown = (event) => {
+      const container = containerRef.current;
+      if (container == null) {
+        return;
+      }
+      if (event.key === "Escape") {
+        event.preventDefault();
+        onEscape?.();
+        return;
+      }
+      if (event.key !== "Tab") {
+        return;
+      }
+      const focusable = getFocusableElements(container);
+      if (focusable.length === 0) {
+        return;
+      }
+      const first = focusable[0];
+      const last = focusable.at(-1);
+      if (event.shiftKey && document.activeElement === first) {
+        event.preventDefault();
+        focusLastDescendant(container);
+      } else if (!event.shiftKey && document.activeElement === last) {
+        event.preventDefault();
+        focusFirstDescendant(container);
+      }
+    };
+    document.addEventListener("keydown", handleKeyDown);
+    return () => document.removeEventListener("keydown", handleKeyDown);
+  }, [isActive, onEscape]);
+  return { containerRef, focusFirst };
+}
+var styles = {
+  surface: css({
+    position: "relative",
+    bg: "bg",
+    borderRadius: "md",
+    boxShadow: "lg",
+    borderWidth: "default",
+    borderStyle: "solid",
+    borderColor: "border"
+  }),
+  closeButtonWrapper: css({
+    position: "absolute",
+    w: "1px",
+    h: "1px",
+    overflow: "hidden",
+    clipPath: "inset(50%)"
+  })
+};
+function usePopover({
+  onShow,
+  onHide,
+  hasLightDismiss = true,
+  hasAutoFocus = true,
+  hasSurface = true,
+  hasCloseButton = true,
+  closeButtonLabel = "Close popover",
+  label,
+  role = "dialog"
+} = {}) {
+  const skipAutoFocusRef = useRef(false);
+  const layer = useLayer({ hasLightDismiss, onShow, onHide });
+  const { containerRef: contentRef, focusFirst } = useFocusTrap({
+    isActive: layer.isOpen,
+    onEscape: layer.hide
+  });
+  useEffect(() => {
+    if (!layer.isOpen) {
+      skipAutoFocusRef.current = false;
+      return;
+    }
+    if (hasAutoFocus && !skipAutoFocusRef.current) {
+      requestAnimationFrame(() => focusFirst());
+    }
+  }, [focusFirst, hasAutoFocus, layer.isOpen]);
+  const show = useCallback(
+    (options) => {
+      skipAutoFocusRef.current = options?.isAutoFocusSkipped ?? false;
+      layer.show();
+    },
+    [layer]
+  );
+  const toggle = useCallback(() => {
+    if (layer.isOpen) {
+      layer.hide();
+      return;
+    }
+    show();
+  }, [layer, show]);
+  const render = useCallback(
+    (children, props) => {
+      return layer.render(
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            "aria-label": label,
+            className: hasSurface ? styles.surface : void 0,
+            ref: contentRef,
+            role,
+            children: [
+              children,
+              hasCloseButton ? /* @__PURE__ */ jsx("div", { className: styles.closeButtonWrapper, children: /* @__PURE__ */ jsx(
+                Button,
+                {
+                  icon: X,
+                  isIconOnly: true,
+                  label: closeButtonLabel,
+                  onClick: layer.hide,
+                  size: "sm",
+                  variant: "ghost"
+                }
+              ) }) : null
+            ]
+          }
+        ),
+        {
+          ...props,
+          className: props?.className
+        }
+      );
+    },
+    [
+      closeButtonLabel,
+      contentRef,
+      hasCloseButton,
+      hasSurface,
+      label,
+      layer,
+      role
+    ]
+  );
+  const triggerProps = useMemo(
+    () => ({
+      "aria-controls": layer.id,
+      "aria-expanded": layer.isOpen,
+      "aria-haspopup": role
+    }),
+    [layer.id, layer.isOpen, role]
+  );
+  return useMemo(
+    () => ({
+      anchorId: layer.anchorId,
+      contentRef,
+      hide: layer.hide,
+      id: layer.id,
+      isOpen: layer.isOpen,
+      render,
+      show,
+      toggle,
+      triggerProps,
+      triggerRef: layer.ref
+    }),
+    [
+      contentRef,
+      layer.anchorId,
+      layer.hide,
+      layer.id,
+      layer.isOpen,
+      layer.ref,
+      render,
+      show,
+      toggle,
+      triggerProps
+    ]
+  );
+}
+var BUTTON_SELECTOR = 'button, [role="button"]';
+var styles2 = {
+  anchor: css({
+    display: "inline-flex"
+  }),
+  content: css({}),
+  gap: {
+    above: css({ mb: "1" }),
+    below: css({ mt: "1" }),
+    start: css({ mr: "1" }),
+    end: css({ ml: "1" })
+  }
+};
+function findTriggerButton(element) {
+  if (element.matches(BUTTON_SELECTOR)) {
+    return element;
+  }
+  return element.querySelector(BUTTON_SELECTOR);
+}
+function Popover({
+  anchorRef,
+  children,
+  content,
+  placement = "below",
+  alignment = "start",
+  isOpen,
+  onOpenChange,
+  isEnabled = true,
+  width,
+  label,
+  hasCloseButton,
+  hasLightDismiss,
+  closeButtonLabel,
+  padding,
+  ref,
+  hasAutoFocus,
+  className,
+  style,
+  role,
+  "data-testid": dataTestId
+}) {
+  const wrapperRef = useRef(null);
+  const isControlled = isOpen !== void 0;
+  const lastHideTimeRef = useRef(0);
+  const popover = usePopover({
+    closeButtonLabel,
+    hasAutoFocus,
+    hasCloseButton,
+    hasLightDismiss,
+    label,
+    onHide: () => {
+      lastHideTimeRef.current = nowMonotonicMilliseconds();
+      onOpenChange?.(false);
+    },
+    onShow: () => onOpenChange?.(true),
+    role
+  });
+  const handleTriggerClick = useCallback(() => {
+    if (!isEnabled) {
+      return;
+    }
+    if (nowMonotonicMilliseconds() - lastHideTimeRef.current < 50) {
+      return;
+    }
+    popover.toggle();
+  }, [isEnabled, popover]);
+  const handleTriggerKeyDown = useCallback(
+    (event) => {
+      if (event.key === "Enter" || event.key === " ") {
+        event.preventDefault();
+        handleTriggerClick();
+      }
+    },
+    [handleTriggerClick]
+  );
+  const attachTrigger = useCallback(
+    (button) => {
+      button.setAttribute(
+        "aria-haspopup",
+        popover.triggerProps["aria-haspopup"]
+      );
+      button.setAttribute(
+        "aria-expanded",
+        String(popover.triggerProps["aria-expanded"])
+      );
+      button.setAttribute(
+        "aria-controls",
+        popover.triggerProps["aria-controls"]
+      );
+      button.addEventListener("click", handleTriggerClick);
+      const needsKeyDown = button.tagName !== "BUTTON" && button.getAttribute("role") === "button";
+      if (needsKeyDown) {
+        button.addEventListener("keydown", handleTriggerKeyDown);
+      }
+      return () => {
+        button.removeAttribute("aria-haspopup");
+        button.removeAttribute("aria-expanded");
+        button.removeAttribute("aria-controls");
+        button.removeEventListener("click", handleTriggerClick);
+        if (needsKeyDown) {
+          button.removeEventListener("keydown", handleTriggerKeyDown);
+        }
+      };
+    },
+    [handleTriggerClick, handleTriggerKeyDown, popover.triggerProps]
+  );
+  useIsomorphicLayoutEffect(() => {
+    const anchor = anchorRef?.current ?? wrapperRef.current;
+    if (anchor == null) {
+      return;
+    }
+    popover.triggerRef(anchor);
+    const trigger = findTriggerButton(anchor);
+    if (trigger == null || !isEnabled) {
+      return () => {
+        popover.triggerRef(null);
+      };
+    }
+    const detach = attachTrigger(trigger);
+    return () => {
+      popover.triggerRef(null);
+      detach();
+    };
+  }, [anchorRef, attachTrigger, isEnabled, popover]);
+  useIsomorphicLayoutEffect(() => {
+    if (!isControlled) {
+      return;
+    }
+    if (isOpen === true && !popover.isOpen) {
+      popover.show();
+    } else if (isOpen === false && popover.isOpen) {
+      popover.hide();
+    }
+  }, [isControlled, isOpen, popover]);
+  const widthStyle = width == null ? void 0 : { width: typeof width === "number" ? `${width}px` : width };
+  const paddingStyle = padding != null && padding !== "0" ? { padding: token(`spacing.${padding}`) } : void 0;
+  const popoverContent = popover.render(
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cx(styles2.content, className),
+        "data-testid": dataTestId,
+        ref,
+        style: { ...paddingStyle, ...widthStyle, ...style },
+        children: content
+      }
+    ),
+    {
+      placement,
+      alignment,
+      className: styles2.gap[placement],
+      style: { minWidth: "anchor-size(width)" }
+    }
+  );
+  if (anchorRef != null && children == null) {
+    return /* @__PURE__ */ jsx(Fragment, { children: popoverContent });
+  }
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { className: styles2.anchor, ref: wrapperRef, children }),
+    popoverContent
+  ] });
+}
+Popover.displayName = "Popover";
+
+export { Popover, usePopover };
+//# sourceMappingURL=chunk-2QK2NZN5.js.map
+//# sourceMappingURL=chunk-2QK2NZN5.js.map

package/dist/chunk-2QK2NZN5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/internal/useFocusTrap.ts","../src/components/Popover/usePopover.tsx","../src/components/Popover/Popover.tsx"],"names":["useRef","useEffect","useCallback","styles","jsx","jsxs"],"mappings":"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","file":"chunk-2QK2NZN5.js","sourcesContent":["import {useCallback, useEffect, useRef} from 'react';\n\nconst FOCUSABLE_SELECTOR =\n  'button:not([disabled]), [href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex=\"-1\"]):not([disabled])';\n\nexport interface UseFocusTrapOptions {\n  isActive: boolean;\n  onEscape?: () => void;\n}\n\nexport interface UseFocusTrapReturn<T extends HTMLElement = HTMLElement> {\n  containerRef: React.RefObject<T | null>;\n  focusFirst: () => void;\n}\n\nfunction getFocusableElements(container: HTMLElement): HTMLElement[] {\n  return Array.from(\n    container.querySelectorAll<HTMLElement>(FOCUSABLE_SELECTOR),\n  );\n}\n\nfunction focusFirstDescendant(container: HTMLElement): void {\n  getFocusableElements(container)[0]?.focus();\n}\n\nfunction focusLastDescendant(container: HTMLElement): void {\n  const elements = getFocusableElements(container);\n  elements.at(-1)?.focus();\n}\n\nexport function useFocusTrap<T extends HTMLElement = HTMLElement>({\n  isActive,\n  onEscape,\n}: UseFocusTrapOptions): UseFocusTrapReturn<T> {\n  const containerRef = useRef<T>(null);\n\n  const focusFirst = useCallback(() => {\n    if (containerRef.current != null) {\n      focusFirstDescendant(containerRef.current);\n    }\n  }, []);\n\n  useEffect(() => {\n    if (!isActive) {\n      return;\n    }\n\n    const handleKeyDown = (event: KeyboardEvent) => {\n      const container = containerRef.current;\n      if (container == null) {\n        return;\n      }\n\n      if (event.key === 'Escape') {\n        event.preventDefault();\n        onEscape?.();\n        return;\n      }\n\n      if (event.key !== 'Tab') {\n        return;\n      }\n\n      const focusable = getFocusableElements(container);\n      if (focusable.length === 0) {\n        return;\n      }\n\n      const first = focusable[0];\n      const last = focusable.at(-1);\n      if (event.shiftKey && document.activeElement === first) {\n        event.preventDefault();\n        focusLastDescendant(container);\n      } else if (!event.shiftKey && document.activeElement === last) {\n        event.preventDefault();\n        focusFirstDescendant(container);\n      }\n    };\n\n    document.addEventListener('keydown', handleKeyDown);\n    return () => document.removeEventListener('keydown', handleKeyDown);\n  }, [isActive, onEscape]);\n\n  return {containerRef, focusFirst};\n}\n","import {X} from 'lucide-react';\nimport {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  type ReactNode,\n  type RefCallback,\n} from 'react';\nimport {css} from 'styled-system/css';\nimport {useFocusTrap} from '../../internal/useFocusTrap';\nimport {useLayer, type ContextRenderProps} from '../../internal/useLayer';\nimport {Button} from '../Button';\n\nexport type {LayerAlignment, LayerPlacement} from '../../internal/useLayer';\n\nexport interface UsePopoverOptions {\n  closeButtonLabel?: string;\n  hasAutoFocus?: boolean;\n  hasCloseButton?: boolean;\n  hasLightDismiss?: boolean;\n  hasSurface?: boolean;\n  label?: string;\n  onHide?: () => void;\n  onShow?: () => void;\n  role?: 'dialog' | 'menu';\n}\n\nexport interface UsePopoverReturn {\n  anchorId: string;\n  contentRef: React.RefObject<HTMLDivElement | null>;\n  hide: () => void;\n  id: string;\n  isOpen: boolean;\n  render: (children: ReactNode, props?: ContextRenderProps) => ReactNode;\n  show: (options?: {isAutoFocusSkipped?: boolean}) => void;\n  toggle: () => void;\n  triggerProps: {\n    'aria-controls': string;\n    'aria-expanded': boolean;\n    'aria-haspopup': 'dialog' | 'menu';\n  };\n  triggerRef: RefCallback<HTMLElement>;\n}\n\nconst styles = {\n  surface: css({\n    position: 'relative',\n    bg: 'bg',\n    borderRadius: 'md',\n    boxShadow: 'lg',\n    borderWidth: 'default',\n    borderStyle: 'solid',\n    borderColor: 'border',\n  }),\n  closeButtonWrapper: css({\n    position: 'absolute',\n    w: '1px',\n    h: '1px',\n    overflow: 'hidden',\n    clipPath: 'inset(50%)',\n  }),\n} as const;\n\nexport function usePopover({\n  onShow,\n  onHide,\n  hasLightDismiss = true,\n  hasAutoFocus = true,\n  hasSurface = true,\n  hasCloseButton = true,\n  closeButtonLabel = 'Close popover',\n  label,\n  role = 'dialog',\n}: UsePopoverOptions = {}): UsePopoverReturn {\n  const skipAutoFocusRef = useRef(false);\n  const layer = useLayer({hasLightDismiss, onShow, onHide});\n  const {containerRef: contentRef, focusFirst} = useFocusTrap<HTMLDivElement>({\n    isActive: layer.isOpen,\n    onEscape: layer.hide,\n  });\n\n  useEffect(() => {\n    if (!layer.isOpen) {\n      skipAutoFocusRef.current = false;\n      return;\n    }\n\n    if (hasAutoFocus && !skipAutoFocusRef.current) {\n      requestAnimationFrame(() => focusFirst());\n    }\n  }, [focusFirst, hasAutoFocus, layer.isOpen]);\n\n  const show = useCallback(\n    (options?: {isAutoFocusSkipped?: boolean}) => {\n      skipAutoFocusRef.current = options?.isAutoFocusSkipped ?? false;\n      layer.show();\n    },\n    [layer],\n  );\n\n  const toggle = useCallback(() => {\n    if (layer.isOpen) {\n      layer.hide();\n      return;\n    }\n\n    show();\n  }, [layer, show]);\n\n  const render = useCallback(\n    (children: ReactNode, props?: ContextRenderProps): ReactNode => {\n      return layer.render(\n        <div\n          aria-label={label}\n          className={hasSurface ? styles.surface : undefined}\n          ref={contentRef}\n          role={role}>\n          {children}\n          {hasCloseButton ? (\n            <div className={styles.closeButtonWrapper}>\n              <Button\n                icon={X}\n                isIconOnly\n                label={closeButtonLabel}\n                onClick={layer.hide}\n                size=\"sm\"\n                variant=\"ghost\"\n              />\n            </div>\n          ) : null}\n        </div>,\n        {\n          ...props,\n          className: props?.className,\n        },\n      );\n    },\n    [\n      closeButtonLabel,\n      contentRef,\n      hasCloseButton,\n      hasSurface,\n      label,\n      layer,\n      role,\n    ],\n  );\n\n  const triggerProps = useMemo(\n    () => ({\n      'aria-controls': layer.id,\n      'aria-expanded': layer.isOpen,\n      'aria-haspopup': role,\n    }),\n    [layer.id, layer.isOpen, role],\n  );\n\n  return useMemo(\n    () => ({\n      anchorId: layer.anchorId,\n      contentRef,\n      hide: layer.hide,\n      id: layer.id,\n      isOpen: layer.isOpen,\n      render,\n      show,\n      toggle,\n      triggerProps,\n      triggerRef: layer.ref,\n    }),\n    [\n      contentRef,\n      layer.anchorId,\n      layer.hide,\n      layer.id,\n      layer.isOpen,\n      layer.ref,\n      render,\n      show,\n      toggle,\n      triggerProps,\n    ],\n  );\n}\n","import {\n  useCallback,\n  useRef,\n  type CSSProperties,\n  type ReactNode,\n  type Ref,\n  type RefObject,\n} from 'react';\nimport {css, cx} from 'styled-system/css';\nimport type {SpacingToken} from 'styled-system/tokens';\nimport {token} from 'styled-system/tokens';\nimport {nowMonotonicMilliseconds} from '../../internal/time';\nimport {useIsomorphicLayoutEffect} from '../../internal/useIsomorphicLayoutEffect';\nimport type {LayerAlignment, LayerPlacement} from '../../internal/useLayer';\nimport {usePopover} from './usePopover';\n\nexport interface PopoverProps {\n  /**\n   * Alignment along the placement axis.\n   * @default 'start'\n   */\n  alignment?: LayerAlignment;\n  /**\n   * External trigger element. When provided without children, Popover attaches\n   * click and ARIA behavior directly to this element.\n   */\n  anchorRef?: RefObject<HTMLElement | null>;\n  /**\n   * Trigger content. Must contain a `<button>` or `[role=\"button\"]`.\n   */\n  children?: ReactNode;\n  /**\n   * Additional CSS class names applied to the popover content.\n   */\n  className?: string;\n  /**\n   * Label for the hidden close button.\n   * @default 'Close popover'\n   */\n  closeButtonLabel?: string;\n  /**\n   * Content displayed inside the popover dialog.\n   */\n  content: ReactNode;\n  /**\n   * Test ID applied to the popover content.\n   */\n  'data-testid'?: string;\n  /**\n   * Whether to focus the first focusable item after opening.\n   * @default true\n   */\n  hasAutoFocus?: boolean;\n  /**\n   * Whether to include a keyboard-accessible close button.\n   * @default true\n   */\n  hasCloseButton?: boolean;\n  /**\n   * Whether clicking outside closes the popover.\n   * @default true\n   */\n  hasLightDismiss?: boolean;\n  /**\n   * Whether trigger interactions open the popover.\n   * @default true\n   */\n  isEnabled?: boolean;\n  /**\n   * Controlled open state.\n   */\n  isOpen?: boolean;\n  /**\n   * Accessible label for the popover dialog.\n   */\n  label?: string;\n  /**\n   * Callback fired when open state changes.\n   */\n  onOpenChange?: (isOpen: boolean) => void;\n  /**\n   * Inner padding of the popover content.\n   * @default 0\n   */\n  padding?: SpacingToken;\n  /**\n   * Position relative to the trigger.\n   * @default 'below'\n   */\n  placement?: LayerPlacement;\n  /**\n   * Ref forwarded to the popover content element.\n   */\n  ref?: Ref<HTMLDivElement>;\n  /**\n   * ARIA role for the floating content.\n   * @default 'dialog'\n   */\n  role?: 'dialog' | 'menu';\n  /**\n   * Inline styles applied to the popover content.\n   */\n  style?: CSSProperties;\n  /**\n   * Width of the popover content.\n   */\n  width?: number | string;\n}\n\nconst BUTTON_SELECTOR = 'button, [role=\"button\"]';\n\nconst styles = {\n  anchor: css({\n    display: 'inline-flex',\n  }),\n  content: css({}),\n  gap: {\n    above: css({mb: '1'}),\n    below: css({mt: '1'}),\n    start: css({mr: '1'}),\n    end: css({ml: '1'}),\n  },\n} as const;\n\nfunction findTriggerButton(element: HTMLElement): HTMLElement | null {\n  if (element.matches(BUTTON_SELECTOR)) {\n    return element;\n  }\n\n  return element.querySelector<HTMLElement>(BUTTON_SELECTOR);\n}\n\n/**\n * A click-triggered floating dialog anchored to a trigger element.\n */\nexport function Popover({\n  anchorRef,\n  children,\n  content,\n  placement = 'below',\n  alignment = 'start',\n  isOpen,\n  onOpenChange,\n  isEnabled = true,\n  width,\n  label,\n  hasCloseButton,\n  hasLightDismiss,\n  closeButtonLabel,\n  padding,\n  ref,\n  hasAutoFocus,\n  className,\n  style,\n  role,\n  'data-testid': dataTestId,\n}: PopoverProps): React.JSX.Element {\n  const wrapperRef = useRef<HTMLDivElement>(null);\n  const isControlled = isOpen !== undefined;\n  const lastHideTimeRef = useRef(0);\n\n  const popover = usePopover({\n    closeButtonLabel,\n    hasAutoFocus,\n    hasCloseButton,\n    hasLightDismiss,\n    label,\n    onHide: () => {\n      lastHideTimeRef.current = nowMonotonicMilliseconds();\n      onOpenChange?.(false);\n    },\n    onShow: () => onOpenChange?.(true),\n    role,\n  });\n\n  const handleTriggerClick = useCallback(() => {\n    if (!isEnabled) {\n      return;\n    }\n\n    if (nowMonotonicMilliseconds() - lastHideTimeRef.current < 50) {\n      return;\n    }\n\n    popover.toggle();\n  }, [isEnabled, popover]);\n\n  const handleTriggerKeyDown = useCallback(\n    (event: KeyboardEvent) => {\n      if (event.key === 'Enter' || event.key === ' ') {\n        event.preventDefault();\n        handleTriggerClick();\n      }\n    },\n    [handleTriggerClick],\n  );\n\n  const attachTrigger = useCallback(\n    (button: HTMLElement) => {\n      button.setAttribute(\n        'aria-haspopup',\n        popover.triggerProps['aria-haspopup'],\n      );\n      button.setAttribute(\n        'aria-expanded',\n        String(popover.triggerProps['aria-expanded']),\n      );\n      button.setAttribute(\n        'aria-controls',\n        popover.triggerProps['aria-controls'],\n      );\n      button.addEventListener('click', handleTriggerClick);\n\n      const needsKeyDown =\n        button.tagName !== 'BUTTON' && button.getAttribute('role') === 'button';\n      if (needsKeyDown) {\n        button.addEventListener('keydown', handleTriggerKeyDown);\n      }\n\n      return () => {\n        button.removeAttribute('aria-haspopup');\n        button.removeAttribute('aria-expanded');\n        button.removeAttribute('aria-controls');\n        button.removeEventListener('click', handleTriggerClick);\n        if (needsKeyDown) {\n          button.removeEventListener('keydown', handleTriggerKeyDown);\n        }\n      };\n    },\n    [handleTriggerClick, handleTriggerKeyDown, popover.triggerProps],\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    const anchor = anchorRef?.current ?? wrapperRef.current;\n    if (anchor == null) {\n      return;\n    }\n\n    popover.triggerRef(anchor);\n    const trigger = findTriggerButton(anchor);\n    if (trigger == null || !isEnabled) {\n      return () => {\n        popover.triggerRef(null);\n      };\n    }\n\n    const detach = attachTrigger(trigger);\n    return () => {\n      popover.triggerRef(null);\n      detach();\n    };\n  }, [anchorRef, attachTrigger, isEnabled, popover]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (!isControlled) {\n      return;\n    }\n\n    if (isOpen === true && !popover.isOpen) {\n      popover.show();\n    } else if (isOpen === false && popover.isOpen) {\n      popover.hide();\n    }\n  }, [isControlled, isOpen, popover]);\n\n  const widthStyle =\n    width == null\n      ? undefined\n      : {width: typeof width === 'number' ? `${width}px` : width};\n\n  const paddingStyle =\n    padding != null && padding !== '0'\n      ? {padding: token(`spacing.${padding}`)}\n      : undefined;\n\n  const popoverContent = popover.render(\n    <div\n      className={cx(styles.content, className)}\n      data-testid={dataTestId}\n      ref={ref}\n      style={{...paddingStyle, ...widthStyle, ...style}}>\n      {content}\n    </div>,\n    {\n      placement,\n      alignment,\n      className: styles.gap[placement],\n      style: {minWidth: 'anchor-size(width)'},\n    },\n  );\n\n  if (anchorRef != null && children == null) {\n    return <>{popoverContent}</>;\n  }\n\n  return (\n    <>\n      <div className={styles.anchor} ref={wrapperRef}>\n        {children}\n      </div>\n      {popoverContent}\n    </>\n  );\n}\n\nPopover.displayName = 'Popover';\n"]}

package/dist/chunk-2QM5XBX4.cjs

@@ -0,0 +1,32 @@
+'use strict';
+
+var chunkSPDVNY2Z_cjs = require('./chunk-SPDVNY2Z.cjs');
+var chunkAZDWQGAX_cjs = require('./chunk-AZDWQGAX.cjs');
+var jsxRuntime = require('react/jsx-runtime');
+
+var styles = {
+  root: chunkAZDWQGAX_cjs.css({
+    position: "absolute",
+    w: "1px",
+    h: "1px",
+    p: 0,
+    m: "-1px",
+    overflow: "hidden",
+    clipPath: "inset(50%)",
+    whiteSpace: "nowrap",
+    borderWidth: 0
+  })
+};
+function VisuallyHidden({
+  children,
+  className,
+  ref,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: chunkSPDVNY2Z_cjs.cx(styles.root, className), ref, ...props, children });
+}
+VisuallyHidden.displayName = "VisuallyHidden";
+
+exports.VisuallyHidden = VisuallyHidden;
+//# sourceMappingURL=chunk-2QM5XBX4.cjs.map
+//# sourceMappingURL=chunk-2QM5XBX4.cjs.map

package/dist/chunk-2QM5XBX4.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/internal/VisuallyHidden.tsx"],"names":["css","jsx","cx"],"mappings":";;;;;;AAYA,IAAM,MAAA,GAAS;AAAA,EACb,MAAMA,qBAAA,CAAI;AAAA,IACR,QAAA,EAAU,UAAA;AAAA,IACV,CAAA,EAAG,KAAA;AAAA,IACH,CAAA,EAAG,KAAA;AAAA,IACH,CAAA,EAAG,CAAA;AAAA,IACH,CAAA,EAAG,MAAA;AAAA,IACH,QAAA,EAAU,QAAA;AAAA,IACV,QAAA,EAAU,YAAA;AAAA,IACV,UAAA,EAAY,QAAA;AAAA,IACZ,WAAA,EAAa;AAAA,GACd;AACH,CAAA;AAEO,SAAS,cAAA,CAAe;AAAA,EAC7B,QAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAqC;AACnC,EAAA,uBACEC,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAWC,oBAAA,CAAG,MAAA,CAAO,IAAA,EAAM,SAAS,CAAA,EAAG,GAAA,EAAW,GAAG,KAAA,EACxD,QAAA,EACH,CAAA;AAEJ;AAEA,cAAA,CAAe,WAAA,GAAc,gBAAA","file":"chunk-2QM5XBX4.cjs","sourcesContent":["import type {ComponentPropsWithoutRef, JSX, ReactNode, Ref} from 'react';\nimport {css} from 'styled-system/css';\nimport {cx} from './cx';\n\nexport interface VisuallyHiddenProps extends Omit<\n  ComponentPropsWithoutRef<'span'>,\n  'ref'\n> {\n  children?: ReactNode;\n  ref?: Ref<HTMLSpanElement>;\n}\n\nconst styles = {\n  root: css({\n    position: 'absolute',\n    w: '1px',\n    h: '1px',\n    p: 0,\n    m: '-1px',\n    overflow: 'hidden',\n    clipPath: 'inset(50%)',\n    whiteSpace: 'nowrap',\n    borderWidth: 0,\n  }),\n};\n\nexport function VisuallyHidden({\n  children,\n  className,\n  ref,\n  ...props\n}: VisuallyHiddenProps): JSX.Element {\n  return (\n    <span className={cx(styles.root, className)} ref={ref} {...props}>\n      {children}\n    </span>\n  );\n}\n\nVisuallyHidden.displayName = 'VisuallyHidden';\n"]}