@carbon/react 1.31.2 → 1.32.0-rc.0

package/lib/index.js

@@ -10,12 +10,22 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 require('./feature-flags.js');
+var Accordion = require('./components/Accordion/Accordion.js');
+var AccordionItem = require('./components/Accordion/AccordionItem.js');
+var Accordion_Skeleton = require('./components/Accordion/Accordion.Skeleton.js');
 var AspectRatio = require('./components/AspectRatio/AspectRatio.js');
+var Button = require('./components/Button/Button.js');
+var Button_Skeleton = require('./components/Button/Button.Skeleton.js');
+var ButtonSet = require('./components/ButtonSet/ButtonSet.js');
 var Checkbox = require('./components/Checkbox/Checkbox.js');
 var Checkbox_Skeleton = require('./components/Checkbox/Checkbox.Skeleton.js');
 var index$3 = require('./components/ClassPrefix/index.js');
 var index$4 = 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');
 var index$5 = require('./components/ContentSwitcher/index.js');
+var DangerButton = require('./components/DangerButton/DangerButton.js');
 require('./components/DataTable/index.js');
 var DataTableSkeleton = require('./components/DataTableSkeleton/DataTableSkeleton.js');
 var DatePicker = require('./components/DatePicker/DatePicker.js');
@@ -35,17 +45,23 @@ var index$6 = require('./components/IdPrefix/index.js');
 var Link = require('./components/Link/Link.js');
 var ListItem = require('./components/ListItem/ListItem.js');
 var index$7 = require('./components/MenuButton/index.js');
+var Notification = require('./components/Notification/Notification.js');
 var OrderedList = require('./components/OrderedList/OrderedList.js');
 var index$8 = require('./components/OverflowMenu/index.js');
 var Pagination_Skeleton = require('./components/Pagination/Pagination.Skeleton.js');
 var RadioButton_Skeleton = require('./components/RadioButton/RadioButton.Skeleton.js');
 var Search = require('./components/Search/Search.js');
 var Search_Skeleton = require('./components/Search/Search.Skeleton.js');
+var SkeletonText = require('./components/SkeletonText/SkeletonText.js');
 var index$9 = require('./components/Slider/index.js');
+var Tabs = require('./components/Tabs/Tabs.js');
+var TabContent = require('./components/TabContent/TabContent.js');
+var Tabs_Skeleton = require('./components/Tabs/Tabs.Skeleton.js');
 var Tag_Skeleton = require('./components/Tag/Tag.Skeleton.js');
 var TextArea = require('./components/TextArea/TextArea.js');
 var TextArea_Skeleton = require('./components/TextArea/TextArea.Skeleton.js');
 require('./components/TextInput/index.js');
+var Tile = require('./components/Tile/Tile.js');
 var index$a = require('./components/TileGroup/index.js');
 var Toggle_Skeleton = require('./components/Toggle/Toggle.Skeleton.js');
 var ToggleSmall_Skeleton = require('./components/ToggleSmall/ToggleSmall.Skeleton.js');
@@ -72,9 +88,6 @@ var FluidTextInput = require('./components/FluidTextInput/FluidTextInput.js');
 var FluidTextInput_Skeleton = require('./components/FluidTextInput/FluidTextInput.Skeleton.js');
 var PageSelector = require('./components/Pagination/experimental/PageSelector.js');
 var Pagination = require('./components/Pagination/experimental/Pagination.js');
-var AccordionItem = require('./components/Accordion/AccordionItem.js');
-var Accordion_Skeleton = require('./components/Accordion/Accordion.Skeleton.js');
-var Accordion = require('./components/Accordion/Accordion.js');
 var Breadcrumb_Skeleton = require('./components/Breadcrumb/Breadcrumb.Skeleton.js');
 var CheckboxGroup = require('./components/CheckboxGroup/CheckboxGroup.js');
 var CodeSnippet_Skeleton = require('./components/CodeSnippet/CodeSnippet.Skeleton.js');
@@ -99,7 +112,6 @@ var Loading = require('./components/Loading/Loading.js');
 var ModalWrapper = require('./components/ModalWrapper/ModalWrapper.js');
 var NumberInput_Skeleton = require('./components/NumberInput/NumberInput.Skeleton.js');
 var ProgressIndicator_Skeleton = require('./components/ProgressIndicator/ProgressIndicator.Skeleton.js');
-var Tabs_Skeleton = require('./components/Tabs/Tabs.Skeleton.js');
 var TextInput_Skeleton = require('./components/TextInput/TextInput.Skeleton.js');
 var TextInput = require('./components/TextInput/TextInput.js');
 var Toggle = require('./components/Toggle/Toggle.js');
@@ -136,14 +148,7 @@ var Text = require('./components/Text/Text.js');
 var TextDirection = require('./components/Text/TextDirection.js');
 var Breadcrumb = require('./components/Breadcrumb/Breadcrumb.js');
 var BreadcrumbItem = require('./components/Breadcrumb/BreadcrumbItem.js');
-var Button_Skeleton = require('./components/Button/Button.Skeleton.js');
-var Button = require('./components/Button/Button.js');
-var ButtonSet = require('./components/ButtonSet/ButtonSet.js');
 var ComboBox = require('./components/ComboBox/ComboBox.js');
-var ComposedModal = require('./components/ComposedModal/ComposedModal.js');
-var ModalFooter = require('./components/ComposedModal/ModalFooter.js');
-var ModalHeader = require('./components/ComposedModal/ModalHeader.js');
-var DangerButton = require('./components/DangerButton/DangerButton.js');
 var DataTable = require('./components/DataTable/DataTable.js');
 var Table = require('./components/DataTable/Table.js');
 var TableActionList = require('./components/DataTable/TableActionList.js');
@@ -173,7 +178,6 @@ var Menu = require('./components/Menu/Menu.js');
 var MenuItem = require('./components/Menu/MenuItem.js');
 var Modal = require('./components/Modal/Modal.js');
 var MultiSelect = require('./components/MultiSelect/MultiSelect.js');
-var Notification = require('./components/Notification/Notification.js');
 var NumberInput = require('./components/NumberInput/NumberInput.js');
 var OverflowMenuItem = require('./components/OverflowMenuItem/OverflowMenuItem.js');
 var Pagination$1 = require('./components/Pagination/Pagination.js');
@@ -192,16 +196,12 @@ var SelectItem = require('./components/SelectItem/SelectItem.js');
 var SelectItemGroup = require('./components/SelectItemGroup/SelectItemGroup.js');
 var SkeletonIcon = require('./components/SkeletonIcon/SkeletonIcon.js');
 var SkeletonPlaceholder = require('./components/SkeletonPlaceholder/SkeletonPlaceholder.js');
-var SkeletonText = require('./components/SkeletonText/SkeletonText.js');
 var Slider_Skeleton = require('./components/Slider/Slider.Skeleton.js');
 var StructuredList_Skeleton = require('./components/StructuredList/StructuredList.Skeleton.js');
 var StructuredList = require('./components/StructuredList/StructuredList.js');
 var Switch = require('./components/Switch/Switch.js');
 var IconSwitch = require('./components/Switch/IconSwitch.js');
-var Tabs = require('./components/Tabs/Tabs.js');
-var TabContent = require('./components/TabContent/TabContent.js');
 var Tag = require('./components/Tag/Tag.js');
-var Tile = require('./components/Tile/Tile.js');
 var TimePicker = require('./components/TimePicker/TimePicker.js');
 var TimePickerSelect = require('./components/TimePickerSelect/TimePickerSelect.js');
 var Content = require('./components/UIShell/Content.js');
@@ -226,12 +226,27 @@ var Stack = require('./components/Stack/Stack.js');
 
 
 
+exports.Accordion = Accordion["default"];
+exports.AccordionItem = AccordionItem["default"];
+exports.AccordionSkeleton = Accordion_Skeleton["default"];
 exports.AspectRatio = AspectRatio["default"];
+exports.Button = Button["default"];
+exports.ButtonKinds = Button.ButtonKinds;
+exports.ButtonSizes = Button.ButtonSizes;
+exports.ButtonTooltipAlignments = Button.ButtonTooltipAlignments;
+exports.ButtonTooltipPositions = Button.ButtonTooltipPositions;
+exports.ButtonSkeleton = Button_Skeleton["default"];
+exports.ButtonSet = ButtonSet["default"];
 exports.Checkbox = Checkbox["default"];
 exports.CheckboxSkeleton = Checkbox_Skeleton["default"];
 exports.ClassPrefix = index$3.ClassPrefix;
 exports.ComboButton = index$4.ComboButton;
+exports.ComposedModal = ComposedModal["default"];
+exports.ModalBody = ComposedModal.ModalBody;
+exports.ModalHeader = ModalHeader.ModalHeader;
+exports.ModalFooter = ModalFooter.ModalFooter;
 exports.ContentSwitcher = index$5["default"];
+exports.DangerButton = DangerButton["default"];
 exports.DataTableSkeleton = DataTableSkeleton["default"];
 exports.DatePicker = DatePicker["default"];
 exports.DatePickerSkeleton = DatePicker_Skeleton["default"];
@@ -250,16 +265,36 @@ exports.IdPrefix = index$6.IdPrefix;
 exports.Link = Link["default"];
 exports.ListItem = ListItem["default"];
 exports.MenuButton = index$7.MenuButton;
+exports.ActionableNotification = Notification.ActionableNotification;
+exports.InlineNotification = Notification.InlineNotification;
+exports.NotificationActionButton = Notification.NotificationActionButton;
+exports.NotificationButton = Notification.NotificationButton;
+exports.ToastNotification = Notification.ToastNotification;
 exports.OrderedList = OrderedList["default"];
 exports.OverflowMenu = index$8["default"];
 exports.PaginationSkeleton = Pagination_Skeleton["default"];
 exports.RadioButtonSkeleton = RadioButton_Skeleton["default"];
 exports.Search = Search["default"];
 exports.SearchSkeleton = Search_Skeleton["default"];
+exports.SkeletonText = SkeletonText["default"];
 exports.Slider = index$9["default"];
+exports.IconTab = Tabs.IconTab;
+exports.Tab = Tabs.Tab;
+exports.TabList = Tabs.TabList;
+exports.TabPanel = Tabs.TabPanel;
+exports.TabPanels = Tabs.TabPanels;
+exports.Tabs = Tabs.Tabs;
+exports.TabContent = TabContent["default"];
+exports.TabsSkeleton = Tabs_Skeleton["default"];
 exports.TagSkeleton = Tag_Skeleton["default"];
 exports.TextArea = TextArea["default"];
 exports.TextAreaSkeleton = TextArea_Skeleton["default"];
+exports.ClickableTile = Tile.ClickableTile;
+exports.ExpandableTile = Tile.ExpandableTile;
+exports.SelectableTile = Tile.SelectableTile;
+exports.Tile = Tile.Tile;
+exports.TileAboveTheFoldContent = Tile.TileAboveTheFoldContent;
+exports.TileBelowTheFoldContent = Tile.TileBelowTheFoldContent;
 exports.TileGroup = index$a["default"];
 exports.ToggleSkeleton = Toggle_Skeleton["default"];
 exports.ToggleSmallSkeleton = ToggleSmall_Skeleton["default"];
@@ -299,9 +334,6 @@ exports.unstable__FluidTextInput = FluidTextInput["default"];
 exports.unstable__FluidTextInputSkeleton = FluidTextInput_Skeleton["default"];
 exports.unstable_PageSelector = PageSelector["default"];
 exports.unstable_Pagination = Pagination["default"];
-exports.AccordionItem = AccordionItem["default"];
-exports.AccordionSkeleton = Accordion_Skeleton["default"];
-exports.Accordion = Accordion["default"];
 exports.BreadcrumbSkeleton = Breadcrumb_Skeleton["default"];
 exports.CheckboxGroup = CheckboxGroup["default"];
 exports.CodeSnippetSkeleton = CodeSnippet_Skeleton["default"];
@@ -326,7 +358,6 @@ exports.Loading = Loading["default"];
 exports.ModalWrapper = ModalWrapper["default"];
 exports.NumberInputSkeleton = NumberInput_Skeleton["default"];
 exports.ProgressIndicatorSkeleton = ProgressIndicator_Skeleton["default"];
-exports.TabsSkeleton = Tabs_Skeleton["default"];
 exports.TextInputSkeleton = TextInput_Skeleton["default"];
 exports.TextInput = TextInput["default"];
 exports.Toggle = Toggle.Toggle;
@@ -363,15 +394,7 @@ exports.unstable_Text = Text.Text;
 exports.unstable_TextDirection = TextDirection.TextDirection;
 exports.Breadcrumb = Breadcrumb["default"];
 exports.BreadcrumbItem = BreadcrumbItem["default"];
-exports.ButtonSkeleton = Button_Skeleton["default"];
-exports.Button = Button["default"];
-exports.ButtonSet = ButtonSet["default"];
 exports.ComboBox = ComboBox["default"];
-exports.ComposedModal = ComposedModal["default"];
-exports.ModalBody = ComposedModal.ModalBody;
-exports.ModalFooter = ModalFooter.ModalFooter;
-exports.ModalHeader = ModalHeader.ModalHeader;
-exports.DangerButton = DangerButton["default"];
 exports.DataTable = DataTable["default"];
 exports.Table = Table.Table;
 exports.TableActionList = TableActionList["default"];
@@ -405,11 +428,6 @@ exports.MenuItemRadioGroup = MenuItem.MenuItemRadioGroup;
 exports.MenuItemSelectable = MenuItem.MenuItemSelectable;
 exports.Modal = Modal["default"];
 exports.MultiSelect = MultiSelect["default"];
-exports.ActionableNotification = Notification.ActionableNotification;
-exports.InlineNotification = Notification.InlineNotification;
-exports.NotificationActionButton = Notification.NotificationActionButton;
-exports.NotificationButton = Notification.NotificationButton;
-exports.ToastNotification = Notification.ToastNotification;
 exports.NumberInput = NumberInput.NumberInput;
 exports.OverflowMenuItem = OverflowMenuItem["default"];
 exports.Pagination = Pagination$1["default"];
@@ -429,7 +447,6 @@ exports.SelectItem = SelectItem["default"];
 exports.SelectItemGroup = SelectItemGroup["default"];
 exports.SkeletonIcon = SkeletonIcon["default"];
 exports.SkeletonPlaceholder = SkeletonPlaceholder["default"];
-exports.SkeletonText = SkeletonText["default"];
 exports.SliderSkeleton = Slider_Skeleton["default"];
 exports.StructuredListSkeleton = StructuredList_Skeleton["default"];
 exports.StructuredListBody = StructuredList.StructuredListBody;
@@ -440,21 +457,8 @@ exports.StructuredListRow = StructuredList.StructuredListRow;
 exports.StructuredListWrapper = StructuredList.StructuredListWrapper;
 exports.Switch = Switch["default"];
 exports.IconSwitch = IconSwitch["default"];
-exports.IconTab = Tabs.IconTab;
-exports.Tab = Tabs.Tab;
-exports.TabList = Tabs.TabList;
-exports.TabPanel = Tabs.TabPanel;
-exports.TabPanels = Tabs.TabPanels;
-exports.Tabs = Tabs.Tabs;
-exports.TabContent = TabContent["default"];
 exports.Tag = Tag["default"];
 exports.types = Tag.types;
-exports.ClickableTile = Tile.ClickableTile;
-exports.ExpandableTile = Tile.ExpandableTile;
-exports.SelectableTile = Tile.SelectableTile;
-exports.Tile = Tile.Tile;
-exports.TileAboveTheFoldContent = Tile.TileAboveTheFoldContent;
-exports.TileBelowTheFoldContent = Tile.TileBelowTheFoldContent;
 exports.TimePicker = TimePicker["default"];
 exports.TimePickerSelect = TimePickerSelect["default"];
 exports.Content = Content["default"];

package/lib/internal/keyboard/match.js

@@ -30,7 +30,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
  *   }
  * }
  *
- * @param {Event} event
+ * @param {Event|React.SyntheticEvent} event
  * @param {Array<Key>} keysToMatch
  * @returns {boolean}
  */
@@ -57,7 +57,7 @@ function matches(event, keysToMatch) {
  *   }
  * }
  *
- * @param {React.KeyboardEvent|Event|number|string} eventOrCode
+ * @param {React.SyntheticEvent|Event|number|string} eventOrCode
  * @param {Key} key
  * @returns {boolean}
  */

package/lib/internal/useControllableState.js

@@ -23,7 +23,7 @@ var warning = require('./warning.js');
  * uncontrolled, or vice-versa.
  *
  * @param {object} config
- * @param {string} config.name - the name of the custom component
+ * @param {string} [config.name] - the name of the custom component
  * @param {any} config.defaultValue - the default value used for the state. This will be
  * the fallback value used if `value` is not defined.
  * @param {Function} config.onChange - an optional function that is called when
@@ -31,7 +31,7 @@ var warning = require('./warning.js');
  * controlled components that the value is requesting to be changed.
  * @param {any} config.value - a controlled value. Omitting this means that the state is
  * uncontrolled
- * @returns {[any, Function]}
+ * @returns {[any, (v: any) => void]}
  */
 function useControllableState(_ref) {
   let {

package/lib/internal/wrapFocus.js

@@ -32,12 +32,12 @@ function elementOrParentIsFloatingMenu(node) {
 /**
  * Ensures the focus is kept in the given `modalNode`, implementing "focus-wrap" behavior.
  * @param {object} options The options.
- * @param {Node} options.bodyNode
- * @param {Node} options.startTrapNode The DOM node of the focus sentinel the is placed earlier next to `modalNode`.
- * @param {Node} options.endTrapNode The DOM node of the focus sentinel the is placed next to `modalNode`.
- * @param {Node} options.currentActiveNode The DOM node that has focus.
- * @param {Node} options.oldActiveNode The DOM node that previously had focus.
- * @param {Node} [options.selectorsFloatingMenus] The CSS selectors that matches floating menus.
+ * @param {HTMLElement|null} options.bodyNode
+ * @param {HTMLElement|null} options.startTrapNode The DOM node of the focus sentinel the is placed earlier next to `modalNode`.
+ * @param {HTMLElement|null} options.endTrapNode The DOM node of the focus sentinel the is placed next to `modalNode`.
+ * @param {HTMLElement} options.currentActiveNode The DOM node that has focus.
+ * @param {HTMLElement} options.oldActiveNode The DOM node that previously had focus.
+ * @param {string[]} [options.selectorsFloatingMenus] The CSS selectors that matches floating menus.
  */
 function wrapFocus(_ref) {
   let {

package/lib/prop-types/requiredIfGivenPropIsTruthy.js

@@ -10,7 +10,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 /**
- * @param {Function} name The name of the prop that must exist to validate
+ * @param {string} name The name of the prop that must exist to validate
  * the current prop.
  * @param {Function} propType The original prop type checker.
  * @returns {Function} The new prop type checker for the current prop that

package/lib/prop-types/types.js

@@ -9,6 +9,9 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+/**
+ * @deprecated use ButtonKinds export from Button component instead
+ */
 const ButtonKinds = ['primary', 'secondary', 'danger', 'ghost', 'danger--primary', 'danger--ghost', 'danger--tertiary', 'tertiary'];
 
 exports.ButtonKinds = ButtonKinds;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/react",
   "description": "React components for the Carbon Design System",
-  "version": "1.31.2",
+  "version": "1.32.0-rc.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -46,7 +46,7 @@
     "@carbon/feature-flags": "^0.15.0",
     "@carbon/icons-react": "^11.21.0",
     "@carbon/layout": "^11.15.0",
-    "@carbon/styles": "^1.31.1",
+    "@carbon/styles": "^1.32.0-rc.0",
     "@carbon/telemetry": "0.1.0",
     "classnames": "2.3.2",
     "copy-to-clipboard": "^3.3.1",
@@ -89,6 +89,7 @@
     "@storybook/manager-webpack5": "^6.5.6",
     "@storybook/react": "^6.5.6",
     "@storybook/theming": "^6.5.6",
+    "@types/react-is": "~18.2.0",
     "autoprefixer": "^10.4.0",
     "babel-loader": "^9.0.0",
     "babel-plugin-dev-expression": "^0.2.3",
@@ -133,5 +134,5 @@
     "**/*.scss",
     "**/*.css"
   ],
-  "gitHead": "4d5dedb5de37b8c55b004c787146b4df6f218670"
+  "gitHead": "fe40fbf428231bd35f6bc8cc871ea09c7afa5051"
 }

package/scss/components/contained-list/_contained-list.scss

@@ -0,0 +1,9 @@
+// Code generated by @carbon/react. DO NOT EDIT.
+//
+// Copyright IBM Corp. 2018, 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.
+//
+
+@forward '@carbon/styles/scss/components/contained-list/contained-list';

package/scss/components/contained-list/_index.scss

@@ -0,0 +1,9 @@
+// Code generated by @carbon/react. DO NOT EDIT.
+//
+// Copyright IBM Corp. 2018, 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.
+//
+
+@forward '@carbon/styles/scss/components/contained-list';