npm - @fluentui/react-popover - Versions diffs - 9.3.5 → 9.4.0 - Mend

@fluentui/react-popover 9.3.5 → 9.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (70) hide show

package/CHANGELOG.json CHANGED Viewed

@@ -2,7 +2,137 @@
   "name": "@fluentui/react-popover",
   "entries": [
     {
-      "date": "Wed, 21 Dec 2022 10:17:16 GMT",
+      "date": "Mon, 09 Jan 2023 14:31:45 GMT",
+      "tag": "@fluentui/react-popover_v9.4.0",
+      "version": "9.4.0",
+      "comments": {
+        "none": [
+          {
+            "author": "martinhochel@microsoft.com",
+            "package": "@fluentui/react-popover",
+            "commit": "abae9f7a10d544d8d6b530b974fff235cfd2f956",
+            "comment": "chore: introduce more barrel file api within /scripts"
+          }
+        ],
+        "minor": [
+          {
+            "author": "yuanboxue@microsoft.com",
+            "package": "@fluentui/react-popover",
+            "commit": "46dc6befc9db655c2763908d91c7c603f1063af4",
+            "comment": "feat: add new prop unstable_disableAutoFocus on Popover"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-popover",
+            "comment": "Bump @fluentui/react-aria to v9.3.5",
+            "commit": "26f0364b3837056ee8e0df42a7932c298c68290e"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-popover",
+            "comment": "Bump @fluentui/react-context-selector to v9.1.5",
+            "commit": "26f0364b3837056ee8e0df42a7932c298c68290e"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-popover",
+            "comment": "Bump @fluentui/react-portal to v9.1.0",
+            "commit": "26f0364b3837056ee8e0df42a7932c298c68290e"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-popover",
+            "comment": "Bump @fluentui/react-positioning to v9.3.7",
+            "commit": "26f0364b3837056ee8e0df42a7932c298c68290e"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-popover",
+            "comment": "Bump @fluentui/react-tabster to v9.3.6",
+            "commit": "26f0364b3837056ee8e0df42a7932c298c68290e"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-popover",
+            "comment": "Bump @fluentui/react-utilities to v9.4.0",
+            "commit": "26f0364b3837056ee8e0df42a7932c298c68290e"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Wed, 04 Jan 2023 01:40:16 GMT",
+      "tag": "@fluentui/react-popover_v9.3.6",
+      "version": "9.3.6",
+      "comments": {
+        "patch": [
+          {
+            "author": "olfedias@microsoft.com",
+            "package": "@fluentui/react-popover",
+            "commit": "2c38f1e4ae07b2b60df596efe11015a68f166dbf",
+            "comment": "chore: Update Griffel to latest version"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-popover",
+            "comment": "Bump @fluentui/react-aria to v9.3.4",
+            "commit": "3e322d15529451be153e97298873253e21af4082"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-popover",
+            "comment": "Bump @fluentui/react-context-selector to v9.1.4",
+            "commit": "3e322d15529451be153e97298873253e21af4082"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-popover",
+            "comment": "Bump @fluentui/react-portal to v9.0.15",
+            "commit": "3e322d15529451be153e97298873253e21af4082"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-popover",
+            "comment": "Bump @fluentui/react-positioning to v9.3.6",
+            "commit": "3e322d15529451be153e97298873253e21af4082"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-popover",
+            "comment": "Bump @fluentui/react-tabster to v9.3.5",
+            "commit": "3e322d15529451be153e97298873253e21af4082"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-popover",
+            "comment": "Bump @fluentui/react-utilities to v9.3.1",
+            "commit": "3e322d15529451be153e97298873253e21af4082"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-popover",
+            "comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.19",
+            "commit": "3e322d15529451be153e97298873253e21af4082"
+          }
+        ],
+        "none": [
+          {
+            "author": "martinhochel@microsoft.com",
+            "package": "@fluentui/react-popover",
+            "commit": "194b0cf0cc27c1c1233aa945f09b3ad29778d8ca",
+            "comment": "chore(scripts): use for @fluentui/scripts version within all package.json"
+          },
+          {
+            "author": "martinhochel@microsoft.com",
+            "package": "@fluentui/react-popover",
+            "commit": "4ec2b998b294d6d9c3196d3d82893bdd97d0c105",
+            "comment": "chore(scripts): move index.ts to  to follow sub-folder domain packaging"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Wed, 21 Dec 2022 10:20:33 GMT",
       "tag": "@fluentui/react-popover_v9.3.5",
       "version": "9.3.5",
       "comments": {

package/CHANGELOG.md CHANGED Viewed

@@ -1,12 +1,43 @@
 # Change Log - @fluentui/react-popover
-This log was last generated on Wed, 21 Dec 2022 10:17:16 GMT and should not be manually modified.
+This log was last generated on Mon, 09 Jan 2023 14:31:45 GMT and should not be manually modified.
 <!-- Start content -->
+## [9.4.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-popover_v9.4.0)
+Mon, 09 Jan 2023 14:31:45 GMT
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-popover_v9.3.6..@fluentui/react-popover_v9.4.0)
+### Minor changes
+- feat: add new prop unstable_disableAutoFocus on Popover ([PR #26141](https://github.com/microsoft/fluentui/pull/26141) by yuanboxue@microsoft.com)
+- Bump @fluentui/react-aria to v9.3.5 ([PR #26257](https://github.com/microsoft/fluentui/pull/26257) by beachball)
+- Bump @fluentui/react-context-selector to v9.1.5 ([PR #26257](https://github.com/microsoft/fluentui/pull/26257) by beachball)
+- Bump @fluentui/react-portal to v9.1.0 ([PR #26257](https://github.com/microsoft/fluentui/pull/26257) by beachball)
+- Bump @fluentui/react-positioning to v9.3.7 ([PR #26257](https://github.com/microsoft/fluentui/pull/26257) by beachball)
+- Bump @fluentui/react-tabster to v9.3.6 ([PR #26257](https://github.com/microsoft/fluentui/pull/26257) by beachball)
+- Bump @fluentui/react-utilities to v9.4.0 ([PR #26257](https://github.com/microsoft/fluentui/pull/26257) by beachball)
+## [9.3.6](https://github.com/microsoft/fluentui/tree/@fluentui/react-popover_v9.3.6)
+Wed, 04 Jan 2023 01:40:16 GMT
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-popover_v9.3.5..@fluentui/react-popover_v9.3.6)
+### Patches
+- chore: Update Griffel to latest version ([PR #26045](https://github.com/microsoft/fluentui/pull/26045) by olfedias@microsoft.com)
+- Bump @fluentui/react-aria to v9.3.4 ([PR #26114](https://github.com/microsoft/fluentui/pull/26114) by beachball)
+- Bump @fluentui/react-context-selector to v9.1.4 ([PR #26114](https://github.com/microsoft/fluentui/pull/26114) by beachball)
+- Bump @fluentui/react-portal to v9.0.15 ([PR #26114](https://github.com/microsoft/fluentui/pull/26114) by beachball)
+- Bump @fluentui/react-positioning to v9.3.6 ([PR #26114](https://github.com/microsoft/fluentui/pull/26114) by beachball)
+- Bump @fluentui/react-tabster to v9.3.5 ([PR #26114](https://github.com/microsoft/fluentui/pull/26114) by beachball)
+- Bump @fluentui/react-utilities to v9.3.1 ([PR #26114](https://github.com/microsoft/fluentui/pull/26114) by beachball)
+- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.19 ([PR #26114](https://github.com/microsoft/fluentui/pull/26114) by beachball)
 ## [9.3.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-popover_v9.3.5)
-Wed, 21 Dec 2022 10:17:16 GMT
+Wed, 21 Dec 2022 10:20:33 GMT
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-popover_v9.3.4..@fluentui/react-popover_v9.3.5)
 ### Patches

package/dist/index.d.ts CHANGED Viewed

@@ -134,6 +134,13 @@ export declare type PopoverProps = Pick<PortalProps, 'mountNode'> & {
      * @default false
      */
     legacyTrapFocus?: UseModalAttributesOptions['legacyTrapFocus'];
+    /**
+     * By default Popover focuses the first focusable element in PopoverSurface on open.
+     * Specify `disableAutoFocus` to prevent this behavior.
+     *
+     * @default false
+     */
+    unstable_disableAutoFocus?: boolean;
 };
 export declare const PopoverProvider: Provider<PopoverContextValue> & FC<ProviderProps<PopoverContextValue>>;

package/lib/components/Popover/Popover.js CHANGED Viewed

@@ -3,7 +3,6 @@ import { renderPopover_unstable } from './renderPopover';
 /**
  * Wrapper component that manages state for a PopoverTrigger and a PopoverSurface components.
  */
 export const Popover = props => {
   const state = usePopover_unstable(props);
   return renderPopover_unstable(state);

package/lib/components/Popover/Popover.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources":["packages/react-components/react-popover/src/components/Popover/Popover.tsx"],"names":[],"~~mappings":"AACA,~~SAAS~~,~~mBAAT~~,~~QAAoC~~,~~cAApC~~;~~AACA~~,~~SAAS~~,~~sBAAT~~,~~QAAuC~~,~~iBAAvC~~;AAGA~~;;AAEG;;AACH~~,OAAO,~~MAAM~~,OAAO,~~GAA2B~~,KAAK,IAAG;EACrD,~~MAAM~~,KAAK,~~GAAG~~,mBAAmB,~~CAAC~~,~~KAAD~~,~~CAAjC~~;~~EAEA~~,~~OAAO~~,sBAAsB,~~CAAC~~,~~KAAD~~,~~CAA7B~~;~~AACD~~,~~CAJM~~;~~AAMP~~,OAAO,~~CAAC~~,~~WAAR~~,~~GAAsB~~,~~SAAtB~~","sourcesContent":["import * as React from 'react';\nimport { usePopover_unstable } from './usePopover';\nimport { renderPopover_unstable } from './renderPopover';\nimport type { PopoverProps } from './Popover.types';\n\n/*\n Wrapper component that manages state for a PopoverTrigger and a PopoverSurface components.\n */\nexport const Popover: React.FC<PopoverProps> = props => {\n const state = usePopover_unstable(props);\n\n return renderPopover_unstable(state);\n};\n\nPopover.displayName = 'Popover';\n"]~~,"sourceRoot":"../src/"~~}
1	+ {"version":3,"mappings":"AACA,SAASA,mBAAmB,QAAQ,cAAc;AAClD,SAASC,sBAAsB,QAAQ,iBAAiB;AAGxD;;;AAGA,OAAO,MAAMC,OAAO,GAA2BC,KAAK,IAAG;EACrD,MAAMC,KAAK,GAAGJ,mBAAmB,CAACG,KAAK,CAAC;EAExC,OAAOF,sBAAsB,CAACG,KAAK,CAAC;AACtC,CAAC;AAEDF,OAAO,CAACG,WAAW,GAAG,SAAS","names":["usePopover_unstable","renderPopover_unstable","Popover","props","state","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-popover/src/components/Popover/Popover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { usePopover_unstable } from './usePopover';\nimport { renderPopover_unstable } from './renderPopover';\nimport type { PopoverProps } from './Popover.types';\n\n/*\n Wrapper component that manages state for a PopoverTrigger and a PopoverSurface components.\n */\nexport const Popover: React.FC<PopoverProps> = props => {\n const state = usePopover_unstable(props);\n\n return renderPopover_unstable(state);\n};\n\nPopover.displayName = 'Popover';\n"]}

package/lib/components/Popover/Popover.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Popover.types.js","sourceRoot":"../src/","sources":["packages/react-components/react-popover/src/components/Popover/Popover.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type {\n PositioningVirtualElement,\n PositioningShorthand,\n SetVirtualMouseTarget,\n} from '@fluentui/react-positioning';\nimport type { PortalProps } from '@fluentui/react-portal';\nimport type { UseModalAttributesOptions } from '@fluentui/react-tabster';\n\n/*\n Determines popover padding and arrow size\n /\nexport type PopoverSize = 'small' \| 'medium' \| 'large';\n\n/\n Popover Props\n /\nexport type PopoverProps = Pick<PortalProps, 'mountNode'> & {\n /\n A popover can appear styled with brand or inverted.\n * When not specified, the default style is used.\n /\n appearance?: 'brand' \| 'inverted';\n\n /\n Can contain two children including {@link PopoverTrigger} and {@link PopoverSurface}.\n * Alternatively can only contain {@link PopoverSurface} if using a custom `target`.\n /\n children: [JSX.Element, JSX.Element] \| JSX.Element;\n\n /\n Close when scroll outside of it\n \n @default false\n /\n closeOnScroll?: boolean;\n\n /\n Used to set the initial open state of the Popover in uncontrolled mode\n \n @default false\n /\n defaultOpen?: boolean;\n\n /\n Popovers are rendered out of DOM order on `document.body` by default, use this to render the popover in DOM order\n \n @default false\n /\n inline?: boolean;\n\n /\n Sets the delay for closing popover on mouse leave\n /\n mouseLeaveDelay?: number;\n\n /\n Display an arrow pointing to the target.\n \n @default false\n /\n withArrow?: boolean;\n\n /\n Call back when the component requests to change value\n * The `open` value is used as a hint when directly controlling the component\n /\n onOpenChange?: (e: OpenPopoverEvents, data: OnOpenChangeData) => void;\n\n /\n Controls the opening of the Popover\n \n @default false\n /\n open?: boolean;\n\n /\n Flag to open the Popover as a context menu. Disables all other interactions\n \n @default false\n /\n openOnContext?: boolean;\n\n /\n Flag to open the Popover by hovering the trigger\n \n @default false\n /\n openOnHover?: boolean;\n\n /\n Configures the position of the Popover\n /\n positioning?: PositioningShorthand;\n\n /\n Determines popover padding and arrow size\n \n @default medium\n /\n size?: PopoverSize;\n\n /\n Should trap focus\n \n @default false\n /\n trapFocus?: UseModalAttributesOptions['trapFocus'];\n\n /\n Must be used with the `trapFocus` prop\n * Enables older Fluent UI focus trap behavior where the user\n * cannot tab into the window outside of the document. This is now\n * non-standard behavior according to the [HTML dialog spec](https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement/showModal)\n * where the focus trap involves setting outside elements inert.\n \n @default false\n /\n legacyTrapFocus?: UseModalAttributesOptions['legacyTrapFocus'];\n};\n\n/\n Popover State\n /\nexport type PopoverState = Pick<\n PopoverProps,\n \| 'appearance'\n \| 'mountNode'\n \| 'onOpenChange'\n \| 'openOnContext'\n \| 'openOnHover'\n \| 'trapFocus'\n \| 'withArrow'\n \| 'legacyTrapFocus'\n> &\n Required<Pick<PopoverProps, 'inline' \| 'open'>> &\n Pick<PopoverProps, 'children'> & {\n /\n Ref of the pointing arrow\n /\n arrowRef: React.MutableRefObject<HTMLDivElement \| null>;\n\n /\n Ref of the PopoverSurface\n /\n contentRef: React.MutableRefObject<HTMLElement \| null>;\n\n /\n Anchors the popper to the mouse click for context events\n /\n contextTarget: PositioningVirtualElement \| undefined;\n\n popoverSurface: React.ReactElement \| undefined;\n\n popoverTrigger: React.ReactElement \| undefined;\n\n /\n A callback to set the target of the popper to the mouse click for context events\n /\n setContextTarget: SetVirtualMouseTarget;\n\n /\n Callback to open/close the Popover\n /\n setOpen: (e: OpenPopoverEvents, open: boolean) => void;\n\n size: NonNullable<PopoverProps['size']>;\n\n /\n Callback to toggle the open state of the Popover\n /\n toggleOpen: (e: OpenPopoverEvents) => void;\n\n /\n Ref of the PopoverTrigger\n /\n triggerRef: React.MutableRefObject<HTMLElement \| null>;\n };\n\n/\n Data attached to open/close events\n /\nexport type OnOpenChangeData = { open: boolean };\n\n/\n The supported events that will trigger open/close of the menu\n */\nexport type OpenPopoverEvents =\n \| MouseEvent\n \| TouchEvent\n \| React.FocusEvent<HTMLElement>\n \| React.KeyboardEvent<HTMLElement>\n \| React.MouseEvent<HTMLElement>;\n"]}
1	+ {"version":3,"file":"Popover.types.js","sourceRoot":"../src/","sources":["packages/react-components/react-popover/src/components/Popover/Popover.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type {\n PositioningVirtualElement,\n PositioningShorthand,\n SetVirtualMouseTarget,\n} from '@fluentui/react-positioning';\nimport type { PortalProps } from '@fluentui/react-portal';\nimport type { UseModalAttributesOptions } from '@fluentui/react-tabster';\n\n/*\n Determines popover padding and arrow size\n /\nexport type PopoverSize = 'small' \| 'medium' \| 'large';\n\n/\n Popover Props\n /\nexport type PopoverProps = Pick<PortalProps, 'mountNode'> & {\n /\n A popover can appear styled with brand or inverted.\n * When not specified, the default style is used.\n /\n appearance?: 'brand' \| 'inverted';\n\n /\n Can contain two children including {@link PopoverTrigger} and {@link PopoverSurface}.\n * Alternatively can only contain {@link PopoverSurface} if using a custom `target`.\n /\n children: [JSX.Element, JSX.Element] \| JSX.Element;\n\n /\n Close when scroll outside of it\n \n @default false\n /\n closeOnScroll?: boolean;\n\n /\n Used to set the initial open state of the Popover in uncontrolled mode\n \n @default false\n /\n defaultOpen?: boolean;\n\n /\n Popovers are rendered out of DOM order on `document.body` by default, use this to render the popover in DOM order\n \n @default false\n /\n inline?: boolean;\n\n /\n Sets the delay for closing popover on mouse leave\n /\n mouseLeaveDelay?: number;\n\n /\n Display an arrow pointing to the target.\n \n @default false\n /\n withArrow?: boolean;\n\n /\n Call back when the component requests to change value\n * The `open` value is used as a hint when directly controlling the component\n /\n onOpenChange?: (e: OpenPopoverEvents, data: OnOpenChangeData) => void;\n\n /\n Controls the opening of the Popover\n \n @default false\n /\n open?: boolean;\n\n /\n Flag to open the Popover as a context menu. Disables all other interactions\n \n @default false\n /\n openOnContext?: boolean;\n\n /\n Flag to open the Popover by hovering the trigger\n \n @default false\n /\n openOnHover?: boolean;\n\n /\n Configures the position of the Popover\n /\n positioning?: PositioningShorthand;\n\n /\n Determines popover padding and arrow size\n \n @default medium\n /\n size?: PopoverSize;\n\n /\n Should trap focus\n \n @default false\n /\n trapFocus?: UseModalAttributesOptions['trapFocus'];\n\n /\n Must be used with the `trapFocus` prop\n * Enables older Fluent UI focus trap behavior where the user\n * cannot tab into the window outside of the document. This is now\n * non-standard behavior according to the [HTML dialog spec](https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement/showModal)\n * where the focus trap involves setting outside elements inert.\n \n @default false\n /\n legacyTrapFocus?: UseModalAttributesOptions['legacyTrapFocus'];\n\n /\n By default Popover focuses the first focusable element in PopoverSurface on open.\n * Specify `disableAutoFocus` to prevent this behavior.\n \n @default false\n /\n // eslint-disable-next-line @typescript-eslint/naming-convention\n unstable_disableAutoFocus?: boolean;\n};\n\n/\n Popover State\n /\nexport type PopoverState = Pick<\n PopoverProps,\n \| 'appearance'\n \| 'mountNode'\n \| 'onOpenChange'\n \| 'openOnContext'\n \| 'openOnHover'\n \| 'trapFocus'\n \| 'withArrow'\n \| 'legacyTrapFocus'\n> &\n Required<Pick<PopoverProps, 'inline' \| 'open'>> &\n Pick<PopoverProps, 'children'> & {\n /\n Ref of the pointing arrow\n /\n arrowRef: React.MutableRefObject<HTMLDivElement \| null>;\n\n /\n Ref of the PopoverSurface\n /\n contentRef: React.MutableRefObject<HTMLElement \| null>;\n\n /\n Anchors the popper to the mouse click for context events\n /\n contextTarget: PositioningVirtualElement \| undefined;\n\n popoverSurface: React.ReactElement \| undefined;\n\n popoverTrigger: React.ReactElement \| undefined;\n\n /\n A callback to set the target of the popper to the mouse click for context events\n /\n setContextTarget: SetVirtualMouseTarget;\n\n /\n Callback to open/close the Popover\n /\n setOpen: (e: OpenPopoverEvents, open: boolean) => void;\n\n size: NonNullable<PopoverProps['size']>;\n\n /\n Callback to toggle the open state of the Popover\n /\n toggleOpen: (e: OpenPopoverEvents) => void;\n\n /\n Ref of the PopoverTrigger\n /\n triggerRef: React.MutableRefObject<HTMLElement \| null>;\n };\n\n/\n Data attached to open/close events\n /\nexport type OnOpenChangeData = { open: boolean };\n\n/\n The supported events that will trigger open/close of the menu\n */\nexport type OpenPopoverEvents =\n \| MouseEvent\n \| TouchEvent\n \| React.FocusEvent<HTMLElement>\n \| React.KeyboardEvent<HTMLElement>\n \| React.MouseEvent<HTMLElement>;\n"]}

package/lib/components/Popover/renderPopover.js CHANGED Viewed

@@ -3,7 +3,6 @@ import { PopoverContext } from '../../popoverContext';
 /**
  * Render the final JSX of Popover
  */
 export const renderPopover_unstable = state => {
   const {
     appearance,

package/lib/components/Popover/renderPopover.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources":["packages/react-components/react-popover/src/components/Popover/renderPopover.tsx"],"names":[],"~~mappings":"AAAA,OAAO,KAAK,~~KAAZ~~,~~MAAuB,OAAvB~~;~~AACA~~,~~SAAS~~,~~cAAT~~,~~QAA+B~~,~~sBAA/B~~;AAGA~~;;AAEG;;AACH~~,OAAO,~~MAAM~~,sBAAsB,~~GAAI~~,~~KAAD~~,~~IAAwB~~;EAC5D,MAAM;~~IACJ~~,~~UADI~~;~~IAEJ~~,~~QAFI~~;~~IAGJ~~,~~UAHI~~;~~IAIJ~~,~~MAJI~~;~~IAKJ~~,~~SALI~~;~~IAMJ~~,~~IANI~~;~~IAOJ~~,~~aAPI~~;~~IAQJ~~,~~WARI~~;~~IASJ~~,~~OATI~~;~~IAUJ~~,~~IAVI~~;~~IAWJ~~,~~UAXI~~;~~IAYJ~~,~~SAZI~~;~~IAaJ~~,~~UAbI~~;~~IAcJ~~,~~SAdI~~;~~IAeJ~~;~~EAfI~~,~~IAgBF~~,~~KAhBJ~~;~~EAkBA~~,~~oBACE~~,~~KAAA~~,~~CAAA,aAAA,CAAC,~~cAAc,~~CAAC~~,~~QAAhB,EAAwB~~;~~IACtB~~,KAAK,EAAE;~~MACL~~,~~UADK~~;~~MAEL~~,~~QAFK~~;~~MAGL~~,~~UAHK~~;~~MAIL~~,~~MAJK~~;~~MAKL~~,~~SALK~~;~~MAML~~,~~IANK~~;~~MAOL~~,~~aAPK~~;~~MAQL~~,~~WARK~~;~~MASL~~,~~OATK~~;~~MAUL~~,~~UAVK~~;~~MAWL~~,~~UAXK~~;~~MAYL~~,~~IAZK~~;~~MAaL~~,~~SAbK~~;~~MAcL~~,~~eAdK~~;~~MAeL;IAfK;EADe~~,~~CAAxB~~,~~EAmBG,~~KAAK,~~CAAC~~,~~cAnBT~~,~~EAoBG~~,KAAK,~~CAAC~~,~~IAAN~~,~~IAAc~~,KAAK,~~CAAC~~,~~cApBvB~~,~~CADF~~;~~AAwBD~~,~~CA3CM~~","sourcesContent":["import * as React from 'react';\nimport { PopoverContext } from '../../popoverContext';\nimport type { PopoverState } from './Popover.types';\n\n/*\n Render the final JSX of Popover\n */\nexport const renderPopover_unstable = (state: PopoverState) => {\n const {\n appearance,\n arrowRef,\n contentRef,\n inline,\n mountNode,\n open,\n openOnContext,\n openOnHover,\n setOpen,\n size,\n toggleOpen,\n trapFocus,\n triggerRef,\n withArrow,\n legacyTrapFocus,\n } = state;\n\n return (\n <PopoverContext.Provider\n value={{\n appearance,\n arrowRef,\n contentRef,\n inline,\n mountNode,\n open,\n openOnContext,\n openOnHover,\n setOpen,\n toggleOpen,\n triggerRef,\n size,\n trapFocus,\n legacyTrapFocus,\n withArrow,\n }}\n >\n {state.popoverTrigger}\n {state.open && state.popoverSurface}\n </PopoverContext.Provider>\n );\n};\n"]~~,"sourceRoot":"../src/"~~}
1	+ {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,cAAc,QAAQ,sBAAsB;AAGrD;;;AAGA,OAAO,MAAMC,sBAAsB,GAAIC,KAAmB,IAAI;EAC5D,MAAM;IACJC,UAAU;IACVC,QAAQ;IACRC,UAAU;IACVC,MAAM;IACNC,SAAS;IACTC,IAAI;IACJC,aAAa;IACbC,WAAW;IACXC,OAAO;IACPC,IAAI;IACJC,UAAU;IACVC,SAAS;IACTC,UAAU;IACVC,SAAS;IACTC;EAAe,CAChB,GAAGf,KAAK;EAET,oBACEH,oBAACC,cAAc,CAACkB,QAAQ;IACtBC,KAAK,EAAE;MACLhB,UAAU;MACVC,QAAQ;MACRC,UAAU;MACVC,MAAM;MACNC,SAAS;MACTC,IAAI;MACJC,aAAa;MACbC,WAAW;MACXC,OAAO;MACPE,UAAU;MACVE,UAAU;MACVH,IAAI;MACJE,SAAS;MACTG,eAAe;MACfD;;EACD,GAEAd,KAAK,CAACkB,cAAc,EACpBlB,KAAK,CAACM,IAAI,IAAIN,KAAK,CAACmB,cAAc,CACX;AAE9B,CAAC","names":["React","PopoverContext","renderPopover_unstable","state","appearance","arrowRef","contentRef","inline","mountNode","open","openOnContext","openOnHover","setOpen","size","toggleOpen","trapFocus","triggerRef","withArrow","legacyTrapFocus","Provider","value","popoverTrigger","popoverSurface"],"sourceRoot":"../src/","sources":["packages/react-components/react-popover/src/components/Popover/renderPopover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { PopoverContext } from '../../popoverContext';\nimport type { PopoverState } from './Popover.types';\n\n/*\n Render the final JSX of Popover\n */\nexport const renderPopover_unstable = (state: PopoverState) => {\n const {\n appearance,\n arrowRef,\n contentRef,\n inline,\n mountNode,\n open,\n openOnContext,\n openOnHover,\n setOpen,\n size,\n toggleOpen,\n trapFocus,\n triggerRef,\n withArrow,\n legacyTrapFocus,\n } = state;\n\n return (\n <PopoverContext.Provider\n value={{\n appearance,\n arrowRef,\n contentRef,\n inline,\n mountNode,\n open,\n openOnContext,\n openOnHover,\n setOpen,\n toggleOpen,\n triggerRef,\n size,\n trapFocus,\n legacyTrapFocus,\n withArrow,\n }}\n >\n {state.popoverTrigger}\n {state.open && state.popoverSurface}\n </PopoverContext.Provider>\n );\n};\n"]}

package/lib/components/Popover/usePopover.js CHANGED Viewed

@@ -14,10 +14,8 @@ import { popoverSurfaceBorderRadius } from './constants';
  *
  * @param props - props from this instance of Popover
  */
 export const usePopover_unstable = props => {
   var _a;
   const [contextTarget, setContextTarget] = usePositioningMouseTarget();
   const initialState = {
     size: 'medium',
@@ -26,41 +24,33 @@ export const usePopover_unstable = props => {
     ...props
   };
   const children = React.Children.toArray(props.children);
   if (process.env.NODE_ENV !== 'production') {
     if (children.length === 0) {
       // eslint-disable-next-line no-console
       console.warn('Popover must contain at least one child');
     }
     if (children.length > 2) {
       // eslint-disable-next-line no-console
       console.warn('Popover must contain at most two children');
     }
   }
   let popoverTrigger = undefined;
   let popoverSurface = undefined;
   if (children.length === 2) {
     popoverTrigger = children[0];
     popoverSurface = children[1];
   } else if (children.length === 1) {
     popoverSurface = children[0];
   }
   const [open, setOpenState] = useOpenState(initialState);
   const setOpenTimeoutRef = React.useRef(0);
   const setOpen = useEventCallback((e, shouldOpen) => {
     var _a;
     clearTimeout(setOpenTimeoutRef.current);
     if (!(e instanceof Event) && e.persist) {
       // < React 17 still uses pooled synthetic events
       e.persist();
     }
     if (e.type === 'mouseleave') {
       // FIXME leaking Node timeout type
       // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -71,9 +61,9 @@ export const usePopover_unstable = props => {
     } else {
       setOpenState(e, shouldOpen);
     }
-  }); // Clear timeout on unmount
+  });
+  // Clear timeout on unmount
   // Setting state after a component unmounts can cause memory leaks
   React.useEffect(() => {
     return () => {
       clearTimeout(setOpenTimeoutRef.current);
@@ -92,8 +82,8 @@ export const usePopover_unstable = props => {
     callback: ev => setOpen(ev, false),
     refs: [positioningRefs.triggerRef, positioningRefs.contentRef],
     disabled: !open
-  }); // only close on scroll for context, or when closeOnScroll is specified
+  });
+  // only close on scroll for context, or when closeOnScroll is specified
   const closeOnScroll = initialState.openOnContext || initialState.closeOnScroll;
   useOnScrollOutside({
     contains: elementContains,
@@ -107,14 +97,17 @@ export const usePopover_unstable = props => {
   } = useFocusFinders();
   React.useEffect(() => {
     var _a;
+    if (props.unstable_disableAutoFocus) {
+      return;
+    }
     if (open && positioningRefs.contentRef.current) {
       const containerTabIndex = (_a = positioningRefs.contentRef.current.getAttribute('tabIndex')) !== null && _a !== void 0 ? _a : undefined;
       const firstFocusable = isNaN(containerTabIndex) ? findFirstFocusable(positioningRefs.contentRef.current) : positioningRefs.contentRef.current;
       firstFocusable === null || firstFocusable === void 0 ? void 0 : firstFocusable.focus();
     }
-  }, [findFirstFocusable, open, positioningRefs.contentRef]);
-  return { ...initialState,
+  }, [findFirstFocusable, open, positioningRefs.contentRef, props.unstable_disableAutoFocus]);
+  return {
+    ...initialState,
     ...positioningRefs,
     popoverTrigger,
     popoverSurface,
@@ -129,11 +122,9 @@ export const usePopover_unstable = props => {
 /**
  * Creates and manages the Popover open state
  */
 function useOpenState(state) {
   const onOpenChange = useEventCallback((e, data) => {
     var _a;
     return (_a = state.onOpenChange) === null || _a === void 0 ? void 0 : _a.call(state, e, data);
   });
   const [open, setOpenState] = useControllableState({
@@ -147,11 +138,9 @@ function useOpenState(state) {
     if (shouldOpen && e.type === 'contextmenu') {
       setContextTarget(e);
     }
     if (!shouldOpen) {
       setContextTarget(undefined);
     }
     setOpenState(shouldOpen);
     onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(e, {
       open: shouldOpen
@@ -162,8 +151,6 @@ function useOpenState(state) {
 /**
  * Creates and sets the necessary trigger, target and content refs used by Popover
  */
 function usePopoverRefs(state) {
   const positioningOptions = {
     position: 'above',
@@ -171,16 +158,14 @@ function usePopoverRefs(state) {
     arrowPadding: 2 * popoverSurfaceBorderRadius,
     target: state.openOnContext ? state.contextTarget : undefined,
     ...resolvePositioningShorthand(state.positioning)
-  }; // no reason to render arrow when covering the target
+  };
+  // no reason to render arrow when covering the target
   if (positioningOptions.coverTarget) {
     state.withArrow = false;
   }
   if (state.withArrow) {
     positioningOptions.offset = mergeArrowOffset(positioningOptions.offset, arrowHeights[state.size]);
   }
   const {
     targetRef: triggerRef,
     containerRef: contentRef,

package/lib/components/Popover/usePopover.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["packages/react-components/react-popover/src/components/Popover/usePopover.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {\n useControllableState,\n useEventCallback,\n useOnClickOutside,\n useOnScrollOutside,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n usePositioning,\n resolvePositioningShorthand,\n mergeArrowOffset,\n usePositioningMouseTarget,\n} from '@fluentui/react-positioning';\nimport { elementContains } from '@fluentui/react-portal';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { arrowHeights } from '../PopoverSurface/index';\nimport type { OpenPopoverEvents, PopoverProps, PopoverState } from './Popover.types';\nimport { popoverSurfaceBorderRadius } from './constants';\n\n/*\n Create the state required to render Popover.\n \n The returned state can be modified with hooks such as usePopoverStyles,\n * before being passed to renderPopover_unstable.\n \n @param props - props from this instance of Popover\n /\nexport const usePopover_unstable = (props: PopoverProps): PopoverState => {\n const [contextTarget, setContextTarget] = usePositioningMouseTarget();\n const initialState = {\n size: 'medium',\n contextTarget,\n setContextTarget,\n ...props,\n } as const;\n\n const children = React.Children.toArray(props.children) as React.ReactElement[];\n\n if (process.env.NODE_ENV !== 'production') {\n if (children.length === 0) {\n // eslint-disable-next-line no-console\n console.warn('Popover must contain at least one child');\n }\n\n if (children.length > 2) {\n // eslint-disable-next-line no-console\n console.warn('Popover must contain at most two children');\n }\n }\n\n let popoverTrigger: React.ReactElement \| undefined = undefined;\n let popoverSurface: React.ReactElement \| undefined = undefined;\n if (children.length === 2) {\n popoverTrigger = children[0];\n popoverSurface = children[1];\n } else if (children.length === 1) {\n popoverSurface = children[0];\n }\n\n const [open, setOpenState] = useOpenState(initialState);\n\n const setOpenTimeoutRef = React.useRef(0);\n\n const setOpen = useEventCallback((e: OpenPopoverEvents, shouldOpen: boolean) => {\n clearTimeout(setOpenTimeoutRef.current);\n if (!(e instanceof Event) && e.persist) {\n // < React 17 still uses pooled synthetic events\n e.persist();\n }\n\n if (e.type === 'mouseleave') {\n // FIXME leaking Node timeout type\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n setOpenTimeoutRef.current = setTimeout(() => {\n setOpenState(e, shouldOpen);\n }, props.mouseLeaveDelay ?? 500);\n } else {\n setOpenState(e, shouldOpen);\n }\n });\n\n // Clear timeout on unmount\n // Setting state after a component unmounts can cause memory leaks\n React.useEffect(() => {\n return () => {\n clearTimeout(setOpenTimeoutRef.current);\n };\n }, []);\n\n const toggleOpen = React.useCallback<PopoverState['toggleOpen']>(\n e => {\n setOpen(e, !open);\n },\n [setOpen, open],\n );\n\n const positioningRefs = usePopoverRefs(initialState);\n\n const { targetDocument } = useFluent();\n useOnClickOutside({\n contains: elementContains,\n element: targetDocument,\n callback: ev => setOpen(ev, false),\n refs: [positioningRefs.triggerRef, positioningRefs.contentRef],\n disabled: !open,\n });\n\n // only close on scroll for context, or when closeOnScroll is specified\n const closeOnScroll = initialState.openOnContext \|\| initialState.closeOnScroll;\n useOnScrollOutside({\n contains: elementContains,\n element: targetDocument,\n callback: ev => setOpen(ev, false),\n refs: [positioningRefs.triggerRef, positioningRefs.contentRef],\n disabled: !open \|\| !closeOnScroll,\n });\n\n const { findFirstFocusable } = useFocusFinders();\n\n React.useEffect(() => {\n if (open && positioningRefs.contentRef.current) {\n const containerTabIndex = positioningRefs.contentRef.current.getAttribute('tabIndex') ?? undefined;\n const firstFocusable = isNaN(containerTabIndex)\n ? findFirstFocusable(positioningRefs.contentRef.current)\n : positioningRefs.contentRef.current;\n firstFocusable?.focus();\n }\n }, [findFirstFocusable, open, positioningRefs.contentRef]);\n\n return {\n ...initialState,\n ...positioningRefs,\n popoverTrigger,\n popoverSurface,\n open,\n setOpen,\n toggleOpen,\n setContextTarget,\n contextTarget,\n inline: props.inline ?? false,\n };\n};\n\n/\n Creates and manages the Popover open state\n /\nfunction useOpenState(\n state: Pick<PopoverState, 'setContextTarget' \| 'onOpenChange'> & Pick<PopoverProps, 'open' \| 'defaultOpen'>,\n) {\n const onOpenChange: PopoverState['onOpenChange'] = useEventCallback((e, data) => state.onOpenChange?.(e, data));\n\n const [open, setOpenState] = useControllableState({\n state: state.open,\n defaultState: state.defaultOpen,\n initialState: false,\n });\n state.open = open !== undefined ? open : state.open;\n const setContextTarget = state.setContextTarget;\n\n const setOpen = React.useCallback(\n (e: OpenPopoverEvents, shouldOpen: boolean) => {\n if (shouldOpen && e.type === 'contextmenu') {\n setContextTarget(e as React.MouseEvent);\n }\n\n if (!shouldOpen) {\n setContextTarget(undefined);\n }\n\n setOpenState(shouldOpen);\n onOpenChange?.(e, { open: shouldOpen });\n },\n [setOpenState, onOpenChange, setContextTarget],\n );\n\n return [open, setOpen] as const;\n}\n\n/\n Creates and sets the necessary trigger, target and content refs used by Popover\n /\nfunction usePopoverRefs(\n state: Pick<PopoverState, 'size' \| 'contextTarget'> &\n Pick<PopoverProps, 'positioning' \| 'openOnContext' \| 'withArrow'>,\n) {\n const positioningOptions = {\n position: 'above' as const,\n align: 'center' as const,\n arrowPadding: 2 popoverSurfaceBorderRadius,\n target: state.openOnContext ? state.contextTarget : undefined,\n ...resolvePositioningShorthand(state.positioning),\n };\n\n // no reason to render arrow when covering the target\n if (positioningOptions.coverTarget) {\n state.withArrow = false;\n }\n\n if (state.withArrow) {\n positioningOptions.offset = mergeArrowOffset(positioningOptions.offset, arrowHeights[state.size]);\n }\n\n const { targetRef: triggerRef, containerRef: contentRef, arrowRef } = usePositioning(positioningOptions);\n\n return {\n triggerRef,\n contentRef,\n arrowRef,\n } as const;\n}\n"],"sourceRoot":"../src/"}
1	+ {"version":3,"mappings":"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","names":["React","useControllableState","useEventCallback","useOnClickOutside","useOnScrollOutside","useFluent_unstable","useFluent","usePositioning","resolvePositioningShorthand","mergeArrowOffset","usePositioningMouseTarget","elementContains","useFocusFinders","arrowHeights","popoverSurfaceBorderRadius","usePopover_unstable","props","contextTarget","setContextTarget","initialState","size","children","Children","toArray","process","env","NODE_ENV","length","console","warn","popoverTrigger","undefined","popoverSurface","open","setOpenState","useOpenState","setOpenTimeoutRef","useRef","setOpen","e","shouldOpen","clearTimeout","current","Event","persist","type","setTimeout","mouseLeaveDelay","useEffect","toggleOpen","useCallback","positioningRefs","usePopoverRefs","targetDocument","contains","element","callback","ev","refs","triggerRef","contentRef","disabled","closeOnScroll","openOnContext","findFirstFocusable","unstable_disableAutoFocus","containerTabIndex","getAttribute","firstFocusable","isNaN","focus","inline","state","onOpenChange","data","defaultState","defaultOpen","positioningOptions","position","align","arrowPadding","target","positioning","coverTarget","withArrow","offset","targetRef","containerRef","arrowRef"],"sourceRoot":"../src/","sources":["packages/react-components/react-popover/src/components/Popover/usePopover.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n useControllableState,\n useEventCallback,\n useOnClickOutside,\n useOnScrollOutside,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n usePositioning,\n resolvePositioningShorthand,\n mergeArrowOffset,\n usePositioningMouseTarget,\n} from '@fluentui/react-positioning';\nimport { elementContains } from '@fluentui/react-portal';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { arrowHeights } from '../PopoverSurface/index';\nimport type { OpenPopoverEvents, PopoverProps, PopoverState } from './Popover.types';\nimport { popoverSurfaceBorderRadius } from './constants';\n\n/*\n Create the state required to render Popover.\n \n The returned state can be modified with hooks such as usePopoverStyles,\n * before being passed to renderPopover_unstable.\n \n @param props - props from this instance of Popover\n /\nexport const usePopover_unstable = (props: PopoverProps): PopoverState => {\n const [contextTarget, setContextTarget] = usePositioningMouseTarget();\n const initialState = {\n size: 'medium',\n contextTarget,\n setContextTarget,\n ...props,\n } as const;\n\n const children = React.Children.toArray(props.children) as React.ReactElement[];\n\n if (process.env.NODE_ENV !== 'production') {\n if (children.length === 0) {\n // eslint-disable-next-line no-console\n console.warn('Popover must contain at least one child');\n }\n\n if (children.length > 2) {\n // eslint-disable-next-line no-console\n console.warn('Popover must contain at most two children');\n }\n }\n\n let popoverTrigger: React.ReactElement \| undefined = undefined;\n let popoverSurface: React.ReactElement \| undefined = undefined;\n if (children.length === 2) {\n popoverTrigger = children[0];\n popoverSurface = children[1];\n } else if (children.length === 1) {\n popoverSurface = children[0];\n }\n\n const [open, setOpenState] = useOpenState(initialState);\n\n const setOpenTimeoutRef = React.useRef(0);\n\n const setOpen = useEventCallback((e: OpenPopoverEvents, shouldOpen: boolean) => {\n clearTimeout(setOpenTimeoutRef.current);\n if (!(e instanceof Event) && e.persist) {\n // < React 17 still uses pooled synthetic events\n e.persist();\n }\n\n if (e.type === 'mouseleave') {\n // FIXME leaking Node timeout type\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n setOpenTimeoutRef.current = setTimeout(() => {\n setOpenState(e, shouldOpen);\n }, props.mouseLeaveDelay ?? 500);\n } else {\n setOpenState(e, shouldOpen);\n }\n });\n\n // Clear timeout on unmount\n // Setting state after a component unmounts can cause memory leaks\n React.useEffect(() => {\n return () => {\n clearTimeout(setOpenTimeoutRef.current);\n };\n }, []);\n\n const toggleOpen = React.useCallback<PopoverState['toggleOpen']>(\n e => {\n setOpen(e, !open);\n },\n [setOpen, open],\n );\n\n const positioningRefs = usePopoverRefs(initialState);\n\n const { targetDocument } = useFluent();\n useOnClickOutside({\n contains: elementContains,\n element: targetDocument,\n callback: ev => setOpen(ev, false),\n refs: [positioningRefs.triggerRef, positioningRefs.contentRef],\n disabled: !open,\n });\n\n // only close on scroll for context, or when closeOnScroll is specified\n const closeOnScroll = initialState.openOnContext \|\| initialState.closeOnScroll;\n useOnScrollOutside({\n contains: elementContains,\n element: targetDocument,\n callback: ev => setOpen(ev, false),\n refs: [positioningRefs.triggerRef, positioningRefs.contentRef],\n disabled: !open \|\| !closeOnScroll,\n });\n\n const { findFirstFocusable } = useFocusFinders();\n\n React.useEffect(() => {\n if (props.unstable_disableAutoFocus) {\n return;\n }\n\n if (open && positioningRefs.contentRef.current) {\n const containerTabIndex = positioningRefs.contentRef.current.getAttribute('tabIndex') ?? undefined;\n const firstFocusable = isNaN(containerTabIndex)\n ? findFirstFocusable(positioningRefs.contentRef.current)\n : positioningRefs.contentRef.current;\n firstFocusable?.focus();\n }\n }, [findFirstFocusable, open, positioningRefs.contentRef, props.unstable_disableAutoFocus]);\n\n return {\n ...initialState,\n ...positioningRefs,\n popoverTrigger,\n popoverSurface,\n open,\n setOpen,\n toggleOpen,\n setContextTarget,\n contextTarget,\n inline: props.inline ?? false,\n };\n};\n\n/\n Creates and manages the Popover open state\n /\nfunction useOpenState(\n state: Pick<PopoverState, 'setContextTarget' \| 'onOpenChange'> & Pick<PopoverProps, 'open' \| 'defaultOpen'>,\n) {\n const onOpenChange: PopoverState['onOpenChange'] = useEventCallback((e, data) => state.onOpenChange?.(e, data));\n\n const [open, setOpenState] = useControllableState({\n state: state.open,\n defaultState: state.defaultOpen,\n initialState: false,\n });\n state.open = open !== undefined ? open : state.open;\n const setContextTarget = state.setContextTarget;\n\n const setOpen = React.useCallback(\n (e: OpenPopoverEvents, shouldOpen: boolean) => {\n if (shouldOpen && e.type === 'contextmenu') {\n setContextTarget(e as React.MouseEvent);\n }\n\n if (!shouldOpen) {\n setContextTarget(undefined);\n }\n\n setOpenState(shouldOpen);\n onOpenChange?.(e, { open: shouldOpen });\n },\n [setOpenState, onOpenChange, setContextTarget],\n );\n\n return [open, setOpen] as const;\n}\n\n/\n Creates and sets the necessary trigger, target and content refs used by Popover\n /\nfunction usePopoverRefs(\n state: Pick<PopoverState, 'size' \| 'contextTarget'> &\n Pick<PopoverProps, 'positioning' \| 'openOnContext' \| 'withArrow'>,\n) {\n const positioningOptions = {\n position: 'above' as const,\n align: 'center' as const,\n arrowPadding: 2 popoverSurfaceBorderRadius,\n target: state.openOnContext ? state.contextTarget : undefined,\n ...resolvePositioningShorthand(state.positioning),\n };\n\n // no reason to render arrow when covering the target\n if (positioningOptions.coverTarget) {\n state.withArrow = false;\n }\n\n if (state.withArrow) {\n positioningOptions.offset = mergeArrowOffset(positioningOptions.offset, arrowHeights[state.size]);\n }\n\n const { targetRef: triggerRef, containerRef: contentRef, arrowRef } = usePositioning(positioningOptions);\n\n return {\n triggerRef,\n contentRef,\n arrowRef,\n } as const;\n}\n"]}

package/lib/components/PopoverSurface/PopoverSurface.js CHANGED Viewed

@@ -5,7 +5,6 @@ import { usePopoverSurfaceStyles_unstable } from './usePopoverSurfaceStyles';
 /**
  * PopoverSurface component renders react children in a positioned box
  */
 export const PopoverSurface = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = usePopoverSurface_unstable(props, ref);
   usePopoverSurfaceStyles_unstable(state);

package/lib/components/PopoverSurface/PopoverSurface.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources":["packages/react-components/react-popover/src/components/PopoverSurface/PopoverSurface.tsx"],"names":[],"~~mappings":"AAAA,OAAO,KAAK,~~KAAZ~~,~~MAAuB,OAAvB~~;~~AACA~~,~~SAAS~~,~~0BAAT~~,~~QAA2C~~,~~qBAA3C~~;~~AACA~~,~~SAAS~~,~~6BAAT~~,~~QAA8C~~,~~wBAA9C~~;~~AACA~~,~~SAAS~~,~~gCAAT~~,~~QAAiD~~,~~2BAAjD~~;~~AAIA;;AAEG;;AACH~~,OAAO,~~MAAM~~,cAAc,~~gBAA6C~~,KAAK,~~CAAC~~,~~UAAN~~,~~CAAiB,~~CAAC,~~KAAD~~,~~EAAQ~~,~~GAAR~~,~~KAAe~~;EACtG,~~MAAM~~,KAAK,~~GAAG~~,0BAA0B,~~CAAC~~,~~KAAD~~,~~EAAQ~~,~~GAAR~~,~~CAAxC~~;~~EAEA~~,gCAAgC,~~CAAC~~,~~KAAD~~,~~CAAhC~~;~~EACA~~,~~OAAO~~,6BAA6B,~~CAAC~~,~~KAAD~~,~~CAApC~~;~~AACD~~,~~CALuE~~,~~CAAjE~~;~~AAOP~~,cAAc,~~CAAC~~,~~WAAf~~,~~GAA6B~~,~~gBAA7B~~","sourcesContent":["import * as React from 'react';\nimport { usePopoverSurface_unstable } from './usePopoverSurface';\nimport { renderPopoverSurface_unstable } from './renderPopoverSurface';\nimport { usePopoverSurfaceStyles_unstable } from './usePopoverSurfaceStyles';\nimport type { PopoverSurfaceProps } from './PopoverSurface.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/*\n PopoverSurface component renders react children in a positioned box\n */\nexport const PopoverSurface: ForwardRefComponent<PopoverSurfaceProps> = React.forwardRef((props, ref) => {\n const state = usePopoverSurface_unstable(props, ref);\n\n usePopoverSurfaceStyles_unstable(state);\n return renderPopoverSurface_unstable(state);\n});\n\nPopoverSurface.displayName = 'PopoverSurface';\n"]~~,"sourceRoot":"../src/"~~}
1	+ {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,0BAA0B,QAAQ,qBAAqB;AAChE,SAASC,6BAA6B,QAAQ,wBAAwB;AACtE,SAASC,gCAAgC,QAAQ,2BAA2B;AAI5E;;;AAGA,OAAO,MAAMC,cAAc,gBAA6CJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACtG,MAAMC,KAAK,GAAGP,0BAA0B,CAACK,KAAK,EAAEC,GAAG,CAAC;EAEpDJ,gCAAgC,CAACK,KAAK,CAAC;EACvC,OAAON,6BAA6B,CAACM,KAAK,CAAC;AAC7C,CAAC,CAAC;AAEFJ,cAAc,CAACK,WAAW,GAAG,gBAAgB","names":["React","usePopoverSurface_unstable","renderPopoverSurface_unstable","usePopoverSurfaceStyles_unstable","PopoverSurface","forwardRef","props","ref","state","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-popover/src/components/PopoverSurface/PopoverSurface.tsx"],"sourcesContent":["import * as React from 'react';\nimport { usePopoverSurface_unstable } from './usePopoverSurface';\nimport { renderPopoverSurface_unstable } from './renderPopoverSurface';\nimport { usePopoverSurfaceStyles_unstable } from './usePopoverSurfaceStyles';\nimport type { PopoverSurfaceProps } from './PopoverSurface.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/*\n PopoverSurface component renders react children in a positioned box\n */\nexport const PopoverSurface: ForwardRefComponent<PopoverSurfaceProps> = React.forwardRef((props, ref) => {\n const state = usePopoverSurface_unstable(props, ref);\n\n usePopoverSurfaceStyles_unstable(state);\n return renderPopoverSurface_unstable(state);\n});\n\nPopoverSurface.displayName = 'PopoverSurface';\n"]}

package/lib/components/PopoverSurface/renderPopoverSurface.js CHANGED Viewed

@@ -4,22 +4,20 @@ import { getSlots } from '@fluentui/react-utilities';
 /**
  * Render the final JSX of PopoverSurface
  */
 export const renderPopoverSurface_unstable = state => {
   const {
     slots,
     slotProps
   } = getSlots(state);
-  const surface = /*#__PURE__*/React.createElement(slots.root, { ...slotProps.root
+  const surface = /*#__PURE__*/React.createElement(slots.root, {
+    ...slotProps.root
   }, state.withArrow && /*#__PURE__*/React.createElement("div", {
     ref: state.arrowRef,
     className: state.arrowClassName
   }), slotProps.root.children);
   if (state.inline) {
     return surface;
   }
   return /*#__PURE__*/React.createElement(Portal, {
     mountNode: state.mountNode
   }, surface);

package/lib/components/PopoverSurface/renderPopoverSurface.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources":["packages/react-components/react-popover/src/components/PopoverSurface/renderPopoverSurface.tsx"],"names":[],"~~mappings":"AAAA,OAAO,KAAK,~~KAAZ~~,~~MAAuB,OAAvB~~;~~AACA~~,~~SAAS~~,~~MAAT~~,~~QAAuB~~,~~wBAAvB~~;~~AACA~~,~~SAAS~~,~~QAAT~~,~~QAAyB~~,~~2BAAzB~~;AAGA~~;;AAEG;;AACH~~,OAAO,~~MAAM~~,6BAA6B,~~GAAI~~,~~KAAD~~,~~IAA+B~~;EAC1E,MAAM;~~IAAE~~,~~KAAF~~;~~IAAS~~;~~EAAT~~,~~IAAuB~~,QAAQ,~~CAAsB~~,~~KAAtB~~,~~CAArC~~;~~EAEA~~,~~MAAM~~,OAAO,~~gBACX~~,~~KAAA~~,~~CAAA,aAAA,CAAC,~~KAAK,~~CAAC~~,~~IAAP~~,~~EAAW~~,~~EAAA,GAAK,~~SAAS,~~CAAC~~;~~EAAf~~,~~CAAX~~,~~EACG,~~KAAK,~~CAAC~~,~~SAAN~~,~~iBAAmB,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA~~;~~IAAK~~,GAAG,~~EAAE~~,KAAK,~~CAAC~~,~~QAAhB~~;~~IAA0B~~,SAAS,~~EAAE~~,KAAK,~~CAAC~~;~~EAA3C~~,~~CAAA~~,~~CADtB~~,~~EAEG,~~SAAS,~~CAAC~~,~~IAAV~~,~~CAAe~~,~~QAFlB~~,~~CADF;;EAOA~~,~~IAAI~~,KAAK,~~CAAC~~,~~MAAV~~,~~EAAkB~~;IAChB,OAAO~~,OAAP;EACD~~;;~~EAED~~,~~oBAAO~~,~~KAAA~~,~~CAAA~~,~~aAAA~~,~~CAAC~~,~~MAAD~~,~~EAAO~~;~~IAAC~~,~~SAAS~~,~~EAAE~~,~~KAAK~~,CAAC~~;EAAlB~~,~~CAAP~~,~~EAAqC~~,~~OAArC~~,~~CAAP;AACD~~,~~CAfM~~","sourcesContent":["import * as React from 'react';\nimport { Portal } from '@fluentui/react-portal';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { PopoverSurfaceSlots, PopoverSurfaceState } from './PopoverSurface.types';\n\n/*\n Render the final JSX of PopoverSurface\n */\nexport const renderPopoverSurface_unstable = (state: PopoverSurfaceState) => {\n const { slots, slotProps } = getSlots<PopoverSurfaceSlots>(state);\n\n const surface = (\n <slots.root {...slotProps.root}>\n {state.withArrow && <div ref={state.arrowRef} className={state.arrowClassName} />}\n {slotProps.root.children}\n </slots.root>\n );\n\n if (state.inline) {\n return surface;\n }\n\n return <Portal mountNode={state.mountNode}>{surface}</Portal>;\n};\n"]~~,"sourceRoot":"../src/"~~}
1	+ {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,MAAM,QAAQ,wBAAwB;AAC/C,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD;;;AAGA,OAAO,MAAMC,6BAA6B,GAAIC,KAA0B,IAAI;EAC1E,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAsBE,KAAK,CAAC;EAEjE,MAAMG,OAAO,gBACXP,oBAACK,KAAK,CAACG,IAAI;IAAA,GAAKF,SAAS,CAACE;EAAI,GAC3BJ,KAAK,CAACK,SAAS,iBAAIT;IAAKU,GAAG,EAAEN,KAAK,CAACO,QAAQ;IAAEC,SAAS,EAAER,KAAK,CAACS;EAAc,EAAI,EAChFP,SAAS,CAACE,IAAI,CAACM,QAAQ,CAE3B;EAED,IAAIV,KAAK,CAACW,MAAM,EAAE;IAChB,OAAOR,OAAO;;EAGhB,oBAAOP,oBAACC,MAAM;IAACe,SAAS,EAAEZ,KAAK,CAACY;EAAS,GAAGT,OAAO,CAAU;AAC/D,CAAC","names":["React","Portal","getSlots","renderPopoverSurface_unstable","state","slots","slotProps","surface","root","withArrow","ref","arrowRef","className","arrowClassName","children","inline","mountNode"],"sourceRoot":"../src/","sources":["packages/react-components/react-popover/src/components/PopoverSurface/renderPopoverSurface.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Portal } from '@fluentui/react-portal';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { PopoverSurfaceSlots, PopoverSurfaceState } from './PopoverSurface.types';\n\n/*\n Render the final JSX of PopoverSurface\n */\nexport const renderPopoverSurface_unstable = (state: PopoverSurfaceState) => {\n const { slots, slotProps } = getSlots<PopoverSurfaceSlots>(state);\n\n const surface = (\n <slots.root {...slotProps.root}>\n {state.withArrow && <div ref={state.arrowRef} className={state.arrowClassName} />}\n {slotProps.root.children}\n </slots.root>\n );\n\n if (state.inline) {\n return surface;\n }\n\n return <Portal mountNode={state.mountNode}>{surface}</Portal>;\n};\n"]}

package/lib/components/PopoverSurface/usePopoverSurface.js CHANGED Viewed

@@ -10,7 +10,6 @@ import { usePopoverContext_unstable } from '../../popoverContext';
  * @param props - props from this instance of PopoverSurface
  * @param ref - reference to root HTMLDivElement of PopoverSurface
  */
 export const usePopoverSurface_unstable = (props, ref) => {
   const contentRef = usePopoverContext_unstable(context => context.contentRef);
   const openOnHover = usePopoverContext_unstable(context => context.openOnHover);
@@ -52,35 +51,27 @@ export const usePopoverSurface_unstable = (props, ref) => {
     onMouseLeave: onMouseLeaveOriginal,
     onKeyDown: onKeyDownOriginal
   } = state.root;
   state.root.onMouseEnter = e => {
     if (openOnHover) {
       setOpen(e, true);
     }
     onMouseEnterOriginal === null || onMouseEnterOriginal === void 0 ? void 0 : onMouseEnterOriginal(e);
   };
   state.root.onMouseLeave = e => {
     if (openOnHover) {
       setOpen(e, false);
     }
     onMouseLeaveOriginal === null || onMouseLeaveOriginal === void 0 ? void 0 : onMouseLeaveOriginal(e);
   };
   state.root.onKeyDown = e => {
-    var _a; // only close if the event happened inside the current popover
+    var _a;
+    // only close if the event happened inside the current popover
     // If using a stack of inline popovers, the user should call `stopPropagation` to avoid dismissing the entire stack
     if (e.key === 'Escape' && ((_a = contentRef.current) === null || _a === void 0 ? void 0 : _a.contains(e.target))) {
       setOpen(e, false);
     }
     onKeyDownOriginal === null || onKeyDownOriginal === void 0 ? void 0 : onKeyDownOriginal(e);
   };
   return state;
 };
 //# sourceMappingURL=usePopoverSurface.js.map