@wertzui/ngx-restworld-client 4.2.2 → 4.2.5

package/fesm2020/wertzui-ngx-restworld-client.mjs

@@ -1146,25 +1146,20 @@ class RESTworldEditViewComponent {
         }
         this.isLoading = false;
     }
-    async setInitialSelectedOptionsElementsForTemplates(templates) {
-        return Promise.all(Object.values(templates)
-            .map(template => this.setInitialSelectedOptionsElementsForTemplate(template)));
-    }
-    imageChanged(formControl, event) {
-        const file = event.files[0];
-        console.log(file);
-        const reader = new FileReader();
-        reader.onload = () => {
-            const uri = reader.result;
-            console.log(uri);
-            formControl.setValue(uri);
-        };
-        reader.readAsDataURL(file);
+    async setInitialSelectedOptionsElementsForTemplates(templates, skipDefaultTemplate) {
+        await Promise.all(Object.entries(templates)
+            .filter(([name,]) => !skipDefaultTemplate || name !== 'default')
+            .map(([, template]) => this.setInitialSelectedOptionsElementsForTemplate(template)));
     }
     async setInitialSelectedOptionsElementsForTemplate(template) {
-        return Promise.all(template.properties
+        const propertyPromises = template.properties
             .filter(property => property?.options?.link?.href)
-            .map(property => this.setInitialSelectedOptionsElementForProperty(property)));
+            .map(property => this.setInitialSelectedOptionsElementForProperty(property));
+        const nestedTemplatePromised = template.properties
+            .filter(property => property?._templates)
+            .map(property => this.setInitialSelectedOptionsElementsForTemplates(property._templates, true));
+        const allPromises = propertyPromises.concat(nestedTemplatePromised);
+        await Promise.all(allPromises);
     }
     async setInitialSelectedOptionsElementForProperty(property) {
         const options = property?.options;
@@ -1191,9 +1186,20 @@ class RESTworldEditViewComponent {
             return Promise.resolve({});
         }
         const formTemplates = Object.assign({}, ...formResponses.map(response => response.body._templates));
-        await this.setInitialSelectedOptionsElementsForTemplates(formTemplates);
+        await this.setInitialSelectedOptionsElementsForTemplates(formTemplates, false);
         return formTemplates;
     }
+    imageChanged(formControl, event) {
+        const file = event.files[0];
+        console.log(file);
+        const reader = new FileReader();
+        reader.onload = () => {
+            const uri = reader.result;
+            console.log(uri);
+            formControl.setValue(uri);
+        };
+        reader.readAsDataURL(file);
+    }
 }
 RESTworldEditViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: RESTworldEditViewComponent, deps: [{ token: RESTworldClientCollection }, { token: i2$1.ConfirmationService }, { token: i2$1.MessageService }, { token: i3$1.Location }, { token: i4$2.Router }, { token: FormService }, { token: i12.ValdemortConfig }], target: i0.ɵɵFactoryTarget.Component });
 RESTworldEditViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: RESTworldEditViewComponent, selector: "rw-edit", inputs: { apiName: "apiName", uri: "uri" }, queries: [{ propertyName: "extraTabsRef", first: true, predicate: ["extraTabs"], descendants: true }, { propertyName: "buttonsRef", first: true, predicate: ["buttons"], descendants: true }, { propertyName: "inputOptionsSingleRef", first: true, predicate: ["inputOptionsSingle"], descendants: true }, { propertyName: "inputOptionsMultipleRef", first: true, predicate: ["inputOptionsMultiple"], descendants: true }, { propertyName: "inputOptionsRef", first: true, predicate: ["inputOptions"], descendants: true }, { propertyName: "inputHiddenRef", first: true, predicate: ["inputHidden"], descendants: true }, { propertyName: "inputTextRef", first: true, predicate: ["inputText"], descendants: true }, { propertyName: "inputTextareaRef", first: true, predicate: ["inputTextarea"], descendants: true }, { propertyName: "inputSearchRef", first: true, predicate: ["inputSearch"], descendants: true }, { propertyName: "inputTelRef", first: true, predicate: ["inputTel"], descendants: true }, { propertyName: "inputUrlRef", first: true, predicate: ["inputUrl"], descendants: true }, { propertyName: "inputEmailRef", first: true, predicate: ["inputEmail"], descendants: true }, { propertyName: "inputPasswordRef", first: true, predicate: ["inputPassword"], descendants: true }, { propertyName: "inputDateRef", first: true, predicate: ["inputDate"], descendants: true }, { propertyName: "inputMonthRef", first: true, predicate: ["inputMonth"], descendants: true }, { propertyName: "inputWeekRef", first: true, predicate: ["inputWeek"], descendants: true }, { propertyName: "inputTimeRef", first: true, predicate: ["inputTime"], descendants: true }, { propertyName: "inputDatetimeLocalRef", first: true, predicate: ["inputDatetimeLocal"], descendants: true }, { propertyName: "inputNumberRef", first: true, predicate: ["inputNumber"], descendants: true }, { propertyName: "inputRangeRef", first: true, predicate: ["inputRange"], descendants: true }, { propertyName: "inputColorRef", first: true, predicate: ["inputColor"], descendants: true }, { propertyName: "inputBoolRef", first: true, predicate: ["inputBool"], descendants: true }, { propertyName: "inputDatetimeOffsetRef", first: true, predicate: ["inputDatetimeOffset"], descendants: true }, { propertyName: "inputDurationRef", first: true, predicate: ["inputDuration"], descendants: true }, { propertyName: "inputImageRef", first: true, predicate: ["inputImage"], descendants: true }, { propertyName: "inputFileRef", first: true, predicate: ["inputFile"], descendants: true }, { propertyName: "inputDefaultRef", first: true, predicate: ["inputDefault"], descendants: true }], ngImport: i0, template: "<div class=\"grid\">\r\n  <div class=\"col\">\r\n    <h1>Edit resource</h1>\r\n  </div>\r\n</div>\r\n\r\n<p-tabView>\r\n\r\n  <p-tabPanel *ngIf=\"isLoadingForTheFirstTime\" header=\"Loading\">\r\n    <div *ngFor=\"let i of [1, 2, 3, 4, 5]\" class=\"grid field\">\r\n      <p-skeleton class=\"col-12 mb-2 md:col-2 md:mb-0\" height=\"39px\"></p-skeleton>\r\n      <div class=\"col-12 md:col-10\">\r\n        <p-skeleton class=\"w-full\" height=\"39px\"></p-skeleton>\r\n      </div>\r\n    </div>\r\n    <div class=\"grid\">\r\n      <div class=\"col\">\r\n        <div class=\"flex justify-content-end w-full\">\r\n          <p-skeleton width=\"120px\" height=\"39px\" class=\"mx-2\"></p-skeleton>\r\n          <p-skeleton width=\"120px\" height=\"39px\" class=\"mx-2\"></p-skeleton>\r\n          <p-skeleton width=\"120px\" height=\"39px\" class=\"mx-2\"></p-skeleton>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </p-tabPanel>\r\n\r\n  <p-tabPanel *ngFor=\"let item of templates | keyvalue\" [header]=\"item.value.title || item.key\" [disabled]=\"isLoading\">\r\n    <form [formGroup]=\"formTabs[item.key]\" (ngSubmit)=\"submit(item.key, item.value, formTabs[item.key].value)\">\r\n      <div class=\"blockable-container\">\r\n        <div class=\"blockable-element\">\r\n          <rw-form [formGroup]=\"formTabs[item.key]\" [template]=\"item.value\" [apiName]=\"apiName\"></rw-form>\r\n        </div>\r\n        <div class=\"blockable-overlay\" *ngIf=\"isLoading\">\r\n          <p-progressSpinner></p-progressSpinner>\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"grid\">\r\n        <div class=\"col\">\r\n          <div class=\"flex justify-content-end w-full\">\r\n            <ng-template #defaultButtons>\r\n              <button pButton pRipple type=\"submit\" label=\"Save\" icon=\"far fa-save\" class=\"mx-2 p-button-success\" [disabled]=\"isLoading || !canSubmit(item.key)\"></button>\r\n              <button pButton pRipple type=\"button\" label=\"Reload\" icon=\"fas fa-redo\" class=\"mx-2 p-button-info\" (click)=\"load()\" [disabled]=\"isLoading\"></button>\r\n              <button pButton pRipple type=\"button\" label=\"Delete\" icon=\"far fa-trash-alt\" class=\"ml-2 p-button-danger\" (click)=\"showDeleteConfirmatioModal()\" [disabled]=\"!resource || isLoading || !canDelete\"></button>\r\n            </ng-template>\r\n            <ng-container *ngTemplateOutlet=\"buttonsRef || defaultButtons\"></ng-container>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </form>\r\n  </p-tabPanel>\r\n\r\n  <ng-template #defaultExtraTabs>\r\n  </ng-template>\r\n  <ng-container *ngTemplateOutlet=\"extraTabsRef || defaultExtraTabs\"></ng-container>\r\n\r\n</p-tabView>\r\n\r\n<p-toast></p-toast>\r\n<p-confirmDialog></p-confirmDialog>\r\n", styles: ["::ng-deep .p-tooltip{max-width:-moz-fit-content!important;max-width:fit-content!important}.blockable-container{display:grid;place-items:center;grid-template-areas:\"inner\"}.blockable-element{grid-area:inner;width:100%}.blockable-overlay{grid-area:inner;height:100%;width:100%;background-color:#0006;display:flex;align-items:center;justify-content:center;z-index:1}.field.grid>label.hasChildren{border-right:1px solid rgba(0,0,0,.1)}\n"], components: [{ type: i7$2.TabView, selector: "p-tabView", inputs: ["orientation", "style", "styleClass", "controlClose", "scrollable", "activeIndex"], outputs: ["onChange", "onClose", "activeIndexChange"] }, { type: i7$2.TabPanel, selector: "p-tabPanel", inputs: ["closable", "headerStyle", "headerStyleClass", "cache", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "selected", "disabled", "header", "leftIcon", "rightIcon"] }, { type: i8$1.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { type: RestworldEditFormComponent, selector: "rw-form", inputs: ["formGroup", "template", "apiName"] }, { type: i10$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["style", "styleClass", "strokeWidth", "fill", "animationDuration"] }, { type: i11.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { type: i12$1.ConfirmDialog, selector: "p-confirmDialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position"], outputs: ["onHide"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i14.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i14.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i14.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1$2.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { type: i10.Ripple, selector: "[pRipple]" }, { type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "keyvalue": i3$1.KeyValuePipe } });