@eurosat/buttons 9.0.0-alpha.1 → 12.0.0

package/bundles/eurosat-buttons.umd.js

@@ -1,661 +1,343 @@
 (function (global, factory) {
     typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/router'), require('@angular/material/snack-bar'), require('@eurosat/snackbar'), require('@eurosat/http'), require('@eurosat/icon'), require('@angular/material/dialog'), require('@eurosat/dialog'), require('@eurosat/form'), require('rxjs/internal/operators'), require('@angular/common'), require('@angular/material/button'), require('@angular/material/menu'), require('@angular/material/tooltip'), require('@ngx-translate/core')) :
     typeof define === 'function' && define.amd ? define('@eurosat/buttons', ['exports', '@angular/core', '@angular/router', '@angular/material/snack-bar', '@eurosat/snackbar', '@eurosat/http', '@eurosat/icon', '@angular/material/dialog', '@eurosat/dialog', '@eurosat/form', 'rxjs/internal/operators', '@angular/common', '@angular/material/button', '@angular/material/menu', '@angular/material/tooltip', '@ngx-translate/core'], factory) :
-    (global = global || self, factory((global.eurosat = global.eurosat || {}, global.eurosat.buttons = {}), global.ng.core, global.ng.router, global.ng.material.snackBar, global.snackbar, global.http, global.icon, global.ng.material.dialog, global.dialog$1, global.form, global.rxjs['internal/operators'], global.ng.common, global.ng.material.button, global.ng.material.menu, global.ng.material.tooltip, global.core$1));
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.eurosat = global.eurosat || {}, global.eurosat.buttons = {}), global.ng.core, global.ng.router, global.ng.material.snackBar, global.snackbar, global.http, global.icon, global.ng.material.dialog, global.dialog$1, global.form, global.rxjs['internal/operators'], global.ng.common, global.ng.material.button, global.ng.material.menu, global.ng.material.tooltip, global.core$1));
 }(this, (function (exports, core, router, snackBar, snackbar, http, icon, dialog, dialog$1, form, operators, common, button, menu, tooltip, core$1) { 'use strict';
 
-    /**
-     * @fileoverview added by tsickle
-     * Generated from: lib/model/es-button-action.ts
-     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
-     */
-    var EsButtonAction = /** @class */ (function () {
-        function EsButtonAction() {
-        }
-        EsButtonAction.ACTION_DIALOG_CONFIRM = 'dialog-confirm';
-        EsButtonAction.ACTION_DIALOG_DELETE = 'dialog-delete';
-        EsButtonAction.ACTION_DIALOG_FORM = 'dialog-form';
-        EsButtonAction.ACTION_CARD_CONTENT_FORM = 'card-content-form';
-        EsButtonAction.ACTION_CARD_CONTENT_WIZARD = 'card-content-wizard'; // todo asi zrusit
-        // todo asi zrusit
-        EsButtonAction.ACTION_CHANGE_CARD_CONTENT = 'change-card-content'; // mozna zrusit ? je kuli neemitu clicku na button
-        // mozna zrusit ? je kuli neemitu clicku na button
-        EsButtonAction.ACTION_DOWNLOAD = 'download';
-        EsButtonAction.ACTION_REQUEST = 'request';
-        EsButtonAction.ACTION_ROUTER_NAVIGATE = 'router-navigate';
-        EsButtonAction.ACTION_WINDOW_LOCATION = 'open-link';
-        return EsButtonAction;
-    }());
-    if (false) {
-        /** @type {?} */
-        EsButtonAction.ACTION_DIALOG_CONFIRM;
-        /** @type {?} */
-        EsButtonAction.ACTION_DIALOG_DELETE;
-        /** @type {?} */
-        EsButtonAction.ACTION_DIALOG_FORM;
-        /** @type {?} */
-        EsButtonAction.ACTION_CARD_CONTENT_FORM;
-        /** @type {?} */
-        EsButtonAction.ACTION_CARD_CONTENT_WIZARD;
-        /** @type {?} */
-        EsButtonAction.ACTION_CHANGE_CARD_CONTENT;
-        /** @type {?} */
-        EsButtonAction.ACTION_DOWNLOAD;
-        /** @type {?} */
-        EsButtonAction.ACTION_REQUEST;
-        /** @type {?} */
-        EsButtonAction.ACTION_ROUTER_NAVIGATE;
-        /** @type {?} */
-        EsButtonAction.ACTION_WINDOW_LOCATION;
-    }
+    var EsButtonAction = /** @class */ (function () {
+        function EsButtonAction() {
+        }
+        return EsButtonAction;
+    }());
+    EsButtonAction.ACTION_DIALOG_CONFIRM = 'dialog-confirm';
+    EsButtonAction.ACTION_DIALOG_DELETE = 'dialog-delete';
+    EsButtonAction.ACTION_DIALOG_FORM = 'dialog-form';
+    EsButtonAction.ACTION_CARD_CONTENT_FORM = 'card-content-form';
+    EsButtonAction.ACTION_CARD_CONTENT_WIZARD = 'card-content-wizard'; // todo asi zrusit
+    EsButtonAction.ACTION_CHANGE_CARD_CONTENT = 'change-card-content'; // mozna zrusit ? je kuli neemitu clicku na button
+    EsButtonAction.ACTION_DOWNLOAD = 'download';
+    EsButtonAction.ACTION_REQUEST = 'request';
+    EsButtonAction.ACTION_ROUTER_NAVIGATE = 'router-navigate';
+    EsButtonAction.ACTION_WINDOW_LOCATION = 'open-link';
 
-    /**
-     * @fileoverview added by tsickle
-     * Generated from: lib/components/dialog-confirm/dialog-confirm.component.ts
-     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
-     */
-    var DialogConfirmComponent = /** @class */ (function () {
-        function DialogConfirmComponent(dialogRef, snackBar, ds) {
-            this.dialogRef = dialogRef;
-            this.snackBar = snackBar;
-            this.ds = ds;
-            this.submit = new core.EventEmitter();
-            this.activeRequest = false;
-            /** @type {?} */
-            var data = this.ds.getData();
-            this.message = data.message;
-            this.url = data.url;
-        }
-        /**
-         * @return {?}
-         */
-        DialogConfirmComponent.prototype.confirm = /**
-         * @return {?}
-         */
-        function () {
-            var _this = this;
-            this.activeRequest = true;
-            this.ds.httpPost(this.url, null).subscribe((/**
-             * @param {?} response
-             * @return {?}
-             */
-            function (response) {
-                _this.activeRequest = false;
-                /** @type {?} */
-                var config = new snackBar.MatSnackBarConfig();
-                config.duration = 2000;
-                if (response.type === form.EsFormResponseMessageType.TYPE_OK) {
-                    config.panelClass = snackbar.EsSnackBarPanelClass.SUCCESS;
-                    _this.submit.emit();
-                }
-                else {
-                    config.panelClass = snackbar.EsSnackBarPanelClass.DANGER;
-                }
-                _this.snackBar.open(response.message, null, config);
-                /** @type {?} */
-                var result = {
-                    clickedYes: true,
-                    serverResponse: response
-                };
-                _this.dialogRef.close(result);
-            }));
-        };
-        DialogConfirmComponent.decorators = [
-            { type: core.Component, args: [{
-                        selector: 'dialog-confirm',
-                        template: "<p>{{message}}</p>\r\n<div class=\"button-container\">\r\n    <mat-spinner *ngIf=\"activeRequest\" [diameter]=\"36\"></mat-spinner>\r\n    <ng-container *ngIf=\"!activeRequest\">\r\n        <button type=\"button\"\r\n                color=\"accent\"\r\n                mat-raised-button\r\n                (click)=\"confirm()\"> {{'an.common.ano' | translate}}\r\n        </button>\r\n        <button type=\"button\"\r\n                color=\"accent\"\r\n                mat-raised-button\r\n                (click)=\"dialogRef.close({clickedYes: false})\">{{'an.common.ne' | translate}}\r\n        </button>\r\n    </ng-container>\r\n</div>\r\n",
-                        styles: ["button:not(:last-child){margin-right:20px}.button-container{min-height:36px;min-width:196px;position:relative;text-align:center}.button-container mat-spinner{position:absolute!important;left:calc(50% - 18px);top:calc(50% - 18px)}"]
-                    }] }
-        ];
-        /** @nocollapse */
-        DialogConfirmComponent.ctorParameters = function () { return [
-            { type: dialog.MatDialogRef },
-            { type: snackBar.MatSnackBar },
-            { type: dialog$1.EsDialogService }
-        ]; };
-        DialogConfirmComponent.propDecorators = {
-            submit: [{ type: core.Output }]
-        };
-        return DialogConfirmComponent;
-    }());
-    if (false) {
-        /** @type {?} */
-        DialogConfirmComponent.prototype.submit;
-        /** @type {?} */
-        DialogConfirmComponent.prototype.message;
-        /** @type {?} */
-        DialogConfirmComponent.prototype.url;
-        /** @type {?} */
-        DialogConfirmComponent.prototype.activeRequest;
-        /** @type {?} */
-        DialogConfirmComponent.prototype.dialogRef;
-        /**
-         * @type {?}
-         * @private
-         */
-        DialogConfirmComponent.prototype.snackBar;
-        /**
-         * @type {?}
-         * @private
-         */
-        DialogConfirmComponent.prototype.ds;
-    }
+    var DialogConfirmComponent = /** @class */ (function () {
+        function DialogConfirmComponent(dialogRef, snackBar, ds) {
+            this.dialogRef = dialogRef;
+            this.snackBar = snackBar;
+            this.ds = ds;
+            this.submit = new core.EventEmitter();
+            this.activeRequest = false;
+            var data = this.ds.getData();
+            this.message = data.message;
+            this.url = data.url;
+        }
+        DialogConfirmComponent.prototype.confirm = function () {
+            var _this = this;
+            this.activeRequest = true;
+            this.ds.httpPost(this.url, null).subscribe(function (response) {
+                _this.activeRequest = false;
+                var config = new snackBar.MatSnackBarConfig();
+                config.duration = 2000;
+                if (response.type === form.EsFormResponseMessageType.TYPE_OK) {
+                    config.panelClass = snackbar.EsSnackBarPanelClass.SUCCESS;
+                    _this.submit.emit();
+                }
+                else {
+                    config.panelClass = snackbar.EsSnackBarPanelClass.DANGER;
+                }
+                _this.snackBar.open(response.message, null, config);
+                var result = {
+                    clickedYes: true,
+                    serverResponse: response
+                };
+                _this.dialogRef.close(result);
+            });
+        };
+        return DialogConfirmComponent;
+    }());
+    DialogConfirmComponent.decorators = [
+        { type: core.Component, args: [{
+                    selector: 'dialog-confirm',
+                    template: "<p>{{message}}</p>\n<div class=\"button-container\">\n    <mat-spinner *ngIf=\"activeRequest\" [diameter]=\"36\"></mat-spinner>\n    <ng-container *ngIf=\"!activeRequest\">\n        <button type=\"button\"\n                color=\"accent\"\n                mat-raised-button\n                (click)=\"confirm()\"> {{'an.common.ano' | translate}}\n        </button>\n        <button type=\"button\"\n                color=\"accent\"\n                mat-raised-button\n                (click)=\"dialogRef.close({clickedYes: false})\">{{'an.common.ne' | translate}}\n        </button>\n    </ng-container>\n</div>\n",
+                    styles: ["button:not(:last-child){margin-right:20px}.button-container{min-height:36px;min-width:196px;position:relative;text-align:center}.button-container mat-spinner{position:absolute!important;left:calc(50% - 18px);top:calc(50% - 18px)}"]
+                },] }
+    ];
+    /** @nocollapse */
+    DialogConfirmComponent.ctorParameters = function () { return [
+        { type: dialog.MatDialogRef },
+        { type: snackBar.MatSnackBar },
+        { type: dialog$1.EsDialogService }
+    ]; };
+    DialogConfirmComponent.propDecorators = {
+        submit: [{ type: core.Output }]
+    };
 
-    /**
-     * @fileoverview added by tsickle
-     * Generated from: lib/components/dialog-form/dialog-form.component.ts
-     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
-     */
-    var DialogFormComponent = /** @class */ (function () {
-        function DialogFormComponent(dialogRef, ds) {
-            this.dialogRef = dialogRef;
-            this.cols = 1;
-            this.maxFormHeight = window.innerHeight - 60;
-            /** @type {?} */
-            var data = ds.getData();
-            this.formUrl = data.url;
-        }
-        /**
-         * @param {?} value
-         * @return {?}
-         */
-        DialogFormComponent.prototype.submit = /**
-         * @param {?} value
-         * @return {?}
-         */
-        function (value) {
-            // sem se to dostane jen pri success ulozeni formu
-            /** @type {?} */
-            var result = {
-                clickedYes: true
-            };
-            this.dialogRef.close(result);
-            // pokud bysme chteli form.value
-            // this.dialogRef.close(value);
-            // console.log('form value v parent', value);
-        };
-        /**
-         * @return {?}
-         */
-        DialogFormComponent.prototype.getWindowHeight = /**
-         * @return {?}
-         */
-        function () {
-            this.maxFormHeight = window.innerHeight - 60;
-        };
-        DialogFormComponent.decorators = [
-            { type: core.Component, args: [{
-                        selector: 'dialog-form',
-                        template: "<div class=\"es-form-container\" [style.max-height]=\"(maxFormHeight - 106) + 'px'\">\r\n    <es-form [formUrl]=\"formUrl\"\r\n             [dynamicForm]=\"esForm\"\r\n             [cols]=\"cols\"\r\n             (submit)=\"submit($event)\">\r\n    </es-form>\r\n</div>\r\n",
-                        styles: [".es-form-container{overflow:auto;margin-top:24px;position:relative}"]
-                    }] }
-        ];
-        /** @nocollapse */
-        DialogFormComponent.ctorParameters = function () { return [
-            { type: dialog.MatDialogRef },
-            { type: dialog$1.EsDialogService }
-        ]; };
-        return DialogFormComponent;
-    }());
-    if (false) {
-        /** @type {?} */
-        DialogFormComponent.prototype.formUrl;
-        /** @type {?} */
-        DialogFormComponent.prototype.cols;
-        /** @type {?} */
-        DialogFormComponent.prototype.esForm;
-        /** @type {?} */
-        DialogFormComponent.prototype.maxFormHeight;
-        /** @type {?} */
-        DialogFormComponent.prototype.dialogRef;
-    }
+    var DialogFormComponent = /** @class */ (function () {
+        function DialogFormComponent(dialogRef, ds) {
+            this.dialogRef = dialogRef;
+            this.cols = 1;
+            this.maxFormHeight = window.innerHeight - 60;
+            var data = ds.getData();
+            this.formUrl = data.url;
+        }
+        DialogFormComponent.prototype.submit = function (value) {
+            // sem se to dostane jen pri success ulozeni formu
+            var result = {
+                clickedYes: true
+            };
+            this.dialogRef.close(result);
+            // pokud bysme chteli form.value
+            // this.dialogRef.close(value);
+            // console.log('form value v parent', value);
+        };
+        DialogFormComponent.prototype.getWindowHeight = function () {
+            this.maxFormHeight = window.innerHeight - 60;
+        };
+        return DialogFormComponent;
+    }());
+    DialogFormComponent.decorators = [
+        { type: core.Component, args: [{
+                    selector: 'dialog-form',
+                    template: "<div class=\"es-form-container\" [style.max-height]=\"(maxFormHeight - 106) + 'px'\">\n    <es-form [formUrl]=\"formUrl\"\n             [dynamicForm]=\"esForm\"\n             [cols]=\"cols\"\n             (submit)=\"submit($event)\">\n    </es-form>\n</div>\n",
+                    styles: [".es-form-container{overflow:auto;margin-top:24px;position:relative}"]
+                },] }
+    ];
+    /** @nocollapse */
+    DialogFormComponent.ctorParameters = function () { return [
+        { type: dialog.MatDialogRef },
+        { type: dialog$1.EsDialogService }
+    ]; };
 
-    /**
-     * @fileoverview added by tsickle
-     * Generated from: lib/es-buttons.component.ts
-     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
-     */
-    // todo translates
-    var EsButtonsComponent = /** @class */ (function () {
-        function EsButtonsComponent(router, dialog, snackBar, http) {
-            this.router = router;
-            this.dialog = dialog;
-            this.snackBar = snackBar;
-            this.http = http;
-            this.parentWidth = 40; // default 40 = 1 button
-            // default 40 = 1 button
-            this.buttons = []; // normal input
-            // normal input
-            this.forceMenu = false; // pokud chci zobrazit ... menu i pro jeden buttonek, na realtimu pouzito
-            // pokud chci zobrazit ... menu i pro jeden buttonek, na realtimu pouzito
-            this.buttonClick = new core.EventEmitter();
-            this.reload = new core.EventEmitter();
-            this.dialogCreated = new core.EventEmitter();
-            this.serverResponse = new core.EventEmitter();
-            this.menuVisible = false;
-            this.buttonWidth = 40; // todo ViewChild, sirka buttonu ?
-            // todo ViewChild, sirka buttonu ?
-            this.visibleButtons = [];
-            this.hiddenButtons = [];
-            this.esIcon = icon.EsIcon;
-            this._width = 0;
-        }
-        /**
-         * @return {?}
-         */
-        EsButtonsComponent.prototype.showMenu = /**
-         * @return {?}
-         */
-        function () {
-            return this.getHiddenButtons() && this.getHiddenButtons().length > 0 && this.getHiddenButtons().length !== 1;
-        };
-        /**
-         * @return {?}
-         */
-        EsButtonsComponent.prototype.countVisible = /**
-         * @return {?}
-         */
-        function () {
-            return Math.floor((this._width) / this.buttonWidth) - 1;
-        };
-        /**
-         * @return {?}
-         */
-        EsButtonsComponent.prototype.getVisibleButtons = /**
-         * @return {?}
-         */
-        function () {
-            var _this = this;
-            if (this.buttons && this.buttons.length > 0) {
-                return this.buttons.filter((/**
-                 * @param {?} button
-                 * @return {?}
-                 */
-                function (button) {
-                    if (_this.buttons.indexOf(button) < _this.countVisible()
-                        || (_this.getHiddenButtons().length === 1 && !_this.forceMenu)) {
-                        return true;
-                    }
-                }));
-            }
-        };
-        /**
-         * @return {?}
-         */
-        EsButtonsComponent.prototype.getHiddenButtons = /**
-         * @return {?}
-         */
-        function () {
-            var _this = this;
-            if (this.buttons && this.buttons.length > 0) {
-                return this.buttons.filter((/**
-                 * @param {?} button
-                 * @return {?}
-                 */
-                function (button) {
-                    if (_this.buttons.indexOf(button) >= _this.countVisible()) {
-                        return true;
-                    }
-                }));
-            }
-        };
-        /**
-         * @param {?} simpleChange
-         * @return {?}
-         */
-        EsButtonsComponent.prototype.ngOnChanges = /**
-         * @param {?} simpleChange
-         * @return {?}
-         */
-        function (simpleChange) {
-            if (simpleChange['parentWidth']) {
-                if (this.parentWidth > 0) {
-                    this._width = this.parentWidth;
-                    this.recalculateButtons();
-                }
-            }
-            if (simpleChange['buttons']) {
-                if (typeof this.buttons === 'string') {
-                    this.buttons = JSON.parse(this.buttons);
-                }
-                this.recalculateButtons();
-            }
-        };
-        /**
-         * @return {?}
-         */
-        EsButtonsComponent.prototype.recalculateButtons = /**
-         * @return {?}
-         */
-        function () {
-            this.menuVisible = this.showMenu();
-            this.visibleButtons = this.getVisibleButtons();
-            this.hiddenButtons = this.getHiddenButtons();
-        };
-        /**
-         * @param {?} button
-         * @return {?}
-         */
-        EsButtonsComponent.prototype.handleAction = /**
-         * @param {?} button
-         * @return {?}
-         */
-        function (button) {
-            var _this = this;
-            if (button.action === EsButtonAction.ACTION_DIALOG_CONFIRM) {
-                this.openConfirm(button);
-            }
-            if (button.action === EsButtonAction.ACTION_DIALOG_DELETE) {
-                this.openDelete(button);
-            }
-            if (button.action === EsButtonAction.ACTION_DIALOG_FORM) {
-                this.openForm(button);
-            }
-            if (button.action === EsButtonAction.ACTION_DOWNLOAD) {
-                this.http.get(button.url, { responseType: 'blob', observe: 'response' }).subscribe((/**
-                 * @param {?} response
-                 * @return {?}
-                 */
-                function (response) {
-                    /** @type {?} */
-                    var filename = response.headers.get('Content-Disposition').split('filename=')[1];
-                    if (window.navigator && window.navigator.msSaveOrOpenBlob) {
-                        window.navigator.msSaveBlob(response.body, filename);
-                    }
-                    else {
-                        /** @type {?} */
-                        var link = document.createElement('a');
-                        link.setAttribute('href', window.URL.createObjectURL(response.body));
-                        link.setAttribute('download', filename);
-                        link.style.visibility = 'hidden';
-                        document.body.appendChild(link);
-                        link.click();
-                        document.body.removeChild(link);
-                    }
-                }));
-            }
-            if (button.action === EsButtonAction.ACTION_REQUEST) {
-                this.http.get(button.url).subscribe((/**
-                 * @param {?} response
-                 * @return {?}
-                 */
-                function (response) {
-                    /** @type {?} */
-                    var config = new snackBar.MatSnackBarConfig();
-                    config.duration = 2000;
-                    if (response.type === form.EsFormResponseMessageType.TYPE_OK) {
-                        config.panelClass = snackbar.EsSnackBarPanelClass.SUCCESS;
-                    }
-                    else {
-                        config.panelClass = snackbar.EsSnackBarPanelClass.DANGER;
-                    }
-                    _this.snackBar.open(response.message, null, config);
-                    _this.reload.emit(true);
-                    _this.serverResponse.emit({ button: button, response: response });
-                }));
-            }
-            if (button.action === EsButtonAction.ACTION_ROUTER_NAVIGATE) {
-                this.router.navigateByUrl(button.url);
-            }
-            if (button.action === EsButtonAction.ACTION_WINDOW_LOCATION) {
-                window.location.href = button.url;
-            }
-            this.buttonClick.emit(button);
-        };
-        // handleSubMenuAction(button: EsButton) {
-        //     // todo asi predelat na md2 menu
-        //     // todo nevim jestli se zpropaguje click kdyz je to zanoreny pres es-card-header
-        //     this.buttonClick.emit(button);
-        // }
-        // handleSubMenuAction(button: EsButton) {
-        //     // todo asi predelat na md2 menu
-        //     // todo nevim jestli se zpropaguje click kdyz je to zanoreny pres es-card-header
-        //     this.buttonClick.emit(button);
-        // }
-        /**
-         * @param {?} button
-         * @return {?}
-         */
-        EsButtonsComponent.prototype.openForm = 
-        // handleSubMenuAction(button: EsButton) {
-        //     // todo asi predelat na md2 menu
-        //     // todo nevim jestli se zpropaguje click kdyz je to zanoreny pres es-card-header
-        //     this.buttonClick.emit(button);
-        // }
-        /**
-         * @param {?} button
-         * @return {?}
-         */
-        function (button) {
-            var _this = this;
-            /** @type {?} */
-            var config = {
-                title: button.title,
-                data: {
-                    url: button.url
-                }
-            };
-            /** @type {?} */
-            var dialogRef = this.dialog.open(DialogFormComponent, config);
-            this.dialogCreated.emit(dialogRef);
-            dialogRef.afterClosed().pipe(operators.take(1)).subscribe((/**
-             * @param {?} res
-             * @return {?}
-             */
-            function (res) {
-                if (res && res.clickedYes) {
-                    _this.reload.emit(true);
-                    if (res.serverResponse) {
-                        _this.serverResponse.emit({ button: button, response: res.serverResponse });
-                    }
-                }
-            }));
-        };
-        /**
-         * @param {?} button
-         * @return {?}
-         */
-        EsButtonsComponent.prototype.openDelete = /**
-         * @param {?} button
-         * @return {?}
-         */
-        function (button) {
-            this.openConfirm(button);
-        };
-        /**
-         * @param {?} button
-         * @return {?}
-         */
-        EsButtonsComponent.prototype.openConfirm = /**
-         * @param {?} button
-         * @return {?}
-         */
-        function (button) {
-            var _this = this;
-            /** @type {?} */
-            var config = {
-                title: button.title,
-                data: {
-                    message: button.message,
-                    url: button.url
-                }
-            };
-            /** @type {?} */
-            var dialogRef = this.dialog.open(DialogConfirmComponent, config);
-            this.dialogCreated.emit(dialogRef);
-            dialogRef.afterClosed().pipe(operators.take(1)).subscribe((/**
-             * @param {?} res
-             * @return {?}
-             */
-            function (res) {
-                if (res && res.clickedYes) {
-                    _this.reload.emit(true);
-                    if (res.serverResponse) {
-                        _this.serverResponse.emit({ button: button, response: res.serverResponse });
-                    }
-                }
-            }));
-        };
-        EsButtonsComponent.decorators = [
-            { type: core.Component, args: [{
-                        selector: 'es-buttons',
-                        template: "<ng-container *ngIf=\"visibleButtons && visibleButtons.length > 0\">\r\n    <button *ngIf=\"visibleButtons.length > 0\"\r\n            mat-icon-button\r\n            [disabled]=\"visibleButtons[0].disabled === true\"\r\n            [matTooltip]=\"visibleButtons[0].tooltip? visibleButtons[0].tooltip : visibleButtons[0].title\"\r\n            (click)=\"handleAction(visibleButtons[0])\">\r\n        <es-icon [color]=\"visibleButtons[0].color\"\r\n                 [themeColor]=\"visibleButtons[0].themeColor\"\r\n                 [icon]=\"visibleButtons[0].icon\"></es-icon>\r\n    </button>\r\n    <button *ngIf=\"visibleButtons.length > 1\"\r\n            mat-icon-button\r\n            [disabled]=\"visibleButtons[1].disabled === true\"\r\n            [matTooltip]=\"visibleButtons[1].tooltip? visibleButtons[1].tooltip : visibleButtons[1].title\"\r\n            (click)=\"handleAction(visibleButtons[1])\">\r\n        <es-icon [color]=\"visibleButtons[1].color\"\r\n                 [themeColor]=\"visibleButtons[1].themeColor\"\r\n                 [icon]=\"visibleButtons[1].icon\"></es-icon>\r\n    </button>\r\n    <button *ngIf=\"visibleButtons.length > 2\"\r\n            mat-icon-button\r\n            [disabled]=\"visibleButtons[2].disabled === true\"\r\n            [matTooltip]=\"visibleButtons[2].tooltip? visibleButtons[2].tooltip : visibleButtons[2].title\"\r\n            (click)=\"handleAction(visibleButtons[2])\">\r\n        <es-icon [color]=\"visibleButtons[2].color\"\r\n                 [themeColor]=\"visibleButtons[2].themeColor\"\r\n                 [icon]=\"visibleButtons[2].icon\"></es-icon>\r\n    </button>\r\n    <button *ngIf=\"visibleButtons.length > 3\"\r\n            mat-icon-button\r\n            [disabled]=\"visibleButtons[3].disabled === true\"\r\n            [matTooltip]=\"visibleButtons[3].tooltip? visibleButtons[3].tooltip : visibleButtons[3].title\"\r\n            (click)=\"handleAction(visibleButtons[3])\">\r\n        <es-icon [color]=\"visibleButtons[3].color\"\r\n                 [themeColor]=\"visibleButtons[3].themeColor\"\r\n                 [icon]=\"visibleButtons[3].icon\"></es-icon>\r\n    </button>\r\n    <button *ngIf=\"visibleButtons.length > 4\"\r\n            mat-icon-button\r\n            [disabled]=\"visibleButtons[4].disabled === true\"\r\n            [matTooltip]=\"visibleButtons[4].tooltip? visibleButtons[4].tooltip : visibleButtons[4].title\"\r\n            (click)=\"handleAction(visibleButtons[4])\">\r\n        <es-icon [color]=\"visibleButtons[4].color\"\r\n                 [themeColor]=\"visibleButtons[4].themeColor\"\r\n                 [icon]=\"visibleButtons[4].icon\"></es-icon>\r\n    </button>\r\n    <button *ngIf=\"visibleButtons.length > 5\"\r\n            mat-icon-button\r\n            [disabled]=\"visibleButtons[5].disabled === true\"\r\n            [matTooltip]=\"visibleButtons[5].tooltip? visibleButtons[5].tooltip : visibleButtons[5].title\"\r\n            (click)=\"handleAction(visibleButtons[5])\">\r\n        <es-icon [color]=\"visibleButtons[5].color\"\r\n                 [themeColor]=\"visibleButtons[5].themeColor\"\r\n                 [icon]=\"visibleButtons[5].icon\"></es-icon>\r\n    </button>\r\n    <button *ngIf=\"visibleButtons.length > 6\"\r\n            mat-icon-button\r\n            [disabled]=\"visibleButtons[6].disabled === true\"\r\n            [matTooltip]=\"visibleButtons[6].tooltip? visibleButtons[6].tooltip : visibleButtons[6].title\"\r\n            (click)=\"handleAction(visibleButtons[6])\">\r\n        <es-icon [color]=\"visibleButtons[6].color\"\r\n                 [themeColor]=\"visibleButtons[6].themeColor\"\r\n                 [icon]=\"visibleButtons[6].icon\"></es-icon>\r\n    </button>\r\n    <button *ngIf=\"visibleButtons.length > 7\"\r\n            mat-icon-button\r\n            [disabled]=\"visibleButtons[7].disabled === true\"\r\n            [matTooltip]=\"visibleButtons[7].tooltip? visibleButtons[7].tooltip : visibleButtons[7].title\"\r\n            (click)=\"handleAction(visibleButtons[7])\">\r\n        <es-icon [color]=\"visibleButtons[7].color\"\r\n                 [themeColor]=\"visibleButtons[7].themeColor\"\r\n                 [icon]=\"visibleButtons[7].icon\"></es-icon>\r\n    </button>\r\n    <button *ngIf=\"visibleButtons.length > 8\"\r\n            mat-icon-button\r\n            [disabled]=\"visibleButtons[8].disabled === true\"\r\n            [matTooltip]=\"visibleButtons[8].tooltip? visibleButtons[8].tooltip : visibleButtons[8].title\"\r\n            (click)=\"handleAction(visibleButtons[8])\">\r\n        <es-icon [color]=\"visibleButtons[8].color\"\r\n                 [themeColor]=\"visibleButtons[8].themeColor\"\r\n                 [icon]=\"visibleButtons[8].icon\"></es-icon>\r\n    </button>\r\n    <button *ngIf=\"visibleButtons.length > 9\"\r\n            mat-icon-button\r\n            [disabled]=\"visibleButtons[9].disabled === true\"\r\n            [matTooltip]=\"visibleButtons[9].tooltip? visibleButtons[9].tooltip : visibleButtons[9].title\"\r\n            (click)=\"handleAction(visibleButtons[9])\">\r\n        <es-icon [color]=\"visibleButtons[9].color\"\r\n                 [themeColor]=\"visibleButtons[9].themeColor\"\r\n                 [icon]=\"visibleButtons[9].icon\"></es-icon>\r\n    </button>\r\n</ng-container>\r\n\r\n\r\n<button *ngIf=\"menuVisible || forceMenu\"\r\n        mat-icon-button\r\n        [matMenuTriggerFor]=\"menu\"\r\n        [matTooltip]=\"'an.more' | translate\">\r\n    <es-icon [icon]=\"esIcon.MORE_VERT\"></es-icon>\r\n</button>\r\n\r\n\r\n<mat-menu #menu=\"matMenu\"\r\n          [overlapTrigger]=\"false\"\r\n          yPosition=\"below\"\r\n          xPosition=\"before\">\r\n    <ng-container *ngIf=\"hiddenButtons && hiddenButtons.length > 0\">\r\n        <button *ngIf=\"hiddenButtons.length > 0\"\r\n                mat-menu-item\r\n                [disabled]=\"hiddenButtons[0].disabled === true\"\r\n                (click)=\"handleAction(hiddenButtons[0])\">\r\n            <es-icon [color]=\"hiddenButtons[0].color\"\r\n                     [themeColor]=\"hiddenButtons[0].themeColor\"\r\n                     [icon]=\"hiddenButtons[0].icon\"></es-icon>\r\n            <span>{{hiddenButtons[0].title}}</span>\r\n        </button>\r\n        <button *ngIf=\"hiddenButtons.length > 1\"\r\n                mat-menu-item\r\n                [disabled]=\"hiddenButtons[1].disabled === true\"\r\n                (click)=\"handleAction(hiddenButtons[1])\">\r\n            <es-icon [color]=\"hiddenButtons[1].color\"\r\n                     [themeColor]=\"hiddenButtons[1].themeColor\"\r\n                     [icon]=\"hiddenButtons[1].icon\"></es-icon>\r\n            <span>{{hiddenButtons[1].title}}</span>\r\n        </button>\r\n        <button *ngIf=\"hiddenButtons.length > 2\"\r\n                mat-menu-item\r\n                [disabled]=\"hiddenButtons[2].disabled === true\"\r\n                (click)=\"handleAction(hiddenButtons[2])\">\r\n            <es-icon [color]=\"hiddenButtons[2].color\"\r\n                     [themeColor]=\"hiddenButtons[2].themeColor\"\r\n                     [icon]=\"hiddenButtons[2].icon\"></es-icon>\r\n            <span>{{hiddenButtons[2].title}}</span>\r\n        </button>\r\n        <button *ngIf=\"hiddenButtons.length > 3\"\r\n                mat-menu-item\r\n                [disabled]=\"hiddenButtons[3].disabled === true\"\r\n                (click)=\"handleAction(hiddenButtons[3])\">\r\n            <es-icon [color]=\"hiddenButtons[3].color\"\r\n                     [themeColor]=\"hiddenButtons[3].themeColor\"\r\n                     [icon]=\"hiddenButtons[3].icon\"></es-icon>\r\n            <span>{{hiddenButtons[3].title}}</span>\r\n        </button>\r\n        <button *ngIf=\"hiddenButtons.length > 4\"\r\n                mat-menu-item\r\n                [disabled]=\"hiddenButtons[4].disabled === true\"\r\n                (click)=\"handleAction(hiddenButtons[4])\">\r\n            <es-icon [color]=\"hiddenButtons[4].color\"\r\n                     [themeColor]=\"hiddenButtons[4].themeColor\"\r\n                     [icon]=\"hiddenButtons[4].icon\"></es-icon>\r\n            <span>{{hiddenButtons[4].title}}</span>\r\n        </button>\r\n        <button *ngIf=\"hiddenButtons.length > 5\"\r\n                mat-menu-item\r\n                [disabled]=\"hiddenButtons[5].disabled === true\"\r\n                (click)=\"handleAction(hiddenButtons[5])\">\r\n            <es-icon [color]=\"hiddenButtons[5].color\"\r\n                     [themeColor]=\"hiddenButtons[5].themeColor\"\r\n                     [icon]=\"hiddenButtons[5].icon\"></es-icon>\r\n            <span>{{hiddenButtons[5].title}}</span>\r\n        </button>\r\n        <button *ngIf=\"hiddenButtons.length > 6\"\r\n                mat-menu-item\r\n                [disabled]=\"hiddenButtons[6].disabled === true\"\r\n                (click)=\"handleAction(hiddenButtons[6])\">\r\n            <es-icon [color]=\"hiddenButtons[6].color\"\r\n                     [themeColor]=\"hiddenButtons[6].themeColor\"\r\n                     [icon]=\"hiddenButtons[6].icon\"></es-icon>\r\n            <span>{{hiddenButtons[6].title}}</span>\r\n        </button>\r\n        <button *ngIf=\"hiddenButtons.length > 7\"\r\n                mat-menu-item\r\n                [disabled]=\"hiddenButtons[7].disabled === true\"\r\n                (click)=\"handleAction(hiddenButtons[7])\">\r\n            <es-icon [color]=\"hiddenButtons[7].color\"\r\n                     [themeColor]=\"hiddenButtons[7].themeColor\"\r\n                     [icon]=\"hiddenButtons[7].icon\"></es-icon>\r\n            <span>{{hiddenButtons[7].title}}</span>\r\n        </button>\r\n        <button *ngIf=\"hiddenButtons.length > 8\"\r\n                mat-menu-item\r\n                [disabled]=\"hiddenButtons[8].disabled === true\"\r\n                (click)=\"handleAction(hiddenButtons[8])\">\r\n            <es-icon [color]=\"hiddenButtons[8].color\"\r\n                     [themeColor]=\"hiddenButtons[8].themeColor\"\r\n                     [icon]=\"hiddenButtons[8].icon\"></es-icon>\r\n            <span>{{hiddenButtons[8].title}}</span>\r\n        </button>\r\n        <button *ngIf=\"hiddenButtons.length > 9\"\r\n                mat-menu-item\r\n                [disabled]=\"hiddenButtons[9].disabled === true\"\r\n                (click)=\"handleAction(hiddenButtons[9])\">\r\n            <es-icon [color]=\"hiddenButtons[9].color\"\r\n                     [themeColor]=\"hiddenButtons[9].themeColor\"\r\n                     [icon]=\"hiddenButtons[9].icon\"></es-icon>\r\n            <span>{{hiddenButtons[9].title}}</span>\r\n        </button>\r\n    </ng-container>\r\n</mat-menu>\r\n",
-                        changeDetection: core.ChangeDetectionStrategy.OnPush,
-                        styles: [":host{float:right}"]
-                    }] }
-        ];
-        /** @nocollapse */
-        EsButtonsComponent.ctorParameters = function () { return [
-            { type: router.Router },
-            { type: dialog$1.EsDialogService },
-            { type: snackBar.MatSnackBar },
-            { type: http.HttpService }
-        ]; };
-        EsButtonsComponent.propDecorators = {
-            parentWidth: [{ type: core.Input }],
-            buttons: [{ type: core.Input }],
-            forceMenu: [{ type: core.Input }],
-            buttonClick: [{ type: core.Output }],
-            reload: [{ type: core.Output }],
-            dialogCreated: [{ type: core.Output }],
-            serverResponse: [{ type: core.Output }]
-        };
-        return EsButtonsComponent;
-    }());
-    if (false) {
-        /** @type {?} */
-        EsButtonsComponent.prototype.parentWidth;
-        /** @type {?} */
-        EsButtonsComponent.prototype.buttons;
-        /** @type {?} */
-        EsButtonsComponent.prototype.forceMenu;
-        /** @type {?} */
-        EsButtonsComponent.prototype.buttonClick;
-        /** @type {?} */
-        EsButtonsComponent.prototype.reload;
-        /** @type {?} */
-        EsButtonsComponent.prototype.dialogCreated;
-        /** @type {?} */
-        EsButtonsComponent.prototype.serverResponse;
-        /** @type {?} */
-        EsButtonsComponent.prototype.menuVisible;
-        /** @type {?} */
-        EsButtonsComponent.prototype.buttonWidth;
-        /** @type {?} */
-        EsButtonsComponent.prototype.visibleButtons;
-        /** @type {?} */
-        EsButtonsComponent.prototype.hiddenButtons;
-        /** @type {?} */
-        EsButtonsComponent.prototype.esIcon;
-        /** @type {?} */
-        EsButtonsComponent.prototype._width;
-        /**
-         * @type {?}
-         * @private
-         */
-        EsButtonsComponent.prototype.router;
-        /**
-         * @type {?}
-         * @private
-         */
-        EsButtonsComponent.prototype.dialog;
-        /**
-         * @type {?}
-         * @private
-         */
-        EsButtonsComponent.prototype.snackBar;
-        /**
-         * @type {?}
-         * @private
-         */
-        EsButtonsComponent.prototype.http;
-    }
+    // todo translates
+    var EsButtonsComponent = /** @class */ (function () {
+        function EsButtonsComponent(router, dialog, snackBar, http) {
+            this.router = router;
+            this.dialog = dialog;
+            this.snackBar = snackBar;
+            this.http = http;
+            this.parentWidth = 40; // default 40 = 1 button
+            this.buttons = []; // normal input
+            this.forceMenu = false; // pokud chci zobrazit ... menu i pro jeden buttonek, na realtimu pouzito
+            this.buttonClick = new core.EventEmitter();
+            this.reload = new core.EventEmitter();
+            this.dialogCreated = new core.EventEmitter();
+            this.serverResponse = new core.EventEmitter();
+            this.menuVisible = false;
+            this.buttonWidth = 40; // todo ViewChild, sirka buttonu ?
+            this.visibleButtons = [];
+            this.hiddenButtons = [];
+            this.esIcon = icon.EsIcon;
+            this._width = 0;
+        }
+        EsButtonsComponent.prototype.showMenu = function () {
+            return this.getHiddenButtons() && this.getHiddenButtons().length > 0 && this.getHiddenButtons().length !== 1;
+        };
+        EsButtonsComponent.prototype.countVisible = function () {
+            return Math.floor((this._width) / this.buttonWidth) - 1;
+        };
+        EsButtonsComponent.prototype.getVisibleButtons = function () {
+            var _this = this;
+            if (this.buttons && this.buttons.length > 0) {
+                return this.buttons.filter(function (button) {
+                    if (_this.buttons.indexOf(button) < _this.countVisible()
+                        || (_this.getHiddenButtons().length === 1 && !_this.forceMenu)) {
+                        return true;
+                    }
+                });
+            }
+        };
+        EsButtonsComponent.prototype.getHiddenButtons = function () {
+            var _this = this;
+            if (this.buttons && this.buttons.length > 0) {
+                return this.buttons.filter(function (button) {
+                    if (_this.buttons.indexOf(button) >= _this.countVisible()) {
+                        return true;
+                    }
+                });
+            }
+        };
+        EsButtonsComponent.prototype.ngOnChanges = function (simpleChange) {
+            if (simpleChange['parentWidth']) {
+                if (this.parentWidth > 0) {
+                    this._width = this.parentWidth;
+                    this.recalculateButtons();
+                }
+            }
+            if (simpleChange['buttons']) {
+                if (typeof this.buttons === 'string') {
+                    this.buttons = JSON.parse(this.buttons);
+                }
+                this.recalculateButtons();
+            }
+        };
+        EsButtonsComponent.prototype.recalculateButtons = function () {
+            this.menuVisible = this.showMenu();
+            this.visibleButtons = this.getVisibleButtons();
+            this.hiddenButtons = this.getHiddenButtons();
+        };
+        EsButtonsComponent.prototype.handleAction = function (button) {
+            var _this = this;
+            if (button.action === EsButtonAction.ACTION_DIALOG_CONFIRM) {
+                this.openConfirm(button);
+            }
+            if (button.action === EsButtonAction.ACTION_DIALOG_DELETE) {
+                this.openDelete(button);
+            }
+            if (button.action === EsButtonAction.ACTION_DIALOG_FORM) {
+                this.openForm(button);
+            }
+            if (button.action === EsButtonAction.ACTION_DOWNLOAD) {
+                this.http.get(button.url, { responseType: 'blob', observe: 'response' }).subscribe(function (response) {
+                    var filename = response.headers.get('Content-Disposition').split('filename=')[1];
+                    if (window.navigator && window.navigator.msSaveOrOpenBlob) {
+                        window.navigator.msSaveBlob(response.body, filename);
+                    }
+                    else {
+                        var link = document.createElement('a');
+                        link.setAttribute('href', window.URL.createObjectURL(response.body));
+                        link.setAttribute('download', filename);
+                        link.style.visibility = 'hidden';
+                        document.body.appendChild(link);
+                        link.click();
+                        document.body.removeChild(link);
+                    }
+                });
+            }
+            if (button.action === EsButtonAction.ACTION_REQUEST) {
+                this.http.get(button.url).subscribe(function (response) {
+                    var config = new snackBar.MatSnackBarConfig();
+                    config.duration = 2000;
+                    if (response.type === form.EsFormResponseMessageType.TYPE_OK) {
+                        config.panelClass = snackbar.EsSnackBarPanelClass.SUCCESS;
+                    }
+                    else {
+                        config.panelClass = snackbar.EsSnackBarPanelClass.DANGER;
+                    }
+                    _this.snackBar.open(response.message, null, config);
+                    _this.reload.emit(true);
+                    _this.serverResponse.emit({ button: button, response: response });
+                });
+            }
+            if (button.action === EsButtonAction.ACTION_ROUTER_NAVIGATE) {
+                this.router.navigateByUrl(button.url);
+            }
+            if (button.action === EsButtonAction.ACTION_WINDOW_LOCATION) {
+                window.location.href = button.url;
+            }
+            this.buttonClick.emit(button);
+        };
+        // handleSubMenuAction(button: EsButton) {
+        //     // todo asi predelat na md2 menu
+        //     // todo nevim jestli se zpropaguje click kdyz je to zanoreny pres es-card-header
+        //     this.buttonClick.emit(button);
+        // }
+        EsButtonsComponent.prototype.openForm = function (button) {
+            var _this = this;
+            var config = {
+                title: button.title,
+                data: {
+                    url: button.url
+                }
+            };
+            var dialogRef = this.dialog.open(DialogFormComponent, config);
+            this.dialogCreated.emit(dialogRef);
+            dialogRef.afterClosed().pipe(operators.take(1)).subscribe(function (res) {
+                if (res && res.clickedYes) {
+                    _this.reload.emit(true);
+                    if (res.serverResponse) {
+                        _this.serverResponse.emit({ button: button, response: res.serverResponse });
+                    }
+                }
+            });
+        };
+        EsButtonsComponent.prototype.openDelete = function (button) {
+            this.openConfirm(button);
+        };
+        EsButtonsComponent.prototype.openConfirm = function (button) {
+            var _this = this;
+            var config = {
+                title: button.title,
+                data: {
+                    message: button.message,
+                    url: button.url
+                }
+            };
+            var dialogRef = this.dialog.open(DialogConfirmComponent, config);
+            this.dialogCreated.emit(dialogRef);
+            dialogRef.afterClosed().pipe(operators.take(1)).subscribe(function (res) {
+                if (res && res.clickedYes) {
+                    _this.reload.emit(true);
+                    if (res.serverResponse) {
+                        _this.serverResponse.emit({ button: button, response: res.serverResponse });
+                    }
+                }
+            });
+        };
+        return EsButtonsComponent;
+    }());
+    EsButtonsComponent.decorators = [
+        { type: core.Component, args: [{
+                    selector: 'es-buttons',
+                    template: "<ng-container *ngIf=\"visibleButtons && visibleButtons.length > 0\">\n    <button *ngIf=\"visibleButtons.length > 0\"\n            mat-icon-button\n            [disabled]=\"visibleButtons[0].disabled === true\"\n            [matTooltip]=\"visibleButtons[0].tooltip? visibleButtons[0].tooltip : visibleButtons[0].title\"\n            (click)=\"handleAction(visibleButtons[0])\">\n        <es-icon [color]=\"visibleButtons[0].color\"\n                 [themeColor]=\"visibleButtons[0].themeColor\"\n                 [icon]=\"visibleButtons[0].icon\"></es-icon>\n    </button>\n    <button *ngIf=\"visibleButtons.length > 1\"\n            mat-icon-button\n            [disabled]=\"visibleButtons[1].disabled === true\"\n            [matTooltip]=\"visibleButtons[1].tooltip? visibleButtons[1].tooltip : visibleButtons[1].title\"\n            (click)=\"handleAction(visibleButtons[1])\">\n        <es-icon [color]=\"visibleButtons[1].color\"\n                 [themeColor]=\"visibleButtons[1].themeColor\"\n                 [icon]=\"visibleButtons[1].icon\"></es-icon>\n    </button>\n    <button *ngIf=\"visibleButtons.length > 2\"\n            mat-icon-button\n            [disabled]=\"visibleButtons[2].disabled === true\"\n            [matTooltip]=\"visibleButtons[2].tooltip? visibleButtons[2].tooltip : visibleButtons[2].title\"\n            (click)=\"handleAction(visibleButtons[2])\">\n        <es-icon [color]=\"visibleButtons[2].color\"\n                 [themeColor]=\"visibleButtons[2].themeColor\"\n                 [icon]=\"visibleButtons[2].icon\"></es-icon>\n    </button>\n    <button *ngIf=\"visibleButtons.length > 3\"\n            mat-icon-button\n            [disabled]=\"visibleButtons[3].disabled === true\"\n            [matTooltip]=\"visibleButtons[3].tooltip? visibleButtons[3].tooltip : visibleButtons[3].title\"\n            (click)=\"handleAction(visibleButtons[3])\">\n        <es-icon [color]=\"visibleButtons[3].color\"\n                 [themeColor]=\"visibleButtons[3].themeColor\"\n                 [icon]=\"visibleButtons[3].icon\"></es-icon>\n    </button>\n    <button *ngIf=\"visibleButtons.length > 4\"\n            mat-icon-button\n            [disabled]=\"visibleButtons[4].disabled === true\"\n            [matTooltip]=\"visibleButtons[4].tooltip? visibleButtons[4].tooltip : visibleButtons[4].title\"\n            (click)=\"handleAction(visibleButtons[4])\">\n        <es-icon [color]=\"visibleButtons[4].color\"\n                 [themeColor]=\"visibleButtons[4].themeColor\"\n                 [icon]=\"visibleButtons[4].icon\"></es-icon>\n    </button>\n    <button *ngIf=\"visibleButtons.length > 5\"\n            mat-icon-button\n            [disabled]=\"visibleButtons[5].disabled === true\"\n            [matTooltip]=\"visibleButtons[5].tooltip? visibleButtons[5].tooltip : visibleButtons[5].title\"\n            (click)=\"handleAction(visibleButtons[5])\">\n        <es-icon [color]=\"visibleButtons[5].color\"\n                 [themeColor]=\"visibleButtons[5].themeColor\"\n                 [icon]=\"visibleButtons[5].icon\"></es-icon>\n    </button>\n    <button *ngIf=\"visibleButtons.length > 6\"\n            mat-icon-button\n            [disabled]=\"visibleButtons[6].disabled === true\"\n            [matTooltip]=\"visibleButtons[6].tooltip? visibleButtons[6].tooltip : visibleButtons[6].title\"\n            (click)=\"handleAction(visibleButtons[6])\">\n        <es-icon [color]=\"visibleButtons[6].color\"\n                 [themeColor]=\"visibleButtons[6].themeColor\"\n                 [icon]=\"visibleButtons[6].icon\"></es-icon>\n    </button>\n    <button *ngIf=\"visibleButtons.length > 7\"\n            mat-icon-button\n            [disabled]=\"visibleButtons[7].disabled === true\"\n            [matTooltip]=\"visibleButtons[7].tooltip? visibleButtons[7].tooltip : visibleButtons[7].title\"\n            (click)=\"handleAction(visibleButtons[7])\">\n        <es-icon [color]=\"visibleButtons[7].color\"\n                 [themeColor]=\"visibleButtons[7].themeColor\"\n                 [icon]=\"visibleButtons[7].icon\"></es-icon>\n    </button>\n    <button *ngIf=\"visibleButtons.length > 8\"\n            mat-icon-button\n            [disabled]=\"visibleButtons[8].disabled === true\"\n            [matTooltip]=\"visibleButtons[8].tooltip? visibleButtons[8].tooltip : visibleButtons[8].title\"\n            (click)=\"handleAction(visibleButtons[8])\">\n        <es-icon [color]=\"visibleButtons[8].color\"\n                 [themeColor]=\"visibleButtons[8].themeColor\"\n                 [icon]=\"visibleButtons[8].icon\"></es-icon>\n    </button>\n    <button *ngIf=\"visibleButtons.length > 9\"\n            mat-icon-button\n            [disabled]=\"visibleButtons[9].disabled === true\"\n            [matTooltip]=\"visibleButtons[9].tooltip? visibleButtons[9].tooltip : visibleButtons[9].title\"\n            (click)=\"handleAction(visibleButtons[9])\">\n        <es-icon [color]=\"visibleButtons[9].color\"\n                 [themeColor]=\"visibleButtons[9].themeColor\"\n                 [icon]=\"visibleButtons[9].icon\"></es-icon>\n    </button>\n</ng-container>\n\n\n<button *ngIf=\"menuVisible || forceMenu\"\n        mat-icon-button\n        [matMenuTriggerFor]=\"menu\"\n        [matTooltip]=\"'an.more' | translate\">\n    <es-icon [icon]=\"esIcon.MORE_VERT\"></es-icon>\n</button>\n\n\n<mat-menu #menu=\"matMenu\"\n          [overlapTrigger]=\"false\"\n          yPosition=\"below\"\n          xPosition=\"before\">\n    <ng-container *ngIf=\"hiddenButtons && hiddenButtons.length > 0\">\n        <button *ngIf=\"hiddenButtons.length > 0\"\n                mat-menu-item\n                [disabled]=\"hiddenButtons[0].disabled === true\"\n                (click)=\"handleAction(hiddenButtons[0])\">\n            <es-icon [color]=\"hiddenButtons[0].color\"\n                     [themeColor]=\"hiddenButtons[0].themeColor\"\n                     [icon]=\"hiddenButtons[0].icon\"></es-icon>\n            <span>{{hiddenButtons[0].title}}</span>\n        </button>\n        <button *ngIf=\"hiddenButtons.length > 1\"\n                mat-menu-item\n                [disabled]=\"hiddenButtons[1].disabled === true\"\n                (click)=\"handleAction(hiddenButtons[1])\">\n            <es-icon [color]=\"hiddenButtons[1].color\"\n                     [themeColor]=\"hiddenButtons[1].themeColor\"\n                     [icon]=\"hiddenButtons[1].icon\"></es-icon>\n            <span>{{hiddenButtons[1].title}}</span>\n        </button>\n        <button *ngIf=\"hiddenButtons.length > 2\"\n                mat-menu-item\n                [disabled]=\"hiddenButtons[2].disabled === true\"\n                (click)=\"handleAction(hiddenButtons[2])\">\n            <es-icon [color]=\"hiddenButtons[2].color\"\n                     [themeColor]=\"hiddenButtons[2].themeColor\"\n                     [icon]=\"hiddenButtons[2].icon\"></es-icon>\n            <span>{{hiddenButtons[2].title}}</span>\n        </button>\n        <button *ngIf=\"hiddenButtons.length > 3\"\n                mat-menu-item\n                [disabled]=\"hiddenButtons[3].disabled === true\"\n                (click)=\"handleAction(hiddenButtons[3])\">\n            <es-icon [color]=\"hiddenButtons[3].color\"\n                     [themeColor]=\"hiddenButtons[3].themeColor\"\n                     [icon]=\"hiddenButtons[3].icon\"></es-icon>\n            <span>{{hiddenButtons[3].title}}</span>\n        </button>\n        <button *ngIf=\"hiddenButtons.length > 4\"\n                mat-menu-item\n                [disabled]=\"hiddenButtons[4].disabled === true\"\n                (click)=\"handleAction(hiddenButtons[4])\">\n            <es-icon [color]=\"hiddenButtons[4].color\"\n                     [themeColor]=\"hiddenButtons[4].themeColor\"\n                     [icon]=\"hiddenButtons[4].icon\"></es-icon>\n            <span>{{hiddenButtons[4].title}}</span>\n        </button>\n        <button *ngIf=\"hiddenButtons.length > 5\"\n                mat-menu-item\n                [disabled]=\"hiddenButtons[5].disabled === true\"\n                (click)=\"handleAction(hiddenButtons[5])\">\n            <es-icon [color]=\"hiddenButtons[5].color\"\n                     [themeColor]=\"hiddenButtons[5].themeColor\"\n                     [icon]=\"hiddenButtons[5].icon\"></es-icon>\n            <span>{{hiddenButtons[5].title}}</span>\n        </button>\n        <button *ngIf=\"hiddenButtons.length > 6\"\n                mat-menu-item\n                [disabled]=\"hiddenButtons[6].disabled === true\"\n                (click)=\"handleAction(hiddenButtons[6])\">\n            <es-icon [color]=\"hiddenButtons[6].color\"\n                     [themeColor]=\"hiddenButtons[6].themeColor\"\n                     [icon]=\"hiddenButtons[6].icon\"></es-icon>\n            <span>{{hiddenButtons[6].title}}</span>\n        </button>\n        <button *ngIf=\"hiddenButtons.length > 7\"\n                mat-menu-item\n                [disabled]=\"hiddenButtons[7].disabled === true\"\n                (click)=\"handleAction(hiddenButtons[7])\">\n            <es-icon [color]=\"hiddenButtons[7].color\"\n                     [themeColor]=\"hiddenButtons[7].themeColor\"\n                     [icon]=\"hiddenButtons[7].icon\"></es-icon>\n            <span>{{hiddenButtons[7].title}}</span>\n        </button>\n        <button *ngIf=\"hiddenButtons.length > 8\"\n                mat-menu-item\n                [disabled]=\"hiddenButtons[8].disabled === true\"\n                (click)=\"handleAction(hiddenButtons[8])\">\n            <es-icon [color]=\"hiddenButtons[8].color\"\n                     [themeColor]=\"hiddenButtons[8].themeColor\"\n                     [icon]=\"hiddenButtons[8].icon\"></es-icon>\n            <span>{{hiddenButtons[8].title}}</span>\n        </button>\n        <button *ngIf=\"hiddenButtons.length > 9\"\n                mat-menu-item\n                [disabled]=\"hiddenButtons[9].disabled === true\"\n                (click)=\"handleAction(hiddenButtons[9])\">\n            <es-icon [color]=\"hiddenButtons[9].color\"\n                     [themeColor]=\"hiddenButtons[9].themeColor\"\n                     [icon]=\"hiddenButtons[9].icon\"></es-icon>\n            <span>{{hiddenButtons[9].title}}</span>\n        </button>\n    </ng-container>\n</mat-menu>\n",
+                    changeDetection: core.ChangeDetectionStrategy.OnPush,
+                    styles: [":host{float:right}"]
+                },] }
+    ];
+    /** @nocollapse */
+    EsButtonsComponent.ctorParameters = function () { return [
+        { type: router.Router },
+        { type: dialog$1.EsDialogService },
+        { type: snackBar.MatSnackBar },
+        { type: http.HttpService }
+    ]; };
+    EsButtonsComponent.propDecorators = {
+        parentWidth: [{ type: core.Input }],
+        buttons: [{ type: core.Input }],
+        forceMenu: [{ type: core.Input }],
+        buttonClick: [{ type: core.Output }],
+        reload: [{ type: core.Output }],
+        dialogCreated: [{ type: core.Output }],
+        serverResponse: [{ type: core.Output }]
+    };
 
-    /**
-     * @fileoverview added by tsickle
-     * Generated from: lib/es-buttons.module.ts
-     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
-     */
-    var EsButtonsModule = /** @class */ (function () {
-        function EsButtonsModule() {
-        }
-        EsButtonsModule.decorators = [
-            { type: core.NgModule, args: [{
-                        imports: [
-                            common.CommonModule,
-                            button.MatButtonModule,
-                            tooltip.MatTooltipModule,
-                            menu.MatMenuModule,
-                            snackBar.MatSnackBarModule,
-                            core$1.TranslateModule.forChild(),
-                            icon.EsIconModule,
-                            dialog$1.EsDialogModule,
-                            form.EsFormModule,
-                        ],
-                        declarations: [
-                            EsButtonsComponent,
-                            DialogConfirmComponent,
-                            DialogFormComponent,
-                        ],
-                        exports: [EsButtonsComponent],
-                        entryComponents: [
-                            DialogConfirmComponent,
-                            DialogFormComponent,
-                        ],
-                    },] }
-        ];
-        return EsButtonsModule;
+    var EsButtonsModule = /** @class */ (function () {
+        function EsButtonsModule() {
+        }
+        return EsButtonsModule;
     }());
+    EsButtonsModule.decorators = [
+        { type: core.NgModule, args: [{
+                    imports: [
+                        common.CommonModule,
+                        button.MatButtonModule,
+                        tooltip.MatTooltipModule,
+                        menu.MatMenuModule,
+                        snackBar.MatSnackBarModule,
+                        core$1.TranslateModule.forChild(),
+                        icon.EsIconModule,
+                        dialog$1.EsDialogModule,
+                        form.EsFormModule,
+                    ],
+                    declarations: [
+                        EsButtonsComponent,
+                        DialogConfirmComponent,
+                        DialogFormComponent,
+                    ],
+                    exports: [EsButtonsComponent],
+                    entryComponents: [
+                        DialogConfirmComponent,
+                        DialogFormComponent,
+                    ],
+                },] }
+    ];
 
-    /**
-     * @fileoverview added by tsickle
-     * Generated from: lib/model/es-button.interface.ts
-     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
-     */
-    /**
-     * @record
-     */
-    function EsButton() { }
-    if (false) {
-        /** @type {?|undefined} */
-        EsButton.prototype.key;
-        /** @type {?} */
-        EsButton.prototype.title;
-        /** @type {?} */
-        EsButton.prototype.icon;
-        /** @type {?|undefined} */
-        EsButton.prototype.url;
-        /** @type {?|undefined} */
-        EsButton.prototype.action;
-        /** @type {?|undefined} */
-        EsButton.prototype.message;
-        /** @type {?|undefined} */
-        EsButton.prototype.tooltip;
-        /** @type {?|undefined} */
-        EsButton.prototype.submenu;
-        /** @type {?|undefined} */
-        EsButton.prototype.color;
-        /** @type {?|undefined} */
-        EsButton.prototype.themeColor;
-        /** @type {?|undefined} */
-        EsButton.prototype.disabled;
-    }
+    /*
+     * Public API Surface of es-buttons
+     */
 
-    /**
-     * @fileoverview added by tsickle
-     * Generated from: lib/model/es-button-server-response.ts
-     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
-     */
-    /**
-     * @record
-     */
-    function EsButtonServerResponse() { }
-    if (false) {
-        /** @type {?} */
-        EsButtonServerResponse.prototype.button;
-        /** @type {?} */
-        EsButtonServerResponse.prototype.response;
-    }
+    /**
+     * Generated bundle index. Do not edit.
+     */
 
     exports.EsButtonAction = EsButtonAction;
     exports.EsButtonsComponent = EsButtonsComponent;