@indice/ng-components 0.2.20 → 0.2.25

package/README.md

@@ -1,4 +1,4 @@
-# INDICE ANGULAR Components
-
-Indice common components for Angular 2+
-This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 11.2.14.
+# INDICE ANGULAR Components
+
+Indice common components for Angular 2+
+This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 11.2.14.

package/bundles/indice-ng-components.umd.js

@@ -252,10 +252,16 @@
                 r[k] = a[j];
         return r;
     }
-    function __spreadArray(to, from) {
-        for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
-            to[j] = from[i];
-        return to;
+    function __spreadArray(to, from, pack) {
+        if (pack || arguments.length === 2)
+            for (var i = 0, l = from.length, ar; i < l; i++) {
+                if (ar || !(i in from)) {
+                    if (!ar)
+                        ar = Array.prototype.slice.call(from, 0, i);
+                    ar[i] = from[i];
+                }
+            }
+        return to.concat(ar || Array.prototype.slice.call(from));
     }
     function __await(v) {
         return this instanceof __await ? (this.v = v, this) : new __await(v);
@@ -620,6 +626,7 @@
     Icons.Add = "ms-Icon ms-Icon--Add";
     Icons.SendEmail = "ms-Icon ms-Icon--NewMail";
     Icons.Filter = "ms-Icon ms-Icon--Filter";
+    Icons.Export = "ms-Icon ms-Icon--ExcelDocument";
     Icons.TilesView = "ms-Icon ms-Icon--AppIconDefault";
     Icons.TableView = "ms-Icon ms-Icon--Table";
     Icons.MapView = "ms-Icon ms-Icon--MapPin";
@@ -1070,7 +1077,7 @@
     ListViewEmptyStateComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'lib-list-view-empty-state',
-                    template: "<div class=\"p-20\">\n  <div class=\"text-center p-2\">\n    <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"mx-auto h-12 w-12 text-gray-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n      <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4m0 5c0 2.21-3.582 4-8 4s-8-1.79-8-4\" />\n    </svg>\n    <h3 class=\"mt-2 text-sm font-medium text-gray-900\">{{title}}</h3>\n    <p class=\"mt-1 text-sm text-gray-500\">\n      {{subTitle}}\n    </p>\n    <div class=\"mt-6\" *ngIf=\"false\">\n      <button type=\"button\" class=\"inline-flex items-center px-4 py-2 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-gray-600 hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-1 focus:ring-gray-500\">\n        <!-- Heroicon name: solid/plus -->\n        <svg class=\"-ml-1 mr-2 h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" aria-hidden=\"true\">\n          <path vector-effect=\"non-scaling-stroke\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 13h6m-3-3v6m-9 1V7a2 2 0 012-2h6l2 2h6a2 2 0 012 2v8a2 2 0 01-2 2H5a2 2 0 01-2-2z\" />\n        </svg>\n        {{newItemLabel}}\n      </button>\n    </div>\n  </div>\n</div>\n"
+                    template: "<div class=\"p-20\">\r\n  <div class=\"text-center p-2\">\r\n    <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"mx-auto h-12 w-12 text-gray-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\r\n      <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4m0 5c0 2.21-3.582 4-8 4s-8-1.79-8-4\" />\r\n    </svg>\r\n    <h3 class=\"mt-2 text-sm font-medium text-gray-900\">{{title}}</h3>\r\n    <p class=\"mt-1 text-sm text-gray-500\">\r\n      {{subTitle}}\r\n    </p>\r\n    <div class=\"mt-6\" *ngIf=\"false\">\r\n      <button type=\"button\" class=\"inline-flex items-center px-4 py-2 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-gray-600 hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-1 focus:ring-gray-500\">\r\n        <!-- Heroicon name: solid/plus -->\r\n        <svg class=\"-ml-1 mr-2 h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" aria-hidden=\"true\">\r\n          <path vector-effect=\"non-scaling-stroke\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 13h6m-3-3v6m-9 1V7a2 2 0 012-2h6l2 2h6a2 2 0 012 2v8a2 2 0 01-2 2H5a2 2 0 01-2-2z\" />\r\n        </svg>\r\n        {{newItemLabel}}\r\n      </button>\r\n    </div>\r\n  </div>\r\n</div>\r\n"
                 },] }
     ];
     ListViewEmptyStateComponent.ctorParameters = function () { return []; };
@@ -1537,7 +1544,7 @@
     ToggleComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'lib-toggle',
-                    template: "<button type=\"button\"\r\n        [ngClass]=\"value ? 'enabled' : 'disabled'\"\r\n        class=\"toggle-button\"\r\n        role=\"switch\"\r\n        aria-checked=\"false\"\r\n        aria-labelledby=\"isPrivate\"\r\n        (click)=\"changeValue()\"\r\n        (blur)=\"onBlur($event)\"\r\n        value=\"{{value}}\"\r\n        [disabled]=\"disabled\"\r\n        [title]=\"disabled ? '\u03A4\u03BF \u03B1\u03C1\u03C7\u03B5\u03AF\u03BF \u03C0\u03C1\u03AD\u03C0\u03B5\u03B9 \u03BD\u03B1 \u03B5\u03AF\u03BD\u03B1\u03B9 \u03B9\u03B4\u03C9\u03C4\u03B9\u03BA\u03CC' : '\u0399\u03B4\u03B9\u03C9\u03C4\u03B9\u03BA\u03CC'\">\r\n    <span aria-hidden=\"true\"\r\n          [ngClass]=\"value ? 'enabled-anim' : 'disabled-anim'\"\r\n          class=\"toggle-span\"></span>\r\n</button>",
+                    template: "<button type=\"button\"\n        [ngClass]=\"value ? 'enabled' : 'disabled'\"\n        class=\"toggle-button\"\n        role=\"switch\"\n        aria-checked=\"false\"\n        aria-labelledby=\"isPrivate\"\n        (click)=\"changeValue()\"\n        (blur)=\"onBlur($event)\"\n        value=\"{{value}}\"\n        [disabled]=\"disabled\"\n        [title]=\"disabled ? '\u03A4\u03BF \u03B1\u03C1\u03C7\u03B5\u03AF\u03BF \u03C0\u03C1\u03AD\u03C0\u03B5\u03B9 \u03BD\u03B1 \u03B5\u03AF\u03BD\u03B1\u03B9 \u03B9\u03B4\u03C9\u03C4\u03B9\u03BA\u03CC' : '\u0399\u03B4\u03B9\u03C9\u03C4\u03B9\u03BA\u03CC'\">\n    <span aria-hidden=\"true\"\n          [ngClass]=\"value ? 'enabled-anim' : 'disabled-anim'\"\n          class=\"toggle-span\"></span>\n</button>",
                     providers: [
                         {
                             provide: forms.NG_VALUE_ACCESSOR,
@@ -2028,8 +2035,10 @@
             this.onAction = new i0.EventEmitter();
             // tslint:disable-next-line:no-output-on-prefix
             this.onSearch = new i0.EventEmitter();
+            console.log("constructor: " + this.busy);
         }
         ViewLayoutComponent.prototype.ngOnInit = function () {
+            console.log("init: " + this.busy);
         };
         ViewLayoutComponent.prototype.emitActionClick = function (action) {
             this.onAction.emit(action);
@@ -2072,7 +2081,7 @@
     ViewLayoutComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'lib-view-layout',
-                    template: "<header *ngIf=\"header\" class=\"view-layout-paddings\">\r\n\r\n  <div class=\"view-layout-title-container\">\r\n    <div class=\"view-layout-title-container-inner\">\r\n      <i *ngIf=\"icon\" [class]=\"icon + ' title-icon'\"\r\n         aria-hidden=\"true\"></i>\r\n      <h1 [class]=\"busy ? 'view-layout-title-busy' : 'view-layout-title'\">\r\n        {{title}}\r\n      </h1>\r\n    </div>\r\n    <div *ngIf=\"metaItems && metaItems.length > 0\" class=\"meta-container\">\r\n      <ng-container *ngFor=\"let meta of metaItems\">\r\n        <div class=\"meta-container-inner\">\r\n          <i *ngIf=\"meta.icon\" [class]=\"meta.icon + ' meta-icon'\" aria-hidden=\"true\"></i>\r\n          <span class=\"meta-text\">{{meta.text}}</span>\r\n        </div>\r\n      </ng-container>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"view-layout-title-container-sm\">\r\n    <div class=\"view-layout-title-container-sm-inner\">\r\n      <i *ngIf=\"icon\" [class]=\"icon + ' title-icon-sm'\"\r\n         aria-hidden=\"true\"></i>\r\n      <h1 [class]=\"busy ? 'view-layout-title-busy-sm' : 'view-layout-title-sm'\">\r\n        {{title}}\r\n      </h1>\r\n      <div *ngIf=\"metaItems && metaItems.length > 0\"\r\n           class=\"meta-container-sm\">\r\n        <ng-container *ngFor=\"let meta of metaItems\">\r\n          <div class=\"meta-container-sm-inner\">\r\n            <i *ngIf=\"meta.icon\"\r\n               [class]=\"meta.icon + ' meta-icon-sm'\"\r\n               aria-hidden=\"true\"></i>\r\n               <span class=\"meta-text\">{{meta.text}}</span>\r\n          </div>\r\n        </ng-container>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"flex items-center justify-end\">\r\n      <ng-container *ngFor=\"let action of actions\"\r\n                    [ngSwitch]=\"action.type\">\r\n        <ng-container *ngSwitchCase=\"'switch-view'\">\r\n          <button [disabled]=\"view==action.param\"\r\n                  type=\"button\"\r\n                  href=\"#\"\r\n                  class=\"ml-1 disabled:opacity-50 btn-view-header\"\r\n                  (click)=\"switchViewActionClick(action)\">\r\n            <span class=\"inline-block relative\">\r\n              <i [class]=\"action.icon\"></i>\r\n              <span *ngIf=\"view==action.param\"\r\n                    class=\"selected-view-indicator\"></span>\r\n            </span>\r\n          </button>\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'search'\">\r\n          <label for=\"search\"\r\n                 class=\"sr-only\">Search</label>\r\n          <div class=\"search-container\">\r\n            <div class=\"pointer-events-none absolute inset-y-0 left-0 pl-3 flex items-center\">\r\n              <!--<svg class=\"h-5 w-5\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n                <path fill-rule=\"evenodd\" d=\"M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z\" clip-rule=\"evenodd\" />\r\n              </svg>-->\r\n            </div>\r\n            <input id=\"search\"\r\n                   #search\r\n                   class=\"search-input\"\r\n                   [placeholder]=\"searchPlaceholder\"\r\n                   type=\"search\"\r\n                   name=\"search\"\r\n                   (input)=\"searchActionType(search.value)\">\r\n          </div>\r\n          <button type=\"button\"\r\n                  href=\"#\"\r\n                  class=\"btn-view-header rounded-l-none\"\r\n                  (click)=\"searchActionClick(action, search.value)\">\r\n            <i [class]=\"action.icon\"></i>\r\n          </button>\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'router-link'\">\r\n          <button type=\"button\"\r\n                  href=\"#\"\r\n                  class=\"ml-1 btn-view-header\"\r\n                  (click)=\"routerLinkActionClick(action)\">\r\n            <i [class]=\"action.icon\"></i>\r\n          </button>\r\n        </ng-container>\r\n\r\n        <!---->\r\n        <ng-container *ngSwitchDefault>\r\n          <button type=\"button\"\r\n                  class=\"ml-1 btn-view-header\"\r\n                  (click)=\"emitActionClick(action)\">\r\n            <i [class]=\"action.icon\"></i>\r\n          </button>\r\n        </ng-container>\r\n      </ng-container>\r\n    </div>\r\n  </div>\r\n</header>\r\n\r\n<!-- component -->\r\n<div [class]=\"fluid ? 'view-container-fluid' : 'view-container'\">\r\n  <ng-content></ng-content>\r\n</div>\r\n"
+                    template: "<header *ngIf=\"header\" class=\"view-layout-paddings\">\r\n\r\n  <div class=\"view-layout-title-container\">\r\n    <div class=\"view-layout-title-container-inner\">\r\n      <i *ngIf=\"icon\" [class]=\"icon + ' title-icon'\"\r\n         aria-hidden=\"true\"></i>\r\n      <h1 [class]=\"busy ? 'view-layout-title-busy' : 'view-layout-title'\">\r\n        {{title}}\r\n      </h1>\r\n    </div>\r\n    <div *ngIf=\"metaItems && metaItems.length > 0\" class=\"meta-container\">\r\n      <ng-container *ngFor=\"let meta of metaItems\">\r\n        <div class=\"meta-container-inner\">\r\n          <i *ngIf=\"meta.icon\" [class]=\"meta.icon + ' meta-icon'\" aria-hidden=\"true\"></i>\r\n          <span class=\"meta-text\">{{meta.text}}</span>\r\n        </div>\r\n      </ng-container>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"view-layout-title-container-sm\">\r\n    <div class=\"view-layout-title-container-sm-inner\">\r\n      <i *ngIf=\"icon\" [class]=\"icon + ' title-icon-sm'\"\r\n         aria-hidden=\"true\"></i>\r\n      <h1 [class]=\"busy !== null && busy ? 'view-layout-title-busy-sm' : 'view-layout-title-sm'\">\r\n        {{title}}\r\n      </h1>\r\n      <div *ngIf=\"metaItems && metaItems.length > 0\"\r\n           class=\"meta-container-sm\">\r\n        <ng-container *ngFor=\"let meta of metaItems\">\r\n          <div class=\"meta-container-sm-inner\">\r\n            <i *ngIf=\"meta.icon\"\r\n               [class]=\"meta.icon + ' meta-icon-sm'\"\r\n               aria-hidden=\"true\"></i>\r\n               <span class=\"meta-text\">{{meta.text}}</span>\r\n          </div>\r\n        </ng-container>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"flex items-center justify-end\">\r\n      <ng-container *ngFor=\"let action of actions\"\r\n                    [ngSwitch]=\"action.type\">\r\n        <ng-container *ngSwitchCase=\"'switch-view'\">\r\n          <button [disabled]=\"view==action.param\"\r\n                  type=\"button\"\r\n                  href=\"#\"\r\n                  class=\"ml-1 disabled:opacity-50 btn-view-header\"\r\n                  (click)=\"switchViewActionClick(action)\">\r\n            <span class=\"inline-block relative\">\r\n              <i [class]=\"action.icon\"></i>\r\n              <span *ngIf=\"view==action.param\"\r\n                    class=\"selected-view-indicator\"></span>\r\n            </span>\r\n          </button>\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'search'\">\r\n          <label for=\"search\"\r\n                 class=\"sr-only\">Search</label>\r\n          <div class=\"search-container\">\r\n            <div class=\"pointer-events-none absolute inset-y-0 left-0 pl-3 flex items-center\">\r\n              <!--<svg class=\"h-5 w-5\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n                <path fill-rule=\"evenodd\" d=\"M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z\" clip-rule=\"evenodd\" />\r\n              </svg>-->\r\n            </div>\r\n            <input id=\"search\"\r\n                   #search\r\n                   class=\"search-input\"\r\n                   [placeholder]=\"searchPlaceholder\"\r\n                   type=\"search\"\r\n                   name=\"search\"\r\n                   (input)=\"searchActionType(search.value)\">\r\n          </div>\r\n          <button type=\"button\"\r\n                  href=\"#\"\r\n                  class=\"btn-view-header rounded-l-none\"\r\n                  (click)=\"searchActionClick(action, search.value)\">\r\n            <i [class]=\"action.icon\"></i>\r\n          </button>\r\n        </ng-container>\r\n        <ng-container *ngSwitchCase=\"'router-link'\">\r\n          <button type=\"button\"\r\n                  href=\"#\"\r\n                  class=\"ml-1 btn-view-header\"\r\n                  (click)=\"routerLinkActionClick(action)\">\r\n            <i [class]=\"action.icon\"></i>\r\n          </button>\r\n        </ng-container>\r\n\r\n        <!---->\r\n        <ng-container *ngSwitchDefault>\r\n          <button type=\"button\"\r\n                  class=\"ml-1 btn-view-header\"\r\n                  (click)=\"emitActionClick(action)\">\r\n            <i [class]=\"action.icon\"></i>\r\n          </button>\r\n        </ng-container>\r\n      </ng-container>\r\n    </div>\r\n  </div>\r\n</header>\r\n\r\n<!-- component -->\r\n<div [class]=\"fluid ? 'view-container-fluid' : 'view-container'\">\r\n  <ng-content></ng-content>\r\n</div>\r\n"
                 },] }
     ];
     ViewLayoutComponent.ctorParameters = function () { return [
@@ -2565,21 +2574,15 @@
                 this.routeSub$.unsubscribe();
             }
         };
-        BaseListComponent.prototype.getViewActions = function () {
-            var actions = [
+        BaseListComponent.prototype.ngOnInit = function () {
+            var _this = this;
+            this.actions = [
                 new ViewAction('search', null, null, Icons.Search, 'αναζήτηση'),
                 new ViewAction('refresh', null, null, Icons.Refresh, 'ανανέωση στοιχείων')
             ];
             if (this.newItemLink) {
-                actions.push(new RouterViewAction(Icons.Add, this.newItemLink, 'rightpane', 'προσθήκη νέας εγγραφής;'));
+                this.actions.push(new RouterViewAction(Icons.Add, this.newItemLink, 'rightpane', 'προσθήκη νέας εγγραφής;'));
             }
-            return rxjs.of(actions);
-        };
-        BaseListComponent.prototype.ngOnInit = function () {
-            var _this = this;
-            this.getViewActions().subscribe(function (actions) {
-                _this.actions = actions || [];
-            });
             this.metaItems = [
                 { key: 'count', icon: Icons.ItemsCount, text: 'παρακαλώ περιμένετε...' }
             ];
@@ -2591,7 +2594,7 @@
                 }
                 // changing the view mode does not require reloading...
                 _this.view = params.get('view') || ListViewType.Tiles;
-                // console.log('route changes ', this.view);
+                //console.log('route changes ', this.view);
                 // if (params.get('search') !== this.search) {
                 //   this.searchChanged(params.get('search'));
                 // }
@@ -2631,14 +2634,14 @@
             });
         };
         BaseListComponent.prototype.actionHandler = function ($event) {
-            // console.log('BaseListComponent actionHandler', $event);
+            //console.log('BaseListComponent actionHandler', $event);
             if ($event.key === 'refresh') {
                 this.refresh();
             }
         };
         BaseListComponent.prototype.load = function () {
             var _this = this;
-            // console.log('BaseListComponent LOAD');
+            //console.log('BaseListComponent LOAD');
             this.count = 0;
             this.items = null;
             this.loadItems().subscribe(function (result) {