@redacto.io/consent-sdk-react 10.4.0-beta.1 → 11.0.0-beta.3
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/README.md +98 -30
- package/dist/{chunk-DGMUTOWJ.mjs → chunk-W45JQYDG.mjs} +65 -1
- package/dist/index.d.mts +39 -5
- package/dist/index.d.ts +39 -5
- package/dist/index.js +418 -293
- package/dist/index.mjs +77 -14
- package/dist/privacy-center.d.mts +67 -22
- package/dist/privacy-center.d.ts +67 -22
- package/dist/privacy-center.js +726 -701
- package/dist/privacy-center.mjs +175 -211
- package/dist/{types-Bwtzvz4W.d.mts → types-B8qroG0j.d.mts} +2 -0
- package/dist/{types-Bwtzvz4W.d.ts → types-B8qroG0j.d.ts} +2 -0
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -3,8 +3,13 @@ var __defProp = Object.defineProperty;
|
|
|
3
3
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
4
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
5
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
-
var __esm = (fn, res) => function __init() {
|
|
7
|
-
|
|
6
|
+
var __esm = (fn, res, err) => function __init() {
|
|
7
|
+
if (err) throw err[0];
|
|
8
|
+
try {
|
|
9
|
+
return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
|
|
10
|
+
} catch (e) {
|
|
11
|
+
throw err = [e], e;
|
|
12
|
+
}
|
|
8
13
|
};
|
|
9
14
|
var __export = (target, all) => {
|
|
10
15
|
for (var name in all)
|
|
@@ -88,7 +93,7 @@ __export(src_exports, {
|
|
|
88
93
|
module.exports = __toCommonJS(src_exports);
|
|
89
94
|
|
|
90
95
|
// src/RedactoNoticeConsent/RedactoNoticeConsent.tsx
|
|
91
|
-
var
|
|
96
|
+
var import_react9 = require("react");
|
|
92
97
|
|
|
93
98
|
// src/RedactoNoticeConsent/api/index.ts
|
|
94
99
|
var import_jwt_decode2 = require("jwt-decode");
|
|
@@ -5078,6 +5083,65 @@ var updateConsentState = (updates) => {
|
|
|
5078
5083
|
}
|
|
5079
5084
|
};
|
|
5080
5085
|
|
|
5086
|
+
// src/shared/useResolvedEndpoints.ts
|
|
5087
|
+
var import_react8 = require("react");
|
|
5088
|
+
|
|
5089
|
+
// src/shared/endpoints.ts
|
|
5090
|
+
var CONSENT_PATH = "/consent";
|
|
5091
|
+
var LEDGER_PATH = "/consent-ledger";
|
|
5092
|
+
var ABSOLUTE_HTTP_URL = /^https?:\/\/(?:\[[0-9a-f:.]+\]|[^\s/?#@:[\]]+)(?::\d+)?(?:\/[^\s?#]*)?$/i;
|
|
5093
|
+
var trimUrl = (value) => (value != null ? value : "").trim().replace(/\/+$/, "");
|
|
5094
|
+
var isConsentServerUrl = (trimmed) => ABSOLUTE_HTTP_URL.test(trimmed) && trimmed.endsWith(CONSENT_PATH);
|
|
5095
|
+
var isHostForm = (trimmed) => ABSOLUTE_HTTP_URL.test(trimmed) && !trimmed.endsWith(CONSENT_PATH);
|
|
5096
|
+
function resolveEndpoints(baseUrl, ledgerBaseUrl) {
|
|
5097
|
+
const trimmed = trimUrl(baseUrl);
|
|
5098
|
+
if (!isHostForm(trimmed)) {
|
|
5099
|
+
return { mode: "legacy", apiHost: void 0, baseUrl, ledgerBaseUrl };
|
|
5100
|
+
}
|
|
5101
|
+
const apiHost = trimmed.endsWith(LEDGER_PATH) ? trimmed.slice(0, -LEDGER_PATH.length) : trimmed;
|
|
5102
|
+
return {
|
|
5103
|
+
mode: "host",
|
|
5104
|
+
apiHost,
|
|
5105
|
+
baseUrl: `${apiHost}${CONSENT_PATH}`,
|
|
5106
|
+
ledgerBaseUrl: `${apiHost}${LEDGER_PATH}`
|
|
5107
|
+
};
|
|
5108
|
+
}
|
|
5109
|
+
var ENDPOINT_WARNINGS = {
|
|
5110
|
+
missingBaseUrl: "[Redacto] baseUrl is not set, so the SDK's built-in production default is used. Pass baseUrl: your API host.",
|
|
5111
|
+
consentServerBaseUrl: "[Redacto] baseUrl is the consent server URL (ending in /consent), which is deprecated. Pass the API host instead; the SDK derives the consent server and ledger URLs from it.",
|
|
5112
|
+
ledgerBaseUrl: "[Redacto] ledgerBaseUrl is deprecated. Pass the Redacto API host as baseUrl instead; the SDK then reaches the consent server and the ledger under it.",
|
|
5113
|
+
ledgerBaseUrlIgnored: "[Redacto] ledgerBaseUrl is ignored because baseUrl is the API host; the SDK reaches the ledger under that host. Remove ledgerBaseUrl.",
|
|
5114
|
+
slugIgnored: "[Redacto] slug is deprecated and ignored. The Privacy Center reads the organisation from the access token, or from organisationUuid and workspaceUuid. Remove slug."
|
|
5115
|
+
};
|
|
5116
|
+
var issuedWarnings = /* @__PURE__ */ new Set();
|
|
5117
|
+
var warnOnce = (warning) => {
|
|
5118
|
+
if (issuedWarnings.has(warning)) {
|
|
5119
|
+
return;
|
|
5120
|
+
}
|
|
5121
|
+
issuedWarnings.add(warning);
|
|
5122
|
+
console.warn(ENDPOINT_WARNINGS[warning]);
|
|
5123
|
+
};
|
|
5124
|
+
var warnEndpointUsage = (baseUrl, ledgerBaseUrl, { hasBuiltInDefault }) => {
|
|
5125
|
+
if (!baseUrl) {
|
|
5126
|
+
if (hasBuiltInDefault) {
|
|
5127
|
+
warnOnce("missingBaseUrl");
|
|
5128
|
+
}
|
|
5129
|
+
} else if (isConsentServerUrl(trimUrl(baseUrl))) {
|
|
5130
|
+
warnOnce("consentServerBaseUrl");
|
|
5131
|
+
}
|
|
5132
|
+
if (trimUrl(ledgerBaseUrl)) {
|
|
5133
|
+
warnOnce(isHostForm(trimUrl(baseUrl)) ? "ledgerBaseUrlIgnored" : "ledgerBaseUrl");
|
|
5134
|
+
}
|
|
5135
|
+
};
|
|
5136
|
+
|
|
5137
|
+
// src/shared/useResolvedEndpoints.ts
|
|
5138
|
+
var useResolvedEndpoints = (baseUrl, ledgerBaseUrl, { warn = true, hasBuiltInDefault = true } = {}) => (0, import_react8.useMemo)(() => {
|
|
5139
|
+
if (warn) {
|
|
5140
|
+
warnEndpointUsage(baseUrl, ledgerBaseUrl, { hasBuiltInDefault });
|
|
5141
|
+
}
|
|
5142
|
+
return resolveEndpoints(baseUrl, ledgerBaseUrl);
|
|
5143
|
+
}, [baseUrl, ledgerBaseUrl, warn, hasBuiltInDefault]);
|
|
5144
|
+
|
|
5081
5145
|
// src/RedactoNoticeConsent/RedactoNoticeConsent.tsx
|
|
5082
5146
|
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
5083
5147
|
var DEFAULT_HEADING_COLOR = "#323B4B";
|
|
@@ -5233,7 +5297,7 @@ var PurposeItem = ({
|
|
|
5233
5297
|
}) => {
|
|
5234
5298
|
var _a, _b;
|
|
5235
5299
|
const stateKey = productPurposeKey(productUuid, purpose.uuid);
|
|
5236
|
-
const handlePurposeToggle = (0,
|
|
5300
|
+
const handlePurposeToggle = (0, import_react9.useCallback)(
|
|
5237
5301
|
() => onPurposeToggle(purpose.uuid, productUuid),
|
|
5238
5302
|
[onPurposeToggle, purpose.uuid, productUuid]
|
|
5239
5303
|
);
|
|
@@ -5242,13 +5306,13 @@ var PurposeItem = ({
|
|
|
5242
5306
|
purpose.name,
|
|
5243
5307
|
purpose.uuid
|
|
5244
5308
|
)}`;
|
|
5245
|
-
const headingStyle = (0,
|
|
5309
|
+
const headingStyle = (0, import_react9.useMemo)(
|
|
5246
5310
|
() => ({
|
|
5247
5311
|
color: (settings == null ? void 0 : settings.headingColor) || DEFAULT_HEADING_COLOR
|
|
5248
5312
|
}),
|
|
5249
5313
|
[settings == null ? void 0 : settings.headingColor]
|
|
5250
5314
|
);
|
|
5251
|
-
const textStyle = (0,
|
|
5315
|
+
const textStyle = (0, import_react9.useMemo)(
|
|
5252
5316
|
() => ({
|
|
5253
5317
|
color: (settings == null ? void 0 : settings.textColor) || "#344054"
|
|
5254
5318
|
}),
|
|
@@ -5494,12 +5558,12 @@ var GuardianForm = ({
|
|
|
5494
5558
|
logoUrl
|
|
5495
5559
|
}) => {
|
|
5496
5560
|
var _a, _b, _c, _d, _e;
|
|
5497
|
-
const [isDropdownOpen, setIsDropdownOpen] = (0,
|
|
5498
|
-
const [focusedIndex, setFocusedIndex] = (0,
|
|
5499
|
-
const [openUpward, setOpenUpward] = (0,
|
|
5500
|
-
const dropdownRef = (0,
|
|
5501
|
-
const optionsRef = (0,
|
|
5502
|
-
(0,
|
|
5561
|
+
const [isDropdownOpen, setIsDropdownOpen] = (0, import_react9.useState)(false);
|
|
5562
|
+
const [focusedIndex, setFocusedIndex] = (0, import_react9.useState)(-1);
|
|
5563
|
+
const [openUpward, setOpenUpward] = (0, import_react9.useState)(false);
|
|
5564
|
+
const dropdownRef = (0, import_react9.useRef)(null);
|
|
5565
|
+
const optionsRef = (0, import_react9.useRef)(null);
|
|
5566
|
+
(0, import_react9.useEffect)(() => {
|
|
5503
5567
|
if (!isDropdownOpen) return;
|
|
5504
5568
|
const handleClickOutside = (e) => {
|
|
5505
5569
|
if (dropdownRef.current && !dropdownRef.current.contains(e.target)) {
|
|
@@ -5510,7 +5574,7 @@ var GuardianForm = ({
|
|
|
5510
5574
|
document.addEventListener("mousedown", handleClickOutside);
|
|
5511
5575
|
return () => document.removeEventListener("mousedown", handleClickOutside);
|
|
5512
5576
|
}, [isDropdownOpen]);
|
|
5513
|
-
(0,
|
|
5577
|
+
(0, import_react9.useEffect)(() => {
|
|
5514
5578
|
if (!isDropdownOpen || !dropdownRef.current) return;
|
|
5515
5579
|
const rect = dropdownRef.current.getBoundingClientRect();
|
|
5516
5580
|
const spaceBelow = window.innerHeight - rect.bottom;
|
|
@@ -5555,7 +5619,7 @@ var GuardianForm = ({
|
|
|
5555
5619
|
break;
|
|
5556
5620
|
}
|
|
5557
5621
|
};
|
|
5558
|
-
(0,
|
|
5622
|
+
(0, import_react9.useEffect)(() => {
|
|
5559
5623
|
var _a2;
|
|
5560
5624
|
if (focusedIndex >= 0 && optionsRef.current) {
|
|
5561
5625
|
const option = optionsRef.current.children[focusedIndex];
|
|
@@ -6364,8 +6428,8 @@ var NoticeConsentView = ({
|
|
|
6364
6428
|
ucic,
|
|
6365
6429
|
organisationUuid,
|
|
6366
6430
|
workspaceUuid,
|
|
6367
|
-
baseUrl,
|
|
6368
|
-
ledgerBaseUrl,
|
|
6431
|
+
baseUrl: baseUrlProp,
|
|
6432
|
+
ledgerBaseUrl: ledgerBaseUrlProp,
|
|
6369
6433
|
language = "en",
|
|
6370
6434
|
blockUI = true,
|
|
6371
6435
|
onAccept,
|
|
@@ -6387,7 +6451,11 @@ var NoticeConsentView = ({
|
|
|
6387
6451
|
forceColorScheme
|
|
6388
6452
|
}) => {
|
|
6389
6453
|
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K, _L;
|
|
6390
|
-
const
|
|
6454
|
+
const endpoints = useResolvedEndpoints(baseUrlProp, ledgerBaseUrlProp, {
|
|
6455
|
+
warn: !previewContent
|
|
6456
|
+
});
|
|
6457
|
+
const { baseUrl, ledgerBaseUrl } = endpoints;
|
|
6458
|
+
const sandboxParams = (0, import_react9.useMemo)(
|
|
6391
6459
|
() => ({
|
|
6392
6460
|
token,
|
|
6393
6461
|
sandboxUcic: ucic,
|
|
@@ -6398,7 +6466,7 @@ var NoticeConsentView = ({
|
|
|
6398
6466
|
}),
|
|
6399
6467
|
[token, ucic, email, mobile, organisationUuid, workspaceUuid]
|
|
6400
6468
|
);
|
|
6401
|
-
const propValidationError = (0,
|
|
6469
|
+
const propValidationError = (0, import_react9.useMemo)(() => {
|
|
6402
6470
|
if (previewContent) {
|
|
6403
6471
|
return null;
|
|
6404
6472
|
}
|
|
@@ -6448,116 +6516,117 @@ var NoticeConsentView = ({
|
|
|
6448
6516
|
}
|
|
6449
6517
|
);
|
|
6450
6518
|
}
|
|
6451
|
-
const [isLoading, setIsLoading] = (0,
|
|
6452
|
-
const [isSubmitting, setIsSubmitting] = (0,
|
|
6453
|
-
const [isSubmittingAccept, setIsSubmittingAccept] = (0,
|
|
6454
|
-
const [isSubmittingDecline, setIsSubmittingDecline] = (0,
|
|
6455
|
-
const [content, setContent] = (0,
|
|
6456
|
-
const [cachedAppearance, setCachedAppearance] = (0,
|
|
6519
|
+
const [isLoading, setIsLoading] = (0, import_react9.useState)(true);
|
|
6520
|
+
const [isSubmitting, setIsSubmitting] = (0, import_react9.useState)(false);
|
|
6521
|
+
const [isSubmittingAccept, setIsSubmittingAccept] = (0, import_react9.useState)(false);
|
|
6522
|
+
const [isSubmittingDecline, setIsSubmittingDecline] = (0, import_react9.useState)(false);
|
|
6523
|
+
const [content, setContent] = (0, import_react9.useState)(null);
|
|
6524
|
+
const [cachedAppearance, setCachedAppearance] = (0, import_react9.useState)(void 0);
|
|
6457
6525
|
useIsomorphicLayoutEffect(() => {
|
|
6458
6526
|
setCachedAppearance(readCachedAppearance(noticeId));
|
|
6459
6527
|
}, [noticeId]);
|
|
6460
6528
|
const servedAppearance = content ? content.appearance : cachedAppearance;
|
|
6529
|
+
const showsProductSection = (servedAppearance == null ? void 0 : servedAppearance.show_product_section) !== false;
|
|
6461
6530
|
const noticeAppearance = useNoticeAppearance(
|
|
6462
6531
|
servedAppearance,
|
|
6463
6532
|
settings,
|
|
6464
6533
|
forceColorScheme
|
|
6465
6534
|
);
|
|
6466
|
-
(0,
|
|
6535
|
+
(0, import_react9.useEffect)(() => {
|
|
6467
6536
|
if (content && !previewContent) {
|
|
6468
6537
|
writeCachedAppearance(content.notice_uuid, content.appearance);
|
|
6469
6538
|
}
|
|
6470
6539
|
}, [content, previewContent]);
|
|
6471
|
-
const noticeSettings = (0,
|
|
6540
|
+
const noticeSettings = (0, import_react9.useMemo)(
|
|
6472
6541
|
() => toNoticeStyleSettings(noticeAppearance),
|
|
6473
6542
|
[noticeAppearance]
|
|
6474
6543
|
);
|
|
6475
|
-
const [categorizedPurposes, setCategorizedPurposes] = (0,
|
|
6476
|
-
const [selectedPurposes, setSelectedPurposes] = (0,
|
|
6477
|
-
const [selectedDataElements, setSelectedDataElements] = (0,
|
|
6478
|
-
const [initialDataElementSelections, setInitialDataElementSelections] = (0,
|
|
6479
|
-
const [recordedPurposeSelections, setRecordedPurposeSelections] = (0,
|
|
6480
|
-
const [recordedAnswers, setRecordedAnswers] = (0,
|
|
6481
|
-
const [collapsedProducts, setCollapsedProducts] = (0,
|
|
6482
|
-
const [pendingAction, setPendingAction] = (0,
|
|
6483
|
-
const pendingActionRef = (0,
|
|
6544
|
+
const [categorizedPurposes, setCategorizedPurposes] = (0, import_react9.useState)(null);
|
|
6545
|
+
const [selectedPurposes, setSelectedPurposes] = (0, import_react9.useState)({});
|
|
6546
|
+
const [selectedDataElements, setSelectedDataElements] = (0, import_react9.useState)({});
|
|
6547
|
+
const [initialDataElementSelections, setInitialDataElementSelections] = (0, import_react9.useState)({});
|
|
6548
|
+
const [recordedPurposeSelections, setRecordedPurposeSelections] = (0, import_react9.useState)({});
|
|
6549
|
+
const [recordedAnswers, setRecordedAnswers] = (0, import_react9.useState)({});
|
|
6550
|
+
const [collapsedProducts, setCollapsedProducts] = (0, import_react9.useState)({});
|
|
6551
|
+
const [pendingAction, setPendingAction] = (0, import_react9.useState)(null);
|
|
6552
|
+
const pendingActionRef = (0, import_react9.useRef)(null);
|
|
6484
6553
|
pendingActionRef.current = pendingAction;
|
|
6485
|
-
const [confirmAction, setConfirmAction] = (0,
|
|
6486
|
-
const [collapsedPurposes, setCollapsedPurposes] = (0,
|
|
6487
|
-
const [hasAlreadyConsented, setHasAlreadyConsented] = (0,
|
|
6488
|
-
const [consentedProducts, setConsentedProducts] = (0,
|
|
6489
|
-
const [consentedPurposes, setConsentedPurposes] = (0,
|
|
6490
|
-
const [isFullyConsentedReviewMode, setIsFullyConsentedReviewMode] = (0,
|
|
6491
|
-
const [isLanguageDropdownOpen, setIsLanguageDropdownOpen] = (0,
|
|
6492
|
-
const [selectedLanguage, setSelectedLanguage] = (0,
|
|
6493
|
-
const chrome = (0,
|
|
6554
|
+
const [confirmAction, setConfirmAction] = (0, import_react9.useState)("accept-selected");
|
|
6555
|
+
const [collapsedPurposes, setCollapsedPurposes] = (0, import_react9.useState)({});
|
|
6556
|
+
const [hasAlreadyConsented, setHasAlreadyConsented] = (0, import_react9.useState)(false);
|
|
6557
|
+
const [consentedProducts, setConsentedProducts] = (0, import_react9.useState)({});
|
|
6558
|
+
const [consentedPurposes, setConsentedPurposes] = (0, import_react9.useState)({});
|
|
6559
|
+
const [isFullyConsentedReviewMode, setIsFullyConsentedReviewMode] = (0, import_react9.useState)(false);
|
|
6560
|
+
const [isLanguageDropdownOpen, setIsLanguageDropdownOpen] = (0, import_react9.useState)(false);
|
|
6561
|
+
const [selectedLanguage, setSelectedLanguage] = (0, import_react9.useState)(language);
|
|
6562
|
+
const chrome = (0, import_react9.useMemo)(
|
|
6494
6563
|
() => noticeChromeCopy(selectedLanguage),
|
|
6495
6564
|
[selectedLanguage]
|
|
6496
6565
|
);
|
|
6497
|
-
const [errorMessage, setErrorMessage] = (0,
|
|
6498
|
-
const [fetchError, setFetchError] = (0,
|
|
6499
|
-
const [ttsAudioUrls, setTtsAudioUrls] = (0,
|
|
6500
|
-
const [isTTSAvailable, setIsTTSAvailable] = (0,
|
|
6501
|
-
const [isPlaying, setIsPlaying] = (0,
|
|
6502
|
-
const [isPaused, setIsPaused] = (0,
|
|
6503
|
-
const [currentAudioIndex, setCurrentAudioIndex] = (0,
|
|
6504
|
-
const [highlightedElementId, setHighlightedElementId] = (0,
|
|
6505
|
-
const [showAgeVerification, setShowAgeVerification] = (0,
|
|
6506
|
-
const [isMinorFlow, setIsMinorFlow] = (0,
|
|
6507
|
-
const [selfDeclaredAdult, setSelfDeclaredAdult] = (0,
|
|
6508
|
-
const [showGuardianForm, setShowGuardianForm] = (0,
|
|
6509
|
-
const [isSubmittingGuardian, setIsSubmittingGuardian] = (0,
|
|
6510
|
-
const [otpPendingMode, setOtpPendingMode] = (0,
|
|
6511
|
-
const preGateSelectionRef = (0,
|
|
6512
|
-
const otpVerifiedRef = (0,
|
|
6513
|
-
const otpTokenAtVerifyRef = (0,
|
|
6514
|
-
const [otpAcceptAfterToken, setOtpAcceptAfterToken] = (0,
|
|
6515
|
-
const [otpCode, setOtpCode] = (0,
|
|
6516
|
-
const [otpError, setOtpError] = (0,
|
|
6517
|
-
const [otpBusy, setOtpBusy] = (0,
|
|
6566
|
+
const [errorMessage, setErrorMessage] = (0, import_react9.useState)(null);
|
|
6567
|
+
const [fetchError, setFetchError] = (0, import_react9.useState)(null);
|
|
6568
|
+
const [ttsAudioUrls, setTtsAudioUrls] = (0, import_react9.useState)(null);
|
|
6569
|
+
const [isTTSAvailable, setIsTTSAvailable] = (0, import_react9.useState)(false);
|
|
6570
|
+
const [isPlaying, setIsPlaying] = (0, import_react9.useState)(false);
|
|
6571
|
+
const [isPaused, setIsPaused] = (0, import_react9.useState)(false);
|
|
6572
|
+
const [currentAudioIndex, setCurrentAudioIndex] = (0, import_react9.useState)(0);
|
|
6573
|
+
const [highlightedElementId, setHighlightedElementId] = (0, import_react9.useState)(null);
|
|
6574
|
+
const [showAgeVerification, setShowAgeVerification] = (0, import_react9.useState)(false);
|
|
6575
|
+
const [isMinorFlow, setIsMinorFlow] = (0, import_react9.useState)(false);
|
|
6576
|
+
const [selfDeclaredAdult, setSelfDeclaredAdult] = (0, import_react9.useState)(false);
|
|
6577
|
+
const [showGuardianForm, setShowGuardianForm] = (0, import_react9.useState)(false);
|
|
6578
|
+
const [isSubmittingGuardian, setIsSubmittingGuardian] = (0, import_react9.useState)(false);
|
|
6579
|
+
const [otpPendingMode, setOtpPendingMode] = (0, import_react9.useState)(null);
|
|
6580
|
+
const preGateSelectionRef = (0, import_react9.useRef)(null);
|
|
6581
|
+
const otpVerifiedRef = (0, import_react9.useRef)(false);
|
|
6582
|
+
const otpTokenAtVerifyRef = (0, import_react9.useRef)(void 0);
|
|
6583
|
+
const [otpAcceptAfterToken, setOtpAcceptAfterToken] = (0, import_react9.useState)(null);
|
|
6584
|
+
const [otpCode, setOtpCode] = (0, import_react9.useState)("");
|
|
6585
|
+
const [otpError, setOtpError] = (0, import_react9.useState)(null);
|
|
6586
|
+
const [otpBusy, setOtpBusy] = (0, import_react9.useState)(false);
|
|
6518
6587
|
const otpLocked = otpPendingMode !== null;
|
|
6519
6588
|
const focusOtpDigit = (index) => {
|
|
6520
6589
|
var _a2;
|
|
6521
6590
|
if (index < 0 || index >= OTP_GATE_LENGTH) return;
|
|
6522
6591
|
(_a2 = document.getElementById(`notice-otp-digit-${index}`)) == null ? void 0 : _a2.focus();
|
|
6523
6592
|
};
|
|
6524
|
-
const [guardianFormData, setGuardianFormData] = (0,
|
|
6593
|
+
const [guardianFormData, setGuardianFormData] = (0, import_react9.useState)({
|
|
6525
6594
|
guardianName: "",
|
|
6526
6595
|
guardianContact: "",
|
|
6527
6596
|
guardianRelationship: ""
|
|
6528
6597
|
});
|
|
6529
|
-
const [guardianFormErrors, setGuardianFormErrors] = (0,
|
|
6530
|
-
const [showVerificationScreen, setShowVerificationScreen] = (0,
|
|
6531
|
-
const [verificationReference, setVerificationReference] = (0,
|
|
6532
|
-
const [isInitiatingVerification, setIsInitiatingVerification] = (0,
|
|
6533
|
-
const [verificationError, setVerificationError] = (0,
|
|
6598
|
+
const [guardianFormErrors, setGuardianFormErrors] = (0, import_react9.useState)({});
|
|
6599
|
+
const [showVerificationScreen, setShowVerificationScreen] = (0, import_react9.useState)(false);
|
|
6600
|
+
const [verificationReference, setVerificationReference] = (0, import_react9.useState)(null);
|
|
6601
|
+
const [isInitiatingVerification, setIsInitiatingVerification] = (0, import_react9.useState)(false);
|
|
6602
|
+
const [verificationError, setVerificationError] = (0, import_react9.useState)(
|
|
6534
6603
|
null
|
|
6535
6604
|
);
|
|
6536
|
-
const [verificationErrorCode, setVerificationErrorCode] = (0,
|
|
6537
|
-
const [canRetryVerification, setCanRetryVerification] = (0,
|
|
6538
|
-
const [isPollingStatus, setIsPollingStatus] = (0,
|
|
6539
|
-
const [isVerificationComplete, setIsVerificationComplete] = (0,
|
|
6540
|
-
const [isAutoTransitioning, setIsAutoTransitioning] = (0,
|
|
6541
|
-
const modalRef = (0,
|
|
6542
|
-
const firstFocusableRef = (0,
|
|
6543
|
-
const lastFocusableRef = (0,
|
|
6544
|
-
const abortControllerRef = (0,
|
|
6545
|
-
const isRequestInProgressRef = (0,
|
|
6546
|
-
const currentAudioRef = (0,
|
|
6547
|
-
const popupCheckIntervalRef = (0,
|
|
6548
|
-
const statusPollIntervalRef = (0,
|
|
6549
|
-
const verificationPopupRef = (0,
|
|
6550
|
-
const pollingCleanupRef = (0,
|
|
6551
|
-
const autoTransitionTimerRef = (0,
|
|
6605
|
+
const [verificationErrorCode, setVerificationErrorCode] = (0, import_react9.useState)(null);
|
|
6606
|
+
const [canRetryVerification, setCanRetryVerification] = (0, import_react9.useState)(false);
|
|
6607
|
+
const [isPollingStatus, setIsPollingStatus] = (0, import_react9.useState)(false);
|
|
6608
|
+
const [isVerificationComplete, setIsVerificationComplete] = (0, import_react9.useState)(false);
|
|
6609
|
+
const [isAutoTransitioning, setIsAutoTransitioning] = (0, import_react9.useState)(false);
|
|
6610
|
+
const modalRef = (0, import_react9.useRef)(null);
|
|
6611
|
+
const firstFocusableRef = (0, import_react9.useRef)(null);
|
|
6612
|
+
const lastFocusableRef = (0, import_react9.useRef)(null);
|
|
6613
|
+
const abortControllerRef = (0, import_react9.useRef)(null);
|
|
6614
|
+
const isRequestInProgressRef = (0, import_react9.useRef)(false);
|
|
6615
|
+
const currentAudioRef = (0, import_react9.useRef)(null);
|
|
6616
|
+
const popupCheckIntervalRef = (0, import_react9.useRef)(null);
|
|
6617
|
+
const statusPollIntervalRef = (0, import_react9.useRef)(null);
|
|
6618
|
+
const verificationPopupRef = (0, import_react9.useRef)(null);
|
|
6619
|
+
const pollingCleanupRef = (0, import_react9.useRef)(null);
|
|
6620
|
+
const autoTransitionTimerRef = (0, import_react9.useRef)(
|
|
6552
6621
|
null
|
|
6553
6622
|
);
|
|
6554
|
-
const digilockerRedirectTimeoutRef = (0,
|
|
6555
|
-
const isInitialMountRef = (0,
|
|
6556
|
-
const isPollingStatusRef = (0,
|
|
6557
|
-
const verificationSessionTokenRef = (0,
|
|
6623
|
+
const digilockerRedirectTimeoutRef = (0, import_react9.useRef)(null);
|
|
6624
|
+
const isInitialMountRef = (0, import_react9.useRef)(true);
|
|
6625
|
+
const isPollingStatusRef = (0, import_react9.useRef)(false);
|
|
6626
|
+
const verificationSessionTokenRef = (0, import_react9.useRef)(null);
|
|
6558
6627
|
const isNarrowViewport = useMediaQuery("(max-width: 768px)");
|
|
6559
6628
|
const isMobile = forceMobile != null ? forceMobile : isNarrowViewport;
|
|
6560
|
-
const baseResponsiveStyles = (0,
|
|
6629
|
+
const baseResponsiveStyles = (0, import_react9.useMemo)(
|
|
6561
6630
|
() => ({
|
|
6562
6631
|
modal: {
|
|
6563
6632
|
width: isMobile ? "90%" : "700px"
|
|
@@ -6638,7 +6707,7 @@ var NoticeConsentView = ({
|
|
|
6638
6707
|
);
|
|
6639
6708
|
const appearance = noticeAppearance.style;
|
|
6640
6709
|
const appearanceColors = noticeAppearance.colors;
|
|
6641
|
-
const layout = (0,
|
|
6710
|
+
const layout = (0, import_react9.useMemo)(
|
|
6642
6711
|
() => resolveNoticeLayout(noticeAppearance),
|
|
6643
6712
|
[noticeAppearance]
|
|
6644
6713
|
);
|
|
@@ -6648,7 +6717,7 @@ var NoticeConsentView = ({
|
|
|
6648
6717
|
const textColor = (noticeSettings == null ? void 0 : noticeSettings.textColor) || DEFAULT_TEXT_COLOR;
|
|
6649
6718
|
const classicAccentColor = ((_b = (_a = noticeSettings == null ? void 0 : noticeSettings.button) == null ? void 0 : _a.accept) == null ? void 0 : _b.backgroundColor) || (content == null ? void 0 : content.primary_color) || (content ? DEFAULT_ACCENT_COLOR : headingColor);
|
|
6650
6719
|
const accentColor = (_e = appearanceColors.toggle_on) != null ? _e : hasNoticeSkin(appearance) ? ((_d = (_c = noticeSettings == null ? void 0 : noticeSettings.button) == null ? void 0 : _c.acceptAll) == null ? void 0 : _d.backgroundColor) || classicAccentColor : classicAccentColor;
|
|
6651
|
-
const variantStyles = (0,
|
|
6720
|
+
const variantStyles = (0, import_react9.useMemo)(
|
|
6652
6721
|
() => buildVariantStyles(
|
|
6653
6722
|
styles,
|
|
6654
6723
|
appearance,
|
|
@@ -6657,7 +6726,7 @@ var NoticeConsentView = ({
|
|
|
6657
6726
|
),
|
|
6658
6727
|
[appearance, appearanceColors, accentColor]
|
|
6659
6728
|
);
|
|
6660
|
-
const skin = (0,
|
|
6729
|
+
const skin = (0, import_react9.useMemo)(
|
|
6661
6730
|
() => {
|
|
6662
6731
|
var _a2;
|
|
6663
6732
|
return buildNoticeSkin(appearance, variantStyles, {
|
|
@@ -6682,26 +6751,26 @@ var NoticeConsentView = ({
|
|
|
6682
6751
|
]
|
|
6683
6752
|
);
|
|
6684
6753
|
const textScale = NOTICE_TEXT_SCALE_FACTORS[(_f = noticeAppearance.textScale) != null ? _f : DEFAULT_TEXT_SCALE];
|
|
6685
|
-
const styles4 = (0,
|
|
6754
|
+
const styles4 = (0, import_react9.useMemo)(
|
|
6686
6755
|
() => {
|
|
6687
6756
|
var _a2;
|
|
6688
6757
|
return scaleFontSizes((_a2 = skin == null ? void 0 : skin.styles) != null ? _a2 : variantStyles, textScale);
|
|
6689
6758
|
},
|
|
6690
6759
|
[skin, variantStyles, textScale]
|
|
6691
6760
|
);
|
|
6692
|
-
const overlayStyle2 = (0,
|
|
6761
|
+
const overlayStyle2 = (0, import_react9.useMemo)(() => {
|
|
6693
6762
|
if (!layout.dimBackdrop) {
|
|
6694
6763
|
return { ...styles4.overlay, backgroundColor: "transparent" };
|
|
6695
6764
|
}
|
|
6696
6765
|
return appearanceColors.overlay ? { ...styles4.overlay, backgroundColor: appearanceColors.overlay } : styles4.overlay;
|
|
6697
6766
|
}, [styles4.overlay, appearanceColors.overlay, layout.dimBackdrop]);
|
|
6698
6767
|
const styleRadii = STYLE_RADII[appearance];
|
|
6699
|
-
const themeCssVariables = (0,
|
|
6768
|
+
const themeCssVariables = (0, import_react9.useMemo)(
|
|
6700
6769
|
() => buildThemeCssVariables(appearanceColors),
|
|
6701
6770
|
[appearanceColors]
|
|
6702
6771
|
);
|
|
6703
6772
|
const logoSize = noticeAppearance.logoSize;
|
|
6704
|
-
const responsiveStyles = (0,
|
|
6773
|
+
const responsiveStyles = (0, import_react9.useMemo)(() => {
|
|
6705
6774
|
var _a2;
|
|
6706
6775
|
const merged = {
|
|
6707
6776
|
...baseResponsiveStyles
|
|
@@ -6720,7 +6789,7 @@ var NoticeConsentView = ({
|
|
|
6720
6789
|
return scaleFontSizes(merged, textScale);
|
|
6721
6790
|
}, [baseResponsiveStyles, skin, logoSize, textScale]);
|
|
6722
6791
|
const sheetParts = skin == null ? void 0 : skin.parts;
|
|
6723
|
-
const layoutParts = (0,
|
|
6792
|
+
const layoutParts = (0, import_react9.useMemo)(() => {
|
|
6724
6793
|
var _a2;
|
|
6725
6794
|
const parts = (_a2 = skin == null ? void 0 : skin.parts) != null ? _a2 : buildLayoutParts(
|
|
6726
6795
|
solidSurface(appearanceColors, accentColor, STYLE_RADII[appearance]),
|
|
@@ -6763,12 +6832,12 @@ var NoticeConsentView = ({
|
|
|
6763
6832
|
}
|
|
6764
6833
|
}, [appearance, drawsSwitches]);
|
|
6765
6834
|
useNoticeCustomCss(noticeId, noticeAppearance.customCss);
|
|
6766
|
-
const [openSections, setOpenSections] = (0,
|
|
6835
|
+
const [openSections, setOpenSections] = (0, import_react9.useState)({
|
|
6767
6836
|
about: false,
|
|
6768
6837
|
dpo: false
|
|
6769
6838
|
});
|
|
6770
6839
|
const isTalkbackActive = isPlaying || isPaused;
|
|
6771
|
-
const keepFocusedSectionsOpen = (0,
|
|
6840
|
+
const keepFocusedSectionsOpen = (0, import_react9.useCallback)(() => {
|
|
6772
6841
|
if (typeof document === "undefined") {
|
|
6773
6842
|
return;
|
|
6774
6843
|
}
|
|
@@ -6792,25 +6861,25 @@ var NoticeConsentView = ({
|
|
|
6792
6861
|
hostFont: settings == null ? void 0 : settings.font,
|
|
6793
6862
|
noticeFont: content == null ? void 0 : content.font_preference
|
|
6794
6863
|
});
|
|
6795
|
-
const componentHeadingStyle = (0,
|
|
6864
|
+
const componentHeadingStyle = (0, import_react9.useMemo)(
|
|
6796
6865
|
() => ({
|
|
6797
6866
|
color: (noticeSettings == null ? void 0 : noticeSettings.headingColor) || "#323B4B"
|
|
6798
6867
|
}),
|
|
6799
6868
|
[noticeSettings == null ? void 0 : noticeSettings.headingColor]
|
|
6800
6869
|
);
|
|
6801
|
-
const componentTextStyle = (0,
|
|
6870
|
+
const componentTextStyle = (0, import_react9.useMemo)(
|
|
6802
6871
|
() => ({
|
|
6803
6872
|
color: (noticeSettings == null ? void 0 : noticeSettings.textColor) || "#344054"
|
|
6804
6873
|
}),
|
|
6805
6874
|
[noticeSettings == null ? void 0 : noticeSettings.textColor]
|
|
6806
6875
|
);
|
|
6807
|
-
const sectionStyle = (0,
|
|
6876
|
+
const sectionStyle = (0, import_react9.useMemo)(
|
|
6808
6877
|
() => ({
|
|
6809
6878
|
color: (noticeSettings == null ? void 0 : noticeSettings.textColor) || "#344054"
|
|
6810
6879
|
}),
|
|
6811
6880
|
[noticeSettings == null ? void 0 : noticeSettings.textColor]
|
|
6812
6881
|
);
|
|
6813
|
-
const logoRowStyle = (0,
|
|
6882
|
+
const logoRowStyle = (0, import_react9.useMemo)(
|
|
6814
6883
|
() => ({
|
|
6815
6884
|
...styles4.logoRow,
|
|
6816
6885
|
justifyContent: logoRowJustify(
|
|
@@ -6819,7 +6888,7 @@ var NoticeConsentView = ({
|
|
|
6819
6888
|
}),
|
|
6820
6889
|
[styles4, content == null ? void 0 : content.logo_position]
|
|
6821
6890
|
);
|
|
6822
|
-
const purposeRows = (0,
|
|
6891
|
+
const purposeRows = (0, import_react9.useMemo)(
|
|
6823
6892
|
() => {
|
|
6824
6893
|
var _a2;
|
|
6825
6894
|
return noticePurposeRows(
|
|
@@ -6830,7 +6899,7 @@ var NoticeConsentView = ({
|
|
|
6830
6899
|
},
|
|
6831
6900
|
[content]
|
|
6832
6901
|
);
|
|
6833
|
-
const renderedPurposes = (0,
|
|
6902
|
+
const renderedPurposes = (0, import_react9.useMemo)(
|
|
6834
6903
|
() => {
|
|
6835
6904
|
var _a2;
|
|
6836
6905
|
return purposesInRenderOrder(
|
|
@@ -6841,7 +6910,7 @@ var NoticeConsentView = ({
|
|
|
6841
6910
|
},
|
|
6842
6911
|
[content]
|
|
6843
6912
|
);
|
|
6844
|
-
const productGroups = (0,
|
|
6913
|
+
const productGroups = (0, import_react9.useMemo)(
|
|
6845
6914
|
() => {
|
|
6846
6915
|
var _a2;
|
|
6847
6916
|
return groupPurposesByProduct(
|
|
@@ -6852,15 +6921,15 @@ var NoticeConsentView = ({
|
|
|
6852
6921
|
},
|
|
6853
6922
|
[content]
|
|
6854
6923
|
);
|
|
6855
|
-
const productMandatoryIsAuthoritative = (0,
|
|
6924
|
+
const productMandatoryIsAuthoritative = (0, import_react9.useMemo)(
|
|
6856
6925
|
() => serverMarksMandatoryProducts(content == null ? void 0 : content.products),
|
|
6857
6926
|
[content]
|
|
6858
6927
|
);
|
|
6859
|
-
const gatedProducts = (0,
|
|
6928
|
+
const gatedProducts = (0, import_react9.useMemo)(
|
|
6860
6929
|
() => gatedProductUuids(content == null ? void 0 : content.products),
|
|
6861
6930
|
[content]
|
|
6862
6931
|
);
|
|
6863
|
-
const productIsRequiredFor = (0,
|
|
6932
|
+
const productIsRequiredFor = (0, import_react9.useCallback)(
|
|
6864
6933
|
(productUuid) => {
|
|
6865
6934
|
var _a2;
|
|
6866
6935
|
if (!productMandatoryIsAuthoritative) return void 0;
|
|
@@ -6869,7 +6938,7 @@ var NoticeConsentView = ({
|
|
|
6869
6938
|
},
|
|
6870
6939
|
[productMandatoryIsAuthoritative, gatedProducts, content]
|
|
6871
6940
|
);
|
|
6872
|
-
const confirmVerdict = (0,
|
|
6941
|
+
const confirmVerdict = (0, import_react9.useMemo)(() => {
|
|
6873
6942
|
var _a2;
|
|
6874
6943
|
if (!content) return { ok: false, reason: "nothing-chosen", blocking: [] };
|
|
6875
6944
|
if (purposeRows.length === 0)
|
|
@@ -6951,7 +7020,7 @@ var NoticeConsentView = ({
|
|
|
6951
7020
|
gatedProducts
|
|
6952
7021
|
]);
|
|
6953
7022
|
const acceptDisabled = isSubmitting || !confirmVerdict.ok;
|
|
6954
|
-
(0,
|
|
7023
|
+
(0, import_react9.useEffect)(() => {
|
|
6955
7024
|
var _a2, _b2;
|
|
6956
7025
|
clearApiCache();
|
|
6957
7026
|
isRequestInProgressRef.current = false;
|
|
@@ -7018,7 +7087,7 @@ var NoticeConsentView = ({
|
|
|
7018
7087
|
}
|
|
7019
7088
|
isInitialMountRef.current = false;
|
|
7020
7089
|
}, [accessToken]);
|
|
7021
|
-
(0,
|
|
7090
|
+
(0, import_react9.useEffect)(() => {
|
|
7022
7091
|
if (hasAlreadyConsented) {
|
|
7023
7092
|
onAccept == null ? void 0 : onAccept();
|
|
7024
7093
|
}
|
|
@@ -7350,7 +7419,7 @@ var NoticeConsentView = ({
|
|
|
7350
7419
|
isRequestInProgressRef.current = false;
|
|
7351
7420
|
}
|
|
7352
7421
|
};
|
|
7353
|
-
(0,
|
|
7422
|
+
(0, import_react9.useEffect)(() => {
|
|
7354
7423
|
injectCheckboxStyles();
|
|
7355
7424
|
fetchNotice();
|
|
7356
7425
|
}, [
|
|
@@ -7429,7 +7498,7 @@ var NoticeConsentView = ({
|
|
|
7429
7498
|
});
|
|
7430
7499
|
setSelectedDataElements((prev) => ({ ...prev, ...elementOverrides }));
|
|
7431
7500
|
};
|
|
7432
|
-
const productBoxPurposes = (0,
|
|
7501
|
+
const productBoxPurposes = (0, import_react9.useCallback)((purposes) => {
|
|
7433
7502
|
const required = purposes.filter(hasRequiredDataElement);
|
|
7434
7503
|
return required.length > 0 ? required : purposes;
|
|
7435
7504
|
}, []);
|
|
@@ -7457,6 +7526,9 @@ var NoticeConsentView = ({
|
|
|
7457
7526
|
if (!products || products.length !== 1) {
|
|
7458
7527
|
return rows;
|
|
7459
7528
|
}
|
|
7529
|
+
if (!showsProductSection) {
|
|
7530
|
+
return rows;
|
|
7531
|
+
}
|
|
7460
7532
|
const product = products[0];
|
|
7461
7533
|
const purposes = (_a2 = content == null ? void 0 : content.purposes) != null ? _a2 : [];
|
|
7462
7534
|
const boxPurposes = productBoxPurposes(purposes);
|
|
@@ -7631,7 +7703,7 @@ var NoticeConsentView = ({
|
|
|
7631
7703
|
setIsSubmitting(false);
|
|
7632
7704
|
}
|
|
7633
7705
|
};
|
|
7634
|
-
const handleDecline = (0,
|
|
7706
|
+
const handleDecline = (0, import_react9.useCallback)(async () => {
|
|
7635
7707
|
try {
|
|
7636
7708
|
setIsSubmittingDecline(true);
|
|
7637
7709
|
setIsSubmitting(true);
|
|
@@ -7649,14 +7721,14 @@ var NoticeConsentView = ({
|
|
|
7649
7721
|
setConfirmAction(kind);
|
|
7650
7722
|
setPendingAction(() => action);
|
|
7651
7723
|
};
|
|
7652
|
-
const dismissConfirm = (0,
|
|
7653
|
-
const runPendingAction = (0,
|
|
7724
|
+
const dismissConfirm = (0, import_react9.useCallback)(() => setPendingAction(null), []);
|
|
7725
|
+
const runPendingAction = (0, import_react9.useCallback)(() => {
|
|
7654
7726
|
const action = pendingActionRef.current;
|
|
7655
7727
|
if (!action) return;
|
|
7656
7728
|
setPendingAction(null);
|
|
7657
7729
|
action();
|
|
7658
7730
|
}, []);
|
|
7659
|
-
const handleGuardianFormChange = (0,
|
|
7731
|
+
const handleGuardianFormChange = (0, import_react9.useCallback)(
|
|
7660
7732
|
(field, value) => {
|
|
7661
7733
|
setGuardianFormData((prev) => ({
|
|
7662
7734
|
...prev,
|
|
@@ -7685,7 +7757,7 @@ var NoticeConsentView = ({
|
|
|
7685
7757
|
setGuardianFormErrors(errors);
|
|
7686
7758
|
return Object.keys(errors).length === 0;
|
|
7687
7759
|
};
|
|
7688
|
-
const handleGuardianFormNext = (0,
|
|
7760
|
+
const handleGuardianFormNext = (0, import_react9.useCallback)(async () => {
|
|
7689
7761
|
if (!validateGuardianForm()) {
|
|
7690
7762
|
return;
|
|
7691
7763
|
}
|
|
@@ -7826,20 +7898,20 @@ var NoticeConsentView = ({
|
|
|
7826
7898
|
noticeId,
|
|
7827
7899
|
onError
|
|
7828
7900
|
]);
|
|
7829
|
-
const handleAgeVerificationYes = (0,
|
|
7901
|
+
const handleAgeVerificationYes = (0, import_react9.useCallback)(() => {
|
|
7830
7902
|
setShowAgeVerification(false);
|
|
7831
7903
|
setIsMinorFlow(false);
|
|
7832
7904
|
setSelfDeclaredAdult(true);
|
|
7833
7905
|
}, []);
|
|
7834
|
-
const handleAgeVerificationNo = (0,
|
|
7906
|
+
const handleAgeVerificationNo = (0, import_react9.useCallback)(() => {
|
|
7835
7907
|
setShowAgeVerification(false);
|
|
7836
7908
|
setShowGuardianForm(true);
|
|
7837
7909
|
}, []);
|
|
7838
|
-
const handleVerificationContinue = (0,
|
|
7910
|
+
const handleVerificationContinue = (0, import_react9.useCallback)(() => {
|
|
7839
7911
|
setShowVerificationScreen(false);
|
|
7840
7912
|
setIsVerificationComplete(false);
|
|
7841
7913
|
}, []);
|
|
7842
|
-
const handlePopupClosed = (0,
|
|
7914
|
+
const handlePopupClosed = (0, import_react9.useCallback)(async () => {
|
|
7843
7915
|
var _a2, _b2;
|
|
7844
7916
|
if (popupCheckIntervalRef.current) {
|
|
7845
7917
|
clearInterval(popupCheckIntervalRef.current);
|
|
@@ -7881,7 +7953,7 @@ var NoticeConsentView = ({
|
|
|
7881
7953
|
isPollingStatusRef.current = false;
|
|
7882
7954
|
setIsInitiatingVerification(false);
|
|
7883
7955
|
}, [accessToken, sandboxParams, baseUrl]);
|
|
7884
|
-
const startPopupMonitoring = (0,
|
|
7956
|
+
const startPopupMonitoring = (0, import_react9.useCallback)(
|
|
7885
7957
|
(popup) => {
|
|
7886
7958
|
popupCheckIntervalRef.current = window.setInterval(() => {
|
|
7887
7959
|
if (popup.closed) {
|
|
@@ -7891,7 +7963,7 @@ var NoticeConsentView = ({
|
|
|
7891
7963
|
},
|
|
7892
7964
|
[handlePopupClosed]
|
|
7893
7965
|
);
|
|
7894
|
-
const getVerificationErrorMessage = (0,
|
|
7966
|
+
const getVerificationErrorMessage = (0, import_react9.useCallback)(
|
|
7895
7967
|
(errorCode, fallbackError) => {
|
|
7896
7968
|
switch (errorCode) {
|
|
7897
7969
|
case "GUARDIAN_UNDER_18":
|
|
@@ -7910,7 +7982,7 @@ var NoticeConsentView = ({
|
|
|
7910
7982
|
},
|
|
7911
7983
|
[]
|
|
7912
7984
|
);
|
|
7913
|
-
const startStatusPolling = (0,
|
|
7985
|
+
const startStatusPolling = (0, import_react9.useCallback)(
|
|
7914
7986
|
(token2) => {
|
|
7915
7987
|
verificationSessionTokenRef.current = token2;
|
|
7916
7988
|
setIsPollingStatus(true);
|
|
@@ -8042,7 +8114,7 @@ var NoticeConsentView = ({
|
|
|
8042
8114
|
},
|
|
8043
8115
|
[accessToken, sandboxParams, baseUrl, getVerificationErrorMessage]
|
|
8044
8116
|
);
|
|
8045
|
-
const handleBackToGuardianForm = (0,
|
|
8117
|
+
const handleBackToGuardianForm = (0, import_react9.useCallback)((clearName = false) => {
|
|
8046
8118
|
var _a2, _b2;
|
|
8047
8119
|
(_a2 = verificationPopupRef.current) == null ? void 0 : _a2.close();
|
|
8048
8120
|
verificationPopupRef.current = null;
|
|
@@ -8078,7 +8150,7 @@ var NoticeConsentView = ({
|
|
|
8078
8150
|
}
|
|
8079
8151
|
clearConsentState();
|
|
8080
8152
|
}, []);
|
|
8081
|
-
const availableLanguages = (0,
|
|
8153
|
+
const availableLanguages = (0, import_react9.useMemo)(() => {
|
|
8082
8154
|
if (!content) return [language];
|
|
8083
8155
|
const pinned = ["English"];
|
|
8084
8156
|
if (content.default_language && content.default_language !== "English" && content.default_language !== "en") {
|
|
@@ -8087,7 +8159,7 @@ var NoticeConsentView = ({
|
|
|
8087
8159
|
const rest = content.supported_languages_and_translations ? Object.keys(content.supported_languages_and_translations).filter((lang) => !pinned.includes(lang)).sort((a, b) => a.localeCompare(b, "en")) : [];
|
|
8088
8160
|
return [...pinned, ...rest];
|
|
8089
8161
|
}, [content, language]);
|
|
8090
|
-
const getLanguageCode = (0,
|
|
8162
|
+
const getLanguageCode = (0, import_react9.useCallback)(
|
|
8091
8163
|
(displayLanguage) => {
|
|
8092
8164
|
if (!content) return "English";
|
|
8093
8165
|
if (displayLanguage === "English" || displayLanguage === "en") {
|
|
@@ -8100,7 +8172,7 @@ var NoticeConsentView = ({
|
|
|
8100
8172
|
},
|
|
8101
8173
|
[content]
|
|
8102
8174
|
);
|
|
8103
|
-
const audioSequence = (0,
|
|
8175
|
+
const audioSequence = (0, import_react9.useMemo)(() => {
|
|
8104
8176
|
if (!ttsAudioUrls || !content) return [];
|
|
8105
8177
|
const sequence = [];
|
|
8106
8178
|
if (ttsAudioUrls.notice_banner_heading_audio_url) {
|
|
@@ -8172,7 +8244,7 @@ var NoticeConsentView = ({
|
|
|
8172
8244
|
}
|
|
8173
8245
|
return sequence;
|
|
8174
8246
|
}, [ttsAudioUrls, content, categorizedPurposes]);
|
|
8175
|
-
const elementIdSequence = (0,
|
|
8247
|
+
const elementIdSequence = (0, import_react9.useMemo)(() => {
|
|
8176
8248
|
if (!ttsAudioUrls || !content) return [];
|
|
8177
8249
|
const elementIds = [];
|
|
8178
8250
|
if (ttsAudioUrls.notice_banner_heading_audio_url) {
|
|
@@ -8240,7 +8312,7 @@ var NoticeConsentView = ({
|
|
|
8240
8312
|
}
|
|
8241
8313
|
return elementIds;
|
|
8242
8314
|
}, [ttsAudioUrls, content, categorizedPurposes]);
|
|
8243
|
-
const stopAudio = (0,
|
|
8315
|
+
const stopAudio = (0, import_react9.useCallback)(() => {
|
|
8244
8316
|
if (currentAudioRef.current) {
|
|
8245
8317
|
currentAudioRef.current.pause();
|
|
8246
8318
|
currentAudioRef.current.currentTime = 0;
|
|
@@ -8252,7 +8324,7 @@ var NoticeConsentView = ({
|
|
|
8252
8324
|
setCurrentAudioIndex(0);
|
|
8253
8325
|
setHighlightedElementId(null);
|
|
8254
8326
|
}, [keepFocusedSectionsOpen]);
|
|
8255
|
-
const playNextAudio = (0,
|
|
8327
|
+
const playNextAudio = (0, import_react9.useCallback)(
|
|
8256
8328
|
(index) => {
|
|
8257
8329
|
if (index >= audioSequence.length) {
|
|
8258
8330
|
stopAudio();
|
|
@@ -8286,7 +8358,7 @@ var NoticeConsentView = ({
|
|
|
8286
8358
|
},
|
|
8287
8359
|
[audioSequence, elementIdSequence, stopAudio, keepFocusedSectionsOpen]
|
|
8288
8360
|
);
|
|
8289
|
-
const playAudio = (0,
|
|
8361
|
+
const playAudio = (0, import_react9.useCallback)(() => {
|
|
8290
8362
|
if (audioSequence.length === 0) return;
|
|
8291
8363
|
if (isPaused && currentAudioRef.current) {
|
|
8292
8364
|
currentAudioRef.current.play().then(() => {
|
|
@@ -8300,21 +8372,21 @@ var NoticeConsentView = ({
|
|
|
8300
8372
|
playNextAudio(startIndex);
|
|
8301
8373
|
}
|
|
8302
8374
|
}, [audioSequence, isPaused, isPlaying, currentAudioIndex, playNextAudio]);
|
|
8303
|
-
const pauseAudio = (0,
|
|
8375
|
+
const pauseAudio = (0, import_react9.useCallback)(() => {
|
|
8304
8376
|
if (currentAudioRef.current && isPlaying) {
|
|
8305
8377
|
currentAudioRef.current.pause();
|
|
8306
8378
|
setIsPlaying(false);
|
|
8307
8379
|
setIsPaused(true);
|
|
8308
8380
|
}
|
|
8309
8381
|
}, [isPlaying]);
|
|
8310
|
-
const toggleAudio = (0,
|
|
8382
|
+
const toggleAudio = (0, import_react9.useCallback)(() => {
|
|
8311
8383
|
if (isPlaying) {
|
|
8312
8384
|
pauseAudio();
|
|
8313
8385
|
} else {
|
|
8314
8386
|
playAudio();
|
|
8315
8387
|
}
|
|
8316
8388
|
}, [isPlaying, playAudio, pauseAudio]);
|
|
8317
|
-
(0,
|
|
8389
|
+
(0, import_react9.useEffect)(() => {
|
|
8318
8390
|
var _a2;
|
|
8319
8391
|
if (!isPlaying || !content || audioSequence.length === 0) return;
|
|
8320
8392
|
const currentIndex = currentAudioIndex;
|
|
@@ -8359,7 +8431,7 @@ var NoticeConsentView = ({
|
|
|
8359
8431
|
categorizedPurposes,
|
|
8360
8432
|
collapsedPurposes
|
|
8361
8433
|
]);
|
|
8362
|
-
(0,
|
|
8434
|
+
(0, import_react9.useEffect)(() => {
|
|
8363
8435
|
const removeAllHighlights = () => {
|
|
8364
8436
|
document.querySelectorAll(".redacto-tts-highlight").forEach((el) => {
|
|
8365
8437
|
el.classList.remove("redacto-tts-highlight");
|
|
@@ -8395,7 +8467,7 @@ var NoticeConsentView = ({
|
|
|
8395
8467
|
removeAllHighlights();
|
|
8396
8468
|
};
|
|
8397
8469
|
}, [highlightedElementId, isPlaying]);
|
|
8398
|
-
(0,
|
|
8470
|
+
(0, import_react9.useEffect)(() => {
|
|
8399
8471
|
setIsTTSAvailable(false);
|
|
8400
8472
|
setTtsAudioUrls(null);
|
|
8401
8473
|
stopAudio();
|
|
@@ -8406,7 +8478,7 @@ var NoticeConsentView = ({
|
|
|
8406
8478
|
const ttsAbortController = new AbortController();
|
|
8407
8479
|
fetchTTSAudioUrls({
|
|
8408
8480
|
accessToken,
|
|
8409
|
-
baseUrl,
|
|
8481
|
+
baseUrl: endpoints.mode === "host" ? ledgerBaseUrl : baseUrl,
|
|
8410
8482
|
ledgerBaseUrl,
|
|
8411
8483
|
noticeUuid: content.notice_uuid,
|
|
8412
8484
|
language: languageCode,
|
|
@@ -8431,6 +8503,7 @@ var NoticeConsentView = ({
|
|
|
8431
8503
|
sandboxParams,
|
|
8432
8504
|
baseUrl,
|
|
8433
8505
|
ledgerBaseUrl,
|
|
8506
|
+
endpoints.mode,
|
|
8434
8507
|
getLanguageCode
|
|
8435
8508
|
]);
|
|
8436
8509
|
const hostRadius = noticeSettings == null ? void 0 : noticeSettings.borderRadius;
|
|
@@ -8467,7 +8540,7 @@ var NoticeConsentView = ({
|
|
|
8467
8540
|
color: ((_v = (_u = noticeSettings == null ? void 0 : noticeSettings.button) == null ? void 0 : _u.decline) == null ? void 0 : _v.textColor) || (skin ? textColor : "#000000"),
|
|
8468
8541
|
borderColor: (_w = appearanceColors.decline_border) != null ? _w : (noticeSettings == null ? void 0 : noticeSettings.borderColor) || (skin ? skin.palette.outline : "#d0d5dd")
|
|
8469
8542
|
};
|
|
8470
|
-
const confirmHint = (0,
|
|
8543
|
+
const confirmHint = (0, import_react9.useMemo)(() => {
|
|
8471
8544
|
var _a2;
|
|
8472
8545
|
const { ok, reason, blocking } = confirmVerdict;
|
|
8473
8546
|
if (ok || reason === "ok" || isSubmitting) return null;
|
|
@@ -8524,7 +8597,7 @@ var NoticeConsentView = ({
|
|
|
8524
8597
|
otpTokenAtVerifyRef.current = accessToken;
|
|
8525
8598
|
setOtpAcceptAfterToken(mode);
|
|
8526
8599
|
};
|
|
8527
|
-
(0,
|
|
8600
|
+
(0, import_react9.useEffect)(() => {
|
|
8528
8601
|
if (!otpAcceptAfterToken) {
|
|
8529
8602
|
return;
|
|
8530
8603
|
}
|
|
@@ -8538,7 +8611,7 @@ var NoticeConsentView = ({
|
|
|
8538
8611
|
const hasPrivacyCenterLine = Boolean(
|
|
8539
8612
|
(content == null ? void 0 : content.privacy_center_url) || (content == null ? void 0 : content.additional_text)
|
|
8540
8613
|
);
|
|
8541
|
-
const productPolicyLinks = (0,
|
|
8614
|
+
const productPolicyLinks = (0, import_react9.useMemo)(
|
|
8542
8615
|
() => productPolicyEntries(
|
|
8543
8616
|
content == null ? void 0 : content.products,
|
|
8544
8617
|
content == null ? void 0 : content.product_privacy_policies
|
|
@@ -8617,7 +8690,7 @@ var NoticeConsentView = ({
|
|
|
8617
8690
|
const handleCloseError = () => {
|
|
8618
8691
|
setErrorMessage(null);
|
|
8619
8692
|
};
|
|
8620
|
-
(0,
|
|
8693
|
+
(0, import_react9.useEffect)(() => {
|
|
8621
8694
|
const handleKeyDown = (event) => {
|
|
8622
8695
|
if (!modalRef.current) return;
|
|
8623
8696
|
if (pendingActionRef.current) return;
|
|
@@ -8662,13 +8735,13 @@ var NoticeConsentView = ({
|
|
|
8662
8735
|
modal == null ? void 0 : modal.removeEventListener("keydown", handleKeyDown);
|
|
8663
8736
|
};
|
|
8664
8737
|
}, [isLoading, handleDecline, previewContent]);
|
|
8665
|
-
(0,
|
|
8738
|
+
(0, import_react9.useEffect)(() => {
|
|
8666
8739
|
stopAudio();
|
|
8667
8740
|
}, [selectedLanguage, stopAudio]);
|
|
8668
|
-
(0,
|
|
8741
|
+
(0, import_react9.useEffect)(() => {
|
|
8669
8742
|
stopAudio();
|
|
8670
8743
|
}, [content, stopAudio]);
|
|
8671
|
-
(0,
|
|
8744
|
+
(0, import_react9.useEffect)(() => {
|
|
8672
8745
|
return () => {
|
|
8673
8746
|
var _a2, _b2;
|
|
8674
8747
|
if (abortControllerRef.current) {
|
|
@@ -8694,7 +8767,7 @@ var NoticeConsentView = ({
|
|
|
8694
8767
|
}
|
|
8695
8768
|
};
|
|
8696
8769
|
}, [stopAudio]);
|
|
8697
|
-
(0,
|
|
8770
|
+
(0, import_react9.useEffect)(() => {
|
|
8698
8771
|
const persistedState = getConsentState();
|
|
8699
8772
|
if (!persistedState) return;
|
|
8700
8773
|
if (persistedState.noticeId && persistedState.noticeId !== noticeId) {
|
|
@@ -9815,7 +9888,7 @@ var NoticeConsentView = ({
|
|
|
9815
9888
|
var RedactoNoticeConsent = (props) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(NoticeConsentView, { ...props });
|
|
9816
9889
|
|
|
9817
9890
|
// src/RedactoNoticeConsentInline/RedactoNoticeConsentInline.tsx
|
|
9818
|
-
var
|
|
9891
|
+
var import_react11 = require("react");
|
|
9819
9892
|
|
|
9820
9893
|
// src/RedactoNoticeConsentInline/api/index.ts
|
|
9821
9894
|
var BASE_URL2 = DEFAULT_CONSENT_API_BASE_URL;
|
|
@@ -10275,11 +10348,11 @@ var styles2 = {
|
|
|
10275
10348
|
};
|
|
10276
10349
|
|
|
10277
10350
|
// src/RedactoNoticeConsentInline/useMediaQuery.ts
|
|
10278
|
-
var
|
|
10351
|
+
var import_react10 = require("react");
|
|
10279
10352
|
var useMediaQuery2 = (query) => {
|
|
10280
10353
|
const getMatches = () => typeof window !== "undefined" ? window.matchMedia(query).matches : false;
|
|
10281
|
-
const [matches, setMatches] = (0,
|
|
10282
|
-
(0,
|
|
10354
|
+
const [matches, setMatches] = (0, import_react10.useState)(getMatches);
|
|
10355
|
+
(0, import_react10.useEffect)(() => {
|
|
10283
10356
|
if (typeof window === "undefined") return;
|
|
10284
10357
|
const media = window.matchMedia(query);
|
|
10285
10358
|
const listener = (e) => {
|
|
@@ -10336,8 +10409,8 @@ var RedactoConsentInlineComponent = ({
|
|
|
10336
10409
|
workspace_uuid,
|
|
10337
10410
|
notice_uuid,
|
|
10338
10411
|
accessToken,
|
|
10339
|
-
baseUrl,
|
|
10340
|
-
ledgerBaseUrl,
|
|
10412
|
+
baseUrl: baseUrlProp,
|
|
10413
|
+
ledgerBaseUrl: ledgerBaseUrlProp,
|
|
10341
10414
|
language = "en",
|
|
10342
10415
|
onAccept,
|
|
10343
10416
|
onError,
|
|
@@ -10346,24 +10419,51 @@ var RedactoConsentInlineComponent = ({
|
|
|
10346
10419
|
applicationId
|
|
10347
10420
|
}) => {
|
|
10348
10421
|
var _a, _b, _c;
|
|
10349
|
-
const
|
|
10350
|
-
const
|
|
10351
|
-
const [
|
|
10352
|
-
const [
|
|
10353
|
-
const [
|
|
10354
|
-
const [
|
|
10355
|
-
const [
|
|
10356
|
-
const [
|
|
10357
|
-
const [
|
|
10422
|
+
const endpoints = useResolvedEndpoints(baseUrlProp, ledgerBaseUrlProp);
|
|
10423
|
+
const { baseUrl, ledgerBaseUrl } = endpoints;
|
|
10424
|
+
const [content, setContent] = (0, import_react11.useState)(null);
|
|
10425
|
+
const [isLoading, setIsLoading] = (0, import_react11.useState)(true);
|
|
10426
|
+
const [isSubmitting, setIsSubmitting] = (0, import_react11.useState)(false);
|
|
10427
|
+
const [selectedLanguage, setSelectedLanguage] = (0, import_react11.useState)(language);
|
|
10428
|
+
const [collapsedPurposes, setCollapsedPurposes] = (0, import_react11.useState)({});
|
|
10429
|
+
const [selectedPurposes, setSelectedPurposes] = (0, import_react11.useState)({});
|
|
10430
|
+
const [selectedDataElements, setSelectedDataElements] = (0, import_react11.useState)({});
|
|
10431
|
+
const [hasAlreadyConsented, setHasAlreadyConsented] = (0, import_react11.useState)(false);
|
|
10432
|
+
const [isCheckingConsent, setIsCheckingConsent] = (0, import_react11.useState)(
|
|
10358
10433
|
Boolean(ledgerBaseUrl) && !applicationId
|
|
10359
10434
|
);
|
|
10360
|
-
const [fetchError, setFetchError] = (0,
|
|
10361
|
-
const [errorMessage, setErrorMessage] = (0,
|
|
10362
|
-
const hasSubmittedRef = (0,
|
|
10363
|
-
const [awaitingConfirm, setAwaitingConfirm] = (0,
|
|
10364
|
-
const refusedSelectionRef = (0,
|
|
10365
|
-
const confirmedSelectionRef = (0,
|
|
10366
|
-
|
|
10435
|
+
const [fetchError, setFetchError] = (0, import_react11.useState)(null);
|
|
10436
|
+
const [errorMessage, setErrorMessage] = (0, import_react11.useState)(null);
|
|
10437
|
+
const hasSubmittedRef = (0, import_react11.useRef)(false);
|
|
10438
|
+
const [awaitingConfirm, setAwaitingConfirm] = (0, import_react11.useState)(false);
|
|
10439
|
+
const refusedSelectionRef = (0, import_react11.useRef)(null);
|
|
10440
|
+
const confirmedSelectionRef = (0, import_react11.useRef)(null);
|
|
10441
|
+
const endpointsKey = JSON.stringify([endpoints.mode, baseUrl != null ? baseUrl : "", ledgerBaseUrl != null ? ledgerBaseUrl : ""]);
|
|
10442
|
+
const [loadedEndpointsKey, setLoadedEndpointsKey] = (0, import_react11.useState)(endpointsKey);
|
|
10443
|
+
if (loadedEndpointsKey !== endpointsKey) {
|
|
10444
|
+
setLoadedEndpointsKey(endpointsKey);
|
|
10445
|
+
setContent(null);
|
|
10446
|
+
setIsLoading(true);
|
|
10447
|
+
setFetchError(null);
|
|
10448
|
+
setErrorMessage(null);
|
|
10449
|
+
setHasAlreadyConsented(false);
|
|
10450
|
+
setIsCheckingConsent(Boolean(ledgerBaseUrl) && !applicationId);
|
|
10451
|
+
setIsSubmitting(false);
|
|
10452
|
+
setAwaitingConfirm(false);
|
|
10453
|
+
}
|
|
10454
|
+
const endpointsGenerationRef = (0, import_react11.useRef)(0);
|
|
10455
|
+
const committedEndpointsKeyRef = (0, import_react11.useRef)(endpointsKey);
|
|
10456
|
+
useIsomorphicLayoutEffect(() => {
|
|
10457
|
+
if (committedEndpointsKeyRef.current === endpointsKey) {
|
|
10458
|
+
return;
|
|
10459
|
+
}
|
|
10460
|
+
committedEndpointsKeyRef.current = endpointsKey;
|
|
10461
|
+
endpointsGenerationRef.current += 1;
|
|
10462
|
+
hasSubmittedRef.current = false;
|
|
10463
|
+
refusedSelectionRef.current = null;
|
|
10464
|
+
confirmedSelectionRef.current = null;
|
|
10465
|
+
}, [endpointsKey]);
|
|
10466
|
+
(0, import_react11.useEffect)(() => {
|
|
10367
10467
|
injectSpinnerAnimation();
|
|
10368
10468
|
injectCheckboxStyles();
|
|
10369
10469
|
}, []);
|
|
@@ -10371,18 +10471,18 @@ var RedactoConsentInlineComponent = ({
|
|
|
10371
10471
|
const { colors } = inlineAppearance;
|
|
10372
10472
|
useNoticeCustomCss(notice_uuid, inlineAppearance.customCss);
|
|
10373
10473
|
const drawsSwitches = resolveNoticeLayout(inlineAppearance).switchControl;
|
|
10374
|
-
(0,
|
|
10474
|
+
(0, import_react11.useEffect)(() => {
|
|
10375
10475
|
if (drawsSwitches) {
|
|
10376
10476
|
injectSwitchStyles();
|
|
10377
10477
|
}
|
|
10378
10478
|
}, [drawsSwitches]);
|
|
10379
10479
|
const textScale = NOTICE_TEXT_SCALE_FACTORS[(_a = inlineAppearance.textScale) != null ? _a : DEFAULT_TEXT_SCALE];
|
|
10380
|
-
const styles4 = (0,
|
|
10480
|
+
const styles4 = (0, import_react11.useMemo)(
|
|
10381
10481
|
() => scaleFontSizes(styles2, textScale),
|
|
10382
10482
|
[textScale]
|
|
10383
10483
|
);
|
|
10384
10484
|
const isMobile = useMediaQuery2("(max-width: 768px)");
|
|
10385
|
-
const responsiveStyles = (0,
|
|
10485
|
+
const responsiveStyles = (0, import_react11.useMemo)(
|
|
10386
10486
|
() => scaleFontSizes(
|
|
10387
10487
|
{
|
|
10388
10488
|
optionTitle: {
|
|
@@ -10403,7 +10503,7 @@ var RedactoConsentInlineComponent = ({
|
|
|
10403
10503
|
),
|
|
10404
10504
|
[isMobile, textScale]
|
|
10405
10505
|
);
|
|
10406
|
-
const purposeRows = (0,
|
|
10506
|
+
const purposeRows = (0, import_react11.useMemo)(
|
|
10407
10507
|
() => {
|
|
10408
10508
|
var _a2;
|
|
10409
10509
|
return noticePurposeRows(
|
|
@@ -10414,7 +10514,7 @@ var RedactoConsentInlineComponent = ({
|
|
|
10414
10514
|
},
|
|
10415
10515
|
[content]
|
|
10416
10516
|
);
|
|
10417
|
-
const areAllRequiredElementsChecked = (0,
|
|
10517
|
+
const areAllRequiredElementsChecked = (0, import_react11.useMemo)(() => {
|
|
10418
10518
|
if (!content) return false;
|
|
10419
10519
|
return purposeRows.every(
|
|
10420
10520
|
({ purpose, productUuid }) => purpose.data_elements.filter(isBlockingRequiredElement).every(
|
|
@@ -10422,10 +10522,10 @@ var RedactoConsentInlineComponent = ({
|
|
|
10422
10522
|
)
|
|
10423
10523
|
);
|
|
10424
10524
|
}, [content, purposeRows, selectedDataElements]);
|
|
10425
|
-
(0,
|
|
10525
|
+
(0, import_react11.useEffect)(() => {
|
|
10426
10526
|
onValidationChange == null ? void 0 : onValidationChange(areAllRequiredElementsChecked);
|
|
10427
10527
|
}, [areAllRequiredElementsChecked, onValidationChange]);
|
|
10428
|
-
(0,
|
|
10528
|
+
(0, import_react11.useEffect)(() => {
|
|
10429
10529
|
if (hasAlreadyConsented) {
|
|
10430
10530
|
onAccept == null ? void 0 : onAccept();
|
|
10431
10531
|
}
|
|
@@ -10482,12 +10582,13 @@ var RedactoConsentInlineComponent = ({
|
|
|
10482
10582
|
setFetchError(null);
|
|
10483
10583
|
setHasAlreadyConsented(false);
|
|
10484
10584
|
try {
|
|
10585
|
+
const noticeBaseUrl = endpoints.mode === "host" && accessToken && !applicationId ? ledgerBaseUrl : baseUrl;
|
|
10485
10586
|
const consentContentData = await fetchConsentContent2({
|
|
10486
10587
|
org_uuid,
|
|
10487
10588
|
workspace_uuid,
|
|
10488
10589
|
notice_uuid,
|
|
10489
10590
|
accessToken,
|
|
10490
|
-
baseUrl,
|
|
10591
|
+
baseUrl: noticeBaseUrl,
|
|
10491
10592
|
language,
|
|
10492
10593
|
specific_uuid: applicationId,
|
|
10493
10594
|
signal
|
|
@@ -10539,7 +10640,7 @@ var RedactoConsentInlineComponent = ({
|
|
|
10539
10640
|
}
|
|
10540
10641
|
}
|
|
10541
10642
|
};
|
|
10542
|
-
(0,
|
|
10643
|
+
(0, import_react11.useEffect)(() => {
|
|
10543
10644
|
const controller = new AbortController();
|
|
10544
10645
|
void fetchNotice(controller.signal);
|
|
10545
10646
|
return () => {
|
|
@@ -10551,9 +10652,10 @@ var RedactoConsentInlineComponent = ({
|
|
|
10551
10652
|
notice_uuid,
|
|
10552
10653
|
language,
|
|
10553
10654
|
applicationId,
|
|
10554
|
-
accessToken
|
|
10655
|
+
accessToken,
|
|
10656
|
+
endpointsKey
|
|
10555
10657
|
]);
|
|
10556
|
-
(0,
|
|
10658
|
+
(0, import_react11.useEffect)(() => {
|
|
10557
10659
|
if (!ledgerBaseUrl || applicationId) {
|
|
10558
10660
|
return;
|
|
10559
10661
|
}
|
|
@@ -10650,12 +10752,14 @@ var RedactoConsentInlineComponent = ({
|
|
|
10650
10752
|
return newState;
|
|
10651
10753
|
});
|
|
10652
10754
|
};
|
|
10653
|
-
const handleAcceptWithToken = (0,
|
|
10755
|
+
const handleAcceptWithToken = (0, import_react11.useCallback)(
|
|
10654
10756
|
async (tokenToUse) => {
|
|
10655
10757
|
if (!tokenToUse || !content) {
|
|
10656
10758
|
setErrorMessage("Unable to submit consent. Please try again.");
|
|
10657
10759
|
throw new Error("Access token or content not available");
|
|
10658
10760
|
}
|
|
10761
|
+
const generation = endpointsGenerationRef.current;
|
|
10762
|
+
const isCurrent = () => endpointsGenerationRef.current === generation;
|
|
10659
10763
|
try {
|
|
10660
10764
|
setIsSubmitting(true);
|
|
10661
10765
|
setErrorMessage(null);
|
|
@@ -10691,16 +10795,24 @@ var RedactoConsentInlineComponent = ({
|
|
|
10691
10795
|
declined: false,
|
|
10692
10796
|
meta_data: applicationId ? { specific_uuid: applicationId } : void 0
|
|
10693
10797
|
});
|
|
10798
|
+
if (!isCurrent()) {
|
|
10799
|
+
return;
|
|
10800
|
+
}
|
|
10694
10801
|
onAccept == null ? void 0 : onAccept();
|
|
10695
10802
|
hasSubmittedRef.current = false;
|
|
10696
10803
|
} catch (error) {
|
|
10804
|
+
if (!isCurrent()) {
|
|
10805
|
+
return;
|
|
10806
|
+
}
|
|
10697
10807
|
const err = error;
|
|
10698
10808
|
const message = err.message || "Failed to submit consent. Please try again.";
|
|
10699
10809
|
setErrorMessage(message);
|
|
10700
10810
|
hasSubmittedRef.current = false;
|
|
10701
10811
|
throw error;
|
|
10702
10812
|
} finally {
|
|
10703
|
-
|
|
10813
|
+
if (isCurrent()) {
|
|
10814
|
+
setIsSubmitting(false);
|
|
10815
|
+
}
|
|
10704
10816
|
}
|
|
10705
10817
|
},
|
|
10706
10818
|
[
|
|
@@ -10717,11 +10829,11 @@ var RedactoConsentInlineComponent = ({
|
|
|
10717
10829
|
]
|
|
10718
10830
|
);
|
|
10719
10831
|
const confirmBeforeSubmit = inlineAppearance.confirmBeforeSubmit === true;
|
|
10720
|
-
const selectionSignature = (0,
|
|
10832
|
+
const selectionSignature = (0, import_react11.useMemo)(
|
|
10721
10833
|
() => JSON.stringify([selectedPurposes, selectedDataElements]),
|
|
10722
10834
|
[selectedPurposes, selectedDataElements]
|
|
10723
10835
|
);
|
|
10724
|
-
const confirmSubmission = (0,
|
|
10836
|
+
const confirmSubmission = (0, import_react11.useCallback)(() => {
|
|
10725
10837
|
setAwaitingConfirm(false);
|
|
10726
10838
|
confirmedSelectionRef.current = selectionSignature;
|
|
10727
10839
|
hasSubmittedRef.current = true;
|
|
@@ -10731,11 +10843,11 @@ var RedactoConsentInlineComponent = ({
|
|
|
10731
10843
|
onError == null ? void 0 : onError(err);
|
|
10732
10844
|
});
|
|
10733
10845
|
}, [accessToken, handleAcceptWithToken, onError, selectionSignature]);
|
|
10734
|
-
const refuseSubmission = (0,
|
|
10846
|
+
const refuseSubmission = (0, import_react11.useCallback)(() => {
|
|
10735
10847
|
setAwaitingConfirm(false);
|
|
10736
10848
|
refusedSelectionRef.current = selectionSignature;
|
|
10737
10849
|
}, [selectionSignature]);
|
|
10738
|
-
(0,
|
|
10850
|
+
(0, import_react11.useEffect)(() => {
|
|
10739
10851
|
if (accessToken && content && areAllRequiredElementsChecked && !isSubmitting && !isCheckingConsent && !hasAlreadyConsented && !hasSubmittedRef.current) {
|
|
10740
10852
|
if (confirmBeforeSubmit) {
|
|
10741
10853
|
if (refusedSelectionRef.current === selectionSignature || confirmedSelectionRef.current === selectionSignature) {
|
|
@@ -10766,7 +10878,7 @@ var RedactoConsentInlineComponent = ({
|
|
|
10766
10878
|
confirmBeforeSubmit,
|
|
10767
10879
|
selectionSignature
|
|
10768
10880
|
]);
|
|
10769
|
-
(0,
|
|
10881
|
+
(0, import_react11.useEffect)(() => {
|
|
10770
10882
|
refusedSelectionRef.current = null;
|
|
10771
10883
|
confirmedSelectionRef.current = null;
|
|
10772
10884
|
if (!accessToken) {
|
|
@@ -11055,10 +11167,10 @@ var RedactoConsentInlineComponent = ({
|
|
|
11055
11167
|
);
|
|
11056
11168
|
};
|
|
11057
11169
|
RedactoConsentInlineComponent.displayName = "RedactoConsentInline";
|
|
11058
|
-
var RedactoConsentInline = (0,
|
|
11170
|
+
var RedactoConsentInline = (0, import_react11.memo)(RedactoConsentInlineComponent);
|
|
11059
11171
|
|
|
11060
11172
|
// src/RedactoNoticeAssisted/RedactoNoticeAssisted.tsx
|
|
11061
|
-
var
|
|
11173
|
+
var import_react13 = require("react");
|
|
11062
11174
|
|
|
11063
11175
|
// src/RedactoNoticeAssisted/styles.ts
|
|
11064
11176
|
var styles3 = {
|
|
@@ -12018,11 +12130,11 @@ var injectAssistedStyles = () => {
|
|
|
12018
12130
|
};
|
|
12019
12131
|
|
|
12020
12132
|
// src/RedactoNoticeAssisted/useMediaQuery.ts
|
|
12021
|
-
var
|
|
12133
|
+
var import_react12 = require("react");
|
|
12022
12134
|
var useMediaQuery3 = (query) => {
|
|
12023
12135
|
const getMatches = () => typeof window !== "undefined" ? window.matchMedia(query).matches : false;
|
|
12024
|
-
const [matches, setMatches] = (0,
|
|
12025
|
-
(0,
|
|
12136
|
+
const [matches, setMatches] = (0, import_react12.useState)(getMatches);
|
|
12137
|
+
(0, import_react12.useEffect)(() => {
|
|
12026
12138
|
if (typeof window === "undefined") return;
|
|
12027
12139
|
const media = window.matchMedia(query);
|
|
12028
12140
|
const listener = (e) => {
|
|
@@ -13643,56 +13755,60 @@ var RedactoNoticeAssisted = ({
|
|
|
13643
13755
|
organisationUuid,
|
|
13644
13756
|
workspaceUuid,
|
|
13645
13757
|
noticeUuid,
|
|
13646
|
-
baseUrl,
|
|
13647
|
-
ledgerBaseUrl,
|
|
13758
|
+
baseUrl: baseUrlProp,
|
|
13759
|
+
ledgerBaseUrl: ledgerBaseUrlProp,
|
|
13648
13760
|
onDecline,
|
|
13649
13761
|
onComplete,
|
|
13650
13762
|
settings
|
|
13651
13763
|
}) => {
|
|
13652
13764
|
var _a, _b, _c, _d;
|
|
13765
|
+
const { baseUrl, ledgerBaseUrl } = useResolvedEndpoints(
|
|
13766
|
+
baseUrlProp,
|
|
13767
|
+
ledgerBaseUrlProp
|
|
13768
|
+
);
|
|
13653
13769
|
const isMobile = useMediaQuery3("(max-width: 768px)");
|
|
13654
|
-
const [content, setContent] = (0,
|
|
13655
|
-
const [isLoading, setIsLoading] = (0,
|
|
13656
|
-
const [fetchError, setFetchError] = (0,
|
|
13657
|
-
const [step, setStep] = (0,
|
|
13658
|
-
const [acceptMode, setAcceptMode] = (0,
|
|
13659
|
-
const [selectedPurposes, setSelectedPurposes] = (0,
|
|
13660
|
-
const [selectedDataElements, setSelectedDataElements] = (0,
|
|
13661
|
-
const [collapsedPurposes, setCollapsedPurposes] = (0,
|
|
13662
|
-
const [isLanguageDropdownOpen, setIsLanguageDropdownOpen] = (0,
|
|
13663
|
-
const [selectedLanguage, setSelectedLanguage] = (0,
|
|
13664
|
-
const languageContainerRef = (0,
|
|
13665
|
-
const [ttsAudioUrls, setTtsAudioUrls] = (0,
|
|
13666
|
-
const [isTTSAvailable, setIsTTSAvailable] = (0,
|
|
13667
|
-
const [isPlaying, setIsPlaying] = (0,
|
|
13668
|
-
const [isPaused, setIsPaused] = (0,
|
|
13669
|
-
const [currentAudioIndex, setCurrentAudioIndex] = (0,
|
|
13670
|
-
const [highlightedElementId, setHighlightedElementId] = (0,
|
|
13671
|
-
const currentAudioRef = (0,
|
|
13672
|
-
const [verifyMethod, setVerifyMethod] = (0,
|
|
13770
|
+
const [content, setContent] = (0, import_react13.useState)(null);
|
|
13771
|
+
const [isLoading, setIsLoading] = (0, import_react13.useState)(true);
|
|
13772
|
+
const [fetchError, setFetchError] = (0, import_react13.useState)(null);
|
|
13773
|
+
const [step, setStep] = (0, import_react13.useState)("notice");
|
|
13774
|
+
const [acceptMode, setAcceptMode] = (0, import_react13.useState)("selected");
|
|
13775
|
+
const [selectedPurposes, setSelectedPurposes] = (0, import_react13.useState)({});
|
|
13776
|
+
const [selectedDataElements, setSelectedDataElements] = (0, import_react13.useState)({});
|
|
13777
|
+
const [collapsedPurposes, setCollapsedPurposes] = (0, import_react13.useState)({});
|
|
13778
|
+
const [isLanguageDropdownOpen, setIsLanguageDropdownOpen] = (0, import_react13.useState)(false);
|
|
13779
|
+
const [selectedLanguage, setSelectedLanguage] = (0, import_react13.useState)("English");
|
|
13780
|
+
const languageContainerRef = (0, import_react13.useRef)(null);
|
|
13781
|
+
const [ttsAudioUrls, setTtsAudioUrls] = (0, import_react13.useState)(null);
|
|
13782
|
+
const [isTTSAvailable, setIsTTSAvailable] = (0, import_react13.useState)(false);
|
|
13783
|
+
const [isPlaying, setIsPlaying] = (0, import_react13.useState)(false);
|
|
13784
|
+
const [isPaused, setIsPaused] = (0, import_react13.useState)(false);
|
|
13785
|
+
const [currentAudioIndex, setCurrentAudioIndex] = (0, import_react13.useState)(0);
|
|
13786
|
+
const [highlightedElementId, setHighlightedElementId] = (0, import_react13.useState)(null);
|
|
13787
|
+
const currentAudioRef = (0, import_react13.useRef)(null);
|
|
13788
|
+
const [verifyMethod, setVerifyMethod] = (0, import_react13.useState)(
|
|
13673
13789
|
"mobile"
|
|
13674
13790
|
);
|
|
13675
|
-
const [mobile, setMobile] = (0,
|
|
13676
|
-
const mobileInputRef = (0,
|
|
13677
|
-
const [email, setEmail] = (0,
|
|
13678
|
-
const emailInputRef = (0,
|
|
13679
|
-
const [otpSent, setOtpSent] = (0,
|
|
13680
|
-
const verifyBlockRef = (0,
|
|
13681
|
-
const otpSectionRef = (0,
|
|
13682
|
-
const [otpDigits, setOtpDigits] = (0,
|
|
13791
|
+
const [mobile, setMobile] = (0, import_react13.useState)("");
|
|
13792
|
+
const mobileInputRef = (0, import_react13.useRef)(null);
|
|
13793
|
+
const [email, setEmail] = (0, import_react13.useState)("");
|
|
13794
|
+
const emailInputRef = (0, import_react13.useRef)(null);
|
|
13795
|
+
const [otpSent, setOtpSent] = (0, import_react13.useState)(false);
|
|
13796
|
+
const verifyBlockRef = (0, import_react13.useRef)(null);
|
|
13797
|
+
const otpSectionRef = (0, import_react13.useRef)(null);
|
|
13798
|
+
const [otpDigits, setOtpDigits] = (0, import_react13.useState)(
|
|
13683
13799
|
() => Array.from({ length: ASSISTED_CONFIG.otpLength }, () => "")
|
|
13684
13800
|
);
|
|
13685
|
-
const otpInputRefs = (0,
|
|
13686
|
-
const [resendCountdown, setResendCountdown] = (0,
|
|
13687
|
-
const [otpUuid, setOtpUuid] = (0,
|
|
13688
|
-
const [isSendingOtp, setIsSendingOtp] = (0,
|
|
13689
|
-
const [isVerifying, setIsVerifying] = (0,
|
|
13690
|
-
const [createError, setCreateError] = (0,
|
|
13691
|
-
const [otpError, setOtpError] = (0,
|
|
13692
|
-
(0,
|
|
13801
|
+
const otpInputRefs = (0, import_react13.useRef)([]);
|
|
13802
|
+
const [resendCountdown, setResendCountdown] = (0, import_react13.useState)(0);
|
|
13803
|
+
const [otpUuid, setOtpUuid] = (0, import_react13.useState)("");
|
|
13804
|
+
const [isSendingOtp, setIsSendingOtp] = (0, import_react13.useState)(false);
|
|
13805
|
+
const [isVerifying, setIsVerifying] = (0, import_react13.useState)(false);
|
|
13806
|
+
const [createError, setCreateError] = (0, import_react13.useState)(null);
|
|
13807
|
+
const [otpError, setOtpError] = (0, import_react13.useState)(null);
|
|
13808
|
+
(0, import_react13.useEffect)(() => {
|
|
13693
13809
|
injectAssistedStyles();
|
|
13694
13810
|
}, []);
|
|
13695
|
-
(0,
|
|
13811
|
+
(0, import_react13.useEffect)(() => {
|
|
13696
13812
|
const controller = new AbortController();
|
|
13697
13813
|
setIsLoading(true);
|
|
13698
13814
|
setFetchError(null);
|
|
@@ -13728,14 +13844,14 @@ var RedactoNoticeAssisted = ({
|
|
|
13728
13844
|
});
|
|
13729
13845
|
return () => controller.abort();
|
|
13730
13846
|
}, [organisationUuid, workspaceUuid, noticeUuid, baseUrl]);
|
|
13731
|
-
(0,
|
|
13847
|
+
(0, import_react13.useEffect)(() => {
|
|
13732
13848
|
if (resendCountdown <= 0) return;
|
|
13733
13849
|
const intervalId = window.setInterval(() => {
|
|
13734
13850
|
setResendCountdown((prev) => prev <= 1 ? 0 : prev - 1);
|
|
13735
13851
|
}, 1e3);
|
|
13736
13852
|
return () => window.clearInterval(intervalId);
|
|
13737
13853
|
}, [resendCountdown]);
|
|
13738
|
-
(0,
|
|
13854
|
+
(0, import_react13.useEffect)(() => {
|
|
13739
13855
|
if (step !== "verify") return;
|
|
13740
13856
|
const id = window.setTimeout(
|
|
13741
13857
|
() => scrollIntoViewSoft(verifyBlockRef.current),
|
|
@@ -13743,7 +13859,7 @@ var RedactoNoticeAssisted = ({
|
|
|
13743
13859
|
);
|
|
13744
13860
|
return () => window.clearTimeout(id);
|
|
13745
13861
|
}, [step]);
|
|
13746
|
-
(0,
|
|
13862
|
+
(0, import_react13.useEffect)(() => {
|
|
13747
13863
|
if (!otpSent) return;
|
|
13748
13864
|
const id = window.setTimeout(
|
|
13749
13865
|
() => scrollIntoViewSoft(otpSectionRef.current),
|
|
@@ -13751,7 +13867,7 @@ var RedactoNoticeAssisted = ({
|
|
|
13751
13867
|
);
|
|
13752
13868
|
return () => window.clearTimeout(id);
|
|
13753
13869
|
}, [otpSent]);
|
|
13754
|
-
(0,
|
|
13870
|
+
(0, import_react13.useEffect)(() => {
|
|
13755
13871
|
if (!isLanguageDropdownOpen) return;
|
|
13756
13872
|
const handleClickOutside = (e) => {
|
|
13757
13873
|
if (languageContainerRef.current && !languageContainerRef.current.contains(e.target)) {
|
|
@@ -13766,7 +13882,7 @@ var RedactoNoticeAssisted = ({
|
|
|
13766
13882
|
const isMobileValid = mobile.replace(/\D/g, "").length >= 10;
|
|
13767
13883
|
const isEmailValid = EMAIL_REGEX.test(email.trim());
|
|
13768
13884
|
const isContactValid = verifyMethod === "email" ? isEmailValid : isMobileValid;
|
|
13769
|
-
const displayedPurposes = (0,
|
|
13885
|
+
const displayedPurposes = (0, import_react13.useMemo)(
|
|
13770
13886
|
() => {
|
|
13771
13887
|
var _a2;
|
|
13772
13888
|
return purposesInRenderOrder(
|
|
@@ -13777,7 +13893,7 @@ var RedactoNoticeAssisted = ({
|
|
|
13777
13893
|
},
|
|
13778
13894
|
[content]
|
|
13779
13895
|
);
|
|
13780
|
-
const areAllRequiredElementsChecked = (0,
|
|
13896
|
+
const areAllRequiredElementsChecked = (0, import_react13.useMemo)(() => {
|
|
13781
13897
|
if (!content) return false;
|
|
13782
13898
|
return displayedPurposes.every((purpose) => {
|
|
13783
13899
|
const requiredElements = purpose.data_elements.filter(
|
|
@@ -13788,20 +13904,20 @@ var RedactoNoticeAssisted = ({
|
|
|
13788
13904
|
);
|
|
13789
13905
|
});
|
|
13790
13906
|
}, [content, displayedPurposes, selectedDataElements]);
|
|
13791
|
-
const normalizedDefaultLang = (0,
|
|
13907
|
+
const normalizedDefaultLang = (0, import_react13.useMemo)(() => {
|
|
13792
13908
|
const dl = content == null ? void 0 : content.default_language;
|
|
13793
13909
|
if (!dl) return "English";
|
|
13794
13910
|
return dl === "en" || dl === "EN" ? "English" : dl;
|
|
13795
13911
|
}, [content]);
|
|
13796
|
-
const isDefaultLanguage = (0,
|
|
13912
|
+
const isDefaultLanguage = (0, import_react13.useCallback)(
|
|
13797
13913
|
(lang) => lang === "English" || lang === "en" || lang === "EN",
|
|
13798
13914
|
[]
|
|
13799
13915
|
);
|
|
13800
|
-
const ts = (0,
|
|
13916
|
+
const ts = (0, import_react13.useMemo)(
|
|
13801
13917
|
() => makeStaticT(toBcp47Code(selectedLanguage)),
|
|
13802
13918
|
[selectedLanguage]
|
|
13803
13919
|
);
|
|
13804
|
-
const getTranslatedText = (0,
|
|
13920
|
+
const getTranslatedText = (0, import_react13.useCallback)(
|
|
13805
13921
|
(key, fallback, itemId) => {
|
|
13806
13922
|
var _a2, _b2, _c2;
|
|
13807
13923
|
if (!content) return fallback;
|
|
@@ -13831,7 +13947,7 @@ var RedactoNoticeAssisted = ({
|
|
|
13831
13947
|
},
|
|
13832
13948
|
[content, selectedLanguage, isDefaultLanguage]
|
|
13833
13949
|
);
|
|
13834
|
-
const getTranslatedDpoText = (0,
|
|
13950
|
+
const getTranslatedDpoText = (0, import_react13.useCallback)(
|
|
13835
13951
|
(key, fallback) => {
|
|
13836
13952
|
var _a2, _b2;
|
|
13837
13953
|
if (!(content == null ? void 0 : content.dpo_info)) return fallback;
|
|
@@ -13843,7 +13959,7 @@ var RedactoNoticeAssisted = ({
|
|
|
13843
13959
|
},
|
|
13844
13960
|
[content, selectedLanguage, isDefaultLanguage]
|
|
13845
13961
|
);
|
|
13846
|
-
const availableLanguages = (0,
|
|
13962
|
+
const availableLanguages = (0, import_react13.useMemo)(() => {
|
|
13847
13963
|
if (!content) return [selectedLanguage];
|
|
13848
13964
|
const pinned = ["English"];
|
|
13849
13965
|
if (normalizedDefaultLang && normalizedDefaultLang !== "English") {
|
|
@@ -13873,7 +13989,7 @@ var RedactoNoticeAssisted = ({
|
|
|
13873
13989
|
const assistedStyle = assistedAppearance.style;
|
|
13874
13990
|
const radii = STYLE_RADII[assistedStyle];
|
|
13875
13991
|
const textScale = NOTICE_TEXT_SCALE_FACTORS[(_a = assistedAppearance.textScale) != null ? _a : DEFAULT_TEXT_SCALE];
|
|
13876
|
-
const styles4 = (0,
|
|
13992
|
+
const styles4 = (0, import_react13.useMemo)(
|
|
13877
13993
|
() => scaleFontSizes(
|
|
13878
13994
|
buildVariantStyles(
|
|
13879
13995
|
mergeNoticeStyles(styles3, {
|
|
@@ -13911,7 +14027,7 @@ var RedactoNoticeAssisted = ({
|
|
|
13911
14027
|
const hasPrivacyCenterLine = Boolean(
|
|
13912
14028
|
(content == null ? void 0 : content.privacy_center_url) || (content == null ? void 0 : content.additional_text)
|
|
13913
14029
|
);
|
|
13914
|
-
const responsive = (0,
|
|
14030
|
+
const responsive = (0, import_react13.useMemo)(
|
|
13915
14031
|
() => scaleFontSizes(
|
|
13916
14032
|
{
|
|
13917
14033
|
modal: { width: isMobile ? "90%" : "700px" },
|
|
@@ -13952,7 +14068,7 @@ var RedactoNoticeAssisted = ({
|
|
|
13952
14068
|
),
|
|
13953
14069
|
[isMobile, textScale]
|
|
13954
14070
|
);
|
|
13955
|
-
const togglePurpose = (0,
|
|
14071
|
+
const togglePurpose = (0, import_react13.useCallback)(
|
|
13956
14072
|
(uuid) => {
|
|
13957
14073
|
setSelectedPurposes((prev) => {
|
|
13958
14074
|
const next = !prev[uuid];
|
|
@@ -13969,10 +14085,10 @@ var RedactoNoticeAssisted = ({
|
|
|
13969
14085
|
},
|
|
13970
14086
|
[content]
|
|
13971
14087
|
);
|
|
13972
|
-
const togglePurposeCollapse = (0,
|
|
14088
|
+
const togglePurposeCollapse = (0, import_react13.useCallback)((uuid) => {
|
|
13973
14089
|
setCollapsedPurposes((prev) => ({ ...prev, [uuid]: !prev[uuid] }));
|
|
13974
14090
|
}, []);
|
|
13975
|
-
const handleDataElementToggle = (0,
|
|
14091
|
+
const handleDataElementToggle = (0, import_react13.useCallback)(
|
|
13976
14092
|
(purposeUuid, elementUuid) => {
|
|
13977
14093
|
if (!content) return;
|
|
13978
14094
|
const combinedId = `${purposeUuid}-${elementUuid}`;
|
|
@@ -13998,14 +14114,14 @@ var RedactoNoticeAssisted = ({
|
|
|
13998
14114
|
},
|
|
13999
14115
|
[content]
|
|
14000
14116
|
);
|
|
14001
|
-
const toggleLanguageDropdown = (0,
|
|
14117
|
+
const toggleLanguageDropdown = (0, import_react13.useCallback)(() => {
|
|
14002
14118
|
setIsLanguageDropdownOpen((prev) => !prev);
|
|
14003
14119
|
}, []);
|
|
14004
|
-
const handleLanguageSelect = (0,
|
|
14120
|
+
const handleLanguageSelect = (0, import_react13.useCallback)((lang) => {
|
|
14005
14121
|
setSelectedLanguage(lang);
|
|
14006
14122
|
setIsLanguageDropdownOpen(false);
|
|
14007
14123
|
}, []);
|
|
14008
|
-
const audioSequence = (0,
|
|
14124
|
+
const audioSequence = (0, import_react13.useMemo)(() => {
|
|
14009
14125
|
if (!ttsAudioUrls || !content) return [];
|
|
14010
14126
|
const sequence = [];
|
|
14011
14127
|
if (ttsAudioUrls.notice_banner_heading_audio_url) {
|
|
@@ -14066,7 +14182,7 @@ var RedactoNoticeAssisted = ({
|
|
|
14066
14182
|
}
|
|
14067
14183
|
return sequence;
|
|
14068
14184
|
}, [ttsAudioUrls, content, displayedPurposes]);
|
|
14069
|
-
const elementIdSequence = (0,
|
|
14185
|
+
const elementIdSequence = (0, import_react13.useMemo)(() => {
|
|
14070
14186
|
if (!ttsAudioUrls || !content) return [];
|
|
14071
14187
|
const elementIds = [];
|
|
14072
14188
|
if (ttsAudioUrls.notice_banner_heading_audio_url) {
|
|
@@ -14123,7 +14239,7 @@ var RedactoNoticeAssisted = ({
|
|
|
14123
14239
|
}
|
|
14124
14240
|
return elementIds;
|
|
14125
14241
|
}, [ttsAudioUrls, content, displayedPurposes]);
|
|
14126
|
-
const stopAudio = (0,
|
|
14242
|
+
const stopAudio = (0, import_react13.useCallback)(() => {
|
|
14127
14243
|
if (currentAudioRef.current) {
|
|
14128
14244
|
currentAudioRef.current.pause();
|
|
14129
14245
|
currentAudioRef.current.currentTime = 0;
|
|
@@ -14134,7 +14250,7 @@ var RedactoNoticeAssisted = ({
|
|
|
14134
14250
|
setCurrentAudioIndex(0);
|
|
14135
14251
|
setHighlightedElementId(null);
|
|
14136
14252
|
}, []);
|
|
14137
|
-
const playNextAudio = (0,
|
|
14253
|
+
const playNextAudio = (0, import_react13.useCallback)(
|
|
14138
14254
|
(index) => {
|
|
14139
14255
|
if (index >= audioSequence.length) {
|
|
14140
14256
|
stopAudio();
|
|
@@ -14167,7 +14283,7 @@ var RedactoNoticeAssisted = ({
|
|
|
14167
14283
|
},
|
|
14168
14284
|
[audioSequence, elementIdSequence, stopAudio]
|
|
14169
14285
|
);
|
|
14170
|
-
const playAudio = (0,
|
|
14286
|
+
const playAudio = (0, import_react13.useCallback)(() => {
|
|
14171
14287
|
if (audioSequence.length === 0) return;
|
|
14172
14288
|
if (isPaused && currentAudioRef.current) {
|
|
14173
14289
|
currentAudioRef.current.play().then(() => {
|
|
@@ -14181,21 +14297,21 @@ var RedactoNoticeAssisted = ({
|
|
|
14181
14297
|
playNextAudio(startIndex);
|
|
14182
14298
|
}
|
|
14183
14299
|
}, [audioSequence, isPaused, isPlaying, currentAudioIndex, playNextAudio]);
|
|
14184
|
-
const pauseAudio = (0,
|
|
14300
|
+
const pauseAudio = (0, import_react13.useCallback)(() => {
|
|
14185
14301
|
if (currentAudioRef.current && isPlaying) {
|
|
14186
14302
|
currentAudioRef.current.pause();
|
|
14187
14303
|
setIsPlaying(false);
|
|
14188
14304
|
setIsPaused(true);
|
|
14189
14305
|
}
|
|
14190
14306
|
}, [isPlaying]);
|
|
14191
|
-
const toggleAudio = (0,
|
|
14307
|
+
const toggleAudio = (0, import_react13.useCallback)(() => {
|
|
14192
14308
|
if (isPlaying) {
|
|
14193
14309
|
pauseAudio();
|
|
14194
14310
|
} else {
|
|
14195
14311
|
playAudio();
|
|
14196
14312
|
}
|
|
14197
14313
|
}, [isPlaying, playAudio, pauseAudio]);
|
|
14198
|
-
(0,
|
|
14314
|
+
(0, import_react13.useEffect)(() => {
|
|
14199
14315
|
setIsTTSAvailable(false);
|
|
14200
14316
|
setTtsAudioUrls(null);
|
|
14201
14317
|
stopAudio();
|
|
@@ -14226,7 +14342,7 @@ var RedactoNoticeAssisted = ({
|
|
|
14226
14342
|
baseUrl,
|
|
14227
14343
|
stopAudio
|
|
14228
14344
|
]);
|
|
14229
|
-
(0,
|
|
14345
|
+
(0, import_react13.useEffect)(() => {
|
|
14230
14346
|
const elementId = elementIdSequence[currentAudioIndex];
|
|
14231
14347
|
if (!isPlaying || !elementId) {
|
|
14232
14348
|
return;
|
|
@@ -14244,7 +14360,7 @@ var RedactoNoticeAssisted = ({
|
|
|
14244
14360
|
displayedPurposes,
|
|
14245
14361
|
collapsedPurposes
|
|
14246
14362
|
]);
|
|
14247
|
-
(0,
|
|
14363
|
+
(0, import_react13.useEffect)(() => {
|
|
14248
14364
|
const removeAllHighlights = () => {
|
|
14249
14365
|
document.querySelectorAll(".redacto-tts-highlight").forEach((el) => {
|
|
14250
14366
|
el.classList.remove("redacto-tts-highlight");
|
|
@@ -14275,7 +14391,7 @@ var RedactoNoticeAssisted = ({
|
|
|
14275
14391
|
removeAllHighlights();
|
|
14276
14392
|
};
|
|
14277
14393
|
}, [highlightedElementId, isPlaying]);
|
|
14278
|
-
const handleConfirmStep = (0,
|
|
14394
|
+
const handleConfirmStep = (0, import_react13.useCallback)(
|
|
14279
14395
|
(mode = "selected") => {
|
|
14280
14396
|
if (mode !== "selected" && content) {
|
|
14281
14397
|
const selection = buildSelectionForMode(
|
|
@@ -14300,15 +14416,15 @@ var RedactoNoticeAssisted = ({
|
|
|
14300
14416
|
},
|
|
14301
14417
|
[content, selectedPurposes, selectedDataElements, verifyMethod, stopAudio]
|
|
14302
14418
|
);
|
|
14303
|
-
const handleAcceptAll = (0,
|
|
14419
|
+
const handleAcceptAll = (0, import_react13.useCallback)(
|
|
14304
14420
|
() => handleConfirmStep("all"),
|
|
14305
14421
|
[handleConfirmStep]
|
|
14306
14422
|
);
|
|
14307
|
-
const handleAcceptSelected = (0,
|
|
14423
|
+
const handleAcceptSelected = (0, import_react13.useCallback)(
|
|
14308
14424
|
() => handleConfirmStep("selected"),
|
|
14309
14425
|
[handleConfirmStep]
|
|
14310
14426
|
);
|
|
14311
|
-
const handleEditSelections = (0,
|
|
14427
|
+
const handleEditSelections = (0, import_react13.useCallback)(() => {
|
|
14312
14428
|
setAcceptMode("selected");
|
|
14313
14429
|
setStep("notice");
|
|
14314
14430
|
setOtpSent(false);
|
|
@@ -14322,7 +14438,7 @@ var RedactoNoticeAssisted = ({
|
|
|
14322
14438
|
}, []);
|
|
14323
14439
|
const otpRecipient = verifyMethod === "email" ? email.trim() : `${ASSISTED_CONFIG.dialCode}${mobile}`;
|
|
14324
14440
|
const otpChannel = verifyMethod === "email" ? ASSISTED_CONFIG.emailChannel : ASSISTED_CONFIG.channel;
|
|
14325
|
-
const sendOtp = (0,
|
|
14441
|
+
const sendOtp = (0, import_react13.useCallback)(async () => {
|
|
14326
14442
|
setCreateError(null);
|
|
14327
14443
|
setIsSendingOtp(true);
|
|
14328
14444
|
try {
|
|
@@ -14348,11 +14464,11 @@ var RedactoNoticeAssisted = ({
|
|
|
14348
14464
|
setIsSendingOtp(false);
|
|
14349
14465
|
}
|
|
14350
14466
|
}, [organisationUuid, workspaceUuid, otpRecipient, otpChannel, baseUrl, ts]);
|
|
14351
|
-
const handleGetOtp = (0,
|
|
14467
|
+
const handleGetOtp = (0, import_react13.useCallback)(() => {
|
|
14352
14468
|
if (!isContactValid || isSendingOtp) return;
|
|
14353
14469
|
void sendOtp();
|
|
14354
14470
|
}, [isContactValid, isSendingOtp, sendOtp]);
|
|
14355
|
-
const handleSelectMethod = (0,
|
|
14471
|
+
const handleSelectMethod = (0, import_react13.useCallback)(
|
|
14356
14472
|
(method) => {
|
|
14357
14473
|
if (otpSent || isSendingOtp) return;
|
|
14358
14474
|
setVerifyMethod(method);
|
|
@@ -14364,11 +14480,11 @@ var RedactoNoticeAssisted = ({
|
|
|
14364
14480
|
},
|
|
14365
14481
|
[otpSent, isSendingOtp]
|
|
14366
14482
|
);
|
|
14367
|
-
const handleResend = (0,
|
|
14483
|
+
const handleResend = (0, import_react13.useCallback)(() => {
|
|
14368
14484
|
if (isSendingOtp) return;
|
|
14369
14485
|
void sendOtp();
|
|
14370
14486
|
}, [isSendingOtp, sendOtp]);
|
|
14371
|
-
const handleChangeContact = (0,
|
|
14487
|
+
const handleChangeContact = (0, import_react13.useCallback)(() => {
|
|
14372
14488
|
setOtpSent(false);
|
|
14373
14489
|
setOtpUuid("");
|
|
14374
14490
|
setOtpDigits(Array.from({ length: ASSISTED_CONFIG.otpLength }, () => ""));
|
|
@@ -14380,7 +14496,7 @@ var RedactoNoticeAssisted = ({
|
|
|
14380
14496
|
(_a2 = (verifyMethod === "email" ? emailInputRef : mobileInputRef).current) == null ? void 0 : _a2.focus();
|
|
14381
14497
|
}, 0);
|
|
14382
14498
|
}, [verifyMethod]);
|
|
14383
|
-
const handleOtpChange = (0,
|
|
14499
|
+
const handleOtpChange = (0, import_react13.useCallback)((index, raw) => {
|
|
14384
14500
|
var _a2;
|
|
14385
14501
|
const digit = raw.replace(/\D/g, "").slice(-1);
|
|
14386
14502
|
setOtpDigits((prev) => {
|
|
@@ -14392,7 +14508,7 @@ var RedactoNoticeAssisted = ({
|
|
|
14392
14508
|
(_a2 = otpInputRefs.current[index + 1]) == null ? void 0 : _a2.focus();
|
|
14393
14509
|
}
|
|
14394
14510
|
}, []);
|
|
14395
|
-
const handleOtpKeyDown = (0,
|
|
14511
|
+
const handleOtpKeyDown = (0, import_react13.useCallback)(
|
|
14396
14512
|
(index, e) => {
|
|
14397
14513
|
var _a2;
|
|
14398
14514
|
if (e.key === "Backspace" && !otpDigits[index] && index > 0) {
|
|
@@ -14401,7 +14517,7 @@ var RedactoNoticeAssisted = ({
|
|
|
14401
14517
|
},
|
|
14402
14518
|
[otpDigits]
|
|
14403
14519
|
);
|
|
14404
|
-
const handleOtpPaste = (0,
|
|
14520
|
+
const handleOtpPaste = (0, import_react13.useCallback)((e) => {
|
|
14405
14521
|
var _a2;
|
|
14406
14522
|
const pasted = e.clipboardData.getData("text").replace(/\D/g, "").slice(0, ASSISTED_CONFIG.otpLength);
|
|
14407
14523
|
if (!pasted) return;
|
|
@@ -14418,7 +14534,7 @@ var RedactoNoticeAssisted = ({
|
|
|
14418
14534
|
const focusIndex = Math.min(pasted.length, ASSISTED_CONFIG.otpLength - 1);
|
|
14419
14535
|
(_a2 = otpInputRefs.current[focusIndex]) == null ? void 0 : _a2.focus();
|
|
14420
14536
|
}, []);
|
|
14421
|
-
const resetFlow = (0,
|
|
14537
|
+
const resetFlow = (0, import_react13.useCallback)(() => {
|
|
14422
14538
|
var _a2;
|
|
14423
14539
|
setStep("notice");
|
|
14424
14540
|
const preselection = buildPreselection(
|
|
@@ -14437,7 +14553,7 @@ var RedactoNoticeAssisted = ({
|
|
|
14437
14553
|
setCreateError(null);
|
|
14438
14554
|
setOtpError(null);
|
|
14439
14555
|
}, [content]);
|
|
14440
|
-
const handleSuccess = (0,
|
|
14556
|
+
const handleSuccess = (0, import_react13.useCallback)(() => {
|
|
14441
14557
|
if (onComplete) {
|
|
14442
14558
|
onComplete();
|
|
14443
14559
|
return;
|
|
@@ -14445,7 +14561,7 @@ var RedactoNoticeAssisted = ({
|
|
|
14445
14561
|
console.log("[RedactoNoticeAssisted] consent recorded");
|
|
14446
14562
|
resetFlow();
|
|
14447
14563
|
}, [onComplete, resetFlow]);
|
|
14448
|
-
const handleConfirm = (0,
|
|
14564
|
+
const handleConfirm = (0, import_react13.useCallback)(async () => {
|
|
14449
14565
|
if (!isOtpComplete || isVerifying || !content) return;
|
|
14450
14566
|
setOtpError(null);
|
|
14451
14567
|
setIsVerifying(true);
|
|
@@ -14538,7 +14654,7 @@ var RedactoNoticeAssisted = ({
|
|
|
14538
14654
|
handleSuccess,
|
|
14539
14655
|
ts
|
|
14540
14656
|
]);
|
|
14541
|
-
const handleDecline = (0,
|
|
14657
|
+
const handleDecline = (0, import_react13.useCallback)(() => {
|
|
14542
14658
|
if (onDecline) {
|
|
14543
14659
|
onDecline();
|
|
14544
14660
|
return;
|
|
@@ -15434,20 +15550,29 @@ var RedactoNoticePreview = ({
|
|
|
15434
15550
|
) });
|
|
15435
15551
|
|
|
15436
15552
|
// src/RedactoNoticeConsent/components/DigiLockerCallback.tsx
|
|
15437
|
-
var
|
|
15553
|
+
var import_react14 = require("react");
|
|
15438
15554
|
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
15555
|
+
var sameOriginUrlOrRoot = (candidate) => {
|
|
15556
|
+
if (!candidate) return "/";
|
|
15557
|
+
try {
|
|
15558
|
+
const url = new URL(candidate, window.location.origin);
|
|
15559
|
+
return url.origin === window.location.origin ? url.href : "/";
|
|
15560
|
+
} catch {
|
|
15561
|
+
return "/";
|
|
15562
|
+
}
|
|
15563
|
+
};
|
|
15439
15564
|
var DigiLockerCallback = ({
|
|
15440
15565
|
accessToken: propAccessToken,
|
|
15441
15566
|
baseUrl,
|
|
15442
15567
|
onSuccess,
|
|
15443
15568
|
onError
|
|
15444
15569
|
}) => {
|
|
15445
|
-
const [status, setStatus] = (0,
|
|
15446
|
-
const [message, setMessage] = (0,
|
|
15447
|
-
const [errorDetail, setErrorDetail] = (0,
|
|
15448
|
-
const retryTimeoutRef = (0,
|
|
15449
|
-
const redirectTimeoutRef = (0,
|
|
15450
|
-
const isMountedRef = (0,
|
|
15570
|
+
const [status, setStatus] = (0, import_react14.useState)("processing");
|
|
15571
|
+
const [message, setMessage] = (0, import_react14.useState)("Verifying your guardian...");
|
|
15572
|
+
const [errorDetail, setErrorDetail] = (0, import_react14.useState)(null);
|
|
15573
|
+
const retryTimeoutRef = (0, import_react14.useRef)(null);
|
|
15574
|
+
const redirectTimeoutRef = (0, import_react14.useRef)(null);
|
|
15575
|
+
const isMountedRef = (0, import_react14.useRef)(true);
|
|
15451
15576
|
const getErrorMessage = (errorCode) => {
|
|
15452
15577
|
switch (errorCode) {
|
|
15453
15578
|
case "GUARDIAN_UNDER_18":
|
|
@@ -15464,7 +15589,7 @@ var DigiLockerCallback = ({
|
|
|
15464
15589
|
return "Verification failed. Please try again.";
|
|
15465
15590
|
}
|
|
15466
15591
|
};
|
|
15467
|
-
const redirectToOriginalPage = (0,
|
|
15592
|
+
const redirectToOriginalPage = (0, import_react14.useCallback)(
|
|
15468
15593
|
(originalUrl, verificationResult, verificationReference) => {
|
|
15469
15594
|
updateConsentState({
|
|
15470
15595
|
verificationResult,
|
|
@@ -15472,12 +15597,12 @@ var DigiLockerCallback = ({
|
|
|
15472
15597
|
flowState: verificationResult === "verified" ? "consent-form" : "error"
|
|
15473
15598
|
});
|
|
15474
15599
|
redirectTimeoutRef.current = setTimeout(() => {
|
|
15475
|
-
window.location.href = originalUrl;
|
|
15600
|
+
window.location.href = sameOriginUrlOrRoot(originalUrl);
|
|
15476
15601
|
}, 1500);
|
|
15477
15602
|
},
|
|
15478
15603
|
[]
|
|
15479
15604
|
);
|
|
15480
|
-
const handleCallback = (0,
|
|
15605
|
+
const handleCallback = (0, import_react14.useCallback)(async () => {
|
|
15481
15606
|
var _a, _b;
|
|
15482
15607
|
try {
|
|
15483
15608
|
const params = new URLSearchParams(window.location.search);
|
|
@@ -15544,7 +15669,7 @@ var DigiLockerCallback = ({
|
|
|
15544
15669
|
return;
|
|
15545
15670
|
}
|
|
15546
15671
|
setMessage("Processing verification...");
|
|
15547
|
-
const apiBaseUrl = baseUrl || storedBaseUrl;
|
|
15672
|
+
const apiBaseUrl = resolveEndpoints(baseUrl || storedBaseUrl).baseUrl;
|
|
15548
15673
|
const response = await verifyGuardianStatus({
|
|
15549
15674
|
accessToken,
|
|
15550
15675
|
baseUrl: apiBaseUrl,
|
|
@@ -15692,7 +15817,7 @@ var DigiLockerCallback = ({
|
|
|
15692
15817
|
}
|
|
15693
15818
|
}
|
|
15694
15819
|
}, [propAccessToken, baseUrl, onSuccess, onError, redirectToOriginalPage]);
|
|
15695
|
-
(0,
|
|
15820
|
+
(0, import_react14.useEffect)(() => {
|
|
15696
15821
|
injectCheckboxStyles();
|
|
15697
15822
|
handleCallback();
|
|
15698
15823
|
return () => {
|
|
@@ -15701,11 +15826,11 @@ var DigiLockerCallback = ({
|
|
|
15701
15826
|
if (redirectTimeoutRef.current) clearTimeout(redirectTimeoutRef.current);
|
|
15702
15827
|
};
|
|
15703
15828
|
}, [handleCallback]);
|
|
15704
|
-
const handleRetry = (0,
|
|
15829
|
+
const handleRetry = (0, import_react14.useCallback)(() => {
|
|
15705
15830
|
const persistedState = getConsentState();
|
|
15706
15831
|
if (persistedState == null ? void 0 : persistedState.originalUrl) {
|
|
15707
15832
|
clearConsentState();
|
|
15708
|
-
window.location.href = persistedState.originalUrl;
|
|
15833
|
+
window.location.href = sameOriginUrlOrRoot(persistedState.originalUrl);
|
|
15709
15834
|
} else {
|
|
15710
15835
|
window.location.href = "/";
|
|
15711
15836
|
}
|