@fluentui/react-tooltip 0.0.0-nightlyf8be6a7c6520220106.1 → 0.0.0-nightlyff78d1e27a20220217.1

package/lib-commonjs/components/Tooltip/Tooltip.types.d.ts

@@ -1,41 +1,24 @@
 import * as React from 'react';
 import type { PositioningShorthand } from '@fluentui/react-positioning';
-import type { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';
+import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
 /**
  * Slot properties for Tooltip
  */
 export declare type TooltipSlots = {
-    root: Omit<IntrinsicShorthandProps<'div'>, 'children'> & {
-        /**
-         * The child is the element that triggers the Tooltip. It will have additional properties added,
-         * including events and aria properties.
-         * Alternatively, children can be a render function that takes the props and adds
-         * them to the appropriate elements.
-         */
-        children?: (React.ReactElement<React.HTMLAttributes<HTMLElement>> & {
-            ref?: React.Ref<unknown>;
-        }) | ((props: TooltipTriggerProps) => React.ReactNode) | null;
-    };
+    content: NonNullable<Slot<'div'>>;
 };
 /**
  * Properties and state for Tooltip
  */
-export declare type TooltipCommons = {
+declare type TooltipCommons = {
     /**
-     * A tooltip can appear with the default appearance or inverted.
-     * When not specified, the default appearance is used.
-     */
-    appearance?: 'inverted';
-    /**
-     * The content displayed inside the tooltip.
-     */
-    content: React.ReactNode;
-    /**
-     * Color variant with inverted colors
+     * The tooltip's visual appearance.
+     * * `normal` - Uses the theme's background and text colors.
+     * * `inverted` - Higher contrast variant that uses the theme's inverted colors.
      *
-     * @defaultvalue false
+     * @defaultvalue normal
      */
-    inverted?: boolean;
+    appearance?: 'normal' | 'inverted';
     /**
      * Render an arrow pointing to the target element
      *
@@ -62,15 +45,15 @@ export declare type TooltipCommons = {
      */
     onVisibleChange?: (event: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement> | undefined, data: OnVisibleChangeData) => void;
     /**
-     * Specifies which aria attribute to set on the trigger element.
-     * * `label` - Set aria-label to the tooltip's content. Requires content to be a string; if not, uses `labelledby`.
-     * * `labelledby` - Set aria-labelledby to the tooltip's id. The id is generated if not provided.
-     * * `describedby` - Set aria-describedby to the tooltip's id. The id is generated if not provided.
-     * * null - Do not set any aria attributes on the trigger element.
+     * (Required) Specifies whether this tooltip is acting as the description or label of its trigger element.
      *
-     * @defaultvalue label
+     * * `label` - The tooltip sets the trigger's aria-label or aria-labelledby attribute. This is useful for buttons
+     *    displaying only an icon, for example.
+     * * `description` - The tooltip sets the trigger's aria-description or aria-describedby attribute.
+     * * `inaccessible` - No aria attributes are set on the trigger. This makes the tooltip's content inaccessible to
+     *   screen readers, and should only be used if the tooltip's text is available by some other means.
      */
-    triggerAriaAttribute: 'label' | 'labelledby' | 'describedby' | null;
+    relationship: 'label' | 'description' | 'inaccessible';
     /**
      * Delay before the tooltip is shown, in milliseconds.
      *
@@ -99,18 +82,18 @@ export declare type OnVisibleChangeData = {
 /**
  * Properties for Tooltip
  */
-export declare type TooltipProps = ComponentProps<TooltipSlots> & Partial<Omit<TooltipCommons, 'content'>> & Pick<TooltipCommons, 'content'>;
+export declare type TooltipProps = ComponentProps<TooltipSlots> & Partial<Omit<TooltipCommons, 'relationship'>> & Pick<TooltipCommons, 'relationship'> & {
+    children?: (React.ReactElement & {
+        ref?: React.Ref<unknown>;
+    }) | ((props: TooltipTriggerProps) => React.ReactElement | null) | null;
+};
 /**
  * State used in rendering Tooltip
  */
 export declare type TooltipState = ComponentState<TooltipSlots> & TooltipCommons & {
+    children?: React.ReactElement | null;
     /**
      * Whether the tooltip should be rendered to the DOM.
-     *
-     * Normally the tooltip will only be rendered when visible. However, if
-     * triggerAriaAttribute is labelledby or describedby, the tooltip will
-     * always be rendered even when hidden so that those aria attributes
-     * to always refer to a valid DOM element.
      */
     shouldRenderTooltip?: boolean;
     /**
@@ -122,3 +105,4 @@ export declare type TooltipState = ComponentState<TooltipSlots> & TooltipCommons
      */
     arrowClassName?: string;
 };
+export {};

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

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":""}
+{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":"../src/"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Tooltip/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,WAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA","sourceRoot":""}
+{"version":3,"sources":["components/Tooltip/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,WAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './Tooltip';\nexport * from './Tooltip.types';\nexport * from './renderTooltip';\nexport * from './useTooltip';\nexport * from './useTooltipStyles';\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/Tooltip/private/constants.d.ts

@@ -0,0 +1,12 @@
+/**
+ * The height of the tooltip's arrow in pixels.
+ */
+export declare const arrowHeight = 6;
+/**
+ * The default value of the tooltip's border radius (borderRadiusMedium).
+ *
+ * Unfortunately, Popper requires it to be specified as a variable instead of using CSS.
+ * While we could use getComputedStyle, that adds a performance penalty for something that
+ * will likely never change.
+ */
+export declare const tooltipBorderRadius = 4;

package/lib-commonjs/components/Tooltip/private/constants.js

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.tooltipBorderRadius = exports.arrowHeight = void 0;
+/**
+ * The height of the tooltip's arrow in pixels.
+ */
+
+exports.arrowHeight = 6;
+/**
+ * The default value of the tooltip's border radius (borderRadiusMedium).
+ *
+ * Unfortunately, Popper requires it to be specified as a variable instead of using CSS.
+ * While we could use getComputedStyle, that adds a performance penalty for something that
+ * will likely never change.
+ */
+
+exports.tooltipBorderRadius = 4;
+//# sourceMappingURL=constants.js.map

package/lib-commonjs/components/Tooltip/private/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["components/Tooltip/private/constants.ts"],"names":[],"mappings":";;;;;;AAAA;;AAEG;;AACU,OAAA,CAAA,WAAA,GAAc,CAAd;AAEb;;;;;;AAMG;;AACU,OAAA,CAAA,mBAAA,GAAsB,CAAtB","sourcesContent":["/**\n * The height of the tooltip's arrow in pixels.\n */\nexport const arrowHeight = 6;\n\n/**\n * The default value of the tooltip's border radius (borderRadiusMedium).\n *\n * Unfortunately, Popper requires it to be specified as a variable instead of using CSS.\n * While we could use getComputedStyle, that adds a performance penalty for something that\n * will likely never change.\n */\nexport const tooltipBorderRadius = 4;\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/Tooltip/renderTooltip.d.ts

@@ -2,4 +2,4 @@ import type { TooltipState } from './Tooltip.types';
 /**
  * Render the final JSX of Tooltip
  */
-export declare const renderTooltip: (state: TooltipState) => JSX.Element;
+export declare const renderTooltip_unstable: (state: TooltipState) => JSX.Element;

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.renderTooltip = void 0;
+exports.renderTooltip_unstable = void 0;
 
 const React = /*#__PURE__*/require("react");
 
@@ -15,17 +15,17 @@ const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
  */
 
 
-const renderTooltip = state => {
+const renderTooltip_unstable = state => {
   const {
     slots,
     slotProps
-  } = react_utilities_1.getSlots(state, ['root']);
-  return React.createElement(React.Fragment, null, state.root.children, state.shouldRenderTooltip && React.createElement(react_portal_1.Portal, null, React.createElement(slots.root, { ...slotProps.root
+  } = react_utilities_1.getSlots(state);
+  return React.createElement(React.Fragment, null, state.children, state.shouldRenderTooltip && React.createElement(react_portal_1.Portal, null, React.createElement(slots.content, { ...slotProps.content
   }, state.withArrow && React.createElement("div", {
     ref: state.arrowRef,
     className: state.arrowClassName
-  }), state.content)));
+  }), state.content.children)));
 };
 
-exports.renderTooltip = renderTooltip;
+exports.renderTooltip_unstable = renderTooltip_unstable;
 //# sourceMappingURL=renderTooltip.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Tooltip/renderTooltip.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,cAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,aAAa,GAAI,KAAD,IAAwB;AACnD,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAAuB,KAAvB,EAA8B,CAAC,MAAD,CAA9B,CAA7B;AAEA,SACE,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,EACG,KAAK,CAAC,IAAN,CAAW,QADd,EAEG,KAAK,CAAC,mBAAN,IACC,KAAA,CAAA,aAAA,CAAC,cAAA,CAAA,MAAD,EAAO,IAAP,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EACG,KAAK,CAAC,SAAN,IAAmB,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,GAAG,EAAE,KAAK,CAAC,QAAhB;AAA0B,IAAA,SAAS,EAAE,KAAK,CAAC;AAA3C,GAAA,CADtB,EAEG,KAAK,CAAC,OAFT,CADF,CAHJ,CADF;AAaD,CAhBM;;AAAM,OAAA,CAAA,aAAA,GAAa,aAAb","sourceRoot":""}
+{"version":3,"sources":["components/Tooltip/renderTooltip.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,cAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,sBAAsB,GAAI,KAAD,IAAwB;AAC5D,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAAuB,KAAvB,CAA7B;AAEA,SACE,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,EACG,KAAK,CAAC,QADT,EAEG,KAAK,CAAC,mBAAN,IACC,KAAA,CAAA,aAAA,CAAC,cAAA,CAAA,MAAD,EAAO,IAAP,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,EAAA,GAAK,SAAS,CAAC;AAAf,GAAd,EACG,KAAK,CAAC,SAAN,IAAmB,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,GAAG,EAAE,KAAK,CAAC,QAAhB;AAA0B,IAAA,SAAS,EAAE,KAAK,CAAC;AAA3C,GAAA,CADtB,EAEG,KAAK,CAAC,OAAN,CAAc,QAFjB,CADF,CAHJ,CADF;AAaD,CAhBM;;AAAM,OAAA,CAAA,sBAAA,GAAsB,sBAAtB","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>\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"],"sourceRoot":"../src/"}

package/lib-commonjs/components/Tooltip/useTooltip.d.ts

@@ -1,12 +1,10 @@
-import * as React from 'react';
 import type { TooltipProps, TooltipState } from './Tooltip.types';
 /**
  * Create the state required to render Tooltip.
  *
- * The returned state can be modified with hooks such as useTooltipStyles,
- * before being passed to renderTooltip.
+ * 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
- * @param ref - reference to root HTMLElement of Tooltip
  */
-export declare const useTooltip: (props: TooltipProps, ref: React.Ref<HTMLDivElement>) => TooltipState;
+export declare const useTooltip_unstable: (props: TooltipProps) => TooltipState;

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useTooltip = void 0;
+exports.useTooltip_unstable = void 0;
 
 const React = /*#__PURE__*/require("react");
 
@@ -11,24 +11,20 @@ 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"); // Style values that are required for popper to properly position the tooltip
-
-
-const tooltipBorderRadius = 4; // Update the root's borderRadius in useTooltipStyles.ts if this changes
-
-const arrowHeight = 6; // Update the arrow's width/height in useTooltipStyles.ts if this changes
+const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
 
+const constants_1 = /*#__PURE__*/require("./private/constants");
 /**
  * Create the state required to render Tooltip.
  *
- * The returned state can be modified with hooks such as useTooltipStyles,
- * before being passed to renderTooltip.
+ * 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
- * @param ref - reference to root HTMLElement of Tooltip
  */
 
-const useTooltip = (props, ref) => {
+
+const useTooltip_unstable = props => {
   var _a, _b, _c, _d;
 
   const context = React.useContext(react_shared_contexts_1.TooltipContext);
@@ -38,12 +34,13 @@ const useTooltip = (props, ref) => {
   } = react_shared_contexts_1.useFluent();
   const [setDelayTimeout, clearDelayTimeout] = react_utilities_1.useTimeout();
   const {
+    appearance,
+    children,
     content,
-    inverted,
     withArrow,
     positioning,
     onVisibleChange,
-    triggerAriaAttribute = 'label',
+    relationship,
     showDelay = 250,
     hideDelay = 250
   } = props;
@@ -64,30 +61,29 @@ const useTooltip = (props, ref) => {
     });
   }, [clearDelayTimeout, setVisibleInternal, onVisibleChange]);
   const state = {
-    content,
-    inverted,
     withArrow,
     positioning,
     showDelay,
     hideDelay,
-    triggerAriaAttribute,
+    relationship,
     visible,
     shouldRenderTooltip: visible,
-    appearance: props.appearance,
+    appearance,
     // Slots
     components: {
-      root: 'div'
+      content: 'div'
     },
-    root: react_utilities_1.getNativeElementProps('div', {
-      role: 'tooltip',
-      ...props,
-      ref,
-      id: react_utilities_1.useId('tooltip-', props.id)
+    content: react_utilities_1.resolveShorthand(content, {
+      defaultProps: {
+        role: 'tooltip'
+      },
+      required: true
     })
   };
+  state.content.id = react_utilities_1.useId('tooltip-', state.content.id);
   const popperOptions = {
     enabled: state.visible,
-    arrowPadding: 2 * tooltipBorderRadius,
+    arrowPadding: 2 * constants_1.tooltipBorderRadius,
     position: 'above',
     align: 'center',
     offset: [0, 4],
@@ -95,7 +91,7 @@ const useTooltip = (props, ref) => {
   };
 
   if (state.withArrow) {
-    popperOptions.offset = react_positioning_1.mergeArrowOffset(popperOptions.offset, arrowHeight);
+    popperOptions.offset = react_positioning_1.mergeArrowOffset(popperOptions.offset, constants_1.arrowHeight);
   }
 
   const {
@@ -103,7 +99,7 @@ const useTooltip = (props, ref) => {
     containerRef,
     arrowRef
   } = react_positioning_1.usePopper(popperOptions);
-  state.root.ref = react_utilities_1.useMergedRefs(state.root.ref, containerRef);
+  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
@@ -171,56 +167,41 @@ const useTooltip = (props, ref) => {
   }, [setDelayTimeout, setVisible, state.hideDelay, targetDocument]); // Cancel the hide timer when the pointer enters the tooltip, and restart it when the mouse leaves.
   // This keeps the tooltip visible when the pointer is moved over it.
 
-  state.root.onPointerEnter = useMergedCallbacks(state.root.onPointerEnter, clearDelayTimeout);
-  state.root.onPointerLeave = useMergedCallbacks(state.root.onPointerLeave, onLeaveTrigger);
-  const child = React.isValidElement(state.root.children) ? state.root.children : undefined; // The props to add to the trigger element (child)
-
-  const triggerProps = {
-    onPointerEnter: useMergedCallbacks((_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.onPointerEnter, onEnterTrigger),
-    onPointerLeave: useMergedCallbacks((_b = child === null || child === void 0 ? void 0 : child.props) === null || _b === void 0 ? void 0 : _b.onPointerLeave, onLeaveTrigger),
-    onFocus: useMergedCallbacks((_c = child === null || child === void 0 ? void 0 : child.props) === null || _c === void 0 ? void 0 : _c.onFocus, onEnterTrigger),
-    onBlur: useMergedCallbacks((_d = child === null || child === void 0 ? void 0 : child.props) === null || _d === void 0 ? void 0 : _d.onBlur, onLeaveTrigger)
-  }; // If the target prop is not provided, attach targetRef to the trigger element's ref prop
+  state.content.onPointerEnter = react_utilities_1.useMergedEventCallbacks(state.content.onPointerEnter, clearDelayTimeout);
+  state.content.onPointerLeave = react_utilities_1.useMergedEventCallbacks(state.content.onPointerLeave, onLeaveTrigger);
+  const child = React.isValidElement(children) ? react_utilities_1.getTriggerChild(children) : undefined;
+  const triggerAriaProps = {};
 
-  const childWithRef = child;
-  const childTargetRef = react_utilities_1.useMergedRefs(childWithRef === null || childWithRef === void 0 ? void 0 : childWithRef.ref, targetRef);
+  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 if (!isServerSideRender) {
+      triggerAriaProps['aria-labelledby'] = state.content.id; // Always render the tooltip even if hidden, so that aria-labelledby refers to a valid element
 
-  if (popperOptions.target === undefined) {
-    triggerProps.ref = childTargetRef;
-  }
+      state.shouldRenderTooltip = true;
+    }
+  } else if (relationship === 'description') {
+    if (!isServerSideRender) {
+      triggerAriaProps['aria-describedby'] = state.content.id; // Always render the tooltip even if hidden, so that aria-describedby refers to a valid element
 
-  if (state.triggerAriaAttribute === 'label') {
-    // aria-label only works if the content is a string. Otherwise, need to use labelledby.
-    if (typeof state.content === 'string') {
-      triggerProps['aria-label'] = state.content;
-    } else {
-      state.triggerAriaAttribute = 'labelledby';
+      state.shouldRenderTooltip = true;
     }
   }
 
-  if (state.triggerAriaAttribute === 'labelledby' && !isServerSideRender) {
-    triggerProps['aria-labelledby'] = state.root.id; // Always render the tooltip even if hidden, so that aria-labelledby refers to a valid element
+  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.shouldRenderTooltip = true;
-  } else if (state.triggerAriaAttribute === 'describedby' && !isServerSideRender) {
-    triggerProps['aria-describedby'] = state.root.id;
-    state.shouldRenderTooltip = true;
-  } // Apply the trigger props to the child, either by calling the render function, or cloning with the new props
-
-
-  state.root.children = react_utilities_1.applyTriggerPropsToChildren(state.root.children, triggerProps);
+  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: popperOptions.target === undefined ? childTargetRef : child === null || child === void 0 ? void 0 : child.ref,
+    onPointerEnter: react_utilities_1.useMergedEventCallbacks((_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.onPointerEnter, onEnterTrigger),
+    onPointerLeave: react_utilities_1.useMergedEventCallbacks((_b = child === null || child === void 0 ? void 0 : child.props) === null || _b === void 0 ? void 0 : _b.onPointerLeave, onLeaveTrigger),
+    onFocus: react_utilities_1.useMergedEventCallbacks((_c = child === null || child === void 0 ? void 0 : child.props) === null || _c === void 0 ? void 0 : _c.onFocus, onEnterTrigger),
+    onBlur: react_utilities_1.useMergedEventCallbacks((_d = child === null || child === void 0 ? void 0 : child.props) === null || _d === void 0 ? void 0 : _d.onBlur, onLeaveTrigger)
+  });
   return state;
 };
 
-exports.useTooltip = useTooltip;
-/**
- * Combine up to two event callbacks into a single function that calls them in order
- */
-
-const useMergedCallbacks = (callback1, callback2) => {
-  return React.useCallback(ev => {
-    callback1 === null || callback1 === void 0 ? void 0 : callback1(ev);
-    callback2 === null || callback2 === void 0 ? void 0 : callback2(ev);
-  }, [callback1, callback2]);
-};
+exports.useTooltip_unstable = useTooltip_unstable;
 //# sourceMappingURL=useTooltip.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Tooltip/useTooltip.tsx"],"names":[],"mappings":"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","sourceRoot":""}
+{"version":3,"sources":["components/Tooltip/useTooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { mergeArrowOffset, resolvePositioningShorthand, usePopper } from '@fluentui/react-positioning';\nimport { TooltipContext, useFluent } from '@fluentui/react-shared-contexts';\nimport {\n  applyTriggerPropsToChildren,\n  resolveShorthand,\n  useControllableState,\n  useMergedEventCallbacks,\n  useId,\n  useIsomorphicLayoutEffect,\n  useIsSSR,\n  useMergedRefs,\n  useTimeout,\n  getTriggerChild,\n} from '@fluentui/react-utilities';\nimport type { TooltipProps, TooltipState, TooltipTriggerProps } from './Tooltip.types';\nimport { arrowHeight, tooltipBorderRadius } from './private/constants';\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 = React.useContext(TooltipContext);\n  const isServerSideRender = useIsSSR();\n  const { targetDocument } = useFluent();\n  const [setDelayTimeout, clearDelayTimeout] = useTimeout();\n\n  const {\n    appearance,\n    children,\n    content,\n    withArrow,\n    positioning,\n    onVisibleChange,\n    relationship,\n    showDelay = 250,\n    hideDelay = 250,\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\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 popperOptions = {\n    enabled: state.visible,\n    arrowPadding: 2 * tooltipBorderRadius,\n    position: 'above' as const,\n    align: 'center' as const,\n    offset: [0, 4] as [number, number],\n    ...resolvePositioningShorthand(state.positioning),\n  };\n\n  if (state.withArrow) {\n    popperOptions.offset = mergeArrowOffset(popperOptions.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  } = usePopper(popperOptions);\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' || ev.key === 'Esc') {\n          thisTooltip.hide();\n        }\n      };\n\n      targetDocument?.addEventListener('keydown', onDocumentKeyDown);\n\n      return () => {\n        if (context.visibleTooltip === thisTooltip) {\n          context.visibleTooltip = undefined;\n        }\n\n        targetDocument?.removeEventListener('keydown', onDocumentKeyDown);\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 pointer enters the tooltip, and restart it when the mouse leaves.\n  // This keeps the tooltip visible when the pointer is moved over it.\n  state.content.onPointerEnter = useMergedEventCallbacks(state.content.onPointerEnter, clearDelayTimeout);\n  state.content.onPointerLeave = useMergedEventCallbacks(state.content.onPointerLeave, onLeaveTrigger);\n\n  const child = React.isValidElement(children) ? getTriggerChild(children) : undefined;\n\n  const triggerAriaProps: Pick<TooltipTriggerProps, '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 if (!isServerSideRender) {\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    if (!isServerSideRender) {\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\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<TooltipTriggerProps>(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: popperOptions.target === undefined ? childTargetRef : child?.ref,\n    onPointerEnter: useMergedEventCallbacks(child?.props?.onPointerEnter, onEnterTrigger),\n    onPointerLeave: useMergedEventCallbacks(child?.props?.onPointerLeave, onLeaveTrigger),\n    onFocus: useMergedEventCallbacks(child?.props?.onFocus, onEnterTrigger),\n    onBlur: useMergedEventCallbacks(child?.props?.onBlur, onLeaveTrigger),\n  });\n\n  return state;\n};\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/Tooltip/useTooltipStyles.d.ts

@@ -3,4 +3,4 @@ export declare const tooltipClassName = "fui-Tooltip";
 /**
  * Apply styling to the Tooltip slots based on the state
  */
-export declare const useTooltipStyles: (state: TooltipState) => TooltipState;
+export declare const useTooltipStyles_unstable: (state: TooltipState) => TooltipState;

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

@@ -3,24 +3,25 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useTooltipStyles = exports.tooltipClassName = void 0;
+exports.useTooltipStyles_unstable = exports.tooltipClassName = void 0;
 
-const react_make_styles_1 = /*#__PURE__*/require("@fluentui/react-make-styles");
+const react_1 = /*#__PURE__*/require("@griffel/react");
 
 const react_positioning_1 = /*#__PURE__*/require("@fluentui/react-positioning");
 
+const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
+
+const constants_1 = /*#__PURE__*/require("./private/constants");
+
 exports.tooltipClassName = 'fui-Tooltip';
 /**
  * Styles for the tooltip
  */
 
-const useStyles = /*#__PURE__*/react_make_styles_1.__styles({
+const useStyles = /*#__PURE__*/react_1.__styles({
   "root": {
     "mc9l5x": "fjseox",
-    "z8tnut": "f1sbtcvk",
-    "z189sj": ["f11qrl6u", "fjlbh76"],
-    "Byoj8tv": "fy7v416",
-    "uwmqm3": ["fjlbh76", "f11qrl6u"],
+    "B7ck84d": "f1ewtqcl",
     "B2u0y6b": "f132xexn",
     "Bceei9c": "f158kwzp",
     "Bahqtrf": "fk6fouc",
@@ -30,6 +31,22 @@ const useStyles = /*#__PURE__*/react_make_styles_1.__styles({
     "Beyfa6y": ["f16jpd5f", "f1aa9q02"],
     "B7oj6ja": ["f1jar5jt", "fyu767a"],
     "Btl43ni": ["fyu767a", "f1jar5jt"],
+    "B4j52fo": "f5ogflp",
+    "Bekrc4i": ["f1hqa2wf", "finvdd3"],
+    "Bn0qgzm": "f1f09k3d",
+    "ibv6hh": ["finvdd3", "f1hqa2wf"],
+    "icvyot": "fzkkow9",
+    "vrafjx": ["fcdblym", "fjik90z"],
+    "oivjwe": "fg706s2",
+    "wvpqe5": ["fjik90z", "fcdblym"],
+    "g2u3we": "fghlq4f",
+    "h3c5rm": ["f1gn591s", "fjscplz"],
+    "B9xav0g": "fb073pr",
+    "zhjwy3": ["fjscplz", "f1gn591s"],
+    "z8tnut": "f10ra9hq",
+    "z189sj": ["fd9xhir", "f1jlaasf"],
+    "Byoj8tv": "f1d7kygh",
+    "uwmqm3": ["f1jlaasf", "fd9xhir"],
     "De3pzq": "fxugw4r",
     "sj55zd": "f19n0e5",
     "Bhu2qc9": "fxeb0a7"
@@ -46,48 +63,46 @@ const useStyles = /*#__PURE__*/react_make_styles_1.__styles({
     "De3pzq": "f1u2r49w",
     "Bcdw1i0": "fd7fpy0",
     "Bj3rh1h": "f1bsuimh",
-    "Bubjx69": "f9ikmtg",
-    "a9b677": "fpkirms",
+    "a9b677": "f1ekdpwm",
+    "Bqenvij": "f83vc9z",
     "rurcny": "fuzzvh5",
-    "px8gyy": ["f5bg3dr", "f1rfdd74"],
-    "B5c9fhp": ["fijcjxk", "f11y671q"],
-    "Bhe99jt": ["f1vtdej5", "f7y375m"],
-    "B2r1szc": ["f7y375m", "f1vtdej5"],
+    "Bex5imi": "fkk33zh",
     "xx9plb": "fxf9f1y",
+    "Bmqnesq": "f170vdtw",
     "Bdn98qo": "f103af6e",
     "Bbc2r3f": "f15umuo5",
     "B1dvbpk": "f3wpjpt",
-    "Bex5imi": "fkk33zh",
+    "D4ky5z": "f1k3tce7",
+    "cqycoz": "f1dkdgqi",
+    "I89eb": "f5ghsz",
+    "k1i1uq": "fyqop9u",
+    "Epwjcz": "f1m5ya7j",
+    "Bp1vogq": "f3sp63x",
+    "px8gyy": ["f5bg3dr", "f1rfdd74"],
     "h6z6rw": "fzd2j21",
-    "Iykf4b": ["feexxpo", "f7s5fvx"],
-    "F42hee": ["f1jq8eg5", "f12n7c5j"],
-    "Blxsnla": ["f1wv7y6t", "fi4qyh6"],
-    "t2scew": "fcvru7r",
-    "Emsed9": "f7ybgnc",
-    "E11wbp": "f16xtfle",
-    "hl6cv3": "fotnskf",
+    "hl6cv3": "f1773hnp",
     "Bh2vraf": "f1n8855c",
-    "yayu3t": "fwwuk3n",
+    "yayu3t": "f1v7783n",
     "wedwtw": "fsw6im5",
-    "rhl9o9": "ftghsr9",
+    "rhl9o9": "fh2hsk5",
     "Bu8t5uz": "f159pzir",
-    "B6q6orb": "fwghsev",
+    "B6q6orb": "f11yvu4",
     "Bwwlvwl": "fm1ycve"
   }
 }, {
-  "d": [".fjseox{display:none;}", ".f1sbtcvk{padding-top:5px;}", ".f11qrl6u{padding-right:12px;}", ".fjlbh76{padding-left:12px;}", ".fy7v416{padding-bottom:7px;}", ".f132xexn{max-width:240px;}", ".f158kwzp{cursor:default;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}", ".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".fxeb0a7{-webkit-filter:drop-shadow(0 0 2px var(--colorNeutralShadowAmbient)) drop-shadow(0 4px 8px var(--colorNeutralShadowKey));filter:drop-shadow(0 0 2px var(--colorNeutralShadowAmbient)) drop-shadow(0 4px 8px var(--colorNeutralShadowKey));}", ".ftgm304{display:block;}", ".f5pduvr{background-color:var(--colorNeutralBackgroundInverted);}", ".fqpbvvt{color:var(--colorNeutralForegroundInverted);}", ".f1euv43f{position:absolute;}", ".f1u2r49w{background-color:inherit;}", ".fd7fpy0{visibility:hidden;}", ".f1bsuimh{z-index:-1;}", ".f9ikmtg{aspect-ratio:1;}", ".fpkirms{width:8.485px;}", ".fuzzvh5:before{content:\"\";}", ".f5bg3dr:before{border-bottom-right-radius:var(--borderRadiusSmall);}", ".f1rfdd74:before{border-bottom-left-radius:var(--borderRadiusSmall);}", ".fijcjxk:before{border-bottom-left-radius:4px;}", ".f11y671q:before{border-bottom-right-radius:4px;}", ".f1vtdej5:before{border-top-right-radius:4px;}", ".f7y375m:before{border-top-left-radius:4px;}", ".fxf9f1y:before{position:absolute;}", ".f103af6e:before{width:inherit;}", ".f15umuo5:before{height:inherit;}", ".f3wpjpt:before{background-color:inherit;}", ".fkk33zh:before{visibility:visible;}", ".fzd2j21:before{-webkit-transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);-moz-transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);-ms-transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);}", "[data-popper-placement] .feexxpo:before{border-right-width:1px;}", "[data-popper-placement] .f7s5fvx:before{border-left-width:1px;}", "[data-popper-placement] .f1jq8eg5:before{border-right-style:solid;}", "[data-popper-placement] .f12n7c5j:before{border-left-style:solid;}", "[data-popper-placement] .f1wv7y6t:before{border-right-color:transparent;}", "[data-popper-placement] .fi4qyh6:before{border-left-color:transparent;}", "[data-popper-placement] .fcvru7r:before{border-bottom-width:1px;}", "[data-popper-placement] .f7ybgnc:before{border-bottom-style:solid;}", "[data-popper-placement] .f16xtfle:before{border-bottom-color:transparent;}", "[data-popper-placement^=\"top\"] .fotnskf{bottom:0;}", "[data-popper-placement^=\"top\"] .f1n8855c{--angle:0;}", "[data-popper-placement^=\"right\"] .fwwuk3n{left:0;}", "[data-popper-placement^=\"right\"] .fsw6im5{--angle:90deg;}", "[data-popper-placement^=\"bottom\"] .ftghsr9{top:0;}", "[data-popper-placement^=\"bottom\"] .f159pzir{--angle:180deg;}", "[data-popper-placement^=\"left\"] .fwghsev{right:0;}", "[data-popper-placement^=\"left\"] .fm1ycve{--angle:270deg;}"]
+  "d": [".fjseox{display:none;}", ".f1ewtqcl{box-sizing:border-box;}", ".f132xexn{max-width:240px;}", ".f158kwzp{cursor:default;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}", ".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}", ".f5ogflp{border-top-width:1px;}", ".f1hqa2wf{border-right-width:1px;}", ".finvdd3{border-left-width:1px;}", ".f1f09k3d{border-bottom-width:1px;}", ".fzkkow9{border-top-style:solid;}", ".fcdblym{border-right-style:solid;}", ".fjik90z{border-left-style:solid;}", ".fg706s2{border-bottom-style:solid;}", ".fghlq4f{border-top-color:var(--colorTransparentStroke);}", ".f1gn591s{border-right-color:var(--colorTransparentStroke);}", ".fjscplz{border-left-color:var(--colorTransparentStroke);}", ".fb073pr{border-bottom-color:var(--colorTransparentStroke);}", ".f10ra9hq{padding-top:4px;}", ".fd9xhir{padding-right:11px;}", ".f1jlaasf{padding-left:11px;}", ".f1d7kygh{padding-bottom:6px;}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".fxeb0a7{-webkit-filter:drop-shadow(0 0 2px var(--colorNeutralShadowAmbient)) drop-shadow(0 4px 8px var(--colorNeutralShadowKey));filter:drop-shadow(0 0 2px var(--colorNeutralShadowAmbient)) drop-shadow(0 4px 8px var(--colorNeutralShadowKey));}", ".ftgm304{display:block;}", ".f5pduvr{background-color:var(--colorNeutralBackgroundInverted);}", ".fqpbvvt{color:var(--colorNeutralForegroundInverted);}", ".f1euv43f{position:absolute;}", ".f1u2r49w{background-color:inherit;}", ".fd7fpy0{visibility:hidden;}", ".f1bsuimh{z-index:-1;}", ".f1ekdpwm{width:8.484px;}", ".f83vc9z{height:8.484px;}", ".fuzzvh5:before{content:\"\";}", ".fkk33zh:before{visibility:visible;}", ".fxf9f1y:before{position:absolute;}", ".f170vdtw:before{box-sizing:border-box;}", ".f103af6e:before{width:inherit;}", ".f15umuo5:before{height:inherit;}", ".f3wpjpt:before{background-color:inherit;}", ".f1k3tce7:before{border-right-width:1px;}", ".f1dkdgqi:before{border-right-style:solid;}", ".f5ghsz:before{border-right-color:var(--colorTransparentStroke);}", ".fyqop9u:before{border-bottom-width:1px;}", ".f1m5ya7j:before{border-bottom-style:solid;}", ".f3sp63x:before{border-bottom-color:var(--colorTransparentStroke);}", ".f5bg3dr:before{border-bottom-right-radius:var(--borderRadiusSmall);}", ".f1rfdd74:before{border-bottom-left-radius:var(--borderRadiusSmall);}", ".fzd2j21:before{-webkit-transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);-moz-transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);-ms-transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);transform:rotate(var(--angle)) translate(0, 50%) rotate(45deg);}", "[data-popper-placement^=\"top\"] .f1773hnp{bottom:-1px;}", "[data-popper-placement^=\"top\"] .f1n8855c{--angle:0;}", "[data-popper-placement^=\"right\"] .f1v7783n{left:-1px;}", "[data-popper-placement^=\"right\"] .fsw6im5{--angle:90deg;}", "[data-popper-placement^=\"bottom\"] .fh2hsk5{top:-1px;}", "[data-popper-placement^=\"bottom\"] .f159pzir{--angle:180deg;}", "[data-popper-placement^=\"left\"] .f11yvu4{right:-1px;}", "[data-popper-placement^=\"left\"] .fm1ycve{--angle:270deg;}"]
 });
 /**
  * Apply styling to the Tooltip slots based on the state
  */
 
 
-const useTooltipStyles = state => {
+const useTooltipStyles_unstable = state => {
   const styles = useStyles();
-  state.root.className = react_make_styles_1.mergeClasses(exports.tooltipClassName, styles.root, state.appearance === 'inverted' && styles.inverted, state.visible && styles.visible, state.root.className);
+  state.content.className = react_1.mergeClasses(exports.tooltipClassName, styles.root, state.appearance === 'inverted' && styles.inverted, state.visible && styles.visible, state.content.className);
   state.arrowClassName = styles.arrow;
   return state;
 };
 
-exports.useTooltipStyles = useTooltipStyles;
+exports.useTooltipStyles_unstable = useTooltipStyles_unstable;
 //# sourceMappingURL=useTooltipStyles.js.map