@carbon/react 1.77.0-rc.0 → 1.77.0

package/es/components/MultiSelect/FilterableMultiSelect.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2025
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.

package/es/components/MultiSelect/FilterableMultiSelect.js

@@ -11,7 +11,7 @@ import cx from 'classnames';
 import Downshift, { useCombobox, useMultipleSelection } from 'downshift';
 import isEqual from 'react-fast-compare';
 import PropTypes from 'prop-types';
-import React__default, { useContext, useState, useLayoutEffect, useRef, useMemo, useEffect } from 'react';
+import React__default, { useContext, useRef, useState, useLayoutEffect, useMemo, useEffect } from 'react';
 import { defaultFilterItems } from '../ComboBox/tools/filter.js';
 import { sortingPropTypes } from './MultiSelectPropTypes.js';
 import ListBox from '../ListBox/index.js';
@@ -106,6 +106,7 @@ const FilterableMultiSelect = /*#__PURE__*/React__default.forwardRef(function Fi
   const {
     isFluid
   } = useContext(FormContext);
+  const isFirstRender = useRef(true);
   const [isFocused, setIsFocused] = useState(false);
   const [isOpen, setIsOpen] = useState(!!open);
   const [prevOpen, setPrevOpen] = useState(!!open);
@@ -240,8 +241,15 @@ const FilterableMultiSelect = /*#__PURE__*/React__default.forwardRef(function Fi
     }
   }
   useEffect(() => {
-    onMenuChange?.(isOpen);
-  }, [isOpen, onMenuChange]);
+    if (isFirstRender.current) {
+      isFirstRender.current = false;
+      if (open) {
+        onMenuChange?.(isOpen);
+      }
+    } else {
+      onMenuChange?.(isOpen);
+    }
+  }, [isOpen, onMenuChange, open]);
   const {
     getToggleButtonProps,
     getLabelProps,

package/es/components/Pagination/Pagination.js

@@ -13,10 +13,10 @@ import React__default, { useRef, useState } from 'react';
 import Select from '../Select/Select.js';
 import '../Select/Select.Skeleton.js';
 import SelectItem from '../SelectItem/SelectItem.js';
-import { equals } from '../../tools/array.js';
 import { useFallbackId } from '../../internal/useId.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { IconButton } from '../IconButton/index.js';
+import isEqual from 'react-fast-compare';
 
 var _CaretLeft, _CaretRight;
 function mapPageSizesToObject(sizes) {
@@ -117,7 +117,7 @@ const Pagination = /*#__PURE__*/React__default.forwardRef(function Pagination(_r
     setPageSize(getPageSize(pageSizes, controlledPageSize));
     setPrevControlledPageSize(controlledPageSize);
   }
-  if (!equals(controlledPageSizes, prevPageSizes)) {
+  if (!isEqual(controlledPageSizes, prevPageSizes)) {
     const pageSizes = mapPageSizesToObject(controlledPageSizes);
     const hasPageSize = pageSizes.find(size => {
       return size.value === pageSize;

package/lib/components/MultiSelect/FilterableMultiSelect.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2025
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.

package/lib/components/MultiSelect/FilterableMultiSelect.js

@@ -118,6 +118,7 @@ const FilterableMultiSelect = /*#__PURE__*/React__default["default"].forwardRef(
   const {
     isFluid
   } = React.useContext(FormContext.FormContext);
+  const isFirstRender = React.useRef(true);
   const [isFocused, setIsFocused] = React.useState(false);
   const [isOpen, setIsOpen] = React.useState(!!open);
   const [prevOpen, setPrevOpen] = React.useState(!!open);
@@ -252,8 +253,15 @@ const FilterableMultiSelect = /*#__PURE__*/React__default["default"].forwardRef(
     }
   }
   React.useEffect(() => {
-    onMenuChange?.(isOpen);
-  }, [isOpen, onMenuChange]);
+    if (isFirstRender.current) {
+      isFirstRender.current = false;
+      if (open) {
+        onMenuChange?.(isOpen);
+      }
+    } else {
+      onMenuChange?.(isOpen);
+    }
+  }, [isOpen, onMenuChange, open]);
   const {
     getToggleButtonProps,
     getLabelProps,

package/lib/components/Pagination/Pagination.js

@@ -17,16 +17,17 @@ var React = require('react');
 var Select = require('../Select/Select.js');
 require('../Select/Select.Skeleton.js');
 var SelectItem = require('../SelectItem/SelectItem.js');
-var array = require('../../tools/array.js');
 var useId = require('../../internal/useId.js');
 var usePrefix = require('../../internal/usePrefix.js');
 var index = require('../IconButton/index.js');
+var isEqual = require('react-fast-compare');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var isEqual__default = /*#__PURE__*/_interopDefaultLegacy(isEqual);
 
 var _CaretLeft, _CaretRight;
 function mapPageSizesToObject(sizes) {
@@ -127,7 +128,7 @@ const Pagination = /*#__PURE__*/React__default["default"].forwardRef(function Pa
     setPageSize(getPageSize(pageSizes, controlledPageSize));
     setPrevControlledPageSize(controlledPageSize);
   }
-  if (!array.equals(controlledPageSizes, prevPageSizes)) {
+  if (!isEqual__default["default"](controlledPageSizes, prevPageSizes)) {
     const pageSizes = mapPageSizesToObject(controlledPageSizes);
     const hasPageSize = pageSizes.find(size => {
       return size.value === pageSize;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/react",
   "description": "React components for the Carbon Design System",
-  "version": "1.77.0-rc.0",
+  "version": "1.77.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
@@ -52,9 +52,9 @@
   "dependencies": {
     "@babel/runtime": "^7.24.7",
     "@carbon/feature-flags": "^0.24.0",
-    "@carbon/icons-react": "^11.56.0-rc.0",
-    "@carbon/layout": "^11.30.0-rc.0",
-    "@carbon/styles": "^1.76.0-rc.0",
+    "@carbon/icons-react": "^11.56.0",
+    "@carbon/layout": "^11.30.0",
+    "@carbon/styles": "^1.76.0",
     "@floating-ui/react": "^0.27.4",
     "@ibm/telemetry-js": "^1.5.0",
     "classnames": "2.5.1",
@@ -79,7 +79,7 @@
     "@babel/preset-react": "^7.24.7",
     "@babel/preset-typescript": "^7.24.7",
     "@carbon/test-utils": "^10.35.0",
-    "@carbon/themes": "^11.47.0-rc.0",
+    "@carbon/themes": "^11.47.0",
     "@figma/code-connect": "^1.2.4",
     "@rollup/plugin-babel": "^6.0.0",
     "@rollup/plugin-commonjs": "^28.0.0",
@@ -131,7 +131,7 @@
     "storybook-addon-accessibility-checker": "^3.1.61-rc.3",
     "stream-browserify": "^3.0.0",
     "style-loader": "^4.0.0",
-    "typescript-config-carbon": "^0.5.0-rc.0",
+    "typescript-config-carbon": "^0.5.0",
     "webpack": "^5.65.0",
     "webpack-dev-server": "^5.0.0"
   },
@@ -146,5 +146,5 @@
     "**/*.scss",
     "**/*.css"
   ],
-  "gitHead": "faf649817d3be3e8e258aba866e14e9378b5c68e"
+  "gitHead": "2a32901cb1c74c149164122f0742305440716d35"
 }

package/es/tools/array.js

@@ -1,29 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 2023
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-/**
- * Shallow compare two arrays for equality
- * @param {Array} arr1 the first array
- * @param {Array} arr2 the second array
- * @returns {boolean} true if both arrays have the same contents, otherwise false
- */
-function equals(arr1, arr2) {
-  if (!Array.isArray(arr1) || !Array.isArray(arr2) || arr1.length !== arr2.length) {
-    return false;
-  }
-  if (arr1 === arr2) {
-    return true;
-  }
-  for (let i = 0; i < arr1.length; i++) {
-    if (arr1[i] !== arr2[i]) {
-      return false;
-    }
-  }
-  return true;
-}
-
-export { equals };

package/lib/tools/array.js

@@ -1,33 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 2023
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-/**
- * Shallow compare two arrays for equality
- * @param {Array} arr1 the first array
- * @param {Array} arr2 the second array
- * @returns {boolean} true if both arrays have the same contents, otherwise false
- */
-function equals(arr1, arr2) {
-  if (!Array.isArray(arr1) || !Array.isArray(arr2) || arr1.length !== arr2.length) {
-    return false;
-  }
-  if (arr1 === arr2) {
-    return true;
-  }
-  for (let i = 0; i < arr1.length; i++) {
-    if (arr1[i] !== arr2[i]) {
-      return false;
-    }
-  }
-  return true;
-}
-
-exports.equals = equals;