@thecb/components 5.6.1 → 5.6.4

package/package.json

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

package/src/components/atoms/index.js

@@ -5,7 +5,7 @@ export { default as BoxWithShadow } from "./box-with-shadow";
 export { default as Breadcrumb } from "./breadcrumb";
 export { default as ButtonWithAction } from "./button-with-action";
 export { default as ButtonWithLink } from "./button-with-link";
-export { default as cardRegistry } from "./card";
+export { default as cardRegistry } from "./welcome-card";
 export { default as Checkbox } from "./checkbox";
 export { default as CheckboxList } from "./checkbox-list";
 export { default as CountryDropdown } from "./country-dropdown";

package/src/components/atoms/layouts/Sidebar.js

@@ -29,7 +29,7 @@ const Sidebar = ({
     <SidebarInnerWrapper
       childGap={childGap}
       width={width}
-      sidebarOnRight={sidebarOnRight}
+      $sidebarOnRight={sidebarOnRight}
       contentMinWidth={contentMinWidth}
       fullHeight={fullHeight}
       minHeight={minHeight}

package/src/components/atoms/layouts/Sidebar.styled.js

@@ -26,8 +26,8 @@ export const SidebarInnerWrapper = styled(
     ${({ minHeight }) => (minHeight ? `margin-top: 0; margin-bottom: 0;` : ``)}
   }
 
-  ${({ sidebarOnRight, contentMinWidth, childGap }) =>
-    sidebarOnRight
+  ${({ $sidebarOnRight, contentMinWidth, childGap }) =>
+    $sidebarOnRight
       ? `> :first-child {
       flex-basis: 0;
       flex-grow: 999;

package/src/components/atoms/{card → welcome-card}/Card.js

@@ -105,7 +105,10 @@ const Card = ({
                 </Box>
               </Cover>
             </Box>
-            <Box padding="0.5rem 1rem 1rem">
+            <Box
+              padding="0.5rem 1rem 1rem"
+              extraStyles={`display: flex; justify-content: center;`}
+            >
               <ButtonWithAction
                 variant="smallPrimary"
                 text={buttonText}

package/src/components/molecules/payment-form-ach/PaymentFormACH.js

@@ -64,7 +64,7 @@ const PaymentFormACH = ({
     <FormContainer variant={variant} role="form" aria-label="ACH Payment">
       <FormInputColumn>
         <FormInput
-          labelTextWhenNoError="Name on bank account"
+          labelTextWhenNoError="Name on checking account"
           errorMessages={nameErrors}
           field={fields.name}
           fieldActions={actions.fields.name}
@@ -155,7 +155,7 @@ const PaymentFormACH = ({
         {showWalletCheckbox && (
           <Checkbox
             name="bank checkbox"
-            title="Save bank account to wallet"
+            title="Save checking account to wallet"
             checked={walletCheckboxMarked}
             onChange={saveToWallet}
           />

package/src/components/molecules/workflow-tile/WorkflowTile.js

@@ -50,6 +50,7 @@ const WorkflowTile = ({
           minWidth={"100%"}
           url={`/service/${slug}`}
           extraStyles={`width: 100%;`}
+          linkExtraStyles={`justify-content: center;`}
         />
       </Box>
     </Stack>