structural-codes-viewer 0.1.0-alpha.1 → 0.1.0-alpha.3

package/package-dist/NormativeViewer.js

@@ -1,37 +1,219 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useMemo, useRef, useState } from "react";
-import { documentForMode, loadChunk, loadDocumentIndex, loadManifest, loadRelations, loadSearchIndex, } from "./corpusData";
-import { BlockContent, isRepeatedUnitTitle } from "./CorpusContent";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useCallback, useEffect, useId, useLayoutEffect, useMemo, useRef, useState } from "react";
+import { adjacentChunkPaths, createDocumentLookup, documentForMode, initialUnitForIndex, loadChunk, loadCrossReferenceIndex, loadDocumentIndex, loadManifest, loadRelations, } from "./corpusData";
+import { AlignedLabelList, BlockContent, groupAlignedLabelBlocks, hasAlphabeticListMarker, hasAlphaRatioListLayout, hasInferredAlphaRatioListMarker, hasLeadingEmphasisLabel, hasLeadingMath, hasNoListMarker, hasOfficialListMarker, hasSimpleDashMarker, hasTrailingMath, hasTrailingStrong, indentLevelClass, isRepeatedUnitTitle, listLevelClass, listMarkerClass, renderInlineSegments } from "./CorpusContent";
+import { useViewerSearch } from "./searchClient";
+import { createCrossReferenceLookup, resolveCrossReference } from "./crossReferences.js";
+import { ReferencePreview } from "./ReferenceTools";
+import { targetFromUrl, urlForViewerTarget } from "./permalinks";
+import { isChunkNearRenderedWindow, navigationChunkWindow, progressiveChunkTargetsForVisibleUnit } from "./chunkNavigation.js";
+import { buildGlobalScrubberEntries, createGlobalScrubberDragSession, globalScrubberKeyboardIndex, globalScrubberRatioForId, resolveGlobalScrubberActiveId } from "./globalScrubber.js";
+import { AnnotationContextMenu, AnnotationEditor, AnnotationMarginMarker } from "./annotations/AnnotationUi";
+import { annotationPositionRanks, annotationsForTarget, annotationTargetFromElement, automaticAnnotationLabel, clusterAnnotationMarkers, createLongPressSession } from "./annotations/annotationTargets";
+import { annotationTargetKey } from "./annotations/schema";
 const modeOptions = [
-    { id: "combined", label: "NTC 2018 + Circolare 7/2019" },
     { id: "ntc", label: "Solo NTC 2018" },
     { id: "circ", label: "Solo Circolare 7/2019" },
+    { id: "combined", label: "NTC 2018 + Circolare 7/2019" },
 ];
-const hierarchyLabels = ["Capitoli", "Paragrafi", "Sottoparagrafi", "Dettagli"];
-const maxContinuousChapterBytes = 2500000;
-const maxContinuousChapterUnits = 220;
+const ModeSegmentedControl = memo(function ModeSegmentedControl({ mode, onChange }) {
+    const tooltipBaseId = useId();
+    return _jsx("div", { className: "scv-mode-switch", role: "group", "aria-label": "Modalit\u00E0 documento", children: modeOptions.map((option) => {
+            const tooltipId = `${tooltipBaseId}-${option.id}`;
+            return _jsxs("button", { type: "button", className: `scv-mode-button ${mode === option.id ? "active" : ""}`, onClick: () => onChange(option.id), "aria-label": option.label, "aria-describedby": tooltipId, "aria-pressed": mode === option.id, children: [_jsx("span", { className: "scv-mode-label", children: option.id === "ntc" ? _jsxs(_Fragment, { children: ["NTC", _jsx("br", {}), "2018"] }) : option.id === "circ" ? _jsxs(_Fragment, { children: ["CIRC.", _jsx("br", {}), "2019"] }) : _jsxs(_Fragment, { children: ["NTC", _jsx("br", {}), "CIRC."] }) }), _jsx("span", { id: tooltipId, className: "scv-control-tooltip scv-mode-tooltip", role: "tooltip", children: option.label })] }, option.id);
+        }) });
+});
+function scvBlockClass(block, sourceUnitId) {
+    const catenaryLabel = (sourceUnitId === null || sourceUnitId === void 0 ? void 0 : sourceUnitId.endsWith(":5.2.2.9.1")) && block.kind === "list-item" && block.listMarker === "none";
+    const alphaRatioLayout = hasAlphaRatioListLayout(block, sourceUnitId);
+    const inferredAlphaRatioMarker = hasInferredAlphaRatioListMarker(block, sourceUnitId);
+    const officialMarker = hasOfficialListMarker(block) || inferredAlphaRatioMarker;
+    const levelClass = listLevelClass(block) || (alphaRatioLayout ? "list-item-level-1" : "");
+    return `scv-block scv-block-${block.kind} ${officialMarker ? "list-item-with-official-marker" : ""} ${hasAlphabeticListMarker(block) ? "list-item-with-alphabetic-marker" : ""} ${hasSimpleDashMarker(block) && !inferredAlphaRatioMarker ? "list-item-with-simple-dash" : ""} ${hasNoListMarker(block) ? "list-item-without-marker" : ""} ${listMarkerClass(block)} ${levelClass} ${indentLevelClass(block)} ${hasLeadingMath(block) ? "list-item-with-leading-symbol" : ""} ${hasLeadingEmphasisLabel(block) ? "block-with-leading-label" : ""} ${hasTrailingStrong(block) ? "list-item-with-trailing-siglum" : ""} ${hasTrailingMath(block) ? "list-item-with-trailing-symbol" : ""} ${catenaryLabel ? "list-item-with-catenary-label" : ""} ${alphaRatioLayout ? "list-item-with-alpha-ratio" : ""}`;
+}
+function blockAssetKind(block, assets) {
+    if (!block.assetId)
+        return undefined;
+    if (assets.formulas[block.assetId])
+        return "formula";
+    if (assets.tables[block.assetId])
+        return "table";
+    if (assets.figures[block.assetId])
+        return "figure";
+    return undefined;
+}
+const ScvBlockFlow = memo(function ScvBlockFlow({ blocks, assets, assetsBaseUrl, sourceUnitId, sourceDocument, notesByTarget, onOpenAnnotation }) {
+    return _jsx("div", { className: "scv-unit-blocks", children: groupAlignedLabelBlocks(blocks).map((group) => {
+            var _a;
+            return group.kind === "label-list"
+                ? _jsx(AlignedLabelList, { blocks: group.blocks, assets: assets, assetsBaseUrl: assetsBaseUrl, sourceUnitId: sourceUnitId, sourceDocument: sourceDocument, renderAccessory: (block) => { var _a; return _jsx(AnnotationMarginMarker, { notes: (_a = notesByTarget.get(annotationTargetKey({ kind: "block", unitId: sourceUnitId, blockId: block.blockId }))) !== null && _a !== void 0 ? _a : [], onOpen: onOpenAnnotation }); } }, group.blocks[0].blockId)
+                : _jsxs("div", { tabIndex: 0, className: scvBlockClass(group.block, sourceUnitId), "data-scv-citation-target": group.block.assetId ? "asset" : "block", "data-scv-source-unit-id": sourceUnitId, "data-scv-block-id": group.block.blockId, "data-scv-asset-id": group.block.assetId, "data-scv-asset-kind": blockAssetKind(group.block, assets), children: [_jsx(BlockContent, { block: group.block, assets: assets, assetsBaseUrl: assetsBaseUrl, sourceUnitId: sourceUnitId, sourceDocument: sourceDocument }), _jsx(AnnotationMarginMarker, { notes: (_a = notesByTarget.get(annotationTargetKey(group.block.assetId ? { kind: "asset", unitId: sourceUnitId, assetId: group.block.assetId, assetKind: blockAssetKind(group.block, assets) } : { kind: "block", unitId: sourceUnitId, blockId: group.block.blockId }))) !== null && _a !== void 0 ? _a : [], onOpen: onOpenAnnotation })] }, group.block.blockId);
+        }) });
+});
+function AuxiliaryContent({ panel, context }) {
+    return typeof panel === "function" ? panel(context) : panel;
+}
+function viewerHistoryEntry(state) {
+    if (!state || typeof state !== "object" || !("scvNavigation" in state))
+        return null;
+    const entry = state.scvNavigation;
+    return entry && typeof entry === "object" && "session" in entry && "index" in entry && "scrollTop" in entry
+        && typeof entry.session === "string" && typeof entry.index === "number" && typeof entry.scrollTop === "number" ? entry : null;
+}
+function withViewerHistoryEntry(state, entry) {
+    return Object.assign(Object.assign({}, (state && typeof state === "object" ? state : {})), { scvNavigation: entry });
+}
+const chunkUnitMaps = new WeakMap();
+const emptyRelatedRecords = [];
+const emptyNavigationEntries = [];
+function unitsForChunk(chunk) {
+    let map = chunkUnitMaps.get(chunk);
+    if (!map) {
+        map = new Map(chunk.units.map((unit) => [unit.id, unit]));
+        chunkUnitMaps.set(chunk, map);
+    }
+    return map;
+}
 function depth(unit) {
     return unit.hierarchy.ancestorIds.length;
 }
-function ancestorIdAtDepth(unit, targetDepth) {
+function hasUnitContent(unit) {
+    return unit.blocks.some((block) => {
+        var _a, _b;
+        if (block.kind === "heading" || block.blockId === unit.titleBlockId)
+            return false;
+        return Boolean(block.assetId || ((_b = (_a = block.text) === null || _a === void 0 ? void 0 : _a.normalized) === null || _b === void 0 ? void 0 : _b.trim()));
+    });
+}
+function baseNumbering(value) {
+    return value.replace(/^C/iu, "");
+}
+function compareNumbering(left, right) {
+    return left.numbering.sortKey.localeCompare(right.numbering.sortKey, "it", { numeric: true });
+}
+function compareBaseNumbering(left, right) {
+    return baseNumbering(left.numbering.official).localeCompare(baseNumbering(right.numbering.official), "it", { numeric: true });
+}
+function parentNumbering(value) {
+    const parts = value.split(".");
+    parts.pop();
+    return parts.join(".") || null;
+}
+function findTextUnit(root, unitId) {
     var _a;
-    return depth(unit) === targetDepth ? unit.id : (_a = unit.hierarchy.ancestorIds[targetDepth]) !== null && _a !== void 0 ? _a : null;
+    return (_a = root === null || root === void 0 ? void 0 : root.querySelector(`[data-scv-text-unit="${CSS.escape(unitId)}"]`)) !== null && _a !== void 0 ? _a : null;
 }
-function containsUnit(unit, ancestorId) {
-    return unit.id === ancestorId || unit.hierarchy.ancestorIds.includes(ancestorId);
+function scrollElementIntoPane(root, target) {
+    var _a;
+    const top = root.scrollTop + target.getBoundingClientRect().top - root.getBoundingClientRect().top;
+    const contextBar = (_a = root.parentElement) === null || _a === void 0 ? void 0 : _a.querySelector(".scv-mobile-context");
+    const offset = contextBar && window.getComputedStyle(contextBar).display !== "none"
+        ? Math.max(18, contextBar.getBoundingClientRect().bottom - root.getBoundingClientRect().top + 10) : 18;
+    root.scrollTo({ top: Math.max(0, top - offset), behavior: "auto" });
 }
-function normalizedQuery(value) {
-    return value.normalize("NFKC").trim().toLocaleLowerCase("it");
+function scrollTextUnit(root, unitId) {
+    const target = findTextUnit(root, unitId);
+    if (!root || !target)
+        return false;
+    scrollElementIntoPane(root, target);
+    return true;
 }
-function updateDeepLink(mode, unitId, defaultMode) {
-    const url = new URL(window.location.href);
-    if (mode === defaultMode)
-        url.searchParams.delete("mode");
-    else
-        url.searchParams.set("mode", mode);
-    url.searchParams.set("unit", unitId);
-    window.history.replaceState(null, "", url);
+function findViewerTarget(root, target) {
+    if (!root)
+        return null;
+    const unitId = CSS.escape(target.unitId);
+    if (target.kind === "unit")
+        return root.querySelector(`[data-scv-text-unit="${unitId}"], [data-scv-related-unit="${unitId}"]`);
+    if (target.kind === "block")
+        return root.querySelector(`[data-scv-source-unit-id="${unitId}"][data-scv-block-id="${CSS.escape(target.blockId)}"]`);
+    return root.querySelector(`[data-scv-source-unit-id="${unitId}"][data-scv-asset-id="${CSS.escape(target.assetId)}"]`);
+}
+function scrollViewerTarget(root, target) {
+    const element = findViewerTarget(root, target);
+    if (!root || !element)
+        return false;
+    scrollElementIntoPane(root, element);
+    return true;
+}
+async function writeTextClipboard(value) {
+    var _a;
+    if ((_a = navigator.clipboard) === null || _a === void 0 ? void 0 : _a.writeText) {
+        await navigator.clipboard.writeText(value);
+        return;
+    }
+    const input = document.createElement("textarea");
+    input.value = value;
+    input.style.cssText = "position:fixed;left:-10000px;top:-10000px";
+    document.body.append(input);
+    try {
+        input.select();
+        if (!document.execCommand("copy"))
+            throw new Error("Copia non consentita.");
+    }
+    finally {
+        input.remove();
+    }
+}
+function updateDeepLink(mode, target, defaultMode, action = "replace", state = window.history.state) {
+    const url = urlForViewerTarget(window.location.href, mode, defaultMode, target);
+    window.history[`${action}State`](state, "", url);
+}
+function documentFromUnitId(unitId) {
+    return unitId.includes(":circ2019:") ? "circ2019" : "ntc2018";
+}
+function referenceDescriptor(element) {
+    const kind = element.dataset.scvReferenceKind;
+    const number = element.dataset.scvReferenceNumber;
+    const sourceUnitId = element.dataset.scvSourceUnitId;
+    const sourceDocument = element.dataset.scvSourceDocument;
+    if (!kind || !number || !sourceUnitId || !sourceDocument)
+        return null;
+    const hint = element.dataset.scvReferenceDocument;
+    return { kind, number, sourceUnitId, sourceDocument, documentHint: hint === "ntc2018" || hint === "circ2019" ? hint : null };
+}
+function citationSelectionFromElement(element) {
+    const kind = element.dataset.scvCitationTarget;
+    const unitId = element.dataset.scvSourceUnitId;
+    if (!unitId)
+        return null;
+    if (kind === "asset" && element.dataset.scvAssetId) {
+        const assetKind = element.dataset.scvAssetKind;
+        return { kind: "asset", unitId, assetId: element.dataset.scvAssetId, assetKind: assetKind === "formula" || assetKind === "table" || assetKind === "figure" ? assetKind : undefined };
+    }
+    if (kind === "block" && element.dataset.scvBlockId)
+        return { kind: "block", unitId, blockId: element.dataset.scvBlockId };
+    if (kind === "unit")
+        return { kind: "unit", unitId };
+    return null;
+}
+function viewerTargetForReference(reference) {
+    if (!reference.asset)
+        return { kind: "unit", unitId: reference.unit.id };
+    return { kind: "asset", unitId: reference.unit.id, assetId: reference.asset.id, assetKind: reference.asset.kind };
+}
+function viewerTargetForSearchResult(result) {
+    if (result.assetId)
+        return { kind: "asset", unitId: result.id, assetId: result.assetId, assetKind: result.assetKind };
+    if (result.blockId)
+        return { kind: "block", unitId: result.id, blockId: result.blockId };
+    return { kind: "unit", unitId: result.id };
+}
+function sameViewerTarget(left, right) {
+    if (!left || left.kind !== right.kind || left.unitId !== right.unitId)
+        return false;
+    if (left.kind === "block" && right.kind === "block")
+        return left.blockId === right.blockId;
+    if (left.kind === "asset" && right.kind === "asset")
+        return left.assetId === right.assetId;
+    return left.kind === "unit" && right.kind === "unit";
+}
+function referenceLabel(reference) {
+    const document = reference.unit.document === "ntc2018" ? "NTC 2018" : "Circolare 7/2019";
+    if (!reference.asset)
+        return `${document} · § ${reference.unit.numbering}`;
+    const prefix = reference.asset.kind === "formula" ? "Formula" : reference.asset.kind === "table" ? "Tab." : "Fig.";
+    return `${document} · ${prefix} ${reference.asset.officialNumber}`;
 }
 function evidencePages(unit, chunk) {
     const pages = unit.blocks.flatMap((block) => {
@@ -45,280 +227,1563 @@ function evidencePages(unit, chunk) {
     });
     return [...new Set(pages)].sort((left, right) => left - right);
 }
-function snippet(value) {
-    const compact = value.replace(/\s+/gu, " ").trim();
-    return compact.length > 145 ? `${compact.slice(0, 142)}…` : compact;
-}
 function relationTargets(resultId, relations) {
     return relations
         .filter((edge) => edge.sourceUnitId === resultId)
         .sort((left, right) => left.targetUnitId.localeCompare(right.targetUnitId, "it", { numeric: true }));
 }
-export function NormativeViewer({ defaultMode = "combined", dataBaseUrl = "/data/codes", assetsBaseUrl = "/assets", auxiliaryPanel, auxiliaryPanelLabel = "PDF ufficiale", auxiliaryPanelDefaultVisible = false, analyticalHref, className, }) {
-    var _a, _b, _c, _d, _e;
+function matchingPrimarySummary(summary, lookup) {
+    var _a;
+    return (_a = lookup.unitByNumbering.get(baseNumbering(summary.numbering.official))) !== null && _a !== void 0 ? _a : null;
+}
+function recordsForPaths(index, lookup, paths, chunks) {
+    var _a;
+    if (!index || !lookup)
+        return [];
+    const records = [];
+    for (const path of lookup.chunkPaths) {
+        if (!paths.has(path))
+            continue;
+        const chunk = chunks.get(path);
+        if (!chunk)
+            continue;
+        const units = unitsForChunk(chunk);
+        for (const summary of (_a = lookup.unitsByChunkPath.get(path)) !== null && _a !== void 0 ? _a : []) {
+            const unit = units.get(summary.id);
+            if (unit)
+                records.push({ summary, unit, chunk });
+        }
+    }
+    return records;
+}
+function buildCombinedPlan(primaryIndex, circIndex, relations) {
+    var _a, _b;
+    const empty = { fallbackSummaries: [], circPathsByPrimaryPath: new Map(), primaryAnchorByFallbackId: new Map() };
+    if (!primaryIndex || !circIndex)
+        return empty;
+    const relatedSourceIds = new Set(relations.map((edge) => edge.sourceUnitId));
+    const fallbackSummaries = circIndex.units.filter((summary) => !relatedSourceIds.has(summary.id));
+    const primary = [...primaryIndex.units].sort(compareBaseNumbering);
+    const circPathsByPrimaryPath = new Map();
+    const primaryAnchorByFallbackId = new Map();
+    for (const fallback of fallbackSummaries) {
+        let low = 0;
+        let high = primary.length;
+        while (low < high) {
+            const middle = (low + high) >>> 1;
+            if (compareBaseNumbering(primary[middle], fallback) <= 0)
+                low = middle + 1;
+            else
+                high = middle;
+        }
+        const anchor = (_a = primary[Math.max(0, low - 1)]) !== null && _a !== void 0 ? _a : primary[0];
+        if (!anchor)
+            continue;
+        primaryAnchorByFallbackId.set(fallback.id, anchor);
+        const paths = (_b = circPathsByPrimaryPath.get(anchor.chunkPath)) !== null && _b !== void 0 ? _b : new Set();
+        paths.add(fallback.chunkPath);
+        circPathsByPrimaryPath.set(anchor.chunkPath, paths);
+    }
+    return { fallbackSummaries, circPathsByPrimaryPath, primaryAnchorByFallbackId };
+}
+function navigationEntry(summary, source = summary.document, parentId = summary.hierarchy.parentId) {
+    const rawNumber = summary.numbering.official;
+    const displayNumber = source === "circ2019" && !/^C/iu.test(rawNumber) ? `C${rawNumber}` : rawNumber;
+    const baseNumber = baseNumbering(displayNumber);
+    const level = Math.max(0, baseNumber.split(".").length - 1);
+    return { summary, source, baseNumber, displayNumber, level, parentId, parentBaseNumber: parentNumbering(baseNumber) };
+}
+function sameRelatedRecords(left, right) {
+    return left.length === right.length && left.every((record, index) => { var _a, _b; return record.edge.relationId === ((_a = right[index]) === null || _a === void 0 ? void 0 : _a.edge.relationId) && record.unit === ((_b = right[index]) === null || _b === void 0 ? void 0 : _b.unit); });
+}
+function escapeRegExp(value) {
+    return value.replace(/[.*+?^${}()|[\]\\]/gu, "\\$&");
+}
+function unitTitleContent(unit) {
+    var _a;
+    const titleBlock = unit.blocks.find((block) => block.blockId === unit.titleBlockId);
+    const inline = (_a = titleBlock === null || titleBlock === void 0 ? void 0 : titleBlock.text) === null || _a === void 0 ? void 0 : _a.inline;
+    if (!inline)
+        return unit.title;
+    const officialNumber = unit.numbering.official;
+    const prefix = new RegExp(`^${escapeRegExp(officialNumber)}\\s*`, "u");
+    const titleInline = inline.map((segment, index) => index === 0 && typeof segment.value === "string" ? Object.assign(Object.assign({}, segment), { value: segment.value.replace(prefix, "") }) : segment);
+    return renderInlineSegments(titleInline);
+}
+const MemoizedUnit = memo(function MemoizedUnit({ record, mode, relatedRecords, assetsBaseUrl, notesByTarget, onOpenAnnotation }) {
+    var _a;
+    const { unit, chunk } = record;
+    const isChapter = depth(unit) === 0;
+    const isCircularFallback = mode === "combined" && unit.document === "circ2019";
+    const visibleRelated = mode === "combined" ? relatedRecords.filter(({ unit: relatedUnit }) => hasUnitContent(relatedUnit)) : emptyRelatedRecords;
+    return _jsxs("section", { tabIndex: 0, className: `scv-unit scv-unit-depth-${Math.min(depth(unit), 4)}${isCircularFallback ? " scv-circular-fallback" : ""}`, "data-provenance": isCircularFallback ? "Circolare 7/2019" : undefined, "data-scv-text-unit": unit.id, "data-scv-citation-target": "unit", "data-scv-source-unit-id": unit.id, "data-scv-chunk-path": record.summary.chunkPath, children: [isChapter ? _jsxs("h2", { className: "scv-chapter-heading", children: [_jsxs("span", { className: "scv-chapter-badge", children: [_jsx("span", { className: "scv-chapter-badge-label", children: "Capitolo" }), _jsxs("strong", { children: [unit.numbering.official, "."] })] }), _jsx("span", { className: "scv-chapter-rule", "aria-hidden": "true" }), _jsx("span", { className: "scv-chapter-title", children: _jsx("button", { type: "button", className: "scv-permalink-trigger", "data-scv-copy-link": true, "aria-label": `Copia link al capitolo ${unit.numbering.official}`, children: unit.title }) })] }) : _jsxs("h2", { children: [_jsx("span", { className: "scv-unit-number", children: unit.numbering.official }), _jsx("span", { className: "scv-unit-title", children: _jsx("button", { type: "button", className: "scv-permalink-trigger", "data-scv-copy-link": true, "aria-label": `Copia link al paragrafo ${unit.numbering.official}`, children: unitTitleContent(unit) }) })] }), _jsx(AnnotationMarginMarker, { notes: (_a = notesByTarget.get(annotationTargetKey({ kind: "unit", unitId: unit.id }))) !== null && _a !== void 0 ? _a : [], onOpen: onOpenAnnotation }), _jsx(ScvBlockFlow, { blocks: unit.blocks.filter((block) => !isRepeatedUnitTitle(unit, block)), assets: chunk.assets, assetsBaseUrl: assetsBaseUrl, sourceUnitId: unit.id, sourceDocument: unit.document, notesByTarget: notesByTarget, onOpenAnnotation: onOpenAnnotation }), visibleRelated.map(({ edge, unit: relatedUnit, chunk: relatedChunk }) => { var _a; return _jsxs("section", { tabIndex: 0, className: "scv-related-unit", "data-provenance": "Circolare 7/2019", "data-scv-related-unit": relatedUnit.id, "data-scv-citation-target": "unit", "data-scv-source-unit-id": relatedUnit.id, children: [_jsx("header", { children: _jsxs("h3", { children: [_jsx("span", { className: "scv-related-number", children: relatedUnit.numbering.official }), _jsx("span", { className: "scv-related-title", children: _jsx("button", { type: "button", className: "scv-permalink-trigger", "data-scv-copy-link": true, "aria-label": `Copia link al paragrafo ${relatedUnit.numbering.official}`, children: relatedUnit.title }) })] }) }), _jsx(AnnotationMarginMarker, { notes: (_a = notesByTarget.get(annotationTargetKey({ kind: "unit", unitId: relatedUnit.id }))) !== null && _a !== void 0 ? _a : [], onOpen: onOpenAnnotation }), _jsx(ScvBlockFlow, { blocks: relatedUnit.blocks.filter((block) => !isRepeatedUnitTitle(relatedUnit, block)), assets: relatedChunk.assets, assetsBaseUrl: assetsBaseUrl, sourceUnitId: relatedUnit.id, sourceDocument: relatedUnit.document, notesByTarget: notesByTarget, onOpenAnnotation: onOpenAnnotation })] }, edge.relationId); })] });
+}, (previous, next) => previous.record.unit === next.record.unit && previous.record.chunk === next.record.chunk && previous.mode === next.mode && previous.assetsBaseUrl === next.assetsBaseUrl && previous.notesByTarget === next.notesByTarget && previous.onOpenAnnotation === next.onOpenAnnotation && sameRelatedRecords(previous.relatedRecords, next.relatedRecords));
+const DocumentContent = memo(function DocumentContent({ records, relatedByTarget, mode, assetsBaseUrl, documentLabel, documentUnits, documentChunks, hasPrevious, hasNext, notesByTarget, onOpenAnnotation }) {
+    if (records.length === 0)
+        return _jsx(LoadingPanel, { label: "Caricamento dei contenuti\u2026" });
+    const version = records[0].chunk.structuralCodesVersion;
+    return _jsxs("div", { className: "scv-text-flow", children: [hasPrevious && _jsx("div", { className: "scv-progressive-edge", "aria-hidden": "true" }), _jsxs("p", { className: "scv-chunk-note", children: ["Documento continuo \u00B7 ", documentLabel, " \u00B7 ", documentUnits, " unit\u00E0 \u00B7 ", documentChunks, " chunk \u00B7 structural-codes ", version] }), records.map((record) => { var _a; return _jsx(MemoizedUnit, { record: record, mode: mode, relatedRecords: (_a = relatedByTarget.get(record.unit.id)) !== null && _a !== void 0 ? _a : emptyRelatedRecords, assetsBaseUrl: assetsBaseUrl, notesByTarget: notesByTarget, onOpenAnnotation: onOpenAnnotation }, record.unit.id); }), hasNext ? _jsx("div", { className: "scv-progressive-edge", "aria-hidden": "true" }) : _jsx("div", { className: "scv-end-note", children: "Fine del documento." })] });
+});
+const GlobalDocumentScrubber = memo(function GlobalDocumentScrubber({ rootRef, entries, activeId, onSelect, annotationMarkers, onAnnotationSelect }) {
+    var _a, _b, _c, _d;
+    const [interaction, setInteraction] = useState("idle");
+    const [previewEntry, setPreviewEntry] = useState(null);
+    const [openCluster, setOpenCluster] = useState(null);
+    const hideTimerRef = useRef(null);
+    const pointerFrameRef = useRef(null);
+    const pendingPointerYRef = useRef(null);
+    const dragRef = useRef(null);
+    const activeEntry = (_a = entries.find((entry) => entry.id === activeId)) !== null && _a !== void 0 ? _a : null;
+    const activeIndex = (_b = activeEntry === null || activeEntry === void 0 ? void 0 : activeEntry.index) !== null && _b !== void 0 ? _b : 0;
+    const ratio = interaction === "dragging" && previewEntry ? previewEntry.ratio : globalScrubberRatioForId(entries, activeId, (_c = activeEntry === null || activeEntry === void 0 ? void 0 : activeEntry.ratio) !== null && _c !== void 0 ? _c : 0);
+    const visible = interaction !== "idle";
+    const annotationClusters = useMemo(() => clusterAnnotationMarkers(annotationMarkers), [annotationMarkers]);
+    const clearHideTimer = useCallback(() => {
+        if (hideTimerRef.current !== null)
+            window.clearTimeout(hideTimerRef.current);
+        hideTimerRef.current = null;
+    }, []);
+    const hideLater = useCallback(() => {
+        clearHideTimer();
+        hideTimerRef.current = window.setTimeout(() => setInteraction((current) => current === "scrolling" ? "idle" : current), 1000);
+    }, [clearHideTimer]);
+    const showTransient = useCallback(() => {
+        setInteraction((current) => current === "dragging" || current === "hover" || current === "focus" ? current : "scrolling");
+        hideLater();
+    }, [hideLater]);
+    useEffect(() => {
+        const root = rootRef.current;
+        if (!root)
+            return;
+        const onScroll = () => showTransient();
+        root.addEventListener("scroll", onScroll, { passive: true });
+        return () => root.removeEventListener("scroll", onScroll);
+    }, [rootRef, showTransient]);
+    useEffect(() => () => {
+        clearHideTimer();
+        if (pointerFrameRef.current !== null)
+            window.cancelAnimationFrame(pointerFrameRef.current);
+    }, [clearHideTimer]);
+    if (entries.length < 2 || !activeEntry)
+        return null;
+    const previewPointer = (clientY) => {
+        const drag = dragRef.current;
+        if (!drag)
+            return null;
+        const entry = drag.session.preview((clientY - drag.trackTop) / Math.max(1, drag.trackHeight));
+        if (entry)
+            setPreviewEntry(entry);
+        return entry;
+    };
+    const startDrag = (event) => {
+        if (!event.isPrimary || event.button !== 0)
+            return;
+        const rect = event.currentTarget.getBoundingClientRect();
+        event.currentTarget.setPointerCapture(event.pointerId);
+        dragRef.current = { pointerId: event.pointerId, trackTop: rect.top, trackHeight: rect.height, session: createGlobalScrubberDragSession(entries, (entry) => onSelect(entry.id)) };
+        previewPointer(event.clientY);
+        setInteraction("dragging");
+        clearHideTimer();
+        event.preventDefault();
+    };
+    const moveDrag = (event) => {
+        const drag = dragRef.current;
+        if (!drag || drag.pointerId !== event.pointerId)
+            return;
+        pendingPointerYRef.current = event.clientY;
+        if (pointerFrameRef.current !== null)
+            return;
+        pointerFrameRef.current = window.requestAnimationFrame(() => {
+            pointerFrameRef.current = null;
+            if (pendingPointerYRef.current !== null)
+                previewPointer(pendingPointerYRef.current);
+        });
+    };
+    const stopDrag = (event, commit) => {
+        const drag = dragRef.current;
+        if (!drag || drag.pointerId !== event.pointerId)
+            return;
+        if (pointerFrameRef.current !== null) {
+            window.cancelAnimationFrame(pointerFrameRef.current);
+            pointerFrameRef.current = null;
+        }
+        previewPointer(event.clientY);
+        if (commit)
+            drag.session.commit();
+        else
+            drag.session.cancel();
+        dragRef.current = null;
+        pendingPointerYRef.current = null;
+        setInteraction("scrolling");
+        hideLater();
+    };
+    const onKeyDown = (event) => {
+        if (!["ArrowUp", "ArrowDown", "PageUp", "PageDown", "Home", "End"].includes(event.key))
+            return;
+        event.preventDefault();
+        const target = entries[globalScrubberKeyboardIndex(activeIndex < 0 ? 0 : activeIndex, event.key, entries.length)];
+        if (target) {
+            setPreviewEntry(target);
+            onSelect(target.id);
+        }
+    };
+    const overlayEntry = previewEntry !== null && previewEntry !== void 0 ? previewEntry : activeEntry;
+    const displayedEntry = interaction === "dragging" && previewEntry ? previewEntry : activeEntry;
+    const valueText = displayedEntry ? `§ ${displayedEntry.label} — ${displayedEntry.title}` : "Posizione nel documento";
+    return _jsxs("div", { className: `scv-scroll-rail ${visible ? "is-visible" : "is-idle"} is-${interaction}`, "aria-label": "Navigazione globale del documento", style: { "--scv-scrubber-ratio": ratio }, onMouseEnter: () => { clearHideTimer(); setInteraction((current) => current === "dragging" ? current : "hover"); }, onMouseLeave: () => { if (interaction !== "dragging" && interaction !== "focus") {
+            setInteraction("scrolling");
+            hideLater();
+        } }, onFocusCapture: () => { clearHideTimer(); setInteraction("focus"); }, onBlurCapture: () => { setInteraction("scrolling"); hideLater(); }, children: [_jsxs("div", { className: "scv-scroll-track", role: "presentation", onPointerDown: startDrag, onPointerMove: moveDrag, onPointerUp: (event) => stopDrag(event, true), onPointerCancel: (event) => stopDrag(event, false), children: [annotationClusters.map((cluster) => {
+                        var _a;
+                        const id = cluster.markers.map(({ annotation }) => annotation.id).join(":");
+                        const single = cluster.markers.length === 1 ? cluster.markers[0].annotation : null;
+                        const type = (_a = single === null || single === void 0 ? void 0 : single.type) !== null && _a !== void 0 ? _a : "cluster";
+                        const label = single ? `${single.type === "bookmark" ? "Segnalibro" : "Nota"}: § ${single.numbering} — ${single.title}` : `${cluster.markers.length} annotazioni vicine`;
+                        return _jsxs("span", { className: "scv-annotation-scrubber-group", style: { "--scv-annotation-ratio": cluster.ratio }, children: [_jsx("button", { type: "button", className: `scv-annotation-scrubber-marker is-${type}`, "aria-label": label, title: label, onPointerDown: (event) => event.stopPropagation(), onClick: (event) => { event.stopPropagation(); if (single)
+                                        onAnnotationSelect(single);
+                                    else
+                                        setOpenCluster((current) => current === id ? null : id); }, children: _jsx("span", { "aria-hidden": "true", children: type === "bookmark" ? "‹" : type === "note" ? "›" : cluster.markers.length }) }), !single && openCluster === id && _jsx("div", { className: "scv-annotation-cluster-popover", role: "menu", "aria-label": "Annotazioni vicine", children: cluster.markers.map(({ annotation }) => _jsxs("button", { type: "button", role: "menuitem", onPointerDown: (event) => event.stopPropagation(), onClick: (event) => { event.stopPropagation(); setOpenCluster(null); onAnnotationSelect(annotation); }, children: [_jsx("b", { "aria-hidden": "true", children: annotation.type === "bookmark" ? "‹" : "›" }), _jsxs("span", { children: [annotation.type === "bookmark" ? "Segnalibro" : "Nota", " \u00B7 \u00A7 ", annotation.numbering] })] }, annotation.id)) })] }, id);
+                    }), _jsx("button", { type: "button", className: "scv-scroll-thumb", role: "slider", "aria-label": "Posizione nel documento", "aria-valuemin": 1, "aria-valuemax": entries.length, "aria-valuenow": ((_d = displayedEntry === null || displayedEntry === void 0 ? void 0 : displayedEntry.index) !== null && _d !== void 0 ? _d : 0) + 1, "aria-valuetext": valueText, onKeyDown: onKeyDown })] }), interaction === "dragging" && overlayEntry && _jsxs("output", { className: "scv-scroll-overlay", "aria-live": "off", children: [_jsxs("strong", { children: ["\u00A7 ", overlayEntry.label] }), _jsx("span", { children: overlayEntry.title })] })] });
+});
+function useVisibleUnitObserver(rootRef, records, onVisible) {
+    useEffect(() => {
+        const root = rootRef.current;
+        if (!root || records.length === 0)
+            return;
+        const elements = [...root.querySelectorAll("[data-scv-text-unit]")];
+        if (elements.length === 0)
+            return;
+        const orderedIds = elements.flatMap((element) => element.dataset.scvTextUnit ? [element.dataset.scvTextUnit] : []);
+        const nearEnd = () => root.scrollTop + root.clientHeight >= root.scrollHeight - Math.max(24, root.clientHeight * 0.5);
+        if (typeof IntersectionObserver === "undefined") {
+            const positions = elements.map((element) => { var _a; return ({ id: (_a = element.dataset.scvTextUnit) !== null && _a !== void 0 ? _a : "", top: element.offsetTop }); });
+            let frame = null;
+            const update = () => {
+                frame = null;
+                const marker = root.scrollTop + Math.min(root.clientHeight * 0.28, 220);
+                let low = 0;
+                let high = positions.length;
+                while (low < high) {
+                    const middle = (low + high) >>> 1;
+                    if (positions[middle].top <= marker)
+                        low = middle + 1;
+                    else
+                        high = middle;
+                }
+                const candidate = nearEnd() ? positions[positions.length - 1] : positions[Math.max(0, low - 1)];
+                if (candidate === null || candidate === void 0 ? void 0 : candidate.id)
+                    onVisible(candidate.id);
+            };
+            const onScroll = () => { if (frame === null)
+                frame = window.requestAnimationFrame(update); };
+            root.addEventListener("scroll", onScroll, { passive: true });
+            update();
+            return () => {
+                root.removeEventListener("scroll", onScroll);
+                if (frame !== null)
+                    window.cancelAnimationFrame(frame);
+            };
+        }
+        const visible = new Set();
+        let frame = null;
+        const commit = () => {
+            frame = null;
+            for (let index = orderedIds.length - 1; index >= 0; index -= 1) {
+                if (visible.has(orderedIds[index])) {
+                    onVisible(orderedIds[index]);
+                    return;
+                }
+            }
+        };
+        const observer = new IntersectionObserver((entries) => {
+            for (const entry of entries) {
+                const id = entry.target.dataset.scvTextUnit;
+                if (!id)
+                    continue;
+                if (entry.isIntersecting)
+                    visible.add(id);
+                else
+                    visible.delete(id);
+            }
+            if (frame === null)
+                frame = window.requestAnimationFrame(commit);
+        }, { root, rootMargin: "0px 0px -72% 0px", threshold: 0.01 });
+        const onScroll = () => {
+            if (!nearEnd())
+                return;
+            const lastId = orderedIds[orderedIds.length - 1];
+            if (lastId)
+                onVisible(lastId);
+        };
+        root.addEventListener("scroll", onScroll, { passive: true });
+        for (const element of elements)
+            observer.observe(element);
+        return () => {
+            root.removeEventListener("scroll", onScroll);
+            observer.disconnect();
+            if (frame !== null)
+                window.cancelAnimationFrame(frame);
+        };
+    }, [onVisible, records, rootRef]);
+}
+function HighlightedSnippet({ result }) {
+    const parts = [];
+    let offset = 0;
+    for (const [start, end] of result.highlights) {
+        const from = Math.max(offset, Math.min(result.snippet.length, start));
+        const to = Math.max(from, Math.min(result.snippet.length, end));
+        if (from > offset)
+            parts.push(result.snippet.slice(offset, from));
+        if (to > from)
+            parts.push(_jsx("mark", { children: result.snippet.slice(from, to) }, `${from}:${to}`));
+        offset = to;
+    }
+    if (offset < result.snippet.length)
+        parts.push(result.snippet.slice(offset));
+    return _jsx(_Fragment, { children: parts });
+}
+const NavigationPane = memo(function NavigationPane({ id, mode, onModeChange, hierarchy, activeLevelIds, sidebarMode, sidebarSession, indexReady, query, onQueryChange, searchReady, searchStatus, searchSource, searchDurationMs, searchResults, onSearchSubmit, onSearchResult, onSelectUnit, onRequestClose, onHistoryBack, onHistoryForward, canHistoryBack, canHistoryForward, searchRef, darkMode, onToggleTheme }) {
+    var _a, _b, _c, _d, _e, _f;
+    const indexListRef = useRef(null);
+    const searchResultsRef = useRef(null);
+    const [searchEditing, setSearchEditing] = useState(false);
+    const [settingsOpen, setSettingsOpen] = useState(false);
+    const [sidebarExpanded, setSidebarExpanded] = useState({ session: -1, chapterId: null, paragraphId: null });
+    const lastSidebarEntryRef = useRef(null);
+    const searchResultsId = useId();
+    const settingsId = useId();
+    const themeTooltipId = useId();
+    const chapters = (_a = hierarchy[0]) !== null && _a !== void 0 ? _a : [];
+    const paragraphs = (_b = hierarchy[1]) !== null && _b !== void 0 ? _b : emptyNavigationEntries;
+    const subparagraphs = (_c = hierarchy[2]) !== null && _c !== void 0 ? _c : emptyNavigationEntries;
+    const activeChapterId = (_d = activeLevelIds[0]) !== null && _d !== void 0 ? _d : null;
+    const activeParagraphId = (_e = activeLevelIds[1]) !== null && _e !== void 0 ? _e : null;
+    const activeSubparagraphId = (_f = activeLevelIds[2]) !== null && _f !== void 0 ? _f : null;
+    const paragraphsByChapter = useMemo(() => {
+        var _a, _b, _c;
+        const grouped = new Map();
+        for (const entry of paragraphs) {
+            const group = (_b = grouped.get((_a = entry.parentId) !== null && _a !== void 0 ? _a : "")) !== null && _b !== void 0 ? _b : [];
+            group.push(entry);
+            grouped.set((_c = entry.parentId) !== null && _c !== void 0 ? _c : "", group);
+        }
+        return grouped;
+    }, [paragraphs]);
+    const subparagraphsByParagraph = useMemo(() => {
+        var _a, _b, _c;
+        const grouped = new Map();
+        for (const entry of subparagraphs) {
+            const group = (_b = grouped.get((_a = entry.parentId) !== null && _a !== void 0 ? _a : "")) !== null && _b !== void 0 ? _b : [];
+            group.push(entry);
+            grouped.set((_c = entry.parentId) !== null && _c !== void 0 ? _c : "", group);
+        }
+        return grouped;
+    }, [subparagraphs]);
+    useEffect(() => {
+        var _a;
+        const targetId = (_a = activeSubparagraphId !== null && activeSubparagraphId !== void 0 ? activeSubparagraphId : activeParagraphId) !== null && _a !== void 0 ? _a : activeChapterId;
+        if (!targetId)
+            return;
+        const timeout = window.setTimeout(() => {
+            var _a, _b;
+            const target = (_a = indexListRef.current) === null || _a === void 0 ? void 0 : _a.querySelector(`[data-index-unit="${CSS.escape(targetId)}"]`);
+            if (!target)
+                return;
+            const reducedMotion = (_b = window.matchMedia) === null || _b === void 0 ? void 0 : _b.call(window, "(prefers-reduced-motion: reduce)").matches;
+            target.scrollIntoView({ block: "nearest", behavior: reducedMotion ? "auto" : "smooth" });
+        }, 360);
+        return () => window.clearTimeout(timeout);
+    }, [activeChapterId, activeParagraphId, activeSubparagraphId]);
+    const focusSearchResult = (position) => {
+        var _a, _b, _c;
+        const results = [...((_b = (_a = searchResultsRef.current) === null || _a === void 0 ? void 0 : _a.querySelectorAll(".scv-search-result")) !== null && _b !== void 0 ? _b : [])];
+        if (results.length === 0)
+            return;
+        (_c = results[(position + results.length) % results.length]) === null || _c === void 0 ? void 0 : _c.focus();
+    };
+    const searchResultKeyDown = (event, position) => {
+        var _a, _b;
+        if (event.key === "ArrowDown") {
+            event.preventDefault();
+            focusSearchResult(position + 1);
+        }
+        else if (event.key === "ArrowUp") {
+            event.preventDefault();
+            if (position === 0)
+                (_a = searchRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+            else
+                focusSearchResult(position - 1);
+        }
+        else if (event.key === "Home") {
+            event.preventDefault();
+            focusSearchResult(0);
+        }
+        else if (event.key === "End") {
+            event.preventDefault();
+            focusSearchResult(searchResults.length - 1);
+        }
+        else if (event.key === "Escape") {
+            event.preventDefault();
+            onQueryChange("");
+            (_b = searchRef.current) === null || _b === void 0 ? void 0 : _b.focus();
+        }
+    };
+    const renderEntryButton = (entry, level, active, tabIndex, expanded) => _jsxs("button", { type: "button", "data-index-unit": entry.summary.id, className: `scv-index-entry scv-index-level-${level} ${active ? "active" : ""}`, onClick: () => {
+            var _a;
+            if (sidebarMode && expanded !== undefined) {
+                if (((_a = lastSidebarEntryRef.current) === null || _a === void 0 ? void 0 : _a.session) !== sidebarSession || lastSidebarEntryRef.current.id !== entry.summary.id) {
+                    lastSidebarEntryRef.current = { session: sidebarSession, id: entry.summary.id };
+                    setSidebarExpanded((current) => {
+                        var _a;
+                        return level === 0
+                            ? { session: sidebarSession, chapterId: entry.summary.id, paragraphId: null }
+                            : { session: sidebarSession, chapterId: (_a = entry.parentId) !== null && _a !== void 0 ? _a : current.chapterId, paragraphId: entry.summary.id };
+                    });
+                    return;
+                }
+            }
+            lastSidebarEntryRef.current = null;
+            onSelectUnit(entry.summary);
+            onRequestClose();
+        }, title: `${entry.displayNumber} ${entry.summary.title}`, "aria-current": active ? "page" : undefined, "aria-expanded": expanded, tabIndex: tabIndex, children: [_jsx("strong", { children: entry.displayNumber }), _jsx("span", { children: entry.summary.title })] });
+    return _jsxs("aside", { id: id, className: "scv-index-pane", "aria-label": "Indice gerarchico", onClickCapture: (event) => {
+            if (!event.target.closest("[data-index-unit]"))
+                lastSidebarEntryRef.current = null;
+        }, children: [_jsxs("div", { className: "scv-search-toolbar", children: [_jsxs("div", { className: "scv-history-controls", role: "group", "aria-label": "Cronologia di navigazione", children: [_jsx("button", { type: "button", "aria-label": "Indietro", disabled: !canHistoryBack, onClick: onHistoryBack, children: "\u2190" }), _jsx("button", { type: "button", "aria-label": "Avanti", disabled: !canHistoryForward, onClick: onHistoryForward, children: "\u2192" })] }), _jsxs("div", { className: `scv-search-box ${searchEditing ? "is-editing" : ""}`, onBlur: (event) => {
+                            if (!event.currentTarget.contains(event.relatedTarget))
+                                setSearchEditing(false);
+                        }, children: [_jsxs("form", { className: "scv-search-form", role: "search", onMouseDown: (event) => {
+                                    var _a;
+                                    if (!event.target.closest("button"))
+                                        (_a = searchRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+                                }, onSubmit: (event) => {
+                                    onSearchSubmit(event);
+                                    if (searchResults.length > 0)
+                                        setSearchEditing(false);
+                                }, children: [_jsx("span", { className: "scv-search-icon", "aria-hidden": "true", children: _jsxs("svg", { viewBox: "0 0 24 24", fill: "none", children: [_jsx("circle", { cx: "10.75", cy: "10.75", r: "6.75" }), _jsx("path", { d: "m15.75 15.75 4.25 4.25" })] }) }), _jsx("input", { ref: searchRef, type: "search", role: "combobox", "aria-autocomplete": "list", value: query, onChange: (event) => onQueryChange(event.target.value), onKeyDown: (event) => {
+                                            if (event.key === "Escape" && query) {
+                                                event.preventDefault();
+                                                onQueryChange("");
+                                            }
+                                            else if (event.key === "ArrowDown" && searchResults.length > 0) {
+                                                event.preventDefault();
+                                                focusSearchResult(0);
+                                            }
+                                        }, onFocus: () => setSearchEditing(true), placeholder: searchEditing ? "" : "Cerca nella normativa…", "aria-label": "Cerca nella normativa", "aria-controls": searchResultsId, "aria-expanded": searchEditing && searchReady }), searchEditing && query && _jsx("button", { type: "button", className: "scv-clear-search", onClick: () => onQueryChange(""), "aria-label": "Cancella ricerca", children: _jsx("svg", { viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: _jsx("path", { d: "m6.5 6.5 11 11M17.5 6.5l-11 11" }) }) }), !searchEditing && !query && _jsx("kbd", { children: "/" })] }), searchEditing && searchReady && _jsx("div", { id: searchResultsId, ref: searchResultsRef, className: "scv-search-results", role: "listbox", "aria-label": "Risultati ricerca", "aria-busy": searchStatus === "loading", "data-scv-search-source": searchSource, "data-scv-search-duration-ms": searchDurationMs !== null && searchDurationMs !== void 0 ? searchDurationMs : undefined, children: searchStatus === "loading" ? _jsx("p", { className: "scv-search-status", children: "Ricerca in corso\u2026" }) : searchStatus === "error" ? _jsx("p", { className: "scv-search-status", children: "Ricerca non disponibile." }) : searchResults.length === 0 ? _jsx("p", { className: "scv-search-status", children: "Nessun risultato nella modalit\u00E0 corrente." }) : searchResults.map((result, index) => { var _a, _b; return _jsxs("button", { type: "button", role: "option", "aria-selected": false, className: "scv-search-result", "data-search-match": result.matchKind, onKeyDown: (event) => searchResultKeyDown(event, index), onClick: () => { setSearchEditing(false); onSearchResult(result); onRequestClose(); }, children: [_jsxs("span", { children: [result.document === "ntc2018" ? "NTC 2018" : "Circolare 7/2019", " \u00B7 ", result.numbering, result.assetKind ? ` · ${result.assetKind === "formula" ? "Formula" : result.assetKind === "table" ? "Tabella" : "Figura"}` : ""] }), _jsx("strong", { children: result.title }), _jsx("small", { children: _jsx(HighlightedSnippet, { result: result }) })] }, `${result.id}:${(_a = result.blockId) !== null && _a !== void 0 ? _a : ""}:${(_b = result.assetId) !== null && _b !== void 0 ? _b : ""}`); }) })] }), _jsx("button", { type: "button", className: "scv-index-settings-toggle", "aria-controls": settingsId, "aria-expanded": settingsOpen, onClick: () => setSettingsOpen((current) => !current), "aria-label": "Impostazioni indice", children: _jsxs("svg", { viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: [_jsx("path", { d: "M4 7h16M4 12h16M4 17h16" }), _jsx("circle", { cx: "9", cy: "7", r: "2" }), _jsx("circle", { cx: "15", cy: "12", r: "2" }), _jsx("circle", { cx: "10", cy: "17", r: "2" })] }) }), _jsx("div", { id: settingsId, className: `scv-index-settings ${settingsOpen ? "is-open" : ""}`, children: _jsxs("div", { className: "scv-index-settings-inner", children: [_jsx(ModeSegmentedControl, { mode: mode, onChange: onModeChange }), _jsxs("button", { type: "button", className: "scv-theme-button", onClick: onToggleTheme, "aria-label": darkMode ? "Attiva modalità giorno" : "Attiva modalità notte", "aria-describedby": themeTooltipId, "aria-pressed": darkMode, children: [_jsx("span", { className: "scv-theme-icon", "aria-hidden": "true", children: darkMode
+                                                ? _jsxs("svg", { viewBox: "0 0 24 24", fill: "none", children: [_jsx("circle", { cx: "12", cy: "12", r: "3.75" }), _jsx("path", { d: "M12 2.25v2.1M12 19.65v2.1M21.75 12h-2.1M4.35 12h-2.1M18.9 5.1l-1.48 1.48M6.58 17.42 5.1 18.9M18.9 18.9l-1.48-1.48M6.58 6.58 5.1 5.1" })] })
+                                                : _jsx("svg", { viewBox: "0 0 24 24", fill: "none", children: _jsx("path", { d: "M20.2 15.15A8.35 8.35 0 0 1 8.85 3.8 8.36 8.36 0 1 0 20.2 15.15Z" }) }) }), _jsx("span", { id: themeTooltipId, className: "scv-control-tooltip", role: "tooltip", children: darkMode ? "Attiva modalità giorno" : "Attiva modalità notte" })] })] }) }), _jsx("button", { type: "button", className: "scv-mobile-index-close", onClick: onRequestClose, "aria-label": "Chiudi indice", children: "\u00D7" })] }), _jsx("div", { className: "scv-index-grid", children: _jsxs("section", { className: "scv-index-cell", children: [_jsx("header", { children: _jsx("span", { children: "Indice" }) }), _jsx("div", { className: "scv-index-list", ref: indexListRef, children: !indexReady ? _jsx(LoadingRows, {}) : chapters.length === 0 ? _jsx("p", { className: "scv-index-empty", children: "L\u2019indice non \u00E8 disponibile." }) : _jsx("ul", { className: "scv-index-tree", children: chapters.map((chapter) => {
+                                    var _a;
+                                    const chapterParagraphs = (_a = paragraphsByChapter.get(chapter.summary.id)) !== null && _a !== void 0 ? _a : [];
+                                    const chapterActive = activeChapterId === chapter.summary.id;
+                                    const chapterOpen = sidebarMode ? sidebarExpanded.session === sidebarSession && sidebarExpanded.chapterId === chapter.summary.id : chapterActive;
+                                    return _jsxs("li", { className: `scv-index-tree-item scv-index-tree-item-level-0 ${chapterOpen ? "is-open" : ""}`, children: [renderEntryButton(chapter, 0, chapterActive, 0, chapterParagraphs.length > 0 ? chapterOpen : undefined), chapterParagraphs.length > 0 && _jsx("div", { className: `scv-index-children ${chapterOpen ? "is-open" : ""}`, "aria-hidden": !chapterOpen, children: _jsx("div", { className: "scv-index-children-inner", children: _jsx("ul", { className: "scv-index-children-list scv-index-paragraph-list", children: chapterParagraphs.map((paragraph) => {
+                                                            var _a;
+                                                            const paragraphSubparagraphs = (_a = subparagraphsByParagraph.get(paragraph.summary.id)) !== null && _a !== void 0 ? _a : [];
+                                                            const paragraphActive = activeParagraphId === paragraph.summary.id;
+                                                            const paragraphOpen = chapterOpen && (sidebarMode ? sidebarExpanded.session === sidebarSession && sidebarExpanded.paragraphId === paragraph.summary.id : paragraphActive);
+                                                            return _jsxs("li", { className: `scv-index-tree-item scv-index-tree-item-level-1 ${paragraphOpen ? "is-open" : ""}`, children: [renderEntryButton(paragraph, 1, paragraphActive, chapterOpen ? 0 : -1, paragraphSubparagraphs.length > 0 ? paragraphOpen : undefined), paragraphSubparagraphs.length > 0 && _jsx("div", { className: `scv-index-children ${paragraphOpen ? "is-open" : ""}`, "aria-hidden": !paragraphOpen, children: _jsx("div", { className: "scv-index-children-inner", children: _jsx("ul", { className: "scv-index-children-list scv-index-subparagraph-list", children: paragraphSubparagraphs.map((subparagraph) => _jsx("li", { className: "scv-index-tree-item scv-index-tree-item-level-2", children: renderEntryButton(subparagraph, 2, activeSubparagraphId === subparagraph.summary.id, paragraphOpen ? 0 : -1) }, subparagraph.summary.id)) }) }) })] }, paragraph.summary.id);
+                                                        }) }) }) })] }, chapter.summary.id);
+                                }) }) })] }) })] });
+});
+function scheduleIdle(callback) {
+    const idleWindow = window;
+    if (idleWindow.requestIdleCallback) {
+        const id = idleWindow.requestIdleCallback(callback, { timeout: 1800 });
+        return () => { var _a; return (_a = idleWindow.cancelIdleCallback) === null || _a === void 0 ? void 0 : _a.call(idleWindow, id); };
+    }
+    const id = window.setTimeout(callback, 250);
+    return () => window.clearTimeout(id);
+}
+export function NormativeViewer({ defaultMode = "combined", dataBaseUrl = "/data/codes", assetsBaseUrl = "/assets", auxiliaryPanel, auxiliaryPanelLabel = "PDF ufficiale", auxiliaryPanelButtonText = "Apri", auxiliaryPanelDefaultVisible = false, auxiliaryPanelDesktopDefaultVisible = false, auxiliaryPanelModes, auxiliaryPanelKeepMounted = false, searchMaxResults = 12, className, annotationStore }) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
     const [manifest, setManifest] = useState(null);
-    const [index, setIndex] = useState(null);
-    const [chunk, setChunk] = useState(null);
-    const [scopeRecords, setScopeRecords] = useState([]);
-    const [loadedScopeKey, setLoadedScopeKey] = useState("");
+    const [indexes, setIndexes] = useState(new Map());
+    const [loadedChunks, setLoadedChunks] = useState(new Map());
+    const [renderedChunkPaths, setRenderedChunkPaths] = useState(new Set());
+    const [requestedCircPaths, setRequestedCircPaths] = useState(new Set());
     const [mode, setMode] = useState(defaultMode);
+    const [modeRevision, setModeRevision] = useState(0);
     const [activeUnitId, setActiveUnitId] = useState(null);
+    const [historyPosition, setHistoryPosition] = useState({ index: 0, max: 0 });
     const [relations, setRelations] = useState([]);
-    const [relatedByTarget, setRelatedByTarget] = useState(new Map());
-    const [searchIndex, setSearchIndex] = useState(null);
+    const [relationsLoaded, setRelationsLoaded] = useState(false);
+    const [crossReferenceIndex, setCrossReferenceIndex] = useState(null);
+    const [referencePreview, setReferencePreview] = useState(null);
+    const [citationSelection, setCitationSelection] = useState(null);
+    const [permalinkNotice, setPermalinkNotice] = useState(null);
     const [query, setQuery] = useState("");
     const [loadError, setLoadError] = useState(false);
-    const [settingsOpen, setSettingsOpen] = useState(false);
-    const [auxiliaryVisible, setAuxiliaryVisible] = useState(Boolean(auxiliaryPanel && auxiliaryPanelDefaultVisible));
+    const [contentLoadNotice, setContentLoadNotice] = useState(null);
+    const [mobileIndexOpen, setMobileIndexOpen] = useState(false);
+    const [mobileIndexSession, setMobileIndexSession] = useState(0);
+    const [darkMode, setDarkMode] = useState(null);
+    const [auxiliaryVisible, setAuxiliaryVisible] = useState(false);
+    const [annotations, setAnnotations] = useState([]);
+    const [annotationsLoading, setAnnotationsLoading] = useState(Boolean(annotationStore));
+    const [annotationError, setAnnotationError] = useState(null);
+    const [annotationMenu, setAnnotationMenu] = useState(null);
+    const [annotationEditor, setAnnotationEditor] = useState(null);
+    const [annotationBusy, setAnnotationBusy] = useState(false);
     const searchRef = useRef(null);
-    const settingsButtonRef = useRef(null);
-    const dialogCloseRef = useRef(null);
+    const mobileIndexButtonRef = useRef(null);
+    const auxiliaryButtonRef = useRef(null);
+    const auxiliaryPaneRef = useRef(null);
+    const auxiliaryId = useId();
+    const navigationId = useId();
     const requestedIdRef = useRef(null);
-    const deferredQuery = normalizedQuery(query);
+    const requestedTargetRef = useRef(null);
+    const scrollRequestRef = useRef(null);
+    const activeIdRef = useRef(null);
+    const manualTargetRef = useRef(null);
+    const navigationGenerationRef = useRef(0);
+    const renderedChunkPathsRef = useRef(new Set());
+    const pendingScrollAnchorRef = useRef(null);
+    const initializedContextRef = useRef("");
+    const initializedOnceRef = useRef(false);
+    const historyNavigationRef = useRef(false);
+    const historySessionRef = useRef(crypto.randomUUID());
+    const historyPositionRef = useRef({ index: 0, max: 0 });
+    const pendingHistoryScrollRef = useRef(null);
+    const crossReferencePromiseRef = useRef(null);
+    const relationsPromiseRef = useRef(null);
+    const permalinkNoticeTimerRef = useRef(null);
+    const searchHighlightTimerRef = useRef(null);
+    const pendingSearchHighlightRef = useRef(null);
+    const referencePreviewRequestRef = useRef(0);
+    const touchReferenceRef = useRef(null);
+    const lastPointerTypeRef = useRef("");
+    const suppressAnnotationClickRef = useRef(false);
+    const longPressRef = useRef(null);
+    const textPaneRef = useRef(null);
+    const documentId = documentForMode(mode);
+    const documentIdRef = useRef(documentId);
     const hasAuxiliary = Boolean(auxiliaryPanel);
+    const auxiliaryAvailable = hasAuxiliary && (auxiliaryPanelModes ? auxiliaryPanelModes.includes(mode) : mode !== "combined");
+    useEffect(() => {
+        var _a, _b;
+        window.history.replaceState(withViewerHistoryEntry(window.history.state, { session: historySessionRef.current, index: 0, scrollTop: (_b = (_a = textPaneRef.current) === null || _a === void 0 ? void 0 : _a.scrollTop) !== null && _b !== void 0 ? _b : 0 }), "", window.location.href);
+    }, []);
+    const saveHistoryScroll = useCallback(() => {
+        var _a, _b;
+        const entry = viewerHistoryEntry(window.history.state);
+        if ((entry === null || entry === void 0 ? void 0 : entry.session) !== historySessionRef.current)
+            return;
+        window.history.replaceState(withViewerHistoryEntry(window.history.state, Object.assign(Object.assign({}, entry), { scrollTop: (_b = (_a = textPaneRef.current) === null || _a === void 0 ? void 0 : _a.scrollTop) !== null && _b !== void 0 ? _b : 0 })), "", window.location.href);
+    }, []);
+    const pushViewerHistory = useCallback((nextMode, target) => {
+        const url = urlForViewerTarget(window.location.href, nextMode, defaultMode, target);
+        if (url.href === window.location.href)
+            return;
+        saveHistoryScroll();
+        const index = historyPositionRef.current.index + 1;
+        const position = { index, max: index };
+        historyPositionRef.current = position;
+        setHistoryPosition(position);
+        updateDeepLink(nextMode, target, defaultMode, "push", withViewerHistoryEntry(window.history.state, { session: historySessionRef.current, index, scrollTop: 0 }));
+    }, [defaultMode, saveHistoryScroll]);
     useEffect(() => {
+        const tablet = window.matchMedia("(min-width: 992px)");
+        const desktop = window.matchMedia("(min-width: 1400px)");
+        const syncLayout = () => {
+            setAuxiliaryVisible(Boolean(hasAuxiliary && (desktop.matches ? auxiliaryPanelDesktopDefaultVisible || auxiliaryPanelDefaultVisible : false)));
+            setMobileIndexOpen(false);
+        };
+        syncLayout();
+        tablet.addEventListener("change", syncLayout);
+        desktop.addEventListener("change", syncLayout);
+        return () => {
+            tablet.removeEventListener("change", syncLayout);
+            desktop.removeEventListener("change", syncLayout);
+        };
+    }, [hasAuxiliary, auxiliaryPanelDefaultVisible, auxiliaryPanelDesktopDefaultVisible]);
+    const flashSearchTarget = useCallback((target) => {
+        var _a;
+        const root = textPaneRef.current;
+        const element = findViewerTarget(root, target);
+        if (!element)
+            return false;
+        (_a = root === null || root === void 0 ? void 0 : root.querySelector(".scv-search-target")) === null || _a === void 0 ? void 0 : _a.classList.remove("scv-search-target");
+        element.classList.add("scv-search-target");
+        if (searchHighlightTimerRef.current !== null)
+            window.clearTimeout(searchHighlightTimerRef.current);
+        searchHighlightTimerRef.current = window.setTimeout(() => {
+            element.classList.remove("scv-search-target");
+            searchHighlightTimerRef.current = null;
+        }, 2200);
+        return true;
+    }, []);
+    useEffect(() => () => {
+        if (searchHighlightTimerRef.current !== null)
+            window.clearTimeout(searchHighlightTimerRef.current);
+        if (permalinkNoticeTimerRef.current !== null)
+            window.clearTimeout(permalinkNoticeTimerRef.current);
+    }, []);
+    const reportChunkLoadFailure = useCallback((message = "Una parte del documento non è disponibile. Puoi continuare a consultare i contenuti già caricati.") => {
+        if (renderedChunkPathsRef.current.size === 0)
+            setLoadError(true);
+        else
+            setContentLoadNotice(message);
+    }, []);
+    useEffect(() => {
+        documentIdRef.current = documentId;
+    }, [documentId]);
+    useEffect(() => {
+        if (!annotationStore)
+            return;
+        let cancelled = false;
+        annotationStore.listAnnotations().then((items) => {
+            if (!cancelled) {
+                setAnnotations(items);
+                setAnnotationError(null);
+            }
+        }).catch((error) => {
+            if (!cancelled)
+                setAnnotationError(error instanceof Error ? error.message : "Annotazioni locali non disponibili.");
+        }).finally(() => { if (!cancelled)
+            setAnnotationsLoading(false); });
+        return () => { cancelled = true; };
+    }, [annotationStore]);
+    const notesByTarget = useMemo(() => {
+        var _a;
+        const grouped = new Map();
+        for (const annotation of annotations) {
+            if (annotation.type !== "note")
+                continue;
+            const key = annotationTargetKey(annotation.target);
+            const group = (_a = grouped.get(key)) !== null && _a !== void 0 ? _a : [];
+            group.push(annotation);
+            grouped.set(key, group);
+        }
+        return grouped;
+    }, [annotations]);
+    const openAnnotation = useCallback((annotation) => {
+        var _a;
+        setAnnotationMenu(null);
+        setAnnotationError(null);
+        setAnnotationEditor({ type: annotation.type, target: annotation.target, annotation, metadata: {
+                documentId: annotation.documentId, numbering: annotation.numbering, title: annotation.title,
+                automaticLabel: (_a = annotation.label) !== null && _a !== void 0 ? _a : automaticAnnotationLabel(annotation.target, annotation.numbering, annotation.title),
+            } });
+    }, []);
+    useEffect(() => {
+        const timer = window.setTimeout(() => {
+            try {
+                setDarkMode(window.localStorage.getItem("scv-theme") === "dark");
+            }
+            catch (_a) {
+                setDarkMode(false);
+            }
+        }, 0);
+        return () => window.clearTimeout(timer);
+    }, []);
+    useEffect(() => {
+        if (darkMode === null)
+            return;
+        try {
+            window.localStorage.setItem("scv-theme", darkMode ? "dark" : "light");
+        }
+        catch ( /* Storage can be unavailable in private or embedded browsing contexts. */_a) { /* Storage can be unavailable in private or embedded browsing contexts. */ }
+    }, [darkMode]);
+    useEffect(() => {
+        let cancelled = false;
         loadManifest(dataBaseUrl).then((loaded) => {
+            var _a, _b;
+            if (cancelled)
+                return;
+            setIndexes(new Map());
+            setLoadedChunks(new Map());
+            setRenderedChunkPaths(new Set());
+            renderedChunkPathsRef.current = new Set();
+            setRequestedCircPaths(new Set());
+            setRelations([]);
+            setRelationsLoaded(false);
+            relationsPromiseRef.current = null;
+            setCrossReferenceIndex(null);
+            crossReferencePromiseRef.current = null;
+            setContentLoadNotice(null);
             const url = new URL(window.location.href);
             const requestedMode = url.searchParams.get("mode");
             if (modeOptions.some((option) => option.id === requestedMode))
                 setMode(requestedMode);
-            requestedIdRef.current = url.searchParams.get("unit");
+            requestedTargetRef.current = targetFromUrl(url);
+            pendingSearchHighlightRef.current = requestedTargetRef.current;
+            setCitationSelection(requestedTargetRef.current);
+            requestedIdRef.current = (_b = (_a = requestedTargetRef.current) === null || _a === void 0 ? void 0 : _a.unitId) !== null && _b !== void 0 ? _b : null;
             setActiveUnitId(requestedIdRef.current);
             setManifest(loaded);
-        }).catch(() => setLoadError(true));
+        }).catch(() => { if (!cancelled)
+            setLoadError(true); });
+        return () => { cancelled = true; };
     }, [dataBaseUrl]);
-    const documentId = documentForMode(mode);
     useEffect(() => {
-        if (!manifest)
+        if (!manifest || indexes.has(documentId))
             return;
         let cancelled = false;
         loadDocumentIndex(manifest, documentId, dataBaseUrl).then((loaded) => {
-            var _a;
-            if (cancelled)
-                return;
-            setIndex(loaded);
-            const requested = loaded.units.find((unit) => unit.id === requestedIdRef.current);
-            const initial = (_a = requested !== null && requested !== void 0 ? requested : loaded.units.find((unit) => unit.numbering.official === (documentId === "ntc2018" ? "4.1" : "C4.1"))) !== null && _a !== void 0 ? _a : loaded.units[0];
-            if (initial) {
-                requestedIdRef.current = initial.id;
-                setActiveUnitId(initial.id);
-                updateDeepLink(mode, initial.id, defaultMode);
-            }
-        }).catch(() => setLoadError(true));
+            if (!cancelled)
+                setIndexes((current) => new Map(current).set(documentId, loaded));
+        }).catch(() => { if (!cancelled)
+            setLoadError(true); });
         return () => { cancelled = true; };
-    }, [dataBaseUrl, defaultMode, documentId, manifest, mode]);
-    const activeSummary = (_a = index === null || index === void 0 ? void 0 : index.units.find((unit) => unit.id === activeUnitId)) !== null && _a !== void 0 ? _a : null;
-    const activeChapterId = activeSummary ? ancestorIdAtDepth(activeSummary, 0) : null;
-    const activeParagraphId = activeSummary && depth(activeSummary) >= 1 ? ancestorIdAtDepth(activeSummary, 1) : null;
-    const activeSubparagraphId = activeSummary && depth(activeSummary) >= 2 ? ancestorIdAtDepth(activeSummary, 2) : null;
-    const scope = useMemo(() => {
-        var _a;
-        if (!index || !activeSummary || !activeChapterId) {
-            return { mode: "paragraph", summaries: [], chapterId: null, paragraphId: null };
-        }
-        const chapterSummaries = index.units.filter((unit) => containsUnit(unit, activeChapterId));
-        const chunkBytes = new Map(((_a = manifest === null || manifest === void 0 ? void 0 : manifest.chunks) !== null && _a !== void 0 ? _a : []).map((entry) => [entry.path, entry.bytes]));
-        const chapterBytes = [...new Set(chapterSummaries.map((unit) => unit.chunkPath))].reduce((total, path) => { var _a; return total + ((_a = chunkBytes.get(path)) !== null && _a !== void 0 ? _a : 0); }, 0);
-        const chapterCanBeContinuous = chapterSummaries.length <= maxContinuousChapterUnits && chapterBytes <= maxContinuousChapterBytes;
-        if (depth(activeSummary) === 0 && chapterCanBeContinuous) {
-            return { mode: "chapter", summaries: chapterSummaries, chapterId: activeChapterId, paragraphId: null };
-        }
-        if (depth(activeSummary) === 0) {
-            const paragraphSummaries = index.units.filter((unit) => unit.hierarchy.parentId === activeChapterId && depth(unit) === 1);
-            const chapter = index.units.find((unit) => unit.id === activeChapterId);
-            return { mode: "paragraph", summaries: [chapter, ...paragraphSummaries].filter(Boolean), chapterId: activeChapterId, paragraphId: null };
-        }
-        const paragraphId = activeParagraphId !== null && activeParagraphId !== void 0 ? activeParagraphId : activeChapterId;
-        return { mode: "paragraph", summaries: index.units.filter((unit) => containsUnit(unit, paragraphId)), chapterId: activeChapterId, paragraphId };
-    }, [activeChapterId, activeParagraphId, activeSummary, index, manifest]);
-    const scopePaths = useMemo(() => [...new Set(scope.summaries.map((unit) => unit.chunkPath))], [scope.summaries]);
-    const scopeKey = useMemo(() => scope.summaries.map((unit) => unit.id).join("|"), [scope.summaries]);
-    const scopeLoading = scope.summaries.length > 0 && loadedScopeKey !== scopeKey;
+    }, [dataBaseUrl, documentId, indexes, manifest]);
     useEffect(() => {
-        if (!activeSummary)
+        if (!manifest || mode !== "combined" || indexes.has("circ2019"))
             return;
         let cancelled = false;
-        loadChunk(activeSummary.chunkPath, dataBaseUrl).then((loaded) => {
+        loadDocumentIndex(manifest, "circ2019", dataBaseUrl).then((loaded) => {
             if (!cancelled)
-                setChunk(loaded);
-        }).catch(() => setLoadError(true));
+                setIndexes((current) => new Map(current).set("circ2019", loaded));
+        }).catch(() => { if (!cancelled)
+            setContentLoadNotice("L’indice della Circolare non è disponibile; la lettura NTC resta utilizzabile."); });
         return () => { cancelled = true; };
-    }, [activeSummary, dataBaseUrl]);
+    }, [dataBaseUrl, indexes, manifest, mode]);
+    const ensureRelations = useCallback(async () => {
+        if (relationsLoaded)
+            return relations;
+        if (!manifest)
+            return [];
+        let pending = relationsPromiseRef.current;
+        if (!pending) {
+            pending = loadRelations(manifest, dataBaseUrl).then(({ relations: loadedRelations }) => {
+                setRelations(loadedRelations);
+                setRelationsLoaded(true);
+                return loadedRelations;
+            });
+            relationsPromiseRef.current = pending;
+            pending.catch(() => { if (relationsPromiseRef.current === pending)
+                relationsPromiseRef.current = null; });
+        }
+        return pending;
+    }, [dataBaseUrl, manifest, relations, relationsLoaded]);
     useEffect(() => {
-        if (!scope.summaries.length)
+        if (mode !== "combined" || relationsLoaded)
             return;
-        let cancelled = false;
-        Promise.all(scopePaths.map(async (path) => [path, await loadChunk(path, dataBaseUrl)])).then((loadedChunks) => {
-            if (cancelled)
-                return;
-            const chunks = new Map(loadedChunks);
-            const records = scope.summaries.flatMap((summary) => {
-                const loadedChunk = chunks.get(summary.chunkPath);
-                const unit = loadedChunk === null || loadedChunk === void 0 ? void 0 : loadedChunk.units.find((candidate) => candidate.id === summary.id);
-                return loadedChunk && unit ? [{ summary, unit, chunk: loadedChunk }] : [];
+        void ensureRelations().catch(() => setContentLoadNotice("Le relazioni NTC–Circolare non sono temporaneamente disponibili."));
+    }, [ensureRelations, mode, relationsLoaded]);
+    const ensureCrossReferenceIndex = useCallback(async () => {
+        if (crossReferenceIndex)
+            return crossReferenceIndex;
+        if (!manifest)
+            throw new Error("Manifest non ancora disponibile.");
+        let pending = crossReferencePromiseRef.current;
+        if (!pending) {
+            pending = loadCrossReferenceIndex(manifest, dataBaseUrl).then((loaded) => {
+                setCrossReferenceIndex(loaded);
+                return loaded;
             });
-            setScopeRecords(records);
-            setLoadedScopeKey(scopeKey);
-        }).catch(() => {
-            if (!cancelled) {
-                setLoadError(true);
-            }
-        });
-        return () => { cancelled = true; };
-    }, [dataBaseUrl, scope.summaries, scopeKey, scopePaths]);
-    useEffect(() => {
-        if (!manifest || mode !== "combined")
+            crossReferencePromiseRef.current = pending;
+            pending.catch(() => { if (crossReferencePromiseRef.current === pending)
+                crossReferencePromiseRef.current = null; });
+        }
+        return pending;
+    }, [crossReferenceIndex, dataBaseUrl, manifest]);
+    const index = (_a = indexes.get(documentId)) !== null && _a !== void 0 ? _a : null;
+    const circIndex = (_b = indexes.get("circ2019")) !== null && _b !== void 0 ? _b : null;
+    const lookup = useMemo(() => index ? createDocumentLookup(index) : null, [index]);
+    const circLookup = useMemo(() => circIndex ? createDocumentLookup(circIndex) : null, [circIndex]);
+    const crossReferenceLookup = useMemo(() => crossReferenceIndex ? createCrossReferenceLookup(crossReferenceIndex) : null, [crossReferenceIndex]);
+    const search = useViewerSearch({ query, mode, manifest, dataBaseUrl, lookup, circLookup, maxResults: searchMaxResults });
+    const combinedPlan = useMemo(() => buildCombinedPlan(mode === "combined" ? index : null, mode === "combined" ? circIndex : null, relations), [circIndex, index, mode, relations]);
+    const primaryRenderedPaths = useMemo(() => { var _a; return new Set((_a = lookup === null || lookup === void 0 ? void 0 : lookup.chunkPaths.filter((path) => renderedChunkPaths.has(path))) !== null && _a !== void 0 ? _a : []); }, [lookup, renderedChunkPaths]);
+    const rememberChunk = useCallback(async (path) => {
+        const chunk = await loadChunk(path, dataBaseUrl);
+        setLoadedChunks((current) => current.get(path) === chunk ? current : new Map(current).set(path, chunk));
+        return chunk;
+    }, [dataBaseUrl]);
+    const preserveActiveScrollAnchor = useCallback((generation) => {
+        const root = textPaneRef.current;
+        const anchorId = activeIdRef.current;
+        const anchor = anchorId ? findTextUnit(root, anchorId) : null;
+        if (!root || !anchor || !anchorId)
             return;
-        let cancelled = false;
-        loadRelations(manifest, dataBaseUrl).then(({ relations: loadedRelations }) => {
-            if (!cancelled)
-                setRelations(loadedRelations);
-        }).catch(() => setLoadError(true));
-        return () => { cancelled = true; };
-    }, [dataBaseUrl, manifest, mode]);
+        pendingScrollAnchorRef.current = {
+            id: anchorId,
+            top: anchor.getBoundingClientRect().top - root.getBoundingClientRect().top,
+            generation,
+        };
+    }, []);
+    const mountPrimaryChunk = useCallback(async (path, replace, preserveAnchor = false, generation = navigationGenerationRef.current) => {
+        const chunk = await rememberChunk(path);
+        if (generation !== navigationGenerationRef.current || chunk.document !== documentIdRef.current)
+            return;
+        const current = renderedChunkPathsRef.current;
+        if (!replace && current.has(path))
+            return;
+        if (preserveAnchor)
+            preserveActiveScrollAnchor(generation);
+        const next = replace ? new Set([path]) : new Set(current).add(path);
+        renderedChunkPathsRef.current = next;
+        setRenderedChunkPaths(next);
+    }, [preserveActiveScrollAnchor, rememberChunk]);
+    const mountPrimaryWindow = useCallback(async (summary, replace, generation) => {
+        await mountPrimaryChunk(summary.chunkPath, replace, false, generation);
+        if (!replace || generation !== navigationGenerationRef.current)
+            return;
+        if (!lookup)
+            return;
+        const window = navigationChunkWindow(lookup, summary.chunkPath);
+        if (window.previous)
+            void mountPrimaryChunk(window.previous, false, true, generation).catch(() => reportChunkLoadFailure("Il chunk precedente non è disponibile; il target resta consultabile."));
+        if (window.next)
+            void mountPrimaryChunk(window.next, false, false, generation).catch(() => reportChunkLoadFailure("Il chunk successivo non è disponibile; il target resta consultabile."));
+    }, [lookup, mountPrimaryChunk, reportChunkLoadFailure]);
+    const requiredCombinedCircPaths = useMemo(() => {
+        var _a;
+        const paths = new Set(requestedCircPaths);
+        if (mode !== "combined")
+            return paths;
+        for (const primaryPath of primaryRenderedPaths) {
+            for (const path of (_a = combinedPlan.circPathsByPrimaryPath.get(primaryPath)) !== null && _a !== void 0 ? _a : [])
+                paths.add(path);
+        }
+        for (const edge of relations) {
+            const target = lookup === null || lookup === void 0 ? void 0 : lookup.unitById.get(edge.targetUnitId);
+            if (target && primaryRenderedPaths.has(target.chunkPath))
+                paths.add(edge.sourceChunkPath);
+        }
+        return paths;
+    }, [combinedPlan.circPathsByPrimaryPath, lookup, mode, primaryRenderedPaths, relations, requestedCircPaths]);
     useEffect(() => {
-        if (mode !== "combined" || scopeRecords.length === 0 || relations.length === 0)
+        if (mode !== "combined")
+            return;
+        const missing = [...requiredCombinedCircPaths].filter((path) => !loadedChunks.has(path));
+        if (missing.length === 0)
             return;
         let cancelled = false;
-        const targetIds = new Set(scopeRecords.map(({ unit }) => unit.id));
-        const incoming = relations.filter((edge) => targetIds.has(edge.targetUnitId));
-        Promise.all([...new Set(incoming.map((edge) => edge.sourceChunkPath))].map(async (path) => [path, await loadChunk(path, dataBaseUrl)])).then((loadedChunks) => {
-            var _a;
+        const generation = navigationGenerationRef.current;
+        Promise.all(missing.map((path) => loadChunk(path, dataBaseUrl))).then((chunks) => {
             if (cancelled)
                 return;
-            const relatedChunks = new Map(loadedChunks);
-            const grouped = new Map();
-            for (const edge of incoming) {
-                const sourceChunk = relatedChunks.get(edge.sourceChunkPath);
-                const unit = sourceChunk === null || sourceChunk === void 0 ? void 0 : sourceChunk.units.find((candidate) => candidate.id === edge.sourceUnitId);
-                if (!sourceChunk || !unit)
-                    continue;
-                const group = (_a = grouped.get(edge.targetUnitId)) !== null && _a !== void 0 ? _a : [];
-                group.push({ edge, unit, chunk: sourceChunk });
-                grouped.set(edge.targetUnitId, group);
-            }
-            for (const group of grouped.values())
-                group.sort((left, right) => left.unit.numbering.sortKey.localeCompare(right.unit.numbering.sortKey, "it", { numeric: true }));
-            setRelatedByTarget(grouped);
+            if (generation === navigationGenerationRef.current)
+                preserveActiveScrollAnchor(generation);
+            setLoadedChunks((current) => {
+                const next = new Map(current);
+                missing.forEach((path, position) => next.set(path, chunks[position]));
+                return next;
+            });
         }).catch(() => { if (!cancelled)
-            setLoadError(true); });
+            setContentLoadNotice("Alcuni contenuti correlati della Circolare non sono disponibili."); });
         return () => { cancelled = true; };
-    }, [dataBaseUrl, mode, relations, scopeRecords]);
+    }, [dataBaseUrl, loadedChunks, mode, preserveActiveScrollAnchor, requiredCombinedCircPaths]);
+    const documentRecords = useMemo(() => recordsForPaths(index, lookup, primaryRenderedPaths, loadedChunks), [index, loadedChunks, lookup, primaryRenderedPaths]);
+    const fallbackIds = useMemo(() => new Set(combinedPlan.fallbackSummaries.map((summary) => summary.id)), [combinedPlan.fallbackSummaries]);
+    const circRecords = useMemo(() => {
+        if (mode !== "combined" || !index || !circIndex || !circLookup)
+            return [];
+        const primaryBases = new Set(index.units.map((summary) => baseNumbering(summary.numbering.official)));
+        return recordsForPaths(circIndex, circLookup, requiredCombinedCircPaths, loadedChunks).filter(({ unit }) => fallbackIds.has(unit.id) && (hasUnitContent(unit) || !primaryBases.has(baseNumbering(unit.numbering.official))));
+    }, [circIndex, circLookup, fallbackIds, index, loadedChunks, mode, requiredCombinedCircPaths]);
+    const relatedByTarget = useMemo(() => {
+        var _a;
+        const grouped = new Map();
+        if (mode !== "combined")
+            return grouped;
+        for (const edge of relations) {
+            const target = lookup === null || lookup === void 0 ? void 0 : lookup.unitById.get(edge.targetUnitId);
+            if (!target || !primaryRenderedPaths.has(target.chunkPath))
+                continue;
+            const sourceChunk = loadedChunks.get(edge.sourceChunkPath);
+            const unit = sourceChunk ? unitsForChunk(sourceChunk).get(edge.sourceUnitId) : null;
+            if (!sourceChunk || !unit)
+                continue;
+            const group = (_a = grouped.get(edge.targetUnitId)) !== null && _a !== void 0 ? _a : [];
+            group.push({ edge, unit, chunk: sourceChunk });
+            grouped.set(edge.targetUnitId, group);
+        }
+        for (const group of grouped.values())
+            group.sort((left, right) => compareNumbering(left.unit, right.unit));
+        return grouped;
+    }, [loadedChunks, lookup, mode, primaryRenderedPaths, relations]);
+    const renderRecords = useMemo(() => [...documentRecords, ...circRecords].sort((left, right) => compareBaseNumbering(left.summary, right.summary)), [circRecords, documentRecords]);
+    const navigationEntries = useMemo(() => {
+        if (!index)
+            return [];
+        const primaryBases = new Set(index.units.map((summary) => baseNumbering(summary.numbering.official)));
+        const summaries = mode === "combined"
+            ? [...index.units, ...combinedPlan.fallbackSummaries].filter((summary) => summary.document !== "circ2019" || !primaryBases.has(baseNumbering(summary.numbering.official)))
+            : index.units;
+        const entries = summaries.map((summary) => navigationEntry(summary));
+        if (mode !== "combined")
+            return entries.sort((left, right) => compareBaseNumbering(left.summary, right.summary));
+        const entryIdByBase = new Map(entries.map((entry) => [entry.baseNumber, entry.summary.id]));
+        return entries.map((entry) => {
+            var _a;
+            const parentBase = parentNumbering(entry.baseNumber);
+            const parentId = parentBase ? (_a = entryIdByBase.get(parentBase)) !== null && _a !== void 0 ? _a : null : null;
+            return entry.parentId === parentId ? entry : Object.assign(Object.assign({}, entry), { parentId });
+        }).sort((left, right) => compareBaseNumbering(left.summary, right.summary));
+    }, [combinedPlan.fallbackSummaries, index, mode]);
+    const entryById = useMemo(() => new Map(navigationEntries.map((entry) => [entry.summary.id, entry])), [navigationEntries]);
+    const recordById = useMemo(() => new Map(renderRecords.map((record) => [record.unit.id, record])), [renderRecords]);
+    const summaryById = useMemo(() => new Map([...indexes.values()].flatMap((documentIndex) => documentIndex.units).map((summary) => [summary.id, summary])), [indexes]);
+    const annotationRanks = useMemo(() => annotationPositionRanks(indexes.values()), [indexes]);
+    const revealSummary = useCallback(async (summary, replace = false, generation = navigationGenerationRef.current) => {
+        var _a;
+        if (generation !== navigationGenerationRef.current)
+            return;
+        scrollRequestRef.current = ((_a = requestedTargetRef.current) === null || _a === void 0 ? void 0 : _a.unitId) === summary.id ? requestedTargetRef.current : { kind: "unit", unitId: summary.id };
+        if (summary.document === documentIdRef.current) {
+            await mountPrimaryWindow(summary, replace, generation);
+            return;
+        }
+        if (mode !== "combined" || !lookup)
+            return;
+        const explicitTarget = relationTargets(summary.id, relations)[0];
+        if (explicitTarget) {
+            const target = lookup.unitById.get(explicitTarget.targetUnitId);
+            if (target) {
+                setRequestedCircPaths((current) => replace ? new Set([summary.chunkPath]) : new Set(current).add(summary.chunkPath));
+                await Promise.all([rememberChunk(summary.chunkPath), mountPrimaryWindow(target, replace, generation)]);
+            }
+            return;
+        }
+        const matchingPrimary = matchingPrimarySummary(summary, lookup);
+        if (matchingPrimary) {
+            scrollRequestRef.current = { kind: "unit", unitId: matchingPrimary.id };
+            await mountPrimaryWindow(matchingPrimary, replace, generation);
+            return;
+        }
+        const anchor = combinedPlan.primaryAnchorByFallbackId.get(summary.id);
+        if (!anchor)
+            return;
+        setRequestedCircPaths((current) => replace ? new Set([summary.chunkPath]) : new Set(current).add(summary.chunkPath));
+        await Promise.all([rememberChunk(summary.chunkPath), mountPrimaryWindow(anchor, replace, generation)]);
+    }, [combinedPlan.primaryAnchorByFallbackId, lookup, mode, mountPrimaryWindow, relations, rememberChunk]);
     useEffect(() => {
-        if (!manifest || deferredQuery.length < 2 || searchIndex)
+        var _a, _b, _c, _d, _e;
+        if (!index || !lookup)
             return;
-        loadSearchIndex(manifest, dataBaseUrl).then(setSearchIndex).catch(() => setLoadError(true));
-    }, [dataBaseUrl, deferredQuery, manifest, searchIndex]);
+        const contextKey = `${mode}:${modeRevision}:${index.document}`;
+        if (initializedContextRef.current === contextKey)
+            return;
+        const requestedId = requestedIdRef.current;
+        let initial = requestedId ? (_a = lookup.unitById.get(requestedId)) !== null && _a !== void 0 ? _a : null : null;
+        let revealInitial = initial;
+        if (!initial && mode === "combined" && (requestedId === null || requestedId === void 0 ? void 0 : requestedId.includes(":circ2019:"))) {
+            if (!circLookup || !relationsLoaded)
+                return;
+            const requestedCirc = (_b = circLookup.unitById.get(requestedId)) !== null && _b !== void 0 ? _b : null;
+            const explicitTarget = requestedCirc ? relationTargets(requestedCirc.id, relations)[0] : null;
+            const explicitPrimary = explicitTarget ? (_c = lookup.unitById.get(explicitTarget.targetUnitId)) !== null && _c !== void 0 ? _c : null : null;
+            const matchingPrimary = requestedCirc ? matchingPrimarySummary(requestedCirc, lookup) : null;
+            initial = (_d = explicitPrimary !== null && explicitPrimary !== void 0 ? explicitPrimary : matchingPrimary) !== null && _d !== void 0 ? _d : requestedCirc;
+            revealInitial = explicitPrimary || !matchingPrimary ? requestedCirc : matchingPrimary;
+        }
+        initial !== null && initial !== void 0 ? initial : (initial = initialUnitForIndex(index, requestedId));
+        revealInitial !== null && revealInitial !== void 0 ? revealInitial : (revealInitial = initial);
+        if (!initial || !revealInitial)
+            return;
+        initializedContextRef.current = contextKey;
+        requestedIdRef.current = initial.id;
+        activeIdRef.current = initial.id;
+        setActiveUnitId(initial.id);
+        const requestedTarget = ((_e = requestedTargetRef.current) === null || _e === void 0 ? void 0 : _e.unitId) === revealInitial.id ? requestedTargetRef.current : { kind: "unit", unitId: initial.id };
+        if (!historyNavigationRef.current) {
+            if (initializedOnceRef.current)
+                pushViewerHistory(mode, requestedTarget);
+            else
+                updateDeepLink(mode, requestedTarget, defaultMode);
+        }
+        initializedOnceRef.current = true;
+        historyNavigationRef.current = false;
+        const generation = ++navigationGenerationRef.current;
+        pendingScrollAnchorRef.current = null;
+        void revealSummary(revealInitial, primaryRenderedPaths.size === 0 || revealInitial.document !== documentId, generation).catch(() => reportChunkLoadFailure());
+    }, [circLookup, defaultMode, documentId, index, lookup, mode, modeRevision, primaryRenderedPaths.size, pushViewerHistory, relations, relationsLoaded, reportChunkLoadFailure, revealSummary]);
     useEffect(() => {
-        const onKeyDown = (event) => {
-            var _a, _b;
-            if (event.key === "/" && ((_a = window.document.activeElement) === null || _a === void 0 ? void 0 : _a.tagName.toLowerCase()) !== "input") {
-                event.preventDefault();
-                (_b = searchRef.current) === null || _b === void 0 ? void 0 : _b.focus();
+        if (!lookup || !activeUnitId)
+            return;
+        const active = lookup.unitById.get(activeUnitId);
+        if (!active)
+            return;
+        const candidates = new Set();
+        const { previous, next } = adjacentChunkPaths(lookup, active.chunkPath);
+        if (previous)
+            candidates.add(previous);
+        if (next)
+            candidates.add(next);
+        if (candidates.size === 0)
+            return;
+        return scheduleIdle(() => { for (const path of candidates)
+            void loadChunk(path, dataBaseUrl).catch(() => undefined); });
+    }, [activeUnitId, dataBaseUrl, lookup]);
+    useLayoutEffect(() => {
+        const root = textPaneRef.current;
+        const pendingAnchor = pendingScrollAnchorRef.current;
+        if (root && pendingAnchor && pendingAnchor.generation === navigationGenerationRef.current) {
+            const anchor = findTextUnit(root, pendingAnchor.id);
+            if (anchor) {
+                const nextTop = anchor.getBoundingClientRect().top - root.getBoundingClientRect().top;
+                root.scrollTop += nextTop - pendingAnchor.top;
             }
-            if (event.key === "Escape" && settingsOpen)
-                setSettingsOpen(false);
-        };
-        window.addEventListener("keydown", onKeyDown);
-        return () => window.removeEventListener("keydown", onKeyDown);
-    }, [settingsOpen]);
+            pendingScrollAnchorRef.current = null;
+        }
+        const target = scrollRequestRef.current;
+        if (!target || renderRecords.length === 0)
+            return;
+        if (!scrollViewerTarget(root, target)) {
+            if (target.kind === "unit")
+                return;
+            const unitTarget = { kind: "unit", unitId: target.unitId };
+            if (!scrollViewerTarget(root, unitTarget))
+                return;
+            scrollRequestRef.current = null;
+            requestedTargetRef.current = unitTarget;
+            updateDeepLink(mode, unitTarget, defaultMode);
+            setContentLoadNotice("Il blocco o asset richiesto non esiste; è stata aperta l’unità normativa corrispondente.");
+            return;
+        }
+        scrollRequestRef.current = null;
+        if (pendingHistoryScrollRef.current !== null && root) {
+            root.scrollTop = pendingHistoryScrollRef.current;
+            pendingHistoryScrollRef.current = null;
+        }
+        if (sameViewerTarget(pendingSearchHighlightRef.current, target) && flashSearchTarget(target))
+            pendingSearchHighlightRef.current = null;
+        manualTargetRef.current = { id: target.unitId, expires: performance.now() + 500 };
+    }, [auxiliaryAvailable, auxiliaryVisible, defaultMode, flashSearchTarget, mode, relatedByTarget, renderRecords]);
+    const navigationRef = useRef({ entryById, lookup, mode, relations, primaryAnchorByFallbackId: combinedPlan.primaryAnchorByFallbackId });
     useEffect(() => {
-        var _a, _b;
-        if (settingsOpen)
-            (_a = dialogCloseRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-        else
-            (_b = settingsButtonRef.current) === null || _b === void 0 ? void 0 : _b.focus();
-    }, [settingsOpen]);
-    const hierarchy = useMemo(() => {
-        if (!index)
-            return [[], [], [], []];
-        const chapters = index.units.filter((unit) => depth(unit) === 0);
-        const paragraphs = activeChapterId ? index.units.filter((unit) => depth(unit) === 1 && unit.hierarchy.parentId === activeChapterId) : [];
-        const subparagraphs = activeParagraphId ? index.units.filter((unit) => depth(unit) === 2 && unit.hierarchy.parentId === activeParagraphId) : [];
-        const detailsAnchor = activeSubparagraphId !== null && activeSubparagraphId !== void 0 ? activeSubparagraphId : activeParagraphId;
-        const details = detailsAnchor ? index.units.filter((unit) => depth(unit) >= 3 && unit.hierarchy.ancestorIds.includes(detailsAnchor)) : [];
-        return [chapters, paragraphs, subparagraphs, details];
-    }, [activeChapterId, activeParagraphId, activeSubparagraphId, index]);
-    const pageBounds = useMemo(() => {
-        if (!scopeRecords.length)
-            return { from: 1, to: 1 };
-        const pages = scopeRecords.flatMap(({ unit, chunk: loadedChunk }) => evidencePages(unit, loadedChunk));
-        return pages.length > 0 ? { from: Math.min(...pages), to: Math.max(...pages) } : { from: 1, to: 1 };
-    }, [scopeRecords]);
-    const searchResults = useMemo(() => {
-        if (!searchIndex || deferredQuery.length < 2)
-            return [];
-        return searchIndex.units.filter((unit) => {
-            if (mode === "ntc" && unit.document !== "ntc2018")
-                return false;
-            if (mode === "circ" && unit.document !== "circ2019")
-                return false;
-            return `${unit.numbering} ${unit.title} ${unit.text}`.normalize("NFKC").toLocaleLowerCase("it").includes(deferredQuery);
-        }).slice(0, 12);
-    }, [deferredQuery, mode, searchIndex]);
-    function selectUnit(unit) {
+        navigationRef.current = { entryById, lookup, mode, relations, primaryAnchorByFallbackId: combinedPlan.primaryAnchorByFallbackId };
+    }, [combinedPlan.primaryAnchorByFallbackId, entryById, lookup, mode, relations]);
+    const loadAdjacentAtUnit = useCallback((unitId) => {
+        const current = navigationRef.current;
+        const adjacent = progressiveChunkTargetsForVisibleUnit(current.lookup, unitId, current.primaryAnchorByFallbackId);
+        if (adjacent.previous)
+            void mountPrimaryChunk(adjacent.previous, false, true).catch(() => reportChunkLoadFailure("Il chunk precedente non è disponibile; il resto del documento rimane consultabile."));
+        if (adjacent.next)
+            void mountPrimaryChunk(adjacent.next, false).catch(() => reportChunkLoadFailure("Il chunk successivo non è disponibile; il resto del documento rimane consultabile."));
+    }, [mountPrimaryChunk, reportChunkLoadFailure]);
+    const onVisibleUnit = useCallback((nextId) => {
+        const guard = manualTargetRef.current;
+        if (guard && performance.now() < guard.expires && guard.id !== nextId)
+            return;
+        if ((guard === null || guard === void 0 ? void 0 : guard.id) === nextId || (guard && performance.now() >= guard.expires))
+            manualTargetRef.current = null;
+        if (nextId !== activeIdRef.current) {
+            setCitationSelection(null);
+            activeIdRef.current = nextId;
+            requestedIdRef.current = nextId;
+            requestedTargetRef.current = { kind: "unit", unitId: nextId };
+            setActiveUnitId(nextId);
+            updateDeepLink(navigationRef.current.mode, requestedTargetRef.current, defaultMode);
+        }
+        loadAdjacentAtUnit(nextId);
+    }, [defaultMode, loadAdjacentAtUnit]);
+    useVisibleUnitObserver(textPaneRef, renderRecords, onVisibleUnit);
+    const selectUnit = useCallback((unit) => {
+        const target = { kind: "unit", unitId: unit.id };
+        setCitationSelection(null);
+        setMobileIndexOpen(false);
+        const generation = ++navigationGenerationRef.current;
+        pendingScrollAnchorRef.current = null;
+        setContentLoadNotice(null);
         requestedIdRef.current = unit.id;
+        requestedTargetRef.current = target;
+        pendingSearchHighlightRef.current = target;
+        manualTargetRef.current = { id: unit.id, expires: performance.now() + 500 };
+        pushViewerHistory(navigationRef.current.mode, target);
+        const present = scrollTextUnit(textPaneRef.current, unit.id);
+        activeIdRef.current = unit.id;
         setActiveUnitId(unit.id);
-        updateDeepLink(mode, unit.id, defaultMode);
-    }
+        if (present) {
+            if (flashSearchTarget(target))
+                pendingSearchHighlightRef.current = null;
+            return;
+        }
+        const currentLookup = navigationRef.current.lookup;
+        const nearMountedWindow = currentLookup ? isChunkNearRenderedWindow(currentLookup, unit.chunkPath, primaryRenderedPaths) : false;
+        void revealSummary(unit, !nearMountedWindow, generation).catch(() => reportChunkLoadFailure());
+    }, [flashSearchTarget, primaryRenderedPaths, pushViewerHistory, reportChunkLoadFailure, revealSummary]);
+    const navigateViewerTarget = useCallback(async (target, action = "push", forcedMode) => {
+        var _a;
+        setCitationSelection(target);
+        setMobileIndexOpen(false);
+        pendingSearchHighlightRef.current = target;
+        const generation = ++navigationGenerationRef.current;
+        pendingScrollAnchorRef.current = null;
+        setContentLoadNotice(null);
+        const targetDocument = documentFromUnitId(target.unitId);
+        const nextMode = forcedMode !== null && forcedMode !== void 0 ? forcedMode : (mode === "combined" || documentForMode(mode) === targetDocument ? mode : targetDocument === "ntc2018" ? "ntc" : "circ");
+        requestedIdRef.current = target.unitId;
+        requestedTargetRef.current = target;
+        scrollRequestRef.current = target;
+        manualTargetRef.current = { id: target.unitId, expires: performance.now() + 700 };
+        if (action === "push")
+            pushViewerHistory(nextMode, target);
+        else if (action === "replace")
+            updateDeepLink(nextMode, target, defaultMode);
+        if (nextMode !== mode) {
+            historyNavigationRef.current = true;
+            initializedContextRef.current = "";
+            setRequestedCircPaths(new Set());
+            setModeRevision((revision) => revision + 1);
+            setMode(nextMode);
+            return;
+        }
+        if (targetDocument === documentIdRef.current) {
+            activeIdRef.current = target.unitId;
+            setActiveUnitId(target.unitId);
+        }
+        if (scrollViewerTarget(textPaneRef.current, target)) {
+            if (pendingHistoryScrollRef.current !== null && textPaneRef.current) {
+                textPaneRef.current.scrollTop = pendingHistoryScrollRef.current;
+                pendingHistoryScrollRef.current = null;
+            }
+            if (sameViewerTarget(pendingSearchHighlightRef.current, target) && flashSearchTarget(target))
+                pendingSearchHighlightRef.current = null;
+            return;
+        }
+        if (!manifest)
+            return;
+        let targetIndex = indexes.get(targetDocument);
+        if (!targetIndex) {
+            targetIndex = await loadDocumentIndex(manifest, targetDocument, dataBaseUrl);
+            if (generation !== navigationGenerationRef.current)
+                return;
+            setIndexes((current) => current.has(targetDocument) ? current : new Map(current).set(targetDocument, targetIndex));
+        }
+        const summary = targetIndex.units.find((unit) => unit.id === target.unitId);
+        if (!summary) {
+            const fallbackId = activeIdRef.current;
+            if (fallbackId)
+                updateDeepLink(mode, { kind: "unit", unitId: fallbackId }, defaultMode);
+            setContentLoadNotice("Il target richiesto non esiste nel documento corrente.");
+            return;
+        }
+        let activeId = summary.id;
+        if (mode === "combined" && summary.document === "circ2019") {
+            const explicit = relationTargets(summary.id, relations)[0];
+            activeId = (_a = explicit === null || explicit === void 0 ? void 0 : explicit.targetUnitId) !== null && _a !== void 0 ? _a : summary.id;
+        }
+        activeIdRef.current = activeId;
+        setActiveUnitId(activeId);
+        const currentLookup = navigationRef.current.lookup;
+        const nearMountedWindow = summary.document === documentIdRef.current && currentLookup ? isChunkNearRenderedWindow(currentLookup, summary.chunkPath, primaryRenderedPaths) : false;
+        if (generation !== navigationGenerationRef.current)
+            return;
+        await revealSummary(summary, summary.document === documentIdRef.current && !nearMountedWindow, generation);
+    }, [dataBaseUrl, defaultMode, flashSearchTarget, indexes, manifest, mode, primaryRenderedPaths, pushViewerHistory, relations, revealSummary]);
     useEffect(() => {
-        if (scopeLoading || !activeUnitId || scopeRecords.length === 0)
+        const onPopState = (event) => {
+            const url = new URL(window.location.href);
+            const target = targetFromUrl(url);
+            if (!target)
+                return;
+            const entry = viewerHistoryEntry(event.state);
+            if ((entry === null || entry === void 0 ? void 0 : entry.session) === historySessionRef.current) {
+                const position = { index: entry.index, max: historyPositionRef.current.max };
+                historyPositionRef.current = position;
+                setHistoryPosition(position);
+                pendingHistoryScrollRef.current = entry.scrollTop;
+            }
+            else {
+                pendingHistoryScrollRef.current = null;
+                historyPositionRef.current = { index: 0, max: 0 };
+                setHistoryPosition({ index: 0, max: 0 });
+            }
+            const requestedMode = url.searchParams.get("mode");
+            const nextMode = modeOptions.some((option) => option.id === requestedMode) ? requestedMode : defaultMode;
+            void navigateViewerTarget(target, "none", nextMode).catch(() => reportChunkLoadFailure());
+        };
+        window.addEventListener("popstate", onPopState);
+        return () => window.removeEventListener("popstate", onPopState);
+    }, [defaultMode, navigateViewerTarget, reportChunkLoadFailure]);
+    const resolveReferenceElement = useCallback(async (element) => {
+        const descriptor = referenceDescriptor(element);
+        if (!descriptor)
+            return null;
+        const loaded = await ensureCrossReferenceIndex();
+        const referenceLookup = crossReferenceLookup !== null && crossReferenceLookup !== void 0 ? crossReferenceLookup : createCrossReferenceLookup(loaded);
+        return resolveCrossReference(referenceLookup, descriptor, descriptor.sourceDocument);
+    }, [crossReferenceLookup, ensureCrossReferenceIndex]);
+    const clearReferencePreview = useCallback(() => {
+        referencePreviewRequestRef.current += 1;
+        setReferencePreview(null);
+        touchReferenceRef.current = null;
+    }, []);
+    const showReferencePreview = useCallback((element, interactive = false) => {
+        var _a;
+        const requestId = ++referencePreviewRequestRef.current;
+        const bounds = element.getBoundingClientRect();
+        const left = Math.max(12, Math.min(window.innerWidth - 332, bounds.left));
+        const previewHeight = 190;
+        const below = bounds.bottom + 7;
+        const top = Math.max(12, below + previewHeight <= window.innerHeight - 12 ? below : bounds.top - previewHeight - 7);
+        setReferencePreview({ label: (_a = element.textContent) !== null && _a !== void 0 ? _a : "Riferimento", title: "", snippet: "", left, top, loading: true, interactive });
+        void resolveReferenceElement(element).then((reference) => {
+            var _a, _b, _c;
+            if (requestId !== referencePreviewRequestRef.current)
+                return;
+            if (!reference) {
+                element.dataset.scvReferenceResolved = "false";
+                setReferencePreview({ label: (_a = element.textContent) !== null && _a !== void 0 ? _a : "Riferimento", title: "Target non disponibile", snippet: "Il riferimento non è stato reso cliccabile perché non è risolto dall’indice derivato.", left, top, interactive, available: false });
+                return;
+            }
+            element.dataset.scvReferenceResolved = "true";
+            setReferencePreview({ label: referenceLabel(reference), title: ((_b = reference.asset) === null || _b === void 0 ? void 0 : _b.title) || reference.unit.title, snippet: ((_c = reference.asset) === null || _c === void 0 ? void 0 : _c.snippet) || reference.unit.snippet, left, top, interactive, available: true });
+        }).catch(() => {
+            if (requestId === referencePreviewRequestRef.current)
+                setReferencePreview(null);
+        });
+    }, [resolveReferenceElement]);
+    const activateReference = useCallback((element) => {
+        clearReferencePreview();
+        void resolveReferenceElement(element).then((reference) => {
+            if (!reference)
+                return;
+            return navigateViewerTarget(viewerTargetForReference(reference), "push");
+        }).catch(() => { });
+    }, [clearReferencePreview, navigateViewerTarget, resolveReferenceElement]);
+    const showPermalinkNotice = useCallback((element, message, status) => {
+        const bounds = element.getBoundingClientRect();
+        const placement = bounds.top >= 54 ? "above" : "below";
+        setPermalinkNotice({
+            message,
+            left: Math.max(116, Math.min(window.innerWidth - 116, bounds.left + bounds.width / 2)),
+            top: placement === "above" ? bounds.top : bounds.bottom,
+            placement,
+            status,
+        });
+        if (permalinkNoticeTimerRef.current !== null)
+            window.clearTimeout(permalinkNoticeTimerRef.current);
+        permalinkNoticeTimerRef.current = window.setTimeout(() => {
+            setPermalinkNotice(null);
+            permalinkNoticeTimerRef.current = null;
+        }, status === "success" ? 1800 : 2400);
+    }, []);
+    const copyElementPermalink = useCallback((element) => {
+        const citationElement = element.closest("[data-scv-citation-target]");
+        const target = citationElement ? citationSelectionFromElement(citationElement) : null;
+        if (!target)
             return;
-        requestAnimationFrame(() => { var _a; return (_a = window.document.querySelector(`[data-scv-text-unit="${CSS.escape(activeUnitId)}"]`)) === null || _a === void 0 ? void 0 : _a.scrollIntoView({ block: "start" }); });
-    }, [activeUnitId, scopeLoading, scopeRecords]);
-    function changeMode(nextMode, preferredUnitId = null) {
+        const targetDocument = documentFromUnitId(target.unitId);
+        const linkMode = mode === "combined" || documentForMode(mode) === targetDocument ? mode : targetDocument === "ntc2018" ? "ntc" : "circ";
+        const permalink = urlForViewerTarget(window.location.href, linkMode, defaultMode, target).href;
+        setCitationSelection(target);
+        void writeTextClipboard(permalink)
+            .then(() => showPermalinkNotice(element, "Link copiato negli appunti", "success"))
+            .catch(() => showPermalinkNotice(element, "Copia del link non disponibile", "error"));
+    }, [defaultMode, mode, showPermalinkNotice]);
+    const metadataForAnnotationTarget = useCallback((target) => {
+        var _a, _b;
+        const summary = summaryById.get(target.unitId);
+        if (!summary)
+            return null;
+        let officialAssetNumber;
+        if (target.kind === "asset") {
+            for (const loaded of loadedChunks.values()) {
+                const asset = (_b = (_a = loaded.assets.formulas[target.assetId]) !== null && _a !== void 0 ? _a : loaded.assets.tables[target.assetId]) !== null && _b !== void 0 ? _b : loaded.assets.figures[target.assetId];
+                if (asset) {
+                    officialAssetNumber = asset.officialNumber;
+                    break;
+                }
+            }
+        }
+        return { documentId: summary.document, numbering: summary.numbering.official, title: summary.title,
+            automaticLabel: automaticAnnotationLabel(target, summary.numbering.official, summary.title, officialAssetNumber) };
+    }, [loadedChunks, summaryById]);
+    const showAnnotationMenu = useCallback((target, point) => {
+        const metadata = metadataForAnnotationTarget(target);
+        if (!metadata || !annotationStore)
+            return false;
+        setCitationSelection(target);
+        setAnnotationEditor(null);
+        setAnnotationMenu({ target, metadata, x: point.x, y: point.y, bookmark: annotationsForTarget(annotations, target, "bookmark")[0] });
+        return true;
+    }, [annotationStore, annotations, metadataForAnnotationTarget]);
+    const handleDocumentContextMenu = useCallback((event) => {
+        const target = annotationTargetFromElement(event.target instanceof Element ? event.target : null);
+        if (target && showAnnotationMenu(target, { x: event.clientX, y: event.clientY }))
+            event.preventDefault();
+    }, [showAnnotationMenu]);
+    const handleDocumentKeyDown = useCallback((event) => {
         var _a;
-        const keepCurrent = activeSummary && (nextMode === "combined" ? activeSummary.document === "ntc2018" : activeSummary.document === documentForMode(nextMode));
-        requestedIdRef.current = preferredUnitId !== null && preferredUnitId !== void 0 ? preferredUnitId : (keepCurrent ? (_a = activeSummary === null || activeSummary === void 0 ? void 0 : activeSummary.id) !== null && _a !== void 0 ? _a : null : null);
-        setMode(nextMode);
-        setIndex(null);
-        setChunk(null);
-        setScopeRecords([]);
-        setRelatedByTarget(new Map());
-        setSettingsOpen(false);
-    }
-    function selectSearchResult(result) {
-        setQuery("");
-        if (result.document === "ntc2018" && index) {
-            const summary = index.units.find((unit) => unit.id === result.id);
-            if (summary)
-                selectUnit(summary);
+        if (event.key !== "ContextMenu" && !(event.shiftKey && event.key === "F10"))
+            return;
+        const element = event.target instanceof Element ? event.target : null;
+        const target = annotationTargetFromElement(element);
+        const anchor = (_a = element === null || element === void 0 ? void 0 : element.closest("[data-scv-citation-target]")) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();
+        if (target && anchor && showAnnotationMenu(target, { x: anchor.left + Math.min(32, anchor.width / 2), y: anchor.top + Math.min(32, anchor.height / 2) }))
+            event.preventDefault();
+    }, [showAnnotationMenu]);
+    const handleDocumentClick = useCallback((event) => {
+        if (suppressAnnotationClickRef.current) {
+            suppressAnnotationClickRef.current = false;
+            event.preventDefault();
+            event.stopPropagation();
             return;
         }
-        const explicit = mode === "combined" ? relationTargets(result.id, relations)[0] : null;
-        if (explicit && index) {
-            const summary = index.units.find((unit) => unit.id === explicit.targetUnitId);
-            if (summary)
-                selectUnit(summary);
+        const permalinkElement = event.target instanceof Element ? event.target.closest("[data-scv-copy-link]") : null;
+        if (permalinkElement) {
+            event.preventDefault();
+            copyElementPermalink(permalinkElement);
             return;
         }
-        if (mode === "combined")
-            changeMode("circ", result.id);
-    }
-    function submitSearch(event) {
+        const element = event.target instanceof Element ? event.target.closest(".scv-cross-reference") : null;
+        if (element) {
+            if (lastPointerTypeRef.current === "touch" && touchReferenceRef.current !== element) {
+                event.preventDefault();
+                touchReferenceRef.current = element;
+                showReferencePreview(element, true);
+                return;
+            }
+            activateReference(element);
+            return;
+        }
+        const citationElement = event.target instanceof Element ? event.target.closest("[data-scv-citation-target]") : null;
+        if (citationElement)
+            setCitationSelection(citationSelectionFromElement(citationElement));
+    }, [activateReference, copyElementPermalink, showReferencePreview]);
+    const handleDocumentPointerDown = useCallback((event) => {
+        var _a;
+        lastPointerTypeRef.current = event.pointerType;
+        (_a = longPressRef.current) === null || _a === void 0 ? void 0 : _a.session.cancel();
+        longPressRef.current = null;
+        if (event.pointerType !== "touch" || !event.isPrimary || event.button !== 0 || !annotationStore)
+            return;
+        const element = event.target instanceof Element ? event.target : null;
+        if (element === null || element === void 0 ? void 0 : element.closest(".scv-cross-reference, button, a, input, textarea, select"))
+            return;
+        const target = annotationTargetFromElement(element);
+        if (!target)
+            return;
+        const session = createLongPressSession((point) => {
+            if (showAnnotationMenu(target, point))
+                suppressAnnotationClickRef.current = true;
+            longPressRef.current = null;
+        });
+        longPressRef.current = { pointerId: event.pointerId, session };
+        session.start({ x: event.clientX, y: event.clientY });
+    }, [annotationStore, showAnnotationMenu]);
+    const handleDocumentPointerMove = useCallback((event) => {
+        const active = longPressRef.current;
+        if ((active === null || active === void 0 ? void 0 : active.pointerId) === event.pointerId)
+            active.session.move({ x: event.clientX, y: event.clientY });
+    }, []);
+    const cancelDocumentLongPress = useCallback((event) => {
+        const active = longPressRef.current;
+        if ((active === null || active === void 0 ? void 0 : active.pointerId) !== event.pointerId)
+            return;
+        active.session.cancel();
+        longPressRef.current = null;
+    }, []);
+    const handleDocumentPointerOver = useCallback((event) => {
+        if (event.pointerType === "touch")
+            return;
+        const element = event.target instanceof Element ? event.target.closest(".scv-cross-reference") : null;
+        if (element && !element.contains(event.relatedTarget))
+            showReferencePreview(element);
+    }, [showReferencePreview]);
+    const handleDocumentPointerOut = useCallback((event) => {
+        if (event.pointerType === "touch" || (referencePreview === null || referencePreview === void 0 ? void 0 : referencePreview.interactive))
+            return;
+        const element = event.target instanceof Element ? event.target.closest(".scv-cross-reference") : null;
+        if (element && !element.contains(event.relatedTarget) && document.activeElement !== element)
+            clearReferencePreview();
+    }, [clearReferencePreview, referencePreview === null || referencePreview === void 0 ? void 0 : referencePreview.interactive]);
+    const handleDocumentFocus = useCallback((event) => {
+        const element = event.target instanceof Element ? event.target.closest(".scv-cross-reference") : null;
+        if (element)
+            showReferencePreview(element);
+    }, [showReferencePreview]);
+    const handleDocumentBlur = useCallback((event) => {
+        if (event.target instanceof Element && event.target.matches(".scv-cross-reference") && !(referencePreview === null || referencePreview === void 0 ? void 0 : referencePreview.interactive))
+            clearReferencePreview();
+    }, [clearReferencePreview, referencePreview === null || referencePreview === void 0 ? void 0 : referencePreview.interactive]);
+    const openPreviewReference = useCallback(() => {
+        const element = touchReferenceRef.current;
+        if (element)
+            activateReference(element);
+    }, [activateReference]);
+    const selectScrollMarker = useCallback((unitId) => {
+        const entry = navigationRef.current.entryById.get(unitId);
+        if (entry)
+            selectUnit(entry.summary);
+    }, [selectUnit]);
+    const activeSummary = (_f = (_d = (_c = lookup === null || lookup === void 0 ? void 0 : lookup.unitById.get(activeUnitId !== null && activeUnitId !== void 0 ? activeUnitId : "")) !== null && _c !== void 0 ? _c : circLookup === null || circLookup === void 0 ? void 0 : circLookup.unitById.get(activeUnitId !== null && activeUnitId !== void 0 ? activeUnitId : "")) !== null && _d !== void 0 ? _d : (_e = entryById.get(activeUnitId !== null && activeUnitId !== void 0 ? activeUnitId : "")) === null || _e === void 0 ? void 0 : _e.summary) !== null && _f !== void 0 ? _f : null;
+    const contextSummary = activeSummary && baseNumbering(activeSummary.numbering.official).split(".").length > 3
+        ? (_g = activeSummary.hierarchy.ancestorIds.map((id) => summaryById.get(id)).find((summary) => summary && baseNumbering(summary.numbering.official).split(".").length === 3)) !== null && _g !== void 0 ? _g : null
+        : activeSummary;
+    const chapters = useMemo(() => navigationEntries.filter(({ level }) => level === 0), [navigationEntries]);
+    const paragraphs = useMemo(() => navigationEntries.filter(({ level }) => level === 1), [navigationEntries]);
+    const subparagraphs = useMemo(() => navigationEntries.filter(({ level }) => level === 2), [navigationEntries]);
+    const hierarchy = useMemo(() => [chapters, paragraphs, subparagraphs], [chapters, paragraphs, subparagraphs]);
+    const activeLevelIds = useMemo(() => {
+        if (!activeSummary)
+            return [null, null, null];
+        const activeBaseParts = baseNumbering(activeSummary.numbering.official).split(".");
+        return [chapters, paragraphs, subparagraphs].map((levelEntries, level) => {
+            var _a, _b;
+            const baseNumber = activeBaseParts.slice(0, level + 1).join(".");
+            return (_b = (_a = levelEntries.find((entry) => entry.baseNumber === baseNumber)) === null || _a === void 0 ? void 0 : _a.summary.id) !== null && _b !== void 0 ? _b : null;
+        });
+    }, [activeSummary, chapters, paragraphs, subparagraphs]);
+    const scrubberEntries = useMemo(() => buildGlobalScrubberEntries(navigationEntries.map(({ summary, displayNumber, baseNumber, level }) => ({ id: summary.id, label: displayNumber, title: summary.title, baseNumber, level })), 2), [navigationEntries]);
+    const scrubberActiveId = resolveGlobalScrubberActiveId(scrubberEntries, activeUnitId, activeSummary ? baseNumbering(activeSummary.numbering.official) : null);
+    const annotationMarkers = useMemo(() => {
+        const scrubberById = new Map(scrubberEntries.map((entry) => [entry.id, entry]));
+        return annotations.flatMap((annotation) => {
+            var _a;
+            if (mode !== "combined" && annotation.documentId !== documentId)
+                return [];
+            let entry = scrubberById.get(annotation.target.unitId);
+            const summary = summaryById.get(annotation.target.unitId);
+            if (!entry && mode === "combined" && (summary === null || summary === void 0 ? void 0 : summary.document) === "circ2019") {
+                const relatedId = (_a = relationTargets(summary.id, relations)[0]) === null || _a === void 0 ? void 0 : _a.targetUnitId;
+                entry = relatedId ? scrubberById.get(relatedId) : undefined;
+                if (!entry)
+                    entry = scrubberEntries.find((candidate) => candidate.baseNumber === baseNumbering(summary.numbering.official));
+            }
+            return entry ? [{ annotation, ratio: entry.ratio }] : [];
+        });
+    }, [annotations, documentId, mode, relations, scrubberEntries, summaryById]);
+    const selectAnnotationMarker = useCallback((annotation) => {
+        void navigateViewerTarget(annotation.target, "push").then(() => { if (annotation.type === "note")
+            openAnnotation(annotation); }).catch(() => reportChunkLoadFailure());
+    }, [navigateViewerTarget, openAnnotation, reportChunkLoadFailure]);
+    const activeRecord = (_h = recordById.get(activeUnitId !== null && activeUnitId !== void 0 ? activeUnitId : "")) !== null && _h !== void 0 ? _h : null;
+    const chunk = (_j = activeRecord === null || activeRecord === void 0 ? void 0 : activeRecord.chunk) !== null && _j !== void 0 ? _j : null;
+    const activePages = activeRecord ? evidencePages(activeRecord.unit, activeRecord.chunk) : [];
+    const pageBounds = activePages.length > 0 ? { from: Math.min(...activePages), to: Math.max(...activePages) } : { from: 1, to: 1 };
+    const changeMode = useCallback((nextMode, preferredUnitId = null) => {
+        var _a;
+        if (nextMode === mode)
+            return;
+        navigationGenerationRef.current += 1;
+        pendingScrollAnchorRef.current = null;
+        setContentLoadNotice(null);
+        const keepCurrent = activeSummary && (nextMode === "combined" || activeSummary.document === documentForMode(nextMode));
+        requestedIdRef.current = preferredUnitId !== null && preferredUnitId !== void 0 ? preferredUnitId : (keepCurrent ? (_a = activeSummary === null || activeSummary === void 0 ? void 0 : activeSummary.id) !== null && _a !== void 0 ? _a : null : null);
+        requestedTargetRef.current = requestedIdRef.current ? { kind: "unit", unitId: requestedIdRef.current } : null;
+        initializedContextRef.current = "";
+        setRequestedCircPaths(new Set());
+        setCitationSelection(null);
+        clearReferencePreview();
+        setModeRevision((revision) => revision + 1);
+        setMode(nextMode);
+    }, [activeSummary, clearReferencePreview, mode]);
+    const closeMobileIndex = useCallback(() => {
+        setMobileIndexOpen(false);
+        if (window.matchMedia("(max-width: 991.98px)").matches)
+            window.requestAnimationFrame(() => { var _a; return (_a = mobileIndexButtonRef.current) === null || _a === void 0 ? void 0 : _a.focus(); });
+    }, []);
+    useEffect(() => {
+        const onKeyDown = (event) => {
+            var _a;
+            const editing = (event.target instanceof HTMLElement && event.target.closest("input, textarea, select, [contenteditable='true']"))
+                || ((_a = window.document.activeElement) === null || _a === void 0 ? void 0 : _a.closest("input, textarea, select, [contenteditable='true']"));
+            if (event.key === "/" && !editing) {
+                event.preventDefault();
+                if (window.matchMedia("(max-width: 1399.98px)").matches)
+                    setAuxiliaryVisible(false);
+                if (window.matchMedia("(max-width: 991.98px)").matches) {
+                    setMobileIndexSession((session) => session + 1);
+                    setMobileIndexOpen(true);
+                }
+                window.requestAnimationFrame(() => { var _a; return (_a = searchRef.current) === null || _a === void 0 ? void 0 : _a.focus(); });
+            }
+            if (event.key === "Escape") {
+                if (referencePreview === null || referencePreview === void 0 ? void 0 : referencePreview.interactive)
+                    clearReferencePreview();
+                else if (mobileIndexOpen)
+                    closeMobileIndex();
+            }
+        };
+        window.addEventListener("keydown", onKeyDown);
+        return () => window.removeEventListener("keydown", onKeyDown);
+    }, [clearReferencePreview, closeMobileIndex, mobileIndexOpen, referencePreview === null || referencePreview === void 0 ? void 0 : referencePreview.interactive]);
+    const selectSearchResult = useCallback((result) => {
+        const target = viewerTargetForSearchResult(result);
+        void navigateViewerTarget(target, "push").catch(() => reportChunkLoadFailure());
+    }, [navigateViewerTarget, reportChunkLoadFailure]);
+    const submitSearch = useCallback((event) => {
         event.preventDefault();
-        if (searchResults[0])
-            selectSearchResult(searchResults[0]);
-    }
-    const renderAuxiliary = !manifest
-        ? null
-        : typeof auxiliaryPanel === "function"
-            ? auxiliaryPanel({ mode, documentId, manifest, chunk, pageBounds })
-            : auxiliaryPanel;
-    const analyticalUrl = analyticalHref ? (typeof analyticalHref === "function" ? analyticalHref(mode, activeUnitId) : analyticalHref) : null;
-    const scopeNote = scope.mode === "chapter"
-        ? `Continuità capitolo ${(_b = activeSummary === null || activeSummary === void 0 ? void 0 : activeSummary.numbering.official) !== null && _b !== void 0 ? _b : ""} · ${scope.summaries.length} unità · ${scopePaths.length} chunk`
-        : scope.paragraphId
-            ? `Continuità paragrafo ${(_d = (_c = index === null || index === void 0 ? void 0 : index.units.find((unit) => unit.id === scope.paragraphId)) === null || _c === void 0 ? void 0 : _c.numbering.official) !== null && _d !== void 0 ? _d : ""} · ${scope.summaries.length} unità · ${scopePaths.length} chunk`
-            : `Capitolo ${(_e = activeSummary === null || activeSummary === void 0 ? void 0 : activeSummary.numbering.official) !== null && _e !== void 0 ? _e : ""} · continuità ridotta ai paragrafi per la dimensione del capitolo`;
-    function renderRecord({ unit, chunk: unitChunk }) {
+        if (search.results[0])
+            selectSearchResult(search.results[0]);
+    }, [search.results, selectSearchResult]);
+    const primaryPathPositions = (_k = lookup === null || lookup === void 0 ? void 0 : lookup.chunkPaths.flatMap((path, position) => primaryRenderedPaths.has(path) ? [position] : [])) !== null && _k !== void 0 ? _k : [];
+    const hasPrevious = primaryPathPositions.length > 0 && Math.min(...primaryPathPositions) > 0;
+    const hasNext = Boolean(lookup && primaryPathPositions.length > 0 && Math.max(...primaryPathPositions) < lookup.chunkPaths.length - 1);
+    const documentLoading = !index || documentRecords.length === 0;
+    const auxiliaryUnit = (_l = (citationSelection ? summaryById.get(citationSelection.unitId) : null)) !== null && _l !== void 0 ? _l : activeSummary;
+    const closeAuxiliary = useCallback(() => {
         var _a;
-        return _jsxs("section", { className: `scv-unit scv-unit-depth-${Math.min(depth(unit), 4)}`, "data-scv-text-unit": unit.id, children: [_jsxs("h2", { children: [_jsx("span", { children: unit.numbering.official }), unit.title] }), _jsx("div", { className: "scv-unit-blocks", children: unit.blocks.filter((block) => !isRepeatedUnitTitle(unit, block)).map((block) => _jsx("div", { className: `scv-block scv-block-${block.kind}`, children: _jsx(BlockContent, { block: block, assets: unitChunk.assets, assetsBaseUrl: assetsBaseUrl }) }, block.blockId)) }), mode === "combined" && ((_a = relatedByTarget.get(unit.id)) !== null && _a !== void 0 ? _a : []).map(({ edge, unit: relatedUnit, chunk: relatedChunk }) => _jsxs("section", { className: "scv-related-unit", "data-provenance": "Circolare 7/2019", children: [_jsx("header", { children: _jsxs("h3", { children: [_jsx("span", { children: relatedUnit.numbering.official }), relatedUnit.title] }) }), _jsx("div", { className: "scv-unit-blocks", children: relatedUnit.blocks.filter((block) => !isRepeatedUnitTitle(relatedUnit, block)).map((block) => _jsx("div", { className: `scv-block scv-block-${block.kind}`, children: _jsx(BlockContent, { block: block, assets: relatedChunk.assets, assetsBaseUrl: assetsBaseUrl }) }, block.blockId)) })] }, edge.relationId))] }, unit.id);
-    }
+        scrollRequestRef.current = requestedTargetRef.current;
+        setAuxiliaryVisible(false);
+        (_a = auxiliaryButtonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+    }, []);
+    const saveAnnotationEditor = useCallback(async (value) => {
+        if (!annotationStore || !annotationEditor)
+            return;
+        setAnnotationBusy(true);
+        setAnnotationError(null);
+        try {
+            const trimmed = value.trim();
+            const saved = annotationEditor.annotation
+                ? await annotationStore.updateAnnotation(annotationEditor.annotation.id, annotationEditor.type === "bookmark" ? { label: trimmed || annotationEditor.metadata.automaticLabel } : { text: trimmed })
+                : await annotationStore.createAnnotation(Object.assign({ type: annotationEditor.type, target: annotationEditor.target, documentId: annotationEditor.metadata.documentId, numbering: annotationEditor.metadata.numbering, title: annotationEditor.metadata.title }, (annotationEditor.type === "bookmark" ? { label: trimmed || annotationEditor.metadata.automaticLabel } : { text: trimmed })));
+            setAnnotations((current) => [...current.filter((annotation) => annotation.id !== saved.id && !(saved.type === "bookmark" && annotation.type === "bookmark" && annotationTargetKey(annotation.target) === annotationTargetKey(saved.target))), saved]);
+            setAnnotationEditor(null);
+        }
+        catch (error) {
+            setAnnotationError(error instanceof Error ? error.message : "Salvataggio non riuscito.");
+        }
+        finally {
+            setAnnotationBusy(false);
+        }
+    }, [annotationEditor, annotationStore]);
+    const removeAnnotation = useCallback(async (annotation) => {
+        if (!annotationStore)
+            return;
+        setAnnotationBusy(true);
+        setAnnotationError(null);
+        try {
+            await annotationStore.deleteAnnotation(annotation.id);
+            setAnnotations((current) => current.filter((item) => item.id !== annotation.id));
+            setAnnotationEditor((current) => { var _a; return ((_a = current === null || current === void 0 ? void 0 : current.annotation) === null || _a === void 0 ? void 0 : _a.id) === annotation.id ? null : current; });
+        }
+        catch (error) {
+            setAnnotationError(error instanceof Error ? error.message : "Eliminazione non riuscita.");
+        }
+        finally {
+            setAnnotationBusy(false);
+        }
+    }, [annotationStore]);
+    const annotationController = useMemo(() => annotationStore ? {
+        items: annotations, loading: annotationsLoading, error: annotationError, currentDocumentId: documentId, positionRanks: annotationRanks,
+        navigate: (annotation) => { void navigateViewerTarget(annotation.target, "push").catch(() => reportChunkLoadFailure()); },
+        edit: openAnnotation,
+        remove: removeAnnotation,
+        exportAnnotations: () => annotationStore.exportAnnotations(),
+        importAnnotations: async (value) => { const result = await annotationStore.importAnnotations(value); setAnnotations(await annotationStore.listAnnotations()); setAnnotationError(null); return result; },
+    } : undefined, [annotationError, annotationRanks, annotationStore, annotations, annotationsLoading, documentId, navigateViewerTarget, openAnnotation, removeAnnotation, reportChunkLoadFailure]);
+    const renderAuxiliary = !manifest || !auxiliaryAvailable ? null : _jsx(AuxiliaryContent, { panel: auxiliaryPanel, context: { mode, documentId, manifest, chunk, pageBounds,
+            currentUnit: auxiliaryUnit ? { documentId: auxiliaryUnit.document, unitId: auxiliaryUnit.id, numbering: auxiliaryUnit.numbering.official } : null,
+            selectedTarget: (citationSelection === null || citationSelection === void 0 ? void 0 : citationSelection.unitId) === (auxiliaryUnit === null || auxiliaryUnit === void 0 ? void 0 : auxiliaryUnit.id) ? citationSelection : null,
+            navigateTo: navigateViewerTarget,
+            hrefForTarget: (target) => urlForViewerTarget(window.location.href, mode === "combined" || documentForMode(mode) === documentFromUnitId(target.unitId) ? mode : documentFromUnitId(target.unitId) === "ntc2018" ? "ntc" : "circ", defaultMode, target).href,
+            close: closeAuxiliary,
+            annotations: annotationController, } });
     if (loadError)
         return _jsxs("main", { className: "scv-fatal", children: [_jsx("strong", { children: "Il corpus non \u00E8 disponibile." }), _jsx("span", { children: "Rigenera gli artefatti del viewer e ricarica la pagina." })] });
-    return _jsxs("div", { className: `scv-root ${auxiliaryVisible ? "scv-has-auxiliary" : ""} ${className !== null && className !== void 0 ? className : ""}`, children: [_jsxs("aside", { className: "scv-index-pane", "aria-label": "Indice gerarchico", children: [_jsxs("div", { className: "scv-search-toolbar", children: [_jsxs("form", { className: "scv-search-form", role: "search", onSubmit: submitSearch, children: [_jsx("span", { "aria-hidden": "true", children: "\u2315" }), _jsx("input", { ref: searchRef, type: "search", value: query, onChange: (event) => setQuery(event.target.value), placeholder: "Cerca nella normativa\u2026", "aria-label": "Cerca nella normativa" }), query && _jsx("button", { type: "button", className: "scv-clear-search", onClick: () => setQuery(""), "aria-label": "Cancella ricerca", children: "\u00D7" }), _jsx("kbd", { children: "/" })] }), _jsx("button", { ref: settingsButtonRef, type: "button", className: "scv-settings-button", onClick: () => setSettingsOpen(true), "aria-label": "Impostazioni consultazione", "aria-haspopup": "dialog", children: _jsx("span", { "aria-hidden": "true", children: "\u2699" }) }), deferredQuery.length >= 2 && _jsx("div", { className: "scv-search-results", role: "listbox", "aria-label": "Risultati ricerca", children: !searchIndex ? _jsx("p", { className: "scv-search-status", children: "Caricamento indice di ricerca\u2026" }) : searchResults.length === 0 ? _jsx("p", { className: "scv-search-status", children: "Nessun risultato nella modalit\u00E0 corrente." }) : searchResults.map((result) => _jsxs("button", { type: "button", role: "option", "aria-selected": false, className: "scv-search-result", onClick: () => selectSearchResult(result), children: [_jsxs("span", { children: [result.document === "ntc2018" ? "NTC 2018" : "Circolare 7/2019", " \u00B7 ", result.numbering] }), _jsx("strong", { children: result.title }), _jsx("small", { children: snippet(result.text || result.title) })] }, result.id)) })] }), _jsx("div", { className: "scv-index-grid", children: hierarchy.map((level, levelIndex) => _jsxs("section", { className: "scv-index-cell", children: [_jsxs("header", { children: [_jsx("span", { children: hierarchyLabels[levelIndex] }), _jsx("b", { children: level.length })] }), _jsx("div", { className: "scv-index-list", children: !index ? _jsx(LoadingRows, {}) : level.map((unit) => _jsxs("button", { type: "button", "data-index-unit": unit.id, className: activeUnitId === unit.id ? "active" : "", onClick: () => selectUnit(unit), title: `${unit.numbering.official} ${unit.title}`, "aria-current": activeUnitId === unit.id ? "page" : undefined, children: [_jsx("strong", { children: unit.numbering.official }), _jsx("span", { children: unit.title })] }, unit.id)) })] }, levelIndex)) })] }), _jsx("article", { className: "scv-text-pane", "aria-label": "Corpus JSON", children: scopeLoading || scope.summaries.length === 0 || scopeRecords.length === 0 ? _jsx(LoadingPanel, { label: "Caricamento della continuit\u00E0 normativa\u2026" }) : _jsxs("div", { className: "scv-text-flow", children: [_jsxs("p", { className: "scv-chunk-note", children: [scopeNote, " \u00B7 structural-codes ", scopeRecords[0].chunk.structuralCodesVersion] }), scopeRecords.map(renderRecord), _jsx("div", { className: "scv-end-note", children: "Fine della continuit\u00E0 caricata." })] }) }), auxiliaryVisible && renderAuxiliary && _jsx("aside", { className: "scv-auxiliary-pane", "aria-label": auxiliaryPanelLabel, children: renderAuxiliary }), settingsOpen && _jsx("div", { className: "scv-dialog-backdrop", role: "presentation", onMouseDown: (event) => { if (event.target === event.currentTarget)
-                    setSettingsOpen(false); }, children: _jsxs("section", { className: "scv-dialog", role: "dialog", "aria-modal": "true", "aria-labelledby": "scv-settings-title", children: [_jsxs("header", { children: [_jsx("h2", { id: "scv-settings-title", children: "Impostazioni consultazione" }), _jsx("button", { ref: dialogCloseRef, type: "button", onClick: () => setSettingsOpen(false), "aria-label": "Chiudi impostazioni", children: "\u00D7" })] }), _jsxs("fieldset", { children: [_jsx("legend", { children: "Visualizzazione" }), modeOptions.map((option) => _jsxs("label", { children: [_jsx("input", { type: "radio", name: "scv-mode", value: option.id, checked: mode === option.id, onChange: () => changeMode(option.id) }), option.label] }, option.id))] }), hasAuxiliary && _jsxs("label", { className: "scv-auxiliary-toggle", children: [_jsx("input", { type: "checkbox", checked: auxiliaryVisible, onChange: (event) => setAuxiliaryVisible(event.target.checked) }), "Mostra ", auxiliaryPanelLabel.toLowerCase()] }), analyticalUrl && _jsx("a", { className: "scv-analytical-link", href: analyticalUrl, children: "Apri viewer analitico" })] }) })] });
+    return _jsxs("div", { className: `scv-root ${darkMode ? "scv-dark" : ""} ${auxiliaryAvailable ? "scv-auxiliary-available" : ""} ${auxiliaryVisible && auxiliaryAvailable ? "scv-has-auxiliary" : ""} ${mobileIndexOpen ? "scv-mobile-index-open" : ""} ${className !== null && className !== void 0 ? className : ""}`, "data-scv-mounted-chunks": primaryRenderedPaths.size, "data-scv-loaded-related-chunks": mode === "combined" ? requiredCombinedCircPaths.size : 0, "data-scv-search-index-requested": search.indexRequested, "data-scv-cross-reference-index-requested": Boolean(crossReferenceIndex), "data-scv-search-error": search.errorMessage, children: [_jsx(NavigationPane, { id: navigationId, mode: mode, onModeChange: changeMode, hierarchy: hierarchy, activeLevelIds: activeLevelIds, sidebarMode: mobileIndexOpen, sidebarSession: mobileIndexSession, indexReady: Boolean(index), query: query, onQueryChange: setQuery, searchReady: search.queryReady, searchStatus: search.status, searchSource: search.source, searchDurationMs: search.durationMs, searchResults: search.results, onSearchSubmit: submitSearch, onSearchResult: selectSearchResult, onSelectUnit: selectUnit, onRequestClose: closeMobileIndex, onHistoryBack: () => { saveHistoryScroll(); window.history.back(); }, onHistoryForward: () => { saveHistoryScroll(); window.history.forward(); }, canHistoryBack: historyPosition.index > 0, canHistoryForward: historyPosition.index < historyPosition.max, searchRef: searchRef, darkMode: Boolean(darkMode), onToggleTheme: () => setDarkMode((current) => !current) }), _jsxs("div", { className: "scv-text-pane-shell", children: [_jsxs("button", { ref: mobileIndexButtonRef, type: "button", className: "scv-mobile-index-toggle", "aria-controls": navigationId, "aria-expanded": mobileIndexOpen, onClick: () => {
+                            setMobileIndexSession((session) => session + 1);
+                            setMobileIndexOpen(true);
+                            window.requestAnimationFrame(() => { var _a; return (_a = searchRef.current) === null || _a === void 0 ? void 0 : _a.focus(); });
+                        }, children: [_jsx("svg", { viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: _jsx("path", { d: "M4 6h16M4 12h16M4 18h16" }) }), _jsx("span", { className: "scv-visually-hidden", children: "Apri indice" })] }), contextSummary && _jsxs("div", { className: "scv-mobile-context", title: `${contextSummary.numbering.official} ${contextSummary.title}`, "aria-label": `Unità attiva: ${contextSummary.numbering.official} ${contextSummary.title}`, children: [_jsx("strong", { children: contextSummary.numbering.official }), _jsx("span", { children: contextSummary.title })] }), auxiliaryAvailable && _jsx("button", { type: "button", className: "scv-tools-toggle", ref: auxiliaryButtonRef, disabled: !manifest, "aria-controls": auxiliaryId, "aria-expanded": auxiliaryVisible, onClick: () => {
+                            if (auxiliaryVisible)
+                                closeAuxiliary();
+                            else {
+                                scrollRequestRef.current = requestedTargetRef.current;
+                                setMobileIndexOpen(false);
+                                setAuxiliaryVisible(true);
+                                window.requestAnimationFrame(() => {
+                                    var _a, _b;
+                                    (_b = (_a = auxiliaryPaneRef.current) === null || _a === void 0 ? void 0 : _a.querySelector("button")) === null || _b === void 0 ? void 0 : _b.focus({ preventScroll: true });
+                                });
+                            }
+                        }, "aria-label": `Apri ${auxiliaryPanelLabel}`, children: auxiliaryPanelButtonText }), contentLoadNotice && _jsx("p", { className: "scv-content-notice", role: "status", children: contentLoadNotice }), _jsx("article", { ref: textPaneRef, className: "scv-text-pane", "aria-label": "Corpus JSON", onClick: handleDocumentClick, onContextMenu: handleDocumentContextMenu, onKeyDown: handleDocumentKeyDown, onPointerDown: handleDocumentPointerDown, onPointerMove: handleDocumentPointerMove, onPointerUp: cancelDocumentLongPress, onPointerCancel: cancelDocumentLongPress, onPointerOver: handleDocumentPointerOver, onPointerOut: handleDocumentPointerOut, onFocus: handleDocumentFocus, onBlur: handleDocumentBlur, children: documentLoading || !index || !lookup ? _jsx(LoadingPanel, { label: "Caricamento del documento\u2026" }) : _jsx(DocumentContent, { records: renderRecords, relatedByTarget: relatedByTarget, mode: mode, assetsBaseUrl: assetsBaseUrl, documentLabel: documentId === "ntc2018" ? "NTC 2018" : "Circolare 7/2019", documentUnits: index.units.length, documentChunks: lookup.chunkPaths.length, hasPrevious: hasPrevious, hasNext: hasNext, notesByTarget: notesByTarget, onOpenAnnotation: openAnnotation }) }), _jsx(GlobalDocumentScrubber, { rootRef: textPaneRef, entries: scrubberEntries, activeId: scrubberActiveId, onSelect: selectScrollMarker, annotationMarkers: annotationMarkers, onAnnotationSelect: selectAnnotationMarker })] }), _jsx(ReferencePreview, { preview: referencePreview, onOpen: openPreviewReference, onClose: clearReferencePreview }), permalinkNotice && _jsx("span", { className: `scv-permalink-notice is-${permalinkNotice.placement} is-${permalinkNotice.status}`, style: { left: permalinkNotice.left, top: permalinkNotice.top }, role: "status", children: permalinkNotice.message }), annotationMenu && _jsx(AnnotationContextMenu, { state: annotationMenu, onClose: () => setAnnotationMenu(null), onBookmark: () => { setAnnotationEditor({ type: "bookmark", target: annotationMenu.target, metadata: annotationMenu.metadata, annotation: annotationMenu.bookmark, x: annotationMenu.x, y: annotationMenu.y }); setAnnotationMenu(null); }, onNote: () => { setAnnotationEditor({ type: "note", target: annotationMenu.target, metadata: annotationMenu.metadata, x: annotationMenu.x, y: annotationMenu.y }); setAnnotationMenu(null); } }), annotationEditor && _jsx(AnnotationEditor, { state: annotationEditor, busy: annotationBusy, error: annotationError, onSave: (value) => void saveAnnotationEditor(value), onDelete: annotationEditor.annotation ? () => void removeAnnotation(annotationEditor.annotation) : null, onClose: () => { setAnnotationEditor(null); setAnnotationError(null); } }), (auxiliaryVisible || auxiliaryPanelKeepMounted) && auxiliaryAvailable && renderAuxiliary && _jsx("aside", { ref: auxiliaryPaneRef, id: auxiliaryId, inert: !auxiliaryVisible ? true : undefined, "aria-hidden": !auxiliaryVisible, className: "scv-auxiliary-pane", "aria-label": auxiliaryPanelLabel, children: renderAuxiliary })] });
 }
 function LoadingRows() {
     return _jsx("div", { className: "scv-loading-rows", "aria-label": "Caricamento", children: Array.from({ length: 7 }, (_, index) => _jsx("span", {}, index)) });