codexly-ui 0.0.66 → 0.0.68

package/assets/styles/_globals.css

@@ -5,6 +5,16 @@
   -webkit-backdrop-filter: blur(4px);
 }
 
+/* ── CDK overlay z-index ─────────────────────────────────────────────────── */
+.cdk-overlay-container {
+  z-index: 1000 !important;
+}
+
+/* ── Toast always on top ─────────────────────────────────────────────────── */
+clx-toast-container {
+  z-index: 9999 !important;
+}
+
 /* ── Scrollbar ───────────────────────────────────────────────────────────── */
 ::-webkit-scrollbar { width: 0.5rem; height: 0.5rem; }
 ::-webkit-scrollbar-track { background-color: transparent; }

package/fesm2022/codexly-ui.mjs

@@ -6,7 +6,7 @@ import { NG_VALUE_ACCESSOR, FormsModule, NgControl, FormControl, ReactiveFormsMo
 import { toSignal, takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { startWith, map, debounceTime, distinctUntilChanged, switchMap, of, catchError } from 'rxjs';
 import * as i1$1 from '@angular/cdk/overlay';
-import { ScrollStrategyOptions, OverlayModule, Overlay, OverlayConfig } from '@angular/cdk/overlay';
+import { ScrollStrategyOptions, OverlayModule, Overlay, OverlayContainer, OverlayConfig } from '@angular/cdk/overlay';
 import { Chart, LineController, BarController, PieController, DoughnutController, RadarController, PolarAreaController, CategoryScale, LinearScale, RadialLinearScale, BarElement, LineElement, PointElement, ArcElement, Filler, Tooltip, Legend } from 'chart.js';
 import * as i1$2 from '@angular/cdk/portal';
 import { PortalModule, ComponentPortal } from '@angular/cdk/portal';
@@ -6290,7 +6290,7 @@ class ClxToastContainerComponent {
         </div>
       }
     </div>
-  `, isInline: true, styles: ["clx-toast-container{display:contents}@media(max-width:639px){.clx-toast-stack{left:0!important;right:0!important;transform:none!important;padding-left:.75rem;padding-right:.75rem;max-width:100%!important;align-items:stretch!important}}\n"], dependencies: [{ kind: "component", type: ClxToastComponent, selector: "clx-toast", inputs: ["entry"], outputs: ["dismiss"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, styles: ["clx-toast-container{display:block;position:fixed;inset:0;pointer-events:none;z-index:999999}@media(max-width:639px){.clx-toast-stack{left:0!important;right:0!important;transform:none!important;padding-left:.75rem;padding-right:.75rem;max-width:100%!important;align-items:stretch!important}}\n"], dependencies: [{ kind: "component", type: ClxToastComponent, selector: "clx-toast", inputs: ["entry"], outputs: ["dismiss"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImport: i0, type: ClxToastContainerComponent, decorators: [{
             type: Component,
@@ -6309,7 +6309,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImpo
         </div>
       }
     </div>
-  `, styles: ["clx-toast-container{display:contents}@media(max-width:639px){.clx-toast-stack{left:0!important;right:0!important;transform:none!important;padding-left:.75rem;padding-right:.75rem;max-width:100%!important;align-items:stretch!important}}\n"] }]
+  `, styles: ["clx-toast-container{display:block;position:fixed;inset:0;pointer-events:none;z-index:999999}@media(max-width:639px){.clx-toast-stack{left:0!important;right:0!important;transform:none!important;padding-left:.75rem;padding-right:.75rem;max-width:100%!important;align-items:stretch!important}}\n"] }]
         }], propDecorators: { entries: [{ type: i0.Input, args: [{ isSignal: true, alias: "entries", required: false }] }, { type: i0.Output, args: ["entriesChange"] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }, { type: i0.Output, args: ["positionChange"] }], toastRefs: [{
                 type: ViewChildren,
                 args: [ClxToastComponent]
@@ -8977,10 +8977,14 @@ class ClxModalService {
     _overlay;
     _injector;
     _focusTrapFactory;
+    _overlayContainer;
     constructor() {
         this._overlay = inject(Overlay);
         this._injector = inject(Injector);
         this._focusTrapFactory = inject(FocusTrapFactory);
+        this._overlayContainer = inject(OverlayContainer);
+        // Keep CDK overlay below toast (toast uses z-index 99999)
+        this._overlayContainer.getContainerElement().style.zIndex = '1000';
     }
     open(
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -14014,7 +14018,9 @@ class ClxToastService {
         });
         ref.setInput('position', position);
         this._appRef.attachView(ref.hostView);
-        document.body.appendChild(ref.location.nativeElement);
+        const el = ref.location.nativeElement;
+        el.style.zIndex = '99999';
+        document.body.appendChild(el);
         this._containers.set(position, ref);
         return ref;
     }