codexly-ui 0.0.30 → 0.0.32

package/fesm2022/codexly-ui.mjs

@@ -11,6 +11,7 @@ import { Chart, LineController, BarController, PieController, DoughnutController
 import * as i1$2 from '@angular/cdk/portal';
 import { PortalModule, ComponentPortal } from '@angular/cdk/portal';
 import { FocusTrapFactory } from '@angular/cdk/a11y';
+import { CdkScrollable } from '@angular/cdk/scrolling';
 import { RouterLink, RouterLinkActive } from '@angular/router';
 
 // ── Parse 'red' | 'red-500' → { color, shade } ───────────────────────────────
@@ -1730,7 +1731,7 @@ class ClxCarouselComponent {
     _slides = contentChildren(ClxCarouselDirective, ...(ngDevMode ? [{ debugName: "_slides" }] : []));
     _autoPlayTimer = null;
     _touchStartX = 0;
-    _zone = inject(NgZone);
+    _zone = inject(NgZone, { optional: true }) ?? { run: (fn) => fn(), runOutsideAngular: (fn) => fn() };
     _aspectClass = computed(() => CAROUSEL_ASPECT_RATIO_MAP[this.aspectRatio()] ?? '', ...(ngDevMode ? [{ debugName: "_aspectClass" }] : []));
     _viewportClass = computed(() => {
         const base = this._aspectClass();
@@ -4935,7 +4936,7 @@ class ClxAlertComponent {
     _resolve = inject(CLX_ALERT_RESOLVE);
     _animate = inject(ClxAnimateService);
     _el = inject((ElementRef));
-    _zone = inject(NgZone);
+    _zone = inject(NgZone, { optional: true }) ?? { run: (fn) => fn(), runOutsideAngular: (fn) => fn() };
     // ─── Resolved options ─────────────────────────────────────────────────────
     get _type() { return this._opts.type ?? 'info'; }
     _icon = signal(ALERT_ICON_MAP[this._type], ...(ngDevMode ? [{ debugName: "_icon" }] : []));
@@ -5983,7 +5984,7 @@ class ClxToastComponent {
     dismiss = output();
     _animate = inject(ClxAnimateService);
     _el = inject((ElementRef));
-    _zone = inject(NgZone);
+    _zone = inject(NgZone, { optional: true }) ?? { run: (fn) => fn(), runOutsideAngular: (fn) => fn() };
     // ─── Timer state ──────────────────────────────────────────────────────────
     _progressPct = signal(100, ...(ngDevMode ? [{ debugName: "_progressPct" }] : []));
     _timerHandle = null;
@@ -9065,7 +9066,7 @@ class ClxEditorComponent {
     _sourceEl;
     // ── Services ─────────────────────────────────────────────────────────────
     _cdr = inject(ChangeDetectorRef);
-    _zone = inject(NgZone);
+    _zone = inject(NgZone, { optional: true }) ?? { run: (fn) => fn(), runOutsideAngular: (fn) => fn() };
     _destroyRef = inject(DestroyRef);
     _modal = inject(ClxModalService);
     // ── Select options ────────────────────────────────────────────────────────
@@ -10881,7 +10882,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.23", ngImpo
             }] } });
 
 class ClxAppLayoutComponent {
-    _zone = inject(NgZone);
+    _zone = inject(NgZone, { optional: true }) ?? { run: (fn) => fn(), runOutsideAngular: (fn) => fn() };
     _document = inject(DOCUMENT);
     activeColor = input('indigo', ...(ngDevMode ? [{ debugName: "activeColor" }] : []));
     _sidebarOpen = signal(false, ...(ngDevMode ? [{ debugName: "_sidebarOpen" }] : []));
@@ -11014,19 +11015,19 @@ class ClxAppLayoutComponent {
         <ng-content select="[clx-header]"></ng-content>
       </header>
 
-      <main class="flex-1 overflow-y-auto bg-white">
+      <main cdkScrollable class="flex-1 overflow-y-auto bg-white">
         <ng-content></ng-content>
       </main>
 
     </div>
-  `, isInline: true, dependencies: [{ kind: "component", type: ClxIconComponent, selector: "span[clx-icon]", inputs: ["name", "size", "color", "fill"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, dependencies: [{ kind: "component", type: ClxIconComponent, selector: "span[clx-icon]", inputs: ["name", "size", "color", "fill"] }, { kind: "directive", type: CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.23", ngImport: i0, type: ClxAppLayoutComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'clx-app-layout',
                     standalone: true,
-                    imports: [ClxIconComponent],
+                    imports: [ClxIconComponent, CdkScrollable],
                     template: `
     <!-- Mobile backdrop -->
     @if (_showBackdrop()) {
@@ -11076,7 +11077,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.23", ngImpo
         <ng-content select="[clx-header]"></ng-content>
       </header>
 
-      <main class="flex-1 overflow-y-auto bg-white">
+      <main cdkScrollable class="flex-1 overflow-y-auto bg-white">
         <ng-content></ng-content>
       </main>