@carbon/react 1.57.0-rc.0 → 1.57.0

package/lib/components/MultiSelect/MultiSelect.js

@@ -626,6 +626,5 @@ MultiSelect.propTypes = {
    */
   warnText: PropTypes__default["default"].node
 };
-var MultiSelect$1 = MultiSelect;
 
-exports["default"] = MultiSelect$1;
+exports["default"] = MultiSelect;

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

@@ -0,0 +1,62 @@
+/**
+ * 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.
+ */
+import PropTypes from 'prop-types';
+export declare const sortingPropTypes: {
+    /**
+     * Provide a compare function that is used to determine the ordering of
+     * options. `compareItems` has the following function signature:
+     *
+     * compareFunction :
+     *  (itemA: string, itemB: string, { locale: string }) => number
+     */
+    compareItems: PropTypes.Requireable<(...args: any[]) => any>;
+    /**
+     * Provide a method that sorts all options in the control. Overriding this
+     * prop means that you also have to handle the sort logic for selected versus
+     * un-selected items. If you just want to control ordering, consider the
+     * `compareItems` prop instead.
+     *
+     * `sortItems` has the following signature:
+     *
+     * sortItems :
+     *   (items: Array<Item>, {
+     *     selectedItems: Array<Item>,
+     *     itemToString: Item => string,
+     *     compareItems: (itemA: string, itemB: string, {
+     *       locale: string
+     *     }) => number,
+     *     locale: string,
+     *   }) => Array<Item>
+     */
+    sortItems: PropTypes.Requireable<(...args: any[]) => any>;
+};
+export interface ItemBase {
+    disabled?: boolean;
+}
+export interface SortingPropTypes<Item extends ItemBase> {
+    /**
+     * Provide a compare function that is used
+     * to determine the ordering of options.
+     */
+    compareItems(itemA: string, itemB: string, ctx: {
+        locale: string;
+    }): number;
+    /**
+     * Provide a method that sorts all options in the control. Overriding this
+     * prop means that you also have to handle the sort logic for selected versus
+     * un-selected items. If you just want to control ordering, consider the
+     * `compareItems` prop instead.
+     */
+    sortItems(items: Item[], state: {
+        selectedItems: Item[];
+        itemToString(item: Item): string;
+        compareItems(itemA: string, itemB: string, ctx: {
+            locale: string;
+        }): number;
+        locale: string;
+    }): Item[];
+}

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

@@ -0,0 +1,10 @@
+/**
+ * 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.
+ */
+import MultiSelect from './MultiSelect';
+import { default as FilterableMultiSelect } from './FilterableMultiSelect';
+export { FilterableMultiSelect, MultiSelect };
+export default MultiSelect;

package/lib/components/MultiSelect/index.js

@@ -14,6 +14,8 @@ var MultiSelect = require('./MultiSelect.js');
 var FilterableMultiSelect = require('./FilterableMultiSelect.js');
 
 FilterableMultiSelect["default"].displayName = 'MultiSelect.Filterable';
+// @ts-expect-error: The attribute indeed does not exist on the object,
+// but since it is already deprecated, we do not have to fix it.
 MultiSelect["default"].Filterable = FilterableMultiSelect["default"];
 if (process.env.NODE_ENV !== "production") {
   deprecateFieldOnObject.deprecateFieldOnObject(MultiSelect["default"], 'Filterable', FilterableMultiSelect["default"]);

package/lib/components/Pagination/Pagination.js

@@ -78,10 +78,10 @@ const Pagination = /*#__PURE__*/React__default["default"].forwardRef(function Pa
     pageSize: controlledPageSize,
     pageSizeInputDisabled,
     pageSizes: controlledPageSizes,
-    pageText = (page, pagesUnknown) => `page ${pagesUnknown ? '' : page}`,
+    pageText = page => `page ${page}`,
     pagesUnknown = false,
     size = 'md',
-    totalItems = 1,
+    totalItems,
     ...rest
   } = _ref;
   const prefix = usePrefix.usePrefix();
@@ -103,7 +103,7 @@ const Pagination = /*#__PURE__*/React__default["default"].forwardRef(function Pa
     [`${prefix}--pagination--${size}`]: size,
     [customClassName]: !!customClassName
   });
-  const totalPages = Math.max(Math.ceil(totalItems / pageSize), 1);
+  const totalPages = totalItems ? Math.max(Math.ceil(totalItems / pageSize), 1) : NaN;
   const backButtonDisabled = disabled || page === 1;
   const backButtonClasses = cx__default["default"]({
     [`${prefix}--pagination__button`]: true,
@@ -155,7 +155,7 @@ const Pagination = /*#__PURE__*/React__default["default"].forwardRef(function Pa
   }
   function handlePageInputChange(event) {
     const page = Number(event.target.value);
-    if (page > 0 && page <= Math.max(Math.ceil(totalItems / pageSize), 1)) {
+    if (page > 0 && totalItems && page <= Math.max(Math.ceil(totalItems / pageSize), 1)) {
       setPage(page);
       if (onChange) {
         onChange({
@@ -228,11 +228,11 @@ const Pagination = /*#__PURE__*/React__default["default"].forwardRef(function Pa
     text: String(sizeObj.text)
   }))), /*#__PURE__*/React__default["default"].createElement("span", {
     className: `${prefix}--pagination__text ${prefix}--pagination__items-count`
-  }, pagesUnknown ? itemText(pageSize * (page - 1) + 1, page * pageSize) : itemRangeText(Math.min(pageSize * (page - 1) + 1, totalItems), Math.min(page * pageSize, totalItems), totalItems))), /*#__PURE__*/React__default["default"].createElement("div", {
+  }, pagesUnknown || !totalItems ? itemText(pageSize * (page - 1) + 1, page * pageSize) : itemRangeText(Math.min(pageSize * (page - 1) + 1, totalItems), Math.min(page * pageSize, totalItems), totalItems))), /*#__PURE__*/React__default["default"].createElement("div", {
     className: `${prefix}--pagination__right`
   }, pagesUnknown ? /*#__PURE__*/React__default["default"].createElement("span", {
-    className: `${prefix}--pagination__text ${prefix}--pagination__page-text`
-  }, pagesUnknown ? pageText(page, pagesUnknown) : pageRangeText(page, totalPages)) : null, /*#__PURE__*/React__default["default"].createElement(Select["default"], {
+    className: `${prefix}--pagination__text ${prefix}--pagination__page-text ${prefix}--pagination__unknown-pages-text`
+  }, pageText(page)) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Select["default"], {
     id: `${prefix}-pagination-select-${inputId}-right`,
     className: `${prefix}--select__page-number`,
     labelText: `Page number, of ${totalPages} pages`,
@@ -241,9 +241,9 @@ const Pagination = /*#__PURE__*/React__default["default"].forwardRef(function Pa
     onChange: handlePageInputChange,
     value: page,
     disabled: pageInputDisabled || disabled
-  }, selectItems), pagesUnknown ? null : /*#__PURE__*/React__default["default"].createElement("span", {
+  }, selectItems), /*#__PURE__*/React__default["default"].createElement("span", {
     className: `${prefix}--pagination__text`
-  }, pagesUnknown ? pageText(page, pagesUnknown) : pageRangeText(page, totalPages)), /*#__PURE__*/React__default["default"].createElement("div", {
+  }, pageRangeText(page, totalPages))), /*#__PURE__*/React__default["default"].createElement("div", {
     className: `${prefix}--pagination__control-buttons`
   }, /*#__PURE__*/React__default["default"].createElement(index.IconButton, {
     align: "top",

package/lib/components/RadioButton/RadioButton.d.ts

@@ -63,6 +63,10 @@ export interface RadioButtonProps extends Omit<React.InputHTMLAttributes<HTMLInp
      * Specify the value of the `<RadioButton>`
      */
     value?: string | number;
+    /**
+     * `true` to specify if the input is required.
+     */
+    required?: boolean;
 }
 declare const RadioButton: React.ForwardRefExoticComponent<RadioButtonProps & React.RefAttributes<unknown>>;
 export default RadioButton;

package/lib/components/RadioButton/RadioButton.js

@@ -37,6 +37,7 @@ const RadioButton = /*#__PURE__*/React__default["default"].forwardRef((props, re
     onChange = () => {},
     value = '',
     slug,
+    required,
     ...rest
   } = props;
   const prefix = usePrefix.usePrefix();
@@ -70,7 +71,8 @@ const RadioButton = /*#__PURE__*/React__default["default"].forwardRef((props, re
     ref: mergeRefs["default"](inputRef, ref),
     disabled: disabled,
     value: value,
-    name: name
+    name: name,
+    required: required
   })), /*#__PURE__*/React__default["default"].createElement("label", {
     htmlFor: uniqueId,
     className: `${prefix}--radio-button__label`
@@ -129,6 +131,10 @@ RadioButton.propTypes = {
    * Provide a handler that is invoked when a user clicks on the control
    */
   onClick: PropTypes__default["default"].func,
+  /**
+   * `true` to specify if the control is required.
+   */
+  required: PropTypes__default["default"].bool,
   /**
    * **Experimental**: Provide a `Slug` component to be rendered inside the `RadioButton` component
    */

package/lib/components/RadioButtonGroup/RadioButtonGroup.d.ts

@@ -79,6 +79,10 @@ export interface RadioButtonGroupProps extends Omit<React.InputHTMLAttributes<HT
      * Specify the value that is currently selected in the group
      */
     valueSelected?: string | number;
+    /**
+     * `true` to specify if input selection in group is required.
+     */
+    required?: boolean;
 }
 declare const RadioButtonGroup: React.ForwardRefExoticComponent<RadioButtonGroupProps & React.RefAttributes<unknown>>;
 export default RadioButtonGroup;

package/lib/components/RadioButtonGroup/RadioButtonGroup.js

@@ -45,6 +45,7 @@ const RadioButtonGroup = /*#__PURE__*/React__default["default"].forwardRef((prop
     warn = false,
     warnText,
     slug,
+    required,
     ...rest
   } = props;
   const prefix = usePrefix.usePrefix();
@@ -72,7 +73,8 @@ const RadioButtonGroup = /*#__PURE__*/React__default["default"].forwardRef((prop
         key: value,
         value: value,
         onChange: handleOnChange,
-        checked: value === selected
+        checked: value === selected,
+        required: required
       };
       if (!selected && radioButton?.props.checked) {
         newProps.checked = true;
@@ -197,6 +199,10 @@ RadioButtonGroup.propTypes = {
    * Whether the RadioButtonGroup should be read-only
    */
   readOnly: PropTypes__default["default"].bool,
+  /**
+   * `true` to specify if radio selection in group is required.
+   */
+  required: PropTypes__default["default"].bool,
   /**
    * **Experimental**: Provide a `Slug` component to be rendered inside the `RadioButtonGroup` component
    */

package/lib/components/TimePicker/TimePicker.js

@@ -123,7 +123,7 @@ const TimePicker = /*#__PURE__*/React__default["default"].forwardRef(function Ti
       if (item) {
         return /*#__PURE__*/React__default["default"].cloneElement(item, {
           ...item.props,
-          disabled: disabled,
+          disabled: item.props.disabled ?? disabled,
           readOnly: readOnly,
           ...readOnlyEventHandlers
         });

package/lib/index.js

@@ -30,6 +30,7 @@ var index$5 = require('./components/ComboButton/index.js');
 var ComposedModal = require('./components/ComposedModal/ComposedModal.js');
 var ModalHeader = require('./components/ComposedModal/ModalHeader.js');
 var ModalFooter = require('./components/ComposedModal/ModalFooter.js');
+require('./components/ContainedList/index.js');
 var index$6 = require('./components/ContentSwitcher/index.js');
 var Copy = require('./components/Copy/Copy.js');
 var CopyButton = require('./components/CopyButton/CopyButton.js');
@@ -73,6 +74,7 @@ var MenuItem = require('./components/Menu/MenuItem.js');
 var index$8 = require('./components/MenuButton/index.js');
 var Modal = require('./components/Modal/Modal.js');
 var ModalWrapper = require('./components/ModalWrapper/ModalWrapper.js');
+require('./components/MultiSelect/index.js');
 var Notification = require('./components/Notification/Notification.js');
 var NumberInput_Skeleton = require('./components/NumberInput/NumberInput.Skeleton.js');
 var NumberInput = require('./components/NumberInput/NumberInput.js');
@@ -183,6 +185,7 @@ var PageSelector = require('./components/Pagination/experimental/PageSelector.js
 var Pagination = require('./components/Pagination/experimental/Pagination.js');
 var CheckboxGroup = require('./components/CheckboxGroup/CheckboxGroup.js');
 var ContainedListItem = require('./components/ContainedList/ContainedListItem/ContainedListItem.js');
+var ContainedList = require('./components/ContainedList/ContainedList.js');
 var useContextMenu = require('./components/ContextMenu/useContextMenu.js');
 var Slider_Skeleton = require('./components/Slider/Slider.Skeleton.js');
 var TextInput_Skeleton = require('./components/TextInput/TextInput.Skeleton.js');
@@ -207,7 +210,6 @@ var ChatButton = require('./components/ChatButton/ChatButton.js');
 var ChatButton_Skeleton = require('./components/ChatButton/ChatButton.Skeleton.js');
 var Text = require('./components/Text/Text.js');
 var TextDirection = require('./components/Text/TextDirection.js');
-var ContainedList = require('./components/ContainedList/ContainedList.js');
 var DataTable = require('./components/DataTable/DataTable.js');
 var Table = require('./components/DataTable/Table.js');
 var TableActionList = require('./components/DataTable/TableActionList.js');
@@ -454,6 +456,7 @@ exports.unstable_PageSelector = PageSelector["default"];
 exports.unstable_Pagination = Pagination["default"];
 exports.CheckboxGroup = CheckboxGroup["default"];
 exports.ContainedListItem = ContainedListItem["default"];
+exports.ContainedList = ContainedList["default"];
 exports.useContextMenu = useContextMenu["default"];
 exports.SliderSkeleton = Slider_Skeleton["default"];
 exports.TextInputSkeleton = TextInput_Skeleton["default"];
@@ -478,7 +481,6 @@ exports.unstable__ChatButton = ChatButton["default"];
 exports.unstable__ChatButtonSkeleton = ChatButton_Skeleton["default"];
 exports.unstable_Text = Text.Text;
 exports.unstable_TextDirection = TextDirection.TextDirection;
-exports.ContainedList = ContainedList["default"];
 exports.DataTable = DataTable["default"];
 exports.Table = Table.Table;
 exports.TableActionList = TableActionList["default"];

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/react",
   "description": "React components for the Carbon Design System",
-  "version": "1.57.0-rc.0",
+  "version": "1.57.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -48,10 +48,10 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.18.3",
-    "@carbon/feature-flags": "^0.20.0-rc.0",
-    "@carbon/icons-react": "^11.41.0-rc.0",
-    "@carbon/layout": "^11.22.0-rc.0",
-    "@carbon/styles": "^1.57.0-rc.0",
+    "@carbon/feature-flags": "^0.20.0",
+    "@carbon/icons-react": "^11.41.0",
+    "@carbon/layout": "^11.22.0",
+    "@carbon/styles": "^1.57.0",
     "@floating-ui/react": "^0.26.0",
     "@ibm/telemetry-js": "^1.5.0",
     "classnames": "2.5.1",
@@ -81,7 +81,7 @@
     "@babel/preset-react": "^7.22.3",
     "@babel/preset-typescript": "^7.21.5",
     "@carbon/test-utils": "^10.30.0",
-    "@carbon/themes": "^11.35.0-rc.0",
+    "@carbon/themes": "^11.35.0",
     "@rollup/plugin-babel": "^6.0.0",
     "@rollup/plugin-commonjs": "^25.0.0",
     "@rollup/plugin-node-resolve": "^15.0.0",
@@ -141,5 +141,5 @@
     "**/*.scss",
     "**/*.css"
   ],
-  "gitHead": "401633ab2d5fdeaeb89f66bb9040cc1de008599d"
+  "gitHead": "e4922a44b2110b9dcb71da21ff6c0c9bb95610e0"
 }