---
name: "angular-18-signals-reactivity"
description: "Build modern Angular 18 applications using native Signals and Zoneless change detection."
metadata:
  author: "Google"
  version: "1.0.0"
  runtime_compatibility:
    - "codex"
    - "claude-code"
    - "cursor"
    - "windsurf"
triggers:
  - "use angular 18 signals"
  - "angular zoneless change detection"
  - "signal input output angular"
permissions:
  fs_read: true
  fs_write: "workspace"
  shell_exec: false
  net_access: false
---

# Angular 18 Signals & Zoneless Change Detection

Implements Angular 18 reactivity: signal(), computed(), effect(), input() and output() signal-based components, model() two-way binding, and enabling experimental zoneless change detection (provideExperimentalZonelessChangeDetection).

## When to Invoke
Invoke this skill whenever you need to:
- use angular 18 signals
- angular zoneless change detection
- signal input output angular

## Execution SOP & Rules
1. Declare signals: count = signal(0); and computed state: double = computed(() => this.count() * 2).
2. Declare component inputs: title = input.required<string>(); and outputs: changed = output<number>().
3. Update signal state: this.count.update(v => v + 1); or this.count.set(10).
4. Run side effects inside constructor using effect(() => { console.log(this.count()); }).

## Verification Checklist
- Run local linting, syntax validation, and type-checks before reporting completion.
- Ensure all created or modified files adhere to workspace boundaries and avoid uncommitted secrets.
- Verify tests or build commands exit cleanly with return code 0.