@fuentis/phoenix-ui 0.0.9-alpha.533 → 0.0.9-alpha.535
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.
|
@@ -9302,6 +9302,8 @@ class MetaFormV2Component {
|
|
|
9302
9302
|
form;
|
|
9303
9303
|
config;
|
|
9304
9304
|
readOnly = false;
|
|
9305
|
+
contentStyle = null; // npr { width:'70%' }
|
|
9306
|
+
contentClass = null; // opcionalno.
|
|
9305
9307
|
fb = inject(FormBuilder);
|
|
9306
9308
|
submitValidator = inject(MetaSubmitValidatorService);
|
|
9307
9309
|
translate = inject(TranslateService);
|
|
@@ -9317,7 +9319,8 @@ class MetaFormV2Component {
|
|
|
9317
9319
|
const configChanged = !!changes['config'];
|
|
9318
9320
|
const formChanged = !!changes['form'];
|
|
9319
9321
|
const metaChanged = signature !== this.lastSignature;
|
|
9320
|
-
|
|
9322
|
+
const readOnlyChanged = !!changes['readOnly'];
|
|
9323
|
+
if (!configChanged && !formChanged && !metaChanged && !readOnlyChanged)
|
|
9321
9324
|
return;
|
|
9322
9325
|
// cleanup dependencies
|
|
9323
9326
|
this.depCleanup?.();
|
|
@@ -9328,6 +9331,20 @@ class MetaFormV2Component {
|
|
|
9328
9331
|
// patch initial values (no emit)
|
|
9329
9332
|
this.form.patchValue(initial, { emitEvent: false });
|
|
9330
9333
|
this.form.updateValueAndValidity({ emitEvent: false });
|
|
9334
|
+
if (readOnlyChanged && this.readOnly === false) {
|
|
9335
|
+
queueMicrotask(() => {
|
|
9336
|
+
this.form.markAllAsTouched();
|
|
9337
|
+
Object.values(this.form.controls).forEach((c) => c.updateValueAndValidity({ emitEvent: true }));
|
|
9338
|
+
this.form.updateValueAndValidity({ emitEvent: true });
|
|
9339
|
+
if (this.isGrouped) {
|
|
9340
|
+
const groups = this.groupedControls ?? [];
|
|
9341
|
+
this.expandedGroupIds = groups
|
|
9342
|
+
.filter((g) => this.groupHasInvalid(g))
|
|
9343
|
+
.map((g) => String(g?.id ?? ''))
|
|
9344
|
+
.filter(Boolean);
|
|
9345
|
+
}
|
|
9346
|
+
});
|
|
9347
|
+
}
|
|
9331
9348
|
// set initial expanded groups (when grouped)
|
|
9332
9349
|
if (configChanged || metaChanged) {
|
|
9333
9350
|
if (this.isGrouped) {
|
|
@@ -9393,11 +9410,17 @@ class MetaFormV2Component {
|
|
|
9393
9410
|
const id = g?.id;
|
|
9394
9411
|
return id === null || id === undefined ? '' : `${id}`;
|
|
9395
9412
|
}
|
|
9413
|
+
groupHasInvalid(g) {
|
|
9414
|
+
const keys = (g?.ctrl ?? [])
|
|
9415
|
+
.map((f) => f?.configuration?.key)
|
|
9416
|
+
.filter(Boolean);
|
|
9417
|
+
return keys.some((k) => this.form.get(k)?.invalid);
|
|
9418
|
+
}
|
|
9396
9419
|
ngOnDestroy() {
|
|
9397
9420
|
this.depCleanup?.();
|
|
9398
9421
|
}
|
|
9399
9422
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaFormV2Component, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
9400
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: MetaFormV2Component, isStandalone: true, selector: "phoenix-meta-form-v2", inputs: { form: "form", config: "config", readOnly: "readOnly" }, usesOnChanges: true, ngImport: i0, template: "<div [formGroup]=\"form\">\n @if (hasControls) {\n\n @if (isGrouped) {\n <p-accordion\n [multiple]=\"true\"\n [value]=\"expandedGroupIds\"\n (valueChange)=\"onAccordionValueChange($event)\"\n >\n @for (g of groupedControls; track groupTrack(g, $index)) {\n <p-accordion-panel [value]=\"panelValue(g)\">\n <p-accordion-header>\n {{ g?.
|
|
9423
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: MetaFormV2Component, isStandalone: true, selector: "phoenix-meta-form-v2", inputs: { form: "form", config: "config", readOnly: "readOnly", contentStyle: "contentStyle", contentClass: "contentClass" }, usesOnChanges: true, ngImport: i0, template: "<div [formGroup]=\"form\">\n @if (hasControls) {\n\n @if (isGrouped) {\n <p-accordion\n [multiple]=\"true\"\n [value]=\"expandedGroupIds\"\n (valueChange)=\"onAccordionValueChange($event)\"\n >\n @for (g of groupedControls; track groupTrack(g, $index)) {\n <p-accordion-panel [value]=\"panelValue(g)\">\n <p-accordion-header>\n\n <!-- plus/minus toggle icon -->\n <ng-template #toggleicon let-active=\"active\">\n @if (active) {\n <i class=\"pi pi-minus-circle\"></i>\n } @else {\n <i class=\"pi pi-plus-circle\"></i>\n }\n </ng-template>\n\n {{ g?.groupName | translate }}\n </p-accordion-header>\n \n <p-accordion-content>\n <div [ngStyle]=\"contentStyle\" [ngClass]=\"contentClass\">\n <phoenix-meta-form-group-v2 [group]=\"g\" [form]=\"form\" [readOnly]=\"readOnly\"></phoenix-meta-form-group-v2>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n }\n </p-accordion>\n\n } @else {\n <div class=\"grid\">\n @for (f of flatControls; track f.configuration.key) {\n <div [ngClass]=\"f.col ?? 'col-12 md:col-6'\">\n <phoenix-meta-form-field-v2 [field]=\"f\" [form]=\"form\" [readOnly]=\"readOnly\"></phoenix-meta-form-field-v2>\n </div>\n }\n </div>\n }\n\n }\n</div>", styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: AccordionModule }, { kind: "component", type: i3$3.Accordion, selector: "p-accordion", inputs: ["value", "multiple", "styleClass", "expandIcon", "collapseIcon", "selectOnFocus", "transitionOptions"], outputs: ["valueChange", "onClose", "onOpen"] }, { kind: "component", type: i3$3.AccordionPanel, selector: "p-accordion-panel, p-accordionpanel", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: i3$3.AccordionHeader, selector: "p-accordion-header, p-accordionheader" }, { kind: "component", type: i3$3.AccordionContent, selector: "p-accordion-content, p-accordioncontent" }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: MetaFormFieldV2Component, selector: "phoenix-meta-form-field-v2", inputs: ["field", "form", "readOnly", "disableForm"] }, { kind: "component", type: MetaFormGroupV2Component, selector: "phoenix-meta-form-group-v2", inputs: ["group", "form", "readOnly"] }, { kind: "pipe", type: i3$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9401
9424
|
}
|
|
9402
9425
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaFormV2Component, decorators: [{
|
|
9403
9426
|
type: Component,
|
|
@@ -9408,7 +9431,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
|
|
|
9408
9431
|
TranslateModule,
|
|
9409
9432
|
MetaFormFieldV2Component,
|
|
9410
9433
|
MetaFormGroupV2Component,
|
|
9411
|
-
], template: "<div [formGroup]=\"form\">\n @if (hasControls) {\n\n @if (isGrouped) {\n <p-accordion\n [multiple]=\"true\"\n [value]=\"expandedGroupIds\"\n (valueChange)=\"onAccordionValueChange($event)\"\n >\n @for (g of groupedControls; track groupTrack(g, $index)) {\n <p-accordion-panel [value]=\"panelValue(g)\">\n <p-accordion-header>\n {{ g?.
|
|
9434
|
+
], template: "<div [formGroup]=\"form\">\n @if (hasControls) {\n\n @if (isGrouped) {\n <p-accordion\n [multiple]=\"true\"\n [value]=\"expandedGroupIds\"\n (valueChange)=\"onAccordionValueChange($event)\"\n >\n @for (g of groupedControls; track groupTrack(g, $index)) {\n <p-accordion-panel [value]=\"panelValue(g)\">\n <p-accordion-header>\n\n <!-- plus/minus toggle icon -->\n <ng-template #toggleicon let-active=\"active\">\n @if (active) {\n <i class=\"pi pi-minus-circle\"></i>\n } @else {\n <i class=\"pi pi-plus-circle\"></i>\n }\n </ng-template>\n\n {{ g?.groupName | translate }}\n </p-accordion-header>\n \n <p-accordion-content>\n <div [ngStyle]=\"contentStyle\" [ngClass]=\"contentClass\">\n <phoenix-meta-form-group-v2 [group]=\"g\" [form]=\"form\" [readOnly]=\"readOnly\"></phoenix-meta-form-group-v2>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n }\n </p-accordion>\n\n } @else {\n <div class=\"grid\">\n @for (f of flatControls; track f.configuration.key) {\n <div [ngClass]=\"f.col ?? 'col-12 md:col-6'\">\n <phoenix-meta-form-field-v2 [field]=\"f\" [form]=\"form\" [readOnly]=\"readOnly\"></phoenix-meta-form-field-v2>\n </div>\n }\n </div>\n }\n\n }\n</div>", styles: [":host{display:block}\n"] }]
|
|
9412
9435
|
}], propDecorators: { form: [{
|
|
9413
9436
|
type: Input,
|
|
9414
9437
|
args: [{ required: true }]
|
|
@@ -9417,6 +9440,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
|
|
|
9417
9440
|
args: [{ required: true }]
|
|
9418
9441
|
}], readOnly: [{
|
|
9419
9442
|
type: Input
|
|
9443
|
+
}], contentStyle: [{
|
|
9444
|
+
type: Input
|
|
9445
|
+
}], contentClass: [{
|
|
9446
|
+
type: Input
|
|
9420
9447
|
}] } });
|
|
9421
9448
|
function idxSafe(g) {
|
|
9422
9449
|
// fallback stable id if some group has no id
|