@thecb/components 10.7.2 → 10.7.3

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.
package/dist/index.cjs.js CHANGED
@@ -24998,6 +24998,15 @@ var Dropdown = function Dropdown(_ref13) {
24998
24998
  }
24999
24999
  }
25000
25000
  };
25001
+ var handleOnBlur = function handleOnBlur(inputVal) {
25002
+ var selectedRefExists = selectedRef !== undefined && selectedRef.current !== null;
25003
+ var inputRequired = options.required || isRequired;
25004
+ var hasSelectedValue = value || selectedRefExists;
25005
+ // Select the empty value to trigger a validation error if it's required.
25006
+ if (inputRequired && !hasSelectedValue && inputVal === "") {
25007
+ onSelect("");
25008
+ }
25009
+ };
25001
25010
  React.useEffect(function () {
25002
25011
  var selectedRefExists = selectedRef !== undefined && selectedRef.current !== null;
25003
25012
  if (isOpen && selectedRefExists && !focusedByClick) {
@@ -25096,6 +25105,9 @@ var Dropdown = function Dropdown(_ref13) {
25096
25105
  setInputChangedByAutofill(true);
25097
25106
  }
25098
25107
  },
25108
+ onBlur: function onBlur(e) {
25109
+ return handleOnBlur(e.target.value);
25110
+ },
25099
25111
  padding: "12px 25px 12px 12px",
25100
25112
  placeholder: getSelection(),
25101
25113
  required: options.required || isRequired,
@@ -27037,6 +27049,12 @@ var FormInput = function FormInput(_ref15) {
27037
27049
  }
27038
27050
  return fieldActions.set(value);
27039
27051
  };
27052
+ var handleOnBlur = function handleOnBlur(value) {
27053
+ // Sets the empty value to trigger a validation error if it's required.
27054
+ if (isRequired && value === "") {
27055
+ setValue("");
27056
+ }
27057
+ };
27040
27058
  return /*#__PURE__*/React__default.createElement(Stack, {
27041
27059
  childGap: "0.25rem"
27042
27060
  }, /*#__PURE__*/React__default.createElement(Box, {
@@ -27090,6 +27108,9 @@ var FormInput = function FormInput(_ref15) {
27090
27108
  onChange: function onChange(value) {
27091
27109
  return setValue(value);
27092
27110
  },
27111
+ onBlur: function onBlur(e) {
27112
+ return handleOnBlur(e.target.value);
27113
+ },
27093
27114
  type: type,
27094
27115
  value: field.rawValue,
27095
27116
  pattern: isNum ? "[0-9]*" : "",
@@ -27110,6 +27131,9 @@ var FormInput = function FormInput(_ref15) {
27110
27131
  onChange: function onChange(e) {
27111
27132
  return setValue(e.target.value);
27112
27133
  },
27134
+ onBlur: function onBlur(e) {
27135
+ return handleOnBlur(e.target.value);
27136
+ },
27113
27137
  type: type === "password" && showPassword ? "text" : type,
27114
27138
  value: field.rawValue,
27115
27139
  pattern: isNum ? "[0-9]*" : "",
@@ -48313,9 +48337,9 @@ var PaymentFormACH = function PaymentFormACH(_ref) {
48313
48337
  var showTerms = !!termsContent;
48314
48338
  var nameErrors = _defineProperty({}, required.error, "Name is required");
48315
48339
  var routingNumberErrors = _defineProperty(_defineProperty(_defineProperty({}, required.error, "Routing number is required"), hasLength.error, "Routing number must be 9 digits"), isRoutingNumber.error, "Invalid routing number");
48316
- var confirmRoutingNumberErrors = _defineProperty({}, matchesField.error, "Confirm routing number field must match routing number");
48340
+ var confirmRoutingNumberErrors = _defineProperty(_defineProperty({}, required.error, "Confirm routing number is required"), matchesField.error, "Confirm routing number field must match routing number");
48317
48341
  var accountNumberErrors = _defineProperty(_defineProperty({}, required.error, "Account number is required"), hasLength.error, "Account number must be between 5 and 17 digits");
48318
- var confirmAccountNumberErrors = _defineProperty({}, matchesField.error, "Confirm account number field must match account number");
48342
+ var confirmAccountNumberErrors = _defineProperty(_defineProperty({}, required.error, "Confirm account number is required"), matchesField.error, "Confirm account number field must match account number");
48319
48343
  var accountTypeErrors = _defineProperty({}, required.error, "Account type is required");
48320
48344
  return /*#__PURE__*/React__default.createElement(FormContainer$1, {
48321
48345
  variant: variant,
@@ -48457,7 +48481,7 @@ var formConfig$6 = {
48457
48481
  constraints: [onlyIntegers(), hasLength(0, 9)]
48458
48482
  },
48459
48483
  confirmRoutingNumber: {
48460
- validators: [matchesField("routingNumber")],
48484
+ validators: [required(), matchesField("routingNumber")],
48461
48485
  constraints: [onlyIntegers(), hasLength(0, 9)]
48462
48486
  },
48463
48487
  accountNumber: {
@@ -48465,7 +48489,7 @@ var formConfig$6 = {
48465
48489
  constraints: [onlyIntegers(), hasLength(0, 17)]
48466
48490
  },
48467
48491
  confirmAccountNumber: {
48468
- validators: [matchesField("accountNumber")],
48492
+ validators: [required(), matchesField("accountNumber")],
48469
48493
  constraints: [onlyIntegers(), hasLength(0, 17)]
48470
48494
  },
48471
48495
  accountType: {