@coolon/angular-ui-powerups 1.17.0 → 1.18.0

package/fesm5/coolon-angular-ui-powerups.js

@@ -13,7 +13,7 @@ import { MatButtonModule } from '@angular/material/button';
 import { MatCheckboxModule } from '@angular/material/checkbox';
 import { MatIconModule } from '@angular/material/icon';
 import { MatTableModule } from '@angular/material/table';
-import { DelegatingValueModel, assert, UnaryCommand, lang, Dsl, GarbageCollector, Logger, TrackExternal, Command, FocusManager, DelegatingFormListModel, DelegatingFormValueModel, ListModel, StoreInListModel, ValueModel, StoreInValueModel, MutableValueModel, MultipleSelectionModel, MutableListModel, Form, Deferred, Trace, Guard, DebugContext, Binding, Functions } from '@coolon/pectin';
+import { DelegatingValueModel, assert, UnaryCommand, lang, Dsl, GarbageCollector, Logger, TrackExternal, Command, FocusManager, DelegatingFormListModel, DelegatingFormValueModel, ListModel, StoreInListModel, ValueModel, StoreInValueModel, MutableValueModel, OptionsHelper, MultipleSelectionModel, MutableListModel, Form, Deferred, Trace, Guard, DebugContext, Binding, Functions } from '@coolon/pectin';
 import { assert as assert$1, Opts, lang as lang$1, Klass } from '@coolon/typescript-utilities';
 import { Memoize } from '@typescript-plus/fast-memoize-decorator/dist/src';
 import ___default, { isEqual, isNil } from 'lodash';
@@ -1376,7 +1376,7 @@ var SelectHeaderCellRendererComponent = /** @class */ (function (_super) {
     SelectHeaderCellRendererComponent = __decorate([
         Component({
             selector: 'aup-select-header-cell-renderer',
-            template: "<mat-checkbox [pectinCommand]=\"selectCommand\" [checked]=\"isSelected()\" [indeterminate]=\"this.isIntermediate()\"></mat-checkbox>\n",
+            template: "<mat-checkbox *ngIf=\"enableHeaderControls\" [pectinCommand]=\"selectCommand\" [checked]=\"isSelected()\" [indeterminate]=\"this.isIntermediate()\"></mat-checkbox>\n",
             styles: [""]
         }),
         __metadata("design:paramtypes", [])
@@ -1591,11 +1591,15 @@ var CustomTemplateColumnModel = /** @class */ (function (_super) {
 }(ColumnModel));
 var SelectionColumnModel = /** @class */ (function (_super) {
     __extends(SelectionColumnModel, _super);
-    function SelectionColumnModel(columnId, defaults, selectionModel) {
+    function SelectionColumnModel(columnId, defaults, selectionModel, options) {
         var _this = _super.call(this, columnId, defaults) || this;
+        _this.selectionModel = selectionModel;
+        var opts = OptionsHelper.for(options);
+        _this.selectOnRowClick = opts.get("selectOnRowClick", false);
         if (selectionModel instanceof MultipleSelectionModel) {
             _this.cellHeaderRenderer(SelectHeaderCellRendererComponent, function (component) {
                 component.selectionModel = selectionModel;
+                component.enableHeaderControls = opts.get("headerControl", true);
             });
         }
         _this.configureCellRenderer(new ComponentCellRendererPortalRef(SelectCellRendererComponent, function (component, rowData) {
@@ -1607,6 +1611,11 @@ var SelectionColumnModel = /** @class */ (function (_super) {
     SelectionColumnModel.prototype.getDefaultHeaderText = function () {
         return '';
     };
+    SelectionColumnModel.prototype.onRowClick = function (row) {
+        if (this.selectOnRowClick) {
+            this.selectionModel.selectCommand.execute(row);
+        }
+    };
     return SelectionColumnModel;
 }(ColumnModel));
 
@@ -1732,8 +1741,10 @@ var TableModel = /** @class */ (function () {
     TableModel.prototype.pluckList = function (property) {
         return this.addColumn(new ListPropertyColumnModel(property, this));
     };
-    TableModel.prototype.addSelectionColumn = function (selectionModel) {
-        return this.addColumn(new SelectionColumnModel('selection', this, selectionModel));
+    TableModel.prototype.addSelectionColumn = function (selectionModel, options) {
+        assert.isNil(this.selectionColumnModel);
+        this.selectionColumnModel = new SelectionColumnModel('selection', this, selectionModel, options);
+        return this.addColumn(this.selectionColumnModel);
     };
     TableModel.prototype.addEditControls = function (saveCommand) {
         this.saveCommand = saveCommand;
@@ -1796,6 +1807,13 @@ var TableModel = /** @class */ (function () {
             });
         });
     };
+    TableModel.prototype.onRowClicked = function (row) {
+        var _a;
+        (_a = this.selectionColumnModel) === null || _a === void 0 ? void 0 : _a.onRowClick(row);
+    };
+    TableModel.prototype.isRowSelectionEnabled = function () {
+        return this.selectionColumnModel ? this.selectionColumnModel.selectOnRowClick : false;
+    };
     var TableModel_1;
     TableModel.ctorParameters = function () { return [
         { type: ListModel }
@@ -1854,6 +1872,12 @@ var TableComponent = /** @class */ (function (_super) {
             column.setTemplate(templateRef, viewContainer, fillCell, padChild);
         }
     };
+    TableComponent.prototype.onRowClicked = function (row) {
+        this.tableModel.onRowClicked(row);
+    };
+    TableComponent.prototype.isRowSelectionEnabled = function () {
+        return this.tableModel.isRowSelectionEnabled();
+    };
     __decorate([
         Input(),
         TrackExternal(),
@@ -1862,8 +1886,8 @@ var TableComponent = /** @class */ (function (_super) {
     TableComponent = __decorate([
         Component({
             selector: 'aup-table',
-            template: "<table mat-table [dataSource]=\"tableModel.dataSource.value\" [trackBy]=\"tableModel.getTrackByFunction()\">\n\n  <ng-container *ngFor=\"let column of columns.value; index as index; first as first; last as last\" matColumnDef=\"{{column.columnId}}\">\n    <th mat-header-cell *matHeaderCellDef>\n      <aup-table-header-cell-renderer [column]=\"column\"\n                                      [attr.column-index]=\"index\"\n                                      [class.first-column]=\"first\"\n                                      [class.last-column]=\"last\"\n      ></aup-table-header-cell-renderer>\n    </th>\n    <td mat-cell *matCellDef=\"let row\">\n      <aup-table-cell-renderer [column]=\"column\"\n                               [row]=\"row\"\n                               [tableModel]=\"tableModel\"\n                               [editSession]=\"tableModel.getEditSessionFor(row)\"\n                               [attr.column-index]=\"index\"\n                               [class.first-column]=\"first\"\n                               [class.last-column]=\"last\"\n      ></aup-table-cell-renderer>\n    </td>\n  </ng-container>\n\n  <tr mat-header-row *matHeaderRowDef=\"columnIds.value\"></tr>\n  <tr mat-row *matRowDef=\"let row; columns: columnIds.value;\"></tr>\n\n</table>\n",
-            styles: [":host{display:flex;flex-direction:column;align-items:stretch}:host table{flex:1}"]
+            template: "<table mat-table [dataSource]=\"tableModel.dataSource.value\" [trackBy]=\"tableModel.getTrackByFunction()\">\n\n  <ng-container *ngFor=\"let column of columns.value; index as index; first as first; last as last\" matColumnDef=\"{{column.columnId}}\">\n    <th mat-header-cell *matHeaderCellDef>\n      <aup-table-header-cell-renderer [column]=\"column\"\n                                      [attr.column-index]=\"index\"\n                                      [class.first-column]=\"first\"\n                                      [class.last-column]=\"last\"\n      ></aup-table-header-cell-renderer>\n    </th>\n    <td mat-cell *matCellDef=\"let row\">\n      <aup-table-cell-renderer [column]=\"column\"\n                               [row]=\"row\"\n                               [tableModel]=\"tableModel\"\n                               [editSession]=\"tableModel.getEditSessionFor(row)\"\n                               [attr.column-index]=\"index\"\n                               [class.first-column]=\"first\"\n                               [class.last-column]=\"last\"\n      ></aup-table-cell-renderer>\n    </td>\n  </ng-container>\n\n  <tr mat-header-row *matHeaderRowDef=\"columnIds.value\"></tr>\n  <tr mat-row *matRowDef=\"let row; columns: columnIds.value;\" (click)=\"onRowClicked(row)\" [class.select-row-on-click]=\"isRowSelectionEnabled()\"></tr>\n\n</table>\n",
+            styles: [":host{display:flex;flex-direction:column;align-items:stretch}:host table{flex:1}:host table tr.select-row-on-click td{cursor:pointer}"]
         }),
         __metadata("design:paramtypes", [])
     ], TableComponent);
@@ -3345,6 +3369,8 @@ var InteractionContextTriggerFor = /** @class */ (function (_super) {
         return _this;
     }
     InteractionContextTriggerFor.prototype.onEnter = function (event) {
+        event.preventDefault();
+        event.stopPropagation();
         if (!this.aupInteractionContextTriggerFor.isActive()) {
             this.startActivity();
         }
@@ -3353,6 +3379,8 @@ var InteractionContextTriggerFor = /** @class */ (function (_super) {
         }
     };
     InteractionContextTriggerFor.prototype.onClick = function (event) {
+        event.preventDefault();
+        event.stopPropagation();
         if (!this.aupInteractionContextTriggerFor.isActive()) {
             this.startActivity();
         }
@@ -3401,13 +3429,13 @@ var InteractionContextTriggerFor = /** @class */ (function (_super) {
         __metadata("design:type", Object)
     ], InteractionContextTriggerFor.prototype, "activityCancelled", void 0);
     __decorate([
-        HostListener('keyup.enter'),
+        HostListener('keyup.enter', ['$event']),
         __metadata("design:type", Function),
         __metadata("design:paramtypes", [KeyboardEvent]),
         __metadata("design:returntype", void 0)
     ], InteractionContextTriggerFor.prototype, "onEnter", null);
     __decorate([
-        HostListener('click'),
+        HostListener('click', ['$event']),
         __metadata("design:type", Function),
         __metadata("design:paramtypes", [MouseEvent]),
         __metadata("design:returntype", void 0)