@wavemaker/app-ng-runtime 11.10.5-rc.6100 → 11.11.0-rc.209

package/components/chart/public_api.d.ts

@@ -1,2 +1 @@
-export * from './chart.module';
 export * from './chart.component';

package/components/containers/accordion/accordion-pane/accordion-pane.component.d.ts

@@ -41,5 +41,5 @@ export declare class AccordionPaneComponent extends StylableComponent implements
     onPropertyChange(key: any, nv: any, ov: any): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<AccordionPaneComponent, [null, null, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AccordionPaneComponent, "div[wmAccordionPane]", ["wmAccordionPane"], {}, {}, ["reDrawableComponents"], ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AccordionPaneComponent, "div[wmAccordionPane]", ["wmAccordionPane"], {}, {}, ["reDrawableComponents"], ["*"], true, never>;
 }

package/components/containers/accordion/accordion.directive.d.ts

@@ -55,5 +55,5 @@ export declare class AccordionDirective extends StylableComponent implements Aft
     onPropertyChange(key: string, nv: any, ov?: any): void;
     ngAfterContentInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<AccordionDirective, [null, null, null, { optional: true; }]>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<AccordionDirective, "div[wmAccordion]", ["wmAccordion"], {}, {}, ["panes"], never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<AccordionDirective, "div[wmAccordion]", ["wmAccordion"], {}, {}, ["panes"], never, true, never>;
 }

package/components/containers/accordion/bundles/index.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@wm/components/base'), require('@wm/core'), require('lodash-es')) :
-    typeof define === 'function' && define.amd ? define(['exports', '@angular/core', '@angular/common', '@wm/components/base', '@wm/core', 'lodash-es'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.wm = global.wm || {}, global.wm.components = global.wm.components || {}, global.wm.components.containers = global.wm.components.containers || {}, global.wm.components.containers.accordion = {}), global.ng.core, global.ng.common, global.wm.components.base, global.wm.core, global._));
-})(this, (function (exports, i0, i2, i3, i1, lodashEs) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/common'), require('@wm/components/base'), require('@angular/core'), require('@wm/core'), require('lodash-es')) :
+    typeof define === 'function' && define.amd ? define(['exports', '@angular/common', '@wm/components/base', '@angular/core', '@wm/core', 'lodash-es'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.wm = global.wm || {}, global.wm.components = global.wm.components || {}, global.wm.components.containers = global.wm.components.containers || {}, global.wm.components.containers.accordion = {}), global.ng.common, global.wm.components.base, global.ng.core, global.wm.core, global._));
+})(this, (function (exports, i2, base, i0, i1, lodashEs) { 'use strict';
 
     function _interopNamespaceDefault(e) {
         var n = Object.create(null);
@@ -21,229 +21,61 @@
         return Object.freeze(n);
     }
 
-    var i0__namespace = /*#__PURE__*/_interopNamespaceDefault(i0);
     var i2__namespace = /*#__PURE__*/_interopNamespaceDefault(i2);
-    var i3__namespace = /*#__PURE__*/_interopNamespaceDefault(i3);
+    var i0__namespace = /*#__PURE__*/_interopNamespaceDefault(i0);
     var i1__namespace = /*#__PURE__*/_interopNamespaceDefault(i1);
 
     const registerProps$1 = () => {
-        i3.register('wm-accordion', new Map([
-            ['class', i3.PROP_STRING],
-            ['closeothers', { value: true, ...i3.PROP_BOOLEAN }],
-            ['dataset', i3.PROP_ANY],
-            ['defaultpaneindex', { value: 0, ...i3.PROP_NUMBER }],
-            ['name', i3.PROP_STRING],
-            ['nodatamessage', { value: 'No Data Found', ...i3.PROP_STRING }],
-            ['show', { value: true, ...i3.PROP_BOOLEAN }],
-            ['statehandler', { value: 'none', ...i3.PROP_STRING }],
-            ['tabindex', { value: 0, ...i3.PROP_NUMBER }],
-            ['type', i3.PROP_STRING]
+        base.register('wm-accordionpane', new Map([
+            ['active', base.PROP_BOOLEAN], // internal property
+            ['badgetype', { value: 'default', ...base.PROP_STRING }],
+            ['badgevalue', base.PROP_STRING],
+            ['class', base.PROP_STRING],
+            ['content', base.PROP_STRING],
+            ['dynamicPaneIndex', base.PROP_NUMBER], // internal property
+            ['iconclass', base.PROP_STRING],
+            ['isdefaultpane', base.PROP_BOOLEAN],
+            ['isdynamic', base.PROP_STRING], // internal property
+            ['name', base.PROP_STRING],
+            ['show', { value: true, ...base.PROP_BOOLEAN }],
+            ['smoothscroll', { value: false, ...base.PROP_BOOLEAN }],
+            ['subheading', base.PROP_STRING],
+            ['tabindex', { value: 0, ...base.PROP_NUMBER }],
+            ['title', { value: 'Title', ...base.PROP_STRING }]
         ]));
     };
 
     const registerProps = () => {
-        i3.register('wm-accordionpane', new Map([
-            ['active', i3.PROP_BOOLEAN], // internal property
-            ['badgetype', { value: 'default', ...i3.PROP_STRING }],
-            ['badgevalue', i3.PROP_STRING],
-            ['class', i3.PROP_STRING],
-            ['content', i3.PROP_STRING],
-            ['dynamicPaneIndex', i3.PROP_NUMBER], // internal property
-            ['iconclass', i3.PROP_STRING],
-            ['isdefaultpane', i3.PROP_BOOLEAN],
-            ['isdynamic', i3.PROP_STRING], // internal property
-            ['name', i3.PROP_STRING],
-            ['show', { value: true, ...i3.PROP_BOOLEAN }],
-            ['smoothscroll', { value: false, ...i3.PROP_BOOLEAN }],
-            ['subheading', i3.PROP_STRING],
-            ['tabindex', { value: 0, ...i3.PROP_NUMBER }],
-            ['title', { value: 'Title', ...i3.PROP_STRING }]
+        base.register('wm-accordion', new Map([
+            ['class', base.PROP_STRING],
+            ['closeothers', { value: true, ...base.PROP_BOOLEAN }],
+            ['dataset', base.PROP_ANY],
+            ['defaultpaneindex', { value: 0, ...base.PROP_NUMBER }],
+            ['name', base.PROP_STRING],
+            ['nodatamessage', { value: 'No Data Found', ...base.PROP_STRING }],
+            ['show', { value: true, ...base.PROP_BOOLEAN }],
+            ['statehandler', { value: 'none', ...base.PROP_STRING }],
+            ['tabindex', { value: 0, ...base.PROP_NUMBER }],
+            ['type', base.PROP_STRING]
         ]));
     };
 
-    const _c0 = ["wmAccordionPane", ""];
-    const _c1 = ["*"];
-    const _c2 = a0 => ({ active: a0 });
-    const DEFAULT_CLS$1 = 'app-accordion-panel panel';
-    const WIDGET_CONFIG$1 = { widgetType: 'wm-accordionpane', hostClass: DEFAULT_CLS$1 };
-    class AccordionPaneComponent extends i3.StylableComponent {
-        static { this.initializeProps = registerProps(); }
-        constructor(inj, accordionRef, explicitContext) {
-            super(inj, WIDGET_CONFIG$1, explicitContext);
-            this.accordionRef = accordionRef;
-            this.isActive = false;
-            this.$lazyLoad = i1.noop;
-            i3.styler(this.nativeElement, this, i3.APPLY_STYLES_TYPE.SHELL);
-            // title property here serves the purpose of heading.
-            // remove title property as attribute
-            i1.removeAttr(this.nativeElement, 'title');
-        }
-        /**
-         * handles the pane expand
-         * invoke $lazyLoad method which takes care of loading the partial when the content property is provided - lazyLoading or partial
-         * invoke redraw on the re-drawable children
-         * invoke expand callback
-         * notify parent about the change
-         * @param {Event} evt
-         */
-        expand(evt) {
-            if (this.isActive) {
-                return;
-            }
-            this.isActive = true;
-            this.$lazyLoad();
-            this.redrawChildren();
-            this.invokeEventCallback('expand', { $event: evt });
-            this.notifyParent(true, evt);
-        }
-        /**
-         * handles the pane collapse
-         * invoke collapse callback
-         * notify parent about the change
-         * @param {Event} evt
-         */
-        collapse(evt) {
-            if (!this.isActive) {
-                return;
-            }
-            this.isActive = false;
-            this.invokeEventCallback('collapse', { $event: evt });
-            this.notifyParent(false, evt);
-        }
-        remove() {
-            const paneIndex = this.accordionRef.getPaneIndexByRef(this);
-            if (this.isActive && this.accordionRef.panes.length > 1) {
-                this === this.accordionRef.panes.last ? this.accordionRef.panes.toArray()[paneIndex - 1].expand() : this.accordionRef.panes.toArray()[paneIndex + 1].expand();
-            }
-            const availablePanes = this.accordionRef.panes.toArray();
-            availablePanes.splice(this.accordionRef.getPaneIndexByRef(this), 1);
-            this.accordionRef.panes.reset([...availablePanes]);
-            this.nativeElement.remove();
-        }
-        toggle(evt) {
-            if (this.isActive) {
-                this.collapse(evt);
-            }
-            else {
-                this.expand(evt);
-            }
-        }
-        // Todo - Vinay externalize
-        redrawChildren() {
-            setTimeout(() => {
-                if (this.reDrawableComponents) {
-                    this.reDrawableComponents.forEach(c => c.redraw());
-                }
-            }, 100);
-        }
-        notifyParent(isExpand, evt) {
-            this.accordionRef.notifyChange(this, isExpand, evt);
-        }
-        onPropertyChange(key, nv, ov) {
-            if (key === 'content') {
-                if (this.isActive) {
-                    setTimeout(() => this.$lazyLoad(), 100);
-                }
-            }
-            else if (key === 'tabindex') {
-                return;
-            }
-            else {
-                super.onPropertyChange(key, nv, ov);
-            }
-        }
-        ngAfterViewInit() {
-            super.ngAfterViewInit();
-            i3.styler(this.nativeElement.querySelector('.panel-body'), this, i3.APPLY_STYLES_TYPE.INNER_SHELL);
-            if (this.isdynamic) {
-                this.accordionRef.registerDynamicPane(this);
-            }
-        }
-        static { this.ɵfac = function AccordionPaneComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || AccordionPaneComponent)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(AccordionDirective), i0__namespace.ɵɵdirectiveInject('EXPLICIT_CONTEXT', 8)); }; }
-        static { this.ɵcmp = /*@__PURE__*/ i0__namespace.ɵɵdefineComponent({ type: AccordionPaneComponent, selectors: [["div", "wmAccordionPane", ""]], contentQueries: function AccordionPaneComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
-                i0__namespace.ɵɵcontentQuery(dirIndex, i3.RedrawableDirective, 5);
-            } if (rf & 2) {
-                let _t;
-                i0__namespace.ɵɵqueryRefresh(_t = i0__namespace.ɵɵloadQuery()) && (ctx.reDrawableComponents = _t);
-            } }, exportAs: ["wmAccordionPane"], features: [i0__namespace.ɵɵProvidersFeature([
-                    i3.provideAsWidgetRef(AccordionPaneComponent)
-                ]), i0__namespace.ɵɵInheritDefinitionFeature], attrs: _c0, ngContentSelectors: _c1, decls: 16, vars: 21, consts: [[1, "panel-heading", "clearfix", 3, "click", "ngClass"], [1, "panel-title"], ["href", "javascript:void(0);", "role", "button", 1, "accordion-toggle", "clearfix", 3, "tabindex"], [1, "pull-left"], [3, "hidden"], [1, "heading", 3, "innerHTML"], [1, "description", 3, "innerHTML"], [1, "panel-actions", "pull-right"], [1, "app-icon", "panel-action", "wi", 3, "title"], [3, "ngClass"], [1, "panel-collapse", "collapse", 3, "ngClass"], ["partial-container-target", "", 1, "panel-body", 3, "wmSmoothscroll"]], template: function AccordionPaneComponent_Template(rf, ctx) { if (rf & 1) {
-                i0__namespace.ɵɵprojectionDef();
-                i0__namespace.ɵɵelementStart(0, "div", 0);
-                i0__namespace.ɵɵlistener("click", function AccordionPaneComponent_Template_div_click_0_listener($event) { return ctx.toggle($event); });
-                i0__namespace.ɵɵelementStart(1, "h3", 1)(2, "a", 2)(3, "div", 3);
-                i0__namespace.ɵɵelement(4, "i", 4);
-                i0__namespace.ɵɵelementEnd();
-                i0__namespace.ɵɵelementStart(5, "div", 3);
-                i0__namespace.ɵɵelement(6, "div", 5)(7, "div", 6);
-                i0__namespace.ɵɵelementEnd();
-                i0__namespace.ɵɵelementStart(8, "div", 7)(9, "span");
-                i0__namespace.ɵɵtext(10);
-                i0__namespace.ɵɵelementEnd();
-                i0__namespace.ɵɵelementStart(11, "span", 8);
-                i0__namespace.ɵɵelement(12, "i", 9);
-                i0__namespace.ɵɵelementEnd()()()()();
-                i0__namespace.ɵɵelementStart(13, "div", 10)(14, "div", 11);
-                i0__namespace.ɵɵprojection(15);
-                i0__namespace.ɵɵelementEnd()();
-            } if (rf & 2) {
-                i0__namespace.ɵɵproperty("ngClass", i0__namespace.ɵɵpureFunction1(19, _c2, ctx.isActive));
-                i0__namespace.ɵɵadvance(2);
-                i0__namespace.ɵɵproperty("tabindex", ctx.tabindex);
-                i0__namespace.ɵɵattribute("aria-expanded", ctx.isActive);
-                i0__namespace.ɵɵadvance(2);
-                i0__namespace.ɵɵclassMapInterpolate1("app-icon panel-icon ", ctx.iconclass, "");
-                i0__namespace.ɵɵproperty("hidden", !ctx.iconclass);
-                i0__namespace.ɵɵadvance(2);
-                i0__namespace.ɵɵproperty("innerHTML", ctx.title, i0__namespace.ɵɵsanitizeHtml);
-                i0__namespace.ɵɵadvance();
-                i0__namespace.ɵɵproperty("innerHTML", ctx.subheading, i0__namespace.ɵɵsanitizeHtml);
-                i0__namespace.ɵɵadvance(2);
-                i0__namespace.ɵɵclassMapInterpolate1("label label-", ctx.badgetype, "");
-                i0__namespace.ɵɵadvance();
-                i0__namespace.ɵɵtextInterpolate(ctx.badgevalue);
-                i0__namespace.ɵɵadvance();
-                i0__namespace.ɵɵpropertyInterpolate2("title", "", ctx.appLocale.LABEL_COLLAPSE, "/", ctx.appLocale.LABEL_EXPAND, "");
-                i0__namespace.ɵɵadvance();
-                i0__namespace.ɵɵproperty("ngClass", ctx.isActive ? "wi-minus" : "wi-plus");
-                i0__namespace.ɵɵadvance();
-                i0__namespace.ɵɵproperty("ngClass", ctx.isActive ? "collapse in" : "collapse");
-                i0__namespace.ɵɵadvance();
-                i0__namespace.ɵɵproperty("wmSmoothscroll", ctx.smoothscroll);
-            } }, dependencies: [i2__namespace.NgClass, i3__namespace.SmoothScrollDirective], encapsulation: 2 }); }
-    }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(AccordionPaneComponent, [{
-            type: i0.Component,
-            args: [{ selector: 'div[wmAccordionPane]', providers: [
-                        i3.provideAsWidgetRef(AccordionPaneComponent)
-                    ], exportAs: 'wmAccordionPane', template: "<div class=\"panel-heading clearfix\" (click)=\"toggle($event)\" [ngClass]=\"{active: isActive}\">\n    <h3 class=\"panel-title\">\n        <a [attr.aria-expanded]=\"isActive\" [tabindex]=\"tabindex\"\n           class=\"accordion-toggle clearfix\"\n           href=\"javascript:void(0);\" role=\"button\">\n            <div class=\"pull-left\">\n                <i class=\"app-icon panel-icon {{iconclass}}\" [hidden]=\"!iconclass\"></i>\n            </div>\n            <div class=\"pull-left\">\n                <div class=\"heading\" [innerHTML]=\"title\"></div>\n                <div class=\"description\" [innerHTML]=\"subheading\"></div>\n            </div>\n            <div class=\"panel-actions pull-right\">\n                <span class=\"label label-{{badgetype}}\">{{ badgevalue }}</span>\n                <span class=\"app-icon panel-action wi\"\n                      title=\"{{appLocale.LABEL_COLLAPSE}}/{{appLocale.LABEL_EXPAND}}\">\n                <i [ngClass]=\"isActive ? 'wi-minus' : 'wi-plus'\"></i>\n            </span>\n            </div>\n        </a>\n    </h3>\n</div>\n<div [ngClass]=\"isActive ? 'collapse in' : 'collapse'\" class=\"panel-collapse collapse\">\n    <div class=\"panel-body\" [wmSmoothscroll]=\"smoothscroll\" partial-container-target>\n        <ng-content></ng-content>\n    </div>\n</div>\n" }]
-        }], () => [{ type: i0__namespace.Injector }, { type: AccordionDirective }, { type: undefined, decorators: [{
-                    type: i0.Inject,
-                    args: ['EXPLICIT_CONTEXT']
-                }, {
-                    type: i0.Optional
-                }] }], { reDrawableComponents: [{
-                type: i0.ContentChildren,
-                args: [i3.RedrawableDirective, { descendants: true }]
-            }] }); })();
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassDebugInfo(AccordionPaneComponent, { className: "AccordionPaneComponent", filePath: "accordion-pane/accordion-pane.component.ts", lineNumber: 27 }); })();
-
-    const DEFAULT_CLS = 'app-accordion panel-group';
-    const WIDGET_CONFIG = {
+    const DEFAULT_CLS$1 = 'app-accordion panel-group';
+    const WIDGET_CONFIG$1 = {
         widgetType: 'wm-accordion',
-        hostClass: DEFAULT_CLS
+        hostClass: DEFAULT_CLS$1
     };
-    class AccordionDirective extends i3.StylableComponent {
-        static { this.initializeProps = registerProps$1(); }
+    class AccordionDirective extends base.StylableComponent {
+        static { this.initializeProps = registerProps(); }
         constructor(inj, statePersistence, dynamicComponentProvider, explicitContext) {
             let resolveFn = i1.noop;
-            super(inj, WIDGET_CONFIG, explicitContext, new Promise(res => resolveFn = res));
+            super(inj, WIDGET_CONFIG$1, explicitContext, new Promise(res => resolveFn = res));
             this.promiseResolverFn = resolveFn;
             this.statePersistence = statePersistence;
             this.dynamicComponentProvider = dynamicComponentProvider;
             this.dynamicPanes = [];
             this.dynamicPaneIndex = 0;
-            i3.styler(this.nativeElement, this, i3.APPLY_STYLES_TYPE.SCROLLABLE_CONTAINER);
+            base.styler(this.nativeElement, this, base.APPLY_STYLES_TYPE.SCROLLABLE_CONTAINER);
         }
         /**
          * AccordionPane children components invoke this method to communicate with the parent
@@ -389,7 +221,7 @@
             this.panes.toArray()[index].expand();
         }
         onDataChange(newVal) {
-            this.fieldDefs = i3.createArrayFrom(newVal);
+            this.fieldDefs = base.createArrayFrom(newVal);
         }
         onPropertyChange(key, nv, ov) {
             if (key === 'defaultpaneindex') {
@@ -442,17 +274,18 @@
             } if (rf & 2) {
                 let _t;
                 i0__namespace.ɵɵqueryRefresh(_t = i0__namespace.ɵɵloadQuery()) && (ctx.panes = _t);
-            } }, exportAs: ["wmAccordion"], features: [i0__namespace.ɵɵProvidersFeature([
-                    i3.provideAsWidgetRef(AccordionDirective)
+            } }, exportAs: ["wmAccordion"], standalone: true, features: [i0__namespace.ɵɵProvidersFeature([
+                    base.provideAsWidgetRef(AccordionDirective)
                 ]), i0__namespace.ɵɵInheritDefinitionFeature] }); }
     }
     (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(AccordionDirective, [{
             type: i0.Directive,
             args: [{
+                    standalone: true,
                     selector: 'div[wmAccordion]',
                     exportAs: 'wmAccordion',
                     providers: [
-                        i3.provideAsWidgetRef(AccordionDirective)
+                        base.provideAsWidgetRef(AccordionDirective)
                     ]
                 }]
         }], () => [{ type: i0__namespace.Injector }, { type: i1__namespace.StatePersistence }, { type: i1__namespace.DynamicComponentRefProvider }, { type: undefined, decorators: [{
@@ -462,37 +295,175 @@
                     type: i0.Optional
                 }] }], { panes: [{
                 type: i0.ContentChildren,
-                args: [AccordionPaneComponent]
+                args: [i0.forwardRef(() => AccordionPaneComponent)]
             }] }); })();
 
-    const components = [
-        AccordionPaneComponent,
-        AccordionDirective
-    ];
-    class AccordionModule {
-        static { this.ɵfac = function AccordionModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || AccordionModule)(); }; }
-        static { this.ɵmod = /*@__PURE__*/ i0__namespace.ɵɵdefineNgModule({ type: AccordionModule }); }
-        static { this.ɵinj = /*@__PURE__*/ i0__namespace.ɵɵdefineInjector({ imports: [i2.CommonModule,
-                i3.WmComponentsModule] }); }
+    const _c0 = ["wmAccordionPane", ""];
+    const _c1 = ["*"];
+    const _c2 = a0 => ({ active: a0 });
+    const DEFAULT_CLS = 'app-accordion-panel panel';
+    const WIDGET_CONFIG = { widgetType: 'wm-accordionpane', hostClass: DEFAULT_CLS };
+    class AccordionPaneComponent extends base.StylableComponent {
+        static { this.initializeProps = registerProps$1(); }
+        constructor(inj, accordionRef, explicitContext) {
+            super(inj, WIDGET_CONFIG, explicitContext);
+            this.accordionRef = accordionRef;
+            this.isActive = false;
+            this.$lazyLoad = i1.noop;
+            base.styler(this.nativeElement, this, base.APPLY_STYLES_TYPE.SHELL);
+            // title property here serves the purpose of heading.
+            // remove title property as attribute
+            i1.removeAttr(this.nativeElement, 'title');
+        }
+        /**
+         * handles the pane expand
+         * invoke $lazyLoad method which takes care of loading the partial when the content property is provided - lazyLoading or partial
+         * invoke redraw on the re-drawable children
+         * invoke expand callback
+         * notify parent about the change
+         * @param {Event} evt
+         */
+        expand(evt) {
+            if (this.isActive) {
+                return;
+            }
+            this.isActive = true;
+            this.$lazyLoad();
+            this.redrawChildren();
+            this.invokeEventCallback('expand', { $event: evt });
+            this.notifyParent(true, evt);
+        }
+        /**
+         * handles the pane collapse
+         * invoke collapse callback
+         * notify parent about the change
+         * @param {Event} evt
+         */
+        collapse(evt) {
+            if (!this.isActive) {
+                return;
+            }
+            this.isActive = false;
+            this.invokeEventCallback('collapse', { $event: evt });
+            this.notifyParent(false, evt);
+        }
+        remove() {
+            const paneIndex = this.accordionRef.getPaneIndexByRef(this);
+            if (this.isActive && this.accordionRef.panes.length > 1) {
+                this === this.accordionRef.panes.last ? this.accordionRef.panes.toArray()[paneIndex - 1].expand() : this.accordionRef.panes.toArray()[paneIndex + 1].expand();
+            }
+            const availablePanes = this.accordionRef.panes.toArray();
+            availablePanes.splice(this.accordionRef.getPaneIndexByRef(this), 1);
+            this.accordionRef.panes.reset([...availablePanes]);
+            this.nativeElement.remove();
+        }
+        toggle(evt) {
+            if (this.isActive) {
+                this.collapse(evt);
+            }
+            else {
+                this.expand(evt);
+            }
+        }
+        // Todo - Vinay externalize
+        redrawChildren() {
+            setTimeout(() => {
+                if (this.reDrawableComponents) {
+                    this.reDrawableComponents.forEach(c => c.redraw());
+                }
+            }, 100);
+        }
+        notifyParent(isExpand, evt) {
+            this.accordionRef.notifyChange(this, isExpand, evt);
+        }
+        onPropertyChange(key, nv, ov) {
+            if (key === 'content') {
+                if (this.isActive) {
+                    setTimeout(() => this.$lazyLoad(), 100);
+                }
+            }
+            else if (key === 'tabindex') {
+                return;
+            }
+            else {
+                super.onPropertyChange(key, nv, ov);
+            }
+        }
+        ngAfterViewInit() {
+            super.ngAfterViewInit();
+            base.styler(this.nativeElement.querySelector('.panel-body'), this, base.APPLY_STYLES_TYPE.INNER_SHELL);
+            if (this.isdynamic) {
+                this.accordionRef.registerDynamicPane(this);
+            }
+        }
+        static { this.ɵfac = function AccordionPaneComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || AccordionPaneComponent)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(AccordionDirective), i0__namespace.ɵɵdirectiveInject('EXPLICIT_CONTEXT', 8)); }; }
+        static { this.ɵcmp = /*@__PURE__*/ i0__namespace.ɵɵdefineComponent({ type: AccordionPaneComponent, selectors: [["div", "wmAccordionPane", ""]], contentQueries: function AccordionPaneComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
+                i0__namespace.ɵɵcontentQuery(dirIndex, base.RedrawableDirective, 5);
+            } if (rf & 2) {
+                let _t;
+                i0__namespace.ɵɵqueryRefresh(_t = i0__namespace.ɵɵloadQuery()) && (ctx.reDrawableComponents = _t);
+            } }, exportAs: ["wmAccordionPane"], standalone: true, features: [i0__namespace.ɵɵProvidersFeature([
+                    base.provideAsWidgetRef(AccordionPaneComponent)
+                ]), i0__namespace.ɵɵInheritDefinitionFeature, i0__namespace.ɵɵStandaloneFeature], attrs: _c0, ngContentSelectors: _c1, decls: 16, vars: 20, consts: [[1, "panel-heading", "clearfix", 3, "click", "ngClass"], [1, "panel-title"], ["href", "javascript:void(0);", "role", "button", 1, "accordion-toggle", "clearfix", 3, "tabindex"], [1, "pull-left"], [3, "hidden"], [1, "heading", 3, "innerHTML"], [1, "description", 3, "innerHTML"], [1, "panel-actions", "pull-right"], [1, "app-icon", "panel-action", "wi", 3, "title"], [3, "ngClass"], [1, "panel-collapse", "collapse", 3, "ngClass"], ["partial-container-target", "", 1, "panel-body"]], template: function AccordionPaneComponent_Template(rf, ctx) { if (rf & 1) {
+                i0__namespace.ɵɵprojectionDef();
+                i0__namespace.ɵɵelementStart(0, "div", 0);
+                i0__namespace.ɵɵlistener("click", function AccordionPaneComponent_Template_div_click_0_listener($event) { return ctx.toggle($event); });
+                i0__namespace.ɵɵelementStart(1, "h3", 1)(2, "a", 2)(3, "div", 3);
+                i0__namespace.ɵɵelement(4, "i", 4);
+                i0__namespace.ɵɵelementEnd();
+                i0__namespace.ɵɵelementStart(5, "div", 3);
+                i0__namespace.ɵɵelement(6, "div", 5)(7, "div", 6);
+                i0__namespace.ɵɵelementEnd();
+                i0__namespace.ɵɵelementStart(8, "div", 7)(9, "span");
+                i0__namespace.ɵɵtext(10);
+                i0__namespace.ɵɵelementEnd();
+                i0__namespace.ɵɵelementStart(11, "span", 8);
+                i0__namespace.ɵɵelement(12, "i", 9);
+                i0__namespace.ɵɵelementEnd()()()()();
+                i0__namespace.ɵɵelementStart(13, "div", 10)(14, "div", 11);
+                i0__namespace.ɵɵprojection(15);
+                i0__namespace.ɵɵelementEnd()();
+            } if (rf & 2) {
+                i0__namespace.ɵɵproperty("ngClass", i0__namespace.ɵɵpureFunction1(18, _c2, ctx.isActive));
+                i0__namespace.ɵɵadvance(2);
+                i0__namespace.ɵɵproperty("tabindex", ctx.tabindex);
+                i0__namespace.ɵɵattribute("aria-expanded", ctx.isActive);
+                i0__namespace.ɵɵadvance(2);
+                i0__namespace.ɵɵclassMapInterpolate1("app-icon panel-icon ", ctx.iconclass, "");
+                i0__namespace.ɵɵproperty("hidden", !ctx.iconclass);
+                i0__namespace.ɵɵadvance(2);
+                i0__namespace.ɵɵproperty("innerHTML", ctx.title, i0__namespace.ɵɵsanitizeHtml);
+                i0__namespace.ɵɵadvance();
+                i0__namespace.ɵɵproperty("innerHTML", ctx.subheading, i0__namespace.ɵɵsanitizeHtml);
+                i0__namespace.ɵɵadvance(2);
+                i0__namespace.ɵɵclassMapInterpolate1("label label-", ctx.badgetype, "");
+                i0__namespace.ɵɵadvance();
+                i0__namespace.ɵɵtextInterpolate(ctx.badgevalue);
+                i0__namespace.ɵɵadvance();
+                i0__namespace.ɵɵpropertyInterpolate2("title", "", ctx.appLocale.LABEL_COLLAPSE, "/", ctx.appLocale.LABEL_EXPAND, "");
+                i0__namespace.ɵɵadvance();
+                i0__namespace.ɵɵproperty("ngClass", ctx.isActive ? "wi-minus" : "wi-plus");
+                i0__namespace.ɵɵadvance();
+                i0__namespace.ɵɵproperty("ngClass", ctx.isActive ? "collapse in" : "collapse");
+            } }, dependencies: [i2.CommonModule, i2__namespace.NgClass, base.WmComponentsModule], encapsulation: 2 }); }
     }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(AccordionModule, [{
-            type: i0.NgModule,
-            args: [{
-                    imports: [
-                        i2.CommonModule,
-                        i3.WmComponentsModule
-                    ],
-                    declarations: [...components],
-                    exports: [...components]
-                }]
-        }], null, null); })();
-    (function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0__namespace.ɵɵsetNgModuleScope(AccordionModule, { declarations: [AccordionPaneComponent,
-            AccordionDirective], imports: [i2.CommonModule,
-            i3.WmComponentsModule], exports: [AccordionPaneComponent,
-            AccordionDirective] }); })();
+    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(AccordionPaneComponent, [{
+            type: i0.Component,
+            args: [{ standalone: true, imports: [i2.CommonModule, base.WmComponentsModule], selector: 'div[wmAccordionPane]', providers: [
+                        base.provideAsWidgetRef(AccordionPaneComponent)
+                    ], exportAs: 'wmAccordionPane', template: "<div class=\"panel-heading clearfix\" (click)=\"toggle($event)\" [ngClass]=\"{active: isActive}\">\n    <h3 class=\"panel-title\">\n        <a [attr.aria-expanded]=\"isActive\" [tabindex]=\"tabindex\"\n           class=\"accordion-toggle clearfix\"\n           href=\"javascript:void(0);\" role=\"button\">\n            <div class=\"pull-left\">\n                <i class=\"app-icon panel-icon {{iconclass}}\" [hidden]=\"!iconclass\"></i>\n            </div>\n            <div class=\"pull-left\">\n                <div class=\"heading\" [innerHTML]=\"title\"></div>\n                <div class=\"description\" [innerHTML]=\"subheading\"></div>\n            </div>\n            <div class=\"panel-actions pull-right\">\n                <span class=\"label label-{{badgetype}}\">{{ badgevalue }}</span>\n                <span class=\"app-icon panel-action wi\"\n                      title=\"{{appLocale.LABEL_COLLAPSE}}/{{appLocale.LABEL_EXPAND}}\">\n                <i [ngClass]=\"isActive ? 'wi-minus' : 'wi-plus'\"></i>\n            </span>\n            </div>\n        </a>\n    </h3>\n</div>\n<div [ngClass]=\"isActive ? 'collapse in' : 'collapse'\" class=\"panel-collapse collapse\">\n    <div class=\"panel-body\"  partial-container-target>\n        <ng-content></ng-content>\n    </div>\n</div>\n" }]
+        }], () => [{ type: i0__namespace.Injector }, { type: AccordionDirective }, { type: undefined, decorators: [{
+                    type: i0.Inject,
+                    args: ['EXPLICIT_CONTEXT']
+                }, {
+                    type: i0.Optional
+                }] }], { reDrawableComponents: [{
+                type: i0.ContentChildren,
+                args: [base.RedrawableDirective, { descendants: true }]
+            }] }); })();
+    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassDebugInfo(AccordionPaneComponent, { className: "AccordionPaneComponent", filePath: "accordion-pane/accordion-pane.component.ts", lineNumber: 31 }); })();
 
     exports.AccordionDirective = AccordionDirective;
-    exports.AccordionModule = AccordionModule;
     exports.AccordionPaneComponent = AccordionPaneComponent;
 
 }));