@aardarch/aardink-web 0.5.0 → 0.6.0-rc2

package/README.md

@@ -1,86 +1,110 @@
-# @aardarch/aardink-web
-
-The [Aardink](https://github.com/aardarch/aardink) code editor for the browser: Compose
-Multiplatform compiled to WebAssembly, behind a small Monaco-shaped API. It covers syntax
-highlighting for Kotlin, TypeScript, JSON, TOML, XML, HTML, CSS and Markdown, plus folding,
-find and replace, diagnostics, undo/redo and six themes.
-
-## Install
-
-```sh
-pnpm add @aardarch/aardink-web     # or: npm install @aardarch/aardink-web
-```
-
-The package is plain ES modules plus two `.wasm` files and a font. It needs a bundler that
-understands `new URL('./file', import.meta.url)`, which Vite, webpack 5 and Rollup all do.
-
-## Use
-
-```ts
-import { createEditor, preloadAardink } from '@aardarch/aardink-web';
-
-preloadAardink(); // optional: start loading the WebAssembly module early
-
-const editor = await createEditor(document.getElementById('editor')!, (text) => save(text), {
-  value: source,
-  language: 'xml',
-  theme: 'vscode-dark',
-  wordWrap: 'on',
-});
-
-editor.updateOptions({ readOnly: true });
-editor.setDiagnostics([
-  { line: 3, startColumn: 5, endColumn: 9, message: 'Unknown tag', severity: 'error' },
-]);
-const stop = editor.onDidChangeCursor((line, column) => showPosition(line, column));
-editor.dispose();
-```
-
-The editor fills its container, so give the container a size. `createEditor` is async because
-the first call loads the WebAssembly module (about 13 MB, 4.7 MB gzipped); every editor on the
-page shares that one module. See [`index.d.ts`](./index.d.ts) for the full API.
-
-## Vite
-
-```js
-// vite.config.js
-import { defineConfig } from 'vite';
-
-export default defineConfig({
-  // The dev-server pre-bundler would move the package into .vite/deps and break the
-  // new URL(..., import.meta.url) references the loader relies on.
-  optimizeDeps: { exclude: ['@aardarch/aardink-web'] },
-  build: { target: 'es2022', chunkSizeWarningLimit: 3500 },
-});
-```
-
-`vite build` prints two harmless warnings about `node:fs` and `node:url` being externalised:
-the Kotlin loader has Node and Deno branches that never run in a browser. Serve `.wasm` with
-`Content-Type: application/wasm`.
-
-## Browser support
-
-Chrome and Edge 119+, Firefox 120+, Safari 18.2+: the module needs WebAssembly garbage
-collection and exception handling.
-
-## Known limitations
-
-Read these before adopting the package; the
-[integration guide](https://github.com/aardarch/aardink/blob/main/docs/WEB_INTEGRATION.md) has
-the measurements and the device checklist.
-
-- **Typing latency grows with document size, and fast typing can lose keys in large files.**
-  Up to a few hundred lines of highlighted code it is comfortable. At 1,000 lines each keystroke
-  keeps the editor busy for about half a second, and typing at 10 keys a second can drop around
-  half the keys. At 5,000 lines each keystroke keeps it busy for several seconds. 0.5.x is for
-  small files such as configuration or markup documents; a virtualised renderer that fixes this
-  is planned for 0.6.0.
-- **A disposed editor is not fully released** (about 275 KB each), because Compose
-  Multiplatform cannot yet tear down its viewport. Reuse one editor with `setValue` and
-  `updateOptions` rather than mounting one per view.
-- There is no minimap, bracket-pair colouring or multi-cursor yet.
-
-## Licence
-
-Apache-2.0. The bundled JetBrains Mono font is under the SIL Open Font License 1.1; see
-`JETBRAINS_MONO_OFL.txt`.
+# @aardarch/aardink-web
+
+The [Aardink](https://github.com/aardarch/aardink) code editor for the browser: Compose
+Multiplatform compiled to WebAssembly, behind a small Monaco-shaped API. It highlights Kotlin,
+TypeScript, JSON, TOML, XML, HTML, CSS and Markdown, and any language you register as a Monarch
+grammar. It has folding, find and replace, diagnostics, undo and redo, multiple cursors and column
+selection, bracket-pair colours, a minimap and sticky scroll, and six themes. It draws only the
+lines on screen, so a keystroke costs the same in a 5,000-line file as in a 50-line one.
+
+## Install
+
+```sh
+pnpm add @aardarch/aardink-web     # or: npm install @aardarch/aardink-web
+pnpm add @aardarch/aardink-web@next   # the latest pre-release
+```
+
+The package is plain ES modules plus two `.wasm` files and a font. It needs a bundler that
+understands `new URL('./file', import.meta.url)`, which Vite, webpack 5 and Rollup all do. Each
+version is published from GitHub Actions with npm provenance.
+
+## Use
+
+```ts
+import { createEditor, preloadAardink } from '@aardarch/aardink-web';
+
+preloadAardink(); // optional: start loading the WebAssembly module and the font early
+
+const editor = await createEditor(document.getElementById('editor')!, (text) => save(text), {
+  value: source,
+  language: 'xml',
+  theme: 'vscode-dark',
+  wordWrap: 'on',
+  minimap: { enabled: true },
+});
+
+editor.updateOptions({ readOnly: true });
+editor.setDiagnostics([
+  { line: 3, startColumn: 5, endColumn: 9, message: 'Unknown tag', severity: 'error' },
+]);
+const stop = editor.onDidChangeCursor((line, column) => showPosition(line, column));
+// The language's own diagnostics (shown until you call setDiagnostics; null goes back to them).
+const off = editor.onDidChangeDiagnostics((markers) => showProblems(markers));
+const savedAt = editor.getAlternativeVersionId(); // unsaved while it differs
+editor.dispose();
+```
+
+A language of your own is a Monarch grammar registered before use, optionally extending a built-in
+language's completions, diagnostics and folding, with Monaco's `defineTheme` for its colours:
+
+```ts
+import { defineTheme, registerLanguage } from '@aardarch/aardink-web';
+
+await registerLanguage(
+  { id: 'toy', extends: 'xml', grammar: { tokenizer: { root: [[/\bshout\b/, 'keyword']] } } },
+  { provideCompletionItems: (text, line, column) => [{ label: 'shout', kind: 'element' }] },
+);
+await defineTheme('toy-dark', { base: 'vs-dark', inherit: true, rules: [{ token: 'keyword', foreground: 'ff00ff' }] });
+```
+
+The editor fills its container, so give the container a size. `createEditor` is async because
+the first call loads the WebAssembly module (about 13 MB, 4.7 MB gzipped); every editor on the
+page shares that one module. See [`index.d.ts`](./index.d.ts) for the full API, and the
+[integration guide](https://github.com/aardarch/aardink/blob/main/docs/WEB_INTEGRATION.md) for how
+Monaco's options and calls map onto it.
+
+## Vite
+
+```js
+// vite.config.js
+import { defineConfig } from 'vite';
+
+export default defineConfig({
+  // The dev-server pre-bundler would move the package into .vite/deps and break the
+  // new URL(..., import.meta.url) references the loader relies on.
+  optimizeDeps: { exclude: ['@aardarch/aardink-web'] },
+  build: { target: 'es2022', chunkSizeWarningLimit: 3500 },
+});
+```
+
+`vite build` prints two harmless warnings about `node:fs` and `node:url` being externalised:
+the Kotlin loader has Node and Deno branches that never run in a browser. Serve `.wasm` with
+`Content-Type: application/wasm`.
+
+## The page
+
+- Mount an editor where it stays: do not move its container to another place in the DOM, as a
+  Svelte `{#key}` block or a React portal can. Dispose it and mount a new one instead.
+- On phones, `<meta name="viewport" content="width=device-width, initial-scale=1, interactive-widget=resizes-content">`
+  keeps the editor above the soft keyboard.
+
+## Browser support
+
+Chrome and Edge 119+, Firefox 120+, Safari 18.2+: the module needs WebAssembly garbage
+collection and exception handling.
+
+## Known limitations
+
+Read these before adopting the package; the
+[integration guide](https://github.com/aardarch/aardink/blob/main/docs/WEB_INTEGRATION.md) has
+the measurements and the device checklist.
+
+- **A disposed editor is not fully released** (about 275 KB each) until Aardink moves to Compose
+  Multiplatform 1.13. Reuse one editor with `setValue` and `updateOptions` rather than mounting
+  one per view.
+- A theme rule's `background` is ignored; its `foreground` and `fontStyle` apply.
+
+## Licence
+
+Apache-2.0. The bundled JetBrains Mono font is under the SIL Open Font License 1.1; see
+`JETBRAINS_MONO_OFL.txt`.

package/index.d.ts

@@ -29,6 +29,20 @@ export interface AardinkOptions {
   showGutter?: boolean;
   showLineNumbers?: boolean;
   showFoldMarkers?: boolean;
+  /** Width of an indent, in spaces. 4 by default. */
+  tabSize?: number;
+  /** Tab indents with spaces rather than a tab character. On by default. */
+  insertSpaces?: boolean;
+  /** Monaco's `renderLineHighlight`: anything but `'none'` highlights each caret's line. */
+  renderLineHighlight?: 'none' | 'line' | 'gutter' | 'all';
+  /** Which spaces and tabs are drawn, as dots and arrows. `'selection'` by default. */
+  renderWhitespace?: 'none' | 'boundary' | 'selection' | 'trailing' | 'all';
+  /** Colours brackets by nesting depth. On by default. */
+  bracketPairColorization?: { enabled?: boolean } | boolean;
+  /** A picture of the whole text at the side, with a slider over what is shown. Off by default. */
+  minimap?: { enabled?: boolean } | boolean;
+  /** The first lines of the blocks the top of the view is inside stay pinned at the top. Off by default. */
+  stickyScroll?: { enabled?: boolean } | boolean;
 }
 
 /** Monaco-marker shape: 1-based line and columns, `endColumn` exclusive. */
@@ -40,24 +54,144 @@ export interface AardinkDiagnostic {
   severity: 'error' | 'warning' | 'info';
 }
 
+/** Monaco's `Selection`: from where it started to where the caret is, 1-based, with the range from start to end. */
+export interface AardinkSelection {
+  selectionStartLineNumber: number;
+  selectionStartColumn: number;
+  positionLineNumber: number;
+  positionColumn: number;
+  readonly startLineNumber?: number;
+  readonly startColumn?: number;
+  readonly endLineNumber?: number;
+  readonly endColumn?: number;
+}
+
+/** What a content change was, as Monaco's `IModelContentChangedEvent` says it. */
+export interface AardinkContentChange {
+  /** Goes up with every change. */
+  versionId: number;
+  isUndoing: boolean;
+  isRedoing: boolean;
+  /** The whole text was replaced (`setValue`). */
+  isFlush: boolean;
+}
+
 export interface AardinkEditor {
   getValue(): string;
   /** Replaces the whole text and clears undo history. Fires the change listeners. */
   setValue(text: string): void;
   updateOptions(options: Partial<AardinkOptions>): void;
-  /** Full text after every change, at most once per frame. Returns an unsubscribe function. */
-  onDidChangeContent(listener: (text: string) => void): () => void;
+  /** Full text after every change, at most once per frame, and what the change was. Returns an unsubscribe function. */
+  onDidChangeContent(listener: (text: string, change: AardinkContentChange) => void): () => void;
   /** 1-based caret position. Returns an unsubscribe function. */
   onDidChangeCursor(listener: (line: number, column: number) => void): () => void;
-  setDiagnostics(diagnostics: AardinkDiagnostic[]): void;
+  /**
+   * Shows these diagnostics in place of the language's own; `null` goes back to the language's
+   * own. Either way they move along with the text as it is edited, until the next list.
+   */
+  setDiagnostics(diagnostics: AardinkDiagnostic[] | null): void;
+  /**
+   * The language's own diagnostics each time they are collected: 500 ms after the editor appears,
+   * and after each pause in typing. Not called while a list from `setDiagnostics` is shown.
+   * Returns an unsubscribe function.
+   */
+  onDidChangeDiagnostics(listener: (diagnostics: AardinkDiagnostic[]) => void): () => void;
   revealPosition(line: number, column: number): void;
   showFind(): void;
   undo(): boolean;
   redo(): boolean;
+  canUndo(): boolean;
+  canRedo(): boolean;
+  /** Ends the current undo step, so the next edit starts a new one. */
+  pushUndoStop(): void;
+  /** Comes back when undo returns the text to an earlier state: keep it on save, and the text is unsaved while it differs. */
+  getAlternativeVersionId(): number;
+  /** The text the diff lane in the gutter compares with, typically what was last saved; `''` turns it off. */
+  setBaseline(text: string): void;
+  /** Formats the document with the language's formatter, as one undo step; resolves with whether anything changed. */
+  format(): Promise<boolean>;
+  focus(): void;
+  /** Every selection, the primary one first. */
+  getSelections(): AardinkSelection[];
+  /** Replaces the selections; the first becomes the primary one. */
+  setSelections(selections: AardinkSelection[]): void;
   /** Stops the editor. Safe to call twice. Remove or reuse the container yourself. */
   dispose(): void;
 }
 
+/** A language highlighted by a grammar, for `registerLanguage`. */
+export interface AardinkLanguageDefinition {
+  /** What `createEditor`'s `language` option names it by. Registering an id again replaces it. */
+  id: string;
+  /**
+   * A subset of Monaco's Monarch: states in `tokenizer` (`root` first), rules of
+   * `[regex, action, next?]`, `cases` with `@array`/`@default`/`@eos`, capture groups (each
+   * with a token name, `{ token, next }` or `cases` of its own), `include`, `@rematch`,
+   * `defaultToken`, `ignoreCase`, `tokenPostfix`. RegExp literals are fine. Lookbehind is not
+   * supported, and is refused.
+   */
+  grammar: object;
+  /** A built-in or registered language whose completions, diagnostics, hover and folding this one takes too, e.g. `'xml'`. */
+  extends?: string;
+  displayName?: string;
+  extensions?: string[];
+  /** As in Monaco's language configuration: what Ctrl/Cmd+/ comments with. */
+  comments?: { lineComment?: string; blockComment?: [string, string] };
+}
+
+/** Monaco's flags for a completion's `insertText`. */
+export declare const CompletionItemInsertTextRule: {
+  readonly None: 0;
+  /** Insert the snippet's whitespace as written, rather than indented as the line it lands on. */
+  readonly KeepWhitespace: 1;
+  /** `insertText` is a snippet: `$1`, `${1:placeholder}` and `${1|a,b|}` are tab stops, `$0` the final caret. */
+  readonly InsertAsSnippet: 4;
+};
+
+export interface AardinkCompletionItem {
+  label: string;
+  /** What accepting it types; the label when absent. A snippet with `InsertAsSnippet`. */
+  insertText?: string;
+  /** `CompletionItemInsertTextRule` flags, as in Monaco. */
+  insertTextRules?: number;
+  kind?: 'element' | 'attribute' | 'value' | 'snippet' | 'module' | 'property';
+  detail?: string;
+  documentation?: string;
+}
+
+/**
+ * What a registered language knows beyond its grammar. Each gets the whole text and, where it
+ * asks about a place, a 1-based line and column; each may answer at once or with a Promise. With
+ * `extends`, the built-in language's answers come after these.
+ */
+export interface AardinkLanguageProviders {
+  provideCompletionItems?(text: string, line: number, column: number): AardinkCompletionItem[] | null | Promise<AardinkCompletionItem[] | null>;
+  provideHover?(text: string, line: number, column: number): { title?: string; contents: string } | null | Promise<{ title?: string; contents: string } | null>;
+  provideDiagnostics?(text: string): AardinkDiagnostic[] | Promise<AardinkDiagnostic[]>;
+}
+
+/** Adds a language for `createEditor`'s `language` option. Rejects with what is wrong with the definition. */
+export function registerLanguage(definition: AardinkLanguageDefinition, providers?: AardinkLanguageProviders): Promise<void>;
+
+/**
+ * Monaco's `defineTheme` data. Token rules name tokens as Monaco does, and the longest matching
+ * prefix wins: `tag` also colours `tag.aardflex`, `comment.doc` only documentation comments. A
+ * rule's `fontStyle` (`'bold'`, `'italic'`, `'underline'`, `'strikethrough'`, or `''` for none)
+ * applies too; its `background` is accepted, so Monaco theme data passes as it is, and ignored.
+ */
+export interface AardinkThemeData {
+  base: 'vs' | 'vs-dark' | 'hc-black' | 'hc-light';
+  inherit?: boolean;
+  rules: { token: string; foreground?: string; fontStyle?: string; background?: string }[];
+  colors?: Record<string, string>;
+}
+
+/** Adds a theme for `createEditor`'s `theme` option: Monaco's `defineTheme` data, or a VS Code theme's JSON. */
+export function registerTheme(name: string, theme: AardinkThemeData | object): Promise<void>;
+
+/** Monaco's name for `registerTheme`. */
+export const defineTheme: typeof registerTheme;
+
 /**
  * Mounts an editor that fills `container`. Loads the WebAssembly module on first use (see
  * `preloadAardink`). `onChange` is registered as the first content listener.
@@ -68,6 +202,9 @@ export function createEditor(
   options?: AardinkOptions,
 ): Promise<AardinkEditor>;
 
+/** For debugging a grammar: the tokens of `text` in `languageId`, per line, as Monaco's `tokenize` gives them. */
+export function tokenize(text: string, languageId: string): Promise<{ offset: number; type: string }[][]>;
+
 /** Starts loading the WebAssembly module without mounting anything. */
 export function preloadAardink(): Promise<void>;
 

package/index.js

@@ -17,7 +17,10 @@
 // Adapts the Kotlin module's integer-handle exports (aardinkCreate, aardinkGetValue, ...) into
 // the Monaco-shaped object described in index.d.ts.
 
-export const version = '0.5.0';
+export const version = '0.6.0-rc2';
+
+/** Monaco's flags for a completion's `insertText`. */
+export const CompletionItemInsertTextRule = Object.freeze({ None: 0, KeepWhitespace: 1, InsertAsSnippet: 4 });
 
 let kotlinModule;
 
@@ -35,18 +38,121 @@ function load() {
 }
 
 export function preloadAardink() {
-  return load().then(() => undefined);
+  // The font too: an editor waits up to half a second for it rather than showing in another first.
+  return load().then((k) => k.aardinkPreloadFont());
 }
 
 let generatedIds = 0;
 
-/** Keeps only the fields the Kotlin side knows, translating Monaco's wordWrap 'on'/'off'. */
+/** A selection with Monaco's range fields too: start is whichever end comes first. */
+function withRange(s) {
+  const forward = s.selectionStartLineNumber < s.positionLineNumber ||
+    (s.selectionStartLineNumber === s.positionLineNumber && s.selectionStartColumn <= s.positionColumn);
+  return {
+    ...s,
+    startLineNumber: forward ? s.selectionStartLineNumber : s.positionLineNumber,
+    startColumn: forward ? s.selectionStartColumn : s.positionColumn,
+    endLineNumber: forward ? s.positionLineNumber : s.selectionStartLineNumber,
+    endColumn: forward ? s.positionColumn : s.selectionStartColumn,
+  };
+}
+
+/** For debugging a grammar: the tokens of `text` in `languageId`, per line, as Monaco's tokenize gives them. */
+export async function tokenize(text, languageId) {
+  const k = await load();
+  return JSON.parse(k.aardinkTokenize(languageId, text));
+}
+
+/**
+ * A Monarch grammar as JSON: RegExp literals (/.../) become their source, as the Kotlin side reads
+ * regexes from strings; everything else is kept.
+ */
+function monarchToJson(value) {
+  if (value instanceof RegExp) return value.source;
+  if (Array.isArray(value)) return value.map(monarchToJson);
+  if (value && typeof value === 'object') {
+    return Object.fromEntries(Object.entries(value).map(([key, item]) => [key, monarchToJson(item)]));
+  }
+  return value;
+}
+
+/** A provider's answer (a value or a Promise of one) as the Promise of JSON the Kotlin side awaits. */
+function answer(provider, ...args) {
+  if (!provider) return Promise.resolve(null);
+  return Promise.resolve()
+    .then(() => provider(...args))
+    .then((value) => (value == null ? null : JSON.stringify(value)));
+}
+
+/**
+ * Adds a language highlighted by a Monarch grammar, for createEditor's `language` option. See
+ * index.d.ts for the definition and the providers.
+ */
+export async function registerLanguage(definition, providers = {}) {
+  const k = await load();
+  const grammar = monarchToJson(definition.grammar ?? {});
+  if (definition.comments) grammar.comments = definition.comments;
+  const error = k.aardinkRegisterLanguage(
+    JSON.stringify({
+      id: definition.id,
+      extends: definition.extends,
+      displayName: definition.displayName,
+      extensions: definition.extensions,
+      grammar,
+    }),
+    (text, line, column) => answer(providers.provideCompletionItems, text, line, column),
+    (text, line, column) => answer(providers.provideHover, text, line, column),
+    (text) => answer(providers.provideDiagnostics, text),
+  );
+  if (error) throw new Error(`Aardink: ${error}`);
+}
+
+/** Monaco's defineTheme data ({ base, inherit, rules, colors }) as VS Code theme JSON; VS Code JSON as it is. */
+function toVsCodeTheme(theme) {
+  if (!theme.rules) return theme;
+  const base = { vs: 'vscode-light', 'hc-light': 'vscode-light' }[theme.base] ?? 'vscode-dark';
+  return {
+    type: base === 'vscode-light' ? 'light' : 'dark',
+    base: theme.inherit === false ? undefined : base,
+    colors: theme.colors ?? {},
+    // A rule's colour and font style; its background is not drawn.
+    tokenColors: theme.rules
+      .filter((rule) => rule.foreground || rule.fontStyle !== undefined)
+      .map((rule) => ({
+        scope: rule.token,
+        settings: {
+          ...(rule.foreground ? { foreground: `#${rule.foreground.replace(/^#/, '')}` } : {}),
+          ...(rule.fontStyle !== undefined ? { fontStyle: rule.fontStyle } : {}),
+        },
+      })),
+  };
+}
+
+/** Adds a theme for createEditor's `theme` option, from Monaco's defineTheme data or VS Code theme JSON. */
+export async function registerTheme(name, theme) {
+  const k = await load();
+  const error = k.aardinkRegisterTheme(name, JSON.stringify(toVsCodeTheme(theme)));
+  if (error) throw new Error(`Aardink: ${error}`);
+}
+
+/** Monaco's name for registerTheme. */
+export const defineTheme = registerTheme;
+
+/**
+ * Keeps only the fields the Kotlin side knows, translating Monaco's wordWrap 'on'/'off' and its
+ * { enabled } objects for minimap and stickyScroll (a plain boolean works too).
+ */
 function toKotlinOptions(options) {
   const out = {};
-  for (const key of ['language', 'theme', 'fontSize', 'readOnly', 'showGutter', 'showLineNumbers', 'showFoldMarkers']) {
+  for (const key of ['language', 'theme', 'fontSize', 'readOnly', 'showGutter', 'showLineNumbers', 'showFoldMarkers', 'tabSize', 'insertSpaces', 'highlightCurrentLine', 'renderWhitespace']) {
     if (options[key] !== undefined) out[key] = options[key];
   }
   if (options.wordWrap !== undefined) out.wordWrap = options.wordWrap === 'on';
+  if (options.renderLineHighlight !== undefined) out.highlightCurrentLine = options.renderLineHighlight !== 'none';
+  for (const key of ['minimap', 'stickyScroll', 'bracketPairColorization']) {
+    const value = options[key];
+    if (value !== undefined) out[key] = typeof value === 'object' && value !== null ? value.enabled !== false : !!value;
+  }
   return out;
 }
 
@@ -58,8 +164,17 @@ export async function createEditor(container, onChange, options = {}) {
   // The Kotlin side holds one listener of each kind; fan out to any number here.
   const contentListeners = new Set();
   const cursorListeners = new Set();
-  k.aardinkOnChange(id, (text) => contentListeners.forEach((listener) => listener(text)));
+  const diagnosticsListeners = new Set();
+  k.aardinkOnContentChange(id, (text, versionId, kind) => {
+    const event = { versionId, isUndoing: kind === 'undo', isRedoing: kind === 'redo', isFlush: kind === 'flush' };
+    contentListeners.forEach((listener) => listener(text, event));
+  });
   k.aardinkOnCursorChange(id, (line, column) => cursorListeners.forEach((listener) => listener(line, column)));
+  k.aardinkOnDiagnosticsChange(id, (json) => {
+    if (diagnosticsListeners.size === 0) return;
+    const diagnostics = JSON.parse(json);
+    diagnosticsListeners.forEach((listener) => listener(diagnostics));
+  });
   if (onChange) contentListeners.add(onChange);
 
   let disposed = false;
@@ -76,8 +191,30 @@ export async function createEditor(container, onChange, options = {}) {
       cursorListeners.add(listener);
       return () => cursorListeners.delete(listener);
     },
-    setDiagnostics: (diagnostics) => k.aardinkSetDiagnostics(id, JSON.stringify(diagnostics)),
+    setDiagnostics: (diagnostics) => k.aardinkSetDiagnostics(id, JSON.stringify(diagnostics ?? null)),
+    onDidChangeDiagnostics(listener) {
+      diagnosticsListeners.add(listener);
+      return () => diagnosticsListeners.delete(listener);
+    },
     revealPosition: (line, column) => k.aardinkRevealPosition(id, line, column),
+    setBaseline: (text) => k.aardinkSetBaseline(id, text ?? ''),
+    format: () => new Promise((resolve) => k.aardinkFormat(id, resolve)),
+    focus: () => k.aardinkFocus(id),
+    getSelections: () => JSON.parse(k.aardinkGetSelections(id)).map(withRange),
+    setSelections: (selections) =>
+      k.aardinkSetSelections(
+        id,
+        JSON.stringify(selections.map((s) => ({
+          selectionStartLineNumber: s.selectionStartLineNumber,
+          selectionStartColumn: s.selectionStartColumn,
+          positionLineNumber: s.positionLineNumber,
+          positionColumn: s.positionColumn,
+        }))),
+      ),
+    canUndo: () => k.aardinkCanUndo(id),
+    canRedo: () => k.aardinkCanRedo(id),
+    pushUndoStop: () => k.aardinkPushUndoStop(id),
+    getAlternativeVersionId: () => k.aardinkGetAlternativeVersionId(id),
     showFind: () => k.aardinkShowFind(id),
     undo: () => k.aardinkUndo(id),
     redo: () => k.aardinkRedo(id),
@@ -86,6 +223,7 @@ export async function createEditor(container, onChange, options = {}) {
       disposed = true;
       contentListeners.clear();
       cursorListeners.clear();
+      diagnosticsListeners.clear();
       k.aardinkDispose(id);
     },
   };

package/kotlin/aardink-web.import-object.mjs

@@ -149,6 +149,8 @@ const js_code = {
     'kotlin.js.__convertKotlinClosureToJsClosure_1' : (f, trampoline) => getCachedJsObject(f, (p0) => trampoline(f, p0)),
     'kotlin.js.then_$external_fun_1' : (_this, p0, p1) => _this.then(p0, p1),
     'kotlin.js.catch_$external_fun' : (_this, p0) => _this.catch(p0),
+    'kotlin.js.Promise_$external_class_instanceof' : (x) => x instanceof Promise,
+    'kotlin.js.Promise_$external_class_get' : () => Promise,
     'kotlin.random.initialSeed' : () => ((Math.random() * Math.pow(2, 32)) | 0),
     'kotlin.wasm.internal.getJsClassName' : (jsKlass) => jsKlass.name,
     'kotlin.wasm.internal.instanceOf' : (ref, jsKlass) => ref instanceof jsKlass,
@@ -558,8 +560,13 @@ const js_code = {
     'androidx.compose.material3.internal.weakMap_js_code' : () => (new WeakMap()),
     'androidx.compose.material3.internal.set_$external_fun' : (_this, p0, p1) => _this.set(p0, p1),
     'androidx.compose.material3.internal.get_$external_fun' : (_this, p0) => _this.get(p0),
+    'com.aardarch.aardink.platform.readClipboardText' : () => navigator.clipboard.readText(),
     'com.aardarch.aardink.sampleweb.__callJsClosure_((String)->Unit)' : (f, p0) => f(p0),
     'com.aardarch.aardink.sampleweb.__callJsClosure_((Int,Int)->Unit)' : (f, p0, p1) => f(p0, p1),
+    'com.aardarch.aardink.sampleweb.__callJsClosure_((String,Int,Int)->Js)' : (f, p0, p1, p2) => f(p0, p1, p2),
+    'com.aardarch.aardink.sampleweb.__callJsClosure_((String)->Js)' : (f, p0) => f(p0),
+    'com.aardarch.aardink.sampleweb.__callJsClosure_((String,Int,String)->Unit)' : (f, p0, p1, p2) => f(p0, p1, p2),
+    'com.aardarch.aardink.sampleweb.__callJsClosure_((Boolean)->Unit)' : (f, p0) => f(p0),
     'com.aardarch.aardink.sampleweb.usedJsHeapBytes' : () => (performance.memory ? performance.memory.usedJSHeapSize : -1)
 }
 

package/kotlin/aardink-web.mjs

@@ -77,6 +77,7 @@ export { wasmMemory as memory }
 
 export const {
     aardinkSetBundledFontUrl,
+    aardinkPreloadFont,
     aardinkCreate,
     aardinkGetValue,
     aardinkSetValue,
@@ -84,6 +85,20 @@ export const {
     aardinkOnChange,
     aardinkOnCursorChange,
     aardinkSetDiagnostics,
+    aardinkOnDiagnosticsChange,
+    aardinkRegisterLanguage,
+    aardinkRegisterTheme,
+    aardinkOnContentChange,
+    aardinkSetBaseline,
+    aardinkFormat,
+    aardinkFocus,
+    aardinkGetSelections,
+    aardinkSetSelections,
+    aardinkCanUndo,
+    aardinkCanRedo,
+    aardinkPushUndoStop,
+    aardinkGetAlternativeVersionId,
+    aardinkTokenize,
     aardinkRevealPosition,
     aardinkShowFind,
     aardinkUndo,

package/package.json

@@ -1,11 +1,27 @@
 {
   "name": "@aardarch/aardink-web",
-  "version": "0.5.0",
+  "version": "0.6.0-rc2",
   "description": "The Aardink code editor for the browser: Compose Multiplatform on WebAssembly behind a Monaco-shaped API.",
+  "keywords": [
+    "code-editor",
+    "editor",
+    "syntax-highlighting",
+    "monaco",
+    "webassembly",
+    "wasm",
+    "kotlin",
+    "compose-multiplatform"
+  ],
+  "homepage": "https://aardarch.github.io/aardink/",
+  "bugs": {
+    "url": "https://github.com/aardarch/aardink/issues"
+  },
   "license": "Apache-2.0",
+  "author": "Aardarch",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/aardarch/aardink.git"
+    "url": "git+https://github.com/aardarch/aardink.git",
+    "directory": "sample-web"
   },
   "type": "module",
   "main": "index.js",
@@ -20,8 +36,17 @@
     "index.js",
     "index.d.ts",
     "kotlin/",
+    "README.md",
+    "LICENSE",
     "JETBRAINS_MONO_OFL.txt"
   ],
   "sideEffects": false,
+  "engines": {
+    "node": ">=20"
+  },
+  "publishConfig": {
+    "access": "public",
+    "provenance": true
+  },
   "dependencies": { "@js-joda/core": "3.2.0" }
 }