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.
npx agentmods add skills/punkadillo/figma-code-composer/angular-toolingnpx skills add punkadillo/figma-code-composer --skill angular-toolinggit clone --depth 1 https://github.com/punkadillo/figma-code-composerWhat 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.00086 | $0.01644 |
| Opus 5 | $0.00043 | $0.00822 |
| Sonnet 5 | $0.00017 | $0.00329 |
| Haiku 4.5 | $0.00009 | $0.00164 |
Grade C, and why
angular-tooling scanned grade C with 1 finding 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 yesterday.
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.
Recursive force deletehighDestructive command
rm -rf with a variable or a broad path is one typo away from removing the wrong tree.
rm -rf .angular/cache This is a copy
92% identical to angular-tooling — 15 lines differ, which has more behind it and is treated as the original. This page carries a canonical link to it rather than competing with it.
How it starts
The opening of the file, as written. The whole thing — 353 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Angular Tooling
Use Angular CLI and development tools for efficient Angular v20+ development.
Project Setup
Create New Project
# Create new standalone project (default in v20+)
ng new my-app
# With specific options
ng new my-app --style=scss --routing --ssr=false
# Skip tests
ng new my-app --skip-tests
# Minimal setup
ng new my-app --minimal --inline-style --inline-template
Project Structure
my-app/
├── src/
│ ├── app/
│ │ ├── app.component.ts
│ │ ├── app.config.ts
│ │ └── app.routes.ts
│ ├── index.html
│ ├── main.ts
│ └── styles.scss
├── public/ # Static assets
├── angular.json # CLI configuration
├── package.json
├── tsconfig.json
└── tsconfig.app.json
Code Generation
Components
# Generate component
ng generate component features/user-profile
ng g c features/user-profile # Short form
# With options
ng g c shared/button --inline-template --inline-style
ng g c features/dashboard --skip-tests
ng g c features/settings --change-detection=OnPush
# Flat (no folder)
ng g c shared/icon --flat
# Dry run (preview)
ng g c features/checkout --dry-run
Services
# Generate service (providedIn: 'root' by default)
ng g service services/auth
ng g s services/user
# Skip tests
ng g s services/api --skip-tests
Other Schematics
# Directive
ng g directive directives/highlight
ng g d directives/tooltip
# Pipe
ng g pipe pipes/truncate
ng g p pipes/date-format
# Guard (functional by default)
ng g guard guards/auth
# Interceptor (functional by default)
ng g interceptor interceptors/auth
# Interface
ng g interface models/user
# Enum
ng g enum models/status
# Class
ng g class models/product
Generate with Path Alias
# Components in feature folders
ng g c @features/products/product-list
ng g c @shared/ui/button
Development Server
# Start dev server
ng serve
ng s # Short form
# With options
ng serve --port 4201
ng serve --open # Open browser
ng serve --host 0.0.0.0 # Expose to network
# Production mode locally
ng serve --configuration=production
# With SSL
ng serve --ssl --ssl-key ./ssl/key.pem --ssl-cert ./ssl/cert.pem
What ships with it
1 file beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
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.
- yesterday First seen · 353 lines · 86 tokens per session scan C 3f90dff7a9f4
angular-tooling is a skill published in the GitHub repository punkadillo/figma-code-composer (3 stars, last pushed 13d ago), licensed MIT. It adds 86 tokens to every session and 1,644 once invoked, about $0.0004 per session on Opus 5. A static security scan graded it C with 1 finding (recursive force delete). It is 92% identical to angular-tooling, differing in 15 lines, and is treated as a copy.
Other skills, from other repositories
agent-release-swarm
Agent skill for release-swarm - invoke with $agent-release-swarm.
agent-pagerank-analyzer
Agent skill for pagerank-analyzer - invoke with $agent-pagerank-analyzer.
agent-code-analyzer
Agent skill for code-analyzer - invoke with $agent-code-analyzer.
agent-neural-network
Agent skill for neural-network - invoke with $agent-neural-network.
agui-dotnet-streaming-chat
Get started with the AG-UI .NET SDK: bootstrap and run your first streaming-chat app (client + server) with the AG-UI .NET NuGet packages (AGUI.Client, AGUI.Server, AGUI.Formatting, AGUI.Abstractions). USE FOR: which packages to install and how to wire them; constructing an AGUIChatClient against an endpoint and…
agui-dotnet-sample-step
Add a GettingStarted sample Step (a Server/Client pair) to the AG-UI .NET SDK that demonstrates one protocol feature the way we want users to write it. USE FOR: adding a new samples/GettingStarted/StepNN Server+Client pair, wiring it into AGUI.slnx and the integration-test project, giving it a deterministic…