jsmdcui 0.7.0 → 0.8.0

package/CHANGELOG.md

@@ -2,6 +2,67 @@
 
 All notable user-visible changes to jsmdcui are documented here.
 
+## [0.8.0] - 2026-07-20
+
+This update adds portable inline keydown handling to Markdown text controls,
+including mobile software-keyboard fallback behavior, and makes interactive
+prompts safe across every TUI frontend action path.
+
+### Added
+
+- Add quoted `@keydown="..."` attributes to named `text` and `textarea`
+  fences. The TUI preserves source event metadata and evaluates it before key
+  handling; the WUI emits a native inline event attribute. Add `.prevent` to
+  apply `event.preventDefault()` before the handler runs. Keyup is intentionally
+  not exposed because traditional terminals do not report key releases
+  reliably.
+- In the WUI, automatically map `beforeinput.data` back through `onkeydown`
+  when a mobile software keyboard reports `event.key` as `Unidentified`.
+  Unidentified events are hidden from application handlers, while identified
+  desktop keydowns are marked briefly to prevent duplicate calls.
+- Add native multiline editing to TUI `textarea` controls. Enter splits a body
+  row and expands the frame; Backspace at the start of a later row and Delete
+  at the end of a row join adjacent body rows without exposing frame borders.
+- Add the `bun ./edit` launcher as a short equivalent of
+  `bun src/index.js --edit`, opening Markdown as ordinary editable UTF-8 source.
+- Add the automatically discovered `--demo-maze` example, demonstrating
+  portable `@keydown.prevent` controls with keyboard and arrow-key navigation;
+  add `Ctrl-R` as a keyboard shortcut for resetting the maze.
+
+### Changed
+
+- Install protected `alert`, `confirm`, and `prompt` globals once for the TUI
+  lifetime and share them across OSC 8 actions, fenced keyboard handlers, and
+  JS plugins. Restore Bun's original globals when the TUI stops.
+- Make `micro.alert()`, `micro.confirm()`, and `micro.prompt()` synchronous like
+  their native counterparts, and update the bundled JS plugin examples so they
+  do not `await` these calls.
+- Add TUI `.val(value)` replacements to Undo/Redo history, including multiline
+  layout, ANSI rendering metadata, image positions, and task-list anchors.
+
+### Fixed
+
+- Prevent `alert()` called from a keydown handler from competing with the TUI
+  for stdin by suspending raw mode and screen rendering around native prompts.
+- Restore the terminal's previous raw-mode and input-listener state after a
+  protected prompt, including setup, prompt, and cleanup error paths.
+- Index fenced keyboard-event regions once and use binary lookup for each key,
+  instead of rescanning the rendered Markdown document on every keypress.
+- Open Windows controlling-terminal input through read-only `CONIN$` when stdin
+  is redirected, so piped Markdown retains keyboard and protected-prompt input.
+- Preserve `ctrlKey`, `shiftKey`, `altKey`, and `metaKey` when the WUI maps an
+  unidentified mobile keydown through its `beforeinput` fallback.
+- Recover modified A-Z keys in the WUI from key codes 65-90 or physical
+  `KeyA`-`KeyZ` codes, including Android browsers that transform Alt-S into
+  `ß`; exclude AltGraph so international text composition remains intact.
+- Add matching non-enumerable `event.toJSON()` methods to TUI and WUI keydown
+  events, allowing `JSON.stringify(event)` to produce portable event details.
+- Keep fenced-block IDs visible to collision checking when the info string also
+  contains inline event attributes such as `@keydown="..."`.
+- When the WUI's default port 3000 is already in use, retry with port 0 so the
+  operating system selects an available port, and print that actual port in the
+  generated URL. Other server startup errors continue to fail normally.
+
 ## [0.7.0] - 2026-07-20
 
 This update adds native Kitty image rendering, turns heading task lists into

package/README.md

@@ -89,6 +89,11 @@ npx jsmdcui --demo-imgtool
 npx jsmdcui --demo-imgtool-zh
 ```
 
+```sh
+# Maze game demo
+npx jsmdcui --demo-maze
+```
+
 ```sh
 # WUI(Web User Interface) Demo
 npx jsmdcui --wui
@@ -134,7 +139,7 @@ bun src/index.js --wui testapp.md
 | --- | --- |
 | `bun src/index.js app.md` | Render `app.md` as a read-only terminal UI and write five generated files beside it. |
 | `bun src/index.js --kitty app.md` | Display Markdown images with Kitty graphics and the jsgotty MIME extension. |
-| `bun src/index.js --kitty-compat app.md` | Display Markdown images with Kitty graphics without the non-standard MIME `U` field. |
+| `bun src/index.js --kitty-compat app.md` | Convert Markdown images to PNG with `Bun.Image` and display them using the standard Kitty graphics protocol without the non-standard MIME `U` field. |
 | `bun src/index.js --kitty --allow-url URL.md` | Download trusted HTTP(S) Markdown and its HTTP(S) images, then display supported images with Kitty graphics. |
 | `JSMDCUI_KITTY_DEBUG=1 bun src/index.js --kitty app.md` | Enable Kitty image placement logging to `kitty-placement.log`. |
 | `bun src/index.js --check app.md` | Check heading and fenced-block IDs for collisions, print line-by-line details, and exit. |
@@ -239,12 +244,81 @@ native `<textarea>` with the declared ID and classes. Long text wraps
 automatically, and the field height is recalculated when the user types, the
 window is resized, or frontend code calls `.val(value)`.
 
+In the TUI, `text` remains a single-line control while `textarea` supports
+native multiline editing. Enter splits the current body row and grows the
+frame, Backspace at the start of a later row joins it to the previous row, and
+Delete at the end of a row joins the following row. When the expanded control
+does not fit on screen, the document viewport scrolls to keep the cursor
+visible. The closing border and following Markdown content move with the
+resized control.
+
+A named `text` or `textarea` block can run inline front-end code before it
+handles a key by placing a quoted HTML-style `@keydown` attribute after its
+identity:
+
+````md
+```text#command.field @keydown="handleCommand(event)"
+Initial value
+```
+
+```js front
+export function handleCommand(event) {
+  if (event.key !== 'Enter') return;
+  event.preventDefault();
+  alert(`Command: ${$('#command').val()}`);
+}
+```
+````
+
+The block must have a unique ID. In the WUI, jsmdcui writes the code directly
+to the generated textarea's native `onkeydown` attribute. Mobile browsers may
+report ordinary software-keyboard letters as `Unidentified`, so the WUI also
+generates an `onbeforeinput` fallback. The unidentified event is hidden from
+the handler; `beforeinput.data` becomes `event.key`, then the same keydown code
+runs once. The fallback also preserves `ctrlKey`, `shiftKey`, `altKey`, and
+`metaKey` from the unidentified keydown. A short zero-delay timer distinguishes
+it from the `beforeinput` that normally follows an already identified keydown,
+preventing duplicate calls.
+
+On Android browsers, `Alt-E`, `Alt-N`, `Alt-U`, and `Alt-I` may be consumed or
+transformed by the software keyboard and therefore cannot always be observed
+reliably by a keydown handler. Avoid relying on these combinations for portable
+WUI controls.
+
+In the TUI, the full source info string is kept in an event table before Bun
+renders it. The keydown statements run with a synthetic `event` before the
+text control handles the key. Both interfaces expose `event.key`, modifier
+flags, `event.target.id`, and `event.target.value`. Use `event`, the native
+inline-handler variable, rather than Vue's `$event` alias. Double quotes
+delimit the handler; use single-quoted JavaScript strings inside it or escape
+an embedded double quote as `\"`.
+
+Both interfaces add a non-enumerable `event.toJSON()` method with matching
+keyboard, modifier, prevention, and target fields. `JSON.stringify(event)`
+calls it automatically, so the resulting JSON is portable between the TUI and
+WUI.
+
+A keydown handler can call `event.preventDefault()` to stop text insertion or
+cursor movement. The `.prevent` modifier applies this automatically:
+
+````md
+```text#command @keydown.prevent="handleCommand(event)"
+```
+````
+
+`@keydown` is the only keyboard event exposed by jsmdcui. Traditional terminal
+input does not report physical key releases reliably, so jsmdcui does not
+provide or emulate `@keyup` in either interface.
+
 In the terminal TUI, only content after the protected `│ ` or `| ` prefix can
-be edited. The frame prefix cannot be deleted, Enter cannot insert a newline,
-Delete at the end of a row cannot join the next row, and multiline paste is
-blocked. Activate the lower-left frame corner to add a row. Activate the
-upper-left frame corner to remove the trailing row only when it is empty;
-non-empty content is never removed.
+be edited, and the frame prefix cannot be deleted. Multiline paste remains
+blocked. For single-line `text` controls, activate the lower-left frame corner
+to add a row. Activate the upper-left frame corner to remove the trailing row
+only when it is empty; non-empty content is never removed.
+
+TUI text-control changes made through `.val(value)` participate in the same
+history as direct editing. `Ctrl-Z` undoes the replacement and `Ctrl-Y` redoes
+it, including multiline frame resizing and its associated rendered metadata.
 
 ### Heading task lists and selector API
 
@@ -384,7 +458,7 @@ The available selector methods are:
 | Method | TUI | WUI |
 | --- | --- | --- |
 | `.val()` | Read text blocks or heading task-list values. | Read textareas/controls or heading task-list values. |
-| `.val(value)` | Replace text-block contents and resize multiline values. | Set textarea/control values and resize textareas. |
+| `.val(value)` | Replace text-block contents, resize multiline values, and record Undo/Redo history. | Set textarea/control values and resize textareas. |
 | `.html()` | Return a selected heading's inner HTML. | Return any successfully selected DOM element's `innerHTML`. |
 | `.line()` | Return a heading's current 1-based TUI row, or `0` if missing. | Not available. |
 | `.push(...items)` | Append unchecked strings or `{ value, checked }` task items; return the new direct-item count. | Same. |
@@ -397,16 +471,16 @@ The available selector methods are:
 TUI heading rows are recalculated after text-block rows are added, removed, or
 replaced with multiline `.val(value)` content.
 
-The three UI building blocks are:
+The 3 UI building blocks are:
 
-- Regular Markdown provides headings, text, lists, task checkboxes, code, and
+- 1. `Regular Markdown` provides headings, text, lists, task checkboxes, code, and
   links.
-- A `js front` block contains UI code. Exported functions can use
+- 2. `js front` block contains UI code. Exported functions can use
   `alert`, `confirm`, `prompt`, and the generated `rpc` client.
-- A front module may export `async function onMdcuiExit({ reason, path, $ })`.
-  The terminal UI awaits it before closing an `mdcui` buffer. Modified
-  `mdcui` buffers close without a save prompt.
-- A `js back` block exports trusted backend functions. In the browser WUI,
+  * A front module may export `async function onMdcuiExit({ reason, path, $ })`.
+  * The terminal UI awaits it before closing an `mdcui` buffer. 
+  * Modified `mdcui` buffers close without a save prompt.
+- 3. `js back` block exports trusted backend functions. In the browser WUI,
   `rpc` publishes only exported functions whose exported names do not start
   with `_`. Call a published function from the front end with
   `await rpc.functionName(arg1, arg2)`.
@@ -489,15 +563,35 @@ its associated text. `alert`, `confirm`, and `prompt` use the browser's built-in
 dialogs. Checkbox changes exist only in the current page: refreshing does not
 preserve them and does not update the Markdown file.
 
-The WUI uses port `3000` by default and accepts connections through the
-machine's available network interfaces. The printed `localhost` URL is for the
-same machine. From another device on the same network, replace `localhost` with
-the server machine's IP address and keep the same port and full path.
+The WUI first tries port `3000` and accepts connections through the machine's
+available network interfaces. If port `3000` is already in use, the operating
+system selects an available port instead; the printed URL always contains the
+actual port. Set `PORT` to request another fixed port. The printed `localhost`
+URL is for the same machine. From another device on the same network, replace
+`localhost` with the server machine's IP address and keep the printed port and
+full path.
 
 Each server start prints a new random path. The old URL stops working after the
 server is stopped or restarted. Keep the process running while using the page,
 and press `Ctrl-C` in its terminal to stop it.
 
+## Editing Markdown source
+
+From a cloned repository, use the `edit` launcher to open a Markdown file as
+ordinary editable UTF-8 source instead of rendering it as a Markdown UI:
+
+```sh
+bun ./edit app.md
+```
+
+This is equivalent to:
+
+```sh
+bun src/index.js --edit app.md
+```
+
+Additional file and cursor arguments are forwarded unchanged.
+
 ## Generated files
 
 Opening a local Markdown UI generates these files beside the source file:

package/demos/maze.md

@@ -0,0 +1,144 @@
+```text#character
+🧱😀🧱🧱🧱🧱🧱🧱🧱🧱🧱🧱
+🧱  🧱                🧱
+🧱  🧱🧱🧱  🧱  🧱🧱🧱🧱
+🧱      🧱  🧱        🧱
+🧱🧱🧱  🧱🧱🧱🧱🧱  🧱🧱
+🧱  🧱      🧱        🧱
+🧱  🧱🧱🧱  🧱  🧱  🧱🧱
+🧱      🧱      🧱    🧱
+🧱  🧱🧱🧱🧱🧱🧱🧱  🧱🧱
+🧱          🧱        🧱
+🧱  🧱  🧱🧱🧱  🧱🧱🧱🧱
+🧱  🧱                🧱
+🧱🧱🧱🧱🧱🧱🧱🧱🧱  🧱🧱
+```
+
+```text#controls @keydown.prevent="handle(event)"
+Put the cursor here, then press:
+將遊標放在這裡，然後按：
+
+L't half of QWERTY  ← move left
+R't half of QWERTY  → move right
+T / Y               ↑ move up
+Space               ↓ move down
+
+鍵盤左半邊 ← 向左移動
+鍵盤右半邊 → 向右移動
+T / Y 向上移動
+空白鍵向下移動
+
+Arrow keys   ←↑→↓ / 正常方向移動
+Ctrl-R       Reset maze / 重新開始
+
+Do not hit 🧱 / 不能撞牆
+```
+
+```text#last-key
+Waiting for input / 等待輸入
+```
+
+[🔄 Reset maze / 重新開始](javascript:reset())
+
+```js front
+const LEFT_KEYS = new Set([
+  ...'`12345qwerasdfgzxcvb',
+  'escape', 'tab',
+]);
+const RIGHT_KEYS = new Set([
+  ...'67890-=uiop[]\\hjkl;\'nm,./',
+  'backspace', 'enter', 'delete',
+  'home', 'end', 'pageup', 'pagedown',
+]);
+const MAZE = [
+  '# ##########',
+  '# #        #',
+  '# ### # ####',
+  '#   # #    #',
+  '### ##### ##',
+  '# #   #    #',
+  '# ### # # ##',
+  '#   #   #  #',
+  '# ####### ##',
+  '#     #    #',
+  '# # ### ####',
+  '# #        #',
+  '######### ##',
+];
+const GOAL = { row: MAZE.length - 1, col: 9 };
+const player = { row: 0, col: 1 };
+let completed = false;
+
+function drawMaze() {
+  const screen = MAZE.map((line, row) => [...line].map((cell, col) => {
+    if (row === player.row && col === player.col) return '😀';
+    return cell === '#' ? '🧱' : '  ';
+  }).join('')).join('\n');
+  $('#character').val(screen);
+}
+
+export function reset() {
+  player.row = 0;
+  player.col = 1;
+  completed = false;
+  drawMaze();
+  $('#last-key').val('Waiting for input / 等待輸入');
+}
+
+export function handle(event) {
+  const key = String(event.key ?? '').toLowerCase();
+  if (event.ctrlKey && key === 'r') {
+    reset();
+    return;
+  }
+  if (completed) return;
+
+  let row = player.row;
+  let col = player.col;
+  let direction;
+
+  if (key === 't' || key === 'y' || key === 'arrowup') {
+    row--;
+    direction = 'up / 上';
+  } else if (key === ' ' || key === 'arrowdown') {
+    row++;
+    direction = 'down / 下';
+  } else if (key === 'arrowleft' || LEFT_KEYS.has(key)) {
+    col--;
+    direction = 'left / 左';
+  } else if (key === 'arrowright' || RIGHT_KEYS.has(key)) {
+    col++;
+    direction = 'right / 右';
+  } else {
+    $('#last-key').val(`Ignored / 忽略：${event.key}`);
+    return;
+  }
+
+  if (MAZE[row]?.[col] !== ' ') {
+    $('#last-key').val(`${event.key === ' ' ? 'Space' : event.key} → 🧱 Wall / 撞牆`);
+    return;
+  }
+
+  player.row = row;
+  player.col = col;
+  drawMaze();
+
+  if (row === GOAL.row && col === GOAL.col) {
+    completed = true;
+    $('#last-key').val('🎉🏆🌟 Escaped the maze! / 成功走出迷宮！🌟🏆🎉');
+    alert([
+      '🎆🎇🎉 恭 喜 過 關 ！ 🎉🎇🎆',
+      '',
+      '🥳 你成功逃出迷宮了！ 🥳',
+      '👑 🏆 ⭐ 🌟 💫 🌈 🦄',
+      '👏👏👏  AMAZING!  👏👏👏',
+      '🎈 🎊 🎁 🪩 🎁 🎊 🎈',
+      '',
+      '🚀 ESCAPED THE MAZE! 🚀',
+    ].join('\n'));
+  } else {
+    const label = event.key === ' ' ? 'Space' : event.key;
+    $('#last-key').val(`${label} → ${direction} (${row}, ${col})`);
+  }
+}
+```

package/demos/todo-zh.md

@@ -18,10 +18,25 @@ Fly to the moon
 在上方輸入 Todo 文字，再選擇新增或移除。移除會刪除第一個文字完全相同的項目。
 
 - [新增 Todo](javascript:addTodo())
+- .
 - [移除 Todo](javascript:removeTodo())
+- .
 - [顯示已完成](javascript:showCompleted())
+- .
 - [顯示未完成](javascript:showPending())
 
+## 存檔／讀檔
+
+```text#todo-file
+todo_list.json
+```
+
+在上方輸入 JSON 檔案路徑。存檔會寫入人類可讀的 JSON；讀檔會在確認後取代目前的 Todo 清單。
+
+- [儲存 Todos](javascript:saveTodos())
+- .
+- [讀取 Todos](javascript:loadTodos())
+
 ## 操作結果：
 
 ```text#todo-status
@@ -51,6 +66,14 @@ function showItems(title, checked) {
   $('#todo-status').val(`找到 ${items.length} 個${title}項目`);
 }
 
+function todoFile() {
+  return $('#todo-file').val().trim();
+}
+
+function describeError(error) {
+  return error?.message || String(error);
+}
+
 export function addTodo() {
   const value = todoText();
   if (!value) {
@@ -89,4 +112,79 @@ export function showCompleted() {
 export function showPending() {
   showItems('未完成', false);
 }
+
+export async function saveTodos() {
+  const file = todoFile();
+  if (!file) {
+    $('#todo-status').val('存檔失敗：請先輸入 JSON 檔案路徑');
+    return;
+  }
+
+  try {
+    const obj = { todos: $('#todos').slice() };
+    const result = await rpc.saveTodoList(file, obj);
+    $('#todo-status').val(`已將 ${obj.todos.length} 個 Todo 儲存至 ${result.path}`);
+  } catch (error) {
+    $('#todo-status').val(`存檔失敗：${describeError(error)}`);
+  }
+}
+
+export async function loadTodos() {
+  const file = todoFile();
+  if (!file) {
+    $('#todo-status').val('讀檔失敗：請先輸入 JSON 檔案路徑');
+    return;
+  }
+  try {
+    const result = await rpc.loadTodoList(file);
+    const json = JSON.stringify(result.obj, null, 1);
+    if (!confirm(`要用「${file}」中的以下 JSON 取代目前的 Todo 清單嗎？\n\n${json}`)) {
+      $('#todo-status').val('已取消讀檔，目前的 Todos 未變更');
+      return;
+    }
+    const current = $('#todos').slice();
+    $('#todos').splice(0, current.length, ...result.obj.todos);
+    $('#todo-status').val(`已從 ${result.path} 讀取 ${result.obj.todos.length} 個 Todo`);
+  } catch (error) {
+    $('#todo-status').val(`讀檔失敗：${describeError(error)}`);
+  }
+}
+```
+
+```js back
+import { resolve } from 'node:path';
+
+function todoPath(input) {
+  const value = String(input ?? '').trim();
+  if (!value) throw new Error('請先輸入 JSON 檔案路徑');
+  return resolve(value);
+}
+
+function validateTodoObject(obj) {
+  if (!obj || typeof obj !== 'object' || !Array.isArray(obj.todos))
+    throw new Error('Todo JSON 必須是包含 todos 陣列的物件');
+
+  return {
+    todos: obj.todos.map((item, index) => {
+      if (!item || typeof item !== 'object' || typeof item.value !== 'string')
+        throw new Error(`第 ${index + 1} 個 Todo 項目必須包含字串 value`);
+      return { value: item.value, checked: Boolean(item.checked) };
+    }),
+  };
+}
+
+export async function saveTodoList(input, obj) {
+  const path = todoPath(input);
+  const validated = validateTodoObject(obj);
+  await Bun.write(path, JSON.stringify(validated, null, 1) + '\n');
+  return { path };
+}
+
+export async function loadTodoList(input) {
+  const path = todoPath(input);
+  const file = Bun.file(path);
+  if (!await file.exists()) throw new Error(`找不到 Todo 檔案：${path}`);
+  const obj = validateTodoObject(JSON.parse(await file.text()));
+  return { path, obj };
+}
 ```

package/demos/todo.md

@@ -18,10 +18,25 @@ Fly to the moon
 Enter Todo text above, then choose Add or Remove. Remove deletes the first item whose text matches exactly.
 
 - [Add Todo](javascript:addTodo())
+- .
 - [Remove Todo](javascript:removeTodo())
+- .
 - [Show Completed](javascript:showCompleted())
+- .
 - [Show Pending](javascript:showPending())
 
+## Save / Load
+
+```text#todo-file
+todo_list.json
+```
+
+Enter a JSON file path above. Saving writes human-readable JSON; loading replaces the current Todo list after confirmation.
+
+- [Save Todos](javascript:saveTodos())
+- .
+- [Load Todos](javascript:loadTodos())
+
 ## Operation Result
 
 ```text#todo-status
@@ -52,6 +67,14 @@ function showItems(title, checked) {
   $('#todo-status').val(`Found ${items.length} ${title.toLowerCase()} ${noun}`);
 }
 
+function todoFile() {
+  return $('#todo-file').val().trim();
+}
+
+function describeError(error) {
+  return error?.message || String(error);
+}
+
 export function addTodo() {
   const value = todoText();
   if (!value) {
@@ -90,4 +113,79 @@ export function showCompleted() {
 export function showPending() {
   showItems('Pending', false);
 }
+
+export async function saveTodos() {
+  const file = todoFile();
+  if (!file) {
+    $('#todo-status').val('Save failed: enter a JSON file path first');
+    return;
+  }
+
+  try {
+    const obj = { todos: $('#todos').slice() };
+    const result = await rpc.saveTodoList(file, obj);
+    $('#todo-status').val(`Saved ${obj.todos.length} Todos to ${result.path}`);
+  } catch (error) {
+    $('#todo-status').val(`Save failed: ${describeError(error)}`);
+  }
+}
+
+export async function loadTodos() {
+  const file = todoFile();
+  if (!file) {
+    $('#todo-status').val('Load failed: enter a JSON file path first');
+    return;
+  }
+  try {
+    const result = await rpc.loadTodoList(file);
+    const json = JSON.stringify(result.obj, null, 1);
+    if (!confirm(`Replace the current Todo list with this JSON from “${file}”?\n\n${json}`)) {
+      $('#todo-status').val('Load cancelled; current Todos were not changed');
+      return;
+    }
+    const current = $('#todos').slice();
+    $('#todos').splice(0, current.length, ...result.obj.todos);
+    $('#todo-status').val(`Loaded ${result.obj.todos.length} Todos from ${result.path}`);
+  } catch (error) {
+    $('#todo-status').val(`Load failed: ${describeError(error)}`);
+  }
+}
+```
+
+```js back
+import { resolve } from 'node:path';
+
+function todoPath(input) {
+  const value = String(input ?? '').trim();
+  if (!value) throw new Error('Enter a JSON file path first');
+  return resolve(value);
+}
+
+function validateTodoObject(obj) {
+  if (!obj || typeof obj !== 'object' || !Array.isArray(obj.todos))
+    throw new Error('Todo JSON must be an object containing a todos array');
+
+  return {
+    todos: obj.todos.map((item, index) => {
+      if (!item || typeof item !== 'object' || typeof item.value !== 'string')
+        throw new Error(`Todo item ${index + 1} must contain a string value`);
+      return { value: item.value, checked: Boolean(item.checked) };
+    }),
+  };
+}
+
+export async function saveTodoList(input, obj) {
+  const path = todoPath(input);
+  const validated = validateTodoObject(obj);
+  await Bun.write(path, JSON.stringify(validated, null, 1) + '\n');
+  return { path };
+}
+
+export async function loadTodoList(input) {
+  const path = todoPath(input);
+  const file = Bun.file(path);
+  if (!await file.exists()) throw new Error(`Todo file not found: ${path}`);
+  const obj = validateTodoObject(JSON.parse(await file.text()));
+  return { path, obj };
+}
 ```

package/edit

@@ -0,0 +1,9 @@
+#!/bin/sh
+
+':' //; sd=$(dirname "$(realpath "$0")")
+
+':' //; exec bun "$sd"/src/index.js --edit "$@"
+
+process.argv.splice(2,0,'--edit')
+
+await import('./src/index.js')

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jsmdcui",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "description": "Markdown as a Common UI for Terminals and Web Browsers",
   "type": "module",
   "main": "./src/index.js",