diff --git a/npm/ng-packs/packages/schematics/src/commands/ai-config/files/claude/.claude/CLAUDE.md b/npm/ng-packs/packages/schematics/src/commands/ai-config/files/claude/.claude/CLAUDE.md
index a150753322..32dfab0275 100644
--- a/npm/ng-packs/packages/schematics/src/commands/ai-config/files/claude/.claude/CLAUDE.md
+++ b/npm/ng-packs/packages/schematics/src/commands/ai-config/files/claude/.claude/CLAUDE.md
@@ -137,6 +137,36 @@ You write **clean, maintainable, and modular** code following **ABP, ASP.NET Cor
 - Provide services using `providedIn: 'root'`.  
 - Use the **`inject()` function** instead of constructor injection.
 
+### Component Replacement
+ABP Angular provides a powerful **component replacement** system via `ReplaceableComponentsService`:
+
+**Key Features:**
+- Replace ABP default components (Roles, Users, Tenants, etc.) with custom implementations
+- Replace layouts (Application, Account, Empty)
+- Replace UI elements (Logo, Routes, NavItems)
+
+**Basic Usage:**
+```typescript
+import { ReplaceableComponentsService } from '@abp/ng.core';
+import { eIdentityComponents } from '@abp/ng.identity';
+
+constructor(private replaceableComponents: ReplaceableComponentsService) {
+  this.replaceableComponents.add({
+    component: YourCustomComponent,
+    key: eIdentityComponents.Roles,
+  });
+}
+```
+
+**Important Notes:**
+- Component templates must include `<router-outlet></router-outlet>` for layouts
+- Use the second parameter as `true` for runtime replacement (refreshes route)
+- Runtime replacement clears component state and re-runs initialization logic
+
+**📚 Full Documentation:**  
+For detailed examples, layout replacement, and advanced scenarios:  
+[Component Replacement Guide](https://abp.io/docs/latest/framework/ui/angular/customization-user-interface)
+
 ---
 
 ## 🔒 4. Combined Full-Stack Practices
diff --git a/npm/ng-packs/packages/schematics/src/commands/ai-config/files/copilot/.github/copilot-instructions.md b/npm/ng-packs/packages/schematics/src/commands/ai-config/files/copilot/.github/copilot-instructions.md
index a150753322..32dfab0275 100644
--- a/npm/ng-packs/packages/schematics/src/commands/ai-config/files/copilot/.github/copilot-instructions.md
+++ b/npm/ng-packs/packages/schematics/src/commands/ai-config/files/copilot/.github/copilot-instructions.md
@@ -137,6 +137,36 @@ You write **clean, maintainable, and modular** code following **ABP, ASP.NET Cor
 - Provide services using `providedIn: 'root'`.  
 - Use the **`inject()` function** instead of constructor injection.
 
+### Component Replacement
+ABP Angular provides a powerful **component replacement** system via `ReplaceableComponentsService`:
+
+**Key Features:**
+- Replace ABP default components (Roles, Users, Tenants, etc.) with custom implementations
+- Replace layouts (Application, Account, Empty)
+- Replace UI elements (Logo, Routes, NavItems)
+
+**Basic Usage:**
+```typescript
+import { ReplaceableComponentsService } from '@abp/ng.core';
+import { eIdentityComponents } from '@abp/ng.identity';
+
+constructor(private replaceableComponents: ReplaceableComponentsService) {
+  this.replaceableComponents.add({
+    component: YourCustomComponent,
+    key: eIdentityComponents.Roles,
+  });
+}
+```
+
+**Important Notes:**
+- Component templates must include `<router-outlet></router-outlet>` for layouts
+- Use the second parameter as `true` for runtime replacement (refreshes route)
+- Runtime replacement clears component state and re-runs initialization logic
+
+**📚 Full Documentation:**  
+For detailed examples, layout replacement, and advanced scenarios:  
+[Component Replacement Guide](https://abp.io/docs/latest/framework/ui/angular/customization-user-interface)
+
 ---
 
 ## 🔒 4. Combined Full-Stack Practices
diff --git a/npm/ng-packs/packages/schematics/src/commands/ai-config/files/cursor/.cursor/rules/cursor.mdc b/npm/ng-packs/packages/schematics/src/commands/ai-config/files/cursor/.cursor/rules/cursor.mdc
index a150753322..32dfab0275 100644
--- a/npm/ng-packs/packages/schematics/src/commands/ai-config/files/cursor/.cursor/rules/cursor.mdc
+++ b/npm/ng-packs/packages/schematics/src/commands/ai-config/files/cursor/.cursor/rules/cursor.mdc
@@ -137,6 +137,36 @@ You write **clean, maintainable, and modular** code following **ABP, ASP.NET Cor
 - Provide services using `providedIn: 'root'`.  
 - Use the **`inject()` function** instead of constructor injection.
 
+### Component Replacement
+ABP Angular provides a powerful **component replacement** system via `ReplaceableComponentsService`:
+
+**Key Features:**
+- Replace ABP default components (Roles, Users, Tenants, etc.) with custom implementations
+- Replace layouts (Application, Account, Empty)
+- Replace UI elements (Logo, Routes, NavItems)
+
+**Basic Usage:**
+```typescript
+import { ReplaceableComponentsService } from '@abp/ng.core';
+import { eIdentityComponents } from '@abp/ng.identity';
+
+constructor(private replaceableComponents: ReplaceableComponentsService) {
+  this.replaceableComponents.add({
+    component: YourCustomComponent,
+    key: eIdentityComponents.Roles,
+  });
+}
+```
+
+**Important Notes:**
+- Component templates must include `<router-outlet></router-outlet>` for layouts
+- Use the second parameter as `true` for runtime replacement (refreshes route)
+- Runtime replacement clears component state and re-runs initialization logic
+
+**📚 Full Documentation:**  
+For detailed examples, layout replacement, and advanced scenarios:  
+[Component Replacement Guide](https://abp.io/docs/latest/framework/ui/angular/customization-user-interface)
+
 ---
 
 ## 🔒 4. Combined Full-Stack Practices
diff --git a/npm/ng-packs/packages/schematics/src/commands/ai-config/files/gemini/.gemini/GEMINI.md b/npm/ng-packs/packages/schematics/src/commands/ai-config/files/gemini/.gemini/GEMINI.md
index a150753322..32dfab0275 100644
--- a/npm/ng-packs/packages/schematics/src/commands/ai-config/files/gemini/.gemini/GEMINI.md
+++ b/npm/ng-packs/packages/schematics/src/commands/ai-config/files/gemini/.gemini/GEMINI.md
@@ -137,6 +137,36 @@ You write **clean, maintainable, and modular** code following **ABP, ASP.NET Cor
 - Provide services using `providedIn: 'root'`.  
 - Use the **`inject()` function** instead of constructor injection.
 
+### Component Replacement
+ABP Angular provides a powerful **component replacement** system via `ReplaceableComponentsService`:
+
+**Key Features:**
+- Replace ABP default components (Roles, Users, Tenants, etc.) with custom implementations
+- Replace layouts (Application, Account, Empty)
+- Replace UI elements (Logo, Routes, NavItems)
+
+**Basic Usage:**
+```typescript
+import { ReplaceableComponentsService } from '@abp/ng.core';
+import { eIdentityComponents } from '@abp/ng.identity';
+
+constructor(private replaceableComponents: ReplaceableComponentsService) {
+  this.replaceableComponents.add({
+    component: YourCustomComponent,
+    key: eIdentityComponents.Roles,
+  });
+}
+```
+
+**Important Notes:**
+- Component templates must include `<router-outlet></router-outlet>` for layouts
+- Use the second parameter as `true` for runtime replacement (refreshes route)
+- Runtime replacement clears component state and re-runs initialization logic
+
+**📚 Full Documentation:**  
+For detailed examples, layout replacement, and advanced scenarios:  
+[Component Replacement Guide](https://abp.io/docs/latest/framework/ui/angular/customization-user-interface)
+
 ---
 
 ## 🔒 4. Combined Full-Stack Practices
diff --git a/npm/ng-packs/packages/schematics/src/commands/ai-config/files/junie/.junie/guidelines.md b/npm/ng-packs/packages/schematics/src/commands/ai-config/files/junie/.junie/guidelines.md
index a150753322..32dfab0275 100644
--- a/npm/ng-packs/packages/schematics/src/commands/ai-config/files/junie/.junie/guidelines.md
+++ b/npm/ng-packs/packages/schematics/src/commands/ai-config/files/junie/.junie/guidelines.md
@@ -137,6 +137,36 @@ You write **clean, maintainable, and modular** code following **ABP, ASP.NET Cor
 - Provide services using `providedIn: 'root'`.  
 - Use the **`inject()` function** instead of constructor injection.
 
+### Component Replacement
+ABP Angular provides a powerful **component replacement** system via `ReplaceableComponentsService`:
+
+**Key Features:**
+- Replace ABP default components (Roles, Users, Tenants, etc.) with custom implementations
+- Replace layouts (Application, Account, Empty)
+- Replace UI elements (Logo, Routes, NavItems)
+
+**Basic Usage:**
+```typescript
+import { ReplaceableComponentsService } from '@abp/ng.core';
+import { eIdentityComponents } from '@abp/ng.identity';
+
+constructor(private replaceableComponents: ReplaceableComponentsService) {
+  this.replaceableComponents.add({
+    component: YourCustomComponent,
+    key: eIdentityComponents.Roles,
+  });
+}
+```
+
+**Important Notes:**
+- Component templates must include `<router-outlet></router-outlet>` for layouts
+- Use the second parameter as `true` for runtime replacement (refreshes route)
+- Runtime replacement clears component state and re-runs initialization logic
+
+**📚 Full Documentation:**  
+For detailed examples, layout replacement, and advanced scenarios:  
+[Component Replacement Guide](https://abp.io/docs/latest/framework/ui/angular/customization-user-interface)
+
 ---
 
 ## 🔒 4. Combined Full-Stack Practices
diff --git a/npm/ng-packs/packages/schematics/src/commands/ai-config/files/windsurf/.windsurf/rules/guidelines.md b/npm/ng-packs/packages/schematics/src/commands/ai-config/files/windsurf/.windsurf/rules/guidelines.md
index a150753322..32dfab0275 100644
--- a/npm/ng-packs/packages/schematics/src/commands/ai-config/files/windsurf/.windsurf/rules/guidelines.md
+++ b/npm/ng-packs/packages/schematics/src/commands/ai-config/files/windsurf/.windsurf/rules/guidelines.md
@@ -137,6 +137,36 @@ You write **clean, maintainable, and modular** code following **ABP, ASP.NET Cor
 - Provide services using `providedIn: 'root'`.  
 - Use the **`inject()` function** instead of constructor injection.
 
+### Component Replacement
+ABP Angular provides a powerful **component replacement** system via `ReplaceableComponentsService`:
+
+**Key Features:**
+- Replace ABP default components (Roles, Users, Tenants, etc.) with custom implementations
+- Replace layouts (Application, Account, Empty)
+- Replace UI elements (Logo, Routes, NavItems)
+
+**Basic Usage:**
+```typescript
+import { ReplaceableComponentsService } from '@abp/ng.core';
+import { eIdentityComponents } from '@abp/ng.identity';
+
+constructor(private replaceableComponents: ReplaceableComponentsService) {
+  this.replaceableComponents.add({
+    component: YourCustomComponent,
+    key: eIdentityComponents.Roles,
+  });
+}
+```
+
+**Important Notes:**
+- Component templates must include `<router-outlet></router-outlet>` for layouts
+- Use the second parameter as `true` for runtime replacement (refreshes route)
+- Runtime replacement clears component state and re-runs initialization logic
+
+**📚 Full Documentation:**  
+For detailed examples, layout replacement, and advanced scenarios:  
+[Component Replacement Guide](https://abp.io/docs/latest/framework/ui/angular/customization-user-interface)
+
 ---
 
 ## 🔒 4. Combined Full-Stack Practices