@thecb/components 4.0.14 → 4.0.15-beta.0

package/dist/index.cjs.js

@@ -19917,9 +19917,7 @@ var ERRORS = {
   "71": "Passed invalid pixel value %s to %s(), please pass a value like \"12px\" or 12.\n\n",
   "72": "Passed invalid base value %s to %s(), please pass a value like \"12px\" or 12.\n\n",
   "73": "Please provide a valid CSS variable.\n\n",
-  "74": "CSS variable not found and no default was provided.\n\n",
-  "75": "important requires a valid style object, got a %s instead.\n\n",
-  "76": "fromSize and toSize must be provided as stringified numbers with the same units as minScreen and maxScreen.\n"
+  "74": "CSS variable not found.\n"
 };
 /**
  * super basic version of sprintf
@@ -37697,7 +37695,9 @@ var PaymentDetailsContent = function PaymentDetailsContent(_ref) {
       subtotal = _ref.subtotal,
       total = _ref.total,
       themeValues = _ref.themeValues;
-  return /*#__PURE__*/React__default.createElement(Stack, null, lineItemElems, /*#__PURE__*/React__default.createElement(SolidDivider$1, null), /*#__PURE__*/React__default.createElement(Box, {
+  return /*#__PURE__*/React__default.createElement(Stack, {
+    childGap: "16px"
+  }, lineItemElems, /*#__PURE__*/React__default.createElement(SolidDivider$1, null), /*#__PURE__*/React__default.createElement(Box, {
     padding: "0.5rem 0"
   }, /*#__PURE__*/React__default.createElement(LabeledAmount$1, {
     variant: themeValues.labeledAmountSubtotal,
@@ -37800,13 +37800,19 @@ var PaymentDetails = function PaymentDetails(_ref4) {
     return /*#__PURE__*/React__default.createElement(React.Fragment, {
       key: fee.label
     }, /*#__PURE__*/React__default.createElement(Box, {
-      padding: "0.25rem 0"
+      padding: "4px 0"
     }), /*#__PURE__*/React__default.createElement(LabeledAmount$1, _extends({
       key: fee.label,
       variant: themeValues.labeledAmountSubtotal
     }, fee)));
   });
-  var content = isCollapsible ? /*#__PURE__*/React__default.createElement(Stack, null, /*#__PURE__*/React__default.createElement(SolidDivider$1, null), /*#__PURE__*/React__default.createElement(PaymentDetailsContent, {
+  var content = isCollapsible ? /*#__PURE__*/React__default.createElement(Stack, {
+    childGap: "0"
+  }, /*#__PURE__*/React__default.createElement(Box, {
+    padding: "4.5px"
+  }), /*#__PURE__*/React__default.createElement(SolidDivider$1, null), /*#__PURE__*/React__default.createElement(Box, {
+    padding: "8px"
+  }), /*#__PURE__*/React__default.createElement(PaymentDetailsContent, {
     lineItemElems: lineItemElems,
     feeElems: feeElems,
     subtotal: subtotal,
@@ -37829,7 +37835,11 @@ var PaymentDetails = function PaymentDetails(_ref4) {
     variant: "h5",
     weight: "700",
     as: "h1"
-  }, titleText), displayCurrency(total))) : /*#__PURE__*/React__default.createElement(Heading$1, {
+  }, titleText), /*#__PURE__*/React__default.createElement(Heading$1, {
+    variant: "h5",
+    weight: "700",
+    as: "h1"
+  }, displayCurrency(total)))) : /*#__PURE__*/React__default.createElement(Heading$1, {
     as: "h1",
     variant: "h3",
     weight: "700",
@@ -39355,7 +39365,7 @@ var SidebarSingleContent = function SidebarSingleContent(_ref) {
   }, /*#__PURE__*/React__default.createElement(Sidebar, {
     width: sidebarTargetWidth,
     childGap: sidebarContentGap,
-    onRight: sidebarOnRight,
+    sidebarOnRight: sidebarOnRight,
     contentMinWidth: mainContentMinWidth
   }, sidebarOnRight ? /*#__PURE__*/React__default.createElement(React.Fragment, null) : sidebarContent, mainContent, sidebarOnRight ? sidebarContent : /*#__PURE__*/React__default.createElement(React.Fragment, null))))), footer ? footer : /*#__PURE__*/React__default.createElement(Box, {
     padding: "0"
@@ -39417,7 +39427,7 @@ var SidebarStackContent = function SidebarStackContent(_ref) {
   }, /*#__PURE__*/React__default.createElement(Sidebar, {
     width: sidebarTargetWidth,
     childGap: sidebarContentGap,
-    onRight: sidebarOnRight,
+    sidebarOnRight: sidebarOnRight,
     contentMinWidth: mainContentMinWidth,
     key: "content-sidebar"
   }, sidebarOnRight ? /*#__PURE__*/React__default.createElement(React.Fragment, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thecb/components",
-  "version": "4.0.14",
+  "version": "4.0.15-beta.0",
   "description": "Common lib for CityBase react components",
   "main": "dist/index.cjs.js",
   "module": "dist/index.esm.js",

package/src/components/atoms/layouts/examples/sidebar-example/SidebarExample.js

@@ -3,7 +3,7 @@ import React from "react";
 import Sidebar from "../../Sidebar";
 
 const SidebarExample = ({ width, onRight, childGap, children }) => (
-  <Sidebar width={width} onRight={onRight} childGap={childGap}>
+  <Sidebar width={width} sidebarOnRight={onRight} childGap={childGap}>
     {children}
   </Sidebar>
 );

package/src/components/molecules/payment-details/PaymentDetails.js

@@ -18,7 +18,7 @@ const PaymentDetailsContent = ({
   total,
   themeValues
 }) => (
-  <Stack>
+  <Stack childGap="16px">
     {lineItemElems}
     <SolidDivider />
     <Box padding="0.5rem 0">
@@ -99,7 +99,7 @@ const PaymentDetails = ({
   ));
   const feeElems = fees.map(fee => (
     <Fragment key={fee.label}>
-      <Box padding="0.25rem 0" />
+      <Box padding="4px 0" />
       <LabeledAmount
         key={fee.label}
         variant={themeValues.labeledAmountSubtotal}
@@ -108,8 +108,10 @@ const PaymentDetails = ({
     </Fragment>
   ));
   const content = isCollapsible ? (
-    <Stack>
+    <Stack childGap="0">
+      <Box padding="4.5px" />
       <SolidDivider />
+      <Box padding="8px" />
       <PaymentDetailsContent
         {...{ lineItemElems, feeElems, subtotal, total, themeValues }}
       />
@@ -127,7 +129,9 @@ const PaymentDetails = ({
         <Heading variant="h5" weight="700" as="h1">
           {titleText}
         </Heading>
-        {displayCurrency(total)}
+        <Heading variant="h5" weight="700" as="h1">
+          {displayCurrency(total)}
+        </Heading>
       </Cluster>
     </Box>
   ) : (

package/src/components/templates/sidebar-single-content/SidebarSingleContent.js

@@ -44,7 +44,7 @@ const SidebarSingleContent = ({
               <Sidebar
                 width={sidebarTargetWidth}
                 childGap={sidebarContentGap}
-                onRight={sidebarOnRight}
+                sidebarOnRight={sidebarOnRight}
                 contentMinWidth={mainContentMinWidth}
               >
                 {sidebarOnRight ? <Fragment /> : sidebarContent}

package/src/components/templates/sidebar-stack-content/SidebarStackContent.js

@@ -46,7 +46,7 @@ const SidebarStackContent = ({
               <Sidebar
                 width={sidebarTargetWidth}
                 childGap={sidebarContentGap}
-                onRight={sidebarOnRight}
+                sidebarOnRight={sidebarOnRight}
                 contentMinWidth={mainContentMinWidth}
                 key="content-sidebar"
               >

package/.tool-versions

@@ -1 +0,0 @@
-nodejs 10.15.3