tango-app-ui-manage-tickets 3.7.0-beta.26 → 3.7.0-beta.28

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==