@lobehub/ui 5.43.1 → 5.45.0

package/es/base-ui/Accordion/atoms.mjs

@@ -1,4 +1,5 @@
 "use client";
+import { SubmenuArrowIcon } from "../SubmenuArrowIcon.mjs";
 import { contentVariants, headerVariants, indicatorVariants, itemVariants, rootVariants, styles, triggerVariants } from "./style.mjs";
 import { createContext, use, useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -55,9 +56,13 @@ const AccordionTrigger = ({ children, className, hideIndicator: hideIndicatorPro
 	const variant = variantProp ?? ctx.variant;
 	const hideIndicator = hideIndicatorProp ?? ctx.hideIndicator;
 	const placement = placementProp ?? ctx.indicatorPlacement;
-	const indicator = !hideIndicator && /* @__PURE__ */ jsx("span", {
+	const indicator = !hideIndicator && /* @__PURE__ */ jsxs("span", {
 		className: indicatorVariants({ placement }),
-		children: placement === "start" ? /* @__PURE__ */ jsx(ChevronRight, { size: 16 }) : /* @__PURE__ */ jsx(ChevronDown, { size: 16 })
+		children: [
+			placement === "start" && /* @__PURE__ */ jsx(ChevronRight, { size: 16 }),
+			placement === "inline" && /* @__PURE__ */ jsx(SubmenuArrowIcon, {}),
+			placement === "end" && /* @__PURE__ */ jsx(ChevronDown, { size: 16 })
+		]
 	});
 	return /* @__PURE__ */ jsxs(Accordion.Trigger, {
 		className: cx(triggerVariants({ variant }), className),
@@ -65,7 +70,7 @@ const AccordionTrigger = ({ children, className, hideIndicator: hideIndicatorPro
 		children: [
 			placement === "start" && indicator,
 			children,
-			placement === "end" && indicator
+			placement !== "start" && indicator
 		]
 	});
 };

package/es/base-ui/Accordion/atoms.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"atoms.mjs","names":["BaseUIAccordion"],"sources":["../../../src/base-ui/Accordion/atoms.tsx"],"sourcesContent":["'use client';\n\nimport { Accordion as BaseUIAccordion } from '@base-ui/react/accordion';\nimport { cx } from 'antd-style';\nimport { ChevronDown, ChevronRight } from 'lucide-react';\nimport { createContext, type FC, use, useMemo } from 'react';\n\nimport {\n  contentVariants,\n  headerVariants,\n  indicatorVariants,\n  itemVariants,\n  rootVariants,\n  styles,\n  triggerVariants,\n} from './style';\nimport type {\n  AccordionHeaderProps,\n  AccordionIndicatorPlacement,\n  AccordionItemProps,\n  AccordionPanelProps,\n  AccordionRootProps,\n  AccordionTriggerProps,\n  AccordionVariant,\n} from './type';\n\ninterface AccordionContextValue {\n  hideIndicator: boolean;\n  indicatorPlacement: AccordionIndicatorPlacement;\n  variant: AccordionVariant;\n}\n\nconst AccordionContext = createContext<AccordionContextValue>({\n  hideIndicator: false,\n  indicatorPlacement: 'start',\n  variant: 'borderless',\n});\n\nexport const useAccordionContext = () => use(AccordionContext);\n\nexport const AccordionRoot: FC<AccordionRootProps> = ({\n  children,\n  className,\n  hideIndicator = false,\n  indicatorPlacement = 'start',\n  variant = 'borderless',\n  ...rest\n}) => {\n  const contextValue = useMemo(\n    () => ({ hideIndicator, indicatorPlacement, variant }),\n    [hideIndicator, indicatorPlacement, variant],\n  );\n\n  return (\n    <AccordionContext value={contextValue}>\n      <BaseUIAccordion.Root className={cx(rootVariants({ variant }), className)} {...rest}>\n        {children}\n      </BaseUIAccordion.Root>\n    </AccordionContext>\n  );\n};\n\nAccordionRoot.displayName = 'AccordionRoot';\n\nexport const AccordionItem: FC<AccordionItemProps> = ({\n  className,\n  variant: variantProp,\n  ...rest\n}) => {\n  const ctx = useAccordionContext();\n  const variant = variantProp ?? ctx.variant;\n\n  return <BaseUIAccordion.Item className={cx(itemVariants({ variant }), className)} {...rest} />;\n};\n\nAccordionItem.displayName = 'AccordionItem';\n\nexport const AccordionHeader: FC<AccordionHeaderProps> = ({\n  className,\n  variant: variantProp,\n  ...rest\n}) => {\n  const ctx = useAccordionContext();\n  const variant = variantProp ?? ctx.variant;\n\n  return (\n    <BaseUIAccordion.Header className={cx(headerVariants({ variant }), className)} {...rest} />\n  );\n};\n\nAccordionHeader.displayName = 'AccordionHeader';\n\nexport const AccordionTrigger: FC<AccordionTriggerProps> = ({\n  children,\n  className,\n  hideIndicator: hideIndicatorProp,\n  indicatorPlacement: placementProp,\n  variant: variantProp,\n  ...rest\n}) => {\n  const ctx = useAccordionContext();\n  const variant = variantProp ?? ctx.variant;\n  const hideIndicator = hideIndicatorProp ?? ctx.hideIndicator;\n  const placement = placementProp ?? ctx.indicatorPlacement;\n\n  const indicator = !hideIndicator && (\n    <span className={indicatorVariants({ placement })}>\n      {placement === 'start' ? <ChevronRight size={16} /> : <ChevronDown size={16} />}\n    </span>\n  );\n\n  return (\n    <BaseUIAccordion.Trigger className={cx(triggerVariants({ variant }), className)} {...rest}>\n      {placement === 'start' && indicator}\n      {children}\n      {placement === 'end' && indicator}\n    </BaseUIAccordion.Trigger>\n  );\n};\n\nAccordionTrigger.displayName = 'AccordionTrigger';\n\nexport const AccordionPanel: FC<AccordionPanelProps> = ({\n  children,\n  className,\n  contentClassName,\n  contentStyle,\n  hideIndicator: hideIndicatorProp,\n  indicatorPlacement: placementProp,\n  variant: variantProp,\n  ...rest\n}) => {\n  const ctx = useAccordionContext();\n  const variant = variantProp ?? ctx.variant;\n  const hideIndicator = hideIndicatorProp ?? ctx.hideIndicator;\n  const placement = placementProp ?? ctx.indicatorPlacement;\n  const indent = !hideIndicator && placement === 'start';\n\n  return (\n    <BaseUIAccordion.Panel className={cx(styles.panel, className)} {...rest}>\n      <div\n        className={cx(contentVariants({ indent, variant }), contentClassName)}\n        style={contentStyle}\n      >\n        {children}\n      </div>\n    </BaseUIAccordion.Panel>\n  );\n};\n\nAccordionPanel.displayName = 'AccordionPanel';\n\nexport { styles as accordionStyles } from './style';\n"],"mappings":";;;;;;;;AAgCA,MAAM,mBAAmB,cAAqC;CAC5D,eAAe;CACf,oBAAoB;CACpB,SAAS;AACX,CAAC;AAED,MAAa,4BAA4B,IAAI,gBAAgB;AAE7D,MAAa,iBAAyC,EACpD,UACA,WACA,gBAAgB,OAChB,qBAAqB,SACrB,UAAU,cACV,GAAG,WACC;CACJ,MAAM,eAAe,eACZ;EAAE;EAAe;EAAoB;CAAQ,IACpD;EAAC;EAAe;EAAoB;CAAO,CAC7C;CAEA,OACE,oBAAC,kBAAD;EAAkB,OAAO;EACvB,UAAA,oBAACA,UAAgB,MAAjB;GAAsB,WAAW,GAAG,aAAa,EAAE,QAAQ,CAAC,GAAG,SAAS;GAAG,GAAI;GAC5E;EACmB,CAAA;CACN,CAAA;AAEtB;AAEA,cAAc,cAAc;AAE5B,MAAa,iBAAyC,EACpD,WACA,SAAS,aACT,GAAG,WACC;CACJ,MAAM,MAAM,oBAAoB;CAChC,MAAM,UAAU,eAAe,IAAI;CAEnC,OAAO,oBAACA,UAAgB,MAAjB;EAAsB,WAAW,GAAG,aAAa,EAAE,QAAQ,CAAC,GAAG,SAAS;EAAG,GAAI;CAAO,CAAA;AAC/F;AAEA,cAAc,cAAc;AAE5B,MAAa,mBAA6C,EACxD,WACA,SAAS,aACT,GAAG,WACC;CACJ,MAAM,MAAM,oBAAoB;CAChC,MAAM,UAAU,eAAe,IAAI;CAEnC,OACE,oBAACA,UAAgB,QAAjB;EAAwB,WAAW,GAAG,eAAe,EAAE,QAAQ,CAAC,GAAG,SAAS;EAAG,GAAI;CAAO,CAAA;AAE9F;AAEA,gBAAgB,cAAc;AAE9B,MAAa,oBAA+C,EAC1D,UACA,WACA,eAAe,mBACf,oBAAoB,eACpB,SAAS,aACT,GAAG,WACC;CACJ,MAAM,MAAM,oBAAoB;CAChC,MAAM,UAAU,eAAe,IAAI;CACnC,MAAM,gBAAgB,qBAAqB,IAAI;CAC/C,MAAM,YAAY,iBAAiB,IAAI;CAEvC,MAAM,YAAY,CAAC,iBACjB,oBAAC,QAAD;EAAM,WAAW,kBAAkB,EAAE,UAAU,CAAC;EAC7C,UAAA,cAAc,UAAU,oBAAC,cAAD,EAAc,MAAM,GAAK,CAAA,IAAI,oBAAC,aAAD,EAAa,MAAM,GAAK,CAAA;CAC1E,CAAA;CAGR,OACE,qBAACA,UAAgB,SAAjB;EAAyB,WAAW,GAAG,gBAAgB,EAAE,QAAQ,CAAC,GAAG,SAAS;EAAG,GAAI;EAArF,UAAA;GACG,cAAc,WAAW;GACzB;GACA,cAAc,SAAS;EACD;;AAE7B;AAEA,iBAAiB,cAAc;AAE/B,MAAa,kBAA2C,EACtD,UACA,WACA,kBACA,cACA,eAAe,mBACf,oBAAoB,eACpB,SAAS,aACT,GAAG,WACC;CACJ,MAAM,MAAM,oBAAoB;CAChC,MAAM,UAAU,eAAe,IAAI;CACnC,MAAM,gBAAgB,qBAAqB,IAAI;CAC/C,MAAM,YAAY,iBAAiB,IAAI;CACvC,MAAM,SAAS,CAAC,iBAAiB,cAAc;CAE/C,OACE,oBAACA,UAAgB,OAAjB;EAAuB,WAAW,GAAG,OAAO,OAAO,SAAS;EAAG,GAAI;EACjE,UAAA,oBAAC,OAAD;GACE,WAAW,GAAG,gBAAgB;IAAE;IAAQ;GAAQ,CAAC,GAAG,gBAAgB;GACpE,OAAO;GAEN;EACE,CAAA;CACgB,CAAA;AAE3B;AAEA,eAAe,cAAc"}
+{"version":3,"file":"atoms.mjs","names":["BaseUIAccordion"],"sources":["../../../src/base-ui/Accordion/atoms.tsx"],"sourcesContent":["'use client';\n\nimport { Accordion as BaseUIAccordion } from '@base-ui/react/accordion';\nimport { cx } from 'antd-style';\nimport { ChevronDown, ChevronRight } from 'lucide-react';\nimport { createContext, type FC, use, useMemo } from 'react';\n\nimport { SubmenuArrowIcon } from '@/base-ui/SubmenuArrowIcon';\n\nimport {\n  contentVariants,\n  headerVariants,\n  indicatorVariants,\n  itemVariants,\n  rootVariants,\n  styles,\n  triggerVariants,\n} from './style';\nimport type {\n  AccordionHeaderProps,\n  AccordionIndicatorPlacement,\n  AccordionItemProps,\n  AccordionPanelProps,\n  AccordionRootProps,\n  AccordionTriggerProps,\n  AccordionVariant,\n} from './type';\n\ninterface AccordionContextValue {\n  hideIndicator: boolean;\n  indicatorPlacement: AccordionIndicatorPlacement;\n  variant: AccordionVariant;\n}\n\nconst AccordionContext = createContext<AccordionContextValue>({\n  hideIndicator: false,\n  indicatorPlacement: 'start',\n  variant: 'borderless',\n});\n\nexport const useAccordionContext = () => use(AccordionContext);\n\nexport const AccordionRoot: FC<AccordionRootProps> = ({\n  children,\n  className,\n  hideIndicator = false,\n  indicatorPlacement = 'start',\n  variant = 'borderless',\n  ...rest\n}) => {\n  const contextValue = useMemo(\n    () => ({ hideIndicator, indicatorPlacement, variant }),\n    [hideIndicator, indicatorPlacement, variant],\n  );\n\n  return (\n    <AccordionContext value={contextValue}>\n      <BaseUIAccordion.Root className={cx(rootVariants({ variant }), className)} {...rest}>\n        {children}\n      </BaseUIAccordion.Root>\n    </AccordionContext>\n  );\n};\n\nAccordionRoot.displayName = 'AccordionRoot';\n\nexport const AccordionItem: FC<AccordionItemProps> = ({\n  className,\n  variant: variantProp,\n  ...rest\n}) => {\n  const ctx = useAccordionContext();\n  const variant = variantProp ?? ctx.variant;\n\n  return <BaseUIAccordion.Item className={cx(itemVariants({ variant }), className)} {...rest} />;\n};\n\nAccordionItem.displayName = 'AccordionItem';\n\nexport const AccordionHeader: FC<AccordionHeaderProps> = ({\n  className,\n  variant: variantProp,\n  ...rest\n}) => {\n  const ctx = useAccordionContext();\n  const variant = variantProp ?? ctx.variant;\n\n  return (\n    <BaseUIAccordion.Header className={cx(headerVariants({ variant }), className)} {...rest} />\n  );\n};\n\nAccordionHeader.displayName = 'AccordionHeader';\n\nexport const AccordionTrigger: FC<AccordionTriggerProps> = ({\n  children,\n  className,\n  hideIndicator: hideIndicatorProp,\n  indicatorPlacement: placementProp,\n  variant: variantProp,\n  ...rest\n}) => {\n  const ctx = useAccordionContext();\n  const variant = variantProp ?? ctx.variant;\n  const hideIndicator = hideIndicatorProp ?? ctx.hideIndicator;\n  const placement = placementProp ?? ctx.indicatorPlacement;\n\n  const indicator = !hideIndicator && (\n    <span className={indicatorVariants({ placement })}>\n      {placement === 'start' && <ChevronRight size={16} />}\n      {placement === 'inline' && <SubmenuArrowIcon />}\n      {placement === 'end' && <ChevronDown size={16} />}\n    </span>\n  );\n\n  return (\n    <BaseUIAccordion.Trigger className={cx(triggerVariants({ variant }), className)} {...rest}>\n      {placement === 'start' && indicator}\n      {children}\n      {placement !== 'start' && indicator}\n    </BaseUIAccordion.Trigger>\n  );\n};\n\nAccordionTrigger.displayName = 'AccordionTrigger';\n\nexport const AccordionPanel: FC<AccordionPanelProps> = ({\n  children,\n  className,\n  contentClassName,\n  contentStyle,\n  hideIndicator: hideIndicatorProp,\n  indicatorPlacement: placementProp,\n  variant: variantProp,\n  ...rest\n}) => {\n  const ctx = useAccordionContext();\n  const variant = variantProp ?? ctx.variant;\n  const hideIndicator = hideIndicatorProp ?? ctx.hideIndicator;\n  const placement = placementProp ?? ctx.indicatorPlacement;\n  const indent = !hideIndicator && placement === 'start';\n\n  return (\n    <BaseUIAccordion.Panel className={cx(styles.panel, className)} {...rest}>\n      <div\n        className={cx(contentVariants({ indent, variant }), contentClassName)}\n        style={contentStyle}\n      >\n        {children}\n      </div>\n    </BaseUIAccordion.Panel>\n  );\n};\n\nAccordionPanel.displayName = 'AccordionPanel';\n\nexport { styles as accordionStyles } from './style';\n"],"mappings":";;;;;;;;;AAkCA,MAAM,mBAAmB,cAAqC;CAC5D,eAAe;CACf,oBAAoB;CACpB,SAAS;AACX,CAAC;AAED,MAAa,4BAA4B,IAAI,gBAAgB;AAE7D,MAAa,iBAAyC,EACpD,UACA,WACA,gBAAgB,OAChB,qBAAqB,SACrB,UAAU,cACV,GAAG,WACC;CACJ,MAAM,eAAe,eACZ;EAAE;EAAe;EAAoB;CAAQ,IACpD;EAAC;EAAe;EAAoB;CAAO,CAC7C;CAEA,OACE,oBAAC,kBAAD;EAAkB,OAAO;EACvB,UAAA,oBAACA,UAAgB,MAAjB;GAAsB,WAAW,GAAG,aAAa,EAAE,QAAQ,CAAC,GAAG,SAAS;GAAG,GAAI;GAC5E;EACmB,CAAA;CACN,CAAA;AAEtB;AAEA,cAAc,cAAc;AAE5B,MAAa,iBAAyC,EACpD,WACA,SAAS,aACT,GAAG,WACC;CACJ,MAAM,MAAM,oBAAoB;CAChC,MAAM,UAAU,eAAe,IAAI;CAEnC,OAAO,oBAACA,UAAgB,MAAjB;EAAsB,WAAW,GAAG,aAAa,EAAE,QAAQ,CAAC,GAAG,SAAS;EAAG,GAAI;CAAO,CAAA;AAC/F;AAEA,cAAc,cAAc;AAE5B,MAAa,mBAA6C,EACxD,WACA,SAAS,aACT,GAAG,WACC;CACJ,MAAM,MAAM,oBAAoB;CAChC,MAAM,UAAU,eAAe,IAAI;CAEnC,OACE,oBAACA,UAAgB,QAAjB;EAAwB,WAAW,GAAG,eAAe,EAAE,QAAQ,CAAC,GAAG,SAAS;EAAG,GAAI;CAAO,CAAA;AAE9F;AAEA,gBAAgB,cAAc;AAE9B,MAAa,oBAA+C,EAC1D,UACA,WACA,eAAe,mBACf,oBAAoB,eACpB,SAAS,aACT,GAAG,WACC;CACJ,MAAM,MAAM,oBAAoB;CAChC,MAAM,UAAU,eAAe,IAAI;CACnC,MAAM,gBAAgB,qBAAqB,IAAI;CAC/C,MAAM,YAAY,iBAAiB,IAAI;CAEvC,MAAM,YAAY,CAAC,iBACjB,qBAAC,QAAD;EAAM,WAAW,kBAAkB,EAAE,UAAU,CAAC;EAAhD,UAAA;GACG,cAAc,WAAW,oBAAC,cAAD,EAAc,MAAM,GAAK,CAAA;GAClD,cAAc,YAAY,oBAAC,kBAAD,CAAmB,CAAA;GAC7C,cAAc,SAAS,oBAAC,aAAD,EAAa,MAAM,GAAK,CAAA;EAC5C;;CAGR,OACE,qBAACA,UAAgB,SAAjB;EAAyB,WAAW,GAAG,gBAAgB,EAAE,QAAQ,CAAC,GAAG,SAAS;EAAG,GAAI;EAArF,UAAA;GACG,cAAc,WAAW;GACzB;GACA,cAAc,WAAW;EACH;;AAE7B;AAEA,iBAAiB,cAAc;AAE/B,MAAa,kBAA2C,EACtD,UACA,WACA,kBACA,cACA,eAAe,mBACf,oBAAoB,eACpB,SAAS,aACT,GAAG,WACC;CACJ,MAAM,MAAM,oBAAoB;CAChC,MAAM,UAAU,eAAe,IAAI;CACnC,MAAM,gBAAgB,qBAAqB,IAAI;CAC/C,MAAM,YAAY,iBAAiB,IAAI;CACvC,MAAM,SAAS,CAAC,iBAAiB,cAAc;CAE/C,OACE,oBAACA,UAAgB,OAAjB;EAAuB,WAAW,GAAG,OAAO,OAAO,SAAS;EAAG,GAAI;EACjE,UAAA,oBAAC,OAAD;GACE,WAAW,GAAG,gBAAgB;IAAE;IAAQ;GAAQ,CAAC,GAAG,gBAAgB;GACpE,OAAO;GAEN;EACE,CAAA;CACgB,CAAA;AAE3B;AAEA,eAAe,cAAc"}

package/es/base-ui/Accordion/style.d.mts

@@ -12,6 +12,7 @@ declare const styles: {
   header: string;
   headerBorderless: string;
   indicator: string;
+  indicatorInline: string;
   indicatorEnd: string;
   indicatorStart: string;
   item: string;

package/es/base-ui/Accordion/style.mjs

@@ -77,6 +77,15 @@ const styles = createStaticStyles(({ css, cssVar }) => ({
     @media (prefers-reduced-motion: reduce) {
       transition-duration: 0s;
     }
+  `,
+	indicatorInline: css`
+    width: 14px;
+    height: 14px;
+    margin-inline-start: -4px;
+
+    [data-panel-open] & {
+      transform: rotate(90deg);
+    }
   `,
 	indicatorEnd: css`
     margin-inline-start: auto;
@@ -193,6 +202,7 @@ const indicatorVariants = cva(styles.indicator, {
 	defaultVariants: { placement: "start" },
 	variants: { placement: {
 		end: styles.indicatorEnd,
+		inline: styles.indicatorInline,
 		start: styles.indicatorStart
 	} }
 });

package/es/base-ui/Accordion/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Accordion/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { focusRing } from '@/base-ui/focusRing';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  action: css`\n    display: flex;\n    flex-shrink: 0;\n    gap: 4px;\n    align-items: center;\n\n    opacity: 0;\n\n    transition: opacity 150ms ${cssVar.motionEaseOut};\n  `,\n  actionAlwaysVisible: css`\n    opacity: 1;\n  `,\n  actionBorderless: css`\n    padding-inline-end: var(--accordion-hover-inset, 8px);\n  `,\n  actionOutlined: css`\n    padding-inline-end: 16px;\n  `,\n  content: css`\n    font-size: 14px;\n    line-height: 1.6;\n  `,\n  contentBorderless: css`\n    padding-block: 0 12px;\n  `,\n  contentIndent: css`\n    padding-inline-start: 24px;\n  `,\n  contentIndentOutlined: css`\n    padding-inline-start: 40px;\n  `,\n  contentOutlined: css`\n    padding-block: 0 14px;\n    padding-inline: 16px;\n  `,\n  header: css`\n    position: relative;\n\n    display: flex;\n    align-items: center;\n\n    margin: 0;\n\n    font-size: inherit;\n    font-weight: inherit;\n\n    transition: background 150ms ${cssVar.motionEaseOut};\n\n    &:hover:not(:has([data-disabled])) {\n      background: ${cssVar.colorFillTertiary};\n    }\n\n    &:hover .accordion-action,\n    &:focus-within .accordion-action {\n      opacity: 1;\n    }\n  `,\n  headerBorderless: css`\n    margin-inline: calc(var(--accordion-hover-inset, 8px) * -1);\n    border-radius: ${cssVar.borderRadius};\n  `,\n  indicator: css`\n    display: flex;\n    flex-shrink: 0;\n    align-items: center;\n\n    color: ${cssVar.colorTextDescription};\n\n    transition: transform 200ms ${cssVar.motionEaseOut};\n\n    @media (prefers-reduced-motion: reduce) {\n      transition-duration: 0s;\n    }\n  `,\n  indicatorEnd: css`\n    margin-inline-start: auto;\n\n    [data-panel-open] & {\n      transform: rotate(180deg);\n    }\n  `,\n  indicatorStart: css`\n    [data-panel-open] & {\n      transform: rotate(90deg);\n    }\n  `,\n  item: css`\n    display: flex;\n    flex-direction: column;\n  `,\n  itemOutlined: css`\n    & + & {\n      border-block-start: 1px solid ${cssVar.colorBorderSecondary};\n    }\n  `,\n  panel: css`\n    overflow: hidden;\n    height: var(--accordion-panel-height);\n    transition: height 200ms ${cssVar.motionEaseOut};\n\n    &[data-starting-style],\n    &[data-ending-style] {\n      height: 0;\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      transition-duration: 0s;\n    }\n  `,\n  root: css`\n    display: flex;\n    flex-direction: column;\n    width: 100%;\n  `,\n  rootOutlined: css`\n    overflow: hidden;\n    border: 1px solid ${cssVar.colorBorderSecondary};\n    border-radius: ${cssVar.borderRadiusLG};\n  `,\n  trigger: css`\n    cursor: pointer;\n    user-select: none;\n\n    display: flex;\n    flex: 1;\n    gap: 8px;\n    align-items: center;\n\n    min-width: 0;\n    border: 0;\n    border-radius: inherit;\n\n    font: inherit;\n    font-size: 14px;\n    font-weight: 500;\n    color: ${cssVar.colorText};\n    text-align: start;\n\n    background: none;\n    outline: none;\n\n    ${focusRing};\n\n    &[data-disabled] {\n      cursor: not-allowed;\n      color: ${cssVar.colorTextDisabled};\n    }\n  `,\n  triggerBorderless: css`\n    padding-block: 8px;\n    padding-inline: var(--accordion-hover-inset, 8px);\n  `,\n  triggerOutlined: css`\n    padding-block: 12px;\n    padding-inline: 16px;\n  `,\n}));\n\nexport const rootVariants = cva(styles.root, {\n  defaultVariants: { variant: 'borderless' },\n  variants: {\n    variant: {\n      borderless: null,\n      outlined: styles.rootOutlined,\n    },\n  },\n});\n\nexport const itemVariants = cva(styles.item, {\n  defaultVariants: { variant: 'borderless' },\n  variants: {\n    variant: {\n      borderless: null,\n      outlined: styles.itemOutlined,\n    },\n  },\n});\n\nexport const headerVariants = cva(styles.header, {\n  defaultVariants: { variant: 'borderless' },\n  variants: {\n    variant: {\n      borderless: styles.headerBorderless,\n      outlined: null,\n    },\n  },\n});\n\nexport const triggerVariants = cva(styles.trigger, {\n  defaultVariants: { variant: 'borderless' },\n  variants: {\n    variant: {\n      borderless: styles.triggerBorderless,\n      outlined: styles.triggerOutlined,\n    },\n  },\n});\n\nexport const indicatorVariants = cva(styles.indicator, {\n  defaultVariants: { placement: 'start' },\n  variants: {\n    placement: {\n      end: styles.indicatorEnd,\n      start: styles.indicatorStart,\n    },\n  },\n});\n\nexport const contentVariants = cva(styles.content, {\n  compoundVariants: [\n    {\n      class: styles.contentIndent,\n      indent: true,\n      variant: 'borderless',\n    },\n    {\n      class: styles.contentIndentOutlined,\n      indent: true,\n      variant: 'outlined',\n    },\n  ],\n  defaultVariants: { indent: true, variant: 'borderless' },\n  variants: {\n    indent: {\n      false: null,\n      true: null,\n    },\n    variant: {\n      borderless: styles.contentBorderless,\n      outlined: styles.contentOutlined,\n    },\n  },\n});\n\nexport const actionVariants = cva(styles.action, {\n  defaultVariants: { alwaysVisible: false, variant: 'borderless' },\n  variants: {\n    alwaysVisible: {\n      false: null,\n      true: styles.actionAlwaysVisible,\n    },\n    variant: {\n      borderless: styles.actionBorderless,\n      outlined: styles.actionOutlined,\n    },\n  },\n});\n"],"mappings":";;;;AAKA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,QAAQ,GAAG;;;;;;;;gCAQmB,OAAO,cAAc;;CAEnD,qBAAqB,GAAG;;;CAGxB,kBAAkB,GAAG;;;CAGrB,gBAAgB,GAAG;;;CAGnB,SAAS,GAAG;;;;CAIZ,mBAAmB,GAAG;;;CAGtB,eAAe,GAAG;;;CAGlB,uBAAuB,GAAG;;;CAG1B,iBAAiB,GAAG;;;;CAIpB,QAAQ,GAAG;;;;;;;;;;;mCAWsB,OAAO,cAAc;;;oBAGpC,OAAO,kBAAkB;;;;;;;;CAQ3C,kBAAkB,GAAG;;qBAEF,OAAO,aAAa;;CAEvC,WAAW,GAAG;;;;;aAKH,OAAO,qBAAqB;;kCAEP,OAAO,cAAc;;;;;;CAMrD,cAAc,GAAG;;;;;;;CAOjB,gBAAgB,GAAG;;;;;CAKnB,MAAM,GAAG;;;;CAIT,cAAc,GAAG;;sCAEmB,OAAO,qBAAqB;;;CAGhE,OAAO,GAAG;;;+BAGmB,OAAO,cAAc;;;;;;;;;;;CAWlD,MAAM,GAAG;;;;;CAKT,cAAc,GAAG;;wBAEK,OAAO,qBAAqB;qBAC/B,OAAO,eAAe;;CAEzC,SAAS,GAAG;;;;;;;;;;;;;;;;aAgBD,OAAO,UAAU;;;;;;MAMxB,UAAU;;;;eAID,OAAO,kBAAkB;;;CAGtC,mBAAmB,GAAG;;;;CAItB,iBAAiB,GAAG;;;;AAItB,EAAE;AAEF,MAAa,eAAe,IAAI,OAAO,MAAM;CAC3C,iBAAiB,EAAE,SAAS,aAAa;CACzC,UAAU,EACR,SAAS;EACP,YAAY;EACZ,UAAU,OAAO;CACnB,EACF;AACF,CAAC;AAED,MAAa,eAAe,IAAI,OAAO,MAAM;CAC3C,iBAAiB,EAAE,SAAS,aAAa;CACzC,UAAU,EACR,SAAS;EACP,YAAY;EACZ,UAAU,OAAO;CACnB,EACF;AACF,CAAC;AAED,MAAa,iBAAiB,IAAI,OAAO,QAAQ;CAC/C,iBAAiB,EAAE,SAAS,aAAa;CACzC,UAAU,EACR,SAAS;EACP,YAAY,OAAO;EACnB,UAAU;CACZ,EACF;AACF,CAAC;AAED,MAAa,kBAAkB,IAAI,OAAO,SAAS;CACjD,iBAAiB,EAAE,SAAS,aAAa;CACzC,UAAU,EACR,SAAS;EACP,YAAY,OAAO;EACnB,UAAU,OAAO;CACnB,EACF;AACF,CAAC;AAED,MAAa,oBAAoB,IAAI,OAAO,WAAW;CACrD,iBAAiB,EAAE,WAAW,QAAQ;CACtC,UAAU,EACR,WAAW;EACT,KAAK,OAAO;EACZ,OAAO,OAAO;CAChB,EACF;AACF,CAAC;AAED,MAAa,kBAAkB,IAAI,OAAO,SAAS;CACjD,kBAAkB,CAChB;EACE,OAAO,OAAO;EACd,QAAQ;EACR,SAAS;CACX,GACA;EACE,OAAO,OAAO;EACd,QAAQ;EACR,SAAS;CACX,CACF;CACA,iBAAiB;EAAE,QAAQ;EAAM,SAAS;CAAa;CACvD,UAAU;EACR,QAAQ;GACN,OAAO;GACP,MAAM;EACR;EACA,SAAS;GACP,YAAY,OAAO;GACnB,UAAU,OAAO;EACnB;CACF;AACF,CAAC;AAED,MAAa,iBAAiB,IAAI,OAAO,QAAQ;CAC/C,iBAAiB;EAAE,eAAe;EAAO,SAAS;CAAa;CAC/D,UAAU;EACR,eAAe;GACb,OAAO;GACP,MAAM,OAAO;EACf;EACA,SAAS;GACP,YAAY,OAAO;GACnB,UAAU,OAAO;EACnB;CACF;AACF,CAAC"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Accordion/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { focusRing } from '@/base-ui/focusRing';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  action: css`\n    display: flex;\n    flex-shrink: 0;\n    gap: 4px;\n    align-items: center;\n\n    opacity: 0;\n\n    transition: opacity 150ms ${cssVar.motionEaseOut};\n  `,\n  actionAlwaysVisible: css`\n    opacity: 1;\n  `,\n  actionBorderless: css`\n    padding-inline-end: var(--accordion-hover-inset, 8px);\n  `,\n  actionOutlined: css`\n    padding-inline-end: 16px;\n  `,\n  content: css`\n    font-size: 14px;\n    line-height: 1.6;\n  `,\n  contentBorderless: css`\n    padding-block: 0 12px;\n  `,\n  contentIndent: css`\n    padding-inline-start: 24px;\n  `,\n  contentIndentOutlined: css`\n    padding-inline-start: 40px;\n  `,\n  contentOutlined: css`\n    padding-block: 0 14px;\n    padding-inline: 16px;\n  `,\n  header: css`\n    position: relative;\n\n    display: flex;\n    align-items: center;\n\n    margin: 0;\n\n    font-size: inherit;\n    font-weight: inherit;\n\n    transition: background 150ms ${cssVar.motionEaseOut};\n\n    &:hover:not(:has([data-disabled])) {\n      background: ${cssVar.colorFillTertiary};\n    }\n\n    &:hover .accordion-action,\n    &:focus-within .accordion-action {\n      opacity: 1;\n    }\n  `,\n  headerBorderless: css`\n    margin-inline: calc(var(--accordion-hover-inset, 8px) * -1);\n    border-radius: ${cssVar.borderRadius};\n  `,\n  indicator: css`\n    display: flex;\n    flex-shrink: 0;\n    align-items: center;\n\n    color: ${cssVar.colorTextDescription};\n\n    transition: transform 200ms ${cssVar.motionEaseOut};\n\n    @media (prefers-reduced-motion: reduce) {\n      transition-duration: 0s;\n    }\n  `,\n  indicatorInline: css`\n    width: 14px;\n    height: 14px;\n    margin-inline-start: -4px;\n\n    [data-panel-open] & {\n      transform: rotate(90deg);\n    }\n  `,\n  indicatorEnd: css`\n    margin-inline-start: auto;\n\n    [data-panel-open] & {\n      transform: rotate(180deg);\n    }\n  `,\n  indicatorStart: css`\n    [data-panel-open] & {\n      transform: rotate(90deg);\n    }\n  `,\n  item: css`\n    display: flex;\n    flex-direction: column;\n  `,\n  itemOutlined: css`\n    & + & {\n      border-block-start: 1px solid ${cssVar.colorBorderSecondary};\n    }\n  `,\n  panel: css`\n    overflow: hidden;\n    height: var(--accordion-panel-height);\n    transition: height 200ms ${cssVar.motionEaseOut};\n\n    &[data-starting-style],\n    &[data-ending-style] {\n      height: 0;\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      transition-duration: 0s;\n    }\n  `,\n  root: css`\n    display: flex;\n    flex-direction: column;\n    width: 100%;\n  `,\n  rootOutlined: css`\n    overflow: hidden;\n    border: 1px solid ${cssVar.colorBorderSecondary};\n    border-radius: ${cssVar.borderRadiusLG};\n  `,\n  trigger: css`\n    cursor: pointer;\n    user-select: none;\n\n    display: flex;\n    flex: 1;\n    gap: 8px;\n    align-items: center;\n\n    min-width: 0;\n    border: 0;\n    border-radius: inherit;\n\n    font: inherit;\n    font-size: 14px;\n    font-weight: 500;\n    color: ${cssVar.colorText};\n    text-align: start;\n\n    background: none;\n    outline: none;\n\n    ${focusRing};\n\n    &[data-disabled] {\n      cursor: not-allowed;\n      color: ${cssVar.colorTextDisabled};\n    }\n  `,\n  triggerBorderless: css`\n    padding-block: 8px;\n    padding-inline: var(--accordion-hover-inset, 8px);\n  `,\n  triggerOutlined: css`\n    padding-block: 12px;\n    padding-inline: 16px;\n  `,\n}));\n\nexport const rootVariants = cva(styles.root, {\n  defaultVariants: { variant: 'borderless' },\n  variants: {\n    variant: {\n      borderless: null,\n      outlined: styles.rootOutlined,\n    },\n  },\n});\n\nexport const itemVariants = cva(styles.item, {\n  defaultVariants: { variant: 'borderless' },\n  variants: {\n    variant: {\n      borderless: null,\n      outlined: styles.itemOutlined,\n    },\n  },\n});\n\nexport const headerVariants = cva(styles.header, {\n  defaultVariants: { variant: 'borderless' },\n  variants: {\n    variant: {\n      borderless: styles.headerBorderless,\n      outlined: null,\n    },\n  },\n});\n\nexport const triggerVariants = cva(styles.trigger, {\n  defaultVariants: { variant: 'borderless' },\n  variants: {\n    variant: {\n      borderless: styles.triggerBorderless,\n      outlined: styles.triggerOutlined,\n    },\n  },\n});\n\nexport const indicatorVariants = cva(styles.indicator, {\n  defaultVariants: { placement: 'start' },\n  variants: {\n    placement: {\n      end: styles.indicatorEnd,\n      inline: styles.indicatorInline,\n      start: styles.indicatorStart,\n    },\n  },\n});\n\nexport const contentVariants = cva(styles.content, {\n  compoundVariants: [\n    {\n      class: styles.contentIndent,\n      indent: true,\n      variant: 'borderless',\n    },\n    {\n      class: styles.contentIndentOutlined,\n      indent: true,\n      variant: 'outlined',\n    },\n  ],\n  defaultVariants: { indent: true, variant: 'borderless' },\n  variants: {\n    indent: {\n      false: null,\n      true: null,\n    },\n    variant: {\n      borderless: styles.contentBorderless,\n      outlined: styles.contentOutlined,\n    },\n  },\n});\n\nexport const actionVariants = cva(styles.action, {\n  defaultVariants: { alwaysVisible: false, variant: 'borderless' },\n  variants: {\n    alwaysVisible: {\n      false: null,\n      true: styles.actionAlwaysVisible,\n    },\n    variant: {\n      borderless: styles.actionBorderless,\n      outlined: styles.actionOutlined,\n    },\n  },\n});\n"],"mappings":";;;;AAKA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,QAAQ,GAAG;;;;;;;;gCAQmB,OAAO,cAAc;;CAEnD,qBAAqB,GAAG;;;CAGxB,kBAAkB,GAAG;;;CAGrB,gBAAgB,GAAG;;;CAGnB,SAAS,GAAG;;;;CAIZ,mBAAmB,GAAG;;;CAGtB,eAAe,GAAG;;;CAGlB,uBAAuB,GAAG;;;CAG1B,iBAAiB,GAAG;;;;CAIpB,QAAQ,GAAG;;;;;;;;;;;mCAWsB,OAAO,cAAc;;;oBAGpC,OAAO,kBAAkB;;;;;;;;CAQ3C,kBAAkB,GAAG;;qBAEF,OAAO,aAAa;;CAEvC,WAAW,GAAG;;;;;aAKH,OAAO,qBAAqB;;kCAEP,OAAO,cAAc;;;;;;CAMrD,iBAAiB,GAAG;;;;;;;;;CASpB,cAAc,GAAG;;;;;;;CAOjB,gBAAgB,GAAG;;;;;CAKnB,MAAM,GAAG;;;;CAIT,cAAc,GAAG;;sCAEmB,OAAO,qBAAqB;;;CAGhE,OAAO,GAAG;;;+BAGmB,OAAO,cAAc;;;;;;;;;;;CAWlD,MAAM,GAAG;;;;;CAKT,cAAc,GAAG;;wBAEK,OAAO,qBAAqB;qBAC/B,OAAO,eAAe;;CAEzC,SAAS,GAAG;;;;;;;;;;;;;;;;aAgBD,OAAO,UAAU;;;;;;MAMxB,UAAU;;;;eAID,OAAO,kBAAkB;;;CAGtC,mBAAmB,GAAG;;;;CAItB,iBAAiB,GAAG;;;;AAItB,EAAE;AAEF,MAAa,eAAe,IAAI,OAAO,MAAM;CAC3C,iBAAiB,EAAE,SAAS,aAAa;CACzC,UAAU,EACR,SAAS;EACP,YAAY;EACZ,UAAU,OAAO;CACnB,EACF;AACF,CAAC;AAED,MAAa,eAAe,IAAI,OAAO,MAAM;CAC3C,iBAAiB,EAAE,SAAS,aAAa;CACzC,UAAU,EACR,SAAS;EACP,YAAY;EACZ,UAAU,OAAO;CACnB,EACF;AACF,CAAC;AAED,MAAa,iBAAiB,IAAI,OAAO,QAAQ;CAC/C,iBAAiB,EAAE,SAAS,aAAa;CACzC,UAAU,EACR,SAAS;EACP,YAAY,OAAO;EACnB,UAAU;CACZ,EACF;AACF,CAAC;AAED,MAAa,kBAAkB,IAAI,OAAO,SAAS;CACjD,iBAAiB,EAAE,SAAS,aAAa;CACzC,UAAU,EACR,SAAS;EACP,YAAY,OAAO;EACnB,UAAU,OAAO;CACnB,EACF;AACF,CAAC;AAED,MAAa,oBAAoB,IAAI,OAAO,WAAW;CACrD,iBAAiB,EAAE,WAAW,QAAQ;CACtC,UAAU,EACR,WAAW;EACT,KAAK,OAAO;EACZ,QAAQ,OAAO;EACf,OAAO,OAAO;CAChB,EACF;AACF,CAAC;AAED,MAAa,kBAAkB,IAAI,OAAO,SAAS;CACjD,kBAAkB,CAChB;EACE,OAAO,OAAO;EACd,QAAQ;EACR,SAAS;CACX,GACA;EACE,OAAO,OAAO;EACd,QAAQ;EACR,SAAS;CACX,CACF;CACA,iBAAiB;EAAE,QAAQ;EAAM,SAAS;CAAa;CACvD,UAAU;EACR,QAAQ;GACN,OAAO;GACP,MAAM;EACR;EACA,SAAS;GACP,YAAY,OAAO;GACnB,UAAU,OAAO;EACnB;CACF;AACF,CAAC;AAED,MAAa,iBAAiB,IAAI,OAAO,QAAQ;CAC/C,iBAAiB;EAAE,eAAe;EAAO,SAAS;CAAa;CAC/D,UAAU;EACR,eAAe;GACb,OAAO;GACP,MAAM,OAAO;EACf;EACA,SAAS;GACP,YAAY,OAAO;GACnB,UAAU,OAAO;EACnB;CACF;AACF,CAAC"}

package/es/base-ui/Accordion/type.d.mts

@@ -2,7 +2,7 @@ import { CSSProperties, ComponentProps, ReactNode, Ref } from "react";
 import { Accordion } from "@base-ui/react/accordion";
 //#region src/base-ui/Accordion/type.d.ts
 type AccordionVariant = 'borderless' | 'outlined';
-type AccordionIndicatorPlacement = 'end' | 'start';
+type AccordionIndicatorPlacement = 'end' | 'inline' | 'start';
 interface AccordionClassNames {
   action?: string;
   content?: string;

package/es/base-ui/ContextMenu/ContextMenuHost.mjs

@@ -3,6 +3,7 @@ import { getFloatingCollisionPadding } from "../floating/collisionPadding.mjs";
 import { useIsClient } from "../../hooks/useIsClient.mjs";
 import { useAppElement } from "../../ThemeProvider/AppElementContext.mjs";
 import { preventDefaultAndStopPropagation } from "../../utils/dom.mjs";
+import { MenuVirtualList } from "../virtual/MenuVirtualList.mjs";
 import { useLayerZIndex } from "../zIndex/useLayerZIndex.mjs";
 import { styles } from "../DropdownMenu/sharedStyle.mjs";
 import { registerDevSingleton } from "../../utils/devSingleton.mjs";
@@ -75,7 +76,10 @@ const ContextMenuHost = memo(() => {
 							className: styles.header,
 							children: state.header
 						}),
-						hasSlots ? /* @__PURE__ */ jsx("div", {
+						state.virtual ? /* @__PURE__ */ jsx(MenuVirtualList, {
+							itemSize: state.listItemHeight,
+							children: menuItems
+						}) : hasSlots ? /* @__PURE__ */ jsx("div", {
 							className: styles.slotViewport,
 							children: menuItems
 						}) : menuItems,

package/es/base-ui/ContextMenu/ContextMenuHost.mjs.map

@@ -1 +1 @@
-{"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 { getFloatingCollisionPadding } from '@/base-ui/floating';\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          collisionPadding={getFloatingCollisionPadding()}\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            data-has-footer={state.footer == null ? undefined : ''}\n            data-has-header={state.header == null ? undefined : ''}\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":";;;;;;;;;;;;;;;AAwBA,MAAM,oBAAoB,EAAE,sCAAsC,MAAM;AAExE,MAAa,kBAAkB,WAAW;CACxC,MAAM,WAAW,YAAY;CAC7B,MAAM,aAAa,cAAc;CACjC,MAAM,QAAQ,qBAAqB,WAAW,aAAa,iBAAiB;CAE5E,gBAAgB;EACd,MAAM,MAAM,QAAQ,IAAI,aAAa;EACrC,IAAI,CAAC,YAAY,CAAC,KAAK;EACvB,OAAO,qBAAqB,mBAAmB,SAAS,IAAI;CAC9D,GAAG,CAAC,QAAQ,CAAC;CAEb,gBAAgB;EACd,MAAM,WAAW,UAAqC,kBAAkB,KAAK;EAC7E,OAAO,iBAAiB,eAAe,SAAS,IAAI;EACpD,OAAO,iBAAiB,eAAe,SAAS,IAAI;EACpD,aAAa;GACX,OAAO,oBAAoB,eAAe,SAAS,IAAI;GACvD,OAAO,oBAAoB,eAAe,SAAS,IAAI;EACzD;CACF,GAAG,CAAC,CAAC;CAEL,MAAM,YAAY,cAEd,uBAAuB,MAAM,OAAO,CAAC,GAAG;EACtC,WAAW,MAAM;EACjB,eAAe,MAAM;CACvB,CAAC,GACH;EAAC,MAAM;EAAO,MAAM;EAAW,MAAM;CAAa,CACpD;CACA,MAAM,EAAE,QAAQ,KAAK,SAAS,eAA+B,UAAU;CACvE,MAAM,WAAW,MAAM,UAAU,QAAQ,MAAM,UAAU;CACzD,IAAI,CAAC,UAAU,OAAO;CACtB,IAAI,CAAC,MAAM,QAAQ,MAAM,MAAM,WAAW,GAAG,OAAO;CAEpD,OACE,oBAAC,YAAY,MAAb;EACE,MAAM,MAAM;EACZ,eAAe,SAAS;GACtB,IAAI,MAAM;IACR,oBAAoB,EAAE,KAAK,CAAC;IAC5B;GACF;GACA,iBAAiB;EACnB;EAEA,UAAA,oBAAC,YAAY,QAAb;GAAoB,WAAW;GAC7B,UAAA,oBAAC,YAAY,YAAb;IACE,QAAQ,MAAM,UAAU,KAAA;IACxB,WAAW,OAAO;IAClB,kBAAkB,4BAA4B;IAC9C,KAAK;IACL,YAAY;IACZ,OAAO;KAAE,GAAG;KAAmB;IAAO;IAEtC,UAAA,qBAAC,YAAY,OAAb;KACE,WAAW,GAAG,OAAO,OAAO,YAAY,OAAO,cAAc;KAC7D,mBAAiB,MAAM,UAAU,OAAO,KAAA,IAAY;KACpD,mBAAiB,MAAM,UAAU,OAAO,KAAA,IAAY;KACpD,eAAe;KAJjB,UAAA;MAMG,MAAM,UAAU,OAAO,OAAO,oBAAC,OAAD;OAAK,WAAW,OAAO;OAAS,UAAA,MAAM;MAAY,CAAA;MAChF,WAAW,oBAAC,OAAD;OAAK,WAAW,OAAO;OAAe,UAAA;MAAe,CAAA,IAAI;MACpE,MAAM,UAAU,OAAO,OAAO,oBAAC,OAAD;OAAK,WAAW,OAAO;OAAS,UAAA,MAAM;MAAY,CAAA;KAChE;;GACG,CAAA;EACN,CAAA;CACJ,CAAA;AAEtB,CAAC;AAED,gBAAgB,cAAc"}
+{"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 { getFloatingCollisionPadding } from '@/base-ui/floating';\nimport { MenuVirtualList } from '@/base-ui/virtual';\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          collisionPadding={getFloatingCollisionPadding()}\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            data-has-footer={state.footer == null ? undefined : ''}\n            data-has-header={state.header == null ? undefined : ''}\n            onContextMenu={preventDefaultAndStopPropagation}\n          >\n            {state.header == null ? null : <div className={styles.header}>{state.header}</div>}\n            {state.virtual ? (\n              <MenuVirtualList itemSize={state.listItemHeight}>{menuItems}</MenuVirtualList>\n            ) : hasSlots ? (\n              <div className={styles.slotViewport}>{menuItems}</div>\n            ) : (\n              menuItems\n            )}\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":";;;;;;;;;;;;;;;;AAyBA,MAAM,oBAAoB,EAAE,sCAAsC,MAAM;AAExE,MAAa,kBAAkB,WAAW;CACxC,MAAM,WAAW,YAAY;CAC7B,MAAM,aAAa,cAAc;CACjC,MAAM,QAAQ,qBAAqB,WAAW,aAAa,iBAAiB;CAE5E,gBAAgB;EACd,MAAM,MAAM,QAAQ,IAAI,aAAa;EACrC,IAAI,CAAC,YAAY,CAAC,KAAK;EACvB,OAAO,qBAAqB,mBAAmB,SAAS,IAAI;CAC9D,GAAG,CAAC,QAAQ,CAAC;CAEb,gBAAgB;EACd,MAAM,WAAW,UAAqC,kBAAkB,KAAK;EAC7E,OAAO,iBAAiB,eAAe,SAAS,IAAI;EACpD,OAAO,iBAAiB,eAAe,SAAS,IAAI;EACpD,aAAa;GACX,OAAO,oBAAoB,eAAe,SAAS,IAAI;GACvD,OAAO,oBAAoB,eAAe,SAAS,IAAI;EACzD;CACF,GAAG,CAAC,CAAC;CAEL,MAAM,YAAY,cAEd,uBAAuB,MAAM,OAAO,CAAC,GAAG;EACtC,WAAW,MAAM;EACjB,eAAe,MAAM;CACvB,CAAC,GACH;EAAC,MAAM;EAAO,MAAM;EAAW,MAAM;CAAa,CACpD;CACA,MAAM,EAAE,QAAQ,KAAK,SAAS,eAA+B,UAAU;CACvE,MAAM,WAAW,MAAM,UAAU,QAAQ,MAAM,UAAU;CACzD,IAAI,CAAC,UAAU,OAAO;CACtB,IAAI,CAAC,MAAM,QAAQ,MAAM,MAAM,WAAW,GAAG,OAAO;CAEpD,OACE,oBAAC,YAAY,MAAb;EACE,MAAM,MAAM;EACZ,eAAe,SAAS;GACtB,IAAI,MAAM;IACR,oBAAoB,EAAE,KAAK,CAAC;IAC5B;GACF;GACA,iBAAiB;EACnB;EAEA,UAAA,oBAAC,YAAY,QAAb;GAAoB,WAAW;GAC7B,UAAA,oBAAC,YAAY,YAAb;IACE,QAAQ,MAAM,UAAU,KAAA;IACxB,WAAW,OAAO;IAClB,kBAAkB,4BAA4B;IAC9C,KAAK;IACL,YAAY;IACZ,OAAO;KAAE,GAAG;KAAmB;IAAO;IAEtC,UAAA,qBAAC,YAAY,OAAb;KACE,WAAW,GAAG,OAAO,OAAO,YAAY,OAAO,cAAc;KAC7D,mBAAiB,MAAM,UAAU,OAAO,KAAA,IAAY;KACpD,mBAAiB,MAAM,UAAU,OAAO,KAAA,IAAY;KACpD,eAAe;KAJjB,UAAA;MAMG,MAAM,UAAU,OAAO,OAAO,oBAAC,OAAD;OAAK,WAAW,OAAO;OAAS,UAAA,MAAM;MAAY,CAAA;MAChF,MAAM,UACL,oBAAC,iBAAD;OAAiB,UAAU,MAAM;OAAiB,UAAA;MAA2B,CAAA,IAC3E,WACF,oBAAC,OAAD;OAAK,WAAW,OAAO;OAAe,UAAA;MAAe,CAAA,IAErD;MAED,MAAM,UAAU,OAAO,OAAO,oBAAC,OAAD;OAAK,WAAW,OAAO;OAAS,UAAA,MAAM;MAAY,CAAA;KAChE;;GACG,CAAA;EACN,CAAA;CACJ,CAAA;AAEtB,CAAC;AAED,gBAAgB,cAAc"}

package/es/base-ui/ContextMenu/ContextMenuTrigger.d.mts

@@ -1,7 +1,9 @@
+import { VirtualListProps } from "../virtual/type.mjs";
+import "../virtual/index.mjs";
 import { ContextMenuItem } from "./type.mjs";
 import React, { HTMLAttributes, MouseEvent, ReactNode } from "react";
 //#region src/base-ui/ContextMenu/ContextMenuTrigger.d.ts
-type ContextMenuTriggerProps = {
+type ContextMenuTriggerProps = Pick<VirtualListProps, 'virtual' | 'listItemHeight'> & {
   children: ReactNode;
   /**
    * Footer slot pinned below the scrollable items area, with a divider border.

package/es/base-ui/ContextMenu/ContextMenuTrigger.mjs

@@ -7,7 +7,7 @@ import { mergeProps } from "@base-ui/react/merge-props";
 import clsx from "clsx";
 //#region src/base-ui/ContextMenu/ContextMenuTrigger.tsx
 const styles = { trigger: { display: "contents" } };
-const ContextMenuTrigger = memo(({ children, footer, header, items, onContextMenu, ...rest }) => {
+const ContextMenuTrigger = memo(({ children, footer, header, items, listItemHeight, onContextMenu, virtual, ...rest }) => {
 	const triggerId = useId();
 	const state = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
 	const open = state.open && state.triggerId === triggerId;
@@ -17,7 +17,9 @@ const ContextMenuTrigger = memo(({ children, footer, header, items, onContextMen
 			const resolvedItems = typeof items === "function" ? items() : items;
 			showContextMenu(resolvedItems, {
 				footer,
-				header
+				header,
+				listItemHeight,
+				virtual
 			});
 		}
 		onContextMenu?.(event);
@@ -25,7 +27,9 @@ const ContextMenuTrigger = memo(({ children, footer, header, items, onContextMen
 		items,
 		onContextMenu,
 		footer,
-		header
+		header,
+		listItemHeight,
+		virtual
 	]);
 	const triggerProps = {
 		...rest,

package/es/base-ui/ContextMenu/ContextMenuTrigger.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenuTrigger.mjs","names":[],"sources":["../../../src/base-ui/ContextMenu/ContextMenuTrigger.tsx"],"sourcesContent":["'use client';\n\nimport { mergeProps } from '@base-ui/react/merge-props';\nimport clsx from 'clsx';\nimport React, {\n  cloneElement,\n  type HTMLAttributes,\n  isValidElement,\n  memo,\n  type MouseEvent,\n  type ReactNode,\n  useCallback,\n  useId,\n  useSyncExternalStore,\n} from 'react';\n\nimport { CLASSNAMES } from '@/styles/classNames';\n\nimport { getServerSnapshot, getSnapshot, showContextMenu, subscribe } from './store';\nimport { type ContextMenuItem } from './type';\n\nexport type ContextMenuTriggerProps = {\n  children: ReactNode;\n  /**\n   * Footer slot pinned below the scrollable items area, with a divider border.\n   */\n  footer?: ReactNode;\n  /**\n   * Header slot pinned above the scrollable items area, with a divider border.\n   */\n  header?: ReactNode;\n  /**\n   * Menu items to display. Supports lazy rendering via function.\n   * When provided, context menu will be automatically shown on right-click.\n   */\n  items?: ContextMenuItem[] | (() => ContextMenuItem[]);\n  /**\n   * Custom context menu handler. If `items` is provided, this is optional.\n   */\n  onContextMenu?: (event: MouseEvent<HTMLElement>) => void;\n} & Omit<HTMLAttributes<HTMLElement>, 'onContextMenu' | 'children'>;\n\nconst styles = {\n  trigger: {\n    display: 'contents',\n  },\n};\n\nexport const ContextMenuTrigger = memo<ContextMenuTriggerProps>(\n  ({ children, footer, header, items, onContextMenu, ...rest }) => {\n    const triggerId = useId();\n    const state = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);\n    const open = state.open && state.triggerId === triggerId;\n\n    const handleContextMenu = useCallback(\n      (event: MouseEvent<HTMLElement>) => {\n        if (items) {\n          event.preventDefault();\n          const resolvedItems = typeof items === 'function' ? items() : items;\n          showContextMenu(resolvedItems, { footer, header });\n        }\n        onContextMenu?.(event);\n      },\n      [items, onContextMenu, footer, header],\n    );\n\n    const triggerProps = {\n      ...rest,\n      'aria-expanded': open || undefined,\n      'className': clsx(CLASSNAMES.ContextTrigger, rest.className),\n      'data-contextmenu-trigger': triggerId,\n      'data-popup-open': open ? '' : undefined,\n      'data-state': open ? 'open' : undefined,\n      'onContextMenu': handleContextMenu,\n    };\n\n    if (isValidElement(children) && React.Children.only(children)) {\n      return cloneElement(children, mergeProps(children.props as any, triggerProps));\n    }\n\n    return (\n      <span style={styles.trigger} {...triggerProps}>\n        {children}\n      </span>\n    );\n  },\n);\n\nContextMenuTrigger.displayName = 'ContextMenuTrigger';\n"],"mappings":";;;;;;;;AA0CA,MAAM,SAAS,EACb,SAAS,EACP,SAAS,WACX,EACF;AAEA,MAAa,qBAAqB,MAC/B,EAAE,UAAU,QAAQ,QAAQ,OAAO,eAAe,GAAG,WAAW;CAC/D,MAAM,YAAY,MAAM;CACxB,MAAM,QAAQ,qBAAqB,WAAW,aAAa,iBAAiB;CAC5E,MAAM,OAAO,MAAM,QAAQ,MAAM,cAAc;CAE/C,MAAM,oBAAoB,aACvB,UAAmC;EAClC,IAAI,OAAO;GACT,MAAM,eAAe;GACrB,MAAM,gBAAgB,OAAO,UAAU,aAAa,MAAM,IAAI;GAC9D,gBAAgB,eAAe;IAAE;IAAQ;GAAO,CAAC;EACnD;EACA,gBAAgB,KAAK;CACvB,GACA;EAAC;EAAO;EAAe;EAAQ;CAAM,CACvC;CAEA,MAAM,eAAe;EACnB,GAAG;EACH,iBAAiB,QAAQ,KAAA;EACzB,aAAa,KAAK,WAAW,gBAAgB,KAAK,SAAS;EAC3D,4BAA4B;EAC5B,mBAAmB,OAAO,KAAK,KAAA;EAC/B,cAAc,OAAO,SAAS,KAAA;EAC9B,iBAAiB;CACnB;CAEA,IAAI,eAAe,QAAQ,KAAK,MAAM,SAAS,KAAK,QAAQ,GAC1D,OAAO,aAAa,UAAU,WAAW,SAAS,OAAc,YAAY,CAAC;CAG/E,OACE,oBAAC,QAAD;EAAM,OAAO,OAAO;EAAS,GAAI;EAC9B;CACG,CAAA;AAEV,CACF;AAEA,mBAAmB,cAAc"}
+{"version":3,"file":"ContextMenuTrigger.mjs","names":[],"sources":["../../../src/base-ui/ContextMenu/ContextMenuTrigger.tsx"],"sourcesContent":["'use client';\n\nimport { mergeProps } from '@base-ui/react/merge-props';\nimport clsx from 'clsx';\nimport React, {\n  cloneElement,\n  type HTMLAttributes,\n  isValidElement,\n  memo,\n  type MouseEvent,\n  type ReactNode,\n  useCallback,\n  useId,\n  useSyncExternalStore,\n} from 'react';\n\nimport type { VirtualListProps } from '@/base-ui/virtual';\nimport { CLASSNAMES } from '@/styles/classNames';\n\nimport { getServerSnapshot, getSnapshot, showContextMenu, subscribe } from './store';\nimport { type ContextMenuItem } from './type';\n\nexport type ContextMenuTriggerProps = Pick<VirtualListProps, 'virtual' | 'listItemHeight'> & {\n  children: ReactNode;\n  /**\n   * Footer slot pinned below the scrollable items area, with a divider border.\n   */\n  footer?: ReactNode;\n  /**\n   * Header slot pinned above the scrollable items area, with a divider border.\n   */\n  header?: ReactNode;\n  /**\n   * Menu items to display. Supports lazy rendering via function.\n   * When provided, context menu will be automatically shown on right-click.\n   */\n  items?: ContextMenuItem[] | (() => ContextMenuItem[]);\n  /**\n   * Custom context menu handler. If `items` is provided, this is optional.\n   */\n  onContextMenu?: (event: MouseEvent<HTMLElement>) => void;\n} & Omit<HTMLAttributes<HTMLElement>, 'onContextMenu' | 'children'>;\n\nconst styles = {\n  trigger: {\n    display: 'contents',\n  },\n};\n\nexport const ContextMenuTrigger = memo<ContextMenuTriggerProps>(\n  ({ children, footer, header, items, listItemHeight, onContextMenu, virtual, ...rest }) => {\n    const triggerId = useId();\n    const state = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);\n    const open = state.open && state.triggerId === triggerId;\n\n    const handleContextMenu = useCallback(\n      (event: MouseEvent<HTMLElement>) => {\n        if (items) {\n          event.preventDefault();\n          const resolvedItems = typeof items === 'function' ? items() : items;\n          showContextMenu(resolvedItems, { footer, header, listItemHeight, virtual });\n        }\n        onContextMenu?.(event);\n      },\n      [items, onContextMenu, footer, header, listItemHeight, virtual],\n    );\n\n    const triggerProps = {\n      ...rest,\n      'aria-expanded': open || undefined,\n      'className': clsx(CLASSNAMES.ContextTrigger, rest.className),\n      'data-contextmenu-trigger': triggerId,\n      'data-popup-open': open ? '' : undefined,\n      'data-state': open ? 'open' : undefined,\n      'onContextMenu': handleContextMenu,\n    };\n\n    if (isValidElement(children) && React.Children.only(children)) {\n      return cloneElement(children, mergeProps(children.props as any, triggerProps));\n    }\n\n    return (\n      <span style={styles.trigger} {...triggerProps}>\n        {children}\n      </span>\n    );\n  },\n);\n\nContextMenuTrigger.displayName = 'ContextMenuTrigger';\n"],"mappings":";;;;;;;;AA2CA,MAAM,SAAS,EACb,SAAS,EACP,SAAS,WACX,EACF;AAEA,MAAa,qBAAqB,MAC/B,EAAE,UAAU,QAAQ,QAAQ,OAAO,gBAAgB,eAAe,SAAS,GAAG,WAAW;CACxF,MAAM,YAAY,MAAM;CACxB,MAAM,QAAQ,qBAAqB,WAAW,aAAa,iBAAiB;CAC5E,MAAM,OAAO,MAAM,QAAQ,MAAM,cAAc;CAE/C,MAAM,oBAAoB,aACvB,UAAmC;EAClC,IAAI,OAAO;GACT,MAAM,eAAe;GACrB,MAAM,gBAAgB,OAAO,UAAU,aAAa,MAAM,IAAI;GAC9D,gBAAgB,eAAe;IAAE;IAAQ;IAAQ;IAAgB;GAAQ,CAAC;EAC5E;EACA,gBAAgB,KAAK;CACvB,GACA;EAAC;EAAO;EAAe;EAAQ;EAAQ;EAAgB;CAAO,CAChE;CAEA,MAAM,eAAe;EACnB,GAAG;EACH,iBAAiB,QAAQ,KAAA;EACzB,aAAa,KAAK,WAAW,gBAAgB,KAAK,SAAS;EAC3D,4BAA4B;EAC5B,mBAAmB,OAAO,KAAK,KAAA;EAC/B,cAAc,OAAO,SAAS,KAAA;EAC9B,iBAAiB;CACnB;CAEA,IAAI,eAAe,QAAQ,KAAK,MAAM,SAAS,KAAK,QAAQ,GAC1D,OAAO,aAAa,UAAU,WAAW,SAAS,OAAc,YAAY,CAAC;CAG/E,OACE,oBAAC,QAAD;EAAM,OAAO,OAAO;EAAS,GAAI;EAC9B;CACG,CAAA;AAEV,CACF;AAEA,mBAAmB,cAAc"}

package/es/base-ui/ContextMenu/store.d.mts

@@ -1,3 +1,5 @@
+import { VirtualListProps } from "../virtual/type.mjs";
+import "../virtual/index.mjs";
 import { IconAlign, IconSpaceMode } from "../../Menu/renderUtils.mjs";
 import "../../Menu/index.mjs";
 import { ContextMenuItem } from "./type.mjs";
@@ -5,7 +7,7 @@ import "./renderItems.mjs";
 import { ReactNode } from "react";
 import "@floating-ui/react";
 //#region src/base-ui/ContextMenu/store.d.ts
-interface ShowContextMenuOptions {
+interface ShowContextMenuOptions extends Pick<VirtualListProps, 'virtual' | 'listItemHeight'> {
   footer?: ReactNode;
   header?: ReactNode;
   iconAlign?: IconAlign;

package/es/base-ui/ContextMenu/store.mjs

@@ -80,8 +80,10 @@ const showWebContextMenu = (items, options) => {
 		iconAlign: options?.iconAlign,
 		iconSpaceMode: options?.iconSpaceMode ?? "global",
 		items,
+		listItemHeight: options?.listItemHeight,
 		open: true,
-		triggerId: lastPointer.triggerId ?? null
+		triggerId: lastPointer.triggerId ?? null,
+		virtual: options?.virtual
 	});
 };
 const showContextMenu = (items, options) => {
@@ -107,8 +109,10 @@ const closeWebContextMenu = () => {
 		header: void 0,
 		iconSpaceMode: "global",
 		items: [],
+		listItemHeight: void 0,
 		open: false,
-		triggerId: null
+		triggerId: null,
+		virtual: void 0
 	});
 };
 const closeContextMenu = () => {

package/es/base-ui/ContextMenu/store.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"store.mjs","names":[],"sources":["../../../src/base-ui/ContextMenu/store.ts"],"sourcesContent":["import type { VirtualElement } from '@floating-ui/react';\nimport type { ReactNode } from 'react';\n\nimport type { IconAlign } from '@/Menu';\n\nimport type { IconSpaceMode } from './renderItems';\nimport type { ContextMenuItem } from './type';\n\nexport type ContextMenuState = {\n  anchor: VirtualElement | null;\n  footer?: ReactNode;\n  header?: ReactNode;\n  iconAlign?: IconAlign;\n  iconSpaceMode: IconSpaceMode;\n  items: ContextMenuItem[];\n  open: boolean;\n  triggerId: string | null;\n};\n\nconst emptyState: ContextMenuState = {\n  anchor: null,\n  iconSpaceMode: 'global',\n  items: [],\n  open: false,\n  triggerId: null,\n};\n\nlet contextMenuState: ContextMenuState = emptyState;\nconst listeners = new Set<() => void>();\nconst lastPointer = { ready: false, triggerId: null as string | null, 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  if (event.target instanceof Element) {\n    const trigger = event.target.closest<HTMLElement>('[data-contextmenu-trigger]');\n    lastPointer.triggerId = trigger?.dataset.contextmenuTrigger ?? null;\n  } else {\n    lastPointer.triggerId = null;\n  }\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 interface ShowContextMenuOptions {\n  footer?: ReactNode;\n  header?: ReactNode;\n  iconAlign?: IconAlign;\n  iconSpaceMode?: IconSpaceMode;\n}\n\nexport interface ContextMenuInterceptor {\n  close?: (fallback: () => void) => void;\n  show?: (\n    items: ContextMenuItem[],\n    options: ShowContextMenuOptions | undefined,\n    fallback: () => void,\n  ) => void;\n}\n\nlet interceptor: ContextMenuInterceptor | null = null;\n\n/**\n * Register a global interceptor for every context menu — imperative\n * `showContextMenu`/`closeContextMenu` calls and `ContextMenuTrigger` alike.\n * The interceptor may render the menu through another system (e.g. a native\n * OS menu) or invoke `fallback()` to show the default web menu. Pass `null`\n * to restore the default behavior.\n */\nexport const setContextMenuInterceptor = (next: ContextMenuInterceptor | null) => {\n  interceptor = next;\n};\n\nconst showWebContextMenu = (items: ContextMenuItem[], options?: ShowContextMenuOptions) => {\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    footer: options?.footer,\n    header: options?.header,\n    iconAlign: options?.iconAlign,\n    iconSpaceMode: options?.iconSpaceMode ?? 'global',\n    items,\n    open: true,\n    triggerId: lastPointer.triggerId ?? null,\n  });\n};\n\nexport const showContextMenu = (items: ContextMenuItem[], options?: ShowContextMenuOptions) => {\n  if (typeof window === 'undefined') return;\n\n  if (interceptor?.show) {\n    interceptor.show(items, options, () => showWebContextMenu(items, options));\n    return;\n  }\n\n  showWebContextMenu(items, options);\n};\n\n/**\n * Update menu items while keeping current anchor/position.\n * Useful for interactive menu items (e.g. checkbox) to avoid re-positioning.\n */\nexport const updateContextMenuItems = (items: ContextMenuItem[]) => {\n  if (typeof window === 'undefined') return;\n  setContextMenuState({ items });\n};\n\nconst closeWebContextMenu = () => {\n  setContextMenuState({\n    anchor: null,\n    footer: undefined,\n    header: undefined,\n    iconSpaceMode: 'global',\n    items: [],\n    open: false,\n    triggerId: null,\n  });\n};\n\nexport const closeContextMenu = () => {\n  if (interceptor?.close) {\n    interceptor.close(closeWebContextMenu);\n    return;\n  }\n\n  closeWebContextMenu();\n};\n"],"mappings":";AAmBA,MAAM,aAA+B;CACnC,QAAQ;CACR,eAAe;CACf,OAAO,CAAC;CACR,MAAM;CACN,WAAW;AACb;AAEA,IAAI,mBAAqC;AACzC,MAAM,4BAAY,IAAI,IAAgB;AACtC,MAAM,cAAc;CAAE,OAAO;CAAO,WAAW;CAAuB,GAAG;CAAG,GAAG;AAAE;AAEjF,MAAM,eAAe;CACnB,UAAU,SAAS,aAAa,SAAS,CAAC;AAC5C;AAEA,MAAa,aAAa,aAAyB;CACjD,UAAU,IAAI,QAAQ;CACtB,aAAa,UAAU,OAAO,QAAQ;AACxC;AAEA,MAAa,oBAAoB;AACjC,MAAa,0BAA0B;AAEvC,MAAa,qBAAqB,UAAqC;CACrE,YAAY,IAAI,MAAM;CACtB,YAAY,IAAI,MAAM;CACtB,YAAY,QAAQ;CACpB,IAAI,MAAM,kBAAkB,SAAS;EACnC,MAAM,UAAU,MAAM,OAAO,QAAqB,4BAA4B;EAC9E,YAAY,YAAY,SAAS,QAAQ,sBAAsB;CACjE,OACE,YAAY,YAAY;AAE5B;AAEA,MAAM,wBAAwB,WAAqD;CACjF,gBAAgB,OAAO,aAAa,cAAc,KAAA,IAAY,SAAS;CACvE,8BACG;EACC,QAAQ,MAAM;EACd,QAAQ;EACR,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,KAAA;EACd,KAAK,MAAM;EACX,OAAO;EACP,GAAG,MAAM;EACT,GAAG,MAAM;CACX;AACJ;AAEA,MAAa,uBAAuB,SAAoC;CACtE,mBAAmB;EAAE,GAAG;EAAkB,GAAG;CAAK;CAClD,OAAO;AACT;AAkBA,IAAI,cAA6C;;;;;;;;AASjD,MAAa,6BAA6B,SAAwC;CAChF,cAAc;AAChB;AAEA,MAAM,sBAAsB,OAA0B,YAAqC;CACzF,MAAM,gBAAgB;EAAE,GAAG,OAAO,aAAa;EAAG,GAAG,OAAO,cAAc;CAAE;CAC5E,MAAM,QAAQ,YAAY,QAAQ;EAAE,GAAG,YAAY;EAAG,GAAG,YAAY;CAAE,IAAI;CAE3E,oBAAoB;EAClB,QAAQ,qBAAqB,KAAK;EAClC,QAAQ,SAAS;EACjB,QAAQ,SAAS;EACjB,WAAW,SAAS;EACpB,eAAe,SAAS,iBAAiB;EACzC;EACA,MAAM;EACN,WAAW,YAAY,aAAa;CACtC,CAAC;AACH;AAEA,MAAa,mBAAmB,OAA0B,YAAqC;CAC7F,IAAI,OAAO,WAAW,aAAa;CAEnC,IAAI,aAAa,MAAM;EACrB,YAAY,KAAK,OAAO,eAAe,mBAAmB,OAAO,OAAO,CAAC;EACzE;CACF;CAEA,mBAAmB,OAAO,OAAO;AACnC;;;;;AAMA,MAAa,0BAA0B,UAA6B;CAClE,IAAI,OAAO,WAAW,aAAa;CACnC,oBAAoB,EAAE,MAAM,CAAC;AAC/B;AAEA,MAAM,4BAA4B;CAChC,oBAAoB;EAClB,QAAQ;EACR,QAAQ,KAAA;EACR,QAAQ,KAAA;EACR,eAAe;EACf,OAAO,CAAC;EACR,MAAM;EACN,WAAW;CACb,CAAC;AACH;AAEA,MAAa,yBAAyB;CACpC,IAAI,aAAa,OAAO;EACtB,YAAY,MAAM,mBAAmB;EACrC;CACF;CAEA,oBAAoB;AACtB"}
+{"version":3,"file":"store.mjs","names":[],"sources":["../../../src/base-ui/ContextMenu/store.ts"],"sourcesContent":["import type { VirtualElement } from '@floating-ui/react';\nimport type { ReactNode } from 'react';\n\nimport type { VirtualListProps } from '@/base-ui/virtual';\nimport type { IconAlign } from '@/Menu';\n\nimport type { IconSpaceMode } from './renderItems';\nimport type { ContextMenuItem } from './type';\n\nexport type ContextMenuState = Pick<VirtualListProps, 'virtual' | 'listItemHeight'> & {\n  anchor: VirtualElement | null;\n  footer?: ReactNode;\n  header?: ReactNode;\n  iconAlign?: IconAlign;\n  iconSpaceMode: IconSpaceMode;\n  items: ContextMenuItem[];\n  open: boolean;\n  triggerId: string | null;\n};\n\nconst emptyState: ContextMenuState = {\n  anchor: null,\n  iconSpaceMode: 'global',\n  items: [],\n  open: false,\n  triggerId: null,\n};\n\nlet contextMenuState: ContextMenuState = emptyState;\nconst listeners = new Set<() => void>();\nconst lastPointer = { ready: false, triggerId: null as string | null, 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  if (event.target instanceof Element) {\n    const trigger = event.target.closest<HTMLElement>('[data-contextmenu-trigger]');\n    lastPointer.triggerId = trigger?.dataset.contextmenuTrigger ?? null;\n  } else {\n    lastPointer.triggerId = null;\n  }\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 interface ShowContextMenuOptions extends Pick<\n  VirtualListProps,\n  'virtual' | 'listItemHeight'\n> {\n  footer?: ReactNode;\n  header?: ReactNode;\n  iconAlign?: IconAlign;\n  iconSpaceMode?: IconSpaceMode;\n}\n\nexport interface ContextMenuInterceptor {\n  close?: (fallback: () => void) => void;\n  show?: (\n    items: ContextMenuItem[],\n    options: ShowContextMenuOptions | undefined,\n    fallback: () => void,\n  ) => void;\n}\n\nlet interceptor: ContextMenuInterceptor | null = null;\n\n/**\n * Register a global interceptor for every context menu — imperative\n * `showContextMenu`/`closeContextMenu` calls and `ContextMenuTrigger` alike.\n * The interceptor may render the menu through another system (e.g. a native\n * OS menu) or invoke `fallback()` to show the default web menu. Pass `null`\n * to restore the default behavior.\n */\nexport const setContextMenuInterceptor = (next: ContextMenuInterceptor | null) => {\n  interceptor = next;\n};\n\nconst showWebContextMenu = (items: ContextMenuItem[], options?: ShowContextMenuOptions) => {\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    footer: options?.footer,\n    header: options?.header,\n    iconAlign: options?.iconAlign,\n    iconSpaceMode: options?.iconSpaceMode ?? 'global',\n    items,\n    listItemHeight: options?.listItemHeight,\n    open: true,\n    triggerId: lastPointer.triggerId ?? null,\n    virtual: options?.virtual,\n  });\n};\n\nexport const showContextMenu = (items: ContextMenuItem[], options?: ShowContextMenuOptions) => {\n  if (typeof window === 'undefined') return;\n\n  if (interceptor?.show) {\n    interceptor.show(items, options, () => showWebContextMenu(items, options));\n    return;\n  }\n\n  showWebContextMenu(items, options);\n};\n\n/**\n * Update menu items while keeping current anchor/position.\n * Useful for interactive menu items (e.g. checkbox) to avoid re-positioning.\n */\nexport const updateContextMenuItems = (items: ContextMenuItem[]) => {\n  if (typeof window === 'undefined') return;\n  setContextMenuState({ items });\n};\n\nconst closeWebContextMenu = () => {\n  setContextMenuState({\n    anchor: null,\n    footer: undefined,\n    header: undefined,\n    iconSpaceMode: 'global',\n    items: [],\n    listItemHeight: undefined,\n    open: false,\n    triggerId: null,\n    virtual: undefined,\n  });\n};\n\nexport const closeContextMenu = () => {\n  if (interceptor?.close) {\n    interceptor.close(closeWebContextMenu);\n    return;\n  }\n\n  closeWebContextMenu();\n};\n"],"mappings":";AAoBA,MAAM,aAA+B;CACnC,QAAQ;CACR,eAAe;CACf,OAAO,CAAC;CACR,MAAM;CACN,WAAW;AACb;AAEA,IAAI,mBAAqC;AACzC,MAAM,4BAAY,IAAI,IAAgB;AACtC,MAAM,cAAc;CAAE,OAAO;CAAO,WAAW;CAAuB,GAAG;CAAG,GAAG;AAAE;AAEjF,MAAM,eAAe;CACnB,UAAU,SAAS,aAAa,SAAS,CAAC;AAC5C;AAEA,MAAa,aAAa,aAAyB;CACjD,UAAU,IAAI,QAAQ;CACtB,aAAa,UAAU,OAAO,QAAQ;AACxC;AAEA,MAAa,oBAAoB;AACjC,MAAa,0BAA0B;AAEvC,MAAa,qBAAqB,UAAqC;CACrE,YAAY,IAAI,MAAM;CACtB,YAAY,IAAI,MAAM;CACtB,YAAY,QAAQ;CACpB,IAAI,MAAM,kBAAkB,SAAS;EACnC,MAAM,UAAU,MAAM,OAAO,QAAqB,4BAA4B;EAC9E,YAAY,YAAY,SAAS,QAAQ,sBAAsB;CACjE,OACE,YAAY,YAAY;AAE5B;AAEA,MAAM,wBAAwB,WAAqD;CACjF,gBAAgB,OAAO,aAAa,cAAc,KAAA,IAAY,SAAS;CACvE,8BACG;EACC,QAAQ,MAAM;EACd,QAAQ;EACR,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,KAAA;EACd,KAAK,MAAM;EACX,OAAO;EACP,GAAG,MAAM;EACT,GAAG,MAAM;CACX;AACJ;AAEA,MAAa,uBAAuB,SAAoC;CACtE,mBAAmB;EAAE,GAAG;EAAkB,GAAG;CAAK;CAClD,OAAO;AACT;AAqBA,IAAI,cAA6C;;;;;;;;AASjD,MAAa,6BAA6B,SAAwC;CAChF,cAAc;AAChB;AAEA,MAAM,sBAAsB,OAA0B,YAAqC;CACzF,MAAM,gBAAgB;EAAE,GAAG,OAAO,aAAa;EAAG,GAAG,OAAO,cAAc;CAAE;CAC5E,MAAM,QAAQ,YAAY,QAAQ;EAAE,GAAG,YAAY;EAAG,GAAG,YAAY;CAAE,IAAI;CAE3E,oBAAoB;EAClB,QAAQ,qBAAqB,KAAK;EAClC,QAAQ,SAAS;EACjB,QAAQ,SAAS;EACjB,WAAW,SAAS;EACpB,eAAe,SAAS,iBAAiB;EACzC;EACA,gBAAgB,SAAS;EACzB,MAAM;EACN,WAAW,YAAY,aAAa;EACpC,SAAS,SAAS;CACpB,CAAC;AACH;AAEA,MAAa,mBAAmB,OAA0B,YAAqC;CAC7F,IAAI,OAAO,WAAW,aAAa;CAEnC,IAAI,aAAa,MAAM;EACrB,YAAY,KAAK,OAAO,eAAe,mBAAmB,OAAO,OAAO,CAAC;EACzE;CACF;CAEA,mBAAmB,OAAO,OAAO;AACnC;;;;;AAMA,MAAa,0BAA0B,UAA6B;CAClE,IAAI,OAAO,WAAW,aAAa;CACnC,oBAAoB,EAAE,MAAM,CAAC;AAC/B;AAEA,MAAM,4BAA4B;CAChC,oBAAoB;EAClB,QAAQ;EACR,QAAQ,KAAA;EACR,QAAQ,KAAA;EACR,eAAe;EACf,OAAO,CAAC;EACR,gBAAgB,KAAA;EAChB,MAAM;EACN,WAAW;EACX,SAAS,KAAA;CACX,CAAC;AACH;AAEA,MAAa,yBAAyB;CACpC,IAAI,aAAa,OAAO;EACtB,YAAY,MAAM,mBAAmB;EACrC;CACF;CAEA,oBAAoB;AACtB"}

package/es/base-ui/DropdownMenu/DropdownMenu.mjs

@@ -9,7 +9,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { cx } from "antd-style";
 import { Menu } from "@base-ui/react/menu";
 //#region src/base-ui/DropdownMenu/DropdownMenu.tsx
-const DropdownMenu = memo(({ children, defaultOpen, footer, header, iconAlign, iconSpaceMode, items, nativeButton, onOpenChange, onOpenChangeComplete, open, placement = "bottomLeft", popupProps, portalProps, positionerProps, trigger = "click", triggerProps, ...rest }) => {
+const DropdownMenu = memo(({ children, defaultOpen, footer, header, iconAlign, iconSpaceMode, items, listItemHeight, nativeButton, onOpenChange, onOpenChangeComplete, open, placement = "bottomLeft", popupProps, portalProps, positionerProps, trigger = "click", triggerProps, virtual, ...rest }) => {
 	const [uncontrolledOpen, setUncontrolledOpen] = useState(Boolean(defaultOpen));
 	const { openOnHover } = useMemo(() => parseTrigger(trigger), [trigger]);
 	const resolvedOpenOnHover = triggerProps?.openOnHover ?? openOnHover;
@@ -78,7 +78,11 @@ const DropdownMenu = memo(({ children, defaultOpen, footer, header, iconAlign, i
 					className: hasSlots ? cx(styles.popupWithSlots, popupProps?.className) : popupProps?.className,
 					children: [
 						header == null ? null : /* @__PURE__ */ jsx(DropdownMenuHeader, { children: header }),
-						hasSlots ? /* @__PURE__ */ jsx(DropdownMenuScrollViewport, { children: menuItems }) : menuItems,
+						hasSlots || virtual ? /* @__PURE__ */ jsx(DropdownMenuScrollViewport, {
+							listItemHeight,
+							virtual,
+							children: menuItems
+						}) : menuItems,
 						footer == null ? null : /* @__PURE__ */ jsx(DropdownMenuFooter, { children: footer })
 					]
 				})

package/es/base-ui/DropdownMenu/DropdownMenu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownMenu.mjs","names":[],"sources":["../../../src/base-ui/DropdownMenu/DropdownMenu.tsx"],"sourcesContent":["'use client';\n\nimport { Menu } from '@base-ui/react/menu';\nimport { cx } from 'antd-style';\nimport { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { useNativeButton } from '@/hooks/useNativeButton';\nimport { parseTrigger } from '@/utils/parseTrigger';\n\nimport {\n  DropdownMenuFooter,\n  DropdownMenuHeader,\n  DropdownMenuPopup,\n  DropdownMenuPortal,\n  DropdownMenuPositioner,\n  DropdownMenuScrollViewport,\n  DropdownMenuTrigger,\n} from './atoms';\nimport { renderDropdownMenuItems } from './renderItems';\nimport { styles } from './sharedStyle';\nimport type { DropdownMenuProps } from './type';\n\nconst DropdownMenu = memo<DropdownMenuProps>(\n  ({\n    children,\n    defaultOpen,\n    footer,\n    header,\n    iconAlign,\n    iconSpaceMode,\n    items,\n    nativeButton,\n    onOpenChange,\n    onOpenChangeComplete,\n    open,\n    placement = 'bottomLeft',\n    popupProps,\n    portalProps,\n    positionerProps,\n    trigger = 'click',\n    triggerProps,\n    ...rest\n  }) => {\n    const [uncontrolledOpen, setUncontrolledOpen] = useState(Boolean(defaultOpen));\n\n    const { openOnHover } = useMemo(() => parseTrigger(trigger), [trigger]);\n    const resolvedOpenOnHover = (triggerProps as any)?.openOnHover ?? openOnHover;\n\n    useEffect(() => {\n      if (open === undefined) return;\n      setUncontrolledOpen(open);\n    }, [open]);\n\n    const handleOpenChange = useCallback(\n      (nextOpen: boolean, details: Parameters<NonNullable<typeof onOpenChange>>[1]) => {\n        onOpenChange?.(nextOpen, details);\n        if (open === undefined) {\n          setUncontrolledOpen(nextOpen);\n        }\n      },\n      [onOpenChange, open],\n    );\n\n    const menuItemsRef = useRef<ReturnType<typeof renderDropdownMenuItems> | null>(null);\n    const isOpen = open ?? uncontrolledOpen;\n    const menuItems = useMemo(() => {\n      if (isOpen) {\n        const resolvedItems = typeof items === 'function' ? items() : items;\n        const renderedItems = renderDropdownMenuItems(resolvedItems, [], {\n          iconAlign,\n          iconSpaceMode,\n        });\n        menuItemsRef.current = renderedItems;\n        return renderedItems;\n      }\n      return menuItemsRef.current;\n    }, [isOpen, items, iconAlign, iconSpaceMode]);\n    const handleOpenChangeComplete = useCallback(\n      (nextOpen: boolean) => {\n        onOpenChangeComplete?.(nextOpen);\n        if (!nextOpen) {\n          menuItemsRef.current = null;\n        }\n      },\n      [onOpenChangeComplete],\n    );\n    const { container: portalContainer, ...restPortalProps } = (portalProps ?? {}) as any;\n\n    const { resolvedNativeButton } = useNativeButton({\n      children,\n      nativeButton,\n      triggerNativeButton: triggerProps?.nativeButton,\n    });\n\n    const hasSlots = header != null || footer != null;\n\n    const triggerElement = (\n      <DropdownMenuTrigger\n        {...triggerProps}\n        nativeButton={resolvedNativeButton}\n        openOnHover={resolvedOpenOnHover}\n      >\n        {children}\n      </DropdownMenuTrigger>\n    );\n\n    return (\n      <Menu.Root\n        {...rest}\n        defaultOpen={defaultOpen}\n        modal={false}\n        open={open}\n        onOpenChange={handleOpenChange}\n        onOpenChangeComplete={handleOpenChangeComplete}\n      >\n        {triggerElement}\n        <DropdownMenuPortal container={portalContainer} {...restPortalProps}>\n          <DropdownMenuPositioner\n            {...positionerProps}\n            hoverTrigger={resolvedOpenOnHover}\n            placement={placement}\n          >\n            <DropdownMenuPopup\n              {...popupProps}\n              data-has-footer={footer == null ? undefined : ''}\n              data-has-header={header == null ? undefined : ''}\n              className={\n                hasSlots\n                  ? (cx(styles.popupWithSlots, popupProps?.className as string) as any)\n                  : popupProps?.className\n              }\n            >\n              {header == null ? null : <DropdownMenuHeader>{header}</DropdownMenuHeader>}\n              {hasSlots ? (\n                <DropdownMenuScrollViewport>{menuItems}</DropdownMenuScrollViewport>\n              ) : (\n                menuItems\n              )}\n              {footer == null ? null : <DropdownMenuFooter>{footer}</DropdownMenuFooter>}\n            </DropdownMenuPopup>\n          </DropdownMenuPositioner>\n        </DropdownMenuPortal>\n      </Menu.Root>\n    );\n  },\n);\n\nDropdownMenu.displayName = 'DropdownMenuV2';\n\nexport default DropdownMenu;\n"],"mappings":";;;;;;;;;;;AAsBA,MAAM,eAAe,MAClB,EACC,UACA,aACA,QACA,QACA,WACA,eACA,OACA,cACA,cACA,sBACA,MACA,YAAY,cACZ,YACA,aACA,iBACA,UAAU,SACV,cACA,GAAG,WACC;CACJ,MAAM,CAAC,kBAAkB,uBAAuB,SAAS,QAAQ,WAAW,CAAC;CAE7E,MAAM,EAAE,gBAAgB,cAAc,aAAa,OAAO,GAAG,CAAC,OAAO,CAAC;CACtE,MAAM,sBAAuB,cAAsB,eAAe;CAElE,gBAAgB;EACd,IAAI,SAAS,KAAA,GAAW;EACxB,oBAAoB,IAAI;CAC1B,GAAG,CAAC,IAAI,CAAC;CAET,MAAM,mBAAmB,aACtB,UAAmB,YAA6D;EAC/E,eAAe,UAAU,OAAO;EAChC,IAAI,SAAS,KAAA,GACX,oBAAoB,QAAQ;CAEhC,GACA,CAAC,cAAc,IAAI,CACrB;CAEA,MAAM,eAAe,OAA0D,IAAI;CACnF,MAAM,SAAS,QAAQ;CACvB,MAAM,YAAY,cAAc;EAC9B,IAAI,QAAQ;GACV,MAAM,gBAAgB,OAAO,UAAU,aAAa,MAAM,IAAI;GAC9D,MAAM,gBAAgB,wBAAwB,eAAe,CAAC,GAAG;IAC/D;IACA;GACF,CAAC;GACD,aAAa,UAAU;GACvB,OAAO;EACT;EACA,OAAO,aAAa;CACtB,GAAG;EAAC;EAAQ;EAAO;EAAW;CAAa,CAAC;CAC5C,MAAM,2BAA2B,aAC9B,aAAsB;EACrB,uBAAuB,QAAQ;EAC/B,IAAI,CAAC,UACH,aAAa,UAAU;CAE3B,GACA,CAAC,oBAAoB,CACvB;CACA,MAAM,EAAE,WAAW,iBAAiB,GAAG,oBAAqB,eAAe,CAAC;CAE5E,MAAM,EAAE,yBAAyB,gBAAgB;EAC/C;EACA;EACA,qBAAqB,cAAc;CACrC,CAAC;CAED,MAAM,WAAW,UAAU,QAAQ,UAAU;CAE7C,MAAM,iBACJ,oBAAC,qBAAD;EACE,GAAI;EACJ,cAAc;EACd,aAAa;EAEZ;CACkB,CAAA;CAGvB,OACE,qBAAC,KAAK,MAAN;EACE,GAAI;EACS;EACb,OAAO;EACD;EACN,cAAc;EACd,sBAAsB;EANxB,UAAA,CAQG,gBACD,oBAAC,oBAAD;GAAoB,WAAW;GAAiB,GAAI;GAClD,UAAA,oBAAC,wBAAD;IACE,GAAI;IACJ,cAAc;IACH;IAEX,UAAA,qBAAC,mBAAD;KACE,GAAI;KACJ,mBAAiB,UAAU,OAAO,KAAA,IAAY;KAC9C,mBAAiB,UAAU,OAAO,KAAA,IAAY;KAC9C,WACE,WACK,GAAG,OAAO,gBAAgB,YAAY,SAAmB,IAC1D,YAAY;KAPpB,UAAA;MAUG,UAAU,OAAO,OAAO,oBAAC,oBAAD,EAAA,UAAqB,OAA2B,CAAA;MACxE,WACC,oBAAC,4BAAD,EAAA,UAA6B,UAAsC,CAAA,IAEnE;MAED,UAAU,OAAO,OAAO,oBAAC,oBAAD,EAAA,UAAqB,OAA2B,CAAA;KACxD;;GACG,CAAA;EACN,CAAA,CACX;;AAEf,CACF;AAEA,aAAa,cAAc"}
+{"version":3,"file":"DropdownMenu.mjs","names":[],"sources":["../../../src/base-ui/DropdownMenu/DropdownMenu.tsx"],"sourcesContent":["'use client';\n\nimport { Menu } from '@base-ui/react/menu';\nimport { cx } from 'antd-style';\nimport { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { useNativeButton } from '@/hooks/useNativeButton';\nimport { parseTrigger } from '@/utils/parseTrigger';\n\nimport {\n  DropdownMenuFooter,\n  DropdownMenuHeader,\n  DropdownMenuPopup,\n  DropdownMenuPortal,\n  DropdownMenuPositioner,\n  DropdownMenuScrollViewport,\n  DropdownMenuTrigger,\n} from './atoms';\nimport { renderDropdownMenuItems } from './renderItems';\nimport { styles } from './sharedStyle';\nimport type { DropdownMenuProps } from './type';\n\nconst DropdownMenu = memo<DropdownMenuProps>(\n  ({\n    children,\n    defaultOpen,\n    footer,\n    header,\n    iconAlign,\n    iconSpaceMode,\n    items,\n    listItemHeight,\n    nativeButton,\n    onOpenChange,\n    onOpenChangeComplete,\n    open,\n    placement = 'bottomLeft',\n    popupProps,\n    portalProps,\n    positionerProps,\n    trigger = 'click',\n    triggerProps,\n    virtual,\n    ...rest\n  }) => {\n    const [uncontrolledOpen, setUncontrolledOpen] = useState(Boolean(defaultOpen));\n\n    const { openOnHover } = useMemo(() => parseTrigger(trigger), [trigger]);\n    const resolvedOpenOnHover = (triggerProps as any)?.openOnHover ?? openOnHover;\n\n    useEffect(() => {\n      if (open === undefined) return;\n      setUncontrolledOpen(open);\n    }, [open]);\n\n    const handleOpenChange = useCallback(\n      (nextOpen: boolean, details: Parameters<NonNullable<typeof onOpenChange>>[1]) => {\n        onOpenChange?.(nextOpen, details);\n        if (open === undefined) {\n          setUncontrolledOpen(nextOpen);\n        }\n      },\n      [onOpenChange, open],\n    );\n\n    const menuItemsRef = useRef<ReturnType<typeof renderDropdownMenuItems> | null>(null);\n    const isOpen = open ?? uncontrolledOpen;\n    const menuItems = useMemo(() => {\n      if (isOpen) {\n        const resolvedItems = typeof items === 'function' ? items() : items;\n        const renderedItems = renderDropdownMenuItems(resolvedItems, [], {\n          iconAlign,\n          iconSpaceMode,\n        });\n        menuItemsRef.current = renderedItems;\n        return renderedItems;\n      }\n      return menuItemsRef.current;\n    }, [isOpen, items, iconAlign, iconSpaceMode]);\n    const handleOpenChangeComplete = useCallback(\n      (nextOpen: boolean) => {\n        onOpenChangeComplete?.(nextOpen);\n        if (!nextOpen) {\n          menuItemsRef.current = null;\n        }\n      },\n      [onOpenChangeComplete],\n    );\n    const { container: portalContainer, ...restPortalProps } = (portalProps ?? {}) as any;\n\n    const { resolvedNativeButton } = useNativeButton({\n      children,\n      nativeButton,\n      triggerNativeButton: triggerProps?.nativeButton,\n    });\n\n    const hasSlots = header != null || footer != null;\n\n    const triggerElement = (\n      <DropdownMenuTrigger\n        {...triggerProps}\n        nativeButton={resolvedNativeButton}\n        openOnHover={resolvedOpenOnHover}\n      >\n        {children}\n      </DropdownMenuTrigger>\n    );\n\n    return (\n      <Menu.Root\n        {...rest}\n        defaultOpen={defaultOpen}\n        modal={false}\n        open={open}\n        onOpenChange={handleOpenChange}\n        onOpenChangeComplete={handleOpenChangeComplete}\n      >\n        {triggerElement}\n        <DropdownMenuPortal container={portalContainer} {...restPortalProps}>\n          <DropdownMenuPositioner\n            {...positionerProps}\n            hoverTrigger={resolvedOpenOnHover}\n            placement={placement}\n          >\n            <DropdownMenuPopup\n              {...popupProps}\n              data-has-footer={footer == null ? undefined : ''}\n              data-has-header={header == null ? undefined : ''}\n              className={\n                hasSlots\n                  ? (cx(styles.popupWithSlots, popupProps?.className as string) as any)\n                  : popupProps?.className\n              }\n            >\n              {header == null ? null : <DropdownMenuHeader>{header}</DropdownMenuHeader>}\n              {hasSlots || virtual ? (\n                <DropdownMenuScrollViewport listItemHeight={listItemHeight} virtual={virtual}>\n                  {menuItems}\n                </DropdownMenuScrollViewport>\n              ) : (\n                menuItems\n              )}\n              {footer == null ? null : <DropdownMenuFooter>{footer}</DropdownMenuFooter>}\n            </DropdownMenuPopup>\n          </DropdownMenuPositioner>\n        </DropdownMenuPortal>\n      </Menu.Root>\n    );\n  },\n);\n\nDropdownMenu.displayName = 'DropdownMenuV2';\n\nexport default DropdownMenu;\n"],"mappings":";;;;;;;;;;;AAsBA,MAAM,eAAe,MAClB,EACC,UACA,aACA,QACA,QACA,WACA,eACA,OACA,gBACA,cACA,cACA,sBACA,MACA,YAAY,cACZ,YACA,aACA,iBACA,UAAU,SACV,cACA,SACA,GAAG,WACC;CACJ,MAAM,CAAC,kBAAkB,uBAAuB,SAAS,QAAQ,WAAW,CAAC;CAE7E,MAAM,EAAE,gBAAgB,cAAc,aAAa,OAAO,GAAG,CAAC,OAAO,CAAC;CACtE,MAAM,sBAAuB,cAAsB,eAAe;CAElE,gBAAgB;EACd,IAAI,SAAS,KAAA,GAAW;EACxB,oBAAoB,IAAI;CAC1B,GAAG,CAAC,IAAI,CAAC;CAET,MAAM,mBAAmB,aACtB,UAAmB,YAA6D;EAC/E,eAAe,UAAU,OAAO;EAChC,IAAI,SAAS,KAAA,GACX,oBAAoB,QAAQ;CAEhC,GACA,CAAC,cAAc,IAAI,CACrB;CAEA,MAAM,eAAe,OAA0D,IAAI;CACnF,MAAM,SAAS,QAAQ;CACvB,MAAM,YAAY,cAAc;EAC9B,IAAI,QAAQ;GACV,MAAM,gBAAgB,OAAO,UAAU,aAAa,MAAM,IAAI;GAC9D,MAAM,gBAAgB,wBAAwB,eAAe,CAAC,GAAG;IAC/D;IACA;GACF,CAAC;GACD,aAAa,UAAU;GACvB,OAAO;EACT;EACA,OAAO,aAAa;CACtB,GAAG;EAAC;EAAQ;EAAO;EAAW;CAAa,CAAC;CAC5C,MAAM,2BAA2B,aAC9B,aAAsB;EACrB,uBAAuB,QAAQ;EAC/B,IAAI,CAAC,UACH,aAAa,UAAU;CAE3B,GACA,CAAC,oBAAoB,CACvB;CACA,MAAM,EAAE,WAAW,iBAAiB,GAAG,oBAAqB,eAAe,CAAC;CAE5E,MAAM,EAAE,yBAAyB,gBAAgB;EAC/C;EACA;EACA,qBAAqB,cAAc;CACrC,CAAC;CAED,MAAM,WAAW,UAAU,QAAQ,UAAU;CAE7C,MAAM,iBACJ,oBAAC,qBAAD;EACE,GAAI;EACJ,cAAc;EACd,aAAa;EAEZ;CACkB,CAAA;CAGvB,OACE,qBAAC,KAAK,MAAN;EACE,GAAI;EACS;EACb,OAAO;EACD;EACN,cAAc;EACd,sBAAsB;EANxB,UAAA,CAQG,gBACD,oBAAC,oBAAD;GAAoB,WAAW;GAAiB,GAAI;GAClD,UAAA,oBAAC,wBAAD;IACE,GAAI;IACJ,cAAc;IACH;IAEX,UAAA,qBAAC,mBAAD;KACE,GAAI;KACJ,mBAAiB,UAAU,OAAO,KAAA,IAAY;KAC9C,mBAAiB,UAAU,OAAO,KAAA,IAAY;KAC9C,WACE,WACK,GAAG,OAAO,gBAAgB,YAAY,SAAmB,IAC1D,YAAY;KAPpB,UAAA;MAUG,UAAU,OAAO,OAAO,oBAAC,oBAAD,EAAA,UAAqB,OAA2B,CAAA;MACxE,YAAY,UACX,oBAAC,4BAAD;OAA4C;OAAyB;OAClE,UAAA;MACyB,CAAA,IAE5B;MAED,UAAU,OAAO,OAAO,oBAAC,oBAAD,EAAA,UAAqB,OAA2B,CAAA;KACxD;;GACG,CAAA;EACN,CAAA,CACX;;AAEf,CACF;AAEA,aAAa,cAAc"}

package/es/base-ui/DropdownMenu/atoms.d.mts

@@ -1,3 +1,5 @@
+import { VirtualListProps } from "../virtual/type.mjs";
+import "../virtual/index.mjs";
 import { DropdownMenuPlacement } from "./type.mjs";
 import React from "react";
 import { Menu } from "@base-ui/react/menu";
@@ -45,9 +47,9 @@ declare const DropdownMenuFooter: {
   ({ className, ...rest }: DropdownMenuFooterProps): React.JSX.Element;
   displayName: string;
 };
-type DropdownMenuScrollViewportProps = React.HTMLAttributes<HTMLDivElement>;
+type DropdownMenuScrollViewportProps = React.HTMLAttributes<HTMLDivElement> & VirtualListProps;
 declare const DropdownMenuScrollViewport: {
-  ({ className, ...rest }: DropdownMenuScrollViewportProps): React.JSX.Element;
+  ({ children, className, getItemLabel, keepMounted, listItemHeight, virtual, ...rest }: DropdownMenuScrollViewportProps): React.JSX.Element;
   displayName: string;
 };
 type DropdownMenuItemProps = React.ComponentProps<typeof Menu.Item> & {

package/es/base-ui/DropdownMenu/atoms.mjs

@@ -6,6 +6,7 @@ import { useAppElement } from "../../ThemeProvider/AppElementContext.mjs";
 import { CLASSNAMES } from "../../styles/classNames.mjs";
 import { placementMap } from "../../utils/placement.mjs";
 import Switch from "../Switch/Switch.mjs";
+import { MenuVirtualList } from "../virtual/MenuVirtualList.mjs";
 import { useLayerZIndex } from "../zIndex/useLayerZIndex.mjs";
 import { styles } from "./sharedStyle.mjs";
 import { cloneElement, isValidElement, useCallback, useState } from "react";
@@ -111,21 +112,32 @@ DropdownMenuPopup.displayName = "DropdownMenuPopup";
 const DropdownMenuHeader = ({ className, ...rest }) => {
 	return /* @__PURE__ */ jsx("div", {
 		...rest,
-		className: cx(styles.header, className)
+		className: cx(styles.header, className),
+		"data-slot": "header"
 	});
 };
 DropdownMenuHeader.displayName = "DropdownMenuHeader";
 const DropdownMenuFooter = ({ className, ...rest }) => {
 	return /* @__PURE__ */ jsx("div", {
 		...rest,
-		className: cx(styles.footer, className)
+		className: cx(styles.footer, className),
+		"data-slot": "footer"
 	});
 };
 DropdownMenuFooter.displayName = "DropdownMenuFooter";
-const DropdownMenuScrollViewport = ({ className, ...rest }) => {
-	return /* @__PURE__ */ jsx("div", {
+const DropdownMenuScrollViewport = ({ children, className, getItemLabel, keepMounted, listItemHeight, virtual, ...rest }) => {
+	if (!virtual) return /* @__PURE__ */ jsx("div", {
 		...rest,
-		className: cx(styles.slotViewport, className)
+		className: cx(styles.slotViewport, className),
+		children
+	});
+	return /* @__PURE__ */ jsx(MenuVirtualList, {
+		...rest,
+		className,
+		getItemLabel,
+		itemSize: listItemHeight,
+		keepMounted,
+		children
 	});
 };
 DropdownMenuScrollViewport.displayName = "DropdownMenuScrollViewport";

package/es/base-ui/DropdownMenu/atoms.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"atoms.mjs","names":[],"sources":["../../../src/base-ui/DropdownMenu/atoms.tsx"],"sourcesContent":["'use client';\n\nimport { Menu } from '@base-ui/react/menu';\nimport { mergeProps } from '@base-ui/react/merge-props';\nimport { cx } from 'antd-style';\nimport clsx from 'clsx';\nimport type React from 'react';\nimport { cloneElement, isValidElement, useCallback, useState } from 'react';\nimport { mergeRefs, useMergeRefs } from 'react-merge-refs';\n\nimport { getFloatingCollisionPadding } from '@/base-ui/floating';\nimport Switch from '@/base-ui/Switch';\nimport { FloatingLayerProvider } from '@/hooks/useFloatingLayer';\nimport { useNativeButton } from '@/hooks/useNativeButton';\nimport { CLASSNAMES } from '@/styles/classNames';\nimport { useAppElement } from '@/ThemeProvider';\nimport { placementMap } from '@/utils/placement';\n\nimport { useLayerZIndex } from '../zIndex';\nimport { styles } from './sharedStyle';\nimport { type DropdownMenuPlacement } from './type';\n\nexport const DropdownMenuRoot: typeof Menu.Root = (props) => <Menu.Root modal={false} {...props} />;\nexport const DropdownMenuSubmenuRoot = Menu.SubmenuRoot;\nexport const DropdownMenuCheckboxItemIndicator = Menu.CheckboxItemIndicator;\n\nconst mergeStateClassName = <TState,>(\n  base: string,\n  className: string | ((state: TState) => string | undefined) | undefined,\n) => {\n  if (typeof className === 'function') return (state: TState) => cx(base, className(state));\n  return cx(base, className);\n};\n\nexport type DropdownMenuTriggerProps = Omit<\n  React.ComponentPropsWithRef<typeof Menu.Trigger>,\n  'children' | 'render'\n> & {\n  children: React.ReactNode;\n};\n\nexport const DropdownMenuTrigger = ({\n  children,\n  className,\n  nativeButton,\n  ref: refProp,\n  ...rest\n}: DropdownMenuTriggerProps) => {\n  const { isNativeButtonTriggerElement, resolvedNativeButton } = useNativeButton({\n    children,\n    nativeButton,\n  });\n\n  const renderer = (props: any) => {\n    // Base UI's trigger props include `type=\"button\"` by default.\n    // If we render into a non-<button> element, that prop is invalid and can warn.\n    const resolvedProps = (() => {\n      if (isNativeButtonTriggerElement) return props as any;\n      // eslint-disable-next-line unused-imports/no-unused-vars\n      const { type, ...restProps } = props as any;\n      return restProps;\n    })();\n\n    const mergedProps = mergeProps((children as any).props, resolvedProps);\n    return cloneElement(children as any, {\n      ...mergedProps,\n      className: clsx(CLASSNAMES.DropdownMenuTrigger, className, mergedProps.className),\n      ref: mergeRefs([(children as any).ref, (props as any).ref, refProp]),\n    });\n  };\n\n  if (isValidElement(children)) {\n    return <Menu.Trigger {...rest} nativeButton={resolvedNativeButton} render={renderer as any} />;\n  }\n\n  return (\n    <Menu.Trigger\n      {...rest}\n      className={clsx(CLASSNAMES.DropdownMenuTrigger, className)}\n      nativeButton={resolvedNativeButton}\n      ref={refProp as any}\n    >\n      {children}\n    </Menu.Trigger>\n  );\n};\n\nDropdownMenuTrigger.displayName = 'DropdownMenuTrigger';\n\nexport type DropdownMenuPortalProps = React.ComponentProps<typeof Menu.Portal> & {\n  /**\n   * When `container` is not provided, it uses a shared container created by `usePortalContainer`.\n   */\n  container?: HTMLElement | null;\n};\n\nexport const DropdownMenuPortal = ({ container, ...rest }: DropdownMenuPortalProps) => {\n  const appElement = useAppElement();\n  return <Menu.Portal container={container ?? appElement ?? undefined} {...rest} />;\n};\n\nDropdownMenuPortal.displayName = 'DropdownMenuPortal';\n\nexport type DropdownMenuPositionerProps = React.ComponentProps<typeof Menu.Positioner> & {\n  hoverTrigger?: boolean;\n  placement?: DropdownMenuPlacement;\n};\n\nexport const DropdownMenuPositioner = ({\n  className,\n  collisionPadding,\n  placement,\n  hoverTrigger,\n  align,\n  side,\n  sideOffset,\n  children,\n  style,\n  ...rest\n}: DropdownMenuPositionerProps) => {\n  const placementConfig = placement ? placementMap[placement] : undefined;\n  const [positionerNode, setPositionerNode] = useState<HTMLDivElement | null>(null);\n\n  const explicitZIndex =\n    typeof style !== 'function' && style?.zIndex != null && typeof style.zIndex === 'number'\n      ? style.zIndex\n      : undefined;\n  const { zIndex, ref: zRef } = useLayerZIndex<HTMLDivElement>('floating', explicitZIndex);\n  const composedRef = useMergeRefs([setPositionerNode, zRef]);\n\n  const resolvedStyle =\n    typeof style === 'function'\n      ? (state: any) => ({ zIndex, ...style(state) })\n      : { zIndex, ...style };\n\n  return (\n    <Menu.Positioner\n      {...rest}\n      align={align ?? placementConfig?.align}\n      className={mergeStateClassName(styles.positioner, className as any) as any}\n      collisionPadding={collisionPadding ?? getFloatingCollisionPadding()}\n      data-hover-trigger={hoverTrigger || undefined}\n      data-placement={placement}\n      ref={composedRef as any}\n      side={side ?? placementConfig?.side}\n      sideOffset={sideOffset ?? (placementConfig ? 6 : undefined)}\n      style={resolvedStyle}\n    >\n      <FloatingLayerProvider value={positionerNode}>{children}</FloatingLayerProvider>\n    </Menu.Positioner>\n  );\n};\n\nDropdownMenuPositioner.displayName = 'DropdownMenuPositioner';\n\nexport type DropdownMenuPopupProps = React.ComponentProps<typeof Menu.Popup>;\n\nexport const DropdownMenuPopup = ({ className, ...rest }: DropdownMenuPopupProps) => {\n  return (\n    <Menu.Popup {...rest} className={mergeStateClassName(styles.popup, className as any) as any} />\n  );\n};\n\nDropdownMenuPopup.displayName = 'DropdownMenuPopup';\n\nexport type DropdownMenuHeaderProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport const DropdownMenuHeader = ({ className, ...rest }: DropdownMenuHeaderProps) => {\n  return <div {...rest} className={cx(styles.header, className)} />;\n};\n\nDropdownMenuHeader.displayName = 'DropdownMenuHeader';\n\nexport type DropdownMenuFooterProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport const DropdownMenuFooter = ({ className, ...rest }: DropdownMenuFooterProps) => {\n  return <div {...rest} className={cx(styles.footer, className)} />;\n};\n\nDropdownMenuFooter.displayName = 'DropdownMenuFooter';\n\nexport type DropdownMenuScrollViewportProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport const DropdownMenuScrollViewport = ({\n  className,\n  ...rest\n}: DropdownMenuScrollViewportProps) => {\n  return <div {...rest} className={cx(styles.slotViewport, className)} />;\n};\n\nDropdownMenuScrollViewport.displayName = 'DropdownMenuScrollViewport';\n\nexport type DropdownMenuItemProps = React.ComponentProps<typeof Menu.Item> & { danger?: boolean };\n\nexport const DropdownMenuItem = ({ className, danger, ...rest }: DropdownMenuItemProps) => {\n  return (\n    <Menu.Item\n      {...rest}\n      className={(state) =>\n        cx(\n          styles.item,\n          danger && styles.danger,\n          typeof className === 'function' ? className(state) : className,\n        )\n      }\n    />\n  );\n};\n\nDropdownMenuItem.displayName = 'DropdownMenuItem';\n\nexport type DropdownMenuCheckboxItemProps = React.ComponentProps<typeof Menu.CheckboxItem> & {\n  danger?: boolean;\n};\n\nexport const DropdownMenuCheckboxItemPrimitive = ({\n  className,\n  danger,\n  ...rest\n}: DropdownMenuCheckboxItemProps) => {\n  return (\n    <Menu.CheckboxItem\n      {...rest}\n      className={(state) =>\n        cx(\n          styles.item,\n          danger && styles.danger,\n          typeof className === 'function' ? className(state) : className,\n        )\n      }\n    />\n  );\n};\n\nDropdownMenuCheckboxItemPrimitive.displayName = 'DropdownMenuCheckboxItemPrimitive';\n\nexport type DropdownMenuSeparatorProps = React.ComponentProps<typeof Menu.Separator>;\n\nexport const DropdownMenuSeparator = ({ className, ...rest }: DropdownMenuSeparatorProps) => {\n  return (\n    <Menu.Separator\n      {...rest}\n      className={(state) =>\n        cx(styles.separator, typeof className === 'function' ? className(state) : className)\n      }\n    />\n  );\n};\n\nDropdownMenuSeparator.displayName = 'DropdownMenuSeparator';\n\nexport const DropdownMenuGroup = Menu.Group;\n\nexport type DropdownMenuGroupLabelProps = React.ComponentProps<typeof Menu.GroupLabel>;\n\nexport const DropdownMenuGroupLabel = ({ className, ...rest }: DropdownMenuGroupLabelProps) => {\n  return (\n    <Menu.GroupLabel\n      {...rest}\n      className={(state) =>\n        cx(styles.groupLabel, typeof className === 'function' ? className(state) : className)\n      }\n    />\n  );\n};\n\nDropdownMenuGroupLabel.displayName = 'DropdownMenuGroupLabel';\n\nexport type DropdownMenuSubmenuTriggerProps = React.ComponentProps<typeof Menu.SubmenuTrigger> & {\n  danger?: boolean;\n};\n\nexport const DropdownMenuSubmenuTrigger = ({\n  className,\n  danger,\n  ...rest\n}: DropdownMenuSubmenuTriggerProps) => {\n  return (\n    <Menu.SubmenuTrigger\n      {...rest}\n      className={(state) =>\n        cx(\n          styles.item,\n          danger && styles.danger,\n          typeof className === 'function' ? className(state) : className,\n        )\n      }\n    />\n  );\n};\n\nDropdownMenuSubmenuTrigger.displayName = 'DropdownMenuSubmenuTrigger';\n\nexport type DropdownMenuItemContentProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport const DropdownMenuItemContent = ({ className, ...rest }: DropdownMenuItemContentProps) => {\n  return <div {...rest} className={cx(styles.itemContent, className)} />;\n};\n\nDropdownMenuItemContent.displayName = 'DropdownMenuItemContent';\n\nexport type DropdownMenuItemIconProps = React.HTMLAttributes<HTMLSpanElement>;\n\nexport const DropdownMenuItemIcon = ({ className, ...rest }: DropdownMenuItemIconProps) => {\n  return <span {...rest} className={cx(styles.icon, className)} />;\n};\n\nDropdownMenuItemIcon.displayName = 'DropdownMenuItemIcon';\n\nexport type DropdownMenuItemLabelGroupProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport const DropdownMenuItemLabelGroup = ({\n  className,\n  ...rest\n}: DropdownMenuItemLabelGroupProps) => {\n  return <div {...rest} className={cx(styles.labelGroup, className)} />;\n};\n\nDropdownMenuItemLabelGroup.displayName = 'DropdownMenuItemLabelGroup';\n\nexport type DropdownMenuItemLabelProps = React.HTMLAttributes<HTMLSpanElement>;\n\nexport const DropdownMenuItemLabel = ({ className, ...rest }: DropdownMenuItemLabelProps) => {\n  return <span {...rest} className={cx(styles.label, className)} />;\n};\n\nDropdownMenuItemLabel.displayName = 'DropdownMenuItemLabel';\n\nexport type DropdownMenuItemDescProps = React.HTMLAttributes<HTMLSpanElement>;\n\nexport const DropdownMenuItemDesc = ({ className, ...rest }: DropdownMenuItemDescProps) => {\n  return <span {...rest} className={cx(styles.desc, className)} />;\n};\n\nDropdownMenuItemDesc.displayName = 'DropdownMenuItemDesc';\n\nexport type DropdownMenuItemExtraProps = React.HTMLAttributes<HTMLSpanElement>;\n\nexport const DropdownMenuItemExtra = ({ className, ...rest }: DropdownMenuItemExtraProps) => {\n  return <span {...rest} className={cx(styles.extra, className)} />;\n};\n\nDropdownMenuItemExtra.displayName = 'DropdownMenuItemExtra';\n\nexport type DropdownMenuSubmenuArrowProps = React.HTMLAttributes<HTMLSpanElement>;\n\nexport const DropdownMenuSubmenuArrow = ({ className, ...rest }: DropdownMenuSubmenuArrowProps) => {\n  return <span {...rest} className={cx(styles.submenuArrow, className)} />;\n};\n\nDropdownMenuSubmenuArrow.displayName = 'DropdownMenuSubmenuArrow';\n\nexport type DropdownMenuSwitchItemProps = Omit<\n  React.ComponentProps<typeof Menu.Item>,\n  'onClick'\n> & {\n  checked?: boolean;\n  closeOnClick?: boolean;\n  danger?: boolean;\n  defaultChecked?: boolean;\n  onCheckedChange?: (checked: boolean) => void;\n};\n\nexport const DropdownMenuSwitchItem = ({\n  checked: checkedProp,\n  className,\n  closeOnClick = false,\n  danger,\n  defaultChecked,\n  disabled,\n  onCheckedChange,\n  children,\n  ...rest\n}: DropdownMenuSwitchItemProps) => {\n  const [internalChecked, setInternalChecked] = useState(defaultChecked ?? false);\n  const isControlled = checkedProp !== undefined;\n  const checked = isControlled ? checkedProp : internalChecked;\n\n  const handleCheckedChange = useCallback(\n    (newChecked: boolean) => {\n      if (!isControlled) {\n        setInternalChecked(newChecked);\n      }\n      onCheckedChange?.(newChecked);\n    },\n    [isControlled, onCheckedChange],\n  );\n\n  return (\n    <Menu.Item\n      {...rest}\n      closeOnClick={closeOnClick}\n      disabled={disabled}\n      className={(state) =>\n        cx(\n          styles.item,\n          danger && styles.danger,\n          typeof className === 'function' ? className(state) : className,\n        )\n      }\n      onClick={(e) => {\n        e.preventDefault();\n        if (!disabled) {\n          handleCheckedChange(!checked);\n        }\n      }}\n    >\n      {children}\n      <span\n        style={{ display: 'inline-flex', marginInlineStart: 16 }}\n        onFocus={(e) => e.stopPropagation()}\n      >\n        <Switch\n          checked={checked}\n          disabled={disabled}\n          size=\"small\"\n          tabIndex={-1}\n          onChange={handleCheckedChange}\n          onClick={(_, e) => e.stopPropagation()}\n        />\n      </span>\n    </Menu.Item>\n  );\n};\n\nDropdownMenuSwitchItem.displayName = 'DropdownMenuSwitchItem';\n"],"mappings":"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"}
+{"version":3,"file":"atoms.mjs","names":[],"sources":["../../../src/base-ui/DropdownMenu/atoms.tsx"],"sourcesContent":["'use client';\n\nimport { Menu } from '@base-ui/react/menu';\nimport { mergeProps } from '@base-ui/react/merge-props';\nimport { cx } from 'antd-style';\nimport clsx from 'clsx';\nimport type React from 'react';\nimport { cloneElement, isValidElement, useCallback, useState } from 'react';\nimport { mergeRefs, useMergeRefs } from 'react-merge-refs';\n\nimport { getFloatingCollisionPadding } from '@/base-ui/floating';\nimport Switch from '@/base-ui/Switch';\nimport { MenuVirtualList, type VirtualListProps } from '@/base-ui/virtual';\nimport { FloatingLayerProvider } from '@/hooks/useFloatingLayer';\nimport { useNativeButton } from '@/hooks/useNativeButton';\nimport { CLASSNAMES } from '@/styles/classNames';\nimport { useAppElement } from '@/ThemeProvider';\nimport { placementMap } from '@/utils/placement';\n\nimport { useLayerZIndex } from '../zIndex';\nimport { styles } from './sharedStyle';\nimport { type DropdownMenuPlacement } from './type';\n\nexport const DropdownMenuRoot: typeof Menu.Root = (props) => <Menu.Root modal={false} {...props} />;\nexport const DropdownMenuSubmenuRoot = Menu.SubmenuRoot;\nexport const DropdownMenuCheckboxItemIndicator = Menu.CheckboxItemIndicator;\n\nconst mergeStateClassName = <TState,>(\n  base: string,\n  className: string | ((state: TState) => string | undefined) | undefined,\n) => {\n  if (typeof className === 'function') return (state: TState) => cx(base, className(state));\n  return cx(base, className);\n};\n\nexport type DropdownMenuTriggerProps = Omit<\n  React.ComponentPropsWithRef<typeof Menu.Trigger>,\n  'children' | 'render'\n> & {\n  children: React.ReactNode;\n};\n\nexport const DropdownMenuTrigger = ({\n  children,\n  className,\n  nativeButton,\n  ref: refProp,\n  ...rest\n}: DropdownMenuTriggerProps) => {\n  const { isNativeButtonTriggerElement, resolvedNativeButton } = useNativeButton({\n    children,\n    nativeButton,\n  });\n\n  const renderer = (props: any) => {\n    // Base UI's trigger props include `type=\"button\"` by default.\n    // If we render into a non-<button> element, that prop is invalid and can warn.\n    const resolvedProps = (() => {\n      if (isNativeButtonTriggerElement) return props as any;\n      // eslint-disable-next-line unused-imports/no-unused-vars\n      const { type, ...restProps } = props as any;\n      return restProps;\n    })();\n\n    const mergedProps = mergeProps((children as any).props, resolvedProps);\n    return cloneElement(children as any, {\n      ...mergedProps,\n      className: clsx(CLASSNAMES.DropdownMenuTrigger, className, mergedProps.className),\n      ref: mergeRefs([(children as any).ref, (props as any).ref, refProp]),\n    });\n  };\n\n  if (isValidElement(children)) {\n    return <Menu.Trigger {...rest} nativeButton={resolvedNativeButton} render={renderer as any} />;\n  }\n\n  return (\n    <Menu.Trigger\n      {...rest}\n      className={clsx(CLASSNAMES.DropdownMenuTrigger, className)}\n      nativeButton={resolvedNativeButton}\n      ref={refProp as any}\n    >\n      {children}\n    </Menu.Trigger>\n  );\n};\n\nDropdownMenuTrigger.displayName = 'DropdownMenuTrigger';\n\nexport type DropdownMenuPortalProps = React.ComponentProps<typeof Menu.Portal> & {\n  /**\n   * When `container` is not provided, it uses a shared container created by `usePortalContainer`.\n   */\n  container?: HTMLElement | null;\n};\n\nexport const DropdownMenuPortal = ({ container, ...rest }: DropdownMenuPortalProps) => {\n  const appElement = useAppElement();\n  return <Menu.Portal container={container ?? appElement ?? undefined} {...rest} />;\n};\n\nDropdownMenuPortal.displayName = 'DropdownMenuPortal';\n\nexport type DropdownMenuPositionerProps = React.ComponentProps<typeof Menu.Positioner> & {\n  hoverTrigger?: boolean;\n  placement?: DropdownMenuPlacement;\n};\n\nexport const DropdownMenuPositioner = ({\n  className,\n  collisionPadding,\n  placement,\n  hoverTrigger,\n  align,\n  side,\n  sideOffset,\n  children,\n  style,\n  ...rest\n}: DropdownMenuPositionerProps) => {\n  const placementConfig = placement ? placementMap[placement] : undefined;\n  const [positionerNode, setPositionerNode] = useState<HTMLDivElement | null>(null);\n\n  const explicitZIndex =\n    typeof style !== 'function' && style?.zIndex != null && typeof style.zIndex === 'number'\n      ? style.zIndex\n      : undefined;\n  const { zIndex, ref: zRef } = useLayerZIndex<HTMLDivElement>('floating', explicitZIndex);\n  const composedRef = useMergeRefs([setPositionerNode, zRef]);\n\n  const resolvedStyle =\n    typeof style === 'function'\n      ? (state: any) => ({ zIndex, ...style(state) })\n      : { zIndex, ...style };\n\n  return (\n    <Menu.Positioner\n      {...rest}\n      align={align ?? placementConfig?.align}\n      className={mergeStateClassName(styles.positioner, className as any) as any}\n      collisionPadding={collisionPadding ?? getFloatingCollisionPadding()}\n      data-hover-trigger={hoverTrigger || undefined}\n      data-placement={placement}\n      ref={composedRef as any}\n      side={side ?? placementConfig?.side}\n      sideOffset={sideOffset ?? (placementConfig ? 6 : undefined)}\n      style={resolvedStyle}\n    >\n      <FloatingLayerProvider value={positionerNode}>{children}</FloatingLayerProvider>\n    </Menu.Positioner>\n  );\n};\n\nDropdownMenuPositioner.displayName = 'DropdownMenuPositioner';\n\nexport type DropdownMenuPopupProps = React.ComponentProps<typeof Menu.Popup>;\n\nexport const DropdownMenuPopup = ({ className, ...rest }: DropdownMenuPopupProps) => {\n  return (\n    <Menu.Popup {...rest} className={mergeStateClassName(styles.popup, className as any) as any} />\n  );\n};\n\nDropdownMenuPopup.displayName = 'DropdownMenuPopup';\n\nexport type DropdownMenuHeaderProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport const DropdownMenuHeader = ({ className, ...rest }: DropdownMenuHeaderProps) => {\n  return <div {...rest} className={cx(styles.header, className)} data-slot=\"header\" />;\n};\n\nDropdownMenuHeader.displayName = 'DropdownMenuHeader';\n\nexport type DropdownMenuFooterProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport const DropdownMenuFooter = ({ className, ...rest }: DropdownMenuFooterProps) => {\n  return <div {...rest} className={cx(styles.footer, className)} data-slot=\"footer\" />;\n};\n\nDropdownMenuFooter.displayName = 'DropdownMenuFooter';\n\nexport type DropdownMenuScrollViewportProps = React.HTMLAttributes<HTMLDivElement> &\n  VirtualListProps;\n\nexport const DropdownMenuScrollViewport = ({\n  children,\n  className,\n  getItemLabel,\n  keepMounted,\n  listItemHeight,\n  virtual,\n  ...rest\n}: DropdownMenuScrollViewportProps) => {\n  if (!virtual) {\n    return (\n      <div {...rest} className={cx(styles.slotViewport, className)}>\n        {children}\n      </div>\n    );\n  }\n\n  return (\n    <MenuVirtualList\n      {...rest}\n      className={className}\n      getItemLabel={getItemLabel}\n      itemSize={listItemHeight}\n      keepMounted={keepMounted}\n    >\n      {children}\n    </MenuVirtualList>\n  );\n};\n\nDropdownMenuScrollViewport.displayName = 'DropdownMenuScrollViewport';\n\nexport type DropdownMenuItemProps = React.ComponentProps<typeof Menu.Item> & { danger?: boolean };\n\nexport const DropdownMenuItem = ({ className, danger, ...rest }: DropdownMenuItemProps) => {\n  return (\n    <Menu.Item\n      {...rest}\n      className={(state) =>\n        cx(\n          styles.item,\n          danger && styles.danger,\n          typeof className === 'function' ? className(state) : className,\n        )\n      }\n    />\n  );\n};\n\nDropdownMenuItem.displayName = 'DropdownMenuItem';\n\nexport type DropdownMenuCheckboxItemProps = React.ComponentProps<typeof Menu.CheckboxItem> & {\n  danger?: boolean;\n};\n\nexport const DropdownMenuCheckboxItemPrimitive = ({\n  className,\n  danger,\n  ...rest\n}: DropdownMenuCheckboxItemProps) => {\n  return (\n    <Menu.CheckboxItem\n      {...rest}\n      className={(state) =>\n        cx(\n          styles.item,\n          danger && styles.danger,\n          typeof className === 'function' ? className(state) : className,\n        )\n      }\n    />\n  );\n};\n\nDropdownMenuCheckboxItemPrimitive.displayName = 'DropdownMenuCheckboxItemPrimitive';\n\nexport type DropdownMenuSeparatorProps = React.ComponentProps<typeof Menu.Separator>;\n\nexport const DropdownMenuSeparator = ({ className, ...rest }: DropdownMenuSeparatorProps) => {\n  return (\n    <Menu.Separator\n      {...rest}\n      className={(state) =>\n        cx(styles.separator, typeof className === 'function' ? className(state) : className)\n      }\n    />\n  );\n};\n\nDropdownMenuSeparator.displayName = 'DropdownMenuSeparator';\n\nexport const DropdownMenuGroup = Menu.Group;\n\nexport type DropdownMenuGroupLabelProps = React.ComponentProps<typeof Menu.GroupLabel>;\n\nexport const DropdownMenuGroupLabel = ({ className, ...rest }: DropdownMenuGroupLabelProps) => {\n  return (\n    <Menu.GroupLabel\n      {...rest}\n      className={(state) =>\n        cx(styles.groupLabel, typeof className === 'function' ? className(state) : className)\n      }\n    />\n  );\n};\n\nDropdownMenuGroupLabel.displayName = 'DropdownMenuGroupLabel';\n\nexport type DropdownMenuSubmenuTriggerProps = React.ComponentProps<typeof Menu.SubmenuTrigger> & {\n  danger?: boolean;\n};\n\nexport const DropdownMenuSubmenuTrigger = ({\n  className,\n  danger,\n  ...rest\n}: DropdownMenuSubmenuTriggerProps) => {\n  return (\n    <Menu.SubmenuTrigger\n      {...rest}\n      className={(state) =>\n        cx(\n          styles.item,\n          danger && styles.danger,\n          typeof className === 'function' ? className(state) : className,\n        )\n      }\n    />\n  );\n};\n\nDropdownMenuSubmenuTrigger.displayName = 'DropdownMenuSubmenuTrigger';\n\nexport type DropdownMenuItemContentProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport const DropdownMenuItemContent = ({ className, ...rest }: DropdownMenuItemContentProps) => {\n  return <div {...rest} className={cx(styles.itemContent, className)} />;\n};\n\nDropdownMenuItemContent.displayName = 'DropdownMenuItemContent';\n\nexport type DropdownMenuItemIconProps = React.HTMLAttributes<HTMLSpanElement>;\n\nexport const DropdownMenuItemIcon = ({ className, ...rest }: DropdownMenuItemIconProps) => {\n  return <span {...rest} className={cx(styles.icon, className)} />;\n};\n\nDropdownMenuItemIcon.displayName = 'DropdownMenuItemIcon';\n\nexport type DropdownMenuItemLabelGroupProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport const DropdownMenuItemLabelGroup = ({\n  className,\n  ...rest\n}: DropdownMenuItemLabelGroupProps) => {\n  return <div {...rest} className={cx(styles.labelGroup, className)} />;\n};\n\nDropdownMenuItemLabelGroup.displayName = 'DropdownMenuItemLabelGroup';\n\nexport type DropdownMenuItemLabelProps = React.HTMLAttributes<HTMLSpanElement>;\n\nexport const DropdownMenuItemLabel = ({ className, ...rest }: DropdownMenuItemLabelProps) => {\n  return <span {...rest} className={cx(styles.label, className)} />;\n};\n\nDropdownMenuItemLabel.displayName = 'DropdownMenuItemLabel';\n\nexport type DropdownMenuItemDescProps = React.HTMLAttributes<HTMLSpanElement>;\n\nexport const DropdownMenuItemDesc = ({ className, ...rest }: DropdownMenuItemDescProps) => {\n  return <span {...rest} className={cx(styles.desc, className)} />;\n};\n\nDropdownMenuItemDesc.displayName = 'DropdownMenuItemDesc';\n\nexport type DropdownMenuItemExtraProps = React.HTMLAttributes<HTMLSpanElement>;\n\nexport const DropdownMenuItemExtra = ({ className, ...rest }: DropdownMenuItemExtraProps) => {\n  return <span {...rest} className={cx(styles.extra, className)} />;\n};\n\nDropdownMenuItemExtra.displayName = 'DropdownMenuItemExtra';\n\nexport type DropdownMenuSubmenuArrowProps = React.HTMLAttributes<HTMLSpanElement>;\n\nexport const DropdownMenuSubmenuArrow = ({ className, ...rest }: DropdownMenuSubmenuArrowProps) => {\n  return <span {...rest} className={cx(styles.submenuArrow, className)} />;\n};\n\nDropdownMenuSubmenuArrow.displayName = 'DropdownMenuSubmenuArrow';\n\nexport type DropdownMenuSwitchItemProps = Omit<\n  React.ComponentProps<typeof Menu.Item>,\n  'onClick'\n> & {\n  checked?: boolean;\n  closeOnClick?: boolean;\n  danger?: boolean;\n  defaultChecked?: boolean;\n  onCheckedChange?: (checked: boolean) => void;\n};\n\nexport const DropdownMenuSwitchItem = ({\n  checked: checkedProp,\n  className,\n  closeOnClick = false,\n  danger,\n  defaultChecked,\n  disabled,\n  onCheckedChange,\n  children,\n  ...rest\n}: DropdownMenuSwitchItemProps) => {\n  const [internalChecked, setInternalChecked] = useState(defaultChecked ?? false);\n  const isControlled = checkedProp !== undefined;\n  const checked = isControlled ? checkedProp : internalChecked;\n\n  const handleCheckedChange = useCallback(\n    (newChecked: boolean) => {\n      if (!isControlled) {\n        setInternalChecked(newChecked);\n      }\n      onCheckedChange?.(newChecked);\n    },\n    [isControlled, onCheckedChange],\n  );\n\n  return (\n    <Menu.Item\n      {...rest}\n      closeOnClick={closeOnClick}\n      disabled={disabled}\n      className={(state) =>\n        cx(\n          styles.item,\n          danger && styles.danger,\n          typeof className === 'function' ? className(state) : className,\n        )\n      }\n      onClick={(e) => {\n        e.preventDefault();\n        if (!disabled) {\n          handleCheckedChange(!checked);\n        }\n      }}\n    >\n      {children}\n      <span\n        style={{ display: 'inline-flex', marginInlineStart: 16 }}\n        onFocus={(e) => e.stopPropagation()}\n      >\n        <Switch\n          checked={checked}\n          disabled={disabled}\n          size=\"small\"\n          tabIndex={-1}\n          onChange={handleCheckedChange}\n          onClick={(_, e) => e.stopPropagation()}\n        />\n      </span>\n    </Menu.Item>\n  );\n};\n\nDropdownMenuSwitchItem.displayName = 'DropdownMenuSwitchItem';\n"],"mappings":"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"}