@thecb/components 11.1.9 → 11.1.10-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 +18 -65
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +18 -65
- package/dist/index.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/molecules/multiple-select-filter/MultipleSelectFilter.js +10 -49
- package/src/components/molecules/multiple-select-filter/__private__/FilterButton.js +1 -3
- package/src/components/molecules/multiple-select-filter/__private__/util.js +0 -13
- package/src/components/molecules/obligation/Obligation.js +3 -1
- package/src/components/molecules/obligation/modules/AutopayModalModule.js +2 -2
package/dist/index.esm.js
CHANGED
|
@@ -46842,8 +46842,8 @@ var AutopayModalModule = function AutopayModalModule(_ref) {
|
|
|
46842
46842
|
onClick = _ref.onClick,
|
|
46843
46843
|
onKeyPress = _ref.onKeyPress;
|
|
46844
46844
|
var generateMethodNeededText = function generateMethodNeededText(planText, allowedPaymentInstruments) {
|
|
46845
|
-
var allowsCard = allowedPaymentInstruments.includes(CC_METHOD);
|
|
46846
|
-
var allowsACH = allowedPaymentInstruments.includes(ACH_METHOD);
|
|
46845
|
+
var allowsCard = allowedPaymentInstruments === null || allowedPaymentInstruments === void 0 ? void 0 : allowedPaymentInstruments.includes(CC_METHOD);
|
|
46846
|
+
var allowsACH = allowedPaymentInstruments === null || allowedPaymentInstruments === void 0 ? void 0 : allowedPaymentInstruments.includes(ACH_METHOD);
|
|
46847
46847
|
var methodRequired = allowsCard && !allowsACH ? "debit or credit card payment method" : !allowsCard && allowsACH ? "checking account payment method" : "payment method";
|
|
46848
46848
|
return "To set up ".concat(planText, " you must have a saved ").concat(methodRequired, " and address. Do you want to save these now?");
|
|
46849
46849
|
};
|
|
@@ -47351,7 +47351,8 @@ var fallbackValues$N = {
|
|
|
47351
47351
|
var Obligation = function Obligation(_ref) {
|
|
47352
47352
|
var _obligations$, _firstObligation$cust;
|
|
47353
47353
|
var config = _ref.config,
|
|
47354
|
-
obligations = _ref.obligations,
|
|
47354
|
+
_ref$obligations = _ref.obligations,
|
|
47355
|
+
obligations = _ref$obligations === void 0 ? [] : _ref$obligations,
|
|
47355
47356
|
actions = _ref.actions,
|
|
47356
47357
|
autoPayEnabled = _ref.autoPayEnabled,
|
|
47357
47358
|
autoPayAvailable = _ref.autoPayAvailable,
|
|
@@ -47451,6 +47452,7 @@ var Obligation = function Obligation(_ref) {
|
|
|
47451
47452
|
isLoading: true
|
|
47452
47453
|
}))), !isMobile && /*#__PURE__*/React.createElement(PaymentDetailsActions, {
|
|
47453
47454
|
obligations: obligations,
|
|
47455
|
+
obligationAssocID: obligationAssocID,
|
|
47454
47456
|
autoPayEnabled: autoPayEnabled,
|
|
47455
47457
|
autoPayAvailable: autoPayAvailable,
|
|
47456
47458
|
handleAutopayAction: handleAutopayAction,
|
|
@@ -47471,6 +47473,7 @@ var Obligation = function Obligation(_ref) {
|
|
|
47471
47473
|
isContentLoading: true
|
|
47472
47474
|
}))), isMobile && /*#__PURE__*/React.createElement(PaymentDetailsActions, {
|
|
47473
47475
|
obligations: obligations,
|
|
47476
|
+
obligationAssocID: obligationAssocID,
|
|
47474
47477
|
autoPayEnabled: autoPayEnabled,
|
|
47475
47478
|
autoPayAvailable: autoPayAvailable,
|
|
47476
47479
|
handleAutopayAction: handleAutopayAction,
|
|
@@ -50732,8 +50735,7 @@ var FilterButton$1 = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
50732
50735
|
truncateBtnTextWidth = _ref.truncateBtnTextWidth,
|
|
50733
50736
|
filterLabel = _ref.filterLabel,
|
|
50734
50737
|
selectedOptions = _ref.selectedOptions,
|
|
50735
|
-
extraStyles = _ref.extraStyles
|
|
50736
|
-
dataAppliedOptions = _ref.dataAppliedOptions;
|
|
50738
|
+
extraStyles = _ref.extraStyles;
|
|
50737
50739
|
var btnTextFilterDescription = selectedOptions !== null && selectedOptions !== void 0 && selectedOptions.length ? "".concat(filterLabel ? "".concat(filterLabel, ": ") : "").concat(selectedOptions[0].name) : "".concat(filterLabel ? filterLabel : "");
|
|
50738
50740
|
var btnTextItemsDescription = selectedOptions !== null && selectedOptions !== void 0 && selectedOptions.length && (selectedOptions === null || selectedOptions === void 0 ? void 0 : selectedOptions.length) > 1 ? ", +".concat((selectedOptions === null || selectedOptions === void 0 ? void 0 : selectedOptions.length) - 1, " More") : "";
|
|
50739
50741
|
return /*#__PURE__*/React.createElement(StyledFilterButton, {
|
|
@@ -50751,7 +50753,6 @@ var FilterButton$1 = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
50751
50753
|
dataQa: "".concat(name, "-filter-button"),
|
|
50752
50754
|
extraStyles: extraStyles,
|
|
50753
50755
|
"aria-label": "".concat(filterLabel, " Filter: ").concat(btnTextFilterDescription, " ").concat(btnTextItemsDescription),
|
|
50754
|
-
"data-applied-options": dataAppliedOptions,
|
|
50755
50756
|
contentOverride: true
|
|
50756
50757
|
}, btnContentOverride ? btnContentOverride : /*#__PURE__*/React.createElement(Center, {
|
|
50757
50758
|
as: "span",
|
|
@@ -50936,19 +50937,6 @@ var selectOption = function selectOption(option, selectedOptions, setSelectedOpt
|
|
|
50936
50937
|
setSelectedOptions(moreOptions);
|
|
50937
50938
|
}
|
|
50938
50939
|
};
|
|
50939
|
-
var mergeOptions = function mergeOptions(selectedOptions, activeOptions) {
|
|
50940
|
-
if (!activeOptions.length) return selectedOptions;
|
|
50941
|
-
if (!selectedOptions.length) return activeOptions;
|
|
50942
|
-
var mergedOptions = _toConsumableArray(selectedOptions);
|
|
50943
|
-
activeOptions.forEach(function (activeOption) {
|
|
50944
|
-
if (!mergedOptions.some(function (option) {
|
|
50945
|
-
return option.name === activeOption.name;
|
|
50946
|
-
})) {
|
|
50947
|
-
mergedOptions.push(activeOption);
|
|
50948
|
-
}
|
|
50949
|
-
});
|
|
50950
|
-
return mergedOptions;
|
|
50951
|
-
};
|
|
50952
50940
|
|
|
50953
50941
|
var useKeyboardNavigation = function useKeyboardNavigation(_ref) {
|
|
50954
50942
|
var options = _ref.options,
|
|
@@ -51149,75 +51137,41 @@ var MultipleSelectFilter = function MultipleSelectFilter(_ref) {
|
|
|
51149
51137
|
searchable = _ref$searchable === void 0 ? true : _ref$searchable,
|
|
51150
51138
|
themeValues = _ref.themeValues,
|
|
51151
51139
|
_ref$truncateBtnTextW = _ref.truncateBtnTextWidth,
|
|
51152
|
-
truncateBtnTextWidth = _ref$truncateBtnTextW === void 0 ? "15rem" : _ref$truncateBtnTextW
|
|
51153
|
-
activeAppliedOptions = _ref.activeAppliedOptions;
|
|
51154
|
-
// State to manage whether the dropdown is open or closed
|
|
51140
|
+
truncateBtnTextWidth = _ref$truncateBtnTextW === void 0 ? "15rem" : _ref$truncateBtnTextW;
|
|
51155
51141
|
var _useState = useState(false),
|
|
51156
51142
|
_useState2 = _slicedToArray(_useState, 2),
|
|
51157
51143
|
opened = _useState2[0],
|
|
51158
51144
|
setOpened = _useState2[1];
|
|
51159
|
-
|
|
51160
|
-
// State to manage the currently selected options
|
|
51161
51145
|
var _useState3 = useState([]),
|
|
51162
51146
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
51163
51147
|
selectedOptions = _useState4[0],
|
|
51164
51148
|
setSelectedOptions = _useState4[1];
|
|
51165
|
-
|
|
51166
|
-
// State to manage the applied options, initialized with activeAppliedOptions or an empty array
|
|
51167
|
-
var _useState5 = useState(activeAppliedOptions || []),
|
|
51149
|
+
var _useState5 = useState([]),
|
|
51168
51150
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
51169
51151
|
appliedOptions = _useState6[0],
|
|
51170
51152
|
setAppliedOptions = _useState6[1];
|
|
51171
|
-
|
|
51172
|
-
// State to track whether the user has interacted with the component
|
|
51173
|
-
var _useState7 = useState(false),
|
|
51174
|
-
_useState8 = _slicedToArray(_useState7, 2),
|
|
51175
|
-
hasInteracted = _useState8[0],
|
|
51176
|
-
setHasInteracted = _useState8[1];
|
|
51177
|
-
|
|
51178
|
-
// Reference to keep track of the opened state across renders without causing re-renders
|
|
51179
51153
|
var openedRef = useRef(opened);
|
|
51180
|
-
|
|
51181
|
-
|
|
51154
|
+
var handleOnClose = function handleOnClose() {
|
|
51155
|
+
if (openedRef.current) {
|
|
51156
|
+
setOpened(false);
|
|
51157
|
+
actions.fields.searchTerm.set("");
|
|
51158
|
+
}
|
|
51159
|
+
};
|
|
51182
51160
|
var containerRef = useOutsideClickHook(function () {
|
|
51183
51161
|
return handleOnClose();
|
|
51184
51162
|
});
|
|
51185
|
-
|
|
51186
|
-
// References to various elements within the component
|
|
51187
51163
|
var dropdownRef = useRef(null);
|
|
51188
51164
|
var filterButtonRef = useRef(null);
|
|
51189
51165
|
var applyFilterButtonRef = useRef(null);
|
|
51190
|
-
|
|
51191
|
-
// IDs for accessibility and identification purposes
|
|
51192
51166
|
var filterDropdownID = "".concat(name, "-filter-dropdown");
|
|
51193
51167
|
var listGroupID = "".concat(name, "-list-group");
|
|
51194
|
-
var handleOnClose = function handleOnClose() {
|
|
51195
|
-
if (openedRef.current) {
|
|
51196
|
-
setOpened(false);
|
|
51197
|
-
actions.fields.searchTerm.set("");
|
|
51198
|
-
}
|
|
51199
|
-
};
|
|
51200
51168
|
useEffect$1(function () {
|
|
51201
51169
|
openedRef.current = opened;
|
|
51202
51170
|
if (!opened) {
|
|
51203
|
-
|
|
51204
|
-
|
|
51205
|
-
setAppliedOptions(selectedOptions);
|
|
51206
|
-
}
|
|
51207
|
-
} else {
|
|
51208
|
-
setHasInteracted(true);
|
|
51171
|
+
onApply(selectedOptions);
|
|
51172
|
+
setAppliedOptions(selectedOptions);
|
|
51209
51173
|
}
|
|
51210
51174
|
}, [opened]);
|
|
51211
|
-
useEffect$1(function () {
|
|
51212
|
-
// Update the applied options state with the current active applied options,
|
|
51213
|
-
// or an empty array if activeAppliedOptions is undefined or null.
|
|
51214
|
-
// This ensures that the current applied options are in sync with the parent component.
|
|
51215
|
-
setAppliedOptions(activeAppliedOptions || []);
|
|
51216
|
-
|
|
51217
|
-
// Merge the selected options with the active applied options.
|
|
51218
|
-
var mergedSelections = mergeOptions(selectedOptions, activeAppliedOptions);
|
|
51219
|
-
setSelectedOptions(mergedSelections);
|
|
51220
|
-
}, [activeAppliedOptions]);
|
|
51221
51175
|
useEffect$1(function () {
|
|
51222
51176
|
var handleKeyDown = function handleKeyDown(event) {
|
|
51223
51177
|
if (event.key === "Escape") {
|
|
@@ -51259,8 +51213,7 @@ var MultipleSelectFilter = function MultipleSelectFilter(_ref) {
|
|
|
51259
51213
|
truncateBtnTextWidth: truncateBtnTextWidth,
|
|
51260
51214
|
filterLabel: filterLabel,
|
|
51261
51215
|
selectedOptions: selectedOptions,
|
|
51262
|
-
extraStyles: btnExtraStyles
|
|
51263
|
-
dataAppliedOptions: appliedOptions === null || appliedOptions === void 0 ? void 0 : appliedOptions.length
|
|
51216
|
+
extraStyles: btnExtraStyles
|
|
51264
51217
|
}), /*#__PURE__*/React.createElement(FilterDropdown, {
|
|
51265
51218
|
id: filterDropdownID,
|
|
51266
51219
|
ref: dropdownRef,
|