@thecb/components 12.0.0-beta.1 → 12.0.0-beta.11
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 +144 -124
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +144 -124
- package/dist/index.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/atoms/card-type/CardType.js +1 -5
- package/src/components/atoms/checkbox/Checkbox.js +11 -6
- package/src/components/atoms/form-layouts/FormInput.js +2 -0
- package/src/components/atoms/formatted-bank-account/FormattedBankAccount.js +11 -5
- package/src/components/atoms/formatted-credit-card/FormattedCreditCard.js +30 -30
- package/src/components/atoms/icons/AutopayOnIcon.js +1 -0
- package/src/components/atoms/link/InternalLink.js +3 -1
- package/src/components/molecules/editable-list/EditableList.js +22 -9
- package/src/components/molecules/link-card/LinkCard.js +13 -14
- package/src/components/molecules/link-card/LinkCard.stories.js +11 -14
- package/src/components/molecules/link-card/LinkCard.styled.js +18 -28
- package/src/components/molecules/link-card/LinkCard.theme.js +4 -6
- package/src/components/molecules/link-card/index.d.ts +1 -3
- package/src/components/molecules/obligation/modules/AutopayModalModule.js +10 -17
- package/src/components/molecules/obligation/modules/IconModule.js +1 -1
- package/src/components/molecules/radio-section/radio-button/RadioButton.js +1 -1
- package/src/components/molecules/registration-form/RegistrationForm.js +5 -0
- package/src/components/molecules/terms-and-conditions/TermsAndConditionsControlV2.js +3 -1
package/dist/index.cjs.js
CHANGED
|
@@ -15099,7 +15099,8 @@ var AutopayOnIcon = function AutopayOnIcon(_ref) {
|
|
|
15099
15099
|
xmlns: "http://www.w3.org/2000/svg",
|
|
15100
15100
|
width: "12",
|
|
15101
15101
|
height: "13",
|
|
15102
|
-
viewBox: "0 0 12 13"
|
|
15102
|
+
viewBox: "0 0 12 13",
|
|
15103
|
+
"aria-hidden": "true"
|
|
15103
15104
|
}, /*#__PURE__*/React__default.createElement("g", {
|
|
15104
15105
|
fill: "none",
|
|
15105
15106
|
fillRule: "evenodd",
|
|
@@ -21673,6 +21674,7 @@ var StyledInternalLink = styled__default( /*#__PURE__*/React.forwardRef(function
|
|
|
21673
21674
|
});
|
|
21674
21675
|
/* eslint-enable no-unused-vars */
|
|
21675
21676
|
|
|
21677
|
+
var _excluded$u = ["to", "color", "children", "active", "fontSize", "lineheight", "fontWeight", "variant", "margin", "tabIndex", "dataQa", "extraStyles", "isUnderlined", "hoverUnderline", "extraHoverStyles", "extraActiveStyles", "extraFocusStyles"];
|
|
21676
21678
|
var InternalLink = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
21677
21679
|
var _ref$to = _ref.to,
|
|
21678
21680
|
to = _ref$to === void 0 ? "" : _ref$to,
|
|
@@ -21699,10 +21701,11 @@ var InternalLink = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
21699
21701
|
_ref$extraActiveStyle = _ref.extraActiveStyles,
|
|
21700
21702
|
extraActiveStyles = _ref$extraActiveStyle === void 0 ? "" : _ref$extraActiveStyle,
|
|
21701
21703
|
_ref$extraFocusStyles = _ref.extraFocusStyles,
|
|
21702
|
-
extraFocusStyles = _ref$extraFocusStyles === void 0 ? "" : _ref$extraFocusStyles
|
|
21704
|
+
extraFocusStyles = _ref$extraFocusStyles === void 0 ? "" : _ref$extraFocusStyles,
|
|
21705
|
+
rest = _objectWithoutProperties(_ref, _excluded$u);
|
|
21703
21706
|
var themeContext = React.useContext(styled.ThemeContext);
|
|
21704
21707
|
var themeValues = createThemeValues(themeContext, fallbackValues$a, "Link", variant);
|
|
21705
|
-
return /*#__PURE__*/React__default.createElement(StyledInternalLink, {
|
|
21708
|
+
return /*#__PURE__*/React__default.createElement(StyledInternalLink, _extends({
|
|
21706
21709
|
to: to,
|
|
21707
21710
|
color: color,
|
|
21708
21711
|
lineheight: lineheight,
|
|
@@ -21722,7 +21725,7 @@ var InternalLink = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
21722
21725
|
extraFocusStyles: extraFocusStyles,
|
|
21723
21726
|
"data-qa": dataQa,
|
|
21724
21727
|
ref: ref
|
|
21725
|
-
}, safeChildren(children, /*#__PURE__*/React__default.createElement("span", null)));
|
|
21728
|
+
}, rest), safeChildren(children, /*#__PURE__*/React__default.createElement("span", null)));
|
|
21726
21729
|
});
|
|
21727
21730
|
|
|
21728
21731
|
var Breadcrumbs = function Breadcrumbs(_ref) {
|
|
@@ -21757,7 +21760,7 @@ var Breadcrumbs = function Breadcrumbs(_ref) {
|
|
|
21757
21760
|
})));
|
|
21758
21761
|
};
|
|
21759
21762
|
|
|
21760
|
-
var _excluded$
|
|
21763
|
+
var _excluded$v = ["url", "disabled", "fileLink", "extraStyles", "linkExtraStyles", "newTab", "dataQa"];
|
|
21761
21764
|
var ButtonWithLink = function ButtonWithLink(_ref) {
|
|
21762
21765
|
var _ref$url = _ref.url,
|
|
21763
21766
|
url = _ref$url === void 0 ? "/" : _ref$url,
|
|
@@ -21772,7 +21775,7 @@ var ButtonWithLink = function ButtonWithLink(_ref) {
|
|
|
21772
21775
|
_ref$newTab = _ref.newTab,
|
|
21773
21776
|
newTab = _ref$newTab === void 0 ? false : _ref$newTab,
|
|
21774
21777
|
dataQa = _ref.dataQa,
|
|
21775
|
-
otherProps = _objectWithoutProperties(_ref, _excluded$
|
|
21778
|
+
otherProps = _objectWithoutProperties(_ref, _excluded$v);
|
|
21776
21779
|
var ButtonWithLinkWrapper = function ButtonWithLinkWrapper(_ref2) {
|
|
21777
21780
|
var children = _ref2.children,
|
|
21778
21781
|
url = _ref2.url,
|
|
@@ -21860,7 +21863,7 @@ var ParagraphText = styled__default.p.withConfig({
|
|
|
21860
21863
|
return extraStyles;
|
|
21861
21864
|
});
|
|
21862
21865
|
|
|
21863
|
-
var _excluded$
|
|
21866
|
+
var _excluded$w = ["themeValues", "weight", "color", "margin", "extraStyles", "dataQa", "children", "as"];
|
|
21864
21867
|
var Paragraph = function Paragraph(_ref) {
|
|
21865
21868
|
var themeValues = _ref.themeValues,
|
|
21866
21869
|
_ref$weight = _ref.weight,
|
|
@@ -21874,7 +21877,7 @@ var Paragraph = function Paragraph(_ref) {
|
|
|
21874
21877
|
dataQa = _ref.dataQa,
|
|
21875
21878
|
children = _ref.children,
|
|
21876
21879
|
as = _ref.as,
|
|
21877
|
-
rest = _objectWithoutProperties(_ref, _excluded$
|
|
21880
|
+
rest = _objectWithoutProperties(_ref, _excluded$w);
|
|
21878
21881
|
return /*#__PURE__*/React__default.createElement(ParagraphText, _extends({
|
|
21879
21882
|
weight: weight,
|
|
21880
21883
|
color: color,
|
|
@@ -22116,7 +22119,7 @@ var ENTER = 13;
|
|
|
22116
22119
|
var ESCAPE = 27;
|
|
22117
22120
|
var SPACEBAR = 32;
|
|
22118
22121
|
|
|
22119
|
-
var _excluded$
|
|
22122
|
+
var _excluded$x = ["title", "name", "checked", "onChange", "disabled", "themeValues", "hidden", "error", "isRequired", "checkboxMargin", "extraStyles", "textExtraStyles", "labelledById", "dataQa", "checkboxExtraStyles", "hasIconOverride", "icon"];
|
|
22120
22123
|
var CheckboxContainer = styled__default.span.withConfig({
|
|
22121
22124
|
displayName: "Checkbox__CheckboxContainer",
|
|
22122
22125
|
componentId: "sc-36kqbv-0"
|
|
@@ -22175,6 +22178,8 @@ var Checkbox = /*#__PURE__*/React.forwardRef(function (_ref5, ref) {
|
|
|
22175
22178
|
hidden = _ref5$hidden === void 0 ? false : _ref5$hidden,
|
|
22176
22179
|
_ref5$error = _ref5.error,
|
|
22177
22180
|
error = _ref5$error === void 0 ? false : _ref5$error,
|
|
22181
|
+
_ref5$isRequired = _ref5.isRequired,
|
|
22182
|
+
isRequired = _ref5$isRequired === void 0 ? false : _ref5$isRequired,
|
|
22178
22183
|
_ref5$checkboxMargin = _ref5.checkboxMargin,
|
|
22179
22184
|
checkboxMargin = _ref5$checkboxMargin === void 0 ? "0 16px 0 0" : _ref5$checkboxMargin,
|
|
22180
22185
|
extraStyles = _ref5.extraStyles,
|
|
@@ -22186,7 +22191,7 @@ var Checkbox = /*#__PURE__*/React.forwardRef(function (_ref5, ref) {
|
|
|
22186
22191
|
_ref5$hasIconOverride = _ref5.hasIconOverride,
|
|
22187
22192
|
hasIconOverride = _ref5$hasIconOverride === void 0 ? false : _ref5$hasIconOverride,
|
|
22188
22193
|
Icon = _ref5.icon,
|
|
22189
|
-
rest = _objectWithoutProperties(_ref5, _excluded$
|
|
22194
|
+
rest = _objectWithoutProperties(_ref5, _excluded$x);
|
|
22190
22195
|
var _useState = React.useState(false),
|
|
22191
22196
|
_useState2 = _slicedToArray(_useState, 2),
|
|
22192
22197
|
focused = _useState2[0],
|
|
@@ -22203,6 +22208,13 @@ var Checkbox = /*#__PURE__*/React.forwardRef(function (_ref5, ref) {
|
|
|
22203
22208
|
ref: ref,
|
|
22204
22209
|
padding: "0",
|
|
22205
22210
|
tabIndex: "0",
|
|
22211
|
+
role: "checkbox",
|
|
22212
|
+
"aria-checked": checked,
|
|
22213
|
+
"aria-required": isRequired || undefined,
|
|
22214
|
+
"aria-invalid": error,
|
|
22215
|
+
"aria-label": ariaLabel,
|
|
22216
|
+
"aria-labelledby": ariaLabelledById,
|
|
22217
|
+
"aria-describedby": error ? "".concat(name, "-error-message") : undefined,
|
|
22206
22218
|
onFocus: function onFocus() {
|
|
22207
22219
|
return setFocused(true);
|
|
22208
22220
|
},
|
|
@@ -22223,19 +22235,16 @@ var Checkbox = /*#__PURE__*/React.forwardRef(function (_ref5, ref) {
|
|
|
22223
22235
|
id: "checkbox-".concat(name),
|
|
22224
22236
|
disabled: disabled,
|
|
22225
22237
|
name: name,
|
|
22226
|
-
"aria-label": ariaLabel,
|
|
22227
|
-
"aria-labelledby": ariaLabelledById,
|
|
22228
22238
|
checked: checked,
|
|
22229
22239
|
onChange: onChange,
|
|
22230
22240
|
tabIndex: "-1",
|
|
22231
|
-
|
|
22232
|
-
"aria-
|
|
22241
|
+
required: isRequired,
|
|
22242
|
+
"aria-hidden": "true"
|
|
22233
22243
|
}), /*#__PURE__*/React__default.createElement(StyledCheckbox, {
|
|
22234
|
-
|
|
22244
|
+
"aria-hidden": "true",
|
|
22235
22245
|
error: error,
|
|
22236
22246
|
disabled: disabled,
|
|
22237
22247
|
checked: checked,
|
|
22238
|
-
"aria-checked": checked,
|
|
22239
22248
|
focused: focused,
|
|
22240
22249
|
defaultStyles: themeValues.defaultStyles,
|
|
22241
22250
|
checkedStyles: themeValues.checkedStyles,
|
|
@@ -22542,7 +22551,7 @@ var TableRowWrapper = styled__default.tr.withConfig({
|
|
|
22542
22551
|
return extraStyles;
|
|
22543
22552
|
});
|
|
22544
22553
|
|
|
22545
|
-
var _excluded$
|
|
22554
|
+
var _excluded$y = ["children", "extraStyles", "hoverCursor", "hoverEffect", "onClick", "themeValues"];
|
|
22546
22555
|
var TableRow = function TableRow(_ref) {
|
|
22547
22556
|
var children = _ref.children,
|
|
22548
22557
|
extraStyles = _ref.extraStyles,
|
|
@@ -22552,7 +22561,7 @@ var TableRow = function TableRow(_ref) {
|
|
|
22552
22561
|
hoverEffect = _ref$hoverEffect === void 0 ? true : _ref$hoverEffect,
|
|
22553
22562
|
onClick = _ref.onClick,
|
|
22554
22563
|
themeValues = _ref.themeValues,
|
|
22555
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
22564
|
+
props = _objectWithoutProperties(_ref, _excluded$y);
|
|
22556
22565
|
return /*#__PURE__*/React__default.createElement(TableRowWrapper, _extends({
|
|
22557
22566
|
onClick: onClick,
|
|
22558
22567
|
hoverEffect: hoverEffect,
|
|
@@ -25389,7 +25398,7 @@ var mobileFallbackValues$1 = {
|
|
|
25389
25398
|
};
|
|
25390
25399
|
var MOBILE_BREAKPOINT$1 = 768;
|
|
25391
25400
|
|
|
25392
|
-
var _excluded$
|
|
25401
|
+
var _excluded$z = ["themeValues", "weight", "color", "margin", "textAlign", "extraStyles", "className", "variant", "as", "dataQa", "children"];
|
|
25393
25402
|
var isBelowBreakpoint$1 = window.innerWidth < MOBILE_BREAKPOINT$1;
|
|
25394
25403
|
var isTouchDevice$1 = "ontouchstart" in window || navigator.maxTouchPoints > 1;
|
|
25395
25404
|
var mobileDeviceDetected$1 = isBelowBreakpoint$1 && isTouchDevice$1;
|
|
@@ -25412,7 +25421,7 @@ var Detail = function Detail(_ref) {
|
|
|
25412
25421
|
as = _ref$as === void 0 ? "p" : _ref$as,
|
|
25413
25422
|
dataQa = _ref.dataQa,
|
|
25414
25423
|
children = _ref.children,
|
|
25415
|
-
rest = _objectWithoutProperties(_ref, _excluded$
|
|
25424
|
+
rest = _objectWithoutProperties(_ref, _excluded$z);
|
|
25416
25425
|
return /*#__PURE__*/React__default.createElement(DetailText, _extends({
|
|
25417
25426
|
variant: variant,
|
|
25418
25427
|
as: as,
|
|
@@ -25802,7 +25811,7 @@ var fallbackValues$m = {
|
|
|
25802
25811
|
formFooterPanel: formFooterPanel
|
|
25803
25812
|
};
|
|
25804
25813
|
|
|
25805
|
-
var _excluded$
|
|
25814
|
+
var _excluded$A = ["showErrors", "themeValues"],
|
|
25806
25815
|
_excluded2 = ["ariaLabelledBy", "type", "labelDisplayOverride", "labelTextWhenNoError", "errorMessages", "isNum", "isEmail", "helperModal", "field", "fieldActions", "showErrors", "formatter", "decorator", "themeValues", "background", "customHeight", "autocompleteValue", "extraStyles", "removeFromValue", "dataQa", "isRequired", "errorFieldExtraStyles", "showFieldErrorRow", "labelTextVariant", "errorTextVariant"];
|
|
25807
25816
|
var InputField = styled__default.input.withConfig({
|
|
25808
25817
|
displayName: "FormInput__InputField",
|
|
@@ -25837,7 +25846,7 @@ var InputField = styled__default.input.withConfig({
|
|
|
25837
25846
|
var FormattedInputField = styled__default(function (_ref8) {
|
|
25838
25847
|
var showErrors = _ref8.showErrors,
|
|
25839
25848
|
themeValues = _ref8.themeValues,
|
|
25840
|
-
props = _objectWithoutProperties(_ref8, _excluded$
|
|
25849
|
+
props = _objectWithoutProperties(_ref8, _excluded$A);
|
|
25841
25850
|
return /*#__PURE__*/React__default.createElement(FormattedInput, props);
|
|
25842
25851
|
}).withConfig({
|
|
25843
25852
|
displayName: "FormInput__FormattedInputField",
|
|
@@ -25972,6 +25981,7 @@ var FormInput = function FormInput(_ref15) {
|
|
|
25972
25981
|
"aria-labelledby": ariaLabelledBy === undefined ? createIdFromString(labelTextWhenNoError) : ariaLabelledBy,
|
|
25973
25982
|
"aria-describedby": createIdFromString(labelTextWhenNoError, "error message"),
|
|
25974
25983
|
"aria-invalid": field.dirty && field.hasErrors || field.hasErrors && showErrors,
|
|
25984
|
+
"aria-required": isRequired,
|
|
25975
25985
|
onChange: function onChange(value) {
|
|
25976
25986
|
return setValue(value);
|
|
25977
25987
|
},
|
|
@@ -26004,6 +26014,7 @@ var FormInput = function FormInput(_ref15) {
|
|
|
26004
26014
|
"aria-labelledby": ariaLabelledBy === undefined ? createIdFromString(labelTextWhenNoError) : ariaLabelledBy,
|
|
26005
26015
|
"aria-describedby": createIdFromString(labelTextWhenNoError, "error message"),
|
|
26006
26016
|
"aria-invalid": field.dirty && field.hasErrors || field.hasErrors && showErrors,
|
|
26017
|
+
"aria-required": isRequired,
|
|
26007
26018
|
onChange: function onChange(e) {
|
|
26008
26019
|
return setValue(e.target.value);
|
|
26009
26020
|
},
|
|
@@ -26042,7 +26053,7 @@ var FormInput = function FormInput(_ref15) {
|
|
|
26042
26053
|
};
|
|
26043
26054
|
var FormInput$1 = themeComponent(FormInput, "FormInput", fallbackValues$m, "default");
|
|
26044
26055
|
|
|
26045
|
-
var _excluded$
|
|
26056
|
+
var _excluded$B = ["breakpoint", "childGap", "largeChild", "largeChildSize", "children"];
|
|
26046
26057
|
var FormInputRow = function FormInputRow(_ref) {
|
|
26047
26058
|
var _ref$breakpoint = _ref.breakpoint,
|
|
26048
26059
|
breakpoint = _ref$breakpoint === void 0 ? "30rem" : _ref$breakpoint,
|
|
@@ -26051,7 +26062,7 @@ var FormInputRow = function FormInputRow(_ref) {
|
|
|
26051
26062
|
largeChild = _ref.largeChild,
|
|
26052
26063
|
largeChildSize = _ref.largeChildSize,
|
|
26053
26064
|
children = _ref.children,
|
|
26054
|
-
rest = _objectWithoutProperties(_ref, _excluded$
|
|
26065
|
+
rest = _objectWithoutProperties(_ref, _excluded$B);
|
|
26055
26066
|
return /*#__PURE__*/React__default.createElement(Box, _extends({
|
|
26056
26067
|
padding: "0"
|
|
26057
26068
|
}, rest), /*#__PURE__*/React__default.createElement(Switcher, {
|
|
@@ -26062,24 +26073,24 @@ var FormInputRow = function FormInputRow(_ref) {
|
|
|
26062
26073
|
}, children));
|
|
26063
26074
|
};
|
|
26064
26075
|
|
|
26065
|
-
var _excluded$
|
|
26076
|
+
var _excluded$C = ["childGap", "bottomItem", "children"];
|
|
26066
26077
|
var FormInputColumn = function FormInputColumn(_ref) {
|
|
26067
26078
|
var _ref$childGap = _ref.childGap,
|
|
26068
26079
|
childGap = _ref$childGap === void 0 ? "0.5rem" : _ref$childGap,
|
|
26069
26080
|
bottomItem = _ref.bottomItem,
|
|
26070
26081
|
children = _ref.children,
|
|
26071
|
-
rest = _objectWithoutProperties(_ref, _excluded$
|
|
26082
|
+
rest = _objectWithoutProperties(_ref, _excluded$C);
|
|
26072
26083
|
return /*#__PURE__*/React__default.createElement(Stack, _extends({
|
|
26073
26084
|
childGap: childGap,
|
|
26074
26085
|
bottomItem: bottomItem
|
|
26075
26086
|
}, rest), children);
|
|
26076
26087
|
};
|
|
26077
26088
|
|
|
26078
|
-
var _excluded$
|
|
26089
|
+
var _excluded$D = ["themeValues", "children"];
|
|
26079
26090
|
var FormContainer = function FormContainer(_ref) {
|
|
26080
26091
|
var themeValues = _ref.themeValues,
|
|
26081
26092
|
children = _ref.children,
|
|
26082
|
-
rest = _objectWithoutProperties(_ref, _excluded$
|
|
26093
|
+
rest = _objectWithoutProperties(_ref, _excluded$D);
|
|
26083
26094
|
var _useContext = React.useContext(styled.ThemeContext),
|
|
26084
26095
|
isMobile = _useContext.isMobile;
|
|
26085
26096
|
return /*#__PURE__*/React__default.createElement(Box, _extends({
|
|
@@ -26111,7 +26122,7 @@ var FormFooterPanel = function FormFooterPanel(_ref) {
|
|
|
26111
26122
|
};
|
|
26112
26123
|
var FormFooterPanel$1 = themeComponent(withWindowSize(FormFooterPanel), "FormFooterPanel", fallbackValues$m, "default");
|
|
26113
26124
|
|
|
26114
|
-
var _excluded$
|
|
26125
|
+
var _excluded$E = ["ariaLabelledBy", "labelDisplayOverride", "labelTextWhenNoError", "errorMessages", "helperModal", "field", "fieldActions", "showErrors", "themeValues", "customHeight", "extraStyles", "removeFromValue", "dataQa", "isRequired", "errorFieldExtraStyles", "showFieldErrorRow", "labelTextVariant", "errorTextVariant", "resize", "rows", "cols", "placeholder", "maxLength"];
|
|
26115
26126
|
var TextareaField = styled__default.textarea.withConfig({
|
|
26116
26127
|
displayName: "FormTextarea__TextareaField",
|
|
26117
26128
|
componentId: "sc-94tlb0-0"
|
|
@@ -26174,7 +26185,7 @@ var FormTextarea = function FormTextarea(_ref8) {
|
|
|
26174
26185
|
cols = _ref8.cols,
|
|
26175
26186
|
placeholder = _ref8.placeholder,
|
|
26176
26187
|
maxLength = _ref8.maxLength,
|
|
26177
|
-
props = _objectWithoutProperties(_ref8, _excluded$
|
|
26188
|
+
props = _objectWithoutProperties(_ref8, _excluded$E);
|
|
26178
26189
|
var setValue = function setValue(value) {
|
|
26179
26190
|
if (removeFromValue !== undefined) {
|
|
26180
26191
|
return fieldActions.set(value.replace(removeFromValue, ""));
|
|
@@ -26314,9 +26325,13 @@ var BankItemWrapper = styled__default.div.withConfig({
|
|
|
26314
26325
|
displayName: "FormattedBankAccount__BankItemWrapper",
|
|
26315
26326
|
componentId: "sc-18hcgw4-0"
|
|
26316
26327
|
})(["display:flex;justify-content:flex-start;align-items:center;"]);
|
|
26328
|
+
var BankIconWrapper = styled__default.div.withConfig({
|
|
26329
|
+
displayName: "FormattedBankAccount__BankIconWrapper",
|
|
26330
|
+
componentId: "sc-18hcgw4-1"
|
|
26331
|
+
})(["margin-right:8px;width:36px;height:auto;display:flex;"]);
|
|
26317
26332
|
var BankAccountText = styled__default.h4.withConfig({
|
|
26318
26333
|
displayName: "FormattedBankAccount__BankAccountText",
|
|
26319
|
-
componentId: "sc-18hcgw4-
|
|
26334
|
+
componentId: "sc-18hcgw4-2"
|
|
26320
26335
|
})(["color:", ";font-size:1rem;font-weight:400;line-height:1.5rem;text-align:left;margin-right:0.5rem;display:inline-block;"], function (_ref) {
|
|
26321
26336
|
var color = _ref.color;
|
|
26322
26337
|
return color;
|
|
@@ -26328,10 +26343,7 @@ var FormattedBankAccount = function FormattedBankAccount(_ref2) {
|
|
|
26328
26343
|
accountType = _ref2.accountType,
|
|
26329
26344
|
autoPay = _ref2.autoPay,
|
|
26330
26345
|
themeValues = _ref2.themeValues;
|
|
26331
|
-
return /*#__PURE__*/React__default.createElement(BankItemWrapper, null, /*#__PURE__*/React__default.createElement(
|
|
26332
|
-
padding: "0.25rem 0 0 0",
|
|
26333
|
-
extraStyles: "margin-right: 1rem;"
|
|
26334
|
-
}, /*#__PURE__*/React__default.createElement(BankIcon, null)), /*#__PURE__*/React__default.createElement(Stack, {
|
|
26346
|
+
return /*#__PURE__*/React__default.createElement(BankItemWrapper, null, /*#__PURE__*/React__default.createElement(BankIconWrapper, null, /*#__PURE__*/React__default.createElement(BankIconLarge, null)), /*#__PURE__*/React__default.createElement(Stack, {
|
|
26335
26347
|
childGap: "0"
|
|
26336
26348
|
}, accountType === CHECKING && /*#__PURE__*/React__default.createElement(BankAccountText, {
|
|
26337
26349
|
color: themeValues.textColor
|
|
@@ -26386,7 +26398,7 @@ var CardType = function CardType(_ref) {
|
|
|
26386
26398
|
var _ref2 = cardBrands[normalizedType] || cardBrands["default"],
|
|
26387
26399
|
label = _ref2.label,
|
|
26388
26400
|
IconComponent = _ref2[size];
|
|
26389
|
-
return /*#__PURE__*/React__default.createElement(
|
|
26401
|
+
return /*#__PURE__*/React__default.createElement(IconComponent, null);
|
|
26390
26402
|
};
|
|
26391
26403
|
|
|
26392
26404
|
var textColor$2 = "".concat(CHARADE_GREY);
|
|
@@ -26463,7 +26475,7 @@ var CreditCardWrapper = styled__default.div.withConfig({
|
|
|
26463
26475
|
var CCIconWrapper = styled__default.div.withConfig({
|
|
26464
26476
|
displayName: "FormattedCreditCard__CCIconWrapper",
|
|
26465
26477
|
componentId: "sc-s0ta5l-1"
|
|
26466
|
-
})(["margin-right:
|
|
26478
|
+
})(["margin-right:8px;width:36px;height:auto;display:flex;"]);
|
|
26467
26479
|
var FormattedCreditCard = function FormattedCreditCard(_ref) {
|
|
26468
26480
|
var lastFour = _ref.lastFour,
|
|
26469
26481
|
type = _ref.type,
|
|
@@ -26578,7 +26590,7 @@ var fallbackValues$q = {
|
|
|
26578
26590
|
fontSize: fontSize$8
|
|
26579
26591
|
};
|
|
26580
26592
|
|
|
26581
|
-
var _excluded$
|
|
26593
|
+
var _excluded$F = ["themeValues", "weight", "color", "margin", "textAlign", "extraStyles", "className", "variant", "as", "dataQa", "children"];
|
|
26582
26594
|
var Heading = function Heading(_ref) {
|
|
26583
26595
|
var themeValues = _ref.themeValues,
|
|
26584
26596
|
_ref$weight = _ref.weight,
|
|
@@ -26597,7 +26609,7 @@ var Heading = function Heading(_ref) {
|
|
|
26597
26609
|
as = _ref$as === void 0 ? variant : _ref$as,
|
|
26598
26610
|
dataQa = _ref.dataQa,
|
|
26599
26611
|
children = _ref.children,
|
|
26600
|
-
rest = _objectWithoutProperties(_ref, _excluded$
|
|
26612
|
+
rest = _objectWithoutProperties(_ref, _excluded$F);
|
|
26601
26613
|
return /*#__PURE__*/React__default.createElement(HeadingText, _extends({
|
|
26602
26614
|
variant: variant,
|
|
26603
26615
|
as: as,
|
|
@@ -26877,11 +26889,11 @@ var LabeledAmountV2 = function LabeledAmountV2(_ref) {
|
|
|
26877
26889
|
}, /*#__PURE__*/React__default.createElement("span", null, label), /*#__PURE__*/React__default.createElement("span", null, amount));
|
|
26878
26890
|
};
|
|
26879
26891
|
|
|
26880
|
-
var _excluded$
|
|
26892
|
+
var _excluded$G = ["version"];
|
|
26881
26893
|
var LabeledAmount = function LabeledAmount(_ref) {
|
|
26882
26894
|
var _ref$version = _ref.version,
|
|
26883
26895
|
version = _ref$version === void 0 ? "v1" : _ref$version,
|
|
26884
|
-
rest = _objectWithoutProperties(_ref, _excluded$
|
|
26896
|
+
rest = _objectWithoutProperties(_ref, _excluded$G);
|
|
26885
26897
|
var LabeledAmountComponent = version === "v1" ? LabeledAmountV1 : LabeledAmountV2;
|
|
26886
26898
|
return /*#__PURE__*/React__default.createElement(LabeledAmountComponent, rest);
|
|
26887
26899
|
};
|
|
@@ -26959,7 +26971,7 @@ var Loading = function Loading() {
|
|
|
26959
26971
|
})))));
|
|
26960
26972
|
};
|
|
26961
26973
|
|
|
26962
|
-
var _excluded$
|
|
26974
|
+
var _excluded$H = ["leftContent", "rightContent", "footerMinHeight", "backgroundColor", "largeSide", "largeSideSize", "footerPadding", "isMobile", "footerWidth"];
|
|
26963
26975
|
var NavFooter = function NavFooter(_ref) {
|
|
26964
26976
|
var leftContent = _ref.leftContent,
|
|
26965
26977
|
rightContent = _ref.rightContent,
|
|
@@ -26974,7 +26986,7 @@ var NavFooter = function NavFooter(_ref) {
|
|
|
26974
26986
|
footerPadding = _ref$footerPadding === void 0 ? "1.5rem 1rem" : _ref$footerPadding,
|
|
26975
26987
|
isMobile = _ref.isMobile,
|
|
26976
26988
|
footerWidth = _ref.footerWidth,
|
|
26977
|
-
rest = _objectWithoutProperties(_ref, _excluded$
|
|
26989
|
+
rest = _objectWithoutProperties(_ref, _excluded$H);
|
|
26978
26990
|
return /*#__PURE__*/React__default.createElement(Box, _extends({
|
|
26979
26991
|
padding: footerPadding,
|
|
26980
26992
|
background: backgroundColor,
|
|
@@ -27005,7 +27017,7 @@ var NavFooter = function NavFooter(_ref) {
|
|
|
27005
27017
|
}, rightContent)))))));
|
|
27006
27018
|
};
|
|
27007
27019
|
|
|
27008
|
-
var _excluded$
|
|
27020
|
+
var _excluded$I = ["leftContent", "rightContent", "headerHeight", "isMobile", "backgroundColor", "headerWidth"];
|
|
27009
27021
|
var NavHeader = function NavHeader(_ref) {
|
|
27010
27022
|
var leftContent = _ref.leftContent,
|
|
27011
27023
|
rightContent = _ref.rightContent,
|
|
@@ -27014,7 +27026,7 @@ var NavHeader = function NavHeader(_ref) {
|
|
|
27014
27026
|
isMobile = _ref.isMobile,
|
|
27015
27027
|
backgroundColor = _ref.backgroundColor,
|
|
27016
27028
|
headerWidth = _ref.headerWidth,
|
|
27017
|
-
rest = _objectWithoutProperties(_ref, _excluded$
|
|
27029
|
+
rest = _objectWithoutProperties(_ref, _excluded$I);
|
|
27018
27030
|
return /*#__PURE__*/React__default.createElement(Box, _extends({
|
|
27019
27031
|
padding: "0 16px 4px",
|
|
27020
27032
|
background: backgroundColor,
|
|
@@ -27572,7 +27584,7 @@ var RadioButton$1 = function RadioButton(_ref2) {
|
|
|
27572
27584
|
borderWidth: "1px",
|
|
27573
27585
|
borderStyle: "solid",
|
|
27574
27586
|
borderRadius: "12px",
|
|
27575
|
-
margin: "6px
|
|
27587
|
+
margin: "6px 8px 6px 6px",
|
|
27576
27588
|
height: "24px",
|
|
27577
27589
|
width: "24px",
|
|
27578
27590
|
variants: buttonBorder,
|
|
@@ -38875,7 +38887,7 @@ var LoadingPill = styled__default.span.withConfig({
|
|
|
38875
38887
|
return backgroundColor;
|
|
38876
38888
|
}, shineFrames);
|
|
38877
38889
|
|
|
38878
|
-
var _excluded$
|
|
38890
|
+
var _excluded$J = ["minWidth", "maxWidth", "exactWidth", "height", "margin", "backgroundColor", "foregroundColor"];
|
|
38879
38891
|
var LoadingLine = function LoadingLine(_ref) {
|
|
38880
38892
|
var minWidth = _ref.minWidth,
|
|
38881
38893
|
maxWidth = _ref.maxWidth,
|
|
@@ -38889,7 +38901,7 @@ var LoadingLine = function LoadingLine(_ref) {
|
|
|
38889
38901
|
backgroundColor = _ref$backgroundColor === void 0 ? SEASHELL_WHITE : _ref$backgroundColor,
|
|
38890
38902
|
_ref$foregroundColor = _ref.foregroundColor,
|
|
38891
38903
|
foregroundColor = _ref$foregroundColor === void 0 ? ALABASTER_WHITE : _ref$foregroundColor,
|
|
38892
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
38904
|
+
props = _objectWithoutProperties(_ref, _excluded$J);
|
|
38893
38905
|
var calculatedWidth = Math.floor(Math.random() * (parseInt(maxWidth) - parseInt(minWidth) + 1) + parseInt(minWidth));
|
|
38894
38906
|
return /*#__PURE__*/React__default.createElement(LoadingPill, _extends({
|
|
38895
38907
|
"aria-label": "loading",
|
|
@@ -40923,7 +40935,9 @@ var EditableList = function EditableList(_ref) {
|
|
|
40923
40935
|
_ref$editItemAriaRole = _ref.editItemAriaRole,
|
|
40924
40936
|
editItemAriaRole = _ref$editItemAriaRole === void 0 ? "" : _ref$editItemAriaRole,
|
|
40925
40937
|
_ref$disablePlacehold = _ref.disablePlaceholder,
|
|
40926
|
-
disablePlaceholder = _ref$disablePlacehold === void 0 ? false : _ref$disablePlacehold
|
|
40938
|
+
disablePlaceholder = _ref$disablePlacehold === void 0 ? false : _ref$disablePlacehold,
|
|
40939
|
+
_ref$getEditHref = _ref.getEditHref,
|
|
40940
|
+
getEditHref = _ref$getEditHref === void 0 ? null : _ref$getEditHref;
|
|
40927
40941
|
var addText = "Add a".concat(itemName[0].match(/[aieouAIEOU]/) ? "n" : "", " ").concat(itemName);
|
|
40928
40942
|
return /*#__PURE__*/React__default.createElement(Box, {
|
|
40929
40943
|
padding: listPadding,
|
|
@@ -40990,7 +41004,12 @@ var EditableList = function EditableList(_ref) {
|
|
|
40990
41004
|
extraStyles: ":not(:first-child) { border-left: 2px solid ".concat(BOSTON_BLUE, ";}"),
|
|
40991
41005
|
dataQa: qaPrefix + " Edit",
|
|
40992
41006
|
key: "Edit ".concat(item.id)
|
|
40993
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
41007
|
+
}, getEditHref ? /*#__PURE__*/React__default.createElement(InternalLink, {
|
|
41008
|
+
to: getEditHref(item),
|
|
41009
|
+
fontWeight: "400",
|
|
41010
|
+
extraStyles: "margin: 0.5rem; min-width: 0;",
|
|
41011
|
+
"aria-label": "Edit ".concat(ariaLabel || itemName)
|
|
41012
|
+
}, "Edit") : /*#__PURE__*/React__default.createElement(ButtonWithAction, {
|
|
40994
41013
|
variant: "smallGhost",
|
|
40995
41014
|
text: "Edit",
|
|
40996
41015
|
action: function action() {
|
|
@@ -45288,11 +45307,11 @@ var Modal$2 = function Modal(_ref) {
|
|
|
45288
45307
|
};
|
|
45289
45308
|
var ModalControlV2 = withWindowSize(Modal$2);
|
|
45290
45309
|
|
|
45291
|
-
var _excluded$
|
|
45310
|
+
var _excluded$K = ["version"];
|
|
45292
45311
|
var Modal$3 = function Modal(_ref) {
|
|
45293
45312
|
var _ref$version = _ref.version,
|
|
45294
45313
|
version = _ref$version === void 0 ? "v1" : _ref$version,
|
|
45295
|
-
rest = _objectWithoutProperties(_ref, _excluded$
|
|
45314
|
+
rest = _objectWithoutProperties(_ref, _excluded$K);
|
|
45296
45315
|
var ModalControl = version === "v1" ? Modal$1 : ModalControlV2;
|
|
45297
45316
|
return /*#__PURE__*/React__default.createElement(ModalControl, rest);
|
|
45298
45317
|
};
|
|
@@ -45814,9 +45833,8 @@ var disabledBorderColor$1 = GHOST_GREY;
|
|
|
45814
45833
|
var disabledColor$2 = MANATEE_GREY;
|
|
45815
45834
|
var activeBackgroundColor$1 = CORNFLOWER_BLUE;
|
|
45816
45835
|
var backgroundColor$a = LINK_WATER;
|
|
45817
|
-
var borderColor$5 =
|
|
45836
|
+
var borderColor$5 = MOON_RAKER;
|
|
45818
45837
|
var color$c = ROYAL_BLUE_VIVID;
|
|
45819
|
-
var textColor$5 = BRIGHT_GREY;
|
|
45820
45838
|
var fallbackValues$L = {
|
|
45821
45839
|
disabledBackgroundColor: disabledBackgroundColor$1,
|
|
45822
45840
|
disabledBorderColor: disabledBorderColor$1,
|
|
@@ -45824,37 +45842,36 @@ var fallbackValues$L = {
|
|
|
45824
45842
|
activeBackgroundColor: activeBackgroundColor$1,
|
|
45825
45843
|
backgroundColor: backgroundColor$a,
|
|
45826
45844
|
borderColor: borderColor$5,
|
|
45827
|
-
color: color$c
|
|
45828
|
-
textColor: textColor$5
|
|
45845
|
+
color: color$c
|
|
45829
45846
|
};
|
|
45830
45847
|
|
|
45831
45848
|
var Container = styled__default(Box).withConfig({
|
|
45832
45849
|
displayName: "LinkCardstyled__Container",
|
|
45833
45850
|
componentId: "sc-l5q1h2-0"
|
|
45834
|
-
})(["display:flex;flex-direction:column;align-items:flex-start;width:100%;gap:40px;flex-shrink:0;align-self:stretch;border-radius:8px;
|
|
45835
|
-
var
|
|
45836
|
-
|
|
45837
|
-
return "\n background-color: ".concat(
|
|
45851
|
+
})(["display:flex;flex-direction:column;align-items:flex-start;width:100%;gap:40px;flex-shrink:0;align-self:stretch;border-radius:8px;", " transition:all .2s ease-in-out;", ""], function (_ref) {
|
|
45852
|
+
var isDisabled = _ref.isDisabled,
|
|
45853
|
+
theme = _ref.theme;
|
|
45854
|
+
return "\n background-color: ".concat(isDisabled ? theme.disabledBackgroundColor : theme.backgroundColor, ";\n border: 1px solid ").concat(isDisabled ? theme.disabledBorderColor : theme.borderColor, ";\n ");
|
|
45838
45855
|
}, function (_ref2) {
|
|
45839
|
-
var
|
|
45840
|
-
|
|
45841
|
-
return
|
|
45856
|
+
var isDisabled = _ref2.isDisabled,
|
|
45857
|
+
theme = _ref2.theme;
|
|
45858
|
+
return isDisabled ? "\n &:hover,\n &:active {\n cursor: default;\n box-shadow: none;\n border: 1px solid ".concat(theme.disabledBorderColor, ";\n }\n ") : "\n &:hover,\n &:active {\n cursor: pointer;\n box-shadow: 0px 0px 0px 0px rgba(41, 42, 51, 0.1),\n 0px 5px 11px 0px rgba(41, 42, 51, 0.1),\n 0px 4px 19px 0px rgba(41, 42, 51, 0.09),\n 0px 27px 26px 0px rgba(41, 42, 51, 0.05),\n 0px 56px 31px 0px rgba(41, 42, 51, 0.01),\n 0px 80px 33px 0px rgba(41, 42, 51, 0);\n }\n\n &:hover:not(:active) {\n border: 1px solid ".concat(theme.borderColor, ";\n }\n\n &:active {\n background-color: ").concat(theme.activeBackgroundColor, ";\n border: 1px solid ").concat(theme.borderColor, ";\n }\n ");
|
|
45842
45859
|
});
|
|
45843
45860
|
var Title$2 = styled__default(Heading$1).withConfig({
|
|
45844
45861
|
displayName: "LinkCardstyled__Title",
|
|
45845
45862
|
componentId: "sc-l5q1h2-1"
|
|
45846
|
-
})(["display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;align-self:stretch;overflow:hidden;text-overflow:ellipsis;font-size:
|
|
45847
|
-
var
|
|
45848
|
-
|
|
45849
|
-
return "color: ".concat(
|
|
45863
|
+
})(["display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;align-self:stretch;overflow:hidden;text-overflow:ellipsis;font-size:16px;line-height:150%;background-color:transparent;font-weight:", ";", ";"], FONT_WEIGHT_SEMIBOLD, function (_ref3) {
|
|
45864
|
+
var isDisabled = _ref3.isDisabled,
|
|
45865
|
+
theme = _ref3.theme;
|
|
45866
|
+
return "color: ".concat(isDisabled ? theme.disabledColor : theme.color, ";");
|
|
45850
45867
|
});
|
|
45851
45868
|
var Subtitle = styled__default(Paragraph$1).withConfig({
|
|
45852
45869
|
displayName: "LinkCardstyled__Subtitle",
|
|
45853
45870
|
componentId: "sc-l5q1h2-2"
|
|
45854
|
-
})(["overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;align-self:stretch;font-size:
|
|
45855
|
-
var
|
|
45856
|
-
|
|
45857
|
-
return "color: ".concat(
|
|
45871
|
+
})(["overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;align-self:stretch;font-size:14px;line-height:150%;letter-spacing:0.14px;font-weight:", ";", ";"], FONT_WEIGHT_SEMIBOLD, function (_ref4) {
|
|
45872
|
+
var isDisabled = _ref4.isDisabled,
|
|
45873
|
+
theme = _ref4.theme;
|
|
45874
|
+
return "color: ".concat(isDisabled ? theme.disabledColor : theme.color, ";");
|
|
45858
45875
|
});
|
|
45859
45876
|
var Footer = styled__default(Stack).withConfig({
|
|
45860
45877
|
displayName: "LinkCardstyled__Footer",
|
|
@@ -45873,6 +45890,7 @@ var LinkCard = function LinkCard(_ref) {
|
|
|
45873
45890
|
leftContent = _ref.leftContent,
|
|
45874
45891
|
showRight = _ref.showRight,
|
|
45875
45892
|
rightContent = _ref.rightContent,
|
|
45893
|
+
onClick = _ref.onClick,
|
|
45876
45894
|
_ref$extraStyles = _ref.extraStyles,
|
|
45877
45895
|
extraStyles = _ref$extraStyles === void 0 ? "" : _ref$extraStyles,
|
|
45878
45896
|
_ref$extraHoverStyles = _ref.extraHoverStyles,
|
|
@@ -45882,34 +45900,31 @@ var LinkCard = function LinkCard(_ref) {
|
|
|
45882
45900
|
themeValues = _ref.themeValues,
|
|
45883
45901
|
_ref$titleVariant = _ref.titleVariant,
|
|
45884
45902
|
titleVariant = _ref$titleVariant === void 0 ? "h3" : _ref$titleVariant,
|
|
45903
|
+
_ref$titlePadding = _ref.titlePadding,
|
|
45885
45904
|
_ref$disabled = _ref.disabled,
|
|
45886
45905
|
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
45887
45906
|
_ref$isExternalLink = _ref.isExternalLink,
|
|
45888
|
-
isExternalLink = _ref$isExternalLink === void 0 ? false : _ref$isExternalLink
|
|
45889
|
-
_ref$href = _ref.href,
|
|
45890
|
-
href = _ref$href === void 0 ? "" : _ref$href;
|
|
45907
|
+
isExternalLink = _ref$isExternalLink === void 0 ? false : _ref$isExternalLink;
|
|
45891
45908
|
var _useContext = React.useContext(styled.ThemeContext),
|
|
45892
45909
|
isMobile = _useContext.isMobile;
|
|
45893
45910
|
var regex = /\W/g;
|
|
45894
45911
|
var locatorSlug = title === null || title === void 0 || (_title$toLowerCase = title.toLowerCase) === null || _title$toLowerCase === void 0 || (_title$toLowerCase = _title$toLowerCase.call(title)) === null || _title$toLowerCase === void 0 || (_title$toLowerCase$re = _title$toLowerCase.replaceAll) === null || _title$toLowerCase$re === void 0 ? void 0 : _title$toLowerCase$re.call(_title$toLowerCase, regex, "-");
|
|
45895
45912
|
return /*#__PURE__*/React__default.createElement(Container, {
|
|
45896
|
-
as: "a",
|
|
45897
|
-
role: "link",
|
|
45898
|
-
href: disabled ? undefined : href,
|
|
45899
|
-
tabIndex: disabled ? -1 : 0,
|
|
45900
45913
|
borderRadius: "8px",
|
|
45901
45914
|
dataQa: "link-card-".concat(locatorSlug),
|
|
45902
45915
|
width: "100%",
|
|
45903
45916
|
maxWidth: isMobile ? "100%" : "288px",
|
|
45904
45917
|
minWidth: isMobile ? "240px" : "288px",
|
|
45905
45918
|
minHeight: "141px",
|
|
45906
|
-
padding:
|
|
45907
|
-
|
|
45919
|
+
padding: "24px",
|
|
45920
|
+
theme: themeValues,
|
|
45908
45921
|
extraStyles: extraStyles,
|
|
45909
45922
|
hoverStyles: extraHoverStyles,
|
|
45910
45923
|
activeStyles: extraActiveStyles,
|
|
45924
|
+
onClick: disabled ? noop$1 : onClick,
|
|
45911
45925
|
"aria-disabled": disabled,
|
|
45912
|
-
|
|
45926
|
+
isDisabled: disabled,
|
|
45927
|
+
role: "group",
|
|
45913
45928
|
"aria-label": "".concat(title, ", ").concat(subtitle)
|
|
45914
45929
|
}, /*#__PURE__*/React__default.createElement(Stack, {
|
|
45915
45930
|
childGap: 0,
|
|
@@ -45925,9 +45940,9 @@ var LinkCard = function LinkCard(_ref) {
|
|
|
45925
45940
|
extraStyles: "align-items: center;"
|
|
45926
45941
|
}, /*#__PURE__*/React__default.createElement(Title$2, {
|
|
45927
45942
|
variant: titleVariant,
|
|
45928
|
-
|
|
45943
|
+
theme: themeValues,
|
|
45929
45944
|
margin: 0,
|
|
45930
|
-
|
|
45945
|
+
isDisabled: disabled
|
|
45931
45946
|
}, title), isExternalLink && /*#__PURE__*/React__default.createElement(ExternalLinkIcon, {
|
|
45932
45947
|
linkColor: themeValues.color,
|
|
45933
45948
|
text: locatorSlug,
|
|
@@ -45940,8 +45955,8 @@ var LinkCard = function LinkCard(_ref) {
|
|
|
45940
45955
|
width: "100%"
|
|
45941
45956
|
}, /*#__PURE__*/React__default.createElement(Subtitle, {
|
|
45942
45957
|
variant: "pS",
|
|
45943
|
-
|
|
45944
|
-
|
|
45958
|
+
theme: themeValues,
|
|
45959
|
+
isDisabled: disabled
|
|
45945
45960
|
}, subtitle)), /*#__PURE__*/React__default.createElement(Box, {
|
|
45946
45961
|
background: "transparent",
|
|
45947
45962
|
borderWidthOverride: "0 0 0 0",
|
|
@@ -46138,7 +46153,8 @@ var IconsModule = function IconsModule(_ref) {
|
|
|
46138
46153
|
Icon = iconsMap[icon];
|
|
46139
46154
|
}
|
|
46140
46155
|
return /*#__PURE__*/React__default.createElement(Box, {
|
|
46141
|
-
padding: "0 1rem 0 0"
|
|
46156
|
+
padding: "0 1rem 0 0",
|
|
46157
|
+
"aria-hidden": "true"
|
|
46142
46158
|
}, /*#__PURE__*/React__default.createElement(Cluster, {
|
|
46143
46159
|
justify: "center",
|
|
46144
46160
|
align: "center"
|
|
@@ -46222,7 +46238,6 @@ var AutopayModalModule = function AutopayModalModule(_ref) {
|
|
|
46222
46238
|
} : navigateToSettings,
|
|
46223
46239
|
isLoading: deactivatingSchedule
|
|
46224
46240
|
};
|
|
46225
|
-
var modalLinkHoverFocus = "\n outline: none;\n cursor: pointer;\n text-decoration: underline;\n text-decoration-color: #317D4F;\n ";
|
|
46226
46241
|
var hoverStyles = "text-decoration: underline;";
|
|
46227
46242
|
var activeStyles = "text-decoration: underline;";
|
|
46228
46243
|
var renderAutoPayControl = function renderAutoPayControl() {
|
|
@@ -46257,28 +46272,25 @@ var AutopayModalModule = function AutopayModalModule(_ref) {
|
|
|
46257
46272
|
{
|
|
46258
46273
|
return /*#__PURE__*/React__default.createElement(Box, {
|
|
46259
46274
|
padding: "0",
|
|
46275
|
+
role: "button",
|
|
46276
|
+
tabIndex: "0",
|
|
46260
46277
|
onClick: onClick || function () {
|
|
46261
46278
|
toggleModal(true);
|
|
46262
46279
|
},
|
|
46280
|
+
onKeyDown: onKeyPress || function (e) {
|
|
46281
|
+
e.key === "Enter" && toggleModal(true);
|
|
46282
|
+
},
|
|
46263
46283
|
hoverStyles: hoverStyles,
|
|
46264
46284
|
activeStyles: activeStyles,
|
|
46265
|
-
extraStyles: "cursor: pointer;"
|
|
46285
|
+
extraStyles: "cursor: pointer; margin-bottom: 5px;",
|
|
46286
|
+
dataQa: "".concat(shortPlan, " On")
|
|
46266
46287
|
}, /*#__PURE__*/React__default.createElement(Cluster, {
|
|
46267
46288
|
justify: isMobile ? "flex-start" : "flex-end",
|
|
46268
46289
|
align: "center"
|
|
46269
46290
|
}, /*#__PURE__*/React__default.createElement(AutopayOnIcon, null), /*#__PURE__*/React__default.createElement(Text$1, {
|
|
46270
46291
|
variant: "pS",
|
|
46271
|
-
onClick: onClick || function () {
|
|
46272
|
-
return toggleModal(true);
|
|
46273
|
-
},
|
|
46274
|
-
onKeyPress: onKeyPress || function (e) {
|
|
46275
|
-
e.key === "Enter" && toggleModal(true);
|
|
46276
|
-
},
|
|
46277
|
-
tabIndex: "0",
|
|
46278
|
-
dataQa: "".concat(shortPlan, " On"),
|
|
46279
46292
|
color: SEA_GREEN,
|
|
46280
46293
|
weight: FONT_WEIGHT_REGULAR,
|
|
46281
|
-
hoverStyles: modalLinkHoverFocus,
|
|
46282
46294
|
extraStyles: "padding-left: 0.25rem;",
|
|
46283
46295
|
disabled: disableActions
|
|
46284
46296
|
}, "".concat(shortPlan, " ").concat(nextAutopayDate))));
|
|
@@ -47552,7 +47564,7 @@ var fallbackValues$Q = {
|
|
|
47552
47564
|
labeledAmountTotal: labeledAmountTotal
|
|
47553
47565
|
};
|
|
47554
47566
|
|
|
47555
|
-
var _excluded$
|
|
47567
|
+
var _excluded$L = ["amount"],
|
|
47556
47568
|
_excluded2$1 = ["amount"];
|
|
47557
47569
|
var PaymentDetailsContent = function PaymentDetailsContent(_ref) {
|
|
47558
47570
|
var lineItemElems = _ref.lineItemElems,
|
|
@@ -47795,7 +47807,7 @@ var PaymentDetails = function PaymentDetails(_ref4) {
|
|
|
47795
47807
|
return fee.amount > 0;
|
|
47796
47808
|
}).map(function (_ref5) {
|
|
47797
47809
|
var amount = _ref5.amount,
|
|
47798
|
-
rest = _objectWithoutProperties(_ref5, _excluded$
|
|
47810
|
+
rest = _objectWithoutProperties(_ref5, _excluded$L);
|
|
47799
47811
|
return _objectSpread2(_objectSpread2({}, rest), {}, {
|
|
47800
47812
|
amount: displayCurrency(amount)
|
|
47801
47813
|
});
|
|
@@ -48169,7 +48181,9 @@ var TermsAndConditionsControlV2 = function TermsAndConditionsControlV2(_ref) {
|
|
|
48169
48181
|
_ref$modalTitle = _ref.modalTitle,
|
|
48170
48182
|
modalTitle = _ref$modalTitle === void 0 ? "Terms and Conditions" : _ref$modalTitle,
|
|
48171
48183
|
_ref$initialFocusSele = _ref.initialFocusSelector,
|
|
48172
|
-
initialFocusSelector = _ref$initialFocusSele === void 0 ? "" : _ref$initialFocusSele
|
|
48184
|
+
initialFocusSelector = _ref$initialFocusSele === void 0 ? "" : _ref$initialFocusSele,
|
|
48185
|
+
_ref$isRequired = _ref.isRequired,
|
|
48186
|
+
isRequired = _ref$isRequired === void 0 ? false : _ref$isRequired;
|
|
48173
48187
|
var _useState = React.useState(false),
|
|
48174
48188
|
_useState2 = _slicedToArray(_useState, 2),
|
|
48175
48189
|
showTerms = _useState2[0],
|
|
@@ -48202,7 +48216,8 @@ var TermsAndConditionsControlV2 = function TermsAndConditionsControlV2(_ref) {
|
|
|
48202
48216
|
onChange: onCheck,
|
|
48203
48217
|
checkboxMargin: checkboxMargin,
|
|
48204
48218
|
extraStyles: "align-self: flex-start;",
|
|
48205
|
-
labelledById: TermsAndConditionsTitleDivId
|
|
48219
|
+
labelledById: TermsAndConditionsTitleDivId,
|
|
48220
|
+
isRequired: isRequired
|
|
48206
48221
|
}), /*#__PURE__*/React__default.createElement(Stack, {
|
|
48207
48222
|
childGap: "0.25rem",
|
|
48208
48223
|
fullHeight: true
|
|
@@ -48232,11 +48247,11 @@ var TermsAndConditionsControlV2 = function TermsAndConditionsControlV2(_ref) {
|
|
|
48232
48247
|
}, errorMessage))))));
|
|
48233
48248
|
};
|
|
48234
48249
|
|
|
48235
|
-
var _excluded$
|
|
48250
|
+
var _excluded$M = ["version"];
|
|
48236
48251
|
var TermsAndConditions = function TermsAndConditions(_ref) {
|
|
48237
48252
|
var _ref$version = _ref.version,
|
|
48238
48253
|
version = _ref$version === void 0 ? "v1" : _ref$version,
|
|
48239
|
-
rest = _objectWithoutProperties(_ref, _excluded$
|
|
48254
|
+
rest = _objectWithoutProperties(_ref, _excluded$M);
|
|
48240
48255
|
var TermsAndConditionsControl = version === "v1" ? TermsAndConditionsControlV1 : TermsAndConditionsControlV2;
|
|
48241
48256
|
return /*#__PURE__*/React__default.createElement(TermsAndConditionsControl, rest);
|
|
48242
48257
|
};
|
|
@@ -49044,7 +49059,7 @@ var InnerRadioSection = function InnerRadioSection(_ref) {
|
|
|
49044
49059
|
}, section.content))));
|
|
49045
49060
|
};
|
|
49046
49061
|
|
|
49047
|
-
var _excluded$
|
|
49062
|
+
var _excluded$N = ["themeValues", "isMobile", "supportsTouch", "sections", "openSection", "toggleOpenSection", "staggeredAnimation", "initiallyOpen", "openHeight", "containerStyles", "ariaDescribedBy", "isSectionRequired", "groupedSections", "borderOverride"];
|
|
49048
49063
|
|
|
49049
49064
|
/**
|
|
49050
49065
|
- The RadioSection component takes either a flat array (via the 'sections'
|
|
@@ -49094,7 +49109,7 @@ var RadioSection = function RadioSection(_ref) {
|
|
|
49094
49109
|
_ref$groupedSections = _ref.groupedSections,
|
|
49095
49110
|
groupedSections = _ref$groupedSections === void 0 ? [] : _ref$groupedSections,
|
|
49096
49111
|
borderOverride = _ref.borderOverride,
|
|
49097
|
-
rest = _objectWithoutProperties(_ref, _excluded$
|
|
49112
|
+
rest = _objectWithoutProperties(_ref, _excluded$N);
|
|
49098
49113
|
var _useState = React.useState(null),
|
|
49099
49114
|
_useState2 = _slicedToArray(_useState, 2),
|
|
49100
49115
|
focused = _useState2[0],
|
|
@@ -49360,7 +49375,8 @@ var RegistrationForm = function RegistrationForm(_ref) {
|
|
|
49360
49375
|
return e.key === "Enter" && handleSubmit(e);
|
|
49361
49376
|
},
|
|
49362
49377
|
autocompleteValue: "given-name",
|
|
49363
|
-
dataQa: "First name"
|
|
49378
|
+
dataQa: "First name",
|
|
49379
|
+
isRequired: true
|
|
49364
49380
|
}), /*#__PURE__*/React__default.createElement(FormInput$1, {
|
|
49365
49381
|
labelTextWhenNoError: "Last name",
|
|
49366
49382
|
errorMessages: lastNameErrorMessages,
|
|
@@ -49371,7 +49387,8 @@ var RegistrationForm = function RegistrationForm(_ref) {
|
|
|
49371
49387
|
return e.key === "Enter" && handleSubmit(e);
|
|
49372
49388
|
},
|
|
49373
49389
|
autocompleteValue: "family-name",
|
|
49374
|
-
dataQa: "Last name"
|
|
49390
|
+
dataQa: "Last name",
|
|
49391
|
+
isRequired: true
|
|
49375
49392
|
}), /*#__PURE__*/React__default.createElement(FormInput$1, {
|
|
49376
49393
|
labelTextWhenNoError: "Email address",
|
|
49377
49394
|
errorMessages: emailErrorMessages,
|
|
@@ -49384,7 +49401,8 @@ var RegistrationForm = function RegistrationForm(_ref) {
|
|
|
49384
49401
|
type: "email",
|
|
49385
49402
|
isEmail: true,
|
|
49386
49403
|
autocompleteValue: "email",
|
|
49387
|
-
dataQa: "Email address"
|
|
49404
|
+
dataQa: "Email address",
|
|
49405
|
+
isRequired: true
|
|
49388
49406
|
}), /*#__PURE__*/React__default.createElement(FormInput$1, {
|
|
49389
49407
|
labelTextWhenNoError: "Password",
|
|
49390
49408
|
errorMessages: passwordErrorMessages,
|
|
@@ -49396,7 +49414,8 @@ var RegistrationForm = function RegistrationForm(_ref) {
|
|
|
49396
49414
|
},
|
|
49397
49415
|
type: "password",
|
|
49398
49416
|
autocompleteValue: "new-password",
|
|
49399
|
-
dataQa: "Password"
|
|
49417
|
+
dataQa: "Password",
|
|
49418
|
+
isRequired: true
|
|
49400
49419
|
}), /*#__PURE__*/React__default.createElement(FormInput$1, {
|
|
49401
49420
|
labelTextWhenNoError: "Confirm password",
|
|
49402
49421
|
errorMessages: confirmPasswordErrorMessages,
|
|
@@ -49408,7 +49427,8 @@ var RegistrationForm = function RegistrationForm(_ref) {
|
|
|
49408
49427
|
},
|
|
49409
49428
|
type: "password",
|
|
49410
49429
|
autocompleteValue: "new-password",
|
|
49411
|
-
dataQa: "Confirm password"
|
|
49430
|
+
dataQa: "Confirm password",
|
|
49431
|
+
isRequired: true
|
|
49412
49432
|
}), /*#__PURE__*/React__default.createElement(Box, {
|
|
49413
49433
|
padding: isMobile ? "0" : "0.5rem 0 0"
|
|
49414
49434
|
}, /*#__PURE__*/React__default.createElement(PasswordRequirements, {
|
|
@@ -49650,7 +49670,7 @@ var Tab = function Tab(_ref) {
|
|
|
49650
49670
|
}, label));
|
|
49651
49671
|
};
|
|
49652
49672
|
|
|
49653
|
-
var _excluded$
|
|
49673
|
+
var _excluded$O = ["tabsConfig", "tabsDisplayMode", "tabsPadding", "contentPadding", "extraStyles"];
|
|
49654
49674
|
var HORIZONTAL = "horizontal";
|
|
49655
49675
|
var Tabs = function Tabs(_ref) {
|
|
49656
49676
|
var _tabsConfig$tabs$;
|
|
@@ -49663,7 +49683,7 @@ var Tabs = function Tabs(_ref) {
|
|
|
49663
49683
|
contentPadding = _ref$contentPadding === void 0 ? "0" : _ref$contentPadding,
|
|
49664
49684
|
_ref$extraStyles = _ref.extraStyles,
|
|
49665
49685
|
extraStyles = _ref$extraStyles === void 0 ? "" : _ref$extraStyles,
|
|
49666
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
49686
|
+
props = _objectWithoutProperties(_ref, _excluded$O);
|
|
49667
49687
|
var _useState = React.useState(((_tabsConfig$tabs$ = tabsConfig.tabs[0]) === null || _tabsConfig$tabs$ === void 0 ? void 0 : _tabsConfig$tabs$.label) || null),
|
|
49668
49688
|
_useState2 = _slicedToArray(_useState, 2),
|
|
49669
49689
|
activeTab = _useState2[0],
|
|
@@ -49816,7 +49836,7 @@ var Timeout = function Timeout(_ref) {
|
|
|
49816
49836
|
};
|
|
49817
49837
|
var Timeout$1 = withWindowSize(Timeout);
|
|
49818
49838
|
|
|
49819
|
-
var _excluded$
|
|
49839
|
+
var _excluded$P = ["variant", "message", "toastOpen", "closeToastNotification", "extraStyles", "minWidth", "maxWidth", "height", "childGap", "backgroundColor", "role", "ariaLive", "screenReaderMessage", "showScreenReaderMessage"];
|
|
49820
49840
|
var VARIANTS = {
|
|
49821
49841
|
SUCCESS: "success",
|
|
49822
49842
|
ERROR: "error"
|
|
@@ -49845,7 +49865,7 @@ var ToastNotification = function ToastNotification(_ref) {
|
|
|
49845
49865
|
screenReaderMessage = _ref.screenReaderMessage,
|
|
49846
49866
|
_ref$showScreenReader = _ref.showScreenReaderMessage,
|
|
49847
49867
|
showScreenReaderMessage = _ref$showScreenReader === void 0 ? true : _ref$showScreenReader,
|
|
49848
|
-
rest = _objectWithoutProperties(_ref, _excluded$
|
|
49868
|
+
rest = _objectWithoutProperties(_ref, _excluded$P);
|
|
49849
49869
|
var screenReaderMessageRef = React.useRef();
|
|
49850
49870
|
var LIVEREGION_TRANSITION_DELAY = 1000;
|
|
49851
49871
|
React.useEffect(function () {
|
|
@@ -50028,7 +50048,7 @@ var PopupMenuItemContainer = styled__default(ButtonWithAction).withConfig({
|
|
|
50028
50048
|
return "\n background-color: ".concat(isDeleteAction ? theme.menuItemHoverBackgroundColorDelete : theme.menuItemHoverBackgroundColor, ";\n ");
|
|
50029
50049
|
});
|
|
50030
50050
|
|
|
50031
|
-
var _excluded$
|
|
50051
|
+
var _excluded$Q = ["id", "closeMenuCallback", "action", "themeValues", "text", "hasIcon", "isDeleteAction", "icon", "textExtraStyles", "hoverStyles", "activeStyles", "extraStyles"];
|
|
50032
50052
|
var PopupMenuItem = function PopupMenuItem(_ref) {
|
|
50033
50053
|
var id = _ref.id,
|
|
50034
50054
|
closeMenuCallback = _ref.closeMenuCallback,
|
|
@@ -50044,7 +50064,7 @@ var PopupMenuItem = function PopupMenuItem(_ref) {
|
|
|
50044
50064
|
hoverStyles = _ref.hoverStyles,
|
|
50045
50065
|
activeStyles = _ref.activeStyles,
|
|
50046
50066
|
extraStyles = _ref.extraStyles,
|
|
50047
|
-
rest = _objectWithoutProperties(_ref, _excluded$
|
|
50067
|
+
rest = _objectWithoutProperties(_ref, _excluded$Q);
|
|
50048
50068
|
return /*#__PURE__*/React__default.createElement(PopupMenuItemContainer, _extends({
|
|
50049
50069
|
id: id,
|
|
50050
50070
|
role: "menuItem",
|
|
@@ -50283,7 +50303,7 @@ var ActionLinkButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
50283
50303
|
});
|
|
50284
50304
|
});
|
|
50285
50305
|
|
|
50286
|
-
var _excluded$
|
|
50306
|
+
var _excluded$R = ["width", "height", "color"];
|
|
50287
50307
|
var DropdownIconV2 = function DropdownIconV2(_ref) {
|
|
50288
50308
|
var _ref$width = _ref.width,
|
|
50289
50309
|
width = _ref$width === void 0 ? "18" : _ref$width,
|
|
@@ -50291,7 +50311,7 @@ var DropdownIconV2 = function DropdownIconV2(_ref) {
|
|
|
50291
50311
|
height = _ref$height === void 0 ? "19" : _ref$height,
|
|
50292
50312
|
_ref$color = _ref.color,
|
|
50293
50313
|
color = _ref$color === void 0 ? "#292A33" : _ref$color,
|
|
50294
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
50314
|
+
props = _objectWithoutProperties(_ref, _excluded$R);
|
|
50295
50315
|
return /*#__PURE__*/React__default.createElement("svg", _extends({
|
|
50296
50316
|
"aria-hidden": "true",
|
|
50297
50317
|
width: width,
|
|
@@ -50439,7 +50459,7 @@ var SearchBox = function SearchBox(_ref) {
|
|
|
50439
50459
|
}));
|
|
50440
50460
|
};
|
|
50441
50461
|
|
|
50442
|
-
var _excluded$
|
|
50462
|
+
var _excluded$S = ["width", "height", "color"];
|
|
50443
50463
|
var CheckboxCheckmarkIcon = function CheckboxCheckmarkIcon(_ref) {
|
|
50444
50464
|
var _ref$width = _ref.width,
|
|
50445
50465
|
width = _ref$width === void 0 ? "18" : _ref$width,
|
|
@@ -50447,7 +50467,7 @@ var CheckboxCheckmarkIcon = function CheckboxCheckmarkIcon(_ref) {
|
|
|
50447
50467
|
height = _ref$height === void 0 ? "18" : _ref$height,
|
|
50448
50468
|
_ref$color = _ref.color,
|
|
50449
50469
|
color = _ref$color === void 0 ? "#FEFEFE" : _ref$color,
|
|
50450
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
50470
|
+
props = _objectWithoutProperties(_ref, _excluded$S);
|
|
50451
50471
|
return /*#__PURE__*/React__default.createElement("svg", _extends({
|
|
50452
50472
|
xmlns: "http://www.w3.org/2000/svg",
|
|
50453
50473
|
width: width,
|
|
@@ -51143,7 +51163,7 @@ var fallbackValues$11 = {
|
|
|
51143
51163
|
justifyContent: justifyContent
|
|
51144
51164
|
};
|
|
51145
51165
|
|
|
51146
|
-
var _excluded$
|
|
51166
|
+
var _excluded$T = ["variant", "imageUrl", "isMobile", "theme", "extraStyles"],
|
|
51147
51167
|
_excluded2$2 = ["theme", "isMobile"],
|
|
51148
51168
|
_excluded3 = ["theme", "isMobile"],
|
|
51149
51169
|
_excluded4 = ["theme", "isMobile"];
|
|
@@ -51166,7 +51186,7 @@ var HeroContainer = styled__default(function (_ref2) {
|
|
|
51166
51186
|
isMobile = _ref2.isMobile,
|
|
51167
51187
|
theme = _ref2.theme,
|
|
51168
51188
|
extraStyles = _ref2.extraStyles,
|
|
51169
|
-
props = _objectWithoutProperties(_ref2, _excluded$
|
|
51189
|
+
props = _objectWithoutProperties(_ref2, _excluded$T);
|
|
51170
51190
|
return /*#__PURE__*/React__default.createElement(Box, props);
|
|
51171
51191
|
}).withConfig({
|
|
51172
51192
|
displayName: "HeroImagestyled__HeroContainer",
|
|
@@ -51479,12 +51499,12 @@ var TurnstileWidget = /*#__PURE__*/React.forwardRef(function (_ref4, ref) {
|
|
|
51479
51499
|
var hoverColor$6 = ROYAL_BLUE;
|
|
51480
51500
|
var activeColor$b = CONGRESS_BLUE;
|
|
51481
51501
|
var linkColor$6 = ROYAL_BLUE_VIVID;
|
|
51482
|
-
var textColor$
|
|
51502
|
+
var textColor$5 = CHARADE_GREY;
|
|
51483
51503
|
var fallbackValues$12 = {
|
|
51484
51504
|
linkColor: linkColor$6,
|
|
51485
51505
|
hoverColor: hoverColor$6,
|
|
51486
51506
|
activeColor: activeColor$b,
|
|
51487
|
-
textColor: textColor$
|
|
51507
|
+
textColor: textColor$5
|
|
51488
51508
|
};
|
|
51489
51509
|
|
|
51490
51510
|
var TOOLTIP_THEME_SOURCE = "Popover";
|