@thecb/components 6.3.1-beta.3 → 6.3.1-beta.4

package/dist/index.d.ts

@@ -3,9 +3,28 @@ import React from 'react';
 type Expand<T> = T extends infer O ? { [K in keyof O]: O[K] } : never;
 
 interface CardProps {
-  variant?: string;
-  width?: string;
+  text?: string;
+  titleText?: string;
+  titleVariant?: string;
   extraStyles?: string;
+  imgSrc?: string;
+  imgHeight?: string;
+  imgObjectFit?:
+    | "contain"
+    | "cover"
+    | "fill"
+    | "none"
+    | "scale-down"
+    | "inherit"
+    | "initial"
+    | "revert"
+    | "revert-layer"
+    | "unset";
+  headerText?: string;
+  headerVariant?: string;
+  borderRadius?: string;
+  width?: string;
+  padding?: string;
 }
 
 declare const Card: React.FC<Expand<CardProps> &
@@ -228,6 +247,20 @@ interface ParagraphProps {
 declare const Paragraph: React.FC<Expand<ParagraphProps> &
   React.HTMLAttributes<HTMLElement>>;
 
+interface TextProps {
+  weight?: string;
+  color?: string;
+  textWrap?: boolean;
+  extraStyles?: string;
+  hoverStyles?: string;
+  as?: string;
+  dataQa?: string;
+  variant?: string;
+}
+
+declare const Text: React.FC<Expand<TextProps> &
+  React.HTMLAttributes<HTMLElement>>;
+
 interface TitleProps {
   variant?: string;
   color?: string;
@@ -269,5 +302,5 @@ interface DefaultPageTemplateProps {
 declare const DefaultPageTemplate: React.FC<Expand<DefaultPageTemplateProps> &
   React.HTMLAttributes<HTMLElement>>;
 
-export { Box, BoxProps, ButtonWithAction, ButtonWithActionProps, ButtonWithLink, ButtonWithLinkProps, Card, CardProps, Center, CenterProps, Cluster, ClusterProps, Cover, CoverProps, DefaultPageTemplate, DefaultPageTemplateProps, ExternalLink, ExternalLinkProps, FooterWithSubfooter, FooterWithSubfooterProps, InternalLink, InternalLinkProps, NavFooter, NavFooterProps, NavHeader, NavHeaderProps, NavTabs, NavTabsProps, Paragraph, ParagraphProps, Stack, StackProps, Switcher, SwitcherProps, Title, TitleProps };
+export { Box, BoxProps, ButtonWithAction, ButtonWithActionProps, ButtonWithLink, ButtonWithLinkProps, Card, CardProps, Center, CenterProps, Cluster, ClusterProps, Cover, CoverProps, DefaultPageTemplate, DefaultPageTemplateProps, ExternalLink, ExternalLinkProps, FooterWithSubfooter, FooterWithSubfooterProps, InternalLink, InternalLinkProps, NavFooter, NavFooterProps, NavHeader, NavHeaderProps, NavTabs, NavTabsProps, Paragraph, ParagraphProps, Stack, StackProps, Switcher, SwitcherProps, Text, TextProps, Title, TitleProps };
 //# sourceMappingURL=index.d.ts.map

package/dist/index.esm.js

@@ -35125,30 +35125,126 @@ var TypeaheadInput = function TypeaheadInput(_ref) {
 };
 
 var backgroundColor$5 = WHITE;
+var imageBackgroundColor = INFO_BLUE;
+var headerBackgroundColor = STORM_GREY;
+var headerColor = WHITE;
 var fallbackValues$w = {
-  backgroundColor: backgroundColor$5
+  backgroundColor: backgroundColor$5,
+  imageBackgroundColor: imageBackgroundColor,
+  headerBackgroundColor: headerBackgroundColor,
+  headerColor: headerColor
 };
 
-var _excluded$w = ["themeValues", "variant", "children", "extraStyles", "width"];
+var CardImage = styled.img.withConfig({
+  displayName: "CardImagestyled__CardImage",
+  componentId: "sc-ug7kyn-0"
+})(["background:", ";object-fit:", ";height:", ";"], function (_ref) {
+  var backgroundColor = _ref.backgroundColor;
+  return backgroundColor;
+}, function (_ref2) {
+  var objectFit = _ref2.objectFit;
+  return objectFit;
+}, function (_ref3) {
+  var height = _ref3.height;
+  return height;
+});
+
+var titleColor = BRIGHT_GREY;
+var titleWeight = FONT_WEIGHT_BOLD;
+var fallbackValues$x = _defineProperty({
+  titleColor: titleColor,
+  titleWeight: titleWeight
+}, "titleWeight", titleWeight);
+
+var CardText = function CardText(_ref) {
+  var text = _ref.text,
+      titleText = _ref.titleText,
+      _ref$titleVariant = _ref.titleVariant,
+      titleVariant = _ref$titleVariant === void 0 ? "small" : _ref$titleVariant,
+      themeValues = _ref.themeValues;
+  return /*#__PURE__*/React.createElement(Cover, null, /*#__PURE__*/React.createElement(Stack, null, titleText && /*#__PURE__*/React.createElement(Title$1, {
+    variant: titleVariant,
+    color: themeValues.titleColor,
+    weight: themeValues === null || themeValues === void 0 ? void 0 : themeValues.titleWeight
+  }, titleText), /*#__PURE__*/React.createElement(Paragraph$1, {
+    color: themeValues.textColor
+  }, text)));
+};
+var CardText$1 = themeComponent(withWindowSize(CardText), "CardText", fallbackValues$x);
+
+var CardHeader = function CardHeader(_ref) {
+  var headerText = _ref.headerText,
+      headerColor = _ref.headerColor,
+      headerVariant = _ref.headerVariant,
+      backgroundColor = _ref.backgroundColor,
+      padding = _ref.padding,
+      borderRadius = _ref.borderRadius;
+  return /*#__PURE__*/React.createElement(Box, {
+    padding: padding,
+    background: backgroundColor,
+    borderRadius: "".concat(borderRadius, " ").concat(borderRadius, " 0 0")
+  }, /*#__PURE__*/React.createElement(Title$1, {
+    variant: headerVariant,
+    color: headerColor
+  }, headerText));
+};
 
 var Card = function Card(_ref) {
   var themeValues = _ref.themeValues,
-      variant = _ref.variant,
       children = _ref.children,
       extraStyles = _ref.extraStyles,
       _ref$width = _ref.width,
       width = _ref$width === void 0 ? "276px" : _ref$width,
-      props = _objectWithoutProperties(_ref, _excluded$w);
-
-  return /*#__PURE__*/React.createElement(BoxWithShadow$1, _extends({
+      text = _ref.text,
+      titleText = _ref.titleText,
+      _ref$titleVariant = _ref.titleVariant,
+      titleVariant = _ref$titleVariant === void 0 ? "small" : _ref$titleVariant,
+      imgSrc = _ref.imgSrc,
+      _ref$imgHeight = _ref.imgHeight,
+      imgHeight = _ref$imgHeight === void 0 ? "150px" : _ref$imgHeight,
+      _ref$imgObjectFit = _ref.imgObjectFit,
+      imgObjectFit = _ref$imgObjectFit === void 0 ? "none" : _ref$imgObjectFit,
+      headerText = _ref.headerText,
+      _ref$headerVariant = _ref.headerVariant,
+      headerVariant = _ref$headerVariant === void 0 ? "small" : _ref$headerVariant,
+      _ref$borderRadius = _ref.borderRadius,
+      borderRadius = _ref$borderRadius === void 0 ? "4px" : _ref$borderRadius,
+      _ref$padding = _ref.padding,
+      padding = _ref$padding === void 0 ? "24px" : _ref$padding;
+  var numberOfChildren = children.length + (imgSrc ? 1 : 0) + (text ? 1 : 0);
+  return /*#__PURE__*/React.createElement(BoxWithShadow$1, {
     variant: "baseStandard",
     background: themeValues.backgroundColor,
-    borderRadius: "4px",
+    borderRadius: borderRadius,
     padding: "0",
     margin: "0",
     minWidth: width,
     extraStyles: extraStyles
-  }, props), /*#__PURE__*/React.createElement(Cover, null, children));
+  }, /*#__PURE__*/React.createElement(Cover, {
+    singleChild: true
+  }, /*#__PURE__*/React.createElement(Stack, {
+    fullHeight: true,
+    childGap: "0",
+    bottomItem: numberOfChildren
+  }, headerText && /*#__PURE__*/React.createElement(CardHeader, {
+    headerText: headerText,
+    headerColor: themeValues.headerColor,
+    headerVariant: headerVariant,
+    backgroundColor: themeValues.headerBackgroundColor,
+    borderRadius: borderRadius,
+    padding: padding
+  }), imgSrc && /*#__PURE__*/React.createElement(CardImage, {
+    height: imgHeight,
+    objectFit: imgObjectFit,
+    backgroundColor: themeValues.imageBackgroundColor,
+    src: imgSrc
+  }), /*#__PURE__*/React.createElement(Box, {
+    padding: padding
+  }, text && /*#__PURE__*/React.createElement(CardText$1, {
+    titleText: titleText,
+    text: text,
+    titleVariant: titleVariant
+  }), children))));
 };
 
 var Card$1 = themeComponent(withWindowSize(Card), "Card", fallbackValues$w);
@@ -35156,7 +35252,7 @@ var Card$1 = themeComponent(withWindowSize(Card), "Card", fallbackValues$w);
 var fontFamily$6 = "Public Sans, sans-serif";
 var activeColor$6 = MATISSE_BLUE;
 var linkColor$3 = CHARADE_GREY;
-var fallbackValues$x = {
+var fallbackValues$y = {
   fontFamily: fontFamily$6,
   activeColor: activeColor$6,
   linkColor: linkColor$3
@@ -35189,7 +35285,7 @@ var NavTab = function NavTab(_ref) {
   }, label));
 };
 
-var NavTab$1 = themeComponent(NavTab, "NavTab", fallbackValues$x);
+var NavTab$1 = themeComponent(NavTab, "NavTab", fallbackValues$y);
 
 var NavTabs = function NavTabs(_ref) {
   var tabsConfig = _ref.tabsConfig,
@@ -37252,11 +37348,11 @@ ChangePasswordForm.reducer = reducer$1;
 ChangePasswordForm.mapStateToProps = mapStateToProps$2;
 ChangePasswordForm.mapDispatchToProps = mapDispatchToProps$1;
 
-var titleColor = "#292A33";
+var titleColor$1 = "#292A33";
 var headingBackgroundColor = "transparent";
 var bodyBackgroundColor = "transparent";
-var fallbackValues$y = {
-  titleColor: titleColor,
+var fallbackValues$z = {
+  titleColor: titleColor$1,
   headingBackgroundColor: headingBackgroundColor,
   bodyBackgroundColor: bodyBackgroundColor
 };
@@ -37382,7 +37478,7 @@ var CollapsibleSection = function CollapsibleSection(_ref) {
   }, children))));
 };
 
-var CollapsibleSection$1 = themeComponent(CollapsibleSection, "CollapsibleSection", fallbackValues$y);
+var CollapsibleSection$1 = themeComponent(CollapsibleSection, "CollapsibleSection", fallbackValues$z);
 
 var EditNameForm = function EditNameForm(_ref) {
   var fields = _ref.fields,
@@ -37788,7 +37884,7 @@ EmailForm.mapDispatchToProps = mapDispatchToProps$3;
 
 var footerBackgroundColor = BRIGHT_GREY;
 var subfooterBackgroundColor = STORM_GREY;
-var fallbackValues$z = {
+var fallbackValues$A = {
   footerBackgroundColor: footerBackgroundColor,
   subfooterBackgroundColor: subfooterBackgroundColor
 };
@@ -37820,7 +37916,7 @@ var FooterWithSubfooter = function FooterWithSubfooter(_ref) {
   }));
 };
 
-var FooterWithSubfooter$1 = themeComponent(FooterWithSubfooter, "FooterWithSubfooter", fallbackValues$z);
+var FooterWithSubfooter$1 = themeComponent(FooterWithSubfooter, "FooterWithSubfooter", fallbackValues$A);
 
 var ForgotPasswordForm = function ForgotPasswordForm(_ref) {
   var _EmailErrorMessages;
@@ -37872,7 +37968,7 @@ ForgotPasswordForm.mapDispatchToProps = mapDispatchToProps$4;
 
 var textColor$2 = "#ffffff";
 var backgroundColor$6 = "#182848";
-var fallbackValues$A = {
+var fallbackValues$B = {
   textColor: textColor$2,
   backgroundColor: backgroundColor$6
 };
@@ -37929,7 +38025,7 @@ var HighlightTabRow = function HighlightTabRow(_ref) {
   }), repeat( /*#__PURE__*/React.createElement(Box, null), boxesAfter))));
 };
 
-var HighlightTabRow$1 = /*#__PURE__*/memo(themeComponent(HighlightTabRow, "HighlightTabRow", fallbackValues$A));
+var HighlightTabRow$1 = /*#__PURE__*/memo(themeComponent(HighlightTabRow, "HighlightTabRow", fallbackValues$B));
 
 var AccountBillIcon = function AccountBillIcon() {
   return /*#__PURE__*/React.createElement("svg", {
@@ -43337,7 +43433,7 @@ var backgroundColor$7 = {
   largeTitle: WHITE,
   small: WHITE
 };
-var fallbackValues$B = {
+var fallbackValues$C = {
   fontSize: fontSize$9,
   fontWeight: fontWeight$5,
   fontColor: fontColor,
@@ -43396,7 +43492,7 @@ var Module = function Module(_ref) {
   }, children)));
 };
 
-var Module$1 = /*#__PURE__*/memo(themeComponent(Module, "Module", fallbackValues$B, "default"));
+var Module$1 = /*#__PURE__*/memo(themeComponent(Module, "Module", fallbackValues$C, "default"));
 
 var backgroundColor$8 = {
   profile: "#3b414d",
@@ -43406,7 +43502,7 @@ var shadowColor = {
   profile: "#292A33",
   cms: "#292A33"
 };
-var fallbackValues$C = {
+var fallbackValues$D = {
   backgroundColor: backgroundColor$8,
   shadowColor: shadowColor
 };
@@ -43447,7 +43543,7 @@ var NavMenuDesktop = function NavMenuDesktop(_ref) {
   }, menuContent));
 };
 
-var NavMenuDesktop$1 = themeComponent(NavMenuDesktop, "NavMenu", fallbackValues$C, "profile");
+var NavMenuDesktop$1 = themeComponent(NavMenuDesktop, "NavMenu", fallbackValues$D, "profile");
 
 var menu = posed.div({
   invisible: {
@@ -43503,7 +43599,7 @@ var NavMenuMobile = function NavMenuMobile(_ref) {
   }, menuContent));
 };
 
-var NavMenuMobile$1 = themeComponent(NavMenuMobile, "NavMenu", fallbackValues$C, "profile");
+var NavMenuMobile$1 = themeComponent(NavMenuMobile, "NavMenu", fallbackValues$D, "profile");
 
 var IconsModule = function IconsModule(_ref) {
   var icon = _ref.icon,
@@ -43560,7 +43656,7 @@ var activeColor$7 = "#0E506D";
 var linkColor$4 = "#3176AA";
 var fontWeight$6 = FONT_WEIGHT_REGULAR;
 var modalLinkHoverFocus = "outline: none;\n  cursor: pointer;\n  text-decoration: underline;\n  text-decoration-color: #317D4F;";
-var fallbackValues$D = {
+var fallbackValues$E = {
   color: color$a,
   hoverColor: hoverColor$5,
   activeColor: activeColor$7,
@@ -43672,7 +43768,7 @@ var AutopayModal = function AutopayModal(_ref) {
   }, modalExtraProps), renderAutoPayControl());
 };
 
-var AutopayModalModule = themeComponent(AutopayModal, "AutopayModal", fallbackValues$D);
+var AutopayModalModule = themeComponent(AutopayModal, "AutopayModal", fallbackValues$E);
 
 var AmountModule = function AmountModule(_ref) {
   var totalAmountDue = _ref.totalAmountDue,
@@ -44484,14 +44580,14 @@ var labeledAmountTotal = {
   "default": "h6",
   small: "p"
 };
-var fallbackValues$E = {
+var fallbackValues$F = {
   backgroundColor: backgroundColor$9,
   lineItem: lineItem,
   labeledAmountSubtotal: labeledAmountSubtotal,
   labeledAmountTotal: labeledAmountTotal
 };
 
-var _excluded$x = ["amount"],
+var _excluded$w = ["amount"],
     _excluded2$1 = ["amount"];
 
 var PaymentDetailsContent = function PaymentDetailsContent(_ref) {
@@ -44636,7 +44732,7 @@ var PaymentDetails = function PaymentDetails(_ref4) {
     return fee.amount > 0;
   }).map(function (_ref5) {
     var amount = _ref5.amount,
-        rest = _objectWithoutProperties(_ref5, _excluded$x);
+        rest = _objectWithoutProperties(_ref5, _excluded$w);
 
     return _objectSpread2(_objectSpread2({}, rest), {}, {
       amount: displayCurrency(amount)
@@ -44735,7 +44831,7 @@ var PaymentDetails = function PaymentDetails(_ref4) {
   });
 };
 
-var PaymentDetails$1 = themeComponent(PaymentDetails, "PaymentDetails", fallbackValues$E, "default");
+var PaymentDetails$1 = themeComponent(PaymentDetails, "PaymentDetails", fallbackValues$F, "default");
 
 var linkColor$5 = {
   "default": "#3176AA"
@@ -44752,7 +44848,7 @@ var fontWeight$7 = {
 var modalLinkHoverFocus$1 = {
   "default": "outline: none; text-decoration: underline;"
 };
-var fallbackValues$F = {
+var fallbackValues$G = {
   linkColor: linkColor$5,
   fontSize: fontSize$a,
   lineHeight: lineHeight$4,
@@ -44811,7 +44907,7 @@ var AccountAndRoutingModal = function AccountAndRoutingModal(_ref) {
   }, link));
 };
 
-var AccountAndRoutingModal$1 = themeComponent(AccountAndRoutingModal, "AccountAndRoutingModal", fallbackValues$F, "default");
+var AccountAndRoutingModal$1 = themeComponent(AccountAndRoutingModal, "AccountAndRoutingModal", fallbackValues$G, "default");
 
 var PaymentFormACH = function PaymentFormACH(_ref) {
   var _routingNumberErrors, _accountNumberErrors;
@@ -45368,7 +45464,7 @@ var headingDisabledColor = "".concat(ATHENS_GREY);
 var bodyBackgroundColor$1 = "#eeeeee";
 var borderColor$3 = "".concat(GREY_CHATEAU);
 var focusStyles = "outline: none;";
-var fallbackValues$G = {
+var fallbackValues$H = {
   headingBackgroundColor: headingBackgroundColor$1,
   headingDisabledColor: headingDisabledColor,
   bodyBackgroundColor: bodyBackgroundColor$1,
@@ -45587,7 +45683,7 @@ var RadioSection = function RadioSection(_ref) {
   })));
 };
 
-var RadioSection$1 = themeComponent(RadioSection, "RadioSection", fallbackValues$G);
+var RadioSection$1 = themeComponent(RadioSection, "RadioSection", fallbackValues$H);
 
 var RegistrationForm = function RegistrationForm(_ref) {
   var _emailErrorMessages, _passwordErrorMessage;
@@ -45884,7 +45980,7 @@ var ResetPasswordSuccess = withWindowSize(ResetConfirmationForm$2);
 var activeTabBackground = "#FFFFFF";
 var activeTabAccent = "#15749D";
 var activeTabHover = "#B8D5E1";
-var fallbackValues$H = {
+var fallbackValues$I = {
   activeTabBackground: activeTabBackground,
   activeTabAccent: activeTabAccent,
   activeTabHover: activeTabHover
@@ -45963,12 +46059,12 @@ var Tabs = function Tabs(_ref) {
   }))));
 };
 
-var Tabs$1 = themeComponent(Tabs, "NavigationTab", fallbackValues$H);
+var Tabs$1 = themeComponent(Tabs, "NavigationTab", fallbackValues$I);
 
 var activeTabBackground$1 = "#FFFFFF";
 var activeTabAccent$1 = "#15749D";
 var activeTabHover$1 = "#B8D5E1";
-var fallbackValues$I = {
+var fallbackValues$J = {
   activeTabBackground: activeTabBackground$1,
   activeTabAccent: activeTabAccent$1,
   activeTabHover: activeTabHover$1
@@ -46024,7 +46120,7 @@ var TabSidebar = function TabSidebar(_ref) {
   })));
 };
 
-var TabSidebar$1 = themeComponent(TabSidebar, "ProfileTab", fallbackValues$I);
+var TabSidebar$1 = themeComponent(TabSidebar, "ProfileTab", fallbackValues$J);
 
 var backgroundColor$a = {
   "default": "#ffffff",
@@ -46055,7 +46151,7 @@ var modalLinkHoverFocus$2 = {
   "default": standardInteractionStyles,
   footer: standardInteractionStyles
 };
-var fallbackValues$J = {
+var fallbackValues$K = {
   backgroundColor: backgroundColor$a,
   linkColor: linkColor$6,
   border: border$3,
@@ -46117,7 +46213,7 @@ var TermsAndConditionsModal = function TermsAndConditionsModal(_ref) {
   }, link));
 };
 
-var TermsAndConditionsModal$1 = themeComponent(TermsAndConditionsModal, "TermsAndConditionsModal", fallbackValues$J, "default");
+var TermsAndConditionsModal$1 = themeComponent(TermsAndConditionsModal, "TermsAndConditionsModal", fallbackValues$K, "default");
 
 var TermsAndConditions = function TermsAndConditions(_ref) {
   var onCheck = _ref.onCheck,
@@ -46190,14 +46286,14 @@ var Timeout$1 = withWindowSize(Timeout);
 var fontWeight$9 = "600";
 var fontColor$1 = WHITE;
 var textAlign$1 = "left";
-var headerBackgroundColor = BRIGHT_GREY;
-var imageBackgroundColor = MATISSE_BLUE;
-var fallbackValues$K = {
+var headerBackgroundColor$1 = BRIGHT_GREY;
+var imageBackgroundColor$1 = MATISSE_BLUE;
+var fallbackValues$L = {
   fontWeight: fontWeight$9,
   fontColor: fontColor$1,
   textAlign: textAlign$1,
-  headerBackgroundColor: headerBackgroundColor,
-  imageBackgroundColor: imageBackgroundColor
+  headerBackgroundColor: headerBackgroundColor$1,
+  imageBackgroundColor: imageBackgroundColor$1
 };
 
 var WelcomeImage = styled.img.withConfig({
@@ -46239,7 +46335,7 @@ var WelcomeModule = function WelcomeModule(_ref) {
   })))));
 };
 
-var WelcomeModule$1 = /*#__PURE__*/memo(themeComponent(WelcomeModule, "WelcomeModule", fallbackValues$K));
+var WelcomeModule$1 = /*#__PURE__*/memo(themeComponent(WelcomeModule, "WelcomeModule", fallbackValues$L));
 
 var WorkflowTile = function WorkflowTile(_ref) {
   var _ref$workflowName = _ref.workflowName,
@@ -46289,7 +46385,7 @@ var WorkflowTile = function WorkflowTile(_ref) {
 };
 
 var pageBackground = "#FBFCFD";
-var fallbackValues$L = {
+var fallbackValues$M = {
   pageBackground: pageBackground
 };
 
@@ -46336,7 +46432,7 @@ var CenterSingle = function CenterSingle(_ref) {
   })));
 };
 
-var CenterSingle$1 = withWindowSize(themeComponent(CenterSingle, "Global", fallbackValues$L));
+var CenterSingle$1 = withWindowSize(themeComponent(CenterSingle, "Global", fallbackValues$M));
 
 var CenterStack = function CenterStack(_ref) {
   var header = _ref.header,
@@ -46378,7 +46474,7 @@ var CenterStack = function CenterStack(_ref) {
   })));
 };
 
-var CenterStack$1 = withWindowSize(themeComponent(CenterStack, "Global", fallbackValues$L));
+var CenterStack$1 = withWindowSize(themeComponent(CenterStack, "Global", fallbackValues$M));
 
 var CenterSingle$2 = function CenterSingle(_ref) {
   var header = _ref.header,
@@ -46423,7 +46519,7 @@ var CenterSingle$2 = function CenterSingle(_ref) {
   })));
 };
 
-var DefaultPageTemplate = withWindowSize(themeComponent(CenterSingle$2, "Global", fallbackValues$L));
+var DefaultPageTemplate = withWindowSize(themeComponent(CenterSingle$2, "Global", fallbackValues$M));
 
 var SidebarSingleContent = function SidebarSingleContent(_ref) {
   var header = _ref.header,
@@ -46477,7 +46573,7 @@ var SidebarSingleContent = function SidebarSingleContent(_ref) {
   })));
 };
 
-var SidebarSingleContent$1 = withWindowSize(themeComponent(SidebarSingleContent, "Global", fallbackValues$L));
+var SidebarSingleContent$1 = withWindowSize(themeComponent(SidebarSingleContent, "Global", fallbackValues$M));
 
 var SidebarStackContent = function SidebarStackContent(_ref) {
   var header = _ref.header,
@@ -46548,7 +46644,7 @@ var SidebarStackContent = function SidebarStackContent(_ref) {
   })));
 };
 
-var SidebarStackContent$1 = withWindowSize(themeComponent(SidebarStackContent, "Global", fallbackValues$L));
+var SidebarStackContent$1 = withWindowSize(themeComponent(SidebarStackContent, "Global", fallbackValues$M));