@lobehub/ui
Version:
Lobe UI is an open-source UI component library for building AIGC web apps
1 lines • 4.82 kB
Source Map (JSON)
{"version":3,"file":"ContextMenuHost.mjs","names":[],"sources":["../../../src/base-ui/ContextMenu/ContextMenuHost.tsx"],"sourcesContent":["'use client';\n\nimport { ContextMenu } from '@base-ui/react/context-menu';\nimport { cx } from 'antd-style';\nimport { memo, useEffect, useMemo, useSyncExternalStore } from 'react';\n\nimport { useIsClient } from '@/hooks/useIsClient';\nimport { useAppElement } from '@/ThemeProvider';\nimport { registerDevSingleton } from '@/utils/devSingleton';\nimport { preventDefaultAndStopPropagation } from '@/utils/dom';\n\nimport { useLayerZIndex } from '../zIndex';\nimport { renderContextMenuItems } from './renderItems';\nimport {\n closeContextMenu,\n getServerSnapshot,\n getSnapshot,\n setContextMenuState,\n subscribe,\n updateLastPointer,\n} from './store';\nimport { styles } from './style';\n\nconst noAnimationStyles = { '--lobe-dropdown-animation-duration': '0ms' } as React.CSSProperties;\n\nexport const ContextMenuHost = memo(() => {\n const isClient = useIsClient();\n const appElement = useAppElement();\n const state = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);\n\n useEffect(() => {\n const DEV = process.env.NODE_ENV === 'development';\n if (!isClient || !DEV) return;\n return registerDevSingleton('ContextMenuHost', document.body);\n }, [isClient]);\n\n useEffect(() => {\n const handler = (event: MouseEvent | PointerEvent) => updateLastPointer(event);\n window.addEventListener('pointerdown', handler, true);\n window.addEventListener('contextmenu', handler, true);\n return () => {\n window.removeEventListener('pointerdown', handler, true);\n window.removeEventListener('contextmenu', handler, true);\n };\n }, []);\n\n const menuItems = useMemo(\n () =>\n renderContextMenuItems(state.items, [], {\n iconAlign: state.iconAlign,\n iconSpaceMode: state.iconSpaceMode,\n }),\n [state.items, state.iconAlign, state.iconSpaceMode],\n );\n const { zIndex, ref: zRef } = useLayerZIndex<HTMLDivElement>('floating');\n const hasSlots = state.header != null || state.footer != null;\n if (!isClient) return null;\n if (!state.open && state.items.length === 0) return null;\n\n return (\n <ContextMenu.Root\n open={state.open}\n onOpenChange={(open) => {\n if (open) {\n setContextMenuState({ open });\n return;\n }\n closeContextMenu();\n }}\n >\n <ContextMenu.Portal container={appElement}>\n <ContextMenu.Positioner\n anchor={state.anchor ?? undefined}\n className={styles.positioner}\n ref={zRef as any}\n sideOffset={6}\n style={{ ...noAnimationStyles, zIndex }}\n >\n <ContextMenu.Popup\n className={cx(styles.popup, hasSlots && styles.popupWithSlots)}\n onContextMenu={preventDefaultAndStopPropagation}\n >\n {state.header == null ? null : <div className={styles.header}>{state.header}</div>}\n {hasSlots ? <div className={styles.slotViewport}>{menuItems}</div> : menuItems}\n {state.footer == null ? null : <div className={styles.footer}>{state.footer}</div>}\n </ContextMenu.Popup>\n </ContextMenu.Positioner>\n </ContextMenu.Portal>\n </ContextMenu.Root>\n );\n});\n\nContextMenuHost.displayName = 'ContextMenuHost';\n"],"mappings":";;;;;;;;;;;;;;AAuBA,MAAM,oBAAoB,EAAE,sCAAsC,OAAO;AAEzE,MAAa,kBAAkB,WAAW;CACxC,MAAM,WAAW,aAAa;CAC9B,MAAM,aAAa,eAAe;CAClC,MAAM,QAAQ,qBAAqB,WAAW,aAAa,kBAAkB;AAE7E,iBAAgB;EACd,MAAM,MAAM,QAAQ,IAAI,aAAa;AACrC,MAAI,CAAC,YAAY,CAAC,IAAK;AACvB,SAAO,qBAAqB,mBAAmB,SAAS,KAAK;IAC5D,CAAC,SAAS,CAAC;AAEd,iBAAgB;EACd,MAAM,WAAW,UAAqC,kBAAkB,MAAM;AAC9E,SAAO,iBAAiB,eAAe,SAAS,KAAK;AACrD,SAAO,iBAAiB,eAAe,SAAS,KAAK;AACrD,eAAa;AACX,UAAO,oBAAoB,eAAe,SAAS,KAAK;AACxD,UAAO,oBAAoB,eAAe,SAAS,KAAK;;IAEzD,EAAE,CAAC;CAEN,MAAM,YAAY,cAEd,uBAAuB,MAAM,OAAO,EAAE,EAAE;EACtC,WAAW,MAAM;EACjB,eAAe,MAAM;EACtB,CAAC,EACJ;EAAC,MAAM;EAAO,MAAM;EAAW,MAAM;EAAc,CACpD;CACD,MAAM,EAAE,QAAQ,KAAK,SAAS,eAA+B,WAAW;CACxE,MAAM,WAAW,MAAM,UAAU,QAAQ,MAAM,UAAU;AACzD,KAAI,CAAC,SAAU,QAAO;AACtB,KAAI,CAAC,MAAM,QAAQ,MAAM,MAAM,WAAW,EAAG,QAAO;AAEpD,QACE,oBAAC,YAAY,MAAb;EACE,MAAM,MAAM;EACZ,eAAe,SAAS;AACtB,OAAI,MAAM;AACR,wBAAoB,EAAE,MAAM,CAAC;AAC7B;;AAEF,qBAAkB;;YAGpB,oBAAC,YAAY,QAAb;GAAoB,WAAW;aAC7B,oBAAC,YAAY,YAAb;IACE,QAAQ,MAAM,UAAU,KAAA;IACxB,WAAW,OAAO;IAClB,KAAK;IACL,YAAY;IACZ,OAAO;KAAE,GAAG;KAAmB;KAAQ;cAEvC,qBAAC,YAAY,OAAb;KACE,WAAW,GAAG,OAAO,OAAO,YAAY,OAAO,eAAe;KAC9D,eAAe;eAFjB;MAIG,MAAM,UAAU,OAAO,OAAO,oBAAC,OAAD;OAAK,WAAW,OAAO;iBAAS,MAAM;OAAa,CAAA;MACjF,WAAW,oBAAC,OAAD;OAAK,WAAW,OAAO;iBAAe;OAAgB,CAAA,GAAG;MACpE,MAAM,UAAU,OAAO,OAAO,oBAAC,OAAD;OAAK,WAAW,OAAO;iBAAS,MAAM;OAAa,CAAA;MAChE;;IACG,CAAA;GACN,CAAA;EACJ,CAAA;EAErB;AAEF,gBAAgB,cAAc"}