@fluentui/react-tooltip 0.0.0-nightly-20230223-0420.1 → 0.0.0-nightly-20230223-2115.1

package/lib-commonjs/components/Tooltip/renderTooltip.js

@@ -1,28 +1,25 @@
 "use strict";
-
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
+});
+Object.defineProperty(exports, "renderTooltip_unstable", {
+    enumerable: true,
+    get: ()=>renderTooltip_unstable
 });
-exports.renderTooltip_unstable = void 0;
-const React = /*#__PURE__*/require("react");
-const react_portal_1 = /*#__PURE__*/require("@fluentui/react-portal");
-const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
-/**
- * Render the final JSX of Tooltip
- */
-const renderTooltip_unstable = state => {
-  const {
-    slots,
-    slotProps
-  } = react_utilities_1.getSlots(state);
-  return React.createElement(React.Fragment, null, state.children, state.shouldRenderTooltip && React.createElement(react_portal_1.Portal, {
-    mountNode: state.mountNode
-  }, React.createElement(slots.content, {
-    ...slotProps.content
-  }, state.withArrow && React.createElement("div", {
-    ref: state.arrowRef,
-    className: state.arrowClassName
-  }), state.content.children)));
-};
-exports.renderTooltip_unstable = renderTooltip_unstable;
+const _interopRequireDefault = require("@swc/helpers/lib/_interop_require_default.js").default;
+const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+const _extends = require("@swc/helpers/lib/_extends.js").default;
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _reactPortal = require("@fluentui/react-portal");
+const _reactUtilities = require("@fluentui/react-utilities");
+const renderTooltip_unstable = (state)=>{
+    const { slots , slotProps  } = (0, _reactUtilities.getSlots)(state);
+    return /*#__PURE__*/ _react.createElement(_react.Fragment, null, state.children, state.shouldRenderTooltip && /*#__PURE__*/ _react.createElement(_reactPortal.Portal, {
+        mountNode: state.mountNode
+    }, /*#__PURE__*/ _react.createElement(slots.content, _extends({}, slotProps.content), state.withArrow && /*#__PURE__*/ _react.createElement("div", {
+        ref: state.arrowRef,
+        className: state.arrowClassName
+    }), state.content.children)));
+}; //# sourceMappingURL=renderTooltip.js.map
+
 //# sourceMappingURL=renderTooltip.js.map

package/lib-commonjs/components/Tooltip/renderTooltip.js.map

@@ -1 +1 @@
-{"version":3,"mappings":";;;;;;AAAA;AACA;AACA;AAGA;;;AAGO,MAAMA,sBAAsB,GAAIC,KAAmB,IAAI;EAC5D,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGC,0BAAQ,CAAeH,KAAK,CAAC;EAE1D,OACEI,0CACGJ,KAAK,CAACK,QAAQ,EACdL,KAAK,CAACM,mBAAmB,IACxBF,oBAACG,qBAAM;IAACC,SAAS,EAAER,KAAK,CAACQ;EAAS,GAChCJ,oBAACH,KAAK,CAACQ,OAAO;IAAA,GAAKP,SAAS,CAACO;EAAO,GACjCT,KAAK,CAACU,SAAS,IAAIN;IAAKO,GAAG,EAAEX,KAAK,CAACY,QAAQ;IAAEC,SAAS,EAAEb,KAAK,CAACc;EAAc,EAAI,EAChFd,KAAK,CAACS,OAAO,CAACJ,QAAQ,CACT,CAEnB,CACA;AAEP,CAAC;AAhBYU,8BAAsB","names":["renderTooltip_unstable","state","slots","slotProps","react_utilities_1","React","children","shouldRenderTooltip","react_portal_1","mountNode","content","withArrow","ref","arrowRef","className","arrowClassName","exports"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-tooltip/src/components/Tooltip/renderTooltip.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Portal } from '@fluentui/react-portal';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { TooltipSlots, TooltipState } from './Tooltip.types';\n\n/**\n * Render the final JSX of Tooltip\n */\nexport const renderTooltip_unstable = (state: TooltipState) => {\n  const { slots, slotProps } = getSlots<TooltipSlots>(state);\n\n  return (\n    <>\n      {state.children}\n      {state.shouldRenderTooltip && (\n        <Portal mountNode={state.mountNode}>\n          <slots.content {...slotProps.content}>\n            {state.withArrow && <div ref={state.arrowRef} className={state.arrowClassName} />}\n            {state.content.children}\n          </slots.content>\n        </Portal>\n      )}\n    </>\n  );\n};\n"]}
+{"version":3,"sources":["../../../lib/components/Tooltip/renderTooltip.js"],"sourcesContent":["import _extends from \"@swc/helpers/src/_extends.mjs\";\nimport * as React from 'react';\nimport { Portal } from '@fluentui/react-portal';\nimport { getSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of Tooltip\n */\nexport const renderTooltip_unstable = state => {\n  const {\n    slots,\n    slotProps\n  } = getSlots(state);\n  return /*#__PURE__*/React.createElement(React.Fragment, null, state.children, state.shouldRenderTooltip && /*#__PURE__*/React.createElement(Portal, {\n    mountNode: state.mountNode\n  }, /*#__PURE__*/React.createElement(slots.content, _extends({}, slotProps.content), state.withArrow && /*#__PURE__*/React.createElement(\"div\", {\n    ref: state.arrowRef,\n    className: state.arrowClassName\n  }), state.content.children)));\n};\n//# sourceMappingURL=renderTooltip.js.map"],"names":["renderTooltip_unstable","state","slots","slotProps","getSlots","React","createElement","Fragment","children","shouldRenderTooltip","Portal","mountNode","content","_extends","withArrow","ref","arrowRef","className","arrowClassName"],"mappings":";;;;+BAOaA;;aAAAA;;;;yBAPQ;6DACE;6BACA;gCACE;AAIlB,MAAMA,yBAAyBC,CAAAA,QAAS;IAC7C,MAAM,EACJC,MAAK,EACLC,UAAS,EACV,GAAGC,IAAAA,wBAAQ,EAACH;IACb,OAAO,WAAW,GAAEI,OAAMC,aAAa,CAACD,OAAME,QAAQ,EAAE,IAAI,EAAEN,MAAMO,QAAQ,EAAEP,MAAMQ,mBAAmB,IAAI,WAAW,GAAEJ,OAAMC,aAAa,CAACI,mBAAM,EAAE;QAClJC,WAAWV,MAAMU,SAAS;IAC5B,GAAG,WAAW,GAAEN,OAAMC,aAAa,CAACJ,MAAMU,OAAO,EAAEC,SAAS,CAAC,GAAGV,UAAUS,OAAO,GAAGX,MAAMa,SAAS,IAAI,WAAW,GAAET,OAAMC,aAAa,CAAC,OAAO;QAC7IS,KAAKd,MAAMe,QAAQ;QACnBC,WAAWhB,MAAMiB,cAAc;IACjC,IAAIjB,MAAMW,OAAO,CAACJ,QAAQ;AAC5B,GACA,yCAAyC"}

package/lib-commonjs/components/Tooltip/useTooltip.js

@@ -1,203 +1,200 @@
 "use strict";
-
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
 });
-exports.useTooltip_unstable = void 0;
-const React = /*#__PURE__*/require("react");
-const react_positioning_1 = /*#__PURE__*/require("@fluentui/react-positioning");
-const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
-const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
-const constants_1 = /*#__PURE__*/require("./private/constants");
-const keyboard_keys_1 = /*#__PURE__*/require("@fluentui/keyboard-keys");
-/**
- * Create the state required to render Tooltip.
- *
- * The returned state can be modified with hooks such as useTooltipStyles_unstable,
- * before being passed to renderTooltip_unstable.
- *
- * @param props - props from this instance of Tooltip
- */
-const useTooltip_unstable = props => {
-  var _a, _b, _c, _d;
-  const context = react_shared_contexts_1.useTooltipVisibility_unstable();
-  const isServerSideRender = react_utilities_1.useIsSSR();
-  const {
-    targetDocument
-  } = react_shared_contexts_1.useFluent_unstable();
-  const [setDelayTimeout, clearDelayTimeout] = react_utilities_1.useTimeout();
-  const {
-    appearance = 'normal',
-    children,
-    content,
-    withArrow = false,
-    positioning = 'above',
-    onVisibleChange,
-    relationship,
-    showDelay = 250,
-    hideDelay = 250,
-    mountNode
-  } = props;
-  const [visible, setVisibleInternal] = react_utilities_1.useControllableState({
-    state: props.visible,
-    initialState: false
-  });
-  const setVisible = React.useCallback((newVisible, ev) => {
-    clearDelayTimeout();
-    setVisibleInternal(oldVisible => {
-      if (newVisible !== oldVisible) {
-        onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(ev, {
-          visible: newVisible
-        });
-      }
-      return newVisible;
+Object.defineProperty(exports, "useTooltip_unstable", {
+    enumerable: true,
+    get: ()=>useTooltip_unstable
+});
+const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _reactPositioning = require("@fluentui/react-positioning");
+const _reactSharedContexts = require("@fluentui/react-shared-contexts");
+const _reactUtilities = require("@fluentui/react-utilities");
+const _constants = require("./private/constants");
+const _keyboardKeys = require("@fluentui/keyboard-keys");
+const useTooltip_unstable = (props)=>{
+    var _child_props, _child_props1, _child_props2, _child_props3;
+    const context = (0, _reactSharedContexts.useTooltipVisibility_unstable)();
+    const isServerSideRender = (0, _reactUtilities.useIsSSR)();
+    const { targetDocument  } = (0, _reactSharedContexts.useFluent_unstable)();
+    const [setDelayTimeout, clearDelayTimeout] = (0, _reactUtilities.useTimeout)();
+    const { appearance ='normal' , children , content , withArrow =false , positioning ='above' , onVisibleChange , relationship , showDelay =250 , hideDelay =250 , mountNode  } = props;
+    const [visible, setVisibleInternal] = (0, _reactUtilities.useControllableState)({
+        state: props.visible,
+        initialState: false
     });
-  }, [clearDelayTimeout, setVisibleInternal, onVisibleChange]);
-  const state = {
-    withArrow,
-    positioning,
-    showDelay,
-    hideDelay,
-    relationship,
-    visible,
-    shouldRenderTooltip: visible,
-    appearance,
-    mountNode,
-    // Slots
-    components: {
-      content: 'div'
-    },
-    content: react_utilities_1.resolveShorthand(content, {
-      defaultProps: {
-        role: 'tooltip'
-      },
-      required: true
-    })
-  };
-  state.content.id = react_utilities_1.useId('tooltip-', state.content.id);
-  const positioningOptions = {
-    enabled: state.visible,
-    arrowPadding: 2 * constants_1.tooltipBorderRadius,
-    position: 'above',
-    align: 'center',
-    offset: 4,
-    ...react_positioning_1.resolvePositioningShorthand(state.positioning)
-  };
-  if (state.withArrow) {
-    positioningOptions.offset = react_positioning_1.mergeArrowOffset(positioningOptions.offset, constants_1.arrowHeight);
-  }
-  const {
-    targetRef,
-    containerRef,
-    arrowRef
-  } = react_positioning_1.usePositioning(positioningOptions);
-  state.content.ref = react_utilities_1.useMergedRefs(state.content.ref, containerRef);
-  state.arrowRef = arrowRef;
-  // When this tooltip is visible, hide any other tooltips, and register it
-  // as the visibleTooltip with the TooltipContext.
-  // Also add a listener on document to hide the tooltip if Escape is pressed
-  react_utilities_1.useIsomorphicLayoutEffect(() => {
-    var _a;
-    if (visible) {
-      const thisTooltip = {
-        hide: () => setVisible(false)
-      };
-      (_a = context.visibleTooltip) === null || _a === void 0 ? void 0 : _a.hide();
-      context.visibleTooltip = thisTooltip;
-      const onDocumentKeyDown = ev => {
-        if (ev.key === keyboard_keys_1.Escape) {
-          thisTooltip.hide();
-          // stop propagation to avoid conflicting with other elements that listen for `Escape`
-          // e,g: Dialog, Popover, Menu
-          ev.stopPropagation();
-        }
-      };
-      targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('keydown', onDocumentKeyDown, {
-        // As this event is added at targeted document,
-        // we need to capture the event to be sure keydown handling from tooltip happens first
-        capture: true
-      });
-      return () => {
-        if (context.visibleTooltip === thisTooltip) {
-          context.visibleTooltip = undefined;
-        }
-        targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('keydown', onDocumentKeyDown, {
-          capture: true
+    const setVisible = _react.useCallback((newVisible, ev)=>{
+        clearDelayTimeout();
+        setVisibleInternal((oldVisible)=>{
+            if (newVisible !== oldVisible) {
+                onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(ev, {
+                    visible: newVisible
+                });
+            }
+            return newVisible;
         });
-      };
-    }
-  }, [context, targetDocument, visible, setVisible]);
-  // The focused element gets a blur event when the document loses focus
-  // (e.g. switching tabs in the browser), but we don't want to show the
-  // tooltip again when the document gets focus back. Handle this case by
-  // checking if the blurred element is still the document's activeElement.
-  // See https://github.com/microsoft/fluentui/issues/13541
-  const ignoreNextFocusEventRef = React.useRef(false);
-  // Listener for onPointerEnter and onFocus on the trigger element
-  const onEnterTrigger = React.useCallback(ev => {
-    if (ev.type === 'focus' && ignoreNextFocusEventRef.current) {
-      ignoreNextFocusEventRef.current = false;
-      return;
+    }, [
+        clearDelayTimeout,
+        setVisibleInternal,
+        onVisibleChange
+    ]);
+    const state = {
+        withArrow,
+        positioning,
+        showDelay,
+        hideDelay,
+        relationship,
+        visible,
+        shouldRenderTooltip: visible,
+        appearance,
+        mountNode,
+        // Slots
+        components: {
+            content: 'div'
+        },
+        content: (0, _reactUtilities.resolveShorthand)(content, {
+            defaultProps: {
+                role: 'tooltip'
+            },
+            required: true
+        })
+    };
+    state.content.id = (0, _reactUtilities.useId)('tooltip-', state.content.id);
+    const positioningOptions = {
+        enabled: state.visible,
+        arrowPadding: 2 * _constants.tooltipBorderRadius,
+        position: 'above',
+        align: 'center',
+        offset: 4,
+        ...(0, _reactPositioning.resolvePositioningShorthand)(state.positioning)
+    };
+    if (state.withArrow) {
+        positioningOptions.offset = (0, _reactPositioning.mergeArrowOffset)(positioningOptions.offset, _constants.arrowHeight);
     }
-    // Show immediately if another tooltip is already visible
-    const delay = context.visibleTooltip ? 0 : state.showDelay;
-    setDelayTimeout(() => {
-      setVisible(true, ev);
-    }, delay);
-    ev.persist(); // Persist the event since the setVisible call will happen asynchronously
-  }, [setDelayTimeout, setVisible, state.showDelay, context]);
-  // Listener for onPointerLeave and onBlur on the trigger element
-  const onLeaveTrigger = React.useCallback(ev => {
-    let delay = state.hideDelay;
-    if (ev.type === 'blur') {
-      // Hide immediately when losing focus
-      delay = 0;
-      ignoreNextFocusEventRef.current = (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement) === ev.target;
+    const { targetRef , containerRef , arrowRef  } = (0, _reactPositioning.usePositioning)(positioningOptions);
+    state.content.ref = (0, _reactUtilities.useMergedRefs)(state.content.ref, containerRef);
+    state.arrowRef = arrowRef;
+    // When this tooltip is visible, hide any other tooltips, and register it
+    // as the visibleTooltip with the TooltipContext.
+    // Also add a listener on document to hide the tooltip if Escape is pressed
+    (0, _reactUtilities.useIsomorphicLayoutEffect)(()=>{
+        if (visible) {
+            var _context_visibleTooltip;
+            const thisTooltip = {
+                hide: ()=>setVisible(false)
+            };
+            (_context_visibleTooltip = context.visibleTooltip) === null || _context_visibleTooltip === void 0 ? void 0 : _context_visibleTooltip.hide();
+            context.visibleTooltip = thisTooltip;
+            const onDocumentKeyDown = (ev)=>{
+                if (ev.key === _keyboardKeys.Escape) {
+                    thisTooltip.hide();
+                    // stop propagation to avoid conflicting with other elements that listen for `Escape`
+                    // e,g: Dialog, Popover, Menu
+                    ev.stopPropagation();
+                }
+            };
+            targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('keydown', onDocumentKeyDown, {
+                // As this event is added at targeted document,
+                // we need to capture the event to be sure keydown handling from tooltip happens first
+                capture: true
+            });
+            return ()=>{
+                if (context.visibleTooltip === thisTooltip) {
+                    context.visibleTooltip = undefined;
+                }
+                targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('keydown', onDocumentKeyDown, {
+                    capture: true
+                });
+            };
+        }
+    }, [
+        context,
+        targetDocument,
+        visible,
+        setVisible
+    ]);
+    // The focused element gets a blur event when the document loses focus
+    // (e.g. switching tabs in the browser), but we don't want to show the
+    // tooltip again when the document gets focus back. Handle this case by
+    // checking if the blurred element is still the document's activeElement.
+    // See https://github.com/microsoft/fluentui/issues/13541
+    const ignoreNextFocusEventRef = _react.useRef(false);
+    // Listener for onPointerEnter and onFocus on the trigger element
+    const onEnterTrigger = _react.useCallback((ev)=>{
+        if (ev.type === 'focus' && ignoreNextFocusEventRef.current) {
+            ignoreNextFocusEventRef.current = false;
+            return;
+        }
+        // Show immediately if another tooltip is already visible
+        const delay = context.visibleTooltip ? 0 : state.showDelay;
+        setDelayTimeout(()=>{
+            setVisible(true, ev);
+        }, delay);
+        ev.persist(); // Persist the event since the setVisible call will happen asynchronously
+    }, [
+        setDelayTimeout,
+        setVisible,
+        state.showDelay,
+        context
+    ]);
+    // Listener for onPointerLeave and onBlur on the trigger element
+    const onLeaveTrigger = _react.useCallback((ev)=>{
+        let delay = state.hideDelay;
+        if (ev.type === 'blur') {
+            // Hide immediately when losing focus
+            delay = 0;
+            ignoreNextFocusEventRef.current = (targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement) === ev.target;
+        }
+        setDelayTimeout(()=>{
+            setVisible(false, ev);
+        }, delay);
+        ev.persist(); // Persist the event since the setVisible call will happen asynchronously
+    }, [
+        setDelayTimeout,
+        setVisible,
+        state.hideDelay,
+        targetDocument
+    ]);
+    // Cancel the hide timer when the mouse or focus enters the tooltip, and restart it when the mouse or focus leaves.
+    // This keeps the tooltip visible when the mouse is moved over it, or it has focus within.
+    state.content.onPointerEnter = (0, _reactUtilities.mergeCallbacks)(state.content.onPointerEnter, clearDelayTimeout);
+    state.content.onPointerLeave = (0, _reactUtilities.mergeCallbacks)(state.content.onPointerLeave, onLeaveTrigger);
+    state.content.onFocus = (0, _reactUtilities.mergeCallbacks)(state.content.onFocus, clearDelayTimeout);
+    state.content.onBlur = (0, _reactUtilities.mergeCallbacks)(state.content.onBlur, onLeaveTrigger);
+    const child = (0, _reactUtilities.getTriggerChild)(children);
+    const triggerAriaProps = {};
+    if (relationship === 'label') {
+        // aria-label only works if the content is a string. Otherwise, need to use aria-labelledby.
+        if (typeof state.content.children === 'string') {
+            triggerAriaProps['aria-label'] = state.content.children;
+        } else {
+            triggerAriaProps['aria-labelledby'] = state.content.id;
+            // Always render the tooltip even if hidden, so that aria-labelledby refers to a valid element
+            state.shouldRenderTooltip = true;
+        }
+    } else if (relationship === 'description') {
+        triggerAriaProps['aria-describedby'] = state.content.id;
+        // Always render the tooltip even if hidden, so that aria-describedby refers to a valid element
+        state.shouldRenderTooltip = true;
     }
-    setDelayTimeout(() => {
-      setVisible(false, ev);
-    }, delay);
-    ev.persist(); // Persist the event since the setVisible call will happen asynchronously
-  }, [setDelayTimeout, setVisible, state.hideDelay, targetDocument]);
-  // Cancel the hide timer when the mouse or focus enters the tooltip, and restart it when the mouse or focus leaves.
-  // This keeps the tooltip visible when the mouse is moved over it, or it has focus within.
-  state.content.onPointerEnter = react_utilities_1.mergeCallbacks(state.content.onPointerEnter, clearDelayTimeout);
-  state.content.onPointerLeave = react_utilities_1.mergeCallbacks(state.content.onPointerLeave, onLeaveTrigger);
-  state.content.onFocus = react_utilities_1.mergeCallbacks(state.content.onFocus, clearDelayTimeout);
-  state.content.onBlur = react_utilities_1.mergeCallbacks(state.content.onBlur, onLeaveTrigger);
-  const child = react_utilities_1.getTriggerChild(children);
-  const triggerAriaProps = {};
-  if (relationship === 'label') {
-    // aria-label only works if the content is a string. Otherwise, need to use aria-labelledby.
-    if (typeof state.content.children === 'string') {
-      triggerAriaProps['aria-label'] = state.content.children;
-    } else {
-      triggerAriaProps['aria-labelledby'] = state.content.id;
-      // Always render the tooltip even if hidden, so that aria-labelledby refers to a valid element
-      state.shouldRenderTooltip = true;
+    // Don't render the Tooltip in SSR to avoid hydration errors
+    if (isServerSideRender) {
+        state.shouldRenderTooltip = false;
     }
-  } else if (relationship === 'description') {
-    triggerAriaProps['aria-describedby'] = state.content.id;
-    // Always render the tooltip even if hidden, so that aria-describedby refers to a valid element
-    state.shouldRenderTooltip = true;
-  }
-  // Don't render the Tooltip in SSR to avoid hydration errors
-  if (isServerSideRender) {
-    state.shouldRenderTooltip = false;
-  }
-  const childTargetRef = react_utilities_1.useMergedRefs(child === null || child === void 0 ? void 0 : child.ref, targetRef);
-  // Apply the trigger props to the child, either by calling the render function, or cloning with the new props
-  state.children = react_utilities_1.applyTriggerPropsToChildren(children, {
-    ...triggerAriaProps,
-    ...(child === null || child === void 0 ? void 0 : child.props),
-    // If the target prop is not provided, attach targetRef to the trigger element's ref prop
-    ref: positioningOptions.target === undefined ? childTargetRef : child === null || child === void 0 ? void 0 : child.ref,
-    onPointerEnter: react_utilities_1.useEventCallback(react_utilities_1.mergeCallbacks((_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.onPointerEnter, onEnterTrigger)),
-    onPointerLeave: react_utilities_1.useEventCallback(react_utilities_1.mergeCallbacks((_b = child === null || child === void 0 ? void 0 : child.props) === null || _b === void 0 ? void 0 : _b.onPointerLeave, onLeaveTrigger)),
-    onFocus: react_utilities_1.useEventCallback(react_utilities_1.mergeCallbacks((_c = child === null || child === void 0 ? void 0 : child.props) === null || _c === void 0 ? void 0 : _c.onFocus, onEnterTrigger)),
-    onBlur: react_utilities_1.useEventCallback(react_utilities_1.mergeCallbacks((_d = child === null || child === void 0 ? void 0 : child.props) === null || _d === void 0 ? void 0 : _d.onBlur, onLeaveTrigger))
-  });
-  return state;
-};
-exports.useTooltip_unstable = useTooltip_unstable;
+    const childTargetRef = (0, _reactUtilities.useMergedRefs)(child === null || child === void 0 ? void 0 : child.ref, targetRef);
+    // Apply the trigger props to the child, either by calling the render function, or cloning with the new props
+    state.children = (0, _reactUtilities.applyTriggerPropsToChildren)(children, {
+        ...triggerAriaProps,
+        ...child === null || child === void 0 ? void 0 : child.props,
+        // If the target prop is not provided, attach targetRef to the trigger element's ref prop
+        ref: positioningOptions.target === undefined ? childTargetRef : child === null || child === void 0 ? void 0 : child.ref,
+        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)),
+        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)),
+        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)),
+        onBlur: (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.onBlur, onLeaveTrigger))
+    });
+    return state;
+}; //# sourceMappingURL=useTooltip.js.map
+
 //# sourceMappingURL=useTooltip.js.map

package/lib-commonjs/components/Tooltip/useTooltip.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"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","names":["useTooltip_unstable","props","context","react_shared_contexts_1","isServerSideRender","react_utilities_1","targetDocument","setDelayTimeout","clearDelayTimeout","appearance","children","content","withArrow","positioning","onVisibleChange","relationship","showDelay","hideDelay","mountNode","visible","setVisibleInternal","state","initialState","setVisible","React","useCallback","newVisible","ev","oldVisible","shouldRenderTooltip","components","defaultProps","role","required","id","positioningOptions","enabled","arrowPadding","constants_1","position","align","offset","react_positioning_1","targetRef","containerRef","arrowRef","ref","thisTooltip","hide","visibleTooltip","onDocumentKeyDown","key","keyboard_keys_1","stopPropagation","addEventListener","capture","undefined","removeEventListener","ignoreNextFocusEventRef","useRef","onEnterTrigger","type","current","delay","persist","onLeaveTrigger","activeElement","target","onPointerEnter","onPointerLeave","onFocus","onBlur","child","triggerAriaProps","childTargetRef","exports"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-tooltip/src/components/Tooltip/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  resolveShorthand,\n  useControllableState,\n  useId,\n  useIsomorphicLayoutEffect,\n  useIsSSR,\n  useMergedRefs,\n  useTimeout,\n  getTriggerChild,\n  mergeCallbacks,\n  useEventCallback,\n} from '@fluentui/react-utilities';\nimport type { TooltipProps, TooltipState, TooltipChildProps } 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    (newVisible: boolean, ev?: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement>) => {\n      clearDelayTimeout();\n      setVisibleInternal(oldVisible => {\n        if (newVisible !== oldVisible) {\n          onVisibleChange?.(ev, { visible: newVisible });\n        }\n        return newVisible;\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: resolveShorthand(content, {\n      defaultProps: {\n        role: 'tooltip',\n      },\n      required: true,\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 = { hide: () => setVisible(false) };\n\n      context.visibleTooltip?.hide();\n      context.visibleTooltip = thisTooltip;\n\n      const onDocumentKeyDown = (ev: KeyboardEvent) => {\n        if (ev.key === Escape) {\n          thisTooltip.hide();\n          // stop propagation to avoid conflicting with other elements that listen for `Escape`\n          // e,g: Dialog, Popover, Menu\n          ev.stopPropagation();\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(true, ev);\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(false, ev);\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"]}
+{"version":3,"sources":["../../../lib/components/Tooltip/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, resolveShorthand, useControllableState, useId, useIsomorphicLayoutEffect, useIsSSR, useMergedRefs, useTimeout, getTriggerChild, mergeCallbacks, useEventCallback } 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 */\nexport const useTooltip_unstable = props => {\n  var _child_props, _child_props1, _child_props2, _child_props3;\n  const context = useTooltipVisibility();\n  const isServerSideRender = useIsSSR();\n  const {\n    targetDocument\n  } = useFluent();\n  const [setDelayTimeout, clearDelayTimeout] = useTimeout();\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  const [visible, setVisibleInternal] = useControllableState({\n    state: props.visible,\n    initialState: false\n  });\n  const setVisible = React.useCallback((newVisible, ev) => {\n    clearDelayTimeout();\n    setVisibleInternal(oldVisible => {\n      if (newVisible !== oldVisible) {\n        onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(ev, {\n          visible: newVisible\n        });\n      }\n      return newVisible;\n    });\n  }, [clearDelayTimeout, setVisibleInternal, onVisibleChange]);\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: resolveShorthand(content, {\n      defaultProps: {\n        role: 'tooltip'\n      },\n      required: true\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 {\n    targetRef,\n    containerRef,\n    arrowRef\n  } = 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: () => setVisible(false)\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) {\n          thisTooltip.hide();\n          // stop propagation to avoid conflicting with other elements that listen for `Escape`\n          // e,g: Dialog, Popover, Menu\n          ev.stopPropagation();\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  }, [context, targetDocument, visible, setVisible]);\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(true, ev);\n    }, delay);\n    ev.persist(); // Persist the event since the setVisible call will happen asynchronously\n  }, [setDelayTimeout, setVisible, state.showDelay, context]);\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(false, ev);\n    }, delay);\n    ev.persist(); // Persist the event since the setVisible call will happen asynchronously\n  }, [setDelayTimeout, setVisible, state.hideDelay, targetDocument]);\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//# sourceMappingURL=useTooltip.js.map"],"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","newVisible","ev","oldVisible","shouldRenderTooltip","components","resolveShorthand","defaultProps","role","required","id","useId","positioningOptions","enabled","arrowPadding","tooltipBorderRadius","position","align","offset","resolvePositioningShorthand","mergeArrowOffset","arrowHeight","targetRef","containerRef","arrowRef","usePositioning","ref","useMergedRefs","useIsomorphicLayoutEffect","_context_visibleTooltip","thisTooltip","hide","visibleTooltip","onDocumentKeyDown","key","Escape","stopPropagation","addEventListener","capture","undefined","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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"}