Add Twemoji

package.json

@@ -14,6 +14,7 @@
     "@milkdown/plugin-block": "^7.1.0",
     "@milkdown/plugin-clipboard": "^7.1.0",
     "@milkdown/plugin-cursor": "^7.1.0",
+    "@milkdown/plugin-emoji": "^7.1.0",
     "@milkdown/plugin-history": "^7.1.0",
     "@milkdown/plugin-math": "^7.1.0",
     "@milkdown/plugin-slash": "^7.1.0",

pnpm-lock.yaml

@@ -7,6 +7,7 @@ specifiers:
   '@milkdown/plugin-block': ^7.1.0
   '@milkdown/plugin-clipboard': ^7.1.0
   '@milkdown/plugin-cursor': ^7.1.0
+  '@milkdown/plugin-emoji': ^7.1.0
   '@milkdown/plugin-history': ^7.1.0
   '@milkdown/plugin-math': ^7.1.0
   '@milkdown/plugin-slash': ^7.1.0
@@ -35,6 +36,7 @@ dependencies:
   '@milkdown/plugin-block': 7.1.0_732s7te4rg2orop6g3xf7k4a4q
   '@milkdown/plugin-clipboard': 7.1.0_732s7te4rg2orop6g3xf7k4a4q
   '@milkdown/plugin-cursor': 7.1.0_732s7te4rg2orop6g3xf7k4a4q
+  '@milkdown/plugin-emoji': 7.1.0_732s7te4rg2orop6g3xf7k4a4q
   '@milkdown/plugin-history': 7.1.0_732s7te4rg2orop6g3xf7k4a4q
   '@milkdown/plugin-math': 7.1.0_732s7te4rg2orop6g3xf7k4a4q
   '@milkdown/plugin-slash': 7.1.0_732s7te4rg2orop6g3xf7k4a4q
@@ -537,6 +539,29 @@ packages:
       - '@milkdown/transformer'
     dev: false
 
+  /@milkdown/plugin-emoji/7.1.0_732s7te4rg2orop6g3xf7k4a4q:
+    resolution: {integrity: sha512-4gkHn5fRlydJ8iBxbsYXji/TA0VOfma5EBgXPB2TSNM4JCVXsUH35lAZ5s8RHAsE6xrY619a5UBowarCtvcegQ==}
+    peerDependencies:
+      '@milkdown/core': ^7.0.0-next.0
+      '@milkdown/ctx': ^7.0.0-next.0
+      '@milkdown/prose': ^7.0.0-next.0
+      '@milkdown/transformer': ^7.0.0-next.0
+    dependencies:
+      '@milkdown/core': 7.1.0_c3r5dnopq2fkbj274fowd6pqe4
+      '@milkdown/ctx': 7.1.0
+      '@milkdown/exception': 7.1.0
+      '@milkdown/prose': 7.1.0
+      '@milkdown/transformer': 7.1.0_@milkdown+prose@7.1.0
+      '@milkdown/utils': 7.1.0_732s7te4rg2orop6g3xf7k4a4q
+      '@types/node-emoji': 1.8.2
+      emoji-regex: 10.2.1
+      node-emoji: 1.11.0
+      remark-emoji: 3.1.1
+      tslib: 2.5.0
+      twemoji: 14.0.2
+      unist-util-visit: 4.1.2
+    dev: false
+
   /@milkdown/plugin-history/7.1.0_732s7te4rg2orop6g3xf7k4a4q:
     resolution: {integrity: sha512-IMMRk7lG2yfLzf/9Ni1m+GLJyo1L4lZRbOgzvjhasY0zZQf+AI/jBHnLIqWH6jtOo5c5oZt/DF5EqObucuXmdA==}
     peerDependencies:
@@ -836,6 +861,10 @@ packages:
     resolution: {integrity: sha512-iiUgKzV9AuaEkZqkOLDIvlQiL6ltuZd9tGcW3gwpnX8JbuiuhFlEGmmFXEXkN50Cvq7Os88IY2v0dkDqXYWVgA==}
     dev: false
 
+  /@types/node-emoji/1.8.2:
+    resolution: {integrity: sha512-PfF1qL/9veo8BSHLV84C9ORNr3lHSlnWJ6yU8OdNufoftajeWHTLVbGHvp2B7e7DPDS9gMs6cfeSsqo5rqSitg==}
+    dev: false
+
   /@types/node-fetch/2.6.2:
     resolution: {integrity: sha512-DHqhlq5jeESLy19TYhLakJ07kNumXWjcDdxXsLUMJZ6ue8VZJj4kLPQVE/2mdHh3xZziNF1xppu5lwmS53HR+A==}
     dependencies:
@@ -1608,6 +1637,14 @@ packages:
       tslib: 2.5.0
     dev: false
 
+  /emoji-regex/10.2.1:
+    resolution: {integrity: sha512-97g6QgOk8zlDRdgq1WxwgTMgEWGVAQvB5Fdpgc1MkNy56la5SKP9GsMXKDOdqwn90/41a8yPwIGk1Y6WVbeMQA==}
+    dev: false
+
+  /emoticon/4.0.1:
+    resolution: {integrity: sha512-dqx7eA9YaqyvYtUhJwT4rC1HIp82j5ybS1/vQ42ur+jBe17dJMwZE4+gvL1XadSFfxaPFFGt3Xsw+Y8akThDlw==}
+    dev: false
+
   /entities/4.4.0:
     resolution: {integrity: sha512-oYp7156SP8LkeGD0GF85ad1X9Ai79WtRsZ2gxJqtBuzH+98YUV6jkHEKlZkMbcrjJjIVJNIDP/3WL9wQkoPbWA==}
     engines: {node: '>=0.12'}
@@ -2236,6 +2273,15 @@ packages:
       mime-types: 2.1.35
     dev: false
 
+  /fs-extra/8.1.0:
+    resolution: {integrity: sha512-yhlQgA6mnOJUKOsRUFsgJdQCvkKhcz8tlZG5HBQfReYZy46OwLcY+Zia0mtdHsOo9y/hP+CxMN0TU9QxoOtG4g==}
+    engines: {node: '>=6 <7 || >=8'}
+    dependencies:
+      graceful-fs: 4.2.11
+      jsonfile: 4.0.0
+      universalify: 0.1.2
+    dev: false
+
   /fs.realpath/1.0.0:
     resolution: {integrity: sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==}
     dev: true
@@ -2337,6 +2383,10 @@ packages:
       get-intrinsic: 1.2.0
     dev: true
 
+  /graceful-fs/4.2.11:
+    resolution: {integrity: sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==}
+    dev: false
+
   /grapheme-splitter/1.0.4:
     resolution: {integrity: sha512-bzh50DW9kTPM00T8y4o8vQg89Di9oLJVLW/KaOGIXJWP/iqCN6WKYkbNOF04vFLJhwcpYUh9ydh/+5vpOqV4YQ==}
     dev: true
@@ -2684,6 +2734,20 @@ packages:
       semver: 7.3.8
     dev: true
 
+  /jsonfile/4.0.0:
+    resolution: {integrity: sha1-h3Gq4HmbZAdrdmQPygWPnBDjPss=}
+    optionalDependencies:
+      graceful-fs: 4.2.11
+    dev: false
+
+  /jsonfile/5.0.0:
+    resolution: {integrity: sha512-NQRZ5CRo74MhMMC3/3r5g2k4fjodJ/wh8MxjFbCViWKFjxrnudWSY5vomh+23ZaXzAS7J3fBZIR2dV6WbmfM0w==}
+    dependencies:
+      universalify: 0.1.2
+    optionalDependencies:
+      graceful-fs: 4.2.11
+    dev: false
+
   /katex/0.13.24:
     resolution: {integrity: sha512-jZxYuKCma3VS5UuxOx/rFV1QyGSl3Uy/i0kTJF3HgQ5xMinCQVF8Zd4bMY/9aI9b9A2pjIBOsjSSm68ykTAr8w==}
     hasBin: true
@@ -2757,7 +2821,6 @@ packages:
 
   /lodash/4.17.21:
     resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==}
-    dev: true
 
   /longest-streak/3.1.0:
     resolution: {integrity: sha512-9Ri+o0JYgehTaVBBDoMqIl8GXtbWg711O3srftcHhZ0dqnETqLaoIK0x17fUw9rFSlK/0NlsKe0Ahhyl5pXE2g==}
@@ -3297,6 +3360,12 @@ packages:
       tslib: 2.5.0
     dev: false
 
+  /node-emoji/1.11.0:
+    resolution: {integrity: sha512-wo2DpQkQp7Sjm2A0cq+sN7EHKO6Sl0ctXeBdFZrL9T9+UywORbufTcTZxom8YqpLQt/FqNMUkOpkZrJVYSKD3A==}
+    dependencies:
+      lodash: 4.17.21
+    dev: false
+
   /node-fetch/2.6.9:
     resolution: {integrity: sha512-DJm/CJkZkRjKKj4Zi4BsKVZh3ValV5IR5s7LVZnW+6YMh0W1BfNA8XSs6DLMGYlId5F3KnA70uu2qepcR08Qqg==}
     engines: {node: 4.x || >=6.0.0}
@@ -3767,6 +3836,15 @@ packages:
       jsesc: 0.5.0
     dev: true
 
+  /remark-emoji/3.1.1:
+    resolution: {integrity: sha512-kVCTaHzX+/ls67mE8JsGd3ZX511p2FlAPmKhdGpRCb5z6GSwp+3sAIB5oTySIetPh7CtqfGf7JBUt5fyMjgOHw==}
+    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
+    dependencies:
+      emoticon: 4.0.1
+      mdast-util-find-and-replace: 2.2.2
+      node-emoji: 1.11.0
+    dev: false
+
   /remark-gfm/3.0.1:
     resolution: {integrity: sha512-lEFDoi2PICJyNrACFOfDD3JlLkuSbOa5Wd8EPt06HUdptv8Gn0bxYTdbU/XXQ3swAPkEaGxxPN9cbnMHvVu1Ig==}
     dependencies:
@@ -4139,6 +4217,19 @@ packages:
       typescript: 4.9.5
     dev: true
 
+  /twemoji-parser/14.0.0:
+    resolution: {integrity: sha512-9DUOTGLOWs0pFWnh1p6NF+C3CkQ96PWmEFwhOVmT3WbecRC+68AIqpsnJXygfkFcp4aXbOp8Dwbhh/HQgvoRxA==}
+    dev: false
+
+  /twemoji/14.0.2:
+    resolution: {integrity: sha512-BzOoXIe1QVdmsUmZ54xbEH+8AgtOKUiG53zO5vVP2iUu6h5u9lN15NcuS6te4OY96qx0H7JK9vjjl9WQbkTRuA==}
+    dependencies:
+      fs-extra: 8.1.0
+      jsonfile: 5.0.0
+      twemoji-parser: 14.0.0
+      universalify: 0.1.2
+    dev: false
+
   /type-check/0.4.0:
     resolution: {integrity: sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==}
     engines: {node: '>= 0.8.0'}
@@ -4229,6 +4320,11 @@ packages:
       unist-util-visit-parents: 5.1.3
     dev: false
 
+  /universalify/0.1.2:
+    resolution: {integrity: sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg==}
+    engines: {node: '>= 4.0.0'}
+    dev: false
+
   /upper-case-first/2.0.2:
     resolution: {integrity: sha512-514ppYHBaKwfJRK/pNC6c/OxfGa0obSnAl106u97Ed0I625Nin96KAjttZF6ZL3e1XLtphxnqrOi9iWgm+u+bg==}
     dependencies:

src/components/Milkdown/Editor.vue

@@ -9,6 +9,7 @@ import { tooltipFactory } from '@milkdown/plugin-tooltip'
 import { usePluginViewFactory } from '@prosemirror-adapter/vue'
 import { gfm } from '@milkdown/preset-gfm'
 import { clipboard } from '@milkdown/plugin-clipboard'
+import { emoji } from '@milkdown/plugin-emoji'
 import Tooltip from './Tooltip.vue'
 import Slash from './Slash.vue'
 
@@ -47,6 +48,7 @@ useEditor((root) => {
     .use(math)
     .use(gfm)
     .use(clipboard)
+    .use(emoji)
 })
 </script>