@fluentui/react-tooltip 0.0.0-nightly-20220509-0421.1 → 0.0.0-nightly-20220512-0418.1

package/CHANGELOG.json

@@ -2,9 +2,9 @@
   "name": "@fluentui/react-tooltip",
   "entries": [
     {
-      "date": "Mon, 09 May 2022 04:32:14 GMT",
-      "tag": "@fluentui/react-tooltip_v0.0.0-nightly-20220509-0421.1",
-      "version": "0.0.0-nightly-20220509-0421.1",
+      "date": "Thu, 12 May 2022 04:32:34 GMT",
+      "tag": "@fluentui/react-tooltip_v0.0.0-nightly-20220512-0418.1",
+      "version": "0.0.0-nightly-20220512-0418.1",
       "comments": {
         "prerelease": [
           {
@@ -13,41 +13,47 @@
             "commit": "not available",
             "comment": "Release nightly v9"
           },
+          {
+            "author": "Humberto.Morimoto@microsoft.com",
+            "package": "@fluentui/react-tooltip",
+            "commit": "13543c30b0a05b61cb8d75c804d9b2aee45a8ae5",
+            "comment": "Removing TooltipCommons type."
+          },
           {
             "author": "beachball",
             "package": "@fluentui/react-tooltip",
-            "comment": "Bump @fluentui/react-portal to v0.0.0-nightly-20220509-0421.1",
-            "commit": "bfa631b1a1c5b024e734a24fb8d3f53e51f97f75"
+            "comment": "Bump @fluentui/react-portal to v0.0.0-nightly-20220512-0418.1",
+            "commit": "ed0dd6a9e40d9cfe7e3e822d726d109c935c8d42"
           },
           {
             "author": "beachball",
             "package": "@fluentui/react-tooltip",
-            "comment": "Bump @fluentui/react-positioning to v0.0.0-nightly-20220509-0421.1",
-            "commit": "bfa631b1a1c5b024e734a24fb8d3f53e51f97f75"
+            "comment": "Bump @fluentui/react-positioning to v0.0.0-nightly-20220512-0418.1",
+            "commit": "ed0dd6a9e40d9cfe7e3e822d726d109c935c8d42"
           },
           {
             "author": "beachball",
             "package": "@fluentui/react-tooltip",
-            "comment": "Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20220509-0421.1",
-            "commit": "bfa631b1a1c5b024e734a24fb8d3f53e51f97f75"
+            "comment": "Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20220512-0418.1",
+            "commit": "ed0dd6a9e40d9cfe7e3e822d726d109c935c8d42"
           },
           {
             "author": "beachball",
             "package": "@fluentui/react-tooltip",
-            "comment": "Bump @fluentui/react-theme to v0.0.0-nightly-20220509-0421.1",
-            "commit": "bfa631b1a1c5b024e734a24fb8d3f53e51f97f75"
+            "comment": "Bump @fluentui/react-theme to v0.0.0-nightly-20220512-0418.1",
+            "commit": "ed0dd6a9e40d9cfe7e3e822d726d109c935c8d42"
           },
           {
             "author": "beachball",
             "package": "@fluentui/react-tooltip",
-            "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20220509-0421.1",
-            "commit": "bfa631b1a1c5b024e734a24fb8d3f53e51f97f75"
+            "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20220512-0418.1",
+            "commit": "ed0dd6a9e40d9cfe7e3e822d726d109c935c8d42"
           },
           {
             "author": "beachball",
             "package": "@fluentui/react-tooltip",
-            "comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20220509-0421.1",
-            "commit": "bfa631b1a1c5b024e734a24fb8d3f53e51f97f75"
+            "comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20220512-0418.1",
+            "commit": "ed0dd6a9e40d9cfe7e3e822d726d109c935c8d42"
           }
         ]
       }

package/CHANGELOG.md

@@ -1,23 +1,24 @@
 # Change Log - @fluentui/react-tooltip
 
-This log was last generated on Mon, 09 May 2022 04:32:14 GMT and should not be manually modified.
+This log was last generated on Thu, 12 May 2022 04:32:34 GMT and should not be manually modified.
 
 <!-- Start content -->
 
-## [0.0.0-nightly-20220509-0421.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-tooltip_v0.0.0-nightly-20220509-0421.1)
+## [0.0.0-nightly-20220512-0418.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-tooltip_v0.0.0-nightly-20220512-0418.1)
 
-Mon, 09 May 2022 04:32:14 GMT 
-[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tooltip_v9.0.0-rc.9..@fluentui/react-tooltip_v0.0.0-nightly-20220509-0421.1)
+Thu, 12 May 2022 04:32:34 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tooltip_v9.0.0-rc.9..@fluentui/react-tooltip_v0.0.0-nightly-20220512-0418.1)
 
 ### Changes
 
 - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/not available) by email not defined)
-- Bump @fluentui/react-portal to v0.0.0-nightly-20220509-0421.1 ([commit](https://github.com/microsoft/fluentui/commit/bfa631b1a1c5b024e734a24fb8d3f53e51f97f75) by beachball)
-- Bump @fluentui/react-positioning to v0.0.0-nightly-20220509-0421.1 ([commit](https://github.com/microsoft/fluentui/commit/bfa631b1a1c5b024e734a24fb8d3f53e51f97f75) by beachball)
-- Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20220509-0421.1 ([commit](https://github.com/microsoft/fluentui/commit/bfa631b1a1c5b024e734a24fb8d3f53e51f97f75) by beachball)
-- Bump @fluentui/react-theme to v0.0.0-nightly-20220509-0421.1 ([commit](https://github.com/microsoft/fluentui/commit/bfa631b1a1c5b024e734a24fb8d3f53e51f97f75) by beachball)
-- Bump @fluentui/react-utilities to v0.0.0-nightly-20220509-0421.1 ([commit](https://github.com/microsoft/fluentui/commit/bfa631b1a1c5b024e734a24fb8d3f53e51f97f75) by beachball)
-- Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20220509-0421.1 ([commit](https://github.com/microsoft/fluentui/commit/bfa631b1a1c5b024e734a24fb8d3f53e51f97f75) by beachball)
+- Removing TooltipCommons type. ([PR #22953](https://github.com/microsoft/fluentui/pull/22953) by Humberto.Morimoto@microsoft.com)
+- Bump @fluentui/react-portal to v0.0.0-nightly-20220512-0418.1 ([commit](https://github.com/microsoft/fluentui/commit/ed0dd6a9e40d9cfe7e3e822d726d109c935c8d42) by beachball)
+- Bump @fluentui/react-positioning to v0.0.0-nightly-20220512-0418.1 ([commit](https://github.com/microsoft/fluentui/commit/ed0dd6a9e40d9cfe7e3e822d726d109c935c8d42) by beachball)
+- Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20220512-0418.1 ([commit](https://github.com/microsoft/fluentui/commit/ed0dd6a9e40d9cfe7e3e822d726d109c935c8d42) by beachball)
+- Bump @fluentui/react-theme to v0.0.0-nightly-20220512-0418.1 ([commit](https://github.com/microsoft/fluentui/commit/ed0dd6a9e40d9cfe7e3e822d726d109c935c8d42) by beachball)
+- Bump @fluentui/react-utilities to v0.0.0-nightly-20220512-0418.1 ([commit](https://github.com/microsoft/fluentui/commit/ed0dd6a9e40d9cfe7e3e822d726d109c935c8d42) by beachball)
+- Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20220512-0418.1 ([commit](https://github.com/microsoft/fluentui/commit/ed0dd6a9e40d9cfe7e3e822d726d109c935c8d42) by beachball)
 
 ## [9.0.0-rc.9](https://github.com/microsoft/fluentui/tree/@fluentui/react-tooltip_v9.0.0-rc.9)
 

package/dist/index.d.ts

@@ -32,79 +32,75 @@ export declare const tooltipClassName = "fui-Tooltip";
 export declare const tooltipClassNames: SlotClassNames<TooltipSlots>;
 
 /**
- * Properties and state for Tooltip
+ * Properties for Tooltip
  */
-declare type TooltipCommons = Pick<PortalProps, 'mountNode'> & {
-    /**
-     * (Required) Specifies whether this tooltip is acting as the description or label of its trigger element.
-     *
-     * * `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.
-     */
-    relationship: 'label' | 'description' | 'inaccessible';
+export declare type TooltipProps = ComponentProps<TooltipSlots> & Pick<PortalProps, 'mountNode'> & {
     /**
      * 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 normal
+     * @default normal
      */
     appearance?: 'normal' | 'inverted';
     /**
-     * Render an arrow pointing to the target element
+     * The tooltip can have a single JSX child, or a render function that accepts TooltipTriggerProps.
      *
-     * @defaultvalue false
+     * If no child is provided, the tooltip's target must be set with the `positioning` prop, and its
+     * visibility must be controlled with the `visible` prop.
      */
-    withArrow?: boolean;
+    children?: (React_2.ReactElement & {
+        ref?: React_2.Ref<unknown>;
+    }) | ((props: TooltipTriggerProps) => React_2.ReactElement | null) | null;
     /**
-     * Configure the positioning of the tooltip
+     * Delay before the tooltip is hidden, in milliseconds.
      *
-     * @defaultvalue above
+     * @default 250
      */
-    positioning?: PositioningShorthand;
+    hideDelay?: number;
     /**
-     * Control the tooltip's visibility programatically.
-     *
-     * This can be used in conjunction with onVisibleChange to modify the tooltip's show and hide behavior.
+     * Notification when the visibility of the tooltip is changing
+     */
+    onVisibleChange?: (event: React_2.PointerEvent<HTMLElement> | React_2.FocusEvent<HTMLElement> | undefined, data: OnVisibleChangeData) => void;
+    /**
+     * Configure the positioning of the tooltip
      *
-     * If not provided, the visibility will be controlled by the tooltip itself, based on hover and focus events on the
-     * trigger (child) element.
+     * @default above
      */
-    visible?: boolean;
+    positioning?: PositioningShorthand;
     /**
-     * Notification when the visibility of the tooltip is changing
+     * (Required) Specifies whether this tooltip is acting as the description or label of its trigger element.
+     *
+     * * `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.
      */
-    onVisibleChange?: (event: React_2.PointerEvent<HTMLElement> | React_2.FocusEvent<HTMLElement> | undefined, data: OnVisibleChangeData) => void;
+    relationship: 'label' | 'description' | 'inaccessible';
     /**
      * Delay before the tooltip is shown, in milliseconds.
      *
-     * @defaultvalue 250
+     * @default 250
      */
-    showDelay: number;
+    showDelay?: number;
     /**
-     * Delay before the tooltip is hidden, in milliseconds.
+     * Control the tooltip's visibility programatically.
+     *
+     * This can be used in conjunction with onVisibleChange to modify the tooltip's show and hide behavior.
+     *
+     * If not provided, the visibility will be controlled by the tooltip itself, based on hover and focus events on the
+     * trigger (child) element.
      *
-     * @defaultvalue 250
+     * @default false
      */
-    hideDelay: number;
-};
-
-/**
- * Properties for Tooltip
- */
-export declare type TooltipProps = ComponentProps<TooltipSlots> & Partial<Omit<TooltipCommons, 'relationship'>> & Pick<TooltipCommons, 'relationship'> & {
+    visible?: boolean;
     /**
-     * The tooltip can have a single JSX child, or a render function that accepts TooltipTriggerProps.
+     * Render an arrow pointing to the target element
      *
-     * If no child is provided, the tooltip's target must be set with the `positioning` prop, and its
-     * visibility must be controlled with the `visible` prop.
+     * @default false
      */
-    children?: (React_2.ReactElement & {
-        ref?: React_2.Ref<unknown>;
-    }) | ((props: TooltipTriggerProps) => React_2.ReactElement | null) | null;
+    withArrow?: boolean;
 };
 
 /**
@@ -120,7 +116,7 @@ export declare type TooltipSlots = {
 /**
  * State used in rendering Tooltip
  */
-export declare type TooltipState = ComponentState<TooltipSlots> & TooltipCommons & {
+export declare type TooltipState = ComponentState<TooltipSlots> & Pick<TooltipProps, 'mountNode' | 'relationship'> & Required<Pick<TooltipProps, 'appearance' | 'hideDelay' | 'positioning' | 'showDelay' | 'visible' | 'withArrow'>> & {
     children?: React_2.ReactElement | null;
     /**
      * Whether the tooltip should be rendered to the DOM.
@@ -141,7 +137,7 @@ export declare type TooltipState = ComponentState<TooltipSlots> & TooltipCommons
  */
 export declare type TooltipTriggerProps = {
     ref?: React_2.Ref<never>;
-} & Pick<React_2.HTMLAttributes<HTMLElement>, 'onPointerEnter' | 'onPointerLeave' | 'onFocus' | 'onBlur' | 'aria-describedby' | 'aria-labelledby' | 'aria-label'>;
+} & Pick<React_2.HTMLAttributes<HTMLElement>, 'aria-describedby' | 'aria-label' | 'aria-labelledby' | 'onBlur' | 'onFocus' | 'onPointerEnter' | 'onPointerLeave'>;
 
 /**
  * Create the state required to render Tooltip.

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

@@ -12,95 +12,92 @@ export declare type TooltipSlots = {
     content: NonNullable<Slot<'div'>>;
 };
 /**
- * Properties and state for Tooltip
+ * The properties that are added to the trigger of the Tooltip
  */
-declare type TooltipCommons = Pick<PortalProps, 'mountNode'> & {
-    /**
-     * (Required) Specifies whether this tooltip is acting as the description or label of its trigger element.
-     *
-     * * `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.
-     */
-    relationship: 'label' | 'description' | 'inaccessible';
+export declare type TooltipTriggerProps = {
+    ref?: React.Ref<never>;
+} & Pick<React.HTMLAttributes<HTMLElement>, 'aria-describedby' | 'aria-label' | 'aria-labelledby' | 'onBlur' | 'onFocus' | 'onPointerEnter' | 'onPointerLeave'>;
+/**
+ * Data for the Tooltip's onVisibleChange event.
+ */
+export declare type OnVisibleChangeData = {
+    visible: boolean;
+};
+/**
+ * Properties for Tooltip
+ */
+export declare type TooltipProps = ComponentProps<TooltipSlots> & Pick<PortalProps, 'mountNode'> & {
     /**
      * 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 normal
+     * @default normal
      */
     appearance?: 'normal' | 'inverted';
     /**
-     * Render an arrow pointing to the target element
+     * The tooltip can have a single JSX child, or a render function that accepts TooltipTriggerProps.
      *
-     * @defaultvalue false
+     * If no child is provided, the tooltip's target must be set with the `positioning` prop, and its
+     * visibility must be controlled with the `visible` prop.
      */
-    withArrow?: boolean;
+    children?: (React.ReactElement & {
+        ref?: React.Ref<unknown>;
+    }) | ((props: TooltipTriggerProps) => React.ReactElement | null) | null;
     /**
-     * Configure the positioning of the tooltip
+     * Delay before the tooltip is hidden, in milliseconds.
      *
-     * @defaultvalue above
+     * @default 250
      */
-    positioning?: PositioningShorthand;
+    hideDelay?: number;
     /**
-     * Control the tooltip's visibility programatically.
-     *
-     * This can be used in conjunction with onVisibleChange to modify the tooltip's show and hide behavior.
+     * Notification when the visibility of the tooltip is changing
+     */
+    onVisibleChange?: (event: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement> | undefined, data: OnVisibleChangeData) => void;
+    /**
+     * Configure the positioning of the tooltip
      *
-     * If not provided, the visibility will be controlled by the tooltip itself, based on hover and focus events on the
-     * trigger (child) element.
+     * @default above
      */
-    visible?: boolean;
+    positioning?: PositioningShorthand;
     /**
-     * Notification when the visibility of the tooltip is changing
+     * (Required) Specifies whether this tooltip is acting as the description or label of its trigger element.
+     *
+     * * `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.
      */
-    onVisibleChange?: (event: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement> | undefined, data: OnVisibleChangeData) => void;
+    relationship: 'label' | 'description' | 'inaccessible';
     /**
      * Delay before the tooltip is shown, in milliseconds.
      *
-     * @defaultvalue 250
+     * @default 250
      */
-    showDelay: number;
+    showDelay?: number;
     /**
-     * Delay before the tooltip is hidden, in milliseconds.
+     * Control the tooltip's visibility programatically.
      *
-     * @defaultvalue 250
+     * This can be used in conjunction with onVisibleChange to modify the tooltip's show and hide behavior.
+     *
+     * If not provided, the visibility will be controlled by the tooltip itself, based on hover and focus events on the
+     * trigger (child) element.
+     *
+     * @default false
      */
-    hideDelay: number;
-};
-/**
- * The properties that are added to the trigger of the Tooltip
- */
-export declare type TooltipTriggerProps = {
-    ref?: React.Ref<never>;
-} & Pick<React.HTMLAttributes<HTMLElement>, 'onPointerEnter' | 'onPointerLeave' | 'onFocus' | 'onBlur' | 'aria-describedby' | 'aria-labelledby' | 'aria-label'>;
-/**
- * Data for the Tooltip's onVisibleChange event.
- */
-export declare type OnVisibleChangeData = {
-    visible: boolean;
-};
-/**
- * Properties for Tooltip
- */
-export declare type TooltipProps = ComponentProps<TooltipSlots> & Partial<Omit<TooltipCommons, 'relationship'>> & Pick<TooltipCommons, 'relationship'> & {
+    visible?: boolean;
     /**
-     * The tooltip can have a single JSX child, or a render function that accepts TooltipTriggerProps.
+     * Render an arrow pointing to the target element
      *
-     * If no child is provided, the tooltip's target must be set with the `positioning` prop, and its
-     * visibility must be controlled with the `visible` prop.
+     * @default false
      */
-    children?: (React.ReactElement & {
-        ref?: React.Ref<unknown>;
-    }) | ((props: TooltipTriggerProps) => React.ReactElement | null) | null;
+    withArrow?: boolean;
 };
 /**
  * State used in rendering Tooltip
  */
-export declare type TooltipState = ComponentState<TooltipSlots> & TooltipCommons & {
+export declare type TooltipState = ComponentState<TooltipSlots> & Pick<TooltipProps, 'mountNode' | 'relationship'> & Required<Pick<TooltipProps, 'appearance' | 'hideDelay' | 'positioning' | 'showDelay' | 'visible' | 'withArrow'>> & {
     children?: React.ReactElement | null;
     /**
      * Whether the tooltip should be rendered to the DOM.
@@ -115,4 +112,3 @@ export declare type TooltipState = ComponentState<TooltipSlots> & TooltipCommons
      */
     arrowClassName?: string;
 };
-export {};

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

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.types.js","sourceRoot":"../src/","sources":["components/Tooltip/Tooltip.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { PositioningShorthand } from '@fluentui/react-positioning';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { PortalProps } from '@fluentui/react-portal';\n\n/**\n * Slot properties for Tooltip\n */\nexport type TooltipSlots = {\n  /**\n   * The text or JSX content of the tooltip.\n   */\n  content: NonNullable<Slot<'div'>>;\n};\n\n/**\n * Properties and state for Tooltip\n */\ntype TooltipCommons = Pick<PortalProps, 'mountNode'> & {\n  /**\n   * (Required) Specifies whether this tooltip is acting as the description or label of its trigger element.\n   *\n   * * `label` - The tooltip sets the trigger's aria-label or aria-labelledby attribute. This is useful for buttons\n   *    displaying only an icon, for example.\n   * * `description` - The tooltip sets the trigger's aria-description or aria-describedby attribute.\n   * * `inaccessible` - No aria attributes are set on the trigger. This makes the tooltip's content inaccessible to\n   *   screen readers, and should only be used if the tooltip's text is available by some other means.\n   */\n  relationship: 'label' | 'description' | 'inaccessible';\n\n  /**\n   * The tooltip's visual appearance.\n   * * `normal` - Uses the theme's background and text colors.\n   * * `inverted` - Higher contrast variant that uses the theme's inverted colors.\n   *\n   * @defaultvalue normal\n   */\n  appearance?: 'normal' | 'inverted';\n\n  /**\n   * Render an arrow pointing to the target element\n   *\n   * @defaultvalue false\n   */\n  withArrow?: boolean;\n\n  /**\n   * Configure the positioning of the tooltip\n   *\n   * @defaultvalue above\n   */\n  positioning?: PositioningShorthand;\n\n  /**\n   * Control the tooltip's visibility programatically.\n   *\n   * This can be used in conjunction with onVisibleChange to modify the tooltip's show and hide behavior.\n   *\n   * If not provided, the visibility will be controlled by the tooltip itself, based on hover and focus events on the\n   * trigger (child) element.\n   */\n  visible?: boolean;\n\n  /**\n   * Notification when the visibility of the tooltip is changing\n   */\n  onVisibleChange?: (\n    event: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement> | undefined,\n    data: OnVisibleChangeData,\n  ) => void;\n\n  /**\n   * Delay before the tooltip is shown, in milliseconds.\n   *\n   * @defaultvalue 250\n   */\n  showDelay: number;\n\n  /**\n   * Delay before the tooltip is hidden, in milliseconds.\n   *\n   * @defaultvalue 250\n   */\n  hideDelay: number;\n};\n\n/**\n * The properties that are added to the trigger of the Tooltip\n */\nexport type TooltipTriggerProps = {\n  ref?: React.Ref<never>;\n} & Pick<\n  React.HTMLAttributes<HTMLElement>,\n  'onPointerEnter' | 'onPointerLeave' | 'onFocus' | 'onBlur' | 'aria-describedby' | 'aria-labelledby' | 'aria-label'\n>;\n\n/**\n * Data for the Tooltip's onVisibleChange event.\n */\nexport type OnVisibleChangeData = {\n  visible: boolean;\n};\n\n/**\n * Properties for Tooltip\n */\nexport type TooltipProps = ComponentProps<TooltipSlots> &\n  Partial<Omit<TooltipCommons, 'relationship'>> &\n  Pick<TooltipCommons, 'relationship'> & {\n    /**\n     * The tooltip can have a single JSX child, or a render function that accepts TooltipTriggerProps.\n     *\n     * If no child is provided, the tooltip's target must be set with the `positioning` prop, and its\n     * visibility must be controlled with the `visible` prop.\n     */\n    children?:\n      | (React.ReactElement & { ref?: React.Ref<unknown> })\n      | ((props: TooltipTriggerProps) => React.ReactElement | null)\n      | null;\n  };\n\n/**\n * State used in rendering Tooltip\n */\nexport type TooltipState = ComponentState<TooltipSlots> &\n  TooltipCommons & {\n    children?: React.ReactElement | null;\n\n    /**\n     * Whether the tooltip should be rendered to the DOM.\n     */\n    shouldRenderTooltip?: boolean;\n\n    /**\n     * Ref to the arrow element\n     */\n    arrowRef?: React.Ref<HTMLDivElement>;\n\n    /**\n     * CSS class for the arrow element\n     */\n    arrowClassName?: string;\n  };\n"]}
+{"version":3,"file":"Tooltip.types.js","sourceRoot":"../src/","sources":["components/Tooltip/Tooltip.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { PositioningShorthand } from '@fluentui/react-positioning';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { PortalProps } from '@fluentui/react-portal';\n\n/**\n * Slot properties for Tooltip\n */\nexport type TooltipSlots = {\n  /**\n   * The text or JSX content of the tooltip.\n   */\n  content: NonNullable<Slot<'div'>>;\n};\n\n/**\n * The properties that are added to the trigger of the Tooltip\n */\nexport type TooltipTriggerProps = {\n  ref?: React.Ref<never>;\n} & Pick<\n  React.HTMLAttributes<HTMLElement>,\n  'aria-describedby' | 'aria-label' | 'aria-labelledby' | 'onBlur' | 'onFocus' | 'onPointerEnter' | 'onPointerLeave'\n>;\n\n/**\n * Data for the Tooltip's onVisibleChange event.\n */\nexport type OnVisibleChangeData = {\n  visible: boolean;\n};\n\n/**\n * Properties for Tooltip\n */\nexport type TooltipProps = ComponentProps<TooltipSlots> &\n  Pick<PortalProps, 'mountNode'> & {\n    /**\n     * The tooltip's visual appearance.\n     * * `normal` - Uses the theme's background and text colors.\n     * * `inverted` - Higher contrast variant that uses the theme's inverted colors.\n     *\n     * @default normal\n     */\n    appearance?: 'normal' | 'inverted';\n\n    /**\n     * The tooltip can have a single JSX child, or a render function that accepts TooltipTriggerProps.\n     *\n     * If no child is provided, the tooltip's target must be set with the `positioning` prop, and its\n     * visibility must be controlled with the `visible` prop.\n     */\n    children?:\n      | (React.ReactElement & { ref?: React.Ref<unknown> })\n      | ((props: TooltipTriggerProps) => React.ReactElement | null)\n      | null;\n\n    /**\n     * Delay before the tooltip is hidden, in milliseconds.\n     *\n     * @default 250\n     */\n    hideDelay?: number;\n\n    /**\n     * Notification when the visibility of the tooltip is changing\n     */\n    onVisibleChange?: (\n      event: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement> | undefined,\n      data: OnVisibleChangeData,\n    ) => void;\n\n    /**\n     * Configure the positioning of the tooltip\n     *\n     * @default above\n     */\n    positioning?: PositioningShorthand;\n\n    /**\n     * (Required) Specifies whether this tooltip is acting as the description or label of its trigger element.\n     *\n     * * `label` - The tooltip sets the trigger's aria-label or aria-labelledby attribute. This is useful for buttons\n     *    displaying only an icon, for example.\n     * * `description` - The tooltip sets the trigger's aria-description or aria-describedby attribute.\n     * * `inaccessible` - No aria attributes are set on the trigger. This makes the tooltip's content inaccessible to\n     *   screen readers, and should only be used if the tooltip's text is available by some other means.\n     */\n    relationship: 'label' | 'description' | 'inaccessible';\n\n    /**\n     * Delay before the tooltip is shown, in milliseconds.\n     *\n     * @default 250\n     */\n    showDelay?: number;\n\n    /**\n     * Control the tooltip's visibility programatically.\n     *\n     * This can be used in conjunction with onVisibleChange to modify the tooltip's show and hide behavior.\n     *\n     * If not provided, the visibility will be controlled by the tooltip itself, based on hover and focus events on the\n     * trigger (child) element.\n     *\n     * @default false\n     */\n    visible?: boolean;\n\n    /**\n     * Render an arrow pointing to the target element\n     *\n     * @default false\n     */\n    withArrow?: boolean;\n  };\n\n/**\n * State used in rendering Tooltip\n */\nexport type TooltipState = ComponentState<TooltipSlots> &\n  Pick<TooltipProps, 'mountNode' | 'relationship'> &\n  Required<Pick<TooltipProps, 'appearance' | 'hideDelay' | 'positioning' | 'showDelay' | 'visible' | 'withArrow'>> & {\n    children?: React.ReactElement | null;\n\n    /**\n     * Whether the tooltip should be rendered to the DOM.\n     */\n    shouldRenderTooltip?: boolean;\n\n    /**\n     * Ref to the arrow element\n     */\n    arrowRef?: React.Ref<HTMLDivElement>;\n\n    /**\n     * CSS class for the arrow element\n     */\n    arrowClassName?: string;\n  };\n"]}

package/lib/components/Tooltip/useTooltip.js

@@ -22,11 +22,11 @@ export const useTooltip_unstable = props => {
   } = useFluent();
   const [setDelayTimeout, clearDelayTimeout] = useTimeout();
   const {
-    appearance,
+    appearance = 'normal',
     children,
     content,
-    withArrow,
-    positioning,
+    withArrow = false,
+    positioning = 'above',
     onVisibleChange,
     relationship,
     showDelay = 250,

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

@@ -1 +1 @@
-{"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    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 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/"}
+{"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 = '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 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/Tooltip.types.d.ts

@@ -12,95 +12,92 @@ export declare type TooltipSlots = {
     content: NonNullable<Slot<'div'>>;
 };
 /**
- * Properties and state for Tooltip
+ * The properties that are added to the trigger of the Tooltip
  */
-declare type TooltipCommons = Pick<PortalProps, 'mountNode'> & {
-    /**
-     * (Required) Specifies whether this tooltip is acting as the description or label of its trigger element.
-     *
-     * * `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.
-     */
-    relationship: 'label' | 'description' | 'inaccessible';
+export declare type TooltipTriggerProps = {
+    ref?: React.Ref<never>;
+} & Pick<React.HTMLAttributes<HTMLElement>, 'aria-describedby' | 'aria-label' | 'aria-labelledby' | 'onBlur' | 'onFocus' | 'onPointerEnter' | 'onPointerLeave'>;
+/**
+ * Data for the Tooltip's onVisibleChange event.
+ */
+export declare type OnVisibleChangeData = {
+    visible: boolean;
+};
+/**
+ * Properties for Tooltip
+ */
+export declare type TooltipProps = ComponentProps<TooltipSlots> & Pick<PortalProps, 'mountNode'> & {
     /**
      * 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 normal
+     * @default normal
      */
     appearance?: 'normal' | 'inverted';
     /**
-     * Render an arrow pointing to the target element
+     * The tooltip can have a single JSX child, or a render function that accepts TooltipTriggerProps.
      *
-     * @defaultvalue false
+     * If no child is provided, the tooltip's target must be set with the `positioning` prop, and its
+     * visibility must be controlled with the `visible` prop.
      */
-    withArrow?: boolean;
+    children?: (React.ReactElement & {
+        ref?: React.Ref<unknown>;
+    }) | ((props: TooltipTriggerProps) => React.ReactElement | null) | null;
     /**
-     * Configure the positioning of the tooltip
+     * Delay before the tooltip is hidden, in milliseconds.
      *
-     * @defaultvalue above
+     * @default 250
      */
-    positioning?: PositioningShorthand;
+    hideDelay?: number;
     /**
-     * Control the tooltip's visibility programatically.
-     *
-     * This can be used in conjunction with onVisibleChange to modify the tooltip's show and hide behavior.
+     * Notification when the visibility of the tooltip is changing
+     */
+    onVisibleChange?: (event: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement> | undefined, data: OnVisibleChangeData) => void;
+    /**
+     * Configure the positioning of the tooltip
      *
-     * If not provided, the visibility will be controlled by the tooltip itself, based on hover and focus events on the
-     * trigger (child) element.
+     * @default above
      */
-    visible?: boolean;
+    positioning?: PositioningShorthand;
     /**
-     * Notification when the visibility of the tooltip is changing
+     * (Required) Specifies whether this tooltip is acting as the description or label of its trigger element.
+     *
+     * * `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.
      */
-    onVisibleChange?: (event: React.PointerEvent<HTMLElement> | React.FocusEvent<HTMLElement> | undefined, data: OnVisibleChangeData) => void;
+    relationship: 'label' | 'description' | 'inaccessible';
     /**
      * Delay before the tooltip is shown, in milliseconds.
      *
-     * @defaultvalue 250
+     * @default 250
      */
-    showDelay: number;
+    showDelay?: number;
     /**
-     * Delay before the tooltip is hidden, in milliseconds.
+     * Control the tooltip's visibility programatically.
      *
-     * @defaultvalue 250
+     * This can be used in conjunction with onVisibleChange to modify the tooltip's show and hide behavior.
+     *
+     * If not provided, the visibility will be controlled by the tooltip itself, based on hover and focus events on the
+     * trigger (child) element.
+     *
+     * @default false
      */
-    hideDelay: number;
-};
-/**
- * The properties that are added to the trigger of the Tooltip
- */
-export declare type TooltipTriggerProps = {
-    ref?: React.Ref<never>;
-} & Pick<React.HTMLAttributes<HTMLElement>, 'onPointerEnter' | 'onPointerLeave' | 'onFocus' | 'onBlur' | 'aria-describedby' | 'aria-labelledby' | 'aria-label'>;
-/**
- * Data for the Tooltip's onVisibleChange event.
- */
-export declare type OnVisibleChangeData = {
-    visible: boolean;
-};
-/**
- * Properties for Tooltip
- */
-export declare type TooltipProps = ComponentProps<TooltipSlots> & Partial<Omit<TooltipCommons, 'relationship'>> & Pick<TooltipCommons, 'relationship'> & {
+    visible?: boolean;
     /**
-     * The tooltip can have a single JSX child, or a render function that accepts TooltipTriggerProps.
+     * Render an arrow pointing to the target element
      *
-     * If no child is provided, the tooltip's target must be set with the `positioning` prop, and its
-     * visibility must be controlled with the `visible` prop.
+     * @default false
      */
-    children?: (React.ReactElement & {
-        ref?: React.Ref<unknown>;
-    }) | ((props: TooltipTriggerProps) => React.ReactElement | null) | null;
+    withArrow?: boolean;
 };
 /**
  * State used in rendering Tooltip
  */
-export declare type TooltipState = ComponentState<TooltipSlots> & TooltipCommons & {
+export declare type TooltipState = ComponentState<TooltipSlots> & Pick<TooltipProps, 'mountNode' | 'relationship'> & Required<Pick<TooltipProps, 'appearance' | 'hideDelay' | 'positioning' | 'showDelay' | 'visible' | 'withArrow'>> & {
     children?: React.ReactElement | null;
     /**
      * Whether the tooltip should be rendered to the DOM.
@@ -115,4 +112,3 @@ export declare type TooltipState = ComponentState<TooltipSlots> & TooltipCommons
      */
     arrowClassName?: string;
 };
-export {};

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

@@ -34,11 +34,11 @@ const useTooltip_unstable = props => {
   } = react_shared_contexts_1.useFluent();
   const [setDelayTimeout, clearDelayTimeout] = react_utilities_1.useTimeout();
   const {
-    appearance,
+    appearance = 'normal',
     children,
     content,
-    withArrow,
-    positioning,
+    withArrow = false,
+    positioning = 'above',
     onVisibleChange,
     relationship,
     showDelay = 250,

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

@@ -1 +1 @@
-{"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    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 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/"}
+{"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 = '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 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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-tooltip",
-  "version": "0.0.0-nightly-20220509-0421.1",
+  "version": "0.0.0-nightly-20220512-0418.1",
   "description": "React components for building web experiences",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -28,15 +28,15 @@
   "devDependencies": {
     "@fluentui/eslint-plugin": "*",
     "@fluentui/react-conformance": "*",
-    "@fluentui/react-conformance-griffel": "0.0.0-nightly-20220509-0421.1",
+    "@fluentui/react-conformance-griffel": "0.0.0-nightly-20220512-0418.1",
     "@fluentui/scripts": "^1.0.0"
   },
   "dependencies": {
-    "@fluentui/react-portal": "0.0.0-nightly-20220509-0421.1",
-    "@fluentui/react-positioning": "0.0.0-nightly-20220509-0421.1",
-    "@fluentui/react-shared-contexts": "0.0.0-nightly-20220509-0421.1",
-    "@fluentui/react-theme": "0.0.0-nightly-20220509-0421.1",
-    "@fluentui/react-utilities": "0.0.0-nightly-20220509-0421.1",
+    "@fluentui/react-portal": "0.0.0-nightly-20220512-0418.1",
+    "@fluentui/react-positioning": "0.0.0-nightly-20220512-0418.1",
+    "@fluentui/react-shared-contexts": "0.0.0-nightly-20220512-0418.1",
+    "@fluentui/react-theme": "0.0.0-nightly-20220512-0418.1",
+    "@fluentui/react-utilities": "0.0.0-nightly-20220512-0418.1",
     "@griffel/react": "1.0.3",
     "tslib": "^2.1.0"
   },