@lobehub/ui/es/Popover/PopoverStandalone.mjs.map

Lobe UI is an open-source UI component library for building AIGC web apps

{"version":3,"file":"PopoverStandalone.mjs","names":["BasePopover"],"sources":["../../src/Popover/PopoverStandalone.tsx"],"sourcesContent":["'use client';\n\nimport { Popover as BasePopover } from '@base-ui/react/popover';\nimport { memo, useCallback, useMemo, useState } from 'react';\n\nimport { useIsClient } from '@/hooks/useIsClient';\nimport { useNativeButton } from '@/hooks/useNativeButton';\nimport { parseTrigger } from '@/utils/parseTrigger';\nimport { type Side, placementMap } from '@/utils/placement';\n\nimport { PopoverArrowIcon } from './ArrowIcon';\nimport { usePopoverPortalContainer } from './PopoverPortal';\nimport {\n  PopoverArrow,\n  PopoverPopup,\n  PopoverPortal,\n  PopoverPositioner,\n  PopoverRoot,\n  PopoverTriggerElement,\n  PopoverViewport,\n} from './atoms';\nimport { PopoverProvider } from './context';\nimport type { PopoverProps } from './type';\n\n/**\n * Popover component - displays floating content relative to a trigger element\n * Compatible with Ant Design Popover API\n */\nexport const PopoverStandalone = memo<PopoverProps>(\n  ({\n    children,\n    content,\n    arrow: originArrow = false,\n    inset = false,\n    trigger = 'hover',\n    placement = 'top',\n    styles: styleProps,\n    classNames,\n    className,\n    open,\n    onOpenChange,\n    defaultOpen = false,\n    mouseEnterDelay = 0.1,\n    mouseLeaveDelay = 0.1,\n    openDelay,\n    closeDelay,\n    getPopupContainer,\n    disabled = false,\n    zIndex,\n    nativeButton,\n    ref: refProp,\n    positionerProps,\n    triggerProps,\n    popupProps,\n    backdropProps,\n    portalProps,\n  }) => {\n    const arrow = inset ? false : originArrow;\n    const isClient = useIsClient();\n    const popoverHandle = useMemo(() => BasePopover.createHandle(), []);\n    const [uncontrolledOpen, setUncontrolledOpen] = useState(Boolean(defaultOpen));\n    const close = useCallback(() => {\n      popoverHandle.close();\n    }, [popoverHandle]);\n    const contextValue = useMemo(() => ({ close }), [close]);\n\n    const mergedOpen = open ?? uncontrolledOpen;\n    const resolvedOpen = disabled ? false : mergedOpen;\n\n    const handleOpenChange = useCallback(\n      (nextOpen: boolean) => {\n        // Don't open if disabled\n        if (disabled && nextOpen) return;\n\n        onOpenChange?.(nextOpen);\n        if (open === undefined) {\n          setUncontrolledOpen(nextOpen);\n        }\n      },\n      [onOpenChange, open, disabled],\n    );\n\n    // Parse trigger mode\n    const { openOnHover } = useMemo(() => parseTrigger(trigger), [trigger]);\n\n    // Calculate delays (milliseconds take precedence over seconds)\n    const resolvedOpenDelay = openDelay ?? mouseEnterDelay * 1000;\n    const resolvedCloseDelay = closeDelay ?? mouseLeaveDelay * 1000;\n\n    // Get placement configuration\n    const placementConfig = placementMap[placement] ?? placementMap.top;\n    const baseSideOffset = arrow ? 10 : 6;\n    const resolvedSideOffset = useMemo(() => {\n      if (!inset) return baseSideOffset;\n      return ({\n        side,\n        positioner,\n      }: {\n        positioner: { height: number; width: number };\n        side: Side;\n      }) => {\n        if (\n          side === 'left' ||\n          side === 'right' ||\n          side === 'inline-start' ||\n          side === 'inline-end'\n        ) {\n          return -positioner.width;\n        }\n        return -positioner.height;\n      };\n    }, [baseSideOffset, inset]);\n\n    // Determine portal container\n    const portalContainer = usePopoverPortalContainer();\n\n    const { resolvedNativeButton } = useNativeButton({\n      children,\n      nativeButton,\n    });\n\n    const resolvedClassNames = useMemo(\n      () => ({\n        arrow: classNames?.arrow,\n        popup: className,\n        positioner: classNames?.root,\n        trigger: classNames?.trigger,\n        viewport: classNames?.content,\n      }),\n      [className, classNames?.arrow, classNames?.content, classNames?.root, classNames?.trigger],\n    );\n\n    // Render trigger element\n    const triggerElement = useMemo(() => {\n      const baseTriggerProps = {\n        closeDelay: resolvedCloseDelay,\n        delay: resolvedOpenDelay,\n        disabled,\n        openOnHover: openOnHover && !disabled,\n        ...triggerProps,\n      };\n\n      return (\n        <PopoverTriggerElement\n          handle={popoverHandle}\n          {...baseTriggerProps}\n          className={resolvedClassNames.trigger}\n          nativeButton={resolvedNativeButton}\n          ref={refProp as any}\n        >\n          {children}\n        </PopoverTriggerElement>\n      );\n    }, [\n      children,\n      disabled,\n      openOnHover,\n      popoverHandle,\n      refProp,\n      resolvedClassNames.trigger,\n      resolvedNativeButton,\n      resolvedOpenDelay,\n      resolvedCloseDelay,\n      triggerProps,\n    ]);\n\n    // Custom container from getPopupContainer\n    const customContainer = useMemo(() => {\n      if (!getPopupContainer || !isClient) return undefined;\n      // We need a reference element, but we don't have it until render\n      // This will be handled by the portal container logic\n      return undefined;\n    }, [getPopupContainer, isClient]);\n\n    const resolvedStyles = useMemo(\n      () => ({\n        arrow: styleProps?.arrow,\n        positioner: {\n          ...styleProps?.root,\n          zIndex: zIndex ?? 1100,\n        },\n        viewport: styleProps?.content,\n      }),\n      [styleProps?.arrow, styleProps?.content, styleProps?.root, zIndex],\n    );\n\n    const popup = useMemo(\n      () => (\n        <PopoverPositioner\n          align={placementConfig.align}\n          className={resolvedClassNames.positioner}\n          hoverTrigger={openOnHover}\n          placement={placement}\n          side={placementConfig.side}\n          sideOffset={resolvedSideOffset as any}\n          style={resolvedStyles.positioner}\n          {...positionerProps}\n        >\n          <PopoverPopup className={resolvedClassNames.popup} {...popupProps}>\n            {arrow && (\n              <PopoverArrow className={resolvedClassNames.arrow} style={resolvedStyles.arrow}>\n                {PopoverArrowIcon}\n              </PopoverArrow>\n            )}\n            <PopoverViewport\n              className={resolvedClassNames.viewport}\n              style={resolvedStyles.viewport}\n            >\n              <PopoverProvider value={contextValue}>{content}</PopoverProvider>\n            </PopoverViewport>\n          </PopoverPopup>\n        </PopoverPositioner>\n      ),\n      [\n        arrow,\n        content,\n        contextValue,\n        openOnHover,\n        placement,\n        placementConfig.align,\n        placementConfig.side,\n        popupProps,\n        positionerProps,\n        resolvedClassNames,\n        resolvedSideOffset,\n        resolvedStyles,\n      ],\n    );\n\n    // Don't render popup if no content\n    if (!content) {\n      return children;\n    }\n\n    const resolvedPortalContainer = customContainer ?? portalContainer;\n\n    return (\n      <PopoverRoot\n        defaultOpen={defaultOpen}\n        handle={popoverHandle}\n        onOpenChange={handleOpenChange}\n        open={resolvedOpen}\n      >\n        {triggerElement}\n        {backdropProps && <BasePopover.Backdrop {...backdropProps} />}\n        {resolvedPortalContainer ? (\n          <PopoverPortal container={resolvedPortalContainer} {...portalProps}>\n            {popup}\n          </PopoverPortal>\n        ) : null}\n      </PopoverRoot>\n    );\n  },\n);\n\nPopoverStandalone.displayName = 'PopoverStandalone';\n"],"mappings":"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"}