tiptap-markdown-react 0.8.0 → 0.8.1

package/dist/labels.d.ts

@@ -48,6 +48,8 @@ export interface ToolbarLabels {
     mathPlaceholder: string;
     mathDone: string;
     mathCancel: string;
+    mathNewInline: string;
+    mathNewBlock: string;
 }
 export declare const defaultToolbarLabels: ToolbarLabels;
 export interface ColorPaletteLabels {

package/dist/style.css

@@ -326,6 +326,11 @@
 .tiptap-mathematics-render.block-math-error {
   color: #c0392b;
 }
+
+/* 编辑中：占位仍在，视觉交给浮层预览，避免正文公式与预览叠两份 */
+.tiptap-mathematics-render.tmr-math-editing {
+  visibility: hidden;
+}
 /* 代码块 NodeView：白底、细边框、顶部 header 放语言选择（Radix 下拉）+ 删除。 */
 ._wrapper_5i2vi_2 {
   position: relative;
@@ -526,7 +531,7 @@
   color: #22863a;
 }
 /* 顶部操作栏：横跨宽度、内容居中、细线灰图标。配色映射到可覆盖的 --tmr-* 变量。 */
-._toolbar_8cpy8_2 {
+._toolbar_z6tes_2 {
   --sb-accent: var(--tmr-accent, #ff6719);
   --sb-text: var(--tmr-text, #363737);
   --sb-muted: var(--tmr-toolbar-muted, #6b6b6b);
@@ -539,7 +544,7 @@
   z-index: 8;
 }
 
-._inner_8cpy8_15 {
+._inner_z6tes_15 {
   display: flex;
   align-items: center;
   justify-content: safe center;
@@ -551,7 +556,7 @@
   overflow-x: auto;
 }
 
-._btn_8cpy8_27 {
+._btn_z6tes_27 {
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -569,28 +574,28 @@
   transition: background 0.15s, color 0.15s;
 }
 
-._btn_8cpy8_27:hover:not(:disabled) {
+._btn_z6tes_27:hover:not(:disabled) {
   background: #f3f3f3;
   color: var(--sb-text);
 }
 
-._btnActive_8cpy8_50 {
+._btnActive_z6tes_50 {
   color: var(--sb-accent);
   background: #fff3ec;
 }
 
-._btnActive_8cpy8_50:hover {
+._btnActive_z6tes_50:hover {
   color: var(--sb-accent);
   background: #ffe8da;
 }
 
-._btn_8cpy8_27:disabled {
+._btn_z6tes_27:disabled {
   opacity: 0.3;
   cursor: not-allowed;
 }
 
 /* 表内浮动工具条（BubbleMenu portal 到 body，拿不到 .toolbar 变量，故写死配色） */
-._tableBubble_8cpy8_66 {
+._tableBubble_z6tes_66 {
   display: flex;
   align-items: center;
   gap: 2px;
@@ -602,7 +607,7 @@
 }
 
 /* 文字型图标（引用等） */
-._txtIcon_8cpy8_78 {
+._txtIcon_z6tes_78 {
   font-family: 'SF Pro Display', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
   font-size: 16px;
   font-weight: 600;
@@ -610,7 +615,7 @@
 }
 
 /* 文字颜色 / 高亮图标：字母 + 底部当前色条 */
-._colorIcon_8cpy8_86 {
+._colorIcon_z6tes_86 {
   display: inline-flex;
   flex-direction: column;
   align-items: center;
@@ -618,20 +623,20 @@
   line-height: 1;
 }
 
-._colorIconGlyph_8cpy8_94 {
+._colorIconGlyph_z6tes_94 {
   font-family: 'SF Pro Display', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
   font-size: 15px;
   font-weight: 600;
 }
 
-._colorIconBar_8cpy8_100 {
+._colorIconBar_z6tes_100 {
   width: 16px;
   height: 3px;
   border-radius: 1.5px;
 }
 
 /* A▾ 上标/下标下拉触发器 */
-._scriptTrigger_8cpy8_107 {
+._scriptTrigger_z6tes_107 {
   display: inline-flex;
   align-items: center;
   gap: 3px;
@@ -646,12 +651,12 @@
   transition: background 0.15s, color 0.15s;
 }
 
-._scriptTrigger_8cpy8_107:hover {
+._scriptTrigger_z6tes_107:hover {
   background: #f3f3f3;
   color: var(--sb-text);
 }
 
-._scriptTriggerGlyph_8cpy8_127 {
+._scriptTriggerGlyph_z6tes_127 {
   font-family: 'SF Pro Display', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
   font-size: 16px;
   font-weight: 600;
@@ -659,7 +664,7 @@
   text-underline-offset: 2px;
 }
 
-._divider_8cpy8_135 {
+._divider_z6tes_135 {
   width: 1px;
   height: 20px;
   margin: 0 8px;
@@ -668,7 +673,7 @@
 }
 
 /* ── Style / Size / More 下拉触发器 ── */
-._styleTrigger_8cpy8_144 {
+._styleTrigger_z6tes_144 {
   display: inline-flex;
   align-items: center;
   justify-content: space-between;
@@ -688,16 +693,16 @@
   transition: background 0.15s;
 }
 
-._styleTrigger_8cpy8_144:hover:not(:disabled) {
+._styleTrigger_z6tes_144:hover:not(:disabled) {
   background: #f3f3f3;
 }
 
-._styleTrigger_8cpy8_144:disabled {
+._styleTrigger_z6tes_144:disabled {
   opacity: 0.3;
   cursor: not-allowed;
 }
 
-._styleTriggerLabel_8cpy8_173 {
+._styleTriggerLabel_z6tes_173 {
   flex: 1;
   text-align: left;
   overflow: hidden;
@@ -705,19 +710,19 @@
   text-overflow: ellipsis;
 }
 
-._styleTriggerCaret_8cpy8_181 {
+._styleTriggerCaret_z6tes_181 {
   color: var(--sb-muted);
   flex: none;
 }
 
 /* 下拉项：图标 + 文字 */
-._styleItem_8cpy8_187 {
+._styleItem_z6tes_187 {
   display: inline-flex;
   align-items: center;
   gap: 12px;
 }
 
-._styleIcon_8cpy8_193 {
+._styleIcon_z6tes_193 {
   display: inline-flex;
   justify-content: center;
   align-items: center;
@@ -727,19 +732,19 @@
 }
 
 /* 上标 / 下标图标 */
-._scriptGlyph_8cpy8_203 {
+._scriptGlyph_z6tes_203 {
   display: inline-block;
   text-align: center;
   font-family: 'SF Pro Display', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
 }
 
-._scriptGlyph_8cpy8_203 sup,
-._scriptGlyph_8cpy8_203 sub {
+._scriptGlyph_z6tes_203 sup,
+._scriptGlyph_z6tes_203 sub {
   font-size: 0.7em;
 }
 
 /* ── Radix 下拉菜单面板（替代 antd .ant-dropdown-menu） ── */
-._menu_8cpy8_215 {
+._menu_z6tes_215 {
   min-width: 200px;
   padding: 6px;
   background: #fff;
@@ -750,7 +755,7 @@
   z-index: 1000;
 }
 
-._menuItem_8cpy8_226 {
+._menuItem_z6tes_226 {
   display: flex;
   align-items: center;
   width: 100%;
@@ -766,126 +771,178 @@
   outline: none;
 }
 
-._menuItem_8cpy8_226:hover:not(:disabled) {
+._menuItem_z6tes_226:hover:not(:disabled) {
   background: #f3f3f3;
 }
 
-._menuItem_8cpy8_226:disabled {
+._menuItem_z6tes_226:disabled {
   opacity: 0.35;
   cursor: not-allowed;
 }
 
 /* 选中态：品牌色高亮 */
-._menuItemSelected_8cpy8_252 {
+._menuItemSelected_z6tes_252 {
   background: #fff3ec;
   color: var(--sb-accent);
 }
 
-._menuItemSelected_8cpy8_252 ._styleIcon_8cpy8_193 {
+._menuItemSelected_z6tes_252 ._styleIcon_z6tes_193 {
   color: var(--sb-accent);
 }
 
-._menuItemSelected_8cpy8_252:hover:not(:disabled) {
+._menuItemSelected_z6tes_252:hover:not(:disabled) {
   background: #ffe8da;
 }
 
 /* Radix Popover 内容（承载 ColorPalette），面板自带阴影，这里只兜底 z-index */
-._popoverContent_8cpy8_266 {
+._popoverContent_z6tes_266 {
   z-index: 1000;
 }
 
-._mathOverlay_8cpy8_270 {
+._mathAnchor_z6tes_270 {
   position: fixed;
-  inset: 0;
-  z-index: 1100;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background: rgb(0 0 0 / 24%);
+  width: 0;
+  height: 0;
+  pointer-events: none;
 }
 
-._mathPopover_8cpy8_280 {
-  width: min(420px, calc(100vw - 32px));
-  padding: 14px;
-  background: #fff;
-  border-radius: 10px;
-  box-shadow:
-    0 6px 24px rgba(0, 0, 0, 0.12),
-    0 0 0 1px rgba(0, 0, 0, 0.06);
+._mathContent_z6tes_277 {
+  z-index: 1100;
+  padding: 0;
+  background: transparent;
+  border: none;
+  box-shadow: none;
+  outline: none;
 }
 
-._mathTitle_8cpy8_290 {
-  margin-bottom: 8px;
-  font-size: 14px;
-  font-weight: 600;
-  color: var(--sb-text, #363737);
+._mathStack_z6tes_286 {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 8px;
 }
 
-._mathTextarea_8cpy8_297 {
-  display: block;
+._mathStackBlock_z6tes_293 {
+  align-items: stretch;
   width: 100%;
-  margin: 0;
-  padding: 8px 10px;
-  border: 1px solid var(--sb-border, #ececec);
+}
+
+._mathHint_z6tes_298 {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  padding: 4px 10px;
   border-radius: 6px;
-  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+  background: var(--tmr-code-bg, #f4f4f4);
+  color: var(--tmr-muted, #777777);
   font-size: 13px;
-  line-height: 1.45;
-  color: var(--sb-text, #363737);
-  resize: vertical;
+  line-height: 1.4;
+}
+
+._mathHintBlock_z6tes_310 {
+  width: 100%;
+  padding: 10px 14px;
+  border-radius: 8px;
 }
 
-._mathTextarea_8cpy8_297:focus {
-  outline: 2px solid var(--sb-accent, #ff6719);
-  outline-offset: 1px;
+._mathHintIcon_z6tes_316 {
+  font-family: ui-serif, Georgia, 'Times New Roman', serif;
+  font-size: 12px;
+  opacity: 0.85;
 }
 
-._mathPreview_8cpy8_316 {
-  min-height: 44px;
-  margin-top: 8px;
-  padding: 8px 10px;
+._mathPreviewInline_z6tes_322 {
+  display: inline-flex;
+  max-width: min(440px, calc(100vw - 24px));
+  padding: 4px 10px;
   overflow-x: auto;
-  background: #f7f7f7;
   border-radius: 6px;
+  background: #fff3ec;
+  color: var(--tmr-text, #363737);
+}
+
+._mathPreviewBlock_z6tes_332 {
+  width: 100%;
+  min-height: 48px;
+  padding: 14px 16px;
+  overflow-x: auto;
+  border-radius: 8px;
+  background: var(--tmr-code-bg, #f4f4f4);
   text-align: center;
+  color: var(--tmr-text, #363737);
+}
+
+._mathPreviewBlock_z6tes_332 .katex-display {
+  margin: 0;
 }
 
-._mathActions_8cpy8_326 {
+._mathField_z6tes_347 {
   display: flex;
-  justify-content: flex-end;
+  align-items: center;
   gap: 8px;
-  margin-top: 12px;
+  width: min(440px, calc(100vw - 24px));
+  padding: 6px 6px 6px 14px;
+  background: var(--tmr-popover-bg, #fff);
+  border: 1px solid var(--tmr-toolbar-border, #ececec);
+  border-radius: 999px;
+  box-shadow: 0 4px 16px rgb(0 0 0 / 12%);
 }
 
-._mathBtn_8cpy8_333 {
-  height: 32px;
-  padding: 0 12px;
-  border: 1px solid var(--sb-border, #ececec);
-  border-radius: 6px;
-  background: #fff;
-  color: var(--sb-text, #363737);
+._mathFieldBlock_z6tes_359 {
+  align-items: flex-start;
+  width: 100%;
+  border-radius: 12px;
+  padding: 10px 10px 10px 14px;
+}
+
+._mathInput_z6tes_366 {
+  flex: 1;
+  min-width: 0;
+  margin: 0;
+  padding: 4px 0;
+  border: none;
+  background: transparent;
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
   font-size: 13px;
-  cursor: pointer;
+  line-height: 1.45;
+  color: var(--tmr-text, #363737);
+  resize: none;
 }
 
-._mathBtn_8cpy8_333:hover:not(:disabled) {
-  background: #f3f3f3;
+._mathInput_z6tes_366:focus {
+  outline: none;
 }
 
-._mathBtnPrimary_8cpy8_348 {
-  border-color: var(--sb-accent, #ff6719);
-  background: var(--sb-accent, #ff6719);
+._mathDone_z6tes_384 {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  flex-shrink: 0;
+  height: 28px;
+  padding: 0 10px;
+  border: none;
+  border-radius: 999px;
+  background: var(--tmr-accent, #ff6719);
   color: #fff;
+  font-size: 12px;
+  font-weight: 600;
+  cursor: pointer;
 }
 
-._mathBtnPrimary_8cpy8_348:hover:not(:disabled) {
+._mathDone_z6tes_384:hover:not(:disabled) {
   filter: brightness(0.95);
 }
 
-._mathBtn_8cpy8_333:disabled {
+._mathDone_z6tes_384:disabled {
   opacity: 0.35;
   cursor: not-allowed;
 }
+
+._mathDoneKbd_z6tes_409 {
+  font-size: 11px;
+  font-weight: 500;
+  opacity: 0.85;
+}
 /* 颜色面板：None 清除行 + 10×6 色板 + THEME 品牌色 */
 ._palette_x5lrq_2 {
   padding: 14px;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tiptap-markdown-react",
-  "version": "0.8.0",
+  "version": "0.8.1",
   "description": "A batteries-included, self-styled Markdown WYSIWYG editor and reader suite built on Tiptap v3. Markdown in/out, SSR/static rendering, table of contents, themeable via CSS variables, zero Ant Design.",
   "type": "module",
   "license": "MIT",