Agent skill · software engineering · aiskillstore
ng-alain-component-development
Create components using ng-alain (@delon/abc) and ng-zorro-antd UI libraries. Use this skill when building enterprise UI features with ST (Simple Table), SF (Schema Form), ACL (Access Control), PageHeader, ReuseTab, and other @delon components. Ensures proper integration with ng-alain architecture, theming system, responsive layouts, and accessibility standards while following Angular 20 patterns.
Why this skill is useful
Provides specific patterns and integration techniques for ng-alain and ng-zorro-antd that the AI wouldn't reliably generate on its own.
What it needs
About 6k tokens when loaded. Last updated 2026-08-07. 405 stars on the source repository.
What this skill does
ng-alain Component Development Skill This skill helps create enterprise UI components using ng-alain and ng-zorro-antd. Core Libraries @delon Packages @delon/abc: Business components (ST, SV, SEModule, etc.) @delon/form: Dynamic schema-based forms (SF) @delon/auth: Authentication and authorization @delon/acl: Access Control List @delon/theme: Theming and layout system @delon/util: Utility functions ng-zorro-antd Complete Ant Design component library Icons, layouts, forms, tables, modals, etc. Common Patterns 1. ST (Simple Table) Component 2. SF (Schema Form) Component 3. Page Header with Actions 4. ACL (Access Control) 5. Responsive Layout 6. Modal and Drawer ng-alain Theming Using Theme Variables Dark Mode Support Best Practices 1. Use SHAREDIMPORTS 2. Responsive Design 3. Accessibility Checklist When creating ng-alain components: [ ] Use standalone components [ ] Import SHAREDIMPORTS [ ] Use STComponent for data tables [ ] Use SFComponent for complex forms [ ] Implement responsive layout [ ] Add ACL permissions where needed [ ] Use PageHeader for page titles [ ] Implement proper loading states [ ] Add error handling [ ] Follow ng-alain theming system [ ] Support dark mode [ ] Ensure accessibility (ARIA) [ ] Test on mobile devices References ng-alain Documentation ng-zorro-antd Documentation @delon/abc Components ng-alain Instructions Angular Component Skill
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills aiskillstore/ng-alain-component-development