optimized-react-component-library-xyz123 3.0.0 → 3.0.2

package/dist/index.js

@@ -377,6 +377,7 @@ var PreviewCheckboxGroup = ({
 };
 
 // src/components/input-components/TextAreaStandard/TextAreaStandard.tsx
+var import_react3 = require("react");
 var import_dompurify = __toESM(require("dompurify"));
 var import_jsx_runtime5 = require("react/jsx-runtime");
 var InputTextarea = ({
@@ -390,12 +391,17 @@ var InputTextarea = ({
   const inputId = `textarea-${question.id}`;
   const aboutId = `about-${question.id}`;
   const errorId = `error-${question.id}`;
+  const [localAnswer, setLocalAnswer] = (0, import_react3.useState)(question.answer);
   const defaultMaxLength = 1e3;
   const answerLength = (_b = (_a = question.answer) == null ? void 0 : _a.length) != null ? _b : 0;
   const maxLength = (_d = (_c = question.questionExtraAttribute) == null ? void 0 : _c.answerMaxLength) != null ? _d : defaultMaxLength;
   const isTooLong = answerLength > maxLength;
   const counterText = activatedLanguage === "en" ? `${answerLength} of ${maxLength} characters` : `${answerLength} av ${maxLength} tecken`;
   const maxLengthErrorText = activatedLanguage === "en" ? `The text must be ${maxLength} characters or less` : `Texten f\xE5r inte vara l\xE4ngre \xE4n ${maxLength} tecken`;
+  const onChange = (e) => {
+    setLocalAnswer(e.target.value);
+    handleQuestionInputChange(e, question);
+  };
   return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
     !showPreview && question.visible && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
       "div",
@@ -422,8 +428,8 @@ var InputTextarea = ({
             "textarea",
             {
               className: question.hasValidationError ? "pts-root-question-input-error-border" : void 0,
-              onChange: (e) => handleQuestionInputChange(e, question),
-              value: question.answer,
+              onChange: (e) => onChange(e),
+              value: localAnswer,
               required: question.isQuestionMandatory,
               "aria-required": question.isQuestionMandatory,
               "aria-invalid": question.hasValidationError,
@@ -479,6 +485,7 @@ var PreviewTextarea = ({
 };
 
 // src/components/input-components/TextFieldStandard/TextFieldStandard.tsx
+var import_react4 = require("react");
 var import_dompurify2 = __toESM(require("dompurify"));
 var import_jsx_runtime6 = require("react/jsx-runtime");
 var TextFieldStandard = ({
@@ -492,10 +499,15 @@ var TextFieldStandard = ({
   const inputId = `textField-${question.id}`;
   const aboutId = `about-${question.id}`;
   const errorId = `error-${question.id}`;
+  const [localAnswer, setLocalAnswer] = (0, import_react4.useState)(question.answer);
   const answerLength = (_b = (_a = question.answer) == null ? void 0 : _a.length) != null ? _b : 0;
   const maxLength = 100;
   const isTooLong = answerLength > maxLength;
   const maxLengthErrorText = activatedLanguage === "en" ? `The text must be ${maxLength} characters or less` : `Texten f\xE5r inte vara l\xE4ngre \xE4n ${maxLength} tecken`;
+  const onChange = (e) => {
+    setLocalAnswer(e.target.value);
+    handleQuestionInputChange(e, question);
+  };
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
     !showPreview && question.visible && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
       "div",
@@ -526,8 +538,8 @@ var TextFieldStandard = ({
               inputMode: (_i = (_h = question.questionExtraAttribute) == null ? void 0 : _h.inputMode) != null ? _i : void 0,
               name: `question-name-${question.id}`,
               className: question.hasValidationError ? "pts-root-question-input-error-border" : void 0,
-              onChange: (e) => handleQuestionInputChange(e, question),
-              value: question.answer,
+              onChange: (e) => onChange(e),
+              value: localAnswer,
               id: inputId,
               disabled: (_j = question.questionExtraAttribute) == null ? void 0 : _j.disabled,
               required: question.isQuestionMandatory,
@@ -583,7 +595,7 @@ var PreviewTextField = ({
 };
 
 // src/components/input-components/AddFilesStandard/AddFilesStandard.tsx
-var import_react7 = require("react");
+var import_react9 = require("react");
 var import_clsx3 = __toESM(require("clsx"));
 
 // src/components/input-components/AddFilesStandard/DropFilesStandard.tsx
@@ -635,19 +647,19 @@ var DropFiles = ({ FilesSelected, DropFilesText = "Dra och sl\xE4pp dina filer h
 var DropFilesStandard_default = DropFiles;
 
 // src/components/input-components/AddFilesStandard/ExploreFilesStandard.tsx
-var import_react4 = require("react");
+var import_react6 = require("react");
 var import_clsx = __toESM(require("clsx"));
 
 // src/components/input-components/AddFilesStandard/ScreenReaderErrors.tsx
-var import_react3 = __toESM(require("react"));
+var import_react5 = __toESM(require("react"));
 var import_jsx_runtime8 = require("react/jsx-runtime");
 var ScreenReaderErrors = ({
   errorMessageAddingFile,
   activatedLanguage
 }) => {
-  const [activateErrorMessagesForScreenReader, setActivateErrorMessagesForScreenReader] = import_react3.default.useState(false);
-  const [errorMessagesForScreenReader, setErrorMessagesForScreenReader] = import_react3.default.useState("");
-  import_react3.default.useEffect(() => {
+  const [activateErrorMessagesForScreenReader, setActivateErrorMessagesForScreenReader] = import_react5.default.useState(false);
+  const [errorMessagesForScreenReader, setErrorMessagesForScreenReader] = import_react5.default.useState("");
+  import_react5.default.useEffect(() => {
     if (errorMessageAddingFile.length > 0) {
       let errorMessages = "";
       errorMessages += errorMessageAddingFile.length;
@@ -678,8 +690,8 @@ var ExploreFiles = ({
   showErrors,
   errorMessageAddingFile
 }) => {
-  const fileInputRef = (0, import_react4.useRef)(null);
-  const buttonInputRef = (0, import_react4.useRef)(null);
+  const fileInputRef = (0, import_react6.useRef)(null);
+  const buttonInputRef = (0, import_react6.useRef)(null);
   const handleFiles = (event) => {
     const files = Array.from(event.target.files || []);
     FilesSelected(files);
@@ -747,16 +759,16 @@ var ExploreFiles = ({
 var ExploreFilesStandard_default = ExploreFiles;
 
 // src/components/input-components/AddFilesStandard/SelectedFilesStandard.tsx
-var import_react6 = __toESM(require("react"));
+var import_react8 = __toESM(require("react"));
 var import_react_bootstrap = require("react-bootstrap");
 
 // src/components/input-components/AddFilesStandard/IndicatorStandard.tsx
-var import_react5 = require("react");
+var import_react7 = require("react");
 var import_clsx2 = __toESM(require("clsx"));
 var import_jsx_runtime10 = require("react/jsx-runtime");
 var Indicator = (filename) => {
-  const [uploadPercentage, setUploadPercentage] = (0, import_react5.useState)(0);
-  const [uploadDone, setUploadDone] = (0, import_react5.useState)(false);
+  const [uploadPercentage, setUploadPercentage] = (0, import_react7.useState)(0);
+  const [uploadDone, setUploadDone] = (0, import_react7.useState)(false);
   return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_jsx_runtime10.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: (0, import_clsx2.default)("uploadIndicator", "uploadDone") }) });
 };
 var IndicatorStandard_default = Indicator;
@@ -775,7 +787,7 @@ var SelectedFiles = ({
   setNumberOfFiles,
   removeUploadErrors
 }) => {
-  const theDiv = (0, import_react6.useRef)(null);
+  const theDiv = (0, import_react8.useRef)(null);
   const remove = (file) => {
     let newFiles = questionObject.files.filter((f) => f !== file);
     const newCountOfFiles = newFiles.length;
@@ -787,8 +799,8 @@ var SelectedFiles = ({
     removeFile(newCountOfFiles);
   };
   const useWindowWidth = () => {
-    const [windowWidth2, setWindowWidth] = (0, import_react6.useState)(window.innerWidth);
-    (0, import_react6.useEffect)(() => {
+    const [windowWidth2, setWindowWidth] = (0, import_react8.useState)(window.innerWidth);
+    (0, import_react8.useEffect)(() => {
       const handleResize = () => {
         setWindowWidth(window.innerWidth);
       };
@@ -811,7 +823,7 @@ var SelectedFiles = ({
           mobileFirstFileName = mobileFirstFileName.length > 8 ? mobileFirstFileName.substring(0, 8) + ".." : mobileFirstFileName;
           const fileType = errorObj.FileName.split(".").pop();
           mobileFirstFileName = mobileFirstFileName + "." + fileType;
-          return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react6.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "fileInListContainer", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "fileInList", children: [
+          return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react8.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "fileInListContainer", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "fileInList", children: [
             /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_bootstrap.Row, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_bootstrap.Col, { children: windowWidth < 768 ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "mobileFirstFileName", children: mobileFirstFileName }) : /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "desktopFileName", children: errorObj.FileName }) }) }),
             /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_bootstrap.Row, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
               import_react_bootstrap.Col,
@@ -864,7 +876,7 @@ var SelectedFiles = ({
       mobileFirstFileName = mobileFirstFileName.length > 8 ? mobileFirstFileName.substring(0, 8) + ".." : mobileFirstFileName;
       const fileType = file.FileName.split(".").pop();
       mobileFirstFileName = mobileFirstFileName + "." + fileType;
-      return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react6.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "fileInListContainer", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "fileInList", children: [
+      return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react8.default.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "fileInListContainer", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "fileInList", children: [
         /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "fileItem", children: [
           /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react_bootstrap.Col, { style: { maxWidth: "30px" }, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { "aria-hidden": "true", className: "uploadedDot", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
             "svg",
@@ -957,24 +969,24 @@ var AddFiles = ({
   const errorId = `error-${questionObject.id}`;
   const labelId = `label-${questionObject.id}`;
   const maxSizeMB = Math.round(allowedTotalFileSize / 1048576);
-  const [numberOfFiles, setNumberOfFiles] = (0, import_react7.useState)(0);
-  const [totalFileSize, setTotalFileSize] = (0, import_react7.useState)(0);
-  const [errorMessageAddingFile, setErrorMessageAddingFile] = (0, import_react7.useState)([]);
-  const [newFiles, setNewFiles] = (0, import_react7.useState)([]);
-  const [dropFilesText, setDropFilesText] = (0, import_react7.useState)("Dra och sl\xE4pp dina filer h\xE4r");
-  (0, import_react7.useEffect)(() => {
+  const [numberOfFiles, setNumberOfFiles] = (0, import_react9.useState)(0);
+  const [totalFileSize, setTotalFileSize] = (0, import_react9.useState)(0);
+  const [errorMessageAddingFile, setErrorMessageAddingFile] = (0, import_react9.useState)([]);
+  const [newFiles, setNewFiles] = (0, import_react9.useState)([]);
+  const [dropFilesText, setDropFilesText] = (0, import_react9.useState)("Dra och sl\xE4pp dina filer h\xE4r");
+  (0, import_react9.useEffect)(() => {
     if (activatedLanguage === "sv") {
       setDropFilesText("Dra och sl\xE4pp dina filer h\xE4r");
     } else {
       setDropFilesText("Drag and drop your files here");
     }
   }, [activatedLanguage]);
-  (0, import_react7.useEffect)(() => {
+  (0, import_react9.useEffect)(() => {
     if (questionObject.files && questionObject.files.length > 0) {
       setNumberOfFiles(questionObject.files.length);
     }
   }, []);
-  const onDrop = (0, import_react7.useCallback)(
+  const onDrop = (0, import_react9.useCallback)(
     (acceptedFiles) => {
       var _a2, _b2, _c;
       const validationErrors = [];
@@ -1064,7 +1076,7 @@ var AddFiles = ({
       reader.readAsDataURL(file);
     });
   };
-  (0, import_react7.useEffect)(() => {
+  (0, import_react9.useEffect)(() => {
     if (newFiles.length > 0) {
       const currentFiles = questionObject.files ? questionObject.files : [];
       const e = {
@@ -1184,7 +1196,7 @@ var PreviewAddFiles = ({
 };
 
 // src/components/input-components/SingleCheckboxStandard/SingleCheckboxStandard.tsx
-var import_react8 = require("react");
+var import_react10 = require("react");
 var import_dompurify3 = __toESM(require("dompurify"));
 var import_jsx_runtime13 = require("react/jsx-runtime");
 var SingleCheckbox = ({
@@ -1198,8 +1210,8 @@ var SingleCheckbox = ({
   const inputId = `checkbox-${question.id}`;
   const aboutId = `about-${question.id}`;
   const errorId = `error-${question.id}`;
-  const [checked, setChecked] = (0, import_react8.useState)(false);
-  (0, import_react8.useEffect)(() => {
+  const [checked, setChecked] = (0, import_react10.useState)(false);
+  (0, import_react10.useEffect)(() => {
     if (question.answer && question.answer === "true") {
       setChecked(true);
     } else {
@@ -1275,7 +1287,7 @@ var PreviewSingleCheckbox = ({
 };
 
 // src/components/text-blocks/TextHeadlineAndBodyStandard/TextHeadlineAndBodyStandard.tsx
-var import_react9 = require("react");
+var import_react11 = require("react");
 var import_dompurify4 = __toESM(require("dompurify"));
 var import_jsx_runtime14 = require("react/jsx-runtime");
 var TextHeadlineAndBody = ({ data, headlineType = "h2" }) => {
@@ -1284,7 +1296,7 @@ var TextHeadlineAndBody = ({ data, headlineType = "h2" }) => {
     {
       className: "pts-textHeadlineAndBody-container",
       children: [
-        data.headline && (0, import_react9.createElement)(headlineType, { id: "textHeadlineAndBody-headline" }, data.headline),
+        data.headline && (0, import_react11.createElement)(headlineType, { id: "textHeadlineAndBody-headline" }, data.headline),
         data.body && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { dangerouslySetInnerHTML: { __html: import_dompurify4.default.sanitize(data.body) } }),
         data.linksForMoreInfo && data.linksForMoreInfo.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { className: "pts-moreinfo-list", children: data.linksForMoreInfo.map((link, index) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("li", { className: index > 0 ? "notFirstInList" : "", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
           "a",
@@ -2127,10 +2139,10 @@ var InputInfoOnly = ({
 var InfoOnlyStandard_default = InputInfoOnly;
 
 // src/components/input-components/RadioMultipleWithInfoStandard/RadioMultipleWithInfoStandard.tsx
-var import_react11 = __toESM(require("react"));
+var import_react13 = __toESM(require("react"));
 
 // src/components/input-components/RadioMultipleWithInfoStandard/RadioCollapseItem.tsx
-var import_react10 = require("react");
+var import_react12 = require("react");
 var import_dompurify7 = __toESM(require("dompurify"));
 var import_jsx_runtime20 = require("react/jsx-runtime");
 var RadioCollapseItem = ({
@@ -2146,13 +2158,13 @@ var RadioCollapseItem = ({
   activatedLanguage = "sv",
   initialOpen = false
 }) => {
-  const [isOpen, setIsOpen] = (0, import_react10.useState)(initialOpen);
+  const [isOpen, setIsOpen] = (0, import_react12.useState)(initialOpen);
   const contentId = `${questionId}-content-${index}`;
   const buttonId = `${questionId}-button-${index}`;
   const openLabel = activatedLanguage === "sv" ? "Visa mer information om" : "Show more information about";
   const closeLabel = activatedLanguage === "sv" ? "D\xF6lj mer information om" : "Hide more information about";
   const buttonLabel = `${isOpen ? closeLabel : openLabel} "${label}"`;
-  (0, import_react10.useEffect)(() => {
+  (0, import_react12.useEffect)(() => {
     if (questionAnswer === value) {
       setIsOpen(true);
     } else {
@@ -2262,7 +2274,7 @@ var RadioWithInfo = ({
           groupedOptionArray.map((group, g_index) => {
             var _a2;
             let subId = "subheading-" + g_index;
-            return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_react11.default.Fragment, { children: [
+            return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_react13.default.Fragment, { children: [
               /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("legend", { className: "pts-radioWithInfo-sub-headline", id: subId, children: group.category }),
               /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { role: "group", "aria-labelledby": subId, children: (_a2 = group.items) == null ? void 0 : _a2.map((option, o_index) => {
                 var _a3, _b2, _c2, _d, _e;
@@ -3085,9 +3097,9 @@ var getGroupCheckIds = (validationType) => {
 var getGroupCheckIds_default = getGroupCheckIds;
 
 // src/hooks/useFormStatusModal/useFormStatusModal.ts
-var React8 = __toESM(require("react"));
+var React10 = __toESM(require("react"));
 var useFormStatusModal = (formStatus, handleModalOpen, handleModalClose, mainSelector = "#main-content") => {
-  React8.useEffect(() => {
+  React10.useEffect(() => {
     if (formStatus === "loading") {
       handleModalOpen();
     }
@@ -3102,7 +3114,7 @@ var useFormStatusModal = (formStatus, handleModalOpen, handleModalClose, mainSel
 };
 
 // src/hooks/usePTSPageTitle/usePTSPageTitle.ts
-var import_react12 = require("react");
+var import_react14 = require("react");
 var usePTSPageTitle = ({
   formStatus,
   activeStep,
@@ -3111,7 +3123,7 @@ var usePTSPageTitle = ({
   steps,
   fallbackTitle = "PTS e-tj\xE4nst"
 }) => {
-  const computedTitle = (0, import_react12.useMemo)(() => {
+  const computedTitle = (0, import_react14.useMemo)(() => {
     var _a, _b, _c, _d;
     const baseTitle = (_a = applicationContent == null ? void 0 : applicationContent.pageTitle) != null ? _a : "";
     const thankYouPageTitle = (_b = thankYouBlock == null ? void 0 : thankYouBlock.pageTitle) != null ? _b : "";
@@ -3120,19 +3132,19 @@ var usePTSPageTitle = ({
     if (activeStep === 0 && baseTitle) return baseTitle;
     return stepTitle || baseTitle || fallbackTitle;
   }, [formStatus, activeStep, applicationContent, thankYouBlock, steps, fallbackTitle]);
-  (0, import_react12.useEffect)(() => {
+  (0, import_react14.useEffect)(() => {
     document.title = computedTitle;
   }, [computedTitle]);
   return computedTitle;
 };
 
 // src/hooks/useInputMethodDetection/useInputMethodDetection.ts
-var import_react13 = require("react");
+var import_react15 = require("react");
 var useInputMethodDetection = ({
   mouseClassName = "using-mouse",
   keyboardToggleKey = "Tab"
 } = {}) => {
-  (0, import_react13.useEffect)(() => {
+  (0, import_react15.useEffect)(() => {
     const handleMouseDown = () => {
       document.body.classList.add(mouseClassName);
     };
@@ -3151,7 +3163,7 @@ var useInputMethodDetection = ({
 };
 
 // src/hooks/useCookieConsent/useCookieConsent.ts
-var import_react14 = require("react");
+var import_react16 = require("react");
 var useCookieConsent = ({
   cookieName,
   choiceKey,
@@ -3164,7 +3176,7 @@ var useCookieConsent = ({
     areCookiesAccepted,
     hasChoiceBeenMade,
     clearChoiceFromSession
-  } = (0, import_react14.useMemo)(
+  } = (0, import_react16.useMemo)(
     () => createCookieConsent({
       cookieName,
       choiceKey,
@@ -3172,15 +3184,15 @@ var useCookieConsent = ({
     }),
     [cookieName, choiceKey, expiryYears]
   );
-  const [showBanner, setShowBanner] = (0, import_react14.useState)(false);
-  const handleCookieStateChange = (0, import_react14.useCallback)(() => {
+  const [showBanner, setShowBanner] = (0, import_react16.useState)(false);
+  const handleCookieStateChange = (0, import_react16.useCallback)(() => {
     const cookiesNowAccepted = areCookiesAccepted();
     if (onConsentChange) {
       onConsentChange(cookiesNowAccepted);
     }
     setShowBanner(false);
   }, [areCookiesAccepted, onConsentChange]);
-  (0, import_react14.useEffect)(() => {
+  (0, import_react16.useEffect)(() => {
     const cookiesAccepted = areCookiesAccepted();
     const choiceMade = hasChoiceBeenMade();
     setShowBanner(!cookiesAccepted && !choiceMade);
@@ -3309,7 +3321,7 @@ var QuestionRenderer = ({
 var QuestionRenderer_default = QuestionRenderer;
 
 // src/components/question-rendering/QuestionGroup/QuestionGroup.tsx
-var import_react15 = require("react");
+var import_react17 = require("react");
 var import_jsx_runtime25 = require("react/jsx-runtime");
 var QuestionGroup = ({
   questions,
@@ -3329,7 +3341,7 @@ var QuestionGroup = ({
   const groupMandatory = (_a = firstQuestion.validationType) == null ? void 0 : _a.find(
     (e) => e.startsWith("groupCheck-")
   );
-  (0, import_react15.useEffect)(() => {
+  (0, import_react17.useEffect)(() => {
     questions.forEach((question) => {
       if (question.visible && !question.isDisplayed) {
         markQuestionAsDisplayed(question);
@@ -3337,7 +3349,7 @@ var QuestionGroup = ({
     });
   }, [questions]);
   const groupQuestions = /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_jsx_runtime25.Fragment, { children: questions.map((question, index) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react15.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react17.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       QuestionRenderer_default,
       {
         question,
@@ -3386,7 +3398,7 @@ var QuestionGroup = ({
       return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "pts-root-question-group-div", children: groupQuestions });
     case "none":
     default:
-      return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react15.Fragment, { children: groupQuestions });
+      return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react17.Fragment, { children: groupQuestions });
   }
 };
 var QuestionGroup_default = QuestionGroup;
@@ -4008,10 +4020,10 @@ var Header = ({
 var HeaderStandard_default = Header;
 
 // src/components/layout/NavigationHeaderStandard/NavigationHeaderStandard.tsx
-var import_react18 = require("react");
+var import_react20 = require("react");
 
 // src/components/layout/NavigationStandard/NavigationStandard.tsx
-var import_react16 = require("react");
+var import_react18 = require("react");
 var import_jsx_runtime30 = require("react/jsx-runtime");
 var Navigation = ({
   setIsMenyOpen,
@@ -4024,9 +4036,9 @@ var Navigation = ({
   activePath = null
 }) => {
   const closeMenuText = activatedLanguage === "sv" ? "St\xE4ng meny" : "Close menu";
-  const navRef = (0, import_react16.useRef)(null);
-  const firstVisitRef = (0, import_react16.useRef)(true);
-  const [openSubMenu, setOpenSubMenu] = (0, import_react16.useState)(null);
+  const navRef = (0, import_react18.useRef)(null);
+  const firstVisitRef = (0, import_react18.useRef)(true);
+  const [openSubMenu, setOpenSubMenu] = (0, import_react18.useState)(null);
   const handleSubMenu = (label) => {
     setOpenSubMenu(openSubMenu === label ? null : label);
   };
@@ -4035,7 +4047,7 @@ var Navigation = ({
     setIsMenyOpen == null ? void 0 : setIsMenyOpen(false);
     typeOfInteraction === "close" ? (_a = openButtonRef == null ? void 0 : openButtonRef.current) == null ? void 0 : _a.focus() : navigationCloseFocusId && ((_b = document.getElementById(navigationCloseFocusId)) == null ? void 0 : _b.focus());
   };
-  (0, import_react16.useEffect)(() => {
+  (0, import_react18.useEffect)(() => {
     var _a, _b;
     if (!isOpen) {
       setOpenSubMenu(null);
@@ -4047,7 +4059,7 @@ var Navigation = ({
     })) == null ? void 0 : _a.label[activatedLanguage]) != null ? _b : null;
     setOpenSubMenu(defaultOpenSubMenu);
   }, [isOpen, activePath, menuLinks, activatedLanguage]);
-  (0, import_react16.useEffect)(() => {
+  (0, import_react18.useEffect)(() => {
     if (!isOpen || !navRef.current) {
       return;
     }
@@ -4097,8 +4109,8 @@ var Navigation = ({
     }
     return "\xD6ppna undermeny f\xF6r " + label["sv"];
   };
-  const [instruction, setInstruction] = (0, import_react16.useState)("");
-  (0, import_react16.useEffect)(() => {
+  const [instruction, setInstruction] = (0, import_react18.useState)("");
+  (0, import_react18.useEffect)(() => {
     if (firstVisitRef.current) {
       firstVisitRef.current = false;
       return;
@@ -4187,7 +4199,7 @@ var Navigation = ({
 var NavigationStandard_default = Navigation;
 
 // src/components/layout/SearchBarStandard/SearchBarStandard.tsx
-var import_react17 = require("react");
+var import_react19 = require("react");
 
 // src/components/layout/SearchBarStandard/Icons.tsx
 var import_jsx_runtime31 = require("react/jsx-runtime");
@@ -4211,7 +4223,7 @@ var SearchIcon2 = ({ width = 15, height = 15, color = "#6E3282" }) => /* @__PURE
 // src/components/layout/SearchBarStandard/SearchBarStandard.tsx
 var import_jsx_runtime32 = require("react/jsx-runtime");
 var SearchBar = ({ activatedLanguage = "sv" }) => {
-  const [searchTerm, setSearchTerm] = (0, import_react17.useState)("");
+  const [searchTerm, setSearchTerm] = (0, import_react19.useState)("");
   const handleSearch = () => {
     console.log("S\xF6kt efter:", searchTerm);
   };
@@ -4265,8 +4277,8 @@ var NavigationHeader = ({
     if (activatedLanguage === "sv") return "English";
     else return "Svenska";
   };
-  const [isMenuOpen, setIsMenuOpen] = (0, import_react18.useState)(false);
-  const menuButtonFocusRef = (0, import_react18.useRef)(null);
+  const [isMenuOpen, setIsMenuOpen] = (0, import_react20.useState)(false);
+  const menuButtonFocusRef = (0, import_react20.useRef)(null);
   const handleMenuClick = () => {
     setIsMenuOpen((prev) => !prev);
   };
@@ -4280,7 +4292,7 @@ var NavigationHeader = ({
   const getMenuIcon = () => {
     return isMenuOpen ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(CloseIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(MenuIcon, {});
   };
-  const [isSearchOpen, setIsSearchOpen] = (0, import_react18.useState)(false);
+  const [isSearchOpen, setIsSearchOpen] = (0, import_react20.useState)(false);
   const handleSearchClick = () => {
     if (!isSearchOpen) {
       setIsSearchOpen(true);
@@ -4495,14 +4507,14 @@ var LinkStandard = ({
 var LinkStandard_default = LinkStandard;
 
 // src/components/layout/LinkListStandard/LinkListStandard.tsx
-var import_react19 = require("react");
+var import_react21 = require("react");
 var import_jsx_runtime37 = require("react/jsx-runtime");
 var LinkList = ({
   linkArray,
   activatedLanguage,
   linkComponent: LinkComponent = "a"
 }) => {
-  const uniqueId = (0, import_react19.useId)();
+  const uniqueId = (0, import_react21.useId)();
   return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "pts-linkList-container", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("ul", { children: linkArray && linkArray.map((link, index) => {
     var _a, _b, _c;
     return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
@@ -4521,7 +4533,7 @@ var LinkList = ({
 var LinkListStandard_default = LinkList;
 
 // src/components/layout/CollapseStandard/CollapseStandard.tsx
-var import_react20 = require("react");
+var import_react22 = require("react");
 var import_jsx_runtime38 = require("react/jsx-runtime");
 var Collapse = ({
   title,
@@ -4531,8 +4543,8 @@ var Collapse = ({
   activatedLanguage = "sv",
   customClass = ""
 }) => {
-  const [isOpen, setIsOpen] = (0, import_react20.useState)(defaultOpen);
-  const uniqueId = id != null ? id : (0, import_react20.useId)();
+  const [isOpen, setIsOpen] = (0, import_react22.useState)(defaultOpen);
+  const uniqueId = id != null ? id : (0, import_react22.useId)();
   const contentId = `${uniqueId}-content`;
   const openLabel = activatedLanguage === "sv" ? "Visa" : "Show";
   const closeLabel = activatedLanguage === "sv" ? "D\xF6lj" : "Hide";
@@ -4646,14 +4658,14 @@ var StepperButtons = ({
 var StepperButtonsStandard_default = StepperButtons;
 
 // src/components/stepper/StepperStandard/StepperStandard.tsx
-var import_react21 = __toESM(require("react"));
+var import_react23 = __toESM(require("react"));
 var import_jsx_runtime42 = require("react/jsx-runtime");
 var Stepper = ({ arraySteps = [], activeStep = 1 }) => {
   return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "pts-stepper-container", "aria-hidden": "true", children: arraySteps.map((step, index) => {
     const isActive = step.step === activeStep;
     const lastElement = arraySteps.length;
     const isDone = step.step < activeStep;
-    return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_react21.default.Fragment, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_react23.default.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "pts-stepper-step", children: [
         /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
           "div",