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

package/dist/index.esm.js

@@ -27569,14 +27569,17 @@ var fallbackValues$x = {
 var SolidDivider = function SolidDivider(_ref) {
   var borderColor = _ref.borderColor,
       borderSize = _ref.borderSize,
-      themeValues = _ref.themeValues;
+      themeValues = _ref.themeValues,
+      _ref$extraStyles = _ref.extraStyles,
+      extraStyles = _ref$extraStyles === void 0 ? "" : _ref$extraStyles;
   return /*#__PURE__*/React.createElement(Box, {
     padding: "0",
     minWidth: "100%",
     minHeight: "1px",
     borderColor: borderColor || themeValues.borderColor,
     borderSize: borderSize || themeValues.borderSize,
-    borderWidthOverride: "0px 0px ".concat(borderSize || themeValues.borderSize, " 0px")
+    borderWidthOverride: "0px 0px ".concat(borderSize || themeValues.borderSize, " 0px"),
+    extraStyles: extraStyles
   });
 };
 
@@ -48682,7 +48685,6 @@ var RadioSection = function RadioSection(_ref) {
       _ref$isSectionRequire = _ref.isSectionRequired,
       isSectionRequired = _ref$isSectionRequire === void 0 ? false : _ref$isSectionRequire,
       _ref$legendText = _ref.legendText,
-      legendText = _ref$legendText === void 0 ? "" : _ref$legendText,
       _ref$sectionGroups = _ref.sectionGroups,
       sectionGroups = _ref$sectionGroups === void 0 ? null : _ref$sectionGroups;
 
@@ -48733,38 +48735,32 @@ var RadioSection = function RadioSection(_ref) {
       focused = _useState2[0],
       setFocused = _useState2[1];
 
+  var PrependedItem = function PrependedItem(_ref5) {
+    var themeValues = _ref5.themeValues;
+    return /*#__PURE__*/React.createElement(SolidDivider$1, {
+      borderSize: "2px",
+      borderRadius: "0 0 0 0",
+      color: themeValues.borderColor,
+      extraStyles: "margin-left: -1px; margin-right: -1px; width: cacl(100% + 2px);"
+    });
+  };
+
   return /*#__PURE__*/React.createElement(Box, {
     padding: "1px",
     border: "1px solid ".concat(themeValues.borderColor),
     borderRadius: "4px",
     extraStyles: containerStyles
   }, /*#__PURE__*/React.createElement(Stack, {
-    childGap: "0"
-  }, /*#__PURE__*/React.createElement("fieldset", {
-    role: "radiogroup",
+    childGap: "0",
     tabIndex: "0",
-    "aria-required": isSectionRequired,
-    style: {
-      padding: 0,
-      margin: 0,
-      border: 0
-    }
-  }, /*#__PURE__*/React.createElement(Box, {
-    as: "legend",
-    srOnly: true,
-    padding: "0",
-    margin: "0"
-  }, legendText), sectionGroups && sectionGroups.map(function (sectionGroup) {
-    var prependedItem = "";
-
-    if (sectionGroups.indexOf(sectionGroup) !== 0) {
-      prependedItem = /*#__PURE__*/React.createElement(SolidDivider$1, {
-        borderSize: "2px",
-        color: themeValues.borderColor
-      });
-    }
-
-    return /*#__PURE__*/React.createElement(React.Fragment, null, prependedItem, sectionGroup.filter(function (unfilteredSection) {
+    role: "radiogroup",
+    "aria-required": isSectionRequired
+  }, sectionGroups && sectionGroups.map(function (sectionGroup) {
+    return /*#__PURE__*/React.createElement(Fragment$1, {
+      key: "sectiongroup-".concat(sectionGroups.indexOf(sectionGroup))
+    }, sectionGroups.indexOf(sectionGroup) !== 0 ? /*#__PURE__*/React.createElement(PrependedItem, {
+      themeValues: themeValues
+    }) : "", sectionGroup.filter(function (unfilteredSection) {
       return !unfilteredSection.hidden;
     }).map(function (section) {
       return /*#__PURE__*/React.createElement(Motion, {
@@ -48878,7 +48874,11 @@ var RadioSection = function RadioSection(_ref) {
       animate: openSection === section.id ? "open" : "closed",
       initial: initiallyOpen ? "open" : "closed",
       key: "item-".concat(section.id),
-      extraStyles: borderStyles
+      extraStyles: borderStyles,
+      role: "radio",
+      "aria-checked": openSection === section.id,
+      "aria-disabled": section.disabled,
+      "aria-required": section === null || section === void 0 ? void 0 : section.required
     }, /*#__PURE__*/React.createElement(Stack, {
       childGap: "0"
     }, /*#__PURE__*/React.createElement(Box, {
@@ -48956,7 +48956,7 @@ var RadioSection = function RadioSection(_ref) {
       variants: wrapper,
       extraStyles: "transform-origin: 100% 0;"
     }, section.content))));
-  }))));
+  })));
 };
 
 var RadioSection$1 = themeComponent(RadioSection, "RadioSection", fallbackValues$Q);