optimized-react-component-library-xyz123 3.3.0 → 3.3.2

package/dist/index.js

@@ -386,20 +386,31 @@ var InputTextarea = ({
   showPreview = false,
   activatedLanguage
 }) => {
-  var _a, _b, _c, _d, _e, _f;
+  var _a, _b, _c, _d, _e, _f, _g, _h;
   const questionId = `question-${question.id}`;
   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 [localAnswer, setLocalAnswer] = (0, import_react3.useState)((_a = question.answer) != null ? _a : "");
+  const lastSyncedAnswer = (0, import_react3.useRef)((_b = question.answer) != null ? _b : "");
+  (0, import_react3.useEffect)(() => {
+    var _a2;
+    const incomingFromRedux = (_a2 = question.answer) != null ? _a2 : "";
+    if (incomingFromRedux !== lastSyncedAnswer.current) {
+      setLocalAnswer(incomingFromRedux);
+      lastSyncedAnswer.current = incomingFromRedux;
+    }
+  }, [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 answerLength = (_d = (_c = question.answer) == null ? void 0 : _c.length) != null ? _d : 0;
+  const maxLength = (_f = (_e = question.questionExtraAttribute) == null ? void 0 : _e.answerMaxLength) != null ? _f : 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);
+  const handleOnChange = (e) => {
+    const value = e.target.value;
+    setLocalAnswer(value);
+    lastSyncedAnswer.current = value;
     handleQuestionInputChange(e, question);
   };
   return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
@@ -428,7 +439,7 @@ var InputTextarea = ({
             "textarea",
             {
               className: question.hasValidationError ? "pts-root-question-input-error-border" : void 0,
-              onChange: (e) => onChange(e),
+              onChange: handleOnChange,
               value: localAnswer,
               required: question.isQuestionMandatory,
               "aria-required": question.isQuestionMandatory,
@@ -438,13 +449,13 @@ var InputTextarea = ({
             }
           ),
           /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "pts-textarea-counter-error-container", children: [
-            !((_e = question.questionExtraAttribute) == null ? void 0 : _e.hideTextCounter) && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { "aria-live": "polite", className: `pts-character-counter`, children: counterText }),
+            !((_g = question.questionExtraAttribute) == null ? void 0 : _g.hideTextCounter) && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { "aria-live": "polite", className: `pts-character-counter`, children: counterText }),
             !isTooLong && question.hasValidationError && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
               ValidationMessage_default,
               {
                 showValidationMessage: true,
                 validationId: errorId,
-                validationMessesege: (_f = question.validationDefaultMessesege) != null ? _f : "",
+                validationMessesege: (_h = question.validationDefaultMessesege) != null ? _h : "",
                 activatedLanguage: activatedLanguage != null ? activatedLanguage : "sv"
               }
             ),
@@ -494,20 +505,22 @@ var TextFieldStandard = ({
   showPreview = false,
   activatedLanguage
 }) => {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p;
   const questionId = `question-${question.id}`;
   const inputId = `textField-${question.id}`;
   const aboutId = `about-${question.id}`;
   const errorId = `error-${question.id}`;
   const [localAnswer, setLocalAnswer] = (0, import_react4.useState)((_a = question.answer) != null ? _a : "");
-  const lastSyncedAnswer = (0, import_react4.useRef)(question.answer);
+  const lastSyncedAnswer = (0, import_react4.useRef)((_b = question.answer) != null ? _b : "");
   (0, import_react4.useEffect)(() => {
-    if (question.answer && question.answer !== lastSyncedAnswer.current) {
-      setLocalAnswer(question.answer);
-      lastSyncedAnswer.current = question.answer;
+    var _a2;
+    const incomingFromRedux = (_a2 = question.answer) != null ? _a2 : "";
+    if (incomingFromRedux !== lastSyncedAnswer.current) {
+      setLocalAnswer(incomingFromRedux);
+      lastSyncedAnswer.current = incomingFromRedux;
     }
   }, [question.answer]);
-  const answerLength = (_b = localAnswer == null ? void 0 : localAnswer.length) != null ? _b : 0;
+  const answerLength = (_c = localAnswer == null ? void 0 : localAnswer.length) != null ? _c : 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`;
@@ -522,7 +535,7 @@ var TextFieldStandard = ({
       "div",
       {
         id: questionId,
-        className: `pts-root-question pts-textField-container ${((_c = question.questionExtraAttribute) == null ? void 0 : _c.disabled) ? " pts-textField-disabled" : ""}${question.aboutText ? " pts-question-hasAbout" : ""}`.trim(),
+        className: `pts-root-question pts-textField-container ${((_d = question.questionExtraAttribute) == null ? void 0 : _d.disabled) ? " pts-textField-disabled" : ""}${question.aboutText ? " pts-question-hasAbout" : ""}`.trim(),
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("label", { htmlFor: inputId, children: [
             question.questionLabel,
@@ -542,21 +555,21 @@ var TextFieldStandard = ({
           /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
             "input",
             {
-              type: (_e = (_d = question.questionExtraAttribute) == null ? void 0 : _d.inputType) != null ? _e : "text",
-              autoComplete: (_g = (_f = question.questionExtraAttribute) == null ? void 0 : _f.autoComplete) != null ? _g : void 0,
-              inputMode: (_i = (_h = question.questionExtraAttribute) == null ? void 0 : _h.inputMode) != null ? _i : void 0,
+              type: (_f = (_e = question.questionExtraAttribute) == null ? void 0 : _e.inputType) != null ? _f : "text",
+              autoComplete: (_h = (_g = question.questionExtraAttribute) == null ? void 0 : _g.autoComplete) != null ? _h : void 0,
+              inputMode: (_j = (_i = question.questionExtraAttribute) == null ? void 0 : _i.inputMode) != null ? _j : void 0,
               name: `question-name-${question.id}`,
               className: question.hasValidationError ? "pts-root-question-input-error-border" : void 0,
               onChange: handleOnChange,
               value: localAnswer,
               id: inputId,
-              disabled: (_j = question.questionExtraAttribute) == null ? void 0 : _j.disabled,
+              disabled: (_k = question.questionExtraAttribute) == null ? void 0 : _k.disabled,
               required: question.isQuestionMandatory,
               "aria-required": question.isQuestionMandatory,
               "aria-describedby": [question.aboutText ? aboutId : null, question.hasValidationError ? errorId : null].filter(Boolean).join(" ") || void 0,
               "aria-invalid": question.hasValidationError,
-              spellCheck: (_l = (_k = question.questionExtraAttribute) == null ? void 0 : _k.spellCheck) != null ? _l : void 0,
-              autoCapitalize: (_n = (_m = question.questionExtraAttribute) == null ? void 0 : _m.autoCapitalize) != null ? _n : void 0
+              spellCheck: (_m = (_l = question.questionExtraAttribute) == null ? void 0 : _l.spellCheck) != null ? _m : void 0,
+              autoCapitalize: (_o = (_n = question.questionExtraAttribute) == null ? void 0 : _n.autoCapitalize) != null ? _o : void 0
             }
           ),
           !isTooLong && question.hasValidationError && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
@@ -564,7 +577,7 @@ var TextFieldStandard = ({
             {
               showValidationMessage: true,
               validationId: errorId,
-              validationMessesege: (_o = question.validationDefaultMessesege) != null ? _o : "",
+              validationMessesege: (_p = question.validationDefaultMessesege) != null ? _p : "",
               activatedLanguage: activatedLanguage != null ? activatedLanguage : "sv"
             }
           ),