@galda/cli 0.10.119 → 0.10.120

package/app/index.html

@@ -674,6 +674,18 @@
   .peratab.on{color:var(--ink);border-color:var(--ink3);background:rgba(var(--tint),.06)}
   .peraask{display:flex;gap:8px;align-items:center;padding:10px 16px 6px}
   .peraask input{flex:1;background:var(--glass);border:1px solid var(--hair2);border-radius:10px;color:var(--ink);font-size:12.5px;padding:8px 12px;outline:none}
+  /* First-run nudge + the npx answer. Deliberately not a painted panel or a
+     boxed card: a box reads as "tappable" (DESIGN-RULES §5.6). This is a line
+     of text and a stroke pointing into the input it is about. */
+  .cnudge{display:none;align-items:center;justify-content:center;gap:10px;margin:14px auto 0;opacity:0;transform:translateY(-3px);
+    transition:opacity .28s ease,transform .28s ease}
+  .cnudge.show{display:flex;opacity:1;transform:none}
+  .cnudge-t{font-size:12.5px;line-height:1.5;color:var(--ink2)}
+  .cnudge-a{width:12px;height:20px;flex:0 0 auto;border-left:1.5px solid var(--ink3);border-bottom:1.5px solid var(--ink3);
+    border-bottom-left-radius:7px;position:relative;opacity:.85}
+  .cnudge-a:after{content:'';position:absolute;right:-1px;bottom:-4px;width:6px;height:6px;
+    border-right:1.5px solid var(--ink3);border-bottom:1.5px solid var(--ink3);transform:rotate(-45deg)}
+    padding:10px 12px;font-family:var(--mono);font-size:12.5px;color:var(--ink);overflow-x:auto;white-space:nowrap}
   .peraanswer{margin:0 16px 8px;font-size:12.5px;line-height:1.55;color:var(--ink2);white-space:pre-wrap;background:rgba(var(--tint),.03);border:1px solid var(--hair2);border-radius:10px;padding:10px 12px}
   .peraanswer.loading{color:var(--ink3);font-style:italic}
   .peraanswer.error{color:var(--danger)}
@@ -3283,6 +3295,13 @@
       <div class="nowdoing" id="fsNowDoing" hidden></div>
       <!-- Clawd HERO (§4.5 初期状態): filled by JS (CLAWD generator), shown via #fsRoot.clawdhero -->
       <div id="fsClawdHero" aria-hidden="true"></div>
+      <!-- Under the waiting hero, pointing down at the box a new person is meant
+           to use. "CONNECTED / WAITING FOR GOALS" says our state; this says
+           theirs. Shown only while the board has nothing on it. -->
+      <div class="cnudge" id="composerNudge">
+        <span class="cnudge-t">Type what you want done, down there.</span>
+        <span class="cnudge-a" aria-hidden="true"></span>
+      </div>
       <!-- H23 mobile empty-state hero (flagship .m-hero) — chips fill the composer (#input) -->
       <div class="m-hero"><h2>What should we build?</h2><p>Describe a goal in plain language. Claude Code runs it, checks its own work, and only calls it done with proof.</p><div class="m-chips"><button class="m-chip">Fix the failing test in lib.mjs</button><button class="m-chip">Add a token-usage counter</button><button class="m-chip">Summarize the open PRs</button></div></div>
       <div class="fsstream"><div id="fsFeed"></div></div>
@@ -3474,6 +3493,20 @@
       <div class="segbtn" id="langSeg"><button data-lang="auto">Auto</button><button data-lang="en">English</button><button data-lang="ja">日本語</button></div></div>
   </div>
 </div></div>
+<!-- "What is Galda? / What can it access?" — the orientation panel.
+     WHY IT EXISTS: the first engineer we handed Galda to reached for the gear
+     button before typing anything. He was not lost, he was CHECKING: people
+     want to know what a tool can touch before they hand it a repository. This
+     answers that where they already are, instead of sending them to a website.
+     Rendered from a constant, entirely locally: NO agent run, NO tokens, no
+     network. Spending someone's quota and 40 seconds to produce a text answer
+     they could have read instantly would be a bad trade, and it would teach
+     the wrong idea of what Galda is (it is not a chatbot).
+     Same overlay/modal parts as Settings above — no new component. -->
+<div class="overlay revfloat" id="aboutOverlay"><div class="modal" style="width:min(560px,94vw)">
+  <div class="perahead" style="border-bottom:1px solid var(--hair)"><div class="peratitle" id="aboutTitle">What is Galda?</div><span style="flex:1"></span><button class="mbtn ghost" id="aboutClose">Close</button></div>
+  <div style="padding:16px;max-height:min(70vh,620px);overflow:auto" id="aboutBody"></div>
+</div></div>
 <!-- Slack-style centered delete confirmation, replacing native confirm() for every goal
      delete (restores a lost decision — see docs/confirmed-behaviors.md). Reusable via the
      confirmDelete({title,preview}) -> Promise<boolean> helper. -->
@@ -6782,6 +6815,7 @@ $('gdRevisionInput').addEventListener('keydown', (e) => {
 });
 
 function render(){
+  renderComposerNudge();
   renderProjects(); renderStream(); renderQueue(); renderTasks(); renderActPanel(); wireWfEditButtons();
   renderCtxBar();   // the folder above the composer follows the active project
   renderFlagship();
@@ -9127,7 +9161,8 @@ function bootDisconnected(info){
       background:rgba(4,4,6,.72);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}
     #connectGate.on{display:flex}
     #connectGate .cg-card{position:relative;width:100%;max-width:440px;background:var(--panel,#0d0d0f);border:1px solid var(--hair2,rgba(255,255,255,.12));
-      border-radius:18px;padding:30px 28px;text-align:center;box-shadow:0 30px 80px -30px #000}
+      border-radius:18px;padding:28px 26px;text-align:left;box-shadow:0 30px 80px -30px #000;
+      max-height:calc(100vh - 44px);overflow:auto}
     #connectGate h2{font:700 20px/1.3 var(--ui,system-ui);letter-spacing:-.02em;margin:0 0 8px;color:var(--ink,#e9e7e2)}
     #connectGate p{font-size:13.5px;line-height:1.7;color:var(--ink2,#a3a097);margin:0 0 18px}
     #connectGate .cg-cmd{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#0a0a0b;
@@ -9139,6 +9174,14 @@ function bootDisconnected(info){
     #connectGate .cg-hint{font-size:12px;line-height:1.6;color:var(--ink3,#6b6862);margin:0 0 16px}
     #connectGate .cg-hint a{color:var(--blue,#8fb0ff);text-decoration:none}
     #connectGate .cg-hint a:hover{text-decoration:underline}
+    #connectGate .cg-trust{margin:18px 0 0;padding:16px 0 0;border-top:1px solid var(--hair2,rgba(255,255,255,.10))}
+    #connectGate .cg-blanket{font-size:12.5px;line-height:1.6;color:var(--ink,#e9e7e2);font-weight:600;margin:0}
+    #connectGate .cg-acchead{font:500 10px/1 var(--mono,monospace);letter-spacing:.09em;text-transform:uppercase;color:var(--ink3,#6b6862);margin:16px 0 6px}
+    #connectGate .cg-accrow{font-size:12px;line-height:1.45;color:var(--ink2,#a3a097);padding:0 0 0 12px;margin:0 0 6px;position:relative}
+    #connectGate .cg-accrow:before{content:'';position:absolute;left:0;top:7px;width:4px;height:1px;background:var(--ink3,#6b6862);opacity:.7}
+    #connectGate .cg-seclink{margin:14px 0 0;font-size:12px}
+    #connectGate .cg-seclink a{color:var(--blue,#8fb0ff);text-decoration:none}
+    #connectGate .cg-acct{margin:18px 0 0;padding:16px 0 0;border-top:1px solid var(--hair2,rgba(255,255,255,.10))}
     #connectGate .cg-who{font-size:12px;color:var(--ink3,#6b6862);margin:0 0 4px}
     #connectGate .cg-who b{color:var(--ink2,#a3a097)}
     #connectGate .cg-switch{font-size:12px;color:var(--ink3,#6b6862);margin:14px 0 0;transition:color .2s}
@@ -9153,6 +9196,7 @@ function bootDisconnected(info){
     #connectGate .cg-switch.escalated{color:var(--danger);font-weight:600}
     #connectGate .cg-switch.escalated a{color:var(--danger);text-decoration:underline}
     #connectGate .cg-x{position:absolute;top:14px;right:16px;width:28px;height:28px;border:0;background:transparent;color:var(--ink3,#6b6862);font-size:20px;line-height:1;cursor:pointer}
+    #connectGate .cg-waitwrap{display:flex;justify-content:center}
     #connectGate .cg-wait{display:inline-flex;align-items:center;gap:7px;font:500 10.5px/1 var(--mono,monospace);letter-spacing:.08em;color:var(--ink3,#6b6862);margin-top:16px}
     #connectGate .cg-wait i{width:6px;height:6px;border-radius:50%;background:var(--green,#3DDC97);animation:cgpulse 1.8s ease-in-out infinite}
     @keyframes cgpulse{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--green,#3DDC97) 50%,transparent)}50%{box-shadow:0 0 6px 2px color-mix(in srgb,var(--green,#3DDC97) 35%,transparent)}}
@@ -9172,9 +9216,21 @@ function bootDisconnected(info){
     + '<a href="https://claude.com/claude-code" target="_blank" rel="noreferrer">Claude Code</a> or '
     + '<a href="https://openai.com/codex/" target="_blank" rel="noreferrer">Codex</a>, then run the same command '
     + '— Galda uses whichever agent you have.</p>'
+    // The gate said what to run and never what it would do. "npx? what else is
+    // it going to touch?" is the actual reason people stop here, so the answer
+    // sits with the command. Facts only, in step with docs/SECURITY.md.
+    + '<div class="cg-trust">'
+    + '<p class="cg-blanket">No admin access, no background service, nothing that starts on its own. '
+    + 'Plain JavaScript you can read before you run it, and one folder you can delete.</p>'
+    + '<div class="cg-acchead">What it can access</div>'
+    + NPX_ONBOARDING.access.map(function(t){ return '<div class="cg-accrow">' + esc(t) + '</div>'; }).join('')
+    + '<p class="cg-seclink"><a href="https://galda.app/security" target="_blank" rel="noreferrer">Security and permissions \u2192</a></p>'
+    + '</div>'
+    + '<div class="cg-acct">'
     + '<p class="cg-who">Signed in as <b></b></p>'
     + '<p class="cg-switch">Already running Galda under a different account? Run <code>npx @galda/cli --signin</code> and pick this one. Or <a href="/logout">switch Google account →</a></p>'
-    + '<div class="cg-wait"><i></i>WAITING FOR THIS DEVICE</div></div>';
+    + '</div>'
+    + '<div class="cg-waitwrap"><div class="cg-wait"><i></i>WAITING FOR THIS DEVICE</div></div></div>';
   document.body.appendChild(ov);
   ov.querySelector('.cg-who b').textContent = email || 'your account';
   const open = () => ov.classList.add('on');
@@ -11961,6 +12017,13 @@ $('histBtn').onclick = openHistory;
 $('setBtn').onclick = openSettings;
 $('histClose').onclick = () => $('historyOverlay').classList.remove('show');
 $('setClose').onclick = () => $('settingsOverlay').classList.remove('show');
+// About panel: Close, tapping the backdrop, and Esc all dismiss it (DESIGN-RULES
+// §設定画面 — a dialog must close when you click somewhere unrelated).
+$('aboutClose').onclick = () => closeAbout();
+$('aboutOverlay').onclick = (e) => { if (e.target === $('aboutOverlay')) closeAbout(); };
+document.addEventListener('keydown', (e) => {
+  if (e.key === 'Escape' && $('aboutOverlay')?.classList.contains('show')) { e.stopPropagation(); closeAbout(); }
+}, true);
 $('historyOverlay').addEventListener('click', (e) => { if (e.target === $('historyOverlay')) $('historyOverlay').classList.remove('show'); });
 $('settingsOverlay').addEventListener('click', (e) => { if (e.target === $('settingsOverlay')) $('settingsOverlay').classList.remove('show'); });
 for (const b of $('langSeg').querySelectorAll('button')) b.onclick = () => saveLang(b.dataset.lang);
@@ -12777,11 +12840,133 @@ function gearSetHTML(){
     <button class="optchip${lang === 'en' ? ' on' : ''}" data-gslang="en">EN</button>
     <button class="optchip${lang === 'ja' ? ' on' : ''}" data-gslang="ja">JA</button></div>
   ${billingRow}
+  <div class="srow"><div class="sl">About Galda<span class="sd">What it is, what the agent can touch, and what leaves this machine</span></div>
+    <button class="optchip" data-gabout="1">Open</button></div>
+  ${remoteAccessRow()}
   ${stability}
   ${gearRulesHTML()}
   ${hostReadinessRow()}
   <div class="srow dis"><div class="sl">Data folder<span class="sd">Runs are stored in the engine's chat-runs folder on the host</span></div></div>`;
 }
+// The npx moment, moved to where the intent is.
+//
+// A person who signed up on the web lands on a board with nothing behind it:
+// Galda drives the Claude Code / Codex on THEIR machine, and that is not
+// running yet. Until now the only thing they were told was "Galda is offline —
+// reconnecting…", which is true and useless: it describes our state, not their
+// next step. That is the "run npx" dead end.
+//
+// So the answer arrives when they reach for the composer, which is the moment
+// they have decided to do something. And it has to answer the real hesitation,
+// not just print a command: "npx? what else is it going to do to my machine?"
+//
+// Every line below is a fact about the shipped package, kept in step with
+// docs/SECURITY.md and the same block on galda.app. Do not promise here what
+// is not true there.
+const NPX_ONBOARDING = {
+  why: 'This is a command, not a website, because Galda runs the Claude Code or Codex already installed on your machine, on your own subscription. A website cannot reach them.',
+  blanket: 'No admin access, no background service, nothing that starts on its own. Plain JavaScript you can read before you run it, and one folder you can delete.',
+  access: [
+    'Your project files and tests, inside a throwaway copy',
+    'Its git is read-only: no commit, no push, no checkout, no reset',
+    'Never your working tree, your branch, or your uncommitted changes',
+    'A fixed allowlist of commands, not arbitrary shell',
+    'Nothing at all at install time',
+  ],
+};
+
+// The nudge: with no agent behind the board, point at the composer instead of
+// leaving a new person to guess. Only while there is nothing to do here — it
+// disappears the moment an agent connects.
+function renderComposerNudge(){
+  const n = $('composerNudge');
+  if (!n) return;
+  // Only while there is genuinely nothing here. The moment a first goal exists
+  // the board explains itself and a standing instruction becomes clutter.
+  const empty = !(state.goals || []).length && !(state.tasks || []).length;
+  n.classList.toggle('show', empty);
+}
+
+// The orientation panel's content. A constant, not a request: this renders with
+// zero tokens and no network, because the answer never depends on the project.
+//
+// Every line here is a fact about the shipped code, kept in step with
+// docs/SECURITY.md. Do not add a promise here that is not true there.
+const ABOUT_GALDA = [
+  { h: 'What Galda is', p: [
+    'Galda hands your work to Claude Code or Codex and brings back something you can review.',
+    'It has no AI of its own. It starts the agent already installed and signed in on this machine, on your own subscription, so there is no extra API cost — and your code is never uploaded to Galda to be run through a model.',
+  ] },
+  { h: 'What the agent can do', p: [
+    'Read and edit files, and run tests, inside a private copy of your project.',
+    'Run named commands only — language runtimes, package managers, test and lint runners, and read-only shell tools. Not arbitrary shell.',
+  ] },
+  { h: 'What the agent cannot do', p: [
+    'It cannot commit, push, checkout, or reset. Its git access is read-only: status, log, diff, show, branch, blame, ls-files, rev-parse. Nothing else.',
+    'It cannot touch your working tree. Every task runs in a throwaway git worktree, so your branch and your uncommitted changes are left alone.',
+  ] },
+  { h: 'What leaves this machine', p: [
+    'Model traffic goes from Claude Code or Codex straight to Anthropic or OpenAI. Galda is not in that path.',
+    'With remote access on, what this board displays passes through Galda’s relay so you can open it from your phone. It is encrypted in transit but not end to end, so treat Galda’s server as being in the path.',
+    'Turn remote access off in Settings and no outbound connection is opened at all.',
+  ] },
+  { h: 'Removing it', p: [
+    'Galda installs no background services and runs nothing at install time. Deleting ~/.manager-for-ai removes everything it keeps.',
+  ] },
+];
+function openAbout(){
+  const body = $('aboutBody');
+  if (body) {
+    body.innerHTML = ABOUT_GALDA.map((s) => `
+      <div class="setrow" style="display:block">
+        <div class="setlabel">${esc(s.h)}</div>
+        ${s.p.map((t) => `<div class="setsub" style="margin-top:4px">${esc(t)}</div>`).join('')}
+      </div>`).join('');
+  }
+  $('aboutOverlay')?.classList.add('show');
+}
+function closeAbout(){ $('aboutOverlay')?.classList.remove('show'); }
+// Reachable from the first-run composer link too, once that lands.
+window.openAbout = openAbout;
+
+// Remote access = the relay. On, you can open this board from your phone; the
+// price is that what the board shows crosses Galda's relay server (it is a
+// reverse HTTP tunnel, TLS but not end-to-end encrypted — docs/SECURITY.md).
+// Off, no outbound socket is opened at all.
+//
+// This row exists because that switch already worked and nobody could find it:
+// it was the env var `RELAY_URL=`. The people who most need it are the ones who
+// will never read a source comment. Cursor puts Privacy Mode in Settings for
+// the same reason. Same shape as Language above — a server setting that applies
+// the moment it is chosen, not part of the visual edit session.
+//
+// No row at all when this build has no relay configured (§3 段階開示: never show
+// a switch that controls nothing).
+function remoteAccessRow(){
+  const rp = state.relayPref;
+  if (!rp || !rp.configured) return '';
+  const on = rp.enabled === true;
+  const desc = on
+    ? 'On — reach this board from your phone. What the board shows passes through Galda’s relay.'
+    : 'Off — nothing leaves this machine. This board is not reachable from your phone.';
+  return `<div class="srow"><div class="sl">Remote access<span class="sd">${esc(desc)}</span></div>
+    <button class="optchip${on ? ' on' : ''}" data-grelay="on">On</button>
+    <button class="optchip${on ? '' : ' on'}" data-grelay="off">Off</button></div>`;
+}
+async function loadRelayPref(){
+  try { const r = await fetch(withKey('/api/relay-pref')); state.relayPref = r.ok ? await r.json() : null; }
+  catch { state.relayPref = null; }
+  if ($('gearPop') && custTab === 'settings') buildGearPop();
+}
+async function saveRelayPref(enabled){
+  const r = await fetch(withKey('/api/relay-pref'), {
+    method: 'POST', headers: { 'content-type': 'application/json' },
+    body: JSON.stringify({ enabled }),
+  });
+  if (!r.ok) return showErr('Failed to save.');
+  state.relayPref = await r.json();
+  if ($('gearPop').classList.contains('open')) buildGearPop();
+}
 async function loadStability(){
   try { const r = await fetch(withKey('/api/stability')); state.stability = r.ok ? await r.json() : null; }
   catch { state.stability = null; }
@@ -12873,6 +13058,8 @@ function buildGearPop(){
     pop.innerHTML = gearTabsHTML() + gearSetHTML();
     wireGearCommon(pop);
     for (const b of pop.querySelectorAll('[data-gslang]')) b.onclick = () => saveLang(b.dataset.gslang);
+    for (const b of pop.querySelectorAll('[data-grelay]')) b.onclick = () => saveRelayPref(b.dataset.grelay === 'on');
+    for (const b of pop.querySelectorAll('[data-gabout]')) b.onclick = () => openAbout();
     const signBtn = pop.querySelector('[data-gsignin]');
     if (signBtn) signBtn.onclick = async () => {
       const msg = pop.querySelector('#licKeyMsg');
@@ -12898,6 +13085,7 @@ function buildGearPop(){
     if (stabilityBtn) stabilityBtn.onclick = () => { state.stability = null; buildGearPop(); loadStability(); };
     loadProjectRules();
     if (!state.stability) loadStability();
+    if (!state.relayPref) loadRelayPref();
     return;
   }
   if (custTab === 'mcp') {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@galda/cli",
-  "version": "0.10.119",
+  "version": "0.10.120",
   "type": "module",
   "description": "Galda - hand off work to Claude Code or Codex, get proof back. Runs on your existing subscription, no extra API cost.",
   "scripts": {