@fluentui/react-tooltip 9.3.22 → 9.4.1
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,12 +1,37 @@
|
|
1
1
|
# Change Log - @fluentui/react-tooltip
|
2
2
|
|
3
|
-
This log was last generated on
|
3
|
+
This log was last generated on Thu, 30 Nov 2023 13:37:55 GMT and should not be manually modified.
|
4
4
|
|
5
5
|
<!-- Start content -->
|
6
6
|
|
7
|
+
## [9.4.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-tooltip_v9.4.1)
|
8
|
+
|
9
|
+
Thu, 30 Nov 2023 13:37:55 GMT
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tooltip_v9.4.0..@fluentui/react-tooltip_v9.4.1)
|
11
|
+
|
12
|
+
### Patches
|
13
|
+
|
14
|
+
- Bump @fluentui/react-jsx-runtime to v9.0.20 ([PR #29957](https://github.com/microsoft/fluentui/pull/29957) by beachball)
|
15
|
+
- Bump @fluentui/react-portal to v9.4.3 ([PR #29957](https://github.com/microsoft/fluentui/pull/29957) by beachball)
|
16
|
+
- Bump @fluentui/react-positioning to v9.10.2 ([PR #29957](https://github.com/microsoft/fluentui/pull/29957) by beachball)
|
17
|
+
- Bump @fluentui/react-tabster to v9.15.0 ([PR #29957](https://github.com/microsoft/fluentui/pull/29957) by beachball)
|
18
|
+
|
19
|
+
## [9.4.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-tooltip_v9.4.0)
|
20
|
+
|
21
|
+
Mon, 20 Nov 2023 09:55:10 GMT
|
22
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tooltip_v9.3.22..@fluentui/react-tooltip_v9.4.0)
|
23
|
+
|
24
|
+
### Minor changes
|
25
|
+
|
26
|
+
- fix: Tooltips are no longer triggered by programmatic focus() moves. ([PR #29791](https://github.com/microsoft/fluentui/pull/29791) by behowell@microsoft.com)
|
27
|
+
- Bump @fluentui/react-portal to v9.4.2 ([PR #29878](https://github.com/microsoft/fluentui/pull/29878) by beachball)
|
28
|
+
- Bump @fluentui/react-positioning to v9.10.1 ([PR #29878](https://github.com/microsoft/fluentui/pull/29878) by beachball)
|
29
|
+
- Bump @fluentui/react-shared-contexts to v9.13.0 ([PR #29878](https://github.com/microsoft/fluentui/pull/29878) by beachball)
|
30
|
+
- Bump @fluentui/react-tabster to v9.14.6 ([PR #29878](https://github.com/microsoft/fluentui/pull/29878) by beachball)
|
31
|
+
|
7
32
|
## [9.3.22](https://github.com/microsoft/fluentui/tree/@fluentui/react-tooltip_v9.3.22)
|
8
33
|
|
9
|
-
Tue, 14 Nov 2023 17:
|
34
|
+
Tue, 14 Nov 2023 17:51:27 GMT
|
10
35
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tooltip_v9.3.21..@fluentui/react-tooltip_v9.3.22)
|
11
36
|
|
12
37
|
### Patches
|
@@ -1,6 +1,7 @@
|
|
1
1
|
import * as React from 'react';
|
2
2
|
import { mergeArrowOffset, resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';
|
3
3
|
import { useTooltipVisibility_unstable as useTooltipVisibility, useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
|
4
|
+
import { KEYBORG_FOCUSIN } from '@fluentui/react-tabster';
|
4
5
|
import { applyTriggerPropsToChildren, useControllableState, useId, useIsomorphicLayoutEffect, useIsSSR, useMergedRefs, useTimeout, getTriggerChild, mergeCallbacks, useEventCallback, slot } from '@fluentui/react-utilities';
|
5
6
|
import { arrowHeight, tooltipBorderRadius } from './private/constants';
|
6
7
|
import { Escape } from '@fluentui/keyboard-keys';
|
@@ -113,11 +114,8 @@ import { Escape } from '@fluentui/keyboard-keys';
|
|
113
114
|
visible,
|
114
115
|
setVisible
|
115
116
|
]);
|
116
|
-
//
|
117
|
-
//
|
118
|
-
// tooltip again when the document gets focus back. Handle this case by
|
119
|
-
// checking if the blurred element is still the document's activeElement.
|
120
|
-
// See https://github.com/microsoft/fluentui/issues/13541
|
117
|
+
// Used to skip showing the tooltip in certain situations when the trigger is focued.
|
118
|
+
// See comments where this is set for more info.
|
121
119
|
const ignoreNextFocusEventRef = React.useRef(false);
|
122
120
|
// Listener for onPointerEnter and onFocus on the trigger element
|
123
121
|
const onEnterTrigger = React.useCallback((ev)=>{
|
@@ -139,12 +137,38 @@ import { Escape } from '@fluentui/keyboard-keys';
|
|
139
137
|
state.showDelay,
|
140
138
|
context
|
141
139
|
]);
|
140
|
+
// Callback ref that attaches a keyborg:focusin event listener.
|
141
|
+
const [keyborgListenerCallbackRef] = React.useState(()=>{
|
142
|
+
const onKeyborgFocusIn = (ev)=>{
|
143
|
+
var _ev_details;
|
144
|
+
// Skip showing the tooltip if focus moved programmatically.
|
145
|
+
// For example, we don't want to show the tooltip when a dialog is closed
|
146
|
+
// and Tabster programmatically restores focus to the trigger button.
|
147
|
+
// See https://github.com/microsoft/fluentui/issues/27576
|
148
|
+
if ((_ev_details = ev.details) === null || _ev_details === void 0 ? void 0 : _ev_details.isFocusedProgrammatically) {
|
149
|
+
ignoreNextFocusEventRef.current = true;
|
150
|
+
}
|
151
|
+
};
|
152
|
+
// Save the current element to remove the listener when the ref changes
|
153
|
+
let current = null;
|
154
|
+
// Callback ref that attaches the listener to the element
|
155
|
+
return (element)=>{
|
156
|
+
current === null || current === void 0 ? void 0 : current.removeEventListener(KEYBORG_FOCUSIN, onKeyborgFocusIn);
|
157
|
+
element === null || element === void 0 ? void 0 : element.addEventListener(KEYBORG_FOCUSIN, onKeyborgFocusIn);
|
158
|
+
current = element;
|
159
|
+
};
|
160
|
+
});
|
142
161
|
// Listener for onPointerLeave and onBlur on the trigger element
|
143
162
|
const onLeaveTrigger = React.useCallback((ev)=>{
|
144
163
|
let delay = state.hideDelay;
|
145
164
|
if (ev.type === 'blur') {
|
146
165
|
// Hide immediately when losing focus
|
147
166
|
delay = 0;
|
167
|
+
// The focused element gets a blur event when the document loses focus
|
168
|
+
// (e.g. switching tabs in the browser), but we don't want to show the
|
169
|
+
// tooltip again when the document gets focus back. Handle this case by
|
170
|
+
// checking if the blurred element is still the document's activeElement.
|
171
|
+
// See https://github.com/microsoft/fluentui/issues/13541
|
148
172
|
ignoreNextFocusEventRef.current = (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement) === ev.target;
|
149
173
|
}
|
150
174
|
setDelayTimeout(()=>{
|
@@ -185,13 +209,12 @@ import { Escape } from '@fluentui/keyboard-keys';
|
|
185
209
|
if (isServerSideRender) {
|
186
210
|
state.shouldRenderTooltip = false;
|
187
211
|
}
|
188
|
-
const childTargetRef = useMergedRefs(child === null || child === void 0 ? void 0 : child.ref, targetRef);
|
189
212
|
// Apply the trigger props to the child, either by calling the render function, or cloning with the new props
|
190
213
|
state.children = applyTriggerPropsToChildren(children, {
|
191
214
|
...triggerAriaProps,
|
192
215
|
...child === null || child === void 0 ? void 0 : child.props,
|
193
|
-
// If the target prop is not provided, attach targetRef to the trigger element's ref prop
|
194
|
-
|
216
|
+
ref: useMergedRefs(child === null || child === void 0 ? void 0 : child.ref, keyborgListenerCallbackRef, // If the target prop is not provided, attach targetRef to the trigger element's ref prop
|
217
|
+
positioningOptions.target === undefined ? targetRef : undefined),
|
195
218
|
onPointerEnter: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props = child.props) === null || _child_props === void 0 ? void 0 : _child_props.onPointerEnter, onEnterTrigger)),
|
196
219
|
onPointerLeave: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props1 = child.props) === null || _child_props1 === void 0 ? void 0 : _child_props1.onPointerLeave, onLeaveTrigger)),
|
197
220
|
onFocus: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props2 = child.props) === null || _child_props2 === void 0 ? void 0 : _child_props2.onFocus, onEnterTrigger)),
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["useTooltip.tsx"],"sourcesContent":["import * 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 {\n applyTriggerPropsToChildren,\n useControllableState,\n useId,\n useIsomorphicLayoutEffect,\n useIsSSR,\n useMergedRefs,\n useTimeout,\n getTriggerChild,\n mergeCallbacks,\n useEventCallback,\n slot,\n} from '@fluentui/react-utilities';\nimport type { TooltipProps, TooltipState, TooltipChildProps, OnVisibleChangeData } from './Tooltip.types';\nimport { arrowHeight, tooltipBorderRadius } from './private/constants';\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 const context = useTooltipVisibility();\n const isServerSideRender = useIsSSR();\n const { targetDocument } = useFluent();\n const [setDelayTimeout, clearDelayTimeout] = useTimeout();\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 [visible, setVisibleInternal] = useControllableState({ state: props.visible, initialState: false });\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 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 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 // 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 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 // 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 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\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 // Don't render the Tooltip in SSR to avoid hydration errors\n if (isServerSideRender) {\n state.shouldRenderTooltip = false;\n }\n\n const childTargetRef = useMergedRefs(child?.ref, targetRef);\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 // If the target prop is not provided, attach targetRef to the trigger element's ref prop\n ref: positioningOptions.target === undefined ? childTargetRef : child?.ref,\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","applyTriggerPropsToChildren","useControllableState","useId","useIsomorphicLayoutEffect","useIsSSR","useMergedRefs","useTimeout","getTriggerChild","mergeCallbacks","useEventCallback","slot","arrowHeight","tooltipBorderRadius","Escape","useTooltip_unstable","props","child","context","isServerSideRender","targetDocument","setDelayTimeout","clearDelayTimeout","appearance","children","content","withArrow","positioning","onVisibleChange","relationship","showDelay","hideDelay","mountNode","visible","setVisibleInternal","state","initialState","setVisible","useCallback","ev","data","oldVisible","shouldRenderTooltip","components","always","defaultProps","role","elementType","id","positioningOptions","enabled","arrowPadding","position","align","offset","targetRef","containerRef","arrowRef","ref","thisTooltip","hide","undefined","documentKeyboardEvent","visibleTooltip","onDocumentKeyDown","key","defaultPrevented","preventDefault","addEventListener","capture","removeEventListener","ignoreNextFocusEventRef","useRef","onEnterTrigger","type","current","delay","persist","onLeaveTrigger","activeElement","target","onPointerEnter","onPointerLeave","onFocus","onBlur","triggerAriaProps","childTargetRef"],"mappings":"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"}
|
1
|
+
{"version":3,"sources":["useTooltip.tsx"],"sourcesContent":["import * 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 } from '@fluentui/react-tabster';\nimport {\n applyTriggerPropsToChildren,\n useControllableState,\n useId,\n useIsomorphicLayoutEffect,\n useIsSSR,\n useMergedRefs,\n useTimeout,\n getTriggerChild,\n mergeCallbacks,\n useEventCallback,\n slot,\n} from '@fluentui/react-utilities';\nimport type { TooltipProps, TooltipState, TooltipChildProps, OnVisibleChangeData } from './Tooltip.types';\nimport { arrowHeight, tooltipBorderRadius } from './private/constants';\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 const context = useTooltipVisibility();\n const isServerSideRender = useIsSSR();\n const { targetDocument } = useFluent();\n const [setDelayTimeout, clearDelayTimeout] = useTimeout();\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 [visible, setVisibleInternal] = useControllableState({ state: props.visible, initialState: false });\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 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 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 focued.\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 // 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.details?.isFocusedProgrammatically) {\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\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 // Don't render the Tooltip in SSR to avoid hydration errors\n if (isServerSideRender) {\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 child?.ref,\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","applyTriggerPropsToChildren","useControllableState","useId","useIsomorphicLayoutEffect","useIsSSR","useMergedRefs","useTimeout","getTriggerChild","mergeCallbacks","useEventCallback","slot","arrowHeight","tooltipBorderRadius","Escape","useTooltip_unstable","props","child","context","isServerSideRender","targetDocument","setDelayTimeout","clearDelayTimeout","appearance","children","content","withArrow","positioning","onVisibleChange","relationship","showDelay","hideDelay","mountNode","visible","setVisibleInternal","state","initialState","setVisible","useCallback","ev","data","oldVisible","shouldRenderTooltip","components","always","defaultProps","role","elementType","id","positioningOptions","enabled","arrowPadding","position","align","offset","targetRef","containerRef","arrowRef","ref","thisTooltip","hide","undefined","documentKeyboardEvent","visibleTooltip","onDocumentKeyDown","key","defaultPrevented","preventDefault","addEventListener","capture","removeEventListener","ignoreNextFocusEventRef","useRef","onEnterTrigger","type","current","delay","persist","keyborgListenerCallbackRef","useState","onKeyborgFocusIn","details","isFocusedProgrammatically","element","onLeaveTrigger","activeElement","target","onPointerEnter","onPointerLeave","onFocus","onBlur","triggerAriaProps"],"mappings":"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"}
|
@@ -12,6 +12,7 @@ const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildc
|
|
12
12
|
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
13
13
|
const _reactpositioning = require("@fluentui/react-positioning");
|
14
14
|
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
|
15
|
+
const _reacttabster = require("@fluentui/react-tabster");
|
15
16
|
const _reactutilities = require("@fluentui/react-utilities");
|
16
17
|
const _constants = require("./private/constants");
|
17
18
|
const _keyboardkeys = require("@fluentui/keyboard-keys");
|
@@ -117,11 +118,8 @@ const useTooltip_unstable = (props)=>{
|
|
117
118
|
visible,
|
118
119
|
setVisible
|
119
120
|
]);
|
120
|
-
//
|
121
|
-
//
|
122
|
-
// tooltip again when the document gets focus back. Handle this case by
|
123
|
-
// checking if the blurred element is still the document's activeElement.
|
124
|
-
// See https://github.com/microsoft/fluentui/issues/13541
|
121
|
+
// Used to skip showing the tooltip in certain situations when the trigger is focued.
|
122
|
+
// See comments where this is set for more info.
|
125
123
|
const ignoreNextFocusEventRef = _react.useRef(false);
|
126
124
|
// Listener for onPointerEnter and onFocus on the trigger element
|
127
125
|
const onEnterTrigger = _react.useCallback((ev)=>{
|
@@ -143,12 +141,38 @@ const useTooltip_unstable = (props)=>{
|
|
143
141
|
state.showDelay,
|
144
142
|
context
|
145
143
|
]);
|
144
|
+
// Callback ref that attaches a keyborg:focusin event listener.
|
145
|
+
const [keyborgListenerCallbackRef] = _react.useState(()=>{
|
146
|
+
const onKeyborgFocusIn = (ev)=>{
|
147
|
+
var _ev_details;
|
148
|
+
// Skip showing the tooltip if focus moved programmatically.
|
149
|
+
// For example, we don't want to show the tooltip when a dialog is closed
|
150
|
+
// and Tabster programmatically restores focus to the trigger button.
|
151
|
+
// See https://github.com/microsoft/fluentui/issues/27576
|
152
|
+
if ((_ev_details = ev.details) === null || _ev_details === void 0 ? void 0 : _ev_details.isFocusedProgrammatically) {
|
153
|
+
ignoreNextFocusEventRef.current = true;
|
154
|
+
}
|
155
|
+
};
|
156
|
+
// Save the current element to remove the listener when the ref changes
|
157
|
+
let current = null;
|
158
|
+
// Callback ref that attaches the listener to the element
|
159
|
+
return (element)=>{
|
160
|
+
current === null || current === void 0 ? void 0 : current.removeEventListener(_reacttabster.KEYBORG_FOCUSIN, onKeyborgFocusIn);
|
161
|
+
element === null || element === void 0 ? void 0 : element.addEventListener(_reacttabster.KEYBORG_FOCUSIN, onKeyborgFocusIn);
|
162
|
+
current = element;
|
163
|
+
};
|
164
|
+
});
|
146
165
|
// Listener for onPointerLeave and onBlur on the trigger element
|
147
166
|
const onLeaveTrigger = _react.useCallback((ev)=>{
|
148
167
|
let delay = state.hideDelay;
|
149
168
|
if (ev.type === 'blur') {
|
150
169
|
// Hide immediately when losing focus
|
151
170
|
delay = 0;
|
171
|
+
// The focused element gets a blur event when the document loses focus
|
172
|
+
// (e.g. switching tabs in the browser), but we don't want to show the
|
173
|
+
// tooltip again when the document gets focus back. Handle this case by
|
174
|
+
// checking if the blurred element is still the document's activeElement.
|
175
|
+
// See https://github.com/microsoft/fluentui/issues/13541
|
152
176
|
ignoreNextFocusEventRef.current = (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement) === ev.target;
|
153
177
|
}
|
154
178
|
setDelayTimeout(()=>{
|
@@ -189,13 +213,11 @@ const useTooltip_unstable = (props)=>{
|
|
189
213
|
if (isServerSideRender) {
|
190
214
|
state.shouldRenderTooltip = false;
|
191
215
|
}
|
192
|
-
const childTargetRef = (0, _reactutilities.useMergedRefs)(child === null || child === void 0 ? void 0 : child.ref, targetRef);
|
193
216
|
// Apply the trigger props to the child, either by calling the render function, or cloning with the new props
|
194
217
|
state.children = (0, _reactutilities.applyTriggerPropsToChildren)(children, {
|
195
218
|
...triggerAriaProps,
|
196
219
|
...child === null || child === void 0 ? void 0 : child.props,
|
197
|
-
|
198
|
-
ref: positioningOptions.target === undefined ? childTargetRef : child === null || child === void 0 ? void 0 : child.ref,
|
220
|
+
ref: (0, _reactutilities.useMergedRefs)(child === null || child === void 0 ? void 0 : child.ref, keyborgListenerCallbackRef, positioningOptions.target === undefined ? targetRef : undefined),
|
199
221
|
onPointerEnter: (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)(child === null || child === void 0 ? void 0 : (_child_props = child.props) === null || _child_props === void 0 ? void 0 : _child_props.onPointerEnter, onEnterTrigger)),
|
200
222
|
onPointerLeave: (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)(child === null || child === void 0 ? void 0 : (_child_props1 = child.props) === null || _child_props1 === void 0 ? void 0 : _child_props1.onPointerLeave, onLeaveTrigger)),
|
201
223
|
onFocus: (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.onFocus, onEnterTrigger)),
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["useTooltip.js"],"sourcesContent":["import * as React from 'react';\nimport { mergeArrowOffset, resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';\nimport { useTooltipVisibility_unstable as useTooltipVisibility, useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { applyTriggerPropsToChildren, useControllableState, useId, useIsomorphicLayoutEffect, useIsSSR, useMergedRefs, useTimeout, getTriggerChild, mergeCallbacks, useEventCallback, slot } from '@fluentui/react-utilities';\nimport { arrowHeight, tooltipBorderRadius } from './private/constants';\nimport { Escape } from '@fluentui/keyboard-keys';\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 */ export const useTooltip_unstable = (props)=>{\n var _child_props, _child_props1, _child_props2, _child_props3;\n const context = useTooltipVisibility();\n const isServerSideRender = useIsSSR();\n const { targetDocument } = useFluent();\n const [setDelayTimeout, clearDelayTimeout] = useTimeout();\n const { appearance = 'normal', children, content, withArrow = false, positioning = 'above', onVisibleChange, relationship, showDelay = 250, hideDelay = 250, mountNode } = props;\n const [visible, setVisibleInternal] = useControllableState({\n state: props.visible,\n initialState: false\n });\n const setVisible = React.useCallback((ev, data)=>{\n clearDelayTimeout();\n setVisibleInternal((oldVisible)=>{\n if (data.visible !== oldVisible) {\n onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(ev, data);\n }\n return data.visible;\n });\n }, [\n clearDelayTimeout,\n setVisibleInternal,\n onVisibleChange\n ]);\n const state = {\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 state.content.id = useId('tooltip-', state.content.id);\n const positioningOptions = {\n enabled: state.visible,\n arrowPadding: 2 * tooltipBorderRadius,\n position: 'above',\n align: 'center',\n offset: 4,\n ...resolvePositioningShorthand(state.positioning)\n };\n if (state.withArrow) {\n positioningOptions.offset = mergeArrowOffset(positioningOptions.offset, arrowHeight);\n }\n const { targetRef, containerRef, arrowRef } = usePositioning(positioningOptions);\n state.content.ref = useMergedRefs(state.content.ref, containerRef);\n state.arrowRef = arrowRef;\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 var _context_visibleTooltip;\n const thisTooltip = {\n hide: (ev)=>setVisible(undefined, {\n visible: false,\n documentKeyboardEvent: ev\n })\n };\n (_context_visibleTooltip = context.visibleTooltip) === null || _context_visibleTooltip === void 0 ? void 0 : _context_visibleTooltip.hide();\n context.visibleTooltip = thisTooltip;\n const onDocumentKeyDown = (ev)=>{\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 targetDocument === null || targetDocument === void 0 ? void 0 : 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 return ()=>{\n if (context.visibleTooltip === thisTooltip) {\n context.visibleTooltip = undefined;\n }\n targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('keydown', onDocumentKeyDown, {\n capture: true\n });\n };\n }\n }, [\n context,\n targetDocument,\n visible,\n setVisible\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 const ignoreNextFocusEventRef = React.useRef(false);\n // Listener for onPointerEnter and onFocus on the trigger element\n const onEnterTrigger = React.useCallback((ev)=>{\n if (ev.type === 'focus' && ignoreNextFocusEventRef.current) {\n ignoreNextFocusEventRef.current = false;\n return;\n }\n // Show immediately if another tooltip is already visible\n const delay = context.visibleTooltip ? 0 : state.showDelay;\n setDelayTimeout(()=>{\n setVisible(ev, {\n visible: true\n });\n }, delay);\n ev.persist(); // Persist the event since the setVisible call will happen asynchronously\n }, [\n setDelayTimeout,\n setVisible,\n state.showDelay,\n context\n ]);\n // Listener for onPointerLeave and onBlur on the trigger element\n const onLeaveTrigger = React.useCallback((ev)=>{\n let delay = state.hideDelay;\n if (ev.type === 'blur') {\n // Hide immediately when losing focus\n delay = 0;\n ignoreNextFocusEventRef.current = (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement) === ev.target;\n }\n setDelayTimeout(()=>{\n setVisible(ev, {\n visible: false\n });\n }, delay);\n ev.persist(); // Persist the event since the setVisible call will happen asynchronously\n }, [\n setDelayTimeout,\n setVisible,\n state.hideDelay,\n targetDocument\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 const child = getTriggerChild(children);\n const triggerAriaProps = {};\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 // Don't render the Tooltip in SSR to avoid hydration errors\n if (isServerSideRender) {\n state.shouldRenderTooltip = false;\n }\n const childTargetRef = useMergedRefs(child === null || child === void 0 ? void 0 : child.ref, targetRef);\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 === null || child === void 0 ? void 0 : child.props,\n // If the target prop is not provided, attach targetRef to the trigger element's ref prop\n ref: positioningOptions.target === undefined ? childTargetRef : child === null || child === void 0 ? void 0 : child.ref,\n onPointerEnter: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props = child.props) === null || _child_props === void 0 ? void 0 : _child_props.onPointerEnter, onEnterTrigger)),\n onPointerLeave: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props1 = child.props) === null || _child_props1 === void 0 ? void 0 : _child_props1.onPointerLeave, onLeaveTrigger)),\n onFocus: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props2 = child.props) === null || _child_props2 === void 0 ? void 0 : _child_props2.onFocus, onEnterTrigger)),\n onBlur: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props3 = child.props) === null || _child_props3 === void 0 ? void 0 : _child_props3.onBlur, onLeaveTrigger))\n });\n return state;\n};\n"],"names":["useTooltip_unstable","props","_child_props","_child_props1","_child_props2","_child_props3","context","useTooltipVisibility","isServerSideRender","useIsSSR","targetDocument","useFluent","setDelayTimeout","clearDelayTimeout","useTimeout","appearance","children","content","withArrow","positioning","onVisibleChange","relationship","showDelay","hideDelay","mountNode","visible","setVisibleInternal","useControllableState","state","initialState","setVisible","React","useCallback","ev","data","oldVisible","shouldRenderTooltip","components","slot","always","defaultProps","role","elementType","id","useId","positioningOptions","enabled","arrowPadding","tooltipBorderRadius","position","align","offset","resolvePositioningShorthand","mergeArrowOffset","arrowHeight","targetRef","containerRef","arrowRef","usePositioning","ref","useMergedRefs","useIsomorphicLayoutEffect","_context_visibleTooltip","thisTooltip","hide","undefined","documentKeyboardEvent","visibleTooltip","onDocumentKeyDown","key","Escape","defaultPrevented","preventDefault","addEventListener","capture","removeEventListener","ignoreNextFocusEventRef","useRef","onEnterTrigger","type","current","delay","persist","onLeaveTrigger","activeElement","target","onPointerEnter","mergeCallbacks","onPointerLeave","onFocus","onBlur","child","getTriggerChild","triggerAriaProps","childTargetRef","applyTriggerPropsToChildren","useEventCallback"],"mappings":"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"}
|
1
|
+
{"version":3,"sources":["useTooltip.js"],"sourcesContent":["import * as React from 'react';\nimport { mergeArrowOffset, resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';\nimport { useTooltipVisibility_unstable as useTooltipVisibility, useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { KEYBORG_FOCUSIN } from '@fluentui/react-tabster';\nimport { applyTriggerPropsToChildren, useControllableState, useId, useIsomorphicLayoutEffect, useIsSSR, useMergedRefs, useTimeout, getTriggerChild, mergeCallbacks, useEventCallback, slot } from '@fluentui/react-utilities';\nimport { arrowHeight, tooltipBorderRadius } from './private/constants';\nimport { Escape } from '@fluentui/keyboard-keys';\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 */ export const useTooltip_unstable = (props)=>{\n var _child_props, _child_props1, _child_props2, _child_props3;\n const context = useTooltipVisibility();\n const isServerSideRender = useIsSSR();\n const { targetDocument } = useFluent();\n const [setDelayTimeout, clearDelayTimeout] = useTimeout();\n const { appearance = 'normal', children, content, withArrow = false, positioning = 'above', onVisibleChange, relationship, showDelay = 250, hideDelay = 250, mountNode } = props;\n const [visible, setVisibleInternal] = useControllableState({\n state: props.visible,\n initialState: false\n });\n const setVisible = React.useCallback((ev, data)=>{\n clearDelayTimeout();\n setVisibleInternal((oldVisible)=>{\n if (data.visible !== oldVisible) {\n onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(ev, data);\n }\n return data.visible;\n });\n }, [\n clearDelayTimeout,\n setVisibleInternal,\n onVisibleChange\n ]);\n const state = {\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 state.content.id = useId('tooltip-', state.content.id);\n const positioningOptions = {\n enabled: state.visible,\n arrowPadding: 2 * tooltipBorderRadius,\n position: 'above',\n align: 'center',\n offset: 4,\n ...resolvePositioningShorthand(state.positioning)\n };\n if (state.withArrow) {\n positioningOptions.offset = mergeArrowOffset(positioningOptions.offset, arrowHeight);\n }\n const { targetRef, containerRef, arrowRef } = usePositioning(positioningOptions);\n state.content.ref = useMergedRefs(state.content.ref, containerRef);\n state.arrowRef = arrowRef;\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 var _context_visibleTooltip;\n const thisTooltip = {\n hide: (ev)=>setVisible(undefined, {\n visible: false,\n documentKeyboardEvent: ev\n })\n };\n (_context_visibleTooltip = context.visibleTooltip) === null || _context_visibleTooltip === void 0 ? void 0 : _context_visibleTooltip.hide();\n context.visibleTooltip = thisTooltip;\n const onDocumentKeyDown = (ev)=>{\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 targetDocument === null || targetDocument === void 0 ? void 0 : 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 return ()=>{\n if (context.visibleTooltip === thisTooltip) {\n context.visibleTooltip = undefined;\n }\n targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('keydown', onDocumentKeyDown, {\n capture: true\n });\n };\n }\n }, [\n context,\n targetDocument,\n visible,\n setVisible\n ]);\n // Used to skip showing the tooltip in certain situations when the trigger is focued.\n // See comments where this is set for more info.\n const ignoreNextFocusEventRef = React.useRef(false);\n // Listener for onPointerEnter and onFocus on the trigger element\n const onEnterTrigger = React.useCallback((ev)=>{\n if (ev.type === 'focus' && ignoreNextFocusEventRef.current) {\n ignoreNextFocusEventRef.current = false;\n return;\n }\n // Show immediately if another tooltip is already visible\n const delay = context.visibleTooltip ? 0 : state.showDelay;\n setDelayTimeout(()=>{\n setVisible(ev, {\n visible: true\n });\n }, delay);\n ev.persist(); // Persist the event since the setVisible call will happen asynchronously\n }, [\n setDelayTimeout,\n setVisible,\n state.showDelay,\n context\n ]);\n // Callback ref that attaches a keyborg:focusin event listener.\n const [keyborgListenerCallbackRef] = React.useState(()=>{\n const onKeyborgFocusIn = (ev)=>{\n var _ev_details;\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_details = ev.details) === null || _ev_details === void 0 ? void 0 : _ev_details.isFocusedProgrammatically) {\n ignoreNextFocusEventRef.current = true;\n }\n };\n // Save the current element to remove the listener when the ref changes\n let current = null;\n // Callback ref that attaches the listener to the element\n return (element)=>{\n current === null || current === void 0 ? void 0 : current.removeEventListener(KEYBORG_FOCUSIN, onKeyborgFocusIn);\n element === null || element === void 0 ? void 0 : element.addEventListener(KEYBORG_FOCUSIN, onKeyborgFocusIn);\n current = element;\n };\n });\n // Listener for onPointerLeave and onBlur on the trigger element\n const onLeaveTrigger = React.useCallback((ev)=>{\n let delay = state.hideDelay;\n if (ev.type === 'blur') {\n // Hide immediately when losing focus\n delay = 0;\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 === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement) === ev.target;\n }\n setDelayTimeout(()=>{\n setVisible(ev, {\n visible: false\n });\n }, delay);\n ev.persist(); // Persist the event since the setVisible call will happen asynchronously\n }, [\n setDelayTimeout,\n setVisible,\n state.hideDelay,\n targetDocument\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 const child = getTriggerChild(children);\n const triggerAriaProps = {};\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 // Don't render the Tooltip in SSR to avoid hydration errors\n if (isServerSideRender) {\n state.shouldRenderTooltip = false;\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 === null || child === void 0 ? void 0 : child.props,\n ref: useMergedRefs(child === null || child === void 0 ? void 0 : child.ref, keyborgListenerCallbackRef, // If the target prop is not provided, attach targetRef to the trigger element's ref prop\n positioningOptions.target === undefined ? targetRef : undefined),\n onPointerEnter: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props = child.props) === null || _child_props === void 0 ? void 0 : _child_props.onPointerEnter, onEnterTrigger)),\n onPointerLeave: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props1 = child.props) === null || _child_props1 === void 0 ? void 0 : _child_props1.onPointerLeave, onLeaveTrigger)),\n onFocus: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props2 = child.props) === null || _child_props2 === void 0 ? void 0 : _child_props2.onFocus, onEnterTrigger)),\n onBlur: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : (_child_props3 = child.props) === null || _child_props3 === void 0 ? void 0 : _child_props3.onBlur, onLeaveTrigger))\n });\n return state;\n};\n"],"names":["useTooltip_unstable","props","_child_props","_child_props1","_child_props2","_child_props3","context","useTooltipVisibility","isServerSideRender","useIsSSR","targetDocument","useFluent","setDelayTimeout","clearDelayTimeout","useTimeout","appearance","children","content","withArrow","positioning","onVisibleChange","relationship","showDelay","hideDelay","mountNode","visible","setVisibleInternal","useControllableState","state","initialState","setVisible","React","useCallback","ev","data","oldVisible","shouldRenderTooltip","components","slot","always","defaultProps","role","elementType","id","useId","positioningOptions","enabled","arrowPadding","tooltipBorderRadius","position","align","offset","resolvePositioningShorthand","mergeArrowOffset","arrowHeight","targetRef","containerRef","arrowRef","usePositioning","ref","useMergedRefs","useIsomorphicLayoutEffect","_context_visibleTooltip","thisTooltip","hide","undefined","documentKeyboardEvent","visibleTooltip","onDocumentKeyDown","key","Escape","defaultPrevented","preventDefault","addEventListener","capture","removeEventListener","ignoreNextFocusEventRef","useRef","onEnterTrigger","type","current","delay","persist","keyborgListenerCallbackRef","useState","onKeyborgFocusIn","_ev_details","details","isFocusedProgrammatically","element","KEYBORG_FOCUSIN","onLeaveTrigger","activeElement","target","onPointerEnter","mergeCallbacks","onPointerLeave","onFocus","onBlur","child","getTriggerChild","triggerAriaProps","applyTriggerPropsToChildren","useEventCallback"],"mappings":"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"}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@fluentui/react-tooltip",
|
3
|
-
"version": "9.
|
3
|
+
"version": "9.4.1",
|
4
4
|
"description": "React components for building web experiences",
|
5
5
|
"main": "lib-commonjs/index.js",
|
6
6
|
"module": "lib/index.js",
|
@@ -34,10 +34,11 @@
|
|
34
34
|
},
|
35
35
|
"dependencies": {
|
36
36
|
"@fluentui/keyboard-keys": "^9.0.7",
|
37
|
-
"@fluentui/react-jsx-runtime": "^9.0.
|
38
|
-
"@fluentui/react-portal": "^9.4.
|
39
|
-
"@fluentui/react-positioning": "^9.10.
|
40
|
-
"@fluentui/react-shared-contexts": "^9.
|
37
|
+
"@fluentui/react-jsx-runtime": "^9.0.20",
|
38
|
+
"@fluentui/react-portal": "^9.4.3",
|
39
|
+
"@fluentui/react-positioning": "^9.10.2",
|
40
|
+
"@fluentui/react-shared-contexts": "^9.13.0",
|
41
|
+
"@fluentui/react-tabster": "^9.15.0",
|
41
42
|
"@fluentui/react-theme": "^9.1.16",
|
42
43
|
"@fluentui/react-utilities": "^9.15.2",
|
43
44
|
"@griffel/react": "^1.5.14",
|