@helping-ai-workflow/md2doc 3.0.0 → 3.0.2

package/lib/md2doc.js

@@ -1086,21 +1086,29 @@ ${itemsHtml}
   // [contentLeft-54, contentLeft-18] until spec §4.2's own numbers were
   // restored), clear of .sidebar-splitter — see the .content rule below.
   //
-  // GEOMETRY, AS MEASURED (S4 T1; the previous version of this comment
-  // claimed "an 8px gap" between the gutter and the table row grip, a number
-  // left over from the v2.11.0 pair position that v2.11.1 invalidated — the
-  // real gap was MINUS 6px, i.e. an overlap):
+  // GEOMETRY, AS MEASURED (v2.12.0/S4 T1; the previous version of this
+  // comment claimed "an 8px gap" between the gutter and the table row grip, a
+  // number left over from the v2.11.0 pair position that v2.11.1
+  // invalidated — the real gap was MINUS 6px, i.e. an overlap):
   //   ⠿          [contentLeft-22, contentLeft-4]   (--ed-gutter-btn wide)
-  //   row grip   [contentLeft,    contentLeft+20]  (--ed-te-grip-row-w wide)
-  // The grip used to be centred on the table's left border at
-  // [contentLeft-10, contentLeft+10], which overlapped the ⠿'s right 6px and
-  // — being position: fixed, z-index 7, on document.body — won the hit test
-  // there. spec §4.2 conflict 2's ruling (grip entirely inside the table)
-  // is landed in lib/editor/client.js's updateTableEdgeGrips(); the
+  //   row grip   [contentLeft-10,  contentLeft+10]  (--ed-te-grip-row-w wide,
+  //              centred on the table's left border)
+  // The grip straddling the table's left border overlapped the ⠿'s right 6px
+  // and — being position: fixed, z-index 7, on document.body — won the hit
+  // test there. v2.12.0/S4 T1's fix moved the grip entirely inside the table
+  // instead (its left edge on the border), which fixed the overlap but
+  // broke the row/column symmetry the user expected (the column grip still
+  // straddles the table's TOP border) — reported as a v3.0.1 regression.
+  // v3.0.1 fixes it at the source instead: the ⠿/＋ pair itself moves
+  // further LEFT by --ed-gutter-shift below, which removes the overlap
+  // without moving the grip at all, so the grip can straddle the border
+  // again (see updateTableEdgeGrips() in lib/editor/client.js). The
   // clearance that remains is exactly --ed-gutter-gap, because the ⠿'s right
-  // edge and the grip's left edge are both derived from it. The grip is kept
-  // off the first cell's TEXT by --ed-te-cell-pad-left below, not by the
-  // 14px default padding, which is narrower than the grip.
+  // edge and the grip's left edge are both derived from it. The grip's
+  // straddling half (10px) sits well inside the first cell's default 14px
+  // left padding, so no extra edit-mode padding is needed any more — the
+  // v2.10.1-era --ed-te-cell-pad-left token this comment used to describe is
+  // gone.
   // (The padding was 48px until §4.2's hit-test conflict 1 was fixed; see the
   // .content rule in editModeLayoutCss below for why it is 56px now.)
   // S1 Task 5: the ordered-list ordinal is drawn by a CSS counter, and the
@@ -1156,12 +1164,14 @@ ${itemsHtml}
      further in, to spec §4.2's own [contentLeft-40, contentLeft-4] — the
      clearance is 16px at this padding rather than 2px. The padding stays at
      56px: nothing asks for the text column to move, and this measurement is
-     the one the §4.2 conflict-1 guard is written against.) The table row grip no
-     longer reaches this far left at all: §4.2 conflict 2 moved it inside the
-     table to [contentLeft, contentLeft+20] (S4 T1), so nothing but the gutter
-     pair itself occupies [contentLeft-40, contentLeft-4]. Guarded by the
-     elementFromPoint(splitter.right - 2, y) assertion §4.2 asks for, in
-     test/editor-client-runtime.test.js. */
+     the one the §4.2 conflict-1 guard is written against.) v3.0.1 shifts the
+     pair a further --ed-gutter-shift (10px) left, to [contentLeft-50,
+     contentLeft-14], so the table row grip can straddle the table's own left
+     border again instead of sitting inside it — see the --ed-gutter-shift
+     comment above .ed-handle below. That still leaves 6px of clearance from
+     splitterRight (contentLeft-56), so the conflict-1 guard still holds.
+     Guarded by the elementFromPoint(splitter.right - 2, y) assertion §4.2
+     asks for, in test/editor-client-runtime.test.js. */
   .content { padding-left: 56px; }
 
   /* S1: every block is one full-width row, whatever its type or depth. The
@@ -1231,38 +1241,41 @@ ${itemsHtml}
      [contentLeft-54, contentLeft-18], which with 56px of padding sits wholly
      inside the content column (2px clear of .sidebar-splitter's right edge —
      see the padding rule's own comment for the measurement), so ＋ never
-     reaches a negative viewport x and never covers the splitter. The table
-     row grip is at [contentLeft, contentLeft+20] since §4.2 conflict 2
-     landed (S4 T1), so the clearance from the ⠿'s right edge is exactly
-     --ed-gutter-gap and cannot drift: both edges are derived from it. */
+     reaches a negative viewport x and never covers the splitter. As of
+     v3.0.1 the table row grip straddles the table's left border again
+     (centred on it, [tableLeft-10, tableLeft+10] — see updateTableEdgeGrips()
+     in lib/editor/client.js), and the pair itself has moved left by
+     --ed-gutter-shift below so the clearance from the ⠿'s right edge is
+     still exactly --ed-gutter-gap and cannot drift: both edges are derived
+     from it. */
   /* Stated ONCE, as tokens, because §4.2's three numbers are not independent:
      the gutter is exactly two buttons wide plus the deliberate right-hand
-     breathing gap, and the hover zone below is exactly the gutter. Writing any
-     of them as a second literal is how the corridor comes back. */
+     breathing gap, and the hover zone below is exactly the gutter plus
+     whatever --ed-gutter-shift moved the pair by. Writing any of them as a
+     second literal is how the corridor comes back. */
   :root {
     --ed-gutter-btn: 18px;
     --ed-gutter-gap: 4px;
     --ed-gutter-w: calc(var(--ed-gutter-btn) * 2 + var(--ed-gutter-gap));
-    /* spec §4.2 hit-test conflict 2, landed S4 T1. The table row grip now
-       sits ENTIRELY inside the table (its LEFT edge on the table's left
-       border — see updateTableEdgeGrips() in lib/editor/client.js), which
-       leaves the ⠿'s right edge and the grip's left edge exactly
-       --ed-gutter-gap apart: the 4px breathing gap §4.2 already keeps on the
-       right of the gutter pair IS the separation. Nothing new is written
-       down, so nothing new can drift.
-       The consequence is this token: the grip is 20px wide and the first
-       column's default padding is 14px, so an inset grip would sit on that
-       cell's TEXT — the v2.10.1 user-acceptance defect that got the first
-       attempt at this ruling reverted. The first column is padded past the
-       grip instead, by the grip's own width plus that same gap. */
-    --ed-te-cell-pad-left: calc(var(--ed-te-grip-row-w) + var(--ed-gutter-gap));
   }
+  /* v3.0.1: the pair moves LEFT by --ed-gutter-shift so the table row grip
+     can straddle the table's left border again (see updateTableEdgeGrips()
+     in lib/editor/client.js) while still keeping --ed-gutter-gap between the
+     ⠿'s right edge and the grip's left edge. Written as a token because the
+     two rules below and the acceptance test all derive from it. Measured at
+     1400x900 (README.md, first table): pre-shift ⠿=[390,408] ＋=[372,390]
+     tableLeft=412; a 10px shift lands ⠿=[380,398] ＋=[362,380], grip
+     (straddling, 20px wide, centred on tableLeft) = [402,422], leaving
+     exactly --ed-gutter-gap (4px) between the ⠿'s right edge (398) and the
+     grip's left edge (402), and ＋'s left edge (362) stays well clear of 0. */
+  :root { --ed-gutter-shift: 10px; }
   .ed-handle {
-    left: calc(-1 * (var(--ed-gutter-btn) + var(--ed-gutter-gap))); top: 0;
+    left: calc(-1 * (var(--ed-gutter-btn) + var(--ed-gutter-gap) + var(--ed-gutter-shift)));
+    top: 0;
     width: var(--ed-gutter-btn);
   }
   .ed-insert {
-    left: calc(-1 * var(--ed-gutter-w)); top: 0;
+    left: calc(-1 * (var(--ed-gutter-w) + var(--ed-gutter-shift))); top: 0;
     width: var(--ed-gutter-btn);
   }
   /* v2.11.1: the gutter's HOVER ZONE, and it is the reason the pair could move
@@ -1291,9 +1304,17 @@ ${itemsHtml}
 
      One absolutely-positioned pseudo-element spanning the whole gutter for the
      block's whole height makes :hover continuously true from the text out
-     past the ＋, at every Y. Its width is the --ed-gutter-w token the pair's
-     own offsets are built from, so the two cannot drift apart — if they do,
-     the corridor comes straight back.
+     past the ＋, at every Y. Its span is derived from the SAME two tokens the
+     pair's own offsets are: --ed-gutter-w (the pair's own width, the gutter
+     proper) plus --ed-gutter-shift (how far v3.0.1 moved the pair left to
+     clear the straddling table row grip). Both edges therefore track the
+     pair automatically — the zone's left edge is exactly the ＋'s left edge
+     and its right edge is the block's, with no literal repeated anywhere —
+     so the two cannot drift apart. If they ever do, the corridor comes
+     straight back: v3.0.1 shifted the pair to [blockLeft-50, blockLeft-14]
+     while this rule still read the un-shifted --ed-gutter-w alone, leaving
+     it spanning [blockLeft-40, blockLeft] — 10px short on the left of the
+     very buttons it exists to keep reachable.
      .ed-block is already position:relative, and position: absolute keeps
      this out of the li row's flex flow. It is deliberately NOT
      pointer-events: none: that would stop it being hit-tested, which is the
@@ -1305,18 +1326,8 @@ ${itemsHtml}
      literal.) */
   .ed-block::before {
     content: ""; position: absolute;
-    left: calc(-1 * var(--ed-gutter-w)); top: 0;
-    width: var(--ed-gutter-w); height: 100%;
-  }
-
-  /* §4.2 conflict 2's other half: the row grip lives inside the first column
-     now, so that column's cells must be padded past it. EDIT MODE ONLY —
-     reader HTML and PDF output keep the shared 7px 14px and stay
-     byte-identical. Only the LEFT padding changes, and only on the first
-     cell of each row; every other cell is untouched. */
-  .ed-block[data-block-type="table"] th:first-child,
-  .ed-block[data-block-type="table"] td:first-child {
-    padding-left: var(--ed-te-cell-pad-left);
+    left: calc(-1 * (var(--ed-gutter-w) + var(--ed-gutter-shift))); top: 0;
+    width: calc(var(--ed-gutter-w) + var(--ed-gutter-shift)); height: 100%;
   }`;
 
   const html = `<!DOCTYPE html>
@@ -2174,6 +2185,17 @@ ${itemsHtml}
   }
   .ed-block:hover .ed-handle,
   .ed-handle:focus { opacity: 1; }
+  /* v3.0.2: a table's row grip is a document.body child at z-index 7 that
+     straddles the table's left border, and a table block's ⠿ sits at the
+     header row's own Y — so a pointer travelling left toward the ⠿ crosses
+     the grip, elementFromPoint stops returning the block, and :hover above
+     goes false mid-approach. The grip cannot move (it must be a body child
+     to stay put while the table scrolls), so lib/editor/client.js holds the
+     gutter lit with this class for the duration instead. It does NOT
+     restore :hover, so .ed-block:hover's own outline still blinks there —
+     a recorded, unfixed residue. */
+  .ed-block.ed-keep-lit .ed-handle,
+  .ed-block.ed-keep-lit .ed-insert { opacity: 1; }
   .ed-handle:hover { background: rgba(0, 0, 0, 0.08); }
   /* The ⠿ handle's menu: 轉換成 › / 建立副本 / 刪除 / MD 原始碼 (spec §3.7),
      each led by a 16px currentColor icon (v2.12.0; drawn in
@@ -2196,7 +2218,11 @@ ${itemsHtml}
     box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
   }
   .ed-handle-menu-btn {
-    min-width: 132px; height: 26px; padding: 0 10px;
+    /* v3.0.1: the icon sits FLUSH LEFT and the label sits one space-width
+       after it (user request: 「符號靠左對齊，文字跟符號間距一個空格」).
+       The right padding is untouched — it is what keeps the 轉換成 row's
+       chevron off the panel edge. */
+    min-width: 132px; height: 26px; padding: 0 10px 0 6px;
     border: 1px solid rgba(255, 255, 255, 0.25); border-radius: 6px;
     background: rgba(255, 255, 255, 0.08); color: inherit;
     font: inherit; font-size: 12px; line-height: 1;
@@ -2207,8 +2233,10 @@ ${itemsHtml}
        width, so S2's one-left-edge / monotonic-top invariants are untouched.
        The submenu's own buttons carry this class and no icon; a lone text node
        is an anonymous flex item at flex-start, i.e. exactly where text-align
-       put it. */
-    display: flex; align-items: center; gap: 8px;
+       put it.
+       v3.0.1: gap dropped from 8px to 4px — one space-width at this 12px
+       font size — now that every row (both menu levels) carries an icon. */
+    display: flex; align-items: center; gap: 4px;
   }
   /* Notion's own sizing. The stroke colour is NOT set here on purpose: the
      markup carries stroke="currentColor" (lib/editor/client.js), so the icon
@@ -2216,8 +2244,20 @@ ${itemsHtml}
      retheme for free. A hex here would break that silently. (No backticks in
      this comment: it lives inside a JS template literal.)
      flex: 0 0 auto because a 16px-wide flex item next to a nowrap label
-     would otherwise be the thing that shrinks. */
-  .ed-menu-icon { flex: 0 0 auto; width: 16px; height: 16px; }
+     would otherwise be the thing that shrinks.
+     v3.0.1: the selector is ".ed-handle-menu-btn .ed-menu-icon", not the
+     bare class — the gutter menu is appended INTO a ".ed-block"
+     (lib/editor/client.js's blockEl.appendChild(gutterMenu)), which is a
+     descendant of <main class="content">, and ".content svg" above
+     carries "margin: 0 auto" at specificity (0,1,1) (one class, one
+     type). The bare ".ed-menu-icon" is only (0,1,0) and LOSES that fight
+     regardless of source order, so every icon picked up centering
+     auto-margins instead of sitting flush left — measured on this branch
+     as an icon offset that swung with label length (11px-40px) instead
+     of a constant one. Scoping under ".ed-handle-menu-btn" raises this
+     to (0,2,0), which wins on class count alone. (No backticks in this
+     comment: it lives inside a JS template literal.) */
+  .ed-handle-menu-btn .ed-menu-icon { flex: 0 0 auto; width: 16px; height: 16px; margin: 0; }
   /* The 轉換成 submenu carries BOTH classes, so it inherits every rule above
      and only overrides the horizontal offset. It is a CHILD of the menu, and
      the menu is itself position:absolute, so the menu's own padding box is
@@ -2361,18 +2401,23 @@ ${itemsHtml}
      affordance) with two real, adequately-sized (>=18x24px) click/drag
      targets. '.ed-te-grip-row' is a vertical 6-dot handle shown at the LEFT
      EDGE of the hovered row -- every row, the HEADER included (spec 3.10:
-     the header is draggable too), sitting ENTIRELY INSIDE the table with its
-     LEFT edge on the table's left border (spec 4.2 hit-test conflict 2,
-     landed in S4 T1). The two axes are therefore NOT mirror images any more:
-     '.ed-te-grip-col' still straddles the table's TOP border, because nothing
-     of the page's own chrome lives up there. The row axis cannot: MEASURED on
-     v2.12.0 at 1400x900, the straddling grip occupied [tableLeft-10,
-     tableLeft+10] while the block's own '.ed-handle' occupied [blockLeft-22,
-     blockLeft-4] with tableLeft == blockLeft, so the grip (position: fixed,
-     z-index 7, on document.body) won the hit test for the RIGHT 6px of every
-     ⠿ whose Y band it reached. The first column's own padding is widened in
-     the edit-mode-only layout chunk near the end of this stylesheet so the
-     inset grip still never reaches cell TEXT; '.ed-te-grip-col' is a horizontal 6-dot
+     the header is draggable too), STRADDLING the table's left border,
+     centred on it (spec 4.2 hit-test conflict 2). v2.12.0/S4 T1 tried moving
+     it entirely inside the table instead (left edge on the border) to stop it
+     winning the hit test against the block's own ⠿ — MEASURED at 1400x900,
+     the straddling grip occupied [tableLeft-10, tableLeft+10] while
+     '.ed-handle' occupied [blockLeft-22, blockLeft-4] with tableLeft ==
+     blockLeft, so the grip (position: fixed, z-index 7, on document.body)
+     won the hit test for the RIGHT 6px of every ⠿ whose Y band it reached —
+     but that broke the row/column symmetry the user expected ('.ed-te-grip-col'
+     still straddles the table's TOP border, because nothing of the page's
+     own chrome lives up there), and was reported as a regression. v3.0.1
+     restores the straddle and instead moves the ⠿/＋ pair itself further left
+     by --ed-gutter-shift, which removes the overlap at its source (see the
+     edit-mode-only layout chunk near the end of this stylesheet); the row
+     grip's straddling half sits well inside the first cell's default 14px
+     padding, so no extra padding token is needed either.
+     '.ed-te-grip-col' is a horizontal 6-dot
      handle shown just ABOVE the hovered column (every column). Dots are plain <span>s laid out via CSS grid with
      place-content: center, so the dot cluster stays compact/centered
      regardless of the button's own (larger, hit-target-sized) box — no
@@ -2391,12 +2436,12 @@ ${itemsHtml}
   .ed-te-grip:hover { background: rgba(0, 0, 0, 0.06); }
   .ed-te-grip-dot { width: 3px; height: 3px; border-radius: 50%; background: #9ca3af; }
   .ed-te-grip:hover .ed-te-grip-dot { background: #6b7280; }
-  /* spec §4.2 hit-test conflict 2 (S4 T1): the row grip's width is a TOKEN
-     because two other numbers are derived from it — lib/editor/client.js pins
-     the grip's LEFT edge to the table's left border (so the whole grip is
-     inside the first column and shares no pixel with the block gutter's ⠿),
-     and the edit-mode first-column padding must be wide enough to host it
-     without covering cell text. Written once here, derived twice below. */
+  /* spec §4.2 hit-test conflict 2: the row grip's width is a TOKEN because
+     lib/editor/client.js's updateTableEdgeGrips() reads it (via
+     gripRowWidthPx()) to CENTRE the grip on the table's left border —
+     tableRect.left - gw / 2. Written once here, read once there, so the CSS
+     width and the JS position can never drift apart the way they did when
+     the position was a hard-coded literal 20. */
   :root { --ed-te-grip-row-w: 20px; }
   .ed-te-grip-row {
     width: var(--ed-te-grip-row-w); height: 28px; cursor: grab; z-index: 7;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@helping-ai-workflow/md2doc",
-  "version": "3.0.0",
+  "version": "3.0.2",
   "description": "Markdown → HTML / PDF renderer with WaveDrom, Mermaid, and Graphviz support",
   "keywords": [
     "markdown",
@@ -36,7 +36,7 @@
   },
   "scripts": {
     "preinstall": "node scripts/preinstall.js",
-    "test": "node test/md2doc.test.js && node test/blockmap.test.js && node test/images.test.js && node test/scroll-anchor.test.js && node test/lightbox.test.js && node test/lightbox-anno.test.js && node test/lightbox-anno-style.test.js && node test/reader-panels.test.js && node test/cli.test.js && node test/code-operator.test.js && node test/convert-md.test.js && node test/render-api.test.js && node test/lineops.test.js && node test/indent-clamp.test.js && node test/selection.test.js && node test/editmode-render.test.js && node test/editmode-wavedrom-reinit.test.js && node test/editor-server.test.js && node test/cli-edit.test.js && node test/open-viewer.test.js && node test/editor-client.test.js && node test/editor-client-runtime.test.js && node test/roundtrip.test.js && node test/byte-stability.test.js && node test/editor-server-throw.test.js && node test/editor-reader-rebind.test.js && node test/inline-md.test.js && node test/table-md.test.js && node test/gate-compat.test.js && node test/history.test.js && node test/list-md.test.js"
+    "test": "node test/md2doc.test.js && node test/blockmap.test.js && node test/images.test.js && node test/scroll-anchor.test.js && node test/lightbox.test.js && node test/lightbox-anno.test.js && node test/lightbox-anno-style.test.js && node test/reader-panels.test.js && node test/cli.test.js && node test/code-operator.test.js && node test/convert-md.test.js && node test/render-api.test.js && node test/lineops.test.js && node test/indent-clamp.test.js && node test/selection.test.js && node test/editmode-render.test.js && node test/editmode-wavedrom-reinit.test.js && node test/editor-server.test.js && node test/cli-edit.test.js && node test/open-viewer.test.js && node test/editor-client.test.js && node test/editor-client-runtime.test.js && node test/roundtrip.test.js && node test/byte-stability.test.js && node test/editor-server-throw.test.js && node test/editor-reader-rebind.test.js && node test/inline-md.test.js && node test/table-md.test.js && node test/gate-compat.test.js && node test/history.test.js && node test/list-md.test.js && node test/table-width.test.js"
   },
   "repository": {
     "type": "git",