{"version":3,"file":"PopoverDropdown.mjs","names":["classes"],"sources":["../../../../src/components/Popover/PopoverDropdown/PopoverDropdown.tsx"],"sourcesContent":["import { useFocusReturn, useMergedRef } from '@mantine/hooks';\nimport {\n  Box,\n  BoxProps,\n  closeOnEscape,\n  CompoundStylesApiProps,\n  ElementProps,\n  factory,\n  Factory,\n  rem,\n  useProps,\n} from '../../../core';\nimport { FloatingArrow } from '../../../utils/Floating';\nimport { FocusTrap } from '../../FocusTrap';\nimport { OptionalPortal } from '../../Portal';\nimport { Transition } from '../../Transition';\nimport type { PopoverStylesNames } from '../Popover';\nimport { usePopoverContext } from '../Popover.context';\nimport classes from '../Popover.module.css';\n\nexport interface PopoverDropdownProps\n  extends BoxProps, CompoundStylesApiProps<PopoverDropdownFactory>, ElementProps<'div'> {}\n\nexport type PopoverDropdownFactory = Factory<{\n  props: PopoverDropdownProps;\n  ref: HTMLDivElement;\n  stylesNames: PopoverStylesNames;\n  compound: true;\n}>;\n\nexport const PopoverDropdown = factory<PopoverDropdownFactory>((_props) => {\n  const props = useProps('PopoverDropdown', null, _props);\n  const {\n    className,\n    style,\n    vars,\n    children,\n    onKeyDownCapture,\n    variant,\n    classNames,\n    styles,\n    ref,\n    ...others\n  } = props;\n\n  const ctx = usePopoverContext();\n\n  const returnFocus = useFocusReturn({\n    opened: ctx.opened,\n    shouldReturnFocus: ctx.returnFocus,\n  });\n\n  const accessibleProps = ctx.withRoles\n    ? {\n        'aria-labelledby': ctx.getTargetId(),\n        id: ctx.getDropdownId(),\n        role: 'dialog',\n        tabIndex: -1,\n      }\n    : {};\n\n  const mergedRef = useMergedRef(ref, ctx.floating);\n\n  if (ctx.disabled) {\n    return null;\n  }\n\n  return (\n    <OptionalPortal {...ctx.portalProps} withinPortal={ctx.withinPortal}>\n      <Transition\n        mounted={ctx.opened}\n        {...ctx.transitionProps}\n        transition={ctx.transitionProps?.transition || 'fade'}\n        duration={ctx.transitionProps?.duration ?? 150}\n        keepMounted={ctx.keepMounted}\n        exitDuration={\n          typeof ctx.transitionProps?.exitDuration === 'number'\n            ? ctx.transitionProps.exitDuration\n            : ctx.transitionProps?.duration\n        }\n      >\n        {(transitionStyles) => (\n          <FocusTrap active={ctx.trapFocus && ctx.opened} innerRef={mergedRef}>\n            <Box\n              {...accessibleProps}\n              {...others}\n              variant={variant}\n              onKeyDownCapture={closeOnEscape(\n                () => {\n                  ctx.onClose?.();\n                  ctx.onDismiss?.();\n                },\n                {\n                  active: ctx.closeOnEscape,\n                  onTrigger: returnFocus,\n                  onKeyDown: onKeyDownCapture,\n                }\n              )}\n              data-position={ctx.placement}\n              data-fixed={ctx.floatingStrategy === 'fixed' || undefined}\n              {...ctx.getStyles('dropdown', {\n                className,\n                props,\n                classNames,\n                styles,\n                style: [\n                  {\n                    ...transitionStyles,\n                    zIndex: ctx.zIndex as React.CSSProperties['zIndex'],\n                    top: ctx.y ?? 0,\n                    left: ctx.x ?? 0,\n                    width: ctx.width === 'target' ? undefined : rem(ctx.width),\n                    ...(ctx.referenceHidden ? { display: 'none' } : null),\n                  },\n                  ctx.resolvedStyles.dropdown,\n                  styles?.dropdown,\n                  style,\n                ],\n              })}\n            >\n              {children}\n\n              <FloatingArrow\n                ref={ctx.arrowRef}\n                arrowX={ctx.arrowX}\n                arrowY={ctx.arrowY}\n                visible={ctx.withArrow}\n                position={ctx.placement}\n                arrowSize={ctx.arrowSize}\n                arrowRadius={ctx.arrowRadius}\n                arrowOffset={ctx.arrowOffset}\n                arrowPosition={ctx.arrowPosition}\n                {...ctx.getStyles('arrow', {\n                  props,\n                  classNames,\n                  styles,\n                })}\n              />\n            </Box>\n          </FocusTrap>\n        )}\n      </Transition>\n    </OptionalPortal>\n  );\n});\n\nPopoverDropdown.classes = classes;\nPopoverDropdown.displayName = '@mantine/core/PopoverDropdown';\n"],"mappings":";;;;;;;;;;;;;;;AA8BA,MAAa,kBAAkB,SAAiC,WAAW;CACzE,MAAM,QAAQ,SAAS,mBAAmB,MAAM,OAAO;CACvD,MAAM,EACJ,WACA,OACA,MACA,UACA,kBACA,SACA,YACA,QACA,KACA,GAAG,WACD;CAEJ,MAAM,MAAM,mBAAmB;CAE/B,MAAM,cAAc,eAAe;EACjC,QAAQ,IAAI;EACZ,mBAAmB,IAAI;EACxB,CAAC;CAEF,MAAM,kBAAkB,IAAI,YACxB;EACE,mBAAmB,IAAI,aAAa;EACpC,IAAI,IAAI,eAAe;EACvB,MAAM;EACN,UAAU;EACX,GACD,EAAE;CAEN,MAAM,YAAY,aAAa,KAAK,IAAI,SAAS;AAEjD,KAAI,IAAI,SACN,QAAO;AAGT,QACE,oBAAC,gBAAD;EAAgB,GAAI,IAAI;EAAa,cAAc,IAAI;YACrD,oBAAC,YAAD;GACE,SAAS,IAAI;GACb,GAAI,IAAI;GACR,YAAY,IAAI,iBAAiB,cAAc;GAC/C,UAAU,IAAI,iBAAiB,YAAY;GAC3C,aAAa,IAAI;GACjB,cACE,OAAO,IAAI,iBAAiB,iBAAiB,WACzC,IAAI,gBAAgB,eACpB,IAAI,iBAAiB;cAGzB,qBACA,oBAAC,WAAD;IAAW,QAAQ,IAAI,aAAa,IAAI;IAAQ,UAAU;cACxD,qBAAC,KAAD;KACE,GAAI;KACJ,GAAI;KACK;KACT,kBAAkB,oBACV;AACJ,UAAI,WAAW;AACf,UAAI,aAAa;QAEnB;MACE,QAAQ,IAAI;MACZ,WAAW;MACX,WAAW;MACZ,CACF;KACD,iBAAe,IAAI;KACnB,cAAY,IAAI,qBAAqB,WAAW,KAAA;KAChD,GAAI,IAAI,UAAU,YAAY;MAC5B;MACA;MACA;MACA;MACA,OAAO;OACL;QACE,GAAG;QACH,QAAQ,IAAI;QACZ,KAAK,IAAI,KAAK;QACd,MAAM,IAAI,KAAK;QACf,OAAO,IAAI,UAAU,WAAW,KAAA,IAAY,IAAI,IAAI,MAAM;QAC1D,GAAI,IAAI,kBAAkB,EAAE,SAAS,QAAQ,GAAG;QACjD;OACD,IAAI,eAAe;OACnB,QAAQ;OACR;OACD;MACF,CAAC;eAnCJ,CAqCG,UAED,oBAAC,eAAD;MACE,KAAK,IAAI;MACT,QAAQ,IAAI;MACZ,QAAQ,IAAI;MACZ,SAAS,IAAI;MACb,UAAU,IAAI;MACd,WAAW,IAAI;MACf,aAAa,IAAI;MACjB,aAAa,IAAI;MACjB,eAAe,IAAI;MACnB,GAAI,IAAI,UAAU,SAAS;OACzB;OACA;OACA;OACD,CAAC;MACF,CAAA,CACE;;IACI,CAAA;GAEH,CAAA;EACE,CAAA;EAEnB;AAEF,gBAAgB,UAAUA;AAC1B,gBAAgB,cAAc"}