optimized-react-component-library-xyz123 3.3.2 → 3.4.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +247 -245
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +245 -243
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -289,7 +289,188 @@ var PreviewCheckboxGroup = ({
|
|
|
289
289
|
};
|
|
290
290
|
|
|
291
291
|
// src/components/input-components/TextAreaStandard/TextAreaStandard.tsx
|
|
292
|
-
import { useEffect as
|
|
292
|
+
import { useEffect as useEffect8, useState as useState5 } from "react";
|
|
293
|
+
|
|
294
|
+
// src/hooks/useCookieConsent/useCookieConsent.ts
|
|
295
|
+
import { useCallback, useEffect as useEffect3, useMemo, useState as useState3 } from "react";
|
|
296
|
+
|
|
297
|
+
// src/helpers/cookieHandler/cookieHandler.ts
|
|
298
|
+
var getCookie = (name) => {
|
|
299
|
+
const match = document.cookie.match(new RegExp("(^| )" + name + "=([^;]+)"));
|
|
300
|
+
return match ? match[2] : null;
|
|
301
|
+
};
|
|
302
|
+
var setCookie = (name, value, expirationDate) => {
|
|
303
|
+
let cookieString = `${name}=${value}; path=/; SameSite=Strict`;
|
|
304
|
+
if (expirationDate) {
|
|
305
|
+
cookieString += `; expires=${expirationDate.toUTCString()}`;
|
|
306
|
+
}
|
|
307
|
+
if (window.location.protocol === "https:") {
|
|
308
|
+
cookieString += "; Secure";
|
|
309
|
+
}
|
|
310
|
+
document.cookie = cookieString;
|
|
311
|
+
};
|
|
312
|
+
var removeCookie = (name) => {
|
|
313
|
+
const pastDate = /* @__PURE__ */ new Date(0);
|
|
314
|
+
setCookie(name, "", pastDate);
|
|
315
|
+
};
|
|
316
|
+
var createCookieConsent = (config) => {
|
|
317
|
+
const { cookieName, choiceKey, expiryYears = 1 } = config;
|
|
318
|
+
const acceptCookies = () => {
|
|
319
|
+
const expires = /* @__PURE__ */ new Date();
|
|
320
|
+
expires.setFullYear(expires.getFullYear() + expiryYears);
|
|
321
|
+
setCookie(cookieName, "true", expires);
|
|
322
|
+
localStorage.setItem(cookieName, "true");
|
|
323
|
+
};
|
|
324
|
+
const rejectCookies = () => {
|
|
325
|
+
removeCookie(cookieName);
|
|
326
|
+
localStorage.removeItem(cookieName);
|
|
327
|
+
sessionStorage.setItem(choiceKey, "true");
|
|
328
|
+
};
|
|
329
|
+
const areCookiesAccepted = () => getCookie(cookieName) === "true";
|
|
330
|
+
const hasChoiceBeenMade = () => sessionStorage.getItem(choiceKey) === "true";
|
|
331
|
+
const clearChoiceFromSession = () => sessionStorage.removeItem(choiceKey);
|
|
332
|
+
return {
|
|
333
|
+
acceptCookies,
|
|
334
|
+
rejectCookies,
|
|
335
|
+
areCookiesAccepted,
|
|
336
|
+
hasChoiceBeenMade,
|
|
337
|
+
clearChoiceFromSession
|
|
338
|
+
};
|
|
339
|
+
};
|
|
340
|
+
|
|
341
|
+
// src/hooks/useCookieConsent/useCookieConsent.ts
|
|
342
|
+
var useCookieConsent = ({
|
|
343
|
+
cookieName,
|
|
344
|
+
choiceKey,
|
|
345
|
+
expiryYears = 1,
|
|
346
|
+
onConsentChange
|
|
347
|
+
}) => {
|
|
348
|
+
const {
|
|
349
|
+
acceptCookies,
|
|
350
|
+
rejectCookies,
|
|
351
|
+
areCookiesAccepted,
|
|
352
|
+
hasChoiceBeenMade,
|
|
353
|
+
clearChoiceFromSession
|
|
354
|
+
} = useMemo(
|
|
355
|
+
() => createCookieConsent({
|
|
356
|
+
cookieName,
|
|
357
|
+
choiceKey,
|
|
358
|
+
expiryYears
|
|
359
|
+
}),
|
|
360
|
+
[cookieName, choiceKey, expiryYears]
|
|
361
|
+
);
|
|
362
|
+
const [showBanner, setShowBanner] = useState3(false);
|
|
363
|
+
const handleCookieStateChange = useCallback(() => {
|
|
364
|
+
const cookiesNowAccepted = areCookiesAccepted();
|
|
365
|
+
if (onConsentChange) {
|
|
366
|
+
onConsentChange(cookiesNowAccepted);
|
|
367
|
+
}
|
|
368
|
+
setShowBanner(false);
|
|
369
|
+
}, [areCookiesAccepted, onConsentChange]);
|
|
370
|
+
useEffect3(() => {
|
|
371
|
+
const cookiesAccepted = areCookiesAccepted();
|
|
372
|
+
const choiceMade = hasChoiceBeenMade();
|
|
373
|
+
setShowBanner(!cookiesAccepted && !choiceMade);
|
|
374
|
+
if (cookiesAccepted && onConsentChange) {
|
|
375
|
+
onConsentChange(true);
|
|
376
|
+
}
|
|
377
|
+
const handleShowBannerEvent = () => {
|
|
378
|
+
clearChoiceFromSession();
|
|
379
|
+
setShowBanner(true);
|
|
380
|
+
};
|
|
381
|
+
window.addEventListener("showCookieBanner", handleShowBannerEvent);
|
|
382
|
+
return () => {
|
|
383
|
+
window.removeEventListener("showCookieBanner", handleShowBannerEvent);
|
|
384
|
+
};
|
|
385
|
+
}, [areCookiesAccepted, hasChoiceBeenMade, clearChoiceFromSession, onConsentChange]);
|
|
386
|
+
return {
|
|
387
|
+
showBanner,
|
|
388
|
+
handleCookieStateChange,
|
|
389
|
+
acceptCookies,
|
|
390
|
+
rejectCookies
|
|
391
|
+
};
|
|
392
|
+
};
|
|
393
|
+
|
|
394
|
+
// src/hooks/useDebouncedValue/useDebouncedValue.ts
|
|
395
|
+
import { useEffect as useEffect4, useState as useState4 } from "react";
|
|
396
|
+
var useDebouncedValue = (value, delay) => {
|
|
397
|
+
const [debouncedValue, setDebouncedValue] = useState4(value);
|
|
398
|
+
useEffect4(() => {
|
|
399
|
+
const timeoutId = window.setTimeout(() => {
|
|
400
|
+
setDebouncedValue(value);
|
|
401
|
+
}, delay);
|
|
402
|
+
return () => window.clearTimeout(timeoutId);
|
|
403
|
+
}, [value, delay]);
|
|
404
|
+
return debouncedValue;
|
|
405
|
+
};
|
|
406
|
+
|
|
407
|
+
// src/hooks/useFormStatusModal/useFormStatusModal.ts
|
|
408
|
+
import * as React from "react";
|
|
409
|
+
var useFormStatusModal = (formStatus, handleModalOpen, handleModalClose, mainSelector = "#main-content") => {
|
|
410
|
+
React.useEffect(() => {
|
|
411
|
+
if (formStatus === "loading") {
|
|
412
|
+
handleModalOpen();
|
|
413
|
+
}
|
|
414
|
+
if (formStatus === "success" || formStatus === "failed") {
|
|
415
|
+
setTimeout(() => {
|
|
416
|
+
handleModalClose();
|
|
417
|
+
}, 1050);
|
|
418
|
+
const main = document.querySelector(mainSelector);
|
|
419
|
+
if (main) main.focus();
|
|
420
|
+
}
|
|
421
|
+
}, [formStatus, handleModalOpen, handleModalClose, mainSelector]);
|
|
422
|
+
};
|
|
423
|
+
|
|
424
|
+
// src/hooks/useInputMethodDetection/useInputMethodDetection.ts
|
|
425
|
+
import { useEffect as useEffect6 } from "react";
|
|
426
|
+
var useInputMethodDetection = ({
|
|
427
|
+
mouseClassName = "using-mouse",
|
|
428
|
+
keyboardToggleKey = "Tab"
|
|
429
|
+
} = {}) => {
|
|
430
|
+
useEffect6(() => {
|
|
431
|
+
const handleMouseDown = () => {
|
|
432
|
+
document.body.classList.add(mouseClassName);
|
|
433
|
+
};
|
|
434
|
+
const handleKeyDown = (event) => {
|
|
435
|
+
if (event.key === keyboardToggleKey) {
|
|
436
|
+
document.body.classList.remove(mouseClassName);
|
|
437
|
+
}
|
|
438
|
+
};
|
|
439
|
+
document.addEventListener("mousedown", handleMouseDown);
|
|
440
|
+
document.addEventListener("keydown", handleKeyDown);
|
|
441
|
+
return () => {
|
|
442
|
+
document.removeEventListener("mousedown", handleMouseDown);
|
|
443
|
+
document.removeEventListener("keydown", handleKeyDown);
|
|
444
|
+
};
|
|
445
|
+
}, [mouseClassName, keyboardToggleKey]);
|
|
446
|
+
};
|
|
447
|
+
|
|
448
|
+
// src/hooks/usePTSPageTitle/usePTSPageTitle.ts
|
|
449
|
+
import { useMemo as useMemo2, useEffect as useEffect7 } from "react";
|
|
450
|
+
var usePTSPageTitle = ({
|
|
451
|
+
formStatus,
|
|
452
|
+
activeStep,
|
|
453
|
+
applicationContent,
|
|
454
|
+
thankYouBlock,
|
|
455
|
+
steps,
|
|
456
|
+
fallbackTitle = "PTS e-tj\xE4nst"
|
|
457
|
+
}) => {
|
|
458
|
+
const computedTitle = useMemo2(() => {
|
|
459
|
+
var _a, _b, _c, _d;
|
|
460
|
+
const baseTitle = (_a = applicationContent == null ? void 0 : applicationContent.pageTitle) != null ? _a : "";
|
|
461
|
+
const thankYouPageTitle = (_b = thankYouBlock == null ? void 0 : thankYouBlock.pageTitle) != null ? _b : "";
|
|
462
|
+
const stepTitle = (_d = (_c = steps == null ? void 0 : steps[Math.max(0, activeStep - 1)]) == null ? void 0 : _c.pageTitle) != null ? _d : "";
|
|
463
|
+
if (formStatus === "success" && thankYouPageTitle) return thankYouPageTitle;
|
|
464
|
+
if (activeStep === 0 && baseTitle) return baseTitle;
|
|
465
|
+
return stepTitle || baseTitle || fallbackTitle;
|
|
466
|
+
}, [formStatus, activeStep, applicationContent, thankYouBlock, steps, fallbackTitle]);
|
|
467
|
+
useEffect7(() => {
|
|
468
|
+
document.title = computedTitle;
|
|
469
|
+
}, [computedTitle]);
|
|
470
|
+
return computedTitle;
|
|
471
|
+
};
|
|
472
|
+
|
|
473
|
+
// src/components/input-components/TextAreaStandard/TextAreaStandard.tsx
|
|
293
474
|
import DOMPurify from "dompurify";
|
|
294
475
|
import { Fragment as Fragment4, jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
295
476
|
var InputTextarea = ({
|
|
@@ -298,31 +479,27 @@ var InputTextarea = ({
|
|
|
298
479
|
showPreview = false,
|
|
299
480
|
activatedLanguage
|
|
300
481
|
}) => {
|
|
301
|
-
var _a, _b, _c, _d, _e
|
|
482
|
+
var _a, _b, _c, _d, _e;
|
|
302
483
|
const questionId = `question-${question.id}`;
|
|
303
484
|
const inputId = `textarea-${question.id}`;
|
|
304
485
|
const aboutId = `about-${question.id}`;
|
|
305
486
|
const errorId = `error-${question.id}`;
|
|
306
|
-
const
|
|
307
|
-
const
|
|
308
|
-
|
|
487
|
+
const counterLiveRegionId = `counter-live-${question.id}`;
|
|
488
|
+
const [localAnswer, setLocalAnswer] = useState5((_a = question.answer) != null ? _a : "");
|
|
489
|
+
useEffect8(() => {
|
|
309
490
|
var _a2;
|
|
310
|
-
|
|
311
|
-
if (incomingFromRedux !== lastSyncedAnswer.current) {
|
|
312
|
-
setLocalAnswer(incomingFromRedux);
|
|
313
|
-
lastSyncedAnswer.current = incomingFromRedux;
|
|
314
|
-
}
|
|
491
|
+
setLocalAnswer((_a2 = question.answer) != null ? _a2 : "");
|
|
315
492
|
}, [question.answer]);
|
|
493
|
+
const debouncedAnswer = useDebouncedValue(localAnswer, 1e3);
|
|
316
494
|
const defaultMaxLength = 1e3;
|
|
317
|
-
const answerLength =
|
|
318
|
-
const
|
|
495
|
+
const answerLength = localAnswer.length;
|
|
496
|
+
const debouncedAnswerLength = debouncedAnswer.length;
|
|
497
|
+
const maxLength = (_c = (_b = question.questionExtraAttribute) == null ? void 0 : _b.answerMaxLength) != null ? _c : defaultMaxLength;
|
|
319
498
|
const isTooLong = answerLength > maxLength;
|
|
320
|
-
const
|
|
499
|
+
const visibleCounterText = activatedLanguage === "en" ? `${answerLength} of ${maxLength} characters` : `${answerLength} av ${maxLength} tecken`;
|
|
500
|
+
const screenReaderCounterText = activatedLanguage === "en" ? `${debouncedAnswerLength} of ${maxLength} characters` : `${debouncedAnswerLength} av ${maxLength} tecken`;
|
|
321
501
|
const maxLengthErrorText = activatedLanguage === "en" ? `The text must be ${maxLength} characters or less` : `Texten f\xE5r inte vara l\xE4ngre \xE4n ${maxLength} tecken`;
|
|
322
|
-
const
|
|
323
|
-
const value = e.target.value;
|
|
324
|
-
setLocalAnswer(value);
|
|
325
|
-
lastSyncedAnswer.current = value;
|
|
502
|
+
const onChange = (e) => {
|
|
326
503
|
handleQuestionInputChange(e, question);
|
|
327
504
|
};
|
|
328
505
|
return /* @__PURE__ */ jsxs5(Fragment4, { children: [
|
|
@@ -351,8 +528,8 @@ var InputTextarea = ({
|
|
|
351
528
|
"textarea",
|
|
352
529
|
{
|
|
353
530
|
className: question.hasValidationError ? "pts-root-question-input-error-border" : void 0,
|
|
354
|
-
onChange:
|
|
355
|
-
value:
|
|
531
|
+
onChange: (e) => onChange(e),
|
|
532
|
+
value: question.answer,
|
|
356
533
|
required: question.isQuestionMandatory,
|
|
357
534
|
"aria-required": question.isQuestionMandatory,
|
|
358
535
|
"aria-invalid": question.hasValidationError,
|
|
@@ -361,13 +538,16 @@ var InputTextarea = ({
|
|
|
361
538
|
}
|
|
362
539
|
),
|
|
363
540
|
/* @__PURE__ */ jsxs5("div", { className: "pts-textarea-counter-error-container", children: [
|
|
364
|
-
!((
|
|
541
|
+
!((_d = question.questionExtraAttribute) == null ? void 0 : _d.hideTextCounter) && /* @__PURE__ */ jsxs5(Fragment4, { children: [
|
|
542
|
+
/* @__PURE__ */ jsx5("div", { "aria-hidden": "true", className: `pts-character-counter`, children: visibleCounterText }),
|
|
543
|
+
/* @__PURE__ */ jsx5("div", { id: counterLiveRegionId, "aria-live": "polite", className: "sr-only", children: screenReaderCounterText })
|
|
544
|
+
] }),
|
|
365
545
|
!isTooLong && question.hasValidationError && /* @__PURE__ */ jsx5(
|
|
366
546
|
ValidationMessage_default,
|
|
367
547
|
{
|
|
368
548
|
showValidationMessage: true,
|
|
369
549
|
validationId: errorId,
|
|
370
|
-
validationMessesege: (
|
|
550
|
+
validationMessesege: (_e = question.validationDefaultMessesege) != null ? _e : "",
|
|
371
551
|
activatedLanguage: activatedLanguage != null ? activatedLanguage : "sv"
|
|
372
552
|
}
|
|
373
553
|
),
|
|
@@ -408,7 +588,6 @@ var PreviewTextarea = ({
|
|
|
408
588
|
};
|
|
409
589
|
|
|
410
590
|
// src/components/input-components/TextFieldStandard/TextFieldStandard.tsx
|
|
411
|
-
import { useState as useState4, useRef as useRef2, useEffect as useEffect4 } from "react";
|
|
412
591
|
import DOMPurify2 from "dompurify";
|
|
413
592
|
import { Fragment as Fragment5, jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
414
593
|
var TextFieldStandard = ({
|
|
@@ -417,29 +596,16 @@ var TextFieldStandard = ({
|
|
|
417
596
|
showPreview = false,
|
|
418
597
|
activatedLanguage
|
|
419
598
|
}) => {
|
|
420
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o
|
|
599
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o;
|
|
421
600
|
const questionId = `question-${question.id}`;
|
|
422
601
|
const inputId = `textField-${question.id}`;
|
|
423
602
|
const aboutId = `about-${question.id}`;
|
|
424
603
|
const errorId = `error-${question.id}`;
|
|
425
|
-
const
|
|
426
|
-
const lastSyncedAnswer = useRef2((_b = question.answer) != null ? _b : "");
|
|
427
|
-
useEffect4(() => {
|
|
428
|
-
var _a2;
|
|
429
|
-
const incomingFromRedux = (_a2 = question.answer) != null ? _a2 : "";
|
|
430
|
-
if (incomingFromRedux !== lastSyncedAnswer.current) {
|
|
431
|
-
setLocalAnswer(incomingFromRedux);
|
|
432
|
-
lastSyncedAnswer.current = incomingFromRedux;
|
|
433
|
-
}
|
|
434
|
-
}, [question.answer]);
|
|
435
|
-
const answerLength = (_c = localAnswer == null ? void 0 : localAnswer.length) != null ? _c : 0;
|
|
604
|
+
const answerLength = (_b = (_a = question.answer) == null ? void 0 : _a.length) != null ? _b : 0;
|
|
436
605
|
const maxLength = 100;
|
|
437
606
|
const isTooLong = answerLength > maxLength;
|
|
438
607
|
const maxLengthErrorText = activatedLanguage === "en" ? `The text must be ${maxLength} characters or less` : `Texten f\xE5r inte vara l\xE4ngre \xE4n ${maxLength} tecken`;
|
|
439
608
|
const handleOnChange = (e) => {
|
|
440
|
-
const value = e.target.value;
|
|
441
|
-
setLocalAnswer(value);
|
|
442
|
-
lastSyncedAnswer.current = value;
|
|
443
609
|
handleQuestionInputChange(e, question);
|
|
444
610
|
};
|
|
445
611
|
return /* @__PURE__ */ jsxs6(Fragment5, { children: [
|
|
@@ -447,7 +613,7 @@ var TextFieldStandard = ({
|
|
|
447
613
|
"div",
|
|
448
614
|
{
|
|
449
615
|
id: questionId,
|
|
450
|
-
className: `pts-root-question pts-textField-container ${((
|
|
616
|
+
className: `pts-root-question pts-textField-container ${((_c = question.questionExtraAttribute) == null ? void 0 : _c.disabled) ? " pts-textField-disabled" : ""}${question.aboutText ? " pts-question-hasAbout" : ""}`.trim(),
|
|
451
617
|
children: [
|
|
452
618
|
/* @__PURE__ */ jsxs6("label", { htmlFor: inputId, children: [
|
|
453
619
|
question.questionLabel,
|
|
@@ -467,21 +633,21 @@ var TextFieldStandard = ({
|
|
|
467
633
|
/* @__PURE__ */ jsx6(
|
|
468
634
|
"input",
|
|
469
635
|
{
|
|
470
|
-
type: (
|
|
471
|
-
autoComplete: (
|
|
472
|
-
inputMode: (
|
|
636
|
+
type: (_e = (_d = question.questionExtraAttribute) == null ? void 0 : _d.inputType) != null ? _e : "text",
|
|
637
|
+
autoComplete: (_g = (_f = question.questionExtraAttribute) == null ? void 0 : _f.autoComplete) != null ? _g : void 0,
|
|
638
|
+
inputMode: (_i = (_h = question.questionExtraAttribute) == null ? void 0 : _h.inputMode) != null ? _i : void 0,
|
|
473
639
|
name: `question-name-${question.id}`,
|
|
474
640
|
className: question.hasValidationError ? "pts-root-question-input-error-border" : void 0,
|
|
475
641
|
onChange: handleOnChange,
|
|
476
|
-
value:
|
|
642
|
+
value: question.answer,
|
|
477
643
|
id: inputId,
|
|
478
|
-
disabled: (
|
|
644
|
+
disabled: (_j = question.questionExtraAttribute) == null ? void 0 : _j.disabled,
|
|
479
645
|
required: question.isQuestionMandatory,
|
|
480
646
|
"aria-required": question.isQuestionMandatory,
|
|
481
647
|
"aria-describedby": [question.aboutText ? aboutId : null, question.hasValidationError ? errorId : null].filter(Boolean).join(" ") || void 0,
|
|
482
648
|
"aria-invalid": question.hasValidationError,
|
|
483
|
-
spellCheck: (
|
|
484
|
-
autoCapitalize: (
|
|
649
|
+
spellCheck: (_l = (_k = question.questionExtraAttribute) == null ? void 0 : _k.spellCheck) != null ? _l : void 0,
|
|
650
|
+
autoCapitalize: (_n = (_m = question.questionExtraAttribute) == null ? void 0 : _m.autoCapitalize) != null ? _n : void 0
|
|
485
651
|
}
|
|
486
652
|
),
|
|
487
653
|
!isTooLong && question.hasValidationError && /* @__PURE__ */ jsx6(
|
|
@@ -489,7 +655,7 @@ var TextFieldStandard = ({
|
|
|
489
655
|
{
|
|
490
656
|
showValidationMessage: true,
|
|
491
657
|
validationId: errorId,
|
|
492
|
-
validationMessesege: (
|
|
658
|
+
validationMessesege: (_o = question.validationDefaultMessesege) != null ? _o : "",
|
|
493
659
|
activatedLanguage: activatedLanguage != null ? activatedLanguage : "sv"
|
|
494
660
|
}
|
|
495
661
|
),
|
|
@@ -529,7 +695,7 @@ var PreviewTextField = ({
|
|
|
529
695
|
};
|
|
530
696
|
|
|
531
697
|
// src/components/input-components/AddFilesStandard/AddFilesStandard.tsx
|
|
532
|
-
import { useCallback, useEffect as
|
|
698
|
+
import { useCallback as useCallback2, useEffect as useEffect11, useState as useState8 } from "react";
|
|
533
699
|
import clsx3 from "clsx";
|
|
534
700
|
|
|
535
701
|
// src/components/input-components/AddFilesStandard/DropFilesStandard.tsx
|
|
@@ -581,7 +747,7 @@ var DropFiles = ({ FilesSelected, DropFilesText = "Dra och sl\xE4pp dina filer h
|
|
|
581
747
|
var DropFilesStandard_default = DropFiles;
|
|
582
748
|
|
|
583
749
|
// src/components/input-components/AddFilesStandard/ExploreFilesStandard.tsx
|
|
584
|
-
import { useRef
|
|
750
|
+
import { useRef } from "react";
|
|
585
751
|
import clsx from "clsx";
|
|
586
752
|
|
|
587
753
|
// src/components/input-components/AddFilesStandard/ScreenReaderErrors.tsx
|
|
@@ -624,8 +790,8 @@ var ExploreFiles = ({
|
|
|
624
790
|
showErrors,
|
|
625
791
|
errorMessageAddingFile
|
|
626
792
|
}) => {
|
|
627
|
-
const fileInputRef =
|
|
628
|
-
const buttonInputRef =
|
|
793
|
+
const fileInputRef = useRef(null);
|
|
794
|
+
const buttonInputRef = useRef(null);
|
|
629
795
|
const handleFiles = (event) => {
|
|
630
796
|
const files = Array.from(event.target.files || []);
|
|
631
797
|
FilesSelected(files);
|
|
@@ -693,16 +859,16 @@ var ExploreFiles = ({
|
|
|
693
859
|
var ExploreFilesStandard_default = ExploreFiles;
|
|
694
860
|
|
|
695
861
|
// src/components/input-components/AddFilesStandard/SelectedFilesStandard.tsx
|
|
696
|
-
import React6, { useEffect as
|
|
862
|
+
import React6, { useEffect as useEffect10, useState as useState7, useRef as useRef2 } from "react";
|
|
697
863
|
import { Col, Row } from "react-bootstrap";
|
|
698
864
|
|
|
699
865
|
// src/components/input-components/AddFilesStandard/IndicatorStandard.tsx
|
|
700
|
-
import { useState as
|
|
866
|
+
import { useState as useState6 } from "react";
|
|
701
867
|
import clsx2 from "clsx";
|
|
702
868
|
import { Fragment as Fragment9, jsx as jsx10 } from "react/jsx-runtime";
|
|
703
869
|
var Indicator = (filename) => {
|
|
704
|
-
const [uploadPercentage, setUploadPercentage] =
|
|
705
|
-
const [uploadDone, setUploadDone] =
|
|
870
|
+
const [uploadPercentage, setUploadPercentage] = useState6(0);
|
|
871
|
+
const [uploadDone, setUploadDone] = useState6(false);
|
|
706
872
|
return /* @__PURE__ */ jsx10(Fragment9, { children: /* @__PURE__ */ jsx10("div", { className: clsx2("uploadIndicator", "uploadDone") }) });
|
|
707
873
|
};
|
|
708
874
|
var IndicatorStandard_default = Indicator;
|
|
@@ -721,7 +887,7 @@ var SelectedFiles = ({
|
|
|
721
887
|
setNumberOfFiles,
|
|
722
888
|
removeUploadErrors
|
|
723
889
|
}) => {
|
|
724
|
-
const theDiv =
|
|
890
|
+
const theDiv = useRef2(null);
|
|
725
891
|
const remove = (file) => {
|
|
726
892
|
let newFiles = questionObject.files.filter((f) => f !== file);
|
|
727
893
|
const newCountOfFiles = newFiles.length;
|
|
@@ -733,8 +899,8 @@ var SelectedFiles = ({
|
|
|
733
899
|
removeFile(newCountOfFiles);
|
|
734
900
|
};
|
|
735
901
|
const useWindowWidth = () => {
|
|
736
|
-
const [windowWidth2, setWindowWidth] =
|
|
737
|
-
|
|
902
|
+
const [windowWidth2, setWindowWidth] = useState7(window.innerWidth);
|
|
903
|
+
useEffect10(() => {
|
|
738
904
|
const handleResize = () => {
|
|
739
905
|
setWindowWidth(window.innerWidth);
|
|
740
906
|
};
|
|
@@ -903,24 +1069,24 @@ var AddFiles = ({
|
|
|
903
1069
|
const errorId = `error-${questionObject.id}`;
|
|
904
1070
|
const labelId = `label-${questionObject.id}`;
|
|
905
1071
|
const maxSizeMB = Math.round(allowedTotalFileSize / 1048576);
|
|
906
|
-
const [numberOfFiles, setNumberOfFiles] =
|
|
907
|
-
const [totalFileSize, setTotalFileSize] =
|
|
908
|
-
const [errorMessageAddingFile, setErrorMessageAddingFile] =
|
|
909
|
-
const [newFiles, setNewFiles] =
|
|
910
|
-
const [dropFilesText, setDropFilesText] =
|
|
911
|
-
|
|
1072
|
+
const [numberOfFiles, setNumberOfFiles] = useState8(0);
|
|
1073
|
+
const [totalFileSize, setTotalFileSize] = useState8(0);
|
|
1074
|
+
const [errorMessageAddingFile, setErrorMessageAddingFile] = useState8([]);
|
|
1075
|
+
const [newFiles, setNewFiles] = useState8([]);
|
|
1076
|
+
const [dropFilesText, setDropFilesText] = useState8("Dra och sl\xE4pp dina filer h\xE4r");
|
|
1077
|
+
useEffect11(() => {
|
|
912
1078
|
if (activatedLanguage === "sv") {
|
|
913
1079
|
setDropFilesText("Dra och sl\xE4pp dina filer h\xE4r");
|
|
914
1080
|
} else {
|
|
915
1081
|
setDropFilesText("Drag and drop your files here");
|
|
916
1082
|
}
|
|
917
1083
|
}, [activatedLanguage]);
|
|
918
|
-
|
|
1084
|
+
useEffect11(() => {
|
|
919
1085
|
if (questionObject.files && questionObject.files.length > 0) {
|
|
920
1086
|
setNumberOfFiles(questionObject.files.length);
|
|
921
1087
|
}
|
|
922
1088
|
}, []);
|
|
923
|
-
const onDrop =
|
|
1089
|
+
const onDrop = useCallback2(
|
|
924
1090
|
(acceptedFiles) => {
|
|
925
1091
|
var _a2, _b2, _c;
|
|
926
1092
|
const validationErrors = [];
|
|
@@ -1010,7 +1176,7 @@ var AddFiles = ({
|
|
|
1010
1176
|
reader.readAsDataURL(file);
|
|
1011
1177
|
});
|
|
1012
1178
|
};
|
|
1013
|
-
|
|
1179
|
+
useEffect11(() => {
|
|
1014
1180
|
if (newFiles.length > 0) {
|
|
1015
1181
|
const currentFiles = questionObject.files ? questionObject.files : [];
|
|
1016
1182
|
const e = {
|
|
@@ -1130,7 +1296,7 @@ var PreviewAddFiles = ({
|
|
|
1130
1296
|
};
|
|
1131
1297
|
|
|
1132
1298
|
// src/components/input-components/SingleCheckboxStandard/SingleCheckboxStandard.tsx
|
|
1133
|
-
import { useEffect as
|
|
1299
|
+
import { useEffect as useEffect12, useState as useState9 } from "react";
|
|
1134
1300
|
import DOMPurify3 from "dompurify";
|
|
1135
1301
|
import { Fragment as Fragment12, jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1136
1302
|
var SingleCheckbox = ({
|
|
@@ -1144,8 +1310,8 @@ var SingleCheckbox = ({
|
|
|
1144
1310
|
const inputId = `checkbox-${question.id}`;
|
|
1145
1311
|
const aboutId = `about-${question.id}`;
|
|
1146
1312
|
const errorId = `error-${question.id}`;
|
|
1147
|
-
const [checked, setChecked] =
|
|
1148
|
-
|
|
1313
|
+
const [checked, setChecked] = useState9(false);
|
|
1314
|
+
useEffect12(() => {
|
|
1149
1315
|
if (question.answer && question.answer === "true") {
|
|
1150
1316
|
setChecked(true);
|
|
1151
1317
|
} else {
|
|
@@ -2076,7 +2242,7 @@ var InfoOnlyStandard_default = InputInfoOnly;
|
|
|
2076
2242
|
import React9 from "react";
|
|
2077
2243
|
|
|
2078
2244
|
// src/components/input-components/RadioMultipleWithInfoStandard/RadioCollapseItem.tsx
|
|
2079
|
-
import { useEffect as
|
|
2245
|
+
import { useEffect as useEffect13, useState as useState10 } from "react";
|
|
2080
2246
|
import DOMPurify7 from "dompurify";
|
|
2081
2247
|
import { jsx as jsx20, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
2082
2248
|
var RadioCollapseItem = ({
|
|
@@ -2092,13 +2258,13 @@ var RadioCollapseItem = ({
|
|
|
2092
2258
|
activatedLanguage = "sv",
|
|
2093
2259
|
initialOpen = false
|
|
2094
2260
|
}) => {
|
|
2095
|
-
const [isOpen, setIsOpen] =
|
|
2261
|
+
const [isOpen, setIsOpen] = useState10(initialOpen);
|
|
2096
2262
|
const contentId = `${questionId}-content-${index}`;
|
|
2097
2263
|
const buttonId = `${questionId}-button-${index}`;
|
|
2098
2264
|
const openLabel = activatedLanguage === "sv" ? "Visa mer information om" : "Show more information about";
|
|
2099
2265
|
const closeLabel = activatedLanguage === "sv" ? "D\xF6lj mer information om" : "Hide more information about";
|
|
2100
2266
|
const buttonLabel = `${isOpen ? closeLabel : openLabel} "${label}"`;
|
|
2101
|
-
|
|
2267
|
+
useEffect13(() => {
|
|
2102
2268
|
if (questionAnswer === value) {
|
|
2103
2269
|
setIsOpen(true);
|
|
2104
2270
|
} else {
|
|
@@ -2937,50 +3103,6 @@ var makeFormSelectors = (selectSlice) => {
|
|
|
2937
3103
|
};
|
|
2938
3104
|
};
|
|
2939
3105
|
|
|
2940
|
-
// src/helpers/cookieHandler/cookieHandler.ts
|
|
2941
|
-
var getCookie = (name) => {
|
|
2942
|
-
const match = document.cookie.match(new RegExp("(^| )" + name + "=([^;]+)"));
|
|
2943
|
-
return match ? match[2] : null;
|
|
2944
|
-
};
|
|
2945
|
-
var setCookie = (name, value, expirationDate) => {
|
|
2946
|
-
let cookieString = `${name}=${value}; path=/; SameSite=Strict`;
|
|
2947
|
-
if (expirationDate) {
|
|
2948
|
-
cookieString += `; expires=${expirationDate.toUTCString()}`;
|
|
2949
|
-
}
|
|
2950
|
-
if (window.location.protocol === "https:") {
|
|
2951
|
-
cookieString += "; Secure";
|
|
2952
|
-
}
|
|
2953
|
-
document.cookie = cookieString;
|
|
2954
|
-
};
|
|
2955
|
-
var removeCookie = (name) => {
|
|
2956
|
-
const pastDate = /* @__PURE__ */ new Date(0);
|
|
2957
|
-
setCookie(name, "", pastDate);
|
|
2958
|
-
};
|
|
2959
|
-
var createCookieConsent = (config) => {
|
|
2960
|
-
const { cookieName, choiceKey, expiryYears = 1 } = config;
|
|
2961
|
-
const acceptCookies = () => {
|
|
2962
|
-
const expires = /* @__PURE__ */ new Date();
|
|
2963
|
-
expires.setFullYear(expires.getFullYear() + expiryYears);
|
|
2964
|
-
setCookie(cookieName, "true", expires);
|
|
2965
|
-
localStorage.setItem(cookieName, "true");
|
|
2966
|
-
};
|
|
2967
|
-
const rejectCookies = () => {
|
|
2968
|
-
removeCookie(cookieName);
|
|
2969
|
-
localStorage.removeItem(cookieName);
|
|
2970
|
-
sessionStorage.setItem(choiceKey, "true");
|
|
2971
|
-
};
|
|
2972
|
-
const areCookiesAccepted = () => getCookie(cookieName) === "true";
|
|
2973
|
-
const hasChoiceBeenMade = () => sessionStorage.getItem(choiceKey) === "true";
|
|
2974
|
-
const clearChoiceFromSession = () => sessionStorage.removeItem(choiceKey);
|
|
2975
|
-
return {
|
|
2976
|
-
acceptCookies,
|
|
2977
|
-
rejectCookies,
|
|
2978
|
-
areCookiesAccepted,
|
|
2979
|
-
hasChoiceBeenMade,
|
|
2980
|
-
clearChoiceFromSession
|
|
2981
|
-
};
|
|
2982
|
-
};
|
|
2983
|
-
|
|
2984
3106
|
// src/helpers/scriptHandler/scriptHandler.ts
|
|
2985
3107
|
var toggleScriptByConsent = (consent, options) => {
|
|
2986
3108
|
if (typeof document === "undefined") return;
|
|
@@ -3033,126 +3155,6 @@ var getGroupCheckIds = (validationType) => {
|
|
|
3033
3155
|
};
|
|
3034
3156
|
var getGroupCheckIds_default = getGroupCheckIds;
|
|
3035
3157
|
|
|
3036
|
-
// src/hooks/useFormStatusModal/useFormStatusModal.ts
|
|
3037
|
-
import * as React10 from "react";
|
|
3038
|
-
var useFormStatusModal = (formStatus, handleModalOpen, handleModalClose, mainSelector = "#main-content") => {
|
|
3039
|
-
React10.useEffect(() => {
|
|
3040
|
-
if (formStatus === "loading") {
|
|
3041
|
-
handleModalOpen();
|
|
3042
|
-
}
|
|
3043
|
-
if (formStatus === "success" || formStatus === "failed") {
|
|
3044
|
-
setTimeout(() => {
|
|
3045
|
-
handleModalClose();
|
|
3046
|
-
}, 1050);
|
|
3047
|
-
const main = document.querySelector(mainSelector);
|
|
3048
|
-
if (main) main.focus();
|
|
3049
|
-
}
|
|
3050
|
-
}, [formStatus, handleModalOpen, handleModalClose, mainSelector]);
|
|
3051
|
-
};
|
|
3052
|
-
|
|
3053
|
-
// src/hooks/usePTSPageTitle/usePTSPageTitle.ts
|
|
3054
|
-
import { useMemo, useEffect as useEffect11 } from "react";
|
|
3055
|
-
var usePTSPageTitle = ({
|
|
3056
|
-
formStatus,
|
|
3057
|
-
activeStep,
|
|
3058
|
-
applicationContent,
|
|
3059
|
-
thankYouBlock,
|
|
3060
|
-
steps,
|
|
3061
|
-
fallbackTitle = "PTS e-tj\xE4nst"
|
|
3062
|
-
}) => {
|
|
3063
|
-
const computedTitle = useMemo(() => {
|
|
3064
|
-
var _a, _b, _c, _d;
|
|
3065
|
-
const baseTitle = (_a = applicationContent == null ? void 0 : applicationContent.pageTitle) != null ? _a : "";
|
|
3066
|
-
const thankYouPageTitle = (_b = thankYouBlock == null ? void 0 : thankYouBlock.pageTitle) != null ? _b : "";
|
|
3067
|
-
const stepTitle = (_d = (_c = steps == null ? void 0 : steps[Math.max(0, activeStep - 1)]) == null ? void 0 : _c.pageTitle) != null ? _d : "";
|
|
3068
|
-
if (formStatus === "success" && thankYouPageTitle) return thankYouPageTitle;
|
|
3069
|
-
if (activeStep === 0 && baseTitle) return baseTitle;
|
|
3070
|
-
return stepTitle || baseTitle || fallbackTitle;
|
|
3071
|
-
}, [formStatus, activeStep, applicationContent, thankYouBlock, steps, fallbackTitle]);
|
|
3072
|
-
useEffect11(() => {
|
|
3073
|
-
document.title = computedTitle;
|
|
3074
|
-
}, [computedTitle]);
|
|
3075
|
-
return computedTitle;
|
|
3076
|
-
};
|
|
3077
|
-
|
|
3078
|
-
// src/hooks/useInputMethodDetection/useInputMethodDetection.ts
|
|
3079
|
-
import { useEffect as useEffect12 } from "react";
|
|
3080
|
-
var useInputMethodDetection = ({
|
|
3081
|
-
mouseClassName = "using-mouse",
|
|
3082
|
-
keyboardToggleKey = "Tab"
|
|
3083
|
-
} = {}) => {
|
|
3084
|
-
useEffect12(() => {
|
|
3085
|
-
const handleMouseDown = () => {
|
|
3086
|
-
document.body.classList.add(mouseClassName);
|
|
3087
|
-
};
|
|
3088
|
-
const handleKeyDown = (event) => {
|
|
3089
|
-
if (event.key === keyboardToggleKey) {
|
|
3090
|
-
document.body.classList.remove(mouseClassName);
|
|
3091
|
-
}
|
|
3092
|
-
};
|
|
3093
|
-
document.addEventListener("mousedown", handleMouseDown);
|
|
3094
|
-
document.addEventListener("keydown", handleKeyDown);
|
|
3095
|
-
return () => {
|
|
3096
|
-
document.removeEventListener("mousedown", handleMouseDown);
|
|
3097
|
-
document.removeEventListener("keydown", handleKeyDown);
|
|
3098
|
-
};
|
|
3099
|
-
}, [mouseClassName, keyboardToggleKey]);
|
|
3100
|
-
};
|
|
3101
|
-
|
|
3102
|
-
// src/hooks/useCookieConsent/useCookieConsent.ts
|
|
3103
|
-
import { useCallback as useCallback2, useEffect as useEffect13, useMemo as useMemo2, useState as useState10 } from "react";
|
|
3104
|
-
var useCookieConsent = ({
|
|
3105
|
-
cookieName,
|
|
3106
|
-
choiceKey,
|
|
3107
|
-
expiryYears = 1,
|
|
3108
|
-
onConsentChange
|
|
3109
|
-
}) => {
|
|
3110
|
-
const {
|
|
3111
|
-
acceptCookies,
|
|
3112
|
-
rejectCookies,
|
|
3113
|
-
areCookiesAccepted,
|
|
3114
|
-
hasChoiceBeenMade,
|
|
3115
|
-
clearChoiceFromSession
|
|
3116
|
-
} = useMemo2(
|
|
3117
|
-
() => createCookieConsent({
|
|
3118
|
-
cookieName,
|
|
3119
|
-
choiceKey,
|
|
3120
|
-
expiryYears
|
|
3121
|
-
}),
|
|
3122
|
-
[cookieName, choiceKey, expiryYears]
|
|
3123
|
-
);
|
|
3124
|
-
const [showBanner, setShowBanner] = useState10(false);
|
|
3125
|
-
const handleCookieStateChange = useCallback2(() => {
|
|
3126
|
-
const cookiesNowAccepted = areCookiesAccepted();
|
|
3127
|
-
if (onConsentChange) {
|
|
3128
|
-
onConsentChange(cookiesNowAccepted);
|
|
3129
|
-
}
|
|
3130
|
-
setShowBanner(false);
|
|
3131
|
-
}, [areCookiesAccepted, onConsentChange]);
|
|
3132
|
-
useEffect13(() => {
|
|
3133
|
-
const cookiesAccepted = areCookiesAccepted();
|
|
3134
|
-
const choiceMade = hasChoiceBeenMade();
|
|
3135
|
-
setShowBanner(!cookiesAccepted && !choiceMade);
|
|
3136
|
-
if (cookiesAccepted && onConsentChange) {
|
|
3137
|
-
onConsentChange(true);
|
|
3138
|
-
}
|
|
3139
|
-
const handleShowBannerEvent = () => {
|
|
3140
|
-
clearChoiceFromSession();
|
|
3141
|
-
setShowBanner(true);
|
|
3142
|
-
};
|
|
3143
|
-
window.addEventListener("showCookieBanner", handleShowBannerEvent);
|
|
3144
|
-
return () => {
|
|
3145
|
-
window.removeEventListener("showCookieBanner", handleShowBannerEvent);
|
|
3146
|
-
};
|
|
3147
|
-
}, [areCookiesAccepted, hasChoiceBeenMade, clearChoiceFromSession, onConsentChange]);
|
|
3148
|
-
return {
|
|
3149
|
-
showBanner,
|
|
3150
|
-
handleCookieStateChange,
|
|
3151
|
-
acceptCookies,
|
|
3152
|
-
rejectCookies
|
|
3153
|
-
};
|
|
3154
|
-
};
|
|
3155
|
-
|
|
3156
3158
|
// src/components/question-rendering/QuestionRenderer/QuestionRenderer.tsx
|
|
3157
3159
|
import { Fragment as Fragment17, jsx as jsx24, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
3158
3160
|
var QuestionRenderer = ({
|
|
@@ -3958,10 +3960,10 @@ var Header = ({
|
|
|
3958
3960
|
var HeaderStandard_default = Header;
|
|
3959
3961
|
|
|
3960
3962
|
// src/components/layout/NavigationHeaderStandard/NavigationHeaderStandard.tsx
|
|
3961
|
-
import { useRef as
|
|
3963
|
+
import { useRef as useRef4, useState as useState13 } from "react";
|
|
3962
3964
|
|
|
3963
3965
|
// src/components/layout/NavigationStandard/NavigationStandard.tsx
|
|
3964
|
-
import { useEffect as useEffect15, useState as useState11, useRef as
|
|
3966
|
+
import { useEffect as useEffect15, useState as useState11, useRef as useRef3 } from "react";
|
|
3965
3967
|
import { Fragment as Fragment20, jsx as jsx30, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
3966
3968
|
var Navigation = ({
|
|
3967
3969
|
setIsMenyOpen,
|
|
@@ -3974,8 +3976,8 @@ var Navigation = ({
|
|
|
3974
3976
|
activePath = null
|
|
3975
3977
|
}) => {
|
|
3976
3978
|
const closeMenuText = activatedLanguage === "sv" ? "St\xE4ng meny" : "Close menu";
|
|
3977
|
-
const navRef =
|
|
3978
|
-
const firstVisitRef =
|
|
3979
|
+
const navRef = useRef3(null);
|
|
3980
|
+
const firstVisitRef = useRef3(true);
|
|
3979
3981
|
const [openSubMenu, setOpenSubMenu] = useState11(null);
|
|
3980
3982
|
const handleSubMenu = (label) => {
|
|
3981
3983
|
setOpenSubMenu(openSubMenu === label ? null : label);
|
|
@@ -4216,7 +4218,7 @@ var NavigationHeader = ({
|
|
|
4216
4218
|
else return "Svenska";
|
|
4217
4219
|
};
|
|
4218
4220
|
const [isMenuOpen, setIsMenuOpen] = useState13(false);
|
|
4219
|
-
const menuButtonFocusRef =
|
|
4221
|
+
const menuButtonFocusRef = useRef4(null);
|
|
4220
4222
|
const handleMenuClick = () => {
|
|
4221
4223
|
setIsMenuOpen((prev) => !prev);
|
|
4222
4224
|
};
|
|
@@ -4596,14 +4598,14 @@ var StepperButtons = ({
|
|
|
4596
4598
|
var StepperButtonsStandard_default = StepperButtons;
|
|
4597
4599
|
|
|
4598
4600
|
// src/components/stepper/StepperStandard/StepperStandard.tsx
|
|
4599
|
-
import
|
|
4601
|
+
import React12 from "react";
|
|
4600
4602
|
import { jsx as jsx42, jsxs as jsxs34 } from "react/jsx-runtime";
|
|
4601
4603
|
var Stepper = ({ arraySteps = [], activeStep = 1 }) => {
|
|
4602
4604
|
return /* @__PURE__ */ jsx42("div", { className: "pts-stepper-container", "aria-hidden": "true", children: arraySteps.map((step, index) => {
|
|
4603
4605
|
const isActive = step.step === activeStep;
|
|
4604
4606
|
const lastElement = arraySteps.length;
|
|
4605
4607
|
const isDone = step.step < activeStep;
|
|
4606
|
-
return /* @__PURE__ */ jsxs34(
|
|
4608
|
+
return /* @__PURE__ */ jsxs34(React12.Fragment, { children: [
|
|
4607
4609
|
/* @__PURE__ */ jsxs34("div", { className: "pts-stepper-step", children: [
|
|
4608
4610
|
/* @__PURE__ */ jsx42(
|
|
4609
4611
|
"div",
|