@thecb/components 11.1.9 → 11.1.11-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 +13 -63
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +13 -63
- package/dist/index.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/atoms/.DS_Store +0 -0
- 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/modules/AutopayModalModule.js +22 -6
package/dist/index.cjs.js
CHANGED
|
@@ -46862,7 +46862,7 @@ var AutopayModalModule = function AutopayModalModule(_ref) {
|
|
|
46862
46862
|
var nextDate = dueDate || nextAutopayDate;
|
|
46863
46863
|
var modalExtraProps = {
|
|
46864
46864
|
modalHeaderText: autoPayActive ? deactivateText : activateText,
|
|
46865
|
-
modalBodyText: autoPayActive ? "Are you sure you want to stop "
|
|
46865
|
+
modalBodyText: autoPayActive ? /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Paragraph$1, null, "Are you sure you want to stop ", plan, "?", !inactive && nextDate && nextDate !== "On" ? "Your next payment will be due on " + nextDate + "." : ""), !isPaymentPlan && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("br", null), /*#__PURE__*/React__default.createElement(Paragraph$1, null, "If your next autopayment is scheduled to run today, you may be billed today and autopay will then stop for the next billing cycle."))) : generateMethodNeededText(plan, allowedPaymentInstruments),
|
|
46866
46866
|
continueButtonText: autoPayActive ? "Stop ".concat(shortPlan) : "Add",
|
|
46867
46867
|
useDangerButton: autoPayActive,
|
|
46868
46868
|
continueAction: autoPayActive ? function () {
|
|
@@ -50740,8 +50740,7 @@ var FilterButton$1 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
50740
50740
|
truncateBtnTextWidth = _ref.truncateBtnTextWidth,
|
|
50741
50741
|
filterLabel = _ref.filterLabel,
|
|
50742
50742
|
selectedOptions = _ref.selectedOptions,
|
|
50743
|
-
extraStyles = _ref.extraStyles
|
|
50744
|
-
dataAppliedOptions = _ref.dataAppliedOptions;
|
|
50743
|
+
extraStyles = _ref.extraStyles;
|
|
50745
50744
|
var btnTextFilterDescription = selectedOptions !== null && selectedOptions !== void 0 && selectedOptions.length ? "".concat(filterLabel ? "".concat(filterLabel, ": ") : "").concat(selectedOptions[0].name) : "".concat(filterLabel ? filterLabel : "");
|
|
50746
50745
|
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") : "";
|
|
50747
50746
|
return /*#__PURE__*/React__default.createElement(StyledFilterButton, {
|
|
@@ -50759,7 +50758,6 @@ var FilterButton$1 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
50759
50758
|
dataQa: "".concat(name, "-filter-button"),
|
|
50760
50759
|
extraStyles: extraStyles,
|
|
50761
50760
|
"aria-label": "".concat(filterLabel, " Filter: ").concat(btnTextFilterDescription, " ").concat(btnTextItemsDescription),
|
|
50762
|
-
"data-applied-options": dataAppliedOptions,
|
|
50763
50761
|
contentOverride: true
|
|
50764
50762
|
}, btnContentOverride ? btnContentOverride : /*#__PURE__*/React__default.createElement(Center, {
|
|
50765
50763
|
as: "span",
|
|
@@ -50944,19 +50942,6 @@ var selectOption = function selectOption(option, selectedOptions, setSelectedOpt
|
|
|
50944
50942
|
setSelectedOptions(moreOptions);
|
|
50945
50943
|
}
|
|
50946
50944
|
};
|
|
50947
|
-
var mergeOptions = function mergeOptions(selectedOptions, activeOptions) {
|
|
50948
|
-
if (!activeOptions.length) return selectedOptions;
|
|
50949
|
-
if (!selectedOptions.length) return activeOptions;
|
|
50950
|
-
var mergedOptions = _toConsumableArray(selectedOptions);
|
|
50951
|
-
activeOptions.forEach(function (activeOption) {
|
|
50952
|
-
if (!mergedOptions.some(function (option) {
|
|
50953
|
-
return option.name === activeOption.name;
|
|
50954
|
-
})) {
|
|
50955
|
-
mergedOptions.push(activeOption);
|
|
50956
|
-
}
|
|
50957
|
-
});
|
|
50958
|
-
return mergedOptions;
|
|
50959
|
-
};
|
|
50960
50945
|
|
|
50961
50946
|
var useKeyboardNavigation = function useKeyboardNavigation(_ref) {
|
|
50962
50947
|
var options = _ref.options,
|
|
@@ -51157,75 +51142,41 @@ var MultipleSelectFilter = function MultipleSelectFilter(_ref) {
|
|
|
51157
51142
|
searchable = _ref$searchable === void 0 ? true : _ref$searchable,
|
|
51158
51143
|
themeValues = _ref.themeValues,
|
|
51159
51144
|
_ref$truncateBtnTextW = _ref.truncateBtnTextWidth,
|
|
51160
|
-
truncateBtnTextWidth = _ref$truncateBtnTextW === void 0 ? "15rem" : _ref$truncateBtnTextW
|
|
51161
|
-
activeAppliedOptions = _ref.activeAppliedOptions;
|
|
51162
|
-
// State to manage whether the dropdown is open or closed
|
|
51145
|
+
truncateBtnTextWidth = _ref$truncateBtnTextW === void 0 ? "15rem" : _ref$truncateBtnTextW;
|
|
51163
51146
|
var _useState = React.useState(false),
|
|
51164
51147
|
_useState2 = _slicedToArray(_useState, 2),
|
|
51165
51148
|
opened = _useState2[0],
|
|
51166
51149
|
setOpened = _useState2[1];
|
|
51167
|
-
|
|
51168
|
-
// State to manage the currently selected options
|
|
51169
51150
|
var _useState3 = React.useState([]),
|
|
51170
51151
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
51171
51152
|
selectedOptions = _useState4[0],
|
|
51172
51153
|
setSelectedOptions = _useState4[1];
|
|
51173
|
-
|
|
51174
|
-
// State to manage the applied options, initialized with activeAppliedOptions or an empty array
|
|
51175
|
-
var _useState5 = React.useState(activeAppliedOptions || []),
|
|
51154
|
+
var _useState5 = React.useState([]),
|
|
51176
51155
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
51177
51156
|
appliedOptions = _useState6[0],
|
|
51178
51157
|
setAppliedOptions = _useState6[1];
|
|
51179
|
-
|
|
51180
|
-
// State to track whether the user has interacted with the component
|
|
51181
|
-
var _useState7 = React.useState(false),
|
|
51182
|
-
_useState8 = _slicedToArray(_useState7, 2),
|
|
51183
|
-
hasInteracted = _useState8[0],
|
|
51184
|
-
setHasInteracted = _useState8[1];
|
|
51185
|
-
|
|
51186
|
-
// Reference to keep track of the opened state across renders without causing re-renders
|
|
51187
51158
|
var openedRef = React.useRef(opened);
|
|
51188
|
-
|
|
51189
|
-
|
|
51159
|
+
var handleOnClose = function handleOnClose() {
|
|
51160
|
+
if (openedRef.current) {
|
|
51161
|
+
setOpened(false);
|
|
51162
|
+
actions.fields.searchTerm.set("");
|
|
51163
|
+
}
|
|
51164
|
+
};
|
|
51190
51165
|
var containerRef = useOutsideClickHook(function () {
|
|
51191
51166
|
return handleOnClose();
|
|
51192
51167
|
});
|
|
51193
|
-
|
|
51194
|
-
// References to various elements within the component
|
|
51195
51168
|
var dropdownRef = React.useRef(null);
|
|
51196
51169
|
var filterButtonRef = React.useRef(null);
|
|
51197
51170
|
var applyFilterButtonRef = React.useRef(null);
|
|
51198
|
-
|
|
51199
|
-
// IDs for accessibility and identification purposes
|
|
51200
51171
|
var filterDropdownID = "".concat(name, "-filter-dropdown");
|
|
51201
51172
|
var listGroupID = "".concat(name, "-list-group");
|
|
51202
|
-
var handleOnClose = function handleOnClose() {
|
|
51203
|
-
if (openedRef.current) {
|
|
51204
|
-
setOpened(false);
|
|
51205
|
-
actions.fields.searchTerm.set("");
|
|
51206
|
-
}
|
|
51207
|
-
};
|
|
51208
51173
|
React.useEffect(function () {
|
|
51209
51174
|
openedRef.current = opened;
|
|
51210
51175
|
if (!opened) {
|
|
51211
|
-
|
|
51212
|
-
|
|
51213
|
-
setAppliedOptions(selectedOptions);
|
|
51214
|
-
}
|
|
51215
|
-
} else {
|
|
51216
|
-
setHasInteracted(true);
|
|
51176
|
+
onApply(selectedOptions);
|
|
51177
|
+
setAppliedOptions(selectedOptions);
|
|
51217
51178
|
}
|
|
51218
51179
|
}, [opened]);
|
|
51219
|
-
React.useEffect(function () {
|
|
51220
|
-
// Update the applied options state with the current active applied options,
|
|
51221
|
-
// or an empty array if activeAppliedOptions is undefined or null.
|
|
51222
|
-
// This ensures that the current applied options are in sync with the parent component.
|
|
51223
|
-
setAppliedOptions(activeAppliedOptions || []);
|
|
51224
|
-
|
|
51225
|
-
// Merge the selected options with the active applied options.
|
|
51226
|
-
var mergedSelections = mergeOptions(selectedOptions, activeAppliedOptions);
|
|
51227
|
-
setSelectedOptions(mergedSelections);
|
|
51228
|
-
}, [activeAppliedOptions]);
|
|
51229
51180
|
React.useEffect(function () {
|
|
51230
51181
|
var handleKeyDown = function handleKeyDown(event) {
|
|
51231
51182
|
if (event.key === "Escape") {
|
|
@@ -51267,8 +51218,7 @@ var MultipleSelectFilter = function MultipleSelectFilter(_ref) {
|
|
|
51267
51218
|
truncateBtnTextWidth: truncateBtnTextWidth,
|
|
51268
51219
|
filterLabel: filterLabel,
|
|
51269
51220
|
selectedOptions: selectedOptions,
|
|
51270
|
-
extraStyles: btnExtraStyles
|
|
51271
|
-
dataAppliedOptions: appliedOptions === null || appliedOptions === void 0 ? void 0 : appliedOptions.length
|
|
51221
|
+
extraStyles: btnExtraStyles
|
|
51272
51222
|
}), /*#__PURE__*/React__default.createElement(FilterDropdown, {
|
|
51273
51223
|
id: filterDropdownID,
|
|
51274
51224
|
ref: dropdownRef,
|