@fluentui/react-popover 9.14.3 → 9.14.4

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/CHANGELOG.md CHANGED
@@ -1,12 +1,30 @@
1
1
  # Change Log - @fluentui/react-popover
2
2
 
3
- This log was last generated on Tue, 26 May 2026 09:33:51 GMT and should not be manually modified.
3
+ This log was last generated on Wed, 24 Jun 2026 11:03:40 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.14.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-popover_v9.14.4)
8
+
9
+ Wed, 24 Jun 2026 11:03:40 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-popover_v9.14.3..@fluentui/react-popover_v9.14.4)
11
+
12
+ ### Patches
13
+
14
+ - fix: remove redundant use no memo directives, and add justification to valid ones ([PR #36224](https://github.com/microsoft/fluentui/pull/36224) by martinhochel@microsoft.com)
15
+ - Bump @fluentui/react-aria to v9.17.13 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
16
+ - Bump @fluentui/react-context-selector to v9.2.18 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
17
+ - Bump @fluentui/react-motion to v9.16.1 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
18
+ - Bump @fluentui/react-motion-components-preview to v0.15.6 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
19
+ - Bump @fluentui/react-portal to v9.8.14 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
20
+ - Bump @fluentui/react-positioning to v9.22.3 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
21
+ - Bump @fluentui/react-tabster to v9.26.16 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
22
+ - Bump @fluentui/react-utilities to v9.26.5 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
23
+ - Bump @fluentui/react-jsx-runtime to v9.4.4 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
24
+
7
25
  ## [9.14.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-popover_v9.14.3)
8
26
 
9
- Tue, 26 May 2026 09:33:51 GMT
27
+ Tue, 26 May 2026 09:39:30 GMT
10
28
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-popover_v9.14.2..@fluentui/react-popover_v9.14.3)
11
29
 
12
30
  ### Patches
@@ -192,7 +192,6 @@ import { PopoverSurfaceMotion } from './PopoverSurfaceMotion';
192
192
  /**
193
193
  * Creates and manages the Popover open state
194
194
  */ function useOpenState(state) {
195
- 'use no memo';
196
195
  const onOpenChange = useEventCallback((e, data)=>{
197
196
  var _state_onOpenChange;
198
197
  return (_state_onOpenChange = state.onOpenChange) === null || _state_onOpenChange === void 0 ? void 0 : _state_onOpenChange.call(state, e, data);
@@ -229,7 +228,6 @@ import { PopoverSurfaceMotion } from './PopoverSurfaceMotion';
229
228
  /**
230
229
  * Creates and sets the necessary trigger, target and content refs used by Popover
231
230
  */ function usePopoverRefs(state) {
232
- 'use no memo';
233
231
  const positioningOptions = {
234
232
  position: 'above',
235
233
  align: 'center',
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Popover/usePopover.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n useControllableState,\n useEventCallback,\n useOnClickOutside,\n useOnScrollOutside,\n elementContains,\n useTimeout,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n usePositioning,\n resolvePositioningShorthand,\n mergeArrowOffset,\n usePositioningMouseTarget,\n usePositioningSlideDirection,\n} from '@fluentui/react-positioning';\nimport { useFocusFinders, useActivateModal } from '@fluentui/react-tabster';\nimport { arrowHeights } from '../PopoverSurface/index';\nimport type { OpenPopoverEvents, PopoverProps, PopoverState } from './Popover.types';\nimport { popoverSurfaceBorderRadius } from './constants';\nimport { presenceMotionSlot } from '@fluentui/react-motion';\nimport { PopoverSurfaceMotion } from './PopoverSurfaceMotion';\n\n/**\n * Create the state required to render Popover.\n *\n * The returned state can be modified with hooks such as usePopoverStyles,\n * before being passed to renderPopover_unstable.\n *\n * @param props - props from this instance of Popover\n */\nexport const usePopover_unstable = (props: PopoverProps): PopoverState => {\n const [contextTarget, setContextTarget] = usePositioningMouseTarget();\n const { targetDocument } = useFluent();\n\n const positioning = resolvePositioningShorthand(props.positioning);\n const handlePositionEnd = usePositioningSlideDirection({\n targetDocument,\n onPositioningEnd: positioning.onPositioningEnd,\n });\n\n const initialState = {\n size: 'medium',\n contextTarget,\n setContextTarget,\n ...props,\n positioning: {\n ...positioning,\n onPositioningEnd: handlePositionEnd,\n },\n } as const;\n\n const children = React.Children.toArray(props.children) as React.ReactElement[];\n\n if (process.env.NODE_ENV !== 'production') {\n if (children.length === 0) {\n // eslint-disable-next-line no-console\n console.warn('Popover must contain at least one child');\n }\n\n if (children.length > 2) {\n // eslint-disable-next-line no-console\n console.warn('Popover must contain at most two children');\n }\n }\n\n let popoverTrigger: React.ReactElement | undefined = undefined;\n let popoverSurface: React.ReactElement | undefined = undefined;\n if (children.length === 2) {\n popoverTrigger = children[0];\n popoverSurface = children[1];\n } else if (children.length === 1) {\n popoverSurface = children[0];\n }\n\n const [open, setOpenState] = useOpenState(initialState);\n\n const [setOpenTimeout, clearOpenTimeout] = useTimeout();\n const setOpen = useEventCallback((e: OpenPopoverEvents, shouldOpen: boolean) => {\n clearOpenTimeout();\n if (!(e instanceof Event) && e.persist) {\n // < React 17 still uses pooled synthetic events\n e.persist();\n }\n\n if (e.type === 'mouseleave') {\n // FIXME leaking Node timeout type\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n setOpenTimeout(() => {\n setOpenState(e, shouldOpen);\n }, props.mouseLeaveDelay ?? 500);\n } else {\n setOpenState(e, shouldOpen);\n }\n });\n\n const toggleOpen = React.useCallback<PopoverState['toggleOpen']>(\n (e: OpenPopoverEvents) => {\n setOpen(e, !open);\n },\n [setOpen, open],\n );\n\n const positioningRefs = usePopoverRefs(initialState);\n\n useOnClickOutside({\n contains: elementContains,\n element: targetDocument,\n callback: ev => setOpen(ev, false),\n refs: [positioningRefs.triggerRef, positioningRefs.contentRef],\n disabled: !open,\n disabledFocusOnIframe: !(props.closeOnIframeFocus ?? true),\n });\n\n // only close on scroll for context, or when closeOnScroll is specified\n const closeOnScroll = initialState.openOnContext || initialState.closeOnScroll;\n useOnScrollOutside({\n contains: elementContains,\n element: targetDocument,\n callback: ev => setOpen(ev, false),\n refs: [positioningRefs.triggerRef, positioningRefs.contentRef],\n disabled: !open || !closeOnScroll,\n });\n\n // When trapFocus is enabled, close the popover if focus is programmatically moved outside\n // (e.g. via element.focus()), which doesn't trigger click or scroll dismiss handlers.\n // Internal `closeOnFocusOutside` prop allows consumers to opt out during gradual rollout.\n const closeOnFocusOutside = (props as PopoverProps & { closeOnFocusOutside?: boolean }).closeOnFocusOutside ?? true;\n\n const closeOnFocusOutCallback = useEventCallback((ev: FocusEvent) => {\n const target = (ev.composedPath()[0] ?? ev.target) as HTMLElement;\n const contentElement = positioningRefs.contentRef.current;\n const triggerElement = positioningRefs.triggerRef.current ?? null;\n\n if (!contentElement) {\n return;\n }\n\n const isOutside = !elementContains(contentElement, target) && !elementContains(triggerElement, target);\n\n if (isOutside) {\n setOpen(ev, false);\n }\n });\n\n React.useEffect(() => {\n if (!open || !props.trapFocus || !closeOnFocusOutside) {\n return;\n }\n\n targetDocument?.addEventListener('focusin', closeOnFocusOutCallback, true);\n return () => {\n targetDocument?.removeEventListener('focusin', closeOnFocusOutCallback, true);\n };\n }, [open, props.trapFocus, closeOnFocusOutside, targetDocument, closeOnFocusOutCallback]);\n\n const { findFirstFocusable } = useFocusFinders();\n const activateModal = useActivateModal();\n\n React.useEffect(() => {\n if (props.unstable_disableAutoFocus) {\n return;\n }\n\n const contentElement = positioningRefs.contentRef.current;\n\n if (open && contentElement) {\n const shouldFocusContainer = !isNaN(contentElement.getAttribute('tabIndex') ?? undefined);\n const firstFocusable = shouldFocusContainer ? contentElement : findFirstFocusable(contentElement);\n\n firstFocusable?.focus();\n\n if (shouldFocusContainer) {\n // Modal activation happens automatically when something inside the modal is focused programmatically.\n // When the container is focused, we need to activate the modal manually.\n activateModal(contentElement);\n }\n }\n }, [findFirstFocusable, activateModal, open, positioningRefs.contentRef, props.unstable_disableAutoFocus]);\n\n return {\n components: {\n surfaceMotion: PopoverSurfaceMotion,\n },\n ...initialState,\n ...positioningRefs,\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n inertTrapFocus: props.inertTrapFocus ?? (props.legacyTrapFocus === undefined ? false : !props.legacyTrapFocus),\n popoverTrigger,\n popoverSurface,\n open,\n setOpen,\n toggleOpen,\n setContextTarget,\n contextTarget,\n inline: props.inline ?? false,\n surfaceMotion: presenceMotionSlot(props.surfaceMotion, {\n elementType: PopoverSurfaceMotion,\n defaultProps: {\n visible: open,\n appear: true,\n unmountOnExit: true,\n },\n }),\n };\n};\n\n/**\n * Creates and manages the Popover open state\n */\nfunction useOpenState(\n state: Pick<PopoverState, 'setContextTarget' | 'onOpenChange'> & Pick<PopoverProps, 'open' | 'defaultOpen'>,\n) {\n 'use no memo';\n\n const onOpenChange: PopoverState['onOpenChange'] = useEventCallback((e, data) => state.onOpenChange?.(e, data));\n\n const [open, setOpenState] = useControllableState({\n state: state.open,\n defaultState: state.defaultOpen,\n initialState: false,\n });\n // eslint-disable-next-line react-hooks/immutability\n state.open = open !== undefined ? open : state.open;\n const setContextTarget = state.setContextTarget;\n\n const setOpen = React.useCallback(\n (e: OpenPopoverEvents, shouldOpen: boolean) => {\n if (shouldOpen && e.type === 'contextmenu') {\n setContextTarget(e as React.MouseEvent);\n }\n\n if (!shouldOpen) {\n setContextTarget(undefined);\n }\n\n setOpenState(shouldOpen);\n onOpenChange?.(e, { open: shouldOpen });\n },\n [setOpenState, onOpenChange, setContextTarget],\n );\n\n return [open, setOpen] as const;\n}\n\n/**\n * Creates and sets the necessary trigger, target and content refs used by Popover\n */\nfunction usePopoverRefs(\n state: Pick<PopoverState, 'size' | 'contextTarget'> &\n Pick<PopoverProps, 'positioning' | 'openOnContext' | 'withArrow'>,\n) {\n 'use no memo';\n\n const positioningOptions = {\n position: 'above' as const,\n align: 'center' as const,\n arrowPadding: 2 * popoverSurfaceBorderRadius,\n target: state.openOnContext ? state.contextTarget : undefined,\n ...resolvePositioningShorthand(state.positioning),\n };\n\n // no reason to render arrow when covering the target\n if (positioningOptions.coverTarget) {\n // eslint-disable-next-line react-hooks/immutability\n state.withArrow = false;\n }\n\n if (state.withArrow) {\n positioningOptions.offset = mergeArrowOffset(positioningOptions.offset, arrowHeights[state.size]);\n }\n\n const { targetRef: triggerRef, containerRef: contentRef, arrowRef } = usePositioning(positioningOptions);\n\n return {\n triggerRef,\n contentRef,\n arrowRef,\n } as const;\n}\n"],"names":["React","useControllableState","useEventCallback","useOnClickOutside","useOnScrollOutside","elementContains","useTimeout","useFluent_unstable","useFluent","usePositioning","resolvePositioningShorthand","mergeArrowOffset","usePositioningMouseTarget","usePositioningSlideDirection","useFocusFinders","useActivateModal","arrowHeights","popoverSurfaceBorderRadius","presenceMotionSlot","PopoverSurfaceMotion","usePopover_unstable","props","contextTarget","setContextTarget","targetDocument","positioning","handlePositionEnd","onPositioningEnd","initialState","size","children","Children","toArray","process","env","NODE_ENV","length","console","warn","popoverTrigger","undefined","popoverSurface","open","setOpenState","useOpenState","setOpenTimeout","clearOpenTimeout","setOpen","e","shouldOpen","Event","persist","type","mouseLeaveDelay","toggleOpen","useCallback","positioningRefs","usePopoverRefs","contains","element","callback","ev","refs","triggerRef","contentRef","disabled","disabledFocusOnIframe","closeOnIframeFocus","closeOnScroll","openOnContext","closeOnFocusOutside","closeOnFocusOutCallback","target","composedPath","contentElement","current","triggerElement","isOutside","useEffect","trapFocus","addEventListener","removeEventListener","findFirstFocusable","activateModal","unstable_disableAutoFocus","shouldFocusContainer","isNaN","getAttribute","firstFocusable","focus","components","surfaceMotion","inertTrapFocus","legacyTrapFocus","inline","elementType","defaultProps","visible","appear","unmountOnExit","state","onOpenChange","data","defaultState","defaultOpen","positioningOptions","position","align","arrowPadding","coverTarget","withArrow","offset","targetRef","containerRef","arrowRef"],"mappings":"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"}
1
+ {"version":3,"sources":["../src/components/Popover/usePopover.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n useControllableState,\n useEventCallback,\n useOnClickOutside,\n useOnScrollOutside,\n elementContains,\n useTimeout,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n usePositioning,\n resolvePositioningShorthand,\n mergeArrowOffset,\n usePositioningMouseTarget,\n usePositioningSlideDirection,\n} from '@fluentui/react-positioning';\nimport { useFocusFinders, useActivateModal } from '@fluentui/react-tabster';\nimport { arrowHeights } from '../PopoverSurface/index';\nimport type { OpenPopoverEvents, PopoverProps, PopoverState } from './Popover.types';\nimport { popoverSurfaceBorderRadius } from './constants';\nimport { presenceMotionSlot } from '@fluentui/react-motion';\nimport { PopoverSurfaceMotion } from './PopoverSurfaceMotion';\n\n/**\n * Create the state required to render Popover.\n *\n * The returned state can be modified with hooks such as usePopoverStyles,\n * before being passed to renderPopover_unstable.\n *\n * @param props - props from this instance of Popover\n */\nexport const usePopover_unstable = (props: PopoverProps): PopoverState => {\n const [contextTarget, setContextTarget] = usePositioningMouseTarget();\n const { targetDocument } = useFluent();\n\n const positioning = resolvePositioningShorthand(props.positioning);\n const handlePositionEnd = usePositioningSlideDirection({\n targetDocument,\n onPositioningEnd: positioning.onPositioningEnd,\n });\n\n const initialState = {\n size: 'medium',\n contextTarget,\n setContextTarget,\n ...props,\n positioning: {\n ...positioning,\n onPositioningEnd: handlePositionEnd,\n },\n } as const;\n\n const children = React.Children.toArray(props.children) as React.ReactElement[];\n\n if (process.env.NODE_ENV !== 'production') {\n if (children.length === 0) {\n // eslint-disable-next-line no-console\n console.warn('Popover must contain at least one child');\n }\n\n if (children.length > 2) {\n // eslint-disable-next-line no-console\n console.warn('Popover must contain at most two children');\n }\n }\n\n let popoverTrigger: React.ReactElement | undefined = undefined;\n let popoverSurface: React.ReactElement | undefined = undefined;\n if (children.length === 2) {\n popoverTrigger = children[0];\n popoverSurface = children[1];\n } else if (children.length === 1) {\n popoverSurface = children[0];\n }\n\n const [open, setOpenState] = useOpenState(initialState);\n\n const [setOpenTimeout, clearOpenTimeout] = useTimeout();\n const setOpen = useEventCallback((e: OpenPopoverEvents, shouldOpen: boolean) => {\n clearOpenTimeout();\n if (!(e instanceof Event) && e.persist) {\n // < React 17 still uses pooled synthetic events\n e.persist();\n }\n\n if (e.type === 'mouseleave') {\n // FIXME leaking Node timeout type\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n setOpenTimeout(() => {\n setOpenState(e, shouldOpen);\n }, props.mouseLeaveDelay ?? 500);\n } else {\n setOpenState(e, shouldOpen);\n }\n });\n\n const toggleOpen = React.useCallback<PopoverState['toggleOpen']>(\n (e: OpenPopoverEvents) => {\n setOpen(e, !open);\n },\n [setOpen, open],\n );\n\n const positioningRefs = usePopoverRefs(initialState);\n\n useOnClickOutside({\n contains: elementContains,\n element: targetDocument,\n callback: ev => setOpen(ev, false),\n refs: [positioningRefs.triggerRef, positioningRefs.contentRef],\n disabled: !open,\n disabledFocusOnIframe: !(props.closeOnIframeFocus ?? true),\n });\n\n // only close on scroll for context, or when closeOnScroll is specified\n const closeOnScroll = initialState.openOnContext || initialState.closeOnScroll;\n useOnScrollOutside({\n contains: elementContains,\n element: targetDocument,\n callback: ev => setOpen(ev, false),\n refs: [positioningRefs.triggerRef, positioningRefs.contentRef],\n disabled: !open || !closeOnScroll,\n });\n\n // When trapFocus is enabled, close the popover if focus is programmatically moved outside\n // (e.g. via element.focus()), which doesn't trigger click or scroll dismiss handlers.\n // Internal `closeOnFocusOutside` prop allows consumers to opt out during gradual rollout.\n const closeOnFocusOutside = (props as PopoverProps & { closeOnFocusOutside?: boolean }).closeOnFocusOutside ?? true;\n\n const closeOnFocusOutCallback = useEventCallback((ev: FocusEvent) => {\n const target = (ev.composedPath()[0] ?? ev.target) as HTMLElement;\n const contentElement = positioningRefs.contentRef.current;\n const triggerElement = positioningRefs.triggerRef.current ?? null;\n\n if (!contentElement) {\n return;\n }\n\n const isOutside = !elementContains(contentElement, target) && !elementContains(triggerElement, target);\n\n if (isOutside) {\n setOpen(ev, false);\n }\n });\n\n React.useEffect(() => {\n if (!open || !props.trapFocus || !closeOnFocusOutside) {\n return;\n }\n\n targetDocument?.addEventListener('focusin', closeOnFocusOutCallback, true);\n return () => {\n targetDocument?.removeEventListener('focusin', closeOnFocusOutCallback, true);\n };\n }, [open, props.trapFocus, closeOnFocusOutside, targetDocument, closeOnFocusOutCallback]);\n\n const { findFirstFocusable } = useFocusFinders();\n const activateModal = useActivateModal();\n\n React.useEffect(() => {\n if (props.unstable_disableAutoFocus) {\n return;\n }\n\n const contentElement = positioningRefs.contentRef.current;\n\n if (open && contentElement) {\n const shouldFocusContainer = !isNaN(contentElement.getAttribute('tabIndex') ?? undefined);\n const firstFocusable = shouldFocusContainer ? contentElement : findFirstFocusable(contentElement);\n\n firstFocusable?.focus();\n\n if (shouldFocusContainer) {\n // Modal activation happens automatically when something inside the modal is focused programmatically.\n // When the container is focused, we need to activate the modal manually.\n activateModal(contentElement);\n }\n }\n }, [findFirstFocusable, activateModal, open, positioningRefs.contentRef, props.unstable_disableAutoFocus]);\n\n return {\n components: {\n surfaceMotion: PopoverSurfaceMotion,\n },\n ...initialState,\n ...positioningRefs,\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n inertTrapFocus: props.inertTrapFocus ?? (props.legacyTrapFocus === undefined ? false : !props.legacyTrapFocus),\n popoverTrigger,\n popoverSurface,\n open,\n setOpen,\n toggleOpen,\n setContextTarget,\n contextTarget,\n inline: props.inline ?? false,\n surfaceMotion: presenceMotionSlot(props.surfaceMotion, {\n elementType: PopoverSurfaceMotion,\n defaultProps: {\n visible: open,\n appear: true,\n unmountOnExit: true,\n },\n }),\n };\n};\n\n/**\n * Creates and manages the Popover open state\n */\nfunction useOpenState(\n state: Pick<PopoverState, 'setContextTarget' | 'onOpenChange'> & Pick<PopoverProps, 'open' | 'defaultOpen'>,\n) {\n const onOpenChange: PopoverState['onOpenChange'] = useEventCallback((e, data) => state.onOpenChange?.(e, data));\n\n const [open, setOpenState] = useControllableState({\n state: state.open,\n defaultState: state.defaultOpen,\n initialState: false,\n });\n // eslint-disable-next-line react-hooks/immutability\n state.open = open !== undefined ? open : state.open;\n const setContextTarget = state.setContextTarget;\n\n const setOpen = React.useCallback(\n (e: OpenPopoverEvents, shouldOpen: boolean) => {\n if (shouldOpen && e.type === 'contextmenu') {\n setContextTarget(e as React.MouseEvent);\n }\n\n if (!shouldOpen) {\n setContextTarget(undefined);\n }\n\n setOpenState(shouldOpen);\n onOpenChange?.(e, { open: shouldOpen });\n },\n [setOpenState, onOpenChange, setContextTarget],\n );\n\n return [open, setOpen] as const;\n}\n\n/**\n * Creates and sets the necessary trigger, target and content refs used by Popover\n */\nfunction usePopoverRefs(\n state: Pick<PopoverState, 'size' | 'contextTarget'> &\n Pick<PopoverProps, 'positioning' | 'openOnContext' | 'withArrow'>,\n) {\n const positioningOptions = {\n position: 'above' as const,\n align: 'center' as const,\n arrowPadding: 2 * popoverSurfaceBorderRadius,\n target: state.openOnContext ? state.contextTarget : undefined,\n ...resolvePositioningShorthand(state.positioning),\n };\n\n // no reason to render arrow when covering the target\n if (positioningOptions.coverTarget) {\n // eslint-disable-next-line react-hooks/immutability\n state.withArrow = false;\n }\n\n if (state.withArrow) {\n positioningOptions.offset = mergeArrowOffset(positioningOptions.offset, arrowHeights[state.size]);\n }\n\n const { targetRef: triggerRef, containerRef: contentRef, arrowRef } = usePositioning(positioningOptions);\n\n return {\n triggerRef,\n contentRef,\n arrowRef,\n } as const;\n}\n"],"names":["React","useControllableState","useEventCallback","useOnClickOutside","useOnScrollOutside","elementContains","useTimeout","useFluent_unstable","useFluent","usePositioning","resolvePositioningShorthand","mergeArrowOffset","usePositioningMouseTarget","usePositioningSlideDirection","useFocusFinders","useActivateModal","arrowHeights","popoverSurfaceBorderRadius","presenceMotionSlot","PopoverSurfaceMotion","usePopover_unstable","props","contextTarget","setContextTarget","targetDocument","positioning","handlePositionEnd","onPositioningEnd","initialState","size","children","Children","toArray","process","env","NODE_ENV","length","console","warn","popoverTrigger","undefined","popoverSurface","open","setOpenState","useOpenState","setOpenTimeout","clearOpenTimeout","setOpen","e","shouldOpen","Event","persist","type","mouseLeaveDelay","toggleOpen","useCallback","positioningRefs","usePopoverRefs","contains","element","callback","ev","refs","triggerRef","contentRef","disabled","disabledFocusOnIframe","closeOnIframeFocus","closeOnScroll","openOnContext","closeOnFocusOutside","closeOnFocusOutCallback","target","composedPath","contentElement","current","triggerElement","isOutside","useEffect","trapFocus","addEventListener","removeEventListener","findFirstFocusable","activateModal","unstable_disableAutoFocus","shouldFocusContainer","isNaN","getAttribute","firstFocusable","focus","components","surfaceMotion","inertTrapFocus","legacyTrapFocus","inline","elementType","defaultProps","visible","appear","unmountOnExit","state","onOpenChange","data","defaultState","defaultOpen","positioningOptions","position","align","arrowPadding","coverTarget","withArrow","offset","targetRef","containerRef","arrowRef"],"mappings":"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"}
@@ -155,8 +155,6 @@ const useStyles = /*#__PURE__*/__styles({
155
155
  * Apply styling to the PopoverSurface slots based on the state
156
156
  */
157
157
  export const usePopoverSurfaceStyles_unstable = state => {
158
- 'use no memo';
159
-
160
158
  const styles = useStyles();
161
159
  // eslint-disable-next-line react-hooks/immutability
162
160
  state.root.className = 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);
@@ -1 +1 @@
1
- {"version":3,"names":["__styles","mergeClasses","createArrowHeightStyles","createArrowStyles","tokens","typographyStyles","popoverSurfaceClassNames","root","arrowHeights","small","medium","large","useStyles","sj55zd","De3pzq","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","Bhu2qc9","inline","Bj3rh1h","inverted","brand","smallPadding","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","mediumPadding","largePadding","smallArrow","rhnwrx","Bdy53xb","mediumLargeArrow","arrow","B7ck84d","qhf8xq","B2eet1l","Bz10aip","Bqenvij","a9b677","Ftih45","Br0sdwz","cmx5o7","susq4k","Biibvgv","Bicfajf","qehafq","Brs5u8j","Ccq8qp","Baz25je","Bcgcnre","Bqjgrrk","qa3bma","y0oebl","Biqmznv","Bm6vgfq","Bbv0w2i","uvfttm","eqrjj","Bk5zm6e","m598lv","B4f6apu","ydt019","Bq4z7u6","Bdkvgpv","B0qfbqy","kj8mxx","r59vdv","Bkw5xw4","hl6cv3","aea9ga","yayu3t","Bhsv975","rhl9o9","B7gxrvb","B6q6orb","B0lu1f8","d","p","usePopoverSurfaceStyles_unstable","state","styles","className","size","appearance","arrowClassName"],"sources":["usePopoverSurfaceStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { createArrowHeightStyles, createArrowStyles } from '@fluentui/react-positioning';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const popoverSurfaceClassNames = {\n root: 'fui-PopoverSurface'\n};\nexport const arrowHeights = {\n small: 6,\n medium: 8,\n large: 8\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n color: tokens.colorNeutralForeground1,\n backgroundColor: tokens.colorNeutralBackground1,\n borderRadius: tokens.borderRadiusMedium,\n border: `1px solid ${tokens.colorTransparentStroke}`,\n ...typographyStyles.body1,\n // TODO need to add versions of tokens.alias.shadow.shadow16, etc. that work with filter\n filter: `drop-shadow(0 0 2px ${tokens.colorNeutralShadowAmbient}) ` + `drop-shadow(0 8px 16px ${tokens.colorNeutralShadowKey})`\n },\n inline: {\n // When rendering inline, the PopoverSurface will be rendered under relatively positioned elements such as Input.\n // This is due to the surface being positioned as absolute, therefore zIndex: 1 ensures that won't happen.\n zIndex: 1\n },\n inverted: {\n backgroundColor: tokens.colorNeutralBackgroundStatic,\n color: tokens.colorNeutralForegroundStaticInverted\n },\n brand: {\n backgroundColor: tokens.colorBrandBackground,\n color: tokens.colorNeutralForegroundOnBrand\n },\n smallPadding: {\n padding: '12px'\n },\n mediumPadding: {\n padding: '16px'\n },\n largePadding: {\n padding: '20px'\n },\n smallArrow: createArrowHeightStyles(arrowHeights.small),\n mediumLargeArrow: createArrowHeightStyles(arrowHeights.medium),\n arrow: createArrowStyles({\n arrowHeight: undefined\n })\n});\n/**\n * Apply styling to the PopoverSurface slots based on the state\n */ export const usePopoverSurfaceStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = 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);\n // eslint-disable-next-line react-hooks/immutability\n state.arrowClassName = mergeClasses(styles.arrow, state.size === 'small' ? styles.smallArrow : styles.mediumLargeArrow);\n return state;\n};\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["__styles","mergeClasses","createArrowHeightStyles","createArrowStyles","tokens","typographyStyles","popoverSurfaceClassNames","root","arrowHeights","small","medium","large","useStyles","sj55zd","De3pzq","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","Bhu2qc9","inline","Bj3rh1h","inverted","brand","smallPadding","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","mediumPadding","largePadding","smallArrow","rhnwrx","Bdy53xb","mediumLargeArrow","arrow","B7ck84d","qhf8xq","B2eet1l","Bz10aip","Bqenvij","a9b677","Ftih45","Br0sdwz","cmx5o7","susq4k","Biibvgv","Bicfajf","qehafq","Brs5u8j","Ccq8qp","Baz25je","Bcgcnre","Bqjgrrk","qa3bma","y0oebl","Biqmznv","Bm6vgfq","Bbv0w2i","uvfttm","eqrjj","Bk5zm6e","m598lv","B4f6apu","ydt019","Bq4z7u6","Bdkvgpv","B0qfbqy","kj8mxx","r59vdv","Bkw5xw4","hl6cv3","aea9ga","yayu3t","Bhsv975","rhl9o9","B7gxrvb","B6q6orb","B0lu1f8","d","p","usePopoverSurfaceStyles_unstable","state","styles","className","size","appearance","arrowClassName"],"sources":["usePopoverSurfaceStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { createArrowHeightStyles, createArrowStyles } from '@fluentui/react-positioning';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const popoverSurfaceClassNames = {\n root: 'fui-PopoverSurface'\n};\nexport const arrowHeights = {\n small: 6,\n medium: 8,\n large: 8\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n color: tokens.colorNeutralForeground1,\n backgroundColor: tokens.colorNeutralBackground1,\n borderRadius: tokens.borderRadiusMedium,\n border: `1px solid ${tokens.colorTransparentStroke}`,\n ...typographyStyles.body1,\n // TODO need to add versions of tokens.alias.shadow.shadow16, etc. that work with filter\n filter: `drop-shadow(0 0 2px ${tokens.colorNeutralShadowAmbient}) ` + `drop-shadow(0 8px 16px ${tokens.colorNeutralShadowKey})`\n },\n inline: {\n // When rendering inline, the PopoverSurface will be rendered under relatively positioned elements such as Input.\n // This is due to the surface being positioned as absolute, therefore zIndex: 1 ensures that won't happen.\n zIndex: 1\n },\n inverted: {\n backgroundColor: tokens.colorNeutralBackgroundStatic,\n color: tokens.colorNeutralForegroundStaticInverted\n },\n brand: {\n backgroundColor: tokens.colorBrandBackground,\n color: tokens.colorNeutralForegroundOnBrand\n },\n smallPadding: {\n padding: '12px'\n },\n mediumPadding: {\n padding: '16px'\n },\n largePadding: {\n padding: '20px'\n },\n smallArrow: createArrowHeightStyles(arrowHeights.small),\n mediumLargeArrow: createArrowHeightStyles(arrowHeights.medium),\n arrow: createArrowStyles({\n arrowHeight: undefined\n })\n});\n/**\n * Apply styling to the PopoverSurface slots based on the state\n */ export const usePopoverSurfaceStyles_unstable = (state)=>{\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = 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);\n // eslint-disable-next-line react-hooks/immutability\n state.arrowClassName = mergeClasses(styles.arrow, state.size === 'small' ? styles.smallArrow : styles.mediumLargeArrow);\n return state;\n};\n"],"mappings":"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","ignoreList":[]}
@@ -53,7 +53,6 @@ export const arrowHeights = {
53
53
  /**
54
54
  * Apply styling to the PopoverSurface slots based on the state
55
55
  */ export const usePopoverSurfaceStyles_unstable = (state)=>{
56
- 'use no memo';
57
56
  const styles = useStyles();
58
57
  // eslint-disable-next-line react-hooks/immutability
59
58
  state.root.className = 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);
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/PopoverSurface/usePopoverSurfaceStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { createArrowHeightStyles, createArrowStyles } from '@fluentui/react-positioning';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { PopoverSize } from '../Popover/Popover.types';\nimport type { PopoverSurfaceSlots, PopoverSurfaceState } from './PopoverSurface.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const popoverSurfaceClassNames: SlotClassNames<PopoverSurfaceSlots> = {\n root: 'fui-PopoverSurface',\n};\n\nexport const arrowHeights: Record<PopoverSize, number> = {\n small: 6,\n medium: 8,\n large: 8,\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n color: tokens.colorNeutralForeground1,\n backgroundColor: tokens.colorNeutralBackground1,\n borderRadius: tokens.borderRadiusMedium,\n border: `1px solid ${tokens.colorTransparentStroke}`,\n ...typographyStyles.body1,\n\n // TODO need to add versions of tokens.alias.shadow.shadow16, etc. that work with filter\n filter:\n `drop-shadow(0 0 2px ${tokens.colorNeutralShadowAmbient}) ` +\n `drop-shadow(0 8px 16px ${tokens.colorNeutralShadowKey})`,\n },\n\n inline: {\n // When rendering inline, the PopoverSurface will be rendered under relatively positioned elements such as Input.\n // This is due to the surface being positioned as absolute, therefore zIndex: 1 ensures that won't happen.\n zIndex: 1,\n },\n\n inverted: {\n backgroundColor: tokens.colorNeutralBackgroundStatic,\n color: tokens.colorNeutralForegroundStaticInverted,\n },\n\n brand: {\n backgroundColor: tokens.colorBrandBackground,\n color: tokens.colorNeutralForegroundOnBrand,\n },\n\n smallPadding: { padding: '12px' },\n\n mediumPadding: { padding: '16px' },\n\n largePadding: { padding: '20px' },\n\n smallArrow: createArrowHeightStyles(arrowHeights.small),\n mediumLargeArrow: createArrowHeightStyles(arrowHeights.medium),\n arrow: createArrowStyles({ arrowHeight: undefined }),\n});\n\n/**\n * Apply styling to the PopoverSurface slots based on the state\n */\nexport const usePopoverSurfaceStyles_unstable = (state: PopoverSurfaceState): PopoverSurfaceState => {\n 'use no memo';\n\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n popoverSurfaceClassNames.root,\n styles.root,\n state.inline && styles.inline,\n state.size === 'small' && styles.smallPadding,\n state.size === 'medium' && styles.mediumPadding,\n state.size === 'large' && styles.largePadding,\n state.appearance === 'inverted' && styles.inverted,\n state.appearance === 'brand' && styles.brand,\n state.root.className,\n );\n\n // eslint-disable-next-line react-hooks/immutability\n state.arrowClassName = mergeClasses(\n styles.arrow,\n state.size === 'small' ? styles.smallArrow : styles.mediumLargeArrow,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","createArrowHeightStyles","createArrowStyles","tokens","typographyStyles","popoverSurfaceClassNames","root","arrowHeights","small","medium","large","useStyles","color","colorNeutralForeground1","backgroundColor","colorNeutralBackground1","borderRadius","borderRadiusMedium","border","colorTransparentStroke","body1","filter","colorNeutralShadowAmbient","colorNeutralShadowKey","inline","zIndex","inverted","colorNeutralBackgroundStatic","colorNeutralForegroundStaticInverted","brand","colorBrandBackground","colorNeutralForegroundOnBrand","smallPadding","padding","mediumPadding","largePadding","smallArrow","mediumLargeArrow","arrow","arrowHeight","undefined","usePopoverSurfaceStyles_unstable","state","styles","className","size","appearance","arrowClassName"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC1D,SAASC,uBAAuB,EAAEC,iBAAiB,QAAQ,8BAA8B;AACzF,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,wBAAwB;AAKjE,OAAO,MAAMC,2BAAgE;IAC3EC,MAAM;AACR,EAAE;AAEF,OAAO,MAAMC,eAA4C;IACvDC,OAAO;IACPC,QAAQ;IACRC,OAAO;AACT,EAAE;AAEF;;CAEC,GACD,MAAMC,YAAYZ,WAAW;IAC3BO,MAAM;QACJM,OAAOT,OAAOU,uBAAuB;QACrCC,iBAAiBX,OAAOY,uBAAuB;QAC/CC,cAAcb,OAAOc,kBAAkB;QACvCC,QAAQ,CAAC,UAAU,EAAEf,OAAOgB,sBAAsB,EAAE;QACpD,GAAGf,iBAAiBgB,KAAK;QAEzB,wFAAwF;QACxFC,QACE,CAAC,oBAAoB,EAAElB,OAAOmB,yBAAyB,CAAC,EAAE,CAAC,GAC3D,CAAC,uBAAuB,EAAEnB,OAAOoB,qBAAqB,CAAC,CAAC,CAAC;IAC7D;IAEAC,QAAQ;QACN,iHAAiH;QACjH,0GAA0G;QAC1GC,QAAQ;IACV;IAEAC,UAAU;QACRZ,iBAAiBX,OAAOwB,4BAA4B;QACpDf,OAAOT,OAAOyB,oCAAoC;IACpD;IAEAC,OAAO;QACLf,iBAAiBX,OAAO2B,oBAAoB;QAC5ClB,OAAOT,OAAO4B,6BAA6B;IAC7C;IAEAC,cAAc;QAAEC,SAAS;IAAO;IAEhCC,eAAe;QAAED,SAAS;IAAO;IAEjCE,cAAc;QAAEF,SAAS;IAAO;IAEhCG,YAAYnC,wBAAwBM,aAAaC,KAAK;IACtD6B,kBAAkBpC,wBAAwBM,aAAaE,MAAM;IAC7D6B,OAAOpC,kBAAkB;QAAEqC,aAAaC;IAAU;AACpD;AAEA;;CAEC,GACD,OAAO,MAAMC,mCAAmC,CAACC;IAC/C;IAEA,MAAMC,SAAShC;IACf,oDAAoD;IACpD+B,MAAMpC,IAAI,CAACsC,SAAS,GAAG5C,aACrBK,yBAAyBC,IAAI,EAC7BqC,OAAOrC,IAAI,EACXoC,MAAMlB,MAAM,IAAImB,OAAOnB,MAAM,EAC7BkB,MAAMG,IAAI,KAAK,WAAWF,OAAOX,YAAY,EAC7CU,MAAMG,IAAI,KAAK,YAAYF,OAAOT,aAAa,EAC/CQ,MAAMG,IAAI,KAAK,WAAWF,OAAOR,YAAY,EAC7CO,MAAMI,UAAU,KAAK,cAAcH,OAAOjB,QAAQ,EAClDgB,MAAMI,UAAU,KAAK,WAAWH,OAAOd,KAAK,EAC5Ca,MAAMpC,IAAI,CAACsC,SAAS;IAGtB,oDAAoD;IACpDF,MAAMK,cAAc,GAAG/C,aACrB2C,OAAOL,KAAK,EACZI,MAAMG,IAAI,KAAK,UAAUF,OAAOP,UAAU,GAAGO,OAAON,gBAAgB;IAGtE,OAAOK;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/PopoverSurface/usePopoverSurfaceStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { createArrowHeightStyles, createArrowStyles } from '@fluentui/react-positioning';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { PopoverSize } from '../Popover/Popover.types';\nimport type { PopoverSurfaceSlots, PopoverSurfaceState } from './PopoverSurface.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const popoverSurfaceClassNames: SlotClassNames<PopoverSurfaceSlots> = {\n root: 'fui-PopoverSurface',\n};\n\nexport const arrowHeights: Record<PopoverSize, number> = {\n small: 6,\n medium: 8,\n large: 8,\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n color: tokens.colorNeutralForeground1,\n backgroundColor: tokens.colorNeutralBackground1,\n borderRadius: tokens.borderRadiusMedium,\n border: `1px solid ${tokens.colorTransparentStroke}`,\n ...typographyStyles.body1,\n\n // TODO need to add versions of tokens.alias.shadow.shadow16, etc. that work with filter\n filter:\n `drop-shadow(0 0 2px ${tokens.colorNeutralShadowAmbient}) ` +\n `drop-shadow(0 8px 16px ${tokens.colorNeutralShadowKey})`,\n },\n\n inline: {\n // When rendering inline, the PopoverSurface will be rendered under relatively positioned elements such as Input.\n // This is due to the surface being positioned as absolute, therefore zIndex: 1 ensures that won't happen.\n zIndex: 1,\n },\n\n inverted: {\n backgroundColor: tokens.colorNeutralBackgroundStatic,\n color: tokens.colorNeutralForegroundStaticInverted,\n },\n\n brand: {\n backgroundColor: tokens.colorBrandBackground,\n color: tokens.colorNeutralForegroundOnBrand,\n },\n\n smallPadding: { padding: '12px' },\n\n mediumPadding: { padding: '16px' },\n\n largePadding: { padding: '20px' },\n\n smallArrow: createArrowHeightStyles(arrowHeights.small),\n mediumLargeArrow: createArrowHeightStyles(arrowHeights.medium),\n arrow: createArrowStyles({ arrowHeight: undefined }),\n});\n\n/**\n * Apply styling to the PopoverSurface slots based on the state\n */\nexport const usePopoverSurfaceStyles_unstable = (state: PopoverSurfaceState): PopoverSurfaceState => {\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n popoverSurfaceClassNames.root,\n styles.root,\n state.inline && styles.inline,\n state.size === 'small' && styles.smallPadding,\n state.size === 'medium' && styles.mediumPadding,\n state.size === 'large' && styles.largePadding,\n state.appearance === 'inverted' && styles.inverted,\n state.appearance === 'brand' && styles.brand,\n state.root.className,\n );\n\n // eslint-disable-next-line react-hooks/immutability\n state.arrowClassName = mergeClasses(\n styles.arrow,\n state.size === 'small' ? styles.smallArrow : styles.mediumLargeArrow,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","createArrowHeightStyles","createArrowStyles","tokens","typographyStyles","popoverSurfaceClassNames","root","arrowHeights","small","medium","large","useStyles","color","colorNeutralForeground1","backgroundColor","colorNeutralBackground1","borderRadius","borderRadiusMedium","border","colorTransparentStroke","body1","filter","colorNeutralShadowAmbient","colorNeutralShadowKey","inline","zIndex","inverted","colorNeutralBackgroundStatic","colorNeutralForegroundStaticInverted","brand","colorBrandBackground","colorNeutralForegroundOnBrand","smallPadding","padding","mediumPadding","largePadding","smallArrow","mediumLargeArrow","arrow","arrowHeight","undefined","usePopoverSurfaceStyles_unstable","state","styles","className","size","appearance","arrowClassName"],"mappings":"AAAA;AAEA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC1D,SAASC,uBAAuB,EAAEC,iBAAiB,QAAQ,8BAA8B;AACzF,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,wBAAwB;AAKjE,OAAO,MAAMC,2BAAgE;IAC3EC,MAAM;AACR,EAAE;AAEF,OAAO,MAAMC,eAA4C;IACvDC,OAAO;IACPC,QAAQ;IACRC,OAAO;AACT,EAAE;AAEF;;CAEC,GACD,MAAMC,YAAYZ,WAAW;IAC3BO,MAAM;QACJM,OAAOT,OAAOU,uBAAuB;QACrCC,iBAAiBX,OAAOY,uBAAuB;QAC/CC,cAAcb,OAAOc,kBAAkB;QACvCC,QAAQ,CAAC,UAAU,EAAEf,OAAOgB,sBAAsB,EAAE;QACpD,GAAGf,iBAAiBgB,KAAK;QAEzB,wFAAwF;QACxFC,QACE,CAAC,oBAAoB,EAAElB,OAAOmB,yBAAyB,CAAC,EAAE,CAAC,GAC3D,CAAC,uBAAuB,EAAEnB,OAAOoB,qBAAqB,CAAC,CAAC,CAAC;IAC7D;IAEAC,QAAQ;QACN,iHAAiH;QACjH,0GAA0G;QAC1GC,QAAQ;IACV;IAEAC,UAAU;QACRZ,iBAAiBX,OAAOwB,4BAA4B;QACpDf,OAAOT,OAAOyB,oCAAoC;IACpD;IAEAC,OAAO;QACLf,iBAAiBX,OAAO2B,oBAAoB;QAC5ClB,OAAOT,OAAO4B,6BAA6B;IAC7C;IAEAC,cAAc;QAAEC,SAAS;IAAO;IAEhCC,eAAe;QAAED,SAAS;IAAO;IAEjCE,cAAc;QAAEF,SAAS;IAAO;IAEhCG,YAAYnC,wBAAwBM,aAAaC,KAAK;IACtD6B,kBAAkBpC,wBAAwBM,aAAaE,MAAM;IAC7D6B,OAAOpC,kBAAkB;QAAEqC,aAAaC;IAAU;AACpD;AAEA;;CAEC,GACD,OAAO,MAAMC,mCAAmC,CAACC;IAC/C,MAAMC,SAAShC;IACf,oDAAoD;IACpD+B,MAAMpC,IAAI,CAACsC,SAAS,GAAG5C,aACrBK,yBAAyBC,IAAI,EAC7BqC,OAAOrC,IAAI,EACXoC,MAAMlB,MAAM,IAAImB,OAAOnB,MAAM,EAC7BkB,MAAMG,IAAI,KAAK,WAAWF,OAAOX,YAAY,EAC7CU,MAAMG,IAAI,KAAK,YAAYF,OAAOT,aAAa,EAC/CQ,MAAMG,IAAI,KAAK,WAAWF,OAAOR,YAAY,EAC7CO,MAAMI,UAAU,KAAK,cAAcH,OAAOjB,QAAQ,EAClDgB,MAAMI,UAAU,KAAK,WAAWH,OAAOd,KAAK,EAC5Ca,MAAMpC,IAAI,CAACsC,SAAS;IAGtB,oDAAoD;IACpDF,MAAMK,cAAc,GAAG/C,aACrB2C,OAAOL,KAAK,EACZI,MAAMG,IAAI,KAAK,UAAUF,OAAOP,UAAU,GAAGO,OAAON,gBAAgB;IAGtE,OAAOK;AACT,EAAE"}
@@ -196,7 +196,6 @@ const usePopover_unstable = (props)=>{
196
196
  /**
197
197
  * Creates and manages the Popover open state
198
198
  */ function useOpenState(state) {
199
- 'use no memo';
200
199
  const onOpenChange = (0, _reactutilities.useEventCallback)((e, data)=>{
201
200
  var _state_onOpenChange;
202
201
  return (_state_onOpenChange = state.onOpenChange) === null || _state_onOpenChange === void 0 ? void 0 : _state_onOpenChange.call(state, e, data);
@@ -233,7 +232,6 @@ const usePopover_unstable = (props)=>{
233
232
  /**
234
233
  * Creates and sets the necessary trigger, target and content refs used by Popover
235
234
  */ function usePopoverRefs(state) {
236
- 'use no memo';
237
235
  const positioningOptions = {
238
236
  position: 'above',
239
237
  align: 'center',
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Popover/usePopover.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n useControllableState,\n useEventCallback,\n useOnClickOutside,\n useOnScrollOutside,\n elementContains,\n useTimeout,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n usePositioning,\n resolvePositioningShorthand,\n mergeArrowOffset,\n usePositioningMouseTarget,\n usePositioningSlideDirection,\n} from '@fluentui/react-positioning';\nimport { useFocusFinders, useActivateModal } from '@fluentui/react-tabster';\nimport { arrowHeights } from '../PopoverSurface/index';\nimport type { OpenPopoverEvents, PopoverProps, PopoverState } from './Popover.types';\nimport { popoverSurfaceBorderRadius } from './constants';\nimport { presenceMotionSlot } from '@fluentui/react-motion';\nimport { PopoverSurfaceMotion } from './PopoverSurfaceMotion';\n\n/**\n * Create the state required to render Popover.\n *\n * The returned state can be modified with hooks such as usePopoverStyles,\n * before being passed to renderPopover_unstable.\n *\n * @param props - props from this instance of Popover\n */\nexport const usePopover_unstable = (props: PopoverProps): PopoverState => {\n const [contextTarget, setContextTarget] = usePositioningMouseTarget();\n const { targetDocument } = useFluent();\n\n const positioning = resolvePositioningShorthand(props.positioning);\n const handlePositionEnd = usePositioningSlideDirection({\n targetDocument,\n onPositioningEnd: positioning.onPositioningEnd,\n });\n\n const initialState = {\n size: 'medium',\n contextTarget,\n setContextTarget,\n ...props,\n positioning: {\n ...positioning,\n onPositioningEnd: handlePositionEnd,\n },\n } as const;\n\n const children = React.Children.toArray(props.children) as React.ReactElement[];\n\n if (process.env.NODE_ENV !== 'production') {\n if (children.length === 0) {\n // eslint-disable-next-line no-console\n console.warn('Popover must contain at least one child');\n }\n\n if (children.length > 2) {\n // eslint-disable-next-line no-console\n console.warn('Popover must contain at most two children');\n }\n }\n\n let popoverTrigger: React.ReactElement | undefined = undefined;\n let popoverSurface: React.ReactElement | undefined = undefined;\n if (children.length === 2) {\n popoverTrigger = children[0];\n popoverSurface = children[1];\n } else if (children.length === 1) {\n popoverSurface = children[0];\n }\n\n const [open, setOpenState] = useOpenState(initialState);\n\n const [setOpenTimeout, clearOpenTimeout] = useTimeout();\n const setOpen = useEventCallback((e: OpenPopoverEvents, shouldOpen: boolean) => {\n clearOpenTimeout();\n if (!(e instanceof Event) && e.persist) {\n // < React 17 still uses pooled synthetic events\n e.persist();\n }\n\n if (e.type === 'mouseleave') {\n // FIXME leaking Node timeout type\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n setOpenTimeout(() => {\n setOpenState(e, shouldOpen);\n }, props.mouseLeaveDelay ?? 500);\n } else {\n setOpenState(e, shouldOpen);\n }\n });\n\n const toggleOpen = React.useCallback<PopoverState['toggleOpen']>(\n (e: OpenPopoverEvents) => {\n setOpen(e, !open);\n },\n [setOpen, open],\n );\n\n const positioningRefs = usePopoverRefs(initialState);\n\n useOnClickOutside({\n contains: elementContains,\n element: targetDocument,\n callback: ev => setOpen(ev, false),\n refs: [positioningRefs.triggerRef, positioningRefs.contentRef],\n disabled: !open,\n disabledFocusOnIframe: !(props.closeOnIframeFocus ?? true),\n });\n\n // only close on scroll for context, or when closeOnScroll is specified\n const closeOnScroll = initialState.openOnContext || initialState.closeOnScroll;\n useOnScrollOutside({\n contains: elementContains,\n element: targetDocument,\n callback: ev => setOpen(ev, false),\n refs: [positioningRefs.triggerRef, positioningRefs.contentRef],\n disabled: !open || !closeOnScroll,\n });\n\n // When trapFocus is enabled, close the popover if focus is programmatically moved outside\n // (e.g. via element.focus()), which doesn't trigger click or scroll dismiss handlers.\n // Internal `closeOnFocusOutside` prop allows consumers to opt out during gradual rollout.\n const closeOnFocusOutside = (props as PopoverProps & { closeOnFocusOutside?: boolean }).closeOnFocusOutside ?? true;\n\n const closeOnFocusOutCallback = useEventCallback((ev: FocusEvent) => {\n const target = (ev.composedPath()[0] ?? ev.target) as HTMLElement;\n const contentElement = positioningRefs.contentRef.current;\n const triggerElement = positioningRefs.triggerRef.current ?? null;\n\n if (!contentElement) {\n return;\n }\n\n const isOutside = !elementContains(contentElement, target) && !elementContains(triggerElement, target);\n\n if (isOutside) {\n setOpen(ev, false);\n }\n });\n\n React.useEffect(() => {\n if (!open || !props.trapFocus || !closeOnFocusOutside) {\n return;\n }\n\n targetDocument?.addEventListener('focusin', closeOnFocusOutCallback, true);\n return () => {\n targetDocument?.removeEventListener('focusin', closeOnFocusOutCallback, true);\n };\n }, [open, props.trapFocus, closeOnFocusOutside, targetDocument, closeOnFocusOutCallback]);\n\n const { findFirstFocusable } = useFocusFinders();\n const activateModal = useActivateModal();\n\n React.useEffect(() => {\n if (props.unstable_disableAutoFocus) {\n return;\n }\n\n const contentElement = positioningRefs.contentRef.current;\n\n if (open && contentElement) {\n const shouldFocusContainer = !isNaN(contentElement.getAttribute('tabIndex') ?? undefined);\n const firstFocusable = shouldFocusContainer ? contentElement : findFirstFocusable(contentElement);\n\n firstFocusable?.focus();\n\n if (shouldFocusContainer) {\n // Modal activation happens automatically when something inside the modal is focused programmatically.\n // When the container is focused, we need to activate the modal manually.\n activateModal(contentElement);\n }\n }\n }, [findFirstFocusable, activateModal, open, positioningRefs.contentRef, props.unstable_disableAutoFocus]);\n\n return {\n components: {\n surfaceMotion: PopoverSurfaceMotion,\n },\n ...initialState,\n ...positioningRefs,\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n inertTrapFocus: props.inertTrapFocus ?? (props.legacyTrapFocus === undefined ? false : !props.legacyTrapFocus),\n popoverTrigger,\n popoverSurface,\n open,\n setOpen,\n toggleOpen,\n setContextTarget,\n contextTarget,\n inline: props.inline ?? false,\n surfaceMotion: presenceMotionSlot(props.surfaceMotion, {\n elementType: PopoverSurfaceMotion,\n defaultProps: {\n visible: open,\n appear: true,\n unmountOnExit: true,\n },\n }),\n };\n};\n\n/**\n * Creates and manages the Popover open state\n */\nfunction useOpenState(\n state: Pick<PopoverState, 'setContextTarget' | 'onOpenChange'> & Pick<PopoverProps, 'open' | 'defaultOpen'>,\n) {\n 'use no memo';\n\n const onOpenChange: PopoverState['onOpenChange'] = useEventCallback((e, data) => state.onOpenChange?.(e, data));\n\n const [open, setOpenState] = useControllableState({\n state: state.open,\n defaultState: state.defaultOpen,\n initialState: false,\n });\n // eslint-disable-next-line react-hooks/immutability\n state.open = open !== undefined ? open : state.open;\n const setContextTarget = state.setContextTarget;\n\n const setOpen = React.useCallback(\n (e: OpenPopoverEvents, shouldOpen: boolean) => {\n if (shouldOpen && e.type === 'contextmenu') {\n setContextTarget(e as React.MouseEvent);\n }\n\n if (!shouldOpen) {\n setContextTarget(undefined);\n }\n\n setOpenState(shouldOpen);\n onOpenChange?.(e, { open: shouldOpen });\n },\n [setOpenState, onOpenChange, setContextTarget],\n );\n\n return [open, setOpen] as const;\n}\n\n/**\n * Creates and sets the necessary trigger, target and content refs used by Popover\n */\nfunction usePopoverRefs(\n state: Pick<PopoverState, 'size' | 'contextTarget'> &\n Pick<PopoverProps, 'positioning' | 'openOnContext' | 'withArrow'>,\n) {\n 'use no memo';\n\n const positioningOptions = {\n position: 'above' as const,\n align: 'center' as const,\n arrowPadding: 2 * popoverSurfaceBorderRadius,\n target: state.openOnContext ? state.contextTarget : undefined,\n ...resolvePositioningShorthand(state.positioning),\n };\n\n // no reason to render arrow when covering the target\n if (positioningOptions.coverTarget) {\n // eslint-disable-next-line react-hooks/immutability\n state.withArrow = false;\n }\n\n if (state.withArrow) {\n positioningOptions.offset = mergeArrowOffset(positioningOptions.offset, arrowHeights[state.size]);\n }\n\n const { targetRef: triggerRef, containerRef: contentRef, arrowRef } = usePositioning(positioningOptions);\n\n return {\n triggerRef,\n contentRef,\n arrowRef,\n } as const;\n}\n"],"names":["React","useControllableState","useEventCallback","useOnClickOutside","useOnScrollOutside","elementContains","useTimeout","useFluent_unstable","useFluent","usePositioning","resolvePositioningShorthand","mergeArrowOffset","usePositioningMouseTarget","usePositioningSlideDirection","useFocusFinders","useActivateModal","arrowHeights","popoverSurfaceBorderRadius","presenceMotionSlot","PopoverSurfaceMotion","usePopover_unstable","props","contextTarget","setContextTarget","targetDocument","positioning","handlePositionEnd","onPositioningEnd","initialState","size","children","Children","toArray","process","env","NODE_ENV","length","console","warn","popoverTrigger","undefined","popoverSurface","open","setOpenState","useOpenState","setOpenTimeout","clearOpenTimeout","setOpen","e","shouldOpen","Event","persist","type","mouseLeaveDelay","toggleOpen","useCallback","positioningRefs","usePopoverRefs","contains","element","callback","ev","refs","triggerRef","contentRef","disabled","disabledFocusOnIframe","closeOnIframeFocus","closeOnScroll","openOnContext","closeOnFocusOutside","closeOnFocusOutCallback","target","composedPath","contentElement","current","triggerElement","isOutside","useEffect","trapFocus","addEventListener","removeEventListener","findFirstFocusable","activateModal","unstable_disableAutoFocus","shouldFocusContainer","isNaN","getAttribute","firstFocusable","focus","components","surfaceMotion","inertTrapFocus","legacyTrapFocus","inline","elementType","defaultProps","visible","appear","unmountOnExit","state","onOpenChange","data","defaultState","defaultOpen","positioningOptions","position","align","arrowPadding","coverTarget","withArrow","offset","targetRef","containerRef","arrowRef"],"mappings":"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"}
1
+ {"version":3,"sources":["../src/components/Popover/usePopover.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n useControllableState,\n useEventCallback,\n useOnClickOutside,\n useOnScrollOutside,\n elementContains,\n useTimeout,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n usePositioning,\n resolvePositioningShorthand,\n mergeArrowOffset,\n usePositioningMouseTarget,\n usePositioningSlideDirection,\n} from '@fluentui/react-positioning';\nimport { useFocusFinders, useActivateModal } from '@fluentui/react-tabster';\nimport { arrowHeights } from '../PopoverSurface/index';\nimport type { OpenPopoverEvents, PopoverProps, PopoverState } from './Popover.types';\nimport { popoverSurfaceBorderRadius } from './constants';\nimport { presenceMotionSlot } from '@fluentui/react-motion';\nimport { PopoverSurfaceMotion } from './PopoverSurfaceMotion';\n\n/**\n * Create the state required to render Popover.\n *\n * The returned state can be modified with hooks such as usePopoverStyles,\n * before being passed to renderPopover_unstable.\n *\n * @param props - props from this instance of Popover\n */\nexport const usePopover_unstable = (props: PopoverProps): PopoverState => {\n const [contextTarget, setContextTarget] = usePositioningMouseTarget();\n const { targetDocument } = useFluent();\n\n const positioning = resolvePositioningShorthand(props.positioning);\n const handlePositionEnd = usePositioningSlideDirection({\n targetDocument,\n onPositioningEnd: positioning.onPositioningEnd,\n });\n\n const initialState = {\n size: 'medium',\n contextTarget,\n setContextTarget,\n ...props,\n positioning: {\n ...positioning,\n onPositioningEnd: handlePositionEnd,\n },\n } as const;\n\n const children = React.Children.toArray(props.children) as React.ReactElement[];\n\n if (process.env.NODE_ENV !== 'production') {\n if (children.length === 0) {\n // eslint-disable-next-line no-console\n console.warn('Popover must contain at least one child');\n }\n\n if (children.length > 2) {\n // eslint-disable-next-line no-console\n console.warn('Popover must contain at most two children');\n }\n }\n\n let popoverTrigger: React.ReactElement | undefined = undefined;\n let popoverSurface: React.ReactElement | undefined = undefined;\n if (children.length === 2) {\n popoverTrigger = children[0];\n popoverSurface = children[1];\n } else if (children.length === 1) {\n popoverSurface = children[0];\n }\n\n const [open, setOpenState] = useOpenState(initialState);\n\n const [setOpenTimeout, clearOpenTimeout] = useTimeout();\n const setOpen = useEventCallback((e: OpenPopoverEvents, shouldOpen: boolean) => {\n clearOpenTimeout();\n if (!(e instanceof Event) && e.persist) {\n // < React 17 still uses pooled synthetic events\n e.persist();\n }\n\n if (e.type === 'mouseleave') {\n // FIXME leaking Node timeout type\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n setOpenTimeout(() => {\n setOpenState(e, shouldOpen);\n }, props.mouseLeaveDelay ?? 500);\n } else {\n setOpenState(e, shouldOpen);\n }\n });\n\n const toggleOpen = React.useCallback<PopoverState['toggleOpen']>(\n (e: OpenPopoverEvents) => {\n setOpen(e, !open);\n },\n [setOpen, open],\n );\n\n const positioningRefs = usePopoverRefs(initialState);\n\n useOnClickOutside({\n contains: elementContains,\n element: targetDocument,\n callback: ev => setOpen(ev, false),\n refs: [positioningRefs.triggerRef, positioningRefs.contentRef],\n disabled: !open,\n disabledFocusOnIframe: !(props.closeOnIframeFocus ?? true),\n });\n\n // only close on scroll for context, or when closeOnScroll is specified\n const closeOnScroll = initialState.openOnContext || initialState.closeOnScroll;\n useOnScrollOutside({\n contains: elementContains,\n element: targetDocument,\n callback: ev => setOpen(ev, false),\n refs: [positioningRefs.triggerRef, positioningRefs.contentRef],\n disabled: !open || !closeOnScroll,\n });\n\n // When trapFocus is enabled, close the popover if focus is programmatically moved outside\n // (e.g. via element.focus()), which doesn't trigger click or scroll dismiss handlers.\n // Internal `closeOnFocusOutside` prop allows consumers to opt out during gradual rollout.\n const closeOnFocusOutside = (props as PopoverProps & { closeOnFocusOutside?: boolean }).closeOnFocusOutside ?? true;\n\n const closeOnFocusOutCallback = useEventCallback((ev: FocusEvent) => {\n const target = (ev.composedPath()[0] ?? ev.target) as HTMLElement;\n const contentElement = positioningRefs.contentRef.current;\n const triggerElement = positioningRefs.triggerRef.current ?? null;\n\n if (!contentElement) {\n return;\n }\n\n const isOutside = !elementContains(contentElement, target) && !elementContains(triggerElement, target);\n\n if (isOutside) {\n setOpen(ev, false);\n }\n });\n\n React.useEffect(() => {\n if (!open || !props.trapFocus || !closeOnFocusOutside) {\n return;\n }\n\n targetDocument?.addEventListener('focusin', closeOnFocusOutCallback, true);\n return () => {\n targetDocument?.removeEventListener('focusin', closeOnFocusOutCallback, true);\n };\n }, [open, props.trapFocus, closeOnFocusOutside, targetDocument, closeOnFocusOutCallback]);\n\n const { findFirstFocusable } = useFocusFinders();\n const activateModal = useActivateModal();\n\n React.useEffect(() => {\n if (props.unstable_disableAutoFocus) {\n return;\n }\n\n const contentElement = positioningRefs.contentRef.current;\n\n if (open && contentElement) {\n const shouldFocusContainer = !isNaN(contentElement.getAttribute('tabIndex') ?? undefined);\n const firstFocusable = shouldFocusContainer ? contentElement : findFirstFocusable(contentElement);\n\n firstFocusable?.focus();\n\n if (shouldFocusContainer) {\n // Modal activation happens automatically when something inside the modal is focused programmatically.\n // When the container is focused, we need to activate the modal manually.\n activateModal(contentElement);\n }\n }\n }, [findFirstFocusable, activateModal, open, positioningRefs.contentRef, props.unstable_disableAutoFocus]);\n\n return {\n components: {\n surfaceMotion: PopoverSurfaceMotion,\n },\n ...initialState,\n ...positioningRefs,\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n inertTrapFocus: props.inertTrapFocus ?? (props.legacyTrapFocus === undefined ? false : !props.legacyTrapFocus),\n popoverTrigger,\n popoverSurface,\n open,\n setOpen,\n toggleOpen,\n setContextTarget,\n contextTarget,\n inline: props.inline ?? false,\n surfaceMotion: presenceMotionSlot(props.surfaceMotion, {\n elementType: PopoverSurfaceMotion,\n defaultProps: {\n visible: open,\n appear: true,\n unmountOnExit: true,\n },\n }),\n };\n};\n\n/**\n * Creates and manages the Popover open state\n */\nfunction useOpenState(\n state: Pick<PopoverState, 'setContextTarget' | 'onOpenChange'> & Pick<PopoverProps, 'open' | 'defaultOpen'>,\n) {\n const onOpenChange: PopoverState['onOpenChange'] = useEventCallback((e, data) => state.onOpenChange?.(e, data));\n\n const [open, setOpenState] = useControllableState({\n state: state.open,\n defaultState: state.defaultOpen,\n initialState: false,\n });\n // eslint-disable-next-line react-hooks/immutability\n state.open = open !== undefined ? open : state.open;\n const setContextTarget = state.setContextTarget;\n\n const setOpen = React.useCallback(\n (e: OpenPopoverEvents, shouldOpen: boolean) => {\n if (shouldOpen && e.type === 'contextmenu') {\n setContextTarget(e as React.MouseEvent);\n }\n\n if (!shouldOpen) {\n setContextTarget(undefined);\n }\n\n setOpenState(shouldOpen);\n onOpenChange?.(e, { open: shouldOpen });\n },\n [setOpenState, onOpenChange, setContextTarget],\n );\n\n return [open, setOpen] as const;\n}\n\n/**\n * Creates and sets the necessary trigger, target and content refs used by Popover\n */\nfunction usePopoverRefs(\n state: Pick<PopoverState, 'size' | 'contextTarget'> &\n Pick<PopoverProps, 'positioning' | 'openOnContext' | 'withArrow'>,\n) {\n const positioningOptions = {\n position: 'above' as const,\n align: 'center' as const,\n arrowPadding: 2 * popoverSurfaceBorderRadius,\n target: state.openOnContext ? state.contextTarget : undefined,\n ...resolvePositioningShorthand(state.positioning),\n };\n\n // no reason to render arrow when covering the target\n if (positioningOptions.coverTarget) {\n // eslint-disable-next-line react-hooks/immutability\n state.withArrow = false;\n }\n\n if (state.withArrow) {\n positioningOptions.offset = mergeArrowOffset(positioningOptions.offset, arrowHeights[state.size]);\n }\n\n const { targetRef: triggerRef, containerRef: contentRef, arrowRef } = usePositioning(positioningOptions);\n\n return {\n triggerRef,\n contentRef,\n arrowRef,\n } as const;\n}\n"],"names":["React","useControllableState","useEventCallback","useOnClickOutside","useOnScrollOutside","elementContains","useTimeout","useFluent_unstable","useFluent","usePositioning","resolvePositioningShorthand","mergeArrowOffset","usePositioningMouseTarget","usePositioningSlideDirection","useFocusFinders","useActivateModal","arrowHeights","popoverSurfaceBorderRadius","presenceMotionSlot","PopoverSurfaceMotion","usePopover_unstable","props","contextTarget","setContextTarget","targetDocument","positioning","handlePositionEnd","onPositioningEnd","initialState","size","children","Children","toArray","process","env","NODE_ENV","length","console","warn","popoverTrigger","undefined","popoverSurface","open","setOpenState","useOpenState","setOpenTimeout","clearOpenTimeout","setOpen","e","shouldOpen","Event","persist","type","mouseLeaveDelay","toggleOpen","useCallback","positioningRefs","usePopoverRefs","contains","element","callback","ev","refs","triggerRef","contentRef","disabled","disabledFocusOnIframe","closeOnIframeFocus","closeOnScroll","openOnContext","closeOnFocusOutside","closeOnFocusOutCallback","target","composedPath","contentElement","current","triggerElement","isOutside","useEffect","trapFocus","addEventListener","removeEventListener","findFirstFocusable","activateModal","unstable_disableAutoFocus","shouldFocusContainer","isNaN","getAttribute","firstFocusable","focus","components","surfaceMotion","inertTrapFocus","legacyTrapFocus","inline","elementType","defaultProps","visible","appear","unmountOnExit","state","onOpenChange","data","defaultState","defaultOpen","positioningOptions","position","align","arrowPadding","coverTarget","withArrow","offset","targetRef","containerRef","arrowRef"],"mappings":"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"}
@@ -238,7 +238,6 @@ const arrowHeights = {
238
238
  ]
239
239
  });
240
240
  const usePopoverSurfaceStyles_unstable = (state)=>{
241
- 'use no memo';
242
241
  const styles = useStyles();
243
242
  // eslint-disable-next-line react-hooks/immutability
244
243
  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);
@@ -1 +1 @@
1
- {"version":3,"sources":["usePopoverSurfaceStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { createArrowHeightStyles, createArrowStyles } from '@fluentui/react-positioning';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const popoverSurfaceClassNames = {\n root: 'fui-PopoverSurface'\n};\nexport const arrowHeights = {\n small: 6,\n medium: 8,\n large: 8\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n color: tokens.colorNeutralForeground1,\n backgroundColor: tokens.colorNeutralBackground1,\n borderRadius: tokens.borderRadiusMedium,\n border: `1px solid ${tokens.colorTransparentStroke}`,\n ...typographyStyles.body1,\n // TODO need to add versions of tokens.alias.shadow.shadow16, etc. that work with filter\n filter: `drop-shadow(0 0 2px ${tokens.colorNeutralShadowAmbient}) ` + `drop-shadow(0 8px 16px ${tokens.colorNeutralShadowKey})`\n },\n inline: {\n // When rendering inline, the PopoverSurface will be rendered under relatively positioned elements such as Input.\n // This is due to the surface being positioned as absolute, therefore zIndex: 1 ensures that won't happen.\n zIndex: 1\n },\n inverted: {\n backgroundColor: tokens.colorNeutralBackgroundStatic,\n color: tokens.colorNeutralForegroundStaticInverted\n },\n brand: {\n backgroundColor: tokens.colorBrandBackground,\n color: tokens.colorNeutralForegroundOnBrand\n },\n smallPadding: {\n padding: '12px'\n },\n mediumPadding: {\n padding: '16px'\n },\n largePadding: {\n padding: '20px'\n },\n smallArrow: createArrowHeightStyles(arrowHeights.small),\n mediumLargeArrow: createArrowHeightStyles(arrowHeights.medium),\n arrow: createArrowStyles({\n arrowHeight: undefined\n })\n});\n/**\n * Apply styling to the PopoverSurface slots based on the state\n */ export const usePopoverSurfaceStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = 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);\n // eslint-disable-next-line react-hooks/immutability\n state.arrowClassName = mergeClasses(styles.arrow, state.size === 'small' ? styles.smallArrow : styles.mediumLargeArrow);\n return state;\n};\n"],"names":["__styles","mergeClasses","createArrowHeightStyles","createArrowStyles","tokens","typographyStyles","popoverSurfaceClassNames","root","arrowHeights","small","medium","large","useStyles","sj55zd","De3pzq","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","Bhu2qc9","inline","Bj3rh1h","inverted","brand","smallPadding","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","mediumPadding","largePadding","smallArrow","rhnwrx","Bdy53xb","mediumLargeArrow","arrow","B7ck84d","qhf8xq","B2eet1l","Bz10aip","Bqenvij","a9b677","Ftih45","Br0sdwz","cmx5o7","susq4k","Biibvgv","Bicfajf","qehafq","Brs5u8j","Ccq8qp","Baz25je","Bcgcnre","Bqjgrrk","qa3bma","y0oebl","Biqmznv","Bm6vgfq","Bbv0w2i","uvfttm","eqrjj","Bk5zm6e","m598lv","B4f6apu","ydt019","Bq4z7u6","Bdkvgpv","B0qfbqy","kj8mxx","r59vdv","Bkw5xw4","hl6cv3","aea9ga","yayu3t","Bhsv975","rhl9o9","B7gxrvb","B6q6orb","B0lu1f8","d","p","usePopoverSurfaceStyles_unstable","state","styles","className","size","appearance","arrowClassName"],"mappings":"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"}
1
+ {"version":3,"sources":["usePopoverSurfaceStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { createArrowHeightStyles, createArrowStyles } from '@fluentui/react-positioning';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const popoverSurfaceClassNames = {\n root: 'fui-PopoverSurface'\n};\nexport const arrowHeights = {\n small: 6,\n medium: 8,\n large: 8\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n color: tokens.colorNeutralForeground1,\n backgroundColor: tokens.colorNeutralBackground1,\n borderRadius: tokens.borderRadiusMedium,\n border: `1px solid ${tokens.colorTransparentStroke}`,\n ...typographyStyles.body1,\n // TODO need to add versions of tokens.alias.shadow.shadow16, etc. that work with filter\n filter: `drop-shadow(0 0 2px ${tokens.colorNeutralShadowAmbient}) ` + `drop-shadow(0 8px 16px ${tokens.colorNeutralShadowKey})`\n },\n inline: {\n // When rendering inline, the PopoverSurface will be rendered under relatively positioned elements such as Input.\n // This is due to the surface being positioned as absolute, therefore zIndex: 1 ensures that won't happen.\n zIndex: 1\n },\n inverted: {\n backgroundColor: tokens.colorNeutralBackgroundStatic,\n color: tokens.colorNeutralForegroundStaticInverted\n },\n brand: {\n backgroundColor: tokens.colorBrandBackground,\n color: tokens.colorNeutralForegroundOnBrand\n },\n smallPadding: {\n padding: '12px'\n },\n mediumPadding: {\n padding: '16px'\n },\n largePadding: {\n padding: '20px'\n },\n smallArrow: createArrowHeightStyles(arrowHeights.small),\n mediumLargeArrow: createArrowHeightStyles(arrowHeights.medium),\n arrow: createArrowStyles({\n arrowHeight: undefined\n })\n});\n/**\n * Apply styling to the PopoverSurface slots based on the state\n */ export const usePopoverSurfaceStyles_unstable = (state)=>{\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = 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);\n // eslint-disable-next-line react-hooks/immutability\n state.arrowClassName = mergeClasses(styles.arrow, state.size === 'small' ? styles.smallArrow : styles.mediumLargeArrow);\n return state;\n};\n"],"names":["__styles","mergeClasses","createArrowHeightStyles","createArrowStyles","tokens","typographyStyles","popoverSurfaceClassNames","root","arrowHeights","small","medium","large","useStyles","sj55zd","De3pzq","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","Bhu2qc9","inline","Bj3rh1h","inverted","brand","smallPadding","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","mediumPadding","largePadding","smallArrow","rhnwrx","Bdy53xb","mediumLargeArrow","arrow","B7ck84d","qhf8xq","B2eet1l","Bz10aip","Bqenvij","a9b677","Ftih45","Br0sdwz","cmx5o7","susq4k","Biibvgv","Bicfajf","qehafq","Brs5u8j","Ccq8qp","Baz25je","Bcgcnre","Bqjgrrk","qa3bma","y0oebl","Biqmznv","Bm6vgfq","Bbv0w2i","uvfttm","eqrjj","Bk5zm6e","m598lv","B4f6apu","ydt019","Bq4z7u6","Bdkvgpv","B0qfbqy","kj8mxx","r59vdv","Bkw5xw4","hl6cv3","aea9ga","yayu3t","Bhsv975","rhl9o9","B7gxrvb","B6q6orb","B0lu1f8","d","p","usePopoverSurfaceStyles_unstable","state","styles","className","size","appearance","arrowClassName"],"mappings":"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"}
@@ -72,7 +72,6 @@ const arrowHeights = {
72
72
  })
73
73
  });
74
74
  const usePopoverSurfaceStyles_unstable = (state)=>{
75
- 'use no memo';
76
75
  const styles = useStyles();
77
76
  // eslint-disable-next-line react-hooks/immutability
78
77
  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);
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/PopoverSurface/usePopoverSurfaceStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { createArrowHeightStyles, createArrowStyles } from '@fluentui/react-positioning';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { PopoverSize } from '../Popover/Popover.types';\nimport type { PopoverSurfaceSlots, PopoverSurfaceState } from './PopoverSurface.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const popoverSurfaceClassNames: SlotClassNames<PopoverSurfaceSlots> = {\n root: 'fui-PopoverSurface',\n};\n\nexport const arrowHeights: Record<PopoverSize, number> = {\n small: 6,\n medium: 8,\n large: 8,\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n color: tokens.colorNeutralForeground1,\n backgroundColor: tokens.colorNeutralBackground1,\n borderRadius: tokens.borderRadiusMedium,\n border: `1px solid ${tokens.colorTransparentStroke}`,\n ...typographyStyles.body1,\n\n // TODO need to add versions of tokens.alias.shadow.shadow16, etc. that work with filter\n filter:\n `drop-shadow(0 0 2px ${tokens.colorNeutralShadowAmbient}) ` +\n `drop-shadow(0 8px 16px ${tokens.colorNeutralShadowKey})`,\n },\n\n inline: {\n // When rendering inline, the PopoverSurface will be rendered under relatively positioned elements such as Input.\n // This is due to the surface being positioned as absolute, therefore zIndex: 1 ensures that won't happen.\n zIndex: 1,\n },\n\n inverted: {\n backgroundColor: tokens.colorNeutralBackgroundStatic,\n color: tokens.colorNeutralForegroundStaticInverted,\n },\n\n brand: {\n backgroundColor: tokens.colorBrandBackground,\n color: tokens.colorNeutralForegroundOnBrand,\n },\n\n smallPadding: { padding: '12px' },\n\n mediumPadding: { padding: '16px' },\n\n largePadding: { padding: '20px' },\n\n smallArrow: createArrowHeightStyles(arrowHeights.small),\n mediumLargeArrow: createArrowHeightStyles(arrowHeights.medium),\n arrow: createArrowStyles({ arrowHeight: undefined }),\n});\n\n/**\n * Apply styling to the PopoverSurface slots based on the state\n */\nexport const usePopoverSurfaceStyles_unstable = (state: PopoverSurfaceState): PopoverSurfaceState => {\n 'use no memo';\n\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n popoverSurfaceClassNames.root,\n styles.root,\n state.inline && styles.inline,\n state.size === 'small' && styles.smallPadding,\n state.size === 'medium' && styles.mediumPadding,\n state.size === 'large' && styles.largePadding,\n state.appearance === 'inverted' && styles.inverted,\n state.appearance === 'brand' && styles.brand,\n state.root.className,\n );\n\n // eslint-disable-next-line react-hooks/immutability\n state.arrowClassName = mergeClasses(\n styles.arrow,\n state.size === 'small' ? styles.smallArrow : styles.mediumLargeArrow,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","createArrowHeightStyles","createArrowStyles","tokens","typographyStyles","popoverSurfaceClassNames","root","arrowHeights","small","medium","large","useStyles","color","colorNeutralForeground1","backgroundColor","colorNeutralBackground1","borderRadius","borderRadiusMedium","border","colorTransparentStroke","body1","filter","colorNeutralShadowAmbient","colorNeutralShadowKey","inline","zIndex","inverted","colorNeutralBackgroundStatic","colorNeutralForegroundStaticInverted","brand","colorBrandBackground","colorNeutralForegroundOnBrand","smallPadding","padding","mediumPadding","largePadding","smallArrow","mediumLargeArrow","arrow","arrowHeight","undefined","usePopoverSurfaceStyles_unstable","state","styles","className","size","appearance","arrowClassName"],"mappings":"AAAA;;;;;;;;;;;;IAaaQ,YAAAA;;;4BAJAF;;;oCAyDAoC;eAAAA;;;uBAhE4B,iBAAiB;kCACC,8BAA8B;4BAChD,wBAAwB;AAK1D,MAAMpC,2BAAgE;IAC3EC,MAAM;AACR,EAAE;AAEK,qBAAkD;IACvDE,OAAO;IACPC,QAAQ;IACRC,OAAO;AACT,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYZ,iBAAAA,EAAW;IAC3BO,MAAM;QACJM,OAAOT,kBAAAA,CAAOU,uBAAuB;QACrCC,iBAAiBX,kBAAAA,CAAOY,uBAAuB;QAC/CC,cAAcb,kBAAAA,CAAOc,kBAAkB;QACvCC,QAAQ,CAAC,UAAU,EAAEf,kBAAAA,CAAOgB,sBAAsB,EAAE;QACpD,GAAGf,4BAAAA,CAAiBgB,KAAK;QAEzB,wFAAwF;QACxFC,QACE,CAAC,oBAAoB,EAAElB,kBAAAA,CAAOmB,yBAAyB,CAAC,EAAE,CAAC,GAC3D,CAAC,uBAAuB,EAAEnB,kBAAAA,CAAOoB,qBAAqB,CAAC,CAAC,CAAC;IAC7D;IAEAC,QAAQ;QACN,iHAAiH;QACjH,0GAA0G;QAC1GC,QAAQ;IACV;IAEAC,UAAU;QACRZ,iBAAiBX,kBAAAA,CAAOwB,4BAA4B;QACpDf,OAAOT,kBAAAA,CAAOyB,oCAAoC;IACpD;IAEAC,OAAO;QACLf,iBAAiBX,kBAAAA,CAAO2B,oBAAoB;QAC5ClB,OAAOT,kBAAAA,CAAO4B,6BAA6B;IAC7C;IAEAC,cAAc;QAAEC,SAAS;IAAO;IAEhCC,eAAe;QAAED,SAAS;IAAO;IAEjCE,cAAc;QAAEF,SAAS;IAAO;IAEhCG,YAAYnC,6CAAAA,EAAwBM,aAAaC,KAAK;IACtD6B,sBAAkBpC,yCAAAA,EAAwBM,aAAaE,MAAM;IAC7D6B,WAAOpC,mCAAAA,EAAkB;QAAEqC,aAAaC;IAAU;AACpD;AAKO,yCAAyC,CAACE;IAC/C;IAEA,MAAMC,SAAShC;IACf,oDAAoD;IACpD+B,MAAMpC,IAAI,CAACsC,SAAS,OAAG5C,mBAAAA,EACrBK,yBAAyBC,IAAI,EAC7BqC,OAAOrC,IAAI,EACXoC,MAAMlB,MAAM,IAAImB,OAAOnB,MAAM,EAC7BkB,MAAMG,IAAI,KAAK,WAAWF,OAAOX,YAAY,EAC7CU,MAAMG,IAAI,KAAK,YAAYF,OAAOT,aAAa,EAC/CQ,MAAMG,IAAI,KAAK,WAAWF,OAAOR,YAAY,EAC7CO,MAAMI,UAAU,KAAK,cAAcH,OAAOjB,QAAQ,EAClDgB,MAAMI,UAAU,KAAK,WAAWH,OAAOd,KAAK,EAC5Ca,MAAMpC,IAAI,CAACsC,SAAS;IAGtB,oDAAoD;IACpDF,MAAMK,cAAc,OAAG/C,mBAAAA,EACrB2C,OAAOL,KAAK,EACZI,MAAMG,IAAI,KAAK,UAAUF,OAAOP,UAAU,GAAGO,OAAON,gBAAgB;IAGtE,OAAOK;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/PopoverSurface/usePopoverSurfaceStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { createArrowHeightStyles, createArrowStyles } from '@fluentui/react-positioning';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { PopoverSize } from '../Popover/Popover.types';\nimport type { PopoverSurfaceSlots, PopoverSurfaceState } from './PopoverSurface.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const popoverSurfaceClassNames: SlotClassNames<PopoverSurfaceSlots> = {\n root: 'fui-PopoverSurface',\n};\n\nexport const arrowHeights: Record<PopoverSize, number> = {\n small: 6,\n medium: 8,\n large: 8,\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n color: tokens.colorNeutralForeground1,\n backgroundColor: tokens.colorNeutralBackground1,\n borderRadius: tokens.borderRadiusMedium,\n border: `1px solid ${tokens.colorTransparentStroke}`,\n ...typographyStyles.body1,\n\n // TODO need to add versions of tokens.alias.shadow.shadow16, etc. that work with filter\n filter:\n `drop-shadow(0 0 2px ${tokens.colorNeutralShadowAmbient}) ` +\n `drop-shadow(0 8px 16px ${tokens.colorNeutralShadowKey})`,\n },\n\n inline: {\n // When rendering inline, the PopoverSurface will be rendered under relatively positioned elements such as Input.\n // This is due to the surface being positioned as absolute, therefore zIndex: 1 ensures that won't happen.\n zIndex: 1,\n },\n\n inverted: {\n backgroundColor: tokens.colorNeutralBackgroundStatic,\n color: tokens.colorNeutralForegroundStaticInverted,\n },\n\n brand: {\n backgroundColor: tokens.colorBrandBackground,\n color: tokens.colorNeutralForegroundOnBrand,\n },\n\n smallPadding: { padding: '12px' },\n\n mediumPadding: { padding: '16px' },\n\n largePadding: { padding: '20px' },\n\n smallArrow: createArrowHeightStyles(arrowHeights.small),\n mediumLargeArrow: createArrowHeightStyles(arrowHeights.medium),\n arrow: createArrowStyles({ arrowHeight: undefined }),\n});\n\n/**\n * Apply styling to the PopoverSurface slots based on the state\n */\nexport const usePopoverSurfaceStyles_unstable = (state: PopoverSurfaceState): PopoverSurfaceState => {\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n popoverSurfaceClassNames.root,\n styles.root,\n state.inline && styles.inline,\n state.size === 'small' && styles.smallPadding,\n state.size === 'medium' && styles.mediumPadding,\n state.size === 'large' && styles.largePadding,\n state.appearance === 'inverted' && styles.inverted,\n state.appearance === 'brand' && styles.brand,\n state.root.className,\n );\n\n // eslint-disable-next-line react-hooks/immutability\n state.arrowClassName = mergeClasses(\n styles.arrow,\n state.size === 'small' ? styles.smallArrow : styles.mediumLargeArrow,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","createArrowHeightStyles","createArrowStyles","tokens","typographyStyles","popoverSurfaceClassNames","root","arrowHeights","small","medium","large","useStyles","color","colorNeutralForeground1","backgroundColor","colorNeutralBackground1","borderRadius","borderRadiusMedium","border","colorTransparentStroke","body1","filter","colorNeutralShadowAmbient","colorNeutralShadowKey","inline","zIndex","inverted","colorNeutralBackgroundStatic","colorNeutralForegroundStaticInverted","brand","colorBrandBackground","colorNeutralForegroundOnBrand","smallPadding","padding","mediumPadding","largePadding","smallArrow","mediumLargeArrow","arrow","arrowHeight","undefined","usePopoverSurfaceStyles_unstable","state","styles","className","size","appearance","arrowClassName"],"mappings":"AAAA;;;;;;;;;;;;IAaaQ,YAAAA;;;4BAJAF;;;oCAyDAoC;eAAAA;;;uBAhE4B,iBAAiB;kCACC,8BAA8B;4BAChD,wBAAwB;AAK1D,MAAMpC,2BAAgE;IAC3EC,MAAM;AACR,EAAE;AAEK,qBAAkD;IACvDE,OAAO;IACPC,QAAQ;IACRC,OAAO;AACT,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYZ,iBAAAA,EAAW;IAC3BO,MAAM;QACJM,OAAOT,kBAAAA,CAAOU,uBAAuB;QACrCC,iBAAiBX,kBAAAA,CAAOY,uBAAuB;QAC/CC,cAAcb,kBAAAA,CAAOc,kBAAkB;QACvCC,QAAQ,CAAC,UAAU,EAAEf,kBAAAA,CAAOgB,sBAAsB,EAAE;QACpD,GAAGf,4BAAAA,CAAiBgB,KAAK;QAEzB,wFAAwF;QACxFC,QACE,CAAC,oBAAoB,EAAElB,kBAAAA,CAAOmB,yBAAyB,CAAC,EAAE,CAAC,GAC3D,CAAC,uBAAuB,EAAEnB,kBAAAA,CAAOoB,qBAAqB,CAAC,CAAC,CAAC;IAC7D;IAEAC,QAAQ;QACN,iHAAiH;QACjH,0GAA0G;QAC1GC,QAAQ;IACV;IAEAC,UAAU;QACRZ,iBAAiBX,kBAAAA,CAAOwB,4BAA4B;QACpDf,OAAOT,kBAAAA,CAAOyB,oCAAoC;IACpD;IAEAC,OAAO;QACLf,iBAAiBX,kBAAAA,CAAO2B,oBAAoB;QAC5ClB,OAAOT,kBAAAA,CAAO4B,6BAA6B;IAC7C;IAEAC,cAAc;QAAEC,SAAS;IAAO;IAEhCC,eAAe;QAAED,SAAS;IAAO;IAEjCE,cAAc;QAAEF,SAAS;IAAO;IAEhCG,YAAYnC,6CAAAA,EAAwBM,aAAaC,KAAK;IACtD6B,sBAAkBpC,yCAAAA,EAAwBM,aAAaE,MAAM;IAC7D6B,WAAOpC,mCAAAA,EAAkB;QAAEqC,aAAaC;IAAU;AACpD;AAKO,yCAAyC,CAACE;IAC/C,MAAMC,SAAShC;IACf,oDAAoD;IACpD+B,MAAMpC,IAAI,CAACsC,SAAS,OAAG5C,mBAAAA,EACrBK,yBAAyBC,IAAI,EAC7BqC,OAAOrC,IAAI,EACXoC,MAAMlB,MAAM,IAAImB,OAAOnB,MAAM,EAC7BkB,MAAMG,IAAI,KAAK,WAAWF,OAAOX,YAAY,EAC7CU,MAAMG,IAAI,KAAK,YAAYF,OAAOT,aAAa,EAC/CQ,MAAMG,IAAI,KAAK,WAAWF,OAAOR,YAAY,EAC7CO,MAAMI,UAAU,KAAK,cAAcH,OAAOjB,QAAQ,EAClDgB,MAAMI,UAAU,KAAK,WAAWH,OAAOd,KAAK,EAC5Ca,MAAMpC,IAAI,CAACsC,SAAS;IAGtB,oDAAoD;IACpDF,MAAMK,cAAc,OAAG/C,mBAAAA,EACrB2C,OAAOL,KAAK,EACZI,MAAMG,IAAI,KAAK,UAAUF,OAAOP,UAAU,GAAGO,OAAON,gBAAgB;IAGtE,OAAOK;AACT,EAAE"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-popover",
3
- "version": "9.14.3",
3
+ "version": "9.14.4",
4
4
  "description": "Popover component for Fluent UI",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -13,17 +13,17 @@
13
13
  "license": "MIT",
14
14
  "dependencies": {
15
15
  "@fluentui/keyboard-keys": "^9.0.8",
16
- "@fluentui/react-aria": "^9.17.12",
17
- "@fluentui/react-context-selector": "^9.2.17",
18
- "@fluentui/react-motion": "^9.16.0",
19
- "@fluentui/react-motion-components-preview": "^0.15.5",
20
- "@fluentui/react-portal": "^9.8.13",
21
- "@fluentui/react-positioning": "^9.22.2",
16
+ "@fluentui/react-aria": "^9.17.13",
17
+ "@fluentui/react-context-selector": "^9.2.18",
18
+ "@fluentui/react-motion": "^9.16.1",
19
+ "@fluentui/react-motion-components-preview": "^0.15.6",
20
+ "@fluentui/react-portal": "^9.8.14",
21
+ "@fluentui/react-positioning": "^9.22.3",
22
22
  "@fluentui/react-shared-contexts": "^9.26.2",
23
- "@fluentui/react-tabster": "^9.26.15",
23
+ "@fluentui/react-tabster": "^9.26.16",
24
24
  "@fluentui/react-theme": "^9.2.1",
25
- "@fluentui/react-utilities": "^9.26.4",
26
- "@fluentui/react-jsx-runtime": "^9.4.3",
25
+ "@fluentui/react-utilities": "^9.26.5",
26
+ "@fluentui/react-jsx-runtime": "^9.4.4",
27
27
  "@griffel/react": "^1.5.32",
28
28
  "@swc/helpers": "^0.5.1"
29
29
  },