carbon-react 147.11.0 → 148.0.1

package/lib/components/select/simple-select/simple-select.component.js

@@ -72,7 +72,7 @@ const SimpleSelect = exports.SimpleSelect = /*#__PURE__*/_react.default.forwardR
   const filterText = (0, _react.useRef)();
   const [textboxRef, setTextboxRef] = (0, _react.useState)();
   const [isOpen, setOpenState] = (0, _react.useState)(false);
-  const [activeDescendantId, setActiveDescendantId] = (0, _react.useState)();
+  const [activeDescendantId, setActiveDescendantId] = (0, _react.useState)("");
   const [textValue, setTextValue] = (0, _react.useState)("");
   const [selectedValue, setSelectedValue] = (0, _react.useState)(value || defaultValue || "");
   const inputId = (0, _react.useRef)(id || (0, _guid.default)());
@@ -249,7 +249,7 @@ const SimpleSelect = exports.SimpleSelect = /*#__PURE__*/_react.default.forwardR
     }
     onChange?.(createCustomEvent(newValue, selectionConfirmed));
   }
-  function onSelectOption(optionData) {
+  const onSelectOption = optionData => {
     const {
       text,
       value: newValue,
@@ -267,7 +267,7 @@ const SimpleSelect = exports.SimpleSelect = /*#__PURE__*/_react.default.forwardR
       isClickTriggeredBySelect.current = true;
       textboxRef?.focus();
     }
-  }
+  };
   const onSelectListClose = (0, _react.useCallback)(() => {
     setOpenState(false);
   }, []);
@@ -369,14 +369,18 @@ if (process.env.NODE_ENV !== "production") {
     "aria-activedescendant": _propTypes.default.string,
     "aria-atomic": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-autocomplete": _propTypes.default.oneOf(["both", "inline", "list", "none"]),
+    "aria-braillelabel": _propTypes.default.string,
+    "aria-brailleroledescription": _propTypes.default.string,
     "aria-busy": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-checked": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "mixed", "true"]), _propTypes.default.bool]),
     "aria-colcount": _propTypes.default.number,
     "aria-colindex": _propTypes.default.number,
+    "aria-colindextext": _propTypes.default.string,
     "aria-colspan": _propTypes.default.number,
     "aria-controls": _propTypes.default.string,
     "aria-current": _propTypes.default.oneOfType([_propTypes.default.oneOf(["date", "false", "location", "page", "step", "time", "true"]), _propTypes.default.bool]),
     "aria-describedby": _propTypes.default.string,
+    "aria-description": _propTypes.default.string,
     "aria-details": _propTypes.default.string,
     "aria-disabled": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-dropeffect": _propTypes.default.oneOf(["copy", "execute", "link", "move", "none", "popup"]),
@@ -406,6 +410,7 @@ if (process.env.NODE_ENV !== "production") {
     "aria-roledescription": _propTypes.default.string,
     "aria-rowcount": _propTypes.default.number,
     "aria-rowindex": _propTypes.default.number,
+    "aria-rowindextext": _propTypes.default.string,
     "aria-rowspan": _propTypes.default.number,
     "aria-selected": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-setsize": _propTypes.default.number,
@@ -469,7 +474,7 @@ if (process.env.NODE_ENV !== "production") {
       "trimStart": _propTypes.default.func.isRequired,
       "valueOf": _propTypes.default.func.isRequired
     })]),
-    "autoComplete": _propTypes.default.string,
+    "autoComplete": _propTypes.default.any,
     "autoCorrect": _propTypes.default.string,
     "autoFocus": _propTypes.default.bool,
     "autoSave": _propTypes.default.string,
@@ -479,7 +484,7 @@ if (process.env.NODE_ENV !== "production") {
     "className": _propTypes.default.string,
     "color": _propTypes.default.string,
     "content": _propTypes.default.string,
-    "contentEditable": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "inherit", "true"]), _propTypes.default.bool]),
+    "contentEditable": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "inherit", "plaintext-only", "true"]), _propTypes.default.bool]),
     "contextMenu": _propTypes.default.string,
     "dangerouslySetInnerHTML": _propTypes.default.shape({
       "__html": _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.string]).isRequired
@@ -818,9 +823,7 @@ if (process.env.NODE_ENV !== "production") {
     "onPointerDown": _propTypes.default.func,
     "onPointerDownCapture": _propTypes.default.func,
     "onPointerEnter": _propTypes.default.func,
-    "onPointerEnterCapture": _propTypes.default.func,
     "onPointerLeave": _propTypes.default.func,
-    "onPointerLeaveCapture": _propTypes.default.func,
     "onPointerMove": _propTypes.default.func,
     "onPointerMoveCapture": _propTypes.default.func,
     "onPointerOut": _propTypes.default.func,
@@ -835,6 +838,8 @@ if (process.env.NODE_ENV !== "production") {
     "onRateChangeCapture": _propTypes.default.func,
     "onReset": _propTypes.default.func,
     "onResetCapture": _propTypes.default.func,
+    "onResize": _propTypes.default.func,
+    "onResizeCapture": _propTypes.default.func,
     "onScroll": _propTypes.default.func,
     "onScrollCapture": _propTypes.default.func,
     "onSeeked": _propTypes.default.func,

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

@@ -37,7 +37,7 @@ export interface SidebarProps extends PaddingProps, Omit<TagProps, "data-compone
     /** Node that will be used as sidebar header. */
     header?: React.ReactNode;
     /** A custom close event handler */
-    onCancel?: (ev: React.KeyboardEvent<HTMLElement> | React.MouseEvent<HTMLElement>) => void;
+    onCancel?: (ev: React.KeyboardEvent<HTMLElement> | KeyboardEvent | React.MouseEvent<HTMLElement>) => void;
     /** Sets the open state of the modal */
     open: boolean;
     /** Sets the position of sidebar, either left or right. */

package/lib/components/simple-color-picker/simple-color-picker.component.js

@@ -41,13 +41,10 @@ const SimpleColorPicker = exports.SimpleColorPicker = /*#__PURE__*/_react.defaul
     ...rest
   } = props;
   const hasProperChildren = (0, _react.useMemo)(() => {
-    let hasSimpleColorChildren = true;
-    _react.default.Children.toArray(children).forEach(child => {
-      if (typeof child === "string" || /*#__PURE__*/_react.default.isValidElement(child) && child.type.displayName !== "SimpleColor") {
-        hasSimpleColorChildren = false;
-      }
+    const invalidChild = _react.default.Children.toArray(children).find(child => {
+      return typeof child === "string" || /*#__PURE__*/_react.default.isValidElement(child) && child.type.displayName !== "SimpleColor";
     });
-    return hasSimpleColorChildren;
+    return !invalidChild;
   }, [children]);
   !hasProperChildren ? process.env.NODE_ENV !== "production" ? (0, _invariant.default)(false, `SimpleColorPicker accepts only children of type \`${_simpleColor.default.displayName}\`.`) : (0, _invariant.default)(false) : void 0;
   const filteredChildren = (0, _react.useMemo)(() => _react.default.Children.toArray(children).filter(child => /*#__PURE__*/_react.default.isValidElement(child)), [children]);

package/lib/components/split-button/split-button.component.js

@@ -162,14 +162,18 @@ if (process.env.NODE_ENV !== "production") {
     "aria-activedescendant": _propTypes.default.string,
     "aria-atomic": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-autocomplete": _propTypes.default.oneOf(["both", "inline", "list", "none"]),
+    "aria-braillelabel": _propTypes.default.string,
+    "aria-brailleroledescription": _propTypes.default.string,
     "aria-busy": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-checked": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "mixed", "true"]), _propTypes.default.bool]),
     "aria-colcount": _propTypes.default.number,
     "aria-colindex": _propTypes.default.number,
+    "aria-colindextext": _propTypes.default.string,
     "aria-colspan": _propTypes.default.number,
     "aria-controls": _propTypes.default.string,
     "aria-current": _propTypes.default.oneOfType([_propTypes.default.oneOf(["date", "false", "location", "page", "step", "time", "true"]), _propTypes.default.bool]),
     "aria-describedby": _propTypes.default.string,
+    "aria-description": _propTypes.default.string,
     "aria-details": _propTypes.default.string,
     "aria-disabled": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-dropeffect": _propTypes.default.oneOf(["copy", "execute", "link", "move", "none", "popup"]),
@@ -199,6 +203,7 @@ if (process.env.NODE_ENV !== "production") {
     "aria-roledescription": _propTypes.default.string,
     "aria-rowcount": _propTypes.default.number,
     "aria-rowindex": _propTypes.default.number,
+    "aria-rowindextext": _propTypes.default.string,
     "aria-rowspan": _propTypes.default.number,
     "aria-selected": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-setsize": _propTypes.default.number,
@@ -266,7 +271,7 @@ if (process.env.NODE_ENV !== "production") {
     "className": _propTypes.default.string,
     "color": _propTypes.default.string,
     "content": _propTypes.default.string,
-    "contentEditable": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "inherit", "true"]), _propTypes.default.bool]),
+    "contentEditable": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "inherit", "plaintext-only", "true"]), _propTypes.default.bool]),
     "contextMenu": _propTypes.default.string,
     "dangerouslySetInnerHTML": _propTypes.default.shape({
       "__html": _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.string]).isRequired
@@ -566,9 +571,7 @@ if (process.env.NODE_ENV !== "production") {
     "onPointerDown": _propTypes.default.func,
     "onPointerDownCapture": _propTypes.default.func,
     "onPointerEnter": _propTypes.default.func,
-    "onPointerEnterCapture": _propTypes.default.func,
     "onPointerLeave": _propTypes.default.func,
-    "onPointerLeaveCapture": _propTypes.default.func,
     "onPointerMove": _propTypes.default.func,
     "onPointerMoveCapture": _propTypes.default.func,
     "onPointerOut": _propTypes.default.func,
@@ -583,6 +586,8 @@ if (process.env.NODE_ENV !== "production") {
     "onRateChangeCapture": _propTypes.default.func,
     "onReset": _propTypes.default.func,
     "onResetCapture": _propTypes.default.func,
+    "onResize": _propTypes.default.func,
+    "onResizeCapture": _propTypes.default.func,
     "onScroll": _propTypes.default.func,
     "onScrollCapture": _propTypes.default.func,
     "onSeeked": _propTypes.default.func,
@@ -615,7 +620,6 @@ if (process.env.NODE_ENV !== "production") {
     "onWaitingCapture": _propTypes.default.func,
     "onWheel": _propTypes.default.func,
     "onWheelCapture": _propTypes.default.func,
-    "placeholder": _propTypes.default.string,
     "position": _propTypes.default.oneOf(["left", "right"]),
     "prefix": _propTypes.default.string,
     "property": _propTypes.default.string,

package/lib/components/step-flow/step-flow.component.js

@@ -124,7 +124,6 @@ if (process.env.NODE_ENV !== "production") {
     "aria-label": _propTypes.default.string,
     "aria-labelledby": _propTypes.default.string,
     "category": _propTypes.default.string,
-    "children": _propTypes.default.node,
     "currentStep": _propTypes.default.oneOf([1, 2, 3, 4, 5, 6, 7, 8]).isRequired,
     "data-component": _propTypes.default.string,
     "data-element": _propTypes.default.string,

package/lib/components/switch/switch.component.js

@@ -255,14 +255,18 @@ if (process.env.NODE_ENV !== "production") {
     "aria-activedescendant": _propTypes.default.string,
     "aria-atomic": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-autocomplete": _propTypes.default.oneOf(["both", "inline", "list", "none"]),
+    "aria-braillelabel": _propTypes.default.string,
+    "aria-brailleroledescription": _propTypes.default.string,
     "aria-busy": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-checked": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "mixed", "true"]), _propTypes.default.bool]),
     "aria-colcount": _propTypes.default.number,
     "aria-colindex": _propTypes.default.number,
+    "aria-colindextext": _propTypes.default.string,
     "aria-colspan": _propTypes.default.number,
     "aria-controls": _propTypes.default.string,
     "aria-current": _propTypes.default.oneOfType([_propTypes.default.oneOf(["date", "false", "location", "page", "step", "time", "true"]), _propTypes.default.bool]),
     "aria-describedby": _propTypes.default.string,
+    "aria-description": _propTypes.default.string,
     "aria-details": _propTypes.default.string,
     "aria-disabled": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-dropeffect": _propTypes.default.oneOf(["copy", "execute", "link", "move", "none", "popup"]),
@@ -292,6 +296,7 @@ if (process.env.NODE_ENV !== "production") {
     "aria-roledescription": _propTypes.default.string,
     "aria-rowcount": _propTypes.default.number,
     "aria-rowindex": _propTypes.default.number,
+    "aria-rowindextext": _propTypes.default.string,
     "aria-rowspan": _propTypes.default.number,
     "aria-selected": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-setsize": _propTypes.default.number,
@@ -353,7 +358,7 @@ if (process.env.NODE_ENV !== "production") {
       "trimStart": _propTypes.default.func.isRequired,
       "valueOf": _propTypes.default.func.isRequired
     })]),
-    "autoComplete": _propTypes.default.string,
+    "autoComplete": _propTypes.default.any,
     "autoCorrect": _propTypes.default.string,
     "autoFocus": _propTypes.default.bool,
     "autoSave": _propTypes.default.string,
@@ -363,7 +368,7 @@ if (process.env.NODE_ENV !== "production") {
     "className": _propTypes.default.string,
     "color": _propTypes.default.string,
     "content": _propTypes.default.string,
-    "contentEditable": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "inherit", "true"]), _propTypes.default.bool]),
+    "contentEditable": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "inherit", "plaintext-only", "true"]), _propTypes.default.bool]),
     "contextMenu": _propTypes.default.string,
     "dangerouslySetInnerHTML": _propTypes.default.shape({
       "__html": _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.string]).isRequired
@@ -683,9 +688,7 @@ if (process.env.NODE_ENV !== "production") {
     "onPointerDown": _propTypes.default.func,
     "onPointerDownCapture": _propTypes.default.func,
     "onPointerEnter": _propTypes.default.func,
-    "onPointerEnterCapture": _propTypes.default.func,
     "onPointerLeave": _propTypes.default.func,
-    "onPointerLeaveCapture": _propTypes.default.func,
     "onPointerMove": _propTypes.default.func,
     "onPointerMoveCapture": _propTypes.default.func,
     "onPointerOut": _propTypes.default.func,
@@ -700,6 +703,8 @@ if (process.env.NODE_ENV !== "production") {
     "onRateChangeCapture": _propTypes.default.func,
     "onReset": _propTypes.default.func,
     "onResetCapture": _propTypes.default.func,
+    "onResize": _propTypes.default.func,
+    "onResizeCapture": _propTypes.default.func,
     "onScroll": _propTypes.default.func,
     "onScrollCapture": _propTypes.default.func,
     "onSeeked": _propTypes.default.func,

package/lib/components/tabs/__internal__/tab-title/tab-title.component.js

@@ -78,17 +78,8 @@ const TabTitle = /*#__PURE__*/_react.default.forwardRef(({
   };
   const handleClick = ev => {
     ev.preventDefault();
-    const customEvent = {
-      ...ev,
-      target: {
-        ...ev.target,
-        dataset: {
-          tabid: dataTabId
-        }
-      }
-    };
     if (href) {
-      onClick(customEvent);
+      onClick(ev);
       return window.open(href, "_blank");
     }
 
@@ -97,7 +88,7 @@ const TabTitle = /*#__PURE__*/_react.default.forwardRef(({
     if (typeof ref === "object") {
       ref?.current?.focus();
     }
-    return onClick(customEvent);
+    return onClick(ev);
   };
   const renderContent = () => {
     if (customLayout) {

package/lib/components/tabs/__internal__/tab-title/tab-title.style.js

@@ -341,7 +341,8 @@ const tabTitleStyles = (0, _styledComponents.css)`
         z-index: 6;
 
         > span[data-role="tab-title-content"] {
-          outline:none;
+          outline:none; 
+          ${position === "top" && "top: 2px;"}
         }
 
         ${position === "top" ? (0, _styledComponents.css)`

package/lib/components/tabs/tab/tab.component.d.ts

@@ -34,11 +34,11 @@ export interface TabProps extends PaddingProps {
     /** @private @ignore */
     ariaLabelledby?: string;
     /** @private @ignore */
-    updateErrors?: (id: string, errors: Record<string, string | boolean>) => void;
+    updateErrors?: (id: string, errors: Record<string, undefined | string | boolean>) => void;
     /** @private @ignore */
-    updateWarnings?: (id: string, warnings: Record<string, string | boolean>) => void;
+    updateWarnings?: (id: string, warnings: Record<string, undefined | string | boolean>) => void;
     /** @private @ignore */
-    updateInfos?: (id: string, infos: Record<string, string | boolean>) => void;
+    updateInfos?: (id: string, infos: Record<string, undefined | string | boolean>) => void;
 }
 export declare const Tab: ({ ariaLabelledby, children, isTabSelected, position, role, tabId, updateErrors, updateWarnings, updateInfos, href, title, titleProps, ...rest }: TabProps) => React.JSX.Element;
 export default Tab;

package/lib/components/tabs/tabs.component.js

@@ -113,18 +113,13 @@ const Tabs = ({
       previousSelectedTabId.current = selectedTabId;
     }
   }, [blurPreviousSelectedTab, previousSelectedTabId, selectedTabId, selectedTabIdState]);
-
-  /** Handles the changing of tabs with the mouse */
-  const handleTabClick = ev => {
+  const createTabClickHandler = tabId => ev => {
     // istanbul ignore if
     // (code doesn't seem to be ever reached - FE-6835 raised to investigate and hopefully remove this)
     if (_events.default.isEventType(ev, "keydown")) {
       return;
     }
-    const {
-      tabid
-    } = ev.target.dataset;
-    updateVisibleTab(tabid);
+    updateVisibleTab(tabId);
   };
 
   /** Focuses the tab for the reference specified */
@@ -156,21 +151,17 @@ const Tabs = ({
     const nextRef = tabRefs[newIndex];
     focusTab(nextRef);
   };
-
-  /** Handles the keyboard navigation of tabs */
-  const handleKeyDown = index => {
-    return event => {
-      const isTabVertical = isInSidebar || position === "left";
-      const isUp = isTabVertical && _events.default.isUpKey(event);
-      const isDown = isTabVertical && _events.default.isDownKey(event);
-      const isLeft = !isTabVertical && _events.default.isLeftKey(event);
-      const isRight = !isTabVertical && _events.default.isRightKey(event);
-      if (isUp || isLeft) {
-        goToTab(event, index - 1);
-      } else if (isDown || isRight) {
-        goToTab(event, index + 1);
-      }
-    };
+  const createTabKeydownHandler = index => event => {
+    const isTabVertical = isInSidebar || position === "left";
+    const isUp = isTabVertical && _events.default.isUpKey(event);
+    const isDown = isTabVertical && _events.default.isDownKey(event);
+    const isLeft = !isTabVertical && _events.default.isLeftKey(event);
+    const isRight = !isTabVertical && _events.default.isRightKey(event);
+    if (isUp || isLeft) {
+      goToTab(event, index - 1);
+    } else if (isDown || isRight) {
+      goToTab(event, index + 1);
+    }
   };
 
   /** Build the headers for the tab component */
@@ -214,12 +205,11 @@ const Tabs = ({
       };
       return /*#__PURE__*/_react.default.createElement(_tabTitle.default, _extends({}, titleProps, {
         position: isInSidebar ? "left" : position,
-        className: child.props.className || "",
         dataTabId: tabId,
         id: refId,
         key: tabId,
-        onClick: handleTabClick,
-        onKeyDown: handleKeyDown(index),
+        onClick: createTabClickHandler(tabId),
+        onKeyDown: createTabKeydownHandler(index),
         ref: tabRefs[index],
         tabIndex: isTabSelected(tabId) ? 0 : -1,
         title: title,

package/lib/components/text-editor/__internal__/editor-link/editor-link.style.d.ts

@@ -1,3 +1,3 @@
 /// <reference types="react" />
-declare const StyledEditorLink: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../../../link").LinkProps & import("react").RefAttributes<HTMLButtonElement | HTMLLinkElement>>, any, {}, never>;
+declare const StyledEditorLink: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../../../link").LinkProps & import("react").RefAttributes<HTMLAnchorElement | HTMLButtonElement>>, any, {}, never>;
 export default StyledEditorLink;

package/lib/components/textarea/textarea.component.js

@@ -277,14 +277,18 @@ if (process.env.NODE_ENV !== "production") {
     "aria-activedescendant": _propTypes.default.string,
     "aria-atomic": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-autocomplete": _propTypes.default.oneOf(["both", "inline", "list", "none"]),
+    "aria-braillelabel": _propTypes.default.string,
+    "aria-brailleroledescription": _propTypes.default.string,
     "aria-busy": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-checked": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "mixed", "true"]), _propTypes.default.bool]),
     "aria-colcount": _propTypes.default.number,
     "aria-colindex": _propTypes.default.number,
+    "aria-colindextext": _propTypes.default.string,
     "aria-colspan": _propTypes.default.number,
     "aria-controls": _propTypes.default.string,
     "aria-current": _propTypes.default.oneOfType([_propTypes.default.oneOf(["date", "false", "location", "page", "step", "time", "true"]), _propTypes.default.bool]),
     "aria-describedby": _propTypes.default.string,
+    "aria-description": _propTypes.default.string,
     "aria-details": _propTypes.default.string,
     "aria-disabled": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-dropeffect": _propTypes.default.oneOf(["copy", "execute", "link", "move", "none", "popup"]),
@@ -314,6 +318,7 @@ if (process.env.NODE_ENV !== "production") {
     "aria-roledescription": _propTypes.default.string,
     "aria-rowcount": _propTypes.default.number,
     "aria-rowindex": _propTypes.default.number,
+    "aria-rowindextext": _propTypes.default.string,
     "aria-rowspan": _propTypes.default.number,
     "aria-selected": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-setsize": _propTypes.default.number,
@@ -375,7 +380,7 @@ if (process.env.NODE_ENV !== "production") {
       "trimStart": _propTypes.default.func.isRequired,
       "valueOf": _propTypes.default.func.isRequired
     })]),
-    "autoComplete": _propTypes.default.string,
+    "autoComplete": _propTypes.default.any,
     "autoCorrect": _propTypes.default.string,
     "autoFocus": _propTypes.default.bool,
     "autoSave": _propTypes.default.string,
@@ -387,7 +392,7 @@ if (process.env.NODE_ENV !== "production") {
     "className": _propTypes.default.string,
     "color": _propTypes.default.string,
     "content": _propTypes.default.string,
-    "contentEditable": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "inherit", "true"]), _propTypes.default.bool]),
+    "contentEditable": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "inherit", "plaintext-only", "true"]), _propTypes.default.bool]),
     "contextMenu": _propTypes.default.string,
     "dangerouslySetInnerHTML": _propTypes.default.shape({
       "__html": _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.string]).isRequired
@@ -712,9 +717,7 @@ if (process.env.NODE_ENV !== "production") {
     "onPointerDown": _propTypes.default.func,
     "onPointerDownCapture": _propTypes.default.func,
     "onPointerEnter": _propTypes.default.func,
-    "onPointerEnterCapture": _propTypes.default.func,
     "onPointerLeave": _propTypes.default.func,
-    "onPointerLeaveCapture": _propTypes.default.func,
     "onPointerMove": _propTypes.default.func,
     "onPointerMoveCapture": _propTypes.default.func,
     "onPointerOut": _propTypes.default.func,
@@ -729,6 +732,8 @@ if (process.env.NODE_ENV !== "production") {
     "onRateChangeCapture": _propTypes.default.func,
     "onReset": _propTypes.default.func,
     "onResetCapture": _propTypes.default.func,
+    "onResize": _propTypes.default.func,
+    "onResizeCapture": _propTypes.default.func,
     "onScroll": _propTypes.default.func,
     "onScrollCapture": _propTypes.default.func,
     "onSeeked": _propTypes.default.func,

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

@@ -240,14 +240,18 @@ if (process.env.NODE_ENV !== "production") {
     "aria-activedescendant": _propTypes.default.string,
     "aria-atomic": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-autocomplete": _propTypes.default.oneOf(["both", "inline", "list", "none"]),
+    "aria-braillelabel": _propTypes.default.string,
+    "aria-brailleroledescription": _propTypes.default.string,
     "aria-busy": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-checked": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "mixed", "true"]), _propTypes.default.bool]),
     "aria-colcount": _propTypes.default.number,
     "aria-colindex": _propTypes.default.number,
+    "aria-colindextext": _propTypes.default.string,
     "aria-colspan": _propTypes.default.number,
     "aria-controls": _propTypes.default.string,
     "aria-current": _propTypes.default.oneOfType([_propTypes.default.oneOf(["date", "false", "location", "page", "step", "time", "true"]), _propTypes.default.bool]),
     "aria-describedby": _propTypes.default.string,
+    "aria-description": _propTypes.default.string,
     "aria-details": _propTypes.default.string,
     "aria-disabled": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-dropeffect": _propTypes.default.oneOf(["copy", "execute", "link", "move", "none", "popup"]),
@@ -277,6 +281,7 @@ if (process.env.NODE_ENV !== "production") {
     "aria-roledescription": _propTypes.default.string,
     "aria-rowcount": _propTypes.default.number,
     "aria-rowindex": _propTypes.default.number,
+    "aria-rowindextext": _propTypes.default.string,
     "aria-rowspan": _propTypes.default.number,
     "aria-selected": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "true"]), _propTypes.default.bool]),
     "aria-setsize": _propTypes.default.number,
@@ -338,7 +343,7 @@ if (process.env.NODE_ENV !== "production") {
       "trimStart": _propTypes.default.func.isRequired,
       "valueOf": _propTypes.default.func.isRequired
     })]),
-    "autoComplete": _propTypes.default.string,
+    "autoComplete": _propTypes.default.any,
     "autoCorrect": _propTypes.default.string,
     "autoFocus": _propTypes.default.bool,
     "autoSave": _propTypes.default.string,
@@ -349,7 +354,7 @@ if (process.env.NODE_ENV !== "production") {
     "className": _propTypes.default.string,
     "color": _propTypes.default.string,
     "content": _propTypes.default.string,
-    "contentEditable": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "inherit", "true"]), _propTypes.default.bool]),
+    "contentEditable": _propTypes.default.oneOfType([_propTypes.default.oneOf(["false", "inherit", "plaintext-only", "true"]), _propTypes.default.bool]),
     "contextMenu": _propTypes.default.string,
     "dangerouslySetInnerHTML": _propTypes.default.shape({
       "__html": _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.string]).isRequired
@@ -677,9 +682,7 @@ if (process.env.NODE_ENV !== "production") {
     "onPointerDown": _propTypes.default.func,
     "onPointerDownCapture": _propTypes.default.func,
     "onPointerEnter": _propTypes.default.func,
-    "onPointerEnterCapture": _propTypes.default.func,
     "onPointerLeave": _propTypes.default.func,
-    "onPointerLeaveCapture": _propTypes.default.func,
     "onPointerMove": _propTypes.default.func,
     "onPointerMoveCapture": _propTypes.default.func,
     "onPointerOut": _propTypes.default.func,
@@ -694,6 +697,8 @@ if (process.env.NODE_ENV !== "production") {
     "onRateChangeCapture": _propTypes.default.func,
     "onReset": _propTypes.default.func,
     "onResetCapture": _propTypes.default.func,
+    "onResize": _propTypes.default.func,
+    "onResizeCapture": _propTypes.default.func,
     "onScroll": _propTypes.default.func,
     "onScrollCapture": _propTypes.default.func,
     "onSeeked": _propTypes.default.func,

package/lib/components/tile/flex-tile-cell/flex-tile-cell.component.js

@@ -335,7 +335,7 @@ if (process.env.NODE_ENV !== "production") {
       "valueOf": _propTypes.default.func.isRequired
     })]),
     "aria-hidden": _propTypes.default.oneOf(["false", "true"]),
-    "as": _propTypes.default.oneOfType([_propTypes.default.oneOf(["a", "abbr", "address", "animate", "animateMotion", "animateTransform", "area", "article", "aside", "audio", "b", "base", "bdi", "bdo", "big", "blockquote", "body", "br", "button", "canvas", "caption", "circle", "cite", "clipPath", "code", "col", "colgroup", "data", "datalist", "dd", "defs", "del", "desc", "details", "dfn", "dialog", "div", "dl", "dt", "ellipse", "em", "embed", "feBlend", "feColorMatrix", "feComponentTransfer", "feComposite", "feConvolveMatrix", "feDiffuseLighting", "feDisplacementMap", "feDistantLight", "feDropShadow", "feFlood", "feFuncA", "feFuncB", "feFuncG", "feFuncR", "feGaussianBlur", "feImage", "feMerge", "feMergeNode", "feMorphology", "feOffset", "fePointLight", "feSpecularLighting", "feSpotLight", "feTile", "feTurbulence", "fieldset", "figcaption", "figure", "filter", "footer", "foreignObject", "form", "g", "h1", "h2", "h3", "h4", "h5", "h6", "head", "header", "hgroup", "hr", "html", "i", "iframe", "image", "img", "input", "ins", "kbd", "keygen", "label", "legend", "li", "line", "linearGradient", "link", "main", "map", "mark", "marker", "mask", "menu", "menuitem", "meta", "metadata", "meter", "mpath", "nav", "noindex", "noscript", "object", "ol", "optgroup", "option", "output", "p", "param", "path", "pattern", "picture", "polygon", "polyline", "pre", "progress", "q", "radialGradient", "rect", "rp", "rt", "ruby", "s", "samp", "script", "section", "select", "slot", "small", "source", "span", "stop", "strong", "style", "sub", "summary", "sup", "svg", "switch", "symbol", "table", "tbody", "td", "template", "text", "textarea", "textPath", "tfoot", "th", "thead", "time", "title", "tr", "track", "tspan", "u", "ul", "use", "var", "video", "view", "wbr", "webview"]), _propTypes.default.func, _propTypes.default.shape({
+    "as": _propTypes.default.oneOfType([_propTypes.default.oneOf(["a", "abbr", "address", "animate", "animateMotion", "animateTransform", "area", "article", "aside", "audio", "b", "base", "bdi", "bdo", "big", "blockquote", "body", "br", "button", "canvas", "caption", "center", "circle", "cite", "clipPath", "code", "col", "colgroup", "data", "datalist", "dd", "defs", "del", "desc", "details", "dfn", "dialog", "div", "dl", "dt", "ellipse", "em", "embed", "feBlend", "feColorMatrix", "feComponentTransfer", "feComposite", "feConvolveMatrix", "feDiffuseLighting", "feDisplacementMap", "feDistantLight", "feDropShadow", "feFlood", "feFuncA", "feFuncB", "feFuncG", "feFuncR", "feGaussianBlur", "feImage", "feMerge", "feMergeNode", "feMorphology", "feOffset", "fePointLight", "feSpecularLighting", "feSpotLight", "feTile", "feTurbulence", "fieldset", "figcaption", "figure", "filter", "footer", "foreignObject", "form", "g", "h1", "h2", "h3", "h4", "h5", "h6", "head", "header", "hgroup", "hr", "html", "i", "iframe", "image", "img", "input", "ins", "kbd", "keygen", "label", "legend", "li", "line", "linearGradient", "link", "main", "map", "mark", "marker", "mask", "menu", "menuitem", "meta", "metadata", "meter", "mpath", "nav", "noindex", "noscript", "object", "ol", "optgroup", "option", "output", "p", "param", "path", "pattern", "picture", "polygon", "polyline", "pre", "progress", "q", "radialGradient", "rect", "rp", "rt", "ruby", "s", "samp", "script", "search", "section", "select", "set", "slot", "small", "source", "span", "stop", "strong", "style", "sub", "summary", "sup", "svg", "switch", "symbol", "table", "tbody", "td", "template", "text", "textarea", "textPath", "tfoot", "th", "thead", "time", "title", "tr", "track", "tspan", "u", "ul", "use", "var", "video", "view", "wbr", "webview"]), _propTypes.default.func, _propTypes.default.shape({
       "childContextTypes": _propTypes.default.object,
       "contextType": _propTypes.default.shape({
         "Consumer": _propTypes.default.func.isRequired,

package/lib/components/tile/flex-tile-divider/flex-tile-divider.component.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 export declare const FlexTileDivider: () => JSX.Element;
 export default FlexTileDivider;

package/lib/components/time/time.component.js

@@ -256,7 +256,6 @@ const Time = /*#__PURE__*/_react.default.forwardRef(({
 });
 if (process.env.NODE_ENV !== "production") {
   Time.propTypes = {
-    "children": _propTypes.default.node,
     "data-element": _propTypes.default.string,
     "data-role": _propTypes.default.string,
     "disabled": _propTypes.default.bool,

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

@@ -2,8 +2,8 @@
 import TypeIcon from "../message/__internal__/type-icon/type-icon.style";
 import { MessageVariant } from "../message/message.component";
 declare const StyledPortal: import("styled-components").StyledComponent<({ children, className, id, onReposition, inertOptOut, }: import("../portal/portal").PortalProps) => import("react").JSX.Element, any, {
-    align?: "left" | "right" | "center" | undefined;
-    alignY?: "top" | "bottom" | "center" | undefined;
+    align?: "center" | "left" | "right" | undefined;
+    alignY?: "center" | "top" | "bottom" | undefined;
     isNotice?: boolean | undefined;
 }, never>;
 declare type ToastVariants = MessageVariant;
@@ -21,7 +21,7 @@ declare const StyledToastContent: import("styled-components").StyledComponent<"d
     isDismiss?: boolean | undefined;
 }, never>;
 declare const ToastWrapper: import("styled-components").StyledComponent<"div", any, {
-    align?: "left" | "right" | "center" | undefined;
+    align?: "center" | "left" | "right" | undefined;
     isNotice?: boolean | undefined;
 }, never>;
 export { StyledPortal, StyledToast, TypeIcon, StyledToastContent, ToastWrapper, };

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

@@ -1,12 +1,12 @@
 /// <reference types="react" />
 import { TypographyProps } from "./typography.component";
 declare const StyledTypography: import("styled-components").StyledComponent<"span", any, {
-    as: import("react").ElementType<any> | undefined;
+    as: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
     size: string;
     weight: string;
     textTransform: string;
     textDecoration: string;
     lineHeight: string;
     defaultMargin: string;
-} & TypographyProps, "as" | "textDecoration" | "size" | "weight" | "textTransform" | "lineHeight" | "defaultMargin">;
+} & TypographyProps, "textDecoration" | "size" | "as" | "weight" | "textTransform" | "lineHeight" | "defaultMargin">;
 export default StyledTypography;

package/lib/components/vertical-divider/vertical-divider.component.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { SpaceProps } from "styled-system";
 declare type TintRange = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100;
 export interface VerticalDividerProps extends SpaceProps {

package/lib/components/vertical-menu/vertical-menu-full-screen/vertical-menu-full-screen.component.d.ts

@@ -10,7 +10,7 @@ export interface VerticalMenuFullScreenProps extends TagProps {
     /** Whether the menu is open or not */
     isOpen: boolean;
     /** A callback to be called when the close icon is clicked or enter is pressed when focused */
-    onClose: (ev: React.KeyboardEvent<HTMLButtonElement> | React.MouseEvent<HTMLButtonElement>) => void;
+    onClose: (ev: React.KeyboardEvent<HTMLButtonElement> | React.MouseEvent<HTMLButtonElement> | KeyboardEvent) => void;
 }
 export declare const VerticalMenuFullScreen: ({ "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, children, isOpen, onClose, ...rest }: VerticalMenuFullScreenProps) => React.JSX.Element | null;
 export default VerticalMenuFullScreen;

package/lib/components/vertical-menu/vertical-menu-full-screen/vertical-menu-full-screen.component.js

@@ -55,8 +55,7 @@ const VerticalMenuFullScreen = ({
     scrollVariant: "light",
     as: "nav",
     "aria-label": ariaLabel,
-    "aria-labelledby": ariaLabelledBy,
-    onKeyDown: handleKeyDown
+    "aria-labelledby": ariaLabelledBy
   }, (0, _tags.default)("vertical-menu-full-screen", rest)), /*#__PURE__*/_react.default.createElement(_box.default, {
     display: "flex",
     justifyContent: "flex-end",