angular-cdk
Installation
SKILL.md
Angular CDK (Component Dev Kit) Skill
Rules
Lifecycle & Resource Management
- Must create
FocusTrapinngOnInit()usingfocusTrapFactory.create() - Must call
focusTrap.focusInitialElement()after creating focus trap - Must destroy
FocusTrapinngOnDestroy()usingfocusTrap.destroy() - Must stop monitoring focus in
ngOnDestroy()usingfocusMonitor.stopMonitoring() - Must destroy
keyManagerinngOnDestroy()usingkeyManager.destroy() - Must dispose
overlayRefin cleanup usingoverlayRef.dispose() - Must explicitly release all CDK resources in
ngOnDestroy() - Must clean up:
focusTrap,overlayRef,focusMonitor,keyManager - Shall Not leave CDK resources without cleanup (causes memory leaks)
Accessibility
- Must use
LiveAnnouncerfor screen reader announcements of dynamic content - Must use
FocusKeyManagerfor keyboard navigation in lists
Related skills
More from neversight/skills_feed
ai-image-generation
|
7react-best-practices
Provides React patterns for hooks, effects, refs, and component design. Covers escape hatches, anti-patterns, and correct effect usage. Must use when reading or writing React components (.tsx, .jsx files with React imports).
7ui-designer
Use when user needs visual UI design, interface creation, component systems, design systems, interaction patterns, or accessibility-focused user interfaces.
7python-env
Fast Python environment management with uv (10-100x faster than pip). Triggers on: uv, venv, pip, pyproject, python environment, install package, dependencies.
7typescript-best-practices
Provides TypeScript patterns for type-first development, making illegal states unrepresentable, exhaustive handling, and runtime validation. Must use when reading or writing TypeScript/JavaScript files.
6ai-marketing-videos
|
6