@lobehub/ui/es/base-ui/FloatingPanel/FloatingPanel.mjs.map

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

{"version":3,"file":"FloatingPanel.mjs","names":[],"sources":["../../../src/base-ui/FloatingPanel/FloatingPanel.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { X } from 'lucide-react';\nimport type { MotionProps } from 'motion/react';\nimport type { CSSProperties, PointerEvent as ReactPointerEvent } from 'react';\nimport { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';\n\nimport type { ModalRootProps } from '../Modal';\nimport {\n  ModalBackdrop,\n  ModalClose,\n  ModalContent,\n  ModalFooter,\n  ModalHeader,\n  ModalPopup,\n  ModalPortal,\n  ModalRoot,\n  ModalTitle,\n} from '../Modal';\nimport { styles } from './style';\nimport type {\n  FloatingPanelOffset,\n  FloatingPanelPlacement,\n  FloatingPanelProps,\n  FloatingPanelResizeHandle,\n  FloatingPanelSize,\n} from './type';\n\nconst DEFAULT_MIN_HEIGHT = 180;\nconst DEFAULT_MIN_WIDTH = 320;\n\ninterface InternalFloatingPanelSize extends FloatingPanelSize {\n  sourceHeight?: number | string;\n  sourceWidth?: number | string;\n}\n\nconst defaultMotionProps: MotionProps = {\n  animate: { opacity: 1, scale: 1, x: 0, y: 0 },\n  exit: {\n    opacity: 0,\n    scale: 0.98,\n    transition: { duration: 0.14, ease: [0.4, 0, 1, 1] },\n    y: 12,\n  },\n  initial: { opacity: 0, scale: 0.98, y: 12 },\n  transition: { duration: 0.2, ease: [0.32, 0.72, 0, 1] },\n};\n\nconst topMotionProps: MotionProps = {\n  animate: { opacity: 1, scale: 1, x: 0, y: 0 },\n  exit: {\n    opacity: 0,\n    scale: 0.98,\n    transition: { duration: 0.14, ease: [0.4, 0, 1, 1] },\n    y: -12,\n  },\n  initial: { opacity: 0, scale: 0.98, y: -12 },\n  transition: { duration: 0.2, ease: [0.32, 0.72, 0, 1] },\n};\n\nconst resolveOffset = (offset: FloatingPanelOffset) => {\n  if (typeof offset === 'object') {\n    return {\n      x: offset.x ?? 8,\n      y: offset.y ?? 8,\n    };\n  }\n\n  return { x: offset, y: offset };\n};\n\nconst getPlacementStyle = (\n  placement: FloatingPanelPlacement,\n  offset: FloatingPanelOffset,\n): CSSProperties => {\n  const { x, y } = resolveOffset(offset);\n  const isTop = placement.startsWith('top');\n  const isLeft = placement.endsWith('Left');\n\n  return {\n    alignItems: isTop ? 'flex-start' : 'flex-end',\n    justifyContent: isLeft ? 'flex-start' : 'flex-end',\n    paddingBlockEnd: isTop ? undefined : y,\n    paddingBlockStart: isTop ? y : undefined,\n    paddingInlineEnd: isLeft ? undefined : x,\n    paddingInlineStart: isLeft ? x : undefined,\n  };\n};\n\nconst clamp = (value: number, min: number, max: number) => Math.min(Math.max(value, min), max);\n\nconst getViewportMaxSize = () => ({\n  height: Math.max(DEFAULT_MIN_HEIGHT, window.innerHeight - 16),\n  width: Math.max(DEFAULT_MIN_WIDTH, window.innerWidth - 16),\n});\n\nconst getResizeHandles = (placement: FloatingPanelPlacement): FloatingPanelResizeHandle[] => {\n  switch (placement) {\n    case 'bottomLeft': {\n      return ['top', 'right', 'topRight'];\n    }\n    case 'topLeft': {\n      return ['bottom', 'right', 'bottomRight'];\n    }\n    case 'topRight': {\n      return ['bottom', 'left', 'bottomLeft'];\n    }\n    default: {\n      return ['top', 'left', 'topLeft'];\n    }\n  }\n};\n\nconst getResizeHandleClassName = (s: typeof styles, handle: FloatingPanelResizeHandle) => {\n  const handleClassMap: Record<FloatingPanelResizeHandle, string> = {\n    bottom: s.resizeHandleBottom,\n    bottomLeft: s.resizeHandleBottomLeft,\n    bottomRight: s.resizeHandleBottomRight,\n    left: s.resizeHandleLeft,\n    right: s.resizeHandleRight,\n    top: s.resizeHandleTop,\n    topLeft: s.resizeHandleTopLeft,\n    topRight: s.resizeHandleTopRight,\n  };\n\n  return handleClassMap[handle];\n};\n\nconst resolveResizeSize = ({\n  handle,\n  maxHeight,\n  maxWidth,\n  minHeight,\n  minWidth,\n  startHeight,\n  startWidth,\n  startX,\n  startY,\n  x,\n  y,\n}: {\n  handle: FloatingPanelResizeHandle;\n  maxHeight: number;\n  maxWidth: number;\n  minHeight: number;\n  minWidth: number;\n  startHeight: number;\n  startWidth: number;\n  startX: number;\n  startY: number;\n  x: number;\n  y: number;\n}): FloatingPanelSize => {\n  const deltaX = x - startX;\n  const deltaY = y - startY;\n  const growsLeft = handle.includes('Left') || handle === 'left';\n  const growsRight = handle.includes('Right') || handle === 'right';\n  const growsTop = handle.includes('top') || handle === 'top';\n  const growsBottom = handle.includes('bottom') || handle === 'bottom';\n\n  const nextWidth = growsLeft ? startWidth - deltaX : growsRight ? startWidth + deltaX : startWidth;\n  const nextHeight = growsTop\n    ? startHeight - deltaY\n    : growsBottom\n      ? startHeight + deltaY\n      : startHeight;\n\n  return {\n    height: clamp(nextHeight, minHeight, maxHeight),\n    width: clamp(nextWidth, minWidth, maxWidth),\n  };\n};\n\nconst FloatingPanel = memo<FloatingPanelProps>(\n  ({\n    afterClose,\n    ariaLabel,\n    children,\n    className,\n    classNames,\n    closable = true,\n    closeIcon,\n    closeLabel = 'Close',\n    defaultOpen,\n    actions,\n    footer,\n    getContainer,\n    height,\n    keyboard = true,\n    mask = false,\n    maskClosable = true,\n    maxHeight,\n    maxWidth,\n    minHeight = DEFAULT_MIN_HEIGHT,\n    minWidth = DEFAULT_MIN_WIDTH,\n    modal = false,\n    motionProps,\n    offset = 8,\n    onClose,\n    onOpenChange,\n    onResize,\n    onResizeEnd,\n    open,\n    placement = 'bottomRight',\n    resizable = true,\n    styles: semanticStyles,\n    title,\n    width = 640,\n    zIndex,\n  }) => {\n    const s = styles;\n    const isTop = placement.startsWith('top');\n    const container = getContainer === false ? undefined : getContainer;\n    const [resizeSize, setResizeSize] = useState<InternalFloatingPanelSize>();\n    const latestResizeSizeRef = useRef<FloatingPanelSize | undefined>(undefined);\n    const resizeCleanupRef = useRef<(() => void) | undefined>(undefined);\n    const activeResizeSize =\n      resizeSize?.sourceWidth === width && resizeSize.sourceHeight === height\n        ? resizeSize\n        : undefined;\n\n    useEffect(\n      () => () => {\n        resizeCleanupRef.current?.();\n      },\n      [],\n    );\n\n    const popupStyle = useMemo(\n      () => ({\n        ...getPlacementStyle(placement, offset),\n        ...semanticStyles?.wrapper,\n      }),\n      [offset, placement, semanticStyles?.wrapper],\n    );\n\n    const handleOpenChange = useCallback<NonNullable<ModalRootProps['onOpenChange']>>(\n      (nextOpen, eventDetails) => {\n        if (!nextOpen) {\n          if (keyboard === false && eventDetails.reason === 'escape-key') return;\n          if (maskClosable === false && eventDetails.reason === 'outside-press') return;\n          onClose?.();\n        }\n\n        onOpenChange?.(nextOpen, eventDetails);\n      },\n      [keyboard, maskClosable, onClose, onOpenChange],\n    );\n\n    const showHeader = title !== undefined || actions !== undefined || closable;\n    const resolvedMotionProps = motionProps ?? (isTop ? topMotionProps : defaultMotionProps);\n    const resizeHandles = useMemo(() => getResizeHandles(placement), [placement]);\n\n    const handleResizeStart = useCallback(\n      (handle: FloatingPanelResizeHandle) => (event: ReactPointerEvent<HTMLDivElement>) => {\n        event.preventDefault();\n        event.stopPropagation();\n\n        const panel = event.currentTarget.parentElement;\n        if (!panel) return;\n\n        const rect = panel.getBoundingClientRect();\n        const viewportMaxSize = getViewportMaxSize();\n        const resolvedMaxWidth = Math.max(minWidth, maxWidth ?? viewportMaxSize.width);\n        const resolvedMaxHeight = Math.max(minHeight, maxHeight ?? viewportMaxSize.height);\n        const startX = event.clientX;\n        const startY = event.clientY;\n\n        const handleResizeMove = (moveEvent: PointerEvent) => {\n          const nextSize = resolveResizeSize({\n            handle,\n            maxHeight: resolvedMaxHeight,\n            maxWidth: resolvedMaxWidth,\n            minHeight,\n            minWidth,\n            startHeight: rect.height,\n            startWidth: rect.width,\n            startX,\n            startY,\n            x: moveEvent.clientX,\n            y: moveEvent.clientY,\n          });\n\n          const nextState = { ...nextSize, sourceHeight: height, sourceWidth: width };\n          latestResizeSizeRef.current = nextSize;\n          setResizeSize(nextState);\n          onResize?.(nextSize);\n        };\n\n        const handleResizeEnd = () => {\n          resizeCleanupRef.current?.();\n          resizeCleanupRef.current = undefined;\n\n          if (latestResizeSizeRef.current) onResizeEnd?.(latestResizeSizeRef.current);\n        };\n\n        resizeCleanupRef.current?.();\n        window.addEventListener('pointermove', handleResizeMove);\n        window.addEventListener('pointerup', handleResizeEnd);\n        resizeCleanupRef.current = () => {\n          window.removeEventListener('pointermove', handleResizeMove);\n          window.removeEventListener('pointerup', handleResizeEnd);\n        };\n      },\n      [height, maxHeight, maxWidth, minHeight, minWidth, onResize, onResizeEnd, width],\n    );\n\n    return (\n      <ModalRoot\n        defaultOpen={defaultOpen}\n        modal={modal}\n        open={open}\n        zIndex={zIndex}\n        onExitComplete={afterClose}\n        onOpenChange={handleOpenChange}\n      >\n        <ModalPortal container={container}>\n          {mask && (\n            <ModalBackdrop className={classNames?.backdrop} style={semanticStyles?.backdrop} />\n          )}\n          <ModalPopup\n            aria-label={ariaLabel}\n            className={cx(s.wrapper, classNames?.wrapper)}\n            motionProps={resolvedMotionProps}\n            panelClassName={cx(s.panel, isTop && s.panelTop, className, classNames?.panel)}\n            popupStyle={popupStyle}\n            width={activeResizeSize?.width ?? width}\n            style={{\n              height: activeResizeSize?.height ?? height,\n              minHeight,\n              minWidth,\n              width: activeResizeSize?.width,\n              ...semanticStyles?.panel,\n            }}\n          >\n            {resizable &&\n              resizeHandles.map((handle) => (\n                <div\n                  aria-hidden\n                  data-floating-panel-resize-handle={handle}\n                  key={handle}\n                  style={semanticStyles?.resizeHandle}\n                  className={cx(\n                    s.resizeHandle,\n                    getResizeHandleClassName(s, handle),\n                    classNames?.resizeHandle,\n                  )}\n                  onPointerDown={handleResizeStart(handle)}\n                />\n              ))}\n            {showHeader && (\n              <ModalHeader\n                className={cx(s.header, classNames?.header)}\n                style={semanticStyles?.header}\n              >\n                {title !== undefined ? (\n                  <ModalTitle\n                    className={cx(s.title, classNames?.title)}\n                    style={semanticStyles?.title}\n                  >\n                    {title}\n                  </ModalTitle>\n                ) : (\n                  <span />\n                )}\n                <div className={s.headerActions}>\n                  {actions && (\n                    <div\n                      className={cx(s.actions, classNames?.actions)}\n                      style={semanticStyles?.actions}\n                    >\n                      {actions}\n                    </div>\n                  )}\n                  {closable && (\n                    <ModalClose\n                      aria-label={closeLabel}\n                      className={cx(s.close, classNames?.close)}\n                      style={semanticStyles?.close}\n                    >\n                      {closeIcon ?? <X size={16} />}\n                    </ModalClose>\n                  )}\n                </div>\n              </ModalHeader>\n            )}\n            <ModalContent className={cx(s.body, classNames?.body)} style={semanticStyles?.body}>\n              {children}\n            </ModalContent>\n            {footer && (\n              <ModalFooter\n                className={cx(s.footer, classNames?.footer)}\n                style={semanticStyles?.footer}\n              >\n                {footer}\n              </ModalFooter>\n            )}\n          </ModalPopup>\n        </ModalPortal>\n      </ModalRoot>\n    );\n  },\n);\n\nFloatingPanel.displayName = 'FloatingPanel';\n\nexport { FloatingPanel };\n"],"mappings":"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"}