@thecb/components 9.5.0-beta.5 → 9.5.0-beta.6

package/dist/index.esm.js

@@ -48758,7 +48758,7 @@ var RadioGroup = function RadioGroup(_ref) {
 var headingBackgroundColor$1 = "".concat(WHITE);
 var headingDisabledColor = "".concat(ATHENS_GREY);
 var bodyBackgroundColor$1 = "#eeeeee";
-var borderColor$6 = "".concat(GREY_CHATEAU);
+var borderColor$6 = "".concat(GHOST_GREY);
 var focusStyles = "outline: none;";
 var fallbackValues$Q = {
   headingBackgroundColor: headingBackgroundColor$1,
@@ -48768,19 +48768,6 @@ var fallbackValues$Q = {
   focusStyles: focusStyles
 };
 
-var headingBackgroundColor$2 = "".concat(WHITE);
-var headingDisabledColor$1 = "".concat(ATHENS_GREY);
-var bodyBackgroundColor$2 = "#eeeeee";
-var borderColor$7 = "".concat(GREY_CHATEAU);
-var focusStyles$1 = "outline: none;";
-var fallbackValues$R = {
-  headingBackgroundColor: headingBackgroundColor$2,
-  headingDisabledColor: headingDisabledColor$1,
-  bodyBackgroundColor: bodyBackgroundColor$2,
-  borderColor: borderColor$7,
-  focusStyles: focusStyles$1
-};
-
 var idString = function idString(section) {
   return typeof section.title === "string" ? createIdFromString(section.title) : section.id;
 };
@@ -48804,6 +48791,7 @@ var InnerRadioSection = function InnerRadioSection(_ref) {
     setFocused = _ref.setFocused,
     sectionRefs = _ref.sectionRefs,
     ariaLabelledBy = _ref.ariaLabelledBy,
+    isLastGroupedItemInSection = _ref.isLastGroupedItemInSection,
     _ref$onKeyDown = _ref.onKeyDown,
     onKeyDown = _ref$onKeyDown === void 0 ? noop : _ref$onKeyDown;
   var wrapper = {
@@ -48827,7 +48815,7 @@ var InnerRadioSection = function InnerRadioSection(_ref) {
       }
     }
   };
-  var borderStyles = "\n    border-width: 0 0 1px 0;\n    border-color: ".concat(themeValues.borderColor, ";\n    border-style: solid;\n    border-radius: 0px;\n    transform-origin: 100% 0;\n\n    &:last-child {\n      border-width: 0;\n    }\n  ");
+  var borderStyles = "\n    border-width: 0 0 1px 0;\n    border-color: ".concat(isLastGroupedItemInSection ? MANATEE_GREY : themeValues.borderColor, ";\n    border-style: solid;\n    border-radius: 0px;\n    transform-origin: 100% 0;\n\n    &:last-child {\n      border-width: 0;\n    }\n  ");
   var RightIcon = styled.img.withConfig({
     displayName: "InnerRadioSection__RightIcon",
     componentId: "sc-1wtp6qc-0"
@@ -48878,7 +48866,7 @@ var InnerRadioSection = function InnerRadioSection(_ref) {
     key: "header-".concat(section.id),
     borderSize: "0px",
     borderColor: themeValues.borderColor,
-    borderWidthOverride: openSection === section.id && !!section.content ? "0px 0px 1px 0px" : "",
+    borderWidthOverride: openSection === section.id && !!section.content && section.id !== openSection ? "0px 0px 1px 0px" : "",
     extraStyles: !section.disabled ? "cursor: pointer;" : ""
   }, /*#__PURE__*/React.createElement(Cluster, {
     justify: "space-between",
@@ -48935,10 +48923,9 @@ var InnerRadioSection = function InnerRadioSection(_ref) {
     animate: "open",
     exit: "closed",
     variants: wrapper,
-    extraStyles: "transform-origin: 100% 0;"
+    extraStyles: "transform-origin: 100% 0; border-top: 1px solid ".concat(themeValues.borderColor)
   }, section.content))));
 };
-var InnerRadioSection$1 = themeComponent(InnerRadioSection, "InnerRadioSection", fallbackValues$R);
 
 var _excluded$z = ["themeValues", "isMobile", "supportsTouch", "sections", "openSection", "toggleOpenSection", "staggeredAnimation", "initiallyOpen", "openHeight", "containerStyles", "ariaDescribedBy", "isSectionRequired", "groupedSections"];
 
@@ -49032,7 +49019,8 @@ var RadioSection = function RadioSection(_ref) {
   }).map(function (section, i) {
     return /*#__PURE__*/React.createElement(Fragment$1, {
       key: "radio-section-".concat(sections.indexOf(section))
-    }, /*#__PURE__*/React.createElement(InnerRadioSection$1, {
+    }, /*#__PURE__*/React.createElement(InnerRadioSection, {
+      themeValues: themeValues,
       sectionIndex: i,
       section: section,
       sectionRefs: sectionRefs,
@@ -49045,7 +49033,8 @@ var RadioSection = function RadioSection(_ref) {
         return !section.disabled && handleKeyDown(section.id, e, i);
       },
       ariaLabelledBy: section.id,
-      ariaDescribedBy: "right-icons-".concat(idString$1(section))
+      ariaDescribedBy: "right-icons-".concat(idString$1(section)),
+      isLastGroupedItemInSection: false
     }));
   }), !!groupedSections && groupedSections.map(function (sectionGroup, sectionGroupIndex) {
     return sectionGroup.filter(function (unfilteredSection) {
@@ -49053,7 +49042,8 @@ var RadioSection = function RadioSection(_ref) {
     }).map(function (section, sectionIndex) {
       return /*#__PURE__*/React.createElement(Fragment$1, {
         key: "key-".concat(sectionGroupIndex, "-").concat(sectionIndex)
-      }, /*#__PURE__*/React.createElement(InnerRadioSection$1, {
+      }, /*#__PURE__*/React.createElement(InnerRadioSection, {
+        themeValues: themeValues,
         sectionIndex: "".concat(sectionGroupIndex, "-").concat(sectionIndex),
         section: section,
         sectionRefs: sectionRefs,
@@ -49063,10 +49053,11 @@ var RadioSection = function RadioSection(_ref) {
         ariaLabelledBy: section.id,
         ariaDescribedBy: "right-icons-".concat(idString$1(section)),
         openSection: openSection,
-        toggleOpenSection: toggleOpenSection
+        toggleOpenSection: toggleOpenSection,
+        isLastGroupedItemInSection: sectionGroup.indexOf(section) === sectionGroup.length - 1
       }), sectionGroup.indexOf(section) === sectionGroup.length - 1 && groupedSections.indexOf(sectionGroup) !== groupedSections.length - 1 && /*#__PURE__*/React.createElement(SolidDivider$1, {
-        borderSize: "2px",
-        color: themeValues.borderColor
+        borderSize: "1px",
+        borderColor: MANATEE_GREY
       }));
     });
   })));
@@ -49353,7 +49344,7 @@ var ResetPasswordSuccess = withWindowSize(ResetConfirmationForm$2);
 var activeTabBackground = "#FFFFFF";
 var activeTabAccent = "#15749D";
 var activeTabHover = "#B8D5E1";
-var fallbackValues$S = {
+var fallbackValues$R = {
   activeTabBackground: activeTabBackground,
   activeTabAccent: activeTabAccent,
   activeTabHover: activeTabHover
@@ -49421,12 +49412,12 @@ var Tabs = function Tabs(_ref) {
     }, tab.content);
   }))));
 };
-var Tabs$1 = themeComponent(Tabs, "NavigationTab", fallbackValues$S);
+var Tabs$1 = themeComponent(Tabs, "NavigationTab", fallbackValues$R);
 
 var activeTabBackground$1 = "#FFFFFF";
 var activeTabAccent$1 = "#15749D";
 var activeTabHover$1 = "#B8D5E1";
-var fallbackValues$T = {
+var fallbackValues$S = {
   activeTabBackground: activeTabBackground$1,
   activeTabAccent: activeTabAccent$1,
   activeTabHover: activeTabHover$1
@@ -49481,7 +49472,7 @@ var TabSidebar = function TabSidebar(_ref) {
     }, text)))));
   })));
 };
-var TabSidebar$1 = themeComponent(TabSidebar, "ProfileTab", fallbackValues$T);
+var TabSidebar$1 = themeComponent(TabSidebar, "ProfileTab", fallbackValues$S);
 
 var Timeout = function Timeout(_ref) {
   var onLogout = _ref.onLogout;
@@ -49566,7 +49557,7 @@ var fontColor$1 = WHITE;
 var textAlign$1 = "left";
 var headerBackgroundColor$1 = BRIGHT_GREY;
 var imageBackgroundColor$1 = MATISSE_BLUE;
-var fallbackValues$U = {
+var fallbackValues$T = {
   fontWeight: fontWeight$9,
   fontColor: fontColor$1,
   textAlign: textAlign$1,
@@ -49611,7 +49602,7 @@ var WelcomeModule = function WelcomeModule(_ref) {
     src: welcomeImage
   })))));
 };
-var WelcomeModule$1 = /*#__PURE__*/memo(themeComponent(WelcomeModule, "WelcomeModule", fallbackValues$U));
+var WelcomeModule$1 = /*#__PURE__*/memo(themeComponent(WelcomeModule, "WelcomeModule", fallbackValues$T));
 
 var WorkflowTile = function WorkflowTile(_ref) {
   var _ref$workflowName = _ref.workflowName,
@@ -49666,7 +49657,7 @@ var WorkflowTile = function WorkflowTile(_ref) {
 };
 
 var pageBackground = "#FBFCFD";
-var fallbackValues$V = {
+var fallbackValues$U = {
   pageBackground: pageBackground
 };
 
@@ -49714,7 +49705,7 @@ var CenterSingle = function CenterSingle(_ref) {
     padding: "0"
   })));
 };
-var CenterSingle$1 = withWindowSize(themeComponent(CenterSingle, "Global", fallbackValues$V));
+var CenterSingle$1 = withWindowSize(themeComponent(CenterSingle, "Global", fallbackValues$U));
 
 var CenterStack = function CenterStack(_ref) {
   var header = _ref.header,
@@ -49757,7 +49748,7 @@ var CenterStack = function CenterStack(_ref) {
     padding: "0"
   })));
 };
-var CenterStack$1 = withWindowSize(themeComponent(CenterStack, "Global", fallbackValues$V));
+var CenterStack$1 = withWindowSize(themeComponent(CenterStack, "Global", fallbackValues$U));
 
 var CenterSingle$2 = function CenterSingle(_ref) {
   var header = _ref.header,
@@ -49801,7 +49792,7 @@ var CenterSingle$2 = function CenterSingle(_ref) {
     padding: "0"
   })));
 };
-var DefaultPageTemplate = withWindowSize(themeComponent(CenterSingle$2, "Global", fallbackValues$V));
+var DefaultPageTemplate = withWindowSize(themeComponent(CenterSingle$2, "Global", fallbackValues$U));
 
 var SidebarSingleContent = function SidebarSingleContent(_ref) {
   var header = _ref.header,
@@ -49854,7 +49845,7 @@ var SidebarSingleContent = function SidebarSingleContent(_ref) {
     padding: "0"
   })));
 };
-var SidebarSingleContent$1 = withWindowSize(themeComponent(SidebarSingleContent, "Global", fallbackValues$V));
+var SidebarSingleContent$1 = withWindowSize(themeComponent(SidebarSingleContent, "Global", fallbackValues$U));
 
 var SidebarStackContent = function SidebarStackContent(_ref) {
   var header = _ref.header,
@@ -49924,7 +49915,7 @@ var SidebarStackContent = function SidebarStackContent(_ref) {
     key: "footer-box"
   })));
 };
-var SidebarStackContent$1 = withWindowSize(themeComponent(SidebarStackContent, "Global", fallbackValues$V));
+var SidebarStackContent$1 = withWindowSize(themeComponent(SidebarStackContent, "Global", fallbackValues$U));
 
 var useFocusInvalidInput = function useFocusInvalidInput(hasErrors) {
   var resetHasErrors = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : function () {};