@3kles/kles-material-dynamicforms 21.2.1 → 21.3.0
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.
|
@@ -346,6 +346,7 @@ class KlesDynamicFieldDirective {
|
|
|
346
346
|
constructor(container, injector) {
|
|
347
347
|
this.container = container;
|
|
348
348
|
this.injector = injector;
|
|
349
|
+
this.context = null;
|
|
349
350
|
this.subComponents = [];
|
|
350
351
|
}
|
|
351
352
|
ngOnDestroy() {
|
|
@@ -361,6 +362,7 @@ class KlesDynamicFieldDirective {
|
|
|
361
362
|
const fieldChanged = !!changes['field'] && !changes['field'].isFirstChange();
|
|
362
363
|
const uiChanged = !!changes['ui'] && !changes['ui'].isFirstChange();
|
|
363
364
|
const siblingFieldsChanged = !!changes['siblingFields'] && !changes['siblingFields'].isFirstChange();
|
|
365
|
+
const contextChanged = !!changes['context'] && !changes['context'].isFirstChange();
|
|
364
366
|
if (groupChanged) {
|
|
365
367
|
this.group = changes['group'].currentValue;
|
|
366
368
|
}
|
|
@@ -373,7 +375,10 @@ class KlesDynamicFieldDirective {
|
|
|
373
375
|
if (siblingFieldsChanged) {
|
|
374
376
|
this.siblingFields = changes['siblingFields'].currentValue;
|
|
375
377
|
}
|
|
376
|
-
if (
|
|
378
|
+
if (contextChanged) {
|
|
379
|
+
this.context = changes['context'].currentValue;
|
|
380
|
+
}
|
|
381
|
+
if (groupChanged || fieldChanged || uiChanged || siblingFieldsChanged || contextChanged) {
|
|
377
382
|
this.buildComponent();
|
|
378
383
|
}
|
|
379
384
|
}
|
|
@@ -421,6 +426,14 @@ class KlesDynamicFieldDirective {
|
|
|
421
426
|
provide: GROUP_UI,
|
|
422
427
|
useValue: this.ui,
|
|
423
428
|
},
|
|
429
|
+
...(this.context
|
|
430
|
+
? [
|
|
431
|
+
{
|
|
432
|
+
provide: FIELD_CONTEXT,
|
|
433
|
+
useValue: this.context,
|
|
434
|
+
},
|
|
435
|
+
]
|
|
436
|
+
: []),
|
|
424
437
|
],
|
|
425
438
|
parent: this.injector,
|
|
426
439
|
};
|
|
@@ -475,7 +488,7 @@ class KlesDynamicFieldDirective {
|
|
|
475
488
|
return component;
|
|
476
489
|
}
|
|
477
490
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: KlesDynamicFieldDirective, deps: [{ token: i0.ViewContainerRef }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
478
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.19", type: KlesDynamicFieldDirective, isStandalone: true, selector: "[klesDynamicField]", inputs: { field: "field", group: "group", ui: "ui", siblingFields: "siblingFields" }, usesOnChanges: true, ngImport: i0 }); }
|
|
491
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.19", type: KlesDynamicFieldDirective, isStandalone: true, selector: "[klesDynamicField]", inputs: { field: "field", group: "group", ui: "ui", siblingFields: "siblingFields", context: "context" }, usesOnChanges: true, ngImport: i0 }); }
|
|
479
492
|
}
|
|
480
493
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: KlesDynamicFieldDirective, decorators: [{
|
|
481
494
|
type: Directive,
|
|
@@ -491,6 +504,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
|
|
|
491
504
|
type: Input
|
|
492
505
|
}], siblingFields: [{
|
|
493
506
|
type: Input
|
|
507
|
+
}], context: [{
|
|
508
|
+
type: Input
|
|
494
509
|
}] } });
|
|
495
510
|
|
|
496
511
|
function flattenValidators(validations) {
|
|
@@ -657,6 +672,7 @@ class KlesDynamicFormComponent {
|
|
|
657
672
|
constructor(fb, ref) {
|
|
658
673
|
this.fb = fb;
|
|
659
674
|
this.ref = ref;
|
|
675
|
+
this.context = null;
|
|
660
676
|
this.fields = [];
|
|
661
677
|
this.validators = [];
|
|
662
678
|
this.asyncValidators = [];
|
|
@@ -816,18 +832,18 @@ class KlesDynamicFormComponent {
|
|
|
816
832
|
return uiGroup;
|
|
817
833
|
}
|
|
818
834
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: KlesDynamicFormComponent, deps: [{ token: i2.UntypedFormBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
819
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: KlesDynamicFormComponent, isStandalone: true, selector: "app-kles-dynamic-form", inputs: { fields: "fields", validators: "validators", asyncValidators: "asyncValidators", direction: "direction", formClass: "formClass" }, outputs: { submit: "submit", _onLoaded: "_onLoaded" }, providers: [{ provide: ErrorStateMatcher, useClass: KlesFormErrorStateMatcher }], exportAs: ["klesDynamicForm"], usesOnChanges: true, ngImport: i0, template: `
|
|
835
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: KlesDynamicFormComponent, isStandalone: true, selector: "app-kles-dynamic-form", inputs: { context: "context", fields: "fields", validators: "validators", asyncValidators: "asyncValidators", direction: "direction", formClass: "formClass" }, outputs: { submit: "submit", _onLoaded: "_onLoaded" }, providers: [{ provide: ErrorStateMatcher, useClass: KlesFormErrorStateMatcher }], exportAs: ["klesDynamicForm"], usesOnChanges: true, ngImport: i0, template: `
|
|
820
836
|
<form class="{{ orientationClass }}" [ngClass]="formClass" [formGroup]="form" (submit)="onSubmit($event)">
|
|
821
837
|
@for (field of fields; track field.name) {
|
|
822
838
|
@if (field.visible !== false) {
|
|
823
|
-
<ng-container klesDynamicField [field]="field" [group]="form" [ui]="ui" [siblingFields]="fields"> </ng-container>
|
|
839
|
+
<ng-container klesDynamicField [field]="field" [group]="form" [ui]="ui" [siblingFields]="fields" [context]="context"> </ng-container>
|
|
824
840
|
}
|
|
825
841
|
}
|
|
826
842
|
@if (form && form.errors) {
|
|
827
843
|
<mat-error matErrorForm [form]="form" [validations]="validators" [asyncValidations]="asyncValidators"></mat-error>
|
|
828
844
|
}
|
|
829
845
|
</form>
|
|
830
|
-
`, isInline: true, styles: [".dynamic-form-column{display:flex;flex-direction:column}\n", ".dynamic-form-column>*{width:100%}\n", ".dynamic-form-row{display:inline-flex;flex-wrap:wrap;gap:10px;align-items:baseline}\n", ".dynamic-form-row>*{width:100%}\n", ".dynamic-form-grid{display:grid}\n", ".dynamic-form-inline-grid{display:inline-grid}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MatErrorFormDirective, selector: "[matErrorForm]", inputs: ["form", "validations", "asyncValidations"] }, { kind: "directive", type: KlesDynamicFieldDirective, selector: "[klesDynamicField]", inputs: ["field", "group", "ui", "siblingFields"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: MatError, selector: "mat-error, [matError]", inputs: ["id"] }] }); }
|
|
846
|
+
`, isInline: true, styles: [".dynamic-form-column{display:flex;flex-direction:column}\n", ".dynamic-form-column>*{width:100%}\n", ".dynamic-form-row{display:inline-flex;flex-wrap:wrap;gap:10px;align-items:baseline}\n", ".dynamic-form-row>*{width:100%}\n", ".dynamic-form-grid{display:grid}\n", ".dynamic-form-inline-grid{display:inline-grid}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MatErrorFormDirective, selector: "[matErrorForm]", inputs: ["form", "validations", "asyncValidations"] }, { kind: "directive", type: KlesDynamicFieldDirective, selector: "[klesDynamicField]", inputs: ["field", "group", "ui", "siblingFields", "context"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: MatError, selector: "mat-error, [matError]", inputs: ["id"] }] }); }
|
|
831
847
|
}
|
|
832
848
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: KlesDynamicFormComponent, decorators: [{
|
|
833
849
|
type: Component,
|
|
@@ -835,7 +851,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
|
|
|
835
851
|
<form class="{{ orientationClass }}" [ngClass]="formClass" [formGroup]="form" (submit)="onSubmit($event)">
|
|
836
852
|
@for (field of fields; track field.name) {
|
|
837
853
|
@if (field.visible !== false) {
|
|
838
|
-
<ng-container klesDynamicField [field]="field" [group]="form" [ui]="ui" [siblingFields]="fields"> </ng-container>
|
|
854
|
+
<ng-container klesDynamicField [field]="field" [group]="form" [ui]="ui" [siblingFields]="fields" [context]="context"> </ng-container>
|
|
839
855
|
}
|
|
840
856
|
}
|
|
841
857
|
@if (form && form.errors) {
|
|
@@ -843,7 +859,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
|
|
|
843
859
|
}
|
|
844
860
|
</form>
|
|
845
861
|
`, providers: [{ provide: ErrorStateMatcher, useClass: KlesFormErrorStateMatcher }], imports: [CommonModule, MatErrorFormDirective, KlesDynamicFieldDirective, FormsModule, ReactiveFormsModule, MatError], styles: [".dynamic-form-column{display:flex;flex-direction:column}\n", ".dynamic-form-column>*{width:100%}\n", ".dynamic-form-row{display:inline-flex;flex-wrap:wrap;gap:10px;align-items:baseline}\n", ".dynamic-form-row>*{width:100%}\n", ".dynamic-form-grid{display:grid}\n", ".dynamic-form-inline-grid{display:inline-grid}\n"] }]
|
|
846
|
-
}], ctorParameters: () => [{ type: i2.UntypedFormBuilder }, { type: i0.ChangeDetectorRef }], propDecorators: {
|
|
862
|
+
}], ctorParameters: () => [{ type: i2.UntypedFormBuilder }, { type: i0.ChangeDetectorRef }], propDecorators: { context: [{
|
|
863
|
+
type: Input
|
|
864
|
+
}], fields: [{
|
|
847
865
|
type: Input
|
|
848
866
|
}], validators: [{
|
|
849
867
|
type: Input
|
|
@@ -2269,7 +2287,7 @@ let KlesFormListFieldComponent = class KlesFormListFieldComponent extends KlesFi
|
|
|
2269
2287
|
}
|
|
2270
2288
|
</div>
|
|
2271
2289
|
</div>
|
|
2272
|
-
`, isInline: true, styles: [".subfields{display:flex;flex-direction:row;gap:5px}\n", ".label{display:flex;align-items:center;flex-direction:row;gap:5px}\n"], dependencies: [{ kind: "directive", type: MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: KlesDynamicFieldDirective, selector: "[klesDynamicField]", inputs: ["field", "group", "ui", "siblingFields"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }] }); }
|
|
2290
|
+
`, isInline: true, styles: [".subfields{display:flex;flex-direction:row;gap:5px}\n", ".label{display:flex;align-items:center;flex-direction:row;gap:5px}\n"], dependencies: [{ kind: "directive", type: MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: KlesDynamicFieldDirective, selector: "[klesDynamicField]", inputs: ["field", "group", "ui", "siblingFields", "context"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }] }); }
|
|
2273
2291
|
};
|
|
2274
2292
|
KlesFormListFieldComponent = __decorate([
|
|
2275
2293
|
FieldMapper({ type: 'listfield', factory: (field) => new KlesFormArray(field).create() })
|
|
@@ -3195,7 +3213,7 @@ let KlesFormGroupComponent = class KlesFormGroupComponent extends KlesFieldAbstr
|
|
|
3195
3213
|
}
|
|
3196
3214
|
</ng-container>
|
|
3197
3215
|
</ng-container>
|
|
3198
|
-
`, isInline: true, styles: ["mat-form-field{width:100%}\n", ":host.group-container{display:flex;flex-direction:inherit;width:inherit;justify-content:inherit}\n", ":host.group-container-column{display:flex;flex-direction:column;justify-content:inherit}\n", ":host.group-container-column>*{width:100%}\n", ":host.group-container-row{display:inline-flex;flex-wrap:wrap;gap:10px;align-items:baseline;justify-content:inherit}\n", ":host.group-container-row>*{width:100%}\n", ":host.group-container-grid{display:grid}\n", ":host.group-container-inline-grid{display:inline-grid}\n"], dependencies: [{ kind: "directive", type: KlesDynamicFieldDirective, selector: "[klesDynamicField]", inputs: ["field", "group", "ui", "siblingFields"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }] }); }
|
|
3216
|
+
`, isInline: true, styles: ["mat-form-field{width:100%}\n", ":host.group-container{display:flex;flex-direction:inherit;width:inherit;justify-content:inherit}\n", ":host.group-container-column{display:flex;flex-direction:column;justify-content:inherit}\n", ":host.group-container-column>*{width:100%}\n", ":host.group-container-row{display:inline-flex;flex-wrap:wrap;gap:10px;align-items:baseline;justify-content:inherit}\n", ":host.group-container-row>*{width:100%}\n", ":host.group-container-grid{display:grid}\n", ":host.group-container-inline-grid{display:inline-grid}\n"], dependencies: [{ kind: "directive", type: KlesDynamicFieldDirective, selector: "[klesDynamicField]", inputs: ["field", "group", "ui", "siblingFields", "context"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }] }); }
|
|
3199
3217
|
};
|
|
3200
3218
|
KlesFormGroupComponent = __decorate([
|
|
3201
3219
|
FieldMapper({ type: EnumType.group, factory: (field) => new KlesFormGroup(field).create(), ui: (field) => new KlesFormUiGroup(field).create() })
|
|
@@ -4566,7 +4584,7 @@ let KlesFormArrayComponent = class KlesFormArrayComponent extends KlesFieldAbstr
|
|
|
4566
4584
|
}
|
|
4567
4585
|
</ng-container>
|
|
4568
4586
|
</div>
|
|
4569
|
-
`, isInline: true, styles: ["mat-form-field{width:100%}\n", ":host{display:flex;flex-direction:inherit}\n", ".container{display:flex;flex-direction:inherit}\n", ".container-column{gap:10px}\n", ".group-container{display:flex;flex-direction:inherit}\n", ".row{gap:10px;flex-direction:row;align-items:baseline}\n", ".column{flex-direction:column;gap:0px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: KlesDynamicFieldDirective, selector: "[klesDynamicField]", inputs: ["field", "group", "ui", "siblingFields"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }] }); }
|
|
4587
|
+
`, isInline: true, styles: ["mat-form-field{width:100%}\n", ":host{display:flex;flex-direction:inherit}\n", ".container{display:flex;flex-direction:inherit}\n", ".container-column{gap:10px}\n", ".group-container{display:flex;flex-direction:inherit}\n", ".row{gap:10px;flex-direction:row;align-items:baseline}\n", ".column{flex-direction:column;gap:0px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: KlesDynamicFieldDirective, selector: "[klesDynamicField]", inputs: ["field", "group", "ui", "siblingFields", "context"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }] }); }
|
|
4570
4588
|
};
|
|
4571
4589
|
KlesFormArrayComponent = __decorate([
|
|
4572
4590
|
FieldMapper({ type: EnumType.array, factory: (field) => new KlesFormArray(field).create(), ui: (field) => new KlesFormUiArray(field).create() })
|
|
@@ -6345,7 +6363,7 @@ let KlesFormStatusComponent = class KlesFormStatusComponent extends KlesFieldAbs
|
|
|
6345
6363
|
</span>
|
|
6346
6364
|
}
|
|
6347
6365
|
</span>
|
|
6348
|
-
`, isInline: true, styles: [":host{display:flex}.kles-status{display:inline-flex;align-items:center;gap:6px;box-sizing:border-box;color:var(--kles-status-color, var(--mat-sys-on-surface-variant));background:var(--kles-status-container, var(--mat-sys-surface-container-high))}.kles-status--chip{min-height:28px;padding:3px 10px;border-radius:999px;font:var(--mat-sys-label-medium)}.kles-status--badge{min-height:22px;padding:2px 7px;border-radius:4px;font:var(--mat-sys-label-small)}.kles-status--text{padding:0;border-radius:0;background:transparent}.kles-status__icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex:0 0 20px;line-height:20px;overflow:visible;vertical-align:middle}.kles-status__icon svg{width:100%;height:100%;overflow:visible}.kles-status__dot{width:8px;height:8px;flex:0 0 8px;border-radius:50%;background:currentColor}.kles-status__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kles-status--disabled{opacity:.56}.kles-status--neutral{--kles-status-color: var(--mat-sys-on-surface-variant);--kles-status-container: var(--mat-sys-surface-container-high)}.kles-status--info{--kles-status-color: var(--mat-sys-on-primary-container);--kles-status-container: var(--mat-sys-primary-container)}.kles-status--success{--kles-status-color: var(--kles-status-success-color, #1b5e20);--kles-status-container: var(--kles-status-success-container, #d7f5df)}.kles-status--warning{--kles-status-color: var(--kles-status-warning-color, #7a4f00);--kles-status-container: var(--kles-status-warning-container, #ffecb3)}.kles-status--error{--kles-status-color: var(--mat-sys-on-error-container);--kles-status-container: var(--mat-sys-error-container)}\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: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4$2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i7.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6366
|
+
`, isInline: true, styles: [":host{display:flex;justify-content:inherit}.kles-status{display:inline-flex;align-items:center;gap:6px;box-sizing:border-box;color:var(--kles-status-color, var(--mat-sys-on-surface-variant));background:var(--kles-status-container, var(--mat-sys-surface-container-high))}.kles-status--chip{min-height:28px;padding:3px 10px;border-radius:999px;font:var(--mat-sys-label-medium)}.kles-status--badge{min-height:22px;padding:2px 7px;border-radius:4px;font:var(--mat-sys-label-small)}.kles-status--text{padding:0;border-radius:0;background:transparent}.kles-status__icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex:0 0 20px;line-height:20px;overflow:visible;vertical-align:middle}.kles-status__icon svg{width:100%;height:100%;overflow:visible}.kles-status__dot{width:8px;height:8px;flex:0 0 8px;border-radius:50%;background:currentColor}.kles-status__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kles-status--disabled{opacity:.56}.kles-status--neutral{--kles-status-color: var(--mat-sys-on-surface-variant);--kles-status-container: var(--mat-sys-surface-container-high)}.kles-status--info{--kles-status-color: var(--mat-sys-on-primary-container);--kles-status-container: var(--mat-sys-primary-container)}.kles-status--success{--kles-status-color: var(--kles-status-success-color, #1b5e20);--kles-status-container: var(--kles-status-success-container, #d7f5df)}.kles-status--warning{--kles-status-color: var(--kles-status-warning-color, #7a4f00);--kles-status-container: var(--kles-status-warning-container, #ffecb3)}.kles-status--error{--kles-status-color: var(--mat-sys-on-error-container);--kles-status-container: var(--mat-sys-error-container)}\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: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4$2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i7.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6349
6367
|
};
|
|
6350
6368
|
KlesFormStatusComponent = __decorate([
|
|
6351
6369
|
FieldMapper({
|
|
@@ -6390,7 +6408,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
|
|
|
6390
6408
|
</span>
|
|
6391
6409
|
}
|
|
6392
6410
|
</span>
|
|
6393
|
-
`, styles: [":host{display:flex}.kles-status{display:inline-flex;align-items:center;gap:6px;box-sizing:border-box;color:var(--kles-status-color, var(--mat-sys-on-surface-variant));background:var(--kles-status-container, var(--mat-sys-surface-container-high))}.kles-status--chip{min-height:28px;padding:3px 10px;border-radius:999px;font:var(--mat-sys-label-medium)}.kles-status--badge{min-height:22px;padding:2px 7px;border-radius:4px;font:var(--mat-sys-label-small)}.kles-status--text{padding:0;border-radius:0;background:transparent}.kles-status__icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex:0 0 20px;line-height:20px;overflow:visible;vertical-align:middle}.kles-status__icon svg{width:100%;height:100%;overflow:visible}.kles-status__dot{width:8px;height:8px;flex:0 0 8px;border-radius:50%;background:currentColor}.kles-status__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kles-status--disabled{opacity:.56}.kles-status--neutral{--kles-status-color: var(--mat-sys-on-surface-variant);--kles-status-container: var(--mat-sys-surface-container-high)}.kles-status--info{--kles-status-color: var(--mat-sys-on-primary-container);--kles-status-container: var(--mat-sys-primary-container)}.kles-status--success{--kles-status-color: var(--kles-status-success-color, #1b5e20);--kles-status-container: var(--kles-status-success-container, #d7f5df)}.kles-status--warning{--kles-status-color: var(--kles-status-warning-color, #7a4f00);--kles-status-container: var(--kles-status-warning-container, #ffecb3)}.kles-status--error{--kles-status-color: var(--mat-sys-on-error-container);--kles-status-container: var(--mat-sys-error-container)}\n"] }]
|
|
6411
|
+
`, styles: [":host{display:flex;justify-content:inherit}.kles-status{display:inline-flex;align-items:center;gap:6px;box-sizing:border-box;color:var(--kles-status-color, var(--mat-sys-on-surface-variant));background:var(--kles-status-container, var(--mat-sys-surface-container-high))}.kles-status--chip{min-height:28px;padding:3px 10px;border-radius:999px;font:var(--mat-sys-label-medium)}.kles-status--badge{min-height:22px;padding:2px 7px;border-radius:4px;font:var(--mat-sys-label-small)}.kles-status--text{padding:0;border-radius:0;background:transparent}.kles-status__icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex:0 0 20px;line-height:20px;overflow:visible;vertical-align:middle}.kles-status__icon svg{width:100%;height:100%;overflow:visible}.kles-status__dot{width:8px;height:8px;flex:0 0 8px;border-radius:50%;background:currentColor}.kles-status__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kles-status--disabled{opacity:.56}.kles-status--neutral{--kles-status-color: var(--mat-sys-on-surface-variant);--kles-status-container: var(--mat-sys-surface-container-high)}.kles-status--info{--kles-status-color: var(--mat-sys-on-primary-container);--kles-status-container: var(--mat-sys-primary-container)}.kles-status--success{--kles-status-color: var(--kles-status-success-color, #1b5e20);--kles-status-container: var(--kles-status-success-container, #d7f5df)}.kles-status--warning{--kles-status-color: var(--kles-status-warning-color, #7a4f00);--kles-status-container: var(--kles-status-warning-container, #ffecb3)}.kles-status--error{--kles-status-color: var(--mat-sys-on-error-container);--kles-status-container: var(--mat-sys-error-container)}\n"] }]
|
|
6394
6412
|
}] });
|
|
6395
6413
|
|
|
6396
6414
|
const components = [
|