@thecb/components 11.10.2-beta.2 → 11.10.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.
- package/dist/index.cjs.js +12 -15
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +12 -15
- package/dist/index.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/atoms/formatted-bank-account/FormattedBankAccount.js +2 -2
- package/src/components/atoms/formatted-bank-account/FormattedBankAccount.theme.js +2 -2
- package/src/components/atoms/formatted-credit-card/FormattedCreditCard.js +2 -2
- package/src/components/atoms/formatted-credit-card/FormattedCreditCard.theme.js +2 -2
- package/src/components/molecules/email-form/EmailForm.js +2 -1
- package/src/components/molecules/email-form/EmailForm.stories.js +210 -0
- package/src/components/molecules/forgot-password-form/ForgotPasswordForm.js +2 -1
- package/src/components/molecules/login-form/LoginForm.js +2 -1
- package/src/components/molecules/registration-form/RegistrationForm.js +2 -1
- package/src/util/formats.js +3 -6
package/dist/index.esm.js
CHANGED
|
@@ -26301,7 +26301,7 @@ var FormattedAddress = function FormattedAddress(_ref) {
|
|
|
26301
26301
|
var FormattedAddress$1 = themeComponent(FormattedAddress, "FormattedAddress", fallbackValues$n, "default");
|
|
26302
26302
|
|
|
26303
26303
|
var textColor$1 = "".concat(CHARADE_GREY);
|
|
26304
|
-
var autopayTextColor = "".concat(
|
|
26304
|
+
var autopayTextColor = "".concat(REGENT_GREY);
|
|
26305
26305
|
var fallbackValues$o = {
|
|
26306
26306
|
textColor: textColor$1,
|
|
26307
26307
|
autopayTextColor: autopayTextColor
|
|
@@ -26337,8 +26337,8 @@ var FormattedBankAccount = function FormattedBankAccount(_ref2) {
|
|
|
26337
26337
|
}, "Savings Account ending in ", lastFour), autoPay && /*#__PURE__*/React__default.createElement(Text$1, {
|
|
26338
26338
|
variant: "p",
|
|
26339
26339
|
color: themeValues.autopayTextColor,
|
|
26340
|
-
extraStyles: "font-style: italic;
|
|
26341
|
-
}, "Autopay
|
|
26340
|
+
extraStyles: "font-style: italic;"
|
|
26341
|
+
}, "Autopay Enabled")));
|
|
26342
26342
|
};
|
|
26343
26343
|
var FormattedBankAccount$1 = themeComponent(FormattedBankAccount, "FormattedBankAccount", fallbackValues$o);
|
|
26344
26344
|
|
|
@@ -26387,7 +26387,7 @@ var CardType = function CardType(_ref) {
|
|
|
26387
26387
|
};
|
|
26388
26388
|
|
|
26389
26389
|
var textColor$2 = "".concat(CHARADE_GREY);
|
|
26390
|
-
var autopayTextColor$1 = "".concat(
|
|
26390
|
+
var autopayTextColor$1 = "".concat(REGENT_GREY);
|
|
26391
26391
|
var fallbackValues$p = {
|
|
26392
26392
|
textColor: textColor$2,
|
|
26393
26393
|
autopayTextColor: autopayTextColor$1
|
|
@@ -26416,15 +26416,13 @@ var renderCardStatus = function renderCardStatus(expirationStatus, expireDate) {
|
|
|
26416
26416
|
return /*#__PURE__*/React__default.createElement(Text$1, {
|
|
26417
26417
|
as: as,
|
|
26418
26418
|
variant: "pXS",
|
|
26419
|
-
|
|
26420
|
-
color: STORM_GREY,
|
|
26419
|
+
color: ASH_GREY,
|
|
26421
26420
|
extraStyles: "text-align: ".concat(textAlign, "; margin: ").concat(textMargin, ";")
|
|
26422
26421
|
}, "Exp Date ", expireDate);
|
|
26423
26422
|
case EXPIRING_SOON:
|
|
26424
26423
|
return /*#__PURE__*/React__default.createElement(Text$1, {
|
|
26425
26424
|
as: as,
|
|
26426
26425
|
variant: "pXS",
|
|
26427
|
-
fontSize: ".75rem",
|
|
26428
26426
|
color: FIRE_YELLOW,
|
|
26429
26427
|
extraStyles: "text-align: ".concat(textAlign, "; margin: ").concat(textMargin, ";")
|
|
26430
26428
|
}, "Expiring Soon ", expireDate);
|
|
@@ -26432,8 +26430,7 @@ var renderCardStatus = function renderCardStatus(expirationStatus, expireDate) {
|
|
|
26432
26430
|
return /*#__PURE__*/React__default.createElement(Text$1, {
|
|
26433
26431
|
as: as,
|
|
26434
26432
|
variant: "pXS",
|
|
26435
|
-
|
|
26436
|
-
color: STORM_GREY,
|
|
26433
|
+
color: ASH_GREY,
|
|
26437
26434
|
extraStyles: "text-align: ".concat(textAlign, "; margin: ").concat(textMargin, ";")
|
|
26438
26435
|
}, "Expired");
|
|
26439
26436
|
}
|
|
@@ -26486,8 +26483,8 @@ var FormattedCreditCard = function FormattedCreditCard(_ref) {
|
|
|
26486
26483
|
}, "Card ending in ".concat(lastFour)), expireDate && /*#__PURE__*/React__default.createElement(Fragment$1, null, renderCardStatus(expirationStatus, expireDate, "left", "p"))), autoPay && /*#__PURE__*/React__default.createElement(Text$1, {
|
|
26487
26484
|
variant: "p",
|
|
26488
26485
|
color: themeValues.autopayTextColor,
|
|
26489
|
-
extraStyles: "font-style: italic;
|
|
26490
|
-
}, "Autopay
|
|
26486
|
+
extraStyles: "font-style: italic;"
|
|
26487
|
+
}, "Autopay Enabled")));
|
|
26491
26488
|
};
|
|
26492
26489
|
var FormattedCreditCard$1 = themeComponent(FormattedCreditCard, "FormattedCreditCard", fallbackValues$p);
|
|
26493
26490
|
|
|
@@ -41170,7 +41167,7 @@ var EmailForm = function EmailForm(_ref) {
|
|
|
41170
41167
|
}, []);
|
|
41171
41168
|
}
|
|
41172
41169
|
useConditionallyAddValidator(isRequired, required, actions.fields.email.addValidator, actions.fields.email.removeValidator);
|
|
41173
|
-
var emailFieldErrorMessages = _defineProperty(_defineProperty({}, required.error, "Email address is required"), isProbablyEmail.error, "
|
|
41170
|
+
var emailFieldErrorMessages = _defineProperty(_defineProperty({}, required.error, "Email address is required"), isProbablyEmail.error, "Please enter a valid email address in the format user@example.com");
|
|
41174
41171
|
return /*#__PURE__*/React__default.createElement(FormContainer$1, {
|
|
41175
41172
|
variant: variant,
|
|
41176
41173
|
role: "form",
|
|
@@ -41262,7 +41259,7 @@ var ForgotPasswordForm = function ForgotPasswordForm(_ref) {
|
|
|
41262
41259
|
};
|
|
41263
41260
|
}, []);
|
|
41264
41261
|
}
|
|
41265
|
-
var EmailErrorMessages = _defineProperty(_defineProperty({}, required.error, "Email address is required"), isProbablyEmail.error, "
|
|
41262
|
+
var EmailErrorMessages = _defineProperty(_defineProperty({}, required.error, "Email address is required"), isProbablyEmail.error, "Please enter a valid email address in the format user@example.com");
|
|
41266
41263
|
return /*#__PURE__*/React__default.createElement(FormInput$1, {
|
|
41267
41264
|
labelTextWhenNoError: "Email address",
|
|
41268
41265
|
errorMessages: EmailErrorMessages,
|
|
@@ -45961,7 +45958,7 @@ var LoginForm = function LoginForm(_ref) {
|
|
|
45961
45958
|
};
|
|
45962
45959
|
}, []);
|
|
45963
45960
|
}
|
|
45964
|
-
var emailErrorMessages = _defineProperty(_defineProperty({}, required.error, "Email address is required"), isProbablyEmail.error, "
|
|
45961
|
+
var emailErrorMessages = _defineProperty(_defineProperty({}, required.error, "Email address is required"), isProbablyEmail.error, "Please enter a valid email address in the format user@example.com");
|
|
45965
45962
|
var passwordErrorMessages = _defineProperty({}, required.error, "Password is required");
|
|
45966
45963
|
return /*#__PURE__*/React__default.createElement(FormInputColumn, {
|
|
45967
45964
|
role: "form",
|
|
@@ -49334,7 +49331,7 @@ var RegistrationForm = function RegistrationForm(_ref) {
|
|
|
49334
49331
|
}
|
|
49335
49332
|
var firstNameErrorMessages = _defineProperty(_defineProperty({}, required.error, "First name is required"), validName.error, "First name contains invalid characters");
|
|
49336
49333
|
var lastNameErrorMessages = _defineProperty(_defineProperty({}, required.error, "Last name is required"), validName.error, "Last name contains invalid characters");
|
|
49337
|
-
var emailErrorMessages = _defineProperty(_defineProperty({}, required.error, "Email is required"), isProbablyEmail.error, "
|
|
49334
|
+
var emailErrorMessages = _defineProperty(_defineProperty({}, required.error, "Email is required"), isProbablyEmail.error, "Please enter a valid email address in the format user@example.com");
|
|
49338
49335
|
var passwordErrorMessages = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, required.error, "Password is required"), hasLength.error, "Password must have at least 8 characters"), hasNumber.error, "Password must contain at least one number"), hasLowercaseLetter.error, "Password must contain at least one lowercase letter"), hasUppercaseLetter.error, "Password must contain at least one uppercase letter"), hasSpecialCharacter.error, "Password must contain at least one special character (!@#$%^&*.?)");
|
|
49339
49336
|
var confirmPasswordErrorMessages = _defineProperty({}, matchesField.error, "Confirm password must match password");
|
|
49340
49337
|
return /*#__PURE__*/React__default.createElement(FormInputColumn, {
|