@milkdown/plugin-upload 7.5.0 → 7.5.9

package/lib/default-uploader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"default-uploader.d.ts","sourceRoot":"","sources":["../src/default-uploader.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAA;AAGxC,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,IAAI,GAAG,OAAO,CAAC;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,CAAC,CAenF;AAID,eAAO,MAAM,eAAe,EAAE,QAqB7B,CAAA"}
+{"version":3,"file":"default-uploader.d.ts","sourceRoot":"","sources":["../src/default-uploader.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAA;AAGxC,wBAAgB,iBAAiB,CAC/B,IAAI,EAAE,IAAI,GACT,OAAO,CAAC;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,CAAC,CAevC;AAID,eAAO,MAAM,eAAe,EAAE,QAkB7B,CAAA"}

package/lib/index.es.js

@@ -25,17 +25,19 @@ const A = async (n, s) => {
     e && e.type.includes("image") && r.push(e);
   }
   const { image: l } = s.nodes;
-  if (!l)
-    throw F("image");
+  if (!l) throw F("image");
   return (await Promise.all(r.map((t) => w(t)))).map(({ alt: t, src: e }) => l.createAndFill({ src: e, alt: t }));
-}, c = b({
-  uploader: A,
-  enableHtmlFileUploader: !1,
-  uploadWidgetFactory: (n, s) => {
-    const r = document.createElement("span");
-    return r.textContent = "Upload in progress...", k.widget(n, r, s);
-  }
-}, "uploadConfig");
+}, c = b(
+  {
+    uploader: A,
+    enableHtmlFileUploader: !1,
+    uploadWidgetFactory: (n, s) => {
+      const r = document.createElement("span");
+      return r.textContent = "Upload in progress...", k.widget(n, r, s);
+    }
+  },
+  "uploadConfig"
+);
 c.meta = {
   package: "@milkdown/plugin-upload",
   displayName: "Ctx<uploadConfig>"
@@ -44,14 +46,16 @@ const f = U((n) => {
   const s = new D("MILKDOWN_UPLOAD"), r = (o, t) => {
     var i;
     const e = s.getState(o);
-    if (!e)
-      return -1;
-    const a = e.find(void 0, void 0, (d) => d.id === t);
+    if (!e) return -1;
+    const a = e.find(
+      void 0,
+      void 0,
+      (d) => d.id === t
+    );
     return a.length ? ((i = a[0]) == null ? void 0 : i.from) ?? -1 : -1;
   }, l = (o, t, e) => {
     var m;
-    if (!e || e.length <= 0)
-      return !1;
+    if (!e || e.length <= 0) return !1;
     const a = Symbol("upload symbol"), i = n.get(y), { tr: d } = o.state, g = t instanceof DragEvent ? ((m = o.posAtCoords({ left: t.clientX, top: t.clientY })) == null ? void 0 : m.pos) ?? d.selection.from : d.selection.from;
     o.dispatch(d.setMeta(s, { add: { id: a, pos: g } }));
     const { uploader: h } = n.get(c.key);
@@ -72,14 +76,19 @@ const f = U((n) => {
       },
       apply(o, t) {
         const e = t.map(o.mapping, o.doc), a = o.getMeta(this);
-        if (!a)
-          return e;
+        if (!a) return e;
         if (a.add) {
-          const { uploadWidgetFactory: i } = n.get(c.key), d = i(a.add.pos, { id: a.add.id });
+          const { uploadWidgetFactory: i } = n.get(c.key), d = i(a.add.pos, {
+            id: a.add.id
+          });
           return e.add(o.doc, [d]);
         }
         if (a.remove) {
-          const i = e.find(void 0, void 0, (d) => d.id === a.remove.id);
+          const i = e.find(
+            void 0,
+            void 0,
+            (d) => d.id === a.remove.id
+          );
           return e.remove(i);
         }
         return e;

package/lib/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../src/default-uploader.ts","../src/upload.ts","../src/index.ts"],"sourcesContent":["import { missingNodeInSchema } from '@milkdown/exception'\nimport type { Node } from '@milkdown/prose/model'\n\nimport type { Uploader } from './upload'\n\n/// Read the image file as base64.\nexport function readImageAsBase64(file: File): Promise<{ alt: string, src: string }> {\n  return new Promise((resolve) => {\n    const reader = new FileReader()\n    reader.addEventListener(\n      'load',\n      () => {\n        resolve({\n          alt: file.name,\n          src: reader.result as string,\n        })\n      },\n      false,\n    )\n    reader.readAsDataURL(file)\n  })\n}\n\n/// The default uploader.\n/// It will upload transform images to base64.\nexport const defaultUploader: Uploader = async (files, schema) => {\n  const imgs: File[] = []\n\n  for (let i = 0; i < files.length; i++) {\n    const file = files.item(i)\n    if (!file)\n      continue\n\n    if (!file.type.includes('image'))\n      continue\n\n    imgs.push(file)\n  }\n\n  const { image } = schema.nodes\n  if (!image)\n    throw missingNodeInSchema('image')\n\n  const data = await Promise.all(imgs.map(img => readImageAsBase64(img)))\n\n  return data.map(({ alt, src }) => image.createAndFill({ src, alt }) as Node)\n}\n","import { schemaCtx } from '@milkdown/core'\nimport type { Fragment, Node, Schema } from '@milkdown/prose/model'\nimport type { EditorState } from '@milkdown/prose/state'\nimport { Plugin, PluginKey } from '@milkdown/prose/state'\nimport type { EditorView } from '@milkdown/prose/view'\nimport { Decoration, DecorationSet } from '@milkdown/prose/view'\nimport { $ctx, $prose } from '@milkdown/utils'\n\nimport { defaultUploader } from './default-uploader'\n\n/// @internal\nexport type Uploader = UploadOptions['uploader']\ninterface Spec { id: symbol, pos: number }\n\n/// The configuration for upload.\nexport interface UploadOptions {\n  /// The uploader for upload plugin.\n  /// It takes the files and schema as parameters.\n  /// It should return a `Promise` of Prosemirror `Fragment` or `Node` or `Node[]`.\n  uploader: (files: FileList, schema: Schema) => Promise<Fragment | Node | Node[]>\n  /// Whether to enable the html file uploader.\n  /// When paste files from html (for example copy images by right click context menu),\n  /// this option will make the plugin to upload the image copied instead of using the original link.\n  enableHtmlFileUploader: boolean\n  /// The factory for upload widget.\n  /// The widget will be displayed when the file is uploading.\n  /// It takes the position and spec as parameters.\n  /// It should return a `Decoration` of Prosemirror.\n  /// By default, it will return `<span>Upload in progress...</span>`.\n  uploadWidgetFactory: (pos: number, spec: Parameters<typeof Decoration.widget>[2]) => Decoration\n}\n\n/// A slice that contains the configuration for upload.\n/// It should be typed of `UploadConfig`.\nexport const uploadConfig = $ctx<UploadOptions, 'uploadConfig'>({\n  uploader: defaultUploader,\n  enableHtmlFileUploader: false,\n  uploadWidgetFactory: (pos, spec) => {\n    const widgetDOM = document.createElement('span')\n    widgetDOM.textContent = 'Upload in progress...'\n    return Decoration.widget(pos, widgetDOM, spec)\n  },\n}, 'uploadConfig')\n\nuploadConfig.meta = {\n  package: '@milkdown/plugin-upload',\n  displayName: 'Ctx<uploadConfig>',\n}\n\n/// The prosemirror plugin for upload.\nexport const uploadPlugin = $prose((ctx) => {\n  const pluginKey = new PluginKey('MILKDOWN_UPLOAD')\n\n  const findPlaceholder = (state: EditorState, id: symbol): number => {\n    const decorations = pluginKey.getState(state)\n    if (!decorations)\n      return -1\n    const found = decorations.find(undefined, undefined, (spec: Spec) => spec.id === id)\n    if (!found.length)\n      return -1\n    return found[0]?.from ?? -1\n  }\n\n  const handleUpload = (view: EditorView, event: DragEvent | ClipboardEvent, files: FileList | undefined) => {\n    if (!files || files.length <= 0)\n      return false\n\n    const id = Symbol('upload symbol')\n    const schema = ctx.get(schemaCtx)\n    const { tr } = view.state\n    const insertPos = event instanceof DragEvent\n      ? view.posAtCoords({ left: event.clientX, top: event.clientY })?.pos ?? tr.selection.from\n      : tr.selection.from\n    view.dispatch(tr.setMeta(pluginKey, { add: { id, pos: insertPos } }))\n\n    const { uploader } = ctx.get(uploadConfig.key)\n    uploader(files, schema)\n      .then((fragment) => {\n        const pos = findPlaceholder(view.state, id)\n        if (pos < 0)\n          return\n\n        view.dispatch(\n          view.state.tr\n            .replaceWith(pos, pos, fragment)\n            .setMeta(pluginKey, { remove: { id } }),\n        )\n      })\n      .catch((e) => {\n        console.error(e)\n      })\n    return true\n  }\n\n  return new Plugin({\n    key: pluginKey,\n    state: {\n      init() {\n        return DecorationSet.empty\n      },\n      apply(this: Plugin, tr, set) {\n        const _set = set.map(tr.mapping, tr.doc)\n        const action = tr.getMeta(this)\n        if (!action)\n          return _set\n\n        if (action.add) {\n          const { uploadWidgetFactory } = ctx.get(uploadConfig.key)\n\n          const decoration = uploadWidgetFactory(action.add.pos, { id: action.add.id })\n          return _set.add(tr.doc, [decoration])\n        }\n        if (action.remove) {\n          const target = _set.find(undefined, undefined, (spec: Spec) => spec.id === action.remove.id)\n          return _set.remove(target)\n        }\n\n        return _set\n      },\n    },\n    props: {\n      decorations(this: Plugin, state) {\n        return this.getState(state)\n      },\n      handlePaste: (view, event) => {\n        const { enableHtmlFileUploader } = ctx.get(uploadConfig.key)\n        if (!(event instanceof ClipboardEvent))\n          return false\n\n        if (!enableHtmlFileUploader && event.clipboardData?.getData('text/html'))\n          return false\n\n        return handleUpload(view, event, event.clipboardData?.files)\n      },\n      handleDrop: (view, event) => {\n        if (!(event instanceof DragEvent))\n          return false\n\n        return handleUpload(view, event, event.dataTransfer?.files)\n      },\n    },\n  })\n})\n\nuploadPlugin.meta = {\n  package: '@milkdown/plugin-upload',\n  displayName: 'Prose<upload>',\n}\n","import type { MilkdownPlugin } from '@milkdown/ctx'\nimport { uploadConfig, uploadPlugin } from './upload'\n\nexport * from './upload'\nexport * from './default-uploader'\n\n/// All plugins exported by this package.\nexport const upload: MilkdownPlugin[] = [uploadConfig, uploadPlugin]\n"],"names":["readImageAsBase64","file","resolve","reader","defaultUploader","files","schema","imgs","i","image","missingNodeInSchema","img","alt","src","uploadConfig","$ctx","pos","spec","widgetDOM","Decoration","uploadPlugin","$prose","ctx","pluginKey","PluginKey","findPlaceholder","state","id","decorations","found","_a","handleUpload","view","event","schemaCtx","tr","insertPos","uploader","fragment","e","Plugin","DecorationSet","set","_set","action","uploadWidgetFactory","decoration","target","enableHtmlFileUploader","_b","upload"],"mappings":"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"}
+{"version":3,"file":"index.es.js","sources":["../src/default-uploader.ts","../src/upload.ts","../src/index.ts"],"sourcesContent":["import { missingNodeInSchema } from '@milkdown/exception'\nimport type { Node } from '@milkdown/prose/model'\n\nimport type { Uploader } from './upload'\n\n/// Read the image file as base64.\nexport function readImageAsBase64(\n  file: File\n): Promise<{ alt: string; src: string }> {\n  return new Promise((resolve) => {\n    const reader = new FileReader()\n    reader.addEventListener(\n      'load',\n      () => {\n        resolve({\n          alt: file.name,\n          src: reader.result as string,\n        })\n      },\n      false\n    )\n    reader.readAsDataURL(file)\n  })\n}\n\n/// The default uploader.\n/// It will upload transform images to base64.\nexport const defaultUploader: Uploader = async (files, schema) => {\n  const imgs: File[] = []\n\n  for (let i = 0; i < files.length; i++) {\n    const file = files.item(i)\n    if (!file) continue\n\n    if (!file.type.includes('image')) continue\n\n    imgs.push(file)\n  }\n\n  const { image } = schema.nodes\n  if (!image) throw missingNodeInSchema('image')\n\n  const data = await Promise.all(imgs.map((img) => readImageAsBase64(img)))\n\n  return data.map(({ alt, src }) => image.createAndFill({ src, alt }) as Node)\n}\n","import { schemaCtx } from '@milkdown/core'\nimport type { Fragment, Node, Schema } from '@milkdown/prose/model'\nimport type { EditorState } from '@milkdown/prose/state'\nimport { Plugin, PluginKey } from '@milkdown/prose/state'\nimport type { EditorView } from '@milkdown/prose/view'\nimport { Decoration, DecorationSet } from '@milkdown/prose/view'\nimport { $ctx, $prose } from '@milkdown/utils'\n\nimport { defaultUploader } from './default-uploader'\n\n/// @internal\nexport type Uploader = UploadOptions['uploader']\ninterface Spec {\n  id: symbol\n  pos: number\n}\n\n/// The configuration for upload.\nexport interface UploadOptions {\n  /// The uploader for upload plugin.\n  /// It takes the files and schema as parameters.\n  /// It should return a `Promise` of Prosemirror `Fragment` or `Node` or `Node[]`.\n  uploader: (\n    files: FileList,\n    schema: Schema\n  ) => Promise<Fragment | Node | Node[]>\n  /// Whether to enable the html file uploader.\n  /// When paste files from html (for example copy images by right click context menu),\n  /// this option will make the plugin to upload the image copied instead of using the original link.\n  enableHtmlFileUploader: boolean\n  /// The factory for upload widget.\n  /// The widget will be displayed when the file is uploading.\n  /// It takes the position and spec as parameters.\n  /// It should return a `Decoration` of Prosemirror.\n  /// By default, it will return `<span>Upload in progress...</span>`.\n  uploadWidgetFactory: (\n    pos: number,\n    spec: Parameters<typeof Decoration.widget>[2]\n  ) => Decoration\n}\n\n/// A slice that contains the configuration for upload.\n/// It should be typed of `UploadConfig`.\nexport const uploadConfig = $ctx<UploadOptions, 'uploadConfig'>(\n  {\n    uploader: defaultUploader,\n    enableHtmlFileUploader: false,\n    uploadWidgetFactory: (pos, spec) => {\n      const widgetDOM = document.createElement('span')\n      widgetDOM.textContent = 'Upload in progress...'\n      return Decoration.widget(pos, widgetDOM, spec)\n    },\n  },\n  'uploadConfig'\n)\n\nuploadConfig.meta = {\n  package: '@milkdown/plugin-upload',\n  displayName: 'Ctx<uploadConfig>',\n}\n\n/// The prosemirror plugin for upload.\nexport const uploadPlugin = $prose((ctx) => {\n  const pluginKey = new PluginKey('MILKDOWN_UPLOAD')\n\n  const findPlaceholder = (state: EditorState, id: symbol): number => {\n    const decorations = pluginKey.getState(state)\n    if (!decorations) return -1\n    const found = decorations.find(\n      undefined,\n      undefined,\n      (spec: Spec) => spec.id === id\n    )\n    if (!found.length) return -1\n    return found[0]?.from ?? -1\n  }\n\n  const handleUpload = (\n    view: EditorView,\n    event: DragEvent | ClipboardEvent,\n    files: FileList | undefined\n  ) => {\n    if (!files || files.length <= 0) return false\n\n    const id = Symbol('upload symbol')\n    const schema = ctx.get(schemaCtx)\n    const { tr } = view.state\n    const insertPos =\n      event instanceof DragEvent\n        ? (view.posAtCoords({ left: event.clientX, top: event.clientY })?.pos ??\n          tr.selection.from)\n        : tr.selection.from\n    view.dispatch(tr.setMeta(pluginKey, { add: { id, pos: insertPos } }))\n\n    const { uploader } = ctx.get(uploadConfig.key)\n    uploader(files, schema)\n      .then((fragment) => {\n        const pos = findPlaceholder(view.state, id)\n        if (pos < 0) return\n\n        view.dispatch(\n          view.state.tr\n            .replaceWith(pos, pos, fragment)\n            .setMeta(pluginKey, { remove: { id } })\n        )\n      })\n      .catch((e) => {\n        // eslint-disable-next-line no-console\n        console.error(e)\n      })\n    return true\n  }\n\n  return new Plugin({\n    key: pluginKey,\n    state: {\n      init() {\n        return DecorationSet.empty\n      },\n      apply(this: Plugin, tr, set) {\n        const _set = set.map(tr.mapping, tr.doc)\n        const action = tr.getMeta(this)\n        if (!action) return _set\n\n        if (action.add) {\n          const { uploadWidgetFactory } = ctx.get(uploadConfig.key)\n\n          const decoration = uploadWidgetFactory(action.add.pos, {\n            id: action.add.id,\n          })\n          return _set.add(tr.doc, [decoration])\n        }\n        if (action.remove) {\n          const target = _set.find(\n            undefined,\n            undefined,\n            (spec: Spec) => spec.id === action.remove.id\n          )\n          return _set.remove(target)\n        }\n\n        return _set\n      },\n    },\n    props: {\n      decorations(this: Plugin, state) {\n        return this.getState(state)\n      },\n      handlePaste: (view, event) => {\n        const { enableHtmlFileUploader } = ctx.get(uploadConfig.key)\n        if (!(event instanceof ClipboardEvent)) return false\n\n        if (\n          !enableHtmlFileUploader &&\n          event.clipboardData?.getData('text/html')\n        )\n          return false\n\n        return handleUpload(view, event, event.clipboardData?.files)\n      },\n      handleDrop: (view, event) => {\n        if (!(event instanceof DragEvent)) return false\n\n        return handleUpload(view, event, event.dataTransfer?.files)\n      },\n    },\n  })\n})\n\nuploadPlugin.meta = {\n  package: '@milkdown/plugin-upload',\n  displayName: 'Prose<upload>',\n}\n","import type { MilkdownPlugin } from '@milkdown/ctx'\nimport { uploadConfig, uploadPlugin } from './upload'\n\nexport * from './upload'\nexport * from './default-uploader'\n\n/// All plugins exported by this package.\nexport const upload: MilkdownPlugin[] = [uploadConfig, uploadPlugin]\n"],"names":["readImageAsBase64","file","resolve","reader","defaultUploader","files","schema","imgs","i","image","missingNodeInSchema","img","alt","src","uploadConfig","$ctx","pos","spec","widgetDOM","Decoration","uploadPlugin","$prose","ctx","pluginKey","PluginKey","findPlaceholder","state","id","decorations","found","_a","handleUpload","view","event","schemaCtx","tr","insertPos","uploader","fragment","e","Plugin","DecorationSet","set","_set","action","uploadWidgetFactory","decoration","target","enableHtmlFileUploader","_b","upload"],"mappings":"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"}

package/lib/upload.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"upload.d.ts","sourceRoot":"","sources":["../src/upload.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAA;AAInE,OAAO,EAAE,UAAU,EAAiB,MAAM,sBAAsB,CAAA;AAMhE,MAAM,MAAM,QAAQ,GAAG,aAAa,CAAC,UAAU,CAAC,CAAA;AAIhD,MAAM,WAAW,aAAa;IAI5B,QAAQ,EAAE,CAAC,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,KAAK,OAAO,CAAC,QAAQ,GAAG,IAAI,GAAG,IAAI,EAAE,CAAC,CAAA;IAIhF,sBAAsB,EAAE,OAAO,CAAA;IAM/B,mBAAmB,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,KAAK,UAAU,CAAA;CAChG;AAID,eAAO,MAAM,YAAY,+DAQP,CAAA;AAQlB,eAAO,MAAM,YAAY,kCA4FvB,CAAA"}
+{"version":3,"file":"upload.d.ts","sourceRoot":"","sources":["../src/upload.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAA;AAInE,OAAO,EAAE,UAAU,EAAiB,MAAM,sBAAsB,CAAA;AAMhE,MAAM,MAAM,QAAQ,GAAG,aAAa,CAAC,UAAU,CAAC,CAAA;AAOhD,MAAM,WAAW,aAAa;IAI5B,QAAQ,EAAE,CACR,KAAK,EAAE,QAAQ,EACf,MAAM,EAAE,MAAM,KACX,OAAO,CAAC,QAAQ,GAAG,IAAI,GAAG,IAAI,EAAE,CAAC,CAAA;IAItC,sBAAsB,EAAE,OAAO,CAAA;IAM/B,mBAAmB,EAAE,CACnB,GAAG,EAAE,MAAM,EACX,IAAI,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,KAC1C,UAAU,CAAA;CAChB;AAID,eAAO,MAAM,YAAY,+DAWxB,CAAA;AAQD,eAAO,MAAM,YAAY,kCAyGvB,CAAA"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@milkdown/plugin-upload",
   "type": "module",
-  "version": "7.5.0",
+  "version": "7.5.9",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -31,13 +31,13 @@
   },
   "dependencies": {
     "tslib": "^2.5.0",
-    "@milkdown/exception": "7.5.0",
-    "@milkdown/utils": "7.5.0"
+    "@milkdown/exception": "7.5.9",
+    "@milkdown/utils": "7.5.9"
   },
   "devDependencies": {
-    "@milkdown/core": "7.5.0",
-    "@milkdown/ctx": "7.5.0",
-    "@milkdown/prose": "7.5.0"
+    "@milkdown/core": "7.5.9",
+    "@milkdown/ctx": "7.5.9",
+    "@milkdown/prose": "7.5.9"
   },
   "nx": {
     "targets": {

package/src/default-uploader.ts

@@ -4,7 +4,9 @@ import type { Node } from '@milkdown/prose/model'
 import type { Uploader } from './upload'
 
 /// Read the image file as base64.
-export function readImageAsBase64(file: File): Promise<{ alt: string, src: string }> {
+export function readImageAsBase64(
+  file: File
+): Promise<{ alt: string; src: string }> {
   return new Promise((resolve) => {
     const reader = new FileReader()
     reader.addEventListener(
@@ -15,7 +17,7 @@ export function readImageAsBase64(file: File): Promise<{ alt: string, src: strin
           src: reader.result as string,
         })
       },
-      false,
+      false
     )
     reader.readAsDataURL(file)
   })
@@ -28,20 +30,17 @@ export const defaultUploader: Uploader = async (files, schema) => {
 
   for (let i = 0; i < files.length; i++) {
     const file = files.item(i)
-    if (!file)
-      continue
+    if (!file) continue
 
-    if (!file.type.includes('image'))
-      continue
+    if (!file.type.includes('image')) continue
 
     imgs.push(file)
   }
 
   const { image } = schema.nodes
-  if (!image)
-    throw missingNodeInSchema('image')
+  if (!image) throw missingNodeInSchema('image')
 
-  const data = await Promise.all(imgs.map(img => readImageAsBase64(img)))
+  const data = await Promise.all(imgs.map((img) => readImageAsBase64(img)))
 
   return data.map(({ alt, src }) => image.createAndFill({ src, alt }) as Node)
 }

package/src/upload.ts

@@ -10,14 +10,20 @@ import { defaultUploader } from './default-uploader'
 
 /// @internal
 export type Uploader = UploadOptions['uploader']
-interface Spec { id: symbol, pos: number }
+interface Spec {
+  id: symbol
+  pos: number
+}
 
 /// The configuration for upload.
 export interface UploadOptions {
   /// The uploader for upload plugin.
   /// It takes the files and schema as parameters.
   /// It should return a `Promise` of Prosemirror `Fragment` or `Node` or `Node[]`.
-  uploader: (files: FileList, schema: Schema) => Promise<Fragment | Node | Node[]>
+  uploader: (
+    files: FileList,
+    schema: Schema
+  ) => Promise<Fragment | Node | Node[]>
   /// Whether to enable the html file uploader.
   /// When paste files from html (for example copy images by right click context menu),
   /// this option will make the plugin to upload the image copied instead of using the original link.
@@ -27,20 +33,26 @@ export interface UploadOptions {
   /// It takes the position and spec as parameters.
   /// It should return a `Decoration` of Prosemirror.
   /// By default, it will return `<span>Upload in progress...</span>`.
-  uploadWidgetFactory: (pos: number, spec: Parameters<typeof Decoration.widget>[2]) => Decoration
+  uploadWidgetFactory: (
+    pos: number,
+    spec: Parameters<typeof Decoration.widget>[2]
+  ) => Decoration
 }
 
 /// A slice that contains the configuration for upload.
 /// It should be typed of `UploadConfig`.
-export const uploadConfig = $ctx<UploadOptions, 'uploadConfig'>({
-  uploader: defaultUploader,
-  enableHtmlFileUploader: false,
-  uploadWidgetFactory: (pos, spec) => {
-    const widgetDOM = document.createElement('span')
-    widgetDOM.textContent = 'Upload in progress...'
-    return Decoration.widget(pos, widgetDOM, spec)
+export const uploadConfig = $ctx<UploadOptions, 'uploadConfig'>(
+  {
+    uploader: defaultUploader,
+    enableHtmlFileUploader: false,
+    uploadWidgetFactory: (pos, spec) => {
+      const widgetDOM = document.createElement('span')
+      widgetDOM.textContent = 'Upload in progress...'
+      return Decoration.widget(pos, widgetDOM, spec)
+    },
   },
-}, 'uploadConfig')
+  'uploadConfig'
+)
 
 uploadConfig.meta = {
   package: '@milkdown/plugin-upload',
@@ -53,40 +65,47 @@ export const uploadPlugin = $prose((ctx) => {
 
   const findPlaceholder = (state: EditorState, id: symbol): number => {
     const decorations = pluginKey.getState(state)
-    if (!decorations)
-      return -1
-    const found = decorations.find(undefined, undefined, (spec: Spec) => spec.id === id)
-    if (!found.length)
-      return -1
+    if (!decorations) return -1
+    const found = decorations.find(
+      undefined,
+      undefined,
+      (spec: Spec) => spec.id === id
+    )
+    if (!found.length) return -1
     return found[0]?.from ?? -1
   }
 
-  const handleUpload = (view: EditorView, event: DragEvent | ClipboardEvent, files: FileList | undefined) => {
-    if (!files || files.length <= 0)
-      return false
+  const handleUpload = (
+    view: EditorView,
+    event: DragEvent | ClipboardEvent,
+    files: FileList | undefined
+  ) => {
+    if (!files || files.length <= 0) return false
 
     const id = Symbol('upload symbol')
     const schema = ctx.get(schemaCtx)
     const { tr } = view.state
-    const insertPos = event instanceof DragEvent
-      ? view.posAtCoords({ left: event.clientX, top: event.clientY })?.pos ?? tr.selection.from
-      : tr.selection.from
+    const insertPos =
+      event instanceof DragEvent
+        ? (view.posAtCoords({ left: event.clientX, top: event.clientY })?.pos ??
+          tr.selection.from)
+        : tr.selection.from
     view.dispatch(tr.setMeta(pluginKey, { add: { id, pos: insertPos } }))
 
     const { uploader } = ctx.get(uploadConfig.key)
     uploader(files, schema)
       .then((fragment) => {
         const pos = findPlaceholder(view.state, id)
-        if (pos < 0)
-          return
+        if (pos < 0) return
 
         view.dispatch(
           view.state.tr
             .replaceWith(pos, pos, fragment)
-            .setMeta(pluginKey, { remove: { id } }),
+            .setMeta(pluginKey, { remove: { id } })
         )
       })
       .catch((e) => {
+        // eslint-disable-next-line no-console
         console.error(e)
       })
     return true
@@ -101,17 +120,22 @@ export const uploadPlugin = $prose((ctx) => {
       apply(this: Plugin, tr, set) {
         const _set = set.map(tr.mapping, tr.doc)
         const action = tr.getMeta(this)
-        if (!action)
-          return _set
+        if (!action) return _set
 
         if (action.add) {
           const { uploadWidgetFactory } = ctx.get(uploadConfig.key)
 
-          const decoration = uploadWidgetFactory(action.add.pos, { id: action.add.id })
+          const decoration = uploadWidgetFactory(action.add.pos, {
+            id: action.add.id,
+          })
           return _set.add(tr.doc, [decoration])
         }
         if (action.remove) {
-          const target = _set.find(undefined, undefined, (spec: Spec) => spec.id === action.remove.id)
+          const target = _set.find(
+            undefined,
+            undefined,
+            (spec: Spec) => spec.id === action.remove.id
+          )
           return _set.remove(target)
         }
 
@@ -124,17 +148,18 @@ export const uploadPlugin = $prose((ctx) => {
       },
       handlePaste: (view, event) => {
         const { enableHtmlFileUploader } = ctx.get(uploadConfig.key)
-        if (!(event instanceof ClipboardEvent))
-          return false
+        if (!(event instanceof ClipboardEvent)) return false
 
-        if (!enableHtmlFileUploader && event.clipboardData?.getData('text/html'))
+        if (
+          !enableHtmlFileUploader &&
+          event.clipboardData?.getData('text/html')
+        )
           return false
 
         return handleUpload(view, event, event.clipboardData?.files)
       },
       handleDrop: (view, event) => {
-        if (!(event instanceof DragEvent))
-          return false
+        if (!(event instanceof DragEvent)) return false
 
         return handleUpload(view, event, event.dataTransfer?.files)
       },