@khorsheed/dsh-reader 0.3.0 → 0.3.1

package/lib/types/captions.d.ts

@@ -0,0 +1,99 @@
+/**
+ * Captions → the transcript a video or audio entry reads as.
+ *
+ * Every platform's caption file is parsed into the same flat cue list (start,
+ * end, text), merged into paragraphs a person can read (sentence ends, pauses,
+ * a length cap), and rendered as article markup where each paragraph carries
+ * its start time. The markup is the entry's body: notes, highlights,
+ * translation and the model's ¶ numbering all work on it unchanged, and the
+ * player reads `data-t` to seek.
+ *
+ * Pure: no fs, no network — the formats are measured on real files and pinned
+ * by the specs.
+ *
+ * @module @khorsheed/dsh-reader/captions
+ */
+/** One caption line. Times are seconds. */
+export interface Cue {
+    readonly start: number;
+    readonly end: number;
+    readonly text: string;
+}
+/** One transcript paragraph. */
+export interface TranscriptSegment {
+    readonly start: number;
+    readonly end: number;
+    readonly text: string;
+    /** The start of every cue merged in, so a note can anchor to its line. */
+    readonly lines: readonly {
+        readonly start: number;
+        readonly text: string;
+    }[];
+}
+/**
+ * YouTube's `json3` captions: `events[]` with `tStartMs`, `dDurationMs` and
+ * `segs[].utf8`. Auto captions also carry `aAppend` newline events and
+ * word-level `tOffsetMs`; only whole events become cues.
+ */
+export declare function parseJson3(raw: string): Cue[];
+/**
+ * WebVTT. YouTube's auto captions in VTT are ROLLING: each cue repeats the
+ * previous line and adds the next, with inline word timings. The rolling
+ * duplicates are dropped by keeping only the text a cue adds over the one
+ * before it.
+ */
+export declare function parseVtt(raw: string): Cue[];
+/** SubRip (`.srt`). */
+export declare function parseSrt(raw: string): Cue[];
+/** Bilibili's subtitle JSON: `body[]` with `from`, `to`, `content` (seconds). */
+export declare function parseBiliJson(raw: string): Cue[];
+/**
+ * Parse a caption file by its extension (the one yt-dlp wrote).
+ *
+ * @param raw - the file's text.
+ * @param ext - `json3`, `vtt`, `srt` or `json`.
+ */
+export declare function parseCaptions(raw: string, ext: string): Cue[];
+/** The merge rules (exported for the specs). */
+export declare const MERGE: {
+    /** A paragraph closes at a sentence end once it is at least this long (seconds). */
+    readonly minSeconds: 15;
+    /** …and always closes past this length, sentence end or not. */
+    readonly maxSeconds: 60;
+    /** A pause this long between cues closes the paragraph too. */
+    readonly pauseSeconds: 2.5;
+    /**
+     * Unpunctuated captions (YouTube's automatic ones carry no punctuation at
+     * all — measured 2026-10-20): close at the first pause of this length once
+     * the paragraph has run {@link MERGE.bareMinSeconds}, and always by
+     * {@link MERGE.bareMaxSeconds}.
+     */
+    readonly barePauseSeconds: 0.7;
+    readonly bareMinSeconds: 15;
+    readonly bareMaxSeconds: 35;
+    /** Below this share of sentence-ending cues, captions count as unpunctuated. */
+    readonly punctuatedShare: 0.1;
+};
+/**
+ * Merge caption cues into readable paragraphs.
+ *
+ * Punctuated captions close a paragraph at a sentence end once it has run
+ * {@link MERGE.minSeconds}, at a pause of {@link MERGE.pauseSeconds}, or past
+ * {@link MERGE.maxSeconds}. Unpunctuated ones have no sentence ends to use, so
+ * they close at a short pause past {@link MERGE.bareMinSeconds} — short enough
+ * to point at, long enough to read as prose rather than subtitles.
+ *
+ * @param cues - the caption cues in time order.
+ * @returns the paragraphs.
+ */
+export declare function mergeCues(cues: readonly Cue[]): TranscriptSegment[];
+/** `mm:ss` or `h:mm:ss`. */
+export declare function formatClock(seconds: number): string;
+/**
+ * The transcript as article markup: one `<p>` per paragraph, its start time in
+ * `data-t` (seconds, one decimal) — the attribute the player seeks by.
+ *
+ * @param segments - the merged paragraphs.
+ */
+export declare function renderTranscript(segments: readonly TranscriptSegment[]): string;
+//# sourceMappingURL=captions.d.ts.map

package/lib/types/captions.js

@@ -0,0 +1,236 @@
+/**
+ * Captions → the transcript a video or audio entry reads as.
+ *
+ * Every platform's caption file is parsed into the same flat cue list (start,
+ * end, text), merged into paragraphs a person can read (sentence ends, pauses,
+ * a length cap), and rendered as article markup where each paragraph carries
+ * its start time. The markup is the entry's body: notes, highlights,
+ * translation and the model's ¶ numbering all work on it unchanged, and the
+ * player reads `data-t` to seek.
+ *
+ * Pure: no fs, no network — the formats are measured on real files and pinned
+ * by the specs.
+ *
+ * @module @khorsheed/dsh-reader/captions
+ */
+/** Collapse whitespace and strip the markup some caption files carry. */
+function clean(text) {
+    return text
+        .replace(/<[^>]+>/g, '')
+        .replace(/&nbsp;/g, ' ')
+        .replace(/&amp;/g, '&')
+        .replace(/&lt;/g, '<')
+        .replace(/&gt;/g, '>')
+        .replace(/&#39;/g, "'")
+        .replace(/&quot;/g, '"')
+        .replace(/\s+/g, ' ')
+        .trim();
+}
+/** Seconds from `hh:mm:ss.mmm` / `mm:ss.mmm` / `hh:mm:ss,mmm`. */
+function clock(value) {
+    const parts = value.trim().replace(',', '.').split(':').map(Number);
+    if (parts.some(part => !Number.isFinite(part)))
+        return Number.NaN;
+    return parts.reduce((total, part) => total * 60 + part, 0);
+}
+/**
+ * YouTube's `json3` captions: `events[]` with `tStartMs`, `dDurationMs` and
+ * `segs[].utf8`. Auto captions also carry `aAppend` newline events and
+ * word-level `tOffsetMs`; only whole events become cues.
+ */
+export function parseJson3(raw) {
+    const data = JSON.parse(raw);
+    const cues = [];
+    for (const event of data.events ?? []) {
+        if (event.segs === undefined || event.aAppend === 1)
+            continue;
+        const text = clean(event.segs.map(seg => seg.utf8 ?? '').join(''));
+        if (text === '')
+            continue;
+        const startMs = event.tStartMs ?? 0;
+        cues.push({ start: startMs / 1000, end: (startMs + (event.dDurationMs ?? 0)) / 1000, text });
+    }
+    return cues;
+}
+/**
+ * WebVTT. YouTube's auto captions in VTT are ROLLING: each cue repeats the
+ * previous line and adds the next, with inline word timings. The rolling
+ * duplicates are dropped by keeping only the text a cue adds over the one
+ * before it.
+ */
+export function parseVtt(raw) {
+    const blocks = raw.replace(/\r/g, '').split(/\n\n+/);
+    const cues = [];
+    let previous = '';
+    for (const block of blocks) {
+        const lines = block.split('\n');
+        const timing = lines.findIndex(line => line.includes('-->'));
+        if (timing < 0)
+            continue;
+        const [from, to] = lines[timing].split('-->');
+        const start = clock(from ?? '');
+        const end = clock((to ?? '').trim().split(/\s+/)[0] ?? '');
+        if (!Number.isFinite(start))
+            continue;
+        const textLines = lines.slice(timing + 1).map(line => clean(line)).filter(line => line !== '');
+        let text = textLines.join(' ');
+        if (text === '')
+            continue;
+        if (previous !== '' && text.startsWith(previous))
+            text = text.slice(previous.length).trim();
+        else if (textLines.length > 1 && textLines[0] === previous)
+            text = textLines.slice(1).join(' ');
+        previous = textLines[textLines.length - 1] ?? previous;
+        if (text === '' || (cues.length > 0 && cues[cues.length - 1].text === text))
+            continue;
+        cues.push({ start, end: Number.isFinite(end) ? end : start, text });
+    }
+    return cues;
+}
+/** SubRip (`.srt`). */
+export function parseSrt(raw) {
+    const cues = [];
+    for (const block of raw.replace(/\r/g, '').split(/\n\n+/)) {
+        const lines = block.split('\n');
+        const timing = lines.findIndex(line => line.includes('-->'));
+        if (timing < 0)
+            continue;
+        const [from, to] = lines[timing].split('-->');
+        const start = clock(from ?? '');
+        const end = clock(to ?? '');
+        const text = clean(lines.slice(timing + 1).join(' '));
+        if (!Number.isFinite(start) || text === '')
+            continue;
+        cues.push({ start, end: Number.isFinite(end) ? end : start, text });
+    }
+    return cues;
+}
+/** Bilibili's subtitle JSON: `body[]` with `from`, `to`, `content` (seconds). */
+export function parseBiliJson(raw) {
+    const data = JSON.parse(raw);
+    return (data.body ?? []).flatMap(item => {
+        const text = clean(item.content ?? '');
+        if (text === '' || typeof item.from !== 'number')
+            return [];
+        return [{ start: item.from, end: typeof item.to === 'number' ? item.to : item.from, text }];
+    });
+}
+/**
+ * Parse a caption file by its extension (the one yt-dlp wrote).
+ *
+ * @param raw - the file's text.
+ * @param ext - `json3`, `vtt`, `srt` or `json`.
+ */
+export function parseCaptions(raw, ext) {
+    switch (ext.toLowerCase()) {
+        case 'json3': return parseJson3(raw);
+        case 'vtt': return parseVtt(raw);
+        case 'srt': return parseSrt(raw);
+        case 'json': return parseBiliJson(raw);
+        default: return [];
+    }
+}
+/** True when a line ends a sentence (Latin or CJK punctuation). */
+function endsSentence(text) {
+    return /[.!?。！？…]["'”’）)]?$/.test(text);
+}
+/** True for text that is mostly CJK (joined without spaces). */
+function isCjk(text) {
+    return /[㐀-鿿]/.test(text);
+}
+/** The merge rules (exported for the specs). */
+export const MERGE = {
+    /** A paragraph closes at a sentence end once it is at least this long (seconds). */
+    minSeconds: 15,
+    /** …and always closes past this length, sentence end or not. */
+    maxSeconds: 60,
+    /** A pause this long between cues closes the paragraph too. */
+    pauseSeconds: 2.5,
+    /**
+     * Unpunctuated captions (YouTube's automatic ones carry no punctuation at
+     * all — measured 2026-10-20): close at the first pause of this length once
+     * the paragraph has run {@link MERGE.bareMinSeconds}, and always by
+     * {@link MERGE.bareMaxSeconds}.
+     */
+    barePauseSeconds: 0.7,
+    bareMinSeconds: 15,
+    bareMaxSeconds: 35,
+    /** Below this share of sentence-ending cues, captions count as unpunctuated. */
+    punctuatedShare: 0.1,
+};
+/**
+ * Merge caption cues into readable paragraphs.
+ *
+ * Punctuated captions close a paragraph at a sentence end once it has run
+ * {@link MERGE.minSeconds}, at a pause of {@link MERGE.pauseSeconds}, or past
+ * {@link MERGE.maxSeconds}. Unpunctuated ones have no sentence ends to use, so
+ * they close at a short pause past {@link MERGE.bareMinSeconds} — short enough
+ * to point at, long enough to read as prose rather than subtitles.
+ *
+ * @param cues - the caption cues in time order.
+ * @returns the paragraphs.
+ */
+export function mergeCues(cues) {
+    const sorted = [...cues].sort((left, right) => left.start - right.start);
+    const punctuated = sorted.length > 0 && sorted.filter(cue => endsSentence(cue.text)).length / sorted.length >= MERGE.punctuatedShare;
+    const segments = [];
+    let current;
+    const flush = () => {
+        if (current === undefined || current.lines.length === 0)
+            return;
+        const joiner = isCjk(current.lines.map(line => line.text).join('')) ? '' : ' ';
+        segments.push({
+            start: current.start,
+            end: current.end,
+            text: current.lines.map(line => line.text).join(joiner).replace(/\s+/g, ' ').trim(),
+            lines: current.lines,
+        });
+        current = undefined;
+    };
+    for (let index = 0; index < sorted.length; index++) {
+        const cue = sorted[index];
+        if (current !== undefined && cue.start - current.end >= MERGE.pauseSeconds)
+            flush();
+        if (current === undefined)
+            current = { start: cue.start, end: cue.end, lines: [] };
+        current.lines.push({ start: cue.start, text: cue.text });
+        current.end = Math.max(current.end, cue.end);
+        const length = current.end - current.start;
+        if (punctuated) {
+            if ((length >= MERGE.minSeconds && endsSentence(cue.text)) || length >= MERGE.maxSeconds)
+                flush();
+        }
+        else {
+            const next = sorted[index + 1];
+            const gap = next === undefined ? Infinity : next.start - cue.end;
+            if ((length >= MERGE.bareMinSeconds && gap >= MERGE.barePauseSeconds) || length >= MERGE.bareMaxSeconds)
+                flush();
+        }
+    }
+    flush();
+    return segments;
+}
+/** `mm:ss` or `h:mm:ss`. */
+export function formatClock(seconds) {
+    const total = Math.max(0, Math.floor(seconds));
+    const h = Math.floor(total / 3600);
+    const m = Math.floor((total % 3600) / 60);
+    const s = total % 60;
+    const mm = h > 0 ? String(m).padStart(2, '0') : String(m);
+    return `${h > 0 ? `${String(h)}:` : ''}${mm}:${String(s).padStart(2, '0')}`;
+}
+/** Escape text for HTML content. */
+function escapeHtml(text) {
+    return text.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
+}
+/**
+ * The transcript as article markup: one `<p>` per paragraph, its start time in
+ * `data-t` (seconds, one decimal) — the attribute the player seeks by.
+ *
+ * @param segments - the merged paragraphs.
+ */
+export function renderTranscript(segments) {
+    return segments
+        .map(segment => `<p data-t="${segment.start.toFixed(1)}">${escapeHtml(segment.text)}</p>`)
+        .join('\n');
+}

package/lib/types/client/MediaPlayer.d.ts

@@ -0,0 +1,55 @@
+/**
+ * The player at the top of a video or audio entry.
+ *
+ * Three players, one surface (measured 2026-10-20):
+ * - **YouTube**: the official embed in a frame of OUR making (scripts +
+ *   its own origin + presentation — the article body's strict sandbox would
+ *   break it), driven over postMessage (`enablejsapi=1`): `seekTo` / `playVideo`
+ *   / `pauseVideo` commands, and `infoDelivery` messages report the current
+ *   time (about four times a second) and the play state, which is what
+ *   follows the transcript.
+ * - **Bilibili**: the official external player. It exposes no control
+ *   channel and reports nothing, so a seek reloads it with `t`, and there is
+ *   no current time to follow.
+ * - **Audio** (a feed enclosure, a Xiaoyuzhou episode): the native element.
+ *
+ * A video has two sizes: full (16:9, at most ~40% of the window high) and a
+ * MINI bar (a small live picture, the title, the time) the pane switches to
+ * while the reader is down in the transcript. Both are the SAME frame resized
+ * by CSS — the video keeps playing; nothing reloads.
+ *
+ * @module @khorsheed/dsh-reader/client/MediaPlayer
+ */
+import { type ReactNode } from 'react';
+import { type ReaderMedia } from '../media.ts';
+/** What the pane can ask of the player. */
+export interface MediaPlayerHandle {
+    /** Jump to `seconds` and play. */
+    seek: (seconds: number) => void;
+}
+/** The player's props. */
+export interface MediaPlayerProps {
+    readonly media: ReaderMedia;
+    readonly title: string;
+    /** Where to start (a remembered position). */
+    readonly startAt: number;
+    /** The current time, whenever the player knows it (YouTube, audio). */
+    readonly onTime: (seconds: number) => void;
+    /** The mini bar instead of the full picture (videos only). */
+    readonly mini: boolean;
+    readonly onMini: (mini: boolean) => void;
+    /** The control row's own items: before the 收起 toggle, and at its end. */
+    readonly leading?: ReactNode;
+    readonly trailing?: ReactNode;
+    readonly labels: {
+        readonly collapse: string;
+        readonly expand: string;
+        readonly noFollow: string;
+        readonly play: string;
+        readonly pause: string;
+        readonly startedAt: string;
+    };
+}
+/** The player. */
+export declare const MediaPlayer: import("react").ForwardRefExoticComponent<MediaPlayerProps & import("react").RefAttributes<MediaPlayerHandle>>;
+//# sourceMappingURL=MediaPlayer.d.ts.map

package/lib/types/client/MediaPlayer.js

@@ -0,0 +1,106 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * The player at the top of a video or audio entry.
+ *
+ * Three players, one surface (measured 2026-10-20):
+ * - **YouTube**: the official embed in a frame of OUR making (scripts +
+ *   its own origin + presentation — the article body's strict sandbox would
+ *   break it), driven over postMessage (`enablejsapi=1`): `seekTo` / `playVideo`
+ *   / `pauseVideo` commands, and `infoDelivery` messages report the current
+ *   time (about four times a second) and the play state, which is what
+ *   follows the transcript.
+ * - **Bilibili**: the official external player. It exposes no control
+ *   channel and reports nothing, so a seek reloads it with `t`, and there is
+ *   no current time to follow.
+ * - **Audio** (a feed enclosure, a Xiaoyuzhou episode): the native element.
+ *
+ * A video has two sizes: full (16:9, at most ~40% of the window high) and a
+ * MINI bar (a small live picture, the title, the time) the pane switches to
+ * while the reader is down in the transcript. Both are the SAME frame resized
+ * by CSS — the video keeps playing; nothing reloads.
+ *
+ * @module @khorsheed/dsh-reader/client/MediaPlayer
+ */
+import { forwardRef, useCallback, useEffect, useImperativeHandle, useRef, useState } from 'react';
+import { embedUrl } from "../media.js";
+import { formatClock } from "../captions.js";
+import css from './MediaPlayer.module.css';
+/** Post one YouTube IFrame API message. */
+function postYouTube(frame, message) {
+    frame?.contentWindow?.postMessage(JSON.stringify(message), 'https://www.youtube.com');
+}
+/** The player. */
+export const MediaPlayer = forwardRef(function MediaPlayer(props, ref) {
+    const { media, title, startAt, onTime, mini, onMini, leading, trailing, labels } = props;
+    const frameRef = useRef(null);
+    const audioRef = useRef(null);
+    const [time, setTime] = useState(startAt);
+    const [duration, setDuration] = useState(media.durationSec);
+    const [playing, setPlaying] = useState(false);
+    // Bilibili seeks by reloading: the start of the CURRENT load.
+    const [biliStart, setBiliStart] = useState(startAt);
+    const origin = typeof window === 'undefined' ? '' : window.location.origin;
+    const [ytSrc] = useState(() => media.provider === 'youtube' ? embedUrl(media, startAt, origin) : undefined);
+    const report = useCallback((seconds) => {
+        setTime(seconds);
+        onTime(seconds);
+    }, [onTime]);
+    // YouTube: subscribe to its state messages once the frame loads.
+    useEffect(() => {
+        if (media.provider !== 'youtube')
+            return;
+        const listen = (event) => {
+            if (!/^https:\/\/www\.youtube(-nocookie)?\.com$/.test(event.origin) || typeof event.data !== 'string')
+                return;
+            try {
+                const data = JSON.parse(event.data);
+                if (data.event !== 'infoDelivery' && data.event !== 'initialDelivery')
+                    return;
+                const current = data.info?.currentTime;
+                if (typeof current === 'number')
+                    report(current);
+                if (typeof data.info?.duration === 'number' && data.info.duration > 0)
+                    setDuration(data.info.duration);
+                // 1 playing, 2 paused, 0 ended, 3 buffering.
+                const state = data.info?.playerState;
+                if (typeof state === 'number')
+                    setPlaying(state === 1 || state === 3);
+            }
+            catch {
+                // Not a player message.
+            }
+        };
+        window.addEventListener('message', listen);
+        return () => { window.removeEventListener('message', listen); };
+    }, [media.provider, report]);
+    useImperativeHandle(ref, () => ({
+        seek: (seconds) => {
+            if (media.provider === 'youtube') {
+                postYouTube(frameRef.current, { event: 'command', func: 'seekTo', args: [seconds, true] });
+                postYouTube(frameRef.current, { event: 'command', func: 'playVideo', args: [] });
+                report(seconds);
+            }
+            else if (media.provider === 'bilibili') {
+                setBiliStart(seconds);
+                report(seconds);
+            }
+            else if (audioRef.current !== null) {
+                audioRef.current.currentTime = seconds;
+                void audioRef.current.play().catch(() => undefined);
+            }
+        },
+    }), [media.provider, report]);
+    const toggle = () => {
+        postYouTube(frameRef.current, { event: 'command', func: playing ? 'pauseVideo' : 'playVideo', args: [] });
+        setPlaying(!playing);
+    };
+    const video = media.kind === 'video' && (media.provider === 'youtube' || media.provider === 'bilibili');
+    const small = video && mini;
+    const knowsTime = media.provider === 'youtube';
+    return (_jsxs("div", { className: css.player, "data-mini": small ? 'true' : undefined, children: [video && (_jsx("div", { className: css.videoStage, children: _jsxs("div", { className: css.frameBox, children: [media.provider === 'youtube'
+                            ? (_jsx("iframe", { ref: frameRef, className: css.frame, title: title, src: ytSrc, sandbox: "allow-scripts allow-same-origin allow-presentation allow-popups", allow: "autoplay; encrypted-media; fullscreen; picture-in-picture", referrerPolicy: "strict-origin-when-cross-origin", onLoad: () => { postYouTube(frameRef.current, { event: 'listening', id: 'dsh-reader' }); } }))
+                            : (_jsx("iframe", { className: css.frame, title: title, src: embedUrl(media, biliStart, origin), sandbox: "allow-scripts allow-same-origin allow-presentation allow-popups", allow: "autoplay; fullscreen", referrerPolicy: "strict-origin-when-cross-origin" }, biliStart)), small && _jsx("button", { type: "button", className: css.miniCover, "aria-label": labels.expand, onClick: () => { onMini(false); } })] }) })), small && (_jsxs(_Fragment, { children: [_jsxs("div", { className: css.miniInfo, children: [_jsx("b", { children: title }), _jsx("span", { children: knowsTime
+                                    ? `${formatClock(time)}${duration === undefined ? '' : ` / ${formatClock(duration)}`}`
+                                    : labels.startedAt.replace('{time}', formatClock(biliStart)) })] }), knowsTime && (_jsx("button", { type: "button", className: css.miniButton, "aria-label": playing ? labels.pause : labels.play, title: playing ? labels.pause : labels.play, onClick: toggle, children: playing ? _jsx("span", { className: css.pauseGlyph }) : _jsx("span", { className: css.playGlyph }) })), _jsx("button", { type: "button", className: css.miniButton, "aria-label": labels.expand, title: labels.expand, onClick: () => { onMini(false); }, children: _jsx("span", { className: css.expandGlyph }) }), knowsTime && duration !== undefined && (_jsx("span", { className: css.miniProgress, children: _jsx("i", { style: { width: `${Math.min(100, (time / duration) * 100)}%` } }) }))] })), !video && (_jsx("audio", { ref: audioRef, className: css.audio, controls: true, preload: "metadata", src: media.ref, onLoadedMetadata: event => { if (startAt > 0)
+                    event.currentTarget.currentTime = startAt; }, onTimeUpdate: event => { report(event.currentTarget.currentTime); } })), !small && (_jsxs("div", { className: css.strip, children: [leading, video && (_jsx("button", { type: "button", className: css.link, onClick: () => { onMini(true); }, children: labels.collapse })), _jsx("span", { className: css.spacer }), trailing, media.provider === 'bilibili' && (_jsx("span", { className: css.info, title: labels.noFollow, "aria-label": labels.noFollow, tabIndex: 0, children: "i" }))] }))] }));
+});

package/lib/types/client/NotesView.d.ts

@@ -0,0 +1,57 @@
+/**
+ * The notes face of the detail view: the article's excerpts with their
+ * comments, the conversations that discussed it, and the sheet a new note is
+ * written in.
+ *
+ * One layout for every width (docs/panel-design.md): the list is a single
+ * column that only tightens under the panel's compact container, and the
+ * sheet rises from the bottom of the pane on a desk and on a phone alike.
+ *
+ * @module @khorsheed/dsh-reader/client/NotesView
+ */
+import { type ReactNode } from 'react';
+import type { ReaderDiscussion, ReaderEntryNotes, ReaderNote } from '../notes-types.ts';
+import type { ReaderPaneProps } from './contract.ts';
+import type { NoteSelection } from './notes.ts';
+import type { SyncFace } from './useNotes.ts';
+type T = ReaderPaneProps['t'];
+/** The notes view's props. */
+export interface NotesViewProps {
+    readonly t: T;
+    readonly entry: ReaderEntryNotes | undefined;
+    /** Notes whose excerpt is no longer in the article on screen. */
+    readonly missing: ReadonlySet<string>;
+    /** A conversation's live title, when the session list knows it. */
+    readonly sessionTitle: (sessionId: string) => string | undefined;
+    /** Whether a conversation can be opened from here. */
+    readonly canOpenSession: boolean;
+    readonly onJump: (note: ReaderNote) => void;
+    readonly onEdit: (note: ReaderNote, comment: string) => Promise<boolean>;
+    readonly onDelete: (note: ReaderNote) => void;
+    /** Bring these notes (all of them when empty) into the conversation draft. */
+    readonly onDiscuss: (noteIds: readonly string[]) => void;
+    readonly onOpenSession: (sessionId: string) => void;
+    readonly onAddReply: (note: ReaderNote, text: string) => Promise<boolean>;
+    readonly onEditReply: (note: ReaderNote, index: number, text: string) => Promise<boolean>;
+    readonly onDeleteDiscussion: (discussion: ReaderDiscussion) => void;
+    /** Show the article at this paragraph (1-based ¶). */
+    readonly onJumpPara: (para: number) => void;
+    /** Put the 「让Agent考考我」 request into the conversation draft. */
+    readonly onCheck: () => void;
+    readonly sync: SyncFace;
+    /** Play a note's moment; absent for articles. */
+    readonly onPlay?: (note: ReaderNote) => void;
+}
+/** The article's notes, and the conversations that discussed it. */
+export declare function NotesView(props: NotesViewProps): ReactNode;
+/** The sheet a new note is written in. */
+export declare function NoteSheet({ t, selection, saving, failed, onSave, onCancel }: {
+    t: T;
+    selection: NoteSelection;
+    saving: boolean;
+    failed: boolean;
+    onSave: (comment: string) => void;
+    onCancel: () => void;
+}): ReactNode;
+export {};
+//# sourceMappingURL=NotesView.d.ts.map