optimized-react-component-library-xyz123 0.19.15 → 0.19.16

package/dist/index.mjs

@@ -4,9 +4,10 @@ var ValidationSummary = ({
   validationMessesege,
   validationId,
   activatedLanguage = "sv",
-  showValidationSummary = false
+  showValidationSummary = false,
+  extraCssClass = ""
 }) => {
-  return showValidationSummary && /* @__PURE__ */ jsxs("div", { className: "pts-root-error", id: validationId, children: [
+  return showValidationSummary && /* @__PURE__ */ jsxs("div", { className: `pts-root-error ${extraCssClass}`, id: validationId, children: [
     /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "errorDot", children: "!" }),
     /* @__PURE__ */ jsx("span", { className: "sr-only", children: activatedLanguage === "sv" ? "Valideringsfel" : "Validation error" }),
     /* @__PURE__ */ jsx("span", { className: "errorText", children: validationMessesege })
@@ -19,7 +20,8 @@ import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 var InputRadio = ({
   question,
   handleQuestionInputChange,
-  showPreview = false
+  showPreview = false,
+  activatedLanguage = "sv"
 }) => {
   var _a, _b, _c;
   const questionId = `question-${question.id}`;
@@ -64,7 +66,7 @@ var InputRadio = ({
               showValidationSummary: (_b = question.hasValidationError) != null ? _b : false,
               validationId: errorId,
               validationMessesege: (_c = question.validationDefaultMessesege) != null ? _c : "",
-              activatedLanguage: "sv"
+              activatedLanguage
             }
           )
         ]
@@ -177,7 +179,7 @@ var CheckboxGroup = ({
   showPreview = false,
   activatedLanguage = "sv"
 }) => {
-  var _a;
+  var _a, _b, _c;
   const questionId = `question-${question.id}`;
   const errorId = `error-${question.id}`;
   const groupId = `checkbox-group-${question.id}`;
@@ -229,11 +231,15 @@ var CheckboxGroup = ({
             ),
             /* @__PURE__ */ jsx4("label", { htmlFor: `${groupId}-option-${index}`, children: option.label })
           ] }, index)),
-          question.hasValidationError && /* @__PURE__ */ jsxs4("div", { className: "pts-root-error", id: errorId, children: [
-            /* @__PURE__ */ jsx4("span", { "aria-hidden": true, className: "errorDot", children: "!" }),
-            /* @__PURE__ */ jsx4("span", { className: "sr-only", children: "Valideringsfel" }),
-            /* @__PURE__ */ jsx4("span", { className: "errorText", children: question.validationDefaultMessesege })
-          ] })
+          /* @__PURE__ */ jsx4(
+            ValidationMessage_default,
+            {
+              showValidationSummary: (_b = question.hasValidationError) != null ? _b : false,
+              validationId: errorId,
+              validationMessesege: (_c = question.validationDefaultMessesege) != null ? _c : "",
+              activatedLanguage
+            }
+          )
         ]
       }
     ) }),
@@ -266,7 +272,7 @@ var InputTextarea = ({
   showPreview = false,
   activatedLanguage
 }) => {
-  var _a, _b, _c, _d, _e;
+  var _a, _b, _c, _d, _e, _f, _g;
   const questionId = `question-${question.id}`;
   const inputId = `textarea-${question.id}`;
   const aboutId = `about-${question.id}`;
@@ -309,19 +315,24 @@ var InputTextarea = ({
             }
           ),
           /* @__PURE__ */ jsxs5("div", { className: "pts-textarea-counter-error-container", children: [
-            question.hasValidationError && /* @__PURE__ */ jsxs5("div", { className: "pts-root-error", id: errorId, children: [
-              /* @__PURE__ */ jsx5("span", { "aria-label": "Felmeddelande.", className: "errorDot", children: "!" }),
-              /* @__PURE__ */ jsx5("span", { className: "errorText", children: question.validationDefaultMessesege })
-            ] }),
-            !((_b = question.questionExtraAttribute) == null ? void 0 : _b.hideTextCounter) && /* @__PURE__ */ jsxs5(
+            /* @__PURE__ */ jsx5(
+              ValidationMessage_default,
+              {
+                showValidationSummary: (_b = question.hasValidationError) != null ? _b : false,
+                validationId: errorId,
+                validationMessesege: (_c = question.validationDefaultMessesege) != null ? _c : "",
+                activatedLanguage: activatedLanguage != null ? activatedLanguage : "sv"
+              }
+            ),
+            !((_d = question.questionExtraAttribute) == null ? void 0 : _d.hideTextCounter) && /* @__PURE__ */ jsxs5(
               "div",
               {
-                className: `pts-character-counter ${question.answer && (((_c = question.questionExtraAttribute) == null ? void 0 : _c.answerMaxLength) || defaultMaxLength) && question.answer.length > (((_d = question.questionExtraAttribute) == null ? void 0 : _d.answerMaxLength) || defaultMaxLength) ? "error" : ""}`,
+                className: `pts-character-counter ${question.answer && (((_e = question.questionExtraAttribute) == null ? void 0 : _e.answerMaxLength) || defaultMaxLength) && question.answer.length > (((_f = question.questionExtraAttribute) == null ? void 0 : _f.answerMaxLength) || defaultMaxLength) ? "error" : ""}`,
                 children: [
                   question.answer ? question.answer.length : 0,
                   " av",
                   " ",
-                  ((_e = question.questionExtraAttribute) == null ? void 0 : _e.answerMaxLength) || defaultMaxLength,
+                  ((_g = question.questionExtraAttribute) == null ? void 0 : _g.answerMaxLength) || defaultMaxLength,
                   " tecken"
                 ]
               }
@@ -362,7 +373,7 @@ var TextFieldStandard = ({
   showPreview = false,
   activatedLanguage
 }) => {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o;
   const questionId = `question-${question.id}`;
   const inputId = `textField-${question.id}`;
   const aboutId = `about-${question.id}`;
@@ -412,6 +423,15 @@ var TextFieldStandard = ({
               autoCapitalize: (_m = (_l = question.questionExtraAttribute) == null ? void 0 : _l.autoCapitalize) != null ? _m : void 0
             }
           ),
+          /* @__PURE__ */ jsx6(
+            ValidationMessage_default,
+            {
+              showValidationSummary: (_n = question.hasValidationError) != null ? _n : false,
+              validationId: errorId,
+              validationMessesege: (_o = question.validationDefaultMessesege) != null ? _o : "",
+              activatedLanguage: activatedLanguage != null ? activatedLanguage : "sv"
+            }
+          ),
           question.hasValidationError && /* @__PURE__ */ jsxs6("div", { className: "pts-root-error", id: errorId, children: [
             /* @__PURE__ */ jsx6("span", { "aria-hidden": true, className: "errorDot", children: "!" }),
             /* @__PURE__ */ jsx6("span", { className: "sr-only", children: "Valideringsfel" }),
@@ -795,6 +815,7 @@ var AddFiles = ({
   allowedTotalFileSize = 20971520
   // 20MB = (1024 * 1024) * 20
 }) => {
+  var _a, _b;
   if (allowedFileTypes.length < 1) {
     allowedFileTypes = [
       "pdf",
@@ -838,7 +859,7 @@ var AddFiles = ({
   }, []);
   const onDrop = useCallback(
     (acceptedFiles) => {
-      var _a, _b, _c;
+      var _a2, _b2, _c;
       const validationErrors = [];
       const validFiles = [];
       const currentTotalFileSize = (questionObject.files || []).reduce(
@@ -846,7 +867,7 @@ var AddFiles = ({
         0
       );
       setTotalFileSize(currentTotalFileSize);
-      if ((((_a = questionObject.files) == null ? void 0 : _a.length) || 0) >= allowedNumberOfFiles) {
+      if ((((_a2 = questionObject.files) == null ? void 0 : _a2.length) || 0) >= allowedNumberOfFiles) {
         acceptedFiles.forEach((file) => {
           validationErrors.push({
             FileName: file.name,
@@ -859,7 +880,7 @@ var AddFiles = ({
       }
       let accumulatedNewSize = 0;
       for (const file of acceptedFiles) {
-        const fileExtension = ((_b = file.name.split(".").pop()) == null ? void 0 : _b.toLowerCase()) || "";
+        const fileExtension = ((_b2 = file.name.split(".").pop()) == null ? void 0 : _b2.toLowerCase()) || "";
         if (!allowedFileTypes.includes(fileExtension)) {
           validationErrors.push({
             FileName: file.name,
@@ -972,6 +993,16 @@ var AddFiles = ({
           ]
         }
       ),
+      /* @__PURE__ */ jsx12(
+        ValidationMessage_default,
+        {
+          showValidationSummary: (_a = questionObject.hasValidationError) != null ? _a : false,
+          validationId: errorId,
+          validationMessesege: (_b = questionObject.validationDefaultMessesege) != null ? _b : "",
+          activatedLanguage,
+          extraCssClass: "error addfileserror"
+        }
+      ),
       questionObject.hasValidationError && /* @__PURE__ */ jsxs10("div", { className: "pts-root-error error addfileserror", id: errorId, children: [
         /* @__PURE__ */ jsx12("span", { "aria-hidden": true, className: "errorDot", children: "!" }),
         /* @__PURE__ */ jsx12("span", { className: "sr-only", children: "Valideringsfel" }),
@@ -1042,7 +1073,7 @@ var SingleCheckbox = ({
   showPreview = false,
   activatedLanguage = "sv"
 }) => {
-  var _a, _b;
+  var _a, _b, _c, _d;
   const questionId = `question-${question.id}`;
   const inputId = `checkbox-${question.id}`;
   const aboutId = `about-${question.id}`;
@@ -1095,12 +1126,15 @@ var SingleCheckbox = ({
         }
       ),
       " ",
-      question.hasValidationError && /* @__PURE__ */ jsxs11("div", { className: "pts-root-error", id: errorId, children: [
-        /* @__PURE__ */ jsx13("span", { "aria-hidden": true, className: "errorDot", children: "!" }),
-        /* @__PURE__ */ jsx13("span", { className: "sr-only", children: "Valideringsfel" }),
-        /* @__PURE__ */ jsx13("span", { className: "errorText", children: question.validationDefaultMessesege })
-      ] }),
-      " "
+      /* @__PURE__ */ jsx13(
+        ValidationMessage_default,
+        {
+          showValidationSummary: (_c = question.hasValidationError) != null ? _c : false,
+          validationId: errorId,
+          validationMessesege: (_d = question.validationDefaultMessesege) != null ? _d : "",
+          activatedLanguage
+        }
+      )
     ] }),
     " ",
     showPreview && /* @__PURE__ */ jsx13(PreviewSingleCheckbox, { activatedLanguage, question })
@@ -1921,11 +1955,12 @@ var QuestionGroup = ({
   showPreview = false,
   markQuestionAsDisplayed
 }) => {
-  var _a;
+  var _a, _b, _c;
   if (!questions || questions.length === 0) {
     return null;
   }
   const firstQuestion = questions[0];
+  const errorId = firstQuestion.id + "-error";
   const groupMandatory = (_a = firstQuestion.validationType) == null ? void 0 : _a.find((e) => e.startsWith("groupCheck-"));
   useEffect11(() => {
     questions.forEach((question) => {
@@ -1966,10 +2001,15 @@ var QuestionGroup = ({
                 firstQuestion.validationDefaultMessesege
               ] })
             ] }),
-            firstQuestion.hasValidationError && /* @__PURE__ */ jsxs13("div", { className: "pts-root-error", id: firstQuestion.id + "-error", children: [
-              /* @__PURE__ */ jsx15("span", { "aria-label": "Valideringsfel", className: "errorDot", children: "!" }),
-              /* @__PURE__ */ jsx15("span", { className: "errorText", children: firstQuestion.validationDefaultMessesege })
-            ] }),
+            /* @__PURE__ */ jsx15(
+              ValidationMessage_default,
+              {
+                showValidationSummary: (_b = firstQuestion.hasValidationError) != null ? _b : false,
+                validationId: errorId,
+                validationMessesege: (_c = firstQuestion.validationDefaultMessesege) != null ? _c : "",
+                activatedLanguage: activatedLanguage != null ? activatedLanguage : "sv"
+              }
+            ),
             groupQuestions
           ]
         }