carbon-react 111.12.3 → 111.12.5

package/esm/components/radio-button/radio-button-group.component.js

@@ -1,7 +1,7 @@
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 import React from "react";
 import PropTypes from "prop-types";
-import styledSystemPropTypes from "@styled-system/prop-types";
 import tagComponent from "../../__internal__/utils/helpers/tags/tags";
 import Fieldset from "../../__internal__/fieldset";
 import RadioButtonGroupStyle from "./radio-button-group.style";
@@ -9,7 +9,7 @@ import RadioButtonMapper from "../../__internal__/radio-button-mapper/radio-butt
 import useIsAboveBreakpoint from "../../hooks/__internal__/useIsAboveBreakpoint";
 import { filterStyledSystemMarginProps } from "../../style/utils";
 import { TooltipProvider } from "../../__internal__/tooltip-provider";
-const marginPropTypes = filterStyledSystemMarginProps(styledSystemPropTypes.space);
+
 const RadioButtonGroup = props => {
   const {
     children,
@@ -36,13 +36,17 @@ const RadioButtonGroup = props => {
   const isAboveLegendBreakpoint = useIsAboveBreakpoint(adaptiveLegendBreakpoint);
   const isAboveSpacingBreakpoint = useIsAboveBreakpoint(adaptiveSpacingBreakpoint);
   let inlineLegend = legendInline;
+
   if (adaptiveLegendBreakpoint) {
-    inlineLegend = isAboveLegendBreakpoint;
+    inlineLegend = !!isAboveLegendBreakpoint;
   }
+
   let marginLeft = marginProps.ml;
+
   if (adaptiveSpacingBreakpoint && !isAboveSpacingBreakpoint) {
     marginLeft = undefined;
   }
+
   return /*#__PURE__*/React.createElement(TooltipProvider, {
     tooltipPosition: tooltipPosition
   }, /*#__PURE__*/React.createElement(Fieldset, _extends({
@@ -69,6 +73,10 @@ const RadioButtonGroup = props => {
     onChange: onChange,
     value: value
   }, React.Children.map(children, child => {
+    if (! /*#__PURE__*/React.isValidElement(child)) {
+      return child;
+    }
+
     return /*#__PURE__*/React.cloneElement(child, {
       inline,
       labelSpacing,
@@ -80,51 +88,182 @@ const RadioButtonGroup = props => {
     });
   })))));
 };
+
 RadioButtonGroup.propTypes = {
-  ...marginPropTypes,
-  /** The RadioButton objects to be rendered in the group */
-  children: PropTypes.node.isRequired,
-  /** Specifies the name prop to be applied to each button in the group */
-  name: PropTypes.string.isRequired,
-  /** The content for the RadioGroup Legend */
-  legend: PropTypes.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.oneOfType([PropTypes.bool, PropTypes.string]),
-  /** Indicate that warning has occurred
-  Pass string to display icon, tooltip and orange border
-  Pass true boolean to only display orange border */
-  warning: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
-  /** Indicate additional information
-  Pass string to display icon, tooltip and blue border
-  Pass true boolean to only display blue border */
-  info: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
-  /** Callback fired when each RadioButton is blurred */
-  onBlur: PropTypes.func,
-  /** Callback fired when the user selects a RadioButton */
-  onChange: PropTypes.func,
-  /** value of the selected RadioButton */
-  value: PropTypes.string,
-  /** When true, RadioButtons are in line */
-  inline: PropTypes.bool,
-  /** When true, legend is placed in line with the radiobuttons */
-  legendInline: PropTypes.bool,
-  /** Percentage width of legend (only when legend is inline)  */
-  legendWidth: PropTypes.number,
-  /** Text alignment of legend when inline */
-  legendAlign: PropTypes.oneOf(["left", "right"]),
-  /** Spacing between legend and field for inline legend, number multiplied by base spacing unit (8) */
-  legendSpacing: PropTypes.oneOf([1, 2]),
-  /** Spacing between labels and radio buttons, given number will be multiplied by base spacing unit (8) */
-  labelSpacing: PropTypes.oneOf([1, 2]),
-  /** Breakpoint for adaptive legend (inline labels change to top aligned). Enables the adaptive behaviour when set */
-  adaptiveLegendBreakpoint: PropTypes.number,
-  /** Breakpoint for adaptive spacing (left margin changes to 0). Enables the adaptive behaviour when set */
-  adaptiveSpacingBreakpoint: PropTypes.number,
-  /** Flag to configure component as mandatory */
-  required: PropTypes.bool,
-  /** Overrides the default tooltip position */
-  tooltipPosition: PropTypes.oneOf(["top", "bottom", "left", "right"])
+  "adaptiveLegendBreakpoint": PropTypes.number,
+  "adaptiveSpacingBreakpoint": PropTypes.number,
+  "children": PropTypes.node,
+  "error": PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
+  "info": PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
+  "inline": PropTypes.bool,
+  "labelSpacing": PropTypes.oneOf([1, 2]),
+  "legend": PropTypes.string,
+  "legendAlign": PropTypes.oneOf(["left", "right"]),
+  "legendInline": PropTypes.bool,
+  "legendSpacing": PropTypes.oneOf([1, 2]),
+  "legendWidth": PropTypes.number,
+  "m": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "margin": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "marginBottom": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "marginLeft": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "marginRight": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "marginTop": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "marginX": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "marginY": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "mb": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "ml": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "mr": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "mt": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "mx": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "my": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "name": PropTypes.string.isRequired,
+  "onBlur": PropTypes.func,
+  "onChange": PropTypes.func,
+  "required": PropTypes.bool,
+  "tooltipPosition": PropTypes.oneOf(["bottom", "left", "right", "top"]),
+  "value": PropTypes.string,
+  "warning": PropTypes.oneOfType([PropTypes.string, PropTypes.bool])
 };
+export { RadioButtonGroup };
+RadioButtonGroup.displayName = "RadioButtonGroup";
 export default RadioButtonGroup;

package/esm/components/radio-button/radio-button-group.style.d.ts

@@ -0,0 +1,5 @@
+declare const RadioButtonGroupStyle: import("styled-components").StyledComponent<"div", any, {
+    inline?: boolean | undefined;
+    legendInline?: boolean | undefined;
+}, never>;
+export default RadioButtonGroupStyle;

package/esm/components/radio-button/radio-button-svg.component.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/esm/components/radio-button/radio-button-svg.component.js

@@ -1,5 +1,7 @@
 import React from "react";
+import PropTypes from "prop-types";
 import StyledCheckableInputSvgWrapper from "../../__internal__/checkable-input/checkable-input-svg-wrapper.style";
+
 const RadioButtonSvg = () => {
   return /*#__PURE__*/React.createElement(StyledCheckableInputSvgWrapper, null, /*#__PURE__*/React.createElement("svg", {
     focusable: "false",
@@ -17,4 +19,5 @@ const RadioButtonSvg = () => {
     r: "5"
   }))));
 };
+
 export default /*#__PURE__*/React.memo(RadioButtonSvg, () => true);

package/esm/components/radio-button/radio-button.component.d.ts

@@ -0,0 +1,28 @@
+import React from "react";
+import { MarginProps } from "styled-system";
+import { CommonCheckableInputProps } from "../../__internal__/checkable-input";
+interface InternalRadioButtonProps {
+    inline?: boolean;
+    required?: boolean;
+}
+export interface RadioButtonProps extends CommonCheckableInputProps, 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. */
+    "data-element"?: string;
+    /** Identifier used for testing purposes, applied to the root element of the component. */
+    "data-role"?: string;
+    /** Text alignment of the label */
+    labelAlign?: "left" | "right";
+    /** Accepts a callback function which is triggered on click event */
+    onClick?: (ev: React.MouseEvent<HTMLInputElement>) => void;
+    /** the value of the Radio Button, passed on form submit */
+    value: string;
+    /** Overrides the default tooltip position */
+    tooltipPosition?: "top" | "bottom" | "left" | "right";
+    /** Aria label for rendered help component */
+    helpAriaLabel?: string;
+}
+export declare const RadioButton: React.ForwardRefExoticComponent<RadioButtonProps & InternalRadioButtonProps & React.RefAttributes<HTMLInputElement>>;
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<RadioButtonProps & InternalRadioButtonProps & React.RefAttributes<HTMLInputElement>>>;
+export default _default;