"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_styles_styler = require('../../../styles/styler.cjs');
const require_components_Box = require('../../Box.cjs');
const require_components_Text = require('../../Text.cjs');
const require_components_VStack = require('../../VStack.cjs');
const require_components_IconSlot = require('../../IconSlot.cjs');
const require_hooks_useForkRef = require('../../../hooks/useForkRef.cjs');
const require_hooks_useSvgFloatingContent = require('../../../hooks/useSvgFloatingContent.cjs');
const require_components_SvgFloatingOverlay = require('../../SvgFloatingOverlay.cjs');
const require_components_client_Tooltip_UDSTooltipConfigProvider = require('./UDSTooltipConfigProvider.cjs');
const require_components_client_Tooltip_tooltipContext = require('./tooltipContext.cjs');
let react = require("react");
let react_jsx_runtime = require("react/jsx-runtime");
let _ariakit_react = require("@ariakit/react");

//#region src/components/client/Tooltip/TooltipContent.tsx
const ARROW_HEIGHT = 8;
const ARROW_WIDTH = 12;
const ARROW_TIP_RADIUS_FRACTION = .5;
const TooltipContent = (0, react.forwardRef)(function TooltipContent({ children, maxWidth, startTitleIcon, title, endContent, className, id }, ref) {
	const store = (0, _ariakit_react.useTooltipContext)();
	const open = (0, _ariakit_react.useStoreState)(store, "open");
	const internalContext = (0, react.useContext)(require_components_client_Tooltip_tooltipContext.TooltipInternalContext);
	const currentPlacement = (0, _ariakit_react.useStoreState)(store, "currentPlacement");
	const placement = (0, _ariakit_react.useStoreState)(store, "placement");
	const effectivePlacement = currentPlacement ?? placement ?? "top";
	const { borderRadius, animationDuration } = require_components_client_Tooltip_UDSTooltipConfigProvider.useTooltipConfig();
	const defaultBorderRadius = borderRadius["default"];
	const arrowRef = (0, react.useRef)(null);
	const { internalRef, shift, onPositionUpdate, ...svgFloatingContentProps } = require_hooks_useSvgFloatingContent.useSvgFloatingContent({
		open: open ?? false,
		effectivePlacement,
		borderRadius: defaultBorderRadius,
		arrowRef,
		animationDuration,
		arrowWidth: ARROW_WIDTH,
		arrowHeight: ARROW_HEIGHT,
		arrowTipRadiusFraction: ARROW_TIP_RADIUS_FRACTION
	});
	const mergedRef = require_hooks_useForkRef.useForkRef(ref, internalRef);
	const classNames = {
		root: require_styles_styler.getStyles({
			tooltipSizeRoot: "default",
			tooltipVariantRoot: "default",
			className: require_styles_styler.cx(maxWidth === void 0 && "max-w-lg", "flex", "z-[9999]", className)
		}),
		svg: require_styles_styler.getStyles({
			tooltipSizeSvg: "default",
			tooltipVariantSvg: "default",
			className: require_styles_styler.cx("uds-bgBlurFillFallback")
		}),
		blur: require_styles_styler.getStyles({
			tooltipVariantBlur: "default",
			position: "absolute",
			width: "full",
			height: "full",
			className: require_styles_styler.cx("uds-bgBlurFallback", "top-0", "left-0", "z-[1]")
		}),
		title: require_styles_styler.getStyles({ tooltipSizeTitle: "default" }),
		body: require_styles_styler.getStyles({ tooltipSizeBody: "default" }),
		endContent: require_styles_styler.getStyles({ tooltipSizeEndContent: "default" }),
		icon: require_styles_styler.getStyles({
			tooltipSizeIcon: "default",
			tooltipVariantIcon: "default"
		})
	};
	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_ariakit_react.Tooltip, {
		ref: mergedRef,
		className: classNames.root,
		hideOnHoverOutside: internalContext?.isControlled ? false : void 0,
		hideOnInteractOutside: internalContext?.isControlled ? false : void 0,
		portal: internalContext ? internalContext.portal : true,
		gutter: 10,
		updatePosition: onPositionUpdate,
		style: {
			...shift.x !== 0 || shift.y !== 0 ? { transform: `translate(${shift.x}px, ${shift.y}px)` } : void 0,
			...maxWidth !== void 0 ? { maxWidth } : void 0
		},
		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_SvgFloatingOverlay.SvgFloatingOverlay, {
			blurClassName: classNames.blur,
			svgClassNames: { base: classNames.svg },
			arrowHeight: ARROW_HEIGHT,
			contentWrapperSlotProps: { id },
			...svgFloatingContentProps,
			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_components_VStack.VStack, {
				className: "gap-[inherit]",
				children: [title && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_components_Box.Box, {
					alignItems: "center",
					columnGap: "1",
					children: [startTitleIcon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_IconSlot.IconSlot, {
						iconProps: { variant: "fill" },
						icon: startTitleIcon,
						className: classNames.icon
					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
						className: classNames.title,
						color: "inherit",
						children: title
					})]
				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_components_Box.Box, {
					alignItems: "center",
					columnGap: "1.5",
					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
						className: classNames.body,
						color: "inherit",
						children
					}), endContent && !(0, react.isValidElement)(endContent) ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
						className: classNames.endContent,
						color: "inherit",
						children: endContent
					}) : endContent]
				})]
			})
		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ariakit_react.TooltipArrow, {
			ref: arrowRef,
			style: { opacity: 0 }
		})]
	});
});
TooltipContent.displayName = "TooltipContent";

//#endregion
exports.TooltipContent = TooltipContent;