From 8de5dd1ef32064a6744e4d5a8d8c0f8ed24b61cc Mon Sep 17 00:00:00 2001 From: Cyan <920354583@qq.com> Date: Sat, 28 Dec 2024 22:10:06 +0800 Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=EF=BC=9A=E8=B0=83=E6=95=B4MD?= =?UTF-8?q?=E6=A0=B7=E5=BC=8F=EF=BC=8C=E6=96=B0=E5=A2=9EMD=E6=8F=92?= =?UTF-8?q?=E4=BB=B6=E5=8F=8A=E5=B7=A5=E5=85=B7=E6=A0=8F=E6=8C=89=E9=92=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 567 ++++++++++++++++++ package.json | 3 + .../Create/components/Editor/icon/callout.svg | 1 + .../Create/components/Editor/icon/check.svg | 1 + .../Create/components/Editor/icon/danger.svg | 1 + .../Create/components/Editor/icon/emoji.svg | 1 + .../Create/components/Editor/icon/marker.svg | 1 + .../Create/components/Editor/icon/note.svg | 1 + .../Create/components/Editor/icon/tip.svg | 1 + .../Create/components/Editor/icon/warning.svg | 1 + .../Create/components/Editor/markdown.scss | 267 ++++++++- .../Create/components/Editor/plugins.tsx | 77 +++ 12 files changed, 903 insertions(+), 19 deletions(-) create mode 100644 src/pages/Create/components/Editor/icon/callout.svg create mode 100644 src/pages/Create/components/Editor/icon/check.svg create mode 100644 src/pages/Create/components/Editor/icon/danger.svg create mode 100644 src/pages/Create/components/Editor/icon/emoji.svg create mode 100644 src/pages/Create/components/Editor/icon/marker.svg create mode 100644 src/pages/Create/components/Editor/icon/note.svg create mode 100644 src/pages/Create/components/Editor/icon/tip.svg create mode 100644 src/pages/Create/components/Editor/icon/warning.svg create mode 100644 src/pages/Create/components/Editor/plugins.tsx diff --git a/package-lock.json b/package-lock.json index 7d98c79..d380d74 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,6 +11,7 @@ "@bytemd/plugin-gemoji": "^1.21.0", "@bytemd/plugin-gfm": "^1.21.0", "@bytemd/plugin-highlight": "^1.21.0", + "@bytemd/plugin-math": "^1.21.0", "@bytemd/react": "^1.21.0", "antd": "^5.19.3", "apexcharts": "^3.41.0", @@ -28,6 +29,8 @@ "react-icons": "^4.12.0", "react-router-dom": "^6.14.2", "react-toastify": "^9.1.3", + "rehype-callouts": "^1.4.1", + "remark-flexible-markers": "^1.2.1", "sass": "^1.77.8", "sort-by": "^0.0.2", "vite-plugin-sass-dts": "^1.3.25", @@ -514,6 +517,19 @@ "bytemd": "^1.5.0" } }, + "node_modules/@bytemd/plugin-math": { + "version": "1.21.0", + "resolved": "https://registry.npmmirror.com/@bytemd/plugin-math/-/plugin-math-1.21.0.tgz", + "integrity": "sha512-SkKTuPX8D+3x3aVRfZbCGg52mUDar54zn/cbnPY7RYqGUQRz0tSXVApC4mJxfzWpxvPnbjkmy742NVriDUoFrw==", + "dependencies": { + "@types/katex": "^0.16.0", + "katex": "^0.16.4", + "remark-math": "^5.1.1" + }, + "peerDependencies": { + "bytemd": "^1.5.0" + } + }, "node_modules/@bytemd/react": { "version": "1.21.0", "resolved": "https://registry.npmmirror.com/@bytemd/react/-/react-1.21.0.tgz", @@ -2377,6 +2393,11 @@ "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.12.tgz", "integrity": "sha512-Hr5Jfhc9eYOQNPYO5WLDq/n4jqijdHNlDXjuAQkkt+mWdQR+XJToOHrsD4cPaMXpn6KO7y2+wM8AZEs8VpBLVA==" }, + "node_modules/@types/katex": { + "version": "0.16.7", + "resolved": "https://registry.npmmirror.com/@types/katex/-/katex-0.16.7.tgz", + "integrity": "sha512-HMwFiRujE5PjrgwHQ25+bsLJgowjGjm5Z8FVSf0N6PwgJrwxH0QxzHYDcKsTfV3wva0vzrpqMTJS2jXPr5BMEQ==" + }, "node_modules/@types/lodash": { "version": "4.17.13", "resolved": "https://registry.npmmirror.com/@types/lodash/-/lodash-4.17.13.tgz", @@ -3755,6 +3776,18 @@ "node": ">=8" } }, + "node_modules/devlop": { + "version": "1.1.0", + "resolved": "https://registry.npmmirror.com/devlop/-/devlop-1.1.0.tgz", + "integrity": "sha512-RWmIqhcFf1lRYBvNmr7qTNuyCt/7/ns2jbpp1+PalgE/rDQcBT0fioSMUpJ93irlUhC5hrg4cYqe6U+0ImW0rA==", + "dependencies": { + "dequal": "^2.0.0" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/wooorm" + } + }, "node_modules/dicebear": { "version": "9.2.1", "resolved": "https://registry.npmmirror.com/dicebear/-/dicebear-9.2.1.tgz", @@ -3891,6 +3924,17 @@ "node": ">=10.13.0" } }, + "node_modules/entities": { + "version": "4.5.0", + "resolved": "https://registry.npmmirror.com/entities/-/entities-4.5.0.tgz", + "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==", + "engines": { + "node": ">=0.12" + }, + "funding": { + "url": "https://github.com/fb55/entities?sponsor=1" + } + }, "node_modules/es-module-lexer": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.3.0.tgz", @@ -4424,6 +4468,145 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/hast-util-from-html": { + "version": "2.0.3", + "resolved": "https://registry.npmmirror.com/hast-util-from-html/-/hast-util-from-html-2.0.3.tgz", + "integrity": "sha512-CUSRHXyKjzHov8yKsQjGOElXy/3EKpyX56ELnkHH34vDVw1N1XSQ1ZcAvTyAPtGqLTuKP/uxM+aLkSPqF/EtMw==", + "dependencies": { + "@types/hast": "^3.0.0", + "devlop": "^1.1.0", + "hast-util-from-parse5": "^8.0.0", + "parse5": "^7.0.0", + "vfile": "^6.0.0", + "vfile-message": "^4.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/hast-util-from-html/node_modules/@types/hast": { + "version": "3.0.4", + "resolved": "https://registry.npmmirror.com/@types/hast/-/hast-3.0.4.tgz", + "integrity": "sha512-WPs+bbQw5aCj+x6laNGWLH3wviHtoCv/P3+otBhbOhJgG8qtpdAMlTCxLtsTWA7LH1Oh/bFCHsBn0TPS5m30EQ==", + "dependencies": { + "@types/unist": "*" + } + }, + "node_modules/hast-util-from-html/node_modules/@types/unist": { + "version": "3.0.3", + "resolved": "https://registry.npmmirror.com/@types/unist/-/unist-3.0.3.tgz", + "integrity": "sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==" + }, + "node_modules/hast-util-from-html/node_modules/hast-util-from-parse5": { + "version": "8.0.2", + "resolved": "https://registry.npmmirror.com/hast-util-from-parse5/-/hast-util-from-parse5-8.0.2.tgz", + "integrity": "sha512-SfMzfdAi/zAoZ1KkFEyyeXBn7u/ShQrfd675ZEE9M3qj+PMFX05xubzRyF76CCSJu8au9jgVxDV1+okFvgZU4A==", + "dependencies": { + "@types/hast": "^3.0.0", + "@types/unist": "^3.0.0", + "devlop": "^1.0.0", + "hastscript": "^9.0.0", + "property-information": "^6.0.0", + "vfile": "^6.0.0", + "vfile-location": "^5.0.0", + "web-namespaces": "^2.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/hast-util-from-html/node_modules/hast-util-parse-selector": { + "version": "4.0.0", + "resolved": "https://registry.npmmirror.com/hast-util-parse-selector/-/hast-util-parse-selector-4.0.0.tgz", + "integrity": "sha512-wkQCkSYoOGCRKERFWcxMVMOcYE2K1AaNLU8DXS9arxnLOUEWbOXKXiJUNzEpqZ3JOKpnha3jkFrumEjVliDe7A==", + "dependencies": { + "@types/hast": "^3.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/hast-util-from-html/node_modules/hastscript": { + "version": "9.0.0", + "resolved": "https://registry.npmmirror.com/hastscript/-/hastscript-9.0.0.tgz", + "integrity": "sha512-jzaLBGavEDKHrc5EfFImKN7nZKKBdSLIdGvCwDZ9TfzbF2ffXiov8CKE445L2Z1Ek2t/m4SKQ2j6Ipv7NyUolw==", + "dependencies": { + "@types/hast": "^3.0.0", + "comma-separated-tokens": "^2.0.0", + "hast-util-parse-selector": "^4.0.0", + "property-information": "^6.0.0", + "space-separated-tokens": "^2.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/hast-util-from-html/node_modules/parse5": { + "version": "7.2.1", + "resolved": "https://registry.npmmirror.com/parse5/-/parse5-7.2.1.tgz", + "integrity": "sha512-BuBYQYlv1ckiPdQi/ohiivi9Sagc9JG+Ozs0r7b/0iK3sKmrb0b9FdWdBbOdx6hBCM/F9Ir82ofnBhtZOjCRPQ==", + "dependencies": { + "entities": "^4.5.0" + }, + "funding": { + "url": "https://github.com/inikulin/parse5?sponsor=1" + } + }, + "node_modules/hast-util-from-html/node_modules/unist-util-stringify-position": { + "version": "4.0.0", + "resolved": "https://registry.npmmirror.com/unist-util-stringify-position/-/unist-util-stringify-position-4.0.0.tgz", + "integrity": "sha512-0ASV06AAoKCDkS2+xw5RXJywruurpbC4JZSm7nr7MOt1ojAzvyyaO+UxZf18j8FCF6kmzCZKcAgN/yu2gm2XgQ==", + "dependencies": { + "@types/unist": "^3.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/hast-util-from-html/node_modules/vfile": { + "version": "6.0.3", + "resolved": "https://registry.npmmirror.com/vfile/-/vfile-6.0.3.tgz", + "integrity": "sha512-KzIbH/9tXat2u30jf+smMwFCsno4wHVdNmzFyL+T/L3UGqqk6JKfVqOFOZEpZSHADH1k40ab6NUIXZq422ov3Q==", + "dependencies": { + "@types/unist": "^3.0.0", + "vfile-message": "^4.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/hast-util-from-html/node_modules/vfile-location": { + "version": "5.0.3", + "resolved": "https://registry.npmmirror.com/vfile-location/-/vfile-location-5.0.3.tgz", + "integrity": "sha512-5yXvWDEgqeiYiBe1lbxYF7UMAIm/IcopxMHrMQDq3nvKcjPKIhZklUKL+AE7J7uApI4kwe2snsK+eI6UTj9EHg==", + "dependencies": { + "@types/unist": "^3.0.0", + "vfile": "^6.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/hast-util-from-html/node_modules/vfile-message": { + "version": "4.0.2", + "resolved": "https://registry.npmmirror.com/vfile-message/-/vfile-message-4.0.2.tgz", + "integrity": "sha512-jRDZ1IMLttGj41KcZvlrYAaI3CfqpLpfpf+Mfig13viT6NKvRzWZ+lXz0Y5D60w6uJIBAOGq9mSHf0gktF0duw==", + "dependencies": { + "@types/unist": "^3.0.0", + "unist-util-stringify-position": "^4.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, "node_modules/hast-util-from-parse5": { "version": "7.1.2", "resolved": "https://registry.npmmirror.com/hast-util-from-parse5/-/hast-util-from-parse5-7.1.2.tgz", @@ -4443,6 +4626,26 @@ "url": "https://opencollective.com/unified" } }, + "node_modules/hast-util-is-element": { + "version": "3.0.0", + "resolved": "https://registry.npmmirror.com/hast-util-is-element/-/hast-util-is-element-3.0.0.tgz", + "integrity": "sha512-Val9mnv2IWpLbNPqc/pUem+a7Ipj2aHacCwgNfTiK0vJKl0LF+4Ba4+v1oPHFpf3bLYmreq0/l3Gud9S5OH42g==", + "dependencies": { + "@types/hast": "^3.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/hast-util-is-element/node_modules/@types/hast": { + "version": "3.0.4", + "resolved": "https://registry.npmmirror.com/@types/hast/-/hast-3.0.4.tgz", + "integrity": "sha512-WPs+bbQw5aCj+x6laNGWLH3wviHtoCv/P3+otBhbOhJgG8qtpdAMlTCxLtsTWA7LH1Oh/bFCHsBn0TPS5m30EQ==", + "dependencies": { + "@types/unist": "*" + } + }, "node_modules/hast-util-parse-selector": { "version": "3.1.1", "resolved": "https://registry.npmmirror.com/hast-util-parse-selector/-/hast-util-parse-selector-3.1.1.tgz", @@ -4982,6 +5185,29 @@ "graceful-fs": "^4.1.6" } }, + "node_modules/katex": { + "version": "0.16.18", + "resolved": "https://registry.npmmirror.com/katex/-/katex-0.16.18.tgz", + "integrity": "sha512-LRuk0rPdXrecAFwQucYjMiIs0JFefk6N1q/04mlw14aVIVgxq1FO0MA9RiIIGVaKOB5GIP5GH4aBBNraZERmaQ==", + "funding": [ + "https://opencollective.com/katex", + "https://github.com/sponsors/katex" + ], + "dependencies": { + "commander": "^8.3.0" + }, + "bin": { + "katex": "cli.js" + } + }, + "node_modules/katex/node_modules/commander": { + "version": "8.3.0", + "resolved": "https://registry.npmmirror.com/commander/-/commander-8.3.0.tgz", + "integrity": "sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==", + "engines": { + "node": ">= 12" + } + }, "node_modules/keyv": { "version": "4.5.4", "resolved": "https://registry.npmmirror.com/keyv/-/keyv-4.5.4.tgz", @@ -5296,6 +5522,20 @@ "url": "https://opencollective.com/unified" } }, + "node_modules/mdast-util-math": { + "version": "2.0.2", + "resolved": "https://registry.npmmirror.com/mdast-util-math/-/mdast-util-math-2.0.2.tgz", + "integrity": "sha512-8gmkKVp9v6+Tgjtq6SYx9kGPpTf6FVYRa53/DLh479aldR9AyP48qeVOgNZ5X7QUK7nOy4yw7vg6mbiGcs9jWQ==", + "dependencies": { + "@types/mdast": "^3.0.0", + "longest-streak": "^3.0.0", + "mdast-util-to-markdown": "^1.3.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, "node_modules/mdast-util-phrasing": { "version": "3.0.1", "resolved": "https://registry.npmmirror.com/mdast-util-phrasing/-/mdast-util-phrasing-3.0.1.tgz", @@ -5568,6 +5808,24 @@ "url": "https://opencollective.com/unified" } }, + "node_modules/micromark-extension-math": { + "version": "2.1.2", + "resolved": "https://registry.npmmirror.com/micromark-extension-math/-/micromark-extension-math-2.1.2.tgz", + "integrity": "sha512-es0CcOV89VNS9wFmyn+wyFTKweXGW4CEvdaAca6SWRWPyYCbBisnjaHLjWO4Nszuiud84jCpkHsqAJoa768Pvg==", + "dependencies": { + "@types/katex": "^0.16.0", + "katex": "^0.16.0", + "micromark-factory-space": "^1.0.0", + "micromark-util-character": "^1.0.0", + "micromark-util-symbol": "^1.0.0", + "micromark-util-types": "^1.0.0", + "uvu": "^0.5.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, "node_modules/micromark-factory-destination": { "version": "1.1.0", "resolved": "https://registry.npmmirror.com/micromark-factory-destination/-/micromark-factory-destination-1.1.0.tgz", @@ -7355,6 +7613,101 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/rehype-callouts": { + "version": "1.4.1", + "resolved": "https://registry.npmmirror.com/rehype-callouts/-/rehype-callouts-1.4.1.tgz", + "integrity": "sha512-M0HQ6tTeWoia5K8ty2EG/U9UMRlO4EG9opA/pZMNWRU+UR5amMczGu41unjPcLZ+4FKbLjGbPBBBFaX8oW7T2A==", + "dependencies": { + "@types/hast": "^3.0.4", + "hast-util-from-html": "^2.0.3", + "hast-util-is-element": "^3.0.0", + "hastscript": "^9.0.0", + "unist-util-visit": "^5.0.0" + }, + "engines": { + "node": "^16.0.0 || ^18.0.0 || >=20.0.0" + } + }, + "node_modules/rehype-callouts/node_modules/@types/hast": { + "version": "3.0.4", + "resolved": "https://registry.npmmirror.com/@types/hast/-/hast-3.0.4.tgz", + "integrity": "sha512-WPs+bbQw5aCj+x6laNGWLH3wviHtoCv/P3+otBhbOhJgG8qtpdAMlTCxLtsTWA7LH1Oh/bFCHsBn0TPS5m30EQ==", + "dependencies": { + "@types/unist": "*" + } + }, + "node_modules/rehype-callouts/node_modules/@types/unist": { + "version": "3.0.3", + "resolved": "https://registry.npmmirror.com/@types/unist/-/unist-3.0.3.tgz", + "integrity": "sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==" + }, + "node_modules/rehype-callouts/node_modules/hast-util-parse-selector": { + "version": "4.0.0", + "resolved": "https://registry.npmmirror.com/hast-util-parse-selector/-/hast-util-parse-selector-4.0.0.tgz", + "integrity": "sha512-wkQCkSYoOGCRKERFWcxMVMOcYE2K1AaNLU8DXS9arxnLOUEWbOXKXiJUNzEpqZ3JOKpnha3jkFrumEjVliDe7A==", + "dependencies": { + "@types/hast": "^3.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/rehype-callouts/node_modules/hastscript": { + "version": "9.0.0", + "resolved": "https://registry.npmmirror.com/hastscript/-/hastscript-9.0.0.tgz", + "integrity": "sha512-jzaLBGavEDKHrc5EfFImKN7nZKKBdSLIdGvCwDZ9TfzbF2ffXiov8CKE445L2Z1Ek2t/m4SKQ2j6Ipv7NyUolw==", + "dependencies": { + "@types/hast": "^3.0.0", + "comma-separated-tokens": "^2.0.0", + "hast-util-parse-selector": "^4.0.0", + "property-information": "^6.0.0", + "space-separated-tokens": "^2.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/rehype-callouts/node_modules/unist-util-is": { + "version": "6.0.0", + "resolved": "https://registry.npmmirror.com/unist-util-is/-/unist-util-is-6.0.0.tgz", + "integrity": "sha512-2qCTHimwdxLfz+YzdGfkqNlH0tLi9xjTnHddPmJwtIG9MGsdbutfTc4P+haPD7l7Cjxf/WZj+we5qfVPvvxfYw==", + "dependencies": { + "@types/unist": "^3.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/rehype-callouts/node_modules/unist-util-visit": { + "version": "5.0.0", + "resolved": "https://registry.npmmirror.com/unist-util-visit/-/unist-util-visit-5.0.0.tgz", + "integrity": "sha512-MR04uvD+07cwl/yhVuVWAtw+3GOR/knlL55Nd/wAdblk27GCVt3lqpTivy/tkJcZoNPzTwS1Y+KMojlLDhoTzg==", + "dependencies": { + "@types/unist": "^3.0.0", + "unist-util-is": "^6.0.0", + "unist-util-visit-parents": "^6.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/rehype-callouts/node_modules/unist-util-visit-parents": { + "version": "6.0.1", + "resolved": "https://registry.npmmirror.com/unist-util-visit-parents/-/unist-util-visit-parents-6.0.1.tgz", + "integrity": "sha512-L/PqWzfTP9lzzEa6CKs0k2nARxTdZduw3zyh8d2NVBnsyvHjSX4TWse388YrrQKbvI8w20fGjGlhgT96WwKykw==", + "dependencies": { + "@types/unist": "^3.0.0", + "unist-util-is": "^6.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, "node_modules/rehype-raw": { "version": "6.1.1", "resolved": "https://registry.npmmirror.com/rehype-raw/-/rehype-raw-6.1.1.tgz", @@ -7400,6 +7753,72 @@ "url": "https://opencollective.com/unified" } }, + "node_modules/remark-flexible-markers": { + "version": "1.2.1", + "resolved": "https://registry.npmmirror.com/remark-flexible-markers/-/remark-flexible-markers-1.2.1.tgz", + "integrity": "sha512-yAqJ2bRDWfBC7G0A6lHsifMQpzeID10RQc5Pgm29jyAzdJQ7pJozDROeMEk7GW1KznSxIjO5be+fn7Dh+Fbo4A==", + "dependencies": { + "@types/mdast": "^4.0.3", + "unist-builder": "^4.0.0", + "unist-util-find-after": "^5.0.0", + "unist-util-find-all-after": "^5.0.0", + "unist-util-find-all-before": "^5.0.0", + "unist-util-find-between-all": "^1.0.5", + "unist-util-visit": "^5.0.0" + } + }, + "node_modules/remark-flexible-markers/node_modules/@types/mdast": { + "version": "4.0.4", + "resolved": "https://registry.npmmirror.com/@types/mdast/-/mdast-4.0.4.tgz", + "integrity": "sha512-kGaNbPh1k7AFzgpud/gMdvIm5xuECykRR+JnWKQno9TAXVa6WIVCGTPvYGekIDL4uwCZQSYbUxNBSb1aUo79oA==", + "dependencies": { + "@types/unist": "*" + } + }, + "node_modules/remark-flexible-markers/node_modules/@types/unist": { + "version": "3.0.3", + "resolved": "https://registry.npmmirror.com/@types/unist/-/unist-3.0.3.tgz", + "integrity": "sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==" + }, + "node_modules/remark-flexible-markers/node_modules/unist-util-is": { + "version": "6.0.0", + "resolved": "https://registry.npmmirror.com/unist-util-is/-/unist-util-is-6.0.0.tgz", + "integrity": "sha512-2qCTHimwdxLfz+YzdGfkqNlH0tLi9xjTnHddPmJwtIG9MGsdbutfTc4P+haPD7l7Cjxf/WZj+we5qfVPvvxfYw==", + "dependencies": { + "@types/unist": "^3.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/remark-flexible-markers/node_modules/unist-util-visit": { + "version": "5.0.0", + "resolved": "https://registry.npmmirror.com/unist-util-visit/-/unist-util-visit-5.0.0.tgz", + "integrity": "sha512-MR04uvD+07cwl/yhVuVWAtw+3GOR/knlL55Nd/wAdblk27GCVt3lqpTivy/tkJcZoNPzTwS1Y+KMojlLDhoTzg==", + "dependencies": { + "@types/unist": "^3.0.0", + "unist-util-is": "^6.0.0", + "unist-util-visit-parents": "^6.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/remark-flexible-markers/node_modules/unist-util-visit-parents": { + "version": "6.0.1", + "resolved": "https://registry.npmmirror.com/unist-util-visit-parents/-/unist-util-visit-parents-6.0.1.tgz", + "integrity": "sha512-L/PqWzfTP9lzzEa6CKs0k2nARxTdZduw3zyh8d2NVBnsyvHjSX4TWse388YrrQKbvI8w20fGjGlhgT96WwKykw==", + "dependencies": { + "@types/unist": "^3.0.0", + "unist-util-is": "^6.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, "node_modules/remark-gemoji": { "version": "7.0.1", "resolved": "https://registry.npmmirror.com/remark-gemoji/-/remark-gemoji-7.0.1.tgz", @@ -7432,6 +7851,21 @@ "url": "https://opencollective.com/unified" } }, + "node_modules/remark-math": { + "version": "5.1.1", + "resolved": "https://registry.npmmirror.com/remark-math/-/remark-math-5.1.1.tgz", + "integrity": "sha512-cE5T2R/xLVtfFI4cCePtiRn+e6jKMtFDR3P8V3qpv8wpKjwvHoBA4eJzvX+nVrnlNy0911bdGmuspCSwetfYHw==", + "dependencies": { + "@types/mdast": "^3.0.0", + "mdast-util-math": "^2.0.0", + "micromark-extension-math": "^2.0.0", + "unified": "^10.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, "node_modules/remark-parse": { "version": "10.0.2", "resolved": "https://registry.npmmirror.com/remark-parse/-/remark-parse-10.0.2.tgz", @@ -8280,6 +8714,139 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/unist-builder": { + "version": "4.0.0", + "resolved": "https://registry.npmmirror.com/unist-builder/-/unist-builder-4.0.0.tgz", + "integrity": "sha512-wmRFnH+BLpZnTKpc5L7O67Kac89s9HMrtELpnNaE6TAobq5DTZZs5YaTQfAZBA9bFPECx2uVAPO31c+GVug8mg==", + "dependencies": { + "@types/unist": "^3.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/unist-builder/node_modules/@types/unist": { + "version": "3.0.3", + "resolved": "https://registry.npmmirror.com/@types/unist/-/unist-3.0.3.tgz", + "integrity": "sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==" + }, + "node_modules/unist-util-find-after": { + "version": "5.0.0", + "resolved": "https://registry.npmmirror.com/unist-util-find-after/-/unist-util-find-after-5.0.0.tgz", + "integrity": "sha512-amQa0Ep2m6hE2g72AugUItjbuM8X8cGQnFoHk0pGfrFeT9GZhzN5SW8nRsiGKK7Aif4CrACPENkA6P/Lw6fHGQ==", + "dependencies": { + "@types/unist": "^3.0.0", + "unist-util-is": "^6.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/unist-util-find-after/node_modules/@types/unist": { + "version": "3.0.3", + "resolved": "https://registry.npmmirror.com/@types/unist/-/unist-3.0.3.tgz", + "integrity": "sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==" + }, + "node_modules/unist-util-find-after/node_modules/unist-util-is": { + "version": "6.0.0", + "resolved": "https://registry.npmmirror.com/unist-util-is/-/unist-util-is-6.0.0.tgz", + "integrity": "sha512-2qCTHimwdxLfz+YzdGfkqNlH0tLi9xjTnHddPmJwtIG9MGsdbutfTc4P+haPD7l7Cjxf/WZj+we5qfVPvvxfYw==", + "dependencies": { + "@types/unist": "^3.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/unist-util-find-all-after": { + "version": "5.0.0", + "resolved": "https://registry.npmmirror.com/unist-util-find-all-after/-/unist-util-find-all-after-5.0.0.tgz", + "integrity": "sha512-nGmOYvTSdGcI4RvrUNfe0mOsqqbbJOtqCQsppsY9KZjmv3nwM3YRgNBwFPdZ8Y+iv9Z/2PDjR9u6u+uK62XTTg==", + "dependencies": { + "@types/unist": "^3.0.0", + "unist-util-is": "^6.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/unist-util-find-all-after/node_modules/@types/unist": { + "version": "3.0.3", + "resolved": "https://registry.npmmirror.com/@types/unist/-/unist-3.0.3.tgz", + "integrity": "sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==" + }, + "node_modules/unist-util-find-all-after/node_modules/unist-util-is": { + "version": "6.0.0", + "resolved": "https://registry.npmmirror.com/unist-util-is/-/unist-util-is-6.0.0.tgz", + "integrity": "sha512-2qCTHimwdxLfz+YzdGfkqNlH0tLi9xjTnHddPmJwtIG9MGsdbutfTc4P+haPD7l7Cjxf/WZj+we5qfVPvvxfYw==", + "dependencies": { + "@types/unist": "^3.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/unist-util-find-all-before": { + "version": "5.0.0", + "resolved": "https://registry.npmmirror.com/unist-util-find-all-before/-/unist-util-find-all-before-5.0.0.tgz", + "integrity": "sha512-zir6a7GsXfdn4YAWR4F3hLNKZjTjLBJurdyquysvmX38xbftS1+qwvEhutxxHLq0Pp1tW5V1TDiuj+qluuOnKw==", + "dependencies": { + "@types/unist": "^3.0.0", + "unist-util-is": "^6.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/unist-util-find-all-before/node_modules/@types/unist": { + "version": "3.0.3", + "resolved": "https://registry.npmmirror.com/@types/unist/-/unist-3.0.3.tgz", + "integrity": "sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==" + }, + "node_modules/unist-util-find-all-before/node_modules/unist-util-is": { + "version": "6.0.0", + "resolved": "https://registry.npmmirror.com/unist-util-is/-/unist-util-is-6.0.0.tgz", + "integrity": "sha512-2qCTHimwdxLfz+YzdGfkqNlH0tLi9xjTnHddPmJwtIG9MGsdbutfTc4P+haPD7l7Cjxf/WZj+we5qfVPvvxfYw==", + "dependencies": { + "@types/unist": "^3.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, + "node_modules/unist-util-find-between-all": { + "version": "1.0.5", + "resolved": "https://registry.npmmirror.com/unist-util-find-between-all/-/unist-util-find-between-all-1.0.5.tgz", + "integrity": "sha512-zqpIPPzhbG6fI5lqYZhS1UPsMvxV9IY6dwbizLHLPAGNb3pQT3mTvmzXpP1K2lmUh4bhUwAN4gkQcxhR/OLS4g==", + "dependencies": { + "@types/unist": "^3.0.0", + "unist-util-is": "^6.0.0" + } + }, + "node_modules/unist-util-find-between-all/node_modules/@types/unist": { + "version": "3.0.3", + "resolved": "https://registry.npmmirror.com/@types/unist/-/unist-3.0.3.tgz", + "integrity": "sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==" + }, + "node_modules/unist-util-find-between-all/node_modules/unist-util-is": { + "version": "6.0.0", + "resolved": "https://registry.npmmirror.com/unist-util-is/-/unist-util-is-6.0.0.tgz", + "integrity": "sha512-2qCTHimwdxLfz+YzdGfkqNlH0tLi9xjTnHddPmJwtIG9MGsdbutfTc4P+haPD7l7Cjxf/WZj+we5qfVPvvxfYw==", + "dependencies": { + "@types/unist": "^3.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, "node_modules/unist-util-generated": { "version": "2.0.1", "resolved": "https://registry.npmmirror.com/unist-util-generated/-/unist-util-generated-2.0.1.tgz", diff --git a/package.json b/package.json index 2ef1d5b..beab5e9 100644 --- a/package.json +++ b/package.json @@ -17,6 +17,7 @@ "@bytemd/plugin-gemoji": "^1.21.0", "@bytemd/plugin-gfm": "^1.21.0", "@bytemd/plugin-highlight": "^1.21.0", + "@bytemd/plugin-math": "^1.21.0", "@bytemd/react": "^1.21.0", "antd": "^5.19.3", "apexcharts": "^3.41.0", @@ -34,6 +35,8 @@ "react-icons": "^4.12.0", "react-router-dom": "^6.14.2", "react-toastify": "^9.1.3", + "rehype-callouts": "^1.4.1", + "remark-flexible-markers": "^1.2.1", "sass": "^1.77.8", "sort-by": "^0.0.2", "vite-plugin-sass-dts": "^1.3.25", diff --git a/src/pages/Create/components/Editor/icon/callout.svg b/src/pages/Create/components/Editor/icon/callout.svg new file mode 100644 index 0000000..8972ade --- /dev/null +++ b/src/pages/Create/components/Editor/icon/callout.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/pages/Create/components/Editor/icon/check.svg b/src/pages/Create/components/Editor/icon/check.svg new file mode 100644 index 0000000..d4b797d --- /dev/null +++ b/src/pages/Create/components/Editor/icon/check.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/pages/Create/components/Editor/icon/danger.svg b/src/pages/Create/components/Editor/icon/danger.svg new file mode 100644 index 0000000..d1c46d4 --- /dev/null +++ b/src/pages/Create/components/Editor/icon/danger.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/pages/Create/components/Editor/icon/emoji.svg b/src/pages/Create/components/Editor/icon/emoji.svg new file mode 100644 index 0000000..86506cd --- /dev/null +++ b/src/pages/Create/components/Editor/icon/emoji.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/pages/Create/components/Editor/icon/marker.svg b/src/pages/Create/components/Editor/icon/marker.svg new file mode 100644 index 0000000..f8be3ab --- /dev/null +++ b/src/pages/Create/components/Editor/icon/marker.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/pages/Create/components/Editor/icon/note.svg b/src/pages/Create/components/Editor/icon/note.svg new file mode 100644 index 0000000..116b679 --- /dev/null +++ b/src/pages/Create/components/Editor/icon/note.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/pages/Create/components/Editor/icon/tip.svg b/src/pages/Create/components/Editor/icon/tip.svg new file mode 100644 index 0000000..6d16afe --- /dev/null +++ b/src/pages/Create/components/Editor/icon/tip.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/pages/Create/components/Editor/icon/warning.svg b/src/pages/Create/components/Editor/icon/warning.svg new file mode 100644 index 0000000..8c3027a --- /dev/null +++ b/src/pages/Create/components/Editor/icon/warning.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/pages/Create/components/Editor/markdown.scss b/src/pages/Create/components/Editor/markdown.scss index c2b4ff8..0631e7d 100644 --- a/src/pages/Create/components/Editor/markdown.scss +++ b/src/pages/Create/components/Editor/markdown.scss @@ -14,7 +14,7 @@ h4, h5, h6 { - @apply text-black transition-colors; + @apply text-black dark:text-gray transition-colors; } h1 { @@ -27,21 +27,21 @@ } h2 { - @apply relative text-lg my-8 pl-5; + @apply relative text-lg my-6; - &::before { - content: ""; - @apply absolute left-0 top-[50%] -translate-y-1/2 w-2 h-full bg-primary; - } + // &::before { + // content: ""; + // @apply absolute left-0 top-[50%] -translate-y-1/2 w-2 h-full bg-primary; + // } } h3 { - @apply relative text-lg my-5 pl-5; + @apply relative text-lg my-5; - &::before { - content: "#"; - @apply absolute left-0 top-[50%] -translate-y-1/2 text-primary; - } + // &::before { + // content: "#"; + // @apply absolute left-0 top-[50%] -translate-y-1/2 text-primary; + // } } h4, @@ -59,8 +59,71 @@ @apply bg-[rgba(13,110,253,0.1)] dark:bg-[#334052] text-[#0d6efd] rounded-md py-1 px-2 text-sm transition-colors; } - li { - @apply my-2.5 list-decimal ml-14; + // 任务列表 + li.task-list-item { + @apply my-2.5; + }; + + li:not(.task-list-item) { + @apply my-2.5; + } + + // 无序列表 + ul:not(.contains-task-list) { + @apply list-disc ml-6; + } + + // 有序列表 + ol:not([start]) { + counter-reset: counter; + } + + ol > li:not([id^="user-content-"]) { + + &::before { + @apply inline-block w-4 h-4 mt-1 mr-1 leading-none rounded-full text-center text-sm border border-[#11181C] dark:border-gray; + + counter-increment: counter; + content: counter(counter); + } + + & ol > li::before { + @apply inline-block ml-5 border-0 text-base mt-0 leading-normal; + + content: counter(counter) "."; + } + } + + // 引用 + blockquote { + @apply my-5 pl-4 bg-[rgba(246,248,250)] border-l-[4px] border-[#11181C] dark:bg-[rgba(246,248,250,0.1)]; + } + + // 脚注 + .sr-only { + @apply text-[#EAB308] w-full overflow-visible my-10 before:content-['']; + + &::before { + @apply block w-full h-[1px] bg-gray mb-2; + } + } + + ol > li[id^="user-content-"] { + @apply list-decimal ml-3; + } + + // 提示块 + .callout-content { + @apply pt-1; + + & > p { + @apply mb-0; + } + } + + // 数学公式 + .katex { + @apply text-base; } a { @@ -69,10 +132,10 @@ p { @apply leading-9 mb-2; + } - img { - @apply rounded-xl cursor-pointer transition-all; - } + img { + @apply rounded-xl cursor-pointer transition-all mt-2; } strong { @@ -83,13 +146,13 @@ @apply w-full; th { - @apply bg-[#f1f7fd]; + @apply bg-[#f1f7fd] dark:bg-[#334052]; } tr, th, td { - @apply border-[#eee] p-[10px_20px]; + @apply border p-[10px_20px]; } } @@ -100,4 +163,170 @@ position: relative; cursor: not-allowed; } -} \ No newline at end of file +}.markdown-body { + pre { + margin: 15px 0; + + code.hljs { + border-radius: 10px; + font-weight: 400; + } + } + + h1, + h2, + h3, + h4, + h5, + h6 { + @apply text-black dark:text-gray transition-colors; + } + + h1 { + @apply text-2xl my-6 pb-3 border-b border-[#eee]; + + // &::before { + // content: "✨️"; + // @apply pr-3; + // } + } + + h2 { + @apply relative text-lg my-6; + + // &::before { + // content: ""; + // @apply absolute left-0 top-[50%] -translate-y-1/2 w-2 h-full bg-primary; + // } + } + + h3 { + @apply relative text-lg my-5; + + // &::before { + // content: "#"; + // @apply absolute left-0 top-[50%] -translate-y-1/2 text-primary; + // } + } + + h4, + h5, + h6 { + @apply relative text-lg my-3; + } + + hr { + @apply my-5 border-[#eee] transition-colors; + } + + p code, + ul code { + @apply bg-[rgba(13,110,253,0.1)] dark:bg-[#334052] text-[#0d6efd] rounded-md py-1 px-2 text-sm transition-colors; + } + + // 任务列表 + li.task-list-item { + @apply my-2.5; + }; + + li:not(.task-list-item) { + @apply my-2.5; + } + + // 无序列表 + ul:not(.contains-task-list) { + @apply list-disc ml-6; + } + + // 有序列表 + ol:not([start]) { + counter-reset: counter; + } + + ol > li:not([id^="user-content-"]) { + + &::before { + @apply inline-block w-4 h-4 mt-1 mr-1 leading-none rounded-full text-center text-sm border border-[#11181C] dark:border-gray; + + counter-increment: counter; + content: counter(counter); + } + + & ol > li::before { + @apply inline-block ml-5 border-0 text-base mt-0 leading-normal; + + content: counter(counter) "."; + } + } + + // 引用 + blockquote { + @apply my-5 pl-4 bg-[rgba(246,248,250)] border-l-[4px] border-[#11181C] dark:bg-[rgba(246,248,250,0.1)]; + } + + // 脚注 + .sr-only { + @apply text-[#EAB308] w-full overflow-visible my-10 before:content-['']; + + &::before { + @apply block w-full h-[1px] bg-gray mb-2; + } + } + + ol > li[id^="user-content-"] { + @apply list-decimal ml-3; + } + + // 提示块 + .callout-content { + @apply pt-1; + + & > p { + @apply mb-0; + } + } + + // 数学公式 + .katex { + @apply text-base; + // font-family: ; + } + + a { + @apply text-primary + } + + p { + @apply leading-9 mb-2; + } + + img { + @apply rounded-xl cursor-pointer transition-all mt-2; + } + + strong { + @apply text-base; + } + + table { + @apply w-full; + + th { + @apply bg-[#f1f7fd] dark:bg-[#334052]; + } + + tr, + th, + td { + @apply border p-[10px_20px]; + } + } + + input[type="checkbox"] { + width: 16px; + height: 16px; + border-radius: 4px; + position: relative; + cursor: not-allowed; + } + } \ No newline at end of file diff --git a/src/pages/Create/components/Editor/plugins.tsx b/src/pages/Create/components/Editor/plugins.tsx new file mode 100644 index 0000000..c555e97 --- /dev/null +++ b/src/pages/Create/components/Editor/plugins.tsx @@ -0,0 +1,77 @@ +import markerSvg from './icon/marker.svg?raw'; +import calloutSvg from './icon/callout.svg?raw'; +import noteSvg from './icon/note.svg?raw'; +import tipSvg from './icon/tip.svg?raw'; +import warningSvg from './icon/warning.svg?raw'; +import checkSvg from './icon/check.svg?raw'; +import dangerSvg from './icon/danger.svg?raw'; +import gemoji from '@bytemd/plugin-gemoji'; +import gfm from '@bytemd/plugin-gfm'; +import highlight from '@bytemd/plugin-highlight'; +import math from '@bytemd/plugin-math'; +import type { BytemdPlugin } from 'bytemd'; +import 'highlight.js/styles/vs2015.css'; +import 'katex/dist/katex.css'; +import rehypeCallouts from 'rehype-callouts'; +import 'rehype-callouts/theme/obsidian'; +import remarkFlexibleMarkers from "remark-flexible-markers"; + +const markers = (): BytemdPlugin => { + return { + remark: (processor) => processor.use(remarkFlexibleMarkers), + actions: [ + { + title: 'markers', + icon: markerSvg, + handler: { + type: 'action', + click: (ctx) => { + ctx.wrapText("==", "=="); + } + } + } + ] + } +} + +const callouts = (): BytemdPlugin => { + const calloutTypes = [ + { title: 'Note', icon: noteSvg, blockType: '[!NOTE]' }, + { title: 'Tip', icon: tipSvg, blockType: '[!TIP]' }, + { title: 'Warning', icon: warningSvg, blockType: '[!WARNING]' }, + { title: 'Check', icon: checkSvg, blockType: '[!CHECK]' }, + { title: 'Danger', icon: dangerSvg, blockType: '[!DANGER]' } + ]; + return { + rehype: (processor) => processor.use(rehypeCallouts), + actions: [ + { + icon: calloutSvg, + handler: { + type: 'dropdown', + actions: calloutTypes.map(type => ({ + title: type.title, + icon: type.icon, + handler: { + type: 'action', + click: (ctx) => { + ctx.appendBlock(`> ${type.blockType} ${type.title}\n> `); + } + } + })) + } + } + ] + } +} + +const plugins = [ + gfm({singleTilde: false}), + markers(), + gemoji(), + math(), + highlight(), + callouts() +] + +export default plugins; \ No newline at end of file