tango-app-ui-manage-tickets 3.7.0-beta.4 → 3.7.0-beta.40

package/esm2022/lib/components/custom-select/custom-select.component.mjs

@@ -0,0 +1,174 @@
+import { ChangeDetectionStrategy, Component, EventEmitter, HostListener, Input, Output } from '@angular/core';
+import * as i0 from "@angular/core";
+import * as i1 from "../../services/ticket.service";
+import * as i2 from "@angular/common";
+import * as i3 from "@angular/forms";
+// import { ManageUsersService } from '../../services-v2/manage-users.service';
+export class CustomSelectComponent {
+    cd;
+    authService;
+    onClick(event) {
+        const target = event.target;
+        if (!target.closest('.dropdown')) {
+            this.showDropdown = false;
+        }
+    }
+    items;
+    searchField;
+    multi;
+    idField;
+    selectedValues = [];
+    disabled;
+    label;
+    selected = new EventEmitter();
+    filteredValues = [];
+    showDropdown;
+    searchValue;
+    instanceId;
+    constructor(cd, authService) {
+        this.cd = cd;
+        this.authService = authService;
+    }
+    ngOnInit() {
+        this.instanceId = crypto.randomUUID();
+        this.authService.dropDownTrigger.subscribe((e) => {
+            if (e !== this.instanceId) {
+                this.showDropdown = false;
+                this.cd.detectChanges();
+            }
+        });
+    }
+    ngOnChanges(changes) {
+        if (changes['items'] && this.items?.length) {
+            this.initializeItems();
+        }
+        if (changes['selectedValues'] && Array.isArray(changes['selectedValues']?.currentValue) && changes['selectedValues']?.currentValue?.length > 0 && changes['selectedValues']?.currentValue[0]) {
+            this.updateSelectedValues();
+        }
+    }
+    initializeItems() {
+        this.filteredValues = this.items.map((item) => ({ ...item }));
+        this.updateSelectedValues();
+    }
+    updateSelectedValues() {
+        this.selectedValues?.forEach((selectedItem) => {
+            const item = this.filteredValues?.find((filteredItem) => filteredItem?.[this.idField] === selectedItem?.[this.idField]);
+            if (item) {
+                item.isSelected = true;
+            }
+        });
+    }
+    openDropdown(event) {
+        this.authService.dropDownTrigger.next(this.instanceId);
+        event.stopPropagation();
+        this.showDropdown = !this.showDropdown;
+    }
+    onInput(event) {
+        if (!event.target.value) {
+            this.filteredValues = [...this.items];
+        }
+        else {
+            const searchTerm = event.target.value.toLowerCase();
+            this.filteredValues = this.items.filter((item) => item[this.searchField].toLowerCase().includes(searchTerm));
+        }
+        this.updateSelectedValues();
+        this.cd.detectChanges();
+    }
+    onSelect(event, item) {
+        if (this.multi) {
+            if (event.currentTarget.checked) {
+                this.selectedValues.push(item);
+            }
+            else {
+                this.selectedValues = this.selectedValues.filter((elem) => elem[this.idField] !== item[this.idField]);
+            }
+        }
+        else {
+            this.selectedValues = [{ ...item }];
+            this.filteredValues.forEach((element) => {
+                if (element[this.idField] !== item[this.idField]) {
+                    element.isSelected = false;
+                }
+            });
+            this.showDropdown = false;
+        }
+        const valuesToEmit = this.selectedValues.map((value) => {
+            const selectedItem = { ...value };
+            delete selectedItem.isSelected;
+            return selectedItem;
+        });
+        this.cd.detectChanges();
+        this.emitSelectedValues(valuesToEmit);
+    }
+    onSelectAll(event) {
+        const selectAll = event.currentTarget.checked;
+        this.filteredValues.forEach((item) => item.isSelected = selectAll);
+        if (selectAll) {
+            this.selectedValues = [...this.filteredValues];
+        }
+        else {
+            this.selectedValues = [];
+        }
+        const valuesToEmit = this.selectedValues.map((value) => {
+            const { isSelected, ...selectedItem } = value;
+            return selectedItem;
+        });
+        this.cd.detectChanges();
+        this.emitSelectedValues(valuesToEmit);
+    }
+    emitSelectedValues(values) {
+        if (this.multi) {
+            this.selected.emit(values);
+        }
+        else {
+            this.selected.emit(values[0]);
+        }
+    }
+    checkIfAllSelected() {
+        return this.filteredValues.every((item) => item.isSelected);
+    }
+    onItemClick(item, event) {
+        event.stopPropagation();
+        // For multi-select, row click should not do anything special;
+        // checkbox + onSelect already handle it
+        if (this.multi) {
+            return;
+        }
+        // Mark this item as selected so UI highlights it
+        item.isSelected = true;
+        // Fake an event with `currentTarget.checked = true`
+        const fakeEvent = {
+            currentTarget: {
+                checked: true
+            }
+        };
+        // Reuse your existing logic
+        this.onSelect(fakeEvent, item);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CustomSelectComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.TicketService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CustomSelectComponent, selector: "team-select", inputs: { items: "items", searchField: "searchField", multi: "multi", idField: "idField", selectedValues: "selectedValues", disabled: "disabled", label: "label" }, outputs: { selected: "selected" }, host: { listeners: { "document:click": "onClick($event)" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"outer-container\">\r\n  <!-- TRIGGER -->\r\n  <div\r\n    [ngClass]=\"disabled ? 'disable-input' : ''\"\r\n    class=\"select-trigger form-select\"\r\n    (click)=\"openDropdown($event)\"\r\n  >\r\n    <ng-container *ngIf=\"multi; else singleMode\">\r\n      <span *ngIf=\"selectedValues?.length\" class=\"select-value mx-2\">\r\n        <!-- <img class=\"me-2 trigger-avatar\" alt=\"Pic\" src=\"./assets/tango/Image/users-teams.svg\" /> -->\r\n        {{ selectedValues?.[0]?.[searchField] }}\r\n      </span>\r\n      <span class=\"select-value mx-2\" *ngIf=\"selectedValues?.length > 1\">\r\n        +{{ selectedValues?.length - 1 }}\r\n      </span>\r\n      <span  *ngIf=\"!selectedValues?.length\">{{ label  || 'Select' }}</span>\r\n    </ng-container>\r\n\r\n    <ng-template #singleMode>\r\n      <span *ngIf=\"selectedValues?.[0]; else placeholderSingle\">\r\n        {{ selectedValues?.[0]?.[searchField] || 'Select' }}\r\n      </span>\r\n      <ng-template #placeholderSingle>\r\n        <span >{{ label || 'Select' }}</span>\r\n      </ng-template>\r\n    </ng-template>\r\n\r\n\r\n  </div>\r\n\r\n  <!-- DROPDOWN PANEL -->\r\n  <div\r\n    class=\"input-container dropdown\"\r\n    [ngClass]=\"showDropdown ? '' : 'd-none'\"\r\n    (click)=\"$event.stopPropagation()\"\r\n  >\r\n    <!-- Search -->\r\n    <div class=\"w-100 input-wrapper\">\r\n      <input\r\n        [(ngModel)]=\"searchValue\"\r\n        placeholder=\"Search\"\r\n        (input)=\"onInput($event)\"\r\n        type=\"text\"\r\n      />\r\n      <svg\r\n        class=\"search-icon\"\r\n        xmlns=\"http://www.w3.org/2000/svg\"\r\n        width=\"16\"\r\n        height=\"17\"\r\n        viewBox=\"0 0 16 17\"\r\n        fill=\"none\"\r\n      >\r\n        <path\r\n          d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\"\r\n          stroke=\"#667085\"\r\n          stroke-width=\"1.3\"\r\n          stroke-linecap=\"round\"\r\n          stroke-linejoin=\"round\"\r\n        />\r\n      </svg>\r\n    </div>\r\n\r\n    <ul>\r\n      <!-- Select all (multi mode only) -->\r\n      <li *ngIf=\"multi && filteredValues?.length\">\r\n        <label class=\"form-check\" [for]=\"instanceId\">\r\n          <input\r\n            (change)=\"onSelectAll($event)\"\r\n            [checked]=\"checkIfAllSelected()\"\r\n            class=\"form-check-input me-3\"\r\n            type=\"checkbox\"\r\n            [id]=\"instanceId\"\r\n          />\r\n          <span class=\"form-check-label\"> Select All </span>\r\n        </label>\r\n      </li>\r\n\r\n      <!-- LIST ITEMS -->\r\n      <li\r\n        *ngFor=\"let item of filteredValues\"\r\n        [ngClass]=\"item.isSelected && !multi ? 'selected' : ''\"\r\n        (click)=\"onItemClick(item, $event)\"\r\n      >\r\n        <!-- multi \u2192 checkbox + label ; single \u2192 user row (avatar + name + email) -->\r\n        <ng-container *ngIf=\"multi; else singleItemTemplate\">\r\n          <label\r\n            [for]=\"item[idField] + instanceId\"\r\n            [ngClass]=\"multi ? '' : 'ps-0'\"\r\n            class=\"form-check\"\r\n          >\r\n            <input\r\n              (change)=\"onSelect($event, item)\"\r\n              [(ngModel)]=\"item.isSelected\"\r\n              class=\"form-check-input me-3\"\r\n              type=\"checkbox\"\r\n              [id]=\"item[idField] + instanceId\"\r\n            />\r\n            <span class=\"form-check-label\">\r\n              {{ item[searchField] }}\r\n            </span>\r\n          </label>\r\n        </ng-container>\r\n\r\n        <ng-template #singleItemTemplate>\r\n          <div class=\"user-row\">\r\n            <img\r\n              class=\"user-avatar\"\r\n              [src]=\"item.avatarUrl || './assets/tango/Image/Avatar.svg'\"\r\n              alt=\"{{ item[searchField] }}\"\r\n            />\r\n            <div class=\"user-text\">\r\n              <div class=\"user-name\">\r\n                {{ item[searchField] }}\r\n              </div>\r\n              <div class=\"user-email\">\r\n                {{ item.email }}\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </ng-template>\r\n      </li>\r\n\r\n      <li *ngIf=\"!filteredValues?.length\">\r\n        <span class=\"d-flex align-items-center justify-content-center\">\r\n          No data found\r\n        </span>\r\n      </li>\r\n    </ul>\r\n  </div>\r\n</div>\r\n", styles: [":host{width:100%;height:100%}.outer-container{position:relative;background-color:#fff}.outer-container .form-select{font-size:1.1rem;font-weight:600;border-radius:8px!important;color:var(--Gray-500, #344054);border:1px solid var(--Gray-300, #D0D5DD)!important;height:42.5px}.outer-container .disable-input{pointer-events:none;background-color:#f9fafb!important}.outer-container .input-container{width:100%;z-index:1}.outer-container .input-container .input-wrapper{padding:8px 10px;background-color:#fff;border-top-right-radius:8px;border-top-left-radius:8px;border-top:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container .input-wrapper input{width:100%;border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d;padding:10px 14px 10px 30px;outline:none}.outer-container .input-container .input-wrapper input ::placeholder{color:var(--Gray-500, #667085);font-family:Inter;font-size:14px;font-weight:500;line-height:20px}.outer-container .input-container .input-wrapper .search-icon{position:absolute;left:20px;top:20px}.outer-container .input-container ul{position:relative;background-color:#fff;margin:0;padding:0;max-height:200px;min-height:auto;overflow-y:auto;border-bottom-right-radius:8px;border-bottom-left-radius:8px;border-bottom:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container ul .selected{background:#f9fafb}.outer-container .input-container ul li{list-style:none;padding:10px 16px;cursor:pointer}.outer-container .input-container ul li label{cursor:pointer}.outer-container .input-container ul li:hover{background:#f9fafb}.form-check{display:flex;align-items:center}.form-check-input{height:16px;width:16px;border-radius:4px;border:1px solid var(--Primary-600, #00A3FF)}.form-check-input:checked{--bs-form-check-bg-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAICAYAAADA+m62AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAB4SURBVHgBhY7NDUBQEIRnqcJNKXTg6qYTStCB+Isy6IQSNMDa9SLh5eWZZPcw+81kCX/quABhD73QyKXsGoyIvNCJSto2hEhNtY4N9cwYeMXEsVqB1GaSauRQOpty2tSmO3FgloAmF5nEhgyoesMO6CuFW66fn2xdFyA3ZzcRLrMAAAAASUVORK5CYII=);background-color:#eaf8ff;border-color:#00a3ff}.form-check-label{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}.select-value{border-radius:16px!important;background:var(--Gray-100, #F2F4F7)!important;mix-blend-mode:multiply;color:var(--Gray-700, #344054)!important;text-align:center;font-size:14px;font-style:normal;font-weight:500;line-height:20px;padding:4px 12px 4px 6px}.user-row{display:flex;align-items:center;padding:8px 14px;cursor:pointer;border-bottom:1px solid #f3f4f6}.user-row:last-child{border-bottom:none}.user-row:hover{background:#f5f7ff}.user-avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;margin-right:10px}.user-text{display:flex;flex-direction:column}.user-name{font-size:14px;font-weight:500;color:#111827}.user-email{font-size:12px;color:#6b7280}.disable-input{pointer-events:none;opacity:.6}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CustomSelectComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'team-select', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"outer-container\">\r\n  <!-- TRIGGER -->\r\n  <div\r\n    [ngClass]=\"disabled ? 'disable-input' : ''\"\r\n    class=\"select-trigger form-select\"\r\n    (click)=\"openDropdown($event)\"\r\n  >\r\n    <ng-container *ngIf=\"multi; else singleMode\">\r\n      <span *ngIf=\"selectedValues?.length\" class=\"select-value mx-2\">\r\n        <!-- <img class=\"me-2 trigger-avatar\" alt=\"Pic\" src=\"./assets/tango/Image/users-teams.svg\" /> -->\r\n        {{ selectedValues?.[0]?.[searchField] }}\r\n      </span>\r\n      <span class=\"select-value mx-2\" *ngIf=\"selectedValues?.length > 1\">\r\n        +{{ selectedValues?.length - 1 }}\r\n      </span>\r\n      <span  *ngIf=\"!selectedValues?.length\">{{ label  || 'Select' }}</span>\r\n    </ng-container>\r\n\r\n    <ng-template #singleMode>\r\n      <span *ngIf=\"selectedValues?.[0]; else placeholderSingle\">\r\n        {{ selectedValues?.[0]?.[searchField] || 'Select' }}\r\n      </span>\r\n      <ng-template #placeholderSingle>\r\n        <span >{{ label || 'Select' }}</span>\r\n      </ng-template>\r\n    </ng-template>\r\n\r\n\r\n  </div>\r\n\r\n  <!-- DROPDOWN PANEL -->\r\n  <div\r\n    class=\"input-container dropdown\"\r\n    [ngClass]=\"showDropdown ? '' : 'd-none'\"\r\n    (click)=\"$event.stopPropagation()\"\r\n  >\r\n    <!-- Search -->\r\n    <div class=\"w-100 input-wrapper\">\r\n      <input\r\n        [(ngModel)]=\"searchValue\"\r\n        placeholder=\"Search\"\r\n        (input)=\"onInput($event)\"\r\n        type=\"text\"\r\n      />\r\n      <svg\r\n        class=\"search-icon\"\r\n        xmlns=\"http://www.w3.org/2000/svg\"\r\n        width=\"16\"\r\n        height=\"17\"\r\n        viewBox=\"0 0 16 17\"\r\n        fill=\"none\"\r\n      >\r\n        <path\r\n          d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\"\r\n          stroke=\"#667085\"\r\n          stroke-width=\"1.3\"\r\n          stroke-linecap=\"round\"\r\n          stroke-linejoin=\"round\"\r\n        />\r\n      </svg>\r\n    </div>\r\n\r\n    <ul>\r\n      <!-- Select all (multi mode only) -->\r\n      <li *ngIf=\"multi && filteredValues?.length\">\r\n        <label class=\"form-check\" [for]=\"instanceId\">\r\n          <input\r\n            (change)=\"onSelectAll($event)\"\r\n            [checked]=\"checkIfAllSelected()\"\r\n            class=\"form-check-input me-3\"\r\n            type=\"checkbox\"\r\n            [id]=\"instanceId\"\r\n          />\r\n          <span class=\"form-check-label\"> Select All </span>\r\n        </label>\r\n      </li>\r\n\r\n      <!-- LIST ITEMS -->\r\n      <li\r\n        *ngFor=\"let item of filteredValues\"\r\n        [ngClass]=\"item.isSelected && !multi ? 'selected' : ''\"\r\n        (click)=\"onItemClick(item, $event)\"\r\n      >\r\n        <!-- multi \u2192 checkbox + label ; single \u2192 user row (avatar + name + email) -->\r\n        <ng-container *ngIf=\"multi; else singleItemTemplate\">\r\n          <label\r\n            [for]=\"item[idField] + instanceId\"\r\n            [ngClass]=\"multi ? '' : 'ps-0'\"\r\n            class=\"form-check\"\r\n          >\r\n            <input\r\n              (change)=\"onSelect($event, item)\"\r\n              [(ngModel)]=\"item.isSelected\"\r\n              class=\"form-check-input me-3\"\r\n              type=\"checkbox\"\r\n              [id]=\"item[idField] + instanceId\"\r\n            />\r\n            <span class=\"form-check-label\">\r\n              {{ item[searchField] }}\r\n            </span>\r\n          </label>\r\n        </ng-container>\r\n\r\n        <ng-template #singleItemTemplate>\r\n          <div class=\"user-row\">\r\n            <img\r\n              class=\"user-avatar\"\r\n              [src]=\"item.avatarUrl || './assets/tango/Image/Avatar.svg'\"\r\n              alt=\"{{ item[searchField] }}\"\r\n            />\r\n            <div class=\"user-text\">\r\n              <div class=\"user-name\">\r\n                {{ item[searchField] }}\r\n              </div>\r\n              <div class=\"user-email\">\r\n                {{ item.email }}\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </ng-template>\r\n      </li>\r\n\r\n      <li *ngIf=\"!filteredValues?.length\">\r\n        <span class=\"d-flex align-items-center justify-content-center\">\r\n          No data found\r\n        </span>\r\n      </li>\r\n    </ul>\r\n  </div>\r\n</div>\r\n", styles: [":host{width:100%;height:100%}.outer-container{position:relative;background-color:#fff}.outer-container .form-select{font-size:1.1rem;font-weight:600;border-radius:8px!important;color:var(--Gray-500, #344054);border:1px solid var(--Gray-300, #D0D5DD)!important;height:42.5px}.outer-container .disable-input{pointer-events:none;background-color:#f9fafb!important}.outer-container .input-container{width:100%;z-index:1}.outer-container .input-container .input-wrapper{padding:8px 10px;background-color:#fff;border-top-right-radius:8px;border-top-left-radius:8px;border-top:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container .input-wrapper input{width:100%;border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d;padding:10px 14px 10px 30px;outline:none}.outer-container .input-container .input-wrapper input ::placeholder{color:var(--Gray-500, #667085);font-family:Inter;font-size:14px;font-weight:500;line-height:20px}.outer-container .input-container .input-wrapper .search-icon{position:absolute;left:20px;top:20px}.outer-container .input-container ul{position:relative;background-color:#fff;margin:0;padding:0;max-height:200px;min-height:auto;overflow-y:auto;border-bottom-right-radius:8px;border-bottom-left-radius:8px;border-bottom:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container ul .selected{background:#f9fafb}.outer-container .input-container ul li{list-style:none;padding:10px 16px;cursor:pointer}.outer-container .input-container ul li label{cursor:pointer}.outer-container .input-container ul li:hover{background:#f9fafb}.form-check{display:flex;align-items:center}.form-check-input{height:16px;width:16px;border-radius:4px;border:1px solid var(--Primary-600, #00A3FF)}.form-check-input:checked{--bs-form-check-bg-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAICAYAAADA+m62AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAB4SURBVHgBhY7NDUBQEIRnqcJNKXTg6qYTStCB+Isy6IQSNMDa9SLh5eWZZPcw+81kCX/quABhD73QyKXsGoyIvNCJSto2hEhNtY4N9cwYeMXEsVqB1GaSauRQOpty2tSmO3FgloAmF5nEhgyoesMO6CuFW66fn2xdFyA3ZzcRLrMAAAAASUVORK5CYII=);background-color:#eaf8ff;border-color:#00a3ff}.form-check-label{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}.select-value{border-radius:16px!important;background:var(--Gray-100, #F2F4F7)!important;mix-blend-mode:multiply;color:var(--Gray-700, #344054)!important;text-align:center;font-size:14px;font-style:normal;font-weight:500;line-height:20px;padding:4px 12px 4px 6px}.user-row{display:flex;align-items:center;padding:8px 14px;cursor:pointer;border-bottom:1px solid #f3f4f6}.user-row:last-child{border-bottom:none}.user-row:hover{background:#f5f7ff}.user-avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;margin-right:10px}.user-text{display:flex;flex-direction:column}.user-name{font-size:14px;font-weight:500;color:#111827}.user-email{font-size:12px;color:#6b7280}.disable-input{pointer-events:none;opacity:.6}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.TicketService }], propDecorators: { onClick: [{
+                type: HostListener,
+                args: ['document:click', ['$event']]
+            }], items: [{
+                type: Input
+            }], searchField: [{
+                type: Input
+            }], multi: [{
+                type: Input
+            }], idField: [{
+                type: Input
+            }], selectedValues: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], selected: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY3VzdG9tLXNlbGVjdC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy90YW5nby1tYW5hZ2UtdGlja2V0cy9zcmMvbGliL2NvbXBvbmVudHMvY3VzdG9tLXNlbGVjdC9jdXN0b20tc2VsZWN0LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3RhbmdvLW1hbmFnZS10aWNrZXRzL3NyYy9saWIvY29tcG9uZW50cy9jdXN0b20tc2VsZWN0L2N1c3RvbS1zZWxlY3QuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLHVCQUF1QixFQUFxQixTQUFTLEVBQUUsWUFBWSxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQXFCLE1BQU0sRUFBaUIsTUFBTSxlQUFlLENBQUM7Ozs7O0FBRW5LLCtFQUErRTtBQVMvRSxNQUFNLE9BQU8scUJBQXFCO0lBd0JaO0lBQStCO0lBckJuRCxPQUFPLENBQUMsS0FBaUI7UUFDdkIsTUFBTSxNQUFNLEdBQUcsS0FBSyxDQUFDLE1BQXFCLENBQUM7UUFDM0MsSUFBSSxDQUFDLE1BQU0sQ0FBQyxPQUFPLENBQUMsV0FBVyxDQUFDLEVBQUU7WUFDaEMsSUFBSSxDQUFDLFlBQVksR0FBRyxLQUFLLENBQUM7U0FDM0I7SUFDSCxDQUFDO0lBRVEsS0FBSyxDQUFLO0lBQ1YsV0FBVyxDQUFRO0lBQ25CLEtBQUssQ0FBUztJQUNkLE9BQU8sQ0FBUTtJQUNmLGNBQWMsR0FBUSxFQUFFLENBQUE7SUFDeEIsUUFBUSxDQUFxQjtJQUM3QixLQUFLLENBQVE7SUFDWixRQUFRLEdBQUcsSUFBSSxZQUFZLEVBQU8sQ0FBQTtJQUM1QyxjQUFjLEdBQVEsRUFBRSxDQUFBO0lBQ3hCLFlBQVksQ0FBUztJQUNyQixXQUFXLENBQVE7SUFDbkIsVUFBVSxDQUFNO0lBR2hCLFlBQW9CLEVBQXFCLEVBQVUsV0FBeUI7UUFBeEQs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LEVBQUUsRUFBRSxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsQ0FBQztJQUNuRSxDQUFDO0lBQ0QsV0FBVyxDQUFDLElBQVMsRUFBRSxLQUFpQjtRQUN4QyxLQUFLLENBQUMsZUFBZSxFQUFFLENBQUM7UUFFeEIsOERBQThEO1FBQzlELHdDQUF3QztRQUN4QyxJQUFJLElBQUksQ0FBQyxLQUFLLEVBQUU7WUFDZCxPQUFPO1NBQ1I7UUFFRCxpREFBaUQ7UUFDakQsSUFBSSxDQUFDLFVBQVUsR0FBRyxJQUFJLENBQUM7UUFFdkIsb0RBQW9EO1FBQ3BELE1BQU0sU0FBUyxHQUFRO1lBQ3JCLGFBQWEsRUFBRTtnQkFDYixPQUFPLEVBQUUsSUFBSTthQUNkO1NBQ0YsQ0FBQztRQUVGLDRCQUE0QjtRQUM1QixJQUFJLENBQUMsUUFBUSxDQUFDLFNBQVMsRUFBRSxJQUFJLENBQUMsQ0FBQztJQUNqQyxDQUFDO3dHQS9KWSxxQkFBcUI7NEZBQXJCLHFCQUFxQiw2VUNYbEMsaTlJQWtJQTs7NEZEdkhhLHFCQUFxQjtrQkFQakMsU0FBUzsrQkFFRSxhQUFhLG1CQUdOLHVCQUF1QixDQUFDLE1BQU07a0hBSy9DLE9BQU87c0JBRE4sWUFBWTt1QkFBQyxnQkFBZ0IsRUFBRSxDQUFDLFFBQVEsQ0FBQztnQkFRakMsS0FBSztzQkFBYixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSztnQkFDRyxjQUFjO3NCQUF0QixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNJLFFBQVE7c0JBQWpCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ2hhbmdlRGV0ZWN0b3JSZWYsIENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBIb3N0TGlzdGVuZXIsIElucHV0LCBPbkNoYW5nZXMsIE9uSW5pdCwgT3V0cHV0LCBTaW1wbGVDaGFuZ2VzIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IFRpY2tldFNlcnZpY2UgfSBmcm9tICcuLi8uLi9zZXJ2aWNlcy90aWNrZXQuc2VydmljZSc7XHJcbi8vIGltcG9ydCB7IE1hbmFnZVVzZXJzU2VydmljZSB9IGZyb20gJy4uLy4uL3NlcnZpY2VzLXYyL21hbmFnZS11c2Vycy5zZXJ2aWNlJztcclxuIFxyXG5AQ29tcG9uZW50KHtcclxuICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQGFuZ3VsYXItZXNsaW50L2NvbXBvbmVudC1zZWxlY3RvclxyXG4gIHNlbGVjdG9yOiAndGVhbS1zZWxlY3QnLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi9jdXN0b20tc2VsZWN0LmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybDogJy4vY3VzdG9tLXNlbGVjdC5jb21wb25lbnQuc2NzcycsXHJcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBDdXN0b21TZWxlY3RDb21wb25lbnQgaW1wbGVtZW50cyBPbkNoYW5nZXMsIE9uSW5pdCB7XHJcbiBcclxuICBASG9zdExpc3RlbmVyKCdkb2N1bWVudDpjbGljaycsIFsnJGV2ZW50J10pXHJcbiAgb25DbGljayhldmVudDogTW91c2VFdmVudCkge1xyXG4gICAgY29uc3QgdGFyZ2V0ID0gZXZlbnQudGFyZ2V0IGFzIEhUTUxFbGVtZW50O1xyXG4gICAgaWYgKCF0YXJnZXQuY2xvc2VzdCgnLmRyb3Bkb3duJykpIHtcclxuICAgICAgdGhpcy5zaG93RHJvcGRvd24gPSBmYWxzZTtcclxuICAgIH1cclxuICB9XHJcbiBcclxuICBASW5wdXQoKSBpdGVtczogYW55XHJcbiAgQElucHV0KCkgc2VhcmNoRmllbGQ6IHN0cmluZ1xyXG4gIEBJbnB1dCgpIG11bHRpOiBib29sZWFuXHJcbiAgQElucHV0KCkgaWRGaWVsZDogc3RyaW5nXHJcbiAgQElucHV0KCkgc2VsZWN0ZWRWYWx1ZXM6IGFueSA9IFtdXHJcbiAgQElucHV0KCkgZGlzYWJsZWQ6IGJvb2xlYW4gfCB1bmRlZmluZWRcclxuICBASW5wdXQoKSBsYWJlbDogc3RyaW5nXHJcbiAgQE91dHB1dCgpIHNlbGVjdGVkID0gbmV3IEV2ZW50RW1pdHRlcjxhbnk+KClcclxuICBmaWx0ZXJlZFZhbHVlczogYW55ID0gW11cclxuICBzaG93RHJvcGRvd246IGJvb2xlYW5cclxuICBzZWFyY2hWYWx1ZTogc3RyaW5nXHJcbiAgaW5zdGFuY2VJZDogYW55O1xyXG4gXHJcbiBcclxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGNkOiBDaGFuZ2VEZXRlY3RvclJlZiwgcHJpdmF0ZSBhdXRoU2VydmljZTpUaWNrZXRTZXJ2aWNlKSB7IH1cclxuICBuZ09uSW5pdCgpOiB2b2lkIHtcclxuICAgIHRoaXMuaW5zdGFuY2VJZCA9IGNyeXB0by5yYW5kb21VVUlEKCk7XHJcbiAgICB0aGlzLmF1dGhTZXJ2aWNlLmRyb3BEb3duVHJpZ2dlci5zdWJzY3JpYmUoKGUpPT57ICAgICAgICAgICBcclxuICAgICAgaWYoZSAhPT0gdGhpcy5pbnN0YW5jZUlkKXsgICAgICAgIFxyXG4gICAgICAgIHRoaXMuc2hvd0Ryb3Bkb3duID0gZmFsc2VcclxuICAgICAgICB0aGlzLmNkLmRldGVjdENoYW5nZXMoKVxyXG4gICAgICB9XHJcbiAgICB9KVxyXG4gIH1cclxuIFxyXG4gIG5nT25DaGFuZ2VzKGNoYW5nZXM6IFNpbXBsZUNoYW5nZXMpOiB2b2lkIHtcclxuIFxyXG4gICAgaWYgKGNoYW5nZXNbJ2l0ZW1zJ10gJiYgdGhpcy5pdGVtcz8ubGVuZ3RoKSB7XHJcbiAgICAgIHRoaXMuaW5pdGlhbGl6ZUl0ZW1zKCk7XHJcbiAgICB9XHJcbiAgICBpZiAoY2hhbmdlc1snc2VsZWN0ZWRWYWx1ZXMnXSAmJiBBcnJheS5pc0FycmF5KGNoYW5nZXNbJ3NlbGVjdGVkVmFsdWVzJ10/LmN1cnJlbnRWYWx1ZSkgJiYgY2hhbmdlc1snc2VsZWN0ZWRWYWx1ZXMnXT8uY3VycmVudFZhbHVlPy5sZW5ndGggPiAwICYmIGNoYW5nZXNbJ3NlbGVjdGVkVmFsdWVzJ10/LmN1cnJlbnRWYWx1ZVswXSkgeyAgICAgICAgICAgIFxyXG4gICAgICB0aGlzLnVwZGF0ZVNlbGVjdGVkVmFsdWVzKCk7XHJcbiAgICB9XHJcbiAgfVxyXG4gXHJcbiAgaW5pdGlhbGl6ZUl0ZW1zKCkge1xyXG4gICAgdGhpcy5maWx0ZXJlZFZhbHVlcyA9IHRoaXMuaXRlbXMubWFwKChpdGVtOiBhbnkpID0+ICh7IC4uLml0ZW0gfSkpO1xyXG4gICAgdGhpcy51cGRhdGVTZWxlY3RlZFZhbHVlcygpXHJcbiAgfVxyXG4gXHJcbiAgdXBkYXRlU2VsZWN0ZWRWYWx1ZXMoKSB7ICAgIFxyXG4gICAgdGhpcy5zZWxlY3RlZFZhbHVlcz8uZm9yRWFjaCgoc2VsZWN0ZWRJdGVtOiBhbnkpID0+IHtcclxuICAgICAgY29uc3QgaXRlbSA9IHRoaXMuZmlsdGVyZWRWYWx1ZXM/LmZpbmQoKGZpbHRlcmVkSXRlbTogYW55KSA9PiBmaWx0ZXJlZEl0ZW0/Llt0aGlzLmlkRmllbGRdID09PSBzZWxlY3RlZEl0ZW0/Llt0aGlzLmlkRmllbGRdKTtcclxuICAgICAgaWYgKGl0ZW0pIHtcclxuICAgICAgICBpdGVtLmlzU2VsZWN0ZWQgPSB0cnVlO1xyXG4gICAgICB9XHJcbiAgICB9KTtcclxuICAgXHJcbiAgfVxyXG4gXHJcbiAgb3BlbkRyb3Bkb3duKGV2ZW50OiBhbnkpIHtcclxuICAgIHRoaXMuYXV0aFNlcnZpY2UuZHJvcERvd25UcmlnZ2VyLm5leHQodGhpcy5pbnN0YW5jZUlkKVxyXG4gICAgZXZlbnQuc3RvcFByb3BhZ2F0aW9uKCk7XHJcbiAgICB0aGlzLnNob3dEcm9wZG93biA9ICF0aGlzLnNob3dEcm9wZG93bjtcclxuICB9XHJcbiBcclxuICBvbklucHV0KGV2ZW50OiBhbnkpIHtcclxuICAgIGlmICghZXZlbnQudGFyZ2V0LnZhbHVlKSB7XHJcbiAgICAgIHRoaXMuZmlsdGVyZWRWYWx1ZXMgPSBbLi4udGhpcy5pdGVtc107XHJcbiAgICB9IGVsc2Uge1xyXG4gICAgICBjb25zdCBzZWFyY2hUZXJtID0gZXZlbnQudGFyZ2V0LnZhbHVlLnRvTG93ZXJDYXNlKCk7XHJcbiAgICAgIHRoaXMuZmlsdGVyZWRWYWx1ZXMgPSB0aGlzLml0ZW1zLmZpbHRlcigoaXRlbTogYW55KSA9PlxyXG4gICAgICAgIGl0ZW1bdGhpcy5zZWFyY2hGaWVsZF0udG9Mb3dlckNhc2UoKS5pbmNsdWRlcyhzZWFyY2hUZXJtKVxyXG4gICAgICApO1xyXG4gICAgfVxyXG4gICAgdGhpcy51cGRhdGVTZWxlY3RlZFZhbHVlcygpO1xyXG4gICAgdGhpcy5jZC5kZXRlY3RDaGFuZ2VzKCk7XHJcbiAgfVxyXG4gXHJcbiAgb25TZWxlY3QoZXZlbnQ6IGFueSwgaXRlbTogYW55KSB7ICAgIFxyXG4gICAgaWYgKHRoaXMubXVsdGkpIHtcclxuICAgICAgaWYgKGV2ZW50LmN1cnJlbnRUYXJnZXQuY2hlY2tlZCkge1xyXG4gICAgICAgIHRoaXMuc2VsZWN0ZWRWYWx1ZXMucHVzaChpdGVtICk7ICAgICAgICBcclxuICAgICAgfSBlbHNlIHtcclxuICAgICAgICB0aGlzLnNlbGVjdGVkVmFsdWVzID0gdGhpcy5zZWxlY3RlZFZhbHVlcy5maWx0ZXIoKGVsZW06IGFueSkgPT4gZWxlbVt0aGlzLmlkRmllbGRdICE9PSBpdGVtW3RoaXMuaWRGaWVsZF0pO1xyXG4gICAgICB9XHJcbiAgICB9IGVsc2Uge1xyXG4gICAgICB0aGlzLnNlbGVjdGVkVmFsdWVzID0gW3sgLi4uaXRlbSB9XTtcclxuICAgICAgdGhpcy5maWx0ZXJlZFZhbHVlcy5mb3JFYWNoKChlbGVtZW50OmFueSkgPT4ge1xyXG4gICAgICAgIGlmKGVsZW1lbnRbdGhpcy5pZEZpZWxkXSAhPT0gaXRlbVt0aGlzLmlkRmllbGRdKXtcclxuICAgICAgICAgIGVsZW1lbnQuaXNTZWxlY3RlZCA9IGZhbHNlXHJcbiAgICAgICAgfVxyXG4gICAgICB9KTtcclxuICAgICAgdGhpcy5zaG93RHJvcGRvd24gPSBmYWxzZTtcclxuICAgIH1cclxuIFxyXG4gICAgY29uc3QgdmFsdWVzVG9FbWl0ID0gdGhpcy5zZWxlY3RlZFZhbHVlcy5tYXAoKHZhbHVlOiBhbnkpID0+IHtcclxuICAgICAgY29uc3Qgc2VsZWN0ZWRJdGVtID0geyAuLi52YWx1ZSB9O1xyXG4gICAgICBkZWxldGUgc2VsZWN0ZWRJdGVtLmlzU2VsZWN0ZWQ7XHJcbiAgICAgIHJldHVybiBzZWxlY3RlZEl0ZW07XHJcbiAgICB9KTtcclxuIFxyXG4gICAgdGhpcy5jZC5kZXRlY3RDaGFuZ2VzKCk7XHJcbiAgICB0aGlzLmVtaXRTZWxlY3RlZFZhbHVlcyh2YWx1ZXNUb0VtaXQpO1xyXG4gXHJcbiAgfVxyXG4gXHJcbiAgb25TZWxlY3RBbGwoZXZlbnQ6IGFueSkge1xyXG4gICAgY29uc3Qgc2VsZWN0QWxsID0gZXZlbnQuY3VycmVudFRhcmdldC5jaGVja2VkO1xyXG4gICAgdGhpcy5maWx0ZXJlZFZhbHVlcy5mb3JFYWNoKChpdGVtOiBhbnkpID0+IGl0ZW0uaXNTZWxlY3RlZCA9IHNlbGVjdEFsbCk7XHJcbiBcclxuICAgIGlmIChzZWxlY3RBbGwpIHtcclxuICAgICAgdGhpcy5zZWxlY3RlZFZhbHVlcyA9IFsuLi50aGlzLmZpbHRlcmVkVmFsdWVzXTtcclxuICAgIH0gZWxzZSB7XHJcbiAgICAgIHRoaXMuc2VsZWN0ZWRWYWx1ZXMgPSBbXTtcclxuICAgIH1cclxuIFxyXG4gICAgY29uc3QgdmFsdWVzVG9FbWl0ID0gdGhpcy5zZWxlY3RlZFZhbHVlcy5tYXAoKHZhbHVlOiBhbnkpID0+IHtcclxuICAgICAgY29uc3QgeyBpc1NlbGVjdGVkLCAuLi5zZWxlY3RlZEl0ZW0gfSA9IHZhbHVlO1xyXG4gICAgICByZXR1cm4gc2VsZWN0ZWRJdGVtO1xyXG4gICAgfSk7XHJcbiBcclxuICAgIHRoaXMuY2QuZGV0ZWN0Q2hhbmdlcygpO1xyXG4gICAgdGhpcy5lbWl0U2VsZWN0ZWRWYWx1ZXModmFsdWVzVG9FbWl0KTtcclxuICB9XHJcbiBcclxuIFxyXG4gIGVtaXRTZWxlY3RlZFZhbHVlcyh2YWx1ZXM6IGFueVtdKSB7XHJcbiAgICBpZiAodGhpcy5tdWx0aSkge1xyXG4gICAgICB0aGlzLnNlbGVjdGVkLmVtaXQodmFsdWVzKTtcclxuICAgIH0gZWxzZSB7XHJcbiAgICAgIHRoaXMuc2VsZWN0ZWQuZW1pdCh2YWx1ZXNbMF0pO1xyXG4gICAgfVxyXG4gIH1cclxuIFxyXG4gIGNoZWNrSWZBbGxTZWxlY3RlZCgpIHtcclxuICAgIHJldHVybiB0aGlzLmZpbHRlcmVkVmFsdWVzLmV2ZXJ5KChpdGVtOiBhbnkpID0+IGl0ZW0uaXNTZWxlY3RlZCk7XHJcbiAgfVxyXG4gIG9uSXRlbUNsaWNrKGl0ZW06IGFueSwgZXZlbnQ6IE1vdXNlRXZlbnQpIHtcclxuICBldmVudC5zdG9wUHJvcGFnYXRpb24oKTtcclxuXHJcbiAgLy8gRm9yIG11bHRpLXNlbGVjdCwgcm93IGNsaWNrIHNob3VsZCBub3QgZG8gYW55dGhpbmcgc3BlY2lhbDtcclxuICAvLyBjaGVja2JveCArIG9uU2VsZWN0IGFscmVhZHkgaGFuZGxlIGl0XHJcbiAgaWYgKHRoaXMubXVsdGkpIHtcclxuICAgIHJldHVybjtcclxuICB9XHJcblxyXG4gIC8vIE1hcmsgdGhpcyBpdGVtIGFzIHNlbGVjdGVkIHNvIFVJIGhpZ2hsaWdodHMgaXRcclxuICBpdGVtLmlzU2VsZWN0ZWQgPSB0cnVlO1xyXG5cclxuICAvLyBGYWtlIGFuIGV2ZW50IHdpdGggYGN1cnJlbnRUYXJnZXQuY2hlY2tlZCA9IHRydWVgXHJcbiAgY29uc3QgZmFrZUV2ZW50OiBhbnkgPSB7XHJcbiAgICBjdXJyZW50VGFyZ2V0OiB7XHJcbiAgICAgIGNoZWNrZWQ6IHRydWVcclxuICAgIH1cclxuICB9O1xyXG5cclxuICAvLyBSZXVzZSB5b3VyIGV4aXN0aW5nIGxvZ2ljXHJcbiAgdGhpcy5vblNlbGVjdChmYWtlRXZlbnQsIGl0ZW0pO1xyXG59XHJcblxyXG59IiwiPGRpdiBjbGFzcz1cIm91dGVyLWNvbnRhaW5lclwiPlxyXG4gIDwhLS0gVFJJR0dFUiAtLT5cclxuICA8ZGl2XHJcbiAgICBbbmdDbGFzc109XCJkaXNhYmxlZCA/ICdkaXNhYmxlLWlucHV0JyA6ICcnXCJcclxuICAgIGNsYXNzPVwic2VsZWN0LXRyaWdnZXIgZm9ybS1zZWxlY3RcIlxyXG4gICAgKGNsaWNrKT1cIm9wZW5Ecm9wZG93bigkZXZlbnQpXCJcclxuICA+XHJcbiAgICA8bmctY29udGFpbmVyICpuZ0lmPVwibXVsdGk7IGVsc2Ugc2luZ2xlTW9kZVwiPlxyXG4gICAgICA8c3BhbiAqbmdJZj1cInNlbGVjdGVkVmFsdWVzPy5sZW5ndGhcIiBjbGFzcz1cInNlbGVjdC12YWx1ZSBteC0yXCI+XHJcbiAgICAgICAgPCEtLSA8aW1nIGNsYXNzPVwibWUtMiB0cmlnZ2VyLWF2YXRhclwiIGFsdD1cIlBpY1wiIHNyYz1cIi4vYXNzZXRzL3RhbmdvL0ltYWdlL3VzZXJzLXRlYW1zLnN2Z1wiIC8+IC0tPlxyXG4gICAgICAgIHt7IHNlbGVjdGVkVmFsdWVzPy5bMF0/LltzZWFyY2hGaWVsZF0gfX1cclxuICAgICAgPC9zcGFuPlxyXG4gICAgICA8c3BhbiBjbGFzcz1cInNlbGVjdC12YWx1ZSBteC0yXCIgKm5nSWY9XCJzZWxlY3RlZFZhbHVlcz8ubGVuZ3RoID4gMVwiPlxyXG4gICAgICAgICt7eyBzZWxlY3RlZFZhbHVlcz8ubGVuZ3RoIC0gMSB9fVxyXG4gICAgICA8L3NwYW4+XHJcbiAgICAgIDxzcGFuICAqbmdJZj1cIiFzZWxlY3RlZFZhbHVlcz8ubGVuZ3RoXCI+e3sgbGFiZWwgIHx8ICdTZWxlY3QnIH19PC9zcGFuPlxyXG4gICAgPC9uZy1jb250YWluZXI+XHJcblxyXG4gICAgPG5nLXRlbXBsYXRlICNzaW5nbGVNb2RlPlxyXG4gICAgICA8c3BhbiAqbmdJZj1cInNlbGVjdGVkVmFsdWVzPy5bMF07IGVsc2UgcGxhY2Vob2xkZXJTaW5nbGVcIj5cclxuICAgICAgICB7eyBzZWxlY3RlZFZhbHVlcz8uWzBdPy5bc2VhcmNoRmllbGRdIHx8ICdTZWxlY3QnIH19XHJcbiAgICAgIDwvc3Bhbj5cclxuICAgICAgPG5nLXRlbXBsYXRlICNwbGFjZWhvbGRlclNpbmdsZT5cclxuICAgICAgICA8c3BhbiA+e3sgbGFiZWwgfHwgJ1NlbGVjdCcgfX08L3NwYW4+XHJcbiAgICAgIDwvbmctdGVtcGxhdGU+XHJcbiAgICA8L25nLXRlbXBsYXRlPlxyXG5cclxuXHJcbiAgPC9kaXY+XHJcblxyXG4gIDwhLS0gRFJPUERPV04gUEFORUwgLS0+XHJcbiAgPGRpdlxyXG4gICAgY2xhc3M9XCJpbnB1dC1jb250YWluZXIgZHJvcGRvd25cIlxyXG4gICAgW25nQ2xhc3NdPVwic2hvd0Ryb3Bkb3duID8gJycgOiAnZC1ub25lJ1wiXHJcbiAgICAoY2xpY2spPVwiJGV2ZW50LnN0b3BQcm9wYWdhdGlvbigpXCJcclxuICA+XHJcbiAgICA8IS0tIFNlYXJjaCAtLT5cclxuICAgIDxkaXYgY2xhc3M9XCJ3LTEwMCBpbnB1dC13cmFwcGVyXCI+XHJcbiAgICAgIDxpbnB1dFxyXG4gICAgICAgIFsobmdNb2RlbCldPVwic2VhcmNoVmFsdWVcIlxyXG4gICAgICAgIHBsYWNlaG9sZGVyPVwiU2VhcmNoXCJcclxuICAgICAgICAoaW5wdXQpPVwib25JbnB1dCgkZXZlbnQpXCJcclxuICAgICAgICB0eXBlPVwidGV4dFwiXHJcbiAgICAgIC8+XHJcbiAgICAgIDxzdmdcclxuICAgICAgICBjbGFzcz1cInNlYXJjaC1pY29uXCJcclxuICAgICAgICB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCJcclxuICAgICAgICB3aWR0aD1cIjE2XCJcclxuICAgICAgICBoZWlnaHQ9XCIxN1wiXHJcbiAgICAgICAgdmlld0JveD1cIjAgMCAxNiAxN1wiXHJcbiAgICAgICAgZmlsbD1cIm5vbmVcIlxyXG4gICAgICA+XHJcbiAgICAgICAgPHBhdGhcclxuICAgICAgICAgIGQ9XCJNMTQgMTQuNUwxMS4xIDExLjZNMTIuNjY2NyA3LjgzMzMzQzEyLjY2NjcgMTAuNzc4OSAxMC4yNzg5IDEzLjE2NjcgNy4zMzMzMyAxMy4xNjY3QzQuMzg3ODEgMTMuMTY2NyAyIDEwLjc3ODkgMiA3LjgzMzMzQzIgNC44ODc4MSA0LjM4NzgxIDIuNSA3LjMzMzMzIDIuNUMxMC4yNzg5IDIuNSAxMi42NjY3IDQuODg3ODEgMTIuNjY2NyA3LjgzMzMzWlwiXHJcbiAgICAgICAgICBzdHJva2U9XCIjNjY3MDg1XCJcclxuICAgICAgICAgIHN0cm9rZS13aWR0aD1cIjEuM1wiXHJcbiAgICAgICAgICBzdHJva2UtbGluZWNhcD1cInJvdW5kXCJcclxuICAgICAgICAgIHN0cm9rZS1saW5lam9pbj1cInJvdW5kXCJcclxuICAgICAgICAvPlxyXG4gICAgICA8L3N2Zz5cclxuICAgIDwvZGl2PlxyXG5cclxuICAgIDx1bD5cclxuICAgICAgPCEtLSBTZWxlY3QgYWxsIChtdWx0aSBtb2RlIG9ubHkpIC0tPlxyXG4gICAgICA8bGkgKm5nSWY9XCJtdWx0aSAmJiBmaWx0ZXJlZFZhbHVlcz8ubGVuZ3RoXCI+XHJcbiAgICAgICAgPGxhYmVsIGNsYXNzPVwiZm9ybS1jaGVja1wiIFtmb3JdPVwiaW5zdGFuY2VJZFwiPlxyXG4gICAgICAgICAgPGlucHV0XHJcbiAgICAgICAgICAgIChjaGFuZ2UpPVwib25TZWxlY3RBbGwoJGV2ZW50KVwiXHJcbiAgICAgICAgICAgIFtjaGVja2VkXT1cImNoZWNrSWZBbGxTZWxlY3RlZCgpXCJcclxuICAgICAgICAgICAgY2xhc3M9XCJmb3JtLWNoZWNrLWlucHV0IG1lLTNcIlxyXG4gICAgICAgICAgICB0eXBlPVwiY2hlY2tib3hcIlxyXG4gICAgICAgICAgICBbaWRdPVwiaW5zdGFuY2VJZFwiXHJcbiAgICAgICAgICAvPlxyXG4gICAgICAgICAgPHNwYW4gY2xhc3M9XCJmb3JtLWNoZWNrLWxhYmVsXCI+IFNlbGVjdCBBbGwgPC9zcGFuPlxyXG4gICAgICAgIDwvbGFiZWw+XHJcbiAgICAgIDwvbGk+XHJcblxyXG4gICAgICA8IS0tIExJU1QgSVRFTVMgLS0+XHJcbiAgICAgIDxsaVxyXG4gICAgICAgICpuZ0Zvcj1cImxldCBpdGVtIG9mIGZpbHRlcmVkVmFsdWVzXCJcclxuICAgICAgICBbbmdDbGFzc109XCJpdGVtLmlzU2VsZWN0ZWQgJiYgIW11bHRpID8gJ3NlbGVjdGVkJyA6ICcnXCJcclxuICAgICAgICAoY2xpY2spPVwib25JdGVtQ2xpY2soaXRlbSwgJGV2ZW50KVwiXHJcbiAgICAgID5cclxuICAgICAgICA8IS0tIG11bHRpIOKGkiBjaGVja2JveCArIGxhYmVsIDsgc2luZ2xlIOKGkiB1c2VyIHJvdyAoYXZhdGFyICsgbmFtZSArIGVtYWlsKSAtLT5cclxuICAgICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwibXVsdGk7IGVsc2Ugc2luZ2xlSXRlbVRlbXBsYXRlXCI+XHJcbiAgICAgICAgICA8bGFiZWxcclxuICAgICAgICAgICAgW2Zvcl09XCJpdGVtW2lkRmllbGRdICsgaW5zdGFuY2VJZFwiXHJcbiAgICAgICAgICAgIFtuZ0NsYXNzXT1cIm11bHRpID8gJycgOiAncHMtMCdcIlxyXG4gICAgICAgICAgICBjbGFzcz1cImZvcm0tY2hlY2tcIlxyXG4gICAgICAgICAgPlxyXG4gICAgICAgICAgICA8aW5wdXRcclxuICAgICAgICAgICAgICAoY2hhbmdlKT1cIm9uU2VsZWN0KCRldmVudCwgaXRlbSlcIlxyXG4gICAgICAgICAgICAgIFsobmdNb2RlbCldPVwiaXRlbS5pc1NlbGVjdGVkXCJcclxuICAgICAgICAgICAgICBjbGFzcz1cImZvcm0tY2hlY2staW5wdXQgbWUtM1wiXHJcbiAgICAgICAgICAgICAgdHlwZT1cImNoZWNrYm94XCJcclxuICAgICAgICAgICAgICBbaWRdPVwiaXRlbVtpZEZpZWxkXSArIGluc3RhbmNlSWRcIlxyXG4gICAgICAgICAgICAvPlxyXG4gICAgICAgICAgICA8c3BhbiBjbGFzcz1cImZvcm0tY2hlY2stbGFiZWxcIj5cclxuICAgICAgICAgICAgICB7eyBpdGVtW3NlYXJjaEZpZWxkXSB9fVxyXG4gICAgICAgICAgICA8L3NwYW4+XHJcbiAgICAgICAgICA8L2xhYmVsPlxyXG4gICAgICAgIDwvbmctY29udGFpbmVyPlxyXG5cclxuICAgICAgICA8bmctdGVtcGxhdGUgI3NpbmdsZUl0ZW1UZW1wbGF0ZT5cclxuICAgICAgICAgIDxkaXYgY2xhc3M9XCJ1c2VyLXJvd1wiPlxyXG4gICAgICAgICAgICA8aW1nXHJcbiAgICAgICAgICAgICAgY2xhc3M9XCJ1c2VyLWF2YXRhclwiXHJcbiAgICAgICAgICAgICAgW3NyY109XCJpdGVtLmF2YXRhclVybCB8fCAnLi9hc3NldHMvdGFuZ28vSW1hZ2UvQXZhdGFyLnN2ZydcIlxyXG4gICAgICAgICAgICAgIGFsdD1cInt7IGl0ZW1bc2VhcmNoRmllbGRdIH19XCJcclxuICAgICAgICAgICAgLz5cclxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cInVzZXItdGV4dFwiPlxyXG4gICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJ1c2VyLW5hbWVcIj5cclxuICAgICAgICAgICAgICAgIHt7IGl0ZW1bc2VhcmNoRmllbGRdIH19XHJcbiAgICAgICAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgICAgICAgPGRpdiBjbGFzcz1cInVzZXItZW1haWxcIj5cclxuICAgICAgICAgICAgICAgIHt7IGl0ZW0uZW1haWwgfX1cclxuICAgICAgICAgICAgICA8L2Rpdj5cclxuICAgICAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgICA8L2Rpdj5cclxuICAgICAgICA8L25nLXRlbXBsYXRlPlxyXG4gICAgICA8L2xpPlxyXG5cclxuICAgICAgPGxpICpuZ0lmPVwiIWZpbHRlcmVkVmFsdWVzPy5sZW5ndGhcIj5cclxuICAgICAgICA8c3BhbiBjbGFzcz1cImQtZmxleCBhbGlnbi1pdGVtcy1jZW50ZXIganVzdGlmeS1jb250ZW50LWNlbnRlclwiPlxyXG4gICAgICAgICAgTm8gZGF0YSBmb3VuZFxyXG4gICAgICAgIDwvc3Bhbj5cclxuICAgICAgPC9saT5cclxuICAgIDwvdWw+XHJcbiAgPC9kaXY+XHJcbjwvZGl2PlxyXG4iXX0=

package/esm2022/lib/components/filter-options/filter-options.component.mjs

@@ -0,0 +1,41 @@
+import { Component, EventEmitter, Output } from '@angular/core';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/forms";
+export class FilterOptionsComponent {
+    applyFilters = new EventEmitter();
+    closePanel = new EventEmitter();
+    // sample model
+    status = '';
+    condition = '';
+    ticketValue = null;
+    reviewer = '';
+    apply() {
+        const filters = {
+            status: this.status,
+            condition: this.condition,
+            ticketValue: this.ticketValue,
+            reviewer: this.reviewer
+        };
+        this.applyFilters.emit(filters); // send to parent
+    }
+    close() {
+        this.closePanel.emit();
+    }
+    reset() {
+        this.status = '';
+        this.condition = '';
+        this.ticketValue = null;
+        this.reviewer = '';
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FilterOptionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: FilterOptionsComponent, selector: "lib-filter-options", outputs: { applyFilters: "applyFilters", closePanel: "closePanel" }, ngImport: i0, template: "<div class=\"filter-card\">\r\n  <div class=\"filter-header\">\r\n    <span>Filter Options</span>\r\n    <button class=\"close-btn\" (click)=\"close()\">\u2715</button>\r\n  </div>\r\n\r\n  <div class=\"field\">\r\n    <label>Status</label>\r\n    <select [(ngModel)]=\"status\" class=\"select\">\r\n      <option value=\"\">Select</option>\r\n      <option>Open</option>\r\n      <option>Closed</option>\r\n      <option>In Progress</option>\r\n    </select>\r\n  </div>\r\n\r\n  <div class=\"field\">\r\n    <label>Store accuracy (%) by condition</label>\r\n    <div class=\"inline-row\">\r\n      <select [(ngModel)]=\"condition\" class=\"select\">\r\n        <option value=\"\">Select</option>\r\n        <option value=\">\">Greater than</option>\r\n        <option value=\"<\">Lesser than</option>\r\n        <option value=\">=\">Greater than or equal to</option>\r\n        <option value=\"<=\">Lesser than or equal to</option>\r\n      </select>\r\n\r\n      <input\r\n        type=\"number\"\r\n        [(ngModel)]=\"ticketValue\"\r\n        placeholder=\"1 to 100%\"\r\n        class=\"percent-input\"\r\n      />\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"field\">\r\n    <label>Reviewed by</label>\r\n    <select [(ngModel)]=\"reviewer\" class=\"select\">\r\n      <option value=\"\">Select</option>\r\n      <option>drewlenskart.com</option>\r\n      <option>user1lenskart.com</option>\r\n      <option>user2lenskart.com</option>\r\n    </select>\r\n  </div>\r\n\r\n  <div class=\"btn-row\">\r\n    <button class=\"btn btn-reset\" (click)=\"reset()\">Reset</button>\r\n    <button class=\"btn btn-apply\" (click)=\"apply()\">Apply</button>\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}body,.page-bg{background:#f3f4f7}.filter-card{width:360px;padding:18px 20px 16px;background:#fff;border-radius:16px;box-shadow:0 8px 20px #0f172a1f;font-size:13px}.filter-header{display:flex;justify-content:space-between;align-items:center;font-weight:600;margin-bottom:16px}.close-btn{border:none;background:transparent;cursor:pointer;font-size:14px}.field{margin-bottom:14px}.field label{display:block;font-size:12px;margin-bottom:4px;color:#4b5563}.inline-row{display:flex;gap:8px;align-items:center}.select{width:100%;padding:8px 10px;border-radius:10px;border:1px solid #e5e7eb;background:#f9fafb;font-size:13px;outline:none;appearance:none;background-image:linear-gradient(45deg,transparent 50%,#9ca3af 50%),linear-gradient(135deg,#9ca3af 50%,transparent 50%);background-position:calc(100% - 18px) 12px,calc(100% - 13px) 12px;background-size:5px 5px,5px 5px;background-repeat:no-repeat}.percent-input{width:110px;padding:8px 10px;border-radius:10px;border:1px solid #e5e7eb;background:#f9fafb;font-size:13px}.btn-row{display:flex;gap:10px;margin-top:10px}.btn{flex:1;border-radius:10px;padding:8px 0;font-size:13px;border:1px solid transparent;cursor:pointer}.btn-reset{background:#f9fafb;border-color:#e5e7eb}.btn-apply{background:#60b8ff;color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { 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.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { 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"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FilterOptionsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-filter-options', template: "<div class=\"filter-card\">\r\n  <div class=\"filter-header\">\r\n    <span>Filter Options</span>\r\n    <button class=\"close-btn\" (click)=\"close()\">\u2715</button>\r\n  </div>\r\n\r\n  <div class=\"field\">\r\n    <label>Status</label>\r\n    <select [(ngModel)]=\"status\" class=\"select\">\r\n      <option value=\"\">Select</option>\r\n      <option>Open</option>\r\n      <option>Closed</option>\r\n      <option>In Progress</option>\r\n    </select>\r\n  </div>\r\n\r\n  <div class=\"field\">\r\n    <label>Store accuracy (%) by condition</label>\r\n    <div class=\"inline-row\">\r\n      <select [(ngModel)]=\"condition\" class=\"select\">\r\n        <option value=\"\">Select</option>\r\n        <option value=\">\">Greater than</option>\r\n        <option value=\"<\">Lesser than</option>\r\n        <option value=\">=\">Greater than or equal to</option>\r\n        <option value=\"<=\">Lesser than or equal to</option>\r\n      </select>\r\n\r\n      <input\r\n        type=\"number\"\r\n        [(ngModel)]=\"ticketValue\"\r\n        placeholder=\"1 to 100%\"\r\n        class=\"percent-input\"\r\n      />\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"field\">\r\n    <label>Reviewed by</label>\r\n    <select [(ngModel)]=\"reviewer\" class=\"select\">\r\n      <option value=\"\">Select</option>\r\n      <option>drewlenskart.com</option>\r\n      <option>user1lenskart.com</option>\r\n      <option>user2lenskart.com</option>\r\n    </select>\r\n  </div>\r\n\r\n  <div class=\"btn-row\">\r\n    <button class=\"btn btn-reset\" (click)=\"reset()\">Reset</button>\r\n    <button class=\"btn btn-apply\" (click)=\"apply()\">Apply</button>\r\n  </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}body,.page-bg{background:#f3f4f7}.filter-card{width:360px;padding:18px 20px 16px;background:#fff;border-radius:16px;box-shadow:0 8px 20px #0f172a1f;font-size:13px}.filter-header{display:flex;justify-content:space-between;align-items:center;font-weight:600;margin-bottom:16px}.close-btn{border:none;background:transparent;cursor:pointer;font-size:14px}.field{margin-bottom:14px}.field label{display:block;font-size:12px;margin-bottom:4px;color:#4b5563}.inline-row{display:flex;gap:8px;align-items:center}.select{width:100%;padding:8px 10px;border-radius:10px;border:1px solid #e5e7eb;background:#f9fafb;font-size:13px;outline:none;appearance:none;background-image:linear-gradient(45deg,transparent 50%,#9ca3af 50%),linear-gradient(135deg,#9ca3af 50%,transparent 50%);background-position:calc(100% - 18px) 12px,calc(100% - 13px) 12px;background-size:5px 5px,5px 5px;background-repeat:no-repeat}.percent-input{width:110px;padding:8px 10px;border-radius:10px;border:1px solid #e5e7eb;background:#f9fafb;font-size:13px}.btn-row{display:flex;gap:10px;margin-top:10px}.btn{flex:1;border-radius:10px;padding:8px 0;font-size:13px;border:1px solid transparent;cursor:pointer}.btn-reset{background:#f9fafb;border-color:#e5e7eb}.btn-apply{background:#60b8ff;color:#fff}\n"] }]
+        }], propDecorators: { applyFilters: [{
+                type: Output
+            }], closePanel: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmlsdGVyLW9wdGlvbnMuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvdGFuZ28tbWFuYWdlLXRpY2tldHMvc3JjL2xpYi9jb21wb25lbnRzL2ZpbHRlci1vcHRpb25zL2ZpbHRlci1vcHRpb25zLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3RhbmdvLW1hbmFnZS10aWNrZXRzL3NyYy9saWIvY29tcG9uZW50cy9maWx0ZXItb3B0aW9ucy9maWx0ZXItb3B0aW9ucy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7OztBQU9oRSxNQUFNLE9BQU8sc0JBQXNCO0lBQ3hCLFlBQVksR0FBRyxJQUFJLFlBQVksRUFBTyxDQUFDO0lBQ3RDLFVBQVUsR0FBSyxJQUFJLFlBQVksRUFBUSxDQUFDO0lBRWxELGVBQWU7SUFDZixNQUFNLEdBQVcsRUFBRSxDQUFDO0lBQ3BCLFNBQVMsR0FBVyxFQUFFLENBQUM7SUFDdkIsV0FBVyxHQUFrQixJQUFJLENBQUM7SUFDbEMsUUFBUSxHQUFXLEVBQUUsQ0FBQztJQUV0QixLQUFLO1FBQ0gsTUFBTSxPQUFPLEdBQUc7WUFDZCxNQUFNLEVBQUUsSUFBSSxDQUFDLE1BQU07WUFDbkIsU0FBUyxFQUFFLElBQUksQ0FBQyxTQUFTO1lBQ3pCLFdBQVcsRUFBRSxJQUFJLENBQUMsV0FBVztZQUM3QixRQUFRLEVBQUUsSUFBSSxDQUFDLFFBQVE7U0FDeEIsQ0FBQztRQUNGLElBQUksQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUcsaUJBQWlCO0lBQ3RELENBQUM7SUFFRCxLQUFLO1FBQ0gsSUFBSSxDQUFDLFVBQVUsQ0FBQyxJQUFJLEVBQUUsQ0FBQztJQUN6QixDQUFDO0lBRUQsS0FBSztRQUNILElBQUksQ0FBQyxNQUFNLEdBQUcsRUFBRSxDQUFDO1FBQ2pCLElBQUksQ0FBQyxTQUFTLEdBQUcsRUFBRSxDQUFDO1FBQ3BCLElBQUksQ0FBQyxXQUFXLEdBQUcsSUFBSSxDQUFDO1FBQ3hCLElBQUksQ0FBQyxRQUFRLEdBQUcsRUFBRSxDQUFDO0lBQ3JCLENBQUM7d0dBN0JVLHNCQUFzQjs0RkFBdEIsc0JBQXNCLCtIQ1BuQyxvcERBbURBOzs0RkQ1Q2Esc0JBQXNCO2tCQUxsQyxTQUFTOytCQUNFLG9CQUFvQjs4QkFLckIsWUFBWTtzQkFBckIsTUFBTTtnQkFDSSxVQUFVO3NCQUFuQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIE91dHB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdsaWItZmlsdGVyLW9wdGlvbnMnLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi9maWx0ZXItb3B0aW9ucy5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmw6ICcuL2ZpbHRlci1vcHRpb25zLmNvbXBvbmVudC5zY3NzJ1xyXG59KVxyXG5leHBvcnQgY2xhc3MgRmlsdGVyT3B0aW9uc0NvbXBvbmVudCB7XHJcbiBAT3V0cHV0KCkgYXBwbHlGaWx0ZXJzID0gbmV3IEV2ZW50RW1pdHRlcjxhbnk+KCk7XHJcbiAgQE91dHB1dCgpIGNsb3NlUGFuZWwgICA9IG5ldyBFdmVudEVtaXR0ZXI8dm9pZD4oKTtcclxuXHJcbiAgLy8gc2FtcGxlIG1vZGVsXHJcbiAgc3RhdHVzOiBzdHJpbmcgPSAnJztcclxuICBjb25kaXRpb246IHN0cmluZyA9ICcnO1xyXG4gIHRpY2tldFZhbHVlOiBudW1iZXIgfCBudWxsID0gbnVsbDtcclxuICByZXZpZXdlcjogc3RyaW5nID0gJyc7XHJcblxyXG4gIGFwcGx5KCkge1xyXG4gICAgY29uc3QgZmlsdGVycyA9IHtcclxuICAgICAgc3RhdHVzOiB0aGlzLnN0YXR1cyxcclxuICAgICAgY29uZGl0aW9uOiB0aGlzLmNvbmRpdGlvbixcclxuICAgICAgdGlja2V0VmFsdWU6IHRoaXMudGlja2V0VmFsdWUsXHJcbiAgICAgIHJldmlld2VyOiB0aGlzLnJldmlld2VyXHJcbiAgICB9O1xyXG4gICAgdGhpcy5hcHBseUZpbHRlcnMuZW1pdChmaWx0ZXJzKTsgICAvLyBzZW5kIHRvIHBhcmVudFxyXG4gIH1cclxuXHJcbiAgY2xvc2UoKSB7XHJcbiAgICB0aGlzLmNsb3NlUGFuZWwuZW1pdCgpO1xyXG4gIH1cclxuXHJcbiAgcmVzZXQoKSB7XHJcbiAgICB0aGlzLnN0YXR1cyA9ICcnO1xyXG4gICAgdGhpcy5jb25kaXRpb24gPSAnJztcclxuICAgIHRoaXMudGlja2V0VmFsdWUgPSBudWxsO1xyXG4gICAgdGhpcy5yZXZpZXdlciA9ICcnO1xyXG4gIH1cclxufVxyXG4iLCI8ZGl2IGNsYXNzPVwiZmlsdGVyLWNhcmRcIj5cclxuICA8ZGl2IGNsYXNzPVwiZmlsdGVyLWhlYWRlclwiPlxyXG4gICAgPHNwYW4+RmlsdGVyIE9wdGlvbnM8L3NwYW4+XHJcbiAgICA8YnV0dG9uIGNsYXNzPVwiY2xvc2UtYnRuXCIgKGNsaWNrKT1cImNsb3NlKClcIj7inJU8L2J1dHRvbj5cclxuICA8L2Rpdj5cclxuXHJcbiAgPGRpdiBjbGFzcz1cImZpZWxkXCI+XHJcbiAgICA8bGFiZWw+U3RhdHVzPC9sYWJlbD5cclxuICAgIDxzZWxlY3QgWyhuZ01vZGVsKV09XCJzdGF0dXNcIiBjbGFzcz1cInNlbGVjdFwiPlxyXG4gICAgICA8b3B0aW9uIHZhbHVlPVwiXCI+U2VsZWN0PC9vcHRpb24+XHJcbiAgICAgIDxvcHRpb24+T3Blbjwvb3B0aW9uPlxyXG4gICAgICA8b3B0aW9uPkNsb3NlZDwvb3B0aW9uPlxyXG4gICAgICA8b3B0aW9uPkluIFByb2dyZXNzPC9vcHRpb24+XHJcbiAgICA8L3NlbGVjdD5cclxuICA8L2Rpdj5cclxuXHJcbiAgPGRpdiBjbGFzcz1cImZpZWxkXCI+XHJcbiAgICA8bGFiZWw+U3RvcmUgYWNjdXJhY3kgKCUpIGJ5IGNvbmRpdGlvbjwvbGFiZWw+XHJcbiAgICA8ZGl2IGNsYXNzPVwiaW5saW5lLXJvd1wiPlxyXG4gICAgICA8c2VsZWN0IFsobmdNb2RlbCldPVwiY29uZGl0aW9uXCIgY2xhc3M9XCJzZWxlY3RcIj5cclxuICAgICAgICA8b3B0aW9uIHZhbHVlPVwiXCI+U2VsZWN0PC9vcHRpb24+XHJcbiAgICAgICAgPG9wdGlvbiB2YWx1ZT1cIj5cIj5HcmVhdGVyIHRoYW48L29wdGlvbj5cclxuICAgICAgICA8b3B0aW9uIHZhbHVlPVwiPFwiPkxlc3NlciB0aGFuPC9vcHRpb24+XHJcbiAgICAgICAgPG9wdGlvbiB2YWx1ZT1cIj49XCI+R3JlYXRlciB0aGFuIG9yIGVxdWFsIHRvPC9vcHRpb24+XHJcbiAgICAgICAgPG9wdGlvbiB2YWx1ZT1cIjw9XCI+TGVzc2VyIHRoYW4gb3IgZXF1YWwgdG88L29wdGlvbj5cclxuICAgICAgPC9zZWxlY3Q+XHJcblxyXG4gICAgICA8aW5wdXRcclxuICAgICAgICB0eXBlPVwibnVtYmVyXCJcclxuICAgICAgICBbKG5nTW9kZWwpXT1cInRpY2tldFZhbHVlXCJcclxuICAgICAgICBwbGFjZWhvbGRlcj1cIjEgdG8gMTAwJVwiXHJcbiAgICAgICAgY2xhc3M9XCJwZXJjZW50LWlucHV0XCJcclxuICAgICAgLz5cclxuICAgIDwvZGl2PlxyXG4gIDwvZGl2PlxyXG5cclxuICA8ZGl2IGNsYXNzPVwiZmllbGRcIj5cclxuICAgIDxsYWJlbD5SZXZpZXdlZCBieTwvbGFiZWw+XHJcbiAgICA8c2VsZWN0IFsobmdNb2RlbCldPVwicmV2aWV3ZXJcIiBjbGFzcz1cInNlbGVjdFwiPlxyXG4gICAgICA8b3B0aW9uIHZhbHVlPVwiXCI+U2VsZWN0PC9vcHRpb24+XHJcbiAgICAgIDxvcHRpb24+ZHJld2xlbnNrYXJ0LmNvbTwvb3B0aW9uPlxyXG4gICAgICA8b3B0aW9uPnVzZXIxbGVuc2thcnQuY29tPC9vcHRpb24+XHJcbiAgICAgIDxvcHRpb24+dXNlcjJsZW5za2FydC5jb208L29wdGlvbj5cclxuICAgIDwvc2VsZWN0PlxyXG4gIDwvZGl2PlxyXG5cclxuICA8ZGl2IGNsYXNzPVwiYnRuLXJvd1wiPlxyXG4gICAgPGJ1dHRvbiBjbGFzcz1cImJ0biBidG4tcmVzZXRcIiAoY2xpY2spPVwicmVzZXQoKVwiPlJlc2V0PC9idXR0b24+XHJcbiAgICA8YnV0dG9uIGNsYXNzPVwiYnRuIGJ0bi1hcHBseVwiIChjbGljayk9XCJhcHBseSgpXCI+QXBwbHk8L2J1dHRvbj5cclxuICA8L2Rpdj5cclxuPC9kaXY+XHJcbiJdfQ==