@thecb/components 12.0.0 → 12.0.1

package/dist/index.esm.js

@@ -22111,7 +22111,7 @@ var ENTER = 13;
 var ESCAPE = 27;
 var SPACEBAR = 32;
 
-var _excluded$x = ["title", "name", "checked", "onChange", "disabled", "themeValues", "hidden", "error", "checkboxMargin", "extraStyles", "textExtraStyles", "labelledById", "dataQa", "checkboxExtraStyles", "hasIconOverride", "icon"];
+var _excluded$x = ["title", "name", "checked", "onChange", "disabled", "themeValues", "hidden", "error", "isRequired", "checkboxMargin", "extraStyles", "textExtraStyles", "labelledById", "dataQa", "checkboxExtraStyles", "hasIconOverride", "icon"];
 var CheckboxContainer = styled.span.withConfig({
   displayName: "Checkbox__CheckboxContainer",
   componentId: "sc-36kqbv-0"
@@ -22170,6 +22170,8 @@ var Checkbox = /*#__PURE__*/forwardRef(function (_ref5, ref) {
     hidden = _ref5$hidden === void 0 ? false : _ref5$hidden,
     _ref5$error = _ref5.error,
     error = _ref5$error === void 0 ? false : _ref5$error,
+    _ref5$isRequired = _ref5.isRequired,
+    isRequired = _ref5$isRequired === void 0 ? false : _ref5$isRequired,
     _ref5$checkboxMargin = _ref5.checkboxMargin,
     checkboxMargin = _ref5$checkboxMargin === void 0 ? "0 16px 0 0" : _ref5$checkboxMargin,
     extraStyles = _ref5.extraStyles,
@@ -22198,6 +22200,13 @@ var Checkbox = /*#__PURE__*/forwardRef(function (_ref5, ref) {
     ref: ref,
     padding: "0",
     tabIndex: "0",
+    role: "checkbox",
+    "aria-checked": checked,
+    "aria-required": isRequired || undefined,
+    "aria-invalid": error,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledById,
+    "aria-describedby": error ? "".concat(name, "-error-message") : undefined,
     onFocus: function onFocus() {
       return setFocused(true);
     },
@@ -22218,19 +22227,16 @@ var Checkbox = /*#__PURE__*/forwardRef(function (_ref5, ref) {
     id: "checkbox-".concat(name),
     disabled: disabled,
     name: name,
-    "aria-label": ariaLabel,
-    "aria-labelledby": ariaLabelledById,
     checked: checked,
     onChange: onChange,
     tabIndex: "-1",
-    "aria-invalid": error,
-    "aria-describedby": error ? "".concat(name, "-error-message") : ""
+    required: isRequired,
+    "aria-hidden": "true"
   }), /*#__PURE__*/React__default.createElement(StyledCheckbox, {
-    role: "checkbox",
+    "aria-hidden": "true",
     error: error,
     disabled: disabled,
     checked: checked,
-    "aria-checked": checked,
     focused: focused,
     defaultStyles: themeValues.defaultStyles,
     checkedStyles: themeValues.checkedStyles,
@@ -25967,6 +25973,7 @@ var FormInput = function FormInput(_ref15) {
     "aria-labelledby": ariaLabelledBy === undefined ? createIdFromString(labelTextWhenNoError) : ariaLabelledBy,
     "aria-describedby": createIdFromString(labelTextWhenNoError, "error message"),
     "aria-invalid": field.dirty && field.hasErrors || field.hasErrors && showErrors,
+    "aria-required": isRequired,
     onChange: function onChange(value) {
       return setValue(value);
     },
@@ -25999,6 +26006,7 @@ var FormInput = function FormInput(_ref15) {
     "aria-labelledby": ariaLabelledBy === undefined ? createIdFromString(labelTextWhenNoError) : ariaLabelledBy,
     "aria-describedby": createIdFromString(labelTextWhenNoError, "error message"),
     "aria-invalid": field.dirty && field.hasErrors || field.hasErrors && showErrors,
+    "aria-required": isRequired,
     onChange: function onChange(e) {
       return setValue(e.target.value);
     },
@@ -48161,7 +48169,9 @@ var TermsAndConditionsControlV2 = function TermsAndConditionsControlV2(_ref) {
     _ref$modalTitle = _ref.modalTitle,
     modalTitle = _ref$modalTitle === void 0 ? "Terms and Conditions" : _ref$modalTitle,
     _ref$initialFocusSele = _ref.initialFocusSelector,
-    initialFocusSelector = _ref$initialFocusSele === void 0 ? "" : _ref$initialFocusSele;
+    initialFocusSelector = _ref$initialFocusSele === void 0 ? "" : _ref$initialFocusSele,
+    _ref$isRequired = _ref.isRequired,
+    isRequired = _ref$isRequired === void 0 ? false : _ref$isRequired;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     showTerms = _useState2[0],
@@ -48194,7 +48204,8 @@ var TermsAndConditionsControlV2 = function TermsAndConditionsControlV2(_ref) {
     onChange: onCheck,
     checkboxMargin: checkboxMargin,
     extraStyles: "align-self: flex-start;",
-    labelledById: TermsAndConditionsTitleDivId
+    labelledById: TermsAndConditionsTitleDivId,
+    isRequired: isRequired
   }), /*#__PURE__*/React__default.createElement(Stack, {
     childGap: "0.25rem",
     fullHeight: true
@@ -49352,7 +49363,8 @@ var RegistrationForm = function RegistrationForm(_ref) {
       return e.key === "Enter" && handleSubmit(e);
     },
     autocompleteValue: "given-name",
-    dataQa: "First name"
+    dataQa: "First name",
+    isRequired: true
   }), /*#__PURE__*/React__default.createElement(FormInput$1, {
     labelTextWhenNoError: "Last name",
     errorMessages: lastNameErrorMessages,
@@ -49363,7 +49375,8 @@ var RegistrationForm = function RegistrationForm(_ref) {
       return e.key === "Enter" && handleSubmit(e);
     },
     autocompleteValue: "family-name",
-    dataQa: "Last name"
+    dataQa: "Last name",
+    isRequired: true
   }), /*#__PURE__*/React__default.createElement(FormInput$1, {
     labelTextWhenNoError: "Email address",
     errorMessages: emailErrorMessages,
@@ -49376,7 +49389,8 @@ var RegistrationForm = function RegistrationForm(_ref) {
     type: "email",
     isEmail: true,
     autocompleteValue: "email",
-    dataQa: "Email address"
+    dataQa: "Email address",
+    isRequired: true
   }), /*#__PURE__*/React__default.createElement(FormInput$1, {
     labelTextWhenNoError: "Password",
     errorMessages: passwordErrorMessages,
@@ -49388,7 +49402,8 @@ var RegistrationForm = function RegistrationForm(_ref) {
     },
     type: "password",
     autocompleteValue: "new-password",
-    dataQa: "Password"
+    dataQa: "Password",
+    isRequired: true
   }), /*#__PURE__*/React__default.createElement(FormInput$1, {
     labelTextWhenNoError: "Confirm password",
     errorMessages: confirmPasswordErrorMessages,
@@ -49400,7 +49415,8 @@ var RegistrationForm = function RegistrationForm(_ref) {
     },
     type: "password",
     autocompleteValue: "new-password",
-    dataQa: "Confirm password"
+    dataQa: "Confirm password",
+    isRequired: true
   }), /*#__PURE__*/React__default.createElement(Box, {
     padding: isMobile ? "0" : "0.5rem 0 0"
   }, /*#__PURE__*/React__default.createElement(PasswordRequirements, {