@thecb/components 3.3.8-beta.0 → 3.3.10

package/src/components/molecules/obligation/icons/PropertyCommercialVehicleIcon.js

@@ -2,8 +2,8 @@ import React from "react";
 
 const PropertyCommercialVehicleIcon = () => (
   <svg
-    width="81px"
-    height="81px"
+    width="51px"
+    height="51px"
     viewBox="0 0 81 81"
     version="1.1"
     xmlns="http://www.w3.org/2000/svg"

package/src/components/molecules/obligation/icons/PropertyGarageIcon.js

@@ -2,8 +2,8 @@ import React from "react";
 
 const PropertyGarageIcon = () => (
   <svg
-    width="81px"
-    height="81px"
+    width="51px"
+    height="51px"
     viewBox="0 0 81 81"
     version="1.1"
     xmlns="http://www.w3.org/2000/svg"

package/src/components/molecules/obligation/icons/PropertyLandIcon.js

@@ -2,8 +2,8 @@ import React from "react";
 
 const PropertyLandIcon = () => (
   <svg
-    width="81px"
-    height="81px"
+    width="51px"
+    height="51px"
     viewBox="0 0 81 81"
     version="1.1"
     xmlns="http://www.w3.org/2000/svg"

package/src/components/molecules/obligation/icons/PropertyMotorcycleIcon.js

@@ -2,8 +2,8 @@ import React from "react";
 
 const PropertyMotorcycleIcon = () => (
   <svg
-    width="81px"
-    height="81px"
+    width="51px"
+    height="51px"
     viewBox="0 0 81 81"
     version="1.1"
     xmlns="http://www.w3.org/2000/svg"

package/src/components/molecules/obligation/icons/PropertyPersonalIcon.js

@@ -2,8 +2,8 @@ import React from "react";
 
 const PropertyPersonalIcon = () => (
   <svg
-    width="81px"
-    height="81px"
+    width="51px"
+    height="51px"
     viewBox="0 0 81 81"
     version="1.1"
     xmlns="http://www.w3.org/2000/svg"

package/src/components/molecules/obligation/icons/PropertyStorefrontIcon.js

@@ -2,8 +2,8 @@ import React from "react";
 
 const PropertyStorefrontIcon = () => (
   <svg
-    width="81px"
-    height="81px"
+    width="51px"
+    height="51px"
     viewBox="0 0 81 81"
     version="1.1"
     xmlns="http://www.w3.org/2000/svg"

package/src/components/molecules/partial-amount-form/PartialAmountForm.state.js

@@ -36,7 +36,8 @@ export const createPartialAmountFormState = (
       ...acc,
       [item.id]: {
         validators: validators,
-        constraints: [onlyNaturals()]
+        constraints: [onlyNaturals()],
+        defaultValue: String(item.amount)
       }
     };
   }, {});

package/src/components/molecules/radio-section/RadioSection.js

@@ -146,8 +146,9 @@ const RadioSection = ({
                     justify="space-between"
                     align="center"
                     childGap="0.5rem"
+                    nowrap
                   >
-                    <Cluster justify="flex-start" align="center">
+                    <Cluster justify="flex-start" align="center" nowrap>
                       {!section.hideRadioButton && (
                         <Box padding="0">
                           <RadioButton

package/src/components/templates/center-single/CenterSingle.js

@@ -20,11 +20,13 @@ const CenterSingle = ({
   const { isMobile } = themeContext;
 
   return (
-    <Box padding="0" minWidth="100%" background={themeValues.pageBackground}>
-      <Cover
-        minHeight="100vh"
-        centerOverride={isMobile && !centeredMobileContent}
-      >
+    <Box
+      padding="0"
+      minWidth="100%"
+      background={themeValues.pageBackground}
+      extraStyles="flex-grow: 1;"
+    >
+      <Cover centerOverride={isMobile && !centeredMobileContent}>
         {header ? header : <Box padding="0" />}
         <Box
           padding="0"

package/src/components/templates/center-stack/CenterStack.js

@@ -20,8 +20,13 @@ const CenterStack = ({
   const { isMobile } = themeContext;
 
   return (
-    <Box padding="0" minWidth="100%" background={themeValues.pageBackground}>
-      <Cover minHeight="100vh">
+    <Box
+      padding="0"
+      minWidth="100%"
+      background={themeValues.pageBackground}
+      extraStyles="flex-grow: 1;"
+    >
+      <Cover>
         {header ? header : <Box padding="0" />}
         <Box padding="0" minWidth="100%" role="main">
           {subHeader && !(isMobile && hideMobileSubHeader) ? (

package/src/components/templates/default-page-template/DefaultPageTemplate.js

@@ -19,8 +19,13 @@ const CenterSingle = ({
   const { isMobile } = themeContext;
 
   return (
-    <Box padding="0" minWidth="100%" background={themeValues.pageBackground}>
-      <Cover minHeight="100vh" childGap="0" fillCenter>
+    <Box
+      padding="0"
+      minWidth="100%"
+      background={themeValues.pageBackground}
+      extraStyles="flex-grow: 1;"
+    >
+      <Cover childGap="0" fillCenter>
         {header ? header : <Box padding="0" />}
         <Box
           padding="0"

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

@@ -25,8 +25,13 @@ const SidebarSingleContent = ({
   const { isMobile } = themeContext;
 
   return (
-    <Box padding="0" minWidth="100%" background={themeValues.pageBackground}>
-      <Cover minHeight="100vh" centerOverride={!sidebarVerticalCenter}>
+    <Box
+      padding="0"
+      minWidth="100%"
+      background={themeValues.pageBackground}
+      extraStyles="flex-grow: 1;"
+    >
+      <Cover centerOverride={!sidebarVerticalCenter}>
         {header ? header : <Box padding="0" />}
         <Box padding="0" minWidth="100%" role="main">
           {subHeader && !(isMobile && hideMobileSubHeader) ? (

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

@@ -31,12 +31,9 @@ const SidebarStackContent = ({
       minWidth="100%"
       background={themeValues.pageBackground}
       key="page-bg"
+      extraStyles="flex-grow: 1;"
     >
-      <Cover
-        minHeight="100vh"
-        centerOverride={!sidebarVerticalCenter}
-        key="page-cover"
-      >
+      <Cover centerOverride={!sidebarVerticalCenter} key="page-cover">
         {header ? header : <Box padding="0" key="header-box" />}
         <Box padding="0" minWidth="100%" key="content-box" role="main">
           {subHeader && !(isMobile && hideMobileSubHeader) ? (

package/src/deprecated/icons/IconQuit.js

@@ -15,16 +15,16 @@ export const IconQuit = ({
   >
     <defs>
       <path
-        id="a"
+        id="quit"
         d="M18.9999989 6.40999946L17.589999 4.9999997 11.9999993 10.5899995 6.40999946 4.9999997 4.9999997 6.40999946 10.5899995 11.9999993 4.9999997 17.589999 6.40999946 18.9999989 11.9999993 13.409999 17.589999 18.9999989 18.9999989 17.589999 13.409999 11.9999993z"
       ></path>
     </defs>
     <g fill="none" fillRule="evenodd" stroke="none" strokeWidth="1">
-      <mask id="b" fill="#fff">
-        <use xlinkHref="#a"></use>
+      <mask id="quitMask" fill="#fff">
+        <use xlinkHref="#quit"></use>
       </mask>
-      <use fill={fill} xlinkHref="#a"></use>
-      <g fill={fill} mask="url(#b)">
+      <use fill={fill} xlinkHref="#quit"></use>
+      <g fill={fill} mask="url(#quitMask)">
         <path d="M0 0H24V24H0z"></path>
       </g>
     </g>

package/src/deprecated/icons/index.js

@@ -1,4 +1,3 @@
-import { IconAdd } from "./IconAdd";
 import { IconWarn } from "./IconWarn";
 import { IconCheck } from "./IconCheck";
 import { IconCheckEmail } from "./IconCheckEmail";
@@ -24,7 +23,6 @@ const AlertIcons = {
 };
 
 export {
-  IconAdd,
   IconWarn,
   IconCheck,
   IconCheckEmail,

package/src/util/index.js

@@ -1,4 +1,5 @@
 import * as formats from "./formats";
 import * as general from "./general";
+import * as theme from "./themeUtils";
 
-export { formats, general };
+export { formats, general, theme };

package/src/deprecated/icons/IconAdd.js

@@ -1,44 +0,0 @@
-import React from "react";
-import { WHITE, CHARADE_GREY } from "../../constants/colors";
-
-export const IconAdd = ({ fill = CHARADE_GREY, iconID, isMobile }) => (
-  <svg
-    xmlns="http://www.w3.org/2000/svg"
-    xmlnsXlink="http://www.w3.org/1999/xlink"
-    width="18"
-    height="18"
-    viewBox={isMobile ? "0 -0.25 20 20" : "-0.5 -0.5 18 18"}
-    id={`icon-add-${iconID}`}
-  >
-    <defs>
-      <path
-        id="path-1"
-        d="M9.91666623 6.78508747L6.78508747 6.78508747 6.78508747 9.91666623 5.74122788 9.91666623 5.74122788 6.78508747 2.60964912 6.78508747 2.60964912 5.74122788 5.74122788 5.74122788 5.74122788 2.60964912 6.78508747 2.60964912 6.78508747 5.74122788 9.91666623 5.74122788z"
-      ></path>
-    </defs>
-    <g fill="none" fillRule="evenodd" stroke="none" strokeWidth="1">
-      <g transform="translate(-383 -15)">
-        <g transform="translate(384 16)">
-          <g>
-            <g transform="translate(1.94 1.858)">
-              <mask id="mask-2" fill={WHITE}>
-                <use xlinkHref="#path-1"></use>
-              </mask>
-              <use fill="#000" fillRule="evenodd" xlinkHref="#path-1"></use>
-              <g fill={fill} fillRule="evenodd" mask="url(#mask-2)">
-                <path d="M0 0H12.526V12.526H0z"></path>
-              </g>
-            </g>
-            <circle
-              cx="8.155"
-              cy="8.072"
-              r="8"
-              stroke={fill}
-              strokeWidth="0.644"
-            ></circle>
-          </g>
-        </g>
-      </g>
-    </g>
-  </svg>
-);