prosemirror-highlight 0.2.0 → 0.3.0

package/README.md

@@ -2,7 +2,7 @@
 
 [![NPM version](https://img.shields.io/npm/v/prosemirror-highlight?color=a1b858&label=)](https://www.npmjs.com/package/prosemirror-highlight)
 
-Highlight your code blocks in [ProseMirror], with any syntax highlighter you want.
+Highlight your code blocks in [ProseMirror], with any syntax highlighter you like!
 
 ## Usage
 
@@ -55,6 +55,18 @@ const parser = createParser(lowlight)
 export const lowlightPlugin = createHighlightPlugin({ parser })
 ```
 
+### With [refractor] (based on [Prism])
+
+```ts
+import { refractor } from 'refractor'
+
+import { createHighlightPlugin } from 'prosemirror-highlight'
+import { createParser } from 'prosemirror-highlight/refractor'
+
+const parser = createParser(refractor)
+export const refractorPlugin = createHighlightPlugin({ parser })
+```
+
 ## Online demo
 
 [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/ocavue/prosemirror-highlight?file=playground%2Fmain.ts)
@@ -73,3 +85,5 @@ MIT
 [Highlight.js]: https://github.com/highlightjs/highlight.js
 [Shiki]: https://github.com/shikijs/shiki
 [Shikiji]: https://github.com/antfu/shikiji
+[refractor]: https://github.com/wooorm/refractor
+[Prism]: https://github.com/PrismJS/prism

package/dist/chunk-ZZGBRRBM.js

@@ -0,0 +1,46 @@
+// src/hast.ts
+import { Decoration } from "prosemirror-view";
+function fillFromRoot(decorations, node, from) {
+  for (const child of node.children) {
+    from = fillFromRootContent(decorations, child, from);
+  }
+}
+function fillFromRootContent(decorations, node, from) {
+  if (node.type === "element") {
+    const to = from + getElementSize(node);
+    const { className, ...rest } = node.properties || {};
+    decorations.push(
+      Decoration.inline(from, to, {
+        class: className ? Array.isArray(className) ? className.join(" ") : String(className) : void 0,
+        ...rest,
+        nodeName: node.tagName
+      })
+    );
+    return to;
+  } else if (node.type === "text") {
+    return from + node.value.length;
+  } else {
+    return from;
+  }
+}
+function getElementSize(node) {
+  let size = 0;
+  for (const child of node.children) {
+    size += getElementContentSize(child);
+  }
+  return size;
+}
+function getElementContentSize(node) {
+  switch (node.type) {
+    case "element":
+      return getElementSize(node);
+    case "text":
+      return node.value.length;
+    default:
+      return 0;
+  }
+}
+
+export {
+  fillFromRoot
+};

package/dist/lowlight.js

@@ -1,5 +1,9 @@
+import {
+  fillFromRoot
+} from "./chunk-ZZGBRRBM.js";
+
 // src/lowlight.ts
-import { Decoration } from "prosemirror-view";
+import "prosemirror-view";
 function createParser(lowlight) {
   return function highlighter({ content, language, pos }) {
     const root = language ? lowlight.highlight(language, content) : lowlight.highlightAuto(content);
@@ -9,46 +13,6 @@ function createParser(lowlight) {
     return decorations;
   };
 }
-function fillFromRoot(decorations, node, from) {
-  for (const child of node.children) {
-    from = fillFromRootContent(decorations, child, from);
-  }
-}
-function fillFromRootContent(decorations, node, from) {
-  if (node.type === "element") {
-    const to = from + getElementSize(node);
-    const { className, ...rest } = node.properties;
-    decorations.push(
-      Decoration.inline(from, to, {
-        class: className ? Array.isArray(className) ? className.join(" ") : String(className) : void 0,
-        ...rest,
-        nodeName: node.tagName
-      })
-    );
-    return to;
-  } else if (node.type === "text") {
-    return from + node.value.length;
-  } else {
-    return from;
-  }
-}
-function getElementSize(node) {
-  let size = 0;
-  for (const child of node.children) {
-    size += getElementContentSize(child);
-  }
-  return size;
-}
-function getElementContentSize(node) {
-  switch (node.type) {
-    case "element":
-      return getElementSize(node);
-    case "text":
-      return node.value.length;
-    default:
-      return 0;
-  }
-}
 export {
   createParser
 };

package/dist/refractor.d.ts

@@ -0,0 +1,8 @@
+import { Refractor } from 'refractor/lib/core';
+import { P as Parser } from './types-wUmJTPF3.js';
+import 'prosemirror-model';
+import 'prosemirror-view';
+
+declare function createParser(refractor: Refractor): Parser;
+
+export { createParser };

package/dist/refractor.js

@@ -0,0 +1,19 @@
+import {
+  fillFromRoot
+} from "./chunk-ZZGBRRBM.js";
+
+// src/refractor.ts
+import "prosemirror-view";
+function createParser(refractor) {
+  return function highlighter({ content, language, pos }) {
+    const root = refractor.highlight(content, language || "");
+    const decorations = [];
+    const from = pos + 1;
+    const hastRoot = root;
+    fillFromRoot(decorations, hastRoot, from);
+    return decorations;
+  };
+}
+export {
+  createParser
+};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "prosemirror-highlight",
   "type": "module",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "packageManager": "pnpm@8.10.0",
   "description": "A ProseMirror plugin to highlight code blocks",
   "author": "ocavue <ocavue@gmail.com>",
@@ -13,7 +13,16 @@
     "url": "https://github.com/ocavue/prosemirror-highlight.git"
   },
   "bugs": "https://github.com/ocavue/prosemirror-highlight/issues",
-  "keywords": [],
+  "keywords": [
+    "prosemirror",
+    "editor",
+    "highlight.js",
+    "shiki",
+    "shikiji",
+    "refractor",
+    "lowlight",
+    "prism"
+  ],
   "sideEffects": false,
   "main": "./src/index.ts",
   "module": "./src/index.ts",
@@ -25,6 +34,9 @@
     "./lowlight": {
       "default": "./src/lowlight.ts"
     },
+    "./refractor": {
+      "default": "./src/refractor.ts"
+    },
     "./shiki": {
       "default": "./src/shiki.ts"
     },
@@ -53,6 +65,7 @@
     "prosemirror-state": "^1.4.3",
     "prosemirror-transform": "^1.8.0",
     "prosemirror-view": "^1.32.4",
+    "refractor": "^4.8.1",
     "shiki": "^0.14.6",
     "shikiji": "^0.8.0"
   },
@@ -78,6 +91,9 @@
     "prosemirror-view": {
       "optional": true
     },
+    "refractor": {
+      "optional": true
+    },
     "shiki": {
       "optional": true
     },
@@ -101,6 +117,7 @@
     "prosemirror-state": "^1.4.3",
     "prosemirror-transform": "^1.8.0",
     "prosemirror-view": "^1.32.4",
+    "refractor": "^4.8.1",
     "shiki": "^0.14.6",
     "shikiji": "^0.8.0",
     "tsup": "^8.0.1",
@@ -121,6 +138,10 @@
         "types": "./dist/lowlight.d.ts",
         "default": "./dist/lowlight.js"
       },
+      "./refractor": {
+        "types": "./dist/refractor.d.ts",
+        "default": "./dist/refractor.js"
+      },
       "./shiki": {
         "types": "./dist/shiki.d.ts",
         "default": "./dist/shiki.js"