@rescui/chip-list 0.14.5-RUI-308-Fix-select-issues-405b9fa40.12 → 0.15.0

package/lib/parts/use-items-ids.js

@@ -1,4 +1,5 @@
-import React, { useRef, useCallback, useMemo, cloneElement } from 'react';
+import { c } from 'react-compiler-runtime';
+import React, { useRef, cloneElement } from 'react';
 import { deepMap } from './deep-map.js';
 import Chip from './chip.js';
 
@@ -32,90 +33,129 @@ const hasElHref = el => typeof el.props?.href !== 'undefined';
 
 const hasElAriaControls = el => typeof el.props?.['aria-controls'] !== 'undefined';
 
-const useItemsIds = _ref2 => {
-  let {
-    children,
-    compareValues,
-    value
-  } = _ref2;
-  const tabRefs = useRef(new Map());
-  const createChipRef = useCallback((itemId, childRef) => node => {
-    if (node) {
-      tabRefs.current.set(itemId, node);
+function getChildrenWithValues(children, compareValues, value, createChipRef) {
+  let counter = 0;
+  const currentSelectedItemIds = [];
+  let currentHasHref = false;
+  let currentHasControls = false;
+  let currentAllItemsHaveControls = true;
+  const items = deepMap(children, child => {
+    if (child.type === Chip) {
+      if (hasElHref(child)) {
+        currentHasHref = true;
+      }
+
+      if (hasElAriaControls(child)) {
+        currentHasControls = true;
+      } else {
+        currentAllItemsHaveControls = false;
+      }
+
+      const childValue = hasElValue(child) ? child.props.value : counter;
+      const isSelectedItem = compareValues(value, childValue);
+
+      if (isSelectedItem) {
+        currentSelectedItemIds.push(counter);
+      }
+
+      const patchedItem = patchItemIfNeeded({
+        child,
+        itemId: counter,
+        childValue,
+        ref: createChipRef(counter, getElementRef(child))
+      });
+      counter += 1;
+      return patchedItem;
     } else {
-      tabRefs.current.delete(itemId);
+      return child;
     }
+  });
+  return {
+    childrenWithValues: React.Children.toArray(items),
+    selectedIds: currentSelectedItemIds,
+    hasHref: currentHasHref,
+    hasControls: currentHasControls,
+    allItemsHaveControls: counter > 0 && currentAllItemsHaveControls
+  };
+}
 
-    setRef(childRef, node);
-  }, []);
+const useItemsIds = t0 => {
+  const $ = c(12);
   const {
-    childrenWithValues,
-    selectedIds,
-    hasHref,
-    hasControls,
-    allItemsHaveControls
-  } = useMemo(() => {
-    let counter = 0;
-    const currentSelectedItemIds = [];
-    let currentHasHref = false;
-    let currentHasControls = false;
-    let currentAllItemsHaveControls = true;
-    /*
-     * deepMap invokes its callback synchronously. The callback ref is created
-     * during render, but accesses tabRefs.current only when React invokes it
-     * during commit.
-     */
-    // eslint-disable-next-line react-hooks/refs
-
-    const items = deepMap(children, child => {
-      if (child.type === Chip) {
-        if (hasElHref(child)) {
-          // same explanation as above
-          // eslint-disable-next-line react-hooks/immutability
-          currentHasHref = true;
-        }
-
-        if (hasElAriaControls(child)) {
-          currentHasControls = true;
-        } else {
-          currentAllItemsHaveControls = false;
-        }
-
-        const childValue = hasElValue(child) ? child.props.value : counter;
-        const isSelectedItem = compareValues(value, childValue);
-
-        if (isSelectedItem) {
-          currentSelectedItemIds.push(counter);
-        }
-
-        const patchedItem = patchItemIfNeeded({
-          child,
-          itemId: counter,
-          childValue,
-          ref: createChipRef(counter, getElementRef(child))
-        });
-        counter += 1;
-        return patchedItem;
+    children,
+    compareValues,
+    value
+  } = t0;
+  let t1;
+
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t1 = new Map();
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+
+  const tabRefs = useRef(t1);
+  let t2;
+
+  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+    t2 = (itemId, childRef) => node => {
+      if (node) {
+        tabRefs.current.set(itemId, node);
       } else {
-        return child;
+        tabRefs.current.delete(itemId);
       }
-    });
-    return {
-      childrenWithValues: React.Children.toArray(items),
-      selectedIds: currentSelectedItemIds,
-      hasHref: currentHasHref,
-      hasControls: currentHasControls,
-      allItemsHaveControls: counter > 0 && currentAllItemsHaveControls
+
+      setRef(childRef, node);
     };
-  }, [children, value, compareValues, createChipRef]);
-  return {
+
+    $[1] = t2;
+  } else {
+    t2 = $[1];
+  }
+
+  const createChipRef = t2;
+  let t3;
+
+  if ($[2] !== children || $[3] !== compareValues || $[4] !== value) {
+    t3 = getChildrenWithValues(children, compareValues, value, createChipRef);
+    $[2] = children;
+    $[3] = compareValues;
+    $[4] = value;
+    $[5] = t3;
+  } else {
+    t3 = $[5];
+  }
+
+  const {
     childrenWithValues,
     selectedIds,
     hasHref,
     hasControls,
-    allItemsHaveControls,
-    tabRefs
-  };
+    allItemsHaveControls
+  } = t3;
+  let t4;
+
+  if ($[6] !== allItemsHaveControls || $[7] !== childrenWithValues || $[8] !== hasControls || $[9] !== hasHref || $[10] !== selectedIds) {
+    t4 = {
+      childrenWithValues,
+      selectedIds,
+      hasHref,
+      hasControls,
+      allItemsHaveControls,
+      tabRefs
+    };
+    $[6] = allItemsHaveControls;
+    $[7] = childrenWithValues;
+    $[8] = hasControls;
+    $[9] = hasHref;
+    $[10] = selectedIds;
+    $[11] = t4;
+  } else {
+    t4 = $[11];
+  }
+
+  return t4;
 };
 
 export { useItemsIds };

package/lib/parts/use-roving-tab-index.js

@@ -1,5 +1,6 @@
-import _includesInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/includes";
-import React from 'react'; // eslint-disable-next-line complexity
+import _includesInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/includes';
+import { c } from 'react-compiler-runtime';
+import { useState } from 'react';
 
 const getNextItemId = _ref => {
   let {
@@ -31,49 +32,73 @@ const getNextItemId = _ref => {
   return currentItemId;
 };
 
-const useRovingTabIndex = _ref2 => {
-  let {
+const useRovingTabIndex = t0 => {
+  const $ = c(6);
+  const {
     enabled,
     selectedId,
     tabRefs
-  } = _ref2;
-  const [currentTabStopId, setCurrentTabStopId] = React.useState(selectedId ?? 0);
-  const [previousSelectedId, setPreviousSelectedId] = React.useState(selectedId);
+  } = t0;
+  const [currentTabStopId, setCurrentTabStopId] = useState(selectedId ?? 0);
+  const [previousSelectedId, setPreviousSelectedId] = useState(selectedId);
 
   if (!Object.is(selectedId, previousSelectedId)) {
     setPreviousSelectedId(selectedId);
 
-    if (typeof selectedId !== 'undefined') {
+    if (typeof selectedId !== "undefined") {
       setCurrentTabStopId(selectedId);
     }
   }
 
   const currentTabsRefs = tabRefs?.current;
-  const onTabKeyDown = React.useCallback((e, itemId) => {
-    var _context;
+  let t1;
 
-    if (!enabled) {
-      return;
-    }
+  if ($[0] !== currentTabsRefs || $[1] !== enabled) {
+    t1 = (e, itemId) => {
+      var _context;
 
-    if (!_includesInstanceProperty(_context = ['ArrowLeft', 'ArrowRight', 'Home', 'End']).call(_context, e.key)) {
-      return;
-    }
+      if (!enabled) {
+        return;
+      }
+
+      if (!_includesInstanceProperty(_context = ["ArrowLeft", "ArrowRight", "Home", "End"]).call(_context, e.key)) {
+        return;
+      }
+
+      const itemsCount = currentTabsRefs.size ?? 0;
+      const nextItemId = getNextItemId({
+        currentItemId: itemId,
+        itemsCount,
+        key: e.key
+      });
+      e.preventDefault();
+      setCurrentTabStopId(nextItemId);
+      currentTabsRefs.get(nextItemId)?.focus();
+    };
+
+    $[0] = currentTabsRefs;
+    $[1] = enabled;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+
+  const onTabKeyDown = t1;
+  let t2;
+
+  if ($[3] !== currentTabStopId || $[4] !== onTabKeyDown) {
+    t2 = {
+      currentTabStopId,
+      onTabKeyDown
+    };
+    $[3] = currentTabStopId;
+    $[4] = onTabKeyDown;
+    $[5] = t2;
+  } else {
+    t2 = $[5];
+  }
 
-    const itemsCount = currentTabsRefs.size ?? 0;
-    const nextItemId = getNextItemId({
-      currentItemId: itemId,
-      itemsCount,
-      key: e.key
-    });
-    e.preventDefault();
-    setCurrentTabStopId(nextItemId);
-    currentTabsRefs.get(nextItemId)?.focus();
-  }, [enabled, currentTabsRefs]);
-  return {
-    currentTabStopId,
-    onTabKeyDown
-  };
+  return t2;
 };
 
 export { useRovingTabIndex };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rescui/chip-list",
-  "version": "0.14.5-RUI-308-Fix-select-issues-405b9fa40.12+405b9fa40",
+  "version": "0.15.0",
   "description": "",
   "license": "Apache-2.0",
   "author": "JetBrains",
@@ -17,23 +17,24 @@
   },
   "dependencies": {
     "@babel/runtime-corejs3": "^7.26.0",
-    "classnames": "^2.2.6"
+    "classnames": "^2.2.6",
+    "react-compiler-runtime": "^1.0.0"
   },
   "peerDependencies": {
     "@rescui/ui-contexts": "^0.6.0",
     "prop-types": "^15",
-    "react": ">=16.8.0 <20"
+    "react": ">=17.0.0 <20"
   },
   "devDependencies": {
-    "@rescui/colors": "0.3.4-RUI-308-Fix-select-issues-405b9fa40.12+405b9fa40",
-    "@rescui/scripts": "0.5.2",
-    "@rescui/typography": "0.27.5-RUI-308-Fix-select-issues-405b9fa40.12+405b9fa40",
-    "@rescui/visual-regression": "0.1.4"
+    "@rescui/colors": "^0.3.4",
+    "@rescui/scripts": "^0.5.3",
+    "@rescui/typography": "^0.28.0",
+    "@rescui/visual-regression": "^0.1.4"
   },
   "scripts": {
     "build": "rescui-scripts build && yarn run build-pcss-api",
     "build-pcss-api": "rescui-scripts build-pcss-api --file public-api.p.css"
   },
   "nx": {},
-  "gitHead": "405b9fa40886b0ab6709c9185e8214599d2d792e"
+  "gitHead": "8ffbbe20b8bcbb9ea15204113ab603675d4c03cd"
 }