ecabs-components 0.0.53 → 0.0.54
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/esm2020/lib/ecabs-dialog-confirm/ecabs-dialog-confirm.component.mjs +24 -6
- package/esm2020/lib/ecabs-dialog-confirm/ecabs-dialog-confirm.module.mjs +8 -8
- package/esm2020/lib/ecabs-dialog-message/ecabs-dialog-message.component.mjs +21 -3
- package/esm2020/lib/ecabs-language-selector/ecabs-language-selector.component.mjs +8 -3
- package/esm2020/lib/ecabs-language-selector/ecabs-language-selector.module.mjs +8 -4
- package/esm2020/lib/ecabs-select/ecabs-select.component.mjs +41 -129
- package/fesm2015/ecabs-components.mjs +102 -149
- package/fesm2015/ecabs-components.mjs.map +1 -1
- package/fesm2020/ecabs-components.mjs +100 -147
- package/fesm2020/ecabs-components.mjs.map +1 -1
- package/lib/ecabs-dialog-confirm/ecabs-dialog-confirm.component.d.ts +9 -4
- package/lib/ecabs-dialog-confirm/ecabs-dialog-confirm.module.d.ts +4 -4
- package/lib/ecabs-dialog-message/ecabs-dialog-message.component.d.ts +7 -1
- package/lib/ecabs-language-selector/ecabs-language-selector.component.d.ts +3 -1
- package/lib/ecabs-language-selector/ecabs-language-selector.module.d.ts +2 -1
- package/lib/ecabs-select/ecabs-select.component.d.ts +5 -17
- package/package.json +1 -1
|
@@ -15,7 +15,7 @@ import * as i3$1 from '@angular/material/form-field';
|
|
|
15
15
|
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
16
16
|
import * as i7 from 'ngx-mat-select-search';
|
|
17
17
|
import { MatSelectSearchComponent, NgxMatSelectSearchModule } from 'ngx-mat-select-search';
|
|
18
|
-
import {
|
|
18
|
+
import { ReplaySubject, Subscription, combineLatest, map, debounceTime, Subject, takeUntil } from 'rxjs';
|
|
19
19
|
import * as i4$1 from '@angular/material/select';
|
|
20
20
|
import { MatSelectModule, MAT_SELECT_SCROLL_STRATEGY } from '@angular/material/select';
|
|
21
21
|
import * as i2 from '@angular/material/core';
|
|
@@ -732,10 +732,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
732
732
|
}] });
|
|
733
733
|
|
|
734
734
|
class EcabsSelectComponent extends ElementBaseComponent {
|
|
735
|
-
constructor(injector
|
|
735
|
+
constructor(injector) {
|
|
736
736
|
super();
|
|
737
737
|
this.injector = injector;
|
|
738
|
-
this.changeDetectorRef = changeDetectorRef;
|
|
739
738
|
this.multiple = false;
|
|
740
739
|
this.useNoneOption = false;
|
|
741
740
|
this.useOnlyDisabledClass = false;
|
|
@@ -751,12 +750,9 @@ class EcabsSelectComponent extends ElementBaseComponent {
|
|
|
751
750
|
this.othersLabel = 'Others';
|
|
752
751
|
this.updateFilterItems = new EventEmitter();
|
|
753
752
|
this.selectionChange = new EventEmitter();
|
|
754
|
-
this.filteredItems$ = new
|
|
753
|
+
this.filteredItems$ = new ReplaySubject(1);
|
|
755
754
|
this.itemFilterCtrl = new UntypedFormControl();
|
|
756
755
|
this.isClearAll = false;
|
|
757
|
-
this.showFilteredAllOption = true;
|
|
758
|
-
this.selectedItems = [];
|
|
759
|
-
this.notSelectedItems = [];
|
|
760
756
|
this.subscriptions = new Subscription();
|
|
761
757
|
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
762
758
|
this.onChange = () => { };
|
|
@@ -769,21 +765,23 @@ class EcabsSelectComponent extends ElementBaseComponent {
|
|
|
769
765
|
set value(val) {
|
|
770
766
|
if (this.val !== val) {
|
|
771
767
|
this.val = val;
|
|
772
|
-
this.setSelectedItems();
|
|
773
768
|
this.onChange(val);
|
|
774
769
|
this.onTouch(val);
|
|
775
770
|
}
|
|
776
771
|
}
|
|
777
772
|
ngOnChanges(changes) {
|
|
778
773
|
var _a;
|
|
779
|
-
|
|
780
|
-
|
|
774
|
+
if (changes['items'] && changes['items'].currentValue) {
|
|
775
|
+
this.filteredItems$.next(changes['items'].currentValue.slice());
|
|
781
776
|
this.filterItems();
|
|
782
|
-
if (this.multiple &&
|
|
777
|
+
if (this.multiple &&
|
|
778
|
+
this.useSelectAllOption &&
|
|
779
|
+
((_a = this.allSelected) === null || _a === void 0 ? void 0 : _a.selected)) {
|
|
783
780
|
setTimeout(() => {
|
|
784
|
-
this.control.patchValue([
|
|
785
|
-
|
|
786
|
-
|
|
781
|
+
this.control.patchValue([
|
|
782
|
+
...this.items.map((item) => item.value),
|
|
783
|
+
this.selectAllValue,
|
|
784
|
+
]);
|
|
787
785
|
}, 100);
|
|
788
786
|
}
|
|
789
787
|
}
|
|
@@ -809,19 +807,17 @@ class EcabsSelectComponent extends ElementBaseComponent {
|
|
|
809
807
|
this.filterItems();
|
|
810
808
|
this.updateFilterItems.emit(value);
|
|
811
809
|
if (this.isClearAll) {
|
|
812
|
-
this.control.patchValue([]
|
|
810
|
+
this.control.patchValue([]);
|
|
813
811
|
this.isClearAll = false;
|
|
814
812
|
}
|
|
815
813
|
}));
|
|
816
814
|
}
|
|
817
815
|
toggleAllSelection() {
|
|
818
816
|
if (this.allSelected.selected) {
|
|
819
|
-
|
|
820
|
-
|
|
821
|
-
|
|
822
|
-
|
|
823
|
-
this.control.patchValue([...this.items.map((item) => item.value), this.selectAllValue]);
|
|
824
|
-
}
|
|
817
|
+
this.control.patchValue([
|
|
818
|
+
...this.items.map((item) => item.value),
|
|
819
|
+
this.selectAllValue,
|
|
820
|
+
]);
|
|
825
821
|
}
|
|
826
822
|
else {
|
|
827
823
|
this.control.patchValue([]);
|
|
@@ -829,45 +825,31 @@ class EcabsSelectComponent extends ElementBaseComponent {
|
|
|
829
825
|
}
|
|
830
826
|
}
|
|
831
827
|
togglePerOne() {
|
|
832
|
-
|
|
833
|
-
|
|
834
|
-
|
|
835
|
-
if (this.allSelected.selected) {
|
|
836
|
-
this.allSelected.deselect();
|
|
837
|
-
}
|
|
838
|
-
if (this.setAllOptionAfterChosenAllItems && this.control.value.length === this.items.length) {
|
|
839
|
-
this.allSelected.select();
|
|
840
|
-
}
|
|
828
|
+
if (this.allSelected) {
|
|
829
|
+
if (this.allSelected.selected) {
|
|
830
|
+
this.allSelected.deselect();
|
|
841
831
|
}
|
|
842
|
-
this.
|
|
843
|
-
|
|
832
|
+
if (this.setAllOptionAfterChosenAllItems &&
|
|
833
|
+
this.control.value.length === this.items.length) {
|
|
834
|
+
this.allSelected.select();
|
|
835
|
+
}
|
|
836
|
+
}
|
|
844
837
|
this.isClearAll = false;
|
|
845
838
|
}
|
|
846
|
-
toggleNone() {
|
|
847
|
-
this.selectedItems = [];
|
|
848
|
-
}
|
|
849
839
|
getAllSelectedChecked() {
|
|
850
840
|
return this.allSelected !== undefined && this.allSelected.selected;
|
|
851
841
|
}
|
|
852
842
|
getLabel(val) {
|
|
853
843
|
var _a;
|
|
854
|
-
if (this.useSelectAllOption &&
|
|
844
|
+
if (this.useSelectAllOption &&
|
|
845
|
+
((_a = this.allSelected) === null || _a === void 0 ? void 0 : _a.selected) &&
|
|
846
|
+
this.items &&
|
|
847
|
+
this.items.length > 0) {
|
|
855
848
|
return this.items[0].label;
|
|
856
849
|
}
|
|
857
|
-
|
|
858
|
-
|
|
859
|
-
|
|
860
|
-
if (this.selectedItems && this.selectedItems.length > 0) {
|
|
861
|
-
// eslint-disable-next-line @typescript-eslint/no-shadow
|
|
862
|
-
item = this.selectedItems.find((item) => item.value === val);
|
|
863
|
-
}
|
|
864
|
-
}
|
|
865
|
-
else {
|
|
866
|
-
if (this.items && this.items.length > 0) {
|
|
867
|
-
// eslint-disable-next-line @typescript-eslint/no-shadow
|
|
868
|
-
item = this.items.find((item) => item.value === val);
|
|
869
|
-
}
|
|
870
|
-
}
|
|
850
|
+
if (val !== undefined && this.items && this.items.length > 0) {
|
|
851
|
+
// eslint-disable-next-line @typescript-eslint/no-shadow
|
|
852
|
+
const item = this.items.find((item) => item.value === val);
|
|
871
853
|
return item ? item.label : '';
|
|
872
854
|
}
|
|
873
855
|
return '';
|
|
@@ -888,101 +870,29 @@ class EcabsSelectComponent extends ElementBaseComponent {
|
|
|
888
870
|
this.selectionChange.emit($event);
|
|
889
871
|
}
|
|
890
872
|
filterItems() {
|
|
891
|
-
var _a, _b, _c;
|
|
892
|
-
this.setSelectedItems();
|
|
893
873
|
if (!this.items) {
|
|
894
874
|
return;
|
|
895
875
|
}
|
|
896
876
|
// get the search keyword
|
|
897
877
|
let search = this.itemFilterCtrl.value;
|
|
898
878
|
if (!search || search === '') {
|
|
899
|
-
|
|
900
|
-
this.filteredItems$.next([...this.selectedItems]);
|
|
901
|
-
}
|
|
902
|
-
else {
|
|
903
|
-
this.filteredItems$.next((_a = this.items) === null || _a === void 0 ? void 0 : _a.slice());
|
|
904
|
-
}
|
|
905
|
-
this.showFilteredAllOption = true;
|
|
879
|
+
this.filteredItems$.next(this.items.slice());
|
|
906
880
|
return;
|
|
907
881
|
}
|
|
908
882
|
search = search.toLowerCase();
|
|
909
|
-
this.
|
|
910
|
-
this.
|
|
911
|
-
|
|
912
|
-
(!(this.value instanceof Array) && this.value === this.selectAllValue);
|
|
913
|
-
this.changeDetectorRef.detectChanges();
|
|
914
|
-
if (this.useSearchOption) {
|
|
915
|
-
const filteredItems = ((_b = this.notSelectedItems) === null || _b === void 0 ? void 0 : _b.length) > 0
|
|
916
|
-
? this.notSelectedItems.filter((item) => item.label.toLowerCase().includes(search.toLowerCase()))
|
|
917
|
-
: [];
|
|
918
|
-
this.filteredItems$.next([...this.selectedItems, ...filteredItems]);
|
|
919
|
-
}
|
|
920
|
-
else {
|
|
921
|
-
this.filteredItems$.next(((_c = this.items) === null || _c === void 0 ? void 0 : _c.length) > 0
|
|
922
|
-
? this.items.filter((item) => item.label.toLowerCase().includes(search.toLowerCase()))
|
|
923
|
-
: []);
|
|
924
|
-
}
|
|
925
|
-
}
|
|
926
|
-
setSelectedItems() {
|
|
927
|
-
var _a, _b;
|
|
928
|
-
if (this.useSearchOption) {
|
|
929
|
-
const selectedItems = [];
|
|
930
|
-
if (this.value) {
|
|
931
|
-
if (this.value instanceof Array) {
|
|
932
|
-
const skipSteps = this.value.includes(this.selectAllValue);
|
|
933
|
-
if (!skipSteps) {
|
|
934
|
-
this.value.forEach((value) => {
|
|
935
|
-
const index = this.selectedItems.findIndex((selectedItem) => selectedItem.value === value);
|
|
936
|
-
if (index !== -1) {
|
|
937
|
-
selectedItems.push(this.selectedItems[index]);
|
|
938
|
-
}
|
|
939
|
-
else {
|
|
940
|
-
// eslint-disable-next-line @typescript-eslint/no-shadow
|
|
941
|
-
const item = this.items.find((item) => item.value === value);
|
|
942
|
-
if (item) {
|
|
943
|
-
selectedItems.push(item);
|
|
944
|
-
}
|
|
945
|
-
}
|
|
946
|
-
});
|
|
947
|
-
this.selectedItems.forEach((selectedItem) => {
|
|
948
|
-
const index = this.value.find((value) => selectedItem.value === value);
|
|
949
|
-
if (index === -1) {
|
|
950
|
-
selectedItems.splice(index, 1);
|
|
951
|
-
}
|
|
952
|
-
});
|
|
953
|
-
}
|
|
954
|
-
}
|
|
955
|
-
else {
|
|
956
|
-
const index = this.selectedItems.findIndex((selectedItem) => selectedItem.value === this.value);
|
|
957
|
-
if (index !== -1) {
|
|
958
|
-
selectedItems.push(this.selectedItems[index]);
|
|
959
|
-
}
|
|
960
|
-
else {
|
|
961
|
-
// eslint-disable-next-line @typescript-eslint/no-shadow
|
|
962
|
-
const item = this.items.find((item) => item.value === this.value);
|
|
963
|
-
// eslint-disable-next-line max-depth
|
|
964
|
-
if (item) {
|
|
965
|
-
selectedItems.push(item);
|
|
966
|
-
}
|
|
967
|
-
}
|
|
968
|
-
}
|
|
969
|
-
this.selectedItems = [...selectedItems];
|
|
970
|
-
this.notSelectedItems = (_a = this.items) === null || _a === void 0 ? void 0 : _a.filter((item) => this.selectedItems.findIndex((selectedItem) => selectedItem.value === item.value) === -1);
|
|
971
|
-
}
|
|
972
|
-
else {
|
|
973
|
-
this.notSelectedItems = (_b = this.items) === null || _b === void 0 ? void 0 : _b.slice();
|
|
974
|
-
}
|
|
975
|
-
}
|
|
883
|
+
this.filteredItems$.next(this.items && this.items.length > 0
|
|
884
|
+
? this.items.filter((item) => item.label.toLowerCase().includes(search.toLowerCase()))
|
|
885
|
+
: []);
|
|
976
886
|
}
|
|
977
887
|
}
|
|
978
|
-
EcabsSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EcabsSelectComponent, deps: [{ token: i0.Injector }
|
|
888
|
+
EcabsSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EcabsSelectComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
|
|
979
889
|
EcabsSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: EcabsSelectComponent, selector: "ecabs-select", inputs: { items: "items", multiple: "multiple", useNoneOption: "useNoneOption", useOnlyDisabledClass: "useOnlyDisabledClass", searchFieldPlaceholder: "searchFieldPlaceholder", useSearchOption: "useSearchOption", useSelectAllOption: "useSelectAllOption", setAllOptionAfterChosenAllItems: "setAllOptionAfterChosenAllItems", selectAllValue: "selectAllValue", noEntriesFoundLabel: "noEntriesFoundLabel", noneLabel: "noneLabel", allLabel: "allLabel", otherLabel: "otherLabel", othersLabel: "othersLabel" }, outputs: { updateFilterItems: "updateFilterItems", selectionChange: "selectionChange" }, providers: [
|
|
980
890
|
{
|
|
981
891
|
provide: NG_VALUE_ACCESSOR,
|
|
982
892
|
useExisting: EcabsSelectComponent,
|
|
983
893
|
multi: true,
|
|
984
894
|
},
|
|
985
|
-
], viewQueries: [{ propertyName: "allSelected", first: true, predicate: ["allSelected"], descendants: true }, { propertyName: "matSelectSearchComponent", first: true, predicate: MatSelectSearchComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<app-element-wrapper [data]=\"getData()\">\r\n <mat-form-field [ngClass]=\"{ disabled: useOnlyDisabledClass }\">\r\n <mat-select\r\n [(ngModel)]=\"value\"\r\n (closed)=\"onTouch()\"\r\n appearance=\"outline\"\r\n [multiple]=\"multiple\"\r\n [disabled]=\"disabled\"\r\n [placeholder]=\"placeholder\"\r\n (selectionChange)=\"onSelectionChanged($event)\"\r\n >\r\n <mat-select-trigger>\r\n <span *ngIf=\"getAllSelectedChecked()\">{{ allLabel }}</span>\r\n <span *ngIf=\"!getAllSelectedChecked()\"\r\n >{{ val && multiple ? getLabel(val[0]) : getLabel(val) }}\r\n <span *ngIf=\"multiple && value?.length > 1\" class=\"additional-selection\">\r\n (+{{ useSelectAllOption && this.allSelected?.selected ? value?.length - 2 : value?.length - 1 }}\r\n {{ (value?.length === 2 ? otherLabel : othersLabel) }})\r\n </span>\r\n </span>\r\n </mat-select-trigger>\r\n <mat-option *ngIf=\"useSearchOption\">\r\n <ngx-mat-select-search\r\n [formControl]=\"itemFilterCtrl\"\r\n [placeholderLabel]=\"searchFieldPlaceholder\"\r\n [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\r\n ></ngx-mat-select-search>\r\n </mat-option>\r\n <mat-option *ngIf=\"useNoneOption\"
|
|
895
|
+
], viewQueries: [{ propertyName: "allSelected", first: true, predicate: ["allSelected"], descendants: true }, { propertyName: "matSelectSearchComponent", first: true, predicate: MatSelectSearchComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<app-element-wrapper [data]=\"getData()\">\r\n <mat-form-field [ngClass]=\"{ disabled: useOnlyDisabledClass }\">\r\n <mat-select\r\n [(ngModel)]=\"value\"\r\n (closed)=\"onTouch()\"\r\n appearance=\"outline\"\r\n [multiple]=\"multiple\"\r\n [disabled]=\"disabled\"\r\n [placeholder]=\"placeholder\"\r\n (selectionChange)=\"onSelectionChanged($event)\"\r\n >\r\n <mat-select-trigger>\r\n <span *ngIf=\"getAllSelectedChecked()\">{{ allLabel }}</span>\r\n <span *ngIf=\"!getAllSelectedChecked()\"\r\n >{{ val && multiple ? getLabel(val[0]) : getLabel(val) }}\r\n <span *ngIf=\"multiple && value?.length > 1\" class=\"additional-selection\">\r\n (+{{ useSelectAllOption && this.allSelected?.selected ? value?.length - 2 : value?.length - 1 }}\r\n {{ (value?.length === 2 ? otherLabel : othersLabel) }})\r\n </span>\r\n </span>\r\n </mat-select-trigger>\r\n <mat-option *ngIf=\"useSearchOption\">\r\n <ngx-mat-select-search\r\n [formControl]=\"itemFilterCtrl\"\r\n [placeholderLabel]=\"searchFieldPlaceholder\"\r\n [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\r\n ></ngx-mat-select-search>\r\n </mat-option>\r\n <mat-option *ngIf=\"useNoneOption\">{{ noneLabel }}</mat-option>\r\n <mat-option #allSelected *ngIf=\"useSelectAllOption\" (click)=\"toggleAllSelection()\" [value]=\"selectAllValue\">{{\r\n allLabel\r\n }}</mat-option>\r\n <mat-option *ngFor=\"let item of filteredItems$ | async\" [value]=\"item.value\" (click)=\"togglePerOne()\">\r\n {{ item.label }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n</app-element-wrapper>\r\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: ElementWrapperComponent, selector: "app-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i4$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "directive", type: i4$1.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i2.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i7.MatSelectSearchComponent, selector: "ngx-mat-select-search", inputs: ["placeholderLabel", "type", "closeIcon", "closeSvgIcon", "noEntriesFoundLabel", "indexAndLengthScreenReaderText", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toogleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti"], outputs: ["toggleAll"] }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
|
|
986
896
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EcabsSelectComponent, decorators: [{
|
|
987
897
|
type: Component,
|
|
988
898
|
args: [{ selector: 'ecabs-select', providers: [
|
|
@@ -991,8 +901,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
991
901
|
useExisting: EcabsSelectComponent,
|
|
992
902
|
multi: true,
|
|
993
903
|
},
|
|
994
|
-
], template: "<app-element-wrapper [data]=\"getData()\">\r\n <mat-form-field [ngClass]=\"{ disabled: useOnlyDisabledClass }\">\r\n <mat-select\r\n [(ngModel)]=\"value\"\r\n (closed)=\"onTouch()\"\r\n appearance=\"outline\"\r\n [multiple]=\"multiple\"\r\n [disabled]=\"disabled\"\r\n [placeholder]=\"placeholder\"\r\n (selectionChange)=\"onSelectionChanged($event)\"\r\n >\r\n <mat-select-trigger>\r\n <span *ngIf=\"getAllSelectedChecked()\">{{ allLabel }}</span>\r\n <span *ngIf=\"!getAllSelectedChecked()\"\r\n >{{ val && multiple ? getLabel(val[0]) : getLabel(val) }}\r\n <span *ngIf=\"multiple && value?.length > 1\" class=\"additional-selection\">\r\n (+{{ useSelectAllOption && this.allSelected?.selected ? value?.length - 2 : value?.length - 1 }}\r\n {{ (value?.length === 2 ? otherLabel : othersLabel) }})\r\n </span>\r\n </span>\r\n </mat-select-trigger>\r\n <mat-option *ngIf=\"useSearchOption\">\r\n <ngx-mat-select-search\r\n [formControl]=\"itemFilterCtrl\"\r\n [placeholderLabel]=\"searchFieldPlaceholder\"\r\n [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\r\n ></ngx-mat-select-search>\r\n </mat-option>\r\n <mat-option *ngIf=\"useNoneOption\"
|
|
995
|
-
}], ctorParameters: function () { return [{ type: i0.Injector }
|
|
904
|
+
], template: "<app-element-wrapper [data]=\"getData()\">\r\n <mat-form-field [ngClass]=\"{ disabled: useOnlyDisabledClass }\">\r\n <mat-select\r\n [(ngModel)]=\"value\"\r\n (closed)=\"onTouch()\"\r\n appearance=\"outline\"\r\n [multiple]=\"multiple\"\r\n [disabled]=\"disabled\"\r\n [placeholder]=\"placeholder\"\r\n (selectionChange)=\"onSelectionChanged($event)\"\r\n >\r\n <mat-select-trigger>\r\n <span *ngIf=\"getAllSelectedChecked()\">{{ allLabel }}</span>\r\n <span *ngIf=\"!getAllSelectedChecked()\"\r\n >{{ val && multiple ? getLabel(val[0]) : getLabel(val) }}\r\n <span *ngIf=\"multiple && value?.length > 1\" class=\"additional-selection\">\r\n (+{{ useSelectAllOption && this.allSelected?.selected ? value?.length - 2 : value?.length - 1 }}\r\n {{ (value?.length === 2 ? otherLabel : othersLabel) }})\r\n </span>\r\n </span>\r\n </mat-select-trigger>\r\n <mat-option *ngIf=\"useSearchOption\">\r\n <ngx-mat-select-search\r\n [formControl]=\"itemFilterCtrl\"\r\n [placeholderLabel]=\"searchFieldPlaceholder\"\r\n [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\r\n ></ngx-mat-select-search>\r\n </mat-option>\r\n <mat-option *ngIf=\"useNoneOption\">{{ noneLabel }}</mat-option>\r\n <mat-option #allSelected *ngIf=\"useSelectAllOption\" (click)=\"toggleAllSelection()\" [value]=\"selectAllValue\">{{\r\n allLabel\r\n }}</mat-option>\r\n <mat-option *ngFor=\"let item of filteredItems$ | async\" [value]=\"item.value\" (click)=\"togglePerOne()\">\r\n {{ item.label }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n</app-element-wrapper>\r\n" }]
|
|
905
|
+
}], ctorParameters: function () { return [{ type: i0.Injector }]; }, propDecorators: { items: [{
|
|
996
906
|
type: Input
|
|
997
907
|
}], multiple: [{
|
|
998
908
|
type: Input
|
|
@@ -3163,22 +3073,40 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
3163
3073
|
}]
|
|
3164
3074
|
}] });
|
|
3165
3075
|
|
|
3166
|
-
class
|
|
3076
|
+
class EcabsDialogConfirmComponent {
|
|
3167
3077
|
constructor(dialogRef, data) {
|
|
3168
3078
|
this.dialogRef = dialogRef;
|
|
3169
3079
|
this.data = data;
|
|
3080
|
+
this.destroy$ = new Subject();
|
|
3170
3081
|
this.color = 'primary';
|
|
3171
3082
|
this.titleColor = 'primary';
|
|
3172
3083
|
}
|
|
3173
3084
|
ngOnInit() {
|
|
3174
3085
|
this.dialogRef.updateSize(this.data.width || '24rem');
|
|
3175
3086
|
}
|
|
3087
|
+
ngOnDestroy() {
|
|
3088
|
+
this.destroy$.next(true);
|
|
3089
|
+
this.destroy$.complete();
|
|
3090
|
+
}
|
|
3091
|
+
closeDialog() {
|
|
3092
|
+
var _a;
|
|
3093
|
+
if (this.data.loading$) {
|
|
3094
|
+
(_a = this.data.loading$) === null || _a === void 0 ? void 0 : _a.pipe(takeUntil(this.destroy$)).subscribe((loading) => {
|
|
3095
|
+
if (!loading) {
|
|
3096
|
+
this.dialogRef.close(true);
|
|
3097
|
+
}
|
|
3098
|
+
});
|
|
3099
|
+
}
|
|
3100
|
+
else {
|
|
3101
|
+
this.dialogRef.close(true);
|
|
3102
|
+
}
|
|
3103
|
+
}
|
|
3176
3104
|
}
|
|
3177
|
-
|
|
3178
|
-
|
|
3179
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type:
|
|
3105
|
+
EcabsDialogConfirmComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EcabsDialogConfirmComponent, deps: [{ token: i1$1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
|
|
3106
|
+
EcabsDialogConfirmComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: EcabsDialogConfirmComponent, selector: "ecabs-dialog-confirm", ngImport: i0, template: "<div matDialogTitle *ngIf=\"data?.title || !!data?.isPopover\" class=\"flex flex-column\">\r\n <div *ngIf=\"!!data?.isPopover\" class=\"w-full flex justify-end\">\r\n <mat-icon\r\n (click)=\"dialogRef.close(true)\"\r\n class=\"mat-icon material-icons-outlined float-right icon--close mb-2\"\r\n role=\"button\"\r\n >\r\n close\r\n </mat-icon>\r\n </div>\r\n\r\n <div class=\"font-semibold heading--xs modal-title {{ data.titleColor }}\" *ngIf=\"data.title\">\r\n {{ data.title }}\r\n </div>\r\n</div>\r\n\r\n<div mat-dialog-content>\r\n <div>{{ data?.content }}</div>\r\n <ng-container *ngTemplateOutlet=\"data?.message\"></ng-container>\r\n</div>\r\n\r\n<div class=\"pb-6\">\r\n <div mat-dialog-actions class=\"btn__group flex justify-end w-full\" *ngIf=\"!data?.isPopover\">\r\n <ecabs-buttons (click)=\"dialogRef.close(false)\" [stroked]=\"true\">\r\n {{ data?.cancelLabel }}\r\n </ecabs-buttons>\r\n\r\n <ecabs-buttons [color]=\"data?.color || color\" [loading]=\"data.loading$ | async\" (click)=\"closeDialog()\">\r\n {{ data?.confirmLabel }}\r\n </ecabs-buttons>\r\n </div>\r\n</div>\r\n", styles: [":host .mat-dialog-title .mat-icon.icon--close,:host ::ng-deep .mat-dialog-title .mat-icon.icon--close{width:20px;height:20px;line-height:20px;font-size:20px}:host app-buttons,:host ::ng-deep app-buttons{width:calc(50% - .5rem)}:host button,:host ::ng-deep button{width:100%}.modal-title.warn{color:var(--color-error)!important}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { kind: "component", type: ButtonsComponent, selector: "ecabs-buttons", inputs: ["label", "disabled", "loading", "form", "size", "type", "raised", "stroked", "full", "color"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
|
|
3107
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EcabsDialogConfirmComponent, decorators: [{
|
|
3180
3108
|
type: Component,
|
|
3181
|
-
args: [{ selector: 'ecabs-dialog-confirm', template: "<div matDialogTitle *ngIf=\"data?.title || !!data?.isPopover\" class=\"flex flex-column\">\r\n <div *ngIf=\"!!data?.isPopover\" class=\"w-full flex justify-end\">\r\n <mat-icon\r\n (click)=\"dialogRef.close(true)\"\r\n class=\"mat-icon material-icons-outlined float-right icon--close mb-2\"\r\n role=\"button\"\r\n >\r\n close\r\n </mat-icon>\r\n </div>\r\n\r\n <div class=\"font-semibold heading--xs modal-title {{ data.titleColor }}\" *ngIf=\"data.title\">\r\n {{ data.title }}\r\n </div>\r\n</div>\r\n\r\n<div mat-dialog-content>\r\n <div>{{ data?.content }}</div>\r\n <ng-container *ngTemplateOutlet=\"data?.message\"></ng-container>\r\n</div>\r\n\r\n<div class=\"pb-6\">\r\n <div mat-dialog-actions class=\"btn__group flex justify-end w-full\" *ngIf=\"!data?.isPopover\">\r\n <ecabs-buttons (click)=\"dialogRef.close(false)\" [stroked]=\"true\">\r\n {{ data?.cancelLabel }}\r\n </ecabs-buttons>\r\n\r\n <ecabs-buttons [color]=\"data?.color || color\" (click)=\"
|
|
3109
|
+
args: [{ selector: 'ecabs-dialog-confirm', template: "<div matDialogTitle *ngIf=\"data?.title || !!data?.isPopover\" class=\"flex flex-column\">\r\n <div *ngIf=\"!!data?.isPopover\" class=\"w-full flex justify-end\">\r\n <mat-icon\r\n (click)=\"dialogRef.close(true)\"\r\n class=\"mat-icon material-icons-outlined float-right icon--close mb-2\"\r\n role=\"button\"\r\n >\r\n close\r\n </mat-icon>\r\n </div>\r\n\r\n <div class=\"font-semibold heading--xs modal-title {{ data.titleColor }}\" *ngIf=\"data.title\">\r\n {{ data.title }}\r\n </div>\r\n</div>\r\n\r\n<div mat-dialog-content>\r\n <div>{{ data?.content }}</div>\r\n <ng-container *ngTemplateOutlet=\"data?.message\"></ng-container>\r\n</div>\r\n\r\n<div class=\"pb-6\">\r\n <div mat-dialog-actions class=\"btn__group flex justify-end w-full\" *ngIf=\"!data?.isPopover\">\r\n <ecabs-buttons (click)=\"dialogRef.close(false)\" [stroked]=\"true\">\r\n {{ data?.cancelLabel }}\r\n </ecabs-buttons>\r\n\r\n <ecabs-buttons [color]=\"data?.color || color\" [loading]=\"data.loading$ | async\" (click)=\"closeDialog()\">\r\n {{ data?.confirmLabel }}\r\n </ecabs-buttons>\r\n </div>\r\n</div>\r\n", styles: [":host .mat-dialog-title .mat-icon.icon--close,:host ::ng-deep .mat-dialog-title .mat-icon.icon--close{width:20px;height:20px;line-height:20px;font-size:20px}:host app-buttons,:host ::ng-deep app-buttons{width:calc(50% - .5rem)}:host button,:host ::ng-deep button{width:100%}.modal-title.warn{color:var(--color-error)!important}\n"] }]
|
|
3182
3110
|
}], ctorParameters: function () {
|
|
3183
3111
|
return [{ type: i1$1.MatDialogRef }, { type: undefined, decorators: [{
|
|
3184
3112
|
type: Inject,
|
|
@@ -3186,15 +3114,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
3186
3114
|
}] }];
|
|
3187
3115
|
} });
|
|
3188
3116
|
|
|
3189
|
-
class
|
|
3117
|
+
class EcabsDialogConfirmModule {
|
|
3190
3118
|
}
|
|
3191
|
-
|
|
3192
|
-
|
|
3193
|
-
|
|
3194
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type:
|
|
3119
|
+
EcabsDialogConfirmModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EcabsDialogConfirmModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
3120
|
+
EcabsDialogConfirmModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: EcabsDialogConfirmModule, declarations: [EcabsDialogConfirmComponent], imports: [CommonModule, MatDialogModule, EcabsButtonsModule, MatIconModule] });
|
|
3121
|
+
EcabsDialogConfirmModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EcabsDialogConfirmModule, imports: [CommonModule, MatDialogModule, EcabsButtonsModule, MatIconModule] });
|
|
3122
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EcabsDialogConfirmModule, decorators: [{
|
|
3195
3123
|
type: NgModule,
|
|
3196
3124
|
args: [{
|
|
3197
|
-
declarations: [
|
|
3125
|
+
declarations: [EcabsDialogConfirmComponent],
|
|
3198
3126
|
imports: [CommonModule, MatDialogModule, EcabsButtonsModule, MatIconModule],
|
|
3199
3127
|
}]
|
|
3200
3128
|
}] });
|
|
@@ -3205,13 +3133,31 @@ class EcabsDialogMessageComponent {
|
|
|
3205
3133
|
this.data = data;
|
|
3206
3134
|
this.color = 'primary';
|
|
3207
3135
|
this.titleColor = 'success';
|
|
3136
|
+
this.destroy$ = new Subject();
|
|
3137
|
+
}
|
|
3138
|
+
ngOnDestroy() {
|
|
3139
|
+
this.destroy$.next(true);
|
|
3140
|
+
this.destroy$.complete();
|
|
3141
|
+
}
|
|
3142
|
+
closeDialog() {
|
|
3143
|
+
var _a;
|
|
3144
|
+
if (this.data.loading$) {
|
|
3145
|
+
(_a = this.data.loading$) === null || _a === void 0 ? void 0 : _a.pipe(takeUntil(this.destroy$)).subscribe((loading) => {
|
|
3146
|
+
if (!loading) {
|
|
3147
|
+
this.dialogRef.close(true);
|
|
3148
|
+
}
|
|
3149
|
+
});
|
|
3150
|
+
}
|
|
3151
|
+
else {
|
|
3152
|
+
this.dialogRef.close(true);
|
|
3153
|
+
}
|
|
3208
3154
|
}
|
|
3209
3155
|
}
|
|
3210
3156
|
EcabsDialogMessageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EcabsDialogMessageComponent, deps: [{ token: i1$1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
|
|
3211
|
-
EcabsDialogMessageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: EcabsDialogMessageComponent, selector: "ecabs-dialog-message", ngImport: i0, template: "<div matDialogTitle *ngIf=\"data?.title || !!data?.isPopover\" class=\"flex flex-column\">\r\n <div *ngIf=\"!!data?.isPopover\" class=\"w-full flex justify-end\">\r\n <mat-icon\r\n (click)=\"dialogRef.close(true)\"\r\n class=\"mat-icon material-icons-outlined float-right icon--close mb-2\"\r\n role=\"button\"\r\n >\r\n close\r\n </mat-icon>\r\n </div>\r\n\r\n <div *ngIf=\"data.title\" class=\"title font-semibold heading--xs\" [ngClass]=\"data?.titleColor || titleColor\">\r\n {{ data.title }}\r\n </div>\r\n</div>\r\n\r\n<div mat-dialog-content>\r\n {{data?.message}}\r\n</div>\r\n\r\n<div class=\"pb-6\">\r\n <div mat-dialog-actions class=\"btn__group flex justify-end w-full\" *ngIf=\"!data?.isPopover\">\r\n <ecabs-buttons [color]=\"data?.color || color\" [full]=\"data?.isButtonBlock\" (click)=\"
|
|
3157
|
+
EcabsDialogMessageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: EcabsDialogMessageComponent, selector: "ecabs-dialog-message", ngImport: i0, template: "<div matDialogTitle *ngIf=\"data?.title || !!data?.isPopover\" class=\"flex flex-column\">\r\n <div *ngIf=\"!!data?.isPopover\" class=\"w-full flex justify-end\">\r\n <mat-icon\r\n (click)=\"dialogRef.close(true)\"\r\n class=\"mat-icon material-icons-outlined float-right icon--close mb-2\"\r\n role=\"button\"\r\n >\r\n close\r\n </mat-icon>\r\n </div>\r\n\r\n <div *ngIf=\"data.title\" class=\"title font-semibold heading--xs\" [ngClass]=\"data?.titleColor || titleColor\">\r\n {{ data.title }}\r\n </div>\r\n</div>\r\n\r\n<div mat-dialog-content>\r\n {{data?.message}}\r\n</div>\r\n\r\n<div class=\"pb-6\">\r\n <div mat-dialog-actions class=\"btn__group flex justify-end w-full\" *ngIf=\"!data?.isPopover\">\r\n <ecabs-buttons [color]=\"data?.color || color\" [full]=\"data?.isButtonBlock\" [loading]=\"data.loading$ | async\" (click)=\"closeDialog()\">\r\n {{ data?.confirmLabel }}\r\n </ecabs-buttons>\r\n </div>\r\n</div>\r\n", styles: [":host .mat-dialog-title .mat-icon.icon--close,:host ::ng-deep .mat-dialog-title .mat-icon.icon--close{width:20px;height:20px;line-height:20px;font-size:20px}:host .title.success,:host ::ng-deep .title.success{color:var(--color-success)}:host app-buttons,:host ::ng-deep app-buttons{width:calc(50% - .5rem)}:host button,:host ::ng-deep button{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { kind: "component", type: ButtonsComponent, selector: "ecabs-buttons", inputs: ["label", "disabled", "loading", "form", "size", "type", "raised", "stroked", "full", "color"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
|
|
3212
3158
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EcabsDialogMessageComponent, decorators: [{
|
|
3213
3159
|
type: Component,
|
|
3214
|
-
args: [{ selector: 'ecabs-dialog-message', template: "<div matDialogTitle *ngIf=\"data?.title || !!data?.isPopover\" class=\"flex flex-column\">\r\n <div *ngIf=\"!!data?.isPopover\" class=\"w-full flex justify-end\">\r\n <mat-icon\r\n (click)=\"dialogRef.close(true)\"\r\n class=\"mat-icon material-icons-outlined float-right icon--close mb-2\"\r\n role=\"button\"\r\n >\r\n close\r\n </mat-icon>\r\n </div>\r\n\r\n <div *ngIf=\"data.title\" class=\"title font-semibold heading--xs\" [ngClass]=\"data?.titleColor || titleColor\">\r\n {{ data.title }}\r\n </div>\r\n</div>\r\n\r\n<div mat-dialog-content>\r\n {{data?.message}}\r\n</div>\r\n\r\n<div class=\"pb-6\">\r\n <div mat-dialog-actions class=\"btn__group flex justify-end w-full\" *ngIf=\"!data?.isPopover\">\r\n <ecabs-buttons [color]=\"data?.color || color\" [full]=\"data?.isButtonBlock\" (click)=\"
|
|
3160
|
+
args: [{ selector: 'ecabs-dialog-message', template: "<div matDialogTitle *ngIf=\"data?.title || !!data?.isPopover\" class=\"flex flex-column\">\r\n <div *ngIf=\"!!data?.isPopover\" class=\"w-full flex justify-end\">\r\n <mat-icon\r\n (click)=\"dialogRef.close(true)\"\r\n class=\"mat-icon material-icons-outlined float-right icon--close mb-2\"\r\n role=\"button\"\r\n >\r\n close\r\n </mat-icon>\r\n </div>\r\n\r\n <div *ngIf=\"data.title\" class=\"title font-semibold heading--xs\" [ngClass]=\"data?.titleColor || titleColor\">\r\n {{ data.title }}\r\n </div>\r\n</div>\r\n\r\n<div mat-dialog-content>\r\n {{data?.message}}\r\n</div>\r\n\r\n<div class=\"pb-6\">\r\n <div mat-dialog-actions class=\"btn__group flex justify-end w-full\" *ngIf=\"!data?.isPopover\">\r\n <ecabs-buttons [color]=\"data?.color || color\" [full]=\"data?.isButtonBlock\" [loading]=\"data.loading$ | async\" (click)=\"closeDialog()\">\r\n {{ data?.confirmLabel }}\r\n </ecabs-buttons>\r\n </div>\r\n</div>\r\n", styles: [":host .mat-dialog-title .mat-icon.icon--close,:host ::ng-deep .mat-dialog-title .mat-icon.icon--close{width:20px;height:20px;line-height:20px;font-size:20px}:host .title.success,:host ::ng-deep .title.success{color:var(--color-success)}:host app-buttons,:host ::ng-deep app-buttons{width:calc(50% - .5rem)}:host button,:host ::ng-deep button{width:100%}\n"] }]
|
|
3215
3161
|
}], ctorParameters: function () {
|
|
3216
3162
|
return [{ type: i1$1.MatDialogRef }, { type: undefined, decorators: [{
|
|
3217
3163
|
type: Inject,
|
|
@@ -3290,14 +3236,18 @@ class EcabsLanguageSelectorComponent {
|
|
|
3290
3236
|
}
|
|
3291
3237
|
}
|
|
3292
3238
|
EcabsLanguageSelectorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EcabsLanguageSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3293
|
-
EcabsLanguageSelectorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: EcabsLanguageSelectorComponent, selector: "ecabs-language-selector", inputs: { languages: "languages", currentLanguage: "currentLanguage" }, outputs: { languageChanged: "languageChanged" }, usesOnChanges: true, ngImport: i0, template: "<mat-form-field>\r\n <mat-select class=\"capitalize\" [(ngModel)]=\"selectedLang\" name=\"language\" (ngModelChange)=\"toggleLang()\"\r\n panelClass=\"wide-select\">\r\n <mat-select-trigger>\r\n <div class=\"flex items-center\">\r\n <span [ngClass]=\"flagClass(matchSelected())\"></span>\r\n <div class=\"ml-2\">{{standardLang(matchSelected())}}</div>\r\n </div>\r\n </mat-select-trigger>\r\n <mat-option class=\"capitalize\" *ngFor=\"let lang of languages\" [value]=\"lang\">\r\n <div class=\"flex items-center\">\r\n <span [ngClass]=\"flagClass(lang)\"></span>\r\n <div class=\"ml-2\">{{standardLang(lang) | titlecase}}</div>\r\n </div>\r\n </mat-option>\r\n </mat-select>\r\n</mat-form-field>\r\n", styles: [":host::ng-deep .mat-select{padding:0;border:0}:host::ng-deep .mat-select .mat-select-arrow{border:none}:host::ng-deep .mat-select,:host::ng-deep .mat-select .mat-option{font-size:12px}:host::ng-deep .mat-form-field-infix{width:auto}\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: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i4$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "directive", type: i4$1.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i2.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: i1.TitleCasePipe, name: "titlecase" }] });
|
|
3239
|
+
EcabsLanguageSelectorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: EcabsLanguageSelectorComponent, selector: "ecabs-language-selector", inputs: { languages: "languages", currentLanguage: "currentLanguage", flagOnly: "flagOnly", tooltip: "tooltip" }, outputs: { languageChanged: "languageChanged" }, usesOnChanges: true, ngImport: i0, template: "<mat-form-field [ngClass]=\"{'flag-only': flagOnly}\">\r\n <mat-select class=\"capitalize\" [(ngModel)]=\"selectedLang\" name=\"language\" (ngModelChange)=\"toggleLang()\"\r\n panelClass=\"wide-select\">\r\n <mat-select-trigger>\r\n <div class=\"flex items-center\" [matTooltip]=\"tooltip\" [matTooltipDisabled]=\"!flagOnly || !tooltip\">\r\n <span [ngClass]=\"flagClass(matchSelected())\"></span>\r\n <div *ngIf=\"!flagOnly\" class=\"ml-2\">{{standardLang(matchSelected())}}</div>\r\n </div>\r\n </mat-select-trigger>\r\n <mat-option class=\"capitalize\" *ngFor=\"let lang of languages\" [value]=\"lang\">\r\n <div class=\"flex items-center\">\r\n <span [ngClass]=\"flagClass(lang)\"></span>\r\n <div class=\"ml-2\">{{standardLang(lang) | titlecase}}</div>\r\n </div>\r\n </mat-option>\r\n </mat-select>\r\n</mat-form-field>\r\n", styles: [":host::ng-deep .mat-select{padding:0;border:0}:host::ng-deep .mat-select .mat-select-arrow{border:none}:host::ng-deep .mat-select,:host::ng-deep .mat-select .mat-option{font-size:12px}:host::ng-deep .mat-form-field-infix{width:auto}:host::ng-deep .flag-only .mat-select .mat-select-arrow-wrapper{width:0}\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: i3$1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i4$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "directive", type: i4$1.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i2.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "pipe", type: i1.TitleCasePipe, name: "titlecase" }] });
|
|
3294
3240
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EcabsLanguageSelectorComponent, decorators: [{
|
|
3295
3241
|
type: Component,
|
|
3296
|
-
args: [{ selector: 'ecabs-language-selector', template: "<mat-form-field>\r\n <mat-select class=\"capitalize\" [(ngModel)]=\"selectedLang\" name=\"language\" (ngModelChange)=\"toggleLang()\"\r\n panelClass=\"wide-select\">\r\n <mat-select-trigger>\r\n <div class=\"flex items-center\">\r\n <span [ngClass]=\"flagClass(matchSelected())\"></span>\r\n <div class=\"ml-2\">{{standardLang(matchSelected())}}</div>\r\n </div>\r\n </mat-select-trigger>\r\n <mat-option class=\"capitalize\" *ngFor=\"let lang of languages\" [value]=\"lang\">\r\n <div class=\"flex items-center\">\r\n <span [ngClass]=\"flagClass(lang)\"></span>\r\n <div class=\"ml-2\">{{standardLang(lang) | titlecase}}</div>\r\n </div>\r\n </mat-option>\r\n </mat-select>\r\n</mat-form-field>\r\n", styles: [":host::ng-deep .mat-select{padding:0;border:0}:host::ng-deep .mat-select .mat-select-arrow{border:none}:host::ng-deep .mat-select,:host::ng-deep .mat-select .mat-option{font-size:12px}:host::ng-deep .mat-form-field-infix{width:auto}\n"] }]
|
|
3242
|
+
args: [{ selector: 'ecabs-language-selector', template: "<mat-form-field [ngClass]=\"{'flag-only': flagOnly}\">\r\n <mat-select class=\"capitalize\" [(ngModel)]=\"selectedLang\" name=\"language\" (ngModelChange)=\"toggleLang()\"\r\n panelClass=\"wide-select\">\r\n <mat-select-trigger>\r\n <div class=\"flex items-center\" [matTooltip]=\"tooltip\" [matTooltipDisabled]=\"!flagOnly || !tooltip\">\r\n <span [ngClass]=\"flagClass(matchSelected())\"></span>\r\n <div *ngIf=\"!flagOnly\" class=\"ml-2\">{{standardLang(matchSelected())}}</div>\r\n </div>\r\n </mat-select-trigger>\r\n <mat-option class=\"capitalize\" *ngFor=\"let lang of languages\" [value]=\"lang\">\r\n <div class=\"flex items-center\">\r\n <span [ngClass]=\"flagClass(lang)\"></span>\r\n <div class=\"ml-2\">{{standardLang(lang) | titlecase}}</div>\r\n </div>\r\n </mat-option>\r\n </mat-select>\r\n</mat-form-field>\r\n", styles: [":host::ng-deep .mat-select{padding:0;border:0}:host::ng-deep .mat-select .mat-select-arrow{border:none}:host::ng-deep .mat-select,:host::ng-deep .mat-select .mat-option{font-size:12px}:host::ng-deep .mat-form-field-infix{width:auto}:host::ng-deep .flag-only .mat-select .mat-select-arrow-wrapper{width:0}\n"] }]
|
|
3297
3243
|
}], propDecorators: { languages: [{
|
|
3298
3244
|
type: Input
|
|
3299
3245
|
}], currentLanguage: [{
|
|
3300
3246
|
type: Input
|
|
3247
|
+
}], flagOnly: [{
|
|
3248
|
+
type: Input
|
|
3249
|
+
}], tooltip: [{
|
|
3250
|
+
type: Input
|
|
3301
3251
|
}], languageChanged: [{
|
|
3302
3252
|
type: Output
|
|
3303
3253
|
}] } });
|
|
@@ -3309,12 +3259,14 @@ EcabsLanguageSelectorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0
|
|
|
3309
3259
|
MatSelectModule,
|
|
3310
3260
|
MatFormFieldModule,
|
|
3311
3261
|
FormsModule,
|
|
3312
|
-
ReactiveFormsModule
|
|
3262
|
+
ReactiveFormsModule,
|
|
3263
|
+
MatTooltipModule], exports: [EcabsLanguageSelectorComponent] });
|
|
3313
3264
|
EcabsLanguageSelectorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EcabsLanguageSelectorModule, imports: [CommonModule,
|
|
3314
3265
|
MatSelectModule,
|
|
3315
3266
|
MatFormFieldModule,
|
|
3316
3267
|
FormsModule,
|
|
3317
|
-
ReactiveFormsModule
|
|
3268
|
+
ReactiveFormsModule,
|
|
3269
|
+
MatTooltipModule] });
|
|
3318
3270
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EcabsLanguageSelectorModule, decorators: [{
|
|
3319
3271
|
type: NgModule,
|
|
3320
3272
|
args: [{
|
|
@@ -3324,7 +3276,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
3324
3276
|
MatSelectModule,
|
|
3325
3277
|
MatFormFieldModule,
|
|
3326
3278
|
FormsModule,
|
|
3327
|
-
ReactiveFormsModule
|
|
3279
|
+
ReactiveFormsModule,
|
|
3280
|
+
MatTooltipModule
|
|
3328
3281
|
],
|
|
3329
3282
|
exports: [EcabsLanguageSelectorComponent],
|
|
3330
3283
|
}]
|
|
@@ -3403,5 +3356,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
3403
3356
|
* Generated bundle index. Do not edit.
|
|
3404
3357
|
*/
|
|
3405
3358
|
|
|
3406
|
-
export { ActiveStatusFilterComponent, ButtonsComponent,
|
|
3359
|
+
export { ActiveStatusFilterComponent, ButtonsComponent, EcabsActiveStatusFilterModule, EcabsBreadcrumbComponent, EcabsBreadcrumbModule, EcabsButtonsModule, EcabsCheckboxToggleComponent, EcabsCheckboxToggleModule, EcabsComponentsService, EcabsDatePickerComponent, EcabsDatePickerHeaderComponent, EcabsDatePickerModule, EcabsDateTimePickerComponent, EcabsDateTimePickerHeaderComponent, EcabsDateTimeRangePickerComponent, EcabsDateTimeRangePickerHeaderComponent, EcabsDatetimePickerModule, EcabsDatetimeRangePickerModule, EcabsDialogConfirmComponent, EcabsDialogConfirmModule, EcabsDialogMessageComponent, EcabsDialogMessageModule, EcabsEmptyPlaceholderComponent, EcabsEmptyPlaceholderModule, EcabsExpansionPanelComponent, EcabsExpansionPanelModule, EcabsIncrementComponent, EcabsIncrementModule, EcabsInputComponent, EcabsInputModule, EcabsLanguageSelectorComponent, EcabsLanguageSelectorModule, EcabsLoadingComponent, EcabsLoadingModule, EcabsPhoneComponent, EcabsPhoneModule, EcabsRadioButtonListComponent, EcabsRadioButtonListModule, EcabsSelectComponent, EcabsSelectModule, EcabsSpinnerComponent, EcabsTableFilterWrapperComponent, EcabsTableFilterWrapperModule, EcabsTableModule, EcabsTextAreaModule, EcabsTextareaComponent, EcabsTimeListPanelComponent, EcabsTimepickerComponent, EcabsTimepickerModule, EcabsValidationComponent, EcabsValidationModule, EcabsValidationViewModule, FormTimePickerService, NoteComponent, NoteModule, TableComponent, TimeRangeDirective, ValidationComponent, scrollFactory };
|
|
3407
3360
|
//# sourceMappingURL=ecabs-components.mjs.map
|