nexheal-lib 0.0.13 → 0.0.15

package/fesm2022/nexheal-lib.mjs

@@ -28,12 +28,28 @@ class AutocompleteControl {
     addNewItemClicked = new EventEmitter();
     blurEvent = new EventEmitter();
     optionPatched = new EventEmitter();
+    loadAllOnOpen = false;
     readonly = false;
     _disabled = false;
     _options = [];
     set options(value) {
         this._options = value || [];
         this.processValueBuffer();
+        if (this.hasFocus && this.isDropdownOpen) {
+            const val = this.inputControl.value || "";
+            if (val === "" && this.loadAllOnOpen) {
+                this.filteredSuggestions = [...this._options];
+            }
+            else if (val !== "") {
+                const filterValue = val.toString().toLowerCase();
+                this.filteredSuggestions = this._options.filter((suggestion) => suggestion[this.optionDisplayProperty]?.toLowerCase().includes(filterValue));
+            }
+            this.highlightedIndex = this.filteredSuggestions.length > 0 ? 0 : null;
+            setTimeout(() => {
+                if (this.popperInstance)
+                    this.popperInstance.update();
+            }, 0);
+        }
     }
     get options() {
         return this._options;
@@ -80,7 +96,13 @@ class AutocompleteControl {
                 this.search.emit(filterValue);
             }
             else {
-                this.isDropdownOpen = false;
+                if (this.loadAllOnOpen && this.hasFocus) {
+                    this.filterSuggestions("");
+                    this.search.emit("");
+                }
+                else {
+                    this.isDropdownOpen = false;
+                }
             }
         });
     }
@@ -153,8 +175,18 @@ class AutocompleteControl {
             return;
         }
         if (value === "") {
-            this.filteredSuggestions = [];
-            this.isDropdownOpen = false;
+            if (this.loadAllOnOpen) {
+                this.filteredSuggestions = [...this.options];
+                this.highlightedIndex = this.filteredSuggestions.length > 0 ? 0 : null;
+                this.isDropdownOpen = true;
+                setTimeout(() => {
+                    this.createPopperInstance();
+                }, 0);
+            }
+            else {
+                this.filteredSuggestions = [];
+                this.isDropdownOpen = false;
+            }
             return;
         }
         const filterValue = value.toString().toLowerCase();
@@ -184,6 +216,13 @@ class AutocompleteControl {
     // events
     onFocus() {
         this.hasFocus = true;
+        if (this.readonly)
+            return;
+        if (this.loadAllOnOpen) {
+            const val = this.inputControl.value || "";
+            this.filterSuggestions(val);
+            this.search.emit(val);
+        }
     }
     onBlur() {
         this.blurEvent.emit();
@@ -304,7 +343,7 @@ class AutocompleteControl {
         this.optionSelected.emit(this.selectedItems);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: AutocompleteControl, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: AutocompleteControl, isStandalone: true, selector: "autocomplete-control", inputs: { title: "title", required: "required", placeholder: "placeholder", customClass: "customClass", clearVal: "clearVal", field: "field", error: "error", errorMessage: "errorMessage", autocomplete: "autocomplete", inputLoader: "inputLoader", isAddNewItem: "isAddNewItem", optionDisplayProperty: "optionDisplayProperty", readonly: "readonly", options: "options", disabled: "disabled" }, outputs: { optionSelected: "optionSelected", search: "search", selectionCleared: "selectionCleared", addNewItemClicked: "addNewItemClicked", blurEvent: "blurEvent", optionPatched: "optionPatched" }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: AutocompleteControl, isStandalone: true, selector: "autocomplete-control", inputs: { title: "title", required: "required", placeholder: "placeholder", customClass: "customClass", clearVal: "clearVal", field: "field", error: "error", errorMessage: "errorMessage", autocomplete: "autocomplete", inputLoader: "inputLoader", isAddNewItem: "isAddNewItem", optionDisplayProperty: "optionDisplayProperty", loadAllOnOpen: "loadAllOnOpen", readonly: "readonly", options: "options", disabled: "disabled" }, outputs: { optionSelected: "optionSelected", search: "search", selectionCleared: "selectionCleared", addNewItemClicked: "addNewItemClicked", blurEvent: "blurEvent", optionPatched: "optionPatched" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: AutocompleteControl,
@@ -357,6 +396,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImpor
                 type: Output
             }], optionPatched: [{
                 type: Output
+            }], loadAllOnOpen: [{
+                type: Input
             }], readonly: [{
                 type: Input
             }], options: [{
@@ -386,6 +427,7 @@ class CalendarControl {
     timeOnly = false;
     dateFormat = "dd/MM/yyyy";
     placeholder = "dd-mm-yyyy";
+    viewMode = "date";
     _disabled = false;
     get disabled() {
         return this._disabled;
@@ -409,6 +451,22 @@ class CalendarControl {
     selectionCleared = new EventEmitter();
     blurEvent = new EventEmitter();
     dateSelected = new EventEmitter();
+    _defaultDate;
+    get defaultDate() {
+        return this._defaultDate;
+    }
+    set defaultDate(value) {
+        this._defaultDate = value;
+        if (value && !this.selectedDate) {
+            const parsed = new Date(value);
+            if (!isNaN(parsed.getTime())) {
+                this.displayMonth = parsed.getMonth();
+                this.displayYear = parsed.getFullYear();
+                this.selectedHour = parsed.getHours();
+                this.selectedMinute = parsed.getMinutes();
+            }
+        }
+    }
     _minDate;
     _maxDate;
     get minDate() {
@@ -785,6 +843,15 @@ class CalendarControl {
     }
     parseDate(val) {
         if (typeof val === "string") {
+            if (this.viewMode === "month") {
+                const mIndex = this.months.findIndex(m => m.toLowerCase() === val.trim().toLowerCase());
+                if (mIndex !== -1) {
+                    return new Date(this.todayYear, mIndex, 1);
+                }
+            }
+            if (this.viewMode === "date" && val.length <= 2 && !isNaN(+val)) {
+                return new Date(this.todayYear, this.todayMonth, +val);
+            }
             const m = val.match(/^(\d{1,2})\/(\d{1,2})\/(\d{4})$/);
             if (m) {
                 const d = +m[1], mo = +m[2] - 1, y = +m[3];
@@ -793,7 +860,13 @@ class CalendarControl {
         }
         // fallback
         const date = new Date(val);
-        return isNaN(date.getTime()) ? null : date;
+        if (!isNaN(date.getTime()))
+            return date;
+        // final fallback for weird year parsing
+        if (this.viewMode === "year" && !isNaN(+val)) {
+            return new Date(+val, 0, 1);
+        }
+        return null;
     }
     formatOutput(date) {
         const datePart = this.datePipe.transform(date, this.dateFormat);
@@ -842,7 +915,21 @@ class CalendarControl {
     ];
     selectMonth(index) {
         this.displayMonth = index;
-        this.currentView = "day";
+        if (this.viewMode === "month") {
+            const picked = new Date(this.displayYear, this.displayMonth, 1);
+            if (this.isDateDisabled(picked))
+                return;
+            this.selectedDate = picked;
+            const out = this.formatOutput(picked);
+            this.inputControl.setValue(out, { emitEvent: false });
+            this.onChangeFn(out);
+            this.onTouchedFn();
+            this.dateSelected.emit(picked);
+            this.isOpen = false;
+        }
+        else {
+            this.currentView = "day";
+        }
     }
     get displayMonthName() {
         return this.months[this.displayMonth];
@@ -883,7 +970,21 @@ class CalendarControl {
     }
     selectYear(year) {
         this.displayYear = year;
-        this.currentView = "month";
+        if (this.viewMode === "year") {
+            const picked = new Date(this.displayYear, 0, 1);
+            if (this.isDateDisabled(picked))
+                return;
+            this.selectedDate = picked;
+            const out = this.formatOutput(picked);
+            this.inputControl.setValue(out, { emitEvent: false });
+            this.onChangeFn(out);
+            this.onTouchedFn();
+            this.dateSelected.emit(picked);
+            this.isOpen = false;
+        }
+        else {
+            this.currentView = "month";
+        }
     }
     prevYearRange() {
         this.displayYear -= this.yearRangeSize;
@@ -994,12 +1095,28 @@ class CalendarControl {
         if (this.isOpen) {
             // mark this one as current
             CalendarControl._currentlyOpen = this;
-            // reset the month/year view
-            this.currentView = "day";
+            if (this.viewMode === "month") {
+                this.currentView = "month";
+            }
+            else if (this.viewMode === "year") {
+                this.currentView = "yearRange";
+            }
+            else {
+                this.currentView = "day";
+            }
             if (this.selectedDate) {
                 this.displayMonth = this.selectedDate.getMonth();
                 this.displayYear = this.selectedDate.getFullYear();
             }
+            else if (this._defaultDate) {
+                const parsed = new Date(this._defaultDate);
+                if (!isNaN(parsed.getTime())) {
+                    this.displayMonth = parsed.getMonth();
+                    this.displayYear = parsed.getFullYear();
+                    this.selectedHour = parsed.getHours();
+                    this.selectedMinute = parsed.getMinutes();
+                }
+            }
             else {
                 const now = new Date();
                 this.displayMonth = now.getMonth();
@@ -1047,15 +1164,24 @@ class CalendarControl {
         this.selectionCleared.emit();
         event.stopPropagation();
         this.selectedDate = null;
-        this.selectedHour = this.today.getHours();
-        this.selectedMinute = this.today.getMinutes();
+        if (this._defaultDate) {
+            const parsed = new Date(this._defaultDate);
+            if (!isNaN(parsed.getTime())) {
+                this.selectedHour = parsed.getHours();
+                this.selectedMinute = parsed.getMinutes();
+            }
+        }
+        else {
+            this.selectedHour = this.today.getHours();
+            this.selectedMinute = this.today.getMinutes();
+        }
         this.inputControl.setValue("", { emitEvent: false });
         this.onChangeFn(null);
         this.onTouchedFn();
         this.dateSelected.emit(null);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: CalendarControl, deps: [{ token: i1.DatePipe }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: CalendarControl, isStandalone: true, selector: "calendar-control", inputs: { title: "title", required: "required", customClass: "customClass", clearVal: "clearVal", deFocus: "deFocus", error: "error", errorMessage: "errorMessage", inputLoader: "inputLoader", hourFormat: "hourFormat", selectionMode: "selectionMode", timeOnly: "timeOnly", dateFormat: "dateFormat", placeholder: "placeholder", disabled: "disabled", readonly: "readonly", submitted: "submitted", inputPlaceholder: "inputPlaceholder", closeVal: ["close-val", "closeVal"], showTime: "showTime", minDate: "minDate", maxDate: "maxDate" }, outputs: { selectionCleared: "selectionCleared", blurEvent: "blurEvent", dateSelected: "dateSelected" }, host: { listeners: { "document:click": "clickOutside($event)" } }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: CalendarControl, isStandalone: true, selector: "calendar-control", inputs: { title: "title", required: "required", customClass: "customClass", clearVal: "clearVal", deFocus: "deFocus", error: "error", errorMessage: "errorMessage", inputLoader: "inputLoader", hourFormat: "hourFormat", selectionMode: "selectionMode", timeOnly: "timeOnly", dateFormat: "dateFormat", placeholder: "placeholder", viewMode: "viewMode", disabled: "disabled", readonly: "readonly", submitted: "submitted", inputPlaceholder: "inputPlaceholder", closeVal: ["close-val", "closeVal"], showTime: "showTime", defaultDate: "defaultDate", minDate: "minDate", maxDate: "maxDate" }, outputs: { selectionCleared: "selectionCleared", blurEvent: "blurEvent", dateSelected: "dateSelected" }, host: { listeners: { "document:click": "clickOutside($event)" } }, providers: [
             DatePipe,
             {
                 provide: NG_VALUE_ACCESSOR,
@@ -1104,6 +1230,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImpor
                 type: Input
             }], placeholder: [{
                 type: Input
+            }], viewMode: [{
+                type: Input
             }], disabled: [{
                 type: Input
             }], readonly: [{
@@ -1123,6 +1251,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImpor
                 type: Output
             }], dateSelected: [{
                 type: Output
+            }], defaultDate: [{
+                type: Input
             }], minDate: [{
                 type: Input
             }], maxDate: [{