Template Developer tools · Plugin
Plugin panel
A narrow side-panel plugin starter with editable connected items, account preferences, and a simulated OAuth connection flow.
A starting point: runs as a live demo, and copies into a new prototype.
Screenshot · shown in its plugin panel shell
Live preview
No live preview yet.
Each prototype stores its data in IndexedDB for the address it runs on. Data you create at localhost:5173 is separate from a build at localhost:4173 or a published URL, and the framed preview shares
storage with that address opened directly.
Highlights
- A narrow plugin panel beside a mock host app
- Editable connected items and account preferences
- A simulated OAuth connection flow
Scenarios 5
- empty
- connected-workspace default
- sync-paused
- connect-error
- read-only
Each scenario rebuilds a deterministic world. Open one with ?scenario=<id>.
Spec kit
Every prototype carries a spec any agent can follow to rebuild it in a real app: the files below, in templates/plugin-panel/, with generated regions kept in sync with the code.
- AGENTS.md
- docs/SPEC.md
- docs/DATA_MODEL.md
- docs/FLOWS.md
- docs/SCREENS.md
- docs/PERMISSIONS.md
Check that the spec is current
pnpm protoyard spec plugin-panel --check Rebuild kit (ZIP)
pnpm protoyard spec plugin-panel --bundle