npm - @augurworks/augur - Versions diffs - 0.15.1 - Mend

@augurworks/augur 0.15.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (190) hide show

package/CANVAS.md +858 -0
package/INSTALL.md +603 -0
package/LICENSE +27 -0
package/README.md +150 -0
package/TRADEMARKS.md +72 -0
package/agents/README.md +65 -0
package/agents/canon-extract.md +117 -0
package/agents/canon.md +151 -0
package/agents/canvas.md +88 -0
package/agents/currency.md +74 -0
package/agents/drafts.md +92 -0
package/agents/identity.md +148 -0
package/agents/prototype-contract.md +69 -0
package/agents/publishing.md +324 -0
package/agents/review-feedback.md +76 -0
package/agents/space-json.md +132 -0
package/agents/ui-skill.md +101 -0
package/agents/working-marks.md +86 -0
package/brand/augur-eye.svg +3 -0
package/brand/augur-icon.svg +41 -0
package/brand/augur-mark.svg +5 -0
package/brand/lentianova-bulky.otf +0 -0
package/brand/lentianova-median.otf +0 -0
package/brand/lentianova.woff2 +0 -0
package/build.js +8409 -0
package/changelog.md +133 -0
package/fonts/inter-latin-wght-normal.woff2 +0 -0
package/package.json +57 -0
package/pitis/PETS.md +121 -0
package/pitis/README.md +117 -0
package/pitis/index.html +266 -0
package/pitis/piti.build.js +81 -0
package/pitis/piti.js +929 -0
package/pitis/roast-agent.md +185 -0
package/realtime/src/index.js +119 -0
package/realtime/wrangler.example.toml +44 -0
package/scripts/adopt.mjs +106 -0
package/scripts/board-snapshot.mjs +197 -0
package/scripts/build-seed-pack.mjs +33 -0
package/scripts/bundle-rekey.mjs +112 -0
package/scripts/bundle-tenancy-rehearsal.mjs +781 -0
package/scripts/canon-extract.mjs +578 -0
package/scripts/canon.mjs +599 -0
package/scripts/canvas-screen.mjs +333 -0
package/scripts/check-local.mjs +136 -0
package/scripts/clawd-art.mjs +75 -0
package/scripts/clawd-canvas.mjs +741 -0
package/scripts/cli.mjs +100 -0
package/scripts/clone.mjs +422 -0
package/scripts/close.mjs +30 -0
package/scripts/connect.mjs +103 -0
package/scripts/deploy.mjs +157 -0
package/scripts/dev.mjs +54 -0
package/scripts/doc-lint.mjs +143 -0
package/scripts/export.mjs +300 -0
package/scripts/fork.mjs +64 -0
package/scripts/freeze.mjs +74 -0
package/scripts/frontdoor-parity.mjs +180 -0
package/scripts/hook.mjs +67 -0
package/scripts/identity-rekey.mjs +112 -0
package/scripts/init.mjs +122 -0
package/scripts/land.mjs +40 -0
package/scripts/lib/adapters.mjs +156 -0
package/scripts/lib/board-snapshot.mjs +511 -0
package/scripts/lib/draft.mjs +385 -0
package/scripts/lib/graduate.mjs +276 -0
package/scripts/lib/instance.mjs +74 -0
package/scripts/lib/marks.mjs +107 -0
package/scripts/lib/materialize.mjs +138 -0
package/scripts/lib/merge3.mjs +124 -0
package/scripts/lib/offline-posture.mjs +120 -0
package/scripts/lib/offline-respawn.mjs +18 -0
package/scripts/lib/offline-wrangler.mjs +78 -0
package/scripts/lib/publish-compose.mjs +12 -0
package/scripts/lib/publish-conflict.mjs +78 -0
package/scripts/lib/publish-evidence.mjs +144 -0
package/scripts/lib/refine-compare.mjs +140 -0
package/scripts/lib/refine-ledger.mjs +150 -0
package/scripts/lib/refine-png.mjs +149 -0
package/scripts/lib/seed-pack-build.mjs +141 -0
package/scripts/lib/state-compare.mjs +68 -0
package/scripts/lib/store.mjs +122 -0
package/scripts/login.mjs +84 -0
package/scripts/mark.mjs +112 -0
package/scripts/migrate-board-keys.mjs +164 -0
package/scripts/migrate.mjs +265 -0
package/scripts/no-foreign-vocabulary.mjs +216 -0
package/scripts/no-product-names.mjs +157 -0
package/scripts/no-tenant-globals.mjs +1134 -0
package/scripts/offline.mjs +247 -0
package/scripts/og.mjs +170 -0
package/scripts/one-tenant-resolver.mjs +146 -0
package/scripts/open.mjs +63 -0
package/scripts/publish.mjs +1041 -0
package/scripts/read.mjs +31 -0
package/scripts/refine.mjs +455 -0
package/scripts/release-drift.mjs +138 -0
package/scripts/restore.mjs +322 -0
package/scripts/review.mjs +125 -0
package/scripts/save.mjs +21 -0
package/scripts/shell-lint.mjs +189 -0
package/scripts/ship.mjs +460 -0
package/scripts/shoot.mjs +264 -0
package/scripts/smoke-invite.mjs +113 -0
package/scripts/state-inventory.mjs +223 -0
package/scripts/status.mjs +177 -0
package/scripts/sync.mjs +27 -0
package/scripts/tenant-do-rehearsal.mjs +1314 -0
package/scripts/ui-copy-lint.mjs +202 -0
package/scripts/watch.mjs +32 -0
package/scripts/wrangler-preflight.mjs +246 -0
package/seed/CANON.md +43 -0
package/seed/README.md +119 -0
package/seed/prototype-status.json +9 -0
package/seed/registry.json +88 -0
package/seed/skills/starter-ui/SKILL.md +52 -0
package/seed/skills/starter-ui/skill.json +11 -0
package/seed/skills/starter-ui/starter-tokens.css +73 -0
package/seed/skills/starter-ui/starter-ui.css +318 -0
package/seed/skills/starter-ui/starter-ui.js +50 -0
package/seed/space.json +5 -0
package/seed/start-here/prototypes/connect-your-terminal/index.html +428 -0
package/seed/start-here/prototypes/connect-your-terminal/preview.webp +0 -0
package/seed/start-here/prototypes/sample-with-comments/index.html +172 -0
package/seed/start-here/prototypes/sample-with-comments/preview.webp +0 -0
package/seed/start-here/prototypes/set-up-your-design-system/index.html +353 -0
package/seed/start-here/prototypes/set-up-your-design-system/preview.webp +0 -0
package/seed/threads.json +52 -0
package/seed/worked-examples/prototypes/field-readings/index.html +273 -0
package/seed/worked-examples/prototypes/field-readings/preview.webp +0 -0
package/seed/worked-examples/prototypes/slide-deck/index.html +214 -0
package/seed/worked-examples/prototypes/slide-deck/preview.webp +0 -0
package/seed/worked-examples/prototypes/specimen-viewer/index.html +203 -0
package/seed/worked-examples/prototypes/specimen-viewer/preview.webp +0 -0
package/src/_worker.js +12668 -0
package/src/board-key.mjs +57 -0
package/src/board-room.mjs +881 -0
package/src/bundle-keys.mjs +138 -0
package/src/canon/collect-in-browser.js +215 -0
package/src/canon/emit.mjs +232 -0
package/src/canon/observe.mjs +260 -0
package/src/canon/schema.mjs +451 -0
package/src/canvas/DSEG-LICENSE.txt +95 -0
package/src/canvas/DSEG7Classic-Bold.woff2 +0 -0
package/src/canvas/canvas.css +885 -0
package/src/canvas/canvas.js +5780 -0
package/src/canvas/capture.js +485 -0
package/src/chrome/appchrome.mjs +568 -0
package/src/currency.mjs +203 -0
package/src/delete-confirmation.mjs +254 -0
package/src/drafts/drafts.js +326 -0
package/src/entry.js +58 -0
package/src/galleries.mjs +400 -0
package/src/health-cron.mjs +173 -0
package/src/identity.json +1 -0
package/src/kv-codec.mjs +135 -0
package/src/kv-identity.mjs +259 -0
package/src/mail.mjs +599 -0
package/src/provenance.mjs +74 -0
package/src/publish-compose.mjs +363 -0
package/src/publish-fork.mjs +221 -0
package/src/publish-units.mjs +44 -0
package/src/purge.mjs +81 -0
package/src/review/COMMENTING-UX.md +306 -0
package/src/review/cat.png +0 -0
package/src/review/comment-cursor.svg +7 -0
package/src/review/comments.js +1738 -0
package/src/room-ticket.mjs +96 -0
package/src/roster-chip.mjs +32 -0
package/src/seed-pack.mjs +261 -0
package/src/state-inventory.mjs +249 -0
package/src/sw-logic.mjs +48 -0
package/src/tenant-cache.mjs +141 -0
package/src/tenant-context.mjs +386 -0
package/src/tenant-do.js +2940 -0
package/src/tenant-host.mjs +144 -0
package/src/tenant-quotas.mjs +140 -0
package/src/unit-core.mjs +103 -0
package/src/unit-object.mjs +338 -0
package/templates/README.md +67 -0
package/templates/shell/deploy.yml +145 -0
package/templates/shell/engine-bump.yml +142 -0
package/templates/shell/health.yml +233 -0
package/templates/shell/kv-backup.yml +201 -0
package/templates/shell/roster-update.yml +110 -0
package/templates/shell/space-preflight.yml +35 -0
package/templates/shell/space-rebake.yml +79 -0
package/templates/shell/store-backup.yml +152 -0
package/templates/shell/wrangler.example.toml +266 -0
package/templates/space/publish.yml +91 -0

package/seed/start-here/prototypes/connect-your-terminal/index.html ADDED Viewed

@@ -0,0 +1,428 @@
+<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>Connect your terminal</title>
+<meta name="description" content="Two ways to point a coding agent at this workspace: one line if you already have an agent, or fifteen numbered minutes if you have never opened a terminal.">
+<link rel="stylesheet" href="../../../skills/starter-ui/starter-tokens.css">
+<link rel="stylesheet" href="../../../skills/starter-ui/starter-ui.css">
+<style>
+  /* Page-local layout. Everything with a colour in it comes from the tokens. */
+  .fork { display: grid; grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); gap: var(--starter-s4); }
+  .fork__card {
+    display: flex; flex-direction: column; align-items: flex-start; gap: var(--starter-s3);
+    padding: var(--starter-s5); text-align: left;
+    background: var(--starter-sheet); border: var(--starter-hair); border-radius: var(--starter-radius-2);
+    cursor: pointer; font: inherit; color: inherit;
+    transition: border-color var(--starter-fast), transform var(--starter-fast), box-shadow var(--starter-fast);
+  }
+  .fork__card:hover { border-color: var(--starter-mark); transform: translateY(-2px); box-shadow: var(--starter-lift); }
+  .fork__card p { margin: 0; color: var(--starter-ink-2); font-size: var(--starter-text-sm); }
+  .fork__go { margin-top: auto; color: var(--starter-mark-ink); font: 600 var(--starter-text-sm)/1 var(--starter-font-display); }
+  .path { display: none; }
+  body[data-gv-screen="have-agent"] .path--have,
+  body[data-gv-screen="no-agent"] .path--none { display: block; }
+  body[data-gv-screen="have-agent"] .path--fork,
+  body[data-gv-screen="no-agent"] .path--fork { display: none; }
+  .osbar { display: flex; flex-wrap: wrap; gap: var(--starter-s2); align-items: center; }
+  .osbar__label { font: 600 var(--starter-text-xs)/1 var(--starter-font-display); letter-spacing: .12em; text-transform: uppercase; color: var(--starter-ink-2); margin-right: var(--starter-s2); }
+  .os { display: none; }
+  body[data-os="mac"] .os--mac, body[data-os="win"] .os--win, body[data-os="linux"] .os--linux { display: block; }
+  .check { display: flex; gap: var(--starter-s2); align-items: baseline; font-size: var(--starter-text-sm); color: var(--starter-ink-2); }
+  .check::before { content: "→"; color: var(--starter-mark-ink); font-family: var(--starter-font-display); }
+  details.ask { border-top: var(--starter-hair); padding-top: var(--starter-s3); }
+  details.ask > div { margin-top: var(--starter-s3); }
+  .ask__why { margin: 0 0 var(--starter-s2); font-size: var(--starter-text-sm); color: var(--starter-ink-2); }
+  .backlink { margin-bottom: var(--starter-s5); }
+  .timeline { display: flex; align-items: baseline; gap: var(--starter-s3); flex-wrap: wrap; }
+</style>
+</head>
+<body class="s-page" data-gv-screen="fork" data-os="mac">
+<main class="s-sheet">
+  <header class="s-block">
+    <div class="s-block__rail">01 / 03</div>
+    <div>
+      <p class="s-eyebrow">Start here</p>
+      <h1 class="s-title s-title--hero">Connect your terminal</h1>
+      <p class="s-lede">This workspace is built by briefing a coding agent on your own machine.
+        Nothing to install here, nothing to configure. One connection and everything the agent
+        writes shows up on this site.</p>
+    </div>
+  </header>
+  <!-- ─────────────────────────────────────────── the fork -->
+  <section class="s-block path--fork">
+    <div class="s-block__rail">Pick one</div>
+    <div>
+      <div class="fork">
+        <button type="button" class="fork__card" data-go="have-agent">
+          <span class="s-chip s-chip--mark">1 minute</span>
+          <h2 class="s-h3">I already have a coding agent</h2>
+          <p>An agent CLI runs in your terminal today — you have briefed it before.</p>
+          <span class="fork__go">Get the command →</span>
+        </button>
+        <button type="button" class="fork__card" data-go="no-agent">
+          <span class="s-chip">15 minutes</span>
+          <h2 class="s-h3">Not yet — set one up</h2>
+          <p>You have never opened a terminal, or you have and would rather not guess.
+            Five steps, each with a way out if it goes sideways.</p>
+          <span class="fork__go">Start the walkthrough →</span>
+        </button>
+      </div>
+      <p class="s-caption" style="margin-top: var(--starter-s4)">Unsure? Take the walkthrough. It skips
+        anything you already have.</p>
+    </div>
+  </section>
+  <!-- ─────────────────────────────────────────── path A: has an agent -->
+  <div class="path path--have">
+    <section class="s-block">
+      <div class="s-block__rail">Path A</div>
+      <div>
+        <p class="backlink"><button type="button" class="s-btn s-btn--quiet" data-go="fork">← Both paths</button></p>
+        <h2 class="s-h2">Run this where your agent runs</h2>
+        <p class="s-prose">In the folder you want this workspace to live in, run:</p>
+        <div class="s-cmd">
+          <code class="s-cmd__text" id="cmd-connect">npx augur connect your-workspace</code>
+          <button type="button" class="s-cmd__btn" data-s-copy="#cmd-connect">Copy</button>
+        </div>
+        <p class="s-prose" style="margin-top: var(--starter-s4)">A browser tab opens and asks you to
+          approve the connection. Approve it and the terminal has a key of its own — your password
+          never goes near the agent. The workspace lands in that folder, ready to edit.</p>
+        <div class="check">The terminal prints the workspace it is connected to, and the folder now
+          holds this site's screens as plain HTML files.</div>
+        <details class="ask s-disclosure" style="margin-top: var(--starter-s5)">
+          <summary>Rather have the agent do it?</summary>
+          <div>
+            <p class="ask__why">Paste this into your agent instead of running the command yourself.</p>
+            <div class="s-cmd s-cmd--paste">
+              <code class="s-cmd__text s-cmd__text--plain" id="ask-agent">Run `npx augur connect your-workspace` in this folder. It will open a browser tab for me to approve — tell me when it is waiting, and tell me exactly what it prints when it finishes.</code>
+              <button type="button" class="s-cmd__btn" data-s-copy="#ask-agent">Copy</button>
+            </div>
+          </div>
+        </details>
+      </div>
+    </section>
+    <section class="s-block">
+      <div class="s-block__rail">Then</div>
+      <div>
+        <h2 class="s-h2">Brief it like a designer</h2>
+        <p class="s-prose">There is no editor here. You describe a screen, the agent builds it as a
+          page in this workspace, and publishing puts it on this site. Your first brief can be this one:</p>
+        <div class="s-cmd s-cmd--paste">
+          <code class="s-cmd__text s-cmd__text--plain" id="first-brief">Read skills/starter-ui/SKILL.md and the prototypes under start-here/prototypes/, then build a new one at sketches/prototypes/first-screen/index.html. It is [one or two sentences describing the screen you want]. Use the starter design system rather than inventing new styles, give it a one-line meta description, and publish it when it works.</code>
+          <button type="button" class="s-cmd__btn" data-s-copy="#first-brief">Copy</button>
+        </div>
+        <p class="s-caption" style="margin-top: var(--starter-s3)">Fill in the bracket with a real
+          screen you need. Vague briefs make vague screens.</p>
+      </div>
+    </section>
+  </div>
+  <!-- ─────────────────────────────────────────── path B: no agent yet -->
+  <div class="path path--none">
+    <section class="s-block">
+      <div class="s-block__rail">Path B</div>
+      <div>
+        <p class="backlink"><button type="button" class="s-btn s-btn--quiet" data-go="fork">← Both paths</button></p>
+        <div class="timeline">
+          <h2 class="s-h2" style="margin-bottom:0">Fifteen minutes, five steps</h2>
+          <span class="s-chip">2 + 5 + 3 + 2 + 3 min</span>
+        </div>
+        <p class="s-prose" style="margin-top: var(--starter-s3)">Do them in order. Every step says what
+          you should see when it worked — if you see something else, open the way out underneath it and
+          paste the question to any assistant you can chat with. Each one is written to be answered cold,
+          with no other context.</p>
+        <div class="osbar" role="group" aria-label="Your computer">
+          <span class="osbar__label">Your computer</span>
+          <button type="button" class="s-btn" data-os-pick="mac" aria-pressed="true">macOS</button>
+          <button type="button" class="s-btn" data-os-pick="win" aria-pressed="false">Windows</button>
+          <button type="button" class="s-btn" data-os-pick="linux" aria-pressed="false">Linux</button>
+        </div>
+      </div>
+    </section>
+    <section class="s-block">
+      <div class="s-block__rail">Steps</div>
+      <div>
+        <ol class="s-steps">
+          <!-- 1 -->
+          <li class="s-step">
+            <div class="s-step__no">1</div>
+            <div class="s-step__body">
+              <div class="s-step__head">
+                <h3 class="s-step__title">Open a terminal</h3>
+                <span class="s-chip">2 min</span>
+              </div>
+              <div class="os os--mac">
+                <p class="s-prose">Press <strong>⌘ + Space</strong>, type <strong>Terminal</strong>,
+                  press Enter. It ships with the Mac; nothing to install.</p>
+              </div>
+              <div class="os os--win">
+                <p class="s-prose">Press the <strong>Windows key</strong>, type
+                  <strong>PowerShell</strong>, press Enter. It ships with Windows; nothing to install.</p>
+              </div>
+              <div class="os os--linux">
+                <p class="s-prose">Press <strong>Ctrl + Alt + T</strong>, or find
+                  <strong>Terminal</strong> in your applications menu.</p>
+              </div>
+              <div class="check">A window with a blinking cursor, your username at the start of the
+                line. Text only — that is correct.</div>
+              <details class="ask s-disclosure">
+                <summary>Stuck on this step?</summary>
+                <div>
+                  <p class="ask__why">Paste this to any assistant you can chat with — a browser
+                    chatbot is fine.</p>
+                  <div class="s-cmd s-cmd--paste">
+                    <code class="s-cmd__text s-cmd__text--plain" id="ask-1">I'm on <span class="os-name">macOS</span> and I have never used a terminal. I need to open the built-in terminal app and I can't find it. Tell me exactly where to click, one step at a time, and what the window should look like when it's open.</code>
+                    <button type="button" class="s-cmd__btn" data-s-copy="#ask-1">Copy</button>
+                  </div>
+                </div>
+              </details>
+            </div>
+          </li>
+          <!-- 2 -->
+          <li class="s-step">
+            <div class="s-step__no">2</div>
+            <div class="s-step__body">
+              <div class="s-step__head">
+                <h3 class="s-step__title">Install Node.js</h3>
+                <span class="s-chip">5 min</span>
+              </div>
+              <p class="s-prose">Node is the runtime the agent's command line needs. Check whether you
+                already have it — type this and press Enter:</p>
+              <div class="s-cmd">
+                <code class="s-cmd__text" id="cmd-node">node -v</code>
+                <button type="button" class="s-cmd__btn" data-s-copy="#cmd-node">Copy</button>
+              </div>
+              <p class="s-prose">A version number of <strong>v20</strong> or higher means you are done
+                with this step. Anything else — <em>command not found</em>, or a lower number — install
+                the current LTS release.</p>
+              <div class="os os--mac">
+                <p class="s-prose">Download the macOS installer from <strong>nodejs.org</strong>, open
+                  it, click through. Then close the terminal window and open a new one.</p>
+              </div>
+              <div class="os os--win">
+                <p class="s-prose">Download the Windows installer (.msi) from <strong>nodejs.org</strong>,
+                  run it, keep the defaults. Then close PowerShell and open it again.</p>
+              </div>
+              <div class="os os--linux">
+                <p class="s-prose">Your package manager's version is often too old. Take the current LTS
+                  from <strong>nodejs.org</strong> or use nvm, then open a new terminal.</p>
+              </div>
+              <div class="check"><code>node -v</code> prints something like <strong>v22.11.0</strong>.</div>
+              <details class="ask s-disclosure">
+                <summary>Stuck on this step?</summary>
+                <div>
+                  <p class="ask__why">Paste this, and add whatever the terminal actually said.</p>
+                  <div class="s-cmd s-cmd--paste">
+                    <code class="s-cmd__text s-cmd__text--plain" id="ask-2">I'm on <span class="os-name">macOS</span>. I ran `node -v` in the terminal and it did not print a version number of v20 or higher. I need to install the current LTS release of Node.js and confirm it worked. Walk me through it one step at a time, assume I have never used a terminal, and tell me how to check it afterwards. Here is exactly what the terminal printed: </code>
+                    <button type="button" class="s-cmd__btn" data-s-copy="#ask-2">Copy</button>
+                  </div>
+                </div>
+              </details>
+            </div>
+          </li>
+          <!-- 3 -->
+          <li class="s-step">
+            <div class="s-step__no">3</div>
+            <div class="s-step__body">
+              <div class="s-step__head">
+                <h3 class="s-step__title">Install a coding agent</h3>
+                <span class="s-chip">3 min</span>
+              </div>
+              <p class="s-prose">Any agent that runs in a terminal and can read and write files works
+                here. If you have no preference, install this one:</p>
+              <div class="s-cmd">
+                <code class="s-cmd__text" id="cmd-agent">npm install -g @anthropic-ai/claude-code</code>
+                <button type="button" class="s-cmd__btn" data-s-copy="#cmd-agent">Copy</button>
+              </div>
+              <p class="s-caption">Others exist and are equally fine — pick whichever you already pay
+                for. The rest of this walkthrough assumes the one above; swap the command names if you
+                chose differently.</p>
+              <div class="check">The terminal ends with something like <strong>added 1 package</strong>
+                and gives you your prompt back.</div>
+              <details class="ask s-disclosure">
+                <summary>Stuck on this step?</summary>
+                <div>
+                  <p class="ask__why">Permission errors on this step are common and harmless to fix.</p>
+                  <div class="s-cmd s-cmd--paste">
+                    <code class="s-cmd__text s-cmd__text--plain" id="ask-3">I'm on <span class="os-name">macOS</span>. I ran `npm install -g @anthropic-ai/claude-code` and it failed instead of finishing. Explain what went wrong in plain language and give me the safest fix, one step at a time — I have never used a terminal, and I would rather not run anything with sudo unless you explain why it is needed. Here is exactly what it printed: </code>
+                    <button type="button" class="s-cmd__btn" data-s-copy="#ask-3">Copy</button>
+                  </div>
+                </div>
+              </details>
+            </div>
+          </li>
+          <!-- 4 -->
+          <li class="s-step">
+            <div class="s-step__no">4</div>
+            <div class="s-step__body">
+              <div class="s-step__head">
+                <h3 class="s-step__title">Sign in to the agent</h3>
+                <span class="s-chip">2 min</span>
+              </div>
+              <p class="s-prose">Start it. The first run walks you through signing in — a browser tab
+                opens, you approve, you come back to the terminal.</p>
+              <div class="s-cmd">
+                <code class="s-cmd__text" id="cmd-start">claude</code>
+                <button type="button" class="s-cmd__btn" data-s-copy="#cmd-start">Copy</button>
+              </div>
+              <p class="s-prose">Once it is running, type a sentence and press Enter. It answers in the
+                terminal. That is the whole interface — you are talking to it, not programming it.</p>
+              <div class="check">You type <em>hello</em>, it replies. Leave it running; the next step
+                happens right here.</div>
+              <details class="ask s-disclosure">
+                <summary>Stuck on this step?</summary>
+                <div>
+                  <p class="ask__why">Sign-in problems are the agent's, not this workspace's — ask about
+                    the agent.</p>
+                  <div class="s-cmd s-cmd--paste">
+                    <code class="s-cmd__text s-cmd__text--plain" id="ask-4">I'm on <span class="os-name">macOS</span>. I installed the Claude Code CLI and typed `claude` in the terminal, but I could not get signed in. Explain what the sign-in flow is supposed to do, what to check, and how to start it again from scratch. Assume I am not technical. Here is what the terminal shows: </code>
+                    <button type="button" class="s-cmd__btn" data-s-copy="#ask-4">Copy</button>
+                  </div>
+                </div>
+              </details>
+            </div>
+          </li>
+          <!-- 5 -->
+          <li class="s-step">
+            <div class="s-step__no">5</div>
+            <div class="s-step__body">
+              <div class="s-step__head">
+                <h3 class="s-step__title">Connect this workspace</h3>
+                <span class="s-chip">3 min</span>
+              </div>
+              <p class="s-prose">Last one. Ask the agent to connect, in plain language — it runs the
+                command for you:</p>
+              <div class="s-cmd s-cmd--paste">
+                <code class="s-cmd__text s-cmd__text--plain" id="ask-5-do">Run `npx augur connect your-workspace` in this folder. It will open a browser tab for me to approve — tell me when it is waiting, and tell me exactly what it prints when it finishes.</code>
+                <button type="button" class="s-cmd__btn" data-s-copy="#ask-5-do">Copy</button>
+              </div>
+              <p class="s-prose">Approve the tab that opens. The terminal now has a key of its own, so
+                your password never goes near the agent, and this workspace's screens are files in that
+                folder.</p>
+              <div class="check">The terminal prints the workspace it is connected to. You are done —
+                everything from here is briefing, not setup.</div>
+              <details class="ask s-disclosure">
+                <summary>Stuck on this step?</summary>
+                <div>
+                  <p class="ask__why">Paste this to the agent itself; it can read its own error.</p>
+                  <div class="s-cmd s-cmd--paste">
+                    <code class="s-cmd__text s-cmd__text--plain" id="ask-5">The connect command failed. Read the error carefully and tell me in plain language what it means, whether it is a problem on my machine or on the server, and what to try next. Do not run anything destructive. If it is a permissions or network problem, say so plainly.</code>
+                    <button type="button" class="s-cmd__btn" data-s-copy="#ask-5">Copy</button>
+                  </div>
+                </div>
+              </details>
+            </div>
+          </li>
+        </ol>
+        <div class="s-card s-card--mark" style="margin-top: var(--starter-s6)">
+          <h3 class="s-h3">Connected. Now brief it.</h3>
+          <p class="s-prose">There is no editor in this product. You describe a screen, the agent builds
+            it here, and publishing puts it on this site for everyone. Start with this:</p>
+          <div class="s-cmd s-cmd--paste">
+            <code class="s-cmd__text s-cmd__text--plain" id="first-brief-2">Read skills/starter-ui/SKILL.md and the prototypes under start-here/prototypes/, then build a new one at sketches/prototypes/first-screen/index.html. It is [one or two sentences describing the screen you want]. Use the starter design system rather than inventing new styles, give it a one-line meta description, and publish it when it works.</code>
+            <button type="button" class="s-cmd__btn" data-s-copy="#first-brief-2">Copy</button>
+          </div>
+        </div>
+      </div>
+    </section>
+  </div>
+  <p class="s-note"><strong>This page is a prototype.</strong> It is one HTML file in this workspace,
+    at <code>start-here/prototypes/connect-your-terminal/index.html</code>, wearing the same design
+    system as everything else. Once you are connected you can rewrite it — including this sentence.</p>
+</main>
+<script src="../../../skills/starter-ui/starter-ui.js" defer></script>
+<script>
+(function () {
+  "use strict";
+  /* ── The connect command ──────────────────────────────────────────────────
+     One string, used in three places on this page. Provisioning rewrites the
+     line below when it copies this workspace into a new account. Left empty,
+     the page reads the workspace name off the URL it is being served from, and
+     falls back to a placeholder when the file is opened straight from disk. */
+  var CONNECT_COMMAND = "";
+  function connectCommand() {
+    if (CONNECT_COMMAND) return CONNECT_COMMAND;
+    var host = location.hostname || "";
+    var label = host.split(".")[0];
+    var named = host.indexOf(".") > 0 && label && label !== "localhost" && !/^\d+$/.test(label);
+    return named ? "npx augur connect --origin https://" + host : "npx augur connect your-workspace";
+  }
+  var cmd = connectCommand();
+  var cmdEl = document.getElementById("cmd-connect");
+  if (cmdEl) cmdEl.textContent = cmd;
+  ["ask-agent", "ask-5-do"].forEach(function (id) {
+    var el = document.getElementById(id);
+    if (el) el.textContent = el.textContent.replace(/npx augur connect [\w-]+/, cmd);
+  });
+  /* ── Which path you are on ────────────────────────────────────────────────
+     The screen changes without the URL changing, so publish it on
+     <body data-gv-screen> — that is what scopes a pinned comment to the screen
+     it was left on. */
+  function go(screen) {
+    document.body.setAttribute("data-gv-screen", screen);
+    window.scrollTo({ top: 0, behavior: "smooth" });
+  }
+  document.addEventListener("click", function (e) {
+    var el = e.target.closest("[data-go]");
+    if (el) go(el.getAttribute("data-go"));
+  });
+  /* ── Which computer you are on ────────────────────────────────────────── */
+  var OS_NAMES = { mac: "macOS", win: "Windows", linux: "Linux" };
+  function detectOs() {
+    var p = (navigator.userAgentData && navigator.userAgentData.platform) ||
+            navigator.platform || navigator.userAgent || "";
+    p = p.toLowerCase();
+    if (p.indexOf("win") === 0 || p.indexOf("windows") > -1) return "win";
+    if (p.indexOf("linux") > -1 || p.indexOf("x11") > -1) return "linux";
+    return "mac";
+  }
+  function setOs(os) {
+    document.body.setAttribute("data-os", os);
+    var name = OS_NAMES[os] || OS_NAMES.mac;
+    Array.prototype.forEach.call(document.querySelectorAll(".os-name"), function (el) {
+      el.textContent = name;
+    });
+    Array.prototype.forEach.call(document.querySelectorAll("[data-os-pick]"), function (b) {
+      b.setAttribute("aria-pressed", String(b.getAttribute("data-os-pick") === os));
+    });
+  }
+  document.addEventListener("click", function (e) {
+    var b = e.target.closest("[data-os-pick]");
+    if (b) setOs(b.getAttribute("data-os-pick"));
+  });
+  setOs(detectOs());
+})();
+</script>
+</body>
+</html>

package/seed/start-here/prototypes/connect-your-terminal/preview.webp ADDED Viewed

Binary file

package/seed/start-here/prototypes/sample-with-comments/index.html ADDED Viewed

@@ -0,0 +1,172 @@
+<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>Sample screen with comments</title>
+<meta name="description" content="A working booking screen with two comments already pinned to it, so the review loop is something you reply to on day one rather than read about.">
+<link rel="stylesheet" href="../../../skills/starter-ui/starter-tokens.css">
+<link rel="stylesheet" href="../../../skills/starter-ui/starter-ui.css">
+<style>
+  .stack { max-width: 34rem; margin: var(--starter-s7) auto var(--starter-s6); padding: 0 var(--starter-s4); }
+  /* The product screen. It wears the same tokens as everything else in the
+     workspace — that is the point — but it is a screen, not a sheet. */
+  .app {
+    background: var(--starter-sheet);
+    border: var(--starter-hair);
+    border-radius: 14px;
+    box-shadow: var(--starter-lift);
+    overflow: hidden;
+  }
+  .app__head { padding: var(--starter-s5) var(--starter-s5) var(--starter-s4); border-bottom: var(--starter-hair); }
+  .app__kicker { margin: 0 0 var(--starter-s1); font: 600 var(--starter-text-xs)/1.6 var(--starter-font-display); letter-spacing: .14em; text-transform: uppercase; color: var(--starter-ink-3); }
+  .app__title { margin: 0 0 var(--starter-s2); font: 600 var(--starter-text-xl)/1.2 var(--starter-font-display); letter-spacing: -.02em; }
+  .app__now { margin: 0; font-size: var(--starter-text-sm); color: var(--starter-ink-2); }
+  .app__body { padding: var(--starter-s5); display: grid; gap: var(--starter-s5); }
+  .pick__label { display: block; margin-bottom: var(--starter-s3); font: 600 var(--starter-text-xs)/1 var(--starter-font-display); letter-spacing: .12em; text-transform: uppercase; color: var(--starter-ink-2); }
+  .days { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--starter-s2); }
+  .day {
+    display: grid; gap: 2px; padding: var(--starter-s3) var(--starter-s2);
+    background: var(--starter-sheet); border: 1px solid var(--starter-rule); border-radius: var(--starter-radius-2);
+    cursor: pointer; text-align: center; font: inherit; color: inherit;
+  }
+  .day__dow { font: var(--starter-text-xs)/1.4 var(--starter-font-display); letter-spacing: .1em; text-transform: uppercase; color: var(--starter-ink-2); }
+  .day__num { font: 600 var(--starter-text-lg)/1.1 var(--starter-font-display); }
+  .day[aria-pressed="true"] { background: var(--starter-ink); border-color: var(--starter-ink); color: var(--starter-sheet); }
+  .day[aria-pressed="true"] .day__dow { color: rgba(251, 250, 246, .7); }
+  .times { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--starter-s2); }
+  .time {
+    padding: var(--starter-s3) var(--starter-s2);
+    font: var(--starter-text-sm)/1 var(--starter-font-display);
+    background: var(--starter-sheet); border: 1px solid var(--starter-rule); border-radius: var(--starter-radius-2);
+    cursor: pointer; color: inherit;
+  }
+  .time:hover:not(:disabled) { border-color: var(--starter-ink-3); }
+  .time[aria-pressed="true"] { background: var(--starter-wash); border-color: var(--starter-mark); color: var(--starter-mark-ink); font-weight: 600; }
+  .time:disabled { color: var(--starter-ink-3); background: var(--starter-inset); cursor: not-allowed; text-decoration: line-through; }
+  .fee { margin: 0; padding: var(--starter-s3) var(--starter-s4); background: var(--starter-inset); border-radius: var(--starter-radius-2); font-size: var(--starter-text-sm); color: var(--starter-ink-2); }
+  .actions { display: flex; flex-wrap: wrap; gap: var(--starter-s3); align-items: center; }
+  .summary { margin: 0; font-size: var(--starter-text-sm); color: var(--starter-ink-2); min-height: 1.4em; }
+  .summary strong { color: var(--starter-ink); }
+</style>
+</head>
+<body class="s-page">
+<div class="stack">
+  <!-- ─────────────────────────────────────── the screen under review -->
+  <main class="app" id="reschedule">
+    <header class="app__head">
+      <p class="app__kicker">Booking 4471</p>
+      <h1 class="app__title">Reschedule your visit</h1>
+      <p class="app__now">Currently <strong>Tuesday 14 May, 09:30</strong> · Full service · 2 hours</p>
+    </header>
+    <div class="app__body">
+      <div>
+        <span class="pick__label" id="day-label">Pick a day</span>
+        <div class="days" role="group" aria-labelledby="day-label" id="days">
+          <button type="button" class="day" data-day="Mon 13 May" aria-pressed="false">
+            <span class="day__dow">Mon</span><span class="day__num">13</span>
+          </button>
+          <button type="button" class="day" data-day="Tue 14 May" aria-pressed="true">
+            <span class="day__dow">Tue</span><span class="day__num">14</span>
+          </button>
+          <button type="button" class="day" data-day="Wed 15 May" aria-pressed="false">
+            <span class="day__dow">Wed</span><span class="day__num">15</span>
+          </button>
+          <button type="button" class="day" data-day="Thu 16 May" aria-pressed="false">
+            <span class="day__dow">Thu</span><span class="day__num">16</span>
+          </button>
+        </div>
+      </div>
+      <div>
+        <span class="pick__label" id="time-label">Pick a time</span>
+        <div class="times" role="group" aria-labelledby="time-label" id="times">
+          <button type="button" class="time" data-time="08:00" aria-pressed="false">08:00</button>
+          <button type="button" class="time" data-time="09:30" aria-pressed="false" disabled>09:30</button>
+          <button type="button" class="time" data-time="11:15" aria-pressed="false">11:15</button>
+          <button type="button" class="time" data-time="13:00" aria-pressed="false">13:00</button>
+          <button type="button" class="time" data-time="15:30" aria-pressed="false" disabled>15:30</button>
+          <button type="button" class="time" data-time="16:45" aria-pressed="false">16:45</button>
+        </div>
+      </div>
+      <p class="fee" id="fee-note">Moving a booking less than 24 hours ahead adds a <strong>&euro;12</strong>
+        rebooking fee, charged when you arrive.</p>
+      <p class="summary" id="summary">Nothing changed yet — pick a day and a time.</p>
+      <div class="actions" id="actions">
+        <button type="button" class="s-btn s-btn--mark s-btn--lg" id="confirm" disabled>Confirm new time</button>
+        <button type="button" class="s-btn s-btn--quiet" id="cancel">Cancel appointment</button>
+      </div>
+    </div>
+  </main>
+  <p class="s-note"><strong>Two comments are already pinned on this screen.</strong> On the site, press
+    <strong>Shift + C</strong> to see them, click a pin to read the thread, and reply — that is the whole
+    review loop. Pins stick to the element they were dropped on, so they survive the screen changing
+    underneath them. This page is a prototype like any other, at
+    <code>start-here/prototypes/sample-with-comments/index.html</code>.</p>
+</div>
+<script src="../../../skills/starter-ui/starter-ui.js" defer></script>
+<script>
+(function () {
+  "use strict";
+  var chosen = { day: "Tue 14 May", time: null };
+  var summary = document.getElementById("summary");
+  var confirm = document.getElementById("confirm");
+  function press(group, el) {
+    Array.prototype.forEach.call(group.children, function (b) { b.setAttribute("aria-pressed", "false"); });
+    el.setAttribute("aria-pressed", "true");
+  }
+  function render() {
+    if (!chosen.time) {
+      summary.textContent = "Nothing changed yet — pick a day and a time.";
+      confirm.disabled = true;
+      return;
+    }
+    summary.innerHTML = "New time: <strong>" + chosen.day + ", " + chosen.time +
+      "</strong>. Your old slot is released as soon as you confirm.";
+    confirm.disabled = false;
+  }
+  document.getElementById("days").addEventListener("click", function (e) {
+    var b = e.target.closest(".day");
+    if (!b) return;
+    press(this, b);
+    chosen.day = b.getAttribute("data-day");
+    render();
+  });
+  document.getElementById("times").addEventListener("click", function (e) {
+    var b = e.target.closest(".time");
+    if (!b || b.disabled) return;
+    press(this, b);
+    chosen.time = b.getAttribute("data-time");
+    render();
+  });
+  confirm.addEventListener("click", function () {
+    summary.innerHTML = "Moved to <strong>" + chosen.day + ", " + chosen.time +
+      "</strong>. A confirmation is on its way to you.";
+    confirm.disabled = true;
+  });
+  document.getElementById("cancel").addEventListener("click", function () {
+    summary.textContent = "Nothing is cancelled — this is a prototype, and it has no server behind it.";
+  });
+})();
+</script>
+</body>
+</html>

package/seed/start-here/prototypes/sample-with-comments/preview.webp ADDED Viewed

Binary file