@shival99/z-ui 2.0.45 → 2.0.47

package/fesm2022/shival99-z-ui-components-z-command.mjs

@@ -0,0 +1,302 @@
+import { Overlay, OverlayConfig } from '@angular/cdk/overlay';
+import { TemplatePortal, PortalModule } from '@angular/cdk/portal';
+import { isPlatformBrowser } from '@angular/common';
+import * as i0 from '@angular/core';
+import { output, input, model, viewChild, inject, PLATFORM_ID, ElementRef, ViewContainerRef, ChangeDetectorRef, DestroyRef, signal, computed, effect, ChangeDetectionStrategy, Component } from '@angular/core';
+import * as i1 from '@angular/forms';
+import { FormsModule } from '@angular/forms';
+import { TranslatePipe } from '@ngx-translate/core';
+import { ZIconComponent } from '@shival99/z-ui/components/z-icon';
+import { ZTranslateService, ZOverlayContainerService, ZOverlayZIndexService } from '@shival99/z-ui/services';
+import { zDetectBrowser, zMergeClasses } from '@shival99/z-ui/utils';
+import { NgScrollbar } from 'ngx-scrollbar';
+
+const getOverlayType = () => {
+    const browser = zDetectBrowser();
+    if (browser.name === 'Chrome') {
+        return 'dark';
+    }
+    return 'blur';
+};
+
+class ZCommandComponent {
+    zSelect = output();
+    zAfterClose = output();
+    class = input('', ...(ngDevMode ? [{ debugName: "class" }] : []));
+    zVisible = model(false, ...(ngDevMode ? [{ debugName: "zVisible" }] : []));
+    zPlaceholder = input('i18n_z_ui_command_search', ...(ngDevMode ? [{ debugName: "zPlaceholder" }] : []));
+    zGroups = input([], ...(ngDevMode ? [{ debugName: "zGroups" }] : []));
+    zOverlay = input(getOverlayType(), ...(ngDevMode ? [{ debugName: "zOverlay" }] : []));
+    dummyTemplateRef = viewChild('dummyTemplate', ...(ngDevMode ? [{ debugName: "dummyTemplateRef" }] : []));
+    searchInputRef = viewChild('searchInput', ...(ngDevMode ? [{ debugName: "searchInputRef" }] : []));
+    _platformId = inject(PLATFORM_ID);
+    _host = inject((ElementRef));
+    _overlay = inject(Overlay);
+    _viewContainerRef = inject(ViewContainerRef);
+    _cdr = inject(ChangeDetectorRef);
+    _destroyRef = inject(DestroyRef);
+    _zTranslate = inject(ZTranslateService);
+    _overlayContainerService = inject(ZOverlayContainerService);
+    _zIndexService = inject(ZOverlayZIndexService);
+    _templateOverlayRef = null;
+    _originalParent = null;
+    _originalNextSibling = null;
+    _backdropSubscription = null;
+    _closeTimeout = null;
+    isLeaving = signal(false, ...(ngDevMode ? [{ debugName: "isLeaving" }] : []));
+    shouldRenderContent = computed(() => this.zVisible() || this.isLeaving(), ...(ngDevMode ? [{ debugName: "shouldRenderContent" }] : []));
+    searchQuery = signal('', ...(ngDevMode ? [{ debugName: "searchQuery" }] : []));
+    selectedIndex = signal(0, ...(ngDevMode ? [{ debugName: "selectedIndex" }] : []));
+    filteredGroups = computed(() => {
+        const query = this.searchQuery().toLowerCase().trim();
+        const groups = this.zGroups();
+        if (!query) {
+            let currentIndex = 0;
+            return groups.map(group => {
+                const itemsWithIdx = group.items.map(item => {
+                    const itemWithIdx = { ...item, globalIndex: currentIndex };
+                    currentIndex++;
+                    return itemWithIdx;
+                });
+                return { ...group, items: itemsWithIdx };
+            });
+        }
+        const matchedGroups = groups
+            .map(group => ({
+            ...group,
+            items: group.items.filter(item => item.label.toLowerCase().includes(query) || group.heading.toLowerCase().includes(query)),
+        }))
+            .filter(group => group.items.length > 0);
+        let currentIndex = 0;
+        return matchedGroups.map(group => {
+            const itemsWithIdx = group.items.map(item => {
+                const itemWithIdx = { ...item, globalIndex: currentIndex };
+                currentIndex++;
+                return itemWithIdx;
+            });
+            return { ...group, items: itemsWithIdx };
+        });
+    }, ...(ngDevMode ? [{ debugName: "filteredGroups" }] : []));
+    flattenedItems = computed(() => this.filteredGroups().reduce((acc, group) => acc.concat(group.items), []), ...(ngDevMode ? [{ debugName: "flattenedItems" }] : []));
+    classes = computed(() => zMergeClasses('z-command-dialog border-border bg-popover text-popover-foreground fixed top-[15vh] left-1/2 -translate-x-1/2 w-[calc(100vw-2rem)] sm:w-full max-w-[640px] rounded-xl border shadow-2xl overflow-hidden flex flex-col', this.class()), ...(ngDevMode ? [{ debugName: "classes" }] : []));
+    hostClasses = computed(() => {
+        const baseClasses = this.classes();
+        if (this.shouldRenderContent()) {
+            return `${baseClasses} z-command-template-mode`.trim();
+        }
+        return 'z-command-template-host hidden';
+    }, ...(ngDevMode ? [{ debugName: "hostClasses" }] : []));
+    constructor() {
+        effect(() => {
+            this._zTranslate.currentLang();
+            this._cdr.markForCheck();
+        });
+        effect(() => {
+            const visible = this.zVisible();
+            if (visible && !this._templateOverlayRef) {
+                this._openTemplateOverlay();
+                return;
+            }
+            if (!visible && this._templateOverlayRef && !this.isLeaving()) {
+                this._closeWithAnimation();
+            }
+        });
+        // Reset selectedIndex whenever search query changes
+        effect(() => {
+            this.searchQuery();
+            this.selectedIndex.set(0);
+        });
+    }
+    ngOnDestroy() {
+        this._clearCloseTimeout();
+        this._disposeTemplateOverlay();
+    }
+    isDestroyed() {
+        return this._destroyRef.destroyed;
+    }
+    getNativeElement() {
+        return this._host.nativeElement;
+    }
+    onSearchQueryChange(query) {
+        this.searchQuery.set(query);
+    }
+    onKeyDown(event) {
+        const items = this.flattenedItems();
+        if (!items.length) {
+            if (event.key === 'Escape') {
+                this.close();
+            }
+            return;
+        }
+        if (event.key === 'ArrowDown' || event.key === 'Down') {
+            event.preventDefault();
+            this.selectedIndex.set((this.selectedIndex() + 1) % items.length);
+            this._scrollToSelected();
+            return;
+        }
+        if (event.key === 'ArrowUp' || event.key === 'Up') {
+            event.preventDefault();
+            this.selectedIndex.set((this.selectedIndex() - 1 + items.length) % items.length);
+            this._scrollToSelected();
+            return;
+        }
+        if (event.key === 'Enter') {
+            event.preventDefault();
+            this.selectItem(items[this.selectedIndex()]);
+            return;
+        }
+        if (event.key === 'Escape') {
+            event.preventDefault();
+            this.close();
+            return;
+        }
+    }
+    selectItem(item) {
+        this.zSelect.emit(item);
+        this.close();
+    }
+    open() {
+        this.isLeaving.set(false);
+        this.zVisible.set(true);
+    }
+    close() {
+        this._closeWithAnimation();
+    }
+    _createOverlay() {
+        if (!isPlatformBrowser(this._platformId)) {
+            return null;
+        }
+        const overlayType = this.zOverlay();
+        const backdropClass = overlayType === 'blur' ? 'z-modal-backdrop-blur' : 'z-modal-backdrop-dark';
+        const overlayConfig = new OverlayConfig({
+            hasBackdrop: true,
+            backdropClass,
+            panelClass: 'z-command-overlay-pane',
+            positionStrategy: this._overlay.position().global(),
+            scrollStrategy: this._overlay.scrollStrategies.block(),
+        });
+        return this._overlay.create(overlayConfig);
+    }
+    _openTemplateOverlay() {
+        if (this._templateOverlayRef) {
+            return;
+        }
+        const dummyRef = this.dummyTemplateRef();
+        if (!dummyRef) {
+            return;
+        }
+        this._templateOverlayRef = this._createOverlay();
+        if (!this._templateOverlayRef) {
+            return;
+        }
+        this._zIndexService.applyToOverlay(this._templateOverlayRef);
+        this._zIndexService.deferMoveToTop(this._templateOverlayRef);
+        const hostElement = this._host.nativeElement;
+        this._originalParent = hostElement.parentElement;
+        this._originalNextSibling = hostElement.nextSibling;
+        const portal = new TemplatePortal(dummyRef, this._viewContainerRef);
+        this._templateOverlayRef.attach(portal);
+        const overlayPane = this._templateOverlayRef.overlayElement;
+        overlayPane.style.position = 'static';
+        overlayPane.appendChild(hostElement);
+        this._backdropSubscription = this._templateOverlayRef.backdropClick().subscribe(() => {
+            this.close();
+        });
+        this.searchQuery.set('');
+        this.selectedIndex.set(0);
+        // Focus input after render
+        setTimeout(() => {
+            const inputEl = this.searchInputRef()?.nativeElement;
+            if (inputEl) {
+                inputEl.focus();
+            }
+        }, 100);
+    }
+    _closeWithAnimation() {
+        if (this.isLeaving()) {
+            return;
+        }
+        this._overlayContainerService.notifyClosing();
+        this.isLeaving.set(true);
+        this.zVisible.set(false);
+        const hostElement = this._host.nativeElement;
+        const { backdropElement } = this._templateOverlayRef ?? {};
+        if (backdropElement) {
+            backdropElement.classList.add('z-backdrop-leaving');
+        }
+        hostElement.classList.add('command-leave');
+        this._clearCloseTimeout();
+        this._closeTimeout = setTimeout(() => {
+            if (this._destroyRef.destroyed) {
+                return;
+            }
+            this.isLeaving.set(false);
+            this._disposeTemplateOverlay();
+            this.zAfterClose.emit();
+        }, 150);
+    }
+    _clearCloseTimeout() {
+        if (!this._closeTimeout) {
+            return;
+        }
+        clearTimeout(this._closeTimeout);
+        this._closeTimeout = null;
+    }
+    _disposeTemplateOverlay() {
+        const hostElement = this._host.nativeElement;
+        if (this._originalParent && this._originalNextSibling) {
+            this._originalParent.insertBefore(hostElement, this._originalNextSibling);
+        }
+        if (this._originalParent && !this._originalNextSibling) {
+            this._originalParent.appendChild(hostElement);
+        }
+        hostElement.classList.remove('command-leave');
+        if (this._templateOverlayRef) {
+            this._templateOverlayRef.dispose();
+            this._templateOverlayRef = null;
+        }
+        this._originalParent = null;
+        this._originalNextSibling = null;
+        if (this._backdropSubscription) {
+            this._backdropSubscription.unsubscribe();
+            this._backdropSubscription = null;
+        }
+    }
+    _scrollToSelected() {
+        setTimeout(() => {
+            const scrollbar = this._host.nativeElement.querySelector('ng-scrollbar');
+            const viewport = scrollbar?.querySelector('.ng-scroll-viewport');
+            const selected = scrollbar?.querySelector('.z-command-item-active');
+            if (!viewport || !selected) {
+                return;
+            }
+            const cTop = viewport.scrollTop;
+            const cBottom = cTop + viewport.clientHeight;
+            const sTop = selected.offsetTop;
+            const sBottom = sTop + selected.clientHeight;
+            if (sTop < cTop) {
+                viewport.scrollTop = sTop;
+                return;
+            }
+            if (sBottom > cBottom) {
+                viewport.scrollTop = sBottom - viewport.clientHeight;
+                return;
+            }
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZCommandComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: ZCommandComponent, isStandalone: true, selector: "z-command", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zVisible: { classPropertyName: "zVisible", publicName: "zVisible", isSignal: true, isRequired: false, transformFunction: null }, zPlaceholder: { classPropertyName: "zPlaceholder", publicName: "zPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, zGroups: { classPropertyName: "zGroups", publicName: "zGroups", isSignal: true, isRequired: false, transformFunction: null }, zOverlay: { classPropertyName: "zOverlay", publicName: "zOverlay", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zSelect: "zSelect", zAfterClose: "zAfterClose", zVisible: "zVisibleChange" }, host: { properties: { "class": "hostClasses()" } }, viewQueries: [{ propertyName: "dummyTemplateRef", first: true, predicate: ["dummyTemplate"], descendants: true, isSignal: true }, { propertyName: "searchInputRef", first: true, predicate: ["searchInput"], descendants: true, isSignal: true }], exportAs: ["zCommand"], ngImport: i0, template: "<ng-template #dummyTemplate />\n\n@if (shouldRenderContent()) {\n  <div class=\"z-command-wrapper flex h-full w-full flex-col\">\n    <!-- Search Bar -->\n    <div class=\"border-border/40 bg-popover flex items-center border-b px-4 py-2\">\n      <z-icon zType=\"lucideSearch\" zSize=\"16\" class=\"text-muted-foreground mr-2.5 opacity-75\" />\n      <input\n        type=\"text\"\n        [placeholder]=\"zPlaceholder() | translate\"\n        [ngModel]=\"searchQuery()\"\n        (ngModelChange)=\"onSearchQueryChange($event)\"\n        (keydown)=\"onKeyDown($event)\"\n        class=\"placeholder:text-muted-foreground/60 flex h-9 w-full border-0 bg-transparent text-sm ring-0 outline-none focus:ring-0 focus:outline-none\"\n        #searchInput />\n      <kbd\n        class=\"border-border/60 bg-muted text-muted-foreground hidden h-5 items-center gap-0.5 rounded border px-1.5 font-mono text-[9px] font-medium opacity-100 select-none sm:inline-flex\">\n        <span>ESC</span>\n      </kbd>\n    </div>\n\n    <!-- Scrollable Results List using NgScrollbar -->\n    <ng-scrollbar class=\"z-command-scrollbar max-h-[330px]\" visibility=\"hover\" track=\"vertical\">\n      <div class=\"space-y-1 p-2\">\n        @if (flattenedItems().length === 0) {\n          <div class=\"text-muted-foreground py-6 text-center text-sm\">\n            {{ 'i18n_z_ui_command_no_results' | translate }}\n          </div>\n        } @else {\n          @for (group of filteredGroups(); track group.heading; let isFirst = $first) {\n            @if (!isFirst) {\n              <div class=\"border-border/40 -mx-2 my-1.5 border-t\"></div>\n            }\n\n            <div\n              class=\"text-muted-foreground/60 px-3 py-1.5 text-[10px] font-bold tracking-wider uppercase select-none\">\n              {{ group.heading }}\n            </div>\n\n            <div class=\"space-y-0.5\">\n              @for (item of group.items; track item.id) {\n                <div\n                  class=\"z-command-item flex cursor-pointer items-center justify-between rounded-md px-3 py-2 text-xs transition-colors select-none\"\n                  [class.z-command-item-active]=\"item.globalIndex === selectedIndex()\"\n                  (mouseenter)=\"selectedIndex.set(item.globalIndex ?? 0)\"\n                  (click)=\"selectItem(item)\">\n                  <div class=\"flex items-center gap-2.5\">\n                    @if (item.icon) {\n                      <z-icon [zType]=\"item.icon\" zSize=\"14\" class=\"opacity-80\" />\n                    }\n                    <span>{{ item.label }}</span>\n                  </div>\n\n                  @if (item.shortcut) {\n                    <kbd\n                      class=\"text-muted-foreground bg-muted/50 border-border/40 rounded border px-1 font-mono text-[9px]\">\n                      {{ item.shortcut }}\n                    </kbd>\n                  }\n                </div>\n              }\n            </div>\n          }\n        }\n      </div>\n    </ng-scrollbar>\n  </div>\n}\n", styles: [":host.z-command-template-mode{--z-enter-opacity: 0;--z-enter-scale: .97;transform-origin:center center;animation:z-enter .18s cubic-bezier(.16,1,.3,1) forwards}:host.z-command-template-mode.command-leave{--z-exit-opacity: 0;--z-exit-scale: .97;transform-origin:center center;animation:z-exit .15s cubic-bezier(.4,0,1,1) forwards}:host.z-command-template-host{display:contents}.z-command-item{color:hsl(var(--foreground)/.85);transition:background-color .12s ease,color .12s ease}.z-command-item:hover,.z-command-item.z-command-item-active{background-color:color-mix(in srgb,var(--primary) 12%,transparent)!important;color:var(--primary)!important}ng-scrollbar.z-command-scrollbar{max-height:330px;display:block}::ng-deep .z-modal-backdrop-dark{background-color:#0009;animation:z-backdrop-enter .15s ease-out forwards}::ng-deep .z-modal-backdrop-blur{background-color:#0000000d;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);animation:z-backdrop-enter .15s ease-out forwards}::ng-deep .z-modal-backdrop-dark.z-backdrop-leaving,::ng-deep .z-modal-backdrop-blur.z-backdrop-leaving{animation:z-backdrop-exit .12s ease-in forwards}\n"], dependencies: [{ kind: "ngmodule", type: PortalModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zAnimatedType", "zAnimate", "zAnimationTrigger", "zSize", "zStrokeWidth", "zSvg"] }, { kind: "component", type: NgScrollbar, selector: "ng-scrollbar:not([externalViewport]), [ngScrollbar]", exportAs: ["ngScrollbar"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZCommandComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'z-command', imports: [PortalModule, FormsModule, ZIconComponent, TranslatePipe, NgScrollbar], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        '[class]': 'hostClasses()',
+                    }, exportAs: 'zCommand', template: "<ng-template #dummyTemplate />\n\n@if (shouldRenderContent()) {\n  <div class=\"z-command-wrapper flex h-full w-full flex-col\">\n    <!-- Search Bar -->\n    <div class=\"border-border/40 bg-popover flex items-center border-b px-4 py-2\">\n      <z-icon zType=\"lucideSearch\" zSize=\"16\" class=\"text-muted-foreground mr-2.5 opacity-75\" />\n      <input\n        type=\"text\"\n        [placeholder]=\"zPlaceholder() | translate\"\n        [ngModel]=\"searchQuery()\"\n        (ngModelChange)=\"onSearchQueryChange($event)\"\n        (keydown)=\"onKeyDown($event)\"\n        class=\"placeholder:text-muted-foreground/60 flex h-9 w-full border-0 bg-transparent text-sm ring-0 outline-none focus:ring-0 focus:outline-none\"\n        #searchInput />\n      <kbd\n        class=\"border-border/60 bg-muted text-muted-foreground hidden h-5 items-center gap-0.5 rounded border px-1.5 font-mono text-[9px] font-medium opacity-100 select-none sm:inline-flex\">\n        <span>ESC</span>\n      </kbd>\n    </div>\n\n    <!-- Scrollable Results List using NgScrollbar -->\n    <ng-scrollbar class=\"z-command-scrollbar max-h-[330px]\" visibility=\"hover\" track=\"vertical\">\n      <div class=\"space-y-1 p-2\">\n        @if (flattenedItems().length === 0) {\n          <div class=\"text-muted-foreground py-6 text-center text-sm\">\n            {{ 'i18n_z_ui_command_no_results' | translate }}\n          </div>\n        } @else {\n          @for (group of filteredGroups(); track group.heading; let isFirst = $first) {\n            @if (!isFirst) {\n              <div class=\"border-border/40 -mx-2 my-1.5 border-t\"></div>\n            }\n\n            <div\n              class=\"text-muted-foreground/60 px-3 py-1.5 text-[10px] font-bold tracking-wider uppercase select-none\">\n              {{ group.heading }}\n            </div>\n\n            <div class=\"space-y-0.5\">\n              @for (item of group.items; track item.id) {\n                <div\n                  class=\"z-command-item flex cursor-pointer items-center justify-between rounded-md px-3 py-2 text-xs transition-colors select-none\"\n                  [class.z-command-item-active]=\"item.globalIndex === selectedIndex()\"\n                  (mouseenter)=\"selectedIndex.set(item.globalIndex ?? 0)\"\n                  (click)=\"selectItem(item)\">\n                  <div class=\"flex items-center gap-2.5\">\n                    @if (item.icon) {\n                      <z-icon [zType]=\"item.icon\" zSize=\"14\" class=\"opacity-80\" />\n                    }\n                    <span>{{ item.label }}</span>\n                  </div>\n\n                  @if (item.shortcut) {\n                    <kbd\n                      class=\"text-muted-foreground bg-muted/50 border-border/40 rounded border px-1 font-mono text-[9px]\">\n                      {{ item.shortcut }}\n                    </kbd>\n                  }\n                </div>\n              }\n            </div>\n          }\n        }\n      </div>\n    </ng-scrollbar>\n  </div>\n}\n", styles: [":host.z-command-template-mode{--z-enter-opacity: 0;--z-enter-scale: .97;transform-origin:center center;animation:z-enter .18s cubic-bezier(.16,1,.3,1) forwards}:host.z-command-template-mode.command-leave{--z-exit-opacity: 0;--z-exit-scale: .97;transform-origin:center center;animation:z-exit .15s cubic-bezier(.4,0,1,1) forwards}:host.z-command-template-host{display:contents}.z-command-item{color:hsl(var(--foreground)/.85);transition:background-color .12s ease,color .12s ease}.z-command-item:hover,.z-command-item.z-command-item-active{background-color:color-mix(in srgb,var(--primary) 12%,transparent)!important;color:var(--primary)!important}ng-scrollbar.z-command-scrollbar{max-height:330px;display:block}::ng-deep .z-modal-backdrop-dark{background-color:#0009;animation:z-backdrop-enter .15s ease-out forwards}::ng-deep .z-modal-backdrop-blur{background-color:#0000000d;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);animation:z-backdrop-enter .15s ease-out forwards}::ng-deep .z-modal-backdrop-dark.z-backdrop-leaving,::ng-deep .z-modal-backdrop-blur.z-backdrop-leaving{animation:z-backdrop-exit .12s ease-in forwards}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { zSelect: [{ type: i0.Output, args: ["zSelect"] }], zAfterClose: [{ type: i0.Output, args: ["zAfterClose"] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], zVisible: [{ type: i0.Input, args: [{ isSignal: true, alias: "zVisible", required: false }] }, { type: i0.Output, args: ["zVisibleChange"] }], zPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "zPlaceholder", required: false }] }], zGroups: [{ type: i0.Input, args: [{ isSignal: true, alias: "zGroups", required: false }] }], zOverlay: [{ type: i0.Input, args: [{ isSignal: true, alias: "zOverlay", required: false }] }], dummyTemplateRef: [{ type: i0.ViewChild, args: ['dummyTemplate', { isSignal: true }] }], searchInputRef: [{ type: i0.ViewChild, args: ['searchInput', { isSignal: true }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ZCommandComponent, getOverlayType };
+//# sourceMappingURL=shival99-z-ui-components-z-command.mjs.map

package/fesm2022/shival99-z-ui-components-z-command.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"shival99-z-ui-components-z-command.mjs","sources":["../../../../libs/core-ui/components/z-command/z-command.define.ts","../../../../libs/core-ui/components/z-command/z-command.component.ts","../../../../libs/core-ui/components/z-command/z-command.component.html","../../../../libs/core-ui/components/z-command/shival99-z-ui-components-z-command.ts"],"sourcesContent":["import { zDetectBrowser } from '@shival99/z-ui/utils';\n\nexport const getOverlayType = (): 'dark' | 'blur' => {\n  const browser = zDetectBrowser();\n  if (browser.name === 'Chrome') {\n    return 'dark';\n  }\n  return 'blur';\n};\n","import { Overlay, OverlayConfig, OverlayRef } from '@angular/cdk/overlay';\nimport { PortalModule, TemplatePortal } from '@angular/cdk/portal';\nimport { isPlatformBrowser } from '@angular/common';\nimport {\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  computed,\n  DestroyRef,\n  effect,\n  ElementRef,\n  inject,\n  input,\n  model,\n  OnDestroy,\n  output,\n  PLATFORM_ID,\n  signal,\n  type TemplateRef,\n  viewChild,\n  ViewContainerRef,\n} from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { TranslatePipe } from '@ngx-translate/core';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { ZOverlayContainerService, ZOverlayZIndexService, ZTranslateService } from '@shival99/z-ui/services';\nimport { zMergeClasses } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport { NgScrollbar } from 'ngx-scrollbar';\nimport { Subscription } from 'rxjs';\nimport { getOverlayType } from './z-command.define';\nimport { ZCommandGroup, ZCommandItem } from './z-command.types';\n\n@Component({\n  selector: 'z-command',\n  imports: [PortalModule, FormsModule, ZIconComponent, TranslatePipe, NgScrollbar],\n  standalone: true,\n  templateUrl: './z-command.component.html',\n  styleUrl: './z-command.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    '[class]': 'hostClasses()',\n  },\n  exportAs: 'zCommand',\n})\nexport class ZCommandComponent implements OnDestroy {\n  public readonly zSelect = output<ZCommandItem>();\n  public readonly zAfterClose = output<void>();\n\n  public readonly class = input<ClassValue>('');\n  public readonly zVisible = model<boolean>(false);\n  public readonly zPlaceholder = input<string>('i18n_z_ui_command_search');\n  public readonly zGroups = input<ZCommandGroup[]>([]);\n  public readonly zOverlay = input<'dark' | 'blur'>(getOverlayType());\n\n  protected readonly dummyTemplateRef = viewChild<TemplateRef<unknown>>('dummyTemplate');\n  protected readonly searchInputRef = viewChild<ElementRef<HTMLInputElement>>('searchInput');\n\n  private readonly _platformId = inject(PLATFORM_ID);\n  private readonly _host = inject(ElementRef<HTMLElement>);\n  private readonly _overlay = inject(Overlay);\n  private readonly _viewContainerRef = inject(ViewContainerRef);\n  private readonly _cdr = inject(ChangeDetectorRef);\n  private readonly _destroyRef = inject(DestroyRef);\n  private readonly _zTranslate = inject(ZTranslateService);\n  private readonly _overlayContainerService = inject(ZOverlayContainerService);\n  private readonly _zIndexService = inject(ZOverlayZIndexService);\n\n  private _templateOverlayRef: OverlayRef | null = null;\n  private _originalParent: HTMLElement | null = null;\n  private _originalNextSibling: Node | null = null;\n  private _backdropSubscription: Subscription | null = null;\n  private _closeTimeout: ReturnType<typeof setTimeout> | null = null;\n\n  protected readonly isLeaving = signal(false);\n  protected readonly shouldRenderContent = computed(() => this.zVisible() || this.isLeaving());\n  protected readonly searchQuery = signal('');\n  protected readonly selectedIndex = signal(0);\n\n  protected readonly filteredGroups = computed(() => {\n    const query = this.searchQuery().toLowerCase().trim();\n    const groups = this.zGroups();\n\n    if (!query) {\n      let currentIndex = 0;\n      return groups.map(group => {\n        const itemsWithIdx = group.items.map(item => {\n          const itemWithIdx = { ...item, globalIndex: currentIndex };\n          currentIndex++;\n          return itemWithIdx;\n        });\n        return { ...group, items: itemsWithIdx };\n      });\n    }\n\n    const matchedGroups = groups\n      .map(group => ({\n        ...group,\n        items: group.items.filter(\n          item => item.label.toLowerCase().includes(query) || group.heading.toLowerCase().includes(query)\n        ),\n      }))\n      .filter(group => group.items.length > 0);\n\n    let currentIndex = 0;\n    return matchedGroups.map(group => {\n      const itemsWithIdx = group.items.map(item => {\n        const itemWithIdx = { ...item, globalIndex: currentIndex };\n        currentIndex++;\n        return itemWithIdx;\n      });\n      return { ...group, items: itemsWithIdx };\n    });\n  });\n\n  protected readonly flattenedItems = computed(() =>\n    this.filteredGroups().reduce<ZCommandItem[]>((acc, group) => acc.concat(group.items), [])\n  );\n\n  protected readonly classes = computed(() =>\n    zMergeClasses(\n      'z-command-dialog border-border bg-popover text-popover-foreground fixed top-[15vh] left-1/2 -translate-x-1/2 w-[calc(100vw-2rem)] sm:w-full max-w-[640px] rounded-xl border shadow-2xl overflow-hidden flex flex-col',\n      this.class()\n    )\n  );\n\n  protected readonly hostClasses = computed(() => {\n    const baseClasses = this.classes();\n    if (this.shouldRenderContent()) {\n      return `${baseClasses} z-command-template-mode`.trim();\n    }\n    return 'z-command-template-host hidden';\n  });\n\n  constructor() {\n    effect(() => {\n      this._zTranslate.currentLang();\n      this._cdr.markForCheck();\n    });\n\n    effect(() => {\n      const visible = this.zVisible();\n      if (visible && !this._templateOverlayRef) {\n        this._openTemplateOverlay();\n        return;\n      }\n\n      if (!visible && this._templateOverlayRef && !this.isLeaving()) {\n        this._closeWithAnimation();\n      }\n    });\n\n    // Reset selectedIndex whenever search query changes\n    effect(() => {\n      this.searchQuery();\n      this.selectedIndex.set(0);\n    });\n  }\n\n  public ngOnDestroy(): void {\n    this._clearCloseTimeout();\n    this._disposeTemplateOverlay();\n  }\n\n  public isDestroyed(): boolean {\n    return this._destroyRef.destroyed;\n  }\n\n  public getNativeElement(): HTMLElement {\n    return this._host.nativeElement;\n  }\n\n  public onSearchQueryChange(query: string): void {\n    this.searchQuery.set(query);\n  }\n\n  public onKeyDown(event: KeyboardEvent): void {\n    const items = this.flattenedItems();\n    if (!items.length) {\n      if (event.key === 'Escape') {\n        this.close();\n      }\n      return;\n    }\n\n    if (event.key === 'ArrowDown' || event.key === 'Down') {\n      event.preventDefault();\n      this.selectedIndex.set((this.selectedIndex() + 1) % items.length);\n      this._scrollToSelected();\n      return;\n    }\n    if (event.key === 'ArrowUp' || event.key === 'Up') {\n      event.preventDefault();\n      this.selectedIndex.set((this.selectedIndex() - 1 + items.length) % items.length);\n      this._scrollToSelected();\n      return;\n    }\n    if (event.key === 'Enter') {\n      event.preventDefault();\n      this.selectItem(items[this.selectedIndex()]);\n      return;\n    }\n    if (event.key === 'Escape') {\n      event.preventDefault();\n      this.close();\n      return;\n    }\n  }\n\n  protected selectItem(item: ZCommandItem): void {\n    this.zSelect.emit(item);\n    this.close();\n  }\n\n  public open(): void {\n    this.isLeaving.set(false);\n    this.zVisible.set(true);\n  }\n\n  public close(): void {\n    this._closeWithAnimation();\n  }\n\n  private _createOverlay(): OverlayRef | null {\n    if (!isPlatformBrowser(this._platformId)) {\n      return null;\n    }\n\n    const overlayType = this.zOverlay();\n    const backdropClass = overlayType === 'blur' ? 'z-modal-backdrop-blur' : 'z-modal-backdrop-dark';\n    const overlayConfig = new OverlayConfig({\n      hasBackdrop: true,\n      backdropClass,\n      panelClass: 'z-command-overlay-pane',\n      positionStrategy: this._overlay.position().global(),\n      scrollStrategy: this._overlay.scrollStrategies.block(),\n    });\n\n    return this._overlay.create(overlayConfig);\n  }\n\n  private _openTemplateOverlay(): void {\n    if (this._templateOverlayRef) {\n      return;\n    }\n\n    const dummyRef = this.dummyTemplateRef();\n    if (!dummyRef) {\n      return;\n    }\n\n    this._templateOverlayRef = this._createOverlay();\n    if (!this._templateOverlayRef) {\n      return;\n    }\n\n    this._zIndexService.applyToOverlay(this._templateOverlayRef);\n    this._zIndexService.deferMoveToTop(this._templateOverlayRef);\n\n    const hostElement = this._host.nativeElement;\n    this._originalParent = hostElement.parentElement;\n    this._originalNextSibling = hostElement.nextSibling;\n\n    const portal = new TemplatePortal(dummyRef, this._viewContainerRef);\n    this._templateOverlayRef.attach(portal);\n\n    const overlayPane = this._templateOverlayRef.overlayElement;\n    overlayPane.style.position = 'static';\n    overlayPane.appendChild(hostElement);\n\n    this._backdropSubscription = this._templateOverlayRef.backdropClick().subscribe(() => {\n      this.close();\n    });\n\n    this.searchQuery.set('');\n    this.selectedIndex.set(0);\n\n    // Focus input after render\n    setTimeout(() => {\n      const inputEl = this.searchInputRef()?.nativeElement;\n      if (inputEl) {\n        inputEl.focus();\n      }\n    }, 100);\n  }\n\n  private _closeWithAnimation(): void {\n    if (this.isLeaving()) {\n      return;\n    }\n\n    this._overlayContainerService.notifyClosing();\n    this.isLeaving.set(true);\n    this.zVisible.set(false);\n\n    const hostElement = this._host.nativeElement;\n    const { backdropElement } = this._templateOverlayRef ?? {};\n\n    if (backdropElement) {\n      backdropElement.classList.add('z-backdrop-leaving');\n    }\n\n    hostElement.classList.add('command-leave');\n\n    this._clearCloseTimeout();\n    this._closeTimeout = setTimeout(() => {\n      if (this._destroyRef.destroyed) {\n        return;\n      }\n\n      this.isLeaving.set(false);\n      this._disposeTemplateOverlay();\n      this.zAfterClose.emit();\n    }, 150);\n  }\n\n  private _clearCloseTimeout(): void {\n    if (!this._closeTimeout) {\n      return;\n    }\n\n    clearTimeout(this._closeTimeout);\n    this._closeTimeout = null;\n  }\n\n  private _disposeTemplateOverlay(): void {\n    const hostElement = this._host.nativeElement;\n\n    if (this._originalParent && this._originalNextSibling) {\n      this._originalParent.insertBefore(hostElement, this._originalNextSibling);\n    }\n\n    if (this._originalParent && !this._originalNextSibling) {\n      this._originalParent.appendChild(hostElement);\n    }\n\n    hostElement.classList.remove('command-leave');\n    if (this._templateOverlayRef) {\n      this._templateOverlayRef.dispose();\n      this._templateOverlayRef = null;\n    }\n\n    this._originalParent = null;\n    this._originalNextSibling = null;\n\n    if (this._backdropSubscription) {\n      this._backdropSubscription.unsubscribe();\n      this._backdropSubscription = null;\n    }\n  }\n\n  private _scrollToSelected(): void {\n    setTimeout(() => {\n      const scrollbar = this._host.nativeElement.querySelector('ng-scrollbar');\n      const viewport = scrollbar?.querySelector('.ng-scroll-viewport') as HTMLElement;\n      const selected = scrollbar?.querySelector('.z-command-item-active') as HTMLElement;\n      if (!viewport || !selected) {\n        return;\n      }\n      const cTop = viewport.scrollTop;\n      const cBottom = cTop + viewport.clientHeight;\n      const sTop = selected.offsetTop;\n      const sBottom = sTop + selected.clientHeight;\n\n      if (sTop < cTop) {\n        viewport.scrollTop = sTop;\n        return;\n      }\n      if (sBottom > cBottom) {\n        viewport.scrollTop = sBottom - viewport.clientHeight;\n        return;\n      }\n    });\n  }\n}\n","<ng-template #dummyTemplate />\n\n@if (shouldRenderContent()) {\n  <div class=\"z-command-wrapper flex h-full w-full flex-col\">\n    <!-- Search Bar -->\n    <div class=\"border-border/40 bg-popover flex items-center border-b px-4 py-2\">\n      <z-icon zType=\"lucideSearch\" zSize=\"16\" class=\"text-muted-foreground mr-2.5 opacity-75\" />\n      <input\n        type=\"text\"\n        [placeholder]=\"zPlaceholder() | translate\"\n        [ngModel]=\"searchQuery()\"\n        (ngModelChange)=\"onSearchQueryChange($event)\"\n        (keydown)=\"onKeyDown($event)\"\n        class=\"placeholder:text-muted-foreground/60 flex h-9 w-full border-0 bg-transparent text-sm ring-0 outline-none focus:ring-0 focus:outline-none\"\n        #searchInput />\n      <kbd\n        class=\"border-border/60 bg-muted text-muted-foreground hidden h-5 items-center gap-0.5 rounded border px-1.5 font-mono text-[9px] font-medium opacity-100 select-none sm:inline-flex\">\n        <span>ESC</span>\n      </kbd>\n    </div>\n\n    <!-- Scrollable Results List using NgScrollbar -->\n    <ng-scrollbar class=\"z-command-scrollbar max-h-[330px]\" visibility=\"hover\" track=\"vertical\">\n      <div class=\"space-y-1 p-2\">\n        @if (flattenedItems().length === 0) {\n          <div class=\"text-muted-foreground py-6 text-center text-sm\">\n            {{ 'i18n_z_ui_command_no_results' | translate }}\n          </div>\n        } @else {\n          @for (group of filteredGroups(); track group.heading; let isFirst = $first) {\n            @if (!isFirst) {\n              <div class=\"border-border/40 -mx-2 my-1.5 border-t\"></div>\n            }\n\n            <div\n              class=\"text-muted-foreground/60 px-3 py-1.5 text-[10px] font-bold tracking-wider uppercase select-none\">\n              {{ group.heading }}\n            </div>\n\n            <div class=\"space-y-0.5\">\n              @for (item of group.items; track item.id) {\n                <div\n                  class=\"z-command-item flex cursor-pointer items-center justify-between rounded-md px-3 py-2 text-xs transition-colors select-none\"\n                  [class.z-command-item-active]=\"item.globalIndex === selectedIndex()\"\n                  (mouseenter)=\"selectedIndex.set(item.globalIndex ?? 0)\"\n                  (click)=\"selectItem(item)\">\n                  <div class=\"flex items-center gap-2.5\">\n                    @if (item.icon) {\n                      <z-icon [zType]=\"item.icon\" zSize=\"14\" class=\"opacity-80\" />\n                    }\n                    <span>{{ item.label }}</span>\n                  </div>\n\n                  @if (item.shortcut) {\n                    <kbd\n                      class=\"text-muted-foreground bg-muted/50 border-border/40 rounded border px-1 font-mono text-[9px]\">\n                      {{ item.shortcut }}\n                    </kbd>\n                  }\n                </div>\n              }\n            </div>\n          }\n        }\n      </div>\n    </ng-scrollbar>\n  </div>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}