@universis/ngx-tables 0.8.3 → 0.8.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -753,8 +753,8 @@ var ColumnSelectorComponent = /** @class */ (function (_super) {
753
753
  ColumnSelectorComponent.decorators = [
754
754
  { type: Component, args: [{
755
755
  selector: 'app-column-selector',
756
- template: "<div>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">{{'Tables.SelectColumns' | translate}}</h5>\n <button (click)=\"cancel()\"\n type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-label=\"Cancel\">\n <span aria-hidden=\"true\">&times;</span>\n </button>\n </div>\n <div class=\"modal-body pt-0\">\n <div class=\"row\">\n <div class=\"col-12\">\n <p [translate]=\"'Tables.SelectColumnHelp'\"></p>\n <p [translate]=\"'Tables.MoveColumnHelp'\"></p>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-4\">\n <select [formControl]=\"availableColumnsControl\" size=\"10\" class=\"form-select form-control\" multiple aria-label=\"multiple select example\">\n <ng-container *ngIf=\"columns\">\n <ng-container *ngFor=\"let column of columns | orderBy: ['title']\">\n <option [value]=\"column.key\">{{column.title}}</option>\n </ng-container>\n </ng-container>\n </select>\n </div>\n <div class=\"col-4 d-flex justify-content-center align-items-center\">\n <div class=\"col-9\">\n <div>\n <button [disabled]=\"!(availableColumnsControl.value && availableColumnsControl.value.length)\" (click)=\"addColumns()\" type=\"button\" class=\"btn btn-primary btn-block\">\n <i class=\"fas fa-plus mr-2\"></i><span [translate]=\"'Tables.AddColumn'\"></span>\n </button>\n </div>\n <div class=\"mt-3\">\n <button [disabled]=\"!(selectedColumnsControl.value && selectedColumnsControl.value.length)\" (click)=\"removeColumns()\" type=\"button\" class=\"btn btn-secondary btn-block\">\n <i class=\"fas fa-minus mr-2\"></i><span [translate]=\"'Tables.RemoveColumn'\"></span>\n </button>\n </div>\n </div>\n </div>\n <div class=\"col-4\">\n <select [formControl]=\"selectedColumnsControl\" size=\"10\" class=\"form-select form-control\" multiple aria-label=\"multiple select example\">\n <ng-container *ngIf=\"selectedColumns\">\n <ng-container *ngFor=\"let column of selectedColumns\">\n <option [value]=\"column.key\">{{column.title}}</option>\n </ng-container>\n </ng-container>\n </select>\n <div class=\"d-flex justify-content-center align-items-center\">\n <div class=\"btn-group mt-4\">\n <button #moveUpButton (click)=\"moveUp()\" type=\"button\" class=\"btn btn-primary\">\n <i class=\"fas fa-chevron-up mr-2\"></i><span [translate]=\"'Tables.MoveUp'\"></span>\n </button>\n <button #moveDownButton (click)=\"moveDown()\" type=\"button\" class=\"btn btn-primary ml-2\">\n <i class=\"fas fa-chevron-down mr-2\"></i><span [translate]=\"'Tables.MoveDown'\"></span>\n </button>\n </div>\n </div>\n </div>\n </div>\n \n </div>\n <div class=\"modal-footer justify-content-end\">\n <button [disabled]=\"okButtonDisabled\" (click)=\"ok()\"\n type=\"button\" class=\"btn btn-primary\">\n {{'OK' | translate}}\n </button>\n <button [disabled]=\"cancelButtonDisabled\"\n (click)=\"cancel()\" type=\"button\" [ngClass]=\"cancelButtonClass\" data-dismiss=\"modal\">\n {{'Cancel' | translate}}\n </button>\n </div>\n </div>\n ",
757
- encapsulation: ViewEncapsulation.None,
756
+ template: "<div>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">{{'Tables.SelectColumns' | translate}}</h5>\n <button (click)=\"cancel()\"\n type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-label=\"Cancel\">\n <span aria-hidden=\"true\">&times;</span>\n </button>\n </div>\n <div class=\"modal-body pt-0\">\n <div class=\"row\">\n <div class=\"col-12\">\n <p [translate]=\"'Tables.SelectColumnHelp'\"></p>\n <p [translate]=\"'Tables.MoveColumnHelp'\"></p>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-4\">\n <select [formControl]=\"availableColumnsControl\" size=\"10\" class=\"form-select form-control\" multiple aria-label=\"multiple select example\">\n <ng-container *ngIf=\"columns\">\n <ng-container *ngFor=\"let column of columns | orderBy: ['title']\">\n <option class=\"text-wrap\" [value]=\"column.key\">{{column.title}}</option>\n </ng-container>\n </ng-container>\n </select>\n </div>\n <div class=\"col-4 d-flex justify-content-center align-items-center\">\n <div class=\"col-9\">\n <div>\n <button [disabled]=\"!(availableColumnsControl.value && availableColumnsControl.value.length)\" (click)=\"addColumns()\" type=\"button\" class=\"btn btn-primary btn-block\">\n <i class=\"fas fa-plus mr-2\"></i><span [translate]=\"'Tables.AddColumn'\"></span>\n </button>\n </div>\n <div class=\"mt-3\">\n <button [disabled]=\"!(selectedColumnsControl.value && selectedColumnsControl.value.length)\" (click)=\"removeColumns()\" type=\"button\" class=\"btn btn-secondary btn-block\">\n <i class=\"fas fa-minus mr-2\"></i><span [translate]=\"'Tables.RemoveColumn'\"></span>\n </button>\n </div>\n </div>\n </div>\n <div class=\"col-4\">\n <select [formControl]=\"selectedColumnsControl\" size=\"10\" class=\"form-select form-control\" multiple aria-label=\"multiple select example\">\n <ng-container *ngIf=\"selectedColumns\">\n <ng-container *ngFor=\"let column of selectedColumns\">\n <option class=\"text-wrap\" [value]=\"column.key\">{{column.title}}</option>\n </ng-container>\n </ng-container>\n </select>\n <div class=\"d-flex justify-content-center align-items-center\">\n <div class=\"btn-group mt-4\">\n <button #moveUpButton (click)=\"moveUp()\" type=\"button\" class=\"btn btn-primary\">\n <i class=\"fas fa-chevron-up mr-2\"></i><span [translate]=\"'Tables.MoveUp'\"></span>\n </button>\n <button #moveDownButton (click)=\"moveDown()\" type=\"button\" class=\"btn btn-primary ml-2\">\n <i class=\"fas fa-chevron-down mr-2\"></i><span [translate]=\"'Tables.MoveDown'\"></span>\n </button>\n </div>\n </div>\n </div>\n </div>\n \n </div>\n <div class=\"modal-footer justify-content-end\">\n <button [disabled]=\"okButtonDisabled\" (click)=\"ok()\"\n type=\"button\" class=\"btn btn-primary\">\n {{'OK' | translate}}\n </button>\n <button [disabled]=\"cancelButtonDisabled\"\n (click)=\"cancel()\" type=\"button\" [ngClass]=\"cancelButtonClass\" data-dismiss=\"modal\">\n {{'Cancel' | translate}}\n </button>\n </div>\n </div>\n ",
757
+ encapsulation: ViewEncapsulation.Emulated,
758
758
  styles: ["\n .form-select {\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n padding: 5px;\n }\n .form-select * {\n padding: 5px 5px;\n }\n .btn.disabled, .btn:disabled {\n border-color: transparent !important;\n }\n "]
759
759
  }] }
760
760
  ];
@@ -2418,6 +2418,12 @@ var AdvancedTableComponent = /** @class */ (function () {
2418
2418
  }
2419
2419
  // finally apply column order
2420
2420
  _this.dataTable.colReorder.order(indexes, true);
2421
+ if (_this.selectable) {
2422
+ // rebind onSelectionChange function
2423
+ var tableElement = jQuery(_this.table.nativeElement);
2424
+ var elements = tableElement.find('input.s-row');
2425
+ elements.off('click').on('click', _this.onSelectionChange.bind(_this));
2426
+ }
2421
2427
  }
2422
2428
  });
2423
2429
  };