imm-element-ui 2.8.3 → 2.8.5

package/esm2022/lib/form/form-type/imagepreview.type.mjs

@@ -0,0 +1,87 @@
+import { Component, effect, input } from '@angular/core';
+import { Image } from 'primeng/image';
+import * as i0 from "@angular/core";
+export class ImagePreviewComponent {
+    constructor() {
+        this.field = input();
+        this.props = {};
+        this.defaultBaseUrl = 'https://file.myfoodiepet.com//';
+        effect(() => {
+            this.props = this.field()?.imagePreviewProps || {};
+        });
+    }
+    imageList() {
+        const value = this.field()?.fieldControl?.value;
+        if (!value || typeof value !== 'string') {
+            return [];
+        }
+        return value
+            .split(this.props.separator || ';')
+            .map((item) => item.trim())
+            .filter(Boolean);
+    }
+    resolveSrc(image) {
+        if (/^(https?:\/\/|data:|blob:)/i.test(image)) {
+            return image;
+        }
+        return `${this.props.baseUrl ?? this.defaultBaseUrl}${image}`;
+    }
+    imageWidth() {
+        return `${this.props.width ?? 75}`;
+    }
+    imageHeight() {
+        return `${this.props.height ?? 100}`;
+    }
+    previewImageStyle() {
+        return {
+            width: this.normalizeSize(this.props.width ?? 75),
+            height: this.normalizeSize(this.props.height ?? 100),
+            objectFit: 'cover',
+            ...(this.props.imageStyle || {}),
+        };
+    }
+    normalizeSize(size) {
+        return typeof size === 'number' ? `${size}px` : size;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ImagePreviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ImagePreviewComponent, isStandalone: true, selector: "form-imagepreview", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+		@if (imageList().length > 0) {
+			<div
+				[class]="'image-preview-list ' + (props.styleClass || '')"
+				[style]="props.style">
+				@for (image of imageList(); track image) {
+					<p-image
+						[src]="resolveSrc(image)"
+						[alt]="props.alt || 'Image'"
+						[width]="imageWidth()"
+						[height]="imageHeight()"
+						[imageStyle]="previewImageStyle()"
+						appendTo="body"
+						[preview]="true" />
+				}
+			</div>
+		}
+	`, isInline: true, styles: [":host ::ng-deep .p-disabled,:host ::ng-deep .p-component:disabled{opacity:1}:host ::ng-deep .p-inputtext{border-width:0;border-radius:0;box-shadow:none;background:#fff;padding:0}:host ::ng-deep .p-inputtext:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-inputtext:not(:disabled):hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-inputtext:not(:disabled).ng-hovered{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-inputtext:focus{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .ng-hovered .p-autocomplete-input:not(.p-disabled){border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select-label{padding:0}:host ::ng-deep .p-select{border-width:0;border-radius:0;box-shadow:none;background:#fff}:host ::ng-deep .p-select .p-select-dropdown{display:none}:host ::ng-deep .p-select .p-select-clear-icon{display:none}:host ::ng-deep .p-select:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-select-open{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select-open .p-select-dropdown{display:flex}:host ::ng-deep .p-select-open .p-select-clear-icon{display:flex}:host ::ng-deep .p-select:hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select:hover .p-select-dropdown{display:flex}:host ::ng-deep .p-select:hover .p-select-clear-icon{display:flex}:host ::ng-deep .p-select.ng-hovered{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select.ng-hovered .p-select-dropdown{display:flex}:host ::ng-deep .p-select.ng-hovered .p-select-clear-icon{display:flex}:host ::ng-deep .p-multiselect-label{padding:0}:host ::ng-deep .p-multiselect{border-width:0;border-radius:0;background:#fff;box-shadow:none}:host ::ng-deep .p-multiselect .p-multiselect-dropdown{display:none}:host ::ng-deep .p-multiselect:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-multiselect-open{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect-open .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-multiselect:not(.p-disabled).p-focus{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect:not(.p-disabled).p-focus .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-multiselect:not(.p-disabled):hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect:not(.p-disabled):hover .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-multiselect:not(.p-disabled).ng-hovered{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect:not(.p-disabled).ng-hovered .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-textarea{border-radius:0;box-shadow:none;padding:0 .25rem;background:#fff;resize:none}:host ::ng-deep .p-textarea:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border:1px solid var(--p-red-500)!important}:host ::ng-deep .p-textarea:not(:disabled):hover{border:1px solid var(--p-primary-color);resize:vertical}:host ::ng-deep .p-textarea:not(:disabled).ng-hovered{border:1px solid var(--p-primary-color);resize:vertical}:host ::ng-deep .p-textarea:focus{border:1px solid var(--p-primary-color);resize:vertical}:host ::ng-deep .p-treeselect-label{padding:0}:host ::ng-deep .p-treeselect{border-width:0;border-radius:0;box-shadow:none;background:#fff}:host ::ng-deep .p-treeselect .p-treeselect-dropdown{display:none}:host ::ng-deep .ng-invalid.ng-dirty>.p-treeselect{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-treeselect-open{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-treeselect-open .p-treeselect-dropdown{display:flex}:host ::ng-deep .p-treeselect:not(.p-disabled).p-focus{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-treeselect:not(.p-disabled).p-focus .p-treeselect-dropdown{display:flex}:host ::ng-deep .p-treeselect:not(.p-disabled):hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-treeselect:not(.p-disabled):hover .p-treeselect-dropdown{display:flex}:host ::ng-deep .ng-hovered>.p-treeselect:not(.p-disabled){border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .ng-hovered>.p-treeselect:not(.p-disabled) .p-treeselect-dropdown{display:flex}:host ::ng-deep .p-menubar{border-width:0;padding:0}:host ::ng-deep .p-menubar-submenu{z-index:3}:host ::ng-deep .p-fileupload-advanced{border-width:0;border-radius:0;background-color:#fff}:host ::ng-deep .p-fileupload-header{padding:0}:host ::ng-deep .p-fileupload-content{padding:0;display:block;border-width:0}:host ::ng-deep .p-inputnumber:not(.ng-valid).ng-dirty>.p-inputtext{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-inputnumber.ng-hovered:not(.p-disabled)>.p-inputtext{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .ng-invalid.ng-dirty>.p-datepicker .p-inputtext{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .ng-hovered>.p-datepicker:not(.p-disabled) .p-inputtext{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .cm-editor{border:1px solid #cbd5e1}:host ::ng-deep .cm-editor.cm-focused{outline:none!important;border:1px solid var(--p-primary-color)}:host ::ng-deep .cm-editor:hover{border:1px solid var(--p-primary-color)}:host ::ng-deep .cm-editor.ng-hovered{border:1px solid var(--p-primary-color)}:host ::ng-deep .cm-gutters{background-color:#fff;border:\"none\"}:host ::ng-deep .cm-activeLineGutter{background-color:#fff}\n", ".image-preview-list{display:flex;flex-wrap:wrap;gap:.5rem}:is() .p-image-preview{display:inline-flex}\n"], dependencies: [{ kind: "component", type: Image, selector: "p-image", inputs: ["imageClass", "imageStyle", "styleClass", "style", "src", "srcSet", "sizes", "previewImageSrc", "previewImageSrcSet", "previewImageSizes", "alt", "width", "height", "loading", "appendTo", "preview", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide", "onImageError"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ImagePreviewComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'form-imagepreview', standalone: true, imports: [Image], template: `
+		@if (imageList().length > 0) {
+			<div
+				[class]="'image-preview-list ' + (props.styleClass || '')"
+				[style]="props.style">
+				@for (image of imageList(); track image) {
+					<p-image
+						[src]="resolveSrc(image)"
+						[alt]="props.alt || 'Image'"
+						[width]="imageWidth()"
+						[height]="imageHeight()"
+						[imageStyle]="previewImageStyle()"
+						appendTo="body"
+						[preview]="true" />
+				}
+			</div>
+		}
+	`, styles: [":host ::ng-deep .p-disabled,:host ::ng-deep .p-component:disabled{opacity:1}:host ::ng-deep .p-inputtext{border-width:0;border-radius:0;box-shadow:none;background:#fff;padding:0}:host ::ng-deep .p-inputtext:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-inputtext:not(:disabled):hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-inputtext:not(:disabled).ng-hovered{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-inputtext:focus{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .ng-hovered .p-autocomplete-input:not(.p-disabled){border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select-label{padding:0}:host ::ng-deep .p-select{border-width:0;border-radius:0;box-shadow:none;background:#fff}:host ::ng-deep .p-select .p-select-dropdown{display:none}:host ::ng-deep .p-select .p-select-clear-icon{display:none}:host ::ng-deep .p-select:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-select-open{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select-open .p-select-dropdown{display:flex}:host ::ng-deep .p-select-open .p-select-clear-icon{display:flex}:host ::ng-deep .p-select:hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select:hover .p-select-dropdown{display:flex}:host ::ng-deep .p-select:hover .p-select-clear-icon{display:flex}:host ::ng-deep .p-select.ng-hovered{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select.ng-hovered .p-select-dropdown{display:flex}:host ::ng-deep .p-select.ng-hovered .p-select-clear-icon{display:flex}:host ::ng-deep .p-multiselect-label{padding:0}:host ::ng-deep .p-multiselect{border-width:0;border-radius:0;background:#fff;box-shadow:none}:host ::ng-deep .p-multiselect .p-multiselect-dropdown{display:none}:host ::ng-deep .p-multiselect:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-multiselect-open{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect-open .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-multiselect:not(.p-disabled).p-focus{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect:not(.p-disabled).p-focus .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-multiselect:not(.p-disabled):hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect:not(.p-disabled):hover .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-multiselect:not(.p-disabled).ng-hovered{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect:not(.p-disabled).ng-hovered .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-textarea{border-radius:0;box-shadow:none;padding:0 .25rem;background:#fff;resize:none}:host ::ng-deep .p-textarea:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border:1px solid var(--p-red-500)!important}:host ::ng-deep .p-textarea:not(:disabled):hover{border:1px solid var(--p-primary-color);resize:vertical}:host ::ng-deep .p-textarea:not(:disabled).ng-hovered{border:1px solid var(--p-primary-color);resize:vertical}:host ::ng-deep .p-textarea:focus{border:1px solid var(--p-primary-color);resize:vertical}:host ::ng-deep .p-treeselect-label{padding:0}:host ::ng-deep .p-treeselect{border-width:0;border-radius:0;box-shadow:none;background:#fff}:host ::ng-deep .p-treeselect .p-treeselect-dropdown{display:none}:host ::ng-deep .ng-invalid.ng-dirty>.p-treeselect{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-treeselect-open{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-treeselect-open .p-treeselect-dropdown{display:flex}:host ::ng-deep .p-treeselect:not(.p-disabled).p-focus{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-treeselect:not(.p-disabled).p-focus .p-treeselect-dropdown{display:flex}:host ::ng-deep .p-treeselect:not(.p-disabled):hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-treeselect:not(.p-disabled):hover .p-treeselect-dropdown{display:flex}:host ::ng-deep .ng-hovered>.p-treeselect:not(.p-disabled){border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .ng-hovered>.p-treeselect:not(.p-disabled) .p-treeselect-dropdown{display:flex}:host ::ng-deep .p-menubar{border-width:0;padding:0}:host ::ng-deep .p-menubar-submenu{z-index:3}:host ::ng-deep .p-fileupload-advanced{border-width:0;border-radius:0;background-color:#fff}:host ::ng-deep .p-fileupload-header{padding:0}:host ::ng-deep .p-fileupload-content{padding:0;display:block;border-width:0}:host ::ng-deep .p-inputnumber:not(.ng-valid).ng-dirty>.p-inputtext{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-inputnumber.ng-hovered:not(.p-disabled)>.p-inputtext{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .ng-invalid.ng-dirty>.p-datepicker .p-inputtext{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .ng-hovered>.p-datepicker:not(.p-disabled) .p-inputtext{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .cm-editor{border:1px solid #cbd5e1}:host ::ng-deep .cm-editor.cm-focused{outline:none!important;border:1px solid var(--p-primary-color)}:host ::ng-deep .cm-editor:hover{border:1px solid var(--p-primary-color)}:host ::ng-deep .cm-editor.ng-hovered{border:1px solid var(--p-primary-color)}:host ::ng-deep .cm-gutters{background-color:#fff;border:\"none\"}:host ::ng-deep .cm-activeLineGutter{background-color:#fff}\n", ".image-preview-list{display:flex;flex-wrap:wrap;gap:.5rem}:is() .p-image-preview{display:inline-flex}\n"] }]
+        }], ctorParameters: () => [] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW1hZ2VwcmV2aWV3LnR5cGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9pbW0tZWxlbWVudC11aS9zcmMvbGliL2Zvcm0vZm9ybS10eXBlL2ltYWdlcHJldmlldy50eXBlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6RCxPQUFPLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQWlEdEMsTUFBTSxPQUFPLHFCQUFxQjtJQUtqQztRQUpBLFVBQUssR0FBRyxLQUFLLEVBQWEsQ0FBQztRQUMzQixVQUFLLEdBQXNCLEVBQUUsQ0FBQztRQUNiLG1CQUFjLEdBQUcsZ0NBQWdDLENBQUM7UUFHbEUsTUFBTSxDQUFDLEdBQUcsRUFBRTtZQUNYLElBQUksQ0FBQyxLQUFLLEdBQUcsSUFBSSxDQUFDLEtBQUssRUFBRSxFQUFFLGlCQUFpQixJQUFJLEVBQUUsQ0FBQztRQUNwRCxDQUFDLENBQUMsQ0FBQztJQUNKLENBQUM7SUFFRCxTQUFTO1FBQ1IsTUFBTSxLQUFLLEdBQUcsSUFBSSxDQUFDLEtBQUssRUFBRSxFQUFFLFlBQVksRUFBRSxLQUFLLENBQUM7UUFDaEQsSUFBSSxDQUFDLEtBQUssSUFBSSxPQUFPLEtBQUssS0FBSyxRQUFRLEVBQUUsQ0FBQztZQUN6QyxPQUFPLEVBQUUsQ0FBQztRQUNYLENBQUM7UUFDRCxPQUFPLEtBQUs7YUFDVixLQUFLLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxTQUFTLElBQUksR0FBRyxDQUFDO2FBQ2xDLEdBQUcsQ0FBQyxDQUFDLElBQUksRUFBRSxFQUFFLENBQUMsSUFBSSxDQUFDLElBQUksRUFBRSxDQUFDO2FBQzFCLE1BQU0sQ0FBQyxPQUFPLENBQUMsQ0FBQztJQUNuQixDQUFDO0lBRUQsVUFBVSxDQUFDLEtBQWE7UUFDdkIsSUFBSSw2QkFBNkIsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLEVBQUUsQ0FBQztZQUMvQyxPQUFPLEtBQUssQ0FBQztRQUNkLENBQUM7UUFDRCxPQUFPLEdBQUcsSUFBSSxDQUFDLEtBQUssQ0FBQyxPQUFPLElBQUksSUFBSSxDQUFDLGNBQWMsR0FBRyxLQUFLLEVBQUUsQ0FBQztJQUMvRCxDQUFDO0lBRUQsVUFBVTtRQUNULE9BQU8sR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDLEtBQUssSUFBSSxFQUFFLEVBQUUsQ0FBQztJQUNwQyxDQUFDO0lBRUQsV0FBVztRQUNWLE9BQU8sR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDLE1BQU0sSUFBSSxHQUFHLEVBQUUsQ0FBQztJQUN0QyxDQUFDO0lBRUQsaUJBQWlCO1FBQ2hCLE9BQU87WUFDTixLQUFLLEVBQUUsSUFBSSxDQUFDLGFBQWEsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLEtBQUssSUFBSSxFQUFFLENBQUM7WUFDakQsTUFBTSxFQUFFLElBQUksQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxNQUFNLElBQUksR0FBRyxDQUFDO1lBQ3BELFNBQVMsRUFBRSxPQUFPO1lBQ2xCLEdBQUcsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLFVBQVUsSUFBSSxFQUFFLENBQUM7U0FDaEMsQ0FBQztJQUNILENBQUM7SUFFTyxhQUFhLENBQUMsSUFBcUI7UUFDMUMsT0FBTyxPQUFPLElBQUksS0FBSyxRQUFRLENBQUMsQ0FBQyxDQUFDLEdBQUcsSUFBSSxJQUFJLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQztJQUN0RCxDQUFDOytHQWhEVyxxQkFBcUI7bUdBQXJCLHFCQUFxQixpTkFwQnZCOzs7Ozs7Ozs7Ozs7Ozs7OztFQWlCVCxtekxBL0JTLEtBQUs7OzRGQWtDSCxxQkFBcUI7a0JBckNqQyxTQUFTOytCQUNDLG1CQUFtQixjQUNqQixJQUFJLFdBQ1AsQ0FBQyxLQUFLLENBQUMsWUFjTjs7Ozs7Ozs7Ozs7Ozs7Ozs7RUFpQlQiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIGVmZmVjdCwgaW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEltYWdlIH0gZnJvbSAncHJpbWVuZy9pbWFnZSc7XG5pbXBvcnQgeyBGb3JtRmllbGQsIEZpZWxkUHJvcHMgfSBmcm9tICcuLi9mb3JtLWZpZWxkL2Zvcm0tZmllbGQnO1xuXG5leHBvcnQgaW50ZXJmYWNlIEltYWdlUHJldmlld1Byb3BzIGV4dGVuZHMgRmllbGRQcm9wcyB7XG5cdGJhc2VVcmw/OiBzdHJpbmc7XG5cdHNlcGFyYXRvcj86IHN0cmluZztcblx0d2lkdGg/OiBudW1iZXIgfCBzdHJpbmc7XG5cdGhlaWdodD86IG51bWJlciB8IHN0cmluZztcblx0aW1hZ2VTdHlsZT86IGFueTtcblx0YWx0Pzogc3RyaW5nO1xufVxuXG5AQ29tcG9uZW50KHtcblx0c2VsZWN0b3I6ICdmb3JtLWltYWdlcHJldmlldycsXG5cdHN0YW5kYWxvbmU6IHRydWUsXG5cdGltcG9ydHM6IFtJbWFnZV0sXG5cdHN0eWxlczogYFxuXHRcdC5pbWFnZS1wcmV2aWV3LWxpc3Qge1xuXHRcdFx0ZGlzcGxheTogZmxleDtcblx0XHRcdGZsZXgtd3JhcDogd3JhcDtcblx0XHRcdGdhcDogMC41cmVtO1xuXHRcdH1cblxuXHRcdDpob3N0IDo6bmctZGVlcCB7XG5cdFx0XHQucC1pbWFnZS1wcmV2aWV3IHtcblx0XHRcdFx0ZGlzcGxheTogaW5saW5lLWZsZXg7XG5cdFx0XHR9XG5cdFx0fVxuXHRgLFxuXHR0ZW1wbGF0ZTogYFxuXHRcdEBpZiAoaW1hZ2VMaXN0KCkubGVuZ3RoID4gMCkge1xuXHRcdFx0PGRpdlxuXHRcdFx0XHRbY2xhc3NdPVwiJ2ltYWdlLXByZXZpZXctbGlzdCAnICsgKHByb3BzLnN0eWxlQ2xhc3MgfHwgJycpXCJcblx0XHRcdFx0W3N0eWxlXT1cInByb3BzLnN0eWxlXCI+XG5cdFx0XHRcdEBmb3IgKGltYWdlIG9mIGltYWdlTGlzdCgpOyB0cmFjayBpbWFnZSkge1xuXHRcdFx0XHRcdDxwLWltYWdlXG5cdFx0XHRcdFx0XHRbc3JjXT1cInJlc29sdmVTcmMoaW1hZ2UpXCJcblx0XHRcdFx0XHRcdFthbHRdPVwicHJvcHMuYWx0IHx8ICdJbWFnZSdcIlxuXHRcdFx0XHRcdFx0W3dpZHRoXT1cImltYWdlV2lkdGgoKVwiXG5cdFx0XHRcdFx0XHRbaGVpZ2h0XT1cImltYWdlSGVpZ2h0KClcIlxuXHRcdFx0XHRcdFx0W2ltYWdlU3R5bGVdPVwicHJldmlld0ltYWdlU3R5bGUoKVwiXG5cdFx0XHRcdFx0XHRhcHBlbmRUbz1cImJvZHlcIlxuXHRcdFx0XHRcdFx0W3ByZXZpZXddPVwidHJ1ZVwiIC8+XG5cdFx0XHRcdH1cblx0XHRcdDwvZGl2PlxuXHRcdH1cblx0YCxcblx0c3R5bGVVcmw6ICcuLi8uLi9zdHlsZXMvc3R5bGVzLnNjc3MnLFxufSlcbmV4cG9ydCBjbGFzcyBJbWFnZVByZXZpZXdDb21wb25lbnQge1xuXHRmaWVsZCA9IGlucHV0PEZvcm1GaWVsZD4oKTtcblx0cHJvcHM6IEltYWdlUHJldmlld1Byb3BzID0ge307XG5cdHByaXZhdGUgcmVhZG9ubHkgZGVmYXVsdEJhc2VVcmwgPSAnaHR0cHM6Ly9maWxlLm15Zm9vZGllcGV0LmNvbS8vJztcblxuXHRjb25zdHJ1Y3RvcigpIHtcblx0XHRlZmZlY3QoKCkgPT4ge1xuXHRcdFx0dGhpcy5wcm9wcyA9IHRoaXMuZmllbGQoKT8uaW1hZ2VQcmV2aWV3UHJvcHMgfHwge307XG5cdFx0fSk7XG5cdH1cblxuXHRpbWFnZUxpc3QoKTogc3RyaW5nW10ge1xuXHRcdGNvbnN0IHZhbHVlID0gdGhpcy5maWVsZCgpPy5maWVsZENvbnRyb2w/LnZhbHVlO1xuXHRcdGlmICghdmFsdWUgfHwgdHlwZW9mIHZhbHVlICE9PSAnc3RyaW5nJykge1xuXHRcdFx0cmV0dXJuIFtdO1xuXHRcdH1cblx0XHRyZXR1cm4gdmFsdWVcblx0XHRcdC5zcGxpdCh0aGlzLnByb3BzLnNlcGFyYXRvciB8fCAnOycpXG5cdFx0XHQubWFwKChpdGVtKSA9PiBpdGVtLnRyaW0oKSlcblx0XHRcdC5maWx0ZXIoQm9vbGVhbik7XG5cdH1cblxuXHRyZXNvbHZlU3JjKGltYWdlOiBzdHJpbmcpOiBzdHJpbmcge1xuXHRcdGlmICgvXihodHRwcz86XFwvXFwvfGRhdGE6fGJsb2I6KS9pLnRlc3QoaW1hZ2UpKSB7XG5cdFx0XHRyZXR1cm4gaW1hZ2U7XG5cdFx0fVxuXHRcdHJldHVybiBgJHt0aGlzLnByb3BzLmJhc2VVcmwgPz8gdGhpcy5kZWZhdWx0QmFzZVVybH0ke2ltYWdlfWA7XG5cdH1cblxuXHRpbWFnZVdpZHRoKCk6IHN0cmluZyB7XG5cdFx0cmV0dXJuIGAke3RoaXMucHJvcHMud2lkdGggPz8gNzV9YDtcblx0fVxuXG5cdGltYWdlSGVpZ2h0KCk6IHN0cmluZyB7XG5cdFx0cmV0dXJuIGAke3RoaXMucHJvcHMuaGVpZ2h0ID8/IDEwMH1gO1xuXHR9XG5cblx0cHJldmlld0ltYWdlU3R5bGUoKTogYW55IHtcblx0XHRyZXR1cm4ge1xuXHRcdFx0d2lkdGg6IHRoaXMubm9ybWFsaXplU2l6ZSh0aGlzLnByb3BzLndpZHRoID8/IDc1KSxcblx0XHRcdGhlaWdodDogdGhpcy5ub3JtYWxpemVTaXplKHRoaXMucHJvcHMuaGVpZ2h0ID8/IDEwMCksXG5cdFx0XHRvYmplY3RGaXQ6ICdjb3ZlcicsXG5cdFx0XHQuLi4odGhpcy5wcm9wcy5pbWFnZVN0eWxlIHx8IHt9KSxcblx0XHR9O1xuXHR9XG5cblx0cHJpdmF0ZSBub3JtYWxpemVTaXplKHNpemU6IG51bWJlciB8IHN0cmluZyk6IHN0cmluZyB7XG5cdFx0cmV0dXJuIHR5cGVvZiBzaXplID09PSAnbnVtYmVyJyA/IGAke3NpemV9cHhgIDogc2l6ZTtcblx0fVxufVxuIl19

package/esm2022/lib/form/form-type/index.mjs

@@ -1,2 +1,3 @@
 export * from './codemirror.type';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9pbW0tZWxlbWVudC11aS9zcmMvbGliL2Zvcm0vZm9ybS10eXBlL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsbUJBQW1CLENBQUEiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgKiBmcm9tICcuL2NvZGVtaXJyb3IudHlwZSdcbiJdfQ==
+export * from './imagepreview.type';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9pbW0tZWxlbWVudC11aS9zcmMvbGliL2Zvcm0vZm9ybS10eXBlL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsbUJBQW1CLENBQUE7QUFDakMsY0FBYyxxQkFBcUIsQ0FBQSIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCAqIGZyb20gJy4vY29kZW1pcnJvci50eXBlJ1xuZXhwb3J0ICogZnJvbSAnLi9pbWFnZXByZXZpZXcudHlwZSdcbiJdfQ==

package/esm2022/lib/page-form/page-form.interface.mjs

@@ -10,7 +10,8 @@ export const formTypeToProps = {
     textarea: 'textAreaProps',
     upload: 'uploadProps',
     image: 'imageProps',
+    imagepreview: 'imagePreviewProps',
     codemirror: 'codeMirrorProps',
     rowselector: 'rowSelectorProps',
 };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFnZS1mb3JtLmludGVyZmFjZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2ltbS1lbGVtZW50LXVpL3NyYy9saWIvcGFnZS1mb3JtL3BhZ2UtZm9ybS5pbnRlcmZhY2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBOEhBLE1BQU0sQ0FBQyxNQUFNLGVBQWUsR0FBUTtJQUNuQyxTQUFTLEVBQUUsZ0JBQWdCO0lBQzNCLFdBQVcsRUFBRSxrQkFBa0I7SUFDL0IsTUFBTSxFQUFFLGFBQWE7SUFDckIsVUFBVSxFQUFFLGlCQUFpQjtJQUM3QixVQUFVLEVBQUUsaUJBQWlCO0lBQzdCLFlBQVksRUFBRSxtQkFBbUI7SUFDakMsV0FBVyxFQUFFLGtCQUFrQjtJQUMvQixLQUFLLEVBQUUsWUFBWTtJQUNuQixRQUFRLEVBQUUsZUFBZTtJQUN6QixNQUFNLEVBQUUsYUFBYTtJQUNyQixLQUFLLEVBQUUsWUFBWTtJQUNuQixVQUFVLEVBQUUsaUJBQWlCO0lBQzdCLFdBQVcsRUFBRSxrQkFBa0I7Q0FDL0IsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEdyaWRPcHRpb25zIH0gZnJvbSAnLi4vZ3JpZC9ncmlkL2dyaWQuY29tcG9uZW50JztcbmltcG9ydCB7IFNlYXJjaCB9IGZyb20gJy4uL2FtL2FtLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBCdXR0b24gfSBmcm9tICdwcmltZW5nL2J1dHRvbic7XG5pbXBvcnQgeyBUZW1wbGF0ZVJlZiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHR5cGUgeyBQYWdlRm9ybUNvbXBvbmVudCB9IGZyb20gJy4vcGFnZS1mb3JtLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBTYWZlQW55IH0gZnJvbSAnaW1tLWJpJztcblxuZXhwb3J0IGludGVyZmFjZSBTdWJTYXZlQ29uZmlnIHtcblx0ZW5hYmxlZD86IGJvb2xlYW47XG5cdGxhYmVsPzogc3RyaW5nO1xuXHRoaWRkZW4/OiBGdW5jdGlvbjtcblx0c2F2ZUZ1bmM/OiBhbnk7XG59XG5cbmV4cG9ydCB0eXBlIEdyaWREZWxldGVGdW5jID0gKGlkczogYW55W10sIGdyaWQ6IEdyaWRMaXN0LCBjYj86IEZ1bmN0aW9uKSA9PiB2b2lkO1xuXG5leHBvcnQgaW50ZXJmYWNlIEhyZWZCdG5MaXN0IGV4dGVuZHMgUGFydGlhbDxCdXR0b24+IHtcblx0dXJsPzogc3RyaW5nO1xuXHRpMThuS2V5Pzogc3RyaW5nO1xuXHRpZEtleT86IHN0cmluZztcbn1cblxuZXhwb3J0IGludGVyZmFjZSBQZXJtaXNzaW9uQnRuIGV4dGVuZHMgUGFydGlhbDxCdXR0b24+IHtcblx0YXV0aDogbnVtYmVyO1xuXHRvbkNsaWNrPzogYW55O1xuXHRidG5EaXNhYmxlZD86IEZ1bmN0aW9uO1xuXHRidG5IaWRkZW4/OiBGdW5jdGlvbjtcblx0aTE4bktleT86IHN0cmluZztcbn1cblxuZXhwb3J0IGludGVyZmFjZSBHcmlkTGlzdCB7XG5cdGdyaWRPcHRpb25zOiBHcmlkT3B0aW9ucztcblx0c3ViVGFibGU6IHN0cmluZztcblx0c3ViVGFibGVTb3VyY2U/OiAnaGFuZGxlJyB8ICdzZWxlY3QnO1xuXHRzZWxlY3RPcHRpb25zPzogR3JpZE9wdGlvbnM7XG5cdHN1YkRhdGFLZXk6IHN0cmluZztcblx0c2xvdEtleT86IHN0cmluZztcblx0dGl0bGU/OiBzdHJpbmc7XG5cdGkxOG5LZXk/OiBzdHJpbmc7XG5cdHNlbGVjdERhdGFDYj86IEZ1bmN0aW9uO1xuXHRzZWFyY2hQcm0/OiBTZWFyY2g7XG5cdGRlbGV0ZUZ1bmM/OiBHcmlkRGVsZXRlRnVuYztcblx0ZGVsZXRlSGlkZGVuPzogRnVuY3Rpb247XG5cdGFkZEhpZGRlbj86IEZ1bmN0aW9uO1xuXHRzZWxlY3REYXRhPzogYW55W107XG5cdHVuaXF1ZUZpZWxkPzogc3RyaW5nO1xuXHRzdWJTYXZlPzogU3ViU2F2ZUNvbmZpZztcblx0W3Byb3BOYW1lOnN0cmluZ106YW55LFxuXHR0eXBlPzpzdHJpbmdcbn1cblxuZXhwb3J0IGludGVyZmFjZSBDdXN0b21MaXN0RGlhbG9nIHtcblx0Z2V0UmVzdWx0KCk6IGFueVtdO1xufVxuXG5leHBvcnQgaW50ZXJmYWNlIEN1c3RvbUxpc3RGb3JtVGVtcGxhdGVDb250ZXh0IHtcblx0cGFnZUZvcm06IFBhZ2VGb3JtQ29tcG9uZW50O1xufVxuXG5leHBvcnQgaW50ZXJmYWNlIFBhZ2VGb3JtU2xvdENvbnRleHQge1xuXHQkaW1wbGljaXQ6IFBhZ2VGb3JtU2xvdENvbnRleHQ7XG5cdHNsb3RLZXk6IHN0cmluZztcblx0Z3JpZDogR3JpZExpc3Q7XG5cdGluZGV4OiBudW1iZXI7XG5cdHBhZ2VGb3JtOiBQYWdlRm9ybUNvbXBvbmVudDtcblx0ZGF0YTogUmVjb3JkPHN0cmluZywgdW5rbm93bj47XG5cdG1vZGVsOiB1bmtub3duO1xuXHR1cHNlcnQ6IHVua25vd247XG5cdGFjdGl2ZTogYm9vbGVhbjtcblx0Z3JpZERpc2FibGU6Ym9vbGVhblxufVxuXG5leHBvcnQgaW50ZXJmYWNlIFBhZ2VMZWZ0UGFuZWxEYXRhU291cmNlIHtcblx0bG9hZGVyPzogKChjb250ZXh0PzogYW55KSA9PiBhbnkpIHwgYW55O1xuXHRyZXF1ZXN0PzogUmVjb3JkPHN0cmluZywgYW55Pjtcblx0cmVzdWx0UGF0aD86IHN0cmluZztcblx0dHJhbnNmb3JtPzogKChpdGVtczogYW55LCBjb250ZXh0PzogYW55KSA9PiBhbnlbXSkgfCBhbnk7XG5cdGRlZmF1bHRTZWxlY3Q/OiAoKGNvbnRleHQ/OiBhbnkpID0+IGFueSkgfCBhbnk7XG5cdG9wdGlvbnM/OiBhbnlbXTtcbn1cblxuZXhwb3J0IGludGVyZmFjZSBQYWdlTGVmdFBhbmVsRXZlbnRzIHtcblx0b25Jbml0PzogKGNvbnRleHQ/OiBhbnkpID0+IGFueTtcblx0b25JdGVtc0xvYWRlZD86IChjb250ZXh0PzogYW55KSA9PiBhbnk7XG5cdG9uU2VsZWN0aW9uQ2hhbmdlPzogKGNvbnRleHQ/OiBhbnkpID0+IGFueTtcblx0b25EZXRhaWxNZXJnZT86IChjb250ZXh0PzogYW55KSA9PiBhbnk7XG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgUGFnZUxlZnRQYW5lbExpc3RDb25maWcge1xuXHRvcHRpb25MYWJlbD86IHN0cmluZztcblx0b3B0aW9uVmFsdWU/OiBzdHJpbmc7XG5cdGFsbG93RGVzZWxlY3Q/OiBib29sZWFuO1xuXHRlbXB0eU1lc3NhZ2U/OiBzdHJpbmc7XG5cdGRhdGFTb3VyY2U/OiBQYWdlTGVmdFBhbmVsRGF0YVNvdXJjZTtcbn1cblxuZXhwb3J0IGludGVyZmFjZSBQYWdlTGVmdFBhbmVsVHJlZUNvbmZpZyB7XG5cdG5vZGVMYWJlbD86IHN0cmluZztcblx0bm9kZVZhbHVlPzogc3RyaW5nO1xuXHRjaGlsZHJlbkZpZWxkPzogc3RyaW5nO1xuXHRkZWZhdWx0RXhwYW5kPzogYm9vbGVhbjtcblx0ZXhwYW5kZWRLZXlzU3RhdGVLZXk/OiBzdHJpbmc7XG5cdGljb25GaWVsZD86IHN0cmluZztcblx0bGVhZkZpZWxkPzogc3RyaW5nO1xuXHRkaXNhYmxlZEZpZWxkPzogc3RyaW5nO1xuXHRwYXJlbnRTZWxlY3RhYmxlPzogYm9vbGVhbjtcblx0ZW1wdHlNZXNzYWdlPzogc3RyaW5nO1xuXHRkYXRhU291cmNlPzogUGFnZUxlZnRQYW5lbERhdGFTb3VyY2U7XG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgUGFnZUxlZnRQYW5lbENvbmZpZyB7XG5cdGVuYWJsZWQ/OiBib29sZWFuO1xuXHRtb2RlPzogJ2xpc3QnIHwgJ3RyZWUnO1xuXHRzdGF0ZUtleT86IHN0cmluZztcblx0cGFuZWxTZWxlY3RlZERhdGFLZXk/OiBzdHJpbmc7XG5cdG9wdGlvbkxhYmVsPzogc3RyaW5nO1xuXHRvcHRpb25WYWx1ZT86IHN0cmluZztcblx0YWxsb3dEZXNlbGVjdD86IGJvb2xlYW47XG5cdGVtcHR5TWVzc2FnZT86IHN0cmluZztcblx0ZGF0YVNvdXJjZT86IFBhZ2VMZWZ0UGFuZWxEYXRhU291cmNlO1xuXHRhcHBlbmRHcm91cHM/OiBhbnlbXSB8ICgoY29udGV4dD86IGFueSkgPT4gYW55W10pO1xuXHRsaXN0PzogUGFnZUxlZnRQYW5lbExpc3RDb25maWc7XG5cdHRyZWU/OiBQYWdlTGVmdFBhbmVsVHJlZUNvbmZpZztcblx0ZXZlbnRzPzogUGFnZUxlZnRQYW5lbEV2ZW50cztcbn1cblxuZXhwb3J0IGNvbnN0IGZvcm1UeXBlVG9Qcm9wczogYW55ID0ge1xuXHRpbnB1dHRleHQ6ICdpbnB1dFRleHRQcm9wcycsXG5cdGlucHV0bnVtYmVyOiAnaW5wdXROdW1iZXJQcm9wcycsXG5cdHNlbGVjdDogJ3NlbGVjdFByb3BzJyxcblx0dHJlZXNlbGVjdDogJ3RyZWVTZWxlY3RQcm9wcycsXG5cdGRhdGVwaWNrZXI6ICdkYXRlUGlja2VyUHJvcHMnLFxuXHRhdXRvY29tcGxldGU6ICdhdXRvQ29tcGxldGVQcm9wcycsXG5cdG11bHRpc2VsZWN0OiAnbXVsdGlTZWxlY3RQcm9wcycsXG5cdHJhZGlvOiAncmFkaW9Qcm9wcycsXG5cdHRleHRhcmVhOiAndGV4dEFyZWFQcm9wcycsXG5cdHVwbG9hZDogJ3VwbG9hZFByb3BzJyxcblx0aW1hZ2U6ICdpbWFnZVByb3BzJyxcblx0Y29kZW1pcnJvcjogJ2NvZGVNaXJyb3JQcm9wcycsXG5cdHJvd3NlbGVjdG9yOiAncm93U2VsZWN0b3JQcm9wcycsXG59O1xuXG5leHBvcnQgaW50ZXJmYWNlIFBhZ2VGb3JtU2xvdCB7XG5cdGhhbmRsZUFkZDogKGFjdGlvbj86IHVua25vd24pID0+IHZvaWQ7XG5cdGhhbmRsZVJlbW92ZTogKGFjdGlvbj86IHVua25vd24pID0+IHZvaWQ7XG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgUGF5bG9hZFVwc2VydCB7XG5cdGFjdGlvbjonYWRkJ3wnZWRpdCd8J2RlbGV0ZSc7XG5cdGZpZWxkOiBzdHJpbmc7XG5cdGhlYWRlck5hbWU6c3RyaW5nO1xuXHRuZXdWYWx1ZTogU2FmZUFueTtcblx0b2xkVmFsdWU6IFNhZmVBbnk7XG5cdHJlY29yZEluZGV4OiBudW1iZXI7XG5cdGluZGV4Om51bWJlcjtcblx0ZGF0YTogUmVjb3JkPHN0cmluZywgU2FmZUFueT47XG5cdHNlbGVjdE5hbWU/OnN0cmluZ3x1bmRlZmluZWRcbn1cbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFnZS1mb3JtLmludGVyZmFjZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2ltbS1lbGVtZW50LXVpL3NyYy9saWIvcGFnZS1mb3JtL3BhZ2UtZm9ybS5pbnRlcmZhY2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBOEhBLE1BQU0sQ0FBQyxNQUFNLGVBQWUsR0FBUTtJQUNuQyxTQUFTLEVBQUUsZ0JBQWdCO0lBQzNCLFdBQVcsRUFBRSxrQkFBa0I7SUFDL0IsTUFBTSxFQUFFLGFBQWE7SUFDckIsVUFBVSxFQUFFLGlCQUFpQjtJQUM3QixVQUFVLEVBQUUsaUJBQWlCO0lBQzdCLFlBQVksRUFBRSxtQkFBbUI7SUFDakMsV0FBVyxFQUFFLGtCQUFrQjtJQUMvQixLQUFLLEVBQUUsWUFBWTtJQUNuQixRQUFRLEVBQUUsZUFBZTtJQUN6QixNQUFNLEVBQUUsYUFBYTtJQUNyQixLQUFLLEVBQUUsWUFBWTtJQUNuQixZQUFZLEVBQUUsbUJBQW1CO0lBQ2pDLFVBQVUsRUFBRSxpQkFBaUI7SUFDN0IsV0FBVyxFQUFFLGtCQUFrQjtDQUMvQixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgR3JpZE9wdGlvbnMgfSBmcm9tICcuLi9ncmlkL2dyaWQvZ3JpZC5jb21wb25lbnQnO1xuaW1wb3J0IHsgU2VhcmNoIH0gZnJvbSAnLi4vYW0vYW0uY29tcG9uZW50JztcbmltcG9ydCB7IEJ1dHRvbiB9IGZyb20gJ3ByaW1lbmcvYnV0dG9uJztcbmltcG9ydCB7IFRlbXBsYXRlUmVmIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgdHlwZSB7IFBhZ2VGb3JtQ29tcG9uZW50IH0gZnJvbSAnLi9wYWdlLWZvcm0uY29tcG9uZW50JztcbmltcG9ydCB7IFNhZmVBbnkgfSBmcm9tICdpbW0tYmknO1xuXG5leHBvcnQgaW50ZXJmYWNlIFN1YlNhdmVDb25maWcge1xuXHRlbmFibGVkPzogYm9vbGVhbjtcblx0bGFiZWw/OiBzdHJpbmc7XG5cdGhpZGRlbj86IEZ1bmN0aW9uO1xuXHRzYXZlRnVuYz86IGFueTtcbn1cblxuZXhwb3J0IHR5cGUgR3JpZERlbGV0ZUZ1bmMgPSAoaWRzOiBhbnlbXSwgZ3JpZDogR3JpZExpc3QsIGNiPzogRnVuY3Rpb24pID0+IHZvaWQ7XG5cbmV4cG9ydCBpbnRlcmZhY2UgSHJlZkJ0bkxpc3QgZXh0ZW5kcyBQYXJ0aWFsPEJ1dHRvbj4ge1xuXHR1cmw/OiBzdHJpbmc7XG5cdGkxOG5LZXk/OiBzdHJpbmc7XG5cdGlkS2V5Pzogc3RyaW5nO1xufVxuXG5leHBvcnQgaW50ZXJmYWNlIFBlcm1pc3Npb25CdG4gZXh0ZW5kcyBQYXJ0aWFsPEJ1dHRvbj4ge1xuXHRhdXRoOiBudW1iZXI7XG5cdG9uQ2xpY2s/OiBhbnk7XG5cdGJ0bkRpc2FibGVkPzogRnVuY3Rpb247XG5cdGJ0bkhpZGRlbj86IEZ1bmN0aW9uO1xuXHRpMThuS2V5Pzogc3RyaW5nO1xufVxuXG5leHBvcnQgaW50ZXJmYWNlIEdyaWRMaXN0IHtcblx0Z3JpZE9wdGlvbnM6IEdyaWRPcHRpb25zO1xuXHRzdWJUYWJsZTogc3RyaW5nO1xuXHRzdWJUYWJsZVNvdXJjZT86ICdoYW5kbGUnIHwgJ3NlbGVjdCc7XG5cdHNlbGVjdE9wdGlvbnM/OiBHcmlkT3B0aW9ucztcblx0c3ViRGF0YUtleTogc3RyaW5nO1xuXHRzbG90S2V5Pzogc3RyaW5nO1xuXHR0aXRsZT86IHN0cmluZztcblx0aTE4bktleT86IHN0cmluZztcblx0c2VsZWN0RGF0YUNiPzogRnVuY3Rpb247XG5cdHNlYXJjaFBybT86IFNlYXJjaDtcblx0ZGVsZXRlRnVuYz86IEdyaWREZWxldGVGdW5jO1xuXHRkZWxldGVIaWRkZW4/OiBGdW5jdGlvbjtcblx0YWRkSGlkZGVuPzogRnVuY3Rpb247XG5cdHNlbGVjdERhdGE/OiBhbnlbXTtcblx0dW5pcXVlRmllbGQ/OiBzdHJpbmc7XG5cdHN1YlNhdmU/OiBTdWJTYXZlQ29uZmlnO1xuXHRbcHJvcE5hbWU6c3RyaW5nXTphbnksXG5cdHR5cGU/OnN0cmluZ1xufVxuXG5leHBvcnQgaW50ZXJmYWNlIEN1c3RvbUxpc3REaWFsb2cge1xuXHRnZXRSZXN1bHQoKTogYW55W107XG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgQ3VzdG9tTGlzdEZvcm1UZW1wbGF0ZUNvbnRleHQge1xuXHRwYWdlRm9ybTogUGFnZUZvcm1Db21wb25lbnQ7XG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgUGFnZUZvcm1TbG90Q29udGV4dCB7XG5cdCRpbXBsaWNpdDogUGFnZUZvcm1TbG90Q29udGV4dDtcblx0c2xvdEtleTogc3RyaW5nO1xuXHRncmlkOiBHcmlkTGlzdDtcblx0aW5kZXg6IG51bWJlcjtcblx0cGFnZUZvcm06IFBhZ2VGb3JtQ29tcG9uZW50O1xuXHRkYXRhOiBSZWNvcmQ8c3RyaW5nLCB1bmtub3duPjtcblx0bW9kZWw6IHVua25vd247XG5cdHVwc2VydDogdW5rbm93bjtcblx0YWN0aXZlOiBib29sZWFuO1xuXHRncmlkRGlzYWJsZTpib29sZWFuXG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgUGFnZUxlZnRQYW5lbERhdGFTb3VyY2Uge1xuXHRsb2FkZXI/OiAoKGNvbnRleHQ/OiBhbnkpID0+IGFueSkgfCBhbnk7XG5cdHJlcXVlc3Q/OiBSZWNvcmQ8c3RyaW5nLCBhbnk+O1xuXHRyZXN1bHRQYXRoPzogc3RyaW5nO1xuXHR0cmFuc2Zvcm0/OiAoKGl0ZW1zOiBhbnksIGNvbnRleHQ/OiBhbnkpID0+IGFueVtdKSB8IGFueTtcblx0ZGVmYXVsdFNlbGVjdD86ICgoY29udGV4dD86IGFueSkgPT4gYW55KSB8IGFueTtcblx0b3B0aW9ucz86IGFueVtdO1xufVxuXG5leHBvcnQgaW50ZXJmYWNlIFBhZ2VMZWZ0UGFuZWxFdmVudHMge1xuXHRvbkluaXQ/OiAoY29udGV4dD86IGFueSkgPT4gYW55O1xuXHRvbkl0ZW1zTG9hZGVkPzogKGNvbnRleHQ/OiBhbnkpID0+IGFueTtcblx0b25TZWxlY3Rpb25DaGFuZ2U/OiAoY29udGV4dD86IGFueSkgPT4gYW55O1xuXHRvbkRldGFpbE1lcmdlPzogKGNvbnRleHQ/OiBhbnkpID0+IGFueTtcbn1cblxuZXhwb3J0IGludGVyZmFjZSBQYWdlTGVmdFBhbmVsTGlzdENvbmZpZyB7XG5cdG9wdGlvbkxhYmVsPzogc3RyaW5nO1xuXHRvcHRpb25WYWx1ZT86IHN0cmluZztcblx0YWxsb3dEZXNlbGVjdD86IGJvb2xlYW47XG5cdGVtcHR5TWVzc2FnZT86IHN0cmluZztcblx0ZGF0YVNvdXJjZT86IFBhZ2VMZWZ0UGFuZWxEYXRhU291cmNlO1xufVxuXG5leHBvcnQgaW50ZXJmYWNlIFBhZ2VMZWZ0UGFuZWxUcmVlQ29uZmlnIHtcblx0bm9kZUxhYmVsPzogc3RyaW5nO1xuXHRub2RlVmFsdWU/OiBzdHJpbmc7XG5cdGNoaWxkcmVuRmllbGQ/OiBzdHJpbmc7XG5cdGRlZmF1bHRFeHBhbmQ/OiBib29sZWFuO1xuXHRleHBhbmRlZEtleXNTdGF0ZUtleT86IHN0cmluZztcblx0aWNvbkZpZWxkPzogc3RyaW5nO1xuXHRsZWFmRmllbGQ/OiBzdHJpbmc7XG5cdGRpc2FibGVkRmllbGQ/OiBzdHJpbmc7XG5cdHBhcmVudFNlbGVjdGFibGU/OiBib29sZWFuO1xuXHRlbXB0eU1lc3NhZ2U/OiBzdHJpbmc7XG5cdGRhdGFTb3VyY2U/OiBQYWdlTGVmdFBhbmVsRGF0YVNvdXJjZTtcbn1cblxuZXhwb3J0IGludGVyZmFjZSBQYWdlTGVmdFBhbmVsQ29uZmlnIHtcblx0ZW5hYmxlZD86IGJvb2xlYW47XG5cdG1vZGU/OiAnbGlzdCcgfCAndHJlZSc7XG5cdHN0YXRlS2V5Pzogc3RyaW5nO1xuXHRwYW5lbFNlbGVjdGVkRGF0YUtleT86IHN0cmluZztcblx0b3B0aW9uTGFiZWw/OiBzdHJpbmc7XG5cdG9wdGlvblZhbHVlPzogc3RyaW5nO1xuXHRhbGxvd0Rlc2VsZWN0PzogYm9vbGVhbjtcblx0ZW1wdHlNZXNzYWdlPzogc3RyaW5nO1xuXHRkYXRhU291cmNlPzogUGFnZUxlZnRQYW5lbERhdGFTb3VyY2U7XG5cdGFwcGVuZEdyb3Vwcz86IGFueVtdIHwgKChjb250ZXh0PzogYW55KSA9PiBhbnlbXSk7XG5cdGxpc3Q/OiBQYWdlTGVmdFBhbmVsTGlzdENvbmZpZztcblx0dHJlZT86IFBhZ2VMZWZ0UGFuZWxUcmVlQ29uZmlnO1xuXHRldmVudHM/OiBQYWdlTGVmdFBhbmVsRXZlbnRzO1xufVxuXG5leHBvcnQgY29uc3QgZm9ybVR5cGVUb1Byb3BzOiBhbnkgPSB7XG5cdGlucHV0dGV4dDogJ2lucHV0VGV4dFByb3BzJyxcblx0aW5wdXRudW1iZXI6ICdpbnB1dE51bWJlclByb3BzJyxcblx0c2VsZWN0OiAnc2VsZWN0UHJvcHMnLFxuXHR0cmVlc2VsZWN0OiAndHJlZVNlbGVjdFByb3BzJyxcblx0ZGF0ZXBpY2tlcjogJ2RhdGVQaWNrZXJQcm9wcycsXG5cdGF1dG9jb21wbGV0ZTogJ2F1dG9Db21wbGV0ZVByb3BzJyxcblx0bXVsdGlzZWxlY3Q6ICdtdWx0aVNlbGVjdFByb3BzJyxcblx0cmFkaW86ICdyYWRpb1Byb3BzJyxcblx0dGV4dGFyZWE6ICd0ZXh0QXJlYVByb3BzJyxcblx0dXBsb2FkOiAndXBsb2FkUHJvcHMnLFxuXHRpbWFnZTogJ2ltYWdlUHJvcHMnLFxuXHRpbWFnZXByZXZpZXc6ICdpbWFnZVByZXZpZXdQcm9wcycsXG5cdGNvZGVtaXJyb3I6ICdjb2RlTWlycm9yUHJvcHMnLFxuXHRyb3dzZWxlY3RvcjogJ3Jvd1NlbGVjdG9yUHJvcHMnLFxufTtcblxuZXhwb3J0IGludGVyZmFjZSBQYWdlRm9ybVNsb3Qge1xuXHRoYW5kbGVBZGQ6IChhY3Rpb24/OiB1bmtub3duKSA9PiB2b2lkO1xuXHRoYW5kbGVSZW1vdmU6IChhY3Rpb24/OiB1bmtub3duKSA9PiB2b2lkO1xufVxuXG5leHBvcnQgaW50ZXJmYWNlIFBheWxvYWRVcHNlcnQge1xuXHRhY3Rpb246J2FkZCd8J2VkaXQnfCdkZWxldGUnO1xuXHRmaWVsZDogc3RyaW5nO1xuXHRoZWFkZXJOYW1lOnN0cmluZztcblx0bmV3VmFsdWU6IFNhZmVBbnk7XG5cdG9sZFZhbHVlOiBTYWZlQW55O1xuXHRyZWNvcmRJbmRleDogbnVtYmVyO1xuXHRpbmRleDpudW1iZXI7XG5cdGRhdGE6IFJlY29yZDxzdHJpbmcsIFNhZmVBbnk+O1xuXHRzZWxlY3ROYW1lPzpzdHJpbmd8dW5kZWZpbmVkXG59XG4iXX0=

package/fesm2022/imm-element-ui.mjs

@@ -1368,6 +1368,9 @@ const _fieldUtils = {
             case 'image':
                 props = field.imageProps;
                 break;
+            case 'imagepreview':
+                props = field.imagePreviewProps;
+                break;
             case 'codemirror':
                 props = field.codeMirrorProps;
                 break;
@@ -1509,7 +1512,7 @@ const _fieldUtils = {
         if (field.type == 'upload') {
             return _fieldUtils.toUploadValue(field, raw);
         }
-        return raw || '';
+        return raw ?? '';
     },
     toTreeSelectValue: (field, raw) => {
         if (field.treeSelectProps?.selectionMode == 'single') {
@@ -4631,6 +4634,90 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 args: ['imageComp', { read: ElementRef, static: false }]
             }] } });
 
+class ImagePreviewComponent {
+    constructor() {
+        this.field = input();
+        this.props = {};
+        this.defaultBaseUrl = 'https://file.myfoodiepet.com//';
+        effect(() => {
+            this.props = this.field()?.imagePreviewProps || {};
+        });
+    }
+    imageList() {
+        const value = this.field()?.fieldControl?.value;
+        if (!value || typeof value !== 'string') {
+            return [];
+        }
+        return value
+            .split(this.props.separator || ';')
+            .map((item) => item.trim())
+            .filter(Boolean);
+    }
+    resolveSrc(image) {
+        if (/^(https?:\/\/|data:|blob:)/i.test(image)) {
+            return image;
+        }
+        return `${this.props.baseUrl ?? this.defaultBaseUrl}${image}`;
+    }
+    imageWidth() {
+        return `${this.props.width ?? 75}`;
+    }
+    imageHeight() {
+        return `${this.props.height ?? 100}`;
+    }
+    previewImageStyle() {
+        return {
+            width: this.normalizeSize(this.props.width ?? 75),
+            height: this.normalizeSize(this.props.height ?? 100),
+            objectFit: 'cover',
+            ...(this.props.imageStyle || {}),
+        };
+    }
+    normalizeSize(size) {
+        return typeof size === 'number' ? `${size}px` : size;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ImagePreviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ImagePreviewComponent, isStandalone: true, selector: "form-imagepreview", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+		@if (imageList().length > 0) {
+			<div
+				[class]="'image-preview-list ' + (props.styleClass || '')"
+				[style]="props.style">
+				@for (image of imageList(); track image) {
+					<p-image
+						[src]="resolveSrc(image)"
+						[alt]="props.alt || 'Image'"
+						[width]="imageWidth()"
+						[height]="imageHeight()"
+						[imageStyle]="previewImageStyle()"
+						appendTo="body"
+						[preview]="true" />
+				}
+			</div>
+		}
+	`, isInline: true, styles: [":host ::ng-deep .p-disabled,:host ::ng-deep .p-component:disabled{opacity:1}:host ::ng-deep .p-inputtext{border-width:0;border-radius:0;box-shadow:none;background:#fff;padding:0}:host ::ng-deep .p-inputtext:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-inputtext:not(:disabled):hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-inputtext:not(:disabled).ng-hovered{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-inputtext:focus{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .ng-hovered .p-autocomplete-input:not(.p-disabled){border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select-label{padding:0}:host ::ng-deep .p-select{border-width:0;border-radius:0;box-shadow:none;background:#fff}:host ::ng-deep .p-select .p-select-dropdown{display:none}:host ::ng-deep .p-select .p-select-clear-icon{display:none}:host ::ng-deep .p-select:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-select-open{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select-open .p-select-dropdown{display:flex}:host ::ng-deep .p-select-open .p-select-clear-icon{display:flex}:host ::ng-deep .p-select:hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select:hover .p-select-dropdown{display:flex}:host ::ng-deep .p-select:hover .p-select-clear-icon{display:flex}:host ::ng-deep .p-select.ng-hovered{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select.ng-hovered .p-select-dropdown{display:flex}:host ::ng-deep .p-select.ng-hovered .p-select-clear-icon{display:flex}:host ::ng-deep .p-multiselect-label{padding:0}:host ::ng-deep .p-multiselect{border-width:0;border-radius:0;background:#fff;box-shadow:none}:host ::ng-deep .p-multiselect .p-multiselect-dropdown{display:none}:host ::ng-deep .p-multiselect:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-multiselect-open{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect-open .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-multiselect:not(.p-disabled).p-focus{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect:not(.p-disabled).p-focus .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-multiselect:not(.p-disabled):hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect:not(.p-disabled):hover .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-multiselect:not(.p-disabled).ng-hovered{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect:not(.p-disabled).ng-hovered .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-textarea{border-radius:0;box-shadow:none;padding:0 .25rem;background:#fff;resize:none}:host ::ng-deep .p-textarea:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border:1px solid var(--p-red-500)!important}:host ::ng-deep .p-textarea:not(:disabled):hover{border:1px solid var(--p-primary-color);resize:vertical}:host ::ng-deep .p-textarea:not(:disabled).ng-hovered{border:1px solid var(--p-primary-color);resize:vertical}:host ::ng-deep .p-textarea:focus{border:1px solid var(--p-primary-color);resize:vertical}:host ::ng-deep .p-treeselect-label{padding:0}:host ::ng-deep .p-treeselect{border-width:0;border-radius:0;box-shadow:none;background:#fff}:host ::ng-deep .p-treeselect .p-treeselect-dropdown{display:none}:host ::ng-deep .ng-invalid.ng-dirty>.p-treeselect{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-treeselect-open{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-treeselect-open .p-treeselect-dropdown{display:flex}:host ::ng-deep .p-treeselect:not(.p-disabled).p-focus{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-treeselect:not(.p-disabled).p-focus .p-treeselect-dropdown{display:flex}:host ::ng-deep .p-treeselect:not(.p-disabled):hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-treeselect:not(.p-disabled):hover .p-treeselect-dropdown{display:flex}:host ::ng-deep .ng-hovered>.p-treeselect:not(.p-disabled){border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .ng-hovered>.p-treeselect:not(.p-disabled) .p-treeselect-dropdown{display:flex}:host ::ng-deep .p-menubar{border-width:0;padding:0}:host ::ng-deep .p-menubar-submenu{z-index:3}:host ::ng-deep .p-fileupload-advanced{border-width:0;border-radius:0;background-color:#fff}:host ::ng-deep .p-fileupload-header{padding:0}:host ::ng-deep .p-fileupload-content{padding:0;display:block;border-width:0}:host ::ng-deep .p-inputnumber:not(.ng-valid).ng-dirty>.p-inputtext{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-inputnumber.ng-hovered:not(.p-disabled)>.p-inputtext{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .ng-invalid.ng-dirty>.p-datepicker .p-inputtext{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .ng-hovered>.p-datepicker:not(.p-disabled) .p-inputtext{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .cm-editor{border:1px solid #cbd5e1}:host ::ng-deep .cm-editor.cm-focused{outline:none!important;border:1px solid var(--p-primary-color)}:host ::ng-deep .cm-editor:hover{border:1px solid var(--p-primary-color)}:host ::ng-deep .cm-editor.ng-hovered{border:1px solid var(--p-primary-color)}:host ::ng-deep .cm-gutters{background-color:#fff;border:\"none\"}:host ::ng-deep .cm-activeLineGutter{background-color:#fff}\n", ".image-preview-list{display:flex;flex-wrap:wrap;gap:.5rem}:is() .p-image-preview{display:inline-flex}\n"], dependencies: [{ kind: "component", type: Image, selector: "p-image", inputs: ["imageClass", "imageStyle", "styleClass", "style", "src", "srcSet", "sizes", "previewImageSrc", "previewImageSrcSet", "previewImageSizes", "alt", "width", "height", "loading", "appendTo", "preview", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide", "onImageError"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ImagePreviewComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'form-imagepreview', standalone: true, imports: [Image], template: `
+		@if (imageList().length > 0) {
+			<div
+				[class]="'image-preview-list ' + (props.styleClass || '')"
+				[style]="props.style">
+				@for (image of imageList(); track image) {
+					<p-image
+						[src]="resolveSrc(image)"
+						[alt]="props.alt || 'Image'"
+						[width]="imageWidth()"
+						[height]="imageHeight()"
+						[imageStyle]="previewImageStyle()"
+						appendTo="body"
+						[preview]="true" />
+				}
+			</div>
+		}
+	`, styles: [":host ::ng-deep .p-disabled,:host ::ng-deep .p-component:disabled{opacity:1}:host ::ng-deep .p-inputtext{border-width:0;border-radius:0;box-shadow:none;background:#fff;padding:0}:host ::ng-deep .p-inputtext:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-inputtext:not(:disabled):hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-inputtext:not(:disabled).ng-hovered{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-inputtext:focus{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .ng-hovered .p-autocomplete-input:not(.p-disabled){border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select-label{padding:0}:host ::ng-deep .p-select{border-width:0;border-radius:0;box-shadow:none;background:#fff}:host ::ng-deep .p-select .p-select-dropdown{display:none}:host ::ng-deep .p-select .p-select-clear-icon{display:none}:host ::ng-deep .p-select:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-select-open{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select-open .p-select-dropdown{display:flex}:host ::ng-deep .p-select-open .p-select-clear-icon{display:flex}:host ::ng-deep .p-select:hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select:hover .p-select-dropdown{display:flex}:host ::ng-deep .p-select:hover .p-select-clear-icon{display:flex}:host ::ng-deep .p-select.ng-hovered{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select.ng-hovered .p-select-dropdown{display:flex}:host ::ng-deep .p-select.ng-hovered .p-select-clear-icon{display:flex}:host ::ng-deep .p-multiselect-label{padding:0}:host ::ng-deep .p-multiselect{border-width:0;border-radius:0;background:#fff;box-shadow:none}:host ::ng-deep .p-multiselect .p-multiselect-dropdown{display:none}:host ::ng-deep .p-multiselect:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-multiselect-open{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect-open .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-multiselect:not(.p-disabled).p-focus{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect:not(.p-disabled).p-focus .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-multiselect:not(.p-disabled):hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect:not(.p-disabled):hover .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-multiselect:not(.p-disabled).ng-hovered{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect:not(.p-disabled).ng-hovered .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-textarea{border-radius:0;box-shadow:none;padding:0 .25rem;background:#fff;resize:none}:host ::ng-deep .p-textarea:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border:1px solid var(--p-red-500)!important}:host ::ng-deep .p-textarea:not(:disabled):hover{border:1px solid var(--p-primary-color);resize:vertical}:host ::ng-deep .p-textarea:not(:disabled).ng-hovered{border:1px solid var(--p-primary-color);resize:vertical}:host ::ng-deep .p-textarea:focus{border:1px solid var(--p-primary-color);resize:vertical}:host ::ng-deep .p-treeselect-label{padding:0}:host ::ng-deep .p-treeselect{border-width:0;border-radius:0;box-shadow:none;background:#fff}:host ::ng-deep .p-treeselect .p-treeselect-dropdown{display:none}:host ::ng-deep .ng-invalid.ng-dirty>.p-treeselect{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-treeselect-open{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-treeselect-open .p-treeselect-dropdown{display:flex}:host ::ng-deep .p-treeselect:not(.p-disabled).p-focus{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-treeselect:not(.p-disabled).p-focus .p-treeselect-dropdown{display:flex}:host ::ng-deep .p-treeselect:not(.p-disabled):hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-treeselect:not(.p-disabled):hover .p-treeselect-dropdown{display:flex}:host ::ng-deep .ng-hovered>.p-treeselect:not(.p-disabled){border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .ng-hovered>.p-treeselect:not(.p-disabled) .p-treeselect-dropdown{display:flex}:host ::ng-deep .p-menubar{border-width:0;padding:0}:host ::ng-deep .p-menubar-submenu{z-index:3}:host ::ng-deep .p-fileupload-advanced{border-width:0;border-radius:0;background-color:#fff}:host ::ng-deep .p-fileupload-header{padding:0}:host ::ng-deep .p-fileupload-content{padding:0;display:block;border-width:0}:host ::ng-deep .p-inputnumber:not(.ng-valid).ng-dirty>.p-inputtext{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-inputnumber.ng-hovered:not(.p-disabled)>.p-inputtext{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .ng-invalid.ng-dirty>.p-datepicker .p-inputtext{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .ng-hovered>.p-datepicker:not(.p-disabled) .p-inputtext{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .cm-editor{border:1px solid #cbd5e1}:host ::ng-deep .cm-editor.cm-focused{outline:none!important;border:1px solid var(--p-primary-color)}:host ::ng-deep .cm-editor:hover{border:1px solid var(--p-primary-color)}:host ::ng-deep .cm-editor.ng-hovered{border:1px solid var(--p-primary-color)}:host ::ng-deep .cm-gutters{background-color:#fff;border:\"none\"}:host ::ng-deep .cm-activeLineGutter{background-color:#fff}\n", ".image-preview-list{display:flex;flex-wrap:wrap;gap:.5rem}:is() .p-image-preview{display:inline-flex}\n"] }]
+        }], ctorParameters: () => [] });
+
 class CodeMirrorComponent {
     constructor(action, renderer) {
         this.action = action;
@@ -9622,6 +9709,9 @@ class FormTypeComponent {
 			@case ('image') {
 				<form-image [field]="field()!"></form-image>
 			}
+			@case ('imagepreview') {
+				<form-imagepreview [field]="field()!"></form-imagepreview>
+			}
 			@case ('codemirror') {
 				<form-codemirror [field]="field()!"></form-codemirror>
 			}
@@ -9629,7 +9719,7 @@ class FormTypeComponent {
 				<form-rowselector [field]="field()!"></form-rowselector>
 			}
 		}
-	`, isInline: true, dependencies: [{ kind: "component", type: InputTextComponent, selector: "form-inputtext", inputs: ["field"] }, { kind: "component", type: InputNumberComponent, selector: "form-inputnumber", inputs: ["field"] }, { kind: "component", type: SelectComponent, selector: "form-select", inputs: ["field"] }, { kind: "component", type: TreeSelectComponent, selector: "form-treeselect", inputs: ["field"] }, { kind: "component", type: DatePickerComponent, selector: "form-datepicker", inputs: ["field"] }, { kind: "component", type: AutoCompleteComponent, selector: "form-autocomplete", inputs: ["field"] }, { kind: "component", type: MultiSelectComponent, selector: "form-multiselect", inputs: ["field"] }, { kind: "component", type: RadioComponent, selector: "form-radio", inputs: ["field"] }, { kind: "component", type: TextAreaComponent, selector: "form-textarea", inputs: ["field"] }, { kind: "component", type: UploadComponent, selector: "form-upload", inputs: ["field"] }, { kind: "component", type: ImageComponent, selector: "form-image", inputs: ["field"] }, { kind: "component", type: CodeMirrorComponent, selector: "form-codemirror", inputs: ["field"], outputs: ["change"] }, { kind: "component", type: RowSelectorComponent, selector: "form-rowselector", inputs: ["field"] }] }); }
+	`, isInline: true, dependencies: [{ kind: "component", type: InputTextComponent, selector: "form-inputtext", inputs: ["field"] }, { kind: "component", type: InputNumberComponent, selector: "form-inputnumber", inputs: ["field"] }, { kind: "component", type: SelectComponent, selector: "form-select", inputs: ["field"] }, { kind: "component", type: TreeSelectComponent, selector: "form-treeselect", inputs: ["field"] }, { kind: "component", type: DatePickerComponent, selector: "form-datepicker", inputs: ["field"] }, { kind: "component", type: AutoCompleteComponent, selector: "form-autocomplete", inputs: ["field"] }, { kind: "component", type: MultiSelectComponent, selector: "form-multiselect", inputs: ["field"] }, { kind: "component", type: RadioComponent, selector: "form-radio", inputs: ["field"] }, { kind: "component", type: TextAreaComponent, selector: "form-textarea", inputs: ["field"] }, { kind: "component", type: UploadComponent, selector: "form-upload", inputs: ["field"] }, { kind: "component", type: ImageComponent, selector: "form-image", inputs: ["field"] }, { kind: "component", type: ImagePreviewComponent, selector: "form-imagepreview", inputs: ["field"] }, { kind: "component", type: CodeMirrorComponent, selector: "form-codemirror", inputs: ["field"], outputs: ["change"] }, { kind: "component", type: RowSelectorComponent, selector: "form-rowselector", inputs: ["field"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FormTypeComponent, decorators: [{
             type: Component,
@@ -9648,6 +9738,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         TextAreaComponent,
                         UploadComponent,
                         ImageComponent,
+                        ImagePreviewComponent,
                         CodeMirrorComponent,
                         RowSelectorComponent,
                     ],
@@ -9686,6 +9777,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
 			@case ('image') {
 				<form-image [field]="field()!"></form-image>
 			}
+			@case ('imagepreview') {
+				<form-imagepreview [field]="field()!"></form-imagepreview>
+			}
 			@case ('codemirror') {
 				<form-codemirror [field]="field()!"></form-codemirror>
 			}
@@ -9874,6 +9968,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 args: ['fieldLabelRef', { static: false }]
             }] } });
 
+const nonEmptyRequired = (control) => (control.value === false ? null : Validators.required(control));
 class FormComponent {
     onResize() {
         this.reCalcLabelSize();
@@ -10015,7 +10110,7 @@ class FormComponent {
     handleFieldControl(field) {
         const key = field.key || '';
         const isDisplayOnly = !!field.extra?.displayOnly;
-        const validators = isDisplayOnly ? null : fieldUtils.props(field)?.required ? (field.validators ? field.validators : Validators.required) : null;
+        const validators = isDisplayOnly ? null : fieldUtils.props(field)?.required ? (field.validators ? field.validators : nonEmptyRequired) : null;
         let fieldControl = this.options().form?.get(key);
         if (!fieldControl) {
             fieldControl = new FieldControl(null, validators || undefined);
@@ -10117,7 +10212,7 @@ class FormComponent {
                     const validators = field.extra?.displayOnly
                         ? null
                         : fieldUtils.props(field)?.required
-                            ? (field?.validators ? field?.validators : Validators.required)
+                            ? (field?.validators ? field?.validators : nonEmptyRequired)
                             : null;
                     field.fieldControl?.setValidators(validators);
                 }
@@ -10268,6 +10363,7 @@ const formTypeToProps = {
     textarea: 'textAreaProps',
     upload: 'uploadProps',
     image: 'imageProps',
+    imagepreview: 'imagePreviewProps',
     codemirror: 'codeMirrorProps',
     rowselector: 'rowSelectorProps',
 };
@@ -13083,5 +13179,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { ActionService, ActionsComponent, AmComponent, AsyncRenderer, AsyncSelectLabelRenderer, CellEditAsyncSelectFieldComponent, CellEditAutoCompleteComponent, CellEditDatePickerComponent, CellEditInputDateComponent, CellEditInputNumberCompoent, CellEditInputTextCompoent, CellEditSelectComponent, CellEditSelectFieldComponent, CellEditTextareaComponent, CodeMirrorComponent, CrumbActionComponent, FieldControl, FormComponent, FormFieldComponent, FormTypeComponent, GridComponent, HeadComponent, HrefBtnListComponent, I18N_Token, I18nService, ImportComponent, LANGS, LinkRenderer, LoadingComponent, LoadingService, LogComponent, PageActionService, PageFormComponent, PageFormService, PageFormSlotDirective, PageGridListComponent, PagerComponent, PopActionService, RowSelectorComponent$1 as RowSelectorComponent, SearchComponent, SingleSelectListboxComponent, StepsComponent, ThemeConfigComponent, ThemeConfigService, UploadRenderer, UserHistoryService, calcRowSpan, changeContent, clearLocal, compileTsToJs, convertAct, convertCol, convertForm, convertGrid, createCircularIterator, deepClone, executeRuntimeContextInit, filterObjectByKeys, formTypeToProps, generateUniqueId, getFilterMatchMode, gridOptionsHooker, gridUtils, isJSONParsable, pageListGridOptions, parseFunctions, toPascalCase, wrapHeaderValueGetter };
+export { ActionService, ActionsComponent, AmComponent, AsyncRenderer, AsyncSelectLabelRenderer, CellEditAsyncSelectFieldComponent, CellEditAutoCompleteComponent, CellEditDatePickerComponent, CellEditInputDateComponent, CellEditInputNumberCompoent, CellEditInputTextCompoent, CellEditSelectComponent, CellEditSelectFieldComponent, CellEditTextareaComponent, CodeMirrorComponent, CrumbActionComponent, FieldControl, FormComponent, FormFieldComponent, FormTypeComponent, GridComponent, HeadComponent, HrefBtnListComponent, I18N_Token, I18nService, ImagePreviewComponent, ImportComponent, LANGS, LinkRenderer, LoadingComponent, LoadingService, LogComponent, PageActionService, PageFormComponent, PageFormService, PageFormSlotDirective, PageGridListComponent, PagerComponent, PopActionService, RowSelectorComponent$1 as RowSelectorComponent, SearchComponent, SingleSelectListboxComponent, StepsComponent, ThemeConfigComponent, ThemeConfigService, UploadRenderer, UserHistoryService, calcRowSpan, changeContent, clearLocal, compileTsToJs, convertAct, convertCol, convertForm, convertGrid, createCircularIterator, deepClone, executeRuntimeContextInit, filterObjectByKeys, formTypeToProps, generateUniqueId, getFilterMatchMode, gridOptionsHooker, gridUtils, isJSONParsable, pageListGridOptions, parseFunctions, toPascalCase, wrapHeaderValueGetter };
 //# sourceMappingURL=imm-element-ui.mjs.map