@caribeng/ui 22.1.1 → 22.4.0

package/fesm2022/caribeng-ui-pdfviewer.mjs

@@ -0,0 +1,1553 @@
+import { DOCUMENT, isPlatformBrowser } from '@angular/common';
+import * as i0 from '@angular/core';
+import { InjectionToken, makeEnvironmentProviders, inject, Injectable, input, booleanAttribute, model, output, Injector, PLATFORM_ID, signal, viewChild, viewChildren, computed, effect, untracked, afterNextRender, DestroyRef, isDevMode, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
+import { injectCbTranslation, cbFormat } from '@caribeng/ui';
+import { CbIconRegistry, CbIcon } from '@caribeng/ui/icon';
+import { panelLeft, printer, zoomOut, zoomIn } from '@caribeng/ui/icons';
+import { CbSpinner } from '@caribeng/ui/spinner';
+
+const CB_PDF_VIEWER_OPTIONS = new InjectionToken('CB_PDF_VIEWER_OPTIONS');
+/**
+ * Configura el visor de PDF (worker, recursos y carga de pdf.js).
+ *
+ * @example
+ * ```ts
+ * bootstrapApplication(App, {
+ *   providers: [provideCaribeNG(), provideCbPdfViewer({ workerSrc: '/static/pdf.worker.min.mjs' })],
+ * });
+ * ```
+ */
+function provideCbPdfViewer(options) {
+    return makeEnvironmentProviders([{ provide: CB_PDF_VIEWER_OPTIONS, useValue: options }]);
+}
+/**
+ * Carga pdf.js una sola vez y configura su worker. Las URLs se resuelven contra
+ * el `<base href>` del documento: el worker de pdf.js las pediría relativas a
+ * su propio script.
+ */
+class CbPdfEngine {
+    constructor() {
+        this.options = inject(CB_PDF_VIEWER_OPTIONS, { optional: true }) ?? {};
+        this.document = inject(DOCUMENT);
+    }
+    load() {
+        this.pdfjs ??= (this.options.loader ?? (() => import('pdfjs-dist/legacy/build/pdf.mjs')))().then((pdfjs) => {
+            if (pdfjs.GlobalWorkerOptions && !pdfjs.GlobalWorkerOptions.workerSrc && !pdfjs.GlobalWorkerOptions.workerPort) {
+                pdfjs.GlobalWorkerOptions.workerSrc = this.resolve(this.options.workerSrc ?? 'pdfjs/build/pdf.worker.min.mjs');
+            }
+            return pdfjs;
+        });
+        // Si falla (p. ej. pdfjs-dist no está instalado) se puede reintentar.
+        this.pdfjs.catch(() => (this.pdfjs = undefined));
+        return this.pdfjs;
+    }
+    resources() {
+        const base = this.resolve(withSlash(this.options.assetsUrl ?? 'pdfjs/'));
+        return {
+            cMapUrl: `${base}cmaps/`,
+            standardFontDataUrl: `${base}standard_fonts/`,
+            wasmUrl: `${base}wasm/`,
+            iccUrl: `${base}iccs/`,
+        };
+    }
+    /**
+     * Resuelve una URL contra el `<base href>`, como Angular y `<img>`; pdf.js
+     * la resolvería contra la ruta actual (`/components/visor/doc.pdf`).
+     */
+    resolve(url) {
+        try {
+            return new URL(url, this.document.baseURI).href;
+        }
+        catch {
+            return String(url);
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CbPdfEngine, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CbPdfEngine, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CbPdfEngine, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+function withSlash(url) {
+    return url.endsWith('/') ? url : `${url}/`;
+}
+
+/** Resolución de impresión (ppp). */
+const PRINT_DPI = 150;
+/**
+ * Imprime el documento: rasteriza cada página a {@link PRINT_DPI} ppp en un
+ * `<iframe>` oculto y abre el diálogo de impresión del navegador (así se
+ * imprime el PDF y no la página de la aplicación).
+ */
+async function printPdfDocument(pdf, document, onProgress, rotation = 0) {
+    const urls = [];
+    const frame = document.createElement('iframe');
+    frame.setAttribute('aria-hidden', 'true');
+    frame.tabIndex = -1;
+    frame.style.cssText = 'position:fixed;right:0;bottom:0;width:0;height:0;border:0;visibility:hidden';
+    try {
+        let pageSize = '';
+        for (let n = 1; n <= pdf.numPages; n++) {
+            const page = await pdf.getPage(n);
+            const viewport = page.getViewport({ scale: PRINT_DPI / 72, rotation: (page.rotate + rotation) % 360 });
+            if (n === 1)
+                pageSize = `${Math.round((viewport.width * 72) / PRINT_DPI)}pt ${Math.round((viewport.height * 72) / PRINT_DPI)}pt`;
+            const canvas = document.createElement('canvas');
+            canvas.width = Math.floor(viewport.width);
+            canvas.height = Math.floor(viewport.height);
+            await page.render({ canvas, viewport, intent: 'print' }).promise;
+            const blob = await new Promise((resolve) => canvas.toBlob(resolve, 'image/png'));
+            if (blob)
+                urls.push(URL.createObjectURL(blob));
+            canvas.width = canvas.height = 0;
+            page.cleanup();
+            onProgress(n, pdf.numPages);
+        }
+        document.body.append(frame);
+        const doc = frame.contentDocument;
+        doc.open();
+        doc.write(`<!doctype html><html><head><style>@page{size:${pageSize};margin:0}html,body{margin:0}` +
+            `img{display:block;width:100%;height:auto;break-after:page}img:last-child{break-after:auto}</style></head><body></body></html>`);
+        doc.close();
+        await Promise.all(urls.map((src) => {
+            const img = doc.createElement('img');
+            img.src = src;
+            img.alt = '';
+            doc.body.append(img);
+            return img.decode().catch(() => undefined);
+        }));
+        const win = frame.contentWindow;
+        await new Promise((resolve) => {
+            win.addEventListener('afterprint', () => resolve(), { once: true });
+            win.focus();
+            win.print();
+            // Red de seguridad por si el navegador no emite afterprint.
+            setTimeout(resolve, 60_000);
+        });
+    }
+    finally {
+        frame.remove();
+        for (const url of urls)
+            URL.revokeObjectURL(url);
+    }
+}
+
+/**
+ * Índice de búsqueda de una página. Ignora mayúsculas, tildes y ligaduras
+ * ("dirección" encuentra "direccion") y une los espacios seguidos. Solo cuenta
+ * los elementos con texto, en el mismo orden que la capa de texto de pdf.js.
+ */
+function buildTextIndex(items) {
+    let text = '';
+    const map = [];
+    const push = (char, item, offset) => {
+        if (/\s/.test(char)) {
+            if (!text || text.endsWith(' '))
+                return;
+            char = ' ';
+        }
+        text += char;
+        map.push({ item, offset });
+    };
+    let index = 0;
+    for (const it of items) {
+        if (it.str === undefined)
+            continue;
+        const str = it.str;
+        for (let offset = 0; offset < str.length; offset++) {
+            for (const char of normalizeChar(str[offset]))
+                push(char, index, offset);
+        }
+        if (it.hasEOL)
+            push(' ', index, str.length);
+        index++;
+    }
+    return { text, map };
+}
+/** Normaliza el texto buscado igual que el índice. */
+function normalizeQuery(query) {
+    return Array.from(query, normalizeChar).join('').replace(/\s+/g, ' ').trim();
+}
+/** Coincidencias de `query` en una página. */
+function findMatches(index, query, page) {
+    const q = normalizeQuery(query);
+    if (!q)
+        return [];
+    const matches = [];
+    let from = index.text.indexOf(q);
+    while (from !== -1) {
+        const last = index.map[from + q.length - 1];
+        matches.push({ page, start: index.map[from], end: { item: last.item, offset: last.offset + 1 } });
+        from = index.text.indexOf(q, from + q.length);
+    }
+    return matches;
+}
+/**
+ * Resalta las coincidencias en la capa de texto de una página. Restaura antes
+ * el texto original. Devuelve el resaltado de `selected`, si está en la página.
+ */
+function highlightMatches(divs, strings, matches, selected) {
+    for (let i = 0; i < divs.length; i++) {
+        if (divs[i].childElementCount)
+            divs[i].textContent = strings[i] ?? '';
+    }
+    const segments = new Map();
+    for (const m of matches) {
+        for (let item = m.start.item; item <= m.end.item; item++) {
+            const from = item === m.start.item ? m.start.offset : 0;
+            const to = item === m.end.item ? m.end.offset : (strings[item]?.length ?? 0);
+            if (to <= from)
+                continue;
+            const list = segments.get(item) ?? [];
+            list.push({ from, to, selected: m === selected });
+            segments.set(item, list);
+        }
+    }
+    let selectedEl = null;
+    for (const [item, list] of segments) {
+        const div = divs[item];
+        const str = strings[item];
+        if (!div || str === undefined)
+            continue;
+        const doc = div.ownerDocument;
+        const nodes = [];
+        let pos = 0;
+        for (const s of list.sort((a, b) => a.from - b.from)) {
+            if (s.from > pos)
+                nodes.push(doc.createTextNode(str.slice(pos, s.from)));
+            const mark = doc.createElement('span');
+            mark.className = s.selected ? 'cb-pdf__hl cb-is-selected' : 'cb-pdf__hl';
+            mark.textContent = str.slice(Math.max(pos, s.from), s.to);
+            nodes.push(mark);
+            if (s.selected)
+                selectedEl ??= mark;
+            pos = Math.max(pos, s.to);
+        }
+        if (pos < str.length)
+            nodes.push(doc.createTextNode(str.slice(pos)));
+        div.replaceChildren(...nodes);
+    }
+    return selectedEl;
+}
+function normalizeChar(char) {
+    return char.normalize('NFKD').replace(/\p{M}/gu, '').toLocaleLowerCase();
+}
+
+let nextUid = 0;
+/** Puntos PDF (1/72") a píxeles CSS (1/96"): 100 % es el tamaño real. */
+const CSS_UNITS = 96 / 72;
+const ZOOM_LEVELS = [0.5, 0.75, 1, 1.25, 1.5, 2, 3, 4];
+const MIN_ZOOM = 0.25;
+const MAX_ZOOM = 5;
+/** Margen alrededor de las páginas (px), igual que en el CSS. */
+const PAGE_GAP = 16;
+/** Píxeles máximos de un canvas (evita agotar la memoria en zoom alto). */
+const MAX_CANVAS_PIXELS = 2 ** 24;
+const THUMB_WIDTH = 112;
+const PDF_ICONS = {
+    'zoom-in': zoomIn,
+    'zoom-out': zoomOut,
+    printer,
+    'panel-left': panelLeft,
+};
+/**
+ * Visor de PDF sobre [pdf.js](https://mozilla.github.io/pdf.js/) (`pdfjs-dist`,
+ * dependencia opcional que se carga al abrir el primer documento).
+ *
+ * Renderiza las páginas a medida que se ven, con texto seleccionable y
+ * legible por lectores de pantalla, búsqueda (ignora tildes y mayúsculas),
+ * miniaturas, zoom, giro, descarga, impresión y documentos con contraseña.
+ *
+ * @example
+ * ```html
+ * <cb-pdf-viewer src="/docs/extracto.pdf" [(page)]="pagina" zoom="page-width" />
+ * ```
+ */
+class CbPdfViewer {
+    constructor() {
+        /** Textos de interfaz en el idioma activo (`provideCaribeNG({ locale })`). */
+        this.t = injectCbTranslation();
+        this.format = cbFormat;
+        /** Documento: URL, `ArrayBuffer`, `Uint8Array`, `Blob` o `File`. */
+        this.src = input(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "src" }] : /* istanbul ignore next */ []));
+        /** Nombre del archivo al descargar (por defecto, el de la URL o del `File`). */
+        this.fileName = input(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "fileName" }] : /* istanbul ignore next */ []));
+        /** Contraseña para abrir el documento sin pedirla. */
+        this.password = input(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "password" }] : /* istanbul ignore next */ []));
+        /** Envía cookies en peticiones a otro origen. */
+        this.withCredentials = input(false, { ...(ngDevMode ? { debugName: "withCredentials" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+        /** Cabeceras HTTP para descargar el documento (p. ej. `Authorization`). */
+        this.httpHeaders = input(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "httpHeaders" }] : /* istanbul ignore next */ []));
+        /** Página actual (desde 1). */
+        this.page = model(1, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "page" }] : /* istanbul ignore next */ []));
+        this.zoom = model('page-width', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "zoom" }] : /* istanbul ignore next */ []));
+        this.rotation = model(0, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "rotation" }] : /* istanbul ignore next */ []));
+        /** Panel de miniaturas abierto. */
+        this.sidebar = model(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "sidebar" }] : /* istanbul ignore next */ []));
+        this.showToolbar = input(true, { ...(ngDevMode ? { debugName: "showToolbar" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+        this.showSearch = input(true, { ...(ngDevMode ? { debugName: "showSearch" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+        this.showThumbnails = input(true, { ...(ngDevMode ? { debugName: "showThumbnails" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+        this.showRotate = input(true, { ...(ngDevMode ? { debugName: "showRotate" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+        this.downloadable = input(true, { ...(ngDevMode ? { debugName: "downloadable" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+        this.printable = input(true, { ...(ngDevMode ? { debugName: "printable" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+        /** Nombre accesible del visor (por defecto, "Visor de PDF"). */
+        this.ariaLabel = input('', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+        /** Documento abierto. */
+        this.loaded = output();
+        /** No se pudo abrir el documento. */
+        this.loadError = output();
+        this.engine = inject(CbPdfEngine);
+        this.document = inject(DOCUMENT);
+        this.injector = inject(Injector);
+        this.isBrowser = isPlatformBrowser(inject(PLATFORM_ID));
+        this.uid = `cb-pdf-${++nextUid}`;
+        this.state = signal('idle', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
+        this.progress = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "progress" }] : /* istanbul ignore next */ []));
+        this.passwordIncorrect = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "passwordIncorrect" }] : /* istanbul ignore next */ []));
+        this.printProgress = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "printProgress" }] : /* istanbul ignore next */ []));
+        this.numPages = signal(0, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "numPages" }] : /* istanbul ignore next */ []));
+        this.sizes = signal([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "sizes" }] : /* istanbul ignore next */ []));
+        this.box = signal({ width: 0, height: 0 }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "box" }] : /* istanbul ignore next */ []));
+        this.query = signal('', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "query" }] : /* istanbul ignore next */ []));
+        this.matches = signal([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "matches" }] : /* istanbul ignore next */ []));
+        this.matchIndex = signal(-1, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "matchIndex" }] : /* istanbul ignore next */ []));
+        this.searching = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "searching" }] : /* istanbul ignore next */ []));
+        this.zoomLevels = ZOOM_LEVELS;
+        this.viewport = viewChild('viewport', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "viewport" }] : /* istanbul ignore next */ []));
+        this.pageEls = viewChildren('pageEl', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "pageEls" }] : /* istanbul ignore next */ []));
+        this.thumbEls = viewChildren('thumbEl', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "thumbEls" }] : /* istanbul ignore next */ []));
+        this.searchInput = viewChild('searchInput', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "searchInput" }] : /* istanbul ignore next */ []));
+        this.passwordInput = viewChild('passwordInput', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "passwordInput" }] : /* istanbul ignore next */ []));
+        /** Factor de zoom efectivo (1 = 100 %). */
+        this.scale = computed(() => {
+            const zoom = this.zoom();
+            if (typeof zoom === 'number')
+                return clamp(zoom, MIN_ZOOM, MAX_ZOOM);
+            const size = this.sizes()[this.page() - 1] ?? this.sizes()[0];
+            const { width, height } = this.box();
+            if (!size || width <= 0)
+                return 1;
+            const [w, h] = this.rotatedPoints(size);
+            const fitWidth = (width - PAGE_GAP * 2) / (w * CSS_UNITS);
+            const fit = zoom === 'page-fit' && height > 0 ? Math.min(fitWidth, (height - PAGE_GAP * 2) / (h * CSS_UNITS)) : fitWidth;
+            return clamp(fit, MIN_ZOOM, MAX_ZOOM);
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "scale" }] : /* istanbul ignore next */ []));
+        /** Tamaño de cada página en píxeles CSS con el zoom y el giro actuales. */
+        this.pageBoxes = computed(() => {
+            const factor = this.scale() * CSS_UNITS;
+            return this.sizes().map((size) => {
+                const [w, h] = this.rotatedPoints(size);
+                return { width: Math.floor(w * factor), height: Math.floor(h * factor), scaleFactor: factor, userUnit: size.userUnit };
+            });
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "pageBoxes" }] : /* istanbul ignore next */ []));
+        this.thumbBoxes = computed(() => this.sizes().map((size) => {
+            const [w, h] = this.rotatedPoints(size);
+            return { width: THUMB_WIDTH, height: Math.round((THUMB_WIDTH * h) / w) };
+        }), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "thumbBoxes" }] : /* istanbul ignore next */ []));
+        /** Valor del selector de zoom. */
+        this.zoomValue = computed(() => {
+            const zoom = this.zoom();
+            return typeof zoom === 'number' ? String(zoom) : zoom;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "zoomValue" }] : /* istanbul ignore next */ []));
+        this.customZoom = computed(() => {
+            const zoom = this.zoom();
+            return typeof zoom === 'number' && !ZOOM_LEVELS.includes(zoom) ? zoom : null;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "customZoom" }] : /* istanbul ignore next */ []));
+        this.searchStatus = computed(() => {
+            if (!this.query().trim())
+                return '';
+            const total = this.matches().length;
+            if (total)
+                return cbFormat(this.t().matchOf, this.matchIndex() + 1, total);
+            return this.searching() ? this.t().searching : this.t().noResults;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "searchStatus" }] : /* istanbul ignore next */ []));
+        this.loadToken = 0;
+        this.searchToken = 0;
+        this.pages = new Map();
+        this.texts = new Map();
+        this.indexes = new Map();
+        this.rendered = new Map();
+        this.thumbs = new Map();
+        this.visible = new Set();
+        this.visibleThumbs = new Set();
+        /** Página que se ve al desplazarse (distingue el scroll del usuario de un cambio de `page`). */
+        this.visiblePage = 1;
+        this.scrollFrame = 0;
+        this.scrollToMatch = false;
+        const registry = inject(CbIconRegistry);
+        for (const [name, body] of Object.entries(PDF_ICONS)) {
+            if (!registry.has(name))
+                registry.register({ [name]: body });
+        }
+        effect(() => {
+            const src = this.src();
+            const password = this.password();
+            untracked(() => void this.open(src, password));
+        });
+        // Al cambiar el zoom o el giro se conserva el punto de lectura.
+        effect(() => {
+            this.scale();
+            this.rotation();
+            if (untracked(this.state) !== 'ready')
+                return;
+            const anchor = this.readAnchor();
+            afterNextRender(() => {
+                if (anchor)
+                    this.restoreAnchor(anchor);
+                this.renderVisible();
+                this.renderThumbs();
+            }, { injector: this.injector });
+        });
+        // Cambio de `page` desde fuera (o desde la barra): desplaza hasta ella.
+        effect(() => {
+            const page = this.page();
+            if (this.state() !== 'ready' || page === this.visiblePage)
+                return;
+            afterNextRender(() => this.scrollToPage(page), { injector: this.injector });
+        });
+        effect(() => {
+            this.pageEls();
+            if (this.state() === 'ready')
+                untracked(() => this.observePages());
+        });
+        effect(() => {
+            this.thumbEls();
+            if (this.sidebar() && this.state() === 'ready')
+                untracked(() => this.observeThumbs());
+        });
+        effect(() => {
+            this.matches();
+            this.matchIndex();
+            untracked(() => this.refreshHighlights());
+        });
+        inject(DestroyRef).onDestroy(() => {
+            this.loadToken++;
+            this.close();
+            this.resizeObserver?.disconnect();
+            clearTimeout(this.searchTimer);
+            if (this.scrollFrame)
+                cancelAnimationFrame(this.scrollFrame);
+        });
+    }
+    // --- API pública -----------------------------------------------------------
+    goToPage(page) {
+        const n = clamp(Math.round(page), 1, Math.max(1, this.numPages()));
+        this.page.set(n);
+        if (n === this.visiblePage)
+            this.scrollToPage(n);
+    }
+    previousPage() {
+        this.goToPage(this.page() - 1);
+    }
+    nextPage() {
+        this.goToPage(this.page() + 1);
+    }
+    zoomIn() {
+        const scale = this.scale();
+        this.zoom.set(ZOOM_LEVELS.find((z) => z > scale + 0.01) ?? Math.min(MAX_ZOOM, round2(scale * 1.25)));
+    }
+    zoomOut() {
+        const scale = this.scale();
+        this.zoom.set([...ZOOM_LEVELS].reverse().find((z) => z < scale - 0.01) ?? Math.max(MIN_ZOOM, round2(scale / 1.25)));
+    }
+    /** Gira 90° a la derecha (o a la izquierda con `-1`). */
+    rotate(direction = 1) {
+        this.rotation.set((((this.rotation() + direction * 90) % 360) + 360) % 360);
+    }
+    /** Busca en todo el documento; resalta y lleva a la primera coincidencia. */
+    async search(query) {
+        clearTimeout(this.searchTimer);
+        this.query.set(query);
+        const token = ++this.searchToken;
+        this.matches.set([]);
+        this.matchIndex.set(-1);
+        if (!query.trim() || !this.pdf) {
+            this.searching.set(false);
+            return;
+        }
+        this.searching.set(true);
+        const found = [];
+        // La primera coincidencia se busca desde la página actual.
+        const start = this.page();
+        for (let n = 1; n <= this.numPages(); n++) {
+            const index = await this.textIndex(n).catch(() => null);
+            if (token !== this.searchToken)
+                return;
+            if (!index)
+                continue;
+            const pageMatches = findMatches(index, query, n);
+            if (!pageMatches.length)
+                continue;
+            found.push(...pageMatches);
+            this.matches.set([...found]);
+            const current = this.matchIndex();
+            const first = found.findIndex((m) => m.page >= start);
+            if (current === -1 && first !== -1)
+                this.selectMatch(first);
+        }
+        if (token !== this.searchToken)
+            return;
+        this.searching.set(false);
+        if (this.matchIndex() === -1 && found.length)
+            this.selectMatch(0);
+    }
+    findNext() {
+        const total = this.matches().length;
+        if (total)
+            this.selectMatch((this.matchIndex() + 1) % total);
+    }
+    findPrevious() {
+        const total = this.matches().length;
+        if (total)
+            this.selectMatch((this.matchIndex() - 1 + total) % total);
+    }
+    /** Descarga el documento original. */
+    async download() {
+        if (!this.pdf)
+            return;
+        const src = this.src();
+        const blob = src instanceof Blob ? src : new Blob([(await this.pdf.getData())], { type: 'application/pdf' });
+        const url = URL.createObjectURL(blob);
+        const a = this.document.createElement('a');
+        a.href = url;
+        a.download = this.downloadName();
+        a.style.display = 'none';
+        this.document.body.append(a);
+        a.click();
+        a.remove();
+        setTimeout(() => URL.revokeObjectURL(url), 0);
+    }
+    /** Imprime el documento (no la página de la aplicación). */
+    async print() {
+        if (!this.pdf || this.printProgress())
+            return;
+        this.printProgress.set({ done: 0, total: this.numPages() });
+        try {
+            await printPdfDocument(this.pdf, this.document, (done, total) => this.printProgress.set({ done, total }), this.rotation());
+        }
+        finally {
+            this.printProgress.set(null);
+        }
+    }
+    // --- Carga -----------------------------------------------------------------
+    async open(src, password) {
+        const token = ++this.loadToken;
+        this.close();
+        if (!src || !this.isBrowser) {
+            this.state.set('idle');
+            return;
+        }
+        this.state.set('loading');
+        this.progress.set(null);
+        this.passwordIncorrect.set(false);
+        try {
+            const pdfjs = await this.engine.load();
+            const data = await toData(src);
+            if (token !== this.loadToken)
+                return;
+            this.pdfjs = pdfjs;
+            const task = pdfjs.getDocument({
+                ...this.engine.resources(),
+                ...(data ? { data } : { url: this.engine.resolve(src) }),
+                password,
+                withCredentials: this.withCredentials(),
+                httpHeaders: this.httpHeaders(),
+            });
+            this.loadingTask = task;
+            task.onProgress = ({ loaded, total }) => {
+                if (token === this.loadToken)
+                    this.progress.set(total ? Math.min(100, Math.round((loaded / total) * 100)) : null);
+            };
+            task.onPassword = (update, reason) => {
+                if (token !== this.loadToken)
+                    return;
+                this.passwordCallback = update;
+                this.passwordIncorrect.set(reason === (pdfjs.PasswordResponses?.INCORRECT_PASSWORD ?? 2));
+                this.state.set('password');
+                afterNextRender(() => this.passwordInput()?.nativeElement.focus(), { injector: this.injector });
+            };
+            const pdf = await task.promise;
+            if (token !== this.loadToken) {
+                void task.destroy().catch(() => undefined);
+                return;
+            }
+            this.pdf = pdf;
+            // Mide el área antes del primer render para que "ajustar al ancho" no renderice dos veces.
+            this.observeResize();
+            const first = sizeOf(await this.getPage(1));
+            if (token !== this.loadToken)
+                return;
+            this.sizes.set(Array.from({ length: pdf.numPages }, () => first));
+            this.numPages.set(pdf.numPages);
+            const page = clamp(this.page(), 1, pdf.numPages);
+            this.visiblePage = 1;
+            this.page.set(page);
+            this.state.set('ready');
+            this.loaded.emit({ numPages: pdf.numPages });
+            afterNextRender(() => {
+                if (page > 1)
+                    this.scrollToPage(page);
+                this.renderVisible();
+            }, { injector: this.injector });
+            void this.measurePages(token);
+        }
+        catch (error) {
+            if (token !== this.loadToken)
+                return;
+            this.state.set('error');
+            if (isDevMode())
+                console.error('[cb-pdf-viewer]', error);
+            this.loadError.emit(error);
+        }
+    }
+    submitPassword(event, value) {
+        event.preventDefault();
+        if (!this.passwordCallback)
+            return;
+        this.state.set('loading');
+        this.passwordCallback(value);
+    }
+    /** Lee el tamaño real de todas las páginas (pueden ser distintas de la primera). */
+    async measurePages(token) {
+        const sizes = [...this.sizes()];
+        let changed = false;
+        for (let n = 2; n <= sizes.length; n++) {
+            const page = await this.getPage(n).catch(() => null);
+            if (token !== this.loadToken)
+                return;
+            if (!page)
+                continue;
+            const size = sizeOf(page);
+            const prev = sizes[n - 1];
+            if (size.width !== prev.width || size.height !== prev.height || size.rotate !== prev.rotate || size.userUnit !== prev.userUnit) {
+                sizes[n - 1] = size;
+                changed = true;
+            }
+        }
+        if (changed)
+            this.sizes.set(sizes);
+    }
+    close() {
+        for (const page of [...this.rendered.keys()])
+            this.unrender(page);
+        this.pageObserver?.disconnect();
+        this.thumbObserver?.disconnect();
+        this.pageObserver = this.thumbObserver = undefined;
+        void this.loadingTask?.destroy().catch(() => undefined);
+        this.loadingTask = undefined;
+        this.pdf = undefined;
+        this.passwordCallback = undefined;
+        this.pages.clear();
+        this.texts.clear();
+        this.indexes.clear();
+        this.thumbs.clear();
+        this.visible.clear();
+        this.visibleThumbs.clear();
+        this.searchToken++;
+        this.matches.set([]);
+        this.matchIndex.set(-1);
+        this.searching.set(false);
+        this.numPages.set(0);
+        this.sizes.set([]);
+    }
+    getPage(n) {
+        let page = this.pages.get(n);
+        if (!page) {
+            page = this.pdf.getPage(n);
+            this.pages.set(n, page);
+        }
+        return page;
+    }
+    textContent(n) {
+        let text = this.texts.get(n);
+        if (!text) {
+            text = this.getPage(n).then((page) => page.getTextContent());
+            this.texts.set(n, text);
+        }
+        return text;
+    }
+    textIndex(n) {
+        let index = this.indexes.get(n);
+        if (!index) {
+            index = this.textContent(n).then((text) => buildTextIndex(text.items));
+            this.indexes.set(n, index);
+        }
+        return index;
+    }
+    // --- Renderizado ------------------------------------------------------------
+    /** Observa qué páginas están cerca de la vista para renderizar solo esas. */
+    observePages() {
+        const root = this.viewport()?.nativeElement;
+        if (!root)
+            return;
+        this.pageObserver?.disconnect();
+        if (typeof IntersectionObserver === 'undefined') {
+            this.visible.clear();
+            for (let n = 1; n <= this.numPages(); n++)
+                this.visible.add(n);
+            this.renderVisible();
+            return;
+        }
+        this.pageObserver = new IntersectionObserver((entries) => {
+            for (const entry of entries) {
+                const n = Number(entry.target.dataset['page']);
+                if (entry.isIntersecting)
+                    this.visible.add(n);
+                else {
+                    this.visible.delete(n);
+                    this.unrender(n);
+                }
+            }
+            this.renderVisible();
+        }, { root, rootMargin: '50% 0px' });
+        for (const el of this.pageEls())
+            this.pageObserver.observe(el.nativeElement);
+    }
+    renderVisible() {
+        const current = this.page();
+        const pages = [...this.visible].sort((a, b) => Math.abs(a - current) - Math.abs(b - current));
+        for (const n of pages)
+            void this.renderPage(n);
+    }
+    async renderPage(n) {
+        const scale = this.scale() * CSS_UNITS;
+        const rotation = this.rotation();
+        const key = `${scale}:${rotation}`;
+        if (this.rendered.get(n)?.key === key || !this.pdf)
+            return;
+        this.unrender(n);
+        let cancelled = false;
+        let renderTask;
+        const entry = {
+            key,
+            cancel: () => {
+                cancelled = true;
+                renderTask?.cancel();
+                entry.textLayer?.cancel();
+            },
+        };
+        this.rendered.set(n, entry);
+        try {
+            const page = await this.getPage(n);
+            const el = this.pageEl(n);
+            if (cancelled || !el)
+                return;
+            const viewport = page.getViewport({ scale, rotation: (page.rotate + rotation) % 360 });
+            const canvas = this.document.createElement('canvas');
+            const ratio = outputScale(viewport.width, viewport.height);
+            canvas.width = Math.floor(viewport.width * ratio);
+            canvas.height = Math.floor(viewport.height * ratio);
+            canvas.setAttribute('aria-hidden', 'true');
+            const task = page.render({ canvas, viewport, transform: ratio === 1 ? undefined : [ratio, 0, 0, ratio, 0, 0] });
+            renderTask = task;
+            await task.promise;
+            if (cancelled)
+                return;
+            el.querySelector('.cb-pdf__canvas')?.replaceChildren(canvas);
+            const textEl = el.querySelector('.cb-pdf__text');
+            if (!textEl || !this.pdfjs?.TextLayer)
+                return;
+            const textContentSource = await this.textContent(n);
+            if (cancelled)
+                return;
+            textEl.replaceChildren();
+            const textLayer = new this.pdfjs.TextLayer({ textContentSource, container: textEl, viewport });
+            entry.textLayer = textLayer;
+            await textLayer.render();
+            if (cancelled)
+                return;
+            this.highlightPage(n, entry);
+        }
+        catch {
+            // Render cancelado o página dañada: se deja en blanco.
+            if (this.rendered.get(n) === entry && !cancelled)
+                entry.key = '';
+        }
+    }
+    unrender(n) {
+        const entry = this.rendered.get(n);
+        if (!entry)
+            return;
+        entry.cancel();
+        this.rendered.delete(n);
+        const el = this.pageEl(n);
+        el?.querySelector('.cb-pdf__canvas')?.replaceChildren();
+        el?.querySelector('.cb-pdf__text')?.replaceChildren();
+    }
+    observeThumbs() {
+        const root = this.document.getElementById(`${this.uid}-thumbs`);
+        if (!root)
+            return;
+        this.thumbObserver?.disconnect();
+        if (typeof IntersectionObserver === 'undefined') {
+            for (let n = 1; n <= this.numPages(); n++)
+                this.visibleThumbs.add(n);
+            this.renderThumbs();
+            return;
+        }
+        this.thumbObserver = new IntersectionObserver((entries) => {
+            for (const entry of entries) {
+                const n = Number(entry.target.dataset['page']);
+                if (entry.isIntersecting)
+                    this.visibleThumbs.add(n);
+                else
+                    this.visibleThumbs.delete(n);
+            }
+            this.renderThumbs();
+        }, { root, rootMargin: '100% 0px' });
+        for (const el of this.thumbEls())
+            this.thumbObserver.observe(el.nativeElement);
+    }
+    renderThumbs() {
+        if (!this.sidebar())
+            return;
+        for (const n of this.visibleThumbs)
+            void this.renderThumb(n);
+    }
+    async renderThumb(n) {
+        const key = String(this.rotation());
+        if (this.thumbs.get(n) === key || !this.pdf)
+            return;
+        this.thumbs.set(n, key);
+        try {
+            const page = await this.getPage(n);
+            const rotation = (page.rotate + this.rotation()) % 360;
+            const base = page.getViewport({ scale: 1, rotation });
+            const ratio = Math.min(2, globalThis.devicePixelRatio || 1);
+            const viewport = page.getViewport({ scale: (THUMB_WIDTH / base.width) * ratio, rotation });
+            const canvas = this.document.createElement('canvas');
+            canvas.width = Math.floor(viewport.width);
+            canvas.height = Math.floor(viewport.height);
+            canvas.setAttribute('aria-hidden', 'true');
+            await page.render({ canvas, viewport }).promise;
+            if (this.thumbs.get(n) !== key)
+                return;
+            this.thumbEls()
+                .find((el) => el.nativeElement.dataset['page'] === String(n))
+                ?.nativeElement.querySelector('.cb-pdf__thumb-canvas')
+                ?.replaceChildren(canvas);
+        }
+        catch {
+            this.thumbs.delete(n);
+        }
+    }
+    // --- Búsqueda ---------------------------------------------------------------
+    selectMatch(index) {
+        this.matchIndex.set(index);
+        const match = this.matches()[index];
+        if (!match)
+            return;
+        this.scrollToMatch = true;
+        if (this.rendered.get(match.page)?.textLayer)
+            this.refreshHighlights();
+        else
+            this.goToPage(match.page);
+    }
+    refreshHighlights() {
+        for (const [n, entry] of this.rendered)
+            this.highlightPage(n, entry);
+    }
+    highlightPage(n, entry) {
+        const layer = entry.textLayer;
+        if (!layer)
+            return;
+        const matches = this.matches();
+        const selected = matches[this.matchIndex()] ?? null;
+        const el = highlightMatches(layer.textDivs, layer.textContentItemsStr, matches.filter((m) => m.page === n), selected?.page === n ? selected : null);
+        if (el && this.scrollToMatch) {
+            this.scrollToMatch = false;
+            el.scrollIntoView?.({ block: 'center', inline: 'nearest' });
+        }
+    }
+    onSearchInput(value) {
+        this.query.set(value);
+        clearTimeout(this.searchTimer);
+        this.searchTimer = setTimeout(() => void this.search(value), 250);
+    }
+    onSearchKeydown(event, value) {
+        if (event.key === 'Enter') {
+            event.preventDefault();
+            if (value !== this.query() || (!this.matches().length && !this.searching()))
+                void this.search(value);
+            else if (event.shiftKey)
+                this.findPrevious();
+            else
+                this.findNext();
+        }
+        else if (event.key === 'Escape' && value) {
+            event.preventDefault();
+            event.stopPropagation();
+            event.target.value = '';
+            void this.search('');
+        }
+    }
+    // --- Desplazamiento y tamaño ---------------------------------------------------
+    onScroll() {
+        cancelAnimationFrame(this.scrollFrame);
+        this.scrollFrame = requestAnimationFrame(() => {
+            const page = this.mostVisiblePage();
+            if (page && page !== this.visiblePage) {
+                this.visiblePage = page;
+                this.page.set(page);
+            }
+        });
+    }
+    mostVisiblePage() {
+        const root = this.viewport()?.nativeElement;
+        if (!root)
+            return null;
+        const top = root.scrollTop;
+        const bottom = top + root.clientHeight;
+        let best = null;
+        let bestArea = 0;
+        for (const { nativeElement: el } of this.pageEls()) {
+            const visible = Math.min(bottom, el.offsetTop + el.offsetHeight) - Math.max(top, el.offsetTop);
+            if (visible > bestArea) {
+                bestArea = visible;
+                best = Number(el.dataset['page']);
+            }
+        }
+        return best;
+    }
+    scrollToPage(n) {
+        const root = this.viewport()?.nativeElement;
+        const el = this.pageEl(n);
+        if (!root || !el)
+            return;
+        this.visiblePage = n;
+        root.scrollTop = el.offsetTop - PAGE_GAP;
+    }
+    readAnchor() {
+        const root = this.viewport()?.nativeElement;
+        const el = this.pageEl(this.visiblePage);
+        if (!root || !el || !el.offsetHeight)
+            return null;
+        return { page: this.visiblePage, ratio: (root.scrollTop - el.offsetTop) / el.offsetHeight };
+    }
+    restoreAnchor(anchor) {
+        const root = this.viewport()?.nativeElement;
+        const el = this.pageEl(anchor.page);
+        if (root && el)
+            root.scrollTop = el.offsetTop + anchor.ratio * el.offsetHeight;
+    }
+    observeResize() {
+        const root = this.viewport()?.nativeElement;
+        if (!root)
+            return;
+        const measure = () => this.box.set({ width: root.clientWidth, height: root.clientHeight });
+        measure();
+        if (typeof ResizeObserver === 'undefined' || this.resizeObserver)
+            return;
+        this.resizeObserver = new ResizeObserver(measure);
+        this.resizeObserver.observe(root);
+    }
+    pageEl(n) {
+        return this.pageEls()[n - 1]?.nativeElement;
+    }
+    // --- Barra y teclado -------------------------------------------------------------
+    onPageInput(event) {
+        const input = event.target;
+        const value = Number.parseInt(input.value, 10);
+        if (Number.isFinite(value))
+            this.goToPage(value);
+        input.value = String(this.page());
+    }
+    onZoomSelect(value) {
+        this.zoom.set(value === 'page-width' || value === 'page-fit' ? value : Number(value));
+    }
+    onThumbKeydown(event, n) {
+        const next = event.key === 'ArrowDown' ? n + 1 : event.key === 'ArrowUp' ? n - 1 : event.key === 'Home' ? 1 : event.key === 'End' ? this.numPages() : 0;
+        if (!next || next < 1 || next > this.numPages())
+            return;
+        event.preventDefault();
+        this.thumbEls()[next - 1]?.nativeElement.focus();
+    }
+    onHostKeydown(event) {
+        if (this.state() !== 'ready' || !(event.ctrlKey || event.metaKey) || event.altKey)
+            return;
+        const key = event.key.toLowerCase();
+        if (key === '+' || key === '=')
+            this.zoomIn();
+        else if (key === '-')
+            this.zoomOut();
+        else if (key === '0')
+            this.zoom.set('page-width');
+        else if (key === 'f' && this.showToolbar() && this.showSearch()) {
+            const input = this.searchInput()?.nativeElement;
+            input?.focus();
+            input?.select();
+        }
+        else if (key === 'p' && this.printable())
+            void this.print();
+        else
+            return;
+        event.preventDefault();
+    }
+    onWheel(event) {
+        if (!(event.ctrlKey || event.metaKey) || this.state() !== 'ready')
+            return;
+        event.preventDefault();
+        if (event.deltaY < 0)
+            this.zoomIn();
+        else
+            this.zoomOut();
+    }
+    percent(zoom) {
+        return `${Math.round(zoom * 100)} %`;
+    }
+    downloadName() {
+        const name = this.fileName();
+        if (name)
+            return name;
+        const src = this.src();
+        if (typeof File !== 'undefined' && src instanceof File && src.name)
+            return src.name;
+        if (typeof src === 'string' || src instanceof URL) {
+            const last = decodeURIComponent(String(src).split(/[?#]/)[0].split('/').pop() ?? '');
+            if (last)
+                return /\.pdf$/i.test(last) ? last : `${last}.pdf`;
+        }
+        return 'document.pdf';
+    }
+    rotatedPoints(size) {
+        return (size.rotate + this.rotation()) % 180 === 0 ? [size.width, size.height] : [size.height, size.width];
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CbPdfViewer, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: CbPdfViewer, isStandalone: true, selector: "cb-pdf-viewer", inputs: { src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: false, transformFunction: null }, fileName: { classPropertyName: "fileName", publicName: "fileName", isSignal: true, isRequired: false, transformFunction: null }, password: { classPropertyName: "password", publicName: "password", isSignal: true, isRequired: false, transformFunction: null }, withCredentials: { classPropertyName: "withCredentials", publicName: "withCredentials", isSignal: true, isRequired: false, transformFunction: null }, httpHeaders: { classPropertyName: "httpHeaders", publicName: "httpHeaders", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, zoom: { classPropertyName: "zoom", publicName: "zoom", isSignal: true, isRequired: false, transformFunction: null }, rotation: { classPropertyName: "rotation", publicName: "rotation", isSignal: true, isRequired: false, transformFunction: null }, sidebar: { classPropertyName: "sidebar", publicName: "sidebar", isSignal: true, isRequired: false, transformFunction: null }, showToolbar: { classPropertyName: "showToolbar", publicName: "showToolbar", isSignal: true, isRequired: false, transformFunction: null }, showSearch: { classPropertyName: "showSearch", publicName: "showSearch", isSignal: true, isRequired: false, transformFunction: null }, showThumbnails: { classPropertyName: "showThumbnails", publicName: "showThumbnails", isSignal: true, isRequired: false, transformFunction: null }, showRotate: { classPropertyName: "showRotate", publicName: "showRotate", isSignal: true, isRequired: false, transformFunction: null }, downloadable: { classPropertyName: "downloadable", publicName: "downloadable", isSignal: true, isRequired: false, transformFunction: null }, printable: { classPropertyName: "printable", publicName: "printable", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { page: "pageChange", zoom: "zoomChange", rotation: "rotationChange", sidebar: "sidebarChange", loaded: "loaded", loadError: "loadError" }, host: { attributes: { "role": "region" }, listeners: { "keydown": "onHostKeydown($event)" }, properties: { "attr.aria-label": "ariaLabel() || t().pdfViewer" }, classAttribute: "cb-pdf-viewer" }, viewQueries: [{ propertyName: "viewport", first: true, predicate: ["viewport"], descendants: true, isSignal: true }, { propertyName: "pageEls", predicate: ["pageEl"], descendants: true, isSignal: true }, { propertyName: "thumbEls", predicate: ["thumbEl"], descendants: true, isSignal: true }, { propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true, isSignal: true }, { propertyName: "passwordInput", first: true, predicate: ["passwordInput"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    @if (showToolbar()) {
+      <div class="cb-pdf__toolbar">
+        @if (showThumbnails()) {
+          <div class="cb-pdf__group">
+            <button
+              type="button"
+              class="cb-pdf__tool"
+              [attr.aria-label]="t().thumbnails"
+              [attr.aria-expanded]="sidebar()"
+              [attr.aria-controls]="uid + '-thumbs'"
+              [disabled]="state() !== 'ready'"
+              (click)="sidebar.set(!sidebar())"
+            >
+              <cb-icon name="panel-left" [size]="18" aria-hidden="true" />
+            </button>
+          </div>
+        }
+
+        <div class="cb-pdf__group" role="group" [attr.aria-label]="t().pagination">
+          <button
+            type="button"
+            class="cb-pdf__tool"
+            [attr.aria-label]="t().previousPage"
+            [disabled]="state() !== 'ready' || page() <= 1"
+            (click)="previousPage()"
+          >
+            <cb-icon name="chevron-up" [size]="18" aria-hidden="true" />
+          </button>
+          <button
+            type="button"
+            class="cb-pdf__tool"
+            [attr.aria-label]="t().nextPage"
+            [disabled]="state() !== 'ready' || page() >= numPages()"
+            (click)="nextPage()"
+          >
+            <cb-icon name="chevron-down" [size]="18" aria-hidden="true" />
+          </button>
+          <input
+            class="cb-pdf__field cb-pdf__page-input"
+            type="text"
+            inputmode="numeric"
+            autocomplete="off"
+            [id]="uid + '-page'"
+            [attr.aria-label]="t().pageNumber"
+            [attr.aria-describedby]="uid + '-total'"
+            [value]="page()"
+            [disabled]="state() !== 'ready'"
+            (change)="onPageInput($event)"
+            (keydown.enter)="onPageInput($event)"
+          />
+          <span class="cb-pdf__total" [id]="uid + '-total'">{{ format(t().ofTotal, numPages() || '–') }}</span>
+        </div>
+
+        <div class="cb-pdf__group" role="group" [attr.aria-label]="t().zoomLevel">
+          <button type="button" class="cb-pdf__tool" [attr.aria-label]="t().zoomOut" [disabled]="state() !== 'ready' || scale() <= 0.25" (click)="zoomOut()">
+            <cb-icon name="zoom-out" [size]="18" aria-hidden="true" />
+          </button>
+          <select
+            class="cb-pdf__field cb-pdf__zoom"
+            [attr.aria-label]="t().zoomLevel"
+            [disabled]="state() !== 'ready'"
+            (change)="onZoomSelect($any($event.target).value)"
+          >
+            <option value="page-width" [selected]="zoomValue() === 'page-width'">{{ t().fitWidth }}</option>
+            <option value="page-fit" [selected]="zoomValue() === 'page-fit'">{{ t().fitPage }}</option>
+            @if (customZoom(); as custom) {
+              <option [value]="custom" selected>{{ percent(custom) }}</option>
+            }
+            @for (level of zoomLevels; track level) {
+              <option [value]="level" [selected]="zoomValue() === '' + level">{{ percent(level) }}</option>
+            }
+          </select>
+          <button type="button" class="cb-pdf__tool" [attr.aria-label]="t().zoomIn" [disabled]="state() !== 'ready' || scale() >= 5" (click)="zoomIn()">
+            <cb-icon name="zoom-in" [size]="18" aria-hidden="true" />
+          </button>
+          @if (showRotate()) {
+            <button type="button" class="cb-pdf__tool" [attr.aria-label]="t().rotateRight" [disabled]="state() !== 'ready'" (click)="rotate()">
+              <cb-icon name="rotate-cw" [size]="18" aria-hidden="true" />
+            </button>
+          }
+        </div>
+
+        <span class="cb-pdf__spacer"></span>
+
+        @if (showSearch()) {
+          <div class="cb-pdf__group cb-pdf__search" role="search">
+            <cb-icon class="cb-pdf__search-icon" name="search" [size]="16" aria-hidden="true" />
+            <input
+              #searchInput
+              class="cb-pdf__field cb-pdf__search-input"
+              type="search"
+              autocomplete="off"
+              [attr.aria-label]="t().searchInDocument"
+              [attr.aria-describedby]="uid + '-status'"
+              [placeholder]="t().searchInDocument"
+              [disabled]="state() !== 'ready'"
+              (input)="onSearchInput(searchInput.value)"
+              (keydown)="onSearchKeydown($event, searchInput.value)"
+            />
+            <span class="cb-pdf__status" [id]="uid + '-status'" aria-live="polite">{{ searchStatus() }}</span>
+            <button type="button" class="cb-pdf__tool" [attr.aria-label]="t().previousMatch" [disabled]="!matches().length" (click)="findPrevious()">
+              <cb-icon name="chevron-left" [size]="18" aria-hidden="true" />
+            </button>
+            <button type="button" class="cb-pdf__tool" [attr.aria-label]="t().nextMatch" [disabled]="!matches().length" (click)="findNext()">
+              <cb-icon name="chevron-right" [size]="18" aria-hidden="true" />
+            </button>
+          </div>
+        }
+
+        @if (downloadable() || printable()) {
+          <div class="cb-pdf__group">
+            @if (downloadable()) {
+              <button type="button" class="cb-pdf__tool" [attr.aria-label]="t().download" [disabled]="state() !== 'ready'" (click)="download()">
+                <cb-icon name="download" [size]="18" aria-hidden="true" />
+              </button>
+            }
+            @if (printable()) {
+              <button
+                type="button"
+                class="cb-pdf__tool"
+                [attr.aria-label]="t().print"
+                [disabled]="state() !== 'ready' || !!printProgress()"
+                (click)="print()"
+              >
+                <cb-icon name="printer" [size]="18" aria-hidden="true" />
+              </button>
+            }
+          </div>
+        }
+      </div>
+    }
+
+    <div class="cb-pdf__body">
+      @if (state() === 'ready' && sidebar() && showThumbnails()) {
+        <nav class="cb-pdf__sidebar" [id]="uid + '-thumbs'" [attr.aria-label]="t().thumbnails">
+          @for (thumb of thumbBoxes(); track $index; let i = $index) {
+            <button
+              #thumbEl
+              type="button"
+              class="cb-pdf__thumb"
+              [class.cb-is-active]="page() === i + 1"
+              [attr.data-page]="i + 1"
+              [attr.aria-label]="format(t().pageOf, i + 1, numPages())"
+              [attr.aria-current]="page() === i + 1 ? 'page' : null"
+              (click)="goToPage(i + 1)"
+              (keydown)="onThumbKeydown($event, i + 1)"
+            >
+              <span class="cb-pdf__thumb-canvas" [style.width.px]="thumb.width" [style.height.px]="thumb.height"></span>
+              <span class="cb-pdf__thumb-label" aria-hidden="true">{{ i + 1 }}</span>
+            </button>
+          }
+        </nav>
+      }
+
+      <div
+        #viewport
+        class="cb-pdf__viewport"
+        tabindex="0"
+        role="document"
+        [attr.aria-label]="t().pdfDocument"
+        [attr.aria-busy]="state() === 'loading' ? 'true' : null"
+        (scroll)="onScroll()"
+        (wheel)="onWheel($event)"
+      >
+        @switch (state()) {
+          @case ('loading') {
+            <div class="cb-pdf__message" role="status">
+              <cb-spinner [size]="32" aria-hidden="true" />
+              <span>{{ t().loadingDocument }}@if (progress() !== null) { {{ progress() }} %}</span>
+            </div>
+          }
+          @case ('error') {
+            <div class="cb-pdf__message cb-pdf__message--error" role="alert">{{ t().documentError }}</div>
+          }
+          @case ('password') {
+            <form class="cb-pdf__password" (submit)="submitPassword($event, passwordInput.value)">
+              <cb-icon name="lock" [size]="28" aria-hidden="true" />
+              <p class="cb-pdf__password-text" [id]="uid + '-pwd-text'">{{ t().protectedDocument }}</p>
+              <label class="cb-pdf__password-label" [for]="uid + '-pwd'">{{ t().password }}</label>
+              <div class="cb-pdf__password-row">
+                <input
+                  #passwordInput
+                  class="cb-pdf__field"
+                  type="password"
+                  autocomplete="off"
+                  [id]="uid + '-pwd'"
+                  [attr.aria-describedby]="passwordIncorrect() ? uid + '-pwd-error' : uid + '-pwd-text'"
+                  [attr.aria-invalid]="passwordIncorrect() ? 'true' : null"
+                />
+                <button type="submit" class="cb-pdf__submit">{{ t().open }}</button>
+              </div>
+              @if (passwordIncorrect()) {
+                <p class="cb-pdf__password-error" [id]="uid + '-pwd-error'" role="alert">{{ t().incorrectPassword }}</p>
+              }
+            </form>
+          }
+          @case ('ready') {
+            <div class="cb-pdf__pages">
+              @for (box of pageBoxes(); track $index; let i = $index) {
+                <div
+                  #pageEl
+                  class="cb-pdf__page"
+                  role="group"
+                  [attr.data-page]="i + 1"
+                  [attr.aria-label]="format(t().pageOf, i + 1, numPages())"
+                  [style.width.px]="box.width"
+                  [style.height.px]="box.height"
+                  [style.--scale-factor]="box.scaleFactor"
+                  [style.--user-unit]="box.userUnit"
+                >
+                  <div class="cb-pdf__canvas"></div>
+                  <div class="cb-pdf__text"></div>
+                </div>
+              }
+            </div>
+          }
+        }
+      </div>
+    </div>
+
+    @if (printProgress(); as p) {
+      <div class="cb-pdf__toast" role="status">{{ format(t().preparingPrint, p.done, p.total) }}</div>
+    }
+  `, isInline: true, styles: [":host{position:relative;display:flex;flex-direction:column;box-sizing:border-box;width:100%;height:var(--cb-pdf-viewer-height, 40rem);min-height:16rem;overflow:hidden;border:var(--cb-border-width, 1px) solid var(--cb-color-border);border-radius:var(--cb-radius-lg);background:var(--cb-color-surface);color:var(--cb-color-text);font-family:var(--cb-font-sans);font-size:var(--cb-text-sm);container-type:inline-size}.cb-pdf__toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--cb-space-2);padding:var(--cb-space-2) var(--cb-space-3);border-bottom:var(--cb-border-width, 1px) solid var(--cb-color-border);background:var(--cb-color-surface)}.cb-pdf__group{display:inline-flex;align-items:center;gap:var(--cb-space-1)}.cb-pdf__spacer{flex:1}.cb-pdf__tool{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;border:none;border-radius:var(--cb-radius-md);background:transparent;color:var(--cb-color-text);cursor:pointer;transition:background-color var(--cb-duration-fast) var(--cb-ease)}.cb-pdf__tool:hover:not(:disabled){background:var(--cb-color-surface-hover)}.cb-pdf__tool[aria-expanded=true]{background:var(--cb-color-surface-hover);color:var(--cb-color-primary-600)}.cb-pdf__tool:disabled{opacity:var(--cb-opacity-disabled, .5);cursor:default}.cb-pdf__tool:focus-visible,.cb-pdf__field:focus-visible,.cb-pdf__thumb:focus-visible,.cb-pdf__submit:focus-visible,.cb-pdf__viewport:focus-visible{outline:2px solid var(--cb-color-focus-ring);outline-offset:2px}.cb-pdf__field{height:2.25rem;padding:0 var(--cb-space-2);border:var(--cb-border-width, 1px) solid var(--cb-color-border-strong);border-radius:var(--cb-radius-md);background:var(--cb-color-surface);color:var(--cb-color-text);font:inherit}.cb-pdf__field:disabled{opacity:var(--cb-opacity-disabled, .5)}.cb-pdf__page-input{width:3.25rem;text-align:center}.cb-pdf__total{min-width:2.5rem;color:var(--cb-color-text-muted);white-space:nowrap}.cb-pdf__zoom{width:9.5rem}.cb-pdf__search{position:relative}.cb-pdf__search-icon{position:absolute;left:.625rem;color:var(--cb-color-text-muted);pointer-events:none}.cb-pdf__search-input{width:14rem;padding-left:2rem}.cb-pdf__status{min-width:4.5rem;color:var(--cb-color-text-muted);font-size:var(--cb-text-xs);text-align:center;white-space:nowrap}@container (max-width: 40rem){.cb-pdf__zoom,.cb-pdf__status{display:none}.cb-pdf__search-input{width:9rem}}.cb-pdf__body{display:flex;flex:1;min-height:0}.cb-pdf__sidebar{display:flex;flex-direction:column;align-items:center;gap:var(--cb-space-3);flex:none;width:10rem;padding:var(--cb-space-3) 0;overflow-y:auto;border-right:var(--cb-border-width, 1px) solid var(--cb-color-border);background:var(--cb-color-surface)}.cb-pdf__thumb{display:flex;flex-direction:column;align-items:center;gap:var(--cb-space-1);padding:var(--cb-space-1);border:2px solid transparent;border-radius:var(--cb-radius-md);background:transparent;color:var(--cb-color-text-muted);font:inherit;font-size:var(--cb-text-xs);cursor:pointer}.cb-pdf__thumb:hover{background:var(--cb-color-surface-hover)}.cb-pdf__thumb.cb-is-active{border-color:var(--cb-color-primary-500);color:var(--cb-color-text-strong);font-weight:var(--cb-font-weight-semibold)}.cb-pdf__thumb-canvas{display:block;background:#fff;box-shadow:0 1px 3px #0f172a33}:host ::ng-deep .cb-pdf__thumb-canvas canvas{display:block;width:100%;height:100%}.cb-pdf__viewport{position:relative;flex:1;min-width:0;overflow:auto;background:var(--cb-color-surface-subtle)}.cb-pdf__pages{display:flex;flex-direction:column;align-items:center;gap:16px;padding:16px;width:max-content;min-width:100%;box-sizing:border-box}.cb-pdf__page{--user-unit: 1;--total-scale-factor: calc(var(--scale-factor) * var(--user-unit));--scale-round-x: 1px;--scale-round-y: 1px;position:relative;flex:none;background:#fff;box-shadow:0 1px 3px #0f172a2e,0 4px 12px #0f172a14;direction:ltr}.cb-pdf__canvas,:host ::ng-deep .cb-pdf__canvas canvas{position:absolute;inset:0;width:100%;height:100%}.cb-pdf__text{position:absolute;inset:0;overflow:clip;opacity:1;line-height:1;text-align:initial;letter-spacing:normal;word-spacing:normal;-webkit-text-size-adjust:none;text-size-adjust:none;forced-color-adjust:none;transform-origin:0 0;caret-color:CanvasText;z-index:0;--min-font-size: 1;--text-scale-factor: calc(var(--total-scale-factor) * var(--min-font-size));--min-font-size-inv: calc(1 / var(--min-font-size))}.cb-pdf__text[data-main-rotation=\"90\"]{transform:rotate(90deg) translateY(-100%)}.cb-pdf__text[data-main-rotation=\"180\"]{transform:rotate(180deg) translate(-100%,-100%)}.cb-pdf__text[data-main-rotation=\"270\"]{transform:rotate(270deg) translate(-100%)}:host ::ng-deep .cb-pdf__text :is(span,br){position:absolute;color:transparent;white-space:pre;cursor:text;transform-origin:0% 0%;-webkit-user-select:text;user-select:text}:host ::ng-deep .cb-pdf__text>:not(.markedContent),:host ::ng-deep .cb-pdf__text .markedContent span:not(.markedContent){--font-height: 0;--scale-x: 1;--rotate: 0deg;z-index:1;font-size:calc(var(--text-scale-factor) * var(--font-height));transform:rotate(var(--rotate)) scaleX(var(--scale-x)) scale(var(--min-font-size-inv))}:host ::ng-deep .cb-pdf__text .markedContent{display:contents}:host ::ng-deep .cb-pdf__text span[role=img]{-webkit-user-select:none;user-select:none;cursor:default}:host ::ng-deep .cb-pdf__text ::selection{background:color-mix(in srgb,var(--cb-color-primary-500) 35%,transparent);color:transparent}:host ::ng-deep .cb-pdf__text .cb-pdf__hl{position:relative;margin:-1px;padding:1px;border-radius:3px;background:#facc1573;font-size:inherit;transform:none}:host ::ng-deep .cb-pdf__text .cb-pdf__hl.cb-is-selected{background:#f973168c;outline:2px solid rgb(234 88 12)}@media(forced-colors:active){:host ::ng-deep .cb-pdf__text .cb-pdf__hl{background:transparent;outline:1px solid Highlight}:host ::ng-deep .cb-pdf__text .cb-pdf__hl.cb-is-selected{outline:3px solid Highlight}}.cb-pdf__message{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--cb-space-3);height:100%;padding:var(--cb-space-6);color:var(--cb-color-text-muted);text-align:center}.cb-pdf__message--error{color:var(--cb-color-danger)}.cb-pdf__password{display:flex;flex-direction:column;align-items:center;gap:var(--cb-space-2);max-width:24rem;margin:var(--cb-space-6) auto;padding:var(--cb-space-6);border:var(--cb-border-width, 1px) solid var(--cb-color-border);border-radius:var(--cb-radius-lg);background:var(--cb-color-surface);text-align:center}.cb-pdf__password-text{margin:0}.cb-pdf__password-label{align-self:flex-start;font-weight:var(--cb-font-weight-medium)}.cb-pdf__password-row{display:flex;gap:var(--cb-space-2);width:100%}.cb-pdf__password-row .cb-pdf__field{flex:1;min-width:0}.cb-pdf__password-error{margin:0;color:var(--cb-color-danger)}.cb-pdf__submit{height:2.25rem;padding:0 var(--cb-space-4);border:none;border-radius:var(--cb-radius-md);background:var(--cb-color-primary-500);color:var(--cb-color-primary-contrast);font:inherit;font-weight:var(--cb-font-weight-semibold);cursor:pointer}.cb-pdf__submit:hover{background:var(--cb-color-primary-600)}.cb-pdf__toast{position:absolute;left:50%;bottom:var(--cb-space-4);transform:translate(-50%);padding:var(--cb-space-2) var(--cb-space-4);border-radius:var(--cb-radius-full);background:var(--cb-color-surface-950);color:#fff;box-shadow:var(--cb-shadow-md)}\n"], dependencies: [{ kind: "component", type: CbIcon, selector: "cb-icon", inputs: ["name", "size", "spin", "ariaLabel"] }, { kind: "component", type: CbSpinner, selector: "cb-spinner", inputs: ["size", "strokeWidth", "severity", "ariaLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: CbPdfViewer, decorators: [{
+            type: Component,
+            args: [{ selector: 'cb-pdf-viewer', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.Emulated, imports: [CbIcon, CbSpinner], host: {
+                        class: 'cb-pdf-viewer',
+                        role: 'region',
+                        '[attr.aria-label]': 'ariaLabel() || t().pdfViewer',
+                        '(keydown)': 'onHostKeydown($event)',
+                    }, template: `
+    @if (showToolbar()) {
+      <div class="cb-pdf__toolbar">
+        @if (showThumbnails()) {
+          <div class="cb-pdf__group">
+            <button
+              type="button"
+              class="cb-pdf__tool"
+              [attr.aria-label]="t().thumbnails"
+              [attr.aria-expanded]="sidebar()"
+              [attr.aria-controls]="uid + '-thumbs'"
+              [disabled]="state() !== 'ready'"
+              (click)="sidebar.set(!sidebar())"
+            >
+              <cb-icon name="panel-left" [size]="18" aria-hidden="true" />
+            </button>
+          </div>
+        }
+
+        <div class="cb-pdf__group" role="group" [attr.aria-label]="t().pagination">
+          <button
+            type="button"
+            class="cb-pdf__tool"
+            [attr.aria-label]="t().previousPage"
+            [disabled]="state() !== 'ready' || page() <= 1"
+            (click)="previousPage()"
+          >
+            <cb-icon name="chevron-up" [size]="18" aria-hidden="true" />
+          </button>
+          <button
+            type="button"
+            class="cb-pdf__tool"
+            [attr.aria-label]="t().nextPage"
+            [disabled]="state() !== 'ready' || page() >= numPages()"
+            (click)="nextPage()"
+          >
+            <cb-icon name="chevron-down" [size]="18" aria-hidden="true" />
+          </button>
+          <input
+            class="cb-pdf__field cb-pdf__page-input"
+            type="text"
+            inputmode="numeric"
+            autocomplete="off"
+            [id]="uid + '-page'"
+            [attr.aria-label]="t().pageNumber"
+            [attr.aria-describedby]="uid + '-total'"
+            [value]="page()"
+            [disabled]="state() !== 'ready'"
+            (change)="onPageInput($event)"
+            (keydown.enter)="onPageInput($event)"
+          />
+          <span class="cb-pdf__total" [id]="uid + '-total'">{{ format(t().ofTotal, numPages() || '–') }}</span>
+        </div>
+
+        <div class="cb-pdf__group" role="group" [attr.aria-label]="t().zoomLevel">
+          <button type="button" class="cb-pdf__tool" [attr.aria-label]="t().zoomOut" [disabled]="state() !== 'ready' || scale() <= 0.25" (click)="zoomOut()">
+            <cb-icon name="zoom-out" [size]="18" aria-hidden="true" />
+          </button>
+          <select
+            class="cb-pdf__field cb-pdf__zoom"
+            [attr.aria-label]="t().zoomLevel"
+            [disabled]="state() !== 'ready'"
+            (change)="onZoomSelect($any($event.target).value)"
+          >
+            <option value="page-width" [selected]="zoomValue() === 'page-width'">{{ t().fitWidth }}</option>
+            <option value="page-fit" [selected]="zoomValue() === 'page-fit'">{{ t().fitPage }}</option>
+            @if (customZoom(); as custom) {
+              <option [value]="custom" selected>{{ percent(custom) }}</option>
+            }
+            @for (level of zoomLevels; track level) {
+              <option [value]="level" [selected]="zoomValue() === '' + level">{{ percent(level) }}</option>
+            }
+          </select>
+          <button type="button" class="cb-pdf__tool" [attr.aria-label]="t().zoomIn" [disabled]="state() !== 'ready' || scale() >= 5" (click)="zoomIn()">
+            <cb-icon name="zoom-in" [size]="18" aria-hidden="true" />
+          </button>
+          @if (showRotate()) {
+            <button type="button" class="cb-pdf__tool" [attr.aria-label]="t().rotateRight" [disabled]="state() !== 'ready'" (click)="rotate()">
+              <cb-icon name="rotate-cw" [size]="18" aria-hidden="true" />
+            </button>
+          }
+        </div>
+
+        <span class="cb-pdf__spacer"></span>
+
+        @if (showSearch()) {
+          <div class="cb-pdf__group cb-pdf__search" role="search">
+            <cb-icon class="cb-pdf__search-icon" name="search" [size]="16" aria-hidden="true" />
+            <input
+              #searchInput
+              class="cb-pdf__field cb-pdf__search-input"
+              type="search"
+              autocomplete="off"
+              [attr.aria-label]="t().searchInDocument"
+              [attr.aria-describedby]="uid + '-status'"
+              [placeholder]="t().searchInDocument"
+              [disabled]="state() !== 'ready'"
+              (input)="onSearchInput(searchInput.value)"
+              (keydown)="onSearchKeydown($event, searchInput.value)"
+            />
+            <span class="cb-pdf__status" [id]="uid + '-status'" aria-live="polite">{{ searchStatus() }}</span>
+            <button type="button" class="cb-pdf__tool" [attr.aria-label]="t().previousMatch" [disabled]="!matches().length" (click)="findPrevious()">
+              <cb-icon name="chevron-left" [size]="18" aria-hidden="true" />
+            </button>
+            <button type="button" class="cb-pdf__tool" [attr.aria-label]="t().nextMatch" [disabled]="!matches().length" (click)="findNext()">
+              <cb-icon name="chevron-right" [size]="18" aria-hidden="true" />
+            </button>
+          </div>
+        }
+
+        @if (downloadable() || printable()) {
+          <div class="cb-pdf__group">
+            @if (downloadable()) {
+              <button type="button" class="cb-pdf__tool" [attr.aria-label]="t().download" [disabled]="state() !== 'ready'" (click)="download()">
+                <cb-icon name="download" [size]="18" aria-hidden="true" />
+              </button>
+            }
+            @if (printable()) {
+              <button
+                type="button"
+                class="cb-pdf__tool"
+                [attr.aria-label]="t().print"
+                [disabled]="state() !== 'ready' || !!printProgress()"
+                (click)="print()"
+              >
+                <cb-icon name="printer" [size]="18" aria-hidden="true" />
+              </button>
+            }
+          </div>
+        }
+      </div>
+    }
+
+    <div class="cb-pdf__body">
+      @if (state() === 'ready' && sidebar() && showThumbnails()) {
+        <nav class="cb-pdf__sidebar" [id]="uid + '-thumbs'" [attr.aria-label]="t().thumbnails">
+          @for (thumb of thumbBoxes(); track $index; let i = $index) {
+            <button
+              #thumbEl
+              type="button"
+              class="cb-pdf__thumb"
+              [class.cb-is-active]="page() === i + 1"
+              [attr.data-page]="i + 1"
+              [attr.aria-label]="format(t().pageOf, i + 1, numPages())"
+              [attr.aria-current]="page() === i + 1 ? 'page' : null"
+              (click)="goToPage(i + 1)"
+              (keydown)="onThumbKeydown($event, i + 1)"
+            >
+              <span class="cb-pdf__thumb-canvas" [style.width.px]="thumb.width" [style.height.px]="thumb.height"></span>
+              <span class="cb-pdf__thumb-label" aria-hidden="true">{{ i + 1 }}</span>
+            </button>
+          }
+        </nav>
+      }
+
+      <div
+        #viewport
+        class="cb-pdf__viewport"
+        tabindex="0"
+        role="document"
+        [attr.aria-label]="t().pdfDocument"
+        [attr.aria-busy]="state() === 'loading' ? 'true' : null"
+        (scroll)="onScroll()"
+        (wheel)="onWheel($event)"
+      >
+        @switch (state()) {
+          @case ('loading') {
+            <div class="cb-pdf__message" role="status">
+              <cb-spinner [size]="32" aria-hidden="true" />
+              <span>{{ t().loadingDocument }}@if (progress() !== null) { {{ progress() }} %}</span>
+            </div>
+          }
+          @case ('error') {
+            <div class="cb-pdf__message cb-pdf__message--error" role="alert">{{ t().documentError }}</div>
+          }
+          @case ('password') {
+            <form class="cb-pdf__password" (submit)="submitPassword($event, passwordInput.value)">
+              <cb-icon name="lock" [size]="28" aria-hidden="true" />
+              <p class="cb-pdf__password-text" [id]="uid + '-pwd-text'">{{ t().protectedDocument }}</p>
+              <label class="cb-pdf__password-label" [for]="uid + '-pwd'">{{ t().password }}</label>
+              <div class="cb-pdf__password-row">
+                <input
+                  #passwordInput
+                  class="cb-pdf__field"
+                  type="password"
+                  autocomplete="off"
+                  [id]="uid + '-pwd'"
+                  [attr.aria-describedby]="passwordIncorrect() ? uid + '-pwd-error' : uid + '-pwd-text'"
+                  [attr.aria-invalid]="passwordIncorrect() ? 'true' : null"
+                />
+                <button type="submit" class="cb-pdf__submit">{{ t().open }}</button>
+              </div>
+              @if (passwordIncorrect()) {
+                <p class="cb-pdf__password-error" [id]="uid + '-pwd-error'" role="alert">{{ t().incorrectPassword }}</p>
+              }
+            </form>
+          }
+          @case ('ready') {
+            <div class="cb-pdf__pages">
+              @for (box of pageBoxes(); track $index; let i = $index) {
+                <div
+                  #pageEl
+                  class="cb-pdf__page"
+                  role="group"
+                  [attr.data-page]="i + 1"
+                  [attr.aria-label]="format(t().pageOf, i + 1, numPages())"
+                  [style.width.px]="box.width"
+                  [style.height.px]="box.height"
+                  [style.--scale-factor]="box.scaleFactor"
+                  [style.--user-unit]="box.userUnit"
+                >
+                  <div class="cb-pdf__canvas"></div>
+                  <div class="cb-pdf__text"></div>
+                </div>
+              }
+            </div>
+          }
+        }
+      </div>
+    </div>
+
+    @if (printProgress(); as p) {
+      <div class="cb-pdf__toast" role="status">{{ format(t().preparingPrint, p.done, p.total) }}</div>
+    }
+  `, styles: [":host{position:relative;display:flex;flex-direction:column;box-sizing:border-box;width:100%;height:var(--cb-pdf-viewer-height, 40rem);min-height:16rem;overflow:hidden;border:var(--cb-border-width, 1px) solid var(--cb-color-border);border-radius:var(--cb-radius-lg);background:var(--cb-color-surface);color:var(--cb-color-text);font-family:var(--cb-font-sans);font-size:var(--cb-text-sm);container-type:inline-size}.cb-pdf__toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--cb-space-2);padding:var(--cb-space-2) var(--cb-space-3);border-bottom:var(--cb-border-width, 1px) solid var(--cb-color-border);background:var(--cb-color-surface)}.cb-pdf__group{display:inline-flex;align-items:center;gap:var(--cb-space-1)}.cb-pdf__spacer{flex:1}.cb-pdf__tool{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;border:none;border-radius:var(--cb-radius-md);background:transparent;color:var(--cb-color-text);cursor:pointer;transition:background-color var(--cb-duration-fast) var(--cb-ease)}.cb-pdf__tool:hover:not(:disabled){background:var(--cb-color-surface-hover)}.cb-pdf__tool[aria-expanded=true]{background:var(--cb-color-surface-hover);color:var(--cb-color-primary-600)}.cb-pdf__tool:disabled{opacity:var(--cb-opacity-disabled, .5);cursor:default}.cb-pdf__tool:focus-visible,.cb-pdf__field:focus-visible,.cb-pdf__thumb:focus-visible,.cb-pdf__submit:focus-visible,.cb-pdf__viewport:focus-visible{outline:2px solid var(--cb-color-focus-ring);outline-offset:2px}.cb-pdf__field{height:2.25rem;padding:0 var(--cb-space-2);border:var(--cb-border-width, 1px) solid var(--cb-color-border-strong);border-radius:var(--cb-radius-md);background:var(--cb-color-surface);color:var(--cb-color-text);font:inherit}.cb-pdf__field:disabled{opacity:var(--cb-opacity-disabled, .5)}.cb-pdf__page-input{width:3.25rem;text-align:center}.cb-pdf__total{min-width:2.5rem;color:var(--cb-color-text-muted);white-space:nowrap}.cb-pdf__zoom{width:9.5rem}.cb-pdf__search{position:relative}.cb-pdf__search-icon{position:absolute;left:.625rem;color:var(--cb-color-text-muted);pointer-events:none}.cb-pdf__search-input{width:14rem;padding-left:2rem}.cb-pdf__status{min-width:4.5rem;color:var(--cb-color-text-muted);font-size:var(--cb-text-xs);text-align:center;white-space:nowrap}@container (max-width: 40rem){.cb-pdf__zoom,.cb-pdf__status{display:none}.cb-pdf__search-input{width:9rem}}.cb-pdf__body{display:flex;flex:1;min-height:0}.cb-pdf__sidebar{display:flex;flex-direction:column;align-items:center;gap:var(--cb-space-3);flex:none;width:10rem;padding:var(--cb-space-3) 0;overflow-y:auto;border-right:var(--cb-border-width, 1px) solid var(--cb-color-border);background:var(--cb-color-surface)}.cb-pdf__thumb{display:flex;flex-direction:column;align-items:center;gap:var(--cb-space-1);padding:var(--cb-space-1);border:2px solid transparent;border-radius:var(--cb-radius-md);background:transparent;color:var(--cb-color-text-muted);font:inherit;font-size:var(--cb-text-xs);cursor:pointer}.cb-pdf__thumb:hover{background:var(--cb-color-surface-hover)}.cb-pdf__thumb.cb-is-active{border-color:var(--cb-color-primary-500);color:var(--cb-color-text-strong);font-weight:var(--cb-font-weight-semibold)}.cb-pdf__thumb-canvas{display:block;background:#fff;box-shadow:0 1px 3px #0f172a33}:host ::ng-deep .cb-pdf__thumb-canvas canvas{display:block;width:100%;height:100%}.cb-pdf__viewport{position:relative;flex:1;min-width:0;overflow:auto;background:var(--cb-color-surface-subtle)}.cb-pdf__pages{display:flex;flex-direction:column;align-items:center;gap:16px;padding:16px;width:max-content;min-width:100%;box-sizing:border-box}.cb-pdf__page{--user-unit: 1;--total-scale-factor: calc(var(--scale-factor) * var(--user-unit));--scale-round-x: 1px;--scale-round-y: 1px;position:relative;flex:none;background:#fff;box-shadow:0 1px 3px #0f172a2e,0 4px 12px #0f172a14;direction:ltr}.cb-pdf__canvas,:host ::ng-deep .cb-pdf__canvas canvas{position:absolute;inset:0;width:100%;height:100%}.cb-pdf__text{position:absolute;inset:0;overflow:clip;opacity:1;line-height:1;text-align:initial;letter-spacing:normal;word-spacing:normal;-webkit-text-size-adjust:none;text-size-adjust:none;forced-color-adjust:none;transform-origin:0 0;caret-color:CanvasText;z-index:0;--min-font-size: 1;--text-scale-factor: calc(var(--total-scale-factor) * var(--min-font-size));--min-font-size-inv: calc(1 / var(--min-font-size))}.cb-pdf__text[data-main-rotation=\"90\"]{transform:rotate(90deg) translateY(-100%)}.cb-pdf__text[data-main-rotation=\"180\"]{transform:rotate(180deg) translate(-100%,-100%)}.cb-pdf__text[data-main-rotation=\"270\"]{transform:rotate(270deg) translate(-100%)}:host ::ng-deep .cb-pdf__text :is(span,br){position:absolute;color:transparent;white-space:pre;cursor:text;transform-origin:0% 0%;-webkit-user-select:text;user-select:text}:host ::ng-deep .cb-pdf__text>:not(.markedContent),:host ::ng-deep .cb-pdf__text .markedContent span:not(.markedContent){--font-height: 0;--scale-x: 1;--rotate: 0deg;z-index:1;font-size:calc(var(--text-scale-factor) * var(--font-height));transform:rotate(var(--rotate)) scaleX(var(--scale-x)) scale(var(--min-font-size-inv))}:host ::ng-deep .cb-pdf__text .markedContent{display:contents}:host ::ng-deep .cb-pdf__text span[role=img]{-webkit-user-select:none;user-select:none;cursor:default}:host ::ng-deep .cb-pdf__text ::selection{background:color-mix(in srgb,var(--cb-color-primary-500) 35%,transparent);color:transparent}:host ::ng-deep .cb-pdf__text .cb-pdf__hl{position:relative;margin:-1px;padding:1px;border-radius:3px;background:#facc1573;font-size:inherit;transform:none}:host ::ng-deep .cb-pdf__text .cb-pdf__hl.cb-is-selected{background:#f973168c;outline:2px solid rgb(234 88 12)}@media(forced-colors:active){:host ::ng-deep .cb-pdf__text .cb-pdf__hl{background:transparent;outline:1px solid Highlight}:host ::ng-deep .cb-pdf__text .cb-pdf__hl.cb-is-selected{outline:3px solid Highlight}}.cb-pdf__message{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--cb-space-3);height:100%;padding:var(--cb-space-6);color:var(--cb-color-text-muted);text-align:center}.cb-pdf__message--error{color:var(--cb-color-danger)}.cb-pdf__password{display:flex;flex-direction:column;align-items:center;gap:var(--cb-space-2);max-width:24rem;margin:var(--cb-space-6) auto;padding:var(--cb-space-6);border:var(--cb-border-width, 1px) solid var(--cb-color-border);border-radius:var(--cb-radius-lg);background:var(--cb-color-surface);text-align:center}.cb-pdf__password-text{margin:0}.cb-pdf__password-label{align-self:flex-start;font-weight:var(--cb-font-weight-medium)}.cb-pdf__password-row{display:flex;gap:var(--cb-space-2);width:100%}.cb-pdf__password-row .cb-pdf__field{flex:1;min-width:0}.cb-pdf__password-error{margin:0;color:var(--cb-color-danger)}.cb-pdf__submit{height:2.25rem;padding:0 var(--cb-space-4);border:none;border-radius:var(--cb-radius-md);background:var(--cb-color-primary-500);color:var(--cb-color-primary-contrast);font:inherit;font-weight:var(--cb-font-weight-semibold);cursor:pointer}.cb-pdf__submit:hover{background:var(--cb-color-primary-600)}.cb-pdf__toast{position:absolute;left:50%;bottom:var(--cb-space-4);transform:translate(-50%);padding:var(--cb-space-2) var(--cb-space-4);border-radius:var(--cb-radius-full);background:var(--cb-color-surface-950);color:#fff;box-shadow:var(--cb-shadow-md)}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { src: [{ type: i0.Input, args: [{ isSignal: true, alias: "src", required: false }] }], fileName: [{ type: i0.Input, args: [{ isSignal: true, alias: "fileName", required: false }] }], password: [{ type: i0.Input, args: [{ isSignal: true, alias: "password", required: false }] }], withCredentials: [{ type: i0.Input, args: [{ isSignal: true, alias: "withCredentials", required: false }] }], httpHeaders: [{ type: i0.Input, args: [{ isSignal: true, alias: "httpHeaders", required: false }] }], page: [{ type: i0.Input, args: [{ isSignal: true, alias: "page", required: false }] }, { type: i0.Output, args: ["pageChange"] }], zoom: [{ type: i0.Input, args: [{ isSignal: true, alias: "zoom", required: false }] }, { type: i0.Output, args: ["zoomChange"] }], rotation: [{ type: i0.Input, args: [{ isSignal: true, alias: "rotation", required: false }] }, { type: i0.Output, args: ["rotationChange"] }], sidebar: [{ type: i0.Input, args: [{ isSignal: true, alias: "sidebar", required: false }] }, { type: i0.Output, args: ["sidebarChange"] }], showToolbar: [{ type: i0.Input, args: [{ isSignal: true, alias: "showToolbar", required: false }] }], showSearch: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSearch", required: false }] }], showThumbnails: [{ type: i0.Input, args: [{ isSignal: true, alias: "showThumbnails", required: false }] }], showRotate: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRotate", required: false }] }], downloadable: [{ type: i0.Input, args: [{ isSignal: true, alias: "downloadable", required: false }] }], printable: [{ type: i0.Input, args: [{ isSignal: true, alias: "printable", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], loaded: [{ type: i0.Output, args: ["loaded"] }], loadError: [{ type: i0.Output, args: ["loadError"] }], viewport: [{ type: i0.ViewChild, args: ['viewport', { isSignal: true }] }], pageEls: [{ type: i0.ViewChildren, args: ['pageEl', { isSignal: true }] }], thumbEls: [{ type: i0.ViewChildren, args: ['thumbEl', { isSignal: true }] }], searchInput: [{ type: i0.ViewChild, args: ['searchInput', { isSignal: true }] }], passwordInput: [{ type: i0.ViewChild, args: ['passwordInput', { isSignal: true }] }] } });
+function sizeOf(page) {
+    const viewport = page.getViewport({ scale: 1, rotation: 0 });
+    const userUnit = page.userUnit || 1;
+    return { width: viewport.width, height: viewport.height, rotate: page.rotate || 0, userUnit };
+}
+/** Bytes del documento si no es una URL (copiados: pdf.js transfiere el buffer al worker). */
+async function toData(src) {
+    if (src instanceof Uint8Array)
+        return src.slice();
+    if (src instanceof ArrayBuffer)
+        return new Uint8Array(src.slice(0));
+    if (typeof Blob !== 'undefined' && src instanceof Blob)
+        return new Uint8Array(await readBlob(src));
+    return null;
+}
+function readBlob(blob) {
+    if (typeof blob.arrayBuffer === 'function')
+        return blob.arrayBuffer();
+    return new Promise((resolve, reject) => {
+        const reader = new FileReader();
+        reader.onload = () => resolve(reader.result);
+        reader.onerror = () => reject(reader.error);
+        reader.readAsArrayBuffer(blob);
+    });
+}
+/** Densidad del canvas: la de la pantalla, limitada para no pasar de {@link MAX_CANVAS_PIXELS}. */
+function outputScale(width, height) {
+    const ratio = globalThis.devicePixelRatio || 1;
+    const max = Math.sqrt(MAX_CANVAS_PIXELS / Math.max(1, width * height));
+    return Math.max(0.5, Math.min(ratio, max));
+}
+function clamp(value, min, max) {
+    return Math.min(max, Math.max(min, value));
+}
+function round2(value) {
+    return Math.round(value * 100) / 100;
+}
+
+/*
+ * Public API Surface de @caribeng/ui/pdfviewer
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { CB_PDF_VIEWER_OPTIONS, CbPdfEngine, CbPdfViewer, provideCbPdfViewer };