@cube-dev/ui-kit 0.0.0-canary-ac46c4b → 0.0.0-canary-9bde021

package/dist/components/content/Item/Item.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-ac46c4b | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-9bde021 | Cube Dev Team */
 import { getDisabledElementProps, omitActivationEventProps } from "../../../utils/react/disabledProps.js";
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { resolveIcon } from "../../../utils/react/resolveIcon.js";
@@ -12,6 +12,7 @@ import { ItemActionProvider } from "../../actions/ItemActionContext.js";
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
 import { ItemBadge } from "../ItemBadge/ItemBadge.js";
 import { IconSwitch } from "../../helpers/IconSwitch/IconSwitch.js";
+import { splitTooltipTriggerProps } from "../../overlays/Tooltip/split-trigger-props.js";
 import { _HotKeys } from "../HotKeys/HotKeys.js";
 import { c } from "react-compiler-runtime";
 import { CONTAINER_STYLES, tasty } from "@tenphi/tasty";
@@ -287,8 +288,8 @@ const ItemElement = tasty({
 	styleProps: CONTAINER_STYLES
 });
 const Item = (props, ref) => {
-	const $ = c(119);
-	const { children, size: t0, type: t1, theme: t2, mods, icon: iconProp, rightIcon: rightIconProp, prefix, suffix, description, descriptionPlacement, labelProps, descriptionProps, keyboardShortcutProps, styles, htmlType, isSelected, hotkeys, tooltip: t3, isDisabled, disabled: nativeDisabledProp, style, loadingSlot: t4, isLoading: t5, actions, autoHideActions: t6, preserveActionsSpace: t7, disableActionsFocus: t8, shape, defaultTooltipPlacement: t9, level: t10, highlight, highlightCaseSensitive: t11, highlightStyles, insideWrapper: t12, showActions: t13, tokens, ...rest } = props;
+	const $ = c(120);
+	const { children, size: t0, type: t1, theme: t2, mods, icon: iconProp, rightIcon: rightIconProp, prefix, suffix, description, descriptionPlacement, labelProps, descriptionProps, keyboardShortcutProps, styles, htmlType, isSelected, hotkeys, tooltip: t3, isDisabled, disabled: nativeDisabledProp, style, loadingSlot: t4, isLoading: t5, actions, autoHideActions: t6, preserveActionsSpace: t7, disableActionsFocus: t8, shape, defaultTooltipPlacement: t9, level: t10, highlight, highlightCaseSensitive: t11, highlightStyles, insideWrapper: t12, showActions: t13, hiddenContent, isDynamicLabel: t14, labelRef: labelRefProp, tokens, ...rest } = props;
 	const size = t0 === void 0 ? "medium" : t0;
 	const type = t1 === void 0 ? "item" : t1;
 	const theme = t2 === void 0 ? "default" : t2;
@@ -303,14 +304,15 @@ const Item = (props, ref) => {
 	const highlightCaseSensitive = t11 === void 0 ? false : t11;
 	const insideWrapper = t12 === void 0 ? false : t12;
 	const showActions = t13 === void 0 ? false : t13;
+	const isDynamicLabel = t14 === void 0 ? false : t14;
 	const hasLabel = !!(children || labelProps);
 	const finalDescriptionPlacement = descriptionPlacement ?? ((type === "card" || type === "header") && hasLabel ? "block" : "inline");
 	const finalShape = shape ?? (type === "card" ? "card" : "button");
 	const isDisabledProp = isDisabled ?? (nativeDisabledProp || void 0);
 	const finalIsDisabled = isDisabledProp === true || isLoading && isDisabledProp !== false;
-	let t14;
+	let t15;
 	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-		t14 = [
+		t15 = [
 			"default",
 			"success",
 			"danger",
@@ -319,12 +321,12 @@ const Item = (props, ref) => {
 			"special",
 			"current"
 		];
-		$[0] = t14;
-	} else t14 = $[0];
-	const STANDARD_THEMES = t14;
-	let t15;
+		$[0] = t15;
+	} else t15 = $[0];
+	const STANDARD_THEMES = t15;
+	let t16;
 	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
-		t15 = [
+		t16 = [
 			"default",
 			"success",
 			"danger",
@@ -332,26 +334,26 @@ const Item = (props, ref) => {
 			"note",
 			"current"
 		];
-		$[1] = t15;
-	} else t15 = $[1];
-	const CARD_THEMES = t15;
-	let t16;
-	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
-		t16 = ["default"];
-		$[2] = t16;
-	} else t16 = $[2];
-	const HEADER_THEMES = t16;
+		$[1] = t16;
+	} else t16 = $[1];
+	const CARD_THEMES = t16;
 	let t17;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t17 = ["default"];
+		$[2] = t17;
+	} else t17 = $[2];
+	const HEADER_THEMES = t17;
+	let t18;
 	if ($[3] !== theme || $[4] !== type) {
-		t17 = type === "header" && !HEADER_THEMES.includes(theme) || type === "card" && !CARD_THEMES.includes(theme) || !["header", "card"].includes(type) && !STANDARD_THEMES.includes(theme);
+		t18 = type === "header" && !HEADER_THEMES.includes(theme) || type === "card" && !CARD_THEMES.includes(theme) || !["header", "card"].includes(type) && !STANDARD_THEMES.includes(theme);
 		$[3] = theme;
 		$[4] = type;
-		$[5] = t17;
-	} else t17 = $[5];
-	const isInvalidCombination = t17;
-	let t18;
+		$[5] = t18;
+	} else t18 = $[5];
+	const isInvalidCombination = t18;
+	let t19;
 	if ($[6] !== theme || $[7] !== type) {
-		t18 = [
+		t19 = [
 			"Item",
 			"invalid-type-theme",
 			type,
@@ -359,26 +361,26 @@ const Item = (props, ref) => {
 		];
 		$[6] = theme;
 		$[7] = type;
-		$[8] = t18;
-	} else t18 = $[8];
-	const t19 = `Item: Invalid type+theme combination. type="${type}" does not support theme="${theme}".` + (type === "header" ? " The \"header\" type only supports theme: default." : type === "card" ? " The \"card\" type only supports themes: default, success, danger, warning, note, current." : " Standard types support themes: default, success, danger, warning, note, special, current.");
-	let t20;
-	if ($[9] !== t19) {
-		t20 = [t19];
-		$[9] = t19;
-		$[10] = t20;
-	} else t20 = $[10];
+		$[8] = t19;
+	} else t19 = $[8];
+	const t20 = `Item: Invalid type+theme combination. type="${type}" does not support theme="${theme}".` + (type === "header" ? " The \"header\" type only supports theme: default." : type === "card" ? " The \"card\" type only supports themes: default, success, danger, warning, note, current." : " Standard types support themes: default, success, danger, warning, note, special, current.");
 	let t21;
-	if ($[11] !== t18 || $[12] !== t20) {
-		t21 = {
-			key: t18,
-			args: t20
+	if ($[9] !== t20) {
+		t21 = [t20];
+		$[9] = t20;
+		$[10] = t21;
+	} else t21 = $[10];
+	let t22;
+	if ($[11] !== t19 || $[12] !== t21) {
+		t22 = {
+			key: t19,
+			args: t21
 		};
-		$[11] = t18;
-		$[12] = t20;
-		$[13] = t21;
-	} else t21 = $[13];
-	useWarn(isInvalidCombination, t21);
+		$[11] = t19;
+		$[12] = t21;
+		$[13] = t22;
+	} else t22 = $[13];
+	useWarn(isInvalidCombination, t22);
 	const hasLinkWithIcons = type === "link" && (iconProp || rightIconProp);
 	const hasLinkWithLoading = type === "link" && isLoading;
 	const hasLinkRestrictions = hasLinkWithIcons || hasLinkWithLoading;
@@ -391,46 +393,46 @@ const Item = (props, ref) => {
 		$[15] = hasLinkWithLoading;
 		$[16] = linkRestrictionMessages;
 	} else linkRestrictionMessages = $[16];
-	let t22;
+	let t23;
 	if ($[17] === Symbol.for("react.memo_cache_sentinel")) {
-		t22 = ["Item", "link-restrictions"];
-		$[17] = t22;
-	} else t22 = $[17];
-	const t23 = `Item: The "link" type does not support ${linkRestrictionMessages.join(" or ")}. Remove these props when using type="link".`;
-	let t24;
-	if ($[18] !== t23) {
-		t24 = {
-			key: t22,
-			args: [t23]
+		t23 = ["Item", "link-restrictions"];
+		$[17] = t23;
+	} else t23 = $[17];
+	const t24 = `Item: The "link" type does not support ${linkRestrictionMessages.join(" or ")}. Remove these props when using type="link".`;
+	let t25;
+	if ($[18] !== t24) {
+		t25 = {
+			key: t23,
+			args: [t24]
 		};
-		$[18] = t23;
-		$[19] = t24;
-	} else t24 = $[19];
-	useWarn(hasLinkRestrictions, t24);
+		$[18] = t24;
+		$[19] = t25;
+	} else t25 = $[19];
+	useWarn(hasLinkRestrictions, t25);
 	const hasCheckmark = iconProp === "checkmark";
-	let t25;
+	let t26;
 	if ($[20] !== size) {
-		t25 = typeof size === "number" || !ITEM_SIZE_VALUES.includes(size);
+		t26 = typeof size === "number" || !ITEM_SIZE_VALUES.includes(size);
 		$[20] = size;
-		$[21] = t25;
-	} else t25 = $[21];
-	const isCustomSize = t25;
+		$[21] = t26;
+	} else t26 = $[21];
+	const isCustomSize = t26;
 	const sizeTokenValue = typeof size === "number" ? `${size}px` : isCustomSize ? size : void 0;
-	const t26 = isSelected === true;
-	let t27;
+	const t27 = isSelected === true;
+	let t28;
 	if ($[22] !== isCustomSize || $[23] !== size) {
-		t27 = !isCustomSize && { size };
+		t28 = !isCustomSize && { size };
 		$[22] = isCustomSize;
 		$[23] = size;
-		$[24] = t27;
-	} else t27 = $[24];
-	let t28;
-	if ($[25] !== finalIsDisabled || $[26] !== finalShape || $[27] !== isLoading || $[28] !== mods || $[29] !== t26 || $[30] !== t27 || $[31] !== theme || $[32] !== type) {
-		t28 = {
+		$[24] = t28;
+	} else t28 = $[24];
+	let t29;
+	if ($[25] !== finalIsDisabled || $[26] !== finalShape || $[27] !== isLoading || $[28] !== mods || $[29] !== t27 || $[30] !== t28 || $[31] !== theme || $[32] !== type) {
+		t29 = {
 			disabled: finalIsDisabled,
-			selected: t26,
+			selected: t27,
 			loading: isLoading,
-			...t27,
+			...t28,
 			type,
 			theme,
 			shape: finalShape,
@@ -440,59 +442,59 @@ const Item = (props, ref) => {
 		$[26] = finalShape;
 		$[27] = isLoading;
 		$[28] = mods;
-		$[29] = t26;
-		$[30] = t27;
+		$[29] = t27;
+		$[30] = t28;
 		$[31] = theme;
 		$[32] = type;
-		$[33] = t28;
-	} else t28 = $[33];
-	const baseMods = t28;
-	let t29;
+		$[33] = t29;
+	} else t29 = $[33];
+	const baseMods = t29;
+	let t30;
 	bb0: {
 		if (hasCheckmark) {
-			let t30;
+			let t31;
 			if ($[34] === Symbol.for("react.memo_cache_sentinel")) {
-				t30 = {
+				t31 = {
 					content: null,
 					hasSlot: true
 				};
-				$[34] = t30;
-			} else t30 = $[34];
-			t29 = t30;
+				$[34] = t31;
+			} else t31 = $[34];
+			t30 = t31;
 			break bb0;
 		}
-		const t30 = iconProp;
-		let t31;
-		if ($[35] !== baseMods || $[36] !== t30) {
-			t31 = resolveIcon(t30, baseMods);
+		const t31 = iconProp;
+		let t32;
+		if ($[35] !== baseMods || $[36] !== t31) {
+			t32 = resolveIcon(t31, baseMods);
 			$[35] = baseMods;
-			$[36] = t30;
-			$[37] = t31;
-		} else t31 = $[37];
-		t29 = t31;
+			$[36] = t31;
+			$[37] = t32;
+		} else t32 = $[37];
+		t30 = t32;
 	}
-	const resolvedIcon = t29;
-	let t30;
+	const resolvedIcon = t30;
+	let t31;
 	if ($[38] !== baseMods || $[39] !== rightIconProp) {
-		t30 = resolveIcon(rightIconProp, baseMods);
+		t31 = resolveIcon(rightIconProp, baseMods);
 		$[38] = baseMods;
 		$[39] = rightIconProp;
-		$[40] = t30;
-	} else t30 = $[40];
-	const resolvedRightIcon = t30;
-	let t31;
+		$[40] = t31;
+	} else t31 = $[40];
+	const resolvedRightIcon = t31;
+	let t32;
 	bb1: {
 		if (loadingSlot !== "auto") {
-			t31 = loadingSlot;
+			t32 = loadingSlot;
 			break bb1;
 		}
 		if (resolvedRightIcon.hasSlot && !resolvedIcon.hasSlot) {
-			t31 = "rightIcon";
+			t32 = "rightIcon";
 			break bb1;
 		}
-		t31 = "icon";
+		t32 = "icon";
 	}
-	const resolvedLoadingSlot = t31;
+	const resolvedLoadingSlot = t32;
 	const hasIconSlot = resolvedIcon.hasSlot || isLoading && resolvedLoadingSlot === "icon";
 	const hasRightIconSlot = resolvedRightIcon.hasSlot || isLoading && resolvedLoadingSlot === "rightIcon";
 	let copyProps;
@@ -502,64 +504,64 @@ const Item = (props, ref) => {
 		$[41] = descriptionProps;
 		$[42] = copyProps;
 	} else copyProps = $[42];
-	let t32;
+	let t33;
 	if ($[43] !== copyProps || $[44] !== description) {
-		t32 = description || Object.keys(copyProps).length > 0;
+		t33 = description || Object.keys(copyProps).length > 0;
 		$[43] = copyProps;
 		$[44] = description;
-		$[45] = t32;
-	} else t32 = $[45];
-	const showDescription = !!t32;
-	let t33;
+		$[45] = t33;
+	} else t33 = $[45];
+	const showDescription = !!t33;
+	let t34;
 	if ($[46] !== isLoading || $[47] !== resolvedIcon.content || $[48] !== resolvedLoadingSlot) {
-		t33 = isLoading && resolvedLoadingSlot === "icon" ? /* @__PURE__ */ jsx(LoadingIcon, {}) : resolvedIcon.content;
+		t34 = isLoading && resolvedLoadingSlot === "icon" ? /* @__PURE__ */ jsx(LoadingIcon, {}) : resolvedIcon.content;
 		$[46] = isLoading;
 		$[47] = resolvedIcon.content;
 		$[48] = resolvedLoadingSlot;
-		$[49] = t33;
-	} else t33 = $[49];
-	const finalIcon = t33;
-	let t34;
+		$[49] = t34;
+	} else t34 = $[49];
+	const finalIcon = t34;
+	let t35;
 	if ($[50] !== isLoading || $[51] !== resolvedLoadingSlot || $[52] !== resolvedRightIcon.content) {
-		t34 = isLoading && resolvedLoadingSlot === "rightIcon" ? /* @__PURE__ */ jsx(LoadingIcon, {}) : resolvedRightIcon.content;
+		t35 = isLoading && resolvedLoadingSlot === "rightIcon" ? /* @__PURE__ */ jsx(LoadingIcon, {}) : resolvedRightIcon.content;
 		$[50] = isLoading;
 		$[51] = resolvedLoadingSlot;
 		$[52] = resolvedRightIcon.content;
-		$[53] = t34;
-	} else t34 = $[53];
-	const finalRightIcon = t34;
-	let t35;
+		$[53] = t35;
+	} else t35 = $[53];
+	const finalRightIcon = t35;
+	let t36;
 	if ($[54] !== finalIcon || $[55] !== hasCheckmark || $[56] !== isLoading || $[57] !== resolvedLoadingSlot) {
-		t35 = hasCheckmark ? "checkmark" : isLoading && resolvedLoadingSlot === "icon" ? "loading" : isValidElement(finalIcon) ? finalIcon.type?.displayName || finalIcon.type?.name || "icon" : finalIcon ? "icon" : "empty";
+		t36 = hasCheckmark ? "checkmark" : isLoading && resolvedLoadingSlot === "icon" ? "loading" : isValidElement(finalIcon) ? finalIcon.type?.displayName || finalIcon.type?.name || "icon" : finalIcon ? "icon" : "empty";
 		$[54] = finalIcon;
 		$[55] = hasCheckmark;
 		$[56] = isLoading;
 		$[57] = resolvedLoadingSlot;
-		$[58] = t35;
-	} else t35 = $[58];
-	const iconKey = t35;
-	let t36;
+		$[58] = t36;
+	} else t36 = $[58];
+	const iconKey = t36;
+	let t37;
 	if ($[59] !== finalRightIcon || $[60] !== isLoading || $[61] !== resolvedLoadingSlot) {
-		t36 = isLoading && resolvedLoadingSlot === "rightIcon" ? "loading" : isValidElement(finalRightIcon) ? finalRightIcon.type?.displayName || finalRightIcon.type?.name || "icon" : finalRightIcon ? "icon" : "empty";
+		t37 = isLoading && resolvedLoadingSlot === "rightIcon" ? "loading" : isValidElement(finalRightIcon) ? finalRightIcon.type?.displayName || finalRightIcon.type?.name || "icon" : finalRightIcon ? "icon" : "empty";
 		$[59] = finalRightIcon;
 		$[60] = isLoading;
 		$[61] = resolvedLoadingSlot;
-		$[62] = t36;
-	} else t36 = $[62];
-	const rightIconKey = t36;
-	let t37;
+		$[62] = t37;
+	} else t37 = $[62];
+	const rightIconKey = t37;
+	let t38;
 	if ($[63] !== isLoading || $[64] !== prefix || $[65] !== resolvedLoadingSlot) {
-		t37 = isLoading && resolvedLoadingSlot === "prefix" ? /* @__PURE__ */ jsx(LoadingIcon, {}) : prefix;
+		t38 = isLoading && resolvedLoadingSlot === "prefix" ? /* @__PURE__ */ jsx(LoadingIcon, {}) : prefix;
 		$[63] = isLoading;
 		$[64] = prefix;
 		$[65] = resolvedLoadingSlot;
-		$[66] = t37;
-	} else t37 = $[66];
-	const finalPrefix = t37;
+		$[66] = t38;
+	} else t38 = $[66];
+	const finalPrefix = t38;
 	const hotkeysType = theme === "current" ? "inherit" : type === "primary" ? "primary" : "default";
-	let t38;
+	let t39;
 	if ($[67] !== finalIsDisabled || $[68] !== hotkeys || $[69] !== hotkeysType || $[70] !== isLoading || $[71] !== keyboardShortcutProps || $[72] !== resolvedLoadingSlot || $[73] !== suffix) {
-		t38 = isLoading && resolvedLoadingSlot === "suffix" ? /* @__PURE__ */ jsx(LoadingIcon, {}) : suffix ?? (hotkeys ? /* @__PURE__ */ jsx(_HotKeys, {
+		t39 = isLoading && resolvedLoadingSlot === "suffix" ? /* @__PURE__ */ jsx(LoadingIcon, {}) : suffix ?? (hotkeys ? /* @__PURE__ */ jsx(_HotKeys, {
 			...keyboardShortcutProps,
 			type: hotkeysType,
 			styles: {
@@ -575,18 +577,18 @@ const Item = (props, ref) => {
 		$[71] = keyboardShortcutProps;
 		$[72] = resolvedLoadingSlot;
 		$[73] = suffix;
-		$[74] = t38;
-	} else t38 = $[74];
-	const finalSuffix = t38;
-	let t39;
+		$[74] = t39;
+	} else t39 = $[74];
+	const finalSuffix = t39;
+	let t40;
 	if ($[75] !== hotkeys) {
-		t39 = typeof hotkeys === "string" ? hotkeys.toLowerCase() : "";
+		t40 = typeof hotkeys === "string" ? hotkeys.toLowerCase() : "";
 		$[75] = hotkeys;
-		$[76] = t39;
-	} else t39 = $[76];
-	let t40;
+		$[76] = t40;
+	} else t40 = $[76];
+	let t41;
 	if ($[77] !== finalIsDisabled || $[78] !== hotkeys || $[79] !== ref) {
-		t40 = () => {
+		t41 = () => {
 			if (!hotkeys) return;
 			if (finalIsDisabled) return;
 			if (ref && typeof ref === "object" && ref.current) ref.current.click();
@@ -594,58 +596,58 @@ const Item = (props, ref) => {
 		$[77] = finalIsDisabled;
 		$[78] = hotkeys;
 		$[79] = ref;
-		$[80] = t40;
-	} else t40 = $[80];
-	const t41 = !!hotkeys;
-	let t42;
-	if ($[81] !== t41) {
-		t42 = {
+		$[80] = t41;
+	} else t41 = $[80];
+	const t42 = !!hotkeys;
+	let t43;
+	if ($[81] !== t42) {
+		t43 = {
 			enableOnContentEditable: true,
-			enabled: t41,
+			enabled: t42,
 			preventDefault: true,
 			enableOnFormTags: true
 		};
-		$[81] = t41;
-		$[82] = t42;
-	} else t42 = $[82];
-	let t43;
+		$[81] = t42;
+		$[82] = t43;
+	} else t43 = $[82];
+	let t44;
 	if ($[83] !== finalIsDisabled || $[84] !== hotkeys) {
-		t43 = [hotkeys, finalIsDisabled];
+		t44 = [hotkeys, finalIsDisabled];
 		$[83] = finalIsDisabled;
 		$[84] = hotkeys;
-		$[85] = t43;
-	} else t43 = $[85];
-	useHotkeys(t39, t40, t42, t43);
-	const t44 = !!(hasIconSlot || finalPrefix);
-	const t45 = !!(hasRightIconSlot || finalSuffix || actions);
-	const t46 = !!finalPrefix;
-	const t47 = !!finalSuffix;
-	const t48 = !!actions;
-	const t49 = !!(actions && actions !== true);
-	const t50 = autoHideActions === true;
-	const t51 = preserveActionsSpace === true;
-	const t52 = showActions && insideWrapper;
-	const t53 = showDescription ? finalDescriptionPlacement : "none";
-	let t54;
-	if ($[86] !== baseMods || $[87] !== hasCheckmark || $[88] !== hasIconSlot || $[89] !== hasLabel || $[90] !== hasRightIconSlot || $[91] !== insideWrapper || $[92] !== showDescription || $[93] !== t44 || $[94] !== t45 || $[95] !== t46 || $[96] !== t47 || $[97] !== t48 || $[98] !== t49 || $[99] !== t50 || $[100] !== t51 || $[101] !== t52 || $[102] !== t53) {
-		t54 = {
+		$[85] = t44;
+	} else t44 = $[85];
+	useHotkeys(t40, t41, t43, t44);
+	const t45 = !!(hasIconSlot || finalPrefix);
+	const t46 = !!(hasRightIconSlot || finalSuffix || actions);
+	const t47 = !!finalPrefix;
+	const t48 = !!finalSuffix;
+	const t49 = !!actions;
+	const t50 = !!(actions && actions !== true);
+	const t51 = autoHideActions === true;
+	const t52 = preserveActionsSpace === true;
+	const t53 = showActions && insideWrapper;
+	const t54 = showDescription ? finalDescriptionPlacement : "none";
+	let t55;
+	if ($[86] !== baseMods || $[87] !== hasCheckmark || $[88] !== hasIconSlot || $[89] !== hasLabel || $[90] !== hasRightIconSlot || $[91] !== insideWrapper || $[92] !== showDescription || $[93] !== t45 || $[94] !== t46 || $[95] !== t47 || $[96] !== t48 || $[97] !== t49 || $[98] !== t50 || $[99] !== t51 || $[100] !== t52 || $[101] !== t53 || $[102] !== t54) {
+		t55 = {
 			...baseMods,
 			"has-icon": hasIconSlot,
-			"has-start-content": t44,
-			"has-end-content": t45,
+			"has-start-content": t45,
+			"has-end-content": t46,
 			"has-right-icon": hasRightIconSlot,
 			"has-label": hasLabel,
-			"has-prefix": t46,
-			"has-suffix": t47,
+			"has-prefix": t47,
+			"has-suffix": t48,
 			"has-description": showDescription,
-			"has-actions": t48,
-			"has-actions-content": t49,
-			"auto-hide-actions": t50,
-			"preserve-actions-space": t51,
+			"has-actions": t49,
+			"has-actions-content": t50,
+			"auto-hide-actions": t51,
+			"preserve-actions-space": t52,
 			"inside-wrapper": insideWrapper,
-			"actions-shown": t52,
+			"actions-shown": t53,
 			checkmark: hasCheckmark,
-			description: t53
+			description: t54
 		};
 		$[86] = baseMods;
 		$[87] = hasCheckmark;
@@ -654,77 +656,83 @@ const Item = (props, ref) => {
 		$[90] = hasRightIconSlot;
 		$[91] = insideWrapper;
 		$[92] = showDescription;
-		$[93] = t44;
-		$[94] = t45;
-		$[95] = t46;
-		$[96] = t47;
-		$[97] = t48;
-		$[98] = t49;
-		$[99] = t50;
-		$[100] = t51;
-		$[101] = t52;
-		$[102] = t53;
-		$[103] = t54;
-	} else t54 = $[103];
-	const finalMods = t54;
-	const t55 = !!actions || insideWrapper;
-	let t56;
-	if ($[104] !== children || $[105] !== labelProps || $[106] !== t55 || $[107] !== tooltip) {
-		t56 = {
+		$[93] = t45;
+		$[94] = t46;
+		$[95] = t47;
+		$[96] = t48;
+		$[97] = t49;
+		$[98] = t50;
+		$[99] = t51;
+		$[100] = t52;
+		$[101] = t53;
+		$[102] = t54;
+		$[103] = t55;
+	} else t55 = $[103];
+	const finalMods = t55;
+	const t56 = isDynamicLabel || !!actions || insideWrapper;
+	let t57;
+	if ($[104] !== children || $[105] !== labelProps || $[106] !== labelRefProp || $[107] !== t56 || $[108] !== tooltip) {
+		t57 = {
 			tooltip,
 			children,
 			labelProps,
-			isDynamicLabel: t55
+			labelRef: labelRefProp,
+			isDynamicLabel: t56
 		};
 		$[104] = children;
 		$[105] = labelProps;
-		$[106] = t55;
-		$[107] = tooltip;
-		$[108] = t56;
-	} else t56 = $[108];
-	const { labelProps: finalLabelProps, labelRef, renderWithTooltip, isTooltipActive } = useAutoTooltip(t56);
+		$[106] = labelRefProp;
+		$[107] = t56;
+		$[108] = tooltip;
+		$[109] = t57;
+	} else t57 = $[109];
+	const { labelProps: finalLabelProps, labelRef, renderWithTooltip, isTooltipActive } = useAutoTooltip(t57);
 	const { isNativelyDisabled, isInert, inertProps } = getDisabledElementProps({
 		isDisabled: finalIsDisabled,
 		keepEvents: isTooltipActive,
 		as: rest.as
 	});
-	let t57;
+	let t58;
 	bb2: {
 		if (typeof children === "string" && highlight) {
-			let t58;
-			if ($[109] !== children || $[110] !== highlight || $[111] !== highlightCaseSensitive || $[112] !== highlightStyles) {
-				t58 = highlightText(children, highlight, highlightCaseSensitive, highlightStyles);
-				$[109] = children;
-				$[110] = highlight;
-				$[111] = highlightCaseSensitive;
-				$[112] = highlightStyles;
-				$[113] = t58;
-			} else t58 = $[113];
-			t57 = t58;
+			let t59;
+			if ($[110] !== children || $[111] !== highlight || $[112] !== highlightCaseSensitive || $[113] !== highlightStyles) {
+				t59 = highlightText(children, highlight, highlightCaseSensitive, highlightStyles);
+				$[110] = children;
+				$[111] = highlight;
+				$[112] = highlightCaseSensitive;
+				$[113] = highlightStyles;
+				$[114] = t59;
+			} else t59 = $[114];
+			t58 = t59;
 			break bb2;
 		}
-		t57 = children;
+		t58 = children;
 	}
-	const processedChildren = t57;
-	let t58;
+	const processedChildren = t58;
+	let t59;
 	bb3: {
 		if (typeof description === "string" && highlight) {
-			let t59;
-			if ($[114] !== description || $[115] !== highlight || $[116] !== highlightCaseSensitive || $[117] !== highlightStyles) {
-				t59 = highlightText(description, highlight, highlightCaseSensitive, highlightStyles);
-				$[114] = description;
-				$[115] = highlight;
-				$[116] = highlightCaseSensitive;
-				$[117] = highlightStyles;
-				$[118] = t59;
-			} else t59 = $[118];
-			t58 = t59;
+			let t60;
+			if ($[115] !== description || $[116] !== highlight || $[117] !== highlightCaseSensitive || $[118] !== highlightStyles) {
+				t60 = highlightText(description, highlight, highlightCaseSensitive, highlightStyles);
+				$[115] = description;
+				$[116] = highlight;
+				$[117] = highlightCaseSensitive;
+				$[118] = highlightStyles;
+				$[119] = t60;
+			} else t60 = $[119];
+			t59 = t60;
 			break bb3;
 		}
-		t58 = description;
+		t59 = description;
 	}
-	const processedDescription = t58;
+	const processedDescription = t59;
 	const renderItemElement = (tooltipTriggerProps, tooltipRef) => {
+		const { pointerProps: elementTooltipProps, focusProps: tooltipFocusProps } = typeof hiddenContent === "function" ? splitTooltipTriggerProps(tooltipTriggerProps) : {
+			pointerProps: tooltipTriggerProps,
+			focusProps: void 0
+		};
 		const handleRef = (element) => {
 			if (typeof ref === "function") ref(element);
 			else if (ref) ref.current = element;
@@ -743,9 +751,10 @@ const Item = (props, ref) => {
 				...sizeTokenValue ? { $size: sizeTokenValue } : {}
 			},
 			type: htmlType,
-			...mergeProps(isInert ? omitActivationEventProps(rest) : rest, tooltipTriggerProps || {}, inertProps),
+			...mergeProps(isInert ? omitActivationEventProps(rest) : rest, elementTooltipProps || {}, inertProps),
 			style,
 			children: [
+				typeof hiddenContent === "function" ? hiddenContent(tooltipFocusProps ?? {}) : hiddenContent,
 				hasIconSlot && /* @__PURE__ */ jsx("div", {
 					"data-element": "Icon",
 					children: /* @__PURE__ */ jsx(IconSwitch, {