@obosbbl/grunnmuren-react 1.8.0 → 1.9.0

package/dist/Radio/RadioContext.d.ts

@@ -6,4 +6,5 @@ export declare const RadioContext: import("react").Context<{
     onChange?(event: React.ChangeEvent<HTMLInputElement>): void;
     required?: boolean | undefined;
     value?: string | undefined;
+    error?: boolean | undefined;
 }>;

package/dist/Radio/RadioGroup.d.ts

@@ -4,6 +4,8 @@ export interface RadioGroupProps extends Omit<React.ComponentPropsWithoutRef<'di
     defaultValue?: string;
     /** Help text for the radio group. */
     description?: React.ReactNode;
+    /** Error message for the form control */
+    error?: string;
     /** The `name` attribute for the radio buttons. */
     name: string;
     /** The label for the radio group. */

package/dist/grunnmuren.es.js

@@ -1314,7 +1314,8 @@ const RadioContext = createContext({
   name: void 0,
   onChange: noop,
   required: false,
-  value: void 0
+  value: void 0,
+  error: false
 });
 const Radio = forwardRef((props, ref) => {
   const _a = props, {
@@ -1330,12 +1331,13 @@ const Radio = forwardRef((props, ref) => {
     name,
     onChange,
     required,
-    value
+    value,
+    error
   } = useContext(RadioContext);
   return /* @__PURE__ */ jsxs("label", {
     className: cx(className, "flex cursor-pointer gap-2.5"),
     children: [/* @__PURE__ */ jsx("input", __spreadValues({
-      className: "radio",
+      className: cx("radio", error && "border-red"),
       defaultChecked: !isControlled ? rest.value === defaultValue : void 0,
       checked: isControlled ? rest.value === value : void 0,
       name,
@@ -1352,6 +1354,8 @@ const RadioGroup = forwardRef((props, ref) => {
     className,
     defaultValue,
     description,
+    error,
+    id: idProp,
     children,
     label,
     name,
@@ -1362,6 +1366,8 @@ const RadioGroup = forwardRef((props, ref) => {
     "className",
     "defaultValue",
     "description",
+    "error",
+    "id",
     "children",
     "label",
     "name",
@@ -1379,15 +1385,22 @@ const RadioGroup = forwardRef((props, ref) => {
     name,
     onChange,
     required,
-    value
-  }), [defaultValue, isControlled, name, onChange, required, value]);
-  const groupId = useId();
+    value,
+    error: Boolean(error)
+  }), [defaultValue, isControlled, name, onChange, required, value, error]);
+  const groupId = useFallbackId(idProp);
   const labelId = `${groupId}:label`;
-  const helpId = `${groupId}:help`;
+  const helpTextId = `${groupId}:help`;
+  const errorMsgId = groupId + "err";
+  const errorMsg = error;
   return /* @__PURE__ */ jsx(RadioContext.Provider, {
     value: group,
     children: /* @__PURE__ */ jsxs("div", __spreadProps(__spreadValues({
-      "aria-describedby": description ? helpId : void 0,
+      "aria-describedby": cx({
+        [errorMsgId]: errorMsg,
+        [helpTextId]: description
+      }) || void 0,
+      "aria-invalid": !!error,
       "aria-labelledby": label ? labelId : void 0,
       className: cx(className, "flex flex-col gap-4"),
       role: "radiogroup",
@@ -1396,10 +1409,14 @@ const RadioGroup = forwardRef((props, ref) => {
       children: [label && /* @__PURE__ */ jsx(FormLabel, {
         id: labelId,
         isRequired: required,
+        isInvalid: !!error,
         children: label
-      }), children, /* @__PURE__ */ jsx(FormHelperText, {
-        id: helpId,
+      }), description && /* @__PURE__ */ jsx(FormHelperText, {
+        id: helpTextId,
         children: description
+      }), children, errorMsg && /* @__PURE__ */ jsx(FormErrorMessage, {
+        id: errorMsgId,
+        children: errorMsg
       })]
     }))
   });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@obosbbl/grunnmuren-react",
-  "version": "1.8.0",
+  "version": "1.9.0",
   "description": "OBOS Grunnmuren design system React components",
   "license": "MIT",
   "repository": {
@@ -17,23 +17,23 @@
   ],
   "types": "./dist/index.d.ts",
   "devDependencies": {
-    "@babel/core": "7.20.5",
-    "@storybook/addon-controls": "6.5.14",
-    "@storybook/addon-docs": "6.5.14",
+    "@babel/core": "7.20.7",
+    "@storybook/addon-controls": "6.5.15",
+    "@storybook/addon-docs": "6.5.15",
     "@storybook/addon-postcss": "2.0.0",
-    "@storybook/builder-webpack5": "6.5.14",
-    "@storybook/manager-webpack5": "6.5.14",
-    "@storybook/react": "6.5.14",
+    "@storybook/builder-webpack5": "6.5.15",
+    "@storybook/manager-webpack5": "6.5.15",
+    "@storybook/react": "6.5.15",
     "@types/react": "18.0.26",
-    "@types/react-dom": "18.0.9",
+    "@types/react-dom": "18.0.10",
     "@vitejs/plugin-react": "1.3.2",
-    "postcss": "8.4.19",
+    "postcss": "8.4.20",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "require-from-string": "2.0.2",
     "rimraf": "3.0.2",
     "tailwindcss": "3.2.4",
-    "type-fest": "3.3.0",
+    "type-fest": "3.5.0",
     "vite": "2.9.15",
     "webpack": "5.75.0",
     "@obosbbl/grunnmuren-tailwind": "0.8.4"