carbon-react 111.4.2 → 111.5.1

package/lib/components/card/card.component.js

@@ -5,109 +5,251 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _propTypes2 = _interopRequireDefault(require("@styled-system/prop-types"));
-
 var _utils = require("../../style/utils");
 
 var _card = _interopRequireDefault(require("./card.style"));
 
 var _icon = _interopRequireDefault(require("../icon"));
 
-var _cardRow = _interopRequireDefault(require("./card-row/card-row.component"));
+var _ = require(".");
 
-var _cardFooter = _interopRequireDefault(require("./card-footer/card-footer.component"));
+var _logger = _interopRequireDefault(require("../../__internal__/utils/logger"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-const marginPropTypes = (0, _utils.filterStyledSystemMarginProps)(_propTypes2.default.space);
+function hasDisplayName(child, displayName) {
+  return child.type.displayName === displayName;
+}
+
+let isDeprecationWarningTriggered = false;
 
 const Card = ({
+  "data-element": dataElement,
+  "data-role": dataRole,
+  dataRole: oldDataRole,
   action,
   children,
-  cardWidth,
-  interactive,
+  cardWidth = "500px",
   draggable,
-  spacing,
-  dataRole,
+  interactive,
+  spacing = "medium",
   ...rest
 }) => {
-  const handleClick = ev => {
-    if (!draggable && action) {
-      action(ev);
-    }
-  };
-
-  const renderChildren = () => {
-    return _react.default.Children.map(children, (child, index) => {
-      if (child.type === _cardRow.default || child.type === _cardFooter.default) {
-        if (index === 0) {
-          const childProps = {
-            spacing,
-            ...child.props
-          };
-
-          if (child.type !== _cardFooter.default) {
-            const pad = _react.default.Children.toArray(children).filter(row => row.type === _cardRow.default).length === 1 ? "pt" : "py";
-            childProps[pad] = 0;
-          }
-
-          return /*#__PURE__*/_react.default.cloneElement(child, childProps);
-        }
-
-        return /*#__PURE__*/_react.default.cloneElement(child, {
-          spacing
-        });
-      }
-
-      return child;
+  if (!isDeprecationWarningTriggered && oldDataRole) {
+    isDeprecationWarningTriggered = true;
+
+    _logger.default.deprecate("The `dataRole` prop of `Card` is now deprecated. Please use the kebab-case version `data-role` instead.");
+  }
+
+  const renderChildren = (0, _react.useCallback)(() => _react.default.Children.map(children, (child, index) => {
+    if (! /*#__PURE__*/_react.default.isValidElement(child) || /*#__PURE__*/_react.default.isValidElement(child) && !hasDisplayName(child, _.CardRow.displayName) && !hasDisplayName(child, _.CardFooter.displayName)) return child;
+    if (index !== 0) return /*#__PURE__*/_react.default.cloneElement(child, {
+      spacing
     });
-  };
+    const childProps = {
+      spacing,
+      ...child.props
+    };
+
+    if (hasDisplayName(child, _.CardRow.displayName)) {
+      const pad = _react.default.Children.toArray(children).filter(row => /*#__PURE__*/_react.default.isValidElement(row) && hasDisplayName(row, _.CardRow.displayName)).length === 1 ? "pt" : "py";
+      childProps[pad] = 0;
+    }
 
-  const onClickHandler = interactive ? handleClick : null;
-  const interactiveProps = interactive ? {
-    tabIndex: 0,
-    type: "button"
-  } : undefined;
+    return /*#__PURE__*/_react.default.cloneElement(child, childProps);
+  }), [children, spacing]);
   return /*#__PURE__*/_react.default.createElement(_card.default, _extends({
     "data-component": "card",
+    "data-element": dataElement,
+    "data-role": dataRole || oldDataRole,
     cardWidth: cardWidth,
-    interactive: interactive,
-    draggable: draggable,
+    interactive: !!interactive,
+    draggable: !!draggable,
     spacing: spacing,
-    onClick: onClickHandler,
-    "data-role": dataRole
-  }, interactiveProps, rest), draggable && /*#__PURE__*/_react.default.createElement(_icon.default, {
+    onClick: interactive && !draggable ? action : undefined
+  }, interactive && {
+    tabIndex: 0,
+    type: "button"
+  }, (0, _utils.filterStyledSystemMarginProps)(rest)), draggable && /*#__PURE__*/_react.default.createElement(_icon.default, {
     type: "drag"
   }), renderChildren());
 };
 
-Card.defaultProps = {
-  spacing: "medium"
-};
-Card.propTypes = { ...marginPropTypes,
-
-  /** action to be executed when card is clicked or enter pressed */
-  action: _propTypes.default.func,
-  children: _propTypes.default.node.isRequired,
-
-  /** style value for width of card */
-  cardWidth: _propTypes.default.string,
-
-  /** flag to indicate if card is interactive */
-  interactive: _propTypes.default.bool,
-
-  /** flag to indicate if card is draggable */
-  draggable: _propTypes.default.bool,
-
-  /** size of card for applying padding (small | medium | large) */
-  spacing: _propTypes.default.oneOf(["small", "medium", "large"]),
-  dataRole: _propTypes.default.string
+Card.propTypes = {
+  "action": _propTypes.default.func,
+  "cardWidth": _propTypes.default.string,
+  "children": _propTypes.default.node,
+  "data-element": _propTypes.default.string,
+  "data-role": _propTypes.default.string,
+  "dataRole": _propTypes.default.string,
+  "draggable": _propTypes.default.bool,
+  "interactive": _propTypes.default.bool,
+  "m": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "margin": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "marginBottom": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "marginLeft": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "marginRight": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "marginTop": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "marginX": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "marginY": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "mb": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "ml": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "mr": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "mt": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "mx": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "my": _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf([null]), _propTypes.default.number, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string])), _propTypes.default.number, _propTypes.default.object, _propTypes.default.shape({
+    "__@toStringTag": _propTypes.default.string.isRequired,
+    "description": _propTypes.default.string,
+    "toString": _propTypes.default.func.isRequired,
+    "valueOf": _propTypes.default.func.isRequired
+  }), _propTypes.default.string]),
+  "spacing": _propTypes.default.oneOf(["large", "medium", "small"])
 };
+Card.displayName = "Card";
 var _default = Card;
 exports.default = _default;

package/lib/components/card/card.config.d.ts

@@ -0,0 +1,4 @@
+export declare const CARD_SPACING: readonly ["small", "medium", "large"];
+export declare const CARD_ALIGNS: readonly ["left", "center", "right"];
+export declare type CardAlign = typeof CARD_ALIGNS[number];
+export declare type CardSpacing = typeof CARD_SPACING[number];

package/lib/components/card/card.config.js

@@ -3,9 +3,8 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.CARD_ALIGNS = exports.CARD_SIZES = void 0;
-// eslint-disable-next-line import/prefer-default-export
-const CARD_SIZES = ["small", "medium", "large"];
-exports.CARD_SIZES = CARD_SIZES;
-const CARD_ALIGNS = ["center", "left", "right"];
+exports.CARD_ALIGNS = exports.CARD_SPACING = void 0;
+const CARD_SPACING = ["small", "medium", "large"];
+exports.CARD_SPACING = CARD_SPACING;
+const CARD_ALIGNS = ["left", "center", "right"];
 exports.CARD_ALIGNS = CARD_ALIGNS;

package/lib/components/card/card.style.d.ts

@@ -0,0 +1,10 @@
+import { MarginProps } from "styled-system";
+import { CardSpacing } from "./card.config";
+export interface StyledCardProps extends MarginProps {
+    cardWidth: string;
+    interactive: boolean;
+    draggable: boolean;
+    spacing: CardSpacing;
+}
+declare const StyledCard: import("styled-components").StyledComponent<"div", any, StyledCardProps, never>;
+export default StyledCard;

package/lib/components/card/card.style.js

@@ -7,14 +7,10 @@ exports.default = void 0;
 
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _styledSystem = require("styled-system");
 
 var _base = _interopRequireDefault(require("../../style/themes/base"));
 
-var _card = require("./card.config");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
@@ -64,16 +60,7 @@ const StyledCard = _styledComponents.default.div`
   `}
 `;
 StyledCard.defaultProps = {
-  cardWidth: "500px",
-  spacing: "medium",
   theme: _base.default
 };
-StyledCard.propTypes = {
-  cardWidth: _propTypes.default.string,
-  interactive: _propTypes.default.bool,
-  draggable: _propTypes.default.bool,
-  spacing: _propTypes.default.oneOf(_card.CARD_SIZES),
-  theme: _propTypes.default.object
-};
 var _default = StyledCard;
 exports.default = _default;

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

@@ -1,4 +1,8 @@
-export { default, default as Card } from "./card";
+export { default, default as Card } from "./card.component";
+export type { CardProps } from "./card.component";
 export { default as CardColumn } from "./card-column";
+export type { CardColumnProps } from "./card-column";
 export { default as CardFooter } from "./card-footer";
+export type { CardFooterProps } from "./card-footer";
 export { default as CardRow } from "./card-row";
+export type { CardRowProps } from "./card-row";

package/lib/components/dialog/dialog.component.d.ts

@@ -4,6 +4,9 @@ import { TagProps } from "../../__internal__/utils/helpers/tags/tags";
 import { DialogSizes } from "./dialog.config";
 declare const PADDING_VALUES: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8];
 declare type PaddingValues = typeof PADDING_VALUES[number];
+declare type CustomRefObject<T> = {
+    current?: T | null;
+};
 export interface ContentPaddingInterface {
     p?: PaddingValues;
     py?: PaddingValues;
@@ -54,7 +57,7 @@ export interface DialogProps extends ModalProps, TagProps {
     /** Padding to be set on the Dialog content */
     contentPadding?: ContentPaddingInterface;
     /** an optional array of refs to containers whose content should also be reachable by tabbing from the dialog */
-    focusableContainers?: React.MutableRefObject<HTMLElement | null>[];
+    focusableContainers?: CustomRefObject<HTMLElement>[];
 }
 export declare const Dialog: ({ className, children, open, height, size, title, disableEscKey, subtitle, disableAutoFocus, focusFirstElement, onCancel, showCloseIcon, bespokeFocusTrap, disableClose, help, role, contentPadding, focusableContainers, ...rest }: DialogProps) => JSX.Element;
 export default Dialog;

package/lib/components/dialog/dialog.component.js

@@ -232,13 +232,13 @@ Dialog.propTypes = {
   "disableFocusTrap": _propTypes.default.bool,
   "enableBackgroundUI": _propTypes.default.bool,
   "focusableContainers": _propTypes.default.arrayOf(_propTypes.default.shape({
-    "current": _propTypes.default.oneOfType([_propTypes.default.oneOf([null]), function (props, propName) {
+    "current": function (props, propName) {
       if (props[propName] == null) {
-        return new Error("Prop '" + propName + "' is required but wasn't specified");
+        return null;
       } else if (typeof props[propName] !== 'object' || props[propName].nodeType !== 1) {
         return new Error("Expected prop '" + propName + "' to be of type Element");
       }
-    }]).isRequired
+    }
   })),
   "focusFirstElement": _propTypes.default.shape({
     "current": _propTypes.default.oneOfType([_propTypes.default.oneOf([null]), function (props, propName) {

package/lib/components/dialog-full-screen/dialog-full-screen.d.ts

@@ -42,7 +42,7 @@ export interface DialogFullScreenProps extends ModalProps {
   /** The ARIA role to be applied to the DialogFullscreen container */
   role?: string;
   /** an optional array of refs to containers whose content should also be reachable by tabbing from the dialog */
-  focusableContainers?: React.MutableRefObject<HTMLElement>[];
+  focusableContainers?: React.MutableRefObject<HTMLElement | null>[];
 }
 
 declare function DialogFullScreen(props: DialogFullScreenProps): JSX.Element;

package/lib/components/sidebar/sidebar.component.d.ts

@@ -1,6 +1,9 @@
 import React from "react";
 import { PaddingProps } from "styled-system";
 import { TagProps } from "../../__internal__/utils/helpers/tags/tags";
+declare type CustomRefObject<T> = {
+    current?: T | null;
+};
 export interface SidebarContextProps {
     isInSidebar?: boolean;
 }
@@ -10,13 +13,13 @@ export interface SidebarProps extends PaddingProps, TagProps {
     "aria-describedby"?: string;
     /**
      * Prop to specify the aria-label of the component.
-     * To be used only when the title prop is not defined, and the component is not labelled by any internal element.
+     * To be used only when the header prop is not defined, and the component is not labelled by any internal element.
      */
     "aria-label"?: string;
     /**
      * Prop to specify the aria-labeledby property of the component
-     * To be used when the title prop is a custom React Node,
-     * or the component is labelled by an internal element other than the title.
+     * To be used when the header prop is a custom React Node,
+     * or the component is labelled by an internal element other than the header.
      */
     "aria-labelledby"?: string;
     /** Modal content */
@@ -38,7 +41,7 @@ export interface SidebarProps extends PaddingProps, TagProps {
     /** Sets the size of the sidebar when open. */
     size?: "extra-small" | "small" | "medium-small" | "medium" | "medium-large" | "large" | "extra-large";
     /** an optional array of refs to containers whose content should also be reachable by tabbing from the sidebar */
-    focusableContainers?: React.MutableRefObject<HTMLElement>[];
+    focusableContainers?: CustomRefObject<HTMLElement>[];
 }
-export declare const Sidebar: React.ForwardRefExoticComponent<Pick<SidebarProps, keyof SidebarProps> & React.RefAttributes<HTMLDivElement>>;
+export declare const Sidebar: React.ForwardRefExoticComponent<SidebarProps & React.RefAttributes<HTMLDivElement>>;
 export default Sidebar;

package/lib/components/sidebar/sidebar.component.js

@@ -61,7 +61,7 @@ const Sidebar = /*#__PURE__*/_react.default.forwardRef(({
 }, ref) => {
   const locale = (0, _useLocale.default)();
   const {
-    current: titleId
+    current: headerId
   } = (0, _react.useRef)((0, _guid.default)());
   const hasStickyFooter = (0, _useIsStickyFooterForm.default)(children);
   const sidebarRef = (0, _react.useRef)(null);
@@ -93,7 +93,7 @@ const Sidebar = /*#__PURE__*/_react.default.forwardRef(({
     "aria-modal": !enableBackgroundUI,
     "aria-describedby": ariaDescribedBy,
     "aria-label": ariaLabel,
-    "aria-labelledby": !ariaLabelledBy && !ariaLabel ? titleId : ariaLabelledBy,
+    "aria-labelledby": !ariaLabelledBy && !ariaLabel ? headerId : ariaLabelledBy,
     ref: setRefs,
     position: position,
     size: size,
@@ -101,7 +101,7 @@ const Sidebar = /*#__PURE__*/_react.default.forwardRef(({
     onCancel: onCancel,
     role: role
   }, header && /*#__PURE__*/_react.default.createElement(_sidebarHeader.default, {
-    id: titleId
+    id: headerId
   }, header), closeIcon(), /*#__PURE__*/_react.default.createElement(_box.default, _extends({
     "data-element": "sidebar-content",
     pt: "var(--spacing300)",
@@ -143,7 +143,7 @@ Sidebar.propTypes = {
   "focusableContainers": _propTypes.default.arrayOf(_propTypes.default.shape({
     "current": function (props, propName) {
       if (props[propName] == null) {
-        return new Error("Prop '" + propName + "' is required but wasn't specified");
+        return null;
       } else if (typeof props[propName] !== 'object' || props[propName].nodeType !== 1) {
         return new Error("Expected prop '" + propName + "' to be of type Element");
       }

package/lib/components/textbox/textbox.component.js

@@ -153,9 +153,7 @@ const Textbox = ({
     "data-role": dataRole,
     "data-element": dataElement,
     validationIconId: validationRedesignOptIn ? undefined : validationIconId,
-    validationRedesignOptIn: validationRedesignOptIn,
-    size: size,
-    readOnly: readOnly
+    validationRedesignOptIn: validationRedesignOptIn
   }, (0, _utils.filterStyledSystemMarginProps)(props)), validationRedesignOptIn && labelHelp && /*#__PURE__*/_react.default.createElement(_textbox.StyledHintText, null, labelHelp), validationRedesignOptIn && /*#__PURE__*/_react.default.createElement(_validationMessage.default, {
     error: error,
     warning: warning

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "carbon-react",
-  "version": "111.4.2",
+  "version": "111.5.1",
   "description": "A library of reusable React components for easily building user interfaces.",
   "files": [
     "lib",

package/esm/components/card/card-column/card-column.d.ts

@@ -1,11 +0,0 @@
-import * as React from "react";
-
-export interface CardColumnProps {
-  children: React.ReactNode;
-  /** text alignment of the card section text */
-  align?: "left" | "center" | "right";
-}
-
-declare function CardColumn(props: CardColumnProps): JSX.Element;
-
-export default CardColumn;

package/esm/components/card/card-footer/card-footer.d.ts

@@ -1,16 +0,0 @@
-import * as React from "react";
-import { SpaceProps } from "styled-system";
-import { CardSizes } from "../card-types";
-
-export interface CardFooterProps extends SpaceProps {
-  children: React.ReactNode;
-  /**
-   * Predefined size of CardFooter for applying padding (small | medium | large).
-   * For more granular control these can be over-ridden by Spacing props from styled-system.
-   */
-  spacing?: CardSizes;
-}
-
-declare function CardFooter(props: CardFooterProps): JSX.Element;
-
-export default CardFooter;

package/esm/components/card/card-row/card-row.d.ts

@@ -1,16 +0,0 @@
-import * as React from "react";
-import { PaddingProps } from "styled-system";
-import { CardSizes } from "../card-types";
-
-export interface CardRowProps extends PaddingProps {
-  children: React.ReactNode;
-  /**
-   * Spacing prop is set in Card and defines the padding for the CardRow (the first CardRow has no padding by default).
-   * For more granular control of CardRow padding these can be over-ridden by Padding props from styled-system.
-   */
-  spacing?: CardSizes;
-}
-
-declare function CardRow(props: CardRowProps): JSX.Element;
-
-export default CardRow;

package/esm/components/card/card-types.d.ts

@@ -1 +0,0 @@
-export type CardSizes = "small" | "medium" | "large";

package/esm/components/card/card.d.ts

@@ -1,22 +0,0 @@
-import * as React from "react";
-import { MarginProps } from "styled-system";
-import { CardSizes } from "./card-types";
-
-export interface CardProps extends MarginProps {
-  /** action to be executed when card is clicked or enter pressed */
-  action?: (ev: React.MouseEvent<HTMLDivElement>) => void;
-  children: React.ReactNode;
-  /** style value for width of card */
-  cardWidth?: string;
-  /** flag to indicate if card is interactive */
-  interactive?: boolean;
-  /** flag to indicate if card is draggable */
-  draggable?: boolean;
-  /** size of card for applying padding (small | medium | large) */
-  spacing?: CardSizes;
-  dataRole?: string;
-}
-
-declare function Card(props: CardProps): JSX.Element;
-
-export default Card;

package/lib/components/card/card-column/card-column.d.ts

@@ -1,11 +0,0 @@
-import * as React from "react";
-
-export interface CardColumnProps {
-  children: React.ReactNode;
-  /** text alignment of the card section text */
-  align?: "left" | "center" | "right";
-}
-
-declare function CardColumn(props: CardColumnProps): JSX.Element;
-
-export default CardColumn;