@wavemaker-ai/app-ng-runtime 1.0.0-rc.330 → 1.0.0-rc.334

package/components/containers/layout-grid/fesm2022/index.mjs

@@ -23,12 +23,12 @@ class LayoutgridDirective extends BaseContainerComponent {
         super(inj, WIDGET_CONFIG$2, explicitContext);
         styler(this.nativeElement, this, APPLY_STYLES_TYPE.CONTAINER);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: LayoutgridDirective, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: LayoutgridDirective, isStandalone: true, selector: "[wmLayoutGrid]", providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: LayoutgridDirective, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.28", type: LayoutgridDirective, isStandalone: true, selector: "[wmLayoutGrid]", providers: [
             provideAsWidgetRef(LayoutgridDirective)
         ], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: LayoutgridDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: LayoutgridDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -63,12 +63,12 @@ class LayoutGridRowDirective extends StylableComponent {
         super(inj, WIDGET_CONFIG$1, explicitContext);
         styler(this.nativeElement, this, APPLY_STYLES_TYPE.CONTAINER);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: LayoutGridRowDirective, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: LayoutGridRowDirective, isStandalone: true, selector: "[wmLayoutGridRow]", providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: LayoutGridRowDirective, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.28", type: LayoutGridRowDirective, isStandalone: true, selector: "[wmLayoutGridRow]", providers: [
             provideAsWidgetRef(LayoutGridRowDirective)
         ], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: LayoutGridRowDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: LayoutGridRowDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -121,12 +121,12 @@ class LayoutGridColumnDirective extends StylableComponent {
             super.onPropertyChange(key, nv, ov);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: LayoutGridColumnDirective, deps: [{ token: i0.Injector }, { token: 'height', attribute: true }, { token: i1.Viewport }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: LayoutGridColumnDirective, isStandalone: true, selector: "[wmLayoutGridColumn]", providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: LayoutGridColumnDirective, deps: [{ token: i0.Injector }, { token: 'height', attribute: true }, { token: i1.Viewport }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.28", type: LayoutGridColumnDirective, isStandalone: true, selector: "[wmLayoutGridColumn]", providers: [
             provideAsWidgetRef(LayoutGridColumnDirective)
         ], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: LayoutGridColumnDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: LayoutGridColumnDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,

package/components/containers/linear-layout/bundles/index.umd.js

@@ -110,12 +110,12 @@
             }
             super.onPropertyChange(key, nv, ov);
         }
-        static { this.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: LinearLayoutDirective, deps: [{ token: i0__namespace.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0__namespace.ɵɵFactoryTarget.Directive }); }
-        static { this.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: LinearLayoutDirective, isStandalone: true, selector: "[wmLinearLayout]", providers: [
+        static { this.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0__namespace, type: LinearLayoutDirective, deps: [{ token: i0__namespace.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0__namespace.ɵɵFactoryTarget.Directive }); }
+        static { this.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.28", type: LinearLayoutDirective, isStandalone: true, selector: "[wmLinearLayout]", providers: [
                 base.provideAsWidgetRef(LinearLayoutDirective)
             ], usesInheritance: true, ngImport: i0__namespace }); }
     }
-    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: LinearLayoutDirective, decorators: [{
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0__namespace, type: LinearLayoutDirective, decorators: [{
                 type: i0.Directive,
                 args: [{
                         standalone: true,
@@ -159,12 +159,12 @@
             }
             super.onPropertyChange(key, nv, ov);
         }
-        static { this.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: LinearLayoutItemDirective, deps: [{ token: i0__namespace.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0__namespace.ɵɵFactoryTarget.Directive }); }
-        static { this.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: LinearLayoutItemDirective, isStandalone: true, selector: "[wmLinearLayoutItem]", providers: [
+        static { this.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0__namespace, type: LinearLayoutItemDirective, deps: [{ token: i0__namespace.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0__namespace.ɵɵFactoryTarget.Directive }); }
+        static { this.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.28", type: LinearLayoutItemDirective, isStandalone: true, selector: "[wmLinearLayoutItem]", providers: [
                 base.provideAsWidgetRef(LinearLayoutItemDirective)
             ], usesInheritance: true, ngImport: i0__namespace }); }
     }
-    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: LinearLayoutItemDirective, decorators: [{
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0__namespace, type: LinearLayoutItemDirective, decorators: [{
                 type: i0.Directive,
                 args: [{
                         standalone: true,

package/components/containers/linear-layout/fesm2022/index.mjs

@@ -89,12 +89,12 @@ class LinearLayoutDirective extends BaseContainerComponent {
         }
         super.onPropertyChange(key, nv, ov);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: LinearLayoutDirective, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: LinearLayoutDirective, isStandalone: true, selector: "[wmLinearLayout]", providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: LinearLayoutDirective, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.28", type: LinearLayoutDirective, isStandalone: true, selector: "[wmLinearLayout]", providers: [
             provideAsWidgetRef(LinearLayoutDirective)
         ], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: LinearLayoutDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: LinearLayoutDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,
@@ -138,12 +138,12 @@ class LinearLayoutItemDirective extends StylableComponent {
         }
         super.onPropertyChange(key, nv, ov);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: LinearLayoutItemDirective, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: LinearLayoutItemDirective, isStandalone: true, selector: "[wmLinearLayoutItem]", providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: LinearLayoutItemDirective, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.28", type: LinearLayoutItemDirective, isStandalone: true, selector: "[wmLinearLayoutItem]", providers: [
             provideAsWidgetRef(LinearLayoutItemDirective)
         ], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: LinearLayoutItemDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: LinearLayoutItemDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,

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

@@ -189,12 +189,12 @@
             this.$lazyLoad = null;
             super.ngOnDestroy();
         }
-        static { this.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: PanelComponent, deps: [{ token: i0__namespace.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component }); }
-        static { this.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: PanelComponent, isStandalone: true, selector: "[wmPanel]", providers: [
+        static { this.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0__namespace, type: PanelComponent, deps: [{ token: i0__namespace.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component }); }
+        static { this.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.28", type: PanelComponent, isStandalone: true, selector: "[wmPanel]", providers: [
                 base.provideAsWidgetRef(PanelComponent)
             ], queries: [{ propertyName: "reDrawableComponents", predicate: base.RedrawableDirective, descendants: true }], viewQueries: [{ propertyName: "panelHeader", first: true, predicate: ["panelHeading"], descendants: true }, { propertyName: "panelContent", first: true, predicate: ["panelContent"], descendants: true, static: true }, { propertyName: "panelBody", first: true, predicate: ["panelBody"], descendants: true, static: true }], exportAs: ["wmPanel"], usesInheritance: true, ngImport: i0__namespace, template: "@if (showHeader) {\n  <div class=\"panel-heading {{helpClass}}\"  #panelHeading>\n    <div class=\"panel-title\">\n      <a href=\"javascript:void(0)\" class=\"panel-toggle\" (click)=\"toggle($event)\" [attr.aria-expanded]=\"!!expanded\">\n        <div class=\"pull-left\">\n          <wm-app-icon [iconclass]=\"iconclass\"\n                       [iconurl]=\"iconurl\"\n                       [iconClasses]=\"iconurl ? 'panel-image-icon' : 'panel-icon'\"\n                       [iconStyle]=\"{width: iconwidth, height: iconheight, margin: iconmargin, fontSize: iconwidth}\"\n                       alt=\"Panel icon\"></wm-app-icon>\n        </div>\n        <div class=\"pull-left\">\n          <div class=\"heading\" [innerHTML]=\"title\" [title]=\"title\"></div>\n          <div class=\"description\" [innerHTML]=\"subheading\"></div>\n        </div>\n      </a>\n      <div class=\"panel-actions\">\n        @if (badgevalue) {\n          <span\n          class=\"app-badge label label-{{badgetype}}\">{{badgevalue}}</span>\n        }\n        @if (actions) {\n          <div wmMenu aria-label=\"dropdown\" dropdown type=\"anchor\" class=\"panel-action\" dataset.bind=\"actions\"\n            caption=\"\" menuposition=\"down,left\" iconclass=\"wi wi-more-vert\"\n            autoclose.bind=\"autoclose\" datafield.bind=\"datafield\" select.event=\"menuActionItemClick($event,$item)\">\n          </div>\n        }\n        @if (helptext) {\n          <button type=\"button\" aria-label=\"Help\" class=\"app-icon panel-action wi\" [title]=\"appLocale.LABEL_HELP\"\n            (click)=\"toggleHelp()\"><i class=\"wi-question\"></i></button>\n          }\n          @if (collapsible) {\n            <button type=\"button\" aria-label=\"Collapse/Expand\" class=\"app-icon wi panel-action\"\n              [title]=\"expandCollapseTitle\" (click)=\"toggle($event);\" [attr.aria-expanded]=\"!!expanded\"><i\n            [ngClass]=\"expanded ? 'wi-minus' : 'wi-plus'\"></i></button>\n          }\n          @if (enablefullscreen) {\n            <button type=\"button\" aria-label=\"Fullscreen/Exit\" class=\"app-icon panel-action wi\"\n              [title]=\"fullScreenTitle\" (click)=\"toggleFullScreen($event);\"><i\n            [ngClass]=\"fullscreen ? 'wi-fullscreen-exit' : 'wi-fullscreen'\"></i></button>\n          }\n          @if (closable) {\n            <button type=\"button\" aria-label=\"Close button\" class=\"app-icon panel-action\"\n              title=\"{{appLocale.LABEL_CLOSE}}\" (click)=\"close($event)\"><i\n            class=\"wi wi-close\"></i></button>\n          }\n        </div>\n      </div>\n    </div>\n  }\n  <div class=\"panel-content\"  [hidden]=\"!expanded\" #panelContent>\n    <!-- Todo Bandhavya - implement smooth scroll -->\n    <div partial-container-target #panelBody [ngClass]=\"['panel-body', helpClass]\">\n      <ng-content></ng-content>\n    </div>\n    <aside class=\"panel-help-message\" [ngClass]=\"helpClass\">\n      <h5 class=\"panel-help-header\" [textContent]=\"appLocale.LABEL_HELP\"></h5>\n      <div class=\"panel-help-content\" [innerHTML]=\"helptext | trustAs : 'html'\"></div>\n    </aside>\n  </div>\n  <div class=\"app-panel-footer panel-footer clearfix\"  [hidden]=\"hideFooter\">\n    <ng-content select=\"[wmPanelFooter]\"></ng-content>\n  </div>\n", dependencies: [{ kind: "ngmodule", type: i1.BsDropdownModule }, { kind: "directive", type: i1__namespace.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { kind: "ngmodule", type: i2.CommonModule }, { kind: "directive", type: i2__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: base.TextContentDirective, selector: "[textContent]", inputs: ["textContent"] }, { kind: "component", type: menu.MenuComponent, selector: "[wmMenu]" }, { kind: "component", type: base.WmAppIconComponent, selector: "wm-app-icon", inputs: ["icon", "iconclass", "iconurl", "defaultIconClass", "defaultClasses", "iconStyle", "alt"] }, { kind: "pipe", type: base.TrustAsPipe, name: "trustAs" }] }); }
     }
-    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: PanelComponent, decorators: [{
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0__namespace, type: PanelComponent, decorators: [{
                 type: i0.Component,
                 args: [{ standalone: true, imports: [i1.BsDropdownModule, i2.CommonModule, base.TextContentDirective, base.TrustAsPipe, menu.MenuComponent, base.WmAppIconComponent], selector: '[wmPanel]', providers: [
                             base.provideAsWidgetRef(PanelComponent)

package/components/containers/panel/fesm2022/index.mjs

@@ -173,12 +173,12 @@ class PanelComponent extends MenuAdapterComponent {
         this.$lazyLoad = null;
         super.ngOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: PanelComponent, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: PanelComponent, isStandalone: true, selector: "[wmPanel]", providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: PanelComponent, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.28", type: PanelComponent, isStandalone: true, selector: "[wmPanel]", providers: [
             provideAsWidgetRef(PanelComponent)
         ], queries: [{ propertyName: "reDrawableComponents", predicate: RedrawableDirective, descendants: true }], viewQueries: [{ propertyName: "panelHeader", first: true, predicate: ["panelHeading"], descendants: true }, { propertyName: "panelContent", first: true, predicate: ["panelContent"], descendants: true, static: true }, { propertyName: "panelBody", first: true, predicate: ["panelBody"], descendants: true, static: true }], exportAs: ["wmPanel"], usesInheritance: true, ngImport: i0, template: "@if (showHeader) {\n  <div class=\"panel-heading {{helpClass}}\"  #panelHeading>\n    <div class=\"panel-title\">\n      <a href=\"javascript:void(0)\" class=\"panel-toggle\" (click)=\"toggle($event)\" [attr.aria-expanded]=\"!!expanded\">\n        <div class=\"pull-left\">\n          <wm-app-icon [iconclass]=\"iconclass\"\n                       [iconurl]=\"iconurl\"\n                       [iconClasses]=\"iconurl ? 'panel-image-icon' : 'panel-icon'\"\n                       [iconStyle]=\"{width: iconwidth, height: iconheight, margin: iconmargin, fontSize: iconwidth}\"\n                       alt=\"Panel icon\"></wm-app-icon>\n        </div>\n        <div class=\"pull-left\">\n          <div class=\"heading\" [innerHTML]=\"title\" [title]=\"title\"></div>\n          <div class=\"description\" [innerHTML]=\"subheading\"></div>\n        </div>\n      </a>\n      <div class=\"panel-actions\">\n        @if (badgevalue) {\n          <span\n          class=\"app-badge label label-{{badgetype}}\">{{badgevalue}}</span>\n        }\n        @if (actions) {\n          <div wmMenu aria-label=\"dropdown\" dropdown type=\"anchor\" class=\"panel-action\" dataset.bind=\"actions\"\n            caption=\"\" menuposition=\"down,left\" iconclass=\"wi wi-more-vert\"\n            autoclose.bind=\"autoclose\" datafield.bind=\"datafield\" select.event=\"menuActionItemClick($event,$item)\">\n          </div>\n        }\n        @if (helptext) {\n          <button type=\"button\" aria-label=\"Help\" class=\"app-icon panel-action wi\" [title]=\"appLocale.LABEL_HELP\"\n            (click)=\"toggleHelp()\"><i class=\"wi-question\"></i></button>\n          }\n          @if (collapsible) {\n            <button type=\"button\" aria-label=\"Collapse/Expand\" class=\"app-icon wi panel-action\"\n              [title]=\"expandCollapseTitle\" (click)=\"toggle($event);\" [attr.aria-expanded]=\"!!expanded\"><i\n            [ngClass]=\"expanded ? 'wi-minus' : 'wi-plus'\"></i></button>\n          }\n          @if (enablefullscreen) {\n            <button type=\"button\" aria-label=\"Fullscreen/Exit\" class=\"app-icon panel-action wi\"\n              [title]=\"fullScreenTitle\" (click)=\"toggleFullScreen($event);\"><i\n            [ngClass]=\"fullscreen ? 'wi-fullscreen-exit' : 'wi-fullscreen'\"></i></button>\n          }\n          @if (closable) {\n            <button type=\"button\" aria-label=\"Close button\" class=\"app-icon panel-action\"\n              title=\"{{appLocale.LABEL_CLOSE}}\" (click)=\"close($event)\"><i\n            class=\"wi wi-close\"></i></button>\n          }\n        </div>\n      </div>\n    </div>\n  }\n  <div class=\"panel-content\"  [hidden]=\"!expanded\" #panelContent>\n    <!-- Todo Bandhavya - implement smooth scroll -->\n    <div partial-container-target #panelBody [ngClass]=\"['panel-body', helpClass]\">\n      <ng-content></ng-content>\n    </div>\n    <aside class=\"panel-help-message\" [ngClass]=\"helpClass\">\n      <h5 class=\"panel-help-header\" [textContent]=\"appLocale.LABEL_HELP\"></h5>\n      <div class=\"panel-help-content\" [innerHTML]=\"helptext | trustAs : 'html'\"></div>\n    </aside>\n  </div>\n  <div class=\"app-panel-footer panel-footer clearfix\"  [hidden]=\"hideFooter\">\n    <ng-content select=\"[wmPanelFooter]\"></ng-content>\n  </div>\n", dependencies: [{ kind: "ngmodule", type: BsDropdownModule }, { kind: "directive", type: i1.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: TextContentDirective, selector: "[textContent]", inputs: ["textContent"] }, { kind: "component", type: MenuComponent, selector: "[wmMenu]" }, { kind: "component", type: WmAppIconComponent, selector: "wm-app-icon", inputs: ["icon", "iconclass", "iconurl", "defaultIconClass", "defaultClasses", "iconStyle", "alt"] }, { kind: "pipe", type: TrustAsPipe, name: "trustAs" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: PanelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: PanelComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, imports: [BsDropdownModule, CommonModule, TextContentDirective, TrustAsPipe, MenuComponent, WmAppIconComponent], selector: '[wmPanel]', providers: [
                         provideAsWidgetRef(PanelComponent)

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

@@ -281,8 +281,8 @@
             this.$lazyLoad = null;
             super.ngOnDestroy();
         }
-        static { this.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: TabPaneComponent, deps: [{ token: i0__namespace.Injector }, { token: 'heading', attribute: true }, { token: 'title', attribute: true }, { token: 'EXPLICIT_CONTEXT', optional: true }, { token: i1__namespace.App }], target: i0__namespace.ɵɵFactoryTarget.Component }); }
-        static { this.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: TabPaneComponent, isStandalone: true, selector: "div[wmTabPane]", host: { properties: { "class.active": "this.isActive", "class.disabled": "this.disabled" } }, providers: [
+        static { this.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0__namespace, type: TabPaneComponent, deps: [{ token: i0__namespace.Injector }, { token: 'heading', attribute: true }, { token: 'title', attribute: true }, { token: 'EXPLICIT_CONTEXT', optional: true }, { token: i1__namespace.App }], target: i0__namespace.ɵɵFactoryTarget.Component }); }
+        static { this.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.28", type: TabPaneComponent, isStandalone: true, selector: "div[wmTabPane]", host: { properties: { "class.active": "this.isActive", "class.disabled": "this.disabled" } }, providers: [
                 base.provideAsWidgetRef(TabPaneComponent)
             ], queries: [{ propertyName: "reDrawableComponents", predicate: base.RedrawableDirective, descendants: true }], usesInheritance: true, ngImport: i0__namespace, template: "<div class=\"tab-body\" partial-container-target >\n    <ng-content></ng-content>\n</div>" }); }
     };
@@ -290,7 +290,7 @@
         base.AutoLayout({ targetSelector: '.tab-body' }),
         tslib.__metadata("design:paramtypes", [i0.Injector, Object, Object, Object, i1.App])
     ], exports.TabPaneComponent);
-    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: exports.TabPaneComponent, decorators: [{
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0__namespace, type: exports.TabPaneComponent, decorators: [{
                 type: i0.Component,
                 args: [{ standalone: true, selector: 'div[wmTabPane]', providers: [
                             base.provideAsWidgetRef(exports.TabPaneComponent)
@@ -755,12 +755,12 @@
             this.activeTab = null;
             super.ngOnDestroy();
         }
-        static { this.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: TabsComponent, deps: [{ token: i0__namespace.Injector }, { token: i1__namespace.DynamicComponentRefProvider }, { token: 'transition', attribute: true }, { token: 'tabsposition', attribute: true }, { token: i1__namespace.StatePersistence }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component }); }
-        static { this.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: TabsComponent, isStandalone: true, selector: "div[wmTabs]", host: { properties: { "attr.icon-position": "this.iconposition" } }, providers: [
+        static { this.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0__namespace, type: TabsComponent, deps: [{ token: i0__namespace.Injector }, { token: i1__namespace.DynamicComponentRefProvider }, { token: 'transition', attribute: true }, { token: 'tabsposition', attribute: true }, { token: i1__namespace.StatePersistence }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component }); }
+        static { this.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.28", type: TabsComponent, isStandalone: true, selector: "div[wmTabs]", host: { properties: { "attr.icon-position": "this.iconposition" } }, providers: [
                 base.provideAsWidgetRef(TabsComponent)
             ], queries: [{ propertyName: "panes", predicate: exports.TabPaneComponent }], exportAs: ["wmTabs"], usesInheritance: true, ngImport: i0__namespace, template: "<ul class=\"nav nav-tabs\" [ngClass]=\"{'nav-stacked': vertical, 'nav-justified': justified}\" role=\"tablist\">\n  @for (pane of panes; track pane; let i = $index) {\n    <li class=\"tab-header\" [attr.data-paneid]=\"pane.widgetId\" [ngClass]=\"{'active': pane.isActive, 'disabled': pane.disabled}\"\n      [hidden]=\"!pane.show\" role=\"presentation\">\n      <a [attr.aria-label]=\"pane.badgevalue ? pane.title + ' ' + pane.badgevalue : pane.title\"\n        [attr.icon-position]=\"iconposition\"\n        [attr.title]=\"pane.title\"\n        [tabindex]=\"pane.isActive ? '0' : '-1'\"\n        class=\"tab-heading\" href=\"javascript:void(0);\"\n        [attr.aria-selected]=\"pane.isActive\" role=\"tab\" (click)=\"pane.select($event); pane.tabpaneHeaderClick($event, i);\" (keydown)=\"onkeydown($event)\">\n        <wm-app-icon [iconclass]=\"pane.paneicon\" [iconurl]=\"pane.paneiconurl\" alt=\"Tab icon\"></wm-app-icon>\n        <span [textContent]=\"pane.title\"></span>\n        @if (pane.badgevalue) {\n          <span class=\"label label-{{pane.badgetype}}\" [textContent]=\"pane.badgevalue\"></span>\n        }\n      </a>\n    </li>\n  }\n</ul>\n@if (type !== 'dynamic') {\n  <div class=\"tab-content\" [ngClass]=\"{'tab-stacked': vertical, 'tab-justified': justified}\">\n    <ng-content ngProjectAs=\"div[wmTabPane]\"></ng-content>\n  </div>\n}\n@if (type === 'dynamic') {\n  <div class=\"tab-content\" [ngClass]=\"{'tab-stacked': vertical, 'tab-justified': justified}\">\n    @if (fieldDefs && !fieldDefs.length) {\n      <div>{{nodatamessage}}</div>\n    }\n    <ng-content select=\"div[wmRepeatTemplate]\"></ng-content>\n  </div>\n}\n", dependencies: [{ kind: "ngmodule", type: i2.CommonModule }, { kind: "directive", type: i2__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: base.TextContentDirective, selector: "[textContent]", inputs: ["textContent"] }, { kind: "component", type: base.WmAppIconComponent, selector: "wm-app-icon", inputs: ["icon", "iconclass", "iconurl", "defaultIconClass", "defaultClasses", "iconStyle", "alt"] }] }); }
     }
-    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: TabsComponent, decorators: [{
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0__namespace, type: TabsComponent, decorators: [{
                 type: i0.Component,
                 args: [{ standalone: true, imports: [i2.CommonModule, base.TextContentDirective, base.WmAppIconComponent], selector: 'div[wmTabs]', exportAs: 'wmTabs', providers: [
                             base.provideAsWidgetRef(TabsComponent)

package/components/containers/tabs/fesm2022/index.mjs

@@ -265,8 +265,8 @@ let TabPaneComponent = class TabPaneComponent extends StylableComponent {
         this.$lazyLoad = null;
         super.ngOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: TabPaneComponent, deps: [{ token: i0.Injector }, { token: 'heading', attribute: true }, { token: 'title', attribute: true }, { token: 'EXPLICIT_CONTEXT', optional: true }, { token: i1.App }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: TabPaneComponent, isStandalone: true, selector: "div[wmTabPane]", host: { properties: { "class.active": "this.isActive", "class.disabled": "this.disabled" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: TabPaneComponent, deps: [{ token: i0.Injector }, { token: 'heading', attribute: true }, { token: 'title', attribute: true }, { token: 'EXPLICIT_CONTEXT', optional: true }, { token: i1.App }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.28", type: TabPaneComponent, isStandalone: true, selector: "div[wmTabPane]", host: { properties: { "class.active": "this.isActive", "class.disabled": "this.disabled" } }, providers: [
             provideAsWidgetRef(TabPaneComponent)
         ], queries: [{ propertyName: "reDrawableComponents", predicate: RedrawableDirective, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"tab-body\" partial-container-target >\n    <ng-content></ng-content>\n</div>" }); }
 };
@@ -274,7 +274,7 @@ TabPaneComponent = __decorate([
     AutoLayout({ targetSelector: '.tab-body' }),
     __metadata("design:paramtypes", [Injector, Object, Object, Object, App])
 ], TabPaneComponent);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: TabPaneComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: TabPaneComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'div[wmTabPane]', providers: [
                         provideAsWidgetRef(TabPaneComponent)
@@ -739,12 +739,12 @@ class TabsComponent extends StylableComponent {
         this.activeTab = null;
         super.ngOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: TabsComponent, deps: [{ token: i0.Injector }, { token: i1.DynamicComponentRefProvider }, { token: 'transition', attribute: true }, { token: 'tabsposition', attribute: true }, { token: i1.StatePersistence }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: TabsComponent, isStandalone: true, selector: "div[wmTabs]", host: { properties: { "attr.icon-position": "this.iconposition" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: TabsComponent, deps: [{ token: i0.Injector }, { token: i1.DynamicComponentRefProvider }, { token: 'transition', attribute: true }, { token: 'tabsposition', attribute: true }, { token: i1.StatePersistence }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.28", type: TabsComponent, isStandalone: true, selector: "div[wmTabs]", host: { properties: { "attr.icon-position": "this.iconposition" } }, providers: [
             provideAsWidgetRef(TabsComponent)
         ], queries: [{ propertyName: "panes", predicate: TabPaneComponent }], exportAs: ["wmTabs"], usesInheritance: true, ngImport: i0, template: "<ul class=\"nav nav-tabs\" [ngClass]=\"{'nav-stacked': vertical, 'nav-justified': justified}\" role=\"tablist\">\n  @for (pane of panes; track pane; let i = $index) {\n    <li class=\"tab-header\" [attr.data-paneid]=\"pane.widgetId\" [ngClass]=\"{'active': pane.isActive, 'disabled': pane.disabled}\"\n      [hidden]=\"!pane.show\" role=\"presentation\">\n      <a [attr.aria-label]=\"pane.badgevalue ? pane.title + ' ' + pane.badgevalue : pane.title\"\n        [attr.icon-position]=\"iconposition\"\n        [attr.title]=\"pane.title\"\n        [tabindex]=\"pane.isActive ? '0' : '-1'\"\n        class=\"tab-heading\" href=\"javascript:void(0);\"\n        [attr.aria-selected]=\"pane.isActive\" role=\"tab\" (click)=\"pane.select($event); pane.tabpaneHeaderClick($event, i);\" (keydown)=\"onkeydown($event)\">\n        <wm-app-icon [iconclass]=\"pane.paneicon\" [iconurl]=\"pane.paneiconurl\" alt=\"Tab icon\"></wm-app-icon>\n        <span [textContent]=\"pane.title\"></span>\n        @if (pane.badgevalue) {\n          <span class=\"label label-{{pane.badgetype}}\" [textContent]=\"pane.badgevalue\"></span>\n        }\n      </a>\n    </li>\n  }\n</ul>\n@if (type !== 'dynamic') {\n  <div class=\"tab-content\" [ngClass]=\"{'tab-stacked': vertical, 'tab-justified': justified}\">\n    <ng-content ngProjectAs=\"div[wmTabPane]\"></ng-content>\n  </div>\n}\n@if (type === 'dynamic') {\n  <div class=\"tab-content\" [ngClass]=\"{'tab-stacked': vertical, 'tab-justified': justified}\">\n    @if (fieldDefs && !fieldDefs.length) {\n      <div>{{nodatamessage}}</div>\n    }\n    <ng-content select=\"div[wmRepeatTemplate]\"></ng-content>\n  </div>\n}\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: TextContentDirective, selector: "[textContent]", inputs: ["textContent"] }, { kind: "component", type: WmAppIconComponent, selector: "wm-app-icon", inputs: ["icon", "iconclass", "iconurl", "defaultIconClass", "defaultClasses", "iconStyle", "alt"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: TabsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: TabsComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, imports: [CommonModule, TextContentDirective, WmAppIconComponent], selector: 'div[wmTabs]', exportAs: 'wmTabs', providers: [
                         provideAsWidgetRef(TabsComponent)

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

@@ -42,12 +42,12 @@
             super(inj, WIDGET_CONFIG, explicitContext);
             base.styler(this.nativeElement, this, base.APPLY_STYLES_TYPE.CONTAINER);
         }
-        static { this.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: TileDirective, deps: [{ token: i0__namespace.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0__namespace.ɵɵFactoryTarget.Directive }); }
-        static { this.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: TileDirective, isStandalone: true, selector: "[wmTile]", providers: [
+        static { this.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0__namespace, type: TileDirective, deps: [{ token: i0__namespace.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0__namespace.ɵɵFactoryTarget.Directive }); }
+        static { this.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.28", type: TileDirective, isStandalone: true, selector: "[wmTile]", providers: [
                 base.provideAsWidgetRef(TileDirective)
             ], usesInheritance: true, ngImport: i0__namespace }); }
     }
-    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: TileDirective, decorators: [{
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0__namespace, type: TileDirective, decorators: [{
                 type: i0.Directive,
                 args: [{
                         standalone: true,

package/components/containers/tile/fesm2022/index.mjs

@@ -21,12 +21,12 @@ class TileDirective extends StylableComponent {
         super(inj, WIDGET_CONFIG, explicitContext);
         styler(this.nativeElement, this, APPLY_STYLES_TYPE.CONTAINER);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: TileDirective, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: TileDirective, isStandalone: true, selector: "[wmTile]", providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: TileDirective, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.28", type: TileDirective, isStandalone: true, selector: "[wmTile]", providers: [
             provideAsWidgetRef(TileDirective)
         ], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: TileDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: TileDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,

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

@@ -72,6 +72,12 @@
     };
     class WizardStepComponent extends base.StylableComponent {
         static { this.initializeProps = registerProps$1(); }
+        get activeClass() {
+            return this.isPrism && this.active;
+        }
+        get currentClass() {
+            return !this.isPrism && this.active;
+        }
         get isCurrent() {
             return this.active;
         }
@@ -142,8 +148,10 @@
             this.prevCBInProgress = false;
             this.status = 2 /* STEP_STATUS.DISABLED */;
             this._currentWizardWidgets = {};
+            this.isPrism = false;
             // If we inject directly as a param in the constructor, getting circular dependency error in unit testcases
             this.wizardComponent = this.inj.get(WizardComponent);
+            this.isPrism = !!this.inj.get(i1$1.App, null)?.isPrism;
         }
         invokeNextCB(index) {
             return this.invokeEventCallback('next', { currentStep: this, stepIndex: index });
@@ -206,13 +214,13 @@
             // This will clear the context and unregister the widget
             super.ngOnDestroy();
         }
-        static { this.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: WizardStepComponent, deps: [{ token: i0__namespace.Injector }, { token: i1__namespace.NgForm, self: true }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component }); }
-        static { this.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: WizardStepComponent, isStandalone: true, selector: "form[wmWizardStep]", host: { properties: { "class.active": "this.isCurrent" } }, providers: [
+        static { this.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0__namespace, type: WizardStepComponent, deps: [{ token: i0__namespace.Injector }, { token: i1__namespace.NgForm, self: true }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component }); }
+        static { this.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.28", type: WizardStepComponent, isStandalone: true, selector: "form[wmWizardStep]", host: { properties: { "class.active": "this.activeClass", "class.current": "this.currentClass" } }, providers: [
                 base.provideAsWidgetRef(WizardStepComponent),
                 i1.NgForm
             ], queries: [{ propertyName: "reDrawableComponents", predicate: base.RedrawableDirective, descendants: true }], exportAs: ["wmWizardStep"], usesInheritance: true, ngImport: i0__namespace, template: `<ng-content partial-container-target></ng-content>`, isInline: true }); }
     }
-    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: WizardStepComponent, decorators: [{
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0__namespace, type: WizardStepComponent, decorators: [{
                 type: i0.Component,
                 args: [{
                         standalone: true,
@@ -234,9 +242,12 @@
                     }] }], propDecorators: { reDrawableComponents: [{
                     type: i0.ContentChildren,
                     args: [base.RedrawableDirective, { descendants: true }]
-                }], isCurrent: [{
+                }], activeClass: [{
                     type: i0.HostBinding,
                     args: ['class.active']
+                }], currentClass: [{
+                    type: i0.HostBinding,
+                    args: ['class.current']
                 }] } });
 
     const DEFAULT_CLS = 'app-wizard panel clearfix';
@@ -1000,13 +1011,13 @@
             this.currentStep = null;
             super.ngOnDestroy();
         }
-        static { this.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: WizardComponent, deps: [{ token: i0__namespace.Injector }, { token: i1$1__namespace.DynamicComponentRefProvider }, { token: base.Context, self: true }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component }); }
-        static { this.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: WizardComponent, isStandalone: true, selector: "div[wmWizard]", providers: [
+        static { this.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0__namespace, type: WizardComponent, deps: [{ token: i0__namespace.Injector }, { token: i1$1__namespace.DynamicComponentRefProvider }, { token: base.Context, self: true }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component }); }
+        static { this.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.28", type: WizardComponent, isStandalone: true, selector: "div[wmWizard]", providers: [
                 base.provideAsWidgetRef(WizardComponent),
                 { provide: base.Context, useFactory: () => { return {}; }, multi: true }
             ], queries: [{ propertyName: "wizardAction", first: true, predicate: ["wizardAction"], read: i0.TemplateRef }, { propertyName: "steps", predicate: WizardStepComponent }], exportAs: ["wmWizard"], usesInheritance: true, ngImport: i0__namespace, template: "<div class=\"app-wizard-heading\">\n  <ul class=\"app-wizard-steps nav nav-pills {{stepClass}}\">\n    @for (step of steps; track step; let i = $index) {\n      <li class=\"app-wizard-step\" [hidden]=\"!step.show\"\n        [ngClass]=\"{finished: step.done, active: step.active, default: step.disabled}\"\n        (click)=\"onWizardHeaderClick($event, step)\" [attr.data-stepid]=\"step.widgetId\">\n        <a href=\"javascript:void(0)\" [attr.aria-current]=\"step.active ? 'step' : null\"\n          [attr.aria-disabled]=\"step.disabled\" [attr.aria-label]='step.subtitle ? \"step \" + (i + 1) + \" \" +  step.title + \" \" + step.subtitle : \"step \" + (i + 1) + \" \" +  step.title' [attr.title]= \"step.title\"\n          [ngClass]=\"{'title-center-align':class && class.includes('classic') && !step.subtitle}\" [tabindex]=\"step.active ? '0' : '-1'\" (keydown)=\"onkeydown($event)\">\n          @if (class && class.includes('classic')) {\n            <span class=\"arrow\"></span>\n          }\n          @if (shouldRenderWizardStepNumberSpan(step)) {\n            <span class=\"wizard-step-number\">\n              @if (class && class.includes('number') && !step.isDone && !showWizardStepIcons) {\n                <span class=\"count\">{{i+1}}</span>\n              }\n              @if (class && (class.includes('dottedstepper') || class.includes('text-inline') && !showWizardStepIcons) && !step.isDone) {\n                <i class=\"dottedstepper\"></i>\n              }\n              @if (class && (class.includes('dottedstepper') || class.includes('number')) && step.isDone) {\n                <i class=\"app-icon wi wi-done\"></i>\n              }\n              @if (shouldShowPrimaryStepIcon(step)) {\n                <wm-app-icon [iconclass]=\"stepIconClassOrDefault(step)\" [iconurl]=\"step.iconurl\"></wm-app-icon>\n              }\n              @if (showWizardStepIcons && step.isDone && hasNonEmptyDoneIconClass(step)) {\n                <wm-app-icon [iconclass]=\"step.doneiconclass\" [iconurl]=\"step.doneiconurl\"></wm-app-icon>\n              }\n            </span>\n          }\n          <span class=\"title-wrapper\">\n            @if (class && class.includes('text-inline')) {\n              <span>{{'0' + (i+1)}}</span>\n            }\n            <span class=\"step-title\" [textContent]=\"step.title\"></span>\n          </span>\n          @if (step.subtitle) {\n            <span class=\"subtitle-wrapper\" [attr.title]=\"step.subtitle\">\n              <span class=\"step-title\" [textContent]=\"step.subtitle\"></span>\n              <a class=\"read_more\" (click)=\"readMoreSubtitle()\" style=\"display:none\">more</a>\n            </span>\n          }\n        </a>\n      </li>\n    }\n  </ul>\n</div>\n@if (type !== 'dynamic') {\n<div class=\"app-wizard-body panel-body\">\n  @if (message.caption) {\n    <p wmMessage caption.bind=\"message.caption\" type.bind=\"message.type\"></p>\n  }\n  <ng-content ngProjectAs=\"form[wmWizardStep]\"></ng-content>\n</div>\n}\n@if (type === 'dynamic') {\n<div class=\"app-wizard-body panel-body\">\n    @if(!fieldDefs?.length) {\n    <div>{{nodatamessage}}</div>\n    }\n    <ng-content select=\"div[wmRepeatTemplate]\"></ng-content>\n</div>\n}\n@if(fieldDefs && fieldDefs.length || type !== 'dynamic') {\n    <ng-container *ngTemplateOutlet=\"wizardAction\"></ng-container>\n}\n", dependencies: [{ kind: "ngmodule", type: i2.CommonModule }, { kind: "directive", type: i2__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: base.TextContentDirective, selector: "[textContent]", inputs: ["textContent"] }, { kind: "component", type: base.WmAppIconComponent, selector: "wm-app-icon", inputs: ["icon", "iconclass", "iconurl", "defaultIconClass", "defaultClasses", "iconStyle", "alt"] }] }); }
     }
-    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: WizardComponent, decorators: [{
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0__namespace, type: WizardComponent, decorators: [{
                 type: i0.Component,
                 args: [{ standalone: true, imports: [i2.CommonModule, base.TextContentDirective, base.WmAppIconComponent], selector: 'div[wmWizard]', providers: [
                             base.provideAsWidgetRef(WizardComponent),
@@ -1047,12 +1058,12 @@
         constructor(inj, explicitContext) {
             super(inj, WIDGET_INFO, explicitContext);
         }
-        static { this.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: WizardActionDirective, deps: [{ token: i0__namespace.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0__namespace.ɵɵFactoryTarget.Directive }); }
-        static { this.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WizardActionDirective, isStandalone: true, selector: "div[wmWizardAction]", providers: [
+        static { this.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0__namespace, type: WizardActionDirective, deps: [{ token: i0__namespace.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0__namespace.ɵɵFactoryTarget.Directive }); }
+        static { this.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.28", type: WizardActionDirective, isStandalone: true, selector: "div[wmWizardAction]", providers: [
                 base.provideAsWidgetRef(WizardActionDirective)
             ], exportAs: ["wmWizardAction"], usesInheritance: true, ngImport: i0__namespace }); }
     }
-    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0__namespace, type: WizardActionDirective, decorators: [{
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0__namespace, type: WizardActionDirective, decorators: [{
                 type: i0.Directive,
                 args: [{
                         standalone: true,

package/components/containers/wizard/fesm2022/index.mjs

@@ -4,7 +4,7 @@ import { register, PROP_STRING, PROP_BOOLEAN, PROP_ANY, PROP_NUMBER, StylableCom
 import * as i0 from '@angular/core';
 import { HostBinding, ContentChildren, Self, Inject, Optional, Component, TemplateRef, ContentChild, Directive } from '@angular/core';
 import * as i1$1 from '@wm/core';
-import { noop, isDefined } from '@wm/core';
+import { noop, App, isDefined } from '@wm/core';
 import * as i1 from '@angular/forms';
 import { NgForm } from '@angular/forms';
 import { find, isArray, forEach, indexOf, get, isString, isNumber, findIndex } from 'lodash-es';
@@ -55,6 +55,12 @@ const WIDGET_CONFIG$1 = {
 };
 class WizardStepComponent extends StylableComponent {
     static { this.initializeProps = registerProps$1(); }
+    get activeClass() {
+        return this.isPrism && this.active;
+    }
+    get currentClass() {
+        return !this.isPrism && this.active;
+    }
     get isCurrent() {
         return this.active;
     }
@@ -125,8 +131,10 @@ class WizardStepComponent extends StylableComponent {
         this.prevCBInProgress = false;
         this.status = 2 /* STEP_STATUS.DISABLED */;
         this._currentWizardWidgets = {};
+        this.isPrism = false;
         // If we inject directly as a param in the constructor, getting circular dependency error in unit testcases
         this.wizardComponent = this.inj.get(WizardComponent);
+        this.isPrism = !!this.inj.get(App, null)?.isPrism;
     }
     invokeNextCB(index) {
         return this.invokeEventCallback('next', { currentStep: this, stepIndex: index });
@@ -189,13 +197,13 @@ class WizardStepComponent extends StylableComponent {
         // This will clear the context and unregister the widget
         super.ngOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WizardStepComponent, deps: [{ token: i0.Injector }, { token: i1.NgForm, self: true }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: WizardStepComponent, isStandalone: true, selector: "form[wmWizardStep]", host: { properties: { "class.active": "this.isCurrent" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: WizardStepComponent, deps: [{ token: i0.Injector }, { token: i1.NgForm, self: true }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.28", type: WizardStepComponent, isStandalone: true, selector: "form[wmWizardStep]", host: { properties: { "class.active": "this.activeClass", "class.current": "this.currentClass" } }, providers: [
             provideAsWidgetRef(WizardStepComponent),
             NgForm
         ], queries: [{ propertyName: "reDrawableComponents", predicate: RedrawableDirective, descendants: true }], exportAs: ["wmWizardStep"], usesInheritance: true, ngImport: i0, template: `<ng-content partial-container-target></ng-content>`, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WizardStepComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: WizardStepComponent, decorators: [{
             type: Component,
             args: [{
                     standalone: true,
@@ -217,9 +225,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
                 }] }], propDecorators: { reDrawableComponents: [{
                 type: ContentChildren,
                 args: [RedrawableDirective, { descendants: true }]
-            }], isCurrent: [{
+            }], activeClass: [{
                 type: HostBinding,
                 args: ['class.active']
+            }], currentClass: [{
+                type: HostBinding,
+                args: ['class.current']
             }] } });
 
 const DEFAULT_CLS = 'app-wizard panel clearfix';
@@ -983,13 +994,13 @@ class WizardComponent extends StylableComponent {
         this.currentStep = null;
         super.ngOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WizardComponent, deps: [{ token: i0.Injector }, { token: i1$1.DynamicComponentRefProvider }, { token: Context, self: true }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: WizardComponent, isStandalone: true, selector: "div[wmWizard]", providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: WizardComponent, deps: [{ token: i0.Injector }, { token: i1$1.DynamicComponentRefProvider }, { token: Context, self: true }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.28", type: WizardComponent, isStandalone: true, selector: "div[wmWizard]", providers: [
             provideAsWidgetRef(WizardComponent),
             { provide: Context, useFactory: () => { return {}; }, multi: true }
         ], queries: [{ propertyName: "wizardAction", first: true, predicate: ["wizardAction"], read: TemplateRef }, { propertyName: "steps", predicate: WizardStepComponent }], exportAs: ["wmWizard"], usesInheritance: true, ngImport: i0, template: "<div class=\"app-wizard-heading\">\n  <ul class=\"app-wizard-steps nav nav-pills {{stepClass}}\">\n    @for (step of steps; track step; let i = $index) {\n      <li class=\"app-wizard-step\" [hidden]=\"!step.show\"\n        [ngClass]=\"{finished: step.done, active: step.active, default: step.disabled}\"\n        (click)=\"onWizardHeaderClick($event, step)\" [attr.data-stepid]=\"step.widgetId\">\n        <a href=\"javascript:void(0)\" [attr.aria-current]=\"step.active ? 'step' : null\"\n          [attr.aria-disabled]=\"step.disabled\" [attr.aria-label]='step.subtitle ? \"step \" + (i + 1) + \" \" +  step.title + \" \" + step.subtitle : \"step \" + (i + 1) + \" \" +  step.title' [attr.title]= \"step.title\"\n          [ngClass]=\"{'title-center-align':class && class.includes('classic') && !step.subtitle}\" [tabindex]=\"step.active ? '0' : '-1'\" (keydown)=\"onkeydown($event)\">\n          @if (class && class.includes('classic')) {\n            <span class=\"arrow\"></span>\n          }\n          @if (shouldRenderWizardStepNumberSpan(step)) {\n            <span class=\"wizard-step-number\">\n              @if (class && class.includes('number') && !step.isDone && !showWizardStepIcons) {\n                <span class=\"count\">{{i+1}}</span>\n              }\n              @if (class && (class.includes('dottedstepper') || class.includes('text-inline') && !showWizardStepIcons) && !step.isDone) {\n                <i class=\"dottedstepper\"></i>\n              }\n              @if (class && (class.includes('dottedstepper') || class.includes('number')) && step.isDone) {\n                <i class=\"app-icon wi wi-done\"></i>\n              }\n              @if (shouldShowPrimaryStepIcon(step)) {\n                <wm-app-icon [iconclass]=\"stepIconClassOrDefault(step)\" [iconurl]=\"step.iconurl\"></wm-app-icon>\n              }\n              @if (showWizardStepIcons && step.isDone && hasNonEmptyDoneIconClass(step)) {\n                <wm-app-icon [iconclass]=\"step.doneiconclass\" [iconurl]=\"step.doneiconurl\"></wm-app-icon>\n              }\n            </span>\n          }\n          <span class=\"title-wrapper\">\n            @if (class && class.includes('text-inline')) {\n              <span>{{'0' + (i+1)}}</span>\n            }\n            <span class=\"step-title\" [textContent]=\"step.title\"></span>\n          </span>\n          @if (step.subtitle) {\n            <span class=\"subtitle-wrapper\" [attr.title]=\"step.subtitle\">\n              <span class=\"step-title\" [textContent]=\"step.subtitle\"></span>\n              <a class=\"read_more\" (click)=\"readMoreSubtitle()\" style=\"display:none\">more</a>\n            </span>\n          }\n        </a>\n      </li>\n    }\n  </ul>\n</div>\n@if (type !== 'dynamic') {\n<div class=\"app-wizard-body panel-body\">\n  @if (message.caption) {\n    <p wmMessage caption.bind=\"message.caption\" type.bind=\"message.type\"></p>\n  }\n  <ng-content ngProjectAs=\"form[wmWizardStep]\"></ng-content>\n</div>\n}\n@if (type === 'dynamic') {\n<div class=\"app-wizard-body panel-body\">\n    @if(!fieldDefs?.length) {\n    <div>{{nodatamessage}}</div>\n    }\n    <ng-content select=\"div[wmRepeatTemplate]\"></ng-content>\n</div>\n}\n@if(fieldDefs && fieldDefs.length || type !== 'dynamic') {\n    <ng-container *ngTemplateOutlet=\"wizardAction\"></ng-container>\n}\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: TextContentDirective, selector: "[textContent]", inputs: ["textContent"] }, { kind: "component", type: WmAppIconComponent, selector: "wm-app-icon", inputs: ["icon", "iconclass", "iconurl", "defaultIconClass", "defaultClasses", "iconStyle", "alt"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WizardComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: WizardComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, imports: [CommonModule, TextContentDirective, WmAppIconComponent], selector: 'div[wmWizard]', providers: [
                         provideAsWidgetRef(WizardComponent),
@@ -1030,12 +1041,12 @@ class WizardActionDirective extends BaseComponent {
     constructor(inj, explicitContext) {
         super(inj, WIDGET_INFO, explicitContext);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WizardActionDirective, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WizardActionDirective, isStandalone: true, selector: "div[wmWizardAction]", providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: WizardActionDirective, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.28", type: WizardActionDirective, isStandalone: true, selector: "div[wmWizardAction]", providers: [
             provideAsWidgetRef(WizardActionDirective)
         ], exportAs: ["wmWizardAction"], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WizardActionDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: WizardActionDirective, decorators: [{
             type: Directive,
             args: [{
                     standalone: true,