A development guide for building browser modules in the layered Space Agent runtime, the system that combines first-party code with group and user customizations.

It helps developers create modules, connect page extension points, organize implementation files, and follow the repository’s L0, L1, and L2 layer conventions.

It explains where code belongs and how extensions, components, and Alpine stores fit together, reducing misplaced or duplicated frontend code.

Development — Skill by agent0ai

Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

agentmods

npx agentmods add skills/agent0ai/space-agent/development

Any agent

npx skills add agent0ai/space-agent --skill development

Clone the repo

git clone --depth 1 https://github.com/agent0ai/space-agent

Made for: Claude Code, Codex.

Per session 25 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.

When invoked 784 The whole file, excluding the scripts and references it only reads on demand.

Security scan A 0 findings. Scan, not verified.

Origin original No closer match found in the catalogue.

Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

Model	Per session	Once invoked
Fable 5	$0.00025	$0.00784
Opus 5	$0.00013	$0.00392
Sonnet 5	$0.00005	$0.00157
Haiku 4.5	$0.00003	$0.00078

Measured 2d ago against content hash 869ef286b786, method: parsed. Prices are Anthropic first-party input rates as of 2026-08-30, from the pricing page.

Security

Grade A, and why

Development scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 2d ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

Origin

Copies of this mod

1 near-identical copy found in the catalogue:

Development — 100% identical, 0 lines differ

app/L0/_all/mod/_core/admin/ext/skills/development/SKILL.md · 75 lines

How it starts

The opening of the file, as written. The whole thing — 75 lines — stays where its author put it; the contents beside it link to each section on GitHub.

Use this skill when the user asks how to build a module, where code should live, how layers work, or how the extension/component/Alpine runtime composes the frontend.

Layer Model

L0 is firmware. Repo-owned first-party code belongs here.
L1 is group customware. Use it for group-level overrides and additions.
L2 is user customware. Use it for per-user overrides and additions.
First-party source for this repository should normally live under app/L0/_all/mod/_core/....
L1 and L2 are runtime state, not the home for durable repo-owned product code.

Module Layout

Browser modules are namespaced as mod/<author>/<repo>/....
A first-party module usually lives at app/L0/_all/mod/_core/<feature>/.
Keep real implementation files in the module folder.
Keep ext/html/ adapter files and ext/js/ hook files thin. They should usually mount a real component or provide a focused hook, not hold the whole feature.

How The Frontend Composes

Page shells in server/pages/ stay thin and expose <x-extension id="..."> anchors.
Matching HTML extension files live under mod/<author>/<repo>/ext/html/<anchor>/....
Those extension files usually mount a real component with <x-component path="/mod/...">.
<x-component> loads the component HTML, styles, scripts, and nested components.
Alpine stores and small module utilities own the behavior.

Example pattern:

<x-extension id="page/admin/body/start"></x-extension>

<x-component path="/mod/_core/admin/views/shell/shell.html"></x-component>

Alpine And Store Pattern

Component HTML owns structure and bindings.
Stores created through space.fw.createStore(...) own state, async work, persistence, and API calls.
Small utility modules own parsing and rendering helpers.
Do not move large feature logic into long inline x-data blocks.

JS Extension Hooks

Use space.extend(import.meta, async function name(...) { ... }) for behavioral extension seams.
/start hook files run before the wrapped function.
/end hook files run after the wrapped function.
JS hook files live under mod/<author>/<repo>/ext/js/<extension-point>/....
Use HTML anchors for structural seams and space.extend(...) for behavioral seams.

Read the full file on GitHub · 75 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

2d ago First seen · 75 lines · 25 tokens per session scan A 869ef286b786

Subscribe to this mod's changes

Development is a skill published in the GitHub repository agent0ai/space-agent (1,390 stars, last pushed 2mo ago), licensed MIT. It adds 25 tokens to every session and 784 once invoked, about $0.0001 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.

Browser automation Frontend

use-agent-browser-for-airi

Test AIRI display-model imports with agent-browser across stage-tamagotchi Electron, stage-web, and stage-pocket mobile web layouts. Use when uploading and verifying contributor-supplied Live2D ZIP, VRM, or MMD ZIP/PMX/PMD files through AIRI's model selector, including onboarding bypass, format-specific import…

moeru-ai/airi · 87 tokens

opencli-sitemap-author

Use when creating or maintaining OpenCLI site sitemaps: agent-facing navigation, page-state, action, workflow, API-reference, pitfall, and fallback knowledge for a website. Use after browser exploration discovers durable site context, when a sitemap is stale, or when promoting local site knowledge into the repo.

jackwener/OpenCLI · 67 tokens

pinchtab-mcp

Use this skill when a task requires browser automation through PinchTab's MCP server connected to a remote browser instance. Covers navigation, element interaction, data extraction, form filling, multi-step flows, and session management via MCP tools.

pinchtab/pinchtab · 52 tokens

Development