@3kles/kles-material-dynamicforms 21.8.0 → 21.8.2
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.
|
@@ -4814,6 +4814,10 @@ class KlesFormTileComponent extends KlesFieldAbstract {
|
|
|
4814
4814
|
<div class="kles-tile" [ngClass]="ngClass()" [ngStyle]="ngStyle()" [matTooltip]="tooltip()">
|
|
4815
4815
|
@if (imageUrl()) {
|
|
4816
4816
|
<img class="kles-tile__image" [src]="imageUrl()" [alt]="imageAlt()" />
|
|
4817
|
+
} @else if (icon()) {
|
|
4818
|
+
<mat-icon class="kles-tile__icon">
|
|
4819
|
+
{{ icon() }}
|
|
4820
|
+
</mat-icon>
|
|
4817
4821
|
}
|
|
4818
4822
|
|
|
4819
4823
|
<div class="kles-tile__content">
|
|
@@ -4830,14 +4834,18 @@ class KlesFormTileComponent extends KlesFieldAbstract {
|
|
|
4830
4834
|
}
|
|
4831
4835
|
</div>
|
|
4832
4836
|
</div>
|
|
4833
|
-
`, isInline: true, styles: [":host{display:flex;justify-content:inherit}.kles-tile{display:flex;align-items:center;min-width:0;gap:12px;padding:8px}.kles-tile__image{width:36px;height:36px;flex:0 0 36px;object-fit:contain}.kles-tile__content{display:flex;flex-direction:column;min-width:0;gap:2px}.kles-tile__label{overflow:hidden;color:var(--mat-sys-on-surface);font-size:14px;font-weight:500;line-height:20px;text-overflow:ellipsis
|
|
4837
|
+
`, isInline: true, styles: [":host{display:flex;justify-content:inherit;text-align:left}.kles-tile{display:flex;align-items:center;min-width:0;gap:12px;padding:8px}.kles-tile__image,.kles-tile__icon{width:36px;height:36px;flex:0 0 36px}.kles-tile__icon{display:flex;align-items:center;justify-content:center;color:var(--mat-sys-primary);font-size:28px}.kles-tile__image{object-fit:contain}.kles-tile__content{display:flex;flex-direction:column;min-width:0;gap:2px}.kles-tile__label{overflow:hidden;color:var(--mat-sys-on-surface);font-size:14px;font-weight:500;line-height:20px;text-overflow:ellipsis}.kles-tile__hint{overflow:hidden;color:var(--mat-sys-on-surface-variant);font-size:12px;font-weight:400;line-height:16px;text-overflow:ellipsis}\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: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4834
4838
|
}
|
|
4835
4839
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: KlesFormTileComponent, decorators: [{
|
|
4836
4840
|
type: Component,
|
|
4837
|
-
args: [{ selector: 'app-kles-form-tile', standalone: true, imports: [CommonModule, MatTooltipModule], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
4841
|
+
args: [{ selector: 'app-kles-form-tile', standalone: true, imports: [CommonModule, MatTooltipModule, MatIconModule], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
4838
4842
|
<div class="kles-tile" [ngClass]="ngClass()" [ngStyle]="ngStyle()" [matTooltip]="tooltip()">
|
|
4839
4843
|
@if (imageUrl()) {
|
|
4840
4844
|
<img class="kles-tile__image" [src]="imageUrl()" [alt]="imageAlt()" />
|
|
4845
|
+
} @else if (icon()) {
|
|
4846
|
+
<mat-icon class="kles-tile__icon">
|
|
4847
|
+
{{ icon() }}
|
|
4848
|
+
</mat-icon>
|
|
4841
4849
|
}
|
|
4842
4850
|
|
|
4843
4851
|
<div class="kles-tile__content">
|
|
@@ -4854,7 +4862,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImpo
|
|
|
4854
4862
|
}
|
|
4855
4863
|
</div>
|
|
4856
4864
|
</div>
|
|
4857
|
-
`, styles: [":host{display:flex;justify-content:inherit}.kles-tile{display:flex;align-items:center;min-width:0;gap:12px;padding:8px}.kles-tile__image{width:36px;height:36px;flex:0 0 36px;object-fit:contain}.kles-tile__content{display:flex;flex-direction:column;min-width:0;gap:2px}.kles-tile__label{overflow:hidden;color:var(--mat-sys-on-surface);font-size:14px;font-weight:500;line-height:20px;text-overflow:ellipsis
|
|
4865
|
+
`, styles: [":host{display:flex;justify-content:inherit;text-align:left}.kles-tile{display:flex;align-items:center;min-width:0;gap:12px;padding:8px}.kles-tile__image,.kles-tile__icon{width:36px;height:36px;flex:0 0 36px}.kles-tile__icon{display:flex;align-items:center;justify-content:center;color:var(--mat-sys-primary);font-size:28px}.kles-tile__image{object-fit:contain}.kles-tile__content{display:flex;flex-direction:column;min-width:0;gap:2px}.kles-tile__label{overflow:hidden;color:var(--mat-sys-on-surface);font-size:14px;font-weight:500;line-height:20px;text-overflow:ellipsis}.kles-tile__hint{overflow:hidden;color:var(--mat-sys-on-surface-variant);font-size:12px;font-weight:400;line-height:16px;text-overflow:ellipsis}\n"] }]
|
|
4858
4866
|
}] });
|
|
4859
4867
|
|
|
4860
4868
|
/**
|