cloud-ide-layout 1.0.139 → 1.0.142
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/{cloud-ide-layout-cloud-ide-layout-CwOMv3cc.mjs → cloud-ide-layout-cloud-ide-layout-kPzrNdq8.mjs} +141 -115
- package/fesm2022/cloud-ide-layout-cloud-ide-layout-kPzrNdq8.mjs.map +1 -0
- package/fesm2022/{cloud-ide-layout-dashboard-cards.service-BbJ4rb2S.mjs → cloud-ide-layout-dashboard-cards.service-BGaKcq7H.mjs} +4 -4
- package/fesm2022/{cloud-ide-layout-dashboard-cards.service-BbJ4rb2S.mjs.map → cloud-ide-layout-dashboard-cards.service-BGaKcq7H.mjs.map} +1 -1
- package/fesm2022/{cloud-ide-layout-dashboard-manager.component-BVBKPq94.mjs → cloud-ide-layout-dashboard-manager.component-DzI_ZzYo.mjs} +6 -6
- package/fesm2022/{cloud-ide-layout-dashboard-manager.component-BVBKPq94.mjs.map → cloud-ide-layout-dashboard-manager.component-DzI_ZzYo.mjs.map} +1 -1
- package/fesm2022/{cloud-ide-layout-drawer-theme.component-DvhSjxA0.mjs → cloud-ide-layout-drawer-theme.component-DKtGyOSb.mjs} +5 -5
- package/fesm2022/{cloud-ide-layout-drawer-theme.component-DvhSjxA0.mjs.map → cloud-ide-layout-drawer-theme.component-DKtGyOSb.mjs.map} +1 -1
- package/fesm2022/{cloud-ide-layout-floating-entity-selection.component-QL_SZ8AH.mjs → cloud-ide-layout-floating-entity-selection.component-C8BmpX1i.mjs} +59 -10
- package/fesm2022/cloud-ide-layout-floating-entity-selection.component-C8BmpX1i.mjs.map +1 -0
- package/fesm2022/{cloud-ide-layout-home-wrapper.component-DvvYg3nw.mjs → cloud-ide-layout-home-wrapper.component-BglE2JPh.mjs} +12 -8
- package/fesm2022/cloud-ide-layout-home-wrapper.component-BglE2JPh.mjs.map +1 -0
- package/fesm2022/{cloud-ide-layout-sidedrawer-notes.component-8icfkbjy.mjs → cloud-ide-layout-sidedrawer-notes.component-BKzulMu8.mjs} +11 -11
- package/fesm2022/{cloud-ide-layout-sidedrawer-notes.component-8icfkbjy.mjs.map → cloud-ide-layout-sidedrawer-notes.component-BKzulMu8.mjs.map} +1 -1
- package/fesm2022/cloud-ide-layout.mjs +1 -1
- package/package.json +1 -1
- package/fesm2022/cloud-ide-layout-cloud-ide-layout-CwOMv3cc.mjs.map +0 -1
- package/fesm2022/cloud-ide-layout-floating-entity-selection.component-QL_SZ8AH.mjs.map +0 -1
- package/fesm2022/cloud-ide-layout-home-wrapper.component-DvvYg3nw.mjs.map +0 -1
|
@@ -19,10 +19,10 @@ import { merge } from 'lodash';
|
|
|
19
19
|
|
|
20
20
|
class CloudIdeLayoutService {
|
|
21
21
|
constructor() { }
|
|
22
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
23
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
22
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CloudIdeLayoutService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
23
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CloudIdeLayoutService, providedIn: 'root' });
|
|
24
24
|
}
|
|
25
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
25
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CloudIdeLayoutService, decorators: [{
|
|
26
26
|
type: Injectable,
|
|
27
27
|
args: [{
|
|
28
28
|
providedIn: 'root'
|
|
@@ -44,10 +44,10 @@ class CideLytHeaderService {
|
|
|
44
44
|
document.querySelector(`#cide-lyt-header-wrapper`)?.classList.remove('cide-lyt-header-wrapper-hide');
|
|
45
45
|
document.querySelector(`body`)?.classList.add('cide-lyt-header-exist');
|
|
46
46
|
}
|
|
47
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
48
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
47
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytHeaderService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
48
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytHeaderService, providedIn: 'root' });
|
|
49
49
|
}
|
|
50
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
50
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytHeaderService, decorators: [{
|
|
51
51
|
type: Injectable,
|
|
52
52
|
args: [{
|
|
53
53
|
providedIn: 'root'
|
|
@@ -92,10 +92,10 @@ class CideLytFileManagerService {
|
|
|
92
92
|
reader.readAsDataURL(file);
|
|
93
93
|
});
|
|
94
94
|
}
|
|
95
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
96
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
95
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytFileManagerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
96
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytFileManagerService, providedIn: 'root' });
|
|
97
97
|
}
|
|
98
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
98
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytFileManagerService, decorators: [{
|
|
99
99
|
type: Injectable,
|
|
100
100
|
args: [{
|
|
101
101
|
providedIn: 'root'
|
|
@@ -121,10 +121,10 @@ class CideLytSidebarService {
|
|
|
121
121
|
document.querySelector(`#cide-lyt-sidebar-page`)?.classList.remove('cide-lyt-sidebar-page-hide');
|
|
122
122
|
document.querySelector(`body`)?.classList.add('cide-lyt-sidebar-exist');
|
|
123
123
|
}
|
|
124
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
125
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
124
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytSidebarService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
125
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytSidebarService, providedIn: 'root' });
|
|
126
126
|
}
|
|
127
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
127
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytSidebarService, decorators: [{
|
|
128
128
|
type: Injectable,
|
|
129
129
|
args: [{
|
|
130
130
|
providedIn: 'root'
|
|
@@ -146,10 +146,10 @@ class CideLytFooterService {
|
|
|
146
146
|
document.querySelector(`#cide-lyt-footer-console-wrapper`)?.classList.remove('cide-lyt-footer-console-wrapper-hide');
|
|
147
147
|
document.querySelector(`body`)?.classList.add('cide-lyt-footer-exist');
|
|
148
148
|
}
|
|
149
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
150
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
149
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytFooterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
150
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytFooterService, providedIn: 'root' });
|
|
151
151
|
}
|
|
152
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
152
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytFooterService, decorators: [{
|
|
153
153
|
type: Injectable,
|
|
154
154
|
args: [{
|
|
155
155
|
providedIn: 'root'
|
|
@@ -171,10 +171,10 @@ class CideLytConsoleService {
|
|
|
171
171
|
document.querySelector(`#cide-lyt-console-wrapper`)?.classList.remove('cide-lyt-console-wrapper-hide');
|
|
172
172
|
document.querySelector(`body`)?.classList.remove('cide-lyt-console-exist');
|
|
173
173
|
}
|
|
174
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
175
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
174
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytConsoleService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
175
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytConsoleService, providedIn: 'root' });
|
|
176
176
|
}
|
|
177
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
177
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytConsoleService, decorators: [{
|
|
178
178
|
type: Injectable,
|
|
179
179
|
args: [{
|
|
180
180
|
providedIn: 'root'
|
|
@@ -237,10 +237,10 @@ class CideLytSidedrawerService {
|
|
|
237
237
|
setActiveComponent(configFor) {
|
|
238
238
|
this.activeComponentSignal.set(configFor);
|
|
239
239
|
}
|
|
240
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
241
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
240
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytSidedrawerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
241
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytSidedrawerService, providedIn: 'root' });
|
|
242
242
|
}
|
|
243
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
243
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytSidedrawerService, decorators: [{
|
|
244
244
|
type: Injectable,
|
|
245
245
|
args: [{
|
|
246
246
|
providedIn: 'root'
|
|
@@ -579,10 +579,10 @@ class AppStateService {
|
|
|
579
579
|
}
|
|
580
580
|
});
|
|
581
581
|
}
|
|
582
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
583
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
582
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AppStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
583
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AppStateService, providedIn: 'root' });
|
|
584
584
|
}
|
|
585
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
585
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AppStateService, decorators: [{
|
|
586
586
|
type: Injectable,
|
|
587
587
|
args: [{
|
|
588
588
|
providedIn: 'root'
|
|
@@ -735,7 +735,13 @@ class AppStateHelperService {
|
|
|
735
735
|
* This replaces the previous isModuleActive method to use setActiveModule instead of getActiveModuleId
|
|
736
736
|
*/
|
|
737
737
|
setActiveModuleById(moduleId) {
|
|
738
|
-
|
|
738
|
+
// Include entity ID to get menus/rights as per logged in entity
|
|
739
|
+
const entityId = this.getActiveEntityId();
|
|
740
|
+
return this.sidebarService.getSidebarMenues({
|
|
741
|
+
syme_type: "module",
|
|
742
|
+
sort: 'asc',
|
|
743
|
+
syme_title: ""
|
|
744
|
+
}).pipe(map(response => {
|
|
739
745
|
const modules = response?.data || [];
|
|
740
746
|
const targetModule = modules.find(module => module._id === moduleId);
|
|
741
747
|
if (targetModule) {
|
|
@@ -794,10 +800,10 @@ class AppStateHelperService {
|
|
|
794
800
|
refreshFromLocalStorage() {
|
|
795
801
|
this.appStateService.refreshFromLocalStorage();
|
|
796
802
|
}
|
|
797
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
798
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
803
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AppStateHelperService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
804
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AppStateHelperService, providedIn: 'root' });
|
|
799
805
|
}
|
|
800
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
806
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AppStateHelperService, decorators: [{
|
|
801
807
|
type: Injectable,
|
|
802
808
|
args: [{
|
|
803
809
|
providedIn: 'root'
|
|
@@ -1274,7 +1280,13 @@ class CideLytSharedService {
|
|
|
1274
1280
|
console.log('🔍 SIDEBAR SYNC: Current route:', currentRoute);
|
|
1275
1281
|
console.log('🔍 SIDEBAR SYNC: Page code:', pageCode);
|
|
1276
1282
|
// Load sidebar modules and find the matching one
|
|
1277
|
-
|
|
1283
|
+
// Include entity ID to get menus/rights as per logged in entity
|
|
1284
|
+
const entityId = this.appState.getActiveEntityId();
|
|
1285
|
+
this.sidebarService.getSidebarMenues({
|
|
1286
|
+
syme_type: "module",
|
|
1287
|
+
sort: 'asc',
|
|
1288
|
+
syme_title: ""
|
|
1289
|
+
})
|
|
1278
1290
|
.subscribe({
|
|
1279
1291
|
next: (modulesResponse) => {
|
|
1280
1292
|
const modules = modulesResponse?.data || [];
|
|
@@ -1342,10 +1354,10 @@ class CideLytSharedService {
|
|
|
1342
1354
|
}
|
|
1343
1355
|
});
|
|
1344
1356
|
}
|
|
1345
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
1346
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
1357
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytSharedService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1358
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytSharedService, providedIn: 'root' });
|
|
1347
1359
|
}
|
|
1348
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
1360
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytSharedService, decorators: [{
|
|
1349
1361
|
type: Injectable,
|
|
1350
1362
|
args: [{
|
|
1351
1363
|
providedIn: 'root'
|
|
@@ -1367,7 +1379,7 @@ class CideLytFloatingEntitySelectionService {
|
|
|
1367
1379
|
}
|
|
1368
1380
|
try {
|
|
1369
1381
|
// Use relative import to avoid circular dependency
|
|
1370
|
-
const module = await import('./cloud-ide-layout-floating-entity-selection.component-
|
|
1382
|
+
const module = await import('./cloud-ide-layout-floating-entity-selection.component-C8BmpX1i.mjs');
|
|
1371
1383
|
if (module.CideLytFloatingEntitySelectionComponent) {
|
|
1372
1384
|
this.containerService.registerComponent('entity-selection-header', module.CideLytFloatingEntitySelectionComponent);
|
|
1373
1385
|
console.log('✅ Entity selection component registered successfully');
|
|
@@ -1436,10 +1448,10 @@ class CideLytFloatingEntitySelectionService {
|
|
|
1436
1448
|
const visibleContainers = this.containerService.visibleContainers();
|
|
1437
1449
|
return visibleContainers.some(container => container.id === 'entity-selection-header');
|
|
1438
1450
|
}
|
|
1439
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
1440
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
1451
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytFloatingEntitySelectionService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1452
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytFloatingEntitySelectionService, providedIn: 'root' });
|
|
1441
1453
|
}
|
|
1442
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
1454
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytFloatingEntitySelectionService, decorators: [{
|
|
1443
1455
|
type: Injectable,
|
|
1444
1456
|
args: [{
|
|
1445
1457
|
providedIn: 'root'
|
|
@@ -1653,10 +1665,10 @@ class NotificationSettingsService {
|
|
|
1653
1665
|
console.warn('Failed to save notification settings to localStorage:', error);
|
|
1654
1666
|
}
|
|
1655
1667
|
}
|
|
1656
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
1657
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
1668
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NotificationSettingsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1669
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NotificationSettingsService, providedIn: 'root' });
|
|
1658
1670
|
}
|
|
1659
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
1671
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NotificationSettingsService, decorators: [{
|
|
1660
1672
|
type: Injectable,
|
|
1661
1673
|
args: [{
|
|
1662
1674
|
providedIn: 'root'
|
|
@@ -1748,8 +1760,8 @@ class NotificationSettingsComponent {
|
|
|
1748
1760
|
this.settingsForm.patchValue(settings, { emitEvent: false });
|
|
1749
1761
|
this.notificationService.info('Settings reset to defaults');
|
|
1750
1762
|
}
|
|
1751
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
1752
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.
|
|
1763
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NotificationSettingsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1764
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: NotificationSettingsComponent, isStandalone: true, selector: "cide-lyt-notification-settings", ngImport: i0, template: `
|
|
1753
1765
|
<div class="notification-settings-container tw-p-6 tw-space-y-6 tw-bg-white dark:tw-bg-gray-900 tw-text-gray-900 dark:tw-text-gray-100">
|
|
1754
1766
|
<!-- Header -->
|
|
1755
1767
|
<div class="tw-flex tw-items-center tw-gap-2 tw-pb-3 tw-border-b tw-border-gray-200 dark:tw-border-gray-700">
|
|
@@ -1964,7 +1976,7 @@ class NotificationSettingsComponent {
|
|
|
1964
1976
|
</div>
|
|
1965
1977
|
`, isInline: true, styles: [":host{display:block}.notification-settings-container{color:#111827}:root:not([data-theme=dark]):not(.dark-mode) .notification-settings-container{background-color:#fff!important;color:#111827!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-settings-container *{color:inherit}.volume-slider-container{position:relative;width:100%}.volume-slider{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:3px;background:linear-gradient(to right,#e5e7eb 0% 100%);outline:none;cursor:pointer;transition:background .3s ease}:root:not([data-theme=dark]):not(.dark-mode) .volume-slider{background:linear-gradient(to right,#e5e7eb 0% 100%)}:root[data-theme=dark] .volume-slider,:root.dark-mode .volume-slider{background:linear-gradient(to right,#374151 0% 100%)}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:#2563eb;cursor:pointer;border:2px solid #ffffff;box-shadow:0 2px 4px #0003;transition:all .2s ease}.volume-slider::-webkit-slider-thumb:hover{background:#1d4ed8;transform:scale(1.1);box-shadow:0 3px 6px #0000004d}.volume-slider::-webkit-slider-thumb:active{transform:scale(1.2)}:root[data-theme=dark] .volume-slider::-webkit-slider-thumb,:root.dark-mode .volume-slider::-webkit-slider-thumb{background:#3b82f6;border-color:#1e293b}.volume-slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#2563eb;cursor:pointer;border:2px solid #ffffff;box-shadow:0 2px 4px #0003;transition:all .2s ease}.volume-slider::-moz-range-thumb:hover{background:#1d4ed8;transform:scale(1.1);box-shadow:0 3px 6px #0000004d}.volume-slider::-moz-range-thumb:active{transform:scale(1.2)}:root[data-theme=dark] .volume-slider::-moz-range-thumb,:root.dark-mode .volume-slider::-moz-range-thumb{background:#3b82f6;border-color:#1e293b}.volume-slider{background-size:var(--slider-value, 0%) 100%;background-repeat:no-repeat}:root:not([data-theme=dark]):not(.dark-mode) .notification-settings-container .tw-text-gray-700{color:#374151!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-settings-container .tw-text-gray-600{color:#4b5563!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-settings-container .tw-text-gray-500{color:#6b7280!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-settings-container .tw-text-gray-900{color:#111827!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-settings-container .tw-bg-gray-50{background-color:#f9fafb!important}\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.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.RangeValueAccessor, selector: "input[type=range][formControlName],input[type=range][formControl],input[type=range][ngModel]" }, { 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: 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: 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", "step", "size"], outputs: ["ngModelChange"] }, { 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", "treeView"], outputs: ["ngModelChange", "change", "searchChange"] }] });
|
|
1966
1978
|
}
|
|
1967
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
1979
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NotificationSettingsComponent, decorators: [{
|
|
1968
1980
|
type: Component,
|
|
1969
1981
|
args: [{ selector: 'cide-lyt-notification-settings', standalone: true, imports: [
|
|
1970
1982
|
CommonModule,
|
|
@@ -3373,8 +3385,12 @@ class CideLytHeaderWrapperComponent {
|
|
|
3373
3385
|
* Navigate to user profile page
|
|
3374
3386
|
*/
|
|
3375
3387
|
navigateToProfile() {
|
|
3376
|
-
|
|
3377
|
-
|
|
3388
|
+
const currentUserId = this.appStateService.currentUser()?._id;
|
|
3389
|
+
if (!currentUserId) {
|
|
3390
|
+
console.error('Cannot navigate to profile: User ID not found');
|
|
3391
|
+
return;
|
|
3392
|
+
}
|
|
3393
|
+
this.router.navigate(['/user-master/edit', currentUserId]);
|
|
3378
3394
|
}
|
|
3379
3395
|
/**
|
|
3380
3396
|
* Handle more options dropdown item clicks (DEPRECATED)
|
|
@@ -3521,10 +3537,10 @@ class CideLytHeaderWrapperComponent {
|
|
|
3521
3537
|
});
|
|
3522
3538
|
this.floatingContainerService.bringToFront(containerId);
|
|
3523
3539
|
}
|
|
3524
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
3525
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: CideLytHeaderWrapperComponent, isStandalone: true, selector: "cide-lyt-header-wrapper", viewQueries: [{ propertyName: "triggerTemplate", first: true, predicate: ["triggerTemplate"], descendants: true }, { propertyName: "financialYearTriggerTemplate", first: true, predicate: ["financialYearTriggerTemplate"], descendants: true }, { propertyName: "academicYearTriggerTemplate", first: true, predicate: ["academicYearTriggerTemplate"], descendants: true }, { propertyName: "notificationTriggerTemplate", first: true, predicate: ["notificationTriggerTemplate"], descendants: true }, { propertyName: "notificationDropdown", first: true, predicate: ["notificationDropdown"], descendants: true }], ngImport: i0, template: "<header id=\"cide-lyt-header-wrapper\" class=\"cide-lyt-header tw-w-full tw-select-none cide-lyt-header-wrapper-hide\">\n <!-- Logo Section -->\n <div class=\"tw-flex tw-items-center tw-gap-3\">\n <div class=\"header-logo-container tw-flex tw-items-center tw-gap-3 tw-cursor-pointer\" (click)=\"onLogoClick()\"\n (keydown.enter)=\"onLogoClick()\" (keydown.space)=\"onLogoClick()\" tabindex=\"0\" role=\"button\"\n aria-label=\"Navigate to home\" title=\"Click to go to control panel home\">\n @if (appStateService.activeEntity()?.syen_photo_id_cyfm) {\n <img cideEleFileImage [fileId]=\"(appStateService.activeEntity()?.syen_photo_id_cyfm || '')\"\n [altText]=\"'Entity Logo'\" class=\"tw-w-8 tw-h-8 tw-object-contain\">\n } @else {\n <cide-ele-icon name=\"business\" class=\"tw-w-8 tw-h-8 tw-text-blue-600\"></cide-ele-icon>\n }\n\n </div>\n @if (appStateService.activeEntity()?.syen_name) {\n <span\n class=\"tw-text-md tw-font-semibold tw-text-blue-600 hover:tw-text-blue-800 tw-cursor-pointer sm:block tw-transition-colors tw-duration-200 hover:tw-underline\"\n (click)=\"onEntityNameClick()\" title=\"Click to switch entity\">\n {{ appStateService.activeEntity()?.syen_name }}\n </span>\n }\n </div>\n <!-- Search Section -->\n <div class=\"header-search-container\">\n <cide-ele-input id=\"cide_lyt_header_search\" placeholder=\"Search...\" leadingIcon=\"search\"\n size=\"md\"></cide-ele-input>\n </div>\n\n <!-- Icons Section -->\n <div class=\"header-icons-container\">\n <!-- Financial Year Dropdown -->\n <div class=\"header-dropdown-container\" (mouseenter)=\"updateTooltipPosition($event)\">\n <cide-ele-dropdown [items]=\"financialYearItems()\" [config]=\"financialYearConfig\"\n [triggerTemplate]=\"financialYearTriggerTemplate\"\n (itemClick)=\"onFinancialYearClick($event)\">\n </cide-ele-dropdown>\n <div class=\"header-tooltip\">Financial Year</div>\n </div>\n \n <ng-template #financialYearTriggerTemplate let-isOpen=\"isOpen\">\n <div class=\"header-year-pill\">\n <cide-ele-icon size=\"2xs\" type=\"none\" class=\"tw-mr-1\">calendar_today</cide-ele-icon>\n <span class=\"header-year-pill-text\">{{ currentFinancialYearName() }}</span>\n </div>\n </ng-template>\n\n <!-- Academic Year Dropdown -->\n <div class=\"header-dropdown-container\" (mouseenter)=\"updateTooltipPosition($event)\">\n <cide-ele-dropdown [items]=\"academicYearItems()\" [config]=\"academicYearConfig\"\n [triggerTemplate]=\"academicYearTriggerTemplate\"\n (itemClick)=\"onAcademicYearClick($event)\">\n </cide-ele-dropdown>\n <div class=\"header-tooltip\">Academic Year</div>\n </div>\n \n <ng-template #academicYearTriggerTemplate let-isOpen=\"isOpen\">\n <div class=\"header-year-pill\">\n <cide-ele-icon size=\"2xs\" type=\"none\" class=\"tw-mr-1\">school</cide-ele-icon>\n <span class=\"header-year-pill-text\">{{ currentAcademicYearName() }}</span>\n </div>\n </ng-template>\n\n <!-- Notifications Dropdown -->\n <div class=\"header-dropdown-container\" (mouseenter)=\"updateTooltipPosition($event)\">\n <cide-ele-dropdown \n #notificationDropdown\n [items]=\"notificationItems()\" \n [config]=\"notificationConfig\"\n [triggerTemplate]=\"notificationTriggerTemplate\"\n [menuTemplate]=\"notificationMenuTemplate\"\n (itemClick)=\"onNotificationClick($event)\">\n </cide-ele-dropdown>\n <div class=\"header-tooltip\">Notifications</div>\n </div>\n \n <ng-template #notificationTriggerTemplate let-isOpen=\"isOpen\">\n <div class=\"header-icon notification-icon\" [class.active]=\"isOpen\">\n <cide-ele-icon>notifications</cide-ele-icon>\n @if (unreadCount() > 0) {\n <div class=\"header-badge\">{{ unreadCount() > 99 ? '99+' : unreadCount() }}</div>\n }\n </div>\n </ng-template>\n\n <!-- Custom Notification Menu Template -->\n <ng-template #notificationMenuTemplate let-items=\"items\">\n <div class=\"tw-min-w-[380px] tw-bg-white dark:tw-bg-gray-800 tw-rounded-xl tw-shadow-2xl tw-overflow-hidden tw-text-gray-900 dark:tw-text-gray-100\">\n <!-- Header - Fixed/Sticky -->\n <div class=\"tw-sticky tw-top-0 tw-z-10 tw-px-2.5 tw-py-1 tw-bg-white dark:tw-bg-gray-800 tw-flex tw-justify-between tw-items-center tw-border-b tw-border-gray-200 dark:tw-border-gray-700 tw-backdrop-blur-sm\">\n <div class=\"tw-flex tw-items-center tw-gap-1\">\n <div class=\"tw-w-5 tw-h-5 tw-bg-blue-500 tw-rounded tw-flex tw-items-center tw-justify-center tw-shadow-sm\">\n <cide-ele-icon class=\"!tw-text-[10px] !tw-text-white\">notifications</cide-ele-icon>\n </div>\n <div class=\"tw-flex tw-items-center tw-gap-1\">\n <h3 class=\"tw-m-0 tw-text-[10px] tw-font-bold tw-text-gray-900 dark:tw-text-gray-100 tw-leading-none\">Notifications</h3>\n @if (unreadCount() > 0) {\n <span class=\"tw-bg-red-500 tw-text-white tw-px-1 tw-py-0 tw-rounded-full tw-text-[7px] tw-font-bold tw-leading-none tw-animate-pulse\">{{ unreadCount() }}</span>\n }\n </div>\n </div>\n <div class=\"tw-flex tw-items-center tw-gap-0.5\">\n <button \n type=\"button\"\n class=\"tw-bg-transparent tw-border-none tw-p-0.5 tw-cursor-pointer tw-text-gray-600 dark:tw-text-gray-400 tw-flex tw-items-center tw-justify-center tw-rounded tw-transition-all tw-duration-200 hover:tw-bg-gray-100 dark:hover:tw-bg-gray-600 hover:tw-text-gray-900 dark:hover:tw-text-gray-200\"\n (click)=\"openNotificationSettings(); $event.stopPropagation()\"\n title=\"Notification Settings\">\n <cide-ele-icon class=\"!tw-text-xs\">settings</cide-ele-icon>\n </button>\n @if (unreadCount() > 0) {\n <button \n type=\"button\"\n class=\"tw-bg-blue-500 tw-text-white tw-px-1 tw-py-0.5 tw-rounded tw-text-[8px] tw-font-semibold tw-cursor-pointer tw-transition-all tw-duration-200 tw-flex tw-items-center tw-gap-0.5 tw-shadow-sm hover:tw-bg-blue-600 hover:tw-scale-105\"\n (click)=\"markAllAsRead(); $event.stopPropagation()\"\n title=\"Mark all as read\">\n <cide-ele-icon class=\"!tw-text-[9px]\">done_all</cide-ele-icon>\n </button>\n }\n <button \n type=\"button\" \n class=\"tw-bg-transparent tw-border-none tw-p-0.5 tw-cursor-pointer tw-text-gray-600 dark:tw-text-gray-400 tw-flex tw-items-center tw-justify-center tw-rounded tw-transition-all tw-duration-200 hover:tw-bg-gray-100 dark:hover:tw-bg-gray-600 hover:tw-text-gray-900 dark:hover:tw-text-gray-200 hover:tw-rotate-90\"\n (click)=\"closeNotificationDropdown($event)\"\n title=\"Close\">\n <cide-ele-icon class=\"!tw-text-xs\">close</cide-ele-icon>\n </button>\n </div>\n </div>\n\n <!-- Notifications List -->\n <div class=\"tw-overflow-x-hidden notification-scroll-container tw-bg-white dark:tw-bg-gray-800 tw-text-gray-900 dark:tw-text-gray-100\">\n @if (notifications().length === 0) {\n <div class=\"tw-py-16 tw-px-4 tw-text-center tw-bg-white dark:tw-bg-gray-800\">\n <cide-ele-icon class=\"!tw-text-6xl !tw-text-gray-300 dark:!tw-text-gray-600 tw-mb-3\">notifications_off</cide-ele-icon>\n <p class=\"tw-m-0 tw-text-sm tw-text-gray-600 dark:tw-text-gray-400 tw-font-medium\">No notifications yet</p>\n <p class=\"tw-m-0 tw-mt-1 tw-text-xs tw-text-gray-500 dark:tw-text-gray-500\">You're all caught up!</p>\n </div>\n } @else {\n @for (notif of notifications().slice(0, 15); track notif.id) {\n <div \n class=\"tw-flex tw-items-start tw-px-3 tw-py-2 tw-cursor-pointer tw-transition-all tw-duration-300 tw-relative tw-gap-2 tw-border-b tw-border-gray-200 dark:tw-border-gray-700 last:tw-border-b-0 hover:tw-bg-gray-50 dark:hover:tw-bg-gray-700 tw-transform tw-ease-in-out tw-bg-white dark:tw-bg-gray-800 tw-text-gray-900 dark:tw-text-gray-100\"\n [class.tw-border-l-2]=\"!isNotificationRead(notif)\"\n [class.tw-border-l-blue-500]=\"!isNotificationRead(notif)\"\n [class.dark:tw-border-l-blue-400]=\"!isNotificationRead(notif)\"\n [class.tw-bg-blue-50]=\"!isNotificationRead(notif)\"\n [class.dark:tw-bg-gray-700]=\"!isNotificationRead(notif)\"\n [class.-tw-translate-x-full]=\"isNotificationAnimating(notif)\"\n [class.tw-opacity-0]=\"isNotificationAnimating(notif)\"\n [class.tw-max-h-0]=\"isNotificationAnimating(notif)\"\n [class.tw-overflow-hidden]=\"isNotificationAnimating(notif)\"\n [class.tw-mb-0]=\"isNotificationAnimating(notif)\"\n [class.tw-p-0]=\"isNotificationAnimating(notif)\"\n (click)=\"onNotificationItemClick(notif)\">\n <!-- Icon/Avatar -->\n <div class=\"tw-flex-shrink-0 tw-relative\">\n <div class=\"tw-w-9 tw-h-9 tw-rounded-full tw-overflow-hidden tw-bg-gradient-to-br tw-from-blue-500 tw-to-blue-600 tw-flex tw-items-center tw-justify-center tw-shadow-sm tw-ring-1 tw-ring-white\">\n @if (getNotificationAvatar(notif)) {\n <img \n cideEleFileImage \n [fileId]=\"getNotificationAvatar(notif) || ''\"\n [altText]=\"getNotificationName(notif)\"\n class=\"tw-w-full tw-h-full tw-object-cover\">\n } @else {\n <cide-ele-icon class=\"!tw-text-base !tw-text-white\">{{ getNotificationIcon(notif.type) }}</cide-ele-icon>\n }\n </div>\n <!-- Green online indicator -->\n <div class=\"tw-absolute tw-bottom-0 tw-right-0 tw-w-2 tw-h-2 tw-bg-green-500 tw-rounded-full tw-border tw-border-white\"></div>\n </div>\n\n <!-- Content -->\n <div class=\"tw-flex-1 tw-min-w-0\">\n <!-- Title and relative time -->\n <div class=\"tw-flex tw-items-start tw-justify-between tw-gap-1.5 tw-mb-0.5\">\n <div class=\"tw-flex-1 tw-min-w-0\">\n <h4 class=\"tw-m-0 tw-text-[11px] tw-font-bold tw-text-gray-900 dark:tw-text-gray-100 tw-leading-tight\">\n <span class=\"tw-text-blue-600 dark:tw-text-blue-400\">{{ getNotificationName(notif) }}</span><span class=\"tw-font-normal tw-text-gray-800 dark:tw-text-gray-300\"> {{ getNotificationAction(notif) }}</span>\n </h4>\n <p class=\"tw-m-0 tw-text-[9px] tw-text-gray-500 dark:tw-text-gray-500 tw-mt-0.5\">{{ getTimeAgo(notif.timestamp) }}</p>\n </div>\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-flex-shrink-0\">\n @if (!isNotificationRead(notif)) {\n <div class=\"tw-w-1.5 tw-h-1.5 tw-rounded-full tw-bg-blue-500 dark:tw-bg-blue-400 tw-animate-pulse\"></div>\n }\n @if (isNotificationAnimating(notif) && isNotificationUndoable(notif)) {\n <button \n type=\"button\"\n (click)=\"undoNotificationRemoval(getNotificationId(notif)); $event.stopPropagation()\"\n class=\"tw-px-2 tw-py-0.5 tw-text-[9px] tw-font-semibold tw-text-blue-600 dark:tw-text-blue-400 tw-bg-blue-50 dark:tw-bg-blue-900 tw-border tw-border-blue-200 dark:tw-border-blue-700 tw-rounded-md tw-cursor-pointer tw-transition-all tw-duration-200 hover:tw-bg-blue-100 dark:hover:tw-bg-blue-800 hover:tw-border-blue-300 dark:hover:tw-border-blue-600 hover:tw-scale-105 tw-whitespace-nowrap tw-animate-pulse\">\n Undo\n </button>\n }\n </div>\n </div>\n \n <!-- Message -->\n @if (notif.message && notif.message !== notif.title) {\n <p class=\"tw-m-0 tw-mt-1 tw-text-[10px] tw-text-gray-700 dark:tw-text-gray-400 tw-leading-snug tw-line-clamp-2\">\n {{ notif.message }}\n </p>\n }\n \n <!-- Comment -->\n @if (notif.data?.comment) {\n <div class=\"tw-mt-1.5 tw-py-1.5 tw-px-2.5 tw-bg-gray-100 dark:tw-bg-gray-700 tw-rounded-md tw-border-l-2 tw-border-l-blue-500 dark:tw-border-l-blue-500\">\n <p class=\"tw-m-0 tw-text-[10px] tw-text-gray-800 dark:tw-text-gray-300 tw-leading-snug tw-italic tw-line-clamp-2\">{{ notif.data.comment }}</p>\n </div>\n }\n \n <!-- File -->\n @if (notif.data?.file) {\n <div class=\"tw-mt-1.5 tw-py-1.5 tw-px-2.5 tw-bg-gray-100 dark:tw-bg-gray-700 tw-border tw-border-gray-300 dark:tw-border-gray-600 tw-rounded-md tw-flex tw-items-center tw-gap-2\">\n <div class=\"tw-w-7 tw-h-7 tw-bg-blue-100 dark:tw-bg-blue-900 tw-rounded-md tw-flex tw-items-center tw-justify-center tw-flex-shrink-0\">\n <span class=\"tw-text-[9px] tw-font-bold tw-text-blue-700 dark:tw-text-blue-300\">{{ getFileIcon(notif.data.file.type) }}</span>\n </div>\n <div class=\"tw-flex-1 tw-min-w-0\">\n <p class=\"tw-m-0 tw-text-[10px] tw-font-semibold tw-text-gray-900 dark:tw-text-gray-100 tw-overflow-hidden tw-text-ellipsis tw-whitespace-nowrap\">{{ notif.data.file.name }}</p>\n <p class=\"tw-m-0 tw-text-[9px] tw-text-gray-600 dark:tw-text-gray-400\">{{ notif.data.file.size }}</p>\n </div>\n <cide-ele-icon class=\"!tw-text-sm !tw-text-blue-600 dark:!tw-text-blue-400 tw-cursor-pointer tw-transition-all tw-duration-200 tw-flex-shrink-0 hover:tw-text-blue-700 dark:hover:tw-text-blue-300 hover:tw-scale-110\">download</cide-ele-icon>\n </div>\n }\n \n <!-- Action Buttons -->\n @if (notif.action_label) {\n <div class=\"tw-mt-1.5 tw-flex tw-gap-1.5\">\n @if (notif.action_label.toLowerCase().includes('decline')) {\n <button type=\"button\" class=\"tw-py-1 tw-px-3 tw-border tw-border-gray-300 dark:tw-border-gray-600 tw-bg-white dark:tw-bg-gray-800 tw-rounded-md tw-text-[10px] tw-font-semibold tw-cursor-pointer tw-transition-all tw-duration-200 tw-text-gray-800 dark:tw-text-gray-300 hover:tw-bg-gray-100 dark:hover:tw-bg-gray-700 hover:tw-border-gray-400 dark:hover:tw-border-gray-500 hover:tw-scale-105\">Decline</button>\n }\n @if (notif.action_label.toLowerCase().includes('accept')) {\n <button type=\"button\" class=\"tw-py-1 tw-px-3 tw-border tw-border-blue-600 dark:tw-border-blue-500 tw-bg-blue-600 dark:tw-bg-blue-500 tw-rounded-md tw-text-[10px] tw-font-semibold tw-cursor-pointer tw-transition-all tw-duration-200 tw-text-white hover:tw-bg-blue-700 dark:hover:tw-bg-blue-600 hover:tw-border-blue-700 dark:hover:tw-border-blue-600 hover:tw-scale-105\">Accept</button>\n }\n </div>\n }\n </div>\n </div>\n }\n }\n </div>\n\n </div>\n </ng-template>\n\n <div class=\"header-divider\"></div>\n\n <!-- Profile with Dropdown -->\n <div class=\"header-icon user-profile\" (mouseenter)=\"updateTooltipPosition($event)\">\n <cide-ele-dropdown [items]=\"profileItems\" [config]=\"profileConfig\"\n [triggerTemplate]=\"triggerTemplate\"\n (itemClick)=\"onProfileClick($event)\">\n <ng-template #triggerTemplate>\n @if (appStateService.currentUser()?.user_photo_id_cyfm) {\n <div class=\"profile-avatar\">\n <img cideEleFileImage [fileId]=\"(appStateService.currentUser()?.user_photo_id_cyfm || '')\"\n [altText]=\"'User Profile Photo'\" class=\"tw-w-full tw-h-full tw-object-cover tw-rounded-full\">\n </div>\n } @else {\n <div class=\"profile-avatar\">\n <cide-ele-icon name=\"person\" class=\"tw-w-6 tw-h-6 tw-text-white\"></cide-ele-icon>\n </div>\n }\n </ng-template>\n </cide-ele-dropdown>\n <div class=\"header-tooltip\">My Account</div>\n </div>\n </div>\n</header>", styles: [".cide-lyt-header{display:flex;align-items:center;justify-content:space-between;background:linear-gradient(to right,rgb(var(--tw-white-rgb) / .95),rgb(var(--tw-gray-50-rgb) / .95));box-shadow:0 2px 8px #00000008;padding:0 1rem;position:relative;z-index:20;transition:all .3s cubic-bezier(.4,0,.2,1);will-change:transform;border-bottom:1px solid rgb(var(--tw-gray-200-rgb) / .8);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.header-logo-container{height:100%;display:flex;align-items:center;padding:.5rem 0;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1);border-radius:8px;outline:none}.header-logo-container img{height:30px;max-height:100%;transition:all .3s ease;border-radius:5px;overflow:hidden;box-shadow:0 1px 4px #0000000d}.header-logo-container:hover img{transform:scale(1.03);filter:brightness(1.05);box-shadow:0 2px 6px #00000014}.header-logo-container:after{content:\"\";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(to bottom right,rgb(var(--tw-white-rgb) / 0),rgb(var(--tw-white-rgb) / .3),rgb(var(--tw-white-rgb) / 0));transform:rotate(30deg);opacity:0;transition:transform .6s ease,opacity .6s ease;pointer-events:none}.header-logo-container:hover:after,.header-logo-container:focus:after{opacity:1;transform:rotate(30deg) translate(50%,50%)}.header-search-container{flex-grow:1;max-width:600px;margin:0 2rem;position:relative;transition:all .3s ease}::ng-deep .header-search-container #cide_lyt_header_search{width:100%;background-color:rgb(var(--tw-gray-50-rgb) / .8);border-radius:20px!important;transition:all .3s ease;overflow:visible;transform:translateZ(0)}::ng-deep .header-search-container #cide_lyt_header_search:hover{box-shadow:0 3px 12px #00000014;background-color:rgb(var(--tw-white-rgb) / 1);transform:translateY(-1px)}::ng-deep .header-search-container #cide_lyt_header_search .cide-input-input{background-color:transparent;font-size:.85rem!important;letter-spacing:.01em}::ng-deep .header-search-container #cide_lyt_header_search .cide-input-leading-icon{color:#6b7280b3!important;font-size:1.1rem!important}::ng-deep .header-search-container #cide_lyt_header_search:focus-within{transform:translateY(-1px) scale(1.01)}::ng-deep .header-search-container #cide_lyt_header_search:focus-within .cide-input-input{border-color:#3b82f6!important}::ng-deep .header-search-container #cide_lyt_header_search:focus-within .cide-input-leading-icon{color:#3b82f6!important}.header-icons-container{display:flex;align-items:center;gap:1rem}.header-icon{position:relative;width:32px;height:32px;display:flex;align-items:center;justify-content:center;transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;color:#374151;border-radius:.4rem;margin:0 2px}.header-dropdown-container{position:relative;display:flex;align-items:center;justify-content:center;transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;color:#374151;border-radius:.4rem;margin:0 2px}.header-icon:before{content:\"\";position:absolute;inset:0;background-color:#3b82f61a;border-radius:.5rem;opacity:0;transform:scale(.8);transition:all .2s cubic-bezier(.4,0,.2,1)}.header-icon:hover:before{opacity:1;transform:scale(1)}.header-icon:hover{color:#3b82f6}.header-icon:active{transform:scale(.95)}.header-tooltip{position:absolute;bottom:-26px;left:50%;transform:translate(-50%);background-color:rgb(var(--tw-gray-700-rgb) / .9);color:rgb(var(--tw-white-rgb) / 1);padding:.25rem .6rem;border-radius:.25rem;font-size:.7rem;white-space:nowrap;opacity:0;pointer-events:none;transition:all .2s cubic-bezier(.4,0,.2,1);z-index:1000;box-shadow:0 2px 5px #0003;letter-spacing:.01em;will-change:transform,opacity}.header-tooltip:before{content:\"\";position:absolute;bottom:100%;left:50%;transform:translate(-50%);border-width:5px;border-style:solid;border-color:transparent transparent rgba(55,65,81,.9) transparent}.header-icon:hover .header-tooltip{opacity:1;transform:translate(-50%) translateY(0)}.header-badge{position:absolute;top:-2px;right:-2px;min-width:18px;height:18px;border-radius:9px;background-color:#ef4444;color:rgb(var(--tw-white-rgb) / 1);font-size:10px;display:flex!important;align-items:center;justify-content:center;padding:0 5px;box-shadow:0 2px 4px #ef444466;font-weight:700;z-index:10;transition:all .2s ease;line-height:1;border:2px solid #ffffff}.header-icon:hover .header-badge{transform:scale(1.15);box-shadow:0 3px 6px #ef444480}.header-icon.notification-icon{position:relative;overflow:visible}.header-divider{height:20px;width:1px;background-color:#e5e7ebcc;margin:0 6px}.header-year-dropdown-wrapper{position:relative;display:flex;align-items:center;justify-content:center}.header-year-pill{position:relative;display:flex;align-items:center;padding:.25rem .625rem;background:linear-gradient(135deg,#3b82f61a,#2563eb26);border:1px solid rgba(59,130,246,.3);border-radius:9999px;color:#2563eb;font-size:.6875rem;font-weight:600;transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;white-space:nowrap;box-shadow:0 1px 2px #3b82f61a;min-height:22px;height:22px;line-height:1}.header-year-pill:hover{background:linear-gradient(135deg,#3b82f626,#2563eb33);border-color:#3b82f666;transform:translateY(-1px);box-shadow:0 2px 6px #3b82f626}.header-year-pill-text{max-width:180px;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.01em;line-height:1;display:inline-block}::ng-deep .header-dropdown-container .dropdown-trigger{background:transparent!important;border:none!important;border-radius:0!important;padding:0!important;width:100%!important;height:100%!important;min-width:auto!important;box-shadow:none!important;display:flex!important;align-items:center!important;justify-content:center!important;transition:none!important;cursor:pointer!important}::ng-deep .header-dropdown-container .dropdown-trigger:hover{background:transparent!important}::ng-deep .header-dropdown-container .dropdown-trigger:hover .header-year-pill{background:linear-gradient(135deg,#3b82f626,#2563eb33)!important;border-color:#3b82f666!important;transform:translateY(-1px)!important;box-shadow:0 2px 6px #3b82f626!important}::ng-deep .header-dropdown-container .dropdown-trigger:focus,::ng-deep .header-dropdown-container .dropdown-trigger:focus-visible,::ng-deep .header-dropdown-container .dropdown-trigger:active{outline:none!important;box-shadow:0 2px 6px #3b82f626!important}.profile-avatar{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,#3b82f6,#2563eb);color:rgb(var(--tw-white-rgb) / 1);font-size:.75rem;font-weight:600;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px #2563eb33;transition:all .2s cubic-bezier(.4,0,.2,1);letter-spacing:-.5px;cursor:pointer;border:2px solid transparent}.profile-avatar:hover,.header-icon:hover .profile-avatar{transform:scale(1.08);box-shadow:0 3px 8px #2563eb4d;border-color:#3b82f64d}::ng-deep .user-profile .dropdown-trigger{background:transparent!important;border:none!important;padding:0!important;width:auto!important;height:auto!important;border-radius:0!important}::ng-deep .user-profile .dropdown-trigger:hover{background:transparent!important}::ng-deep .user-profile .dropdown-trigger:focus,::ng-deep .user-profile .dropdown-trigger:focus-visible,::ng-deep .user-profile .dropdown-trigger:active{outline:none!important;box-shadow:none!important}:root[data-theme=dark] .cide-lyt-header,:root.dark-mode .cide-lyt-header{background:linear-gradient(to right,var(--cide-theme-light-color),var(--cide-theme-hover-bg-color));border-bottom-color:var(--cide-theme-border-color);box-shadow:0 2px 8px var(--cide-theme-shadow-color)}:root[data-theme=dark] .header-icon,:root.dark-mode .header-icon{color:var(--cide-theme-text-color)}:root[data-theme=dark] .header-icon.notification-icon,:root.dark-mode .header-icon.notification-icon{color:#d1d5db}:root[data-theme=dark] .header-icon.notification-icon:hover,:root.dark-mode .header-icon.notification-icon:hover{color:#60a5fa}:root[data-theme=dark] .header-divider,:root.dark-mode .header-divider{background-color:var(--cide-theme-border-color)}:root[data-theme=dark] .header-year-pill,:root.dark-mode .header-year-pill{background:linear-gradient(135deg,#60a5fa33,#3b82f640);border-color:#60a5fa80;color:#60a5fa}:root[data-theme=dark] .header-year-pill .header-year-pill-text,:root.dark-mode .header-year-pill .header-year-pill-text{color:#60a5fa}:root[data-theme=dark] .header-year-pill cide-ele-icon,:root.dark-mode .header-year-pill cide-ele-icon{color:#60a5fa!important}:root[data-theme=dark] .header-year-pill:hover,:root.dark-mode .header-year-pill:hover{background:linear-gradient(135deg,#60a5fa4d,#3b82f659);border-color:#60a5fa99;color:#93c5fd}:root[data-theme=dark] .header-year-pill:hover .header-year-pill-text,:root.dark-mode .header-year-pill:hover .header-year-pill-text{color:#93c5fd}:root[data-theme=dark] .header-year-pill:hover cide-ele-icon,:root.dark-mode .header-year-pill:hover cide-ele-icon{color:#93c5fd!important}:root[data-theme=dark] ::ng-deep .header-search-container #cide_lyt_header_search,:root.dark-mode ::ng-deep .header-search-container #cide_lyt_header_search{background-color:var(--cide-theme-hover-bg-color);border-color:var(--cide-theme-border-color)}:root[data-theme=dark] ::ng-deep .header-search-container #cide_lyt_header_search:hover,:root.dark-mode ::ng-deep .header-search-container #cide_lyt_header_search:hover{background-color:var(--cide-theme-light-color);box-shadow:0 3px 12px var(--cide-theme-shadow-color)}:root[data-theme=dark] ::ng-deep .header-search-container #cide_lyt_header_search .cide-input-leading-icon,:root.dark-mode ::ng-deep .header-search-container #cide_lyt_header_search .cide-input-leading-icon{color:var(--cide-theme-label-color)!important}.header-avatar{width:36px;height:36px;border-radius:50%;overflow:hidden;transition:all .2s cubic-bezier(.4,0,.2,1);border:2px solid transparent;box-shadow:0 2px 4px #0000001a}.header-avatar:hover{border-color:#3b82f6;transform:scale(1.05);box-shadow:0 3px 6px #3b82f64d}@media (max-width: 768px){.cide-lyt-header{padding:.5rem .75rem;flex-wrap:wrap;min-height:56px;height:auto}.header-logo-container{padding:.25rem 0}.header-logo-container img,.header-logo-container cide-ele-icon{width:24px;height:24px}.header-logo-container+span{font-size:.875rem;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.header-search-container{order:3;flex:1 1 100%;max-width:100%;margin:.5rem 0 0;min-width:0}@media (max-width: 480px){.header-search-container{display:none}}.header-icons-container{gap:.5rem;flex-wrap:wrap;justify-content:flex-end}.header-icon{width:28px;height:28px;margin:0 1px}.header-year-pill{padding:.2rem .5rem;font-size:.625rem;min-height:20px;height:20px}.header-year-pill-text{max-width:80px}.profile-avatar{width:24px;height:24px;font-size:.625rem}.header-divider{display:none}.header-dropdown-container{margin:0 1px}.header-badge{min-width:16px;height:16px;font-size:9px;top:-1px;right:-1px}}@media (max-width: 640px){.cide-lyt-header{padding:.5rem}.header-search-container{max-width:100%;margin:.5rem 0 0}.header-icon{width:26px;height:26px}@media (max-width: 480px){.header-year-pill-text{display:none}.header-year-pill{padding:.2rem;width:28px;justify-content:center}.header-icons-container{gap:.25rem}}}@media (min-width: 769px) and (max-width: 1024px){.header-search-container{max-width:400px;margin:0 1.5rem}.header-icons-container{gap:.75rem}}@media (max-width: 768px) and (orientation: landscape){.cide-lyt-header{min-height:48px;padding:.375rem .75rem}.header-search-container{order:0;flex:0 1 auto;max-width:250px;margin:0 1rem}}.notification-scroll-container{scrollbar-width:thin;scrollbar-color:var(--cide-ele-scrollbar-thumb, #d1d5db) var(--cide-ele-scrollbar-track, transparent)}.notification-scroll-container::-webkit-scrollbar{width:6px;height:6px}.notification-scroll-container::-webkit-scrollbar-track{background:var(--cide-ele-scrollbar-track, transparent)}.notification-scroll-container::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb, #d1d5db);border-radius:3px}.notification-scroll-container::-webkit-scrollbar-thumb:hover{background-color:var(--cide-ele-scrollbar-thumb-hover, #9ca3af)}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container{background-color:#fff!important;color:#111827!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container *{color:inherit}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-text-gray-900{color:#111827!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-text-gray-800{color:#1f2937!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-text-gray-700{color:#374151!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-text-gray-600{color:#4b5563!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-text-gray-500{color:#6b7280!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-text-blue-600{color:#2563eb!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-bg-white{background-color:#fff!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-bg-gray-50{background-color:#f9fafb!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-bg-gray-100{background-color:#f3f4f6!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-bg-blue-50{background-color:#eff6ff!important}\n"], dependencies: [{ 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", "step", "size"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "directive", type: CideEleFileImageDirective, selector: "[cideEleFileImage]", inputs: ["fileId", "altText"] }] });
|
|
3540
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytHeaderWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3541
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideLytHeaderWrapperComponent, isStandalone: true, selector: "cide-lyt-header-wrapper", viewQueries: [{ propertyName: "triggerTemplate", first: true, predicate: ["triggerTemplate"], descendants: true }, { propertyName: "financialYearTriggerTemplate", first: true, predicate: ["financialYearTriggerTemplate"], descendants: true }, { propertyName: "academicYearTriggerTemplate", first: true, predicate: ["academicYearTriggerTemplate"], descendants: true }, { propertyName: "notificationTriggerTemplate", first: true, predicate: ["notificationTriggerTemplate"], descendants: true }, { propertyName: "notificationDropdown", first: true, predicate: ["notificationDropdown"], descendants: true }], ngImport: i0, template: "<header id=\"cide-lyt-header-wrapper\" class=\"cide-lyt-header tw-w-full tw-select-none cide-lyt-header-wrapper-hide\">\n <!-- Logo Section -->\n <div class=\"tw-flex tw-items-center tw-gap-3\">\n <div class=\"header-logo-container tw-flex tw-items-center tw-gap-3 tw-cursor-pointer\" (click)=\"onLogoClick()\"\n (keydown.enter)=\"onLogoClick()\" (keydown.space)=\"onLogoClick()\" tabindex=\"0\" role=\"button\"\n aria-label=\"Navigate to home\" title=\"Click to go to control panel home\">\n @if (appStateService.activeEntity()?.syen_photo_id_cyfm) {\n <img cideEleFileImage [fileId]=\"(appStateService.activeEntity()?.syen_photo_id_cyfm || '')\"\n [altText]=\"'Entity Logo'\" class=\"tw-w-8 tw-h-8 tw-object-contain\">\n } @else {\n <cide-ele-icon name=\"business\" class=\"tw-w-8 tw-h-8 tw-text-blue-600\"></cide-ele-icon>\n }\n\n </div>\n @if (appStateService.activeEntity()?.syen_name) {\n <span\n class=\"tw-text-md tw-font-semibold tw-text-blue-600 hover:tw-text-blue-800 tw-cursor-pointer sm:block tw-transition-colors tw-duration-200 hover:tw-underline\"\n (click)=\"onEntityNameClick()\" title=\"Click to switch entity\">\n {{ appStateService.activeEntity()?.syen_name }}\n </span>\n }\n </div>\n <!-- Search Section -->\n <div class=\"header-search-container\">\n <cide-ele-input id=\"cide_lyt_header_search\" placeholder=\"Search...\" leadingIcon=\"search\"\n size=\"md\"></cide-ele-input>\n </div>\n\n <!-- Icons Section -->\n <div class=\"header-icons-container\">\n <!-- Financial Year Dropdown -->\n <div class=\"header-dropdown-container\" (mouseenter)=\"updateTooltipPosition($event)\">\n <cide-ele-dropdown [items]=\"financialYearItems()\" [config]=\"financialYearConfig\"\n [triggerTemplate]=\"financialYearTriggerTemplate\"\n (itemClick)=\"onFinancialYearClick($event)\">\n </cide-ele-dropdown>\n <div class=\"header-tooltip\">Financial Year</div>\n </div>\n \n <ng-template #financialYearTriggerTemplate let-isOpen=\"isOpen\">\n <div class=\"header-year-pill\">\n <cide-ele-icon size=\"2xs\" type=\"none\" class=\"tw-mr-1\">calendar_today</cide-ele-icon>\n <span class=\"header-year-pill-text\">{{ currentFinancialYearName() }}</span>\n </div>\n </ng-template>\n\n <!-- Academic Year Dropdown -->\n <div class=\"header-dropdown-container\" (mouseenter)=\"updateTooltipPosition($event)\">\n <cide-ele-dropdown [items]=\"academicYearItems()\" [config]=\"academicYearConfig\"\n [triggerTemplate]=\"academicYearTriggerTemplate\"\n (itemClick)=\"onAcademicYearClick($event)\">\n </cide-ele-dropdown>\n <div class=\"header-tooltip\">Academic Year</div>\n </div>\n \n <ng-template #academicYearTriggerTemplate let-isOpen=\"isOpen\">\n <div class=\"header-year-pill\">\n <cide-ele-icon size=\"2xs\" type=\"none\" class=\"tw-mr-1\">school</cide-ele-icon>\n <span class=\"header-year-pill-text\">{{ currentAcademicYearName() }}</span>\n </div>\n </ng-template>\n\n <!-- Notifications Dropdown -->\n <div class=\"header-dropdown-container\" (mouseenter)=\"updateTooltipPosition($event)\">\n <cide-ele-dropdown \n #notificationDropdown\n [items]=\"notificationItems()\" \n [config]=\"notificationConfig\"\n [triggerTemplate]=\"notificationTriggerTemplate\"\n [menuTemplate]=\"notificationMenuTemplate\"\n (itemClick)=\"onNotificationClick($event)\">\n </cide-ele-dropdown>\n <div class=\"header-tooltip\">Notifications</div>\n </div>\n \n <ng-template #notificationTriggerTemplate let-isOpen=\"isOpen\">\n <div class=\"header-icon notification-icon\" [class.active]=\"isOpen\">\n <cide-ele-icon>notifications</cide-ele-icon>\n @if (unreadCount() > 0) {\n <div class=\"header-badge\">{{ unreadCount() > 99 ? '99+' : unreadCount() }}</div>\n }\n </div>\n </ng-template>\n\n <!-- Custom Notification Menu Template -->\n <ng-template #notificationMenuTemplate let-items=\"items\">\n <div class=\"tw-min-w-[380px] tw-bg-white dark:tw-bg-gray-800 tw-rounded-xl tw-shadow-2xl tw-overflow-hidden tw-text-gray-900 dark:tw-text-gray-100\">\n <!-- Header - Fixed/Sticky -->\n <div class=\"tw-sticky tw-top-0 tw-z-10 tw-px-2.5 tw-py-1 tw-bg-white dark:tw-bg-gray-800 tw-flex tw-justify-between tw-items-center tw-border-b tw-border-gray-200 dark:tw-border-gray-700 tw-backdrop-blur-sm\">\n <div class=\"tw-flex tw-items-center tw-gap-1\">\n <div class=\"tw-w-5 tw-h-5 tw-bg-blue-500 tw-rounded tw-flex tw-items-center tw-justify-center tw-shadow-sm\">\n <cide-ele-icon class=\"!tw-text-[10px] !tw-text-white\">notifications</cide-ele-icon>\n </div>\n <div class=\"tw-flex tw-items-center tw-gap-1\">\n <h3 class=\"tw-m-0 tw-text-[10px] tw-font-bold tw-text-gray-900 dark:tw-text-gray-100 tw-leading-none\">Notifications</h3>\n @if (unreadCount() > 0) {\n <span class=\"tw-bg-red-500 tw-text-white tw-px-1 tw-py-0 tw-rounded-full tw-text-[7px] tw-font-bold tw-leading-none tw-animate-pulse\">{{ unreadCount() }}</span>\n }\n </div>\n </div>\n <div class=\"tw-flex tw-items-center tw-gap-0.5\">\n <button \n type=\"button\"\n class=\"tw-bg-transparent tw-border-none tw-p-0.5 tw-cursor-pointer tw-text-gray-600 dark:tw-text-gray-400 tw-flex tw-items-center tw-justify-center tw-rounded tw-transition-all tw-duration-200 hover:tw-bg-gray-100 dark:hover:tw-bg-gray-600 hover:tw-text-gray-900 dark:hover:tw-text-gray-200\"\n (click)=\"openNotificationSettings(); $event.stopPropagation()\"\n title=\"Notification Settings\">\n <cide-ele-icon class=\"!tw-text-xs\">settings</cide-ele-icon>\n </button>\n @if (unreadCount() > 0) {\n <button \n type=\"button\"\n class=\"tw-bg-blue-500 tw-text-white tw-px-1 tw-py-0.5 tw-rounded tw-text-[8px] tw-font-semibold tw-cursor-pointer tw-transition-all tw-duration-200 tw-flex tw-items-center tw-gap-0.5 tw-shadow-sm hover:tw-bg-blue-600 hover:tw-scale-105\"\n (click)=\"markAllAsRead(); $event.stopPropagation()\"\n title=\"Mark all as read\">\n <cide-ele-icon class=\"!tw-text-[9px]\">done_all</cide-ele-icon>\n </button>\n }\n <button \n type=\"button\" \n class=\"tw-bg-transparent tw-border-none tw-p-0.5 tw-cursor-pointer tw-text-gray-600 dark:tw-text-gray-400 tw-flex tw-items-center tw-justify-center tw-rounded tw-transition-all tw-duration-200 hover:tw-bg-gray-100 dark:hover:tw-bg-gray-600 hover:tw-text-gray-900 dark:hover:tw-text-gray-200 hover:tw-rotate-90\"\n (click)=\"closeNotificationDropdown($event)\"\n title=\"Close\">\n <cide-ele-icon class=\"!tw-text-xs\">close</cide-ele-icon>\n </button>\n </div>\n </div>\n\n <!-- Notifications List -->\n <div class=\"tw-overflow-x-hidden notification-scroll-container tw-bg-white dark:tw-bg-gray-800 tw-text-gray-900 dark:tw-text-gray-100\">\n @if (notifications().length === 0) {\n <div class=\"tw-py-16 tw-px-4 tw-text-center tw-bg-white dark:tw-bg-gray-800\">\n <cide-ele-icon class=\"!tw-text-6xl !tw-text-gray-300 dark:!tw-text-gray-600 tw-mb-3\">notifications_off</cide-ele-icon>\n <p class=\"tw-m-0 tw-text-sm tw-text-gray-600 dark:tw-text-gray-400 tw-font-medium\">No notifications yet</p>\n <p class=\"tw-m-0 tw-mt-1 tw-text-xs tw-text-gray-500 dark:tw-text-gray-500\">You're all caught up!</p>\n </div>\n } @else {\n @for (notif of notifications().slice(0, 15); track notif.id) {\n <div \n class=\"tw-flex tw-items-start tw-px-3 tw-py-2 tw-cursor-pointer tw-transition-all tw-duration-300 tw-relative tw-gap-2 tw-border-b tw-border-gray-200 dark:tw-border-gray-700 last:tw-border-b-0 hover:tw-bg-gray-50 dark:hover:tw-bg-gray-700 tw-transform tw-ease-in-out tw-bg-white dark:tw-bg-gray-800 tw-text-gray-900 dark:tw-text-gray-100\"\n [class.tw-border-l-2]=\"!isNotificationRead(notif)\"\n [class.tw-border-l-blue-500]=\"!isNotificationRead(notif)\"\n [class.dark:tw-border-l-blue-400]=\"!isNotificationRead(notif)\"\n [class.tw-bg-blue-50]=\"!isNotificationRead(notif)\"\n [class.dark:tw-bg-gray-700]=\"!isNotificationRead(notif)\"\n [class.-tw-translate-x-full]=\"isNotificationAnimating(notif)\"\n [class.tw-opacity-0]=\"isNotificationAnimating(notif)\"\n [class.tw-max-h-0]=\"isNotificationAnimating(notif)\"\n [class.tw-overflow-hidden]=\"isNotificationAnimating(notif)\"\n [class.tw-mb-0]=\"isNotificationAnimating(notif)\"\n [class.tw-p-0]=\"isNotificationAnimating(notif)\"\n (click)=\"onNotificationItemClick(notif)\">\n <!-- Icon/Avatar -->\n <div class=\"tw-flex-shrink-0 tw-relative\">\n <div class=\"tw-w-9 tw-h-9 tw-rounded-full tw-overflow-hidden tw-bg-gradient-to-br tw-from-blue-500 tw-to-blue-600 tw-flex tw-items-center tw-justify-center tw-shadow-sm tw-ring-1 tw-ring-white\">\n @if (getNotificationAvatar(notif)) {\n <img \n cideEleFileImage \n [fileId]=\"getNotificationAvatar(notif) || ''\"\n [altText]=\"getNotificationName(notif)\"\n class=\"tw-w-full tw-h-full tw-object-cover\">\n } @else {\n <cide-ele-icon class=\"!tw-text-base !tw-text-white\">{{ getNotificationIcon(notif.type) }}</cide-ele-icon>\n }\n </div>\n <!-- Green online indicator -->\n <div class=\"tw-absolute tw-bottom-0 tw-right-0 tw-w-2 tw-h-2 tw-bg-green-500 tw-rounded-full tw-border tw-border-white\"></div>\n </div>\n\n <!-- Content -->\n <div class=\"tw-flex-1 tw-min-w-0\">\n <!-- Title and relative time -->\n <div class=\"tw-flex tw-items-start tw-justify-between tw-gap-1.5 tw-mb-0.5\">\n <div class=\"tw-flex-1 tw-min-w-0\">\n <h4 class=\"tw-m-0 tw-text-[11px] tw-font-bold tw-text-gray-900 dark:tw-text-gray-100 tw-leading-tight\">\n <span class=\"tw-text-blue-600 dark:tw-text-blue-400\">{{ getNotificationName(notif) }}</span><span class=\"tw-font-normal tw-text-gray-800 dark:tw-text-gray-300\"> {{ getNotificationAction(notif) }}</span>\n </h4>\n <p class=\"tw-m-0 tw-text-[9px] tw-text-gray-500 dark:tw-text-gray-500 tw-mt-0.5\">{{ getTimeAgo(notif.timestamp) }}</p>\n </div>\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-flex-shrink-0\">\n @if (!isNotificationRead(notif)) {\n <div class=\"tw-w-1.5 tw-h-1.5 tw-rounded-full tw-bg-blue-500 dark:tw-bg-blue-400 tw-animate-pulse\"></div>\n }\n @if (isNotificationAnimating(notif) && isNotificationUndoable(notif)) {\n <button \n type=\"button\"\n (click)=\"undoNotificationRemoval(getNotificationId(notif)); $event.stopPropagation()\"\n class=\"tw-px-2 tw-py-0.5 tw-text-[9px] tw-font-semibold tw-text-blue-600 dark:tw-text-blue-400 tw-bg-blue-50 dark:tw-bg-blue-900 tw-border tw-border-blue-200 dark:tw-border-blue-700 tw-rounded-md tw-cursor-pointer tw-transition-all tw-duration-200 hover:tw-bg-blue-100 dark:hover:tw-bg-blue-800 hover:tw-border-blue-300 dark:hover:tw-border-blue-600 hover:tw-scale-105 tw-whitespace-nowrap tw-animate-pulse\">\n Undo\n </button>\n }\n </div>\n </div>\n \n <!-- Message -->\n @if (notif.message && notif.message !== notif.title) {\n <p class=\"tw-m-0 tw-mt-1 tw-text-[10px] tw-text-gray-700 dark:tw-text-gray-400 tw-leading-snug tw-line-clamp-2\">\n {{ notif.message }}\n </p>\n }\n \n <!-- Comment -->\n @if (notif.data?.comment) {\n <div class=\"tw-mt-1.5 tw-py-1.5 tw-px-2.5 tw-bg-gray-100 dark:tw-bg-gray-700 tw-rounded-md tw-border-l-2 tw-border-l-blue-500 dark:tw-border-l-blue-500\">\n <p class=\"tw-m-0 tw-text-[10px] tw-text-gray-800 dark:tw-text-gray-300 tw-leading-snug tw-italic tw-line-clamp-2\">{{ notif.data.comment }}</p>\n </div>\n }\n \n <!-- File -->\n @if (notif.data?.file) {\n <div class=\"tw-mt-1.5 tw-py-1.5 tw-px-2.5 tw-bg-gray-100 dark:tw-bg-gray-700 tw-border tw-border-gray-300 dark:tw-border-gray-600 tw-rounded-md tw-flex tw-items-center tw-gap-2\">\n <div class=\"tw-w-7 tw-h-7 tw-bg-blue-100 dark:tw-bg-blue-900 tw-rounded-md tw-flex tw-items-center tw-justify-center tw-flex-shrink-0\">\n <span class=\"tw-text-[9px] tw-font-bold tw-text-blue-700 dark:tw-text-blue-300\">{{ getFileIcon(notif.data.file.type) }}</span>\n </div>\n <div class=\"tw-flex-1 tw-min-w-0\">\n <p class=\"tw-m-0 tw-text-[10px] tw-font-semibold tw-text-gray-900 dark:tw-text-gray-100 tw-overflow-hidden tw-text-ellipsis tw-whitespace-nowrap\">{{ notif.data.file.name }}</p>\n <p class=\"tw-m-0 tw-text-[9px] tw-text-gray-600 dark:tw-text-gray-400\">{{ notif.data.file.size }}</p>\n </div>\n <cide-ele-icon class=\"!tw-text-sm !tw-text-blue-600 dark:!tw-text-blue-400 tw-cursor-pointer tw-transition-all tw-duration-200 tw-flex-shrink-0 hover:tw-text-blue-700 dark:hover:tw-text-blue-300 hover:tw-scale-110\">download</cide-ele-icon>\n </div>\n }\n \n <!-- Action Buttons -->\n @if (notif.action_label) {\n <div class=\"tw-mt-1.5 tw-flex tw-gap-1.5\">\n @if (notif.action_label.toLowerCase().includes('decline')) {\n <button type=\"button\" class=\"tw-py-1 tw-px-3 tw-border tw-border-gray-300 dark:tw-border-gray-600 tw-bg-white dark:tw-bg-gray-800 tw-rounded-md tw-text-[10px] tw-font-semibold tw-cursor-pointer tw-transition-all tw-duration-200 tw-text-gray-800 dark:tw-text-gray-300 hover:tw-bg-gray-100 dark:hover:tw-bg-gray-700 hover:tw-border-gray-400 dark:hover:tw-border-gray-500 hover:tw-scale-105\">Decline</button>\n }\n @if (notif.action_label.toLowerCase().includes('accept')) {\n <button type=\"button\" class=\"tw-py-1 tw-px-3 tw-border tw-border-blue-600 dark:tw-border-blue-500 tw-bg-blue-600 dark:tw-bg-blue-500 tw-rounded-md tw-text-[10px] tw-font-semibold tw-cursor-pointer tw-transition-all tw-duration-200 tw-text-white hover:tw-bg-blue-700 dark:hover:tw-bg-blue-600 hover:tw-border-blue-700 dark:hover:tw-border-blue-600 hover:tw-scale-105\">Accept</button>\n }\n </div>\n }\n </div>\n </div>\n }\n }\n </div>\n\n </div>\n </ng-template>\n\n <div class=\"header-divider\"></div>\n\n <!-- Profile with Dropdown -->\n <div class=\"header-icon user-profile\" (mouseenter)=\"updateTooltipPosition($event)\">\n <cide-ele-dropdown [items]=\"profileItems\" [config]=\"profileConfig\"\n [triggerTemplate]=\"triggerTemplate\"\n (itemClick)=\"onProfileClick($event)\">\n <ng-template #triggerTemplate>\n @if (appStateService.currentUser()?.user_photo_id_cyfm) {\n <div class=\"profile-avatar\">\n <img cideEleFileImage [fileId]=\"(appStateService.currentUser()?.user_photo_id_cyfm || '')\"\n [altText]=\"'User Profile Photo'\" class=\"tw-w-full tw-h-full tw-object-cover tw-rounded-full\">\n </div>\n } @else {\n <div class=\"profile-avatar\">\n <cide-ele-icon name=\"person\" class=\"tw-w-6 tw-h-6 tw-text-white\"></cide-ele-icon>\n </div>\n }\n </ng-template>\n </cide-ele-dropdown>\n <div class=\"header-tooltip\">My Account</div>\n </div>\n </div>\n</header>", styles: [".cide-lyt-header{display:flex;align-items:center;justify-content:space-between;background:linear-gradient(to right,rgb(var(--tw-white-rgb) / .95),rgb(var(--tw-gray-50-rgb) / .95));box-shadow:0 2px 8px #00000008;padding:0 1rem;position:relative;z-index:20;transition:all .3s cubic-bezier(.4,0,.2,1);will-change:transform;border-bottom:1px solid rgb(var(--tw-gray-200-rgb) / .8);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.header-logo-container{height:100%;display:flex;align-items:center;padding:.5rem 0;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1);border-radius:8px;outline:none}.header-logo-container img{height:30px;max-height:100%;transition:all .3s ease;border-radius:5px;overflow:hidden;box-shadow:0 1px 4px #0000000d}.header-logo-container:hover img{transform:scale(1.03);filter:brightness(1.05);box-shadow:0 2px 6px #00000014}.header-logo-container:after{content:\"\";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(to bottom right,rgb(var(--tw-white-rgb) / 0),rgb(var(--tw-white-rgb) / .3),rgb(var(--tw-white-rgb) / 0));transform:rotate(30deg);opacity:0;transition:transform .6s ease,opacity .6s ease;pointer-events:none}.header-logo-container:hover:after,.header-logo-container:focus:after{opacity:1;transform:rotate(30deg) translate(50%,50%)}.header-search-container{flex-grow:1;max-width:600px;margin:0 2rem;position:relative;transition:all .3s ease}::ng-deep .header-search-container #cide_lyt_header_search{width:100%;background-color:rgb(var(--tw-gray-50-rgb) / .8);border-radius:20px!important;transition:all .3s ease;overflow:visible;transform:translateZ(0)}::ng-deep .header-search-container #cide_lyt_header_search:hover{box-shadow:0 3px 12px #00000014;background-color:rgb(var(--tw-white-rgb) / 1);transform:translateY(-1px)}::ng-deep .header-search-container #cide_lyt_header_search .cide-input-input{background-color:transparent;font-size:.85rem!important;letter-spacing:.01em}::ng-deep .header-search-container #cide_lyt_header_search .cide-input-leading-icon{color:#6b7280b3!important;font-size:1.1rem!important}::ng-deep .header-search-container #cide_lyt_header_search:focus-within{transform:translateY(-1px) scale(1.01)}::ng-deep .header-search-container #cide_lyt_header_search:focus-within .cide-input-input{border-color:#3b82f6!important}::ng-deep .header-search-container #cide_lyt_header_search:focus-within .cide-input-leading-icon{color:#3b82f6!important}.header-icons-container{display:flex;align-items:center;gap:1rem}.header-icon{position:relative;width:32px;height:32px;display:flex;align-items:center;justify-content:center;transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;color:#374151;border-radius:.4rem;margin:0 2px}.header-dropdown-container{position:relative;display:flex;align-items:center;justify-content:center;transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;color:#374151;border-radius:.4rem;margin:0 2px}.header-icon:before{content:\"\";position:absolute;inset:0;background-color:#3b82f61a;border-radius:.5rem;opacity:0;transform:scale(.8);transition:all .2s cubic-bezier(.4,0,.2,1)}.header-icon:hover:before{opacity:1;transform:scale(1)}.header-icon:hover{color:#3b82f6}.header-icon:active{transform:scale(.95)}.header-tooltip{position:absolute;bottom:-26px;left:50%;transform:translate(-50%);background-color:rgb(var(--tw-gray-700-rgb) / .9);color:rgb(var(--tw-white-rgb) / 1);padding:.25rem .6rem;border-radius:.25rem;font-size:.7rem;white-space:nowrap;opacity:0;pointer-events:none;transition:all .2s cubic-bezier(.4,0,.2,1);z-index:1000;box-shadow:0 2px 5px #0003;letter-spacing:.01em;will-change:transform,opacity}.header-tooltip:before{content:\"\";position:absolute;bottom:100%;left:50%;transform:translate(-50%);border-width:5px;border-style:solid;border-color:transparent transparent rgba(55,65,81,.9) transparent}.header-icon:hover .header-tooltip{opacity:1;transform:translate(-50%) translateY(0)}.header-badge{position:absolute;top:-2px;right:-2px;min-width:18px;height:18px;border-radius:9px;background-color:#ef4444;color:rgb(var(--tw-white-rgb) / 1);font-size:10px;display:flex!important;align-items:center;justify-content:center;padding:0 5px;box-shadow:0 2px 4px #ef444466;font-weight:700;z-index:10;transition:all .2s ease;line-height:1;border:2px solid #ffffff}.header-icon:hover .header-badge{transform:scale(1.15);box-shadow:0 3px 6px #ef444480}.header-icon.notification-icon{position:relative;overflow:visible}.header-divider{height:20px;width:1px;background-color:#e5e7ebcc;margin:0 6px}.header-year-dropdown-wrapper{position:relative;display:flex;align-items:center;justify-content:center}.header-year-pill{position:relative;display:flex;align-items:center;padding:.25rem .625rem;background:linear-gradient(135deg,#3b82f61a,#2563eb26);border:1px solid rgba(59,130,246,.3);border-radius:9999px;color:#2563eb;font-size:.6875rem;font-weight:600;transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;white-space:nowrap;box-shadow:0 1px 2px #3b82f61a;min-height:22px;height:22px;line-height:1}.header-year-pill:hover{background:linear-gradient(135deg,#3b82f626,#2563eb33);border-color:#3b82f666;transform:translateY(-1px);box-shadow:0 2px 6px #3b82f626}.header-year-pill-text{max-width:180px;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.01em;line-height:1;display:inline-block}::ng-deep .header-dropdown-container .dropdown-trigger{background:transparent!important;border:none!important;border-radius:0!important;padding:0!important;width:100%!important;height:100%!important;min-width:auto!important;box-shadow:none!important;display:flex!important;align-items:center!important;justify-content:center!important;transition:none!important;cursor:pointer!important}::ng-deep .header-dropdown-container .dropdown-trigger:hover{background:transparent!important}::ng-deep .header-dropdown-container .dropdown-trigger:hover .header-year-pill{background:linear-gradient(135deg,#3b82f626,#2563eb33)!important;border-color:#3b82f666!important;transform:translateY(-1px)!important;box-shadow:0 2px 6px #3b82f626!important}::ng-deep .header-dropdown-container .dropdown-trigger:focus,::ng-deep .header-dropdown-container .dropdown-trigger:focus-visible,::ng-deep .header-dropdown-container .dropdown-trigger:active{outline:none!important;box-shadow:0 2px 6px #3b82f626!important}.profile-avatar{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,#3b82f6,#2563eb);color:rgb(var(--tw-white-rgb) / 1);font-size:.75rem;font-weight:600;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px #2563eb33;transition:all .2s cubic-bezier(.4,0,.2,1);letter-spacing:-.5px;cursor:pointer;border:2px solid transparent}.profile-avatar:hover,.header-icon:hover .profile-avatar{transform:scale(1.08);box-shadow:0 3px 8px #2563eb4d;border-color:#3b82f64d}::ng-deep .user-profile .dropdown-trigger{background:transparent!important;border:none!important;padding:0!important;width:auto!important;height:auto!important;border-radius:0!important}::ng-deep .user-profile .dropdown-trigger:hover{background:transparent!important}::ng-deep .user-profile .dropdown-trigger:focus,::ng-deep .user-profile .dropdown-trigger:focus-visible,::ng-deep .user-profile .dropdown-trigger:active{outline:none!important;box-shadow:none!important}:root[data-theme=dark] .cide-lyt-header,:root.dark-mode .cide-lyt-header{background:linear-gradient(to right,var(--cide-theme-light-color),var(--cide-theme-hover-bg-color));border-bottom-color:var(--cide-theme-border-color);box-shadow:0 2px 8px var(--cide-theme-shadow-color)}:root[data-theme=dark] .header-icon,:root.dark-mode .header-icon{color:var(--cide-theme-text-color)}:root[data-theme=dark] .header-icon.notification-icon,:root.dark-mode .header-icon.notification-icon{color:#d1d5db}:root[data-theme=dark] .header-icon.notification-icon:hover,:root.dark-mode .header-icon.notification-icon:hover{color:#60a5fa}:root[data-theme=dark] .header-divider,:root.dark-mode .header-divider{background-color:var(--cide-theme-border-color)}:root[data-theme=dark] .header-year-pill,:root.dark-mode .header-year-pill{background:linear-gradient(135deg,#60a5fa33,#3b82f640);border-color:#60a5fa80;color:#60a5fa}:root[data-theme=dark] .header-year-pill .header-year-pill-text,:root.dark-mode .header-year-pill .header-year-pill-text{color:#60a5fa}:root[data-theme=dark] .header-year-pill cide-ele-icon,:root.dark-mode .header-year-pill cide-ele-icon{color:#60a5fa!important}:root[data-theme=dark] .header-year-pill:hover,:root.dark-mode .header-year-pill:hover{background:linear-gradient(135deg,#60a5fa4d,#3b82f659);border-color:#60a5fa99;color:#93c5fd}:root[data-theme=dark] .header-year-pill:hover .header-year-pill-text,:root.dark-mode .header-year-pill:hover .header-year-pill-text{color:#93c5fd}:root[data-theme=dark] .header-year-pill:hover cide-ele-icon,:root.dark-mode .header-year-pill:hover cide-ele-icon{color:#93c5fd!important}:root[data-theme=dark] ::ng-deep .header-search-container #cide_lyt_header_search,:root.dark-mode ::ng-deep .header-search-container #cide_lyt_header_search{background-color:var(--cide-theme-hover-bg-color);border-color:var(--cide-theme-border-color)}:root[data-theme=dark] ::ng-deep .header-search-container #cide_lyt_header_search:hover,:root.dark-mode ::ng-deep .header-search-container #cide_lyt_header_search:hover{background-color:var(--cide-theme-light-color);box-shadow:0 3px 12px var(--cide-theme-shadow-color)}:root[data-theme=dark] ::ng-deep .header-search-container #cide_lyt_header_search .cide-input-leading-icon,:root.dark-mode ::ng-deep .header-search-container #cide_lyt_header_search .cide-input-leading-icon{color:var(--cide-theme-label-color)!important}.header-avatar{width:36px;height:36px;border-radius:50%;overflow:hidden;transition:all .2s cubic-bezier(.4,0,.2,1);border:2px solid transparent;box-shadow:0 2px 4px #0000001a}.header-avatar:hover{border-color:#3b82f6;transform:scale(1.05);box-shadow:0 3px 6px #3b82f64d}@media (max-width: 768px){.cide-lyt-header{padding:.5rem .75rem;flex-wrap:wrap;min-height:56px;height:auto}.header-logo-container{padding:.25rem 0}.header-logo-container img,.header-logo-container cide-ele-icon{width:24px;height:24px}.header-logo-container+span{font-size:.875rem;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.header-search-container{order:3;flex:1 1 100%;max-width:100%;margin:.5rem 0 0;min-width:0}@media (max-width: 480px){.header-search-container{display:none}}.header-icons-container{gap:.5rem;flex-wrap:wrap;justify-content:flex-end}.header-icon{width:28px;height:28px;margin:0 1px}.header-year-pill{padding:.2rem .5rem;font-size:.625rem;min-height:20px;height:20px}.header-year-pill-text{max-width:80px}.profile-avatar{width:24px;height:24px;font-size:.625rem}.header-divider{display:none}.header-dropdown-container{margin:0 1px}.header-badge{min-width:16px;height:16px;font-size:9px;top:-1px;right:-1px}}@media (max-width: 640px){.cide-lyt-header{padding:.5rem}.header-search-container{max-width:100%;margin:.5rem 0 0}.header-icon{width:26px;height:26px}@media (max-width: 480px){.header-year-pill-text{display:none}.header-year-pill{padding:.2rem;width:28px;justify-content:center}.header-icons-container{gap:.25rem}}}@media (min-width: 769px) and (max-width: 1024px){.header-search-container{max-width:400px;margin:0 1.5rem}.header-icons-container{gap:.75rem}}@media (max-width: 768px) and (orientation: landscape){.cide-lyt-header{min-height:48px;padding:.375rem .75rem}.header-search-container{order:0;flex:0 1 auto;max-width:250px;margin:0 1rem}}.notification-scroll-container{scrollbar-width:thin;scrollbar-color:var(--cide-ele-scrollbar-thumb, #d1d5db) var(--cide-ele-scrollbar-track, transparent)}.notification-scroll-container::-webkit-scrollbar{width:6px;height:6px}.notification-scroll-container::-webkit-scrollbar-track{background:var(--cide-ele-scrollbar-track, transparent)}.notification-scroll-container::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb, #d1d5db);border-radius:3px}.notification-scroll-container::-webkit-scrollbar-thumb:hover{background-color:var(--cide-ele-scrollbar-thumb-hover, #9ca3af)}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container{background-color:#fff!important;color:#111827!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container *{color:inherit}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-text-gray-900{color:#111827!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-text-gray-800{color:#1f2937!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-text-gray-700{color:#374151!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-text-gray-600{color:#4b5563!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-text-gray-500{color:#6b7280!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-text-blue-600{color:#2563eb!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-bg-white{background-color:#fff!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-bg-gray-50{background-color:#f9fafb!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-bg-gray-100{background-color:#f3f4f6!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-bg-blue-50{background-color:#eff6ff!important}\n"], dependencies: [{ 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", "step", "size"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "directive", type: CideEleFileImageDirective, selector: "[cideEleFileImage]", inputs: ["fileId", "altText"] }] });
|
|
3526
3542
|
}
|
|
3527
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
3543
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytHeaderWrapperComponent, decorators: [{
|
|
3528
3544
|
type: Component,
|
|
3529
3545
|
args: [{ selector: 'cide-lyt-header-wrapper', imports: [CideInputComponent, CommonModule, CideIconComponent,
|
|
3530
3546
|
CideEleDropdownComponent, CideEleFileImageDirective], template: "<header id=\"cide-lyt-header-wrapper\" class=\"cide-lyt-header tw-w-full tw-select-none cide-lyt-header-wrapper-hide\">\n <!-- Logo Section -->\n <div class=\"tw-flex tw-items-center tw-gap-3\">\n <div class=\"header-logo-container tw-flex tw-items-center tw-gap-3 tw-cursor-pointer\" (click)=\"onLogoClick()\"\n (keydown.enter)=\"onLogoClick()\" (keydown.space)=\"onLogoClick()\" tabindex=\"0\" role=\"button\"\n aria-label=\"Navigate to home\" title=\"Click to go to control panel home\">\n @if (appStateService.activeEntity()?.syen_photo_id_cyfm) {\n <img cideEleFileImage [fileId]=\"(appStateService.activeEntity()?.syen_photo_id_cyfm || '')\"\n [altText]=\"'Entity Logo'\" class=\"tw-w-8 tw-h-8 tw-object-contain\">\n } @else {\n <cide-ele-icon name=\"business\" class=\"tw-w-8 tw-h-8 tw-text-blue-600\"></cide-ele-icon>\n }\n\n </div>\n @if (appStateService.activeEntity()?.syen_name) {\n <span\n class=\"tw-text-md tw-font-semibold tw-text-blue-600 hover:tw-text-blue-800 tw-cursor-pointer sm:block tw-transition-colors tw-duration-200 hover:tw-underline\"\n (click)=\"onEntityNameClick()\" title=\"Click to switch entity\">\n {{ appStateService.activeEntity()?.syen_name }}\n </span>\n }\n </div>\n <!-- Search Section -->\n <div class=\"header-search-container\">\n <cide-ele-input id=\"cide_lyt_header_search\" placeholder=\"Search...\" leadingIcon=\"search\"\n size=\"md\"></cide-ele-input>\n </div>\n\n <!-- Icons Section -->\n <div class=\"header-icons-container\">\n <!-- Financial Year Dropdown -->\n <div class=\"header-dropdown-container\" (mouseenter)=\"updateTooltipPosition($event)\">\n <cide-ele-dropdown [items]=\"financialYearItems()\" [config]=\"financialYearConfig\"\n [triggerTemplate]=\"financialYearTriggerTemplate\"\n (itemClick)=\"onFinancialYearClick($event)\">\n </cide-ele-dropdown>\n <div class=\"header-tooltip\">Financial Year</div>\n </div>\n \n <ng-template #financialYearTriggerTemplate let-isOpen=\"isOpen\">\n <div class=\"header-year-pill\">\n <cide-ele-icon size=\"2xs\" type=\"none\" class=\"tw-mr-1\">calendar_today</cide-ele-icon>\n <span class=\"header-year-pill-text\">{{ currentFinancialYearName() }}</span>\n </div>\n </ng-template>\n\n <!-- Academic Year Dropdown -->\n <div class=\"header-dropdown-container\" (mouseenter)=\"updateTooltipPosition($event)\">\n <cide-ele-dropdown [items]=\"academicYearItems()\" [config]=\"academicYearConfig\"\n [triggerTemplate]=\"academicYearTriggerTemplate\"\n (itemClick)=\"onAcademicYearClick($event)\">\n </cide-ele-dropdown>\n <div class=\"header-tooltip\">Academic Year</div>\n </div>\n \n <ng-template #academicYearTriggerTemplate let-isOpen=\"isOpen\">\n <div class=\"header-year-pill\">\n <cide-ele-icon size=\"2xs\" type=\"none\" class=\"tw-mr-1\">school</cide-ele-icon>\n <span class=\"header-year-pill-text\">{{ currentAcademicYearName() }}</span>\n </div>\n </ng-template>\n\n <!-- Notifications Dropdown -->\n <div class=\"header-dropdown-container\" (mouseenter)=\"updateTooltipPosition($event)\">\n <cide-ele-dropdown \n #notificationDropdown\n [items]=\"notificationItems()\" \n [config]=\"notificationConfig\"\n [triggerTemplate]=\"notificationTriggerTemplate\"\n [menuTemplate]=\"notificationMenuTemplate\"\n (itemClick)=\"onNotificationClick($event)\">\n </cide-ele-dropdown>\n <div class=\"header-tooltip\">Notifications</div>\n </div>\n \n <ng-template #notificationTriggerTemplate let-isOpen=\"isOpen\">\n <div class=\"header-icon notification-icon\" [class.active]=\"isOpen\">\n <cide-ele-icon>notifications</cide-ele-icon>\n @if (unreadCount() > 0) {\n <div class=\"header-badge\">{{ unreadCount() > 99 ? '99+' : unreadCount() }}</div>\n }\n </div>\n </ng-template>\n\n <!-- Custom Notification Menu Template -->\n <ng-template #notificationMenuTemplate let-items=\"items\">\n <div class=\"tw-min-w-[380px] tw-bg-white dark:tw-bg-gray-800 tw-rounded-xl tw-shadow-2xl tw-overflow-hidden tw-text-gray-900 dark:tw-text-gray-100\">\n <!-- Header - Fixed/Sticky -->\n <div class=\"tw-sticky tw-top-0 tw-z-10 tw-px-2.5 tw-py-1 tw-bg-white dark:tw-bg-gray-800 tw-flex tw-justify-between tw-items-center tw-border-b tw-border-gray-200 dark:tw-border-gray-700 tw-backdrop-blur-sm\">\n <div class=\"tw-flex tw-items-center tw-gap-1\">\n <div class=\"tw-w-5 tw-h-5 tw-bg-blue-500 tw-rounded tw-flex tw-items-center tw-justify-center tw-shadow-sm\">\n <cide-ele-icon class=\"!tw-text-[10px] !tw-text-white\">notifications</cide-ele-icon>\n </div>\n <div class=\"tw-flex tw-items-center tw-gap-1\">\n <h3 class=\"tw-m-0 tw-text-[10px] tw-font-bold tw-text-gray-900 dark:tw-text-gray-100 tw-leading-none\">Notifications</h3>\n @if (unreadCount() > 0) {\n <span class=\"tw-bg-red-500 tw-text-white tw-px-1 tw-py-0 tw-rounded-full tw-text-[7px] tw-font-bold tw-leading-none tw-animate-pulse\">{{ unreadCount() }}</span>\n }\n </div>\n </div>\n <div class=\"tw-flex tw-items-center tw-gap-0.5\">\n <button \n type=\"button\"\n class=\"tw-bg-transparent tw-border-none tw-p-0.5 tw-cursor-pointer tw-text-gray-600 dark:tw-text-gray-400 tw-flex tw-items-center tw-justify-center tw-rounded tw-transition-all tw-duration-200 hover:tw-bg-gray-100 dark:hover:tw-bg-gray-600 hover:tw-text-gray-900 dark:hover:tw-text-gray-200\"\n (click)=\"openNotificationSettings(); $event.stopPropagation()\"\n title=\"Notification Settings\">\n <cide-ele-icon class=\"!tw-text-xs\">settings</cide-ele-icon>\n </button>\n @if (unreadCount() > 0) {\n <button \n type=\"button\"\n class=\"tw-bg-blue-500 tw-text-white tw-px-1 tw-py-0.5 tw-rounded tw-text-[8px] tw-font-semibold tw-cursor-pointer tw-transition-all tw-duration-200 tw-flex tw-items-center tw-gap-0.5 tw-shadow-sm hover:tw-bg-blue-600 hover:tw-scale-105\"\n (click)=\"markAllAsRead(); $event.stopPropagation()\"\n title=\"Mark all as read\">\n <cide-ele-icon class=\"!tw-text-[9px]\">done_all</cide-ele-icon>\n </button>\n }\n <button \n type=\"button\" \n class=\"tw-bg-transparent tw-border-none tw-p-0.5 tw-cursor-pointer tw-text-gray-600 dark:tw-text-gray-400 tw-flex tw-items-center tw-justify-center tw-rounded tw-transition-all tw-duration-200 hover:tw-bg-gray-100 dark:hover:tw-bg-gray-600 hover:tw-text-gray-900 dark:hover:tw-text-gray-200 hover:tw-rotate-90\"\n (click)=\"closeNotificationDropdown($event)\"\n title=\"Close\">\n <cide-ele-icon class=\"!tw-text-xs\">close</cide-ele-icon>\n </button>\n </div>\n </div>\n\n <!-- Notifications List -->\n <div class=\"tw-overflow-x-hidden notification-scroll-container tw-bg-white dark:tw-bg-gray-800 tw-text-gray-900 dark:tw-text-gray-100\">\n @if (notifications().length === 0) {\n <div class=\"tw-py-16 tw-px-4 tw-text-center tw-bg-white dark:tw-bg-gray-800\">\n <cide-ele-icon class=\"!tw-text-6xl !tw-text-gray-300 dark:!tw-text-gray-600 tw-mb-3\">notifications_off</cide-ele-icon>\n <p class=\"tw-m-0 tw-text-sm tw-text-gray-600 dark:tw-text-gray-400 tw-font-medium\">No notifications yet</p>\n <p class=\"tw-m-0 tw-mt-1 tw-text-xs tw-text-gray-500 dark:tw-text-gray-500\">You're all caught up!</p>\n </div>\n } @else {\n @for (notif of notifications().slice(0, 15); track notif.id) {\n <div \n class=\"tw-flex tw-items-start tw-px-3 tw-py-2 tw-cursor-pointer tw-transition-all tw-duration-300 tw-relative tw-gap-2 tw-border-b tw-border-gray-200 dark:tw-border-gray-700 last:tw-border-b-0 hover:tw-bg-gray-50 dark:hover:tw-bg-gray-700 tw-transform tw-ease-in-out tw-bg-white dark:tw-bg-gray-800 tw-text-gray-900 dark:tw-text-gray-100\"\n [class.tw-border-l-2]=\"!isNotificationRead(notif)\"\n [class.tw-border-l-blue-500]=\"!isNotificationRead(notif)\"\n [class.dark:tw-border-l-blue-400]=\"!isNotificationRead(notif)\"\n [class.tw-bg-blue-50]=\"!isNotificationRead(notif)\"\n [class.dark:tw-bg-gray-700]=\"!isNotificationRead(notif)\"\n [class.-tw-translate-x-full]=\"isNotificationAnimating(notif)\"\n [class.tw-opacity-0]=\"isNotificationAnimating(notif)\"\n [class.tw-max-h-0]=\"isNotificationAnimating(notif)\"\n [class.tw-overflow-hidden]=\"isNotificationAnimating(notif)\"\n [class.tw-mb-0]=\"isNotificationAnimating(notif)\"\n [class.tw-p-0]=\"isNotificationAnimating(notif)\"\n (click)=\"onNotificationItemClick(notif)\">\n <!-- Icon/Avatar -->\n <div class=\"tw-flex-shrink-0 tw-relative\">\n <div class=\"tw-w-9 tw-h-9 tw-rounded-full tw-overflow-hidden tw-bg-gradient-to-br tw-from-blue-500 tw-to-blue-600 tw-flex tw-items-center tw-justify-center tw-shadow-sm tw-ring-1 tw-ring-white\">\n @if (getNotificationAvatar(notif)) {\n <img \n cideEleFileImage \n [fileId]=\"getNotificationAvatar(notif) || ''\"\n [altText]=\"getNotificationName(notif)\"\n class=\"tw-w-full tw-h-full tw-object-cover\">\n } @else {\n <cide-ele-icon class=\"!tw-text-base !tw-text-white\">{{ getNotificationIcon(notif.type) }}</cide-ele-icon>\n }\n </div>\n <!-- Green online indicator -->\n <div class=\"tw-absolute tw-bottom-0 tw-right-0 tw-w-2 tw-h-2 tw-bg-green-500 tw-rounded-full tw-border tw-border-white\"></div>\n </div>\n\n <!-- Content -->\n <div class=\"tw-flex-1 tw-min-w-0\">\n <!-- Title and relative time -->\n <div class=\"tw-flex tw-items-start tw-justify-between tw-gap-1.5 tw-mb-0.5\">\n <div class=\"tw-flex-1 tw-min-w-0\">\n <h4 class=\"tw-m-0 tw-text-[11px] tw-font-bold tw-text-gray-900 dark:tw-text-gray-100 tw-leading-tight\">\n <span class=\"tw-text-blue-600 dark:tw-text-blue-400\">{{ getNotificationName(notif) }}</span><span class=\"tw-font-normal tw-text-gray-800 dark:tw-text-gray-300\"> {{ getNotificationAction(notif) }}</span>\n </h4>\n <p class=\"tw-m-0 tw-text-[9px] tw-text-gray-500 dark:tw-text-gray-500 tw-mt-0.5\">{{ getTimeAgo(notif.timestamp) }}</p>\n </div>\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-flex-shrink-0\">\n @if (!isNotificationRead(notif)) {\n <div class=\"tw-w-1.5 tw-h-1.5 tw-rounded-full tw-bg-blue-500 dark:tw-bg-blue-400 tw-animate-pulse\"></div>\n }\n @if (isNotificationAnimating(notif) && isNotificationUndoable(notif)) {\n <button \n type=\"button\"\n (click)=\"undoNotificationRemoval(getNotificationId(notif)); $event.stopPropagation()\"\n class=\"tw-px-2 tw-py-0.5 tw-text-[9px] tw-font-semibold tw-text-blue-600 dark:tw-text-blue-400 tw-bg-blue-50 dark:tw-bg-blue-900 tw-border tw-border-blue-200 dark:tw-border-blue-700 tw-rounded-md tw-cursor-pointer tw-transition-all tw-duration-200 hover:tw-bg-blue-100 dark:hover:tw-bg-blue-800 hover:tw-border-blue-300 dark:hover:tw-border-blue-600 hover:tw-scale-105 tw-whitespace-nowrap tw-animate-pulse\">\n Undo\n </button>\n }\n </div>\n </div>\n \n <!-- Message -->\n @if (notif.message && notif.message !== notif.title) {\n <p class=\"tw-m-0 tw-mt-1 tw-text-[10px] tw-text-gray-700 dark:tw-text-gray-400 tw-leading-snug tw-line-clamp-2\">\n {{ notif.message }}\n </p>\n }\n \n <!-- Comment -->\n @if (notif.data?.comment) {\n <div class=\"tw-mt-1.5 tw-py-1.5 tw-px-2.5 tw-bg-gray-100 dark:tw-bg-gray-700 tw-rounded-md tw-border-l-2 tw-border-l-blue-500 dark:tw-border-l-blue-500\">\n <p class=\"tw-m-0 tw-text-[10px] tw-text-gray-800 dark:tw-text-gray-300 tw-leading-snug tw-italic tw-line-clamp-2\">{{ notif.data.comment }}</p>\n </div>\n }\n \n <!-- File -->\n @if (notif.data?.file) {\n <div class=\"tw-mt-1.5 tw-py-1.5 tw-px-2.5 tw-bg-gray-100 dark:tw-bg-gray-700 tw-border tw-border-gray-300 dark:tw-border-gray-600 tw-rounded-md tw-flex tw-items-center tw-gap-2\">\n <div class=\"tw-w-7 tw-h-7 tw-bg-blue-100 dark:tw-bg-blue-900 tw-rounded-md tw-flex tw-items-center tw-justify-center tw-flex-shrink-0\">\n <span class=\"tw-text-[9px] tw-font-bold tw-text-blue-700 dark:tw-text-blue-300\">{{ getFileIcon(notif.data.file.type) }}</span>\n </div>\n <div class=\"tw-flex-1 tw-min-w-0\">\n <p class=\"tw-m-0 tw-text-[10px] tw-font-semibold tw-text-gray-900 dark:tw-text-gray-100 tw-overflow-hidden tw-text-ellipsis tw-whitespace-nowrap\">{{ notif.data.file.name }}</p>\n <p class=\"tw-m-0 tw-text-[9px] tw-text-gray-600 dark:tw-text-gray-400\">{{ notif.data.file.size }}</p>\n </div>\n <cide-ele-icon class=\"!tw-text-sm !tw-text-blue-600 dark:!tw-text-blue-400 tw-cursor-pointer tw-transition-all tw-duration-200 tw-flex-shrink-0 hover:tw-text-blue-700 dark:hover:tw-text-blue-300 hover:tw-scale-110\">download</cide-ele-icon>\n </div>\n }\n \n <!-- Action Buttons -->\n @if (notif.action_label) {\n <div class=\"tw-mt-1.5 tw-flex tw-gap-1.5\">\n @if (notif.action_label.toLowerCase().includes('decline')) {\n <button type=\"button\" class=\"tw-py-1 tw-px-3 tw-border tw-border-gray-300 dark:tw-border-gray-600 tw-bg-white dark:tw-bg-gray-800 tw-rounded-md tw-text-[10px] tw-font-semibold tw-cursor-pointer tw-transition-all tw-duration-200 tw-text-gray-800 dark:tw-text-gray-300 hover:tw-bg-gray-100 dark:hover:tw-bg-gray-700 hover:tw-border-gray-400 dark:hover:tw-border-gray-500 hover:tw-scale-105\">Decline</button>\n }\n @if (notif.action_label.toLowerCase().includes('accept')) {\n <button type=\"button\" class=\"tw-py-1 tw-px-3 tw-border tw-border-blue-600 dark:tw-border-blue-500 tw-bg-blue-600 dark:tw-bg-blue-500 tw-rounded-md tw-text-[10px] tw-font-semibold tw-cursor-pointer tw-transition-all tw-duration-200 tw-text-white hover:tw-bg-blue-700 dark:hover:tw-bg-blue-600 hover:tw-border-blue-700 dark:hover:tw-border-blue-600 hover:tw-scale-105\">Accept</button>\n }\n </div>\n }\n </div>\n </div>\n }\n }\n </div>\n\n </div>\n </ng-template>\n\n <div class=\"header-divider\"></div>\n\n <!-- Profile with Dropdown -->\n <div class=\"header-icon user-profile\" (mouseenter)=\"updateTooltipPosition($event)\">\n <cide-ele-dropdown [items]=\"profileItems\" [config]=\"profileConfig\"\n [triggerTemplate]=\"triggerTemplate\"\n (itemClick)=\"onProfileClick($event)\">\n <ng-template #triggerTemplate>\n @if (appStateService.currentUser()?.user_photo_id_cyfm) {\n <div class=\"profile-avatar\">\n <img cideEleFileImage [fileId]=\"(appStateService.currentUser()?.user_photo_id_cyfm || '')\"\n [altText]=\"'User Profile Photo'\" class=\"tw-w-full tw-h-full tw-object-cover tw-rounded-full\">\n </div>\n } @else {\n <div class=\"profile-avatar\">\n <cide-ele-icon name=\"person\" class=\"tw-w-6 tw-h-6 tw-text-white\"></cide-ele-icon>\n </div>\n }\n </ng-template>\n </cide-ele-dropdown>\n <div class=\"header-tooltip\">My Account</div>\n </div>\n </div>\n</header>", styles: [".cide-lyt-header{display:flex;align-items:center;justify-content:space-between;background:linear-gradient(to right,rgb(var(--tw-white-rgb) / .95),rgb(var(--tw-gray-50-rgb) / .95));box-shadow:0 2px 8px #00000008;padding:0 1rem;position:relative;z-index:20;transition:all .3s cubic-bezier(.4,0,.2,1);will-change:transform;border-bottom:1px solid rgb(var(--tw-gray-200-rgb) / .8);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.header-logo-container{height:100%;display:flex;align-items:center;padding:.5rem 0;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1);border-radius:8px;outline:none}.header-logo-container img{height:30px;max-height:100%;transition:all .3s ease;border-radius:5px;overflow:hidden;box-shadow:0 1px 4px #0000000d}.header-logo-container:hover img{transform:scale(1.03);filter:brightness(1.05);box-shadow:0 2px 6px #00000014}.header-logo-container:after{content:\"\";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(to bottom right,rgb(var(--tw-white-rgb) / 0),rgb(var(--tw-white-rgb) / .3),rgb(var(--tw-white-rgb) / 0));transform:rotate(30deg);opacity:0;transition:transform .6s ease,opacity .6s ease;pointer-events:none}.header-logo-container:hover:after,.header-logo-container:focus:after{opacity:1;transform:rotate(30deg) translate(50%,50%)}.header-search-container{flex-grow:1;max-width:600px;margin:0 2rem;position:relative;transition:all .3s ease}::ng-deep .header-search-container #cide_lyt_header_search{width:100%;background-color:rgb(var(--tw-gray-50-rgb) / .8);border-radius:20px!important;transition:all .3s ease;overflow:visible;transform:translateZ(0)}::ng-deep .header-search-container #cide_lyt_header_search:hover{box-shadow:0 3px 12px #00000014;background-color:rgb(var(--tw-white-rgb) / 1);transform:translateY(-1px)}::ng-deep .header-search-container #cide_lyt_header_search .cide-input-input{background-color:transparent;font-size:.85rem!important;letter-spacing:.01em}::ng-deep .header-search-container #cide_lyt_header_search .cide-input-leading-icon{color:#6b7280b3!important;font-size:1.1rem!important}::ng-deep .header-search-container #cide_lyt_header_search:focus-within{transform:translateY(-1px) scale(1.01)}::ng-deep .header-search-container #cide_lyt_header_search:focus-within .cide-input-input{border-color:#3b82f6!important}::ng-deep .header-search-container #cide_lyt_header_search:focus-within .cide-input-leading-icon{color:#3b82f6!important}.header-icons-container{display:flex;align-items:center;gap:1rem}.header-icon{position:relative;width:32px;height:32px;display:flex;align-items:center;justify-content:center;transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;color:#374151;border-radius:.4rem;margin:0 2px}.header-dropdown-container{position:relative;display:flex;align-items:center;justify-content:center;transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;color:#374151;border-radius:.4rem;margin:0 2px}.header-icon:before{content:\"\";position:absolute;inset:0;background-color:#3b82f61a;border-radius:.5rem;opacity:0;transform:scale(.8);transition:all .2s cubic-bezier(.4,0,.2,1)}.header-icon:hover:before{opacity:1;transform:scale(1)}.header-icon:hover{color:#3b82f6}.header-icon:active{transform:scale(.95)}.header-tooltip{position:absolute;bottom:-26px;left:50%;transform:translate(-50%);background-color:rgb(var(--tw-gray-700-rgb) / .9);color:rgb(var(--tw-white-rgb) / 1);padding:.25rem .6rem;border-radius:.25rem;font-size:.7rem;white-space:nowrap;opacity:0;pointer-events:none;transition:all .2s cubic-bezier(.4,0,.2,1);z-index:1000;box-shadow:0 2px 5px #0003;letter-spacing:.01em;will-change:transform,opacity}.header-tooltip:before{content:\"\";position:absolute;bottom:100%;left:50%;transform:translate(-50%);border-width:5px;border-style:solid;border-color:transparent transparent rgba(55,65,81,.9) transparent}.header-icon:hover .header-tooltip{opacity:1;transform:translate(-50%) translateY(0)}.header-badge{position:absolute;top:-2px;right:-2px;min-width:18px;height:18px;border-radius:9px;background-color:#ef4444;color:rgb(var(--tw-white-rgb) / 1);font-size:10px;display:flex!important;align-items:center;justify-content:center;padding:0 5px;box-shadow:0 2px 4px #ef444466;font-weight:700;z-index:10;transition:all .2s ease;line-height:1;border:2px solid #ffffff}.header-icon:hover .header-badge{transform:scale(1.15);box-shadow:0 3px 6px #ef444480}.header-icon.notification-icon{position:relative;overflow:visible}.header-divider{height:20px;width:1px;background-color:#e5e7ebcc;margin:0 6px}.header-year-dropdown-wrapper{position:relative;display:flex;align-items:center;justify-content:center}.header-year-pill{position:relative;display:flex;align-items:center;padding:.25rem .625rem;background:linear-gradient(135deg,#3b82f61a,#2563eb26);border:1px solid rgba(59,130,246,.3);border-radius:9999px;color:#2563eb;font-size:.6875rem;font-weight:600;transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;white-space:nowrap;box-shadow:0 1px 2px #3b82f61a;min-height:22px;height:22px;line-height:1}.header-year-pill:hover{background:linear-gradient(135deg,#3b82f626,#2563eb33);border-color:#3b82f666;transform:translateY(-1px);box-shadow:0 2px 6px #3b82f626}.header-year-pill-text{max-width:180px;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.01em;line-height:1;display:inline-block}::ng-deep .header-dropdown-container .dropdown-trigger{background:transparent!important;border:none!important;border-radius:0!important;padding:0!important;width:100%!important;height:100%!important;min-width:auto!important;box-shadow:none!important;display:flex!important;align-items:center!important;justify-content:center!important;transition:none!important;cursor:pointer!important}::ng-deep .header-dropdown-container .dropdown-trigger:hover{background:transparent!important}::ng-deep .header-dropdown-container .dropdown-trigger:hover .header-year-pill{background:linear-gradient(135deg,#3b82f626,#2563eb33)!important;border-color:#3b82f666!important;transform:translateY(-1px)!important;box-shadow:0 2px 6px #3b82f626!important}::ng-deep .header-dropdown-container .dropdown-trigger:focus,::ng-deep .header-dropdown-container .dropdown-trigger:focus-visible,::ng-deep .header-dropdown-container .dropdown-trigger:active{outline:none!important;box-shadow:0 2px 6px #3b82f626!important}.profile-avatar{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,#3b82f6,#2563eb);color:rgb(var(--tw-white-rgb) / 1);font-size:.75rem;font-weight:600;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px #2563eb33;transition:all .2s cubic-bezier(.4,0,.2,1);letter-spacing:-.5px;cursor:pointer;border:2px solid transparent}.profile-avatar:hover,.header-icon:hover .profile-avatar{transform:scale(1.08);box-shadow:0 3px 8px #2563eb4d;border-color:#3b82f64d}::ng-deep .user-profile .dropdown-trigger{background:transparent!important;border:none!important;padding:0!important;width:auto!important;height:auto!important;border-radius:0!important}::ng-deep .user-profile .dropdown-trigger:hover{background:transparent!important}::ng-deep .user-profile .dropdown-trigger:focus,::ng-deep .user-profile .dropdown-trigger:focus-visible,::ng-deep .user-profile .dropdown-trigger:active{outline:none!important;box-shadow:none!important}:root[data-theme=dark] .cide-lyt-header,:root.dark-mode .cide-lyt-header{background:linear-gradient(to right,var(--cide-theme-light-color),var(--cide-theme-hover-bg-color));border-bottom-color:var(--cide-theme-border-color);box-shadow:0 2px 8px var(--cide-theme-shadow-color)}:root[data-theme=dark] .header-icon,:root.dark-mode .header-icon{color:var(--cide-theme-text-color)}:root[data-theme=dark] .header-icon.notification-icon,:root.dark-mode .header-icon.notification-icon{color:#d1d5db}:root[data-theme=dark] .header-icon.notification-icon:hover,:root.dark-mode .header-icon.notification-icon:hover{color:#60a5fa}:root[data-theme=dark] .header-divider,:root.dark-mode .header-divider{background-color:var(--cide-theme-border-color)}:root[data-theme=dark] .header-year-pill,:root.dark-mode .header-year-pill{background:linear-gradient(135deg,#60a5fa33,#3b82f640);border-color:#60a5fa80;color:#60a5fa}:root[data-theme=dark] .header-year-pill .header-year-pill-text,:root.dark-mode .header-year-pill .header-year-pill-text{color:#60a5fa}:root[data-theme=dark] .header-year-pill cide-ele-icon,:root.dark-mode .header-year-pill cide-ele-icon{color:#60a5fa!important}:root[data-theme=dark] .header-year-pill:hover,:root.dark-mode .header-year-pill:hover{background:linear-gradient(135deg,#60a5fa4d,#3b82f659);border-color:#60a5fa99;color:#93c5fd}:root[data-theme=dark] .header-year-pill:hover .header-year-pill-text,:root.dark-mode .header-year-pill:hover .header-year-pill-text{color:#93c5fd}:root[data-theme=dark] .header-year-pill:hover cide-ele-icon,:root.dark-mode .header-year-pill:hover cide-ele-icon{color:#93c5fd!important}:root[data-theme=dark] ::ng-deep .header-search-container #cide_lyt_header_search,:root.dark-mode ::ng-deep .header-search-container #cide_lyt_header_search{background-color:var(--cide-theme-hover-bg-color);border-color:var(--cide-theme-border-color)}:root[data-theme=dark] ::ng-deep .header-search-container #cide_lyt_header_search:hover,:root.dark-mode ::ng-deep .header-search-container #cide_lyt_header_search:hover{background-color:var(--cide-theme-light-color);box-shadow:0 3px 12px var(--cide-theme-shadow-color)}:root[data-theme=dark] ::ng-deep .header-search-container #cide_lyt_header_search .cide-input-leading-icon,:root.dark-mode ::ng-deep .header-search-container #cide_lyt_header_search .cide-input-leading-icon{color:var(--cide-theme-label-color)!important}.header-avatar{width:36px;height:36px;border-radius:50%;overflow:hidden;transition:all .2s cubic-bezier(.4,0,.2,1);border:2px solid transparent;box-shadow:0 2px 4px #0000001a}.header-avatar:hover{border-color:#3b82f6;transform:scale(1.05);box-shadow:0 3px 6px #3b82f64d}@media (max-width: 768px){.cide-lyt-header{padding:.5rem .75rem;flex-wrap:wrap;min-height:56px;height:auto}.header-logo-container{padding:.25rem 0}.header-logo-container img,.header-logo-container cide-ele-icon{width:24px;height:24px}.header-logo-container+span{font-size:.875rem;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.header-search-container{order:3;flex:1 1 100%;max-width:100%;margin:.5rem 0 0;min-width:0}@media (max-width: 480px){.header-search-container{display:none}}.header-icons-container{gap:.5rem;flex-wrap:wrap;justify-content:flex-end}.header-icon{width:28px;height:28px;margin:0 1px}.header-year-pill{padding:.2rem .5rem;font-size:.625rem;min-height:20px;height:20px}.header-year-pill-text{max-width:80px}.profile-avatar{width:24px;height:24px;font-size:.625rem}.header-divider{display:none}.header-dropdown-container{margin:0 1px}.header-badge{min-width:16px;height:16px;font-size:9px;top:-1px;right:-1px}}@media (max-width: 640px){.cide-lyt-header{padding:.5rem}.header-search-container{max-width:100%;margin:.5rem 0 0}.header-icon{width:26px;height:26px}@media (max-width: 480px){.header-year-pill-text{display:none}.header-year-pill{padding:.2rem;width:28px;justify-content:center}.header-icons-container{gap:.25rem}}}@media (min-width: 769px) and (max-width: 1024px){.header-search-container{max-width:400px;margin:0 1.5rem}.header-icons-container{gap:.75rem}}@media (max-width: 768px) and (orientation: landscape){.cide-lyt-header{min-height:48px;padding:.375rem .75rem}.header-search-container{order:0;flex:0 1 auto;max-width:250px;margin:0 1rem}}.notification-scroll-container{scrollbar-width:thin;scrollbar-color:var(--cide-ele-scrollbar-thumb, #d1d5db) var(--cide-ele-scrollbar-track, transparent)}.notification-scroll-container::-webkit-scrollbar{width:6px;height:6px}.notification-scroll-container::-webkit-scrollbar-track{background:var(--cide-ele-scrollbar-track, transparent)}.notification-scroll-container::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb, #d1d5db);border-radius:3px}.notification-scroll-container::-webkit-scrollbar-thumb:hover{background-color:var(--cide-ele-scrollbar-thumb-hover, #9ca3af)}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container{background-color:#fff!important;color:#111827!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container *{color:inherit}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-text-gray-900{color:#111827!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-text-gray-800{color:#1f2937!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-text-gray-700{color:#374151!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-text-gray-600{color:#4b5563!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-text-gray-500{color:#6b7280!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-text-blue-600{color:#2563eb!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-bg-white{background-color:#fff!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-bg-gray-50{background-color:#f9fafb!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-bg-gray-100{background-color:#f3f4f6!important}:root:not([data-theme=dark]):not(.dark-mode) .notification-scroll-container .tw-bg-blue-50{background-color:#eff6ff!important}\n"] }]
|
|
@@ -3667,10 +3683,10 @@ class CideLytUserStatusService {
|
|
|
3667
3683
|
setAutoAwayTimeout(timeout) {
|
|
3668
3684
|
this.autoAwayTimeout = timeout;
|
|
3669
3685
|
}
|
|
3670
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
3671
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
3686
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytUserStatusService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
3687
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytUserStatusService, providedIn: 'root' });
|
|
3672
3688
|
}
|
|
3673
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
3689
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytUserStatusService, decorators: [{
|
|
3674
3690
|
type: Injectable,
|
|
3675
3691
|
args: [{
|
|
3676
3692
|
providedIn: 'root'
|
|
@@ -3861,7 +3877,14 @@ class CideLytSidebarWrapperComponent {
|
|
|
3861
3877
|
};
|
|
3862
3878
|
initializeAnimations();
|
|
3863
3879
|
// Get sidebar menu data with loading state tracking
|
|
3864
|
-
|
|
3880
|
+
// Include entity ID to get menus/rights as per logged in entity
|
|
3881
|
+
const activeEntity = this.appState.activeEntity();
|
|
3882
|
+
const entityId = activeEntity?._id;
|
|
3883
|
+
this.sidebarService?.getSidebarMenues({
|
|
3884
|
+
syme_type: "module",
|
|
3885
|
+
sort: 'asc',
|
|
3886
|
+
syme_title: ""
|
|
3887
|
+
})?.subscribe({
|
|
3865
3888
|
next: (res) => {
|
|
3866
3889
|
this.core_system_module.set(res?.data || []);
|
|
3867
3890
|
// Handle module initialization and active module setup
|
|
@@ -3919,6 +3942,9 @@ class CideLytSidebarWrapperComponent {
|
|
|
3919
3942
|
this.loadingMenus.set(true);
|
|
3920
3943
|
this.menuLoadComplete.set(false);
|
|
3921
3944
|
// Fetch menus for the selected module
|
|
3945
|
+
// Include entity ID to get menus/rights as per logged in entity
|
|
3946
|
+
const activeEntity = this.appState.activeEntity();
|
|
3947
|
+
const entityId = activeEntity?._id;
|
|
3922
3948
|
this.sidebarService?.getSidebarMenues({
|
|
3923
3949
|
syme_id: module._id,
|
|
3924
3950
|
sort: 'asc'
|
|
@@ -4204,8 +4230,8 @@ class CideLytSidebarWrapperComponent {
|
|
|
4204
4230
|
this.showOptions.set(false);
|
|
4205
4231
|
}
|
|
4206
4232
|
}
|
|
4207
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
4208
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: CideLytSidebarWrapperComponent, isStandalone: true, selector: "cide-lyt-sidebar-wrapper", host: { listeners: { "document:click": "onDocumentClick($event)" } }, ngImport: i0, template: "<nav class=\"cide-lyt-sidebar tw-flex tw-h-full tw-select-none\" [class.collapsed]=\"isCollapsed()\">\n <!-- First tier sidebar (Icon only) -->\n <div class=\"cide-lyt-stack tw-h-full tw-flex tw-flex-col tw-items-center tw-border-r tw-border-gray-100\">\n <!-- Scrollable content -->\n <div class=\"sidebar-scroll-content\">\n <!-- Collapse/Expand toggle -->\n <div class=\"nav-item collapse-toggle\" tabindex=\"0\" (click)=\"toggleSidebar()\"\n (keydown.enter)=\"toggleSidebar()\">\n <div class=\"nav-tooltip\">{{isCollapsed() ? 'Expand' : 'Collapse'}} Sidebar</div>\n <cide-ele-icon size=\"xs\" type=\"box\" class=\"tw-text-gray-500 hover:tw-text-gray-700\">\n {{isCollapsed() ? 'chevron_right' : 'chevron_left'}}\n </cide-ele-icon>\n </div> <!-- Main navigation icons - Enhanced Design -->\n <div class=\"tw-flex tw-flex-col tw-gap-4\">\n @for (core_system_module_item of core_system_module(); track $index) {\n <div class=\"nav-item tw-relative tw-group\" (click)=\"setActiveMenu(core_system_module_item._id, $event)\"\n [cideEleTooltip]=\"core_system_module_item.syme_title\" [tooltipShowArrow]=\"true\"\n tooltipPlacement=\"right\"\n [ngClass]=\"{'nav-item-active': activeModuleId === core_system_module_item._id}\"\n (mouseenter)=\"onItemHover(core_system_module_item._id)\" (mouseleave)=\"onItemHover('')\"\n [tabindex]=\"$index.toString()\" (keydown.enter)=\"setActiveMenu(core_system_module_item._id, $event)\">\n\n <!-- Notification Badge with enhanced design -->\n @if (core_system_module_item?.syme_ping) {\n <div class=\"nav-badge tw-absolute -tw-top-1 -tw-right-1 tw-w-1.5 tw-h-1.5 tw-rounded-full tw-animate-ping\"\n style=\"background-color: var(--cide-theme-error-color);\">\n </div>\n }\n\n <!-- Enhanced icon with better visual effects -->\n <div\n class=\"tw-p-2 tw-rounded-xl tw-transition-all tw-duration-200 tw-ease-in-out\n group-hover:tw-bg-blue-50 group-hover:tw-shadow-md group-hover:tw-scale-105\n tw-border-2 tw-border-transparent\n {{activeModuleId === core_system_module_item._id ? 'tw-bg-blue-100 tw-border-blue-200 tw-shadow-sm' : 'tw-bg-gray-50'}}\">\n <cide-ele-icon type=\"box\" size=\"xs\"\n class=\"tw-transition-all tw-duration-200 tw-ease-in-out\n {{activeModuleId === core_system_module_item._id ? 'tw-text-blue-600' : 'tw-text-gray-600 group-hover:tw-text-blue-500'}}\">\n {{core_system_module_item?.syme_icon || 'dashboard'}}\n </cide-ele-icon>\n </div>\n\n <!-- Modern active indicator -->\n @if (activeModuleId === core_system_module_item._id) {\n <div\n class=\"nav-indicator tw-absolute tw-left-0 tw-top-1/2 tw-transform -tw-translate-y-1/2 tw-w-1 tw-h-8 tw-bg-blue-500 tw-rounded-r-full tw-shadow-lg tw-transition-all tw-duration-300\">\n </div>\n }\n </div>\n }\n </div>\n </div>\n </div> <!-- Second tier sidebar (Expanded view) -->\n <div class=\"cide-lyt-sidebar-menu tw-h-full tw-overflow-hidden tw-shadow-sm\">\n <div class=\"tw-flex tw-flex-col tw-h-full\">\n <!-- Header section with search and options -->\n <div class=\"sidebar-header tw-p-2.5 tw-border-b tw-border-gray-100\">\n <!-- Title with back button - Clean layout without online indicator -->\n <div class=\"tw-flex tw-items-center tw-gap-2 tw-mb-2.5\">\n <button\n class=\"back-button tw-p-1.5 tw-rounded-lg tw-text-gray-500 hover:tw-bg-gray-100 hover:tw-text-gray-700 tw-transition-colors tw-flex-shrink-0\"\n [cideEleTooltip]=\"'Back to home'\" tooltipPlacement=\"bottom\">\n <cide-ele-icon type=\"none\" size=\"xs\" class=\"tw-transition-transform hover:tw-scale-110\">{{\n getActiveModuleIcon() }}</cide-ele-icon>\n </button>\n <div class=\"tw-flex-1 tw-min-w-0\">\n <h2 class=\"tw-text-sm tw-font-semibold tw-text-gray-900 tw-truncate tw-leading-5\">\n {{ appState.getActiveModuleTitle() || 'Menu' }}\n </h2>\n <p class=\"tw-text-xs tw-text-gray-500 tw-truncate tw-mt-0.5\">\n Module Dashboard\n </p>\n </div>\n </div>\n\n <!-- Search and options -->\n <div class=\"tw-flex tw-items-center tw-justify-between\">\n <div class=\"search-wrapper tw-relative tw-flex-1\">\n <cide-ele-input type=\"text\" leadingIcon=\"search\" size=\"xs\" placeholder=\"Search settings...\"\n [clearInput]=\"true\" [ngModel]=\"searchText()\" (ngModelChange)=\"onSearchTextChange($event)\" (input)=\"onSearch()\">\n </cide-ele-input>\n <div\n class=\"search-shortcut tw-absolute tw-right-3 tw-top-1/2 -tw-translate-y-1/2 tw-bg-gray-100 tw-text-gray-500 tw-rounded tw-px-1.5 tw-py-0.5 tw-text-xs\">\n \u2318K</div>\n </div>\n <button\n class=\"tw-ml-2 tw-p-1.5 tw-rounded-lg tw-text-gray-500 hover:tw-bg-gray-100 hover:tw-text-gray-700 tw-transition-colors\"\n (click)=\"toggleOptions()\">\n <cide-ele-icon type=\"none\" size=\"xs\">more_vert</cide-ele-icon>\n </button>\n\n <!-- Options dropdown menu -->\n <div *ngIf=\"showOptions()\"\n class=\"options-menu tw-absolute tw-right-4 tw-top-16 tw-mt-2 tw-w-48 tw-rounded-md tw-shadow-lg tw-bg-white tw-ring-1 tw-ring-black tw-ring-opacity-5 tw-divide-y tw-divide-gray-100 tw-z-10\">\n <div class=\"tw-py-1\">\n <a href=\"#\"\n class=\"tw-group tw-flex tw-items-center tw-px-4 tw-py-2 tw-text-sm tw-text-gray-700 hover:tw-bg-gray-100\">\n <cide-ele-icon class=\"tw-mr-3 tw-text-gray-500 tw-group-hover:tw-text-gray-600\"\n type=\"none\" size=\"xs\">refresh</cide-ele-icon>\n Refresh\n </a>\n <a href=\"#\"\n class=\"tw-group tw-flex tw-items-center tw-px-4 tw-py-2 tw-text-sm tw-text-gray-700 hover:tw-bg-gray-100\">\n <cide-ele-icon class=\"tw-mr-3 tw-text-gray-500 tw-group-hover:tw-text-gray-600\"\n type=\"none\" size=\"xs\">sync</cide-ele-icon>\n Sync settings\n </a>\n </div>\n <div class=\"tw-py-1\">\n <a href=\"#\"\n class=\"tw-group tw-flex tw-items-center tw-px-4 tw-py-2 tw-text-sm tw-text-gray-700 hover:tw-bg-gray-100\">\n <cide-ele-icon class=\"tw-mr-3 tw-text-gray-500 tw-group-hover:tw-text-gray-600\"\n type=\"none\" size=\"xs\">help_outline</cide-ele-icon>\n Help & support\n </a>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Menu items with categories -->\n <div class=\"sidebar-content tw-overflow-y-auto tw-flex-1\" (scroll)=\"onScroll($event)\">\n <!-- Search results if searching -->\n <div *ngIf=\"searchText()\" class=\"sidebar-section tw-p-2.5\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-2\">\n <h3 class=\"tw-text-xs tw-font-semibold tw-text-gray-500\">SEARCH RESULTS</h3>\n <span class=\"tw-text-xs tw-text-gray-500\">{{searchResults().length}} items</span>\n </div>\n\n <div *ngIf=\"searchResults().length > 0\" class=\"tw-space-y-1\">\n <a *ngFor=\"let item of searchResults()\" href=\"#\"\n class=\"menu-item tw-flex tw-items-center tw-px-2 tw-py-1.5 tw-rounded-md hover:tw-bg-gray-50\">\n <cide-ele-icon class=\"tw-mr-2 tw-text-gray-500\" type=\"none\"\n size=\"xs\">{{item.icon}}</cide-ele-icon>\n <span class=\"tw-text-sm tw-text-gray-700\">{{item.title}}</span>\n </a>\n </div>\n\n <div *ngIf=\"searchResults().length === 0\" class=\"tw-p-4 tw-text-center\">\n <div class=\"tw-flex tw-justify-center tw-mb-3\">\n <cide-ele-icon class=\"tw-text-gray-400\" type=\"none\" size=\"md\">search_off</cide-ele-icon>\n </div>\n <p class=\"tw-text-sm tw-text-gray-500\">No results for \"{{searchText()}}\"</p>\n <p class=\"tw-text-xs tw-text-gray-400 tw-mt-1\">Try another search term</p>\n </div>\n </div>\n\n <!-- Only show these sections if not searching -->\n <ng-container *ngIf=\"!searchText()\">\n <!-- Loading state -->\n <div *ngIf=\"loadingMenus()\" class=\"tw-p-4 tw-text-center\">\n <div class=\"tw-flex tw-justify-center tw-mb-3\">\n <cide-ele-spinner variant=\"circle\" size=\"xs\"></cide-ele-spinner>\n </div>\n <p class=\"tw-text-sm tw-text-gray-500\">Loading menus...</p>\n </div>\n\n <!-- Dynamic menu tree -->\n <div *ngIf=\"!loadingMenus() && menuLoadComplete()\" class=\"sidebar-section tw-p-2.5\"\n [class.animate-in]=\"animateSections()[0]\">\n <ng-container\n *ngTemplateOutlet=\"recursiveMenu; context: {$implicit: selectedModuleMenus, level: 0}\"></ng-container>\n </div>\n\n <!-- Empty state -->\n <div *ngIf=\"!loadingMenus() && menuLoadComplete() && selectedModuleMenus.length === 0\"\n class=\"tw-p-4 tw-text-center\">\n <div class=\"tw-flex tw-justify-center tw-mb-3\">\n <cide-ele-icon class=\"tw-text-gray-400\" type=\"none\" size=\"md\">folder_open</cide-ele-icon>\n </div>\n <p class=\"tw-text-sm tw-text-gray-500\">No menus available</p>\n <p class=\"tw-text-xs tw-text-gray-400 tw-mt-1\">Select a module to view its menus</p>\n </div>\n </ng-container>\n\n <!-- Recursive menu template -->\n <ng-template #recursiveMenu let-menus let-level=\"level\">\n <div [class.tw-ml-0]=\"level > 0\">\n <div *ngFor=\"let menu of menus\" class=\"tw-mb-2\">\n <!-- Title type items (section headers) -->\n <div *ngIf=\"menu.syme_type === 'title'\" class=\"tw-mb-1.5\">\n <h3 class=\"tw-text-[10px] tw-font-medium tw-text-gray-400 tw-uppercase tw-mb-1 tw-tracking-wider\">{{\n menu.syme_title }}</h3>\n <!-- Render children of title -->\n <ng-container *ngIf=\"menu.children && menu.children.length > 0\">\n <ng-container\n *ngTemplateOutlet=\"recursiveMenu; context: {$implicit: menu.children, level: level + 1}\"></ng-container>\n </ng-container>\n </div>\n\n <!-- Section type items (collapsible sections) -->\n <div *ngIf=\"menu.syme_type === 'section'\" class=\"tw-mb-2\">\n <!-- Section header (clickable to expand/collapse) -->\n <button (click)=\"toggleSection(menu._id)\" (keydown.enter)=\"toggleSection(menu._id)\"\n (keydown.space)=\"toggleSection(menu._id)\"\n class=\"section-header tw-w-full tw-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-md hover:tw-bg-gray-50 tw-cursor-pointer tw-transition-colors tw-text-left\"\n [class.tw-bg-blue-50]=\"isSectionExpanded(menu._id)\" type=\"button\" tabindex=\"0\"\n role=\"button\" [attr.aria-expanded]=\"isSectionExpanded(menu._id)\"\n [attr.aria-label]=\"'Toggle ' + menu.syme_title + ' section'\">\n\n <!-- Section Icon (left side, like other menu items) -->\n <cide-ele-icon class=\"tw-mr-1.5 tw-text-gray-400\" type=\"none\" size=\"2xs\">{{\n menu.syme_icon || 'folder' }}</cide-ele-icon>\n\n <!-- Section Title -->\n <span class=\"tw-text-xs tw-font-medium tw-text-gray-700\">{{ menu.syme_title\n }}</span>\n\n <!-- Right side icons container -->\n <div class=\"tw-ml-auto tw-flex tw-items-center tw-space-x-1.5\">\n <!-- Child Count Badge -->\n <span *ngIf=\"menu.children && menu.children.length > 0\"\n class=\"tw-px-1.5 tw-py-0.5 tw-bg-gray-200 tw-text-gray-500 tw-rounded-full tw-text-[10px] tw-font-medium\">\n {{ menu.children.length }}\n </span>\n\n <!-- Expand/Collapse Icon (right side) -->\n <cide-ele-icon class=\"tw-text-gray-400 tw-transition-transform tw-duration-200\"\n [class.tw-rotate-90]=\"isSectionExpanded(menu._id)\" type=\"none\"\n size=\"2xs\">chevron_right</cide-ele-icon>\n </div>\n </button>\n\n <!-- Section Content (collapsible) -->\n <div *ngIf=\"isSectionExpanded(menu._id) && menu.children && menu.children.length > 0\"\n class=\"section-content tw-mt-1 tw-ml-2 tw-border-l tw-border-gray-200 tw-pl-2.5\"\n [@slideInOut]=\"isSectionExpanded(menu._id) ? 'in' : 'out'\">\n <ng-container\n *ngTemplateOutlet=\"recursiveMenu; context: {$implicit: menu.children, level: level + 1}\"></ng-container>\n </div>\n </div>\n\n <!-- Menu type items (clickable links) -->\n <a *ngIf=\"menu.syme_type === 'menu'\" (click)=\"onMenuClick(menu, $event)\"\n (keydown.enter)=\"onMenuClick(menu, $event)\" (keydown.space)=\"onMenuClick(menu, $event)\" tabindex=\"0\"\n role=\"button\"\n class=\"menu-item tw-flex tw-items-center tw-px-2 tw-py-1.5 tw-rounded-md hover:tw-bg-gray-50 tw-cursor-pointer tw-transition-colors\">\n <cide-ele-icon *ngIf=\"menu.syme_icon\" class=\"tw-mr-2 tw-text-gray-500\" type=\"none\"\n size=\"xs\">{{ menu.syme_icon }}</cide-ele-icon>\n <span class=\"tw-text-sm tw-text-gray-700\">{{ menu.syme_title }}</span>\n <cide-ele-icon *ngIf=\"menu.children && menu.children.length > 0\"\n class=\"tw-ml-auto tw-text-gray-400\" type=\"none\"\n size=\"2xs\">chevron_right</cide-ele-icon>\n </a>\n\n <!-- Render nested children for menu items -->\n <ng-container\n *ngIf=\"menu.syme_type === 'menu' && menu.children && menu.children.length > 0\">\n <ng-container\n *ngTemplateOutlet=\"recursiveMenu; context: {$implicit: menu.children, level: level + 1}\"></ng-container>\n </ng-container>\n </div>\n </div>\n </ng-template>\n </div>\n\n <!-- Notification panel (overlays content when shown) -->\n <div *ngIf=\"showNotifications()\" class=\"notification-panel tw-absolute tw-inset-0 tw-bg-white tw-z-20\">\n <div class=\"tw-p-4 tw-border-b tw-border-gray-100 tw-flex tw-justify-between tw-items-center\">\n <h3 class=\"tw-text-sm tw-font-medium\">Notifications</h3>\n <button class=\"tw-p-1.5 tw-rounded-lg tw-text-gray-500 hover:tw-bg-gray-100\"\n (click)=\"toggleNotificationsPanel()\">\n <cide-ele-icon type=\"none\" size=\"xs\">close</cide-ele-icon>\n </button>\n </div>\n\n <div class=\"tw-p-4\">\n <div class=\"tw-flex tw-justify-between tw-items-center tw-mb-4\">\n <div class=\"tw-text-xs tw-text-gray-500\">Today</div>\n <button class=\"tw-text-xs tw-text-blue-500 hover:tw-text-blue-600\" (click)=\"markAllAsRead()\">Mark all as read</button>\n </div>\n\n <div class=\"tw-space-y-3\">\n @for (notification of notifications(); track notification.id) {\n <div \n [@notificationRemove]=\"notification.state\"\n class=\"notification-item tw-p-3 tw-rounded-lg tw-border-l-4 tw-relative tw-group\"\n [class.tw-border-blue-500]=\"notification.unread\"\n [class.tw-border-transparent]=\"!notification.unread\"\n [class.tw-bg-blue-50]=\"notification.unread\">\n <div class=\"tw-flex tw-gap-3\">\n <div\n class=\"tw-w-8 tw-h-8 tw-rounded-full tw-flex tw-items-center tw-justify-center\"\n [class.tw-bg-blue-100]=\"notification.unread\"\n [class.tw-bg-gray-100]=\"!notification.unread\"\n [class.tw-text-blue-500]=\"notification.unread\"\n [class.tw-text-gray-500]=\"!notification.unread\">\n <cide-ele-icon type=\"none\" size=\"xs\">{{ notification.icon }}</cide-ele-icon>\n </div>\n <div class=\"tw-flex-1\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-900\">{{ notification.title }}</div>\n <div class=\"tw-text-xs tw-text-gray-500 tw-mt-1\">{{ notification.message }}</div>\n <div class=\"tw-text-xs tw-text-gray-400 tw-mt-2\">{{ notification.time }}</div>\n </div>\n <button \n class=\"tw-opacity-0 group-hover:tw-opacity-100 tw-transition-opacity tw-p-1 tw-rounded hover:tw-bg-gray-200 tw-text-gray-500 hover:tw-text-gray-700\"\n (click)=\"removeNotification(notification.id)\"\n title=\"Remove notification\">\n <cide-ele-icon type=\"none\" size=\"xs\">close</cide-ele-icon>\n </button>\n </div>\n </div>\n }\n @if (notifications().length === 0) {\n <div class=\"tw-p-8 tw-text-center\">\n <cide-ele-icon class=\"tw-text-gray-400 tw-mb-2\" type=\"none\" size=\"md\">notifications_none</cide-ele-icon>\n <p class=\"tw-text-sm tw-text-gray-500\">No notifications</p>\n </div>\n }\n </div>\n </div>\n </div>\n\n <!-- Storage info at bottom -->\n <div class=\"sidebar-footer tw-p-2 tw-border-t tw-border-gray-100\">\n <!-- for info display -->\n </div>\n </div>\n </div>\n\n <!-- Resizer -->\n <div parentElementSelector=\"#cide-lyt-sidebar-page-inner-wrapper\"\n [minPrevSize]=\"sidebarSetupData.cide_lyt_sidebar_width\" prevElementSelector=\"#cide-lyt-sidebar-page\"\n nextElementSelector=\"#cide-lyt-page-wrapper\" cideEleResizer direction=\"horizontal\">\n <div class=\"cide-lyt-devider-track tw-w-full tw-h-full\"></div>\n </div>\n</nav>", styles: [".cide-lyt-sidebar{display:flex;box-shadow:0 4px 12px #0000000d;overflow:hidden;background-color:var(--cide-theme-sidebar-color);--sidebar-tooltip-bg: var(--cide-theme-dark-color);--sidebar-tooltip-color: var(--cide-theme-light-color);--sidebar-shadow-color: rgba(0, 0, 0, .05);transition:width .3s cubic-bezier(.4,0,.2,1);max-height:100%;isolation:isolate;will-change:width;position:relative;width:calc(var(--cide-lyt-stack-wrapper-width) + var(--cide-lyt-sidebar-menu-width));min-width:calc(var(--cide-lyt-stack-wrapper-width) + var(--cide-lyt-sidebar-menu-width))}.cide-lyt-sidebar.resizing,#cide-lyt-sidebar-page.resizing{transition:none!important}.cide-lyt-sidebar.collapsed{width:var(--cide-lyt-stack-wrapper-width)!important;min-width:var(--cide-lyt-stack-wrapper-width)!important;animation:collapseEffect .3s forwards}.cide-lyt-sidebar:not(.collapsed){animation:expandEffect .3s forwards}@keyframes collapseEffect{0%{box-shadow:0 4px 12px var(--sidebar-shadow-color)}to{box-shadow:0 2px 8px var(--sidebar-shadow-color)}}@keyframes expandEffect{0%{box-shadow:0 2px 8px var(--sidebar-shadow-color)}to{box-shadow:0 4px 12px var(--sidebar-shadow-color)}}.cide-lyt-sidebar.animating{transition:width .3s cubic-bezier(.25,.46,.45,.94)}.cide-lyt-sidebar.collapsed .cide-lyt-sidebar-menu{width:0;opacity:0;visibility:hidden;transform:translate(-10px);transition:width .3s cubic-bezier(.4,0,.2,1),opacity .3s cubic-bezier(.4,0,.2,1),visibility .3s cubic-bezier(.4,0,.2,1),transform .3s cubic-bezier(.4,0,.2,1)}.cide-lyt-sidebar:not(.collapsed) .cide-lyt-sidebar-menu{width:var(--cide-lyt-sidebar-menu-width);opacity:1;visibility:visible;transform:translate(0);transition:width .3s cubic-bezier(.4,0,.2,1),opacity .3s cubic-bezier(.4,0,.2,1) .1s,visibility .3s cubic-bezier(.4,0,.2,1) .1s,transform .3s cubic-bezier(.4,0,.2,1) .1s}.cide-lyt-stack{background:linear-gradient(to bottom,var(--cide-theme-sidebar-color),var(--cide-theme-light-color));z-index:10;border-right:1px solid var(--cide-theme-light-color);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:0 0 1.5rem;transition:all .3s cubic-bezier(.4,0,.2,1);overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:var(--cide-theme-color-brand-primary) transparent;position:relative;will-change:transform;scroll-behavior:smooth;box-shadow:inset -1px 0 0 var(--sidebar-shadow-color)}.cide-lyt-stack:after{content:\"\";position:absolute;bottom:0;left:0;right:0;height:30px;background:linear-gradient(to top,color-mix(in srgb,var(--cide-theme-sidebar-color) 90%,transparent),transparent);pointer-events:none;opacity:0;transition:opacity .3s ease;z-index:2}.cide-lyt-stack:before{content:\"\";position:absolute;top:0;left:0;right:0;height:30px;background:linear-gradient(to bottom,color-mix(in srgb,var(--cide-theme-sidebar-color) 90%,transparent),transparent);pointer-events:none;opacity:0;transition:opacity .3s ease;z-index:2}.cide-lyt-stack.scrolled-down:before{opacity:1}.cide-lyt-stack.scrolled-up:after{opacity:1}.cide-lyt-stack{position:relative;z-index:1;-webkit-overflow-scrolling:touch;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:var(--cide-ele-scrollbar-thumb, #d1d5db) var(--cide-ele-scrollbar-track, transparent)}.cide-lyt-stack::-webkit-scrollbar{width:2px}.cide-lyt-stack::-webkit-scrollbar-track{background:transparent;margin:10px 0}.cide-lyt-stack::-webkit-scrollbar-thumb{background:var(--cide-ele-scrollbar-thumb, #d1d5db);border-radius:4px}.cide-lyt-stack:hover::-webkit-scrollbar-thumb{background:var(--cide-ele-scrollbar-thumb-hover, #9ca3af)}.cide-lyt-stack:hover::-webkit-scrollbar{width:3px}.cide-lyt-stack:before,.cide-lyt-stack:after,.sidebar-content:before,.sidebar-content:after,.notification-panel:before,.notification-panel:after,.user-menu:before,.user-menu:after,.options-menu:before,.options-menu:after{content:\"\";position:absolute;left:0;right:0;height:24px;z-index:5;pointer-events:none;opacity:0;transition:opacity .3s ease}.cide-lyt-stack:before,.sidebar-content:before,.notification-panel:before,.user-menu:before,.options-menu:before{top:0;background:linear-gradient(to bottom,color-mix(in srgb,var(--cide-theme-sidebar-color) 90%,transparent),rgb(var(--tw-white-rgb) / 0))}.cide-lyt-stack:after,.sidebar-content:after,.notification-panel:after,.user-menu:after,.options-menu:after{bottom:0;background:linear-gradient(to top,color-mix(in srgb,var(--cide-theme-sidebar-color) 90%,transparent),rgb(var(--tw-white-rgb) / 0))}.cide-lyt-stack.is-scrollable-top:before,.sidebar-content.is-scrollable-top:before,.notification-panel.is-scrollable-top:before,.user-menu.is-scrollable-top:before,.options-menu.is-scrollable-top:before{opacity:1}.cide-lyt-stack.is-scrollable-bottom:after,.sidebar-content.is-scrollable-bottom:after,.notification-panel.is-scrollable-bottom:after,.user-menu.is-scrollable-bottom:after,.options-menu.is-scrollable-bottom:after{opacity:1}.collapse-toggle{margin-bottom:.5rem;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:5;border-radius:50%;overflow:hidden}.collapse-toggle:before{content:\"\";position:absolute;inset:0;background:var(--cide-theme-label-color);opacity:0;transition:opacity .2s ease;z-index:-1}.collapse-toggle:hover{transform:scale(1.1)}.collapse-toggle:hover:before{opacity:1}.collapse-toggle:active{transform:scale(.95);transition:transform .1s ease}.collapse-toggle:focus-visible{outline:2px solid var(--cide-theme-color-brand-primary);outline-offset:2px}.sidebar-scroll-content{width:100%;position:relative;z-index:1;overflow-y:auto;overflow-x:hidden;flex-grow:1;display:flex;flex-direction:column;align-items:center;padding:1rem 0;gap:.5rem;max-height:calc(100% - 8rem)}.nav-item{position:relative;width:30px;height:30px;display:flex;align-items:center;justify-content:center;transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;margin:4px 0;border-radius:10px;box-shadow:0 0 #3b82f600;transform-origin:center;overflow:hidden;color:var(--cide-theme-text-color)}.nav-item:before{content:\"\";position:absolute;inset:0;background:radial-gradient(circle at center,rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.08),rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.01));opacity:0;transition:opacity .3s ease;z-index:-1}.nav-item:hover{background-color:color-mix(in srgb,var(--cide-theme-light-color) 90%,transparent);transform:translateY(-1px);box-shadow:0 2px 6px var(--cide-theme-shadow-color)}.nav-item:hover:before{opacity:1}.nav-item:active{transition:all .1s ease;transform:translateY(-1px);box-shadow:0 2px 6px var(--cide-theme-shadow-color)}.nav-item:active{transform:translateY(1px);transition:all .1s ease}.nav-item-active{background:linear-gradient(135deg,rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.08),rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.12));box-shadow:0 2px 8px rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.15);transform:translateZ(0);color:var(--cide-theme-color-brand-primary)}.nav-item-active:after{content:\"\";position:absolute;bottom:-2px;left:30%;right:30%;height:2px;background:linear-gradient(to right,rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),0),var(--cide-theme-color-brand-primary),rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),0));border-radius:1px;animation:pulseGlow 2s infinite}@keyframes pulseGlow{0%{opacity:.4}50%{opacity:1}to{opacity:.4}}.nav-item-active:hover{background:linear-gradient(135deg,#3b82f61a,#3b82f626)}.nav-badge{z-index:5;transition:all .3s ease}.nav-item:hover .nav-badge{transform:scale(1.1)}.nav-tooltip{position:fixed;left:64px;top:50%;transform:translateY(-50%) translate(-5px);background-color:var(--sidebar-tooltip-bg);color:var(--sidebar-tooltip-color);padding:.4rem .75rem;border-radius:.25rem;font-size:.75rem;white-space:nowrap;opacity:0;pointer-events:none;transition:all .2s cubic-bezier(.4,0,.2,1);z-index:1000;box-shadow:0 2px 8px var(--cide-theme-shadow-color);letter-spacing:.01em;will-change:transform,opacity;max-width:220px;text-overflow:ellipsis;overflow:hidden;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.nav-tooltip:before{content:\"\";position:absolute;top:50%;right:100%;transform:translateY(-50%);border-width:6px;border-style:solid;border-color:transparent var(--sidebar-tooltip-bg) transparent transparent;filter:drop-shadow(-2px 0px 1px rgba(0,0,0,.1))}.nav-item:hover .nav-tooltip{opacity:1;transform:translateY(-50%) translate(0);box-shadow:0 3px 12px var(--cide-theme-shadow-color)}.nav-item-active{background-color:color-mix(in srgb,var(--cide-theme-color-brand-primary) 10%,var(--cide-theme-light-color));border-radius:.5rem}.nav-item-active:before{opacity:0}.active-nav-icon{color:var(--cide-lyt-sidebar-nav-item-color-active)!important;filter:drop-shadow(0 0 3px rgba(59,130,246,.3))}.nav-indicator{position:absolute;left:-8px;top:50%;transform:translateY(-50%);width:3px;height:60%;background:var(--cide-theme-color-brand-primary);border-radius:0 4px 4px 0;opacity:0;transition:all .3s ease;box-shadow:0 0 6px rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.5)}.nav-item-active .nav-indicator{opacity:1;left:0}@keyframes fadeSlideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.sidebar-scroll-content .nav-item{opacity:0;animation:fadeSlideIn .5s forwards}.sidebar-scroll-content .nav-item:nth-child(1){animation-delay:.05s}.sidebar-scroll-content .nav-item:nth-child(2){animation-delay:.1s}.sidebar-scroll-content .nav-item:nth-child(3){animation-delay:.15s}.sidebar-scroll-content .nav-item:nth-child(4){animation-delay:.2s}.sidebar-scroll-content .nav-item:nth-child(5){animation-delay:.25s}.sidebar-scroll-content .nav-item:nth-child(6){animation-delay:.3s}.sidebar-scroll-content .nav-item:nth-child(7){animation-delay:.35s}.sidebar-scroll-content .nav-item:nth-child(8){animation-delay:.4s}.sidebar-scroll-content .nav-item:nth-child(9){animation-delay:.45s}.sidebar-scroll-content .nav-item:nth-child(10){animation-delay:.5s}.sidebar-scroll-content .nav-item:nth-child(11){animation-delay:.55s}.sidebar-scroll-content .nav-item:nth-child(12){animation-delay:.6s}.sidebar-scroll-content .nav-item:nth-child(13){animation-delay:.65s}.sidebar-scroll-content .nav-item:nth-child(14){animation-delay:.7s}.sidebar-scroll-content .nav-item:nth-child(15){animation-delay:.75s}cide-ele-icon[type=box]{cursor:pointer;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:.5rem;transition:all .2s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}cide-ele-icon[type=box]:hover{background-color:rgb(var(--tw-gray-100-rgb) / 1);transform:translateY(-1px)}cide-ele-icon[type=box]:active{transform:translateY(0)}.theme-toggle{position:relative;overflow:hidden;padding:.5rem;border-radius:12px;background-color:transparent;border:2px solid transparent;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem}.theme-toggle:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at center,rgba(59,130,246,.2) 0%,transparent 70%);opacity:0;transition:opacity .3s ease;border-radius:.5rem}.theme-toggle:hover{background-color:var(--cide-theme-hover-bg-color, rgb(var(--tw-gray-100-rgb) / 1));border-color:var(--cide-theme-color-brand-primary, rgba(59, 130, 246, .3));transform:translateY(-1px);box-shadow:0 4px 12px #0000001a}.theme-toggle:hover:after{opacity:1}.theme-toggle:focus{outline:none;box-shadow:0 0 0 3px #3b82f64d}.theme-toggle cide-ele-icon{color:var(--cide-theme-icon-color, #6b7280);transition:all .2s ease;width:1.25rem;height:1.25rem;display:flex;align-items:center;justify-content:center}.theme-toggle:hover cide-ele-icon{color:var(--cide-theme-color-brand-primary, #3b82f6);transform:scale(1.1) rotate(10deg)}.dark-mode .theme-toggle:after{background:radial-gradient(circle at center,rgba(96,165,250,.2) 0%,transparent 70%)}.dark-mode .theme-toggle:hover{background-color:var(--cide-theme-dark-hover-bg-color, rgba(55, 65, 81, 1));border-color:var(--cide-theme-color-brand-primary, rgba(96, 165, 250, .3))}.notification-badge{font-size:.65rem;min-width:20px;height:20px;box-shadow:0 2px 4px rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.25);transform-origin:center;position:relative;animation:pulseNotification 2s infinite;overflow:hidden;background-color:var(--cide-theme-color-brand-primary);color:var(--cide-theme-light-color)}.notification-badge:before{content:\"\";position:absolute;inset:0;background:linear-gradient(135deg,rgb(var(--tw-white-rgb) / .3),rgb(var(--tw-white-rgb) / 0));opacity:0;transition:opacity .3s ease}.notification-badge:hover:before{opacity:1}@keyframes pulseNotification{0%{box-shadow:0 0 rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.4);transform:scale(1)}40%{transform:translateY(-5px)}50%{box-shadow:0 0 0 4px rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),0);transform:scale(1.05)}60%{transform:translateY(-2px)}to{box-shadow:0 0 rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),0);transform:scale(1)}}.user-avatar{transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;box-shadow:0 2px 5px #00000014;z-index:2}.user-avatar:hover{transform:scale(1.08);box-shadow:0 4px 12px #00000026}.user-avatar:before{content:\"\";position:absolute;inset:-3px;background:radial-gradient(circle,rgba(59,130,246,.3),transparent 70%);opacity:0;transition:opacity .3s ease;z-index:-1;border-radius:50%}.user-avatar:hover:before{opacity:1}.user-status{position:absolute;bottom:0;right:0;width:10px;height:10px;border-radius:50%;border:2px solid white;transition:all .3s ease}.user-status.online{background-color:#10b981;animation:statusPulse 2s infinite}.user-status.busy{background-color:#f59e0b}.user-status.offline{background-color:#6b7280}.user-status.dnd{background-color:#ef4444}@keyframes statusPulse{0%{box-shadow:0 0 #10b98166}70%{box-shadow:0 0 0 6px #10b98100}to{box-shadow:0 0 #10b98100}}.dark-mode .user-avatar{box-shadow:0 2px 5px #0003}.dark-mode .user-avatar:before{background:radial-gradient(circle,rgba(96,165,250,.4),transparent 70%)}.dark-mode .user-status{border-color:#0f172a}.user-dropdown{position:relative}.user-menu{animation:fadeInUp .2s cubic-bezier(.4,0,.2,1);z-index:30;margin-left:10px;margin-bottom:5px;max-height:80vh;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--cide-ele-scrollbar-thumb, #d1d5db) var(--cide-ele-scrollbar-track, transparent);box-shadow:0 10px 25px #0000001a;border-radius:.75rem;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);position:absolute;left:100%;bottom:0;margin-top:.5rem;margin-left:.5rem;width:14rem;border-radius:.375rem;box-shadow:0 10px 15px -3px var(--cide-theme-shadow-color),0 4px 6px -2px var(--cide-theme-shadow-color);background-color:var(--cide-theme-sidebar-color);border:1px solid var(--cide-theme-border-color);z-index:50;overflow:hidden}.user-menu a{color:var(--cide-theme-text-color);transition:background-color .2s ease}.user-menu a:hover{background-color:var(--cide-theme-hover-bg-color)}.user-menu .tw-text-red-700{color:var(--cide-theme-error-color)}.user-menu::-webkit-scrollbar{width:3px}.user-menu::-webkit-scrollbar-track{background:transparent}.user-menu::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb, #d1d5db);border-radius:20px;opacity:.7}.user-menu:hover::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb-hover, #9ca3af);opacity:1}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.user-status{transition:all .3s ease;box-shadow:0 0 0 2px var(--cide-theme-sidebar-color)}.user-status.online{animation:pulseOnline 2s infinite}@keyframes pulseOnline{0%{box-shadow:0 0 #22c55e66,0 0 0 2px var(--cide-theme-sidebar-color)}70%{box-shadow:0 0 0 4px #22c55e00,0 0 0 2px var(--cide-theme-sidebar-color)}to{box-shadow:0 0 #22c55e00,0 0 0 2px var(--cide-theme-sidebar-color)}}.cide-lyt-sidebar-menu{width:var(--cide-lyt-sidebar-menu-width);background-color:var(--cide-theme-sidebar-color);border-left:1px solid rgb(var(--tw-gray-100-rgb) / 1);transition:width .3s cubic-bezier(.4,0,.2,1),opacity .3s cubic-bezier(.4,0,.2,1) .1s,visibility .3s cubic-bezier(.4,0,.2,1) .1s,transform .3s cubic-bezier(.4,0,.2,1) .1s;display:flex;flex-direction:column;overflow:hidden;max-height:100%;position:relative;will-change:width,opacity,transform;opacity:1;visibility:visible;transform:translate(0)}.sidebar-header{background-color:var(--cide-theme-sidebar-color);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);position:sticky;top:0;z-index:10;border-bottom:1px solid var(--cide-theme-border-color);padding:1rem .75rem;transition:all .3s ease;color:var(--cide-theme-text-color)}.sidebar-header.scrolled{box-shadow:0 4px 10px -8px var(--cide-theme-shadow-color)}.back-button{transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%}.back-button:hover{transform:translate(-2px);background-color:rgb(var(--tw-gray-100-rgb) / 1)}.back-button:active{transform:translate(-1px) scale(.95)}.search-wrapper{position:relative;transition:all .3s ease}.search-wrapper:focus-within{transform:translateY(-1px)}.search-shortcut{font-size:.65rem;opacity:.7;letter-spacing:.02em;pointer-events:none;padding:.1rem .3rem;background-color:rgb(var(--tw-gray-100-rgb) / .8);border-radius:.25rem;border:1px solid rgb(var(--tw-gray-200-rgb) / .8);transition:all .3s ease}.search-wrapper:focus-within .search-shortcut{opacity:.5}.options-menu{animation:fadeInUp .2s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 12px #0000001a;max-height:70vh;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--cide-ele-scrollbar-thumb, #d1d5db) var(--cide-ele-scrollbar-track, transparent);border-radius:.75rem;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.options-menu::-webkit-scrollbar{width:3px}.options-menu::-webkit-scrollbar-track{background:transparent}.options-menu::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb, #d1d5db);border-radius:20px;opacity:.7}.options-menu:hover::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb-hover, #9ca3af);opacity:1}.sidebar-section{position:relative;padding:.25rem 0}.sidebar-section:not(:first-child):before{content:\"\";height:1px;background:linear-gradient(to right,#e5e7eb00,#e5e7eb80,#e5e7eb00);position:absolute;top:0;left:10%;right:10%}.tw-text-xs.tw-font-semibold.tw-text-gray-500{font-size:.7rem;letter-spacing:.05em;text-transform:uppercase;position:relative;display:inline-block;padding:0 .5rem;color:var(--cide-theme-label-color)}.tw-text-xs.tw-font-semibold.tw-text-gray-500:after{content:\"\";position:absolute;height:3px;width:2rem;background:linear-gradient(to right,rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.5),rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),0));bottom:-4px;left:.5rem;border-radius:3px;transition:width .3s ease}.sidebar-section:hover .tw-text-xs.tw-font-semibold.tw-text-gray-500:after{width:3rem}.menu-item{text-decoration:none;transition:all .25s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;margin:2px 0;border-radius:.5rem;transform:translateZ(0);color:var(--cide-theme-text-color)}.menu-item:hover{transform:translate(3px);background-color:var(--cide-theme-light-color);box-shadow:0 1px 3px var(--sidebar-shadow-color)}.active-menu-item{background-color:rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.08);position:relative;box-shadow:0 2px 5px rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.1)}.active-menu-item:after{content:\"\";position:absolute;left:0;top:0;height:100%;width:3px;background:linear-gradient(to bottom,var(--cide-theme-color-brand-primary),var(--cide-theme-secondary-color));border-radius:0 2px 2px 0;box-shadow:0 0 6px rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.3);animation:pulseLeftBorder 2s infinite}@keyframes pulseLeftBorder{0%{opacity:.7}50%{opacity:1}to{opacity:.7}}:root[data-theme=dark] .active-menu-item,:root.dark-mode .active-menu-item{background-color:var(--cide-theme-hover-bg-color);box-shadow:0 2px 5px var(--cide-theme-shadow-color)}:root[data-theme=dark] .active-menu-item:after,:root.dark-mode .active-menu-item:after{background:linear-gradient(to bottom,var(--cide-theme-primary-color),var(--cide-theme-info-color));box-shadow:0 0 8px #60a5fa66}.quick-actions{transition:all .3s ease;opacity:0;transform:translate(5px);z-index:2}.menu-item:hover .quick-actions{opacity:1;transform:translate(0)}.badge{font-size:.7rem;padding:1px 5px;transition:all .2s cubic-bezier(.4,0,.2,1);position:relative;z-index:1}.menu-item:hover .badge{background-color:#d1d5db}.new-badge{animation:pulse 2s infinite;z-index:1}@keyframes pulse{0%{box-shadow:0 0 #3b82f666}70%{box-shadow:0 0 0 4px #3b82f600}to{box-shadow:0 0 #3b82f600}}.toggle-switch{display:inline-flex;align-items:center;transition:all .2s ease}.toggle-switch:hover{transform:scale(1.05)}.toggle-track{position:relative;cursor:pointer;transition:background-color .3s ease;overflow:hidden}.toggle-track:after{content:\"\";position:absolute;top:50%;left:50%;width:5px;height:5px;background:rgb(var(--tw-white-rgb) / .7);opacity:0;border-radius:100%;transform:scale(1) translate(-50%,-50%);transform-origin:50% 50%}.toggle-track.clicked:after{animation:ripple .6s ease-out}@keyframes ripple{0%{opacity:1;transform:scale(0) translate(-50%,-50%)}to{opacity:0;transform:scale(20) translate(-50%,-50%)}}.alert-box{animation:fadeIn .5s cubic-bezier(.4,0,.2,1);box-shadow:0 2px 8px #fde04726;border-radius:.5rem;position:relative;overflow:hidden}.alert-box:before{content:\"\";position:absolute;inset:0;background-image:url(\"data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23fef3c7' fill-opacity='0.4' fill-rule='evenodd'%3E%3Ccircle cx='3' cy='3' r='3'/%3E%3Ccircle cx='13' cy='13' r='3'/%3E%3C/g%3E%3C/svg%3E\");opacity:.3;pointer-events:none}@keyframes fadeIn{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.notification-panel{animation:fadeIn .3s cubic-bezier(.4,0,.2,1);overflow-y:auto;overflow-x:hidden;max-height:100vh;scrollbar-width:thin;scrollbar-color:var(--cide-ele-scrollbar-thumb, #d1d5db) var(--cide-ele-scrollbar-track, transparent);padding:.75rem;border-radius:.75rem}.notification-panel::-webkit-scrollbar{width:3px}.notification-panel::-webkit-scrollbar-track{background:transparent}.notification-panel::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb, #d1d5db);border-radius:20px;opacity:.7}.notification-panel:hover::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb-hover, #9ca3af);opacity:1}.notification-item{transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;border-radius:.5rem;margin-bottom:.5rem;position:relative;overflow:hidden;word-wrap:break-word;overflow-wrap:break-word}.notification-item:hover{background-color:rgb(var(--tw-gray-100-rgb) / 1);transform:translate(1px)}.notification-item:active{transform:scale(.99)}.notification-item.unread:before{content:\"\";position:absolute;left:0;top:0;height:100%;width:3px;background-color:var(--cide-theme-color-brand-primary);border-radius:0 2px 2px 0}.sidebar-footer{background-color:var(--cide-theme-light-color);position:sticky;bottom:0;z-index:10;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:1px solid var(--cide-theme-border-color);padding:.75rem;transition:all .3s ease;color:var(--cide-theme-text-color)}.upgrade-button{transition:all .2s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;border-radius:.5rem;color:var(--cide-theme-text-color)}.upgrade-button:hover{background-color:rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.1);transform:translateY(-1px)}.upgrade-button:active{transform:translateY(0) scale(.98)}.upgrade-button:after{content:\"\";position:absolute;width:12px;height:12px;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%233b82f6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2'%3E%3C/polygon%3E%3C/svg%3E\");top:5px;right:10px;opacity:.5;transform:scale(0);transition:all .3s ease}.upgrade-button:hover:after{transform:scale(1) rotate(20deg);animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:scale(1) rotate(5deg) translate(0)}50%{transform:scale(1.1) rotate(-5deg) translate(-2px,-2px)}}.storage-bar{background-color:#e5e7eb80;overflow:hidden;border-radius:4px;height:6px;position:relative}.storage-fill{background:linear-gradient(to right,var(--cide-theme-color-brand-primary),var(--cide-theme-secondary-color));transition:width 1s cubic-bezier(.4,0,.2,1);position:relative;height:100%;border-radius:4px}.storage-fill:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,rgb(var(--tw-white-rgb) / 0),rgb(var(--tw-white-rgb) / .2),rgb(var(--tw-white-rgb) / 0));animation:shimmer 2s infinite}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.plan-features{transition:all .3s ease;padding:.5rem;border-radius:.5rem}.plan-features:hover{background-color:rgb(var(--tw-gray-100-rgb) / .5)}.feature-item{display:flex;align-items:center;margin:.25rem 0;position:relative;padding-left:1.25rem;color:var(--cide-theme-text-color)}.feature-item:before{content:\"\\2713\";position:absolute;left:0;color:var(--cide-theme-color-brand-primary);font-size:.7rem;top:50%;transform:translateY(-50%)}.sidebar-content{scrollbar-width:thin;scrollbar-color:var(--cide-ele-scrollbar-thumb, #d1d5db) var(--cide-ele-scrollbar-track, transparent);flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding:0 .75rem;transition:all .3s ease;position:relative;scroll-behavior:smooth;scroll-padding:1rem;overscroll-behavior:contain;color:var(--cide-theme-text-color)}.sidebar-content:after{content:\"\";position:absolute;bottom:0;left:0;right:0;height:30px;background:linear-gradient(to top,color-mix(in srgb,var(--cide-theme-sidebar-color) 90%,transparent),transparent);pointer-events:none;opacity:0;transition:opacity .3s ease;z-index:2}.sidebar-content:before{content:\"\";position:absolute;top:0;left:0;right:0;height:30px;background:linear-gradient(to bottom,color-mix(in srgb,var(--cide-theme-sidebar-color) 90%,transparent),transparent);pointer-events:none;opacity:0;transition:opacity .3s ease;z-index:2}.sidebar-content.scrolled-down:before{opacity:1}.sidebar-content.scrolled-up:after{opacity:1}.sidebar-content::-webkit-scrollbar{width:3px}.sidebar-content::-webkit-scrollbar-track{background:transparent}.sidebar-content::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb, #d1d5db);border-radius:20px;opacity:.7}.sidebar-content:hover::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb-hover, #9ca3af);opacity:1}.cide-lyt-sidebar *::-webkit-scrollbar{width:3px}.cide-lyt-sidebar *::-webkit-scrollbar-track{background:var(--cide-ele-scrollbar-track, transparent)}.cide-lyt-sidebar *::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb, #d1d5db);border-radius:20px;opacity:.7}.cide-lyt-sidebar *:hover::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb-hover, #9ca3af);opacity:1}.sidebar-section{transition:all .3s ease-out;transform:translateY(0);opacity:1}.sidebar-section.animate-in{animation:slideInUp .4s cubic-bezier(.4,0,.2,1) forwards}@keyframes slideInUp{0%{opacity:.5;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.sidebar-section:nth-child(1).animate-in{animation-delay:.1s}.sidebar-section:nth-child(2).animate-in{animation-delay:.2s}.sidebar-section:nth-child(3).animate-in{animation-delay:.3s}.sidebar-section:nth-child(4).animate-in{animation-delay:.4s}.sidebar-section:nth-child(5).animate-in{animation-delay:.5s}:host ::ng-deep cide-ele-input{width:100%}:host ::ng-deep .cide-input-field{border-radius:8px;background-color:#f9fafb;border:1px solid transparent;transition:all .2s cubic-bezier(.4,0,.2,1)}:host ::ng-deep .cide-input-field:focus-within{border-color:#d1d5db;background-color:#fff;box-shadow:0 2px 8px #0000000d;transform:translateY(-1px)}.cide-lyt-sidebar *:focus{outline:none;box-shadow:0 0 0 2px #3b82f64d}:root[data-theme=dark] .cide-lyt-sidebar,:root.dark-mode .cide-lyt-sidebar,html[data-theme=dark] .cide-lyt-sidebar,html.dark-mode .cide-lyt-sidebar{--sidebar-tooltip-bg: var(--cide-theme-dark-color);--sidebar-tooltip-color: var(--cide-theme-light-color);background-color:var(--cide-theme-sidebar-color);color:var(--cide-theme-text-color)}:root[data-theme=dark] .cide-lyt-stack,:root.dark-mode .cide-lyt-stack,html[data-theme=dark] .cide-lyt-stack,html.dark-mode .cide-lyt-stack{background-color:var(--cide-theme-dark-color);border-right-color:var(--cide-theme-border-color)}:root[data-theme=dark] .cide-lyt-stack:before,:root[data-theme=dark] .cide-lyt-stack:after,:root[data-theme=dark] .sidebar-content:before,:root[data-theme=dark] .sidebar-content:after,:root.dark-mode .cide-lyt-stack:before,:root.dark-mode .cide-lyt-stack:after,:root.dark-mode .sidebar-content:before,:root.dark-mode .sidebar-content:after{background:linear-gradient(to bottom,var(--cide-theme-dark-color),transparent)}:root[data-theme=dark] .sidebar-content:after,:root[data-theme=dark] .cide-lyt-stack:after,:root.dark-mode .sidebar-content:after,:root.dark-mode .cide-lyt-stack:after{background:linear-gradient(to top,var(--cide-theme-dark-color),transparent)}:root[data-theme=dark] .cide-lyt-sidebar-menu,:root.dark-mode .cide-lyt-sidebar-menu{background-color:var(--cide-theme-dark-color);border-left-color:var(--cide-theme-border-color)}:root[data-theme=dark] .sidebar-header,:root[data-theme=dark] .sidebar-footer,:root.dark-mode .sidebar-header,:root.dark-mode .sidebar-footer{background-color:var(--cide-theme-light-color);border-color:var(--cide-theme-border-color)}:root[data-theme=dark] .tw-text-gray-700,:root.dark-mode .tw-text-gray-700{color:var(--cide-theme-text-color)}:root[data-theme=dark] .tw-text-gray-500,:root.dark-mode .tw-text-gray-500{color:var(--cide-theme-label-color)}:root[data-theme=dark] .tw-bg-gray-50,:root[data-theme=dark] .menu-item:hover,:root.dark-mode .tw-bg-gray-50,:root.dark-mode .menu-item:hover{background-color:var(--cide-theme-hover-bg-color)}:root[data-theme=dark] .tw-bg-gray-100,:root.dark-mode .tw-bg-gray-100{background-color:var(--cide-theme-light-color)}:root[data-theme=dark] .tw-bg-gray-200,:root.dark-mode .tw-bg-gray-200{background-color:var(--cide-theme-border-color)}:root[data-theme=dark] .nav-item:hover:before,:root.dark-mode .nav-item:hover:before{background-color:var(--cide-theme-hover-bg-color)}:root[data-theme=dark] .back-button:hover,:root.dark-mode .back-button:hover{background-color:var(--cide-theme-hover-bg-color)}:root[data-theme=dark] .sidebar-section:not(:first-child):before,:root.dark-mode .sidebar-section:not(:first-child):before{background:linear-gradient(to right,transparent 0%,var(--cide-theme-border-color) 50%,transparent 100%)}:root[data-theme=dark] .toggle-track:after,:root.dark-mode .toggle-track:after{background:#00000080}:root[data-theme=dark] .alert-box:before,:root.dark-mode .alert-box:before{opacity:.2}:root[data-theme=dark] :host ::ng-deep .cide-input-field,:root.dark-mode :host ::ng-deep .cide-input-field{background-color:var(--cide-theme-light-color);color:var(--cide-theme-text-color)}:root[data-theme=dark] :host ::ng-deep .cide-input-field:focus-within,:root.dark-mode :host ::ng-deep .cide-input-field:focus-within{border-color:var(--cide-theme-border-color);background-color:var(--cide-theme-dark-color)}.nav-item-active .nav-indicator{animation:pulseIndicator 2s infinite}@keyframes pulseIndicator{0%{box-shadow:0 0 #3b82f666}70%{box-shadow:0 0 0 3px #3b82f600}to{box-shadow:0 0 #3b82f600}}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media screen and (max-width: 1024px){.cide-lyt-sidebar-menu{width:220px}.sidebar-content{padding:0 .25rem}.tw-text-xs.tw-font-semibold.tw-text-gray-500{font-size:.65rem}}@media screen and (max-width: 768px){.cide-lyt-sidebar{position:fixed;top:0;left:0;bottom:0;height:100vh;height:100dvh;z-index:40;transform:translate(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1);width:auto;min-width:auto}.cide-lyt-sidebar.mobile-open{transform:translate(0)}.cide-lyt-sidebar.collapsed{transform:translate(-100%)}.cide-lyt-stack{width:64px;min-width:64px;flex-shrink:0}.cide-lyt-sidebar-menu{position:relative;width:100%;max-width:280px;min-width:240px;left:0;top:0;height:100%;z-index:1;box-shadow:2px 0 10px #0000001a;border-radius:0;transform:none;opacity:1;visibility:visible}.cide-lyt-sidebar.collapsed .cide-lyt-sidebar-menu{display:none}.sidebar-content{padding:.5rem}.nav-item{width:40px;height:40px;margin:6px 0}.menu-item{padding:.75rem .5rem;margin:3px 0;min-height:44px}.sidebar-overlay{position:fixed;inset:0;background-color:#00000080;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);opacity:0;pointer-events:none;transition:opacity .3s cubic-bezier(.4,0,.2,1);z-index:35}.sidebar-overlay.active{opacity:1;pointer-events:auto}.user-menu,.options-menu{width:12rem;max-width:calc(100vw - 2rem)}.tw-text-xs.tw-font-semibold.tw-text-gray-500{font-size:.7rem;padding:.5rem .75rem}.notification-panel{width:100%;max-width:100%;padding:.5rem}}@media screen and (max-width: 480px){.cide-lyt-sidebar-menu{max-width:260px;min-width:220px}.cide-lyt-stack{width:56px;min-width:56px}.sidebar-content{padding:.375rem}.menu-item{padding:.625rem .375rem;font-size:.875rem}.user-avatar{width:2rem;height:2rem}.notification-panel{padding:.375rem}}@media screen and (max-width: 768px) and (orientation: landscape){.cide-lyt-sidebar-menu{max-width:300px}.sidebar-content{padding:.5rem}.nav-item{margin:4px 0}.menu-item{padding:.625rem .5rem}}.cide-lyt-sidebar,.cide-lyt-stack,.cide-lyt-sidebar-menu,.sidebar-logo,.nav-item,.menu-item,.user-avatar,.upgrade-button,.storage-fill,.notification-item,.sidebar-section.animate-in{transform:translateZ(0);backface-visibility:hidden;perspective:1000px;will-change:transform,opacity}:root[data-theme=dark] .nav-item-active,:root.dark-mode .nav-item-active{background:linear-gradient(135deg,rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.15),rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.1));box-shadow:0 2px 8px #1e40af40}:root[data-theme=dark] .nav-item-active:after,:root.dark-mode .nav-item-active:after{background:linear-gradient(to right,rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),0),rgba(var(--cide-theme-secondary-color-rgb, 74, 222, 128),.6),rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),0));box-shadow:0 0 5px rgba(var(--cide-theme-secondary-color-rgb, 74, 222, 128),.5)}:root[data-theme=dark] .nav-item:hover,:root.dark-mode .nav-item:hover{background-color:var(--cide-theme-hover-bg-color);box-shadow:0 2px 8px var(--cide-theme-shadow-color)}:root[data-theme=dark] .nav-tooltip,:root.dark-mode .nav-tooltip{background-color:var(--cide-theme-tooltip-dark-bg);box-shadow:0 3px 10px var(--cide-theme-shadow-color);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}:root[data-theme=dark] .nav-tooltip:before,:root.dark-mode .nav-tooltip:before{border-color:transparent var(--cide-theme-tooltip-dark-bg) transparent transparent}.text-theme-primary{color:var(--cide-theme-color-brand-primary)}.text-theme-secondary{color:var(--cide-theme-secondary-color)}.text-theme-text{color:var(--cide-theme-text-color)}.text-theme-label{color:var(--cide-theme-label-color)}.bg-theme-primary{background-color:var(--cide-theme-color-brand-primary)}.bg-theme-secondary{background-color:var(--cide-theme-secondary-color)}.bg-theme-light{background-color:var(--cide-theme-light-color)}.bg-theme-dark{background-color:var(--cide-theme-dark-color)}.bg-theme-sidebar{background-color:var(--cide-theme-sidebar-color)}.border-theme-light{border-color:var(--cide-theme-light-color)}.border-theme-primary{border-color:var(--cide-theme-color-brand-primary)}.hover-bg-theme-light:hover{background-color:var(--cide-theme-light-color)}.hover-text-theme-primary:hover{color:var(--cide-theme-color-brand-primary)}.tw-text-gray-500{color:var(--cide-theme-icon-color)}.hover\\:tw-text-gray-700:hover{color:var(--cide-theme-icon-hover-color)}.tw-text-gray-700{color:var(--cide-theme-text-color)}.tw-text-red-500,.tw-text-red-600,.tw-text-red-700{color:var(--cide-theme-error-color)}.tw-bg-gray-200{background-color:var(--cide-theme-border-color)}.hover\\:tw-bg-gray-100:hover{background-color:var(--cide-theme-hover-bg-color)}.tw-bg-white{background-color:var(--cide-theme-sidebar-color)}.tw-bg-green-500{background-color:var(--cide-theme-success-color)}.tw-border-gray-100,.tw-divide-gray-100{border-color:var(--cide-theme-border-color)}.tw-shadow-lg{box-shadow:0 10px 15px -3px var(--cide-theme-shadow-color),0 4px 6px -2px var(--cide-theme-shadow-color)}.tw-shadow-sm,.hover\\:tw-shadow:hover{box-shadow:0 1px 2px 0 var(--cide-theme-shadow-color)}.active-nav-icon{color:var(--cide-theme-color-brand-primary)!important}.nav-item{display:flex;align-items:center;justify-content:center;position:relative;border-radius:.375rem}.nav-item:hover{background-color:var(--cide-theme-hover-bg-color)}.nav-item:hover cide-ele-icon{color:var(--cide-theme-icon-hover-color)}.nav-item-active{background-color:color-mix(in srgb,var(--cide-theme-color-brand-primary) 10%,var(--cide-theme-light-color))}.nav-item-active cide-ele-icon{color:var(--cide-theme-color-brand-primary)}.nav-indicator{opacity:0;transition:opacity .2s ease}.nav-item-active .nav-indicator{opacity:1}.nav-tooltip{position:absolute;left:100%;top:50%;transform:translateY(-50%);background-color:var(--sidebar-tooltip-bg);color:var(--sidebar-tooltip-color);padding:.25rem .5rem;border-radius:.25rem;font-size:.75rem;white-space:nowrap;opacity:0;pointer-events:none;transition:all .2s ease;margin-left:.5rem;z-index:30;box-shadow:0 2px 8px var(--cide-theme-shadow-color)}.nav-item:hover .nav-tooltip{opacity:1}.nav-badge{position:absolute;top:-.25rem;right:-.25rem;width:.375rem;height:.375rem;border-radius:9999px;background-color:var(--cide-theme-error-color);animation:ping 1s cubic-bezier(0,0,.2,1) infinite}@keyframes ping{75%,to{transform:scale(2);opacity:0}}.user-avatar{width:2.5rem;height:2.5rem;border-radius:9999px;overflow:hidden;background-color:var(--cide-theme-border-color);border:2px solid var(--cide-theme-sidebar-color);box-shadow:0 1px 2px var(--cide-theme-shadow-color);cursor:pointer;transition:box-shadow .2s ease}.user-avatar:hover{box-shadow:0 2px 4px var(--cide-theme-shadow-color)}.user-status{position:absolute;bottom:0;right:0;width:.75rem;height:.75rem;border-radius:9999px;background-color:var(--cide-theme-success-color);border:2px solid var(--cide-theme-sidebar-color)}:root[data-theme=dark] .nav-item:hover,:root.dark-mode .nav-item:hover{background-color:var(--cide-theme-hover-bg-color)}:root[data-theme=dark] .nav-item-active,:root.dark-mode .nav-item-active{background-color:color-mix(in srgb,var(--cide-theme-primary-color) 30%,var(--cide-theme-dark-color))}:root[data-theme=dark] .user-avatar,:root.dark-mode .user-avatar{border-color:var(--cide-theme-border-color);background-color:var(--cide-theme-hover-bg-color)}:root[data-theme=dark] .user-status,:root.dark-mode .user-status{border-color:var(--cide-theme-border-color)}:root[data-theme=dark] .user-menu,:root.dark-mode .user-menu{background-color:var(--cide-theme-sidebar-color);border-color:var(--cide-theme-border-color)}:root[data-theme=dark] .user-menu a,:root.dark-mode .user-menu a{color:var(--cide-theme-text-color)}:root[data-theme=dark] .user-menu a:hover,:root.dark-mode .user-menu a:hover{background-color:var(--cide-theme-hover-bg-color)}.section-header{transition:all .2s ease;border:1px solid transparent}.section-header:hover{background-color:#f8fafc!important;border-color:#e2e8f0}.section-header:focus{outline:none;box-shadow:0 0 0 2px #3b82f6;border-color:#3b82f6}.section-content{overflow:hidden;transition:all .3s ease}.section-header .tw-rotate-90{transform:rotate(90deg)}.section-content .tw-border-l{border-left-color:#d1d5db}.section-header:hover .tw-text-gray-500{color:#6b7280}.section-header:hover .tw-text-gray-800{color:#374151}\n"], dependencies: [{ kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { 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", "step", "size"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: CideEleResizerDirective, selector: "[cideEleResizer]", inputs: ["direction", "to", "prevElementSelector", "nextElementSelector", "parentElementSelector", "minPrevSize", "minNextSize", "usePercentage"], outputs: ["resizeStart", "resizing", "resizeEnd"] }, { kind: "directive", type: TooltipDirective, selector: "[cideEleTooltip]", inputs: ["cideEleTooltip", "tooltipColor", "tooltipBg", "tooltipPlacement", "tooltipType", "tooltipDelay", "tooltipDir", "tooltipShowArrow", "tooltipMultiline", "tooltipMaxWidth", "tooltipInteractive", "tooltipClass"] }, { kind: "component", type: CideSpinnerComponent, selector: "cide-ele-spinner", inputs: ["size", "type"] }], animations: [
|
|
4233
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytSidebarWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4234
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideLytSidebarWrapperComponent, isStandalone: true, selector: "cide-lyt-sidebar-wrapper", host: { listeners: { "document:click": "onDocumentClick($event)" } }, ngImport: i0, template: "<nav class=\"cide-lyt-sidebar tw-flex tw-h-full tw-select-none\" [class.collapsed]=\"isCollapsed()\">\n <!-- First tier sidebar (Icon only) -->\n <div class=\"cide-lyt-stack tw-h-full tw-flex tw-flex-col tw-items-center tw-border-r tw-border-gray-100\">\n <!-- Scrollable content -->\n <div class=\"sidebar-scroll-content\">\n <!-- Collapse/Expand toggle -->\n <div class=\"nav-item collapse-toggle\" tabindex=\"0\" (click)=\"toggleSidebar()\"\n (keydown.enter)=\"toggleSidebar()\">\n <div class=\"nav-tooltip\">{{isCollapsed() ? 'Expand' : 'Collapse'}} Sidebar</div>\n <cide-ele-icon size=\"xs\" type=\"box\" class=\"tw-text-gray-500 hover:tw-text-gray-700\">\n {{isCollapsed() ? 'chevron_right' : 'chevron_left'}}\n </cide-ele-icon>\n </div> <!-- Main navigation icons - Enhanced Design -->\n <div class=\"tw-flex tw-flex-col tw-gap-4\">\n @for (core_system_module_item of core_system_module(); track $index) {\n <div class=\"nav-item tw-relative tw-group\" (click)=\"setActiveMenu(core_system_module_item._id, $event)\"\n [cideEleTooltip]=\"core_system_module_item.syme_title\" [tooltipShowArrow]=\"true\"\n tooltipPlacement=\"right\"\n [ngClass]=\"{'nav-item-active': activeModuleId === core_system_module_item._id}\"\n (mouseenter)=\"onItemHover(core_system_module_item._id)\" (mouseleave)=\"onItemHover('')\"\n [tabindex]=\"$index.toString()\" (keydown.enter)=\"setActiveMenu(core_system_module_item._id, $event)\">\n\n <!-- Notification Badge with enhanced design -->\n @if (core_system_module_item?.syme_ping) {\n <div class=\"nav-badge tw-absolute -tw-top-1 -tw-right-1 tw-w-1.5 tw-h-1.5 tw-rounded-full tw-animate-ping\"\n style=\"background-color: var(--cide-theme-error-color);\">\n </div>\n }\n\n <!-- Enhanced icon with better visual effects -->\n <div\n class=\"tw-p-2 tw-rounded-xl tw-transition-all tw-duration-200 tw-ease-in-out\n group-hover:tw-bg-blue-50 group-hover:tw-shadow-md group-hover:tw-scale-105\n tw-border-2 tw-border-transparent\n {{activeModuleId === core_system_module_item._id ? 'tw-bg-blue-100 tw-border-blue-200 tw-shadow-sm' : 'tw-bg-gray-50'}}\">\n <cide-ele-icon type=\"box\" size=\"xs\"\n class=\"tw-transition-all tw-duration-200 tw-ease-in-out\n {{activeModuleId === core_system_module_item._id ? 'tw-text-blue-600' : 'tw-text-gray-600 group-hover:tw-text-blue-500'}}\">\n {{core_system_module_item?.syme_icon || 'dashboard'}}\n </cide-ele-icon>\n </div>\n\n <!-- Modern active indicator -->\n @if (activeModuleId === core_system_module_item._id) {\n <div\n class=\"nav-indicator tw-absolute tw-left-0 tw-top-1/2 tw-transform -tw-translate-y-1/2 tw-w-1 tw-h-8 tw-bg-blue-500 tw-rounded-r-full tw-shadow-lg tw-transition-all tw-duration-300\">\n </div>\n }\n </div>\n }\n </div>\n </div>\n </div> <!-- Second tier sidebar (Expanded view) -->\n <div class=\"cide-lyt-sidebar-menu tw-h-full tw-overflow-hidden tw-shadow-sm\">\n <div class=\"tw-flex tw-flex-col tw-h-full\">\n <!-- Header section with search and options -->\n <div class=\"sidebar-header tw-p-2.5 tw-border-b tw-border-gray-100\">\n <!-- Title with back button - Clean layout without online indicator -->\n <div class=\"tw-flex tw-items-center tw-gap-2 tw-mb-2.5\">\n <button\n class=\"back-button tw-p-1.5 tw-rounded-lg tw-text-gray-500 hover:tw-bg-gray-100 hover:tw-text-gray-700 tw-transition-colors tw-flex-shrink-0\"\n [cideEleTooltip]=\"'Back to home'\" tooltipPlacement=\"bottom\">\n <cide-ele-icon type=\"none\" size=\"xs\" class=\"tw-transition-transform hover:tw-scale-110\">{{\n getActiveModuleIcon() }}</cide-ele-icon>\n </button>\n <div class=\"tw-flex-1 tw-min-w-0\">\n <h2 class=\"tw-text-sm tw-font-semibold tw-text-gray-900 tw-truncate tw-leading-5\">\n {{ appState.getActiveModuleTitle() || 'Menu' }}\n </h2>\n <p class=\"tw-text-xs tw-text-gray-500 tw-truncate tw-mt-0.5\">\n Module Dashboard\n </p>\n </div>\n </div>\n\n <!-- Search and options -->\n <div class=\"tw-flex tw-items-center tw-justify-between\">\n <div class=\"search-wrapper tw-relative tw-flex-1\">\n <cide-ele-input type=\"text\" leadingIcon=\"search\" size=\"xs\" placeholder=\"Search settings...\"\n [clearInput]=\"true\" [ngModel]=\"searchText()\" (ngModelChange)=\"onSearchTextChange($event)\" (input)=\"onSearch()\">\n </cide-ele-input>\n <div\n class=\"search-shortcut tw-absolute tw-right-3 tw-top-1/2 -tw-translate-y-1/2 tw-bg-gray-100 tw-text-gray-500 tw-rounded tw-px-1.5 tw-py-0.5 tw-text-xs\">\n \u2318K</div>\n </div>\n <button\n class=\"tw-ml-2 tw-p-1.5 tw-rounded-lg tw-text-gray-500 hover:tw-bg-gray-100 hover:tw-text-gray-700 tw-transition-colors\"\n (click)=\"toggleOptions()\">\n <cide-ele-icon type=\"none\" size=\"xs\">more_vert</cide-ele-icon>\n </button>\n\n <!-- Options dropdown menu -->\n <div *ngIf=\"showOptions()\"\n class=\"options-menu tw-absolute tw-right-4 tw-top-16 tw-mt-2 tw-w-48 tw-rounded-md tw-shadow-lg tw-bg-white tw-ring-1 tw-ring-black tw-ring-opacity-5 tw-divide-y tw-divide-gray-100 tw-z-10\">\n <div class=\"tw-py-1\">\n <a href=\"#\"\n class=\"tw-group tw-flex tw-items-center tw-px-4 tw-py-2 tw-text-sm tw-text-gray-700 hover:tw-bg-gray-100\">\n <cide-ele-icon class=\"tw-mr-3 tw-text-gray-500 tw-group-hover:tw-text-gray-600\"\n type=\"none\" size=\"xs\">refresh</cide-ele-icon>\n Refresh\n </a>\n <a href=\"#\"\n class=\"tw-group tw-flex tw-items-center tw-px-4 tw-py-2 tw-text-sm tw-text-gray-700 hover:tw-bg-gray-100\">\n <cide-ele-icon class=\"tw-mr-3 tw-text-gray-500 tw-group-hover:tw-text-gray-600\"\n type=\"none\" size=\"xs\">sync</cide-ele-icon>\n Sync settings\n </a>\n </div>\n <div class=\"tw-py-1\">\n <a href=\"#\"\n class=\"tw-group tw-flex tw-items-center tw-px-4 tw-py-2 tw-text-sm tw-text-gray-700 hover:tw-bg-gray-100\">\n <cide-ele-icon class=\"tw-mr-3 tw-text-gray-500 tw-group-hover:tw-text-gray-600\"\n type=\"none\" size=\"xs\">help_outline</cide-ele-icon>\n Help & support\n </a>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Menu items with categories -->\n <div class=\"sidebar-content tw-overflow-y-auto tw-flex-1\" (scroll)=\"onScroll($event)\">\n <!-- Search results if searching -->\n <div *ngIf=\"searchText()\" class=\"sidebar-section tw-p-2.5\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-2\">\n <h3 class=\"tw-text-xs tw-font-semibold tw-text-gray-500\">SEARCH RESULTS</h3>\n <span class=\"tw-text-xs tw-text-gray-500\">{{searchResults().length}} items</span>\n </div>\n\n <div *ngIf=\"searchResults().length > 0\" class=\"tw-space-y-1\">\n <a *ngFor=\"let item of searchResults()\" href=\"#\"\n class=\"menu-item tw-flex tw-items-center tw-px-2 tw-py-1.5 tw-rounded-md hover:tw-bg-gray-50\">\n <cide-ele-icon class=\"tw-mr-2 tw-text-gray-500\" type=\"none\"\n size=\"xs\">{{item.icon}}</cide-ele-icon>\n <span class=\"tw-text-sm tw-text-gray-700\">{{item.title}}</span>\n </a>\n </div>\n\n <div *ngIf=\"searchResults().length === 0\" class=\"tw-p-4 tw-text-center\">\n <div class=\"tw-flex tw-justify-center tw-mb-3\">\n <cide-ele-icon class=\"tw-text-gray-400\" type=\"none\" size=\"md\">search_off</cide-ele-icon>\n </div>\n <p class=\"tw-text-sm tw-text-gray-500\">No results for \"{{searchText()}}\"</p>\n <p class=\"tw-text-xs tw-text-gray-400 tw-mt-1\">Try another search term</p>\n </div>\n </div>\n\n <!-- Only show these sections if not searching -->\n <ng-container *ngIf=\"!searchText()\">\n <!-- Loading state -->\n <div *ngIf=\"loadingMenus()\" class=\"tw-p-4 tw-text-center\">\n <div class=\"tw-flex tw-justify-center tw-mb-3\">\n <cide-ele-spinner variant=\"circle\" size=\"xs\"></cide-ele-spinner>\n </div>\n <p class=\"tw-text-sm tw-text-gray-500\">Loading menus...</p>\n </div>\n\n <!-- Dynamic menu tree -->\n <div *ngIf=\"!loadingMenus() && menuLoadComplete()\" class=\"sidebar-section tw-p-2.5\"\n [class.animate-in]=\"animateSections()[0]\">\n <ng-container\n *ngTemplateOutlet=\"recursiveMenu; context: {$implicit: selectedModuleMenus, level: 0}\"></ng-container>\n </div>\n\n <!-- Empty state -->\n <div *ngIf=\"!loadingMenus() && menuLoadComplete() && selectedModuleMenus.length === 0\"\n class=\"tw-p-4 tw-text-center\">\n <div class=\"tw-flex tw-justify-center tw-mb-3\">\n <cide-ele-icon class=\"tw-text-gray-400\" type=\"none\" size=\"md\">folder_open</cide-ele-icon>\n </div>\n <p class=\"tw-text-sm tw-text-gray-500\">No menus available</p>\n <p class=\"tw-text-xs tw-text-gray-400 tw-mt-1\">Select a module to view its menus</p>\n </div>\n </ng-container>\n\n <!-- Recursive menu template -->\n <ng-template #recursiveMenu let-menus let-level=\"level\">\n <div [class.tw-ml-0]=\"level > 0\">\n <div *ngFor=\"let menu of menus\" class=\"tw-mb-2\">\n <!-- Title type items (section headers) -->\n <div *ngIf=\"menu.syme_type === 'title'\" class=\"tw-mb-1.5\">\n <h3 class=\"tw-text-[10px] tw-font-medium tw-text-gray-400 tw-uppercase tw-mb-1 tw-tracking-wider\">{{\n menu.syme_title }}</h3>\n <!-- Render children of title -->\n <ng-container *ngIf=\"menu.children && menu.children.length > 0\">\n <ng-container\n *ngTemplateOutlet=\"recursiveMenu; context: {$implicit: menu.children, level: level + 1}\"></ng-container>\n </ng-container>\n </div>\n\n <!-- Section type items (collapsible sections) -->\n <div *ngIf=\"menu.syme_type === 'section'\" class=\"tw-mb-2\">\n <!-- Section header (clickable to expand/collapse) -->\n <button (click)=\"toggleSection(menu._id)\" (keydown.enter)=\"toggleSection(menu._id)\"\n (keydown.space)=\"toggleSection(menu._id)\"\n class=\"section-header tw-w-full tw-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-md hover:tw-bg-gray-50 tw-cursor-pointer tw-transition-colors tw-text-left\"\n [class.tw-bg-blue-50]=\"isSectionExpanded(menu._id)\" type=\"button\" tabindex=\"0\"\n role=\"button\" [attr.aria-expanded]=\"isSectionExpanded(menu._id)\"\n [attr.aria-label]=\"'Toggle ' + menu.syme_title + ' section'\">\n\n <!-- Section Icon (left side, like other menu items) -->\n <cide-ele-icon class=\"tw-mr-1.5 tw-text-gray-400\" type=\"none\" size=\"2xs\">{{\n menu.syme_icon || 'folder' }}</cide-ele-icon>\n\n <!-- Section Title -->\n <span class=\"tw-text-xs tw-font-medium tw-text-gray-700\">{{ menu.syme_title\n }}</span>\n\n <!-- Right side icons container -->\n <div class=\"tw-ml-auto tw-flex tw-items-center tw-space-x-1.5\">\n <!-- Child Count Badge -->\n <span *ngIf=\"menu.children && menu.children.length > 0\"\n class=\"tw-px-1.5 tw-py-0.5 tw-bg-gray-200 tw-text-gray-500 tw-rounded-full tw-text-[10px] tw-font-medium\">\n {{ menu.children.length }}\n </span>\n\n <!-- Expand/Collapse Icon (right side) -->\n <cide-ele-icon class=\"tw-text-gray-400 tw-transition-transform tw-duration-200\"\n [class.tw-rotate-90]=\"isSectionExpanded(menu._id)\" type=\"none\"\n size=\"2xs\">chevron_right</cide-ele-icon>\n </div>\n </button>\n\n <!-- Section Content (collapsible) -->\n <div *ngIf=\"isSectionExpanded(menu._id) && menu.children && menu.children.length > 0\"\n class=\"section-content tw-mt-1 tw-ml-2 tw-border-l tw-border-gray-200 tw-pl-2.5\"\n [@slideInOut]=\"isSectionExpanded(menu._id) ? 'in' : 'out'\">\n <ng-container\n *ngTemplateOutlet=\"recursiveMenu; context: {$implicit: menu.children, level: level + 1}\"></ng-container>\n </div>\n </div>\n\n <!-- Menu type items (clickable links) -->\n <a *ngIf=\"menu.syme_type === 'menu'\" (click)=\"onMenuClick(menu, $event)\"\n (keydown.enter)=\"onMenuClick(menu, $event)\" (keydown.space)=\"onMenuClick(menu, $event)\" tabindex=\"0\"\n role=\"button\"\n class=\"menu-item tw-flex tw-items-center tw-px-2 tw-py-1.5 tw-rounded-md hover:tw-bg-gray-50 tw-cursor-pointer tw-transition-colors\">\n <cide-ele-icon *ngIf=\"menu.syme_icon\" class=\"tw-mr-2 tw-text-gray-500\" type=\"none\"\n size=\"xs\">{{ menu.syme_icon }}</cide-ele-icon>\n <span class=\"tw-text-sm tw-text-gray-700\">{{ menu.syme_title }}</span>\n <cide-ele-icon *ngIf=\"menu.children && menu.children.length > 0\"\n class=\"tw-ml-auto tw-text-gray-400\" type=\"none\"\n size=\"2xs\">chevron_right</cide-ele-icon>\n </a>\n\n <!-- Render nested children for menu items -->\n <ng-container\n *ngIf=\"menu.syme_type === 'menu' && menu.children && menu.children.length > 0\">\n <ng-container\n *ngTemplateOutlet=\"recursiveMenu; context: {$implicit: menu.children, level: level + 1}\"></ng-container>\n </ng-container>\n </div>\n </div>\n </ng-template>\n </div>\n\n <!-- Notification panel (overlays content when shown) -->\n <div *ngIf=\"showNotifications()\" class=\"notification-panel tw-absolute tw-inset-0 tw-bg-white tw-z-20\">\n <div class=\"tw-p-4 tw-border-b tw-border-gray-100 tw-flex tw-justify-between tw-items-center\">\n <h3 class=\"tw-text-sm tw-font-medium\">Notifications</h3>\n <button class=\"tw-p-1.5 tw-rounded-lg tw-text-gray-500 hover:tw-bg-gray-100\"\n (click)=\"toggleNotificationsPanel()\">\n <cide-ele-icon type=\"none\" size=\"xs\">close</cide-ele-icon>\n </button>\n </div>\n\n <div class=\"tw-p-4\">\n <div class=\"tw-flex tw-justify-between tw-items-center tw-mb-4\">\n <div class=\"tw-text-xs tw-text-gray-500\">Today</div>\n <button class=\"tw-text-xs tw-text-blue-500 hover:tw-text-blue-600\" (click)=\"markAllAsRead()\">Mark all as read</button>\n </div>\n\n <div class=\"tw-space-y-3\">\n @for (notification of notifications(); track notification.id) {\n <div \n [@notificationRemove]=\"notification.state\"\n class=\"notification-item tw-p-3 tw-rounded-lg tw-border-l-4 tw-relative tw-group\"\n [class.tw-border-blue-500]=\"notification.unread\"\n [class.tw-border-transparent]=\"!notification.unread\"\n [class.tw-bg-blue-50]=\"notification.unread\">\n <div class=\"tw-flex tw-gap-3\">\n <div\n class=\"tw-w-8 tw-h-8 tw-rounded-full tw-flex tw-items-center tw-justify-center\"\n [class.tw-bg-blue-100]=\"notification.unread\"\n [class.tw-bg-gray-100]=\"!notification.unread\"\n [class.tw-text-blue-500]=\"notification.unread\"\n [class.tw-text-gray-500]=\"!notification.unread\">\n <cide-ele-icon type=\"none\" size=\"xs\">{{ notification.icon }}</cide-ele-icon>\n </div>\n <div class=\"tw-flex-1\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-900\">{{ notification.title }}</div>\n <div class=\"tw-text-xs tw-text-gray-500 tw-mt-1\">{{ notification.message }}</div>\n <div class=\"tw-text-xs tw-text-gray-400 tw-mt-2\">{{ notification.time }}</div>\n </div>\n <button \n class=\"tw-opacity-0 group-hover:tw-opacity-100 tw-transition-opacity tw-p-1 tw-rounded hover:tw-bg-gray-200 tw-text-gray-500 hover:tw-text-gray-700\"\n (click)=\"removeNotification(notification.id)\"\n title=\"Remove notification\">\n <cide-ele-icon type=\"none\" size=\"xs\">close</cide-ele-icon>\n </button>\n </div>\n </div>\n }\n @if (notifications().length === 0) {\n <div class=\"tw-p-8 tw-text-center\">\n <cide-ele-icon class=\"tw-text-gray-400 tw-mb-2\" type=\"none\" size=\"md\">notifications_none</cide-ele-icon>\n <p class=\"tw-text-sm tw-text-gray-500\">No notifications</p>\n </div>\n }\n </div>\n </div>\n </div>\n\n <!-- Storage info at bottom -->\n <div class=\"sidebar-footer tw-p-2 tw-border-t tw-border-gray-100\">\n <!-- for info display -->\n </div>\n </div>\n </div>\n\n <!-- Resizer -->\n <div parentElementSelector=\"#cide-lyt-sidebar-page-inner-wrapper\"\n [minPrevSize]=\"sidebarSetupData.cide_lyt_sidebar_width\" prevElementSelector=\"#cide-lyt-sidebar-page\"\n nextElementSelector=\"#cide-lyt-page-wrapper\" cideEleResizer direction=\"horizontal\">\n <div class=\"cide-lyt-devider-track tw-w-full tw-h-full\"></div>\n </div>\n</nav>", styles: [".cide-lyt-sidebar{display:flex;box-shadow:0 4px 12px #0000000d;overflow:hidden;background-color:var(--cide-theme-sidebar-color);--sidebar-tooltip-bg: var(--cide-theme-dark-color);--sidebar-tooltip-color: var(--cide-theme-light-color);--sidebar-shadow-color: rgba(0, 0, 0, .05);transition:width .3s cubic-bezier(.4,0,.2,1);max-height:100%;isolation:isolate;will-change:width;position:relative;width:calc(var(--cide-lyt-stack-wrapper-width) + var(--cide-lyt-sidebar-menu-width));min-width:calc(var(--cide-lyt-stack-wrapper-width) + var(--cide-lyt-sidebar-menu-width))}.cide-lyt-sidebar.resizing,#cide-lyt-sidebar-page.resizing{transition:none!important}.cide-lyt-sidebar.collapsed{width:var(--cide-lyt-stack-wrapper-width)!important;min-width:var(--cide-lyt-stack-wrapper-width)!important;animation:collapseEffect .3s forwards}.cide-lyt-sidebar:not(.collapsed){animation:expandEffect .3s forwards}@keyframes collapseEffect{0%{box-shadow:0 4px 12px var(--sidebar-shadow-color)}to{box-shadow:0 2px 8px var(--sidebar-shadow-color)}}@keyframes expandEffect{0%{box-shadow:0 2px 8px var(--sidebar-shadow-color)}to{box-shadow:0 4px 12px var(--sidebar-shadow-color)}}.cide-lyt-sidebar.animating{transition:width .3s cubic-bezier(.25,.46,.45,.94)}.cide-lyt-sidebar.collapsed .cide-lyt-sidebar-menu{width:0;opacity:0;visibility:hidden;transform:translate(-10px);transition:width .3s cubic-bezier(.4,0,.2,1),opacity .3s cubic-bezier(.4,0,.2,1),visibility .3s cubic-bezier(.4,0,.2,1),transform .3s cubic-bezier(.4,0,.2,1)}.cide-lyt-sidebar:not(.collapsed) .cide-lyt-sidebar-menu{width:var(--cide-lyt-sidebar-menu-width);opacity:1;visibility:visible;transform:translate(0);transition:width .3s cubic-bezier(.4,0,.2,1),opacity .3s cubic-bezier(.4,0,.2,1) .1s,visibility .3s cubic-bezier(.4,0,.2,1) .1s,transform .3s cubic-bezier(.4,0,.2,1) .1s}.cide-lyt-stack{background:linear-gradient(to bottom,var(--cide-theme-sidebar-color),var(--cide-theme-light-color));z-index:10;border-right:1px solid var(--cide-theme-light-color);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:0 0 1.5rem;transition:all .3s cubic-bezier(.4,0,.2,1);overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:var(--cide-theme-color-brand-primary) transparent;position:relative;will-change:transform;scroll-behavior:smooth;box-shadow:inset -1px 0 0 var(--sidebar-shadow-color)}.cide-lyt-stack:after{content:\"\";position:absolute;bottom:0;left:0;right:0;height:30px;background:linear-gradient(to top,color-mix(in srgb,var(--cide-theme-sidebar-color) 90%,transparent),transparent);pointer-events:none;opacity:0;transition:opacity .3s ease;z-index:2}.cide-lyt-stack:before{content:\"\";position:absolute;top:0;left:0;right:0;height:30px;background:linear-gradient(to bottom,color-mix(in srgb,var(--cide-theme-sidebar-color) 90%,transparent),transparent);pointer-events:none;opacity:0;transition:opacity .3s ease;z-index:2}.cide-lyt-stack.scrolled-down:before{opacity:1}.cide-lyt-stack.scrolled-up:after{opacity:1}.cide-lyt-stack{position:relative;z-index:1;-webkit-overflow-scrolling:touch;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:var(--cide-ele-scrollbar-thumb, #d1d5db) var(--cide-ele-scrollbar-track, transparent)}.cide-lyt-stack::-webkit-scrollbar{width:2px}.cide-lyt-stack::-webkit-scrollbar-track{background:transparent;margin:10px 0}.cide-lyt-stack::-webkit-scrollbar-thumb{background:var(--cide-ele-scrollbar-thumb, #d1d5db);border-radius:4px}.cide-lyt-stack:hover::-webkit-scrollbar-thumb{background:var(--cide-ele-scrollbar-thumb-hover, #9ca3af)}.cide-lyt-stack:hover::-webkit-scrollbar{width:3px}.cide-lyt-stack:before,.cide-lyt-stack:after,.sidebar-content:before,.sidebar-content:after,.notification-panel:before,.notification-panel:after,.user-menu:before,.user-menu:after,.options-menu:before,.options-menu:after{content:\"\";position:absolute;left:0;right:0;height:24px;z-index:5;pointer-events:none;opacity:0;transition:opacity .3s ease}.cide-lyt-stack:before,.sidebar-content:before,.notification-panel:before,.user-menu:before,.options-menu:before{top:0;background:linear-gradient(to bottom,color-mix(in srgb,var(--cide-theme-sidebar-color) 90%,transparent),rgb(var(--tw-white-rgb) / 0))}.cide-lyt-stack:after,.sidebar-content:after,.notification-panel:after,.user-menu:after,.options-menu:after{bottom:0;background:linear-gradient(to top,color-mix(in srgb,var(--cide-theme-sidebar-color) 90%,transparent),rgb(var(--tw-white-rgb) / 0))}.cide-lyt-stack.is-scrollable-top:before,.sidebar-content.is-scrollable-top:before,.notification-panel.is-scrollable-top:before,.user-menu.is-scrollable-top:before,.options-menu.is-scrollable-top:before{opacity:1}.cide-lyt-stack.is-scrollable-bottom:after,.sidebar-content.is-scrollable-bottom:after,.notification-panel.is-scrollable-bottom:after,.user-menu.is-scrollable-bottom:after,.options-menu.is-scrollable-bottom:after{opacity:1}.collapse-toggle{margin-bottom:.5rem;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:5;border-radius:50%;overflow:hidden}.collapse-toggle:before{content:\"\";position:absolute;inset:0;background:var(--cide-theme-label-color);opacity:0;transition:opacity .2s ease;z-index:-1}.collapse-toggle:hover{transform:scale(1.1)}.collapse-toggle:hover:before{opacity:1}.collapse-toggle:active{transform:scale(.95);transition:transform .1s ease}.collapse-toggle:focus-visible{outline:2px solid var(--cide-theme-color-brand-primary);outline-offset:2px}.sidebar-scroll-content{width:100%;position:relative;z-index:1;overflow-y:auto;overflow-x:hidden;flex-grow:1;display:flex;flex-direction:column;align-items:center;padding:1rem 0;gap:.5rem;max-height:calc(100% - 8rem)}.nav-item{position:relative;width:30px;height:30px;display:flex;align-items:center;justify-content:center;transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;margin:4px 0;border-radius:10px;box-shadow:0 0 #3b82f600;transform-origin:center;overflow:hidden;color:var(--cide-theme-text-color)}.nav-item:before{content:\"\";position:absolute;inset:0;background:radial-gradient(circle at center,rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.08),rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.01));opacity:0;transition:opacity .3s ease;z-index:-1}.nav-item:hover{background-color:color-mix(in srgb,var(--cide-theme-light-color) 90%,transparent);transform:translateY(-1px);box-shadow:0 2px 6px var(--cide-theme-shadow-color)}.nav-item:hover:before{opacity:1}.nav-item:active{transition:all .1s ease;transform:translateY(-1px);box-shadow:0 2px 6px var(--cide-theme-shadow-color)}.nav-item:active{transform:translateY(1px);transition:all .1s ease}.nav-item-active{background:linear-gradient(135deg,rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.08),rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.12));box-shadow:0 2px 8px rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.15);transform:translateZ(0);color:var(--cide-theme-color-brand-primary)}.nav-item-active:after{content:\"\";position:absolute;bottom:-2px;left:30%;right:30%;height:2px;background:linear-gradient(to right,rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),0),var(--cide-theme-color-brand-primary),rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),0));border-radius:1px;animation:pulseGlow 2s infinite}@keyframes pulseGlow{0%{opacity:.4}50%{opacity:1}to{opacity:.4}}.nav-item-active:hover{background:linear-gradient(135deg,#3b82f61a,#3b82f626)}.nav-badge{z-index:5;transition:all .3s ease}.nav-item:hover .nav-badge{transform:scale(1.1)}.nav-tooltip{position:fixed;left:64px;top:50%;transform:translateY(-50%) translate(-5px);background-color:var(--sidebar-tooltip-bg);color:var(--sidebar-tooltip-color);padding:.4rem .75rem;border-radius:.25rem;font-size:.75rem;white-space:nowrap;opacity:0;pointer-events:none;transition:all .2s cubic-bezier(.4,0,.2,1);z-index:1000;box-shadow:0 2px 8px var(--cide-theme-shadow-color);letter-spacing:.01em;will-change:transform,opacity;max-width:220px;text-overflow:ellipsis;overflow:hidden;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.nav-tooltip:before{content:\"\";position:absolute;top:50%;right:100%;transform:translateY(-50%);border-width:6px;border-style:solid;border-color:transparent var(--sidebar-tooltip-bg) transparent transparent;filter:drop-shadow(-2px 0px 1px rgba(0,0,0,.1))}.nav-item:hover .nav-tooltip{opacity:1;transform:translateY(-50%) translate(0);box-shadow:0 3px 12px var(--cide-theme-shadow-color)}.nav-item-active{background-color:color-mix(in srgb,var(--cide-theme-color-brand-primary) 10%,var(--cide-theme-light-color));border-radius:.5rem}.nav-item-active:before{opacity:0}.active-nav-icon{color:var(--cide-lyt-sidebar-nav-item-color-active)!important;filter:drop-shadow(0 0 3px rgba(59,130,246,.3))}.nav-indicator{position:absolute;left:-8px;top:50%;transform:translateY(-50%);width:3px;height:60%;background:var(--cide-theme-color-brand-primary);border-radius:0 4px 4px 0;opacity:0;transition:all .3s ease;box-shadow:0 0 6px rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.5)}.nav-item-active .nav-indicator{opacity:1;left:0}@keyframes fadeSlideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.sidebar-scroll-content .nav-item{opacity:0;animation:fadeSlideIn .5s forwards}.sidebar-scroll-content .nav-item:nth-child(1){animation-delay:.05s}.sidebar-scroll-content .nav-item:nth-child(2){animation-delay:.1s}.sidebar-scroll-content .nav-item:nth-child(3){animation-delay:.15s}.sidebar-scroll-content .nav-item:nth-child(4){animation-delay:.2s}.sidebar-scroll-content .nav-item:nth-child(5){animation-delay:.25s}.sidebar-scroll-content .nav-item:nth-child(6){animation-delay:.3s}.sidebar-scroll-content .nav-item:nth-child(7){animation-delay:.35s}.sidebar-scroll-content .nav-item:nth-child(8){animation-delay:.4s}.sidebar-scroll-content .nav-item:nth-child(9){animation-delay:.45s}.sidebar-scroll-content .nav-item:nth-child(10){animation-delay:.5s}.sidebar-scroll-content .nav-item:nth-child(11){animation-delay:.55s}.sidebar-scroll-content .nav-item:nth-child(12){animation-delay:.6s}.sidebar-scroll-content .nav-item:nth-child(13){animation-delay:.65s}.sidebar-scroll-content .nav-item:nth-child(14){animation-delay:.7s}.sidebar-scroll-content .nav-item:nth-child(15){animation-delay:.75s}cide-ele-icon[type=box]{cursor:pointer;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:.5rem;transition:all .2s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}cide-ele-icon[type=box]:hover{background-color:rgb(var(--tw-gray-100-rgb) / 1);transform:translateY(-1px)}cide-ele-icon[type=box]:active{transform:translateY(0)}.theme-toggle{position:relative;overflow:hidden;padding:.5rem;border-radius:12px;background-color:transparent;border:2px solid transparent;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem}.theme-toggle:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at center,rgba(59,130,246,.2) 0%,transparent 70%);opacity:0;transition:opacity .3s ease;border-radius:.5rem}.theme-toggle:hover{background-color:var(--cide-theme-hover-bg-color, rgb(var(--tw-gray-100-rgb) / 1));border-color:var(--cide-theme-color-brand-primary, rgba(59, 130, 246, .3));transform:translateY(-1px);box-shadow:0 4px 12px #0000001a}.theme-toggle:hover:after{opacity:1}.theme-toggle:focus{outline:none;box-shadow:0 0 0 3px #3b82f64d}.theme-toggle cide-ele-icon{color:var(--cide-theme-icon-color, #6b7280);transition:all .2s ease;width:1.25rem;height:1.25rem;display:flex;align-items:center;justify-content:center}.theme-toggle:hover cide-ele-icon{color:var(--cide-theme-color-brand-primary, #3b82f6);transform:scale(1.1) rotate(10deg)}.dark-mode .theme-toggle:after{background:radial-gradient(circle at center,rgba(96,165,250,.2) 0%,transparent 70%)}.dark-mode .theme-toggle:hover{background-color:var(--cide-theme-dark-hover-bg-color, rgba(55, 65, 81, 1));border-color:var(--cide-theme-color-brand-primary, rgba(96, 165, 250, .3))}.notification-badge{font-size:.65rem;min-width:20px;height:20px;box-shadow:0 2px 4px rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.25);transform-origin:center;position:relative;animation:pulseNotification 2s infinite;overflow:hidden;background-color:var(--cide-theme-color-brand-primary);color:var(--cide-theme-light-color)}.notification-badge:before{content:\"\";position:absolute;inset:0;background:linear-gradient(135deg,rgb(var(--tw-white-rgb) / .3),rgb(var(--tw-white-rgb) / 0));opacity:0;transition:opacity .3s ease}.notification-badge:hover:before{opacity:1}@keyframes pulseNotification{0%{box-shadow:0 0 rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.4);transform:scale(1)}40%{transform:translateY(-5px)}50%{box-shadow:0 0 0 4px rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),0);transform:scale(1.05)}60%{transform:translateY(-2px)}to{box-shadow:0 0 rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),0);transform:scale(1)}}.user-avatar{transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;box-shadow:0 2px 5px #00000014;z-index:2}.user-avatar:hover{transform:scale(1.08);box-shadow:0 4px 12px #00000026}.user-avatar:before{content:\"\";position:absolute;inset:-3px;background:radial-gradient(circle,rgba(59,130,246,.3),transparent 70%);opacity:0;transition:opacity .3s ease;z-index:-1;border-radius:50%}.user-avatar:hover:before{opacity:1}.user-status{position:absolute;bottom:0;right:0;width:10px;height:10px;border-radius:50%;border:2px solid white;transition:all .3s ease}.user-status.online{background-color:#10b981;animation:statusPulse 2s infinite}.user-status.busy{background-color:#f59e0b}.user-status.offline{background-color:#6b7280}.user-status.dnd{background-color:#ef4444}@keyframes statusPulse{0%{box-shadow:0 0 #10b98166}70%{box-shadow:0 0 0 6px #10b98100}to{box-shadow:0 0 #10b98100}}.dark-mode .user-avatar{box-shadow:0 2px 5px #0003}.dark-mode .user-avatar:before{background:radial-gradient(circle,rgba(96,165,250,.4),transparent 70%)}.dark-mode .user-status{border-color:#0f172a}.user-dropdown{position:relative}.user-menu{animation:fadeInUp .2s cubic-bezier(.4,0,.2,1);z-index:30;margin-left:10px;margin-bottom:5px;max-height:80vh;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--cide-ele-scrollbar-thumb, #d1d5db) var(--cide-ele-scrollbar-track, transparent);box-shadow:0 10px 25px #0000001a;border-radius:.75rem;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);position:absolute;left:100%;bottom:0;margin-top:.5rem;margin-left:.5rem;width:14rem;border-radius:.375rem;box-shadow:0 10px 15px -3px var(--cide-theme-shadow-color),0 4px 6px -2px var(--cide-theme-shadow-color);background-color:var(--cide-theme-sidebar-color);border:1px solid var(--cide-theme-border-color);z-index:50;overflow:hidden}.user-menu a{color:var(--cide-theme-text-color);transition:background-color .2s ease}.user-menu a:hover{background-color:var(--cide-theme-hover-bg-color)}.user-menu .tw-text-red-700{color:var(--cide-theme-error-color)}.user-menu::-webkit-scrollbar{width:3px}.user-menu::-webkit-scrollbar-track{background:transparent}.user-menu::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb, #d1d5db);border-radius:20px;opacity:.7}.user-menu:hover::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb-hover, #9ca3af);opacity:1}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.user-status{transition:all .3s ease;box-shadow:0 0 0 2px var(--cide-theme-sidebar-color)}.user-status.online{animation:pulseOnline 2s infinite}@keyframes pulseOnline{0%{box-shadow:0 0 #22c55e66,0 0 0 2px var(--cide-theme-sidebar-color)}70%{box-shadow:0 0 0 4px #22c55e00,0 0 0 2px var(--cide-theme-sidebar-color)}to{box-shadow:0 0 #22c55e00,0 0 0 2px var(--cide-theme-sidebar-color)}}.cide-lyt-sidebar-menu{width:var(--cide-lyt-sidebar-menu-width);background-color:var(--cide-theme-sidebar-color);border-left:1px solid rgb(var(--tw-gray-100-rgb) / 1);transition:width .3s cubic-bezier(.4,0,.2,1),opacity .3s cubic-bezier(.4,0,.2,1) .1s,visibility .3s cubic-bezier(.4,0,.2,1) .1s,transform .3s cubic-bezier(.4,0,.2,1) .1s;display:flex;flex-direction:column;overflow:hidden;max-height:100%;position:relative;will-change:width,opacity,transform;opacity:1;visibility:visible;transform:translate(0)}.sidebar-header{background-color:var(--cide-theme-sidebar-color);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);position:sticky;top:0;z-index:10;border-bottom:1px solid var(--cide-theme-border-color);padding:1rem .75rem;transition:all .3s ease;color:var(--cide-theme-text-color)}.sidebar-header.scrolled{box-shadow:0 4px 10px -8px var(--cide-theme-shadow-color)}.back-button{transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%}.back-button:hover{transform:translate(-2px);background-color:rgb(var(--tw-gray-100-rgb) / 1)}.back-button:active{transform:translate(-1px) scale(.95)}.search-wrapper{position:relative;transition:all .3s ease}.search-wrapper:focus-within{transform:translateY(-1px)}.search-shortcut{font-size:.65rem;opacity:.7;letter-spacing:.02em;pointer-events:none;padding:.1rem .3rem;background-color:rgb(var(--tw-gray-100-rgb) / .8);border-radius:.25rem;border:1px solid rgb(var(--tw-gray-200-rgb) / .8);transition:all .3s ease}.search-wrapper:focus-within .search-shortcut{opacity:.5}.options-menu{animation:fadeInUp .2s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 12px #0000001a;max-height:70vh;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--cide-ele-scrollbar-thumb, #d1d5db) var(--cide-ele-scrollbar-track, transparent);border-radius:.75rem;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.options-menu::-webkit-scrollbar{width:3px}.options-menu::-webkit-scrollbar-track{background:transparent}.options-menu::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb, #d1d5db);border-radius:20px;opacity:.7}.options-menu:hover::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb-hover, #9ca3af);opacity:1}.sidebar-section{position:relative;padding:.25rem 0}.sidebar-section:not(:first-child):before{content:\"\";height:1px;background:linear-gradient(to right,#e5e7eb00,#e5e7eb80,#e5e7eb00);position:absolute;top:0;left:10%;right:10%}.tw-text-xs.tw-font-semibold.tw-text-gray-500{font-size:.7rem;letter-spacing:.05em;text-transform:uppercase;position:relative;display:inline-block;padding:0 .5rem;color:var(--cide-theme-label-color)}.tw-text-xs.tw-font-semibold.tw-text-gray-500:after{content:\"\";position:absolute;height:3px;width:2rem;background:linear-gradient(to right,rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.5),rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),0));bottom:-4px;left:.5rem;border-radius:3px;transition:width .3s ease}.sidebar-section:hover .tw-text-xs.tw-font-semibold.tw-text-gray-500:after{width:3rem}.menu-item{text-decoration:none;transition:all .25s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;margin:2px 0;border-radius:.5rem;transform:translateZ(0);color:var(--cide-theme-text-color)}.menu-item:hover{transform:translate(3px);background-color:var(--cide-theme-light-color);box-shadow:0 1px 3px var(--sidebar-shadow-color)}.active-menu-item{background-color:rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.08);position:relative;box-shadow:0 2px 5px rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.1)}.active-menu-item:after{content:\"\";position:absolute;left:0;top:0;height:100%;width:3px;background:linear-gradient(to bottom,var(--cide-theme-color-brand-primary),var(--cide-theme-secondary-color));border-radius:0 2px 2px 0;box-shadow:0 0 6px rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.3);animation:pulseLeftBorder 2s infinite}@keyframes pulseLeftBorder{0%{opacity:.7}50%{opacity:1}to{opacity:.7}}:root[data-theme=dark] .active-menu-item,:root.dark-mode .active-menu-item{background-color:var(--cide-theme-hover-bg-color);box-shadow:0 2px 5px var(--cide-theme-shadow-color)}:root[data-theme=dark] .active-menu-item:after,:root.dark-mode .active-menu-item:after{background:linear-gradient(to bottom,var(--cide-theme-primary-color),var(--cide-theme-info-color));box-shadow:0 0 8px #60a5fa66}.quick-actions{transition:all .3s ease;opacity:0;transform:translate(5px);z-index:2}.menu-item:hover .quick-actions{opacity:1;transform:translate(0)}.badge{font-size:.7rem;padding:1px 5px;transition:all .2s cubic-bezier(.4,0,.2,1);position:relative;z-index:1}.menu-item:hover .badge{background-color:#d1d5db}.new-badge{animation:pulse 2s infinite;z-index:1}@keyframes pulse{0%{box-shadow:0 0 #3b82f666}70%{box-shadow:0 0 0 4px #3b82f600}to{box-shadow:0 0 #3b82f600}}.toggle-switch{display:inline-flex;align-items:center;transition:all .2s ease}.toggle-switch:hover{transform:scale(1.05)}.toggle-track{position:relative;cursor:pointer;transition:background-color .3s ease;overflow:hidden}.toggle-track:after{content:\"\";position:absolute;top:50%;left:50%;width:5px;height:5px;background:rgb(var(--tw-white-rgb) / .7);opacity:0;border-radius:100%;transform:scale(1) translate(-50%,-50%);transform-origin:50% 50%}.toggle-track.clicked:after{animation:ripple .6s ease-out}@keyframes ripple{0%{opacity:1;transform:scale(0) translate(-50%,-50%)}to{opacity:0;transform:scale(20) translate(-50%,-50%)}}.alert-box{animation:fadeIn .5s cubic-bezier(.4,0,.2,1);box-shadow:0 2px 8px #fde04726;border-radius:.5rem;position:relative;overflow:hidden}.alert-box:before{content:\"\";position:absolute;inset:0;background-image:url(\"data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23fef3c7' fill-opacity='0.4' fill-rule='evenodd'%3E%3Ccircle cx='3' cy='3' r='3'/%3E%3Ccircle cx='13' cy='13' r='3'/%3E%3C/g%3E%3C/svg%3E\");opacity:.3;pointer-events:none}@keyframes fadeIn{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.notification-panel{animation:fadeIn .3s cubic-bezier(.4,0,.2,1);overflow-y:auto;overflow-x:hidden;max-height:100vh;scrollbar-width:thin;scrollbar-color:var(--cide-ele-scrollbar-thumb, #d1d5db) var(--cide-ele-scrollbar-track, transparent);padding:.75rem;border-radius:.75rem}.notification-panel::-webkit-scrollbar{width:3px}.notification-panel::-webkit-scrollbar-track{background:transparent}.notification-panel::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb, #d1d5db);border-radius:20px;opacity:.7}.notification-panel:hover::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb-hover, #9ca3af);opacity:1}.notification-item{transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;border-radius:.5rem;margin-bottom:.5rem;position:relative;overflow:hidden;word-wrap:break-word;overflow-wrap:break-word}.notification-item:hover{background-color:rgb(var(--tw-gray-100-rgb) / 1);transform:translate(1px)}.notification-item:active{transform:scale(.99)}.notification-item.unread:before{content:\"\";position:absolute;left:0;top:0;height:100%;width:3px;background-color:var(--cide-theme-color-brand-primary);border-radius:0 2px 2px 0}.sidebar-footer{background-color:var(--cide-theme-light-color);position:sticky;bottom:0;z-index:10;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:1px solid var(--cide-theme-border-color);padding:.75rem;transition:all .3s ease;color:var(--cide-theme-text-color)}.upgrade-button{transition:all .2s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;border-radius:.5rem;color:var(--cide-theme-text-color)}.upgrade-button:hover{background-color:rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.1);transform:translateY(-1px)}.upgrade-button:active{transform:translateY(0) scale(.98)}.upgrade-button:after{content:\"\";position:absolute;width:12px;height:12px;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%233b82f6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2'%3E%3C/polygon%3E%3C/svg%3E\");top:5px;right:10px;opacity:.5;transform:scale(0);transition:all .3s ease}.upgrade-button:hover:after{transform:scale(1) rotate(20deg);animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:scale(1) rotate(5deg) translate(0)}50%{transform:scale(1.1) rotate(-5deg) translate(-2px,-2px)}}.storage-bar{background-color:#e5e7eb80;overflow:hidden;border-radius:4px;height:6px;position:relative}.storage-fill{background:linear-gradient(to right,var(--cide-theme-color-brand-primary),var(--cide-theme-secondary-color));transition:width 1s cubic-bezier(.4,0,.2,1);position:relative;height:100%;border-radius:4px}.storage-fill:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,rgb(var(--tw-white-rgb) / 0),rgb(var(--tw-white-rgb) / .2),rgb(var(--tw-white-rgb) / 0));animation:shimmer 2s infinite}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.plan-features{transition:all .3s ease;padding:.5rem;border-radius:.5rem}.plan-features:hover{background-color:rgb(var(--tw-gray-100-rgb) / .5)}.feature-item{display:flex;align-items:center;margin:.25rem 0;position:relative;padding-left:1.25rem;color:var(--cide-theme-text-color)}.feature-item:before{content:\"\\2713\";position:absolute;left:0;color:var(--cide-theme-color-brand-primary);font-size:.7rem;top:50%;transform:translateY(-50%)}.sidebar-content{scrollbar-width:thin;scrollbar-color:var(--cide-ele-scrollbar-thumb, #d1d5db) var(--cide-ele-scrollbar-track, transparent);flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding:0 .75rem;transition:all .3s ease;position:relative;scroll-behavior:smooth;scroll-padding:1rem;overscroll-behavior:contain;color:var(--cide-theme-text-color)}.sidebar-content:after{content:\"\";position:absolute;bottom:0;left:0;right:0;height:30px;background:linear-gradient(to top,color-mix(in srgb,var(--cide-theme-sidebar-color) 90%,transparent),transparent);pointer-events:none;opacity:0;transition:opacity .3s ease;z-index:2}.sidebar-content:before{content:\"\";position:absolute;top:0;left:0;right:0;height:30px;background:linear-gradient(to bottom,color-mix(in srgb,var(--cide-theme-sidebar-color) 90%,transparent),transparent);pointer-events:none;opacity:0;transition:opacity .3s ease;z-index:2}.sidebar-content.scrolled-down:before{opacity:1}.sidebar-content.scrolled-up:after{opacity:1}.sidebar-content::-webkit-scrollbar{width:3px}.sidebar-content::-webkit-scrollbar-track{background:transparent}.sidebar-content::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb, #d1d5db);border-radius:20px;opacity:.7}.sidebar-content:hover::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb-hover, #9ca3af);opacity:1}.cide-lyt-sidebar *::-webkit-scrollbar{width:3px}.cide-lyt-sidebar *::-webkit-scrollbar-track{background:var(--cide-ele-scrollbar-track, transparent)}.cide-lyt-sidebar *::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb, #d1d5db);border-radius:20px;opacity:.7}.cide-lyt-sidebar *:hover::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb-hover, #9ca3af);opacity:1}.sidebar-section{transition:all .3s ease-out;transform:translateY(0);opacity:1}.sidebar-section.animate-in{animation:slideInUp .4s cubic-bezier(.4,0,.2,1) forwards}@keyframes slideInUp{0%{opacity:.5;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.sidebar-section:nth-child(1).animate-in{animation-delay:.1s}.sidebar-section:nth-child(2).animate-in{animation-delay:.2s}.sidebar-section:nth-child(3).animate-in{animation-delay:.3s}.sidebar-section:nth-child(4).animate-in{animation-delay:.4s}.sidebar-section:nth-child(5).animate-in{animation-delay:.5s}:host ::ng-deep cide-ele-input{width:100%}:host ::ng-deep .cide-input-field{border-radius:8px;background-color:#f9fafb;border:1px solid transparent;transition:all .2s cubic-bezier(.4,0,.2,1)}:host ::ng-deep .cide-input-field:focus-within{border-color:#d1d5db;background-color:#fff;box-shadow:0 2px 8px #0000000d;transform:translateY(-1px)}.cide-lyt-sidebar *:focus{outline:none;box-shadow:0 0 0 2px #3b82f64d}:root[data-theme=dark] .cide-lyt-sidebar,:root.dark-mode .cide-lyt-sidebar,html[data-theme=dark] .cide-lyt-sidebar,html.dark-mode .cide-lyt-sidebar{--sidebar-tooltip-bg: var(--cide-theme-dark-color);--sidebar-tooltip-color: var(--cide-theme-light-color);background-color:var(--cide-theme-sidebar-color);color:var(--cide-theme-text-color)}:root[data-theme=dark] .cide-lyt-stack,:root.dark-mode .cide-lyt-stack,html[data-theme=dark] .cide-lyt-stack,html.dark-mode .cide-lyt-stack{background-color:var(--cide-theme-dark-color);border-right-color:var(--cide-theme-border-color)}:root[data-theme=dark] .cide-lyt-stack:before,:root[data-theme=dark] .cide-lyt-stack:after,:root[data-theme=dark] .sidebar-content:before,:root[data-theme=dark] .sidebar-content:after,:root.dark-mode .cide-lyt-stack:before,:root.dark-mode .cide-lyt-stack:after,:root.dark-mode .sidebar-content:before,:root.dark-mode .sidebar-content:after{background:linear-gradient(to bottom,var(--cide-theme-dark-color),transparent)}:root[data-theme=dark] .sidebar-content:after,:root[data-theme=dark] .cide-lyt-stack:after,:root.dark-mode .sidebar-content:after,:root.dark-mode .cide-lyt-stack:after{background:linear-gradient(to top,var(--cide-theme-dark-color),transparent)}:root[data-theme=dark] .cide-lyt-sidebar-menu,:root.dark-mode .cide-lyt-sidebar-menu{background-color:var(--cide-theme-dark-color);border-left-color:var(--cide-theme-border-color)}:root[data-theme=dark] .sidebar-header,:root[data-theme=dark] .sidebar-footer,:root.dark-mode .sidebar-header,:root.dark-mode .sidebar-footer{background-color:var(--cide-theme-light-color);border-color:var(--cide-theme-border-color)}:root[data-theme=dark] .tw-text-gray-700,:root.dark-mode .tw-text-gray-700{color:var(--cide-theme-text-color)}:root[data-theme=dark] .tw-text-gray-500,:root.dark-mode .tw-text-gray-500{color:var(--cide-theme-label-color)}:root[data-theme=dark] .tw-bg-gray-50,:root[data-theme=dark] .menu-item:hover,:root.dark-mode .tw-bg-gray-50,:root.dark-mode .menu-item:hover{background-color:var(--cide-theme-hover-bg-color)}:root[data-theme=dark] .tw-bg-gray-100,:root.dark-mode .tw-bg-gray-100{background-color:var(--cide-theme-light-color)}:root[data-theme=dark] .tw-bg-gray-200,:root.dark-mode .tw-bg-gray-200{background-color:var(--cide-theme-border-color)}:root[data-theme=dark] .nav-item:hover:before,:root.dark-mode .nav-item:hover:before{background-color:var(--cide-theme-hover-bg-color)}:root[data-theme=dark] .back-button:hover,:root.dark-mode .back-button:hover{background-color:var(--cide-theme-hover-bg-color)}:root[data-theme=dark] .sidebar-section:not(:first-child):before,:root.dark-mode .sidebar-section:not(:first-child):before{background:linear-gradient(to right,transparent 0%,var(--cide-theme-border-color) 50%,transparent 100%)}:root[data-theme=dark] .toggle-track:after,:root.dark-mode .toggle-track:after{background:#00000080}:root[data-theme=dark] .alert-box:before,:root.dark-mode .alert-box:before{opacity:.2}:root[data-theme=dark] :host ::ng-deep .cide-input-field,:root.dark-mode :host ::ng-deep .cide-input-field{background-color:var(--cide-theme-light-color);color:var(--cide-theme-text-color)}:root[data-theme=dark] :host ::ng-deep .cide-input-field:focus-within,:root.dark-mode :host ::ng-deep .cide-input-field:focus-within{border-color:var(--cide-theme-border-color);background-color:var(--cide-theme-dark-color)}.nav-item-active .nav-indicator{animation:pulseIndicator 2s infinite}@keyframes pulseIndicator{0%{box-shadow:0 0 #3b82f666}70%{box-shadow:0 0 0 3px #3b82f600}to{box-shadow:0 0 #3b82f600}}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media screen and (max-width: 1024px){.cide-lyt-sidebar-menu{width:220px}.sidebar-content{padding:0 .25rem}.tw-text-xs.tw-font-semibold.tw-text-gray-500{font-size:.65rem}}@media screen and (max-width: 768px){.cide-lyt-sidebar{position:fixed;top:0;left:0;bottom:0;height:100vh;height:100dvh;z-index:40;transform:translate(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1);width:auto;min-width:auto}.cide-lyt-sidebar.mobile-open{transform:translate(0)}.cide-lyt-sidebar.collapsed{transform:translate(-100%)}.cide-lyt-stack{width:64px;min-width:64px;flex-shrink:0}.cide-lyt-sidebar-menu{position:relative;width:100%;max-width:280px;min-width:240px;left:0;top:0;height:100%;z-index:1;box-shadow:2px 0 10px #0000001a;border-radius:0;transform:none;opacity:1;visibility:visible}.cide-lyt-sidebar.collapsed .cide-lyt-sidebar-menu{display:none}.sidebar-content{padding:.5rem}.nav-item{width:40px;height:40px;margin:6px 0}.menu-item{padding:.75rem .5rem;margin:3px 0;min-height:44px}.sidebar-overlay{position:fixed;inset:0;background-color:#00000080;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);opacity:0;pointer-events:none;transition:opacity .3s cubic-bezier(.4,0,.2,1);z-index:35}.sidebar-overlay.active{opacity:1;pointer-events:auto}.user-menu,.options-menu{width:12rem;max-width:calc(100vw - 2rem)}.tw-text-xs.tw-font-semibold.tw-text-gray-500{font-size:.7rem;padding:.5rem .75rem}.notification-panel{width:100%;max-width:100%;padding:.5rem}}@media screen and (max-width: 480px){.cide-lyt-sidebar-menu{max-width:260px;min-width:220px}.cide-lyt-stack{width:56px;min-width:56px}.sidebar-content{padding:.375rem}.menu-item{padding:.625rem .375rem;font-size:.875rem}.user-avatar{width:2rem;height:2rem}.notification-panel{padding:.375rem}}@media screen and (max-width: 768px) and (orientation: landscape){.cide-lyt-sidebar-menu{max-width:300px}.sidebar-content{padding:.5rem}.nav-item{margin:4px 0}.menu-item{padding:.625rem .5rem}}.cide-lyt-sidebar,.cide-lyt-stack,.cide-lyt-sidebar-menu,.sidebar-logo,.nav-item,.menu-item,.user-avatar,.upgrade-button,.storage-fill,.notification-item,.sidebar-section.animate-in{transform:translateZ(0);backface-visibility:hidden;perspective:1000px;will-change:transform,opacity}:root[data-theme=dark] .nav-item-active,:root.dark-mode .nav-item-active{background:linear-gradient(135deg,rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.15),rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),.1));box-shadow:0 2px 8px #1e40af40}:root[data-theme=dark] .nav-item-active:after,:root.dark-mode .nav-item-active:after{background:linear-gradient(to right,rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),0),rgba(var(--cide-theme-secondary-color-rgb, 74, 222, 128),.6),rgba(var(--cide-theme-color-brand-primary-rgb, 59, 130, 246),0));box-shadow:0 0 5px rgba(var(--cide-theme-secondary-color-rgb, 74, 222, 128),.5)}:root[data-theme=dark] .nav-item:hover,:root.dark-mode .nav-item:hover{background-color:var(--cide-theme-hover-bg-color);box-shadow:0 2px 8px var(--cide-theme-shadow-color)}:root[data-theme=dark] .nav-tooltip,:root.dark-mode .nav-tooltip{background-color:var(--cide-theme-tooltip-dark-bg);box-shadow:0 3px 10px var(--cide-theme-shadow-color);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}:root[data-theme=dark] .nav-tooltip:before,:root.dark-mode .nav-tooltip:before{border-color:transparent var(--cide-theme-tooltip-dark-bg) transparent transparent}.text-theme-primary{color:var(--cide-theme-color-brand-primary)}.text-theme-secondary{color:var(--cide-theme-secondary-color)}.text-theme-text{color:var(--cide-theme-text-color)}.text-theme-label{color:var(--cide-theme-label-color)}.bg-theme-primary{background-color:var(--cide-theme-color-brand-primary)}.bg-theme-secondary{background-color:var(--cide-theme-secondary-color)}.bg-theme-light{background-color:var(--cide-theme-light-color)}.bg-theme-dark{background-color:var(--cide-theme-dark-color)}.bg-theme-sidebar{background-color:var(--cide-theme-sidebar-color)}.border-theme-light{border-color:var(--cide-theme-light-color)}.border-theme-primary{border-color:var(--cide-theme-color-brand-primary)}.hover-bg-theme-light:hover{background-color:var(--cide-theme-light-color)}.hover-text-theme-primary:hover{color:var(--cide-theme-color-brand-primary)}.tw-text-gray-500{color:var(--cide-theme-icon-color)}.hover\\:tw-text-gray-700:hover{color:var(--cide-theme-icon-hover-color)}.tw-text-gray-700{color:var(--cide-theme-text-color)}.tw-text-red-500,.tw-text-red-600,.tw-text-red-700{color:var(--cide-theme-error-color)}.tw-bg-gray-200{background-color:var(--cide-theme-border-color)}.hover\\:tw-bg-gray-100:hover{background-color:var(--cide-theme-hover-bg-color)}.tw-bg-white{background-color:var(--cide-theme-sidebar-color)}.tw-bg-green-500{background-color:var(--cide-theme-success-color)}.tw-border-gray-100,.tw-divide-gray-100{border-color:var(--cide-theme-border-color)}.tw-shadow-lg{box-shadow:0 10px 15px -3px var(--cide-theme-shadow-color),0 4px 6px -2px var(--cide-theme-shadow-color)}.tw-shadow-sm,.hover\\:tw-shadow:hover{box-shadow:0 1px 2px 0 var(--cide-theme-shadow-color)}.active-nav-icon{color:var(--cide-theme-color-brand-primary)!important}.nav-item{display:flex;align-items:center;justify-content:center;position:relative;border-radius:.375rem}.nav-item:hover{background-color:var(--cide-theme-hover-bg-color)}.nav-item:hover cide-ele-icon{color:var(--cide-theme-icon-hover-color)}.nav-item-active{background-color:color-mix(in srgb,var(--cide-theme-color-brand-primary) 10%,var(--cide-theme-light-color))}.nav-item-active cide-ele-icon{color:var(--cide-theme-color-brand-primary)}.nav-indicator{opacity:0;transition:opacity .2s ease}.nav-item-active .nav-indicator{opacity:1}.nav-tooltip{position:absolute;left:100%;top:50%;transform:translateY(-50%);background-color:var(--sidebar-tooltip-bg);color:var(--sidebar-tooltip-color);padding:.25rem .5rem;border-radius:.25rem;font-size:.75rem;white-space:nowrap;opacity:0;pointer-events:none;transition:all .2s ease;margin-left:.5rem;z-index:30;box-shadow:0 2px 8px var(--cide-theme-shadow-color)}.nav-item:hover .nav-tooltip{opacity:1}.nav-badge{position:absolute;top:-.25rem;right:-.25rem;width:.375rem;height:.375rem;border-radius:9999px;background-color:var(--cide-theme-error-color);animation:ping 1s cubic-bezier(0,0,.2,1) infinite}@keyframes ping{75%,to{transform:scale(2);opacity:0}}.user-avatar{width:2.5rem;height:2.5rem;border-radius:9999px;overflow:hidden;background-color:var(--cide-theme-border-color);border:2px solid var(--cide-theme-sidebar-color);box-shadow:0 1px 2px var(--cide-theme-shadow-color);cursor:pointer;transition:box-shadow .2s ease}.user-avatar:hover{box-shadow:0 2px 4px var(--cide-theme-shadow-color)}.user-status{position:absolute;bottom:0;right:0;width:.75rem;height:.75rem;border-radius:9999px;background-color:var(--cide-theme-success-color);border:2px solid var(--cide-theme-sidebar-color)}:root[data-theme=dark] .nav-item:hover,:root.dark-mode .nav-item:hover{background-color:var(--cide-theme-hover-bg-color)}:root[data-theme=dark] .nav-item-active,:root.dark-mode .nav-item-active{background-color:color-mix(in srgb,var(--cide-theme-primary-color) 30%,var(--cide-theme-dark-color))}:root[data-theme=dark] .user-avatar,:root.dark-mode .user-avatar{border-color:var(--cide-theme-border-color);background-color:var(--cide-theme-hover-bg-color)}:root[data-theme=dark] .user-status,:root.dark-mode .user-status{border-color:var(--cide-theme-border-color)}:root[data-theme=dark] .user-menu,:root.dark-mode .user-menu{background-color:var(--cide-theme-sidebar-color);border-color:var(--cide-theme-border-color)}:root[data-theme=dark] .user-menu a,:root.dark-mode .user-menu a{color:var(--cide-theme-text-color)}:root[data-theme=dark] .user-menu a:hover,:root.dark-mode .user-menu a:hover{background-color:var(--cide-theme-hover-bg-color)}.section-header{transition:all .2s ease;border:1px solid transparent}.section-header:hover{background-color:#f8fafc!important;border-color:#e2e8f0}.section-header:focus{outline:none;box-shadow:0 0 0 2px #3b82f6;border-color:#3b82f6}.section-content{overflow:hidden;transition:all .3s ease}.section-header .tw-rotate-90{transform:rotate(90deg)}.section-content .tw-border-l{border-left-color:#d1d5db}.section-header:hover .tw-text-gray-500{color:#6b7280}.section-header:hover .tw-text-gray-800{color:#374151}\n"], dependencies: [{ kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { 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", "step", "size"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: CideEleResizerDirective, selector: "[cideEleResizer]", inputs: ["direction", "to", "prevElementSelector", "nextElementSelector", "parentElementSelector", "minPrevSize", "minNextSize", "usePercentage"], outputs: ["resizeStart", "resizing", "resizeEnd"] }, { kind: "directive", type: TooltipDirective, selector: "[cideEleTooltip]", inputs: ["cideEleTooltip", "tooltipColor", "tooltipBg", "tooltipPlacement", "tooltipType", "tooltipDelay", "tooltipDir", "tooltipShowArrow", "tooltipMultiline", "tooltipMaxWidth", "tooltipInteractive", "tooltipClass"] }, { kind: "component", type: CideSpinnerComponent, selector: "cide-ele-spinner", inputs: ["size", "type"] }], animations: [
|
|
4209
4235
|
trigger('slideInOut', [
|
|
4210
4236
|
state('in', style({
|
|
4211
4237
|
opacity: 1,
|
|
@@ -4241,7 +4267,7 @@ class CideLytSidebarWrapperComponent {
|
|
|
4241
4267
|
])
|
|
4242
4268
|
], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4243
4269
|
}
|
|
4244
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
4270
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytSidebarWrapperComponent, decorators: [{
|
|
4245
4271
|
type: Component,
|
|
4246
4272
|
args: [{ selector: 'cide-lyt-sidebar-wrapper', imports: [CideIconComponent, CideInputComponent, CommonModule, CideEleResizerDirective, TooltipDirective, CideSpinnerComponent], changeDetection: ChangeDetectionStrategy.OnPush, animations: [
|
|
4247
4273
|
trigger('slideInOut', [
|
|
@@ -4548,10 +4574,10 @@ class TabStateService {
|
|
|
4548
4574
|
const nextIndex = removedIndex === tabIds.length - 1 ? removedIndex - 1 : removedIndex + 1;
|
|
4549
4575
|
return tabIds[nextIndex];
|
|
4550
4576
|
}
|
|
4551
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
4552
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
4577
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TabStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
4578
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TabStateService, providedIn: 'root' });
|
|
4553
4579
|
}
|
|
4554
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
4580
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TabStateService, decorators: [{
|
|
4555
4581
|
type: Injectable,
|
|
4556
4582
|
args: [{
|
|
4557
4583
|
providedIn: 'root',
|
|
@@ -4885,10 +4911,10 @@ class CideLytRequestService {
|
|
|
4885
4911
|
}
|
|
4886
4912
|
return { count: 0, routes: [] };
|
|
4887
4913
|
}
|
|
4888
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
4889
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
4914
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytRequestService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
4915
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytRequestService, providedIn: 'root' });
|
|
4890
4916
|
}
|
|
4891
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
4917
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytRequestService, decorators: [{
|
|
4892
4918
|
type: Injectable,
|
|
4893
4919
|
args: [{
|
|
4894
4920
|
providedIn: 'root'
|
|
@@ -4978,8 +5004,8 @@ class CideLytSidedrawerWrapperComponent {
|
|
|
4978
5004
|
}
|
|
4979
5005
|
ngOnInit() {
|
|
4980
5006
|
// Initialize the component map (You'd likely populate this from a config or service)
|
|
4981
|
-
this.componentMap['drowar_notes'] = () => import('./cloud-ide-layout-sidedrawer-notes.component-
|
|
4982
|
-
this.componentMap['drawer_theme'] = () => import('./cloud-ide-layout-drawer-theme.component-
|
|
5007
|
+
this.componentMap['drowar_notes'] = () => import('./cloud-ide-layout-sidedrawer-notes.component-BKzulMu8.mjs').then(m => m.CideLytSidedrawerNotesComponent);
|
|
5008
|
+
this.componentMap['drawer_theme'] = () => import('./cloud-ide-layout-drawer-theme.component-DKtGyOSb.mjs').then(m => m.CideLytDrawerThemeComponent);
|
|
4983
5009
|
}
|
|
4984
5010
|
async loadComponent(configFor) {
|
|
4985
5011
|
console.log('🔍 SIDEDRAWER - Loading component:', configFor, 'Current tab:', this.currentTabId);
|
|
@@ -5124,10 +5150,10 @@ class CideLytSidedrawerWrapperComponent {
|
|
|
5124
5150
|
this.saveSidedrawerState(item.configFor);
|
|
5125
5151
|
}
|
|
5126
5152
|
}
|
|
5127
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
5128
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.
|
|
5153
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytSidedrawerWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5154
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: CideLytSidedrawerWrapperComponent, isStandalone: true, selector: "cide-lyt-sidedrawer-wrapper", viewQueries: [{ propertyName: "notesContainer", first: true, predicate: ["notesContainer"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<nav *ngIf=\"shouldShowSidedrawer()\" \r\n [ngClass]=\"{'expanded tw-min-w-[var(--cide-lyt-sidedrawer-wrapper-width-expanded-min)]': isExpanded, 'tw-w-[var(--cide-lyt-sidedrawer-wrapper-width)]': !isExpanded}\"\r\n id=\"cide-lyt-sidedrawer-wrapper\" class=\"tw-flex tw-relative tw-flex-col tw-items-center tw-justify-between tw-h-full tw-bg-white tw-shadow-lg tw-border-l tw-border-gray-200\">\r\n <!-- Resizer Divider -->\r\n <div parentElementSelector=\"#cide-lyt-outlet-sidedrawer-wrapper\"\r\n [minNextSize]=\"sidedrawerSetupData.cide_lyt_sidedrawer_width\" prevElementSelector=\"#cide-lyt-outlet-wrapper\"\r\n nextElementSelector=\"#cide-lyt-sidedrawer-wrapper\" cideEleResizer direction=\"horizontal\" to=\"right-to-left\">\r\n <div class=\"cide-lyt-devider-track tw-w-full tw-h-full\"></div>\r\n </div>\r\n <!-- Main Icon Area -->\r\n <div class=\"tw-flex tw-justify-between tw-h-full tw-w-full\">\r\n <div class=\"tw-w-8 tw-h-full tw-border-r tw-border-gray-200\">\r\n <div class=\"sidedrawer-icon tw-flex tw-flex-col tw-items-center tw-gap-2\">\r\n <ng-container *ngIf=\"drawerItems() as items; else loading\">\r\n <div *ngFor=\"let item of items\" [title]=\"item.title\">\r\n <button (click)=\"onItemClick(item)\"\r\n class=\"tw-p-0 tw-rounded-md hover:tw-bg-gray-100 focus:tw-outline-none focus:tw-ring-2 focus:tw-ring-blue-500\"\r\n [ngClass]=\"{'tw-bg-blue-100 tw-text-blue-700': sidedrawerService.activeComponent() === item.configFor}\">\r\n <cide-ele-icon [cideEleTooltip]=\"item.title\" tooltipPlacement=\"left\" width=\"1.3rem\" height=\"1.5rem\" type=\"box\">{{item.icon}}</cide-ele-icon>\r\n </button>\r\n </div>\r\n </ng-container>\r\n <ng-template #loading>\r\n <cide-ele-skeleton-loader [width]=\"'2rem'\" [height]=\"'2rem'\" [count]=\"3\"\r\n [circle]=\"true\"></cide-ele-skeleton-loader>\r\n </ng-template>\r\n </div>\r\n </div>\r\n <div class=\"tw-flex-1 cide-lyt-sidedrawer-wrapper-child-holder\">\r\n <div #notesContainer class=\"tw-h-full\">\r\n </div>\r\n </div>\r\n </div>\r\n</nav>", styles: [".cide-lyt-sidebar{display:flex;box-shadow:0 4px 12px var(--sidebar-shadow-color);overflow:hidden;background-color:var(--cide-theme-sidebar-color);--sidebar-tooltip-bg: var(--cide-theme-dark-color);--sidebar-tooltip-color: var(--cide-theme-light-color);--sidebar-shadow-color: var(--cide-theme-shadow-color, rgba(0, 0, 0, .05));transition:width .3s cubic-bezier(.4,0,.2,1);max-height:100%;isolation:isolate;will-change:width;position:relative}cide-ele-icon{color:var(--cide-theme-icon-color, var(--tw-gray-500));transition:all .2s ease}cide-ele-icon:hover{color:var(--cide-theme-icon-hover-color, var(--tw-gray-700));transform:scale(1.1)}.dark-mode .cide-lyt-sidebar{background-color:var(--cide-theme-dark-color)}.dark-mode .cide-lyt-devider-track{background-color:color-mix(in srgb,var(--cide-theme-dark-color) 70%,var(--cide-theme-black, #000));border-left-color:var(--cide-theme-dark-color)}.dark-mode .cide-lyt-devider-track:hover{background-color:color-mix(in srgb,var(--cide-theme-color-brand-primary) 20%,var(--cide-theme-dark-color))}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.tw-text-gray-500{color:var(--cide-theme-icon-color)}.hover\\:tw-text-gray-700:hover{color:var(--cide-theme-icon-hover-color)}.tw-text-gray-700{color:var(--cide-theme-text-color)}.tw-text-red-500,.tw-text-red-600,.tw-text-red-700{color:var(--cide-theme-error-color)}.tw-bg-gray-200{background-color:var(--cide-theme-border-color)}.hover\\:tw-bg-gray-100:hover{background-color:var(--cide-theme-hover-bg-color)}.tw-bg-white{background-color:var(--cide-theme-sidebar-color)}.tw-bg-green-500{background-color:var(--cide-theme-success-color)}.tw-border-gray-100,.tw-divide-gray-100{border-color:var(--cide-theme-border-color)}.tw-shadow-lg{box-shadow:0 10px 15px -3px var(--cide-theme-shadow-color),0 4px 6px -2px var(--cide-theme-shadow-color)}.tw-shadow-sm,.hover\\:tw-shadow:hover{box-shadow:0 1px 2px 0 var(--cide-theme-shadow-color)}.sidedrawer-icon{margin:.25rem 0}.cide-lyt-sidedrawer-wrapper-child-holder{display:grid;height:100%;width:100%;overflow:auto;-webkit-overflow-scrolling:touch}#cide-lyt-sidedrawer-wrapper{display:flex;flex-direction:column;align-items:center;justify-content:space-between;height:100%;background-color:#fff;box-shadow:-2px 0 8px #0000000d;border-left:1px solid #e5e7eb;transition:width .3s cubic-bezier(.4,0,.2,1);overflow:hidden;position:relative}.sidedrawer-icon{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:.5rem 0;width:100%}.sidedrawer-icon button{min-width:44px;min-height:44px;touch-action:manipulation}@media screen and (max-width: 768px){#cide-lyt-sidedrawer-wrapper{position:fixed;top:0;right:0;bottom:0;width:0;min-width:0;z-index:45;transform:translate(100%);transition:transform .3s cubic-bezier(.4,0,.2,1),width .3s cubic-bezier(.4,0,.2,1);box-shadow:-4px 0 16px #00000026}#cide-lyt-sidedrawer-wrapper.mobile-open,#cide-lyt-sidedrawer-wrapper.expanded{width:280px;min-width:280px;max-width:85vw;transform:translate(0)}.sidedrawer-overlay{position:fixed;inset:0;background-color:#0006;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .3s ease;z-index:40}.sidedrawer-overlay.active{opacity:1;pointer-events:auto}.sidedrawer-icon{gap:.375rem;padding:.375rem 0}.sidedrawer-icon button{width:48px;height:48px;min-width:48px;min-height:48px;padding:.5rem}.cide-lyt-sidedrawer-wrapper-child-holder{padding:.5rem;font-size:.875rem}.cide-lyt-devider-track{display:none}}@media screen and (max-width: 480px){#cide-lyt-sidedrawer-wrapper.mobile-open,#cide-lyt-sidedrawer-wrapper.expanded{width:260px;min-width:260px;max-width:90vw}.sidedrawer-icon{gap:.25rem;padding:.25rem 0}.sidedrawer-icon button{width:44px;height:44px;min-width:44px;min-height:44px}.cide-lyt-sidedrawer-wrapper-child-holder{padding:.375rem;font-size:.8125rem}}@media screen and (min-width: 769px) and (max-width: 1024px){#cide-lyt-sidedrawer-wrapper{min-width:250px}.sidedrawer-icon{gap:.5rem}.sidedrawer-icon button{width:40px;height:40px;min-width:40px;min-height:40px}}@media screen and (max-width: 768px) and (orientation: landscape){#cide-lyt-sidedrawer-wrapper.mobile-open,#cide-lyt-sidedrawer-wrapper.expanded{width:300px;max-width:70vw}.sidedrawer-icon{gap:.25rem;padding:.25rem 0}}@media (hover: none) and (pointer: coarse){.sidedrawer-icon button{min-width:48px;min-height:48px}cide-ele-icon:hover{transform:none}.sidedrawer-icon button:active{transform:scale(.95);background-color:#3b82f61a}}.cide-lyt-sidedrawer-wrapper-child-holder::-webkit-scrollbar{width:6px}.cide-lyt-sidedrawer-wrapper-child-holder::-webkit-scrollbar-track{background:transparent}.cide-lyt-sidedrawer-wrapper-child-holder::-webkit-scrollbar-thumb{background-color:#d1d5db;border-radius:3px}.cide-lyt-sidedrawer-wrapper-child-holder::-webkit-scrollbar-thumb:hover{background-color:#9ca3af}:root[data-theme=dark] .cide-lyt-sidedrawer-wrapper-child-holder::-webkit-scrollbar-thumb,:root.dark-mode .cide-lyt-sidedrawer-wrapper-child-holder::-webkit-scrollbar-thumb{background-color:#4b5563}:root[data-theme=dark] .cide-lyt-sidedrawer-wrapper-child-holder::-webkit-scrollbar-thumb:hover,:root.dark-mode .cide-lyt-sidedrawer-wrapper-child-holder::-webkit-scrollbar-thumb:hover{background-color:#6b7280}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "directive", type: CideEleResizerDirective, selector: "[cideEleResizer]", inputs: ["direction", "to", "prevElementSelector", "nextElementSelector", "parentElementSelector", "minPrevSize", "minNextSize", "usePercentage"], outputs: ["resizeStart", "resizing", "resizeEnd"] }, { kind: "component", type: CideEleSkeletonLoaderComponent, selector: "cide-ele-skeleton-loader", inputs: ["width", "height", "borderRadius", "count", "circle", "animation"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: TooltipDirective, selector: "[cideEleTooltip]", inputs: ["cideEleTooltip", "tooltipColor", "tooltipBg", "tooltipPlacement", "tooltipType", "tooltipDelay", "tooltipDir", "tooltipShowArrow", "tooltipMultiline", "tooltipMaxWidth", "tooltipInteractive", "tooltipClass"] }] });
|
|
5129
5155
|
}
|
|
5130
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
5156
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytSidedrawerWrapperComponent, decorators: [{
|
|
5131
5157
|
type: Component,
|
|
5132
5158
|
args: [{ selector: 'cide-lyt-sidedrawer-wrapper', standalone: true, imports: [
|
|
5133
5159
|
NgClass,
|
|
@@ -5306,8 +5332,8 @@ class ShortcutsPanelComponent {
|
|
|
5306
5332
|
onSearchChange() {
|
|
5307
5333
|
// Computed signal will automatically update
|
|
5308
5334
|
}
|
|
5309
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
5310
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.
|
|
5335
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ShortcutsPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5336
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: ShortcutsPanelComponent, isStandalone: true, selector: "cide-lyt-shortcuts-panel", ngImport: i0, template: `
|
|
5311
5337
|
<div class="tw-p-6 tw-space-y-4 tw-bg-white dark:tw-bg-gray-900">
|
|
5312
5338
|
<!-- View Toggle and Refresh -->
|
|
5313
5339
|
<div class="tw-flex tw-items-center tw-justify-end tw-gap-2 tw-mb-4">
|
|
@@ -5443,7 +5469,7 @@ class ShortcutsPanelComponent {
|
|
|
5443
5469
|
</div>
|
|
5444
5470
|
`, isInline: true, styles: [":host{display:block}kbd{font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace;font-size:.75rem;line-height:1.5}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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"] }] });
|
|
5445
5471
|
}
|
|
5446
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
5472
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ShortcutsPanelComponent, decorators: [{
|
|
5447
5473
|
type: Component,
|
|
5448
5474
|
args: [{ selector: 'cide-lyt-shortcuts-panel', standalone: true, imports: [CommonModule, FormsModule, CideIconComponent, CideEleButtonComponent], template: `
|
|
5449
5475
|
<div class="tw-p-6 tw-space-y-4 tw-bg-white dark:tw-bg-gray-900">
|
|
@@ -5640,8 +5666,8 @@ class SettingsContainerComponent {
|
|
|
5640
5666
|
selectSection(sectionId) {
|
|
5641
5667
|
this.selectedSection.set(sectionId);
|
|
5642
5668
|
}
|
|
5643
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
5644
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.
|
|
5669
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: SettingsContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5670
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: SettingsContainerComponent, isStandalone: true, selector: "cide-lyt-settings-container", ngImport: i0, template: `
|
|
5645
5671
|
<div class="tw-flex tw-h-full tw-bg-white dark:tw-bg-gray-900 tw-text-gray-900 dark:tw-text-gray-100">
|
|
5646
5672
|
<!-- Left Sidebar Navigation -->
|
|
5647
5673
|
<div class="tw-w-64 tw-border-r tw-border-gray-200 dark:tw-border-gray-700 tw-bg-gray-50 dark:tw-bg-gray-800 tw-flex tw-flex-col">
|
|
@@ -5728,7 +5754,7 @@ class SettingsContainerComponent {
|
|
|
5728
5754
|
</div>
|
|
5729
5755
|
`, isInline: true, styles: [":host{display:block;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: NotificationSettingsComponent, selector: "cide-lyt-notification-settings" }, { kind: "component", type: ShortcutsPanelComponent, selector: "cide-lyt-shortcuts-panel" }] });
|
|
5730
5756
|
}
|
|
5731
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
5757
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: SettingsContainerComponent, decorators: [{
|
|
5732
5758
|
type: Component,
|
|
5733
5759
|
args: [{ selector: 'cide-lyt-settings-container', standalone: true, imports: [
|
|
5734
5760
|
CommonModule,
|
|
@@ -5865,19 +5891,19 @@ class CideLytFooterWrapperComponent {
|
|
|
5865
5891
|
});
|
|
5866
5892
|
this.floatingContainerService.bringToFront(containerId);
|
|
5867
5893
|
}
|
|
5868
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
5869
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.
|
|
5894
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytFooterWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5895
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: CideLytFooterWrapperComponent, isStandalone: true, selector: "cide-lyt-footer-wrapper", ngImport: i0, template: "<div\n class=\"cide-footer tw-w-full tw-justify-between tw-flex tw-h-5 tw-select-none tw-px-1\">\n <!-- Resizer -->\n <div parentElementSelector=\"#cide-lyt-layout-wrapper\" prevElementSelector=\"#cide-lyt-sidebar-page-wrapper\"\n nextElementSelector=\"#cide-lyt-footer-console-wrapper\" [minNextSize]=\"footerSetupData.cide_lyt_footer_height\" cideEleResizer direction=\"vertical\">\n <div class=\"cide-lyt-devider-track tw-w-full tw-h-full\"></div>\n </div>\n <div></div>\n <div class=\"tw-flex tw-items-center tw-gap-1.5\">\n <cide-ele-icon \n size=\"3xs\" \n class=\"tw-mt-0.5 tw-cursor-pointer tw-text-gray-500 dark:tw-text-gray-400 hover:tw-text-blue-600 dark:hover:tw-text-blue-400 tw-transition-colors\" \n type=\"none\"\n (click)=\"openSettingsPanel()\"\n title=\"Settings\">\n settings\n </cide-ele-icon>\n <cide-ele-icon size=\"3xs\" class=\"tw-mt-0.5\" type=\"none\">contact_support</cide-ele-icon>\n </div>\n</div>", styles: [".cide-footer{display:flex;align-items:center;justify-content:space-between;width:100%;height:20px;min-height:20px;padding:0 .5rem;background-color:var(--code-lyt-footer-wrapper-background-color, #f9fafb);border-top:1px solid var(--code-lyt-footer-wrapper-border-color, #e5e7eb);-webkit-user-select:none;user-select:none;flex-shrink:0;box-sizing:border-box}.cide-lyt-devider-track{width:100%;height:100%;background-color:transparent;cursor:row-resize;transition:background-color .2s ease}.cide-lyt-devider-track:hover{background-color:#3b82f61a}.cide-footer>div:last-child{display:flex;align-items:center;gap:.75rem;flex-shrink:0}.cide-footer cide-ele-icon{transition:all .2s ease;cursor:pointer}.cide-footer cide-ele-icon:hover{transform:scale(1.1)}@media screen and (max-width: 768px){.cide-footer{height:24px;min-height:24px;padding:0 .5rem;font-size:.75rem}.cide-footer cide-ele-icon{font-size:.875rem}.cide-footer>div:last-child{gap:.5rem}.cide-footer .cide-lyt-devider-track{display:none}}@media screen and (max-width: 480px){.cide-footer{height:22px;min-height:22px;padding:0 .375rem}.cide-footer cide-ele-icon{font-size:.75rem}.cide-footer>div:last-child{gap:.375rem}}@media screen and (min-width: 769px) and (max-width: 1024px){.cide-footer{padding:0 .75rem}}:root[data-theme=dark] .cide-footer,:root.dark-mode .cide-footer{background-color:var(--code-lyt-footer-wrapper-background-color, #1f2937);border-top-color:var(--code-lyt-footer-wrapper-border-color, #374151)}:root[data-theme=dark] .cide-footer cide-ele-icon,:root.dark-mode .cide-footer cide-ele-icon{color:var(--cide-theme-icon-color, #9ca3af)}:root[data-theme=dark] .cide-footer cide-ele-icon:hover,:root.dark-mode .cide-footer cide-ele-icon:hover{color:var(--cide-theme-color-brand-primary, #60a5fa)}@media screen and (max-width: 768px) and (orientation: landscape){.cide-footer{height:20px;min-height:20px}}\n"], dependencies: [{ kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "directive", type: CideEleResizerDirective, selector: "[cideEleResizer]", inputs: ["direction", "to", "prevElementSelector", "nextElementSelector", "parentElementSelector", "minPrevSize", "minNextSize", "usePercentage"], outputs: ["resizeStart", "resizing", "resizeEnd"] }] });
|
|
5870
5896
|
}
|
|
5871
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
5897
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytFooterWrapperComponent, decorators: [{
|
|
5872
5898
|
type: Component,
|
|
5873
5899
|
args: [{ selector: 'cide-lyt-footer-wrapper', standalone: true, imports: [CideIconComponent, CideEleResizerDirective], template: "<div\n class=\"cide-footer tw-w-full tw-justify-between tw-flex tw-h-5 tw-select-none tw-px-1\">\n <!-- Resizer -->\n <div parentElementSelector=\"#cide-lyt-layout-wrapper\" prevElementSelector=\"#cide-lyt-sidebar-page-wrapper\"\n nextElementSelector=\"#cide-lyt-footer-console-wrapper\" [minNextSize]=\"footerSetupData.cide_lyt_footer_height\" cideEleResizer direction=\"vertical\">\n <div class=\"cide-lyt-devider-track tw-w-full tw-h-full\"></div>\n </div>\n <div></div>\n <div class=\"tw-flex tw-items-center tw-gap-1.5\">\n <cide-ele-icon \n size=\"3xs\" \n class=\"tw-mt-0.5 tw-cursor-pointer tw-text-gray-500 dark:tw-text-gray-400 hover:tw-text-blue-600 dark:hover:tw-text-blue-400 tw-transition-colors\" \n type=\"none\"\n (click)=\"openSettingsPanel()\"\n title=\"Settings\">\n settings\n </cide-ele-icon>\n <cide-ele-icon size=\"3xs\" class=\"tw-mt-0.5\" type=\"none\">contact_support</cide-ele-icon>\n </div>\n</div>", styles: [".cide-footer{display:flex;align-items:center;justify-content:space-between;width:100%;height:20px;min-height:20px;padding:0 .5rem;background-color:var(--code-lyt-footer-wrapper-background-color, #f9fafb);border-top:1px solid var(--code-lyt-footer-wrapper-border-color, #e5e7eb);-webkit-user-select:none;user-select:none;flex-shrink:0;box-sizing:border-box}.cide-lyt-devider-track{width:100%;height:100%;background-color:transparent;cursor:row-resize;transition:background-color .2s ease}.cide-lyt-devider-track:hover{background-color:#3b82f61a}.cide-footer>div:last-child{display:flex;align-items:center;gap:.75rem;flex-shrink:0}.cide-footer cide-ele-icon{transition:all .2s ease;cursor:pointer}.cide-footer cide-ele-icon:hover{transform:scale(1.1)}@media screen and (max-width: 768px){.cide-footer{height:24px;min-height:24px;padding:0 .5rem;font-size:.75rem}.cide-footer cide-ele-icon{font-size:.875rem}.cide-footer>div:last-child{gap:.5rem}.cide-footer .cide-lyt-devider-track{display:none}}@media screen and (max-width: 480px){.cide-footer{height:22px;min-height:22px;padding:0 .375rem}.cide-footer cide-ele-icon{font-size:.75rem}.cide-footer>div:last-child{gap:.375rem}}@media screen and (min-width: 769px) and (max-width: 1024px){.cide-footer{padding:0 .75rem}}:root[data-theme=dark] .cide-footer,:root.dark-mode .cide-footer{background-color:var(--code-lyt-footer-wrapper-background-color, #1f2937);border-top-color:var(--code-lyt-footer-wrapper-border-color, #374151)}:root[data-theme=dark] .cide-footer cide-ele-icon,:root.dark-mode .cide-footer cide-ele-icon{color:var(--cide-theme-icon-color, #9ca3af)}:root[data-theme=dark] .cide-footer cide-ele-icon:hover,:root.dark-mode .cide-footer cide-ele-icon:hover{color:var(--cide-theme-color-brand-primary, #60a5fa)}@media screen and (max-width: 768px) and (orientation: landscape){.cide-footer{height:20px;min-height:20px}}\n"] }]
|
|
5874
5900
|
}], ctorParameters: () => [] });
|
|
5875
5901
|
|
|
5876
5902
|
class CideLytConsoleWrapperComponent {
|
|
5877
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
5878
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.
|
|
5903
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytConsoleWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5904
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: CideLytConsoleWrapperComponent, isStandalone: true, selector: "cide-lyt-console-wrapper", ngImport: i0, template: "<div id=\"cide-lyt-console-wrapper\" class=\"cide-lyt-console tw-w-full tw-absolute tw-items-center tw-bg-gray-50 tw-h-0 tw-border-b-gray-200 tw-border-solid tw-border-t tw-select-none tw-z-[100] tw-bottom-0 tw-px-3\">\r\n\r\n</div>\r\n<!-- h-6 -->", styles: ["#cide-lyt-console-wrapper{position:absolute;bottom:0;left:0;right:0;width:100%;height:0;min-height:0;background-color:#f9fafb;border-top:1px solid #e5e7eb;display:flex;align-items:center;padding:0 .75rem;z-index:100;-webkit-user-select:none;user-select:none;transition:height .3s cubic-bezier(.4,0,.2,1);overflow:hidden;box-sizing:border-box}.cide-lyt-console-wrapper-hide{display:none!important}@media screen and (max-width: 768px){#cide-lyt-console-wrapper{padding:.5rem;font-size:.75rem;border-top-width:1px}#cide-lyt-console-wrapper:not(.cide-lyt-console-wrapper-hide){min-height:36px;max-height:40vh}#cide-lyt-footer-console-wrapper{flex-direction:column}}@media screen and (max-width: 480px){#cide-lyt-console-wrapper{padding:.375rem;font-size:.7rem}#cide-lyt-console-wrapper:not(.cide-lyt-console-wrapper-hide){min-height:32px;max-height:35vh}}@media screen and (min-width: 769px) and (max-width: 1024px){#cide-lyt-console-wrapper{padding:.625rem}#cide-lyt-console-wrapper:not(.cide-lyt-console-wrapper-hide){max-height:45vh}}:root[data-theme=dark] #cide-lyt-console-wrapper,:root.dark-mode #cide-lyt-console-wrapper{background-color:#1f2937;border-top-color:#374151;color:#e5e7eb}@media screen and (max-width: 768px) and (orientation: landscape){#cide-lyt-console-wrapper:not(.cide-lyt-console-wrapper-hide){max-height:30vh}}#cide-lyt-console-wrapper::-webkit-scrollbar{width:6px;height:6px}#cide-lyt-console-wrapper::-webkit-scrollbar-track{background:transparent}#cide-lyt-console-wrapper::-webkit-scrollbar-thumb{background-color:#d1d5db;border-radius:3px}#cide-lyt-console-wrapper::-webkit-scrollbar-thumb:hover{background-color:#9ca3af}:root[data-theme=dark] #cide-lyt-console-wrapper::-webkit-scrollbar-thumb,:root.dark-mode #cide-lyt-console-wrapper::-webkit-scrollbar-thumb{background-color:#4b5563}:root[data-theme=dark] #cide-lyt-console-wrapper::-webkit-scrollbar-thumb:hover,:root.dark-mode #cide-lyt-console-wrapper::-webkit-scrollbar-thumb:hover{background-color:#6b7280}\n"] });
|
|
5879
5905
|
}
|
|
5880
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
5906
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytConsoleWrapperComponent, decorators: [{
|
|
5881
5907
|
type: Component,
|
|
5882
5908
|
args: [{ selector: 'cide-lyt-console-wrapper', standalone: true, imports: [], template: "<div id=\"cide-lyt-console-wrapper\" class=\"cide-lyt-console tw-w-full tw-absolute tw-items-center tw-bg-gray-50 tw-h-0 tw-border-b-gray-200 tw-border-solid tw-border-t tw-select-none tw-z-[100] tw-bottom-0 tw-px-3\">\r\n\r\n</div>\r\n<!-- h-6 -->", styles: ["#cide-lyt-console-wrapper{position:absolute;bottom:0;left:0;right:0;width:100%;height:0;min-height:0;background-color:#f9fafb;border-top:1px solid #e5e7eb;display:flex;align-items:center;padding:0 .75rem;z-index:100;-webkit-user-select:none;user-select:none;transition:height .3s cubic-bezier(.4,0,.2,1);overflow:hidden;box-sizing:border-box}.cide-lyt-console-wrapper-hide{display:none!important}@media screen and (max-width: 768px){#cide-lyt-console-wrapper{padding:.5rem;font-size:.75rem;border-top-width:1px}#cide-lyt-console-wrapper:not(.cide-lyt-console-wrapper-hide){min-height:36px;max-height:40vh}#cide-lyt-footer-console-wrapper{flex-direction:column}}@media screen and (max-width: 480px){#cide-lyt-console-wrapper{padding:.375rem;font-size:.7rem}#cide-lyt-console-wrapper:not(.cide-lyt-console-wrapper-hide){min-height:32px;max-height:35vh}}@media screen and (min-width: 769px) and (max-width: 1024px){#cide-lyt-console-wrapper{padding:.625rem}#cide-lyt-console-wrapper:not(.cide-lyt-console-wrapper-hide){max-height:45vh}}:root[data-theme=dark] #cide-lyt-console-wrapper,:root.dark-mode #cide-lyt-console-wrapper{background-color:#1f2937;border-top-color:#374151;color:#e5e7eb}@media screen and (max-width: 768px) and (orientation: landscape){#cide-lyt-console-wrapper:not(.cide-lyt-console-wrapper-hide){max-height:30vh}}#cide-lyt-console-wrapper::-webkit-scrollbar{width:6px;height:6px}#cide-lyt-console-wrapper::-webkit-scrollbar-track{background:transparent}#cide-lyt-console-wrapper::-webkit-scrollbar-thumb{background-color:#d1d5db;border-radius:3px}#cide-lyt-console-wrapper::-webkit-scrollbar-thumb:hover{background-color:#9ca3af}:root[data-theme=dark] #cide-lyt-console-wrapper::-webkit-scrollbar-thumb,:root.dark-mode #cide-lyt-console-wrapper::-webkit-scrollbar-thumb{background-color:#4b5563}:root[data-theme=dark] #cide-lyt-console-wrapper::-webkit-scrollbar-thumb:hover,:root.dark-mode #cide-lyt-console-wrapper::-webkit-scrollbar-thumb:hover{background-color:#6b7280}\n"] }]
|
|
5883
5909
|
}] });
|
|
@@ -5924,10 +5950,10 @@ class CideLytRequestWrapperComponent {
|
|
|
5924
5950
|
}, 400); // Match the animation duration
|
|
5925
5951
|
}
|
|
5926
5952
|
}
|
|
5927
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
5928
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: CideLytRequestWrapperComponent, isStandalone: true, selector: "cide-lyt-request-wrapper", viewQueries: [{ propertyName: "requestItemElements", predicate: ["requestItemEl"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"requestItems() as requestItems\">\r\n <div id=\"cide-lyt-request-wrapper\" class=\"cide-lyt-request tw-w-[inherit]\" [class.cide-lyt-request-wrapper-hide]=\"!requestItems.length\">\r\n <div class=\"request-content\">\r\n <ng-container *ngFor=\"let item of requestItems; let i = index\">\r\n <div #requestItemEl class=\"request-item\" (keydown.enter)=\"requestService.activateTab(item.id); applyFlickerEffect($event)\"\r\n [class.active]=\"item.active\" tabindex=\"0\" (click)=\"requestService.activateTab(item.id); applyFlickerEffect($event)\"\r\n [attr.data-tooltip]=\"item.title\">\r\n <span class=\"request-title\">{{ item.title }}</span>\r\n <button class=\"request-action close-action\" \r\n (click)=\"requestService.closeTab(item.id); $event.stopPropagation();\"\r\n (keydown.enter)=\"requestService.closeTab(item.id); $event.stopPropagation();\" \r\n tabindex=\"0\"\r\n data-tooltip=\"Close this tab\">\r\n <cide-ele-icon size=\"3xs\">close</cide-ele-icon>\r\n </button>\r\n </div>\r\n <!-- Only add divider between items -->\r\n <div class=\"request-divider\" *ngIf=\"i < requestItems.length - 1\"></div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n</ng-container>", styles: [".cide-lyt-request{height:20px;background:linear-gradient(to right,#fff,#f9fafbf2);border-bottom:1px solid rgba(229,231,235,.8);box-shadow:0 2px 6px #0000000d,0 1px 1px #00000008;display:flex;align-items:center;padding:0 .5rem;position:relative;z-index:15;transition:all .2s cubic-bezier(.4,0,.2,1);will-change:transform;-webkit-user-select:none;user-select:none;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);width:100%;max-width:100%;overflow:hidden;box-sizing:border-box}.request-content{display:flex;align-items:center;height:100%;width:100%;max-width:100%;position:relative;overflow-x:auto;overflow-y:hidden;min-width:0;flex-shrink:1;scrollbar-width:thin;scrollbar-color:var(--cide-ele-scrollbar-thumb, #d1d5db) var(--cide-ele-scrollbar-track, transparent);box-sizing:border-box}.request-content::-webkit-scrollbar{height:4px}.request-content::-webkit-scrollbar-track{background:var(--cide-ele-scrollbar-track, transparent)}.request-content::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb, #d1d5db);border-radius:2px;opacity:.7}.request-content::-webkit-scrollbar-thumb:hover{background-color:var(--cide-ele-scrollbar-thumb-hover, #9ca3af);opacity:1}.request-item{position:relative;padding:8px 12px;margin:0 4px;border-radius:.375rem;display:flex;align-items:center;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);overflow:hidden;background-color:#fff9;box-shadow:0 1px 2px #00000005;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(229,231,235,.4);flex-shrink:0;white-space:nowrap;min-width:fit-content}.request-item:hover{background-color:#ffffffe6;transform:translateY(-1px);box-shadow:0 2px 5px #0000000d;border-color:#d1d5db99}.request-item:active{transform:translateY(0);box-shadow:0 1px 2px #00000008}.request-item.active{background:#eff6ffcc;border-color:#3b82f64d;box-shadow:0 2px 6px #3b82f61a,0 0 0 1px #3b82f626;position:relative}@keyframes shimmerGradient{0%{background-position:100% 50%}to{background-position:0% 50%}}.request-title{font-size:.875rem;color:#374151;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .2s ease}.request-item.active .request-title{color:#2563eb;font-weight:500;text-shadow:0 0 1px rgba(37,99,235,.1)}.request-action,.request-add-action{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background-color:transparent;transition:all .2s ease}.request-action:hover,.request-add-action:hover{background-color:#f3f4f6cc;transform:scale(1.1)}.request-action:active,.request-add-action:active{transform:scale(.95)}:host-context(.dark-mode) .cide-lyt-request{background:linear-gradient(to right,#0f172a,#0f172af2);border-bottom-color:#1e293be6;box-shadow:0 2px 6px #00000026,0 1px 1px #0000001a}:host-context(.dark-mode) .request-item{background-color:#1e293b99;border-color:#33415566;box-shadow:0 1px 2px #0000001a}:host-context(.dark-mode) .request-item:hover{background-color:#1e293bcc;border-color:#47556999;box-shadow:0 2px 5px #00000026}:host-context(.dark-mode) .request-title{color:#e2e8f0}:host-context(.dark-mode) .request-item:hover .request-title{color:#f8fafc}:host-context(.dark-mode) .request-item.active{background:#1e3a8a4d;border-color:#3b82f666;box-shadow:0 2px 6px #1e40af40,0 0 0 1px #3b82f633}:host-context(.dark-mode) .request-item.active .request-title{color:#60a5fa;text-shadow:0 0 2px rgba(96,165,250,.2)}:host-context(.dark-mode) .request-action:hover,:host-context(.dark-mode) .request-add-action:hover{background-color:#334155cc}.request-item:hover{transform:translateY(-.5px);box-shadow:0 1px 3px #00000008}.request-item:hover:before{opacity:1}.request-item.active{background:linear-gradient(to right,#eff6ffcc,#dbeafe99);box-shadow:0 1px 3px #3b82f626;transform:translateZ(0)}@keyframes glowEffect{0%{opacity:.6;box-shadow:0 1px 2px #3b82f61a}50%{opacity:1;box-shadow:0 1px 3px #3b82f64d}to{opacity:.6;box-shadow:0 1px 2px #3b82f61a}}.request-title{font-size:.7rem;color:#374151;margin-right:.5rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px;letter-spacing:.01em;transition:all .2s ease;position:relative}.request-item.active .request-title{color:#1e40af;font-weight:600;text-shadow:0 0 .5px rgba(37,99,235,.3);letter-spacing:.015em}.request-action{display:flex;align-items:center;justify-content:center;height:14px;width:14px;border-radius:3px;transition:all .2s ease;cursor:pointer;color:#9ca3af;border:none;background:transparent;padding:0;outline:none;position:relative;overflow:hidden;transform:translateZ(0)}.request-action:hover{background-color:#3b82f614;color:#3b82f6;transform:translateY(-.5px) scale(1.05);box-shadow:0 1px 2px #0000000d}.request-action:active{transform:translateY(.5px) scale(.97);transition:all .1s ease}.request-action:focus-visible{outline:1px solid #3b82f6;outline-offset:1px;box-shadow:0 0 0 2px #3b82f61a}.close-action:hover{background-color:#ef444414;color:#ef4444}.close-action:focus-visible{outline-color:#ef4444;box-shadow:0 0 0 2px #ef44441a}.request-divider{width:1px;height:18px;background:linear-gradient(to bottom,#d1d5db1a,#d1d5db80,#d1d5db1a);margin:0 4px}:host-context(.dark-mode) .request-divider{background:linear-gradient(to bottom,#4755691a,#47556980,#4755691a)}.request-divider:before{content:\"\";position:absolute;top:0;bottom:0;left:-1px;width:3px;background:radial-gradient(ellipse at center,#ffffff80,#fff0 70%);opacity:0;transition:opacity .3s ease}.request-content:hover .request-divider:before{opacity:.7}.request-add-action{display:flex;align-items:center;justify-content:center;height:16px;width:16px;border-radius:3px;transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;color:#6b7280;background-color:transparent;border:none;padding:0;outline:none;position:relative;overflow:hidden}.request-add-action:hover{background-color:#3b82f614;color:#3b82f6;transform:translateY(-.5px) scale(1.05);box-shadow:0 1px 3px #3b82f626}.request-add-action:active{transform:translateY(.5px) scale(.97);transition:all .1s ease}.request-add-action:focus-visible{outline:1px solid #3b82f6;outline-offset:1px;box-shadow:0 0 0 2px #3b82f61a}.request-add-action:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle,#3b82f64d,#3b82f600 70%);opacity:0;transform:scale(0);transition:transform .4s ease,opacity .3s ease}.request-add-action:active:after{opacity:1;transform:scale(3);transition:transform .1s ease,opacity .1s ease}@keyframes subtlePulse{0%{box-shadow:0 0 #3b82f600;transform:scale(1)}50%{box-shadow:0 0 0 3px #3b82f626;transform:scale(1.05)}to{box-shadow:0 0 #3b82f600;transform:scale(1)}}.request-add-action-pulse{animation:subtlePulse 2s cubic-bezier(.4,0,.6,1) infinite}:host-context(.dark-mode) .cide-lyt-request{background:linear-gradient(to right,#111827f2,#1f2937e6);border-bottom:1px solid rgba(55,65,81,.5)}:host-context(.dark-mode) .request-title{color:#e5e7eb}:host-context(.dark-mode) .request-item.active{background:linear-gradient(to right,#1e3a8a26,#2563eb1a)}:host-context(.dark-mode) .request-item.active .request-title{color:#93c5fd}:host-context(.dark-mode) .request-action,:host-context(.dark-mode) .request-add-action{color:#9ca3af}:host-context(.dark-mode) .request-divider{background:linear-gradient(to bottom,#4b55634d,#6b728080,#4b55634d)}@keyframes slideIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}@keyframes slideOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-5px)}}@keyframes flickerEffect{0%{opacity:1;transform:scale(1);box-shadow:0 1px 2px #00000005}25%{opacity:.7;transform:scale(.98);box-shadow:0 2px 8px #3b82f64d}50%{opacity:.9;transform:scale(1.02);box-shadow:0 4px 12px #3b82f666}75%{opacity:.8;transform:scale(.99);box-shadow:0 2px 6px #3b82f633}to{opacity:1;transform:scale(1);box-shadow:0 1px 2px #00000005}}@keyframes flickerEffectDark{0%{opacity:1;transform:scale(1);box-shadow:0 1px 2px #0000001a}25%{opacity:.7;transform:scale(.98);box-shadow:0 2px 8px #60a5fa4d}50%{opacity:.9;transform:scale(1.02);box-shadow:0 4px 12px #60a5fa66}75%{opacity:.8;transform:scale(.99);box-shadow:0 2px 6px #60a5fa33}to{opacity:1;transform:scale(1);box-shadow:0 1px 2px #0000001a}}.request-item-enter{animation:slideIn .2s cubic-bezier(.4,0,.2,1)}.request-item-exit{animation:slideOut .2s cubic-bezier(.4,0,.2,1)}.request-item-flicker{animation:flickerEffect .4s cubic-bezier(.4,0,.2,1)}:host-context(.dark-mode) .request-item-flicker{animation:flickerEffectDark .4s cubic-bezier(.4,0,.2,1)}@media screen and (max-width: 768px){.cide-lyt-request{height:22px;padding:0 .5rem;min-height:22px}.request-item{padding:6px 10px;margin:0 3px;border-radius:.25rem;min-height:20px}.request-title{font-size:.65rem;max-width:100px;margin-right:.375rem}.request-action{width:12px;height:12px;min-width:12px;min-height:12px}.request-divider{height:16px;margin:0 2px}.request-content{-webkit-overflow-scrolling:touch;scrollbar-width:thin;scroll-behavior:smooth}.request-item{min-width:80px;touch-action:manipulation}.request-action,.request-add-action{min-width:28px;min-height:28px;touch-action:manipulation}}@media screen and (max-width: 480px){.cide-lyt-request{height:24px;padding:0 .375rem;min-height:24px}.request-item{padding:5px 8px;margin:0 2px;min-width:70px}.request-title{font-size:.6rem;max-width:80px;margin-right:.25rem}.request-action{width:14px;height:14px}.request-divider{height:14px;margin:0 1px}.request-divider{display:none}}@media screen and (min-width: 769px) and (max-width: 1024px){.cide-lyt-request{height:21px;padding:0 .625rem}.request-item{padding:7px 11px}.request-title{font-size:.7rem;max-width:110px}}@media screen and (max-width: 768px) and (orientation: landscape){.cide-lyt-request{height:20px;min-height:20px}.request-item{padding:5px 9px}.request-title{max-width:90px}}@media (hover: none) and (pointer: coarse){.request-item{min-height:32px;padding:8px 12px}.request-action,.request-add-action{min-width:32px;min-height:32px}.request-item:hover{transform:none}.request-item:active{transform:scale(.98);background-color:#fffffff2}.request-action:active,.request-add-action:active{transform:scale(.95)}}.request-item:focus,.request-action:focus,.request-add-action:focus{outline:none;box-shadow:0 0 0 2px #3b82f64d}:host-context(.dark-mode) .request-item:focus,:host-context(.dark-mode) .request-action:focus,:host-context(.dark-mode) .request-add-action:focus{box-shadow:0 0 0 2px #60a5fa66}.cide-lyt-request:hover{box-shadow:0 3px 8px #00000012,0 1px 2px #0000000d;transform:translateY(-1px)}.request-content:empty .request-add-action{animation:pulseAttention 2s infinite}@keyframes pulseAttention{0%{box-shadow:0 0 #3b82f666;transform:scale(1)}70%{box-shadow:0 0 0 8px #3b82f600;transform:scale(1.05)}to{box-shadow:0 0 #3b82f600;transform:scale(1)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }] });
|
|
5953
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytRequestWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5954
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: CideLytRequestWrapperComponent, isStandalone: true, selector: "cide-lyt-request-wrapper", viewQueries: [{ propertyName: "requestItemElements", predicate: ["requestItemEl"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"requestItems() as requestItems\">\r\n <div id=\"cide-lyt-request-wrapper\" class=\"cide-lyt-request tw-w-[inherit]\" [class.cide-lyt-request-wrapper-hide]=\"!requestItems.length\">\r\n <div class=\"request-content\">\r\n <ng-container *ngFor=\"let item of requestItems; let i = index\">\r\n <div #requestItemEl class=\"request-item\" (keydown.enter)=\"requestService.activateTab(item.id); applyFlickerEffect($event)\"\r\n [class.active]=\"item.active\" tabindex=\"0\" (click)=\"requestService.activateTab(item.id); applyFlickerEffect($event)\"\r\n [attr.data-tooltip]=\"item.title\">\r\n <span class=\"request-title\">{{ item.title }}</span>\r\n <button class=\"request-action close-action\" \r\n (click)=\"requestService.closeTab(item.id); $event.stopPropagation();\"\r\n (keydown.enter)=\"requestService.closeTab(item.id); $event.stopPropagation();\" \r\n tabindex=\"0\"\r\n data-tooltip=\"Close this tab\">\r\n <cide-ele-icon size=\"3xs\">close</cide-ele-icon>\r\n </button>\r\n </div>\r\n <!-- Only add divider between items -->\r\n <div class=\"request-divider\" *ngIf=\"i < requestItems.length - 1\"></div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n</ng-container>", styles: [".cide-lyt-request{height:20px;background:linear-gradient(to right,#fff,#f9fafbf2);border-bottom:1px solid rgba(229,231,235,.8);box-shadow:0 2px 6px #0000000d,0 1px 1px #00000008;display:flex;align-items:center;padding:0 .5rem;position:relative;z-index:15;transition:all .2s cubic-bezier(.4,0,.2,1);will-change:transform;-webkit-user-select:none;user-select:none;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);width:100%;max-width:100%;overflow:hidden;box-sizing:border-box}.request-content{display:flex;align-items:center;height:100%;width:100%;max-width:100%;position:relative;overflow-x:auto;overflow-y:hidden;min-width:0;flex-shrink:1;scrollbar-width:thin;scrollbar-color:var(--cide-ele-scrollbar-thumb, #d1d5db) var(--cide-ele-scrollbar-track, transparent);box-sizing:border-box}.request-content::-webkit-scrollbar{height:4px}.request-content::-webkit-scrollbar-track{background:var(--cide-ele-scrollbar-track, transparent)}.request-content::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb, #d1d5db);border-radius:2px;opacity:.7}.request-content::-webkit-scrollbar-thumb:hover{background-color:var(--cide-ele-scrollbar-thumb-hover, #9ca3af);opacity:1}.request-item{position:relative;padding:8px 12px;margin:0 4px;border-radius:.375rem;display:flex;align-items:center;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);overflow:hidden;background-color:#fff9;box-shadow:0 1px 2px #00000005;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(229,231,235,.4);flex-shrink:0;white-space:nowrap;min-width:fit-content}.request-item:hover{background-color:#ffffffe6;transform:translateY(-1px);box-shadow:0 2px 5px #0000000d;border-color:#d1d5db99}.request-item:active{transform:translateY(0);box-shadow:0 1px 2px #00000008}.request-item.active{background:#eff6ffcc;border-color:#3b82f64d;box-shadow:0 2px 6px #3b82f61a,0 0 0 1px #3b82f626;position:relative}@keyframes shimmerGradient{0%{background-position:100% 50%}to{background-position:0% 50%}}.request-title{font-size:.875rem;color:#374151;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .2s ease}.request-item.active .request-title{color:#2563eb;font-weight:500;text-shadow:0 0 1px rgba(37,99,235,.1)}.request-action,.request-add-action{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background-color:transparent;transition:all .2s ease}.request-action:hover,.request-add-action:hover{background-color:#f3f4f6cc;transform:scale(1.1)}.request-action:active,.request-add-action:active{transform:scale(.95)}:host-context(.dark-mode) .cide-lyt-request{background:linear-gradient(to right,#0f172a,#0f172af2);border-bottom-color:#1e293be6;box-shadow:0 2px 6px #00000026,0 1px 1px #0000001a}:host-context(.dark-mode) .request-item{background-color:#1e293b99;border-color:#33415566;box-shadow:0 1px 2px #0000001a}:host-context(.dark-mode) .request-item:hover{background-color:#1e293bcc;border-color:#47556999;box-shadow:0 2px 5px #00000026}:host-context(.dark-mode) .request-title{color:#e2e8f0}:host-context(.dark-mode) .request-item:hover .request-title{color:#f8fafc}:host-context(.dark-mode) .request-item.active{background:#1e3a8a4d;border-color:#3b82f666;box-shadow:0 2px 6px #1e40af40,0 0 0 1px #3b82f633}:host-context(.dark-mode) .request-item.active .request-title{color:#60a5fa;text-shadow:0 0 2px rgba(96,165,250,.2)}:host-context(.dark-mode) .request-action:hover,:host-context(.dark-mode) .request-add-action:hover{background-color:#334155cc}.request-item:hover{transform:translateY(-.5px);box-shadow:0 1px 3px #00000008}.request-item:hover:before{opacity:1}.request-item.active{background:linear-gradient(to right,#eff6ffcc,#dbeafe99);box-shadow:0 1px 3px #3b82f626;transform:translateZ(0)}@keyframes glowEffect{0%{opacity:.6;box-shadow:0 1px 2px #3b82f61a}50%{opacity:1;box-shadow:0 1px 3px #3b82f64d}to{opacity:.6;box-shadow:0 1px 2px #3b82f61a}}.request-title{font-size:.7rem;color:#374151;margin-right:.5rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px;letter-spacing:.01em;transition:all .2s ease;position:relative}.request-item.active .request-title{color:#1e40af;font-weight:600;text-shadow:0 0 .5px rgba(37,99,235,.3);letter-spacing:.015em}.request-action{display:flex;align-items:center;justify-content:center;height:14px;width:14px;border-radius:3px;transition:all .2s ease;cursor:pointer;color:#9ca3af;border:none;background:transparent;padding:0;outline:none;position:relative;overflow:hidden;transform:translateZ(0)}.request-action:hover{background-color:#3b82f614;color:#3b82f6;transform:translateY(-.5px) scale(1.05);box-shadow:0 1px 2px #0000000d}.request-action:active{transform:translateY(.5px) scale(.97);transition:all .1s ease}.request-action:focus-visible{outline:1px solid #3b82f6;outline-offset:1px;box-shadow:0 0 0 2px #3b82f61a}.close-action:hover{background-color:#ef444414;color:#ef4444}.close-action:focus-visible{outline-color:#ef4444;box-shadow:0 0 0 2px #ef44441a}.request-divider{width:1px;height:18px;background:linear-gradient(to bottom,#d1d5db1a,#d1d5db80,#d1d5db1a);margin:0 4px}:host-context(.dark-mode) .request-divider{background:linear-gradient(to bottom,#4755691a,#47556980,#4755691a)}.request-divider:before{content:\"\";position:absolute;top:0;bottom:0;left:-1px;width:3px;background:radial-gradient(ellipse at center,#ffffff80,#fff0 70%);opacity:0;transition:opacity .3s ease}.request-content:hover .request-divider:before{opacity:.7}.request-add-action{display:flex;align-items:center;justify-content:center;height:16px;width:16px;border-radius:3px;transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;color:#6b7280;background-color:transparent;border:none;padding:0;outline:none;position:relative;overflow:hidden}.request-add-action:hover{background-color:#3b82f614;color:#3b82f6;transform:translateY(-.5px) scale(1.05);box-shadow:0 1px 3px #3b82f626}.request-add-action:active{transform:translateY(.5px) scale(.97);transition:all .1s ease}.request-add-action:focus-visible{outline:1px solid #3b82f6;outline-offset:1px;box-shadow:0 0 0 2px #3b82f61a}.request-add-action:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle,#3b82f64d,#3b82f600 70%);opacity:0;transform:scale(0);transition:transform .4s ease,opacity .3s ease}.request-add-action:active:after{opacity:1;transform:scale(3);transition:transform .1s ease,opacity .1s ease}@keyframes subtlePulse{0%{box-shadow:0 0 #3b82f600;transform:scale(1)}50%{box-shadow:0 0 0 3px #3b82f626;transform:scale(1.05)}to{box-shadow:0 0 #3b82f600;transform:scale(1)}}.request-add-action-pulse{animation:subtlePulse 2s cubic-bezier(.4,0,.6,1) infinite}:host-context(.dark-mode) .cide-lyt-request{background:linear-gradient(to right,#111827f2,#1f2937e6);border-bottom:1px solid rgba(55,65,81,.5)}:host-context(.dark-mode) .request-title{color:#e5e7eb}:host-context(.dark-mode) .request-item.active{background:linear-gradient(to right,#1e3a8a26,#2563eb1a)}:host-context(.dark-mode) .request-item.active .request-title{color:#93c5fd}:host-context(.dark-mode) .request-action,:host-context(.dark-mode) .request-add-action{color:#9ca3af}:host-context(.dark-mode) .request-divider{background:linear-gradient(to bottom,#4b55634d,#6b728080,#4b55634d)}@keyframes slideIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}@keyframes slideOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-5px)}}@keyframes flickerEffect{0%{opacity:1;transform:scale(1);box-shadow:0 1px 2px #00000005}25%{opacity:.7;transform:scale(.98);box-shadow:0 2px 8px #3b82f64d}50%{opacity:.9;transform:scale(1.02);box-shadow:0 4px 12px #3b82f666}75%{opacity:.8;transform:scale(.99);box-shadow:0 2px 6px #3b82f633}to{opacity:1;transform:scale(1);box-shadow:0 1px 2px #00000005}}@keyframes flickerEffectDark{0%{opacity:1;transform:scale(1);box-shadow:0 1px 2px #0000001a}25%{opacity:.7;transform:scale(.98);box-shadow:0 2px 8px #60a5fa4d}50%{opacity:.9;transform:scale(1.02);box-shadow:0 4px 12px #60a5fa66}75%{opacity:.8;transform:scale(.99);box-shadow:0 2px 6px #60a5fa33}to{opacity:1;transform:scale(1);box-shadow:0 1px 2px #0000001a}}.request-item-enter{animation:slideIn .2s cubic-bezier(.4,0,.2,1)}.request-item-exit{animation:slideOut .2s cubic-bezier(.4,0,.2,1)}.request-item-flicker{animation:flickerEffect .4s cubic-bezier(.4,0,.2,1)}:host-context(.dark-mode) .request-item-flicker{animation:flickerEffectDark .4s cubic-bezier(.4,0,.2,1)}@media screen and (max-width: 768px){.cide-lyt-request{height:22px;padding:0 .5rem;min-height:22px}.request-item{padding:6px 10px;margin:0 3px;border-radius:.25rem;min-height:20px}.request-title{font-size:.65rem;max-width:100px;margin-right:.375rem}.request-action{width:12px;height:12px;min-width:12px;min-height:12px}.request-divider{height:16px;margin:0 2px}.request-content{-webkit-overflow-scrolling:touch;scrollbar-width:thin;scroll-behavior:smooth}.request-item{min-width:80px;touch-action:manipulation}.request-action,.request-add-action{min-width:28px;min-height:28px;touch-action:manipulation}}@media screen and (max-width: 480px){.cide-lyt-request{height:24px;padding:0 .375rem;min-height:24px}.request-item{padding:5px 8px;margin:0 2px;min-width:70px}.request-title{font-size:.6rem;max-width:80px;margin-right:.25rem}.request-action{width:14px;height:14px}.request-divider{height:14px;margin:0 1px}.request-divider{display:none}}@media screen and (min-width: 769px) and (max-width: 1024px){.cide-lyt-request{height:21px;padding:0 .625rem}.request-item{padding:7px 11px}.request-title{font-size:.7rem;max-width:110px}}@media screen and (max-width: 768px) and (orientation: landscape){.cide-lyt-request{height:20px;min-height:20px}.request-item{padding:5px 9px}.request-title{max-width:90px}}@media (hover: none) and (pointer: coarse){.request-item{min-height:32px;padding:8px 12px}.request-action,.request-add-action{min-width:32px;min-height:32px}.request-item:hover{transform:none}.request-item:active{transform:scale(.98);background-color:#fffffff2}.request-action:active,.request-add-action:active{transform:scale(.95)}}.request-item:focus,.request-action:focus,.request-add-action:focus{outline:none;box-shadow:0 0 0 2px #3b82f64d}:host-context(.dark-mode) .request-item:focus,:host-context(.dark-mode) .request-action:focus,:host-context(.dark-mode) .request-add-action:focus{box-shadow:0 0 0 2px #60a5fa66}.cide-lyt-request:hover{box-shadow:0 3px 8px #00000012,0 1px 2px #0000000d;transform:translateY(-1px)}.request-content:empty .request-add-action{animation:pulseAttention 2s infinite}@keyframes pulseAttention{0%{box-shadow:0 0 #3b82f666;transform:scale(1)}70%{box-shadow:0 0 0 8px #3b82f600;transform:scale(1.05)}to{box-shadow:0 0 #3b82f600;transform:scale(1)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }] });
|
|
5929
5955
|
}
|
|
5930
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
5956
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytRequestWrapperComponent, decorators: [{
|
|
5931
5957
|
type: Component,
|
|
5932
5958
|
args: [{ selector: 'cide-lyt-request-wrapper', standalone: true, imports: [CommonModule, CideIconComponent], template: "<ng-container *ngIf=\"requestItems() as requestItems\">\r\n <div id=\"cide-lyt-request-wrapper\" class=\"cide-lyt-request tw-w-[inherit]\" [class.cide-lyt-request-wrapper-hide]=\"!requestItems.length\">\r\n <div class=\"request-content\">\r\n <ng-container *ngFor=\"let item of requestItems; let i = index\">\r\n <div #requestItemEl class=\"request-item\" (keydown.enter)=\"requestService.activateTab(item.id); applyFlickerEffect($event)\"\r\n [class.active]=\"item.active\" tabindex=\"0\" (click)=\"requestService.activateTab(item.id); applyFlickerEffect($event)\"\r\n [attr.data-tooltip]=\"item.title\">\r\n <span class=\"request-title\">{{ item.title }}</span>\r\n <button class=\"request-action close-action\" \r\n (click)=\"requestService.closeTab(item.id); $event.stopPropagation();\"\r\n (keydown.enter)=\"requestService.closeTab(item.id); $event.stopPropagation();\" \r\n tabindex=\"0\"\r\n data-tooltip=\"Close this tab\">\r\n <cide-ele-icon size=\"3xs\">close</cide-ele-icon>\r\n </button>\r\n </div>\r\n <!-- Only add divider between items -->\r\n <div class=\"request-divider\" *ngIf=\"i < requestItems.length - 1\"></div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n</ng-container>", styles: [".cide-lyt-request{height:20px;background:linear-gradient(to right,#fff,#f9fafbf2);border-bottom:1px solid rgba(229,231,235,.8);box-shadow:0 2px 6px #0000000d,0 1px 1px #00000008;display:flex;align-items:center;padding:0 .5rem;position:relative;z-index:15;transition:all .2s cubic-bezier(.4,0,.2,1);will-change:transform;-webkit-user-select:none;user-select:none;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);width:100%;max-width:100%;overflow:hidden;box-sizing:border-box}.request-content{display:flex;align-items:center;height:100%;width:100%;max-width:100%;position:relative;overflow-x:auto;overflow-y:hidden;min-width:0;flex-shrink:1;scrollbar-width:thin;scrollbar-color:var(--cide-ele-scrollbar-thumb, #d1d5db) var(--cide-ele-scrollbar-track, transparent);box-sizing:border-box}.request-content::-webkit-scrollbar{height:4px}.request-content::-webkit-scrollbar-track{background:var(--cide-ele-scrollbar-track, transparent)}.request-content::-webkit-scrollbar-thumb{background-color:var(--cide-ele-scrollbar-thumb, #d1d5db);border-radius:2px;opacity:.7}.request-content::-webkit-scrollbar-thumb:hover{background-color:var(--cide-ele-scrollbar-thumb-hover, #9ca3af);opacity:1}.request-item{position:relative;padding:8px 12px;margin:0 4px;border-radius:.375rem;display:flex;align-items:center;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);overflow:hidden;background-color:#fff9;box-shadow:0 1px 2px #00000005;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(229,231,235,.4);flex-shrink:0;white-space:nowrap;min-width:fit-content}.request-item:hover{background-color:#ffffffe6;transform:translateY(-1px);box-shadow:0 2px 5px #0000000d;border-color:#d1d5db99}.request-item:active{transform:translateY(0);box-shadow:0 1px 2px #00000008}.request-item.active{background:#eff6ffcc;border-color:#3b82f64d;box-shadow:0 2px 6px #3b82f61a,0 0 0 1px #3b82f626;position:relative}@keyframes shimmerGradient{0%{background-position:100% 50%}to{background-position:0% 50%}}.request-title{font-size:.875rem;color:#374151;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .2s ease}.request-item.active .request-title{color:#2563eb;font-weight:500;text-shadow:0 0 1px rgba(37,99,235,.1)}.request-action,.request-add-action{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background-color:transparent;transition:all .2s ease}.request-action:hover,.request-add-action:hover{background-color:#f3f4f6cc;transform:scale(1.1)}.request-action:active,.request-add-action:active{transform:scale(.95)}:host-context(.dark-mode) .cide-lyt-request{background:linear-gradient(to right,#0f172a,#0f172af2);border-bottom-color:#1e293be6;box-shadow:0 2px 6px #00000026,0 1px 1px #0000001a}:host-context(.dark-mode) .request-item{background-color:#1e293b99;border-color:#33415566;box-shadow:0 1px 2px #0000001a}:host-context(.dark-mode) .request-item:hover{background-color:#1e293bcc;border-color:#47556999;box-shadow:0 2px 5px #00000026}:host-context(.dark-mode) .request-title{color:#e2e8f0}:host-context(.dark-mode) .request-item:hover .request-title{color:#f8fafc}:host-context(.dark-mode) .request-item.active{background:#1e3a8a4d;border-color:#3b82f666;box-shadow:0 2px 6px #1e40af40,0 0 0 1px #3b82f633}:host-context(.dark-mode) .request-item.active .request-title{color:#60a5fa;text-shadow:0 0 2px rgba(96,165,250,.2)}:host-context(.dark-mode) .request-action:hover,:host-context(.dark-mode) .request-add-action:hover{background-color:#334155cc}.request-item:hover{transform:translateY(-.5px);box-shadow:0 1px 3px #00000008}.request-item:hover:before{opacity:1}.request-item.active{background:linear-gradient(to right,#eff6ffcc,#dbeafe99);box-shadow:0 1px 3px #3b82f626;transform:translateZ(0)}@keyframes glowEffect{0%{opacity:.6;box-shadow:0 1px 2px #3b82f61a}50%{opacity:1;box-shadow:0 1px 3px #3b82f64d}to{opacity:.6;box-shadow:0 1px 2px #3b82f61a}}.request-title{font-size:.7rem;color:#374151;margin-right:.5rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px;letter-spacing:.01em;transition:all .2s ease;position:relative}.request-item.active .request-title{color:#1e40af;font-weight:600;text-shadow:0 0 .5px rgba(37,99,235,.3);letter-spacing:.015em}.request-action{display:flex;align-items:center;justify-content:center;height:14px;width:14px;border-radius:3px;transition:all .2s ease;cursor:pointer;color:#9ca3af;border:none;background:transparent;padding:0;outline:none;position:relative;overflow:hidden;transform:translateZ(0)}.request-action:hover{background-color:#3b82f614;color:#3b82f6;transform:translateY(-.5px) scale(1.05);box-shadow:0 1px 2px #0000000d}.request-action:active{transform:translateY(.5px) scale(.97);transition:all .1s ease}.request-action:focus-visible{outline:1px solid #3b82f6;outline-offset:1px;box-shadow:0 0 0 2px #3b82f61a}.close-action:hover{background-color:#ef444414;color:#ef4444}.close-action:focus-visible{outline-color:#ef4444;box-shadow:0 0 0 2px #ef44441a}.request-divider{width:1px;height:18px;background:linear-gradient(to bottom,#d1d5db1a,#d1d5db80,#d1d5db1a);margin:0 4px}:host-context(.dark-mode) .request-divider{background:linear-gradient(to bottom,#4755691a,#47556980,#4755691a)}.request-divider:before{content:\"\";position:absolute;top:0;bottom:0;left:-1px;width:3px;background:radial-gradient(ellipse at center,#ffffff80,#fff0 70%);opacity:0;transition:opacity .3s ease}.request-content:hover .request-divider:before{opacity:.7}.request-add-action{display:flex;align-items:center;justify-content:center;height:16px;width:16px;border-radius:3px;transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;color:#6b7280;background-color:transparent;border:none;padding:0;outline:none;position:relative;overflow:hidden}.request-add-action:hover{background-color:#3b82f614;color:#3b82f6;transform:translateY(-.5px) scale(1.05);box-shadow:0 1px 3px #3b82f626}.request-add-action:active{transform:translateY(.5px) scale(.97);transition:all .1s ease}.request-add-action:focus-visible{outline:1px solid #3b82f6;outline-offset:1px;box-shadow:0 0 0 2px #3b82f61a}.request-add-action:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle,#3b82f64d,#3b82f600 70%);opacity:0;transform:scale(0);transition:transform .4s ease,opacity .3s ease}.request-add-action:active:after{opacity:1;transform:scale(3);transition:transform .1s ease,opacity .1s ease}@keyframes subtlePulse{0%{box-shadow:0 0 #3b82f600;transform:scale(1)}50%{box-shadow:0 0 0 3px #3b82f626;transform:scale(1.05)}to{box-shadow:0 0 #3b82f600;transform:scale(1)}}.request-add-action-pulse{animation:subtlePulse 2s cubic-bezier(.4,0,.6,1) infinite}:host-context(.dark-mode) .cide-lyt-request{background:linear-gradient(to right,#111827f2,#1f2937e6);border-bottom:1px solid rgba(55,65,81,.5)}:host-context(.dark-mode) .request-title{color:#e5e7eb}:host-context(.dark-mode) .request-item.active{background:linear-gradient(to right,#1e3a8a26,#2563eb1a)}:host-context(.dark-mode) .request-item.active .request-title{color:#93c5fd}:host-context(.dark-mode) .request-action,:host-context(.dark-mode) .request-add-action{color:#9ca3af}:host-context(.dark-mode) .request-divider{background:linear-gradient(to bottom,#4b55634d,#6b728080,#4b55634d)}@keyframes slideIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}@keyframes slideOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-5px)}}@keyframes flickerEffect{0%{opacity:1;transform:scale(1);box-shadow:0 1px 2px #00000005}25%{opacity:.7;transform:scale(.98);box-shadow:0 2px 8px #3b82f64d}50%{opacity:.9;transform:scale(1.02);box-shadow:0 4px 12px #3b82f666}75%{opacity:.8;transform:scale(.99);box-shadow:0 2px 6px #3b82f633}to{opacity:1;transform:scale(1);box-shadow:0 1px 2px #00000005}}@keyframes flickerEffectDark{0%{opacity:1;transform:scale(1);box-shadow:0 1px 2px #0000001a}25%{opacity:.7;transform:scale(.98);box-shadow:0 2px 8px #60a5fa4d}50%{opacity:.9;transform:scale(1.02);box-shadow:0 4px 12px #60a5fa66}75%{opacity:.8;transform:scale(.99);box-shadow:0 2px 6px #60a5fa33}to{opacity:1;transform:scale(1);box-shadow:0 1px 2px #0000001a}}.request-item-enter{animation:slideIn .2s cubic-bezier(.4,0,.2,1)}.request-item-exit{animation:slideOut .2s cubic-bezier(.4,0,.2,1)}.request-item-flicker{animation:flickerEffect .4s cubic-bezier(.4,0,.2,1)}:host-context(.dark-mode) .request-item-flicker{animation:flickerEffectDark .4s cubic-bezier(.4,0,.2,1)}@media screen and (max-width: 768px){.cide-lyt-request{height:22px;padding:0 .5rem;min-height:22px}.request-item{padding:6px 10px;margin:0 3px;border-radius:.25rem;min-height:20px}.request-title{font-size:.65rem;max-width:100px;margin-right:.375rem}.request-action{width:12px;height:12px;min-width:12px;min-height:12px}.request-divider{height:16px;margin:0 2px}.request-content{-webkit-overflow-scrolling:touch;scrollbar-width:thin;scroll-behavior:smooth}.request-item{min-width:80px;touch-action:manipulation}.request-action,.request-add-action{min-width:28px;min-height:28px;touch-action:manipulation}}@media screen and (max-width: 480px){.cide-lyt-request{height:24px;padding:0 .375rem;min-height:24px}.request-item{padding:5px 8px;margin:0 2px;min-width:70px}.request-title{font-size:.6rem;max-width:80px;margin-right:.25rem}.request-action{width:14px;height:14px}.request-divider{height:14px;margin:0 1px}.request-divider{display:none}}@media screen and (min-width: 769px) and (max-width: 1024px){.cide-lyt-request{height:21px;padding:0 .625rem}.request-item{padding:7px 11px}.request-title{font-size:.7rem;max-width:110px}}@media screen and (max-width: 768px) and (orientation: landscape){.cide-lyt-request{height:20px;min-height:20px}.request-item{padding:5px 9px}.request-title{max-width:90px}}@media (hover: none) and (pointer: coarse){.request-item{min-height:32px;padding:8px 12px}.request-action,.request-add-action{min-width:32px;min-height:32px}.request-item:hover{transform:none}.request-item:active{transform:scale(.98);background-color:#fffffff2}.request-action:active,.request-add-action:active{transform:scale(.95)}}.request-item:focus,.request-action:focus,.request-add-action:focus{outline:none;box-shadow:0 0 0 2px #3b82f64d}:host-context(.dark-mode) .request-item:focus,:host-context(.dark-mode) .request-action:focus,:host-context(.dark-mode) .request-add-action:focus{box-shadow:0 0 0 2px #60a5fa66}.cide-lyt-request:hover{box-shadow:0 3px 8px #00000012,0 1px 2px #0000000d;transform:translateY(-1px)}.request-content:empty .request-add-action{animation:pulseAttention 2s infinite}@keyframes pulseAttention{0%{box-shadow:0 0 #3b82f666;transform:scale(1)}70%{box-shadow:0 0 0 8px #3b82f600;transform:scale(1.05)}to{box-shadow:0 0 #3b82f600;transform:scale(1)}}\n"] }]
|
|
5933
5959
|
}], propDecorators: { requestItemElements: [{
|
|
@@ -5997,14 +6023,14 @@ class TabContentComponent {
|
|
|
5997
6023
|
delay(150).then(() => { this.isRestoringScroll = false; }); // Allow scroll event to settle
|
|
5998
6024
|
}
|
|
5999
6025
|
}
|
|
6000
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
6001
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.
|
|
6026
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TabContentComponent, deps: [{ token: CideLytRequestService }, { token: i2.Router }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
6027
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: TabContentComponent, isStandalone: true, selector: "cide-lyt-tab-content", viewQueries: [{ propertyName: "scrollContainerRef", first: true, predicate: ["scrollContainer"], descendants: true }], ngImport: i0, template: `
|
|
6002
6028
|
<div class="tab-content-container" #scrollContainer (scroll)="onScroll()">
|
|
6003
6029
|
<router-outlet></router-outlet>
|
|
6004
6030
|
</div>
|
|
6005
6031
|
`, isInline: true, styles: [":host{height:100%;display:flex;flex-direction:column}.tab-content-container{height:100%;width:100%;position:relative;display:flex;flex-direction:column;flex:1}::ng-deep router-outlet+*{height:100%;flex:1;display:flex;flex-direction:column}::ng-deep cide-lyt-home-wrapper,::ng-deep cide-adm-home-wrapper,::ng-deep cide-adm-entity,::ng-deep cide-adm-entity-list{height:100%!important;flex:1!important;display:flex!important;flex-direction:column!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i2.RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }] });
|
|
6006
6032
|
}
|
|
6007
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
6033
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TabContentComponent, decorators: [{
|
|
6008
6034
|
type: Component,
|
|
6009
6035
|
args: [{ selector: 'cide-lyt-tab-content', standalone: true, imports: [CommonModule, RouterModule], template: `
|
|
6010
6036
|
<div class="tab-content-container" #scrollContainer (scroll)="onScroll()">
|
|
@@ -6017,10 +6043,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
6017
6043
|
}] } });
|
|
6018
6044
|
|
|
6019
6045
|
class CideLytLayoutWrapperComponent {
|
|
6020
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
6021
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.
|
|
6046
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytLayoutWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6047
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: CideLytLayoutWrapperComponent, isStandalone: true, selector: "cide-lyt-layout-wrapper", ngImport: i0, template: "<div class=\"tw-w-full tw-table tw-h-screen tw-relative\" id=\"cide-lyt-layout-wrapper\">\r\n <!-- We will use here Header -->\r\n <cide-lyt-header-wrapper class=\"tw-table-row tw-h-0\"></cide-lyt-header-wrapper>\r\n <!-- we will use here request tabs -->\r\n <div class=\"tw-table-row\" id=\"cide-lyt-sidebar-page-wrapper\">\r\n <div class=\"cide-lyt-sidebar-page-wrapper tw-h-full tw-w-screen\" id=\"cide-lyt-sidebar-page-inner-wrapper\">\r\n <!-- We will use here Sidebar -->\r\n <cide-lyt-sidebar-wrapper id=\"cide-lyt-sidebar-page\"\r\n class=\"cide-lyt-sidebar-page-hide\"></cide-lyt-sidebar-wrapper>\r\n <!-- We will use here Router Outlet -->\r\n <div class=\"cide-lyt-page-wrapper tw-block tw-h-full tw-w-full\" id=\"cide-lyt-page-wrapper\">\r\n <cide-lyt-request-wrapper class=\"tw-w-[inherit] tw-h-auto\"></cide-lyt-request-wrapper>\r\n <div class=\"cide-lyt-outlet-sidedrawer-wrapper tw-table-row\"\r\n id=\"cide-lyt-outlet-sidedrawer-wrapper\">\r\n <div class=\"tw-w-full tw-h-full tw-overflow-y-auto cide-scrollbar-width-thin\"\r\n id=\"cide-lyt-outlet-wrapper\">\r\n <cide-lyt-tab-content></cide-lyt-tab-content>\r\n </div>\r\n <!-- We will use here Side Drawer -->\r\n <cide-lyt-sidedrawer-wrapper></cide-lyt-sidedrawer-wrapper>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"cide-lyt-footer-console-wrapper cide-lyt-footer-console-wrapper-hide tw-relative tw-table-row tw-h-0\"\r\n id=\"cide-lyt-footer-console-wrapper\">\r\n <!-- We will use here footer -->\r\n <cide-lyt-footer-wrapper></cide-lyt-footer-wrapper>\r\n <!-- We will use here Console -->\r\n <cide-lyt-console-wrapper></cide-lyt-console-wrapper>\r\n </div>\r\n</div>", styles: ["#cide-lyt-layout-wrapper{display:table;width:100%;height:100vh;position:relative;overflow:hidden}#cide-lyt-layout-wrapper>*{display:table-row}#cide-lyt-sidebar-page-wrapper{display:table-row;height:100%}#cide-lyt-page-wrapper{display:block;height:100%;width:100%;overflow:hidden}#cide-lyt-outlet-wrapper{display:block;width:100%;height:100%;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}@media screen and (max-width: 768px){#cide-lyt-layout-wrapper{display:flex;flex-direction:column;height:100vh;height:100dvh;overflow:hidden}#cide-lyt-layout-wrapper>cide-lyt-header-wrapper{display:block;flex-shrink:0;height:auto;min-height:56px;width:100%}#cide-lyt-sidebar-page-wrapper{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}.cide-lyt-sidebar-page-wrapper{display:flex;flex-direction:row;flex:1;min-height:0;width:100%;position:relative;overflow:hidden}#cide-lyt-sidebar-page{display:block;position:absolute;top:0;left:0;bottom:0;z-index:30;height:100%;transform:translate(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1)}#cide-lyt-sidebar-page.mobile-open{transform:translate(0)}#cide-lyt-page-wrapper{display:flex;flex-direction:column;flex:1;min-width:0;min-height:0;width:100%;overflow:hidden}#cide-lyt-page-wrapper>cide-lyt-request-wrapper{flex-shrink:0;width:100%}#cide-lyt-outlet-sidedrawer-wrapper{display:flex;flex-direction:row;flex:1;min-height:0;overflow:hidden}#cide-lyt-outlet-wrapper{flex:1;min-width:0;min-height:0;width:100%;height:100%;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain}#cide-lyt-footer-console-wrapper{display:flex;flex-direction:column;flex-shrink:0;height:auto;width:100%;overflow:hidden}#cide-lyt-footer-console-wrapper>cide-lyt-footer-wrapper{flex-shrink:0;height:auto;width:100%}#cide-lyt-footer-console-wrapper>cide-lyt-console-wrapper{flex-shrink:0;height:auto;width:100%}body{overflow-x:hidden;width:100%}@supports (-webkit-touch-callout: none){#cide-lyt-layout-wrapper{height:-webkit-fill-available}}}@media screen and (min-width: 769px) and (max-width: 1024px){#cide-lyt-outlet-wrapper{padding:.75rem}.cide-lyt-sidebar-page-wrapper{max-width:100%}}@media screen and (max-width: 480px){#cide-lyt-outlet-wrapper{padding:.5rem}#cide-lyt-layout-wrapper>cide-lyt-header-wrapper{min-height:52px}.cide-lyt-page-wrapper{padding:0}#cide-lyt-sidedrawer-wrapper{width:0!important;min-width:0!important;transform:translate(100%)}#cide-lyt-sidebar-page{z-index:35}#cide-lyt-outlet-wrapper{width:100%}#cide-lyt-footer-console-wrapper{flex-direction:column}}@media screen and (max-width: 768px) and (orientation: landscape){#cide-lyt-layout-wrapper>cide-lyt-header-wrapper{min-height:48px}#cide-lyt-outlet-wrapper{padding:.5rem}}@media (hover: none) and (pointer: coarse){#cide-lyt-outlet-wrapper{-webkit-overflow-scrolling:touch;scroll-behavior:smooth}#cide-lyt-layout-wrapper{-webkit-user-select:none;-moz-user-select:none;user-select:none}#cide-lyt-outlet-wrapper *{-webkit-user-select:text;-moz-user-select:text;user-select:text}}@media print{#cide-lyt-layout-wrapper{display:block;height:auto}#cide-lyt-sidebar-page-wrapper,#cide-lyt-footer-console-wrapper{display:none}#cide-lyt-outlet-wrapper{overflow:visible;height:auto}}\n"], dependencies: [{ kind: "component", type: CideLytHeaderWrapperComponent, selector: "cide-lyt-header-wrapper" }, { kind: "component", type: CideLytSidebarWrapperComponent, selector: "cide-lyt-sidebar-wrapper" }, { kind: "component", type: CideLytSidedrawerWrapperComponent, selector: "cide-lyt-sidedrawer-wrapper" }, { kind: "component", type: CideLytFooterWrapperComponent, selector: "cide-lyt-footer-wrapper" }, { kind: "component", type: CideLytConsoleWrapperComponent, selector: "cide-lyt-console-wrapper" }, { kind: "ngmodule", type: RouterModule }, { kind: "component", type: CideLytRequestWrapperComponent, selector: "cide-lyt-request-wrapper" }, { kind: "component", type: TabContentComponent, selector: "cide-lyt-tab-content" }] });
|
|
6022
6048
|
}
|
|
6023
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
6049
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytLayoutWrapperComponent, decorators: [{
|
|
6024
6050
|
type: Component,
|
|
6025
6051
|
args: [{ selector: 'cide-lyt-layout-wrapper', standalone: true, imports: [
|
|
6026
6052
|
CideLytHeaderWrapperComponent,
|
|
@@ -6035,8 +6061,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
6035
6061
|
}] });
|
|
6036
6062
|
|
|
6037
6063
|
class CloudIdeLayoutComponent {
|
|
6038
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
6039
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.
|
|
6064
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CloudIdeLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6065
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: CloudIdeLayoutComponent, isStandalone: true, selector: "cide-lyt-wrapper", ngImport: i0, template: `
|
|
6040
6066
|
<cide-lyt-layout-wrapper></cide-lyt-layout-wrapper>
|
|
6041
6067
|
|
|
6042
6068
|
<!-- Floating Container Manager -->
|
|
@@ -6046,7 +6072,7 @@ class CloudIdeLayoutComponent {
|
|
|
6046
6072
|
<cide-ele-global-notifications></cide-ele-global-notifications>
|
|
6047
6073
|
`, isInline: true, styles: [""], dependencies: [{ kind: "component", type: CideLytLayoutWrapperComponent, selector: "cide-lyt-layout-wrapper" }, { kind: "component", type: CideEleFloatingContainerManagerComponent, selector: "cide-ele-floating-container-manager" }, { kind: "component", type: CideEleGlobalNotificationsComponent, selector: "cide-ele-global-notifications" }] });
|
|
6048
6074
|
}
|
|
6049
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
6075
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CloudIdeLayoutComponent, decorators: [{
|
|
6050
6076
|
type: Component,
|
|
6051
6077
|
args: [{ selector: 'cide-lyt-wrapper', template: `
|
|
6052
6078
|
<cide-lyt-layout-wrapper></cide-lyt-layout-wrapper>
|
|
@@ -6203,10 +6229,10 @@ class ComponentContextService {
|
|
|
6203
6229
|
}
|
|
6204
6230
|
return 'none';
|
|
6205
6231
|
}
|
|
6206
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
6207
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
6232
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ComponentContextService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
6233
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ComponentContextService, providedIn: 'root' });
|
|
6208
6234
|
}
|
|
6209
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
6235
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ComponentContextService, decorators: [{
|
|
6210
6236
|
type: Injectable,
|
|
6211
6237
|
args: [{
|
|
6212
6238
|
providedIn: 'root'
|
|
@@ -6381,13 +6407,13 @@ class CideLytSharedWrapperComponent {
|
|
|
6381
6407
|
close(fallbackRoute, containerId) {
|
|
6382
6408
|
this.componentContextService.close(fallbackRoute, containerId);
|
|
6383
6409
|
}
|
|
6384
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
6385
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.
|
|
6410
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytSharedWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6411
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.15", type: CideLytSharedWrapperComponent, isStandalone: true, selector: "cide-lyt-shared-wrapper", inputs: { shared_wrapper_setup_param: { classPropertyName: "shared_wrapper_setup_param", publicName: "shared_wrapper_setup_param", isSignal: true, isRequired: false, transformFunction: null }, breadcrumb_data: { classPropertyName: "breadcrumb_data", publicName: "breadcrumb_data", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "breadcrumb", first: true, predicate: CideEleBreadcrumbComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"tw-w-full tw-h-full tw-flex tw-flex-col tw-max-w-full tw-overflow-hidden\">\n <div\n class=\"tw-sticky tw-w-full tw-max-w-full tw-top-0 tw-z-50 tw-bg-white tw-border-b tw-border-gray-200 tw-shadow-sm\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-gap-2 tw-px-3 sm:tw-px-4 tw-py-2 sm:tw-py-0.5 tw-min-w-0 tw-overflow-hidden tw-flex-wrap sm:tw-flex-nowrap\">\n <div class=\"tw-flex-1 tw-min-w-0 tw-overflow-hidden tw-order-1\">\n <cide-ele-breadcrumb style=\"modern\" [compact]=\"true\" (homeClick)=\"onBreadcrumbHomeClick()\"></cide-ele-breadcrumb>\n </div>\n <div class=\"tw-flex-shrink-0 tw-ml-2 sm:tw-ml-4 tw-order-2\">\n <ng-content select=\"[breadcrumb-actions]\"></ng-content>\n </div>\n </div>\n </div>\n\n <div class=\"tw-flex-1 tw-w-full tw-max-w-full tw-overflow-y-auto tw-overflow-x-hidden tw-min-h-0\">\n <ng-content></ng-content>\n </div>\n</div>", styles: [":host{display:block;height:100%;width:100%}:host>div{display:flex;flex-direction:column;height:100%;width:100%}::ng-deep cide-lyt-shared-wrapper{height:100%!important;display:block!important;width:100%!important}@media (max-width: 640px){:host>div>div:first-child{padding-left:.75rem;padding-right:.75rem}::ng-deep [breadcrumb-actions]{flex-shrink:0}::ng-deep cide-ele-breadcrumb{font-size:.625rem}}\n"], dependencies: [{ kind: "component", type: CideEleBreadcrumbComponent, selector: "cide-ele-breadcrumb", inputs: ["items", "style", "separator", "showHomeIcon", "homeIcon", "maxItems", "showDropdownOnOverflow", "dropdownOptions", "clickableItems", "showTooltips", "responsive", "compact", "animated", "loadingInput", "disabled", "contextId", "pageCode"], outputs: ["itemClick", "dropdownOptionClick", "homeClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
6386
6412
|
}
|
|
6387
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
6413
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytSharedWrapperComponent, decorators: [{
|
|
6388
6414
|
type: Component,
|
|
6389
6415
|
args: [{ selector: 'cide-lyt-shared-wrapper', imports: [CideEleBreadcrumbComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"tw-w-full tw-h-full tw-flex tw-flex-col tw-max-w-full tw-overflow-hidden\">\n <div\n class=\"tw-sticky tw-w-full tw-max-w-full tw-top-0 tw-z-50 tw-bg-white tw-border-b tw-border-gray-200 tw-shadow-sm\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-gap-2 tw-px-3 sm:tw-px-4 tw-py-2 sm:tw-py-0.5 tw-min-w-0 tw-overflow-hidden tw-flex-wrap sm:tw-flex-nowrap\">\n <div class=\"tw-flex-1 tw-min-w-0 tw-overflow-hidden tw-order-1\">\n <cide-ele-breadcrumb style=\"modern\" [compact]=\"true\" (homeClick)=\"onBreadcrumbHomeClick()\"></cide-ele-breadcrumb>\n </div>\n <div class=\"tw-flex-shrink-0 tw-ml-2 sm:tw-ml-4 tw-order-2\">\n <ng-content select=\"[breadcrumb-actions]\"></ng-content>\n </div>\n </div>\n </div>\n\n <div class=\"tw-flex-1 tw-w-full tw-max-w-full tw-overflow-y-auto tw-overflow-x-hidden tw-min-h-0\">\n <ng-content></ng-content>\n </div>\n</div>", styles: [":host{display:block;height:100%;width:100%}:host>div{display:flex;flex-direction:column;height:100%;width:100%}::ng-deep cide-lyt-shared-wrapper{height:100%!important;display:block!important;width:100%!important}@media (max-width: 640px){:host>div>div:first-child{padding-left:.75rem;padding-right:.75rem}::ng-deep [breadcrumb-actions]{flex-shrink:0}::ng-deep cide-ele-breadcrumb{font-size:.625rem}}\n"] }]
|
|
6390
|
-
}], ctorParameters: () => [] });
|
|
6416
|
+
}], ctorParameters: () => [], propDecorators: { breadcrumb: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CideEleBreadcrumbComponent), { isSignal: true }] }], shared_wrapper_setup_param: [{ type: i0.Input, args: [{ isSignal: true, alias: "shared_wrapper_setup_param", required: false }] }], breadcrumb_data: [{ type: i0.Input, args: [{ isSignal: true, alias: "breadcrumb_data", required: false }] }] } });
|
|
6391
6417
|
|
|
6392
6418
|
/**
|
|
6393
6419
|
* Common Rights Service
|
|
@@ -6649,10 +6675,10 @@ class RightsService {
|
|
|
6649
6675
|
console.log('🔄 RightsService: Cache invalidated for page:', pageCode);
|
|
6650
6676
|
}
|
|
6651
6677
|
}
|
|
6652
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
6653
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
6678
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: RightsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
6679
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: RightsService, providedIn: 'root' });
|
|
6654
6680
|
}
|
|
6655
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
6681
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: RightsService, decorators: [{
|
|
6656
6682
|
type: Injectable,
|
|
6657
6683
|
args: [{
|
|
6658
6684
|
providedIn: 'root'
|
|
@@ -6671,7 +6697,7 @@ const layoutControlPannelChildRoutes = [{
|
|
|
6671
6697
|
},
|
|
6672
6698
|
{
|
|
6673
6699
|
path: "home",
|
|
6674
|
-
loadComponent: () => import('./cloud-ide-layout-home-wrapper.component-
|
|
6700
|
+
loadComponent: () => import('./cloud-ide-layout-home-wrapper.component-BglE2JPh.mjs').then(c => c.CideLytHomeWrapperComponent),
|
|
6675
6701
|
canActivate: [authGuard],
|
|
6676
6702
|
data: {
|
|
6677
6703
|
sypg_page_code: "cide_lyt_home" // Used by RequestService to fetch tab properties
|
|
@@ -6679,7 +6705,7 @@ const layoutControlPannelChildRoutes = [{
|
|
|
6679
6705
|
},
|
|
6680
6706
|
{
|
|
6681
6707
|
path: "dashboard-manager",
|
|
6682
|
-
loadComponent: () => import('./cloud-ide-layout-dashboard-manager.component-
|
|
6708
|
+
loadComponent: () => import('./cloud-ide-layout-dashboard-manager.component-DzI_ZzYo.mjs').then(c => c.DashboardManagerComponent),
|
|
6683
6709
|
canActivate: [authGuard],
|
|
6684
6710
|
data: {
|
|
6685
6711
|
sypg_page_code: "cide_lyt_dashboard_manager"
|
|
@@ -6799,10 +6825,10 @@ class CideLytThemeService {
|
|
|
6799
6825
|
updateCSSVariable(key, value) {
|
|
6800
6826
|
setCSSVariable(key, value, this.platformId);
|
|
6801
6827
|
}
|
|
6802
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
6803
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
6828
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytThemeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
6829
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytThemeService, providedIn: 'root' });
|
|
6804
6830
|
}
|
|
6805
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
6831
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytThemeService, decorators: [{
|
|
6806
6832
|
type: Injectable,
|
|
6807
6833
|
args: [{
|
|
6808
6834
|
providedIn: 'root'
|
|
@@ -6926,10 +6952,10 @@ class CacheManagerService {
|
|
|
6926
6952
|
// averageResponseTime could be implemented with timing tracking
|
|
6927
6953
|
};
|
|
6928
6954
|
}
|
|
6929
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
6930
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
6955
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CacheManagerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
6956
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CacheManagerService, providedIn: 'root' });
|
|
6931
6957
|
}
|
|
6932
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
6958
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CacheManagerService, decorators: [{
|
|
6933
6959
|
type: Injectable,
|
|
6934
6960
|
args: [{
|
|
6935
6961
|
providedIn: 'root'
|
|
@@ -7168,10 +7194,10 @@ class CideLytFloatingEntityRightsSharingService {
|
|
|
7168
7194
|
clearEntityAccessPassList() {
|
|
7169
7195
|
this.entityAccessPassListSubject.next([]);
|
|
7170
7196
|
}
|
|
7171
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
7172
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
7197
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytFloatingEntityRightsSharingService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
7198
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytFloatingEntityRightsSharingService, providedIn: 'root' });
|
|
7173
7199
|
}
|
|
7174
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
7200
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytFloatingEntityRightsSharingService, decorators: [{
|
|
7175
7201
|
type: Injectable,
|
|
7176
7202
|
args: [{
|
|
7177
7203
|
providedIn: 'root'
|
|
@@ -7758,8 +7784,8 @@ class CideLytFloatingEntityRightsSharingComponent {
|
|
|
7758
7784
|
// Also emit close event for any parent components
|
|
7759
7785
|
this.close.emit();
|
|
7760
7786
|
}
|
|
7761
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
7762
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.
|
|
7787
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytFloatingEntityRightsSharingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7788
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideLytFloatingEntityRightsSharingComponent, isStandalone: true, selector: "cide-lyt-floating-entity-rights-sharing", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { close: "close", save: "save" }, ngImport: i0, template: `
|
|
7763
7789
|
<!-- Entity Rights Sharing Content -->
|
|
7764
7790
|
<div class="tw-flex tw-flex-col tw-h-full">
|
|
7765
7791
|
<!-- Main Content Area -->
|
|
@@ -7989,7 +8015,7 @@ class CideLytFloatingEntityRightsSharingComponent {
|
|
|
7989
8015
|
</div>
|
|
7990
8016
|
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { 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: CideSpinnerComponent, selector: "cide-ele-spinner", inputs: ["size", "type"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, deferBlockDependencies: [() => [CideIconComponent], () => [i1.ɵNgNoValidate, i1.NgControlStatus, i1.NgControlStatusGroup, i1.FormGroupDirective, i1.FormControlName, CideInputComponent]] });
|
|
7991
8017
|
}
|
|
7992
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
8018
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideLytFloatingEntityRightsSharingComponent, decorators: [{
|
|
7993
8019
|
type: Component,
|
|
7994
8020
|
args: [{ selector: 'cide-lyt-floating-entity-rights-sharing', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
7995
8021
|
CommonModule,
|
|
@@ -8227,7 +8253,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
8227
8253
|
</div>
|
|
8228
8254
|
</div>
|
|
8229
8255
|
` }]
|
|
8230
|
-
}], ctorParameters: () => [] });
|
|
8256
|
+
}], ctorParameters: () => [], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], close: [{ type: i0.Output, args: ["close"] }], save: [{ type: i0.Output, args: ["save"] }] } });
|
|
8231
8257
|
|
|
8232
8258
|
var floatingEntityRightsSharing_component = /*#__PURE__*/Object.freeze({
|
|
8233
8259
|
__proto__: null,
|
|
@@ -8246,4 +8272,4 @@ var floatingEntityRightsSharing_component = /*#__PURE__*/Object.freeze({
|
|
|
8246
8272
|
*/
|
|
8247
8273
|
|
|
8248
8274
|
export { AppStateHelperService as A, CideLytSharedWrapperComponent as C, ENVIRONMENT_CONFIG as E, NotificationSettingsService as N, RightsService as R, CideLytSidebarService as a, CideLytRequestService as b, CideLytSidedrawerService as c, CideLytThemeService as d, AppStateService as e, CloudIdeLayoutService as f, CloudIdeLayoutComponent as g, CideLytSharedService as h, ComponentContextService as i, layoutControlPannelChildRoutes as j, CustomRouteReuseStrategy as k, layoutRoutes as l, CideLytUserStatusService as m, CacheManagerService as n, CideLytFileManagerService as o, processThemeVariable as p, CideLytFloatingEntityRightsSharingComponent as q, CideLytFloatingEntityRightsSharingService as r, setCSSVariable as s, themeFactory as t };
|
|
8249
|
-
//# sourceMappingURL=cloud-ide-layout-cloud-ide-layout-
|
|
8275
|
+
//# sourceMappingURL=cloud-ide-layout-cloud-ide-layout-kPzrNdq8.mjs.map
|