@antdv-next/x-markdown 0.1.0 → 0.1.2

package/dist/XMarkdown/components/DebugPanel.css

@@ -0,0 +1,44 @@
+/* XMarkdown Debug Panel */
+.xmd-debug-panel {
+  position: fixed;
+  background: rgba(0, 0, 0, 0.85);
+  border-radius: 8px;
+  padding: 12px;
+  min-width: 220px;
+  color: #fff;
+  font-size: 12px;
+  z-index: 9999;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
+  user-select: none;
+}
+
+.xmd-debug-header {
+  cursor: move;
+  padding-bottom: 8px;
+  margin-bottom: 8px;
+  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
+  font-weight: 600;
+}
+
+.xmd-debug-content {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.xmd-debug-stat {
+  display: flex;
+  justify-content: space-between;
+}
+
+.xmd-debug-label {
+  color: rgba(255, 255, 255, 0.7);
+}
+
+.xmd-debug-chart {
+  width: 100%;
+  height: 60px;
+  margin-top: 8px;
+  background: rgba(255, 255, 255, 0.1);
+  border-radius: 4px;
+}

package/dist/XMarkdown/components/DebugPanel.vue_vue_type_script_setup_true_lang.js

@@ -1,3 +1,4 @@
+/* empty css           */
 import { createElementBlock, createElementVNode, defineComponent, normalizeClass, normalizeStyle, onMounted, onUnmounted, openBlock, ref, toDisplayString } from "vue";
 //#region src/XMarkdown/components/DebugPanel.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = { class: "xmd-debug-content" };

package/dist/XMarkdown/components/index.js

@@ -1,4 +1,4 @@
 import AnimationText_default from "./AnimationText.js";
-import DebugPanel_default from "./DebugPanel.js";
+import DebugPanel_default from "./DebugPanel2.js";
 import TailIndicator_default from "./TailIndicator.js";
 export { AnimationText_default as AnimationText, DebugPanel_default as DebugPanel, TailIndicator_default as TailIndicator };

package/dist/XMarkdown/index.js

@@ -1,5 +1,5 @@
 import AnimationText_default from "./components/AnimationText.js";
-import DebugPanel_default from "./components/DebugPanel.js";
+import DebugPanel_default from "./components/DebugPanel2.js";
 import TailIndicator_default from "./components/TailIndicator.js";
 import { useStreaming } from "./composables/useStreaming.js";
 import { Parser } from "./core/Parser.js";

package/dist/XMarkdown/index.vue_vue_type_script_setup_true_lang.js

@@ -1,4 +1,4 @@
-import DebugPanel_default from "./components/DebugPanel.js";
+import DebugPanel_default from "./components/DebugPanel2.js";
 import TailIndicator_default from "./components/TailIndicator.js";
 import { useStreaming } from "./composables/useStreaming.js";
 import { Parser } from "./core/Parser.js";

package/dist/index.js

@@ -1,5 +1,5 @@
 import AnimationText_default from "./XMarkdown/components/AnimationText.js";
-import DebugPanel_default from "./XMarkdown/components/DebugPanel.js";
+import DebugPanel_default from "./XMarkdown/components/DebugPanel2.js";
 import TailIndicator_default from "./XMarkdown/components/TailIndicator.js";
 import { useStreaming } from "./XMarkdown/composables/useStreaming.js";
 import { Parser } from "./XMarkdown/core/Parser.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antdv-next/x-markdown",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "license": "MIT",
   "files": [
     "dist",

package/themes/dark.css

@@ -21,7 +21,6 @@
   --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);
 }
@@ -47,6 +46,7 @@
 
 .x-markdown-dark h3 {
   font-size: 18px;
+  /* 18px */
   line-height: 30px;
 }
 
@@ -60,6 +60,7 @@
   margin: var(--margin-block);
 }
 
+/* 列表项通用样式 */
 .x-markdown-dark li {
   position: relative;
 }
@@ -98,14 +99,12 @@
 .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 {
@@ -119,10 +118,10 @@
 .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);
+  &:hover {
+    background-color: var(--table-head-bg);
+  }
 }
 
 .x-markdown-dark th,
@@ -152,11 +151,7 @@
   background-color: var(--cite-hover-bg);
 }
 
-.x-markdown-dark
-  pre
-  > code:not([class$="-highlightCode-code"]):not(
-    [class$="-codeHighlighter-code"]
-  ) {
+.x-markdown-dark pre code:not([class$="-highlighter-code"] pre code) {
   display: block;
   background: var(--dark-bg) !important;
   padding: var(--padding-code);
@@ -167,10 +162,7 @@
   margin: var(--margin-pre);
 }
 
-.x-markdown-dark
-  code:not(pre code):not([class$="-highlightCode-code"]):not(
-    [class$="-codeHighlighter-code"]
-  ) {
+.x-markdown-dark code:not([class$="-highlighter-code"] code):not(pre code) {
   background-color: var(--dark-bg) !important;
   color: var(--text-color) !important;
   border-radius: var(--border-radius-small);
@@ -197,7 +189,7 @@
 }
 
 .x-markdown-dark a::after {
-  content: "\2197";
+  content: "↗";
   margin-left: 4px;
   vertical-align: super;
   opacity: 0.7;

package/themes/index.css

@@ -1,4 +1,13 @@
-/* Base styles for XMarkdown; theme colors come from .x-markdown-light/.x-markdown-dark */
+/* ==========================================
+   XMarkdown – default css
+   ========================================== */
+
+/*
+ * Default tag styles are gated behind `:not(.x-md-disable-all):not(.x-md-disable-<tag>)`
+ * so consumers can opt out via the `disableDefaultStyles` prop. This prevents the
+ * descendant-selector defaults (e.g. `ul`/`li`/`code`) from polluting elements
+ * rendered by custom components (such as antd `Collapse`) inside the container.
+ */
 
 @keyframes x-markdown-fade-in {
   from {
@@ -35,12 +44,13 @@
   color: var(--text-color);
 }
 
+/* xmd-tail: default styling for streaming tail indicator */
 xmd-tail {
   display: inline;
 }
 
 .xmd-tail {
-  color: var(--xmd-tail-color, inherit);
+  color: inherit;
   font-size: inherit;
   line-height: inherit;
 }
@@ -60,95 +70,99 @@ xmd-tail {
   white-space: pre-wrap;
 }
 
-.x-markdown th,
-.x-markdown td {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-th) th,
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-td) td {
   padding: var(--td-th-padding);
 }
 
-.x-markdown th {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-th) th {
   font-weight: var(--border-font-weight);
 }
 
-.x-markdown pre table {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-table) pre table {
   box-shadow: none;
 }
 
-.x-markdown pre td,
-.x-markdown pre th {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-td) pre td,
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-th) pre th {
   padding: var(--pre-th-td-padding);
   border: none;
   text-align: left;
 }
 
-.x-markdown p {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-p) p {
   margin: var(--margin-block);
 }
 
-.x-markdown p:first-child {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-p) p:first-child {
   margin-top: 0;
 }
 
-.x-markdown p:last-child {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-p) p:last-child {
   margin-bottom: 0;
 }
 
-.x-markdown ul,
-.x-markdown ol {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-ul) ul,
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-ol) ol {
   margin: var(--margin-ul-ol);
   padding: var(--padding-ul-ol);
 }
 
-.x-markdown ul:first-child,
-.x-markdown ol:first-child {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-ul) ul:first-child,
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-ol) ol:first-child {
   margin-top: 0;
 }
 
-.x-markdown ul:last-child,
-.x-markdown ol:last-child {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-ul) ul:last-child,
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-ol) ol:last-child {
   margin-bottom: 0;
 }
 
-.x-markdown ol > li {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-ol):not(.x-md-disable-li)
+  ol
+  > li {
   list-style: decimal;
 }
 
-.x-markdown ul > li {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-ul):not(.x-md-disable-li)
+  ul
+  > li {
   list-style: disc;
 }
 
-.x-markdown li {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-li) li {
   margin: var(--margin-li);
 }
 
-.x-markdown li:first-child {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-li) li:first-child {
   margin-top: 0;
 }
 
-.x-markdown li:last-child {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-li) li:last-child {
   margin-bottom: 0;
 }
 
-.x-markdown pre {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-pre) pre {
   margin: var(--margin-pre);
   overflow-x: auto;
 }
 
-.x-markdown pre:first-child {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-pre) pre:first-child {
   margin-top: 0;
 }
 
-.x-markdown pre:last-child {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-pre) pre:last-child {
   margin-bottom: 0;
 }
 
-.x-markdown code {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-code) code {
   padding: var(--padding-code-inline);
   margin: var(--margin-code-inline);
   font-size: var(--code-inline-text);
   border-radius: var(--small-border-radius);
 }
 
-.x-markdown pre code {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-code) pre code {
   padding: 0;
   margin: 0;
   font-size: inherit;
@@ -156,17 +170,17 @@ xmd-tail {
   line-height: 2;
 }
 
-.x-markdown img {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-img) img {
   max-width: 100%;
   height: auto;
   margin: var(--image-margin);
 }
 
-.x-markdown hr {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-hr) hr {
   margin: var(--hr-margin);
 }
 
-.x-markdown table:not(pre) {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-table) table:not(pre) {
   margin: var(--table-margin);
   border-collapse: collapse;
   display: block;
@@ -175,11 +189,13 @@ xmd-tail {
   overflow: auto;
 }
 
-.x-markdown table:not(pre):first-child {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-table)
+  table:not(pre):first-child {
   margin-top: 0;
 }
 
-.x-markdown table:not(pre):last-child {
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-table)
+  table:not(pre):last-child {
   margin-bottom: 0;
 }
 
@@ -204,3 +220,23 @@ xmd-tail {
 .x-markdown .inline-katex .katex-display > .katex > .katex-html > .tag {
   position: static;
 }
+
+.x-markdown .block-katex {
+  display: block;
+  margin: 1em 0;
+}
+
+/*
+ * Local overrides (NOT part of upstream @ant-design/x-markdown).
+ *
+ * The rules above are kept verbatim in sync with upstream so that future
+ * syncs remain a clean diff with minimal cognitive overhead. Do not edit
+ * the upstream rules in place — add local overrides in this section below
+ * so they are clearly separated and easy to drop on the next sync.
+ *
+ * Override the upstream `line-height: 2` on `pre code` so code blocks
+ * inherit the container line-height instead.
+ */
+.x-markdown:not(.x-md-disable-all):not(.x-md-disable-code) pre code {
+  line-height: inherit;
+}

package/themes/light.css

@@ -47,6 +47,7 @@
 
 .x-markdown-light h3 {
   font-size: 18px;
+  /* 18px */
   line-height: 30px;
 }
 
@@ -60,6 +61,7 @@
   margin: var(--margin-block);
 }
 
+/* 列表项通用样式 */
 .x-markdown-light li {
   position: relative;
 }
@@ -119,10 +121,10 @@
 .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);
+  &:hover {
+    background-color: var(--table-head-bg);
+  }
 }
 
 .x-markdown-light th,
@@ -152,11 +154,7 @@
   background-color: var(--cite-hover-bg);
 }
 
-.x-markdown-light
-  pre
-  > code:not([class$="-highlightCode-code"]):not(
-    [class$="-codeHighlighter-code"]
-  ) {
+.x-markdown-light pre code:not([class$="-highlighter-code"] pre code) {
   display: block;
   background: var(--light-bg) !important;
   padding: var(--padding-code);
@@ -167,10 +165,7 @@
   margin: var(--margin-pre);
 }
 
-.x-markdown-light
-  code:not(pre code):not([class$="-highlightCode-code"]):not(
-    [class$="-codeHighlighter-code"]
-  ) {
+.x-markdown-light code:not([class$="-highlighter-code"] code):not(pre code) {
   background-color: var(--light-bg) !important;
   color: var(--text-color) !important;
   border-radius: var(--border-radius-small);
@@ -197,7 +192,7 @@
 }
 
 .x-markdown-light a::after {
-  content: "\2197";
+  content: "↗";
   margin-left: 4px;
   vertical-align: super;
   opacity: 0.7;