@cube-dev/ui-kit 0.207.0 → 0.209.0

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

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","names":["createDOMRef","DOMRefValue","BaseProps","CONTAINER_STYLES","ContainerStyleProps","Styles","tasty","ForwardedRef","forwardRef","useContext","useImperativeHandle","useRef","AriaTooltipProps","useTooltip","PlacementAxis","mergeProps","mergeRefs","useLayoutEffect","extractStyles","useModalLayerRef","TooltipContext","TooltipElement","styles","display","fill","light","color","width","radius","padding","preset","backdropFilter","whiteSpace","overflowWrap","pointerEvents","material","filter","transition","translate","transformOrigin","scale","opacity","Description","$","TooltipTipElement","position","height","border","borderTop","borderBottom","top","left","right","bottom","transform","CubeTooltipProps","tipStyles","showIcon","placement","isMaterial","isOpen","isLight","onOpenChange","defaultOpen","shouldFlip","Tooltip","props","ref","_c","overlayRef","transitionRef","arrowProps","state","overlayProps","isMaterialContext","isLightContext","phase","isShown","updatePosition","tooltipProviderProps","defaultRef","layerRef","t0","t1","combinedRef","finalOverlayRef","t2","t3","t4","otherProps","undefined","tooltipProps","t5","placementDirection","split","t6","t7","open","mods","t8","t9","Symbol","for","t10","t11","qa","children","_Tooltip","displayName","_c","mergeProps"],"sources":["../../../../src/components/overlays/Tooltip/Tooltip.tsx"],"sourcesContent":["import { createDOMRef } from '@react-spectrum/utils';\nimport { DOMRefValue } from '@react-types/shared';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport {\n  ForwardedRef,\n  forwardRef,\n  useContext,\n  useImperativeHandle,\n  useRef,\n} from 'react';\nimport { AriaTooltipProps, useTooltip } from 'react-aria';\n\nimport { PlacementAxis } from '../../../shared';\nimport { mergeProps, mergeRefs, useLayoutEffect } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { useModalLayerRef } from '../Modal/modal-containment';\n\nimport { TooltipContext } from './context';\n\nexport type { AriaTooltipProps };\n\nconst TooltipElement = tasty({\n  styles: {\n    display: 'block',\n    // The DEFAULT (dark) tooltip is intentionally scheme-invariant:\n    // `#surface-inverse.85` + `#white` keep it the \"always dark\" tooltip in\n    // light, dark, and high-contrast schemes — matching the legacy `#dark.85`\n    // + `#white` design.\n    //\n    // The `light` variant uses the adaptive surface tokens (`#surface` +\n    // `#surface-text-soft`) so it follows the page scheme. This restores the\n    // softer legacy `#dark-02` look in light mode (cr≈9.2) and stays AA-safe\n    // in dark mode (the previous fixed `#surface-inverse` was much darker\n    // than the legacy `#dark-02`, and pairing the fixed `#white` fill with\n    // the adaptive `#surface-text-soft` text — the LEGACY_ALIASES port of\n    // `#dark-02` — would collapse to cr≈1.8 in dark schemes; using `#surface`\n    // for the fill keeps both ends of the pair adapting together).\n    fill: {\n      '': '#surface-inverse.85',\n      light: '#surface',\n    },\n    color: {\n      '': '#white',\n      light: '#surface-text-soft',\n    },\n    width: 'initial min(36x, (100dvw - 4x)) max-content',\n    radius: true,\n    padding: '.75x 1x',\n    preset: 't4',\n    backdropFilter: 'blur(.5x)',\n    whiteSpace: 'pre-line',\n    // The tooltip is width-capped (`min(36x, …)`) with `max-width: max-content`,\n    // so a run with no spaces — a URL, a token, an identifier, an error string —\n    // stays on one line and spills straight out of the bubble. `anywhere` breaks\n    // it at the cap instead. It inherits, so tooltip children wrap too.\n    overflowWrap: 'anywhere',\n    pointerEvents: {\n      '': 'none',\n      material: 'auto',\n    },\n    // A one-device-pixel halo outlines the light tooltip.\n    '$shadow-blur': '1px',\n    filter: {\n      '': false,\n      light: 'drop-shadow(0 0 $shadow-blur #surface-text-soft.2)',\n    },\n    transition:\n      'translate $transition ease-out, scale $transition ease-out, theme $transition ease-out',\n    translate: {\n      '': '0 0',\n      'open & [data-placement=\"top\"]': '0 0',\n      '!open & [data-placement=\"top\"]': '0 1x',\n      'open & [data-placement=\"bottom\"]': '0 0',\n      '!open & [data-placement=\"bottom\"]': '0 -1x',\n      'open & [data-placement=\"left\"]': '0 0',\n      '!open & [data-placement=\"left\"]': '1x 0',\n      'open & [data-placement=\"right\"]': '0 0',\n      '!open & [data-placement=\"right\"]': '-1x 0',\n    },\n    transformOrigin: {\n      '': 'top center',\n      '[data-placement=\"top\"]': 'bottom center',\n      '[data-placement=\"left\"]': 'right center',\n      '[data-placement=\"right\"]': 'left center',\n    },\n    scale: {\n      '': '1 1',\n      '!open': '1 .8',\n      '!open & ([data-placement=\"left\"] | [data-placement=\"right\"])': '.8 1',\n    },\n    opacity: {\n      '': 1,\n      '!open': 0.001,\n    },\n\n    // A secondary line under the title — the description an auto tooltip\n    // shows when a row's label and description are both cut off. Lighter and\n    // dimmed like the row's own description, from the tooltip's own color, so\n    // it follows the `light` variant. Direct children only: a tooltip whose\n    // body is an `Item` keeps that item's description as it is.\n    Description: {\n      $: '>',\n      display: 'block',\n      preset: 't4n',\n      opacity: 0.75,\n    },\n  },\n});\n\nconst TooltipTipElement = tasty({\n  styles: {\n    position: 'absolute',\n    // The arrow is drawn by its borders around a one-device-pixel core.\n    '$tip-size': '1px',\n    width: '$tip-size',\n    height: '$tip-size',\n    border: '.5x #clear',\n    borderTop: {\n      '': '.5x solid #surface-inverse.85',\n      light: '.5x solid #surface',\n    },\n    borderBottom: '0',\n    top: {\n      '': 'initial',\n      '[data-placement=\"left\"] | [data-placement=\"right\"]': '50%',\n      '[data-placement=\"top\"]': '100%',\n    },\n    left: {\n      '': 'initial',\n      '[data-placement=\"top\"] | [data-placement=\"bottom\"]': '50%',\n      '[data-placement=\"left\"]': '100%',\n    },\n    right: {\n      '': 'initial',\n      '[data-placement=\"right\"]': '100%',\n    },\n    bottom: {\n      '': 'initial',\n      '[data-placement=\"bottom\"]': '100%',\n    },\n    transform: {\n      '': 'translate((-.375x - $tip-size), 0)',\n      '[data-placement=\"bottom\"]':\n        'translate((-.375x - $tip-size), 0) rotate(180deg)',\n      '[data-placement=\"left\"]': 'translate(-.25x, -.25x) rotate(270deg)',\n      '[data-placement=\"right\"]': 'translate(.25x, -.25x) rotate(90deg)',\n    },\n    transition: 'theme',\n  },\n});\n\nexport interface CubeTooltipProps\n  extends BaseProps, ContainerStyleProps, AriaTooltipProps {\n  tipStyles?: Styles;\n  /**\n   * @deprecated Has no effect. No icon is ever rendered.\n   */\n  showIcon?: boolean;\n  placement?: PlacementAxis;\n  isMaterial?: boolean;\n  isOpen?: boolean;\n  isLight?: boolean;\n  onOpenChange?: (isOpen: boolean) => void;\n  defaultOpen?: boolean;\n  /**\n   * Whether the tooltip moves to the opposite side of its trigger when there\n   * is not enough room on the requested one.\n   * @default true\n   */\n  shouldFlip?: boolean;\n}\n\nfunction Tooltip(\n  props: CubeTooltipProps,\n  ref: ForwardedRef<DOMRefValue<HTMLDivElement>>,\n) {\n  let {\n    ref: overlayRef,\n    transitionRef,\n    arrowProps,\n    state,\n    overlayProps,\n    isMaterial: isMaterialContext,\n    isLight: isLightContext,\n    phase,\n    isShown,\n    updatePosition,\n    ...tooltipProviderProps\n  } = useContext(TooltipContext);\n\n  const defaultRef = useRef<HTMLDivElement>(null);\n  // Opened inside a modal, the tooltip stays readable while the modal hides\n  // the page.\n  const layerRef = useModalLayerRef();\n  const combinedRef = mergeRefs(\n    transitionRef,\n    overlayRef ?? defaultRef,\n    layerRef,\n  );\n  const finalOverlayRef = overlayRef ?? defaultRef;\n\n  props = mergeProps(props, tooltipProviderProps);\n\n  let {\n    placement = 'top',\n    isOpen,\n    tipStyles,\n    isMaterial = isMaterialContext,\n    isLight = isLightContext,\n    ...otherProps\n  } = props;\n\n  const styles = extractStyles(otherProps, CONTAINER_STYLES);\n\n  let { tooltipProps } = useTooltip(props, state);\n\n  // Sync ref with overlayRef from context.\n  useImperativeHandle(ref, () => createDOMRef(finalOverlayRef));\n\n  // Extract primary placement direction for consistent styling\n  const placementDirection = placement?.split(' ')[0] || placement || 'top';\n\n  const mods = {\n    material: isMaterial,\n    light: isLight,\n    open: isShown ?? isOpen,\n  };\n\n  // Update position when tooltip becomes visible\n  useLayoutEffect(() => {\n    updatePosition?.();\n  }, []);\n\n  return (\n    <TooltipElement\n      {...tooltipProps}\n      {...overlayProps}\n      ref={combinedRef}\n      // `qa` is typed through `BaseProps` but nothing forwarded it, so a test\n      // had no way to tell one control's tooltip from another's.\n      qa={otherProps.qa}\n      styles={styles}\n      mods={mods}\n      data-placement={placementDirection}\n      data-phase={phase}\n    >\n      {props.children}\n      <TooltipTipElement\n        data-placement={placementDirection}\n        styles={tipStyles}\n        mods={mods}\n        {...arrowProps}\n      />\n    </TooltipElement>\n  );\n}\n\n/**\n * Display container for Tooltip content. Has a directional arrow dependent on its placement.\n */\nlet _Tooltip = forwardRef(Tooltip);\n\n_Tooltip.displayName = 'Tooltip';\n\nexport { _Tooltip as Tooltip };\n"],"mappings":"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"}
+{"version":3,"file":"Tooltip.js","names":["createDOMRef","DOMRefValue","BaseProps","CONTAINER_STYLES","ContainerStyleProps","Styles","tasty","ForwardedRef","forwardRef","useContext","useImperativeHandle","useRef","AriaTooltipProps","useTooltip","mergeProps","mergeRefs","useLayoutEffect","extractStyles","useModalLayerRef","TooltipContext","PlacementAxis","TooltipElement","styles","display","fill","light","color","width","radius","padding","preset","backdropFilter","whiteSpace","overflowWrap","pointerEvents","material","filter","transition","translate","transformOrigin","scale","opacity","Description","$","TooltipTipElement","position","height","border","borderTop","borderBottom","top","left","right","bottom","transform","CubeTooltipProps","tipStyles","showIcon","placement","isMaterial","isOpen","isLight","onOpenChange","defaultOpen","shouldFlip","Tooltip","props","ref","_c","overlayRef","transitionRef","arrowProps","state","overlayProps","isMaterialContext","isLightContext","phase","isShown","updatePosition","tooltipProviderProps","defaultRef","layerRef","t0","t1","combinedRef","finalOverlayRef","t2","t3","t4","otherProps","undefined","tooltipProps","t5","placementDirection","split","t6","t7","open","mods","t8","t9","Symbol","for","t10","t11","qa","children","_Tooltip","displayName","_c","mergeProps"],"sources":["../../../../src/components/overlays/Tooltip/Tooltip.tsx"],"sourcesContent":["import { createDOMRef } from '@react-spectrum/utils';\nimport { DOMRefValue } from '@react-types/shared';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport {\n  ForwardedRef,\n  forwardRef,\n  useContext,\n  useImperativeHandle,\n  useRef,\n} from 'react';\nimport { AriaTooltipProps, useTooltip } from 'react-aria';\n\nimport { mergeProps } from '../../../utils/react/mergeProps';\nimport { mergeRefs } from '../../../utils/react/useCombinedRefs';\nimport { useLayoutEffect } from '../../../utils/react/useLayoutEffect';\nimport { extractStyles } from '../../../utils/styles';\nimport { useModalLayerRef } from '../Modal/modal-containment';\n\nimport { TooltipContext } from './context';\n\nimport type { PlacementAxis } from '../../../shared';\n\nexport type { AriaTooltipProps };\n\nconst TooltipElement = tasty({\n  styles: {\n    display: 'block',\n    // The DEFAULT (dark) tooltip is intentionally scheme-invariant:\n    // `#surface-inverse.85` + `#white` keep it the \"always dark\" tooltip in\n    // light, dark, and high-contrast schemes — matching the legacy `#dark.85`\n    // + `#white` design.\n    //\n    // The `light` variant uses the adaptive surface tokens (`#surface` +\n    // `#surface-text-soft`) so it follows the page scheme. This restores the\n    // softer legacy `#dark-02` look in light mode (cr≈9.2) and stays AA-safe\n    // in dark mode (the previous fixed `#surface-inverse` was much darker\n    // than the legacy `#dark-02`, and pairing the fixed `#white` fill with\n    // the adaptive `#surface-text-soft` text — the LEGACY_ALIASES port of\n    // `#dark-02` — would collapse to cr≈1.8 in dark schemes; using `#surface`\n    // for the fill keeps both ends of the pair adapting together).\n    fill: {\n      '': '#surface-inverse.85',\n      light: '#surface',\n    },\n    color: {\n      '': '#white',\n      light: '#surface-text-soft',\n    },\n    width: 'initial min(36x, (100dvw - 4x)) max-content',\n    radius: true,\n    padding: '.75x 1x',\n    preset: 't4',\n    backdropFilter: 'blur(.5x)',\n    whiteSpace: 'pre-line',\n    // The tooltip is width-capped (`min(36x, …)`) with `max-width: max-content`,\n    // so a run with no spaces — a URL, a token, an identifier, an error string —\n    // stays on one line and spills straight out of the bubble. `anywhere` breaks\n    // it at the cap instead. It inherits, so tooltip children wrap too.\n    overflowWrap: 'anywhere',\n    pointerEvents: {\n      '': 'none',\n      material: 'auto',\n    },\n    // A one-device-pixel halo outlines the light tooltip.\n    '$shadow-blur': '1px',\n    filter: {\n      '': false,\n      light: 'drop-shadow(0 0 $shadow-blur #surface-text-soft.2)',\n    },\n    transition:\n      'translate $transition ease-out, scale $transition ease-out, theme $transition ease-out',\n    translate: {\n      '': '0 0',\n      'open & [data-placement=\"top\"]': '0 0',\n      '!open & [data-placement=\"top\"]': '0 1x',\n      'open & [data-placement=\"bottom\"]': '0 0',\n      '!open & [data-placement=\"bottom\"]': '0 -1x',\n      'open & [data-placement=\"left\"]': '0 0',\n      '!open & [data-placement=\"left\"]': '1x 0',\n      'open & [data-placement=\"right\"]': '0 0',\n      '!open & [data-placement=\"right\"]': '-1x 0',\n    },\n    transformOrigin: {\n      '': 'top center',\n      '[data-placement=\"top\"]': 'bottom center',\n      '[data-placement=\"left\"]': 'right center',\n      '[data-placement=\"right\"]': 'left center',\n    },\n    scale: {\n      '': '1 1',\n      '!open': '1 .8',\n      '!open & ([data-placement=\"left\"] | [data-placement=\"right\"])': '.8 1',\n    },\n    opacity: {\n      '': 1,\n      '!open': 0.001,\n    },\n\n    // A secondary line under the title — the description an auto tooltip\n    // shows when a row's label and description are both cut off. Lighter and\n    // dimmed like the row's own description, from the tooltip's own color, so\n    // it follows the `light` variant. Direct children only: a tooltip whose\n    // body is an `Item` keeps that item's description as it is.\n    Description: {\n      $: '>',\n      display: 'block',\n      preset: 't4n',\n      opacity: 0.75,\n    },\n  },\n});\n\nconst TooltipTipElement = tasty({\n  styles: {\n    position: 'absolute',\n    // The arrow is drawn by its borders around a one-device-pixel core.\n    '$tip-size': '1px',\n    width: '$tip-size',\n    height: '$tip-size',\n    border: '.5x #clear',\n    borderTop: {\n      '': '.5x solid #surface-inverse.85',\n      light: '.5x solid #surface',\n    },\n    borderBottom: '0',\n    top: {\n      '': 'initial',\n      '[data-placement=\"left\"] | [data-placement=\"right\"]': '50%',\n      '[data-placement=\"top\"]': '100%',\n    },\n    left: {\n      '': 'initial',\n      '[data-placement=\"top\"] | [data-placement=\"bottom\"]': '50%',\n      '[data-placement=\"left\"]': '100%',\n    },\n    right: {\n      '': 'initial',\n      '[data-placement=\"right\"]': '100%',\n    },\n    bottom: {\n      '': 'initial',\n      '[data-placement=\"bottom\"]': '100%',\n    },\n    transform: {\n      '': 'translate((-.375x - $tip-size), 0)',\n      '[data-placement=\"bottom\"]':\n        'translate((-.375x - $tip-size), 0) rotate(180deg)',\n      '[data-placement=\"left\"]': 'translate(-.25x, -.25x) rotate(270deg)',\n      '[data-placement=\"right\"]': 'translate(.25x, -.25x) rotate(90deg)',\n    },\n    transition: 'theme',\n  },\n});\n\nexport interface CubeTooltipProps\n  extends BaseProps, ContainerStyleProps, AriaTooltipProps {\n  tipStyles?: Styles;\n  /**\n   * @deprecated Has no effect. No icon is ever rendered.\n   */\n  showIcon?: boolean;\n  placement?: PlacementAxis;\n  isMaterial?: boolean;\n  isOpen?: boolean;\n  isLight?: boolean;\n  onOpenChange?: (isOpen: boolean) => void;\n  defaultOpen?: boolean;\n  /**\n   * Whether the tooltip moves to the opposite side of its trigger when there\n   * is not enough room on the requested one.\n   * @default true\n   */\n  shouldFlip?: boolean;\n}\n\nfunction Tooltip(\n  props: CubeTooltipProps,\n  ref: ForwardedRef<DOMRefValue<HTMLDivElement>>,\n) {\n  let {\n    ref: overlayRef,\n    transitionRef,\n    arrowProps,\n    state,\n    overlayProps,\n    isMaterial: isMaterialContext,\n    isLight: isLightContext,\n    phase,\n    isShown,\n    updatePosition,\n    ...tooltipProviderProps\n  } = useContext(TooltipContext);\n\n  const defaultRef = useRef<HTMLDivElement>(null);\n  // Opened inside a modal, the tooltip stays readable while the modal hides\n  // the page.\n  const layerRef = useModalLayerRef();\n  const combinedRef = mergeRefs(\n    transitionRef,\n    overlayRef ?? defaultRef,\n    layerRef,\n  );\n  const finalOverlayRef = overlayRef ?? defaultRef;\n\n  props = mergeProps(props, tooltipProviderProps);\n\n  let {\n    placement = 'top',\n    isOpen,\n    tipStyles,\n    isMaterial = isMaterialContext,\n    isLight = isLightContext,\n    ...otherProps\n  } = props;\n\n  const styles = extractStyles(otherProps, CONTAINER_STYLES);\n\n  let { tooltipProps } = useTooltip(props, state);\n\n  // Sync ref with overlayRef from context.\n  useImperativeHandle(ref, () => createDOMRef(finalOverlayRef));\n\n  // Extract primary placement direction for consistent styling\n  const placementDirection = placement?.split(' ')[0] || placement || 'top';\n\n  const mods = {\n    material: isMaterial,\n    light: isLight,\n    open: isShown ?? isOpen,\n  };\n\n  // Update position when tooltip becomes visible\n  useLayoutEffect(() => {\n    updatePosition?.();\n  }, []);\n\n  return (\n    <TooltipElement\n      {...tooltipProps}\n      {...overlayProps}\n      ref={combinedRef}\n      // `qa` is typed through `BaseProps` but nothing forwarded it, so a test\n      // had no way to tell one control's tooltip from another's.\n      qa={otherProps.qa}\n      styles={styles}\n      mods={mods}\n      data-placement={placementDirection}\n      data-phase={phase}\n    >\n      {props.children}\n      <TooltipTipElement\n        data-placement={placementDirection}\n        styles={tipStyles}\n        mods={mods}\n        {...arrowProps}\n      />\n    </TooltipElement>\n  );\n}\n\n/**\n * Display container for Tooltip content. Has a directional arrow dependent on its placement.\n */\nlet _Tooltip = forwardRef(Tooltip);\n\n_Tooltip.displayName = 'Tooltip';\n\nexport { _Tooltip as Tooltip };\n"],"mappings":"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"}

package/dist/components/overlays/Tooltip/TooltipProvider.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.207.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.209.0 | Cube Dev Team */
 import { Tooltip as _Tooltip } from "./Tooltip.js";
 import { TooltipTrigger } from "./TooltipTrigger.js";
 import { c } from "react/compiler-runtime";
@@ -6,6 +6,18 @@ import { isValidElement } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { useIsSSR } from "react-aria";
 //#region src/components/overlays/Tooltip/TooltipProvider.tsx
+/**
+* The tooltip `TooltipProvider` hands its trigger: a `Tooltip` with the
+* provider's title and styles, or a placeholder while it is disabled.
+*/
+function createProviderTooltip({ title, tooltipStyles, width, qa, isDisabled }) {
+	return isDisabled ? /* @__PURE__ */ jsx("div", {}) : /* @__PURE__ */ jsx(_Tooltip, {
+		styles: tooltipStyles,
+		...width ? { width } : null,
+		...qa ? { qa } : null,
+		children: title
+	});
+}
 function TooltipProvider(props) {
 	const $ = c(28);
 	const isSSR = useIsSSR();
@@ -61,11 +73,12 @@ function TooltipProvider(props) {
 	} else t0 = $[15];
 	let t1;
 	if ($[16] !== isDisabled || $[17] !== qa || $[18] !== title || $[19] !== tooltipStyles || $[20] !== width) {
-		t1 = isDisabled ? /* @__PURE__ */ jsx("div", {}) : /* @__PURE__ */ jsx(_Tooltip, {
-			styles: tooltipStyles,
-			...width ? { width } : null,
-			...qa ? { qa } : null,
-			children: title
+		t1 = createProviderTooltip({
+			title,
+			tooltipStyles,
+			width,
+			qa,
+			isDisabled
 		});
 		$[16] = isDisabled;
 		$[17] = qa;
@@ -92,6 +105,6 @@ function TooltipProvider(props) {
 	return t2;
 }
 //#endregion
-export { TooltipProvider };
+export { TooltipProvider, createProviderTooltip };
 
 //# sourceMappingURL=TooltipProvider.js.map

package/dist/components/overlays/Tooltip/TooltipProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"TooltipProvider.js","names":["Styles","isValidElement","ReactElement","ReactNode","RefObject","useIsSSR","CubeTooltipProps","Tooltip","CubeTooltipTriggerProps","TooltipTrigger","TooltipTriggerFunction","CubeTooltipProviderProps","Omit","children","title","tooltipStyles","width","qa","TooltipProvider","props","$","_c","isSSR","isDisabled","otherProps","isFunction","t0","current","HTMLElement","t1","t2","_c","Tooltip"],"sources":["../../../../src/components/overlays/Tooltip/TooltipProvider.tsx"],"sourcesContent":["import { Styles } from '@tenphi/tasty';\nimport { isValidElement, ReactElement, ReactNode, RefObject } from 'react';\nimport { useIsSSR } from 'react-aria';\n\nimport { CubeTooltipProps, Tooltip } from './Tooltip';\nimport {\n  CubeTooltipTriggerProps,\n  TooltipTrigger,\n  TooltipTriggerFunction,\n} from './TooltipTrigger';\n\nexport interface CubeTooltipProviderProps extends Omit<\n  CubeTooltipTriggerProps,\n  'children'\n> {\n  children: ReactNode | TooltipTriggerFunction;\n  title?: ReactNode;\n  tooltipStyles?: Styles;\n  width?: CubeTooltipProps['width'];\n  /**\n   * `data-qa` for the rendered tooltip, so a test can pick out this control's\n   * tooltip rather than whichever one is open. Also accepted in the `tooltip`\n   * object of components that build a provider from it.\n   */\n  qa?: string;\n}\n\nexport function TooltipProvider(props: CubeTooltipProviderProps): ReactElement {\n  const isSSR = useIsSSR();\n  const {\n    title,\n    children,\n    tooltipStyles,\n    width,\n    qa,\n    isDisabled,\n    ...otherProps\n  } = props;\n\n  const isFunction = typeof children === 'function';\n\n  // Render without the tooltip on the server, and while hydrating it.\n  //\n  // `useIsSSR` rather than a `rendered` state flipped from an effect: the\n  // state version answered `false` on the first client render too, so every\n  // client-rendered tree paid a second commit — and its trigger a remount —\n  // one task after everything watching the mount had called it finished.\n  if (isSSR) {\n    return (\n      <>\n        {isFunction\n          ? children({}, { current: null } as unknown as RefObject<HTMLElement>)\n          : children}\n      </>\n    ) as ReactElement;\n  }\n\n  // Both patterns pass through to TooltipTrigger\n  // The difference is whether we pass function or element as first child\n  return (\n    <TooltipTrigger\n      {...otherProps}\n      isDisabled={isDisabled}\n      disableFocusableProvider={isFunction}\n    >\n      {isFunction ||\n      isValidElement(children) ||\n      typeof children === 'string' ? (\n        children\n      ) : (\n        <>{children}</>\n      )}\n      {isDisabled ? (\n        <div />\n      ) : (\n        <Tooltip\n          styles={tooltipStyles}\n          {...(width ? { width } : null)}\n          {...(qa ? { qa } : null)}\n        >\n          {title}\n        </Tooltip>\n      )}\n    </TooltipTrigger>\n  );\n}\n"],"mappings":";;;;;;;;AA2BA,SAAOkB,gBAAAC,OAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CACL,MAAAC,QAAcjB,SAAS;CAAE,IAAAQ;CAAA,IAAAU;CAAA,IAAAC;CAAA,IAAAP;CAAA,IAAAH;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAI,EAAA,OAAAD,OAAA;EACzB,CAAA,CAAAL,OAAAD,UAAAE,eAAAC,OAAAC,IAAAM,YAAA,GAAAC,cAQIL;EAAMC,EAAA,KAAAD;EAAAC,EAAA,KAAAP;EAAAO,EAAA,KAAAG;EAAAH,EAAA,KAAAI;EAAAJ,EAAA,KAAAH;EAAAG,EAAA,KAAAN;EAAAM,EAAA,KAAAL;EAAAK,EAAA,KAAAJ;CAAA,OAAA;EAAAH,WAAAO,EAAA;EAAAG,aAAAH,EAAA;EAAAI,aAAAJ,EAAA;EAAAH,KAAAG,EAAA;EAAAN,QAAAM,EAAA;EAAAL,gBAAAK,EAAA;EAAAJ,QAAAI,EAAA;CAAA;CAEV,MAAAK,aAAmB,OAAOZ,aAAa;CAQvC,IAAIS,OAAK;EAAA,IAAAI;EAAA,IAAAN,EAAA,OAAAP,YAAAO,EAAA,OAAAK,YAAA;GAGFC,KAAAD,aACGZ,SAAS,CAAC,GAAG,EAAAc,SAAW,KAAK,CACtB,IAFVd;GAEWO,EAAA,KAAAP;GAAAO,EAAA,KAAAK;GAAAL,EAAA,MAAAM;EAAA,OAAAA,KAAAN,EAAA;EAAA,IAAAS;EAAA,IAAAT,EAAA,QAAAM,IAAA;GAHdG,KAAA,oBAAA,YAAA,EAAA,UACGH,GAEW,CAAA;GACXN,EAAA,MAAAM;GAAAN,EAAA,MAAAS;EAAA,OAAAA,KAAAT,EAAA;EAAA,OAJHS;CAKe;CAClB,IAAAH;CAAA,IAAAN,EAAA,QAAAP,YAAAO,EAAA,QAAAK,YAAA;EAUIC,KAAAD,cACDxB,eAAeY,QAAQ,KACvB,OAAOA,aAAa,WAFnBA,WAAA,oBAAA,YAAA,EAKIA,SAAQ,CAAA;EACZO,EAAA,MAAAP;EAAAO,EAAA,MAAAK;EAAAL,EAAA,MAAAM;CAAA,OAAAA,KAAAN,EAAA;CAAA,IAAAS;CAAA,IAAAT,EAAA,QAAAG,cAAAH,EAAA,QAAAH,MAAAG,EAAA,QAAAN,SAAAM,EAAA,QAAAL,iBAAAK,EAAA,QAAAJ,OAAA;EACAa,KAAAN,aACC,oBAAA,OAAA,CAAO,CAAA,IAEP,oBAACS,UAAD;GACUjB,QAAAA;GAAa,GAChBC,QAAA,EAAAA,MAAuB,IAAvB;GAAwB,GACxBC,KAAA,EAAAA,GAAiB,IAAjB;GAEJH,UAAAA;EALK,CAAA;EAOTM,EAAA,MAAAG;EAAAH,EAAA,MAAAH;EAAAG,EAAA,MAAAN;EAAAM,EAAA,MAAAL;EAAAK,EAAA,MAAAJ;EAAAI,EAAA,MAAAS;CAAA,OAAAA,KAAAT,EAAA;CAAA,IAAAU;CAAA,IAAAV,EAAA,QAAAG,cAAAH,EAAA,QAAAK,cAAAL,EAAA,QAAAI,cAAAJ,EAAA,QAAAM,MAAAN,EAAA,QAAAS,IAAA;EAtBHC,KAAA,qBAAC,gBAAD;GAAe,GACTN;GACQD;GACcE,0BAAAA;GAH5B,UAAA,CAKGC,IAOAG,EAZY;;EAuBET,EAAA,MAAAG;EAAAH,EAAA,MAAAK;EAAAL,EAAA,MAAAI;EAAAJ,EAAA,MAAAM;EAAAN,EAAA,MAAAS;EAAAT,EAAA,MAAAU;CAAA,OAAAA,KAAAV,EAAA;CAAA,OAvBjBU;AAuBiB"}
+{"version":3,"file":"TooltipProvider.js","names":["Styles","isValidElement","ReactElement","ReactNode","RefObject","useIsSSR","CubeTooltipProps","Tooltip","CubeTooltipTriggerProps","TooltipTrigger","TooltipTriggerFunction","CubeTooltipProviderProps","Omit","children","title","tooltipStyles","width","qa","createProviderTooltip","isDisabled","Pick","TooltipProvider","props","$","_c","isSSR","otherProps","isFunction","t0","current","HTMLElement","t1","t2","Tooltip","_c"],"sources":["../../../../src/components/overlays/Tooltip/TooltipProvider.tsx"],"sourcesContent":["import { Styles } from '@tenphi/tasty';\nimport { isValidElement, ReactElement, ReactNode, RefObject } from 'react';\nimport { useIsSSR } from 'react-aria';\n\nimport { CubeTooltipProps, Tooltip } from './Tooltip';\nimport {\n  CubeTooltipTriggerProps,\n  TooltipTrigger,\n  TooltipTriggerFunction,\n} from './TooltipTrigger';\n\nexport interface CubeTooltipProviderProps extends Omit<\n  CubeTooltipTriggerProps,\n  'children'\n> {\n  children: ReactNode | TooltipTriggerFunction;\n  title?: ReactNode;\n  tooltipStyles?: Styles;\n  width?: CubeTooltipProps['width'];\n  /**\n   * `data-qa` for the rendered tooltip, so a test can pick out this control's\n   * tooltip rather than whichever one is open. Also accepted in the `tooltip`\n   * object of components that build a provider from it.\n   */\n  qa?: string;\n}\n\n/**\n * The tooltip `TooltipProvider` hands its trigger: a `Tooltip` with the\n * provider's title and styles, or a placeholder while it is disabled.\n */\nexport function createProviderTooltip({\n  title,\n  tooltipStyles,\n  width,\n  qa,\n  isDisabled,\n}: Pick<\n  CubeTooltipProviderProps,\n  'title' | 'tooltipStyles' | 'width' | 'qa' | 'isDisabled'\n>): ReactElement<CubeTooltipProps> {\n  return isDisabled ? (\n    <div />\n  ) : (\n    <Tooltip\n      styles={tooltipStyles}\n      {...(width ? { width } : null)}\n      {...(qa ? { qa } : null)}\n    >\n      {title}\n    </Tooltip>\n  );\n}\n\nexport function TooltipProvider(props: CubeTooltipProviderProps): ReactElement {\n  const isSSR = useIsSSR();\n  const {\n    title,\n    children,\n    tooltipStyles,\n    width,\n    qa,\n    isDisabled,\n    ...otherProps\n  } = props;\n\n  const isFunction = typeof children === 'function';\n\n  // Render without the tooltip on the server, and while hydrating it.\n  //\n  // `useIsSSR` rather than a `rendered` state flipped from an effect: the\n  // state version answered `false` on the first client render too, so every\n  // client-rendered tree paid a second commit — and its trigger a remount —\n  // one task after everything watching the mount had called it finished.\n  if (isSSR) {\n    return (\n      <>\n        {isFunction\n          ? children({}, { current: null } as unknown as RefObject<HTMLElement>)\n          : children}\n      </>\n    ) as ReactElement;\n  }\n\n  // Both patterns pass through to TooltipTrigger\n  // The difference is whether we pass function or element as first child\n  return (\n    <TooltipTrigger\n      {...otherProps}\n      isDisabled={isDisabled}\n      disableFocusableProvider={isFunction}\n    >\n      {isFunction ||\n      isValidElement(children) ||\n      typeof children === 'string' ? (\n        children\n      ) : (\n        <>{children}</>\n      )}\n      {createProviderTooltip({ title, tooltipStyles, width, qa, isDisabled })}\n    </TooltipTrigger>\n  );\n}\n"],"mappings":";;;;;;;;;;;;AA+BA,SAAgBkB,sBAAsB,EACpCJ,OACAC,eACAC,OACAC,IACAE,cAIiC;CACjC,OAAOA,aACL,oBAAC,OAAD,CAAI,CAAA,IAEJ,oBAACc,UAAD;EACE,QAAQlB;EACR,GAAKC,QAAQ,EAAEA,MAAM,IAAI;EACzB,GAAKC,KAAK,EAAEA,GAAG,IAAI;EAElBH,UAAAA;CACM,CAAA;AAEb;AAEA,SAAOO,gBAAAC,OAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CACL,MAAAC,QAAcpB,SAAS;CAAE,IAAAQ;CAAA,IAAAM;CAAA,IAAAO;CAAA,IAAAT;CAAA,IAAAH;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAO,EAAA,OAAAD,OAAA;EACzB,CAAA,CAAAR,OAAAD,UAAAE,eAAAC,OAAAC,IAAAE,YAAA,GAAAO,cAQIJ;EAAMC,EAAA,KAAAD;EAAAC,EAAA,KAAAV;EAAAU,EAAA,KAAAJ;EAAAI,EAAA,KAAAG;EAAAH,EAAA,KAAAN;EAAAM,EAAA,KAAAT;EAAAS,EAAA,KAAAR;EAAAQ,EAAA,KAAAP;CAAA,OAAA;EAAAH,WAAAU,EAAA;EAAAJ,aAAAI,EAAA;EAAAG,aAAAH,EAAA;EAAAN,KAAAM,EAAA;EAAAT,QAAAS,EAAA;EAAAR,gBAAAQ,EAAA;EAAAP,QAAAO,EAAA;CAAA;CAEV,MAAAI,aAAmB,OAAOd,aAAa;CAQvC,IAAIY,OAAK;EAAA,IAAAG;EAAA,IAAAL,EAAA,OAAAV,YAAAU,EAAA,OAAAI,YAAA;GAGFC,KAAAD,aACGd,SAAS,CAAC,GAAG,EAAAgB,SAAW,KAAK,CACtB,IAFVhB;GAEWU,EAAA,KAAAV;GAAAU,EAAA,KAAAI;GAAAJ,EAAA,MAAAK;EAAA,OAAAA,KAAAL,EAAA;EAAA,IAAAQ;EAAA,IAAAR,EAAA,QAAAK,IAAA;GAHdG,KAAA,oBAAA,YAAA,EAAA,UACGH,GAEW,CAAA;GACXL,EAAA,MAAAK;GAAAL,EAAA,MAAAQ;EAAA,OAAAA,KAAAR,EAAA;EAAA,OAJHQ;CAKe;CAClB,IAAAH;CAAA,IAAAL,EAAA,QAAAV,YAAAU,EAAA,QAAAI,YAAA;EAUIC,KAAAD,cACD1B,eAAeY,QAAQ,KACvB,OAAOA,aAAa,WAFnBA,WAAA,oBAAA,YAAA,EAKIA,SAAQ,CAAA;EACZU,EAAA,MAAAV;EAAAU,EAAA,MAAAI;EAAAJ,EAAA,MAAAK;CAAA,OAAAA,KAAAL,EAAA;CAAA,IAAAQ;CAAA,IAAAR,EAAA,QAAAJ,cAAAI,EAAA,QAAAN,MAAAM,EAAA,QAAAT,SAAAS,EAAA,QAAAR,iBAAAQ,EAAA,QAAAP,OAAA;EACAe,KAAAb,sBAAsB;GAAAJ;GAAAC;GAAAC;GAAAC;GAAAE;EAA8C,CAAC;EAACI,EAAA,MAAAJ;EAAAI,EAAA,MAAAN;EAAAM,EAAA,MAAAT;EAAAS,EAAA,MAAAR;EAAAQ,EAAA,MAAAP;EAAAO,EAAA,MAAAQ;CAAA,OAAAA,KAAAR,EAAA;CAAA,IAAAS;CAAA,IAAAT,EAAA,QAAAJ,cAAAI,EAAA,QAAAI,cAAAJ,EAAA,QAAAG,cAAAH,EAAA,QAAAK,MAAAL,EAAA,QAAAQ,IAAA;EAZzEC,KAAA,qBAAC,gBAAD;GAAe,GACTN;GACQP;GACcQ,0BAAAA;GAH5B,UAAA,CAKGC,IAOAG,EAZY;;EAaER,EAAA,MAAAJ;EAAAI,EAAA,MAAAI;EAAAJ,EAAA,MAAAG;EAAAH,EAAA,MAAAK;EAAAL,EAAA,MAAAQ;EAAAR,EAAA,MAAAS;CAAA,OAAAA,KAAAT,EAAA;CAAA,OAbjBS;AAaiB"}

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

@@ -1,4 +1,5 @@
 
+import "./Tooltip.js";
 import { HTMLAttributes, ReactElement, ReactNode, RefObject } from "react";
 import { Placement, TooltipTriggerProps } from "react-aria";
 //#region src/components/overlays/Tooltip/TooltipTrigger.d.ts

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

@@ -1,9 +1,9 @@
-/** @license MIT | @cube-dev/ui-kit v0.207.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.209.0 | Cube Dev Team */
 import { useLayoutEffect as useLayoutEffect$1 } from "../../../utils/react/useLayoutEffect.js";
-import { useEvent } from "../../../_internal/hooks/use-event.js";
-import { isDevEnv } from "../../../utils/is-dev-env.js";
 import { TooltipContext } from "./context.js";
 import { Tooltip as _Tooltip } from "./Tooltip.js";
+import { useEvent } from "../../../_internal/hooks/use-event.js";
+import { isDevEnv } from "../../../utils/is-dev-env.js";
 import { isFocusRestoration } from "../../../utils/react/programmaticFocus.js";
 import { Block } from "../../Block.js";
 import { ActiveZone as _ActiveZone } from "../../content/ActiveZone/ActiveZone.js";
@@ -143,20 +143,24 @@ function isEmptyTooltip(tooltip) {
 	return tooltip.type === _Tooltip && Children.toArray(tooltip.props.children).every((child) => child === "");
 }
 /**
-* TooltipTrigger wraps around a trigger element and a Tooltip. It handles opening and closing
-* the Tooltip when the user hovers over or focuses the trigger, and positioning the Tooltip
-* relative to the trigger.
+* Everything `TooltipTrigger` does except render the trigger: the open state,
+* the trigger's props and ref, and the positioned tooltip.
+*
+* A component that renders its own trigger and turns its tooltip on and off
+* calls this directly and renders the tooltip beside the trigger. Wrapping the
+* trigger in `TooltipTrigger` only while a tooltip exists changes the element
+* type above the trigger, so React remounts it: the node is replaced and its
+* focus drops to the page.
+*
+* `tooltip` is the second child `TooltipTrigger` would get: the `Tooltip` to
+* show, or a placeholder while `isDisabled`.
 */
-function TooltipTrigger(props) {
-	const $ = c(13);
-	const { children, activeWrap, targetRef: externalRef, crossOffset: t0, isDisabled, isMaterial, isLight, offset: t1, trigger: triggerAction, delay: t2, shouldCloseOnPress, isOpen, onOpenChange, defaultOpen, disableFocusableProvider } = props;
+function useTooltipTriggerBinding(props, tooltip) {
+	const $ = c(37);
+	const { targetRef: externalRef, crossOffset: t0, isDisabled, isMaterial, isLight, offset: t1, trigger: triggerAction, delay: t2, shouldCloseOnPress, isOpen, onOpenChange, defaultOpen } = props;
 	const crossOffset = t0 === void 0 ? DEFAULT_CROSS_OFFSET : t0;
 	const offset = t1 === void 0 ? DEFAULT_OFFSET : t1;
 	const delay = t2 === void 0 ? 250 : t2;
-	const [trigger, tooltip] = Array.isArray(children) ? children : [children];
-	if (!isReactElement(tooltip)) throw new Error("CubeUIKit: TooltipTrigger expects the second child to be a valid React element (Tooltip component).");
-	if (!isTriggerFunction(trigger) && !isReactElement(trigger) && typeof trigger !== "string") throw new Error("CubeUIKit: TooltipTrigger expects the first child to be a function, React element, or string.");
-	if (activeWrap && isDevEnv()) console.warn("CubeUIKit: The `activeWrap` prop is deprecated. Use function-as-first-child pattern instead.");
 	const internalRef = useRef(null);
 	const tooltipTriggerRef = externalRef ?? internalRef;
 	const overlayRef = useRef(null);
@@ -171,111 +175,229 @@ function TooltipTrigger(props) {
 		$[2] = t3;
 	} else t3 = $[2];
 	const state = useTooltipTriggerState(t3);
-	const isTooltipDisabled = isDisabled || isEmptyTooltip(tooltip);
-	const { triggerProps: rawTriggerProps, tooltipProps } = useTooltipTrigger({
-		isDisabled: isTooltipDisabled,
-		trigger: triggerAction,
-		delay,
-		isOpen,
-		onOpenChange,
-		defaultOpen,
-		shouldCloseOnPress
-	}, state, tooltipTriggerRef);
 	let t4;
-	if ($[3] !== rawTriggerProps) {
-		t4 = (event) => {
+	if ($[3] !== isDisabled || $[4] !== tooltip) {
+		t4 = isDisabled || isEmptyTooltip(tooltip);
+		$[3] = isDisabled;
+		$[4] = tooltip;
+		$[5] = t4;
+	} else t4 = $[5];
+	const isTooltipDisabled = t4;
+	let t5;
+	if ($[6] !== defaultOpen || $[7] !== delay || $[8] !== isOpen || $[9] !== isTooltipDisabled || $[10] !== onOpenChange || $[11] !== shouldCloseOnPress || $[12] !== triggerAction) {
+		t5 = {
+			isDisabled: isTooltipDisabled,
+			trigger: triggerAction,
+			delay,
+			isOpen,
+			onOpenChange,
+			defaultOpen,
+			shouldCloseOnPress
+		};
+		$[6] = defaultOpen;
+		$[7] = delay;
+		$[8] = isOpen;
+		$[9] = isTooltipDisabled;
+		$[10] = onOpenChange;
+		$[11] = shouldCloseOnPress;
+		$[12] = triggerAction;
+		$[13] = t5;
+	} else t5 = $[13];
+	const { triggerProps: rawTriggerProps, tooltipProps } = useTooltipTrigger(t5, state, tooltipTriggerRef);
+	let t6;
+	if ($[14] !== rawTriggerProps) {
+		t6 = (event) => {
 			if (isFocusRestoration()) return;
 			rawTriggerProps.onFocus?.(event);
 		};
-		$[3] = rawTriggerProps;
-		$[4] = t4;
-	} else t4 = $[4];
-	const onFocus = useEvent(t4);
-	const triggerProps = {
-		...rawTriggerProps,
-		onFocus,
-		"aria-describedby": isTooltipDisabled ? void 0 : rawTriggerProps["aria-describedby"]
-	};
-	let t5;
-	if ($[5] !== state) {
-		t5 = () => state.close(true);
-		$[5] = state;
-		$[6] = t5;
-	} else t5 = $[6];
-	const positionOptions = {
-		placement: props.placement || "top",
-		targetRef: tooltipTriggerRef,
-		overlayRef,
-		offset,
-		crossOffset,
-		isOpen: state.isOpen,
-		shouldFlip: tooltip.props.shouldFlip,
-		onClose: t5
-	};
-	const tooltipContextValue = {
-		state,
-		ref: overlayRef,
-		isMaterial,
-		isLight,
-		...tooltipProps
-	};
-	const tooltipContent = /* @__PURE__ */ jsx(TooltipPositionContext.Provider, {
-		value: positionOptions,
-		children: /* @__PURE__ */ jsx(TooltipTransition, {
-			isShown: state.isOpen && !isTooltipDisabled,
-			children: (t6) => {
-				const { phase, isShown, ref: transitionRef } = t6;
-				return /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(PositionedTooltip, {
-					tooltip,
-					contextValue: {
-						...tooltipContextValue,
-						phase,
-						isShown,
-						ref: overlayRef,
-						transitionRef
+		$[14] = rawTriggerProps;
+		$[15] = t6;
+	} else t6 = $[15];
+	const onFocus = useEvent(t6);
+	const t7 = isTooltipDisabled ? void 0 : rawTriggerProps["aria-describedby"];
+	let t8;
+	if ($[16] !== onFocus || $[17] !== rawTriggerProps || $[18] !== t7) {
+		t8 = {
+			...rawTriggerProps,
+			onFocus,
+			"aria-describedby": t7
+		};
+		$[16] = onFocus;
+		$[17] = rawTriggerProps;
+		$[18] = t7;
+		$[19] = t8;
+	} else t8 = $[19];
+	const triggerProps = t8;
+	let t9;
+	if ($[20] !== isLight || $[21] !== isMaterial || $[22] !== state || $[23] !== tooltipProps) {
+		t9 = {
+			state,
+			ref: overlayRef,
+			isMaterial,
+			isLight,
+			...tooltipProps
+		};
+		$[20] = isLight;
+		$[21] = isMaterial;
+		$[22] = state;
+		$[23] = tooltipProps;
+		$[24] = t9;
+	} else t9 = $[24];
+	const tooltipContextValue = t9;
+	let t10;
+	if ($[25] !== crossOffset || $[26] !== isTooltipDisabled || $[27] !== offset || $[28] !== state || $[29] !== tooltip || $[30] !== tooltipContextValue || $[31] !== tooltipTriggerRef) {
+		t10 = (placement) => {
+			const positionOptions = {
+				placement: placement || "top",
+				targetRef: tooltipTriggerRef,
+				overlayRef,
+				offset,
+				crossOffset,
+				isOpen: state.isOpen,
+				shouldFlip: tooltip.props.shouldFlip,
+				onClose: () => state.close(true)
+			};
+			return /* @__PURE__ */ jsx(TooltipPositionContext.Provider, {
+				value: positionOptions,
+				children: /* @__PURE__ */ jsx(TooltipTransition, {
+					isShown: state.isOpen && !isTooltipDisabled,
+					children: (t11) => {
+						const { phase, isShown, ref: transitionRef } = t11;
+						return /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(PositionedTooltip, {
+							tooltip,
+							contextValue: {
+								...tooltipContextValue,
+								phase,
+								isShown,
+								ref: overlayRef,
+								transitionRef
+							}
+						}) });
 					}
-				}) });
-			}
-		})
-	});
-	if (isTriggerFunction(trigger)) return /* @__PURE__ */ jsxs(Fragment$1, { children: [trigger(triggerProps, tooltipTriggerRef), tooltipContent] });
+				})
+			});
+		};
+		$[25] = crossOffset;
+		$[26] = isTooltipDisabled;
+		$[27] = offset;
+		$[28] = state;
+		$[29] = tooltip;
+		$[30] = tooltipContextValue;
+		$[31] = tooltipTriggerRef;
+		$[32] = t10;
+	} else t10 = $[32];
+	const renderTooltip = t10;
+	let t11;
+	if ($[33] !== renderTooltip || $[34] !== tooltipTriggerRef || $[35] !== triggerProps) {
+		t11 = {
+			triggerProps,
+			triggerRef: tooltipTriggerRef,
+			renderTooltip
+		};
+		$[33] = renderTooltip;
+		$[34] = tooltipTriggerRef;
+		$[35] = triggerProps;
+		$[36] = t11;
+	} else t11 = $[36];
+	return t11;
+}
+/**
+* TooltipTrigger wraps around a trigger element and a Tooltip. It handles opening and closing
+* the Tooltip when the user hovers over or focuses the trigger, and positioning the Tooltip
+* relative to the trigger.
+*/
+function TooltipTrigger(props) {
+	const $ = c(25);
+	const { children, activeWrap, disableFocusableProvider } = props;
+	let t0;
+	if ($[0] !== children) {
+		t0 = Array.isArray(children) ? children : [children];
+		$[0] = children;
+		$[1] = t0;
+	} else t0 = $[1];
+	const [trigger, tooltip] = t0;
+	if (!isReactElement(tooltip)) throw new Error("CubeUIKit: TooltipTrigger expects the second child to be a valid React element (Tooltip component).");
+	if (!isTriggerFunction(trigger) && !isReactElement(trigger) && typeof trigger !== "string") throw new Error("CubeUIKit: TooltipTrigger expects the first child to be a function, React element, or string.");
+	if (activeWrap && isDevEnv()) console.warn("CubeUIKit: The `activeWrap` prop is deprecated. Use function-as-first-child pattern instead.");
+	const { triggerProps, triggerRef: tooltipTriggerRef, renderTooltip } = useTooltipTriggerBinding(props, tooltip);
+	let t1;
+	if ($[2] !== props.placement || $[3] !== renderTooltip) {
+		t1 = renderTooltip(props.placement);
+		$[2] = props.placement;
+		$[3] = renderTooltip;
+		$[4] = t1;
+	} else t1 = $[4];
+	const tooltipContent = t1;
+	if (isTriggerFunction(trigger)) {
+		let t2;
+		if ($[5] !== tooltipTriggerRef || $[6] !== trigger || $[7] !== triggerProps) {
+			t2 = trigger(triggerProps, tooltipTriggerRef);
+			$[5] = tooltipTriggerRef;
+			$[6] = trigger;
+			$[7] = triggerProps;
+			$[8] = t2;
+		} else t2 = $[8];
+		let t3;
+		if ($[9] !== t2 || $[10] !== tooltipContent) {
+			t3 = /* @__PURE__ */ jsxs(Fragment$1, { children: [t2, tooltipContent] });
+			$[9] = t2;
+			$[10] = tooltipContent;
+			$[11] = t3;
+		} else t3 = $[11];
+		return t3;
+	}
 	if (!activeWrap && typeof trigger === "string") {
 		console.warn("CubeUIKit: Tooltips are only supported on elements that are both focusable and hoverable. To solve this issue you can: 1) Use active element as a trigger (`Button`, `Link`, etc); 2) Use function-as-first-child pattern to manually apply trigger props; 3) Use `ActiveZone` component to manually wrap the content.");
-		let t7;
-		if ($[7] !== trigger) {
-			t7 = /* @__PURE__ */ jsx(Block, { children: trigger });
-			$[7] = trigger;
-			$[8] = t7;
-		} else t7 = $[8];
-		return t7;
+		let t2;
+		if ($[12] !== trigger) {
+			t2 = /* @__PURE__ */ jsx(Block, { children: trigger });
+			$[12] = trigger;
+			$[13] = t2;
+		} else t2 = $[13];
+		return t2;
 	}
-	let t7;
-	if ($[9] === Symbol.for("react.memo_cache_sentinel")) {
-		t7 = function onClick(e) {
+	let t2;
+	if ($[14] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = function onClick(e) {
 			e?.currentTarget?.parentNode.click();
 		};
-		$[9] = t7;
-	} else t7 = $[9];
-	const onClick = t7;
-	let t8;
-	if ($[10] !== activeWrap || $[11] !== trigger) {
-		t8 = activeWrap ? /* @__PURE__ */ jsx(_ActiveZone, {
+		$[14] = t2;
+	} else t2 = $[14];
+	const onClick = t2;
+	let t3;
+	if ($[15] !== activeWrap || $[16] !== trigger) {
+		t3 = activeWrap ? /* @__PURE__ */ jsx(_ActiveZone, {
 			onClick,
 			children: trigger
 		}) : trigger;
-		$[10] = activeWrap;
-		$[11] = trigger;
-		$[12] = t8;
-	} else t8 = $[12];
-	const triggerContent = /* @__PURE__ */ jsxs(Fragment$1, { children: [t8, tooltipContent] });
+		$[15] = activeWrap;
+		$[16] = trigger;
+		$[17] = t3;
+	} else t3 = $[17];
+	let t4;
+	if ($[18] !== t3 || $[19] !== tooltipContent) {
+		t4 = /* @__PURE__ */ jsxs(Fragment$1, { children: [t3, tooltipContent] });
+		$[18] = t3;
+		$[19] = tooltipContent;
+		$[20] = t4;
+	} else t4 = $[20];
+	const triggerContent = t4;
 	if (disableFocusableProvider) return triggerContent;
-	return /* @__PURE__ */ jsx(FocusableProvider, {
-		...triggerProps,
-		ref: tooltipTriggerRef,
-		children: triggerContent
-	});
+	let t5;
+	if ($[21] !== tooltipTriggerRef || $[22] !== triggerContent || $[23] !== triggerProps) {
+		t5 = /* @__PURE__ */ jsx(FocusableProvider, {
+			...triggerProps,
+			ref: tooltipTriggerRef,
+			children: triggerContent
+		});
+		$[21] = tooltipTriggerRef;
+		$[22] = triggerContent;
+		$[23] = triggerProps;
+		$[24] = t5;
+	} else t5 = $[24];
+	return t5;
 }
 //#endregion
-export { TooltipTrigger };
+export { TooltipTrigger, useTooltipTriggerBinding };
 
 //# sourceMappingURL=TooltipTrigger.js.map