@rescui/collapse 0.8.6-RUI-308-Fix-select-issues-405b9fa40.12 → 0.9.1

package/lib/collapse.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, useContext, useRef, useEffect } from 'react';
 import cn from 'classnames';
 import PropTypes from 'prop-types';
@@ -29,24 +31,83 @@ const ICON_STYLES = {
   arrow: styles.iconArrow
 };
 const Collapse = /*#__PURE__*/React.forwardRef( // eslint-disable-next-line complexity
-(_ref, ref) => {
-  let {
-    children,
-    className,
-    openedClassName: openedClassnameFromProps,
-    size: sizeFromProps,
-    mode: modeFromProps,
-    icon: iconFromProps,
-    borderBottom: borderBottomFromProps,
-    disableLeftPadding: disableLeftPaddingFromProps,
-    title,
-    isDefaultOpened = false,
-    theme: themeFromProps,
-    itemKey,
-    ...restProps
-  } = _ref;
+(t0, ref) => {
+  const $ = c(63);
+  let borderBottomFromProps;
+  let children;
+  let className;
+  let disableLeftPaddingFromProps;
+  let iconFromProps;
+  let itemKey;
+  let modeFromProps;
+  let openedClassnameFromProps;
+  let restProps;
+  let sizeFromProps;
+  let t1;
+  let themeFromProps;
+  let title;
+
+  if ($[0] !== t0) {
+    ({
+      children,
+      className,
+      openedClassName: openedClassnameFromProps,
+      size: sizeFromProps,
+      mode: modeFromProps,
+      icon: iconFromProps,
+      borderBottom: borderBottomFromProps,
+      disableLeftPadding: disableLeftPaddingFromProps,
+      title,
+      isDefaultOpened: t1,
+      theme: themeFromProps,
+      itemKey,
+      ...restProps
+    } = t0);
+    $[0] = t0;
+    $[1] = borderBottomFromProps;
+    $[2] = children;
+    $[3] = className;
+    $[4] = disableLeftPaddingFromProps;
+    $[5] = iconFromProps;
+    $[6] = itemKey;
+    $[7] = modeFromProps;
+    $[8] = openedClassnameFromProps;
+    $[9] = restProps;
+    $[10] = sizeFromProps;
+    $[11] = t1;
+    $[12] = themeFromProps;
+    $[13] = title;
+  } else {
+    borderBottomFromProps = $[1];
+    children = $[2];
+    className = $[3];
+    disableLeftPaddingFromProps = $[4];
+    iconFromProps = $[5];
+    itemKey = $[6];
+    modeFromProps = $[7];
+    openedClassnameFromProps = $[8];
+    restProps = $[9];
+    sizeFromProps = $[10];
+    t1 = $[11];
+    themeFromProps = $[12];
+    title = $[13];
+  }
+
+  const isDefaultOpened = t1 === undefined ? false : t1;
   const uniqueId = useSafeId();
-  const [key] = useState(() => itemKey ?? uniqueId);
+  let t2;
+
+  if ($[14] !== itemKey || $[15] !== uniqueId) {
+    t2 = () => itemKey ?? uniqueId;
+
+    $[14] = itemKey;
+    $[15] = uniqueId;
+    $[16] = t2;
+  } else {
+    t2 = $[16];
+  }
+
+  const [key] = useState(t2);
   const [isAccordionConnected, setIsAccordionConnected] = useState(false);
   const theme = useThemeWithUndefined(themeFromProps);
   const {
@@ -62,88 +123,219 @@ const Collapse = /*#__PURE__*/React.forwardRef( // eslint-disable-next-line comp
     disableLeftPadding: disableLeftPaddingFromContext,
     openedClassName: openedClassNameFromContext
   } = useContext(collapseContext);
-  const size = sizeFromProps ?? sizeFromContext ?? 'm';
-  const mode = modeFromProps ?? modeFromContext ?? 'classic';
-  const icon = iconFromProps ?? iconFromContext ?? 'left-plus';
+  const size = sizeFromProps ?? sizeFromContext ?? "m";
+  const mode = modeFromProps ?? modeFromContext ?? "classic";
+  const icon = iconFromProps ?? iconFromContext ?? "left-plus";
   const borderBottom = borderBottomFromProps ?? borderBottomFromContext ?? false;
   const disableLeftPadding = disableLeftPaddingFromProps ?? disableLeftPaddingFromContext ?? false;
   const openedClassName = openedClassnameFromProps ?? openedClassNameFromContext;
   const contentRef = useRef(null);
-  const [isAnimationEnabled, setIsAnimationEnabled] = useState(!isInAccordion); // this state is ignored in accordion
+  const [isAnimationEnabled, setIsAnimationEnabled] = useState(!isInAccordion);
+  const [shouldBeOpenedLocal, setShouldBeOpenedLocal] = useState(isDefaultOpened);
+  const shouldBeOpened = isAccordionConnected ? openedKey === key : shouldBeOpenedLocal;
+  let t3;
+  let t4;
 
-  const [shouldBeOpenedLocal, setShouldBeOpenedLocal] = useState(isDefaultOpened); // boolean state. ignores CLOSING and OPENING states
+  if ($[17] !== isAccordionConnected || $[18] !== isDefaultOpened || $[19] !== isInAccordion || $[20] !== isInControlledAccordion || $[21] !== key || $[22] !== setActiveKey) {
+    t3 = () => {
+      if (!isInAccordion) {
+        return;
+      }
 
-  const shouldBeOpened = isAccordionConnected ? openedKey === key : shouldBeOpenedLocal;
-  useEffect(() => {
-    if (!isInAccordion) {
-      return;
-    }
-
-    if (!isAccordionConnected) {
-      // For an uncontrolled accordion, register the initially opened item.
-      // Keep using the local state until this update and the connection update
-      // have rendered together.
-      if (!isInControlledAccordion && isDefaultOpened && setActiveKey) {
-        setActiveKey(key);
-      } // eslint-disable-next-line react-hooks/set-state-in-effect
-
-
-      setIsAccordionConnected(true);
-      return;
-    } // The first accordion state has already been committed. Enabling
-    // transitions separately makes its initial reconciliation instantaneous.
-    // eslint-disable-next-line react-hooks/set-state-in-effect
-
-
-    setIsAnimationEnabled(true);
-  }, [isAccordionConnected, isInAccordion, isInControlledAccordion, isDefaultOpened, setActiveKey, key]); // add CLOSING and OPENING states
-
-  const collapseState = useCollapseState({
-    shouldBeOpened,
-    contentRef
-  });
+      if (!isAccordionConnected) {
+        if (!isInControlledAccordion && isDefaultOpened && setActiveKey) {
+          setActiveKey(key);
+        }
+
+        setIsAccordionConnected(true);
+        return;
+      }
+
+      setIsAnimationEnabled(true);
+    };
+
+    t4 = [isAccordionConnected, isInAccordion, isInControlledAccordion, isDefaultOpened, setActiveKey, key];
+    $[17] = isAccordionConnected;
+    $[18] = isDefaultOpened;
+    $[19] = isInAccordion;
+    $[20] = isInControlledAccordion;
+    $[21] = key;
+    $[22] = setActiveKey;
+    $[23] = t3;
+    $[24] = t4;
+  } else {
+    t3 = $[23];
+    t4 = $[24];
+  }
+
+  useEffect(t3, t4);
+  let t5;
+
+  if ($[25] !== shouldBeOpened) {
+    t5 = {
+      shouldBeOpened,
+      contentRef
+    };
+    $[25] = shouldBeOpened;
+    $[26] = t5;
+  } else {
+    t5 = $[26];
+  }
+
+  const collapseState = useCollapseState(t5);
   const isOpening = collapseState === COLLAPSE_STATES.OPENING;
   const isOpened = collapseState === COLLAPSE_STATES.OPEN;
   const isClosing = collapseState === COLLAPSE_STATES.CLOSING;
   const isClosed = collapseState === COLLAPSE_STATES.CLOSE;
-  const isRightIcon = icon === 'right-plus';
-  const Icon = icon === 'arrow' ? RightIcon : PlusIcon;
-
-  const toggleOpened = () => {
-    if (toggleActiveKey) {
-      toggleActiveKey(key);
-    } // this state update does nothing in accordion
-
-
-    setShouldBeOpenedLocal(!shouldBeOpened);
-  };
-
-  return /*#__PURE__*/React.createElement("div", {
-    "data-test": 'collapse',
-    ...restProps,
-    className: cn(className, styles.main, isAnimationEnabled && styles.animationEnabled, isOpening && styles.opening, isOpened && styles.opened, isClosing && styles.closing, isClosed && styles.closed, !isClosed && openedClassName, SIZE_STYLES[size], MODE_STYLES[mode], ICON_STYLES[icon], borderBottom && styles.hasBorderBottom, disableLeftPadding && styles.disableLeftPadding, isRightIcon ? styles.rightIcon : styles.leftIcon, THEME_STYLES[theme]),
-    "data-rs-internal": "collapse__collapse",
-    ref: ref
-  }, /*#__PURE__*/React.createElement("button", {
-    type: "button",
-    "data-test": 'collapse__button',
-    "data-rs-internal": "collapse__button",
-    className: styles.button,
-    onClick: toggleOpened
-  }, /*#__PURE__*/React.createElement(Icon, {
-    className: styles.icon,
-    "data-render-all-sizes": true
-  }), /*#__PURE__*/React.createElement("span", {
-    className: cn(styles.title),
-    "data-rs-internal": "collapse__title"
-  }, title)), /*#__PURE__*/React.createElement("div", {
-    className: styles.content,
-    "data-rs-internal": "collapse__content",
-    ref: contentRef,
-    tabIndex: -1
-  }, /*#__PURE__*/React.createElement("div", {
-    className: styles.innerWrapper
-  }, children)));
+  const isRightIcon = icon === "right-plus";
+  const Icon = icon === "arrow" ? RightIcon : PlusIcon;
+  let t6;
+
+  if ($[27] !== key || $[28] !== shouldBeOpened || $[29] !== toggleActiveKey) {
+    t6 = () => {
+      if (toggleActiveKey) {
+        toggleActiveKey(key);
+      }
+
+      setShouldBeOpenedLocal(!shouldBeOpened);
+    };
+
+    $[27] = key;
+    $[28] = shouldBeOpened;
+    $[29] = toggleActiveKey;
+    $[30] = t6;
+  } else {
+    t6 = $[30];
+  }
+
+  const toggleOpened = t6;
+  const t7 = isAnimationEnabled && styles.animationEnabled;
+  const t8 = isOpening && styles.opening;
+  const t9 = isOpened && styles.opened;
+  const t10 = isClosing && styles.closing;
+  const t11 = isClosed && styles.closed;
+  const t12 = !isClosed && openedClassName;
+  const t13 = SIZE_STYLES[size];
+  const t14 = MODE_STYLES[mode];
+  const t15 = ICON_STYLES[icon];
+  const t16 = borderBottom && styles.hasBorderBottom;
+  const t17 = disableLeftPadding && styles.disableLeftPadding;
+  const t18 = isRightIcon ? styles.rightIcon : styles.leftIcon;
+  const t19 = THEME_STYLES[theme];
+  let t20;
+
+  if ($[31] !== className || $[32] !== t10 || $[33] !== t11 || $[34] !== t12 || $[35] !== t13 || $[36] !== t14 || $[37] !== t15 || $[38] !== t16 || $[39] !== t17 || $[40] !== t18 || $[41] !== t19 || $[42] !== t7 || $[43] !== t8 || $[44] !== t9) {
+    t20 = cn(className, styles.main, t7, t8, t9, t10, t11, t12, t13, t14, t15, t16, t17, t18, t19);
+    $[31] = className;
+    $[32] = t10;
+    $[33] = t11;
+    $[34] = t12;
+    $[35] = t13;
+    $[36] = t14;
+    $[37] = t15;
+    $[38] = t16;
+    $[39] = t17;
+    $[40] = t18;
+    $[41] = t19;
+    $[42] = t7;
+    $[43] = t8;
+    $[44] = t9;
+    $[45] = t20;
+  } else {
+    t20 = $[45];
+  }
+
+  let t21;
+
+  if ($[46] !== Icon) {
+    t21 = /*#__PURE__*/React.createElement(Icon, {
+      className: styles.icon,
+      "data-render-all-sizes": true
+    });
+    $[46] = Icon;
+    $[47] = t21;
+  } else {
+    t21 = $[47];
+  }
+
+  let t22;
+
+  if ($[48] === Symbol.for("react.memo_cache_sentinel")) {
+    t22 = cn(styles.title);
+    $[48] = t22;
+  } else {
+    t22 = $[48];
+  }
+
+  let t23;
+
+  if ($[49] !== title) {
+    t23 = /*#__PURE__*/React.createElement("span", {
+      className: t22,
+      "data-rs-internal": "collapse__title"
+    }, title);
+    $[49] = title;
+    $[50] = t23;
+  } else {
+    t23 = $[50];
+  }
+
+  let t24;
+
+  if ($[51] !== t21 || $[52] !== t23 || $[53] !== toggleOpened) {
+    t24 = /*#__PURE__*/React.createElement("button", {
+      type: "button",
+      "data-test": "collapse__button",
+      "data-rs-internal": "collapse__button",
+      className: styles.button,
+      onClick: toggleOpened
+    }, t21, t23);
+    $[51] = t21;
+    $[52] = t23;
+    $[53] = toggleOpened;
+    $[54] = t24;
+  } else {
+    t24 = $[54];
+  }
+
+  let t25;
+
+  if ($[55] !== children) {
+    t25 = /*#__PURE__*/React.createElement("div", {
+      className: styles.content,
+      "data-rs-internal": "collapse__content",
+      ref: contentRef,
+      tabIndex: -1
+    }, /*#__PURE__*/React.createElement("div", {
+      className: styles.innerWrapper
+    }, children));
+    $[55] = children;
+    $[56] = t25;
+  } else {
+    t25 = $[56];
+  }
+
+  let t26;
+
+  if ($[57] !== ref || $[58] !== restProps || $[59] !== t20 || $[60] !== t24 || $[61] !== t25) {
+    t26 = /*#__PURE__*/React.createElement("div", _extends({
+      "data-test": "collapse"
+    }, restProps, {
+      className: t20,
+      "data-rs-internal": "collapse__collapse",
+      ref: ref
+    }), t24, t25);
+    $[57] = ref;
+    $[58] = restProps;
+    $[59] = t20;
+    $[60] = t24;
+    $[61] = t25;
+    $[62] = t26;
+  } else {
+    t26 = $[62];
+  }
+
+  return t26;
 });
 Collapse.displayName = 'Collapse';
 Collapse.propTypes = {

package/lib/collapse.p.module.css.js

@@ -1,35 +1,35 @@
 var styles = {
-  "themeLight": "_themeLight_1m640ib_6",
-  "themeDark": "_themeDark_1m640ib_9",
-  "sizeS": "_sizeS_1m640ib_13",
-  "sizeM": "_sizeM_1m640ib_16",
-  "sizeL": "_sizeL_1m640ib_19",
-  "classic": "_classic_1m640ib_23",
-  "rock": "_rock_1m640ib_26",
-  "clear": "_clear_1m640ib_29",
-  "hasBorderBottom": "_hasBorderBottom_1m640ib_33",
-  "leftIcon": "_leftIcon_1m640ib_37",
-  "rightIcon": "_rightIcon_1m640ib_40",
-  "disableLeftPadding": "_disableLeftPadding_1m640ib_44",
-  "main": "_main_1m640ib_48",
-  "opening": "_opening_1m640ib_59",
-  "opened": "_opened_1m640ib_60",
-  "closing": "_closing_1m640ib_61",
-  "title": "_title_1m640ib_95",
-  "content": "_content_1m640ib_103",
-  "animationEnabled": "_animationEnabled_1m640ib_115",
-  "closed": "_closed_1m640ib_128",
-  "innerWrapper": "_innerWrapper_1m640ib_133",
-  "button": "_button_1m640ib_140",
-  "icon": "_icon_1m640ib_196",
-  "iconPlus": "_iconPlus_1m640ib_217",
-  "iconArrow": "_iconArrow_1m640ib_222",
-  "accordion": "_accordion_1m640ib_228",
-  "accordionGap0": "_accordionGap0_1m640ib_233",
-  "accordionGap8": "_accordionGap8_1m640ib_236",
-  "accordionGap12": "_accordionGap12_1m640ib_239",
-  "accordionGap16": "_accordionGap16_1m640ib_242",
-  "accordionGap24": "_accordionGap24_1m640ib_245",
-  "accordionGap32": "_accordionGap32_1m640ib_248"
+  "themeLight": "_themeLight_1rx64ql_6",
+  "themeDark": "_themeDark_1rx64ql_9",
+  "sizeS": "_sizeS_1rx64ql_13",
+  "sizeM": "_sizeM_1rx64ql_16",
+  "sizeL": "_sizeL_1rx64ql_19",
+  "classic": "_classic_1rx64ql_23",
+  "rock": "_rock_1rx64ql_26",
+  "clear": "_clear_1rx64ql_29",
+  "hasBorderBottom": "_hasBorderBottom_1rx64ql_33",
+  "leftIcon": "_leftIcon_1rx64ql_37",
+  "rightIcon": "_rightIcon_1rx64ql_40",
+  "disableLeftPadding": "_disableLeftPadding_1rx64ql_44",
+  "main": "_main_1rx64ql_48",
+  "opening": "_opening_1rx64ql_59",
+  "opened": "_opened_1rx64ql_60",
+  "closing": "_closing_1rx64ql_61",
+  "title": "_title_1rx64ql_95",
+  "content": "_content_1rx64ql_103",
+  "animationEnabled": "_animationEnabled_1rx64ql_115",
+  "closed": "_closed_1rx64ql_128",
+  "innerWrapper": "_innerWrapper_1rx64ql_133",
+  "button": "_button_1rx64ql_140",
+  "icon": "_icon_1rx64ql_196",
+  "iconPlus": "_iconPlus_1rx64ql_220",
+  "iconArrow": "_iconArrow_1rx64ql_225",
+  "accordion": "_accordion_1rx64ql_231",
+  "accordionGap0": "_accordionGap0_1rx64ql_236",
+  "accordionGap8": "_accordionGap8_1rx64ql_239",
+  "accordionGap12": "_accordionGap12_1rx64ql_242",
+  "accordionGap16": "_accordionGap16_1rx64ql_245",
+  "accordionGap24": "_accordionGap24_1rx64ql_248",
+  "accordionGap32": "_accordionGap32_1rx64ql_251"
 };
 export { styles as default };