@thecb/components 8.0.4-beta.5 → 8.0.4-beta.6
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 +47 -47
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +47 -47
- package/dist/index.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/atoms/radio-button-with-label/RadioButtonWithLabel.js +7 -8
- package/src/components/atoms/radio-button-with-label/RadioButtonWithLabel.theme.js +4 -4
package/dist/index.cjs.js
CHANGED
|
@@ -26812,11 +26812,11 @@ var ProcessingFee = function ProcessingFee(_ref) {
|
|
|
26812
26812
|
|
|
26813
26813
|
var ProcessingFee$1 = themeComponent(ProcessingFee, "ProcessingFee", fallbackValues$s, "default");
|
|
26814
26814
|
|
|
26815
|
-
var
|
|
26816
|
-
var
|
|
26815
|
+
var activeColor$5 = MATISSE_BLUE;
|
|
26816
|
+
var inactiveBorderColor = GREY_CHATEAU;
|
|
26817
26817
|
var fallbackValues$t = {
|
|
26818
|
-
|
|
26819
|
-
|
|
26818
|
+
inactiveBorderColor: inactiveBorderColor,
|
|
26819
|
+
activeColor: activeColor$5
|
|
26820
26820
|
};
|
|
26821
26821
|
|
|
26822
26822
|
var HiddenRadioInput = styled__default.input.withConfig({
|
|
@@ -26827,21 +26827,21 @@ var Circle = styled__default.div.withConfig({
|
|
|
26827
26827
|
displayName: "RadioButtonWithLabel__Circle",
|
|
26828
26828
|
componentId: "sc-1m9whwg-1"
|
|
26829
26829
|
})(["flex-shrink:0;margin-right:8px;width:1.5rem;height 1.5rem;border:", ";border-radius:50%;box-sizing:border-box;padding:2px;:after{content:\"\";width:100%;height:100%;display:block;background:", ";border-radius:50%;transform:scale(0);}"], function (_ref) {
|
|
26830
|
-
var
|
|
26831
|
-
return "1px solid ".concat(
|
|
26830
|
+
var inactiveBorderColor = _ref.inactiveBorderColor;
|
|
26831
|
+
return "1px solid ".concat(inactiveBorderColor);
|
|
26832
26832
|
}, function (_ref2) {
|
|
26833
|
-
var
|
|
26834
|
-
return
|
|
26833
|
+
var activeColor = _ref2.activeColor;
|
|
26834
|
+
return activeColor;
|
|
26835
26835
|
});
|
|
26836
26836
|
var InputAndLabelContainer = styled__default(Cluster).withConfig({
|
|
26837
26837
|
displayName: "RadioButtonWithLabel__InputAndLabelContainer",
|
|
26838
26838
|
componentId: "sc-1m9whwg-2"
|
|
26839
26839
|
})(["overflow:visible;", ":checked + label ", ":after{transform:scale(0.85);transition:transform 0.15s;}", ":checked + label ", "{border:", "}", ":focus + label ", "{{box-shadow:", "}"], HiddenRadioInput, Circle, HiddenRadioInput, Circle, function (_ref3) {
|
|
26840
|
-
var
|
|
26841
|
-
return "1px solid ".concat(
|
|
26840
|
+
var activeColor = _ref3.activeColor;
|
|
26841
|
+
return "1px solid ".concat(activeColor, ";");
|
|
26842
26842
|
}, HiddenRadioInput, Circle, function (_ref4) {
|
|
26843
|
-
var
|
|
26844
|
-
return "0px 0px 2px 1px ".concat(
|
|
26843
|
+
var activeColor = _ref4.activeColor;
|
|
26844
|
+
return "0px 0px 2px 1px ".concat(activeColor, ";");
|
|
26845
26845
|
});
|
|
26846
26846
|
|
|
26847
26847
|
var RadioButtonWithLabel = function RadioButtonWithLabel(_ref5) {
|
|
@@ -26861,7 +26861,7 @@ var RadioButtonWithLabel = function RadioButtonWithLabel(_ref5) {
|
|
|
26861
26861
|
return /*#__PURE__*/React__default.createElement(InputAndLabelContainer, {
|
|
26862
26862
|
align: "center",
|
|
26863
26863
|
childGap: "0.5rem",
|
|
26864
|
-
|
|
26864
|
+
activeColor: themeValues.activeColor
|
|
26865
26865
|
}, /*#__PURE__*/React__default.createElement(HiddenRadioInput, {
|
|
26866
26866
|
"aria-invalid": ariaInvalid,
|
|
26867
26867
|
style: {
|
|
@@ -26881,17 +26881,17 @@ var RadioButtonWithLabel = function RadioButtonWithLabel(_ref5) {
|
|
|
26881
26881
|
htmlFor: id,
|
|
26882
26882
|
extraStyles: "\n font-size: 1rem;\n display: flex; \n width: 100%;\n :hover {\n cursor: pointer;\n }\n "
|
|
26883
26883
|
}, /*#__PURE__*/React__default.createElement(Circle, {
|
|
26884
|
-
|
|
26885
|
-
|
|
26884
|
+
activeColor: themeValues.activeColor,
|
|
26885
|
+
inactiveBorderColor: themeValues.inactiveBorderColor
|
|
26886
26886
|
}), labelText));
|
|
26887
26887
|
};
|
|
26888
26888
|
|
|
26889
26889
|
var RadioButtonWithLabel$1 = themeComponent(RadioButtonWithLabel, "RadioButtonWithLabel", fallbackValues$t);
|
|
26890
26890
|
|
|
26891
|
-
var activeColor$
|
|
26891
|
+
var activeColor$6 = "".concat(MATISSE_BLUE);
|
|
26892
26892
|
var inactiveColor = "".concat(GREY_CHATEAU);
|
|
26893
26893
|
var fallbackValues$u = {
|
|
26894
|
-
activeColor: activeColor$
|
|
26894
|
+
activeColor: activeColor$6,
|
|
26895
26895
|
inactiveColor: inactiveColor
|
|
26896
26896
|
};
|
|
26897
26897
|
|
|
@@ -27067,14 +27067,14 @@ var SearchableSelect = function SearchableSelect(_ref) {
|
|
|
27067
27067
|
|
|
27068
27068
|
var SearchableSelect$1 = themeComponent(SearchableSelect, "SearchableSelect", fallbackValues$v, "default");
|
|
27069
27069
|
|
|
27070
|
-
var borderColor$
|
|
27070
|
+
var borderColor$2 = {
|
|
27071
27071
|
"default": "".concat(GREY_CHATEAU)
|
|
27072
27072
|
};
|
|
27073
27073
|
var borderSize = {
|
|
27074
27074
|
"default": "1px"
|
|
27075
27075
|
};
|
|
27076
27076
|
var fallbackValues$w = {
|
|
27077
|
-
borderColor: borderColor$
|
|
27077
|
+
borderColor: borderColor$2,
|
|
27078
27078
|
borderSize: borderSize
|
|
27079
27079
|
};
|
|
27080
27080
|
|
|
@@ -37895,12 +37895,12 @@ var TypeaheadInput = function TypeaheadInput(_ref) {
|
|
|
37895
37895
|
}));
|
|
37896
37896
|
};
|
|
37897
37897
|
|
|
37898
|
-
var backgroundColor$
|
|
37898
|
+
var backgroundColor$5 = WHITE;
|
|
37899
37899
|
var imageBackgroundColor = INFO_BLUE;
|
|
37900
37900
|
var headerBackgroundColor = STORM_GREY;
|
|
37901
37901
|
var headerColor = WHITE;
|
|
37902
37902
|
var fallbackValues$y = {
|
|
37903
|
-
backgroundColor: backgroundColor$
|
|
37903
|
+
backgroundColor: backgroundColor$5,
|
|
37904
37904
|
imageBackgroundColor: imageBackgroundColor,
|
|
37905
37905
|
headerBackgroundColor: headerBackgroundColor,
|
|
37906
37906
|
headerColor: headerColor
|
|
@@ -38053,11 +38053,11 @@ var Card = function Card(_ref) {
|
|
|
38053
38053
|
var Card$1 = themeComponent(withWindowSize(Card), "Card", fallbackValues$y);
|
|
38054
38054
|
|
|
38055
38055
|
var fontFamily$6 = "Public Sans, sans-serif";
|
|
38056
|
-
var activeColor$
|
|
38056
|
+
var activeColor$7 = MATISSE_BLUE;
|
|
38057
38057
|
var linkColor$3 = CHARADE_GREY;
|
|
38058
38058
|
var fallbackValues$A = {
|
|
38059
38059
|
fontFamily: fontFamily$6,
|
|
38060
|
-
activeColor: activeColor$
|
|
38060
|
+
activeColor: activeColor$7,
|
|
38061
38061
|
linkColor: linkColor$3
|
|
38062
38062
|
};
|
|
38063
38063
|
|
|
@@ -38187,11 +38187,11 @@ var TableCell_styled = styled__default.td.withConfig({
|
|
|
38187
38187
|
return extraStyles;
|
|
38188
38188
|
});
|
|
38189
38189
|
|
|
38190
|
-
var backgroundColor$
|
|
38191
|
-
var borderColor$
|
|
38190
|
+
var backgroundColor$6 = ALABASTER_WHITE;
|
|
38191
|
+
var borderColor$3 = GREY_CHATEAU;
|
|
38192
38192
|
var fallbackValues$B = {
|
|
38193
|
-
backgroundColor: backgroundColor$
|
|
38194
|
-
borderColor: borderColor$
|
|
38193
|
+
backgroundColor: backgroundColor$6,
|
|
38194
|
+
borderColor: borderColor$3
|
|
38195
38195
|
};
|
|
38196
38196
|
|
|
38197
38197
|
var StyledTableHead = styled__default.thead.withConfig({
|
|
@@ -38209,10 +38209,10 @@ var StyledTableHead = styled__default.thead.withConfig({
|
|
|
38209
38209
|
return fontSize;
|
|
38210
38210
|
});
|
|
38211
38211
|
|
|
38212
|
-
var borderColor$
|
|
38212
|
+
var borderColor$4 = GREY_CHATEAU;
|
|
38213
38213
|
var hoverBackgroundColor$1 = HOVER_LIGHT_BLUE;
|
|
38214
38214
|
var fallbackValues$C = {
|
|
38215
|
-
borderColor: borderColor$
|
|
38215
|
+
borderColor: borderColor$4,
|
|
38216
38216
|
hoverBackgroundColor: hoverBackgroundColor$1
|
|
38217
38217
|
};
|
|
38218
38218
|
|
|
@@ -40189,9 +40189,9 @@ AddressForm.reducer = reducer;
|
|
|
40189
40189
|
AddressForm.mapStateToProps = mapStateToProps$1;
|
|
40190
40190
|
AddressForm.mapDispatchToProps = mapDispatchToProps;
|
|
40191
40191
|
|
|
40192
|
-
var backgroundColor$
|
|
40192
|
+
var backgroundColor$7 = "#ebeffb";
|
|
40193
40193
|
var fallbackValues$D = {
|
|
40194
|
-
backgroundColor: backgroundColor$
|
|
40194
|
+
backgroundColor: backgroundColor$7
|
|
40195
40195
|
};
|
|
40196
40196
|
|
|
40197
40197
|
var Banner = function Banner(_ref) {
|
|
@@ -41186,10 +41186,10 @@ ForgotPasswordForm.mapStateToProps = mapStateToProps$5;
|
|
|
41186
41186
|
ForgotPasswordForm.mapDispatchToProps = mapDispatchToProps$4;
|
|
41187
41187
|
|
|
41188
41188
|
var textColor$4 = "#ffffff";
|
|
41189
|
-
var backgroundColor$
|
|
41189
|
+
var backgroundColor$8 = "#182848";
|
|
41190
41190
|
var fallbackValues$G = {
|
|
41191
41191
|
textColor: textColor$4,
|
|
41192
|
-
backgroundColor: backgroundColor$
|
|
41192
|
+
backgroundColor: backgroundColor$8
|
|
41193
41193
|
};
|
|
41194
41194
|
|
|
41195
41195
|
var HighlightTabRow = function HighlightTabRow(_ref) {
|
|
@@ -46394,7 +46394,7 @@ var borderRadius = {
|
|
|
46394
46394
|
largeTitle: "0.25rem",
|
|
46395
46395
|
small: "0.25rem"
|
|
46396
46396
|
};
|
|
46397
|
-
var backgroundColor$
|
|
46397
|
+
var backgroundColor$9 = {
|
|
46398
46398
|
"default": WHITE,
|
|
46399
46399
|
largeTitle: WHITE,
|
|
46400
46400
|
small: WHITE
|
|
@@ -46409,7 +46409,7 @@ var fallbackValues$H = {
|
|
|
46409
46409
|
titleSpacing: titleSpacing,
|
|
46410
46410
|
boxShadow: boxShadow$1,
|
|
46411
46411
|
borderRadius: borderRadius,
|
|
46412
|
-
backgroundColor: backgroundColor$
|
|
46412
|
+
backgroundColor: backgroundColor$9
|
|
46413
46413
|
};
|
|
46414
46414
|
|
|
46415
46415
|
/*
|
|
@@ -46469,7 +46469,7 @@ var Module = function Module(_ref) {
|
|
|
46469
46469
|
|
|
46470
46470
|
var Module$1 = /*#__PURE__*/React.memo(themeComponent(Module, "Module", fallbackValues$H, "default"));
|
|
46471
46471
|
|
|
46472
|
-
var backgroundColor$
|
|
46472
|
+
var backgroundColor$a = {
|
|
46473
46473
|
profile: "#3b414d",
|
|
46474
46474
|
cms: "#3b414d"
|
|
46475
46475
|
};
|
|
@@ -46478,7 +46478,7 @@ var shadowColor = {
|
|
|
46478
46478
|
cms: "#292A33"
|
|
46479
46479
|
};
|
|
46480
46480
|
var fallbackValues$I = {
|
|
46481
|
-
backgroundColor: backgroundColor$
|
|
46481
|
+
backgroundColor: backgroundColor$a,
|
|
46482
46482
|
shadowColor: shadowColor
|
|
46483
46483
|
};
|
|
46484
46484
|
|
|
@@ -46637,14 +46637,14 @@ var TitleModule = function TitleModule(_ref) {
|
|
|
46637
46637
|
|
|
46638
46638
|
var color$a = "#15749D";
|
|
46639
46639
|
var hoverColor$5 = "#116285";
|
|
46640
|
-
var activeColor$
|
|
46640
|
+
var activeColor$8 = "#0E506D";
|
|
46641
46641
|
var linkColor$4 = "#3176AA";
|
|
46642
46642
|
var fontWeight$6 = FONT_WEIGHT_REGULAR;
|
|
46643
46643
|
var modalLinkHoverFocus = "outline: none;\n cursor: pointer;\n text-decoration: underline;\n text-decoration-color: #317D4F;";
|
|
46644
46644
|
var fallbackValues$J = {
|
|
46645
46645
|
color: color$a,
|
|
46646
46646
|
hoverColor: hoverColor$5,
|
|
46647
|
-
activeColor: activeColor$
|
|
46647
|
+
activeColor: activeColor$8,
|
|
46648
46648
|
linkColor: linkColor$4,
|
|
46649
46649
|
fontWeight: fontWeight$6,
|
|
46650
46650
|
modalLinkHoverFocus: modalLinkHoverFocus
|
|
@@ -47441,9 +47441,9 @@ var arrowColor = WHITE;
|
|
|
47441
47441
|
var numberColor = MATISSE_BLUE;
|
|
47442
47442
|
var hoverBackgroundColor$2 = ALABASTER_WHITE;
|
|
47443
47443
|
var activeBackgroundColor$1 = WHITE;
|
|
47444
|
-
var activeColor$
|
|
47444
|
+
var activeColor$9 = MATISSE_BLUE;
|
|
47445
47445
|
var fallbackValues$K = {
|
|
47446
|
-
activeColor: activeColor$
|
|
47446
|
+
activeColor: activeColor$9,
|
|
47447
47447
|
activeBackgroundColor: activeBackgroundColor$1,
|
|
47448
47448
|
arrowColor: arrowColor,
|
|
47449
47449
|
hoverBackgroundColor: hoverBackgroundColor$2,
|
|
@@ -47718,7 +47718,7 @@ var PaymentButtonBar = function PaymentButtonBar(_ref) {
|
|
|
47718
47718
|
}, !hideBackButton && /*#__PURE__*/React__default.createElement(React.Fragment, null, backButton), !hideForwardButton && /*#__PURE__*/React__default.createElement(React.Fragment, null, forwardButton))));
|
|
47719
47719
|
};
|
|
47720
47720
|
|
|
47721
|
-
var backgroundColor$
|
|
47721
|
+
var backgroundColor$b = {
|
|
47722
47722
|
"default": "transparent",
|
|
47723
47723
|
small: "transparent"
|
|
47724
47724
|
};
|
|
@@ -47735,7 +47735,7 @@ var labeledAmountTotal = {
|
|
|
47735
47735
|
small: "p"
|
|
47736
47736
|
};
|
|
47737
47737
|
var fallbackValues$L = {
|
|
47738
|
-
backgroundColor: backgroundColor$
|
|
47738
|
+
backgroundColor: backgroundColor$b,
|
|
47739
47739
|
lineItem: lineItem,
|
|
47740
47740
|
labeledAmountSubtotal: labeledAmountSubtotal,
|
|
47741
47741
|
labeledAmountTotal: labeledAmountTotal
|
|
@@ -48132,7 +48132,7 @@ var AccountAndRoutingModal = function AccountAndRoutingModal(_ref) {
|
|
|
48132
48132
|
|
|
48133
48133
|
var AccountAndRoutingModal$1 = themeComponent(AccountAndRoutingModal, "AccountAndRoutingModal", fallbackValues$M, "default");
|
|
48134
48134
|
|
|
48135
|
-
var backgroundColor$
|
|
48135
|
+
var backgroundColor$c = {
|
|
48136
48136
|
"default": "#ffffff",
|
|
48137
48137
|
footer: "#ffffff"
|
|
48138
48138
|
};
|
|
@@ -48162,7 +48162,7 @@ var modalLinkHoverFocus$2 = {
|
|
|
48162
48162
|
footer: standardInteractionStyles
|
|
48163
48163
|
};
|
|
48164
48164
|
var fallbackValues$N = {
|
|
48165
|
-
backgroundColor: backgroundColor$
|
|
48165
|
+
backgroundColor: backgroundColor$c,
|
|
48166
48166
|
linkColor: linkColor$6,
|
|
48167
48167
|
border: border$3,
|
|
48168
48168
|
fontSize: fontSize$b,
|
|
@@ -49023,13 +49023,13 @@ var RadioGroup = function RadioGroup(_ref) {
|
|
|
49023
49023
|
var headingBackgroundColor$1 = "".concat(WHITE);
|
|
49024
49024
|
var headingDisabledColor = "".concat(ATHENS_GREY);
|
|
49025
49025
|
var bodyBackgroundColor$1 = "#eeeeee";
|
|
49026
|
-
var borderColor$
|
|
49026
|
+
var borderColor$5 = "".concat(GREY_CHATEAU);
|
|
49027
49027
|
var focusStyles = "outline: none;";
|
|
49028
49028
|
var fallbackValues$O = {
|
|
49029
49029
|
headingBackgroundColor: headingBackgroundColor$1,
|
|
49030
49030
|
headingDisabledColor: headingDisabledColor,
|
|
49031
49031
|
bodyBackgroundColor: bodyBackgroundColor$1,
|
|
49032
|
-
borderColor: borderColor$
|
|
49032
|
+
borderColor: borderColor$5,
|
|
49033
49033
|
focusStyles: focusStyles
|
|
49034
49034
|
};
|
|
49035
49035
|
|