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

package/dist/index.d.mts

@@ -118,6 +118,7 @@ interface RadioProps {
     question: IQuestion;
     handleQuestionInputChange: any;
     showPreview?: boolean;
+    activatedLanguage?: string;
 }
 
 declare const InputRadio: FC<RadioProps>;

package/dist/index.d.ts

@@ -118,6 +118,7 @@ interface RadioProps {
     question: IQuestion;
     handleQuestionInputChange: any;
     showPreview?: boolean;
+    activatedLanguage?: string;
 }
 
 declare const InputRadio: FC<RadioProps>;

package/dist/index.js

@@ -86,9 +86,10 @@ var ValidationSummary = ({
   validationMessesege,
   validationId,
   activatedLanguage = "sv",
-  showValidationSummary = false
+  showValidationSummary = false,
+  extraCssClass = ""
 }) => {
-  return showValidationSummary && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pts-root-error", id: validationId, children: [
+  return showValidationSummary && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: `pts-root-error ${extraCssClass}`, id: validationId, children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { "aria-hidden": true, className: "errorDot", children: "!" }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "sr-only", children: activatedLanguage === "sv" ? "Valideringsfel" : "Validation error" }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "errorText", children: validationMessesege })
@@ -101,7 +102,8 @@ var import_jsx_runtime2 = require("react/jsx-runtime");
 var InputRadio = ({
   question,
   handleQuestionInputChange,
-  showPreview = false
+  showPreview = false,
+  activatedLanguage = "sv"
 }) => {
   var _a, _b, _c;
   const questionId = `question-${question.id}`;
@@ -111,7 +113,6 @@ var InputRadio = ({
     const e = { target: { value: event.target.value } };
     handleQuestionInputChange(e, question);
   };
-  console.log("question", question);
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
     !showPreview && question.visible && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "pts-root-question pts-radioMultiple-container", id: questionId, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
       "fieldset",
@@ -146,7 +147,7 @@ var InputRadio = ({
               showValidationSummary: (_b = question.hasValidationError) != null ? _b : false,
               validationId: errorId,
               validationMessesege: (_c = question.validationDefaultMessesege) != null ? _c : "",
-              activatedLanguage: "sv"
+              activatedLanguage
             }
           )
         ]
@@ -259,7 +260,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}`;
@@ -311,11 +312,15 @@ var CheckboxGroup = ({
             ),
             /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("label", { htmlFor: `${groupId}-option-${index}`, children: option.label })
           ] }, index)),
-          question.hasValidationError && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "pts-root-error", id: errorId, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { "aria-hidden": true, className: "errorDot", children: "!" }),
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "sr-only", children: "Valideringsfel" }),
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "errorText", children: question.validationDefaultMessesege })
-          ] })
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+            ValidationMessage_default,
+            {
+              showValidationSummary: (_b = question.hasValidationError) != null ? _b : false,
+              validationId: errorId,
+              validationMessesege: (_c = question.validationDefaultMessesege) != null ? _c : "",
+              activatedLanguage
+            }
+          )
         ]
       }
     ) }),
@@ -348,7 +353,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}`;
@@ -391,19 +396,24 @@ var InputTextarea = ({
             }
           ),
           /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "pts-textarea-counter-error-container", children: [
-            question.hasValidationError && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "pts-root-error", id: errorId, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { "aria-label": "Felmeddelande.", className: "errorDot", children: "!" }),
-              /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "errorText", children: question.validationDefaultMessesege })
-            ] }),
-            !((_b = question.questionExtraAttribute) == null ? void 0 : _b.hideTextCounter) && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+              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__ */ (0, import_jsx_runtime5.jsxs)(
               "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"
                 ]
               }
@@ -444,7 +454,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}`;
@@ -494,11 +504,15 @@ var TextFieldStandard = ({
               autoCapitalize: (_m = (_l = question.questionExtraAttribute) == null ? void 0 : _l.autoCapitalize) != null ? _m : void 0
             }
           ),
-          question.hasValidationError && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "pts-root-error", id: errorId, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { "aria-hidden": true, className: "errorDot", children: "!" }),
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "sr-only", children: "Valideringsfel" }),
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "errorText", children: question.validationDefaultMessesege })
-          ] })
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+            ValidationMessage_default,
+            {
+              showValidationSummary: (_n = question.hasValidationError) != null ? _n : false,
+              validationId: errorId,
+              validationMessesege: (_o = question.validationDefaultMessesege) != null ? _o : "",
+              activatedLanguage: activatedLanguage != null ? activatedLanguage : "sv"
+            }
+          )
         ]
       }
     ),
@@ -877,6 +891,7 @@ var AddFiles = ({
   allowedTotalFileSize = 20971520
   // 20MB = (1024 * 1024) * 20
 }) => {
+  var _a, _b;
   if (allowedFileTypes.length < 1) {
     allowedFileTypes = [
       "pdf",
@@ -920,7 +935,7 @@ var AddFiles = ({
   }, []);
   const onDrop = (0, import_react7.useCallback)(
     (acceptedFiles) => {
-      var _a, _b, _c;
+      var _a2, _b2, _c;
       const validationErrors = [];
       const validFiles = [];
       const currentTotalFileSize = (questionObject.files || []).reduce(
@@ -928,7 +943,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,
@@ -941,7 +956,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,
@@ -1054,11 +1069,16 @@ var AddFiles = ({
           ]
         }
       ),
-      questionObject.hasValidationError && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "pts-root-error error addfileserror", id: errorId, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { "aria-hidden": true, className: "errorDot", children: "!" }),
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "sr-only", children: "Valideringsfel" }),
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "errorText", children: questionObject.validationDefaultMessesege })
-      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+        ValidationMessage_default,
+        {
+          showValidationSummary: (_a = questionObject.hasValidationError) != null ? _a : false,
+          validationId: errorId,
+          validationMessesege: (_b = questionObject.validationDefaultMessesege) != null ? _b : "",
+          activatedLanguage,
+          extraCssClass: "error addfileserror"
+        }
+      ),
       /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
         ExploreFilesStandard_default,
         {
@@ -1124,7 +1144,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}`;
@@ -1177,12 +1197,15 @@ var SingleCheckbox = ({
         }
       ),
       " ",
-      question.hasValidationError && /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "pts-root-error", id: errorId, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { "aria-hidden": true, className: "errorDot", children: "!" }),
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "sr-only", children: "Valideringsfel" }),
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "errorText", children: question.validationDefaultMessesege })
-      ] }),
-      " "
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+        ValidationMessage_default,
+        {
+          showValidationSummary: (_c = question.hasValidationError) != null ? _c : false,
+          validationId: errorId,
+          validationMessesege: (_d = question.validationDefaultMessesege) != null ? _d : "",
+          activatedLanguage
+        }
+      )
     ] }),
     " ",
     showPreview && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(PreviewSingleCheckbox, { activatedLanguage, question })
@@ -2000,11 +2023,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-"));
   (0, import_react12.useEffect)(() => {
     questions.forEach((question) => {
@@ -2045,10 +2069,15 @@ var QuestionGroup = ({
                 firstQuestion.validationDefaultMessesege
               ] })
             ] }),
-            firstQuestion.hasValidationError && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "pts-root-error", id: firstQuestion.id + "-error", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { "aria-label": "Valideringsfel", className: "errorDot", children: "!" }),
-              /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "errorText", children: firstQuestion.validationDefaultMessesege })
-            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+              ValidationMessage_default,
+              {
+                showValidationSummary: (_b = firstQuestion.hasValidationError) != null ? _b : false,
+                validationId: errorId,
+                validationMessesege: (_c = firstQuestion.validationDefaultMessesege) != null ? _c : "",
+                activatedLanguage: activatedLanguage != null ? activatedLanguage : "sv"
+              }
+            ),
             groupQuestions
           ]
         }