@koalarx/ui 12.7.19 → 13.0.0

package/menu/fesm2015/koalarx-ui-menu.mjs

@@ -0,0 +1,167 @@
+import * as i0 from '@angular/core';
+import { Component, ChangeDetectionStrategy, Input, Injectable, NgModule } from '@angular/core';
+import { __awaiter } from 'tslib';
+import * as i1 from '@angular/router';
+import { NavigationEnd, Scroll, RouterModule } from '@angular/router';
+import { BehaviorSubject } from 'rxjs';
+import { koala } from '@koalarx/utils';
+import { map, switchMap } from 'rxjs/operators';
+import { delay } from '@koalarx/utils/operators/delay';
+import * as i2 from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
+import * as i3 from '@koalarx/ui/icon';
+import { KoalaIconModule } from '@koalarx/ui/icon';
+import * as i4 from '@angular/common';
+import { CommonModule } from '@angular/common';
+
+const menuStateSubject = new BehaviorSubject(null);
+class MenuComponent {
+    constructor(router) {
+        this.router = router;
+    }
+    ngOnInit() {
+        if (this.optionsSubject) {
+            this.optionsSubject.pipe(map((options) => this.defineMenuOptions(options))).subscribe();
+            this.router.events
+                .pipe(switchMap((event) => new Promise((resolve) => __awaiter(this, void 0, void 0, function* () {
+                var _a, _b;
+                while (((_b = (_a = this.optionsSubject) === null || _a === void 0 ? void 0 : _a.getValue()) === null || _b === void 0 ? void 0 : _b.length) === 0) {
+                    yield delay(300);
+                }
+                resolve(event);
+            }))))
+                .pipe(map((event) => {
+                var _a;
+                const options = this.cloneOptions();
+                (_a = this.optionsSubject) === null || _a === void 0 ? void 0 : _a.next(options.map((option) => {
+                    option.active = false;
+                    return option;
+                }));
+                return event;
+            }))
+                .subscribe((event) => {
+                var _a;
+                switch (true) {
+                    case event instanceof Scroll:
+                    case event instanceof NavigationEnd:
+                        const options = this.cloneOptions();
+                        if ((options === null || options === void 0 ? void 0 : options.length) > 0) {
+                            (_a = this.optionsSubject) === null || _a === void 0 ? void 0 : _a.next(this.defineMenuOptions(options, true));
+                        }
+                }
+            });
+        }
+    }
+    toogle(module) {
+        if (this.optionsSubject) {
+            const options = JSON.parse(JSON.stringify(this.optionsSubject.getValue()));
+            this.optionsSubject.next(koala(options)
+                .array()
+                .map((item) => {
+                item.animateOpen = false;
+                item.animateClose = false;
+                if (item.name === module.name) {
+                    item.expanded = !module.expanded;
+                    item.animateOpen = item.expanded;
+                    item.animateClose = !item.expanded;
+                }
+                else {
+                    item.expanded = false;
+                }
+                return item;
+            })
+                .getValue());
+        }
+    }
+    getKoalaIcon(config) {
+        return config.icon;
+    }
+    defineMenuOptions(options, routerChange = false) {
+        options.map((module) => {
+            if (routerChange) {
+                module.animateOpen = false;
+                module.animateClose = false;
+                module.active = module.tools
+                    ? this.router.url === module.routerLink ||
+                        !!module.tools.find((tool) => this.router.url.indexOf(tool.routerLink) >= 0)
+                    : this.router.url === module.routerLink;
+                module.expanded = module.active;
+            }
+            return module;
+        });
+        return options;
+    }
+    cloneOptions() {
+        var _a;
+        return JSON.parse(JSON.stringify((_a = this.optionsSubject) === null || _a === void 0 ? void 0 : _a.getValue()));
+    }
+}
+MenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: MenuComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
+MenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.2", type: MenuComponent, selector: "koala-menu", inputs: { titleMenu: "titleMenu", optionsSubject: "optionsSubject" }, ngImport: i0, template: "<nav>\n  <h2 *ngIf=\"titleMenu\" class=\"title\">{{titleMenu}}</h2>\n  <ul *ngIf=\"(optionsSubject | async) as options\" class=\"list-menu\" [ngClass]=\"{'without-title': !titleMenu}\">\n    <li\n      #moduleItem\n\t    *ngFor=\"let module of options\"\n\t    [ngClass]=\"{\n\t      animateOpen: module.animateOpen,\n\t      animateClose: module.animateClose,\n        expanded: module.expanded,\n        active: module.active\n      }\">\n      <a *ngIf=\"!!module.routerLink else moduleWithoutLink\" [routerLink]=\"module.routerLink\" (click)=\"toogle(module)\" class=\"module\">\n        <mat-icon *ngIf=\"module.icon && !module.koalaIcon\">{{module.icon}}</mat-icon>\n        <koala-icon *ngIf=\"module.icon && module.koalaIcon\" [icon]=\"getKoalaIcon(module)\"></koala-icon>\n        <h3>{{module.name}}</h3>\n        <mat-icon\n\t        *ngIf=\"module.tools?.length ?? 0 > 0\"\n\t        class=\"state-module\">{{module.expanded || module.active ? 'keyboard_arrow_down' : 'keyboard_arrow_right'}}</mat-icon>\n      </a>\n      <ng-template #moduleWithoutLink>\n        <div (click)=\"toogle(module)\" class=\"module\">\n          <mat-icon *ngIf=\"module.icon && !module.koalaIcon\">{{module.icon}}</mat-icon>\n          <koala-icon *ngIf=\"module.icon && module.koalaIcon\" [icon]=\"getKoalaIcon(module)\" [size]=\"18\"></koala-icon>\n          <h3>{{module.name}}</h3>\n          <mat-icon\n\t          *ngIf=\"module.tools?.length ?? 0 > 0\"\n\t          class=\"state-module\">{{module.expanded || module.active ? 'keyboard_arrow_down' : 'keyboard_arrow_right'}}</mat-icon>\n        </div>\n      </ng-template>\n      <ul *ngIf=\"module.tools?.length ?? 0 > 0\">\n        <li *ngFor=\"let tool of module.tools\">\n\t\t      <a [routerLink]=\"tool.routerLink\" routerLinkActive=\"active\">\n\t          <mat-icon *ngIf=\"tool.icon && !tool.koalaIcon\">{{tool.icon}}</mat-icon>\n            <koala-icon *ngIf=\"tool.icon && tool.koalaIcon\" [icon]=\"getKoalaIcon(tool)\" [size]=\"18\"></koala-icon>\n\t          <h4>{{tool.name}}</h4>\n\t\t      </a>\n        </li>\n      </ul>\n    </li>\n  </ul>\n</nav>\n", styles: [".title{font-family:OpenSans,sans-serif;font-size:.8em;font-weight:700;line-height:.8em;margin:0;padding:8px 15px}ul{font-size:0;list-style:none;margin:0;padding:0 20px 0 0;width:100%;box-sizing:border-box}ul.list-menu{height:calc(100vh - 107px);overflow:auto}ul.list-menu.without-title{height:calc(100vh - 78px)}ul ul{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;overflow:hidden;width:100%}ul li{cursor:pointer;display:block;font-size:14px;outline:none;padding:0;position:relative;transition:.2s;overflow:hidden;border-radius:0 20px 20px 0}ul li a{transition:.2s}.module{outline:none;padding:5px 15px;text-decoration:none}a.module{box-sizing:border-box;cursor:pointer;display:block;width:100%}ul li li{border:none!important;padding:0!important;height:0}.state-module{position:absolute;right:10px;top:4px}ul li.active ul{border-bottom:1px solid rgba(0,0,0,.1);box-shadow:0 1px 3px #00000080}ul li.expanded ul{border-bottom:1px solid rgba(0,0,0,.1);box-shadow:0 1px 3px #00000080;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;padding:15px 0}ul li.expanded ul li{height:30px}ul li li a.active{background:rgba(0,0,0,.1)!important;cursor:default;height:-webkit-fit-content!important;height:-moz-fit-content!important;height:fit-content!important}ul li h3,ul li h4,ul li koala-icon,ul li mat-icon{display:inline-flex;line-height:1.5em;margin:0;vertical-align:middle}ul li h3,ul li h4{font-size:.9em}ul li koala-icon,ul li li koala-icon{font-size:18px;height:18px;line-height:18px;margin-right:5px;width:18px}ul li mat-icon,ul li li mat-icon{font-size:20px;height:20px;line-height:20px;margin-right:5px;width:20px}ul li koala-icon,ul li li koala-icon{margin-right:10px}ul li li a{cursor:pointer;display:block;padding:5px 15px!important;text-decoration:none;width:100%}ul li li:hover{background:rgba(0,0,0,.1)}ul li li a.active:hover{background:transparent}\n"], components: [{ type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i3.IconComponent, selector: "koala-icon", inputs: ["color", "icon", "size"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], pipes: { "async": i4.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: MenuComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'koala-menu', changeDetection: ChangeDetectionStrategy.OnPush, template: "<nav>\n  <h2 *ngIf=\"titleMenu\" class=\"title\">{{titleMenu}}</h2>\n  <ul *ngIf=\"(optionsSubject | async) as options\" class=\"list-menu\" [ngClass]=\"{'without-title': !titleMenu}\">\n    <li\n      #moduleItem\n\t    *ngFor=\"let module of options\"\n\t    [ngClass]=\"{\n\t      animateOpen: module.animateOpen,\n\t      animateClose: module.animateClose,\n        expanded: module.expanded,\n        active: module.active\n      }\">\n      <a *ngIf=\"!!module.routerLink else moduleWithoutLink\" [routerLink]=\"module.routerLink\" (click)=\"toogle(module)\" class=\"module\">\n        <mat-icon *ngIf=\"module.icon && !module.koalaIcon\">{{module.icon}}</mat-icon>\n        <koala-icon *ngIf=\"module.icon && module.koalaIcon\" [icon]=\"getKoalaIcon(module)\"></koala-icon>\n        <h3>{{module.name}}</h3>\n        <mat-icon\n\t        *ngIf=\"module.tools?.length ?? 0 > 0\"\n\t        class=\"state-module\">{{module.expanded || module.active ? 'keyboard_arrow_down' : 'keyboard_arrow_right'}}</mat-icon>\n      </a>\n      <ng-template #moduleWithoutLink>\n        <div (click)=\"toogle(module)\" class=\"module\">\n          <mat-icon *ngIf=\"module.icon && !module.koalaIcon\">{{module.icon}}</mat-icon>\n          <koala-icon *ngIf=\"module.icon && module.koalaIcon\" [icon]=\"getKoalaIcon(module)\" [size]=\"18\"></koala-icon>\n          <h3>{{module.name}}</h3>\n          <mat-icon\n\t          *ngIf=\"module.tools?.length ?? 0 > 0\"\n\t          class=\"state-module\">{{module.expanded || module.active ? 'keyboard_arrow_down' : 'keyboard_arrow_right'}}</mat-icon>\n        </div>\n      </ng-template>\n      <ul *ngIf=\"module.tools?.length ?? 0 > 0\">\n        <li *ngFor=\"let tool of module.tools\">\n\t\t      <a [routerLink]=\"tool.routerLink\" routerLinkActive=\"active\">\n\t          <mat-icon *ngIf=\"tool.icon && !tool.koalaIcon\">{{tool.icon}}</mat-icon>\n            <koala-icon *ngIf=\"tool.icon && tool.koalaIcon\" [icon]=\"getKoalaIcon(tool)\" [size]=\"18\"></koala-icon>\n\t          <h4>{{tool.name}}</h4>\n\t\t      </a>\n        </li>\n      </ul>\n    </li>\n  </ul>\n</nav>\n", styles: [".title{font-family:OpenSans,sans-serif;font-size:.8em;font-weight:700;line-height:.8em;margin:0;padding:8px 15px}ul{font-size:0;list-style:none;margin:0;padding:0 20px 0 0;width:100%;box-sizing:border-box}ul.list-menu{height:calc(100vh - 107px);overflow:auto}ul.list-menu.without-title{height:calc(100vh - 78px)}ul ul{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;overflow:hidden;width:100%}ul li{cursor:pointer;display:block;font-size:14px;outline:none;padding:0;position:relative;transition:.2s;overflow:hidden;border-radius:0 20px 20px 0}ul li a{transition:.2s}.module{outline:none;padding:5px 15px;text-decoration:none}a.module{box-sizing:border-box;cursor:pointer;display:block;width:100%}ul li li{border:none!important;padding:0!important;height:0}.state-module{position:absolute;right:10px;top:4px}ul li.active ul{border-bottom:1px solid rgba(0,0,0,.1);box-shadow:0 1px 3px #00000080}ul li.expanded ul{border-bottom:1px solid rgba(0,0,0,.1);box-shadow:0 1px 3px #00000080;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;padding:15px 0}ul li.expanded ul li{height:30px}ul li li a.active{background:rgba(0,0,0,.1)!important;cursor:default;height:-webkit-fit-content!important;height:-moz-fit-content!important;height:fit-content!important}ul li h3,ul li h4,ul li koala-icon,ul li mat-icon{display:inline-flex;line-height:1.5em;margin:0;vertical-align:middle}ul li h3,ul li h4{font-size:.9em}ul li koala-icon,ul li li koala-icon{font-size:18px;height:18px;line-height:18px;margin-right:5px;width:18px}ul li mat-icon,ul li li mat-icon{font-size:20px;height:20px;line-height:20px;margin-right:5px;width:20px}ul li koala-icon,ul li li koala-icon{margin-right:10px}ul li li a{cursor:pointer;display:block;padding:5px 15px!important;text-decoration:none;width:100%}ul li li:hover{background:rgba(0,0,0,.1)}ul li li a.active:hover{background:transparent}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { titleMenu: [{
+                type: Input
+            }], optionsSubject: [{
+                type: Input
+            }] } });
+
+class KoalaMenuService {
+    getMenuState() {
+        return menuStateSubject.getValue();
+    }
+    open() {
+        menuStateSubject.next('open');
+    }
+    close() {
+        menuStateSubject.next('close');
+    }
+    clearConfig() {
+        menuStateSubject.next(null);
+    }
+}
+KoalaMenuService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: KoalaMenuService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+KoalaMenuService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: KoalaMenuService, providedIn: "any" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: KoalaMenuService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: "any" }]
+        }] });
+
+class KoalaMenuModule {
+}
+KoalaMenuModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: KoalaMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+KoalaMenuModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: KoalaMenuModule, declarations: [MenuComponent], imports: [CommonModule,
+        RouterModule,
+        MatIconModule,
+        KoalaIconModule], exports: [MenuComponent] });
+KoalaMenuModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: KoalaMenuModule, imports: [[
+            CommonModule,
+            RouterModule,
+            MatIconModule,
+            KoalaIconModule
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: KoalaMenuModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        MenuComponent
+                    ],
+                    imports: [
+                        CommonModule,
+                        RouterModule,
+                        MatIconModule,
+                        KoalaIconModule
+                    ],
+                    exports: [
+                        MenuComponent
+                    ]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { KoalaMenuModule, KoalaMenuService, MenuComponent, menuStateSubject };
+//# sourceMappingURL=koalarx-ui-menu.mjs.map

package/menu/fesm2015/koalarx-ui-menu.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"koalarx-ui-menu.mjs","sources":["../../../projects/menu/src/lib/menu.component.ts","../../../projects/menu/src/lib/menu.component.html","../../../projects/menu/src/lib/koala.menu.service.ts","../../../projects/menu/src/lib/koala.menu.module.ts","../../../projects/menu/src/koalarx-ui-menu.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Input, OnInit } from '@angular/core';\nimport { KoalaMenuModuleInterface } from './koala.menu-module.interface';\nimport { NavigationEnd, Router, Scroll } from '@angular/router';\nimport { BehaviorSubject } from 'rxjs';\nimport { koala } from '@koalarx/utils';\nimport { map, switchMap } from 'rxjs/operators';\nimport { delay } from '@koalarx/utils/operators/delay';\nimport { KoalaMenuToolInterface } from './koala.menu-tool.interface';\nimport { KoalaIconType } from '@koalarx/ui/icon';\n\nexport type MenuStateType = 'open' | 'close';\nexport const menuStateSubject = new BehaviorSubject<MenuStateType | null>(null);\n\n@Component({\n  selector: 'koala-menu',\n  templateUrl: 'menu.component.html',\n  styleUrls: ['menu.component.css'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class MenuComponent implements OnInit {\n  @Input() titleMenu?: string;\n  @Input() optionsSubject?: BehaviorSubject<KoalaMenuModuleInterface[]>;\n\n  constructor(private router: Router) {}\n\n  ngOnInit() {\n    if (this.optionsSubject) {\n      this.optionsSubject.pipe(map((options) => this.defineMenuOptions(options))).subscribe();\n      this.router.events\n        .pipe(\n          switchMap(\n            (event) =>\n              new Promise(async (resolve) => {\n                while (this.optionsSubject?.getValue()?.length === 0) {\n                  await delay(300);\n                }\n\n                resolve(event);\n              }),\n          ),\n        )\n        .pipe(\n          map((event) => {\n            const options = this.cloneOptions();\n            this.optionsSubject?.next(\n              options.map((option) => {\n                option.active = false;\n                return option;\n              }),\n            );\n\n            return event;\n          }),\n        )\n        .subscribe((event) => {\n          switch (true) {\n            case event instanceof Scroll:\n            case event instanceof NavigationEnd:\n              const options = this.cloneOptions();\n              if (options?.length > 0) {\n                this.optionsSubject?.next(this.defineMenuOptions(options, true));\n              }\n          }\n        });\n    }\n  }\n\n  public toogle(module: KoalaMenuModuleInterface) {\n    if (this.optionsSubject) {\n      const options = JSON.parse(JSON.stringify(this.optionsSubject.getValue())) as KoalaMenuModuleInterface[];\n      this.optionsSubject.next(\n        koala(options)\n          .array<KoalaMenuModuleInterface>()\n          .map((item) => {\n            item.animateOpen = false;\n            item.animateClose = false;\n            if (item.name === module.name) {\n              item.expanded = !module.expanded;\n              item.animateOpen = item.expanded;\n              item.animateClose = !item.expanded;\n            } else {\n              item.expanded = false;\n            }\n            return item;\n          })\n          .getValue(),\n      );\n    }\n  }\n\n  public getKoalaIcon(config: KoalaMenuModuleInterface | KoalaMenuToolInterface) {\n    return config.icon as KoalaIconType;\n  }\n\n  private defineMenuOptions(options: KoalaMenuModuleInterface[], routerChange = false) {\n    options.map((module) => {\n      if (routerChange) {\n        module.animateOpen = false;\n        module.animateClose = false;\n        module.active = module.tools\n          ? this.router.url === module.routerLink ||\n            !!module.tools.find((tool) => this.router.url.indexOf(tool.routerLink) >= 0)\n          : this.router.url === module.routerLink;\n        module.expanded = module.active;\n      }\n\n      return module;\n    });\n    return options;\n  }\n\n  private cloneOptions() {\n    return JSON.parse(JSON.stringify(this.optionsSubject?.getValue())) as KoalaMenuModuleInterface[];\n  }\n}\n","<nav>\n  <h2 *ngIf=\"titleMenu\" class=\"title\">{{titleMenu}}</h2>\n  <ul *ngIf=\"(optionsSubject | async) as options\" class=\"list-menu\" [ngClass]=\"{'without-title': !titleMenu}\">\n    <li\n      #moduleItem\n\t    *ngFor=\"let module of options\"\n\t    [ngClass]=\"{\n\t      animateOpen: module.animateOpen,\n\t      animateClose: module.animateClose,\n        expanded: module.expanded,\n        active: module.active\n      }\">\n      <a *ngIf=\"!!module.routerLink else moduleWithoutLink\" [routerLink]=\"module.routerLink\" (click)=\"toogle(module)\" class=\"module\">\n        <mat-icon *ngIf=\"module.icon && !module.koalaIcon\">{{module.icon}}</mat-icon>\n        <koala-icon *ngIf=\"module.icon && module.koalaIcon\" [icon]=\"getKoalaIcon(module)\"></koala-icon>\n        <h3>{{module.name}}</h3>\n        <mat-icon\n\t        *ngIf=\"module.tools?.length ?? 0 > 0\"\n\t        class=\"state-module\">{{module.expanded || module.active ? 'keyboard_arrow_down' : 'keyboard_arrow_right'}}</mat-icon>\n      </a>\n      <ng-template #moduleWithoutLink>\n        <div (click)=\"toogle(module)\" class=\"module\">\n          <mat-icon *ngIf=\"module.icon && !module.koalaIcon\">{{module.icon}}</mat-icon>\n          <koala-icon *ngIf=\"module.icon && module.koalaIcon\" [icon]=\"getKoalaIcon(module)\" [size]=\"18\"></koala-icon>\n          <h3>{{module.name}}</h3>\n          <mat-icon\n\t          *ngIf=\"module.tools?.length ?? 0 > 0\"\n\t          class=\"state-module\">{{module.expanded || module.active ? 'keyboard_arrow_down' : 'keyboard_arrow_right'}}</mat-icon>\n        </div>\n      </ng-template>\n      <ul *ngIf=\"module.tools?.length ?? 0 > 0\">\n        <li *ngFor=\"let tool of module.tools\">\n\t\t      <a [routerLink]=\"tool.routerLink\" routerLinkActive=\"active\">\n\t          <mat-icon *ngIf=\"tool.icon && !tool.koalaIcon\">{{tool.icon}}</mat-icon>\n            <koala-icon *ngIf=\"tool.icon && tool.koalaIcon\" [icon]=\"getKoalaIcon(tool)\" [size]=\"18\"></koala-icon>\n\t          <h4>{{tool.name}}</h4>\n\t\t      </a>\n        </li>\n      </ul>\n    </li>\n  </ul>\n</nav>\n","import { Injectable } from '@angular/core';\nimport { menuStateSubject, MenuStateType } from './menu.component';\n\n@Injectable({providedIn: \"any\"})\nexport class KoalaMenuService {\n\n\tpublic getMenuState(): MenuStateType | null {\n\t\treturn menuStateSubject.getValue();\n\t}\n\n\tpublic open() {\n\t\tmenuStateSubject.next('open');\n\t}\n\n\tpublic close() {\n\t\tmenuStateSubject.next('close');\n\t}\n\n\tpublic clearConfig() {\n\t\tmenuStateSubject.next(null);\n\t}\n}\n","import { NgModule } from '@angular/core';\nimport { MenuComponent } from './menu.component';\nimport { CommonModule } from '@angular/common';\nimport { MatIconModule } from '@angular/material/icon';\nimport { RouterModule } from '@angular/router';\nimport { KoalaIconModule } from \"@koalarx/ui/icon\";\n\n@NgModule({\n  declarations: [\n    MenuComponent\n  ],\n  imports: [\n    CommonModule,\n    RouterModule,\n    MatIconModule,\n    KoalaIconModule\n  ],\n  exports: [\n    MenuComponent\n  ]\n})\nexport class KoalaMenuModule {\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/menu/fesm2020/koalarx-ui-menu.mjs

@@ -0,0 +1,162 @@
+import * as i0 from '@angular/core';
+import { Component, ChangeDetectionStrategy, Input, Injectable, NgModule } from '@angular/core';
+import * as i1 from '@angular/router';
+import { NavigationEnd, Scroll, RouterModule } from '@angular/router';
+import { BehaviorSubject } from 'rxjs';
+import { koala } from '@koalarx/utils';
+import { map, switchMap } from 'rxjs/operators';
+import { delay } from '@koalarx/utils/operators/delay';
+import * as i2 from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
+import * as i3 from '@koalarx/ui/icon';
+import { KoalaIconModule } from '@koalarx/ui/icon';
+import * as i4 from '@angular/common';
+import { CommonModule } from '@angular/common';
+
+const menuStateSubject = new BehaviorSubject(null);
+class MenuComponent {
+    constructor(router) {
+        this.router = router;
+    }
+    ngOnInit() {
+        if (this.optionsSubject) {
+            this.optionsSubject.pipe(map((options) => this.defineMenuOptions(options))).subscribe();
+            this.router.events
+                .pipe(switchMap((event) => new Promise(async (resolve) => {
+                while (this.optionsSubject?.getValue()?.length === 0) {
+                    await delay(300);
+                }
+                resolve(event);
+            })))
+                .pipe(map((event) => {
+                const options = this.cloneOptions();
+                this.optionsSubject?.next(options.map((option) => {
+                    option.active = false;
+                    return option;
+                }));
+                return event;
+            }))
+                .subscribe((event) => {
+                switch (true) {
+                    case event instanceof Scroll:
+                    case event instanceof NavigationEnd:
+                        const options = this.cloneOptions();
+                        if (options?.length > 0) {
+                            this.optionsSubject?.next(this.defineMenuOptions(options, true));
+                        }
+                }
+            });
+        }
+    }
+    toogle(module) {
+        if (this.optionsSubject) {
+            const options = JSON.parse(JSON.stringify(this.optionsSubject.getValue()));
+            this.optionsSubject.next(koala(options)
+                .array()
+                .map((item) => {
+                item.animateOpen = false;
+                item.animateClose = false;
+                if (item.name === module.name) {
+                    item.expanded = !module.expanded;
+                    item.animateOpen = item.expanded;
+                    item.animateClose = !item.expanded;
+                }
+                else {
+                    item.expanded = false;
+                }
+                return item;
+            })
+                .getValue());
+        }
+    }
+    getKoalaIcon(config) {
+        return config.icon;
+    }
+    defineMenuOptions(options, routerChange = false) {
+        options.map((module) => {
+            if (routerChange) {
+                module.animateOpen = false;
+                module.animateClose = false;
+                module.active = module.tools
+                    ? this.router.url === module.routerLink ||
+                        !!module.tools.find((tool) => this.router.url.indexOf(tool.routerLink) >= 0)
+                    : this.router.url === module.routerLink;
+                module.expanded = module.active;
+            }
+            return module;
+        });
+        return options;
+    }
+    cloneOptions() {
+        return JSON.parse(JSON.stringify(this.optionsSubject?.getValue()));
+    }
+}
+MenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: MenuComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
+MenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.2", type: MenuComponent, selector: "koala-menu", inputs: { titleMenu: "titleMenu", optionsSubject: "optionsSubject" }, ngImport: i0, template: "<nav>\n  <h2 *ngIf=\"titleMenu\" class=\"title\">{{titleMenu}}</h2>\n  <ul *ngIf=\"(optionsSubject | async) as options\" class=\"list-menu\" [ngClass]=\"{'without-title': !titleMenu}\">\n    <li\n      #moduleItem\n\t    *ngFor=\"let module of options\"\n\t    [ngClass]=\"{\n\t      animateOpen: module.animateOpen,\n\t      animateClose: module.animateClose,\n        expanded: module.expanded,\n        active: module.active\n      }\">\n      <a *ngIf=\"!!module.routerLink else moduleWithoutLink\" [routerLink]=\"module.routerLink\" (click)=\"toogle(module)\" class=\"module\">\n        <mat-icon *ngIf=\"module.icon && !module.koalaIcon\">{{module.icon}}</mat-icon>\n        <koala-icon *ngIf=\"module.icon && module.koalaIcon\" [icon]=\"getKoalaIcon(module)\"></koala-icon>\n        <h3>{{module.name}}</h3>\n        <mat-icon\n\t        *ngIf=\"module.tools?.length ?? 0 > 0\"\n\t        class=\"state-module\">{{module.expanded || module.active ? 'keyboard_arrow_down' : 'keyboard_arrow_right'}}</mat-icon>\n      </a>\n      <ng-template #moduleWithoutLink>\n        <div (click)=\"toogle(module)\" class=\"module\">\n          <mat-icon *ngIf=\"module.icon && !module.koalaIcon\">{{module.icon}}</mat-icon>\n          <koala-icon *ngIf=\"module.icon && module.koalaIcon\" [icon]=\"getKoalaIcon(module)\" [size]=\"18\"></koala-icon>\n          <h3>{{module.name}}</h3>\n          <mat-icon\n\t          *ngIf=\"module.tools?.length ?? 0 > 0\"\n\t          class=\"state-module\">{{module.expanded || module.active ? 'keyboard_arrow_down' : 'keyboard_arrow_right'}}</mat-icon>\n        </div>\n      </ng-template>\n      <ul *ngIf=\"module.tools?.length ?? 0 > 0\">\n        <li *ngFor=\"let tool of module.tools\">\n\t\t      <a [routerLink]=\"tool.routerLink\" routerLinkActive=\"active\">\n\t          <mat-icon *ngIf=\"tool.icon && !tool.koalaIcon\">{{tool.icon}}</mat-icon>\n            <koala-icon *ngIf=\"tool.icon && tool.koalaIcon\" [icon]=\"getKoalaIcon(tool)\" [size]=\"18\"></koala-icon>\n\t          <h4>{{tool.name}}</h4>\n\t\t      </a>\n        </li>\n      </ul>\n    </li>\n  </ul>\n</nav>\n", styles: [".title{font-family:OpenSans,sans-serif;font-size:.8em;font-weight:700;line-height:.8em;margin:0;padding:8px 15px}ul{font-size:0;list-style:none;margin:0;padding:0 20px 0 0;width:100%;box-sizing:border-box}ul.list-menu{height:calc(100vh - 107px);overflow:auto}ul.list-menu.without-title{height:calc(100vh - 78px)}ul ul{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;overflow:hidden;width:100%}ul li{cursor:pointer;display:block;font-size:14px;outline:none;padding:0;position:relative;transition:.2s;overflow:hidden;border-radius:0 20px 20px 0}ul li a{transition:.2s}.module{outline:none;padding:5px 15px;text-decoration:none}a.module{box-sizing:border-box;cursor:pointer;display:block;width:100%}ul li li{border:none!important;padding:0!important;height:0}.state-module{position:absolute;right:10px;top:4px}ul li.active ul{border-bottom:1px solid rgba(0,0,0,.1);box-shadow:0 1px 3px #00000080}ul li.expanded ul{border-bottom:1px solid rgba(0,0,0,.1);box-shadow:0 1px 3px #00000080;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;padding:15px 0}ul li.expanded ul li{height:30px}ul li li a.active{background:rgba(0,0,0,.1)!important;cursor:default;height:-webkit-fit-content!important;height:-moz-fit-content!important;height:fit-content!important}ul li h3,ul li h4,ul li koala-icon,ul li mat-icon{display:inline-flex;line-height:1.5em;margin:0;vertical-align:middle}ul li h3,ul li h4{font-size:.9em}ul li koala-icon,ul li li koala-icon{font-size:18px;height:18px;line-height:18px;margin-right:5px;width:18px}ul li mat-icon,ul li li mat-icon{font-size:20px;height:20px;line-height:20px;margin-right:5px;width:20px}ul li koala-icon,ul li li koala-icon{margin-right:10px}ul li li a{cursor:pointer;display:block;padding:5px 15px!important;text-decoration:none;width:100%}ul li li:hover{background:rgba(0,0,0,.1)}ul li li a.active:hover{background:transparent}\n"], components: [{ type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i3.IconComponent, selector: "koala-icon", inputs: ["color", "icon", "size"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], pipes: { "async": i4.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: MenuComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'koala-menu', changeDetection: ChangeDetectionStrategy.OnPush, template: "<nav>\n  <h2 *ngIf=\"titleMenu\" class=\"title\">{{titleMenu}}</h2>\n  <ul *ngIf=\"(optionsSubject | async) as options\" class=\"list-menu\" [ngClass]=\"{'without-title': !titleMenu}\">\n    <li\n      #moduleItem\n\t    *ngFor=\"let module of options\"\n\t    [ngClass]=\"{\n\t      animateOpen: module.animateOpen,\n\t      animateClose: module.animateClose,\n        expanded: module.expanded,\n        active: module.active\n      }\">\n      <a *ngIf=\"!!module.routerLink else moduleWithoutLink\" [routerLink]=\"module.routerLink\" (click)=\"toogle(module)\" class=\"module\">\n        <mat-icon *ngIf=\"module.icon && !module.koalaIcon\">{{module.icon}}</mat-icon>\n        <koala-icon *ngIf=\"module.icon && module.koalaIcon\" [icon]=\"getKoalaIcon(module)\"></koala-icon>\n        <h3>{{module.name}}</h3>\n        <mat-icon\n\t        *ngIf=\"module.tools?.length ?? 0 > 0\"\n\t        class=\"state-module\">{{module.expanded || module.active ? 'keyboard_arrow_down' : 'keyboard_arrow_right'}}</mat-icon>\n      </a>\n      <ng-template #moduleWithoutLink>\n        <div (click)=\"toogle(module)\" class=\"module\">\n          <mat-icon *ngIf=\"module.icon && !module.koalaIcon\">{{module.icon}}</mat-icon>\n          <koala-icon *ngIf=\"module.icon && module.koalaIcon\" [icon]=\"getKoalaIcon(module)\" [size]=\"18\"></koala-icon>\n          <h3>{{module.name}}</h3>\n          <mat-icon\n\t          *ngIf=\"module.tools?.length ?? 0 > 0\"\n\t          class=\"state-module\">{{module.expanded || module.active ? 'keyboard_arrow_down' : 'keyboard_arrow_right'}}</mat-icon>\n        </div>\n      </ng-template>\n      <ul *ngIf=\"module.tools?.length ?? 0 > 0\">\n        <li *ngFor=\"let tool of module.tools\">\n\t\t      <a [routerLink]=\"tool.routerLink\" routerLinkActive=\"active\">\n\t          <mat-icon *ngIf=\"tool.icon && !tool.koalaIcon\">{{tool.icon}}</mat-icon>\n            <koala-icon *ngIf=\"tool.icon && tool.koalaIcon\" [icon]=\"getKoalaIcon(tool)\" [size]=\"18\"></koala-icon>\n\t          <h4>{{tool.name}}</h4>\n\t\t      </a>\n        </li>\n      </ul>\n    </li>\n  </ul>\n</nav>\n", styles: [".title{font-family:OpenSans,sans-serif;font-size:.8em;font-weight:700;line-height:.8em;margin:0;padding:8px 15px}ul{font-size:0;list-style:none;margin:0;padding:0 20px 0 0;width:100%;box-sizing:border-box}ul.list-menu{height:calc(100vh - 107px);overflow:auto}ul.list-menu.without-title{height:calc(100vh - 78px)}ul ul{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;overflow:hidden;width:100%}ul li{cursor:pointer;display:block;font-size:14px;outline:none;padding:0;position:relative;transition:.2s;overflow:hidden;border-radius:0 20px 20px 0}ul li a{transition:.2s}.module{outline:none;padding:5px 15px;text-decoration:none}a.module{box-sizing:border-box;cursor:pointer;display:block;width:100%}ul li li{border:none!important;padding:0!important;height:0}.state-module{position:absolute;right:10px;top:4px}ul li.active ul{border-bottom:1px solid rgba(0,0,0,.1);box-shadow:0 1px 3px #00000080}ul li.expanded ul{border-bottom:1px solid rgba(0,0,0,.1);box-shadow:0 1px 3px #00000080;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;padding:15px 0}ul li.expanded ul li{height:30px}ul li li a.active{background:rgba(0,0,0,.1)!important;cursor:default;height:-webkit-fit-content!important;height:-moz-fit-content!important;height:fit-content!important}ul li h3,ul li h4,ul li koala-icon,ul li mat-icon{display:inline-flex;line-height:1.5em;margin:0;vertical-align:middle}ul li h3,ul li h4{font-size:.9em}ul li koala-icon,ul li li koala-icon{font-size:18px;height:18px;line-height:18px;margin-right:5px;width:18px}ul li mat-icon,ul li li mat-icon{font-size:20px;height:20px;line-height:20px;margin-right:5px;width:20px}ul li koala-icon,ul li li koala-icon{margin-right:10px}ul li li a{cursor:pointer;display:block;padding:5px 15px!important;text-decoration:none;width:100%}ul li li:hover{background:rgba(0,0,0,.1)}ul li li a.active:hover{background:transparent}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { titleMenu: [{
+                type: Input
+            }], optionsSubject: [{
+                type: Input
+            }] } });
+
+class KoalaMenuService {
+    getMenuState() {
+        return menuStateSubject.getValue();
+    }
+    open() {
+        menuStateSubject.next('open');
+    }
+    close() {
+        menuStateSubject.next('close');
+    }
+    clearConfig() {
+        menuStateSubject.next(null);
+    }
+}
+KoalaMenuService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: KoalaMenuService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+KoalaMenuService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: KoalaMenuService, providedIn: "any" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: KoalaMenuService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: "any" }]
+        }] });
+
+class KoalaMenuModule {
+}
+KoalaMenuModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: KoalaMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+KoalaMenuModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: KoalaMenuModule, declarations: [MenuComponent], imports: [CommonModule,
+        RouterModule,
+        MatIconModule,
+        KoalaIconModule], exports: [MenuComponent] });
+KoalaMenuModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: KoalaMenuModule, imports: [[
+            CommonModule,
+            RouterModule,
+            MatIconModule,
+            KoalaIconModule
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: KoalaMenuModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        MenuComponent
+                    ],
+                    imports: [
+                        CommonModule,
+                        RouterModule,
+                        MatIconModule,
+                        KoalaIconModule
+                    ],
+                    exports: [
+                        MenuComponent
+                    ]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { KoalaMenuModule, KoalaMenuService, MenuComponent, menuStateSubject };
+//# sourceMappingURL=koalarx-ui-menu.mjs.map

package/menu/fesm2020/koalarx-ui-menu.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"koalarx-ui-menu.mjs","sources":["../../../projects/menu/src/lib/menu.component.ts","../../../projects/menu/src/lib/menu.component.html","../../../projects/menu/src/lib/koala.menu.service.ts","../../../projects/menu/src/lib/koala.menu.module.ts","../../../projects/menu/src/koalarx-ui-menu.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Input, OnInit } from '@angular/core';\nimport { KoalaMenuModuleInterface } from './koala.menu-module.interface';\nimport { NavigationEnd, Router, Scroll } from '@angular/router';\nimport { BehaviorSubject } from 'rxjs';\nimport { koala } from '@koalarx/utils';\nimport { map, switchMap } from 'rxjs/operators';\nimport { delay } from '@koalarx/utils/operators/delay';\nimport { KoalaMenuToolInterface } from './koala.menu-tool.interface';\nimport { KoalaIconType } from '@koalarx/ui/icon';\n\nexport type MenuStateType = 'open' | 'close';\nexport const menuStateSubject = new BehaviorSubject<MenuStateType | null>(null);\n\n@Component({\n  selector: 'koala-menu',\n  templateUrl: 'menu.component.html',\n  styleUrls: ['menu.component.css'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class MenuComponent implements OnInit {\n  @Input() titleMenu?: string;\n  @Input() optionsSubject?: BehaviorSubject<KoalaMenuModuleInterface[]>;\n\n  constructor(private router: Router) {}\n\n  ngOnInit() {\n    if (this.optionsSubject) {\n      this.optionsSubject.pipe(map((options) => this.defineMenuOptions(options))).subscribe();\n      this.router.events\n        .pipe(\n          switchMap(\n            (event) =>\n              new Promise(async (resolve) => {\n                while (this.optionsSubject?.getValue()?.length === 0) {\n                  await delay(300);\n                }\n\n                resolve(event);\n              }),\n          ),\n        )\n        .pipe(\n          map((event) => {\n            const options = this.cloneOptions();\n            this.optionsSubject?.next(\n              options.map((option) => {\n                option.active = false;\n                return option;\n              }),\n            );\n\n            return event;\n          }),\n        )\n        .subscribe((event) => {\n          switch (true) {\n            case event instanceof Scroll:\n            case event instanceof NavigationEnd:\n              const options = this.cloneOptions();\n              if (options?.length > 0) {\n                this.optionsSubject?.next(this.defineMenuOptions(options, true));\n              }\n          }\n        });\n    }\n  }\n\n  public toogle(module: KoalaMenuModuleInterface) {\n    if (this.optionsSubject) {\n      const options = JSON.parse(JSON.stringify(this.optionsSubject.getValue())) as KoalaMenuModuleInterface[];\n      this.optionsSubject.next(\n        koala(options)\n          .array<KoalaMenuModuleInterface>()\n          .map((item) => {\n            item.animateOpen = false;\n            item.animateClose = false;\n            if (item.name === module.name) {\n              item.expanded = !module.expanded;\n              item.animateOpen = item.expanded;\n              item.animateClose = !item.expanded;\n            } else {\n              item.expanded = false;\n            }\n            return item;\n          })\n          .getValue(),\n      );\n    }\n  }\n\n  public getKoalaIcon(config: KoalaMenuModuleInterface | KoalaMenuToolInterface) {\n    return config.icon as KoalaIconType;\n  }\n\n  private defineMenuOptions(options: KoalaMenuModuleInterface[], routerChange = false) {\n    options.map((module) => {\n      if (routerChange) {\n        module.animateOpen = false;\n        module.animateClose = false;\n        module.active = module.tools\n          ? this.router.url === module.routerLink ||\n            !!module.tools.find((tool) => this.router.url.indexOf(tool.routerLink) >= 0)\n          : this.router.url === module.routerLink;\n        module.expanded = module.active;\n      }\n\n      return module;\n    });\n    return options;\n  }\n\n  private cloneOptions() {\n    return JSON.parse(JSON.stringify(this.optionsSubject?.getValue())) as KoalaMenuModuleInterface[];\n  }\n}\n","<nav>\n  <h2 *ngIf=\"titleMenu\" class=\"title\">{{titleMenu}}</h2>\n  <ul *ngIf=\"(optionsSubject | async) as options\" class=\"list-menu\" [ngClass]=\"{'without-title': !titleMenu}\">\n    <li\n      #moduleItem\n\t    *ngFor=\"let module of options\"\n\t    [ngClass]=\"{\n\t      animateOpen: module.animateOpen,\n\t      animateClose: module.animateClose,\n        expanded: module.expanded,\n        active: module.active\n      }\">\n      <a *ngIf=\"!!module.routerLink else moduleWithoutLink\" [routerLink]=\"module.routerLink\" (click)=\"toogle(module)\" class=\"module\">\n        <mat-icon *ngIf=\"module.icon && !module.koalaIcon\">{{module.icon}}</mat-icon>\n        <koala-icon *ngIf=\"module.icon && module.koalaIcon\" [icon]=\"getKoalaIcon(module)\"></koala-icon>\n        <h3>{{module.name}}</h3>\n        <mat-icon\n\t        *ngIf=\"module.tools?.length ?? 0 > 0\"\n\t        class=\"state-module\">{{module.expanded || module.active ? 'keyboard_arrow_down' : 'keyboard_arrow_right'}}</mat-icon>\n      </a>\n      <ng-template #moduleWithoutLink>\n        <div (click)=\"toogle(module)\" class=\"module\">\n          <mat-icon *ngIf=\"module.icon && !module.koalaIcon\">{{module.icon}}</mat-icon>\n          <koala-icon *ngIf=\"module.icon && module.koalaIcon\" [icon]=\"getKoalaIcon(module)\" [size]=\"18\"></koala-icon>\n          <h3>{{module.name}}</h3>\n          <mat-icon\n\t          *ngIf=\"module.tools?.length ?? 0 > 0\"\n\t          class=\"state-module\">{{module.expanded || module.active ? 'keyboard_arrow_down' : 'keyboard_arrow_right'}}</mat-icon>\n        </div>\n      </ng-template>\n      <ul *ngIf=\"module.tools?.length ?? 0 > 0\">\n        <li *ngFor=\"let tool of module.tools\">\n\t\t      <a [routerLink]=\"tool.routerLink\" routerLinkActive=\"active\">\n\t          <mat-icon *ngIf=\"tool.icon && !tool.koalaIcon\">{{tool.icon}}</mat-icon>\n            <koala-icon *ngIf=\"tool.icon && tool.koalaIcon\" [icon]=\"getKoalaIcon(tool)\" [size]=\"18\"></koala-icon>\n\t          <h4>{{tool.name}}</h4>\n\t\t      </a>\n        </li>\n      </ul>\n    </li>\n  </ul>\n</nav>\n","import { Injectable } from '@angular/core';\nimport { menuStateSubject, MenuStateType } from './menu.component';\n\n@Injectable({providedIn: \"any\"})\nexport class KoalaMenuService {\n\n\tpublic getMenuState(): MenuStateType | null {\n\t\treturn menuStateSubject.getValue();\n\t}\n\n\tpublic open() {\n\t\tmenuStateSubject.next('open');\n\t}\n\n\tpublic close() {\n\t\tmenuStateSubject.next('close');\n\t}\n\n\tpublic clearConfig() {\n\t\tmenuStateSubject.next(null);\n\t}\n}\n","import { NgModule } from '@angular/core';\nimport { MenuComponent } from './menu.component';\nimport { CommonModule } from '@angular/common';\nimport { MatIconModule } from '@angular/material/icon';\nimport { RouterModule } from '@angular/router';\nimport { KoalaIconModule } from \"@koalarx/ui/icon\";\n\n@NgModule({\n  declarations: [\n    MenuComponent\n  ],\n  imports: [\n    CommonModule,\n    RouterModule,\n    MatIconModule,\n    KoalaIconModule\n  ],\n  exports: [\n    MenuComponent\n  ]\n})\nexport class KoalaMenuModule {\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;MAWa,gBAAgB,GAAG,IAAI,eAAe,CAAuB,IAAI,EAAE;MAQnE,aAAa;IAIxB,YAAoB,MAAc;QAAd,WAAM,GAAN,MAAM,CAAQ;KAAI;IAEtC,QAAQ;QACN,IAAI,IAAI,CAAC,cAAc,EAAE;YACvB,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,OAAO,KAAK,IAAI,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,SAAS,EAAE,CAAC;YACxF,IAAI,CAAC,MAAM,CAAC,MAAM;iBACf,IAAI,CACH,SAAS,CACP,CAAC,KAAK,KACJ,IAAI,OAAO,CAAC,OAAO,OAAO;gBACxB,OAAO,IAAI,CAAC,cAAc,EAAE,QAAQ,EAAE,EAAE,MAAM,KAAK,CAAC,EAAE;oBACpD,MAAM,KAAK,CAAC,GAAG,CAAC,CAAC;iBAClB;gBAED,OAAO,CAAC,KAAK,CAAC,CAAC;aAChB,CAAC,CACL,CACF;iBACA,IAAI,CACH,GAAG,CAAC,CAAC,KAAK;gBACR,MAAM,OAAO,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;gBACpC,IAAI,CAAC,cAAc,EAAE,IAAI,CACvB,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM;oBACjB,MAAM,CAAC,MAAM,GAAG,KAAK,CAAC;oBACtB,OAAO,MAAM,CAAC;iBACf,CAAC,CACH,CAAC;gBAEF,OAAO,KAAK,CAAC;aACd,CAAC,CACH;iBACA,SAAS,CAAC,CAAC,KAAK;gBACf,QAAQ,IAAI;oBACV,KAAK,KAAK,YAAY,MAAM,CAAC;oBAC7B,KAAK,KAAK,YAAY,aAAa;wBACjC,MAAM,OAAO,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;wBACpC,IAAI,OAAO,EAAE,MAAM,GAAG,CAAC,EAAE;4BACvB,IAAI,CAAC,cAAc,EAAE,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC;yBAClE;iBACJ;aACF,CAAC,CAAC;SACN;KACF;IAEM,MAAM,CAAC,MAAgC;QAC5C,IAAI,IAAI,CAAC,cAAc,EAAE;YACvB,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC,CAA+B,CAAC;YACzG,IAAI,CAAC,cAAc,CAAC,IAAI,CACtB,KAAK,CAAC,OAAO,CAAC;iBACX,KAAK,EAA4B;iBACjC,GAAG,CAAC,CAAC,IAAI;gBACR,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;gBACzB,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;gBAC1B,IAAI,IAAI,CAAC,IAAI,KAAK,MAAM,CAAC,IAAI,EAAE;oBAC7B,IAAI,CAAC,QAAQ,GAAG,CAAC,MAAM,CAAC,QAAQ,CAAC;oBACjC,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,QAAQ,CAAC;oBACjC,IAAI,CAAC,YAAY,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;iBACpC;qBAAM;oBACL,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;iBACvB;gBACD,OAAO,IAAI,CAAC;aACb,CAAC;iBACD,QAAQ,EAAE,CACd,CAAC;SACH;KACF;IAEM,YAAY,CAAC,MAAyD;QAC3E,OAAO,MAAM,CAAC,IAAqB,CAAC;KACrC;IAEO,iBAAiB,CAAC,OAAmC,EAAE,YAAY,GAAG,KAAK;QACjF,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM;YACjB,IAAI,YAAY,EAAE;gBAChB,MAAM,CAAC,WAAW,GAAG,KAAK,CAAC;gBAC3B,MAAM,CAAC,YAAY,GAAG,KAAK,CAAC;gBAC5B,MAAM,CAAC,MAAM,GAAG,MAAM,CAAC,KAAK;sBACxB,IAAI,CAAC,MAAM,CAAC,GAAG,KAAK,MAAM,CAAC,UAAU;wBACrC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;sBAC5E,IAAI,CAAC,MAAM,CAAC,GAAG,KAAK,MAAM,CAAC,UAAU,CAAC;gBAC1C,MAAM,CAAC,QAAQ,GAAG,MAAM,CAAC,MAAM,CAAC;aACjC;YAED,OAAO,MAAM,CAAC;SACf,CAAC,CAAC;QACH,OAAO,OAAO,CAAC;KAChB;IAEO,YAAY;QAClB,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,cAAc,EAAE,QAAQ,EAAE,CAAC,CAA+B,CAAC;KAClG;;0GA9FU,aAAa;8FAAb,aAAa,wHCnB1B,ykEA0CA;2FDvBa,aAAa;kBANzB,SAAS;+BACE,YAAY,mBAGL,uBAAuB,CAAC,MAAM;6FAGtC,SAAS;sBAAjB,KAAK;gBACG,cAAc;sBAAtB,KAAK;;;MEjBK,gBAAgB;IAErB,YAAY;QAClB,OAAO,gBAAgB,CAAC,QAAQ,EAAE,CAAC;KACnC;IAEM,IAAI;QACV,gBAAgB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;KAC9B;IAEM,KAAK;QACX,gBAAgB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KAC/B;IAEM,WAAW;QACjB,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAC5B;;6GAhBW,gBAAgB;iHAAhB,gBAAgB,cADJ,KAAK;2FACjB,gBAAgB;kBAD5B,UAAU;mBAAC,EAAC,UAAU,EAAE,KAAK,EAAC;;;MCkBlB,eAAe;;4GAAf,eAAe;6GAAf,eAAe,iBAZxB,aAAa,aAGb,YAAY;QACZ,YAAY;QACZ,aAAa;QACb,eAAe,aAGf,aAAa;6GAGJ,eAAe,YAVjB;YACP,YAAY;YACZ,YAAY;YACZ,aAAa;YACb,eAAe;SAChB;2FAKU,eAAe;kBAd3B,QAAQ;mBAAC;oBACR,YAAY,EAAE;wBACZ,aAAa;qBACd;oBACD,OAAO,EAAE;wBACP,YAAY;wBACZ,YAAY;wBACZ,aAAa;wBACb,eAAe;qBAChB;oBACD,OAAO,EAAE;wBACP,aAAa;qBACd;iBACF;;;ACpBD;;;;;;"}

package/menu/koalarx-ui-menu.d.ts

@@ -1,4 +1,5 @@
 /**
  * Generated bundle index. Do not edit.
  */
+/// <amd-module name="@koalarx/ui/menu" />
 export * from './index';

package/menu/lib/koala.menu.module.d.ts

@@ -1,2 +1,11 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./menu.component";
+import * as i2 from "@angular/common";
+import * as i3 from "@angular/router";
+import * as i4 from "@angular/material/icon";
+import * as i5 from "@koalarx/ui/icon";
 export declare class KoalaMenuModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<KoalaMenuModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<KoalaMenuModule, [typeof i1.MenuComponent], [typeof i2.CommonModule, typeof i3.RouterModule, typeof i4.MatIconModule, typeof i5.KoalaIconModule], [typeof i1.MenuComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<KoalaMenuModule>;
 }

package/menu/lib/koala.menu.service.d.ts

@@ -1,7 +1,10 @@
 import { MenuStateType } from './menu.component';
+import * as i0 from "@angular/core";
 export declare class KoalaMenuService {
     getMenuState(): MenuStateType | null;
     open(): void;
     close(): void;
     clearConfig(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KoalaMenuService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<KoalaMenuService>;
 }

package/menu/lib/menu.component.d.ts

@@ -2,6 +2,9 @@ import { OnInit } from '@angular/core';
 import { KoalaMenuModuleInterface } from './koala.menu-module.interface';
 import { Router } from '@angular/router';
 import { BehaviorSubject } from 'rxjs';
+import { KoalaMenuToolInterface } from './koala.menu-tool.interface';
+import { KoalaIconType } from '@koalarx/ui/icon';
+import * as i0 from "@angular/core";
 export declare type MenuStateType = 'open' | 'close';
 export declare const menuStateSubject: BehaviorSubject<MenuStateType | null>;
 export declare class MenuComponent implements OnInit {
@@ -11,6 +14,9 @@ export declare class MenuComponent implements OnInit {
     constructor(router: Router);
     ngOnInit(): void;
     toogle(module: KoalaMenuModuleInterface): void;
+    getKoalaIcon(config: KoalaMenuModuleInterface | KoalaMenuToolInterface): KoalaIconType;
     private defineMenuOptions;
     private cloneOptions;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MenuComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MenuComponent, "koala-menu", never, { "titleMenu": "titleMenu"; "optionsSubject": "optionsSubject"; }, {}, never, never>;
 }

package/menu/package.json

@@ -8,12 +8,24 @@
   "dependencies": {
     "tslib": "^2.1.0"
   },
-  "main": "bundles/koalarx-ui-menu.umd.js",
-  "module": "fesm2015/koalarx-ui-menu.js",
-  "es2015": "fesm2015/koalarx-ui-menu.js",
-  "esm2015": "esm2015/koalarx-ui-menu.js",
-  "fesm2015": "fesm2015/koalarx-ui-menu.js",
+  "module": "fesm2015/koalarx-ui-menu.mjs",
+  "es2020": "fesm2020/koalarx-ui-menu.mjs",
+  "esm2020": "esm2020/koalarx-ui-menu.mjs",
+  "fesm2020": "fesm2020/koalarx-ui-menu.mjs",
+  "fesm2015": "fesm2015/koalarx-ui-menu.mjs",
   "typings": "koalarx-ui-menu.d.ts",
-  "metadata": "koalarx-ui-menu.metadata.json",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./koalarx-ui-menu.d.ts",
+      "esm2020": "./esm2020/koalarx-ui-menu.mjs",
+      "es2020": "./fesm2020/koalarx-ui-menu.mjs",
+      "es2015": "./fesm2015/koalarx-ui-menu.mjs",
+      "node": "./fesm2015/koalarx-ui-menu.mjs",
+      "default": "./fesm2020/koalarx-ui-menu.mjs"
+    }
+  },
   "sideEffects": false
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@koalarx/ui",
-  "version": "12.7.19",
+  "version": "13.0.0",
   "description": "Koala UI is a Design System developed in Angular whose objective is to facilitate and make your development faster and simpler, making this framework your greatest ally.",
   "repository": {
     "type": "git",

package/question/esm2020/lib/dialog-question.component.mjs

@@ -0,0 +1,25 @@
+import { ChangeDetectionStrategy, Component, Inject } from '@angular/core';
+import { MAT_DIALOG_DATA } from '@angular/material/dialog';
+import { KoalaLanguageHelper } from "@koalarx/ui/core";
+import * as i0 from "@angular/core";
+import * as i1 from "@koalarx/ui/dynamic-component";
+import * as i2 from "@angular/material/icon";
+import * as i3 from "@angular/material/button";
+import * as i4 from "@angular/material/dialog";
+import * as i5 from "@angular/common";
+export class DialogQuestionComponent {
+    constructor(config) {
+        this.config = config;
+        this.languageHelper = KoalaLanguageHelper;
+    }
+}
+DialogQuestionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DialogQuestionComponent, deps: [{ token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
+DialogQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.2", type: DialogQuestionComponent, selector: "ng-component", ngImport: i0, template: "<div mat-dialog-content>\n  <div class=\"question\">\n\t  <koala-dynamic-component\n\t\t  *ngIf=\"config.avatar else notHaveAvatar\"\n\t\t  [dynamicComponent]=\"config.avatar\">\n\t  </koala-dynamic-component>\n\t  <ng-template #notHaveAvatar>\n      <mat-icon>help</mat-icon>\n\t  </ng-template>\n    <p [innerHTML]=\"config.message\" class=\"alert-message text-center\"></p>\n  </div>\n</div>\n<div align=\"center\" mat-dialog-actions>\n  <button [mat-dialog-close]=\"{question: true}\" color=\"primary\" class=\"outline\" mat-button>{{languageHelper.getYesMessage()}}</button>\n  <button [mat-dialog-close]=\"{question: false}\" color=\"warn\" class=\"outline\" mat-button>{{languageHelper.getNoMessage()}}</button>\n</div>\n", styles: [".question{color:#616161}.question .alert-message{font-family:OpenSans,sans-serif;margin:20px auto 10px!important}.question mat-icon{position:relative;display:block;margin:15px auto;width:60px;height:60px;font-size:60px;color:#1565c0}\n"], components: [{ type: i1.KoalaDynamicComponentFactory, selector: "koala-dynamic-component", inputs: ["dynamicComponent"] }, { type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i4.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i4.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: DialogQuestionComponent, decorators: [{
+            type: Component,
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, template: "<div mat-dialog-content>\n  <div class=\"question\">\n\t  <koala-dynamic-component\n\t\t  *ngIf=\"config.avatar else notHaveAvatar\"\n\t\t  [dynamicComponent]=\"config.avatar\">\n\t  </koala-dynamic-component>\n\t  <ng-template #notHaveAvatar>\n      <mat-icon>help</mat-icon>\n\t  </ng-template>\n    <p [innerHTML]=\"config.message\" class=\"alert-message text-center\"></p>\n  </div>\n</div>\n<div align=\"center\" mat-dialog-actions>\n  <button [mat-dialog-close]=\"{question: true}\" color=\"primary\" class=\"outline\" mat-button>{{languageHelper.getYesMessage()}}</button>\n  <button [mat-dialog-close]=\"{question: false}\" color=\"warn\" class=\"outline\" mat-button>{{languageHelper.getNoMessage()}}</button>\n</div>\n", styles: [".question{color:#616161}.question .alert-message{font-family:OpenSans,sans-serif;margin:20px auto 10px!important}.question mat-icon{position:relative;display:block;margin:15px auto;width:60px;height:60px;font-size:60px;color:#1565c0}\n"] }]
+        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+                    type: Inject,
+                    args: [MAT_DIALOG_DATA]
+                }] }]; } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGlhbG9nLXF1ZXN0aW9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL3F1ZXN0aW9uL3NyYy9saWIvZGlhbG9nLXF1ZXN0aW9uLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uL3Byb2plY3RzL3F1ZXN0aW9uL3NyYy9saWIvZGlhbG9nLXF1ZXN0aW9uLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzNFLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSwwQkFBMEIsQ0FBQztBQUUzRCxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSxrQkFBa0IsQ0FBQzs7Ozs7OztBQU92RCxNQUFNLE9BQU8sdUJBQXVCO0lBR2xDLFlBQTRDLE1BQW9DO1FBQXBDLFdBQU0sR0FBTixNQUFNLENBQThCO1FBRnpFLG1CQUFjLEdBQUcsbUJBQW1CLENBQUM7SUFHNUMsQ0FBQzs7b0hBSlUsdUJBQXVCLGtCQUdkLGVBQWU7d0dBSHhCLHVCQUF1QixvRENWcEMsMHRCQWdCQTsyRkROYSx1QkFBdUI7a0JBTG5DLFNBQVM7c0NBR1MsdUJBQXVCLENBQUMsTUFBTTs7MEJBS2xDLE1BQU07MkJBQUMsZUFBZSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIEluamVjdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgTUFUX0RJQUxPR19EQVRBIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvZGlhbG9nJztcbmltcG9ydCB7IEtvYWxhUXVlc3Rpb25Db25maWdJbnRlcmZhY2UgfSBmcm9tICcuL2tvYWxhLXF1ZXN0aW9uLWNvbmZpZy5pbnRlcmZhY2UnO1xuaW1wb3J0IHsgS29hbGFMYW5ndWFnZUhlbHBlciB9IGZyb20gXCJAa29hbGFyeC91aS9jb3JlXCI7XG5cbkBDb21wb25lbnQoe1xuICB0ZW1wbGF0ZVVybDogJ2RpYWxvZy1xdWVzdGlvbi5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWydkaWFsb2ctcXVlc3Rpb24uY29tcG9uZW50LmNzcyddLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaFxufSlcbmV4cG9ydCBjbGFzcyBEaWFsb2dRdWVzdGlvbkNvbXBvbmVudCB7XG4gIHB1YmxpYyBsYW5ndWFnZUhlbHBlciA9IEtvYWxhTGFuZ3VhZ2VIZWxwZXI7XG5cbiAgY29uc3RydWN0b3IoQEluamVjdChNQVRfRElBTE9HX0RBVEEpIHB1YmxpYyBjb25maWc6IEtvYWxhUXVlc3Rpb25Db25maWdJbnRlcmZhY2UpIHtcbiAgfVxufVxuIiwiPGRpdiBtYXQtZGlhbG9nLWNvbnRlbnQ+XG4gIDxkaXYgY2xhc3M9XCJxdWVzdGlvblwiPlxuXHQgIDxrb2FsYS1keW5hbWljLWNvbXBvbmVudFxuXHRcdCAgKm5nSWY9XCJjb25maWcuYXZhdGFyIGVsc2Ugbm90SGF2ZUF2YXRhclwiXG5cdFx0ICBbZHluYW1pY0NvbXBvbmVudF09XCJjb25maWcuYXZhdGFyXCI+XG5cdCAgPC9rb2FsYS1keW5hbWljLWNvbXBvbmVudD5cblx0ICA8bmctdGVtcGxhdGUgI25vdEhhdmVBdmF0YXI+XG4gICAgICA8bWF0LWljb24+aGVscDwvbWF0LWljb24+XG5cdCAgPC9uZy10ZW1wbGF0ZT5cbiAgICA8cCBbaW5uZXJIVE1MXT1cImNvbmZpZy5tZXNzYWdlXCIgY2xhc3M9XCJhbGVydC1tZXNzYWdlIHRleHQtY2VudGVyXCI+PC9wPlxuICA8L2Rpdj5cbjwvZGl2PlxuPGRpdiBhbGlnbj1cImNlbnRlclwiIG1hdC1kaWFsb2ctYWN0aW9ucz5cbiAgPGJ1dHRvbiBbbWF0LWRpYWxvZy1jbG9zZV09XCJ7cXVlc3Rpb246IHRydWV9XCIgY29sb3I9XCJwcmltYXJ5XCIgY2xhc3M9XCJvdXRsaW5lXCIgbWF0LWJ1dHRvbj57e2xhbmd1YWdlSGVscGVyLmdldFllc01lc3NhZ2UoKX19PC9idXR0b24+XG4gIDxidXR0b24gW21hdC1kaWFsb2ctY2xvc2VdPVwie3F1ZXN0aW9uOiBmYWxzZX1cIiBjb2xvcj1cIndhcm5cIiBjbGFzcz1cIm91dGxpbmVcIiBtYXQtYnV0dG9uPnt7bGFuZ3VhZ2VIZWxwZXIuZ2V0Tm9NZXNzYWdlKCl9fTwvYnV0dG9uPlxuPC9kaXY+XG4iXX0=

package/question/esm2020/lib/koala.question.module.mjs

@@ -0,0 +1,42 @@
+import { NgModule } from '@angular/core';
+import { DialogQuestionComponent } from './dialog-question.component';
+import { MatDialogModule } from '@angular/material/dialog';
+import { MatIconModule } from '@angular/material/icon';
+import { MatButtonModule } from '@angular/material/button';
+import { CommonModule } from '@angular/common';
+import { KoalaDynamicComponentModule } from '@koalarx/ui/dynamic-component';
+import * as i0 from "@angular/core";
+export class KoalaQuestionModule {
+}
+KoalaQuestionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: KoalaQuestionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+KoalaQuestionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: KoalaQuestionModule, declarations: [DialogQuestionComponent], imports: [CommonModule,
+        KoalaDynamicComponentModule,
+        MatDialogModule,
+        MatButtonModule,
+        MatIconModule], exports: [DialogQuestionComponent] });
+KoalaQuestionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: KoalaQuestionModule, imports: [[
+            CommonModule,
+            KoalaDynamicComponentModule,
+            MatDialogModule,
+            MatButtonModule,
+            MatIconModule
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImport: i0, type: KoalaQuestionModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        DialogQuestionComponent
+                    ],
+                    imports: [
+                        CommonModule,
+                        KoalaDynamicComponentModule,
+                        MatDialogModule,
+                        MatButtonModule,
+                        MatIconModule
+                    ],
+                    exports: [
+                        DialogQuestionComponent
+                    ]
+                }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoia29hbGEucXVlc3Rpb24ubW9kdWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvcXVlc3Rpb24vc3JjL2xpYi9rb2FsYS5xdWVzdGlvbi5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6QyxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsTUFBTSw2QkFBNkIsQ0FBQztBQUN0RSxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sMEJBQTBCLENBQUM7QUFDM0QsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLHdCQUF3QixDQUFDO0FBQ3ZELE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSwwQkFBMEIsQ0FBQztBQUMzRCxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLDJCQUEyQixFQUFFLE1BQU0sK0JBQStCLENBQUM7O0FBaUI1RSxNQUFNLE9BQU8sbUJBQW1COztnSEFBbkIsbUJBQW1CO2lIQUFuQixtQkFBbUIsaUJBYjVCLHVCQUF1QixhQUd2QixZQUFZO1FBQ1osMkJBQTJCO1FBQzNCLGVBQWU7UUFDZixlQUFlO1FBQ2YsYUFBYSxhQUdiLHVCQUF1QjtpSEFHZCxtQkFBbUIsWUFYckI7WUFDUCxZQUFZO1lBQ1osMkJBQTJCO1lBQzNCLGVBQWU7WUFDZixlQUFlO1lBQ2YsYUFBYTtTQUNkOzJGQUtVLG1CQUFtQjtrQkFmL0IsUUFBUTttQkFBQztvQkFDUixZQUFZLEVBQUU7d0JBQ1osdUJBQXVCO3FCQUN4QjtvQkFDRCxPQUFPLEVBQUU7d0JBQ1AsWUFBWTt3QkFDWiwyQkFBMkI7d0JBQzNCLGVBQWU7d0JBQ2YsZUFBZTt3QkFDZixhQUFhO3FCQUNkO29CQUNELE9BQU8sRUFBRTt3QkFDUCx1QkFBdUI7cUJBQ3hCO2lCQUNGIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTmdNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IERpYWxvZ1F1ZXN0aW9uQ29tcG9uZW50IH0gZnJvbSAnLi9kaWFsb2ctcXVlc3Rpb24uY29tcG9uZW50JztcbmltcG9ydCB7IE1hdERpYWxvZ01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL2RpYWxvZyc7XG5pbXBvcnQgeyBNYXRJY29uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvaWNvbic7XG5pbXBvcnQgeyBNYXRCdXR0b25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9idXR0b24nO1xuaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IEtvYWxhRHluYW1pY0NvbXBvbmVudE1vZHVsZSB9IGZyb20gJ0Brb2FsYXJ4L3VpL2R5bmFtaWMtY29tcG9uZW50JztcblxuQE5nTW9kdWxlKHtcbiAgZGVjbGFyYXRpb25zOiBbXG4gICAgRGlhbG9nUXVlc3Rpb25Db21wb25lbnRcbiAgXSxcbiAgaW1wb3J0czogW1xuICAgIENvbW1vbk1vZHVsZSxcbiAgICBLb2FsYUR5bmFtaWNDb21wb25lbnRNb2R1bGUsXG4gICAgTWF0RGlhbG9nTW9kdWxlLFxuICAgIE1hdEJ1dHRvbk1vZHVsZSxcbiAgICBNYXRJY29uTW9kdWxlXG4gIF0sXG4gIGV4cG9ydHM6IFtcbiAgICBEaWFsb2dRdWVzdGlvbkNvbXBvbmVudFxuICBdXG59KVxuZXhwb3J0IGNsYXNzIEtvYWxhUXVlc3Rpb25Nb2R1bGUge1xufVxuIl19