Andersseen

Use ready-made, styled Andersseen UI custom elements (@andersseen/web-components). Load when placing or wiring and-* elements — and-button, and-card, and-modal, and-tabs, and-drawer, and-dropdown, and-select, and-input, and-navbar, and-sidebar, and-toast,…

Attach framework-agnostic DOM behaviors onto existing HTML via `and-*` attributes with @andersseen/behaviors. Load when you need progressive enhancement / imperative interaction wired onto elements already in the page — resizable splitters, HTML5 drag & drop,…

Orchestrator for the Andersseen front-end ecosystem. Use this to decide WHICH Andersseen library to reach for and route to its focused skill before writing code. Trigger phrases: andersseen, @andersseen, and-* component, andersseen design system, which…

Reuse Andersseen headless behavior primitives (@andersseen/headless-components) for state, accessibility, and keyboard logic when building a CUSTOM UI. Load when you need correct open/close, focus, ARIA, or keyboard handling without a pre-styled component:…

Register and render SVG icons with @andersseen/icon. Load when using registerIcons / registerAllIcons / getIcon / COMPONENT_ICONS, wiring the and-icon element, or resolving "icon not showing" issues. COMPONENT_ICONS must be registered whenever…

Compose layout and typography with @andersseen/layout — a pure-CSS, attribute-driven system using and-layout and and-text with @breakpoint responsive modifiers. Load when building responsive page shells, grids, flex layouts, spacing, or type scales without a…

Add attribute-driven animations with @andersseen/motion — scroll/enter, hover, and tap triggers via and-motion HTML attributes plus initMotion/MotionController. Load when animating element entrances, hover/tap feedback, staggered lists, or configuring…

Build, review, or refactor StencilJS Web Components for @andersseen/web-components. Use when creating a new and-* component, adding props/events/slots, improving accessibility (ARIA, keyboard nav, focus), applying theming tokens, implementing CVA variants…

Audit the whole release chain — local versions vs npm vs GitHub Releases vs Actions runs vs the Cloudflare deploy — and repair whatever drifted. Usage: /release-check [--fix]

Sweep a component across the 5 color × 5 style presets plus dark mode to catch tokens that only resolve under the default theme. Usage: /theme-audit <component>

Verify a component in a real browser — a11y tree, keyboard path, and a non-default theme — before calling UI work done. Usage: /verify-ui <component>

Understand and integrate Volt UI components into Angular projects. Volt UI is an Angular component library inspired by shadcn/ui, built on ng-primitives, Tailwind CSS v4, standalone signals components and CVA. Use when the project consumes @voltui/components,…

Scaffold a new Volt UI component end to end — library files, tests, and all six required ripple effects. Usage: /new-component <name> [shape]

Execute a spec-driven plan from specs/plans/ following the repo's execution protocol. Usage: /run-plan v0.7 [phase N]

Compress natural language memory files (CLAUDE.md, todos, preferences) into caveman format to save input tokens. Preserves all technical substance, code, URLs, and structure. Compressed version overwrites the original file. Human-readable backup saved as…

Verify a Cloudflare deploy will actually succeed before merging to main — token account and scopes, D1 bindings, required secrets, pending migrations, and a dry-run of both workers.

Add a D1 schema migration to dev-auth or devflare — pick the right app, number the file, write replayable SQL, sync the Drizzle schema when it applies, and verify locally before it ever touches production.

Scaffold a new DevFlare browser tool end to end — @org/core service + spec, the page component, and all four registration points (barrel export, router, shell navigation catalog, lucide icon).

Launch DevFlare and actually look at it — walk the key routes in a browser, screenshot them, and check the shell renders correctly at desktop and mobile widths. Use after any change to the layout, sidebar, navbar, styles.css or a Volt component.

Understand and integrate Volt UI components into Angular projects. Volt UI is an Angular component library inspired by shadcn/ui, built on ng-primitives, Tailwind CSS v4, standalone signals components and CVA. Use when the project consumes @voltui/components,…

Update docs/ai/STATE.md to match reality at the end of a work session — branch status, work in progress, gaps, next steps, and a capped session log.

Use the angular-movement animation library correctly by querying its MCP tools (list_directives, get_directive, list_presets, get_example) instead of guessing selectors or inputs. Use whenever writing, reviewing, or debugging a [move*] template binding, or…

Scaffolds a new movement directive end to end — source, colocated Vitest spec, barrel registration, demo page and docs — following the 6-step checklist in docs/ai/ARCHITECTURE.md. Use when adding any new directive to the library.

Runs the pre-release audit and cuts a version of the movement library — verification gate, API surface check, docs drift check, changelog roll, and the tag push that triggers the npm publish workflow. Use when preparing or publishing any library version.

Creates or resumes a spec in docs/ai/specs/ following the SDD-WORKFLOW Phase 2 contract. Use at the start of any non-trivial task — anything beyond a typo, a doc tweak, or a one-line bug fix with an obvious cause.

Runs the SDD-WORKFLOW Phase 5 verification gate for this repo — library tests, lint, build, and the conditional e2e / pack checks — picking which conditionals apply from what actually changed. Use before reporting any task done, before committing library…

Compress natural language memory files (AGENTS.md, todos, preferences) into caveman format to save input tokens. Preserves all technical substance, code, URLs, and structure. Compressed version overwrites the original file. Human-readable backup saved as…

Compress natural language memory files (CLAUDE.md, todos, preferences) into caveman format to save input tokens. Preserves all technical substance, code, URLs, and structure. Compressed version overwrites the original file. Human-readable backup saved as…

Close out a work session — update docs/STATE.md with what was done, what is unfinished, and any new known issues, after verifying the build is green.

Add a new resume template — component, registry entry, and ResumePreview dispatch — following the repo's template conventions.

Implement an approved spec from docs/specs/ end to end, following the SDD workflow — mark in-progress, work the checklist with per-step checks, then close out with tests, changeset, STATE.md, and the spec outcome note.

Draft a new ForgeCMS spec in docs/specs/ from TEMPLATE.md. Use when a change needs a spec per docs/SDD.md — a new package, adapter, or API endpoint; a change to an adapter contract or the API envelope; a new field kind or runtime feature; or a multi-file…

Use ready-made, styled Andersseen UI custom elements (@andersseen/web-components). Load when placing or wiring and-* elements — and-button, and-card, and-modal, and-tabs, and-drawer, and-dropdown, and-select, and-input, and-navbar, and-sidebar, and-toast,…