nira-falcon 0.1.56 → 0.1.58
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/core-auto-complete/core-auto-complete.component.mjs +2 -2
- package/esm2022/lib/core-multi-select/core-multi-select-row/core-multi-select-row.component.mjs +2 -2
- package/esm2022/lib/core-multi-select/core-multi-select.component.mjs +2 -2
- package/esm2022/lib/core-select-search/core-select-search.component.mjs +2 -2
- package/esm2022/lib/core-table/core-column-selector/core-column-selector.component.mjs +2 -2
- package/fesm2022/nira-falcon.mjs +10 -10
- package/fesm2022/nira-falcon.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -61,11 +61,11 @@ export class CoreAutoCompleteComponent {
|
|
|
61
61
|
this.filterItems = this.items.filter((item) => !item.title.indexOf(value));
|
|
62
62
|
}
|
|
63
63
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreAutoCompleteComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
64
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreAutoCompleteComponent, selector: "core-auto-complete", inputs: { label: "label", titleKey: "titleKey", valueKey: "valueKey", items: "items", defaultValue: "defaultValue" }, outputs: { onChange: "onChange" }, ngImport: i0, template: "<div class=\"dropdown\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{ 'select-clicked': isOpenMenu }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <input\r\n class=\"selected\"\r\n [placeholder]=\"label\"\r\n [(ngModel)]=\"value\"\r\n (ngModelChange)=\"onChanged($event)\"\r\n (focusout)=\"focusOut()\"\r\n />\r\n <span\r\n class=\"material-symbols-outlined caret\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n >\r\n expand_more\r\n </span>\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <li\r\n *ngFor=\"let item of _items\"\r\n [ngClass]=\"{ active: item == selectedItem }\"\r\n (click)=\"onItemSelect(item)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .select{background:#fff;color:#304050;display:flex;flex-direction:row-reverse;justify-content:space-between;align-items:center;border:2px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:13px;-webkit-user-select:none;user-select:none}.dropdown .select:hover,.dropdown .select:hover .selected{background:#fbfbfb}.dropdown .select .selected{width:100%;font-size:13px;outline:none;border:none;-webkit-user-select:none;user-select:none}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select-clicked{border:2px #4f6883 solid;box-shadow:0 0 .8em #888}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:42px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:3}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6}.dropdown .menu .active{background:#ced4da}.dropdown .menu-open{display:block;opacity:1}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
64
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreAutoCompleteComponent, selector: "core-auto-complete", inputs: { label: "label", titleKey: "titleKey", valueKey: "valueKey", items: "items", defaultValue: "defaultValue" }, outputs: { onChange: "onChange" }, ngImport: i0, template: "<div class=\"dropdown\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{ 'select-clicked': isOpenMenu }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <input\r\n class=\"selected\"\r\n [placeholder]=\"label\"\r\n [(ngModel)]=\"value\"\r\n (ngModelChange)=\"onChanged($event)\"\r\n (focusout)=\"focusOut()\"\r\n />\r\n <span\r\n class=\"material-symbols-outlined caret\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n >\r\n expand_more\r\n </span>\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <li\r\n *ngFor=\"let item of _items\"\r\n [ngClass]=\"{ active: item == selectedItem }\"\r\n (click)=\"onItemSelect(item)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .select{background:#fff;color:#304050;display:flex;flex-direction:row-reverse;justify-content:space-between;align-items:center;border:2px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:13px;-webkit-user-select:none;user-select:none}.dropdown .select:hover,.dropdown .select:hover .selected{background:#fbfbfb}.dropdown .select .selected{width:100%;font-size:13px;outline:none;border:none;-webkit-user-select:none;user-select:none}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select-clicked{border:2px #4f6883 solid;box-shadow:0 0 .8em #888}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:42px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:3}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6;box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.dropdown .menu .active{background:#ced4da!important}.dropdown .menu-open{display:block;opacity:1}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
65
65
|
}
|
|
66
66
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreAutoCompleteComponent, decorators: [{
|
|
67
67
|
type: Component,
|
|
68
|
-
args: [{ selector: 'core-auto-complete', template: "<div class=\"dropdown\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{ 'select-clicked': isOpenMenu }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <input\r\n class=\"selected\"\r\n [placeholder]=\"label\"\r\n [(ngModel)]=\"value\"\r\n (ngModelChange)=\"onChanged($event)\"\r\n (focusout)=\"focusOut()\"\r\n />\r\n <span\r\n class=\"material-symbols-outlined caret\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n >\r\n expand_more\r\n </span>\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <li\r\n *ngFor=\"let item of _items\"\r\n [ngClass]=\"{ active: item == selectedItem }\"\r\n (click)=\"onItemSelect(item)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .select{background:#fff;color:#304050;display:flex;flex-direction:row-reverse;justify-content:space-between;align-items:center;border:2px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:13px;-webkit-user-select:none;user-select:none}.dropdown .select:hover,.dropdown .select:hover .selected{background:#fbfbfb}.dropdown .select .selected{width:100%;font-size:13px;outline:none;border:none;-webkit-user-select:none;user-select:none}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select-clicked{border:2px #4f6883 solid;box-shadow:0 0 .8em #888}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:42px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:3}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6}.dropdown .menu .active{background:#ced4da}.dropdown .menu-open{display:block;opacity:1}\n"] }]
|
|
68
|
+
args: [{ selector: 'core-auto-complete', template: "<div class=\"dropdown\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{ 'select-clicked': isOpenMenu }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <input\r\n class=\"selected\"\r\n [placeholder]=\"label\"\r\n [(ngModel)]=\"value\"\r\n (ngModelChange)=\"onChanged($event)\"\r\n (focusout)=\"focusOut()\"\r\n />\r\n <span\r\n class=\"material-symbols-outlined caret\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n >\r\n expand_more\r\n </span>\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <li\r\n *ngFor=\"let item of _items\"\r\n [ngClass]=\"{ active: item == selectedItem }\"\r\n (click)=\"onItemSelect(item)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .select{background:#fff;color:#304050;display:flex;flex-direction:row-reverse;justify-content:space-between;align-items:center;border:2px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:13px;-webkit-user-select:none;user-select:none}.dropdown .select:hover,.dropdown .select:hover .selected{background:#fbfbfb}.dropdown .select .selected{width:100%;font-size:13px;outline:none;border:none;-webkit-user-select:none;user-select:none}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select-clicked{border:2px #4f6883 solid;box-shadow:0 0 .8em #888}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:42px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:3}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6;box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.dropdown .menu .active{background:#ced4da!important}.dropdown .menu-open{display:block;opacity:1}\n"] }]
|
|
69
69
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { label: [{
|
|
70
70
|
type: Input
|
|
71
71
|
}], titleKey: [{
|
package/esm2022/lib/core-multi-select/core-multi-select-row/core-multi-select-row.component.mjs
CHANGED
|
@@ -13,11 +13,11 @@ export class CoreMultiSelectRowComponent {
|
|
|
13
13
|
this.onSelect.emit(true);
|
|
14
14
|
}
|
|
15
15
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreMultiSelectRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
16
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreMultiSelectRowComponent, selector: "app-core-multi-select-row", inputs: { isSelected: "isSelected", item: "item" }, outputs: { onSelect: "onSelect" }, ngImport: i0, template: "<li [ngClass]=\"{ active: _isSelected }\" (click)=\"onItemSelect()\">\r\n {{ item.title }}\r\n</li>\r\n", styles: ["li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}li:hover{background:#f6f6f6}.active{background:#ced4da}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
16
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreMultiSelectRowComponent, selector: "app-core-multi-select-row", inputs: { isSelected: "isSelected", item: "item" }, outputs: { onSelect: "onSelect" }, ngImport: i0, template: "<li [ngClass]=\"{ active: _isSelected }\" (click)=\"onItemSelect()\">\r\n {{ item.title }}\r\n</li>\r\n", styles: ["li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}li:hover{background:#f6f6f6;box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.active{background:#ced4da!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
17
17
|
}
|
|
18
18
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreMultiSelectRowComponent, decorators: [{
|
|
19
19
|
type: Component,
|
|
20
|
-
args: [{ selector: 'app-core-multi-select-row', template: "<li [ngClass]=\"{ active: _isSelected }\" (click)=\"onItemSelect()\">\r\n {{ item.title }}\r\n</li>\r\n", styles: ["li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}li:hover{background:#f6f6f6}.active{background:#ced4da}\n"] }]
|
|
20
|
+
args: [{ selector: 'app-core-multi-select-row', template: "<li [ngClass]=\"{ active: _isSelected }\" (click)=\"onItemSelect()\">\r\n {{ item.title }}\r\n</li>\r\n", styles: ["li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}li:hover{background:#f6f6f6;box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.active{background:#ced4da!important}\n"] }]
|
|
21
21
|
}], propDecorators: { isSelected: [{
|
|
22
22
|
type: Input
|
|
23
23
|
}], item: [{
|
|
@@ -124,11 +124,11 @@ export class CoreMultiSelectComponent {
|
|
|
124
124
|
this.inputFormControl.markAsTouched();
|
|
125
125
|
}
|
|
126
126
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreMultiSelectComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
127
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreMultiSelectComponent, selector: "core-multi-select", inputs: { titleKey: "titleKey", valueKey: "valueKey", items: "items", defaultValue: "defaultValue", label: "label", singleSelectItems: "singleSelectItems", inputFormControl: "inputFormControl" }, outputs: { onItemSelected: "onItemSelected" }, ngImport: i0, template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut()\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n selectError: inputFormControl.touched && inputFormControl.errors\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span class=\"placeholder-top\" *ngIf=\"isSelectedItems\">{{ label }}</span>\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n class=\"text-content text-right\"\r\n [ngClass]=\"[\r\n label.length > 0 && !isSelectedItems ? 'placeholder' : 'selected'\r\n ]\"\r\n >{{ label.length > 0 && !isSelectedItems ? label : text }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <app-core-multi-select-row\r\n *ngFor=\"let item of newItems\"\r\n [item]=\"item\"\r\n [isSelected]=\"selectedItems[item.value] ? true : false\"\r\n (onSelect)=\"onItemSelect(item, true)\"\r\n >\r\n </app-core-multi-select-row>\r\n </ul>\r\n <div class=\"label-error overflow-hidden\">\r\n <span\r\n *ngIf=\"\r\n inputFormControl.touched &&\r\n inputFormControl.errors?.['required']\"\r\n >\u0627\u06CC\u0646 \u0641\u06CC\u0644\u062F \u062E\u0627\u0644\u06CC \u0627\u0633\u062A</span\r\n >\r\n </div>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .select{background:#fff;color:#304050;display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border:1px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:hover{background:#fbfbfb}.dropdown .select .text-content{white-space:nowrap;display:block;width:263px;overflow:hidden;word-wrap:break-word;text-overflow:ellipsis}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:#fff;top:-8px;padding-inline:6px;font-size:11px;color:#888}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:#888;padding-inline:16px}.dropdown .select-clicked{border:1px solid rgba(19,92,175,.397)}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6}.dropdown .menu .active{background:#ced4da}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:red;font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid #fe5f5f!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.CoreMultiSelectRowComponent, selector: "app-core-multi-select-row", inputs: ["isSelected", "item"], outputs: ["onSelect"] }, { kind: "component", type: i3.ArrowDownIconComponent, selector: "arrow-down-icon" }] }); }
|
|
127
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreMultiSelectComponent, selector: "core-multi-select", inputs: { titleKey: "titleKey", valueKey: "valueKey", items: "items", defaultValue: "defaultValue", label: "label", singleSelectItems: "singleSelectItems", inputFormControl: "inputFormControl" }, outputs: { onItemSelected: "onItemSelected" }, ngImport: i0, template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut()\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n selectError: inputFormControl.touched && inputFormControl.errors\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span class=\"placeholder-top\" *ngIf=\"isSelectedItems\">{{ label }}</span>\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n class=\"text-content text-right\"\r\n [ngClass]=\"[\r\n label.length > 0 && !isSelectedItems ? 'placeholder' : 'selected'\r\n ]\"\r\n >{{ label.length > 0 && !isSelectedItems ? label : text }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <app-core-multi-select-row\r\n *ngFor=\"let item of newItems\"\r\n [item]=\"item\"\r\n [isSelected]=\"selectedItems[item.value] ? true : false\"\r\n (onSelect)=\"onItemSelect(item, true)\"\r\n >\r\n </app-core-multi-select-row>\r\n </ul>\r\n <div class=\"label-error overflow-hidden\">\r\n <span\r\n *ngIf=\"\r\n inputFormControl.touched &&\r\n inputFormControl.errors?.['required']\"\r\n >\u0627\u06CC\u0646 \u0641\u06CC\u0644\u062F \u062E\u0627\u0644\u06CC \u0627\u0633\u062A</span\r\n >\r\n </div>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .select{background:#fff;color:#304050;display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border:1px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:hover{background:#fbfbfb}.dropdown .select .text-content{white-space:nowrap;display:block;width:263px;overflow:hidden;word-wrap:break-word;text-overflow:ellipsis}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:#fff;top:-8px;padding-inline:6px;font-size:11px;color:#888}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:#888;padding-inline:16px}.dropdown .select-clicked{border:1px solid rgba(19,92,175,.397)}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6;box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.dropdown .menu .active{background:#ced4da!important}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:red;font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid #fe5f5f!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.CoreMultiSelectRowComponent, selector: "app-core-multi-select-row", inputs: ["isSelected", "item"], outputs: ["onSelect"] }, { kind: "component", type: i3.ArrowDownIconComponent, selector: "arrow-down-icon" }] }); }
|
|
128
128
|
}
|
|
129
129
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreMultiSelectComponent, decorators: [{
|
|
130
130
|
type: Component,
|
|
131
|
-
args: [{ selector: 'core-multi-select', template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut()\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n selectError: inputFormControl.touched && inputFormControl.errors\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span class=\"placeholder-top\" *ngIf=\"isSelectedItems\">{{ label }}</span>\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n class=\"text-content text-right\"\r\n [ngClass]=\"[\r\n label.length > 0 && !isSelectedItems ? 'placeholder' : 'selected'\r\n ]\"\r\n >{{ label.length > 0 && !isSelectedItems ? label : text }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <app-core-multi-select-row\r\n *ngFor=\"let item of newItems\"\r\n [item]=\"item\"\r\n [isSelected]=\"selectedItems[item.value] ? true : false\"\r\n (onSelect)=\"onItemSelect(item, true)\"\r\n >\r\n </app-core-multi-select-row>\r\n </ul>\r\n <div class=\"label-error overflow-hidden\">\r\n <span\r\n *ngIf=\"\r\n inputFormControl.touched &&\r\n inputFormControl.errors?.['required']\"\r\n >\u0627\u06CC\u0646 \u0641\u06CC\u0644\u062F \u062E\u0627\u0644\u06CC \u0627\u0633\u062A</span\r\n >\r\n </div>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .select{background:#fff;color:#304050;display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border:1px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:hover{background:#fbfbfb}.dropdown .select .text-content{white-space:nowrap;display:block;width:263px;overflow:hidden;word-wrap:break-word;text-overflow:ellipsis}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:#fff;top:-8px;padding-inline:6px;font-size:11px;color:#888}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:#888;padding-inline:16px}.dropdown .select-clicked{border:1px solid rgba(19,92,175,.397)}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6}.dropdown .menu .active{background:#ced4da}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:red;font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid #fe5f5f!important}\n"] }]
|
|
131
|
+
args: [{ selector: 'core-multi-select', template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut()\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n selectError: inputFormControl.touched && inputFormControl.errors\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span class=\"placeholder-top\" *ngIf=\"isSelectedItems\">{{ label }}</span>\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n class=\"text-content text-right\"\r\n [ngClass]=\"[\r\n label.length > 0 && !isSelectedItems ? 'placeholder' : 'selected'\r\n ]\"\r\n >{{ label.length > 0 && !isSelectedItems ? label : text }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <app-core-multi-select-row\r\n *ngFor=\"let item of newItems\"\r\n [item]=\"item\"\r\n [isSelected]=\"selectedItems[item.value] ? true : false\"\r\n (onSelect)=\"onItemSelect(item, true)\"\r\n >\r\n </app-core-multi-select-row>\r\n </ul>\r\n <div class=\"label-error overflow-hidden\">\r\n <span\r\n *ngIf=\"\r\n inputFormControl.touched &&\r\n inputFormControl.errors?.['required']\"\r\n >\u0627\u06CC\u0646 \u0641\u06CC\u0644\u062F \u062E\u0627\u0644\u06CC \u0627\u0633\u062A</span\r\n >\r\n </div>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .select{background:#fff;color:#304050;display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border:1px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:hover{background:#fbfbfb}.dropdown .select .text-content{white-space:nowrap;display:block;width:263px;overflow:hidden;word-wrap:break-word;text-overflow:ellipsis}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:#fff;top:-8px;padding-inline:6px;font-size:11px;color:#888}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:#888;padding-inline:16px}.dropdown .select-clicked{border:1px solid rgba(19,92,175,.397)}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6;box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.dropdown .menu .active{background:#ced4da!important}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:red;font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid #fe5f5f!important}\n"] }]
|
|
132
132
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { titleKey: [{
|
|
133
133
|
type: Input
|
|
134
134
|
}], valueKey: [{
|
|
@@ -91,11 +91,11 @@ export class CoreSelectSearchComponent {
|
|
|
91
91
|
this.changeSearchText();
|
|
92
92
|
}
|
|
93
93
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreSelectSearchComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
94
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreSelectSearchComponent, selector: "core-select-search", inputs: { titleKey: "titleKey", valueKey: "valueKey", size: "size", canHighlightBackground: "canHighlightBackground", items: "items", defaultValue: "defaultValue", label: "label", disabled: "disabled", inputFormControl: "inputFormControl" }, outputs: { onItemSelected: "onItemSelected" }, ngImport: i0, template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut($event)\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n 'highlight-background':\r\n canHighlightBackground &&\r\n (selectedItem | json) === ({} | json) &&\r\n !(inputFormControl.touched && inputFormControl.errors),\r\n selectError: inputFormControl.touched && inputFormControl.errors ,\r\n 'disable-selector': disabled,\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span\r\n class=\"placeholder-top\"\r\n *ngIf=\"(selectedItem | json) != ({} | json)\"\r\n >{{ label }}</span\r\n >\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n [ngClass]=\"[\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? 'placeholder'\r\n : 'selected'\r\n ]\"\r\n >{{\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? label\r\n : selectedItem.title\r\n }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <div\r\n class=\"grid grid-cols-12 h-11 items-center pe-5 ps-5 bg-white shadow-md\"\r\n >\r\n <input\r\n placeholder=\"\u062C\u0633\u062A\u062C\u0648 \"\r\n class=\"col-span-11 bg-transparent focus:outline-none min-h-9\"\r\n [(ngModel)]=\"searchText\"\r\n (keyup)=\"changeSearchText()\"\r\n />\r\n <span class=\"md:h-7 flex justify-center\">\r\n <search-icon\r\n class=\"transform scale-x-[-1] fill-icon-color hover:fill-primary-color hover:cursor-pointer\"\r\n >\r\n </search-icon\r\n ></span>\r\n </div>\r\n <li\r\n *ngFor=\"let item of filteredItems | async\"\r\n [ngClass]=\"{ active: item.value === selectedItem.value }\"\r\n (click)=\"onItemSelect(item, true)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n <div class=\"label-error overflow-hidden\">\r\n <span\r\n *ngIf=\"\r\n inputFormControl.touched &&\r\n inputFormControl.errors?.['required']\"\r\n >\u0627\u06CC\u0646 \u0641\u06CC\u0644\u062F \u062E\u0627\u0644\u06CC \u0627\u0633\u062A</span\r\n >\r\n </div>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .disable-selector{background-color:#f7f7f7!important;border:1px dashed #ced4da!important;cursor:no-drop!important}.dropdown .highlight-background{background-color:#dcf6ff!important}.dropdown .select{background:#fff;color:#304050;display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border:1px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:hover{background:#fbfbfb}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:#fff;top:-8px;padding-inline:6px;font-size:11px;color:#888}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:#888;padding-inline:16px}.dropdown .select-clicked{border:1px solid rgba(19,92,175,.397)}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6}.dropdown .menu .active{background:#ced4da}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:red;font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid #fe5f5f!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.SearchIconComponent, selector: "search-icon" }, { kind: "component", type: i4.ArrowDownIconComponent, selector: "arrow-down-icon" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.JsonPipe, name: "json" }] }); }
|
|
94
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreSelectSearchComponent, selector: "core-select-search", inputs: { titleKey: "titleKey", valueKey: "valueKey", size: "size", canHighlightBackground: "canHighlightBackground", items: "items", defaultValue: "defaultValue", label: "label", disabled: "disabled", inputFormControl: "inputFormControl" }, outputs: { onItemSelected: "onItemSelected" }, ngImport: i0, template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut($event)\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n 'highlight-background':\r\n canHighlightBackground &&\r\n (selectedItem | json) === ({} | json) &&\r\n !(inputFormControl.touched && inputFormControl.errors),\r\n selectError: inputFormControl.touched && inputFormControl.errors ,\r\n 'disable-selector': disabled,\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span\r\n class=\"placeholder-top\"\r\n *ngIf=\"(selectedItem | json) != ({} | json)\"\r\n >{{ label }}</span\r\n >\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n [ngClass]=\"[\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? 'placeholder'\r\n : 'selected'\r\n ]\"\r\n >{{\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? label\r\n : selectedItem.title\r\n }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <div\r\n class=\"grid grid-cols-12 h-11 items-center pe-5 ps-5 bg-white shadow-md\"\r\n >\r\n <input\r\n placeholder=\"\u062C\u0633\u062A\u062C\u0648 \"\r\n class=\"col-span-11 bg-transparent focus:outline-none min-h-9\"\r\n [(ngModel)]=\"searchText\"\r\n (keyup)=\"changeSearchText()\"\r\n />\r\n <span class=\"md:h-7 flex justify-center\">\r\n <search-icon\r\n class=\"transform scale-x-[-1] fill-icon-color hover:fill-primary-color hover:cursor-pointer\"\r\n >\r\n </search-icon\r\n ></span>\r\n </div>\r\n <li\r\n *ngFor=\"let item of filteredItems | async\"\r\n [ngClass]=\"{ active: item.value === selectedItem.value }\"\r\n (click)=\"onItemSelect(item, true)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n <div class=\"label-error overflow-hidden\">\r\n <span\r\n *ngIf=\"\r\n inputFormControl.touched &&\r\n inputFormControl.errors?.['required']\"\r\n >\u0627\u06CC\u0646 \u0641\u06CC\u0644\u062F \u062E\u0627\u0644\u06CC \u0627\u0633\u062A</span\r\n >\r\n </div>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .disable-selector{background-color:#f7f7f7!important;border:1px dashed #ced4da!important;cursor:no-drop!important}.dropdown .highlight-background{background-color:#dcf6ff!important}.dropdown .select{background:#fff;color:#304050;display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border:1px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:hover{background:#fbfbfb}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:#fff;top:-8px;padding-inline:6px;font-size:11px;color:#888}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:#888;padding-inline:16px}.dropdown .select-clicked{border:1px solid rgba(19,92,175,.397)}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6;box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.dropdown .menu .active{background:#ced4da!important}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:red;font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid #fe5f5f!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.SearchIconComponent, selector: "search-icon" }, { kind: "component", type: i4.ArrowDownIconComponent, selector: "arrow-down-icon" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.JsonPipe, name: "json" }] }); }
|
|
95
95
|
}
|
|
96
96
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreSelectSearchComponent, decorators: [{
|
|
97
97
|
type: Component,
|
|
98
|
-
args: [{ selector: 'core-select-search', template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut($event)\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n 'highlight-background':\r\n canHighlightBackground &&\r\n (selectedItem | json) === ({} | json) &&\r\n !(inputFormControl.touched && inputFormControl.errors),\r\n selectError: inputFormControl.touched && inputFormControl.errors ,\r\n 'disable-selector': disabled,\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span\r\n class=\"placeholder-top\"\r\n *ngIf=\"(selectedItem | json) != ({} | json)\"\r\n >{{ label }}</span\r\n >\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n [ngClass]=\"[\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? 'placeholder'\r\n : 'selected'\r\n ]\"\r\n >{{\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? label\r\n : selectedItem.title\r\n }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <div\r\n class=\"grid grid-cols-12 h-11 items-center pe-5 ps-5 bg-white shadow-md\"\r\n >\r\n <input\r\n placeholder=\"\u062C\u0633\u062A\u062C\u0648 \"\r\n class=\"col-span-11 bg-transparent focus:outline-none min-h-9\"\r\n [(ngModel)]=\"searchText\"\r\n (keyup)=\"changeSearchText()\"\r\n />\r\n <span class=\"md:h-7 flex justify-center\">\r\n <search-icon\r\n class=\"transform scale-x-[-1] fill-icon-color hover:fill-primary-color hover:cursor-pointer\"\r\n >\r\n </search-icon\r\n ></span>\r\n </div>\r\n <li\r\n *ngFor=\"let item of filteredItems | async\"\r\n [ngClass]=\"{ active: item.value === selectedItem.value }\"\r\n (click)=\"onItemSelect(item, true)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n <div class=\"label-error overflow-hidden\">\r\n <span\r\n *ngIf=\"\r\n inputFormControl.touched &&\r\n inputFormControl.errors?.['required']\"\r\n >\u0627\u06CC\u0646 \u0641\u06CC\u0644\u062F \u062E\u0627\u0644\u06CC \u0627\u0633\u062A</span\r\n >\r\n </div>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .disable-selector{background-color:#f7f7f7!important;border:1px dashed #ced4da!important;cursor:no-drop!important}.dropdown .highlight-background{background-color:#dcf6ff!important}.dropdown .select{background:#fff;color:#304050;display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border:1px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:hover{background:#fbfbfb}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:#fff;top:-8px;padding-inline:6px;font-size:11px;color:#888}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:#888;padding-inline:16px}.dropdown .select-clicked{border:1px solid rgba(19,92,175,.397)}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6}.dropdown .menu .active{background:#ced4da}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:red;font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid #fe5f5f!important}\n"] }]
|
|
98
|
+
args: [{ selector: 'core-select-search', template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut($event)\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n 'highlight-background':\r\n canHighlightBackground &&\r\n (selectedItem | json) === ({} | json) &&\r\n !(inputFormControl.touched && inputFormControl.errors),\r\n selectError: inputFormControl.touched && inputFormControl.errors ,\r\n 'disable-selector': disabled,\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span\r\n class=\"placeholder-top\"\r\n *ngIf=\"(selectedItem | json) != ({} | json)\"\r\n >{{ label }}</span\r\n >\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n [ngClass]=\"[\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? 'placeholder'\r\n : 'selected'\r\n ]\"\r\n >{{\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? label\r\n : selectedItem.title\r\n }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <div\r\n class=\"grid grid-cols-12 h-11 items-center pe-5 ps-5 bg-white shadow-md\"\r\n >\r\n <input\r\n placeholder=\"\u062C\u0633\u062A\u062C\u0648 \"\r\n class=\"col-span-11 bg-transparent focus:outline-none min-h-9\"\r\n [(ngModel)]=\"searchText\"\r\n (keyup)=\"changeSearchText()\"\r\n />\r\n <span class=\"md:h-7 flex justify-center\">\r\n <search-icon\r\n class=\"transform scale-x-[-1] fill-icon-color hover:fill-primary-color hover:cursor-pointer\"\r\n >\r\n </search-icon\r\n ></span>\r\n </div>\r\n <li\r\n *ngFor=\"let item of filteredItems | async\"\r\n [ngClass]=\"{ active: item.value === selectedItem.value }\"\r\n (click)=\"onItemSelect(item, true)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n <div class=\"label-error overflow-hidden\">\r\n <span\r\n *ngIf=\"\r\n inputFormControl.touched &&\r\n inputFormControl.errors?.['required']\"\r\n >\u0627\u06CC\u0646 \u0641\u06CC\u0644\u062F \u062E\u0627\u0644\u06CC \u0627\u0633\u062A</span\r\n >\r\n </div>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .disable-selector{background-color:#f7f7f7!important;border:1px dashed #ced4da!important;cursor:no-drop!important}.dropdown .highlight-background{background-color:#dcf6ff!important}.dropdown .select{background:#fff;color:#304050;display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border:1px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:hover{background:#fbfbfb}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:#fff;top:-8px;padding-inline:6px;font-size:11px;color:#888}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:#888;padding-inline:16px}.dropdown .select-clicked{border:1px solid rgba(19,92,175,.397)}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6;box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.dropdown .menu .active{background:#ced4da!important}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:red;font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid #fe5f5f!important}\n"] }]
|
|
99
99
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { titleKey: [{
|
|
100
100
|
type: Input
|
|
101
101
|
}], valueKey: [{
|
|
@@ -79,11 +79,11 @@ export class CoreColumnSelectorComponent {
|
|
|
79
79
|
this.onItemSelected.emit('');
|
|
80
80
|
}
|
|
81
81
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreColumnSelectorComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
82
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreColumnSelectorComponent, selector: "core-column-selector", inputs: { items: "items", titleKey: "titleKey", valueKey: "valueKey", label: "label", inputFormControl: "inputFormControl" }, outputs: { onItemSelected: "onItemSelected" }, ngImport: i0, template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut()\">\r\n <close-icon\r\n *ngIf=\"selectedItem.title\"\r\n (click)=\"removedText()\"\r\n class=\"absolute w-4 top-2 right-2 fill-gray-600\"\r\n ></close-icon>\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n selectError: inputFormControl.touched && inputFormControl.errors\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span\r\n class=\"placeholder-top\"\r\n *ngIf=\"(selectedItem | json) != ({} | json)\"\r\n >{{ label }}</span\r\n >\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n [ngClass]=\"[\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? 'placeholder'\r\n : 'selected'\r\n ]\"\r\n >{{\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? label\r\n : selectedItem.title\r\n }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <li\r\n *ngFor=\"let item of newItems\"\r\n [ngClass]=\"{ active: item == selectedItem }\"\r\n (click)=\"onItemSelect(item, true)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:calc(100% - 34px);min-width:120px}.dropdown .select{color:var(--default-selector-text-color);display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border-bottom:1px solid var(--default-table-column-input-border-color);padding-block:3px;padding-inline-start:12px;outline:0;padding-inline-end:2px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:focus{border-bottom:1px solid #96bdf2}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:var(--default-selector-label-background-color);top:-8px;padding-inline:6px;font-size:11px;color:var(--default-selector-label-text--color)}.dropdown .select .caret{fill:var(--default-selector-icon-color);color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:var(--default-selector-placeholder-text-color);padding-inline:16px}.dropdown .select-clicked{border-bottom:1px solid #96bdf2}.dropdown .menu{list-style:none;padding-inline:0px;background:var(--default-selector-menu-background-color);border:1px solid var(--default-selector-menu-border-color);box-shadow:0 .5em 1em #0003;border-radius:.5em;color:var(--default-selector-menu-text-color);position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:var(--default-selector-menu-item-hover-color)}.dropdown .menu .active{background:var(--default-selector-menu-item-active-color)}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:var(--default-selector-validation-text-color);font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid var(--default-selector-validation-border-color)!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.CloseIconComponent, selector: "close-icon" }, { kind: "component", type: i3.ArrowDownIconComponent, selector: "arrow-down-icon" }, { kind: "pipe", type: i1.JsonPipe, name: "json" }] }); }
|
|
82
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreColumnSelectorComponent, selector: "core-column-selector", inputs: { items: "items", titleKey: "titleKey", valueKey: "valueKey", label: "label", inputFormControl: "inputFormControl" }, outputs: { onItemSelected: "onItemSelected" }, ngImport: i0, template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut()\">\r\n <close-icon\r\n *ngIf=\"selectedItem.title\"\r\n (click)=\"removedText()\"\r\n class=\"absolute w-4 top-2 right-2 fill-gray-600\"\r\n ></close-icon>\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n selectError: inputFormControl.touched && inputFormControl.errors\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span\r\n class=\"placeholder-top\"\r\n *ngIf=\"(selectedItem | json) != ({} | json)\"\r\n >{{ label }}</span\r\n >\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n [ngClass]=\"[\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? 'placeholder'\r\n : 'selected'\r\n ]\"\r\n >{{\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? label\r\n : selectedItem.title\r\n }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <li\r\n *ngFor=\"let item of newItems\"\r\n [ngClass]=\"{ active: item == selectedItem }\"\r\n (click)=\"onItemSelect(item, true)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:calc(100% - 34px);min-width:120px}.dropdown .select{color:var(--default-selector-text-color);display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border-bottom:1px solid var(--default-table-column-input-border-color);padding-block:3px;padding-inline-start:12px;outline:0;padding-inline-end:2px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:focus{border-bottom:1px solid #96bdf2}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:var(--default-selector-label-background-color);top:-8px;padding-inline:6px;font-size:11px;color:var(--default-selector-label-text--color)}.dropdown .select .caret{fill:var(--default-selector-icon-color);color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:var(--default-selector-placeholder-text-color);padding-inline:16px}.dropdown .select-clicked{border-bottom:1px solid #96bdf2}.dropdown .menu{list-style:none;padding-inline:0px;background:var(--default-selector-menu-background-color);border:1px solid var(--default-selector-menu-border-color);box-shadow:0 .5em 1em #0003;border-radius:.5em;color:var(--default-selector-menu-text-color);position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:var(--default-selector-menu-item-hover-color);box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.dropdown .menu .active{background:var(--default-selector-menu-item-active-color)!important}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:var(--default-selector-validation-text-color);font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid var(--default-selector-validation-border-color)!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.CloseIconComponent, selector: "close-icon" }, { kind: "component", type: i3.ArrowDownIconComponent, selector: "arrow-down-icon" }, { kind: "pipe", type: i1.JsonPipe, name: "json" }] }); }
|
|
83
83
|
}
|
|
84
84
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreColumnSelectorComponent, decorators: [{
|
|
85
85
|
type: Component,
|
|
86
|
-
args: [{ selector: 'core-column-selector', template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut()\">\r\n <close-icon\r\n *ngIf=\"selectedItem.title\"\r\n (click)=\"removedText()\"\r\n class=\"absolute w-4 top-2 right-2 fill-gray-600\"\r\n ></close-icon>\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n selectError: inputFormControl.touched && inputFormControl.errors\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span\r\n class=\"placeholder-top\"\r\n *ngIf=\"(selectedItem | json) != ({} | json)\"\r\n >{{ label }}</span\r\n >\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n [ngClass]=\"[\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? 'placeholder'\r\n : 'selected'\r\n ]\"\r\n >{{\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? label\r\n : selectedItem.title\r\n }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <li\r\n *ngFor=\"let item of newItems\"\r\n [ngClass]=\"{ active: item == selectedItem }\"\r\n (click)=\"onItemSelect(item, true)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:calc(100% - 34px);min-width:120px}.dropdown .select{color:var(--default-selector-text-color);display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border-bottom:1px solid var(--default-table-column-input-border-color);padding-block:3px;padding-inline-start:12px;outline:0;padding-inline-end:2px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:focus{border-bottom:1px solid #96bdf2}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:var(--default-selector-label-background-color);top:-8px;padding-inline:6px;font-size:11px;color:var(--default-selector-label-text--color)}.dropdown .select .caret{fill:var(--default-selector-icon-color);color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:var(--default-selector-placeholder-text-color);padding-inline:16px}.dropdown .select-clicked{border-bottom:1px solid #96bdf2}.dropdown .menu{list-style:none;padding-inline:0px;background:var(--default-selector-menu-background-color);border:1px solid var(--default-selector-menu-border-color);box-shadow:0 .5em 1em #0003;border-radius:.5em;color:var(--default-selector-menu-text-color);position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:var(--default-selector-menu-item-hover-color)}.dropdown .menu .active{background:var(--default-selector-menu-item-active-color)}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:var(--default-selector-validation-text-color);font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid var(--default-selector-validation-border-color)!important}\n"] }]
|
|
86
|
+
args: [{ selector: 'core-column-selector', template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut()\">\r\n <close-icon\r\n *ngIf=\"selectedItem.title\"\r\n (click)=\"removedText()\"\r\n class=\"absolute w-4 top-2 right-2 fill-gray-600\"\r\n ></close-icon>\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n selectError: inputFormControl.touched && inputFormControl.errors\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span\r\n class=\"placeholder-top\"\r\n *ngIf=\"(selectedItem | json) != ({} | json)\"\r\n >{{ label }}</span\r\n >\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n [ngClass]=\"[\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? 'placeholder'\r\n : 'selected'\r\n ]\"\r\n >{{\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? label\r\n : selectedItem.title\r\n }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <li\r\n *ngFor=\"let item of newItems\"\r\n [ngClass]=\"{ active: item == selectedItem }\"\r\n (click)=\"onItemSelect(item, true)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:calc(100% - 34px);min-width:120px}.dropdown .select{color:var(--default-selector-text-color);display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border-bottom:1px solid var(--default-table-column-input-border-color);padding-block:3px;padding-inline-start:12px;outline:0;padding-inline-end:2px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:focus{border-bottom:1px solid #96bdf2}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:var(--default-selector-label-background-color);top:-8px;padding-inline:6px;font-size:11px;color:var(--default-selector-label-text--color)}.dropdown .select .caret{fill:var(--default-selector-icon-color);color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:var(--default-selector-placeholder-text-color);padding-inline:16px}.dropdown .select-clicked{border-bottom:1px solid #96bdf2}.dropdown .menu{list-style:none;padding-inline:0px;background:var(--default-selector-menu-background-color);border:1px solid var(--default-selector-menu-border-color);box-shadow:0 .5em 1em #0003;border-radius:.5em;color:var(--default-selector-menu-text-color);position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:var(--default-selector-menu-item-hover-color);box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.dropdown .menu .active{background:var(--default-selector-menu-item-active-color)!important}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:var(--default-selector-validation-text-color);font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid var(--default-selector-validation-border-color)!important}\n"] }]
|
|
87
87
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { items: [{
|
|
88
88
|
type: Input
|
|
89
89
|
}], titleKey: [{
|
package/fesm2022/nira-falcon.mjs
CHANGED
|
@@ -221,11 +221,11 @@ class CoreAutoCompleteComponent {
|
|
|
221
221
|
this.filterItems = this.items.filter((item) => !item.title.indexOf(value));
|
|
222
222
|
}
|
|
223
223
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreAutoCompleteComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
224
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreAutoCompleteComponent, selector: "core-auto-complete", inputs: { label: "label", titleKey: "titleKey", valueKey: "valueKey", items: "items", defaultValue: "defaultValue" }, outputs: { onChange: "onChange" }, ngImport: i0, template: "<div class=\"dropdown\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{ 'select-clicked': isOpenMenu }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <input\r\n class=\"selected\"\r\n [placeholder]=\"label\"\r\n [(ngModel)]=\"value\"\r\n (ngModelChange)=\"onChanged($event)\"\r\n (focusout)=\"focusOut()\"\r\n />\r\n <span\r\n class=\"material-symbols-outlined caret\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n >\r\n expand_more\r\n </span>\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <li\r\n *ngFor=\"let item of _items\"\r\n [ngClass]=\"{ active: item == selectedItem }\"\r\n (click)=\"onItemSelect(item)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .select{background:#fff;color:#304050;display:flex;flex-direction:row-reverse;justify-content:space-between;align-items:center;border:2px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:13px;-webkit-user-select:none;user-select:none}.dropdown .select:hover,.dropdown .select:hover .selected{background:#fbfbfb}.dropdown .select .selected{width:100%;font-size:13px;outline:none;border:none;-webkit-user-select:none;user-select:none}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select-clicked{border:2px #4f6883 solid;box-shadow:0 0 .8em #888}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:42px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:3}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6}.dropdown .menu .active{background:#ced4da}.dropdown .menu-open{display:block;opacity:1}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
224
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreAutoCompleteComponent, selector: "core-auto-complete", inputs: { label: "label", titleKey: "titleKey", valueKey: "valueKey", items: "items", defaultValue: "defaultValue" }, outputs: { onChange: "onChange" }, ngImport: i0, template: "<div class=\"dropdown\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{ 'select-clicked': isOpenMenu }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <input\r\n class=\"selected\"\r\n [placeholder]=\"label\"\r\n [(ngModel)]=\"value\"\r\n (ngModelChange)=\"onChanged($event)\"\r\n (focusout)=\"focusOut()\"\r\n />\r\n <span\r\n class=\"material-symbols-outlined caret\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n >\r\n expand_more\r\n </span>\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <li\r\n *ngFor=\"let item of _items\"\r\n [ngClass]=\"{ active: item == selectedItem }\"\r\n (click)=\"onItemSelect(item)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .select{background:#fff;color:#304050;display:flex;flex-direction:row-reverse;justify-content:space-between;align-items:center;border:2px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:13px;-webkit-user-select:none;user-select:none}.dropdown .select:hover,.dropdown .select:hover .selected{background:#fbfbfb}.dropdown .select .selected{width:100%;font-size:13px;outline:none;border:none;-webkit-user-select:none;user-select:none}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select-clicked{border:2px #4f6883 solid;box-shadow:0 0 .8em #888}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:42px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:3}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6;box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.dropdown .menu .active{background:#ced4da!important}.dropdown .menu-open{display:block;opacity:1}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
225
225
|
}
|
|
226
226
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreAutoCompleteComponent, decorators: [{
|
|
227
227
|
type: Component,
|
|
228
|
-
args: [{ selector: 'core-auto-complete', template: "<div class=\"dropdown\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{ 'select-clicked': isOpenMenu }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <input\r\n class=\"selected\"\r\n [placeholder]=\"label\"\r\n [(ngModel)]=\"value\"\r\n (ngModelChange)=\"onChanged($event)\"\r\n (focusout)=\"focusOut()\"\r\n />\r\n <span\r\n class=\"material-symbols-outlined caret\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n >\r\n expand_more\r\n </span>\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <li\r\n *ngFor=\"let item of _items\"\r\n [ngClass]=\"{ active: item == selectedItem }\"\r\n (click)=\"onItemSelect(item)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .select{background:#fff;color:#304050;display:flex;flex-direction:row-reverse;justify-content:space-between;align-items:center;border:2px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:13px;-webkit-user-select:none;user-select:none}.dropdown .select:hover,.dropdown .select:hover .selected{background:#fbfbfb}.dropdown .select .selected{width:100%;font-size:13px;outline:none;border:none;-webkit-user-select:none;user-select:none}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select-clicked{border:2px #4f6883 solid;box-shadow:0 0 .8em #888}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:42px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:3}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6}.dropdown .menu .active{background:#ced4da}.dropdown .menu-open{display:block;opacity:1}\n"] }]
|
|
228
|
+
args: [{ selector: 'core-auto-complete', template: "<div class=\"dropdown\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{ 'select-clicked': isOpenMenu }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <input\r\n class=\"selected\"\r\n [placeholder]=\"label\"\r\n [(ngModel)]=\"value\"\r\n (ngModelChange)=\"onChanged($event)\"\r\n (focusout)=\"focusOut()\"\r\n />\r\n <span\r\n class=\"material-symbols-outlined caret\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n >\r\n expand_more\r\n </span>\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <li\r\n *ngFor=\"let item of _items\"\r\n [ngClass]=\"{ active: item == selectedItem }\"\r\n (click)=\"onItemSelect(item)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .select{background:#fff;color:#304050;display:flex;flex-direction:row-reverse;justify-content:space-between;align-items:center;border:2px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:13px;-webkit-user-select:none;user-select:none}.dropdown .select:hover,.dropdown .select:hover .selected{background:#fbfbfb}.dropdown .select .selected{width:100%;font-size:13px;outline:none;border:none;-webkit-user-select:none;user-select:none}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select-clicked{border:2px #4f6883 solid;box-shadow:0 0 .8em #888}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:42px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:3}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6;box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.dropdown .menu .active{background:#ced4da!important}.dropdown .menu-open{display:block;opacity:1}\n"] }]
|
|
229
229
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { label: [{
|
|
230
230
|
type: Input
|
|
231
231
|
}], titleKey: [{
|
|
@@ -1400,11 +1400,11 @@ class CoreColumnSelectorComponent {
|
|
|
1400
1400
|
this.onItemSelected.emit('');
|
|
1401
1401
|
}
|
|
1402
1402
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreColumnSelectorComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1403
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreColumnSelectorComponent, selector: "core-column-selector", inputs: { items: "items", titleKey: "titleKey", valueKey: "valueKey", label: "label", inputFormControl: "inputFormControl" }, outputs: { onItemSelected: "onItemSelected" }, ngImport: i0, template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut()\">\r\n <close-icon\r\n *ngIf=\"selectedItem.title\"\r\n (click)=\"removedText()\"\r\n class=\"absolute w-4 top-2 right-2 fill-gray-600\"\r\n ></close-icon>\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n selectError: inputFormControl.touched && inputFormControl.errors\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span\r\n class=\"placeholder-top\"\r\n *ngIf=\"(selectedItem | json) != ({} | json)\"\r\n >{{ label }}</span\r\n >\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n [ngClass]=\"[\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? 'placeholder'\r\n : 'selected'\r\n ]\"\r\n >{{\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? label\r\n : selectedItem.title\r\n }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <li\r\n *ngFor=\"let item of newItems\"\r\n [ngClass]=\"{ active: item == selectedItem }\"\r\n (click)=\"onItemSelect(item, true)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:calc(100% - 34px);min-width:120px}.dropdown .select{color:var(--default-selector-text-color);display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border-bottom:1px solid var(--default-table-column-input-border-color);padding-block:3px;padding-inline-start:12px;outline:0;padding-inline-end:2px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:focus{border-bottom:1px solid #96bdf2}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:var(--default-selector-label-background-color);top:-8px;padding-inline:6px;font-size:11px;color:var(--default-selector-label-text--color)}.dropdown .select .caret{fill:var(--default-selector-icon-color);color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:var(--default-selector-placeholder-text-color);padding-inline:16px}.dropdown .select-clicked{border-bottom:1px solid #96bdf2}.dropdown .menu{list-style:none;padding-inline:0px;background:var(--default-selector-menu-background-color);border:1px solid var(--default-selector-menu-border-color);box-shadow:0 .5em 1em #0003;border-radius:.5em;color:var(--default-selector-menu-text-color);position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:var(--default-selector-menu-item-hover-color)}.dropdown .menu .active{background:var(--default-selector-menu-item-active-color)}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:var(--default-selector-validation-text-color);font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid var(--default-selector-validation-border-color)!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CloseIconComponent, selector: "close-icon" }, { kind: "component", type: ArrowDownIconComponent, selector: "arrow-down-icon" }, { kind: "pipe", type: i1.JsonPipe, name: "json" }] }); }
|
|
1403
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreColumnSelectorComponent, selector: "core-column-selector", inputs: { items: "items", titleKey: "titleKey", valueKey: "valueKey", label: "label", inputFormControl: "inputFormControl" }, outputs: { onItemSelected: "onItemSelected" }, ngImport: i0, template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut()\">\r\n <close-icon\r\n *ngIf=\"selectedItem.title\"\r\n (click)=\"removedText()\"\r\n class=\"absolute w-4 top-2 right-2 fill-gray-600\"\r\n ></close-icon>\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n selectError: inputFormControl.touched && inputFormControl.errors\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span\r\n class=\"placeholder-top\"\r\n *ngIf=\"(selectedItem | json) != ({} | json)\"\r\n >{{ label }}</span\r\n >\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n [ngClass]=\"[\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? 'placeholder'\r\n : 'selected'\r\n ]\"\r\n >{{\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? label\r\n : selectedItem.title\r\n }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <li\r\n *ngFor=\"let item of newItems\"\r\n [ngClass]=\"{ active: item == selectedItem }\"\r\n (click)=\"onItemSelect(item, true)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:calc(100% - 34px);min-width:120px}.dropdown .select{color:var(--default-selector-text-color);display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border-bottom:1px solid var(--default-table-column-input-border-color);padding-block:3px;padding-inline-start:12px;outline:0;padding-inline-end:2px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:focus{border-bottom:1px solid #96bdf2}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:var(--default-selector-label-background-color);top:-8px;padding-inline:6px;font-size:11px;color:var(--default-selector-label-text--color)}.dropdown .select .caret{fill:var(--default-selector-icon-color);color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:var(--default-selector-placeholder-text-color);padding-inline:16px}.dropdown .select-clicked{border-bottom:1px solid #96bdf2}.dropdown .menu{list-style:none;padding-inline:0px;background:var(--default-selector-menu-background-color);border:1px solid var(--default-selector-menu-border-color);box-shadow:0 .5em 1em #0003;border-radius:.5em;color:var(--default-selector-menu-text-color);position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:var(--default-selector-menu-item-hover-color);box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.dropdown .menu .active{background:var(--default-selector-menu-item-active-color)!important}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:var(--default-selector-validation-text-color);font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid var(--default-selector-validation-border-color)!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CloseIconComponent, selector: "close-icon" }, { kind: "component", type: ArrowDownIconComponent, selector: "arrow-down-icon" }, { kind: "pipe", type: i1.JsonPipe, name: "json" }] }); }
|
|
1404
1404
|
}
|
|
1405
1405
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreColumnSelectorComponent, decorators: [{
|
|
1406
1406
|
type: Component,
|
|
1407
|
-
args: [{ selector: 'core-column-selector', template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut()\">\r\n <close-icon\r\n *ngIf=\"selectedItem.title\"\r\n (click)=\"removedText()\"\r\n class=\"absolute w-4 top-2 right-2 fill-gray-600\"\r\n ></close-icon>\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n selectError: inputFormControl.touched && inputFormControl.errors\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span\r\n class=\"placeholder-top\"\r\n *ngIf=\"(selectedItem | json) != ({} | json)\"\r\n >{{ label }}</span\r\n >\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n [ngClass]=\"[\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? 'placeholder'\r\n : 'selected'\r\n ]\"\r\n >{{\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? label\r\n : selectedItem.title\r\n }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <li\r\n *ngFor=\"let item of newItems\"\r\n [ngClass]=\"{ active: item == selectedItem }\"\r\n (click)=\"onItemSelect(item, true)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:calc(100% - 34px);min-width:120px}.dropdown .select{color:var(--default-selector-text-color);display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border-bottom:1px solid var(--default-table-column-input-border-color);padding-block:3px;padding-inline-start:12px;outline:0;padding-inline-end:2px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:focus{border-bottom:1px solid #96bdf2}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:var(--default-selector-label-background-color);top:-8px;padding-inline:6px;font-size:11px;color:var(--default-selector-label-text--color)}.dropdown .select .caret{fill:var(--default-selector-icon-color);color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:var(--default-selector-placeholder-text-color);padding-inline:16px}.dropdown .select-clicked{border-bottom:1px solid #96bdf2}.dropdown .menu{list-style:none;padding-inline:0px;background:var(--default-selector-menu-background-color);border:1px solid var(--default-selector-menu-border-color);box-shadow:0 .5em 1em #0003;border-radius:.5em;color:var(--default-selector-menu-text-color);position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:var(--default-selector-menu-item-hover-color)}.dropdown .menu .active{background:var(--default-selector-menu-item-active-color)}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:var(--default-selector-validation-text-color);font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid var(--default-selector-validation-border-color)!important}\n"] }]
|
|
1407
|
+
args: [{ selector: 'core-column-selector', template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut()\">\r\n <close-icon\r\n *ngIf=\"selectedItem.title\"\r\n (click)=\"removedText()\"\r\n class=\"absolute w-4 top-2 right-2 fill-gray-600\"\r\n ></close-icon>\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n selectError: inputFormControl.touched && inputFormControl.errors\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span\r\n class=\"placeholder-top\"\r\n *ngIf=\"(selectedItem | json) != ({} | json)\"\r\n >{{ label }}</span\r\n >\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n [ngClass]=\"[\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? 'placeholder'\r\n : 'selected'\r\n ]\"\r\n >{{\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? label\r\n : selectedItem.title\r\n }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <li\r\n *ngFor=\"let item of newItems\"\r\n [ngClass]=\"{ active: item == selectedItem }\"\r\n (click)=\"onItemSelect(item, true)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:calc(100% - 34px);min-width:120px}.dropdown .select{color:var(--default-selector-text-color);display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border-bottom:1px solid var(--default-table-column-input-border-color);padding-block:3px;padding-inline-start:12px;outline:0;padding-inline-end:2px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:focus{border-bottom:1px solid #96bdf2}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:var(--default-selector-label-background-color);top:-8px;padding-inline:6px;font-size:11px;color:var(--default-selector-label-text--color)}.dropdown .select .caret{fill:var(--default-selector-icon-color);color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:var(--default-selector-placeholder-text-color);padding-inline:16px}.dropdown .select-clicked{border-bottom:1px solid #96bdf2}.dropdown .menu{list-style:none;padding-inline:0px;background:var(--default-selector-menu-background-color);border:1px solid var(--default-selector-menu-border-color);box-shadow:0 .5em 1em #0003;border-radius:.5em;color:var(--default-selector-menu-text-color);position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:var(--default-selector-menu-item-hover-color);box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.dropdown .menu .active{background:var(--default-selector-menu-item-active-color)!important}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:var(--default-selector-validation-text-color);font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid var(--default-selector-validation-border-color)!important}\n"] }]
|
|
1408
1408
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { items: [{
|
|
1409
1409
|
type: Input
|
|
1410
1410
|
}], titleKey: [{
|
|
@@ -2930,11 +2930,11 @@ class CoreMultiSelectRowComponent {
|
|
|
2930
2930
|
this.onSelect.emit(true);
|
|
2931
2931
|
}
|
|
2932
2932
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreMultiSelectRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2933
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreMultiSelectRowComponent, selector: "app-core-multi-select-row", inputs: { isSelected: "isSelected", item: "item" }, outputs: { onSelect: "onSelect" }, ngImport: i0, template: "<li [ngClass]=\"{ active: _isSelected }\" (click)=\"onItemSelect()\">\r\n {{ item.title }}\r\n</li>\r\n", styles: ["li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}li:hover{background:#f6f6f6}.active{background:#ced4da}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
2933
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreMultiSelectRowComponent, selector: "app-core-multi-select-row", inputs: { isSelected: "isSelected", item: "item" }, outputs: { onSelect: "onSelect" }, ngImport: i0, template: "<li [ngClass]=\"{ active: _isSelected }\" (click)=\"onItemSelect()\">\r\n {{ item.title }}\r\n</li>\r\n", styles: ["li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}li:hover{background:#f6f6f6;box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.active{background:#ced4da!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
2934
2934
|
}
|
|
2935
2935
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreMultiSelectRowComponent, decorators: [{
|
|
2936
2936
|
type: Component,
|
|
2937
|
-
args: [{ selector: 'app-core-multi-select-row', template: "<li [ngClass]=\"{ active: _isSelected }\" (click)=\"onItemSelect()\">\r\n {{ item.title }}\r\n</li>\r\n", styles: ["li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}li:hover{background:#f6f6f6}.active{background:#ced4da}\n"] }]
|
|
2937
|
+
args: [{ selector: 'app-core-multi-select-row', template: "<li [ngClass]=\"{ active: _isSelected }\" (click)=\"onItemSelect()\">\r\n {{ item.title }}\r\n</li>\r\n", styles: ["li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}li:hover{background:#f6f6f6;box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.active{background:#ced4da!important}\n"] }]
|
|
2938
2938
|
}], propDecorators: { isSelected: [{
|
|
2939
2939
|
type: Input
|
|
2940
2940
|
}], item: [{
|
|
@@ -3063,11 +3063,11 @@ class CoreMultiSelectComponent {
|
|
|
3063
3063
|
this.inputFormControl.markAsTouched();
|
|
3064
3064
|
}
|
|
3065
3065
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreMultiSelectComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3066
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreMultiSelectComponent, selector: "core-multi-select", inputs: { titleKey: "titleKey", valueKey: "valueKey", items: "items", defaultValue: "defaultValue", label: "label", singleSelectItems: "singleSelectItems", inputFormControl: "inputFormControl" }, outputs: { onItemSelected: "onItemSelected" }, ngImport: i0, template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut()\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n selectError: inputFormControl.touched && inputFormControl.errors\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span class=\"placeholder-top\" *ngIf=\"isSelectedItems\">{{ label }}</span>\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n class=\"text-content text-right\"\r\n [ngClass]=\"[\r\n label.length > 0 && !isSelectedItems ? 'placeholder' : 'selected'\r\n ]\"\r\n >{{ label.length > 0 && !isSelectedItems ? label : text }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <app-core-multi-select-row\r\n *ngFor=\"let item of newItems\"\r\n [item]=\"item\"\r\n [isSelected]=\"selectedItems[item.value] ? true : false\"\r\n (onSelect)=\"onItemSelect(item, true)\"\r\n >\r\n </app-core-multi-select-row>\r\n </ul>\r\n <div class=\"label-error overflow-hidden\">\r\n <span\r\n *ngIf=\"\r\n inputFormControl.touched &&\r\n inputFormControl.errors?.['required']\"\r\n >\u0627\u06CC\u0646 \u0641\u06CC\u0644\u062F \u062E\u0627\u0644\u06CC \u0627\u0633\u062A</span\r\n >\r\n </div>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .select{background:#fff;color:#304050;display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border:1px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:hover{background:#fbfbfb}.dropdown .select .text-content{white-space:nowrap;display:block;width:263px;overflow:hidden;word-wrap:break-word;text-overflow:ellipsis}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:#fff;top:-8px;padding-inline:6px;font-size:11px;color:#888}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:#888;padding-inline:16px}.dropdown .select-clicked{border:1px solid rgba(19,92,175,.397)}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6}.dropdown .menu .active{background:#ced4da}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:red;font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid #fe5f5f!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CoreMultiSelectRowComponent, selector: "app-core-multi-select-row", inputs: ["isSelected", "item"], outputs: ["onSelect"] }, { kind: "component", type: ArrowDownIconComponent, selector: "arrow-down-icon" }] }); }
|
|
3066
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreMultiSelectComponent, selector: "core-multi-select", inputs: { titleKey: "titleKey", valueKey: "valueKey", items: "items", defaultValue: "defaultValue", label: "label", singleSelectItems: "singleSelectItems", inputFormControl: "inputFormControl" }, outputs: { onItemSelected: "onItemSelected" }, ngImport: i0, template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut()\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n selectError: inputFormControl.touched && inputFormControl.errors\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span class=\"placeholder-top\" *ngIf=\"isSelectedItems\">{{ label }}</span>\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n class=\"text-content text-right\"\r\n [ngClass]=\"[\r\n label.length > 0 && !isSelectedItems ? 'placeholder' : 'selected'\r\n ]\"\r\n >{{ label.length > 0 && !isSelectedItems ? label : text }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <app-core-multi-select-row\r\n *ngFor=\"let item of newItems\"\r\n [item]=\"item\"\r\n [isSelected]=\"selectedItems[item.value] ? true : false\"\r\n (onSelect)=\"onItemSelect(item, true)\"\r\n >\r\n </app-core-multi-select-row>\r\n </ul>\r\n <div class=\"label-error overflow-hidden\">\r\n <span\r\n *ngIf=\"\r\n inputFormControl.touched &&\r\n inputFormControl.errors?.['required']\"\r\n >\u0627\u06CC\u0646 \u0641\u06CC\u0644\u062F \u062E\u0627\u0644\u06CC \u0627\u0633\u062A</span\r\n >\r\n </div>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .select{background:#fff;color:#304050;display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border:1px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:hover{background:#fbfbfb}.dropdown .select .text-content{white-space:nowrap;display:block;width:263px;overflow:hidden;word-wrap:break-word;text-overflow:ellipsis}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:#fff;top:-8px;padding-inline:6px;font-size:11px;color:#888}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:#888;padding-inline:16px}.dropdown .select-clicked{border:1px solid rgba(19,92,175,.397)}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6;box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.dropdown .menu .active{background:#ced4da!important}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:red;font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid #fe5f5f!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CoreMultiSelectRowComponent, selector: "app-core-multi-select-row", inputs: ["isSelected", "item"], outputs: ["onSelect"] }, { kind: "component", type: ArrowDownIconComponent, selector: "arrow-down-icon" }] }); }
|
|
3067
3067
|
}
|
|
3068
3068
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreMultiSelectComponent, decorators: [{
|
|
3069
3069
|
type: Component,
|
|
3070
|
-
args: [{ selector: 'core-multi-select', template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut()\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n selectError: inputFormControl.touched && inputFormControl.errors\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span class=\"placeholder-top\" *ngIf=\"isSelectedItems\">{{ label }}</span>\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n class=\"text-content text-right\"\r\n [ngClass]=\"[\r\n label.length > 0 && !isSelectedItems ? 'placeholder' : 'selected'\r\n ]\"\r\n >{{ label.length > 0 && !isSelectedItems ? label : text }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <app-core-multi-select-row\r\n *ngFor=\"let item of newItems\"\r\n [item]=\"item\"\r\n [isSelected]=\"selectedItems[item.value] ? true : false\"\r\n (onSelect)=\"onItemSelect(item, true)\"\r\n >\r\n </app-core-multi-select-row>\r\n </ul>\r\n <div class=\"label-error overflow-hidden\">\r\n <span\r\n *ngIf=\"\r\n inputFormControl.touched &&\r\n inputFormControl.errors?.['required']\"\r\n >\u0627\u06CC\u0646 \u0641\u06CC\u0644\u062F \u062E\u0627\u0644\u06CC \u0627\u0633\u062A</span\r\n >\r\n </div>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .select{background:#fff;color:#304050;display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border:1px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:hover{background:#fbfbfb}.dropdown .select .text-content{white-space:nowrap;display:block;width:263px;overflow:hidden;word-wrap:break-word;text-overflow:ellipsis}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:#fff;top:-8px;padding-inline:6px;font-size:11px;color:#888}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:#888;padding-inline:16px}.dropdown .select-clicked{border:1px solid rgba(19,92,175,.397)}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6}.dropdown .menu .active{background:#ced4da}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:red;font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid #fe5f5f!important}\n"] }]
|
|
3070
|
+
args: [{ selector: 'core-multi-select', template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut()\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n selectError: inputFormControl.touched && inputFormControl.errors\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span class=\"placeholder-top\" *ngIf=\"isSelectedItems\">{{ label }}</span>\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n class=\"text-content text-right\"\r\n [ngClass]=\"[\r\n label.length > 0 && !isSelectedItems ? 'placeholder' : 'selected'\r\n ]\"\r\n >{{ label.length > 0 && !isSelectedItems ? label : text }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <app-core-multi-select-row\r\n *ngFor=\"let item of newItems\"\r\n [item]=\"item\"\r\n [isSelected]=\"selectedItems[item.value] ? true : false\"\r\n (onSelect)=\"onItemSelect(item, true)\"\r\n >\r\n </app-core-multi-select-row>\r\n </ul>\r\n <div class=\"label-error overflow-hidden\">\r\n <span\r\n *ngIf=\"\r\n inputFormControl.touched &&\r\n inputFormControl.errors?.['required']\"\r\n >\u0627\u06CC\u0646 \u0641\u06CC\u0644\u062F \u062E\u0627\u0644\u06CC \u0627\u0633\u062A</span\r\n >\r\n </div>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .select{background:#fff;color:#304050;display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border:1px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:hover{background:#fbfbfb}.dropdown .select .text-content{white-space:nowrap;display:block;width:263px;overflow:hidden;word-wrap:break-word;text-overflow:ellipsis}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:#fff;top:-8px;padding-inline:6px;font-size:11px;color:#888}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:#888;padding-inline:16px}.dropdown .select-clicked{border:1px solid rgba(19,92,175,.397)}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6;box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.dropdown .menu .active{background:#ced4da!important}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:red;font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid #fe5f5f!important}\n"] }]
|
|
3071
3071
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { titleKey: [{
|
|
3072
3072
|
type: Input
|
|
3073
3073
|
}], valueKey: [{
|
|
@@ -3172,11 +3172,11 @@ class CoreSelectSearchComponent {
|
|
|
3172
3172
|
this.changeSearchText();
|
|
3173
3173
|
}
|
|
3174
3174
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreSelectSearchComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3175
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreSelectSearchComponent, selector: "core-select-search", inputs: { titleKey: "titleKey", valueKey: "valueKey", size: "size", canHighlightBackground: "canHighlightBackground", items: "items", defaultValue: "defaultValue", label: "label", disabled: "disabled", inputFormControl: "inputFormControl" }, outputs: { onItemSelected: "onItemSelected" }, ngImport: i0, template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut($event)\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n 'highlight-background':\r\n canHighlightBackground &&\r\n (selectedItem | json) === ({} | json) &&\r\n !(inputFormControl.touched && inputFormControl.errors),\r\n selectError: inputFormControl.touched && inputFormControl.errors ,\r\n 'disable-selector': disabled,\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span\r\n class=\"placeholder-top\"\r\n *ngIf=\"(selectedItem | json) != ({} | json)\"\r\n >{{ label }}</span\r\n >\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n [ngClass]=\"[\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? 'placeholder'\r\n : 'selected'\r\n ]\"\r\n >{{\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? label\r\n : selectedItem.title\r\n }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <div\r\n class=\"grid grid-cols-12 h-11 items-center pe-5 ps-5 bg-white shadow-md\"\r\n >\r\n <input\r\n placeholder=\"\u062C\u0633\u062A\u062C\u0648 \"\r\n class=\"col-span-11 bg-transparent focus:outline-none min-h-9\"\r\n [(ngModel)]=\"searchText\"\r\n (keyup)=\"changeSearchText()\"\r\n />\r\n <span class=\"md:h-7 flex justify-center\">\r\n <search-icon\r\n class=\"transform scale-x-[-1] fill-icon-color hover:fill-primary-color hover:cursor-pointer\"\r\n >\r\n </search-icon\r\n ></span>\r\n </div>\r\n <li\r\n *ngFor=\"let item of filteredItems | async\"\r\n [ngClass]=\"{ active: item.value === selectedItem.value }\"\r\n (click)=\"onItemSelect(item, true)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n <div class=\"label-error overflow-hidden\">\r\n <span\r\n *ngIf=\"\r\n inputFormControl.touched &&\r\n inputFormControl.errors?.['required']\"\r\n >\u0627\u06CC\u0646 \u0641\u06CC\u0644\u062F \u062E\u0627\u0644\u06CC \u0627\u0633\u062A</span\r\n >\r\n </div>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .disable-selector{background-color:#f7f7f7!important;border:1px dashed #ced4da!important;cursor:no-drop!important}.dropdown .highlight-background{background-color:#dcf6ff!important}.dropdown .select{background:#fff;color:#304050;display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border:1px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:hover{background:#fbfbfb}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:#fff;top:-8px;padding-inline:6px;font-size:11px;color:#888}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:#888;padding-inline:16px}.dropdown .select-clicked{border:1px solid rgba(19,92,175,.397)}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6}.dropdown .menu .active{background:#ced4da}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:red;font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid #fe5f5f!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: SearchIconComponent, selector: "search-icon" }, { kind: "component", type: ArrowDownIconComponent, selector: "arrow-down-icon" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.JsonPipe, name: "json" }] }); }
|
|
3175
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CoreSelectSearchComponent, selector: "core-select-search", inputs: { titleKey: "titleKey", valueKey: "valueKey", size: "size", canHighlightBackground: "canHighlightBackground", items: "items", defaultValue: "defaultValue", label: "label", disabled: "disabled", inputFormControl: "inputFormControl" }, outputs: { onItemSelected: "onItemSelected" }, ngImport: i0, template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut($event)\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n 'highlight-background':\r\n canHighlightBackground &&\r\n (selectedItem | json) === ({} | json) &&\r\n !(inputFormControl.touched && inputFormControl.errors),\r\n selectError: inputFormControl.touched && inputFormControl.errors ,\r\n 'disable-selector': disabled,\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span\r\n class=\"placeholder-top\"\r\n *ngIf=\"(selectedItem | json) != ({} | json)\"\r\n >{{ label }}</span\r\n >\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n [ngClass]=\"[\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? 'placeholder'\r\n : 'selected'\r\n ]\"\r\n >{{\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? label\r\n : selectedItem.title\r\n }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <div\r\n class=\"grid grid-cols-12 h-11 items-center pe-5 ps-5 bg-white shadow-md\"\r\n >\r\n <input\r\n placeholder=\"\u062C\u0633\u062A\u062C\u0648 \"\r\n class=\"col-span-11 bg-transparent focus:outline-none min-h-9\"\r\n [(ngModel)]=\"searchText\"\r\n (keyup)=\"changeSearchText()\"\r\n />\r\n <span class=\"md:h-7 flex justify-center\">\r\n <search-icon\r\n class=\"transform scale-x-[-1] fill-icon-color hover:fill-primary-color hover:cursor-pointer\"\r\n >\r\n </search-icon\r\n ></span>\r\n </div>\r\n <li\r\n *ngFor=\"let item of filteredItems | async\"\r\n [ngClass]=\"{ active: item.value === selectedItem.value }\"\r\n (click)=\"onItemSelect(item, true)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n <div class=\"label-error overflow-hidden\">\r\n <span\r\n *ngIf=\"\r\n inputFormControl.touched &&\r\n inputFormControl.errors?.['required']\"\r\n >\u0627\u06CC\u0646 \u0641\u06CC\u0644\u062F \u062E\u0627\u0644\u06CC \u0627\u0633\u062A</span\r\n >\r\n </div>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .disable-selector{background-color:#f7f7f7!important;border:1px dashed #ced4da!important;cursor:no-drop!important}.dropdown .highlight-background{background-color:#dcf6ff!important}.dropdown .select{background:#fff;color:#304050;display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border:1px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:hover{background:#fbfbfb}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:#fff;top:-8px;padding-inline:6px;font-size:11px;color:#888}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:#888;padding-inline:16px}.dropdown .select-clicked{border:1px solid rgba(19,92,175,.397)}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6;box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.dropdown .menu .active{background:#ced4da!important}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:red;font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid #fe5f5f!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: SearchIconComponent, selector: "search-icon" }, { kind: "component", type: ArrowDownIconComponent, selector: "arrow-down-icon" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.JsonPipe, name: "json" }] }); }
|
|
3176
3176
|
}
|
|
3177
3177
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CoreSelectSearchComponent, decorators: [{
|
|
3178
3178
|
type: Component,
|
|
3179
|
-
args: [{ selector: 'core-select-search', template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut($event)\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n 'highlight-background':\r\n canHighlightBackground &&\r\n (selectedItem | json) === ({} | json) &&\r\n !(inputFormControl.touched && inputFormControl.errors),\r\n selectError: inputFormControl.touched && inputFormControl.errors ,\r\n 'disable-selector': disabled,\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span\r\n class=\"placeholder-top\"\r\n *ngIf=\"(selectedItem | json) != ({} | json)\"\r\n >{{ label }}</span\r\n >\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n [ngClass]=\"[\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? 'placeholder'\r\n : 'selected'\r\n ]\"\r\n >{{\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? label\r\n : selectedItem.title\r\n }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <div\r\n class=\"grid grid-cols-12 h-11 items-center pe-5 ps-5 bg-white shadow-md\"\r\n >\r\n <input\r\n placeholder=\"\u062C\u0633\u062A\u062C\u0648 \"\r\n class=\"col-span-11 bg-transparent focus:outline-none min-h-9\"\r\n [(ngModel)]=\"searchText\"\r\n (keyup)=\"changeSearchText()\"\r\n />\r\n <span class=\"md:h-7 flex justify-center\">\r\n <search-icon\r\n class=\"transform scale-x-[-1] fill-icon-color hover:fill-primary-color hover:cursor-pointer\"\r\n >\r\n </search-icon\r\n ></span>\r\n </div>\r\n <li\r\n *ngFor=\"let item of filteredItems | async\"\r\n [ngClass]=\"{ active: item.value === selectedItem.value }\"\r\n (click)=\"onItemSelect(item, true)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n <div class=\"label-error overflow-hidden\">\r\n <span\r\n *ngIf=\"\r\n inputFormControl.touched &&\r\n inputFormControl.errors?.['required']\"\r\n >\u0627\u06CC\u0646 \u0641\u06CC\u0644\u062F \u062E\u0627\u0644\u06CC \u0627\u0633\u062A</span\r\n >\r\n </div>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .disable-selector{background-color:#f7f7f7!important;border:1px dashed #ced4da!important;cursor:no-drop!important}.dropdown .highlight-background{background-color:#dcf6ff!important}.dropdown .select{background:#fff;color:#304050;display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border:1px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:hover{background:#fbfbfb}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:#fff;top:-8px;padding-inline:6px;font-size:11px;color:#888}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:#888;padding-inline:16px}.dropdown .select-clicked{border:1px solid rgba(19,92,175,.397)}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6}.dropdown .menu .active{background:#ced4da}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:red;font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid #fe5f5f!important}\n"] }]
|
|
3179
|
+
args: [{ selector: 'core-select-search', template: "<div tabindex=\"-1\" class=\"dropdown\" (focusout)=\"focusOut($event)\">\r\n <div\r\n class=\"select\"\r\n [ngClass]=\"{\r\n 'select-clicked': isOpenMenu,\r\n 'highlight-background':\r\n canHighlightBackground &&\r\n (selectedItem | json) === ({} | json) &&\r\n !(inputFormControl.touched && inputFormControl.errors),\r\n selectError: inputFormControl.touched && inputFormControl.errors ,\r\n 'disable-selector': disabled,\r\n }\"\r\n (click)=\"openMenuClick()\"\r\n >\r\n <span\r\n class=\"placeholder-top\"\r\n *ngIf=\"(selectedItem | json) != ({} | json)\"\r\n >{{ label }}</span\r\n >\r\n <arrow-down-icon\r\n class=\"caret fill-secondary-text-color h-6\"\r\n [ngClass]=\"{ 'caret-rotate': isOpenMenu }\"\r\n ></arrow-down-icon>\r\n\r\n <span\r\n [ngClass]=\"[\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? 'placeholder'\r\n : 'selected'\r\n ]\"\r\n >{{\r\n label.length > 0 && (selectedItem | json) == ({} | json)\r\n ? label\r\n : selectedItem.title\r\n }}</span\r\n >\r\n </div>\r\n <ul class=\"menu\" [ngClass]=\"{ 'menu-open': isOpenMenu }\">\r\n <div\r\n class=\"grid grid-cols-12 h-11 items-center pe-5 ps-5 bg-white shadow-md\"\r\n >\r\n <input\r\n placeholder=\"\u062C\u0633\u062A\u062C\u0648 \"\r\n class=\"col-span-11 bg-transparent focus:outline-none min-h-9\"\r\n [(ngModel)]=\"searchText\"\r\n (keyup)=\"changeSearchText()\"\r\n />\r\n <span class=\"md:h-7 flex justify-center\">\r\n <search-icon\r\n class=\"transform scale-x-[-1] fill-icon-color hover:fill-primary-color hover:cursor-pointer\"\r\n >\r\n </search-icon\r\n ></span>\r\n </div>\r\n <li\r\n *ngFor=\"let item of filteredItems | async\"\r\n [ngClass]=\"{ active: item.value === selectedItem.value }\"\r\n (click)=\"onItemSelect(item, true)\"\r\n >\r\n {{ item.title }}\r\n </li>\r\n </ul>\r\n <div class=\"label-error overflow-hidden\">\r\n <span\r\n *ngIf=\"\r\n inputFormControl.touched &&\r\n inputFormControl.errors?.['required']\"\r\n >\u0627\u06CC\u0646 \u0641\u06CC\u0644\u062F \u062E\u0627\u0644\u06CC \u0627\u0633\u062A</span\r\n >\r\n </div>\r\n</div>\r\n", styles: [".dropdown{min-width:15em;position:relative;width:100%;min-width:120px}.dropdown .disable-selector{background-color:#f7f7f7!important;border:1px dashed #ced4da!important;cursor:no-drop!important}.dropdown .highlight-background{background-color:#dcf6ff!important}.dropdown .select{background:#fff;color:#304050;display:flex;justify-content:space-between;flex-direction:row-reverse;align-items:center;border:1px solid #ced4da;border-radius:4px;padding:8px;cursor:pointer;transition:background .3s;font-size:12px;-webkit-user-select:none;user-select:none}.dropdown .select:hover{background:#fbfbfb}.dropdown .select .selected{padding-inline:12px;font-size:14px;color:#000000b3;-webkit-user-select:none;user-select:none}.dropdown .select .placeholder-top{position:absolute;right:13px;background:#fff;top:-8px;padding-inline:6px;font-size:11px;color:#888}.dropdown .select .caret{color:#595c5f;-webkit-user-select:none;user-select:none}.dropdown .select .caret-rotate{transform:rotate(180deg)}.dropdown .select .placeholder{color:#888;padding-inline:16px}.dropdown .select-clicked{border:1px solid rgba(19,92,175,.397)}.dropdown .menu{list-style:none;padding-inline:0px;background:#fff;border:1px #e3e8f1 solid;box-shadow:0 .5em 1em #0003;border-radius:.5em;color:#595c5f;position:absolute;top:40px;left:50%;width:100%;transform:translate(-50%);opacity:0;display:none;transition:0,2s;z-index:10;max-height:200px;overflow:auto}.dropdown .menu li{padding:.7em .5em;margin:.3em 0;margin-inline:4px;border-radius:.5em;font-size:14px;text-align:start;cursor:pointer}.dropdown .menu li:hover{background:#f6f6f6;box-shadow:0 1px 2px #00000021,0 4px 4px #0000001a}.dropdown .menu .active{background:#ced4da!important}.dropdown .menu-open{display:block;opacity:1}.dropdown .label-error{color:red;font-size:13px;margin-block-start:4px;min-height:21px;width:100%;display:inline-block!important;text-align:start}.dropdown .selectError{border:1px solid #fe5f5f!important}\n"] }]
|
|
3180
3180
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { titleKey: [{
|
|
3181
3181
|
type: Input
|
|
3182
3182
|
}], valueKey: [{
|