claude-code-kanban 7.18.0 → 7.20.0

package/public/style.css

@@ -4460,6 +4460,181 @@ body.show-resizing iframe {
 
 /* #endregion */
 
+/* #region ASK */
+.ask-modal {
+  position: absolute;
+  inset: 0;
+  z-index: 5;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: color-mix(in srgb, var(--bg-deep) 55%, transparent);
+}
+
+.ask-modal[hidden] {
+  display: none;
+}
+
+.ask-box {
+  display: flex;
+  flex-direction: column;
+  box-sizing: border-box;
+  width: min(560px, calc(100% - 32px));
+  max-height: calc(100% - 32px);
+  background: var(--bg-surface);
+  border: 1px solid var(--border);
+  border-radius: 10px;
+  box-shadow: 0 12px 32px -12px rgba(0, 0, 0, 0.45);
+  overflow: hidden;
+}
+
+.ask-box[data-size='lg'] {
+  width: min(960px, calc(100% - 32px));
+}
+
+.ask-box[data-size='full'] {
+  width: calc(100% - 32px);
+  height: calc(100% - 32px);
+}
+
+.ask-head,
+.ask-foot {
+  display: flex;
+  flex: none;
+  align-items: center;
+  gap: 8px;
+  padding: 6px 8px 6px 12px;
+  color: var(--text-tertiary);
+  font-size: 11px;
+}
+
+.ask-head {
+  border-bottom: 1px solid var(--border);
+}
+
+.ask-foot {
+  justify-content: space-between;
+  border-top: 1px solid var(--border);
+}
+
+.ask-dot {
+  display: inline-grid;
+  place-items: center;
+  flex: none;
+  width: 16px;
+  height: 16px;
+  border-radius: 50%;
+  background: var(--accent);
+  color: #fff;
+  font-size: 10px;
+  font-weight: 700;
+}
+
+.ask-title {
+  flex: 1;
+  min-width: 0;
+  overflow: hidden;
+  color: var(--text-primary);
+  font-size: 12px;
+  font-weight: 600;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ask-x {
+  display: inline-grid;
+  place-items: center;
+  width: 22px;
+  height: 22px;
+  padding: 0;
+  border: 0;
+  border-radius: 4px;
+  background: transparent;
+  color: var(--text-tertiary);
+  cursor: pointer;
+}
+
+.ask-x svg {
+  width: 14px;
+  height: 14px;
+}
+
+.ask-foot button {
+  padding: 3px 12px;
+  border: 1px solid var(--border);
+  border-radius: 5px;
+  background: transparent;
+  color: var(--text-secondary);
+  font: inherit;
+  cursor: pointer;
+}
+
+.ask-x:hover,
+.ask-foot button:hover {
+  background: var(--bg-hover);
+  color: var(--text-primary);
+}
+
+.ask-body {
+  display: flex;
+  flex: 1 1 auto;
+  flex-direction: column;
+  min-height: 0;
+}
+
+.ask-frame {
+  display: block;
+  width: 100%;
+  border: 0;
+  background: var(--bg-surface);
+}
+
+.ask-box[data-size='full'] .ask-frame {
+  flex: 1;
+}
+
+.ask-missing {
+  margin: 0;
+  padding: 16px;
+  color: var(--text-tertiary);
+}
+
+.ask-reopen {
+  max-width: 240px;
+  border-color: color-mix(in srgb, var(--accent) 50%, var(--border));
+  color: var(--text-secondary);
+}
+
+.ask-reopen-n {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ask-reopen .ask-dot {
+  width: 14px;
+  height: 14px;
+  font-size: 9px;
+  animation: ask-pulse 1.6s ease-out infinite;
+}
+
+@keyframes ask-pulse {
+  0% {
+    box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 60%, transparent);
+  }
+  100% {
+    box-shadow: 0 0 0 6px transparent;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .ask-reopen .ask-dot {
+    animation: none;
+  }
+}
+
+/* #endregion */
+
 /* #region PANES */
 .pane-strip {
   display: none;
@@ -5058,7 +5233,7 @@ body.show-resizing iframe {
   color: var(--accent);
 }
 
-.pane-view.frame-focus .pane-keys {
+.pane-view.frame-focus:not(.keys-bridged) .pane-keys {
   display: flex;
 }
 

package/public/vendor/claude-hub-sdk.js

@@ -1,4 +1,4 @@
-// claude-hub-sdk 1.7.0 (sha256 904e53d87ec4). Copied by npm run sdk:sync in claude-code-hub. Do not edit.
+// claude-hub-sdk 1.8.0 (sha256 9a67dd2aa534). Copied by npm run sdk:sync in claude-code-hub. Do not edit.
 // Claude Code Hub SDK: the one rule that names a key press, shared by the hub page, client.js and
 // stub.js. The hub serves it to its page as /sdk/keys.js; mount() and sdk:sync put it in front of
 // client.js and stub.js, so an app still loads one file.
@@ -33,7 +33,21 @@ var ClaudeHubKeys = (() => {
     return combo.split('+').map((k) => mods[k] ?? named[k] ?? (k.length === 1 ? k.toUpperCase() : k));
   }
 
-  return { comboOf, keyParts };
+  // A host claim (protocol §5.2) names a press by its physical code, or by its character when the layout
+  // moves the key: {ctrlKey?, altKey?, shiftKey?, metaKey?, code, key: 'Unidentified'} or {…, key, code: ''}.
+  // A press matches a claim when one of its two signatures is the claim's first. AltGr types a
+  // character, so its press matches by character only. cck's frames use the same format.
+  function keySigs(e) {
+    const mods = [e.ctrlKey && 'ctrl', e.altKey && 'alt', e.shiftKey && 'shift', e.metaKey && 'meta']
+      .filter(Boolean)
+      .join('+');
+    return [
+      e.code && !e.getModifierState?.('AltGraph') && `${mods}|c:${e.code}`,
+      typeof e.key === 'string' && e.key !== 'Unidentified' && `${mods}|k:${e.key.toLowerCase()}`,
+    ].filter(Boolean);
+  }
+
+  return { comboOf, keyParts, keySigs };
 })();
 
 if (typeof module === 'object' && module.exports) module.exports = ClaudeHubKeys;
@@ -69,9 +83,10 @@ if (typeof module === 'object' && module.exports) module.exports = ClaudeHubKeys
         bindTheme: () => off,
         handle() {},
         publish() {},
-        invoke(action, params = {}) {
+        invoke(action, params = {}, opts = {}) {
           const target = standaloneFn(action)?.(params);
           if (!target) return Promise.resolve({ ok: false, reason: 'unhandled' });
+          if (opts.open === 'pane') return Promise.resolve({ ok: true, handledBy: 'standalone', url: target });
           win.open(target, '_blank', 'noopener');
           return Promise.resolve({ ok: true, handledBy: 'standalone' });
         },

package/server.js

@@ -51,6 +51,7 @@ const { createTerminalClient } = require('./lib/terminal-client');
 const { kanbotOn, kanbotModel, createKanbot, findCostCli, readCostServer } = require('./lib/kanbot');
 const { AGENT_ID_RE } = require('./cli');
 const { createShowStore, mountShowRoutes, showBodyParser, SHOW_PATH } = require('./lib/show');
+const { createAskStore, mountAskRoutes, askBodyParser, ASK_PATH } = require('./lib/ask');
 const { readLiveSessions, isPidAlive, noteReplacedSessions } = require('./lib/live-sessions');
 const { createProcStats } = require('./lib/proc-stats');
 const { createUserGroupStore } = require('./lib/user-groups');
@@ -666,6 +667,7 @@ app.param('name', (_req, res, next, val) => {
 });
 
 app.use(SHOW_PATH, showBodyParser());
+app.use(ASK_PATH, askBodyParser());
 // Parse JSON bodies. A review of 50 comments at the field caps is about 450 kB.
 app.use(express.json({ limit: '1mb' }));
 // #endregion
@@ -3326,6 +3328,7 @@ let savedTerminals = terminalsFile.load() || {};
 function saveTerminals() {
   const kept = new Set(Object.values(savedTerminals.terminalIds || {}));
   const showSessions = show.prune((id) => kept.has(id) || terminal.hasTerminal(id));
+  ask.prune((id) => terminal.hasTerminal(id));
   terminalsFile.save({ ...savedTerminals, showSessions });
 }
 
@@ -3460,6 +3463,14 @@ mountShowRoutes(app, {
   broadcast,
   onRemoved: (sessionId, paths) => panes.removeShow(sessionId, paths),
 });
+const ask = createAskStore();
+mountAskRoutes(app, {
+  store: ask,
+  authorized: (token) => terminal.authorized(token),
+  hasTerminal: (id) => terminal.hasTerminal(id),
+  readPreviewFile,
+  broadcast,
+});
 
 // Served from node_modules, never a CDN: any script on this page can use the token.
 const XTERM_FILES = {