carbon-react 106.1.4 → 106.1.5

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

@@ -11,28 +11,45 @@ declare function ActionPopover({ children, id, onOpen, onClose, rightAlignMenu,
     horizontalAlignment: any;
 }): JSX.Element;
 declare namespace ActionPopover {
-    namespace propTypes {
-        const id: PropTypes.Requireable<string>;
-        const onOpen: PropTypes.Requireable<(...args: any[]) => any>;
-        const onClose: PropTypes.Requireable<(...args: any[]) => any>;
-        const rightAlignMenu: PropTypes.Requireable<boolean>;
+    const propTypes: {
+        /** Unique ID */
+        id: PropTypes.Requireable<string>;
+        /** Callback to be called on menu open */
+        onOpen: PropTypes.Requireable<(...args: any[]) => any>;
+        /** Callback to be called on menu close */
+        onClose: PropTypes.Requireable<(...args: any[]) => any>;
+        /** Boolean to control whether menu should align to right */
+        rightAlignMenu: PropTypes.Requireable<boolean>;
         /** Children for popover component */
-        function children(props: any, propName: any, componentName: any): undefined;
-        /** Children for popover component */
-        function children(props: any, propName: any, componentName: any): undefined;
-        const renderButton: PropTypes.Requireable<(...args: any[]) => any>;
-        const horizontalAlignment: PropTypes.Requireable<string>;
-        const placement: PropTypes.Requireable<string>;
-    }
+        children(props: any, propName: any, componentName: any): undefined;
+        /** Render a custom menu button to override default ellipsis icon */
+        renderButton: PropTypes.Requireable<(...args: any[]) => any>;
+        /** Horizontal alignment of menu items content */
+        horizontalAlignment: PropTypes.Requireable<string>;
+        /** Set whether the menu should open above or below the button */
+        placement: PropTypes.Requireable<string>;
+        marginBottom?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        margin?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        m?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginLeft?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        ml?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginRight?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mr?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginTop?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mt?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mb?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginX?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mx?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginY?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        my?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+    };
     namespace defaultProps {
-        const id_1: null;
-        export { id_1 as id };
+        export const id: null;
         export { onOpen };
         export { onClose };
-        const horizontalAlignment_1: string;
-        export { horizontalAlignment_1 as horizontalAlignment };
+        export const horizontalAlignment: string;
     }
 }
 import PropTypes from "prop-types";
-declare function onOpen_1(): void;
-declare function onClose_1(): void;
+declare function onOpen(): void;
+declare function onClose(): void;

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

@@ -50,6 +50,20 @@ declare namespace AdvancedColorPicker {
         onBlur: PropTypes.Requireable<(...args: any[]) => any>;
         /** The ARIA role to be applied to the container */
         role: PropTypes.Requireable<string>;
+        marginBottom?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        margin?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        m?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginLeft?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        ml?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginRight?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mr?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginTop?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mt?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mb?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginX?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mx?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginY?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        my?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
     };
 }
 import PropTypes from "prop-types";

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

@@ -1,7 +1,2 @@
 export default Box;
-declare const Box: import("styled-components").StyledComponent<"div", any, {
-    [x: string]: any;
-    color: any;
-    bg: any;
-    backgroundColor: any;
-}, never>;
+declare const Box: import("styled-components").StyledComponent<"div", any, {}, never>;

package/lib/components/button-toggle-group/button-toggle-group.component.d.ts

@@ -76,6 +76,20 @@ declare namespace ButtonToggleGroup {
         value: PropTypes.Requireable<string>;
         /** Aria label for rendered help component */
         helpAriaLabel: PropTypes.Requireable<string>;
+        marginBottom?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        margin?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        m?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginLeft?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        ml?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginRight?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mr?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginTop?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mt?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mb?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginX?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mx?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginY?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        my?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
     };
     const defaultProps: {
         validationOnLabel: boolean;

package/lib/components/button-toggle-group/button-toggle-group.d.ts

@@ -2,7 +2,7 @@ import * as React from "react";
 import { MarginProps } from "styled-system";
 
 import { ButtonToggleProps } from "../button-toggle";
-import { ValidationPropTypes } from "../../__internal__/validations";
+import { ValidationProps } from "../../__internal__/validations";
 
 type ButtonToggle =
   | React.ReactElement<ButtonToggleProps>
@@ -10,9 +10,7 @@ type ButtonToggle =
   | null
   | undefined;
 
-export interface ButtonToggleGroupProps
-  extends ValidationPropTypes,
-    MarginProps {
+export interface ButtonToggleGroupProps extends ValidationProps, MarginProps {
   /** Identifier used for testing purposes, applied to the root element of the component. */
   "data-component"?: string;
   /** Identifier used for testing purposes, applied to the root element of the component. */

package/lib/components/carbon-provider/carbon-provider.component.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
 import { ThemeObject } from "../../style/themes/base";
 export interface CarbonProviderProps {
-    theme?: ThemeObject;
+    theme?: Partial<ThemeObject>;
     children: React.ReactNode;
     validationRedesignOptIn?: boolean;
 }

package/lib/components/carbon-provider/carbon-provider.component.js

@@ -97,29 +97,30 @@ CarbonProvider.propTypes = {
     colors: _propTypes.default.shape({
       destructive: _propTypes.default.shape({
         hover: _propTypes.default.string.isRequired,
-      }).isRequired,
-      error: _propTypes.default.string.isRequired,
-      focus: _propTypes.default.string.isRequired,
-      info: _propTypes.default.string.isRequired,
-      loadingBarBackground: _propTypes.default.string.isRequired,
-      placeholder: _propTypes.default.string.isRequired,
-      primary: _propTypes.default.string.isRequired,
-      secondary: _propTypes.default.string.isRequired,
-      tertiary: _propTypes.default.string.isRequired,
-      warning: _propTypes.default.string.isRequired,
-      warningText: _propTypes.default.string.isRequired,
-      white: _propTypes.default.oneOf(["#FFFFFF"]).isRequired,
-    }).isRequired,
+      }),
+      error: _propTypes.default.string,
+      focus: _propTypes.default.string,
+      info: _propTypes.default.string,
+      loadingBarBackground: _propTypes.default.string,
+      placeholder: _propTypes.default.string,
+      primary: _propTypes.default.string,
+      secondary: _propTypes.default.string,
+      tertiary: _propTypes.default.string,
+      warning: _propTypes.default.string,
+      warningText: _propTypes.default.string,
+      white: _propTypes.default.oneOf(["#FFFFFF"]),
+    }),
+    compatibility: _propTypes.default.object,
     disabled: _propTypes.default.shape({
       background: _propTypes.default.string.isRequired,
-    }).isRequired,
-    name: _propTypes.default.string.isRequired,
+    }),
+    name: _propTypes.default.string,
     palette: _propTypes.default.shape({
       blackOpacity: _propTypes.default.func.isRequired,
       whiteOpacity: _propTypes.default.func.isRequired,
-    }).isRequired,
-    space: _propTypes.default.arrayOf(_propTypes.default.string).isRequired,
-    spacing: _propTypes.default.number.isRequired,
+    }),
+    space: _propTypes.default.arrayOf(_propTypes.default.string),
+    spacing: _propTypes.default.number,
     zIndex: _propTypes.default.shape({
       aboveAll: _propTypes.default.number.isRequired,
       fullScreenModal: _propTypes.default.number.isRequired,
@@ -130,7 +131,7 @@ CarbonProvider.propTypes = {
       overlay: _propTypes.default.number.isRequired,
       popover: _propTypes.default.number.isRequired,
       smallOverlay: _propTypes.default.number.isRequired,
-    }).isRequired,
+    }),
   }),
   validationRedesignOptIn: _propTypes.default.bool,
 };

package/lib/components/card/card-row/card-row.component.d.ts

@@ -5,9 +5,24 @@ declare function CardRow({ children, spacing, ...props }: {
     spacing?: string | undefined;
 }): JSX.Element;
 declare namespace CardRow {
-    namespace propTypes {
-        const children: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-        const spacing: PropTypes.Requireable<string>;
-    }
+    const propTypes: {
+        children: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
+        /** 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 (see table below). */
+        spacing: PropTypes.Requireable<string>;
+        p?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        padding?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        pr?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        pl?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        paddingLeft?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        paddingRight?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        paddingTop?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        pt?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        paddingBottom?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        pb?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        paddingX?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        px?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        paddingY?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        py?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+    };
 }
 import PropTypes from "prop-types";

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

@@ -13,15 +13,33 @@ declare namespace Card {
     namespace defaultProps {
         const spacing: string;
     }
-    namespace propTypes {
-        export const action: PropTypes.Requireable<(...args: any[]) => any>;
-        export const children: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-        export const cardWidth: PropTypes.Requireable<string>;
-        export const interactive: PropTypes.Requireable<boolean>;
-        export const draggable: PropTypes.Requireable<boolean>;
-        const spacing_1: PropTypes.Requireable<string>;
-        export { spacing_1 as spacing };
-        export const dataRole: PropTypes.Requireable<string>;
-    }
+    const propTypes: {
+        /** action to be executed when card is clicked or enter pressed */
+        action: PropTypes.Requireable<(...args: any[]) => any>;
+        children: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
+        /** style value for width of card */
+        cardWidth: PropTypes.Requireable<string>;
+        /** flag to indicate if card is interactive */
+        interactive: PropTypes.Requireable<boolean>;
+        /** flag to indicate if card is draggable */
+        draggable: PropTypes.Requireable<boolean>;
+        /** size of card for applying padding (small | medium | large) */
+        spacing: PropTypes.Requireable<string>;
+        dataRole: PropTypes.Requireable<string>;
+        marginBottom?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        margin?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        m?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginLeft?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        ml?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginRight?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mr?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginTop?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mt?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mb?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginX?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mx?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginY?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        my?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+    };
 }
 import PropTypes from "prop-types";

package/lib/components/checkbox/checkbox-group.component.d.ts

@@ -3,20 +3,53 @@ export default CheckboxGroup;
 import React from "react";
 declare function CheckboxGroup(props: any): JSX.Element;
 declare namespace CheckboxGroup {
-    namespace propTypes {
-        const legend: PropTypes.Requireable<string>;
-        const legendInline: PropTypes.Requireable<boolean>;
-        const legendWidth: PropTypes.Requireable<number>;
-        const legendAlign: PropTypes.Requireable<string>;
-        const legendSpacing: PropTypes.Requireable<number>;
-        const children: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-        const groupName: PropTypes.Validator<string>;
-        const error: PropTypes.Requireable<string | boolean>;
-        const warning: PropTypes.Requireable<string | boolean>;
-        const info: PropTypes.Requireable<string | boolean>;
-        const labelSpacing: PropTypes.Requireable<number>;
-        const required: PropTypes.Requireable<boolean>;
-        const tooltipPosition: PropTypes.Requireable<string>;
-    }
+    const propTypes: {
+        /** The content for the CheckboxGroup Legend */
+        legend: PropTypes.Requireable<string>;
+        /** When true, legend is placed in line with the checkboxes */
+        legendInline: PropTypes.Requireable<boolean>;
+        /** Percentage width of legend (only when legend is inline)  */
+        legendWidth: PropTypes.Requireable<number>;
+        /** Text alignment of legend when inline */
+        legendAlign: PropTypes.Requireable<string>;
+        /** Spacing between legend and field for inline legend, number multiplied by base spacing unit (8) */
+        legendSpacing: PropTypes.Requireable<number>;
+        /** The Checkboxes to be rendered in the group */
+        children: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
+        /** Specifies the name prop to be applied to each button in the group */
+        groupName: PropTypes.Validator<string>;
+        /** Indicate that error has occurred
+        Pass string to display icon, tooltip and red border
+        Pass true boolean to only display red border */
+        error: PropTypes.Requireable<string | boolean>;
+        /** Indicate that warning has occurred
+        Pass string to display icon, tooltip and orange border
+        Pass true boolean to only display orange border */
+        warning: PropTypes.Requireable<string | boolean>;
+        /** Indicate additional information
+        Pass string to display icon, tooltip and blue border
+        Pass true boolean to only display blue border */
+        info: PropTypes.Requireable<string | boolean>;
+        /** Spacing between label and a field for inline label, given number will be multiplied by base spacing unit (8) */
+        labelSpacing: PropTypes.Requireable<number>;
+        /** Flag to configure component as mandatory */
+        required: PropTypes.Requireable<boolean>;
+        /** Overrides the default tooltip position */
+        tooltipPosition: PropTypes.Requireable<string>;
+        marginBottom?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        margin?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        m?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginLeft?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        ml?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginRight?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mr?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginTop?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mt?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mb?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginX?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mx?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginY?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        my?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+    };
 }
 import PropTypes from "prop-types";

package/lib/components/checkbox/checkbox-group.d.ts

@@ -1,8 +1,8 @@
 import * as React from "react";
 import { MarginProps } from "styled-system";
-import { ValidationPropTypes } from "../../__internal__/validations";
+import { ValidationProps } from "../../__internal__/validations";
 
-interface CheckboxGroupProps extends ValidationPropTypes, MarginProps {
+interface CheckboxGroupProps extends ValidationProps, MarginProps {
   /** The content for the CheckboxGroup Legend */
   legend?: string;
   /** When true, legend is placed in line with the checkboxes */

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

@@ -100,6 +100,20 @@ declare namespace Checkbox {
         tooltipPosition: PropTypes.Requireable<string>;
         /** Aria label for rendered help component */
         helpAriaLabel: PropTypes.Requireable<string>;
+        marginBottom?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        margin?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        m?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginLeft?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        ml?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginRight?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mr?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginTop?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mt?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mb?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginX?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mx?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginY?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        my?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
     };
     const defaultProps: {
         reverse: boolean;

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

@@ -10,14 +10,36 @@ declare function Content({ variant, children, title, inline, align, titleWidth,
     bodyFullWidth?: boolean | undefined;
 }): JSX.Element;
 declare namespace Content {
-    namespace propTypes {
-        const variant: PropTypes.Requireable<string>;
-        const children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        const title: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        const inline: PropTypes.Requireable<boolean>;
-        const align: PropTypes.Requireable<string>;
-        const titleWidth: PropTypes.Requireable<string>;
-        const bodyFullWidth: PropTypes.Requireable<boolean>;
-    }
+    const propTypes: {
+        /** Applies a theme to the Content Value: primary, secondary */
+        variant: PropTypes.Requireable<string>;
+        /** The body of the content component */
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        /** The title of the content component */
+        title: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        /** Displays the content inline with the title */
+        inline: PropTypes.Requireable<boolean>;
+        /** Aligns the content (left, center or right) */
+        align: PropTypes.Requireable<string>;
+        /** Sets a custom width for the title element */
+        titleWidth: PropTypes.Requireable<string>;
+        /** Over-rides the calculation of body width based on titleWidth.
+         * Sometimes we need the body to be full width while keeping a title width similar to other widths */
+        bodyFullWidth: PropTypes.Requireable<boolean>;
+        marginBottom?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        margin?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        m?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginLeft?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        ml?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginRight?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mr?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginTop?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mt?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mb?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginX?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mx?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginY?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        my?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+    };
 }
 import PropTypes from "prop-types";

package/lib/components/date-range/date-range.component.d.ts

@@ -13,25 +13,73 @@ declare function DateRange({ endDateProps, id, labelsInline, name, onBlur, onCha
     value: any;
 }): JSX.Element;
 declare namespace DateRange {
-    namespace propTypes {
-        const endLabel: PropTypes.Requireable<string>;
-        const onChange: PropTypes.Validator<(...args: any[]) => any>;
-        const onBlur: PropTypes.Requireable<(...args: any[]) => any>;
-        const value: PropTypes.Validator<(string | null | undefined)[]>;
-        const startError: PropTypes.Requireable<string | boolean>;
-        const startWarning: PropTypes.Requireable<string | boolean>;
-        const startInfo: PropTypes.Requireable<string | boolean>;
-        const endError: PropTypes.Requireable<string | boolean>;
-        const endWarning: PropTypes.Requireable<string | boolean>;
-        const endInfo: PropTypes.Requireable<string | boolean>;
-        const validationOnLabel: PropTypes.Requireable<boolean>;
-        const startLabel: PropTypes.Requireable<string>;
-        const labelsInline: PropTypes.Requireable<boolean>;
-        const startDateProps: PropTypes.Requireable<PropTypes.InferProps<any>>;
-        const endDateProps: PropTypes.Requireable<PropTypes.InferProps<any>>;
-        const name: PropTypes.Requireable<string>;
-        const id: PropTypes.Requireable<string>;
-        const tooltipPosition: PropTypes.Requireable<string>;
-    }
+    const propTypes: {
+        /**
+         * Optional label for endDate field
+         */
+        endLabel: PropTypes.Requireable<string>;
+        /** Custom callback - receives array of startDate and endDate */
+        onChange: PropTypes.Validator<(...args: any[]) => any>;
+        /** Custom callback - receives array of startDate and endDate */
+        onBlur: PropTypes.Requireable<(...args: any[]) => any>;
+        /** An array containing the value of startDate and endDate */
+        value: PropTypes.Validator<(string | null | undefined)[]>;
+        /** Indicate that error has occurred on start date
+        Pass string to display icon, tooltip and red border
+        Pass true boolean to only display red border */
+        startError: PropTypes.Requireable<string | boolean>;
+        /** Indicate that warning has occurred on start date
+        Pass string to display icon, tooltip and orange border
+        Pass true boolean to only display orange border */
+        startWarning: PropTypes.Requireable<string | boolean>;
+        /** Indicate additional information for start date
+        Pass string to display icon, tooltip and blue border
+        Pass true boolean to only display blue border */
+        startInfo: PropTypes.Requireable<string | boolean>;
+        /** Indicate that error has occurred on end date
+        Pass string to display icon, tooltip and red border
+        Pass true boolean to only display red border */
+        endError: PropTypes.Requireable<string | boolean>;
+        /** Indicate that warning has occurred on end date
+        Pass string to display icon, tooltip and orange border
+        Pass true boolean to only display orange border */
+        endWarning: PropTypes.Requireable<string | boolean>;
+        /** Indicate additional information for end date
+        Pass string to display icon, tooltip and blue border
+        Pass true boolean to only display blue border */
+        endInfo: PropTypes.Requireable<string | boolean>;
+        /** When true, validation icons will be placed on labels instead of being placed on the inputs */
+        validationOnLabel: PropTypes.Requireable<boolean>;
+        /**
+         * Optional label for startDate field
+         */
+        startLabel: PropTypes.Requireable<string>;
+        /** Display labels inline */
+        labelsInline: PropTypes.Requireable<boolean>;
+        /** Props for the child start Date component. For more information see the Date component's [prop table](https://carbon.sage.com/iframe.html?id=date-input--default-story&viewMode=docs#props) */
+        startDateProps: PropTypes.Requireable<PropTypes.InferProps<any>>;
+        /** Props for the child end Date component. For more information see the Date component's [prop table](https://carbon.sage.com/iframe.html?id=date-input--default-story&viewMode=docs#props) */
+        endDateProps: PropTypes.Requireable<PropTypes.InferProps<any>>;
+        /** An optional string prop to provide a name to the component */
+        name: PropTypes.Requireable<string>;
+        /** An optional string prop to provide an id to the component */
+        id: PropTypes.Requireable<string>;
+        /** Overrides the default tooltip position */
+        tooltipPosition: PropTypes.Requireable<string>;
+        marginBottom?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        margin?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        m?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginLeft?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        ml?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginRight?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mr?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginTop?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mt?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mb?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginX?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mx?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginY?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        my?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+    };
 }
 import PropTypes from "prop-types";

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

@@ -76,6 +76,20 @@ declare namespace Decimal {
         locale: PropTypes.Requireable<string>;
         /** Aria label for rendered help component */
         helpAriaLabel: PropTypes.Requireable<string>;
+        marginBottom?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        margin?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        m?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginLeft?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        ml?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginRight?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mr?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginTop?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mt?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mb?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginX?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        mx?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        marginY?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
+        my?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
     };
     namespace defaultProps {
         const precision: number;