@colijnit/corecomponents_v12 261.20.3 → 261.20.5

package/fesm2022/colijnit-corecomponents_v12.mjs

@@ -12430,6 +12430,7 @@ class SimpleGridComponent extends BaseSimpleGridComponent {
     rowDisabledFn;
     showColumnSort = false;
     showRowButtons = false;
+    resetPageOnDataChange = true;
     /**
      * Promise function, if provided should return boolean
      */
@@ -12479,7 +12480,9 @@ class SimpleGridComponent extends BaseSimpleGridComponent {
         this.changeDetection = changeDetection;
         this._formMaster = _formMaster;
         this.dataChanged.subscribe(() => {
-            this.currentPage = 1;
+            if (this.resetPageOnDataChange) {
+                this.currentPage = 1;
+            }
         });
     }
     handleClickOutsideRow() {
@@ -12961,7 +12964,7 @@ class SimpleGridComponent extends BaseSimpleGridComponent {
         this.rowToEdit = undefined;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: SimpleGridComponent, deps: [{ token: IconCacheService }, { token: i0.ChangeDetectorRef }, { token: FormMasterService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: SimpleGridComponent, isStandalone: false, selector: "co-simple-grid", inputs: { showAdd: "showAdd", showDelete: "showDelete", deselectAllowed: "deselectAllowed", editOnCellClick: "editOnCellClick", rightToolbar: "rightToolbar", showGridSettings: "showGridSettings", rowsPerPage: "rowsPerPage", rowDisabledFn: "rowDisabledFn", showColumnSort: "showColumnSort", showRowButtons: "showRowButtons", canRowBeEdittedFn: "canRowBeEdittedFn" }, host: { listeners: { "keydown": "handleKeyDown($event)" }, properties: { "class.co-simple-grid": "this.showClass" } }, providers: [FormMasterService], viewQueries: [{ propertyName: "headerCells", predicate: ["headerCell"], descendants: true }, { propertyName: "rowElements", predicate: ["rowElement"], descendants: true }], usesInheritance: true, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: SimpleGridComponent, isStandalone: false, selector: "co-simple-grid", inputs: { showAdd: "showAdd", showDelete: "showDelete", deselectAllowed: "deselectAllowed", editOnCellClick: "editOnCellClick", rightToolbar: "rightToolbar", showGridSettings: "showGridSettings", rowsPerPage: "rowsPerPage", rowDisabledFn: "rowDisabledFn", showColumnSort: "showColumnSort", showRowButtons: "showRowButtons", resetPageOnDataChange: "resetPageOnDataChange", canRowBeEdittedFn: "canRowBeEdittedFn" }, host: { listeners: { "keydown": "handleKeyDown($event)" }, properties: { "class.co-simple-grid": "this.showClass" } }, providers: [FormMasterService], viewQueries: [{ propertyName: "headerCells", predicate: ["headerCell"], descendants: true }, { propertyName: "rowElements", predicate: ["rowElement"], descendants: true }], usesInheritance: true, ngImport: i0, template: `
     @if (showToolbar) {
       <co-grid-toolbar
         [class.right]="rightToolbar"
@@ -13399,6 +13402,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 type: Input
             }], showRowButtons: [{
                 type: Input
+            }], resetPageOnDataChange: [{
+                type: Input
             }], canRowBeEdittedFn: [{
                 type: Input
             }], showClass: [{
@@ -18657,7 +18662,7 @@ class ScreenConfigurationDirective {
                 this._setHostVisible(myCfgObj.immediatelyVisible());
                 if (!this.screenConfigNativeElement) {
                     this.hostComponent.required = this.hostComponent.required || myCfgObj.isRequired();
-                    this.hostComponent.readonly = this.hostComponent.forceReadonly || this._moduleInReadonlyMode() || myCfgObj.isReadonly();
+                    this.hostComponent.readonly = this._moduleInReadonlyMode() || myCfgObj.isReadonly();
                     this.hostComponent.decimals = myCfgObj.scale;
                     this.hostComponent.maxLength = myCfgObj.maxLength;
                     this.hostComponent.defaultValue = myCfgObj.defaultValue;
@@ -19335,11 +19340,13 @@ class HourSchedulingExpandableComponent {
     currentDraggingObject = null;
     MIN_HEIGHT = 30;
     _schedule = {};
+    _onMouseMove = (e) => this.onResizing(e);
+    _onMouseUp = (e) => this.onResizeEnd(e);
     set schedule(value) {
-        if (value && value !== this._schedule) {
+        this._schedule = value;
+        if (this._schedule) {
             this.renderObjects();
         }
-        this._schedule = value;
     }
     get schedule() {
         return this._schedule;
@@ -19476,14 +19483,10 @@ class HourSchedulingExpandableComponent {
         if (this.currentDraggingObject) {
             let newStartDate = this.convertDateToEuropean(this.currentDraggingObject.start);
             let hourSplit = hour.split(":");
-            newStartDate.setHours(parseInt(hourSplit[0]));
-            newStartDate.setHours(parseInt(hourSplit[1]));
-            if (this.scheduledObjects.find((scheduledObject) => scheduledObject.start === newStartDate)) {
-                return false;
-            }
-            else {
-                return true;
-            }
+            newStartDate.setHours(parseInt(hourSplit[0], 10));
+            newStartDate.setMinutes(parseInt(hourSplit[1], 10));
+            const t = newStartDate.getTime();
+            return !this.scheduledObjects.some(o => o.start?.getTime() === t);
         }
     }
     handleDragLeave(event) {
@@ -19501,8 +19504,8 @@ class HourSchedulingExpandableComponent {
         this.initialHeight = obj.height || 0;
         this.initialTop = obj.top || 0;
         // Listen to mousemove and mouseup events globally
-        document.addEventListener('mousemove', this.onResizing.bind(this));
-        document.addEventListener('mouseup', this.onResizeEnd.bind(this));
+        document.addEventListener("mousemove", this._onMouseMove);
+        document.addEventListener("mouseup", this._onMouseUp);
     }
     // Handle resizing with snapping to 30px increments and minimum height restriction
     onResizing(event) {
@@ -19547,9 +19550,8 @@ class HourSchedulingExpandableComponent {
             this.currentResizingObject.selected = false;
             this.currentResizingObject = null;
         }
-        // Remove global event listeners
-        document.removeEventListener('mousemove', this.onResizing.bind(this));
-        document.removeEventListener('mouseup', this.onResizeEnd.bind(this));
+        document.removeEventListener("mousemove", this._onMouseMove);
+        document.removeEventListener("mouseup", this._onMouseUp);
     }
     timeDifference(date1, date2) {
         let difference = this.convertDateToEuropean(date1).getTime() / 1000 - this.convertDateToEuropean(date2).getTime() / 1000;
@@ -19601,90 +19603,92 @@ class HourSchedulingExpandableComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: HourSchedulingExpandableComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: HourSchedulingExpandableComponent, isStandalone: false, selector: "co-hour-scheduling-expandable", inputs: { schedule: "schedule", startTimeProp: "startTimeProp", endTimeProp: "endTimeProp", objectsProp: "objectsProp", childProp: "childProp", customTemplate: "customTemplate", idProp: "idProp" }, outputs: { timeChangeEvent: "timeChangeEvent", newObjectPlanEvent: "newObjectPlanEvent", moveBetweenCalendarsEvent: "moveBetweenCalendarsEvent" }, host: { listeners: { "window:resize": "onResize($event)", "document:click": "clickOut($event)" }, properties: { "class.co-hour-scheduling-expandable": "this.showClass" } }, ngImport: i0, template: `
-    <div class="wrapper">
-      @for (hour of hourLabels; track hour) {
-        <div class="time-block">
-          <div class="hour-label"><span [textContent]="hour"></span></div>
-          <div class="object-display">
-            <div class="first-half-hour object-half"
-              (dragover)="allowDrop($event, hour)"
-              (dragleave)="handleDragLeave($event)"
-              (drop)="handleDrop($event, hour)">
-            </div>
-            <div class="second-half-hour object-half"
-              (dragover)="allowDrop($event, addHalfHour(hour))"
-              (dragleave)="handleDragLeave($event)"
-              (drop)="handleDrop($event, addHalfHour(hour))">
-            </div>
-          </div>
-        </div>
-      }
-    
-      <div class="scheduled-objects" >
-        <ng-container>
-          <ng-template
-            [ngTemplateOutlet]="customTemplate"
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: HourSchedulingExpandableComponent, isStandalone: false, selector: "co-hour-scheduling-expandable", inputs: { schedule: "schedule", startTimeProp: "startTimeProp", endTimeProp: "endTimeProp", objectsProp: "objectsProp", childProp: "childProp", customTemplate: "customTemplate", idProp: "idProp" }, outputs: { timeChangeEvent: "timeChangeEvent", newObjectPlanEvent: "newObjectPlanEvent", moveBetweenCalendarsEvent: "moveBetweenCalendarsEvent" }, host: { listeners: { "window:resize": "onResize($event)", "document:click": "clickOut($event)" }, properties: { "class.co-hour-scheduling-expandable": "this.showClass" } }, ngImport: i0, template: `
+    <div class="wrapper">
+      @for (hour of hourLabels; track hour) {
+        <div class="time-block">
+          <div class="hour-label"><span [textContent]="hour"></span></div>
+          <div class="object-display">
+            <div class="first-half-hour object-half"
+              (dragover)="allowDrop($event, hour)"
+              (dragleave)="handleDragLeave($event)"
+              (drop)="handleDrop($event, hour)">
+            </div>
+            <div class="second-half-hour object-half"
+              (dragover)="allowDrop($event, addHalfHour(hour))"
+              (dragleave)="handleDragLeave($event)"
+              (drop)="handleDrop($event, addHalfHour(hour))">
+            </div>
+          </div>
+        </div>
+      }
+    
+      <div class="scheduled-objects" >
+        <ng-container>
+          <ng-template
+            [ngTemplateOutlet]="customTemplate"
             [ngTemplateOutletContext]="{
               objects: scheduledObjects,
               onSelectBlock: this.onSelectBlock.bind(this),
               onResizeStart: this.onResizeStart.bind(this),
+              onResizeEnd: this.onResizeEnd.bind(this),
               onDragStartCustom: this.onDragStartCustom.bind(this)
 
             }"
-            >
-            <ng-content></ng-content>
-          </ng-template>
-        </ng-container>
-      </div>
-    
-    </div>
-    
+            >
+            <ng-content></ng-content>
+          </ng-template>
+        </ng-container>
+      </div>
+    
+    </div>
+    
     `, isInline: true, dependencies: [{ kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: HourSchedulingExpandableComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'co-hour-scheduling-expandable',
-                    template: `
-    <div class="wrapper">
-      @for (hour of hourLabels; track hour) {
-        <div class="time-block">
-          <div class="hour-label"><span [textContent]="hour"></span></div>
-          <div class="object-display">
-            <div class="first-half-hour object-half"
-              (dragover)="allowDrop($event, hour)"
-              (dragleave)="handleDragLeave($event)"
-              (drop)="handleDrop($event, hour)">
-            </div>
-            <div class="second-half-hour object-half"
-              (dragover)="allowDrop($event, addHalfHour(hour))"
-              (dragleave)="handleDragLeave($event)"
-              (drop)="handleDrop($event, addHalfHour(hour))">
-            </div>
-          </div>
-        </div>
-      }
-    
-      <div class="scheduled-objects" >
-        <ng-container>
-          <ng-template
-            [ngTemplateOutlet]="customTemplate"
+                    template: `
+    <div class="wrapper">
+      @for (hour of hourLabels; track hour) {
+        <div class="time-block">
+          <div class="hour-label"><span [textContent]="hour"></span></div>
+          <div class="object-display">
+            <div class="first-half-hour object-half"
+              (dragover)="allowDrop($event, hour)"
+              (dragleave)="handleDragLeave($event)"
+              (drop)="handleDrop($event, hour)">
+            </div>
+            <div class="second-half-hour object-half"
+              (dragover)="allowDrop($event, addHalfHour(hour))"
+              (dragleave)="handleDragLeave($event)"
+              (drop)="handleDrop($event, addHalfHour(hour))">
+            </div>
+          </div>
+        </div>
+      }
+    
+      <div class="scheduled-objects" >
+        <ng-container>
+          <ng-template
+            [ngTemplateOutlet]="customTemplate"
             [ngTemplateOutletContext]="{
               objects: scheduledObjects,
               onSelectBlock: this.onSelectBlock.bind(this),
               onResizeStart: this.onResizeStart.bind(this),
+              onResizeEnd: this.onResizeEnd.bind(this),
               onDragStartCustom: this.onDragStartCustom.bind(this)
 
             }"
-            >
-            <ng-content></ng-content>
-          </ng-template>
-        </ng-container>
-      </div>
-    
-    </div>
-    
+            >
+            <ng-content></ng-content>
+          </ng-template>
+        </ng-container>
+      </div>
+    
+    </div>
+    
     `,
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     encapsulation: ViewEncapsulation.None,
@@ -19740,11 +19744,9 @@ class HourSchedulingExpandableTemplateComponent {
     showClass() {
         return true;
     }
-    onExpandableDragStart(event, obj, onDragStartCustom) {
-        event.dataTransfer.setData('text', JSON.stringify({ obj }));
-        if (onDragStartCustom) {
-            onDragStartCustom?.call(obj);
-        }
+    onExpandableDragStart(event, obj) {
+        event.dataTransfer?.setData("text", JSON.stringify(obj));
+        this.onDragStartCustom?.(obj);
     }
     calculateLeftAndWidthOfObjects() {
         const layoutData = new Array(this._objects.length);
@@ -19789,76 +19791,66 @@ class HourSchedulingExpandableTemplateComponent {
         return layoutData;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: HourSchedulingExpandableTemplateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: HourSchedulingExpandableTemplateComponent, isStandalone: false, selector: "co-hour-scheduling-expandable-template", inputs: { objectTemplate: "objectTemplate", objects: "objects", onDragStartCustom: "onDragStartCustom", onResizeStart: "onResizeStart", onSelectBlock: "onSelectBlock", startTimeProp: "startTimeProp", endTimeProp: "endTimeProp" }, host: { properties: { "class.co-hour-scheduling-expandable-template": "this.showClass" } }, ngImport: i0, template: `
-
-@for (obj of objects; track obj) {
-  <div
-    [class]="'custom-scheduled-object'"
-    [class.selected]="obj.selected"
-    [draggable]="!obj.selected"
-    [style.--height]="obj.height + 'px'"
-    [style.--top]="obj.top + 'px'"
-    [style.--left]="layouts[objects.indexOf(obj)].leftPercent + '%'"
-    [style.--width]="layouts[objects.indexOf(obj)].widthPercent + '%'"
-    (click)="onSelectBlock(obj)"
-    (dragstart)="onExpandableDragStart($event, obj, onDragStartCustom(obj) )">
-    @if (obj.selected) {
-      <div
-        class="top-resizer"
-      (mousedown)="onResizeStart($event, obj, 'top')"></div>
-    }
-    <ng-template
-      [ngTemplateOutlet]="objectTemplate"
-                  [ngTemplateOutletContext]="{
-              object: obj
-            }"
-      >
-    </ng-template>
-    @if (obj.selected) {
-      <div
-        class="bottom-resizer"
-      (mousedown)="onResizeStart($event, obj, 'bottom')"></div>
-    }
-  </div>
-}
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: HourSchedulingExpandableTemplateComponent, isStandalone: false, selector: "co-hour-scheduling-expandable-template", inputs: { objectTemplate: "objectTemplate", objects: "objects", onDragStartCustom: "onDragStartCustom", onResizeStart: "onResizeStart", onSelectBlock: "onSelectBlock", startTimeProp: "startTimeProp", endTimeProp: "endTimeProp" }, host: { properties: { "class.co-hour-scheduling-expandable-template": "this.showClass" } }, ngImport: i0, template: `
+
+        @for (obj of objects; track obj.id; let i = $index) {
+            <div
+                    class="custom-scheduled-object"
+                    [class.selected]="obj.selected"
+                    [draggable]="!obj.selected"
+                    [style.--height]="obj.height + 'px'"
+                    [style.--top]="obj.top + 'px'"
+                    [style.--left]="layouts[i]?.leftPercent + '%'"
+                    [style.--width]="layouts[i]?.widthPercent + '%'"
+                    (click)="onSelectBlock(obj)"
+                    (dragstart)="onExpandableDragStart($event, obj)">
+                @if (obj.selected) {
+                    <div class="top-resizer" (mousedown)="onResizeStart($event, obj, 'top')"></div>
+                }
+
+                <ng-template
+                        [ngTemplateOutlet]="objectTemplate"
+                        [ngTemplateOutletContext]="{object: obj}">
+                </ng-template>
+
+                @if (obj.selected) {
+                    <div class="bottom-resizer" (mousedown)="onResizeStart($event, obj, 'bottom')"></div>
+                }
+            </div>
+        }
 `, isInline: true, dependencies: [{ kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: HourSchedulingExpandableTemplateComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'co-hour-scheduling-expandable-template',
-                    template: `
-
-@for (obj of objects; track obj) {
-  <div
-    [class]="'custom-scheduled-object'"
-    [class.selected]="obj.selected"
-    [draggable]="!obj.selected"
-    [style.--height]="obj.height + 'px'"
-    [style.--top]="obj.top + 'px'"
-    [style.--left]="layouts[objects.indexOf(obj)].leftPercent + '%'"
-    [style.--width]="layouts[objects.indexOf(obj)].widthPercent + '%'"
-    (click)="onSelectBlock(obj)"
-    (dragstart)="onExpandableDragStart($event, obj, onDragStartCustom(obj) )">
-    @if (obj.selected) {
-      <div
-        class="top-resizer"
-      (mousedown)="onResizeStart($event, obj, 'top')"></div>
-    }
-    <ng-template
-      [ngTemplateOutlet]="objectTemplate"
-                  [ngTemplateOutletContext]="{
-              object: obj
-            }"
-      >
-    </ng-template>
-    @if (obj.selected) {
-      <div
-        class="bottom-resizer"
-      (mousedown)="onResizeStart($event, obj, 'bottom')"></div>
-    }
-  </div>
-}
+                    template: `
+
+        @for (obj of objects; track obj.id; let i = $index) {
+            <div
+                    class="custom-scheduled-object"
+                    [class.selected]="obj.selected"
+                    [draggable]="!obj.selected"
+                    [style.--height]="obj.height + 'px'"
+                    [style.--top]="obj.top + 'px'"
+                    [style.--left]="layouts[i]?.leftPercent + '%'"
+                    [style.--width]="layouts[i]?.widthPercent + '%'"
+                    (click)="onSelectBlock(obj)"
+                    (dragstart)="onExpandableDragStart($event, obj)">
+                @if (obj.selected) {
+                    <div class="top-resizer" (mousedown)="onResizeStart($event, obj, 'top')"></div>
+                }
+
+                <ng-template
+                        [ngTemplateOutlet]="objectTemplate"
+                        [ngTemplateOutletContext]="{object: obj}">
+                </ng-template>
+
+                @if (obj.selected) {
+                    <div class="bottom-resizer" (mousedown)="onResizeStart($event, obj, 'bottom')"></div>
+                }
+            </div>
+        }
 `,
                     encapsulation: ViewEncapsulation.None,
                     standalone: false