@sebgroup/green-react 3.5.2 → 3.5.3

package/index.esm.js

@@ -4027,8 +4027,8 @@ const Input = _a => {
   const showSimpleInput = !label && !info && !expandableInfo;
   const describedBy = classNames(ariaDescribedBy, {
     [`${uuid}_group-message`]: !showSimpleInput && (validator === null || validator === void 0 ? void 0 : validator.message) !== undefined && validator.message.length > 0,
-    [`gds-expandable-info-${uuid}`]: !showSimpleInput && expandableInfo,
-    [`${uuid}_info`]: !showSimpleInput && info
+    [`${uuid}_info`]: !showSimpleInput && info,
+    [`gds-expandable-info-${uuid}`]: !showSimpleInput && expandableInfo
   });
   const inputClassName = classNames(className, {
     [validateClassName(validator === null || validator === void 0 ? void 0 : validator.indicator)]: validator
@@ -4178,6 +4178,7 @@ const RadioGroup = ({
   const [selected, setSelected] = useState(valueSelected !== null && valueSelected !== void 0 ? valueSelected : defaultSelected);
   const [prevValueSelected, setPrevValueSelected] = useState(valueSelected);
   const [name] = useState(propName);
+  const [uniqueId] = useState(randomId());
   if (valueSelected !== prevValueSelected) {
     setSelected(valueSelected);
     setPrevValueSelected(valueSelected);
@@ -4218,12 +4219,20 @@ const RadioGroup = ({
   const radioGroupWrapperClassNames = classNames('gds-radio-group-wrapper', {
     'gds-radio-group-wrapper--horizontal': horizontal
   });
+  const describedBy = classNames({
+    [`${uniqueId}_message`]: (validator === null || validator === void 0 ? void 0 : validator.message) !== undefined && validator.message.length > 0,
+    [`${uniqueId}_info`]: labelInformation,
+    [`gds-expandable-info-${uniqueId}`]: expandableInfo
+  });
   return jsx(FormItem, Object.assign({}, formItemProps, {
+    inputId: uniqueId
+  }, {
     children: jsx("div", Object.assign({
       className: radioGroupWrapperClassNames
     }, {
       children: React.Children.map(children, radioButton => {
         return /*#__PURE__*/React.isValidElement(radioButton) ? /*#__PURE__*/React.cloneElement(radioButton, {
+          "aria-describedby": describedBy,
           validator: validator,
           onChange: handleOnChange,
           checked: selected === radioButton.props.value,
@@ -4653,9 +4662,9 @@ const Select = /*#__PURE__*/React.forwardRef((_a, ref) => {
     [`${validateClassName(validator === null || validator === void 0 ? void 0 : validator.indicator)}`]: validator
   });
   const describedBy = classNames(ariaDescribedBy, {
-    [`${uuid}_info`]: info,
-    [`gds-expandable-info-${uuid}`]: expandableInfo,
-    [`${uuid}_message`]: (validator === null || validator === void 0 ? void 0 : validator.message) !== undefined && validator.message.length > 0
+    [`${uuid}_message`]: (validator === null || validator === void 0 ? void 0 : validator.message) !== undefined && validator.message.length > 0,
+    [`${uuid}_info`]: info || props.labelInformation,
+    [`gds-expandable-info-${uuid}`]: expandableInfo
   });
   return jsx(FormItem, Object.assign({
     label: label,

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@sebgroup/green-react",
-  "version": "3.5.2",
+  "version": "3.5.3",
   "peerDependencies": {
     "react": "^17 || ^18",
     "react-dom": "^17 || ^18"
   },
   "dependencies": {
     "@sebgroup/green-core": "^1.11.0",
-    "@sebgroup/chlorophyll": "^3.1.1",
+    "@sebgroup/chlorophyll": "^3.3.1",
     "@sebgroup/extract": "^3.0.1",
     "@lit/react": "^1.0.2",
     "classnames": "^2.3.2"