@3kles/kles-material-dynamicforms 22.0.0 → 22.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -6116,16 +6116,7 @@ let KlesFormImageUploadComponent = class KlesFormImageUploadComponent extends Kl
|
|
|
6116
6116
|
<p class="kles-image-upload__hint">{{ hint() }}</p>
|
|
6117
6117
|
}
|
|
6118
6118
|
|
|
6119
|
-
<input
|
|
6120
|
-
#fileInput
|
|
6121
|
-
type="file"
|
|
6122
|
-
hidden
|
|
6123
|
-
[attr.id]="field.id"
|
|
6124
|
-
[accept]="accept()"
|
|
6125
|
-
[disabled]="disabled()"
|
|
6126
|
-
[attr.aria-label]="options().changeLabel ?? intl.imageUploadChange"
|
|
6127
|
-
(change)="selectFile($event)"
|
|
6128
|
-
/>
|
|
6119
|
+
<input #fileInput type="file" hidden [attr.id]="field.id" [accept]="accept()" [disabled]="disabled()" [attr.aria-label]="options().changeLabel ?? intl.imageUploadChange" (change)="selectFile($event)" />
|
|
6129
6120
|
|
|
6130
6121
|
<div class="kles-image-upload__actions">
|
|
6131
6122
|
<button matButton="outlined" type="button" [disabled]="disabled()" (click)="openFilePicker()">
|
|
@@ -6142,7 +6133,7 @@ let KlesFormImageUploadComponent = class KlesFormImageUploadComponent extends Kl
|
|
|
6142
6133
|
}
|
|
6143
6134
|
</div>
|
|
6144
6135
|
</div>
|
|
6145
|
-
`, isInline: true, styles: [":host{display:block}.kles-image-upload{display:flex;align-items:center;gap:20px}.kles-image-upload__preview{display:grid;width:120px;height:120px;flex:0 0 120px;place-items:center;overflow:hidden;border:1px solid var(--mat-sys-outline-variant);border-radius:22px;color:var(--mat-sys-outline);background:var(--mat-sys-surface-container-low)}.kles-image-upload__preview img{width:100%;height:100%;object-fit:cover}.kles-image-upload__preview mat-icon{width:42px;height:42px;font-size:42px}.kles-image-upload__content{min-width:0}.kles-image-upload__title{display:flex;align-items:center;gap:10px;font:var(--mat-sys-title-large)}.kles-image-upload__title mat-icon{color:var(--mat-sys-primary)}.kles-image-upload__hint{margin:8px 0 14px;color:var(--mat-sys-on-surface-variant)}.kles-image-upload__actions{display:flex;flex-wrap:wrap;gap:10px}.kles-image-upload__actions button{min-height:44px}.kles-image-upload__error{margin:8px 0 0;color:var(--mat-sys-error);font:var(--mat-sys-body-small)}@media(max-width:600px){.kles-image-upload{align-items:flex-start}.kles-image-upload__preview{width:96px;height:96px;flex-basis:96px;border-radius:16px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6136
|
+
`, isInline: true, styles: [":host{display:block}.kles-image-upload{display:flex;align-items:center;gap:20px}.kles-image-upload__preview{display:grid;width:120px;height:120px;flex:0 0 120px;place-items:center;overflow:hidden;border:1px solid var(--mat-sys-outline-variant);border-radius:22px;color:var(--mat-sys-outline);background:var(--mat-sys-surface-container-low)}.kles-image-upload__preview img{width:100%;height:100%;object-fit:cover}.kles-image-upload__preview mat-icon{width:42px;height:42px;font-size:42px}.kles-image-upload__content{min-width:0}.kles-image-upload__title{display:flex;align-items:center;gap:10px;font:var(--mat-sys-title-large);font-size:20px;font-weight:500}.kles-image-upload__title mat-icon{color:var(--mat-sys-primary)}.kles-image-upload__hint{margin:8px 0 14px;color:var(--mat-sys-on-surface-variant);font:var(--mat-sys-body-medium)}.kles-image-upload__actions{display:flex;flex-wrap:wrap;gap:10px}.kles-image-upload__actions button{min-height:44px}.kles-image-upload__error{margin:8px 0 0;color:var(--mat-sys-error);font:var(--mat-sys-body-small)}@media(max-width:600px){.kles-image-upload{align-items:flex-start}.kles-image-upload__preview{width:96px;height:96px;flex-basis:96px;border-radius:16px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6146
6137
|
};
|
|
6147
6138
|
KlesFormImageUploadComponent = __decorate([
|
|
6148
6139
|
FieldMapper({ type: EnumType.imageUpload })
|
|
@@ -6169,16 +6160,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
|
|
|
6169
6160
|
<p class="kles-image-upload__hint">{{ hint() }}</p>
|
|
6170
6161
|
}
|
|
6171
6162
|
|
|
6172
|
-
<input
|
|
6173
|
-
#fileInput
|
|
6174
|
-
type="file"
|
|
6175
|
-
hidden
|
|
6176
|
-
[attr.id]="field.id"
|
|
6177
|
-
[accept]="accept()"
|
|
6178
|
-
[disabled]="disabled()"
|
|
6179
|
-
[attr.aria-label]="options().changeLabel ?? intl.imageUploadChange"
|
|
6180
|
-
(change)="selectFile($event)"
|
|
6181
|
-
/>
|
|
6163
|
+
<input #fileInput type="file" hidden [attr.id]="field.id" [accept]="accept()" [disabled]="disabled()" [attr.aria-label]="options().changeLabel ?? intl.imageUploadChange" (change)="selectFile($event)" />
|
|
6182
6164
|
|
|
6183
6165
|
<div class="kles-image-upload__actions">
|
|
6184
6166
|
<button matButton="outlined" type="button" [disabled]="disabled()" (click)="openFilePicker()">
|
|
@@ -6195,7 +6177,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
|
|
|
6195
6177
|
}
|
|
6196
6178
|
</div>
|
|
6197
6179
|
</div>
|
|
6198
|
-
`, styles: [":host{display:block}.kles-image-upload{display:flex;align-items:center;gap:20px}.kles-image-upload__preview{display:grid;width:120px;height:120px;flex:0 0 120px;place-items:center;overflow:hidden;border:1px solid var(--mat-sys-outline-variant);border-radius:22px;color:var(--mat-sys-outline);background:var(--mat-sys-surface-container-low)}.kles-image-upload__preview img{width:100%;height:100%;object-fit:cover}.kles-image-upload__preview mat-icon{width:42px;height:42px;font-size:42px}.kles-image-upload__content{min-width:0}.kles-image-upload__title{display:flex;align-items:center;gap:10px;font:var(--mat-sys-title-large)}.kles-image-upload__title mat-icon{color:var(--mat-sys-primary)}.kles-image-upload__hint{margin:8px 0 14px;color:var(--mat-sys-on-surface-variant)}.kles-image-upload__actions{display:flex;flex-wrap:wrap;gap:10px}.kles-image-upload__actions button{min-height:44px}.kles-image-upload__error{margin:8px 0 0;color:var(--mat-sys-error);font:var(--mat-sys-body-small)}@media(max-width:600px){.kles-image-upload{align-items:flex-start}.kles-image-upload__preview{width:96px;height:96px;flex-basis:96px;border-radius:16px}}\n"] }]
|
|
6180
|
+
`, styles: [":host{display:block}.kles-image-upload{display:flex;align-items:center;gap:20px}.kles-image-upload__preview{display:grid;width:120px;height:120px;flex:0 0 120px;place-items:center;overflow:hidden;border:1px solid var(--mat-sys-outline-variant);border-radius:22px;color:var(--mat-sys-outline);background:var(--mat-sys-surface-container-low)}.kles-image-upload__preview img{width:100%;height:100%;object-fit:cover}.kles-image-upload__preview mat-icon{width:42px;height:42px;font-size:42px}.kles-image-upload__content{min-width:0}.kles-image-upload__title{display:flex;align-items:center;gap:10px;font:var(--mat-sys-title-large);font-size:20px;font-weight:500}.kles-image-upload__title mat-icon{color:var(--mat-sys-primary)}.kles-image-upload__hint{margin:8px 0 14px;color:var(--mat-sys-on-surface-variant);font:var(--mat-sys-body-medium)}.kles-image-upload__actions{display:flex;flex-wrap:wrap;gap:10px}.kles-image-upload__actions button{min-height:44px}.kles-image-upload__error{margin:8px 0 0;color:var(--mat-sys-error);font:var(--mat-sys-body-small)}@media(max-width:600px){.kles-image-upload{align-items:flex-start}.kles-image-upload__preview{width:96px;height:96px;flex-basis:96px;border-radius:16px}}\n"] }]
|
|
6199
6181
|
}], propDecorators: { fileInput: [{ type: i0.ViewChild, args: ['fileInput', { isSignal: true }] }] } });
|
|
6200
6182
|
|
|
6201
6183
|
const components = [
|