Angular Components Angular V22 Component Contracts

Name: Angular Components Angular V22 Component Contracts
Author: janpereira-dev

ASecurity

Use this skill when Angular 22 changes affect component creation, selector rules, host directives, or default component behavior.

4 stars

0 votes

0 copies

0 views

Added 10/2/2026

developmenttypescriptgoangularapi

Works with

api

Security Analysis

A100/100

Scanned 10/2/2026

npx -y skills add janpereira-dev/ngAutoPilot --skill angular--components--angular-v22-component-contracts --agent claude-code

Installs into .claude/skills of the current project.

Are you the author of Angular Components Angular V22 Component Contracts?

Add the live security badge to your README — it updates automatically with every re-scan.

Security grade badge for Angular Components Angular V22 Component Contracts

[![Security: A — Skills Directory](https://www.skillsdirectory.com/api/skills/janpereira-dev-angular-components-angular-v22-component-contracts-ngautopilot/badge)](https://www.skillsdirectory.com/skills/janpereira-dev-angular-components-angular-v22-component-contracts-ngautopilot)

More formats (shields.io, HTML) on the badges page. Keep it an A: scan every change in CI with Pro.

Download with Pro

Files

SKILL.md

---
id: angular.components.angular-v22-component-contracts
name: Angular v22 Component Contracts
description: >
  Use this skill when Angular 22 changes affect component creation, selector rules, host directives, or default component behavior.
stack:
  - Angular
  - TypeScript
category: components
status: stable
version: 0.10.0
owner: NgAutoPilot
triggers:
  - ComponentFactoryResolver
  - ComponentFactory
  - selector collision
  - createComponent
  - change detection
compatibility:
  angular:
    min: "22"
---

# Angular v22 Component Contracts

## Purpose

Use this skill when Angular 22 changes affect component creation, selector rules, host directives, or default component behavior.

## When to Use

Use this skill when:

- Dynamic components use APIs that changed or were removed in v22.
- Multiple selectors or host directives may now collide.
- Component change detection behavior needs to stay explicit.

## When Not to Use

Do not use this skill when:

- The issue is only template syntax.
- The task is only about routing or SSR.
- A more specific dynamic-component skill is the better match.

## Required Inputs

- dynamic component code
- selectors
- host directives
- change detection expectations

## Procedure

1. Replace removed component creation APIs with the supported v22 path.
2. Normalize selectors so the compiler no longer sees collisions.
3. Review host-directive exposure and any default change-detection assumptions.
4. Validate dynamic component behavior with targeted tests.

## Do

- Keep component creation explicit.
- Prefer one clear selector per component contract.
- Validate lifecycle behavior after the migration.

## Do Not

- Do not keep removed factory APIs in the codebase.
- Do not ignore compile-time selector errors.
- Do not rely on an implicit change-detection default without confirming it.

## Review Checklist

- [ ] Removed component APIs are gone.
- [ ] Selectors are unambiguous.
- [ ] Component tests still pass.

## Expected Output

1. A component-contract summary.
2. The removed API replacement.
3. Remaining component risks.

Attribution

janpereira-dev

View source See grades on GitHub More from janpereira-dev →

SSkills DirectorySkills Directory

Ship a skill? Prove it's safe.

Free 120-pattern security scan, letter grade, and an embeddable README badge.

Submit a skill

Is this your skill, or is something wrong with this listing? Request removal or report an issue. Author removals are honored within 72 hours.

Comments (0)

No comments yet. Be the first to comment!

--- id: angular.components.angular-v22-component-contracts name: Angular v22 Component Contracts description: > Use this skill when Angular 22 changes affect component creation, selector rules, host directives, or default component behavior. stack: - Angular - TypeScript category: components status: stable version: 0.10.0 owner: NgAutoPilot triggers: - ComponentFactoryResolver - ComponentFactory - selector collision - createComponent - change detection compatibility: angular: min: "22" --- # Angular v22 Component Contracts ## Purpose Use this skill when Angular 22 changes affect component creation, selector rules, host directives, or default component behavior. ## When to Use Use this skill when: - Dynamic components use APIs that changed or were removed in v22. - Multiple selectors or host directives may now collide. - Component change detection behavior needs to stay explicit. ## When Not to Use Do not use this skill when: - The issue is only template syntax. - The task is only about routing or SSR. - A more specific dynamic-component skill is the better match. ## Required Inputs - dynamic component code - selectors - host directives - change detection expectations ## Procedure 1. Replace removed component creation APIs with the supported v22 path. 2. Normalize selectors so the compiler no longer sees collisions. 3. Review host-directive exposure and any default change-detection assumptions. 4. Validate dynamic component behavior with targeted tests. ## Do - Keep component creation explicit. - Prefer one clear selector per component contract. - Validate lifecycle behavior after the migration. ## Do Not - Do not keep removed factory APIs in the codebase. - Do not ignore compile-time selector errors. - Do not rely on an implicit change-detection default without confirming it. ## Review Checklist - [ ] Removed component APIs are gone. - [ ] Selectors are unambiguous. - [ ] Component tests still pass. ## Expected Output 1. A component-contract summary. 2. The removed API replacement. 3. Remaining component risks.