@carbon/react 1.40.0 → 1.41.0

package/lib/components/UIShell/SideNavDivider.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Copyright IBM Corp. 2021
+ *
+ * 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 React from 'react';
+interface SideNavDividerProps {
+    /**
+     * Provide an optional class to be applied to the containing node
+     */
+    className?: string;
+}
+declare const SideNavDivider: React.FC<SideNavDividerProps>;
+export default SideNavDivider;

package/lib/components/UIShell/SideNavDivider.js

@@ -21,7 +21,7 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 var _hr;
-function SideNavDivider(_ref) {
+const SideNavDivider = _ref => {
   let {
     className
   } = _ref;
@@ -30,7 +30,7 @@ function SideNavDivider(_ref) {
   return /*#__PURE__*/React__default["default"].createElement("li", {
     className: classNames
   }, _hr || (_hr = /*#__PURE__*/React__default["default"].createElement("hr", null)));
-}
+};
 SideNavDivider.propTypes = {
   /**
    * Provide an optional class to be applied to the containing node

package/lib/components/UIShell/SideNavFooter.js

@@ -30,7 +30,7 @@ var _Close, _ChevronRight;
  */
 function SideNavFooter(_ref) {
   let {
-    assistiveText,
+    assistiveText = 'Toggle opening or closing the side navigation',
     className: customClassName,
     expanded,
     onToggle
@@ -60,7 +60,7 @@ SideNavFooter.propTypes = {
    * Provide text to be read to screen readers and shown as a tooltip when
    * interacting with the toggle button in the footer
    */
-  assistiveText: PropTypes__default["default"].string.isRequired,
+  assistiveText: PropTypes__default["default"].string,
   className: PropTypes__default["default"].string,
   /**
    * Specify whether the side navigation is expanded or collapsed
@@ -72,8 +72,5 @@ SideNavFooter.propTypes = {
    */
   onToggle: PropTypes__default["default"].func.isRequired
 };
-SideNavFooter.defaultProps = {
-  assistiveText: 'Toggle opening or closing the side navigation'
-};
 
 exports["default"] = SideNavFooter;

package/lib/components/UIShell/SideNavIcon.d.ts

@@ -0,0 +1,25 @@
+/**
+ * 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 React from 'react';
+interface SideNavIconProps {
+    /**
+     * Provide a single icon as the child to `SideNavIcon` to render in the
+     * container
+     */
+    children: React.ReactNode;
+    /**
+     * Provide an optional class to be applied to the containing node
+     */
+    className?: string;
+    /**
+     * Specify whether the icon should be placed in a smaller bounding box
+     * Since the 'small' prop is not provided, we make it optional and set a default value to `false`.
+     */
+    small?: boolean;
+}
+declare const SideNavIcon: React.FC<SideNavIconProps>;
+export default SideNavIcon;

package/lib/components/UIShell/SideNavIcon.js

@@ -20,11 +20,11 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-function SideNavIcon(_ref) {
+const SideNavIcon = _ref => {
   let {
     children,
     className: customClassName,
-    small
+    small = false
   } = _ref;
   const prefix = usePrefix.usePrefix();
   const className = cx__default["default"]({
@@ -35,7 +35,7 @@ function SideNavIcon(_ref) {
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: className
   }, children);
-}
+};
 SideNavIcon.propTypes = {
   /**
    * Provide a single icon as the child to `SideNavIcon` to render in the
@@ -49,10 +49,7 @@ SideNavIcon.propTypes = {
   /**
    * Specify whether the icon should be placed in a smaller bounding box
    */
-  small: PropTypes__default["default"].bool.isRequired
-};
-SideNavIcon.defaultProps = {
-  small: false
+  small: PropTypes__default["default"].bool
 };
 
 exports["default"] = SideNavIcon;

package/lib/components/UIShell/SideNavSwitcher.d.ts

@@ -0,0 +1,31 @@
+/**
+ * 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 React, { ChangeEventHandler } from 'react';
+interface SideNavSwitcherProps {
+    /**
+     * Provide an optional class to be applied to the containing node
+     */
+    className?: string;
+    /**
+     * Provide the label for the switcher. This will be the first visible option
+     * when someone views this control
+     */
+    labelText: string;
+    /**
+     * Provide a callback function that is called whenever the switcher value is
+     * updated
+     */
+    onChange?: ChangeEventHandler<HTMLSelectElement>;
+    /**
+     * Provide an array of options to be rendered in the switcher as an
+     * `<option>`. The text value will be what is displayed to the user and is set
+     * as the `value` prop for each `<option>`.
+     */
+    options: string[];
+}
+declare const SideNavSwitcher: React.ForwardRefExoticComponent<SideNavSwitcherProps & React.RefAttributes<HTMLSelectElement>>;
+export default SideNavSwitcher;

package/lib/components/UIShell/SideNavSwitcher.js

@@ -13,8 +13,8 @@ var iconsReact = require('@carbon/icons-react');
 var cx = require('classnames');
 var PropTypes = require('prop-types');
 var React = require('react');
-var usePrefix = require('../../internal/usePrefix.js');
 var useId = require('../../internal/useId.js');
+var usePrefix = require('../../internal/usePrefix.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -23,7 +23,7 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 var _ChevronDown;
-const SideNavSwitcher = /*#__PURE__*/React__default["default"].forwardRef(function SideNavSwitcher(props, ref) {
+const SideNavSwitcher = /*#__PURE__*/React.forwardRef(function SideNavSwitcher(props, ref) {
   const id = useId.useId('side-nav-switcher');
   const prefix = usePrefix.usePrefix();
   const {
@@ -33,6 +33,7 @@ const SideNavSwitcher = /*#__PURE__*/React__default["default"].forwardRef(functi
     options
   } = props;
   const className = cx__default["default"](`${prefix}--side-nav__switcher`, customClassName);
+
   // Note for usage around `onBlur`: https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-onchange.md
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: className
@@ -82,8 +83,8 @@ SideNavSwitcher.propTypes = {
    * `<option>`. The text value will be what is displayed to the user and is set
    * as the `value` prop for each `<option>`.
    */
+  // @ts-expect-error
   options: PropTypes__default["default"].arrayOf(PropTypes__default["default"].string).isRequired
 };
-var SideNavSwitcher$1 = SideNavSwitcher;
 
-exports["default"] = SideNavSwitcher$1;
+exports["default"] = SideNavSwitcher;

package/lib/index.js

@@ -48,6 +48,7 @@ var FluidForm = require('./components/FluidForm/FluidForm.js');
 var FormContext = require('./components/FluidForm/FormContext.js');
 var Form = require('./components/Form/Form.js');
 var FormGroup = require('./components/FormGroup/FormGroup.js');
+var FormItem = require('./components/FormItem/FormItem.js');
 var FormLabel = require('./components/FormLabel/FormLabel.js');
 var FlexGrid = require('./components/Grid/FlexGrid.js');
 var Grid = require('./components/Grid/Grid.js');
@@ -61,6 +62,7 @@ var Link = require('./components/Link/Link.js');
 var ListItem = require('./components/ListItem/ListItem.js');
 var Loading = require('./components/Loading/Loading.js');
 var index$7 = require('./components/MenuButton/index.js');
+var Modal = require('./components/Modal/Modal.js');
 var Notification = require('./components/Notification/Notification.js');
 var NumberInput_Skeleton = require('./components/NumberInput/NumberInput.Skeleton.js');
 var NumberInput = require('./components/NumberInput/NumberInput.js');
@@ -158,7 +160,6 @@ var useContextMenu = require('./components/ContextMenu/useContextMenu.js');
 var Copy = require('./components/Copy/Copy.js');
 var CopyButton = require('./components/CopyButton/CopyButton.js');
 var ErrorBoundary = require('./components/ErrorBoundary/ErrorBoundary.js');
-var FormItem = require('./components/FormItem/FormItem.js');
 var InlineLoading = require('./components/InlineLoading/InlineLoading.js');
 var ModalWrapper = require('./components/ModalWrapper/ModalWrapper.js');
 var ProgressIndicator_Skeleton = require('./components/ProgressIndicator/ProgressIndicator.Skeleton.js');
@@ -209,7 +210,6 @@ var ErrorBoundaryContext = require('./components/ErrorBoundary/ErrorBoundaryCont
 var FilterableMultiSelect = require('./components/MultiSelect/FilterableMultiSelect.js');
 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 Pagination$1 = require('./components/Pagination/Pagination.js');
 var PaginationNav = require('./components/PaginationNav/PaginationNav.js');
@@ -269,6 +269,7 @@ exports.FluidForm = FluidForm["default"];
 exports.FormContext = FormContext.FormContext;
 exports.Form = Form["default"];
 exports.FormGroup = FormGroup["default"];
+exports.FormItem = FormItem["default"];
 exports.FormLabel = FormLabel["default"];
 exports.FlexGrid = FlexGrid.FlexGrid;
 exports.Grid = Grid.Grid;
@@ -282,6 +283,7 @@ exports.Link = Link["default"];
 exports.ListItem = ListItem["default"];
 exports.Loading = Loading["default"];
 exports.MenuButton = index$7.MenuButton;
+exports.Modal = Modal["default"];
 exports.ActionableNotification = Notification.ActionableNotification;
 exports.InlineNotification = Notification.InlineNotification;
 exports.NotificationActionButton = Notification.NotificationActionButton;
@@ -411,7 +413,6 @@ exports.useContextMenu = useContextMenu["default"];
 exports.Copy = Copy["default"];
 exports.CopyButton = CopyButton["default"];
 exports.ErrorBoundary = ErrorBoundary["default"];
-exports.FormItem = FormItem["default"];
 exports.InlineLoading = InlineLoading["default"];
 exports.ModalWrapper = ModalWrapper["default"];
 exports.ProgressIndicatorSkeleton = ProgressIndicator_Skeleton["default"];
@@ -466,7 +467,6 @@ exports.MenuItemDivider = MenuItem.MenuItemDivider;
 exports.MenuItemGroup = MenuItem.MenuItemGroup;
 exports.MenuItemRadioGroup = MenuItem.MenuItemRadioGroup;
 exports.MenuItemSelectable = MenuItem.MenuItemSelectable;
-exports.Modal = Modal["default"];
 exports.MultiSelect = MultiSelect["default"];
 exports.Pagination = Pagination$1["default"];
 exports.PaginationNav = PaginationNav["default"];

package/lib/internal/FloatingMenu.js

@@ -206,13 +206,13 @@ class FloatingMenu extends React__default["default"].Component {
       } = prevProps;
       const {
         menuOffset = {},
-        menuDirection
+        menuDirection = DIRECTION_BOTTOM
       } = _this.props;
       if (hasChangeInOffset(oldMenuOffset, menuOffset) || oldMenuDirection !== menuDirection || isAdjustment) {
         const {
           flipped,
           triggerRef,
-          updateOrientation
+          updateOrientation = null
         } = _this.props;
         const {
           current: triggerEl
@@ -466,11 +466,6 @@ _rollupPluginBabelHelpers.defineProperty(FloatingMenu, "propTypes", {
    */
   updateOrientation: PropTypes__default["default"].func
 });
-_rollupPluginBabelHelpers.defineProperty(FloatingMenu, "defaultProps", {
-  menuOffset: {},
-  menuDirection: DIRECTION_BOTTOM,
-  updateOrientation: null
-});
 var FloatingMenu$1 = FloatingMenu;
 
 exports.DIRECTION_BOTTOM = DIRECTION_BOTTOM;

package/lib/internal/Selection.js

@@ -199,9 +199,6 @@ _rollupPluginBabelHelpers.defineProperty(Selection, "propTypes", {
   onChange: PropTypes__default["default"].func,
   render: PropTypes__default["default"].func
 });
-_rollupPluginBabelHelpers.defineProperty(Selection, "defaultProps", {
-  initialSelectedItems: []
-});
 const removeAtIndex = (array, index) => {
   const result = array.slice();
   result.splice(index, 1);

package/lib/internal/noopFn.d.ts

@@ -0,0 +1,7 @@
+/**
+ * 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.
+ */
+export declare const noopFn: () => void;

package/lib/internal/noopFn.js

@@ -0,0 +1,14 @@
+/**
+ * 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 });
+
+const noopFn = () => {};
+
+exports.noopFn = noopFn;

package/lib/internal/useNormalizedInputProps.js

@@ -12,6 +12,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
 var iconsReact = require('@carbon/icons-react');
 var usePrefix = require('./usePrefix.js');
+require('../components/Text/index.js');
+var Text = require('../components/Text/Text.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -76,13 +78,15 @@ function useNormalizedInputProps(_ref) {
   };
   if (normalizedProps.invalid) {
     normalizedProps.icon = iconsReact.WarningFilled;
-    normalizedProps.validation = /*#__PURE__*/React__default["default"].createElement("div", {
+    normalizedProps.validation = /*#__PURE__*/React__default["default"].createElement(Text.Text, {
+      as: "div",
       className: `${prefix}--form-requirement`,
       id: normalizedProps.invalidId
     }, invalidText);
   } else if (normalizedProps.warn) {
     normalizedProps.icon = iconsReact.WarningAltFilled;
-    normalizedProps.validation = /*#__PURE__*/React__default["default"].createElement("div", {
+    normalizedProps.validation = /*#__PURE__*/React__default["default"].createElement(Text.Text, {
+      as: "div",
       className: `${prefix}--form-requirement`,
       id: normalizedProps.warnId
     }, warnText);

package/lib/internal/wrapFocus.js

@@ -32,11 +32,11 @@ function elementOrParentIsFloatingMenu(node) {
 /**
  * Ensures the focus is kept in the given `modalNode`, implementing "focus-wrap" behavior.
  * @param {object} options The options.
- * @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 {Node|null} options.bodyNode
+ * @param {Node|null} options.startTrapNode The DOM node of the focus sentinel the is placed earlier next to `modalNode`.
+ * @param {Node|null} 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 {string[]} [options.selectorsFloatingMenus] The CSS selectors that matches floating menus.
  */
 function wrapFocus(_ref) {

package/lib/prop-types/requiredIfGivenPropIsTruthy.js

@@ -12,8 +12,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 /**
  * @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
+ * @param {React.Validator} propType The original prop type checker.
+ * @returns {React.Validator} The new prop type checker for the current prop that
  * becomes required if the prop corresponding to the provided prop name exists.
  */
 function requiredIfGivenPropIsTruthy(name, propType) {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/react",
   "description": "React components for the Carbon Design System",
-  "version": "1.40.0",
+  "version": "1.41.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -34,7 +34,7 @@
   },
   "scripts": {
     "build": "yarn clean && node tasks/build-styles.js && node tasks/build.js",
-    "clean": "rimraf es lib icons/index.js icons/index.esm.js storybook-static",
+    "clean": "rimraf es lib icons/index.js icons/index.d.ts icons/index.esm.js storybook-static",
     "postinstall": "carbon-telemetry collect --install",
     "storybook": "storybook dev -p 3000",
     "storybook:build": "storybook build"
@@ -47,13 +47,13 @@
   "dependencies": {
     "@babel/runtime": "^7.18.3",
     "@carbon/feature-flags": "^0.16.0",
-    "@carbon/icons-react": "^11.28.0",
-    "@carbon/layout": "^11.19.0",
-    "@carbon/styles": "^1.40.0",
+    "@carbon/icons-react": "^11.29.0",
+    "@carbon/layout": "^11.20.0",
+    "@carbon/styles": "^1.41.0",
     "@carbon/telemetry": "0.1.0",
     "classnames": "2.3.2",
     "copy-to-clipboard": "^3.3.1",
-    "downshift": "8.2.1",
+    "downshift": "8.2.2",
     "flatpickr": "4.6.9",
     "invariant": "^2.2.3",
     "lodash.debounce": "^4.0.8",
@@ -77,7 +77,7 @@
     "@babel/preset-react": "^7.22.3",
     "@babel/preset-typescript": "^7.21.5",
     "@carbon/test-utils": "^10.30.0",
-    "@carbon/themes": "^11.25.0",
+    "@carbon/themes": "^11.26.0",
     "@rollup/plugin-babel": "^6.0.0",
     "@rollup/plugin-commonjs": "^25.0.0",
     "@rollup/plugin-node-resolve": "^15.0.0",
@@ -124,7 +124,7 @@
     "storybook-readme": "^5.0.9",
     "stream-browserify": "^3.0.0",
     "style-loader": "^3.3.1",
-    "typescript": "^4.8.4",
+    "typescript-config-carbon": "^0.2.0",
     "webpack": "^5.65.0",
     "webpack-dev-server": "^4.7.4"
   },
@@ -139,5 +139,5 @@
     "**/*.scss",
     "**/*.css"
   ],
-  "gitHead": "99314f69da3f5791c3c0f46564a47ef9ee7c9e0f"
+  "gitHead": "abe693e46a9b76731f51e47104f3634b6346f845"
 }

package/scss/components/slug/_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/slug';

package/scss/components/slug/_slug.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/slug/slug';