@moloodev/editor-sdk 0.0.0-stage → 0.1.0

package/src/view.ts

@@ -0,0 +1,313 @@
+export { EDITOR_COMMON_CONTRIBUTES } from "./editor-common";
+export * from "./view/hooks";
+export { PortEditorView } from "./view/port-binding";
+export { PortCommandsProvider, bindViewCommands, shortcutForwarder } from "./view/port-commands";
+export { bindThemeClass } from "./view/theme-class";
+
+import {
+  REMOTE_ORIGIN,
+  applyUpdate,
+  createDoc,
+  fromBase64,
+  toBase64,
+  type Doc,
+} from "./crdt";
+import {
+  createEditorChannel,
+  type EditorChannel,
+  type HandshakeResult,
+} from "./channel";
+import type {
+  EditorAccess,
+  EditorEvent,
+  EditorFailure,
+  EditorOperation,
+  EditorRequestType,
+  EditorResponse,
+  EditorSession,
+} from "./index";
+import { EDITOR_IMPORT_BYTES_MAX, parseEditorId, type ChromeManifest } from "./protocol";
+import { editorPort } from "./view/port";
+
+export type EditorViewSnapshot = {
+  session: EditorSession | null;
+  access: EditorAccess | null;
+  theme: "dark" | "light" | null;
+  doc: Doc;
+  /** How many `host.createRequested` events have arrived. */
+  createRequested: number;
+};
+
+type CommandStateBody = Extract<EditorEvent, { type: "command.state" }>["body"];
+
+type ShortcutBody = Extract<EditorEvent, { type: "command.shortcut" }>["body"];
+
+type SubmittedChrome = {
+  keybindings: readonly ShortcutBody[];
+  commandIds: ReadonlySet<string>;
+};
+
+export type EditorViewCall = {
+  [Type in Exclude<EditorRequestType, "doc.append">]: (
+    body: EditorOperation[Type]["body"],
+  ) => Promise<EditorResponse<Type>>;
+};
+
+export type EditorView = {
+  readonly handshake: Promise<HandshakeResult>;
+  getSnapshot(): EditorViewSnapshot;
+  subscribe(listener: () => void): () => void;
+  onImportFile(listener: (file: File) => void): () => void;
+  onCommand(listener: (commandId: string) => void): () => void;
+  sendCommandState(state: CommandStateBody): boolean;
+  sendShortcut(body: ShortcutBody): boolean;
+  close(): void;
+  readonly call: EditorViewCall;
+};
+
+/** `parent` is the `parent` query value. Null means the query is missing. */
+export type EditorViewDeps = {
+  parent: string | null;
+  editorId: string;
+  postMessage(
+    message: unknown,
+    targetOrigin: string,
+    transfer: readonly MessagePort[],
+  ): void;
+  createChannel(): MessageChannel;
+};
+
+function absoluteHttpOrigin(parent: string | null): string | undefined {
+  if (parent === null || parent.length === 0) return undefined;
+  let url: URL;
+  try {
+    url = new URL(parent);
+  } catch {
+    return undefined;
+  }
+  if (url.protocol !== "http:" && url.protocol !== "https:") return undefined;
+  if (url.origin !== parent) return undefined;
+  return parent;
+}
+
+function submittedChrome(manifest: ChromeManifest): SubmittedChrome {
+  const commandIds = new Set<string>();
+  for (const command of manifest.contributes?.commands ?? []) {
+    commandIds.add(command.id);
+  }
+  return {
+    commandIds,
+    keybindings: (manifest.contributes?.keybindings ?? []).map((binding) => ({
+      ...binding,
+    })),
+  };
+}
+
+function closedResponse(): EditorFailure {
+  return { v: 1, id: "view:0", ok: false, code: "closed" };
+}
+
+function unexpected(event: never): never {
+  throw new Error(`unexpected editor event: ${JSON.stringify(event)}`);
+}
+
+export function connectEditorView(deps: EditorViewDeps): EditorView {
+  const doc = createDoc();
+  let snapshot: EditorViewSnapshot = {
+    session: null,
+    access: null,
+    theme: null,
+    doc,
+    createRequested: 0,
+  };
+  const listeners = new Set<() => void>();
+  const importFileListeners = new Set<(file: File) => void>();
+  const pendingImportFiles: File[] = [];
+  const commandListeners = new Set<(commandId: string) => void>();
+  let submitted: SubmittedChrome | null = null;
+  let stopped = false;
+  let channel: EditorChannel | undefined;
+
+  function publish(next: EditorViewSnapshot) {
+    if (stopped) return;
+    snapshot = next;
+    for (const listener of [...listeners]) listener();
+  }
+
+  function onDocUpdate(update: Uint8Array, origin: unknown) {
+    if (stopped || origin === REMOTE_ORIGIN) return;
+    const open = channel;
+    const asset = snapshot.session?.asset;
+    if (!open || !asset) return;
+    void open.request("doc.append", {
+      assetId: asset.id,
+      update: toBase64(update),
+    });
+  }
+  doc.on("update", onDocUpdate);
+
+  function applyRemote(update: string) {
+    try {
+      applyUpdate(doc, fromBase64(update), REMOTE_ORIGIN);
+    } catch {
+      return;
+    }
+    publish({ ...snapshot });
+  }
+
+  function onEvent(event: EditorEvent) {
+    if (stopped) return;
+    switch (event.type) {
+      case "file.import": {
+        const bytes = fromBase64(event.body.data);
+        if (bytes.byteLength > EDITOR_IMPORT_BYTES_MAX) return;
+        const file = new File([new Uint8Array(bytes)], event.body.name);
+        if (importFileListeners.size === 0) pendingImportFiles.push(file);
+        else for (const listener of [...importFileListeners]) listener(file);
+        return;
+      }
+      case "access":
+        publish({ ...snapshot, access: event.body });
+        return;
+      case "theme":
+        publish({ ...snapshot, theme: event.body.theme });
+        return;
+      case "session":
+        publish({ ...snapshot, session: event.body });
+        return;
+      case "doc.update":
+        if (event.body.assetId !== snapshot.session?.asset?.id) return;
+        applyRemote(event.body.update);
+        return;
+      case "host.createRequested":
+        publish({
+          ...snapshot,
+          createRequested: snapshot.createRequested + 1,
+        });
+        return;
+      case "command.invoke":
+        if (!submitted?.commandIds.has(event.body.commandId)) return;
+        for (const listener of [...commandListeners]) {
+          listener(event.body.commandId);
+        }
+        return;
+      case "command.shortcut":
+      case "command.state":
+        return;
+      default:
+        unexpected(event);
+    }
+  }
+
+  function request<Type extends EditorRequestType>(
+    type: Type,
+    body: EditorOperation[Type]["body"],
+  ): Promise<EditorResponse<Type>> {
+    if (!channel) return Promise.resolve(closedResponse());
+    return channel.request(type, body);
+  }
+
+  const call = {
+    "layout.load": (body) => request("layout.load", body),
+    "layout.save": (body) => request("layout.save", body),
+    "asset.rename": (body) => request("asset.rename", body),
+    "asset.read": (body) => request("asset.read", body),
+    "asset.list": (body) => request("asset.list", body),
+    "asset.listRevisions": (body) => request("asset.listRevisions", body),
+    "asset.getComposition": (body) => request("asset.getComposition", body),
+    "asset.getPublication": (body) => request("asset.getPublication", body),
+    "asset.confirmBundle": (body) => request("asset.confirmBundle", body),
+    "asset.putPublication": (body) => request("asset.putPublication", body),
+    "host.pick": (body) => request("host.pick", body),
+    "host.openAsset": (body) => request("host.openAsset", body),
+    "host.openInfo": (body) => request("host.openInfo", body),
+    "host.start": (body) => request("host.start", body),
+    "host.openBrowser": (body) => request("host.openBrowser", body),
+    "host.clipboardWrite": (body) => request("host.clipboardWrite", body),
+    "host.download": (body) => request("host.download", body),
+    "host.openPopup": (body) => request("host.openPopup", body),
+    "host.render": (body) => request("host.render", body),
+    "chrome.submit": async (body) => {
+      const response = await request("chrome.submit", body);
+      if (!response.ok) return response;
+      submitted = submittedChrome(body);
+      return response;
+    },
+  } satisfies EditorViewCall;
+
+  const origin = absoluteHttpOrigin(deps.parent);
+  const editor = parseEditorId(deps.editorId, true);
+  const handshake: Promise<HandshakeResult> =
+    origin === undefined || editor === undefined
+      ? Promise.resolve({ ok: false, code: "rejected" })
+      : open(origin);
+
+  function open(parentOrigin: string): Promise<HandshakeResult> {
+    const ports = deps.createChannel();
+    deps.postMessage(
+      { v: 1, type: "session.open", body: { editorId: deps.editorId } },
+      parentOrigin,
+      [ports.port1],
+    );
+    channel = createEditorChannel({
+      role: "view",
+      editorId: deps.editorId,
+      port: editorPort(ports.port2),
+      onEvent,
+    });
+    return channel.handshake;
+  }
+
+  return {
+    handshake,
+    getSnapshot() {
+      return snapshot;
+    },
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => {
+        listeners.delete(listener);
+      };
+    },
+    onImportFile(listener) {
+      if (stopped) return () => {};
+      importFileListeners.add(listener);
+      for (const file of pendingImportFiles.splice(0)) listener(file);
+      return () => { importFileListeners.delete(listener); };
+    },
+    onCommand(listener) {
+      commandListeners.add(listener);
+      return () => {
+        commandListeners.delete(listener);
+      };
+    },
+    sendCommandState(state) {
+      if (!submitted?.commandIds.has(state.id)) return false;
+      return channel?.emit({ v: 1, type: "command.state", body: state }) ?? false;
+    },
+    sendShortcut(body) {
+      if (!submitted?.commandIds.has(body.commandId)) return false;
+      if (
+        !submitted.keybindings.some(
+          (binding) => binding.key === body.key && binding.commandId === body.commandId,
+        )
+      ) return false;
+      return channel?.emit({ v: 1, type: "command.shortcut", body }) ?? false;
+    },
+    close() {
+      if (stopped) return;
+      stopped = true;
+      doc.off("update", onDocUpdate);
+      listeners.clear();
+      commandListeners.clear();
+      importFileListeners.clear();
+      pendingImportFiles.length = 0;
+      channel?.close();
+    },
+    call,
+  };
+}
+
+export { defineEditorManifest, type EditorManifestInput, type EditorTemplate } from "./commands/manifest/editor-document";
+export { createEditorChrome } from "./view/editor-chrome";
+export { mountEditorView } from "./view/mount-editor-view";

package/README.md

@@ -1,3 +0,0 @@
-# Temporary Holding Version
-
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.