@mortenbrudvik/waveui 0.10.0 → 0.12.0

package/dist/components/overlays/Tooltip.mjs

@@ -10,26 +10,26 @@ import { FOCUSABLE_SELECTOR as c, getFirstTabbable as l } from "../../lib/focus.
 import { useMergedRefs as u } from "../../hooks/useMergedRefs.mjs";
 import { useIsClient as d } from "../../hooks/useIsClient.mjs";
 import { joinIds as f } from "../../lib/aria.mjs";
-import { useDismiss as p } from "../../hooks/useDismiss.mjs";
-import { Portal as ee } from "../portal/Portal.mjs";
-import { usePopupPosition as te } from "../../hooks/usePopupPosition.mjs";
-import { STATE_ARIA as ne, isCloneableElement as re, renderTrigger as ie, unwrapFragment as ae } from "../../lib/renderTrigger.mjs";
-import * as m from "react";
-import { jsx as h, jsxs as g } from "react/jsx-runtime";
+import { resolvePositioning as p, usePopupPosition as ee } from "../../hooks/usePopupPosition.mjs";
+import { useDismiss as te } from "../../hooks/useDismiss.mjs";
+import { Portal as ne } from "../portal/Portal.mjs";
+import { STATE_ARIA as re, isCloneableElement as ie, renderTrigger as ae, unwrapFragment as m } from "../../lib/renderTrigger.mjs";
+import * as h from "react";
+import { jsx as g, jsxs as oe } from "react/jsx-runtime";
 //#region src/components/overlays/Tooltip.tsx
-var oe = {
+var se = {
 	dark: "inverted",
 	light: "normal"
-}, se = {
+}, ce = {
 	inverted: "border border-inverted-border bg-inverted text-inverted-foreground",
 	normal: "border border-border bg-background text-foreground"
-}, ce = `max-w-60 whitespace-normal break-words rounded px-3 py-1.5 text-caption-1 font-normal normal-case tracking-normal text-start shadow-8 ${[
+}, le = `max-w-60 whitespace-normal break-words rounded px-3 py-1.5 text-caption-1 font-normal normal-case tracking-normal text-start shadow-8 ${[
 	"before:absolute",
 	"data-[side=top]:before:inset-x-0 data-[side=top]:before:top-full data-[side=top]:before:h-2",
 	"data-[side=bottom]:before:inset-x-0 data-[side=bottom]:before:bottom-full data-[side=bottom]:before:h-2",
 	"data-[side=left]:before:inset-y-0 data-[side=left]:before:left-full data-[side=left]:before:w-2",
 	"data-[side=right]:before:inset-y-0 data-[side=right]:before:right-full data-[side=right]:before:w-2"
-].join(" ")}`, _ = /^on[A-Z]/, le = ["aria-label", "aria-labelledby"];
+].join(" ")}`, _ = /^on[A-Z]/, ue = ["aria-label", "aria-labelledby"];
 function v(e) {
 	return e.currentTarget.contains(e.target);
 }
@@ -38,7 +38,7 @@ function y(e) {
 		v(t) && e(t);
 	};
 }
-function ue(e) {
+function de(e) {
 	let t = {}, n = {};
 	for (let [r, i] of Object.entries(e)) r === "id" || r.startsWith("aria-") ? t[r] = i : n[r] = _.test(r) && typeof i == "function" ? y(i) : i;
 	return {
@@ -46,7 +46,7 @@ function ue(e) {
 		wrapperProps: n
 	};
 }
-function de(e, t) {
+function fe(e, t) {
 	let n = { ...e };
 	for (let e of t) delete n[e];
 	return n;
@@ -58,9 +58,9 @@ function x(e, t, n) {
 	let r = (e.getAttribute(t) ?? "").split(/\s+/).filter((e) => e && e !== n);
 	r.length > 0 ? e.setAttribute(t, r.join(" ")) : e.removeAttribute(t);
 }
-function fe(e, t, r, i) {
-	let a = m.useRef(null), o = r === "label" ? "aria-labelledby" : "aria-describedby";
-	m.useLayoutEffect(() => {
+function pe(e, t, r, i) {
+	let a = h.useRef(null), o = r === "label" ? "aria-labelledby" : "aria-describedby";
+	h.useLayoutEffect(() => {
 		let r = e.current;
 		if (!r) return;
 		let s = () => {
@@ -80,74 +80,74 @@ function fe(e, t, r, i) {
 		}), () => u.disconnect();
 	});
 }
-var S = ({ content: n, appearance: c, variant: l, openDelay: _, closeDelay: b = 100, delay: x, open: S, defaultOpen: pe, onOpenChange: me, relationship: C = "description", side: w = "top", align: T = "center", children: E, className: D, onMouseEnter: O, onMouseLeave: k, onFocus: A, onBlur: j, ref: M, ...N }) => {
-	let P = t("Tooltip", c, l === void 0 ? void 0 : oe[l], "variant", "appearance") ?? "inverted", F = t("Tooltip", _, x, "delay", "openDelay") ?? 200, [I, L] = o(S, pe ?? !1, me), R = d(), z = I && R, B = m.useRef(void 0), V = m.useRef(null), H = m.useRef(null), U = s("tooltip"), { setReference: he, setFloating: ge, floatingProps: _e } = te({
+var S = ({ content: n, appearance: c, variant: l, openDelay: _, closeDelay: b = 100, delay: x, open: S, defaultOpen: me, onOpenChange: he, relationship: C = "description", side: w = "top", align: T = "center", positioning: E, children: D, className: O, onMouseEnter: k, onMouseLeave: A, onFocus: j, onBlur: M, ref: N, ...P }) => {
+	let F = t("Tooltip", c, l === void 0 ? void 0 : se[l], "variant", "appearance") ?? "inverted", I = t("Tooltip", _, x, "delay", "openDelay") ?? 200, [L, R] = o(S, me ?? !1, he), ge = d(), z = L && ge, B = h.useRef(void 0), V = h.useRef(null), H = h.useRef(null), U = s("tooltip"), { setReference: _e, setFloating: ve, floatingProps: ye } = ee({
 		open: z,
 		side: w,
 		align: T,
-		offset: 8
-	}), ve = u(M, V, he), ye = u(H, ge), W = a(() => {
+		...p(E, { offset: 8 })
+	}), be = u(N, V, _e), xe = u(H, ve), W = a(() => {
 		B.current !== void 0 && (clearTimeout(B.current), B.current = void 0);
 	}), G = a(() => {
 		if (W(), !z) {
-			if (F <= 0) {
-				L(!0);
+			if (I <= 0) {
+				R(!0);
 				return;
 			}
 			B.current = setTimeout(() => {
-				B.current = void 0, L(!0);
-			}, F);
+				B.current = void 0, R(!0);
+			}, I);
 		}
 	}), K = a(() => {
-		W(), L(!1);
-	}), q = a(() => {
+		W(), R(!1);
+	}), Se = a(() => {
 		W(), z && (B.current = setTimeout(() => {
-			B.current = void 0, L(!1);
+			B.current = void 0, R(!1);
 		}, b));
 	});
-	p({
+	te({
 		open: z,
 		onDismiss: K,
 		refs: [V, H],
 		anchorRef: V,
 		kind: "tooltip",
 		outsidePress: !1
-	}), m.useEffect(() => {
+	}), h.useEffect(() => {
 		let e = B;
 		return () => clearTimeout(e.current);
 	}, []);
-	let be = a((e) => {
+	let q = a((e) => {
 		(v(e) || H.current?.contains(e.target)) && G();
-	}), xe = a((e) => {
+	}), Ce = a((e) => {
 		!v(e) && !H.current?.contains(e.target) && K();
-	}), { childProps: J, wrapperProps: Y } = ue(N), X = ae(E), Z = !re(X), Q = C === "label" ? "aria-labelledby" : "aria-describedby", $ = Z ? de(J, [...ne, ...le]) : { ...J };
+	}), { childProps: J, wrapperProps: Y } = de(P), X = m(D), Z = !ie(X), Q = C === "label" ? "aria-labelledby" : "aria-describedby", $ = Z ? fe(J, [...re, ...ue]) : { ...J };
 	(!Z || C === "description") && ($[Q] = f(J[Q], U));
-	let Se = ie(X, $, { componentName: "Tooltip" });
-	return fe(V, U, C, Z), /* @__PURE__ */ g("span", {
-		ref: ve,
+	let we = ae(X, $, { componentName: "Tooltip" });
+	return pe(V, U, C, Z), /* @__PURE__ */ oe("span", {
+		ref: be,
 		...Y,
-		className: e(i.root, "inline-block", D),
-		onMouseEnter: r(O, be),
-		onMouseLeave: r(k, q),
-		onMouseOver: r(Y.onMouseOver, xe),
-		onFocus: y(r(A, G)),
-		onBlur: y(r(j, K)),
+		className: e(i.root, "inline-block", O),
+		onMouseEnter: r(k, q),
+		onMouseLeave: r(A, Se),
+		onMouseOver: r(Y.onMouseOver, Ce),
+		onFocus: y(r(j, G)),
+		onBlur: y(r(M, K)),
 		children: [
-			Se,
-			/* @__PURE__ */ h("span", {
+			we,
+			/* @__PURE__ */ g("span", {
 				id: U,
 				role: "tooltip",
 				hidden: !0,
 				children: n
 			}),
-			z && /* @__PURE__ */ h(ee, {
+			z && /* @__PURE__ */ g(ne, {
 				layer: "tooltip",
-				children: /* @__PURE__ */ h("span", {
-					ref: ye,
+				children: /* @__PURE__ */ g("span", {
+					ref: xe,
 					"aria-hidden": "true",
 					"data-wave-tooltip-surface": "",
-					..._e,
-					className: e(i.content, ce, se[P]),
+					...ye,
+					className: e(i.content, le, ce[F]),
 					children: n
 				})
 			})

package/dist/components/overlays/Tooltip.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.mjs","names":["useId","useId$1","React","VARIANT_APPEARANCE","appearanceClasses","surfaceClasses","HANDLER_KEY","NAMING_ARIA","isOwnEvent","event","ownEventsOnly","handler","splitProps","childProps","wrapperProps","key","value","props","omit","result","keys","hasIdRef","el","attribute","id","removeIdRef","rest","useRelationshipTarget","appliedRef","relationship","wrapper","wrapperRef","update","applied","target","tooltipId","FOCUSABLE_SELECTOR","getFirstTabbable","joinIds","childIsFallback","warnOnce","observer","Tooltip","appearanceProp","openDelayProp","openProp","appearance","resolveDeprecatedProp","variant","openDelay","delay","open","setOpen","useControllable","defaultOpen","onOpenChange","isClient","useIsClient","visible","timerRef","surfaceRef","usePopupPosition","wrapperElementRef","useMergedRefs","ref","setReference","surfaceElementRef","setFloating","clearTimer","useEventCallback","show","hide","scheduleHide","closeDelay","useDismiss","timer","showOnEnter","hideOverPortaledPopup","unwrapFragment","children","isCloneableElement","triggerProps","STATE_ARIA","child","renderTrigger","cn","tooltipClassNames","className","composeEventHandlers","onMouseEnter","onMouseLeave","onFocus","onBlur","content","Portal","floatingProps"],"sources":["../../../src/components/overlays/Tooltip.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cn } from '../../lib/cn';\nimport { joinIds } from '../../lib/aria';\nimport { tooltipClassNames } from '../../lib/classNames';\nimport { resolveDeprecatedProp, warnOnce } from '../../lib/dev';\nimport { composeEventHandlers } from '../../lib/composeEventHandlers';\nimport { FOCUSABLE_SELECTOR, getFirstTabbable } from '../../lib/focus';\nimport {\n  isCloneableElement,\n  renderTrigger,\n  STATE_ARIA,\n  unwrapFragment,\n} from '../../lib/renderTrigger';\nimport type { PopupAlign, PopupSide } from '../../lib/types';\nimport { useControllable } from '../../hooks/useControllable';\nimport { useId } from '../../hooks/useId';\nimport { useIsClient } from '../../hooks/useIsClient';\nimport { useDismiss } from '../../hooks/useDismiss';\nimport { usePopupPosition } from '../../hooks/usePopupPosition';\nimport { useMergedRefs } from '../../hooks/useMergedRefs';\nimport { useEventCallback } from '../../hooks/useEventCallback';\nimport { Portal } from '../portal/Portal';\n\n/** Color treatment of a tooltip (`TooltipProps.appearance`). */\nexport type TooltipAppearance = 'inverted' | 'normal';\n\n/** Properties for the Tooltip component. */\nexport interface TooltipProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'content'> {\n  /** Content to display inside the tooltip (short, non-interactive text). */\n  content: React.ReactNode;\n  /**\n   * Color treatment: `inverted` (dark surface in the light theme) or `normal` (the page\n   * background with a border).\n   * @default 'inverted'\n   */\n  appearance?: TooltipAppearance;\n  /**\n   * @deprecated Use `appearance` (`'dark'` → `'inverted'`, `'light'` → `'normal'`).\n   */\n  variant?: 'dark' | 'light';\n  /**\n   * Milliseconds before the tooltip appears when the pointer rests on the child or the child\n   * receives keyboard focus (Fluent's `showDelay`; unlike Menu's and Popover's `openDelay`, it\n   * applies to focus too).\n   * @default 200\n   */\n  openDelay?: number;\n  /**\n   * Milliseconds before it hides once the pointer has left the child and the tooltip (Fluent's\n   * `hideDelay`); blur and Escape hide it at once.\n   * @default 100\n   */\n  closeDelay?: number;\n  /** @deprecated Use `openDelay`. */\n  delay?: number;\n  /**\n   * Controlled open state (Fluent's `visible`). The tooltip still asks to open on hover and focus\n   * (after `openDelay`) and to close on leave, blur and Escape through `onOpenChange`. The surface\n   * renders only in the browser: an open tooltip is closed in the server HTML and opens once it\n   * has hydrated.\n   */\n  open?: boolean;\n  /**\n   * Initial open state for uncontrolled usage.\n   * @default false\n   */\n  defaultOpen?: boolean;\n  /**\n   * Called with the new open state when it changes (Fluent's `onVisibleChange`). It has no\n   * `details` argument yet.\n   */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * How the tooltip relates to its child: `description` adds it to the child's\n   * `aria-describedby`; `label` adds it to the child's `aria-labelledby`, naming an icon-only\n   * button.\n   * @default 'description'\n   */\n  relationship?: 'description' | 'label';\n  /**\n   * Side of the target the tooltip opens on. `start`/`end` follow the writing direction; the\n   * tooltip flips to the opposite side when there is not enough room.\n   * @default 'top'\n   */\n  side?: PopupSide;\n  /** Alignment along the target's edge.\n   * @default 'center'\n   */\n  align?: PopupAlign;\n  /**\n   * A single element that triggers the tooltip on hover and focus: it receives the\n   * `aria-describedby`/`aria-labelledby`, plus any `id` and `aria-*` props given to the Tooltip\n   * (a Fragment around one element counts as that element). Other children are wrapped in a\n   * described `<span>` with a development warning, and their first focusable element gets the\n   * relationship.\n   */\n  children: React.ReactElement;\n  /** Ref to the wrapper `<span>` (the positioning anchor). */\n  ref?: React.Ref<HTMLSpanElement>;\n}\n\nconst VARIANT_APPEARANCE: Record<'dark' | 'light', TooltipAppearance> = {\n  dark: 'inverted',\n  light: 'normal',\n};\n\nconst appearanceClasses: Record<TooltipAppearance, string> = {\n  inverted: 'border border-inverted-border bg-inverted text-inverted-foreground',\n  normal: 'border border-border bg-background text-foreground',\n};\n\n/**\n * Transparent `::before` hover bridge across the 8px gap (the positioning offset) on the side that\n * faces the trigger only, so the pointer can move onto the tooltip; the other sides get no bridge,\n * which would otherwise catch hovers and clicks meant for neighbouring controls.\n */\nconst bridgeClasses = [\n  'before:absolute',\n  // Tooltip above the trigger: a strip below it.\n  'data-[side=top]:before:inset-x-0 data-[side=top]:before:top-full data-[side=top]:before:h-2',\n  // Tooltip below the trigger: a strip above it.\n  'data-[side=bottom]:before:inset-x-0 data-[side=bottom]:before:bottom-full data-[side=bottom]:before:h-2',\n  // wave-allow-physical: data-side is the physical side resolved by the positioning\n  'data-[side=left]:before:inset-y-0 data-[side=left]:before:left-full data-[side=left]:before:w-2',\n  // wave-allow-physical: data-side is the physical side resolved by the positioning\n  'data-[side=right]:before:inset-y-0 data-[side=right]:before:right-full data-[side=right]:before:w-2',\n].join(' ');\n\n/**\n * The visual surface: wrapping text, typography reset against the host (header cells, muted\n * panels), and the hover bridge towards the trigger.\n */\nconst surfaceClasses = `max-w-60 whitespace-normal break-words rounded px-3 py-1.5 text-caption-1 font-normal normal-case tracking-normal text-start shadow-8 ${bridgeClasses}`;\n\ntype UnknownProps = Record<string, unknown>;\ntype Relationship = NonNullable<TooltipProps['relationship']>;\n\nconst HANDLER_KEY = /^on[A-Z]/;\n\n/** Naming attributes a generic element such as the fallback `<span>` must not carry. */\nconst NAMING_ARIA = ['aria-label', 'aria-labelledby'] as const;\n\n/**\n * Whether an event reached the wrapper from its own DOM subtree — the child — rather than through\n * a portal: React bubbles events from portaled content (the tooltip surface, a popup the child\n * renders in a portal) through the component tree.\n */\nfunction isOwnEvent(event: React.SyntheticEvent): boolean {\n  return (event.currentTarget as Node).contains(event.target as Node);\n}\n\n/** `handler`, called only for the wrapper's own events (see {@link isOwnEvent}). */\nfunction ownEventsOnly<E extends React.SyntheticEvent>(\n  handler: (event: E) => void,\n): (event: E) => void {\n  return (event) => {\n    if (isOwnEvent(event)) handler(event);\n  };\n}\n\n/**\n * Splits the props the Tooltip receives, from its consumer or from a parent that clones its child\n * (Menu.Trigger, Popover.Trigger, Dialog.Trigger, Field): `id` and `aria-*` describe the element\n * the Tooltip is attached to, so they go to the child; the rest stays on the wrapper `<span>`.\n */\nfunction splitProps(props: UnknownProps): { childProps: UnknownProps; wrapperProps: UnknownProps } {\n  const childProps: UnknownProps = {};\n  const wrapperProps: UnknownProps = {};\n  for (const [key, value] of Object.entries(props)) {\n    if (key === 'id' || key.startsWith('aria-')) childProps[key] = value;\n    else if (HANDLER_KEY.test(key) && typeof value === 'function') {\n      // The wrapper sees the child's events as they bubble, but not those that reach it through\n      // a portal, such as a click on the tooltip surface (it would toggle a parent trigger).\n      wrapperProps[key] = ownEventsOnly(value as (event: React.SyntheticEvent) => void);\n    } else wrapperProps[key] = value;\n  }\n  return { childProps, wrapperProps };\n}\n\nfunction omit(props: UnknownProps, keys: readonly string[]): UnknownProps {\n  const result = { ...props };\n  for (const key of keys) delete result[key];\n  return result;\n}\n\nfunction hasIdRef(el: Element, attribute: string, id: string): boolean {\n  return (el.getAttribute(attribute) ?? '').split(/\\s+/).includes(id);\n}\n\nfunction removeIdRef(el: Element, attribute: string, id: string): void {\n  const rest = (el.getAttribute(attribute) ?? '')\n    .split(/\\s+/)\n    .filter((value) => value && value !== id);\n  if (rest.length > 0) el.setAttribute(attribute, rest.join(' '));\n  else el.removeAttribute(attribute);\n}\n\n/**\n * Makes sure the element people focus carries the tooltip relationship. After each commit, when no\n * focusable element inside the wrapper references `tooltipId` through `attribute` — children in the\n * fallback span, a non-focusable child element, or a child component that drops the prop (a\n * Popover or Dialog root) — the id is added to the first tabbable element inside the wrapper and\n * kept there while the subtree changes; a development warning explains the nesting, except for\n * the fallback span, whose children shape `renderTrigger` already warned about.\n */\nfunction useRelationshipTarget(\n  wrapperRef: React.RefObject<HTMLSpanElement | null>,\n  tooltipId: string,\n  relationship: Relationship,\n  childIsFallback: boolean,\n): void {\n  const appliedRef = React.useRef<{ element: Element; attribute: string } | null>(null);\n  const attribute = relationship === 'label' ? 'aria-labelledby' : 'aria-describedby';\n\n  React.useLayoutEffect(() => {\n    const wrapper = wrapperRef.current;\n    if (!wrapper) return;\n\n    const update = () => {\n      const applied = appliedRef.current;\n      const carriers = Array.from(wrapper.querySelectorAll(`[${attribute}]`)).filter(\n        (el) =>\n          !(applied && applied.element === el && applied.attribute === attribute) &&\n          hasIdRef(el, attribute, tooltipId),\n      );\n      const reached = carriers.some((el) => el.matches(FOCUSABLE_SELECTOR));\n      const target = reached ? null : getFirstTabbable(wrapper);\n      if (applied && (applied.element !== target || applied.attribute !== attribute)) {\n        removeIdRef(applied.element, applied.attribute, tooltipId);\n        appliedRef.current = null;\n      }\n      if (!target) return;\n      if (!hasIdRef(target, attribute, tooltipId)) {\n        target.setAttribute(attribute, joinIds(target.getAttribute(attribute), tooltipId) ?? '');\n      }\n      appliedRef.current = { element: target, attribute };\n      if (!childIsFallback) {\n        warnOnce(\n          'Tooltip:focus-target',\n          `Tooltip: the element that takes focus inside it did not get \\`${attribute}\\` (the child is not focusable, or is a component, such as a Popover or Dialog root, that does not pass the prop on), so it was added to the first focusable element inside. Put the Tooltip directly around the focusable element, e.g. <Popover.Trigger><Tooltip content=\"…\"><Button /></Tooltip></Popover.Trigger>.`,\n        );\n      }\n    };\n\n    update();\n    if (!appliedRef.current || typeof MutationObserver === 'undefined') return;\n    // Keep it on the focusable element when the child replaces it or rewrites the attribute\n    // without the Tooltip re-rendering.\n    const observer = new MutationObserver(update);\n    observer.observe(wrapper, {\n      subtree: true,\n      childList: true,\n      attributes: true,\n      attributeFilter: [attribute],\n    });\n    return () => observer.disconnect();\n  });\n}\n\n/**\n * Shows a short text label or description for its child on hover and keyboard focus.\n *\n * - The text is always present as a hidden `role=\"tooltip\"` element referenced by the child's\n *   `aria-describedby` (or `aria-labelledby` with `relationship=\"label\"`), so screen readers get\n *   it on focus without waiting for the delay; the child's own ids are kept.\n * - The visual surface is rendered in a portal only while visible (it is `aria-hidden`, a copy of\n *   the description), positioned on `side`/`align` with flipping and shifting to stay in view.\n * - It appears `openDelay` after the pointer rests on the child or the child takes keyboard focus,\n *   stays visible while the pointer moves onto it, hides `closeDelay` after the pointer leaves or\n *   immediately on blur, and Escape hides it without closing an enclosing dialog or popover. Focus\n *   and hover inside a popup the child renders in a portal (a DatePicker calendar, a listbox) do\n *   not show it, and the pointer moving onto such a popup hides it.\n * - The open state is uncontrolled by default (`defaultOpen`). With `open` and `onOpenChange`\n *   (Fluent's `visible` and `onVisibleChange`) the parent owns it: hover, focus, leave, blur and\n *   Escape then only ask for a change, and `open` alone shows the surface.\n * - `id` and `aria-*` props given to the Tooltip go to its child, merged with the child's own (the\n *   child's `id` wins, id lists are joined, `aria-expanded`/`aria-controls`/`aria-haspopup` from\n *   the Tooltip win). `className`, `style`, `ref`, `data-*` and event handlers stay on the wrapper\n *   `<span>`; the handlers see the child's events as they bubble, not events from portaled\n *   content such as the tooltip surface or a popup the child renders in a portal (a DatePicker\n *   calendar, a listbox). `onMouseEnter` and `onMouseLeave` are the exception: React fires them\n *   along the component tree, so they also fire when the pointer moves onto or off the tooltip\n *   surface or such a popup. So the Tooltip can sit inside a trigger, and the trigger's\n *   id and state reach the button: `<Menu.Trigger><Tooltip content=\"…\"><Button /></Tooltip>\n *   </Menu.Trigger>` (also `Popover.Trigger`, `Dialog.Trigger`, `Drawer.Trigger`). Around a\n *   trigger works too, since triggers pass `aria-describedby` on to their child.\n * - Wrap the focusable element itself. When the element that takes focus does not get the\n *   relationship (a Popover or Dialog root, a component that drops props, a non-focusable\n *   wrapper element), it is added to the first focusable element inside, with a development\n *   warning.\n *\n * @example\n * <Menu>\n *   <Menu.Trigger>\n *     <Tooltip content=\"Edit, duplicate or delete the item\">\n *       <Button>Actions</Button>\n *     </Tooltip>\n *   </Menu.Trigger>\n *   <Menu.Popover>…</Menu.Popover>\n * </Menu>\n */\nexport const Tooltip = ({\n  content,\n  appearance: appearanceProp,\n  variant,\n  openDelay: openDelayProp,\n  closeDelay = 100,\n  delay,\n  open: openProp,\n  defaultOpen,\n  onOpenChange,\n  relationship = 'description',\n  side = 'top',\n  align = 'center',\n  children,\n  className,\n  onMouseEnter,\n  onMouseLeave,\n  onFocus,\n  onBlur,\n  ref,\n  ...rest\n}: TooltipProps) => {\n  const appearance =\n    resolveDeprecatedProp(\n      'Tooltip',\n      appearanceProp,\n      variant === undefined ? undefined : VARIANT_APPEARANCE[variant],\n      'variant',\n      'appearance',\n    ) ?? 'inverted';\n  const openDelay =\n    resolveDeprecatedProp('Tooltip', openDelayProp, delay, 'delay', 'openDelay') ?? 200;\n  const [open, setOpen] = useControllable(openProp, defaultOpen ?? false, onOpenChange);\n  // The surface lives in a portal, which renders only in the browser: until then (the server HTML,\n  // hydration) the tooltip is closed; the hidden description is rendered either way.\n  const isClient = useIsClient();\n  const visible = open && isClient;\n  const timerRef = React.useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n  const wrapperRef = React.useRef<HTMLSpanElement | null>(null);\n  const surfaceRef = React.useRef<HTMLSpanElement | null>(null);\n  const tooltipId = useId('tooltip');\n\n  // Destructured: react-hooks/refs treats an object whose member is passed to `ref` as a ref.\n  const { setReference, setFloating, floatingProps } = usePopupPosition({\n    open: visible,\n    side,\n    align,\n    offset: 8,\n  });\n  const wrapperElementRef = useMergedRefs<HTMLSpanElement>(ref, wrapperRef, setReference);\n  const surfaceElementRef = useMergedRefs<HTMLSpanElement>(surfaceRef, setFloating);\n\n  // Timer handlers are event callbacks (stable, latest state): they are composed with the\n  // consumer's handlers during render but only run from events and timers.\n  const clearTimer = useEventCallback(() => {\n    if (timerRef.current !== undefined) {\n      clearTimeout(timerRef.current);\n      timerRef.current = undefined;\n    }\n  });\n\n  // show, hide and scheduleHide ask for the new state; a controlled tooltip changes only when the\n  // parent updates `open`.\n  const show = useEventCallback(() => {\n    clearTimer();\n    if (visible) return;\n    if (openDelay <= 0) {\n      setOpen(true);\n      return;\n    }\n    timerRef.current = setTimeout(() => {\n      timerRef.current = undefined;\n      setOpen(true);\n    }, openDelay);\n  });\n\n  const hide = useEventCallback(() => {\n    clearTimer();\n    setOpen(false);\n  });\n\n  // The grace period after the pointer leaves lets it move onto the tooltip.\n  const scheduleHide = useEventCallback(() => {\n    clearTimer();\n    if (!visible) return;\n    timerRef.current = setTimeout(() => {\n      timerRef.current = undefined;\n      setOpen(false);\n    }, closeDelay);\n  });\n\n  // An Escape-only layer while visible: Escape hides the tooltip before any enclosing overlay. The\n  // wrapper is its anchor (its trigger, not its surface): Tab from the child inside a focus trap\n  // moves on from the popover, portal or dialog around the wrapper.\n  useDismiss({\n    open: visible,\n    onDismiss: hide,\n    refs: [wrapperRef, surfaceRef],\n    anchorRef: wrapperRef,\n    kind: 'tooltip',\n    outsidePress: false,\n  });\n\n  React.useEffect(() => {\n    const timer = timerRef;\n    return () => clearTimeout(timer.current);\n  }, []);\n\n  // The tooltip's own reactions ignore a popup the child renders in a portal: its focus and blur\n  // are not the child's, entering it does not show the tooltip, and the pointer moving onto it\n  // (no mouseleave reaches the wrapper then) hides the tooltip, which would cover it. The tooltip\n  // surface itself is portaled too but belongs to the tooltip: it stays hoverable.\n  const showOnEnter = useEventCallback((event: React.MouseEvent<HTMLSpanElement>) => {\n    if (isOwnEvent(event) || surfaceRef.current?.contains(event.target as Node)) show();\n  });\n  const hideOverPortaledPopup = useEventCallback((event: React.MouseEvent<HTMLSpanElement>) => {\n    if (!isOwnEvent(event) && !surfaceRef.current?.contains(event.target as Node)) hide();\n  });\n\n  const { childProps, wrapperProps } = splitProps(rest);\n  const target = unwrapFragment(children);\n  const childIsFallback = !isCloneableElement(target);\n  const attribute = relationship === 'label' ? 'aria-labelledby' : 'aria-describedby';\n  // Props given to the Tooltip come first, as if the child had them; then the tooltip's own id.\n  // The fallback span is a generic element: no state ARIA and no naming on it (the relationship\n  // then reaches its first focusable element through useRelationshipTarget).\n  const triggerProps: UnknownProps = childIsFallback\n    ? omit(childProps, [...STATE_ARIA, ...NAMING_ARIA])\n    : { ...childProps };\n  if (!childIsFallback || relationship === 'description') {\n    triggerProps[attribute] = joinIds(childProps[attribute] as string | undefined, tooltipId);\n  }\n  const child = renderTrigger(target, triggerProps, { componentName: 'Tooltip' });\n  useRelationshipTarget(wrapperRef, tooltipId, relationship, childIsFallback);\n\n  return (\n    <span\n      ref={wrapperElementRef}\n      {...wrapperProps}\n      className={cn(tooltipClassNames.root, 'inline-block', className)}\n      onMouseEnter={composeEventHandlers(onMouseEnter, showOnEnter)}\n      onMouseLeave={composeEventHandlers(onMouseLeave, scheduleHide)}\n      onMouseOver={composeEventHandlers(\n        wrapperProps.onMouseOver as React.MouseEventHandler<HTMLSpanElement> | undefined,\n        hideOverPortaledPopup,\n      )}\n      onFocus={ownEventsOnly(composeEventHandlers(onFocus, show))}\n      onBlur={ownEventsOnly(composeEventHandlers(onBlur, hide))}\n    >\n      {child}\n      <span id={tooltipId} role=\"tooltip\" hidden>\n        {content}\n      </span>\n      {visible && (\n        <Portal layer=\"tooltip\">\n          <span\n            ref={surfaceElementRef}\n            aria-hidden=\"true\"\n            data-wave-tooltip-surface=\"\"\n            {...floatingProps}\n            className={cn(tooltipClassNames.content, surfaceClasses, appearanceClasses[appearance])}\n          >\n            {content}\n          </span>\n        </Portal>\n      )}\n    </span>\n  );\n};\n\nTooltip.displayName = 'Tooltip';\n"],"mappings":"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"}
+{"version":3,"file":"Tooltip.mjs","names":["useId","useId$1","React","VARIANT_APPEARANCE","appearanceClasses","surfaceClasses","HANDLER_KEY","NAMING_ARIA","isOwnEvent","event","ownEventsOnly","handler","splitProps","childProps","wrapperProps","key","value","props","omit","result","keys","hasIdRef","el","attribute","id","removeIdRef","rest","useRelationshipTarget","appliedRef","relationship","wrapper","wrapperRef","update","applied","target","tooltipId","FOCUSABLE_SELECTOR","getFirstTabbable","joinIds","childIsFallback","warnOnce","observer","Tooltip","appearanceProp","openDelayProp","openProp","appearance","resolveDeprecatedProp","variant","openDelay","delay","open","setOpen","useControllable","defaultOpen","onOpenChange","isClient","useIsClient","visible","timerRef","surfaceRef","usePopupPosition","resolvePositioning","positioning","wrapperElementRef","useMergedRefs","ref","setReference","surfaceElementRef","setFloating","clearTimer","useEventCallback","show","hide","scheduleHide","closeDelay","useDismiss","timer","showOnEnter","hideOverPortaledPopup","unwrapFragment","children","isCloneableElement","triggerProps","STATE_ARIA","child","renderTrigger","cn","tooltipClassNames","className","composeEventHandlers","onMouseEnter","onMouseLeave","onFocus","onBlur","content","Portal","floatingProps"],"sources":["../../../src/components/overlays/Tooltip.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cn } from '../../lib/cn';\nimport { joinIds } from '../../lib/aria';\nimport { tooltipClassNames } from '../../lib/classNames';\nimport { resolveDeprecatedProp, warnOnce } from '../../lib/dev';\nimport { composeEventHandlers } from '../../lib/composeEventHandlers';\nimport { FOCUSABLE_SELECTOR, getFirstTabbable } from '../../lib/focus';\nimport {\n  isCloneableElement,\n  renderTrigger,\n  STATE_ARIA,\n  unwrapFragment,\n} from '../../lib/renderTrigger';\nimport type { PopupAlign, PopupPositioningOptions, PopupSide } from '../../lib/types';\nimport { useControllable } from '../../hooks/useControllable';\nimport { useId } from '../../hooks/useId';\nimport { useIsClient } from '../../hooks/useIsClient';\nimport { useDismiss } from '../../hooks/useDismiss';\nimport { resolvePositioning, usePopupPosition } from '../../hooks/usePopupPosition';\nimport { useMergedRefs } from '../../hooks/useMergedRefs';\nimport { useEventCallback } from '../../hooks/useEventCallback';\nimport { Portal } from '../portal/Portal';\n\n/** Color treatment of a tooltip (`TooltipProps.appearance`). */\nexport type TooltipAppearance = 'inverted' | 'normal';\n\n/** Properties for the Tooltip component. */\nexport interface TooltipProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'content'> {\n  /** Content to display inside the tooltip (short, non-interactive text). */\n  content: React.ReactNode;\n  /**\n   * Color treatment: `inverted` (dark surface in the light theme) or `normal` (the page\n   * background with a border).\n   * @default 'inverted'\n   */\n  appearance?: TooltipAppearance;\n  /**\n   * @deprecated Use `appearance` (`'dark'` → `'inverted'`, `'light'` → `'normal'`).\n   */\n  variant?: 'dark' | 'light';\n  /**\n   * Milliseconds before the tooltip appears when the pointer rests on the child or the child\n   * receives keyboard focus (Fluent's `showDelay`; unlike Menu's and Popover's `openDelay`, it\n   * applies to focus too).\n   * @default 200\n   */\n  openDelay?: number;\n  /**\n   * Milliseconds before it hides once the pointer has left the child and the tooltip (Fluent's\n   * `hideDelay`); blur and Escape hide it at once.\n   * @default 100\n   */\n  closeDelay?: number;\n  /** @deprecated Use `openDelay`. */\n  delay?: number;\n  /**\n   * Controlled open state (Fluent's `visible`). The tooltip still asks to open on hover and focus\n   * (after `openDelay`) and to close on leave, blur and Escape through `onOpenChange`. The surface\n   * renders only in the browser: an open tooltip is closed in the server HTML and opens once it\n   * has hydrated.\n   */\n  open?: boolean;\n  /**\n   * Initial open state for uncontrolled usage.\n   * @default false\n   */\n  defaultOpen?: boolean;\n  /**\n   * Called with the new open state when it changes (Fluent's `onVisibleChange`). It has no\n   * `details` argument yet.\n   */\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * How the tooltip relates to its child: `description` adds it to the child's\n   * `aria-describedby`; `label` adds it to the child's `aria-labelledby`, naming an icon-only\n   * button.\n   * @default 'description'\n   */\n  relationship?: 'description' | 'label';\n  /**\n   * Side of the target the tooltip opens on. `start`/`end` follow the writing direction; the\n   * tooltip flips to the opposite side when there is not enough room.\n   * @default 'top'\n   */\n  side?: PopupSide;\n  /** Alignment along the target's edge.\n   * @default 'center'\n   */\n  align?: PopupAlign;\n  /**\n   * Advanced positioning (Fluent's `positioning`): `offset`, `fitViewport`, `matchReferenceWidth`\n   * and `fallbackPlacements`. `side` and `align` stay separate props. The hover bridge across the\n   * gap covers the default 8px, so a larger `offset` leaves a gap the pointer cannot cross.\n   * @default `{ offset: 8 }`\n   */\n  positioning?: PopupPositioningOptions;\n  /**\n   * A single element that triggers the tooltip on hover and focus: it receives the\n   * `aria-describedby`/`aria-labelledby`, plus any `id` and `aria-*` props given to the Tooltip\n   * (a Fragment around one element counts as that element). Other children are wrapped in a\n   * described `<span>` with a development warning, and their first focusable element gets the\n   * relationship.\n   */\n  children: React.ReactElement;\n  /** Ref to the wrapper `<span>` (the positioning anchor). */\n  ref?: React.Ref<HTMLSpanElement>;\n}\n\nconst VARIANT_APPEARANCE: Record<'dark' | 'light', TooltipAppearance> = {\n  dark: 'inverted',\n  light: 'normal',\n};\n\nconst appearanceClasses: Record<TooltipAppearance, string> = {\n  inverted: 'border border-inverted-border bg-inverted text-inverted-foreground',\n  normal: 'border border-border bg-background text-foreground',\n};\n\n/**\n * Transparent `::before` hover bridge across the 8px gap (the positioning offset) on the side that\n * faces the trigger only, so the pointer can move onto the tooltip; the other sides get no bridge,\n * which would otherwise catch hovers and clicks meant for neighbouring controls.\n */\nconst bridgeClasses = [\n  'before:absolute',\n  // Tooltip above the trigger: a strip below it.\n  'data-[side=top]:before:inset-x-0 data-[side=top]:before:top-full data-[side=top]:before:h-2',\n  // Tooltip below the trigger: a strip above it.\n  'data-[side=bottom]:before:inset-x-0 data-[side=bottom]:before:bottom-full data-[side=bottom]:before:h-2',\n  // wave-allow-physical: data-side is the physical side resolved by the positioning\n  'data-[side=left]:before:inset-y-0 data-[side=left]:before:left-full data-[side=left]:before:w-2',\n  // wave-allow-physical: data-side is the physical side resolved by the positioning\n  'data-[side=right]:before:inset-y-0 data-[side=right]:before:right-full data-[side=right]:before:w-2',\n].join(' ');\n\n/**\n * The visual surface: wrapping text, typography reset against the host (header cells, muted\n * panels), and the hover bridge towards the trigger.\n */\nconst surfaceClasses = `max-w-60 whitespace-normal break-words rounded px-3 py-1.5 text-caption-1 font-normal normal-case tracking-normal text-start shadow-8 ${bridgeClasses}`;\n\ntype UnknownProps = Record<string, unknown>;\ntype Relationship = NonNullable<TooltipProps['relationship']>;\n\nconst HANDLER_KEY = /^on[A-Z]/;\n\n/** Naming attributes a generic element such as the fallback `<span>` must not carry. */\nconst NAMING_ARIA = ['aria-label', 'aria-labelledby'] as const;\n\n/**\n * Whether an event reached the wrapper from its own DOM subtree — the child — rather than through\n * a portal: React bubbles events from portaled content (the tooltip surface, a popup the child\n * renders in a portal) through the component tree.\n */\nfunction isOwnEvent(event: React.SyntheticEvent): boolean {\n  return (event.currentTarget as Node).contains(event.target as Node);\n}\n\n/** `handler`, called only for the wrapper's own events (see {@link isOwnEvent}). */\nfunction ownEventsOnly<E extends React.SyntheticEvent>(\n  handler: (event: E) => void,\n): (event: E) => void {\n  return (event) => {\n    if (isOwnEvent(event)) handler(event);\n  };\n}\n\n/**\n * Splits the props the Tooltip receives, from its consumer or from a parent that clones its child\n * (Menu.Trigger, Popover.Trigger, Dialog.Trigger, Field): `id` and `aria-*` describe the element\n * the Tooltip is attached to, so they go to the child; the rest stays on the wrapper `<span>`.\n */\nfunction splitProps(props: UnknownProps): { childProps: UnknownProps; wrapperProps: UnknownProps } {\n  const childProps: UnknownProps = {};\n  const wrapperProps: UnknownProps = {};\n  for (const [key, value] of Object.entries(props)) {\n    if (key === 'id' || key.startsWith('aria-')) childProps[key] = value;\n    else if (HANDLER_KEY.test(key) && typeof value === 'function') {\n      // The wrapper sees the child's events as they bubble, but not those that reach it through\n      // a portal, such as a click on the tooltip surface (it would toggle a parent trigger).\n      wrapperProps[key] = ownEventsOnly(value as (event: React.SyntheticEvent) => void);\n    } else wrapperProps[key] = value;\n  }\n  return { childProps, wrapperProps };\n}\n\nfunction omit(props: UnknownProps, keys: readonly string[]): UnknownProps {\n  const result = { ...props };\n  for (const key of keys) delete result[key];\n  return result;\n}\n\nfunction hasIdRef(el: Element, attribute: string, id: string): boolean {\n  return (el.getAttribute(attribute) ?? '').split(/\\s+/).includes(id);\n}\n\nfunction removeIdRef(el: Element, attribute: string, id: string): void {\n  const rest = (el.getAttribute(attribute) ?? '')\n    .split(/\\s+/)\n    .filter((value) => value && value !== id);\n  if (rest.length > 0) el.setAttribute(attribute, rest.join(' '));\n  else el.removeAttribute(attribute);\n}\n\n/**\n * Makes sure the element people focus carries the tooltip relationship. After each commit, when no\n * focusable element inside the wrapper references `tooltipId` through `attribute` — children in the\n * fallback span, a non-focusable child element, or a child component that drops the prop (a\n * Popover or Dialog root) — the id is added to the first tabbable element inside the wrapper and\n * kept there while the subtree changes; a development warning explains the nesting, except for\n * the fallback span, whose children shape `renderTrigger` already warned about.\n */\nfunction useRelationshipTarget(\n  wrapperRef: React.RefObject<HTMLSpanElement | null>,\n  tooltipId: string,\n  relationship: Relationship,\n  childIsFallback: boolean,\n): void {\n  const appliedRef = React.useRef<{ element: Element; attribute: string } | null>(null);\n  const attribute = relationship === 'label' ? 'aria-labelledby' : 'aria-describedby';\n\n  React.useLayoutEffect(() => {\n    const wrapper = wrapperRef.current;\n    if (!wrapper) return;\n\n    const update = () => {\n      const applied = appliedRef.current;\n      const carriers = Array.from(wrapper.querySelectorAll(`[${attribute}]`)).filter(\n        (el) =>\n          !(applied && applied.element === el && applied.attribute === attribute) &&\n          hasIdRef(el, attribute, tooltipId),\n      );\n      const reached = carriers.some((el) => el.matches(FOCUSABLE_SELECTOR));\n      const target = reached ? null : getFirstTabbable(wrapper);\n      if (applied && (applied.element !== target || applied.attribute !== attribute)) {\n        removeIdRef(applied.element, applied.attribute, tooltipId);\n        appliedRef.current = null;\n      }\n      if (!target) return;\n      if (!hasIdRef(target, attribute, tooltipId)) {\n        target.setAttribute(attribute, joinIds(target.getAttribute(attribute), tooltipId) ?? '');\n      }\n      appliedRef.current = { element: target, attribute };\n      if (!childIsFallback) {\n        warnOnce(\n          'Tooltip:focus-target',\n          `Tooltip: the element that takes focus inside it did not get \\`${attribute}\\` (the child is not focusable, or is a component, such as a Popover or Dialog root, that does not pass the prop on), so it was added to the first focusable element inside. Put the Tooltip directly around the focusable element, e.g. <Popover.Trigger><Tooltip content=\"…\"><Button /></Tooltip></Popover.Trigger>.`,\n        );\n      }\n    };\n\n    update();\n    if (!appliedRef.current || typeof MutationObserver === 'undefined') return;\n    // Keep it on the focusable element when the child replaces it or rewrites the attribute\n    // without the Tooltip re-rendering.\n    const observer = new MutationObserver(update);\n    observer.observe(wrapper, {\n      subtree: true,\n      childList: true,\n      attributes: true,\n      attributeFilter: [attribute],\n    });\n    return () => observer.disconnect();\n  });\n}\n\n/**\n * Shows a short text label or description for its child on hover and keyboard focus.\n *\n * - The text is always present as a hidden `role=\"tooltip\"` element referenced by the child's\n *   `aria-describedby` (or `aria-labelledby` with `relationship=\"label\"`), so screen readers get\n *   it on focus without waiting for the delay; the child's own ids are kept.\n * - The visual surface is rendered in a portal only while visible (it is `aria-hidden`, a copy of\n *   the description), positioned on `side`/`align` with flipping and shifting to stay in view.\n * - It appears `openDelay` after the pointer rests on the child or the child takes keyboard focus,\n *   stays visible while the pointer moves onto it, hides `closeDelay` after the pointer leaves or\n *   immediately on blur, and Escape hides it without closing an enclosing dialog or popover. Focus\n *   and hover inside a popup the child renders in a portal (a DatePicker calendar, a listbox) do\n *   not show it, and the pointer moving onto such a popup hides it.\n * - The open state is uncontrolled by default (`defaultOpen`). With `open` and `onOpenChange`\n *   (Fluent's `visible` and `onVisibleChange`) the parent owns it: hover, focus, leave, blur and\n *   Escape then only ask for a change, and `open` alone shows the surface.\n * - `id` and `aria-*` props given to the Tooltip go to its child, merged with the child's own (the\n *   child's `id` wins, id lists are joined, `aria-expanded`/`aria-controls`/`aria-haspopup` from\n *   the Tooltip win). `className`, `style`, `ref`, `data-*` and event handlers stay on the wrapper\n *   `<span>`; the handlers see the child's events as they bubble, not events from portaled\n *   content such as the tooltip surface or a popup the child renders in a portal (a DatePicker\n *   calendar, a listbox). `onMouseEnter` and `onMouseLeave` are the exception: React fires them\n *   along the component tree, so they also fire when the pointer moves onto or off the tooltip\n *   surface or such a popup. So the Tooltip can sit inside a trigger, and the trigger's\n *   id and state reach the button: `<Menu.Trigger><Tooltip content=\"…\"><Button /></Tooltip>\n *   </Menu.Trigger>` (also `Popover.Trigger`, `Dialog.Trigger`, `Drawer.Trigger`). Around a\n *   trigger works too, since triggers pass `aria-describedby` on to their child.\n * - Wrap the focusable element itself. When the element that takes focus does not get the\n *   relationship (a Popover or Dialog root, a component that drops props, a non-focusable\n *   wrapper element), it is added to the first focusable element inside, with a development\n *   warning.\n *\n * @example\n * <Menu>\n *   <Menu.Trigger>\n *     <Tooltip content=\"Edit, duplicate or delete the item\">\n *       <Button>Actions</Button>\n *     </Tooltip>\n *   </Menu.Trigger>\n *   <Menu.Popover>…</Menu.Popover>\n * </Menu>\n */\nexport const Tooltip = ({\n  content,\n  appearance: appearanceProp,\n  variant,\n  openDelay: openDelayProp,\n  closeDelay = 100,\n  delay,\n  open: openProp,\n  defaultOpen,\n  onOpenChange,\n  relationship = 'description',\n  side = 'top',\n  align = 'center',\n  positioning,\n  children,\n  className,\n  onMouseEnter,\n  onMouseLeave,\n  onFocus,\n  onBlur,\n  ref,\n  ...rest\n}: TooltipProps) => {\n  const appearance =\n    resolveDeprecatedProp(\n      'Tooltip',\n      appearanceProp,\n      variant === undefined ? undefined : VARIANT_APPEARANCE[variant],\n      'variant',\n      'appearance',\n    ) ?? 'inverted';\n  const openDelay =\n    resolveDeprecatedProp('Tooltip', openDelayProp, delay, 'delay', 'openDelay') ?? 200;\n  const [open, setOpen] = useControllable(openProp, defaultOpen ?? false, onOpenChange);\n  // The surface lives in a portal, which renders only in the browser: until then (the server HTML,\n  // hydration) the tooltip is closed; the hidden description is rendered either way.\n  const isClient = useIsClient();\n  const visible = open && isClient;\n  const timerRef = React.useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n  const wrapperRef = React.useRef<HTMLSpanElement | null>(null);\n  const surfaceRef = React.useRef<HTMLSpanElement | null>(null);\n  const tooltipId = useId('tooltip');\n\n  // Destructured: react-hooks/refs treats an object whose member is passed to `ref` as a ref.\n  const { setReference, setFloating, floatingProps } = usePopupPosition({\n    open: visible,\n    side,\n    align,\n    ...resolvePositioning(positioning, { offset: 8 }),\n  });\n  const wrapperElementRef = useMergedRefs<HTMLSpanElement>(ref, wrapperRef, setReference);\n  const surfaceElementRef = useMergedRefs<HTMLSpanElement>(surfaceRef, setFloating);\n\n  // Timer handlers are event callbacks (stable, latest state): they are composed with the\n  // consumer's handlers during render but only run from events and timers.\n  const clearTimer = useEventCallback(() => {\n    if (timerRef.current !== undefined) {\n      clearTimeout(timerRef.current);\n      timerRef.current = undefined;\n    }\n  });\n\n  // show, hide and scheduleHide ask for the new state; a controlled tooltip changes only when the\n  // parent updates `open`.\n  const show = useEventCallback(() => {\n    clearTimer();\n    if (visible) return;\n    if (openDelay <= 0) {\n      setOpen(true);\n      return;\n    }\n    timerRef.current = setTimeout(() => {\n      timerRef.current = undefined;\n      setOpen(true);\n    }, openDelay);\n  });\n\n  const hide = useEventCallback(() => {\n    clearTimer();\n    setOpen(false);\n  });\n\n  // The grace period after the pointer leaves lets it move onto the tooltip.\n  const scheduleHide = useEventCallback(() => {\n    clearTimer();\n    if (!visible) return;\n    timerRef.current = setTimeout(() => {\n      timerRef.current = undefined;\n      setOpen(false);\n    }, closeDelay);\n  });\n\n  // An Escape-only layer while visible: Escape hides the tooltip before any enclosing overlay. The\n  // wrapper is its anchor (its trigger, not its surface): Tab from the child inside a focus trap\n  // moves on from the popover, portal or dialog around the wrapper.\n  useDismiss({\n    open: visible,\n    onDismiss: hide,\n    refs: [wrapperRef, surfaceRef],\n    anchorRef: wrapperRef,\n    kind: 'tooltip',\n    outsidePress: false,\n  });\n\n  React.useEffect(() => {\n    const timer = timerRef;\n    return () => clearTimeout(timer.current);\n  }, []);\n\n  // The tooltip's own reactions ignore a popup the child renders in a portal: its focus and blur\n  // are not the child's, entering it does not show the tooltip, and the pointer moving onto it\n  // (no mouseleave reaches the wrapper then) hides the tooltip, which would cover it. The tooltip\n  // surface itself is portaled too but belongs to the tooltip: it stays hoverable.\n  const showOnEnter = useEventCallback((event: React.MouseEvent<HTMLSpanElement>) => {\n    if (isOwnEvent(event) || surfaceRef.current?.contains(event.target as Node)) show();\n  });\n  const hideOverPortaledPopup = useEventCallback((event: React.MouseEvent<HTMLSpanElement>) => {\n    if (!isOwnEvent(event) && !surfaceRef.current?.contains(event.target as Node)) hide();\n  });\n\n  const { childProps, wrapperProps } = splitProps(rest);\n  const target = unwrapFragment(children);\n  const childIsFallback = !isCloneableElement(target);\n  const attribute = relationship === 'label' ? 'aria-labelledby' : 'aria-describedby';\n  // Props given to the Tooltip come first, as if the child had them; then the tooltip's own id.\n  // The fallback span is a generic element: no state ARIA and no naming on it (the relationship\n  // then reaches its first focusable element through useRelationshipTarget).\n  const triggerProps: UnknownProps = childIsFallback\n    ? omit(childProps, [...STATE_ARIA, ...NAMING_ARIA])\n    : { ...childProps };\n  if (!childIsFallback || relationship === 'description') {\n    triggerProps[attribute] = joinIds(childProps[attribute] as string | undefined, tooltipId);\n  }\n  const child = renderTrigger(target, triggerProps, { componentName: 'Tooltip' });\n  useRelationshipTarget(wrapperRef, tooltipId, relationship, childIsFallback);\n\n  return (\n    <span\n      ref={wrapperElementRef}\n      {...wrapperProps}\n      className={cn(tooltipClassNames.root, 'inline-block', className)}\n      onMouseEnter={composeEventHandlers(onMouseEnter, showOnEnter)}\n      onMouseLeave={composeEventHandlers(onMouseLeave, scheduleHide)}\n      onMouseOver={composeEventHandlers(\n        wrapperProps.onMouseOver as React.MouseEventHandler<HTMLSpanElement> | undefined,\n        hideOverPortaledPopup,\n      )}\n      onFocus={ownEventsOnly(composeEventHandlers(onFocus, show))}\n      onBlur={ownEventsOnly(composeEventHandlers(onBlur, hide))}\n    >\n      {child}\n      <span id={tooltipId} role=\"tooltip\" hidden>\n        {content}\n      </span>\n      {visible && (\n        <Portal layer=\"tooltip\">\n          <span\n            ref={surfaceElementRef}\n            aria-hidden=\"true\"\n            data-wave-tooltip-surface=\"\"\n            {...floatingProps}\n            className={cn(tooltipClassNames.content, surfaceClasses, appearanceClasses[appearance])}\n          >\n            {content}\n          </span>\n        </Portal>\n      )}\n    </span>\n  );\n};\n\nTooltip.displayName = 'Tooltip';\n"],"mappings":"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"}

package/dist/components/portal/Portal.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/cn.cjs"),n=require("../../lib/classNames.cjs"),r=require("../../hooks/useMergedRefs.cjs"),i=require("../../hooks/useIsClient.cjs"),a=require("../provider/WaveProvider.cjs"),o=require("../../lib/layers.cjs"),s=require("../../hooks/useDirection.cjs"),c=require("../../hooks/useDismiss.cjs");let l=require("react");l=e.__toESM(l,1);let u=require("react/jsx-runtime"),d=require("react-dom");var f=l.createContext(0);f.displayName=`PortalDepthContext`;var p=({children:e,container:p,layer:m=`overlay`,layerId:h,disabled:g=!1,className:_,ref:v})=>{let y=i.useIsClient(),{themeClassName:b,portalContainer:x}=a.useWaveTheme(),S=s.useDirection(),C=l.useContext(f),w=l.useContext(c.DismissLayerContext),T=l.useCallback(e=>{if(e&&w!==null)return o.registerLayerElement(w,e)},[w]),E=r.useMergedRefs(v,T),D=h===void 0?e:(0,u.jsx)(c.DismissLayerProvider,{layerId:h,children:e});if(g)return(0,u.jsx)(u.Fragment,{children:D});if(!y)return null;let O=p??x??document.body;return(0,d.createPortal)((0,u.jsx)(`div`,{ref:E,className:t.cn(n.portalClassNames.root,b,_),dir:S,"data-wave-portal":``,"data-layer":m,style:{position:`relative`,zIndex:`calc(${o.Z_INDEX[m]} + ${C})`},children:(0,u.jsx)(f.Provider,{value:C+1,children:D})}),O)};p.displayName=`Portal`,exports.Portal=p,exports.PortalDepthContext=f;
+"use client";const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/cn.cjs"),n=require("../../lib/classNames.cjs"),r=require("../../hooks/useMergedRefs.cjs"),i=require("../../hooks/useIsClient.cjs"),a=require("../provider/WaveProvider.cjs"),o=require("../../hooks/useDirection.cjs"),s=require("../../lib/layers.cjs"),c=require("../../hooks/useDismiss.cjs");let l=require("react");l=e.__toESM(l,1);let u=require("react/jsx-runtime"),d=require("react-dom");var f=l.createContext(0);f.displayName=`PortalDepthContext`;var p=({children:e,container:p,layer:m=`overlay`,layerId:h,disabled:g=!1,className:_,ref:v})=>{let y=i.useIsClient(),{themeClassName:b,portalContainer:x}=a.useWaveTheme(),S=o.useDirection(),C=l.useContext(f),w=l.useContext(c.DismissLayerContext),T=l.useCallback(e=>{if(e&&w!==null)return s.registerLayerElement(w,e)},[w]),E=r.useMergedRefs(v,T),D=h===void 0?e:(0,u.jsx)(c.DismissLayerProvider,{layerId:h,children:e});if(g)return(0,u.jsx)(u.Fragment,{children:D});if(!y)return null;let O=p??x??document.body;return(0,d.createPortal)((0,u.jsx)(`div`,{ref:E,className:t.cn(n.portalClassNames.root,b,_),dir:S,"data-wave-portal":``,"data-layer":m,style:{position:`relative`,zIndex:`calc(${s.Z_INDEX[m]} + ${C})`},children:(0,u.jsx)(f.Provider,{value:C+1,children:D})}),O)};p.displayName=`Portal`,exports.Portal=p,exports.PortalDepthContext=f;
 //# sourceMappingURL=Portal.cjs.map

package/dist/components/portal/Portal.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Portal.cjs","names":["React","useIsClient","useWaveTheme","useDirection","DismissLayerContext","registerLayerElement","useMergedRefs","DismissLayerProvider","_Fragment","createPortal","cn","portalClassNames","Z_INDEX","require_runtime","require_cn","require_classNames","require_useMergedRefs","require_useIsClient","require_WaveProvider","require_layers","require_useDirection","require_useDismiss","react","react_jsx_runtime","react_dom","PortalDepthContext","Portal","isClient","dir","depth","parentLayerId","registerWithParent","el","wrapperRef","ref","content","layerId","children","disabled","target","container","portalContainer","themeClassName","className","layer"],"sources":["../../../src/components/portal/Portal.tsx"],"sourcesContent":["import * as React from 'react';\nimport { createPortal } from 'react-dom';\nimport { cn } from '../../lib/cn';\nimport { portalClassNames } from '../../lib/classNames';\nimport { Z_INDEX, registerLayerElement } from '../../lib/layers';\nimport { useIsClient } from '../../hooks/useIsClient';\nimport { useDirection } from '../../hooks/useDirection';\nimport { useMergedRefs } from '../../hooks/useMergedRefs';\nimport { DismissLayerContext, DismissLayerProvider } from '../../hooks/useDismiss';\nimport { useWaveTheme } from '../provider/WaveProvider';\n\n/** Props accepted by {@link Portal}. */\nexport interface PortalProps {\n  /** Content rendered into the portal. */\n  children: React.ReactNode;\n  /** Element to render into. @default WaveProvider `portalContainer`, else `document.body` */\n  container?: HTMLElement | null;\n  /**\n   * Stacking layer: `--wave-z-overlay` (dialogs, popovers, menus, listboxes), `--wave-z-toast`\n   * (above overlays) or `--wave-z-tooltip`. The portal's nesting depth is added.\n   * @default 'overlay'\n   */\n  layer?: 'overlay' | 'toast' | 'tooltip';\n  /**\n   * The dismiss layer of the content (from `useDismiss`). Provided to the children through\n   * `DismissLayerProvider`, so layers opened inside become its descendants.\n   */\n  layerId?: string;\n  /** Render the children inline instead (no portal, no wrapper). @default false */\n  disabled?: boolean;\n  /** Extra classes for the portal wrapper. */\n  className?: string;\n  /** Ref to the portal wrapper `<div>`. */\n  ref?: React.Ref<HTMLDivElement>;\n}\n\n/**\n * Nesting depth of portals: `0` outside any portal; each `Portal` provides `depth + 1` to its\n * children. Portals add it to their z-index so a surface opened from inside another overlay always\n * stacks above it — also when both mount in the same commit.\n */\nexport const PortalDepthContext = React.createContext(0);\nPortalDepthContext.displayName = 'PortalDepthContext';\n\n/**\n * Renders its children into `document.body` (or the WaveProvider `portalContainer`), wrapped in a\n * `<div class=\"wave-portal …\">` that carries the provider's theme classes, direction and font, so\n * portaled overlays look like the rest of the themed tree. The wrapper paints no background.\n *\n * - **Client only, first commit**: nothing is rendered on the server or during hydration (no\n *   mismatch); in every other client render the portal exists in the first commit, so layout\n *   effects and ref callbacks of the content see connected elements.\n * - **Stacking**: `z-index: calc(<layer variable> + depth)`, where depth is the number of portals\n *   it is rendered in, so a surface opened from inside another overlay always stacks above it,\n *   also when both mount in the same commit.\n * - **Layers**: the wrapper is registered with the enclosing dismiss layer (the parent), so presses\n *   and focus inside the portal count as inside that layer; `layerId` is provided only to the\n *   children.\n *\n * Content that must exist on the server or before an overlay opens (tooltip descriptions, closed\n * listboxes) is rendered inline instead.\n */\nexport const Portal = ({\n  children,\n  container,\n  layer = 'overlay',\n  layerId,\n  disabled = false,\n  className,\n  ref,\n}: PortalProps) => {\n  const isClient = useIsClient();\n  const { themeClassName, portalContainer } = useWaveTheme();\n  const dir = useDirection();\n  const depth = React.useContext(PortalDepthContext);\n  const parentLayerId = React.useContext(DismissLayerContext);\n\n  const registerWithParent = React.useCallback(\n    (el: HTMLDivElement | null) => {\n      if (!el || parentLayerId === null) return;\n      return registerLayerElement(parentLayerId, el);\n    },\n    [parentLayerId],\n  );\n  const wrapperRef = useMergedRefs<HTMLDivElement>(ref, registerWithParent);\n\n  const content =\n    layerId === undefined ? (\n      children\n    ) : (\n      <DismissLayerProvider layerId={layerId}>{children}</DismissLayerProvider>\n    );\n\n  if (disabled) return <>{content}</>;\n  if (!isClient) return null;\n\n  const target = container ?? portalContainer ?? document.body;\n\n  return createPortal(\n    <div\n      ref={wrapperRef}\n      className={cn(portalClassNames.root, themeClassName, className)}\n      dir={dir}\n      data-wave-portal=\"\"\n      data-layer={layer}\n      style={{ position: 'relative', zIndex: `calc(${Z_INDEX[layer]} + ${depth})` }}\n    >\n      <PortalDepthContext.Provider value={depth + 1}>{content}</PortalDepthContext.Provider>\n    </div>,\n    target,\n  );\n};\n\nPortal.displayName = 'Portal';\n"],"mappings":"6dAyCA,IAAayB,EAAqBzB,EAAM,cAAc,CAAC,EACvD,EAAmB,YAAc,qBAoBjC,IAAa0B,GAAU,CACrB,WACA,YACA,QAAQ,UACR,UACA,WAAW,GACX,YACA,SACiB,CACjB,IAAMC,EAAW1B,EAAAA,YAAY,EACvB,CAAE,iBAAgB,mBAAoBC,EAAAA,aAAa,EACnD0B,EAAMzB,EAAAA,aAAa,EACnB0B,EAAQ7B,EAAM,WAAWyB,CAAkB,EAC3CK,EAAgB9B,EAAM,WAAWI,EAAAA,mBAAmB,EAEpD2B,EAAqB/B,EAAM,YAC9B,GAA8B,CAC7B,GAAKgC,GAAMF,IAAkB,KAC7B,OAAOzB,EAAAA,qBAAqByB,EAAeE,CAAE,CAC/C,EACA,CAACF,CAAa,CAChB,EACMG,EAAa3B,EAAAA,cAA8B4B,EAAKH,CAAkB,EAElEI,EACJC,IAAY,IAAA,GACVC,GAEA,EAAAd,EAAA,IAAA,CAAChB,EAAAA,qBAAD,CAA+B,UAAU,UAA+B,CAAA,EAG5E,GAAI+B,EAAU,OAAO,EAAAf,EAAA,IAAA,CAAAf,EAAAA,SAAA,CAAA,SAAG2B,CAAU,CAAA,EAClC,GAAI,CAACR,EAAU,OAAO,KAEtB,IAAMY,EAASC,GAAaC,GAAmB,SAAS,KAExD,OAAA,EAAOhC,EAAAA,aAAAA,EACL,EAAAc,EAAA,IAAA,CAAC,MAAD,CACE,IAAKU,EACL,UAAWvB,EAAAA,GAAGC,EAAAA,iBAAiB,KAAM+B,EAAgBC,CAAS,EACzD,MACL,mBAAiB,GACjB,aAAYC,EACZ,MAAO,CAAE,SAAU,WAAY,OAAQ,QAAQhC,EAAAA,QAAQgC,GAAO,KAAKf,EAAM,EAAG,EAE5E,UAAA,EAAAN,EAAA,IAAA,CAACE,EAAmB,SAApB,CAA6B,MAAOI,EAAQ,EAAI,SAAAM,CAAqC,CAAA,CAClF,CAAA,EACLI,CACF,CACF,EAEA,EAAO,YAAc"}
+{"version":3,"file":"Portal.cjs","names":["React","useIsClient","useWaveTheme","useDirection","DismissLayerContext","registerLayerElement","useMergedRefs","DismissLayerProvider","_Fragment","createPortal","cn","portalClassNames","Z_INDEX","require_runtime","require_cn","require_classNames","require_useMergedRefs","require_useIsClient","require_WaveProvider","require_useDirection","require_layers","require_useDismiss","react","react_jsx_runtime","react_dom","PortalDepthContext","Portal","isClient","dir","depth","parentLayerId","registerWithParent","el","wrapperRef","ref","content","layerId","children","disabled","target","container","portalContainer","themeClassName","className","layer"],"sources":["../../../src/components/portal/Portal.tsx"],"sourcesContent":["import * as React from 'react';\nimport { createPortal } from 'react-dom';\nimport { cn } from '../../lib/cn';\nimport { portalClassNames } from '../../lib/classNames';\nimport { Z_INDEX, registerLayerElement } from '../../lib/layers';\nimport { useIsClient } from '../../hooks/useIsClient';\nimport { useDirection } from '../../hooks/useDirection';\nimport { useMergedRefs } from '../../hooks/useMergedRefs';\nimport { DismissLayerContext, DismissLayerProvider } from '../../hooks/useDismiss';\nimport { useWaveTheme } from '../provider/WaveProvider';\n\n/** Props accepted by {@link Portal}. */\nexport interface PortalProps {\n  /** Content rendered into the portal. */\n  children: React.ReactNode;\n  /** Element to render into. @default WaveProvider `portalContainer`, else `document.body` */\n  container?: HTMLElement | null;\n  /**\n   * Stacking layer: `--wave-z-overlay` (dialogs, popovers, menus, listboxes), `--wave-z-toast`\n   * (above overlays) or `--wave-z-tooltip`. The portal's nesting depth is added.\n   * @default 'overlay'\n   */\n  layer?: 'overlay' | 'toast' | 'tooltip';\n  /**\n   * The dismiss layer of the content (from `useDismiss`). Provided to the children through\n   * `DismissLayerProvider`, so layers opened inside become its descendants.\n   */\n  layerId?: string;\n  /** Render the children inline instead (no portal, no wrapper). @default false */\n  disabled?: boolean;\n  /** Extra classes for the portal wrapper. */\n  className?: string;\n  /** Ref to the portal wrapper `<div>`. */\n  ref?: React.Ref<HTMLDivElement>;\n}\n\n/**\n * Nesting depth of portals: `0` outside any portal; each `Portal` provides `depth + 1` to its\n * children. Portals add it to their z-index so a surface opened from inside another overlay always\n * stacks above it — also when both mount in the same commit.\n */\nexport const PortalDepthContext = React.createContext(0);\nPortalDepthContext.displayName = 'PortalDepthContext';\n\n/**\n * Renders its children into `document.body` (or the WaveProvider `portalContainer`), wrapped in a\n * `<div class=\"wave-portal …\">` that carries the provider's theme classes, direction and font, so\n * portaled overlays look like the rest of the themed tree. The wrapper paints no background.\n *\n * - **Client only, first commit**: nothing is rendered on the server or during hydration (no\n *   mismatch); in every other client render the portal exists in the first commit, so layout\n *   effects and ref callbacks of the content see connected elements.\n * - **Stacking**: `z-index: calc(<layer variable> + depth)`, where depth is the number of portals\n *   it is rendered in, so a surface opened from inside another overlay always stacks above it,\n *   also when both mount in the same commit.\n * - **Layers**: the wrapper is registered with the enclosing dismiss layer (the parent), so presses\n *   and focus inside the portal count as inside that layer; `layerId` is provided only to the\n *   children.\n *\n * Content that must exist on the server or before an overlay opens (tooltip descriptions, closed\n * listboxes) is rendered inline instead.\n */\nexport const Portal = ({\n  children,\n  container,\n  layer = 'overlay',\n  layerId,\n  disabled = false,\n  className,\n  ref,\n}: PortalProps) => {\n  const isClient = useIsClient();\n  const { themeClassName, portalContainer } = useWaveTheme();\n  const dir = useDirection();\n  const depth = React.useContext(PortalDepthContext);\n  const parentLayerId = React.useContext(DismissLayerContext);\n\n  const registerWithParent = React.useCallback(\n    (el: HTMLDivElement | null) => {\n      if (!el || parentLayerId === null) return;\n      return registerLayerElement(parentLayerId, el);\n    },\n    [parentLayerId],\n  );\n  const wrapperRef = useMergedRefs<HTMLDivElement>(ref, registerWithParent);\n\n  const content =\n    layerId === undefined ? (\n      children\n    ) : (\n      <DismissLayerProvider layerId={layerId}>{children}</DismissLayerProvider>\n    );\n\n  if (disabled) return <>{content}</>;\n  if (!isClient) return null;\n\n  const target = container ?? portalContainer ?? document.body;\n\n  return createPortal(\n    <div\n      ref={wrapperRef}\n      className={cn(portalClassNames.root, themeClassName, className)}\n      dir={dir}\n      data-wave-portal=\"\"\n      data-layer={layer}\n      style={{ position: 'relative', zIndex: `calc(${Z_INDEX[layer]} + ${depth})` }}\n    >\n      <PortalDepthContext.Provider value={depth + 1}>{content}</PortalDepthContext.Provider>\n    </div>,\n    target,\n  );\n};\n\nPortal.displayName = 'Portal';\n"],"mappings":"6dAyCA,IAAayB,EAAqBzB,EAAM,cAAc,CAAC,EACvD,EAAmB,YAAc,qBAoBjC,IAAa0B,GAAU,CACrB,WACA,YACA,QAAQ,UACR,UACA,WAAW,GACX,YACA,SACiB,CACjB,IAAMC,EAAW1B,EAAAA,YAAY,EACvB,CAAE,iBAAgB,mBAAoBC,EAAAA,aAAa,EACnD0B,EAAMzB,EAAAA,aAAa,EACnB0B,EAAQ7B,EAAM,WAAWyB,CAAkB,EAC3CK,EAAgB9B,EAAM,WAAWI,EAAAA,mBAAmB,EAEpD2B,EAAqB/B,EAAM,YAC9B,GAA8B,CAC7B,GAAKgC,GAAMF,IAAkB,KAC7B,OAAOzB,EAAAA,qBAAqByB,EAAeE,CAAE,CAC/C,EACA,CAACF,CAAa,CAChB,EACMG,EAAa3B,EAAAA,cAA8B4B,EAAKH,CAAkB,EAElEI,EACJC,IAAY,IAAA,GACVC,GAEA,EAAAd,EAAA,IAAA,CAAChB,EAAAA,qBAAD,CAA+B,UAAU,UAA+B,CAAA,EAG5E,GAAI+B,EAAU,OAAO,EAAAf,EAAA,IAAA,CAAAf,EAAAA,SAAA,CAAA,SAAG2B,CAAU,CAAA,EAClC,GAAI,CAACR,EAAU,OAAO,KAEtB,IAAMY,EAASC,GAAaC,GAAmB,SAAS,KAExD,OAAA,EAAOhC,EAAAA,aAAAA,EACL,EAAAc,EAAA,IAAA,CAAC,MAAD,CACE,IAAKU,EACL,UAAWvB,EAAAA,GAAGC,EAAAA,iBAAiB,KAAM+B,EAAgBC,CAAS,EACzD,MACL,mBAAiB,GACjB,aAAYC,EACZ,MAAO,CAAE,SAAU,WAAY,OAAQ,QAAQhC,EAAAA,QAAQgC,GAAO,KAAKf,EAAM,EAAG,EAE5E,UAAA,EAAAN,EAAA,IAAA,CAACE,EAAmB,SAApB,CAA6B,MAAOI,EAAQ,EAAI,SAAAM,CAAqC,CAAA,CAClF,CAAA,EACLI,CACF,CACF,EAEA,EAAO,YAAc"}

package/dist/components/portal/Portal.mjs

@@ -4,8 +4,8 @@ import { portalClassNames as t } from "../../lib/classNames.mjs";
 import { useMergedRefs as n } from "../../hooks/useMergedRefs.mjs";
 import { useIsClient as r } from "../../hooks/useIsClient.mjs";
 import { useWaveTheme as i } from "../provider/WaveProvider.mjs";
-import { Z_INDEX as a, registerLayerElement as o } from "../../lib/layers.mjs";
-import { useDirection as s } from "../../hooks/useDirection.mjs";
+import { useDirection as a } from "../../hooks/useDirection.mjs";
+import { Z_INDEX as o, registerLayerElement as s } from "../../lib/layers.mjs";
 import { DismissLayerContext as c, DismissLayerProvider as l } from "../../hooks/useDismiss.mjs";
 import * as u from "react";
 import { Fragment as d, jsx as f } from "react/jsx-runtime";
@@ -14,8 +14,8 @@ import { createPortal as p } from "react-dom";
 var m = u.createContext(0);
 m.displayName = "PortalDepthContext";
 var h = ({ children: h, container: g, layer: _ = "overlay", layerId: v, disabled: y = !1, className: b, ref: x }) => {
-	let S = r(), { themeClassName: C, portalContainer: w } = i(), T = s(), E = u.useContext(m), D = u.useContext(c), O = u.useCallback((e) => {
-		if (e && D !== null) return o(D, e);
+	let S = r(), { themeClassName: C, portalContainer: w } = i(), T = a(), E = u.useContext(m), D = u.useContext(c), O = u.useCallback((e) => {
+		if (e && D !== null) return s(D, e);
 	}, [D]), k = n(x, O), A = v === void 0 ? h : /* @__PURE__ */ f(l, {
 		layerId: v,
 		children: h
@@ -31,7 +31,7 @@ var h = ({ children: h, container: g, layer: _ = "overlay", layerId: v, disabled
 		"data-layer": _,
 		style: {
 			position: "relative",
-			zIndex: `calc(${a[_]} + ${E})`
+			zIndex: `calc(${o[_]} + ${E})`
 		},
 		children: /* @__PURE__ */ f(m.Provider, {
 			value: E + 1,

package/dist/components/table/DataGrid.cjs

@@ -1,2 +1,2 @@
-"use client";const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/cn.cjs"),n=require("../../lib/children.cjs"),r=require("../../lib/dev.cjs"),i=require("../../lib/composeEventHandlers.cjs"),a=require("../../lib/classNames.cjs"),o=require("../../hooks/useControllable.cjs"),s=require("../../hooks/useId.cjs"),c=require("../../hooks/useMergedRefs.cjs"),l=require("../../lib/styles.cjs"),u=require("./useGridNavigation.cjs");let d=require("react");d=e.__toESM(d,1);let f=require("react/jsx-runtime");var p=`Select all rows`,m=`Selection`;function h(e,t=!1){let n=new Set(e),r=new Map,i=0,a=`none`,o=t,s,c=new Set,l=new Set,u=e=>{for(let t of Array.from(e))t()},d=()=>{if(s!==void 0)return s;let e=null;for(let t of n){if(r.has(t)){e=t;break}e??=t}return s=e,e},f=e=>{if(n.size<2||!n.has(e))return;let t=s;s=void 0,o&&d()!==t&&u(c)},p=()=>{let e=i===0?`none`:i===r.size?`all`:`some`;e!==a&&(a=e,u(l))},m=e=>t=>(e.add(t),()=>{e.delete(t)});return{subscribe:m(c),subscribeSelectAll:m(l),register(e){let t=r.get(e)??0;r.set(e,t+1),t===0&&n.has(e)&&(i+=1),p(),t===0&&f(e);let a=!1;return()=>{if(a)return;a=!0;let t=(r.get(e)??0)-1;if(t>0){r.set(e,t);return}r.delete(e),n.has(e)&&--i,p(),f(e)}},setSelected(e){let t=new Set(e);if(!(t.size===n.size&&e.every(e=>n.has(e)))){n=t,s=void 0,i=0;for(let e of t)r.has(e)&&(i+=1);u(c),p()}},setSingleMode(e){o=e},isSelected(e,t=!1){return t?d()===e:n.has(e)},countRegistrations(e){return r.get(e)??0},getSelectAllState(){return a},getRegistered(){return Array.from(r.keys())},prune(e){return e.filter(e=>r.has(e))}}}function g(){let e=new Map,t=new Set,n=null,r=()=>{let r=null,i=null;for(let[t,a]of e){let o=a();if(!o){if(n!==null&&e.has(n))return;continue}(!i||o.compareDocumentPosition(i)&Node.DOCUMENT_POSITION_FOLLOWING)&&(r=t,i=o)}if(r===null&&(r=e.keys().next().value??null),r!==n){n=r;for(let e of Array.from(t))e()}};return{subscribe(e){return t.add(e),()=>{t.delete(e)}},register(t,n){return e.set(t,n),r(),()=>{e.delete(t),r()}},getFirst:()=>n,refresh:r}}var _=d.createContext(null),v=d.createContext(null),y=d.createContext(`body`),b=d.createContext(null),x=d.createContext(!0),S={selectionMode:`none`,store:h([]),toggleRow:()=>{},toggleAll:()=>{},radioName:``,selectAllLabel:p,selectionHeaderLabel:m},C={sort:null,requestSort:()=>{}};function w(e){return d.useContext(_)||(r.reportMissingContext(e,`DataGrid`),S)}function T(e){return d.useContext(v)||(r.reportMissingContext(e,`DataGrid`),C)}var E=[];function D(e){return e===void 0?void 0:Array.from(e)}function O(e,t){return e.length===t.length&&e.every((e,n)=>e===t[n])}function k({key:e,node:t}){return(0,f.jsx)(d.Fragment,{children:t},e)}function ee(e){r.warnOnce(`DataGrid:duplicate-rowId:${e}`,`DataGrid: several rows share the rowId "${e}". Row ids must be unique within a DataGrid; rows with the same rowId are selected and deselected together.`)}var A=`px-4 py-3 border-b border-border`,j=`w-10 px-3 py-3 border-b border-border`,M=`accent-primary cursor-pointer`,N=e=>{let{sort:l,defaultSort:g,sortColumn:y,defaultSortColumn:b,sortDirection:x,defaultSortDirection:S,onSortChange:C,selectionMode:w=`none`,selectedItems:T,defaultSelectedItems:ee,onSelectedItemsChange:A,selectedKeys:j,defaultSelectedKeys:M,onSelectionChange:N,labels:P,columns:F,containerProps:I,children:L,className:z,onKeyDown:V,onFocus:H,onBlur:U,ref:te,...ne}=e,W=l!==void 0||g!==void 0,[re,ie]=d.useState(W);W&&!re&&ie(!0);let ae=re||W,oe=y!==void 0||x!==void 0;y!==void 0&&r.warnDeprecated(`DataGrid`,`sortColumn`,`sort`),x!==void 0&&r.warnDeprecated(`DataGrid`,`sortDirection`,`sort`),b!==void 0&&r.warnDeprecated(`DataGrid`,`defaultSortColumn`,`defaultSort`),S!==void 0&&r.warnDeprecated(`DataGrid`,`defaultSortDirection`,`defaultSort`);let se=W&&(oe||b!==void 0||S!==void 0);d.useEffect(()=>{se&&r.warnOnce(`DataGrid:mixed-sort`,"DataGrid: do not mix `sort`/`defaultSort` with the deprecated `sortColumn`/`sortDirection`/`defaultSortColumn`/`defaultSortDirection`. `sort`/`defaultSort` win.")},[se]),d.useEffect(()=>{W||(y!==void 0&&x===void 0?r.warnOnce(`DataGrid:sortColumn-without-sortDirection`,"DataGrid: `sortColumn` is controlled but `sortDirection` is not (mixed control). The direction is kept internally and toggles on repeated clicks, as in 0.4. Pass `sort` (`{ columnId, direction }`) to control both."):x!==void 0&&y===void 0&&r.warnOnce(`DataGrid:sortDirection-without-sortColumn`,"DataGrid: `sortDirection` is controlled but `sortColumn` is not (mixed control). The column is kept internally and follows the clicked header, as in 0.4. Pass `sort` (`{ columnId, direction }`) to control both."))},[W,y,x]);let[G,ce]=d.useState(()=>({column:b??``,direction:S??`ascending`})),le=d.useMemo(()=>{if(y===void 0&&x===void 0)return;let e=y??G.column;return e===``?null:{columnId:e,direction:x??G.direction}},[y,x,G]),ue=d.useMemo(()=>b?{columnId:b,direction:S??`ascending`}:null,[b,S]),de=W?l:le,fe=g===void 0?ue:g,[pe,me]=o.useControllable(de,fe,e=>{e&&(W||ce(t=>t.column===e.columnId&&t.direction===e.direction?t:{column:e.columnId,direction:e.direction}),C&&(ae?C(e):C(e.columnId,e.direction)))}),he=d.useCallback(e=>{me(t=>({columnId:e,direction:t?.columnId===e&&t.direction===`ascending`?`descending`:`ascending`}))},[me]),ge=d.useMemo(()=>({sort:pe,requestSort:he}),[pe,he]);N!==void 0&&r.warnDeprecated(`DataGrid`,`onSelectionChange`,`onSelectedItemsChange`);let _e=d.useMemo(()=>D(j),[j]),ve=d.useMemo(()=>D(M),[M]),ye=r.resolveDeprecatedProp(`DataGrid`,T,_e,`selectedKeys`,`selectedItems`),be=r.resolveDeprecatedProp(`DataGrid`,ee,ve,`defaultSelectedKeys`,`defaultSelectedItems`)??E,[K,q]=o.useControllable(ye,be,e=>{A?.([...e]),N?.(new Set(e))}),J=w===`single`,[Y]=d.useState(()=>h(K,J));d.useLayoutEffect(()=>{Y.setSelected(K)},[Y,K]),d.useLayoutEffect(()=>{Y.setSingleMode(J)},[Y,J]);let xe=d.useCallback(e=>{q(t=>{let n=Y.prune(t),r;return r=J?n[0]===e?[]:[e]:n.includes(e)?n.filter(t=>t!==e):[...n,e],O(r,t)?t:r})},[J,q,Y]),X=K.length;d.useEffect(()=>{J&&X>1&&r.warnOnce(`DataGrid:single-several-selected`,`DataGrid: a single-selection grid (selectionMode "single") has ${X} selected row ids; only the first one that is rendered is selected. Pass at most one id in \`selectedItems\`/\`defaultSelectedItems\`, or use selectionMode="multiple".`)},[J,X]);let Se=d.useCallback(()=>{q(e=>{let t=Y.prune(e),n=Y.getRegistered(),r=n.length>0&&n.every(e=>t.includes(e))?[]:n;return O(r,e)?e:r})},[q,Y]),Ce=s.useId(`wave-datagrid-selection`),we=P?.selectAll??p,Te=P?.selectionHeader??m,Ee=d.useMemo(()=>({selectionMode:w,store:Y,toggleRow:xe,toggleAll:Se,radioName:Ce,selectAllLabel:we,selectionHeaderLabel:Te}),[w,Y,xe,Se,Ce,we,Te]),{gridRef:De,gridProps:Z}=u.useGridNavigation(),Oe=c.useMergedRefs(te,De),ke=L,Q=F?n.flattenChildren(L):[];if(F&&!Q.some(({node:e})=>n.isElementOfType(e,R))){let e=({node:e})=>n.isElementOfType(e,`caption`);ke=(0,f.jsxs)(f.Fragment,{children:[Q.filter(e).map(k),(0,f.jsx)(R,{children:(0,f.jsx)(`tr`,{children:F.map(e=>(0,f.jsx)(B,{columnId:e.id,sortable:e.sortable,children:e.label},e.id))})}),Q.filter(t=>!e(t)).map(k)]})}let{className:Ae,"aria-label":je,"aria-labelledby":Me,...Ne}=I??{},$=Ne.role!==void 0,Pe=!$&&(je!==void 0||Me!==void 0);return d.useEffect(()=>{Pe&&r.warnOnce(`DataGrid:container-name-without-role`,'DataGrid: `containerProps["aria-label"]`/`["aria-labelledby"]` is ignored because the wrapper has no role. Name the grid itself (`aria-label` on DataGrid), or pass a `role` (e.g. "region") in `containerProps` too.')},[Pe]),(0,f.jsx)(_.Provider,{value:Ee,children:(0,f.jsx)(v.Provider,{value:ge,children:(0,f.jsx)(`div`,{...Ne,"aria-label":$?je:void 0,"aria-labelledby":$?Me:void 0,className:t.cn(a.dataGridClassNames.container,`overflow-x-auto rounded-md border border-border`,Ae),children:(0,f.jsx)(`table`,{ref:Oe,role:`grid`,"aria-multiselectable":w===`multiple`||void 0,className:t.cn(a.dataGridClassNames.root,`w-full border-separate border-spacing-0`,z),...ne,onKeyDown:i.composeEventHandlers(V,Z.onKeyDown),onFocus:i.composeEventHandlers(H,Z.onFocus,{checkDefaultPrevented:!1}),onBlur:i.composeEventHandlers(U,Z.onBlur,{checkDefaultPrevented:!1}),children:ke})})})})};N.displayName=`DataGrid`;function P({selectionMode:e,ref:n}){let{store:r,toggleAll:i,selectAllLabel:o,selectionHeaderLabel:s}=w(`DataGrid.Header`),c=d.useSyncExternalStore(r.subscribeSelectAll,r.getSelectAllState,r.getSelectAllState),u=d.useRef(null),[p,m]=d.useState(0);return d.useLayoutEffect(()=>{u.current&&(u.current.indeterminate=c===`some`)},[c,p]),(0,f.jsx)(`th`,{ref:n,scope:`col`,"data-selection-cell":``,className:t.cn(a.dataGridHeaderClassNames.selectionCell,j,`text-start`,l.focusRingInset),children:e===`multiple`?(0,f.jsx)(`input`,{ref:u,type:`checkbox`,"aria-label":o,checked:c===`all`,onChange:()=>{m(e=>e+1),i()},className:t.cn(a.dataGridHeaderClassNames.selectAllCheckbox,M,l.focusRingInset)}):(0,f.jsx)(`span`,{className:`sr-only`,children:s})})}var F={subscribe:()=>()=>{},register:()=>()=>{},getFirst:()=>null,refresh:()=>{}};function I({selectionMode:e,initialFirst:n}){let r=d.useContext(b)??F,[i]=d.useState(()=>({})),o=d.useRef(null),s=d.useCallback(()=>{let e=r.getFirst();return e===null?n:e===i},[r,i,n]),c=d.useCallback(()=>n,[n]),u=d.useSyncExternalStore(r.subscribe,s,c);return d.useLayoutEffect(()=>r.register(i,()=>o.current),[r,i]),u?(0,f.jsx)(P,{ref:o,selectionMode:e}):(0,f.jsx)(`td`,{ref:o,"data-selection-cell":``,className:t.cn(a.dataGridHeaderClassNames.selectionCell,j,l.focusRingInset)})}function L(e,t){let r=!0,i=e=>d.Children.map(e,e=>{if(n.isElementOfType(e,d.Fragment))return d.cloneElement(e,void 0,i(e.props.children));if(!d.isValidElement(e))return e;let a=r;if(r=!1,n.isElementOfType(e,`tr`)){let n=t===`none`?null:(0,f.jsx)(I,{selectionMode:t,initialFirst:a});return d.cloneElement(e,void 0,n,e.props.children)}return(0,f.jsx)(x.Provider,{value:a,children:e})});return i(e)}var R=({children:e,className:n,ref:i,...o})=>{let{selectionMode:s}=w(`DataGrid.Header`),[l,u]=d.useState(null),p=c.useMergedRefs(i,u),[m]=d.useState(g),h=L(e,s);return d.useLayoutEffect(()=>{m.refresh()}),d.useEffect(()=>{r.isDev&&l&&s!==`none`&&Array.from(l.rows).some(e=>e.cells.length>0&&!e.cells[0].hasAttribute(`data-selection-cell`))&&r.warnOnce(`DataGrid.Header:missing-selection-cell`,"DataGrid.Header: a header row has no selection column header cell, so the header has one column fewer than the selectable rows. Render header rows as `<tr>` children of DataGrid.Header (a Fragment is fine), or use `DataGrid.Row` for a header row that another component renders.")}),(0,f.jsx)(y.Provider,{value:`header`,children:(0,f.jsx)(b.Provider,{value:m,children:(0,f.jsx)(`thead`,{ref:p,className:t.cn(a.dataGridHeaderClassNames.root,`bg-card`,n),...o,children:h})})})};R.displayName=`DataGridHeader`;var z=e=>(0,f.jsx)(`svg`,{className:t.cn(a.dataGridHeaderCellClassNames.sortIcon,`h-3 w-3 shrink-0`),viewBox:`0 0 12 12`,fill:`currentColor`,"aria-hidden":`true`,focusable:`false`,children:e===`ascending`?(0,f.jsx)(`path`,{d:`M6 2L10 8H2L6 2Z`}):(0,f.jsx)(`path`,{d:`M6 10L2 4H10L6 10Z`})}),B=({columnId:e,sortable:n=!1,children:o,className:s,onClick:c,ref:u,...p})=>{let{sort:m,requestSort:h}=T(`DataGrid.HeaderCell`),g=n&&e?e:void 0,_=g!==void 0&&m?.columnId===g?m.direction:null,v=e=>{let t=e.currentTarget.firstElementChild;g!==void 0&&t?.localName===`button`&&t.contains(e.target)&&h(g)};return d.useEffect(()=>{n&&!e&&r.warnOnce(`DataGrid.HeaderCell:sortable-without-columnId`,"DataGrid.HeaderCell: `sortable` needs a `columnId`; the header is rendered as not sortable.")},[n,e]),(0,f.jsx)(`th`,{ref:u,scope:`col`,"aria-sort":g===void 0?void 0:_??`none`,className:t.cn(a.dataGridHeaderCellClassNames.root,A,`text-start align-middle font-semibold text-caption-1 uppercase tracking-wider`,l.focusRingInset,g!==void 0&&`p-0 hover:bg-subtle-hover`,s),...p,onClick:g===void 0?c:i.composeEventHandlers(c,v),children:g===void 0?(0,f.jsx)(`span`,{className:`inline-flex items-center gap-1`,children:o}):(0,f.jsxs)(`button`,{type:`button`,className:t.cn(a.dataGridHeaderCellClassNames.button,`inline-flex w-full cursor-pointer select-none items-center gap-1 border-0 bg-transparent px-4 py-3 text-start text-inherit [font:inherit] uppercase tracking-wider`,l.focusRingInset),children:[o,_&&z(_)]})})};B.displayName=`DataGridHeaderCell`;var V=({children:e,className:n,ref:r,...i})=>(0,f.jsx)(y.Provider,{value:`body`,children:(0,f.jsx)(`tbody`,{ref:r,className:t.cn(a.dataGridBodyClassNames.root,n),...i,children:e})});V.displayName=`DataGridBody`;var H=({rowId:e,selectionLabel:o,children:c,className:u,onKeyDown:p,ref:m,...h})=>{let{selectionMode:g,store:_,toggleRow:v,radioName:b}=w(`DataGrid.Row`),S=d.useContext(y),C=d.useContext(x),T=S===`header`,E=g!==`none`&&!T,D=s.useId(`wave-datagrid-row-label`),O=g===`single`,A=d.useCallback(()=>e!==void 0&&_.isSelected(e,O),[e,_,O]),N=d.useSyncExternalStore(_.subscribe,A,A);d.useLayoutEffect(()=>{if(e===void 0||T)return;let t=_.register(e);return r.isDev&&_.countRegistrations(e)>1&&ee(e),t},[_,e,T]),d.useEffect(()=>{E&&e===void 0&&r.warnOnce(`DataGrid.Row:missing-rowId`,"DataGrid.Row: a selectable grid needs a `rowId` on every row; this row has no selection control.")},[E,e]);let P=E&&e!==void 0&&o===void 0,F=t=>{if(!E||e===void 0||t.key!==` `)return;let n=t.target;(n===t.currentTarget||n.parentElement===t.currentTarget)&&(t.preventDefault(),v(e))},L=n.flattenChildren(c),R,z=-1;if(P){let e=L.findIndex(({node:e})=>n.isElementOfType(e,U,`td`,`th`));if(e>=0){let t=L[e].node;R=t.props.id??D,t.props.id===void 0&&(z=e)}}let B=L.map(({key:e,node:t},n)=>k({key:e,node:n===z?d.cloneElement(t,{id:D}):t})),V=P&&R===void 0;d.useEffect(()=>{V&&r.warnOnce(`DataGrid.Row:selection-label`,'DataGrid.Row: no child is a `DataGrid.Cell`, `<td>` or `<th>` element, so the row selection control is named "Select row". Pass `selectionLabel` (a cell rendered by another component is not seen).')},[V]);let H=null;return T&&g!==`none`?H=(0,f.jsx)(I,{selectionMode:g,initialFirst:C}):E&&(H=(0,f.jsx)(`td`,{role:`gridcell`,"data-selection-cell":``,className:t.cn(a.dataGridRowClassNames.selectionCell,j,l.focusRingInset),children:e!==void 0&&(0,f.jsx)(`input`,{type:g===`multiple`?`checkbox`:`radio`,name:g===`single`?b:void 0,form:g===`single`?``:void 0,checked:N,onChange:()=>v(e),"aria-label":o??(R?void 0:`Select row`),"aria-labelledby":o===void 0?R:void 0,className:t.cn(a.dataGridRowClassNames.selectionControl,M,`focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-ring`)})})),(0,f.jsxs)(`tr`,{ref:m,className:t.cn(a.dataGridRowClassNames.root,!T&&`hover:bg-subtle-hover data-[selected]:bg-selected transition-colors motion-reduce:transition-none`,E&&N&&l.forcedColors.selectedContainer,u),"aria-selected":E?N:void 0,"data-selected":E&&N?``:void 0,...h,onKeyDown:i.composeEventHandlers(p,F),children:[H,B]})};H.displayName=`DataGridRow`;var U=({children:e,className:n,ref:r,...i})=>(0,f.jsx)(`td`,{ref:r,role:`gridcell`,className:t.cn(a.dataGridCellClassNames.root,A,`text-body-1`,l.focusRingInset,n),...i,children:e});U.displayName=`DataGridCell`;var te=Object.assign(N,{Header:R,HeaderCell:B,Body:V,Row:H,Cell:U});exports.DataGrid=te,exports.DataGridBody=V,exports.DataGridCell=U,exports.DataGridHeader=R,exports.DataGridHeaderCell=B,exports.DataGridRow=H,exports.createSelectionStore=h;
+"use client";const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/cn.cjs"),n=require("../../lib/children.cjs"),r=require("../../lib/dev.cjs"),i=require("../../lib/composeEventHandlers.cjs"),a=require("../../lib/classNames.cjs"),o=require("../../hooks/useControllable.cjs"),s=require("../../hooks/useId.cjs"),c=require("../../hooks/useMergedRefs.cjs"),l=require("./useGridNavigation.cjs"),u=require("../../lib/styles.cjs");let d=require("react");d=e.__toESM(d,1);let f=require("react/jsx-runtime");var p=`Select all rows`,m=`Selection`;function h(e,t=!1){let n=new Set(e),r=new Map,i=0,a=`none`,o=t,s,c=new Set,l=new Set,u=e=>{for(let t of Array.from(e))t()},d=()=>{if(s!==void 0)return s;let e=null;for(let t of n){if(r.has(t)){e=t;break}e??=t}return s=e,e},f=e=>{if(n.size<2||!n.has(e))return;let t=s;s=void 0,o&&d()!==t&&u(c)},p=()=>{let e=i===0?`none`:i===r.size?`all`:`some`;e!==a&&(a=e,u(l))},m=e=>t=>(e.add(t),()=>{e.delete(t)});return{subscribe:m(c),subscribeSelectAll:m(l),register(e){let t=r.get(e)??0;r.set(e,t+1),t===0&&n.has(e)&&(i+=1),p(),t===0&&f(e);let a=!1;return()=>{if(a)return;a=!0;let t=(r.get(e)??0)-1;if(t>0){r.set(e,t);return}r.delete(e),n.has(e)&&--i,p(),f(e)}},setSelected(e){let t=new Set(e);if(!(t.size===n.size&&e.every(e=>n.has(e)))){n=t,s=void 0,i=0;for(let e of t)r.has(e)&&(i+=1);u(c),p()}},setSingleMode(e){o=e},isSelected(e,t=!1){return t?d()===e:n.has(e)},countRegistrations(e){return r.get(e)??0},getSelectAllState(){return a},getRegistered(){return Array.from(r.keys())},prune(e){return e.filter(e=>r.has(e))}}}function g(){let e=new Map,t=new Set,n=null,r=()=>{let r=null,i=null;for(let[t,a]of e){let o=a();if(!o){if(n!==null&&e.has(n))return;continue}(!i||o.compareDocumentPosition(i)&Node.DOCUMENT_POSITION_FOLLOWING)&&(r=t,i=o)}if(r===null&&(r=e.keys().next().value??null),r!==n){n=r;for(let e of Array.from(t))e()}};return{subscribe(e){return t.add(e),()=>{t.delete(e)}},register(t,n){return e.set(t,n),r(),()=>{e.delete(t),r()}},getFirst:()=>n,refresh:r}}var _=d.createContext(null),v=d.createContext(null),y=d.createContext(`body`),b=d.createContext(null),x=d.createContext(!0),S={selectionMode:`none`,store:h([]),toggleRow:()=>{},toggleAll:()=>{},radioName:``,selectAllLabel:p,selectionHeaderLabel:m},C={sort:null,requestSort:()=>{}};function w(e){return d.useContext(_)||(r.reportMissingContext(e,`DataGrid`),S)}function T(e){return d.useContext(v)||(r.reportMissingContext(e,`DataGrid`),C)}var E=[];function D(e){return e===void 0?void 0:Array.from(e)}function O(e,t){return e.length===t.length&&e.every((e,n)=>e===t[n])}function k({key:e,node:t}){return(0,f.jsx)(d.Fragment,{children:t},e)}function ee(e){r.warnOnce(`DataGrid:duplicate-rowId:${e}`,`DataGrid: several rows share the rowId "${e}". Row ids must be unique within a DataGrid; rows with the same rowId are selected and deselected together.`)}var A=`px-4 py-3 border-b border-border`,j=`w-10 px-3 py-3 border-b border-border`,M=`accent-primary cursor-pointer`,N=e=>{let{sort:u,defaultSort:g,sortColumn:y,defaultSortColumn:b,sortDirection:x,defaultSortDirection:S,onSortChange:C,selectionMode:w=`none`,selectedItems:T,defaultSelectedItems:ee,onSelectedItemsChange:A,selectedKeys:j,defaultSelectedKeys:M,onSelectionChange:N,labels:P,columns:F,containerProps:I,children:L,className:z,onKeyDown:V,onFocus:H,onBlur:U,ref:te,...ne}=e,W=u!==void 0||g!==void 0,[re,ie]=d.useState(W);W&&!re&&ie(!0);let ae=re||W,oe=y!==void 0||x!==void 0;y!==void 0&&r.warnDeprecated(`DataGrid`,`sortColumn`,`sort`),x!==void 0&&r.warnDeprecated(`DataGrid`,`sortDirection`,`sort`),b!==void 0&&r.warnDeprecated(`DataGrid`,`defaultSortColumn`,`defaultSort`),S!==void 0&&r.warnDeprecated(`DataGrid`,`defaultSortDirection`,`defaultSort`);let se=W&&(oe||b!==void 0||S!==void 0);d.useEffect(()=>{se&&r.warnOnce(`DataGrid:mixed-sort`,"DataGrid: do not mix `sort`/`defaultSort` with the deprecated `sortColumn`/`sortDirection`/`defaultSortColumn`/`defaultSortDirection`. `sort`/`defaultSort` win.")},[se]),d.useEffect(()=>{W||(y!==void 0&&x===void 0?r.warnOnce(`DataGrid:sortColumn-without-sortDirection`,"DataGrid: `sortColumn` is controlled but `sortDirection` is not (mixed control). The direction is kept internally and toggles on repeated clicks, as in 0.4. Pass `sort` (`{ columnId, direction }`) to control both."):x!==void 0&&y===void 0&&r.warnOnce(`DataGrid:sortDirection-without-sortColumn`,"DataGrid: `sortDirection` is controlled but `sortColumn` is not (mixed control). The column is kept internally and follows the clicked header, as in 0.4. Pass `sort` (`{ columnId, direction }`) to control both."))},[W,y,x]);let[G,ce]=d.useState(()=>({column:b??``,direction:S??`ascending`})),le=d.useMemo(()=>{if(y===void 0&&x===void 0)return;let e=y??G.column;return e===``?null:{columnId:e,direction:x??G.direction}},[y,x,G]),ue=d.useMemo(()=>b?{columnId:b,direction:S??`ascending`}:null,[b,S]),de=W?u:le,fe=g===void 0?ue:g,[pe,me]=o.useControllable(de,fe,e=>{e&&(W||ce(t=>t.column===e.columnId&&t.direction===e.direction?t:{column:e.columnId,direction:e.direction}),C&&(ae?C(e):C(e.columnId,e.direction)))}),he=d.useCallback(e=>{me(t=>({columnId:e,direction:t?.columnId===e&&t.direction===`ascending`?`descending`:`ascending`}))},[me]),ge=d.useMemo(()=>({sort:pe,requestSort:he}),[pe,he]);N!==void 0&&r.warnDeprecated(`DataGrid`,`onSelectionChange`,`onSelectedItemsChange`);let _e=d.useMemo(()=>D(j),[j]),ve=d.useMemo(()=>D(M),[M]),ye=r.resolveDeprecatedProp(`DataGrid`,T,_e,`selectedKeys`,`selectedItems`),be=r.resolveDeprecatedProp(`DataGrid`,ee,ve,`defaultSelectedKeys`,`defaultSelectedItems`)??E,[K,q]=o.useControllable(ye,be,e=>{A?.([...e]),N?.(new Set(e))}),J=w===`single`,[Y]=d.useState(()=>h(K,J));d.useLayoutEffect(()=>{Y.setSelected(K)},[Y,K]),d.useLayoutEffect(()=>{Y.setSingleMode(J)},[Y,J]);let xe=d.useCallback(e=>{q(t=>{let n=Y.prune(t),r;return r=J?n[0]===e?[]:[e]:n.includes(e)?n.filter(t=>t!==e):[...n,e],O(r,t)?t:r})},[J,q,Y]),X=K.length;d.useEffect(()=>{J&&X>1&&r.warnOnce(`DataGrid:single-several-selected`,`DataGrid: a single-selection grid (selectionMode "single") has ${X} selected row ids; only the first one that is rendered is selected. Pass at most one id in \`selectedItems\`/\`defaultSelectedItems\`, or use selectionMode="multiple".`)},[J,X]);let Se=d.useCallback(()=>{q(e=>{let t=Y.prune(e),n=Y.getRegistered(),r=n.length>0&&n.every(e=>t.includes(e))?[]:n;return O(r,e)?e:r})},[q,Y]),Ce=s.useId(`wave-datagrid-selection`),we=P?.selectAll??p,Te=P?.selectionHeader??m,Ee=d.useMemo(()=>({selectionMode:w,store:Y,toggleRow:xe,toggleAll:Se,radioName:Ce,selectAllLabel:we,selectionHeaderLabel:Te}),[w,Y,xe,Se,Ce,we,Te]),{gridRef:De,gridProps:Z}=l.useGridNavigation(),Oe=c.useMergedRefs(te,De),ke=L,Q=F?n.flattenChildren(L):[];if(F&&!Q.some(({node:e})=>n.isElementOfType(e,R))){let e=({node:e})=>n.isElementOfType(e,`caption`);ke=(0,f.jsxs)(f.Fragment,{children:[Q.filter(e).map(k),(0,f.jsx)(R,{children:(0,f.jsx)(`tr`,{children:F.map(e=>(0,f.jsx)(B,{columnId:e.id,sortable:e.sortable,children:e.label},e.id))})}),Q.filter(t=>!e(t)).map(k)]})}let{className:Ae,"aria-label":je,"aria-labelledby":Me,...Ne}=I??{},$=Ne.role!==void 0,Pe=!$&&(je!==void 0||Me!==void 0);return d.useEffect(()=>{Pe&&r.warnOnce(`DataGrid:container-name-without-role`,'DataGrid: `containerProps["aria-label"]`/`["aria-labelledby"]` is ignored because the wrapper has no role. Name the grid itself (`aria-label` on DataGrid), or pass a `role` (e.g. "region") in `containerProps` too.')},[Pe]),(0,f.jsx)(_.Provider,{value:Ee,children:(0,f.jsx)(v.Provider,{value:ge,children:(0,f.jsx)(`div`,{...Ne,"aria-label":$?je:void 0,"aria-labelledby":$?Me:void 0,className:t.cn(a.dataGridClassNames.container,`overflow-x-auto rounded-md border border-border`,Ae),children:(0,f.jsx)(`table`,{ref:Oe,role:`grid`,"aria-multiselectable":w===`multiple`||void 0,className:t.cn(a.dataGridClassNames.root,`w-full border-separate border-spacing-0`,z),...ne,onKeyDown:i.composeEventHandlers(V,Z.onKeyDown),onFocus:i.composeEventHandlers(H,Z.onFocus,{checkDefaultPrevented:!1}),onBlur:i.composeEventHandlers(U,Z.onBlur,{checkDefaultPrevented:!1}),children:ke})})})})};N.displayName=`DataGrid`;function P({selectionMode:e,ref:n}){let{store:r,toggleAll:i,selectAllLabel:o,selectionHeaderLabel:s}=w(`DataGrid.Header`),c=d.useSyncExternalStore(r.subscribeSelectAll,r.getSelectAllState,r.getSelectAllState),l=d.useRef(null),[p,m]=d.useState(0);return d.useLayoutEffect(()=>{l.current&&(l.current.indeterminate=c===`some`)},[c,p]),(0,f.jsx)(`th`,{ref:n,scope:`col`,"data-selection-cell":``,className:t.cn(a.dataGridHeaderClassNames.selectionCell,j,`text-start`,u.focusRingInset),children:e===`multiple`?(0,f.jsx)(`input`,{ref:l,type:`checkbox`,"aria-label":o,checked:c===`all`,onChange:()=>{m(e=>e+1),i()},className:t.cn(a.dataGridHeaderClassNames.selectAllCheckbox,M,u.focusRingInset)}):(0,f.jsx)(`span`,{className:`sr-only`,children:s})})}var F={subscribe:()=>()=>{},register:()=>()=>{},getFirst:()=>null,refresh:()=>{}};function I({selectionMode:e,initialFirst:n}){let r=d.useContext(b)??F,[i]=d.useState(()=>({})),o=d.useRef(null),s=d.useCallback(()=>{let e=r.getFirst();return e===null?n:e===i},[r,i,n]),c=d.useCallback(()=>n,[n]),l=d.useSyncExternalStore(r.subscribe,s,c);return d.useLayoutEffect(()=>r.register(i,()=>o.current),[r,i]),l?(0,f.jsx)(P,{ref:o,selectionMode:e}):(0,f.jsx)(`td`,{ref:o,"data-selection-cell":``,className:t.cn(a.dataGridHeaderClassNames.selectionCell,j,u.focusRingInset)})}function L(e,t){let r=!0,i=e=>d.Children.map(e,e=>{if(n.isElementOfType(e,d.Fragment))return d.cloneElement(e,void 0,i(e.props.children));if(!d.isValidElement(e))return e;let a=r;if(r=!1,n.isElementOfType(e,`tr`)){let n=t===`none`?null:(0,f.jsx)(I,{selectionMode:t,initialFirst:a});return d.cloneElement(e,void 0,n,e.props.children)}return(0,f.jsx)(x.Provider,{value:a,children:e})});return i(e)}var R=({children:e,className:n,ref:i,...o})=>{let{selectionMode:s}=w(`DataGrid.Header`),[l,u]=d.useState(null),p=c.useMergedRefs(i,u),[m]=d.useState(g),h=L(e,s);return d.useLayoutEffect(()=>{m.refresh()}),d.useEffect(()=>{r.isDev&&l&&s!==`none`&&Array.from(l.rows).some(e=>e.cells.length>0&&!e.cells[0].hasAttribute(`data-selection-cell`))&&r.warnOnce(`DataGrid.Header:missing-selection-cell`,"DataGrid.Header: a header row has no selection column header cell, so the header has one column fewer than the selectable rows. Render header rows as `<tr>` children of DataGrid.Header (a Fragment is fine), or use `DataGrid.Row` for a header row that another component renders.")}),(0,f.jsx)(y.Provider,{value:`header`,children:(0,f.jsx)(b.Provider,{value:m,children:(0,f.jsx)(`thead`,{ref:p,className:t.cn(a.dataGridHeaderClassNames.root,`bg-card`,n),...o,children:h})})})};R.displayName=`DataGridHeader`;var z=e=>(0,f.jsx)(`svg`,{className:t.cn(a.dataGridHeaderCellClassNames.sortIcon,`h-3 w-3 shrink-0`),viewBox:`0 0 12 12`,fill:`currentColor`,"aria-hidden":`true`,focusable:`false`,children:e===`ascending`?(0,f.jsx)(`path`,{d:`M6 2L10 8H2L6 2Z`}):(0,f.jsx)(`path`,{d:`M6 10L2 4H10L6 10Z`})}),B=({columnId:e,sortable:n=!1,children:o,className:s,onClick:c,ref:l,...p})=>{let{sort:m,requestSort:h}=T(`DataGrid.HeaderCell`),g=n&&e?e:void 0,_=g!==void 0&&m?.columnId===g?m.direction:null,v=e=>{let t=e.currentTarget.firstElementChild;g!==void 0&&t?.localName===`button`&&t.contains(e.target)&&h(g)};return d.useEffect(()=>{n&&!e&&r.warnOnce(`DataGrid.HeaderCell:sortable-without-columnId`,"DataGrid.HeaderCell: `sortable` needs a `columnId`; the header is rendered as not sortable.")},[n,e]),(0,f.jsx)(`th`,{ref:l,scope:`col`,"aria-sort":g===void 0?void 0:_??`none`,className:t.cn(a.dataGridHeaderCellClassNames.root,A,`text-start align-middle font-semibold text-caption-1 uppercase tracking-wider`,u.focusRingInset,g!==void 0&&`p-0 hover:bg-subtle-hover`,s),...p,onClick:g===void 0?c:i.composeEventHandlers(c,v),children:g===void 0?(0,f.jsx)(`span`,{className:`inline-flex items-center gap-1`,children:o}):(0,f.jsxs)(`button`,{type:`button`,className:t.cn(a.dataGridHeaderCellClassNames.button,`inline-flex w-full cursor-pointer select-none items-center gap-1 border-0 bg-transparent px-4 py-3 text-start text-inherit [font:inherit] uppercase tracking-wider`,u.focusRingInset),children:[o,_&&z(_)]})})};B.displayName=`DataGridHeaderCell`;var V=({children:e,className:n,ref:r,...i})=>(0,f.jsx)(y.Provider,{value:`body`,children:(0,f.jsx)(`tbody`,{ref:r,className:t.cn(a.dataGridBodyClassNames.root,n),...i,children:e})});V.displayName=`DataGridBody`;var H=({rowId:e,selectionLabel:o,children:c,className:l,onKeyDown:p,ref:m,...h})=>{let{selectionMode:g,store:_,toggleRow:v,radioName:b}=w(`DataGrid.Row`),S=d.useContext(y),C=d.useContext(x),T=S===`header`,E=g!==`none`&&!T,D=s.useId(`wave-datagrid-row-label`),O=g===`single`,A=d.useCallback(()=>e!==void 0&&_.isSelected(e,O),[e,_,O]),N=d.useSyncExternalStore(_.subscribe,A,A);d.useLayoutEffect(()=>{if(e===void 0||T)return;let t=_.register(e);return r.isDev&&_.countRegistrations(e)>1&&ee(e),t},[_,e,T]),d.useEffect(()=>{E&&e===void 0&&r.warnOnce(`DataGrid.Row:missing-rowId`,"DataGrid.Row: a selectable grid needs a `rowId` on every row; this row has no selection control.")},[E,e]);let P=E&&e!==void 0&&o===void 0,F=t=>{if(!E||e===void 0||t.key!==` `)return;let n=t.target;(n===t.currentTarget||n.parentElement===t.currentTarget)&&(t.preventDefault(),v(e))},L=n.flattenChildren(c),R,z=-1;if(P){let e=L.findIndex(({node:e})=>n.isElementOfType(e,U,`td`,`th`));if(e>=0){let t=L[e].node;R=t.props.id??D,t.props.id===void 0&&(z=e)}}let B=L.map(({key:e,node:t},n)=>k({key:e,node:n===z?d.cloneElement(t,{id:D}):t})),V=P&&R===void 0;d.useEffect(()=>{V&&r.warnOnce(`DataGrid.Row:selection-label`,'DataGrid.Row: no child is a `DataGrid.Cell`, `<td>` or `<th>` element, so the row selection control is named "Select row". Pass `selectionLabel` (a cell rendered by another component is not seen).')},[V]);let H=null;return T&&g!==`none`?H=(0,f.jsx)(I,{selectionMode:g,initialFirst:C}):E&&(H=(0,f.jsx)(`td`,{role:`gridcell`,"data-selection-cell":``,className:t.cn(a.dataGridRowClassNames.selectionCell,j,u.focusRingInset),children:e!==void 0&&(0,f.jsx)(`input`,{type:g===`multiple`?`checkbox`:`radio`,name:g===`single`?b:void 0,form:g===`single`?``:void 0,checked:N,onChange:()=>v(e),"aria-label":o??(R?void 0:`Select row`),"aria-labelledby":o===void 0?R:void 0,className:t.cn(a.dataGridRowClassNames.selectionControl,M,`focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-ring`)})})),(0,f.jsxs)(`tr`,{ref:m,className:t.cn(a.dataGridRowClassNames.root,!T&&`hover:bg-subtle-hover data-[selected]:bg-selected transition-colors motion-reduce:transition-none`,E&&N&&u.forcedColors.selectedContainer,l),"aria-selected":E?N:void 0,"data-selected":E&&N?``:void 0,...h,onKeyDown:i.composeEventHandlers(p,F),children:[H,B]})};H.displayName=`DataGridRow`;var U=({children:e,className:n,ref:r,...i})=>(0,f.jsx)(`td`,{ref:r,role:`gridcell`,className:t.cn(a.dataGridCellClassNames.root,A,`text-body-1`,u.focusRingInset,n),...i,children:e});U.displayName=`DataGridCell`;var te=Object.assign(N,{Header:R,HeaderCell:B,Body:V,Row:H,Cell:U});exports.DataGrid=te,exports.DataGridBody=V,exports.DataGridCell=U,exports.DataGridHeader=R,exports.DataGridHeaderCell=B,exports.DataGridRow=H,exports.createSelectionStore=h;
 //# sourceMappingURL=DataGrid.cjs.map