@wavemaker/app-ng-runtime 12.0.0-next.44004 → 12.0.0-next.45001

app-ng-runtime/components/base/fesm2022/index.mjs

@@ -1012,9 +1012,10 @@ class BaseComponent {
         }
         else {
             this.delayedInit = true;
-            initPromise.then(() => {
+            initPromise.then((resolveFn) => {
                 this.initWidget();
                 this.setInitProps();
+                resolveFn && resolveFn();
             });
         }
     }
@@ -1221,11 +1222,11 @@ class BaseComponent {
      * @param {string} eventName
      * @param {string} expr
      */
-    processEventAttr(eventName, expr, meta) {
+    processEventAttr(eventName, expr, meta, child) {
         const fn = $parseEvent(expr);
         const locals = this.context;
-        locals.widget = this.widget;
-        const boundFn = fn.bind(undefined, this.viewParent, locals);
+        locals.widget = child ? child.widget : this.widget;
+        const boundFn = fn.bind(undefined, child ? this.viewParent.viewParent : this.viewParent, locals);
         const eventCallback = () => {
             let boundFnVal;
             $invokeWatchers(true);
@@ -1245,15 +1246,29 @@ class BaseComponent {
                 console.error(e);
             }
         };
-        this.eventHandlers.set(this.getMappedEventName(eventName), { callback: eventCallback, locals });
+        if (child) {
+            if (!child.widget.eventHandlers)
+                child.widget.eventHandlers = new Map();
+            child.widget.eventHandlers.set(this.getMappedEventName(eventName), { callback: eventCallback, locals });
+        }
+        else
+            this.eventHandlers.set(this.getMappedEventName(eventName), { callback: eventCallback, locals });
         // prepend eventName with on and convert it to camelcase.
         // eg, "click" ---> onClick
         const onEventName = _.camelCase(`on-${eventName}`);
         // save the eventCallback in widgetScope.
-        this[onEventName] = eventCallback;
+        if (child) {
+            child.widget[onEventName] = eventCallback;
+        }
+        else
+            this[onEventName] = eventCallback;
         // events needs to be setup after viewInit
         this.toBeSetupEventsQueue.push(() => {
-            this.handleEvent(this.nativeElement, this.getMappedEventName(eventName), eventCallback, locals, meta);
+            if (child) {
+                this.handleEvent(child.nativeElement, this.getMappedEventName(eventName), eventCallback, locals, meta);
+            }
+            else
+                this.handleEvent(this.nativeElement, this.getMappedEventName(eventName), eventCallback, locals, meta);
         });
     }
     /**
@@ -1285,13 +1300,16 @@ class BaseComponent {
             }
         }
     }
+    processChildAttr(attrName, attrValue, child) {
+        this.processAttr(attrName, attrValue, child);
+    }
     /**
      * Process the attribute
      * If the attribute is an event expression, generate a functional representation of the expression
      *      and keep in eventHandlers
      * If the attribute is a bound expression, register a watch on the expression
      */
-    processAttr(attrName, attrValue) {
+    processAttr(attrName, attrValue, child) {
         // console.log("====attrName=====", attrName, "=====typeof attrname=====", typeof attrName, "-----attrValue----", attrValue);
         const { 0: propName, 1: type, 2: meta, length } = attrName.split('.');
         if (type === 'bind') {
@@ -1302,7 +1320,7 @@ class BaseComponent {
             this.processBindAttr(propName, attrValue);
         }
         else if (type === 'event') {
-            this.processEventAttr(propName, attrValue, meta);
+            this.processEventAttr(propName, attrValue, meta, child);
         }
         else if (length === 1) {
             // remove class and name attributes. Component will set them on the proper node
@@ -2023,6 +2041,40 @@ class PartialContainerDirective {
                 args: ['content']
             }] }, { type: i0.ComponentFactoryResolver }, { type: i1.PartialRefProvider }]; }, null); })();
 
+class CustomWidgetContainerDirective {
+    constructor(componentInstance, vcRef, elRef, inj, app, widgetname, customWidgetRefProvider) {
+        this.componentInstance = componentInstance;
+        this.vcRef = vcRef;
+        this.elRef = elRef;
+        this.inj = inj;
+        this.app = app;
+        this.customWidgetRefProvider = customWidgetRefProvider;
+        const widgetnames = this.componentInstance.widgetname;
+        this.customWidgetRefProvider.getComponentFactoryRef(widgetname, ComponentType.WIDGET).then((componentFactory) => {
+            if (componentFactory) {
+                const instanceRef = this.vcRef.createComponent(componentFactory, 0, this.inj);
+                this.elRef.nativeElement.appendChild(instanceRef.location.nativeElement);
+            }
+        });
+    }
+    static { this.ɵfac = function CustomWidgetContainerDirective_Factory(t) { return new (t || CustomWidgetContainerDirective)(i0.ɵɵdirectiveInject(WidgetRef, 2), i0.ɵɵdirectiveInject(i0.ViewContainerRef), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.Injector), i0.ɵɵdirectiveInject(i1.App), i0.ɵɵinjectAttribute('widgetname'), i0.ɵɵdirectiveInject(i1.CustomWidgetRefProvider)); }; }
+    static { this.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: CustomWidgetContainerDirective, selectors: [["", "customWidgetContainer", "", "widgetname", ""]] }); }
+}
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CustomWidgetContainerDirective, [{
+        type: Directive,
+        args: [{
+                selector: '[customWidgetContainer][widgetname]'
+            }]
+    }], function () { return [{ type: undefined, decorators: [{
+                type: Self
+            }, {
+                type: Inject,
+                args: [WidgetRef]
+            }] }, { type: i0.ViewContainerRef }, { type: i0.ElementRef }, { type: i0.Injector }, { type: i1.App }, { type: undefined, decorators: [{
+                type: Attribute,
+                args: ['widgetname']
+            }] }, { type: i1.CustomWidgetRefProvider }]; }, null); })();
+
 class ShowInDeviceDirective {
     constructor(elRef, widget, viewContainerRef, inj, templateRef) {
         this.elRef = elRef;
@@ -3029,6 +3081,7 @@ const wmComponents = [
     PartialParamHandlerDirective,
     PartialParamDirective,
     PartialContainerDirective,
+    CustomWidgetContainerDirective,
     RedrawableDirective,
     ShowInDeviceDirective,
     SmoothScrollDirective,
@@ -3096,6 +3149,7 @@ class WmComponentsModule {
         PartialParamHandlerDirective,
         PartialParamDirective,
         PartialContainerDirective,
+        CustomWidgetContainerDirective,
         RedrawableDirective,
         ShowInDeviceDirective,
         SmoothScrollDirective,
@@ -3126,6 +3180,7 @@ class WmComponentsModule {
         PartialParamHandlerDirective,
         PartialParamDirective,
         PartialContainerDirective,
+        CustomWidgetContainerDirective,
         RedrawableDirective,
         ShowInDeviceDirective,
         SmoothScrollDirective,
@@ -5144,5 +5199,5 @@ const updateDeviceView = (element, isTablet = false) => {
  * Generated bundle index. Do not edit.
  */
 
-export { ALLFIELDS, APPLY_STYLES_TYPE, AUTOCLOSE_TYPE, BaseComponent, BaseContainerComponent, BaseFieldValidations, ContainerDirective, Context, CustomPipe, DEBOUNCE_TIMES, DISPLAY_TYPE, DataSetItem, DatasetAwareNavComponent, DialogRef, DialogServiceImpl, EDIT_MODE, EVENTS_MAP, FileExtensionFromMimePipe, FileIconClassPipe, FileSizePipe, FilterPipe, INPUTMODE, ImagePipe, ItemTemplateDirective, LIVE_CONSTANTS, LazyLoadDirective, Live_Operations, MessageComponent, NAVIGATION_TYPE, NumberToStringPipe, PROP_ANY, PROP_BOOLEAN, PROP_NUMBER, PROP_STRING, PROP_TYPE, PartialContainerDirective, PartialDirective, PartialParamDirective, PartialParamHandlerDirective, PrefixPipe, PullToRefresh, RedrawableDirective, RepeatTemplateDirective, SanitizePipe, ShowInDeviceDirective, SmoothScrollDirective, StateClassPipe, StringToNumberPipe, StylableComponent, SuffixPipe, TextContentDirective, TimeFromNowPipe, ToCurrencyPipe, ToDatePipe, ToNumberPipe, TrailingZeroDecimalPipe, TrustAsPipe, WidgetConfig, WidgetRef, WmComponentsModule, applyFilterOnField, configureDnD, convertDataToObject, createArrayFrom, extractDataAsArray, extractDataSourceName, fetchDistinctValues, fetchRelatedFieldData, filterDate, getBackGroundImageUrl, getConditionalClasses, getContainerTargetClass, getDataTableFilterWidget, getDefaultValue, getDefaultViewModeWidget, getDistinctFieldProperties, getDistinctValues, getDistinctValuesForField, getEditModeWidget, getEmptyMatchMode, getEnableEmptyFilter, getEvaluatedData, getFieldLayoutConfig, getFieldTypeWidgetTypesMap, getImageUrl, getKeyboardFocusableElements, getMatchModeMsgs, getMatchModeTypesMap, getObjValueByKey, getOrderByExpr, getOrderedDataset, getRangeFieldValue, getRangeMatchMode, getRowOperationsColumn, getUniqObjsByDataField, getWatchIdentifier, getWidgetPropsByType, groupData, handleHeaderClick, hasLinkToCurrentPage, interpolateBindExpressions, isActiveNavItem, isBooleanAttr, isDataSetWidget, isDimensionProp, isStyle, parseValueByType, performDataOperation, prepareFieldDefs, propNameCSSKeyMap, provideAs, provideAsDialogRef, provideAsWidgetRef, refreshDataSource, register$1 as register, registerFormWidget, setFocusTrap, setHeaderConfig, setHeaderConfigForTable, setItemByCompare, styler, toggleAllHeaders, transformData, transformDataWithKeys, transformFormData, unsupportedStatePersistenceTypes, updateDeviceView };
+export { ALLFIELDS, APPLY_STYLES_TYPE, AUTOCLOSE_TYPE, BaseComponent, BaseContainerComponent, BaseFieldValidations, ContainerDirective, Context, CustomPipe, CustomWidgetContainerDirective, DEBOUNCE_TIMES, DISPLAY_TYPE, DataSetItem, DatasetAwareNavComponent, DialogRef, DialogServiceImpl, EDIT_MODE, EVENTS_MAP, FileExtensionFromMimePipe, FileIconClassPipe, FileSizePipe, FilterPipe, INPUTMODE, ImagePipe, ItemTemplateDirective, LIVE_CONSTANTS, LazyLoadDirective, Live_Operations, MessageComponent, NAVIGATION_TYPE, NumberToStringPipe, PROP_ANY, PROP_BOOLEAN, PROP_NUMBER, PROP_STRING, PROP_TYPE, PartialContainerDirective, PartialDirective, PartialParamDirective, PartialParamHandlerDirective, PrefixPipe, PullToRefresh, RedrawableDirective, RepeatTemplateDirective, SanitizePipe, ShowInDeviceDirective, SmoothScrollDirective, StateClassPipe, StringToNumberPipe, StylableComponent, SuffixPipe, TextContentDirective, TimeFromNowPipe, ToCurrencyPipe, ToDatePipe, ToNumberPipe, TrailingZeroDecimalPipe, TrustAsPipe, WidgetConfig, WidgetRef, WmComponentsModule, applyFilterOnField, configureDnD, convertDataToObject, createArrayFrom, extractDataAsArray, extractDataSourceName, fetchDistinctValues, fetchRelatedFieldData, filterDate, getBackGroundImageUrl, getConditionalClasses, getContainerTargetClass, getDataTableFilterWidget, getDefaultValue, getDefaultViewModeWidget, getDistinctFieldProperties, getDistinctValues, getDistinctValuesForField, getEditModeWidget, getEmptyMatchMode, getEnableEmptyFilter, getEvaluatedData, getFieldLayoutConfig, getFieldTypeWidgetTypesMap, getImageUrl, getKeyboardFocusableElements, getMatchModeMsgs, getMatchModeTypesMap, getObjValueByKey, getOrderByExpr, getOrderedDataset, getRangeFieldValue, getRangeMatchMode, getRowOperationsColumn, getUniqObjsByDataField, getWatchIdentifier, getWidgetPropsByType, groupData, handleHeaderClick, hasLinkToCurrentPage, interpolateBindExpressions, isActiveNavItem, isBooleanAttr, isDataSetWidget, isDimensionProp, isStyle, parseValueByType, performDataOperation, prepareFieldDefs, propNameCSSKeyMap, provideAs, provideAsDialogRef, provideAsWidgetRef, refreshDataSource, register$1 as register, registerFormWidget, setFocusTrap, setHeaderConfig, setHeaderConfigForTable, setItemByCompare, styler, toggleAllHeaders, transformData, transformDataWithKeys, transformFormData, unsupportedStatePersistenceTypes, updateDeviceView };
 //# sourceMappingURL=index.mjs.map