@fluentui/react-popover 0.0.0-nightly-20230317-1454.1 → 0.0.0-nightly-20230322-0439.1
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.
- package/.swcrc +2 -11
- package/CHANGELOG.json +104 -23
- package/CHANGELOG.md +34 -14
- package/lib/Popover.js +1 -1
- package/lib/PopoverSurface.js +1 -1
- package/lib/PopoverTrigger.js +1 -1
- package/lib/components/Popover/Popover.js +4 -4
- package/lib/components/Popover/Popover.types.js +1 -1
- package/lib/components/Popover/index.js +4 -4
- package/lib/components/Popover/renderPopover.js +2 -2
- package/lib/components/Popover/usePopover.js +28 -22
- package/lib/components/Popover/usePopover.js.map +1 -1
- package/lib/components/PopoverSurface/PopoverSurface.js +6 -6
- package/lib/components/PopoverSurface/index.js +5 -5
- package/lib/components/PopoverSurface/renderPopoverSurface.js +3 -3
- package/lib/components/PopoverSurface/usePopoverSurface.js +13 -12
- package/lib/components/PopoverSurface/usePopoverSurface.js.map +1 -1
- package/lib/components/PopoverSurface/usePopoverSurfaceStyles.js +6 -6
- package/lib/components/PopoverTrigger/PopoverTrigger.js +4 -4
- package/lib/components/PopoverTrigger/PopoverTrigger.types.js +1 -1
- package/lib/components/PopoverTrigger/index.js +4 -4
- package/lib/components/PopoverTrigger/usePopoverTrigger.js +16 -16
- package/lib/components/PopoverTrigger/usePopoverTrigger.js.map +1 -1
- package/lib/index.js +4 -4
- package/lib/popoverContext.js +2 -2
- package/lib-commonjs/Popover.js.map +1 -1
- package/lib-commonjs/PopoverSurface.js.map +1 -1
- package/lib-commonjs/PopoverTrigger.js.map +1 -1
- package/lib-commonjs/components/Popover/Popover.js +1 -1
- package/lib-commonjs/components/Popover/Popover.js.map +1 -1
- package/lib-commonjs/components/Popover/Popover.types.js.map +1 -1
- package/lib-commonjs/components/Popover/index.js.map +1 -1
- package/lib-commonjs/components/Popover/renderPopover.js.map +1 -1
- package/lib-commonjs/components/Popover/usePopover.js +20 -14
- package/lib-commonjs/components/Popover/usePopover.js.map +1 -1
- package/lib-commonjs/components/PopoverSurface/PopoverSurface.js +1 -1
- package/lib-commonjs/components/PopoverSurface/PopoverSurface.js.map +1 -1
- package/lib-commonjs/components/PopoverSurface/index.js.map +1 -1
- package/lib-commonjs/components/PopoverSurface/renderPopoverSurface.js.map +1 -1
- package/lib-commonjs/components/PopoverSurface/usePopoverSurface.js +9 -8
- package/lib-commonjs/components/PopoverSurface/usePopoverSurface.js.map +1 -1
- package/lib-commonjs/components/PopoverSurface/usePopoverSurfaceStyles.js +12 -12
- package/lib-commonjs/components/PopoverSurface/usePopoverSurfaceStyles.js.map +1 -1
- package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.js +1 -1
- package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.js.map +1 -1
- package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.types.js.map +1 -1
- package/lib-commonjs/components/PopoverTrigger/index.js.map +1 -1
- package/lib-commonjs/components/PopoverTrigger/usePopoverTrigger.js +10 -10
- package/lib-commonjs/components/PopoverTrigger/usePopoverTrigger.js.map +1 -1
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/popoverContext.js +1 -1
- package/lib-commonjs/popoverContext.js.map +1 -1
- package/package.json +12 -11
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["React","getNativeElementProps","useMergedRefs","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","role","undefined","onMouseEnter","onMouseEnterOriginal","onMouseLeave","onMouseLeaveOriginal","onKeyDown","onKeyDownOriginal","e","key","current","contains","target"],"sources":["../../../src/components/PopoverSurface/usePopoverSurface.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs } 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: getNativeElementProps('div', {\n ref: useMergedRefs(ref, contentRef),\n role: trapFocus ? 'dialog' : 'group',\n 'aria-modal': trapFocus ? true : undefined,\n ...modalAttributes,\n ...props,\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 setOpen(e, false);\n }\n\n onKeyDownOriginal?.(e);\n };\n\n return state;\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,qBAAqB,EAAEC,aAAa,QAAQ;AACrD,SAASC,kBAAkB,QAAQ;AACnC,SAASC,0BAA0B,QAAQ;AAG3C;;;;;;;;;AASA,OAAO,MAAMC,0BAAA,GAA6BA,CACxCC,KAAA,EACAC,GAAA,KACwB;EACxB,MAAMC,UAAA,GAAaJ,0BAAA,CAA2BK,OAAA,IAAWA,OAAA,CAAQD,UAAU;EAC3E,MAAME,WAAA,GAAcN,0BAAA,CAA2BK,OAAA,IAAWA,OAAA,CAAQC,WAAW;EAC7E,MAAMC,OAAA,GAAUP,0BAAA,CAA2BK,OAAA,IAAWA,OAAA,CAAQE,OAAO;EACrE,MAAMC,SAAA,GAAYR,0BAAA,CAA2BK,OAAA,IAAWA,OAAA,CAAQG,SAAS;EACzE,MAAMC,QAAA,GAAWT,0BAAA,CAA2BK,OAAA,IAAWA,OAAA,CAAQI,QAAQ;EACvE,MAAMC,IAAA,GAAOV,0BAAA,CAA2BK,OAAA,IAAWA,OAAA,CAAQK,IAAI;EAC/D,MAAMC,SAAA,GAAYX,0BAAA,CAA2BK,OAAA,IAAWA,OAAA,CAAQM,SAAS;EACzE,MAAMC,UAAA,GAAaZ,0BAAA,CAA2BK,OAAA,IAAWA,OAAA,CAAQO,UAAU;EAC3E,MAAMC,SAAA,GAAYb,0BAAA,CAA2BK,OAAA,IAAWA,OAAA,CAAQQ,SAAS;EACzE,MAAMC,cAAA,GAAiBd,0BAAA,CAA2BK,OAAA,IAAWA,OAAA,CAAQS,cAAc;EACnF,MAAMC,MAAA,GAASf,0BAAA,CAA2BK,OAAA,IAAWA,OAAA,CAAQU,MAAM;EACnE,MAAM;IAAEC;EAAe,CAAE,GAAGjB,kBAAA,CAAmB;IAC7Cc,SAAA;IACAI,eAAA,EAAiB,CAACH,cAAA;IAClBI,eAAA,EAAiB,CAACL;EACpB;EAEA,MAAMM,KAAA,GAA6B;IACjCJ,MAAA;IACAH,UAAA;IACAD,SAAA;IACAD,IAAA;IACAD,QAAA;IACAD,SAAA;IACAY,UAAA,EAAY;MACVC,IAAA,EAAM;IACR;IACAA,IAAA,EAAMxB,qBAAA,CAAsB,OAAO;MACjCM,GAAA,EAAKL,aAAA,CAAcK,GAAA,EAAKC,UAAA;MACxBkB,IAAA,EAAMT,SAAA,GAAY,WAAW,OAAO;MACpC,cAAcA,SAAA,GAAY,IAAI,GAAGU,SAAS;MAC1C,GAAGP,eAAe;MAClB,GAAGd;IACL;EACF;EAEA,MAAM;IACJsB,YAAA,EAAcC,oBAAA;IACdC,YAAA,EAAcC,oBAAA;IACdC,SAAA,EAAWC;EAAiB,CAC7B,GAAGV,KAAA,CAAME,IAAI;EACdF,KAAA,CAAME,IAAI,CAACG,YAAY,GAAIM,CAAA,IAAwC;IACjE,IAAIxB,WAAA,EAAa;MACfC,OAAA,CAAQuB,CAAA,EAAG,IAAI;IACjB;IAEAL,oBAAA,
|
1
|
+
{"version":3,"names":["React","getNativeElementProps","useMergedRefs","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","role","undefined","onMouseEnter","onMouseEnterOriginal","onMouseLeave","onMouseLeaveOriginal","onKeyDown","onKeyDownOriginal","e","_contentRef_current","key","current","contains","target"],"sources":["../../../src/components/PopoverSurface/usePopoverSurface.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs } 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: getNativeElementProps('div', {\n ref: useMergedRefs(ref, contentRef),\n role: trapFocus ? 'dialog' : 'group',\n 'aria-modal': trapFocus ? true : undefined,\n ...modalAttributes,\n ...props,\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 setOpen(e, false);\n }\n\n onKeyDownOriginal?.(e);\n };\n\n return state;\n};\n"],"mappings":"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"}
|
@@ -1,8 +1,8 @@
|
|
1
|
-
import { shorthands, __styles, mergeClasses } from
|
2
|
-
import { createArrowHeightStyles, createArrowStyles } from
|
3
|
-
import { tokens, typographyStyles } from
|
1
|
+
import { shorthands, __styles, mergeClasses } from '@griffel/react';
|
2
|
+
import { createArrowHeightStyles, createArrowStyles } from '@fluentui/react-positioning';
|
3
|
+
import { tokens, typographyStyles } from '@fluentui/react-theme';
|
4
4
|
export const popoverSurfaceClassNames = {
|
5
|
-
root:
|
5
|
+
root: 'fui-PopoverSurface'
|
6
6
|
};
|
7
7
|
export const arrowHeights = {
|
8
8
|
small: 6,
|
@@ -109,8 +109,8 @@ const useStyles = /*#__PURE__*/__styles({
|
|
109
109
|
*/
|
110
110
|
export const usePopoverSurfaceStyles_unstable = state => {
|
111
111
|
const styles = useStyles();
|
112
|
-
state.root.className = mergeClasses(popoverSurfaceClassNames.root, styles.root, state.size ===
|
113
|
-
state.arrowClassName = mergeClasses(styles.arrow, state.size ===
|
112
|
+
state.root.className = mergeClasses(popoverSurfaceClassNames.root, styles.root, state.size === 'small' && styles.smallPadding, state.size === 'medium' && styles.mediumPadding, state.size === 'large' && styles.largePadding, state.appearance === 'inverted' && styles.inverted, state.appearance === 'brand' && styles.brand, state.root.className);
|
113
|
+
state.arrowClassName = mergeClasses(styles.arrow, state.size === 'small' ? styles.smallArrow : styles.mediumLargeArrow);
|
114
114
|
return state;
|
115
115
|
};
|
116
116
|
//# sourceMappingURL=usePopoverSurfaceStyles.js.map
|
@@ -1,6 +1,6 @@
|
|
1
|
-
import * as React from
|
2
|
-
import { usePopoverTrigger_unstable } from
|
3
|
-
import { renderPopoverTrigger_unstable } from
|
1
|
+
import * as React from 'react';
|
2
|
+
import { usePopoverTrigger_unstable } from './usePopoverTrigger';
|
3
|
+
import { renderPopoverTrigger_unstable } from './renderPopoverTrigger';
|
4
4
|
/**
|
5
5
|
* Wraps a trigger element as an only child and adds the necessary event handling to open a popover.
|
6
6
|
*/
|
@@ -8,7 +8,7 @@ export const PopoverTrigger = props => {
|
|
8
8
|
const state = usePopoverTrigger_unstable(props);
|
9
9
|
return renderPopoverTrigger_unstable(state);
|
10
10
|
};
|
11
|
-
PopoverTrigger.displayName =
|
11
|
+
PopoverTrigger.displayName = 'PopoverTrigger';
|
12
12
|
// type casting here is required to ensure internal type FluentTriggerComponent is not leaked
|
13
13
|
PopoverTrigger.isFluentTriggerComponent = true;
|
14
14
|
//# sourceMappingURL=PopoverTrigger.js.map
|
@@ -1,2 +1,2 @@
|
|
1
|
-
import * as React from
|
1
|
+
import * as React from 'react';
|
2
2
|
//# sourceMappingURL=PopoverTrigger.types.js.map
|
@@ -1,5 +1,5 @@
|
|
1
|
-
export * from
|
2
|
-
export * from
|
3
|
-
export * from
|
4
|
-
export * from
|
1
|
+
export * from './PopoverTrigger';
|
2
|
+
export * from './PopoverTrigger.types';
|
3
|
+
export * from './renderPopoverTrigger';
|
4
|
+
export * from './usePopoverTrigger';
|
5
5
|
//# sourceMappingURL=index.js.map
|
@@ -1,9 +1,9 @@
|
|
1
|
-
import * as React from
|
2
|
-
import { applyTriggerPropsToChildren, getTriggerChild, mergeCallbacks, useMergedRefs, useEventCallback } from
|
3
|
-
import { useModalAttributes } from
|
4
|
-
import { usePopoverContext_unstable } from
|
5
|
-
import { useARIAButtonProps } from
|
6
|
-
import { Escape } from
|
1
|
+
import * as React from 'react';
|
2
|
+
import { applyTriggerPropsToChildren, getTriggerChild, mergeCallbacks, useMergedRefs, useEventCallback } from '@fluentui/react-utilities';
|
3
|
+
import { useModalAttributes } from '@fluentui/react-tabster';
|
4
|
+
import { usePopoverContext_unstable } from '../../popoverContext';
|
5
|
+
import { useARIAButtonProps } from '@fluentui/react-aria';
|
6
|
+
import { Escape } from '@fluentui/keyboard-keys';
|
7
7
|
/**
|
8
8
|
* Create the state required to render PopoverTrigger.
|
9
9
|
*
|
@@ -58,21 +58,21 @@ export const usePopoverTrigger_unstable = props => {
|
|
58
58
|
};
|
59
59
|
const contextMenuProps = {
|
60
60
|
...triggerAttributes,
|
61
|
-
|
62
|
-
...child
|
63
|
-
onMouseEnter: useEventCallback(mergeCallbacks(child
|
64
|
-
onMouseLeave: useEventCallback(mergeCallbacks(child
|
65
|
-
onContextMenu: useEventCallback(mergeCallbacks(child
|
66
|
-
ref: useMergedRefs(triggerRef, child
|
61
|
+
'aria-expanded': `${open}`,
|
62
|
+
...(child === null || child === void 0 ? void 0 : child.props),
|
63
|
+
onMouseEnter: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : child.props.onMouseEnter, onMouseEnter)),
|
64
|
+
onMouseLeave: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : child.props.onMouseLeave, onMouseLeave)),
|
65
|
+
onContextMenu: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : child.props.onContextMenu, onContextMenu)),
|
66
|
+
ref: useMergedRefs(triggerRef, child === null || child === void 0 ? void 0 : child.ref)
|
67
67
|
};
|
68
68
|
const triggerChildProps = {
|
69
69
|
...contextMenuProps,
|
70
|
-
onClick: useEventCallback(mergeCallbacks(child
|
71
|
-
onKeyDown: useEventCallback(mergeCallbacks(child
|
70
|
+
onClick: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : child.props.onClick, onClick)),
|
71
|
+
onKeyDown: useEventCallback(mergeCallbacks(child === null || child === void 0 ? void 0 : child.props.onKeyDown, onKeyDown))
|
72
72
|
};
|
73
|
-
const ariaButtonTriggerChildProps = useARIAButtonProps(child
|
73
|
+
const ariaButtonTriggerChildProps = useARIAButtonProps((child === null || child === void 0 ? void 0 : child.type) === 'button' || (child === null || child === void 0 ? void 0 : child.type) === 'a' ? child.type : 'div', triggerChildProps);
|
74
74
|
return {
|
75
|
-
children: applyTriggerPropsToChildren(props.children, useARIAButtonProps(child
|
75
|
+
children: applyTriggerPropsToChildren(props.children, useARIAButtonProps((child === null || child === void 0 ? void 0 : child.type) === 'button' || (child === null || child === void 0 ? void 0 : child.type) === 'a' ? child.type : 'div', openOnContext ? contextMenuProps : disableButtonEnhancement ? triggerChildProps : ariaButtonTriggerChildProps))
|
76
76
|
};
|
77
77
|
};
|
78
78
|
//# sourceMappingURL=usePopoverTrigger.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["React","applyTriggerPropsToChildren","getTriggerChild","mergeCallbacks","useMergedRefs","useEventCallback","useModalAttributes","usePopoverContext_unstable","useARIAButtonProps","Escape","usePopoverTrigger_unstable","props","children","disableButtonEnhancement","child","open","context","setOpen","toggleOpen","triggerRef","openOnHover","openOnContext","triggerAttributes","onContextMenu","e","preventDefault","onClick","onKeyDown","key","stopPropagation","onMouseEnter","onMouseLeave","contextMenuProps","ref","triggerChildProps","ariaButtonTriggerChildProps","type"],"sources":["../../../src/components/PopoverTrigger/usePopoverTrigger.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n applyTriggerPropsToChildren,\n getTriggerChild,\n mergeCallbacks,\n useMergedRefs,\n useEventCallback,\n} from '@fluentui/react-utilities';\nimport { useModalAttributes } from '@fluentui/react-tabster';\nimport { usePopoverContext_unstable } from '../../popoverContext';\nimport type { PopoverTriggerProps, PopoverTriggerState } from './PopoverTrigger.types';\nimport { useARIAButtonProps } from '@fluentui/react-aria';\nimport { Escape } from '@fluentui/keyboard-keys';\n\n/**\n * Create the state required to render PopoverTrigger.\n *\n * The returned state can be modified with hooks such as usePopoverTriggerStyles,\n * before being passed to renderPopoverTrigger_unstable.\n *\n * @param props - props from this instance of PopoverTrigger\n */\nexport const usePopoverTrigger_unstable = (props: PopoverTriggerProps): PopoverTriggerState => {\n const { children, disableButtonEnhancement = false } = props;\n const child = getTriggerChild(children);\n\n const open = usePopoverContext_unstable(context => context.open);\n const setOpen = usePopoverContext_unstable(context => context.setOpen);\n const toggleOpen = usePopoverContext_unstable(context => context.toggleOpen);\n const triggerRef = usePopoverContext_unstable(context => context.triggerRef);\n const openOnHover = usePopoverContext_unstable(context => context.openOnHover);\n const openOnContext = usePopoverContext_unstable(context => context.openOnContext);\n const { triggerAttributes } = useModalAttributes();\n\n const onContextMenu = (e: React.MouseEvent<HTMLElement>) => {\n if (openOnContext) {\n e.preventDefault();\n setOpen(e, true);\n }\n };\n\n const onClick = (e: React.MouseEvent<HTMLElement>) => {\n if (!openOnContext) {\n toggleOpen(e);\n }\n };\n\n const onKeyDown = (e: React.KeyboardEvent<HTMLElement>) => {\n if (e.key === Escape && open) {\n setOpen(e, false);\n // stop propagation to avoid conflicting with other elements that listen for `Escape`\n // e,g: Dialog, Menu\n e.stopPropagation();\n }\n };\n\n const onMouseEnter = (e: React.MouseEvent<HTMLElement>) => {\n if (openOnHover) {\n setOpen(e, true);\n }\n };\n\n const onMouseLeave = (e: React.MouseEvent<HTMLElement>) => {\n if (openOnHover) {\n setOpen(e, false);\n }\n };\n\n const contextMenuProps = {\n ...triggerAttributes,\n 'aria-expanded': `${open}`,\n ...child?.props,\n onMouseEnter: useEventCallback(mergeCallbacks(child?.props.onMouseEnter, onMouseEnter)),\n onMouseLeave: useEventCallback(mergeCallbacks(child?.props.onMouseLeave, onMouseLeave)),\n onContextMenu: useEventCallback(mergeCallbacks(child?.props.onContextMenu, onContextMenu)),\n ref: useMergedRefs(triggerRef, child?.ref),\n } as const;\n\n const triggerChildProps = {\n ...contextMenuProps,\n onClick: useEventCallback(mergeCallbacks(child?.props.onClick, onClick)),\n onKeyDown: useEventCallback(mergeCallbacks(child?.props.onKeyDown, onKeyDown)),\n };\n\n const ariaButtonTriggerChildProps = useARIAButtonProps(\n child?.type === 'button' || child?.type === 'a' ? child.type : 'div',\n triggerChildProps,\n );\n\n return {\n children: applyTriggerPropsToChildren(\n props.children,\n useARIAButtonProps(\n child?.type === 'button' || child?.type === 'a' ? child.type : 'div',\n openOnContext ? contextMenuProps : disableButtonEnhancement ? triggerChildProps : ariaButtonTriggerChildProps,\n ),\n ),\n };\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SACEC,2BAA2B,EAC3BC,eAAe,EACfC,cAAc,EACdC,aAAa,EACbC,gBAAgB,QACX;AACP,SAASC,kBAAkB,QAAQ;AACnC,SAASC,0BAA0B,QAAQ;AAE3C,SAASC,kBAAkB,QAAQ;AACnC,SAASC,MAAM,QAAQ;AAEvB;;;;;;;;AAQA,OAAO,MAAMC,0BAAA,GAA8BC,KAAA,IAAoD;EAC7F,MAAM;IAAEC,QAAA;IAAUC,wBAAA,GAA2B;EAAK,CAAE,GAAGF,KAAA;EACvD,MAAMG,KAAA,GAAQZ,eAAA,CAAgBU,QAAA;EAE9B,MAAMG,IAAA,GAAOR,0BAAA,CAA2BS,OAAA,IAAWA,OAAA,CAAQD,IAAI;EAC/D,MAAME,OAAA,GAAUV,0BAAA,CAA2BS,OAAA,IAAWA,OAAA,CAAQC,OAAO;EACrE,MAAMC,UAAA,GAAaX,0BAAA,CAA2BS,OAAA,IAAWA,OAAA,CAAQE,UAAU;EAC3E,MAAMC,UAAA,GAAaZ,0BAAA,CAA2BS,OAAA,IAAWA,OAAA,CAAQG,UAAU;EAC3E,MAAMC,WAAA,GAAcb,0BAAA,CAA2BS,OAAA,IAAWA,OAAA,CAAQI,WAAW;EAC7E,MAAMC,aAAA,GAAgBd,0BAAA,CAA2BS,OAAA,IAAWA,OAAA,CAAQK,aAAa;EACjF,MAAM;IAAEC;EAAiB,CAAE,GAAGhB,kBAAA;EAE9B,MAAMiB,aAAA,GAAiBC,CAAA,IAAqC;IAC1D,IAAIH,aAAA,EAAe;MACjBG,CAAA,CAAEC,cAAc;MAChBR,OAAA,CAAQO,CAAA,EAAG,IAAI;IACjB;EACF;EAEA,MAAME,OAAA,GAAWF,CAAA,IAAqC;IACpD,IAAI,CAACH,aAAA,EAAe;MAClBH,UAAA,CAAWM,CAAA;IACb;EACF;EAEA,MAAMG,SAAA,GAAaH,CAAA,IAAwC;IACzD,IAAIA,CAAA,CAAEI,GAAG,KAAKnB,MAAA,IAAUM,IAAA,EAAM;MAC5BE,OAAA,CAAQO,CAAA,EAAG,KAAK;MAChB;MACA;MACAA,CAAA,CAAEK,eAAe;IACnB;EACF;EAEA,MAAMC,YAAA,GAAgBN,CAAA,IAAqC;IACzD,IAAIJ,WAAA,EAAa;MACfH,OAAA,CAAQO,CAAA,EAAG,IAAI;IACjB;EACF;EAEA,MAAMO,YAAA,GAAgBP,CAAA,IAAqC;IACzD,IAAIJ,WAAA,EAAa;MACfH,OAAA,CAAQO,CAAA,EAAG,KAAK;IAClB;EACF;EAEA,MAAMQ,gBAAA,GAAmB;IACvB,GAAGV,iBAAiB;IACpB,iBAAkB,GAAEP,IAAK,EAAC;IAC1B,
|
1
|
+
{"version":3,"names":["React","applyTriggerPropsToChildren","getTriggerChild","mergeCallbacks","useMergedRefs","useEventCallback","useModalAttributes","usePopoverContext_unstable","useARIAButtonProps","Escape","usePopoverTrigger_unstable","props","children","disableButtonEnhancement","child","open","context","setOpen","toggleOpen","triggerRef","openOnHover","openOnContext","triggerAttributes","onContextMenu","e","preventDefault","onClick","onKeyDown","key","stopPropagation","onMouseEnter","onMouseLeave","contextMenuProps","ref","triggerChildProps","ariaButtonTriggerChildProps","type"],"sources":["../../../src/components/PopoverTrigger/usePopoverTrigger.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n applyTriggerPropsToChildren,\n getTriggerChild,\n mergeCallbacks,\n useMergedRefs,\n useEventCallback,\n} from '@fluentui/react-utilities';\nimport { useModalAttributes } from '@fluentui/react-tabster';\nimport { usePopoverContext_unstable } from '../../popoverContext';\nimport type { PopoverTriggerProps, PopoverTriggerState } from './PopoverTrigger.types';\nimport { useARIAButtonProps } from '@fluentui/react-aria';\nimport { Escape } from '@fluentui/keyboard-keys';\n\n/**\n * Create the state required to render PopoverTrigger.\n *\n * The returned state can be modified with hooks such as usePopoverTriggerStyles,\n * before being passed to renderPopoverTrigger_unstable.\n *\n * @param props - props from this instance of PopoverTrigger\n */\nexport const usePopoverTrigger_unstable = (props: PopoverTriggerProps): PopoverTriggerState => {\n const { children, disableButtonEnhancement = false } = props;\n const child = getTriggerChild(children);\n\n const open = usePopoverContext_unstable(context => context.open);\n const setOpen = usePopoverContext_unstable(context => context.setOpen);\n const toggleOpen = usePopoverContext_unstable(context => context.toggleOpen);\n const triggerRef = usePopoverContext_unstable(context => context.triggerRef);\n const openOnHover = usePopoverContext_unstable(context => context.openOnHover);\n const openOnContext = usePopoverContext_unstable(context => context.openOnContext);\n const { triggerAttributes } = useModalAttributes();\n\n const onContextMenu = (e: React.MouseEvent<HTMLElement>) => {\n if (openOnContext) {\n e.preventDefault();\n setOpen(e, true);\n }\n };\n\n const onClick = (e: React.MouseEvent<HTMLElement>) => {\n if (!openOnContext) {\n toggleOpen(e);\n }\n };\n\n const onKeyDown = (e: React.KeyboardEvent<HTMLElement>) => {\n if (e.key === Escape && open) {\n setOpen(e, false);\n // stop propagation to avoid conflicting with other elements that listen for `Escape`\n // e,g: Dialog, Menu\n e.stopPropagation();\n }\n };\n\n const onMouseEnter = (e: React.MouseEvent<HTMLElement>) => {\n if (openOnHover) {\n setOpen(e, true);\n }\n };\n\n const onMouseLeave = (e: React.MouseEvent<HTMLElement>) => {\n if (openOnHover) {\n setOpen(e, false);\n }\n };\n\n const contextMenuProps = {\n ...triggerAttributes,\n 'aria-expanded': `${open}`,\n ...child?.props,\n onMouseEnter: useEventCallback(mergeCallbacks(child?.props.onMouseEnter, onMouseEnter)),\n onMouseLeave: useEventCallback(mergeCallbacks(child?.props.onMouseLeave, onMouseLeave)),\n onContextMenu: useEventCallback(mergeCallbacks(child?.props.onContextMenu, onContextMenu)),\n ref: useMergedRefs(triggerRef, child?.ref),\n } as const;\n\n const triggerChildProps = {\n ...contextMenuProps,\n onClick: useEventCallback(mergeCallbacks(child?.props.onClick, onClick)),\n onKeyDown: useEventCallback(mergeCallbacks(child?.props.onKeyDown, onKeyDown)),\n };\n\n const ariaButtonTriggerChildProps = useARIAButtonProps(\n child?.type === 'button' || child?.type === 'a' ? child.type : 'div',\n triggerChildProps,\n );\n\n return {\n children: applyTriggerPropsToChildren(\n props.children,\n useARIAButtonProps(\n child?.type === 'button' || child?.type === 'a' ? child.type : 'div',\n openOnContext ? contextMenuProps : disableButtonEnhancement ? triggerChildProps : ariaButtonTriggerChildProps,\n ),\n ),\n };\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SACEC,2BAA2B,EAC3BC,eAAe,EACfC,cAAc,EACdC,aAAa,EACbC,gBAAgB,QACX;AACP,SAASC,kBAAkB,QAAQ;AACnC,SAASC,0BAA0B,QAAQ;AAE3C,SAASC,kBAAkB,QAAQ;AACnC,SAASC,MAAM,QAAQ;AAEvB;;;;;;;;AAQA,OAAO,MAAMC,0BAAA,GAA8BC,KAAA,IAAoD;EAC7F,MAAM;IAAEC,QAAA;IAAUC,wBAAA,GAA2B;EAAK,CAAE,GAAGF,KAAA;EACvD,MAAMG,KAAA,GAAQZ,eAAA,CAAgBU,QAAA;EAE9B,MAAMG,IAAA,GAAOR,0BAAA,CAA2BS,OAAA,IAAWA,OAAA,CAAQD,IAAI;EAC/D,MAAME,OAAA,GAAUV,0BAAA,CAA2BS,OAAA,IAAWA,OAAA,CAAQC,OAAO;EACrE,MAAMC,UAAA,GAAaX,0BAAA,CAA2BS,OAAA,IAAWA,OAAA,CAAQE,UAAU;EAC3E,MAAMC,UAAA,GAAaZ,0BAAA,CAA2BS,OAAA,IAAWA,OAAA,CAAQG,UAAU;EAC3E,MAAMC,WAAA,GAAcb,0BAAA,CAA2BS,OAAA,IAAWA,OAAA,CAAQI,WAAW;EAC7E,MAAMC,aAAA,GAAgBd,0BAAA,CAA2BS,OAAA,IAAWA,OAAA,CAAQK,aAAa;EACjF,MAAM;IAAEC;EAAiB,CAAE,GAAGhB,kBAAA;EAE9B,MAAMiB,aAAA,GAAiBC,CAAA,IAAqC;IAC1D,IAAIH,aAAA,EAAe;MACjBG,CAAA,CAAEC,cAAc;MAChBR,OAAA,CAAQO,CAAA,EAAG,IAAI;IACjB;EACF;EAEA,MAAME,OAAA,GAAWF,CAAA,IAAqC;IACpD,IAAI,CAACH,aAAA,EAAe;MAClBH,UAAA,CAAWM,CAAA;IACb;EACF;EAEA,MAAMG,SAAA,GAAaH,CAAA,IAAwC;IACzD,IAAIA,CAAA,CAAEI,GAAG,KAAKnB,MAAA,IAAUM,IAAA,EAAM;MAC5BE,OAAA,CAAQO,CAAA,EAAG,KAAK;MAChB;MACA;MACAA,CAAA,CAAEK,eAAe;IACnB;EACF;EAEA,MAAMC,YAAA,GAAgBN,CAAA,IAAqC;IACzD,IAAIJ,WAAA,EAAa;MACfH,OAAA,CAAQO,CAAA,EAAG,IAAI;IACjB;EACF;EAEA,MAAMO,YAAA,GAAgBP,CAAA,IAAqC;IACzD,IAAIJ,WAAA,EAAa;MACfH,OAAA,CAAQO,CAAA,EAAG,KAAK;IAClB;EACF;EAEA,MAAMQ,gBAAA,GAAmB;IACvB,GAAGV,iBAAiB;IACpB,iBAAkB,GAAEP,IAAK,EAAC;IAC1B,IAAGD,KAAA,aAAAA,KAAA,uBAAAA,KAAA,CAAOH,KAAK;IACfmB,YAAA,EAAczB,gBAAA,CAAiBF,cAAA,CAAeW,KAAA,aAAAA,KAAA,uBAAAA,KAAA,CAAOH,KAAK,CAACmB,YAAY,EAAEA,YAAA;IACzEC,YAAA,EAAc1B,gBAAA,CAAiBF,cAAA,CAAeW,KAAA,aAAAA,KAAA,uBAAAA,KAAA,CAAOH,KAAK,CAACoB,YAAY,EAAEA,YAAA;IACzER,aAAA,EAAelB,gBAAA,CAAiBF,cAAA,CAAeW,KAAA,aAAAA,KAAA,uBAAAA,KAAA,CAAOH,KAAK,CAACY,aAAa,EAAEA,aAAA;IAC3EU,GAAA,EAAK7B,aAAA,CAAce,UAAA,EAAYL,KAAA,aAAAA,KAAA,uBAAAA,KAAA,CAAOmB,GAAG;EAC3C;EAEA,MAAMC,iBAAA,GAAoB;IACxB,GAAGF,gBAAgB;IACnBN,OAAA,EAASrB,gBAAA,CAAiBF,cAAA,CAAeW,KAAA,aAAAA,KAAA,uBAAAA,KAAA,CAAOH,KAAK,CAACe,OAAO,EAAEA,OAAA;IAC/DC,SAAA,EAAWtB,gBAAA,CAAiBF,cAAA,CAAeW,KAAA,aAAAA,KAAA,uBAAAA,KAAA,CAAOH,KAAK,CAACgB,SAAS,EAAEA,SAAA;EACrE;EAEA,MAAMQ,2BAAA,GAA8B3B,kBAAA,CAClC,CAAAM,KAAA,aAAAA,KAAA,uBAAAA,KAAA,CAAOsB,IAAI,MAAK,YAAY,CAAAtB,KAAA,aAAAA,KAAA,uBAAAA,KAAA,CAAOsB,IAAI,MAAK,MAAMtB,KAAA,CAAMsB,IAAI,GAAG,KAAK,EACpEF,iBAAA;EAGF,OAAO;IACLtB,QAAA,EAAUX,2BAAA,CACRU,KAAA,CAAMC,QAAQ,EACdJ,kBAAA,CACE,CAAAM,KAAA,aAAAA,KAAA,uBAAAA,KAAA,CAAOsB,IAAI,MAAK,YAAY,CAAAtB,KAAA,aAAAA,KAAA,uBAAAA,KAAA,CAAOsB,IAAI,MAAK,MAAMtB,KAAA,CAAMsB,IAAI,GAAG,KAAK,EACpEf,aAAA,GAAgBW,gBAAA,GAAmBnB,wBAAA,GAA2BqB,iBAAA,GAAoBC,2BAA2B;EAGnH;AACF"}
|
package/lib/index.js
CHANGED
@@ -1,5 +1,5 @@
|
|
1
|
-
export { Popover, renderPopover_unstable, usePopover_unstable } from
|
2
|
-
export { PopoverSurface, arrowHeights, popoverSurfaceClassNames, renderPopoverSurface_unstable, usePopoverSurfaceStyles_unstable, usePopoverSurface_unstable } from
|
3
|
-
export { PopoverProvider, usePopoverContext_unstable } from
|
4
|
-
export { PopoverTrigger, renderPopoverTrigger_unstable, usePopoverTrigger_unstable } from
|
1
|
+
export { Popover, renderPopover_unstable, usePopover_unstable } from './Popover';
|
2
|
+
export { PopoverSurface, arrowHeights, popoverSurfaceClassNames, renderPopoverSurface_unstable, usePopoverSurfaceStyles_unstable, usePopoverSurface_unstable } from './PopoverSurface';
|
3
|
+
export { PopoverProvider, usePopoverContext_unstable } from './popoverContext';
|
4
|
+
export { PopoverTrigger, renderPopoverTrigger_unstable, usePopoverTrigger_unstable } from './PopoverTrigger';
|
5
5
|
//# sourceMappingURL=index.js.map
|
package/lib/popoverContext.js
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
import { createContext, useContextSelector } from
|
1
|
+
import { createContext, useContextSelector } from '@fluentui/react-context-selector';
|
2
2
|
export const PopoverContext = /*#__PURE__*/createContext(undefined);
|
3
3
|
const popoverContextDefaultValue = {
|
4
4
|
open: false,
|
@@ -15,7 +15,7 @@ const popoverContextDefaultValue = {
|
|
15
15
|
},
|
16
16
|
openOnContext: false,
|
17
17
|
openOnHover: false,
|
18
|
-
size:
|
18
|
+
size: 'medium',
|
19
19
|
trapFocus: false,
|
20
20
|
inline: false
|
21
21
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../lib/Popover.js"],"sourcesContent":["export * from
|
1
|
+
{"version":3,"sources":["../lib/Popover.js"],"sourcesContent":["export * from './components/Popover/index';\n//# sourceMappingURL=Popover.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,mCAAmC"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../lib/PopoverSurface.js"],"sourcesContent":["export * from
|
1
|
+
{"version":3,"sources":["../lib/PopoverSurface.js"],"sourcesContent":["export * from './components/PopoverSurface/index';\n//# sourceMappingURL=PopoverSurface.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,0CAA0C"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../lib/PopoverTrigger.js"],"sourcesContent":["export * from
|
1
|
+
{"version":3,"sources":["../lib/PopoverTrigger.js"],"sourcesContent":["export * from './components/PopoverTrigger/index';\n//# sourceMappingURL=PopoverTrigger.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,0CAA0C"}
|
@@ -14,6 +14,6 @@ const Popover = (props)=>{
|
|
14
14
|
const state = (0, _usePopover.usePopover_unstable)(props);
|
15
15
|
return (0, _renderPopover.renderPopover_unstable)(state);
|
16
16
|
};
|
17
|
-
Popover.displayName =
|
17
|
+
Popover.displayName = 'Popover'; //# sourceMappingURL=Popover.js.map
|
18
18
|
|
19
19
|
//# sourceMappingURL=Popover.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/Popover/Popover.js"],"sourcesContent":["import * as React from
|
1
|
+
{"version":3,"sources":["../../../lib/components/Popover/Popover.js"],"sourcesContent":["import * as React from 'react';\nimport { usePopover_unstable } from './usePopover';\nimport { renderPopover_unstable } from './renderPopover';\n/**\n * Wrapper component that manages state for a PopoverTrigger and a PopoverSurface components.\n */\nexport const Popover = props => {\n const state = usePopover_unstable(props);\n return renderPopover_unstable(state);\n};\nPopover.displayName = 'Popover';\n//# sourceMappingURL=Popover.js.map"],"names":["Popover","props","state","usePopover_unstable","renderPopover_unstable","displayName"],"mappings":";;;;+BAMaA;;aAAAA;;;6DANU;4BACa;+BACG;AAIhC,MAAMA,UAAUC,CAAAA,QAAS;IAC9B,MAAMC,QAAQC,IAAAA,+BAAmB,EAACF;IAClC,OAAOG,IAAAA,qCAAsB,EAACF;AAChC;AACAF,QAAQK,WAAW,GAAG,WACtB,mCAAmC"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/Popover/Popover.types.js"],"sourcesContent":["import * as React from
|
1
|
+
{"version":3,"sources":["../../../lib/components/Popover/Popover.types.js"],"sourcesContent":["import * as React from 'react';\n//# sourceMappingURL=Popover.types.js.map"],"names":[],"mappings":";;;;;6DAAuB;CACvB,yCAAyC"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/Popover/index.js"],"sourcesContent":["export * from
|
1
|
+
{"version":3,"sources":["../../../lib/components/Popover/index.js"],"sourcesContent":["export * from './Popover';\nexport * from './Popover.types';\nexport * from './renderPopover';\nexport * from './usePopover';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;CACd,iCAAiC"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/Popover/renderPopover.js"],"sourcesContent":["import * as React from
|
1
|
+
{"version":3,"sources":["../../../lib/components/Popover/renderPopover.js"],"sourcesContent":["import * as React from 'react';\nimport { PopoverContext } from '../../popoverContext';\n/**\n * Render the final JSX of Popover\n */\nexport const renderPopover_unstable = state => {\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 inertTrapFocus\n } = state;\n return /*#__PURE__*/React.createElement(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 inertTrapFocus,\n withArrow\n }\n }, state.popoverTrigger, state.open && state.popoverSurface);\n};\n//# sourceMappingURL=renderPopover.js.map"],"names":["renderPopover_unstable","state","appearance","arrowRef","contentRef","inline","mountNode","open","openOnContext","openOnHover","setOpen","size","toggleOpen","trapFocus","triggerRef","withArrow","inertTrapFocus","React","createElement","PopoverContext","Provider","value","popoverTrigger","popoverSurface"],"mappings":";;;;+BAKaA;;aAAAA;;;6DALU;gCACQ;AAIxB,MAAMA,yBAAyBC,CAAAA,QAAS;IAC7C,MAAM,EACJC,WAAU,EACVC,SAAQ,EACRC,WAAU,EACVC,OAAM,EACNC,UAAS,EACTC,KAAI,EACJC,cAAa,EACbC,YAAW,EACXC,QAAO,EACPC,KAAI,EACJC,WAAU,EACVC,UAAS,EACTC,WAAU,EACVC,UAAS,EACTC,eAAc,EACf,GAAGf;IACJ,OAAO,WAAW,GAAEgB,OAAMC,aAAa,CAACC,8BAAc,CAACC,QAAQ,EAAE;QAC/DC,OAAO;YACLnB;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAE;YACAE;YACAH;YACAE;YACAG;YACAD;QACF;IACF,GAAGd,MAAMqB,cAAc,EAAErB,MAAMM,IAAI,IAAIN,MAAMsB,cAAc;AAC7D,GACA,yCAAyC"}
|
@@ -18,20 +18,20 @@ const _constants = require("./constants");
|
|
18
18
|
const usePopover_unstable = (props)=>{
|
19
19
|
const [contextTarget, setContextTarget] = (0, _reactPositioning.usePositioningMouseTarget)();
|
20
20
|
const initialState = {
|
21
|
-
size:
|
21
|
+
size: 'medium',
|
22
22
|
contextTarget,
|
23
23
|
setContextTarget,
|
24
24
|
...props
|
25
25
|
};
|
26
26
|
const children = _react.Children.toArray(props.children);
|
27
|
-
if (process.env.NODE_ENV !==
|
27
|
+
if (process.env.NODE_ENV !== 'production') {
|
28
28
|
if (children.length === 0) {
|
29
29
|
// eslint-disable-next-line no-console
|
30
|
-
console.warn(
|
30
|
+
console.warn('Popover must contain at least one child');
|
31
31
|
}
|
32
32
|
if (children.length > 2) {
|
33
33
|
// eslint-disable-next-line no-console
|
34
|
-
console.warn(
|
34
|
+
console.warn('Popover must contain at most two children');
|
35
35
|
}
|
36
36
|
}
|
37
37
|
let popoverTrigger = undefined;
|
@@ -50,13 +50,14 @@ const usePopover_unstable = (props)=>{
|
|
50
50
|
// < React 17 still uses pooled synthetic events
|
51
51
|
e.persist();
|
52
52
|
}
|
53
|
-
if (e.type ===
|
53
|
+
if (e.type === 'mouseleave') {
|
54
|
+
var _props_mouseLeaveDelay;
|
54
55
|
// FIXME leaking Node timeout type
|
55
56
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
56
57
|
// @ts-ignore
|
57
58
|
setOpenTimeoutRef.current = setTimeout(()=>{
|
58
59
|
setOpenState(e, shouldOpen);
|
59
|
-
}, props.mouseLeaveDelay
|
60
|
+
}, (_props_mouseLeaveDelay = props.mouseLeaveDelay) !== null && _props_mouseLeaveDelay !== void 0 ? _props_mouseLeaveDelay : 500);
|
60
61
|
} else {
|
61
62
|
setOpenState(e, shouldOpen);
|
62
63
|
}
|
@@ -104,9 +105,10 @@ const usePopover_unstable = (props)=>{
|
|
104
105
|
return;
|
105
106
|
}
|
106
107
|
if (open && positioningRefs.contentRef.current) {
|
107
|
-
|
108
|
+
var _positioningRefs_contentRef_current_getAttribute;
|
109
|
+
const containerTabIndex = (_positioningRefs_contentRef_current_getAttribute = positioningRefs.contentRef.current.getAttribute('tabIndex')) !== null && _positioningRefs_contentRef_current_getAttribute !== void 0 ? _positioningRefs_contentRef_current_getAttribute : undefined;
|
108
110
|
const firstFocusable = isNaN(containerTabIndex) ? findFirstFocusable(positioningRefs.contentRef.current) : positioningRefs.contentRef.current;
|
109
|
-
firstFocusable
|
111
|
+
firstFocusable === null || firstFocusable === void 0 ? void 0 : firstFocusable.focus();
|
110
112
|
}
|
111
113
|
}, [
|
112
114
|
findFirstFocusable,
|
@@ -114,6 +116,7 @@ const usePopover_unstable = (props)=>{
|
|
114
116
|
positioningRefs.contentRef,
|
115
117
|
props.unstable_disableAutoFocus
|
116
118
|
]);
|
119
|
+
var _props_inline;
|
117
120
|
return {
|
118
121
|
...initialState,
|
119
122
|
...positioningRefs,
|
@@ -124,13 +127,16 @@ const usePopover_unstable = (props)=>{
|
|
124
127
|
toggleOpen,
|
125
128
|
setContextTarget,
|
126
129
|
contextTarget,
|
127
|
-
inline: props.inline
|
130
|
+
inline: (_props_inline = props.inline) !== null && _props_inline !== void 0 ? _props_inline : false
|
128
131
|
};
|
129
132
|
};
|
130
133
|
/**
|
131
134
|
* Creates and manages the Popover open state
|
132
135
|
*/ function useOpenState(state) {
|
133
|
-
const onOpenChange = (0, _reactUtilities.useEventCallback)((e, data)=>
|
136
|
+
const onOpenChange = (0, _reactUtilities.useEventCallback)((e, data)=>{
|
137
|
+
var _state_onOpenChange;
|
138
|
+
return (_state_onOpenChange = state.onOpenChange) === null || _state_onOpenChange === void 0 ? void 0 : _state_onOpenChange.call(state, e, data);
|
139
|
+
});
|
134
140
|
const [open, setOpenState] = (0, _reactUtilities.useControllableState)({
|
135
141
|
state: state.open,
|
136
142
|
defaultState: state.defaultOpen,
|
@@ -139,14 +145,14 @@ const usePopover_unstable = (props)=>{
|
|
139
145
|
state.open = open !== undefined ? open : state.open;
|
140
146
|
const setContextTarget = state.setContextTarget;
|
141
147
|
const setOpen = _react.useCallback((e, shouldOpen)=>{
|
142
|
-
if (shouldOpen && e.type ===
|
148
|
+
if (shouldOpen && e.type === 'contextmenu') {
|
143
149
|
setContextTarget(e);
|
144
150
|
}
|
145
151
|
if (!shouldOpen) {
|
146
152
|
setContextTarget(undefined);
|
147
153
|
}
|
148
154
|
setOpenState(shouldOpen);
|
149
|
-
onOpenChange
|
155
|
+
onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(e, {
|
150
156
|
open: shouldOpen
|
151
157
|
});
|
152
158
|
}, [
|
@@ -163,8 +169,8 @@ const usePopover_unstable = (props)=>{
|
|
163
169
|
* Creates and sets the necessary trigger, target and content refs used by Popover
|
164
170
|
*/ function usePopoverRefs(state) {
|
165
171
|
const positioningOptions = {
|
166
|
-
position:
|
167
|
-
align:
|
172
|
+
position: 'above',
|
173
|
+
align: 'center',
|
168
174
|
arrowPadding: 2 * _constants.popoverSurfaceBorderRadius,
|
169
175
|
target: state.openOnContext ? state.contextTarget : undefined,
|
170
176
|
...(0, _reactPositioning.resolvePositioningShorthand)(state.positioning)
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/Popover/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 */\nexport 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 // 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 // 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 }, [setOpen, open]);\n const positioningRefs = usePopoverRefs(initialState);\n const {\n targetDocument\n } = 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 // 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 const {\n findFirstFocusable\n } = useFocusFinders();\n React.useEffect(() => {\n if (props.unstable_disableAutoFocus) {\n return;\n }\n if (open && positioningRefs.contentRef.current) {\n const containerTabIndex = positioningRefs.contentRef.current.getAttribute(\"tabIndex\") ?? undefined;\n const firstFocusable = isNaN(containerTabIndex) ? findFirstFocusable(positioningRefs.contentRef.current) : positioningRefs.contentRef.current;\n firstFocusable?.focus();\n }\n }, [findFirstFocusable, open, positioningRefs.contentRef, props.unstable_disableAutoFocus]);\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 * Creates and manages the Popover open state\n */\nfunction useOpenState(state) {\n const onOpenChange = useEventCallback((e, data) => state.onOpenChange?.(e, data));\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?.(e, {\n open: shouldOpen\n });\n }, [setOpenState, onOpenChange, setContextTarget]);\n return [open, setOpen];\n}\n/**\n * Creates and sets the necessary trigger, target and content refs used by Popover\n */\nfunction 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 {\n targetRef: triggerRef,\n containerRef: contentRef,\n arrowRef\n } = usePositioning(positioningOptions);\n return {\n triggerRef,\n contentRef,\n arrowRef\n };\n}\n//# sourceMappingURL=usePopover.js.map"],"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","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","containerTabIndex","getAttribute","firstFocusable","isNaN","focus","inline","state","onOpenChange","data","useControllableState","defaultState","defaultOpen","positioningOptions","position","align","arrowPadding","popoverSurfaceBorderRadius","target","resolvePositioningShorthand","positioning","coverTarget","withArrow","offset","mergeArrowOffset","arrowHeights","targetRef","containerRef","arrowRef","usePositioning"],"mappings":";;;;+BAgBaA;;aAAAA;;;6DAhBU;gCACuE;qCAC9C;kCACyD;6BACzE;8BACA;uBACH;2BACc;AASpC,MAAMA,sBAAsBC,CAAAA,QAAS;IAC1C,MAAM,CAACC,eAAeC,iBAAiB,GAAGC,IAAAA,2CAAyB;IACnE,MAAMC,eAAe;QACnBC,MAAM;QACNJ;QACAC;QACA,GAAGF,KAAK;IACV;IACA,MAAMM,WAAWC,OAAMC,QAAQ,CAACC,OAAO,CAACT,MAAMM,QAAQ;IACtD,IAAII,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACzC,IAAIN,SAASO,MAAM,KAAK,GAAG;YACzB,sCAAsC;YACtCC,QAAQC,IAAI,CAAC;QACf,CAAC;QACD,IAAIT,SAASO,MAAM,GAAG,GAAG;YACvB,sCAAsC;YACtCC,QAAQC,IAAI,CAAC;QACf,CAAC;IACH,CAAC;IACD,IAAIC,iBAAiBC;IACrB,IAAIC,iBAAiBD;IACrB,IAAIX,SAASO,MAAM,KAAK,GAAG;QACzBG,iBAAiBV,QAAQ,CAAC,EAAE;QAC5BY,iBAAiBZ,QAAQ,CAAC,EAAE;IAC9B,OAAO,IAAIA,SAASO,MAAM,KAAK,GAAG;QAChCK,iBAAiBZ,QAAQ,CAAC,EAAE;IAC9B,CAAC;IACD,MAAM,CAACa,MAAMC,aAAa,GAAGC,aAAajB;IAC1C,MAAMkB,oBAAoBf,OAAMgB,MAAM,CAAC;IACvC,MAAMC,UAAUC,IAAAA,gCAAgB,EAAC,CAACC,GAAGC,aAAe;QAClDC,aAAaN,kBAAkBO,OAAO;QACtC,IAAI,CAAEH,CAAAA,aAAaI,KAAI,KAAMJ,EAAEK,OAAO,EAAE;YACtC,gDAAgD;YAChDL,EAAEK,OAAO;QACX,CAAC;QACD,IAAIL,EAAEM,IAAI,KAAK,cAAc;YAC3B,kCAAkC;YAClC,6DAA6D;YAC7D,aAAa;YACbV,kBAAkBO,OAAO,GAAGI,WAAW,IAAM;gBAC3Cb,aAAaM,GAAGC;YAClB,GAAG3B,MAAMkC,eAAe,IAAI;QAC9B,OAAO;YACLd,aAAaM,GAAGC;QAClB,CAAC;IACH;IACA,2BAA2B;IAC3B,kEAAkE;IAClEpB,OAAM4B,SAAS,CAAC,IAAM;QACpB,OAAO,IAAM;YACXP,aAAaN,kBAAkBO,OAAO;QACxC;IACF,GAAG,EAAE;IACL,MAAMO,aAAa7B,OAAM8B,WAAW,CAACX,CAAAA,IAAK;QACxCF,QAAQE,GAAG,CAACP;IACd,GAAG;QAACK;QAASL;KAAK;IAClB,MAAMmB,kBAAkBC,eAAenC;IACvC,MAAM,EACJoC,eAAc,EACf,GAAGC,IAAAA,uCAAS;IACbC,IAAAA,iCAAiB,EAAC;QAChBC,UAAUC,4BAAe;QACzBC,SAASL;QACTM,UAAUC,CAAAA,KAAMvB,QAAQuB,IAAI,KAAK;QACjCC,MAAM;YAACV,gBAAgBW,UAAU;YAAEX,gBAAgBY,UAAU;SAAC;QAC9DC,UAAU,CAAChC;IACb;IACA,uEAAuE;IACvE,MAAMiC,gBAAgBhD,aAAaiD,aAAa,IAAIjD,aAAagD,aAAa;IAC9EE,IAAAA,kCAAkB,EAAC;QACjBX,UAAUC,4BAAe;QACzBC,SAASL;QACTM,UAAUC,CAAAA,KAAMvB,QAAQuB,IAAI,KAAK;QACjCC,MAAM;YAACV,gBAAgBW,UAAU;YAAEX,gBAAgBY,UAAU;SAAC;QAC9DC,UAAU,CAAChC,QAAQ,CAACiC;IACtB;IACA,MAAM,EACJG,mBAAkB,EACnB,GAAGC,IAAAA,6BAAe;IACnBjD,OAAM4B,SAAS,CAAC,IAAM;QACpB,IAAInC,MAAMyD,yBAAyB,EAAE;YACnC;QACF,CAAC;QACD,IAAItC,QAAQmB,gBAAgBY,UAAU,CAACrB,OAAO,EAAE;YAC9C,MAAM6B,oBAAoBpB,gBAAgBY,UAAU,CAACrB,OAAO,CAAC8B,YAAY,CAAC,eAAe1C;YACzF,MAAM2C,iBAAiBC,MAAMH,qBAAqBH,mBAAmBjB,gBAAgBY,UAAU,CAACrB,OAAO,IAAIS,gBAAgBY,UAAU,CAACrB,OAAO;YAC7I+B,gBAAgBE;QAClB,CAAC;IACH,GAAG;QAACP;QAAoBpC;QAAMmB,gBAAgBY,UAAU;QAAElD,MAAMyD,yBAAyB;KAAC;IAC1F,OAAO;QACL,GAAGrD,YAAY;QACf,GAAGkC,eAAe;QAClBtB;QACAE;QACAC;QACAK;QACAY;QACAlC;QACAD;QACA8D,QAAQ/D,MAAM+D,MAAM,IAAI,KAAK;IAC/B;AACF;AACA;;CAEC,GACD,SAAS1C,aAAa2C,KAAK,EAAE;IAC3B,MAAMC,eAAexC,IAAAA,gCAAgB,EAAC,CAACC,GAAGwC,OAASF,MAAMC,YAAY,GAAGvC,GAAGwC;IAC3E,MAAM,CAAC/C,MAAMC,aAAa,GAAG+C,IAAAA,oCAAoB,EAAC;QAChDH,OAAOA,MAAM7C,IAAI;QACjBiD,cAAcJ,MAAMK,WAAW;QAC/BjE,cAAc,KAAK;IACrB;IACA4D,MAAM7C,IAAI,GAAGA,SAASF,YAAYE,OAAO6C,MAAM7C,IAAI;IACnD,MAAMjB,mBAAmB8D,MAAM9D,gBAAgB;IAC/C,MAAMsB,UAAUjB,OAAM8B,WAAW,CAAC,CAACX,GAAGC,aAAe;QACnD,IAAIA,cAAcD,EAAEM,IAAI,KAAK,eAAe;YAC1C9B,iBAAiBwB;QACnB,CAAC;QACD,IAAI,CAACC,YAAY;YACfzB,iBAAiBe;QACnB,CAAC;QACDG,aAAaO;QACbsC,eAAevC,GAAG;YAChBP,MAAMQ;QACR;IACF,GAAG;QAACP;QAAc6C;QAAc/D;KAAiB;IACjD,OAAO;QAACiB;QAAMK;KAAQ;AACxB;AACA;;CAEC,GACD,SAASe,eAAeyB,KAAK,EAAE;IAC7B,MAAMM,qBAAqB;QACzBC,UAAU;QACVC,OAAO;QACPC,cAAc,IAAIC,qCAA0B;QAC5CC,QAAQX,MAAMX,aAAa,GAAGW,MAAM/D,aAAa,GAAGgB,SAAS;QAC7D,GAAG2D,IAAAA,6CAA2B,EAACZ,MAAMa,WAAW,CAAC;IACnD;IACA,qDAAqD;IACrD,IAAIP,mBAAmBQ,WAAW,EAAE;QAClCd,MAAMe,SAAS,GAAG,KAAK;IACzB,CAAC;IACD,IAAIf,MAAMe,SAAS,EAAE;QACnBT,mBAAmBU,MAAM,GAAGC,IAAAA,kCAAgB,EAACX,mBAAmBU,MAAM,EAAEE,mBAAY,CAAClB,MAAM3D,IAAI,CAAC;IAClG,CAAC;IACD,MAAM,EACJ8E,WAAWlC,WAAU,EACrBmC,cAAclC,WAAU,EACxBmC,SAAQ,EACT,GAAGC,IAAAA,gCAAc,EAAChB;IACnB,OAAO;QACLrB;QACAC;QACAmC;IACF;AACF,EACA,sCAAsC"}
|
1
|
+
{"version":3,"sources":["../../../lib/components/Popover/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 */\nexport 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 }, [setOpen, open]);\n const positioningRefs = usePopoverRefs(initialState);\n const {\n targetDocument\n } = 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 // 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 const {\n findFirstFocusable\n } = 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 }, [findFirstFocusable, open, positioningRefs.contentRef, props.unstable_disableAutoFocus]);\n var _props_inline;\n return {\n ...initialState,\n ...positioningRefs,\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 */\nfunction 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 }, [setOpenState, onOpenChange, setContextTarget]);\n return [open, setOpen];\n}\n/**\n * Creates and sets the necessary trigger, target and content refs used by Popover\n */\nfunction 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 {\n targetRef: triggerRef,\n containerRef: contentRef,\n arrowRef\n } = usePositioning(positioningOptions);\n return {\n triggerRef,\n contentRef,\n arrowRef\n };\n}\n//# sourceMappingURL=usePopover.js.map"],"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_inline","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":";;;;+BAgBaA;;aAAAA;;;6DAhBU;gCACuE;qCAC9C;kCACyD;6BACzE;8BACA;uBACH;2BACc;AASpC,MAAMA,sBAAsBC,CAAAA,QAAS;IAC1C,MAAM,CAACC,eAAeC,iBAAiB,GAAGC,IAAAA,2CAAyB;IACnE,MAAMC,eAAe;QACnBC,MAAM;QACNJ;QACAC;QACA,GAAGF,KAAK;IACV;IACA,MAAMM,WAAWC,OAAMC,QAAQ,CAACC,OAAO,CAACT,MAAMM,QAAQ;IACtD,IAAII,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACzC,IAAIN,SAASO,MAAM,KAAK,GAAG;YACzB,sCAAsC;YACtCC,QAAQC,IAAI,CAAC;QACf,CAAC;QACD,IAAIT,SAASO,MAAM,GAAG,GAAG;YACvB,sCAAsC;YACtCC,QAAQC,IAAI,CAAC;QACf,CAAC;IACH,CAAC;IACD,IAAIC,iBAAiBC;IACrB,IAAIC,iBAAiBD;IACrB,IAAIX,SAASO,MAAM,KAAK,GAAG;QACzBG,iBAAiBV,QAAQ,CAAC,EAAE;QAC5BY,iBAAiBZ,QAAQ,CAAC,EAAE;IAC9B,OAAO,IAAIA,SAASO,MAAM,KAAK,GAAG;QAChCK,iBAAiBZ,QAAQ,CAAC,EAAE;IAC9B,CAAC;IACD,MAAM,CAACa,MAAMC,aAAa,GAAGC,aAAajB;IAC1C,MAAMkB,oBAAoBf,OAAMgB,MAAM,CAAC;IACvC,MAAMC,UAAUC,IAAAA,gCAAgB,EAAC,CAACC,GAAGC,aAAe;QAClDC,aAAaN,kBAAkBO,OAAO;QACtC,IAAI,CAAEH,CAAAA,aAAaI,KAAI,KAAMJ,EAAEK,OAAO,EAAE;YACtC,gDAAgD;YAChDL,EAAEK,OAAO;QACX,CAAC;QACD,IAAIL,EAAEM,IAAI,KAAK,cAAc;YAC3B,IAAIC;YACJ,kCAAkC;YAClC,6DAA6D;YAC7D,aAAa;YACbX,kBAAkBO,OAAO,GAAGK,WAAW,IAAM;gBAC3Cd,aAAaM,GAAGC;YAClB,GAAG,AAACM,CAAAA,yBAAyBjC,MAAMmC,eAAe,AAAD,MAAO,IAAI,IAAIF,2BAA2B,KAAK,IAAIA,yBAAyB,GAAG;QAClI,OAAO;YACLb,aAAaM,GAAGC;QAClB,CAAC;IACH;IACA,2BAA2B;IAC3B,kEAAkE;IAClEpB,OAAM6B,SAAS,CAAC,IAAM;QACpB,OAAO,IAAM;YACXR,aAAaN,kBAAkBO,OAAO;QACxC;IACF,GAAG,EAAE;IACL,MAAMQ,aAAa9B,OAAM+B,WAAW,CAACZ,CAAAA,IAAK;QACxCF,QAAQE,GAAG,CAACP;IACd,GAAG;QAACK;QAASL;KAAK;IAClB,MAAMoB,kBAAkBC,eAAepC;IACvC,MAAM,EACJqC,eAAc,EACf,GAAGC,IAAAA,uCAAS;IACbC,IAAAA,iCAAiB,EAAC;QAChBC,UAAUC,4BAAe;QACzBC,SAASL;QACTM,UAAUC,CAAAA,KAAMxB,QAAQwB,IAAI,KAAK;QACjCC,MAAM;YAACV,gBAAgBW,UAAU;YAAEX,gBAAgBY,UAAU;SAAC;QAC9DC,UAAU,CAACjC;IACb;IACA,uEAAuE;IACvE,MAAMkC,gBAAgBjD,aAAakD,aAAa,IAAIlD,aAAaiD,aAAa;IAC9EE,IAAAA,kCAAkB,EAAC;QACjBX,UAAUC,4BAAe;QACzBC,SAASL;QACTM,UAAUC,CAAAA,KAAMxB,QAAQwB,IAAI,KAAK;QACjCC,MAAM;YAACV,gBAAgBW,UAAU;YAAEX,gBAAgBY,UAAU;SAAC;QAC9DC,UAAU,CAACjC,QAAQ,CAACkC;IACtB;IACA,MAAM,EACJG,mBAAkB,EACnB,GAAGC,IAAAA,6BAAe;IACnBlD,OAAM6B,SAAS,CAAC,IAAM;QACpB,IAAIpC,MAAM0D,yBAAyB,EAAE;YACnC;QACF,CAAC;QACD,IAAIvC,QAAQoB,gBAAgBY,UAAU,CAACtB,OAAO,EAAE;YAC9C,IAAI8B;YACJ,MAAMC,oBAAoB,AAACD,CAAAA,mDAAmDpB,gBAAgBY,UAAU,CAACtB,OAAO,CAACgC,YAAY,CAAC,WAAU,MAAO,IAAI,IAAIF,qDAAqD,KAAK,IAAIA,mDAAmD1C,SAAS;YACjR,MAAM6C,iBAAiBC,MAAMH,qBAAqBJ,mBAAmBjB,gBAAgBY,UAAU,CAACtB,OAAO,IAAIU,gBAAgBY,UAAU,CAACtB,OAAO;YAC7IiC,mBAAmB,IAAI,IAAIA,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeE,KAAK,EAAE;QACxF,CAAC;IACH,GAAG;QAACR;QAAoBrC;QAAMoB,gBAAgBY,UAAU;QAAEnD,MAAM0D,yBAAyB;KAAC;IAC1F,IAAIO;IACJ,OAAO;QACL,GAAG7D,YAAY;QACf,GAAGmC,eAAe;QAClBvB;QACAE;QACAC;QACAK;QACAa;QACAnC;QACAD;QACAiE,QAAQ,AAACD,CAAAA,gBAAgBjE,MAAMkE,MAAM,AAAD,MAAO,IAAI,IAAID,kBAAkB,KAAK,IAAIA,gBAAgB,KAAK;IACrG;AACF;AACA;;CAEC,GACD,SAAS5C,aAAa8C,KAAK,EAAE;IAC3B,MAAMC,eAAe3C,IAAAA,gCAAgB,EAAC,CAACC,GAAG2C,OAAS;QACjD,IAAIC;QACJ,OAAO,AAACA,CAAAA,sBAAsBH,MAAMC,YAAY,AAAD,MAAO,IAAI,IAAIE,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBC,IAAI,CAACJ,OAAOzC,GAAG2C,KAAK;IAClJ;IACA,MAAM,CAAClD,MAAMC,aAAa,GAAGoD,IAAAA,oCAAoB,EAAC;QAChDL,OAAOA,MAAMhD,IAAI;QACjBsD,cAAcN,MAAMO,WAAW;QAC/BtE,cAAc,KAAK;IACrB;IACA+D,MAAMhD,IAAI,GAAGA,SAASF,YAAYE,OAAOgD,MAAMhD,IAAI;IACnD,MAAMjB,mBAAmBiE,MAAMjE,gBAAgB;IAC/C,MAAMsB,UAAUjB,OAAM+B,WAAW,CAAC,CAACZ,GAAGC,aAAe;QACnD,IAAIA,cAAcD,EAAEM,IAAI,KAAK,eAAe;YAC1C9B,iBAAiBwB;QACnB,CAAC;QACD,IAAI,CAACC,YAAY;YACfzB,iBAAiBe;QACnB,CAAC;QACDG,aAAaO;QACbyC,iBAAiB,IAAI,IAAIA,iBAAiB,KAAK,IAAI,KAAK,IAAIA,aAAa1C,GAAG;YAC1EP,MAAMQ;QACR,EAAE;IACJ,GAAG;QAACP;QAAcgD;QAAclE;KAAiB;IACjD,OAAO;QAACiB;QAAMK;KAAQ;AACxB;AACA;;CAEC,GACD,SAASgB,eAAe2B,KAAK,EAAE;IAC7B,MAAMQ,qBAAqB;QACzBC,UAAU;QACVC,OAAO;QACPC,cAAc,IAAIC,qCAA0B;QAC5CC,QAAQb,MAAMb,aAAa,GAAGa,MAAMlE,aAAa,GAAGgB,SAAS;QAC7D,GAAGgE,IAAAA,6CAA2B,EAACd,MAAMe,WAAW,CAAC;IACnD;IACA,qDAAqD;IACrD,IAAIP,mBAAmBQ,WAAW,EAAE;QAClChB,MAAMiB,SAAS,GAAG,KAAK;IACzB,CAAC;IACD,IAAIjB,MAAMiB,SAAS,EAAE;QACnBT,mBAAmBU,MAAM,GAAGC,IAAAA,kCAAgB,EAACX,mBAAmBU,MAAM,EAAEE,mBAAY,CAACpB,MAAM9D,IAAI,CAAC;IAClG,CAAC;IACD,MAAM,EACJmF,WAAWtC,WAAU,EACrBuC,cAActC,WAAU,EACxBuC,SAAQ,EACT,GAAGC,IAAAA,gCAAc,EAAChB;IACnB,OAAO;QACLzB;QACAC;QACAuC;IACF;AACF,EACA,sCAAsC"}
|
@@ -19,6 +19,6 @@ const PopoverSurface = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
|
|
19
19
|
useCustomStyles(state);
|
20
20
|
return (0, _renderPopoverSurface.renderPopoverSurface_unstable)(state);
|
21
21
|
});
|
22
|
-
PopoverSurface.displayName =
|
22
|
+
PopoverSurface.displayName = 'PopoverSurface'; //# sourceMappingURL=PopoverSurface.js.map
|
23
23
|
|
24
24
|
//# sourceMappingURL=PopoverSurface.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/PopoverSurface/PopoverSurface.js"],"sourcesContent":["import * as React from
|
1
|
+
{"version":3,"sources":["../../../lib/components/PopoverSurface/PopoverSurface.js"],"sourcesContent":["import * as React from 'react';\nimport { usePopoverSurface_unstable } from './usePopoverSurface';\nimport { renderPopoverSurface_unstable } from './renderPopoverSurface';\nimport { usePopoverSurfaceStyles_unstable } from './usePopoverSurfaceStyles';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n/**\n * PopoverSurface component renders react children in a positioned box\n */\nexport const PopoverSurface = /*#__PURE__*/React.forwardRef((props, ref) => {\n const state = usePopoverSurface_unstable(props, ref);\n usePopoverSurfaceStyles_unstable(state);\n const {\n usePopoverSurfaceStyles_unstable: useCustomStyles\n } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n return renderPopoverSurface_unstable(state);\n});\nPopoverSurface.displayName = 'PopoverSurface';\n//# sourceMappingURL=PopoverSurface.js.map"],"names":["PopoverSurface","React","forwardRef","props","ref","state","usePopoverSurface_unstable","usePopoverSurfaceStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderPopoverSurface_unstable","displayName"],"mappings":";;;;+BAQaA;;aAAAA;;;6DARU;mCACoB;sCACG;yCACG;qCACJ;AAItC,MAAMA,iBAAiB,WAAW,GAAEC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAQ;IAC1E,MAAMC,QAAQC,IAAAA,6CAA0B,EAACH,OAAOC;IAChDG,IAAAA,yDAAgC,EAACF;IACjC,MAAM,EACJE,kCAAkCC,gBAAe,EAClD,GAAGC,IAAAA,iDAA4B;IAChCD,gBAAgBH;IAChB,OAAOK,IAAAA,mDAA6B,EAACL;AACvC;AACAL,eAAeW,WAAW,GAAG,kBAC7B,0CAA0C"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/PopoverSurface/index.js"],"sourcesContent":["export * from
|
1
|
+
{"version":3,"sources":["../../../lib/components/PopoverSurface/index.js"],"sourcesContent":["export * from './PopoverSurface';\nexport * from './PopoverSurface.types';\nexport * from './renderPopoverSurface';\nexport * from './usePopoverSurface';\nexport * from './usePopoverSurfaceStyles';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;CACd,iCAAiC"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/PopoverSurface/renderPopoverSurface.js"],"sourcesContent":["import * as React from
|
1
|
+
{"version":3,"sources":["../../../lib/components/PopoverSurface/renderPopoverSurface.js"],"sourcesContent":["import * as React from 'react';\nimport { Portal } from '@fluentui/react-portal';\nimport { getSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of PopoverSurface\n */\nexport const renderPopoverSurface_unstable = state => {\n const {\n slots,\n slotProps\n } = getSlots(state);\n const surface = /*#__PURE__*/React.createElement(slots.root, slotProps.root, state.withArrow && /*#__PURE__*/React.createElement(\"div\", {\n ref: state.arrowRef,\n className: state.arrowClassName\n }), slotProps.root.children);\n if (state.inline) {\n return surface;\n }\n return /*#__PURE__*/React.createElement(Portal, {\n mountNode: state.mountNode\n }, surface);\n};\n//# sourceMappingURL=renderPopoverSurface.js.map"],"names":["renderPopoverSurface_unstable","state","slots","slotProps","getSlots","surface","React","createElement","root","withArrow","ref","arrowRef","className","arrowClassName","children","inline","Portal","mountNode"],"mappings":";;;;+BAMaA;;aAAAA;;;6DANU;6BACA;gCACE;AAIlB,MAAMA,gCAAgCC,CAAAA,QAAS;IACpD,MAAM,EACJC,MAAK,EACLC,UAAS,EACV,GAAGC,IAAAA,wBAAQ,EAACH;IACb,MAAMI,UAAU,WAAW,GAAEC,OAAMC,aAAa,CAACL,MAAMM,IAAI,EAAEL,UAAUK,IAAI,EAAEP,MAAMQ,SAAS,IAAI,WAAW,GAAEH,OAAMC,aAAa,CAAC,OAAO;QACtIG,KAAKT,MAAMU,QAAQ;QACnBC,WAAWX,MAAMY,cAAc;IACjC,IAAIV,UAAUK,IAAI,CAACM,QAAQ;IAC3B,IAAIb,MAAMc,MAAM,EAAE;QAChB,OAAOV;IACT,CAAC;IACD,OAAO,WAAW,GAAEC,OAAMC,aAAa,CAACS,mBAAM,EAAE;QAC9CC,WAAWhB,MAAMgB,SAAS;IAC5B,GAAGZ;AACL,GACA,gDAAgD"}
|
@@ -36,12 +36,12 @@ const usePopoverSurface_unstable = (props, ref)=>{
|
|
36
36
|
arrowRef,
|
37
37
|
mountNode,
|
38
38
|
components: {
|
39
|
-
root:
|
39
|
+
root: 'div'
|
40
40
|
},
|
41
|
-
root: (0, _reactUtilities.getNativeElementProps)(
|
41
|
+
root: (0, _reactUtilities.getNativeElementProps)('div', {
|
42
42
|
ref: (0, _reactUtilities.useMergedRefs)(ref, contentRef),
|
43
|
-
role: trapFocus ?
|
44
|
-
|
43
|
+
role: trapFocus ? 'dialog' : 'group',
|
44
|
+
'aria-modal': trapFocus ? true : undefined,
|
45
45
|
...modalAttributes,
|
46
46
|
...props
|
47
47
|
})
|
@@ -51,21 +51,22 @@ const usePopoverSurface_unstable = (props, ref)=>{
|
|
51
51
|
if (openOnHover) {
|
52
52
|
setOpen(e, true);
|
53
53
|
}
|
54
|
-
onMouseEnterOriginal
|
54
|
+
onMouseEnterOriginal === null || onMouseEnterOriginal === void 0 ? void 0 : onMouseEnterOriginal(e);
|
55
55
|
};
|
56
56
|
state.root.onMouseLeave = (e)=>{
|
57
57
|
if (openOnHover) {
|
58
58
|
setOpen(e, false);
|
59
59
|
}
|
60
|
-
onMouseLeaveOriginal
|
60
|
+
onMouseLeaveOriginal === null || onMouseLeaveOriginal === void 0 ? void 0 : onMouseLeaveOriginal(e);
|
61
61
|
};
|
62
62
|
state.root.onKeyDown = (e)=>{
|
63
|
+
var _contentRef_current;
|
63
64
|
// only close if the event happened inside the current popover
|
64
65
|
// If using a stack of inline popovers, the user should call `stopPropagation` to avoid dismissing the entire stack
|
65
|
-
if (e.key ===
|
66
|
+
if (e.key === 'Escape' && ((_contentRef_current = contentRef.current) === null || _contentRef_current === void 0 ? void 0 : _contentRef_current.contains(e.target))) {
|
66
67
|
setOpen(e, false);
|
67
68
|
}
|
68
|
-
onKeyDownOriginal
|
69
|
+
onKeyDownOriginal === null || onKeyDownOriginal === void 0 ? void 0 : onKeyDownOriginal(e);
|
69
70
|
};
|
70
71
|
return state;
|
71
72
|
}; //# sourceMappingURL=usePopoverSurface.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/PopoverSurface/usePopoverSurface.js"],"sourcesContent":["import * as React from
|
1
|
+
{"version":3,"sources":["../../../lib/components/PopoverSurface/usePopoverSurface.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs } 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 */\nexport 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 {\n modalAttributes\n } = 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: getNativeElementProps('div', {\n ref: useMergedRefs(ref, contentRef),\n role: trapFocus ? 'dialog' : 'group',\n 'aria-modal': trapFocus ? true : undefined,\n ...modalAttributes,\n ...props\n })\n };\n const {\n onMouseEnter: onMouseEnterOriginal,\n onMouseLeave: onMouseLeaveOriginal,\n onKeyDown: onKeyDownOriginal\n } = 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 setOpen(e, false);\n }\n onKeyDownOriginal === null || onKeyDownOriginal === void 0 ? void 0 : onKeyDownOriginal(e);\n };\n return state;\n};\n//# sourceMappingURL=usePopoverSurface.js.map"],"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","getNativeElementProps","useMergedRefs","role","undefined","onMouseEnter","onMouseEnterOriginal","onMouseLeave","onMouseLeaveOriginal","onKeyDown","onKeyDownOriginal","e","_contentRef_current","key","current","contains","target"],"mappings":";;;;+BAaaA;;aAAAA;;;6DAbU;gCAC8B;8BAClB;gCACQ;AAUpC,MAAMA,6BAA6B,CAACC,OAAOC,MAAQ;IACxD,MAAMC,aAAaC,IAAAA,0CAA0B,EAACC,CAAAA,UAAWA,QAAQF,UAAU;IAC3E,MAAMG,cAAcF,IAAAA,0CAA0B,EAACC,CAAAA,UAAWA,QAAQC,WAAW;IAC7E,MAAMC,UAAUH,IAAAA,0CAA0B,EAACC,CAAAA,UAAWA,QAAQE,OAAO;IACrE,MAAMC,YAAYJ,IAAAA,0CAA0B,EAACC,CAAAA,UAAWA,QAAQG,SAAS;IACzE,MAAMC,WAAWL,IAAAA,0CAA0B,EAACC,CAAAA,UAAWA,QAAQI,QAAQ;IACvE,MAAMC,OAAON,IAAAA,0CAA0B,EAACC,CAAAA,UAAWA,QAAQK,IAAI;IAC/D,MAAMC,YAAYP,IAAAA,0CAA0B,EAACC,CAAAA,UAAWA,QAAQM,SAAS;IACzE,MAAMC,aAAaR,IAAAA,0CAA0B,EAACC,CAAAA,UAAWA,QAAQO,UAAU;IAC3E,MAAMC,YAAYT,IAAAA,0CAA0B,EAACC,CAAAA,UAAWA,QAAQQ,SAAS;IACzE,MAAMC,iBAAiBV,IAAAA,0CAA0B,EAACC,CAAAA,UAAWA,QAAQS,cAAc;IACnF,MAAMC,SAASX,IAAAA,0CAA0B,EAACC,CAAAA,UAAWA,QAAQU,MAAM;IACnE,MAAM,EACJC,gBAAe,EAChB,GAAGC,IAAAA,gCAAkB,EAAC;QACrBJ;QACAK,iBAAiB,CAACJ;QAClBK,iBAAiB,CAACN;IACpB;IACA,MAAMO,QAAQ;QACZL;QACAH;QACAD;QACAD;QACAD;QACAD;QACAa,YAAY;YACVC,MAAM;QACR;QACAA,MAAMC,IAAAA,qCAAqB,EAAC,OAAO;YACjCrB,KAAKsB,IAAAA,6BAAa,EAACtB,KAAKC;YACxBsB,MAAMZ,YAAY,WAAW,OAAO;YACpC,cAAcA,YAAY,IAAI,GAAGa,SAAS;YAC1C,GAAGV,eAAe;YAClB,GAAGf,KAAK;QACV;IACF;IACA,MAAM,EACJ0B,cAAcC,qBAAoB,EAClCC,cAAcC,qBAAoB,EAClCC,WAAWC,kBAAiB,EAC7B,GAAGZ,MAAME,IAAI;IACdF,MAAME,IAAI,CAACK,YAAY,GAAGM,CAAAA,IAAK;QAC7B,IAAI3B,aAAa;YACfC,QAAQ0B,GAAG,IAAI;QACjB,CAAC;QACDL,yBAAyB,IAAI,IAAIA,yBAAyB,KAAK,IAAI,KAAK,IAAIA,qBAAqBK,EAAE;IACrG;IACAb,MAAME,IAAI,CAACO,YAAY,GAAGI,CAAAA,IAAK;QAC7B,IAAI3B,aAAa;YACfC,QAAQ0B,GAAG,KAAK;QAClB,CAAC;QACDH,yBAAyB,IAAI,IAAIA,yBAAyB,KAAK,IAAI,KAAK,IAAIA,qBAAqBG,EAAE;IACrG;IACAb,MAAME,IAAI,CAACS,SAAS,GAAGE,CAAAA,IAAK;QAC1B,IAAIC;QACJ,8DAA8D;QAC9D,mHAAmH;QACnH,IAAID,EAAEE,GAAG,KAAK,YAAa,CAAA,AAACD,CAAAA,sBAAsB/B,WAAWiC,OAAO,AAAD,MAAO,IAAI,IAAIF,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBG,QAAQ,CAACJ,EAAEK,MAAM,CAAC,AAAD,GAAI;YACnK/B,QAAQ0B,GAAG,KAAK;QAClB,CAAC;QACDD,sBAAsB,IAAI,IAAIA,sBAAsB,KAAK,IAAI,KAAK,IAAIA,kBAAkBC,EAAE;IAC5F;IACA,OAAOb;AACT,GACA,6CAA6C"}
|