@lobehub/ui 5.64.2 → 6.0.0-beta.10

package/es/DropdownMenu/atoms.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"atoms.mjs","names":["clsx"],"sources":["../../src/DropdownMenu/atoms.tsx"],"sourcesContent":["'use client';\n\nimport { Menu } from '@base-ui/react/menu';\nimport { mergeProps } from '@base-ui/react/merge-props';\nimport * as stylex from '@stylexjs/stylex';\nimport clsx from 'clsx';\nimport type React from 'react';\nimport { cloneElement, isValidElement, useCallback, useState } from 'react';\n\nimport { useAppElement } from '@/ConfigProvider/AppElementContext';\nimport { FloatingLayerProvider } from '@/hooks/useFloatingLayer';\nimport { useNativeButton } from '@/hooks/useNativeButton';\nimport { getFloatingCollisionPadding } from '@/internal/floating';\nimport { MenuVirtualList, type VirtualListProps } from '@/internal/virtual';\nimport { CLASSNAMES } from '@/styles/classNames';\nimport { type styleProps } from '@/styles/stylex/props';\nimport Switch from '@/Switch';\nimport { mergeRefs, useMergeRefs } from '@/utils/mergeRefs';\nimport { placementMap } from '@/utils/placement';\n\nimport { useLayerZIndex } from '../internal/zIndex';\nimport { menuClassNames, menuStyles } from './style';\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\ntype XStyle = Parameters<typeof styleProps>[0];\n\nconst mergeStateClassName = <TState,>(\n  base: string,\n  className: string | ((state: TState) => string | undefined) | undefined,\n) => {\n  if (typeof className === 'function') return (state: TState) => clsx(base, className(state));\n  return clsx(base, className);\n};\n\nconst sx = (styles: XStyle, stableClassName?: string) =>\n  clsx(stylex.props(styles).className, stableClassName);\n\nconst itemClassName = (danger: boolean | undefined) =>\n  sx([menuStyles.item, danger && menuStyles.danger]);\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      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      className={\n        mergeStateClassName(\n          sx(menuStyles.positioner, menuClassNames.positioner),\n          className as any,\n        ) as any\n      }\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 DropdownMenuPopupImpl = ({\n  className,\n  xstyle,\n  ...rest\n}: DropdownMenuPopupProps & { xstyle?: XStyle }) => {\n  return (\n    <Menu.Popup\n      {...rest}\n      className={\n        mergeStateClassName(\n          sx([menuStyles.popup, xstyle], menuClassNames.popup),\n          className as any,\n        ) as any\n      }\n    />\n  );\n};\n\nexport const DropdownMenuPopup = (props: DropdownMenuPopupProps) => (\n  <DropdownMenuPopupImpl {...props} />\n);\n\nDropdownMenuPopup.displayName = 'DropdownMenuPopup';\n\nexport type DropdownMenuHeaderProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport const DropdownMenuHeader = ({ className, ...rest }: DropdownMenuHeaderProps) => {\n  return <div {...rest} className={clsx(sx(menuStyles.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={clsx(sx(menuStyles.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={clsx(sx(menuStyles.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        clsx(itemClassName(danger), typeof className === 'function' ? className(state) : className)\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        clsx(itemClassName(danger), typeof className === 'function' ? className(state) : className)\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        clsx(\n          sx(menuStyles.separator),\n          typeof className === 'function' ? className(state) : className,\n        )\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        clsx(\n          sx(menuStyles.groupLabel),\n          typeof className === 'function' ? className(state) : className,\n        )\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        clsx(itemClassName(danger), typeof className === 'function' ? className(state) : className)\n      }\n    />\n  );\n};\n\nDropdownMenuSubmenuTrigger.displayName = 'DropdownMenuSubmenuTrigger';\n\nexport type DropdownMenuItemContentProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport const DropdownMenuItemContentImpl = ({\n  className,\n  xstyle,\n  ...rest\n}: DropdownMenuItemContentProps & { xstyle?: XStyle }) => {\n  return <div {...rest} className={clsx(sx([menuStyles.itemContent, xstyle]), className)} />;\n};\n\nexport const DropdownMenuItemContent = (props: DropdownMenuItemContentProps) => (\n  <DropdownMenuItemContentImpl {...props} />\n);\n\nDropdownMenuItemContent.displayName = 'DropdownMenuItemContent';\n\nexport type DropdownMenuItemIconProps = React.HTMLAttributes<HTMLSpanElement>;\n\nexport const DropdownMenuItemIconImpl = ({\n  className,\n  xstyle,\n  ...rest\n}: DropdownMenuItemIconProps & { xstyle?: XStyle }) => {\n  return (\n    <span\n      {...rest}\n      className={clsx(sx([menuStyles.icon, xstyle], menuClassNames.icon), className)}\n    />\n  );\n};\n\nexport const DropdownMenuItemIcon = (props: DropdownMenuItemIconProps) => (\n  <DropdownMenuItemIconImpl {...props} />\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={clsx(sx(menuStyles.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={clsx(sx(menuStyles.label, menuClassNames.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={clsx(sx(menuStyles.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={clsx(sx(menuStyles.extra), className)} />;\n};\n\nDropdownMenuItemExtra.displayName = 'DropdownMenuItemExtra';\n\nexport type DropdownMenuSubmenuArrowProps = React.HTMLAttributes<HTMLSpanElement>;\n\nexport const DropdownMenuSubmenuArrow = ({ className, ...rest }: DropdownMenuSubmenuArrowProps) => {\n  return (\n    <span\n      {...rest}\n      className={clsx(sx(menuStyles.submenuArrow, menuClassNames.submenuArrow), className)}\n    />\n  );\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        clsx(itemClassName(danger), typeof className === 'function' ? className(state) : className)\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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"}

package/es/DropdownMenu/index.d.mts

@@ -1,7 +1,6 @@
-import { IconSpaceMode } from "../Menu/renderUtils.mjs";
-import { renderDropdownMenuItems } from "../base-ui/DropdownMenu/renderItems.mjs";
-import { DropdownItem, DropdownMenuCheckboxItem, DropdownMenuPlacement, DropdownMenuProps, DropdownMenuSwitchItem as DropdownMenuSwitchItem$1 } from "../base-ui/DropdownMenu/type.mjs";
-import { DropdownMenuCheckboxItemIndicator, DropdownMenuCheckboxItemPrimitive, DropdownMenuCheckboxItemProps, DropdownMenuFooter, DropdownMenuFooterProps, DropdownMenuGroup, DropdownMenuGroupLabel, DropdownMenuGroupLabelProps, DropdownMenuHeader, DropdownMenuHeaderProps, DropdownMenuItem, DropdownMenuItemContent, DropdownMenuItemContentProps, DropdownMenuItemDesc, DropdownMenuItemDescProps, DropdownMenuItemExtra, DropdownMenuItemExtraProps, DropdownMenuItemIcon, DropdownMenuItemIconProps, DropdownMenuItemLabel, DropdownMenuItemLabelGroup, DropdownMenuItemLabelGroupProps, DropdownMenuItemLabelProps, DropdownMenuItemProps, DropdownMenuPopup, DropdownMenuPopupProps, DropdownMenuPortal, DropdownMenuPortalProps, DropdownMenuPositioner, DropdownMenuPositionerProps, DropdownMenuRoot, DropdownMenuScrollViewport, DropdownMenuScrollViewportProps, DropdownMenuSeparator, DropdownMenuSeparatorProps, DropdownMenuSubmenuArrow, DropdownMenuSubmenuArrowProps, DropdownMenuSubmenuRoot, DropdownMenuSubmenuTrigger, DropdownMenuSubmenuTriggerProps, DropdownMenuSwitchItem, DropdownMenuSwitchItemProps, DropdownMenuTrigger, DropdownMenuTriggerProps } from "../base-ui/DropdownMenu/atoms.mjs";
-import DropdownMenu from "../base-ui/DropdownMenu/DropdownMenu.mjs";
-import "../base-ui/DropdownMenu/index.mjs";
+import { IconSpaceMode } from "../internal/menu/renderUtils.mjs";
+import { renderDropdownMenuItems } from "./renderItems.mjs";
+import { DropdownItem, DropdownMenuCheckboxItem, DropdownMenuPlacement, DropdownMenuProps, DropdownMenuSwitchItem as DropdownMenuSwitchItem$1 } from "./type.mjs";
+import { DropdownMenuCheckboxItemIndicator, DropdownMenuCheckboxItemPrimitive, DropdownMenuCheckboxItemProps, DropdownMenuFooter, DropdownMenuFooterProps, DropdownMenuGroup, DropdownMenuGroupLabel, DropdownMenuGroupLabelProps, DropdownMenuHeader, DropdownMenuHeaderProps, DropdownMenuItem, DropdownMenuItemContent, DropdownMenuItemContentProps, DropdownMenuItemDesc, DropdownMenuItemDescProps, DropdownMenuItemExtra, DropdownMenuItemExtraProps, DropdownMenuItemIcon, DropdownMenuItemIconProps, DropdownMenuItemLabel, DropdownMenuItemLabelGroup, DropdownMenuItemLabelGroupProps, DropdownMenuItemLabelProps, DropdownMenuItemProps, DropdownMenuPopup, DropdownMenuPopupProps, DropdownMenuPortal, DropdownMenuPortalProps, DropdownMenuPositioner, DropdownMenuPositionerProps, DropdownMenuRoot, DropdownMenuScrollViewport, DropdownMenuScrollViewportProps, DropdownMenuSeparator, DropdownMenuSeparatorProps, DropdownMenuSubmenuArrow, DropdownMenuSubmenuArrowProps, DropdownMenuSubmenuRoot, DropdownMenuSubmenuTrigger, DropdownMenuSubmenuTriggerProps, DropdownMenuSwitchItem, DropdownMenuSwitchItemProps, DropdownMenuTrigger, DropdownMenuTriggerProps } from "./atoms.mjs";
+import DropdownMenu from "./DropdownMenu.mjs";
 export { type DropdownItem, DropdownMenu, type DropdownMenuCheckboxItem, DropdownMenuCheckboxItemIndicator, DropdownMenuCheckboxItemPrimitive, type DropdownMenuCheckboxItemProps, DropdownMenuFooter, type DropdownMenuFooterProps, DropdownMenuGroup, DropdownMenuGroupLabel, type DropdownMenuGroupLabelProps, DropdownMenuHeader, type DropdownMenuHeaderProps, DropdownMenuItem, DropdownMenuItemContent, type DropdownMenuItemContentProps, DropdownMenuItemDesc, type DropdownMenuItemDescProps, DropdownMenuItemExtra, type DropdownMenuItemExtraProps, DropdownMenuItemIcon, type DropdownMenuItemIconProps, DropdownMenuItemLabel, DropdownMenuItemLabelGroup, type DropdownMenuItemLabelGroupProps, type DropdownMenuItemLabelProps, type DropdownMenuItemProps, type DropdownMenuPlacement, DropdownMenuPopup, type DropdownMenuPopupProps, DropdownMenuPortal, type DropdownMenuPortalProps, DropdownMenuPositioner, type DropdownMenuPositionerProps, type DropdownMenuProps, DropdownMenuRoot, DropdownMenuScrollViewport, type DropdownMenuScrollViewportProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, DropdownMenuSubmenuArrow, type DropdownMenuSubmenuArrowProps, DropdownMenuSubmenuRoot, DropdownMenuSubmenuTrigger, type DropdownMenuSubmenuTriggerProps, DropdownMenuSwitchItem, type DropdownMenuSwitchItemProps, type DropdownMenuSwitchItem$1 as DropdownMenuSwitchItemType, DropdownMenuTrigger, type DropdownMenuTriggerProps, type IconSpaceMode, DropdownMenu as default, renderDropdownMenuItems };

package/es/DropdownMenu/index.mjs

@@ -1,4 +1,4 @@
-import { DropdownMenuCheckboxItemIndicator, DropdownMenuCheckboxItemPrimitive, DropdownMenuFooter, DropdownMenuGroup, DropdownMenuGroupLabel, DropdownMenuHeader, DropdownMenuItem, DropdownMenuItemContent, DropdownMenuItemDesc, DropdownMenuItemExtra, DropdownMenuItemIcon, DropdownMenuItemLabel, DropdownMenuItemLabelGroup, DropdownMenuPopup, DropdownMenuPortal, DropdownMenuPositioner, DropdownMenuRoot, DropdownMenuScrollViewport, DropdownMenuSeparator, DropdownMenuSubmenuArrow, DropdownMenuSubmenuRoot, DropdownMenuSubmenuTrigger, DropdownMenuSwitchItem, DropdownMenuTrigger } from "../base-ui/DropdownMenu/atoms.mjs";
-import { renderDropdownMenuItems } from "../base-ui/DropdownMenu/renderItems.mjs";
-import DropdownMenu from "../base-ui/DropdownMenu/DropdownMenu.mjs";
+import { DropdownMenuCheckboxItemIndicator, DropdownMenuCheckboxItemPrimitive, DropdownMenuFooter, DropdownMenuGroup, DropdownMenuGroupLabel, DropdownMenuHeader, DropdownMenuItem, DropdownMenuItemContent, DropdownMenuItemDesc, DropdownMenuItemExtra, DropdownMenuItemIcon, DropdownMenuItemLabel, DropdownMenuItemLabelGroup, DropdownMenuPopup, DropdownMenuPortal, DropdownMenuPositioner, DropdownMenuRoot, DropdownMenuScrollViewport, DropdownMenuSeparator, DropdownMenuSubmenuArrow, DropdownMenuSubmenuRoot, DropdownMenuSubmenuTrigger, DropdownMenuSwitchItem, DropdownMenuTrigger } from "./atoms.mjs";
+import { renderDropdownMenuItems } from "./renderItems.mjs";
+import DropdownMenu from "./DropdownMenu.mjs";
 export { DropdownMenu, DropdownMenuCheckboxItemIndicator, DropdownMenuCheckboxItemPrimitive, DropdownMenuFooter, DropdownMenuGroup, DropdownMenuGroupLabel, DropdownMenuHeader, DropdownMenuItem, DropdownMenuItemContent, DropdownMenuItemDesc, DropdownMenuItemExtra, DropdownMenuItemIcon, DropdownMenuItemLabel, DropdownMenuItemLabelGroup, DropdownMenuPopup, DropdownMenuPortal, DropdownMenuPositioner, DropdownMenuRoot, DropdownMenuScrollViewport, DropdownMenuSeparator, DropdownMenuSubmenuArrow, DropdownMenuSubmenuRoot, DropdownMenuSubmenuTrigger, DropdownMenuSwitchItem, DropdownMenuTrigger, DropdownMenu as default, renderDropdownMenuItems };

package/es/DropdownMenu/renderItems.d.mts

@@ -0,0 +1,8 @@
+import { IconAlign, IconSpaceMode, RenderOptions } from "../internal/menu/renderUtils.mjs";
+import { DropdownItem } from "./type.mjs";
+import { ReactNode } from "react";
+//#region src/DropdownMenu/renderItems.d.ts
+export declare const renderDropdownMenuItems: (items: DropdownItem[], keyPath?: string[], options?: RenderOptions) => ReactNode[];
+//#endregion
+export type { IconSpaceMode };
+//# sourceMappingURL=renderItems.d.mts.map

package/es/DropdownMenu/renderItems.mjs

@@ -0,0 +1,169 @@
+import { menuStyles } from "./style.mjs";
+import { DropdownMenuCheckboxItemIndicator, DropdownMenuCheckboxItemPrimitive, DropdownMenuFooter, DropdownMenuGroup, DropdownMenuGroupLabel, DropdownMenuHeader, DropdownMenuItem, DropdownMenuItemContentImpl, DropdownMenuItemDesc, DropdownMenuItemExtra, DropdownMenuItemIconImpl, DropdownMenuItemLabel, DropdownMenuItemLabelGroup, DropdownMenuPopupImpl, DropdownMenuPortal, DropdownMenuPositioner, DropdownMenuScrollViewport, DropdownMenuSeparator, DropdownMenuSubmenuArrow, DropdownMenuSubmenuRoot, DropdownMenuSubmenuTrigger, DropdownMenuSwitchItem } from "./atoms.mjs";
+import { getItemKey, getItemLabel, hasAnyIcon, hasCheckboxAndIcon, renderIcon } from "../internal/menu/renderUtils.mjs";
+import { SubmenuArrowIcon } from "../internal/SubmenuArrowIcon.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Check } from "lucide-react";
+//#region src/DropdownMenu/renderItems.tsx
+const renderItemContent = (item, options, iconNode) => {
+	const label = getItemLabel(item);
+	const desc = "desc" in item ? item.desc : void 0;
+	const extra = "extra" in item ? item.extra : void 0;
+	const indicatorOnRight = options?.indicatorOnRight;
+	const alignStart = Boolean(desc) && options?.iconAlign === "start";
+	const hasCustomIcon = iconNode !== void 0 && !indicatorOnRight;
+	const hasIcon = hasCustomIcon ? Boolean(iconNode) : Boolean(item.icon);
+	const shouldRenderIcon = hasCustomIcon ? Boolean(options?.reserveIconSpace || iconNode) : Boolean(hasIcon || options?.reserveIconSpace);
+	const labelNode = desc ? /* @__PURE__ */ jsxs(DropdownMenuItemLabelGroup, { children: [/* @__PURE__ */ jsx(DropdownMenuItemLabel, { children: label }), /* @__PURE__ */ jsx(DropdownMenuItemDesc, { children: desc })] }) : /* @__PURE__ */ jsx(DropdownMenuItemLabel, { children: label });
+	return /* @__PURE__ */ jsxs(DropdownMenuItemContentImpl, {
+		xstyle: alignStart && menuStyles.itemContentAlignStart,
+		children: [
+			shouldRenderIcon ? /* @__PURE__ */ jsx(DropdownMenuItemIconImpl, {
+				"aria-hidden": !hasIcon,
+				xstyle: alignStart && menuStyles.iconAlignStart,
+				children: hasCustomIcon ? iconNode : hasIcon ? renderIcon(item.icon) : null
+			}) : null,
+			labelNode,
+			extra ? /* @__PURE__ */ jsx(DropdownMenuItemExtra, { children: extra }) : null,
+			indicatorOnRight && iconNode ? iconNode : null,
+			options?.submenu ? /* @__PURE__ */ jsx(DropdownMenuSubmenuArrow, { children: /* @__PURE__ */ jsx(SubmenuArrowIcon, {}) }) : null
+		]
+	});
+};
+const invokeItemClick = (item, keyPath, event) => {
+	if (!item.onClick) return;
+	const key = item.key ?? keyPath.at(-1) ?? "";
+	const info = {
+		domEvent: event,
+		item: event.currentTarget,
+		key: String(key),
+		keyPath
+	};
+	item.onClick(info);
+};
+const renderDropdownMenuItems = (items, keyPath = [], options) => {
+	const iconAlign = options?.iconAlign;
+	const iconSpaceMode = options?.iconSpaceMode ?? "global";
+	const reserveIconSpace = options?.reserveIconSpace ?? hasAnyIcon(items, iconSpaceMode === "global");
+	const indicatorOnRight = options?.indicatorOnRight ?? hasCheckboxAndIcon(items);
+	return items.map((item, index) => {
+		if (!item) return null;
+		const fallbackKey = `${keyPath.join("-") || "root"}-${index}`;
+		const itemKey = getItemKey(item, fallbackKey);
+		const nextKeyPath = [...keyPath, String(itemKey)];
+		if (item.type === "checkbox") {
+			const checkboxItem = item;
+			const label = getItemLabel(checkboxItem);
+			const labelText = typeof label === "string" ? label : void 0;
+			const isDanger = Boolean(checkboxItem.danger);
+			const indicator = /* @__PURE__ */ jsx(DropdownMenuCheckboxItemIndicator, { children: renderIcon(Check) });
+			return /* @__PURE__ */ jsx(DropdownMenuCheckboxItemPrimitive, {
+				checked: checkboxItem.checked,
+				closeOnClick: checkboxItem.closeOnClick,
+				danger: isDanger,
+				defaultChecked: checkboxItem.defaultChecked,
+				disabled: checkboxItem.disabled,
+				label: labelText,
+				onCheckedChange: (checked) => checkboxItem.onCheckedChange?.(checked),
+				children: renderItemContent(checkboxItem, {
+					iconAlign,
+					indicatorOnRight,
+					reserveIconSpace
+				}, indicator)
+			}, itemKey);
+		}
+		if (item.type === "switch") {
+			const switchItem = item;
+			const label = getItemLabel(switchItem);
+			const labelText = typeof label === "string" ? label : void 0;
+			const isDanger = Boolean(switchItem.danger);
+			return /* @__PURE__ */ jsx(DropdownMenuSwitchItem, {
+				checked: switchItem.checked,
+				closeOnClick: switchItem.closeOnClick,
+				danger: isDanger,
+				defaultChecked: switchItem.defaultChecked,
+				disabled: switchItem.disabled,
+				label: labelText,
+				onCheckedChange: (checked) => switchItem.onCheckedChange?.(checked),
+				children: renderItemContent(switchItem, {
+					iconAlign,
+					reserveIconSpace
+				})
+			}, itemKey);
+		}
+		if (item.type === "divider") return /* @__PURE__ */ jsx(DropdownMenuSeparator, {}, itemKey);
+		if (item.type === "group") {
+			const group = item;
+			const groupReserveIconSpace = iconSpaceMode === "group" ? group.children ? hasAnyIcon(group.children) : false : reserveIconSpace;
+			const groupIndicatorOnRight = group.children ? hasCheckboxAndIcon(group.children) : false;
+			return /* @__PURE__ */ jsxs(DropdownMenuGroup, { children: [group.label ? /* @__PURE__ */ jsx(DropdownMenuGroupLabel, { children: group.label }) : null, group.children ? renderDropdownMenuItems(group.children, nextKeyPath, {
+				iconAlign,
+				iconSpaceMode,
+				indicatorOnRight: groupIndicatorOnRight,
+				reserveIconSpace: groupReserveIconSpace
+			}) : null] }, itemKey);
+		}
+		if (item.type === "submenu" || "children" in item) {
+			const submenu = item;
+			const label = getItemLabel(submenu);
+			const labelText = typeof label === "string" ? label : void 0;
+			const isDanger = "danger" in submenu && Boolean(submenu.danger);
+			const submenuHasSlots = submenu.header != null || submenu.footer != null;
+			const submenuItems = submenu.children ? renderDropdownMenuItems(submenu.children, nextKeyPath, {
+				iconAlign,
+				iconSpaceMode
+			}) : null;
+			return /* @__PURE__ */ jsxs(DropdownMenuSubmenuRoot, {
+				defaultOpen: submenu.defaultOpen,
+				open: submenu.open,
+				onOpenChange: submenu.onOpenChange,
+				children: [/* @__PURE__ */ jsx(DropdownMenuSubmenuTrigger, {
+					...submenu.triggerProps,
+					closeDelay: submenu.closeDelay,
+					danger: isDanger,
+					delay: submenu.delay,
+					disabled: submenu.disabled,
+					label: labelText,
+					openOnHover: submenu.openOnHover,
+					onClick: submenu.onClick,
+					children: renderItemContent(submenu, {
+						iconAlign,
+						reserveIconSpace,
+						submenu: true
+					})
+				}), /* @__PURE__ */ jsx(DropdownMenuPortal, { children: /* @__PURE__ */ jsx(DropdownMenuPositioner, {
+					alignOffset: -4,
+					"data-submenu": "",
+					sideOffset: -1,
+					children: /* @__PURE__ */ jsxs(DropdownMenuPopupImpl, {
+						xstyle: submenuHasSlots && menuStyles.popupWithSlots,
+						children: [
+							submenu.header == null ? null : /* @__PURE__ */ jsx(DropdownMenuHeader, { children: submenu.header }),
+							submenuHasSlots ? /* @__PURE__ */ jsx(DropdownMenuScrollViewport, { children: submenuItems }) : submenuItems,
+							submenu.footer == null ? null : /* @__PURE__ */ jsx(DropdownMenuFooter, { children: submenu.footer })
+						]
+					})
+				}) })]
+			}, itemKey);
+		}
+		const menuItem = item;
+		const label = getItemLabel(menuItem);
+		const labelText = typeof label === "string" ? label : void 0;
+		const isDanger = "danger" in menuItem && Boolean(menuItem.danger);
+		return /* @__PURE__ */ jsx(DropdownMenuItem, {
+			closeOnClick: menuItem.closeOnClick,
+			danger: isDanger,
+			disabled: menuItem.disabled,
+			label: labelText,
+			onClick: (event) => invokeItemClick(menuItem, nextKeyPath, event),
+			children: renderItemContent(menuItem, {
+				iconAlign,
+				reserveIconSpace
+			})
+		}, itemKey);
+	});
+};
+//#endregion
+export { renderDropdownMenuItems };
+
+//# sourceMappingURL=renderItems.mjs.map

package/es/DropdownMenu/renderItems.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderItems.mjs","names":[],"sources":["../../src/DropdownMenu/renderItems.tsx"],"sourcesContent":["import { Check } from 'lucide-react';\nimport {\n  type KeyboardEvent as ReactKeyboardEvent,\n  type MouseEvent as ReactMouseEvent,\n  type ReactNode,\n} from 'react';\n\nimport type { BaseMenuItemGroupType, BaseSubMenuType } from '@/internal/menu/baseItem';\nimport {\n  getItemKey,\n  getItemLabel,\n  hasAnyIcon,\n  hasCheckboxAndIcon,\n  renderIcon,\n  type RenderItemContentOptions,\n  type RenderOptions,\n} from '@/internal/menu/renderUtils';\nimport type { MenuDividerType, MenuInfo, MenuItemType } from '@/internal/menu/type';\nimport { SubmenuArrowIcon } from '@/internal/SubmenuArrowIcon';\n\nimport {\n  DropdownMenuCheckboxItemIndicator,\n  DropdownMenuCheckboxItemPrimitive,\n  DropdownMenuFooter,\n  DropdownMenuGroup,\n  DropdownMenuGroupLabel,\n  DropdownMenuHeader,\n  DropdownMenuItem,\n  DropdownMenuItemContentImpl,\n  DropdownMenuItemDesc,\n  DropdownMenuItemExtra,\n  DropdownMenuItemIconImpl,\n  DropdownMenuItemLabel,\n  DropdownMenuItemLabelGroup,\n  DropdownMenuPopupImpl,\n  DropdownMenuPortal,\n  DropdownMenuPositioner,\n  DropdownMenuScrollViewport,\n  DropdownMenuSeparator,\n  DropdownMenuSubmenuArrow,\n  DropdownMenuSubmenuRoot,\n  DropdownMenuSubmenuTrigger,\n  DropdownMenuSwitchItem,\n} from './atoms';\nimport { menuStyles } from './style';\nimport {\n  type DropdownItem,\n  type DropdownMenuCheckboxItem as DropdownMenuCheckboxItemType,\n  type DropdownMenuSwitchItem as DropdownMenuSwitchItemType,\n} from './type';\n\nexport type { IconAlign, IconSpaceMode } from '@/internal/menu/renderUtils';\n\nconst renderItemContent = (\n  item: MenuItemType | BaseSubMenuType | DropdownMenuCheckboxItemType | DropdownMenuSwitchItemType,\n  options?: RenderItemContentOptions,\n  iconNode?: ReactNode,\n) => {\n  const label = getItemLabel(item);\n  const desc = 'desc' in item ? item.desc : undefined;\n  const extra = 'extra' in item ? item.extra : undefined;\n  const indicatorOnRight = options?.indicatorOnRight;\n  const alignStart = Boolean(desc) && options?.iconAlign === 'start';\n\n  const hasCustomIcon = iconNode !== undefined && !indicatorOnRight;\n  const hasIcon = hasCustomIcon ? Boolean(iconNode) : Boolean(item.icon);\n  const shouldRenderIcon = hasCustomIcon\n    ? Boolean(options?.reserveIconSpace || iconNode)\n    : Boolean(hasIcon || options?.reserveIconSpace);\n\n  const labelNode = desc ? (\n    <DropdownMenuItemLabelGroup>\n      <DropdownMenuItemLabel>{label}</DropdownMenuItemLabel>\n      <DropdownMenuItemDesc>{desc}</DropdownMenuItemDesc>\n    </DropdownMenuItemLabelGroup>\n  ) : (\n    <DropdownMenuItemLabel>{label}</DropdownMenuItemLabel>\n  );\n\n  return (\n    <DropdownMenuItemContentImpl xstyle={alignStart && menuStyles.itemContentAlignStart}>\n      {shouldRenderIcon ? (\n        <DropdownMenuItemIconImpl\n          aria-hidden={!hasIcon}\n          xstyle={alignStart && menuStyles.iconAlignStart}\n        >\n          {hasCustomIcon ? iconNode : hasIcon ? renderIcon(item.icon) : null}\n        </DropdownMenuItemIconImpl>\n      ) : null}\n      {labelNode}\n      {extra ? <DropdownMenuItemExtra>{extra}</DropdownMenuItemExtra> : null}\n      {indicatorOnRight && iconNode ? iconNode : null}\n      {options?.submenu ? (\n        <DropdownMenuSubmenuArrow>\n          <SubmenuArrowIcon />\n        </DropdownMenuSubmenuArrow>\n      ) : null}\n    </DropdownMenuItemContentImpl>\n  );\n};\n\nconst invokeItemClick = (\n  item: MenuItemType,\n  keyPath: string[],\n  event: ReactMouseEvent<HTMLElement> | ReactKeyboardEvent<HTMLElement>,\n) => {\n  if (!item.onClick) return;\n  const key = item.key ?? keyPath.at(-1) ?? '';\n  const info: MenuInfo = {\n    domEvent: event,\n    item: event.currentTarget as MenuInfo['item'],\n    key: String(key),\n    keyPath,\n  };\n  item.onClick(info);\n};\n\nexport const renderDropdownMenuItems = (\n  items: DropdownItem[],\n  keyPath: string[] = [],\n  options?: RenderOptions,\n): ReactNode[] => {\n  const iconAlign = options?.iconAlign;\n  const iconSpaceMode = options?.iconSpaceMode ?? 'global';\n  const reserveIconSpace =\n    options?.reserveIconSpace ?? hasAnyIcon(items, iconSpaceMode === 'global');\n  const indicatorOnRight = options?.indicatorOnRight ?? hasCheckboxAndIcon(items);\n\n  return items.map((item, index) => {\n    if (!item) return null;\n\n    const fallbackKey = `${keyPath.join('-') || 'root'}-${index}`;\n    const itemKey = getItemKey(item, fallbackKey);\n    const nextKeyPath = [...keyPath, String(itemKey)];\n\n    if ((item as DropdownMenuCheckboxItemType).type === 'checkbox') {\n      const checkboxItem = item as DropdownMenuCheckboxItemType;\n      const label = getItemLabel(checkboxItem);\n      const labelText = typeof label === 'string' ? label : undefined;\n      const isDanger = Boolean(checkboxItem.danger);\n      const indicator = (\n        <DropdownMenuCheckboxItemIndicator>{renderIcon(Check)}</DropdownMenuCheckboxItemIndicator>\n      );\n\n      return (\n        <DropdownMenuCheckboxItemPrimitive\n          checked={checkboxItem.checked}\n          closeOnClick={checkboxItem.closeOnClick}\n          danger={isDanger}\n          defaultChecked={checkboxItem.defaultChecked}\n          disabled={checkboxItem.disabled}\n          key={itemKey}\n          label={labelText}\n          onCheckedChange={(checked) => checkboxItem.onCheckedChange?.(checked)}\n        >\n          {renderItemContent(\n            checkboxItem,\n            { iconAlign, indicatorOnRight, reserveIconSpace },\n            indicator,\n          )}\n        </DropdownMenuCheckboxItemPrimitive>\n      );\n    }\n\n    if ((item as DropdownMenuSwitchItemType).type === 'switch') {\n      const switchItem = item as DropdownMenuSwitchItemType;\n      const label = getItemLabel(switchItem);\n      const labelText = typeof label === 'string' ? label : undefined;\n      const isDanger = Boolean(switchItem.danger);\n\n      return (\n        <DropdownMenuSwitchItem\n          checked={switchItem.checked}\n          closeOnClick={switchItem.closeOnClick}\n          danger={isDanger}\n          defaultChecked={switchItem.defaultChecked}\n          disabled={switchItem.disabled}\n          key={itemKey}\n          label={labelText}\n          onCheckedChange={(checked) => switchItem.onCheckedChange?.(checked)}\n        >\n          {renderItemContent(switchItem, { iconAlign, reserveIconSpace })}\n        </DropdownMenuSwitchItem>\n      );\n    }\n\n    if ((item as MenuDividerType).type === 'divider') {\n      return <DropdownMenuSeparator key={itemKey} />;\n    }\n\n    if ((item as BaseMenuItemGroupType).type === 'group') {\n      const group = item as BaseMenuItemGroupType;\n      const groupReserveIconSpace =\n        iconSpaceMode === 'group'\n          ? group.children\n            ? hasAnyIcon(group.children)\n            : false\n          : reserveIconSpace;\n      const groupIndicatorOnRight = group.children ? hasCheckboxAndIcon(group.children) : false;\n      return (\n        <DropdownMenuGroup key={itemKey}>\n          {group.label ? <DropdownMenuGroupLabel>{group.label}</DropdownMenuGroupLabel> : null}\n          {group.children\n            ? renderDropdownMenuItems(group.children, nextKeyPath, {\n                iconAlign,\n                iconSpaceMode,\n                indicatorOnRight: groupIndicatorOnRight,\n                reserveIconSpace: groupReserveIconSpace,\n              })\n            : null}\n        </DropdownMenuGroup>\n      );\n    }\n\n    if ((item as BaseSubMenuType).type === 'submenu' || 'children' in item) {\n      const submenu = item as BaseSubMenuType;\n      const label = getItemLabel(submenu);\n      const labelText = typeof label === 'string' ? label : undefined;\n      const isDanger = 'danger' in submenu && Boolean(submenu.danger);\n      const submenuHasSlots = submenu.header != null || submenu.footer != null;\n      const submenuItems = submenu.children\n        ? renderDropdownMenuItems(submenu.children, nextKeyPath, {\n            iconAlign,\n            iconSpaceMode,\n          })\n        : null;\n\n      return (\n        <DropdownMenuSubmenuRoot\n          defaultOpen={submenu.defaultOpen}\n          key={itemKey}\n          open={submenu.open}\n          onOpenChange={submenu.onOpenChange}\n        >\n          <DropdownMenuSubmenuTrigger\n            {...submenu.triggerProps}\n            closeDelay={submenu.closeDelay}\n            danger={isDanger}\n            delay={submenu.delay}\n            disabled={submenu.disabled}\n            label={labelText}\n            openOnHover={submenu.openOnHover}\n            onClick={submenu.onClick}\n          >\n            {renderItemContent(submenu, {\n              iconAlign,\n              reserveIconSpace,\n              submenu: true,\n            })}\n          </DropdownMenuSubmenuTrigger>\n          <DropdownMenuPortal>\n            <DropdownMenuPositioner alignOffset={-4} data-submenu=\"\" sideOffset={-1}>\n              <DropdownMenuPopupImpl xstyle={submenuHasSlots && menuStyles.popupWithSlots}>\n                {submenu.header == null ? null : (\n                  <DropdownMenuHeader>{submenu.header}</DropdownMenuHeader>\n                )}\n                {submenuHasSlots ? (\n                  <DropdownMenuScrollViewport>{submenuItems}</DropdownMenuScrollViewport>\n                ) : (\n                  submenuItems\n                )}\n                {submenu.footer == null ? null : (\n                  <DropdownMenuFooter>{submenu.footer}</DropdownMenuFooter>\n                )}\n              </DropdownMenuPopupImpl>\n            </DropdownMenuPositioner>\n          </DropdownMenuPortal>\n        </DropdownMenuSubmenuRoot>\n      );\n    }\n\n    const menuItem = item as MenuItemType;\n    const label = getItemLabel(menuItem);\n    const labelText = typeof label === 'string' ? label : undefined;\n    const isDanger = 'danger' in menuItem && Boolean(menuItem.danger);\n\n    return (\n      <DropdownMenuItem\n        closeOnClick={menuItem.closeOnClick}\n        danger={isDanger}\n        disabled={menuItem.disabled}\n        key={itemKey}\n        label={labelText}\n        onClick={(event) => invokeItemClick(menuItem, nextKeyPath, event)}\n      >\n        {renderItemContent(menuItem, { iconAlign, reserveIconSpace })}\n      </DropdownMenuItem>\n    );\n  });\n};\n"],"mappings":"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"}

package/es/DropdownMenu/sharedStyle.d.mts

@@ -0,0 +1,5 @@
+import { menuStyles } from "./style.mjs";
+//#region src/DropdownMenu/sharedStyle.d.ts
+export declare const styles: Record<keyof typeof menuStyles, string>;
+//#endregion
+//# sourceMappingURL=sharedStyle.d.mts.map

package/es/DropdownMenu/sharedStyle.mjs

@@ -0,0 +1,9 @@
+import { menuClassNames, menuStyles } from "./style.mjs";
+import clsx$1 from "clsx";
+import * as stylex from "@stylexjs/stylex";
+//#region src/DropdownMenu/sharedStyle.ts
+const styles = Object.fromEntries(Object.entries(menuStyles).map(([key, value]) => [key, clsx$1(stylex.props(value).className, menuClassNames[key])]));
+//#endregion
+export { menuClassNames, menuStyles, styles };
+
+//# sourceMappingURL=sharedStyle.mjs.map

package/es/DropdownMenu/sharedStyle.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"sharedStyle.mjs","names":["clsx"],"sources":["../../src/DropdownMenu/sharedStyle.ts"],"sourcesContent":["import * as stylex from '@stylexjs/stylex';\nimport clsx from 'clsx';\n\nimport { menuClassNames, menuStyles } from './style';\n\nexport { menuClassNames, menuStyles } from './style';\n\nexport const styles = Object.fromEntries(\n  Object.entries(menuStyles).map(([key, value]) => [\n    key,\n    clsx(stylex.props(value).className, menuClassNames[key as keyof typeof menuClassNames]),\n  ]),\n) as Record<keyof typeof menuStyles, string>;\n"],"mappings":";;;;AAIA,MAAa,SAAS,OAAO,YAAY,OAAO,QAAQ,UAAU,CAAC,CAAC,KAAK,CAAC,KAAK,WAAW,CAAC,KAAKA,OAAK,OAAO,MAAM,KAAK,CAAC,CAAC,WAAW,eAAe,IAAmC,CAAC,CAAC,CAAC"}

package/es/DropdownMenu/style.d.mts

@@ -0,0 +1,167 @@
+import * as stylex from "@stylexjs/stylex";
+//#region src/DropdownMenu/style.d.ts
+export declare const menuStyles: Readonly<{
+  readonly danger: Readonly<{
+    readonly '--lobe-menu-icon-color': stylex.StyleXClassNameFor<"--lobe-menu-icon-color", string>;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", string | null>;
+    readonly color: stylex.StyleXClassNameFor<"color", string>;
+  }>;
+  readonly empty: Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", string>;
+    readonly cursor: stylex.StyleXClassNameFor<"cursor", "default" | "not-allowed">;
+    readonly fontStyle: stylex.StyleXClassNameFor<"fontStyle", "italic">;
+  }>;
+  readonly extra: Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", string>;
+    readonly fontFamily: stylex.StyleXClassNameFor<"fontFamily", string>;
+    readonly fontSize: stylex.StyleXClassNameFor<"fontSize", 12>;
+    readonly marginInlineStart: stylex.StyleXClassNameFor<"marginInlineStart", "auto">;
+    readonly paddingInlineStart: stylex.StyleXClassNameFor<"paddingInlineStart", 16>;
+  }>;
+  readonly footer: Readonly<{
+    readonly paddingBlock: stylex.StyleXClassNameFor<"paddingBlock", 4 | 8>;
+    readonly paddingInline: stylex.StyleXClassNameFor<"paddingInline", 0 | 12>;
+    readonly borderBlockStartColor: stylex.StyleXClassNameFor<"borderBlockStartColor", string>;
+    readonly borderBlockStartStyle: stylex.StyleXClassNameFor<"borderBlockStartStyle", "solid">;
+    readonly borderBlockStartWidth: stylex.StyleXClassNameFor<"borderBlockStartWidth", 1>;
+    readonly flexShrink: stylex.StyleXClassNameFor<"flexShrink", 0>;
+  }>;
+  readonly groupLabel: Readonly<{
+    readonly paddingInline: stylex.StyleXClassNameFor<"paddingInline", 12>;
+    readonly color: stylex.StyleXClassNameFor<"color", string>;
+    readonly fontSize: stylex.StyleXClassNameFor<"fontSize", 10>;
+    readonly fontWeight: stylex.StyleXClassNameFor<"fontWeight", 600>;
+    readonly letterSpacing: stylex.StyleXClassNameFor<"letterSpacing", "0.6px">;
+    readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", "14px">;
+    readonly paddingBlockEnd: stylex.StyleXClassNameFor<"paddingBlockEnd", 4>;
+    readonly paddingBlockStart: stylex.StyleXClassNameFor<"paddingBlockStart", 4 | 8>;
+    readonly textTransform: stylex.StyleXClassNameFor<"textTransform", "uppercase">;
+    readonly userSelect: stylex.StyleXClassNameFor<"userSelect", "none">;
+  }>;
+  readonly header: Readonly<{
+    readonly paddingBlock: stylex.StyleXClassNameFor<"paddingBlock", 4 | 8>;
+    readonly paddingInline: stylex.StyleXClassNameFor<"paddingInline", 0 | 12>;
+    readonly borderBlockEndColor: stylex.StyleXClassNameFor<"borderBlockEndColor", string>;
+    readonly borderBlockEndStyle: stylex.StyleXClassNameFor<"borderBlockEndStyle", "solid">;
+    readonly borderBlockEndWidth: stylex.StyleXClassNameFor<"borderBlockEndWidth", 1>;
+    readonly flexShrink: stylex.StyleXClassNameFor<"flexShrink", 0>;
+  }>;
+  readonly icon: Readonly<{
+    readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
+    readonly color: stylex.StyleXClassNameFor<"color", `var(--lobe-menu-icon-color, ${string})`>;
+    readonly display: stylex.StyleXClassNameFor<"display", "flex">;
+    readonly flexShrink: stylex.StyleXClassNameFor<"flexShrink", 0>;
+    readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "center">;
+    readonly marginInlineEnd: stylex.StyleXClassNameFor<"marginInlineEnd", 12>;
+    readonly height: stylex.StyleXClassNameFor<"height", 14>;
+    readonly width: stylex.StyleXClassNameFor<"width", 14>;
+  }>;
+  readonly iconAlignStart: Readonly<{
+    readonly alignSelf: stylex.StyleXClassNameFor<"alignSelf", "flex-start">;
+    readonly marginBlockStart: stylex.StyleXClassNameFor<"marginBlockStart", 2>;
+  }>;
+  readonly item: Readonly<{
+    readonly borderRadius: stylex.StyleXClassNameFor<"borderRadius", string>;
+    readonly outline: stylex.StyleXClassNameFor<"outline", "none">;
+    readonly overflow: stylex.StyleXClassNameFor<"overflow", "hidden">;
+    readonly paddingBlock: stylex.StyleXClassNameFor<"paddingBlock", 6>;
+    readonly paddingInline: stylex.StyleXClassNameFor<"paddingInline", 12>;
+    readonly transition: stylex.StyleXClassNameFor<"transition", `all 150ms ${string}`>;
+    readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", string | null>;
+    readonly color: stylex.StyleXClassNameFor<"color", string>;
+    readonly cursor: stylex.StyleXClassNameFor<"cursor", "not-allowed" | null>;
+    readonly display: stylex.StyleXClassNameFor<"display", "flex">;
+    readonly fontSize: stylex.StyleXClassNameFor<"fontSize", 14>;
+    readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", "20px">;
+    readonly opacity: stylex.StyleXClassNameFor<"opacity", 0.5 | null>;
+    readonly position: stylex.StyleXClassNameFor<"position", "relative">;
+    readonly userSelect: stylex.StyleXClassNameFor<"userSelect", "none">;
+    readonly minHeight: stylex.StyleXClassNameFor<"minHeight", 32>;
+    readonly width: stylex.StyleXClassNameFor<"width", "100%">;
+  }>;
+  readonly itemContent: Readonly<{
+    readonly flex: stylex.StyleXClassNameFor<"flex", "1">;
+    readonly gap: stylex.StyleXClassNameFor<"gap", 0>;
+    readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
+    readonly display: stylex.StyleXClassNameFor<"display", "flex">;
+  }>;
+  readonly itemContentAlignStart: Readonly<{
+    readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "flex-start">;
+  }>;
+  readonly label: Readonly<{
+    readonly flex: stylex.StyleXClassNameFor<"flex", "1">;
+    readonly overflow: stylex.StyleXClassNameFor<"overflow", "hidden">;
+    readonly textOverflow: stylex.StyleXClassNameFor<"textOverflow", "ellipsis">;
+    readonly whiteSpace: stylex.StyleXClassNameFor<"whiteSpace", "nowrap">;
+  }>;
+  readonly labelGroup: Readonly<{
+    readonly flex: stylex.StyleXClassNameFor<"flex", "1">;
+    readonly overflow: stylex.StyleXClassNameFor<"overflow", "hidden">;
+    readonly display: stylex.StyleXClassNameFor<"display", "flex">;
+    readonly flexDirection: stylex.StyleXClassNameFor<"flexDirection", "column">;
+    readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
+  }>;
+  readonly desc: Readonly<{
+    readonly overflow: stylex.StyleXClassNameFor<"overflow", "hidden">;
+    readonly color: stylex.StyleXClassNameFor<"color", string>;
+    readonly fontSize: stylex.StyleXClassNameFor<"fontSize", 12>;
+    readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", "16px">;
+    readonly textOverflow: stylex.StyleXClassNameFor<"textOverflow", "ellipsis">;
+    readonly whiteSpace: stylex.StyleXClassNameFor<"whiteSpace", "nowrap">;
+  }>;
+  readonly popup: Readonly<{
+    readonly '--lobe-menu-popup-padding': stylex.StyleXClassNameFor<"--lobe-menu-popup-padding", "4px">;
+    readonly '--lobe-virtual-scroll-inset': stylex.StyleXClassNameFor<"--lobe-virtual-scroll-inset", "var(--lobe-menu-popup-padding)" | null>;
+    readonly borderRadius: stylex.StyleXClassNameFor<"borderRadius", string>;
+    readonly outline: stylex.StyleXClassNameFor<"outline", "none">;
+    readonly paddingInline: stylex.StyleXClassNameFor<"paddingInline", "var(--lobe-menu-popup-padding)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", string>;
+    readonly boxShadow: stylex.StyleXClassNameFor<"boxShadow", `${string}, var(--lobe-ring)`>;
+    readonly display: stylex.StyleXClassNameFor<"display", "flex" | null>;
+    readonly flexDirection: stylex.StyleXClassNameFor<"flexDirection", "column" | null>;
+    readonly paddingBlockEnd: stylex.StyleXClassNameFor<"paddingBlockEnd", 0 | "var(--lobe-menu-popup-padding)">;
+    readonly paddingBlockStart: stylex.StyleXClassNameFor<"paddingBlockStart", 0 | "var(--lobe-menu-popup-padding)">;
+    readonly maxHeight: stylex.StyleXClassNameFor<"maxHeight", "var(--available-height)">;
+    readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 220>;
+    readonly overflowX: stylex.StyleXClassNameFor<"overflowX", "hidden" | null>;
+    readonly overflowY: stylex.StyleXClassNameFor<"overflowY", "hidden" | "auto">;
+  }>;
+  readonly popupWithSlots: Readonly<{
+    readonly display: stylex.StyleXClassNameFor<"display", "flex">;
+    readonly flexDirection: stylex.StyleXClassNameFor<"flexDirection", "column">;
+    readonly maxHeight: stylex.StyleXClassNameFor<"maxHeight", "var(--available-height)">;
+    readonly overflowX: stylex.StyleXClassNameFor<"overflowX", "hidden">;
+    readonly overflowY: stylex.StyleXClassNameFor<"overflowY", "hidden">;
+  }>;
+  readonly slotViewport: Readonly<{
+    readonly flex: stylex.StyleXClassNameFor<"flex", "1">;
+    readonly minHeight: stylex.StyleXClassNameFor<"minHeight", 0>;
+    readonly overflowY: stylex.StyleXClassNameFor<"overflowY", "auto">;
+  }>;
+  readonly positioner: Readonly<{
+    readonly '--lobe-dropdown-animation-duration': stylex.StyleXClassNameFor<"--lobe-dropdown-animation-duration", "140ms" | "0ms">;
+    readonly '--lobe-dropdown-animation-ease-in': stylex.StyleXClassNameFor<"--lobe-dropdown-animation-ease-in", "ease-in">;
+    readonly '--lobe-dropdown-animation-ease-out': stylex.StyleXClassNameFor<"--lobe-dropdown-animation-ease-out", string>;
+    readonly '--lobe-dropdown-animation-scale-y': stylex.StyleXClassNameFor<"--lobe-dropdown-animation-scale-y", "1" | "0.92">;
+    readonly zIndex: stylex.StyleXClassNameFor<"zIndex", 1100 | 1199>;
+  }>;
+  readonly separator: Readonly<{
+    readonly marginBlock: stylex.StyleXClassNameFor<"marginBlock", 4>;
+    readonly marginInline: stylex.StyleXClassNameFor<"marginInline", 0>;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", string>;
+    readonly height: stylex.StyleXClassNameFor<"height", 1>;
+  }>;
+  readonly submenuArrow: Readonly<{
+    readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
+    readonly color: stylex.StyleXClassNameFor<"color", `var(--lobe-menu-icon-color, ${string})`>;
+    readonly display: stylex.StyleXClassNameFor<"display", "flex">;
+    readonly flexShrink: stylex.StyleXClassNameFor<"flexShrink", 0>;
+    readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "center">;
+    readonly marginInlineStart: stylex.StyleXClassNameFor<"marginInlineStart", 8>;
+    readonly height: stylex.StyleXClassNameFor<"height", 16>;
+    readonly width: stylex.StyleXClassNameFor<"width", 16>;
+  }>;
+}>;
+//#endregion
+//# sourceMappingURL=style.d.mts.map