@carbon/react 1.63.0-rc.0 → 1.63.0

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

@@ -9,11 +9,11 @@ import React, { ReactNode } from 'react';
 import { ListBoxSize, ListBoxType } from '../ListBox';
 import { MultiSelectSortingProps } from './MultiSelectPropTypes';
 import { ListBoxProps } from '../ListBox/ListBox';
-import type { InternationalProps } from '../../types/common';
+import type { TranslateWithId } from '../../types/common';
 interface OnChangeData<ItemType> {
     selectedItems: ItemType[] | null;
 }
-export interface MultiSelectProps<ItemType> extends MultiSelectSortingProps<ItemType>, InternationalProps<'close.menu' | 'open.menu' | 'clear.all' | 'clear.selection'> {
+export interface MultiSelectProps<ItemType> extends MultiSelectSortingProps<ItemType>, TranslateWithId<'close.menu' | 'open.menu' | 'clear.all' | 'clear.selection'> {
     /**
      * **Experimental**: Will attempt to automatically align the floating
      * element to avoid collisions with the viewport and being clipped by

package/lib/components/MultiSelect/MultiSelect.js

@@ -13,7 +13,7 @@ var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelper
 var iconsReact = require('@carbon/icons-react');
 var cx = require('classnames');
 var Downshift = require('downshift');
-var isEqual = require('lodash.isequal');
+var isEqual = require('react-fast-compare');
 var PropTypes = require('prop-types');
 var React = require('react');
 var index = require('../ListBox/index.js');

package/lib/components/NumberInput/NumberInput.d.ts

@@ -5,12 +5,17 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { ReactNode } from 'react';
+import { TranslateWithId } from '../../types/common';
 export declare const translationIds: {
-    'increment.number': string;
-    'decrement.number': string;
+    readonly 'increment.number': "increment.number";
+    readonly 'decrement.number': "decrement.number";
 };
+/**
+ * Message ids that will be passed to translateWithId().
+ */
+type TranslationKey = keyof typeof translationIds;
 type ExcludedAttributes = 'defaultValue' | 'id' | 'min' | 'max' | 'onChange' | 'onClick' | 'size' | 'step' | 'value';
-export interface NumberInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, ExcludedAttributes> {
+export interface NumberInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, ExcludedAttributes>, TranslateWithId<TranslationKey> {
     /**
      * `true` to allow empty string.
      */
@@ -115,10 +120,6 @@ export interface NumberInputProps extends Omit<React.InputHTMLAttributes<HTMLInp
      * Specify how much the values should increase/decrease upon clicking on up/down button
      */
     step?: number;
-    /**
-     * Provide custom text for the component for each translation id
-     */
-    translateWithId?: (id: string) => string;
     /**
      * Specify the value of the input
      */

package/lib/components/NumberInput/NumberInput.js

@@ -34,6 +34,11 @@ const translationIds = {
   'increment.number': 'increment.number',
   'decrement.number': 'decrement.number'
 };
+
+/**
+ * Message ids that will be passed to translateWithId().
+ */
+
 const defaultTranslations = {
   [translationIds['increment.number']]: 'Increment number',
   [translationIds['decrement.number']]: 'Decrement number'

package/lib/components/PaginationNav/PaginationNav.d.ts

@@ -5,7 +5,19 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React from 'react';
-interface PaginationNavProps extends Omit<React.HTMLAttributes<HTMLElement>, 'onChange'> {
+import { TranslateWithId } from '../../types/common';
+declare const translationIds: {
+    readonly 'carbon.pagination-nav.next': "Next";
+    readonly 'carbon.pagination-nav.previous': "Previous";
+    readonly 'carbon.pagination-nav.item': "Page";
+    readonly 'carbon.pagination-nav.active': "Active";
+    readonly 'carbon.pagination-nav.of': "of";
+};
+/**
+ * Message ids that will be passed to translateWithId().
+ */
+type TranslationKey = keyof typeof translationIds;
+interface PaginationNavProps extends Omit<React.HTMLAttributes<HTMLElement>, 'onChange'>, TranslateWithId<TranslationKey> {
     /**
      * Additional CSS class names.
      */
@@ -35,11 +47,6 @@ interface PaginationNavProps extends Omit<React.HTMLAttributes<HTMLElement>, 'on
      * The total number of items.
      */
     totalItems?: number;
-    /**
-     * Specify a custom translation function that takes in a message identifier
-     * and returns the localized string for the message
-     */
-    translateWithId?: (id: string) => string;
 }
 declare const PaginationNav: React.ForwardRefExoticComponent<PaginationNavProps & React.RefAttributes<HTMLElement>>;
 export default PaginationNav;

package/lib/components/PaginationNav/PaginationNav.js

@@ -31,6 +31,11 @@ const translationIds = {
   'carbon.pagination-nav.active': 'Active',
   'carbon.pagination-nav.of': 'of'
 };
+
+/**
+ * Message ids that will be passed to translateWithId().
+ */
+
 function translateWithId(messageId) {
   return translationIds[messageId];
 }

package/lib/components/ProgressIndicator/ProgressIndicator.d.ts

@@ -6,6 +6,17 @@
  */
 import PropTypes from 'prop-types';
 import React from 'react';
+import { TranslateWithId } from '../../types/common';
+declare const defaultTranslations: {
+    readonly 'carbon.progress-step.complete': "Complete";
+    readonly 'carbon.progress-step.incomplete': "Incomplete";
+    readonly 'carbon.progress-step.current': "Current";
+    readonly 'carbon.progress-step.invalid': "Invalid";
+};
+/**
+ * Message ids that will be passed to translateWithId().
+ */
+type TranslationKey = keyof typeof defaultTranslations;
 export interface ProgressIndicatorProps extends Omit<React.HTMLAttributes<HTMLUListElement>, 'onChange'> {
     /**
      * Provide `<ProgressStep>` components to be rendered in the
@@ -63,7 +74,7 @@ declare namespace ProgressIndicator {
         vertical: PropTypes.Requireable<boolean>;
     };
 }
-export interface ProgressStepProps {
+export interface ProgressStepProps extends TranslateWithId<TranslationKey> {
     /**
      * Provide an optional className to be applied to the containing `<li>` node
      */
@@ -112,11 +123,6 @@ export interface ProgressStepProps {
      * The ID of the tooltip content.
      */
     tooltipId?: string;
-    /**
-     * Optional method that takes in a message id and returns an
-     * internationalized string.
-     */
-    translateWithId?: (id: string) => string;
 }
 declare function ProgressStep({ label, description, className, current, complete, invalid, secondaryLabel, disabled, onClick, translateWithId: t, ...rest }: ProgressStepProps): import("react/jsx-runtime").JSX.Element;
 declare namespace ProgressStep {

package/lib/components/ProgressIndicator/ProgressIndicator.js

@@ -32,6 +32,11 @@ const defaultTranslations = {
   'carbon.progress-step.current': 'Current',
   'carbon.progress-step.invalid': 'Invalid'
 };
+
+/**
+ * Message ids that will be passed to translateWithId().
+ */
+
 function translateWithId(messageId) {
   return defaultTranslations[messageId];
 }

package/lib/components/Slider/Slider.d.ts

@@ -6,6 +6,14 @@
  */
 import React, { type KeyboardEventHandler, PureComponent, ReactNode } from 'react';
 import PropTypes from 'prop-types';
+import { TranslateWithId } from '../../types/common';
+declare const translationIds: {
+    readonly autoCorrectAnnouncement: "carbon.slider.auto-correct-announcement";
+};
+/**
+ * Message ids that will be passed to translateWithId().
+ */
+type TranslationKey = (typeof translationIds)[keyof typeof translationIds];
 /**
  * Distinguish two handles by lower and upper positions.
  */
@@ -14,7 +22,9 @@ declare enum HandlePosition {
     UPPER = "upper"
 }
 type ExcludedAttributes = 'onChange' | 'onBlur';
-export interface SliderProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, ExcludedAttributes> {
+export interface SliderProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, ExcludedAttributes>, TranslateWithId<TranslationKey, {
+    correctedValue?: string;
+}> {
     /**
      * The `ariaLabel` for the `<input>`.
      */
@@ -136,14 +146,6 @@ export interface SliderProps extends Omit<React.InputHTMLAttributes<HTMLInputEle
      * which will be `(max - min) / stepMultiplier`.
      */
     stepMultiplier?: number;
-    /**
-     * Supply a method to translate internal strings with your i18n tool of
-     * choice. Translation keys are available on the `translationIds` field for
-     * this component.
-     */
-    translateWithId?: (translationId: string, translationState: {
-        correctedValue?: string;
-    }) => string;
     /**
      * The value of the slider. When there are two handles, value is the lower
      * bound.

package/lib/components/Slider/Slider.js

@@ -83,8 +83,13 @@ ThumbWrapper.propTypes = {
 const translationIds = {
   autoCorrectAnnouncement: 'carbon.slider.auto-correct-announcement'
 };
+
+/**
+ * Message ids that will be passed to translateWithId().
+ */
+
 function translateWithId(translationId, translationState) {
-  if (translationId === translationIds.autoCorrectAnnouncement && translationState?.correctedValue) {
+  if (translationState?.correctedValue) {
     const {
       correctedValue
     } = translationState;

package/lib/internal/Selection.js

@@ -12,7 +12,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _rollupPluginBabelHelpers = require('../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var PropTypes = require('prop-types');
-var isEqual = require('lodash.isequal');
+var isEqual = require('react-fast-compare');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/lib/types/common.d.ts

@@ -9,10 +9,15 @@ export type ForwardRefReturn<T, P = unknown> = React.ForwardRefExoticComponent<F
 export type PolymorphicProps<Element extends React.ElementType, Props> = Props & Omit<React.ComponentProps<Element>, 'as'> & {
     as?: Element;
 };
-export interface InternationalProps<MID = string, ARGS = Record<string, unknown>> {
+export interface TranslateWithId<MID = string, ARGS = Record<string, unknown>> {
     /**
      * Supply a method to translate internal strings with your i18n tool of
      * choice.
      */
     translateWithId?(messageId: MID, args?: ARGS): string;
 }
+/**
+ * Alias of TranslateWithId. Will be removed in v12
+ * @deprecated Use TranslateWithId instead
+ */
+export type InternationalProps<MID = string, ARGS = Record<string, unknown>> = TranslateWithId<MID, ARGS>;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/react",
   "description": "React components for the Carbon Design System",
-  "version": "1.63.0-rc.0",
+  "version": "1.63.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -48,10 +48,10 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.24.7",
-    "@carbon/feature-flags": "^0.21.0-rc.0",
-    "@carbon/icons-react": "^11.46.0-rc.0",
-    "@carbon/layout": "^11.24.0-rc.0",
-    "@carbon/styles": "^1.62.0-rc.0",
+    "@carbon/feature-flags": "^0.21.0",
+    "@carbon/icons-react": "^11.46.0",
+    "@carbon/layout": "^11.24.0",
+    "@carbon/styles": "^1.62.0",
     "@floating-ui/react": "^0.26.0",
     "@ibm/telemetry-js": "^1.5.0",
     "classnames": "2.5.1",
@@ -61,7 +61,6 @@
     "invariant": "^2.2.3",
     "lodash.debounce": "^4.0.8",
     "lodash.findlast": "^4.5.0",
-    "lodash.isequal": "^4.5.0",
     "lodash.omit": "^4.5.0",
     "lodash.throttle": "^4.1.1",
     "prop-types": "^15.7.2",
@@ -81,7 +80,7 @@
     "@babel/preset-react": "^7.24.7",
     "@babel/preset-typescript": "^7.24.7",
     "@carbon/test-utils": "^10.30.0",
-    "@carbon/themes": "^11.38.0-rc.0",
+    "@carbon/themes": "^11.38.0",
     "@figma/code-connect": "^1.0.2",
     "@rollup/plugin-babel": "^6.0.0",
     "@rollup/plugin-commonjs": "^26.0.0",
@@ -100,7 +99,7 @@
     "autoprefixer": "^10.4.0",
     "babel-loader": "^9.0.0",
     "babel-plugin-dev-expression": "^0.2.3",
-    "babel-preset-carbon": "^0.6.0-rc.0",
+    "babel-preset-carbon": "^0.6.0",
     "browserify-zlib": "^0.2.0",
     "browserslist-config-carbon": "^11.2.0",
     "clipboardy": "^2.1.0",
@@ -142,5 +141,5 @@
     "**/*.scss",
     "**/*.css"
   ],
-  "gitHead": "326ac312c2b669937ede1c0c68c0e3a6d9c34135"
+  "gitHead": "70a0775c76273e311cb1bb16db02d3f11ad8d018"
 }