Merge branch 'main' into refactor/generator

README.md

@@ -2,7 +2,7 @@
 
 ![sample-code-block-output](sample-code-block.png)
 
-[rehype](https://github.com/wooorm/rehype) plugin to highlight code blocks in HTML with [Prism] (via [refractor]) with additional line highlighting and line numbers functionalities.
+[rehype] plugin to highlight code blocks in HTML with [Prism] (via [refractor]) with additional line highlighting and line numbers functionalities.
 
 Inspired by and uses a compatible API as [@mapbox/rehype-prism](https://github.com/mapbox/rehype-prism) with additional support for line-highlighting and line numbers.
 
@@ -10,9 +10,6 @@ Tested to work with [xdm] and mdx v2 libraries such as [mdx-bundler]. If you are
 
 An [appropriate stylesheet](#styling) should be loaded to style the language tokens, format line numbers and highlight lines.
 
-**Best suited for usage in Node.**
-If you would like to perform syntax highlighting _in the browser_, you should look into [less heavy ways to use refractor](https://github.com/wooorm/refractor#browser).
-
 ## Installation
 
 This package is [ESM only](https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c):
@@ -24,9 +21,13 @@ npm install rehype-prism-plus
 
 ## Usage
 
-Use this package [as a rehype plugin](https://github.com/rehypejs/rehype/blob/master/doc/plugins.md#using-plugins).
+The following objects are exported:
+
+- `rehypePrismGenerator`, generator function. Can be used to generate a rehype prism plugin that works on your desired languages.
+- `rehypePrismCommon`, [rehype plugin]. Supports the languages in `refractor/lib/common.js`.
+- `rehypePrism`, [rehype plugin]. Works with all [language supported by refractor].
 
-Some examples of how you might do that:
+Some examples of how you might use the rehype plugin:
 
 ```js
 import rehype from 'rehype'
@@ -94,6 +95,19 @@ HTML Output:
 >
 ```
 
+## Generating
+
+To customise the languages for your own prism plugin:
+
+```js
+import { refractor } from 'refractor/lib/core.js'
+import markdown from 'refractor/lang/markdown.js'
+import { rehypePrismGenerator } from 'rehype-prism-plus'
+
+refractor.register(markdown)
+const myPrismPlugin = rehypePrismGenerator(refractor)
+```
+
 ## Styling
 
 To style the language tokens, you can just copy them from any prismjs compatible ones. Here's a list of [themes](https://github.com/PrismJS/prism-themes).
@@ -192,8 +206,10 @@ If you would like to show line numbers for all code blocks, without specifying t
 
 **Note**: This will wrongly assign a language class and the class might appear as `language-{1,3}` or `language-showLineNumbers`, but allow the language highlighting and line number function to work. An possible approach would be to add a placeholder like `unknown` so the `div` will have `class="language-unknown"`
 
+[rehype]: https://github.com/wooorm/rehype
 [prism]: http://prismjs.com/
 [refractor]: https://github.com/wooorm/refractor
+[rehype plugin]: https://github.com/rehypejs/rehype/blob/master/doc/plugins.md#using-plugins
 [xdm]: https://github.com/wooorm/xdm
 [mdx-bundler]: https://github.com/kentcdodds/mdx-bundler
 [next-mdx-remote]: https://github.com/hashicorp/next-mdx-remote

package-lock.json

@@ -1,7 +1,7 @@
 {
   "name": "rehype-prism-plus",
-  "version": "1.1.3",
-  "lockfileVersion": 2,
+  "version": "1.2.0",
+  "lockfileVersion": 1,
   "requires": true,
   "packages": {
     "": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "rehype-prism-plus",
-  "version": "1.1.3",
+  "version": "1.2.0",
   "description": "rehype plugin to highlight code blocks in HTML with Prism (via refractor) with line highlighting and line numbers",
   "source": "index.js",
   "files": [