@antdv-next/x-markdown 0.0.1

package/dist/plugins/Latex/index.d.ts

@@ -0,0 +1,9 @@
+import { TokenizerAndRendererExtension } from 'marked';
+import { KatexOptions } from 'katex';
+export type LatexOption = {
+    katexOptions?: KatexOptions;
+    replaceAlignStart?: boolean;
+};
+declare const Latex: (options?: LatexOption) => TokenizerAndRendererExtension[];
+export default Latex;
+//# sourceMappingURL=index.d.ts.map

package/dist/plugins/Latex/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/plugins/Latex/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,QAAQ,CAAC;AAE5D,OAAc,EAAE,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,0BAA0B,CAAC;AAOlC,MAAM,MAAM,WAAW,GAAG;IACxB,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B,CAAC;AAgFF,QAAA,MAAM,KAAK,GAAI,UAAU,WAAW,KAAG,6BAA6B,EAgBnE,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/dist/plugins/Latex/index.js

@@ -0,0 +1,68 @@
+import e from "katex";
+import "katex/dist/katex.min.css";
+//#region src/plugins/Latex/index.ts
+var t = /^(?:\${1,2}([^$]{1,10000}?)\${1,2}|\\\(([\s\S]{1,10000}?)\\\)|\\\[((?:\\.|[^\\]){1,10000}?)\\\])/, n = /^(\${1,2})\n([\s\S]{1,10000}?)\n\1(?:\s*(?:\n|$))|^\\\[((?:\\.|[^\\]){1,10000}?)\\\]/;
+function r(e) {
+	return e && e.replace(/\{align\*\}/g, "{aligned}");
+}
+function i(t, n) {
+	return (r) => e.renderToString(r.text, {
+		...t,
+		displayMode: r.displayMode
+	}) + (n ? "\n" : "");
+}
+function a(e, n) {
+	return {
+		name: "inlineKatex",
+		level: "inline",
+		start(e) {
+			let t = [
+				e.indexOf("$"),
+				e.indexOf("\\("),
+				e.indexOf("\\[")
+			].filter((e) => e !== -1);
+			return t.length > 0 ? Math.min(...t) : void 0;
+		},
+		tokenizer(e) {
+			let i = e.match(t);
+			if (!i) return;
+			let a = (i[1] || i[2] || i[3] || "").trim(), o = n ? r(a) : a;
+			return {
+				type: "inlineKatex",
+				raw: i[0],
+				text: o,
+				displayMode: !0
+			};
+		},
+		renderer: (t) => `<span class="inline-katex">${e(t)}</span>`
+	};
+}
+function o(e, t) {
+	return {
+		name: "blockKatex",
+		level: "block",
+		tokenizer(e) {
+			let i = e.match(n);
+			if (i) {
+				let e = r(i[2] || i[3].trim());
+				return t && (e = r(e)), {
+					type: "blockKatex",
+					raw: i[0],
+					text: e,
+					displayMode: !0
+				};
+			}
+		},
+		renderer: e
+	};
+}
+var s = (e) => {
+	let { replaceAlignStart: t = !0, katexOptions: n } = e || {}, r = {
+		output: "html",
+		throwOnError: !1,
+		...n
+	}, s = i(r, !0), c = i(r, !0);
+	return [a(s, t), o(c, t)];
+};
+//#endregion
+export { s as default };

package/dist/themes/dark.css

@@ -0,0 +1,204 @@
+.x-markdown-dark {
+  --font-size: 14px;
+  --primary-color: #1677ff;
+  --primary-color-hover: #4096ff;
+  --heading-color: #ffffff;
+  --text-color: rgba(255, 255, 255, 0.85);
+  --border-color: rgba(48, 48, 48, 1);
+  --line-color: rgba(253, 253, 253, 0.12);
+  --dark-bg: rgba(255, 255, 255, 0.1);
+  --table-head-bg: rgba(29, 29, 29, 1);
+  --table-body-bg: rgba(20, 20, 20, 1);
+  --cite-bg: rgba(255, 255, 255, 0.1);
+  --cite-hover-bg: rgba(255, 255, 255, 0.2);
+  --border-radius-middle: 6px;
+  --border-radius-small: 4px;
+  --td-th-padding: 10px 12px;
+  --border-font-weight: 600;
+  --margin-block: 0 0 16px 0;
+  --padding-ul-ol: 0 0 0 16px;
+  --margin-ul-ol: 0 0 16px 28px;
+  --margin-li: 0 0 14px 0;
+  --hr-margin: 24px 0;
+  --table-margin: 0 0 24px 0;
+  --margin-pre: 0 0 16px 0;
+  --padding-code: 16px;
+  --xmd-tail-color: var(--text-color);
+}
+
+.x-markdown-dark h1,
+.x-markdown-dark h2,
+.x-markdown-dark h3,
+.x-markdown-dark h4 {
+  color: var(--heading-color);
+  font-weight: var(--border-font-weight);
+  margin: var(--margin-block);
+}
+
+.x-markdown-dark h1 {
+  font-size: 24px;
+  line-height: 36px;
+}
+
+.x-markdown-dark h2 {
+  font-size: 20px;
+  line-height: 32px;
+}
+
+.x-markdown-dark h3 {
+  font-size: 18px;
+  line-height: 30px;
+}
+
+.x-markdown-dark h4 {
+  font-size: 16px;
+}
+
+.x-markdown-dark p,
+.x-markdown-dark li {
+  color: var(--text-color);
+  margin: var(--margin-block);
+}
+
+.x-markdown-dark li {
+  position: relative;
+}
+
+.x-markdown-dark li::marker {
+  font-size: 16px;
+  font-weight: 400;
+  line-height: 28px;
+  color: var(--heading-color);
+}
+
+.x-markdown-dark ul > li ul > li,
+.x-markdown-dark ul > li ol > li {
+  list-style: circle;
+}
+
+.x-markdown-dark ul > li ul > li ul > li,
+.x-markdown-dark ul > li ul > li ol > li,
+.x-markdown-dark ul > li ol > li ul > li,
+.x-markdown-dark ul > li ol > li ol > li {
+  list-style: square;
+}
+
+.x-markdown-dark ol > li ol > li,
+.x-markdown-dark ol > li ul > li {
+  list-style: lower-alpha;
+}
+
+.x-markdown-dark ol > li ol > li ol > li,
+.x-markdown-dark ol > li ol > li ul > li,
+.x-markdown-dark ol > li ul > li ol > li,
+.x-markdown-dark ol > li ul > li ul > li {
+  list-style: lower-roman;
+}
+
+.x-markdown-dark hr {
+  border: 0;
+  border-top: 1px solid var(--line-color);
+  margin: var(--hr-margin);
+}
+
+.x-markdown-dark table {
+  border-collapse: collapse;
+  overflow: hidden;
+  box-shadow: 0 1px 3px rgba(255, 255, 255, 0.05);
+  margin: var(--table-margin);
+}
+
+.x-markdown-dark thead {
+  background-color: var(--table-head-bg);
+}
+
+.x-markdown-dark tbody {
+  background-color: var(--table-body-bg);
+}
+
+.x-markdown-dark tbody tr {
+  background-color: var(--table-body-bg);
+  transition: background-color 200ms linear;
+}
+
+.x-markdown-dark tbody tr:hover {
+  background-color: var(--table-head-bg);
+}
+
+.x-markdown-dark th,
+.x-markdown-dark td {
+  padding: var(--td-th-padding);
+  border: 1px solid var(--border-color);
+}
+
+.x-markdown-dark th {
+  color: var(--heading-color);
+}
+
+.x-markdown-dark td {
+  color: var(--text-color);
+}
+
+.x-markdown-dark blockquote {
+  border-left: 4px solid var(--border-color);
+  padding: 4px 12px;
+  margin: 16px 0;
+  background-color: var(--cite-bg);
+  border-radius: 0 var(--border-radius-middle) var(--border-radius-middle) 0;
+  transition: background-color 0.2s ease;
+}
+
+.x-markdown-dark blockquote:hover {
+  background-color: var(--cite-hover-bg);
+}
+
+.x-markdown-dark
+  pre
+  > code:not([class$="-highlightCode-code"]):not(
+    [class$="-codeHighlighter-code"]
+  ) {
+  display: block;
+  background: var(--dark-bg) !important;
+  padding: var(--padding-code);
+  color: var(--text-color) !important;
+  line-height: 1.3;
+  font-size: var(--font-size);
+  border-radius: var(--border-radius-middle);
+  margin: var(--margin-pre);
+}
+
+.x-markdown-dark
+  code:not(pre code):not([class$="-highlightCode-code"]):not(
+    [class$="-codeHighlighter-code"]
+  ) {
+  background-color: var(--dark-bg) !important;
+  color: var(--text-color) !important;
+  border-radius: var(--border-radius-small);
+  padding: 2px 6px;
+  margin-inline: 3px;
+  font-size: var(--font-size);
+  border: 1px solid var(--border-color);
+}
+
+.x-markdown-dark img {
+  max-width: 100%;
+}
+
+.x-markdown-dark a {
+  color: var(--primary-color);
+  text-decoration: none;
+  transition: color 0.2s ease;
+  position: relative;
+}
+
+.x-markdown-dark a:hover {
+  color: var(--primary-color-hover);
+  text-decoration: underline;
+}
+
+.x-markdown-dark a::after {
+  content: "\2197";
+  margin-left: 4px;
+  vertical-align: super;
+  opacity: 0.7;
+}

package/dist/themes/light.css

@@ -0,0 +1,204 @@
+.x-markdown-light {
+  --font-size: 14px;
+  --primary-color: #1677ff;
+  --primary-color-hover: #4096ff;
+  --heading-color: #000000;
+  --text-color: rgba(0, 0, 0, 0.85);
+  --border-color: rgba(240, 240, 240, 1);
+  --line-color: rgba(5, 5, 5, 0.06);
+  --light-bg: rgba(0, 0, 0, 0.04);
+  --table-head-bg: rgba(250, 250, 250, 1);
+  --table-body-bg: rgba(255, 255, 255, 1);
+  --cite-bg: rgba(0, 0, 0, 0.1);
+  --cite-hover-bg: rgba(0, 0, 0, 0.2);
+  --border-radius-middle: 6px;
+  --border-radius-small: 4px;
+  --td-th-padding: 10px 12px;
+  --border-font-weight: 600;
+  --margin-block: 0 0 16px 0;
+  --padding-ul-ol: 0 0 0 16px;
+  --margin-ul-ol: 0 0 16px 28px;
+  --margin-li: 0 0 14px 0;
+  --hr-margin: 24px 0;
+  --table-margin: 0 0 24px 0;
+  --margin-pre: 0 0 16px 0;
+  --padding-code: 16px;
+  --xmd-tail-color: var(--text-color);
+}
+
+.x-markdown-light h1,
+.x-markdown-light h2,
+.x-markdown-light h3,
+.x-markdown-light h4 {
+  color: var(--heading-color);
+  font-weight: var(--border-font-weight);
+  margin: var(--margin-block);
+}
+
+.x-markdown-light h1 {
+  font-size: 24px;
+  line-height: 36px;
+}
+
+.x-markdown-light h2 {
+  font-size: 20px;
+  line-height: 32px;
+}
+
+.x-markdown-light h3 {
+  font-size: 18px;
+  line-height: 30px;
+}
+
+.x-markdown-light h4 {
+  font-size: 16px;
+}
+
+.x-markdown-light p,
+.x-markdown-light li {
+  color: var(--text-color);
+  margin: var(--margin-block);
+}
+
+.x-markdown-light li {
+  position: relative;
+}
+
+.x-markdown-light li::marker {
+  font-size: 16px;
+  font-weight: 400;
+  line-height: 28px;
+  color: var(--heading-color);
+}
+
+.x-markdown-light ul > li ul > li,
+.x-markdown-light ul > li ol > li {
+  list-style: circle;
+}
+
+.x-markdown-light ul > li ul > li ul > li,
+.x-markdown-light ul > li ul > li ol > li,
+.x-markdown-light ul > li ol > li ul > li,
+.x-markdown-light ul > li ol > li ol > li {
+  list-style: square;
+}
+
+.x-markdown-light ol > li ol > li,
+.x-markdown-light ol > li ul > li {
+  list-style: lower-alpha;
+}
+
+.x-markdown-light ol > li ol > li ol > li,
+.x-markdown-light ol > li ol > li ul > li,
+.x-markdown-light ol > li ul > li ol > li,
+.x-markdown-light ol > li ul > li ul > li {
+  list-style: lower-roman;
+}
+
+.x-markdown-light hr {
+  border: 0;
+  border-top: 1px solid var(--line-color);
+  margin: var(--hr-margin);
+}
+
+.x-markdown-light table {
+  border-collapse: collapse;
+  overflow: hidden;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
+  margin: var(--table-margin);
+}
+
+.x-markdown-light thead {
+  background-color: var(--table-head-bg);
+}
+
+.x-markdown-light tbody {
+  background-color: var(--table-body-bg);
+}
+
+.x-markdown-light tbody tr {
+  background-color: var(--table-body-bg);
+  transition: background-color 200ms linear;
+}
+
+.x-markdown-light tbody tr:hover {
+  background-color: var(--table-head-bg);
+}
+
+.x-markdown-light th,
+.x-markdown-light td {
+  padding: var(--td-th-padding);
+  border: 1px solid var(--border-color);
+}
+
+.x-markdown-light th {
+  color: var(--heading-color);
+}
+
+.x-markdown-light td {
+  color: var(--text-color);
+}
+
+.x-markdown-light blockquote {
+  border-left: 4px solid var(--border-color);
+  padding: 4px 12px;
+  margin: 16px 0;
+  background-color: var(--cite-bg);
+  border-radius: 0 var(--border-radius-middle) var(--border-radius-middle) 0;
+  transition: background-color 0.2s ease;
+}
+
+.x-markdown-light blockquote:hover {
+  background-color: var(--cite-hover-bg);
+}
+
+.x-markdown-light
+  pre
+  > code:not([class$="-highlightCode-code"]):not(
+    [class$="-codeHighlighter-code"]
+  ) {
+  display: block;
+  background: var(--light-bg) !important;
+  padding: var(--padding-code);
+  color: var(--text-color) !important;
+  line-height: 1.3;
+  font-size: var(--font-size);
+  border-radius: var(--border-radius-middle);
+  margin: var(--margin-pre);
+}
+
+.x-markdown-light
+  code:not(pre code):not([class$="-highlightCode-code"]):not(
+    [class$="-codeHighlighter-code"]
+  ) {
+  background-color: var(--light-bg) !important;
+  color: var(--text-color) !important;
+  border-radius: var(--border-radius-small);
+  padding: 2px 6px;
+  margin-inline: 3px;
+  font-size: var(--font-size);
+  border: 1px solid var(--border-color);
+}
+
+.x-markdown-light img {
+  max-width: 100%;
+}
+
+.x-markdown-light a {
+  color: var(--primary-color);
+  text-decoration: none;
+  transition: color 0.2s ease;
+  position: relative;
+}
+
+.x-markdown-light a:hover {
+  color: var(--primary-color-hover);
+  text-decoration: underline;
+}
+
+.x-markdown-light a::after {
+  content: "\2197";
+  margin-left: 4px;
+  vertical-align: super;
+  opacity: 0.7;
+}

package/package.json

@@ -0,0 +1,45 @@
+{
+  "name": "@antdv-next/x-markdown",
+  "version": "0.0.1",
+  "files": [
+    "dist"
+  ],
+  "type": "module",
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./plugins/*": {
+      "types": "./dist/plugins/*/index.d.ts",
+      "import": "./dist/plugins/*/index.js"
+    },
+    "./themes/light.css": "./dist/themes/light.css",
+    "./themes/dark.css": "./dist/themes/dark.css",
+    "./package.json": "./package.json"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "dompurify": "^3.1.0",
+    "katex": "^0.16.25",
+    "marked": "^12.0.0"
+  },
+  "devDependencies": {
+    "@types/dompurify": "^3.0.5"
+  },
+  "peerDependencies": {
+    "vue": ">=3.5.0"
+  },
+  "scripts": {
+    "type-check": "vue-tsc --project tsconfig.build.json --noEmit",
+    "build": "vp build --config vite.build.config.ts && node ./scripts/copy-themes.mjs"
+  }
+}