archymedes-cli 2.3.0 → 2.5.0

package/dist/{archymedes-g8y3rt6t.mjs → archymedes-5vhvv8kr.mjs}

@@ -7,14 +7,17 @@ import {
   STRIKE,
   UNICODE_GLYPHS,
   borderGlyphsFor,
+  codeStyle,
+  highlightSyntax,
+  newSyntaxState,
   paint,
   rainbowText,
   rgbTo256,
   roleCode,
   visibleWidth
-} from "./archymedes-a10k8yrk.mjs";
+} from "./archymedes-130jt0wr.mjs";
 
-// src/terminal/output.ts
+// packages/archymedes-cli/src/terminal/output.ts
 var terminalStream = {
   write(text) {
     process.stdout.write(text);
@@ -26,6 +29,90 @@ var terminalStream = {
     return process.stdout.rows;
   }
 };
+var DEFAULT_SCROLLBACK_LINES = 5000;
+
+class LineLog {
+  limit;
+  committed = [];
+  partial = "";
+  droppedLines = 0;
+  constructor(limit = DEFAULT_SCROLLBACK_LINES) {
+    this.limit = limit;
+  }
+  write(text) {
+    if (text === "")
+      return;
+    const parts = (this.partial + text).split(`
+`);
+    this.partial = parts.pop() ?? "";
+    for (const line of parts)
+      this.commit(line);
+  }
+  commit(line) {
+    this.committed.push(line);
+    if (this.committed.length > this.limit) {
+      this.committed.shift();
+      this.droppedLines += 1;
+    }
+  }
+  flush() {
+    if (this.partial === "")
+      return;
+    this.commit(this.partial);
+    this.partial = "";
+  }
+  get lines() {
+    return this.committed;
+  }
+  get pending() {
+    return this.partial;
+  }
+  get size() {
+    return this.committed.length;
+  }
+  get dropped() {
+    return this.droppedLines;
+  }
+  tail(count) {
+    return count <= 0 ? [] : this.committed.slice(Math.max(0, this.committed.length - count));
+  }
+  clear() {
+    this.committed.length = 0;
+    this.partial = "";
+    this.droppedLines = 0;
+  }
+}
+
+class TabSink {
+  downstream;
+  log;
+  live;
+  constructor(downstream = terminalStream, options = {}) {
+    this.downstream = downstream;
+    this.live = options.live ?? false;
+    this.log = new LineLog(options.limit);
+  }
+  get isLive() {
+    return this.live;
+  }
+  setLive(live) {
+    if (!live)
+      this.log.flush();
+    this.live = live;
+  }
+  write(text) {
+    this.log.write(text);
+    if (this.live)
+      this.downstream.write(text);
+  }
+  get columns() {
+    return this.downstream.columns;
+  }
+  get rows() {
+    return this.downstream.rows;
+  }
+}
+
 class OutputRouter {
   target;
   constructor(target = terminalStream) {
@@ -52,7 +139,7 @@ function replayLines(log, count) {
   return { lines, dropped: log.dropped, omitted: Math.max(0, log.size - lines.length) };
 }
 
-// src/render/markdown.ts
+// packages/archymedes-cli/src/render/markdown.ts
 var colour = (role, palette) => palette?.[role] || ANSI_PALETTE[role];
 var INLINE_PATTERN = /(?<!\\)(`[^`\n]+`)|(?<!\\)(\*\*[^*\n]+\*\*)|(?<!\\)(__[^_\n]+__)|(?<!\\)(~~[^~\n]+~~)|(?<!\\)(\*[^*\n]+\*)|(?<!\\)(_[^_\n]+_)|(!?\[([^\]\n]+)\]\((https?:\/\/[^\s)\n]+)\))|(<(https?:\/\/[^>\s]+)>)/g;
 var unescapeMarkdown = (text) => text.replace(/\\([\\`*_[\]{}()#+.!~>-])/g, "$1");
@@ -142,7 +229,7 @@ function wrapTokens(tokens, width, options) {
   return lines;
 }
 function newMarkdownState() {
-  return { inFence: false, fenceLanguage: "" };
+  return { inFence: false, fenceLanguage: "", fenceLine: 0, fenceSyntax: newSyntaxState() };
 }
 var HEADING = /^(#{1,6})\s+(.*)$/;
 var BULLET = /^(\s*)([-*+])\s+(.*)$/;
@@ -189,16 +276,24 @@ function renderMarkdownLine(line, state, options) {
     if (state.inFence) {
       state.inFence = false;
       state.fenceLanguage = "";
+      state.fenceLine = 0;
+      state.fenceSyntax = newSyntaxState();
       return [paint(`  ${glyphs.boxBottomLeft}${glyphs.boxHorizontal.repeat(ruleWidth)}`, DIM, depth)];
     }
     state.inFence = true;
     state.fenceLanguage = fence[1].trim();
+    state.fenceLine = 0;
+    state.fenceSyntax = newSyntaxState();
     const label = state.fenceLanguage ? ` ${state.fenceLanguage} ` : "";
     const drawn = 1 + visibleWidth(label);
-    return [paint(`  ${glyphs.boxTopLeft}${glyphs.boxHorizontal}${label}${glyphs.boxHorizontal.repeat(Math.max(0, ruleWidth - drawn))}`, DIM, depth)];
+    return [`${paint(`  ${glyphs.boxTopLeft}${glyphs.boxHorizontal}`, DIM, depth)}${label ? paint(label, `${BOLD}${colour("primary", palette)}`, depth) : ""}${paint(glyphs.boxHorizontal.repeat(Math.max(0, ruleWidth - drawn)), DIM, depth)}`];
   }
   if (state.inFence) {
-    return [`${paint(`  ${glyphs.boxVertical} `, DIM, depth)}${paint(line, colour("success", palette), depth)}`];
+    state.fenceLine += 1;
+    const style = codeStyle();
+    const number = style.lineNumbers ? `${paint(String(state.fenceLine).padStart(3), DIM, depth)}  ` : "";
+    const code = style.colors === "vscode" ? highlightSyntax(line, { language: state.fenceLanguage, depth, palette, state: state.fenceSyntax }) : paint(line, colour("success", palette), depth);
+    return [`${paint(`  ${glyphs.boxVertical} `, DIM, depth)}${number}${code}`];
   }
   const table = tableCells(line);
   if (table) {
@@ -265,12 +360,107 @@ function renderMarkdown(text, options) {
 `);
 }
 
-// src/render/tui.ts
+// packages/archymedes-cli/src/render/tui.ts
 function archymedesSpinnerFrame(index, glyphs = UNICODE_GLYPHS) {
   const frames = glyphs.spinnerFrames;
   const normalized = Number.isFinite(index) ? Math.max(0, Math.floor(index)) : 0;
   return frames[normalized % frames.length];
 }
+
+class Spinner {
+  onTick;
+  intervalMs;
+  glyphs;
+  delayMs;
+  frame = 0;
+  timer;
+  delay;
+  constructor(onTick, intervalMs = 120, glyphs = UNICODE_GLYPHS, delayMs = 0) {
+    this.onTick = onTick;
+    this.intervalMs = intervalMs;
+    this.glyphs = glyphs;
+    this.delayMs = delayMs;
+  }
+  start() {
+    if (this.timer || this.delay)
+      return;
+    const begin = () => {
+      this.delay = undefined;
+      this.onTick();
+      this.timer = setInterval(() => {
+        this.frame = (this.frame + 1) % this.glyphs.spinnerFrames.length;
+        this.onTick();
+      }, this.intervalMs);
+    };
+    if (this.delayMs <= 0)
+      begin();
+    else
+      this.delay = setTimeout(begin, this.delayMs);
+  }
+  stop() {
+    if (this.delay) {
+      clearTimeout(this.delay);
+      this.delay = undefined;
+    }
+    if (!this.timer)
+      return;
+    clearInterval(this.timer);
+    this.timer = undefined;
+  }
+  get glyph() {
+    return archymedesSpinnerFrame(this.frame, this.glyphs);
+  }
+}
+function formatCountdown(remainingMs) {
+  const totalSeconds = Math.max(0, Math.ceil(remainingMs / 1000));
+  if (totalSeconds < 60)
+    return `${totalSeconds}s`;
+  const minutes = Math.floor(totalSeconds / 60);
+  const seconds = totalSeconds % 60;
+  return `${minutes}m ${String(seconds).padStart(2, "0")}s`;
+}
+
+class CountdownTimer {
+  onTick;
+  onDone;
+  intervalMs;
+  timer;
+  endsAt;
+  constructor(durationMs, onTick, onDone, intervalMs = 1000) {
+    this.onTick = onTick;
+    this.onDone = onDone;
+    this.intervalMs = intervalMs;
+    this.endsAt = Date.now() + Math.max(0, durationMs);
+  }
+  get remaining() {
+    return Math.max(0, this.endsAt - Date.now());
+  }
+  start() {
+    if (this.timer)
+      return;
+    if (this.remaining <= 0) {
+      this.onDone();
+      return;
+    }
+    this.onTick(this.remaining);
+    this.timer = setInterval(() => {
+      const left = this.remaining;
+      if (left <= 0) {
+        this.stop();
+        this.onDone();
+        return;
+      }
+      this.onTick(left);
+    }, this.intervalMs);
+  }
+  stop() {
+    if (!this.timer)
+      return;
+    clearInterval(this.timer);
+    this.timer = undefined;
+  }
+}
+
 class Spring {
   angularFrequency;
   dampingRatio;
@@ -355,6 +545,21 @@ class SpringAnimator {
     this.timer = undefined;
   }
 }
+function formatHeaderSegments(segments, width, separator = " · ") {
+  const limit = Math.max(0, Math.floor(width));
+  if (limit === 0 || segments.length === 0)
+    return "";
+  let kept = [...segments];
+  while (kept.length > 0) {
+    const rendered = kept.map((segment) => segment.full).join(separator);
+    if (visibleWidth(rendered) <= limit)
+      return rendered;
+    kept = kept.slice(0, -1);
+  }
+  const first = segments[0];
+  const compact = first.compact ?? first.full;
+  return visibleWidth(compact) <= limit ? compact : "";
+}
 function formatElapsed(ms) {
   const seconds = ms / 1000;
   return seconds < 60 ? `${seconds.toFixed(1)}s` : `${Math.floor(seconds / 60)}m ${Math.round(seconds % 60)}s`;
@@ -525,6 +730,7 @@ function formatStatusLine(fields, width, depth, glyphs = UNICODE_GLYPHS, accent
     fields.toolCalls > 0 ? `${fields.toolCalls} tool${fields.toolCalls === 1 ? "" : "s"}` : "",
     fields.badge ?? "",
     fields.steps && fields.steps.total > 0 ? stepProgress(fields.steps.done, fields.steps.total, { label: fields.steps.label ?? "steps", depth: "none" }) : "",
+    fields.allowance?.text ?? "",
     fields.mode,
     fields.balance ?? ""
   ].filter((segment) => segment !== "");
@@ -542,7 +748,9 @@ function formatStatusLine(fields, width, depth, glyphs = UNICODE_GLYPHS, accent
         return width > 0 ? paint(glyphs.star, accent, depth) : "";
       }
       const gap = Math.max(1, width - visibleWidth(left) - right.length);
-      return `${paintedLeft}${" ".repeat(gap)}${paint(right, DIM, depth)}`;
+      const warned = fields.allowance?.warning ? fields.allowance.text : undefined;
+      const paintedRight = warned && kept.includes(warned) ? [...kept, formatElapsed(fields.elapsedMs)].map((segment) => paint(segment, segment === warned ? roleCode("warning", undefined, depth) : DIM, depth)).join(paint(separator, DIM, depth)) : paint(right, DIM, depth);
+      return `${paintedLeft}${" ".repeat(gap)}${paintedRight}`;
     }
     kept = kept.slice(0, -1);
   }
@@ -778,7 +986,12 @@ function joinHorizontal(left, right, options) {
 }
 var TONE_ROLE = { cyan: "primary", green: "success", yellow: "warning", red: "error" };
 var MODE_ROLE = { plan: "warning", auto: "success", build: "primary", defender: "error" };
+var PROMPT_PREFIX_COLUMNS = 4;
 var PROMPT_CHROME_COLUMNS = 6;
+function promptStatusRoom(mode, workspace, width, glyphs = UNICODE_GLYPHS) {
+  const compactTitle = `${glyphs.star} ${mode}`;
+  return Math.max(0, Math.max(12, width) - visibleWidth(compactTitle) - PROMPT_CHROME_COLUMNS - 3);
+}
 function renderPromptBox(options) {
   const { mode, workspace, depth } = options;
   const glyphs = options.glyphs ?? UNICODE_GLYPHS;
@@ -813,6 +1026,116 @@ function renderPromptBox(options) {
   const bottom = `${paint(border.bottomLeft, primary, depth)}${horizontal(width - 2)}${paint(border.bottomRight, primary, depth)}`;
   return { top, prefix, bottom };
 }
+function dropupPaintInPlace(lines) {
+  if (lines.length === 0)
+    return "";
+  const parts = ["\x1B7\x1B[?25l", `\x1B[${lines.length + 1}A`];
+  for (const line of lines)
+    parts.push(`\r\x1B[2K${line}\x1B[1B`);
+  parts.push("\x1B8\x1B[?25h");
+  return parts.join("");
+}
+function dropupEraseBlock(currentRows) {
+  return `\x1B[?25l\x1B[${currentRows + 1}A\r\x1B[0J`;
+}
+
+class PromptBox {
+  stream;
+  options;
+  drawn = false;
+  borderCleared = false;
+  suggestions = [];
+  constructor(stream = terminalStream, options = { depth: "none" }) {
+    this.stream = stream;
+    this.options = options;
+  }
+  get isDrawn() {
+    return this.drawn;
+  }
+  get width() {
+    return Math.max(1, this.options.columns?.() ?? this.stream.columns ?? 80);
+  }
+  draw(mode, workspace, status) {
+    const { prefix } = this.paintBlock(mode, workspace, status);
+    this.drawn = true;
+    this.borderCleared = false;
+    return prefix;
+  }
+  paintBlock(mode, workspace, status) {
+    const { top, prefix, bottom } = renderPromptBox({
+      mode,
+      workspace,
+      depth: this.options.depth,
+      palette: this.options.palette?.(),
+      width: this.width,
+      ...status === undefined ? {} : { status },
+      ...this.options.glyphs === undefined ? {} : { glyphs: this.options.glyphs },
+      ...this.options.borderStyle === undefined ? {} : { borderStyle: this.options.borderStyle }
+    });
+    for (const line of this.suggestions)
+      this.stream.write(`${line}
+`);
+    this.stream.write(`${top}
+`);
+    this.stream.write(`
+${bottom}`);
+    this.stream.write("\x1B[1A\r");
+    return { prefix };
+  }
+  get suggestionRows() {
+    return this.suggestions.length;
+  }
+  setSuggestions(lines, bar) {
+    if (!this.drawn)
+      return { moved: false };
+    const next = [...lines];
+    if (next.length === this.suggestions.length) {
+      if (next.every((line, index) => line === this.suggestions[index]))
+        return { moved: false };
+      this.suggestions = next;
+      if (next.length > 0)
+        this.stream.write(dropupPaintInPlace(next));
+      return { moved: false };
+    }
+    this.stream.write(dropupEraseBlock(this.suggestions.length));
+    this.suggestions = next;
+    this.paintBlock(bar.mode, bar.workspace, bar.status);
+    this.stream.write("\x1B[?25h");
+    this.borderCleared = false;
+    return { moved: true };
+  }
+  restoreBottomBorder(mode, workspace, status) {
+    if (!this.drawn || this.borderCleared)
+      return;
+    const { bottom } = renderPromptBox({
+      mode,
+      workspace,
+      depth: this.options.depth,
+      palette: this.options.palette?.(),
+      width: this.width,
+      ...status === undefined ? {} : { status },
+      ...this.options.glyphs === undefined ? {} : { glyphs: this.options.glyphs },
+      ...this.options.borderStyle === undefined ? {} : { borderStyle: this.options.borderStyle }
+    });
+    this.stream.write(`\x1B7\x1B[?25l\x1B[1B\r\x1B[2K${bottom}\x1B8\x1B[?25h`);
+  }
+  erase(submitted) {
+    if (!this.drawn)
+      return;
+    const rows = Math.floor((PROMPT_PREFIX_COLUMNS + visibleWidth(submitted) - 1) / this.width) + 3 + this.suggestions.length;
+    for (let index = 0;index < rows; index += 1)
+      this.stream.write("\x1B[1A\x1B[2K");
+    this.suggestions = [];
+    this.drawn = false;
+  }
+  dropBorder(remainder) {
+    if (!this.drawn || this.borderCleared || remainder === "")
+      return;
+    this.stream.write("\r\x1B[2K");
+    this.stream.write(remainder);
+    this.borderCleared = true;
+  }
+}
 function wrapPlain(text, width) {
   const lines = [];
   let current = "";
@@ -843,4 +1166,4 @@ function wrapPlain(text, width) {
   return lines.length === 0 ? [""] : lines;
 }
 
-export { terminalStream, OutputRouter, replayLines, newMarkdownState, renderMarkdownLine, renderMarkdown, archymedesSpinnerFrame, SpringAnimator, sparkline, progressBar, table, scrollPercent, scrollIndicator, paginator, stepProgress, formatStatusLine, StatusBar, rowsOccupied, ReplaceableBlock, MarkdownStream, box, sliceToWidth, padToWidth, joinHorizontal, renderPromptBox, wrapPlain };
+export { terminalStream, TabSink, OutputRouter, replayLines, renderMarkdown, archymedesSpinnerFrame, Spinner, formatCountdown, CountdownTimer, SpringAnimator, formatHeaderSegments, sparkline, progressBar, table, scrollPercent, scrollIndicator, paginator, stepProgress, formatStatusLine, StatusBar, rowsOccupied, ReplaceableBlock, MarkdownStream, box, sliceToWidth, padToWidth, joinHorizontal, PROMPT_PREFIX_COLUMNS, promptStatusRoom, renderPromptBox, PromptBox, wrapPlain };

package/dist/{archymedes-4kx65anz.mjs → archymedes-a3ms7jvr.mjs}

@@ -1,14 +1,14 @@
 import {
   SpringAnimator,
   paginator
-} from "./archymedes-g8y3rt6t.mjs";
+} from "./archymedes-5vhvv8kr.mjs";
 import {
   UNICODE_GLYPHS,
   clipTo,
   visibleWidth
-} from "./archymedes-a10k8yrk.mjs";
+} from "./archymedes-130jt0wr.mjs";
 
-// src/ui/chooser.ts
+// packages/archymedes-cli/src/ui/chooser.ts
 var ALL_CHROME = { title: true, status: true, pagination: true, help: true };
 function chromeOf(chrome) {
   return { ...ALL_CHROME, ...chrome };
@@ -50,6 +50,7 @@ function advanceChooser(state, items, input, options = {}) {
   const last = Math.max(0, visible.length - 1);
   const page = options.page ?? 8;
   const clamp = (index) => Math.max(0, Math.min(last, index));
+  state = { ...state, selected: clamp(state.selected) };
   const keep = state.chrome === undefined ? {} : { chrome: state.chrome };
   if (name === "escape" && options.filter && state.query !== "")
     return { state: { selected: 0, query: "", ...keep } };
@@ -122,7 +123,7 @@ function renderChooser(state, items, options) {
     const fadingOut = !active && index === options.transitionFrom;
     const number = offset < 9 ? `${offset + 1}.` : "  ";
     const furniture = visibleWidth(`  ${active ? ">" : " "} ${number} `) + 2;
-    if (width < furniture) {
+    if (width < furniture + 1) {
       lines.push(active ? paint.green(clip(`${glyphs.prompt}${item.label}`, width)) : clip(item.label, width));
       continue;
     }
@@ -142,7 +143,8 @@ function renderChooser(state, items, options) {
   }
   const position = visible.length > height && chrome.pagination ? `  ${paginator(state.selected, visible.length)}` : "";
   if (chrome.help) {
-    lines.push(paint.dim(clip(`  ${options.legend ?? `${glyphs.arrowUp}${glyphs.arrowDown} move ${glyphs.middot} Enter choose ${glyphs.middot} ${options.filter ? `type to filter ${glyphs.middot} ` : ""}${options.filter ? "Esc clear/cancel" : "Esc cancel"}`}${position}`, width)));
+    const legend = options.legend !== undefined && options.filter && state.query !== "" ? options.legend.replace(/Esc\b[^·]*$/, "Esc clear filter") : options.legend;
+    lines.push(paint.dim(clip(`  ${legend ?? `${glyphs.arrowUp}${glyphs.arrowDown} move ${glyphs.middot} Enter choose ${glyphs.middot} ${options.filter ? `type to filter ${glyphs.middot} ` : ""}${options.filter ? "Esc clear/back" : "Esc back"}`}${position}`, width)));
   } else if (position) {
     lines.push(paint.dim(clip(position, width)));
   }
@@ -158,7 +160,9 @@ async function runChooser(keys, items, paint, options) {
     const height = Math.max(1, Math.min(options.height ?? 10, size?.height ?? Number.POSITIVE_INFINITY));
     return { ...options, width: size?.width ?? options.width, height };
   };
-  paint(renderChooser(state, items, liveOptions()));
+  let list = items;
+  let pendingDelete;
+  paint(renderChooser(state, list, liveOptions()));
   let glide;
   const settleGlide = () => {
     glide?.stop();
@@ -166,9 +170,36 @@ async function runChooser(keys, items, paint, options) {
   };
   try {
     for await (const input of keys) {
+      if (pendingDelete && options.onDelete) {
+        const target = pendingDelete;
+        pendingDelete = undefined;
+        if (input.str === "y" || input.str === "Y") {
+          const outcome = await options.onDelete(target);
+          if (outcome.deleted) {
+            list = list.filter((item) => item !== target);
+            const remaining = filterItems(list, state.query).length;
+            state = { ...state, selected: Math.max(0, Math.min(state.selected, remaining - 1)), status: `deleted "${target.label}"` };
+          } else {
+            state = { ...state, status: outcome.reason };
+          }
+        } else {
+          state = { ...state, status: "kept" };
+        }
+        paint(renderChooser(state, list, liveOptions()));
+        continue;
+      }
+      if (options.onDelete && (input.key.name === "delete" || input.key.ctrl && input.key.name === "d")) {
+        const target = filterItems(list, state.query)[state.selected];
+        if (target && !target.pinned) {
+          pendingDelete = target;
+          state = { ...state, status: `Delete "${target.label}"? y/n` };
+          paint(renderChooser(state, list, liveOptions()));
+        }
+        continue;
+      }
       const current = liveOptions();
       const previousSelected = state.selected;
-      const step = advanceChooser(state, items, input, {
+      const step = advanceChooser(state, list, input, {
         filter: options.filter ?? false,
         page: options.page ?? current.height ?? 8,
         ...current.height === undefined ? {} : { height: current.height }
@@ -178,24 +209,24 @@ async function runChooser(keys, items, paint, options) {
         settleGlide();
         if (step.done.index === undefined)
           return;
-        return filterItems(items, state.query)[step.done.index]?.value;
+        return filterItems(list, state.query)[step.done.index]?.value;
       }
       settleGlide();
       const isSingleStep = (input.key.name === "up" || input.key.name === "down") && Math.abs(state.selected - previousSelected) === 1;
       const motion = options.motion ?? (process.env.ARCHYMEDES_NO_MOTION !== "1" && process.env.NO_COLOR === undefined && process.env.TERM !== "dumb");
       if (!motion || !isSingleStep || previousSelected === state.selected) {
-        paint(renderChooser(state, items, liveOptions()));
+        paint(renderChooser(state, list, liveOptions()));
         continue;
       }
-      paint(renderChooser(state, items, { ...liveOptions(), transitionFrom: previousSelected, focusProgress: 0 }));
+      paint(renderChooser(state, list, { ...liveOptions(), transitionFrom: previousSelected, focusProgress: 0 }));
       const animator = new SpringAnimator(0, (value) => {
         if (value < 0.95) {
-          paint(renderChooser(state, items, { ...liveOptions(), transitionFrom: value < 0.5 ? previousSelected : undefined, focusProgress: value }));
+          paint(renderChooser(state, list, { ...liveOptions(), transitionFrom: value < 0.5 ? previousSelected : undefined, focusProgress: value }));
           return;
         }
         animator.stop();
         glide = undefined;
-        paint(renderChooser(state, items, liveOptions()));
+        paint(renderChooser(state, list, liveOptions()));
       }, { intervalMs: 30 });
       glide = animator;
       animator.retarget(1);

package/dist/{archymedes-tsne2m7p.mjs → archymedes-bmtdqqwt.mjs}

@@ -7,9 +7,9 @@ import {
   paintAll,
   roleCode,
   visibleWidth
-} from "./archymedes-a10k8yrk.mjs";
+} from "./archymedes-130jt0wr.mjs";
 
-// src/render/sections.ts
+// packages/archymedes-cli/src/render/sections.ts
 var TONE_ROLE = {
   good: "success",
   bad: "error",