@rescui/menu 0.14.2-RUI-308-Fix-select-issues-405b9fa40.12 → 0.15.0

package/lib/parts/group-header.js

@@ -1,4 +1,5 @@
 "use client";
+import { c } from 'react-compiler-runtime';
 import React from 'react';
 import cn from 'classnames';
 import PropTypes from 'prop-types';
@@ -15,21 +16,52 @@ const THEME_CLASS = {
   dark: styles.groupHeaderThemeDark
 };
 
-function GroupHeader(_ref) {
-  let {
-    className = null,
+function GroupHeader(t0) {
+  const $ = c(9);
+  const {
+    className: t1,
     text,
-    size: propsSize = 'm',
+    size: t2,
     theme: propsTheme
-  } = _ref;
+  } = t0;
+  const className = t1 === undefined ? null : t1;
+  const propsSize = t2 === undefined ? "m" : t2;
   const menuContext = useMenuContext();
-  const Tag = menuContext.wrapWithLi ? 'li' : 'span';
+  const Tag = menuContext.wrapWithLi ? "li" : "span";
   const actualTheme = useThemeWithUndefined(menuContext.theme ?? propsTheme);
-  return /*#__PURE__*/React.createElement(Tag, {
-    className: cn(styles.groupHeader, SIZE_CLASS[menuContext.size ?? propsSize], THEME_CLASS[actualTheme], className),
-    "data-rs-internal": 'menu__group-header',
-    role: menuContext.keyboardNavigationEnabled ? 'presentation' : undefined
-  }, text);
+  const t3 = SIZE_CLASS[menuContext.size ?? propsSize];
+  const t4 = THEME_CLASS[actualTheme];
+  let t5;
+
+  if ($[0] !== className || $[1] !== t3 || $[2] !== t4) {
+    t5 = cn(styles.groupHeader, t3, t4, className);
+    $[0] = className;
+    $[1] = t3;
+    $[2] = t4;
+    $[3] = t5;
+  } else {
+    t5 = $[3];
+  }
+
+  const t6 = menuContext.keyboardNavigationEnabled ? "presentation" : undefined;
+  let t7;
+
+  if ($[4] !== Tag || $[5] !== t5 || $[6] !== t6 || $[7] !== text) {
+    t7 = /*#__PURE__*/React.createElement(Tag, {
+      className: t5,
+      "data-rs-internal": "menu__group-header",
+      role: t6
+    }, text);
+    $[4] = Tag;
+    $[5] = t5;
+    $[6] = t6;
+    $[7] = text;
+    $[8] = t7;
+  } else {
+    t7 = $[8];
+  }
+
+  return t7;
 }
 
 GroupHeader.propTypes = {

package/lib/parts/menu-context.js

@@ -1,4 +1,5 @@
 "use client";
+import { c } from 'react-compiler-runtime';
 import React, { useContext } from 'react';
 import PropTypes from 'prop-types';
 const DEFAULT_MENU_CONTEXT = {
@@ -14,26 +15,82 @@ const DEFAULT_MENU_CONTEXT = {
 };
 const MenuContext = /*#__PURE__*/React.createContext(DEFAULT_MENU_CONTEXT);
 
-const useMenuContext = () => useContext(MenuContext);
-
-const MenuProvider = _ref => {
-  let {
-    children,
-    disabled = DEFAULT_MENU_CONTEXT.disabled,
-    wrapWithLi = DEFAULT_MENU_CONTEXT.wrapWithLi,
-    registerItem = DEFAULT_MENU_CONTEXT.registerItem,
-    unregisterItem = DEFAULT_MENU_CONTEXT.unregisterItem,
-    ...restProps
-  } = _ref;
-  return /*#__PURE__*/React.createElement(MenuContext.Provider, {
-    value: {
+const useMenuContext = () => {
+  return useContext(MenuContext);
+};
+
+const MenuProvider = t0 => {
+  const $ = c(16);
+  let children;
+  let restProps;
+  let t1;
+  let t2;
+  let t3;
+  let t4;
+
+  if ($[0] !== t0) {
+    ({
+      children,
+      disabled: t1,
+      wrapWithLi: t2,
+      registerItem: t3,
+      unregisterItem: t4,
+      ...restProps
+    } = t0);
+    $[0] = t0;
+    $[1] = children;
+    $[2] = restProps;
+    $[3] = t1;
+    $[4] = t2;
+    $[5] = t3;
+    $[6] = t4;
+  } else {
+    children = $[1];
+    restProps = $[2];
+    t1 = $[3];
+    t2 = $[4];
+    t3 = $[5];
+    t4 = $[6];
+  }
+
+  const disabled = t1 === undefined ? DEFAULT_MENU_CONTEXT.disabled : t1;
+  const wrapWithLi = t2 === undefined ? DEFAULT_MENU_CONTEXT.wrapWithLi : t2;
+  const registerItem = t3 === undefined ? DEFAULT_MENU_CONTEXT.registerItem : t3;
+  const unregisterItem = t4 === undefined ? DEFAULT_MENU_CONTEXT.unregisterItem : t4;
+  let t5;
+
+  if ($[7] !== disabled || $[8] !== registerItem || $[9] !== restProps || $[10] !== unregisterItem || $[11] !== wrapWithLi) {
+    t5 = {
       disabled,
       wrapWithLi,
       registerItem,
       unregisterItem,
       ...restProps
-    }
-  }, children);
+    };
+    $[7] = disabled;
+    $[8] = registerItem;
+    $[9] = restProps;
+    $[10] = unregisterItem;
+    $[11] = wrapWithLi;
+    $[12] = t5;
+  } else {
+    t5 = $[12];
+  }
+
+  let t6;
+
+  if ($[13] !== children || $[14] !== t5) {
+    t6 = /*#__PURE__*/React.createElement(MenuContext.Provider, {
+      value: t5
+    }, children);
+    $[13] = children;
+    $[14] = t5;
+    $[15] = t6;
+  } else {
+    t6 = $[15];
+  }
+
+  return t6;
 };
 
 MenuProvider.propTypes = {

package/lib/parts/menu-item.js

@@ -1,4 +1,6 @@
 "use client";
+import _extends from '@babel/runtime-corejs3/helpers/esm/extends';
+import { c } from 'react-compiler-runtime';
 import React, { useState, cloneElement, useEffect } from 'react';
 import cn from 'classnames';
 import PropTypes from 'prop-types';
@@ -30,26 +32,87 @@ const HOVER_ICON_WILL_REPLACE_STYLES = {
   none: ''
 }; // eslint-disable-next-line complexity
 
-const MenuItemInner = (_ref, ref) => {
-  let {
-    className,
-    tag,
-    children,
-    icon,
-    size = 'm',
-    mode = 'classic',
-    theme,
-    disabled,
-    selected,
-    iconPlacement = 'left',
-    onFocus,
-    onKeyDown,
-    onMouseEnter,
-    role,
-    tabIndex,
-    hoverIcon,
-    ...restProps
-  } = _ref;
+const MenuItemInner = (t0, ref) => {
+  const $ = c(67);
+  let children;
+  let className;
+  let disabled;
+  let hoverIcon;
+  let icon;
+  let onFocus;
+  let onKeyDown;
+  let onMouseEnter;
+  let restProps;
+  let role;
+  let selected;
+  let t1;
+  let t2;
+  let t3;
+  let tabIndex;
+  let tag;
+  let theme;
+
+  if ($[0] !== t0) {
+    ({
+      className,
+      tag,
+      children,
+      icon,
+      size: t1,
+      mode: t2,
+      theme,
+      disabled,
+      selected,
+      iconPlacement: t3,
+      onFocus,
+      onKeyDown,
+      onMouseEnter,
+      role,
+      tabIndex,
+      hoverIcon,
+      ...restProps
+    } = t0);
+    $[0] = t0;
+    $[1] = children;
+    $[2] = className;
+    $[3] = disabled;
+    $[4] = hoverIcon;
+    $[5] = icon;
+    $[6] = onFocus;
+    $[7] = onKeyDown;
+    $[8] = onMouseEnter;
+    $[9] = restProps;
+    $[10] = role;
+    $[11] = selected;
+    $[12] = t1;
+    $[13] = t2;
+    $[14] = t3;
+    $[15] = tabIndex;
+    $[16] = tag;
+    $[17] = theme;
+  } else {
+    children = $[1];
+    className = $[2];
+    disabled = $[3];
+    hoverIcon = $[4];
+    icon = $[5];
+    onFocus = $[6];
+    onKeyDown = $[7];
+    onMouseEnter = $[8];
+    restProps = $[9];
+    role = $[10];
+    selected = $[11];
+    t1 = $[12];
+    t2 = $[13];
+    t3 = $[14];
+    tabIndex = $[15];
+    tag = $[16];
+    theme = $[17];
+  }
+
+  const size = t1 === undefined ? "m" : t1;
+  const mode = t2 === undefined ? "classic" : t2;
+  const iconPlacement = t3 === undefined ? "left" : t3;
   const {
     unregisterItem,
     registerItem,
@@ -63,25 +126,37 @@ const MenuItemInner = (_ref, ref) => {
   } = useMenuContext();
   const actualTheme = useThemeWithUndefined(menuContext.theme ?? theme);
   const [thisRef, setThisRef] = useState(null);
-  let autoTag = 'span';
+  let autoTag = "span";
 
   if (restProps.href) {
-    autoTag = 'a';
-  } else if (restProps.onClick) {
-    autoTag = 'button';
+    autoTag = "a";
+  } else {
+    if (restProps.onClick) {
+      autoTag = "button";
+    }
   }
 
   const Tag = menuContext.itemTag ?? tag ?? autoTag;
-  const actualIconPlacement = menuContext.iconPlacement ?? iconPlacement ?? 'left';
+  const actualIconPlacement = menuContext.iconPlacement ?? iconPlacement ?? "left";
   const actualMode = menuContext.mode ?? mode;
   const actualSize = menuContext.size ?? size;
   const resizeIcons = menuContext.resizeIcons ?? false;
   const actualDisabled = menuContext.disabled || disabled;
-  const iconElement = /*#__PURE__*/React.isValidElement(icon) ? /*#__PURE__*/cloneElement(icon, {
+  const iconElement = /*#__PURE__*/ /*#__PURE__*/React.isValidElement(icon) ? /*#__PURE__*/cloneElement(icon, {
     className: cn(icon.props.className, styles.icon, styles.customIcon, resizeIcons && styles.resizedIcon),
-    'data-render-all-sizes': true
+    "data-render-all-sizes": true
   }) : null;
-  const hasHoverIcon = /*#__PURE__*/React.isValidElement(hoverIcon);
+  let t4;
+
+  if ($[18] !== hoverIcon) {
+    t4 = /*#__PURE__*/React.isValidElement(hoverIcon);
+    $[18] = hoverIcon;
+    $[19] = t4;
+  } else {
+    t4 = $[19];
+  }
+
+  const hasHoverIcon = t4;
   const rovingTabIndex = currentActiveItemEl === thisRef ? 0 : -1;
   let resolvedTabIndex = tabIndex ?? 0;
 
@@ -95,91 +170,229 @@ const MenuItemInner = (_ref, ref) => {
 
   useEffect(() => {
     if (!thisRef || actualDisabled || !registerItem) {
-      return undefined;
+      return;
     }
 
     registerItem(thisRef);
     return () => unregisterItem?.(thisRef);
   }, [actualDisabled, registerItem, thisRef, unregisterItem]);
+  let t5;
 
-  const handleRef = r => {
-    if (r) {
-      setThisRef(r);
-    }
+  if ($[20] !== ref) {
+    t5 = r => {
+      if (r) {
+        setThisRef(r);
+      }
 
-    if (typeof ref === 'function') {
-      ref(r);
-    } else if (ref != null && typeof ref === 'object') {
-      ref.current = r;
-    }
-  };
+      if (typeof ref === "function") {
+        ref(r);
+      } else {
+        if (ref != null && typeof ref === "object") {
+          ref.current = r;
+        }
+      }
+    };
 
-  const handleKeyDown = e => {
-    onKeyDown?.(e);
+    $[20] = ref;
+    $[21] = t5;
+  } else {
+    t5 = $[21];
+  }
 
-    if (e.defaultPrevented || !onItemKeyDown) {
-      return;
-    }
+  const handleRef = t5;
+  let t6;
 
-    if (thisRef) {
-      onItemKeyDown(e, thisRef);
-    }
-  };
+  if ($[22] !== onItemKeyDown || $[23] !== onKeyDown || $[24] !== thisRef) {
+    t6 = e => {
+      onKeyDown?.(e);
 
-  const handleFocus = e => {
-    onFocus?.(e);
+      if (e.defaultPrevented || !onItemKeyDown) {
+        return;
+      }
 
-    if (onItemFocus && thisRef) {
-      onItemFocus(thisRef);
-    }
-  };
+      if (thisRef) {
+        onItemKeyDown(e, thisRef);
+      }
+    };
+
+    $[22] = onItemKeyDown;
+    $[23] = onKeyDown;
+    $[24] = thisRef;
+    $[25] = t6;
+  } else {
+    t6 = $[25];
+  }
+
+  const handleKeyDown = t6;
+  let t7;
+
+  if ($[26] !== onFocus || $[27] !== onItemFocus || $[28] !== thisRef) {
+    t7 = e_0 => {
+      onFocus?.(e_0);
+
+      if (onItemFocus && thisRef) {
+        onItemFocus(thisRef);
+      }
+    };
 
-  const handleMouseEnter = e => {
-    onMouseEnter?.(e);
+    $[26] = onFocus;
+    $[27] = onItemFocus;
+    $[28] = thisRef;
+    $[29] = t7;
+  } else {
+    t7 = $[29];
+  }
+
+  const handleFocus = t7;
+  let t8;
+
+  if ($[30] !== onItemMouseEnter || $[31] !== onMouseEnter || $[32] !== thisRef) {
+    t8 = e_1 => {
+      onMouseEnter?.(e_1);
+
+      if (onItemMouseEnter && thisRef) {
+        onItemMouseEnter(thisRef);
+      }
+    };
+
+    $[30] = onItemMouseEnter;
+    $[31] = onMouseEnter;
+    $[32] = thisRef;
+    $[33] = t8;
+  } else {
+    t8 = $[33];
+  }
 
-    if (onItemMouseEnter && thisRef) {
-      onItemMouseEnter(thisRef);
+  const handleMouseEnter = t8;
+  let hoverIconWillReplace = "none";
+
+  if (hasHoverIcon && iconElement && actualIconPlacement === "right") {
+    hoverIconWillReplace = "custom";
+  } else {
+    if (hasHoverIcon && selected) {
+      hoverIconWillReplace = "selected";
     }
-  };
+  }
+
+  const Wrapper = wrapWithLi ? "li" : "div";
+  const t9 = ICON_PLACEMENT_STYLES[actualIconPlacement];
+  const t10 = MODE_STYLES[actualMode];
+  const t11 = SIZE_STYLES[actualSize];
+  const t12 = THEME_STYLES[actualTheme];
+  let t13;
+
+  if ($[34] !== className || $[35] !== t10 || $[36] !== t11 || $[37] !== t12 || $[38] !== t9) {
+    t13 = cn(styles.wrapper, className, t9, t10, t11, t12);
+    $[34] = className;
+    $[35] = t10;
+    $[36] = t11;
+    $[37] = t12;
+    $[38] = t9;
+    $[39] = t13;
+  } else {
+    t13 = $[39];
+  }
 
-  let hoverIconWillReplace = 'none';
+  const t14 = "menu-item__wrapper";
+  const t15 = "menu__menu-item";
+  const t16 = keyboardNavigationEnabled ? "presentation" : undefined;
+  const t17 = cn(styles.menuItem, actualDisabled && styles.disabled, selected && styles.selected, HOVER_ICON_WILL_REPLACE_STYLES[hoverIconWillReplace]);
+  const t18 = restProps["data-test"] ?? "menu-item";
+  const t19 = "menu__menu-item__inner";
+  const t20 = role ?? (keyboardNavigationEnabled ? "option" : undefined);
+  const t21 = keyboardNavigationEnabled && selected !== undefined ? selected : restProps["aria-selected"];
+  const t22 = keyboardNavigationEnabled && actualDisabled ? true : restProps["aria-disabled"];
+  const t23 = styles;
+  let t24;
 
-  if (hasHoverIcon && iconElement && actualIconPlacement === 'right') {
-    hoverIconWillReplace = 'custom';
-  } else if (hasHoverIcon && selected) {
-    hoverIconWillReplace = 'selected';
+  if ($[40] !== children) {
+    t24 = /*#__PURE__*/React.createElement("span", {
+      className: styles.content
+    }, children);
+    $[40] = children;
+    $[41] = t24;
+  } else {
+    t24 = $[41];
   }
 
-  const Wrapper = wrapWithLi ? 'li' : 'div';
-  return /*#__PURE__*/React.createElement(Wrapper, {
-    className: cn(styles.wrapper, className, ICON_PLACEMENT_STYLES[actualIconPlacement], MODE_STYLES[actualMode], SIZE_STYLES[actualSize], THEME_STYLES[actualTheme]),
-    "data-test": 'menu-item__wrapper',
-    "data-rs-internal": 'menu__menu-item',
-    role: keyboardNavigationEnabled ? 'presentation' : undefined
-  }, /*#__PURE__*/React.createElement(Tag, { ...restProps,
-    onFocus: handleFocus,
-    onKeyDown: handleKeyDown,
-    onMouseEnter: handleMouseEnter,
-    ref: handleRef,
-    className: cn(styles.menuItem, actualDisabled && styles.disabled, selected && styles.selected, HOVER_ICON_WILL_REPLACE_STYLES[hoverIconWillReplace]),
-    "data-test": restProps['data-test'] ?? 'menu-item',
-    "data-rs-internal": 'menu__menu-item__inner',
-    role: role ?? (keyboardNavigationEnabled ? 'option' : undefined),
-    "aria-selected": keyboardNavigationEnabled && selected !== undefined ? selected : restProps['aria-selected'],
-    "aria-disabled": keyboardNavigationEnabled && actualDisabled ? true : restProps['aria-disabled'],
-    tabIndex: resolvedTabIndex
-  }, iconElement, /*#__PURE__*/React.createElement("span", {
-    className: styles.contentWrapper
-  }, /*#__PURE__*/React.createElement("span", {
-    className: styles.content
-  }, children), selected && /*#__PURE__*/React.createElement(CheckOutlineIcon, {
+  const t25 = selected && /*#__PURE__*/React.createElement(CheckOutlineIcon, {
     className: cn(styles.icon, styles.selectedIcon, resizeIcons && styles.resizedIcon),
-    "data-test": 'menu-item__selected-icon',
+    "data-test": "menu-item__selected-icon",
     "data-render-all-sizes": true
-  }), hasHoverIcon && /*#__PURE__*/React.cloneElement(hoverIcon, {
-    className: cn(hoverIcon.props.className, styles.icon, styles.hoverIcon, resizeIcons && styles.resizedIcon, hoverIconWillReplace !== 'none' && styles.hoverIconNoReserve),
-    'data-render-all-sizes': true
-  }))));
+  });
+  const t26 = hasHoverIcon && /*#__PURE__*/React.cloneElement(hoverIcon, {
+    className: cn(hoverIcon.props.className, styles.icon, styles.hoverIcon, resizeIcons && styles.resizedIcon, hoverIconWillReplace !== "none" && styles.hoverIconNoReserve),
+    "data-render-all-sizes": true
+  });
+  let t27;
+
+  if ($[42] !== t23.contentWrapper || $[43] !== t24 || $[44] !== t25 || $[45] !== t26) {
+    t27 = /*#__PURE__*/React.createElement("span", {
+      className: t23.contentWrapper
+    }, t24, t25, t26);
+    $[42] = t23.contentWrapper;
+    $[43] = t24;
+    $[44] = t25;
+    $[45] = t26;
+    $[46] = t27;
+  } else {
+    t27 = $[46];
+  }
+
+  let t28;
+
+  if ($[47] !== Tag || $[48] !== handleFocus || $[49] !== handleKeyDown || $[50] !== handleMouseEnter || $[51] !== handleRef || $[52] !== iconElement || $[53] !== resolvedTabIndex || $[54] !== restProps || $[55] !== t17 || $[56] !== t18 || $[57] !== t20 || $[58] !== t21 || $[59] !== t22 || $[60] !== t27) {
+    t28 = /*#__PURE__*/React.createElement(Tag, _extends({}, restProps, {
+      onFocus: handleFocus,
+      onKeyDown: handleKeyDown,
+      onMouseEnter: handleMouseEnter,
+      ref: handleRef,
+      className: t17,
+      "data-test": t18,
+      "data-rs-internal": t19,
+      role: t20,
+      "aria-selected": t21,
+      "aria-disabled": t22,
+      tabIndex: resolvedTabIndex
+    }), iconElement, t27);
+    $[47] = Tag;
+    $[48] = handleFocus;
+    $[49] = handleKeyDown;
+    $[50] = handleMouseEnter;
+    $[51] = handleRef;
+    $[52] = iconElement;
+    $[53] = resolvedTabIndex;
+    $[54] = restProps;
+    $[55] = t17;
+    $[56] = t18;
+    $[57] = t20;
+    $[58] = t21;
+    $[59] = t22;
+    $[60] = t27;
+    $[61] = t28;
+  } else {
+    t28 = $[61];
+  }
+
+  let t29;
+
+  if ($[62] !== Wrapper || $[63] !== t13 || $[64] !== t16 || $[65] !== t28) {
+    t29 = /*#__PURE__*/React.createElement(Wrapper, {
+      className: t13,
+      "data-test": t14,
+      "data-rs-internal": t15,
+      role: t16
+    }, t28);
+    $[62] = Wrapper;
+    $[63] = t13;
+    $[64] = t16;
+    $[65] = t28;
+    $[66] = t29;
+  } else {
+    t29 = $[66];
+  }
+
+  return t29;
 };
 
 const MenuItem = /*#__PURE__*/React.forwardRef(MenuItemInner);