carbon-react 150.1.0 → 151.1.0

package/lib/components/action-popover/action-popover-item/action-popover-item.component.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = exports.ActionPopoverItem = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _invariant = _interopRequireDefault(require("invariant"));
 var _actionPopover = require("../action-popover.style");
 var _events = _interopRequireDefault(require("../../../__internal__/utils/helpers/events"));

package/lib/components/action-popover/action-popover-menu/action-popover-menu.component.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _invariant = _interopRequireDefault(require("invariant"));
 var _actionPopover = require("../action-popover.style");
 var _events = _interopRequireDefault(require("../../../__internal__/utils/helpers/events"));
@@ -146,27 +145,5 @@ const ActionPopoverMenu = /*#__PURE__*/_react.default.forwardRef(({
     role: "list"
   }, rest), clonedChildren);
 });
-if (process.env.NODE_ENV !== "production") {
-  ActionPopoverMenu.propTypes = {
-    "children": _propTypes.default.node,
-    "data-element": _propTypes.default.string,
-    "focusIndex": _propTypes.default.number,
-    "horizontalAlignment": _propTypes.default.oneOf(["left", "right"]),
-    "isASubmenu": _propTypes.default.bool,
-    "isOpen": _propTypes.default.bool,
-    "menuID": _propTypes.default.string,
-    "parentID": _propTypes.default.string,
-    "placement": _propTypes.default.oneOf(["bottom", "top"]),
-    "role": _propTypes.default.string,
-    "setFocusIndex": _propTypes.default.func,
-    "setOpen": _propTypes.default.func,
-    "style": _propTypes.default.shape({
-      "bottom": _propTypes.default.string,
-      "left": _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
-      "right": _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
-      "top": _propTypes.default.string
-    })
-  };
-}
 ActionPopoverMenu.displayName = "ActionPopoverMenu";
 var _default = exports.default = ActionPopoverMenu;

package/lib/components/action-popover/action-popover-menu-button/action-popover-menu-button.component.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = exports.ActionPopoverMenuButton = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _actionPopover = require("../action-popover.style");
 var _button = _interopRequireDefault(require("../../button"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }

package/lib/components/action-popover/action-popover.component.d.ts

@@ -1,5 +1,6 @@
 import React from "react";
 import { MarginProps } from "styled-system";
+import { TagProps } from "../../__internal__/utils/helpers/tags";
 import { Alignment } from "./__internal__/action-popover.context";
 export interface RenderButtonProps {
     tabIndex: number;
@@ -13,7 +14,7 @@ export interface RenderButtonProps {
         "aria-expanded": string;
     };
 }
-export interface ActionPopoverProps extends MarginProps {
+export interface ActionPopoverProps extends MarginProps, TagProps {
     /** Children for popover component */
     children?: React.ReactNode;
     /** Horizontal alignment of menu items content */

package/lib/components/action-popover/action-popover.component.js

@@ -5,8 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = exports.ActionPopover = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _invariant = _interopRequireDefault(require("invariant"));
+var _tags = _interopRequireDefault(require("../../__internal__/utils/helpers/tags"));
 var _actionPopover = require("./action-popover.style");
 var _events = _interopRequireDefault(require("../../__internal__/utils/helpers/events"));
 var _popover = _interopRequireDefault(require("../../__internal__/popover"));
@@ -209,13 +209,11 @@ const ActionPopover = exports.ActionPopover = /*#__PURE__*/(0, _react.forwardRef
   };
   return /*#__PURE__*/_react.default.createElement(_actionPopover.MenuButton, _extends({
     id: parentID,
-    "data-component": "action-popover-wrapper",
-    "data-role": "action-popover-wrapper",
     onKeyDown: onButtonKeyDown,
     onClick: onButtonClick,
     isOpen,
     ref: buttonRef
-  }, rest), menuButton(menuID), /*#__PURE__*/_react.default.createElement(_actionPopover2.default.Provider, {
+  }, rest, (0, _tags.default)("action-popover-wrapper", rest)), menuButton(menuID), /*#__PURE__*/_react.default.createElement(_actionPopover2.default.Provider, {
     value: {
       setOpenPopover: setOpen,
       focusButton,
@@ -230,174 +228,4 @@ const ActionPopover = exports.ActionPopover = /*#__PURE__*/(0, _react.forwardRef
     ref: menu
   }, menuProps), children))));
 });
-if (process.env.NODE_ENV !== "production") {
-  ActionPopover.propTypes = {
-    "aria-describedby": _propTypes.default.string,
-    "aria-label": _propTypes.default.string,
-    "aria-labelledby": _propTypes.default.string,
-    "children": _propTypes.default.node,
-    "horizontalAlignment": _propTypes.default.oneOf(["left", "right"]),
-    "id": _propTypes.default.string,
-    "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]),
-    "onClose": _propTypes.default.func,
-    "onOpen": _propTypes.default.func,
-    "placement": _propTypes.default.oneOf(["bottom", "top"]),
-    "renderButton": _propTypes.default.func,
-    "rightAlignMenu": _propTypes.default.bool,
-    "submenuPosition": _propTypes.default.oneOf(["left", "right"])
-  };
-}
 var _default = exports.default = ActionPopover;

package/lib/components/advanced-color-picker/advanced-color-picker.component.d.ts

@@ -1,11 +1,12 @@
 import React from "react";
 import { MarginProps } from "styled-system";
 import { ModalProps } from "../modal";
+import { TagProps } from "../../__internal__/utils/helpers/tags";
 export interface AdvancedColor {
     label: string;
     value: string;
 }
-export interface AdvancedColorPickerProps extends MarginProps, Pick<ModalProps, "restoreFocusOnClose"> {
+export interface AdvancedColorPickerProps extends MarginProps, Pick<ModalProps, "restoreFocusOnClose">, TagProps {
     /** Prop to specify the aria-describedby property of the component */
     "aria-describedby"?: string;
     /**
@@ -14,7 +15,7 @@ export interface AdvancedColorPickerProps extends MarginProps, Pick<ModalProps,
      */
     "aria-label"?: string;
     /**
-     * Prop to specify the aria-labeledby property of the component
+     * Prop to specify the aria-labelledby 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.
      */

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

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = exports.AdvancedColorPicker = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _advancedColorPicker = require("./advanced-color-picker.style");
 var _simpleColorPicker = require("../simple-color-picker");
 var _events = _interopRequireDefault(require("../../__internal__/utils/helpers/events"));
@@ -14,6 +13,7 @@ var _guid = _interopRequireDefault(require("../../__internal__/utils/helpers/gui
 var _useLocale = _interopRequireDefault(require("../../hooks/__internal__/useLocale"));
 var _definitionList = require("../definition-list");
 var _logger = _interopRequireDefault(require("../../__internal__/utils/logger"));
+var _tags = _interopRequireDefault(require("../../__internal__/utils/helpers/tags"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -130,9 +130,7 @@ const AdvancedColorPicker = ({
   }
   return /*#__PURE__*/_react.default.createElement(_advancedColorPicker.StyledAdvancedColorPickerWrapper, _extends({
     m: "15px auto auto 15px"
-  }, (0, _utils.filterStyledSystemMarginProps)(props), {
-    "data-role": "advanced-color-picker-wrapper"
-  }), /*#__PURE__*/_react.default.createElement(_advancedColorPicker.StyledAdvancedColorPickerCell, {
+  }, (0, _utils.filterStyledSystemMarginProps)(props), (0, _tags.default)("advanced-color-picker", props)), /*#__PURE__*/_react.default.createElement(_advancedColorPicker.StyledAdvancedColorPickerCell, {
     "data-element": "color-picker-cell",
     "aria-label": l.advancedColorPicker.ariaLabel(),
     "aria-describedby": descriptionId.current,

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

@@ -1,4 +1,4 @@
 import React from "react";
 import { DialogProps } from "../dialog";
-export declare const Alert: ({ children, size, topModalOverride, closeButtonDataProps, ...rest }: DialogProps) => React.JSX.Element;
+export declare const Alert: ({ children, size, topModalOverride, closeButtonDataProps, ...rest }: Omit<DialogProps, "data-component">) => React.JSX.Element;
 export default Alert;

package/lib/components/alert/alert.component.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = exports.Alert = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _dialog = _interopRequireDefault(require("../dialog"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
@@ -16,11 +15,12 @@ const Alert = ({
   closeButtonDataProps,
   ...rest
 }) => /*#__PURE__*/_react.default.createElement(_dialog.default, _extends({
-  "data-component": "alert",
   role: "alertdialog",
   size: size,
   topModalOverride: topModalOverride,
   closeButtonDataProps: closeButtonDataProps
-}, rest), children);
+}, rest, {
+  "data-component": "alert"
+}), children);
 exports.Alert = Alert;
 var _default = exports.default = Alert;

package/lib/components/anchor-navigation/anchor-navigation-item/anchor-navigation-item.component.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _anchorNavigationItem = _interopRequireDefault(require("./anchor-navigation-item.style"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const AnchorNavigationItem = /*#__PURE__*/_react.default.forwardRef(({
@@ -25,24 +24,5 @@ const AnchorNavigationItem = /*#__PURE__*/_react.default.forwardRef(({
   href: href,
   "data-element": "anchor-navigation-item"
 }, children)));
-if (process.env.NODE_ENV !== "production") {
-  AnchorNavigationItem.propTypes = {
-    "children": _propTypes.default.node,
-    "href": _propTypes.default.string,
-    "isSelected": _propTypes.default.bool,
-    "onClick": _propTypes.default.func,
-    "onKeyDown": _propTypes.default.func,
-    "tabIndex": _propTypes.default.number,
-    "target": _propTypes.default.shape({
-      "current": _propTypes.default.oneOfType([_propTypes.default.oneOf([null]), function (props, propName) {
-        if (props[propName] == null) {
-          return new Error("Prop '" + propName + "' is required but wasn't specified");
-        } else if (typeof props[propName] !== 'object' || props[propName].nodeType !== 1) {
-          return new Error("Expected prop '" + propName + "' to be of type Element");
-        }
-      }]).isRequired
-    })
-  };
-}
 AnchorNavigationItem.displayName = "AnchorNavigationItem";
 var _default = exports.default = AnchorNavigationItem;

package/lib/components/anchor-navigation/anchor-navigation.component.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 import { TagProps } from "../../__internal__/utils/helpers/tags";
-export interface AnchorNavigationProps extends Omit<TagProps, "data-component"> {
+export interface AnchorNavigationProps extends TagProps {
     /** Child elements */
     children?: React.ReactNode;
     /** The AnchorNavigationItems components to be rendered in the sticky navigation.

package/lib/components/anchor-navigation/anchor-navigation.component.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _reactIs = require("react-is");
 var _invariant = _interopRequireDefault(require("invariant"));
 var _throttle = _interopRequireDefault(require("lodash/throttle"));
@@ -132,13 +131,5 @@ const AnchorNavigation = ({
     onKeyDown: event => handleKeyDown(event, index)
   }))), /*#__PURE__*/_react.default.createElement(_anchorNavigation.StyledContent, null, children));
 };
-if (process.env.NODE_ENV !== "production") {
-  AnchorNavigation.propTypes = {
-    "children": _propTypes.default.node,
-    "data-element": _propTypes.default.string,
-    "data-role": _propTypes.default.string,
-    "stickyNavigation": _propTypes.default.node
-  };
-}
 AnchorNavigation.displayName = "AnchorNavigation";
 var _default = exports.default = AnchorNavigation;

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

@@ -1,5 +1,6 @@
 import React from "react";
-export interface BadgeProps {
+import { TagProps } from "../../__internal__/utils/helpers/tags";
+export interface BadgeProps extends TagProps {
     /** Prop to specify an aria-label for the component */
     "aria-label"?: string;
     /** The badge will be added to this element */
@@ -11,5 +12,5 @@ export interface BadgeProps {
     /** Callback fired when badge is clicked */
     onClick?: (ev: React.MouseEvent<HTMLElement>) => void;
 }
-export declare const Badge: ({ "aria-label": ariaLabel, children, counter, color, onClick, }: BadgeProps) => React.JSX.Element;
+export declare const Badge: ({ "aria-label": ariaLabel, children, counter, color, onClick, "data-element": dataElement, "data-role": dataRole, }: BadgeProps) => React.JSX.Element;
 export default Badge;

package/lib/components/badge/badge.component.js

@@ -5,9 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = exports.Badge = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _badge = require("./badge.style");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
@@ -16,7 +14,9 @@ const Badge = ({
   children,
   counter = 0,
   color = "--colorsActionMajor500",
-  onClick
+  onClick,
+  "data-element": dataElement,
+  "data-role": dataRole
 }) => {
   const shouldDisplayCounter = +counter > 0;
   const counterToDisplay = +counter > 99 ? 99 : counter;
@@ -31,8 +31,9 @@ const Badge = ({
     };
     if (shouldDisplayCounter) {
       return /*#__PURE__*/_react.default.createElement(_badge.StyledBadge, _extends({
-        "data-role": "badge",
         "data-component": "badge",
+        "data-element": dataElement,
+        "data-role": dataRole,
         color: color
       }, props, {
         onFocus: () => {

package/lib/components/batch-selection/batch-selection.component.d.ts

@@ -1,5 +1,6 @@
 import React from "react";
-export interface BatchSelectionProps {
+import { TagProps } from "../../__internal__/utils/helpers/tags";
+export interface BatchSelectionProps extends TagProps {
     /** Content to be rendered after selected count */
     children: React.ReactNode;
     /** Color of the background, transparent if not defined */
@@ -11,5 +12,5 @@ export interface BatchSelectionProps {
     /** Number of selected elements */
     selectedCount: number;
 }
-export declare const BatchSelection: ({ disabled, children, colorTheme, selectedCount, hidden, }: BatchSelectionProps) => React.JSX.Element;
+export declare const BatchSelection: ({ disabled, children, colorTheme, selectedCount, hidden, "data-element": dataElement, "data-role": dataRole, }: BatchSelectionProps) => React.JSX.Element;
 export default BatchSelection;

package/lib/components/batch-selection/batch-selection.component.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = exports.BatchSelection = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _useLocale = _interopRequireDefault(require("../../hooks/__internal__/useLocale"));
 var _batchSelection = require("./batch-selection.style");
 var _batchSelection2 = _interopRequireDefault(require("./__internal__/batch-selection.context"));
@@ -15,13 +14,16 @@ const BatchSelection = ({
   children,
   colorTheme = "transparent",
   selectedCount,
-  hidden
+  hidden,
+  "data-element": dataElement,
+  "data-role": dataRole
 }) => {
   const l = (0, _useLocale.default)();
   return /*#__PURE__*/_react.default.createElement(_batchSelection.StyledBatchSelection, {
     colorTheme: colorTheme,
     "data-component": "batch-selection",
-    "data-role": "batch-selection",
+    "data-element": dataElement,
+    "data-role": dataRole,
     disabled: disabled,
     hidden: hidden
   }, /*#__PURE__*/_react.default.createElement(_batchSelection.StyledSelectionCount, {

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

@@ -49,6 +49,8 @@ export interface BoxProps extends FlexboxProps, Omit<GridProps, "gridGap" | "gri
     opacity?: string | number;
     /** Set the container to be hidden from screen readers */
     "aria-hidden"?: "true" | "false";
+    /** @private @internal @ignore */
+    "data-component"?: string;
 }
 export declare const Box: React.ForwardRefExoticComponent<BoxProps & React.RefAttributes<HTMLDivElement>>;
 export default Box;