@krizaka/ui 3.15.0 → 3.16.0

package/README.md

@@ -192,6 +192,7 @@ light or a product's — is a set of tokens.
 | `@krizaka/ui/video-trimmer` | `VideoTrimmer` (`duration`, `value` [start, end], `minLength`, `step`/`largeStep`, `frames` or children, `time` + `onSeek`, `classNames` per part, `renderHandle`) | client |
 | `@krizaka/ui/audio-player` | `AudioPlayer` (a seekable waveform: `peaks` or `computePeaks`, `bars`, `playbackRates`, `duration`), `resamplePeaks`, `computeAudioPeaks` | client |
 | `@krizaka/ui/image-cropper` | `ImageCropper` (`aspect`, `round`, an image or a `<video>`, a focus point + zoom out, keyboard and zoom slider), `cropRect` | client |
+| `@krizaka/ui/document-viewer` | `DocumentViewer` (a PDF drawn by pdf.js — `loadPdfjs={() => import("pdfjs-dist")}`, an optional peer — with `highlights` lit where their quotes sit, `activeId` / `onActiveChange`, `onLocate`; page + quote when the text layer cannot place one), `locateQuote` | client |
 | `@krizaka/ui/page` | the page frame: `Page` (`size` narrow·default·wide·full, `as`), `Section` (`id`, `eyebrow`, `title`, `lead`, `actions`, `divider`, `spacing` sm·md·lg, `backdrop`, `size`, `reveal`), `SectionHeading`, `Facts` (`items`: `label`, `tone` ok·wip·neutral, `href`), `Ticks` (backticks read as code) — see [Page blocks](#page-blocks) | server |
 | `@krizaka/ui/page-hero` | `PageHero` (`title` → the h1, `eyebrow`, `lead`, `back`, `aside`, `backdrop` grid·plain·none, `align`, `size`, `linkAs`; facts or actions as children) | server |
 | `@krizaka/ui/card-grid` | `CardGrid` (`min`, `fit` fill·fit, `align`, `reveal` staggered by `columns`, `light`, `as` div·ul·ol) | client |

package/dist/document-viewer.d.ts

@@ -0,0 +1,200 @@
+import * as tailwind_variants from 'tailwind-variants';
+import * as React from 'react';
+
+/** A text item as pdf.js returns it (`TextItem`): the string, its matrix (`[a, b, c, d, x, baseline]`) and its size. */
+type TextItem = {
+    str: string;
+    transform: number[];
+    width: number;
+    height: number;
+};
+/** A rectangle in fractions of the page (0–1), origin top-left — independent of the zoom the page is drawn at. */
+type Box = {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+};
+/** The text layer of one page: its size in PDF units (rotation 0) and its items in reading order. */
+type PageText = {
+    page: number;
+    width: number;
+    height: number;
+    items: readonly TextItem[];
+};
+type Located = {
+    /** 1-based page where the passage starts. */
+    page: number;
+    /** One box per line of the passage (merged along a line); empty when only the page is known. */
+    boxes: Box[];
+    /** `exact`: the whole quote was found; `start`: only its opening words were (a quote cut by a different layout). */
+    match: "exact" | "start" | "page";
+};
+/** The comparable form of a text: no whitespace, no soft hyphen, straight quotes, case and accents folded. */
+declare function fold(text: string): string;
+/**
+ * Where `quote` sits in the pages: the first page (starting with `hintPage`, if any) whose text contains it, and the
+ * boxes of its lines. A quote that a different layout cut (a column break, a hyphen) is looked for by its opening
+ * words (`match: "start"`); one that is nowhere gives `null`, or the hinted page alone (`match: "page"`). Never a guess:
+ * a rotated page has no boxes, only its page.
+ */
+declare function locateQuote(pages: readonly PageText[], quote: string, hintPage?: number): Located | null;
+
+declare const documentViewer: tailwind_variants.TVReturnType<{
+    [key: string]: {
+        [key: string]: tailwind_variants.ClassValue | {
+            page?: tailwind_variants.ClassValue;
+            root?: tailwind_variants.ClassValue;
+            pages?: tailwind_variants.ClassValue;
+            canvas?: tailwind_variants.ClassValue;
+            caption?: tailwind_variants.ClassValue;
+            box?: tailwind_variants.ClassValue;
+            bar?: tailwind_variants.ClassValue;
+            status?: tailwind_variants.ClassValue;
+        };
+    };
+} | {
+    [x: string]: {
+        [x: string]: tailwind_variants.ClassValue | {
+            page?: tailwind_variants.ClassValue;
+            root?: tailwind_variants.ClassValue;
+            pages?: tailwind_variants.ClassValue;
+            canvas?: tailwind_variants.ClassValue;
+            caption?: tailwind_variants.ClassValue;
+            box?: tailwind_variants.ClassValue;
+            bar?: tailwind_variants.ClassValue;
+            status?: tailwind_variants.ClassValue;
+        };
+    };
+} | {}, {
+    root: string;
+    pages: string;
+    page: string;
+    canvas: string;
+    caption: string;
+    box: string;
+    bar: string;
+    status: string;
+}, undefined, {
+    [key: string]: {
+        [key: string]: tailwind_variants.ClassValue | {
+            page?: tailwind_variants.ClassValue;
+            root?: tailwind_variants.ClassValue;
+            pages?: tailwind_variants.ClassValue;
+            canvas?: tailwind_variants.ClassValue;
+            caption?: tailwind_variants.ClassValue;
+            box?: tailwind_variants.ClassValue;
+            bar?: tailwind_variants.ClassValue;
+            status?: tailwind_variants.ClassValue;
+        };
+    };
+} | {}, {
+    root: string;
+    pages: string;
+    page: string;
+    canvas: string;
+    caption: string;
+    box: string;
+    bar: string;
+    status: string;
+}, tailwind_variants.TVReturnTypeLike<unknown, {
+    root: string;
+    pages: string;
+    page: string;
+    canvas: string;
+    caption: string;
+    box: string;
+    bar: string;
+    status: string;
+}>>;
+/** The words of the viewer, passed translated. `{page}` and `{total}` are replaced. */
+type DocumentViewerLabels = {
+    /** The accessible name of the pages' region. */
+    region: string;
+    loading: string;
+    failed: string;
+    /** A page's caption and accessible name: "Page {page} of {total}". */
+    page: string;
+    /** The bar above the pages when the active passage could only be placed on a page: "Passage on page {page}:". */
+    onPage: string;
+    /** The bar when the active passage is not in the text layer. */
+    notFound: string;
+};
+declare const documentViewerLabels: DocumentViewerLabels;
+/** A passage to light: its quote (as the text layer reads it), the page if the app knows it, a name for screen readers. */
+type DocumentHighlight = {
+    id: string;
+    quote: string;
+    page?: number;
+    label?: string;
+};
+
+/** The members of pdf.js the viewer uses (`pdfjs-dist` ≥ 5), typed here so the package does not depend on it. */
+type PdfjsModule = {
+    GlobalWorkerOptions: {
+        workerSrc: string;
+    };
+    getDocument(source: {
+        url?: string;
+        data?: Uint8Array;
+    }): {
+        promise: Promise<PdfDocument>;
+        destroy?: () => Promise<void> | void;
+    };
+};
+type PdfDocument = {
+    numPages: number;
+    getPage(n: number): Promise<PdfPage>;
+    destroy?: () => Promise<void> | void;
+};
+type PdfPage = {
+    rotate: number;
+    view: number[];
+    getViewport(options: {
+        scale: number;
+    }): {
+        width: number;
+        height: number;
+    };
+    getTextContent(): Promise<{
+        items: readonly unknown[];
+    }>;
+    render(options: {
+        canvas: HTMLCanvasElement;
+        canvasContext: CanvasRenderingContext2D;
+        viewport: {
+            width: number;
+            height: number;
+        };
+    }): {
+        promise: Promise<void>;
+        cancel?: () => void;
+    };
+    cleanup?: () => void;
+};
+type DocumentViewerProps = Omit<React.ComponentProps<"div">, "children" | "onChange"> & {
+    /** The PDF: an address (same origin or CORS) or its bytes. */
+    src: string | Uint8Array;
+    /** Loads pdf.js: `() => import("pdfjs-dist")`. An optional peer, never in a bundle without a document. */
+    loadPdfjs: () => Promise<PdfjsModule>;
+    /** The address of pdf.js's worker (`new URL("pdfjs-dist/build/pdf.worker.min.mjs", import.meta.url).toString()`). */
+    workerSrc: string;
+    /** The passages to light. */
+    highlights?: readonly DocumentHighlight[];
+    /** The passage in focus: the viewer scrolls to it. */
+    activeId?: string | null;
+    /** A box was clicked (the id) or the focus was released (`null`). */
+    onActiveChange?: (id: string | null) => void;
+    /** Where each passage was found (`null`: nowhere) — once the text layer is read, and again if `highlights` change. */
+    onLocate?: (found: Record<string, Located | null>) => void;
+    /** Called when the document is open, with its page count. */
+    onLoad?: (info: {
+        pages: number;
+    }) => void;
+    /** The words of the viewer, translated (English by default). */
+    labels?: Partial<DocumentViewerLabels>;
+};
+/** A PDF with its passages lit — see the file's header. Client. */
+declare function DocumentViewer({ src, loadPdfjs, workerSrc, highlights, activeId, onActiveChange, onLocate, onLoad, labels, className, ...props }: DocumentViewerProps): React.JSX.Element;
+
+export { type Box, type DocumentHighlight, DocumentViewer, type DocumentViewerLabels, type DocumentViewerProps, type Located, type PageText, type PdfDocument, type PdfPage, type PdfjsModule, type TextItem, documentViewer, documentViewerLabels, fold, locateQuote };

package/dist/document-viewer.js

@@ -0,0 +1,248 @@
+"use client";
+import {
+  useLatest,
+  usePrefersReducedMotion
+} from "./chunk-FZBWEDQI.js";
+
+// src/document-viewer/document-viewer.tsx
+import * as React from "react";
+import { tv } from "tailwind-variants";
+
+// src/document-viewer/locate.ts
+var FOLD = { "\u2019": "'", "\u2018": "'", "\u201C": '"', "\u201D": '"', "\xAB": '"', "\xBB": '"', "\u2013": "-", "\u2014": "-", "\xA0": " ", "\u202F": " ", "\uFB01": "fi", "\uFB02": "fl" };
+function fold(text) {
+  let out = "";
+  for (const ch of text.normalize("NFKD")) {
+    if (/\p{M}/u.test(ch) || /\s/u.test(ch) || ch === "\xAD" || ch === "\u200B") continue;
+    out += (FOLD[ch] ?? ch).toLowerCase();
+  }
+  return out;
+}
+function indexPage(items) {
+  let text = "";
+  const at = [];
+  items.forEach((item, i) => {
+    for (let c = 0; c < item.str.length; c++) {
+      const piece = fold(item.str[c]);
+      for (let k = 0; k < piece.length; k++) {
+        text += piece[k];
+        at.push({ item: i, char: c });
+      }
+    }
+  });
+  return { text, at };
+}
+function boxesOf(page, index, from, to) {
+  const spans = /* @__PURE__ */ new Map();
+  for (let k = from; k < to; k++) {
+    const { item, char } = index.at[k];
+    const s = spans.get(item);
+    spans.set(item, s ? [Math.min(s[0], char), Math.max(s[1], char + 1)] : [char, char + 1]);
+  }
+  const raw = [];
+  for (const [i, [c0, c1]] of [...spans].sort((a, b) => a[0] - b[0])) {
+    const item = page.items[i];
+    const len = Math.max(1, item.str.length);
+    const size = item.height || Math.abs(item.transform[3] ?? 0) || 10;
+    const x = (item.transform[4] ?? 0) + item.width * c0 / len;
+    const w = item.width * (c1 - c0) / len;
+    const top = page.height - ((item.transform[5] ?? 0) + size * 0.9);
+    raw.push({ x: x / page.width, y: top / page.height, width: w / page.width, height: size * 1.15 / page.height });
+  }
+  const merged = [];
+  for (const b of raw) {
+    const last = merged[merged.length - 1];
+    const sameLine = last && Math.abs(last.y - b.y) < last.height * 0.5 && b.x - (last.x + last.width) < last.height * 1.5 && b.x >= last.x - 1e-9;
+    if (last && sameLine) {
+      const right = Math.max(last.x + last.width, b.x + b.width);
+      last.y = Math.min(last.y, b.y);
+      last.height = Math.max(last.height, b.height);
+      last.width = right - last.x;
+    } else merged.push({ ...b });
+  }
+  return merged.map((b) => ({ x: clamp01(b.x), y: clamp01(b.y), width: Math.min(b.width, 1 - clamp01(b.x)), height: Math.min(b.height, 1 - clamp01(b.y)) }));
+}
+var clamp01 = (n) => Math.min(1, Math.max(0, n));
+var MIN_START = 24;
+function locateQuote(pages, quote, hintPage) {
+  const needle = fold(quote);
+  const ordered = hintPage ? [...pages].sort((a, b) => Number(b.page === hintPage) - Number(a.page === hintPage)) : pages;
+  if (needle.length > 0) {
+    for (const mode of ["exact", "start"]) {
+      const wanted = mode === "exact" ? needle : needle.slice(0, Math.max(MIN_START, Math.min(40, Math.floor(needle.length * 0.6))));
+      if (mode === "start" && (needle.length <= wanted.length || wanted.length < MIN_START)) break;
+      for (const page of ordered) {
+        const index = indexPage(page.items);
+        const found = index.text.indexOf(wanted);
+        if (found < 0) continue;
+        return { page: page.page, boxes: boxesOf(page, index, found, found + wanted.length), match: mode };
+      }
+    }
+  }
+  return hintPage && pages.some((p) => p.page === hintPage) ? { page: hintPage, boxes: [], match: "page" } : null;
+}
+
+// src/document-viewer/document-viewer.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var documentViewer = tv({
+  slots: {
+    root: "relative flex min-w-0 flex-col gap-3",
+    pages: "flex max-h-(--kz-document-viewer-height,70vh) flex-col gap-3 overflow-auto rounded-lg border border-border-default bg-surface-2 p-3 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent",
+    page: "relative mx-auto w-full max-w-(--kz-document-viewer-page,56rem) shrink-0 overflow-hidden rounded-sm bg-white shadow-sm",
+    canvas: "block h-auto w-full",
+    caption: "absolute top-1 left-1 rounded-sm bg-surface-1/90 px-1.5 py-0.5 text-xs text-fg-secondary",
+    box: "absolute cursor-pointer rounded-xs border border-warning/70 bg-warning/25 mix-blend-multiply transition-colors data-[active=true]:border-2 data-[active=true]:border-danger data-[active=true]:bg-danger/25 motion-reduce:transition-none",
+    bar: "rounded-lg border border-border-default bg-surface-1 px-3 py-2 text-sm text-fg-secondary",
+    status: "p-6 text-center text-sm text-fg-secondary"
+  }
+});
+var documentViewerLabels = {
+  region: "Document pages",
+  loading: "Loading the document\u2026",
+  failed: "The document could not be displayed.",
+  page: "Page {page} of {total}",
+  onPage: "Passage on page {page}:",
+  notFound: "This passage is not in the document's text layer:"
+};
+var fill = (template, vars) => template.replace(/\{(\w+)\}/g, (m, k) => k in vars ? String(vars[k]) : m);
+var isItem = (x) => typeof x === "object" && x !== null && typeof x.str === "string" && Array.isArray(x.transform);
+function PageCanvas({ page, doc, caption, onReady, className }) {
+  const ref = React.useRef(null);
+  const wrapper = React.useRef(null);
+  const [visible, setVisible] = React.useState(() => typeof IntersectionObserver === "undefined");
+  const ready = useLatest(onReady);
+  React.useEffect(() => {
+    const node = wrapper.current?.parentElement;
+    if (!node) return;
+    if (typeof IntersectionObserver === "undefined") return;
+    const observer = new IntersectionObserver((entries) => entries.some((e) => e.isIntersecting) && setVisible(true), { rootMargin: "600px 0px" });
+    observer.observe(node);
+    return () => observer.disconnect();
+  }, []);
+  React.useEffect(() => {
+    if (!visible) return;
+    let task;
+    let cancelled = false;
+    void (async () => {
+      const p = await doc.getPage(page);
+      const canvas = ref.current;
+      const ctx = canvas?.getContext("2d");
+      if (cancelled || !canvas || !ctx) return;
+      const base = p.getViewport({ scale: 1 });
+      const dpr = typeof window === "undefined" ? 1 : Math.min(2, window.devicePixelRatio || 1);
+      const scale = Math.min(2.5, Math.max(1, (canvas.parentElement?.clientWidth || base.width) / base.width)) * dpr;
+      const viewport = p.getViewport({ scale });
+      canvas.width = Math.floor(viewport.width);
+      canvas.height = Math.floor(viewport.height);
+      task = p.render({ canvas, canvasContext: ctx, viewport });
+      await task.promise.catch(() => void 0);
+      if (!cancelled) ready.current?.();
+    })().catch(() => void 0);
+    return () => {
+      cancelled = true;
+      task?.cancel?.();
+    };
+  }, [visible, doc, page, ready]);
+  return /* @__PURE__ */ jsxs("div", { ref: wrapper, className: "contents", children: [
+    /* @__PURE__ */ jsx("canvas", { ref, "aria-hidden": "true", className }),
+    /* @__PURE__ */ jsx("span", { className: "sr-only", children: caption })
+  ] });
+}
+function DocumentViewer({ src, loadPdfjs, workerSrc, highlights = [], activeId = null, onActiveChange, onLocate, onLoad, labels, className, ...props }) {
+  const words = { ...documentViewerLabels, ...labels };
+  const s = documentViewer();
+  const reduce = usePrefersReducedMotion();
+  const [loaded, setPhase] = React.useState({ state: "loading" });
+  const callbacks = useLatest({ onLoad, onLocate });
+  const containerRef = React.useRef(null);
+  const bytes = typeof src === "string" ? src : src.byteLength + ":" + src[0] + ":" + src[src.length - 1];
+  const phase = loaded.state !== "loading" && loaded.key !== bytes ? { state: "loading" } : loaded;
+  React.useEffect(() => {
+    let cancelled = false;
+    let opened;
+    void (async () => {
+      const pdfjs = await loadPdfjs();
+      pdfjs.GlobalWorkerOptions.workerSrc = workerSrc;
+      const loading = pdfjs.getDocument(typeof src === "string" ? { url: src } : { data: src.slice() });
+      opened = loading;
+      const doc = await loading.promise;
+      const texts = [];
+      const sizes = [];
+      for (let n = 1; n <= doc.numPages; n++) {
+        const page = await doc.getPage(n);
+        const vp = page.getViewport({ scale: 1 });
+        sizes.push({ width: vp.width, height: vp.height });
+        const content = await page.getTextContent();
+        texts.push({ page: n, width: vp.width, height: vp.height, items: page.rotate % 360 === 0 ? content.items.filter(isItem) : [] });
+        page.cleanup?.();
+      }
+      if (cancelled) return;
+      setPhase({ state: "ready", key: bytes, doc, texts, sizes });
+      callbacks.current.onLoad?.({ pages: doc.numPages });
+    })().catch(() => !cancelled && setPhase({ state: "error", key: bytes }));
+    return () => {
+      cancelled = true;
+      void opened?.destroy?.();
+    };
+  }, [bytes, loadPdfjs, workerSrc, callbacks]);
+  const key = highlights.map((h) => `${h.id}\0${h.page ?? ""}\0${h.quote}`).join("
");
+  const found = React.useMemo(() => {
+    const out = {};
+    if (phase.state === "ready") for (const h of highlights) out[h.id] = locateQuote(phase.texts, h.quote, h.page);
+    return out;
+  }, [phase, key]);
+  React.useEffect(() => {
+    if (phase.state === "ready") callbacks.current.onLocate?.(found);
+  }, [found, phase.state, callbacks]);
+  const active = activeId ? highlights.find((h) => h.id === activeId) : void 0;
+  const where = activeId ? found[activeId] : void 0;
+  React.useEffect(() => {
+    if (phase.state !== "ready" || !where) return;
+    const root = containerRef.current;
+    const target = root?.querySelector(where.boxes.length > 0 ? `[data-highlight="${CSS.escape(activeId)}"]` : `[data-page="${where.page}"]`) ?? null;
+    target?.scrollIntoView?.({ block: where.boxes.length > 0 ? "center" : "start", behavior: reduce ? "auto" : "smooth" });
+  }, [activeId, where, phase.state]);
+  return /* @__PURE__ */ jsxs("div", { className: s.root({ className }), ...props, children: [
+    active && where !== void 0 && where?.match !== "exact" && where?.match !== "start" ? /* @__PURE__ */ jsxs("p", { className: s.bar(), "data-testid": "document-viewer-bar", children: [
+      where?.match === "page" ? fill(words.onPage, { page: where.page }) : words.notFound,
+      " ",
+      /* @__PURE__ */ jsx("q", { children: active.quote })
+    ] }) : null,
+    /* @__PURE__ */ jsxs("div", { ref: containerRef, className: s.pages(), role: "region", "aria-label": words.region, tabIndex: 0, children: [
+      phase.state === "loading" ? /* @__PURE__ */ jsx("p", { className: s.status(), children: words.loading }) : null,
+      phase.state === "error" ? /* @__PURE__ */ jsx("p", { role: "alert", className: s.status(), children: words.failed }) : null,
+      phase.state === "ready" ? phase.texts.map((t, i) => {
+        const size = phase.sizes[i];
+        const caption = fill(words.page, { page: t.page, total: phase.doc.numPages });
+        return /* @__PURE__ */ jsxs("div", { className: s.page(), "data-page": t.page, style: { aspectRatio: `${size.width} / ${size.height}` }, children: [
+          /* @__PURE__ */ jsx(PageCanvas, { page: t.page, doc: phase.doc, caption, className: s.canvas() }),
+          /* @__PURE__ */ jsx("span", { className: s.caption(), "aria-hidden": "true", children: caption }),
+          highlights.flatMap((h) => {
+            const f = found[h.id];
+            if (!f || f.page !== t.page) return [];
+            return f.boxes.map((b, k) => /* @__PURE__ */ jsx(
+              "div",
+              {
+                "aria-hidden": "true",
+                "data-highlight": h.id,
+                "data-active": h.id === activeId,
+                className: s.box(),
+                style: { left: `${b.x * 100}%`, top: `${b.y * 100}%`, width: `${b.width * 100}%`, height: `${b.height * 100}%` },
+                onClick: () => onActiveChange?.(h.id === activeId ? null : h.id)
+              },
+              `${h.id}:${k}`
+            ));
+          })
+        ] }, t.page);
+      }) : null
+    ] })
+  ] });
+}
+export {
+  DocumentViewer,
+  documentViewer,
+  documentViewerLabels,
+  fold,
+  locateQuote
+};
+//# sourceMappingURL=document-viewer.js.map

package/dist/document-viewer.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/document-viewer/document-viewer.tsx","../src/document-viewer/locate.ts"],"sourcesContent":["// Client. A PDF drawn page by page (pdf.js), and passages of it lit where they sit. The app hands over the engine\n// (`loadPdfjs={() => import(\"pdfjs-dist\")}` — an optional peer, loaded only on a page that shows a document) and the\n// worker's address; it hands over the passages as quotes (`highlights`), and the viewer finds their place from the\n// PDF's own text positions (`locateQuote`): one box per line, in fractions of the page, so they follow any zoom.\n// `activeId` (controlled) scrolls to a passage and strengthens it; a click on a box calls `onActiveChange`. A passage\n// the text layer cannot place is never drawn at a guessed place: the viewer goes to its page when it is known and shows\n// the quote in a bar — and tells the app (`onLocate`) so its list can say \"page 3\" or \"not found\".\nimport * as React from \"react\";\nimport { tv } from \"tailwind-variants\";\n\nimport { useLatest, usePrefersReducedMotion } from \"../media\";\nimport { type Located, locateQuote, type PageText } from \"./locate\";\n\nexport const documentViewer = tv({\n  slots: {\n    root: \"relative flex min-w-0 flex-col gap-3\",\n    pages: \"flex max-h-(--kz-document-viewer-height,70vh) flex-col gap-3 overflow-auto rounded-lg border border-border-default bg-surface-2 p-3 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent\",\n    page: \"relative mx-auto w-full max-w-(--kz-document-viewer-page,56rem) shrink-0 overflow-hidden rounded-sm bg-white shadow-sm\",\n    canvas: \"block h-auto w-full\",\n    caption: \"absolute top-1 left-1 rounded-sm bg-surface-1/90 px-1.5 py-0.5 text-xs text-fg-secondary\",\n    box: \"absolute cursor-pointer rounded-xs border border-warning/70 bg-warning/25 mix-blend-multiply transition-colors data-[active=true]:border-2 data-[active=true]:border-danger data-[active=true]:bg-danger/25 motion-reduce:transition-none\",\n    bar: \"rounded-lg border border-border-default bg-surface-1 px-3 py-2 text-sm text-fg-secondary\",\n    status: \"p-6 text-center text-sm text-fg-secondary\",\n  },\n});\n\n/** The words of the viewer, passed translated. `{page}` and `{total}` are replaced. */\nexport type DocumentViewerLabels = {\n  /** The accessible name of the pages' region. */\n  region: string;\n  loading: string;\n  failed: string;\n  /** A page's caption and accessible name: \"Page {page} of {total}\". */\n  page: string;\n  /** The bar above the pages when the active passage could only be placed on a page: \"Passage on page {page}:\". */\n  onPage: string;\n  /** The bar when the active passage is not in the text layer. */\n  notFound: string;\n};\n\nexport const documentViewerLabels: DocumentViewerLabels = {\n  region: \"Document pages\",\n  loading: \"Loading the document…\",\n  failed: \"The document could not be displayed.\",\n  page: \"Page {page} of {total}\",\n  onPage: \"Passage on page {page}:\",\n  notFound: \"This passage is not in the document's text layer:\",\n};\n\n/** A passage to light: its quote (as the text layer reads it), the page if the app knows it, a name for screen readers. */\nexport type DocumentHighlight = { id: string; quote: string; page?: number; label?: string };\n\n/** What the viewer found for a passage. */\nexport type { Located };\n\n/** The members of pdf.js the viewer uses (`pdfjs-dist` ≥ 5), typed here so the package does not depend on it. */\nexport type PdfjsModule = {\n  GlobalWorkerOptions: { workerSrc: string };\n  getDocument(source: { url?: string; data?: Uint8Array }): { promise: Promise<PdfDocument>; destroy?: () => Promise<void> | void };\n};\nexport type PdfDocument = { numPages: number; getPage(n: number): Promise<PdfPage>; destroy?: () => Promise<void> | void };\nexport type PdfPage = {\n  rotate: number;\n  view: number[];\n  getViewport(options: { scale: number }): { width: number; height: number };\n  getTextContent(): Promise<{ items: readonly unknown[] }>;\n  render(options: { canvas: HTMLCanvasElement; canvasContext: CanvasRenderingContext2D; viewport: { width: number; height: number } }): { promise: Promise<void>; cancel?: () => void };\n  cleanup?: () => void;\n};\n\nexport type DocumentViewerProps = Omit<React.ComponentProps<\"div\">, \"children\" | \"onChange\"> & {\n  /** The PDF: an address (same origin or CORS) or its bytes. */\n  src: string | Uint8Array;\n  /** Loads pdf.js: `() => import(\"pdfjs-dist\")`. An optional peer, never in a bundle without a document. */\n  loadPdfjs: () => Promise<PdfjsModule>;\n  /** The address of pdf.js's worker (`new URL(\"pdfjs-dist/build/pdf.worker.min.mjs\", import.meta.url).toString()`). */\n  workerSrc: string;\n  /** The passages to light. */\n  highlights?: readonly DocumentHighlight[];\n  /** The passage in focus: the viewer scrolls to it. */\n  activeId?: string | null;\n  /** A box was clicked (the id) or the focus was released (`null`). */\n  onActiveChange?: (id: string | null) => void;\n  /** Where each passage was found (`null`: nowhere) — once the text layer is read, and again if `highlights` change. */\n  onLocate?: (found: Record<string, Located | null>) => void;\n  /** Called when the document is open, with its page count. */\n  onLoad?: (info: { pages: number }) => void;\n  /** The words of the viewer, translated (English by default). */\n  labels?: Partial<DocumentViewerLabels>;\n};\n\nconst fill = (template: string, vars: Record<string, string | number>) => template.replace(/\\{(\\w+)\\}/g, (m, k: string) => (k in vars ? String(vars[k]) : m));\n\ntype Loaded = { doc: PdfDocument; texts: PageText[]; sizes: { width: number; height: number }[] };\ntype Phase = { state: \"loading\" } | { state: \"error\"; key: string } | ({ state: \"ready\"; key: string } & Loaded);\n\nconst isItem = (x: unknown): x is PageText[\"items\"][number] => typeof x === \"object\" && x !== null && typeof (x as { str?: unknown }).str === \"string\" && Array.isArray((x as { transform?: unknown }).transform);\n\nfunction PageCanvas({ page, doc, caption, onReady, className }: { page: number; doc: PdfDocument; caption: string; onReady?: () => void; className: string }) {\n  const ref = React.useRef<HTMLCanvasElement>(null);\n  const wrapper = React.useRef<HTMLDivElement>(null);\n  const [visible, setVisible] = React.useState(() => typeof IntersectionObserver === \"undefined\");\n  const ready = useLatest(onReady);\n  React.useEffect(() => {\n    const node = wrapper.current?.parentElement;\n    if (!node) return;\n    if (typeof IntersectionObserver === \"undefined\") return;\n    const observer = new IntersectionObserver((entries) => entries.some((e) => e.isIntersecting) && setVisible(true), { rootMargin: \"600px 0px\" });\n    observer.observe(node);\n    return () => observer.disconnect();\n  }, []);\n  React.useEffect(() => {\n    if (!visible) return;\n    let task: { promise: Promise<void>; cancel?: () => void } | undefined;\n    let cancelled = false;\n    void (async () => {\n      const p = await doc.getPage(page);\n      const canvas = ref.current;\n      const ctx = canvas?.getContext(\"2d\");\n      if (cancelled || !canvas || !ctx) return;\n      const base = p.getViewport({ scale: 1 });\n      const dpr = typeof window === \"undefined\" ? 1 : Math.min(2, window.devicePixelRatio || 1);\n      const scale = Math.min(2.5, Math.max(1, (canvas.parentElement?.clientWidth || base.width) / base.width)) * dpr;\n      const viewport = p.getViewport({ scale });\n      canvas.width = Math.floor(viewport.width);\n      canvas.height = Math.floor(viewport.height);\n      task = p.render({ canvas, canvasContext: ctx, viewport });\n      await task.promise.catch(() => undefined);\n      if (!cancelled) ready.current?.();\n    })().catch(() => undefined);\n    return () => {\n      cancelled = true;\n      task?.cancel?.();\n    };\n  }, [visible, doc, page, ready]);\n  return (\n    <div ref={wrapper} className=\"contents\">\n      <canvas ref={ref} aria-hidden=\"true\" className={className} />\n      <span className=\"sr-only\">{caption}</span>\n    </div>\n  );\n}\n\n/** A PDF with its passages lit — see the file's header. Client. */\nexport function DocumentViewer({ src, loadPdfjs, workerSrc, highlights = [], activeId = null, onActiveChange, onLocate, onLoad, labels, className, ...props }: DocumentViewerProps) {\n  const words = { ...documentViewerLabels, ...labels };\n  const s = documentViewer();\n  const reduce = usePrefersReducedMotion();\n  const [loaded, setPhase] = React.useState<Phase>({ state: \"loading\" });\n  const callbacks = useLatest({ onLoad, onLocate });\n  const containerRef = React.useRef<HTMLDivElement>(null);\n  const bytes = typeof src === \"string\" ? src : src.byteLength + \":\" + src[0] + \":\" + src[src.length - 1];\n  // A result belongs to the document it was read from: another `src` is loading again, with no reset inside the effect.\n  const phase: Phase = loaded.state !== \"loading\" && loaded.key !== bytes ? { state: \"loading\" } : loaded;\n\n  // Open the document and read every page's text layer (positions only; nothing is sent anywhere).\n  React.useEffect(() => {\n    let cancelled = false;\n    let opened: { destroy?: () => Promise<void> | void } | undefined;\n    void (async () => {\n      const pdfjs = await loadPdfjs();\n      pdfjs.GlobalWorkerOptions.workerSrc = workerSrc;\n      const loading = pdfjs.getDocument(typeof src === \"string\" ? { url: src } : { data: src.slice() });\n      opened = loading;\n      const doc = await loading.promise;\n      const texts: PageText[] = [];\n      const sizes: Loaded[\"sizes\"] = [];\n      for (let n = 1; n <= doc.numPages; n++) {\n        const page = await doc.getPage(n);\n        const vp = page.getViewport({ scale: 1 });\n        sizes.push({ width: vp.width, height: vp.height });\n        const content = await page.getTextContent();\n        // A rotated page has no reliable boxes: it keeps its size and an empty text layer (the app's page hint still works).\n        texts.push({ page: n, width: vp.width, height: vp.height, items: page.rotate % 360 === 0 ? content.items.filter(isItem) : [] });\n        page.cleanup?.();\n      }\n      if (cancelled) return;\n      setPhase({ state: \"ready\", key: bytes, doc, texts, sizes });\n      callbacks.current.onLoad?.({ pages: doc.numPages });\n    })().catch(() => !cancelled && setPhase({ state: \"error\", key: bytes }));\n    return () => {\n      cancelled = true;\n      void opened?.destroy?.();\n    };\n    // `src` is compared by content (`bytes`) so a re-render with the same bytes does not reopen the file.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [bytes, loadPdfjs, workerSrc, callbacks]);\n\n  const key = highlights.map((h) => `${h.id}\\u0000${h.page ?? \"\"}\\u0000${h.quote}`).join(\"\\u0001\");\n  const found = React.useMemo(() => {\n    const out: Record<string, Located | null> = {};\n    if (phase.state === \"ready\") for (const h of highlights) out[h.id] = locateQuote(phase.texts, h.quote, h.page);\n    return out;\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [phase, key]);\n  React.useEffect(() => {\n    if (phase.state === \"ready\") callbacks.current.onLocate?.(found);\n  }, [found, phase.state, callbacks]);\n\n  // Go to the active passage.\n  const active = activeId ? highlights.find((h) => h.id === activeId) : undefined;\n  const where = activeId ? found[activeId] : undefined;\n  React.useEffect(() => {\n    if (phase.state !== \"ready\" || !where) return;\n    const root = containerRef.current;\n    const target = root?.querySelector<HTMLElement>(where.boxes.length > 0 ? `[data-highlight=\"${CSS.escape(activeId!)}\"]` : `[data-page=\"${where.page}\"]`) ?? null;\n    target?.scrollIntoView?.({ block: where.boxes.length > 0 ? \"center\" : \"start\", behavior: reduce ? \"auto\" : \"smooth\" });\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [activeId, where, phase.state]);\n\n  return (\n    <div className={s.root({ className })} {...props}>\n      {active && where !== undefined && where?.match !== \"exact\" && where?.match !== \"start\" ? (\n        <p className={s.bar()} data-testid=\"document-viewer-bar\">\n          {where?.match === \"page\" ? fill(words.onPage, { page: where.page }) : words.notFound} <q>{active.quote}</q>\n        </p>\n      ) : null}\n      <div ref={containerRef} className={s.pages()} role=\"region\" aria-label={words.region} tabIndex={0}>\n        {phase.state === \"loading\" ? <p className={s.status()}>{words.loading}</p> : null}\n        {phase.state === \"error\" ? <p role=\"alert\" className={s.status()}>{words.failed}</p> : null}\n        {phase.state === \"ready\"\n          ? phase.texts.map((t, i) => {\n              const size = phase.sizes[i]!;\n              const caption = fill(words.page, { page: t.page, total: phase.doc.numPages });\n              return (\n                <div key={t.page} className={s.page()} data-page={t.page} style={{ aspectRatio: `${size.width} / ${size.height}` }}>\n                  <PageCanvas page={t.page} doc={phase.doc} caption={caption} className={s.canvas()} />\n                  <span className={s.caption()} aria-hidden=\"true\">{caption}</span>\n                  {highlights.flatMap((h) => {\n                    const f = found[h.id];\n                    if (!f || f.page !== t.page) return [];\n                    return f.boxes.map((b, k) => (\n                      <div\n                        key={`${h.id}:${k}`}\n                        aria-hidden=\"true\"\n                        data-highlight={h.id}\n                        data-active={h.id === activeId}\n                        className={s.box()}\n                        style={{ left: `${b.x * 100}%`, top: `${b.y * 100}%`, width: `${b.width * 100}%`, height: `${b.height * 100}%` }}\n                        onClick={() => onActiveChange?.(h.id === activeId ? null : h.id)}\n                      />\n                    ));\n                  })}\n                </div>\n              );\n            })\n          : null}\n      </div>\n    </div>\n  );\n}\n","// Pure: where a quoted passage sits on the pages of a PDF, from pdf.js's text positions. No DOM, no pdf.js import —\n// the viewer feeds it what `page.getTextContent()` returned, a test feeds it a fixture.\n\n/** A text item as pdf.js returns it (`TextItem`): the string, its matrix (`[a, b, c, d, x, baseline]`) and its size. */\nexport type TextItem = { str: string; transform: number[]; width: number; height: number };\n\n/** A rectangle in fractions of the page (0–1), origin top-left — independent of the zoom the page is drawn at. */\nexport type Box = { x: number; y: number; width: number; height: number };\n\n/** The text layer of one page: its size in PDF units (rotation 0) and its items in reading order. */\nexport type PageText = { page: number; width: number; height: number; items: readonly TextItem[] };\n\nexport type Located = {\n  /** 1-based page where the passage starts. */\n  page: number;\n  /** One box per line of the passage (merged along a line); empty when only the page is known. */\n  boxes: Box[];\n  /** `exact`: the whole quote was found; `start`: only its opening words were (a quote cut by a different layout). */\n  match: \"exact\" | \"start\" | \"page\";\n};\n\nconst FOLD: Record<string, string> = { \"’\": \"'\", \"‘\": \"'\", \"“\": '\"', \"”\": '\"', \"«\": '\"', \"»\": '\"', \"–\": \"-\", \"—\": \"-\", \" \": \" \", \" \": \" \", \"fi\": \"fi\", \"fl\": \"fl\" };\n\n/** The comparable form of a text: no whitespace, no soft hyphen, straight quotes, case and accents folded. */\nexport function fold(text: string): string {\n  let out = \"\";\n  for (const ch of text.normalize(\"NFKD\")) {\n    if (/\\p{M}/u.test(ch) || /\\s/u.test(ch) || ch === \"­\" || ch === \"​\") continue;\n    out += (FOLD[ch] ?? ch).toLowerCase();\n  }\n  return out;\n}\n\ntype Index = { text: string; at: { item: number; char: number }[] };\n\nfunction indexPage(items: readonly TextItem[]): Index {\n  let text = \"\";\n  const at: Index[\"at\"] = [];\n  items.forEach((item, i) => {\n    for (let c = 0; c < item.str.length; c++) {\n      const piece = fold(item.str[c]!);\n      for (let k = 0; k < piece.length; k++) {\n        text += piece[k];\n        at.push({ item: i, char: c });\n      }\n    }\n  });\n  return { text, at };\n}\n\nfunction boxesOf(page: PageText, index: Index, from: number, to: number): Box[] {\n  const spans = new Map<number, [number, number]>();\n  for (let k = from; k < to; k++) {\n    const { item, char } = index.at[k]!;\n    const s = spans.get(item);\n    spans.set(item, s ? [Math.min(s[0], char), Math.max(s[1], char + 1)] : [char, char + 1]);\n  }\n  const raw: Box[] = [];\n  for (const [i, [c0, c1]] of [...spans].sort((a, b) => a[0] - b[0])) {\n    const item = page.items[i]!;\n    const len = Math.max(1, item.str.length);\n    const size = item.height || Math.abs(item.transform[3] ?? 0) || 10;\n    const x = (item.transform[4] ?? 0) + (item.width * c0) / len;\n    const w = (item.width * (c1 - c0)) / len;\n    const top = page.height - ((item.transform[5] ?? 0) + size * 0.9);\n    raw.push({ x: x / page.width, y: top / page.height, width: w / page.width, height: (size * 1.15) / page.height });\n  }\n  // Merge the pieces that sit on one line and touch (several items of one sentence) into one rectangle.\n  const merged: Box[] = [];\n  for (const b of raw) {\n    const last = merged[merged.length - 1];\n    const sameLine = last && Math.abs(last.y - b.y) < last.height * 0.5 && b.x - (last.x + last.width) < last.height * 1.5 && b.x >= last.x - 1e-9;\n    if (last && sameLine) {\n      const right = Math.max(last.x + last.width, b.x + b.width);\n      last.y = Math.min(last.y, b.y);\n      last.height = Math.max(last.height, b.height);\n      last.width = right - last.x;\n    } else merged.push({ ...b });\n  }\n  return merged.map((b) => ({ x: clamp01(b.x), y: clamp01(b.y), width: Math.min(b.width, 1 - clamp01(b.x)), height: Math.min(b.height, 1 - clamp01(b.y)) }));\n}\n\nconst clamp01 = (n: number) => Math.min(1, Math.max(0, n));\n\n/** The shortest opening worth highlighting alone: a few words, not a stray letter. */\nconst MIN_START = 24;\n\n/**\n * Where `quote` sits in the pages: the first page (starting with `hintPage`, if any) whose text contains it, and the\n * boxes of its lines. A quote that a different layout cut (a column break, a hyphen) is looked for by its opening\n * words (`match: \"start\"`); one that is nowhere gives `null`, or the hinted page alone (`match: \"page\"`). Never a guess:\n * a rotated page has no boxes, only its page.\n */\nexport function locateQuote(pages: readonly PageText[], quote: string, hintPage?: number): Located | null {\n  const needle = fold(quote);\n  const ordered = hintPage ? [...pages].sort((a, b) => Number(b.page === hintPage) - Number(a.page === hintPage)) : pages;\n  if (needle.length > 0) {\n    for (const mode of [\"exact\", \"start\"] as const) {\n      const wanted = mode === \"exact\" ? needle : needle.slice(0, Math.max(MIN_START, Math.min(40, Math.floor(needle.length * 0.6))));\n      if (mode === \"start\" && (needle.length <= wanted.length || wanted.length < MIN_START)) break;\n      for (const page of ordered) {\n        const index = indexPage(page.items);\n        const found = index.text.indexOf(wanted);\n        if (found < 0) continue;\n        return { page: page.page, boxes: boxesOf(page, index, found, found + wanted.length), match: mode };\n      }\n    }\n  }\n  return hintPage && pages.some((p) => p.page === hintPage) ? { page: hintPage, boxes: [], match: \"page\" } : null;\n}\n"],"mappings":"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","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@krizaka/ui",
-  "version": "3.15.0",
+  "version": "3.16.0",
   "description": "The Krizaka front-end platform's components: the primitives (button, card, dialog, toast, menu, field, tabs, chip, switch, slider, command palette, theme, countdown…) on the semantic --kz-* tokens, the animated marks (Krizaka, Orazaka, Orochia, Yasakia, Yororis) and the motion signature — web and /native.",
   "keywords": [
     "krizaka",
@@ -333,6 +333,10 @@
       "types": "./dist/image-cropper.d.ts",
       "import": "./dist/image-cropper.js"
     },
+    "./document-viewer": {
+      "types": "./dist/document-viewer.d.ts",
+      "import": "./dist/document-viewer.js"
+    },
     "./list": {
       "types": "./dist/list.d.ts",
       "import": "./dist/list.js"
@@ -621,7 +625,7 @@
   ],
   "peerDependencies": {
     "@krizaka/query": ">=0.2.1",
-    "@krizaka/tailwind": ">=3.15.0",
+    "@krizaka/tailwind": ">=3.16.0",
     "@maplibre/maplibre-react-native": ">=11",
     "@shopify/flash-list": ">=2",
     "expo-camera": ">=16",
@@ -629,6 +633,7 @@
     "expo-video": ">=2",
     "hls.js": ">=1.5",
     "maplibre-gl": ">=6",
+    "pdfjs-dist": ">=5",
     "react": ">=18",
     "react-dom": ">=18",
     "react-native": ">=0.76",
@@ -664,6 +669,7 @@
     "jest": "30.4.2",
     "jest-environment-node": "30.4.1",
     "maplibre-gl": "6.11.2",
+    "pdfjs-dist": "6.4.299",
     "publint": "^0.3.25",
     "react": "^19.2.0",
     "react-docgen-typescript": "^2.4.0",
@@ -679,8 +685,8 @@
     "typescript": "^5.9.0",
     "vitest": "^4.1.11",
     "zod": "^4.6.5",
-    "@krizaka/config": "0.4.1",
-    "@krizaka/query": "0.2.1"
+    "@krizaka/query": "0.2.1",
+    "@krizaka/config": "0.4.1"
   },
   "engines": {
     "node": ">=22"
@@ -716,6 +722,9 @@
     "maplibre-gl": {
       "optional": true
     },
+    "pdfjs-dist": {
+      "optional": true
+    },
     "react-dom": {
       "optional": true
     },
@@ -1402,6 +1411,16 @@
         "clsx"
       ]
     },
+    {
+      "name": "./document-viewer",
+      "path": "dist/document-viewer.js",
+      "limit": "5 kB",
+      "gzip": true,
+      "ignore": [
+        "tailwind-variants",
+        "clsx"
+      ]
+    },
     {
       "name": "./list",
       "path": "dist/list.js",
@@ -2105,8 +2124,8 @@
     "sonner": "^2.0.8",
     "tailwind-variants": "^3.3.1",
     "@krizaka/intl": "^0.2.1",
-    "@krizaka/tokens": "^3.15.0",
-    "@krizaka/pacer": "^0.1.0"
+    "@krizaka/pacer": "^0.1.0",
+    "@krizaka/tokens": "^3.16.0"
   },
   "scripts": {
     "build": "node -e \"const fs=require('node:fs');fs.rmSync('dist',{recursive:true,force:true});for(const f of fs.readdirSync('registry/examples',{recursive:true}))if(/\\.(js|d\\.ts)$/.test(f))fs.rmSync('registry/examples/'+f)\" && tsup && node -e \"require('node:fs').copyFileSync('src/motion.css','dist/motion.css');require('node:fs').copyFileSync('src/blocks.css','dist/blocks.css');require('node:fs').copyFileSync('src/story.css','dist/story.css')\" && node scripts/build-registry.mjs",