@fluentui/react-tooltip 9.8.8 → 9.8.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,18 +1,32 @@
1
1
  # Change Log - @fluentui/react-tooltip
2
2
 
3
- This log was last generated on Tue, 21 Oct 2025 14:13:12 GMT and should not be manually modified.
3
+ This log was last generated on Fri, 31 Oct 2025 16:17:33 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.8.9](https://github.com/microsoft/fluentui/tree/@fluentui/react-tooltip_v9.8.9)
8
+
9
+ Fri, 31 Oct 2025 16:17:33 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tooltip_v9.8.8..@fluentui/react-tooltip_v9.8.9)
11
+
12
+ ### Patches
13
+
14
+ - fix: Tooltip does not prevent rendering with aria-expanded unless aria-haspopup is also set ([PR #35364](https://github.com/microsoft/fluentui/pull/35364) by sarah.higley@microsoft.com)
15
+ - Bump @fluentui/react-jsx-runtime to v9.3.1 ([PR #35402](https://github.com/microsoft/fluentui/pull/35402) by beachball)
16
+ - Bump @fluentui/react-portal to v9.8.6 ([PR #35402](https://github.com/microsoft/fluentui/pull/35402) by beachball)
17
+ - Bump @fluentui/react-positioning to v9.20.8 ([PR #35402](https://github.com/microsoft/fluentui/pull/35402) by beachball)
18
+ - Bump @fluentui/react-tabster to v9.26.8 ([PR #35402](https://github.com/microsoft/fluentui/pull/35402) by beachball)
19
+ - Bump @fluentui/react-utilities to v9.25.2 ([PR #35402](https://github.com/microsoft/fluentui/pull/35402) by beachball)
20
+
7
21
  ## [9.8.8](https://github.com/microsoft/fluentui/tree/@fluentui/react-tooltip_v9.8.8)
8
22
 
9
- Tue, 21 Oct 2025 14:13:12 GMT
23
+ Tue, 21 Oct 2025 14:16:59 GMT
10
24
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tooltip_v9.8.7..@fluentui/react-tooltip_v9.8.8)
11
25
 
12
26
  ### Patches
13
27
 
14
- - Bump @fluentui/react-jsx-runtime to v9.3.0 ([PR #35307](https://github.com/microsoft/fluentui/pull/35307) by beachball)
15
- - Bump @fluentui/react-portal to v9.8.5 ([PR #35307](https://github.com/microsoft/fluentui/pull/35307) by beachball)
28
+ - Bump @fluentui/react-jsx-runtime to v9.3.0 ([PR #35343](https://github.com/microsoft/fluentui/pull/35343) by beachball)
29
+ - Bump @fluentui/react-portal to v9.8.5 ([PR #35343](https://github.com/microsoft/fluentui/pull/35343) by beachball)
16
30
 
17
31
  ## [9.8.7](https://github.com/microsoft/fluentui/tree/@fluentui/react-tooltip_v9.8.7)
18
32
 
@@ -16,7 +16,7 @@ import { Escape } from '@fluentui/keyboard-keys';
16
16
  * @param props - props from this instance of Tooltip
17
17
  */ export const useTooltip_unstable = (props)=>{
18
18
  'use no memo';
19
- var _child_props, _child_props1, _child_props2, _child_props3, _child_props4, _child_props5;
19
+ var _child_props, _child_props1, _child_props2, _child_props3, _child_props4, _child_props5, _child_props6;
20
20
  const context = useTooltipVisibility();
21
21
  const isServerSideRender = useIsSSR();
22
22
  const { targetDocument } = useFluent();
@@ -195,7 +195,7 @@ import { Escape } from '@fluentui/keyboard-keys';
195
195
  state.content.onBlur = mergeCallbacks(state.content.onBlur, onLeaveTrigger);
196
196
  const child = getTriggerChild(children);
197
197
  const triggerAriaProps = {};
198
- const isExpanded = (child === null || child === void 0 ? void 0 : (_child_props = child.props) === null || _child_props === void 0 ? void 0 : _child_props['aria-expanded']) === true || (child === null || child === void 0 ? void 0 : (_child_props1 = child.props) === null || _child_props1 === void 0 ? void 0 : _child_props1['aria-expanded']) === 'true';
198
+ const isPopupExpanded = (child === null || child === void 0 ? void 0 : (_child_props = child.props) === null || _child_props === void 0 ? void 0 : _child_props['aria-haspopup']) && ((child === null || child === void 0 ? void 0 : (_child_props1 = child.props) === null || _child_props1 === void 0 ? void 0 : _child_props1['aria-expanded']) === true || (child === null || child === void 0 ? void 0 : (_child_props2 = child.props) === null || _child_props2 === void 0 ? void 0 : _child_props2['aria-expanded']) === 'true');
199
199
  if (relationship === 'label') {
200
200
  // aria-label only works if the content is a string. Otherwise, need to use aria-labelledby.
201
201
  if (typeof state.content.children === 'string') {
@@ -211,8 +211,8 @@ import { Escape } from '@fluentui/keyboard-keys';
211
211
  state.shouldRenderTooltip = true;
212
212
  }
213
213
  // Case 1: Don't render the Tooltip in SSR to avoid hydration errors
214
- // Case 2: Don't render the Tooltip, if it triggers Menu and it's already opened
215
- if (isServerSideRender || isExpanded) {
214
+ // Case 2: Don't render the Tooltip, if it triggers Menu or another popup and it's already opened
215
+ if (isServerSideRender || isPopupExpanded) {
216
216
  state.shouldRenderTooltip = false;
217
217
  }
218
218
  // Apply the trigger props to the child, either by calling the render function, or cloning with the new props
@@ -221,10 +221,10 @@ import { Escape } from '@fluentui/keyboard-keys';
221
221
  ...child === null || child === void 0 ? void 0 : child.props,
222
222
  ref: useMergedRefs(getReactElementRef(child), keyborgListenerCallbackRef, // If the target prop is not provided, attach targetRef to the trigger element's ref prop
223
223
  positioningOptions.target === undefined ? targetRef : undefined),
224
- onPointerEnter: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props2 = child.props) === null || _child_props2 === void 0 ? void 0 : _child_props2.onPointerEnter, onEnterTrigger)),
225
- onPointerLeave: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props3 = child.props) === null || _child_props3 === void 0 ? void 0 : _child_props3.onPointerLeave, onLeaveTrigger)),
226
- onFocus: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props4 = child.props) === null || _child_props4 === void 0 ? void 0 : _child_props4.onFocus, onEnterTrigger)),
227
- onBlur: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props5 = child.props) === null || _child_props5 === void 0 ? void 0 : _child_props5.onBlur, onLeaveTrigger))
224
+ onPointerEnter: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props3 = child.props) === null || _child_props3 === void 0 ? void 0 : _child_props3.onPointerEnter, onEnterTrigger)),
225
+ onPointerLeave: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props4 = child.props) === null || _child_props4 === void 0 ? void 0 : _child_props4.onPointerLeave, onLeaveTrigger)),
226
+ onFocus: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props5 = child.props) === null || _child_props5 === void 0 ? void 0 : _child_props5.onFocus, onEnterTrigger)),
227
+ onBlur: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props6 = child.props) === null || _child_props6 === void 0 ? void 0 : _child_props6.onBlur, onLeaveTrigger))
228
228
  });
229
229
  return state;
230
230
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Tooltip/useTooltip.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { mergeArrowOffset, resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';\nimport {\n useTooltipVisibility_unstable as useTooltipVisibility,\n useFluent_unstable as useFluent,\n} from '@fluentui/react-shared-contexts';\nimport type { KeyborgFocusInEvent } from '@fluentui/react-tabster';\nimport { KEYBORG_FOCUSIN, useIsNavigatingWithKeyboard } from '@fluentui/react-tabster';\nimport {\n applyTriggerPropsToChildren,\n useControllableState,\n useId,\n useIsomorphicLayoutEffect,\n useIsSSR,\n useMergedRefs,\n getTriggerChild,\n mergeCallbacks,\n useEventCallback,\n slot,\n getReactElementRef,\n} from '@fluentui/react-utilities';\nimport type { TooltipProps, TooltipState, TooltipChildProps, OnVisibleChangeData } from './Tooltip.types';\nimport { arrowHeight, tooltipBorderRadius } from './private/constants';\nimport { useTooltipTimeout } from './private/useTooltipTimeout';\nimport { Escape } from '@fluentui/keyboard-keys';\n\n/**\n * Create the state required to render Tooltip.\n *\n * The returned state can be modified with hooks such as useTooltipStyles_unstable,\n * before being passed to renderTooltip_unstable.\n *\n * @param props - props from this instance of Tooltip\n */\nexport const useTooltip_unstable = (props: TooltipProps): TooltipState => {\n 'use no memo';\n\n const context = useTooltipVisibility();\n const isServerSideRender = useIsSSR();\n const { targetDocument } = useFluent();\n\n const [visible, setVisibleInternal] = useControllableState({ state: props.visible, initialState: false });\n\n const {\n appearance = 'normal',\n children,\n content,\n withArrow = false,\n positioning = 'above',\n onVisibleChange,\n relationship,\n showDelay = 250,\n hideDelay = 250,\n mountNode,\n } = props;\n\n const state: TooltipState = {\n withArrow,\n positioning,\n showDelay,\n hideDelay,\n relationship,\n visible,\n shouldRenderTooltip: visible,\n appearance,\n mountNode,\n // Slots\n components: {\n content: 'div',\n },\n content: slot.always(content, {\n defaultProps: {\n role: 'tooltip',\n },\n elementType: 'div',\n }),\n };\n\n state.content.id = useId('tooltip-', state.content.id);\n\n const positioningOptions = {\n enabled: state.visible,\n arrowPadding: 2 * tooltipBorderRadius,\n position: 'above' as const,\n align: 'center' as const,\n offset: 4,\n ...resolvePositioningShorthand(state.positioning),\n };\n\n if (state.withArrow) {\n positioningOptions.offset = mergeArrowOffset(positioningOptions.offset, arrowHeight);\n }\n\n const {\n targetRef,\n containerRef,\n arrowRef,\n }: {\n targetRef: React.MutableRefObject<unknown>;\n containerRef: React.MutableRefObject<HTMLDivElement>;\n arrowRef: React.MutableRefObject<HTMLDivElement>;\n } = usePositioning(positioningOptions);\n\n const [setDelayTimeout, clearDelayTimeout] = useTooltipTimeout(containerRef);\n\n const setVisible = React.useCallback(\n (ev: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement> | undefined, data: OnVisibleChangeData) => {\n clearDelayTimeout();\n setVisibleInternal(oldVisible => {\n if (data.visible !== oldVisible) {\n onVisibleChange?.(ev, data);\n }\n return data.visible;\n });\n },\n [clearDelayTimeout, setVisibleInternal, onVisibleChange],\n );\n\n state.content.ref = useMergedRefs(state.content.ref, containerRef);\n state.arrowRef = arrowRef;\n\n // When this tooltip is visible, hide any other tooltips, and register it\n // as the visibleTooltip with the TooltipContext.\n // Also add a listener on document to hide the tooltip if Escape is pressed\n useIsomorphicLayoutEffect(() => {\n if (visible) {\n const thisTooltip = {\n hide: (ev?: KeyboardEvent) => setVisible(undefined, { visible: false, documentKeyboardEvent: ev }),\n };\n\n context.visibleTooltip?.hide();\n context.visibleTooltip = thisTooltip;\n\n const onDocumentKeyDown = (ev: KeyboardEvent) => {\n if (ev.key === Escape && !ev.defaultPrevented) {\n thisTooltip.hide(ev);\n // stop propagation to avoid conflicting with other elements that listen for `Escape`\n // e,g: Dialog, Popover, Menu and Tooltip\n ev.preventDefault();\n }\n };\n\n targetDocument?.addEventListener('keydown', onDocumentKeyDown, {\n // As this event is added at targeted document,\n // we need to capture the event to be sure keydown handling from tooltip happens first\n capture: true,\n });\n\n return () => {\n if (context.visibleTooltip === thisTooltip) {\n context.visibleTooltip = undefined;\n }\n\n targetDocument?.removeEventListener('keydown', onDocumentKeyDown, { capture: true });\n };\n }\n }, [context, targetDocument, visible, setVisible]);\n\n // Used to skip showing the tooltip in certain situations when the trigger is focused.\n // See comments where this is set for more info.\n const ignoreNextFocusEventRef = React.useRef(false);\n\n // Listener for onPointerEnter and onFocus on the trigger element\n const onEnterTrigger = React.useCallback(\n (ev: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement>) => {\n if (ev.type === 'focus' && ignoreNextFocusEventRef.current) {\n ignoreNextFocusEventRef.current = false;\n return;\n }\n\n // Show immediately if another tooltip is already visible\n const delay = context.visibleTooltip ? 0 : state.showDelay;\n\n setDelayTimeout(() => {\n setVisible(ev, { visible: true });\n }, delay);\n\n ev.persist(); // Persist the event since the setVisible call will happen asynchronously\n },\n [setDelayTimeout, setVisible, state.showDelay, context],\n );\n\n const isNavigatingWithKeyboard = useIsNavigatingWithKeyboard();\n\n // Callback ref that attaches a keyborg:focusin event listener.\n const [keyborgListenerCallbackRef] = React.useState(() => {\n const onKeyborgFocusIn = ((ev: KeyborgFocusInEvent) => {\n // Skip showing the tooltip if focus moved programmatically.\n // For example, we don't want to show the tooltip when a dialog is closed\n // and Tabster programmatically restores focus to the trigger button.\n // See https://github.com/microsoft/fluentui/issues/27576\n if (ev.detail?.isFocusedProgrammatically && !isNavigatingWithKeyboard()) {\n ignoreNextFocusEventRef.current = true;\n }\n }) as EventListener;\n\n // Save the current element to remove the listener when the ref changes\n let current: Element | null = null;\n\n // Callback ref that attaches the listener to the element\n return (element: Element | null) => {\n current?.removeEventListener(KEYBORG_FOCUSIN, onKeyborgFocusIn);\n element?.addEventListener(KEYBORG_FOCUSIN, onKeyborgFocusIn);\n current = element;\n };\n });\n\n // Listener for onPointerLeave and onBlur on the trigger element\n const onLeaveTrigger = React.useCallback(\n (ev: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement>) => {\n let delay = state.hideDelay;\n\n if (ev.type === 'blur') {\n // Hide immediately when losing focus\n delay = 0;\n\n // The focused element gets a blur event when the document loses focus\n // (e.g. switching tabs in the browser), but we don't want to show the\n // tooltip again when the document gets focus back. Handle this case by\n // checking if the blurred element is still the document's activeElement.\n // See https://github.com/microsoft/fluentui/issues/13541\n ignoreNextFocusEventRef.current = targetDocument?.activeElement === ev.target;\n }\n\n setDelayTimeout(() => {\n setVisible(ev, { visible: false });\n }, delay);\n\n ev.persist(); // Persist the event since the setVisible call will happen asynchronously\n },\n [setDelayTimeout, setVisible, state.hideDelay, targetDocument],\n );\n\n // Cancel the hide timer when the mouse or focus enters the tooltip, and restart it when the mouse or focus leaves.\n // This keeps the tooltip visible when the mouse is moved over it, or it has focus within.\n state.content.onPointerEnter = mergeCallbacks(state.content.onPointerEnter, clearDelayTimeout);\n state.content.onPointerLeave = mergeCallbacks(state.content.onPointerLeave, onLeaveTrigger);\n state.content.onFocus = mergeCallbacks(state.content.onFocus, clearDelayTimeout);\n state.content.onBlur = mergeCallbacks(state.content.onBlur, onLeaveTrigger);\n\n const child = getTriggerChild(children);\n\n const triggerAriaProps: Pick<TooltipChildProps, 'aria-label' | 'aria-labelledby' | 'aria-describedby'> = {};\n const isExpanded = child?.props?.['aria-expanded'] === true || child?.props?.['aria-expanded'] === 'true';\n\n if (relationship === 'label') {\n // aria-label only works if the content is a string. Otherwise, need to use aria-labelledby.\n if (typeof state.content.children === 'string') {\n triggerAriaProps['aria-label'] = state.content.children;\n } else {\n triggerAriaProps['aria-labelledby'] = state.content.id;\n // Always render the tooltip even if hidden, so that aria-labelledby refers to a valid element\n state.shouldRenderTooltip = true;\n }\n } else if (relationship === 'description') {\n triggerAriaProps['aria-describedby'] = state.content.id;\n // Always render the tooltip even if hidden, so that aria-describedby refers to a valid element\n state.shouldRenderTooltip = true;\n }\n\n // Case 1: Don't render the Tooltip in SSR to avoid hydration errors\n // Case 2: Don't render the Tooltip, if it triggers Menu and it's already opened\n if (isServerSideRender || isExpanded) {\n state.shouldRenderTooltip = false;\n }\n\n // Apply the trigger props to the child, either by calling the render function, or cloning with the new props\n state.children = applyTriggerPropsToChildren(children, {\n ...triggerAriaProps,\n ...child?.props,\n ref: useMergedRefs(\n getReactElementRef<HTMLButtonElement>(child),\n keyborgListenerCallbackRef,\n // If the target prop is not provided, attach targetRef to the trigger element's ref prop\n positioningOptions.target === undefined ? targetRef : undefined,\n ),\n onPointerEnter: useEventCallback(mergeCallbacks(child?.props?.onPointerEnter, onEnterTrigger)),\n onPointerLeave: useEventCallback(mergeCallbacks(child?.props?.onPointerLeave, onLeaveTrigger)),\n onFocus: useEventCallback(mergeCallbacks(child?.props?.onFocus, onEnterTrigger)),\n onBlur: useEventCallback(mergeCallbacks(child?.props?.onBlur, onLeaveTrigger)),\n });\n\n return state;\n};\n"],"names":["React","mergeArrowOffset","resolvePositioningShorthand","usePositioning","useTooltipVisibility_unstable","useTooltipVisibility","useFluent_unstable","useFluent","KEYBORG_FOCUSIN","useIsNavigatingWithKeyboard","applyTriggerPropsToChildren","useControllableState","useId","useIsomorphicLayoutEffect","useIsSSR","useMergedRefs","getTriggerChild","mergeCallbacks","useEventCallback","slot","getReactElementRef","arrowHeight","tooltipBorderRadius","useTooltipTimeout","Escape","useTooltip_unstable","props","child","context","isServerSideRender","targetDocument","visible","setVisibleInternal","state","initialState","appearance","children","content","withArrow","positioning","onVisibleChange","relationship","showDelay","hideDelay","mountNode","shouldRenderTooltip","components","always","defaultProps","role","elementType","id","positioningOptions","enabled","arrowPadding","position","align","offset","targetRef","containerRef","arrowRef","setDelayTimeout","clearDelayTimeout","setVisible","useCallback","ev","data","oldVisible","ref","thisTooltip","hide","undefined","documentKeyboardEvent","visibleTooltip","onDocumentKeyDown","key","defaultPrevented","preventDefault","addEventListener","capture","removeEventListener","ignoreNextFocusEventRef","useRef","onEnterTrigger","type","current","delay","persist","isNavigatingWithKeyboard","keyborgListenerCallbackRef","useState","onKeyborgFocusIn","detail","isFocusedProgrammatically","element","onLeaveTrigger","activeElement","target","onPointerEnter","onPointerLeave","onFocus","onBlur","triggerAriaProps","isExpanded"],"mappings":"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"}
1
+ {"version":3,"sources":["../src/components/Tooltip/useTooltip.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { mergeArrowOffset, resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';\nimport {\n useTooltipVisibility_unstable as useTooltipVisibility,\n useFluent_unstable as useFluent,\n} from '@fluentui/react-shared-contexts';\nimport type { KeyborgFocusInEvent } from '@fluentui/react-tabster';\nimport { KEYBORG_FOCUSIN, useIsNavigatingWithKeyboard } from '@fluentui/react-tabster';\nimport {\n applyTriggerPropsToChildren,\n useControllableState,\n useId,\n useIsomorphicLayoutEffect,\n useIsSSR,\n useMergedRefs,\n getTriggerChild,\n mergeCallbacks,\n useEventCallback,\n slot,\n getReactElementRef,\n} from '@fluentui/react-utilities';\nimport type { TooltipProps, TooltipState, TooltipChildProps, OnVisibleChangeData } from './Tooltip.types';\nimport { arrowHeight, tooltipBorderRadius } from './private/constants';\nimport { useTooltipTimeout } from './private/useTooltipTimeout';\nimport { Escape } from '@fluentui/keyboard-keys';\n\n/**\n * Create the state required to render Tooltip.\n *\n * The returned state can be modified with hooks such as useTooltipStyles_unstable,\n * before being passed to renderTooltip_unstable.\n *\n * @param props - props from this instance of Tooltip\n */\nexport const useTooltip_unstable = (props: TooltipProps): TooltipState => {\n 'use no memo';\n\n const context = useTooltipVisibility();\n const isServerSideRender = useIsSSR();\n const { targetDocument } = useFluent();\n\n const [visible, setVisibleInternal] = useControllableState({ state: props.visible, initialState: false });\n\n const {\n appearance = 'normal',\n children,\n content,\n withArrow = false,\n positioning = 'above',\n onVisibleChange,\n relationship,\n showDelay = 250,\n hideDelay = 250,\n mountNode,\n } = props;\n\n const state: TooltipState = {\n withArrow,\n positioning,\n showDelay,\n hideDelay,\n relationship,\n visible,\n shouldRenderTooltip: visible,\n appearance,\n mountNode,\n // Slots\n components: {\n content: 'div',\n },\n content: slot.always(content, {\n defaultProps: {\n role: 'tooltip',\n },\n elementType: 'div',\n }),\n };\n\n state.content.id = useId('tooltip-', state.content.id);\n\n const positioningOptions = {\n enabled: state.visible,\n arrowPadding: 2 * tooltipBorderRadius,\n position: 'above' as const,\n align: 'center' as const,\n offset: 4,\n ...resolvePositioningShorthand(state.positioning),\n };\n\n if (state.withArrow) {\n positioningOptions.offset = mergeArrowOffset(positioningOptions.offset, arrowHeight);\n }\n\n const {\n targetRef,\n containerRef,\n arrowRef,\n }: {\n targetRef: React.MutableRefObject<unknown>;\n containerRef: React.MutableRefObject<HTMLDivElement>;\n arrowRef: React.MutableRefObject<HTMLDivElement>;\n } = usePositioning(positioningOptions);\n\n const [setDelayTimeout, clearDelayTimeout] = useTooltipTimeout(containerRef);\n\n const setVisible = React.useCallback(\n (ev: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement> | undefined, data: OnVisibleChangeData) => {\n clearDelayTimeout();\n setVisibleInternal(oldVisible => {\n if (data.visible !== oldVisible) {\n onVisibleChange?.(ev, data);\n }\n return data.visible;\n });\n },\n [clearDelayTimeout, setVisibleInternal, onVisibleChange],\n );\n\n state.content.ref = useMergedRefs(state.content.ref, containerRef);\n state.arrowRef = arrowRef;\n\n // When this tooltip is visible, hide any other tooltips, and register it\n // as the visibleTooltip with the TooltipContext.\n // Also add a listener on document to hide the tooltip if Escape is pressed\n useIsomorphicLayoutEffect(() => {\n if (visible) {\n const thisTooltip = {\n hide: (ev?: KeyboardEvent) => setVisible(undefined, { visible: false, documentKeyboardEvent: ev }),\n };\n\n context.visibleTooltip?.hide();\n context.visibleTooltip = thisTooltip;\n\n const onDocumentKeyDown = (ev: KeyboardEvent) => {\n if (ev.key === Escape && !ev.defaultPrevented) {\n thisTooltip.hide(ev);\n // stop propagation to avoid conflicting with other elements that listen for `Escape`\n // e,g: Dialog, Popover, Menu and Tooltip\n ev.preventDefault();\n }\n };\n\n targetDocument?.addEventListener('keydown', onDocumentKeyDown, {\n // As this event is added at targeted document,\n // we need to capture the event to be sure keydown handling from tooltip happens first\n capture: true,\n });\n\n return () => {\n if (context.visibleTooltip === thisTooltip) {\n context.visibleTooltip = undefined;\n }\n\n targetDocument?.removeEventListener('keydown', onDocumentKeyDown, { capture: true });\n };\n }\n }, [context, targetDocument, visible, setVisible]);\n\n // Used to skip showing the tooltip in certain situations when the trigger is focused.\n // See comments where this is set for more info.\n const ignoreNextFocusEventRef = React.useRef(false);\n\n // Listener for onPointerEnter and onFocus on the trigger element\n const onEnterTrigger = React.useCallback(\n (ev: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement>) => {\n if (ev.type === 'focus' && ignoreNextFocusEventRef.current) {\n ignoreNextFocusEventRef.current = false;\n return;\n }\n\n // Show immediately if another tooltip is already visible\n const delay = context.visibleTooltip ? 0 : state.showDelay;\n\n setDelayTimeout(() => {\n setVisible(ev, { visible: true });\n }, delay);\n\n ev.persist(); // Persist the event since the setVisible call will happen asynchronously\n },\n [setDelayTimeout, setVisible, state.showDelay, context],\n );\n\n const isNavigatingWithKeyboard = useIsNavigatingWithKeyboard();\n\n // Callback ref that attaches a keyborg:focusin event listener.\n const [keyborgListenerCallbackRef] = React.useState(() => {\n const onKeyborgFocusIn = ((ev: KeyborgFocusInEvent) => {\n // Skip showing the tooltip if focus moved programmatically.\n // For example, we don't want to show the tooltip when a dialog is closed\n // and Tabster programmatically restores focus to the trigger button.\n // See https://github.com/microsoft/fluentui/issues/27576\n if (ev.detail?.isFocusedProgrammatically && !isNavigatingWithKeyboard()) {\n ignoreNextFocusEventRef.current = true;\n }\n }) as EventListener;\n\n // Save the current element to remove the listener when the ref changes\n let current: Element | null = null;\n\n // Callback ref that attaches the listener to the element\n return (element: Element | null) => {\n current?.removeEventListener(KEYBORG_FOCUSIN, onKeyborgFocusIn);\n element?.addEventListener(KEYBORG_FOCUSIN, onKeyborgFocusIn);\n current = element;\n };\n });\n\n // Listener for onPointerLeave and onBlur on the trigger element\n const onLeaveTrigger = React.useCallback(\n (ev: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement>) => {\n let delay = state.hideDelay;\n\n if (ev.type === 'blur') {\n // Hide immediately when losing focus\n delay = 0;\n\n // The focused element gets a blur event when the document loses focus\n // (e.g. switching tabs in the browser), but we don't want to show the\n // tooltip again when the document gets focus back. Handle this case by\n // checking if the blurred element is still the document's activeElement.\n // See https://github.com/microsoft/fluentui/issues/13541\n ignoreNextFocusEventRef.current = targetDocument?.activeElement === ev.target;\n }\n\n setDelayTimeout(() => {\n setVisible(ev, { visible: false });\n }, delay);\n\n ev.persist(); // Persist the event since the setVisible call will happen asynchronously\n },\n [setDelayTimeout, setVisible, state.hideDelay, targetDocument],\n );\n\n // Cancel the hide timer when the mouse or focus enters the tooltip, and restart it when the mouse or focus leaves.\n // This keeps the tooltip visible when the mouse is moved over it, or it has focus within.\n state.content.onPointerEnter = mergeCallbacks(state.content.onPointerEnter, clearDelayTimeout);\n state.content.onPointerLeave = mergeCallbacks(state.content.onPointerLeave, onLeaveTrigger);\n state.content.onFocus = mergeCallbacks(state.content.onFocus, clearDelayTimeout);\n state.content.onBlur = mergeCallbacks(state.content.onBlur, onLeaveTrigger);\n\n const child = getTriggerChild(children);\n\n const triggerAriaProps: Pick<TooltipChildProps, 'aria-label' | 'aria-labelledby' | 'aria-describedby'> = {};\n const isPopupExpanded =\n child?.props?.['aria-haspopup'] &&\n (child?.props?.['aria-expanded'] === true || child?.props?.['aria-expanded'] === 'true');\n\n if (relationship === 'label') {\n // aria-label only works if the content is a string. Otherwise, need to use aria-labelledby.\n if (typeof state.content.children === 'string') {\n triggerAriaProps['aria-label'] = state.content.children;\n } else {\n triggerAriaProps['aria-labelledby'] = state.content.id;\n // Always render the tooltip even if hidden, so that aria-labelledby refers to a valid element\n state.shouldRenderTooltip = true;\n }\n } else if (relationship === 'description') {\n triggerAriaProps['aria-describedby'] = state.content.id;\n // Always render the tooltip even if hidden, so that aria-describedby refers to a valid element\n state.shouldRenderTooltip = true;\n }\n\n // Case 1: Don't render the Tooltip in SSR to avoid hydration errors\n // Case 2: Don't render the Tooltip, if it triggers Menu or another popup and it's already opened\n if (isServerSideRender || isPopupExpanded) {\n state.shouldRenderTooltip = false;\n }\n\n // Apply the trigger props to the child, either by calling the render function, or cloning with the new props\n state.children = applyTriggerPropsToChildren(children, {\n ...triggerAriaProps,\n ...child?.props,\n ref: useMergedRefs(\n getReactElementRef<HTMLButtonElement>(child),\n keyborgListenerCallbackRef,\n // If the target prop is not provided, attach targetRef to the trigger element's ref prop\n positioningOptions.target === undefined ? targetRef : undefined,\n ),\n onPointerEnter: useEventCallback(mergeCallbacks(child?.props?.onPointerEnter, onEnterTrigger)),\n onPointerLeave: useEventCallback(mergeCallbacks(child?.props?.onPointerLeave, onLeaveTrigger)),\n onFocus: useEventCallback(mergeCallbacks(child?.props?.onFocus, onEnterTrigger)),\n onBlur: useEventCallback(mergeCallbacks(child?.props?.onBlur, onLeaveTrigger)),\n });\n\n return state;\n};\n"],"names":["React","mergeArrowOffset","resolvePositioningShorthand","usePositioning","useTooltipVisibility_unstable","useTooltipVisibility","useFluent_unstable","useFluent","KEYBORG_FOCUSIN","useIsNavigatingWithKeyboard","applyTriggerPropsToChildren","useControllableState","useId","useIsomorphicLayoutEffect","useIsSSR","useMergedRefs","getTriggerChild","mergeCallbacks","useEventCallback","slot","getReactElementRef","arrowHeight","tooltipBorderRadius","useTooltipTimeout","Escape","useTooltip_unstable","props","child","context","isServerSideRender","targetDocument","visible","setVisibleInternal","state","initialState","appearance","children","content","withArrow","positioning","onVisibleChange","relationship","showDelay","hideDelay","mountNode","shouldRenderTooltip","components","always","defaultProps","role","elementType","id","positioningOptions","enabled","arrowPadding","position","align","offset","targetRef","containerRef","arrowRef","setDelayTimeout","clearDelayTimeout","setVisible","useCallback","ev","data","oldVisible","ref","thisTooltip","hide","undefined","documentKeyboardEvent","visibleTooltip","onDocumentKeyDown","key","defaultPrevented","preventDefault","addEventListener","capture","removeEventListener","ignoreNextFocusEventRef","useRef","onEnterTrigger","type","current","delay","persist","isNavigatingWithKeyboard","keyborgListenerCallbackRef","useState","onKeyborgFocusIn","detail","isFocusedProgrammatically","element","onLeaveTrigger","activeElement","target","onPointerEnter","onPointerLeave","onFocus","onBlur","triggerAriaProps","isPopupExpanded"],"mappings":"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"}
@@ -20,7 +20,7 @@ const _useTooltipTimeout = require("./private/useTooltipTimeout");
20
20
  const _keyboardkeys = require("@fluentui/keyboard-keys");
21
21
  const useTooltip_unstable = (props)=>{
22
22
  'use no memo';
23
- var _child_props, _child_props1, _child_props2, _child_props3, _child_props4, _child_props5;
23
+ var _child_props, _child_props1, _child_props2, _child_props3, _child_props4, _child_props5, _child_props6;
24
24
  const context = (0, _reactsharedcontexts.useTooltipVisibility_unstable)();
25
25
  const isServerSideRender = (0, _reactutilities.useIsSSR)();
26
26
  const { targetDocument } = (0, _reactsharedcontexts.useFluent_unstable)();
@@ -199,7 +199,7 @@ const useTooltip_unstable = (props)=>{
199
199
  state.content.onBlur = (0, _reactutilities.mergeCallbacks)(state.content.onBlur, onLeaveTrigger);
200
200
  const child = (0, _reactutilities.getTriggerChild)(children);
201
201
  const triggerAriaProps = {};
202
- const isExpanded = (child === null || child === void 0 ? void 0 : (_child_props = child.props) === null || _child_props === void 0 ? void 0 : _child_props['aria-expanded']) === true || (child === null || child === void 0 ? void 0 : (_child_props1 = child.props) === null || _child_props1 === void 0 ? void 0 : _child_props1['aria-expanded']) === 'true';
202
+ const isPopupExpanded = (child === null || child === void 0 ? void 0 : (_child_props = child.props) === null || _child_props === void 0 ? void 0 : _child_props['aria-haspopup']) && ((child === null || child === void 0 ? void 0 : (_child_props1 = child.props) === null || _child_props1 === void 0 ? void 0 : _child_props1['aria-expanded']) === true || (child === null || child === void 0 ? void 0 : (_child_props2 = child.props) === null || _child_props2 === void 0 ? void 0 : _child_props2['aria-expanded']) === 'true');
203
203
  if (relationship === 'label') {
204
204
  // aria-label only works if the content is a string. Otherwise, need to use aria-labelledby.
205
205
  if (typeof state.content.children === 'string') {
@@ -215,8 +215,8 @@ const useTooltip_unstable = (props)=>{
215
215
  state.shouldRenderTooltip = true;
216
216
  }
217
217
  // Case 1: Don't render the Tooltip in SSR to avoid hydration errors
218
- // Case 2: Don't render the Tooltip, if it triggers Menu and it's already opened
219
- if (isServerSideRender || isExpanded) {
218
+ // Case 2: Don't render the Tooltip, if it triggers Menu or another popup and it's already opened
219
+ if (isServerSideRender || isPopupExpanded) {
220
220
  state.shouldRenderTooltip = false;
221
221
  }
222
222
  // Apply the trigger props to the child, either by calling the render function, or cloning with the new props
@@ -224,10 +224,10 @@ const useTooltip_unstable = (props)=>{
224
224
  ...triggerAriaProps,
225
225
  ...child === null || child === void 0 ? void 0 : child.props,
226
226
  ref: (0, _reactutilities.useMergedRefs)((0, _reactutilities.getReactElementRef)(child), keyborgListenerCallbackRef, positioningOptions.target === undefined ? targetRef : undefined),
227
- onPointerEnter: (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)(child === null || child === void 0 ? void 0 : (_child_props2 = child.props) === null || _child_props2 === void 0 ? void 0 : _child_props2.onPointerEnter, onEnterTrigger)),
228
- onPointerLeave: (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)(child === null || child === void 0 ? void 0 : (_child_props3 = child.props) === null || _child_props3 === void 0 ? void 0 : _child_props3.onPointerLeave, onLeaveTrigger)),
229
- onFocus: (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)(child === null || child === void 0 ? void 0 : (_child_props4 = child.props) === null || _child_props4 === void 0 ? void 0 : _child_props4.onFocus, onEnterTrigger)),
230
- onBlur: (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)(child === null || child === void 0 ? void 0 : (_child_props5 = child.props) === null || _child_props5 === void 0 ? void 0 : _child_props5.onBlur, onLeaveTrigger))
227
+ onPointerEnter: (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)(child === null || child === void 0 ? void 0 : (_child_props3 = child.props) === null || _child_props3 === void 0 ? void 0 : _child_props3.onPointerEnter, onEnterTrigger)),
228
+ onPointerLeave: (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)(child === null || child === void 0 ? void 0 : (_child_props4 = child.props) === null || _child_props4 === void 0 ? void 0 : _child_props4.onPointerLeave, onLeaveTrigger)),
229
+ onFocus: (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)(child === null || child === void 0 ? void 0 : (_child_props5 = child.props) === null || _child_props5 === void 0 ? void 0 : _child_props5.onFocus, onEnterTrigger)),
230
+ onBlur: (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)(child === null || child === void 0 ? void 0 : (_child_props6 = child.props) === null || _child_props6 === void 0 ? void 0 : _child_props6.onBlur, onLeaveTrigger))
231
231
  });
232
232
  return state;
233
233
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Tooltip/useTooltip.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { mergeArrowOffset, resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';\nimport {\n useTooltipVisibility_unstable as useTooltipVisibility,\n useFluent_unstable as useFluent,\n} from '@fluentui/react-shared-contexts';\nimport type { KeyborgFocusInEvent } from '@fluentui/react-tabster';\nimport { KEYBORG_FOCUSIN, useIsNavigatingWithKeyboard } from '@fluentui/react-tabster';\nimport {\n applyTriggerPropsToChildren,\n useControllableState,\n useId,\n useIsomorphicLayoutEffect,\n useIsSSR,\n useMergedRefs,\n getTriggerChild,\n mergeCallbacks,\n useEventCallback,\n slot,\n getReactElementRef,\n} from '@fluentui/react-utilities';\nimport type { TooltipProps, TooltipState, TooltipChildProps, OnVisibleChangeData } from './Tooltip.types';\nimport { arrowHeight, tooltipBorderRadius } from './private/constants';\nimport { useTooltipTimeout } from './private/useTooltipTimeout';\nimport { Escape } from '@fluentui/keyboard-keys';\n\n/**\n * Create the state required to render Tooltip.\n *\n * The returned state can be modified with hooks such as useTooltipStyles_unstable,\n * before being passed to renderTooltip_unstable.\n *\n * @param props - props from this instance of Tooltip\n */\nexport const useTooltip_unstable = (props: TooltipProps): TooltipState => {\n 'use no memo';\n\n const context = useTooltipVisibility();\n const isServerSideRender = useIsSSR();\n const { targetDocument } = useFluent();\n\n const [visible, setVisibleInternal] = useControllableState({ state: props.visible, initialState: false });\n\n const {\n appearance = 'normal',\n children,\n content,\n withArrow = false,\n positioning = 'above',\n onVisibleChange,\n relationship,\n showDelay = 250,\n hideDelay = 250,\n mountNode,\n } = props;\n\n const state: TooltipState = {\n withArrow,\n positioning,\n showDelay,\n hideDelay,\n relationship,\n visible,\n shouldRenderTooltip: visible,\n appearance,\n mountNode,\n // Slots\n components: {\n content: 'div',\n },\n content: slot.always(content, {\n defaultProps: {\n role: 'tooltip',\n },\n elementType: 'div',\n }),\n };\n\n state.content.id = useId('tooltip-', state.content.id);\n\n const positioningOptions = {\n enabled: state.visible,\n arrowPadding: 2 * tooltipBorderRadius,\n position: 'above' as const,\n align: 'center' as const,\n offset: 4,\n ...resolvePositioningShorthand(state.positioning),\n };\n\n if (state.withArrow) {\n positioningOptions.offset = mergeArrowOffset(positioningOptions.offset, arrowHeight);\n }\n\n const {\n targetRef,\n containerRef,\n arrowRef,\n }: {\n targetRef: React.MutableRefObject<unknown>;\n containerRef: React.MutableRefObject<HTMLDivElement>;\n arrowRef: React.MutableRefObject<HTMLDivElement>;\n } = usePositioning(positioningOptions);\n\n const [setDelayTimeout, clearDelayTimeout] = useTooltipTimeout(containerRef);\n\n const setVisible = React.useCallback(\n (ev: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement> | undefined, data: OnVisibleChangeData) => {\n clearDelayTimeout();\n setVisibleInternal(oldVisible => {\n if (data.visible !== oldVisible) {\n onVisibleChange?.(ev, data);\n }\n return data.visible;\n });\n },\n [clearDelayTimeout, setVisibleInternal, onVisibleChange],\n );\n\n state.content.ref = useMergedRefs(state.content.ref, containerRef);\n state.arrowRef = arrowRef;\n\n // When this tooltip is visible, hide any other tooltips, and register it\n // as the visibleTooltip with the TooltipContext.\n // Also add a listener on document to hide the tooltip if Escape is pressed\n useIsomorphicLayoutEffect(() => {\n if (visible) {\n const thisTooltip = {\n hide: (ev?: KeyboardEvent) => setVisible(undefined, { visible: false, documentKeyboardEvent: ev }),\n };\n\n context.visibleTooltip?.hide();\n context.visibleTooltip = thisTooltip;\n\n const onDocumentKeyDown = (ev: KeyboardEvent) => {\n if (ev.key === Escape && !ev.defaultPrevented) {\n thisTooltip.hide(ev);\n // stop propagation to avoid conflicting with other elements that listen for `Escape`\n // e,g: Dialog, Popover, Menu and Tooltip\n ev.preventDefault();\n }\n };\n\n targetDocument?.addEventListener('keydown', onDocumentKeyDown, {\n // As this event is added at targeted document,\n // we need to capture the event to be sure keydown handling from tooltip happens first\n capture: true,\n });\n\n return () => {\n if (context.visibleTooltip === thisTooltip) {\n context.visibleTooltip = undefined;\n }\n\n targetDocument?.removeEventListener('keydown', onDocumentKeyDown, { capture: true });\n };\n }\n }, [context, targetDocument, visible, setVisible]);\n\n // Used to skip showing the tooltip in certain situations when the trigger is focused.\n // See comments where this is set for more info.\n const ignoreNextFocusEventRef = React.useRef(false);\n\n // Listener for onPointerEnter and onFocus on the trigger element\n const onEnterTrigger = React.useCallback(\n (ev: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement>) => {\n if (ev.type === 'focus' && ignoreNextFocusEventRef.current) {\n ignoreNextFocusEventRef.current = false;\n return;\n }\n\n // Show immediately if another tooltip is already visible\n const delay = context.visibleTooltip ? 0 : state.showDelay;\n\n setDelayTimeout(() => {\n setVisible(ev, { visible: true });\n }, delay);\n\n ev.persist(); // Persist the event since the setVisible call will happen asynchronously\n },\n [setDelayTimeout, setVisible, state.showDelay, context],\n );\n\n const isNavigatingWithKeyboard = useIsNavigatingWithKeyboard();\n\n // Callback ref that attaches a keyborg:focusin event listener.\n const [keyborgListenerCallbackRef] = React.useState(() => {\n const onKeyborgFocusIn = ((ev: KeyborgFocusInEvent) => {\n // Skip showing the tooltip if focus moved programmatically.\n // For example, we don't want to show the tooltip when a dialog is closed\n // and Tabster programmatically restores focus to the trigger button.\n // See https://github.com/microsoft/fluentui/issues/27576\n if (ev.detail?.isFocusedProgrammatically && !isNavigatingWithKeyboard()) {\n ignoreNextFocusEventRef.current = true;\n }\n }) as EventListener;\n\n // Save the current element to remove the listener when the ref changes\n let current: Element | null = null;\n\n // Callback ref that attaches the listener to the element\n return (element: Element | null) => {\n current?.removeEventListener(KEYBORG_FOCUSIN, onKeyborgFocusIn);\n element?.addEventListener(KEYBORG_FOCUSIN, onKeyborgFocusIn);\n current = element;\n };\n });\n\n // Listener for onPointerLeave and onBlur on the trigger element\n const onLeaveTrigger = React.useCallback(\n (ev: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement>) => {\n let delay = state.hideDelay;\n\n if (ev.type === 'blur') {\n // Hide immediately when losing focus\n delay = 0;\n\n // The focused element gets a blur event when the document loses focus\n // (e.g. switching tabs in the browser), but we don't want to show the\n // tooltip again when the document gets focus back. Handle this case by\n // checking if the blurred element is still the document's activeElement.\n // See https://github.com/microsoft/fluentui/issues/13541\n ignoreNextFocusEventRef.current = targetDocument?.activeElement === ev.target;\n }\n\n setDelayTimeout(() => {\n setVisible(ev, { visible: false });\n }, delay);\n\n ev.persist(); // Persist the event since the setVisible call will happen asynchronously\n },\n [setDelayTimeout, setVisible, state.hideDelay, targetDocument],\n );\n\n // Cancel the hide timer when the mouse or focus enters the tooltip, and restart it when the mouse or focus leaves.\n // This keeps the tooltip visible when the mouse is moved over it, or it has focus within.\n state.content.onPointerEnter = mergeCallbacks(state.content.onPointerEnter, clearDelayTimeout);\n state.content.onPointerLeave = mergeCallbacks(state.content.onPointerLeave, onLeaveTrigger);\n state.content.onFocus = mergeCallbacks(state.content.onFocus, clearDelayTimeout);\n state.content.onBlur = mergeCallbacks(state.content.onBlur, onLeaveTrigger);\n\n const child = getTriggerChild(children);\n\n const triggerAriaProps: Pick<TooltipChildProps, 'aria-label' | 'aria-labelledby' | 'aria-describedby'> = {};\n const isExpanded = child?.props?.['aria-expanded'] === true || child?.props?.['aria-expanded'] === 'true';\n\n if (relationship === 'label') {\n // aria-label only works if the content is a string. Otherwise, need to use aria-labelledby.\n if (typeof state.content.children === 'string') {\n triggerAriaProps['aria-label'] = state.content.children;\n } else {\n triggerAriaProps['aria-labelledby'] = state.content.id;\n // Always render the tooltip even if hidden, so that aria-labelledby refers to a valid element\n state.shouldRenderTooltip = true;\n }\n } else if (relationship === 'description') {\n triggerAriaProps['aria-describedby'] = state.content.id;\n // Always render the tooltip even if hidden, so that aria-describedby refers to a valid element\n state.shouldRenderTooltip = true;\n }\n\n // Case 1: Don't render the Tooltip in SSR to avoid hydration errors\n // Case 2: Don't render the Tooltip, if it triggers Menu and it's already opened\n if (isServerSideRender || isExpanded) {\n state.shouldRenderTooltip = false;\n }\n\n // Apply the trigger props to the child, either by calling the render function, or cloning with the new props\n state.children = applyTriggerPropsToChildren(children, {\n ...triggerAriaProps,\n ...child?.props,\n ref: useMergedRefs(\n getReactElementRef<HTMLButtonElement>(child),\n keyborgListenerCallbackRef,\n // If the target prop is not provided, attach targetRef to the trigger element's ref prop\n positioningOptions.target === undefined ? targetRef : undefined,\n ),\n onPointerEnter: useEventCallback(mergeCallbacks(child?.props?.onPointerEnter, onEnterTrigger)),\n onPointerLeave: useEventCallback(mergeCallbacks(child?.props?.onPointerLeave, onLeaveTrigger)),\n onFocus: useEventCallback(mergeCallbacks(child?.props?.onFocus, onEnterTrigger)),\n onBlur: useEventCallback(mergeCallbacks(child?.props?.onBlur, onLeaveTrigger)),\n });\n\n return state;\n};\n"],"names":["React","mergeArrowOffset","resolvePositioningShorthand","usePositioning","useTooltipVisibility_unstable","useTooltipVisibility","useFluent_unstable","useFluent","KEYBORG_FOCUSIN","useIsNavigatingWithKeyboard","applyTriggerPropsToChildren","useControllableState","useId","useIsomorphicLayoutEffect","useIsSSR","useMergedRefs","getTriggerChild","mergeCallbacks","useEventCallback","slot","getReactElementRef","arrowHeight","tooltipBorderRadius","useTooltipTimeout","Escape","useTooltip_unstable","props","child","context","isServerSideRender","targetDocument","visible","setVisibleInternal","state","initialState","appearance","children","content","withArrow","positioning","onVisibleChange","relationship","showDelay","hideDelay","mountNode","shouldRenderTooltip","components","always","defaultProps","role","elementType","id","positioningOptions","enabled","arrowPadding","position","align","offset","targetRef","containerRef","arrowRef","setDelayTimeout","clearDelayTimeout","setVisible","useCallback","ev","data","oldVisible","ref","thisTooltip","hide","undefined","documentKeyboardEvent","visibleTooltip","onDocumentKeyDown","key","defaultPrevented","preventDefault","addEventListener","capture","removeEventListener","ignoreNextFocusEventRef","useRef","onEnterTrigger","type","current","delay","persist","isNavigatingWithKeyboard","keyborgListenerCallbackRef","useState","onKeyborgFocusIn","detail","isFocusedProgrammatically","element","onLeaveTrigger","activeElement","target","onPointerEnter","onPointerLeave","onFocus","onBlur","triggerAriaProps","isExpanded"],"mappings":"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"}
1
+ {"version":3,"sources":["../src/components/Tooltip/useTooltip.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { mergeArrowOffset, resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';\nimport {\n useTooltipVisibility_unstable as useTooltipVisibility,\n useFluent_unstable as useFluent,\n} from '@fluentui/react-shared-contexts';\nimport type { KeyborgFocusInEvent } from '@fluentui/react-tabster';\nimport { KEYBORG_FOCUSIN, useIsNavigatingWithKeyboard } from '@fluentui/react-tabster';\nimport {\n applyTriggerPropsToChildren,\n useControllableState,\n useId,\n useIsomorphicLayoutEffect,\n useIsSSR,\n useMergedRefs,\n getTriggerChild,\n mergeCallbacks,\n useEventCallback,\n slot,\n getReactElementRef,\n} from '@fluentui/react-utilities';\nimport type { TooltipProps, TooltipState, TooltipChildProps, OnVisibleChangeData } from './Tooltip.types';\nimport { arrowHeight, tooltipBorderRadius } from './private/constants';\nimport { useTooltipTimeout } from './private/useTooltipTimeout';\nimport { Escape } from '@fluentui/keyboard-keys';\n\n/**\n * Create the state required to render Tooltip.\n *\n * The returned state can be modified with hooks such as useTooltipStyles_unstable,\n * before being passed to renderTooltip_unstable.\n *\n * @param props - props from this instance of Tooltip\n */\nexport const useTooltip_unstable = (props: TooltipProps): TooltipState => {\n 'use no memo';\n\n const context = useTooltipVisibility();\n const isServerSideRender = useIsSSR();\n const { targetDocument } = useFluent();\n\n const [visible, setVisibleInternal] = useControllableState({ state: props.visible, initialState: false });\n\n const {\n appearance = 'normal',\n children,\n content,\n withArrow = false,\n positioning = 'above',\n onVisibleChange,\n relationship,\n showDelay = 250,\n hideDelay = 250,\n mountNode,\n } = props;\n\n const state: TooltipState = {\n withArrow,\n positioning,\n showDelay,\n hideDelay,\n relationship,\n visible,\n shouldRenderTooltip: visible,\n appearance,\n mountNode,\n // Slots\n components: {\n content: 'div',\n },\n content: slot.always(content, {\n defaultProps: {\n role: 'tooltip',\n },\n elementType: 'div',\n }),\n };\n\n state.content.id = useId('tooltip-', state.content.id);\n\n const positioningOptions = {\n enabled: state.visible,\n arrowPadding: 2 * tooltipBorderRadius,\n position: 'above' as const,\n align: 'center' as const,\n offset: 4,\n ...resolvePositioningShorthand(state.positioning),\n };\n\n if (state.withArrow) {\n positioningOptions.offset = mergeArrowOffset(positioningOptions.offset, arrowHeight);\n }\n\n const {\n targetRef,\n containerRef,\n arrowRef,\n }: {\n targetRef: React.MutableRefObject<unknown>;\n containerRef: React.MutableRefObject<HTMLDivElement>;\n arrowRef: React.MutableRefObject<HTMLDivElement>;\n } = usePositioning(positioningOptions);\n\n const [setDelayTimeout, clearDelayTimeout] = useTooltipTimeout(containerRef);\n\n const setVisible = React.useCallback(\n (ev: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement> | undefined, data: OnVisibleChangeData) => {\n clearDelayTimeout();\n setVisibleInternal(oldVisible => {\n if (data.visible !== oldVisible) {\n onVisibleChange?.(ev, data);\n }\n return data.visible;\n });\n },\n [clearDelayTimeout, setVisibleInternal, onVisibleChange],\n );\n\n state.content.ref = useMergedRefs(state.content.ref, containerRef);\n state.arrowRef = arrowRef;\n\n // When this tooltip is visible, hide any other tooltips, and register it\n // as the visibleTooltip with the TooltipContext.\n // Also add a listener on document to hide the tooltip if Escape is pressed\n useIsomorphicLayoutEffect(() => {\n if (visible) {\n const thisTooltip = {\n hide: (ev?: KeyboardEvent) => setVisible(undefined, { visible: false, documentKeyboardEvent: ev }),\n };\n\n context.visibleTooltip?.hide();\n context.visibleTooltip = thisTooltip;\n\n const onDocumentKeyDown = (ev: KeyboardEvent) => {\n if (ev.key === Escape && !ev.defaultPrevented) {\n thisTooltip.hide(ev);\n // stop propagation to avoid conflicting with other elements that listen for `Escape`\n // e,g: Dialog, Popover, Menu and Tooltip\n ev.preventDefault();\n }\n };\n\n targetDocument?.addEventListener('keydown', onDocumentKeyDown, {\n // As this event is added at targeted document,\n // we need to capture the event to be sure keydown handling from tooltip happens first\n capture: true,\n });\n\n return () => {\n if (context.visibleTooltip === thisTooltip) {\n context.visibleTooltip = undefined;\n }\n\n targetDocument?.removeEventListener('keydown', onDocumentKeyDown, { capture: true });\n };\n }\n }, [context, targetDocument, visible, setVisible]);\n\n // Used to skip showing the tooltip in certain situations when the trigger is focused.\n // See comments where this is set for more info.\n const ignoreNextFocusEventRef = React.useRef(false);\n\n // Listener for onPointerEnter and onFocus on the trigger element\n const onEnterTrigger = React.useCallback(\n (ev: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement>) => {\n if (ev.type === 'focus' && ignoreNextFocusEventRef.current) {\n ignoreNextFocusEventRef.current = false;\n return;\n }\n\n // Show immediately if another tooltip is already visible\n const delay = context.visibleTooltip ? 0 : state.showDelay;\n\n setDelayTimeout(() => {\n setVisible(ev, { visible: true });\n }, delay);\n\n ev.persist(); // Persist the event since the setVisible call will happen asynchronously\n },\n [setDelayTimeout, setVisible, state.showDelay, context],\n );\n\n const isNavigatingWithKeyboard = useIsNavigatingWithKeyboard();\n\n // Callback ref that attaches a keyborg:focusin event listener.\n const [keyborgListenerCallbackRef] = React.useState(() => {\n const onKeyborgFocusIn = ((ev: KeyborgFocusInEvent) => {\n // Skip showing the tooltip if focus moved programmatically.\n // For example, we don't want to show the tooltip when a dialog is closed\n // and Tabster programmatically restores focus to the trigger button.\n // See https://github.com/microsoft/fluentui/issues/27576\n if (ev.detail?.isFocusedProgrammatically && !isNavigatingWithKeyboard()) {\n ignoreNextFocusEventRef.current = true;\n }\n }) as EventListener;\n\n // Save the current element to remove the listener when the ref changes\n let current: Element | null = null;\n\n // Callback ref that attaches the listener to the element\n return (element: Element | null) => {\n current?.removeEventListener(KEYBORG_FOCUSIN, onKeyborgFocusIn);\n element?.addEventListener(KEYBORG_FOCUSIN, onKeyborgFocusIn);\n current = element;\n };\n });\n\n // Listener for onPointerLeave and onBlur on the trigger element\n const onLeaveTrigger = React.useCallback(\n (ev: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement>) => {\n let delay = state.hideDelay;\n\n if (ev.type === 'blur') {\n // Hide immediately when losing focus\n delay = 0;\n\n // The focused element gets a blur event when the document loses focus\n // (e.g. switching tabs in the browser), but we don't want to show the\n // tooltip again when the document gets focus back. Handle this case by\n // checking if the blurred element is still the document's activeElement.\n // See https://github.com/microsoft/fluentui/issues/13541\n ignoreNextFocusEventRef.current = targetDocument?.activeElement === ev.target;\n }\n\n setDelayTimeout(() => {\n setVisible(ev, { visible: false });\n }, delay);\n\n ev.persist(); // Persist the event since the setVisible call will happen asynchronously\n },\n [setDelayTimeout, setVisible, state.hideDelay, targetDocument],\n );\n\n // Cancel the hide timer when the mouse or focus enters the tooltip, and restart it when the mouse or focus leaves.\n // This keeps the tooltip visible when the mouse is moved over it, or it has focus within.\n state.content.onPointerEnter = mergeCallbacks(state.content.onPointerEnter, clearDelayTimeout);\n state.content.onPointerLeave = mergeCallbacks(state.content.onPointerLeave, onLeaveTrigger);\n state.content.onFocus = mergeCallbacks(state.content.onFocus, clearDelayTimeout);\n state.content.onBlur = mergeCallbacks(state.content.onBlur, onLeaveTrigger);\n\n const child = getTriggerChild(children);\n\n const triggerAriaProps: Pick<TooltipChildProps, 'aria-label' | 'aria-labelledby' | 'aria-describedby'> = {};\n const isPopupExpanded =\n child?.props?.['aria-haspopup'] &&\n (child?.props?.['aria-expanded'] === true || child?.props?.['aria-expanded'] === 'true');\n\n if (relationship === 'label') {\n // aria-label only works if the content is a string. Otherwise, need to use aria-labelledby.\n if (typeof state.content.children === 'string') {\n triggerAriaProps['aria-label'] = state.content.children;\n } else {\n triggerAriaProps['aria-labelledby'] = state.content.id;\n // Always render the tooltip even if hidden, so that aria-labelledby refers to a valid element\n state.shouldRenderTooltip = true;\n }\n } else if (relationship === 'description') {\n triggerAriaProps['aria-describedby'] = state.content.id;\n // Always render the tooltip even if hidden, so that aria-describedby refers to a valid element\n state.shouldRenderTooltip = true;\n }\n\n // Case 1: Don't render the Tooltip in SSR to avoid hydration errors\n // Case 2: Don't render the Tooltip, if it triggers Menu or another popup and it's already opened\n if (isServerSideRender || isPopupExpanded) {\n state.shouldRenderTooltip = false;\n }\n\n // Apply the trigger props to the child, either by calling the render function, or cloning with the new props\n state.children = applyTriggerPropsToChildren(children, {\n ...triggerAriaProps,\n ...child?.props,\n ref: useMergedRefs(\n getReactElementRef<HTMLButtonElement>(child),\n keyborgListenerCallbackRef,\n // If the target prop is not provided, attach targetRef to the trigger element's ref prop\n positioningOptions.target === undefined ? targetRef : undefined,\n ),\n onPointerEnter: useEventCallback(mergeCallbacks(child?.props?.onPointerEnter, onEnterTrigger)),\n onPointerLeave: useEventCallback(mergeCallbacks(child?.props?.onPointerLeave, onLeaveTrigger)),\n onFocus: useEventCallback(mergeCallbacks(child?.props?.onFocus, onEnterTrigger)),\n onBlur: useEventCallback(mergeCallbacks(child?.props?.onBlur, onLeaveTrigger)),\n });\n\n return state;\n};\n"],"names":["React","mergeArrowOffset","resolvePositioningShorthand","usePositioning","useTooltipVisibility_unstable","useTooltipVisibility","useFluent_unstable","useFluent","KEYBORG_FOCUSIN","useIsNavigatingWithKeyboard","applyTriggerPropsToChildren","useControllableState","useId","useIsomorphicLayoutEffect","useIsSSR","useMergedRefs","getTriggerChild","mergeCallbacks","useEventCallback","slot","getReactElementRef","arrowHeight","tooltipBorderRadius","useTooltipTimeout","Escape","useTooltip_unstable","props","child","context","isServerSideRender","targetDocument","visible","setVisibleInternal","state","initialState","appearance","children","content","withArrow","positioning","onVisibleChange","relationship","showDelay","hideDelay","mountNode","shouldRenderTooltip","components","always","defaultProps","role","elementType","id","positioningOptions","enabled","arrowPadding","position","align","offset","targetRef","containerRef","arrowRef","setDelayTimeout","clearDelayTimeout","setVisible","useCallback","ev","data","oldVisible","ref","thisTooltip","hide","undefined","documentKeyboardEvent","visibleTooltip","onDocumentKeyDown","key","defaultPrevented","preventDefault","addEventListener","capture","removeEventListener","ignoreNextFocusEventRef","useRef","onEnterTrigger","type","current","delay","persist","isNavigatingWithKeyboard","keyborgListenerCallbackRef","useState","onKeyborgFocusIn","detail","isFocusedProgrammatically","element","onLeaveTrigger","activeElement","target","onPointerEnter","onPointerLeave","onFocus","onBlur","triggerAriaProps","isPopupExpanded"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-tooltip",
3
- "version": "9.8.8",
3
+ "version": "9.8.9",
4
4
  "description": "React components for building web experiences",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -19,13 +19,13 @@
19
19
  },
20
20
  "dependencies": {
21
21
  "@fluentui/keyboard-keys": "^9.0.8",
22
- "@fluentui/react-jsx-runtime": "^9.3.0",
23
- "@fluentui/react-portal": "^9.8.5",
24
- "@fluentui/react-positioning": "^9.20.7",
22
+ "@fluentui/react-jsx-runtime": "^9.3.1",
23
+ "@fluentui/react-portal": "^9.8.6",
24
+ "@fluentui/react-positioning": "^9.20.8",
25
25
  "@fluentui/react-shared-contexts": "^9.25.2",
26
- "@fluentui/react-tabster": "^9.26.7",
26
+ "@fluentui/react-tabster": "^9.26.8",
27
27
  "@fluentui/react-theme": "^9.2.0",
28
- "@fluentui/react-utilities": "^9.25.1",
28
+ "@fluentui/react-utilities": "^9.25.2",
29
29
  "@griffel/react": "^1.5.22",
30
30
  "@swc/helpers": "^0.5.1"
31
31
  },