SuperAPI AI Directory

stitch-ui-loop

Frontend & websites

View repository

Updated 10-15 21:48

About this skill

Stitch finite page build loop

Quick start

  1. "Carry forward and complete the current order page of the store appointment site; provide a locally reviewable result first."
  2. "Generate two pages in the approved backlog order and hand off; preserve the existing scope and sources."
  3. "After an interruption, read-only check the remote state and the current baton; identify missing inputs and verification status."

For designers, front-end developers, and teams maintaining this process. Designers provide intent and materials, developers provide engineering/tools, and the team preserves sources and acceptance status during handoff.

Capability boundaries

✅ Good at handling

  • Carry forward and complete the current order page of the store appointment site.
  • Generate two pages in the approved backlog order and hand off.
  • After an interruption, read-only check the remote state and the current baton.

⚠️ Requires materials

  • SITE.md, DESIGN.md, and the current next-prompt.md.
  • Project metadata, existing pages, and authorized rounds.
  • Available Stitch tools and the target output root directory.

❌ Not applicable scenarios and handoff

  • Generate only a site blueprint → stitch-site-md.
  • Single-pass prompt polishing → stitch-design-spec.
  • Infinite background monitoring or automatic deployment → use the product scheduling/deployment process, and deliver the current baton and the reason for stopping.

Workflow

When the user requests full delivery, closed loop, high fidelity, editable HTML, or formal archiving, you must switch to stitch-design-harness; this Skill is only responsible for finite page relay. Completion must not be marked based on tool success text. The delivered visual convergence rounds are constrained by specification comparison.max_rounds (default 3); after stagnation, a structural redo is required, and final completion is still subject to explicit user approval.

  1. Read the baton's page, SITE.md's sitemap/backlog, and the actual files; page allows only a safe slug, with no slashes or ..
  2. Choose one authorized to-do item; check the project and the current system, do not rebuild existing pages, and stop immediately with a record if the backlog is empty or the round limit is reached.
  3. Call the prompt architect according to the project's applied system/inline fallback conditions; generate once, and if it times out, first perform a three-item read-only reconciliation.
  4. Download and check screenshots/HTML and navigation in the staging directory, and only integrate into the actual site root after verification passes; keep the old version for recovery.
  5. Update SITE.md's evidence status and the next baton; if the scope is complete, write a clear completion/stop explanation, and do not self-generate additional tasks.

Order by dependency: source verification → local artifacts → authorized external operations → verification handoff. For multiple tasks, do the current main path first; if information is missing, first output an assumption draft, then precisely list what is missing and its purpose, without using vague prompts like "please provide more background."

Security and result verification

Do not read unrelated account configurations or collect user passwords; credentials are provided only by the environment or authorized connectors. Examples use demo data only; before uploading, replace customer names, phone numbers, and order numbers with demo values, and check HTML, screenshots, and file metadata. Do not write keys, session cookies, full base64 text, or signed download URLs into reports/repositories. Unverified parameters, visual effects, and business figures must not be fabricated; outputs must note sources, decision basis, actual execution, and parts not yet verified.

  • page will not escape the site root directory.
  • Write once per round; for unknown results, first get_project/list_screens/get_screen.
  • Unverified pages are not marked complete, and a stopped state will not automatically resume writing.

Customizable: maximum rounds, site root, page list, cache reuse strategy, and system mode. Value-added checks: baton path constraints; bounded loops; cross-round evidence handoff.

FAQ

Q1: What is the main deliverable? Input page: orders; the sitemap already has orders.html and it has been accepted → skip rebuilding this round, select an authorized todo; if there are no todos, stop and do not generate a new project.

Q2: When should a different entry point be used? Generate only a site blueprint → stitch-site-md; a single prompt polish → stitch-design-spec; unlimited background monitoring or automatic deployment → use the product scheduling/deployment process, and deliver the current baton and stop reason.

Q3: What happens when inputs are missing? First provide a clearly marked local-assumption draft and list "Needed additions: SITE.md, DESIGN.md, and the current next-prompt.md; project metadata, existing pages, and authorized rounds; available Stitch tools and the target output root directory". Write operations that depend on these inputs are not executed.

Q4: How is completion determined? page will not escape the site root directory; write once per round; for unknown results, first get_project/list_screens/get_screen; unverified pages are not marked complete, and a stopped state will not automatically resume writing.

Q5: How is it customized? Maximum rounds, site root, page list, cache reuse strategy, and system mode; when not provided, follow existing project values and mark assumptions.

Q6: Does it automatically upload, install, or go live? Execute only actions covered by the current request and existing authorization; without a remote receipt, do not claim upload success, and without runtime verification, do not claim go-live. Additional installation or scope expansion requires first explaining the specific impact.

Reference as needed

  • When executing detailed mappings, APIs, or templates, read Extended Process。
  • When encountering failures/abnormal inputs, read Anti-patterns and Gotchas。
  • When edge cases, compatibility, customization, and authorization are involved, read In-depth FAQ。
  • When complete input/output and verification scenarios are needed, read Local Application Examples。
  • The local implementation basis is the current skill's accompanying source code and fixed upstream snapshot; the structure follows the Agent Skills specification. The tools' current behavior is subject to the actual schema; when not connected, do not claim online behavior has been verified.

When to use

When the user needs to select and execute a verifiable, recoverable professional workflow for the current request Load this skill when. First extract the goal, input, constraints, delivery format, and acceptance criteria from the request; the description summary is: According to .stitch/SITE.md, DESIGN.md, and next-prompt.md, continue and complete the authorized Stitch page build through handoff; trigger when the user asks to continue iterating according to the backlog and hand off the next page. Writing only prompts, planning, or running indefinitely in the background does not belong to this entry point.

Rules

  • Read before write: first confirm the current state and actual capabilities, then execute actions that change external state.
  • Least privilege: use only the files, tools, accounts, and network scope needed to complete the current step.
  • Evidence first: when run results, resource IDs, versions, hashes, or test output are missing, clearly mark them as NOT_VERIFIED。
  • Idempotency first: retain request identifiers and stage status; when the result is unclear, query first and do not blindly retry.
  • Privacy and security: logs, examples, receipts, and error messages must not contain tokens, cookies, keys, or personally sensitive data.

Workflow

Step 1: Clarify intent

Confirm whether this skill matches the goal; if it is only an adjacent need, hand it off to a more precise skill.

Step 2: Perform prechecks

Confirm the goal, input, constraints, available tools, success criteria, and failure boundaries; if any key condition is unknown, stop at the read-only stage.

Step 3: Form a plan

List the tools to be called, the objects that will change, the success criteria, and the safe exit method after failure.

Step 4: Execute actions

Execute in the minimum sufficient steps, and record evidence at key state changes; retain an associable status or receipt for every external call.

Step 5: Verify delivery

Output the results, verification evidence, unfinished items, risks, and clear next steps, and state facts, inferences, and unverified items separately.

Validation checklist

  • The skill trigger conditions are consistent with the user's intent, and no adjacent task has been misrouted to this skill.
  • The input, target objects, versions, and output locations are all clear, and no guessed values have been used to replace required values.
  • All writes, payments, publications, or irreversible actions are within the scope authorized by the user.
  • The results have been verified with independent checks; only "the command succeeded" or "the file exists" does not count as complete acceptance.
  • The output includes actual evidence, failed/skipped items, remaining risks, and executable next steps.

Gotchas

  1. Mistaking the plan for the result: a document or prompt is not the same as actual execution; the actual execution level must be indicated.
  2. Erroneous retry: a timeout or lost response may already have produced remote state; query first before deciding whether to retry.
  3. Implicit scope expansion: batch, full-scale, publication, overwrite, and payment are not natural extensions of ordinary reads and writes.
  4. Version drift: when referencing external resources, record the version, tag, or commit; do not treat a mutable branch as release evidence.
  5. Stale evidence: caches, old screenshots, and historical tests cannot prove the current environment; refresh key evidence before delivery.

Non-applicability and boundaries

Do not exceed the scope given by the user; writes, payments, publications, and irreversible actions require explicit authorization. If the request requires another skill, do not copy its body text; hand off by skill name and preserve the current task context.

Progressive disclosure

  • When input/output, state, and authorization points need to be determined, read references/workflow-contract.md。
  • When self-checking before delivery is needed, read references/validation-checklist.md。
  • When encountering timeout, partial success, or recovery scenarios, read references/error-recovery.md。
  • For first run, privilege escalation denial, and failure recovery, refer to examples/happy-path.md、examples/boundary-refusal.md、examples/failure-recovery.md。