@thecb/components 7.6.1-beta.1 → 7.7.0-beta.0

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
@@ -6318,14 +6318,6 @@ var throttle = function throttle(delay, fn) {
6318
6318
  return fn.apply(void 0, arguments);
6319
6319
  };
6320
6320
  };
6321
- var titleCaseWord = function titleCaseWord(word) {
6322
- return word.charAt(0).toUpperCase() + word.slice(1);
6323
- };
6324
- var titleCaseString = function titleCaseString(string) {
6325
- return string.split(" ").map(function (word, index, string) {
6326
- return index === 0 || index === string.length - 1 || word.length > 3 ? titleCaseWord(word.toLowerCase()) : word;
6327
- }).join(" ");
6328
- };
6329
6321
 
6330
6322
  var general = /*#__PURE__*/Object.freeze({
6331
6323
  __proto__: null,
@@ -6343,9 +6335,7 @@ var general = /*#__PURE__*/Object.freeze({
6343
6335
  inputPlaceholderTextStyle: inputPlaceholderTextStyle,
6344
6336
  inputDisabledStyle: inputDisabledStyle,
6345
6337
  MOBILE_WIDTH: MOBILE_WIDTH,
6346
- throttle: throttle,
6347
- titleCaseWord: titleCaseWord,
6348
- titleCaseString: titleCaseString
6338
+ throttle: throttle
6349
6339
  });
6350
6340
 
6351
6341
  var _excluded$1 = ["themeValues", "weight", "color", "textWrap", "extraStyles", "hoverStyles", "onClick", "onKeyPress", "as", "dataQa", "children", "variant"];
@@ -44646,10 +44636,6 @@ var NavMenuMobile = function NavMenuMobile(_ref) {
44646
44636
 
44647
44637
  var NavMenuMobile$1 = themeComponent(NavMenuMobile, "NavMenu", fallbackValues$E, "profile");
44648
44638
 
44649
- var ACH_METHOD = "BANK_ACCOUNT";
44650
- var CC_METHOD = "CREDIT_CARD";
44651
- var CASH_METHOD = "CASH";
44652
-
44653
44639
  var IconsModule = function IconsModule(_ref) {
44654
44640
  var icon = _ref.icon,
44655
44641
  iconDefault = _ref.iconDefault,
@@ -44729,27 +44715,13 @@ var AutopayModal = function AutopayModal(_ref) {
44729
44715
  isPaymentPlan = _ref.isPaymentPlan,
44730
44716
  nextAutopayDate = _ref.nextAutopayDate,
44731
44717
  dueDate = _ref.dueDate,
44732
- inactive = _ref.inactive,
44733
- description = _ref.description,
44734
- subDescription = _ref.subDescription,
44735
- allowedPaymentInstruments = _ref.allowedPaymentInstruments;
44736
-
44737
- var generateMethodNeededText = function generateMethodNeededText(planText, allowedPaymentInstruments) {
44738
- var allowsCard = allowedPaymentInstruments.includes(CC_METHOD);
44739
- var allowsACH = allowedPaymentInstruments.includes(ACH_METHOD);
44740
- var methodRequired = allowsCard && !allowsACH ? "debit or credit card payment method" : !allowsCard && allowsACH ? "checking account payment method" : "payment method";
44741
- return "To setup ".concat(planText, " you must have a saved ").concat(methodRequired, " and address in your profile. Do you want to save these now?");
44742
- };
44743
-
44744
- var plan = isPaymentPlan ? "your payment plan" : "autopay";
44745
- var shortPlan = isPaymentPlan ? "Payment Plan" : "Autopay";
44746
- var deactivateText = "deactivate ".concat(shortPlan, " for ").concat(description, ": ").concat(subDescription);
44747
- var activateText = "Set Up ".concat(shortPlan, " for ").concat(description, ": ").concat(subDescription);
44718
+ inactive = _ref.inactive;
44719
+ var planType = isPaymentPlan ? "Payment Plan" : "Autopay";
44748
44720
  var nextDate = dueDate || nextAutopayDate;
44749
44721
  var modalExtraProps = {
44750
- modalHeaderText: autoPayActive ? titleCaseString(deactivateText) : titleCaseString(activateText),
44751
- modalBodyText: autoPayActive ? "Are you sure you want to deactivate ".concat(plan, "? ").concat(!inactive && nextDate ? "Your next payment will be due on ".concat(nextDate, ".") : "") : generateMethodNeededText(plan, allowedPaymentInstruments),
44752
- continueButtonText: autoPayActive ? "Disable ".concat(shortPlan) : "Add to Profile",
44722
+ modalHeaderText: autoPayActive ? "Deactivate ".concat(planType) : "Set Up ".concat(planType),
44723
+ modalBodyText: autoPayActive ? "Are you sure you want to deactivate ".concat(isPaymentPlan ? "your payment plan" : "autopay", "? ").concat(!inactive && nextDate ? "Your next payment will be due on ".concat(nextDate, ".") : "") : "To set up ".concat(isPaymentPlan ? "a payment plan" : "autopay", " you must save a payment method and address in your profile. Do you want to save these now?"),
44724
+ continueButtonText: autoPayActive ? "Disable ".concat(planType) : "Add to Profile",
44753
44725
  useDangerButton: autoPayActive,
44754
44726
  continueAction: autoPayActive ? function () {
44755
44727
  deactivatePaymentSchedule(isPaymentPlan ? paymentPlanSchedule : autoPaySchedule, isPaymentPlan);
@@ -44765,7 +44737,7 @@ var AutopayModal = function AutopayModal(_ref) {
44765
44737
  case "secondary":
44766
44738
  {
44767
44739
  return /*#__PURE__*/React__default.createElement(ButtonWithAction, {
44768
- text: autoPayActive ? "Turn off ".concat(shortPlan) : "Set Up ".concat(shortPlan),
44740
+ text: autoPayActive ? "Turn off ".concat(planType) : "Set Up ".concat(planType),
44769
44741
  variant: "secondary",
44770
44742
  action: function action() {
44771
44743
  toggleModal(true);
@@ -44778,7 +44750,7 @@ var AutopayModal = function AutopayModal(_ref) {
44778
44750
  case "tertiary":
44779
44751
  {
44780
44752
  return /*#__PURE__*/React__default.createElement(ButtonWithAction, {
44781
- text: autoPayActive ? "Manage ".concat(shortPlan) : "Set Up ".concat(shortPlan),
44753
+ text: autoPayActive ? "Manage ".concat(planType) : "Set Up ".concat(planType),
44782
44754
  variant: "tertiary",
44783
44755
  action: function action() {
44784
44756
  toggleModal(true);
@@ -44810,12 +44782,12 @@ var AutopayModal = function AutopayModal(_ref) {
44810
44782
  e.key === "Enter" && toggleModal(true);
44811
44783
  },
44812
44784
  tabIndex: "0",
44813
- dataQa: "".concat(shortPlan, " On"),
44785
+ dataQa: "".concat(planType, " On"),
44814
44786
  color: SEA_GREEN,
44815
44787
  weight: themeValues.fontWeight,
44816
44788
  hoverStyles: themeValues.modalLinkHoverFocus,
44817
44789
  extraStyles: "padding-left: 0.25rem;"
44818
- }, "".concat(shortPlan, " ").concat(nextAutopayDate))));
44790
+ }, "".concat(planType, " ").concat(nextAutopayDate))));
44819
44791
  }
44820
44792
  }
44821
44793
  };
@@ -44842,10 +44814,7 @@ var AmountModule = function AmountModule(_ref) {
44842
44814
  autoPaySchedule = _ref.autoPaySchedule,
44843
44815
  paymentPlanSchedule = _ref.paymentPlanSchedule,
44844
44816
  isPaymentPlan = _ref.isPaymentPlan,
44845
- nextAutopayDate = _ref.nextAutopayDate,
44846
- description = _ref.description,
44847
- subDescription = _ref.subDescription,
44848
- allowedPaymentInstruments = _ref.allowedPaymentInstruments;
44817
+ nextAutopayDate = _ref.nextAutopayDate;
44849
44818
 
44850
44819
  var _useState = React.useState(false),
44851
44820
  _useState2 = _slicedToArray(_useState, 2),
@@ -44874,10 +44843,7 @@ var AmountModule = function AmountModule(_ref) {
44874
44843
  paymentPlanSchedule: paymentPlanSchedule,
44875
44844
  isPaymentPlan: isPaymentPlan,
44876
44845
  nextAutopayDate: nextAutopayDate,
44877
- controlType: "link",
44878
- description: description,
44879
- subDescription: subDescription,
44880
- allowedPaymentInstruments: allowedPaymentInstruments
44846
+ controlType: "link"
44881
44847
  })));
44882
44848
  };
44883
44849
 
@@ -44896,10 +44862,7 @@ var PaymentDetailsActions = function PaymentDetailsActions(_ref) {
44896
44862
  isPaymentPlan = _ref.isPaymentPlan,
44897
44863
  nextAutopayDate = _ref.nextAutopayDate,
44898
44864
  obligationAssocID = _ref.obligationAssocID,
44899
- dueDate = _ref.dueDate,
44900
- description = _ref.description,
44901
- subDescription = _ref.subDescription,
44902
- allowedPaymentInstruments = _ref.allowedPaymentInstruments;
44865
+ dueDate = _ref.dueDate;
44903
44866
  var planType = isPaymentPlan ? "Payment Plan" : "Autopay";
44904
44867
 
44905
44868
  var _useState = React.useState(false),
@@ -44955,10 +44918,7 @@ var PaymentDetailsActions = function PaymentDetailsActions(_ref) {
44955
44918
  autoPaySchedule: autoPaySchedule,
44956
44919
  paymentPlanSchedule: paymentPlanSchedule,
44957
44920
  isPaymentPlan: isPaymentPlan,
44958
- nextAutopayDate: nextAutopayDate,
44959
- description: description,
44960
- subDescription: subDescription,
44961
- allowedPaymentInstruments: allowedPaymentInstruments
44921
+ nextAutopayDate: nextAutopayDate
44962
44922
  }))), /*#__PURE__*/React__default.createElement(Box, {
44963
44923
  padding: isMobile ? "16px" : "0"
44964
44924
  }, /*#__PURE__*/React__default.createElement(Cluster, {
@@ -44998,10 +44958,7 @@ var PaymentDetailsActions = function PaymentDetailsActions(_ref) {
44998
44958
  paymentPlanSchedule: paymentPlanSchedule,
44999
44959
  isPaymentPlan: isPaymentPlan,
45000
44960
  nextAutopayDate: nextAutopayDate,
45001
- dueDate: dueDate,
45002
- description: description,
45003
- subDescription: subDescription,
45004
- allowedPaymentInstruments: allowedPaymentInstruments
44961
+ dueDate: dueDate
45005
44962
  })), !isMobile && /*#__PURE__*/React__default.createElement(Box, {
45006
44963
  padding: "0"
45007
44964
  }, /*#__PURE__*/React__default.createElement(ButtonWithAction, {
@@ -45091,10 +45048,7 @@ var InactiveControlsModule = function InactiveControlsModule(_ref) {
45091
45048
  dueDate = _ref.dueDate,
45092
45049
  agencyName = _ref.agencyName,
45093
45050
  configType = _ref.configType,
45094
- actions = _ref.actions,
45095
- description = _ref.description,
45096
- subDescription = _ref.subDescription,
45097
- allowedPaymentInstruments = _ref.allowedPaymentInstruments;
45051
+ actions = _ref.actions;
45098
45052
 
45099
45053
  var _useState = React.useState(false),
45100
45054
  _useState2 = _slicedToArray(_useState, 2),
@@ -45133,10 +45087,7 @@ var InactiveControlsModule = function InactiveControlsModule(_ref) {
45133
45087
  obligationAssocID: obligationAssocID,
45134
45088
  dueDate: dueDate,
45135
45089
  controlType: "secondary",
45136
- inactive: true,
45137
- description: description,
45138
- subDescription: subDescription,
45139
- allowedPaymentInstruments: allowedPaymentInstruments
45090
+ inactive: true
45140
45091
  })), /*#__PURE__*/React__default.createElement(Box, {
45141
45092
  padding: "0",
45142
45093
  extraStyles: "flex-grow: 1;"
@@ -45178,7 +45129,7 @@ var InactiveTitleModule = function InactiveTitleModule(_ref) {
45178
45129
  };
45179
45130
 
45180
45131
  var Obligation = function Obligation(_ref) {
45181
- var _obligations$, _firstObligation$cust;
45132
+ var _firstObligation$cust, _firstObligation$desc, _firstObligation$subD;
45182
45133
 
45183
45134
  var config = _ref.config,
45184
45135
  obligations = _ref.obligations,
@@ -45213,13 +45164,7 @@ var Obligation = function Obligation(_ref) {
45213
45164
  The top level desc/subdesc for all obligations in a collection is the same
45214
45165
  (Collection accounts look different in the Account Details page)
45215
45166
  */
45216
- var firstObligation = (_obligations$ = obligations === null || obligations === void 0 ? void 0 : obligations[0]) !== null && _obligations$ !== void 0 ? _obligations$ : {};
45217
- var _firstObligation$allo = firstObligation.allowedPaymentInstruments,
45218
- allowedPaymentInstruments = _firstObligation$allo === void 0 ? [CASH_METHOD, CC_METHOD, ACH_METHOD] : _firstObligation$allo,
45219
- _firstObligation$desc = firstObligation.description,
45220
- description = _firstObligation$desc === void 0 ? "Account" : _firstObligation$desc,
45221
- _firstObligation$subD = firstObligation.subDescription,
45222
- subDescription = _firstObligation$subD === void 0 ? obligationAssocID : _firstObligation$subD;
45167
+ var firstObligation = obligations[0];
45223
45168
  var customAttributes = (_firstObligation$cust = firstObligation === null || firstObligation === void 0 ? void 0 : firstObligation.customAttributes) !== null && _firstObligation$cust !== void 0 ? _firstObligation$cust : {};
45224
45169
  var boxShadowValue = "0px 2px 4px rgba(41, 42, 51, 0.1), 0px 1px 1px 2px rgba(41, 42, 51, 0.1);";
45225
45170
  var activeObligation = /*#__PURE__*/React__default.createElement(Box, {
@@ -45227,7 +45172,7 @@ var Obligation = function Obligation(_ref) {
45227
45172
  borderRadius: "4px",
45228
45173
  boxShadow: boxShadowValue,
45229
45174
  as: "section",
45230
- "aria-label": "".concat(description, " - ").concat(subDescription),
45175
+ "aria-label": "".concat((_firstObligation$desc = firstObligation === null || firstObligation === void 0 ? void 0 : firstObligation.description) !== null && _firstObligation$desc !== void 0 ? _firstObligation$desc : "account", " ").concat((_firstObligation$subD = firstObligation === null || firstObligation === void 0 ? void 0 : firstObligation.subDescription) !== null && _firstObligation$subD !== void 0 ? _firstObligation$subD : obligationAssocID),
45231
45176
  border: "1px solid ".concat(GRECIAN_GREY),
45232
45177
  borderWidthOverride: "1px 0 0 0"
45233
45178
  }, /*#__PURE__*/React__default.createElement(Box, {
@@ -45256,8 +45201,8 @@ var Obligation = function Obligation(_ref) {
45256
45201
  iconValue: config.iconValue,
45257
45202
  customAttributes: customAttributes
45258
45203
  }), /*#__PURE__*/React__default.createElement(TitleModule, {
45259
- title: description,
45260
- subtitle: subDescription,
45204
+ title: firstObligation === null || firstObligation === void 0 ? void 0 : firstObligation.description,
45205
+ subtitle: firstObligation === null || firstObligation === void 0 ? void 0 : firstObligation.subDescription,
45261
45206
  titleColor: BRIGHT_GREY,
45262
45207
  isMobile: isMobile
45263
45208
  }))), !isMobile && /*#__PURE__*/React__default.createElement(AmountModule, {
@@ -45271,10 +45216,7 @@ var Obligation = function Obligation(_ref) {
45271
45216
  autoPaySchedule: autoPaySchedule,
45272
45217
  paymentPlanSchedule: paymentPlanSchedule,
45273
45218
  isPaymentPlan: isPaymentPlan,
45274
- nextAutopayDate: nextAutopayDate,
45275
- description: description,
45276
- subDescription: subDescription,
45277
- allowedPaymentInstruments: allowedPaymentInstruments
45219
+ nextAutopayDate: nextAutopayDate
45278
45220
  }))), !isMobile && /*#__PURE__*/React__default.createElement(PaymentDetailsActions, {
45279
45221
  obligations: obligations,
45280
45222
  autoPayEnabled: autoPayEnabled,
@@ -45289,10 +45231,7 @@ var Obligation = function Obligation(_ref) {
45289
45231
  isMobile: isMobile,
45290
45232
  isPaymentPlan: isPaymentPlan,
45291
45233
  nextAutopayDate: nextAutopayDate,
45292
- obligationAssocID: obligationAssocID,
45293
- description: description,
45294
- subDescription: subDescription,
45295
- allowedPaymentInstruments: allowedPaymentInstruments
45234
+ obligationAssocID: obligationAssocID
45296
45235
  }))), isMobile && /*#__PURE__*/React__default.createElement(PaymentDetailsActions, {
45297
45236
  obligations: obligations,
45298
45237
  autoPayEnabled: autoPayEnabled,
@@ -45307,10 +45246,7 @@ var Obligation = function Obligation(_ref) {
45307
45246
  isMobile: isMobile,
45308
45247
  isPaymentPlan: isPaymentPlan,
45309
45248
  nextAutopayDate: nextAutopayDate,
45310
- obligationAssocID: obligationAssocID,
45311
- description: description,
45312
- subDescription: subDescription,
45313
- allowedPaymentInstruments: allowedPaymentInstruments
45249
+ obligationAssocID: obligationAssocID
45314
45250
  }));
45315
45251
  var inactiveObligation = /*#__PURE__*/React__default.createElement(Box, {
45316
45252
  padding: "0",
@@ -45363,10 +45299,7 @@ var Obligation = function Obligation(_ref) {
45363
45299
  obligationAssocID: obligationAssocID,
45364
45300
  dueDate: dueDate,
45365
45301
  agencyName: agencyName,
45366
- configType: config.type,
45367
- description: description,
45368
- subDescription: subDescription,
45369
- allowedPaymentInstruments: allowedPaymentInstruments
45302
+ configType: config.type
45370
45303
  }))), isMobile && /*#__PURE__*/React__default.createElement(InactiveControlsModule, {
45371
45304
  obligations: obligations,
45372
45305
  autoPayEnabled: autoPayEnabled,
@@ -45380,10 +45313,7 @@ var Obligation = function Obligation(_ref) {
45380
45313
  obligationAssocID: obligationAssocID,
45381
45314
  dueDate: dueDate,
45382
45315
  agencyName: agencyName,
45383
- configType: config.type,
45384
- description: description,
45385
- subDescription: subDescription,
45386
- allowedPaymentInstruments: allowedPaymentInstruments
45316
+ configType: config.type
45387
45317
  }))));
45388
45318
  return inactive ? inactiveObligation : activeObligation;
45389
45319
  };
@@ -46608,7 +46538,7 @@ var RadioGroup = function RadioGroup(_ref) {
46608
46538
  groupName: groupName,
46609
46539
  setValue: setValue,
46610
46540
  handleChange: handleChange,
46611
- "aria-invalid": field.dirty && field.hasErrors || field.hasErrors && showErrors
46541
+ "aria-invalid": field.dirty && field.hasErrors || field.hasErrors
46612
46542
  }));
46613
46543
  })));
46614
46544
  };