@cube-dev/ui-kit 0.204.0 → 0.206.0

package/dist/components/actions/ItemActionsWrapper.js

@@ -1,11 +1,12 @@
-/** @license MIT | @cube-dev/ui-kit v0.204.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.206.0 | Cube Dev Team */
 import { DisplayTransition } from "../helpers/DisplayTransition/DisplayTransition.js";
 import { ITEM_RESTING_COLOR_VARIANTS, ROW_STATE_ALIASES, resolveItemVariant } from "../../data/item-themes.js";
 import { ItemActionProvider } from "./ItemActionContext.js";
 import { c } from "react/compiler-runtime";
 import { mergeStyles, tasty } from "@tenphi/tasty";
-import { useLayoutEffect, useRef, useState } from "react";
+import { useEffectEvent, useLayoutEffect, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { flushSync } from "react-dom";
 import { useFocusWithin, useHover } from "react-aria";
 import { ClearPressResponder } from "@react-aria/interactions";
 //#region src/components/actions/ItemActionsWrapper.tsx
@@ -121,11 +122,66 @@ function ItemActionIcon(props) {
 	return t0;
 }
 /**
+* The width the row reserves for the run, or `null` while the run has no box.
+*
+* `isFirst` says the width is where the row STARTS rather than a change to it:
+* the first one since the run last had no box — on mount, or once a closed
+* container opens — or since it was last observed (an `<Activity>` hide, a run
+* swapped for another element). The ref carries that across measurements.
+*/
+function measureActionsWidth(el, isUnmeasuredRef) {
+	const width = el.offsetWidth;
+	if (!width && !el.getClientRects().length) {
+		isUnmeasuredRef.current = true;
+		return null;
+	}
+	const isFirst = isUnmeasuredRef.current;
+	isUnmeasuredRef.current = false;
+	return {
+		width: el.childElementCount ? width : 0,
+		isFirst
+	};
+}
+/**
+* One observer for every run on the page, so runs that resize together arrive
+* in one delivery. A closed panel full of rows that opens is then measured in
+* one layout and published in one commit, not a forced layout and a commit per
+* row. It exists only while something is observed, so a test that swaps the
+* global `ResizeObserver` between cases gets its own.
+*/
+let runObserver = null;
+const measureRunByElement = /* @__PURE__ */ new Map();
+function publishRunWidths(entries) {
+	const publishes = [];
+	for (const entry of entries) {
+		const publish = measureRunByElement.get(entry.target)?.();
+		if (publish) publishes.push(publish);
+	}
+	if (!publishes.length) return;
+	flushSync(() => {
+		for (const publish of publishes) publish();
+	});
+}
+/** Starts observing a run, and returns what stops it. */
+function observeRun(el, measure) {
+	runObserver ??= new ResizeObserver(publishRunWidths);
+	measureRunByElement.set(el, measure);
+	runObserver.observe(el, { box: "border-box" });
+	return () => {
+		measureRunByElement.delete(el);
+		if (measureRunByElement.size) runObserver?.unobserve(el);
+		else {
+			runObserver?.disconnect();
+			runObserver = null;
+		}
+	};
+}
+/**
 * Wraps a row in the sibling-actions layout and publishes `--actions-width` so
 * the row can reserve the space the run covers.
 */
 function ItemActionsWrapper(props) {
-	const $ = c(60);
+	const $ = c(65);
 	const { children, actions, type: t0, theme: t1, size: t2, isDisabled, disableActionsFocus, autoHideActions: t3, preserveActionsSpace: t4, mods, styles, actionsProps } = props;
 	const type = t0 === void 0 ? "item" : t0;
 	const theme = t1 === void 0 ? "default" : t1;
@@ -136,18 +192,17 @@ function ItemActionsWrapper(props) {
 	const [actionsWidth, setActionsWidth] = useState(0);
 	const [areActionsVisible, setAreActionsVisible] = useState(false);
 	const [skipWidthTransition, setSkipWidthTransition] = useState(false);
-	const isMountPassRef = useRef(true);
+	const isUnmeasuredRef = useRef(true);
+	const isTransitionedRun = autoHideActions && !preserveActionsSpace;
 	let t5;
 	if ($[0] !== actionsWidth || $[1] !== skipWidthTransition) {
 		t5 = () => {
 			const el = actionsRef.current;
-			const isMountPass = isMountPassRef.current;
-			isMountPassRef.current = false;
 			if (!el) return;
-			const width = el.childElementCount ? Math.round(el.offsetWidth) : 0;
-			if (width !== actionsWidth) {
-				if (isMountPass) setSkipWidthTransition(true);
-				setActionsWidth(width);
+			const measured = measureActionsWidth(el, isUnmeasuredRef);
+			if (measured && measured.width !== actionsWidth) {
+				if (measured.isFirst) setSkipWidthTransition(true);
+				setActionsWidth(measured.width);
 			} else if (skipWidthTransition) setSkipWidthTransition(false);
 		};
 		$[0] = actionsWidth;
@@ -169,23 +224,58 @@ function ItemActionsWrapper(props) {
 		$[7] = t6;
 	} else t6 = $[7];
 	useLayoutEffect(t5, t6);
-	const [isFocusWithin, setIsFocusWithin] = useState(false);
-	const [hasPressed, setHasPressed] = useState(false);
 	let t7;
-	if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
-		t7 = {};
-		$[8] = t7;
-	} else t7 = $[8];
-	const { hoverProps, isHovered } = useHover(t7);
+	if ($[8] !== actionsWidth) {
+		t7 = (el_0) => {
+			const measured_0 = measureActionsWidth(el_0, isUnmeasuredRef);
+			if (!measured_0 || measured_0.width === actionsWidth) return;
+			return () => {
+				if (measured_0.isFirst) setSkipWidthTransition(true);
+				setActionsWidth(measured_0.width);
+			};
+		};
+		$[8] = actionsWidth;
+		$[9] = t7;
+	} else t7 = $[9];
+	const onActionsResize = useEffectEvent(t7);
 	let t8;
-	if ($[9] === Symbol.for("react.memo_cache_sentinel")) {
-		t8 = { onFocusWithinChange: setIsFocusWithin };
-		$[9] = t8;
-	} else t8 = $[9];
-	const { focusWithinProps } = useFocusWithin(t8);
+	if ($[10] !== onActionsResize) {
+		t8 = () => {
+			const el_1 = actionsRef.current;
+			if (!el_1 || typeof ResizeObserver === "undefined") return;
+			const stopObserving = observeRun(el_1, () => onActionsResize(el_1));
+			return () => {
+				stopObserving();
+				isUnmeasuredRef.current = true;
+			};
+		};
+		$[10] = onActionsResize;
+		$[11] = t8;
+	} else t8 = $[11];
 	let t9;
-	if ($[10] !== autoHideActions) {
-		t9 = () => {
+	if ($[12] !== isTransitionedRun) {
+		t9 = [isTransitionedRun];
+		$[12] = isTransitionedRun;
+		$[13] = t9;
+	} else t9 = $[13];
+	useLayoutEffect(t8, t9);
+	const [isFocusWithin, setIsFocusWithin] = useState(false);
+	const [hasPressed, setHasPressed] = useState(false);
+	let t10;
+	if ($[14] === Symbol.for("react.memo_cache_sentinel")) {
+		t10 = {};
+		$[14] = t10;
+	} else t10 = $[14];
+	const { hoverProps, isHovered } = useHover(t10);
+	let t11;
+	if ($[15] === Symbol.for("react.memo_cache_sentinel")) {
+		t11 = { onFocusWithinChange: setIsFocusWithin };
+		$[15] = t11;
+	} else t11 = $[15];
+	const { focusWithinProps } = useFocusWithin(t11);
+	let t12;
+	if ($[16] !== autoHideActions) {
+		t12 = () => {
 			const actionsEl = actionsRef.current;
 			if (!actionsEl || !autoHideActions) return;
 			const checkPressed = () => {
@@ -200,90 +290,90 @@ function ItemActionsWrapper(props) {
 			checkPressed();
 			return () => observer.disconnect();
 		};
-		$[10] = autoHideActions;
-		$[11] = t9;
-	} else t9 = $[11];
-	let t10;
-	if ($[12] !== areActionsVisible || $[13] !== autoHideActions) {
-		t10 = [areActionsVisible, autoHideActions];
-		$[12] = areActionsVisible;
-		$[13] = autoHideActions;
-		$[14] = t10;
-	} else t10 = $[14];
-	useLayoutEffect(t9, t10);
-	const shouldShowActions = isHovered || isFocusWithin || hasPressed || !autoHideActions;
-	let t11;
-	if ($[15] !== shouldShowActions) {
-		t11 = shouldShowActions ? { "actions-shown": true } : null;
-		$[15] = shouldShowActions;
-		$[16] = t11;
-	} else t11 = $[16];
-	let t12;
-	if ($[17] !== preserveActionsSpace) {
-		t12 = preserveActionsSpace ? { "preserve-actions-space": true } : null;
-		$[17] = preserveActionsSpace;
-		$[18] = t12;
-	} else t12 = $[18];
+		$[16] = autoHideActions;
+		$[17] = t12;
+	} else t12 = $[17];
 	let t13;
-	if ($[19] !== isDisabled || $[20] !== mods || $[21] !== t11 || $[22] !== t12) {
-		t13 = {
+	if ($[18] !== areActionsVisible || $[19] !== autoHideActions) {
+		t13 = [areActionsVisible, autoHideActions];
+		$[18] = areActionsVisible;
+		$[19] = autoHideActions;
+		$[20] = t13;
+	} else t13 = $[20];
+	useLayoutEffect(t12, t13);
+	const shouldShowActions = isHovered || isFocusWithin || hasPressed || !autoHideActions;
+	let t14;
+	if ($[21] !== shouldShowActions) {
+		t14 = shouldShowActions ? { "actions-shown": true } : null;
+		$[21] = shouldShowActions;
+		$[22] = t14;
+	} else t14 = $[22];
+	let t15;
+	if ($[23] !== preserveActionsSpace) {
+		t15 = preserveActionsSpace ? { "preserve-actions-space": true } : null;
+		$[23] = preserveActionsSpace;
+		$[24] = t15;
+	} else t15 = $[24];
+	let t16;
+	if ($[25] !== isDisabled || $[26] !== mods || $[27] !== t14 || $[28] !== t15) {
+		t16 = {
 			...mods,
-			...t11,
-			...t12,
+			...t14,
+			...t15,
 			disabled: isDisabled
 		};
-		$[19] = isDisabled;
-		$[20] = mods;
-		$[21] = t11;
-		$[22] = t12;
-		$[23] = t13;
-	} else t13 = $[23];
-	const finalMods = t13;
-	let t14;
-	if ($[24] !== theme || $[25] !== type) {
-		t14 = resolveItemVariant(theme, type);
-		$[24] = theme;
-		$[25] = type;
-		$[26] = t14;
-	} else t14 = $[26];
-	const t15 = areActionsVisible || !autoHideActions || preserveActionsSpace ? `${actionsWidth}px` : "0px";
-	let t16;
-	if ($[27] !== size) {
-		t16 = typeof size === "number" && { $size: `${size}px` };
-		$[27] = size;
-		$[28] = t16;
-	} else t16 = $[28];
+		$[25] = isDisabled;
+		$[26] = mods;
+		$[27] = t14;
+		$[28] = t15;
+		$[29] = t16;
+	} else t16 = $[29];
+	const finalMods = t16;
 	let t17;
-	if ($[29] !== t15 || $[30] !== t16) {
-		t17 = {
-			"$actions-width": t15,
-			...t16
+	if ($[30] !== theme || $[31] !== type) {
+		t17 = resolveItemVariant(theme, type);
+		$[30] = theme;
+		$[31] = type;
+		$[32] = t17;
+	} else t17 = $[32];
+	const t18 = areActionsVisible || !autoHideActions || preserveActionsSpace ? `${actionsWidth}px` : "0px";
+	let t19;
+	if ($[33] !== size) {
+		t19 = typeof size === "number" && { $size: `${size}px` };
+		$[33] = size;
+		$[34] = t19;
+	} else t19 = $[34];
+	let t20;
+	if ($[35] !== t18 || $[36] !== t19) {
+		t20 = {
+			"$actions-width": t18,
+			...t19
 		};
-		$[29] = t15;
-		$[30] = t16;
-		$[31] = t17;
-	} else t17 = $[31];
-	let t18;
-	if ($[32] !== children || $[33] !== shouldShowActions || $[34] !== skipWidthTransition) {
-		t18 = children({
+		$[35] = t18;
+		$[36] = t19;
+		$[37] = t20;
+	} else t20 = $[37];
+	let t21;
+	if ($[38] !== children || $[39] !== shouldShowActions || $[40] !== skipWidthTransition) {
+		t21 = children({
 			showActions: shouldShowActions,
 			skipActionsWidthTransition: skipWidthTransition
 		});
-		$[32] = children;
-		$[33] = shouldShowActions;
-		$[34] = skipWidthTransition;
-		$[35] = t18;
-	} else t18 = $[35];
-	let t19;
-	if ($[36] !== actions || $[37] !== actionsProps || $[38] !== autoHideActions || $[39] !== focusWithinProps || $[40] !== preserveActionsSpace || $[41] !== shouldShowActions) {
-		t19 = autoHideActions && !preserveActionsSpace ? /* @__PURE__ */ jsx(DisplayTransition, {
+		$[38] = children;
+		$[39] = shouldShowActions;
+		$[40] = skipWidthTransition;
+		$[41] = t21;
+	} else t21 = $[41];
+	let t22;
+	if ($[42] !== actions || $[43] !== actionsProps || $[44] !== focusWithinProps || $[45] !== isTransitionedRun || $[46] !== shouldShowActions) {
+		t22 = isTransitionedRun ? /* @__PURE__ */ jsx(DisplayTransition, {
 			exposeUnmounted: true,
 			isShown: shouldShowActions,
 			onPhaseChange: (phase) => {
 				setAreActionsVisible(phase !== "unmounted");
 			},
-			children: (t20) => {
-				const { ref: transitionRef } = t20;
+			children: (t23) => {
+				const { ref: transitionRef } = t23;
 				return /* @__PURE__ */ jsx("div", {
 					...focusWithinProps,
 					...actionsProps,
@@ -303,56 +393,55 @@ function ItemActionsWrapper(props) {
 			"data-trigger-action": "",
 			children: actions
 		});
-		$[36] = actions;
-		$[37] = actionsProps;
-		$[38] = autoHideActions;
-		$[39] = focusWithinProps;
-		$[40] = preserveActionsSpace;
-		$[41] = shouldShowActions;
-		$[42] = t19;
-	} else t19 = $[42];
-	let t20;
-	if ($[43] !== disableActionsFocus || $[44] !== isDisabled || $[45] !== t19 || $[46] !== theme || $[47] !== type) {
-		t20 = /* @__PURE__ */ jsx(ClearPressResponder, { children: /* @__PURE__ */ jsx(ItemActionProvider, {
+		$[42] = actions;
+		$[43] = actionsProps;
+		$[44] = focusWithinProps;
+		$[45] = isTransitionedRun;
+		$[46] = shouldShowActions;
+		$[47] = t22;
+	} else t22 = $[47];
+	let t23;
+	if ($[48] !== disableActionsFocus || $[49] !== isDisabled || $[50] !== t22 || $[51] !== theme || $[52] !== type) {
+		t23 = /* @__PURE__ */ jsx(ClearPressResponder, { children: /* @__PURE__ */ jsx(ItemActionProvider, {
 			type,
 			theme,
 			disableActionsFocus,
 			isDisabled,
-			children: t19
+			children: t22
 		}) });
-		$[43] = disableActionsFocus;
-		$[44] = isDisabled;
-		$[45] = t19;
-		$[46] = theme;
-		$[47] = type;
-		$[48] = t20;
-	} else t20 = $[48];
-	let t21;
-	if ($[49] !== finalMods || $[50] !== hoverProps || $[51] !== size || $[52] !== styles || $[53] !== t14 || $[54] !== t17 || $[55] !== t18 || $[56] !== t20 || $[57] !== theme || $[58] !== type) {
-		t21 = /* @__PURE__ */ jsxs(ItemActionsWrapperElement, {
+		$[48] = disableActionsFocus;
+		$[49] = isDisabled;
+		$[50] = t22;
+		$[51] = theme;
+		$[52] = type;
+		$[53] = t23;
+	} else t23 = $[53];
+	let t24;
+	if ($[54] !== finalMods || $[55] !== hoverProps || $[56] !== size || $[57] !== styles || $[58] !== t17 || $[59] !== t20 || $[60] !== t21 || $[61] !== t23 || $[62] !== theme || $[63] !== type) {
+		t24 = /* @__PURE__ */ jsxs(ItemActionsWrapperElement, {
 			...hoverProps,
-			variant: t14,
+			variant: t17,
 			"data-size": size,
 			"data-type": type,
 			"data-theme": theme,
 			mods: finalMods,
 			styles,
-			tokens: t17,
-			children: [t18, t20]
+			tokens: t20,
+			children: [t21, t23]
 		});
-		$[49] = finalMods;
-		$[50] = hoverProps;
-		$[51] = size;
-		$[52] = styles;
-		$[53] = t14;
-		$[54] = t17;
-		$[55] = t18;
-		$[56] = t20;
-		$[57] = theme;
-		$[58] = type;
-		$[59] = t21;
-	} else t21 = $[59];
-	return t21;
+		$[54] = finalMods;
+		$[55] = hoverProps;
+		$[56] = size;
+		$[57] = styles;
+		$[58] = t17;
+		$[59] = t20;
+		$[60] = t21;
+		$[61] = t23;
+		$[62] = theme;
+		$[63] = type;
+		$[64] = t24;
+	} else t24 = $[64];
+	return t24;
 }
 //#endregion
 export { ItemActionIcon, ItemActionsWrapper };

package/dist/components/actions/ItemActionsWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"ItemActionsWrapper.js","names":["ClearPressResponder","mergeStyles","Mods","Styles","tasty","HTMLAttributes","ReactNode","useLayoutEffect","useRef","useState","useFocusWithin","useHover","ITEM_RESTING_COLOR_VARIANTS","resolveItemVariant","ROW_STATE_ALIASES","CubeItemProps","DisplayTransition","ItemActionProvider","ItemActionsWrapperElement","variants","styles","display","position","placeContent","placeItems","$size","Actions","$","inset","gap","pointerEvents","padding","height","opacity","translate","transition","ActionsChild","ActionIcon","flexShrink","width","preset","ItemActionIcon","props","_c","t0","children","ItemActionsWrapperProps","state","showActions","skipActionsWidthTransition","actions","type","theme","size","isDisabled","disableActionsFocus","autoHideActions","preserveActionsSpace","mods","actionsProps","HTMLDivElement","ItemActionsWrapper","t1","t2","t3","t4","undefined","actionsRef","actionsWidth","setActionsWidth","areActionsVisible","setAreActionsVisible","skipWidthTransition","setSkipWidthTransition","isMountPassRef","t5","el","current","isMountPass","childElementCount","Math","round","offsetWidth","t6","isFocusWithin","setIsFocusWithin","hasPressed","setHasPressed","t7","Symbol","for","hoverProps","isHovered","t8","onFocusWithinChange","focusWithinProps","t9","actionsEl","checkPressed","querySelector","observer","MutationObserver","observe","attributes","attributeFilter","subtree","disconnect","t10","shouldShowActions","t11","t12","t13","disabled","finalMods","t14","t15","t16","t17","t18","t19","phase","t20","ref","transitionRef","node","t21","_c"],"sources":["../../../src/components/actions/ItemActionsWrapper.tsx"],"sourcesContent":["import { ClearPressResponder } from '@react-aria/interactions';\nimport { mergeStyles, Mods, Styles, tasty } from '@tenphi/tasty';\nimport {\n  HTMLAttributes,\n  ReactNode,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\nimport { useFocusWithin, useHover } from 'react-aria';\n\nimport {\n  ITEM_RESTING_COLOR_VARIANTS,\n  resolveItemVariant,\n  ROW_STATE_ALIASES,\n} from '../../data/item-themes';\nimport { CubeItemProps } from '../content/Item/Item';\nimport { DisplayTransition } from '../helpers/DisplayTransition/DisplayTransition';\n\nimport { ItemActionProvider } from './ItemActionContext';\n\n/**\n * The sibling-actions layout shared by `ItemButton` and the field triggers\n * (`Select` / `Picker` / `FilterPicker`).\n *\n * A row's actions cannot live inside the row when the row is itself a button:\n * that nests a `<button>` in a `<button>`, and a press on an action activates\n * the row. So the run is rendered as a SIBLING, laid over the row's trailing\n * end, and the row reserves the space for it through `--actions-width` — which\n * this file measures — and `Item`'s own `actions` placeholder column.\n *\n * The run is pointer-transparent; only its children take presses. That is what\n * lets a picker put its non-interactive caret in the run and still have a click\n * on the caret reach the trigger underneath, and it stops the run's padding and\n * inter-action gaps from swallowing presses meant for the row.\n *\n * Being a sibling also puts the run OUTSIDE the row for anything that asks\n * \"did this press land on my trigger?\" — an overlay opened by the row would\n * read a press on its own actions as a press outside and dismiss itself,\n * swallowing that press on the way. The run therefore marks itself with\n * `data-trigger-action`, which `isOwnActionsPress` resolves back to the row it\n * belongs to. See `actions-run.ts`.\n */\nconst ItemActionsWrapperElement = tasty({\n  // Actions default to the `current` type, which paints from the inherited\n  // `currentcolor` — but they are rendered as a SIBLING of the row here, not\n  // inside it, so without this they would inherit the page color instead of the\n  // row's. Harmless on the default theme (the two match) and plainly wrong on\n  // any other: a `special` row would hand its actions the page's dark text to\n  // tint with, on a dark purple surface. The variant carries the row's resting\n  // color down so `currentcolor` means the same thing it does inside an `Item`.\n  variants: ITEM_RESTING_COLOR_VARIANTS,\n  // `ROW_STATE_ALIASES`: the row is the wrapper's own child, so the wrapper can\n  // read the one interaction the row expresses as a COLOR change rather than a\n  // fill change. Without it the label darkened under the finger while the caret\n  // and the actions laid over the same row — which paint from the color this\n  // element hands down — stayed at their resting tint. The variants restate it,\n  // because that is where the colors keyed on it live.\n  styles: mergeStyles(ROW_STATE_ALIASES, {\n    // The one layout the row does not want its actions centred in. A block\n    // description stacks under the label and can make the row arbitrarily tall;\n    // there the actions belong in the first line, beside the label, which is\n    // what anchoring them to a `$size`-tall box at the top achieves. Every other\n    // row — including one with an INLINE description — is a single band, and\n    // centring is both what it wants and what survives a caller overriding the\n    // height. Read off the row rather than plumbed through as a prop, because\n    // `Item` is what decides the placement and it defaults by type.\n    '@block-description': ':has(> [data-description=\"block\"])',\n\n    display: 'grid',\n    position: 'relative',\n    placeContent: 'stretch',\n    placeItems: 'stretch',\n\n    $size: {\n      '': '$size-md',\n      'size=xsmall': '$size-xs',\n      'size=small': '$size-sm',\n      'size=medium': '$size-md',\n      'size=large': '$size-lg',\n      'size=xlarge': '$size-xl',\n    },\n\n    Actions: {\n      $: '>',\n      position: 'absolute',\n      // Both insets set, so the run's BOX spans the row and `placeItems: center`\n      // puts the actions on its centre line. What sits in the box does not grow\n      // with it — every child is a fixed `$action-size`, which is capped so a\n      // large row does not get oversized buttons.\n      inset: {\n        '': '1bw right dock',\n        'type=card': '(1bw + .5x) right dock',\n        '@block-description': '1bw 1bw auto auto',\n        'type=card & @block-description': '(1bw + .5x) (1bw + .5x) auto auto',\n      },\n      display: 'flex',\n      gap: '$item-gap',\n      placeItems: 'center',\n      placeContent: 'center end',\n\n      // The run lies OVER the row. Left opaque, its padding and the gaps between\n      // its actions eat presses that belong to the row behind it, and a\n      // non-interactive control inside it (a picker's caret) could never reach\n      // its own trigger. The run itself is therefore transparent to the pointer\n      // and its children opt back in — see `ActionsChild` — so a child that\n      // wants to stay transparent, like that caret, only has to say so.\n      pointerEvents: 'none',\n\n      padding: '0 $side-padding',\n      // Only where the run is top-anchored: there the box has no bottom to\n      // measure from, so `$size` is what gives it one. Everywhere else the two\n      // insets decide the height, and this floor would force the box back to\n      // `$size` and re-anchor it at the top.\n      height: {\n        '': 'min 0',\n        '@block-description': 'min ($size - 2bw)',\n      },\n      opacity: {\n        '': 1,\n        '!actions-shown': 0,\n      },\n      // The run slides in as it fades, but only where it was taking no space to\n      // begin with. Where the space is reserved the run has a fixed place in the\n      // layout, and sliding it would read as the actions drifting rather than\n      // appearing.\n      translate: {\n        '': '0 0',\n        '!actions-shown & !preserve-actions-space': '.5x 0',\n      },\n      transition: 'theme, translate',\n\n      // Size for the action buttons\n      '$action-size': 'min(max((2x + 2bw), ($size - 1x - 2bw)), (3x - 2bw))',\n      // Side padding for the button\n      '$side-padding': '(($size - $action-size - 2bw) / 2)',\n    },\n\n    // Whatever a caller put in the run: interactive again, so the transparency\n    // above applies only to the space BETWEEN and AROUND the actions. `*`\n    // because the run's content is the caller's — there is no element name to\n    // key on.\n    ActionsChild: {\n      $: '>Actions>*',\n      pointerEvents: {\n        '': 'auto',\n        '!actions-shown': 'none',\n      },\n    },\n\n    // A non-interactive box in the run, the same size as an action so it lines\n    // up with one. `$side-padding + $action-size / 2` collapses to\n    // `($size - 2bw) / 2` — the centre of `Item`'s own `rightIcon` square — so a\n    // caret moved out of that slot and into the run does not move on screen.\n    ActionIcon: {\n      $: '>Actions>',\n      display: 'grid',\n      placeItems: 'center',\n      placeContent: 'center',\n      flexShrink: 0,\n      width: '$action-size',\n      height: '$action-size',\n      // The run's children are interactive by default; this one is not, and a\n      // press on it belongs to the row underneath.\n      pointerEvents: 'none',\n      // `--icon-size` comes from the preset, and the run is outside the row that\n      // sets one — so the box restates the ladder `Item` uses. The `m` weights a\n      // non-`item` type picks carry the same icon size as their plain\n      // counterparts, so weight is not a factor here.\n      preset: {\n        '': 't3',\n        'size=xsmall': 't4',\n        'size=xlarge': 't2',\n      },\n    },\n  }),\n});\n\n/**\n * A non-interactive box inside an actions run — a dropdown caret, a loading\n * spinner. It occupies an action's footprint so the run stays evenly spaced,\n * and it lets presses through to the row behind it.\n */\nexport function ItemActionIcon(props: { children: ReactNode }) {\n  return <div data-element=\"ActionIcon\">{props.children}</div>;\n}\n\nexport interface ItemActionsWrapperProps {\n  /**\n   * The row or trigger the actions are laid over. Receives the resolved\n   * visibility so it can reserve space for the run while it is shown, and\n   * whether the reserved width must jump rather than animate (`Item`'s\n   * `skipActionsWidthTransition`).\n   */\n  children: (state: {\n    showActions: boolean;\n    skipActionsWidthTransition: boolean;\n  }) => ReactNode;\n  /**\n   * The run's content. Rendering the wrapper with an empty run is supported and\n   * costs nothing — the measured width is 0 — which is how a trigger keeps its\n   * markup stable across states that do and do not have trailing controls.\n   */\n  actions?: ReactNode;\n  type?: string;\n  theme?: string;\n  /** `Item`'s size token, or a pixel number. */\n  size?: CubeItemProps['size'];\n  isDisabled?: boolean;\n  disableActionsFocus?: boolean;\n  /**\n   * Hide the actions until the row is hovered, focused, or holds a pressed\n   * control.\n   * @default false\n   */\n  autoHideActions?: boolean;\n  /**\n   * Keep the run's width reserved while it is hidden, so the row does not\n   * change size as the actions come and go. Only meaningful with\n   * `autoHideActions`.\n   *\n   * It also keeps the run MOUNTED rather than transitioning it in and out:\n   * an unmounted run cannot be measured, so a row that starts hidden would\n   * have nothing to reserve.\n   * @default false\n   */\n  preserveActionsSpace?: boolean;\n  /** Extra modifiers for the wrapper, merged after the ones it derives itself. */\n  mods?: Mods;\n  /** Styles for the wrapper element — the one that is the row's layout box. */\n  styles?: Styles;\n  /** Extra props spread on the run's container, e.g. event handlers. */\n  actionsProps?: HTMLAttributes<HTMLDivElement>;\n}\n\n/**\n * Wraps a row in the sibling-actions layout and publishes `--actions-width` so\n * the row can reserve the space the run covers.\n */\nexport function ItemActionsWrapper(props: ItemActionsWrapperProps) {\n  const {\n    children,\n    actions,\n    type = 'item',\n    theme = 'default',\n    size = 'medium',\n    isDisabled,\n    disableActionsFocus,\n    autoHideActions = false,\n    preserveActionsSpace = false,\n    mods,\n    styles,\n    actionsProps,\n  } = props;\n\n  const actionsRef = useRef<HTMLDivElement>(null);\n  const [actionsWidth, setActionsWidth] = useState(0);\n  const [areActionsVisible, setAreActionsVisible] = useState(false);\n  const [skipWidthTransition, setSkipWidthTransition] = useState(false);\n  const isMountPassRef = useRef(true);\n\n  useLayoutEffect(() => {\n    const el = actionsRef.current;\n    const isMountPass = isMountPassRef.current;\n\n    isMountPassRef.current = false;\n\n    if (!el) return;\n\n    // An empty run still has the container's side padding, which would reserve\n    // space inside the row for nothing. Nothing rendered means nothing to\n    // reserve.\n    const width = el.childElementCount ? Math.round(el.offsetWidth) : 0;\n\n    if (width !== actionsWidth) {\n      // The width a run reports on mount is where the row starts, not a change\n      // to it. The `offsetWidth` read has already resolved the row at 0px, so\n      // publishing with the transition on made every trigger grow by its caret\n      // after mounting — and a click in that window sized FilterPicker's popover\n      // from a half-grown trigger. A run revealed later still slides open.\n      if (isMountPass) setSkipWidthTransition(true);\n      setActionsWidth(width);\n    } else if (skipWidthTransition) {\n      // This pass's read resolved the row at its final width with the\n      // transition off, so turning it back on animates nothing.\n      setSkipWidthTransition(false);\n    }\n  }, [actions, areActionsVisible, actionsWidth, skipWidthTransition]);\n\n  const [isFocusWithin, setIsFocusWithin] = useState(false);\n  const [hasPressed, setHasPressed] = useState(false);\n  const { hoverProps, isHovered } = useHover({});\n  const { focusWithinProps } = useFocusWithin({\n    onFocusWithinChange: setIsFocusWithin,\n  });\n\n  // Watch for data-pressed attribute on any descendant element\n  useLayoutEffect(() => {\n    const actionsEl = actionsRef.current;\n\n    if (!actionsEl || !autoHideActions) return;\n\n    const checkPressed = () => {\n      setHasPressed(actionsEl.querySelector('[data-pressed]') !== null);\n    };\n\n    const observer = new MutationObserver(checkPressed);\n\n    observer.observe(actionsEl, {\n      attributes: true,\n      attributeFilter: ['data-pressed'],\n      subtree: true,\n    });\n\n    checkPressed();\n\n    return () => observer.disconnect();\n  }, [areActionsVisible, autoHideActions]);\n\n  const shouldShowActions =\n    isHovered || isFocusWithin || hasPressed || !autoHideActions;\n\n  // `disabled` is on the wrapper so its variant can paint the row's DISABLED\n  // label color, not just the resting one. Actions default to the `current` type\n  // and suppress their own fade when the disabled state is inherited — on the\n  // grounds that the host already faded the color they paint from — so without\n  // this the wrapper would hand them a full-strength color and a disabled button\n  // would sit next to full-strength actions. See `ITEM_RESTING_COLOR_VARIANTS`.\n  const finalMods = {\n    ...mods,\n    ...(shouldShowActions ? { 'actions-shown': true } : null),\n    ...(preserveActionsSpace ? { 'preserve-actions-space': true } : null),\n    disabled: isDisabled,\n  };\n\n  return (\n    <ItemActionsWrapperElement\n      {...hoverProps}\n      // The same resolver `Item` uses, so the wrapper cannot land on a\n      // different variant than the row it wraps.\n      variant={resolveItemVariant(theme, type)}\n      data-size={size}\n      data-type={type}\n      data-theme={theme}\n      mods={finalMods}\n      styles={styles}\n      tokens={{\n        '$actions-width':\n          areActionsVisible || !autoHideActions || preserveActionsSpace\n            ? `${actionsWidth}px`\n            : '0px',\n        ...(typeof size === 'number' && { $size: `${size}px` }),\n      }}\n    >\n      {children({\n        showActions: shouldShowActions,\n        skipActionsWidthTransition: skipWidthTransition,\n      })}\n      {/*\n        The run is rendered under whatever press context the row sits in, and a\n        `PressResponder` in that context reaches EVERY `usePress` below it — so\n        an `ItemButton` / `TabButton` / picker trigger inside a `DialogTrigger`\n        or a `MenuTrigger` handed its own actions the trigger's `onPress`, and\n        pressing one toggled the overlay on top of running the action. The run\n        belongs to the row, not to whatever opened around it: it clears the\n        context so each action answers only to its own handler.\n      */}\n      <ClearPressResponder>\n        <ItemActionProvider\n          type={type}\n          theme={theme}\n          disableActionsFocus={disableActionsFocus}\n          isDisabled={isDisabled}\n        >\n          {autoHideActions && !preserveActionsSpace ? (\n            <DisplayTransition\n              exposeUnmounted\n              isShown={shouldShowActions}\n              onPhaseChange={(phase) => {\n                setAreActionsVisible(phase !== 'unmounted');\n              }}\n            >\n              {({ ref: transitionRef }) => {\n                return (\n                  <div\n                    {...focusWithinProps}\n                    {...actionsProps}\n                    ref={(node: any) => {\n                      actionsRef.current = node;\n                      transitionRef(node);\n                    }}\n                    data-element=\"Actions\"\n                    data-trigger-action=\"\"\n                  >\n                    {actions}\n                  </div>\n                );\n              }}\n            </DisplayTransition>\n          ) : (\n            <div\n              ref={actionsRef}\n              {...actionsProps}\n              data-element=\"Actions\"\n              data-trigger-action=\"\"\n            >\n              {actions}\n            </div>\n          )}\n        </ItemActionProvider>\n      </ClearPressResponder>\n    </ItemActionsWrapperElement>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"ItemActionsWrapper.js","names":["ClearPressResponder","mergeStyles","Mods","Styles","tasty","HTMLAttributes","ReactNode","RefObject","useEffectEvent","useLayoutEffect","useRef","useState","useFocusWithin","useHover","flushSync","ITEM_RESTING_COLOR_VARIANTS","resolveItemVariant","ROW_STATE_ALIASES","CubeItemProps","DisplayTransition","ItemActionProvider","ItemActionsWrapperElement","variants","styles","display","position","placeContent","placeItems","$size","Actions","$","inset","gap","pointerEvents","padding","height","opacity","translate","transition","ActionsChild","ActionIcon","flexShrink","width","preset","ItemActionIcon","props","_c","t0","children","measureActionsWidth","el","HTMLElement","isUnmeasuredRef","isFirst","offsetWidth","getClientRects","length","current","childElementCount","MeasureRun","runObserver","ResizeObserver","measureRunByElement","Map","Element","publishRunWidths","entries","ResizeObserverEntry","publishes","entry","publish","get","target","push","observeRun","measure","set","observe","box","delete","size","unobserve","disconnect","ItemActionsWrapperProps","state","showActions","skipActionsWidthTransition","actions","type","theme","isDisabled","disableActionsFocus","autoHideActions","preserveActionsSpace","mods","actionsProps","HTMLDivElement","ItemActionsWrapper","t1","t2","t3","t4","undefined","actionsRef","actionsWidth","setActionsWidth","areActionsVisible","setAreActionsVisible","skipWidthTransition","setSkipWidthTransition","isTransitionedRun","t5","measured","t6","t7","el_0","measured_0","onActionsResize","t8","el_1","stopObserving","t9","isFocusWithin","setIsFocusWithin","hasPressed","setHasPressed","t10","Symbol","for","hoverProps","isHovered","t11","onFocusWithinChange","focusWithinProps","t12","actionsEl","checkPressed","querySelector","observer","MutationObserver","attributes","attributeFilter","subtree","t13","shouldShowActions","t14","t15","t16","disabled","finalMods","t17","t18","t19","t20","t21","t22","phase","t23","ref","transitionRef","node","t24","_c"],"sources":["../../../src/components/actions/ItemActionsWrapper.tsx"],"sourcesContent":["import { ClearPressResponder } from '@react-aria/interactions';\nimport { mergeStyles, Mods, Styles, tasty } from '@tenphi/tasty';\nimport {\n  HTMLAttributes,\n  ReactNode,\n  RefObject,\n  useEffectEvent,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\nimport { useFocusWithin, useHover } from 'react-aria';\nimport { flushSync } from 'react-dom';\n\nimport {\n  ITEM_RESTING_COLOR_VARIANTS,\n  resolveItemVariant,\n  ROW_STATE_ALIASES,\n} from '../../data/item-themes';\nimport { CubeItemProps } from '../content/Item/Item';\nimport { DisplayTransition } from '../helpers/DisplayTransition/DisplayTransition';\n\nimport { ItemActionProvider } from './ItemActionContext';\n\n/**\n * The sibling-actions layout shared by `ItemButton` and the field triggers\n * (`Select` / `Picker` / `FilterPicker`).\n *\n * A row's actions cannot live inside the row when the row is itself a button:\n * that nests a `<button>` in a `<button>`, and a press on an action activates\n * the row. So the run is rendered as a SIBLING, laid over the row's trailing\n * end, and the row reserves the space for it through `--actions-width` — which\n * this file measures — and `Item`'s own `actions` placeholder column.\n *\n * The run is pointer-transparent; only its children take presses. That is what\n * lets a picker put its non-interactive caret in the run and still have a click\n * on the caret reach the trigger underneath, and it stops the run's padding and\n * inter-action gaps from swallowing presses meant for the row.\n *\n * Being a sibling also puts the run OUTSIDE the row for anything that asks\n * \"did this press land on my trigger?\" — an overlay opened by the row would\n * read a press on its own actions as a press outside and dismiss itself,\n * swallowing that press on the way. The run therefore marks itself with\n * `data-trigger-action`, which `isOwnActionsPress` resolves back to the row it\n * belongs to. See `actions-run.ts`.\n */\nconst ItemActionsWrapperElement = tasty({\n  // Actions default to the `current` type, which paints from the inherited\n  // `currentcolor` — but they are rendered as a SIBLING of the row here, not\n  // inside it, so without this they would inherit the page color instead of the\n  // row's. Harmless on the default theme (the two match) and plainly wrong on\n  // any other: a `special` row would hand its actions the page's dark text to\n  // tint with, on a dark purple surface. The variant carries the row's resting\n  // color down so `currentcolor` means the same thing it does inside an `Item`.\n  variants: ITEM_RESTING_COLOR_VARIANTS,\n  // `ROW_STATE_ALIASES`: the row is the wrapper's own child, so the wrapper can\n  // read the one interaction the row expresses as a COLOR change rather than a\n  // fill change. Without it the label darkened under the finger while the caret\n  // and the actions laid over the same row — which paint from the color this\n  // element hands down — stayed at their resting tint. The variants restate it,\n  // because that is where the colors keyed on it live.\n  styles: mergeStyles(ROW_STATE_ALIASES, {\n    // The one layout the row does not want its actions centred in. A block\n    // description stacks under the label and can make the row arbitrarily tall;\n    // there the actions belong in the first line, beside the label, which is\n    // what anchoring them to a `$size`-tall box at the top achieves. Every other\n    // row — including one with an INLINE description — is a single band, and\n    // centring is both what it wants and what survives a caller overriding the\n    // height. Read off the row rather than plumbed through as a prop, because\n    // `Item` is what decides the placement and it defaults by type.\n    '@block-description': ':has(> [data-description=\"block\"])',\n\n    display: 'grid',\n    position: 'relative',\n    placeContent: 'stretch',\n    placeItems: 'stretch',\n\n    $size: {\n      '': '$size-md',\n      'size=xsmall': '$size-xs',\n      'size=small': '$size-sm',\n      'size=medium': '$size-md',\n      'size=large': '$size-lg',\n      'size=xlarge': '$size-xl',\n    },\n\n    Actions: {\n      $: '>',\n      position: 'absolute',\n      // Both insets set, so the run's BOX spans the row and `placeItems: center`\n      // puts the actions on its centre line. What sits in the box does not grow\n      // with it — every child is a fixed `$action-size`, which is capped so a\n      // large row does not get oversized buttons.\n      inset: {\n        '': '1bw right dock',\n        'type=card': '(1bw + .5x) right dock',\n        '@block-description': '1bw 1bw auto auto',\n        'type=card & @block-description': '(1bw + .5x) (1bw + .5x) auto auto',\n      },\n      display: 'flex',\n      gap: '$item-gap',\n      placeItems: 'center',\n      placeContent: 'center end',\n\n      // The run lies OVER the row. Left opaque, its padding and the gaps between\n      // its actions eat presses that belong to the row behind it, and a\n      // non-interactive control inside it (a picker's caret) could never reach\n      // its own trigger. The run itself is therefore transparent to the pointer\n      // and its children opt back in — see `ActionsChild` — so a child that\n      // wants to stay transparent, like that caret, only has to say so.\n      pointerEvents: 'none',\n\n      padding: '0 $side-padding',\n      // Only where the run is top-anchored: there the box has no bottom to\n      // measure from, so `$size` is what gives it one. Everywhere else the two\n      // insets decide the height, and this floor would force the box back to\n      // `$size` and re-anchor it at the top.\n      height: {\n        '': 'min 0',\n        '@block-description': 'min ($size - 2bw)',\n      },\n      opacity: {\n        '': 1,\n        '!actions-shown': 0,\n      },\n      // The run slides in as it fades, but only where it was taking no space to\n      // begin with. Where the space is reserved the run has a fixed place in the\n      // layout, and sliding it would read as the actions drifting rather than\n      // appearing.\n      translate: {\n        '': '0 0',\n        '!actions-shown & !preserve-actions-space': '.5x 0',\n      },\n      transition: 'theme, translate',\n\n      // Size for the action buttons\n      '$action-size': 'min(max((2x + 2bw), ($size - 1x - 2bw)), (3x - 2bw))',\n      // Side padding for the button\n      '$side-padding': '(($size - $action-size - 2bw) / 2)',\n    },\n\n    // Whatever a caller put in the run: interactive again, so the transparency\n    // above applies only to the space BETWEEN and AROUND the actions. `*`\n    // because the run's content is the caller's — there is no element name to\n    // key on.\n    ActionsChild: {\n      $: '>Actions>*',\n      pointerEvents: {\n        '': 'auto',\n        '!actions-shown': 'none',\n      },\n    },\n\n    // A non-interactive box in the run, the same size as an action so it lines\n    // up with one. `$side-padding + $action-size / 2` collapses to\n    // `($size - 2bw) / 2` — the centre of `Item`'s own `rightIcon` square — so a\n    // caret moved out of that slot and into the run does not move on screen.\n    ActionIcon: {\n      $: '>Actions>',\n      display: 'grid',\n      placeItems: 'center',\n      placeContent: 'center',\n      flexShrink: 0,\n      width: '$action-size',\n      height: '$action-size',\n      // The run's children are interactive by default; this one is not, and a\n      // press on it belongs to the row underneath.\n      pointerEvents: 'none',\n      // `--icon-size` comes from the preset, and the run is outside the row that\n      // sets one — so the box restates the ladder `Item` uses. The `m` weights a\n      // non-`item` type picks carry the same icon size as their plain\n      // counterparts, so weight is not a factor here.\n      preset: {\n        '': 't3',\n        'size=xsmall': 't4',\n        'size=xlarge': 't2',\n      },\n    },\n  }),\n});\n\n/**\n * A non-interactive box inside an actions run — a dropdown caret, a loading\n * spinner. It occupies an action's footprint so the run stays evenly spaced,\n * and it lets presses through to the row behind it.\n */\nexport function ItemActionIcon(props: { children: ReactNode }) {\n  return <div data-element=\"ActionIcon\">{props.children}</div>;\n}\n\n/**\n * The width the row reserves for the run, or `null` while the run has no box.\n *\n * `isFirst` says the width is where the row STARTS rather than a change to it:\n * the first one since the run last had no box — on mount, or once a closed\n * container opens — or since it was last observed (an `<Activity>` hide, a run\n * swapped for another element). The ref carries that across measurements.\n */\nfunction measureActionsWidth(\n  el: HTMLElement,\n  isUnmeasuredRef: RefObject<boolean>,\n): { width: number; isFirst: boolean } | null {\n  const width = el.offsetWidth;\n\n  // Under a `display: none` ancestor — a closed panel or tray — the run reads 0\n  // wide. That is not its width, and publishing it would only have to be undone\n  // when the container opens. `offsetWidth` is checked first so a test setup\n  // that mocks it still measures: jsdom has no client rects at all.\n  if (!width && !el.getClientRects().length) {\n    isUnmeasuredRef.current = true;\n\n    return null;\n  }\n\n  const isFirst = isUnmeasuredRef.current;\n\n  isUnmeasuredRef.current = false;\n\n  // An empty run still has the container's side padding, which would reserve\n  // space inside the row for nothing. Nothing rendered means nothing to\n  // reserve.\n  return { width: el.childElementCount ? width : 0, isFirst };\n}\n\n/**\n * Measures one run, and returns what publishing the new width takes, if\n * anything changed.\n */\ntype MeasureRun = () => (() => void) | undefined;\n\n/**\n * One observer for every run on the page, so runs that resize together arrive\n * in one delivery. A closed panel full of rows that opens is then measured in\n * one layout and published in one commit, not a forced layout and a commit per\n * row. It exists only while something is observed, so a test that swaps the\n * global `ResizeObserver` between cases gets its own.\n */\nlet runObserver: ResizeObserver | null = null;\nconst measureRunByElement = new Map<Element, MeasureRun>();\n\nfunction publishRunWidths(entries: ResizeObserverEntry[]) {\n  // Every run is read before any is published: a publish writes to the DOM,\n  // and the next read would have to lay the page out again.\n  const publishes: (() => void)[] = [];\n\n  for (const entry of entries) {\n    const publish = measureRunByElement.get(entry.target)?.();\n\n    if (publish) publishes.push(publish);\n  }\n\n  if (!publishes.length) return;\n\n  // Synchronous, because observers run just before paint: a scheduled render\n  // would paint one frame with the actions over the label. When that commit\n  // resizes another observed element no deeper than the run (an auto-width tab\n  // grows by its actions, or a run holding another row's run grows once the\n  // inner one publishes), the browser delivers that one a frame late and\n  // reports \"ResizeObserver loop completed with undelivered notifications\".\n  // That is benign, and error trackers such as Sentry drop it by default. The\n  // outer run of such a pair is corrected in this same commit, by its layout\n  // effect, so the first frame still shows its final width.\n  flushSync(() => {\n    for (const publish of publishes) publish();\n  });\n}\n\n/** Starts observing a run, and returns what stops it. */\nfunction observeRun(el: HTMLElement, measure: MeasureRun) {\n  runObserver ??= new ResizeObserver(publishRunWidths);\n  measureRunByElement.set(el, measure);\n  // `offsetWidth` is the border box, so the run's padding counts too.\n  runObserver.observe(el, { box: 'border-box' });\n\n  return () => {\n    measureRunByElement.delete(el);\n\n    if (measureRunByElement.size) {\n      runObserver?.unobserve(el);\n    } else {\n      runObserver?.disconnect();\n      runObserver = null;\n    }\n  };\n}\n\nexport interface ItemActionsWrapperProps {\n  /**\n   * The row or trigger the actions are laid over. Receives the resolved\n   * visibility so it can reserve space for the run while it is shown, and\n   * whether the reserved width must jump rather than animate (`Item`'s\n   * `skipActionsWidthTransition`).\n   */\n  children: (state: {\n    showActions: boolean;\n    skipActionsWidthTransition: boolean;\n  }) => ReactNode;\n  /**\n   * The run's content. Rendering the wrapper with an empty run is supported —\n   * it publishes a width of 0 and costs one entry in a shared size observer —\n   * which is how a trigger keeps its markup stable across states that do and\n   * do not have trailing controls.\n   */\n  actions?: ReactNode;\n  type?: string;\n  theme?: string;\n  /** `Item`'s size token, or a pixel number. */\n  size?: CubeItemProps['size'];\n  isDisabled?: boolean;\n  disableActionsFocus?: boolean;\n  /**\n   * Hide the actions until the row is hovered, focused, or holds a pressed\n   * control.\n   * @default false\n   */\n  autoHideActions?: boolean;\n  /**\n   * Keep the run's width reserved while it is hidden, so the row does not\n   * change size as the actions come and go. Only meaningful with\n   * `autoHideActions`.\n   *\n   * It also keeps the run MOUNTED rather than transitioning it in and out:\n   * an unmounted run cannot be measured, so a row that starts hidden would\n   * have nothing to reserve.\n   * @default false\n   */\n  preserveActionsSpace?: boolean;\n  /** Extra modifiers for the wrapper, merged after the ones it derives itself. */\n  mods?: Mods;\n  /** Styles for the wrapper element — the one that is the row's layout box. */\n  styles?: Styles;\n  /** Extra props spread on the run's container, e.g. event handlers. */\n  actionsProps?: HTMLAttributes<HTMLDivElement>;\n}\n\n/**\n * Wraps a row in the sibling-actions layout and publishes `--actions-width` so\n * the row can reserve the space the run covers.\n */\nexport function ItemActionsWrapper(props: ItemActionsWrapperProps) {\n  const {\n    children,\n    actions,\n    type = 'item',\n    theme = 'default',\n    size = 'medium',\n    isDisabled,\n    disableActionsFocus,\n    autoHideActions = false,\n    preserveActionsSpace = false,\n    mods,\n    styles,\n    actionsProps,\n  } = props;\n\n  const actionsRef = useRef<HTMLDivElement>(null);\n  const [actionsWidth, setActionsWidth] = useState(0);\n  const [areActionsVisible, setAreActionsVisible] = useState(false);\n  const [skipWidthTransition, setSkipWidthTransition] = useState(false);\n  const isUnmeasuredRef = useRef(true);\n  // `DisplayTransition` renders the run as a different element from the plain\n  // branch, so this is what the observer below follows.\n  const isTransitionedRun = autoHideActions && !preserveActionsSpace;\n\n  useLayoutEffect(() => {\n    const el = actionsRef.current;\n\n    if (!el) return;\n\n    const measured = measureActionsWidth(el, isUnmeasuredRef);\n\n    if (measured && measured.width !== actionsWidth) {\n      // A first width is where the row starts, not a change to it. The\n      // `offsetWidth` read has already resolved the row at 0px, so publishing\n      // with the transition on made every trigger grow by its caret as it\n      // appeared — and a click in that window sized FilterPicker's popover from\n      // a half-grown trigger. A run that changes later still slides.\n      if (measured.isFirst) setSkipWidthTransition(true);\n      setActionsWidth(measured.width);\n    } else if (skipWidthTransition) {\n      // This pass's read resolved the row at its final width with the\n      // transition off, so turning it back on animates nothing.\n      setSkipWidthTransition(false);\n    }\n  }, [actions, areActionsVisible, actionsWidth, skipWidthTransition]);\n\n  // The effect above measures when the wrapper renders. A run can change size\n  // without that: most often a row mounted inside a closed panel, whose run had\n  // no box until the panel opened. The observer catches those, and publishes\n  // them with every other run that resized alongside (`publishRunWidths`).\n  const onActionsResize = useEffectEvent((el: HTMLElement) => {\n    const measured = measureActionsWidth(el, isUnmeasuredRef);\n\n    if (!measured || measured.width === actionsWidth) return;\n\n    return () => {\n      if (measured.isFirst) setSkipWidthTransition(true);\n      setActionsWidth(measured.width);\n    };\n  });\n\n  useLayoutEffect(() => {\n    const el = actionsRef.current;\n\n    // Skipped where there is none, as the kit's other guarded observers are.\n    // Test setups stub it regardless: `Item`'s auto-tooltip needs one.\n    if (!el || typeof ResizeObserver === 'undefined') return;\n\n    const stopObserving = observeRun(el, () => onActionsResize(el));\n\n    return () => {\n      stopObserving();\n      // The next width is a fresh start. An `<Activity>` that hides this row\n      // stops observing it before the run can be seen losing its box, so what\n      // the run does next goes unseen; a swapped run is a new element, so it\n      // starts afresh even on a visible row.\n      isUnmeasuredRef.current = true;\n    };\n  }, [isTransitionedRun]);\n\n  const [isFocusWithin, setIsFocusWithin] = useState(false);\n  const [hasPressed, setHasPressed] = useState(false);\n  const { hoverProps, isHovered } = useHover({});\n  const { focusWithinProps } = useFocusWithin({\n    onFocusWithinChange: setIsFocusWithin,\n  });\n\n  // Watch for data-pressed attribute on any descendant element\n  useLayoutEffect(() => {\n    const actionsEl = actionsRef.current;\n\n    if (!actionsEl || !autoHideActions) return;\n\n    const checkPressed = () => {\n      setHasPressed(actionsEl.querySelector('[data-pressed]') !== null);\n    };\n\n    const observer = new MutationObserver(checkPressed);\n\n    observer.observe(actionsEl, {\n      attributes: true,\n      attributeFilter: ['data-pressed'],\n      subtree: true,\n    });\n\n    checkPressed();\n\n    return () => observer.disconnect();\n  }, [areActionsVisible, autoHideActions]);\n\n  const shouldShowActions =\n    isHovered || isFocusWithin || hasPressed || !autoHideActions;\n\n  // `disabled` is on the wrapper so its variant can paint the row's DISABLED\n  // label color, not just the resting one. Actions default to the `current` type\n  // and suppress their own fade when the disabled state is inherited — on the\n  // grounds that the host already faded the color they paint from — so without\n  // this the wrapper would hand them a full-strength color and a disabled button\n  // would sit next to full-strength actions. See `ITEM_RESTING_COLOR_VARIANTS`.\n  const finalMods = {\n    ...mods,\n    ...(shouldShowActions ? { 'actions-shown': true } : null),\n    ...(preserveActionsSpace ? { 'preserve-actions-space': true } : null),\n    disabled: isDisabled,\n  };\n\n  return (\n    <ItemActionsWrapperElement\n      {...hoverProps}\n      // The same resolver `Item` uses, so the wrapper cannot land on a\n      // different variant than the row it wraps.\n      variant={resolveItemVariant(theme, type)}\n      data-size={size}\n      data-type={type}\n      data-theme={theme}\n      mods={finalMods}\n      styles={styles}\n      tokens={{\n        '$actions-width':\n          areActionsVisible || !autoHideActions || preserveActionsSpace\n            ? `${actionsWidth}px`\n            : '0px',\n        ...(typeof size === 'number' && { $size: `${size}px` }),\n      }}\n    >\n      {children({\n        showActions: shouldShowActions,\n        skipActionsWidthTransition: skipWidthTransition,\n      })}\n      {/*\n        The run is rendered under whatever press context the row sits in, and a\n        `PressResponder` in that context reaches EVERY `usePress` below it — so\n        an `ItemButton` / `TabButton` / picker trigger inside a `DialogTrigger`\n        or a `MenuTrigger` handed its own actions the trigger's `onPress`, and\n        pressing one toggled the overlay on top of running the action. The run\n        belongs to the row, not to whatever opened around it: it clears the\n        context so each action answers only to its own handler.\n      */}\n      <ClearPressResponder>\n        <ItemActionProvider\n          type={type}\n          theme={theme}\n          disableActionsFocus={disableActionsFocus}\n          isDisabled={isDisabled}\n        >\n          {isTransitionedRun ? (\n            <DisplayTransition\n              exposeUnmounted\n              isShown={shouldShowActions}\n              onPhaseChange={(phase) => {\n                setAreActionsVisible(phase !== 'unmounted');\n              }}\n            >\n              {({ ref: transitionRef }) => {\n                return (\n                  <div\n                    {...focusWithinProps}\n                    {...actionsProps}\n                    ref={(node: any) => {\n                      actionsRef.current = node;\n                      transitionRef(node);\n                    }}\n                    data-element=\"Actions\"\n                    data-trigger-action=\"\"\n                  >\n                    {actions}\n                  </div>\n                );\n              }}\n            </DisplayTransition>\n          ) : (\n            <div\n              ref={actionsRef}\n              {...actionsProps}\n              data-element=\"Actions\"\n              data-trigger-action=\"\"\n            >\n              {actions}\n            </div>\n          )}\n        </ItemActionProvider>\n      </ClearPressResponder>\n    </ItemActionsWrapperElement>\n  );\n}\n"],"mappings":"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"}

package/dist/components/actions/ItemButton/ItemButton.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.204.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.206.0 | Cube Dev Team */
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { mergeRefs } from "../../../utils/react/useCombinedRefs.js";
 import { useDismissParentPopover } from "../../../utils/react/usePopoverSync.js";