@raystack/apsara 1.0.0-rc.0 → 1.0.0-rc.2

package/dist/components/list/list.js

@@ -24,10 +24,10 @@ const ListHeader = ({ children, className, ...props }) => {
     return (jsx("div", { className: header({ className }), role: 'heading', "aria-level": 3, ...props, children: jsx("span", { className: headerText(), children: children }) }));
 };
 ListRoot.displayName = 'List';
-ListHeader.displayName = 'ListHeader';
-ListItem.displayName = 'ListItem';
-ListLabel.displayName = 'ListLabel';
-ListValue.displayName = 'ListValue';
+ListHeader.displayName = 'List.Header';
+ListItem.displayName = 'List.Item';
+ListLabel.displayName = 'List.Label';
+ListValue.displayName = 'List.Value';
 const List = Object.assign(ListRoot, {
     Header: ListHeader,
     Item: ListItem,

package/dist/components/list/list.js.map

@@ -1 +1 @@
-{"version":3,"file":"list.js","sources":["../../../components/list/list.tsx"],"sourcesContent":["import { type VariantProps, cva } from 'class-variance-authority';\nimport { ComponentPropsWithoutRef, ReactNode } from 'react';\n\nimport styles from './list.module.css';\n\nconst list = cva(styles.list);\nconst listItem = cva(styles['list-item']);\nconst label = cva(styles.label);\nconst value = cva(styles.value);\nconst header = cva(styles.header);\nconst headerText = cva(styles['header-text']);\n\ninterface ListRootProps\n  extends ComponentPropsWithoutRef<'ul'>,\n    VariantProps<typeof list> {\n  children: ReactNode;\n  maxWidth?: string | number;\n}\n\ninterface ListItemProps extends ComponentPropsWithoutRef<'li'> {\n  children: ReactNode;\n}\n\ninterface ListLabelProps extends ComponentPropsWithoutRef<'span'> {\n  minWidth?: string;\n  children: ReactNode;\n}\n\ninterface ListValueProps extends ComponentPropsWithoutRef<'span'> {\n  children: ReactNode;\n}\n\ninterface ListHeaderProps extends ComponentPropsWithoutRef<'div'> {\n  children: ReactNode;\n}\n\nconst ListRoot = ({\n  children,\n  className,\n  maxWidth,\n  style,\n  ...props\n}: ListRootProps) => {\n  return (\n    <ul\n      className={list({ className })}\n      style={{ maxWidth, ...style }}\n      role='list'\n      aria-label={props['aria-label'] || 'List'}\n      {...props}\n    >\n      {children}\n    </ul>\n  );\n};\n\nconst ListItem = ({ children, className, ...props }: ListItemProps) => {\n  return (\n    <li className={listItem({ className })} role='listitem' {...props}>\n      {children}\n    </li>\n  );\n};\n\nconst ListLabel = ({\n  children,\n  minWidth,\n  className,\n  style,\n  ...props\n}: ListLabelProps) => {\n  return (\n    <span\n      className={label({ className })}\n      style={{ minWidth, ...style }}\n      {...props}\n    >\n      {children}\n    </span>\n  );\n};\n\nconst ListValue = ({ children, className, ...props }: ListValueProps) => {\n  return (\n    <span className={value({ className })} {...props}>\n      {children}\n    </span>\n  );\n};\n\nconst ListHeader = ({ children, className, ...props }: ListHeaderProps) => {\n  return (\n    <div\n      className={header({ className })}\n      role='heading'\n      aria-level={3}\n      {...props}\n    >\n      <span className={headerText()}>{children}</span>\n    </div>\n  );\n};\n\nListRoot.displayName = 'List';\nListHeader.displayName = 'ListHeader';\nListItem.displayName = 'ListItem';\nListLabel.displayName = 'ListLabel';\nListValue.displayName = 'ListValue';\n\nexport const List = Object.assign(ListRoot, {\n  Header: ListHeader,\n  Item: ListItem,\n  Label: ListLabel,\n  Value: ListValue\n});\n"],"names":["_jsx"],"mappings":"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"}
+{"version":3,"file":"list.js","sources":["../../../components/list/list.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport { ComponentProps, ReactNode } from 'react';\n\nimport styles from './list.module.css';\n\nconst list = cva(styles.list);\nconst listItem = cva(styles['list-item']);\nconst label = cva(styles.label);\nconst value = cva(styles.value);\nconst header = cva(styles.header);\nconst headerText = cva(styles['header-text']);\n\ninterface ListRootProps\n  extends ComponentProps<'ul'>,\n    VariantProps<typeof list> {\n  children: ReactNode;\n  maxWidth?: string | number;\n}\n\ninterface ListItemProps extends ComponentProps<'li'> {\n  children: ReactNode;\n}\n\ninterface ListLabelProps extends ComponentProps<'span'> {\n  minWidth?: string;\n  children: ReactNode;\n}\n\ninterface ListValueProps extends ComponentProps<'span'> {\n  children: ReactNode;\n}\n\ninterface ListHeaderProps extends ComponentProps<'div'> {\n  children: ReactNode;\n}\n\nconst ListRoot = ({\n  children,\n  className,\n  maxWidth,\n  style,\n  ...props\n}: ListRootProps) => {\n  return (\n    <ul\n      className={list({ className })}\n      style={{ maxWidth, ...style }}\n      role='list'\n      aria-label={props['aria-label'] || 'List'}\n      {...props}\n    >\n      {children}\n    </ul>\n  );\n};\n\nconst ListItem = ({ children, className, ...props }: ListItemProps) => {\n  return (\n    <li className={listItem({ className })} role='listitem' {...props}>\n      {children}\n    </li>\n  );\n};\n\nconst ListLabel = ({\n  children,\n  minWidth,\n  className,\n  style,\n  ...props\n}: ListLabelProps) => {\n  return (\n    <span\n      className={label({ className })}\n      style={{ minWidth, ...style }}\n      {...props}\n    >\n      {children}\n    </span>\n  );\n};\n\nconst ListValue = ({ children, className, ...props }: ListValueProps) => {\n  return (\n    <span className={value({ className })} {...props}>\n      {children}\n    </span>\n  );\n};\n\nconst ListHeader = ({ children, className, ...props }: ListHeaderProps) => {\n  return (\n    <div\n      className={header({ className })}\n      role='heading'\n      aria-level={3}\n      {...props}\n    >\n      <span className={headerText()}>{children}</span>\n    </div>\n  );\n};\n\nListRoot.displayName = 'List';\nListHeader.displayName = 'List.Header';\nListItem.displayName = 'List.Item';\nListLabel.displayName = 'List.Label';\nListValue.displayName = 'List.Value';\n\nexport const List = Object.assign(ListRoot, {\n  Header: ListHeader,\n  Item: ListItem,\n  Label: ListLabel,\n  Value: ListValue\n});\n"],"names":["_jsx"],"mappings":"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"}

package/dist/components/menu/cell.cjs

@@ -2,10 +2,11 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var classVarianceAuthority = require('class-variance-authority');
-var React = require('react');
 var cell_module = require('./cell.module.css.cjs');
 
-const Cell = React.forwardRef(({ className, children, leadingIcon, trailingIcon, type = 'item', ...props }, ref) => (jsxRuntime.jsxs("div", { ref: ref, ...props, className: classVarianceAuthority.cx(cell_module.default.cell, className), children: [leadingIcon && jsxRuntime.jsx("span", { className: cell_module.default.leadingIcon, children: leadingIcon }), children, trailingIcon && (jsxRuntime.jsx("span", { className: cell_module.default.trailingIcon, children: trailingIcon }))] })));
+function Cell({ className, children, leadingIcon, trailingIcon, type = 'item', ...props }) {
+    return (jsxRuntime.jsxs("div", { ...props, className: classVarianceAuthority.cx(cell_module.default.cell, className), children: [leadingIcon && jsxRuntime.jsx("span", { className: cell_module.default.leadingIcon, children: leadingIcon }), children, trailingIcon && (jsxRuntime.jsx("span", { className: cell_module.default.trailingIcon, children: trailingIcon }))] }));
+}
 Cell.displayName = 'Menu.Cell';
 
 exports.Cell = Cell;

package/dist/components/menu/cell.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"cell.cjs","sources":["../../../components/menu/cell.tsx"],"sourcesContent":["import { cx } from 'class-variance-authority';\nimport { forwardRef, HTMLAttributes, ReactNode } from 'react';\nimport styles from './cell.module.css';\n\nexport type CellBaseProps = {\n  leadingIcon?: ReactNode;\n  trailingIcon?: ReactNode;\n};\nexport type CellProps = HTMLAttributes<HTMLDivElement> &\n  CellBaseProps & {\n    type?: 'select' | 'item';\n  };\n\nexport const Cell = forwardRef<HTMLDivElement, CellProps>(\n  (\n    { className, children, leadingIcon, trailingIcon, type = 'item', ...props },\n    ref\n  ) => (\n    <div ref={ref} {...props} className={cx(styles.cell, className)}>\n      {leadingIcon && <span className={styles.leadingIcon}>{leadingIcon}</span>}\n      {children}\n      {trailingIcon && (\n        <span className={styles.trailingIcon}>{trailingIcon}</span>\n      )}\n    </div>\n  )\n);\nCell.displayName = 'Menu.Cell';\n"],"names":["forwardRef","_jsxs","cx","styles","_jsx"],"mappings":";;;;;;;AAaa,MAAA,IAAI,GAAGA,gBAAU,CAC5B,CACE,EAAE,SAAS,EAAE,QAAQ,EAAE,WAAW,EAAE,YAAY,EAAE,IAAI,GAAG,MAAM,EAAE,GAAG,KAAK,EAAE,EAC3E,GAAG,MAEHC,eAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,GAAG,EAAM,GAAA,KAAK,EAAE,SAAS,EAAEC,yBAAE,CAACC,mBAAM,CAAC,IAAI,EAAE,SAAS,CAAC,EAC5D,QAAA,EAAA,CAAA,WAAW,IAAIC,cAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAED,mBAAM,CAAC,WAAW,YAAG,WAAW,EAAA,CAAQ,EACxE,QAAQ,EACR,YAAY,KACXC,cAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAED,mBAAM,CAAC,YAAY,YAAG,YAAY,EAAA,CAAQ,CAC5D,CACG,EAAA,CAAA,CACP,EACD;AACF,IAAI,CAAC,WAAW,GAAG,WAAW;;;;"}
+{"version":3,"file":"cell.cjs","sources":["../../../components/menu/cell.tsx"],"sourcesContent":["import { cx } from 'class-variance-authority';\nimport { ComponentProps, ReactNode } from 'react';\nimport styles from './cell.module.css';\n\nexport type CellBaseProps = {\n  leadingIcon?: ReactNode;\n  trailingIcon?: ReactNode;\n};\nexport type CellProps = ComponentProps<'div'> &\n  CellBaseProps & {\n    type?: 'select' | 'item';\n  };\n\nexport function Cell({\n  className,\n  children,\n  leadingIcon,\n  trailingIcon,\n  type = 'item',\n  ...props\n}: CellProps) {\n  return (\n    <div {...props} className={cx(styles.cell, className)}>\n      {leadingIcon && <span className={styles.leadingIcon}>{leadingIcon}</span>}\n      {children}\n      {trailingIcon && (\n        <span className={styles.trailingIcon}>{trailingIcon}</span>\n      )}\n    </div>\n  );\n}\nCell.displayName = 'Menu.Cell';\n"],"names":["_jsxs","cx","styles","_jsx"],"mappings":";;;;;;SAagB,IAAI,CAAC,EACnB,SAAS,EACT,QAAQ,EACR,WAAW,EACX,YAAY,EACZ,IAAI,GAAG,MAAM,EACb,GAAG,KAAK,EACE,EAAA;IACV,QACEA,4BAAS,KAAK,EAAE,SAAS,EAAEC,yBAAE,CAACC,mBAAM,CAAC,IAAI,EAAE,SAAS,CAAC,EAClD,QAAA,EAAA,CAAA,WAAW,IAAIC,cAAM,CAAA,MAAA,EAAA,EAAA,SAAS,EAAED,mBAAM,CAAC,WAAW,EAAG,QAAA,EAAA,WAAW,GAAQ,EACxE,QAAQ,EACR,YAAY,KACXC,cAAM,CAAA,MAAA,EAAA,EAAA,SAAS,EAAED,mBAAM,CAAC,YAAY,EAAG,QAAA,EAAA,YAAY,GAAQ,CAC5D,CAAA,EAAA,CACG,EACN;AACJ,CAAC;AACD,IAAI,CAAC,WAAW,GAAG,WAAW;;;;"}

package/dist/components/menu/cell.d.ts

@@ -1,12 +1,13 @@
-import { HTMLAttributes, ReactNode } from 'react';
+import { ComponentProps, ReactNode } from 'react';
 export type CellBaseProps = {
     leadingIcon?: ReactNode;
     trailingIcon?: ReactNode;
 };
-export type CellProps = HTMLAttributes<HTMLDivElement> & CellBaseProps & {
+export type CellProps = ComponentProps<'div'> & CellBaseProps & {
     type?: 'select' | 'item';
 };
-export declare const Cell: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & CellBaseProps & {
-    type?: "select" | "item" | undefined;
-} & import("react").RefAttributes<HTMLDivElement>>;
+export declare function Cell({ className, children, leadingIcon, trailingIcon, type, ...props }: CellProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Cell {
+    var displayName: string;
+}
 //# sourceMappingURL=cell.d.ts.map

package/dist/components/menu/cell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"cell.d.ts","sourceRoot":"","sources":["../../../components/menu/cell.tsx"],"names":[],"mappings":"AACA,OAAO,EAAc,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAG9D,MAAM,MAAM,aAAa,GAAG;IAC1B,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,YAAY,CAAC,EAAE,SAAS,CAAC;CAC1B,CAAC;AACF,MAAM,MAAM,SAAS,GAAG,cAAc,CAAC,cAAc,CAAC,GACpD,aAAa,GAAG;IACd,IAAI,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;CAC1B,CAAC;AAEJ,eAAO,MAAM,IAAI;;kDAahB,CAAC"}
+{"version":3,"file":"cell.d.ts","sourceRoot":"","sources":["../../../components/menu/cell.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGlD,MAAM,MAAM,aAAa,GAAG;IAC1B,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,YAAY,CAAC,EAAE,SAAS,CAAC;CAC1B,CAAC;AACF,MAAM,MAAM,SAAS,GAAG,cAAc,CAAC,KAAK,CAAC,GAC3C,aAAa,GAAG;IACd,IAAI,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;CAC1B,CAAC;AAEJ,wBAAgB,IAAI,CAAC,EACnB,SAAS,EACT,QAAQ,EACR,WAAW,EACX,YAAY,EACZ,IAAa,EACb,GAAG,KAAK,EACT,EAAE,SAAS,2CAUX;yBAjBe,IAAI"}

package/dist/components/menu/cell.js

@@ -1,9 +1,10 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { cx } from 'class-variance-authority';
-import { forwardRef } from 'react';
 import styles from './cell.module.css.js';
 
-const Cell = forwardRef(({ className, children, leadingIcon, trailingIcon, type = 'item', ...props }, ref) => (jsxs("div", { ref: ref, ...props, className: cx(styles.cell, className), children: [leadingIcon && jsx("span", { className: styles.leadingIcon, children: leadingIcon }), children, trailingIcon && (jsx("span", { className: styles.trailingIcon, children: trailingIcon }))] })));
+function Cell({ className, children, leadingIcon, trailingIcon, type = 'item', ...props }) {
+    return (jsxs("div", { ...props, className: cx(styles.cell, className), children: [leadingIcon && jsx("span", { className: styles.leadingIcon, children: leadingIcon }), children, trailingIcon && (jsx("span", { className: styles.trailingIcon, children: trailingIcon }))] }));
+}
 Cell.displayName = 'Menu.Cell';
 
 export { Cell };

package/dist/components/menu/cell.js.map

@@ -1 +1 @@
-{"version":3,"file":"cell.js","sources":["../../../components/menu/cell.tsx"],"sourcesContent":["import { cx } from 'class-variance-authority';\nimport { forwardRef, HTMLAttributes, ReactNode } from 'react';\nimport styles from './cell.module.css';\n\nexport type CellBaseProps = {\n  leadingIcon?: ReactNode;\n  trailingIcon?: ReactNode;\n};\nexport type CellProps = HTMLAttributes<HTMLDivElement> &\n  CellBaseProps & {\n    type?: 'select' | 'item';\n  };\n\nexport const Cell = forwardRef<HTMLDivElement, CellProps>(\n  (\n    { className, children, leadingIcon, trailingIcon, type = 'item', ...props },\n    ref\n  ) => (\n    <div ref={ref} {...props} className={cx(styles.cell, className)}>\n      {leadingIcon && <span className={styles.leadingIcon}>{leadingIcon}</span>}\n      {children}\n      {trailingIcon && (\n        <span className={styles.trailingIcon}>{trailingIcon}</span>\n      )}\n    </div>\n  )\n);\nCell.displayName = 'Menu.Cell';\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;AAaa,MAAA,IAAI,GAAG,UAAU,CAC5B,CACE,EAAE,SAAS,EAAE,QAAQ,EAAE,WAAW,EAAE,YAAY,EAAE,IAAI,GAAG,MAAM,EAAE,GAAG,KAAK,EAAE,EAC3E,GAAG,MAEHA,IAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,GAAG,EAAM,GAAA,KAAK,EAAE,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,EAC5D,QAAA,EAAA,CAAA,WAAW,IAAIC,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,MAAM,CAAC,WAAW,YAAG,WAAW,EAAA,CAAQ,EACxE,QAAQ,EACR,YAAY,KACXA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,MAAM,CAAC,YAAY,YAAG,YAAY,EAAA,CAAQ,CAC5D,CACG,EAAA,CAAA,CACP,EACD;AACF,IAAI,CAAC,WAAW,GAAG,WAAW;;;;"}
+{"version":3,"file":"cell.js","sources":["../../../components/menu/cell.tsx"],"sourcesContent":["import { cx } from 'class-variance-authority';\nimport { ComponentProps, ReactNode } from 'react';\nimport styles from './cell.module.css';\n\nexport type CellBaseProps = {\n  leadingIcon?: ReactNode;\n  trailingIcon?: ReactNode;\n};\nexport type CellProps = ComponentProps<'div'> &\n  CellBaseProps & {\n    type?: 'select' | 'item';\n  };\n\nexport function Cell({\n  className,\n  children,\n  leadingIcon,\n  trailingIcon,\n  type = 'item',\n  ...props\n}: CellProps) {\n  return (\n    <div {...props} className={cx(styles.cell, className)}>\n      {leadingIcon && <span className={styles.leadingIcon}>{leadingIcon}</span>}\n      {children}\n      {trailingIcon && (\n        <span className={styles.trailingIcon}>{trailingIcon}</span>\n      )}\n    </div>\n  );\n}\nCell.displayName = 'Menu.Cell';\n"],"names":["_jsxs","_jsx"],"mappings":";;;;SAagB,IAAI,CAAC,EACnB,SAAS,EACT,QAAQ,EACR,WAAW,EACX,YAAY,EACZ,IAAI,GAAG,MAAM,EACb,GAAG,KAAK,EACE,EAAA;IACV,QACEA,iBAAS,KAAK,EAAE,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,EAClD,QAAA,EAAA,CAAA,WAAW,IAAIC,GAAM,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,WAAW,EAAG,QAAA,EAAA,WAAW,GAAQ,EACxE,QAAQ,EACR,YAAY,KACXA,GAAM,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,YAAY,EAAG,QAAA,EAAA,YAAY,GAAQ,CAC5D,CAAA,EAAA,CACG,EACN;AACJ,CAAC;AACD,IAAI,CAAC,WAAW,GAAG,WAAW;;;;"}

package/dist/components/menu/menu-content.cjs

@@ -9,7 +9,7 @@ var menu_module = require('./menu.module.css.cjs');
 var menuRoot = require('./menu-root.cjs');
 var utils = require('./utils.cjs');
 
-const MenuContent = React.forwardRef(({ className, children, searchPlaceholder = 'Search...', render, finalFocus, style, sideOffset = 4, align = 'start', onFocus, ...positionerProps }, ref) => {
+function MenuContent({ ref, className, children, searchPlaceholder = 'Search...', render, finalFocus, style, sideOffset = 4, align = 'start', onFocus, ...positionerProps }) {
     const { autocomplete, inputValue, onInputValueChange, inputRef, isInitialRender, parent } = menuRoot.useMenuContext();
     const focusInput = React.useCallback(() => {
         if (document?.activeElement !== inputRef?.current)
@@ -50,9 +50,7 @@ const MenuContent = React.forwardRef(({ className, children, searchPlaceholder =
     const blurStaleMenuItem = React.useCallback((index) => {
         const items = containerRef.current?.querySelectorAll('[role="option"]');
         const item = items?.[index];
-        if (!item ||
-            !utils.isElementSubMenuTrigger(item) ||
-            !utils.isElementSubMenuOpen(item))
+        if (!item || !utils.isElementSubMenuTrigger(item) || !utils.isElementSubMenuOpen(item))
             return;
         utils.dispatchKeyboardEvent(item, utils.KEYCODES.ESCAPE);
         item.dispatchEvent(new PointerEvent('pointerout', { bubbles: true }));
@@ -85,10 +83,12 @@ const MenuContent = React.forwardRef(({ className, children, searchPlaceholder =
                                     checkAndOpenSubMenu();
                                 e.stopPropagation();
                             }, tabIndex: -1 }), jsxRuntime.jsx(react.Autocomplete.List, { className: menu_module.default.comboboxContent, ref: containerRef, children: children })] })) : (children) }) }) }));
-});
+}
 MenuContent.displayName = 'Menu.Content';
-const MenuSubContent = React.forwardRef(({ ...props }, ref) => jsxRuntime.jsx(MenuContent, { ref: ref, sideOffset: 2, ...props }));
-MenuSubContent.displayName = 'Menu.SubContent';
+function MenuSubContent(props) {
+    return jsxRuntime.jsx(MenuContent, { sideOffset: 2, ...props });
+}
+MenuSubContent.displayName = 'Menu.SubmenuContent';
 
 exports.MenuContent = MenuContent;
 exports.MenuSubContent = MenuSubContent;

package/dist/components/menu/menu-content.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"menu-content.cjs","sources":["../../../components/menu/menu-content.tsx"],"sourcesContent":["'use client';\n\nimport {\n  Autocomplete as AutocompletePrimitive,\n  Menu as MenuPrimitive\n} from '@base-ui/react';\nimport { cx } from 'class-variance-authority';\nimport { forwardRef, KeyboardEvent, useCallback, useRef } from 'react';\nimport styles from './menu.module.css';\nimport { useMenuContext } from './menu-root';\nimport {\n  dispatchKeyboardEvent,\n  isElementSubMenuOpen,\n  isElementSubMenuTrigger,\n  KEYCODES\n} from './utils';\n\nexport interface MenuContentProps\n  extends Omit<\n      MenuPrimitive.Positioner.Props,\n      'render' | 'className' | 'style'\n    >,\n    MenuPrimitive.Popup.Props {\n  searchPlaceholder?: string;\n}\n\nexport const MenuContent = forwardRef<HTMLDivElement, MenuContentProps>(\n  (\n    {\n      className,\n      children,\n      searchPlaceholder = 'Search...',\n      render,\n      finalFocus,\n      style,\n      sideOffset = 4,\n      align = 'start',\n      onFocus,\n      ...positionerProps\n    },\n    ref\n  ) => {\n    const {\n      autocomplete,\n      inputValue,\n      onInputValueChange,\n      inputRef,\n      isInitialRender,\n      parent\n    } = useMenuContext();\n\n    const focusInput = useCallback(() => {\n      if (document?.activeElement !== inputRef?.current)\n        inputRef?.current?.focus();\n    }, [inputRef]);\n    const highlightedItem = useRef<\n      [index: number, reason: 'keyboard' | 'pointer' | 'none']\n    >([-1, 'none']);\n    const containerRef = useRef<HTMLDivElement>(null);\n\n    const highlightFirstItem = useCallback(() => {\n      if (!isInitialRender?.current) return;\n      isInitialRender.current = false;\n      const item = containerRef.current?.querySelector('[role=\"option\"]');\n      if (!item) return;\n      item.dispatchEvent(new PointerEvent('mousemove', { bubbles: true }));\n    }, [isInitialRender]);\n\n    const checkAndOpenSubMenu = useCallback(() => {\n      if (highlightedItem.current[0] === -1) return;\n      const items = containerRef.current?.querySelectorAll('[role=\"option\"]');\n      const item = items?.[highlightedItem.current[0]];\n      if (!item || !isElementSubMenuTrigger(item)) return;\n      dispatchKeyboardEvent(item, KEYCODES.ARROW_RIGHT);\n    }, []);\n\n    const checkAndCloseSubMenu = useCallback(\n      (e: KeyboardEvent<HTMLInputElement>) => {\n        if (highlightedItem.current[0] === -1) return;\n        const items = containerRef.current?.querySelectorAll('[role=\"option\"]');\n        const item = items?.[highlightedItem.current[0]];\n        if (\n          !item ||\n          !isElementSubMenuTrigger(item) ||\n          !isElementSubMenuOpen(item)\n        )\n          return;\n        dispatchKeyboardEvent(item, KEYCODES.ESCAPE);\n        e.stopPropagation();\n      },\n      []\n    );\n\n    const blurStaleMenuItem = useCallback((index: number) => {\n      const items = containerRef.current?.querySelectorAll('[role=\"option\"]');\n      const item = items?.[index];\n      if (\n        !item ||\n        !isElementSubMenuTrigger(item) ||\n        !isElementSubMenuOpen(item)\n      )\n        return;\n      dispatchKeyboardEvent(item, KEYCODES.ESCAPE);\n      item.dispatchEvent(new PointerEvent('pointerout', { bubbles: true }));\n    }, []);\n\n    return (\n      <MenuPrimitive.Portal>\n        <MenuPrimitive.Positioner\n          className={styles.positioner}\n          sideOffset={sideOffset}\n          align={align}\n          {...positionerProps}\n        >\n          <MenuPrimitive.Popup\n            ref={ref}\n            className={cx(\n              styles.content,\n              autocomplete && styles.comboboxContainer,\n              className\n            )}\n            style={style}\n            render={render}\n            finalFocus={finalFocus}\n            role={autocomplete ? 'dialog' : 'menu'}\n            onFocus={\n              autocomplete || parent?.autocomplete\n                ? e => {\n                    focusInput();\n                    e.stopPropagation();\n                    highlightFirstItem();\n                    onFocus?.(e);\n                  }\n                : undefined\n            }\n          >\n            {autocomplete ? (\n              <AutocompletePrimitive.Root\n                inline\n                open\n                value={inputValue}\n                onValueChange={(value: string) => onInputValueChange?.(value)}\n                autoHighlight={!!inputValue?.length}\n                mode='none'\n                loopFocus={false}\n                onItemHighlighted={(value, eventDetails) => {\n                  if (\n                    highlightedItem.current[1] === 'pointer' &&\n                    eventDetails.reason === 'keyboard'\n                  ) {\n                    // focus moved using keyboard after using pointer\n                    blurStaleMenuItem(highlightedItem.current[0]);\n                  }\n                  highlightedItem.current = [\n                    eventDetails.index,\n                    eventDetails.reason\n                  ];\n                }}\n              >\n                <AutocompletePrimitive.Input\n                  placeholder={searchPlaceholder}\n                  className={styles.comboboxInput}\n                  ref={inputRef}\n                  onPointerEnter={e => {\n                    focusInput();\n                  }}\n                  onKeyDown={e => {\n                    if (e.key === 'ArrowLeft') return;\n                    if (e.key === 'Escape') return checkAndCloseSubMenu(e);\n                    if (e.key === 'ArrowRight' || e.key === 'Enter')\n                      checkAndOpenSubMenu();\n                    e.stopPropagation();\n                  }}\n                  tabIndex={-1}\n                />\n                <AutocompletePrimitive.List\n                  className={styles.comboboxContent}\n                  ref={containerRef}\n                >\n                  {children}\n                </AutocompletePrimitive.List>\n              </AutocompletePrimitive.Root>\n            ) : (\n              children\n            )}\n          </MenuPrimitive.Popup>\n        </MenuPrimitive.Positioner>\n      </MenuPrimitive.Portal>\n    );\n  }\n);\nMenuContent.displayName = 'Menu.Content';\n\nexport const MenuSubContent = forwardRef<HTMLDivElement, MenuContentProps>(\n  ({ ...props }, ref) => <MenuContent ref={ref} sideOffset={2} {...props} />\n);\nMenuSubContent.displayName = 'Menu.SubContent';\n"],"names":[],"mappings":";;;;;;;;;;;AA0Ba;AAgBT;AASA;AACE;AACE;AACJ;;AAIA;AAEA;;;AAEE;;AAEA;;AACA;AACF;AAEA;;;;AAGE;AACA;;AACA;;AAGF;;;;AAII;AACA;;;;AAMA;;;AAMJ;;AAEE;AACA;;;;AAMA;AACA;;AAGF;;AAsBgB;;AAEA;AACA;;;AAeF;AAEE;;;;;AAMA;AACA;;;AASA;AACF;AAEE;;AACA;AAAwB;;AAEtB;;AAEJ;AAiBhB;AAEF;AAEO;AAGP;;;"}
+{"version":3,"file":"menu-content.cjs","sources":["../../../components/menu/menu-content.tsx"],"sourcesContent":["'use client';\n\nimport {\n  Autocomplete as AutocompletePrimitive,\n  Menu as MenuPrimitive\n} from '@base-ui/react';\nimport { cx } from 'class-variance-authority';\nimport { KeyboardEvent, useCallback, useRef } from 'react';\nimport styles from './menu.module.css';\nimport { useMenuContext } from './menu-root';\nimport {\n  dispatchKeyboardEvent,\n  isElementSubMenuOpen,\n  isElementSubMenuTrigger,\n  KEYCODES\n} from './utils';\n\nexport interface MenuContentProps\n  extends Omit<\n      MenuPrimitive.Positioner.Props,\n      'render' | 'className' | 'style'\n    >,\n    MenuPrimitive.Popup.Props {\n  searchPlaceholder?: string;\n}\n\nexport function MenuContent({\n  ref,\n  className,\n  children,\n  searchPlaceholder = 'Search...',\n  render,\n  finalFocus,\n  style,\n  sideOffset = 4,\n  align = 'start',\n  onFocus,\n  ...positionerProps\n}: MenuContentProps) {\n  const {\n    autocomplete,\n    inputValue,\n    onInputValueChange,\n    inputRef,\n    isInitialRender,\n    parent\n  } = useMenuContext();\n\n  const focusInput = useCallback(() => {\n    if (document?.activeElement !== inputRef?.current)\n      inputRef?.current?.focus();\n  }, [inputRef]);\n  const highlightedItem = useRef<\n    [index: number, reason: 'keyboard' | 'pointer' | 'none']\n  >([-1, 'none']);\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const highlightFirstItem = useCallback(() => {\n    if (!isInitialRender?.current) return;\n    isInitialRender.current = false;\n    const item = containerRef.current?.querySelector('[role=\"option\"]');\n    if (!item) return;\n    item.dispatchEvent(new PointerEvent('mousemove', { bubbles: true }));\n  }, [isInitialRender]);\n\n  const checkAndOpenSubMenu = useCallback(() => {\n    if (highlightedItem.current[0] === -1) return;\n    const items = containerRef.current?.querySelectorAll('[role=\"option\"]');\n    const item = items?.[highlightedItem.current[0]];\n    if (!item || !isElementSubMenuTrigger(item)) return;\n    dispatchKeyboardEvent(item, KEYCODES.ARROW_RIGHT);\n  }, []);\n\n  const checkAndCloseSubMenu = useCallback(\n    (e: KeyboardEvent<HTMLInputElement>) => {\n      if (highlightedItem.current[0] === -1) return;\n      const items = containerRef.current?.querySelectorAll('[role=\"option\"]');\n      const item = items?.[highlightedItem.current[0]];\n      if (\n        !item ||\n        !isElementSubMenuTrigger(item) ||\n        !isElementSubMenuOpen(item)\n      )\n        return;\n      dispatchKeyboardEvent(item, KEYCODES.ESCAPE);\n      e.stopPropagation();\n    },\n    []\n  );\n\n  const blurStaleMenuItem = useCallback((index: number) => {\n    const items = containerRef.current?.querySelectorAll('[role=\"option\"]');\n    const item = items?.[index];\n    if (!item || !isElementSubMenuTrigger(item) || !isElementSubMenuOpen(item))\n      return;\n    dispatchKeyboardEvent(item, KEYCODES.ESCAPE);\n    item.dispatchEvent(new PointerEvent('pointerout', { bubbles: true }));\n  }, []);\n\n  return (\n    <MenuPrimitive.Portal>\n      <MenuPrimitive.Positioner\n        className={styles.positioner}\n        sideOffset={sideOffset}\n        align={align}\n        {...positionerProps}\n      >\n        <MenuPrimitive.Popup\n          ref={ref}\n          className={cx(\n            styles.content,\n            autocomplete && styles.comboboxContainer,\n            className\n          )}\n          style={style}\n          render={render}\n          finalFocus={finalFocus}\n          role={autocomplete ? 'dialog' : 'menu'}\n          onFocus={\n            autocomplete || parent?.autocomplete\n              ? e => {\n                  focusInput();\n                  e.stopPropagation();\n                  highlightFirstItem();\n                  onFocus?.(e);\n                }\n              : undefined\n          }\n        >\n          {autocomplete ? (\n            <AutocompletePrimitive.Root\n              inline\n              open\n              value={inputValue}\n              onValueChange={(value: string) => onInputValueChange?.(value)}\n              autoHighlight={!!inputValue?.length}\n              mode='none'\n              loopFocus={false}\n              onItemHighlighted={(value, eventDetails) => {\n                if (\n                  highlightedItem.current[1] === 'pointer' &&\n                  eventDetails.reason === 'keyboard'\n                ) {\n                  // focus moved using keyboard after using pointer\n                  blurStaleMenuItem(highlightedItem.current[0]);\n                }\n                highlightedItem.current = [\n                  eventDetails.index,\n                  eventDetails.reason\n                ];\n              }}\n            >\n              <AutocompletePrimitive.Input\n                placeholder={searchPlaceholder}\n                className={styles.comboboxInput}\n                ref={inputRef}\n                onPointerEnter={e => {\n                  focusInput();\n                }}\n                onKeyDown={e => {\n                  if (e.key === 'ArrowLeft') return;\n                  if (e.key === 'Escape') return checkAndCloseSubMenu(e);\n                  if (e.key === 'ArrowRight' || e.key === 'Enter')\n                    checkAndOpenSubMenu();\n                  e.stopPropagation();\n                }}\n                tabIndex={-1}\n              />\n              <AutocompletePrimitive.List\n                className={styles.comboboxContent}\n                ref={containerRef}\n              >\n                {children}\n              </AutocompletePrimitive.List>\n            </AutocompletePrimitive.Root>\n          ) : (\n            children\n          )}\n        </MenuPrimitive.Popup>\n      </MenuPrimitive.Positioner>\n    </MenuPrimitive.Portal>\n  );\n}\nMenuContent.displayName = 'Menu.Content';\n\nexport function MenuSubContent(props: MenuContentProps) {\n  return <MenuContent sideOffset={2} {...props} />;\n}\nMenuSubContent.displayName = 'Menu.SubmenuContent';\n"],"names":[],"mappings":";;;;;;;;;;;AA0BgB;AAad;AASA;AACE;AACE;AACJ;;AAIA;AAEA;;;AAEE;;AAEA;;AACA;AACF;AAEA;;;;AAGE;AACA;;AACA;;AAGF;;;;AAII;AACA;;;;AAMA;;;AAMJ;;AAEE;AACA;;AAEA;AACA;;AAGF;;AAsBgB;;AAEA;AACA;;;AAeF;AAEE;;;;;AAMA;AACA;;;AASA;AACF;AAEE;;AACA;AAAwB;;AAEtB;;AAEJ;AAiBhB;AACA;AAEM;;AAEN;AACA;;;"}

package/dist/components/menu/menu-content.d.ts

@@ -2,6 +2,12 @@ import { Menu as MenuPrimitive } from '@base-ui/react';
 export interface MenuContentProps extends Omit<MenuPrimitive.Positioner.Props, 'render' | 'className' | 'style'>, MenuPrimitive.Popup.Props {
     searchPlaceholder?: string;
 }
-export declare const MenuContent: import("react").ForwardRefExoticComponent<Omit<MenuContentProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-export declare const MenuSubContent: import("react").ForwardRefExoticComponent<Omit<MenuContentProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare function MenuContent({ ref, className, children, searchPlaceholder, render, finalFocus, style, sideOffset, align, onFocus, ...positionerProps }: MenuContentProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace MenuContent {
+    var displayName: string;
+}
+export declare function MenuSubContent(props: MenuContentProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace MenuSubContent {
+    var displayName: string;
+}
 //# sourceMappingURL=menu-content.d.ts.map

package/dist/components/menu/menu-content.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menu-content.d.ts","sourceRoot":"","sources":["../../../components/menu/menu-content.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,IAAI,IAAI,aAAa,EACtB,MAAM,gBAAgB,CAAC;AAYxB,MAAM,WAAW,gBACf,SAAQ,IAAI,CACR,aAAa,CAAC,UAAU,CAAC,KAAK,EAC9B,QAAQ,GAAG,WAAW,GAAG,OAAO,CACjC,EACD,aAAa,CAAC,KAAK,CAAC,KAAK;IAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED,eAAO,MAAM,WAAW,0HAoKvB,CAAC;AAGF,eAAO,MAAM,cAAc,0HAE1B,CAAC"}
+{"version":3,"file":"menu-content.d.ts","sourceRoot":"","sources":["../../../components/menu/menu-content.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,IAAI,IAAI,aAAa,EACtB,MAAM,gBAAgB,CAAC;AAYxB,MAAM,WAAW,gBACf,SAAQ,IAAI,CACR,aAAa,CAAC,UAAU,CAAC,KAAK,EAC9B,QAAQ,GAAG,WAAW,GAAG,OAAO,CACjC,EACD,aAAa,CAAC,KAAK,CAAC,KAAK;IAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED,wBAAgB,WAAW,CAAC,EAC1B,GAAG,EACH,SAAS,EACT,QAAQ,EACR,iBAA+B,EAC/B,MAAM,EACN,UAAU,EACV,KAAK,EACL,UAAc,EACd,KAAe,EACf,OAAO,EACP,GAAG,eAAe,EACnB,EAAE,gBAAgB,2CAgJlB;yBA5Je,WAAW;;;AA+J3B,wBAAgB,cAAc,CAAC,KAAK,EAAE,gBAAgB,2CAErD;yBAFe,cAAc"}

package/dist/components/menu/menu-content.js

@@ -2,12 +2,12 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { Menu, Autocomplete } from '@base-ui/react';
 import { cx } from 'class-variance-authority';
-import { forwardRef, useCallback, useRef } from 'react';
+import { useCallback, useRef } from 'react';
 import styles from './menu.module.css.js';
 import { useMenuContext } from './menu-root.js';
 import { isElementSubMenuTrigger, dispatchKeyboardEvent, isElementSubMenuOpen, KEYCODES } from './utils.js';
 
-const MenuContent = forwardRef(({ className, children, searchPlaceholder = 'Search...', render, finalFocus, style, sideOffset = 4, align = 'start', onFocus, ...positionerProps }, ref) => {
+function MenuContent({ ref, className, children, searchPlaceholder = 'Search...', render, finalFocus, style, sideOffset = 4, align = 'start', onFocus, ...positionerProps }) {
     const { autocomplete, inputValue, onInputValueChange, inputRef, isInitialRender, parent } = useMenuContext();
     const focusInput = useCallback(() => {
         if (document?.activeElement !== inputRef?.current)
@@ -48,9 +48,7 @@ const MenuContent = forwardRef(({ className, children, searchPlaceholder = 'Sear
     const blurStaleMenuItem = useCallback((index) => {
         const items = containerRef.current?.querySelectorAll('[role="option"]');
         const item = items?.[index];
-        if (!item ||
-            !isElementSubMenuTrigger(item) ||
-            !isElementSubMenuOpen(item))
+        if (!item || !isElementSubMenuTrigger(item) || !isElementSubMenuOpen(item))
             return;
         dispatchKeyboardEvent(item, KEYCODES.ESCAPE);
         item.dispatchEvent(new PointerEvent('pointerout', { bubbles: true }));
@@ -83,10 +81,12 @@ const MenuContent = forwardRef(({ className, children, searchPlaceholder = 'Sear
                                     checkAndOpenSubMenu();
                                 e.stopPropagation();
                             }, tabIndex: -1 }), jsx(Autocomplete.List, { className: styles.comboboxContent, ref: containerRef, children: children })] })) : (children) }) }) }));
-});
+}
 MenuContent.displayName = 'Menu.Content';
-const MenuSubContent = forwardRef(({ ...props }, ref) => jsx(MenuContent, { ref: ref, sideOffset: 2, ...props }));
-MenuSubContent.displayName = 'Menu.SubContent';
+function MenuSubContent(props) {
+    return jsx(MenuContent, { sideOffset: 2, ...props });
+}
+MenuSubContent.displayName = 'Menu.SubmenuContent';
 
 export { MenuContent, MenuSubContent };
 //# sourceMappingURL=menu-content.js.map

package/dist/components/menu/menu-content.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu-content.js","sources":["../../../components/menu/menu-content.tsx"],"sourcesContent":["'use client';\n\nimport {\n  Autocomplete as AutocompletePrimitive,\n  Menu as MenuPrimitive\n} from '@base-ui/react';\nimport { cx } from 'class-variance-authority';\nimport { forwardRef, KeyboardEvent, useCallback, useRef } from 'react';\nimport styles from './menu.module.css';\nimport { useMenuContext } from './menu-root';\nimport {\n  dispatchKeyboardEvent,\n  isElementSubMenuOpen,\n  isElementSubMenuTrigger,\n  KEYCODES\n} from './utils';\n\nexport interface MenuContentProps\n  extends Omit<\n      MenuPrimitive.Positioner.Props,\n      'render' | 'className' | 'style'\n    >,\n    MenuPrimitive.Popup.Props {\n  searchPlaceholder?: string;\n}\n\nexport const MenuContent = forwardRef<HTMLDivElement, MenuContentProps>(\n  (\n    {\n      className,\n      children,\n      searchPlaceholder = 'Search...',\n      render,\n      finalFocus,\n      style,\n      sideOffset = 4,\n      align = 'start',\n      onFocus,\n      ...positionerProps\n    },\n    ref\n  ) => {\n    const {\n      autocomplete,\n      inputValue,\n      onInputValueChange,\n      inputRef,\n      isInitialRender,\n      parent\n    } = useMenuContext();\n\n    const focusInput = useCallback(() => {\n      if (document?.activeElement !== inputRef?.current)\n        inputRef?.current?.focus();\n    }, [inputRef]);\n    const highlightedItem = useRef<\n      [index: number, reason: 'keyboard' | 'pointer' | 'none']\n    >([-1, 'none']);\n    const containerRef = useRef<HTMLDivElement>(null);\n\n    const highlightFirstItem = useCallback(() => {\n      if (!isInitialRender?.current) return;\n      isInitialRender.current = false;\n      const item = containerRef.current?.querySelector('[role=\"option\"]');\n      if (!item) return;\n      item.dispatchEvent(new PointerEvent('mousemove', { bubbles: true }));\n    }, [isInitialRender]);\n\n    const checkAndOpenSubMenu = useCallback(() => {\n      if (highlightedItem.current[0] === -1) return;\n      const items = containerRef.current?.querySelectorAll('[role=\"option\"]');\n      const item = items?.[highlightedItem.current[0]];\n      if (!item || !isElementSubMenuTrigger(item)) return;\n      dispatchKeyboardEvent(item, KEYCODES.ARROW_RIGHT);\n    }, []);\n\n    const checkAndCloseSubMenu = useCallback(\n      (e: KeyboardEvent<HTMLInputElement>) => {\n        if (highlightedItem.current[0] === -1) return;\n        const items = containerRef.current?.querySelectorAll('[role=\"option\"]');\n        const item = items?.[highlightedItem.current[0]];\n        if (\n          !item ||\n          !isElementSubMenuTrigger(item) ||\n          !isElementSubMenuOpen(item)\n        )\n          return;\n        dispatchKeyboardEvent(item, KEYCODES.ESCAPE);\n        e.stopPropagation();\n      },\n      []\n    );\n\n    const blurStaleMenuItem = useCallback((index: number) => {\n      const items = containerRef.current?.querySelectorAll('[role=\"option\"]');\n      const item = items?.[index];\n      if (\n        !item ||\n        !isElementSubMenuTrigger(item) ||\n        !isElementSubMenuOpen(item)\n      )\n        return;\n      dispatchKeyboardEvent(item, KEYCODES.ESCAPE);\n      item.dispatchEvent(new PointerEvent('pointerout', { bubbles: true }));\n    }, []);\n\n    return (\n      <MenuPrimitive.Portal>\n        <MenuPrimitive.Positioner\n          className={styles.positioner}\n          sideOffset={sideOffset}\n          align={align}\n          {...positionerProps}\n        >\n          <MenuPrimitive.Popup\n            ref={ref}\n            className={cx(\n              styles.content,\n              autocomplete && styles.comboboxContainer,\n              className\n            )}\n            style={style}\n            render={render}\n            finalFocus={finalFocus}\n            role={autocomplete ? 'dialog' : 'menu'}\n            onFocus={\n              autocomplete || parent?.autocomplete\n                ? e => {\n                    focusInput();\n                    e.stopPropagation();\n                    highlightFirstItem();\n                    onFocus?.(e);\n                  }\n                : undefined\n            }\n          >\n            {autocomplete ? (\n              <AutocompletePrimitive.Root\n                inline\n                open\n                value={inputValue}\n                onValueChange={(value: string) => onInputValueChange?.(value)}\n                autoHighlight={!!inputValue?.length}\n                mode='none'\n                loopFocus={false}\n                onItemHighlighted={(value, eventDetails) => {\n                  if (\n                    highlightedItem.current[1] === 'pointer' &&\n                    eventDetails.reason === 'keyboard'\n                  ) {\n                    // focus moved using keyboard after using pointer\n                    blurStaleMenuItem(highlightedItem.current[0]);\n                  }\n                  highlightedItem.current = [\n                    eventDetails.index,\n                    eventDetails.reason\n                  ];\n                }}\n              >\n                <AutocompletePrimitive.Input\n                  placeholder={searchPlaceholder}\n                  className={styles.comboboxInput}\n                  ref={inputRef}\n                  onPointerEnter={e => {\n                    focusInput();\n                  }}\n                  onKeyDown={e => {\n                    if (e.key === 'ArrowLeft') return;\n                    if (e.key === 'Escape') return checkAndCloseSubMenu(e);\n                    if (e.key === 'ArrowRight' || e.key === 'Enter')\n                      checkAndOpenSubMenu();\n                    e.stopPropagation();\n                  }}\n                  tabIndex={-1}\n                />\n                <AutocompletePrimitive.List\n                  className={styles.comboboxContent}\n                  ref={containerRef}\n                >\n                  {children}\n                </AutocompletePrimitive.List>\n              </AutocompletePrimitive.Root>\n            ) : (\n              children\n            )}\n          </MenuPrimitive.Popup>\n        </MenuPrimitive.Positioner>\n      </MenuPrimitive.Portal>\n    );\n  }\n);\nMenuContent.displayName = 'Menu.Content';\n\nexport const MenuSubContent = forwardRef<HTMLDivElement, MenuContentProps>(\n  ({ ...props }, ref) => <MenuContent ref={ref} sideOffset={2} {...props} />\n);\nMenuSubContent.displayName = 'Menu.SubContent';\n"],"names":[],"mappings":";;;;;;;;;AA0Ba;AAgBT;AASA;AACE;AACE;AACJ;;AAIA;AAEA;;;AAEE;;AAEA;;AACA;AACF;AAEA;;;;AAGE;AACA;;AACA;;AAGF;;;;AAII;AACA;;;;AAMA;;;AAMJ;;AAEE;AACA;;;;AAMA;AACA;;AAGF;;AAsBgB;;AAEA;AACA;;;AAeF;AAEE;;;;;AAMA;AACA;;;AASA;AACF;AAEE;;AACA;AAAwB;;AAEtB;;AAEJ;AAiBhB;AAEF;AAEO;AAGP;;"}
+{"version":3,"file":"menu-content.js","sources":["../../../components/menu/menu-content.tsx"],"sourcesContent":["'use client';\n\nimport {\n  Autocomplete as AutocompletePrimitive,\n  Menu as MenuPrimitive\n} from '@base-ui/react';\nimport { cx } from 'class-variance-authority';\nimport { KeyboardEvent, useCallback, useRef } from 'react';\nimport styles from './menu.module.css';\nimport { useMenuContext } from './menu-root';\nimport {\n  dispatchKeyboardEvent,\n  isElementSubMenuOpen,\n  isElementSubMenuTrigger,\n  KEYCODES\n} from './utils';\n\nexport interface MenuContentProps\n  extends Omit<\n      MenuPrimitive.Positioner.Props,\n      'render' | 'className' | 'style'\n    >,\n    MenuPrimitive.Popup.Props {\n  searchPlaceholder?: string;\n}\n\nexport function MenuContent({\n  ref,\n  className,\n  children,\n  searchPlaceholder = 'Search...',\n  render,\n  finalFocus,\n  style,\n  sideOffset = 4,\n  align = 'start',\n  onFocus,\n  ...positionerProps\n}: MenuContentProps) {\n  const {\n    autocomplete,\n    inputValue,\n    onInputValueChange,\n    inputRef,\n    isInitialRender,\n    parent\n  } = useMenuContext();\n\n  const focusInput = useCallback(() => {\n    if (document?.activeElement !== inputRef?.current)\n      inputRef?.current?.focus();\n  }, [inputRef]);\n  const highlightedItem = useRef<\n    [index: number, reason: 'keyboard' | 'pointer' | 'none']\n  >([-1, 'none']);\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const highlightFirstItem = useCallback(() => {\n    if (!isInitialRender?.current) return;\n    isInitialRender.current = false;\n    const item = containerRef.current?.querySelector('[role=\"option\"]');\n    if (!item) return;\n    item.dispatchEvent(new PointerEvent('mousemove', { bubbles: true }));\n  }, [isInitialRender]);\n\n  const checkAndOpenSubMenu = useCallback(() => {\n    if (highlightedItem.current[0] === -1) return;\n    const items = containerRef.current?.querySelectorAll('[role=\"option\"]');\n    const item = items?.[highlightedItem.current[0]];\n    if (!item || !isElementSubMenuTrigger(item)) return;\n    dispatchKeyboardEvent(item, KEYCODES.ARROW_RIGHT);\n  }, []);\n\n  const checkAndCloseSubMenu = useCallback(\n    (e: KeyboardEvent<HTMLInputElement>) => {\n      if (highlightedItem.current[0] === -1) return;\n      const items = containerRef.current?.querySelectorAll('[role=\"option\"]');\n      const item = items?.[highlightedItem.current[0]];\n      if (\n        !item ||\n        !isElementSubMenuTrigger(item) ||\n        !isElementSubMenuOpen(item)\n      )\n        return;\n      dispatchKeyboardEvent(item, KEYCODES.ESCAPE);\n      e.stopPropagation();\n    },\n    []\n  );\n\n  const blurStaleMenuItem = useCallback((index: number) => {\n    const items = containerRef.current?.querySelectorAll('[role=\"option\"]');\n    const item = items?.[index];\n    if (!item || !isElementSubMenuTrigger(item) || !isElementSubMenuOpen(item))\n      return;\n    dispatchKeyboardEvent(item, KEYCODES.ESCAPE);\n    item.dispatchEvent(new PointerEvent('pointerout', { bubbles: true }));\n  }, []);\n\n  return (\n    <MenuPrimitive.Portal>\n      <MenuPrimitive.Positioner\n        className={styles.positioner}\n        sideOffset={sideOffset}\n        align={align}\n        {...positionerProps}\n      >\n        <MenuPrimitive.Popup\n          ref={ref}\n          className={cx(\n            styles.content,\n            autocomplete && styles.comboboxContainer,\n            className\n          )}\n          style={style}\n          render={render}\n          finalFocus={finalFocus}\n          role={autocomplete ? 'dialog' : 'menu'}\n          onFocus={\n            autocomplete || parent?.autocomplete\n              ? e => {\n                  focusInput();\n                  e.stopPropagation();\n                  highlightFirstItem();\n                  onFocus?.(e);\n                }\n              : undefined\n          }\n        >\n          {autocomplete ? (\n            <AutocompletePrimitive.Root\n              inline\n              open\n              value={inputValue}\n              onValueChange={(value: string) => onInputValueChange?.(value)}\n              autoHighlight={!!inputValue?.length}\n              mode='none'\n              loopFocus={false}\n              onItemHighlighted={(value, eventDetails) => {\n                if (\n                  highlightedItem.current[1] === 'pointer' &&\n                  eventDetails.reason === 'keyboard'\n                ) {\n                  // focus moved using keyboard after using pointer\n                  blurStaleMenuItem(highlightedItem.current[0]);\n                }\n                highlightedItem.current = [\n                  eventDetails.index,\n                  eventDetails.reason\n                ];\n              }}\n            >\n              <AutocompletePrimitive.Input\n                placeholder={searchPlaceholder}\n                className={styles.comboboxInput}\n                ref={inputRef}\n                onPointerEnter={e => {\n                  focusInput();\n                }}\n                onKeyDown={e => {\n                  if (e.key === 'ArrowLeft') return;\n                  if (e.key === 'Escape') return checkAndCloseSubMenu(e);\n                  if (e.key === 'ArrowRight' || e.key === 'Enter')\n                    checkAndOpenSubMenu();\n                  e.stopPropagation();\n                }}\n                tabIndex={-1}\n              />\n              <AutocompletePrimitive.List\n                className={styles.comboboxContent}\n                ref={containerRef}\n              >\n                {children}\n              </AutocompletePrimitive.List>\n            </AutocompletePrimitive.Root>\n          ) : (\n            children\n          )}\n        </MenuPrimitive.Popup>\n      </MenuPrimitive.Positioner>\n    </MenuPrimitive.Portal>\n  );\n}\nMenuContent.displayName = 'Menu.Content';\n\nexport function MenuSubContent(props: MenuContentProps) {\n  return <MenuContent sideOffset={2} {...props} />;\n}\nMenuSubContent.displayName = 'Menu.SubmenuContent';\n"],"names":[],"mappings":";;;;;;;;;AA0BgB;AAad;AASA;AACE;AACE;AACJ;;AAIA;AAEA;;;AAEE;;AAEA;;AACA;AACF;AAEA;;;;AAGE;AACA;;AACA;;AAGF;;;;AAII;AACA;;;;AAMA;;;AAMJ;;AAEE;AACA;;AAEA;AACA;;AAGF;;AAsBgB;;AAEA;AACA;;;AAeF;AAEE;;;;;AAMA;AACA;;;AASA;AACF;AAEE;;AACA;AAAwB;;AAEtB;;AAEJ;AAiBhB;AACA;AAEM;;AAEN;AACA;;"}

package/dist/components/menu/menu-item.cjs

@@ -3,12 +3,11 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var react = require('@base-ui/react');
-var React = require('react');
 var cell = require('./cell.cjs');
 var menuRoot = require('./menu-root.cjs');
 var utils = require('./utils.cjs');
 
-const MenuItem = React.forwardRef(({ children, value, leadingIcon, trailingIcon, render, ...props }, ref) => {
+function MenuItem({ children, value, leadingIcon, trailingIcon, render, ...props }) {
     const { autocomplete, inputValue, shouldFilter } = menuRoot.useMenuContext();
     const cell$1 = render ?? (jsxRuntime.jsx(cell.Cell, { leadingIcon: leadingIcon, trailingIcon: trailingIcon }));
     // In auto mode, hide items that don't match the search value
@@ -16,14 +15,14 @@ const MenuItem = React.forwardRef(({ children, value, leadingIcon, trailingIcon,
         return null;
     }
     if (autocomplete) {
-        return (jsxRuntime.jsx(react.Autocomplete.Item, { ref: ref, value: value, render: jsxRuntime.jsx(react.Menu.Item, { render: cell$1 }), ...props, children: children }));
+        return (jsxRuntime.jsx(react.Autocomplete.Item, { value: value, render: jsxRuntime.jsx(react.Menu.Item, { render: cell$1 }), ...props, children: children }));
     }
-    return (jsxRuntime.jsx(react.Menu.Item, { ref: ref, render: cell$1, ...props, onFocus: e => {
+    return (jsxRuntime.jsx(react.Menu.Item, { render: cell$1, ...props, onFocus: e => {
             e.stopPropagation();
             e.preventDefault();
             e.preventBaseUIHandler();
         }, children: children }));
-});
+}
 MenuItem.displayName = 'Menu.Item';
 
 exports.MenuItem = MenuItem;

package/dist/components/menu/menu-item.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"menu-item.cjs","sources":["../../../components/menu/menu-item.tsx"],"sourcesContent":["'use client';\n\nimport {\n  Autocomplete as AutocompletePrimitive,\n  Menu as MenuPrimitive\n} from '@base-ui/react';\nimport { forwardRef } from 'react';\nimport { Cell, CellBaseProps } from './cell';\nimport { useMenuContext } from './menu-root';\nimport { getMatch } from './utils';\n\nexport interface MenuItemProps extends MenuPrimitive.Item.Props, CellBaseProps {\n  value?: string;\n}\n\nexport const MenuItem = forwardRef<HTMLDivElement, MenuItemProps>(\n  ({ children, value, leadingIcon, trailingIcon, render, ...props }, ref) => {\n    const { autocomplete, inputValue, shouldFilter } = useMenuContext();\n\n    const cell = render ?? (\n      <Cell leadingIcon={leadingIcon} trailingIcon={trailingIcon} />\n    );\n\n    // In auto mode, hide items that don't match the search value\n    if (shouldFilter && !getMatch(value, children, inputValue)) {\n      return null;\n    }\n\n    if (autocomplete) {\n      return (\n        <AutocompletePrimitive.Item\n          ref={ref}\n          value={value}\n          render={<MenuPrimitive.Item render={cell} />}\n          {...props}\n        >\n          {children}\n        </AutocompletePrimitive.Item>\n      );\n    }\n\n    return (\n      <MenuPrimitive.Item\n        ref={ref}\n        render={cell}\n        {...props}\n        onFocus={e => {\n          e.stopPropagation();\n          e.preventDefault();\n          e.preventBaseUIHandler();\n        }}\n      >\n        {children}\n      </MenuPrimitive.Item>\n    );\n  }\n);\nMenuItem.displayName = 'Menu.Item';\n"],"names":[],"mappings":";;;;;;;;;;AAea;;AAIT;;AAKA;AACE;;;AAIA;;;;;;AAqBE;AAKN;AAEF;;"}
+{"version":3,"file":"menu-item.cjs","sources":["../../../components/menu/menu-item.tsx"],"sourcesContent":["'use client';\n\nimport {\n  Autocomplete as AutocompletePrimitive,\n  Menu as MenuPrimitive\n} from '@base-ui/react';\nimport { Cell, CellBaseProps } from './cell';\nimport { useMenuContext } from './menu-root';\nimport { getMatch } from './utils';\n\nexport interface MenuItemProps extends MenuPrimitive.Item.Props, CellBaseProps {\n  value?: string;\n}\n\nexport function MenuItem({\n  children,\n  value,\n  leadingIcon,\n  trailingIcon,\n  render,\n  ...props\n}: MenuItemProps) {\n  const { autocomplete, inputValue, shouldFilter } = useMenuContext();\n\n  const cell = render ?? (\n    <Cell leadingIcon={leadingIcon} trailingIcon={trailingIcon} />\n  );\n\n  // In auto mode, hide items that don't match the search value\n  if (shouldFilter && !getMatch(value, children, inputValue)) {\n    return null;\n  }\n\n  if (autocomplete) {\n    return (\n      <AutocompletePrimitive.Item\n        value={value}\n        render={<MenuPrimitive.Item render={cell} />}\n        {...props}\n      >\n        {children}\n      </AutocompletePrimitive.Item>\n    );\n  }\n\n  return (\n    <MenuPrimitive.Item\n      render={cell}\n      {...props}\n      onFocus={e => {\n        e.stopPropagation();\n        e.preventDefault();\n        e.preventBaseUIHandler();\n      }}\n    >\n      {children}\n    </MenuPrimitive.Item>\n  );\n}\nMenuItem.displayName = 'Menu.Item';\n"],"names":[],"mappings":";;;;;;;;;;;AAwBE;;AAKA;AACE;;;;;AAeF;;;;AAQI;AAKN;AACA;;"}

package/dist/components/menu/menu-item.d.ts

@@ -3,5 +3,8 @@ import { CellBaseProps } from './cell';
 export interface MenuItemProps extends MenuPrimitive.Item.Props, CellBaseProps {
     value?: string;
 }
-export declare const MenuItem: import("react").ForwardRefExoticComponent<Omit<MenuItemProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare function MenuItem({ children, value, leadingIcon, trailingIcon, render, ...props }: MenuItemProps): import("react/jsx-runtime").JSX.Element | null;
+export declare namespace MenuItem {
+    var displayName: string;
+}
 //# sourceMappingURL=menu-item.d.ts.map

package/dist/components/menu/menu-item.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menu-item.d.ts","sourceRoot":"","sources":["../../../components/menu/menu-item.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,IAAI,IAAI,aAAa,EACtB,MAAM,gBAAgB,CAAC;AAExB,OAAO,EAAQ,aAAa,EAAE,MAAM,QAAQ,CAAC;AAI7C,MAAM,WAAW,aAAc,SAAQ,aAAa,CAAC,IAAI,CAAC,KAAK,EAAE,aAAa;IAC5E,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,QAAQ,uHAyCpB,CAAC"}
+{"version":3,"file":"menu-item.d.ts","sourceRoot":"","sources":["../../../components/menu/menu-item.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,IAAI,IAAI,aAAa,EACtB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAQ,aAAa,EAAE,MAAM,QAAQ,CAAC;AAI7C,MAAM,WAAW,aAAc,SAAQ,aAAa,CAAC,IAAI,CAAC,KAAK,EAAE,aAAa;IAC5E,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,QAAQ,CAAC,EACvB,QAAQ,EACR,KAAK,EACL,WAAW,EACX,YAAY,EACZ,MAAM,EACN,GAAG,KAAK,EACT,EAAE,aAAa,kDAqCf;yBA5Ce,QAAQ"}

package/dist/components/menu/menu-item.js

@@ -1,12 +1,11 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { Autocomplete, Menu } from '@base-ui/react';
-import { forwardRef } from 'react';
 import { Cell } from './cell.js';
 import { useMenuContext } from './menu-root.js';
 import { getMatch } from './utils.js';
 
-const MenuItem = forwardRef(({ children, value, leadingIcon, trailingIcon, render, ...props }, ref) => {
+function MenuItem({ children, value, leadingIcon, trailingIcon, render, ...props }) {
     const { autocomplete, inputValue, shouldFilter } = useMenuContext();
     const cell = render ?? (jsx(Cell, { leadingIcon: leadingIcon, trailingIcon: trailingIcon }));
     // In auto mode, hide items that don't match the search value
@@ -14,14 +13,14 @@ const MenuItem = forwardRef(({ children, value, leadingIcon, trailingIcon, rende
         return null;
     }
     if (autocomplete) {
-        return (jsx(Autocomplete.Item, { ref: ref, value: value, render: jsx(Menu.Item, { render: cell }), ...props, children: children }));
+        return (jsx(Autocomplete.Item, { value: value, render: jsx(Menu.Item, { render: cell }), ...props, children: children }));
     }
-    return (jsx(Menu.Item, { ref: ref, render: cell, ...props, onFocus: e => {
+    return (jsx(Menu.Item, { render: cell, ...props, onFocus: e => {
             e.stopPropagation();
             e.preventDefault();
             e.preventBaseUIHandler();
         }, children: children }));
-});
+}
 MenuItem.displayName = 'Menu.Item';
 
 export { MenuItem };

package/dist/components/menu/menu-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu-item.js","sources":["../../../components/menu/menu-item.tsx"],"sourcesContent":["'use client';\n\nimport {\n  Autocomplete as AutocompletePrimitive,\n  Menu as MenuPrimitive\n} from '@base-ui/react';\nimport { forwardRef } from 'react';\nimport { Cell, CellBaseProps } from './cell';\nimport { useMenuContext } from './menu-root';\nimport { getMatch } from './utils';\n\nexport interface MenuItemProps extends MenuPrimitive.Item.Props, CellBaseProps {\n  value?: string;\n}\n\nexport const MenuItem = forwardRef<HTMLDivElement, MenuItemProps>(\n  ({ children, value, leadingIcon, trailingIcon, render, ...props }, ref) => {\n    const { autocomplete, inputValue, shouldFilter } = useMenuContext();\n\n    const cell = render ?? (\n      <Cell leadingIcon={leadingIcon} trailingIcon={trailingIcon} />\n    );\n\n    // In auto mode, hide items that don't match the search value\n    if (shouldFilter && !getMatch(value, children, inputValue)) {\n      return null;\n    }\n\n    if (autocomplete) {\n      return (\n        <AutocompletePrimitive.Item\n          ref={ref}\n          value={value}\n          render={<MenuPrimitive.Item render={cell} />}\n          {...props}\n        >\n          {children}\n        </AutocompletePrimitive.Item>\n      );\n    }\n\n    return (\n      <MenuPrimitive.Item\n        ref={ref}\n        render={cell}\n        {...props}\n        onFocus={e => {\n          e.stopPropagation();\n          e.preventDefault();\n          e.preventBaseUIHandler();\n        }}\n      >\n        {children}\n      </MenuPrimitive.Item>\n    );\n  }\n);\nMenuItem.displayName = 'Menu.Item';\n"],"names":[],"mappings":";;;;;;;;AAea;;AAIT;;AAKA;AACE;;;AAIA;;;;;;AAqBE;AAKN;AAEF;;"}
+{"version":3,"file":"menu-item.js","sources":["../../../components/menu/menu-item.tsx"],"sourcesContent":["'use client';\n\nimport {\n  Autocomplete as AutocompletePrimitive,\n  Menu as MenuPrimitive\n} from '@base-ui/react';\nimport { Cell, CellBaseProps } from './cell';\nimport { useMenuContext } from './menu-root';\nimport { getMatch } from './utils';\n\nexport interface MenuItemProps extends MenuPrimitive.Item.Props, CellBaseProps {\n  value?: string;\n}\n\nexport function MenuItem({\n  children,\n  value,\n  leadingIcon,\n  trailingIcon,\n  render,\n  ...props\n}: MenuItemProps) {\n  const { autocomplete, inputValue, shouldFilter } = useMenuContext();\n\n  const cell = render ?? (\n    <Cell leadingIcon={leadingIcon} trailingIcon={trailingIcon} />\n  );\n\n  // In auto mode, hide items that don't match the search value\n  if (shouldFilter && !getMatch(value, children, inputValue)) {\n    return null;\n  }\n\n  if (autocomplete) {\n    return (\n      <AutocompletePrimitive.Item\n        value={value}\n        render={<MenuPrimitive.Item render={cell} />}\n        {...props}\n      >\n        {children}\n      </AutocompletePrimitive.Item>\n    );\n  }\n\n  return (\n    <MenuPrimitive.Item\n      render={cell}\n      {...props}\n      onFocus={e => {\n        e.stopPropagation();\n        e.preventDefault();\n        e.preventBaseUIHandler();\n      }}\n    >\n      {children}\n    </MenuPrimitive.Item>\n  );\n}\nMenuItem.displayName = 'Menu.Item';\n"],"names":[],"mappings":";;;;;;;;;AAwBE;;AAKA;AACE;;;;;AAeF;;;;AAQI;AAKN;AACA;;"}

package/dist/components/menu/menu-misc.cjs

@@ -8,31 +8,33 @@ var React = require('react');
 var menu_module = require('./menu.module.css.cjs');
 var menuRoot = require('./menu-root.cjs');
 
-const MenuGroup = React.forwardRef(({ className, children, ...props }, ref) => {
+function MenuGroup({ className, children, ...props }) {
     const { shouldFilter } = menuRoot.useMenuContext();
     if (shouldFilter) {
         return jsxRuntime.jsx(React.Fragment, { children: children });
     }
-    return (jsxRuntime.jsx(menu.Menu.Group, { ref: ref, className: classVarianceAuthority.cx(className), ...props, children: children }));
-});
+    return (jsxRuntime.jsx(menu.Menu.Group, { className: classVarianceAuthority.cx(className), ...props, children: children }));
+}
 MenuGroup.displayName = 'Menu.Group';
-const MenuLabel = React.forwardRef(({ className, ...props }, ref) => {
+function MenuLabel({ className, ...props }) {
     const { shouldFilter } = menuRoot.useMenuContext();
     if (shouldFilter) {
         return null;
     }
-    return (jsxRuntime.jsx(menu.Menu.GroupLabel, { ref: ref, className: classVarianceAuthority.cx(menu_module.default.label, className), ...props }));
-});
+    return (jsxRuntime.jsx(menu.Menu.GroupLabel, { className: classVarianceAuthority.cx(menu_module.default.label, className), ...props }));
+}
 MenuLabel.displayName = 'Menu.Label';
-const MenuSeparator = React.forwardRef(({ className, ...props }, ref) => {
+function MenuSeparator({ className, ...props }) {
     const { shouldFilter } = menuRoot.useMenuContext();
     if (shouldFilter) {
         return null;
     }
-    return (jsxRuntime.jsx("div", { ref: ref, role: 'separator', className: classVarianceAuthority.cx(menu_module.default.separator, className), ...props }));
-});
+    return (jsxRuntime.jsx("div", { role: 'separator', className: classVarianceAuthority.cx(menu_module.default.separator, className), ...props }));
+}
 MenuSeparator.displayName = 'Menu.Separator';
-const MenuEmptyState = React.forwardRef(({ className, children, ...props }, ref) => (jsxRuntime.jsx("div", { ref: ref, className: classVarianceAuthority.cx(menu_module.default.empty, className), ...props, children: children })));
+function MenuEmptyState({ className, children, ...props }) {
+    return (jsxRuntime.jsx("div", { className: classVarianceAuthority.cx(menu_module.default.empty, className), ...props, children: children }));
+}
 MenuEmptyState.displayName = 'Menu.EmptyState';
 
 exports.MenuEmptyState = MenuEmptyState;

package/dist/components/menu/menu-misc.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"menu-misc.cjs","sources":["../../../components/menu/menu-misc.tsx"],"sourcesContent":["'use client';\n\nimport { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport { cx } from 'class-variance-authority';\nimport { Fragment, forwardRef, HTMLAttributes, ReactNode } from 'react';\nimport styles from './menu.module.css';\nimport { useMenuContext } from './menu-root';\n\nexport const MenuGroup = forwardRef<HTMLDivElement, MenuPrimitive.Group.Props>(\n  ({ className, children, ...props }, ref) => {\n    const { shouldFilter } = useMenuContext();\n\n    if (shouldFilter) {\n      return <Fragment>{children}</Fragment>;\n    }\n\n    return (\n      <MenuPrimitive.Group ref={ref} className={cx(className)} {...props}>\n        {children}\n      </MenuPrimitive.Group>\n    );\n  }\n);\nMenuGroup.displayName = 'Menu.Group';\n\nexport const MenuLabel = forwardRef<\n  HTMLDivElement,\n  MenuPrimitive.GroupLabel.Props\n>(({ className, ...props }, ref) => {\n  const { shouldFilter } = useMenuContext();\n\n  if (shouldFilter) {\n    return null;\n  }\n\n  return (\n    <MenuPrimitive.GroupLabel\n      ref={ref}\n      className={cx(styles.label, className)}\n      {...props}\n    />\n  );\n});\nMenuLabel.displayName = 'Menu.Label';\n\nexport const MenuSeparator = forwardRef<\n  HTMLDivElement,\n  HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => {\n  const { shouldFilter } = useMenuContext();\n\n  if (shouldFilter) {\n    return null;\n  }\n\n  return (\n    <div\n      ref={ref}\n      role='separator'\n      className={cx(styles.separator, className)}\n      {...props}\n    />\n  );\n});\nMenuSeparator.displayName = 'Menu.Separator';\n\nexport const MenuEmptyState = forwardRef<\n  HTMLDivElement,\n  HTMLAttributes<HTMLDivElement> & {\n    children: ReactNode;\n  }\n>(({ className, children, ...props }, ref) => (\n  <div ref={ref} className={cx(styles.empty, className)} {...props}>\n    {children}\n  </div>\n));\nMenuEmptyState.displayName = 'Menu.EmptyState';\n"],"names":[],"mappings":";;;;;;;;;;AAQa;AAET;;AAGE;;;AAQJ;AAEF;AAEa;AAIX;;AAGE;;;AAUJ;AACA;AAEa;AAIX;;AAGE;;;AAWJ;AACA;AAEa;AAUb;;;;;"}
+{"version":3,"file":"menu-misc.cjs","sources":["../../../components/menu/menu-misc.tsx"],"sourcesContent":["'use client';\n\nimport { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport { cx } from 'class-variance-authority';\nimport { ComponentProps, Fragment, ReactNode } from 'react';\nimport styles from './menu.module.css';\nimport { useMenuContext } from './menu-root';\n\nexport function MenuGroup({\n  className,\n  children,\n  ...props\n}: MenuPrimitive.Group.Props) {\n  const { shouldFilter } = useMenuContext();\n\n  if (shouldFilter) {\n    return <Fragment>{children}</Fragment>;\n  }\n\n  return (\n    <MenuPrimitive.Group className={cx(className)} {...props}>\n      {children}\n    </MenuPrimitive.Group>\n  );\n}\nMenuGroup.displayName = 'Menu.Group';\n\nexport function MenuLabel({\n  className,\n  ...props\n}: MenuPrimitive.GroupLabel.Props) {\n  const { shouldFilter } = useMenuContext();\n\n  if (shouldFilter) {\n    return null;\n  }\n\n  return (\n    <MenuPrimitive.GroupLabel\n      className={cx(styles.label, className)}\n      {...props}\n    />\n  );\n}\nMenuLabel.displayName = 'Menu.Label';\n\nexport function MenuSeparator({ className, ...props }: ComponentProps<'div'>) {\n  const { shouldFilter } = useMenuContext();\n\n  if (shouldFilter) {\n    return null;\n  }\n\n  return (\n    <div\n      role='separator'\n      className={cx(styles.separator, className)}\n      {...props}\n    />\n  );\n}\nMenuSeparator.displayName = 'Menu.Separator';\n\nexport function MenuEmptyState({\n  className,\n  children,\n  ...props\n}: ComponentProps<'div'> & { children: ReactNode }) {\n  return (\n    <div className={cx(styles.empty, className)} {...props}>\n      {children}\n    </div>\n  );\n}\nMenuEmptyState.displayName = 'Menu.EmptyState';\n"],"names":[],"mappings":";;;;;;;;;;AAQM;AAKJ;;AAGE;;AAGF;AAKF;AACA;AAEM;AAIJ;;AAGE;;;AASJ;AACA;AAEM;AACJ;;AAGE;;;AAUJ;AACA;AAEM;AAKJ;AAKF;AACA;;;;;"}

package/dist/components/menu/menu-misc.d.ts

@@ -1,8 +1,21 @@
-import { HTMLAttributes, ReactNode } from 'react';
-export declare const MenuGroup: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react/menu").MenuGroupProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-export declare const MenuLabel: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react/menu").MenuGroupLabelProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-export declare const MenuSeparator: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
-export declare const MenuEmptyState: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
+import { Menu as MenuPrimitive } from '@base-ui/react/menu';
+import { ComponentProps, ReactNode } from 'react';
+export declare function MenuGroup({ className, children, ...props }: MenuPrimitive.Group.Props): import("react/jsx-runtime").JSX.Element;
+export declare namespace MenuGroup {
+    var displayName: string;
+}
+export declare function MenuLabel({ className, ...props }: MenuPrimitive.GroupLabel.Props): import("react/jsx-runtime").JSX.Element | null;
+export declare namespace MenuLabel {
+    var displayName: string;
+}
+export declare function MenuSeparator({ className, ...props }: ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element | null;
+export declare namespace MenuSeparator {
+    var displayName: string;
+}
+export declare function MenuEmptyState({ className, children, ...props }: ComponentProps<'div'> & {
     children: ReactNode;
-} & import("react").RefAttributes<HTMLDivElement>>;
+}): import("react/jsx-runtime").JSX.Element;
+export declare namespace MenuEmptyState {
+    var displayName: string;
+}
 //# sourceMappingURL=menu-misc.d.ts.map

package/dist/components/menu/menu-misc.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menu-misc.d.ts","sourceRoot":"","sources":["../../../components/menu/menu-misc.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAwB,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIxE,eAAO,MAAM,SAAS,sJAcrB,CAAC;AAGF,eAAO,MAAM,SAAS,2JAiBpB,CAAC;AAGH,eAAO,MAAM,aAAa,2HAkBxB,CAAC;AAGH,eAAO,MAAM,cAAc;cAGb,SAAS;kDAMrB,CAAC"}
+{"version":3,"file":"menu-misc.d.ts","sourceRoot":"","sources":["../../../components/menu/menu-misc.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,IAAI,IAAI,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAE5D,OAAO,EAAE,cAAc,EAAY,SAAS,EAAE,MAAM,OAAO,CAAC;AAI5D,wBAAgB,SAAS,CAAC,EACxB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,aAAa,CAAC,KAAK,CAAC,KAAK,2CAY3B;yBAhBe,SAAS;;;AAmBzB,wBAAgB,SAAS,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,aAAa,CAAC,UAAU,CAAC,KAAK,kDAahC;yBAhBe,SAAS;;;AAmBzB,wBAAgB,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,KAAK,CAAC,kDAc3E;yBAde,aAAa;;;AAiB7B,wBAAgB,cAAc,CAAC,EAC7B,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,KAAK,CAAC,GAAG;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAMjD;yBAVe,cAAc"}

package/dist/components/menu/menu-misc.js

@@ -2,35 +2,37 @@
 import { jsx } from 'react/jsx-runtime';
 import { Menu } from '@base-ui/react/menu';
 import { cx } from 'class-variance-authority';
-import { forwardRef, Fragment } from 'react';
+import { Fragment } from 'react';
 import styles from './menu.module.css.js';
 import { useMenuContext } from './menu-root.js';
 
-const MenuGroup = forwardRef(({ className, children, ...props }, ref) => {
+function MenuGroup({ className, children, ...props }) {
     const { shouldFilter } = useMenuContext();
     if (shouldFilter) {
         return jsx(Fragment, { children: children });
     }
-    return (jsx(Menu.Group, { ref: ref, className: cx(className), ...props, children: children }));
-});
+    return (jsx(Menu.Group, { className: cx(className), ...props, children: children }));
+}
 MenuGroup.displayName = 'Menu.Group';
-const MenuLabel = forwardRef(({ className, ...props }, ref) => {
+function MenuLabel({ className, ...props }) {
     const { shouldFilter } = useMenuContext();
     if (shouldFilter) {
         return null;
     }
-    return (jsx(Menu.GroupLabel, { ref: ref, className: cx(styles.label, className), ...props }));
-});
+    return (jsx(Menu.GroupLabel, { className: cx(styles.label, className), ...props }));
+}
 MenuLabel.displayName = 'Menu.Label';
-const MenuSeparator = forwardRef(({ className, ...props }, ref) => {
+function MenuSeparator({ className, ...props }) {
     const { shouldFilter } = useMenuContext();
     if (shouldFilter) {
         return null;
     }
-    return (jsx("div", { ref: ref, role: 'separator', className: cx(styles.separator, className), ...props }));
-});
+    return (jsx("div", { role: 'separator', className: cx(styles.separator, className), ...props }));
+}
 MenuSeparator.displayName = 'Menu.Separator';
-const MenuEmptyState = forwardRef(({ className, children, ...props }, ref) => (jsx("div", { ref: ref, className: cx(styles.empty, className), ...props, children: children })));
+function MenuEmptyState({ className, children, ...props }) {
+    return (jsx("div", { className: cx(styles.empty, className), ...props, children: children }));
+}
 MenuEmptyState.displayName = 'Menu.EmptyState';
 
 export { MenuEmptyState, MenuGroup, MenuLabel, MenuSeparator };

package/dist/components/menu/menu-misc.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu-misc.js","sources":["../../../components/menu/menu-misc.tsx"],"sourcesContent":["'use client';\n\nimport { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport { cx } from 'class-variance-authority';\nimport { Fragment, forwardRef, HTMLAttributes, ReactNode } from 'react';\nimport styles from './menu.module.css';\nimport { useMenuContext } from './menu-root';\n\nexport const MenuGroup = forwardRef<HTMLDivElement, MenuPrimitive.Group.Props>(\n  ({ className, children, ...props }, ref) => {\n    const { shouldFilter } = useMenuContext();\n\n    if (shouldFilter) {\n      return <Fragment>{children}</Fragment>;\n    }\n\n    return (\n      <MenuPrimitive.Group ref={ref} className={cx(className)} {...props}>\n        {children}\n      </MenuPrimitive.Group>\n    );\n  }\n);\nMenuGroup.displayName = 'Menu.Group';\n\nexport const MenuLabel = forwardRef<\n  HTMLDivElement,\n  MenuPrimitive.GroupLabel.Props\n>(({ className, ...props }, ref) => {\n  const { shouldFilter } = useMenuContext();\n\n  if (shouldFilter) {\n    return null;\n  }\n\n  return (\n    <MenuPrimitive.GroupLabel\n      ref={ref}\n      className={cx(styles.label, className)}\n      {...props}\n    />\n  );\n});\nMenuLabel.displayName = 'Menu.Label';\n\nexport const MenuSeparator = forwardRef<\n  HTMLDivElement,\n  HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => {\n  const { shouldFilter } = useMenuContext();\n\n  if (shouldFilter) {\n    return null;\n  }\n\n  return (\n    <div\n      ref={ref}\n      role='separator'\n      className={cx(styles.separator, className)}\n      {...props}\n    />\n  );\n});\nMenuSeparator.displayName = 'Menu.Separator';\n\nexport const MenuEmptyState = forwardRef<\n  HTMLDivElement,\n  HTMLAttributes<HTMLDivElement> & {\n    children: ReactNode;\n  }\n>(({ className, children, ...props }, ref) => (\n  <div ref={ref} className={cx(styles.empty, className)} {...props}>\n    {children}\n  </div>\n));\nMenuEmptyState.displayName = 'Menu.EmptyState';\n"],"names":[],"mappings":";;;;;;;;AAQa;AAET;;AAGE;;;AAQJ;AAEF;AAEa;AAIX;;AAGE;;;AAUJ;AACA;AAEa;AAIX;;AAGE;;;AAWJ;AACA;AAEa;AAUb;;"}
+{"version":3,"file":"menu-misc.js","sources":["../../../components/menu/menu-misc.tsx"],"sourcesContent":["'use client';\n\nimport { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport { cx } from 'class-variance-authority';\nimport { ComponentProps, Fragment, ReactNode } from 'react';\nimport styles from './menu.module.css';\nimport { useMenuContext } from './menu-root';\n\nexport function MenuGroup({\n  className,\n  children,\n  ...props\n}: MenuPrimitive.Group.Props) {\n  const { shouldFilter } = useMenuContext();\n\n  if (shouldFilter) {\n    return <Fragment>{children}</Fragment>;\n  }\n\n  return (\n    <MenuPrimitive.Group className={cx(className)} {...props}>\n      {children}\n    </MenuPrimitive.Group>\n  );\n}\nMenuGroup.displayName = 'Menu.Group';\n\nexport function MenuLabel({\n  className,\n  ...props\n}: MenuPrimitive.GroupLabel.Props) {\n  const { shouldFilter } = useMenuContext();\n\n  if (shouldFilter) {\n    return null;\n  }\n\n  return (\n    <MenuPrimitive.GroupLabel\n      className={cx(styles.label, className)}\n      {...props}\n    />\n  );\n}\nMenuLabel.displayName = 'Menu.Label';\n\nexport function MenuSeparator({ className, ...props }: ComponentProps<'div'>) {\n  const { shouldFilter } = useMenuContext();\n\n  if (shouldFilter) {\n    return null;\n  }\n\n  return (\n    <div\n      role='separator'\n      className={cx(styles.separator, className)}\n      {...props}\n    />\n  );\n}\nMenuSeparator.displayName = 'Menu.Separator';\n\nexport function MenuEmptyState({\n  className,\n  children,\n  ...props\n}: ComponentProps<'div'> & { children: ReactNode }) {\n  return (\n    <div className={cx(styles.empty, className)} {...props}>\n      {children}\n    </div>\n  );\n}\nMenuEmptyState.displayName = 'Menu.EmptyState';\n"],"names":[],"mappings":";;;;;;;;AAQM;AAKJ;;AAGE;;AAGF;AAKF;AACA;AAEM;AAIJ;;AAGE;;;AASJ;AACA;AAEM;AACJ;;AAGE;;;AAUJ;AACA;AAEM;AAKJ;AAKF;AACA;;"}