@helping-ai-workflow/md2doc 3.2.1 → 3.4.0

package/lib/editor/toolbar-model.js

@@ -11,11 +11,14 @@
   else root.md2docToolbarModel = factory();
 })(typeof self !== 'undefined' ? self : this, function () {
 
-// The 22-button roster, spec §4 table (`export▾` moved out of scope — no
-// browser-reachable export path). Six groups, in render order; group order
-// here doubles as separator placement for the caller (a separator sits
-// between consecutive groups).
+// The 23-button roster, spec §4 table (`export▾` moved out of scope — no
+// browser-reachable export path) plus the v3.4.0 §3 `save` button. Seven
+// groups, in render order; group order here doubles as separator placement
+// for the caller (a separator sits between consecutive groups).
 const BUTTON_DEFS = [
+  // file
+  { id: 'save', group: 'file', label: '💾', icon: '💾', title: '儲存 (Ctrl+S)', toggle: false },
+
   // history
   { id: 'undo', group: 'history', label: 'Undo', icon: '↶', title: '復原 (Ctrl+Z)', toggle: false },
   { id: 'redo', group: 'history', label: 'Redo', icon: '↷', title: '重做 (Ctrl+Y)', toggle: false },
@@ -29,11 +32,11 @@ const BUTTON_DEFS = [
   { id: 'check', group: 'block', label: '☑', icon: '☑', title: '待辦清單', toggle: false },
 
   // inline
-  { id: 'bold', group: 'inline', label: 'B', icon: 'B', title: '粗體', toggle: false },
-  { id: 'italic', group: 'inline', label: 'I', icon: 'I', title: '斜體', toggle: false },
-  { id: 'strike', group: 'inline', label: 'S', icon: 'S', title: '刪除線', toggle: false },
-  { id: 'inline-code', group: 'inline', label: '`', icon: '`', title: '行內程式碼', toggle: false },
-  { id: 'link', group: 'inline', label: '🔗', icon: '🔗', title: '連結', toggle: false },
+  { id: 'bold', group: 'inline', label: 'B', icon: 'B', title: '粗體', toggle: true },
+  { id: 'italic', group: 'inline', label: 'I', icon: 'I', title: '斜體', toggle: true },
+  { id: 'strike', group: 'inline', label: 'S', icon: 'S', title: '刪除線', toggle: true },
+  { id: 'inline-code', group: 'inline', label: '`', icon: '`', title: '行內程式碼', toggle: true },
+  { id: 'link', group: 'inline', label: '🔗', icon: '🔗', title: '連結', toggle: true },
 
   // indent
   { id: 'outdent', group: 'indent', label: '⇤', icon: '⇤', title: '減少縮排', toggle: false },
@@ -59,14 +62,53 @@ const BUTTON_DEFS = [
 
 const BUTTONS = Object.freeze(BUTTON_DEFS.map((b) => Object.freeze(Object.assign({}, b))));
 
-const GROUPS = Object.freeze(['history', 'block', 'inline', 'indent', 'insert', 'view']);
+const GROUPS = Object.freeze(['file', 'history', 'block', 'inline', 'indent', 'insert', 'view']);
 
 // Buttons that stay enabled even when there is no block at all (the zeroed
 // state right after rerenderAll, before any block gets focus/selection).
-const NO_BLOCK_ALLOWED = new Set(['undo', 'redo', 'outline', 'preview']);
+// v3.4.0 §3: 'save' is here because unsaved changes have nothing to do with
+// where the caret is — a document can be dirty with no block focused at all.
+// NOTE (ruling P2): this entry does NOT currently change save's behaviour.
+// `state.save.disabled = !dirty` below runs AFTER the no-block loop that
+// reads this set, so it unconditionally overwrites whatever the no-block
+// loop decided for 'save' — today the two never disagree in a way that
+// shows through. This entry is kept anyway because it records the intent
+// ("save must not be gateable on hasBlock") independently of where the
+// `!dirty` line happens to sit; if that line is ever moved above the
+// no-block loop, this set becomes the only thing still enforcing it. Do not
+// delete it as "dead code" without re-checking that ordering.
+const NO_BLOCK_ALLOWED = new Set(['undo', 'redo', 'outline', 'preview', 'save']);
+
+// The mark element each inline button toggles. This module cannot ask the
+// DOM which marks a selection sits in, so the client measures that and hands
+// the answer in as `ctx.marks` — keyed by TAG, not by button id, because
+// .ed-seltb carries a U button with no counterpart in this roster and both
+// toolbars are painted from one measurement. The mapping from button to tag
+// has to live somewhere, and here is where the button ids are.
+const MARK_TAG_BY_ID = Object.freeze({
+  bold: 'STRONG',
+  italic: 'EM',
+  strike: 'DEL',
+  'inline-code': 'CODE',
+  link: 'A',
+});
 
-// ctx: {blockType, indent, headingDepth, inList, listOrdered, hasSelection, mode}
-// -> { [id]: {active: bool, disabled: bool, label?: string} }
+// The inline-format ids, read off the map above rather than retyped. The
+// `hasSelection` rule below used to carry a hand-written copy of this list;
+// the marks rule under it would have been a second.
+const MARK_IDS = Object.freeze(Object.keys(MARK_TAG_BY_ID));
+
+// The per-tag values `ctx.marks` may carry, and what each one means for the
+// button that toggles that tag. The client's selectionMarkStates() is what
+// produces them; the names are shared vocabulary, not a re-derivation.
+//   'whole'   the selection lies inside one mark of that tag
+//   'partial' the selection overlaps marks of that tag without lying in one
+//   'none'    no mark of that tag is involved
+//   'inert'   pressing the button would do nothing at all
+
+// ctx: {blockType, indent, headingDepth, inList, listOrdered, hasSelection,
+//       mode, marks}
+// -> { [id]: {active: bool, mixed: bool, disabled: bool, label?: string} }
 function deriveState(ctx) {
   const c = ctx || {};
   const blockType = c.blockType;
@@ -75,11 +117,12 @@ function deriveState(ctx) {
   const inList = !!c.inList;
   const listOrdered = !!c.listOrdered;
   const mode = c.mode;
+  const dirty = !!c.dirty;
   const hasBlock = blockType !== null && blockType !== undefined;
 
   const state = {};
   for (const b of BUTTONS) {
-    state[b.id] = { active: false, disabled: false };
+    state[b.id] = { active: false, mixed: false, disabled: false };
   }
 
   // v3.2.1: the mode button names the NEXT state, never the current one.
@@ -152,24 +195,79 @@ function deriveState(ctx) {
   // refuse for reasons this ctx does not carry (a structural list gate, a
   // block that owns no source line).
   if (!c.hasSelection) {
-    for (const id of ['bold', 'italic', 'strike', 'inline-code', 'link']) {
+    for (const id of MARK_IDS) {
       state[id].disabled = true;
     }
   }
 
+  // v3.3.0 (F2): what the selection is already marked as. Before this the ctx
+  // carried one boolean about the selection and nothing about its identity.
+  // MEASURED on the build before this change, reading the fixed toolbar's B
+  // over a selection wholly inside a <strong>, one straddling its edge, and one
+  // in plain text: aria-pressed came back null on all three — the buttons were
+  // `toggle: false`, so the client's aria-pressed write skipped them.
+  //
+  // `active` and `mixed` are separate booleans rather than one tri-state
+  // because `active` is what the toggle-roster test sweeps for and what the
+  // rest of this function already speaks. The client turns the pair into
+  // aria-pressed true / mixed / false.
+  //
+  // 'inert' disables. It is NOT the same question as `hasSelection`: that one
+  // asks whether the action would refuse the selection outright, this one asks
+  // whether the branch the action would actually take is a no-op. A press on
+  // an inert button leaves the document exactly as it was.
+  const marks = c.marks;
+  if (marks) {
+    for (const id of MARK_IDS) {
+      const m = marks[MARK_TAG_BY_ID[id]];
+      state[id].active = m === 'whole';
+      state[id].mixed = m === 'partial';
+      if (m === 'inert') state[id].disabled = true;
+    }
+  }
+
+  // v3.4.0 §3: the save button IS the save-state indicator — grey when the
+  // document matches disk, lit when it does not. The truth stays
+  // single-sourced: client.js's `documentIsDirty()` — since v3.4.0 batch3
+  // Task 7 that is `stack.isDirty() || burstHasUncommittedEdit() ||
+  // waveUnwrittenEdit` — arrives as ctx.dirty and is not recomputed here.
+  // This runs before the source-mode override below so that override can
+  // still give save its own exemption.
+  state.save.disabled = !dirty;
+
   // mode 'source' is the full-document raw-source escape hatch: everything
   // is disabled except the mode button that got you there (id 'preview',
-  // which in v3.2.1 is the edit <-> source toggle). This overrides every
-  // disabled flag computed above, and is the ONLY way back out — do not
-  // narrow it.
+  // which in v3.2.1 is the edit <-> source toggle), since T11-2 'outline'
+  // (☰), and since v3.4.0 §3 'save'. The mode button is still the ONLY way
+  // back to 'edit' — that has not changed. 'outline' stays reachable because
+  // it is what opens the sidebar drawer (toggleOutlineSidebar() in
+  // lib/editor/client.js), and the fixed `.sidebar-toggle` button that used
+  // to reach the drawer another way is hidden in edit mode entirely (see the
+  // T11-2 comment in lib/md2doc.js) — a disabled ☰ here would leave source
+  // mode with no way to open that drawer at all. 'save' stays reachable
+  // because source mode can still hold unsaved changes (the user can type
+  // into the source textarea) — see the per-button comment below for the
+  // exact shape of the exemption. This override still runs last and still
+  // overrides every disabled flag computed above for every other button; do
+  // not narrow it for anything but these three ids.
   if (mode === 'source') {
     for (const b of BUTTONS) {
-      state[b.id].disabled = b.id !== 'preview';
+      if (b.id === 'preview' || b.id === 'outline') { state[b.id].disabled = false; continue; }
+      // v3.4.0 §3: save is a third exemption, for the same shape of reason
+      // outline already had one — source mode can still hold unsaved
+      // changes (the user can type into the source textarea), so forcing
+      // the only save button grey here would make a mode that holds
+      // unsaved work with no way out of it. The exemption is from the MODE
+      // forcing it grey, not from being grey — a clean document still shows
+      // it disabled in source mode (see the `state.save.disabled = !dirty`
+      // line above, which already ran and is left untouched here).
+      if (b.id === 'save') continue;
+      state[b.id].disabled = true;
     }
   }
 
   return state;
 }
 
-return { BUTTONS, GROUPS, deriveState };
+return { BUTTONS, GROUPS, MARK_TAG_BY_ID, deriveState };
 });