@koalarx/ui 12.7.19 → 13.0.0

package/folder-page/fesm2015/koalarx-ui-folder-page.js

@@ -1,88 +0,0 @@
-import { Component, ChangeDetectionStrategy, Input, ViewChild, NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { MatIconModule } from '@angular/material/icon';
-import { RouterModule } from '@angular/router';
-import { MatButtonModule } from '@angular/material/button';
-import { KoalaIconModule } from '@koalarx/ui/icon';
-
-class FolderComponent {
-    constructor() {
-        this.titlePage = 'Title';
-        this.customFolderFontColor = '#212121';
-        this.customFolderBackgroudColor = '#FFF';
-    }
-    ngOnInit() {
-        this.setCustomBackgroundColor();
-    }
-    ngOnChanges(changes) {
-        if (changes.customBackgroudColor || changes.customFolderFontColor) {
-            this.setCustomBackgroundColor();
-        }
-    }
-    setCustomBackgroundColor() {
-        var _a, _b, _c;
-        if (this.customFolderBackgroudColor) {
-            const folder = (_a = this.folder) === null || _a === void 0 ? void 0 : _a.nativeElement;
-            folder.style.background = this.customFolderBackgroudColor;
-        }
-        if (this.customFolderFontColor) {
-            const folderTitle = (_b = this.folderTitle) === null || _b === void 0 ? void 0 : _b.nativeElement;
-            folderTitle.style.color = this.customFolderFontColor;
-            const folderIconTitle = (_c = this.folderTitle) === null || _c === void 0 ? void 0 : _c.nativeElement;
-            folderIconTitle.style.color = this.customFolderFontColor;
-            setTimeout(() => {
-                if (this.folderNavigateHistory) {
-                    const folderNavigateHistory = this.folderNavigateHistory.nativeElement;
-                    folderNavigateHistory.style.color = this.customFolderFontColor;
-                }
-            }, 50);
-        }
-    }
-}
-FolderComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'koala-folder-page',
-                template: "<div #folder class=\"folder-list\">\n  <h1 #folderTitle>\n    <mat-icon #folderIconTitle *ngIf=\"titleIcon && !koalaIcon\">{{titleIcon}}</mat-icon>\n    <koala-icon *ngIf=\"titleIcon && koalaIcon\" size=\"20\" [color]=\"customFolderFontColor\" [icon]=\"titleIcon\"></koala-icon>\n    {{titlePage}}\n  </h1>\n  <ul #folderNavigateHistory class=\"navigate-history\" *ngIf=\"navigateHistory\">\n    <li *ngFor=\"let item of navigateHistory\">\n      <a [style]=\"'color: ' + customFolderFontColor\" [ngClass]=\"{'disabled': !item.routerLink}\" [routerLink]=\"item.routerLink\">{{item.name}}</a>\n    </li>\n  </ul>\n  <nav class=\"menu-folder\">\n    <ng-content select=\"[menu-page]\"></ng-content>\n  </nav>\n\n  <div class=\"content\">\n    <ng-content select=\"[content]\"></ng-content>\n  </div>\n\n</div>\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [".folder-list{position:relative;background-size:cover;width:100%;height:160px;box-sizing:border-box}.folder-list h1{padding:0;margin:0;position:absolute;top:20px;left:20px;font-size:1.2em;font-family:OpenSans,sans-serif;font-weight:bold;display:flex;align-items:center}.folder-list h1 mat-icon,.folder-list h1 koala-icon{margin-right:10px}nav.menu-folder{position:absolute;right:0;top:20px;z-index:4;padding:7px 30px}.content{position:relative;display:block;height:calc(100vh - 155px);overflow-x:hidden;top:85px;margin:0 auto;padding:3px 0}.navigate-history{position:absolute;top:45px;display:flex;align-items:center;list-style:none;padding:5px 20px;margin:0;font-size:0}.navigate-history li a{font-size:12px;text-decoration:none}.navigate-history li a.disabled{cursor:default;opacity:.8;pointer-events:none}.navigate-history li:after{content:\">\";padding:0 5px;font-size:12px;color:inherit}.navigate-history li:last-child:after{content:\"\";padding:0}\n"]
-            },] }
-];
-FolderComponent.propDecorators = {
-    titlePage: [{ type: Input }],
-    titleIcon: [{ type: Input }],
-    koalaIcon: [{ type: Input }],
-    customFolderFontColor: [{ type: Input }],
-    customFolderBackgroudColor: [{ type: Input }],
-    navigateHistory: [{ type: Input }],
-    folder: [{ type: ViewChild, args: ['folder', { static: true },] }],
-    folderTitle: [{ type: ViewChild, args: ['folderTitle', { static: true },] }],
-    folderIconTitle: [{ type: ViewChild, args: ['folderIconTitle', { static: true },] }],
-    folderNavigateHistory: [{ type: ViewChild, args: ['folderNavigateHistory', { static: false },] }]
-};
-
-class KoalaFolderPageModule {
-}
-KoalaFolderPageModule.decorators = [
-    { type: NgModule, args: [{
-                declarations: [
-                    FolderComponent
-                ],
-                exports: [
-                    FolderComponent
-                ],
-                imports: [
-                    CommonModule,
-                    RouterModule,
-                    MatButtonModule,
-                    MatIconModule,
-                    KoalaIconModule
-                ]
-            },] }
-];
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { FolderComponent, KoalaFolderPageModule };
-//# sourceMappingURL=koalarx-ui-folder-page.js.map

package/folder-page/fesm2015/koalarx-ui-folder-page.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"koalarx-ui-folder-page.js","sources":["../../../projects/folder-page/src/lib/folder.component.ts","../../../projects/folder-page/src/lib/koala.folder-page.module.ts","../../../projects/folder-page/src/koalarx-ui-folder-page.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  ElementRef,\n  Input,\n  OnChanges,\n  OnInit,\n  SimpleChanges,\n  ViewChild\n} from '@angular/core';\nimport { KoalaNavigateHistoryInterface } from \"./koala-navigate-history.interface\";\n\n@Component({\n  selector: 'koala-folder-page',\n  templateUrl: 'folder.component.html',\n  styleUrls: ['folder.component.css'],\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class FolderComponent implements OnInit, OnChanges {\n  @Input() titlePage: string = 'Title';\n  @Input() titleIcon?: string;\n  @Input() koalaIcon?: boolean;\n  @Input() customFolderFontColor: string = '#212121';\n  @Input() customFolderBackgroudColor: string = '#FFF';\n  @Input() navigateHistory?: KoalaNavigateHistoryInterface[];\n\n  @ViewChild('folder', {static: true}) private folder?: ElementRef;\n  @ViewChild('folderTitle', {static: true}) private folderTitle?: ElementRef;\n  @ViewChild('folderIconTitle', {static: true}) private folderIconTitle?: ElementRef;\n  @ViewChild('folderNavigateHistory', {static: false}) private folderNavigateHistory?: ElementRef;\n\n  ngOnInit() {\n    this.setCustomBackgroundColor();\n  }\n\n  ngOnChanges(changes: SimpleChanges) {\n    if (changes.customBackgroudColor || changes.customFolderFontColor) {\n      this.setCustomBackgroundColor();\n    }\n  }\n\n  private setCustomBackgroundColor() {\n    if (this.customFolderBackgroudColor) {\n      const folder = this.folder?.nativeElement as HTMLDivElement;\n      folder.style.background = this.customFolderBackgroudColor;\n    }\n    if (this.customFolderFontColor) {\n      const folderTitle = this.folderTitle?.nativeElement as HTMLDivElement;\n      folderTitle.style.color = this.customFolderFontColor;\n      const folderIconTitle = this.folderTitle?.nativeElement as HTMLDivElement;\n      folderIconTitle.style.color = this.customFolderFontColor;\n      setTimeout(() => {\n        if (this.folderNavigateHistory) {\n          const folderNavigateHistory = this.folderNavigateHistory.nativeElement as HTMLDivElement;\n          folderNavigateHistory.style.color = this.customFolderFontColor;\n        }\n      }, 50);\n    }\n  }\n}\n","import { NgModule } from '@angular/core';\nimport { FolderComponent } from './folder.component';\nimport { CommonModule } from '@angular/common';\nimport { MatIconModule } from '@angular/material/icon';\nimport { RouterModule } from \"@angular/router\";\nimport { MatButtonModule } from \"@angular/material/button\";\nimport { KoalaIconModule } from \"@koalarx/ui/icon\";\n\n@NgModule({\n  declarations: [\n    FolderComponent\n  ],\n  exports: [\n    FolderComponent\n  ],\n  imports: [\n    CommonModule,\n    RouterModule,\n    MatButtonModule,\n    MatIconModule,\n    KoalaIconModule\n  ]\n})\nexport class KoalaFolderPageModule {\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;MAkBa,eAAe;IAN5B;QAOW,cAAS,GAAW,OAAO,CAAC;QAG5B,0BAAqB,GAAW,SAAS,CAAC;QAC1C,+BAA0B,GAAW,MAAM,CAAC;KAoCtD;IA5BC,QAAQ;QACN,IAAI,CAAC,wBAAwB,EAAE,CAAC;KACjC;IAED,WAAW,CAAC,OAAsB;QAChC,IAAI,OAAO,CAAC,oBAAoB,IAAI,OAAO,CAAC,qBAAqB,EAAE;YACjE,IAAI,CAAC,wBAAwB,EAAE,CAAC;SACjC;KACF;IAEO,wBAAwB;;QAC9B,IAAI,IAAI,CAAC,0BAA0B,EAAE;YACnC,MAAM,MAAM,GAAG,MAAA,IAAI,CAAC,MAAM,0CAAE,aAA+B,CAAC;YAC5D,MAAM,CAAC,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC,0BAA0B,CAAC;SAC3D;QACD,IAAI,IAAI,CAAC,qBAAqB,EAAE;YAC9B,MAAM,WAAW,GAAG,MAAA,IAAI,CAAC,WAAW,0CAAE,aAA+B,CAAC;YACtE,WAAW,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,qBAAqB,CAAC;YACrD,MAAM,eAAe,GAAG,MAAA,IAAI,CAAC,WAAW,0CAAE,aAA+B,CAAC;YAC1E,eAAe,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,qBAAqB,CAAC;YACzD,UAAU,CAAC;gBACT,IAAI,IAAI,CAAC,qBAAqB,EAAE;oBAC9B,MAAM,qBAAqB,GAAG,IAAI,CAAC,qBAAqB,CAAC,aAA+B,CAAC;oBACzF,qBAAqB,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,qBAAqB,CAAC;iBAChE;aACF,EAAE,EAAE,CAAC,CAAC;SACR;KACF;;;YA9CF,SAAS,SAAC;gBACT,QAAQ,EAAE,mBAAmB;gBAC7B,qzBAAoC;gBAEpC,eAAe,EAAE,uBAAuB,CAAC,MAAM;;aAChD;;;wBAEE,KAAK;wBACL,KAAK;wBACL,KAAK;oCACL,KAAK;yCACL,KAAK;8BACL,KAAK;qBAEL,SAAS,SAAC,QAAQ,EAAE,EAAC,MAAM,EAAE,IAAI,EAAC;0BAClC,SAAS,SAAC,aAAa,EAAE,EAAC,MAAM,EAAE,IAAI,EAAC;8BACvC,SAAS,SAAC,iBAAiB,EAAE,EAAC,MAAM,EAAE,IAAI,EAAC;oCAC3C,SAAS,SAAC,uBAAuB,EAAE,EAAC,MAAM,EAAE,KAAK,EAAC;;;MCNxC,qBAAqB;;;YAfjC,QAAQ,SAAC;gBACR,YAAY,EAAE;oBACZ,eAAe;iBAChB;gBACD,OAAO,EAAE;oBACP,eAAe;iBAChB;gBACD,OAAO,EAAE;oBACP,YAAY;oBACZ,YAAY;oBACZ,eAAe;oBACf,aAAa;oBACb,eAAe;iBAChB;aACF;;;ACtBD;;;;;;"}

package/folder-page/koalarx-ui-folder-page.metadata.json

@@ -1 +0,0 @@
-{"__symbolic":"module","version":4,"metadata":{"FolderComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":12,"character":1},"arguments":[{"selector":"koala-folder-page","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":16,"character":19},"member":"OnPush"},"template":"<div #folder class=\"folder-list\">\n  <h1 #folderTitle>\n    <mat-icon #folderIconTitle *ngIf=\"titleIcon && !koalaIcon\">{{titleIcon}}</mat-icon>\n    <koala-icon *ngIf=\"titleIcon && koalaIcon\" size=\"20\" [color]=\"customFolderFontColor\" [icon]=\"titleIcon\"></koala-icon>\n    {{titlePage}}\n  </h1>\n  <ul #folderNavigateHistory class=\"navigate-history\" *ngIf=\"navigateHistory\">\n    <li *ngFor=\"let item of navigateHistory\">\n      <a [style]=\"'color: ' + customFolderFontColor\" [ngClass]=\"{'disabled': !item.routerLink}\" [routerLink]=\"item.routerLink\">{{item.name}}</a>\n    </li>\n  </ul>\n  <nav class=\"menu-folder\">\n    <ng-content select=\"[menu-page]\"></ng-content>\n  </nav>\n\n  <div class=\"content\">\n    <ng-content select=\"[content]\"></ng-content>\n  </div>\n\n</div>\n","styles":[".folder-list{position:relative;background-size:cover;width:100%;height:160px;box-sizing:border-box}.folder-list h1{padding:0;margin:0;position:absolute;top:20px;left:20px;font-size:1.2em;font-family:OpenSans,sans-serif;font-weight:bold;display:flex;align-items:center}.folder-list h1 mat-icon,.folder-list h1 koala-icon{margin-right:10px}nav.menu-folder{position:absolute;right:0;top:20px;z-index:4;padding:7px 30px}.content{position:relative;display:block;height:calc(100vh - 155px);overflow-x:hidden;top:85px;margin:0 auto;padding:3px 0}.navigate-history{position:absolute;top:45px;display:flex;align-items:center;list-style:none;padding:5px 20px;margin:0;font-size:0}.navigate-history li a{font-size:12px;text-decoration:none}.navigate-history li a.disabled{cursor:default;opacity:.8;pointer-events:none}.navigate-history li:after{content:\">\";padding:0 5px;font-size:12px;color:inherit}.navigate-history li:last-child:after{content:\"\";padding:0}\n"]}]}],"members":{"titlePage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"titleIcon":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"koalaIcon":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":3}}]}],"customFolderFontColor":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"customFolderBackgroudColor":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"navigateHistory":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":3}}]}],"folder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":26,"character":3},"arguments":["folder",{"static":true}]}]}],"folderTitle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":27,"character":3},"arguments":["folderTitle",{"static":true}]}]}],"folderIconTitle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":28,"character":3},"arguments":["folderIconTitle",{"static":true}]}]}],"folderNavigateHistory":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":29,"character":3},"arguments":["folderNavigateHistory",{"static":false}]}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"setCustomBackgroundColor":[{"__symbolic":"method"}]}},"KoalaFolderPageModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":8,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"FolderComponent"}],"exports":[{"__symbolic":"reference","name":"FolderComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":16,"character":4},{"__symbolic":"reference","module":"@angular/router","name":"RouterModule","line":17,"character":4},{"__symbolic":"reference","module":"@angular/material/button","name":"MatButtonModule","line":18,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":19,"character":4},{"__symbolic":"reference","module":"@koalarx/ui/icon","name":"KoalaIconModule","line":20,"character":4}]}]}],"members":{}},"KoalaNavigateHistoryInterface":{"__symbolic":"interface"}},"origins":{"FolderComponent":"./lib/folder.component","KoalaFolderPageModule":"./lib/koala.folder-page.module","KoalaNavigateHistoryInterface":"./lib/koala-navigate-history.interface"},"importAs":"@koalarx/ui/folder-page"}