carbon-react 142.3.0 → 142.3.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (27) hide show
  1. package/esm/__internal__/checkable-input/checkable-input.component.d.ts +3 -3
  2. package/esm/__internal__/checkable-input/checkable-input.component.js +6 -2
  3. package/esm/components/checkbox/checkbox-group/checkbox-group.component.d.ts +3 -3
  4. package/esm/components/checkbox/checkbox-group/checkbox-group.component.js +2 -6
  5. package/esm/components/checkbox/checkbox.component.d.ts +2 -2
  6. package/esm/components/checkbox/checkbox.component.js +12 -10
  7. package/esm/components/checkbox/checkbox.style.js +4 -3
  8. package/esm/components/menu/menu-item/menu-item.style.js +4 -1
  9. package/esm/components/note/note.component.js +0 -4
  10. package/esm/components/radio-button/radio-button-group/radio-button-group.component.d.ts +2 -2
  11. package/esm/components/radio-button/radio-button-group/radio-button-group.component.js +1 -8
  12. package/esm/components/radio-button/radio-button.component.d.ts +2 -2
  13. package/esm/components/radio-button/radio-button.component.js +12 -16
  14. package/lib/__internal__/checkable-input/checkable-input.component.d.ts +3 -3
  15. package/lib/__internal__/checkable-input/checkable-input.component.js +5 -1
  16. package/lib/components/checkbox/checkbox-group/checkbox-group.component.d.ts +3 -3
  17. package/lib/components/checkbox/checkbox-group/checkbox-group.component.js +2 -6
  18. package/lib/components/checkbox/checkbox.component.d.ts +2 -2
  19. package/lib/components/checkbox/checkbox.component.js +12 -10
  20. package/lib/components/checkbox/checkbox.style.js +4 -3
  21. package/lib/components/menu/menu-item/menu-item.style.js +4 -1
  22. package/lib/components/note/note.component.js +0 -4
  23. package/lib/components/radio-button/radio-button-group/radio-button-group.component.d.ts +2 -2
  24. package/lib/components/radio-button/radio-button-group/radio-button-group.component.js +1 -8
  25. package/lib/components/radio-button/radio-button.component.d.ts +2 -2
  26. package/lib/components/radio-button/radio-button.component.js +12 -16
  27. package/package.json +1 -1
@@ -6,10 +6,10 @@ export interface CommonCheckableInputProps extends ValidationProps, CommonHidden
6
6
  disabled?: boolean;
7
7
  /** @private @ignore */
8
8
  loading?: boolean;
9
- /** Help content to be displayed under an input */
9
+ /** [Legacy] Help content to be displayed under an input */
10
10
  fieldHelp?: React.ReactNode;
11
11
  /**
12
- * If true, the FieldHelp will be displayed inline
12
+ * [Legacy] If true, the FieldHelp will be displayed inline
13
13
  * To be used with labelInline prop set to true
14
14
  */
15
15
  fieldHelpInline?: boolean;
@@ -19,7 +19,7 @@ export interface CommonCheckableInputProps extends ValidationProps, CommonHidden
19
19
  inputWidth?: number;
20
20
  /** Label content */
21
21
  label?: React.ReactNode;
22
- /** The content for the help tooltip, to appear next to the Label */
22
+ /** [Legacy] The content for the help tooltip, to appear next to the Label */
23
23
  labelHelp?: React.ReactNode;
24
24
  /** Spacing between label and a field for inline label, given number will be multiplied by base spacing unit (8) */
25
25
  labelSpacing?: 1 | 2;
@@ -1,5 +1,5 @@
1
1
  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); }
2
- import React, { useRef } from "react";
2
+ import React, { useRef, useContext } from "react";
3
3
  import PropTypes from "prop-types";
4
4
  import { StyledCheckableInput, StyledCheckableInputWrapper } from "./checkable-input.style";
5
5
  import { InputBehaviour } from "../input-behaviour";
@@ -7,6 +7,7 @@ import FormField from "../form-field";
7
7
  import HiddenCheckableInput from "./hidden-checkable-input.component";
8
8
  import guid from "../utils/helpers/guid";
9
9
  import useInputAccessibility from "../../hooks/__internal__/useInputAccessibility";
10
+ import NewValidationContext from "../../components/carbon-provider/__internal__/new-validation.context";
10
11
  const CheckableInput = /*#__PURE__*/React.forwardRef(({
11
12
  ariaLabelledBy,
12
13
  autoFocus,
@@ -41,6 +42,9 @@ const CheckableInput = /*#__PURE__*/React.forwardRef(({
41
42
  const {
42
43
  current: id
43
44
  } = useRef(inputId || guid());
45
+ const {
46
+ validationRedesignOptIn
47
+ } = useContext(NewValidationContext);
44
48
  const {
45
49
  labelId,
46
50
  fieldHelpId,
@@ -76,7 +80,7 @@ const CheckableInput = /*#__PURE__*/React.forwardRef(({
76
80
  // However, we still want the input element to receive the required prop
77
81
  isRequired: required,
78
82
  isOptional,
79
- useValidationIcon: validationOnLabel
83
+ useValidationIcon: validationRedesignOptIn ? false : validationOnLabel
80
84
  };
81
85
  const inputProps = {
82
86
  ariaDescribedBy,
@@ -5,8 +5,8 @@ export interface CheckboxGroupProps extends ValidationProps, MarginProps {
5
5
  /** The content for the CheckboxGroup Legend */
6
6
  legend?: string;
7
7
  /**
8
- * The content for the CheckboxGroup Help tooltip,
9
- * will be rendered as hint text when `validationRedesignOptIn` is true.
8
+ * The content for the CheckboxGroup hint text,
9
+ * will only be rendered when `validationRedesignOptIn` is true.
10
10
  */
11
11
  legendHelp?: string;
12
12
  /** [Legacy] When true, legend is placed inline with the checkboxes */
@@ -27,7 +27,7 @@ export interface CheckboxGroupProps extends ValidationProps, MarginProps {
27
27
  isOptional?: boolean;
28
28
  /** [Legacy] Overrides the default tooltip */
29
29
  tooltipPosition?: "top" | "bottom" | "left" | "right";
30
- /** When true, Checkboxes are in line */
30
+ /** When true, Checkboxes are inline */
31
31
  inline?: boolean;
32
32
  }
33
33
  export declare const CheckboxGroup: {
@@ -35,12 +35,8 @@ export const CheckboxGroup = props => {
35
35
  return /*#__PURE__*/React.createElement(React.Fragment, null, validationRedesignOptIn ? /*#__PURE__*/React.createElement(Fieldset, _extends({
36
36
  legend: legend,
37
37
  inline: legendInline,
38
- legendWidth: legendWidth,
39
- legendAlign: legendAlign,
40
- legendSpacing: legendSpacing,
41
38
  error: error,
42
39
  warning: warning,
43
- info: info,
44
40
  isRequired: required,
45
41
  isOptional: isOptional
46
42
  }, tagComponent("checkboxgroup", props), {
@@ -56,7 +52,6 @@ export const CheckboxGroup = props => {
56
52
  }), /*#__PURE__*/React.createElement(StyledCheckboxGroup, {
57
53
  "data-component": "checkbox-group",
58
54
  "data-role": "checkbox-group",
59
- legendInline: legendInline,
60
55
  inline: inline
61
56
  }, /*#__PURE__*/React.createElement(CheckboxGroupContext.Provider, {
62
57
  value: {
@@ -83,7 +78,8 @@ export const CheckboxGroup = props => {
83
78
  }, filterStyledSystemMarginProps(props)), /*#__PURE__*/React.createElement(StyledCheckboxGroup, {
84
79
  "data-component": "checkbox-group",
85
80
  "data-role": "checkbox-group",
86
- legendInline: legendInline
81
+ legendInline: legendInline,
82
+ inline: inline
87
83
  }, /*#__PURE__*/React.createElement(CheckboxGroupContext.Provider, {
88
84
  value: {
89
85
  error: !!error,
@@ -12,13 +12,13 @@ export interface CheckboxProps extends CommonCheckableInputProps, MarginProps {
12
12
  "data-element"?: string;
13
13
  /** Identifier used for testing purposes, applied to the root element of the component. */
14
14
  "data-role"?: string;
15
- /** Aria label for rendered help component */
15
+ /** [Legacy] Aria label for rendered help component */
16
16
  helpAriaLabel?: string;
17
17
  /** When true label is inline */
18
18
  labelInline?: boolean;
19
19
  /** Accepts a callback function which is triggered on click event */
20
20
  onClick?: (ev: React.MouseEvent<HTMLInputElement>) => void;
21
- /** Overrides the default tooltip position */
21
+ /** [Legacy] Overrides the default tooltip position */
22
22
  tooltipPosition?: "top" | "bottom" | "left" | "right";
23
23
  /** The value of the checkbox, passed on form submit */
24
24
  value?: string;
@@ -61,6 +61,13 @@ const Checkbox = /*#__PURE__*/React.forwardRef(({
61
61
  deprecateUncontrolledWarnTriggered = true;
62
62
  Logger.deprecate("Uncontrolled behaviour in `Checkbox` is deprecated and support will soon be removed. Please make sure all your inputs are controlled.");
63
63
  }
64
+ const commonProps = {
65
+ fieldHelpInline,
66
+ labelSpacing,
67
+ labelHelp,
68
+ fieldHelp
69
+ };
70
+ const isInGroup = Object.keys(checkboxGroupContext).length !== 0;
64
71
  const inputProps = {
65
72
  ariaLabelledBy,
66
73
  onClick,
@@ -74,28 +81,23 @@ const Checkbox = /*#__PURE__*/React.forwardRef(({
74
81
  type: "checkbox",
75
82
  name,
76
83
  reverse: !reverse,
77
- fieldHelp,
78
84
  autoFocus,
79
- labelHelp,
80
- labelSpacing,
81
85
  required,
82
86
  isOptional,
83
- fieldHelpInline,
84
87
  checked,
85
88
  disabled,
86
89
  inputWidth,
87
90
  labelWidth,
88
91
  ref,
89
- ...rest
92
+ ...rest,
93
+ ...(isInGroup && validationRedesignOptIn ? {} : {
94
+ ...commonProps
95
+ })
90
96
  };
91
97
  const validationProps = {
92
98
  error: contextError || error,
93
99
  warning: contextWarning || warning,
94
- ...(validationRedesignOptIn ? {
95
- validationOnLabel: false
96
- } : {
97
- info: contextInfo || info
98
- })
100
+ info: contextInfo || info
99
101
  };
100
102
  const marginProps = useFormSpacing(rest);
101
103
  const componentToRender = /*#__PURE__*/React.createElement(CheckboxStyle, _extends({
@@ -41,11 +41,12 @@ const StyledCheckbox = styled.div`
41
41
  ${!disabled && css`
42
42
  border: 1px solid var(--colorsUtilityMajor300);
43
43
 
44
- ${info && `border: 1px solid var(--colorsSemanticInfo500);`}
45
- ${warning && `border: 1px solid var(--colorsSemanticCaution500);`}
46
44
  ${error && `border: 2px solid var(--colorsSemanticNegative500);`}
47
45
 
48
- ${warning && applyNewValidation && `border: 1px solid var(--colorsUtilityMajor300);`}
46
+ ${!applyNewValidation && css`
47
+ ${info && `border: 1px solid var(--colorsSemanticInfo500);`}
48
+ ${warning && `border: 1px solid var(--colorsSemanticCaution500);`}
49
+ `}
49
50
  `}
50
51
  }
51
52
 
@@ -118,7 +118,10 @@ const StyledMenuItemWrapper = styled.a.attrs({
118
118
  }
119
119
 
120
120
  ${!maxWidth && css`
121
- :has([data-component="icon"]):not(:has(button)) ${StyledContent} {
121
+ a:has([data-component="icon"]):not(:has(button))
122
+ ${StyledContent},
123
+ button:has([data-component="icon"]):not(:has(button))
124
+ ${StyledContent} {
122
125
  position: relative;
123
126
  top: -2px;
124
127
  }
@@ -25,10 +25,6 @@ export const Note = ({
25
25
  ...rest
26
26
  }) => {
27
27
  !(width > 0) ? process.env.NODE_ENV !== "production" ? invariant(false, "<Note> width must be greater than 0") : invariant(false) : void 0;
28
- !createdDate ? process.env.NODE_ENV !== "production" ? invariant(false, "<Note> createdDate is required") : invariant(false) : void 0;
29
- !noteContent ? process.env.NODE_ENV !== "production" ? invariant(false, "<Note> noteContent is required") : invariant(false) : void 0;
30
- !(!status || status.text) ? process.env.NODE_ENV !== "production" ? invariant(false, "<Note> status.text is required") : invariant(false) : void 0;
31
- !(!status || status.timeStamp) ? process.env.NODE_ENV !== "production" ? invariant(false, "<Note> status.timeStamp is required") : invariant(false) : void 0;
32
28
  !(!inlineControl || /*#__PURE__*/React.isValidElement(inlineControl) && inlineControl.type === ActionPopover) ? process.env.NODE_ENV !== "production" ? invariant(false, "<Note> inlineControl must be an instance of <ActionPopover>") : invariant(false) : void 0;
33
29
  const renderStatus = () => {
34
30
  if (!status) {
@@ -15,8 +15,8 @@ export interface RadioButtonGroupProps extends ValidationProps, MarginProps {
15
15
  /** The content for the RadioGroup Legend */
16
16
  legend?: string;
17
17
  /**
18
- * The content for the RadioButtonGroup Legend Help tooltip,
19
- * will be rendered as hint text when `validationRedesignOptIn` is true.
18
+ * The content for the RadioButtonGroup hint text,
19
+ * will only be rendered when `validationRedesignOptIn` is true.
20
20
  */
21
21
  legendHelp?: string;
22
22
  /** [Legacy] Text alignment of legend when inline */
@@ -60,11 +60,7 @@ export const RadioButtonGroup = props => {
60
60
  legend: legend,
61
61
  error: error,
62
62
  warning: warning,
63
- info: info,
64
63
  inline: inlineLegend,
65
- legendWidth: legendWidth,
66
- legendAlign: legendAlign,
67
- legendSpacing: legendSpacing,
68
64
  isRequired: required,
69
65
  isOptional: isOptional
70
66
  }, tagComponent("radiogroup", props), marginProps, {
@@ -82,8 +78,7 @@ export const RadioButtonGroup = props => {
82
78
  }), /*#__PURE__*/React.createElement(RadioButtonGroupStyle, {
83
79
  "data-component": "radio-button-group",
84
80
  role: "radiogroup",
85
- inline: inline,
86
- legendInline: inlineLegend
81
+ inline: inline
87
82
  }, /*#__PURE__*/React.createElement(RadioButtonMapper, {
88
83
  name: name,
89
84
  onBlur: onBlur,
@@ -98,8 +93,6 @@ export const RadioButtonGroup = props => {
98
93
  labelSpacing,
99
94
  error: !!error,
100
95
  warning: !!warning,
101
- info: !!info,
102
- required,
103
96
  ...child.props
104
97
  });
105
98
  }))))) : /*#__PURE__*/React.createElement(TooltipProvider, {
@@ -15,9 +15,9 @@ export interface RadioButtonProps extends Omit<CommonCheckableInputProps, "requi
15
15
  onClick?: (ev: React.MouseEvent<HTMLInputElement>) => void;
16
16
  /** the value of the Radio Button, passed on form submit */
17
17
  value: string;
18
- /** Overrides the default tooltip position */
18
+ /** [Legacy] Overrides the default tooltip position */
19
19
  tooltipPosition?: "top" | "bottom" | "left" | "right";
20
- /** Aria label for rendered help component */
20
+ /** [Legacy] Aria label for rendered help component */
21
21
  helpAriaLabel?: string;
22
22
  }
23
23
  export declare const RadioButton: React.ForwardRefExoticComponent<RadioButtonProps & InternalRadioButtonProps & React.RefAttributes<HTMLInputElement>>;
@@ -52,34 +52,31 @@ const RadioButton = /*#__PURE__*/React.forwardRef(({
52
52
  event.target.focus();
53
53
  }, [onChange]);
54
54
  const validationProps = {
55
- disabled,
56
- inputWidth,
57
55
  error,
58
56
  warning,
59
57
  info
60
58
  };
61
59
  const commonProps = {
62
- ...validationProps,
63
60
  fieldHelpInline,
64
- labelSpacing
61
+ labelHelp,
62
+ fieldHelp
65
63
  };
66
64
  const inputProps = {
67
- ...(validationRedesignOptIn ? {
68
- ...validationProps
69
- } : {
65
+ ...(!validationRedesignOptIn && {
70
66
  ...commonProps
71
67
  }),
72
68
  autoFocus,
73
69
  checked,
74
- fieldHelp,
75
70
  name,
76
71
  onChange: handleChange,
77
72
  onBlur,
78
73
  onFocus,
79
74
  labelInline: true,
80
75
  labelWidth,
76
+ labelSpacing,
81
77
  label,
82
- labelHelp,
78
+ disabled,
79
+ inputWidth,
83
80
  id,
84
81
  value,
85
82
  type: "radio",
@@ -100,13 +97,12 @@ const RadioButton = /*#__PURE__*/React.forwardRef(({
100
97
  "data-element": dataElement,
101
98
  inline: inline,
102
99
  reverse: reverse,
103
- size: size
104
- }, validationRedesignOptIn ? {
105
- ...validationProps
106
- } : {
107
- ...commonProps,
108
- fieldHelp
109
- }, marginProps), /*#__PURE__*/React.createElement(CheckableInput, inputProps, /*#__PURE__*/React.createElement(RadioButtonSvg, null)));
100
+ size: size,
101
+ disabled: disabled,
102
+ inputWidth: inputWidth,
103
+ labelSpacing: labelSpacing,
104
+ fieldHelpInline: fieldHelpInline
105
+ }, validationProps, marginProps), /*#__PURE__*/React.createElement(CheckableInput, _extends({}, inputProps, validationProps), /*#__PURE__*/React.createElement(RadioButtonSvg, null)));
110
106
  return /*#__PURE__*/React.createElement(React.Fragment, null, validationRedesignOptIn ? componentToRender : /*#__PURE__*/React.createElement(TooltipProvider, {
111
107
  helpAriaLabel: helpAriaLabel,
112
108
  tooltipPosition: tooltipPosition
@@ -6,10 +6,10 @@ export interface CommonCheckableInputProps extends ValidationProps, CommonHidden
6
6
  disabled?: boolean;
7
7
  /** @private @ignore */
8
8
  loading?: boolean;
9
- /** Help content to be displayed under an input */
9
+ /** [Legacy] Help content to be displayed under an input */
10
10
  fieldHelp?: React.ReactNode;
11
11
  /**
12
- * If true, the FieldHelp will be displayed inline
12
+ * [Legacy] If true, the FieldHelp will be displayed inline
13
13
  * To be used with labelInline prop set to true
14
14
  */
15
15
  fieldHelpInline?: boolean;
@@ -19,7 +19,7 @@ export interface CommonCheckableInputProps extends ValidationProps, CommonHidden
19
19
  inputWidth?: number;
20
20
  /** Label content */
21
21
  label?: React.ReactNode;
22
- /** The content for the help tooltip, to appear next to the Label */
22
+ /** [Legacy] The content for the help tooltip, to appear next to the Label */
23
23
  labelHelp?: React.ReactNode;
24
24
  /** Spacing between label and a field for inline label, given number will be multiplied by base spacing unit (8) */
25
25
  labelSpacing?: 1 | 2;
@@ -12,6 +12,7 @@ var _formField = _interopRequireDefault(require("../form-field"));
12
12
  var _hiddenCheckableInput = _interopRequireDefault(require("./hidden-checkable-input.component"));
13
13
  var _guid = _interopRequireDefault(require("../utils/helpers/guid"));
14
14
  var _useInputAccessibility = _interopRequireDefault(require("../../hooks/__internal__/useInputAccessibility"));
15
+ var _newValidation = _interopRequireDefault(require("../../components/carbon-provider/__internal__/new-validation.context"));
15
16
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
16
17
  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); }
17
18
  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; }
@@ -50,6 +51,9 @@ const CheckableInput = /*#__PURE__*/_react.default.forwardRef(({
50
51
  const {
51
52
  current: id
52
53
  } = (0, _react.useRef)(inputId || (0, _guid.default)());
54
+ const {
55
+ validationRedesignOptIn
56
+ } = (0, _react.useContext)(_newValidation.default);
53
57
  const {
54
58
  labelId,
55
59
  fieldHelpId,
@@ -85,7 +89,7 @@ const CheckableInput = /*#__PURE__*/_react.default.forwardRef(({
85
89
  // However, we still want the input element to receive the required prop
86
90
  isRequired: required,
87
91
  isOptional,
88
- useValidationIcon: validationOnLabel
92
+ useValidationIcon: validationRedesignOptIn ? false : validationOnLabel
89
93
  };
90
94
  const inputProps = {
91
95
  ariaDescribedBy,
@@ -5,8 +5,8 @@ export interface CheckboxGroupProps extends ValidationProps, MarginProps {
5
5
  /** The content for the CheckboxGroup Legend */
6
6
  legend?: string;
7
7
  /**
8
- * The content for the CheckboxGroup Help tooltip,
9
- * will be rendered as hint text when `validationRedesignOptIn` is true.
8
+ * The content for the CheckboxGroup hint text,
9
+ * will only be rendered when `validationRedesignOptIn` is true.
10
10
  */
11
11
  legendHelp?: string;
12
12
  /** [Legacy] When true, legend is placed inline with the checkboxes */
@@ -27,7 +27,7 @@ export interface CheckboxGroupProps extends ValidationProps, MarginProps {
27
27
  isOptional?: boolean;
28
28
  /** [Legacy] Overrides the default tooltip */
29
29
  tooltipPosition?: "top" | "bottom" | "left" | "right";
30
- /** When true, Checkboxes are in line */
30
+ /** When true, Checkboxes are inline */
31
31
  inline?: boolean;
32
32
  }
33
33
  export declare const CheckboxGroup: {
@@ -44,12 +44,8 @@ const CheckboxGroup = props => {
44
44
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, validationRedesignOptIn ? /*#__PURE__*/_react.default.createElement(_fieldset.default, _extends({
45
45
  legend: legend,
46
46
  inline: legendInline,
47
- legendWidth: legendWidth,
48
- legendAlign: legendAlign,
49
- legendSpacing: legendSpacing,
50
47
  error: error,
51
48
  warning: warning,
52
- info: info,
53
49
  isRequired: required,
54
50
  isOptional: isOptional
55
51
  }, (0, _tags.default)("checkboxgroup", props), {
@@ -65,7 +61,6 @@ const CheckboxGroup = props => {
65
61
  }), /*#__PURE__*/_react.default.createElement(_checkboxGroup.default, {
66
62
  "data-component": "checkbox-group",
67
63
  "data-role": "checkbox-group",
68
- legendInline: legendInline,
69
64
  inline: inline
70
65
  }, /*#__PURE__*/_react.default.createElement(_checkboxGroup2.default.Provider, {
71
66
  value: {
@@ -92,7 +87,8 @@ const CheckboxGroup = props => {
92
87
  }, (0, _utils.filterStyledSystemMarginProps)(props)), /*#__PURE__*/_react.default.createElement(_checkboxGroup.default, {
93
88
  "data-component": "checkbox-group",
94
89
  "data-role": "checkbox-group",
95
- legendInline: legendInline
90
+ legendInline: legendInline,
91
+ inline: inline
96
92
  }, /*#__PURE__*/_react.default.createElement(_checkboxGroup2.default.Provider, {
97
93
  value: {
98
94
  error: !!error,
@@ -12,13 +12,13 @@ export interface CheckboxProps extends CommonCheckableInputProps, MarginProps {
12
12
  "data-element"?: string;
13
13
  /** Identifier used for testing purposes, applied to the root element of the component. */
14
14
  "data-role"?: string;
15
- /** Aria label for rendered help component */
15
+ /** [Legacy] Aria label for rendered help component */
16
16
  helpAriaLabel?: string;
17
17
  /** When true label is inline */
18
18
  labelInline?: boolean;
19
19
  /** Accepts a callback function which is triggered on click event */
20
20
  onClick?: (ev: React.MouseEvent<HTMLInputElement>) => void;
21
- /** Overrides the default tooltip position */
21
+ /** [Legacy] Overrides the default tooltip position */
22
22
  tooltipPosition?: "top" | "bottom" | "left" | "right";
23
23
  /** The value of the checkbox, passed on form submit */
24
24
  value?: string;
@@ -70,6 +70,13 @@ const Checkbox = exports.Checkbox = /*#__PURE__*/_react.default.forwardRef(({
70
70
  deprecateUncontrolledWarnTriggered = true;
71
71
  _logger.default.deprecate("Uncontrolled behaviour in `Checkbox` is deprecated and support will soon be removed. Please make sure all your inputs are controlled.");
72
72
  }
73
+ const commonProps = {
74
+ fieldHelpInline,
75
+ labelSpacing,
76
+ labelHelp,
77
+ fieldHelp
78
+ };
79
+ const isInGroup = Object.keys(checkboxGroupContext).length !== 0;
73
80
  const inputProps = {
74
81
  ariaLabelledBy,
75
82
  onClick,
@@ -83,28 +90,23 @@ const Checkbox = exports.Checkbox = /*#__PURE__*/_react.default.forwardRef(({
83
90
  type: "checkbox",
84
91
  name,
85
92
  reverse: !reverse,
86
- fieldHelp,
87
93
  autoFocus,
88
- labelHelp,
89
- labelSpacing,
90
94
  required,
91
95
  isOptional,
92
- fieldHelpInline,
93
96
  checked,
94
97
  disabled,
95
98
  inputWidth,
96
99
  labelWidth,
97
100
  ref,
98
- ...rest
101
+ ...rest,
102
+ ...(isInGroup && validationRedesignOptIn ? {} : {
103
+ ...commonProps
104
+ })
99
105
  };
100
106
  const validationProps = {
101
107
  error: contextError || error,
102
108
  warning: contextWarning || warning,
103
- ...(validationRedesignOptIn ? {
104
- validationOnLabel: false
105
- } : {
106
- info: contextInfo || info
107
- })
109
+ info: contextInfo || info
108
110
  };
109
111
  const marginProps = (0, _useFormSpacing.default)(rest);
110
112
  const componentToRender = /*#__PURE__*/_react.default.createElement(_checkbox.default, _extends({
@@ -50,11 +50,12 @@ const StyledCheckbox = _styledComponents.default.div`
50
50
  ${!disabled && (0, _styledComponents.css)`
51
51
  border: 1px solid var(--colorsUtilityMajor300);
52
52
 
53
- ${info && `border: 1px solid var(--colorsSemanticInfo500);`}
54
- ${warning && `border: 1px solid var(--colorsSemanticCaution500);`}
55
53
  ${error && `border: 2px solid var(--colorsSemanticNegative500);`}
56
54
 
57
- ${warning && applyNewValidation && `border: 1px solid var(--colorsUtilityMajor300);`}
55
+ ${!applyNewValidation && (0, _styledComponents.css)`
56
+ ${info && `border: 1px solid var(--colorsSemanticInfo500);`}
57
+ ${warning && `border: 1px solid var(--colorsSemanticCaution500);`}
58
+ `}
58
59
  `}
59
60
  }
60
61
 
@@ -127,7 +127,10 @@ const StyledMenuItemWrapper = _styledComponents.default.a.attrs({
127
127
  }
128
128
 
129
129
  ${!maxWidth && (0, _styledComponents.css)`
130
- :has([data-component="icon"]):not(:has(button)) ${_link.StyledContent} {
130
+ a:has([data-component="icon"]):not(:has(button))
131
+ ${_link.StyledContent},
132
+ button:has([data-component="icon"]):not(:has(button))
133
+ ${_link.StyledContent} {
131
134
  position: relative;
132
135
  top: -2px;
133
136
  }
@@ -32,10 +32,6 @@ const Note = ({
32
32
  ...rest
33
33
  }) => {
34
34
  !(width > 0) ? process.env.NODE_ENV !== "production" ? (0, _invariant.default)(false, "<Note> width must be greater than 0") : (0, _invariant.default)(false) : void 0;
35
- !createdDate ? process.env.NODE_ENV !== "production" ? (0, _invariant.default)(false, "<Note> createdDate is required") : (0, _invariant.default)(false) : void 0;
36
- !noteContent ? process.env.NODE_ENV !== "production" ? (0, _invariant.default)(false, "<Note> noteContent is required") : (0, _invariant.default)(false) : void 0;
37
- !(!status || status.text) ? process.env.NODE_ENV !== "production" ? (0, _invariant.default)(false, "<Note> status.text is required") : (0, _invariant.default)(false) : void 0;
38
- !(!status || status.timeStamp) ? process.env.NODE_ENV !== "production" ? (0, _invariant.default)(false, "<Note> status.timeStamp is required") : (0, _invariant.default)(false) : void 0;
39
35
  !(!inlineControl || /*#__PURE__*/_react.default.isValidElement(inlineControl) && inlineControl.type === _actionPopover.ActionPopover) ? process.env.NODE_ENV !== "production" ? (0, _invariant.default)(false, "<Note> inlineControl must be an instance of <ActionPopover>") : (0, _invariant.default)(false) : void 0;
40
36
  const renderStatus = () => {
41
37
  if (!status) {
@@ -15,8 +15,8 @@ export interface RadioButtonGroupProps extends ValidationProps, MarginProps {
15
15
  /** The content for the RadioGroup Legend */
16
16
  legend?: string;
17
17
  /**
18
- * The content for the RadioButtonGroup Legend Help tooltip,
19
- * will be rendered as hint text when `validationRedesignOptIn` is true.
18
+ * The content for the RadioButtonGroup hint text,
19
+ * will only be rendered when `validationRedesignOptIn` is true.
20
20
  */
21
21
  legendHelp?: string;
22
22
  /** [Legacy] Text alignment of legend when inline */
@@ -69,11 +69,7 @@ const RadioButtonGroup = props => {
69
69
  legend: legend,
70
70
  error: error,
71
71
  warning: warning,
72
- info: info,
73
72
  inline: inlineLegend,
74
- legendWidth: legendWidth,
75
- legendAlign: legendAlign,
76
- legendSpacing: legendSpacing,
77
73
  isRequired: required,
78
74
  isOptional: isOptional
79
75
  }, (0, _tags.default)("radiogroup", props), marginProps, {
@@ -91,8 +87,7 @@ const RadioButtonGroup = props => {
91
87
  }), /*#__PURE__*/_react.default.createElement(_radioButtonGroup.default, {
92
88
  "data-component": "radio-button-group",
93
89
  role: "radiogroup",
94
- inline: inline,
95
- legendInline: inlineLegend
90
+ inline: inline
96
91
  }, /*#__PURE__*/_react.default.createElement(_radioButtonMapper.default, {
97
92
  name: name,
98
93
  onBlur: onBlur,
@@ -107,8 +102,6 @@ const RadioButtonGroup = props => {
107
102
  labelSpacing,
108
103
  error: !!error,
109
104
  warning: !!warning,
110
- info: !!info,
111
- required,
112
105
  ...child.props
113
106
  });
114
107
  }))))) : /*#__PURE__*/_react.default.createElement(_tooltipProvider.TooltipProvider, {
@@ -15,9 +15,9 @@ export interface RadioButtonProps extends Omit<CommonCheckableInputProps, "requi
15
15
  onClick?: (ev: React.MouseEvent<HTMLInputElement>) => void;
16
16
  /** the value of the Radio Button, passed on form submit */
17
17
  value: string;
18
- /** Overrides the default tooltip position */
18
+ /** [Legacy] Overrides the default tooltip position */
19
19
  tooltipPosition?: "top" | "bottom" | "left" | "right";
20
- /** Aria label for rendered help component */
20
+ /** [Legacy] Aria label for rendered help component */
21
21
  helpAriaLabel?: string;
22
22
  }
23
23
  export declare const RadioButton: React.ForwardRefExoticComponent<RadioButtonProps & InternalRadioButtonProps & React.RefAttributes<HTMLInputElement>>;
@@ -61,34 +61,31 @@ const RadioButton = exports.RadioButton = /*#__PURE__*/_react.default.forwardRef
61
61
  event.target.focus();
62
62
  }, [onChange]);
63
63
  const validationProps = {
64
- disabled,
65
- inputWidth,
66
64
  error,
67
65
  warning,
68
66
  info
69
67
  };
70
68
  const commonProps = {
71
- ...validationProps,
72
69
  fieldHelpInline,
73
- labelSpacing
70
+ labelHelp,
71
+ fieldHelp
74
72
  };
75
73
  const inputProps = {
76
- ...(validationRedesignOptIn ? {
77
- ...validationProps
78
- } : {
74
+ ...(!validationRedesignOptIn && {
79
75
  ...commonProps
80
76
  }),
81
77
  autoFocus,
82
78
  checked,
83
- fieldHelp,
84
79
  name,
85
80
  onChange: handleChange,
86
81
  onBlur,
87
82
  onFocus,
88
83
  labelInline: true,
89
84
  labelWidth,
85
+ labelSpacing,
90
86
  label,
91
- labelHelp,
87
+ disabled,
88
+ inputWidth,
92
89
  id,
93
90
  value,
94
91
  type: "radio",
@@ -109,13 +106,12 @@ const RadioButton = exports.RadioButton = /*#__PURE__*/_react.default.forwardRef
109
106
  "data-element": dataElement,
110
107
  inline: inline,
111
108
  reverse: reverse,
112
- size: size
113
- }, validationRedesignOptIn ? {
114
- ...validationProps
115
- } : {
116
- ...commonProps,
117
- fieldHelp
118
- }, marginProps), /*#__PURE__*/_react.default.createElement(_checkableInput.default, inputProps, /*#__PURE__*/_react.default.createElement(_radioButtonSvg.default, null)));
109
+ size: size,
110
+ disabled: disabled,
111
+ inputWidth: inputWidth,
112
+ labelSpacing: labelSpacing,
113
+ fieldHelpInline: fieldHelpInline
114
+ }, validationProps, marginProps), /*#__PURE__*/_react.default.createElement(_checkableInput.default, _extends({}, inputProps, validationProps), /*#__PURE__*/_react.default.createElement(_radioButtonSvg.default, null)));
119
115
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, validationRedesignOptIn ? componentToRender : /*#__PURE__*/_react.default.createElement(_tooltipProvider.TooltipProvider, {
120
116
  helpAriaLabel: helpAriaLabel,
121
117
  tooltipPosition: tooltipPosition
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "carbon-react",
3
- "version": "142.3.0",
3
+ "version": "142.3.2",
4
4
  "description": "A library of reusable React components for easily building user interfaces.",
5
5
  "files": [
6
6
  "lib",