@aicayzer/inkkit 0.0.9 → 0.0.11

package/dist/editor.js

@@ -21,10 +21,11 @@ import { sourceAttribute, cleanSourceDoc, editedPlainSource, sourceSelection, ra
 import { normaliseLabel, referenceDefinitions, footnoteDefinitions, } from './references.js';
 import { selectionMarkdown, selectionContent, referenceMetadata, withReferenceMetadata, } from './reference-clipboard.js';
 import { imageView } from './images.js';
+import { wikiLinkView } from './wiki-view.js';
+import { withFileSignal } from './files.js';
 import { tablePlugins, tableCommand, tableCommands, tableAvailability, tableContext, configureTableMovement, } from './tables.js';
 import { InkKitError, } from './types.js';
 import { readableProjection, projectionPosition, projectionOffset, validateOffsets, formattedRects, literalRects, literalVisibleRanges, intersectsViewport, textRect, } from './text-ranges.js';
-import { highlightPlugin } from './highlight.js';
 import { highlightKeymap, toggleHighlightCommand } from './inline-highlight.js';
 import { commentSelectionContent, setCommentVisibility } from './comments.js';
 import { PasteController } from './paste.js';
@@ -251,12 +252,14 @@ export class InkKitEditor {
     revision = 0;
     documentEpoch = 0;
     operationSequence = 0;
+    exportControllers = new Set();
     plainComposing = false;
     plainSearch = '';
     literalMatch;
     beforePlainInput;
     mode = 'formatted';
     sourcePreservations = new WeakMap();
+    sourceTexts = new WeakMap();
     outlineEpoch = 0;
     ready = false;
     destroyed = false;
@@ -294,6 +297,8 @@ export class InkKitEditor {
                 if (this.loading || view.state.doc.eq(previous.doc))
                     return;
                 this.revision += 1;
+                this.cancelExports();
+                this.mediaPolicy();
                 this.literalMatch = undefined;
                 let markdown;
                 try {
@@ -335,6 +340,36 @@ export class InkKitEditor {
             operationId: `${this.documentEpoch}:${this.generation}:${++this.operationSequence}`,
         };
     }
+    cancelExports() {
+        for (const controller of this.exportControllers)
+            controller.abort();
+        this.exportControllers.clear();
+    }
+    async exportContent(snapshot, operation) {
+        const epoch = this.documentEpoch;
+        const mode = this.editingMode;
+        const controller = new AbortController();
+        this.exportControllers.add(controller);
+        try {
+            return await withFileSignal(operation(controller.signal), controller.signal);
+        }
+        finally {
+            this.exportControllers.delete(controller);
+            this.assertCurrent(snapshot.generation);
+            if (controller.signal.aborted ||
+                epoch !== this.documentEpoch ||
+                snapshot.documentId !== this.documentId ||
+                snapshot.revision !== this.revision ||
+                mode !== this.editingMode)
+                throw new InkKitError('stale-document', 'Document changed while preparing output');
+        }
+    }
+    mediaPolicy() {
+        if (this.editor && this.root)
+            this.editor.ctx
+                .get(editorViewCtx)
+                .dom.dispatchEvent(new Event('inkkit-media-policy'));
+    }
     assertAlive() {
         if (this.destroyed)
             throw new InkKitError('destroyed', 'The editor has been destroyed');
@@ -383,6 +418,7 @@ export class InkKitEditor {
                 .get(editorViewCtx)
                 .dom.dispatchEvent(new Event('inkkit-cancel-resize'));
             this.applyInputPolicy();
+            this.mediaPolicy();
         }
         finally {
             this.reportingSuppressed = suppressed;
@@ -566,6 +602,9 @@ export class InkKitEditor {
         return this.literalSurface ? 'source' : 'formatted';
     }
     currentText(doc = this.editor.ctx.get(editorViewCtx).state.doc) {
+        const cached = this.sourceTexts.get(doc);
+        if (cached !== undefined)
+            return cached;
         const provenance = doc.attrs[sourceAttribute];
         if (this.formatType === 'txt')
             return provenance?.text ?? this.originalSource;
@@ -577,7 +616,9 @@ export class InkKitEditor {
                 this.sourcePreservations.set(provenance, preservation);
             }
         }
-        return preservation.serialize(cleanSourceDoc(doc));
+        const text = preservation.serialize(cleanSourceDoc(doc));
+        this.sourceTexts.set(doc, text);
+        return text;
     }
     setEditingMode(mode, expectedGeneration) {
         this.assertCurrent(expectedGeneration);
@@ -593,6 +634,7 @@ export class InkKitEditor {
         const top = container.scrollTop, left = container.scrollLeft;
         const text = this.snapshot().text;
         this.mode = mode;
+        this.cancelExports();
         this.outlineEpoch += 1;
         this.plainSearch = '';
         this.literalMatch = undefined;
@@ -631,6 +673,7 @@ export class InkKitEditor {
             : (this.options.labels?.sourceEditor ?? defaultLabels.sourceEditor));
         this.editor.ctx.get(editorViewCtx).dom.parentElement.hidden =
             this.literalSurface;
+        this.mediaPolicy();
     }
     replaceSource(text, expectedGeneration) {
         this.assertMutation(expectedGeneration);
@@ -735,26 +778,17 @@ export class InkKitEditor {
     }
     async printableSnapshot(expectedGeneration) {
         const snapshot = this.snapshot(expectedGeneration);
-        const epoch = this.documentEpoch;
         const state = this.editor.ctx.get(editorViewCtx).state;
-        let output;
-        try {
+        const output = await this.exportContent(snapshot, async (signal) => {
             if (snapshot.format === 'md' &&
                 !this.options.images &&
+                !this.options.files &&
                 hasAuthoredImagesInLiterals(state.doc.content, (source) => this.editor.ctx.get(remarkCtx).parse(source)))
                 throw new InkKitError('image-unavailable', 'No image adapter is configured for the authored images.');
-            output =
-                snapshot.format === 'txt'
-                    ? printableText(snapshot.text)
-                    : await printableMarkdown(state.doc.content, state.schema, this.options.images, this.context());
-        }
-        finally {
-            this.assertCurrent(snapshot.generation);
-            if (snapshot.documentId !== this.documentId ||
-                epoch !== this.documentEpoch ||
-                snapshot.revision !== this.revision)
-                throw new InkKitError('stale-document', 'Document changed while preparing printable content');
-        }
+            return snapshot.format === 'txt'
+                ? printableText(snapshot.text)
+                : printableMarkdown(state.doc.content, state.schema, this.options.images, this.context(), this.options.files, signal);
+        });
         return Object.freeze({
             documentId: snapshot.documentId,
             generation: snapshot.generation,
@@ -827,7 +861,7 @@ export class InkKitEditor {
                 ? error.message
                 : 'Cannot copy the selected Markdown');
         }
-        const result = await portableClipboard(all || selectedDoc ? content : selectionContent(doc, content), schema, markdown, this.options.images, this.context(), completeDiagrams);
+        const result = await this.exportContent(snapshot, (signal) => portableClipboard(all || selectedDoc ? content : selectionContent(doc, content), schema, markdown, this.options.images, this.context(), completeDiagrams, this.options.files, signal));
         const metadata = referenceMetadata(this.editor.ctx, selectedDoc ?? doc, content);
         if (metadata != null)
             result.html = withReferenceMetadata(result.html, metadata);
@@ -870,28 +904,41 @@ export class InkKitEditor {
             }
             else {
                 const { schema } = view.state;
+                const marks = view.state.storedMarks ??
+                    (view.state.selection.empty
+                        ? view.state.selection.$from.marks()
+                        : view.state.selection.$from.marksAcross(view.state.selection.$to)) ??
+                    [];
                 const children = [];
-                text
-                    .replace(/\r\n?/g, '\n')
-                    .split('\n')
-                    .forEach((line, index) => {
+                const lines = text.replace(/\r\n?/g, '\n').split('\n');
+                lines.forEach((line, index) => {
+                    const finalBreak = index === lines.length - 1 && line === '';
                     if (index)
                         children.push(schema.nodes.hardbreak.create({
-                            isHTML: index ===
-                                text.replace(/\r\n?/g, '\n').split('\n').length - 1 &&
-                                line === '',
-                        }));
+                            isHTML: finalBreak,
+                        }, null, 
+                        // A terminal HTML spacer must remain outside emphasis to reopen as a break.
+                        finalBreak ? [] : marks));
                     if (line)
-                        children.push(schema.text(line));
+                        children.push(schema.text(line, marks));
                 });
                 if (!children.length) {
                     view.dispatch(view.state.tr.deleteSelection());
                     return;
                 }
                 const paragraph = schema.nodes.paragraph.create(null, children);
-                view.dispatch(view.state.tr
+                const transaction = view.state.tr
                     .replaceSelection(new Slice(Fragment.from(paragraph), 1, 1))
-                    .scrollIntoView());
+                    .scrollIntoView();
+                try {
+                    this.currentText(transaction.doc);
+                }
+                catch (error) {
+                    throw new InkKitError('preservation', error instanceof Error
+                        ? error.message
+                        : 'Cannot preserve inserted text');
+                }
+                view.dispatch(transaction);
             }
         }
     }
@@ -906,6 +953,8 @@ export class InkKitEditor {
             return;
         this.destroyed = true;
         this.ready = false;
+        this.cancelExports();
+        this.mediaPolicy();
         this.pasteController.destroy();
         if (this.clickHandler)
             this.root.removeEventListener('click', this.clickHandler);
@@ -1052,7 +1101,7 @@ export class InkKitEditor {
             .use(instance.pasteController.plugin)
             .use(visibleClipboard)
             .use(instance.keymapPlugin)
-            .use(createDialect(Boolean(options.images)))
+            .use(createDialect(Boolean(options.images || options.files), Boolean(options.wikiLinks), Boolean(options.files)))
             .use(tablePlugins)
             .use(instance.changePlugin)
             .use(history)
@@ -1065,12 +1114,66 @@ export class InkKitEditor {
             .use(dropControlCharacters)
             .use(codeCopyPlugin((text) => events.copy(text)))
             .use(placeholderPlugin)
-            .use(highlightPlugin)
-            .use(mermaidPreview((error) => events.error?.(error)))
+            .use(options.rendering?.codeHighlighting === false
+            ? []
+            : (await import('./highlight')).highlightPlugin)
+            .use(options.rendering?.diagramPreview === false
+            ? []
+            : mermaidPreview((error) => events.error?.(error)))
             .use(selectionPlugin)
             .use($prose(() => search()))
             .use(instance.policyPlugin)
-            .use(options.images ? imageView(options.images) : [])
+            .use(options.wikiLinks
+            ? wikiLinkView(options.wikiLinks, {
+                capture: () => {
+                    const epoch = instance.documentEpoch;
+                    const context = instance.context();
+                    return {
+                        context,
+                        isCurrent: () => !instance.destroyed &&
+                            epoch === instance.documentEpoch &&
+                            context.documentId === instance.documentId &&
+                            context.generation === instance.generation,
+                    };
+                },
+                active: () => instance.ready &&
+                    !instance.destroyed &&
+                    !instance.literalSurface,
+                labels: { ...defaultLabels, ...options.labels },
+                error: (error) => events.error?.(error),
+            })
+            : [])
+            .use(options.images || options.files
+            ? imageView(options.images, options.files
+                ? {
+                    adapter: options.files,
+                    capture: () => {
+                        const epoch = instance.documentEpoch;
+                        const context = instance.context();
+                        return {
+                            context,
+                            isCurrent: () => !instance.destroyed &&
+                                epoch === instance.documentEpoch &&
+                                context.documentId === instance.documentId &&
+                                context.generation === instance.generation,
+                        };
+                    },
+                    active: () => instance.ready &&
+                        !instance.destroyed &&
+                        !instance.literalSurface,
+                    labels: { ...defaultLabels, ...options.labels },
+                    error: (error) => events.error?.(error),
+                }
+                : undefined, () => {
+                try {
+                    instance.assertMutation();
+                    return true;
+                }
+                catch {
+                    return false;
+                }
+            })
+            : [])
             .create();
         configureTableMovement(instance.editor.ctx, () => {
             try {
@@ -1275,10 +1378,13 @@ export class InkKitEditor {
             ? this.plain.ownerDocument.activeElement === this.plain
             : this.editor.ctx.get(editorViewCtx).hasFocus();
         this.ready = false;
+        this.cancelExports();
+        this.mediaPolicy();
         this.pasteController.cancelPending();
         this.documentEpoch += 1;
         this.outlineEpoch += 1;
         this.sourcePreservations = new WeakMap();
+        this.sourceTexts = new WeakMap();
         this.mode = 'formatted';
         this.plainComposing = false;
         this.beforePlainInput = undefined;
@@ -1294,6 +1400,7 @@ export class InkKitEditor {
         this.lastMarkdown = input.text;
         this.updateSurface();
         this.ready = true;
+        this.mediaPolicy();
         if (focused) {
             if (this.literalSurface)
                 this.plain.focus({ preventScroll: true });
@@ -1794,6 +1901,10 @@ export class InkKitEditor {
             this.replaceLiteralSelection(text, false);
             return true;
         }
+        if (/[\r\n]/.test(text)) {
+            this.pasteAsPlainText(text);
+            return true;
+        }
         const view = this.editor.ctx.get(editorViewCtx);
         if (view.composing)
             return false;

package/dist/files.d.ts

@@ -0,0 +1,40 @@
+import type { DocumentContext, FileAdapter, FileContext, FilePresentation, FileReference } from './types.js';
+import type { EditorLabels } from './labels.js';
+export interface FileViewRuntime {
+    adapter: FileAdapter;
+    capture(): {
+        context: DocumentContext;
+        isCurrent(): boolean;
+    };
+    active(): boolean;
+    labels: Readonly<EditorLabels>;
+    error?(error: Error): void;
+}
+export declare function withFileSignal<T>(operation: Promise<T>, signal: AbortSignal): Promise<T>;
+export declare function resolveFile(adapter: FileAdapter, reference: FileReference, context: FileContext): Promise<FilePresentation>;
+export type FileResolutionState = {
+    status: 'idle';
+} | {
+    status: 'loading';
+} | {
+    status: 'resolved';
+    presentation: FilePresentation;
+} | {
+    status: 'failed';
+    error: Error;
+};
+export declare class FileResolution {
+    private readonly runtime;
+    private readonly changed;
+    state: FileResolutionState;
+    private reference?;
+    private key;
+    private request?;
+    private dead;
+    constructor(runtime: FileViewRuntime, changed: () => void);
+    update(reference: FileReference): void;
+    retry(): void;
+    private current;
+    cancel(): void;
+    destroy(): void;
+}

package/dist/files.js

@@ -0,0 +1,133 @@
+function abort(signal) {
+    if (signal.aborted)
+        throw new DOMException('File resolution cancelled', 'AbortError');
+}
+export function withFileSignal(operation, signal) {
+    return new Promise((resolve, reject) => {
+        const cleanup = () => signal.removeEventListener('abort', cancelled);
+        const cancelled = () => {
+            cleanup();
+            reject(new DOMException('File operation cancelled', 'AbortError'));
+        };
+        if (signal.aborted)
+            cancelled();
+        else
+            signal.addEventListener('abort', cancelled, { once: true });
+        operation.then((result) => {
+            cleanup();
+            if (signal.aborted)
+                cancelled();
+            else
+                resolve(result);
+        }, (error) => {
+            cleanup();
+            reject(error);
+        });
+    });
+}
+export async function resolveFile(adapter, reference, context) {
+    abort(context.signal);
+    const presentation = await withFileSignal(adapter.resolve(Object.freeze({ ...reference }), context), context.signal);
+    abort(context.signal);
+    if (!presentation ||
+        typeof presentation !== 'object' ||
+        !['image', 'audio', 'video', 'pdf', 'file', 'missing', 'error'].includes(presentation.kind))
+        throw new TypeError('File adapter returned an unsupported presentation');
+    if (presentation.label !== undefined &&
+        typeof presentation.label !== 'string')
+        throw new TypeError('File presentation label must be text');
+    if (presentation.kind === 'error' && typeof presentation.message !== 'string')
+        throw new TypeError('File presentation error must include a message');
+    if ('url' in presentation) {
+        if (typeof presentation.url !== 'string' || !presentation.url.trim())
+            throw new TypeError('File presentation needs a resource URL');
+        const url = new URL(presentation.url, document.baseURI);
+        if (['javascript:', 'vbscript:'].includes(url.protocol))
+            throw new TypeError('Executable file presentation URLs are not supported');
+        const prefix = presentation.kind === 'pdf' ? 'application/pdf' : `${presentation.kind}/`;
+        const mime = presentation.mimeType?.toLowerCase().split(';')[0]?.trim();
+        if (mime &&
+            (presentation.kind === 'pdf' ? mime !== prefix : !mime.startsWith(prefix)))
+            throw new TypeError('File presentation MIME type does not match its kind');
+        const dataMime = url.pathname.toLowerCase().split(/[;,]/)[0] ?? '';
+        if (url.protocol === 'data:' &&
+            (presentation.kind === 'pdf'
+                ? dataMime !== prefix
+                : !dataMime.startsWith(prefix)))
+            throw new TypeError('File presentation data URL does not match its kind');
+    }
+    else if (['image', 'audio', 'video', 'pdf'].includes(presentation.kind)) {
+        throw new TypeError('File presentation needs a resource URL');
+    }
+    return Object.freeze({ ...presentation });
+}
+export class FileResolution {
+    runtime;
+    changed;
+    state = { status: 'idle' };
+    reference;
+    key = '';
+    request;
+    dead = false;
+    constructor(runtime, changed) {
+        this.runtime = runtime;
+        this.changed = changed;
+    }
+    update(reference) {
+        const key = JSON.stringify([
+            reference.reference,
+            reference.kind,
+            reference.fragment,
+        ]);
+        this.reference = Object.freeze({ ...reference });
+        if (this.key === key && this.request?.isCurrent())
+            return;
+        this.key = key;
+        this.retry();
+    }
+    retry() {
+        this.cancel();
+        if (this.dead || !this.reference || !this.runtime.active())
+            return;
+        const captured = this.runtime.capture();
+        const request = {
+            controller: new AbortController(),
+            isCurrent: captured.isCurrent,
+        };
+        this.request = request;
+        this.state = { status: 'loading' };
+        this.changed();
+        void resolveFile(this.runtime.adapter, this.reference, {
+            ...captured.context,
+            signal: request.controller.signal,
+        }).then((presentation) => {
+            if (!this.current(request))
+                return;
+            this.state = { status: 'resolved', presentation };
+            this.changed();
+        }, (failure) => {
+            if (!this.current(request))
+                return;
+            const error = failure instanceof Error ? failure : new Error(String(failure));
+            this.state = { status: 'failed', error };
+            this.changed();
+            this.runtime.error?.(error);
+        });
+    }
+    current(request) {
+        return (!this.dead &&
+            this.request === request &&
+            !request.controller.signal.aborted &&
+            this.runtime.active() &&
+            request.isCurrent());
+    }
+    cancel() {
+        this.request?.controller.abort();
+        this.request = undefined;
+        this.state = { status: 'idle' };
+    }
+    destroy() {
+        this.dead = true;
+        this.cancel();
+    }
+}

package/dist/images.d.ts

@@ -1,6 +1,7 @@
 import type { Node as ProseNode } from '@milkdown/kit/prose/model';
 import type { EditorView, NodeView } from '@milkdown/kit/prose/view';
 import type { ImageAdapter } from './types.js';
+import { type FileViewRuntime } from './files.js';
 /** A width rides in the alt text, as `![a picture|400](images/….png)`. Other Markdown readers
  *  show the picture and keep the number without requiring a private extension. */
 export declare function splitAlt(alt: string): {
@@ -8,26 +9,41 @@ export declare function splitAlt(alt: string): {
     width: number | null;
 };
 export declare function joinAlt(alt: string, width: number | null): string;
-/** Draws the image and the handle that sizes it. The width is kept in the alt text, so the schema is the
- *  one commonmark gives us; a picture is never wider than its editor, whatever number the alt text holds. */
 declare class ImageView implements NodeView {
     private node;
     private readonly view;
     private readonly getPos;
     private readonly adapter;
+    private readonly runtime?;
+    private readonly canMutate;
     dom: HTMLElement;
     private image?;
+    private media?;
+    private pdf?;
     private width;
     private stopResize?;
-    constructor(node: ProseNode, view: EditorView, getPos: () => number | undefined, adapter: ImageAdapter | undefined);
+    private resolution?;
+    private previewFailed;
+    constructor(node: ProseNode, view: EditorView, getPos: () => number | undefined, adapter: ImageAdapter | undefined, runtime?: FileViewRuntime | undefined, canMutate?: () => boolean);
+    private reference;
+    private active;
     update(node: ProseNode): boolean;
     stopEvent(event: Event): boolean;
     ignoreMutation(): boolean;
+    private mediaPolicy;
     private cancelResize;
+    private releaseMedia;
     destroy(): void;
+    private button;
+    private activate;
+    private report;
+    private card;
+    private failPreview;
     private render;
+    private renderImage;
     private startResize;
     private commit;
+    private canResize;
 }
-export declare function imageView(adapter?: ImageAdapter): import("@milkdown/kit/utils").$View<import("@milkdown/kit/utils").$Node, (node: ProseNode, view: EditorView, getPos: () => number | undefined) => ImageView>;
+export declare function imageView(adapter?: ImageAdapter, runtime?: FileViewRuntime, canMutate?: () => boolean): import("@milkdown/kit/utils").$View<import("@milkdown/kit/utils").$Node, (node: ProseNode, view: EditorView, getPos: () => number | undefined) => ImageView>;
 export {};