@fluentui/react-popover 9.7.17 → 9.8.0
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.json +115 -1
- package/CHANGELOG.md +34 -2
- package/dist/index.d.ts +6 -0
- package/lib/components/Popover/Popover.types.js.map +1 -1
- package/lib/components/Popover/usePopover.js +3 -1
- package/lib/components/Popover/usePopover.js.map +1 -1
- package/lib/components/PopoverSurface/usePopoverSurface.js +1 -1
- package/lib/components/PopoverSurface/usePopoverSurface.js.map +1 -1
- package/lib-commonjs/components/Popover/usePopover.js +3 -1
- package/lib-commonjs/components/Popover/usePopover.js.map +1 -1
- package/lib-commonjs/components/PopoverSurface/usePopoverSurface.js +1 -1
- package/lib-commonjs/components/PopoverSurface/usePopoverSurface.js.map +1 -1
- package/package.json +8 -8
package/CHANGELOG.json
CHANGED
@@ -2,7 +2,121 @@
|
|
2
2
|
"name": "@fluentui/react-popover",
|
3
3
|
"entries": [
|
4
4
|
{
|
5
|
-
"date": "
|
5
|
+
"date": "Tue, 29 Aug 2023 12:53:34 GMT",
|
6
|
+
"tag": "@fluentui/react-popover_v9.8.0",
|
7
|
+
"version": "9.8.0",
|
8
|
+
"comments": {
|
9
|
+
"minor": [
|
10
|
+
{
|
11
|
+
"author": "olfedias@microsoft.com",
|
12
|
+
"package": "@fluentui/react-popover",
|
13
|
+
"commit": "2147e3d60a21ff7ded34b27a19f3d5313533e910",
|
14
|
+
"comment": "feat: add closeOnIframeFocus prop to Popover"
|
15
|
+
},
|
16
|
+
{
|
17
|
+
"author": "beachball",
|
18
|
+
"package": "@fluentui/react-popover",
|
19
|
+
"comment": "Bump @fluentui/react-aria to v9.3.33",
|
20
|
+
"commit": "f40ca42c8392904750bf1ef24826d273d1a5b4d5"
|
21
|
+
},
|
22
|
+
{
|
23
|
+
"author": "beachball",
|
24
|
+
"package": "@fluentui/react-popover",
|
25
|
+
"comment": "Bump @fluentui/react-context-selector to v9.1.31",
|
26
|
+
"commit": "f40ca42c8392904750bf1ef24826d273d1a5b4d5"
|
27
|
+
},
|
28
|
+
{
|
29
|
+
"author": "beachball",
|
30
|
+
"package": "@fluentui/react-popover",
|
31
|
+
"comment": "Bump @fluentui/react-portal to v9.3.10",
|
32
|
+
"commit": "f40ca42c8392904750bf1ef24826d273d1a5b4d5"
|
33
|
+
},
|
34
|
+
{
|
35
|
+
"author": "beachball",
|
36
|
+
"package": "@fluentui/react-popover",
|
37
|
+
"comment": "Bump @fluentui/react-positioning to v9.9.8",
|
38
|
+
"commit": "f40ca42c8392904750bf1ef24826d273d1a5b4d5"
|
39
|
+
},
|
40
|
+
{
|
41
|
+
"author": "beachball",
|
42
|
+
"package": "@fluentui/react-popover",
|
43
|
+
"comment": "Bump @fluentui/react-tabster to v9.12.5",
|
44
|
+
"commit": "f40ca42c8392904750bf1ef24826d273d1a5b4d5"
|
45
|
+
},
|
46
|
+
{
|
47
|
+
"author": "beachball",
|
48
|
+
"package": "@fluentui/react-popover",
|
49
|
+
"comment": "Bump @fluentui/react-utilities to v9.13.0",
|
50
|
+
"commit": "f40ca42c8392904750bf1ef24826d273d1a5b4d5"
|
51
|
+
},
|
52
|
+
{
|
53
|
+
"author": "beachball",
|
54
|
+
"package": "@fluentui/react-popover",
|
55
|
+
"comment": "Bump @fluentui/react-jsx-runtime to v9.0.3",
|
56
|
+
"commit": "f40ca42c8392904750bf1ef24826d273d1a5b4d5"
|
57
|
+
}
|
58
|
+
]
|
59
|
+
}
|
60
|
+
},
|
61
|
+
{
|
62
|
+
"date": "Thu, 24 Aug 2023 10:26:33 GMT",
|
63
|
+
"tag": "@fluentui/react-popover_v9.7.18",
|
64
|
+
"version": "9.7.18",
|
65
|
+
"comments": {
|
66
|
+
"patch": [
|
67
|
+
{
|
68
|
+
"author": "esteban.230@hotmail.com",
|
69
|
+
"package": "@fluentui/react-popover",
|
70
|
+
"commit": "8919d6c7e807cbfdb9c46f292fbb76cd908dc708",
|
71
|
+
"comment": "fix(react-popover): Only apply modal attributes if the PopoverSurface traps focus."
|
72
|
+
},
|
73
|
+
{
|
74
|
+
"author": "beachball",
|
75
|
+
"package": "@fluentui/react-popover",
|
76
|
+
"comment": "Bump @fluentui/react-aria to v9.3.32",
|
77
|
+
"commit": "3f6c5a749ef403c06b9c9e753df9afbb84a2ecb5"
|
78
|
+
},
|
79
|
+
{
|
80
|
+
"author": "beachball",
|
81
|
+
"package": "@fluentui/react-popover",
|
82
|
+
"comment": "Bump @fluentui/react-context-selector to v9.1.30",
|
83
|
+
"commit": "3f6c5a749ef403c06b9c9e753df9afbb84a2ecb5"
|
84
|
+
},
|
85
|
+
{
|
86
|
+
"author": "beachball",
|
87
|
+
"package": "@fluentui/react-popover",
|
88
|
+
"comment": "Bump @fluentui/react-portal to v9.3.9",
|
89
|
+
"commit": "3f6c5a749ef403c06b9c9e753df9afbb84a2ecb5"
|
90
|
+
},
|
91
|
+
{
|
92
|
+
"author": "beachball",
|
93
|
+
"package": "@fluentui/react-popover",
|
94
|
+
"comment": "Bump @fluentui/react-positioning to v9.9.7",
|
95
|
+
"commit": "3f6c5a749ef403c06b9c9e753df9afbb84a2ecb5"
|
96
|
+
},
|
97
|
+
{
|
98
|
+
"author": "beachball",
|
99
|
+
"package": "@fluentui/react-popover",
|
100
|
+
"comment": "Bump @fluentui/react-tabster to v9.12.4",
|
101
|
+
"commit": "3f6c5a749ef403c06b9c9e753df9afbb84a2ecb5"
|
102
|
+
},
|
103
|
+
{
|
104
|
+
"author": "beachball",
|
105
|
+
"package": "@fluentui/react-popover",
|
106
|
+
"comment": "Bump @fluentui/react-utilities to v9.12.0",
|
107
|
+
"commit": "3f6c5a749ef403c06b9c9e753df9afbb84a2ecb5"
|
108
|
+
},
|
109
|
+
{
|
110
|
+
"author": "beachball",
|
111
|
+
"package": "@fluentui/react-popover",
|
112
|
+
"comment": "Bump @fluentui/react-jsx-runtime to v9.0.2",
|
113
|
+
"commit": "3f6c5a749ef403c06b9c9e753df9afbb84a2ecb5"
|
114
|
+
}
|
115
|
+
]
|
116
|
+
}
|
117
|
+
},
|
118
|
+
{
|
119
|
+
"date": "Wed, 23 Aug 2023 12:01:49 GMT",
|
6
120
|
"tag": "@fluentui/react-popover_v9.7.17",
|
7
121
|
"version": "9.7.17",
|
8
122
|
"comments": {
|
package/CHANGELOG.md
CHANGED
@@ -1,12 +1,44 @@
|
|
1
1
|
# Change Log - @fluentui/react-popover
|
2
2
|
|
3
|
-
This log was last generated on
|
3
|
+
This log was last generated on Tue, 29 Aug 2023 12:53:34 GMT and should not be manually modified.
|
4
4
|
|
5
5
|
<!-- Start content -->
|
6
6
|
|
7
|
+
## [9.8.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-popover_v9.8.0)
|
8
|
+
|
9
|
+
Tue, 29 Aug 2023 12:53:34 GMT
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-popover_v9.7.18..@fluentui/react-popover_v9.8.0)
|
11
|
+
|
12
|
+
### Minor changes
|
13
|
+
|
14
|
+
- feat: add closeOnIframeFocus prop to Popover ([PR #28881](https://github.com/microsoft/fluentui/pull/28881) by olfedias@microsoft.com)
|
15
|
+
- Bump @fluentui/react-aria to v9.3.33 ([PR #29005](https://github.com/microsoft/fluentui/pull/29005) by beachball)
|
16
|
+
- Bump @fluentui/react-context-selector to v9.1.31 ([PR #29005](https://github.com/microsoft/fluentui/pull/29005) by beachball)
|
17
|
+
- Bump @fluentui/react-portal to v9.3.10 ([PR #29005](https://github.com/microsoft/fluentui/pull/29005) by beachball)
|
18
|
+
- Bump @fluentui/react-positioning to v9.9.8 ([PR #29005](https://github.com/microsoft/fluentui/pull/29005) by beachball)
|
19
|
+
- Bump @fluentui/react-tabster to v9.12.5 ([PR #29005](https://github.com/microsoft/fluentui/pull/29005) by beachball)
|
20
|
+
- Bump @fluentui/react-utilities to v9.13.0 ([PR #29005](https://github.com/microsoft/fluentui/pull/29005) by beachball)
|
21
|
+
- Bump @fluentui/react-jsx-runtime to v9.0.3 ([PR #29005](https://github.com/microsoft/fluentui/pull/29005) by beachball)
|
22
|
+
|
23
|
+
## [9.7.18](https://github.com/microsoft/fluentui/tree/@fluentui/react-popover_v9.7.18)
|
24
|
+
|
25
|
+
Thu, 24 Aug 2023 10:26:33 GMT
|
26
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-popover_v9.7.17..@fluentui/react-popover_v9.7.18)
|
27
|
+
|
28
|
+
### Patches
|
29
|
+
|
30
|
+
- fix(react-popover): Only apply modal attributes if the PopoverSurface traps focus. ([PR #28613](https://github.com/microsoft/fluentui/pull/28613) by esteban.230@hotmail.com)
|
31
|
+
- Bump @fluentui/react-aria to v9.3.32 ([PR #28973](https://github.com/microsoft/fluentui/pull/28973) by beachball)
|
32
|
+
- Bump @fluentui/react-context-selector to v9.1.30 ([PR #28973](https://github.com/microsoft/fluentui/pull/28973) by beachball)
|
33
|
+
- Bump @fluentui/react-portal to v9.3.9 ([PR #28973](https://github.com/microsoft/fluentui/pull/28973) by beachball)
|
34
|
+
- Bump @fluentui/react-positioning to v9.9.7 ([PR #28973](https://github.com/microsoft/fluentui/pull/28973) by beachball)
|
35
|
+
- Bump @fluentui/react-tabster to v9.12.4 ([PR #28973](https://github.com/microsoft/fluentui/pull/28973) by beachball)
|
36
|
+
- Bump @fluentui/react-utilities to v9.12.0 ([PR #28973](https://github.com/microsoft/fluentui/pull/28973) by beachball)
|
37
|
+
- Bump @fluentui/react-jsx-runtime to v9.0.2 ([PR #28973](https://github.com/microsoft/fluentui/pull/28973) by beachball)
|
38
|
+
|
7
39
|
## [9.7.17](https://github.com/microsoft/fluentui/tree/@fluentui/react-popover_v9.7.17)
|
8
40
|
|
9
|
-
Wed, 23 Aug 2023
|
41
|
+
Wed, 23 Aug 2023 12:01:49 GMT
|
10
42
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-popover_v9.7.16..@fluentui/react-popover_v9.7.17)
|
11
43
|
|
12
44
|
### Patches
|
package/dist/index.d.ts
CHANGED
@@ -107,6 +107,12 @@ export declare type PopoverProps = Pick<PortalProps, 'mountNode'> & {
|
|
107
107
|
* @default false
|
108
108
|
*/
|
109
109
|
openOnHover?: boolean;
|
110
|
+
/**
|
111
|
+
* Flag to close the Popover when an iframe outside a PopoverSurface is focused
|
112
|
+
*
|
113
|
+
* @default true
|
114
|
+
*/
|
115
|
+
closeOnIframeFocus?: boolean;
|
110
116
|
/**
|
111
117
|
* Configures the position of the Popover
|
112
118
|
*/
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["Popover.types.ts"],"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';\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?: boolean;\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 * @deprecated this behavior is default provided now, to opt-out of it in favor of standard behavior use the `inertTrapFocus` property\n */\n legacyTrapFocus?: boolean;\n /**\n * Enables 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 * making navigation leak from the trapped area back to the browser toolbar and vice-versa.\n *\n * @default false\n */\n inertTrapFocus?: boolean;\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 | 'inertTrapFocus'\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"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
|
1
|
+
{"version":3,"sources":["Popover.types.ts"],"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';\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 * Flag to close the Popover when an iframe outside a PopoverSurface is focused\n *\n * @default true\n */\n closeOnIframeFocus?: 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?: boolean;\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 * @deprecated this behavior is default provided now, to opt-out of it in favor of standard behavior use the `inertTrapFocus` property\n */\n legacyTrapFocus?: boolean;\n /**\n * Enables 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 * making navigation leak from the trapped area back to the browser toolbar and vice-versa.\n *\n * @default false\n */\n inertTrapFocus?: boolean;\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 | 'inertTrapFocus'\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"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
|
@@ -75,6 +75,7 @@ import { popoverSurfaceBorderRadius } from './constants';
|
|
75
75
|
]);
|
76
76
|
const positioningRefs = usePopoverRefs(initialState);
|
77
77
|
const { targetDocument } = useFluent();
|
78
|
+
var _props_closeOnIframeFocus;
|
78
79
|
useOnClickOutside({
|
79
80
|
contains: elementContains,
|
80
81
|
element: targetDocument,
|
@@ -83,7 +84,8 @@ import { popoverSurfaceBorderRadius } from './constants';
|
|
83
84
|
positioningRefs.triggerRef,
|
84
85
|
positioningRefs.contentRef
|
85
86
|
],
|
86
|
-
disabled: !open
|
87
|
+
disabled: !open,
|
88
|
+
disabledFocusOnIframe: !((_props_closeOnIframeFocus = props.closeOnIframeFocus) !== null && _props_closeOnIframeFocus !== void 0 ? _props_closeOnIframeFocus : true)
|
87
89
|
});
|
88
90
|
// only close on scroll for context, or when closeOnScroll is specified
|
89
91
|
const closeOnScroll = initialState.openOnContext || initialState.closeOnScroll;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["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 // eslint-disable-next-line deprecation/deprecation\n inertTrapFocus: props.inertTrapFocus ?? (props.legacyTrapFocus === undefined ? false : !props.legacyTrapFocus),\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"],"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","inertTrapFocus","legacyTrapFocus","inline","state","onOpenChange","data","defaultState","defaultOpen","positioningOptions","position","align","arrowPadding","target","positioning","coverTarget","withArrow","offset","targetRef","containerRef","arrowRef"],"mappings":"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"}
|
1
|
+
{"version":3,"sources":["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 const { targetDocument } = useFluent();\n\n useOnClickOutside({\n contains: elementContains,\n element: targetDocument,\n callback: ev => setOpen(ev, false),\n refs: [positioningRefs.triggerRef, positioningRefs.contentRef],\n disabled: !open,\n disabledFocusOnIframe: !(props.closeOnIframeFocus ?? true),\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 // eslint-disable-next-line deprecation/deprecation\n inertTrapFocus: props.inertTrapFocus ?? (props.legacyTrapFocus === undefined ? false : !props.legacyTrapFocus),\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"],"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","disabledFocusOnIframe","closeOnIframeFocus","closeOnScroll","openOnContext","findFirstFocusable","unstable_disableAutoFocus","containerTabIndex","getAttribute","firstFocusable","isNaN","focus","inertTrapFocus","legacyTrapFocus","inline","state","onOpenChange","data","defaultState","defaultOpen","positioningOptions","position","align","arrowPadding","target","positioning","coverTarget","withArrow","offset","targetRef","containerRef","arrowRef"],"mappings":"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"}
|
@@ -41,7 +41,7 @@ import { usePopoverContext_unstable } from '../../popoverContext';
|
|
41
41
|
ref: useMergedRefs(ref, contentRef),
|
42
42
|
role: trapFocus ? 'dialog' : 'group',
|
43
43
|
'aria-modal': trapFocus ? true : undefined,
|
44
|
-
...modalAttributes,
|
44
|
+
...trapFocus ? modalAttributes : {},
|
45
45
|
...props
|
46
46
|
}), {
|
47
47
|
elementType: 'div'
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["usePopoverSurface.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useModalAttributes } from '@fluentui/react-tabster';\nimport { usePopoverContext_unstable } from '../../popoverContext';\nimport type { PopoverSurfaceProps, PopoverSurfaceState } from './PopoverSurface.types';\n\n/**\n * Create the state required to render PopoverSurface.\n *\n * The returned state can be modified with hooks such as usePopoverSurfaceStyles_unstable,\n * before being passed to renderPopoverSurface_unstable.\n *\n * @param props - props from this instance of PopoverSurface\n * @param ref - reference to root HTMLDivElement of PopoverSurface\n */\nexport const usePopoverSurface_unstable = (\n props: PopoverSurfaceProps,\n ref: React.Ref<HTMLDivElement>,\n): PopoverSurfaceState => {\n const contentRef = usePopoverContext_unstable(context => context.contentRef);\n const openOnHover = usePopoverContext_unstable(context => context.openOnHover);\n const setOpen = usePopoverContext_unstable(context => context.setOpen);\n const mountNode = usePopoverContext_unstable(context => context.mountNode);\n const arrowRef = usePopoverContext_unstable(context => context.arrowRef);\n const size = usePopoverContext_unstable(context => context.size);\n const withArrow = usePopoverContext_unstable(context => context.withArrow);\n const appearance = usePopoverContext_unstable(context => context.appearance);\n const trapFocus = usePopoverContext_unstable(context => context.trapFocus);\n const inertTrapFocus = usePopoverContext_unstable(context => context.inertTrapFocus);\n const inline = usePopoverContext_unstable(context => context.inline);\n const { modalAttributes } = useModalAttributes({\n trapFocus,\n legacyTrapFocus: !inertTrapFocus,\n alwaysFocusable: !trapFocus,\n });\n\n const state: PopoverSurfaceState = {\n inline,\n appearance,\n withArrow,\n size,\n arrowRef,\n mountNode,\n components: {\n root: 'div',\n },\n root: slot.always(\n getNativeElementProps('div', {\n ref: useMergedRefs(ref, contentRef),\n role: trapFocus ? 'dialog' : 'group',\n 'aria-modal': trapFocus ? true : undefined,\n ...modalAttributes,\n ...props,\n }),\n { elementType: 'div' },\n ),\n };\n\n const {\n onMouseEnter: onMouseEnterOriginal,\n onMouseLeave: onMouseLeaveOriginal,\n onKeyDown: onKeyDownOriginal,\n } = state.root;\n state.root.onMouseEnter = (e: React.MouseEvent<HTMLDivElement>) => {\n if (openOnHover) {\n setOpen(e, true);\n }\n\n onMouseEnterOriginal?.(e);\n };\n\n state.root.onMouseLeave = (e: React.MouseEvent<HTMLDivElement>) => {\n if (openOnHover) {\n setOpen(e, false);\n }\n\n onMouseLeaveOriginal?.(e);\n };\n\n state.root.onKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n // only close if the event happened inside the current popover\n // If using a stack of inline popovers, the user should call `stopPropagation` to avoid dismissing the entire stack\n if (e.key === 'Escape' && contentRef.current?.contains(e.target as HTMLDivElement)) {\n e.preventDefault();\n setOpen(e, false);\n }\n\n onKeyDownOriginal?.(e);\n };\n\n return state;\n};\n"],"names":["React","getNativeElementProps","useMergedRefs","slot","useModalAttributes","usePopoverContext_unstable","usePopoverSurface_unstable","props","ref","contentRef","context","openOnHover","setOpen","mountNode","arrowRef","size","withArrow","appearance","trapFocus","inertTrapFocus","inline","modalAttributes","legacyTrapFocus","alwaysFocusable","state","components","root","always","role","undefined","elementType","onMouseEnter","onMouseEnterOriginal","onMouseLeave","onMouseLeaveOriginal","onKeyDown","onKeyDownOriginal","e","key","current","contains","target","preventDefault"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,aAAa,EAAEC,IAAI,QAAQ,4BAA4B;AACvF,SAASC,kBAAkB,QAAQ,0BAA0B;AAC7D,SAASC,0BAA0B,QAAQ,uBAAuB;AAGlE;;;;;;;;CAQC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC,MACwB;IACxB,MAAMC,aAAaJ,2BAA2BK,CAAAA,UAAWA,QAAQD,UAAU;IAC3E,MAAME,cAAcN,2BAA2BK,CAAAA,UAAWA,QAAQC,WAAW;IAC7E,MAAMC,UAAUP,2BAA2BK,CAAAA,UAAWA,QAAQE,OAAO;IACrE,MAAMC,YAAYR,2BAA2BK,CAAAA,UAAWA,QAAQG,SAAS;IACzE,MAAMC,WAAWT,2BAA2BK,CAAAA,UAAWA,QAAQI,QAAQ;IACvE,MAAMC,OAAOV,2BAA2BK,CAAAA,UAAWA,QAAQK,IAAI;IAC/D,MAAMC,YAAYX,2BAA2BK,CAAAA,UAAWA,QAAQM,SAAS;IACzE,MAAMC,aAAaZ,2BAA2BK,CAAAA,UAAWA,QAAQO,UAAU;IAC3E,MAAMC,YAAYb,2BAA2BK,CAAAA,UAAWA,QAAQQ,SAAS;IACzE,MAAMC,iBAAiBd,2BAA2BK,CAAAA,UAAWA,QAAQS,cAAc;IACnF,MAAMC,SAASf,2BAA2BK,CAAAA,UAAWA,QAAQU,MAAM;IACnE,MAAM,EAAEC,gBAAe,EAAE,GAAGjB,mBAAmB;QAC7Cc;QACAI,iBAAiB,CAACH;QAClBI,iBAAiB,CAACL;IACpB;IAEA,MAAMM,QAA6B;QACjCJ;QACAH;QACAD;QACAD;QACAD;QACAD;QACAY,YAAY;YACVC,MAAM;QACR;QACAA,MAAMvB,KAAKwB,MAAM,CACf1B,sBAAsB,OAAO;YAC3BO,KAAKN,cAAcM,KAAKC;YACxBmB,MAAMV,YAAY,WAAW,OAAO;YACpC,cAAcA,YAAY,IAAI,GAAGW,SAAS;YAC1C,
|
1
|
+
{"version":3,"sources":["usePopoverSurface.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useModalAttributes } from '@fluentui/react-tabster';\nimport { usePopoverContext_unstable } from '../../popoverContext';\nimport type { PopoverSurfaceProps, PopoverSurfaceState } from './PopoverSurface.types';\n\n/**\n * Create the state required to render PopoverSurface.\n *\n * The returned state can be modified with hooks such as usePopoverSurfaceStyles_unstable,\n * before being passed to renderPopoverSurface_unstable.\n *\n * @param props - props from this instance of PopoverSurface\n * @param ref - reference to root HTMLDivElement of PopoverSurface\n */\nexport const usePopoverSurface_unstable = (\n props: PopoverSurfaceProps,\n ref: React.Ref<HTMLDivElement>,\n): PopoverSurfaceState => {\n const contentRef = usePopoverContext_unstable(context => context.contentRef);\n const openOnHover = usePopoverContext_unstable(context => context.openOnHover);\n const setOpen = usePopoverContext_unstable(context => context.setOpen);\n const mountNode = usePopoverContext_unstable(context => context.mountNode);\n const arrowRef = usePopoverContext_unstable(context => context.arrowRef);\n const size = usePopoverContext_unstable(context => context.size);\n const withArrow = usePopoverContext_unstable(context => context.withArrow);\n const appearance = usePopoverContext_unstable(context => context.appearance);\n const trapFocus = usePopoverContext_unstable(context => context.trapFocus);\n const inertTrapFocus = usePopoverContext_unstable(context => context.inertTrapFocus);\n const inline = usePopoverContext_unstable(context => context.inline);\n const { modalAttributes } = useModalAttributes({\n trapFocus,\n legacyTrapFocus: !inertTrapFocus,\n alwaysFocusable: !trapFocus,\n });\n\n const state: PopoverSurfaceState = {\n inline,\n appearance,\n withArrow,\n size,\n arrowRef,\n mountNode,\n components: {\n root: 'div',\n },\n root: slot.always(\n getNativeElementProps('div', {\n ref: useMergedRefs(ref, contentRef),\n role: trapFocus ? 'dialog' : 'group',\n 'aria-modal': trapFocus ? true : undefined,\n ...(trapFocus ? modalAttributes : {}),\n ...props,\n }),\n { elementType: 'div' },\n ),\n };\n\n const {\n onMouseEnter: onMouseEnterOriginal,\n onMouseLeave: onMouseLeaveOriginal,\n onKeyDown: onKeyDownOriginal,\n } = state.root;\n state.root.onMouseEnter = (e: React.MouseEvent<HTMLDivElement>) => {\n if (openOnHover) {\n setOpen(e, true);\n }\n\n onMouseEnterOriginal?.(e);\n };\n\n state.root.onMouseLeave = (e: React.MouseEvent<HTMLDivElement>) => {\n if (openOnHover) {\n setOpen(e, false);\n }\n\n onMouseLeaveOriginal?.(e);\n };\n\n state.root.onKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n // only close if the event happened inside the current popover\n // If using a stack of inline popovers, the user should call `stopPropagation` to avoid dismissing the entire stack\n if (e.key === 'Escape' && contentRef.current?.contains(e.target as HTMLDivElement)) {\n e.preventDefault();\n setOpen(e, false);\n }\n\n onKeyDownOriginal?.(e);\n };\n\n return state;\n};\n"],"names":["React","getNativeElementProps","useMergedRefs","slot","useModalAttributes","usePopoverContext_unstable","usePopoverSurface_unstable","props","ref","contentRef","context","openOnHover","setOpen","mountNode","arrowRef","size","withArrow","appearance","trapFocus","inertTrapFocus","inline","modalAttributes","legacyTrapFocus","alwaysFocusable","state","components","root","always","role","undefined","elementType","onMouseEnter","onMouseEnterOriginal","onMouseLeave","onMouseLeaveOriginal","onKeyDown","onKeyDownOriginal","e","key","current","contains","target","preventDefault"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,aAAa,EAAEC,IAAI,QAAQ,4BAA4B;AACvF,SAASC,kBAAkB,QAAQ,0BAA0B;AAC7D,SAASC,0BAA0B,QAAQ,uBAAuB;AAGlE;;;;;;;;CAQC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC,MACwB;IACxB,MAAMC,aAAaJ,2BAA2BK,CAAAA,UAAWA,QAAQD,UAAU;IAC3E,MAAME,cAAcN,2BAA2BK,CAAAA,UAAWA,QAAQC,WAAW;IAC7E,MAAMC,UAAUP,2BAA2BK,CAAAA,UAAWA,QAAQE,OAAO;IACrE,MAAMC,YAAYR,2BAA2BK,CAAAA,UAAWA,QAAQG,SAAS;IACzE,MAAMC,WAAWT,2BAA2BK,CAAAA,UAAWA,QAAQI,QAAQ;IACvE,MAAMC,OAAOV,2BAA2BK,CAAAA,UAAWA,QAAQK,IAAI;IAC/D,MAAMC,YAAYX,2BAA2BK,CAAAA,UAAWA,QAAQM,SAAS;IACzE,MAAMC,aAAaZ,2BAA2BK,CAAAA,UAAWA,QAAQO,UAAU;IAC3E,MAAMC,YAAYb,2BAA2BK,CAAAA,UAAWA,QAAQQ,SAAS;IACzE,MAAMC,iBAAiBd,2BAA2BK,CAAAA,UAAWA,QAAQS,cAAc;IACnF,MAAMC,SAASf,2BAA2BK,CAAAA,UAAWA,QAAQU,MAAM;IACnE,MAAM,EAAEC,gBAAe,EAAE,GAAGjB,mBAAmB;QAC7Cc;QACAI,iBAAiB,CAACH;QAClBI,iBAAiB,CAACL;IACpB;IAEA,MAAMM,QAA6B;QACjCJ;QACAH;QACAD;QACAD;QACAD;QACAD;QACAY,YAAY;YACVC,MAAM;QACR;QACAA,MAAMvB,KAAKwB,MAAM,CACf1B,sBAAsB,OAAO;YAC3BO,KAAKN,cAAcM,KAAKC;YACxBmB,MAAMV,YAAY,WAAW,OAAO;YACpC,cAAcA,YAAY,IAAI,GAAGW,SAAS;YAC1C,GAAIX,YAAYG,kBAAkB,CAAC,CAAC;YACpC,GAAGd,KAAK;QACV,IACA;YAAEuB,aAAa;QAAM;IAEzB;IAEA,MAAM,EACJC,cAAcC,qBAAoB,EAClCC,cAAcC,qBAAoB,EAClCC,WAAWC,kBAAiB,EAC7B,GAAGZ,MAAME,IAAI;IACdF,MAAME,IAAI,CAACK,YAAY,GAAG,CAACM,IAAwC;QACjE,IAAI1B,aAAa;YACfC,QAAQyB,GAAG,IAAI;QACjB,CAAC;QAEDL,iCAAAA,kCAAAA,KAAAA,IAAAA,qBAAuBK;IACzB;IAEAb,MAAME,IAAI,CAACO,YAAY,GAAG,CAACI,IAAwC;QACjE,IAAI1B,aAAa;YACfC,QAAQyB,GAAG,KAAK;QAClB,CAAC;QAEDH,iCAAAA,kCAAAA,KAAAA,IAAAA,qBAAuBG;IACzB;IAEAb,MAAME,IAAI,CAACS,SAAS,GAAG,CAACE,IAA2C;YAGvC5B;QAF1B,8DAA8D;QAC9D,mHAAmH;QACnH,IAAI4B,EAAEC,GAAG,KAAK,aAAY7B,CAAAA,sBAAAA,WAAW8B,OAAO,cAAlB9B,iCAAAA,KAAAA,IAAAA,oBAAoB+B,SAASH,EAAEI,MAAM,IAAqB;YAClFJ,EAAEK,cAAc;YAChB9B,QAAQyB,GAAG,KAAK;QAClB,CAAC;QAEDD,8BAAAA,+BAAAA,KAAAA,IAAAA,kBAAoBC;IACtB;IAEA,OAAOb;AACT,EAAE"}
|
@@ -77,6 +77,7 @@ const usePopover_unstable = (props)=>{
|
|
77
77
|
]);
|
78
78
|
const positioningRefs = usePopoverRefs(initialState);
|
79
79
|
const { targetDocument } = (0, _reactSharedContexts.useFluent_unstable)();
|
80
|
+
var _props_closeOnIframeFocus;
|
80
81
|
(0, _reactUtilities.useOnClickOutside)({
|
81
82
|
contains: _reactPortal.elementContains,
|
82
83
|
element: targetDocument,
|
@@ -85,7 +86,8 @@ const usePopover_unstable = (props)=>{
|
|
85
86
|
positioningRefs.triggerRef,
|
86
87
|
positioningRefs.contentRef
|
87
88
|
],
|
88
|
-
disabled: !open
|
89
|
+
disabled: !open,
|
90
|
+
disabledFocusOnIframe: !((_props_closeOnIframeFocus = props.closeOnIframeFocus) !== null && _props_closeOnIframeFocus !== void 0 ? _props_closeOnIframeFocus : true)
|
89
91
|
});
|
90
92
|
// only close on scroll for context, or when closeOnScroll is specified
|
91
93
|
const closeOnScroll = initialState.openOnContext || initialState.closeOnScroll;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["usePopover.js"],"sourcesContent":["import * as React from 'react';\nimport { useControllableState, useEventCallback, useOnClickOutside, useOnScrollOutside } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { usePositioning, resolvePositioningShorthand, mergeArrowOffset, usePositioningMouseTarget } from '@fluentui/react-positioning';\nimport { elementContains } from '@fluentui/react-portal';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { arrowHeights } from '../PopoverSurface/index';\nimport { popoverSurfaceBorderRadius } from './constants';\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 */ export const usePopover_unstable = (props)=>{\n const [contextTarget, setContextTarget] = usePositioningMouseTarget();\n const initialState = {\n size: 'medium',\n contextTarget,\n setContextTarget,\n ...props\n };\n const children = React.Children.toArray(props.children);\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 if (children.length > 2) {\n // eslint-disable-next-line no-console\n console.warn('Popover must contain at most two children');\n }\n }\n let popoverTrigger = undefined;\n let popoverSurface = 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 const [open, setOpenState] = useOpenState(initialState);\n const setOpenTimeoutRef = React.useRef(0);\n const setOpen = useEventCallback((e, shouldOpen)=>{\n clearTimeout(setOpenTimeoutRef.current);\n if (!(e instanceof Event) && e.persist) {\n // < React 17 still uses pooled synthetic events\n e.persist();\n }\n if (e.type === 'mouseleave') {\n var _props_mouseLeaveDelay;\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 = props.mouseLeaveDelay) !== null && _props_mouseLeaveDelay !== void 0 ? _props_mouseLeaveDelay : 500);\n } else {\n setOpenState(e, shouldOpen);\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 const toggleOpen = React.useCallback((e)=>{\n setOpen(e, !open);\n }, [\n setOpen,\n open\n ]);\n const positioningRefs = usePopoverRefs(initialState);\n const { targetDocument } = useFluent();\n useOnClickOutside({\n contains: elementContains,\n element: targetDocument,\n callback: (ev)=>setOpen(ev, false),\n refs: [\n positioningRefs.triggerRef,\n positioningRefs.contentRef\n ],\n disabled: !open\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: [\n positioningRefs.triggerRef,\n positioningRefs.contentRef\n ],\n disabled: !open || !closeOnScroll\n });\n const { findFirstFocusable } = useFocusFinders();\n React.useEffect(()=>{\n if (props.unstable_disableAutoFocus) {\n return;\n }\n if (open && positioningRefs.contentRef.current) {\n var _positioningRefs_contentRef_current_getAttribute;\n const containerTabIndex = (_positioningRefs_contentRef_current_getAttribute = positioningRefs.contentRef.current.getAttribute('tabIndex')) !== null && _positioningRefs_contentRef_current_getAttribute !== void 0 ? _positioningRefs_contentRef_current_getAttribute : undefined;\n const firstFocusable = isNaN(containerTabIndex) ? findFirstFocusable(positioningRefs.contentRef.current) : positioningRefs.contentRef.current;\n firstFocusable === null || firstFocusable === void 0 ? void 0 : firstFocusable.focus();\n }\n }, [\n findFirstFocusable,\n open,\n positioningRefs.contentRef,\n props.unstable_disableAutoFocus\n ]);\n var _props_inertTrapFocus, _props_inline;\n return {\n ...initialState,\n ...positioningRefs,\n // eslint-disable-next-line deprecation/deprecation\n inertTrapFocus: (_props_inertTrapFocus = props.inertTrapFocus) !== null && _props_inertTrapFocus !== void 0 ? _props_inertTrapFocus : props.legacyTrapFocus === undefined ? false : !props.legacyTrapFocus,\n popoverTrigger,\n popoverSurface,\n open,\n setOpen,\n toggleOpen,\n setContextTarget,\n contextTarget,\n inline: (_props_inline = props.inline) !== null && _props_inline !== void 0 ? _props_inline : false\n };\n};\n/**\n * Creates and manages the Popover open state\n */ function useOpenState(state) {\n const onOpenChange = useEventCallback((e, data)=>{\n var _state_onOpenChange;\n return (_state_onOpenChange = state.onOpenChange) === null || _state_onOpenChange === void 0 ? void 0 : _state_onOpenChange.call(state, 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 const setOpen = React.useCallback((e, shouldOpen)=>{\n if (shouldOpen && e.type === 'contextmenu') {\n setContextTarget(e);\n }\n if (!shouldOpen) {\n setContextTarget(undefined);\n }\n setOpenState(shouldOpen);\n onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(e, {\n open: shouldOpen\n });\n }, [\n setOpenState,\n onOpenChange,\n setContextTarget\n ]);\n return [\n open,\n setOpen\n ];\n}\n/**\n * Creates and sets the necessary trigger, target and content refs used by Popover\n */ function usePopoverRefs(state) {\n const positioningOptions = {\n position: 'above',\n align: 'center',\n arrowPadding: 2 * popoverSurfaceBorderRadius,\n target: state.openOnContext ? state.contextTarget : undefined,\n ...resolvePositioningShorthand(state.positioning)\n };\n // no reason to render arrow when covering the target\n if (positioningOptions.coverTarget) {\n state.withArrow = false;\n }\n if (state.withArrow) {\n positioningOptions.offset = mergeArrowOffset(positioningOptions.offset, arrowHeights[state.size]);\n }\n const { targetRef: triggerRef , containerRef: contentRef , arrowRef } = usePositioning(positioningOptions);\n return {\n triggerRef,\n contentRef,\n arrowRef\n };\n}\n"],"names":["usePopover_unstable","props","contextTarget","setContextTarget","usePositioningMouseTarget","initialState","size","children","React","Children","toArray","process","env","NODE_ENV","length","console","warn","popoverTrigger","undefined","popoverSurface","open","setOpenState","useOpenState","setOpenTimeoutRef","useRef","setOpen","useEventCallback","e","shouldOpen","clearTimeout","current","Event","persist","type","_props_mouseLeaveDelay","setTimeout","mouseLeaveDelay","useEffect","toggleOpen","useCallback","positioningRefs","usePopoverRefs","targetDocument","useFluent","useOnClickOutside","contains","elementContains","element","callback","ev","refs","triggerRef","contentRef","disabled","closeOnScroll","openOnContext","useOnScrollOutside","findFirstFocusable","useFocusFinders","unstable_disableAutoFocus","_positioningRefs_contentRef_current_getAttribute","containerTabIndex","getAttribute","firstFocusable","isNaN","focus","_props_inertTrapFocus","_props_inline","inertTrapFocus","legacyTrapFocus","inline","state","onOpenChange","data","_state_onOpenChange","call","useControllableState","defaultState","defaultOpen","positioningOptions","position","align","arrowPadding","popoverSurfaceBorderRadius","target","resolvePositioningShorthand","positioning","coverTarget","withArrow","offset","mergeArrowOffset","arrowHeights","targetRef","containerRef","arrowRef","usePositioning"],"mappings":"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"}
|
1
|
+
{"version":3,"sources":["usePopover.js"],"sourcesContent":["import * as React from 'react';\nimport { useControllableState, useEventCallback, useOnClickOutside, useOnScrollOutside } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { usePositioning, resolvePositioningShorthand, mergeArrowOffset, usePositioningMouseTarget } from '@fluentui/react-positioning';\nimport { elementContains } from '@fluentui/react-portal';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { arrowHeights } from '../PopoverSurface/index';\nimport { popoverSurfaceBorderRadius } from './constants';\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 */ export const usePopover_unstable = (props)=>{\n const [contextTarget, setContextTarget] = usePositioningMouseTarget();\n const initialState = {\n size: 'medium',\n contextTarget,\n setContextTarget,\n ...props\n };\n const children = React.Children.toArray(props.children);\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 if (children.length > 2) {\n // eslint-disable-next-line no-console\n console.warn('Popover must contain at most two children');\n }\n }\n let popoverTrigger = undefined;\n let popoverSurface = 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 const [open, setOpenState] = useOpenState(initialState);\n const setOpenTimeoutRef = React.useRef(0);\n const setOpen = useEventCallback((e, shouldOpen)=>{\n clearTimeout(setOpenTimeoutRef.current);\n if (!(e instanceof Event) && e.persist) {\n // < React 17 still uses pooled synthetic events\n e.persist();\n }\n if (e.type === 'mouseleave') {\n var _props_mouseLeaveDelay;\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 = props.mouseLeaveDelay) !== null && _props_mouseLeaveDelay !== void 0 ? _props_mouseLeaveDelay : 500);\n } else {\n setOpenState(e, shouldOpen);\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 const toggleOpen = React.useCallback((e)=>{\n setOpen(e, !open);\n }, [\n setOpen,\n open\n ]);\n const positioningRefs = usePopoverRefs(initialState);\n const { targetDocument } = useFluent();\n var _props_closeOnIframeFocus;\n useOnClickOutside({\n contains: elementContains,\n element: targetDocument,\n callback: (ev)=>setOpen(ev, false),\n refs: [\n positioningRefs.triggerRef,\n positioningRefs.contentRef\n ],\n disabled: !open,\n disabledFocusOnIframe: !((_props_closeOnIframeFocus = props.closeOnIframeFocus) !== null && _props_closeOnIframeFocus !== void 0 ? _props_closeOnIframeFocus : true)\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: [\n positioningRefs.triggerRef,\n positioningRefs.contentRef\n ],\n disabled: !open || !closeOnScroll\n });\n const { findFirstFocusable } = useFocusFinders();\n React.useEffect(()=>{\n if (props.unstable_disableAutoFocus) {\n return;\n }\n if (open && positioningRefs.contentRef.current) {\n var _positioningRefs_contentRef_current_getAttribute;\n const containerTabIndex = (_positioningRefs_contentRef_current_getAttribute = positioningRefs.contentRef.current.getAttribute('tabIndex')) !== null && _positioningRefs_contentRef_current_getAttribute !== void 0 ? _positioningRefs_contentRef_current_getAttribute : undefined;\n const firstFocusable = isNaN(containerTabIndex) ? findFirstFocusable(positioningRefs.contentRef.current) : positioningRefs.contentRef.current;\n firstFocusable === null || firstFocusable === void 0 ? void 0 : firstFocusable.focus();\n }\n }, [\n findFirstFocusable,\n open,\n positioningRefs.contentRef,\n props.unstable_disableAutoFocus\n ]);\n var _props_inertTrapFocus, _props_inline;\n return {\n ...initialState,\n ...positioningRefs,\n // eslint-disable-next-line deprecation/deprecation\n inertTrapFocus: (_props_inertTrapFocus = props.inertTrapFocus) !== null && _props_inertTrapFocus !== void 0 ? _props_inertTrapFocus : props.legacyTrapFocus === undefined ? false : !props.legacyTrapFocus,\n popoverTrigger,\n popoverSurface,\n open,\n setOpen,\n toggleOpen,\n setContextTarget,\n contextTarget,\n inline: (_props_inline = props.inline) !== null && _props_inline !== void 0 ? _props_inline : false\n };\n};\n/**\n * Creates and manages the Popover open state\n */ function useOpenState(state) {\n const onOpenChange = useEventCallback((e, data)=>{\n var _state_onOpenChange;\n return (_state_onOpenChange = state.onOpenChange) === null || _state_onOpenChange === void 0 ? void 0 : _state_onOpenChange.call(state, 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 const setOpen = React.useCallback((e, shouldOpen)=>{\n if (shouldOpen && e.type === 'contextmenu') {\n setContextTarget(e);\n }\n if (!shouldOpen) {\n setContextTarget(undefined);\n }\n setOpenState(shouldOpen);\n onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(e, {\n open: shouldOpen\n });\n }, [\n setOpenState,\n onOpenChange,\n setContextTarget\n ]);\n return [\n open,\n setOpen\n ];\n}\n/**\n * Creates and sets the necessary trigger, target and content refs used by Popover\n */ function usePopoverRefs(state) {\n const positioningOptions = {\n position: 'above',\n align: 'center',\n arrowPadding: 2 * popoverSurfaceBorderRadius,\n target: state.openOnContext ? state.contextTarget : undefined,\n ...resolvePositioningShorthand(state.positioning)\n };\n // no reason to render arrow when covering the target\n if (positioningOptions.coverTarget) {\n state.withArrow = false;\n }\n if (state.withArrow) {\n positioningOptions.offset = mergeArrowOffset(positioningOptions.offset, arrowHeights[state.size]);\n }\n const { targetRef: triggerRef , containerRef: contentRef , arrowRef } = usePositioning(positioningOptions);\n return {\n triggerRef,\n contentRef,\n arrowRef\n };\n}\n"],"names":["usePopover_unstable","props","contextTarget","setContextTarget","usePositioningMouseTarget","initialState","size","children","React","Children","toArray","process","env","NODE_ENV","length","console","warn","popoverTrigger","undefined","popoverSurface","open","setOpenState","useOpenState","setOpenTimeoutRef","useRef","setOpen","useEventCallback","e","shouldOpen","clearTimeout","current","Event","persist","type","_props_mouseLeaveDelay","setTimeout","mouseLeaveDelay","useEffect","toggleOpen","useCallback","positioningRefs","usePopoverRefs","targetDocument","useFluent","_props_closeOnIframeFocus","useOnClickOutside","contains","elementContains","element","callback","ev","refs","triggerRef","contentRef","disabled","disabledFocusOnIframe","closeOnIframeFocus","closeOnScroll","openOnContext","useOnScrollOutside","findFirstFocusable","useFocusFinders","unstable_disableAutoFocus","_positioningRefs_contentRef_current_getAttribute","containerTabIndex","getAttribute","firstFocusable","isNaN","focus","_props_inertTrapFocus","_props_inline","inertTrapFocus","legacyTrapFocus","inline","state","onOpenChange","data","_state_onOpenChange","call","useControllableState","defaultState","defaultOpen","positioningOptions","position","align","arrowPadding","popoverSurfaceBorderRadius","target","resolvePositioningShorthand","positioning","coverTarget","withArrow","offset","mergeArrowOffset","arrowHeights","targetRef","containerRef","arrowRef","usePositioning"],"mappings":"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"}
|
@@ -42,7 +42,7 @@ const usePopoverSurface_unstable = (props, ref)=>{
|
|
42
42
|
ref: (0, _reactUtilities.useMergedRefs)(ref, contentRef),
|
43
43
|
role: trapFocus ? 'dialog' : 'group',
|
44
44
|
'aria-modal': trapFocus ? true : undefined,
|
45
|
-
...modalAttributes,
|
45
|
+
...trapFocus ? modalAttributes : {},
|
46
46
|
...props
|
47
47
|
}), {
|
48
48
|
elementType: 'div'
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["usePopoverSurface.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useModalAttributes } from '@fluentui/react-tabster';\nimport { usePopoverContext_unstable } from '../../popoverContext';\n/**\n * Create the state required to render PopoverSurface.\n *\n * The returned state can be modified with hooks such as usePopoverSurfaceStyles_unstable,\n * before being passed to renderPopoverSurface_unstable.\n *\n * @param props - props from this instance of PopoverSurface\n * @param ref - reference to root HTMLDivElement of PopoverSurface\n */ export const usePopoverSurface_unstable = (props, ref)=>{\n const contentRef = usePopoverContext_unstable((context)=>context.contentRef);\n const openOnHover = usePopoverContext_unstable((context)=>context.openOnHover);\n const setOpen = usePopoverContext_unstable((context)=>context.setOpen);\n const mountNode = usePopoverContext_unstable((context)=>context.mountNode);\n const arrowRef = usePopoverContext_unstable((context)=>context.arrowRef);\n const size = usePopoverContext_unstable((context)=>context.size);\n const withArrow = usePopoverContext_unstable((context)=>context.withArrow);\n const appearance = usePopoverContext_unstable((context)=>context.appearance);\n const trapFocus = usePopoverContext_unstable((context)=>context.trapFocus);\n const inertTrapFocus = usePopoverContext_unstable((context)=>context.inertTrapFocus);\n const inline = usePopoverContext_unstable((context)=>context.inline);\n const { modalAttributes } = useModalAttributes({\n trapFocus,\n legacyTrapFocus: !inertTrapFocus,\n alwaysFocusable: !trapFocus\n });\n const state = {\n inline,\n appearance,\n withArrow,\n size,\n arrowRef,\n mountNode,\n components: {\n root: 'div'\n },\n root: slot.always(getNativeElementProps('div', {\n ref: useMergedRefs(ref, contentRef),\n role: trapFocus ? 'dialog' : 'group',\n 'aria-modal': trapFocus ? true : undefined,\n ...modalAttributes,\n ...props\n }), {\n elementType: 'div'\n })\n };\n const { onMouseEnter: onMouseEnterOriginal , onMouseLeave: onMouseLeaveOriginal , onKeyDown: onKeyDownOriginal } = state.root;\n state.root.onMouseEnter = (e)=>{\n if (openOnHover) {\n setOpen(e, true);\n }\n onMouseEnterOriginal === null || onMouseEnterOriginal === void 0 ? void 0 : onMouseEnterOriginal(e);\n };\n state.root.onMouseLeave = (e)=>{\n if (openOnHover) {\n setOpen(e, false);\n }\n onMouseLeaveOriginal === null || onMouseLeaveOriginal === void 0 ? void 0 : onMouseLeaveOriginal(e);\n };\n state.root.onKeyDown = (e)=>{\n var _contentRef_current;\n // only close if the event happened inside the current popover\n // If using a stack of inline popovers, the user should call `stopPropagation` to avoid dismissing the entire stack\n if (e.key === 'Escape' && ((_contentRef_current = contentRef.current) === null || _contentRef_current === void 0 ? void 0 : _contentRef_current.contains(e.target))) {\n e.preventDefault();\n setOpen(e, false);\n }\n onKeyDownOriginal === null || onKeyDownOriginal === void 0 ? void 0 : onKeyDownOriginal(e);\n };\n return state;\n};\n"],"names":["usePopoverSurface_unstable","props","ref","contentRef","usePopoverContext_unstable","context","openOnHover","setOpen","mountNode","arrowRef","size","withArrow","appearance","trapFocus","inertTrapFocus","inline","modalAttributes","useModalAttributes","legacyTrapFocus","alwaysFocusable","state","components","root","slot","always","getNativeElementProps","useMergedRefs","role","undefined","elementType","onMouseEnter","onMouseEnterOriginal","onMouseLeave","onMouseLeaveOriginal","onKeyDown","onKeyDownOriginal","e","_contentRef_current","key","current","contains","target","preventDefault"],"mappings":";;;;+BAYiBA;;aAAAA;;;6DAZM;gCACoC;8BACxB;gCACQ;AAShC,MAAMA,6BAA6B,CAACC,OAAOC,MAAM;IACxD,MAAMC,aAAaC,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQF,UAAU;IAC3E,MAAMG,cAAcF,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQC,WAAW;IAC7E,MAAMC,UAAUH,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQE,OAAO;IACrE,MAAMC,YAAYJ,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQG,SAAS;IACzE,MAAMC,WAAWL,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQI,QAAQ;IACvE,MAAMC,OAAON,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQK,IAAI;IAC/D,MAAMC,YAAYP,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQM,SAAS;IACzE,MAAMC,aAAaR,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQO,UAAU;IAC3E,MAAMC,YAAYT,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQQ,SAAS;IACzE,MAAMC,iBAAiBV,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQS,cAAc;IACnF,MAAMC,SAASX,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQU,MAAM;IACnE,MAAM,EAAEC,gBAAe,EAAG,GAAGC,IAAAA,gCAAkB,EAAC;QAC5CJ;QACAK,iBAAiB,CAACJ;QAClBK,iBAAiB,CAACN;IACtB;IACA,MAAMO,QAAQ;QACVL;QACAH;QACAD;QACAD;QACAD;QACAD;QACAa,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAAC,OAAO;YAC3CvB,KAAKwB,IAAAA,6BAAa,EAACxB,KAAKC;YACxBwB,MAAMd,YAAY,WAAW,OAAO;YACpC,cAAcA,YAAY,IAAI,GAAGe,SAAS;YAC1C,
|
1
|
+
{"version":3,"sources":["usePopoverSurface.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useModalAttributes } from '@fluentui/react-tabster';\nimport { usePopoverContext_unstable } from '../../popoverContext';\n/**\n * Create the state required to render PopoverSurface.\n *\n * The returned state can be modified with hooks such as usePopoverSurfaceStyles_unstable,\n * before being passed to renderPopoverSurface_unstable.\n *\n * @param props - props from this instance of PopoverSurface\n * @param ref - reference to root HTMLDivElement of PopoverSurface\n */ export const usePopoverSurface_unstable = (props, ref)=>{\n const contentRef = usePopoverContext_unstable((context)=>context.contentRef);\n const openOnHover = usePopoverContext_unstable((context)=>context.openOnHover);\n const setOpen = usePopoverContext_unstable((context)=>context.setOpen);\n const mountNode = usePopoverContext_unstable((context)=>context.mountNode);\n const arrowRef = usePopoverContext_unstable((context)=>context.arrowRef);\n const size = usePopoverContext_unstable((context)=>context.size);\n const withArrow = usePopoverContext_unstable((context)=>context.withArrow);\n const appearance = usePopoverContext_unstable((context)=>context.appearance);\n const trapFocus = usePopoverContext_unstable((context)=>context.trapFocus);\n const inertTrapFocus = usePopoverContext_unstable((context)=>context.inertTrapFocus);\n const inline = usePopoverContext_unstable((context)=>context.inline);\n const { modalAttributes } = useModalAttributes({\n trapFocus,\n legacyTrapFocus: !inertTrapFocus,\n alwaysFocusable: !trapFocus\n });\n const state = {\n inline,\n appearance,\n withArrow,\n size,\n arrowRef,\n mountNode,\n components: {\n root: 'div'\n },\n root: slot.always(getNativeElementProps('div', {\n ref: useMergedRefs(ref, contentRef),\n role: trapFocus ? 'dialog' : 'group',\n 'aria-modal': trapFocus ? true : undefined,\n ...trapFocus ? modalAttributes : {},\n ...props\n }), {\n elementType: 'div'\n })\n };\n const { onMouseEnter: onMouseEnterOriginal , onMouseLeave: onMouseLeaveOriginal , onKeyDown: onKeyDownOriginal } = state.root;\n state.root.onMouseEnter = (e)=>{\n if (openOnHover) {\n setOpen(e, true);\n }\n onMouseEnterOriginal === null || onMouseEnterOriginal === void 0 ? void 0 : onMouseEnterOriginal(e);\n };\n state.root.onMouseLeave = (e)=>{\n if (openOnHover) {\n setOpen(e, false);\n }\n onMouseLeaveOriginal === null || onMouseLeaveOriginal === void 0 ? void 0 : onMouseLeaveOriginal(e);\n };\n state.root.onKeyDown = (e)=>{\n var _contentRef_current;\n // only close if the event happened inside the current popover\n // If using a stack of inline popovers, the user should call `stopPropagation` to avoid dismissing the entire stack\n if (e.key === 'Escape' && ((_contentRef_current = contentRef.current) === null || _contentRef_current === void 0 ? void 0 : _contentRef_current.contains(e.target))) {\n e.preventDefault();\n setOpen(e, false);\n }\n onKeyDownOriginal === null || onKeyDownOriginal === void 0 ? void 0 : onKeyDownOriginal(e);\n };\n return state;\n};\n"],"names":["usePopoverSurface_unstable","props","ref","contentRef","usePopoverContext_unstable","context","openOnHover","setOpen","mountNode","arrowRef","size","withArrow","appearance","trapFocus","inertTrapFocus","inline","modalAttributes","useModalAttributes","legacyTrapFocus","alwaysFocusable","state","components","root","slot","always","getNativeElementProps","useMergedRefs","role","undefined","elementType","onMouseEnter","onMouseEnterOriginal","onMouseLeave","onMouseLeaveOriginal","onKeyDown","onKeyDownOriginal","e","_contentRef_current","key","current","contains","target","preventDefault"],"mappings":";;;;+BAYiBA;;aAAAA;;;6DAZM;gCACoC;8BACxB;gCACQ;AAShC,MAAMA,6BAA6B,CAACC,OAAOC,MAAM;IACxD,MAAMC,aAAaC,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQF,UAAU;IAC3E,MAAMG,cAAcF,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQC,WAAW;IAC7E,MAAMC,UAAUH,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQE,OAAO;IACrE,MAAMC,YAAYJ,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQG,SAAS;IACzE,MAAMC,WAAWL,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQI,QAAQ;IACvE,MAAMC,OAAON,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQK,IAAI;IAC/D,MAAMC,YAAYP,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQM,SAAS;IACzE,MAAMC,aAAaR,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQO,UAAU;IAC3E,MAAMC,YAAYT,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQQ,SAAS;IACzE,MAAMC,iBAAiBV,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQS,cAAc;IACnF,MAAMC,SAASX,IAAAA,0CAA0B,EAAC,CAACC,UAAUA,QAAQU,MAAM;IACnE,MAAM,EAAEC,gBAAe,EAAG,GAAGC,IAAAA,gCAAkB,EAAC;QAC5CJ;QACAK,iBAAiB,CAACJ;QAClBK,iBAAiB,CAACN;IACtB;IACA,MAAMO,QAAQ;QACVL;QACAH;QACAD;QACAD;QACAD;QACAD;QACAa,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAAC,OAAO;YAC3CvB,KAAKwB,IAAAA,6BAAa,EAACxB,KAAKC;YACxBwB,MAAMd,YAAY,WAAW,OAAO;YACpC,cAAcA,YAAY,IAAI,GAAGe,SAAS;YAC1C,GAAGf,YAAYG,kBAAkB,CAAC,CAAC;YACnC,GAAGf,KAAK;QACZ,IAAI;YACA4B,aAAa;QACjB;IACJ;IACA,MAAM,EAAEC,cAAcC,qBAAoB,EAAGC,cAAcC,qBAAoB,EAAGC,WAAWC,kBAAiB,EAAG,GAAGf,MAAME,IAAI;IAC9HF,MAAME,IAAI,CAACQ,YAAY,GAAG,CAACM,IAAI;QAC3B,IAAI9B,aAAa;YACbC,QAAQ6B,GAAG,IAAI;QACnB,CAAC;QACDL,yBAAyB,IAAI,IAAIA,yBAAyB,KAAK,IAAI,KAAK,IAAIA,qBAAqBK,EAAE;IACvG;IACAhB,MAAME,IAAI,CAACU,YAAY,GAAG,CAACI,IAAI;QAC3B,IAAI9B,aAAa;YACbC,QAAQ6B,GAAG,KAAK;QACpB,CAAC;QACDH,yBAAyB,IAAI,IAAIA,yBAAyB,KAAK,IAAI,KAAK,IAAIA,qBAAqBG,EAAE;IACvG;IACAhB,MAAME,IAAI,CAACY,SAAS,GAAG,CAACE,IAAI;QACxB,IAAIC;QACJ,8DAA8D;QAC9D,mHAAmH;QACnH,IAAID,EAAEE,GAAG,KAAK,YAAa,CAAA,AAACD,CAAAA,sBAAsBlC,WAAWoC,OAAO,AAAD,MAAO,IAAI,IAAIF,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBG,QAAQ,CAACJ,EAAEK,MAAM,CAAC,AAAD,GAAI;YACjKL,EAAEM,cAAc;YAChBnC,QAAQ6B,GAAG,KAAK;QACpB,CAAC;QACDD,sBAAsB,IAAI,IAAIA,sBAAsB,KAAK,IAAI,KAAK,IAAIA,kBAAkBC,EAAE;IAC9F;IACA,OAAOhB;AACX"}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@fluentui/react-popover",
|
3
|
-
"version": "9.
|
3
|
+
"version": "9.8.0",
|
4
4
|
"description": "Popover component for Fluent UI",
|
5
5
|
"main": "lib-commonjs/index.js",
|
6
6
|
"module": "lib/index.js",
|
@@ -37,15 +37,15 @@
|
|
37
37
|
},
|
38
38
|
"dependencies": {
|
39
39
|
"@fluentui/keyboard-keys": "^9.0.3",
|
40
|
-
"@fluentui/react-aria": "^9.3.
|
41
|
-
"@fluentui/react-context-selector": "^9.1.
|
42
|
-
"@fluentui/react-portal": "^9.3.
|
43
|
-
"@fluentui/react-positioning": "^9.9.
|
40
|
+
"@fluentui/react-aria": "^9.3.33",
|
41
|
+
"@fluentui/react-context-selector": "^9.1.31",
|
42
|
+
"@fluentui/react-portal": "^9.3.10",
|
43
|
+
"@fluentui/react-positioning": "^9.9.8",
|
44
44
|
"@fluentui/react-shared-contexts": "^9.7.2",
|
45
|
-
"@fluentui/react-tabster": "^9.12.
|
45
|
+
"@fluentui/react-tabster": "^9.12.5",
|
46
46
|
"@fluentui/react-theme": "^9.1.11",
|
47
|
-
"@fluentui/react-utilities": "^9.
|
48
|
-
"@fluentui/react-jsx-runtime": "^9.0.
|
47
|
+
"@fluentui/react-utilities": "^9.13.0",
|
48
|
+
"@fluentui/react-jsx-runtime": "^9.0.3",
|
49
49
|
"@griffel/react": "^1.5.14",
|
50
50
|
"@swc/helpers": "^0.4.14"
|
51
51
|
},
|