@meshmakers/shared-ui 3.4.1050 → 3.4.1080

package/README.md

@@ -39,7 +39,7 @@ npm run build:shared-ui
 npm run lint:shared-ui
 
 # Run tests
-npm test -- --project=@meshmakers/shared-ui --watch=false
+npm run test:shared-ui
 ```
 
 ## Architecture

package/fesm2022/meshmakers-shared-ui.mjs

@@ -124,10 +124,7 @@ class UploadFileDialogComponent extends DialogContentBase {
         if (!file) {
             return;
         }
-        console.debug("type: " + file.type);
-        console.debug("name: " + file.name);
         const extension = file.name.substring(file.name.lastIndexOf('.')).toLowerCase();
-        console.debug("extension: " + extension);
         if ((allowedFileExtensions.includes(extension) || allowedMimeTypes.includes(file.type)) ||
             allowedFileExtensions.length > 0 && allowedMimeTypes.length > 0) {
             this.selectedFile = file;
@@ -142,9 +139,9 @@ class UploadFileDialogComponent extends DialogContentBase {
             this.notificationService.show({
                 content: 'File type not supported!',
                 hideAfter: 600,
-                position: { horizontal: "right", vertical: "top" },
-                animation: { type: "fade", duration: 400 },
-                type: { style: "error", icon: true },
+                position: { horizontal: 'right', vertical: 'top' },
+                animation: { type: 'fade', duration: 400 },
+                type: { style: 'error', icon: true },
             });
         }
     }
@@ -165,8 +162,8 @@ class UploadFileDialogComponent extends DialogContentBase {
     onCancel() {
         this.dialogRef.close(null);
     }
-    upload = upload;
-    deleteIcon = deleteIcon;
+    get upload() { return upload; }
+    get deleteIcon() { return deleteIcon; }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: UploadFileDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: UploadFileDialogComponent, isStandalone: true, selector: "mm-upload-file-dialog", inputs: { message: "message", mimeTypes: "mimeTypes", fileExtensions: "fileExtensions" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div\n  class=\"file-upload-wrapper\"\n  [class.success]=\"uploadSuccess\"\n  [class.error]=\"uploadError\"\n  (drop)=\"onFileDrop($event)\"\n  (dragover)=\"onDragOver($event)\"\n>\n  <input type=\"file\" accept=\"{{fileExtensions}}\" (change)=\"onFileChange($event)\" hidden #fileInput/>\n  <div class=\"file-dropper\" (click)=\"fileInput.click()\">\n    <kendo-svgicon [icon]=\"upload\" size=\"xxxlarge\"></kendo-svgicon>\n    <p>{{ message }}</p>\n    <div *ngIf=\"fileName()\">\n      <div *ngIf=\"selectedFile\">\n        <p>\n          <span class=\"image-name\">{{ fileName() }}</span> ({{\n            fileSize()\n          }} KB)\n        </p>\n        <kendo-svgicon class=\"delete-icon\" [icon]=\"deleteIcon\" size=\"xlarge\"></kendo-svgicon>\n      </div>\n    </div>\n  </div>\n</div>\n<kendo-dialog-actions>\n  <button kendoButton (click)=\"onOk()\" [disabled]=\"!selectedFile\" themeColor=\"primary\">Upload</button>\n  <button kendoButton (click)=\"onCancel()\">Cancel</button>\n</kendo-dialog-actions>\n\n\n\n", styles: [".file-upload-wrapper{display:flex;justify-content:center;align-items:center;flex-direction:column;border:2px dashed #ccc;padding:1rem;margin-bottom:1rem;margin-left:1rem;margin-right:1rem;border-radius:10px;cursor:pointer}.file-upload-wrapper.success{border-color:green}.file-upload-wrapper.error{border-color:red}.file-dropper{display:flex;flex-direction:column;align-items:center}.image-name{font-weight:700}.image-preview{max-width:100%;height:auto;margin-bottom:.5rem;border-radius:10px}.delete-icon{cursor:pointer;color:red}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SVGIconComponent, selector: "kendo-svg-icon, kendo-svgicon", inputs: ["icon", "variant"], exportAs: ["kendoSVGIcon"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
 }
@@ -393,9 +390,9 @@ const DEFAULT_INPUT_DIALOG_MESSAGES = {
 class InputDialogComponent extends DialogContentBase {
     dialogRef;
     buttonOkText = DEFAULT_INPUT_DIALOG_MESSAGES.ok;
-    message = "";
+    message = '';
     placeholder = DEFAULT_INPUT_DIALOG_MESSAGES.placeholder;
-    inputValue = "";
+    inputValue = '';
     _messages = { ...DEFAULT_INPUT_DIALOG_MESSAGES };
     set messages(value) {
         this._messages = { ...DEFAULT_INPUT_DIALOG_MESSAGES, ...(value ?? {}) };
@@ -448,7 +445,7 @@ class InputService {
         const dialogRef = this.dialogService.open({
             title,
             content: InputDialogComponent,
-            autoFocusedElement: "input"
+            autoFocusedElement: 'input'
         });
         const component = dialogRef.content.instance;
         component.message = message;
@@ -784,7 +781,7 @@ class WindowStateService {
             height: Math.min(size.height, maxHeight)
         };
     }
-    /** Seam for tests — window.innerWidth/innerHeight are not assignable in Karma. */
+    /** Seam for tests — window.innerWidth/innerHeight are not assignable in jsdom. */
     viewportSize() {
         return { width: window.innerWidth, height: window.innerHeight };
     }
@@ -880,7 +877,9 @@ class WindowStateService {
         if (!el) {
             el = document.createElement('div');
             el.className = 'mm-window-backdrop';
-            el.style.cssText = 'position:fixed;inset:0;background:rgba(0,0,0,0.4);z-index:11499;display:none;';
+            // background-color, not the `background` shorthand: jsdom's CSSOM (cssstyle) drops the
+            // entire declaration block when the shorthand carries an rgba() value. Same rendering.
+            el.style.cssText = 'position:fixed;inset:0;background-color:rgba(0,0,0,0.4);z-index:11499;display:none;';
             document.body.appendChild(el);
         }
         return el;
@@ -1363,7 +1362,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
             type: Pipe,
             args: [{
                     standalone: true,
-                    name: "pascalCase"
+                    name: 'pascalCase'
                 }]
         }] });
 
@@ -1644,7 +1643,7 @@ class MmListViewDataBindingDirective extends DataBindingDirective {
         if (stored.filter) {
             this.filter = stored.filter;
         }
-        if (typeof stored.skip === "number") {
+        if (typeof stored.skip === 'number') {
             this.skip = stored.skip;
         }
         if (stored.textSearch) {
@@ -1662,7 +1661,7 @@ class MmListViewDataBindingDirective extends DataBindingDirective {
      */
     resetState() {
         this.sort = [];
-        this.filter = { logic: "and", filters: [] };
+        this.filter = { logic: 'and', filters: [] };
         this.skip = 0;
         this._textSearchValue = null;
         const key = this.stateKey();
@@ -1738,7 +1737,7 @@ class MmListViewDataBindingDirective extends DataBindingDirective {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: MmListViewDataBindingDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: "[mmListViewDataBinding]",
+                    selector: '[mmListViewDataBinding]',
                 }]
         }], ctorParameters: () => [] });
 
@@ -1966,8 +1965,8 @@ class ListViewComponent extends CommandBaseService {
         this._contextMenuCommandItems = commandItems;
         this._contextMenuItems = this.buildMenuItems(commandItems);
     }
-    excelExportFileName = "Export.xlsx";
-    pdfExportFileName = "Export.pdf";
+    excelExportFileName = 'Export.xlsx';
+    pdfExportFileName = 'Export.pdf';
     pageable = {
         buttonCount: 5,
         info: true,
@@ -2105,7 +2104,7 @@ class ListViewComponent extends CommandBaseService {
         this._columns = [];
         for (const column of cols) {
             if (typeof column === 'string') {
-                this._columns.push({ field: column, dataType: "text" });
+                this._columns.push({ field: column, dataType: 'text' });
             }
             else {
                 this._columns.push(column);
@@ -2570,7 +2569,7 @@ class ListViewComponent extends CommandBaseService {
         }
     }
     onCellClick(e) {
-        if (e.type === "contextmenu" && this.contextMenuType == 'contextMenu') {
+        if (e.type === 'contextmenu' && this.contextMenuType === 'contextMenu') {
             const originalEvent = e.originalEvent;
             originalEvent.preventDefault();
             this._contextMenuSelectedRow = e.dataItem;
@@ -2749,7 +2748,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
                 args: [MmListViewDataBindingDirective]
             }], gridContextMenu: [{
                 type: ViewChild,
-                args: ["gridmenu"]
+                args: ['gridmenu']
             }], rowClicked: [{
                 type: Output
             }], pageSize: [{
@@ -5894,20 +5893,28 @@ class CronBuilderComponent {
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "presetsByCategory" }] : /* istanbul ignore next */ []));
     // --- Dropdown options ---
-    secondIntervalOptions = SECOND_INTERVALS;
-    minuteIntervalOptions = MINUTE_INTERVALS;
-    hourIntervalOptions = HOUR_INTERVALS;
-    weekdayOptions = WEEKDAYS;
-    weekdayAbbreviations = WEEKDAY_ABBREVIATIONS;
-    relativeWeekOptions = RELATIVE_WEEKS;
-    hourOptions = generateHourOptions();
-    minuteOptions = generateMinuteOptions();
-    dayOfMonthOptions = generateDayOfMonthOptions();
+    get secondIntervalOptions() { return SECOND_INTERVALS; }
+    get minuteIntervalOptions() { return MINUTE_INTERVALS; }
+    get hourIntervalOptions() { return HOUR_INTERVALS; }
+    get weekdayOptions() { return WEEKDAYS; }
+    get weekdayAbbreviations() { return WEEKDAY_ABBREVIATIONS; }
+    get relativeWeekOptions() { return RELATIVE_WEEKS; }
+    hourOptions;
+    minuteOptions;
+    dayOfMonthOptions;
     // --- Tab mapping ---
     tabIndexToType = [
         'seconds', 'minutes', 'hourly', 'daily', 'weekly', 'monthly', 'custom'
     ];
     constructor() {
+        // Assigned here rather than as field initialisers: a class field initialised from a
+        // relative import reads `undefined` under the Vitest module runner, so calling the
+        // imported generator at field-init time would throw (see CLAUDE.md,
+        // "Vite/esbuild class-field snapshot"). A getter is not an option — the template reads
+        // these three every change detection cycle and would rebuild the option arrays each time.
+        this.hourOptions = generateHourOptions();
+        this.minuteOptions = generateMinuteOptions();
+        this.dayOfMonthOptions = generateDayOfMonthOptions();
         // Effect to generate expression when schedule values change
         effect(() => {
             const type = this.scheduleType();
@@ -6325,12 +6332,16 @@ class ImportStrategyDialogResult {
 class ImportStrategyDialogComponent extends DialogContentBase {
     dialogRef;
     message = '';
-    selectedStrategy = ImportStrategyDto.Upsert;
-    ImportStrategyDto = ImportStrategyDto;
+    selectedStrategy;
+    get ImportStrategyDto() { return ImportStrategyDto; }
     constructor() {
         const dialogRef = inject(DialogRef);
         super(dialogRef);
         this.dialogRef = dialogRef;
+        // Assigned here rather than as a field initialiser: a class field initialised from a
+        // relative import reads `undefined` under the Vitest module runner, so the member access
+        // would throw (see CLAUDE.md, "Vite/esbuild class-field snapshot").
+        this.selectedStrategy = ImportStrategyDto.Upsert;
     }
     onImport() {
         this.dialogRef.close(new ImportStrategyDialogResult(this.selectedStrategy));