Initial commit

This commit is contained in:
2025-03-07 19:22:02 +01:00
commit 4a98255d83
55743 changed files with 5280367 additions and 0 deletions
@@ -0,0 +1,19 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "Popover", {
enumerable: true,
get: function() {
return Popover;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _usePopover = require("./usePopover");
const _renderPopover = require("./renderPopover");
const Popover = (props)=>{
const state = (0, _usePopover.usePopover_unstable)(props);
return (0, _renderPopover.renderPopover_unstable)(state);
};
Popover.displayName = 'Popover';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Popover/Popover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { usePopover_unstable } from './usePopover';\nimport { renderPopover_unstable } from './renderPopover';\nimport type { PopoverProps } from './Popover.types';\n\n/**\n * Wrapper component that manages state for a PopoverTrigger and a PopoverSurface components.\n */\nexport const Popover: React.FC<PopoverProps> = props => {\n const state = usePopover_unstable(props);\n\n return renderPopover_unstable(state);\n};\n\nPopover.displayName = 'Popover';\n"],"names":["Popover","props","state","usePopover_unstable","renderPopover_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;","mappings":";;;;+BAQaA;;;eAAAA;;;;iEARU;4BACa;+BACG;AAMhC,MAAMA,UAAkCC,CAAAA;IAC7C,MAAMC,QAAQC,IAAAA,+BAAAA,EAAoBF;IAElC,OAAOG,IAAAA,qCAAAA,EAAuBF;AAChC;AAEAF,QAAQK,WAAW,GAAG"}
@@ -0,0 +1,6 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
File diff suppressed because one or more lines are too long
@@ -0,0 +1,18 @@
/**
* @internal
* The default value of the tooltip's border radius (borderRadiusMedium).
*
* Unfortunately, Popper requires it to be specified as a variable instead of using CSS.
* While we could use getComputedStyle, that adds a performance penalty for something that
* will likely never change.
*/ "use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "popoverSurfaceBorderRadius", {
enumerable: true,
get: function() {
return popoverSurfaceBorderRadius;
}
});
const popoverSurfaceBorderRadius = 4;
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Popover/constants.ts"],"sourcesContent":["/**\n * @internal\n * The default value of the tooltip's border radius (borderRadiusMedium).\n *\n * Unfortunately, Popper requires it to be specified as a variable instead of using CSS.\n * While we could use getComputedStyle, that adds a performance penalty for something that\n * will likely never change.\n */\nexport const popoverSurfaceBorderRadius = 4;\n"],"names":["popoverSurfaceBorderRadius"],"rangeMappings":";;;;;;;;;;;;;;;;;","mappings":"AAAA;;;;;;;CAOC;;;;+BACYA;;;eAAAA;;;AAAN,MAAMA,6BAA6B"}
@@ -0,0 +1,24 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
Popover: function() {
return _Popover.Popover;
},
renderPopover_unstable: function() {
return _renderPopover.renderPopover_unstable;
},
usePopover_unstable: function() {
return _usePopover.usePopover_unstable;
}
});
const _Popover = require("./Popover");
const _renderPopover = require("./renderPopover");
const _usePopover = require("./usePopover");
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Popover/index.ts"],"sourcesContent":["export { Popover } from './Popover';\nexport type { OnOpenChangeData, OpenPopoverEvents, PopoverProps, PopoverSize, PopoverState } from './Popover.types';\nexport { renderPopover_unstable } from './renderPopover';\nexport { usePopover_unstable } from './usePopover';\n"],"names":["Popover","renderPopover_unstable","usePopover_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,OAAO;eAAPA,gBAAO;;IAEPC,sBAAsB;eAAtBA,qCAAsB;;IACtBC,mBAAmB;eAAnBA,+BAAmB;;;yBAHJ;+BAEe;4BACH"}
@@ -0,0 +1,35 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "renderPopover_unstable", {
enumerable: true,
get: function() {
return renderPopover_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _popoverContext = require("../../popoverContext");
const renderPopover_unstable = (state)=>{
const { appearance, arrowRef, contentRef, inline, mountNode, open, openOnContext, openOnHover, setOpen, size, toggleOpen, trapFocus, triggerRef, withArrow, inertTrapFocus } = state;
return /*#__PURE__*/ _react.createElement(_popoverContext.PopoverContext.Provider, {
value: {
appearance,
arrowRef,
contentRef,
inline,
mountNode,
open,
openOnContext,
openOnHover,
setOpen,
toggleOpen,
triggerRef,
size,
trapFocus,
inertTrapFocus,
withArrow
}
}, state.popoverTrigger, state.open && state.popoverSurface);
};
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Popover/renderPopover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { PopoverContext } from '../../popoverContext';\nimport type { PopoverState } from './Popover.types';\n\n/**\n * Render the final JSX of Popover\n */\nexport const renderPopover_unstable = (state: PopoverState) => {\n const {\n appearance,\n arrowRef,\n contentRef,\n inline,\n mountNode,\n open,\n openOnContext,\n openOnHover,\n setOpen,\n size,\n toggleOpen,\n trapFocus,\n triggerRef,\n withArrow,\n inertTrapFocus,\n } = state;\n\n return (\n <PopoverContext.Provider\n value={{\n appearance,\n arrowRef,\n contentRef,\n inline,\n mountNode,\n open,\n openOnContext,\n openOnHover,\n setOpen,\n toggleOpen,\n triggerRef,\n size,\n trapFocus,\n inertTrapFocus,\n withArrow,\n }}\n >\n {state.popoverTrigger}\n {state.open && state.popoverSurface}\n </PopoverContext.Provider>\n );\n};\n"],"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"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAOaA;;;eAAAA;;;;iEAPU;gCACQ;AAMxB,MAAMA,yBAAyB,CAACC;IACrC,MAAM,EACJC,UAAU,EACVC,QAAQ,EACRC,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,IAAI,EACJC,aAAa,EACbC,WAAW,EACXC,OAAO,EACPC,IAAI,EACJC,UAAU,EACVC,SAAS,EACTC,UAAU,EACVC,SAAS,EACTC,cAAc,EACf,GAAGf;IAEJ,OAAA,WAAA,GACEgB,OAAAC,aAAA,CAACC,8BAAAA,CAAeC,QAAQ,EAAA;QACtBC,OAAO;YACLnB;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAE;YACAE;YACAH;YACAE;YACAG;YACAD;QACF;OAECd,MAAMqB,cAAc,EACpBrB,MAAMM,IAAI,IAAIN,MAAMsB,cAAc;AAGzC"}
@@ -0,0 +1,199 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "usePopover_unstable", {
enumerable: true,
get: function() {
return usePopover_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactutilities = require("@fluentui/react-utilities");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const _reactpositioning = require("@fluentui/react-positioning");
const _reacttabster = require("@fluentui/react-tabster");
const _index = require("../PopoverSurface/index");
const _constants = require("./constants");
const usePopover_unstable = (props)=>{
const [contextTarget, setContextTarget] = (0, _reactpositioning.usePositioningMouseTarget)();
const initialState = {
size: 'medium',
contextTarget,
setContextTarget,
...props
};
const children = _react.Children.toArray(props.children);
if (process.env.NODE_ENV !== 'production') {
if (children.length === 0) {
// eslint-disable-next-line no-console
console.warn('Popover must contain at least one child');
}
if (children.length > 2) {
// eslint-disable-next-line no-console
console.warn('Popover must contain at most two children');
}
}
let popoverTrigger = undefined;
let popoverSurface = undefined;
if (children.length === 2) {
popoverTrigger = children[0];
popoverSurface = children[1];
} else if (children.length === 1) {
popoverSurface = children[0];
}
const [open, setOpenState] = useOpenState(initialState);
const [setOpenTimeout, clearOpenTimeout] = (0, _reactutilities.useTimeout)();
const setOpen = (0, _reactutilities.useEventCallback)((e, shouldOpen)=>{
clearOpenTimeout();
if (!(e instanceof Event) && e.persist) {
// < React 17 still uses pooled synthetic events
e.persist();
}
if (e.type === 'mouseleave') {
var _props_mouseLeaveDelay;
// FIXME leaking Node timeout type
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
setOpenTimeout(()=>{
setOpenState(e, shouldOpen);
}, (_props_mouseLeaveDelay = props.mouseLeaveDelay) !== null && _props_mouseLeaveDelay !== void 0 ? _props_mouseLeaveDelay : 500);
} else {
setOpenState(e, shouldOpen);
}
});
const toggleOpen = _react.useCallback((e)=>{
setOpen(e, !open);
}, [
setOpen,
open
]);
const positioningRefs = usePopoverRefs(initialState);
const { targetDocument } = (0, _reactsharedcontexts.useFluent_unstable)();
var _props_closeOnIframeFocus;
(0, _reactutilities.useOnClickOutside)({
contains: _reactutilities.elementContains,
element: targetDocument,
callback: (ev)=>setOpen(ev, false),
refs: [
positioningRefs.triggerRef,
positioningRefs.contentRef
],
disabled: !open,
disabledFocusOnIframe: !((_props_closeOnIframeFocus = props.closeOnIframeFocus) !== null && _props_closeOnIframeFocus !== void 0 ? _props_closeOnIframeFocus : true)
});
// only close on scroll for context, or when closeOnScroll is specified
const closeOnScroll = initialState.openOnContext || initialState.closeOnScroll;
(0, _reactutilities.useOnScrollOutside)({
contains: _reactutilities.elementContains,
element: targetDocument,
callback: (ev)=>setOpen(ev, false),
refs: [
positioningRefs.triggerRef,
positioningRefs.contentRef
],
disabled: !open || !closeOnScroll
});
const { findFirstFocusable } = (0, _reacttabster.useFocusFinders)();
const activateModal = (0, _reacttabster.useActivateModal)();
_react.useEffect(()=>{
if (props.unstable_disableAutoFocus) {
return;
}
const contentElement = positioningRefs.contentRef.current;
if (open && contentElement) {
var _contentElement_getAttribute;
const shouldFocusContainer = !isNaN((_contentElement_getAttribute = contentElement.getAttribute('tabIndex')) !== null && _contentElement_getAttribute !== void 0 ? _contentElement_getAttribute : undefined);
const firstFocusable = shouldFocusContainer ? contentElement : findFirstFocusable(contentElement);
firstFocusable === null || firstFocusable === void 0 ? void 0 : firstFocusable.focus();
if (shouldFocusContainer) {
// Modal activation happens automatically when something inside the modal is focused programmatically.
// When the container is focused, we need to activate the modal manually.
activateModal(contentElement);
}
}
}, [
findFirstFocusable,
activateModal,
open,
positioningRefs.contentRef,
props.unstable_disableAutoFocus
]);
var _props_inertTrapFocus, _props_inline;
return {
...initialState,
...positioningRefs,
// eslint-disable-next-line @typescript-eslint/no-deprecated
inertTrapFocus: (_props_inertTrapFocus = props.inertTrapFocus) !== null && _props_inertTrapFocus !== void 0 ? _props_inertTrapFocus : props.legacyTrapFocus === undefined ? false : !props.legacyTrapFocus,
popoverTrigger,
popoverSurface,
open,
setOpen,
toggleOpen,
setContextTarget,
contextTarget,
inline: (_props_inline = props.inline) !== null && _props_inline !== void 0 ? _props_inline : false
};
};
/**
* Creates and manages the Popover open state
*/ function useOpenState(state) {
'use no memo';
const onOpenChange = (0, _reactutilities.useEventCallback)((e, data)=>{
var _state_onOpenChange;
return (_state_onOpenChange = state.onOpenChange) === null || _state_onOpenChange === void 0 ? void 0 : _state_onOpenChange.call(state, e, data);
});
const [open, setOpenState] = (0, _reactutilities.useControllableState)({
state: state.open,
defaultState: state.defaultOpen,
initialState: false
});
state.open = open !== undefined ? open : state.open;
const setContextTarget = state.setContextTarget;
const setOpen = _react.useCallback((e, shouldOpen)=>{
if (shouldOpen && e.type === 'contextmenu') {
setContextTarget(e);
}
if (!shouldOpen) {
setContextTarget(undefined);
}
setOpenState(shouldOpen);
onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(e, {
open: shouldOpen
});
}, [
setOpenState,
onOpenChange,
setContextTarget
]);
return [
open,
setOpen
];
}
/**
* Creates and sets the necessary trigger, target and content refs used by Popover
*/ function usePopoverRefs(state) {
'use no memo';
const positioningOptions = {
position: 'above',
align: 'center',
arrowPadding: 2 * _constants.popoverSurfaceBorderRadius,
target: state.openOnContext ? state.contextTarget : undefined,
...(0, _reactpositioning.resolvePositioningShorthand)(state.positioning)
};
// no reason to render arrow when covering the target
if (positioningOptions.coverTarget) {
state.withArrow = false;
}
if (state.withArrow) {
positioningOptions.offset = (0, _reactpositioning.mergeArrowOffset)(positioningOptions.offset, _index.arrowHeights[state.size]);
}
const { targetRef: triggerRef, containerRef: contentRef, arrowRef } = (0, _reactpositioning.usePositioning)(positioningOptions);
return {
triggerRef,
contentRef,
arrowRef
};
}
File diff suppressed because one or more lines are too long
@@ -0,0 +1,23 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "PopoverSurface", {
enumerable: true,
get: function() {
return PopoverSurface;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _usePopoverSurface = require("./usePopoverSurface");
const _renderPopoverSurface = require("./renderPopoverSurface");
const _usePopoverSurfaceStylesstyles = require("./usePopoverSurfaceStyles.styles");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const PopoverSurface = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const state = (0, _usePopoverSurface.usePopoverSurface_unstable)(props, ref);
(0, _usePopoverSurfaceStylesstyles.usePopoverSurfaceStyles_unstable)(state);
(0, _reactsharedcontexts.useCustomStyleHook_unstable)('usePopoverSurfaceStyles_unstable')(state);
return (0, _renderPopoverSurface.renderPopoverSurface_unstable)(state);
});
PopoverSurface.displayName = 'PopoverSurface';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/PopoverSurface/PopoverSurface.tsx"],"sourcesContent":["import * as React from 'react';\nimport { usePopoverSurface_unstable } from './usePopoverSurface';\nimport { renderPopoverSurface_unstable } from './renderPopoverSurface';\nimport { usePopoverSurfaceStyles_unstable } from './usePopoverSurfaceStyles.styles';\nimport type { PopoverSurfaceProps } from './PopoverSurface.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * PopoverSurface component renders react children in a positioned box\n */\nexport const PopoverSurface: ForwardRefComponent<PopoverSurfaceProps> = React.forwardRef((props, ref) => {\n const state = usePopoverSurface_unstable(props, ref);\n\n usePopoverSurfaceStyles_unstable(state);\n\n useCustomStyleHook_unstable('usePopoverSurfaceStyles_unstable')(state);\n\n return renderPopoverSurface_unstable(state);\n});\n\nPopoverSurface.displayName = 'PopoverSurface';\n"],"names":["PopoverSurface","React","forwardRef","props","ref","state","usePopoverSurface_unstable","usePopoverSurfaceStyles_unstable","useCustomStyleHook_unstable","renderPopoverSurface_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAWaA;;;eAAAA;;;;iEAXU;mCACoB;sCACG;+CACG;qCAGL;AAKrC,MAAMA,iBAAAA,WAAAA,GAA2DC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC/F,MAAMC,QAAQC,IAAAA,6CAAAA,EAA2BH,OAAOC;IAEhDG,IAAAA,+DAAAA,EAAiCF;IAEjCG,IAAAA,gDAAAA,EAA4B,oCAAoCH;IAEhE,OAAOI,IAAAA,mDAAAA,EAA8BJ;AACvC;AAEAL,eAAeU,WAAW,GAAG"}
@@ -0,0 +1,6 @@
/**
* PopoverSurface State
*/ "use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/PopoverSurface/PopoverSurface.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { PopoverContextValue } from '../../popoverContext';\n\n/**\n * PopoverSurface Props\n */\nexport type PopoverSurfaceProps = ComponentProps<PopoverSurfaceSlots>;\n\n/**\n * Names of the slots in PopoverSurfaceProps\n */\nexport type PopoverSurfaceSlots = {\n root: Slot<'div'>;\n};\n\n/**\n * PopoverSurface State\n */\nexport type PopoverSurfaceState = ComponentState<PopoverSurfaceSlots> &\n Pick<PopoverContextValue, 'appearance' | 'arrowRef' | 'inline' | 'mountNode' | 'size' | 'withArrow'> & {\n /**\n * CSS class for the arrow element\n */\n arrowClassName?: string;\n };\n"],"names":[],"rangeMappings":";;","mappings":"AAeA;;CAEC"}
@@ -0,0 +1,34 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
PopoverSurface: function() {
return _PopoverSurface.PopoverSurface;
},
arrowHeights: function() {
return _usePopoverSurfaceStylesstyles.arrowHeights;
},
popoverSurfaceClassNames: function() {
return _usePopoverSurfaceStylesstyles.popoverSurfaceClassNames;
},
renderPopoverSurface_unstable: function() {
return _renderPopoverSurface.renderPopoverSurface_unstable;
},
usePopoverSurfaceStyles_unstable: function() {
return _usePopoverSurfaceStylesstyles.usePopoverSurfaceStyles_unstable;
},
usePopoverSurface_unstable: function() {
return _usePopoverSurface.usePopoverSurface_unstable;
}
});
const _PopoverSurface = require("./PopoverSurface");
const _renderPopoverSurface = require("./renderPopoverSurface");
const _usePopoverSurface = require("./usePopoverSurface");
const _usePopoverSurfaceStylesstyles = require("./usePopoverSurfaceStyles.styles");
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/PopoverSurface/index.ts"],"sourcesContent":["export { PopoverSurface } from './PopoverSurface';\nexport type { PopoverSurfaceProps, PopoverSurfaceSlots, PopoverSurfaceState } from './PopoverSurface.types';\nexport { renderPopoverSurface_unstable } from './renderPopoverSurface';\nexport { usePopoverSurface_unstable } from './usePopoverSurface';\nexport {\n arrowHeights,\n popoverSurfaceClassNames,\n usePopoverSurfaceStyles_unstable,\n} from './usePopoverSurfaceStyles.styles';\n"],"names":["PopoverSurface","arrowHeights","popoverSurfaceClassNames","renderPopoverSurface_unstable","usePopoverSurfaceStyles_unstable","usePopoverSurface_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,cAAc;eAAdA,8BAAc;;IAKrBC,YAAY;eAAZA,2CAAY;;IACZC,wBAAwB;eAAxBA,uDAAwB;;IAJjBC,6BAA6B;eAA7BA,mDAA6B;;IAKpCC,gCAAgC;eAAhCA,+DAAgC;;IAJzBC,0BAA0B;eAA1BA,6CAA0B;;;gCAHJ;sCAEe;mCACH;+CAKpC"}
@@ -0,0 +1,32 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "renderPopoverSurface_unstable", {
enumerable: true,
get: function() {
return renderPopoverSurface_unstable;
}
});
const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
const _reactutilities = require("@fluentui/react-utilities");
const _reactportal = require("@fluentui/react-portal");
const renderPopoverSurface_unstable = (state)=>{
(0, _reactutilities.assertSlots)(state);
const surface = /*#__PURE__*/ (0, _jsxruntime.jsxs)(state.root, {
children: [
state.withArrow && /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
ref: state.arrowRef,
className: state.arrowClassName
}),
state.root.children
]
});
if (state.inline) {
return surface;
}
return /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactportal.Portal, {
mountNode: state.mountNode,
children: surface
});
};
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/PopoverSurface/renderPopoverSurface.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { Portal } from '@fluentui/react-portal';\nimport type { PopoverSurfaceSlots, PopoverSurfaceState } from './PopoverSurface.types';\n\n/**\n * Render the final JSX of PopoverSurface\n */\nexport const renderPopoverSurface_unstable = (state: PopoverSurfaceState) => {\n assertSlots<PopoverSurfaceSlots>(state);\n\n const surface = (\n <state.root>\n {state.withArrow && <div ref={state.arrowRef} className={state.arrowClassName} />}\n {state.root.children}\n </state.root>\n );\n\n if (state.inline) {\n return surface;\n }\n\n return <Portal mountNode={state.mountNode}>{surface}</Portal>;\n};\n"],"names":["renderPopoverSurface_unstable","state","assertSlots","surface","_jsxs","root","withArrow","_jsx","div","ref","arrowRef","className","arrowClassName","children","inline","Portal","mountNode"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;4BARb;gCAC4B;6BACL;AAMhB,MAAMA,gCAAgC,CAACC;IAC5CC,IAAAA,2BAAAA,EAAiCD;IAEjC,MAAME,UAAAA,WAAAA,GACJC,IAAAA,gBAAA,EAACH,MAAMI,IAAI,EAAA;;YACRJ,MAAMK,SAAS,IAAA,WAAA,GAAIC,IAAAA,eAAA,EAACC,OAAAA;gBAAIC,KAAKR,MAAMS,QAAQ;gBAAEC,WAAWV,MAAMW,cAAc;;YAC5EX,MAAMI,IAAI,CAACQ,QAAQ;;;IAIxB,IAAIZ,MAAMa,MAAM,EAAE;QAChB,OAAOX;IACT;IAEA,OAAA,WAAA,GAAOI,IAAAA,eAAA,EAACQ,mBAAAA,EAAAA;QAAOC,WAAWf,MAAMe,SAAS;kBAAGb;;AAC9C"}
@@ -0,0 +1,80 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "usePopoverSurface_unstable", {
enumerable: true,
get: function() {
return usePopoverSurface_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactutilities = require("@fluentui/react-utilities");
const _reacttabster = require("@fluentui/react-tabster");
const _popoverContext = require("../../popoverContext");
const usePopoverSurface_unstable = (props, ref)=>{
const contentRef = (0, _popoverContext.usePopoverContext_unstable)((context)=>context.contentRef);
const openOnHover = (0, _popoverContext.usePopoverContext_unstable)((context)=>context.openOnHover);
const setOpen = (0, _popoverContext.usePopoverContext_unstable)((context)=>context.setOpen);
const mountNode = (0, _popoverContext.usePopoverContext_unstable)((context)=>context.mountNode);
const arrowRef = (0, _popoverContext.usePopoverContext_unstable)((context)=>context.arrowRef);
const size = (0, _popoverContext.usePopoverContext_unstable)((context)=>context.size);
const withArrow = (0, _popoverContext.usePopoverContext_unstable)((context)=>context.withArrow);
const appearance = (0, _popoverContext.usePopoverContext_unstable)((context)=>context.appearance);
const trapFocus = (0, _popoverContext.usePopoverContext_unstable)((context)=>context.trapFocus);
const inertTrapFocus = (0, _popoverContext.usePopoverContext_unstable)((context)=>context.inertTrapFocus);
const inline = (0, _popoverContext.usePopoverContext_unstable)((context)=>context.inline);
const { modalAttributes } = (0, _reacttabster.useModalAttributes)({
trapFocus,
legacyTrapFocus: !inertTrapFocus,
alwaysFocusable: !trapFocus
});
const state = {
inline,
appearance,
withArrow,
size,
arrowRef,
mountNode,
components: {
root: 'div'
},
root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('div', {
// FIXME:
// `contentRef` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`
// but since it would be a breaking change to fix it, we are casting ref to it's proper type
ref: (0, _reactutilities.useMergedRefs)(ref, contentRef),
role: trapFocus ? 'dialog' : 'group',
'aria-modal': trapFocus ? true : undefined,
...modalAttributes,
...props
}), {
elementType: 'div'
})
};
const { onMouseEnter: onMouseEnterOriginal, onMouseLeave: onMouseLeaveOriginal, onKeyDown: onKeyDownOriginal } = state.root;
state.root.onMouseEnter = (e)=>{
if (openOnHover) {
setOpen(e, true);
}
onMouseEnterOriginal === null || onMouseEnterOriginal === void 0 ? void 0 : onMouseEnterOriginal(e);
};
state.root.onMouseLeave = (e)=>{
if (openOnHover) {
setOpen(e, false);
}
onMouseLeaveOriginal === null || onMouseLeaveOriginal === void 0 ? void 0 : onMouseLeaveOriginal(e);
};
state.root.onKeyDown = (e)=>{
var _contentRef_current;
// only close if the event happened inside the current popover
// If using a stack of inline popovers, the user should call `stopPropagation` to avoid dismissing the entire stack
if (e.key === 'Escape' && ((_contentRef_current = contentRef.current) === null || _contentRef_current === void 0 ? void 0 : _contentRef_current.contains(e.target))) {
e.preventDefault();
setOpen(e, false);
}
onKeyDownOriginal === null || onKeyDownOriginal === void 0 ? void 0 : onKeyDownOriginal(e);
};
return state;
};
File diff suppressed because one or more lines are too long
@@ -0,0 +1,302 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
arrowHeights: function() {
return arrowHeights;
},
popoverSurfaceClassNames: function() {
return popoverSurfaceClassNames;
},
usePopoverSurfaceStyles_unstable: function() {
return usePopoverSurfaceStyles_unstable;
}
});
const _react = require("@griffel/react");
const popoverSurfaceClassNames = {
root: 'fui-PopoverSurface'
};
const arrowHeights = {
small: 6,
medium: 8,
large: 8
};
/**
* Styles for the root slot
*/ const useStyles = /*#__PURE__*/ (0, _react.__styles)({
root: {
sj55zd: "f19n0e5",
De3pzq: "fxugw4r",
Beyfa6y: 0,
Bbmb7ep: 0,
Btl43ni: 0,
B7oj6ja: 0,
Dimara: "ft85np5",
Bgfg5da: 0,
B9xav0g: 0,
oivjwe: 0,
Bn0qgzm: 0,
B4g9neb: 0,
zhjwy3: 0,
wvpqe5: 0,
ibv6hh: 0,
u1mtju: 0,
h3c5rm: 0,
vrafjx: 0,
Bekrc4i: 0,
i8vvqc: 0,
g2u3we: 0,
icvyot: 0,
B4j52fo: 0,
irswps: "f9ggezi",
Bahqtrf: "fk6fouc",
Be2twd7: "fkhj508",
Bhrd7zp: "figsok6",
Bg96gwp: "f1i3iumi",
B93otf3: "f1hdglry",
vin17d: "fo1kyvf",
Ezkn3b: "fetxo7e",
nyiy2g: "f8x1vz1",
swvrvq: "f8g0anz",
Bkovbt3: "fezwn9i",
hgjdhn: "fz5efge",
fsy9dk: "f1ydixl4",
B3ogreh: "f8dgqj5",
jv49x5: "fnyfnr8",
Bk7o48c: "fgw77r4",
Bv12yb3: "ftje0s4",
vcguit: "fxes1gr",
z0t1cu: "fi19xcv",
Bks05zx: "f1mzajhk",
yckwsp: "fgez7cy",
Bvtglag: "fjp4h9y",
Bhu2qc9: "fymb6k8"
},
inline: {
Bj3rh1h: "f19g0ac"
},
inverted: {
De3pzq: "fg3r6xk",
sj55zd: "fonrgv7"
},
brand: {
De3pzq: "ffp7eso",
sj55zd: "f1phragk"
},
smallPadding: {
Byoj8tv: 0,
uwmqm3: 0,
z189sj: 0,
z8tnut: 0,
B0ocmuz: "f1sy4kr4"
},
mediumPadding: {
Byoj8tv: 0,
uwmqm3: 0,
z189sj: 0,
z8tnut: 0,
B0ocmuz: "f4zyqsv"
},
largePadding: {
Byoj8tv: 0,
uwmqm3: 0,
z189sj: 0,
z8tnut: 0,
B0ocmuz: "fop8ug2"
},
smallArrow: {
rhnwrx: "f1s3jn22",
Bdy53xb: "fv40uqz"
},
mediumLargeArrow: {
rhnwrx: "f1f72gjr",
Bdy53xb: "f69yoe5"
},
arrow: {
B7ck84d: "f1ewtqcl",
qhf8xq: "f1euv43f",
Bj3rh1h: "f1bsuimh",
De3pzq: "f1u2r49w",
B2eet1l: "fqhgnl",
Beyfa6y: "f17bz04i",
Bz10aip: "f36o3x3",
Bqenvij: "fzofk8q",
a9b677: "f1wbx1ie",
Ftih45: "f1wl9k8s",
Br0sdwz: "f1aocrix",
cmx5o7: "f1ljr5q2",
susq4k: 0,
Biibvgv: 0,
Bicfajf: 0,
qehafq: 0,
Brs5u8j: "f155f1qt",
Ccq8qp: "f9mhzq7",
Baz25je: "fr6rhvx",
Bcgcnre: 0,
Bqjgrrk: 0,
qa3bma: 0,
y0oebl: 0,
Biqmznv: 0,
Bm6vgfq: 0,
Bbv0w2i: 0,
uvfttm: 0,
eqrjj: 0,
Bk5zm6e: 0,
m598lv: 0,
B4f6apu: 0,
ydt019: 0,
Bq4z7u6: 0,
Bdkvgpv: 0,
B0qfbqy: 0,
kj8mxx: "f1kc0wz4",
r59vdv: "fgq90dz",
Bkw5xw4: "fq0y47f",
hl6cv3: "f1pwrbz6",
aea9ga: "f1hxxcvm",
yayu3t: "fw8rgyo",
Bhsv975: "f1wnzycx",
rhl9o9: "f1730wal",
B7gxrvb: "f1fy4ixr",
B6q6orb: "fobkauc",
B0lu1f8: "f16bqv1l"
}
}, {
d: [
".f19n0e5{color:var(--colorNeutralForeground1);}",
".fxugw4r{background-color:var(--colorNeutralBackground1);}",
[
".ft85np5{border-radius:var(--borderRadiusMedium);}",
{
p: -1
}
],
[
".f9ggezi{border:1px solid var(--colorTransparentStroke);}",
{
p: -2
}
],
".fk6fouc{font-family:var(--fontFamilyBase);}",
".fkhj508{font-size:var(--fontSizeBase300);}",
".figsok6{font-weight:var(--fontWeightRegular);}",
".f1i3iumi{line-height:var(--lineHeightBase300);}",
".f1hdglry{animation-composition:replace,accumulate;}",
".fo1kyvf{animation-duration:var(--durationSlower);}",
".fetxo7e{animation-timing-function:var(--curveDecelerateMid);}",
".f8x1vz1{--fui-positioning-slide-distance-x:0px;}",
".f8g0anz{--fui-positioning-slide-distance-y:10px;}",
".fezwn9i[data-popper-placement^=right]{--fui-positioning-slide-distance-x:-10px;}",
".fz5efge[data-popper-placement^=right]{--fui-positioning-slide-distance-y:0px;}",
".f1ydixl4[data-popper-placement^=bottom]{--fui-positioning-slide-distance-x:0px;}",
".f8dgqj5[data-popper-placement^=bottom]{--fui-positioning-slide-distance-y:-10px;}",
".fnyfnr8[data-popper-placement^=left]{--fui-positioning-slide-distance-x:10px;}",
".fgw77r4[data-popper-placement^=left]{--fui-positioning-slide-distance-y:0px;}",
".ftje0s4{animation-name:f5j8bii,f79suad;}",
".fymb6k8{filter:drop-shadow(0 0 2px var(--colorNeutralShadowAmbient)) drop-shadow(0 8px 16px var(--colorNeutralShadowKey));}",
".f19g0ac{z-index:1;}",
".fg3r6xk{background-color:var(--colorNeutralBackgroundStatic);}",
".fonrgv7{color:var(--colorNeutralForegroundStaticInverted);}",
".ffp7eso{background-color:var(--colorBrandBackground);}",
".f1phragk{color:var(--colorNeutralForegroundOnBrand);}",
[
".f1sy4kr4{padding:12px;}",
{
p: -1
}
],
[
".f4zyqsv{padding:16px;}",
{
p: -1
}
],
[
".fop8ug2{padding:20px;}",
{
p: -1
}
],
".f1s3jn22{--fui-positioning-arrow-height:8.484px;}",
".fv40uqz{--fui-positioning-arrow-offset:-4.242px;}",
".f1f72gjr{--fui-positioning-arrow-height:11.312px;}",
".f69yoe5{--fui-positioning-arrow-offset:-5.656px;}",
".f1ewtqcl{box-sizing:border-box;}",
".f1euv43f{position:absolute;}",
".f1bsuimh{z-index:-1;}",
".f1u2r49w{background-color:inherit;}",
".fqhgnl{background-clip:content-box;}",
".f17bz04i{border-bottom-left-radius:var(--borderRadiusSmall);}",
".f36o3x3{transform:rotate(var(--fui-positioning-arrow-angle));}",
".fzofk8q{height:var(--fui-positioning-arrow-height);}",
".f1wbx1ie{width:var(--fui-positioning-arrow-height);}",
".f1wl9k8s::before{content:\"\";}",
".f1aocrix::before{display:block;}",
".f1ljr5q2::before{background-color:inherit;}",
[
".f155f1qt::before{margin:-1px;}",
{
p: -1
}
],
".f9mhzq7::before{width:100%;}",
".fr6rhvx::before{height:100%;}",
[
".f1kc0wz4::before{border:1px solid var(--colorTransparentStroke);}",
{
p: -2
}
],
".fgq90dz::before{border-bottom-left-radius:var(--borderRadiusSmall);}",
".fq0y47f::before{clip-path:polygon(0% 0%, 100% 100%, 0% 100%);}",
"[data-popper-placement^=\"top\"] .f1pwrbz6{bottom:var(--fui-positioning-arrow-offset);}",
"[data-popper-placement^=\"top\"] .f1hxxcvm{--fui-positioning-arrow-angle:-45deg;}",
"[data-popper-placement^=\"right\"] .fw8rgyo{left:var(--fui-positioning-arrow-offset);}",
"[data-popper-placement^=\"right\"] .f1wnzycx{--fui-positioning-arrow-angle:45deg;}",
"[data-popper-placement^=\"bottom\"] .f1730wal{top:var(--fui-positioning-arrow-offset);}",
"[data-popper-placement^=\"bottom\"] .f1fy4ixr{--fui-positioning-arrow-angle:135deg;}",
"[data-popper-placement^=\"left\"] .fobkauc{right:var(--fui-positioning-arrow-offset);}",
"[data-popper-placement^=\"left\"] .f16bqv1l{--fui-positioning-arrow-angle:225deg;}"
],
k: [
"@keyframes f5j8bii{from{opacity:0;}to{opacity:1;}}",
"@keyframes f79suad{from{transform:translate(var(--fui-positioning-slide-distance-x), var(--fui-positioning-slide-distance-y));}}"
],
m: [
[
"@media (prefers-reduced-motion){.fxes1gr[data-popper-placement]{animation-composition:replace;}}",
{
m: "(prefers-reduced-motion)"
}
],
[
"@media (prefers-reduced-motion){.fi19xcv[data-popper-placement]{animation-duration:1ms;}}",
{
m: "(prefers-reduced-motion)"
}
],
[
"@media (prefers-reduced-motion){.f1mzajhk[data-popper-placement]{animation-name:f5j8bii;}}",
{
m: "(prefers-reduced-motion)"
}
]
],
t: [
"@supports not (animation-composition: accumulate){.fgez7cy[data-popper-placement]{animation-composition:replace;}}",
"@supports not (animation-composition: accumulate){.fjp4h9y[data-popper-placement]{animation-name:f5j8bii;}}"
]
});
const usePopoverSurfaceStyles_unstable = (state)=>{
'use no memo';
const styles = useStyles();
state.root.className = (0, _react.mergeClasses)(popoverSurfaceClassNames.root, styles.root, state.inline && styles.inline, 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);
state.arrowClassName = (0, _react.mergeClasses)(styles.arrow, state.size === 'small' ? styles.smallArrow : styles.mediumLargeArrow);
return state;
};
File diff suppressed because one or more lines are too long
@@ -0,0 +1,21 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "PopoverTrigger", {
enumerable: true,
get: function() {
return PopoverTrigger;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _usePopoverTrigger = require("./usePopoverTrigger");
const _renderPopoverTrigger = require("./renderPopoverTrigger");
const PopoverTrigger = (props)=>{
const state = (0, _usePopoverTrigger.usePopoverTrigger_unstable)(props);
return (0, _renderPopoverTrigger.renderPopoverTrigger_unstable)(state);
};
PopoverTrigger.displayName = 'PopoverTrigger';
// type casting here is required to ensure internal type FluentTriggerComponent is not leaked
PopoverTrigger.isFluentTriggerComponent = true;
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/PopoverTrigger/PopoverTrigger.tsx"],"sourcesContent":["import * as React from 'react';\nimport { usePopoverTrigger_unstable } from './usePopoverTrigger';\nimport { renderPopoverTrigger_unstable } from './renderPopoverTrigger';\nimport type { FluentTriggerComponent } from '@fluentui/react-utilities';\nimport type { PopoverTriggerProps } from './PopoverTrigger.types';\n\n/**\n * Wraps a trigger element as an only child and adds the necessary event handling to open a popover.\n */\nexport const PopoverTrigger: React.FC<PopoverTriggerProps> = props => {\n const state = usePopoverTrigger_unstable(props);\n\n return renderPopoverTrigger_unstable(state);\n};\n\nPopoverTrigger.displayName = 'PopoverTrigger';\n// type casting here is required to ensure internal type FluentTriggerComponent is not leaked\n(PopoverTrigger as FluentTriggerComponent).isFluentTriggerComponent = true;\n"],"names":["PopoverTrigger","props","state","usePopoverTrigger_unstable","renderPopoverTrigger_unstable","displayName","isFluentTriggerComponent"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;;iEATU;mCACoB;sCACG;AAOvC,MAAMA,iBAAgDC,CAAAA;IAC3D,MAAMC,QAAQC,IAAAA,6CAAAA,EAA2BF;IAEzC,OAAOG,IAAAA,mDAAAA,EAA8BF;AACvC;AAEAF,eAAeK,WAAW,GAAG;AAC7B,6FAA6F;AAC5FL,eAA0CM,wBAAwB,GAAG"}
@@ -0,0 +1,6 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/PopoverTrigger/PopoverTrigger.types.ts"],"sourcesContent":["import { ARIAButtonResultProps, ARIAButtonType } from '@fluentui/react-aria';\nimport type { TriggerProps } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\n/**\n * PopoverTrigger Props\n */\nexport type PopoverTriggerProps = TriggerProps<PopoverTriggerChildProps> & {\n /**\n * Disables internal trigger mechanism that ensures a child provided will be a compliant ARIA button.\n * @default false\n */\n disableButtonEnhancement?: boolean;\n};\n\n/**\n * PopoverTrigger State\n */\nexport type PopoverTriggerState = {\n children: React.ReactElement | null;\n};\n\n/**\n * Props that are passed to the child of the DialogTrigger when cloned to ensure correct behaviour for the Dialog\n */\nexport type PopoverTriggerChildProps<Type extends ARIAButtonType = ARIAButtonType, Props = {}> = ARIAButtonResultProps<\n Type,\n Props & {\n 'aria-expanded'?: 'true' | 'false';\n ref: React.Ref<unknown>;\n /* eslint-disable @nx/workspace-consistent-callback-type -- can't change type of existing callback */\n onMouseEnter: React.MouseEventHandler<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>;\n onMouseLeave: React.MouseEventHandler<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>;\n onContextMenu: React.MouseEventHandler<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>;\n /* eslint-enable @nx/workspace-consistent-callback-type */\n }\n>;\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;iEAEuB"}
@@ -0,0 +1,24 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
PopoverTrigger: function() {
return _PopoverTrigger.PopoverTrigger;
},
renderPopoverTrigger_unstable: function() {
return _renderPopoverTrigger.renderPopoverTrigger_unstable;
},
usePopoverTrigger_unstable: function() {
return _usePopoverTrigger.usePopoverTrigger_unstable;
}
});
const _PopoverTrigger = require("./PopoverTrigger");
const _renderPopoverTrigger = require("./renderPopoverTrigger");
const _usePopoverTrigger = require("./usePopoverTrigger");
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/PopoverTrigger/index.ts"],"sourcesContent":["export { PopoverTrigger } from './PopoverTrigger';\nexport type { PopoverTriggerChildProps, PopoverTriggerProps, PopoverTriggerState } from './PopoverTrigger.types';\nexport { renderPopoverTrigger_unstable } from './renderPopoverTrigger';\nexport { usePopoverTrigger_unstable } from './usePopoverTrigger';\n"],"names":["PopoverTrigger","renderPopoverTrigger_unstable","usePopoverTrigger_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,cAAc;eAAdA,8BAAc;;IAEdC,6BAA6B;eAA7BA,mDAA6B;;IAC7BC,0BAA0B;eAA1BA,6CAA0B;;;gCAHJ;sCAEe;mCACH"}
@@ -0,0 +1,15 @@
/**
* Render the final JSX of PopoverTrigger
*/ "use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "renderPopoverTrigger_unstable", {
enumerable: true,
get: function() {
return renderPopoverTrigger_unstable;
}
});
const renderPopoverTrigger_unstable = (state)=>{
return state.children;
};
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/PopoverTrigger/renderPopoverTrigger.tsx"],"sourcesContent":["import type { PopoverTriggerState } from './PopoverTrigger.types';\n\n/**\n * Render the final JSX of PopoverTrigger\n */\nexport const renderPopoverTrigger_unstable = (state: PopoverTriggerState) => {\n return state.children;\n};\n"],"names":["renderPopoverTrigger_unstable","state","children"],"rangeMappings":";;;;;;;;;;;;;;","mappings":"AAEA;;CAEC;;;;+BACYA;;;eAAAA;;;AAAN,MAAMA,gCAAgC,CAACC;IAC5C,OAAOA,MAAMC,QAAQ;AACvB"}
@@ -0,0 +1,75 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "usePopoverTrigger_unstable", {
enumerable: true,
get: function() {
return usePopoverTrigger_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactutilities = require("@fluentui/react-utilities");
const _reacttabster = require("@fluentui/react-tabster");
const _popoverContext = require("../../popoverContext");
const _reactaria = require("@fluentui/react-aria");
const _keyboardkeys = require("@fluentui/keyboard-keys");
const usePopoverTrigger_unstable = (props)=>{
const { children, disableButtonEnhancement = false } = props;
const child = (0, _reactutilities.getTriggerChild)(children);
const open = (0, _popoverContext.usePopoverContext_unstable)((context)=>context.open);
const setOpen = (0, _popoverContext.usePopoverContext_unstable)((context)=>context.setOpen);
const toggleOpen = (0, _popoverContext.usePopoverContext_unstable)((context)=>context.toggleOpen);
const triggerRef = (0, _popoverContext.usePopoverContext_unstable)((context)=>context.triggerRef);
const openOnHover = (0, _popoverContext.usePopoverContext_unstable)((context)=>context.openOnHover);
const openOnContext = (0, _popoverContext.usePopoverContext_unstable)((context)=>context.openOnContext);
const { triggerAttributes } = (0, _reacttabster.useModalAttributes)();
const onContextMenu = (e)=>{
if (openOnContext) {
e.preventDefault();
setOpen(e, true);
}
};
const onClick = (e)=>{
if (!openOnContext) {
toggleOpen(e);
}
};
const onKeyDown = (e)=>{
if (e.key === _keyboardkeys.Escape && open && !e.isDefaultPrevented()) {
setOpen(e, false);
// stop propagation to avoid conflicting with other elements that listen for `Escape`
// e,g: Dialog, Popover, Menu and Tooltip
e.preventDefault();
}
};
const onMouseEnter = (e)=>{
if (openOnHover) {
setOpen(e, true);
}
};
const onMouseLeave = (e)=>{
if (openOnHover) {
setOpen(e, false);
}
};
const contextMenuProps = {
...triggerAttributes,
'aria-expanded': `${open}`,
...child === null || child === void 0 ? void 0 : child.props,
onMouseEnter: (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)(child === null || child === void 0 ? void 0 : child.props.onMouseEnter, onMouseEnter)),
onMouseLeave: (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)(child === null || child === void 0 ? void 0 : child.props.onMouseLeave, onMouseLeave)),
onContextMenu: (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)(child === null || child === void 0 ? void 0 : child.props.onContextMenu, onContextMenu)),
ref: (0, _reactutilities.useMergedRefs)(triggerRef, child === null || child === void 0 ? void 0 : child.ref)
};
const triggerChildProps = {
...contextMenuProps,
onClick: (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)(child === null || child === void 0 ? void 0 : child.props.onClick, onClick)),
onKeyDown: (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)(child === null || child === void 0 ? void 0 : child.props.onKeyDown, onKeyDown))
};
const ariaButtonTriggerChildProps = (0, _reactaria.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);
return {
children: (0, _reactutilities.applyTriggerPropsToChildren)(props.children, (0, _reactaria.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))
};
};
File diff suppressed because one or more lines are too long