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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thecb/components",
-  "version": "9.3.4-beta.3",
+  "version": "9.3.4-beta.5",
   "description": "Common lib for CityBase react components",
   "main": "dist/index.cjs.js",
   "typings": "dist/index.d.ts",

package/src/components/molecules/radio-section/InnerRadioSection.theme.js

@@ -1,9 +1,9 @@
-import { WHITE, GHOST_GREY, ATHENS_GREY } from "../../../constants/colors";
+import { WHITE, GREY_CHATEAU, ATHENS_GREY } from "../../../constants/colors";
 
 const headingBackgroundColor = `${WHITE}`;
 const headingDisabledColor = `${ATHENS_GREY}`;
 const bodyBackgroundColor = "#eeeeee";
-const borderColor = `${GHOST_GREY}`;
+const borderColor = `${GREY_CHATEAU}`;
 const focusStyles = `outline: none;`;
 
 export const fallbackValues = {

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

@@ -4,6 +4,7 @@ import { fallbackValues } from "./RadioSection.theme";
 import SolidDivider from "../../atoms/solid-divider/SolidDivider";
 import { Box, Stack } from "../../atoms/layouts";
 import { createIdFromString, wrapIndex } from "../../../util/general";
+import { MANATEE_GREY } from "../../../constants/colors";
 import {
   ARROW_DOWN,
   ARROW_LEFT,
@@ -56,7 +57,6 @@ const RadioSection = ({
   ariaDescribedBy,
   isSectionRequired = false,
   groupedSections,
-  bottomBorderSize = "2px",
   ...rest
 }) => {
   const [focused, setFocused] = useState(null);
@@ -154,10 +154,7 @@ const RadioSection = ({
                   {sectionGroup.indexOf(section) === sectionGroup.length - 1 &&
                     groupedSections.indexOf(sectionGroup) !==
                       groupedSections.length - 1 && (
-                      <SolidDivider
-                        borderSize={bottomBorderSize || "2px"}
-                        color={themeValues.borderColor}
-                      />
+                      <SolidDivider borderSize="2px" color={MANATEE_GREY} />
                     )}
                 </Fragment>
               ))

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

@@ -120,7 +120,6 @@ export const radioSection = () => {
         staggeredAnimation={boolean("staggeredAnimation", false, "props")}
         sections={sections}
         isSectionRequired={true}
-        borderBottomSize="10px"
       />
       <Box />
       <Box padding="0 1rem" extraStyles="text-align: center;">

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

@@ -1,9 +1,9 @@
-import { WHITE, GHOST_GREY, ATHENS_GREY } from "../../../constants/colors";
+import { WHITE, GREY_CHATEAU, ATHENS_GREY } from "../../../constants/colors";
 
 const headingBackgroundColor = `${WHITE}`;
 const headingDisabledColor = `${ATHENS_GREY}`;
 const bodyBackgroundColor = "#eeeeee";
-const borderColor = `${GHOST_GREY}`;
+const borderColor = `${GREY_CHATEAU}`;
 const focusStyles = `outline: none;`;
 
 export const fallbackValues = {