@yahoo/uds 3.102.0 → 3.103.0

package/dist/components/client/Tooltip/TooltipContent.js

@@ -0,0 +1,186 @@
+"use client";
+/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
+import { cx, getStyles } from "../../../styles/styler.js";
+import { Box } from "../../Box.js";
+import { Text } from "../../Text.js";
+import { IconSlot } from "../../IconSlot.js";
+import { useTooltipConfig } from "./UDSTooltipConfigProvider.js";
+import { TooltipInternalContext } from "./tooltipContext.js";
+import { useForkRef } from "../../../hooks/useForkRef.js";
+import { ARROW_HEIGHT } from "./util.js";
+import { useTooltipContent } from "./useTooltipContent.js";
+import { Fragment, forwardRef, isValidElement, useContext, useRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Tooltip, TooltipArrow, useStoreState, useTooltipContext } from "@ariakit/react";
+
+//#region src/components/client/Tooltip/TooltipContent.tsx
+const TooltipContent = forwardRef(function TooltipContent({ children, maxWidth, startTitleIcon, title, endContent, className, id }, ref) {
+	const store = useTooltipContext();
+	const open = useStoreState(store, "open");
+	const internalContext = useContext(TooltipInternalContext);
+	const currentPlacement = useStoreState(store, "currentPlacement");
+	const placement = useStoreState(store, "placement");
+	const effectivePlacement = currentPlacement ?? placement ?? "top";
+	const { borderRadius, animationDuration } = useTooltipConfig();
+	const defaultBorderRadius = borderRadius["default"];
+	const arrowRef = useRef(null);
+	const { internalRef, shadowFilterId, maxWidthClass, dimensions, shadows, shadowPadding, svgPath, blurStyle, childTransitionStyle, tooltipShift, onPositionUpdate } = useTooltipContent({
+		open: open ?? false,
+		effectivePlacement,
+		maxWidth,
+		borderRadius: defaultBorderRadius,
+		arrowRef,
+		animationDuration
+	});
+	const mergedRef = useForkRef(ref, internalRef);
+	const classNames = {
+		root: getStyles({
+			tooltipSizeRoot: "default",
+			tooltipVariantRoot: "default",
+			className: cx(maxWidthClass, "flex", "z-[9999]", className)
+		}),
+		svg: getStyles({
+			tooltipSizeSvg: "default",
+			tooltipVariantSvg: "default",
+			className: cx("stroke-1", "uds-bgBlurFillFallback")
+		}),
+		blur: getStyles({
+			tooltipVariantBlur: "default",
+			position: "absolute",
+			width: "full",
+			height: "full",
+			className: cx("uds-bgBlurFallback", "top-0", "left-0", "z-[1]", "transition-opacity", `duration-[${animationDuration}ms]`, "ease-in-out")
+		}),
+		title: getStyles({ tooltipSizeTitle: "default" }),
+		body: getStyles({ tooltipSizeBody: "default" }),
+		endContent: getStyles({ tooltipSizeEndContent: "default" }),
+		icon: getStyles({
+			tooltipSizeIcon: "default",
+			tooltipVariantIcon: "default"
+		})
+	};
+	return /* @__PURE__ */ jsxs(Tooltip, {
+		ref: mergedRef,
+		className: classNames.root,
+		hideOnHoverOutside: internalContext ? internalContext.hideOnHoverOutside : void 0,
+		portal: internalContext ? internalContext.portal : true,
+		gutter: 10,
+		updatePosition: onPositionUpdate,
+		style: tooltipShift.x !== 0 || tooltipShift.y !== 0 ? { transform: `translate(${tooltipShift.x}px, ${tooltipShift.y}px)` } : void 0,
+		children: [
+			/* @__PURE__ */ jsx(Box, {
+				className: classNames.blur,
+				style: {
+					...blurStyle,
+					...childTransitionStyle
+				}
+			}),
+			svgPath && /* @__PURE__ */ jsxs("svg", {
+				"aria-hidden": true,
+				className: "absolute top-0 left-0 w-full h-full overflow-visible pointer-events-none z-[2]",
+				style: childTransitionStyle,
+				viewBox: `0 0 ${dimensions.width} ${dimensions.height}`,
+				children: [
+					shadows.length > 0 && /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("filter", {
+						id: shadowFilterId,
+						filterUnits: "userSpaceOnUse",
+						x: -(shadowPadding + ARROW_HEIGHT),
+						y: -(shadowPadding + ARROW_HEIGHT),
+						width: dimensions.width + 2 * (shadowPadding + ARROW_HEIGHT),
+						height: dimensions.height + 2 * (shadowPadding + ARROW_HEIGHT),
+						colorInterpolationFilters: "sRGB",
+						children: [
+							shadows.map((shadow, i) => /* @__PURE__ */ jsxs(Fragment, { children: [
+								shadow.spread !== 0 && /* @__PURE__ */ jsx("feMorphology", {
+									in: "SourceAlpha",
+									operator: shadow.spread > 0 ? "dilate" : "erode",
+									radius: Math.abs(shadow.spread),
+									result: `spread${i}`
+								}),
+								/* @__PURE__ */ jsx("feGaussianBlur", {
+									in: shadow.spread !== 0 ? `spread${i}` : "SourceAlpha",
+									stdDeviation: shadow.blur / 2,
+									result: `blurred${i}`
+								}),
+								/* @__PURE__ */ jsx("feOffset", {
+									in: `blurred${i}`,
+									dx: shadow.x,
+									dy: shadow.y,
+									result: `offset${i}`
+								}),
+								/* @__PURE__ */ jsx("feFlood", {
+									floodColor: shadow.color,
+									result: `color${i}`
+								}),
+								/* @__PURE__ */ jsx("feComposite", {
+									in: `color${i}`,
+									in2: `offset${i}`,
+									operator: "in",
+									result: `shadow${i}`
+								})
+							] }, i)),
+							/* @__PURE__ */ jsx("feMerge", {
+								result: "mergedShadows",
+								children: shadows.map((_, i) => /* @__PURE__ */ jsx("feMergeNode", { in: `shadow${i}` }, i))
+							}),
+							/* @__PURE__ */ jsx("feComposite", {
+								in: "mergedShadows",
+								in2: "SourceAlpha",
+								operator: "out"
+							})
+						]
+					}) }),
+					shadows.length > 0 && /* @__PURE__ */ jsx("path", {
+						d: svgPath,
+						fill: "black",
+						filter: `url(#${shadowFilterId})`
+					}),
+					/* @__PURE__ */ jsx("path", {
+						d: svgPath,
+						className: classNames.svg
+					})
+				]
+			}),
+			/* @__PURE__ */ jsxs(Box, {
+				position: "relative",
+				flexDirection: "column",
+				className: "z-[3] gap-[inherit]",
+				style: childTransitionStyle,
+				id,
+				children: [title && /* @__PURE__ */ jsxs(Box, {
+					alignItems: "center",
+					columnGap: "1",
+					children: [startTitleIcon && /* @__PURE__ */ jsx(IconSlot, {
+						iconProps: { variant: "fill" },
+						icon: startTitleIcon,
+						className: classNames.icon
+					}), /* @__PURE__ */ jsx(Text, {
+						className: classNames.title,
+						color: "inherit",
+						children: title
+					})]
+				}), /* @__PURE__ */ jsxs(Box, {
+					alignItems: "center",
+					columnGap: "1.5",
+					children: [/* @__PURE__ */ jsx(Text, {
+						className: classNames.body,
+						color: "inherit",
+						children
+					}), endContent && !isValidElement(endContent) ? /* @__PURE__ */ jsx(Text, {
+						className: classNames.endContent,
+						color: "inherit",
+						children: endContent
+					}) : endContent]
+				})]
+			}),
+			/* @__PURE__ */ jsx(TooltipArrow, {
+				ref: arrowRef,
+				style: { opacity: 0 }
+			})
+		]
+	});
+});
+TooltipContent.displayName = "TooltipContent";
+
+//#endregion
+export { TooltipContent };

package/dist/components/client/Tooltip/TooltipTrigger.cjs

@@ -0,0 +1,20 @@
+"use client";
+/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_runtime = require('../../../_virtual/_rolldown/runtime.cjs');
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _ariakit_react = require("@ariakit/react");
+
+//#region src/components/client/Tooltip/TooltipTrigger.tsx
+function TooltipTrigger({ children }) {
+	if ((0, react.isValidElement)(children) && children.type !== react.Fragment) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ariakit_react.TooltipAnchor, { render: children });
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ariakit_react.TooltipAnchor, {
+		className: "inline",
+		children
+	});
+}
+TooltipTrigger.displayName = "TooltipTrigger";
+
+//#endregion
+exports.TooltipTrigger = TooltipTrigger;

package/dist/components/client/Tooltip/TooltipTrigger.d.cts

@@ -0,0 +1,14 @@
+
+import { UniversalTooltipTriggerProps } from "../../../types/dist/index.cjs";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/client/Tooltip/TooltipTrigger.d.ts
+type TooltipTriggerProps = UniversalTooltipTriggerProps;
+declare function TooltipTrigger({
+  children
+}: TooltipTriggerProps): react_jsx_runtime0.JSX.Element;
+declare namespace TooltipTrigger {
+  var displayName: string;
+}
+//#endregion
+export { TooltipTrigger };

package/dist/components/client/Tooltip/TooltipTrigger.d.ts

@@ -0,0 +1,14 @@
+
+import { UniversalTooltipTriggerProps } from "../../../types/dist/index.js";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/client/Tooltip/TooltipTrigger.d.ts
+type TooltipTriggerProps = UniversalTooltipTriggerProps;
+declare function TooltipTrigger({
+  children
+}: TooltipTriggerProps): react_jsx_runtime0.JSX.Element;
+declare namespace TooltipTrigger {
+  var displayName: string;
+}
+//#endregion
+export { TooltipTrigger };

package/dist/components/client/Tooltip/TooltipTrigger.js

@@ -0,0 +1,18 @@
+"use client";
+/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
+import { Fragment, isValidElement } from "react";
+import { jsx } from "react/jsx-runtime";
+import { TooltipAnchor } from "@ariakit/react";
+
+//#region src/components/client/Tooltip/TooltipTrigger.tsx
+function TooltipTrigger({ children }) {
+	if (isValidElement(children) && children.type !== Fragment) return /* @__PURE__ */ jsx(TooltipAnchor, { render: children });
+	return /* @__PURE__ */ jsx(TooltipAnchor, {
+		className: "inline",
+		children
+	});
+}
+TooltipTrigger.displayName = "TooltipTrigger";
+
+//#endregion
+export { TooltipTrigger };

package/dist/components/client/Tooltip/UDSTooltipConfigProvider.cjs

@@ -0,0 +1,40 @@
+"use client";
+/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_runtime = require('../../../_virtual/_rolldown/runtime.cjs');
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/components/client/Tooltip/UDSTooltipConfigProvider.tsx
+const TooltipContext = (0, react.createContext)(void 0);
+const UDSTooltipConfigProvider = ({ children, value }) => {
+	const existingContext = (0, react.useContext)(TooltipContext);
+	if ("type" in value) {
+		if (!existingContext) throw new Error("Cannot merge context values without an existing TooltipContext");
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TooltipContext.Provider, {
+			value: {
+				...existingContext,
+				...value.value
+			},
+			children
+		});
+	}
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TooltipContext.Provider, {
+		value,
+		children
+	});
+};
+UDSTooltipConfigProvider.displayName = "UDSTooltipConfigProvider";
+function useTooltipConfig(options) {
+	const context = (0, react.useContext)(TooltipContext);
+	if (!context) throw new Error("useTooltipConfig must be used within a UDSConfigProvider or UDSTooltipConfigProvider");
+	const { placementMap, placement, ...contextRest } = context;
+	return {
+		...contextRest,
+		ariaKitPlacement: placementMap[options?.placement ?? placement]
+	};
+}
+
+//#endregion
+exports.UDSTooltipConfigProvider = UDSTooltipConfigProvider;
+exports.useTooltipConfig = useTooltipConfig;

package/dist/components/client/Tooltip/UDSTooltipConfigProvider.d.cts

@@ -0,0 +1,28 @@
+
+import { TooltipPlacement } from "../../../types/dist/index.cjs";
+import { UDSTooltipConfigContextType } from "../../../runtime/tooltipConfig.cjs";
+import { PropsWithChildren } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { TooltipProviderProps } from "@ariakit/react";
+
+//#region src/components/client/Tooltip/UDSTooltipConfigProvider.d.ts
+interface UDSTooltipConfigProviderProps extends PropsWithChildren {
+  value: UDSTooltipConfigContextType | {
+    type: 'merge';
+    value: Partial<UDSTooltipConfigContextType>;
+  };
+}
+declare const UDSTooltipConfigProvider: {
+  ({
+    children,
+    value
+  }: UDSTooltipConfigProviderProps): react_jsx_runtime0.JSX.Element;
+  displayName: string;
+};
+declare function useTooltipConfig(options?: {
+  placement?: TooltipPlacement;
+}): Omit<UDSTooltipConfigContextType, 'placementMap' | 'placement'> & {
+  ariaKitPlacement: TooltipProviderProps['placement'];
+};
+//#endregion
+export { type UDSTooltipConfigContextType, UDSTooltipConfigProvider, type UDSTooltipConfigProviderProps, useTooltipConfig };

package/dist/components/client/Tooltip/UDSTooltipConfigProvider.d.ts

@@ -0,0 +1,28 @@
+
+import { TooltipPlacement } from "../../../types/dist/index.js";
+import { UDSTooltipConfigContextType } from "../../../runtime/tooltipConfig.js";
+import { PropsWithChildren } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { TooltipProviderProps } from "@ariakit/react";
+
+//#region src/components/client/Tooltip/UDSTooltipConfigProvider.d.ts
+interface UDSTooltipConfigProviderProps extends PropsWithChildren {
+  value: UDSTooltipConfigContextType | {
+    type: 'merge';
+    value: Partial<UDSTooltipConfigContextType>;
+  };
+}
+declare const UDSTooltipConfigProvider: {
+  ({
+    children,
+    value
+  }: UDSTooltipConfigProviderProps): react_jsx_runtime0.JSX.Element;
+  displayName: string;
+};
+declare function useTooltipConfig(options?: {
+  placement?: TooltipPlacement;
+}): Omit<UDSTooltipConfigContextType, 'placementMap' | 'placement'> & {
+  ariaKitPlacement: TooltipProviderProps['placement'];
+};
+//#endregion
+export { type UDSTooltipConfigContextType, UDSTooltipConfigProvider, type UDSTooltipConfigProviderProps, useTooltipConfig };

package/dist/components/client/Tooltip/UDSTooltipConfigProvider.js

@@ -0,0 +1,37 @@
+"use client";
+/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
+import { createContext, useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/client/Tooltip/UDSTooltipConfigProvider.tsx
+const TooltipContext = createContext(void 0);
+const UDSTooltipConfigProvider = ({ children, value }) => {
+	const existingContext = useContext(TooltipContext);
+	if ("type" in value) {
+		if (!existingContext) throw new Error("Cannot merge context values without an existing TooltipContext");
+		return /* @__PURE__ */ jsx(TooltipContext.Provider, {
+			value: {
+				...existingContext,
+				...value.value
+			},
+			children
+		});
+	}
+	return /* @__PURE__ */ jsx(TooltipContext.Provider, {
+		value,
+		children
+	});
+};
+UDSTooltipConfigProvider.displayName = "UDSTooltipConfigProvider";
+function useTooltipConfig(options) {
+	const context = useContext(TooltipContext);
+	if (!context) throw new Error("useTooltipConfig must be used within a UDSConfigProvider or UDSTooltipConfigProvider");
+	const { placementMap, placement, ...contextRest } = context;
+	return {
+		...contextRest,
+		ariaKitPlacement: placementMap[options?.placement ?? placement]
+	};
+}
+
+//#endregion
+export { UDSTooltipConfigProvider, useTooltipConfig };

package/dist/components/client/Tooltip/index.cjs

@@ -0,0 +1,12 @@
+"use client";
+/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_components_client_Tooltip_UDSTooltipConfigProvider = require('./UDSTooltipConfigProvider.cjs');
+const require_components_client_Tooltip_Tooltip = require('./Tooltip.cjs');
+const require_components_client_Tooltip_TooltipContent = require('./TooltipContent.cjs');
+const require_components_client_Tooltip_TooltipTrigger = require('./TooltipTrigger.cjs');
+
+exports.Tooltip = require_components_client_Tooltip_Tooltip.Tooltip;
+exports.TooltipContent = require_components_client_Tooltip_TooltipContent.TooltipContent;
+exports.TooltipTrigger = require_components_client_Tooltip_TooltipTrigger.TooltipTrigger;
+exports.UDSTooltipConfigProvider = require_components_client_Tooltip_UDSTooltipConfigProvider.UDSTooltipConfigProvider;

package/dist/components/client/Tooltip/index.d.cts

@@ -0,0 +1,7 @@
+
+import { UniversalTooltipContentProps, UniversalTooltipProps, UniversalTooltipTriggerProps } from "../../../types/dist/index.cjs";
+import { Tooltip } from "./Tooltip.cjs";
+import { TooltipContent } from "./TooltipContent.cjs";
+import { TooltipTrigger } from "./TooltipTrigger.cjs";
+import { UDSTooltipConfigProvider, UDSTooltipConfigProviderProps } from "./UDSTooltipConfigProvider.cjs";
+export { Tooltip, TooltipContent, type UniversalTooltipContentProps as TooltipContentProps, type UniversalTooltipProps as TooltipProps, TooltipTrigger, type UniversalTooltipTriggerProps as TooltipTriggerProps, UDSTooltipConfigProvider, type UDSTooltipConfigProviderProps };

package/dist/components/client/Tooltip/index.d.ts

@@ -0,0 +1,7 @@
+
+import { UniversalTooltipContentProps, UniversalTooltipProps, UniversalTooltipTriggerProps } from "../../../types/dist/index.js";
+import { Tooltip } from "./Tooltip.js";
+import { TooltipContent } from "./TooltipContent.js";
+import { TooltipTrigger } from "./TooltipTrigger.js";
+import { UDSTooltipConfigProvider, UDSTooltipConfigProviderProps } from "./UDSTooltipConfigProvider.js";
+export { Tooltip, TooltipContent, type UniversalTooltipContentProps as TooltipContentProps, type UniversalTooltipProps as TooltipProps, TooltipTrigger, type UniversalTooltipTriggerProps as TooltipTriggerProps, UDSTooltipConfigProvider, type UDSTooltipConfigProviderProps };

package/dist/components/client/Tooltip/index.js

@@ -0,0 +1,8 @@
+"use client";
+/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
+import { UDSTooltipConfigProvider } from "./UDSTooltipConfigProvider.js";
+import { Tooltip } from "./Tooltip.js";
+import { TooltipContent } from "./TooltipContent.js";
+import { TooltipTrigger } from "./TooltipTrigger.js";
+
+export { Tooltip, TooltipContent, TooltipTrigger, UDSTooltipConfigProvider };

package/dist/components/client/Tooltip/tooltipContext.cjs

@@ -0,0 +1,12 @@
+"use client";
+/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_runtime = require('../../../_virtual/_rolldown/runtime.cjs');
+let react = require("react");
+
+//#region src/components/client/Tooltip/tooltipContext.tsx
+/** When true, tooltip content should hide when pointer leaves anchor/tooltip. */
+const TooltipInternalContext = (0, react.createContext)(null);
+
+//#endregion
+exports.TooltipInternalContext = TooltipInternalContext;

package/dist/components/client/Tooltip/tooltipContext.d.cts

@@ -0,0 +1,12 @@
+
+import * as react from "react";
+
+//#region src/components/client/Tooltip/tooltipContext.d.ts
+interface TooltipInternalContextType {
+  hideOnHoverOutside: boolean;
+  portal: boolean;
+}
+/** When true, tooltip content should hide when pointer leaves anchor/tooltip. */
+declare const TooltipInternalContext: react.Context<TooltipInternalContextType | null>;
+//#endregion
+export { TooltipInternalContext };

package/dist/components/client/Tooltip/tooltipContext.d.ts

@@ -0,0 +1,12 @@
+
+import * as react from "react";
+
+//#region src/components/client/Tooltip/tooltipContext.d.ts
+interface TooltipInternalContextType {
+  hideOnHoverOutside: boolean;
+  portal: boolean;
+}
+/** When true, tooltip content should hide when pointer leaves anchor/tooltip. */
+declare const TooltipInternalContext: react.Context<TooltipInternalContextType | null>;
+//#endregion
+export { TooltipInternalContext };

package/dist/components/client/Tooltip/tooltipContext.js

@@ -0,0 +1,10 @@
+"use client";
+/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
+import { createContext } from "react";
+
+//#region src/components/client/Tooltip/tooltipContext.tsx
+/** When true, tooltip content should hide when pointer leaves anchor/tooltip. */
+const TooltipInternalContext = createContext(null);
+
+//#endregion
+export { TooltipInternalContext };

package/dist/components/client/Tooltip/useTooltipContent.cjs

@@ -0,0 +1,186 @@
+"use client";
+/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_runtime = require('../../../_virtual/_rolldown/runtime.cjs');
+const require_index = require('../../../css-tokens/dist/index.cjs');
+const require_components_client_Tooltip_util = require('./util.cjs');
+let react = require("react");
+
+//#region src/components/client/Tooltip/useTooltipContent.ts
+function useTooltipContent({ open, effectivePlacement, maxWidth, borderRadius, arrowRef, animationDuration }) {
+	const internalRef = (0, react.useRef)(null);
+	const shadowFilterId = (0, react.useId)();
+	const [dimensions, setDimensions] = (0, react.useState)({
+		width: 0,
+		height: 0
+	});
+	const maxWidthClass = (0, react.useMemo)(() => {
+		if (maxWidth !== void 0) return typeof maxWidth === "number" ? `max-w-[${maxWidth}px]` : `max-w-[${maxWidth}]`;
+		return "max-w-lg";
+	}, [maxWidth]);
+	(0, react.useEffect)(() => {
+		const el = internalRef.current;
+		if (!el) return;
+		const observer = new ResizeObserver(() => {
+			setDimensions({
+				width: el.offsetWidth,
+				height: el.offsetHeight
+			});
+		});
+		observer.observe(el);
+		return () => observer.disconnect();
+	}, [open]);
+	const [shadows, setShadows] = (0, react.useState)([]);
+	const shadowValueRef = (0, react.useRef)("");
+	const readShadows = (0, react.useCallback)(() => {
+		if (!internalRef.current) return;
+		const shadowValue = getComputedStyle(internalRef.current).getPropertyValue(`--${require_index.DROP_SHADOW_PREFIX}`);
+		if (shadowValue !== shadowValueRef.current) {
+			shadowValueRef.current = shadowValue;
+			setShadows(require_components_client_Tooltip_util.parseShadow(shadowValue));
+		}
+	}, []);
+	const shadowPadding = (0, react.useMemo)(() => {
+		if (shadows.length === 0) return 0;
+		return shadows.reduce((max, s) => {
+			const extentX = Math.abs(s.x) + s.blur + Math.abs(s.spread);
+			const extentY = Math.abs(s.y) + s.blur + Math.abs(s.spread);
+			return Math.max(max, extentX, extentY);
+		}, 0);
+	}, [shadows]);
+	const [arrowCenter, setArrowCenter] = (0, react.useState)(void 0);
+	const computeArrowCenter = (0, react.useCallback)(() => {
+		const arrowEl = arrowRef.current;
+		const tooltipEl = internalRef.current;
+		if (!arrowEl || !tooltipEl) return;
+		const arrowRect = arrowEl.getBoundingClientRect();
+		const tooltipRect = tooltipEl.getBoundingClientRect();
+		const side = require_components_client_Tooltip_util.getArrowSide(effectivePlacement);
+		const raw = side === "top" || side === "bottom" ? arrowRect.left + arrowRect.width / 2 - tooltipRect.left : arrowRect.top + arrowRect.height / 2 - tooltipRect.top;
+		return Math.round(raw);
+	}, [arrowRef, effectivePlacement]);
+	const onPositionUpdate = (0, react.useCallback)(async ({ updatePosition }) => {
+		await updatePosition();
+		const el = internalRef.current;
+		if (el) {
+			const { offsetWidth, offsetHeight } = el;
+			if (offsetWidth > 0 && offsetHeight > 0) setDimensions((prev) => {
+				if (prev.width === offsetWidth && prev.height === offsetHeight) return prev;
+				return {
+					width: offsetWidth,
+					height: offsetHeight
+				};
+			});
+			readShadows();
+		}
+		const next = computeArrowCenter();
+		if (next !== void 0) setArrowCenter((prev) => prev === next ? prev : next);
+	}, [computeArrowCenter, readShadows]);
+	const svgPath = (0, react.useMemo)(() => {
+		return dimensions.width > 0 && dimensions.height > 0 ? require_components_client_Tooltip_util.generateTooltipPath({
+			width: dimensions.width,
+			height: dimensions.height,
+			placement: effectivePlacement,
+			borderRadius,
+			arrowCenter
+		}) : null;
+	}, [
+		effectivePlacement,
+		dimensions.width,
+		dimensions.height,
+		borderRadius,
+		arrowCenter
+	]);
+	const blurClipPath = (0, react.useMemo)(() => {
+		if (dimensions.width <= 0 || dimensions.height <= 0) return null;
+		const arrowSide = require_components_client_Tooltip_util.getArrowSide(effectivePlacement);
+		const offsetX = arrowSide === "left" ? require_components_client_Tooltip_util.ARROW_HEIGHT : 0;
+		const offsetY = arrowSide === "top" ? require_components_client_Tooltip_util.ARROW_HEIGHT : 0;
+		return require_components_client_Tooltip_util.generateTooltipPath({
+			width: dimensions.width,
+			height: dimensions.height,
+			placement: effectivePlacement,
+			borderRadius,
+			arrowCenter,
+			offsetX,
+			offsetY
+		});
+	}, [
+		effectivePlacement,
+		dimensions.width,
+		dimensions.height,
+		borderRadius,
+		arrowCenter
+	]);
+	const blurStyle = (0, react.useMemo)(() => {
+		const style = { clipPath: blurClipPath ? `path('${blurClipPath}')` : void 0 };
+		switch (require_components_client_Tooltip_util.getArrowSide(effectivePlacement)) {
+			case "top":
+				style.height = `calc(100% + ${require_components_client_Tooltip_util.ARROW_HEIGHT}px)`;
+				style.top = "auto";
+				style.bottom = "0";
+				break;
+			case "bottom":
+				style.height = `calc(100% + ${require_components_client_Tooltip_util.ARROW_HEIGHT}px)`;
+				break;
+			case "left":
+				style.width = `calc(100% + ${require_components_client_Tooltip_util.ARROW_HEIGHT}px)`;
+				style.left = "auto";
+				style.right = "0";
+				break;
+			case "right":
+				style.width = `calc(100% + ${require_components_client_Tooltip_util.ARROW_HEIGHT}px)`;
+				break;
+		}
+		return style;
+	}, [blurClipPath, effectivePlacement]);
+	const [visible, setVisible] = (0, react.useState)(false);
+	if ((!open || !svgPath) && visible) setVisible(false);
+	(0, react.useEffect)(() => {
+		if (open && svgPath) {
+			const raf = requestAnimationFrame(() => {
+				setVisible(true);
+			});
+			return () => cancelAnimationFrame(raf);
+		}
+	}, [open, svgPath]);
+	return {
+		internalRef,
+		shadowFilterId,
+		maxWidthClass,
+		dimensions,
+		shadows,
+		shadowPadding,
+		svgPath,
+		blurClipPath,
+		blurStyle,
+		visible,
+		childTransitionStyle: {
+			opacity: visible ? 1 : 0,
+			transition: `opacity ${animationDuration}ms ease-in-out`
+		},
+		tooltipShift: (0, react.useMemo)(() => {
+			if (arrowCenter === void 0 || dimensions.width <= 0 || dimensions.height <= 0) return {
+				x: 0,
+				y: 0
+			};
+			return require_components_client_Tooltip_util.getArrowClampDelta({
+				width: dimensions.width,
+				height: dimensions.height,
+				placement: effectivePlacement,
+				borderRadius,
+				arrowCenter
+			});
+		}, [
+			arrowCenter,
+			dimensions.width,
+			dimensions.height,
+			effectivePlacement,
+			borderRadius
+		]),
+		onPositionUpdate
+	};
+}
+
+//#endregion
+exports.useTooltipContent = useTooltipContent;