alfredoperez

SDD — Spec-Driven Development: detect code that drifted from .specs/<domain>/spec.md (changed without spec update).

SDD — Spec-Driven Development: execute tasks, run checkpoints, commit and open PR.

SDD — Spec-Driven Development: write a lean implementation plan.

SDD — Spec-Driven Development: write a lean spec for rapid iteration.

SDD — Spec-Driven Development: scaffold a new Architectural Decision Record.

SDD — Spec-Driven Development: scaffold .sdd/ folder (principles, decisions) for a project.

SDD — Spec-Driven Development: generate a lean phased task list.

SDD — Spec-Driven Development: run the full pipeline automatically.

Modern Angular best practices for building performant, maintainable Angular 17+ applications. Covers Signals, RxJS, components, templates, styles, performance, SSR, testing, forms, routing, accessibility, and architecture — with code examples and impact ratings for every rule. Use this skill whenever the user is working on Angular code of any kind: components, services, templates, stylesheets, routes, tests, or configuration. This applies to editing .component.ts, .service.ts, .html templates, .scss/.css styles, .spec.ts tests, .routes.ts files, store files, and any general .ts file in an Angular project. Look for angular.json, nx.json, or @angular/core imports as project indicators. Do not use for AngularJS (1.x), React, Vue, or non-Angular TypeScript projects.

For contributors to angular-best-practices. Creates new rule files and library skills following project conventions. Not for Angular application development — install angular-best-practices instead.

For contributors to angular-best-practices. Reviews and audits rule files for accuracy, validity, and formatting compliance. Not for Angular application development — install angular-best-practices instead.

Angular Material and CDK best practices. Covers selective imports, M3 theming, CDK utilities, and component test harnesses. Activates when working with @angular/material and @angular/cdk. Do not use for PrimeNG, Spartan UI, or other component libraries. Install alongside angular-best-practices for full coverage.

NgRx state management best practices for Angular. Covers pure reducers, action groups, entity adapter, selectors, and signal-based selection. Activates when working with @ngrx/store, @ngrx/effects, and @ngrx/entity. Do not use for Akita, NGXS, or standalone signal-based state. Install alongside angular-best-practices for full coverage.

PrimeNG best practices for Angular. Covers tree-shaking imports, lazy-loaded tables, and the Aura/Lara theme system with design tokens. Activates when working with primeng components. Do not use for Angular Material, Spartan UI, or other component libraries. Install alongside angular-best-practices for full coverage.

NgRx SignalStore best practices for Angular. Covers shared state, computed state, entity management, and RxJS integration with rxMethod. Activates when working with @ngrx/signals and @ngrx/signals/entities. Do not use for NgRx Store or class-based state services. Install alongside angular-best-practices for full coverage.

Spartan UI (shadcn for Angular) best practices. Covers Brain/Helm architecture, Tailwind integration, and accessible headless components. Activates when working with @spartan-ng/brain and @spartan-ng/ui. Do not use for Angular Material, PrimeNG, or other component libraries. Install alongside angular-best-practices for full coverage.

Perform a non-destructive cross-artifact consistency and quality analysis across spec.md, plan.md, and tasks.md after task generation.

Identify underspecified areas in the current feature spec by asking up to 5 highly targeted clarification questions and encoding answers back into the spec.

Create or update the project constitution from interactive or provided principle inputs, ensuring all dependent templates stay in sync.

Execute the implementation plan by processing and executing all tasks defined in tasks.md

Execute the implementation planning workflow using the plan template to generate design artifacts.

Create or update the feature specification from a natural language feature description.

Generate an actionable, dependency-ordered tasks.md for the feature based on available design artifacts.

Evaluate the speckit-extension end-to-end against a real spec — verify lifecycle hooks fired, .spec-context.json captured each step into canonical history[], timing is real (not backfilled), and per-task execution was journaled. Umbrella eval for the spec-kit-side extension; grows as features land (auto-mode, etc.). Use when the user says "/eval-speckit-extension", "verify the extension worked", "did the hooks fire", "check the capture", or just ran a /speckit.* spec and wants it validated.

Author a self-contained, framework-free HTML document — a brief, report, or explainer — by reading the generated @butai/docs-kit catalog, composing its doc patterns (hero, section, callout, card grid, metric grid, table, comparison, decisions, timeline, code block, quote band, footer), and styling the whole page through the token contract with a chosen butai theme. Use when the user says '/create-doc', "make a page/doc/brief/report", "an explainer", "capture this as a browsable HTML artifact", "render this design / decision / comparison / plan as a page", or wants a themeable HTML document richer than markdown. One `.html` file, inline CSS, no external runtime deps — it opens and paints offline anywhere.

Author a new framework-free video scene into @butai/scene-kit — a standalone HTML document styled by the token contract, plus its frame.md design-spec and its meta.md catalog entry, then regenerate the catalog + registry. Use when the user says '/create-scene', "add a scene to the scene kit", "author a new HyperFrames scene", "create a title-card / callout / code / quote / outro scene", or wants a restyleable HTML scene that a theme can repaint. Scenes are raw HTML rendered to video by HyperFrames (consumed via `npx hyperframes`, never vendored). No React, no Remotion.

Compose a React/TSX slide deck from a talk outline — read the @butai/slide-kit catalog to pick real archetypes by intent, copy them into the project with `butai add`, wire them into the @butai/deck engine (SlideEngine / Slide), apply a butai theme, and write the deck to a generic, user-named target. Use when the user says '/create', "build the deck", "generate slides from this outline", "compose a presentation", or hands off a talk outline (typically from /outline) ready to become slides. Wires to the butai packages and a consumer-named slides directory — never a personal app path or barrel.

Author a new, complete butai theme as a standalone, contract-valid [data-theme] CSS file — read TOKEN_CONTRACT from @butai/patterns for the exact token names to fill, study the 13 @butai/themes as convention exemplars, fill EVERY required token plus a distinctive display font, then validate the block with validateThemeTokens so it has zero missing tokens. Use when the user says '/create-theme', "create a theme", "new theme", "make a <vibe> theme" (e.g. "a warm editorial theme", "a cyberpunk theme"), or wants to add a palette / color scheme for butai decks, scenes, and docs. Emits a standalone file — it never mutates the frozen @butai/themes package.

Plan and outline a talk or deck BEFORE any slides are built — run a short discovery (purpose, length, content-readiness, speaking-vs-reading density), draft a structured outline whose beats map to real @butai/slide-kit archetypes read from the generated catalog, verify it with the user, then write it to a generic, user-named location for /create to build. Use when the user says '/outline', "plan a talk", "help me shape this talk/deck", "outline my presentation", or has rough notes/screenshots to turn into a talk structure. This skill plans the outline only — it does not build slides or author themes.

Turn a STORYBOARD.md plus the butai scene kit into a video — parse the storyboard, preview the scenes as a themed contact sheet for free, then drive the real render through the user's own HyperFrames install via `npx hyperframes`. Use when the user says '/storyboard', "render this storyboard", "turn my STORYBOARD.md into a video", "preview my video scenes", or has a STORYBOARD.md and scenes ready. A real render costs credits and is a deliberate manual step; the default output here is the free contact-sheet preview. HyperFrames is an external tool, consumed via npx, never vendored.

Check every upstream in the repo-root sources.yml ledger for new releases/commits since it was last reviewed, summarize what changed, and propose what butai might adopt — then update each entry's last-checked date and reference and note that CREDITS.md should be regenerated. Data-driven: it reads the upstream names, urls, and repos from sources.yml at runtime and hardcodes none of them. Use when the user says '/sync-upstreams', "check my upstreams for updates", "sync the credits ledger", "what changed upstream", or "are any of our sources out of date". It proposes; a human always decides what to adopt.