@rescui/select 0.18.4 → 0.19.0

package/lib/_virtual/loading-outline.js

@@ -1,4 +1,5 @@
 import _extends from '@babel/runtime-corejs3/helpers/esm/extends';
+import { c } from 'react-compiler-runtime';
 import React from 'react';
 import PropTypes from 'prop-types';
 import cn from 'classnames';
@@ -15,101 +16,331 @@ const Size = {
   "m": "m",
   "l": "l"
 };
-const LoadingOutlineIcon16 = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement("svg", _extends({
-  viewBox: "0 0 16 16"
-}, props, {
-  ref: ref
-}), /*#__PURE__*/React.createElement("path", {
-  d: "M8 3a5 5 0 1 0 4.933 4.177.5.5 0 0 1 .986-.163Q14 7.496 14 8a6 6 0 1 1-5.014-5.92.5.5 0 1 1-.163.987A5 5 0 0 0 8 3",
-  style: {
-    animation: "rs-icon-rotate 1s linear infinite",
-    transformOrigin: "center center"
-  }
-})));
+const LoadingOutlineIcon16 = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const $ = c(4);
+  let t0;
+
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t0 = /*#__PURE__*/React.createElement("path", {
+      d: "M8 3a5 5 0 1 0 4.933 4.177.5.5 0 0 1 .986-.163Q14 7.496 14 8a6 6 0 1 1-5.014-5.92.5.5 0 1 1-.163.987A5 5 0 0 0 8 3",
+      style: {
+        animation: "rs-icon-rotate 1s linear infinite",
+        transformOrigin: "center center"
+      }
+    });
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+
+  let t1;
+
+  if ($[1] !== props || $[2] !== ref) {
+    t1 = /*#__PURE__*/React.createElement("svg", _extends({
+      viewBox: "0 0 16 16"
+    }, props, {
+      ref: ref
+    }), t0);
+    $[1] = props;
+    $[2] = ref;
+    $[3] = t1;
+  } else {
+    t1 = $[3];
+  }
+
+  return t1;
+});
 LoadingOutlineIcon16.displayName = 'LoadingOutlineIcon16';
-const LoadingOutlineIcon20 = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement("svg", _extends({
-  viewBox: "0 0 20 20"
-}, props, {
-  ref: ref
-}), /*#__PURE__*/React.createElement("path", {
-  d: "M10 3.75a6.25 6.25 0 1 0 6.166 5.221.75.75 0 0 1 1.48-.244 7.75 7.75 0 1 1-6.372-6.372.75.75 0 0 1-.245 1.48A6.3 6.3 0 0 0 10 3.75",
-  style: {
-    animation: "rs-icon-rotate 1s linear infinite",
-    transformOrigin: "center center"
-  }
-})));
+const LoadingOutlineIcon20 = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const $ = c(4);
+  let t0;
+
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t0 = /*#__PURE__*/React.createElement("path", {
+      d: "M10 3.75a6.25 6.25 0 1 0 6.166 5.221.75.75 0 0 1 1.48-.244 7.75 7.75 0 1 1-6.372-6.372.75.75 0 0 1-.245 1.48A6.3 6.3 0 0 0 10 3.75",
+      style: {
+        animation: "rs-icon-rotate 1s linear infinite",
+        transformOrigin: "center center"
+      }
+    });
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+
+  let t1;
+
+  if ($[1] !== props || $[2] !== ref) {
+    t1 = /*#__PURE__*/React.createElement("svg", _extends({
+      viewBox: "0 0 20 20"
+    }, props, {
+      ref: ref
+    }), t0);
+    $[1] = props;
+    $[2] = ref;
+    $[3] = t1;
+  } else {
+    t1 = $[3];
+  }
+
+  return t1;
+});
 LoadingOutlineIcon20.displayName = 'LoadingOutlineIcon20';
-const LoadingOutlineIcon24 = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement("svg", _extends({
-  viewBox: "0 0 24 24"
-}, props, {
-  ref: ref
-}), /*#__PURE__*/React.createElement("path", {
-  d: "M12 5a7 7 0 1 0 6.906 5.848 1 1 0 1 1 1.973-.327q.12.724.121 1.479a9 9 0 1 1-7.521-8.879 1 1 0 0 1-.327 1.973A7 7 0 0 0 12 5",
-  style: {
-    animation: "rs-icon-rotate 1s linear infinite",
-    transformOrigin: "center center"
-  }
-})));
+const LoadingOutlineIcon24 = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const $ = c(4);
+  let t0;
+
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t0 = /*#__PURE__*/React.createElement("path", {
+      d: "M12 5a7 7 0 1 0 6.906 5.848 1 1 0 1 1 1.973-.327q.12.724.121 1.479a9 9 0 1 1-7.521-8.879 1 1 0 0 1-.327 1.973A7 7 0 0 0 12 5",
+      style: {
+        animation: "rs-icon-rotate 1s linear infinite",
+        transformOrigin: "center center"
+      }
+    });
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+
+  let t1;
+
+  if ($[1] !== props || $[2] !== ref) {
+    t1 = /*#__PURE__*/React.createElement("svg", _extends({
+      viewBox: "0 0 24 24"
+    }, props, {
+      ref: ref
+    }), t0);
+    $[1] = props;
+    $[2] = ref;
+    $[3] = t1;
+  } else {
+    t1 = $[3];
+  }
+
+  return t1;
+});
 LoadingOutlineIcon24.displayName = 'LoadingOutlineIcon24';
-const LoadingOutlineIcon28 = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement("svg", _extends({
-  viewBox: "0 0 28 28"
-}, props, {
-  ref: ref
-}), /*#__PURE__*/React.createElement("path", {
-  d: "M14 6a8 8 0 1 0 7.892 6.683 1 1 0 1 1 1.974-.326q.133.803.134 1.643c0 5.523-4.477 10-10 10S4 19.523 4 14 8.477 4 14 4q.775.001 1.52.115a1 1 0 1 1-.302 1.977A8 8 0 0 0 14 6",
-  style: {
-    animation: "rs-icon-rotate 1s linear infinite",
-    transformOrigin: "center center"
-  }
-})));
+const LoadingOutlineIcon28 = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const $ = c(4);
+  let t0;
+
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t0 = /*#__PURE__*/React.createElement("path", {
+      d: "M14 6a8 8 0 1 0 7.892 6.683 1 1 0 1 1 1.974-.326q.133.803.134 1.643c0 5.523-4.477 10-10 10S4 19.523 4 14 8.477 4 14 4q.775.001 1.52.115a1 1 0 1 1-.302 1.977A8 8 0 0 0 14 6",
+      style: {
+        animation: "rs-icon-rotate 1s linear infinite",
+        transformOrigin: "center center"
+      }
+    });
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+
+  let t1;
+
+  if ($[1] !== props || $[2] !== ref) {
+    t1 = /*#__PURE__*/React.createElement("svg", _extends({
+      viewBox: "0 0 28 28"
+    }, props, {
+      ref: ref
+    }), t0);
+    $[1] = props;
+    $[2] = ref;
+    $[3] = t1;
+  } else {
+    t1 = $[3];
+  }
+
+  return t1;
+});
 LoadingOutlineIcon28.displayName = 'LoadingOutlineIcon28';
-const LoadingOutlineIcon = /*#__PURE__*/React.forwardRef((_ref, ref) => {
-  let {
-    theme,
-    size: sizeFromProps = "m",
-    className,
-    style,
-    ['data-render-all-sizes']: renderAllSizes = false,
-    ...props
-  } = _ref;
+const LoadingOutlineIcon = /*#__PURE__*/React.forwardRef((t0, ref) => {
+  const $ = c(34);
+  let className;
+  let props;
+  let style;
+  let t1;
+  let t2;
+  let theme;
+
+  if ($[0] !== t0) {
+    ({
+      theme,
+      size: t1,
+      className,
+      style,
+      "data-render-all-sizes": t2,
+      ...props
+    } = t0);
+    $[0] = t0;
+    $[1] = className;
+    $[2] = props;
+    $[3] = style;
+    $[4] = t1;
+    $[5] = t2;
+    $[6] = theme;
+  } else {
+    className = $[1];
+    props = $[2];
+    style = $[3];
+    t1 = $[4];
+    t2 = $[5];
+    theme = $[6];
+  }
+
+  const sizeFromProps = t1 === undefined ? "m" : t1;
+  const renderAllSizes = t2 === undefined ? false : t2;
   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,
+  const t3 = styles[theme];
+  const t4 = sizeStyles[size];
+  const t5 = renderAllSizes && styles.allVariants;
+  let t6;
+
+  if ($[7] !== className || $[8] !== t3 || $[9] !== t4 || $[10] !== t5) {
+    t6 = cn(styles.icon, t3, t4, t5, className);
+    $[7] = className;
+    $[8] = t3;
+    $[9] = t4;
+    $[10] = t5;
+    $[11] = t6;
+  } else {
+    t6 = $[11];
+  }
+
+  let t7;
+
+  if ($[12] !== renderAllSizes || $[13] !== style) {
+    t7 = renderAllSizes ? {
+      "--rs-icon-ar-width": 28,
+      "--rs-icon-ar-height": 28,
       ...style
-    } : style,
-    ref
-  };
+    } : style;
+    $[12] = renderAllSizes;
+    $[13] = style;
+    $[14] = t7;
+  } else {
+    t7 = $[14];
+  }
+
+  let t8;
+
+  if ($[15] !== props || $[16] !== ref || $[17] !== t6 || $[18] !== t7) {
+    t8 = { ...props,
+      className: t6,
+      style: t7,
+      ref
+    };
+    $[15] = props;
+    $[16] = ref;
+    $[17] = t6;
+    $[18] = t7;
+    $[19] = t8;
+  } else {
+    t8 = $[19];
+  }
+
+  const mainProps = t8;
 
   if (renderAllSizes) {
-    return /*#__PURE__*/React.createElement("svg", _extends({
-      viewBox: "0 0 28 28"
-    }, mainProps), /*#__PURE__*/React.createElement(LoadingOutlineIcon16, {
-      className: styles.variant16
-    }), /*#__PURE__*/React.createElement(LoadingOutlineIcon20, {
-      className: styles.variant20
-    }), /*#__PURE__*/React.createElement(LoadingOutlineIcon24, {
-      className: styles.variant24
-    }), /*#__PURE__*/React.createElement(LoadingOutlineIcon28, {
-      className: styles.variant28
-    }));
+    let t10;
+    let t11;
+    let t12;
+    let t9;
+
+    if ($[20] === Symbol.for("react.memo_cache_sentinel")) {
+      t9 = /*#__PURE__*/React.createElement(LoadingOutlineIcon16, {
+        className: styles.variant16
+      });
+      t10 = /*#__PURE__*/React.createElement(LoadingOutlineIcon20, {
+        className: styles.variant20
+      });
+      t11 = /*#__PURE__*/React.createElement(LoadingOutlineIcon24, {
+        className: styles.variant24
+      });
+      t12 = /*#__PURE__*/React.createElement(LoadingOutlineIcon28, {
+        className: styles.variant28
+      });
+      $[20] = t10;
+      $[21] = t11;
+      $[22] = t12;
+      $[23] = t9;
+    } else {
+      t10 = $[20];
+      t11 = $[21];
+      t12 = $[22];
+      t9 = $[23];
+    }
+
+    let t13;
+
+    if ($[24] !== mainProps) {
+      t13 = /*#__PURE__*/React.createElement("svg", _extends({
+        viewBox: "0 0 28 28"
+      }, mainProps), t9, t10, t11, t12);
+      $[24] = mainProps;
+      $[25] = t13;
+    } else {
+      t13 = $[25];
+    }
+
+    return t13;
   }
 
-  if (size === Size['xs']) {
-    return /*#__PURE__*/React.createElement(LoadingOutlineIcon16, mainProps);
+  if (size === Size.xs) {
+    let t9;
+
+    if ($[26] !== mainProps) {
+      t9 = /*#__PURE__*/React.createElement(LoadingOutlineIcon16, mainProps);
+      $[26] = mainProps;
+      $[27] = t9;
+    } else {
+      t9 = $[27];
+    }
+
+    return t9;
   }
 
-  if (size === Size['s']) {
-    return /*#__PURE__*/React.createElement(LoadingOutlineIcon20, mainProps);
+  if (size === Size.s) {
+    let t9;
+
+    if ($[28] !== mainProps) {
+      t9 = /*#__PURE__*/React.createElement(LoadingOutlineIcon20, mainProps);
+      $[28] = mainProps;
+      $[29] = t9;
+    } else {
+      t9 = $[29];
+    }
+
+    return t9;
+  }
+
+  if (size === Size.m) {
+    let t9;
+
+    if ($[30] !== mainProps) {
+      t9 = /*#__PURE__*/React.createElement(LoadingOutlineIcon24, mainProps);
+      $[30] = mainProps;
+      $[31] = t9;
+    } else {
+      t9 = $[31];
+    }
+
+    return t9;
   }
 
-  if (size === Size['m']) {
-    return /*#__PURE__*/React.createElement(LoadingOutlineIcon24, mainProps);
+  let t9;
+
+  if ($[32] !== mainProps) {
+    t9 = /*#__PURE__*/React.createElement(LoadingOutlineIcon28, mainProps);
+    $[32] = mainProps;
+    $[33] = t9;
+  } else {
+    t9 = $[33];
   }
 
-  return /*#__PURE__*/React.createElement(LoadingOutlineIcon28, mainProps);
+  return t9;
 });
 LoadingOutlineIcon.displayName = 'LoadingOutlineIcon';
 LoadingOutlineIcon.propTypes = {

package/lib/hooks/use-a11y.d.ts

@@ -5,10 +5,10 @@ export type UseA11yArgs = {
     description?: React.ReactNode;
     error?: React.ReactNode;
     label?: React.ReactNode;
-    fieldRef?: React.RefObject<HTMLElement>;
+    fieldEl?: HTMLElement | null;
     isDisabled?: boolean;
 };
-export declare const useA11y: ({ baseId: baseIdFromProps, prefix, description, error, label, fieldRef, isDisabled }: UseA11yArgs) => {
+export declare const useA11y: ({ baseId: baseIdFromProps, prefix, description, error, label, fieldEl, isDisabled }: UseA11yArgs) => {
     baseId: string;
     fieldProps: {
         'aria-invalid': boolean;

package/lib/hooks/use-a11y.js

@@ -1,56 +1,144 @@
-import { useSafeId } from './use-safe-id.js'; // eslint-disable-next-line complexity
+import { c } from 'react-compiler-runtime';
+import { useSafeId } from './use-safe-id.js';
 
-const useA11y = _ref => {
-  let {
+const useA11y = t0 => {
+  const $ = c(26);
+  const {
     baseId: baseIdFromProps,
-    prefix = '',
+    prefix: t1,
     description,
     error,
     label,
-    fieldRef,
-    isDisabled = false
-  } = _ref;
-  const uniqueId = `${prefix ? `${prefix}-` : ''}${useSafeId()}`;
+    fieldEl,
+    isDisabled: t2
+  } = t0;
+  const prefix = t1 === undefined ? "" : t1;
+  const isDisabled = t2 === undefined ? false : t2;
+  const uniqueId = `${prefix ? `${prefix}-` : ""}${useSafeId()}`;
   const baseId = baseIdFromProps ?? uniqueId;
   const fieldId = `${baseId}-field`;
   const descriptionId = description ? `${baseId}-description` : undefined;
   const errorId = error ? `${baseId}-error` : undefined;
   const labelId = label ? `${baseId}-label` : undefined;
-  const describedBy = [descriptionId, errorId].filter(Boolean).join(' ') || undefined;
-  const fieldProps = {
-    'aria-invalid': Boolean(error),
-    'aria-describedby': describedBy,
-    'aria-labelledby': labelId,
-    id: fieldId
-  };
-  const errorMessageProps = {
-    id: errorId
-  };
-  const descriptionProps = {
-    id: descriptionId
-  };
-  const labelProps = {
-    id: labelId,
-    htmlFor: fieldId,
-    onClick: () => {
+  let t3;
+
+  if ($[0] !== descriptionId || $[1] !== errorId) {
+    t3 = [descriptionId, errorId].filter(Boolean).join(" ") || undefined;
+    $[0] = descriptionId;
+    $[1] = errorId;
+    $[2] = t3;
+  } else {
+    t3 = $[2];
+  }
+
+  const describedBy = t3;
+  const t4 = Boolean(error);
+  let t5;
+
+  if ($[3] !== describedBy || $[4] !== fieldId || $[5] !== labelId || $[6] !== t4) {
+    t5 = {
+      "aria-invalid": t4,
+      "aria-describedby": describedBy,
+      "aria-labelledby": labelId,
+      id: fieldId
+    };
+    $[3] = describedBy;
+    $[4] = fieldId;
+    $[5] = labelId;
+    $[6] = t4;
+    $[7] = t5;
+  } else {
+    t5 = $[7];
+  }
+
+  const fieldProps = t5;
+  let t6;
+
+  if ($[8] !== errorId) {
+    t6 = {
+      id: errorId
+    };
+    $[8] = errorId;
+    $[9] = t6;
+  } else {
+    t6 = $[9];
+  }
+
+  const errorMessageProps = t6;
+  let t7;
+
+  if ($[10] !== descriptionId) {
+    t7 = {
+      id: descriptionId
+    };
+    $[10] = descriptionId;
+    $[11] = t7;
+  } else {
+    t7 = $[11];
+  }
+
+  const descriptionProps = t7;
+  let t8;
+
+  if ($[12] !== fieldEl || $[13] !== fieldId || $[14] !== isDisabled) {
+    t8 = () => {
       if (isDisabled) {
         return;
       }
 
-      if (fieldRef?.current) {
-        fieldRef.current.focus();
+      if (fieldEl) {
+        fieldEl.focus();
       } else {
         document.getElementById(fieldId)?.focus();
       }
-    }
-  };
-  return {
-    baseId,
-    fieldProps,
-    descriptionProps,
-    errorMessageProps,
-    labelProps
-  };
+    };
+
+    $[12] = fieldEl;
+    $[13] = fieldId;
+    $[14] = isDisabled;
+    $[15] = t8;
+  } else {
+    t8 = $[15];
+  }
+
+  let t9;
+
+  if ($[16] !== fieldId || $[17] !== labelId || $[18] !== t8) {
+    t9 = {
+      id: labelId,
+      htmlFor: fieldId,
+      onClick: t8
+    };
+    $[16] = fieldId;
+    $[17] = labelId;
+    $[18] = t8;
+    $[19] = t9;
+  } else {
+    t9 = $[19];
+  }
+
+  const labelProps = t9;
+  let t10;
+
+  if ($[20] !== baseId || $[21] !== descriptionProps || $[22] !== errorMessageProps || $[23] !== fieldProps || $[24] !== labelProps) {
+    t10 = {
+      baseId,
+      fieldProps,
+      descriptionProps,
+      errorMessageProps,
+      labelProps
+    };
+    $[20] = baseId;
+    $[21] = descriptionProps;
+    $[22] = errorMessageProps;
+    $[23] = fieldProps;
+    $[24] = labelProps;
+    $[25] = t10;
+  } else {
+    t10 = $[25];
+  }
+
+  return t10;
 };
 
 export { useA11y };

package/lib/hooks/use-actual-size-from-css.d.ts

@@ -1,10 +1,9 @@
-import React from 'react';
 import type { SelectSize } from '../types';
 export type UseActualSizeFromCssParams = {
     sizeFromProps: SelectSize;
-    triggerRef: React.RefObject<HTMLElement>;
+    triggerEl: HTMLElement | null;
 };
-export declare const useActualSizeFromCss: ({ sizeFromProps, triggerRef }: UseActualSizeFromCssParams) => {
-    observableRef: React.RefObject<HTMLDivElement>;
+export declare const useActualSizeFromCss: ({ sizeFromProps, triggerEl }: UseActualSizeFromCssParams) => {
+    observableRef: import("react").RefObject<HTMLDivElement>;
     size: "l" | "m" | "s";
 };