@lobehub/ui 4.4.4 → 4.5.0

package/es/Accordion/Accordion.d.mts

@@ -1,8 +1,8 @@
 import { AccordionProps } from "./type.mjs";
-import * as react62 from "react";
+import * as react3 from "react";
 
 //#region src/Accordion/Accordion.d.ts
-declare const Accordion: react62.NamedExoticComponent<AccordionProps>;
+declare const Accordion: react3.NamedExoticComponent<AccordionProps>;
 //#endregion
 export { Accordion };
 //# sourceMappingURL=Accordion.d.mts.map

package/es/Accordion/AccordionItem.d.mts

@@ -1,8 +1,8 @@
 import { AccordionItemProps } from "./type.mjs";
-import * as react63 from "react";
+import * as react4 from "react";
 
 //#region src/Accordion/AccordionItem.d.ts
-declare const AccordionItem: react63.NamedExoticComponent<AccordionItemProps>;
+declare const AccordionItem: react4.NamedExoticComponent<AccordionItemProps>;
 //#endregion
 export { AccordionItem };
 //# sourceMappingURL=AccordionItem.d.mts.map

package/es/Accordion/AccordionItem.mjs

@@ -6,6 +6,7 @@ import { styles } from "./style.mjs";
 import FlexBasic_default from "../Flex/FlexBasic.mjs";
 import Block_default from "../Block/Block.mjs";
 import Text_default from "../Text/Text.mjs";
+import { stopPropagation } from "../utils/dom.mjs";
 import ArrowIcon_default from "./ArrowIcon.mjs";
 import { memo, useCallback, useEffect, useMemo, useRef } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
@@ -229,7 +230,7 @@ const AccordionItem = memo(({ itemKey, title, children, action, disabled = false
 		flex: "none",
 		gap: 4,
 		horizontal: true,
-		onClick: (e) => e.stopPropagation(),
+		onClick: stopPropagation,
 		style: customStyles?.action,
 		children: action
 	}), [

package/es/Accordion/AccordionItem.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionItem.mjs","names":["motionContainerStyle: CSSProperties","ArrowIcon","Text","Flexbox","Block"],"sources":["../../src/Accordion/AccordionItem.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { AnimatePresence } from 'motion/react';\nimport type { CSSProperties, ComponentPropsWithoutRef, ReactNode } from 'react';\nimport { KeyboardEvent, memo, useCallback, useEffect, useMemo, useRef } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport Block from '@/Block';\nimport { Flexbox } from '@/Flex';\nimport { type MotionComponentType, useMotionComponent } from '@/MotionProvider';\nimport Text from '@/Text';\n\nimport ArrowIcon from './ArrowIcon';\nimport { useAccordionContext } from './context';\nimport { styles } from './style';\nimport type { AccordionItemProps } from './type';\n\ntype AccordionContentBaseProps = {\n  children?: ReactNode;\n  className?: string;\n  contentInnerClassName: string;\n  style?: CSSProperties;\n};\n\ntype AccordionStaticContentProps = AccordionContentBaseProps & {\n  isOpen: boolean;\n  keepContentMounted: boolean;\n};\n\ntype MotionDivProps = ComponentPropsWithoutRef<MotionComponentType['div']>;\n\ntype AccordionMotionContentProps = AccordionContentBaseProps & {\n  contextMotionProps?: MotionDivProps;\n  isOpen: boolean;\n  skipInitialAnimation: boolean;\n};\n\ntype AccordionItemContentProps = AccordionContentBaseProps & {\n  contextMotionProps?: MotionDivProps;\n  disableAnimation: boolean;\n  isOpen: boolean;\n  keepContentMounted: boolean;\n  skipInitialAnimation: boolean;\n};\n\nconst motionContainerStyle: CSSProperties = { overflow: 'hidden' };\n\nconst AccordionStaticContent = memo<AccordionStaticContentProps>(\n  ({ className, style, children, contentInnerClassName, isOpen, keepContentMounted }) => {\n    if (keepContentMounted) {\n      return (\n        <div\n          className={className}\n          role=\"region\"\n          style={{\n            display: isOpen ? 'block' : 'none',\n            ...style,\n          }}\n        >\n          <div className={contentInnerClassName}>{children}</div>\n        </div>\n      );\n    }\n\n    if (!isOpen) return null;\n\n    return (\n      <div className={className} role=\"region\" style={style}>\n        <div className={contentInnerClassName}>{children}</div>\n      </div>\n    );\n  },\n);\n\nAccordionStaticContent.displayName = 'AccordionStaticContent';\n\nconst AccordionMotionContent = memo<AccordionMotionContentProps>(\n  ({\n    contextMotionProps,\n    className,\n    style,\n    children,\n    contentInnerClassName,\n    isOpen,\n    skipInitialAnimation,\n  }) => {\n    const Motion = useMotionComponent();\n\n    const motionProps = useMemo(\n      () => ({\n        animate: 'enter',\n        exit: 'exit',\n        initial: skipInitialAnimation ? false : 'exit',\n        variants: {\n          enter: {\n            height: 'auto',\n            opacity: 1,\n            transition: {\n              duration: 0.2,\n              ease: [0.4, 0, 0.2, 1],\n            },\n          },\n          exit: {\n            height: 0,\n            opacity: 0,\n            transition: {\n              duration: 0.2,\n              ease: [0.4, 0, 0.2, 1],\n            },\n          },\n        },\n        ...contextMotionProps,\n      }),\n      [contextMotionProps, skipInitialAnimation],\n    );\n\n    return (\n      <AnimatePresence initial={false}>\n        {isOpen ? (\n          <Motion.div {...(motionProps as any)} style={motionContainerStyle}>\n            <div className={className} role=\"region\" style={style}>\n              <div className={contentInnerClassName}>{children}</div>\n            </div>\n          </Motion.div>\n        ) : null}\n      </AnimatePresence>\n    );\n  },\n);\n\nAccordionMotionContent.displayName = 'AccordionMotionContent';\n\nconst AccordionItemContent = memo<AccordionItemContentProps>(\n  ({\n    disableAnimation,\n    isOpen,\n    keepContentMounted,\n    className,\n    style,\n    children,\n    contentInnerClassName,\n    contextMotionProps,\n    skipInitialAnimation,\n  }) => {\n    if (disableAnimation || !keepContentMounted) {\n      return (\n        <AccordionStaticContent\n          className={className}\n          contentInnerClassName={contentInnerClassName}\n          isOpen={isOpen}\n          keepContentMounted={keepContentMounted}\n          style={style}\n        >\n          {children}\n        </AccordionStaticContent>\n      );\n    }\n\n    return (\n      <AccordionMotionContent\n        className={className}\n        contentInnerClassName={contentInnerClassName}\n        contextMotionProps={contextMotionProps}\n        isOpen={isOpen}\n        skipInitialAnimation={skipInitialAnimation}\n        style={style}\n      >\n        {children}\n      </AccordionMotionContent>\n    );\n  },\n);\n\nAccordionItemContent.displayName = 'AccordionItemContent';\n\nconst AccordionItem = memo<AccordionItemProps>(\n  ({\n    itemKey,\n    title,\n    children,\n    action,\n    disabled = false,\n    allowExpand = true,\n    hideIndicator: itemHideIndicator,\n    indicatorPlacement: itemIndicatorPlacement,\n    indicator: customIndicator,\n    classNames,\n    paddingInline = 16,\n    paddingBlock = 8,\n    padding,\n    ref,\n    variant: customVariant,\n    styles: customStyles,\n    headerWrapper,\n    defaultExpand,\n    expand,\n    onExpandChange,\n  }) => {\n    const context = useAccordionContext();\n\n    // Determine if using standalone mode (has expand or defaultExpand props)\n    const isStandalone = expand !== undefined || defaultExpand !== undefined;\n\n    // Standalone state management\n    const [isExpandedStandalone, setIsExpandedStandalone] = useMergeState<boolean>(\n      defaultExpand ?? false,\n      {\n        onChange: onExpandChange,\n        value: expand,\n      },\n    );\n\n    // Context values (may be null if used standalone)\n    const contextIsExpanded = context?.isExpanded;\n    const contextOnToggle = context?.onToggle;\n    const contextHideIndicator = context?.hideIndicator;\n    const contextIndicatorPlacement = context?.indicatorPlacement;\n    const contextKeepContentMounted = context?.keepContentMounted;\n    const contextDisableAnimation = context?.disableAnimation;\n    const contextMotionProps = context?.motionProps;\n    const contextVariant = context?.variant ?? 'borderless';\n\n    const isInitialRenderRef = useRef(true);\n\n    useEffect(() => {\n      isInitialRenderRef.current = false;\n    }, []);\n\n    // Determine expanded state\n    const isOpen = isStandalone\n      ? isExpandedStandalone\n      : contextIsExpanded\n        ? contextIsExpanded(itemKey)\n        : false;\n\n    // Determine other props with fallbacks\n    const hideIndicatorFinal = itemHideIndicator ?? contextHideIndicator ?? false;\n    const indicatorPlacementFinal = itemIndicatorPlacement ?? contextIndicatorPlacement ?? 'start';\n    const keepContentMounted = contextKeepContentMounted ?? true;\n    const disableAnimation = contextDisableAnimation ?? false;\n    const variant = customVariant || contextVariant;\n\n    const handleToggle = useCallback(() => {\n      // If allowExpand is false, only allow controlled expansion via expand prop\n      if (!allowExpand) return;\n\n      if (!disabled) {\n        if (isStandalone) {\n          setIsExpandedStandalone(!isExpandedStandalone);\n        } else if (contextOnToggle) {\n          contextOnToggle(itemKey);\n        }\n      }\n    }, [\n      allowExpand,\n      disabled,\n      isStandalone,\n      setIsExpandedStandalone,\n      isExpandedStandalone,\n      contextOnToggle,\n      itemKey,\n    ]);\n\n    const handleKeyDown = useCallback(\n      (e: KeyboardEvent) => {\n        // If allowExpand is false, disable keyboard toggle\n        if (!allowExpand || disabled) return;\n\n        switch (e.key) {\n          case 'Enter':\n          case ' ': {\n            e.preventDefault();\n            handleToggle();\n            break;\n          }\n        }\n      },\n      [allowExpand, disabled, handleToggle],\n    );\n\n    const preventTitleTextSelection = useCallback((e: any) => {\n      // Prevent browser from creating a selection range on double/multi click,\n      // which can accidentally select the content region.\n      if (e?.detail > 1) e.preventDefault();\n    }, []);\n\n    // Build indicator\n    const indicator = useMemo(() => {\n      if (!allowExpand || hideIndicatorFinal) return null;\n\n      if (customIndicator) {\n        if (typeof customIndicator === 'function') {\n          return (\n            <span\n              aria-hidden=\"true\"\n              className={cx(styles.indicator, classNames?.indicator)}\n              style={customStyles?.indicator}\n            >\n              {customIndicator({ isDisabled: disabled, isOpen })}\n            </span>\n          );\n        }\n        return (\n          <span\n            aria-hidden=\"true\"\n            className={cx(styles.indicator, classNames?.indicator)}\n            style={customStyles?.indicator}\n          >\n            {customIndicator}\n          </span>\n        );\n      }\n\n      return (\n        <span\n          aria-hidden=\"true\"\n          className={cx(styles.indicator, classNames?.indicator)}\n          style={customStyles?.indicator}\n        >\n          <ArrowIcon className={cx(styles.icon, isOpen && styles.iconRotate)} />\n        </span>\n      );\n    }, [\n      allowExpand,\n      hideIndicatorFinal,\n      customIndicator,\n      disabled,\n      isOpen,\n      cx,\n      styles,\n      classNames,\n      customStyles,\n    ]);\n\n    const skipInitialAnimation = isInitialRenderRef.current && isOpen;\n\n    const contentClassName = useMemo(\n      () => cx('accordion-content', styles.content, classNames?.content),\n      [cx, styles, classNames?.content],\n    );\n\n    const titleNode = useMemo(\n      () =>\n        typeof title === 'string' ? (\n          <Text className={classNames?.title} ellipsis style={customStyles?.title}>\n            {title}\n          </Text>\n        ) : (\n          title\n        ),\n      [title, classNames?.title, customStyles?.title],\n    );\n\n    const actionNode = useMemo(\n      () =>\n        action && (\n          <Flexbox\n            align={'center'}\n            className={cx('accordion-action', styles.action, classNames?.action)}\n            flex={'none'}\n            gap={4}\n            horizontal\n            onClick={(e) => e.stopPropagation()}\n            style={customStyles?.action}\n          >\n            {action}\n          </Flexbox>\n        ),\n      [action, cx, styles, classNames?.action, customStyles?.action],\n    );\n\n    const headerElement = useMemo(() => {\n      const header = (\n        <Block\n          className={cx('accordion-header', styles.header, classNames?.header)}\n          clickable={!disabled && allowExpand}\n          gap={4}\n          horizontal\n          justify={'space-between'}\n          onClick={handleToggle}\n          onKeyDown={handleKeyDown}\n          padding={padding}\n          paddingBlock={paddingBlock}\n          paddingInline={paddingInline}\n          ref={ref}\n          style={{\n            alignItems: 'center',\n            cursor: disabled ? 'not-allowed' : allowExpand ? 'pointer' : 'default',\n            opacity: disabled ? 0.5 : undefined,\n            overflow: 'hidden',\n            width: '100%',\n            ...customStyles?.header,\n          }}\n          variant={customVariant || variant}\n        >\n          {indicatorPlacementFinal === 'start' ? (\n            <>\n              <Flexbox\n                align={'center'}\n                className={styles.titleWrapper}\n                flex={1}\n                gap={2}\n                horizontal\n                onDoubleClick={preventTitleTextSelection}\n                onMouseDown={preventTitleTextSelection}\n                style={{\n                  overflow: 'hidden',\n                }}\n              >\n                {titleNode}\n                {indicator}\n              </Flexbox>\n              <Flexbox align={'center'} flex={'none'} gap={4} horizontal>\n                {actionNode}\n              </Flexbox>\n            </>\n          ) : (\n            <>\n              <Flexbox\n                align={'center'}\n                className={styles.titleWrapper}\n                flex={1}\n                gap={2}\n                horizontal\n                onDoubleClick={preventTitleTextSelection}\n                onMouseDown={preventTitleTextSelection}\n                style={{\n                  overflow: 'hidden',\n                }}\n              >\n                {titleNode}\n              </Flexbox>\n              <Flexbox align={'center'} flex={'none'} gap={4} horizontal>\n                {actionNode}\n                {indicator}\n              </Flexbox>\n            </>\n          )}\n        </Block>\n      );\n      if (headerWrapper) {\n        return headerWrapper(header);\n      }\n      return header;\n    }, [\n      cx,\n      styles,\n      classNames,\n      disabled,\n      handleToggle,\n      handleKeyDown,\n      padding,\n      paddingBlock,\n      paddingInline,\n      ref,\n      customVariant,\n      variant,\n      indicatorPlacementFinal,\n      titleNode,\n      indicator,\n      actionNode,\n      headerWrapper,\n    ]);\n\n    return (\n      <div\n        className={cx('accordion-item', styles.item, classNames?.base)}\n        style={customStyles?.base}\n      >\n        {headerElement}\n        <AccordionItemContent\n          className={contentClassName}\n          contentInnerClassName={styles.contentInner}\n          contextMotionProps={contextMotionProps}\n          disableAnimation={!!disableAnimation}\n          isOpen={isOpen}\n          keepContentMounted={!!keepContentMounted}\n          skipInitialAnimation={skipInitialAnimation}\n          style={customStyles?.content}\n        >\n          {children}\n        </AccordionItemContent>\n      </div>\n    );\n  },\n);\n\nAccordionItem.displayName = 'AccordionItem';\n\nexport default AccordionItem;\n"],"mappings":"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"}
+{"version":3,"file":"AccordionItem.mjs","names":["motionContainerStyle: CSSProperties","ArrowIcon","Text","Flexbox","Block"],"sources":["../../src/Accordion/AccordionItem.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { AnimatePresence } from 'motion/react';\nimport type { CSSProperties, ComponentPropsWithoutRef, ReactNode } from 'react';\nimport { KeyboardEvent, memo, useCallback, useEffect, useMemo, useRef } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport Block from '@/Block';\nimport { Flexbox } from '@/Flex';\nimport { type MotionComponentType, useMotionComponent } from '@/MotionProvider';\nimport Text from '@/Text';\nimport { stopPropagation } from '@/utils/dom';\n\nimport ArrowIcon from './ArrowIcon';\nimport { useAccordionContext } from './context';\nimport { styles } from './style';\nimport type { AccordionItemProps } from './type';\n\ntype AccordionContentBaseProps = {\n  children?: ReactNode;\n  className?: string;\n  contentInnerClassName: string;\n  style?: CSSProperties;\n};\n\ntype AccordionStaticContentProps = AccordionContentBaseProps & {\n  isOpen: boolean;\n  keepContentMounted: boolean;\n};\n\ntype MotionDivProps = ComponentPropsWithoutRef<MotionComponentType['div']>;\n\ntype AccordionMotionContentProps = AccordionContentBaseProps & {\n  contextMotionProps?: MotionDivProps;\n  isOpen: boolean;\n  skipInitialAnimation: boolean;\n};\n\ntype AccordionItemContentProps = AccordionContentBaseProps & {\n  contextMotionProps?: MotionDivProps;\n  disableAnimation: boolean;\n  isOpen: boolean;\n  keepContentMounted: boolean;\n  skipInitialAnimation: boolean;\n};\n\nconst motionContainerStyle: CSSProperties = { overflow: 'hidden' };\n\nconst AccordionStaticContent = memo<AccordionStaticContentProps>(\n  ({ className, style, children, contentInnerClassName, isOpen, keepContentMounted }) => {\n    if (keepContentMounted) {\n      return (\n        <div\n          className={className}\n          role=\"region\"\n          style={{\n            display: isOpen ? 'block' : 'none',\n            ...style,\n          }}\n        >\n          <div className={contentInnerClassName}>{children}</div>\n        </div>\n      );\n    }\n\n    if (!isOpen) return null;\n\n    return (\n      <div className={className} role=\"region\" style={style}>\n        <div className={contentInnerClassName}>{children}</div>\n      </div>\n    );\n  },\n);\n\nAccordionStaticContent.displayName = 'AccordionStaticContent';\n\nconst AccordionMotionContent = memo<AccordionMotionContentProps>(\n  ({\n    contextMotionProps,\n    className,\n    style,\n    children,\n    contentInnerClassName,\n    isOpen,\n    skipInitialAnimation,\n  }) => {\n    const Motion = useMotionComponent();\n\n    const motionProps = useMemo(\n      () => ({\n        animate: 'enter',\n        exit: 'exit',\n        initial: skipInitialAnimation ? false : 'exit',\n        variants: {\n          enter: {\n            height: 'auto',\n            opacity: 1,\n            transition: {\n              duration: 0.2,\n              ease: [0.4, 0, 0.2, 1],\n            },\n          },\n          exit: {\n            height: 0,\n            opacity: 0,\n            transition: {\n              duration: 0.2,\n              ease: [0.4, 0, 0.2, 1],\n            },\n          },\n        },\n        ...contextMotionProps,\n      }),\n      [contextMotionProps, skipInitialAnimation],\n    );\n\n    return (\n      <AnimatePresence initial={false}>\n        {isOpen ? (\n          <Motion.div {...(motionProps as any)} style={motionContainerStyle}>\n            <div className={className} role=\"region\" style={style}>\n              <div className={contentInnerClassName}>{children}</div>\n            </div>\n          </Motion.div>\n        ) : null}\n      </AnimatePresence>\n    );\n  },\n);\n\nAccordionMotionContent.displayName = 'AccordionMotionContent';\n\nconst AccordionItemContent = memo<AccordionItemContentProps>(\n  ({\n    disableAnimation,\n    isOpen,\n    keepContentMounted,\n    className,\n    style,\n    children,\n    contentInnerClassName,\n    contextMotionProps,\n    skipInitialAnimation,\n  }) => {\n    if (disableAnimation || !keepContentMounted) {\n      return (\n        <AccordionStaticContent\n          className={className}\n          contentInnerClassName={contentInnerClassName}\n          isOpen={isOpen}\n          keepContentMounted={keepContentMounted}\n          style={style}\n        >\n          {children}\n        </AccordionStaticContent>\n      );\n    }\n\n    return (\n      <AccordionMotionContent\n        className={className}\n        contentInnerClassName={contentInnerClassName}\n        contextMotionProps={contextMotionProps}\n        isOpen={isOpen}\n        skipInitialAnimation={skipInitialAnimation}\n        style={style}\n      >\n        {children}\n      </AccordionMotionContent>\n    );\n  },\n);\n\nAccordionItemContent.displayName = 'AccordionItemContent';\n\nconst AccordionItem = memo<AccordionItemProps>(\n  ({\n    itemKey,\n    title,\n    children,\n    action,\n    disabled = false,\n    allowExpand = true,\n    hideIndicator: itemHideIndicator,\n    indicatorPlacement: itemIndicatorPlacement,\n    indicator: customIndicator,\n    classNames,\n    paddingInline = 16,\n    paddingBlock = 8,\n    padding,\n    ref,\n    variant: customVariant,\n    styles: customStyles,\n    headerWrapper,\n    defaultExpand,\n    expand,\n    onExpandChange,\n  }) => {\n    const context = useAccordionContext();\n\n    // Determine if using standalone mode (has expand or defaultExpand props)\n    const isStandalone = expand !== undefined || defaultExpand !== undefined;\n\n    // Standalone state management\n    const [isExpandedStandalone, setIsExpandedStandalone] = useMergeState<boolean>(\n      defaultExpand ?? false,\n      {\n        onChange: onExpandChange,\n        value: expand,\n      },\n    );\n\n    // Context values (may be null if used standalone)\n    const contextIsExpanded = context?.isExpanded;\n    const contextOnToggle = context?.onToggle;\n    const contextHideIndicator = context?.hideIndicator;\n    const contextIndicatorPlacement = context?.indicatorPlacement;\n    const contextKeepContentMounted = context?.keepContentMounted;\n    const contextDisableAnimation = context?.disableAnimation;\n    const contextMotionProps = context?.motionProps;\n    const contextVariant = context?.variant ?? 'borderless';\n\n    const isInitialRenderRef = useRef(true);\n\n    useEffect(() => {\n      isInitialRenderRef.current = false;\n    }, []);\n\n    // Determine expanded state\n    const isOpen = isStandalone\n      ? isExpandedStandalone\n      : contextIsExpanded\n        ? contextIsExpanded(itemKey)\n        : false;\n\n    // Determine other props with fallbacks\n    const hideIndicatorFinal = itemHideIndicator ?? contextHideIndicator ?? false;\n    const indicatorPlacementFinal = itemIndicatorPlacement ?? contextIndicatorPlacement ?? 'start';\n    const keepContentMounted = contextKeepContentMounted ?? true;\n    const disableAnimation = contextDisableAnimation ?? false;\n    const variant = customVariant || contextVariant;\n\n    const handleToggle = useCallback(() => {\n      // If allowExpand is false, only allow controlled expansion via expand prop\n      if (!allowExpand) return;\n\n      if (!disabled) {\n        if (isStandalone) {\n          setIsExpandedStandalone(!isExpandedStandalone);\n        } else if (contextOnToggle) {\n          contextOnToggle(itemKey);\n        }\n      }\n    }, [\n      allowExpand,\n      disabled,\n      isStandalone,\n      setIsExpandedStandalone,\n      isExpandedStandalone,\n      contextOnToggle,\n      itemKey,\n    ]);\n\n    const handleKeyDown = useCallback(\n      (e: KeyboardEvent) => {\n        // If allowExpand is false, disable keyboard toggle\n        if (!allowExpand || disabled) return;\n\n        switch (e.key) {\n          case 'Enter':\n          case ' ': {\n            e.preventDefault();\n            handleToggle();\n            break;\n          }\n        }\n      },\n      [allowExpand, disabled, handleToggle],\n    );\n\n    const preventTitleTextSelection = useCallback((e: any) => {\n      // Prevent browser from creating a selection range on double/multi click,\n      // which can accidentally select the content region.\n      if (e?.detail > 1) e.preventDefault();\n    }, []);\n\n    // Build indicator\n    const indicator = useMemo(() => {\n      if (!allowExpand || hideIndicatorFinal) return null;\n\n      if (customIndicator) {\n        if (typeof customIndicator === 'function') {\n          return (\n            <span\n              aria-hidden=\"true\"\n              className={cx(styles.indicator, classNames?.indicator)}\n              style={customStyles?.indicator}\n            >\n              {customIndicator({ isDisabled: disabled, isOpen })}\n            </span>\n          );\n        }\n        return (\n          <span\n            aria-hidden=\"true\"\n            className={cx(styles.indicator, classNames?.indicator)}\n            style={customStyles?.indicator}\n          >\n            {customIndicator}\n          </span>\n        );\n      }\n\n      return (\n        <span\n          aria-hidden=\"true\"\n          className={cx(styles.indicator, classNames?.indicator)}\n          style={customStyles?.indicator}\n        >\n          <ArrowIcon className={cx(styles.icon, isOpen && styles.iconRotate)} />\n        </span>\n      );\n    }, [\n      allowExpand,\n      hideIndicatorFinal,\n      customIndicator,\n      disabled,\n      isOpen,\n      cx,\n      styles,\n      classNames,\n      customStyles,\n    ]);\n\n    const skipInitialAnimation = isInitialRenderRef.current && isOpen;\n\n    const contentClassName = useMemo(\n      () => cx('accordion-content', styles.content, classNames?.content),\n      [cx, styles, classNames?.content],\n    );\n\n    const titleNode = useMemo(\n      () =>\n        typeof title === 'string' ? (\n          <Text className={classNames?.title} ellipsis style={customStyles?.title}>\n            {title}\n          </Text>\n        ) : (\n          title\n        ),\n      [title, classNames?.title, customStyles?.title],\n    );\n\n    const actionNode = useMemo(\n      () =>\n        action && (\n          <Flexbox\n            align={'center'}\n            className={cx('accordion-action', styles.action, classNames?.action)}\n            flex={'none'}\n            gap={4}\n            horizontal\n            onClick={stopPropagation}\n            style={customStyles?.action}\n          >\n            {action}\n          </Flexbox>\n        ),\n      [action, cx, styles, classNames?.action, customStyles?.action],\n    );\n\n    const headerElement = useMemo(() => {\n      const header = (\n        <Block\n          className={cx('accordion-header', styles.header, classNames?.header)}\n          clickable={!disabled && allowExpand}\n          gap={4}\n          horizontal\n          justify={'space-between'}\n          onClick={handleToggle}\n          onKeyDown={handleKeyDown}\n          padding={padding}\n          paddingBlock={paddingBlock}\n          paddingInline={paddingInline}\n          ref={ref}\n          style={{\n            alignItems: 'center',\n            cursor: disabled ? 'not-allowed' : allowExpand ? 'pointer' : 'default',\n            opacity: disabled ? 0.5 : undefined,\n            overflow: 'hidden',\n            width: '100%',\n            ...customStyles?.header,\n          }}\n          variant={customVariant || variant}\n        >\n          {indicatorPlacementFinal === 'start' ? (\n            <>\n              <Flexbox\n                align={'center'}\n                className={styles.titleWrapper}\n                flex={1}\n                gap={2}\n                horizontal\n                onDoubleClick={preventTitleTextSelection}\n                onMouseDown={preventTitleTextSelection}\n                style={{\n                  overflow: 'hidden',\n                }}\n              >\n                {titleNode}\n                {indicator}\n              </Flexbox>\n              <Flexbox align={'center'} flex={'none'} gap={4} horizontal>\n                {actionNode}\n              </Flexbox>\n            </>\n          ) : (\n            <>\n              <Flexbox\n                align={'center'}\n                className={styles.titleWrapper}\n                flex={1}\n                gap={2}\n                horizontal\n                onDoubleClick={preventTitleTextSelection}\n                onMouseDown={preventTitleTextSelection}\n                style={{\n                  overflow: 'hidden',\n                }}\n              >\n                {titleNode}\n              </Flexbox>\n              <Flexbox align={'center'} flex={'none'} gap={4} horizontal>\n                {actionNode}\n                {indicator}\n              </Flexbox>\n            </>\n          )}\n        </Block>\n      );\n      if (headerWrapper) {\n        return headerWrapper(header);\n      }\n      return header;\n    }, [\n      cx,\n      styles,\n      classNames,\n      disabled,\n      handleToggle,\n      handleKeyDown,\n      padding,\n      paddingBlock,\n      paddingInline,\n      ref,\n      customVariant,\n      variant,\n      indicatorPlacementFinal,\n      titleNode,\n      indicator,\n      actionNode,\n      headerWrapper,\n    ]);\n\n    return (\n      <div\n        className={cx('accordion-item', styles.item, classNames?.base)}\n        style={customStyles?.base}\n      >\n        {headerElement}\n        <AccordionItemContent\n          className={contentClassName}\n          contentInnerClassName={styles.contentInner}\n          contextMotionProps={contextMotionProps}\n          disableAnimation={!!disableAnimation}\n          isOpen={isOpen}\n          keepContentMounted={!!keepContentMounted}\n          skipInitialAnimation={skipInitialAnimation}\n          style={customStyles?.content}\n        >\n          {children}\n        </AccordionItemContent>\n      </div>\n    );\n  },\n);\n\nAccordionItem.displayName = 'AccordionItem';\n\nexport default AccordionItem;\n"],"mappings":"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"}

package/es/ActionIcon/ActionIcon.d.mts

@@ -1,8 +1,8 @@
 import { ActionIconProps } from "./type.mjs";
-import * as react54 from "react";
+import * as react72 from "react";
 
 //#region src/ActionIcon/ActionIcon.d.ts
-declare const ActionIcon: react54.NamedExoticComponent<ActionIconProps>;
+declare const ActionIcon: react72.NamedExoticComponent<ActionIconProps>;
 //#endregion
 export { ActionIcon };
 //# sourceMappingURL=ActionIcon.d.mts.map

package/es/Alert/Alert.d.mts

@@ -1,8 +1,8 @@
 import { AlertProps } from "./type.mjs";
-import * as react0 from "react";
+import * as react19 from "react";
 
 //#region src/Alert/Alert.d.ts
-declare const Alert: react0.NamedExoticComponent<AlertProps>;
+declare const Alert: react19.NamedExoticComponent<AlertProps>;
 //#endregion
 export { Alert };
 //# sourceMappingURL=Alert.d.mts.map

package/es/AutoComplete/Select.d.mts

@@ -1,8 +1,8 @@
 import { AutoCompleteProps } from "./type.mjs";
-import * as react60 from "react";
+import * as react9 from "react";
 
 //#region src/AutoComplete/Select.d.ts
-declare const AutoComplete: react60.NamedExoticComponent<AutoCompleteProps>;
+declare const AutoComplete: react9.NamedExoticComponent<AutoCompleteProps>;
 //#endregion
 export { AutoComplete };
 //# sourceMappingURL=Select.d.mts.map

package/es/Avatar/AvatarGroup/index.d.mts

@@ -1,8 +1,8 @@
 import { AvatarGroupProps } from "../type.mjs";
-import * as react61 from "react";
+import * as react8 from "react";
 
 //#region src/Avatar/AvatarGroup/index.d.ts
-declare const AvatarGroup: react61.NamedExoticComponent<AvatarGroupProps>;
+declare const AvatarGroup: react8.NamedExoticComponent<AvatarGroupProps>;
 //#endregion
 export { AvatarGroup };
 //# sourceMappingURL=index.d.mts.map

package/es/Burger/Burger.d.mts

@@ -1,8 +1,8 @@
 import { BurgerProps } from "./type.mjs";
-import * as react59 from "react";
+import * as react71 from "react";
 
 //#region src/Burger/Burger.d.ts
-declare const Burger: react59.NamedExoticComponent<BurgerProps>;
+declare const Burger: react71.NamedExoticComponent<BurgerProps>;
 //#endregion
 export { Burger };
 //# sourceMappingURL=Burger.d.mts.map

package/es/CodeEditor/CodeEditor.d.mts

@@ -1,8 +1,8 @@
 import { CodeEditorProps } from "./type.mjs";
-import * as react58 from "react";
+import * as react69 from "react";
 
 //#region src/CodeEditor/CodeEditor.d.ts
-declare const CodeEditor: react58.NamedExoticComponent<CodeEditorProps>;
+declare const CodeEditor: react69.NamedExoticComponent<CodeEditorProps>;
 //#endregion
 export { CodeEditor };
 //# sourceMappingURL=CodeEditor.d.mts.map

package/es/Collapse/Collapse.d.mts

@@ -1,8 +1,8 @@
 import { CollapseProps } from "./type.mjs";
-import * as react57 from "react";
+import * as react68 from "react";
 
 //#region src/Collapse/Collapse.d.ts
-declare const Collapse: react57.NamedExoticComponent<CollapseProps>;
+declare const Collapse: react68.NamedExoticComponent<CollapseProps>;
 //#endregion
 export { Collapse };
 //# sourceMappingURL=Collapse.d.mts.map

package/es/ConfigProvider/index.d.mts

@@ -1,7 +1,7 @@
 import { MotionComponentType } from "../MotionProvider/index.mjs";
 import { TranslationResourcesInput } from "../i18n/types.mjs";
 import { CDN, CdnApi } from "../utils/genCdnUrl.mjs";
-import * as react40 from "react";
+import * as react5 from "react";
 import { ElementType, ReactNode } from "react";
 
 //#region src/ConfigProvider/index.d.ts
@@ -19,7 +19,7 @@ interface ConfigProviderProps {
   motion: MotionComponentType;
   resources?: TranslationResourcesInput;
 }
-declare const ConfigProvider: react40.NamedExoticComponent<ConfigProviderProps>;
+declare const ConfigProvider: react5.NamedExoticComponent<ConfigProviderProps>;
 type CdnFn = ({
   pkg,
   version,

package/es/ContextMenu/ContextMenuHost.d.mts

@@ -0,0 +1,8 @@
+import * as react108 from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/ContextMenu/ContextMenuHost.d.ts
+declare const ContextMenuHost: react108.MemoExoticComponent<() => react_jsx_runtime0.JSX.Element | null>;
+//#endregion
+export { ContextMenuHost };
+//# sourceMappingURL=ContextMenuHost.d.mts.map

package/es/ContextMenu/ContextMenuHost.mjs

@@ -0,0 +1,66 @@
+'use client';
+
+import { LOBE_THEME_APP_ID } from "../ThemeProvider/constants.mjs";
+import { TOOLTIP_CONTAINER_ATTR } from "../Tooltip/TooltipPortal.mjs";
+import { preventDefaultAndStopPropagation } from "../utils/dom.mjs";
+import { useIsClient } from "../hooks/useIsClient.mjs";
+import { styles } from "./style.mjs";
+import { renderContextMenuItems } from "./renderItems.mjs";
+import { closeContextMenu, getServerSnapshot, getSnapshot, setContextMenuState, subscribe, updateLastPointer } from "./store.mjs";
+import { memo, useEffect, useMemo, useSyncExternalStore } from "react";
+import { jsx } from "react/jsx-runtime";
+import { ContextMenu } from "@base-ui/react/context-menu";
+
+//#region src/ContextMenu/ContextMenuHost.tsx
+const ContextMenuHost = memo(() => {
+	const isClient = useIsClient();
+	const state = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
+	useEffect(() => {
+		const handler = (event) => updateLastPointer(event);
+		window.addEventListener("pointerdown", handler, true);
+		window.addEventListener("contextmenu", handler, true);
+		return () => {
+			window.removeEventListener("pointerdown", handler, true);
+			window.removeEventListener("contextmenu", handler, true);
+		};
+	}, []);
+	const menuItems = useMemo(() => renderContextMenuItems(state.items), [state.items]);
+	const portalContainer = useMemo(() => {
+		if (!isClient) return null;
+		const themeApp = document.querySelector(`#${LOBE_THEME_APP_ID}`);
+		if (themeApp) return themeApp;
+		const tooltipContainer = document.querySelector(`[${TOOLTIP_CONTAINER_ATTR}="true"]`);
+		if (tooltipContainer) return tooltipContainer;
+		return document.body;
+	}, [isClient]);
+	if (!isClient) return null;
+	if (!state.open && state.items.length === 0) return null;
+	if (!portalContainer) return null;
+	return /* @__PURE__ */ jsx(ContextMenu.Root, {
+		onOpenChange: (open) => {
+			if (open) {
+				setContextMenuState({ open });
+				return;
+			}
+			closeContextMenu();
+		},
+		open: state.open,
+		children: /* @__PURE__ */ jsx(ContextMenu.Portal, {
+			container: portalContainer,
+			children: /* @__PURE__ */ jsx(ContextMenu.Positioner, {
+				anchor: state.anchor ?? void 0,
+				sideOffset: 6,
+				children: /* @__PURE__ */ jsx(ContextMenu.Popup, {
+					className: styles.popup,
+					onContextMenu: preventDefaultAndStopPropagation,
+					children: menuItems
+				})
+			})
+		})
+	});
+});
+ContextMenuHost.displayName = "ContextMenuHost";
+
+//#endregion
+export { ContextMenuHost };
+//# sourceMappingURL=ContextMenuHost.mjs.map

package/es/ContextMenu/ContextMenuHost.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ContextMenuHost.mjs","names":[],"sources":["../../src/ContextMenu/ContextMenuHost.tsx"],"sourcesContent":["'use client';\n\nimport { ContextMenu } from '@base-ui/react/context-menu';\nimport { memo, useEffect, useMemo, useSyncExternalStore } from 'react';\n\nimport { LOBE_THEME_APP_ID } from '@/ThemeProvider';\nimport { TOOLTIP_CONTAINER_ATTR } from '@/Tooltip/TooltipPortal';\nimport { useIsClient } from '@/hooks/useIsClient';\nimport { preventDefaultAndStopPropagation } from '@/utils/dom';\n\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\nexport const ContextMenuHost = memo(() => {\n  const isClient = useIsClient();\n  const state = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);\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(() => renderContextMenuItems(state.items), [state.items]);\n  const portalContainer = useMemo(() => {\n    if (!isClient) return null;\n\n    const themeApp = document.querySelector<HTMLElement>(`#${LOBE_THEME_APP_ID}`);\n    if (themeApp) return themeApp;\n\n    const tooltipContainer = document.querySelector<HTMLElement>(\n      `[${TOOLTIP_CONTAINER_ATTR}=\"true\"]`,\n    );\n    if (tooltipContainer) return tooltipContainer;\n\n    return document.body;\n  }, [isClient]);\n\n  if (!isClient) return null;\n  if (!state.open && state.items.length === 0) return null;\n  if (!portalContainer) return null;\n\n  return (\n    <ContextMenu.Root\n      onOpenChange={(open) => {\n        if (open) {\n          setContextMenuState({ open });\n          return;\n        }\n        closeContextMenu();\n      }}\n      open={state.open}\n    >\n      <ContextMenu.Portal container={portalContainer}>\n        <ContextMenu.Positioner anchor={state.anchor ?? undefined} sideOffset={6}>\n          <ContextMenu.Popup\n            className={styles.popup}\n            onContextMenu={preventDefaultAndStopPropagation}\n          >\n            {menuItems}\n          </ContextMenu.Popup>\n        </ContextMenu.Positioner>\n      </ContextMenu.Portal>\n    </ContextMenu.Root>\n  );\n});\n\nContextMenuHost.displayName = 'ContextMenuHost';\n"],"mappings":";;;;;;;;;;;;;;AAqBA,MAAa,kBAAkB,WAAW;CACxC,MAAM,WAAW,aAAa;CAC9B,MAAM,QAAQ,qBAAqB,WAAW,aAAa,kBAAkB;AAE7E,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,cAAc,uBAAuB,MAAM,MAAM,EAAE,CAAC,MAAM,MAAM,CAAC;CACnF,MAAM,kBAAkB,cAAc;AACpC,MAAI,CAAC,SAAU,QAAO;EAEtB,MAAM,WAAW,SAAS,cAA2B,IAAI,oBAAoB;AAC7E,MAAI,SAAU,QAAO;EAErB,MAAM,mBAAmB,SAAS,cAChC,IAAI,uBAAuB,UAC5B;AACD,MAAI,iBAAkB,QAAO;AAE7B,SAAO,SAAS;IACf,CAAC,SAAS,CAAC;AAEd,KAAI,CAAC,SAAU,QAAO;AACtB,KAAI,CAAC,MAAM,QAAQ,MAAM,MAAM,WAAW,EAAG,QAAO;AACpD,KAAI,CAAC,gBAAiB,QAAO;AAE7B,QACE,oBAAC,YAAY;EACX,eAAe,SAAS;AACtB,OAAI,MAAM;AACR,wBAAoB,EAAE,MAAM,CAAC;AAC7B;;AAEF,qBAAkB;;EAEpB,MAAM,MAAM;YAEZ,oBAAC,YAAY;GAAO,WAAW;aAC7B,oBAAC,YAAY;IAAW,QAAQ,MAAM,UAAU;IAAW,YAAY;cACrE,oBAAC,YAAY;KACX,WAAW,OAAO;KAClB,eAAe;eAEd;MACiB;KACG;IACN;GACJ;EAErB;AAEF,gBAAgB,cAAc"}

package/es/ContextMenu/imperative.d.mts

@@ -0,0 +1,2 @@
+import { ContextMenuHost } from "./ContextMenuHost.mjs";
+import { showContextMenu } from "./store.mjs";

package/es/ContextMenu/index.d.mts

@@ -0,0 +1,4 @@
+import { ContextMenuHost } from "./ContextMenuHost.mjs";
+import { showContextMenu } from "./store.mjs";
+import "./imperative.mjs";
+export { ContextMenuHost, showContextMenu };

package/es/ContextMenu/index.d.ts

@@ -0,0 +1 @@
+export * from './index.d.mts';

package/es/ContextMenu/index.js

@@ -0,0 +1 @@
+export * from './index.mjs';

package/es/ContextMenu/index.mjs

@@ -0,0 +1,4 @@
+import { showContextMenu } from "./store.mjs";
+import { ContextMenuHost } from "./ContextMenuHost.mjs";
+
+export { ContextMenuHost, showContextMenu };

package/es/ContextMenu/renderItems.mjs

@@ -0,0 +1,141 @@
+import Icon_default from "../Icon/Icon.mjs";
+import { styles } from "./style.mjs";
+import { isValidElement } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx } from "antd-style";
+import { ChevronRight } from "lucide-react";
+import { ContextMenu } from "@base-ui/react/context-menu";
+
+//#region src/ContextMenu/renderItems.tsx
+const getItemKey = (item, fallback) => {
+	if (item && "key" in item && item.key !== void 0) return item.key;
+	return fallback;
+};
+const getItemLabel = (item) => {
+	if (item.label !== void 0) return item.label;
+	if ("title" in item && item.title !== void 0) return item.title;
+	return item.key;
+};
+const renderIcon = (icon) => {
+	if (!icon) return null;
+	if (isValidElement(icon)) return icon;
+	return /* @__PURE__ */ jsx(Icon_default, {
+		icon,
+		size: "small"
+	});
+};
+const getReserveIconSpaceMap = (items) => {
+	const flags = Array.from({ length: items.length }).fill(false);
+	let segmentIndices = [];
+	let segmentHasIcon = false;
+	const flush = () => {
+		if (segmentHasIcon) for (const index of segmentIndices) flags[index] = true;
+		segmentIndices = [];
+		segmentHasIcon = false;
+	};
+	items.forEach((item, index) => {
+		if (!item) return;
+		if (item.type === "divider" || item.type === "group") {
+			flush();
+			return;
+		}
+		segmentIndices.push(index);
+		if ("icon" in item && item.icon) segmentHasIcon = true;
+	});
+	flush();
+	return flags;
+};
+const renderItemContent = (item, options) => {
+	const label = getItemLabel(item);
+	const extra = "extra" in item ? item.extra : void 0;
+	const hasIcon = Boolean(item.icon);
+	const shouldRenderIcon = hasIcon || options?.reserveIconSpace;
+	return /* @__PURE__ */ jsxs("div", {
+		className: styles.itemContent,
+		children: [
+			shouldRenderIcon ? /* @__PURE__ */ jsx("span", {
+				"aria-hidden": !hasIcon,
+				className: styles.icon,
+				children: hasIcon ? renderIcon(item.icon) : null
+			}) : null,
+			/* @__PURE__ */ jsx("span", {
+				className: styles.label,
+				children: label
+			}),
+			extra ? /* @__PURE__ */ jsx("span", {
+				className: styles.extra,
+				children: extra
+			}) : null,
+			options?.submenu ? /* @__PURE__ */ jsx("span", {
+				className: styles.submenuArrow,
+				children: /* @__PURE__ */ jsx(ChevronRight, { size: 16 })
+			}) : null
+		]
+	});
+};
+const invokeItemClick = (item, keyPath, event) => {
+	if (!item.onClick) return;
+	const key = item.key ?? keyPath.at(-1) ?? "";
+	const info = {
+		domEvent: event,
+		item: event.currentTarget,
+		key: String(key),
+		keyPath
+	};
+	item.onClick(info);
+};
+const renderContextMenuItems = (items, keyPath = [], options) => {
+	const reserveIconSpaceMap = options?.reserveIconSpace === void 0 ? getReserveIconSpaceMap(items) : null;
+	return items.map((item, index) => {
+		if (!item) return null;
+		const itemKey = getItemKey(item, `${keyPath.join("-") || "root"}-${index}`);
+		const nextKeyPath = [...keyPath, String(itemKey)];
+		const reserveIconSpace = options?.reserveIconSpace ?? Boolean(reserveIconSpaceMap?.[index]);
+		if (item.type === "divider") return /* @__PURE__ */ jsx(ContextMenu.Separator, { className: styles.separator }, itemKey);
+		if (item.type === "group") {
+			const group = item;
+			const groupReserveIconSpace = Boolean(group.children?.some((child) => Boolean(child && "icon" in child && child.icon)));
+			return /* @__PURE__ */ jsxs(ContextMenu.Group, { children: [group.label ? /* @__PURE__ */ jsx(ContextMenu.GroupLabel, {
+				className: styles.groupLabel,
+				children: group.label
+			}) : null, group.children ? renderContextMenuItems(group.children, nextKeyPath, { reserveIconSpace: groupReserveIconSpace }) : null] }, itemKey);
+		}
+		if (item.type === "submenu" || "children" in item) {
+			const submenu = item;
+			const label$1 = getItemLabel(submenu);
+			const labelText$1 = typeof label$1 === "string" ? label$1 : void 0;
+			const isDanger$1 = "danger" in submenu && Boolean(submenu.danger);
+			return /* @__PURE__ */ jsxs(ContextMenu.SubmenuRoot, { children: [/* @__PURE__ */ jsx(ContextMenu.SubmenuTrigger, {
+				className: cx(styles.item, isDanger$1 && styles.danger),
+				disabled: submenu.disabled,
+				label: labelText$1,
+				children: renderItemContent(submenu, {
+					reserveIconSpace,
+					submenu: true
+				})
+			}), /* @__PURE__ */ jsx(ContextMenu.Portal, { children: /* @__PURE__ */ jsx(ContextMenu.Positioner, {
+				alignOffset: -4,
+				sideOffset: 6,
+				children: /* @__PURE__ */ jsx(ContextMenu.Popup, {
+					className: styles.popup,
+					children: submenu.children ? renderContextMenuItems(submenu.children, nextKeyPath) : null
+				})
+			}) })] }, itemKey);
+		}
+		const menuItem = item;
+		const label = getItemLabel(menuItem);
+		const labelText = typeof label === "string" ? label : void 0;
+		const isDanger = "danger" in menuItem && Boolean(menuItem.danger);
+		return /* @__PURE__ */ jsx(ContextMenu.Item, {
+			className: cx(styles.item, isDanger && styles.danger),
+			disabled: menuItem.disabled,
+			label: labelText,
+			onClick: (event) => invokeItemClick(menuItem, nextKeyPath, event),
+			children: renderItemContent(menuItem, { reserveIconSpace })
+		}, itemKey);
+	});
+};
+
+//#endregion
+export { renderContextMenuItems };
+//# sourceMappingURL=renderItems.mjs.map

package/es/ContextMenu/renderItems.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderItems.mjs","names":["Icon","segmentIndices: number[]","info: MenuInfo","label","labelText","isDanger"],"sources":["../../src/ContextMenu/renderItems.tsx"],"sourcesContent":["import { ContextMenu } from '@base-ui/react/context-menu';\nimport { cx } from 'antd-style';\nimport { ChevronRight } from 'lucide-react';\nimport type { MenuInfo } from 'rc-menu/es/interface';\nimport type {\n  Key,\n  KeyboardEvent as ReactKeyboardEvent,\n  MouseEvent as ReactMouseEvent,\n  ReactNode,\n} from 'react';\nimport { isValidElement } from 'react';\n\nimport Icon from '@/Icon';\nimport type {\n  GenericItemType,\n  ItemType,\n  MenuDividerType,\n  MenuItemGroupType,\n  MenuItemType,\n  SubMenuType,\n} from '@/Menu';\n\nimport { styles } from './style';\n\nconst getItemKey = (item: ItemType, fallback: string): Key => {\n  if (item && 'key' in item && item.key !== undefined) return item.key;\n  return fallback;\n};\n\nconst getItemLabel = (item: MenuItemType | SubMenuType): ReactNode => {\n  if (item.label !== undefined) return item.label;\n  if ('title' in item && item.title !== undefined) return item.title;\n  return item.key;\n};\n\nconst renderIcon = (icon: MenuItemType['icon']) => {\n  if (!icon) return null;\n  if (isValidElement(icon)) return icon;\n  return <Icon icon={icon} size={'small'} />;\n};\n\nconst getReserveIconSpaceMap = (items: GenericItemType[]) => {\n  const flags = Array.from({ length: items.length }).fill(false);\n  let segmentIndices: number[] = [];\n  let segmentHasIcon = false;\n\n  const flush = () => {\n    if (segmentHasIcon) {\n      for (const index of segmentIndices) flags[index] = true;\n    }\n    segmentIndices = [];\n    segmentHasIcon = false;\n  };\n\n  items.forEach((item, index) => {\n    if (!item) return;\n    if (\n      (item as MenuDividerType).type === 'divider' ||\n      (item as MenuItemGroupType).type === 'group'\n    ) {\n      flush();\n      return;\n    }\n\n    segmentIndices.push(index);\n    if ('icon' in item && item.icon) segmentHasIcon = true;\n  });\n\n  flush();\n  return flags;\n};\n\nconst renderItemContent = (\n  item: MenuItemType | SubMenuType,\n  options?: { reserveIconSpace?: boolean; submenu?: boolean },\n) => {\n  const label = getItemLabel(item);\n  const extra = 'extra' in item ? item.extra : undefined;\n  const hasIcon = Boolean(item.icon);\n  const shouldRenderIcon = hasIcon || options?.reserveIconSpace;\n\n  return (\n    <div className={styles.itemContent}>\n      {shouldRenderIcon ? (\n        <span aria-hidden={!hasIcon} className={styles.icon}>\n          {hasIcon ? renderIcon(item.icon) : null}\n        </span>\n      ) : null}\n      <span className={styles.label}>{label}</span>\n      {extra ? <span className={styles.extra}>{extra}</span> : null}\n      {options?.submenu ? (\n        <span className={styles.submenuArrow}>\n          <ChevronRight size={16} />\n        </span>\n      ) : null}\n    </div>\n  );\n};\n\nconst invokeItemClick = (\n  item: MenuItemType,\n  keyPath: string[],\n  event: ReactMouseEvent<HTMLElement> | ReactKeyboardEvent<HTMLElement>,\n) => {\n  if (!item.onClick) return;\n  const key = item.key ?? keyPath.at(-1) ?? '';\n  const info: MenuInfo = {\n    domEvent: event,\n    item: event.currentTarget as MenuInfo['item'],\n    key: String(key),\n    keyPath,\n  };\n  item.onClick(info);\n};\n\nexport const renderContextMenuItems = (\n  items: GenericItemType[],\n  keyPath: string[] = [],\n  options?: { reserveIconSpace?: boolean },\n): ReactNode[] => {\n  const reserveIconSpaceMap =\n    options?.reserveIconSpace === undefined ? getReserveIconSpaceMap(items) : null;\n\n  return items.map((item, index) => {\n    if (!item) return null;\n\n    const fallbackKey = `${keyPath.join('-') || 'root'}-${index}`;\n    const itemKey = getItemKey(item, fallbackKey);\n    const nextKeyPath = [...keyPath, String(itemKey)];\n    const reserveIconSpace = options?.reserveIconSpace ?? Boolean(reserveIconSpaceMap?.[index]);\n\n    if ((item as MenuDividerType).type === 'divider') {\n      return <ContextMenu.Separator className={styles.separator} key={itemKey} />;\n    }\n\n    if ((item as MenuItemGroupType).type === 'group') {\n      const group = item as MenuItemGroupType;\n      const groupReserveIconSpace = Boolean(\n        group.children?.some((child) => Boolean(child && 'icon' in child && child.icon)),\n      );\n      return (\n        <ContextMenu.Group key={itemKey}>\n          {group.label ? (\n            <ContextMenu.GroupLabel className={styles.groupLabel}>\n              {group.label}\n            </ContextMenu.GroupLabel>\n          ) : null}\n          {group.children\n            ? renderContextMenuItems(group.children, nextKeyPath, {\n                reserveIconSpace: groupReserveIconSpace,\n              })\n            : null}\n        </ContextMenu.Group>\n      );\n    }\n\n    if ((item as SubMenuType).type === 'submenu' || 'children' in item) {\n      const submenu = item as SubMenuType;\n      const label = getItemLabel(submenu);\n      const labelText = typeof label === 'string' ? label : undefined;\n      const isDanger = 'danger' in submenu && Boolean(submenu.danger);\n\n      return (\n        <ContextMenu.SubmenuRoot key={itemKey}>\n          <ContextMenu.SubmenuTrigger\n            className={cx(styles.item, isDanger && styles.danger)}\n            disabled={submenu.disabled}\n            label={labelText}\n          >\n            {renderItemContent(submenu, {\n              reserveIconSpace,\n              submenu: true,\n            })}\n          </ContextMenu.SubmenuTrigger>\n          <ContextMenu.Portal>\n            <ContextMenu.Positioner alignOffset={-4} sideOffset={6}>\n              <ContextMenu.Popup className={styles.popup}>\n                {submenu.children ? renderContextMenuItems(submenu.children, nextKeyPath) : null}\n              </ContextMenu.Popup>\n            </ContextMenu.Positioner>\n          </ContextMenu.Portal>\n        </ContextMenu.SubmenuRoot>\n      );\n    }\n\n    const menuItem = item as MenuItemType;\n    const label = getItemLabel(menuItem);\n    const labelText = typeof label === 'string' ? label : undefined;\n    const isDanger = 'danger' in menuItem && Boolean(menuItem.danger);\n\n    return (\n      <ContextMenu.Item\n        className={cx(styles.item, isDanger && styles.danger)}\n        disabled={menuItem.disabled}\n        key={itemKey}\n        label={labelText}\n        onClick={(event) => invokeItemClick(menuItem, nextKeyPath, event)}\n      >\n        {renderItemContent(menuItem, { reserveIconSpace })}\n      </ContextMenu.Item>\n    );\n  });\n};\n"],"mappings":"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"}

package/es/ContextMenu/store.d.mts

@@ -0,0 +1,10 @@
+import { GenericItemType } from "../Menu/type.mjs";
+import "../Menu/index.mjs";
+import "@floating-ui/react";
+
+//#region src/ContextMenu/store.d.ts
+
+declare const showContextMenu: (items: GenericItemType[]) => void;
+//#endregion
+export { showContextMenu };
+//# sourceMappingURL=store.d.mts.map

package/es/ContextMenu/store.mjs

@@ -0,0 +1,74 @@
+//#region src/ContextMenu/store.ts
+const emptyState = {
+	anchor: null,
+	items: [],
+	open: false
+};
+let contextMenuState = emptyState;
+const listeners = /* @__PURE__ */ new Set();
+const lastPointer = {
+	ready: false,
+	x: 0,
+	y: 0
+};
+const notify = () => {
+	listeners.forEach((listener) => listener());
+};
+const subscribe = (listener) => {
+	listeners.add(listener);
+	return () => listeners.delete(listener);
+};
+const getSnapshot = () => contextMenuState;
+const getServerSnapshot = () => emptyState;
+const updateLastPointer = (event) => {
+	lastPointer.x = event.clientX;
+	lastPointer.y = event.clientY;
+	lastPointer.ready = true;
+};
+const createVirtualElement = (point) => ({
+	contextElement: typeof document === "undefined" ? void 0 : document.body,
+	getBoundingClientRect: () => ({
+		bottom: point.y,
+		height: 0,
+		left: point.x,
+		right: point.x,
+		toJSON: () => void 0,
+		top: point.y,
+		width: 0,
+		x: point.x,
+		y: point.y
+	})
+});
+const setContextMenuState = (next) => {
+	contextMenuState = {
+		...contextMenuState,
+		...next
+	};
+	notify();
+};
+const showContextMenu = (items) => {
+	if (typeof window === "undefined") return;
+	const fallbackPoint = {
+		x: window.innerWidth / 2,
+		y: window.innerHeight / 2
+	};
+	setContextMenuState({
+		anchor: createVirtualElement(lastPointer.ready ? {
+			x: lastPointer.x,
+			y: lastPointer.y
+		} : fallbackPoint),
+		items,
+		open: true
+	});
+};
+const closeContextMenu = () => {
+	setContextMenuState({
+		anchor: null,
+		items: [],
+		open: false
+	});
+};
+
+//#endregion
+export { closeContextMenu, getServerSnapshot, getSnapshot, setContextMenuState, showContextMenu, subscribe, updateLastPointer };
+//# sourceMappingURL=store.mjs.map

package/es/ContextMenu/store.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"store.mjs","names":["emptyState: ContextMenuState","contextMenuState: ContextMenuState"],"sources":["../../src/ContextMenu/store.ts"],"sourcesContent":["import type { VirtualElement } from '@floating-ui/react';\n\nimport type { GenericItemType } from '@/Menu';\n\nexport type ContextMenuState = {\n  anchor: VirtualElement | null;\n  items: GenericItemType[];\n  open: boolean;\n};\n\nconst emptyState: ContextMenuState = {\n  anchor: null,\n  items: [],\n  open: false,\n};\n\nlet contextMenuState: ContextMenuState = emptyState;\nconst listeners = new Set<() => void>();\nconst lastPointer = { ready: false, x: 0, y: 0 };\n\nconst notify = () => {\n  listeners.forEach((listener) => listener());\n};\n\nexport const subscribe = (listener: () => void) => {\n  listeners.add(listener);\n  return () => listeners.delete(listener);\n};\n\nexport const getSnapshot = () => contextMenuState;\nexport const getServerSnapshot = () => emptyState;\n\nexport const updateLastPointer = (event: MouseEvent | PointerEvent) => {\n  lastPointer.x = event.clientX;\n  lastPointer.y = event.clientY;\n  lastPointer.ready = true;\n};\n\nconst createVirtualElement = (point: { x: number; y: number }): VirtualElement => ({\n  contextElement: typeof document === 'undefined' ? undefined : document.body,\n  getBoundingClientRect: () =>\n    ({\n      bottom: point.y,\n      height: 0,\n      left: point.x,\n      right: point.x,\n      toJSON: () => undefined,\n      top: point.y,\n      width: 0,\n      x: point.x,\n      y: point.y,\n    }) as DOMRect,\n});\n\nexport const setContextMenuState = (next: Partial<ContextMenuState>) => {\n  contextMenuState = { ...contextMenuState, ...next };\n  notify();\n};\n\nexport const showContextMenu = (items: GenericItemType[]) => {\n  if (typeof window === 'undefined') return;\n\n  const fallbackPoint = { x: window.innerWidth / 2, y: window.innerHeight / 2 };\n  const point = lastPointer.ready ? { x: lastPointer.x, y: lastPointer.y } : fallbackPoint;\n\n  setContextMenuState({\n    anchor: createVirtualElement(point),\n    items,\n    open: true,\n  });\n};\n\nexport const closeContextMenu = () => {\n  setContextMenuState({ anchor: null, items: [], open: false });\n};\n"],"mappings":";AAUA,MAAMA,aAA+B;CACnC,QAAQ;CACR,OAAO,EAAE;CACT,MAAM;CACP;AAED,IAAIC,mBAAqC;AACzC,MAAM,4BAAY,IAAI,KAAiB;AACvC,MAAM,cAAc;CAAE,OAAO;CAAO,GAAG;CAAG,GAAG;CAAG;AAEhD,MAAM,eAAe;AACnB,WAAU,SAAS,aAAa,UAAU,CAAC;;AAG7C,MAAa,aAAa,aAAyB;AACjD,WAAU,IAAI,SAAS;AACvB,cAAa,UAAU,OAAO,SAAS;;AAGzC,MAAa,oBAAoB;AACjC,MAAa,0BAA0B;AAEvC,MAAa,qBAAqB,UAAqC;AACrE,aAAY,IAAI,MAAM;AACtB,aAAY,IAAI,MAAM;AACtB,aAAY,QAAQ;;AAGtB,MAAM,wBAAwB,WAAqD;CACjF,gBAAgB,OAAO,aAAa,cAAc,SAAY,SAAS;CACvE,8BACG;EACC,QAAQ,MAAM;EACd,QAAQ;EACR,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc;EACd,KAAK,MAAM;EACX,OAAO;EACP,GAAG,MAAM;EACT,GAAG,MAAM;EACV;CACJ;AAED,MAAa,uBAAuB,SAAoC;AACtE,oBAAmB;EAAE,GAAG;EAAkB,GAAG;EAAM;AACnD,SAAQ;;AAGV,MAAa,mBAAmB,UAA6B;AAC3D,KAAI,OAAO,WAAW,YAAa;CAEnC,MAAM,gBAAgB;EAAE,GAAG,OAAO,aAAa;EAAG,GAAG,OAAO,cAAc;EAAG;AAG7E,qBAAoB;EAClB,QAAQ,qBAHI,YAAY,QAAQ;GAAE,GAAG,YAAY;GAAG,GAAG,YAAY;GAAG,GAAG,cAGtC;EACnC;EACA,MAAM;EACP,CAAC;;AAGJ,MAAa,yBAAyB;AACpC,qBAAoB;EAAE,QAAQ;EAAM,OAAO,EAAE;EAAE,MAAM;EAAO,CAAC"}