@thecb/components 5.9.0-beta.2 → 5.9.0-beta.5

package/dist/index.esm.js

@@ -4997,7 +4997,7 @@ var colors = /*#__PURE__*/Object.freeze({
 var TextSpan = styled.span.withConfig({
   displayName: "Textstyled__TextSpan",
   componentId: "sc-1oy97we-0"
-})(["--font-size:", ";font-size:var(--font-size);line-height:calc(1.5 * var(--font-size));font-weight:", ";font-family:", ";color:", ";&:hover{", "}&:focus{outline:3px solid ", ";outline-offset:2px;}", " ", ""], function (_ref) {
+})(["--font-size:", ";font-size:var(--font-size);line-height:calc(1.5 * var(--font-size));font-weight:", ";font-family:", ";color:", ";white-space:", ";&:hover{", "}&:focus{outline:3px solid ", ";outline-offset:2px;}", " ", ""], function (_ref) {
   var fontSize = _ref.fontSize;
   return fontSize;
 }, function (_ref2) {
@@ -5010,14 +5010,17 @@ var TextSpan = styled.span.withConfig({
   var color = _ref4.color;
   return color;
 }, function (_ref5) {
-  var hoverStyles = _ref5.hoverStyles;
+  var $textWrap = _ref5.$textWrap;
+  return $textWrap ? "initial" : "nowrap";
+}, function (_ref6) {
+  var hoverStyles = _ref6.hoverStyles;
   return css(["", ""], hoverStyles);
-}, ROYAL_BLUE, function (_ref6) {
-  var disabled = _ref6.disabled,
-      disabledStyles = _ref6.disabledStyles;
+}, ROYAL_BLUE, function (_ref7) {
+  var disabled = _ref7.disabled,
+      disabledStyles = _ref7.disabledStyles;
   return disabled && css(["", ""], disabledStyles);
-}, function (_ref7) {
-  var extraStyles = _ref7.extraStyles;
+}, function (_ref8) {
+  var extraStyles = _ref8.extraStyles;
   return extraStyles;
 });
 
@@ -6149,7 +6152,7 @@ var general = /*#__PURE__*/Object.freeze({
   screenReaderOnlyStyle: screenReaderOnlyStyle
 });
 
-var _excluded$1 = ["themeValues", "weight", "color", "extraStyles", "hoverStyles", "onClick", "onKeyPress", "as", "dataQa", "children"];
+var _excluded$1 = ["themeValues", "weight", "color", "textWrap", "extraStyles", "hoverStyles", "onClick", "onKeyPress", "as", "dataQa", "children"];
 
 var Text = function Text(_ref) {
   var themeValues = _ref.themeValues,
@@ -6157,6 +6160,8 @@ var Text = function Text(_ref) {
       weight = _ref$weight === void 0 ? FONT_WEIGHT_REGULAR : _ref$weight,
       _ref$color = _ref.color,
       color = _ref$color === void 0 ? FIREFLY_GREY : _ref$color,
+      _ref$textWrap = _ref.textWrap,
+      textWrap = _ref$textWrap === void 0 ? true : _ref$textWrap,
       _ref$extraStyles = _ref.extraStyles,
       extraStyles = _ref$extraStyles === void 0 ? "" : _ref$extraStyles,
       hoverStyles = _ref.hoverStyles,
@@ -6177,7 +6182,8 @@ var Text = function Text(_ref) {
     hoverStyles: hoverStyles,
     onClick: onClick,
     onKeyPress: onKeyPress,
-    "data-qa": dataQa
+    "data-qa": dataQa,
+    $textWrap: textWrap
   }, rest), safeChildren(children, /*#__PURE__*/React.createElement("span", null)));
 };
 
@@ -6439,8 +6445,8 @@ var ClusterInnerWrapper = styled.div.withConfig({
   displayName: "Clusterstyled__ClusterInnerWrapper",
   componentId: "sc-1dkqsm7-1"
 })(["box-sizing:border-box;display:flex;flex-wrap:", ";justify-content:", ";align-items:", ";margin:calc(", " / 2 * -1);min-height:", ";min-width:", ";> *{margin:calc(", " / 2);}"], function (_ref7) {
-  var nowrap = _ref7.nowrap;
-  return nowrap ? "nowrap" : "wrap";
+  var $nowrap = _ref7.$nowrap;
+  return $nowrap ? "nowrap" : "wrap";
 }, function (_ref8) {
   var justify = _ref8.justify;
   return justify;
@@ -6500,7 +6506,7 @@ var Cluster = function Cluster(_ref) {
     childGap: childGap,
     minHeight: minHeight,
     minWidth: minWidth,
-    nowrap: nowrap
+    $nowrap: nowrap
   }, safeChildren(children, /*#__PURE__*/React.createElement(Fragment, null))));
 };
 
@@ -12507,7 +12513,7 @@ var SpinnerIcon = function SpinnerIcon(_ref3) {
   }))))));
 };
 
-var _excluded$h = ["action", "variant", "text", "isLoading", "dataQa", "textExtraStyles", "contentOverride", "extraStyles", "tabIndex", "children"];
+var _excluded$h = ["action", "variant", "text", "textWrap", "isLoading", "dataQa", "textExtraStyles", "contentOverride", "extraStyles", "tabIndex", "children"];
 var rotate$1 = posed.div({
   fixed: {
     rotate: "0deg"
@@ -12564,6 +12570,8 @@ var ButtonWithAction = function ButtonWithAction(_ref2) {
       _ref2$variant = _ref2.variant,
       variant = _ref2$variant === void 0 ? "primary" : _ref2$variant,
       text = _ref2.text,
+      _ref2$textWrap = _ref2.textWrap,
+      textWrap = _ref2$textWrap === void 0 ? false : _ref2$textWrap,
       _ref2$isLoading = _ref2.isLoading,
       isLoading = _ref2$isLoading === void 0 ? false : _ref2$isLoading,
       _ref2$dataQa = _ref2.dataQa,
@@ -12608,6 +12616,7 @@ var ButtonWithAction = function ButtonWithAction(_ref2) {
     weight: themeValues.fontWeight,
     variant: themeValues.fontSizeVariant,
     color: themeValues.color,
+    textWrap: textWrap,
     extraStyles: textExtraStyles
   }, text)));
 };
@@ -15347,7 +15356,8 @@ var AddObligation = function AddObligation(_ref) {
       action = _ref.action,
       themeValues = _ref.themeValues,
       extraStyles = _ref.extraStyles,
-      textExtraStyles = _ref.textExtraStyles;
+      textExtraStyles = _ref.textExtraStyles,
+      dataQa = _ref.dataQa;
   var hoverStyles = "\n  &:hover {\n    .fill { fill: ".concat(themeValues.hoverColor, "; }\n    .stroke { stroke: ").concat(themeValues.hoverColor, "; }\n    button { text-decoration: underline; text-decoration-color: ").concat(themeValues.hoverColor, "; }\n    span { color: ").concat(themeValues.hoverColor, "; }\n  }");
   var activeStyles = "\n   &:active {\n     .fill { fill: ".concat(themeValues.activeColor, "; }\n     .stroke { stroke: ").concat(themeValues.activeColor, "; }\n    button { text-decoration: underline; text-decoration-color: ").concat(themeValues.activeColor, "; }\n    span { color: ").concat(themeValues.activeColor, "; }\n    }");
   var defaultStyles = "\n      min-height: 0;\n      .fill { fill: ".concat(themeValues.color, "; }\n      .stroke { stroke: ").concat(themeValues.color, "; }\n      &:focus {\n        outline: 3px solid ").concat(ROYAL_BLUE, ";\n        outline-offset: 2px;\n      }\n     ");
@@ -15358,7 +15368,8 @@ var AddObligation = function AddObligation(_ref) {
     activeStyles: activeStyles,
     extraStyles: defaultStyles,
     onClick: action,
-    tabIndex: "0"
+    tabIndex: "0",
+    dataQa: dataQa
   }, /*#__PURE__*/React.createElement(Cover, {
     singleChild: true,
     minHeight: "100%"
@@ -15970,7 +15981,7 @@ var Title = function Title(_ref) {
 
 var Title$1 = themeComponent(Title, "Title", fallbacks, "large");
 
-var color$3 = "#15749D";
+var color$3 = "#292A33";
 var fallbackValues$6 = {
   color: color$3
 };
@@ -39492,7 +39503,7 @@ var PaymentDetailsActions = function PaymentDetailsActions(_ref) {
     variant: "tertiary",
     text: "Set Up ".concat(planType),
     action: function action() {
-      setDetailedObligation(obligations, config);
+      setDetailedObligation(obligations, config, obligationAssocID);
       handleAutopayAction();
     },
     dataQa: "Set Up Autopay",
@@ -39600,7 +39611,6 @@ var InactiveControlsModule = function InactiveControlsModule(_ref) {
       agencyName = _ref.agencyName,
       configType = _ref.configType,
       actions = _ref.actions;
-  console.log("actions are", actions);
 
   var _useState = useState(false),
       _useState2 = _slicedToArray(_useState, 2),