@rescui/menu 0.13.6-RUI-296-Build-docs-md-files-for-each-docs-section-b138dd5bf.19 → 0.13.6-RUI-293-Update-menu-component-6ca9d26d3.22

package/lib/_virtual/check-outline.js

@@ -0,0 +1,106 @@
+import _extends from '@babel/runtime-corejs3/helpers/esm/extends';
+import React from 'react';
+import PropTypes from 'prop-types';
+import cn from 'classnames';
+import styles from './index.css.js';
+const sizeStyles = {
+  "xs": styles.sizeXS,
+  "s": styles.sizeS,
+  "m": styles.sizeM,
+  "l": styles.sizeL
+};
+const Size = {
+  "xs": "xs",
+  "s": "s",
+  "m": "m",
+  "l": "l"
+};
+const CheckOutlineIcon16 = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement("svg", _extends({
+  viewBox: "0 0 16 16"
+}, props, {
+  ref: ref
+}), /*#__PURE__*/React.createElement("path", {
+  d: "M13.854 4.146a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.793l6.646-6.647a.5.5 0 0 1 .708 0"
+})));
+CheckOutlineIcon16.displayName = 'CheckOutlineIcon16';
+const CheckOutlineIcon20 = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement("svg", _extends({
+  viewBox: "0 0 20 20"
+}, props, {
+  ref: ref
+}), /*#__PURE__*/React.createElement("path", {
+  d: "M16.53 5.47a.75.75 0 0 1 0 1.06l-8 8a.75.75 0 0 1-1.06 0l-4-4a.75.75 0 1 1 1.06-1.06L8 12.94l7.47-7.47a.75.75 0 0 1 1.06 0"
+})));
+CheckOutlineIcon20.displayName = 'CheckOutlineIcon20';
+const CheckOutlineIcon24 = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement("svg", _extends({
+  viewBox: "0 0 24 24"
+}, props, {
+  ref: ref
+}), /*#__PURE__*/React.createElement("path", {
+  d: "M19.707 6.293a1 1 0 0 1 0 1.414l-10 10a1 1 0 0 1-1.414 0l-5-5a1 1 0 1 1 1.414-1.414L9 15.586l9.293-9.293a1 1 0 0 1 1.414 0"
+})));
+CheckOutlineIcon24.displayName = 'CheckOutlineIcon24';
+const CheckOutlineIcon28 = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement("svg", _extends({
+  viewBox: "0 0 28 28"
+}, props, {
+  ref: ref
+}), /*#__PURE__*/React.createElement("path", {
+  d: "M22.676 7.263a1 1 0 0 1 .061 1.413l-11 12a1 1 0 0 1-1.444.031l-6-6a1 1 0 1 1 1.414-1.414l5.262 5.261 10.294-11.23a1 1 0 0 1 1.413-.061"
+})));
+CheckOutlineIcon28.displayName = 'CheckOutlineIcon28';
+const CheckOutlineIcon = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  let {
+    theme,
+    size: sizeFromProps = "m",
+    className,
+    style,
+    ['data-render-all-sizes']: renderAllSizes = false,
+    ...props
+  } = _ref;
+  const size = sizeFromProps in Size ? sizeFromProps : "m";
+  const mainProps = { ...props,
+    className: cn(styles.icon, styles[theme], sizeStyles[size], renderAllSizes && styles.allVariants, className),
+    style: renderAllSizes ? {
+      '--rs-icon-ar-width': 28,
+      '--rs-icon-ar-height': 28,
+      ...style
+    } : style,
+    ref
+  };
+
+  if (renderAllSizes) {
+    return /*#__PURE__*/React.createElement("svg", _extends({
+      viewBox: "0 0 28 28"
+    }, mainProps), /*#__PURE__*/React.createElement(CheckOutlineIcon16, {
+      className: styles.variant16
+    }), /*#__PURE__*/React.createElement(CheckOutlineIcon20, {
+      className: styles.variant20
+    }), /*#__PURE__*/React.createElement(CheckOutlineIcon24, {
+      className: styles.variant24
+    }), /*#__PURE__*/React.createElement(CheckOutlineIcon28, {
+      className: styles.variant28
+    }));
+  }
+
+  if (size === Size['xs']) {
+    return /*#__PURE__*/React.createElement(CheckOutlineIcon16, mainProps);
+  }
+
+  if (size === Size['s']) {
+    return /*#__PURE__*/React.createElement(CheckOutlineIcon20, mainProps);
+  }
+
+  if (size === Size['m']) {
+    return /*#__PURE__*/React.createElement(CheckOutlineIcon24, mainProps);
+  }
+
+  return /*#__PURE__*/React.createElement(CheckOutlineIcon28, mainProps);
+});
+CheckOutlineIcon.displayName = 'CheckOutlineIcon';
+CheckOutlineIcon.propTypes = {
+  className: PropTypes.string,
+  theme: PropTypes.oneOf(["light", "dark"]),
+  size: PropTypes.oneOf(["xs", "s", "m", "l"]),
+  'data-render-all-sizes': PropTypes.bool,
+  style: PropTypes.object
+};
+export { Size, CheckOutlineIcon as default };

package/lib/_virtual/index.css.js

@@ -0,0 +1,15 @@
+var styles = {
+  "icon": "_icon_7dcaqk_4",
+  "sizeXS": "_sizeXS_7dcaqk_14",
+  "sizeS": "_sizeS_7dcaqk_18",
+  "sizeM": "_sizeM_7dcaqk_22",
+  "sizeL": "_sizeL_7dcaqk_26",
+  "light": "_light_7dcaqk_30",
+  "dark": "_dark_7dcaqk_34",
+  "allVariants": "_allVariants_7dcaqk_48",
+  "variant16": "_variant16_7dcaqk_53",
+  "variant20": "_variant20_7dcaqk_54",
+  "variant24": "_variant24_7dcaqk_55",
+  "variant28": "_variant28_7dcaqk_58"
+};
+export { styles as default };

package/lib/index.css

@@ -1,10 +1,111 @@
-._themeLight_1fpuqka_8{
+._icon_7dcaqk_4{
+  --_rs-theme-dark:var(
+    --_rs-internal-force-theme-dark-consult-rescui-before-using,
+    var(--rs-theme-dark, 0)
+  );
+  --_rs-theme-flip:var(--rs-theme-flip, 0);
+  --_rs-theme-dark-coefficient:calc(var(--_rs-theme-dark)*(1 - var(--_rs-theme-flip)) + var(--_rs-theme-flip)*(1 - var(--_rs-theme-dark)));
+  --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
+}
+@supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
+._icon_7dcaqk_4{
+    --_rs-color-primary:color-mix(in srgb, var(--rs-color-primary-light-theme, #6B57FF) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dark-theme, #8473FF) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
+    --_rs-color-primary-dim:color-mix(in srgb, var(--rs-color-primary-dim-light-theme, #8979ff) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dim-dark-theme, #6f61d2) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
+    --_rs-color-primary-fog:color-mix(in srgb, var(--rs-color-primary-fog-light-theme, #e1ddff) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-fog-dark-theme, #2e2b49) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
+    --_rs-color-primary-t-dim:color-mix(in srgb, var(--rs-color-primary-t-dim-light-theme, rgba(107, 87, 255, 0.8)) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-t-dim-dark-theme, rgba(132, 115, 255,0.8)) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
+    --_rs-color-primary-t-fog:color-mix(in srgb, var(--rs-color-primary-t-fog-light-theme, rgba(107, 87, 255,0.2)) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-t-fog-dark-theme, rgba(132, 115, 255,0.3)) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
+}
+  }
+@supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
+._icon_7dcaqk_4{
+    --_rs-color-primary:rgb(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255);
+    --_rs-color-primary-dim:rgb(calc(var(--_rs-theme-light-coefficient, 1)*137 + var(--_rs-theme-dark-coefficient, 0)*111), calc(var(--_rs-theme-light-coefficient, 1)*121 + var(--_rs-theme-dark-coefficient, 0)*97), calc(var(--_rs-theme-light-coefficient, 1)*255 + var(--_rs-theme-dark-coefficient, 0)*210));
+    --_rs-color-primary-fog:rgb(calc(var(--_rs-theme-light-coefficient, 1)*225 + var(--_rs-theme-dark-coefficient, 0)*46), calc(var(--_rs-theme-light-coefficient, 1)*221 + var(--_rs-theme-dark-coefficient, 0)*43), calc(var(--_rs-theme-light-coefficient, 1)*255 + var(--_rs-theme-dark-coefficient, 0)*73));
+    --_rs-color-primary-t-dim:rgba(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255, 0.8);
+    --_rs-color-primary-t-fog:rgba(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255, calc(var(--_rs-theme-light-coefficient, 1)*0.2 + var(--_rs-theme-dark-coefficient, 0)*0.3));
+}
+  }
+._icon_7dcaqk_4{
+
+  fill:var(--_rs-icons-themed-fill-or-initial, currentcolor);
+
+  width:var(--rs-icons-width, auto);
+  height:var(--rs-icons-height, var(--_rs-icons-height));
+}
+._sizeXS_7dcaqk_14{
+  --_rs-icons-height:16px;
+}
+._sizeS_7dcaqk_18{
+  --_rs-icons-height:20px;
+}
+._sizeM_7dcaqk_22{
+  --_rs-icons-height:24px;
+}
+._sizeL_7dcaqk_26{
+  --_rs-icons-height:28px;
+}
+._light_7dcaqk_30{
   --rs-theme-dark:0;
+  --_rs-icons-themed-fill-or-initial:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
 }
-._themeDark_1fpuqka_11{
+._dark_7dcaqk_34{
   --rs-theme-dark:1;
+  --_rs-icons-themed-fill-or-initial:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
+}
+@keyframes rs-icon-rotate{
+  from{
+    transform:rotate(0deg);
+  }
+  to{
+    transform:rotate(360deg);
+  }
+}
+._allVariants_7dcaqk_48{
+  aspect-ratio:var(--rs-icon-ar-width, 1) / var(--rs-icon-ar-height, 1);
+  container:rs-icon / size;
 }
-._sizeS_1fpuqka_15{
+._variant16_7dcaqk_53,
+._variant20_7dcaqk_54,
+._variant24_7dcaqk_55{
+  display:none;
+}
+._variant28_7dcaqk_58{
+  display:block;
+}
+@container rs-icon (max-height: 24px){
+  ._variant24_7dcaqk_55{
+    display:block;
+  }
+  ._variant28_7dcaqk_58{
+    display:none;
+  }
+}
+@container rs-icon (max-height: 20px){
+  ._variant20_7dcaqk_54{
+    display:block;
+  }
+  ._variant24_7dcaqk_55{
+    display:none;
+  }
+}
+@container rs-icon (max-height: 16px){
+  ._variant16_7dcaqk_53{
+    display:block;
+  }
+  ._variant20_7dcaqk_54{
+    display:none;
+  }
+}
+._themeLight_2x3bw5_8{
+  --rs-theme-dark:0;
+}
+._themeDark_2x3bw5_11{
+  --rs-theme-dark:1;
+}
+._menu_2x3bw5_15:focus{
+    outline:none;
+  }
+._sizeS_2x3bw5_21{
   --_rs-menu-mi-icon-offset:8px;
   --_rs-menu-mi-icon-size:20px;
   --_rs-menu-mi-vertical-padding:6px;
@@ -43,7 +144,7 @@
   --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
   --_rs-typography-link-border-bottom-width-from-text:1px;
 }
-._sizeM_1fpuqka_18{
+._sizeM_2x3bw5_24{
   --_rs-menu-mi-icon-offset:8px;
   --_rs-menu-mi-icon-size:24px;
   --_rs-menu-mi-vertical-padding:8px;
@@ -86,11 +187,11 @@
   --_rs-typography-link-border-bottom-width-from-text:1px;
 }
 @media screen and (max-width: 640px){
-._sizeM_1fpuqka_18{
+._sizeM_2x3bw5_24{
     --_rs-typography-text-2-sm-list-li-margin-top-from-text:12px;
 }
   }
-._sizeL_1fpuqka_21{
+._sizeL_2x3bw5_27{
   --_rs-menu-mi-icon-offset:16px;
   --_rs-menu-mi-icon-size:28px;
   --_rs-menu-mi-vertical-padding:12px;
@@ -133,60 +234,63 @@
   --_rs-typography-link-border-bottom-width-from-text:1px;
 }
 @media screen and (max-width: 640px){
-._sizeL_1fpuqka_21{
+._sizeL_2x3bw5_27{
     --_rs-typography-text-1-sm-list-li-margin-top-from-text:16px;
 }
   }
-._modeClassic_1fpuqka_25{
+._modeClassic_2x3bw5_31{
   --_rs-menu-mi-horizontal-padding-with-mode:var(
     --_rs-menu-mi-horizontal-padding
   );
-  --_rs-menu-mi-active-background:var(--_rs-color-primary-t-fog);
-  --_rs-menu-mi-selected-color:rgb(calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*227));
-  --_rs-menu-mi-selected-background:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
-  --_rs-menu-mi-hover-color:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
-  --_rs-menu-mi-hover-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.1);
-  --_rs-menu-mi-selected-hover-color:rgb(calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*227));
-  --_rs-menu-mi-selected-hover-background:rgb(
-    calc(48 + var(--_rs-theme-dark-coefficient, 0)*184), calc(48 + var(--_rs-theme-dark-coefficient, 0)*184), calc(51 + var(--_rs-theme-dark-coefficient, 0)*181)
-  );
 }
-._modeRock_1fpuqka_28{
+._modeClassic_2x3bw5_31 [data-rs-internal="menu__menu-item__inner"]{
+    --_rs-menu-mi-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.7);
+    --_rs-menu-mi-active-background:var(--_rs-color-primary-t-fog);
+    --_rs-menu-mi-selected-color:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
+    --_rs-menu-mi-selected-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.1);
+    --_rs-menu-mi-hover-color:rgb(
+  calc(255 - var(--rs-menu-contrast-primary, 0)*230),
+  calc(255 - var(--rs-menu-contrast-primary, 0)*230),
+  calc(255 - var(--rs-menu-contrast-primary, 0)*227)
+);
+    --_rs-menu-mi-hover-background:var(--_rs-color-primary);
+  }
+._modeRock_2x3bw5_34{
   --_rs-menu-mi-horizontal-padding-with-mode:var(
     --_rs-menu-mi-horizontal-padding
   );
-  --_rs-menu-mi-active-background:none;
-  --_rs-menu-mi-selected-color:rgb(calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*227));
-  --_rs-menu-mi-selected-background:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
-  --_rs-menu-mi-hover-color:#FFFFFF;
-  --_rs-menu-mi-hover-background:var(--_rs-color-primary);
-  --_rs-menu-mi-selected-hover-color:rgb(calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*227));
-  --_rs-menu-mi-selected-hover-background:rgb(
-    calc(48 + var(--_rs-theme-dark-coefficient, 0)*184), calc(48 + var(--_rs-theme-dark-coefficient, 0)*184), calc(51 + var(--_rs-theme-dark-coefficient, 0)*181)
-  );
 }
-._modeClear_1fpuqka_31{
+._modeRock_2x3bw5_34 [data-rs-internal="menu__menu-item__inner"]{
+    --_rs-menu-mi-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.7);
+    --_rs-menu-mi-active-background:transparent;
+    --_rs-menu-mi-selected-color:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
+    --_rs-menu-mi-selected-background:rgb(calc(232 - var(--_rs-theme-dark-coefficient, 0)*184), calc(232 - var(--_rs-theme-dark-coefficient, 0)*184), calc(232 - var(--_rs-theme-dark-coefficient, 0)*181));
+    --_rs-menu-mi-hover-color:rgb(calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*227));
+    --_rs-menu-mi-hover-background:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
+  }
+._modeClear_2x3bw5_37{
   --_rs-menu-mi-horizontal-padding-with-mode:0;
-  --_rs-menu-mi-active-background:none;
-  --_rs-menu-mi-selected-color:var(--_rs-color-primary);
-  --_rs-menu-mi-selected-background:none;
-  --_rs-menu-mi-hover-color:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
-  --_rs-menu-mi-hover-background:none;
-  --_rs-menu-mi-selected-hover-color:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
-  --_rs-menu-mi-selected-hover-background:rgba(
-    calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227),
-    0.1
-  );
 }
-._iconPlacementLeft_1fpuqka_35{
+._modeClear_2x3bw5_37 [data-rs-internal="menu__menu-item__inner"]{
+    --_rs-menu-mi-color:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
+    --_rs-menu-mi-active-background:transparent;
+    --_rs-menu-mi-selected-color:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
+    --_rs-menu-mi-selected-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.1);
+    --_rs-menu-mi-hover-color:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
+    --_rs-menu-mi-hover-background:transparent;
+  }
+._iconPlacementLeft_2x3bw5_41{
   --_rs-menu-mi-flex-direction:row;
   --_rs-menu-mi-justify-content:initial;
 }
-._iconPlacementRight_1fpuqka_39{
+._iconPlacementRight_2x3bw5_45{
   --_rs-menu-mi-flex-direction:row-reverse;
   --_rs-menu-mi-justify-content:space-between;
 }
-._wrapper_1fpuqka_43{
+._wrapper_2x3bw5_49{
+  display:flex;
+}
+._menuItem_2x3bw5_53{
   --_rs-theme-dark:var(
     --_rs-internal-force-theme-dark-consult-rescui-before-using,
     var(--rs-theme-dark, 0)
@@ -196,7 +300,7 @@
   --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
 }
 @supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
-._wrapper_1fpuqka_43{
+._menuItem_2x3bw5_53{
     --_rs-color-primary:color-mix(in srgb, var(--rs-color-primary-light-theme, #6B57FF) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dark-theme, #8473FF) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
     --_rs-color-primary-dim:color-mix(in srgb, var(--rs-color-primary-dim-light-theme, #8979ff) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dim-dark-theme, #6f61d2) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
     --_rs-color-primary-fog:color-mix(in srgb, var(--rs-color-primary-fog-light-theme, #e1ddff) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-fog-dark-theme, #2e2b49) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
@@ -205,7 +309,7 @@
 }
   }
 @supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
-._wrapper_1fpuqka_43{
+._menuItem_2x3bw5_53{
     --_rs-color-primary:rgb(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255);
     --_rs-color-primary-dim:rgb(calc(var(--_rs-theme-light-coefficient, 1)*137 + var(--_rs-theme-dark-coefficient, 0)*111), calc(var(--_rs-theme-light-coefficient, 1)*121 + var(--_rs-theme-dark-coefficient, 0)*97), calc(var(--_rs-theme-light-coefficient, 1)*255 + var(--_rs-theme-dark-coefficient, 0)*210));
     --_rs-color-primary-fog:rgb(calc(var(--_rs-theme-light-coefficient, 1)*225 + var(--_rs-theme-dark-coefficient, 0)*46), calc(var(--_rs-theme-light-coefficient, 1)*221 + var(--_rs-theme-dark-coefficient, 0)*43), calc(var(--_rs-theme-light-coefficient, 1)*255 + var(--_rs-theme-dark-coefficient, 0)*73));
@@ -213,11 +317,7 @@
     --_rs-color-primary-t-fog:rgba(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255, calc(var(--_rs-theme-light-coefficient, 1)*0.2 + var(--_rs-theme-dark-coefficient, 0)*0.3));
 }
   }
-._wrapper_1fpuqka_43 {
-
-  display:flex;
-}
-._menuItem_1fpuqka_50{
+._menuItem_2x3bw5_53 {
   letter-spacing:var(
     --rs-text-base-letter-spacing,
     var(--_rs-typography-letter-spacing)
@@ -250,7 +350,7 @@
   text-align:start;
   text-decoration:none;
 
-  color:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
+  color:var(--_rs-menu-mi-color);
   background:none;
   -webkit-appearance:none;
   -moz-appearance:none;
@@ -258,52 +358,51 @@
   -webkit-font-smoothing:inherit;
   -moz-osx-font-smoothing:inherit;
 }
-._menuItem_1fpuqka_50:focus{
+._menuItem_2x3bw5_53:focus{
     outline:none;
   }
-._keyboardNavigationDisabled_1fpuqka_85 ._menuItem_1fpuqka_50:focus[data-focus-method='key']{
+._keyboardNavigationDisabled_2x3bw5_90 ._menuItem_2x3bw5_53:focus[data-focus-method='key']{
     box-shadow:0 0 0 2px var(--_rs-color-primary-dim), inset 0 0 0 2px var(--_rs-color-primary-dim);
   }
-._menuItem_1fpuqka_50:active{
+._menuItem_2x3bw5_53:active{
     color:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
     background:var(--_rs-menu-mi-active-background);
   }
-._menuItem_1fpuqka_50._selected_1fpuqka_99{
+._menuItem_2x3bw5_53._selected_2x3bw5_104{
     color:var(--_rs-menu-mi-selected-color);
     background:var(--_rs-menu-mi-selected-background);
   }
-._menuItem_1fpuqka_50._highlighted_1fpuqka_106,
-  ._menuItem_1fpuqka_50:not(._disableCursor_1fpuqka_107):hover{
+._keyboardNavigationEnabled_2x3bw5_111 ._menuItem_2x3bw5_53:focus,
+  ._keyboardNavigationDisabled_2x3bw5_90 ._menuItem_2x3bw5_53:hover{
     color:var(--_rs-menu-mi-hover-color);
     background:var(--_rs-menu-mi-hover-background);
   }
-._menuItem_1fpuqka_50._highlighted_1fpuqka_106._selected_1fpuqka_99,
-  ._menuItem_1fpuqka_50._selected_1fpuqka_99:not(._disableCursor_1fpuqka_107):hover{
-    color:var(--_rs-menu-mi-selected-hover-color);
-    background-color:var(--_rs-menu-mi-selected-hover-background);
-  }
-._menuItem_1fpuqka_50._disabled_1fpuqka_120{
+._menuItem_2x3bw5_53._disabled_2x3bw5_117{
     pointer-events:none;
 
     color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
   }
-._disableCursor_1fpuqka_107{
-  pointer-events:none;
+._contentWrapper_2x3bw5_124{
+  display:flex;
+  flex-grow:1;
+
+  justify-content:space-between;
+  gap:var(--_rs-menu-mi-icon-offset);
 }
-._content_1fpuqka_131{
+._content_2x3bw5_124{
   flex-grow:1;
 
   font-size:inherit;
 }
-._icon_1fpuqka_35{
+._icon_2x3bw5_41{
   flex:0 0;
   flex-basis:auto;
 }
-._icon_1fpuqka_35._resizedIcon_1fpuqka_141{
+._icon_2x3bw5_41._resizedIcon_2x3bw5_142{
     width:auto;
     height:var(--_rs-menu-mi-icon-size);
   }
-._divider_1fpuqka_149{
+._divider_2x3bw5_150{
   flex-shrink:0;
 
   width:100%;
@@ -314,13 +413,13 @@
 
   background-color:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.2);
 }
-._groupHeaderThemeLight_1fpuqka_163{
+._groupHeaderThemeLight_2x3bw5_164{
   --rs-theme-dark:0;
 }
-._groupHeaderThemeDark_1fpuqka_166{
+._groupHeaderThemeDark_2x3bw5_167{
   --rs-theme-dark:1;
 }
-._groupHeaderSizeL_1fpuqka_170{
+._groupHeaderSizeL_2x3bw5_171{
   --_rs-menu-gh-vertical-padding:12px;
   --_rs-menu-gh-horizontal-padding:16px;
   --_rs-typography-letter-spacing:var(--rs-h3-letter-spacing, normal);
@@ -354,7 +453,7 @@
   --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
   --_rs-typography-link-border-bottom-width-from-text:2px;
 }
-._groupHeaderSizeM_1fpuqka_173{
+._groupHeaderSizeM_2x3bw5_174{
   --_rs-menu-gh-vertical-padding:8px;
   --_rs-menu-gh-horizontal-padding:16px;
   --_rs-typography-letter-spacing:var(--rs-h4-letter-spacing, normal);
@@ -388,7 +487,7 @@
   --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
   --_rs-typography-link-border-bottom-width-from-text:2px;
 }
-._groupHeaderSizeS_1fpuqka_176{
+._groupHeaderSizeS_2x3bw5_177{
   --_rs-menu-gh-vertical-padding:6px;
   --_rs-menu-gh-horizontal-padding:8px;
   --_rs-typography-letter-spacing:var(--rs-h5-letter-spacing, normal);
@@ -422,7 +521,7 @@
   --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
   --_rs-typography-link-border-bottom-width-from-text:2px;
 }
-._groupHeader_1fpuqka_163{
+._groupHeader_2x3bw5_164{
   --_rs-theme-dark:var(
     --_rs-internal-force-theme-dark-consult-rescui-before-using,
     var(--rs-theme-dark, 0)
@@ -432,7 +531,7 @@
   --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
 }
 @supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
-._groupHeader_1fpuqka_163{
+._groupHeader_2x3bw5_164{
     --_rs-color-primary:color-mix(in srgb, var(--rs-color-primary-light-theme, #6B57FF) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dark-theme, #8473FF) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
     --_rs-color-primary-dim:color-mix(in srgb, var(--rs-color-primary-dim-light-theme, #8979ff) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dim-dark-theme, #6f61d2) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
     --_rs-color-primary-fog:color-mix(in srgb, var(--rs-color-primary-fog-light-theme, #e1ddff) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-fog-dark-theme, #2e2b49) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
@@ -441,7 +540,7 @@
 }
   }
 @supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
-._groupHeader_1fpuqka_163{
+._groupHeader_2x3bw5_164{
     --_rs-color-primary:rgb(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255);
     --_rs-color-primary-dim:rgb(calc(var(--_rs-theme-light-coefficient, 1)*137 + var(--_rs-theme-dark-coefficient, 0)*111), calc(var(--_rs-theme-light-coefficient, 1)*121 + var(--_rs-theme-dark-coefficient, 0)*97), calc(var(--_rs-theme-light-coefficient, 1)*255 + var(--_rs-theme-dark-coefficient, 0)*210));
     --_rs-color-primary-fog:rgb(calc(var(--_rs-theme-light-coefficient, 1)*225 + var(--_rs-theme-dark-coefficient, 0)*46), calc(var(--_rs-theme-light-coefficient, 1)*221 + var(--_rs-theme-dark-coefficient, 0)*43), calc(var(--_rs-theme-light-coefficient, 1)*255 + var(--_rs-theme-dark-coefficient, 0)*73));
@@ -449,7 +548,7 @@
     --_rs-color-primary-t-fog:rgba(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255, calc(var(--_rs-theme-light-coefficient, 1)*0.2 + var(--_rs-theme-dark-coefficient, 0)*0.3));
 }
   }
-._groupHeader_1fpuqka_163 {
+._groupHeader_2x3bw5_164 {
   letter-spacing:var(
     --rs-text-base-letter-spacing,
     var(--_rs-typography-letter-spacing)

package/lib/index.d.ts

@@ -1,10 +1,6 @@
 export { default as Menu } from './menu';
-export type { MenuProps } from './menu';
 export { MenuContext } from './parts/menu-context';
-export type { MenuContextValue, MenuItemIconPlacement } from './parts/menu-context';
 export { default as MenuItem } from './parts/menu-item';
-export type { MenuItemProps } from './parts/menu-item';
 export { default as Divider } from './parts/divider';
-export type { DividerProps } from './parts/divider';
 export { default as GroupHeader } from './parts/group-header';
-export type { GroupHeaderProps } from './parts/group-header';
+export type { GroupHeaderProps, DividerProps, MenuItemProps, MenuProps, MenuContextValue, MenuItemIconPlacement } from './types';

package/lib/menu.d.ts

@@ -1,12 +1,18 @@
-import React, { HTMLAttributes, ReactNode } from 'react';
-import { MenuContextValue } from './parts/menu-context';
-export interface MenuProps extends HTMLAttributes<HTMLElement>, Omit<MenuContextValue, 'isKeyboardNavigating' | 'activeItemRef' | 'wrapWithLi'> {
-    children?: ReactNode;
-    tag?: React.ElementType;
-    enableKeyboardNavigation?: boolean;
-    activateFirstItem?: boolean;
-    returnFocusOnUnmount?: boolean;
-    wrapItemsWithLi?: boolean;
-}
-export declare const Menu: React.FC<MenuProps>;
+import React from 'react';
+import PropTypes from 'prop-types';
+import type { MenuProps } from './types';
+export type { MenuProps } from './types';
+export declare const Menu: {
+    ({ enableKeyboardNavigation, activateFirstItem, tag, ...props }: MenuProps): React.JSX.Element;
+    propTypes: {
+        size: PropTypes.Requireable<string>;
+        mode: PropTypes.Requireable<string>;
+        theme: PropTypes.Requireable<string>;
+        disabled: PropTypes.Requireable<boolean>;
+        resizeIcons: PropTypes.Requireable<boolean>;
+        iconPlacement: PropTypes.Requireable<string>;
+        itemTag: PropTypes.Validator<React.ElementType>;
+        tag: PropTypes.Validator<React.ElementType>;
+    };
+};
 export default Menu;