@thecb/components 8.4.5-beta.3 → 8.4.5-beta.5

package/dist/index.cjs.js

@@ -38107,7 +38107,7 @@ var background$2 = "".concat(ATHENS_GREY);
 var white$1 = "".concat(WHITE);
 var black = "#000";
 var focusBorder = "".concat(MATISSE_BLUE);
-var themeValues$1 = {
+var themeValues = {
   background: background$2,
   white: white$1,
   black: black,
@@ -38117,7 +38117,7 @@ var themeValues$1 = {
 var TypeaheadInputWrapper = styled__default.div.withConfig({
   displayName: "TypeaheadInput__TypeaheadInputWrapper",
   componentId: "sc-cumjdb-0"
-})(["display:flex;align-content:center;align-items:center;background:", ";input{border:0;height:72px;width:100%;padding:1.5rem;padding-left:1rem;min-width:100px;margin:0;box-sizing:border-box;position:relative;font-size:1.1rem;line-height:2rem;font-weight:400;background-color:", ";color:", ";box-shadow:none;border:1px solid transparent;&:focus{border:1px solid ", ";}}"], themeValues$1.background, themeValues$1.background, themeValues$1.black, themeValues$1.focusBorder);
+})(["display:flex;align-content:center;align-items:center;background:", ";input{border:0;height:72px;width:100%;padding:1.5rem;padding-left:1rem;min-width:100px;margin:0;box-sizing:border-box;position:relative;font-size:1.1rem;line-height:2rem;font-weight:400;background-color:", ";color:", ";box-shadow:none;border:1px solid transparent;&:focus{border:1px solid ", ";}}"], themeValues.background, themeValues.background, themeValues.black, themeValues.focusBorder);
 
 var TypeaheadInput = function TypeaheadInput(_ref) {
   var handleChange = _ref.handleChange,
@@ -42956,27 +42956,27 @@ var Container = styled__default(Box).withConfig({
   componentId: "sc-l5q1h2-0"
 })(["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;&:hover,&:active{cursor:pointer;box-shadow:0px 0px 0px 0px rgba(41,42,51,0.1),0px 5px 11px 0px rgba(41,42,51,0.1),0px 4px 19px 0px rgba(41,42,51,0.09),0px 27px 26px 0px rgba(41,42,51,0.05),0px 56px 31px 0px rgba(41,42,51,0.01),0px 80px 33px 0px rgba(41,42,51,0);}&:hover:not(:active){", "}&:active{", "}"], function (_ref) {
   var themeValues = _ref.themeValues;
-  return "\n    background-color: ".concat(themeValues.cardBackgroundColor, ";\n    border: 1px solid ").concat(themeValues.cardBorderColor, ";\n  ");
+  return "\n    background-color: ".concat(themeValues.backgroundColor, ";\n    border: 1px solid ").concat(themeValues.borderColor, ";\n  ");
 }, function (_ref2) {
   var themeValues = _ref2.themeValues;
-  return "border: 1px solid ".concat(themeValues.cardBorderColor, ";");
+  return "border: 1px solid rgba(".concat(themeValues.borderColor, ", .3);");
 }, function (_ref3) {
   var themeValues = _ref3.themeValues;
-  return "\n      background-color: ".concat(themeValues.cardActiveBackgroundColor, ";\n      border: 1px solid ").concat(themeValues.cardColor, ";\n    ;");
+  return "\n      background-color: rgba(".concat(themeValues.activeBackgroundColor, ", 0.1);\n      border: 1px solid ").concat(themeValues.color, ";\n    ;");
 });
 var Title$2 = styled__default(Heading$1).withConfig({
   displayName: "LinkCardstyled__Title",
   componentId: "sc-l5q1h2-1"
 })(["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 (_ref4) {
   var themeValues = _ref4.themeValues;
-  return "color: ".concat(themeValues.cardColor, ";");
+  return "color: ".concat(themeValues.color, ";");
 });
 var Subtitle = styled__default(Paragraph$1).withConfig({
   displayName: "LinkCardstyled__Subtitle",
   componentId: "sc-l5q1h2-2"
 })(["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 (_ref5) {
   var themeValues = _ref5.themeValues;
-  return "color: ".concat(themeValues.cardColor, ";");
+  return "color: ".concat(themeValues.color, ";");
 });
 var Footer = styled__default(Stack).withConfig({
   displayName: "LinkCardstyled__Footer",
@@ -42988,7 +42988,6 @@ var LinkCard = function LinkCard(_ref) {
       title = _ref$title === void 0 ? "Test Workflow" : _ref$title,
       _ref$subtitle = _ref.subtitle,
       subtitle = _ref$subtitle === void 0 ? "Link your benefit plan" : _ref$subtitle,
-      parentThemeValues = _ref.parentThemeValues,
       showLeft = _ref.showLeft,
       leftContent = _ref.leftContent,
       showRight = _ref.showRight,
@@ -43000,6 +42999,7 @@ var LinkCard = function LinkCard(_ref) {
       extraHoverStyles = _ref$extraHoverStyles === void 0 ? "" : _ref$extraHoverStyles,
       _ref$extraActiveStyle = _ref.extraActiveStyles,
       extraActiveStyles = _ref$extraActiveStyle === void 0 ? "" : _ref$extraActiveStyle,
+      themeValues = _ref.themeValues,
       _ref$titleVariant = _ref.titleVariant,
       titleVariant = _ref$titleVariant === void 0 ? "h3" : _ref$titleVariant;
   console.log("LinkCard themeValues", themeValues);
@@ -43017,7 +43017,7 @@ var LinkCard = function LinkCard(_ref) {
     minWidth: isMobile ? "240px" : "288px",
     minHeight: "141px",
     padding: "24px",
-    themeValues: parentThemeValues,
+    themeValues: themeValues,
     extraStyles: extraStyles,
     hoverStyles: extraHoverStyles,
     activeStyles: extraActiveStyles,
@@ -43035,21 +43035,21 @@ var LinkCard = function LinkCard(_ref) {
     width: "100%"
   }, /*#__PURE__*/React__default.createElement(Title$2, {
     variant: titleVariant,
-    themeValues: parentThemeValues,
+    themeValues: themeValues,
     margin: 0
   }, title)), /*#__PURE__*/React__default.createElement(Box, {
     padding: "0 0 40px",
     width: "100%"
   }, /*#__PURE__*/React__default.createElement(Subtitle, {
     variant: "pS",
-    themeValues: parentThemeValues
+    themeValues: themeValues
   }, subtitle)), /*#__PURE__*/React__default.createElement(Box, {
     background: "transparent",
     borderWidthOverride: "0 0 0 0",
     padding: "0",
     width: "100%"
   }, /*#__PURE__*/React__default.createElement(Footer, {
-    themeValues: parentThemeValues,
+    themeValues: themeValues,
     direction: "row",
     childGap: "6px",
     justify: "space-between"