# AGENTS.md — Angular

Modern Angular conventions, per the official style guide (https://angular.dev/style-guide).

- Components are standalone by default — add them to another component's `imports` array; don't set `standalone: false`.
- File names use hyphens (`user-profile.ts`); the component `.ts`/`.html`/`.css` share a base name and directory.
- Tests end in `.spec.ts` and sit next to the code under test. Organise by feature, not by file type.
- Avoid generic file names: no `helpers.ts`, `utils.ts`, `common.ts`. One concept per file.
- Prefer `inject()` over constructor parameter injection.
- Group Angular members (deps, inputs, outputs, queries) near the top, then methods.
- Declare inputs with `input()` / `input.required()`, outputs with `output()`, two-way with `model()`; mark them `readonly`.
- Use `protected` for members only read from the template.
- State: `signal()` for writable, `computed()` for derived (read-only), `effect()` only for side effects — never write signals in an effect.
- Templates use built-in control flow: `@if` / `@for` (with a mandatory `track`) / `@switch`. No `*ngIf` / `*ngFor` / `*ngSwitch`.
- Bind with `[class.x]` / `[style.prop]`, not `NgClass` / `NgStyle`.
- Name event handlers by action (`saveUserData()`), not by event (`handleClick()`).
- Keep lifecycle hooks short and `implement` the hook interface; delegate to named methods.
- Keep components presentation-focused; factor validation and data transforms into separate functions/classes.
- When a rule conflicts with a file's existing style, keep that file internally consistent.