@wavemaker/app-ng-runtime 12.0.0-next.140534 → 12.0.0-next.141130

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

@@ -1016,9 +1016,10 @@ class BaseComponent {
         }
         else {
             this.delayedInit = true;
-            initPromise.then(() => {
+            initPromise.then((resolveFn) => {
                 this.initWidget();
                 this.setInitProps();
+                resolveFn && resolveFn();
             });
         }
         if (explicitContext) {
@@ -1228,11 +1229,12 @@ 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);
+        let widget = child ? child.widget : this, nativeElement = child ? child.nativeElement : this.nativeElement;
         const eventCallback = () => {
             let boundFnVal;
             $invokeWatchers(true);
@@ -1252,24 +1254,32 @@ class BaseComponent {
                 console.error(e);
             }
         };
-        this.eventHandlers.set(this.getMappedEventName(eventName), { callback: eventCallback, locals });
+        if (child && !child.widget.eventHandlers)
+            child.widget.eventHandlers = new Map();
+        widget.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;
+        widget[onEventName] = eventCallback;
         // events needs to be setup after viewInit
         this.toBeSetupEventsQueue.push(() => {
-            this.handleEvent(this.nativeElement, this.getMappedEventName(eventName), eventCallback, locals, meta);
+            this.handleEvent(nativeElement, this.getMappedEventName(eventName), eventCallback, locals, meta);
         });
     }
     /**
      * Process the bound property
      * Register a watch on the bound expression
      */
-    processBindAttr(propName, expr) {
-        this.initState.delete(propName);
-        this.registerDestroyListener($watch(expr, this.viewParent, this.context, nv => this.widget[propName] = nv, getWatchIdentifier(this.widgetId, propName), propName === 'datasource', this.widgetProps.get(propName), () => this.isMuted));
+    processBindAttr(propName, expr, child) {
+        if (!child)
+            this.initState.delete(propName);
+        let viewParent = child ? child.widget.viewParent.viewParent : this.viewParent, context = child ? child.widget.context : this.context, widget = child ? child.widget : this.widget, isMuted = child ? child.widget.isMuted : this.isMuted, widgetProps = child ? child.widget.widgetProps : this.widgetProps, widgetId = child ? child.widget.widgetId : this.widgetId;
+        this.registerDestroyListener($watch(expr, viewParent, context, nv => {
+            if (propName.startsWith('base-'))
+                widget.updateData(propName, nv);
+            widget[propName] = nv;
+        }, getWatchIdentifier(widgetId, propName), propName === 'datasource', widgetProps.get(propName), () => isMuted));
     }
     /**
      * Remove watch on the bound property
@@ -1298,7 +1308,7 @@ class BaseComponent {
      *      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') {
@@ -1306,10 +1316,10 @@ class BaseComponent {
             if (propName === 'show') {
                 this.nativeElement.hidden = true;
             }
-            this.processBindAttr(propName, attrValue);
+            this.processBindAttr(propName, attrValue, child);
         }
-        else if (type === 'event') {
-            this.processEventAttr(propName, attrValue, meta);
+        else if (type === 'event' && !this.nativeElement.hasAttribute('customwidgetcontainer')) {
+            this.processEventAttr(propName, attrValue, meta, child);
         }
         else if (length === 1) {
             // remove class and name attributes. Component will set them on the proper node
@@ -2090,6 +2100,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", ""]] }); }
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CustomWidgetContainerDirective, [{
+        type: Directive,
+        args: [{
+                selector: '[customWidgetContainer][widgetname]'
+            }]
+    }], () => [{ 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(viewContainerRef, inj, templateRef, explicitContext) {
         this.viewContainerRef = viewContainerRef;
@@ -3096,6 +3140,7 @@ const wmComponents = [
     PartialParamHandlerDirective,
     PartialParamDirective,
     PartialContainerDirective,
+    CustomWidgetContainerDirective,
     RedrawableDirective,
     ShowInDeviceDirective,
     SmoothScrollDirective,
@@ -3163,6 +3208,7 @@ class WmComponentsModule {
         PartialParamHandlerDirective,
         PartialParamDirective,
         PartialContainerDirective,
+        CustomWidgetContainerDirective,
         RedrawableDirective,
         ShowInDeviceDirective,
         SmoothScrollDirective,
@@ -3193,6 +3239,7 @@ class WmComponentsModule {
         PartialParamHandlerDirective,
         PartialParamDirective,
         PartialContainerDirective,
+        CustomWidgetContainerDirective,
         RedrawableDirective,
         ShowInDeviceDirective,
         SmoothScrollDirective,
@@ -4252,13 +4299,7 @@ const setHeaderConfig = (headerConfig, config, field, index) => {
     forEach(headerConfig, cols => {
         if (get(cols, 'isGroup')) {
             if (cols.field === field) {
-                const id = cols.columns?.findIndex((col) => col?.field === config.field);
-                if (id == -1) {
-                    cols.columns[index] = config;
-                }
-                else {
-                    cols.columns[id] = config;
-                }
+                cols.columns[index] = config;
             }
             else {
                 setHeaderConfig(cols.columns, config, field, index);
@@ -5252,5 +5293,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, widgetIdGenerator };
+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, widgetIdGenerator };
 //# sourceMappingURL=index.mjs.map