{"version":3,"file":"Popover.cjs","sources":["../../../src/components/Popover/Popover.tsx"],"sourcesContent":["import { useCallback, useRef, useState } from 'react';\nimport { useClickOutside, useId } from '@raikou/hooks';\nimport {\n  createVarsResolver,\n  ExtendComponent,\n  Factory,\n  getDefaultZIndex,\n  getRadius,\n  getShadow,\n  RaikouRadius,\n  RaikouShadow,\n  StylesApiProps,\n  useDirection,\n  useProps,\n  useResolvedStylesApi,\n  useStyles,\n} from '../../core';\nimport {\n  ArrowPosition,\n  FloatingAxesOffsets,\n  FloatingPosition,\n  FloatingStrategy,\n  getFloatingPosition,\n} from '../Floating';\nimport { PortalProps } from '../Portal';\nimport { TransitionOverride } from '../Transition';\nimport { PopoverContextProvider } from './Popover.context';\nimport { PopoverMiddlewares, PopoverWidth } from './Popover.types';\nimport { PopoverDropdown } from './PopoverDropdown/PopoverDropdown';\nimport { PopoverTarget } from './PopoverTarget/PopoverTarget';\nimport { usePopover } from './use-popover';\nimport { PopoverArrowStyle, PopoverDropdownStyle } from './Popover.css';\n\nexport type PopoverStylesNames = 'dropdown' | 'arrow';\nexport type PopoverCssVariables = {\n  dropdown: '--popover-radius' | '--popover-shadow';\n};\n\nexport interface __PopoverProps {\n  /** Dropdown position relative to the target element, `'bottom'` by default */\n  position?: FloatingPosition;\n\n  /** Offset of the dropdown element, `8` by default */\n  offset?: number | FloatingAxesOffsets;\n\n  /** Called when dropdown position changes */\n  onPositionChange?: (position: FloatingPosition) => void;\n\n  /** `useEffect` dependencies to force update dropdown position, `[]` by default */\n  positionDependencies?: any[];\n\n  /** Called when dropdown closes */\n  onClose?: () => void;\n\n  /** Called when dropdown opens */\n  onOpen?: () => void;\n\n  /** If set dropdown will not be unmounted from the DOM when it is hidden, `display: none` styles will be added instead */\n  keepMounted?: boolean;\n\n  /** Props passed down to the `Transition` component that used to animate dropdown presence, use to configure duration and animation type, `{ duration: 150, transition: 'fade' }` by default */\n  transitionProps?: TransitionOverride;\n\n  /** Called when exit transition ends */\n  onExitTransitionEnd?: () => void;\n\n  /** Called when enter transition ends */\n  onEnterTransitionEnd?: () => void;\n\n  /** Dropdown width, or `'target'` to make dropdown width the same as target element, `'max-content'` by default */\n  width?: PopoverWidth;\n\n  /** Floating ui middlewares to configure position handling, `{ flip: true, shift: true, inline: false }` by default */\n  middlewares?: PopoverMiddlewares;\n\n  /** Determines whether component should have an arrow, `false` by default */\n  withArrow?: boolean;\n\n  /** Arrow size in px, `7` by default */\n  arrowSize?: number;\n\n  /** Arrow offset in px, `5` by default */\n  arrowOffset?: number;\n\n  /** Arrow `border-radius` in px, `0` by default */\n  arrowRadius?: number;\n\n  /** Arrow position */\n  arrowPosition?: ArrowPosition;\n\n  /** Determines whether dropdown should be rendered within the `Portal`, `true` by default */\n  withinPortal?: boolean;\n\n  /** Props to pass down to the `Portal` when `withinPortal` is true */\n  portalProps?: Omit<PortalProps, 'children'>;\n\n  /** Dropdown `z-index`, `300` by default */\n  zIndex?: string | number;\n\n  /** Key of `theme.radius` or any valid CSS value to set border-radius, `theme.defaultRadius` by default */\n  radius?: RaikouRadius;\n\n  /** Key of `theme.shadows` or any other valid CSS `box-shadow` value */\n  shadow?: RaikouShadow;\n\n  /** If set, popover dropdown will not be rendered */\n  disabled?: boolean;\n\n  /** Determines whether focus should be automatically returned to control when dropdown closes, `false` by default */\n  returnFocus?: boolean;\n\n  /** Changes floating ui [position strategy](https://floating-ui.com/docs/usefloating#strategy), `'absolute'` by default */\n  floatingStrategy?: FloatingStrategy;\n}\n\nexport interface PopoverProps extends __PopoverProps, StylesApiProps<PopoverFactory> {\n  __staticSelector?: string;\n\n  /** `Popover.Target` and `Popover.Dropdown` components */\n  children?: React.ReactNode;\n\n  /** Initial opened state for uncontrolled component */\n  defaultOpened?: boolean;\n\n  /** Controlled dropdown opened state */\n  opened?: boolean;\n\n  /** Called with current state when dropdown opens or closes */\n  onChange?: (opened: boolean) => void;\n\n  /** Determines whether dropdown should be closed on outside clicks, `true` by default */\n  closeOnClickOutside?: boolean;\n\n  /** Events that trigger outside clicks */\n  clickOutsideEvents?: string[];\n\n  /** Determines whether focus should be trapped within dropdown, `false` by default */\n  trapFocus?: boolean;\n\n  /** Determines whether dropdown should be closed when `Escape` key is pressed, `true` by default */\n  closeOnEscape?: boolean;\n\n  /** Id base to create accessibility connections */\n  id?: string;\n\n  /** Determines whether dropdown and target elements should have accessible roles, `true` by default */\n  withRoles?: boolean;\n}\n\nexport type PopoverFactory = Factory<{\n  props: PopoverProps;\n  stylesNames: PopoverStylesNames;\n  vars: PopoverCssVariables;\n}>;\n\nconst defaultProps: Partial<PopoverProps> = {\n  position: 'bottom',\n  offset: 8,\n  positionDependencies: [],\n  transitionProps: { transition: 'fade', duration: 150 },\n  middlewares: { flip: true, shift: true, inline: false },\n  arrowSize: 7,\n  arrowOffset: 5,\n  arrowRadius: 0,\n  arrowPosition: 'side',\n  closeOnClickOutside: true,\n  withinPortal: true,\n  closeOnEscape: true,\n  trapFocus: false,\n  withRoles: true,\n  returnFocus: false,\n  clickOutsideEvents: ['mousedown', 'touchstart'],\n  zIndex: getDefaultZIndex('popover'),\n  __staticSelector: 'Popover',\n  width: 'max-content',\n};\n\nconst varsResolver = createVarsResolver<PopoverFactory>((_, { radius, shadow }) => ({\n  dropdown: {\n    '--popover-radius': radius === undefined ? undefined : getRadius(radius),\n    '--popover-shadow': getShadow(shadow),\n  },\n}));\n\nexport function Popover(_props: PopoverProps) {\n  const props = useProps('Popover', defaultProps, _props);\n  const {\n    children,\n    position,\n    offset,\n    onPositionChange,\n    positionDependencies,\n    opened,\n    transitionProps,\n    onExitTransitionEnd,\n    onEnterTransitionEnd,\n    width,\n    middlewares,\n    withArrow,\n    arrowSize,\n    arrowOffset,\n    arrowRadius,\n    arrowPosition,\n    unstyled,\n    classNames,\n    styles,\n    closeOnClickOutside,\n    withinPortal,\n    portalProps,\n    closeOnEscape,\n    clickOutsideEvents,\n    trapFocus,\n    onClose,\n    onOpen,\n    onChange,\n    zIndex,\n    radius,\n    shadow,\n    id,\n    defaultOpened,\n    __staticSelector,\n    withRoles,\n    disabled,\n    returnFocus,\n    variant,\n    keepMounted,\n    vars,\n    floatingStrategy,\n    ...others\n  } = props;\n\n  const getStyles = useStyles<PopoverFactory>({\n    name: __staticSelector!,\n    props,\n    classes: {\n      dropdown: PopoverDropdownStyle,\n      arrow: PopoverArrowStyle,\n    },\n    classNames,\n    styles,\n    unstyled,\n    rootSelector: 'dropdown',\n    vars,\n    varsResolver,\n  });\n\n  const { resolvedStyles } = useResolvedStylesApi<PopoverFactory>({ classNames, styles, props });\n\n  const arrowRef = useRef<HTMLDivElement | null>(null);\n  const [targetNode, setTargetNode] = useState<HTMLElement | null>(null);\n  const [dropdownNode, setDropdownNode] = useState<HTMLElement | null>(null);\n  const { dir } = useDirection();\n\n  const uid = useId(id);\n  const popover = usePopover({\n    middlewares,\n    width,\n    position: getFloatingPosition(dir, position!),\n    offset: typeof offset === 'number' ? offset + (withArrow ? arrowSize! / 2 : 0) : offset!,\n    arrowRef,\n    arrowOffset: arrowOffset!,\n    onPositionChange,\n    positionDependencies,\n    opened,\n    defaultOpened,\n    onChange,\n    onOpen,\n    onClose,\n    strategy: floatingStrategy,\n  });\n\n  useClickOutside(() => closeOnClickOutside && popover.onClose(), clickOutsideEvents, [\n    targetNode,\n    dropdownNode,\n  ]);\n\n  const reference = useCallback(\n    (node: HTMLElement) => {\n      setTargetNode(node);\n      popover.floating.refs.setReference(node);\n    },\n    [popover.floating.refs.setReference]\n  );\n\n  const floating = useCallback(\n    (node: HTMLElement) => {\n      setDropdownNode(node);\n      popover.floating.refs.setFloating(node);\n    },\n    [popover.floating.refs.setFloating]\n  );\n\n  const onExited = useCallback(() => {\n    transitionProps?.onExited?.();\n    onExitTransitionEnd?.();\n  }, [transitionProps?.onExited, onExitTransitionEnd]);\n\n  const onEntered = useCallback(() => {\n    transitionProps?.onEntered?.();\n    onEnterTransitionEnd?.();\n  }, [transitionProps?.onEntered, onEnterTransitionEnd]);\n\n  return (\n    <PopoverContextProvider\n      value={{\n        returnFocus,\n        disabled,\n        controlled: popover.controlled,\n        reference,\n        floating,\n        x: popover.floating.x!,\n        y: popover.floating.y!,\n        arrowX: popover.floating?.middlewareData?.arrow?.x,\n        arrowY: popover.floating?.middlewareData?.arrow?.y,\n        opened: popover.opened,\n        arrowRef,\n        transitionProps: { ...transitionProps, onExited, onEntered },\n        width,\n        withArrow,\n        arrowSize: arrowSize!,\n        arrowOffset: arrowOffset!,\n        arrowRadius: arrowRadius!,\n        arrowPosition: arrowPosition!,\n        placement: popover.floating.placement,\n        trapFocus,\n        withinPortal,\n        portalProps,\n        zIndex,\n        radius,\n        shadow,\n        closeOnEscape,\n        onClose: popover.onClose,\n        onToggle: popover.onToggle,\n        getTargetId: () => `${uid}-target`,\n        getDropdownId: () => `${uid}-dropdown`,\n        withRoles,\n        targetProps: others,\n        __staticSelector: __staticSelector!,\n        classNames,\n        styles,\n        unstyled,\n        variant,\n        keepMounted,\n        getStyles,\n        resolvedStyles,\n        floatingStrategy,\n      }}\n    >\n      {children}\n    </PopoverContextProvider>\n  );\n}\n\nPopover.Target = PopoverTarget;\nPopover.Dropdown = PopoverDropdown;\nPopover.displayName = '@raikou/core/Popover';\nPopover.extend = (input: ExtendComponent<PopoverFactory>) => input;\n"],"names":["getDefaultZIndex","createVarsResolver","getRadius","getShadow","useProps","useStyles","PopoverDropdownStyle","PopoverArrowStyle","useResolvedStylesApi","useRef","useState","useDirection","useId","usePopover","getFloatingPosition","useClickOutside","useCallback","jsx","PopoverContextProvider","PopoverTarget","PopoverDropdown"],"mappings":"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"}