@lapismd/mira-vanilla 0.0.1

package/CHANGELOG.md

@@ -0,0 +1,7 @@
+# @lapismd/mira-vanilla
+
+## 0.0.1
+
+### Patch Changes
+
+- Initial public release.

package/LICENSE.md

@@ -0,0 +1,4 @@
+AGPL-3.0-or-later
+
+This project is licensed under the GNU Affero General Public License v3.0 or later.
+See <https://www.gnu.org/licenses/agpl-3.0.en.html>.

package/README.md

@@ -0,0 +1,19 @@
+# `@lapismd/mira-vanilla`
+
+Plain JavaScript mounting factories for both public editor products.
+
+```ts
+import { createMiraEditor } from "@lapismd/mira-vanilla";
+import "@lapismd/mira-editor/styles.css";
+
+const editor = createMiraEditor({
+  root: document.getElementById("editor")!,
+  value: "# Hello Mira",
+});
+
+editor.setMode("preview");
+editor.destroy();
+```
+
+Use `createMira(target, props)` for the composable editor and
+`createMiraEditor(options)` for the batteries-included editor.

package/dist/index.d.ts

@@ -0,0 +1,30 @@
+import { MiraProps } from '@lapismd/mira';
+export { MiraMarkdownActionId, MiraProps } from '@lapismd/mira';
+import { MiraMode } from '@lapismd/mira/extensions';
+import { MiraEditorHandle, MiraEditorProps } from '@lapismd/mira-editor';
+export { MiraEditorHandle, MiraEditorProps } from '@lapismd/mira-editor';
+
+type MiraInstance = {
+    update: (props: Partial<MiraProps>) => void;
+    destroy: () => void;
+};
+declare function createMira(target: HTMLElement, props: MiraProps): MiraInstance;
+type MiraEditorOptions = Omit<MiraEditorProps, "class"> & {
+    root: HTMLElement;
+    class?: string;
+};
+type MiraEditorEventMap = {
+    change: string;
+    modeChange: MiraMode;
+    readonlyChange: boolean;
+};
+type MiraEditorEventName = keyof MiraEditorEventMap;
+type MiraEditorEventHandler<EventName extends MiraEditorEventName> = (payload: MiraEditorEventMap[EventName]) => void;
+type MiraEditorInstance = MiraEditorHandle & {
+    destroy: () => void;
+    on: <EventName extends MiraEditorEventName>(event: EventName, handler: MiraEditorEventHandler<EventName>) => () => void;
+    update: (props: Partial<Omit<MiraEditorOptions, "root">>) => void;
+};
+declare function createMiraEditor(options: MiraEditorOptions): MiraEditorInstance;
+
+export { type MiraEditorEventHandler, type MiraEditorEventMap, type MiraEditorEventName, type MiraEditorInstance, type MiraEditorOptions, type MiraInstance, createMira, createMiraEditor, createMira as default };

package/dist/index.js

@@ -0,0 +1,144 @@
+// src/index.ts
+import { mount, unmount } from "svelte";
+import Mira from "@lapismd/mira";
+import MiraEditor from "@lapismd/mira-editor";
+function createMira(target, props) {
+  let currentProps = { ...props };
+  let component = mount(Mira, {
+    target,
+    props: currentProps
+  });
+  return {
+    update(nextProps) {
+      currentProps = {
+        ...currentProps,
+        ...nextProps
+      };
+      unmount(component);
+      component = mount(Mira, {
+        target,
+        props: currentProps
+      });
+    },
+    destroy() {
+      unmount(component);
+    }
+  };
+}
+function createMiraEditor(options) {
+  const { root, ...initialProps } = options;
+  let currentProps = { ...initialProps };
+  let currentValue = initialProps.value ?? "";
+  let currentMode = initialProps.mode ?? initialProps.defaultEditMode ?? "live-preview";
+  let currentReadonly = initialProps.readonly ?? false;
+  const listeners = {
+    change: /* @__PURE__ */ new Set(),
+    modeChange: /* @__PURE__ */ new Set(),
+    readonlyChange: /* @__PURE__ */ new Set()
+  };
+  let component = mountComponent();
+  function mountComponent() {
+    return mount(MiraEditor, {
+      target: root,
+      props: {
+        ...currentProps,
+        value: currentValue,
+        mode: currentMode,
+        readonly: currentReadonly,
+        onChange(value) {
+          currentValue = value;
+          currentProps.onChange?.(value);
+          emit("change", value);
+        },
+        onModeChange(mode) {
+          currentMode = mode;
+          currentProps.onModeChange?.(mode);
+          emit("modeChange", mode);
+        },
+        onReadonlyChange(readonly) {
+          currentReadonly = readonly;
+          currentProps.onReadonlyChange?.(readonly);
+          emit("readonlyChange", readonly);
+        }
+      }
+    });
+  }
+  function emit(event, payload) {
+    for (const listener of listeners[event]) {
+      listener(payload);
+    }
+  }
+  function remount() {
+    unmount(component);
+    component = mountComponent();
+  }
+  return {
+    applyMarkdownAction(action) {
+      return component.applyMarkdownAction(action);
+    },
+    destroy() {
+      unmount(component);
+    },
+    executeCommand(commandId) {
+      return component.executeCommand(commandId);
+    },
+    focus() {
+      component.focus();
+    },
+    getCommands() {
+      return component.getCommands();
+    },
+    getMarkdown() {
+      return component.getMarkdown?.() ?? currentValue;
+    },
+    getMode() {
+      return component.getMode?.() ?? currentMode;
+    },
+    getSelection() {
+      return component.getSelection?.() ?? null;
+    },
+    insertMarkdown(markdown, selection) {
+      component.insertMarkdown(markdown, selection);
+    },
+    insertImage() {
+      component.insertImage();
+    },
+    isCommandEnabled(commandId) {
+      return component.isCommandEnabled(commandId);
+    },
+    on(event, handler) {
+      listeners[event].add(handler);
+      return () => {
+        listeners[event].delete(handler);
+      };
+    },
+    setMarkdown(markdown) {
+      currentValue = markdown;
+      component.setMarkdown(markdown);
+    },
+    setMode(mode) {
+      component.setMode(mode);
+      currentMode = component.getMode();
+    },
+    setReadonly(readonly) {
+      currentReadonly = readonly;
+      component.setReadonly(readonly);
+    },
+    setSelection(selection) {
+      component.setSelection(selection);
+    },
+    update(props) {
+      currentProps = { ...currentProps, ...props };
+      if (props.value !== void 0) currentValue = props.value;
+      if (props.mode !== void 0) currentMode = props.mode;
+      if (props.readonly !== void 0) currentReadonly = props.readonly;
+      remount();
+    }
+  };
+}
+var index_default = createMira;
+export {
+  createMira,
+  createMiraEditor,
+  index_default as default
+};

package/package.json

@@ -0,0 +1,47 @@
+{
+  "name": "@lapismd/mira-vanilla",
+  "version": "0.0.1",
+  "description": "Plain JavaScript factories for the composable Mira and batteries-included Mira Editor surfaces.",
+  "author": "Steve Juma <help@lapis.md>",
+  "license": "AGPL-3.0-or-later",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/lapismd/mira-mde.git",
+    "directory": "packages/mira-vanilla"
+  },
+  "type": "module",
+  "sideEffects": false,
+  "files": [
+    "CHANGELOG.md",
+    "dist"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "dependencies": {
+    "@lapismd/mira-editor": "~0.0.1",
+    "@lapismd/mira": "~0.0.1"
+  },
+  "peerDependencies": {
+    "svelte": "^5.0.0"
+  },
+  "devDependencies": {
+    "svelte": "^5.46.1"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org"
+  },
+  "scripts": {
+    "build": "tsup src/index.ts --format esm --dts --clean",
+    "check": "pnpm check:format && pnpm check:svelte && pnpm check:types",
+    "check:format": "prettier --ignore-path ../../.prettierignore . --check",
+    "check:types": "tsc -p tsconfig.json --noEmit",
+    "check:svelte": "echo \"no svelte files\"",
+    "lint": "eslint src --ext .ts",
+    "test": "vitest run"
+  }
+}