UNPKG

react-aria

Version:
1 lines 6.33 kB
{"mappings":";;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AA2EM,SAAS,0CAAW,KAAuB,EAAE,KAA0B;IAC5E,IAAI,cACF,UAAU,cACV,UAAU,YACV,QAAQ,cACR,UAAU,6BACV,yBAAyB,gCACzB,4BAA4B,EAC5B,GAAG,YACJ,GAAG;IAEJ,IAAI,YAAY,UAAU,CAAC,UAAU,KAAK;IAE1C,IAAI,gBAAC,YAAY,iBAAE,aAAa,EAAC,GAAG,CAAA,GAAA,oCAAS,EAC3C;QACE,QAAQ,MAAM,MAAM;QACpB,SAAS,MAAM,KAAK;QACpB,mBAAmB;QACnB,eAAe,CAAC,cAAc;mCAC9B;sCACA;IACF,GACA,YAAY;IAGd,IAAI,EACF,cAAc,aAAa,cAC3B,UAAU,aACV,SAAS,EACT,oBAAoB,MAAM,EAC3B,GAAG,CAAA,GAAA,4CAAiB,EAAE;QACrB,GAAG,UAAU;QACb,WAAW;QACX,YAAY;QACZ,QAAQ,MAAM,MAAM;QACpB,SAAS,cAAc,CAAC,YAAY,MAAM,KAAK,GAAG;IACpD;IAEA,CAAA,GAAA,0CAAe,EAAE;QACf,YAAY,cAAc,CAAC,MAAM,MAAM;IACzC;IAEA,CAAA,GAAA,sBAAQ,EAAE;QACR,IAAI,MAAM,MAAM,IAAI,WAAW,OAAO,EAAE;YACtC,IAAI,YACF,OAAO,CAAA,GAAA,qCAAU,EAAE,UAAU,WAAW,WAAW,OAAO;iBAE1D,OAAO,CAAA,GAAA,yCAAc,EAAE;gBAAC,UAAU,WAAW,WAAW,OAAO;aAAC,EAAE;gBAAC,gBAAgB;YAAI;QAE3F;IACF,GAAG;QAAC;QAAY,MAAM,MAAM;QAAE;QAAY;KAAS;IAEnD,OAAO;QACL,cAAc,CAAA,GAAA,oCAAS,EAAE,cAAc;oBACvC;uBACA;mBACA;QACA,oBAAoB;IACtB;AACF","sources":["packages/react-aria/src/overlays/usePopover.ts"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ariaHideOutside, keepVisible} from './ariaHideOutside';\nimport {AriaPositionProps, PlacementAxis, useOverlayPosition} from './useOverlayPosition';\nimport {DOMAttributes, RefObject} from '@react-types/shared';\nimport {mergeProps} from '../utils/mergeProps';\nimport {OverlayTriggerState} from 'react-stately/useOverlayTriggerState';\nimport {useEffect} from 'react';\nimport {useOverlay} from './useOverlay';\nimport {usePreventScroll} from './usePreventScroll';\n\nexport interface AriaPopoverProps extends Omit<\n AriaPositionProps,\n 'isOpen' | 'onClose' | 'targetRef' | 'overlayRef'\n> {\n /**\n * The ref for the element which the popover positions itself with respect to.\n */\n triggerRef: RefObject<Element | null>;\n /**\n * The ref for the popover element.\n */\n popoverRef: RefObject<Element | null>;\n /** A ref for the popover arrow element. */\n arrowRef?: RefObject<Element | null>;\n /**\n * An optional ref for a group of popovers, e.g. submenus.\n * When provided, this element is used to detect outside interactions\n * and hiding elements from assistive technologies instead of the popoverRef.\n */\n groupRef?: RefObject<Element | null>;\n /**\n * Whether the popover is non-modal, i.e. elements outside the popover may be\n * interacted with by assistive technologies.\n *\n * Most popovers should not use this option as it may negatively impact the screen\n * reader experience. Only use with components such as combobox, which are designed\n * to handle this situation carefully.\n */\n isNonModal?: boolean;\n /**\n * Whether pressing the escape key to close the popover should be disabled.\n *\n * Most popovers should not use this option. When set to true, an alternative\n * way to close the popover with a keyboard must be provided.\n *\n * @default false\n */\n isKeyboardDismissDisabled?: boolean;\n /**\n * When user interacts with the argument element outside of the popover ref,\n * return true if onClose should be called. This gives you a chance to filter\n * out interaction with elements that should not dismiss the popover.\n * By default, onClose will always be called on interaction outside the popover ref.\n */\n shouldCloseOnInteractOutside?: (element: Element) => boolean;\n}\n\nexport interface PopoverAria {\n /** Props for the popover element. */\n popoverProps: DOMAttributes;\n /** Props for the popover tip arrow if any. */\n arrowProps: DOMAttributes;\n /** Props to apply to the underlay element, if any. */\n underlayProps: DOMAttributes;\n /** Placement of the popover with respect to the trigger. */\n placement: PlacementAxis | null;\n /** The origin of the target in the overlay's coordinate system. Useful for animations. */\n triggerAnchorPoint: {x: number; y: number} | null;\n}\n\n/**\n * Provides the behavior and accessibility implementation for a popover component.\n * A popover is an overlay element positioned relative to a trigger.\n */\nexport function usePopover(props: AriaPopoverProps, state: OverlayTriggerState): PopoverAria {\n let {\n triggerRef,\n popoverRef,\n groupRef,\n isNonModal,\n isKeyboardDismissDisabled,\n shouldCloseOnInteractOutside,\n ...otherProps\n } = props;\n\n let isSubmenu = otherProps['trigger'] === 'SubmenuTrigger';\n\n let {overlayProps, underlayProps} = useOverlay(\n {\n isOpen: state.isOpen,\n onClose: state.close,\n shouldCloseOnBlur: true,\n isDismissable: !isNonModal || isSubmenu,\n isKeyboardDismissDisabled,\n shouldCloseOnInteractOutside\n },\n groupRef ?? popoverRef\n );\n\n let {\n overlayProps: positionProps,\n arrowProps,\n placement,\n triggerAnchorPoint: origin\n } = useOverlayPosition({\n ...otherProps,\n targetRef: triggerRef,\n overlayRef: popoverRef,\n isOpen: state.isOpen,\n onClose: isNonModal && !isSubmenu ? state.close : null\n });\n\n usePreventScroll({\n isDisabled: isNonModal || !state.isOpen\n });\n\n useEffect(() => {\n if (state.isOpen && popoverRef.current) {\n if (isNonModal) {\n return keepVisible(groupRef?.current ?? popoverRef.current);\n } else {\n return ariaHideOutside([groupRef?.current ?? popoverRef.current], {shouldUseInert: true});\n }\n }\n }, [isNonModal, state.isOpen, popoverRef, groupRef]);\n\n return {\n popoverProps: mergeProps(overlayProps, positionProps),\n arrowProps,\n underlayProps,\n placement,\n triggerAnchorPoint: origin\n };\n}\n"],"names":[],"version":3,"file":"usePopover.cjs.map"}