@ucsandman/legcli 0.11.0 → 0.12.0

package/src/board/index.html

@@ -39,8 +39,20 @@
     <p id="verdict-sub"></p>
   </section>
 
-  <section class="logins" id="accounts" aria-label="Logins"></section>
-  <p class="head-caption" id="head-caption">Times are local.</p>
+  <!-- Usage is a property of the work, not a region of its own. The strip is
+       one band: a token per login carrying the bucket that will actually stop
+       it. The panels are not rewritten, they move intact behind the disclosure
+       at the end of the strip, with every gauge, notch and spoken sentence. -->
+  <section class="capacity" aria-label="Capacity by login">
+    <div class="capacity-strip">
+      <div class="cap-tokens" id="capacity-tokens"></div>
+      <button type="button" class="btn btn-secondary disclosure cap-open" id="capacity-toggle" aria-expanded="false" aria-controls="capacity-drawer">Capacity and models &gt;</button>
+    </div>
+    <div class="drawer capacity-drawer" id="capacity-drawer" hidden>
+      <section class="logins" id="accounts" aria-label="Logins"></section>
+      <p class="head-caption" id="head-caption">Times are local.</p>
+    </div>
+  </section>
 
   <section class="region-terminals" aria-labelledby="terminals-head">
     <div class="section-head">
@@ -58,6 +70,22 @@
     <p class="empty-line" hidden>No terminal is running. Start one in any repo: <code>leg claude</code>, <code>leg codex</code> or <code>leg agy</code>. It appears here within a second of the agent's first turn.</p>
   </section>
 
+  <!-- C.1: a card is a terminal you are not sitting at. Live cards are rows
+       here, directly under Terminals; finished ones fall into the ledger
+       cell below instead of piling up as rows. -->
+  <section class="region-background" id="background" aria-labelledby="background-head" hidden>
+    <div class="section-head">
+      <h2 id="background-head">Background</h2>
+      <p class="region-meta" role="status" aria-atomic="true"></p>
+    </div>
+    <!-- the live card rows are `.row`: the four-cell grid whose `.r4
+         .row-actions` block is written against the terminal rows, so the two
+         row kinds line up. `.card-list` is the gap between them, the same
+         container the cards drawer uses. -->
+    <div class="card-list" id="background-grid"></div>
+    <div id="card-entry" hidden></div>
+  </section>
+
   <!-- Finished terminals, what landed, and what is queued are all history or
        background. They sit on the ground rather than on a panel, because a
        raised surface here would compete with the terminals that are live. -->
@@ -151,13 +179,33 @@
              first request there is no address above to point at. -->
         <p class="field-help">Stored in this browser's localStorage and sent as a bearer token with every request. Clear the field to sign out.</p>
       </div>
+      <!-- The fallback ladder (docs/redesign-2026-09-17.md B.3). A rung is a
+           destination, not an agent: claude/opus and claude/sonnet are two
+           separate steps down before Leg leaves the login at all. The ids are
+           the ones the order editor used, because the same save button, status
+           span and list container do the same job for the longer shape. -->
       <fieldset class="default-order" id="default-order" hidden>
-        <legend>New terminal handoff order</legend>
-        <p class="field-help">Used by terminals started after you save.</p>
+        <legend>New terminal handoff ladder</legend>
+        <p class="field-help">Each rung is an agent, a login and a model. Leg walks down from the top and takes the first rung that is open. Used by terminals started after you save; a running terminal keeps the copy it started with, and Details on its row edits that one.</p>
         <div id="default-order-list"></div>
-        <button type="button" class="btn btn-secondary" id="default-order-save">Save default</button>
+        <div class="ladder-policy" id="ladder-spend"></div>
+        <fieldset class="ladder-policy" id="ladder-climb"></fieldset>
+        <div class="ladder-policy" id="ladder-reserve"></div>
+        <button type="button" class="btn btn-secondary" id="default-order-save">Save ladder</button>
         <span class="field-status" id="default-order-status" aria-live="polite"></span>
       </fieldset>
+      <!-- Where a terminal that is waiting on a human says so when the board is
+           not the window you are looking at. The tab badge needs no toggle: it
+           needs no permission and costs nothing, so it is always on. -->
+      <fieldset class="notify" id="notify-settings" hidden>
+        <legend>Notifications</legend>
+        <p class="field-help">The tab title says <code>(1) Leg</code> and the favicon gains a dot whenever a terminal is waiting on you. That one is always on.</p>
+        <label class="notify-toggle" for="notify-terminal"><input type="checkbox" id="notify-terminal"> Terminal toast when a terminal waits on you</label>
+        <p class="field-help">Claude Code only, through its Notification hook: the toast reaches the window the agent is already running in.</p>
+        <label class="notify-toggle" for="notify-board"><input type="checkbox" id="notify-board"> Browser notification when a terminal waits on you</label>
+        <p class="field-help" id="notify-board-help"></p>
+        <span class="field-status" id="notify-status" aria-live="polite"></span>
+      </fieldset>
       <!-- Who did what, across every terminal and every card. The owner's, like
            the rest of this panel: the trail names repositories and people. It
            loads when asked rather than on every board render. -->
@@ -196,8 +244,11 @@
   <div class="detail-inner" id="session-drawer-content"></div>
 </div>
 
-<dialog id="new-card-dialog" aria-label="New card">
-  <h2 class="dialog-title">New background card</h2>
+<!-- the announced name is the heading on screen: an aria-label here would be a
+     second name for one thing, and the one a voice-control user says out loud
+     is the one they can read -->
+<dialog id="new-card-dialog" aria-labelledby="new-card-dialog-title">
+  <h2 class="dialog-title" id="new-card-dialog-title">More settings</h2>
   <p class="dialog-intro">An agent works without an interactive terminal in a separate git worktree. The default Build workflow stops with changes in that worktree and does not merge them.</p>
   <form id="new-card-form">
     <div class="form-error" id="new-card-error" hidden></div>
@@ -296,6 +347,15 @@
   </form>
 </dialog>
 
+<!-- D14: every binding clicks a button that is already on a row, so this map is
+     the list of those buttons and nothing else can drift from it. sessions.js
+     fills it from the same table the key handler reads. -->
+<div class="keymap" id="keymap" role="dialog" aria-label="Keyboard shortcuts" hidden>
+  <h3 class="drawer-head">Keyboard</h3>
+  <dl class="keymap-list" id="keymap-list"></dl>
+  <button type="button" class="btn btn-secondary" id="keymap-close">Close</button>
+</div>
+
 <div class="sysmsg" id="toast" aria-live="polite"></div>
 
 <script src="board.js" defer></script>