cloud-ide-academics 0.0.2 → 0.0.6

package/fesm2022/{cloud-ide-academics-cloud-ide-academics-BP1hZ-yx.mjs → cloud-ide-academics-cloud-ide-academics-DsKIXC7E.mjs}

@@ -9,11 +9,11 @@ import { Router, ActivatedRoute } from '@angular/router';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { of, forkJoin } from 'rxjs';
 import { switchMap, catchError, map } from 'rxjs/operators';
-import { CideInputComponent, CideTextareaComponent, CideEleButtonComponent, CideEleTabComponent, CideIconComponent, CideSelectComponent, ConfirmationService, NotificationService, CideEleDataGridComponent, CideEleDropdownComponent } from 'cloud-ide-element';
+import { CideInputComponent, CideTextareaComponent, CideEleButtonComponent, CideEleTabComponent, CideIconComponent, CideSelectComponent, CideFormFieldErrorComponent, ConfirmationService, NotificationService, CideEleDataGridComponent, CideEleDropdownComponent } from 'cloud-ide-element';
 import { HttpClient } from '@angular/common/http';
 import { generateStringFromObject, cidePath, hostManagerRoutesUrl, academicsRoutesUrl, generateObjectFromString } from 'cloud-ide-lms-model';
-import { ENTITY_SERVICE_TOKEN } from 'cloud-ide-shared';
-import { AppStateHelperService } from 'cloud-ide-layout';
+import { ENTITY_SERVICE_TOKEN, CideCoreGeneralMasterService } from 'cloud-ide-shared';
+import { AppStateHelperService, CideLytSharedWrapperComponent } from 'cloud-ide-layout';
 
 const academicsRoutes = [
     // Academic Year Management Routes
@@ -59,7 +59,7 @@ const academicsRoutes = [
     },
     {
         path: 'program-class-management',
-        loadComponent: () => import('./cloud-ide-academics-program-class-list.component-C6VyX4hH.mjs').then(c => c.ProgramClassListComponent),
+        loadComponent: () => import('./cloud-ide-academics-program-class-list.component-D7R-LeJt.mjs').then(c => c.ProgramClassListComponent),
         title: 'Program Class Management',
         canActivate: [authGuard],
         data: {
@@ -69,7 +69,7 @@ const academicsRoutes = [
     },
     {
         path: 'program-class-management/create',
-        loadComponent: () => import('./cloud-ide-academics-program-class-create.component-Ds8vN9sL.mjs').then(c => c.ProgramClassCreateComponent),
+        loadComponent: () => import('./cloud-ide-academics-program-class-create.component-Cn9SV5D4.mjs').then(c => c.ProgramClassCreateComponent),
         title: 'Create Program Class',
         canActivate: [authGuard],
         data: {
@@ -79,7 +79,7 @@ const academicsRoutes = [
     },
     {
         path: 'program-class-management/edit/:query',
-        loadComponent: () => import('./cloud-ide-academics-program-class-create.component-Ds8vN9sL.mjs').then(c => c.ProgramClassCreateComponent),
+        loadComponent: () => import('./cloud-ide-academics-program-class-create.component-Cn9SV5D4.mjs').then(c => c.ProgramClassCreateComponent),
         title: 'Edit Program Class',
         canActivate: [authGuard],
         data: {
@@ -89,7 +89,7 @@ const academicsRoutes = [
     },
     {
         path: 'program-class-management/view/:query',
-        loadComponent: () => import('./cloud-ide-academics-program-class-create.component-Ds8vN9sL.mjs').then(c => c.ProgramClassCreateComponent),
+        loadComponent: () => import('./cloud-ide-academics-program-class-create.component-Cn9SV5D4.mjs').then(c => c.ProgramClassCreateComponent),
         title: 'View Program Class',
         canActivate: [authGuard],
         data: {
@@ -99,7 +99,7 @@ const academicsRoutes = [
     },
     {
         path: 'program-term-management/create',
-        loadComponent: () => import('./cloud-ide-academics-class-program-term-create.component-D3PfbSMN.mjs').then(c => c.ClassProgramTermCreateComponent),
+        loadComponent: () => import('./cloud-ide-academics-class-program-term-create.component-BEqM62WC.mjs').then(c => c.ClassProgramTermCreateComponent),
         title: 'Create Class Program Term',
         canActivate: [authGuard],
         data: {
@@ -109,7 +109,7 @@ const academicsRoutes = [
     },
     {
         path: 'program-term-management/edit/:query',
-        loadComponent: () => import('./cloud-ide-academics-class-program-term-create.component-D3PfbSMN.mjs').then(c => c.ClassProgramTermCreateComponent),
+        loadComponent: () => import('./cloud-ide-academics-class-program-term-create.component-BEqM62WC.mjs').then(c => c.ClassProgramTermCreateComponent),
         title: 'Edit Class Program Term',
         canActivate: [authGuard],
         data: {
@@ -119,7 +119,7 @@ const academicsRoutes = [
     },
     {
         path: 'program-term-management/view/:query',
-        loadComponent: () => import('./cloud-ide-academics-class-program-term-create.component-D3PfbSMN.mjs').then(c => c.ClassProgramTermCreateComponent),
+        loadComponent: () => import('./cloud-ide-academics-class-program-term-create.component-BEqM62WC.mjs').then(c => c.ClassProgramTermCreateComponent),
         title: 'View Class Program Term',
         canActivate: [authGuard],
         data: {
@@ -129,7 +129,7 @@ const academicsRoutes = [
     },
     {
         path: 'program-term-management/:query',
-        loadComponent: () => import('./cloud-ide-academics-class-program-term-list.component-Cpbyavgd.mjs').then(c => c.ClassProgramTermListComponent),
+        loadComponent: () => import('./cloud-ide-academics-class-program-term-list.component-CaWAHMHN.mjs').then(c => c.ClassProgramTermListComponent),
         title: 'Class Program Term Management',
         canActivate: [authGuard],
         data: {
@@ -139,7 +139,7 @@ const academicsRoutes = [
     },
     {
         path: 'class-program-term/:query',
-        loadComponent: () => import('./cloud-ide-academics-program-term-section-list.component-xVeeeGDV.mjs').then(c => c.ProgramTermSectionListComponent),
+        loadComponent: () => import('./cloud-ide-academics-program-term-section-list.component-Q2nO1n4a.mjs').then(c => c.ProgramTermSectionListComponent),
         title: 'Program Term Section Management',
         canActivate: [authGuard],
         data: {
@@ -149,7 +149,7 @@ const academicsRoutes = [
     },
     {
         path: 'class-program-term/create',
-        loadComponent: () => import('./cloud-ide-academics-program-term-section-create.component-Dg9Pjwj5.mjs').then(c => c.ProgramTermSectionCreateComponent),
+        loadComponent: () => import('./cloud-ide-academics-program-term-section-create.component-DQH-DeS0.mjs').then(c => c.ProgramTermSectionCreateComponent),
         title: 'Create Program Term Section',
         canActivate: [authGuard],
         data: {
@@ -159,7 +159,7 @@ const academicsRoutes = [
     },
     {
         path: 'class-program-term/edit/:query',
-        loadComponent: () => import('./cloud-ide-academics-program-term-section-create.component-Dg9Pjwj5.mjs').then(c => c.ProgramTermSectionCreateComponent),
+        loadComponent: () => import('./cloud-ide-academics-program-term-section-create.component-DQH-DeS0.mjs').then(c => c.ProgramTermSectionCreateComponent),
         title: 'Edit Program Term Section',
         canActivate: [authGuard],
         data: {
@@ -169,7 +169,7 @@ const academicsRoutes = [
     },
     {
         path: 'class-program-term/view/:query',
-        loadComponent: () => import('./cloud-ide-academics-program-term-section-create.component-Dg9Pjwj5.mjs').then(c => c.ProgramTermSectionCreateComponent),
+        loadComponent: () => import('./cloud-ide-academics-program-term-section-create.component-DQH-DeS0.mjs').then(c => c.ProgramTermSectionCreateComponent),
         title: 'View Program Term Section',
         canActivate: [authGuard],
         data: {
@@ -512,7 +512,6 @@ class AcademicYearCreateComponent {
     academicYearForm;
     activeTab = signal('basic', ...(ngDevMode ? [{ debugName: "activeTab" }] : []));
     loading = signal(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
-    error = signal(null, ...(ngDevMode ? [{ debugName: "error" }] : []));
     // Academic year information from route
     academicYearId = signal('', ...(ngDevMode ? [{ debugName: "academicYearId" }] : []));
     isEditMode = signal(false, ...(ngDevMode ? [{ debugName: "isEditMode" }] : []));
@@ -583,7 +582,6 @@ class AcademicYearCreateComponent {
      */
     loadAcademicYearData(academicYearId) {
         this.loading.set(true);
-        this.error.set(null);
         const payload = {
             acayr_id: academicYearId
         };
@@ -598,13 +596,11 @@ class AcademicYearCreateComponent {
                 }
                 else {
                     console.error('❌ Failed to load academic year data');
-                    this.error.set('Failed to load academic year data');
                     this.loading.set(false);
                 }
             },
             error: (error) => {
                 console.error('❌ Error loading academic year data:', error);
-                this.error.set('Error loading academic year data');
                 this.loading.set(false);
             }
         });
@@ -687,8 +683,6 @@ class AcademicYearCreateComponent {
         this.activeTab.set(tab.id);
     }
     onSubmit() {
-        // Clear any previous errors
-        this.error.set(null);
         if (this.academicYearForm.valid && this.validateMappings()) {
             this.loading.set(true);
             const formData = this.academicYearForm.value;
@@ -710,7 +704,6 @@ class AcademicYearCreateComponent {
                         // Check if there were any mapping errors
                         if (response.mappingErrors && response.mappingErrors.length > 0) {
                             console.warn('⚠️ Some mappings failed:', response.mappingErrors);
-                            this.error.set('Academic year saved but some mappings failed. Please check the mappings.');
                         }
                         else {
                             this.goBackToAcademicYearList();
@@ -718,13 +711,11 @@ class AcademicYearCreateComponent {
                     }
                     else {
                         console.error('❌ Failed to save academic year');
-                        this.error.set(response?.message || 'Failed to save academic year');
                     }
                     this.loading.set(false);
                 },
                 error: (error) => {
                     console.error('❌ Error saving academic year:', error);
-                    this.error.set('Error saving academic year');
                     this.loading.set(false);
                 }
             });
@@ -856,7 +847,6 @@ class AcademicYearCreateComponent {
             // Check required fields
             if (!mapping.get('acayrmp_entity_id_syen')?.value) {
                 console.warn(`Mapping ${i + 1} is missing entity selection`);
-                this.error.set(`Mapping ${i + 1} requires an entity selection`);
                 return false;
             }
             // Check for duplicate entity selections
@@ -864,7 +854,6 @@ class AcademicYearCreateComponent {
             const duplicateIndex = this.findDuplicateEntitySelection(currentEntityId, i);
             if (duplicateIndex !== -1) {
                 console.warn(`Mapping ${i + 1} has duplicate entity selection with mapping ${duplicateIndex + 1}`);
-                this.error.set(`Mapping ${i + 1} has duplicate entity selection with mapping ${duplicateIndex + 1}`);
                 return false;
             }
         }
@@ -1024,7 +1013,6 @@ class AcademicYearCreateComponent {
         // Reset all signals to their initial state
         this.activeTab.set('basic');
         this.loading.set(false);
-        this.error.set(null);
         this.academicYearId.set('');
         this.isEditMode.set(false);
         this.originalMappings.set([]);
@@ -1059,7 +1047,7 @@ class AcademicYearCreateComponent {
         return forkJoin(deleteObservables);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AcademicYearCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: AcademicYearCreateComponent, isStandalone: true, selector: "cide-core-academic-year-create", ngImport: i0, template: "<!-- \r\n  ACADEMIC YEAR MASTER FORM\r\n  \r\n  Enterprise-Level Styling with Tailwind CSS\r\n  Features: Responsive grids, proper typography, enhanced user experience\r\n-->\r\n\r\n<div class=\"tw-w-full tw-h-full\">\r\n  <form class=\"tw-w-full tw-table tw-h-full tw-bg-transparent\" [formGroup]=\"academicYearForm\" [class.tw-opacity-60]=\"loading()\"\r\n    (ngSubmit)=\"onSubmit()\">\r\n\r\n    <!-- Simple Header Section -->\r\n    <div class=\"tw-table-row tw-w-full tw-h-0\">\r\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\r\n        <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\r\n          \r\n          <!-- Title -->\r\n          <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n            <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">school</cide-ele-icon>\r\n            <h5 class=\"tw-text-base tw-font-medium tw-text-gray-900 tw-m-0\">\r\n              {{ isEditMode() ? 'Edit Academic Year' : 'Create Academic Year' }}\r\n            </h5>\r\n          </div>\r\n\r\n          <!-- Actions -->\r\n          <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\r\n            <!-- Back button or other actions can be added here if needed -->\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- Tab Navigation -->\r\n    <div class=\"tw-table-row tw-h-0\">\r\n      <div class=\"tw-table-cell tw-w-full tw-px-2 tw-py-0\">\r\n        <cide-ele-tab [tabs]=\"academicYearTabs()\" [activeTabId]=\"activeTab()\" size=\"md\" variant=\"default\"\r\n          (tabChange)=\"onTabChange($event)\">\r\n        </cide-ele-tab>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- Tab Content -->\r\n    <div class=\"tw-table-row\">\r\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-6\">\r\n        <div class=\"tw-transition-opacity tw-duration-300\" [class.tw-opacity-60]=\"loading()\">\r\n          @switch (activeTab()) {\r\n\r\n                  @case ('basic') {\r\n           <!-- Basic Academic Year Information -->\r\n           <div class=\"tw-space-y-6\">\r\n             <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n               <cide-ele-input label=\"Academic Year Code *\" formControlName=\"acayr_code\"\r\n                 placeholder=\"e.g., AY2024-25\" size=\"md\" leadingIcon=\"code\">\r\n               </cide-ele-input>\r\n\r\n               <cide-ele-input label=\"Academic Year Name *\" formControlName=\"acayr_name\"\r\n                 placeholder=\"e.g., Academic Year 2024-2025\" size=\"md\" leadingIcon=\"school\">\r\n               </cide-ele-input>\r\n             </div>\r\n\r\n             <div>\r\n               <cide-ele-textarea label=\"Description\" formControlName=\"acayr_description\"\r\n                 placeholder=\"Enter detailed description of the academic year...\"\r\n                 rows=\"3\" size=\"md\">\r\n               </cide-ele-textarea>\r\n             </div>\r\n\r\n             <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n               <cide-ele-input label=\"From Date *\" formControlName=\"acayr_from_date\" type=\"date\" size=\"md\"\r\n                 leadingIcon=\"calendar_today\" id=\"acayr_from_date\">\r\n               </cide-ele-input>\r\n\r\n               <cide-ele-input label=\"To Date *\" formControlName=\"acayr_to_date\" type=\"date\" size=\"md\"\r\n                 leadingIcon=\"calendar_today\" id=\"acayr_to_date\">\r\n               </cide-ele-input>\r\n             </div>\r\n\r\n             <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-6\">\r\n               <div class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\r\n                 <cide-ele-input formControlName=\"acayr_isactive\" type=\"checkbox\" size=\"md\">\r\n                 </cide-ele-input>\r\n                 <div class=\"tw-flex tw-flex-col\">\r\n                   <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Active</span>\r\n                   <span class=\"tw-text-xs tw-text-gray-500\">Enable/disable this academic year</span>\r\n                 </div>\r\n               </div>\r\n\r\n               <div class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\r\n                 <cide-ele-input formControlName=\"acayr_iscurrent\" type=\"checkbox\" size=\"md\">\r\n                 </cide-ele-input>\r\n                 <div class=\"tw-flex tw-flex-col\">\r\n                   <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Current</span>\r\n                   <span class=\"tw-text-xs tw-text-gray-500\">Mark as current academic year</span>\r\n                 </div>\r\n               </div>\r\n\r\n               <div class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\r\n                 <cide-ele-input formControlName=\"acayr_islocked\" type=\"checkbox\" size=\"md\">\r\n                 </cide-ele-input>\r\n                 <div class=\"tw-flex tw-flex-col\">\r\n                   <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Locked</span>\r\n                   <span class=\"tw-text-xs tw-text-gray-500\">Prevent modifications</span>\r\n                 </div>\r\n               </div>\r\n             </div>\r\n           </div>\r\n           }\r\n\r\n           @case ('mapping') {\r\n           <!-- Academic Year Mapping Configuration -->\r\n           <div class=\"tw-bg-gradient-to-r tw-from-blue-50 tw-to-indigo-50 tw-border tw-border-blue-200 tw-rounded-xl tw-p-6\">\r\n             <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-6\">\r\n               <div class=\"tw-flex tw-items-center tw-gap-3\">\r\n                 <div class=\"tw-bg-blue-100 tw-p-2 tw-rounded-lg\">\r\n                   <cide-ele-icon class=\"tw-text-blue-600 tw-w-6 tw-h-6\">link</cide-ele-icon>\r\n                 </div>\r\n                 <div>\r\n                   <h6 class=\"tw-text-lg tw-font-semibold tw-text-blue-900 tw-m-0\">Academic Year Mapping</h6>\r\n                   <p class=\"tw-text-sm tw-text-blue-600 tw-m-0\">Configure entity mappings for this academic year</p>\r\n                 </div>\r\n               </div>\r\n               <button cideEleButton type=\"button\" variant=\"primary\" size=\"md\" leftIcon=\"add\"\r\n                 (click)=\"addAcademicYearMapping()\"\r\n                 class=\"tw-shadow-md hover:tw-shadow-lg tw-transition-shadow\">\r\n                 Add New Mapping\r\n               </button>\r\n             </div>\r\n             \r\n             @if (academicYearMappingsArray.length === 0) {\r\n             <div class=\"tw-text-center tw-py-12 tw-text-gray-500\">\r\n               <div class=\"tw-bg-white tw-p-4 tw-rounded-full tw-w-16 tw-h-16 tw-mx-auto tw-mb-4 tw-flex tw-items-center tw-justify-center\">\r\n                 <cide-ele-icon class=\"tw-w-8 tw-h-8 tw-text-gray-400\">link</cide-ele-icon>\r\n               </div>\r\n               <h6 class=\"tw-text-base tw-font-medium tw-text-gray-600 tw-mb-2\">No Mappings Yet</h6>\r\n               <p class=\"tw-text-sm tw-text-gray-500\">Click \"Add New Mapping\" to start configuring entity relationships for this academic year.</p>\r\n             </div>\r\n             } @else {\r\n             <div class=\"tw-space-y-4\" formArrayName=\"acayr_academic_year_mappings\">\r\n               @for (mapping of academicYearMappingsArray.controls; track $index) {\r\n               <div class=\"tw-bg-white tw-rounded-xl tw-border tw-border-gray-200 tw-shadow-sm hover:tw-shadow-md tw-transition-shadow tw-p-6\">\r\n                 <div class=\"tw-flex tw-items-start tw-justify-between tw-mb-4\">\r\n                   <div class=\"tw-flex tw-items-center tw-gap-2\">\r\n                     <div class=\"tw-bg-blue-100 tw-p-2 tw-rounded-lg\">\r\n                       <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">settings</cide-ele-icon>\r\n                     </div>\r\n                     <h6 class=\"tw-text-sm tw-font-semibold tw-text-gray-900\">Mapping #{{ $index + 1 }}</h6>\r\n                   </div>\r\n                   <button cideEleButton type=\"button\" variant=\"danger\" size=\"sm\" leftIcon=\"delete\"\r\n                     (click)=\"removeAcademicYearMapping($index)\"\r\n                     class=\"tw-opacity-80 hover:tw-opacity-100 tw-transition-opacity\">\r\n                     Remove\r\n                   </button>\r\n                 </div>\r\n                 \r\n                 <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-2 tw-gap-4\" [formGroupName]=\"$index\">\r\n                   <!-- Hidden Academic Year ID field (internal use only) -->\r\n                   <input type=\"hidden\" formControlName=\"acayrmp_academic_year_id_acayr\">\r\n                   \r\n                   <!-- Entity Selection -->\r\n                   <div class=\"tw-space-y-2\">\r\n                     <label class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Select Entity *</label>\r\n                     <cide-ele-select \r\n                       [options]=\"entityOptions()\"\r\n                       formControlName=\"acayrmp_entity_id_syen\"\r\n                       placeholder=\"Choose entity for this mapping\" \r\n                       size=\"md\"\r\n                       valueKey=\"_id\"\r\n                       labelKey=\"syen_name\"\r\n                       class=\"tw-min-w-full\"\r\n                       (change)=\"onMappingEntityChange($event, $index)\">\r\n                     </cide-ele-select>\r\n                   </div>\r\n                   \r\n                   <!-- Status Controls -->\r\n                   <div class=\"tw-space-y-2\">\r\n                     <div class=\"tw-grid tw-grid-cols-1 tw-gap-3\">\r\n                       <div class=\"tw-flex tw-items-center tw-gap-2 tw-p-3 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\r\n                         <cide-ele-input \r\n                           formControlName=\"acayrmp_islocked\" \r\n                           type=\"checkbox\" \r\n                           size=\"sm\">\r\n                         </cide-ele-input>\r\n                         <div class=\"tw-flex tw-flex-col\">\r\n                           <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Locked</span>\r\n                           <span class=\"tw-text-xs tw-text-gray-500\">Prevent modifications</span>\r\n                         </div>\r\n                       </div>\r\n                       \r\n                       <div class=\"tw-flex tw-items-center tw-gap-2 tw-p-3 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\r\n                         <cide-ele-input \r\n                           formControlName=\"acayrmp_iscurrent\" \r\n                           type=\"checkbox\" \r\n                           size=\"sm\">\r\n                         </cide-ele-input>\r\n                         <div class=\"tw-flex tw-flex-col\">\r\n                           <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Current</span>\r\n                           <span class=\"tw-text-xs tw-text-gray-500\">Mark as current mapping</span>\r\n                         </div>\r\n                       </div>\r\n                     </div>\r\n                   </div>\r\n                 </div>\r\n               </div>\r\n               }\r\n             </div>\r\n             }\r\n\r\n             <!-- Mapping Validation Messages -->\r\n             @if (academicYearMappingsArray.length > 0 && !isMappingsArrayValid()) {\r\n             <div class=\"tw-mt-4 tw-p-4 tw-bg-yellow-50 tw-border tw-border-yellow-200 tw-rounded-lg\">\r\n               <div class=\"tw-flex tw-items-center tw-gap-2\">\r\n                 <cide-ele-icon variant=\"warning\" size=\"sm\">warning</cide-ele-icon>\r\n                 <span class=\"tw-text-sm tw-font-medium tw-text-yellow-800\">\r\n                   Please ensure all mappings have required fields filled in.\r\n                 </span>\r\n               </div>\r\n             </div>\r\n             }\r\n           </div>\r\n           }\r\n           }\r\n         </div>\r\n\r\n         <!-- Error Display -->\r\n         @if (error()) {\r\n         <div class=\"tw-mt-6 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-lg\">\r\n           <div class=\"tw-flex tw-items-center tw-gap-2\">\r\n             <cide-ele-icon variant=\"red\" size=\"sm\">error</cide-ele-icon>\r\n             <span class=\"tw-text-sm tw-font-medium tw-text-red-800\">{{ error() }}</span>\r\n           </div>\r\n         </div>\r\n         }\r\n       </div>\r\n     </div>\r\n\r\n          <!-- Form Actions -->\r\n      <div class=\"tw-table-row tw-h-0\">\r\n        <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-2 tw-bg-gray-50 tw-border-t tw-border-gray-200\">\r\n          <div class=\"tw-flex tw-justify-end tw-gap-4\">\r\n            <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"resetForm()\" leftIcon=\"refresh\"\r\n              [disabled]=\"loading()\">\r\n              Reset Form\r\n            </button>\r\n\r\n            <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"cancelForm()\" leftIcon=\"close\"\r\n              [disabled]=\"loading()\">\r\n              Cancel\r\n            </button>\r\n\r\n            <button cideEleButton type=\"submit\" variant=\"primary\" [disabled]=\"loading() || academicYearForm.invalid\"\r\n              [loading]=\"loading()\" leftIcon=\"save\">\r\n              {{ isEditMode() ? 'Update Academic Year' : 'Create Academic Year' }}\r\n            </button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </form>\r\n  </div>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton]", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideEleTabComponent, selector: "cide-ele-tab", inputs: ["tabs", "activeTabId", "size", "variant", "fullWidth", "disabled"], outputs: ["tabChange"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey"], outputs: ["ngModelChange", "change", "searchChange"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: AcademicYearCreateComponent, isStandalone: true, selector: "cide-core-academic-year-create", ngImport: i0, template: "<!-- \n  ACADEMIC YEAR MASTER FORM\n  \n  Enterprise-Level Styling with Tailwind CSS\n  Features: Responsive grids, proper typography, enhanced user experience\n-->\n\n<div class=\"tw-w-full tw-h-full\">\n  <form class=\"tw-w-full tw-table tw-h-full tw-bg-transparent\" [formGroup]=\"academicYearForm\" [class.tw-opacity-60]=\"loading()\"\n    (ngSubmit)=\"onSubmit()\">\n\n    <!-- Simple Header Section -->\n    <div class=\"tw-table-row tw-w-full tw-h-0\">\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n        <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\n          \n          <!-- Title -->\n          <div class=\"tw-flex tw-items-center tw-space-x-2\">\n            <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">school</cide-ele-icon>\n            <h5 class=\"tw-text-base tw-font-medium tw-text-gray-900 tw-m-0\">\n              {{ isEditMode() ? 'Edit Academic Year' : 'Create Academic Year' }}\n            </h5>\n          </div>\n\n          <!-- Actions -->\n          <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\n            <!-- Back button or other actions can be added here if needed -->\n          </div>\n        </div>\n      </div>\n    </div>\n\n    <!-- Tab Navigation -->\n    <div class=\"tw-table-row tw-h-0\">\n      <div class=\"tw-table-cell tw-w-full tw-px-2 tw-py-0\">\n        <cide-ele-tab [tabs]=\"academicYearTabs()\" [activeTabId]=\"activeTab()\" size=\"md\" variant=\"default\"\n          (tabChange)=\"onTabChange($event)\">\n        </cide-ele-tab>\n      </div>\n    </div>\n\n    <!-- Tab Content -->\n    <div class=\"tw-table-row\">\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-6\">\n        <div class=\"tw-transition-opacity tw-duration-300\" [class.tw-opacity-60]=\"loading()\">\n          @switch (activeTab()) {\n\n                  @case ('basic') {\n           <!-- Basic Academic Year Information -->\n           <div class=\"tw-space-y-6\">\n             <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\n               <cide-ele-input label=\"Academic Year Code *\" formControlName=\"acayr_code\"\n                 placeholder=\"e.g., AY2024-25\" size=\"md\" leadingIcon=\"code\">\n               </cide-ele-input>\n\n               <cide-ele-input label=\"Academic Year Name *\" formControlName=\"acayr_name\"\n                 placeholder=\"e.g., Academic Year 2024-2025\" size=\"md\" leadingIcon=\"school\">\n               </cide-ele-input>\n             </div>\n\n             <div>\n               <cide-ele-textarea label=\"Description\" formControlName=\"acayr_description\"\n                 placeholder=\"Enter detailed description of the academic year...\"\n                 rows=\"3\" size=\"md\">\n               </cide-ele-textarea>\n             </div>\n\n             <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\n               <cide-ele-input label=\"From Date *\" formControlName=\"acayr_from_date\" type=\"date\" size=\"md\"\n                 leadingIcon=\"calendar_today\" id=\"acayr_from_date\">\n               </cide-ele-input>\n\n               <cide-ele-input label=\"To Date *\" formControlName=\"acayr_to_date\" type=\"date\" size=\"md\"\n                 leadingIcon=\"calendar_today\" id=\"acayr_to_date\">\n               </cide-ele-input>\n             </div>\n\n             <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-6\">\n               <div class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\n                 <cide-ele-input formControlName=\"acayr_isactive\" type=\"checkbox\" size=\"md\">\n                 </cide-ele-input>\n                 <div class=\"tw-flex tw-flex-col\">\n                   <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Active</span>\n                   <span class=\"tw-text-xs tw-text-gray-500\">Enable/disable this academic year</span>\n                 </div>\n               </div>\n\n               <div class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\n                 <cide-ele-input formControlName=\"acayr_iscurrent\" type=\"checkbox\" size=\"md\">\n                 </cide-ele-input>\n                 <div class=\"tw-flex tw-flex-col\">\n                   <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Current</span>\n                   <span class=\"tw-text-xs tw-text-gray-500\">Mark as current academic year</span>\n                 </div>\n               </div>\n\n               <div class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\n                 <cide-ele-input formControlName=\"acayr_islocked\" type=\"checkbox\" size=\"md\">\n                 </cide-ele-input>\n                 <div class=\"tw-flex tw-flex-col\">\n                   <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Locked</span>\n                   <span class=\"tw-text-xs tw-text-gray-500\">Prevent modifications</span>\n                 </div>\n               </div>\n             </div>\n           </div>\n           }\n\n           @case ('mapping') {\n           <!-- Academic Year Mapping Configuration -->\n           <div class=\"tw-bg-gradient-to-r tw-from-blue-50 tw-to-indigo-50 tw-border tw-border-blue-200 tw-rounded-xl tw-p-6\">\n             <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-6\">\n               <div class=\"tw-flex tw-items-center tw-gap-3\">\n                 <div class=\"tw-bg-blue-100 tw-p-2 tw-rounded-lg\">\n                   <cide-ele-icon class=\"tw-text-blue-600 tw-w-6 tw-h-6\">link</cide-ele-icon>\n                 </div>\n                 <div>\n                   <h6 class=\"tw-text-lg tw-font-semibold tw-text-blue-900 tw-m-0\">Academic Year Mapping</h6>\n                   <p class=\"tw-text-sm tw-text-blue-600 tw-m-0\">Configure entity mappings for this academic year</p>\n                 </div>\n               </div>\n               <button cideEleButton type=\"button\" variant=\"primary\" size=\"md\" leftIcon=\"add\"\n                 (click)=\"addAcademicYearMapping()\"\n                 class=\"tw-shadow-md hover:tw-shadow-lg tw-transition-shadow\">\n                 Add New Mapping\n               </button>\n             </div>\n             \n             @if (academicYearMappingsArray.length === 0) {\n             <div class=\"tw-text-center tw-py-12 tw-text-gray-500\">\n               <div class=\"tw-bg-white tw-p-4 tw-rounded-full tw-w-16 tw-h-16 tw-mx-auto tw-mb-4 tw-flex tw-items-center tw-justify-center\">\n                 <cide-ele-icon class=\"tw-w-8 tw-h-8 tw-text-gray-400\">link</cide-ele-icon>\n               </div>\n               <h6 class=\"tw-text-base tw-font-medium tw-text-gray-600 tw-mb-2\">No Mappings Yet</h6>\n               <p class=\"tw-text-sm tw-text-gray-500\">Click \"Add New Mapping\" to start configuring entity relationships for this academic year.</p>\n             </div>\n             } @else {\n             <div class=\"tw-space-y-4\" formArrayName=\"acayr_academic_year_mappings\">\n               @for (mapping of academicYearMappingsArray.controls; track $index) {\n               <div class=\"tw-bg-white tw-rounded-xl tw-border tw-border-gray-200 tw-shadow-sm hover:tw-shadow-md tw-transition-shadow tw-p-6\">\n                 <div class=\"tw-flex tw-items-start tw-justify-between tw-mb-4\">\n                   <div class=\"tw-flex tw-items-center tw-gap-2\">\n                     <div class=\"tw-bg-blue-100 tw-p-2 tw-rounded-lg\">\n                       <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">settings</cide-ele-icon>\n                     </div>\n                     <h6 class=\"tw-text-sm tw-font-semibold tw-text-gray-900\">Mapping #{{ $index + 1 }}</h6>\n                   </div>\n                   <button cideEleButton type=\"button\" variant=\"danger\" size=\"sm\" leftIcon=\"delete\"\n                     (click)=\"removeAcademicYearMapping($index)\"\n                     class=\"tw-opacity-80 hover:tw-opacity-100 tw-transition-opacity\">\n                     Remove\n                   </button>\n                 </div>\n                 \n                 <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-2 tw-gap-4\" [formGroupName]=\"$index\">\n                   <!-- Hidden Academic Year ID field (internal use only) -->\n                   <input type=\"hidden\" formControlName=\"acayrmp_academic_year_id_acayr\">\n                   \n                   <!-- Entity Selection -->\n                   <div class=\"tw-space-y-2\">\n                     <label class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Select Entity *</label>\n                     <cide-ele-select \n                       [options]=\"entityOptions()\"\n                       formControlName=\"acayrmp_entity_id_syen\"\n                       placeholder=\"Choose entity for this mapping\" \n                       size=\"md\"\n                       valueKey=\"_id\"\n                       labelKey=\"syen_name\"\n                       class=\"tw-min-w-full\"\n                       (change)=\"onMappingEntityChange($event, $index)\">\n                     </cide-ele-select>\n                   </div>\n                   \n                   <!-- Status Controls -->\n                   <div class=\"tw-space-y-2\">\n                     <div class=\"tw-grid tw-grid-cols-1 tw-gap-3\">\n                       <div class=\"tw-flex tw-items-center tw-gap-2 tw-p-3 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\n                         <cide-ele-input \n                           formControlName=\"acayrmp_islocked\" \n                           type=\"checkbox\" \n                           size=\"sm\">\n                         </cide-ele-input>\n                         <div class=\"tw-flex tw-flex-col\">\n                           <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Locked</span>\n                           <span class=\"tw-text-xs tw-text-gray-500\">Prevent modifications</span>\n                         </div>\n                       </div>\n                       \n                       <div class=\"tw-flex tw-items-center tw-gap-2 tw-p-3 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\n                         <cide-ele-input \n                           formControlName=\"acayrmp_iscurrent\" \n                           type=\"checkbox\" \n                           size=\"sm\">\n                         </cide-ele-input>\n                         <div class=\"tw-flex tw-flex-col\">\n                           <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Current</span>\n                           <span class=\"tw-text-xs tw-text-gray-500\">Mark as current mapping</span>\n                         </div>\n                       </div>\n                     </div>\n                   </div>\n                 </div>\n               </div>\n               }\n             </div>\n             }\n\n             <!-- Mapping Validation Messages -->\n             @if (academicYearMappingsArray.length > 0 && !isMappingsArrayValid()) {\n             <div class=\"tw-mt-4 tw-p-4 tw-bg-yellow-50 tw-border tw-border-yellow-200 tw-rounded-lg\">\n               <div class=\"tw-flex tw-items-center tw-gap-2\">\n                 <cide-ele-icon variant=\"warning\" size=\"sm\">warning</cide-ele-icon>\n                 <span class=\"tw-text-sm tw-font-medium tw-text-yellow-800\">\n                   Please ensure all mappings have required fields filled in.\n                 </span>\n               </div>\n             </div>\n             }\n           </div>\n           }\n           }\n         </div>\n      </div>\n     </div>\n\n          <!-- Form Actions -->\n      <div class=\"tw-table-row tw-h-0\">\n        <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-2 tw-bg-gray-50 tw-border-t tw-border-gray-200\">\n          <div class=\"tw-flex tw-justify-between tw-items-center tw-gap-4\">\n            <!-- Form Validation Errors -->\n            <cide-form-field-error [formGroup]=\"academicYearForm\"></cide-form-field-error>\n            \n            <!-- Action Buttons -->\n            <div class=\"tw-flex tw-justify-end tw-gap-4\">\n            <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"resetForm()\" leftIcon=\"refresh\"\n              [disabled]=\"loading()\">\n              Reset Form\n            </button>\n\n            <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"cancelForm()\" leftIcon=\"close\"\n              [disabled]=\"loading()\">\n              Cancel\n            </button>\n\n            <button cideEleButton type=\"submit\" variant=\"primary\" [disabled]=\"loading() || academicYearForm.invalid\"\n              [loading]=\"loading()\" leftIcon=\"save\">\n              {{ isEditMode() ? 'Update Academic Year' : 'Create Academic Year' }}\n            </button>\n          </div>\n          </div>\n        </div>\n      </div>\n    </form>\n  </div>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideEleTabComponent, selector: "cide-ele-tab", inputs: ["tabs", "activeTabId", "size", "variant", "fullWidth", "disabled"], outputs: ["tabChange"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey"], outputs: ["ngModelChange", "change", "searchChange"] }, { kind: "component", type: CideFormFieldErrorComponent, selector: "cide-form-field-error", inputs: ["control", "formGroup", "fieldName", "customMessages"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AcademicYearCreateComponent, decorators: [{
             type: Component,
@@ -1071,8 +1059,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
                         CideEleButtonComponent,
                         CideEleTabComponent,
                         CideIconComponent,
-                        CideSelectComponent
-                    ], template: "<!-- \r\n  ACADEMIC YEAR MASTER FORM\r\n  \r\n  Enterprise-Level Styling with Tailwind CSS\r\n  Features: Responsive grids, proper typography, enhanced user experience\r\n-->\r\n\r\n<div class=\"tw-w-full tw-h-full\">\r\n  <form class=\"tw-w-full tw-table tw-h-full tw-bg-transparent\" [formGroup]=\"academicYearForm\" [class.tw-opacity-60]=\"loading()\"\r\n    (ngSubmit)=\"onSubmit()\">\r\n\r\n    <!-- Simple Header Section -->\r\n    <div class=\"tw-table-row tw-w-full tw-h-0\">\r\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\r\n        <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\r\n          \r\n          <!-- Title -->\r\n          <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n            <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">school</cide-ele-icon>\r\n            <h5 class=\"tw-text-base tw-font-medium tw-text-gray-900 tw-m-0\">\r\n              {{ isEditMode() ? 'Edit Academic Year' : 'Create Academic Year' }}\r\n            </h5>\r\n          </div>\r\n\r\n          <!-- Actions -->\r\n          <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\r\n            <!-- Back button or other actions can be added here if needed -->\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- Tab Navigation -->\r\n    <div class=\"tw-table-row tw-h-0\">\r\n      <div class=\"tw-table-cell tw-w-full tw-px-2 tw-py-0\">\r\n        <cide-ele-tab [tabs]=\"academicYearTabs()\" [activeTabId]=\"activeTab()\" size=\"md\" variant=\"default\"\r\n          (tabChange)=\"onTabChange($event)\">\r\n        </cide-ele-tab>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- Tab Content -->\r\n    <div class=\"tw-table-row\">\r\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-6\">\r\n        <div class=\"tw-transition-opacity tw-duration-300\" [class.tw-opacity-60]=\"loading()\">\r\n          @switch (activeTab()) {\r\n\r\n                  @case ('basic') {\r\n           <!-- Basic Academic Year Information -->\r\n           <div class=\"tw-space-y-6\">\r\n             <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n               <cide-ele-input label=\"Academic Year Code *\" formControlName=\"acayr_code\"\r\n                 placeholder=\"e.g., AY2024-25\" size=\"md\" leadingIcon=\"code\">\r\n               </cide-ele-input>\r\n\r\n               <cide-ele-input label=\"Academic Year Name *\" formControlName=\"acayr_name\"\r\n                 placeholder=\"e.g., Academic Year 2024-2025\" size=\"md\" leadingIcon=\"school\">\r\n               </cide-ele-input>\r\n             </div>\r\n\r\n             <div>\r\n               <cide-ele-textarea label=\"Description\" formControlName=\"acayr_description\"\r\n                 placeholder=\"Enter detailed description of the academic year...\"\r\n                 rows=\"3\" size=\"md\">\r\n               </cide-ele-textarea>\r\n             </div>\r\n\r\n             <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n               <cide-ele-input label=\"From Date *\" formControlName=\"acayr_from_date\" type=\"date\" size=\"md\"\r\n                 leadingIcon=\"calendar_today\" id=\"acayr_from_date\">\r\n               </cide-ele-input>\r\n\r\n               <cide-ele-input label=\"To Date *\" formControlName=\"acayr_to_date\" type=\"date\" size=\"md\"\r\n                 leadingIcon=\"calendar_today\" id=\"acayr_to_date\">\r\n               </cide-ele-input>\r\n             </div>\r\n\r\n             <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-6\">\r\n               <div class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\r\n                 <cide-ele-input formControlName=\"acayr_isactive\" type=\"checkbox\" size=\"md\">\r\n                 </cide-ele-input>\r\n                 <div class=\"tw-flex tw-flex-col\">\r\n                   <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Active</span>\r\n                   <span class=\"tw-text-xs tw-text-gray-500\">Enable/disable this academic year</span>\r\n                 </div>\r\n               </div>\r\n\r\n               <div class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\r\n                 <cide-ele-input formControlName=\"acayr_iscurrent\" type=\"checkbox\" size=\"md\">\r\n                 </cide-ele-input>\r\n                 <div class=\"tw-flex tw-flex-col\">\r\n                   <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Current</span>\r\n                   <span class=\"tw-text-xs tw-text-gray-500\">Mark as current academic year</span>\r\n                 </div>\r\n               </div>\r\n\r\n               <div class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\r\n                 <cide-ele-input formControlName=\"acayr_islocked\" type=\"checkbox\" size=\"md\">\r\n                 </cide-ele-input>\r\n                 <div class=\"tw-flex tw-flex-col\">\r\n                   <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Locked</span>\r\n                   <span class=\"tw-text-xs tw-text-gray-500\">Prevent modifications</span>\r\n                 </div>\r\n               </div>\r\n             </div>\r\n           </div>\r\n           }\r\n\r\n           @case ('mapping') {\r\n           <!-- Academic Year Mapping Configuration -->\r\n           <div class=\"tw-bg-gradient-to-r tw-from-blue-50 tw-to-indigo-50 tw-border tw-border-blue-200 tw-rounded-xl tw-p-6\">\r\n             <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-6\">\r\n               <div class=\"tw-flex tw-items-center tw-gap-3\">\r\n                 <div class=\"tw-bg-blue-100 tw-p-2 tw-rounded-lg\">\r\n                   <cide-ele-icon class=\"tw-text-blue-600 tw-w-6 tw-h-6\">link</cide-ele-icon>\r\n                 </div>\r\n                 <div>\r\n                   <h6 class=\"tw-text-lg tw-font-semibold tw-text-blue-900 tw-m-0\">Academic Year Mapping</h6>\r\n                   <p class=\"tw-text-sm tw-text-blue-600 tw-m-0\">Configure entity mappings for this academic year</p>\r\n                 </div>\r\n               </div>\r\n               <button cideEleButton type=\"button\" variant=\"primary\" size=\"md\" leftIcon=\"add\"\r\n                 (click)=\"addAcademicYearMapping()\"\r\n                 class=\"tw-shadow-md hover:tw-shadow-lg tw-transition-shadow\">\r\n                 Add New Mapping\r\n               </button>\r\n             </div>\r\n             \r\n             @if (academicYearMappingsArray.length === 0) {\r\n             <div class=\"tw-text-center tw-py-12 tw-text-gray-500\">\r\n               <div class=\"tw-bg-white tw-p-4 tw-rounded-full tw-w-16 tw-h-16 tw-mx-auto tw-mb-4 tw-flex tw-items-center tw-justify-center\">\r\n                 <cide-ele-icon class=\"tw-w-8 tw-h-8 tw-text-gray-400\">link</cide-ele-icon>\r\n               </div>\r\n               <h6 class=\"tw-text-base tw-font-medium tw-text-gray-600 tw-mb-2\">No Mappings Yet</h6>\r\n               <p class=\"tw-text-sm tw-text-gray-500\">Click \"Add New Mapping\" to start configuring entity relationships for this academic year.</p>\r\n             </div>\r\n             } @else {\r\n             <div class=\"tw-space-y-4\" formArrayName=\"acayr_academic_year_mappings\">\r\n               @for (mapping of academicYearMappingsArray.controls; track $index) {\r\n               <div class=\"tw-bg-white tw-rounded-xl tw-border tw-border-gray-200 tw-shadow-sm hover:tw-shadow-md tw-transition-shadow tw-p-6\">\r\n                 <div class=\"tw-flex tw-items-start tw-justify-between tw-mb-4\">\r\n                   <div class=\"tw-flex tw-items-center tw-gap-2\">\r\n                     <div class=\"tw-bg-blue-100 tw-p-2 tw-rounded-lg\">\r\n                       <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">settings</cide-ele-icon>\r\n                     </div>\r\n                     <h6 class=\"tw-text-sm tw-font-semibold tw-text-gray-900\">Mapping #{{ $index + 1 }}</h6>\r\n                   </div>\r\n                   <button cideEleButton type=\"button\" variant=\"danger\" size=\"sm\" leftIcon=\"delete\"\r\n                     (click)=\"removeAcademicYearMapping($index)\"\r\n                     class=\"tw-opacity-80 hover:tw-opacity-100 tw-transition-opacity\">\r\n                     Remove\r\n                   </button>\r\n                 </div>\r\n                 \r\n                 <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-2 tw-gap-4\" [formGroupName]=\"$index\">\r\n                   <!-- Hidden Academic Year ID field (internal use only) -->\r\n                   <input type=\"hidden\" formControlName=\"acayrmp_academic_year_id_acayr\">\r\n                   \r\n                   <!-- Entity Selection -->\r\n                   <div class=\"tw-space-y-2\">\r\n                     <label class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Select Entity *</label>\r\n                     <cide-ele-select \r\n                       [options]=\"entityOptions()\"\r\n                       formControlName=\"acayrmp_entity_id_syen\"\r\n                       placeholder=\"Choose entity for this mapping\" \r\n                       size=\"md\"\r\n                       valueKey=\"_id\"\r\n                       labelKey=\"syen_name\"\r\n                       class=\"tw-min-w-full\"\r\n                       (change)=\"onMappingEntityChange($event, $index)\">\r\n                     </cide-ele-select>\r\n                   </div>\r\n                   \r\n                   <!-- Status Controls -->\r\n                   <div class=\"tw-space-y-2\">\r\n                     <div class=\"tw-grid tw-grid-cols-1 tw-gap-3\">\r\n                       <div class=\"tw-flex tw-items-center tw-gap-2 tw-p-3 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\r\n                         <cide-ele-input \r\n                           formControlName=\"acayrmp_islocked\" \r\n                           type=\"checkbox\" \r\n                           size=\"sm\">\r\n                         </cide-ele-input>\r\n                         <div class=\"tw-flex tw-flex-col\">\r\n                           <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Locked</span>\r\n                           <span class=\"tw-text-xs tw-text-gray-500\">Prevent modifications</span>\r\n                         </div>\r\n                       </div>\r\n                       \r\n                       <div class=\"tw-flex tw-items-center tw-gap-2 tw-p-3 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\r\n                         <cide-ele-input \r\n                           formControlName=\"acayrmp_iscurrent\" \r\n                           type=\"checkbox\" \r\n                           size=\"sm\">\r\n                         </cide-ele-input>\r\n                         <div class=\"tw-flex tw-flex-col\">\r\n                           <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Current</span>\r\n                           <span class=\"tw-text-xs tw-text-gray-500\">Mark as current mapping</span>\r\n                         </div>\r\n                       </div>\r\n                     </div>\r\n                   </div>\r\n                 </div>\r\n               </div>\r\n               }\r\n             </div>\r\n             }\r\n\r\n             <!-- Mapping Validation Messages -->\r\n             @if (academicYearMappingsArray.length > 0 && !isMappingsArrayValid()) {\r\n             <div class=\"tw-mt-4 tw-p-4 tw-bg-yellow-50 tw-border tw-border-yellow-200 tw-rounded-lg\">\r\n               <div class=\"tw-flex tw-items-center tw-gap-2\">\r\n                 <cide-ele-icon variant=\"warning\" size=\"sm\">warning</cide-ele-icon>\r\n                 <span class=\"tw-text-sm tw-font-medium tw-text-yellow-800\">\r\n                   Please ensure all mappings have required fields filled in.\r\n                 </span>\r\n               </div>\r\n             </div>\r\n             }\r\n           </div>\r\n           }\r\n           }\r\n         </div>\r\n\r\n         <!-- Error Display -->\r\n         @if (error()) {\r\n         <div class=\"tw-mt-6 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-lg\">\r\n           <div class=\"tw-flex tw-items-center tw-gap-2\">\r\n             <cide-ele-icon variant=\"red\" size=\"sm\">error</cide-ele-icon>\r\n             <span class=\"tw-text-sm tw-font-medium tw-text-red-800\">{{ error() }}</span>\r\n           </div>\r\n         </div>\r\n         }\r\n       </div>\r\n     </div>\r\n\r\n          <!-- Form Actions -->\r\n      <div class=\"tw-table-row tw-h-0\">\r\n        <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-2 tw-bg-gray-50 tw-border-t tw-border-gray-200\">\r\n          <div class=\"tw-flex tw-justify-end tw-gap-4\">\r\n            <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"resetForm()\" leftIcon=\"refresh\"\r\n              [disabled]=\"loading()\">\r\n              Reset Form\r\n            </button>\r\n\r\n            <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"cancelForm()\" leftIcon=\"close\"\r\n              [disabled]=\"loading()\">\r\n              Cancel\r\n            </button>\r\n\r\n            <button cideEleButton type=\"submit\" variant=\"primary\" [disabled]=\"loading() || academicYearForm.invalid\"\r\n              [loading]=\"loading()\" leftIcon=\"save\">\r\n              {{ isEditMode() ? 'Update Academic Year' : 'Create Academic Year' }}\r\n            </button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </form>\r\n  </div>" }]
+                        CideSelectComponent,
+                        CideFormFieldErrorComponent
+                    ], template: "<!-- \n  ACADEMIC YEAR MASTER FORM\n  \n  Enterprise-Level Styling with Tailwind CSS\n  Features: Responsive grids, proper typography, enhanced user experience\n-->\n\n<div class=\"tw-w-full tw-h-full\">\n  <form class=\"tw-w-full tw-table tw-h-full tw-bg-transparent\" [formGroup]=\"academicYearForm\" [class.tw-opacity-60]=\"loading()\"\n    (ngSubmit)=\"onSubmit()\">\n\n    <!-- Simple Header Section -->\n    <div class=\"tw-table-row tw-w-full tw-h-0\">\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n        <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\n          \n          <!-- Title -->\n          <div class=\"tw-flex tw-items-center tw-space-x-2\">\n            <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">school</cide-ele-icon>\n            <h5 class=\"tw-text-base tw-font-medium tw-text-gray-900 tw-m-0\">\n              {{ isEditMode() ? 'Edit Academic Year' : 'Create Academic Year' }}\n            </h5>\n          </div>\n\n          <!-- Actions -->\n          <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\n            <!-- Back button or other actions can be added here if needed -->\n          </div>\n        </div>\n      </div>\n    </div>\n\n    <!-- Tab Navigation -->\n    <div class=\"tw-table-row tw-h-0\">\n      <div class=\"tw-table-cell tw-w-full tw-px-2 tw-py-0\">\n        <cide-ele-tab [tabs]=\"academicYearTabs()\" [activeTabId]=\"activeTab()\" size=\"md\" variant=\"default\"\n          (tabChange)=\"onTabChange($event)\">\n        </cide-ele-tab>\n      </div>\n    </div>\n\n    <!-- Tab Content -->\n    <div class=\"tw-table-row\">\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-6\">\n        <div class=\"tw-transition-opacity tw-duration-300\" [class.tw-opacity-60]=\"loading()\">\n          @switch (activeTab()) {\n\n                  @case ('basic') {\n           <!-- Basic Academic Year Information -->\n           <div class=\"tw-space-y-6\">\n             <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\n               <cide-ele-input label=\"Academic Year Code *\" formControlName=\"acayr_code\"\n                 placeholder=\"e.g., AY2024-25\" size=\"md\" leadingIcon=\"code\">\n               </cide-ele-input>\n\n               <cide-ele-input label=\"Academic Year Name *\" formControlName=\"acayr_name\"\n                 placeholder=\"e.g., Academic Year 2024-2025\" size=\"md\" leadingIcon=\"school\">\n               </cide-ele-input>\n             </div>\n\n             <div>\n               <cide-ele-textarea label=\"Description\" formControlName=\"acayr_description\"\n                 placeholder=\"Enter detailed description of the academic year...\"\n                 rows=\"3\" size=\"md\">\n               </cide-ele-textarea>\n             </div>\n\n             <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\n               <cide-ele-input label=\"From Date *\" formControlName=\"acayr_from_date\" type=\"date\" size=\"md\"\n                 leadingIcon=\"calendar_today\" id=\"acayr_from_date\">\n               </cide-ele-input>\n\n               <cide-ele-input label=\"To Date *\" formControlName=\"acayr_to_date\" type=\"date\" size=\"md\"\n                 leadingIcon=\"calendar_today\" id=\"acayr_to_date\">\n               </cide-ele-input>\n             </div>\n\n             <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-6\">\n               <div class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\n                 <cide-ele-input formControlName=\"acayr_isactive\" type=\"checkbox\" size=\"md\">\n                 </cide-ele-input>\n                 <div class=\"tw-flex tw-flex-col\">\n                   <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Active</span>\n                   <span class=\"tw-text-xs tw-text-gray-500\">Enable/disable this academic year</span>\n                 </div>\n               </div>\n\n               <div class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\n                 <cide-ele-input formControlName=\"acayr_iscurrent\" type=\"checkbox\" size=\"md\">\n                 </cide-ele-input>\n                 <div class=\"tw-flex tw-flex-col\">\n                   <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Current</span>\n                   <span class=\"tw-text-xs tw-text-gray-500\">Mark as current academic year</span>\n                 </div>\n               </div>\n\n               <div class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\n                 <cide-ele-input formControlName=\"acayr_islocked\" type=\"checkbox\" size=\"md\">\n                 </cide-ele-input>\n                 <div class=\"tw-flex tw-flex-col\">\n                   <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Locked</span>\n                   <span class=\"tw-text-xs tw-text-gray-500\">Prevent modifications</span>\n                 </div>\n               </div>\n             </div>\n           </div>\n           }\n\n           @case ('mapping') {\n           <!-- Academic Year Mapping Configuration -->\n           <div class=\"tw-bg-gradient-to-r tw-from-blue-50 tw-to-indigo-50 tw-border tw-border-blue-200 tw-rounded-xl tw-p-6\">\n             <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-6\">\n               <div class=\"tw-flex tw-items-center tw-gap-3\">\n                 <div class=\"tw-bg-blue-100 tw-p-2 tw-rounded-lg\">\n                   <cide-ele-icon class=\"tw-text-blue-600 tw-w-6 tw-h-6\">link</cide-ele-icon>\n                 </div>\n                 <div>\n                   <h6 class=\"tw-text-lg tw-font-semibold tw-text-blue-900 tw-m-0\">Academic Year Mapping</h6>\n                   <p class=\"tw-text-sm tw-text-blue-600 tw-m-0\">Configure entity mappings for this academic year</p>\n                 </div>\n               </div>\n               <button cideEleButton type=\"button\" variant=\"primary\" size=\"md\" leftIcon=\"add\"\n                 (click)=\"addAcademicYearMapping()\"\n                 class=\"tw-shadow-md hover:tw-shadow-lg tw-transition-shadow\">\n                 Add New Mapping\n               </button>\n             </div>\n             \n             @if (academicYearMappingsArray.length === 0) {\n             <div class=\"tw-text-center tw-py-12 tw-text-gray-500\">\n               <div class=\"tw-bg-white tw-p-4 tw-rounded-full tw-w-16 tw-h-16 tw-mx-auto tw-mb-4 tw-flex tw-items-center tw-justify-center\">\n                 <cide-ele-icon class=\"tw-w-8 tw-h-8 tw-text-gray-400\">link</cide-ele-icon>\n               </div>\n               <h6 class=\"tw-text-base tw-font-medium tw-text-gray-600 tw-mb-2\">No Mappings Yet</h6>\n               <p class=\"tw-text-sm tw-text-gray-500\">Click \"Add New Mapping\" to start configuring entity relationships for this academic year.</p>\n             </div>\n             } @else {\n             <div class=\"tw-space-y-4\" formArrayName=\"acayr_academic_year_mappings\">\n               @for (mapping of academicYearMappingsArray.controls; track $index) {\n               <div class=\"tw-bg-white tw-rounded-xl tw-border tw-border-gray-200 tw-shadow-sm hover:tw-shadow-md tw-transition-shadow tw-p-6\">\n                 <div class=\"tw-flex tw-items-start tw-justify-between tw-mb-4\">\n                   <div class=\"tw-flex tw-items-center tw-gap-2\">\n                     <div class=\"tw-bg-blue-100 tw-p-2 tw-rounded-lg\">\n                       <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">settings</cide-ele-icon>\n                     </div>\n                     <h6 class=\"tw-text-sm tw-font-semibold tw-text-gray-900\">Mapping #{{ $index + 1 }}</h6>\n                   </div>\n                   <button cideEleButton type=\"button\" variant=\"danger\" size=\"sm\" leftIcon=\"delete\"\n                     (click)=\"removeAcademicYearMapping($index)\"\n                     class=\"tw-opacity-80 hover:tw-opacity-100 tw-transition-opacity\">\n                     Remove\n                   </button>\n                 </div>\n                 \n                 <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-2 tw-gap-4\" [formGroupName]=\"$index\">\n                   <!-- Hidden Academic Year ID field (internal use only) -->\n                   <input type=\"hidden\" formControlName=\"acayrmp_academic_year_id_acayr\">\n                   \n                   <!-- Entity Selection -->\n                   <div class=\"tw-space-y-2\">\n                     <label class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Select Entity *</label>\n                     <cide-ele-select \n                       [options]=\"entityOptions()\"\n                       formControlName=\"acayrmp_entity_id_syen\"\n                       placeholder=\"Choose entity for this mapping\" \n                       size=\"md\"\n                       valueKey=\"_id\"\n                       labelKey=\"syen_name\"\n                       class=\"tw-min-w-full\"\n                       (change)=\"onMappingEntityChange($event, $index)\">\n                     </cide-ele-select>\n                   </div>\n                   \n                   <!-- Status Controls -->\n                   <div class=\"tw-space-y-2\">\n                     <div class=\"tw-grid tw-grid-cols-1 tw-gap-3\">\n                       <div class=\"tw-flex tw-items-center tw-gap-2 tw-p-3 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\n                         <cide-ele-input \n                           formControlName=\"acayrmp_islocked\" \n                           type=\"checkbox\" \n                           size=\"sm\">\n                         </cide-ele-input>\n                         <div class=\"tw-flex tw-flex-col\">\n                           <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Locked</span>\n                           <span class=\"tw-text-xs tw-text-gray-500\">Prevent modifications</span>\n                         </div>\n                       </div>\n                       \n                       <div class=\"tw-flex tw-items-center tw-gap-2 tw-p-3 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200\">\n                         <cide-ele-input \n                           formControlName=\"acayrmp_iscurrent\" \n                           type=\"checkbox\" \n                           size=\"sm\">\n                         </cide-ele-input>\n                         <div class=\"tw-flex tw-flex-col\">\n                           <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Current</span>\n                           <span class=\"tw-text-xs tw-text-gray-500\">Mark as current mapping</span>\n                         </div>\n                       </div>\n                     </div>\n                   </div>\n                 </div>\n               </div>\n               }\n             </div>\n             }\n\n             <!-- Mapping Validation Messages -->\n             @if (academicYearMappingsArray.length > 0 && !isMappingsArrayValid()) {\n             <div class=\"tw-mt-4 tw-p-4 tw-bg-yellow-50 tw-border tw-border-yellow-200 tw-rounded-lg\">\n               <div class=\"tw-flex tw-items-center tw-gap-2\">\n                 <cide-ele-icon variant=\"warning\" size=\"sm\">warning</cide-ele-icon>\n                 <span class=\"tw-text-sm tw-font-medium tw-text-yellow-800\">\n                   Please ensure all mappings have required fields filled in.\n                 </span>\n               </div>\n             </div>\n             }\n           </div>\n           }\n           }\n         </div>\n      </div>\n     </div>\n\n          <!-- Form Actions -->\n      <div class=\"tw-table-row tw-h-0\">\n        <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-2 tw-bg-gray-50 tw-border-t tw-border-gray-200\">\n          <div class=\"tw-flex tw-justify-between tw-items-center tw-gap-4\">\n            <!-- Form Validation Errors -->\n            <cide-form-field-error [formGroup]=\"academicYearForm\"></cide-form-field-error>\n            \n            <!-- Action Buttons -->\n            <div class=\"tw-flex tw-justify-end tw-gap-4\">\n            <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"resetForm()\" leftIcon=\"refresh\"\n              [disabled]=\"loading()\">\n              Reset Form\n            </button>\n\n            <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"cancelForm()\" leftIcon=\"close\"\n              [disabled]=\"loading()\">\n              Cancel\n            </button>\n\n            <button cideEleButton type=\"submit\" variant=\"primary\" [disabled]=\"loading() || academicYearForm.invalid\"\n              [loading]=\"loading()\" leftIcon=\"save\">\n              {{ isEditMode() ? 'Update Academic Year' : 'Create Academic Year' }}\n            </button>\n          </div>\n          </div>\n        </div>\n      </div>\n    </form>\n  </div>" }]
         }], ctorParameters: () => [] });
 
 var academicYearCreate_component = /*#__PURE__*/Object.freeze({
@@ -1672,7 +1661,7 @@ class AcademicYearListComponent {
         return 'Inactive';
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AcademicYearListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: AcademicYearListComponent, isStandalone: true, selector: "cide-core-academic-year-list", viewQueries: [{ propertyName: "academicYearDetailsRendererTemplate", first: true, predicate: ["academicYearDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "dateRangeRendererTemplate", first: true, predicate: ["dateRangeRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "statusRendererTemplate", first: true, predicate: ["statusRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Academic Year Container -->\r\n<div class=\"tw-table tw-w-full tw-h-full\">\r\n\r\n  <!-- Header Section with Filters -->\r\n  <div class=\"tw-table-row tw-h-0\">\r\n    <div class=\"tw-table-cell tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\r\n      <div\r\n        class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\r\n\r\n        <!-- Title -->\r\n        <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n          <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">school</cide-ele-icon>\r\n          <h5 class=\"tw-text-base tw-font-medium tw-text-gray-900 tw-m-0\">Academic Year Management</h5>\r\n        </div>\r\n\r\n        <!-- Actions -->\r\n        <div\r\n          class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\r\n          <button cideEleButton variant=\"primary\" size=\"sm\" leftIcon=\"add\" (click)=\"createAcademicYear()\">\r\n            Create Academic Year\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <!-- Main Content Area -->\r\n  <div class=\"tw-table-row\">\r\n    <div class=\"tw-table-cell tw-h-full tw-relative\">\r\n\r\n      <!-- Data Grid Component -->\r\n      <div class=\"tw-h-full tw-overflow-auto\">\r\n        <cide-ele-data-grid [config]=\"gridConfig()\" [templateRenderers]=\"templateRenderers()\"\r\n          (gridEvent)=\"onGridEvent($event)\">\r\n        </cide-ele-data-grid>\r\n      </div>\r\n\r\n    </div>\r\n  </div>\r\n\r\n</div>\r\n\r\n<!-- Template Renderers -->\r\n<ng-template #academicYearDetailsRendererTemplate let-row=\"row\">\r\n  <div class=\"tw-flex tw-flex-col tw-w-full\">\r\n    <div class=\"tw-font-medium tw-text-gray-900\">{{ row.acayr_name || 'N/A' }}</div>\r\n    <div class=\"tw-text-sm tw-text-gray-500 tw-truncate\">{{ row.acayr_description || 'No description' }}</div>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #dateRangeRendererTemplate let-row=\"row\">\r\n  <div class=\"tw-flex tw-flex-col tw-text-sm\">\r\n    <span class=\"tw-text-gray-900 tw-font-medium\">{{ formatDate(row.acayr_from_date) }}</span>\r\n    <span class=\"tw-text-gray-500\">to {{ formatDate(row.acayr_to_date) }}</span>\r\n    <span class=\"tw-text-xs tw-text-gray-400\">{{ getDuration(row.acayr_from_date, row.acayr_to_date) }}</span>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #statusRendererTemplate let-row=\"row\">\r\n  <div class=\"tw-flex tw-flex-col tw-gap-1 tw-items-center\">\r\n    <!-- Current Year Badge (Priority) -->\r\n    @if (row.acayr_iscurrent) {\r\n    <span\r\n      class=\"tw-inline-flex tw-items-center tw-justify-center tw-px-2.5 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-yellow-100 tw-text-yellow-800 tw-text-center\">\r\n      <cide-ele-icon size=\"2xs\" class=\"tw-mr-1\">star</cide-ele-icon>\r\n      Current Year\r\n    </span>\r\n    }\r\n    \r\n    <!-- Active/Inactive Status Badge -->\r\n    <span class=\"tw-inline-flex tw-items-center tw-justify-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-text-center\"\r\n      [ngClass]=\"getActiveStatusBadgeClass(row)\">\r\n      <cide-ele-icon size=\"2xs\" class=\"tw-mr-1\">\r\n        {{ row.acayr_isactive ? 'check_circle' : 'cancel' }}\r\n      </cide-ele-icon>\r\n      {{ row.acayr_isactive ? 'Active' : 'Inactive' }}\r\n    </span>\r\n    \r\n    <!-- Locked Status Badge (Additional info) -->\r\n    @if (row.acayr_islocked) {\r\n    <span\r\n      class=\"tw-inline-flex tw-items-center tw-justify-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-red-100 tw-text-red-800 tw-text-center\">\r\n      <cide-ele-icon size=\"2xs\" class=\"tw-mr-1\">lock</cide-ele-icon>\r\n      Locked\r\n    </span>\r\n    }\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\" let-value=\"value\">\r\n  <cide-ele-dropdown \r\n    [items]=\"getActionDropdownItems(row)\"\r\n    [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\r\n    (itemClick)=\"onDropdownItemClick($event, row)\">\r\n  </cide-ele-dropdown>\r\n</ng-template>", styles: [".academic-year-listing-container{@apply tw-w-full tw-h-full;}:host{@apply tw-w-full tw-h-full tw-flex tw-flex-col;}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton]", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: AcademicYearListComponent, isStandalone: true, selector: "cide-core-academic-year-list", viewQueries: [{ propertyName: "academicYearDetailsRendererTemplate", first: true, predicate: ["academicYearDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "dateRangeRendererTemplate", first: true, predicate: ["dateRangeRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "statusRendererTemplate", first: true, predicate: ["statusRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Academic Year Container -->\r\n<div class=\"tw-table tw-w-full tw-h-full\">\r\n\r\n  <!-- Header Section with Filters -->\r\n  <div class=\"tw-table-row tw-h-0\">\r\n    <div class=\"tw-table-cell tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\r\n      <div\r\n        class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\r\n\r\n        <!-- Title -->\r\n        <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n          <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">school</cide-ele-icon>\r\n          <h5 class=\"tw-text-base tw-font-medium tw-text-gray-900 tw-m-0\">Academic Year Management</h5>\r\n        </div>\r\n\r\n        <!-- Actions -->\r\n        <div\r\n          class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\r\n          <button cideEleButton variant=\"primary\" size=\"sm\" leftIcon=\"add\" (click)=\"createAcademicYear()\">\r\n            Create Academic Year\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <!-- Main Content Area -->\r\n  <div class=\"tw-table-row\">\r\n    <div class=\"tw-table-cell tw-h-full tw-relative\">\r\n\r\n      <!-- Data Grid Component -->\r\n      <div class=\"tw-h-full tw-overflow-auto\">\r\n        <cide-ele-data-grid [config]=\"gridConfig()\" [templateRenderers]=\"templateRenderers()\"\r\n          (gridEvent)=\"onGridEvent($event)\">\r\n        </cide-ele-data-grid>\r\n      </div>\r\n\r\n    </div>\r\n  </div>\r\n\r\n</div>\r\n\r\n<!-- Template Renderers -->\r\n<ng-template #academicYearDetailsRendererTemplate let-row=\"row\">\r\n  <div class=\"tw-flex tw-flex-col tw-w-full\">\r\n    <div class=\"tw-font-medium tw-text-gray-900\">{{ row.acayr_name || 'N/A' }}</div>\r\n    <div class=\"tw-text-sm tw-text-gray-500 tw-truncate\">{{ row.acayr_description || 'No description' }}</div>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #dateRangeRendererTemplate let-row=\"row\">\r\n  <div class=\"tw-flex tw-flex-col tw-text-sm\">\r\n    <span class=\"tw-text-gray-900 tw-font-medium\">{{ formatDate(row.acayr_from_date) }}</span>\r\n    <span class=\"tw-text-gray-500\">to {{ formatDate(row.acayr_to_date) }}</span>\r\n    <span class=\"tw-text-xs tw-text-gray-400\">{{ getDuration(row.acayr_from_date, row.acayr_to_date) }}</span>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #statusRendererTemplate let-row=\"row\">\r\n  <div class=\"tw-flex tw-flex-col tw-gap-1 tw-items-center\">\r\n    <!-- Current Year Badge (Priority) -->\r\n    @if (row.acayr_iscurrent) {\r\n    <span\r\n      class=\"tw-inline-flex tw-items-center tw-justify-center tw-px-2.5 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-yellow-100 tw-text-yellow-800 tw-text-center\">\r\n      <cide-ele-icon size=\"2xs\" class=\"tw-mr-1\">star</cide-ele-icon>\r\n      Current Year\r\n    </span>\r\n    }\r\n    \r\n    <!-- Active/Inactive Status Badge -->\r\n    <span class=\"tw-inline-flex tw-items-center tw-justify-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-text-center\"\r\n      [ngClass]=\"getActiveStatusBadgeClass(row)\">\r\n      <cide-ele-icon size=\"2xs\" class=\"tw-mr-1\">\r\n        {{ row.acayr_isactive ? 'check_circle' : 'cancel' }}\r\n      </cide-ele-icon>\r\n      {{ row.acayr_isactive ? 'Active' : 'Inactive' }}\r\n    </span>\r\n    \r\n    <!-- Locked Status Badge (Additional info) -->\r\n    @if (row.acayr_islocked) {\r\n    <span\r\n      class=\"tw-inline-flex tw-items-center tw-justify-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-red-100 tw-text-red-800 tw-text-center\">\r\n      <cide-ele-icon size=\"2xs\" class=\"tw-mr-1\">lock</cide-ele-icon>\r\n      Locked\r\n    </span>\r\n    }\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\" let-value=\"value\">\r\n  <cide-ele-dropdown \r\n    [items]=\"getActionDropdownItems(row)\"\r\n    [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\r\n    (itemClick)=\"onDropdownItemClick($event, row)\">\r\n  </cide-ele-dropdown>\r\n</ng-template>", styles: [".academic-year-listing-container{@apply tw-w-full tw-h-full;}:host{@apply tw-w-full tw-h-full tw-flex tw-flex-col;}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AcademicYearListComponent, decorators: [{
             type: Component,
@@ -2343,7 +2332,7 @@ class CideLytClassProgramBranchListComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CideLytClassProgramBranchListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.1.7", type: CideLytClassProgramBranchListComponent, isStandalone: true, selector: "cide-academics-class-program-branch-list", viewQueries: [{ propertyName: "dragHandleRendererTemplate", first: true, predicate: ["dragHandleRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "classProgramRendererTemplate", first: true, predicate: ["classProgramRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Class Program Branch Container -->\r\n<div class=\"tw-table tw-w-full tw-h-full\">\r\n\r\n  <!-- Header Section -->\r\n  <div class=\"tw-table-row tw-h-0\">\r\n    <div class=\"tw-table-cell tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\r\n      <div\r\n        class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\r\n        <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n          <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">account_tree</cide-ele-icon>\r\n          <h5 class=\"tw-text-base tw-font-medium tw-text-gray-900 tw-m-0\">Class Program Branch Management</h5>\r\n        </div>\r\n        <div\r\n          class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\r\n          <button cideEleButton variant=\"primary\" size=\"sm\" leftIcon=\"add\" (click)=\"onCreateBranch()\">\r\n            Create Branch\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <!-- Data Grid Section -->\r\n  <div class=\"tw-table-row\">\r\n    <div class=\"tw-table-cell tw-p-0\">\r\n      <cide-ele-data-grid\r\n        [config]=\"gridConfig()\"\r\n        [templateRenderers]=\"templateRenderers()\"\r\n        (gridEvent)=\"onGridEvent($event)\">\r\n      </cide-ele-data-grid>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<!-- Template Renderers -->\r\n<ng-template #dragHandleRendererTemplate let-row=\"row\">\r\n  <div class=\"tw-flex tw-justify-center tw-cursor-move drag-handle\" title=\"Drag to reorder\">\r\n    <cide-ele-icon name=\"drag_indicator\" class=\"tw-w-4 tw-h-4 tw-text-gray-400 hover:tw-text-gray-600\"></cide-ele-icon>\r\n  </div>\r\n</ng-template>\r\n\r\n\r\n<ng-template #classProgramRendererTemplate let-row=\"row\">\r\n  <div class=\"tw-text-sm tw-text-gray-900\">\r\n    {{ row.acabrn_class_program_id_acacpm?.acacpm_alise_title || 'N/A' }}\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\">\r\n  <div class=\"tw-relative tw-inline-block\">\r\n    <cide-ele-dropdown \r\n      [items]=\"getBranchActionDropdownItems(row)\" \r\n      (itemClick)=\"onDropdownItemClick($event, row)\">\r\n    </cide-ele-dropdown>\r\n  </div>\r\n</ng-template>\r\n\r\n", styles: [".drag-handle{cursor:move}.drag-handle:hover{background-color:#0000000d;border-radius:4px}.tw-table tbody tr{cursor:pointer}.tw-table tbody tr:hover{background-color:#00000005}.tw-table tbody tr.selected{background-color:#3b82f61a}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton]", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.1.7", type: CideLytClassProgramBranchListComponent, isStandalone: true, selector: "cide-academics-class-program-branch-list", viewQueries: [{ propertyName: "dragHandleRendererTemplate", first: true, predicate: ["dragHandleRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "classProgramRendererTemplate", first: true, predicate: ["classProgramRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Class Program Branch Container -->\r\n<div class=\"tw-table tw-w-full tw-h-full\">\r\n\r\n  <!-- Header Section -->\r\n  <div class=\"tw-table-row tw-h-0\">\r\n    <div class=\"tw-table-cell tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\r\n      <div\r\n        class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\r\n        <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n          <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">account_tree</cide-ele-icon>\r\n          <h5 class=\"tw-text-base tw-font-medium tw-text-gray-900 tw-m-0\">Class Program Branch Management</h5>\r\n        </div>\r\n        <div\r\n          class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\r\n          <button cideEleButton variant=\"primary\" size=\"sm\" leftIcon=\"add\" (click)=\"onCreateBranch()\">\r\n            Create Branch\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <!-- Data Grid Section -->\r\n  <div class=\"tw-table-row\">\r\n    <div class=\"tw-table-cell tw-p-0\">\r\n      <cide-ele-data-grid\r\n        [config]=\"gridConfig()\"\r\n        [templateRenderers]=\"templateRenderers()\"\r\n        (gridEvent)=\"onGridEvent($event)\">\r\n      </cide-ele-data-grid>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<!-- Template Renderers -->\r\n<ng-template #dragHandleRendererTemplate let-row=\"row\">\r\n  <div class=\"tw-flex tw-justify-center tw-cursor-move drag-handle\" title=\"Drag to reorder\">\r\n    <cide-ele-icon name=\"drag_indicator\" class=\"tw-w-4 tw-h-4 tw-text-gray-400 hover:tw-text-gray-600\"></cide-ele-icon>\r\n  </div>\r\n</ng-template>\r\n\r\n\r\n<ng-template #classProgramRendererTemplate let-row=\"row\">\r\n  <div class=\"tw-text-sm tw-text-gray-900\">\r\n    {{ row.acabrn_class_program_id_acacpm?.acacpm_alise_title || 'N/A' }}\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\">\r\n  <div class=\"tw-relative tw-inline-block\">\r\n    <cide-ele-dropdown \r\n      [items]=\"getBranchActionDropdownItems(row)\" \r\n      (itemClick)=\"onDropdownItemClick($event, row)\">\r\n    </cide-ele-dropdown>\r\n  </div>\r\n</ng-template>\r\n\r\n", styles: [".drag-handle{cursor:move}.drag-handle:hover{background-color:#0000000d;border-radius:4px}.tw-table tbody tr{cursor:pointer}.tw-table tbody tr:hover{background-color:#00000005}.tw-table tbody tr.selected{background-color:#3b82f61a}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CideLytClassProgramBranchListComponent, decorators: [{
             type: Component,
@@ -2461,6 +2450,7 @@ class CideLytClassProgramBranchFormComponent {
     confirmationService = inject(ConfirmationService);
     classProgramBranchService = inject(CideLytClassProgramBranchService);
     programClassService = inject(CideLytProgramClassService);
+    generalMasterService = inject(CideCoreGeneralMasterService);
     // Form and state management
     branchForm;
     loading = signal(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
@@ -2470,12 +2460,18 @@ class CideLytClassProgramBranchFormComponent {
     branchId = signal(null, ...(ngDevMode ? [{ debugName: "branchId" }] : []));
     // Data signals
     programClasses = signal([], ...(ngDevMode ? [{ debugName: "programClasses" }] : []));
+    branchMasters = signal([], ...(ngDevMode ? [{ debugName: "branchMasters" }] : []));
+    // Signal for breadcrumb data that will be passed to shared wrapper
+    breadcrumbData = signal([], ...(ngDevMode ? [{ debugName: "breadcrumbData" }] : []));
+    // Flag to prevent auto-populate during data load
+    isLoadingData = false;
     constructor() {
         this.branchForm = this.fb.group({
             acabrn_name: ['', [Validators.required, Validators.minLength(2)]],
             acabrn_code: ['', [Validators.required, Validators.minLength(2)]],
             acabrn_sequence: [0, [Validators.required, Validators.min(0)]],
             acabrn_class_program_id_acacpm: ['', [Validators.required]],
+            acabrn_branch_id_sygms: [''],
             acabrn_isactive: [true],
             acabrn_islocked: [false]
         });
@@ -2483,6 +2479,21 @@ class CideLytClassProgramBranchFormComponent {
     ngOnInit() {
         console.log('🏢 Class Program Branch Form Component initialized');
         this.initializeComponent();
+        this.setupFormListeners();
+    }
+    /**
+     * Setup form control listeners
+     */
+    setupFormListeners() {
+        // Listen to SYGMS field changes
+        this.branchForm.get('acabrn_branch_id_sygms')?.valueChanges
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe((sygmsId) => {
+            // Only auto-populate if not loading existing data
+            if (sygmsId && !this.isLoadingData) {
+                this.onBranchMasterChange(sygmsId);
+            }
+        });
     }
     ngOnDestroy() {
         console.log('🏢 Class Program Branch Form Component destroyed');
@@ -2528,6 +2539,8 @@ class CideLytClassProgramBranchFormComponent {
             // Create mode
             this.isEditMode.set(false);
             this.isViewMode.set(false);
+            // Initialize breadcrumb for create mode
+            this.updateBreadcrumbData();
         }
     }
     /**
@@ -2537,6 +2550,8 @@ class CideLytClassProgramBranchFormComponent {
         console.log('🔄 Loading master data for Class Program Branch Form...');
         // Load program classes
         this.loadProgramClasses();
+        // Load branch masters (SYGMS)
+        this.loadBranchMasters();
     }
     /**
      * Load program classes
@@ -2561,6 +2576,74 @@ class CideLytClassProgramBranchFormComponent {
             }
         });
     }
+    /**
+     * Load branch masters from SYGMS (General Master)
+     * Filter by type code 'BRANCH' or similar
+     */
+    loadBranchMasters() {
+        const payload = {
+            sygmt_code: 'BRANCH' // Assuming 'BRANCH' is the type code for branch masters
+        };
+        this.generalMasterService.getMasterList(payload)
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe({
+            next: (response) => {
+                console.log('✅ Branch masters loaded:', response);
+                if (response?.success && response.data) {
+                    const masters = response.data.map((master) => ({
+                        ...master,
+                        value: master._id,
+                        label: master.sygms_title
+                    }));
+                    this.branchMasters.set(masters);
+                }
+                else {
+                    console.warn('⚠️ No branch master data received');
+                    this.branchMasters.set([]);
+                }
+            },
+            error: (error) => {
+                console.error('❌ Error loading branch masters:', error);
+                this.branchMasters.set([]);
+            }
+        });
+    }
+    /**
+     * Handle SYGMS selection change - auto-populate name and code
+     */
+    onBranchMasterChange(sygmsId) {
+        if (!sygmsId) {
+            return;
+        }
+        const selectedMaster = this.branchMasters().find(m => m._id === sygmsId);
+        if (selectedMaster) {
+            // Auto-populate name from SYGMS title
+            if (selectedMaster.sygms_title) {
+                this.branchForm.patchValue({
+                    acabrn_name: selectedMaster.sygms_title
+                });
+            }
+            // Auto-populate code from SYGMS configuration or code
+            if (selectedMaster.sygms_configuration && typeof selectedMaster.sygms_configuration === 'object') {
+                const config = selectedMaster.sygms_configuration;
+                if (config.code) {
+                    this.branchForm.patchValue({
+                        acabrn_code: config.code
+                    });
+                }
+                else if (selectedMaster.sygms_code) {
+                    this.branchForm.patchValue({
+                        acabrn_code: selectedMaster.sygms_code
+                    });
+                }
+            }
+            else if (selectedMaster.sygms_code) {
+                this.branchForm.patchValue({
+                    acabrn_code: selectedMaster.sygms_code
+                });
+            }
+        }
+    }
     /**
      * Load branch for viewing
      */
@@ -2603,6 +2686,7 @@ class CideLytClassProgramBranchFormComponent {
     loadBranchData(branchId, isViewMode) {
         this.loading.set(true);
         this.error.set(null);
+        this.isLoadingData = true; // Set flag to prevent auto-populate
         const payload = {
             acabrn_id: branchId
         };
@@ -2618,18 +2702,24 @@ class CideLytClassProgramBranchFormComponent {
                         acabrn_code: branchData.acabrn_code,
                         acabrn_sequence: branchData.acabrn_sequence,
                         acabrn_class_program_id_acacpm: branchData.acabrn_class_program_id_acacpm?._id,
+                        acabrn_branch_id_sygms: branchData.acabrn_branch_id_sygms?._id || branchData.acabrn_branch_id_sygms || '',
                         acabrn_isactive: (branchData).acabrn_isactive,
                         acabrn_islocked: branchData.acabrn_islocked
                     });
+                    // Reset flag after data is loaded
+                    this.isLoadingData = false;
                     // Disable form if in view mode
                     if (isViewMode) {
                         this.branchForm.disable();
                     }
+                    // Update breadcrumb for edit/view mode
+                    this.updateBreadcrumbData(branchData, isViewMode);
                     this.notificationService.success('Branch data loaded successfully.');
                 }
                 else {
                     this.error.set('Failed to load branch data.');
                     this.notificationService.error('Failed to load branch data.');
+                    this.isLoadingData = false;
                 }
                 this.loading.set(false);
             },
@@ -2637,6 +2727,7 @@ class CideLytClassProgramBranchFormComponent {
                 console.error('❌ Error loading branch data:', error);
                 this.error.set('Failed to load branch data. Please try again.');
                 this.loading.set(false);
+                this.isLoadingData = false;
                 this.notificationService.error('Failed to load branch data. Please try again.');
             }
         });
@@ -2680,6 +2771,7 @@ class CideLytClassProgramBranchFormComponent {
             acabrn_code: formData.acabrn_code,
             acabrn_sequence: formData.acabrn_sequence,
             acabrn_class_program_id_acacpm: formData.acabrn_class_program_id_acacpm,
+            acabrn_branch_id_sygms: formData.acabrn_branch_id_sygms || undefined,
             acabrn_isactive: formData.acabrn_isactive,
             acabrn_islocked: formData.acabrn_islocked
         };
@@ -2740,7 +2832,8 @@ class CideLytClassProgramBranchFormComponent {
         this.branchForm.patchValue({
             acabrn_isactive: true,
             acabrn_islocked: false,
-            acabrn_sequence: 0
+            acabrn_sequence: 0,
+            acabrn_branch_id_sygms: ''
         });
         this.notificationService.info('Form has been reset to initial values.');
     }
@@ -2766,8 +2859,50 @@ class CideLytClassProgramBranchFormComponent {
             acabrn_islocked: !currentValue
         });
     }
+    /**
+     * Update breadcrumb data based on mode
+     */
+    updateBreadcrumbData(branchData, isViewMode = false) {
+        const additionalItems = [];
+        if (this.isEditMode() || isViewMode) {
+            if (branchData) {
+                additionalItems.push({
+                    id: branchData._id || 'branch',
+                    label: branchData.acabrn_name || 'Branch',
+                    icon: undefined,
+                    url: undefined
+                });
+            }
+            if (isViewMode) {
+                additionalItems.push({
+                    id: 'view',
+                    label: 'View',
+                    icon: 'visibility',
+                    url: undefined
+                });
+            }
+            else {
+                additionalItems.push({
+                    id: 'edit',
+                    label: 'Edit',
+                    icon: 'edit',
+                    url: undefined
+                });
+            }
+        }
+        else {
+            // Create mode
+            additionalItems.push({
+                id: 'create',
+                label: 'Create',
+                icon: 'add',
+                url: undefined
+            });
+        }
+        this.breadcrumbData.set(additionalItems);
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CideLytClassProgramBranchFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: CideLytClassProgramBranchFormComponent, isStandalone: true, selector: "cide-academics-class-program-branch-form", ngImport: i0, template: "<!-- \r\n  CLASS PROGRAM BRANCH FORM COMPONENT\r\n  \r\n  Enterprise-Level Styling with Tailwind CSS\r\n  Features: Responsive grids, proper typography, enhanced user experience\r\n-->\r\n\r\n<div class=\"tw-w-full tw-h-full\">\r\n  <form class=\"tw-w-full tw-table tw-h-full tw-bg-transparent\" [formGroup]=\"branchForm\"\r\n    [class.tw-opacity-60]=\"loading()\" (ngSubmit)=\"onSubmit()\">\r\n\r\n    <!-- Simple Header Section -->\r\n    <div class=\"tw-table-row tw-w-full tw-h-0\">\r\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\r\n        <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\r\n          \r\n          <!-- Title -->\r\n          <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n            <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">account_tree</cide-ele-icon>\r\n            <h5 class=\"tw-text-base tw-font-medium tw-text-gray-900 tw-m-0\">\r\n              {{ formTitle }}\r\n            </h5>\r\n          </div>\r\n\r\n          <!-- Actions -->\r\n          <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\r\n            <!-- Back button or other actions can be added here if needed -->\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- Form Content -->\r\n    <div class=\"tw-table-row\">\r\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-6\">\r\n        <div class=\"tw-transition-opacity tw-duration-300\" [class.tw-opacity-60]=\"loading()\">\r\n          \r\n          <!-- Error Message -->\r\n          @if (error()) {\r\n            <div class=\"tw-mb-6 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\r\n              <div class=\"tw-flex tw-items-start\">\r\n                <cide-ele-icon name=\"error\" class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\r\n                <div class=\"tw-ml-3\">\r\n                  <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\r\n                  <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          }\r\n\r\n          <!-- Basic Branch Information -->\r\n          <div class=\"tw-space-y-6\">\r\n            <!-- Class Program Selection -->\r\n            <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-1 tw-gap-6\">\r\n              <div class=\"tw-space-y-2\">\r\n                <label class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Class Program *</label>\r\n                <cide-ele-select \r\n                  formControlName=\"acabrn_class_program_id_acacpm\" \r\n                  placeholder=\"Select class program\"\r\n                  [disabled]=\"isViewMode()\" \r\n                  valueKey=\"_id\" \r\n                  labelKey=\"acacpm_alise_title\" \r\n                  [options]=\"programClasses()\">\r\n                </cide-ele-select>\r\n                <p class=\"tw-text-xs tw-text-gray-500 tw-mt-1\">\r\n                  <cide-ele-icon name=\"info\" class=\"tw-w-4 tw-h-4 tw-mr-1\"></cide-ele-icon>\r\n                  Sequence will be automatically assigned based on the order in the listing\r\n                </p>\r\n              </div>\r\n            </div>\r\n\r\n            <!-- Branch Name and Code -->\r\n            <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n              <div>\r\n                <cide-ele-input \r\n                  label=\"Branch Name *\" \r\n                  formControlName=\"acabrn_name\"\r\n                  placeholder=\"e.g., Computer Science Branch\" \r\n                  size=\"md\" \r\n                  leadingIcon=\"account_tree\"\r\n                  [disabled]=\"isViewMode()\">\r\n                </cide-ele-input>\r\n              </div>\r\n\r\n              <div>\r\n                <cide-ele-input \r\n                  label=\"Branch Code *\" \r\n                  formControlName=\"acabrn_code\"\r\n                  placeholder=\"e.g., CS\" \r\n                  size=\"md\" \r\n                  leadingIcon=\"code\"\r\n                  [disabled]=\"isViewMode()\">\r\n                </cide-ele-input>\r\n              </div>\r\n            </div>\r\n\r\n            <!-- Status and Lock Options -->\r\n            <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n              <div class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200 tw-cursor-pointer hover:tw-bg-gray-100 tw-transition-colors tw-duration-200\"\r\n                   [class.tw-cursor-not-allowed]=\"isViewMode()\"\r\n                   [class.tw-opacity-60]=\"isViewMode()\"\r\n                   (click)=\"onActiveCardClick()\">\r\n                <cide-ele-input formControlName=\"acabrn_isactive\" type=\"checkbox\" size=\"md\" [disabled]=\"isViewMode()\">\r\n                </cide-ele-input>\r\n                <div class=\"tw-flex tw-flex-col\">\r\n                  <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Active</span>\r\n                  <span class=\"tw-text-xs tw-text-gray-500\">Enable/disable this branch</span>\r\n                </div>\r\n              </div>\r\n\r\n              <div class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200 tw-cursor-pointer hover:tw-bg-gray-100 tw-transition-colors tw-duration-200\"\r\n                   [class.tw-cursor-not-allowed]=\"isViewMode()\"\r\n                   [class.tw-opacity-60]=\"isViewMode()\"\r\n                   (click)=\"onLockedCardClick()\">\r\n                <cide-ele-input formControlName=\"acabrn_islocked\" type=\"checkbox\" size=\"md\" [disabled]=\"isViewMode()\">\r\n                </cide-ele-input>\r\n                <div class=\"tw-flex tw-flex-col\">\r\n                  <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Locked</span>\r\n                  <span class=\"tw-text-xs tw-text-gray-500\">Prevent modifications</span>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- Form Actions -->\r\n    <div class=\"tw-table-row tw-h-0\">\r\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-2 tw-bg-gray-50 tw-border-t tw-border-gray-200\">\r\n        <div class=\"tw-flex tw-justify-end tw-gap-4\">\r\n          <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"resetForm()\" leftIcon=\"refresh\"\r\n            [disabled]=\"loading()\">\r\n            Reset Form\r\n          </button>\r\n\r\n          <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"onCancel()\" leftIcon=\"close\"\r\n            [disabled]=\"loading()\">\r\n            {{ isViewMode() ? 'Close' : 'Cancel' }}\r\n          </button>\r\n\r\n          @if (!isViewMode()) {\r\n            <button cideEleButton type=\"submit\" variant=\"primary\" [disabled]=\"loading() || branchForm.invalid\"\r\n              [loading]=\"loading()\" leftIcon=\"save\">\r\n              {{ submitButtonText }}\r\n            </button>\r\n          }\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </form>\r\n</div>\r\n\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton]", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey"], outputs: ["ngModelChange", "change", "searchChange"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: CideLytClassProgramBranchFormComponent, isStandalone: true, selector: "cide-academics-class-program-branch-form", ngImport: i0, template: "<!-- \r\n  CLASS PROGRAM BRANCH FORM COMPONENT\r\n  \r\n  Enterprise-Level Styling with Tailwind CSS\r\n  Features: Responsive grids, proper typography, enhanced user experience\r\n-->\r\n\r\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'class_program_branch' }\"\r\n  [breadcrumb_data]=\"breadcrumbData()\">\r\n  <div class=\"tw-w-full tw-h-full\">\r\n    <form class=\"tw-w-full tw-table tw-h-full tw-bg-transparent\" [formGroup]=\"branchForm\"\r\n      [class.tw-opacity-60]=\"loading()\" (ngSubmit)=\"onSubmit()\">\r\n\r\n      <!-- Form Content -->\r\n      <div class=\"tw-table-row\">\r\n        <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-6\">\r\n          <div class=\"tw-transition-opacity tw-duration-300\" [class.tw-opacity-60]=\"loading()\">\r\n\r\n            <!-- Error Message -->\r\n            @if (error()) {\r\n            <div class=\"tw-mb-6 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\r\n              <div class=\"tw-flex tw-items-start\">\r\n                <cide-ele-icon name=\"error\"\r\n                  class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\r\n                <div class=\"tw-ml-3\">\r\n                  <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\r\n                  <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\r\n                </div>\r\n              </div>\r\n            </div>\r\n            }\r\n\r\n            <!-- Basic Branch Information -->\r\n            <div class=\"tw-space-y-6\">\r\n              <!-- Class Program Selection -->\r\n              <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-1 tw-gap-6\">\r\n                <div class=\"tw-space-y-2\">\r\n                  <label class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Class Program *</label>\r\n                  <cide-ele-select formControlName=\"acabrn_class_program_id_acacpm\" placeholder=\"Select class program\"\r\n                    [disabled]=\"isViewMode()\" valueKey=\"_id\" labelKey=\"acacpm_alise_title\" [options]=\"programClasses()\">\r\n                  </cide-ele-select>\r\n                  <p class=\"tw-text-xs tw-text-gray-500 tw-mt-1\">\r\n                    <cide-ele-icon name=\"info\" class=\"tw-w-4 tw-h-4 tw-mr-1\"></cide-ele-icon>\r\n                    Sequence will be automatically assigned based on the order in the listing\r\n                  </p>\r\n                </div>\r\n              </div>\r\n\r\n              <!-- Standard Branch Name (SYGMS) -->\r\n              <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-1 tw-gap-6\">\r\n                <div class=\"tw-space-y-2\">\r\n                  <label class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Standard Branch Name</label>\r\n                  <cide-ele-select formControlName=\"acabrn_branch_id_sygms\" placeholder=\"Select standard branch name\"\r\n                    [disabled]=\"isViewMode()\" valueKey=\"_id\" labelKey=\"sygms_title\" [options]=\"branchMasters()\">\r\n                  </cide-ele-select>\r\n                  <p class=\"tw-text-xs tw-text-gray-500 tw-mt-1\">\r\n                    <cide-ele-icon name=\"info\" class=\"tw-w-4 tw-h-4 tw-mr-1\"></cide-ele-icon>\r\n                    Selecting a standard branch will auto-populate the branch name and code\r\n                  </p>\r\n                </div>\r\n              </div>\r\n\r\n              <!-- Branch Name and Code -->\r\n              <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n                <div>\r\n                  <cide-ele-input label=\"Branch Name *\" formControlName=\"acabrn_name\"\r\n                    placeholder=\"e.g., Computer Science Branch\" size=\"md\" [disabled]=\"isViewMode()\">\r\n                  </cide-ele-input>\r\n                </div>\r\n\r\n                <div>\r\n                  <cide-ele-input label=\"Branch Code *\" formControlName=\"acabrn_code\" placeholder=\"e.g., CS\" size=\"md\"\r\n                    leadingIcon=\"code\" [disabled]=\"isViewMode()\">\r\n                  </cide-ele-input>\r\n                </div>\r\n              </div>\r\n\r\n              <!-- Status and Lock Options -->\r\n              <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n                <div\r\n                  class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200 tw-cursor-pointer hover:tw-bg-gray-100 tw-transition-colors tw-duration-200\"\r\n                  [class.tw-cursor-not-allowed]=\"isViewMode()\" [class.tw-opacity-60]=\"isViewMode()\"\r\n                  (click)=\"onActiveCardClick()\">\r\n                  <cide-ele-input formControlName=\"acabrn_isactive\" type=\"checkbox\" size=\"md\" [disabled]=\"isViewMode()\">\r\n                  </cide-ele-input>\r\n                  <div class=\"tw-flex tw-flex-col\">\r\n                    <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Active</span>\r\n                    <span class=\"tw-text-xs tw-text-gray-500\">Enable/disable this branch</span>\r\n                  </div>\r\n                </div>\r\n\r\n                <div\r\n                  class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200 tw-cursor-pointer hover:tw-bg-gray-100 tw-transition-colors tw-duration-200\"\r\n                  [class.tw-cursor-not-allowed]=\"isViewMode()\" [class.tw-opacity-60]=\"isViewMode()\"\r\n                  (click)=\"onLockedCardClick()\">\r\n                  <cide-ele-input formControlName=\"acabrn_islocked\" type=\"checkbox\" size=\"md\" [disabled]=\"isViewMode()\">\r\n                  </cide-ele-input>\r\n                  <div class=\"tw-flex tw-flex-col\">\r\n                    <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Locked</span>\r\n                    <span class=\"tw-text-xs tw-text-gray-500\">Prevent modifications</span>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n\r\n      <!-- Form Actions -->\r\n      <div class=\"tw-table-row tw-h-0\">\r\n        <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-2 tw-bg-gray-50 tw-border-t tw-border-gray-200\">\r\n          <div class=\"tw-flex tw-justify-end tw-gap-4\">\r\n            <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"resetForm()\" leftIcon=\"refresh\"\r\n              [disabled]=\"loading()\">\r\n              Reset Form\r\n            </button>\r\n\r\n            <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"onCancel()\" leftIcon=\"close\"\r\n              [disabled]=\"loading()\">\r\n              {{ isViewMode() ? 'Close' : 'Cancel' }}\r\n            </button>\r\n\r\n            @if (!isViewMode()) {\r\n            <button cideEleButton type=\"submit\" variant=\"primary\" [disabled]=\"loading() || branchForm.invalid\"\r\n              [loading]=\"loading()\" leftIcon=\"save\">\r\n              {{ submitButtonText }}\r\n            </button>\r\n            }\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </form>\r\n  </div>\r\n</cide-lyt-shared-wrapper>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey"], outputs: ["ngModelChange", "change", "searchChange"] }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CideLytClassProgramBranchFormComponent, decorators: [{
             type: Component,
@@ -2778,7 +2913,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
                         CideEleButtonComponent,
                         CideIconComponent,
                         CideSelectComponent,
-                    ], template: "<!-- \r\n  CLASS PROGRAM BRANCH FORM COMPONENT\r\n  \r\n  Enterprise-Level Styling with Tailwind CSS\r\n  Features: Responsive grids, proper typography, enhanced user experience\r\n-->\r\n\r\n<div class=\"tw-w-full tw-h-full\">\r\n  <form class=\"tw-w-full tw-table tw-h-full tw-bg-transparent\" [formGroup]=\"branchForm\"\r\n    [class.tw-opacity-60]=\"loading()\" (ngSubmit)=\"onSubmit()\">\r\n\r\n    <!-- Simple Header Section -->\r\n    <div class=\"tw-table-row tw-w-full tw-h-0\">\r\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\r\n        <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\r\n          \r\n          <!-- Title -->\r\n          <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n            <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">account_tree</cide-ele-icon>\r\n            <h5 class=\"tw-text-base tw-font-medium tw-text-gray-900 tw-m-0\">\r\n              {{ formTitle }}\r\n            </h5>\r\n          </div>\r\n\r\n          <!-- Actions -->\r\n          <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\r\n            <!-- Back button or other actions can be added here if needed -->\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- Form Content -->\r\n    <div class=\"tw-table-row\">\r\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-6\">\r\n        <div class=\"tw-transition-opacity tw-duration-300\" [class.tw-opacity-60]=\"loading()\">\r\n          \r\n          <!-- Error Message -->\r\n          @if (error()) {\r\n            <div class=\"tw-mb-6 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\r\n              <div class=\"tw-flex tw-items-start\">\r\n                <cide-ele-icon name=\"error\" class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\r\n                <div class=\"tw-ml-3\">\r\n                  <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\r\n                  <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          }\r\n\r\n          <!-- Basic Branch Information -->\r\n          <div class=\"tw-space-y-6\">\r\n            <!-- Class Program Selection -->\r\n            <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-1 tw-gap-6\">\r\n              <div class=\"tw-space-y-2\">\r\n                <label class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Class Program *</label>\r\n                <cide-ele-select \r\n                  formControlName=\"acabrn_class_program_id_acacpm\" \r\n                  placeholder=\"Select class program\"\r\n                  [disabled]=\"isViewMode()\" \r\n                  valueKey=\"_id\" \r\n                  labelKey=\"acacpm_alise_title\" \r\n                  [options]=\"programClasses()\">\r\n                </cide-ele-select>\r\n                <p class=\"tw-text-xs tw-text-gray-500 tw-mt-1\">\r\n                  <cide-ele-icon name=\"info\" class=\"tw-w-4 tw-h-4 tw-mr-1\"></cide-ele-icon>\r\n                  Sequence will be automatically assigned based on the order in the listing\r\n                </p>\r\n              </div>\r\n            </div>\r\n\r\n            <!-- Branch Name and Code -->\r\n            <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n              <div>\r\n                <cide-ele-input \r\n                  label=\"Branch Name *\" \r\n                  formControlName=\"acabrn_name\"\r\n                  placeholder=\"e.g., Computer Science Branch\" \r\n                  size=\"md\" \r\n                  leadingIcon=\"account_tree\"\r\n                  [disabled]=\"isViewMode()\">\r\n                </cide-ele-input>\r\n              </div>\r\n\r\n              <div>\r\n                <cide-ele-input \r\n                  label=\"Branch Code *\" \r\n                  formControlName=\"acabrn_code\"\r\n                  placeholder=\"e.g., CS\" \r\n                  size=\"md\" \r\n                  leadingIcon=\"code\"\r\n                  [disabled]=\"isViewMode()\">\r\n                </cide-ele-input>\r\n              </div>\r\n            </div>\r\n\r\n            <!-- Status and Lock Options -->\r\n            <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n              <div class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200 tw-cursor-pointer hover:tw-bg-gray-100 tw-transition-colors tw-duration-200\"\r\n                   [class.tw-cursor-not-allowed]=\"isViewMode()\"\r\n                   [class.tw-opacity-60]=\"isViewMode()\"\r\n                   (click)=\"onActiveCardClick()\">\r\n                <cide-ele-input formControlName=\"acabrn_isactive\" type=\"checkbox\" size=\"md\" [disabled]=\"isViewMode()\">\r\n                </cide-ele-input>\r\n                <div class=\"tw-flex tw-flex-col\">\r\n                  <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Active</span>\r\n                  <span class=\"tw-text-xs tw-text-gray-500\">Enable/disable this branch</span>\r\n                </div>\r\n              </div>\r\n\r\n              <div class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200 tw-cursor-pointer hover:tw-bg-gray-100 tw-transition-colors tw-duration-200\"\r\n                   [class.tw-cursor-not-allowed]=\"isViewMode()\"\r\n                   [class.tw-opacity-60]=\"isViewMode()\"\r\n                   (click)=\"onLockedCardClick()\">\r\n                <cide-ele-input formControlName=\"acabrn_islocked\" type=\"checkbox\" size=\"md\" [disabled]=\"isViewMode()\">\r\n                </cide-ele-input>\r\n                <div class=\"tw-flex tw-flex-col\">\r\n                  <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Locked</span>\r\n                  <span class=\"tw-text-xs tw-text-gray-500\">Prevent modifications</span>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- Form Actions -->\r\n    <div class=\"tw-table-row tw-h-0\">\r\n      <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-2 tw-bg-gray-50 tw-border-t tw-border-gray-200\">\r\n        <div class=\"tw-flex tw-justify-end tw-gap-4\">\r\n          <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"resetForm()\" leftIcon=\"refresh\"\r\n            [disabled]=\"loading()\">\r\n            Reset Form\r\n          </button>\r\n\r\n          <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"onCancel()\" leftIcon=\"close\"\r\n            [disabled]=\"loading()\">\r\n            {{ isViewMode() ? 'Close' : 'Cancel' }}\r\n          </button>\r\n\r\n          @if (!isViewMode()) {\r\n            <button cideEleButton type=\"submit\" variant=\"primary\" [disabled]=\"loading() || branchForm.invalid\"\r\n              [loading]=\"loading()\" leftIcon=\"save\">\r\n              {{ submitButtonText }}\r\n            </button>\r\n          }\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </form>\r\n</div>\r\n\r\n" }]
+                        CideLytSharedWrapperComponent,
+                    ], template: "<!-- \r\n  CLASS PROGRAM BRANCH FORM COMPONENT\r\n  \r\n  Enterprise-Level Styling with Tailwind CSS\r\n  Features: Responsive grids, proper typography, enhanced user experience\r\n-->\r\n\r\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'class_program_branch' }\"\r\n  [breadcrumb_data]=\"breadcrumbData()\">\r\n  <div class=\"tw-w-full tw-h-full\">\r\n    <form class=\"tw-w-full tw-table tw-h-full tw-bg-transparent\" [formGroup]=\"branchForm\"\r\n      [class.tw-opacity-60]=\"loading()\" (ngSubmit)=\"onSubmit()\">\r\n\r\n      <!-- Form Content -->\r\n      <div class=\"tw-table-row\">\r\n        <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-6\">\r\n          <div class=\"tw-transition-opacity tw-duration-300\" [class.tw-opacity-60]=\"loading()\">\r\n\r\n            <!-- Error Message -->\r\n            @if (error()) {\r\n            <div class=\"tw-mb-6 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\r\n              <div class=\"tw-flex tw-items-start\">\r\n                <cide-ele-icon name=\"error\"\r\n                  class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\r\n                <div class=\"tw-ml-3\">\r\n                  <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\r\n                  <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\r\n                </div>\r\n              </div>\r\n            </div>\r\n            }\r\n\r\n            <!-- Basic Branch Information -->\r\n            <div class=\"tw-space-y-6\">\r\n              <!-- Class Program Selection -->\r\n              <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-1 tw-gap-6\">\r\n                <div class=\"tw-space-y-2\">\r\n                  <label class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Class Program *</label>\r\n                  <cide-ele-select formControlName=\"acabrn_class_program_id_acacpm\" placeholder=\"Select class program\"\r\n                    [disabled]=\"isViewMode()\" valueKey=\"_id\" labelKey=\"acacpm_alise_title\" [options]=\"programClasses()\">\r\n                  </cide-ele-select>\r\n                  <p class=\"tw-text-xs tw-text-gray-500 tw-mt-1\">\r\n                    <cide-ele-icon name=\"info\" class=\"tw-w-4 tw-h-4 tw-mr-1\"></cide-ele-icon>\r\n                    Sequence will be automatically assigned based on the order in the listing\r\n                  </p>\r\n                </div>\r\n              </div>\r\n\r\n              <!-- Standard Branch Name (SYGMS) -->\r\n              <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-1 tw-gap-6\">\r\n                <div class=\"tw-space-y-2\">\r\n                  <label class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Standard Branch Name</label>\r\n                  <cide-ele-select formControlName=\"acabrn_branch_id_sygms\" placeholder=\"Select standard branch name\"\r\n                    [disabled]=\"isViewMode()\" valueKey=\"_id\" labelKey=\"sygms_title\" [options]=\"branchMasters()\">\r\n                  </cide-ele-select>\r\n                  <p class=\"tw-text-xs tw-text-gray-500 tw-mt-1\">\r\n                    <cide-ele-icon name=\"info\" class=\"tw-w-4 tw-h-4 tw-mr-1\"></cide-ele-icon>\r\n                    Selecting a standard branch will auto-populate the branch name and code\r\n                  </p>\r\n                </div>\r\n              </div>\r\n\r\n              <!-- Branch Name and Code -->\r\n              <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n                <div>\r\n                  <cide-ele-input label=\"Branch Name *\" formControlName=\"acabrn_name\"\r\n                    placeholder=\"e.g., Computer Science Branch\" size=\"md\" [disabled]=\"isViewMode()\">\r\n                  </cide-ele-input>\r\n                </div>\r\n\r\n                <div>\r\n                  <cide-ele-input label=\"Branch Code *\" formControlName=\"acabrn_code\" placeholder=\"e.g., CS\" size=\"md\"\r\n                    leadingIcon=\"code\" [disabled]=\"isViewMode()\">\r\n                  </cide-ele-input>\r\n                </div>\r\n              </div>\r\n\r\n              <!-- Status and Lock Options -->\r\n              <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-6\">\r\n                <div\r\n                  class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200 tw-cursor-pointer hover:tw-bg-gray-100 tw-transition-colors tw-duration-200\"\r\n                  [class.tw-cursor-not-allowed]=\"isViewMode()\" [class.tw-opacity-60]=\"isViewMode()\"\r\n                  (click)=\"onActiveCardClick()\">\r\n                  <cide-ele-input formControlName=\"acabrn_isactive\" type=\"checkbox\" size=\"md\" [disabled]=\"isViewMode()\">\r\n                  </cide-ele-input>\r\n                  <div class=\"tw-flex tw-flex-col\">\r\n                    <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Active</span>\r\n                    <span class=\"tw-text-xs tw-text-gray-500\">Enable/disable this branch</span>\r\n                  </div>\r\n                </div>\r\n\r\n                <div\r\n                  class=\"tw-flex tw-items-center tw-gap-3 tw-p-4 tw-bg-gray-50 tw-rounded-lg tw-border tw-border-gray-200 tw-cursor-pointer hover:tw-bg-gray-100 tw-transition-colors tw-duration-200\"\r\n                  [class.tw-cursor-not-allowed]=\"isViewMode()\" [class.tw-opacity-60]=\"isViewMode()\"\r\n                  (click)=\"onLockedCardClick()\">\r\n                  <cide-ele-input formControlName=\"acabrn_islocked\" type=\"checkbox\" size=\"md\" [disabled]=\"isViewMode()\">\r\n                  </cide-ele-input>\r\n                  <div class=\"tw-flex tw-flex-col\">\r\n                    <span class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Locked</span>\r\n                    <span class=\"tw-text-xs tw-text-gray-500\">Prevent modifications</span>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n\r\n      <!-- Form Actions -->\r\n      <div class=\"tw-table-row tw-h-0\">\r\n        <div class=\"tw-table-cell tw-w-full tw-px-6 tw-py-2 tw-bg-gray-50 tw-border-t tw-border-gray-200\">\r\n          <div class=\"tw-flex tw-justify-end tw-gap-4\">\r\n            <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"resetForm()\" leftIcon=\"refresh\"\r\n              [disabled]=\"loading()\">\r\n              Reset Form\r\n            </button>\r\n\r\n            <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"onCancel()\" leftIcon=\"close\"\r\n              [disabled]=\"loading()\">\r\n              {{ isViewMode() ? 'Close' : 'Cancel' }}\r\n            </button>\r\n\r\n            @if (!isViewMode()) {\r\n            <button cideEleButton type=\"submit\" variant=\"primary\" [disabled]=\"loading() || branchForm.invalid\"\r\n              [loading]=\"loading()\" leftIcon=\"save\">\r\n              {{ submitButtonText }}\r\n            </button>\r\n            }\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </form>\r\n  </div>\r\n</cide-lyt-shared-wrapper>" }]
         }], ctorParameters: () => [] });
 
 var classProgramBranchForm_component = /*#__PURE__*/Object.freeze({
@@ -2799,4 +2935,4 @@ var classProgramBranchForm_component = /*#__PURE__*/Object.freeze({
  */
 
 export { AcademicYearCreateComponent as A, CideLytProgramClassService as C, CideLytAcademicYearService as a, CideLytClassProgramBranchService as b, academicsRoutes as c, AcademicYearListComponent as d, CideLytAcademicYearMappingService as e, CideLytClassProgramBranchListComponent as f, CideLytClassProgramBranchFormComponent as g };
-//# sourceMappingURL=cloud-ide-academics-cloud-ide-academics-BP1hZ-yx.mjs.map
+//# sourceMappingURL=cloud-ide-academics-cloud-ide-academics-DsKIXC7E.mjs.map