diff --git a/docs/changelog.md b/docs/changelog.md
index b50ce56ac..c21e927a6 100644
--- a/docs/changelog.md
+++ b/docs/changelog.md
@@ -1,5 +1,9 @@
# Changelog
+## 1.7.0
+- Enhancement: Add RxJS Support
+- Chore: Fix builds on windows
+
## 1.6.0
- Bug: Column headers not re-ordering (#238)
- Bug: Datatable doesn't sort data correctly when data changed (#284)
diff --git a/package.json b/package.json
index 28ef32857..712f42787 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "angular2-data-table",
- "version": "1.6.0",
+ "version": "1.7.0",
"description": "angular2-data-table is a Angular2 component for presenting large and complex data.",
"main": "release/index.js",
"typings": "release/index.d.ts",
@@ -16,8 +16,8 @@
"clean:dist": "rimraf dist",
"clean:release": "rimraf release",
"build": "webpack --display-error-details",
- "build:release": "NODE_ENV=production npm run build",
- "build:package": "NODE_ENV=package npm run build",
+ "build:release": "cross-env NODE_ENV=production npm run build",
+ "build:package": "cross-env NODE_ENV=package npm run build",
"build:ts": "tsc",
"build:aot": "ngc",
"build:sass": "node-sass -o dist/ src/",
@@ -81,6 +81,7 @@
"clean-webpack-plugin": "^0.1.10",
"copy-webpack-plugin": "^4.0.0",
"core-js": "^2.4.0",
+ "cross-env": "^3.1.3",
"css-loader": "^0.24.0",
"extract-text-webpack-plugin": "^2.0.0-beta.4",
"fs-extra": "^1.0.0",
diff --git a/release/app.css b/release/app.css
deleted file mode 100644
index c4d7510d1..000000000
--- a/release/app.css
+++ /dev/null
@@ -1,368 +0,0 @@
-/**
- * angular2-data-table v"1.6.0" (https://github.com/swimlane/angular2-data-table)
- * Copyright 2016
- * Licensed under MIT
- */
-.datatable {
- display: block;
- overflow: hidden;
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
- position: relative;
- /**
- * Vertical Scrolling Adjustments
- */
- /**
- * Horizontal Scrolling Adjustments
- */
- /**
- * Fixed Header Height Adjustments
- */
- /**
- * Fixed row height adjustments
- */
- /**
- * Shared Styles
- */
- /**
- * Header Styles
- */
- /**
- * Body Styles
- */
- /**
- * Footer Styles
- */ }
- .datatable [hidden] {
- display: none !important; }
- .datatable *, .datatable *:before, .datatable *:after {
- box-sizing: border-box; }
- .datatable.scroll-vertical .datatable-body {
- overflow-y: auto; }
- .datatable.scroll-vertical .datatable-body .datatable-row-wrapper {
- position: absolute; }
- .datatable.scroll-horz .datatable-body {
- overflow-x: auto; }
- .datatable.fixed-header .datatable-header .datatable-header-inner {
- white-space: nowrap; }
- .datatable.fixed-header .datatable-header .datatable-header-inner .datatable-header-cell {
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis; }
- .datatable.fixed-row .datatable-scroll {
- white-space: nowrap; }
- .datatable.fixed-row .datatable-scroll .datatable-body-row {
- white-space: nowrap; }
- .datatable.fixed-row .datatable-scroll .datatable-body-row .datatable-body-cell {
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis; }
- .datatable .datatable-body-row,
- .datatable .datatable-header-inner {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-orient: horizontal;
- -webkit-box-direction: normal;
- -ms-flex-direction: row;
- flex-direction: row;
- -ms-flex-flow: row;
- -o-flex-flow: row;
- flex-flow: row; }
- .datatable .datatable-body-cell,
- .datatable .datatable-header-cell {
- vertical-align: top;
- display: inline-block;
- line-height: 1.625;
- -webkit-user-select: none;
- -moz-user-select: none;
- -ms-user-select: none;
- -o-user-select: none;
- user-select: none; }
- .datatable .datatable-body-cell:focus,
- .datatable .datatable-header-cell:focus {
- outline: none; }
- .datatable .datatable-row-left,
- .datatable .datatable-row-right {
- z-index: 9; }
- .datatable .datatable-row-left,
- .datatable .datatable-row-center,
- .datatable .datatable-row-right {
- position: relative; }
- .datatable .datatable-header {
- display: block;
- overflow: hidden; }
- .datatable .datatable-header .datatable-header-inner {
- -webkit-box-align: stretch;
- -ms-flex-align: stretch;
- align-items: stretch;
- -webkit-align-items: stretch; }
- .datatable .datatable-header .datatable-header-cell {
- position: relative;
- display: inline-block; }
- .datatable .datatable-header .datatable-header-cell.longpress {
- cursor: move; }
- .datatable .datatable-header .datatable-header-cell.sortable {
- cursor: pointer; }
- .datatable .datatable-header .datatable-header-cell .sort-btn {
- line-height: 100%;
- vertical-align: middle;
- display: inline-block; }
- .datatable .datatable-header .datatable-header-cell .resize-handle {
- display: inline-block;
- position: absolute;
- right: 0;
- top: 0;
- bottom: 0;
- width: 5px;
- padding: 0 8px;
- visibility: hidden;
- cursor: ew-resize; }
- .datatable .datatable-header .datatable-header-cell.resizeable:hover .resize-handle {
- visibility: visible; }
- .datatable .datatable-body {
- position: relative;
- z-index: 10;
- display: block; }
- .datatable .datatable-body .datatable-scroll {
- display: inline-block; }
- .datatable .datatable-body .datatable-row-detail {
- overflow-y: hidden; }
- .datatable .datatable-body .datatable-row-wrapper {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-orient: vertical;
- -webkit-box-direction: normal;
- -ms-flex-direction: column;
- flex-direction: column; }
- .datatable .datatable-body .datatable-body-row {
- outline: none; }
- .datatable .datatable-body .datatable-body-row > div {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex; }
- .datatable .datatable-footer {
- display: block;
- width: 100%; }
- .datatable .datatable-footer > div {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- width: 100%; }
- .datatable .datatable-footer .page-count {
- display: inline-block;
- -webkit-box-flex: 1;
- -ms-flex: 1 1 20%;
- flex: 1 1 20%; }
- .datatable .datatable-footer .datatable-pager {
- display: inline-block;
- -webkit-box-flex: 1;
- -ms-flex: 1 1 80%;
- flex: 1 1 80%;
- text-align: right; }
- .datatable .datatable-footer .datatable-pager .pager,
- .datatable .datatable-footer .datatable-pager .pager li {
- padding: 0;
- margin: 0;
- display: inline-block;
- list-style: none; }
- .datatable .datatable-footer .datatable-pager .pager li, .datatable .datatable-footer .datatable-pager .pager li a {
- outline: none; }
- .datatable .datatable-footer .datatable-pager .pager li a {
- cursor: pointer;
- display: inline-block; }
- .datatable .datatable-footer .datatable-pager .pager li.disabled a {
- cursor: not-allowed; }
-.datatable.material {
- background: #FFF;
- box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.24);
- /**
- * Shared Styles
- */
- /**
- * Global Row Styles
- */
- /**
- * Header Styles
- */
- /**
- * Body Styles
- */
- /**
- * Footer Styles
- */ }
- .datatable.material.striped .datatable-row-odd {
- background: #eee; }
- .datatable.material .empty-row {
- height: 50px;
- text-align: left;
- padding: .5rem 1.2rem;
- vertical-align: top;
- border-top: 0; }
- .datatable.material .loading-row {
- text-align: left;
- padding: .5rem 1.2rem;
- vertical-align: top;
- border-top: 0; }
- .datatable.material .datatable-header .datatable-row-left,
- .datatable.material .datatable-body .datatable-row-left {
- background-color: #FFF;
- background-position: 100% 0;
- background-repeat: repeat-y;
- background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAABCAYAAAD5PA/NAAAAFklEQVQIHWPSkNeSBmJhTQVtbiDNCgASagIIuJX8OgAAAABJRU5ErkJggg==); }
- .datatable.material .datatable-header .datatable-row-right,
- .datatable.material .datatable-body .datatable-row-right {
- background-position: 0 0;
- background-color: #fff;
- background-repeat: repeat-y;
- background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAABCAYAAAD5PA/NAAAAFklEQVQI12PQkNdi1VTQ5gbSwkAsDQARLAIGtOSFUAAAAABJRU5ErkJggg==); }
- .datatable.material .datatable-header {
- border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
- .datatable.material .datatable-header .datatable-header-cell {
- text-align: left;
- padding: .5rem 1.2rem;
- font-weight: 400;
- color: #757575;
- vertical-align: bottom; }
- .datatable.material .datatable-header .datatable-header-cell.longpress {
- color: #00E676; }
- .datatable.material .datatable-header .datatable-header-cell.dragging .resize-handle {
- border-right: none; }
- .datatable.material .datatable-header .resize-handle {
- border-right: solid 1px #eee; }
- .datatable.material .datatable-body .datatable-row-detail {
- background: #f5f5f5;
- padding: 10px; }
- .datatable.material .datatable-body .datatable-body-row .datatable-body-cell {
- text-align: left;
- padding: .5rem 1.2rem;
- vertical-align: top;
- border-top: 0;
- -webkit-transition: width 0.3s ease;
- transition: width 0.3s ease; }
- .datatable.material .datatable-body .datatable-body-row:hover,
- .datatable.material .datatable-body .datatable-body-row:hover .datatable-row-group {
- background-color: #eee;
- -webkit-transition-property: background;
- transition-property: background;
- -webkit-transition-duration: .3s;
- transition-duration: .3s;
- -webkit-transition-timing-function: linear;
- transition-timing-function: linear; }
- .datatable.material .datatable-body .datatable-body-row:focus,
- .datatable.material .datatable-body .datatable-body-row:focus .datatable-row-group {
- background-color: #ddd; }
- .datatable.material .datatable-body .datatable-body-row.active,
- .datatable.material .datatable-body .datatable-body-row.active .datatable-row-group {
- background-color: #304FFE;
- color: #FFF; }
- .datatable.material .datatable-body .datatable-body-row.active:hover,
- .datatable.material .datatable-body .datatable-body-row.active:hover .datatable-row-group {
- background-color: #193AE4;
- color: #FFF; }
- .datatable.material .datatable-body .datatable-body-row.active:focus,
- .datatable.material .datatable-body .datatable-body-row.active:focus .datatable-row-group {
- background-color: #2041EF;
- color: #FFF; }
- .datatable.material .datatable-body .progress-linear {
- display: block;
- position: relative;
- width: 100%;
- height: 5px;
- padding: 0;
- margin: 0;
- position: absolute; }
- .datatable.material .datatable-body .progress-linear .container {
- display: block;
- position: relative;
- overflow: hidden;
- width: 100%;
- height: 5px;
- -webkit-transform: translate(0, 0) scale(1, 1);
- transform: translate(0, 0) scale(1, 1);
- background-color: #aad1f9; }
- .datatable.material .datatable-body .progress-linear .container .bar {
- -webkit-transition: all .2s linear;
- transition: all .2s linear;
- -webkit-animation: query 0.8s infinite cubic-bezier(0.39, 0.575, 0.565, 1);
- animation: query 0.8s infinite cubic-bezier(0.39, 0.575, 0.565, 1);
- transition: -webkit-transform .2s linear;
- -webkit-transition: -webkit-transform .2s linear;
- transition: transform .2s linear;
- transition: transform .2s linear, -webkit-transform .2s linear;
- background-color: #106cc8;
- position: absolute;
- left: 0;
- top: 0;
- bottom: 0;
- width: 100%;
- height: 5px; }
- .datatable.material .datatable-footer {
- border-top: 1px solid rgba(0, 0, 0, 0.12);
- font-size: 16px; }
- .datatable.material .datatable-footer .page-count {
- line-height: 50px;
- height: 50px;
- padding: 0 1.2rem; }
- .datatable.material .datatable-footer .datatable-pager {
- margin: 0 10px; }
- .datatable.material .datatable-footer .datatable-pager li {
- vertical-align: middle; }
- .datatable.material .datatable-footer .datatable-pager li.disabled a {
- color: rgba(0, 0, 0, 0.26) !important;
- background-color: transparent !important; }
- .datatable.material .datatable-footer .datatable-pager li.active a {
- background-color: rgba(158, 158, 158, 0.2);
- font-weight: bold; }
- .datatable.material .datatable-footer .datatable-pager a {
- height: 22px;
- min-width: 24px;
- line-height: 22px;
- padding: 0 6px;
- border-radius: 3px;
- margin: 6px 3px;
- text-align: center;
- vertical-align: top;
- color: rgba(0, 0, 0, 0.54);
- text-decoration: none;
- vertical-align: bottom; }
- .datatable.material .datatable-footer .datatable-pager a:hover {
- color: rgba(0, 0, 0, 0.75);
- background-color: rgba(158, 158, 158, 0.2); }
- .datatable.material .datatable-footer .datatable-pager .icon-left,
- .datatable.material .datatable-footer .datatable-pager .icon-skip,
- .datatable.material .datatable-footer .datatable-pager .icon-right,
- .datatable.material .datatable-footer .datatable-pager .icon-prev {
- font-size: 20px;
- line-height: 20px;
- padding: 0 3px; }
-
-/**
- * Progress bar animations
- */
-@-webkit-keyframes query {
- 0% {
- opacity: 1;
- -webkit-transform: translateX(35%) scale(0.3, 1);
- transform: translateX(35%) scale(0.3, 1); }
- 100% {
- opacity: 0;
- -webkit-transform: translateX(-50%) scale(0, 1);
- transform: translateX(-50%) scale(0, 1); } }
-
-@keyframes query {
- 0% {
- opacity: 1;
- -webkit-transform: translateX(35%) scale(0.3, 1);
- transform: translateX(35%) scale(0.3, 1); }
- 100% {
- opacity: 0;
- -webkit-transform: translateX(-50%) scale(0, 1);
- transform: translateX(-50%) scale(0, 1); } }
-
-/*# sourceMappingURL=app.map*/
\ No newline at end of file
diff --git a/release/app.js b/release/app.js
deleted file mode 100644
index 1c51dba22..000000000
--- a/release/app.js
+++ /dev/null
@@ -1,6277 +0,0 @@
-/**
- * angular2-data-table v"1.6.0" (https://github.com/swimlane/angular2-data-table)
- * Copyright 2016
- * Licensed under MIT
- */
-(function webpackUniversalModuleDefinition(root, factory) {
- if(typeof exports === 'object' && typeof module === 'object')
- module.exports = factory(require("@angular/common"), require("@angular/core"), require("@angular/platform-browser"), require("@angular/platform-browser-dynamic"), require("rxjs/Rx"));
- else if(typeof define === 'function' && define.amd)
- define("angular2-data-table", ["@angular/common", "@angular/core", "@angular/platform-browser", "@angular/platform-browser-dynamic", "rxjs/Rx"], factory);
- else if(typeof exports === 'object')
- exports["angular2-data-table"] = factory(require("@angular/common"), require("@angular/core"), require("@angular/platform-browser"), require("@angular/platform-browser-dynamic"), require("rxjs/Rx"));
- else
- root["angular2-data-table"] = factory(root["@angular/common"], root["@angular/core"], root["@angular/platform-browser"], root["@angular/platform-browser-dynamic"], root["rxjs/Rx"]);
-})(this, function(__WEBPACK_EXTERNAL_MODULE_2__, __WEBPACK_EXTERNAL_MODULE_0__, __WEBPACK_EXTERNAL_MODULE_4__, __WEBPACK_EXTERNAL_MODULE_3__, __WEBPACK_EXTERNAL_MODULE_1__) {
-return /******/ (function(modules) { // webpackBootstrap
-/******/ // The module cache
-/******/ var installedModules = {};
-/******/
-/******/ // The require function
-/******/ function __webpack_require__(moduleId) {
-/******/
-/******/ // Check if module is in cache
-/******/ if(installedModules[moduleId])
-/******/ return installedModules[moduleId].exports;
-/******/
-/******/ // Create a new module (and put it into the cache)
-/******/ var module = installedModules[moduleId] = {
-/******/ i: moduleId,
-/******/ l: false,
-/******/ exports: {}
-/******/ };
-/******/
-/******/ // Execute the module function
-/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
-/******/
-/******/ // Flag the module as loaded
-/******/ module.l = true;
-/******/
-/******/ // Return the exports of the module
-/******/ return module.exports;
-/******/ }
-/******/
-/******/
-/******/ // expose the modules object (__webpack_modules__)
-/******/ __webpack_require__.m = modules;
-/******/
-/******/ // expose the module cache
-/******/ __webpack_require__.c = installedModules;
-/******/
-/******/ // identity function for calling harmory imports with the correct context
-/******/ __webpack_require__.i = function(value) { return value; };
-/******/
-/******/ // define getter function for harmory exports
-/******/ __webpack_require__.d = function(exports, name, getter) {
-/******/ Object.defineProperty(exports, name, {
-/******/ configurable: false,
-/******/ enumerable: true,
-/******/ get: getter
-/******/ });
-/******/ };
-/******/
-/******/ // getDefaultExport function for compatibility with non-harmony modules
-/******/ __webpack_require__.n = function(module) {
-/******/ var getter = module && module.__esModule ?
-/******/ function getDefault() { return module['default']; } :
-/******/ function getModuleExports() { return module; };
-/******/ __webpack_require__.d(getter, 'a', getter);
-/******/ return getter;
-/******/ };
-/******/
-/******/ // Object.prototype.hasOwnProperty.call
-/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
-/******/
-/******/ // __webpack_public_path__
-/******/ __webpack_require__.p = "";
-/******/
-/******/ // Load entry module and return exports
-/******/ return __webpack_require__(__webpack_require__.s = "./demo/bootstrap.ts");
-/******/ })
-/************************************************************************/
-/******/ ({
-
-/***/ "./demo/app.component.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var AppComponent = (function () {
- function AppComponent() {
- this.version = "1.6.0";
- }
- Object.defineProperty(AppComponent.prototype, "state", {
- get: function () {
- return window.state;
- },
- set: function (state) {
- window.state = state;
- },
- enumerable: true,
- configurable: true
- });
- AppComponent = __decorate([
- core_1.Component({
- selector: 'app',
- template: "\n \n
\n
\n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n \n\n \n \n \n \n \n \n \n \n \n \n \n\n \n \n \n\n \n \n \n \n \n \n \n
\n
Fluid Row Heights
\n \n \n \n "
- }),
- __metadata('design:paramtypes', [])
- ], BasicAutoComponent);
- return BasicAutoComponent;
-}());
-exports.BasicAutoComponent = BasicAutoComponent;
-
-
-/***/ },
-
-/***/ "./demo/basic/basic-fixed.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var BasicFixedComponent = (function () {
- function BasicFixedComponent() {
- var _this = this;
- this.rows = [];
- this.columns = [
- { prop: 'name' },
- { name: 'Company' },
- { name: 'Gender' }
- ];
- this.fetch(function (data) {
- _this.rows = data;
- });
- }
- BasicFixedComponent.prototype.fetch = function (cb) {
- var req = new XMLHttpRequest();
- req.open('GET', "assets/data/company.json");
- req.onload = function () {
- cb(JSON.parse(req.response));
- };
- req.send();
- };
- BasicFixedComponent = __decorate([
- core_1.Component({
- selector: 'basic-fixed-demo',
- template: "\n \n
Fix Row Height
\n \n \n \n "
- }),
- __metadata('design:paramtypes', [])
- ], BasicFixedComponent);
- return BasicFixedComponent;
-}());
-exports.BasicFixedComponent = BasicFixedComponent;
-
-
-/***/ },
-
-/***/ "./demo/basic/filter.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var FilterBarComponent = (function () {
- function FilterBarComponent() {
- var _this = this;
- this.rows = [];
- this.temp = [];
- this.columns = [
- { prop: 'name' },
- { name: 'Company' },
- { name: 'Gender' }
- ];
- this.fetch(function (data) {
- // cache our list
- _this.temp = data.slice();
- // push our inital complete list
- _this.rows = data;
- });
- }
- FilterBarComponent.prototype.fetch = function (cb) {
- var req = new XMLHttpRequest();
- req.open('GET', "assets/data/company.json");
- req.onload = function () {
- cb(JSON.parse(req.response));
- };
- req.send();
- };
- FilterBarComponent.prototype.updateFilter = function (event) {
- var val = event.target.value;
- // filter our data
- var temp = this.temp.filter(function (d) {
- return d.name.toLowerCase().indexOf(val) !== -1 || !val;
- });
- // update the rows
- this.rows = temp;
- };
- FilterBarComponent = __decorate([
- core_1.Component({
- selector: 'filter-demo',
- template: "\n \n
Client-side Search and Filtering
\n \n \n \n \n "
- }),
- __metadata('design:paramtypes', [])
- ], FilterBarComponent);
- return FilterBarComponent;
-}());
-exports.FilterBarComponent = FilterBarComponent;
-
-
-/***/ },
-
-/***/ "./demo/basic/fullscreen.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var FullScreenComponent = (function () {
- function FullScreenComponent() {
- var _this = this;
- this.rows = [];
- this.fetch(function (data) {
- _this.rows = data;
- });
- }
- FullScreenComponent.prototype.fetch = function (cb) {
- var req = new XMLHttpRequest();
- req.open('GET', "assets/data/100k.json");
- req.onload = function () {
- cb(JSON.parse(req.response));
- };
- req.send();
- };
- FullScreenComponent = __decorate([
- core_1.Component({
- selector: 'full-screen-demo',
- template: "\n \n
Full Screen
\n \n \n \n \n \n \n \n \n \n "
- }),
- __metadata('design:paramtypes', [])
- ], FullScreenComponent);
- return FullScreenComponent;
-}());
-exports.FullScreenComponent = FullScreenComponent;
-
-
-/***/ },
-
-/***/ "./demo/basic/inline.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var InlineEditComponent = (function () {
- function InlineEditComponent() {
- var _this = this;
- this.editing = {};
- this.rows = [];
- this.fetch(function (data) {
- _this.rows = data;
- });
- }
- InlineEditComponent.prototype.fetch = function (cb) {
- var req = new XMLHttpRequest();
- req.open('GET', "assets/data/company.json");
- req.onload = function () {
- cb(JSON.parse(req.response));
- };
- req.send();
- };
- InlineEditComponent.prototype.updateValue = function (event, cell, cellValue, row) {
- this.editing[row.$$index + '-' + cell] = false;
- this.rows[row.$$index][cell] = event.target.value;
- };
- InlineEditComponent = __decorate([
- core_1.Component({
- selector: 'inline-edit-demo',
- template: "\n \n
Inline Editing
\n \n \n \n \n {{value}}\n \n \n \n \n \n \n \n {{value}}\n \n \n \n \n \n \n \n \n \n {{value}}\n \n \n \n \n "
- }),
- __metadata('design:paramtypes', [])
- ], InlineEditComponent);
- return InlineEditComponent;
-}());
-exports.InlineEditComponent = InlineEditComponent;
-
-
-/***/ },
-
-/***/ "./demo/basic/live.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var LiveDataComponent = (function () {
- function LiveDataComponent() {
- var _this = this;
- this.rows = [];
- this.active = true;
- this.cols = [
- 'Type', 'Organization', 'DateAdded', 'Tags'
- ];
- this.fetch(function (data) {
- _this.rows = data.map(function (d) {
- d.updated = Date.now().toString();
- return d;
- });
- });
- this.start();
- }
- LiveDataComponent.prototype.randomNum = function (start, end) {
- return Math.floor(Math.random() * end) + start;
- };
- LiveDataComponent.prototype.start = function () {
- if (!this.active)
- return;
- setTimeout(this.updateRandom.bind(this), 50);
- };
- LiveDataComponent.prototype.stop = function () {
- this.active = false;
- };
- LiveDataComponent.prototype.updateRandom = function () {
- var rowNum = this.randomNum(0, 5);
- var cellNum = this.randomNum(0, 4);
- var newRow = this.randomNum(0, 100);
- var prop = this.cols[cellNum];
- if (this.rows.length) {
- // let rows = [...this.rows];
- var row = this.rows[rowNum];
- row[prop] = Date.now().toString(); // this.rows[newRow][prop];
- row.updated = Date.now().toString();
- }
- this.start();
- };
- LiveDataComponent.prototype.fetch = function (cb) {
- var req = new XMLHttpRequest();
- req.open('GET', "assets/data/security.json");
- req.onload = function () {
- cb(JSON.parse(req.response));
- };
- req.send();
- };
- LiveDataComponent = __decorate([
- core_1.Component({
- selector: 'live-data-demo',
- template: "\n \n
\n Live Data Demo ( not working ATM )\n \n Start\n Stop\n \n
\n
\n \n \n \n \n \n {{value}}\n \n \n \n \n
Multiple Tables
\n \n \n
\n \n \n \n "
- }),
- __metadata('design:paramtypes', [])
- ], MultipleTablesComponent);
- return MultipleTablesComponent;
-}());
-exports.MultipleTablesComponent = MultipleTablesComponent;
-
-
-/***/ },
-
-/***/ "./demo/basic/row-detail.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var RowDetailsComponent = (function () {
- function RowDetailsComponent() {
- var _this = this;
- this.rows = [];
- this.expanded = {};
- this.fetch(function (data) {
- _this.rows = data;
- });
- }
- RowDetailsComponent.prototype.onPage = function (event) {
- clearTimeout(this.timeout);
- this.timeout = setTimeout(function () {
- console.log('paged!', event);
- }, 100);
- };
- RowDetailsComponent.prototype.fetch = function (cb) {
- var req = new XMLHttpRequest();
- req.open('GET', "assets/data/100k.json");
- req.onload = function () {
- cb(JSON.parse(req.response));
- };
- req.send();
- };
- RowDetailsComponent.prototype.toggleExpandRow = function (row) {
- console.log('Toggled Expand Row!', row);
- this.table.toggleExpandRow(row);
- };
- __decorate([
- core_1.ViewChild('mydatatable'),
- __metadata('design:type', Object)
- ], RowDetailsComponent.prototype, "table", void 0);
- RowDetailsComponent = __decorate([
- core_1.Component({
- selector: 'row-details-demo',
- template: "\n \n
\n
\n \n \n \n
Address
\n
{{row.address.city}}, {{row.address.state}}
\n
\n
Horizontal and Vertical Scrolling
\n \n \n \n \n \n \n \n \n "
- }),
- __metadata('design:paramtypes', [])
- ], HorzVertScrolling);
- return HorzVertScrolling;
-}());
-exports.HorzVertScrolling = HorzVertScrolling;
-
-
-/***/ },
-
-/***/ "./demo/basic/tabs.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var TabsDemoComponent = (function () {
- function TabsDemoComponent() {
- var _this = this;
- this.rows = [];
- this.tab1 = true;
- this.tab2 = false;
- this.tab3 = false;
- this.fetch(function (data) {
- _this.rows = data;
- });
- }
- TabsDemoComponent.prototype.fetch = function (cb) {
- var req = new XMLHttpRequest();
- req.open('GET', "assets/data/100k.json");
- req.onload = function () {
- cb(JSON.parse(req.response));
- };
- req.send();
- };
- TabsDemoComponent = __decorate([
- core_1.Component({
- selector: 'tabs-demo',
- template: "\n \n
Hidden By Default
\n\n
\n
\n \n \n \n
\n\n
\n
Click a button to toggle table visibilities
\n
\n\n
\n
hidden Table
\n \n \n \n \n \n \n\n
\n
ngIf Table
\n \n \n \n \n \n \n
\n\n
\n
Virtual Scrolling with 100k Rows
\n \n \n \n {{value}}\n \n \n \n \n and {{value}}\n \n \n \n \n \n \n "
- }),
- __metadata('design:paramtypes', [])
- ], VirtualScrollComponent);
- return VirtualScrollComponent;
-}());
-exports.VirtualScrollComponent = VirtualScrollComponent;
-
-
-/***/ },
-
-/***/ "./demo/bootstrap.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var platform_browser_dynamic_1 = __webpack_require__(3);
-var hmr_1 = __webpack_require__("./node_modules/@angularclass/hmr/dist/index.js");
-var module_1 = __webpack_require__("./demo/module.ts");
-function main() {
- return platform_browser_dynamic_1.platformBrowserDynamic()
- .bootstrapModule(module_1.AppModule)
- .catch(function (err) { return console.error(err); });
-}
-exports.main = main;
-if (undefined)
- hmr_1.bootloader(main);
-if (!undefined)
- main();
-
-
-/***/ },
-
-/***/ "./demo/columns/column-flex.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var ColumnFlexComponent = (function () {
- function ColumnFlexComponent() {
- var _this = this;
- this.rows = [];
- this.fetch(function (data) {
- _this.rows = data.splice(0, 5);
- });
- }
- ColumnFlexComponent.prototype.fetch = function (cb) {
- var req = new XMLHttpRequest();
- req.open('GET', "assets/data/company.json");
- req.onload = function () {
- cb(JSON.parse(req.response));
- };
- req.send();
- };
- ColumnFlexComponent = __decorate([
- core_1.Component({
- selector: 'column-flex-demo',
- template: "\n \n
Flex Column Width Distribution
\n \n \n \n {{value}}\n \n \n \n \n {{value}}\n \n \n \n \n {{value}}\n \n \n \n \n "
- }),
- __metadata('design:paramtypes', [])
- ], ColumnFlexComponent);
- return ColumnFlexComponent;
-}());
-exports.ColumnFlexComponent = ColumnFlexComponent;
-
-
-/***/ },
-
-/***/ "./demo/columns/column-force.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var ColumnForceComponent = (function () {
- function ColumnForceComponent() {
- var _this = this;
- this.rows = [];
- this.fetch(function (data) {
- _this.rows = data.splice(0, 5);
- });
- }
- ColumnForceComponent.prototype.fetch = function (cb) {
- var req = new XMLHttpRequest();
- req.open('GET', "assets/data/company.json");
- req.onload = function () {
- cb(JSON.parse(req.response));
- };
- req.send();
- };
- ColumnForceComponent = __decorate([
- core_1.Component({
- selector: 'column-force-demo',
- template: "\n \n
Force Fill Column Width Distribution
\n \n \n \n {{value}}\n \n \n \n \n {{value}}\n \n \n \n \n {{value}}\n \n \n \n \n "
- }),
- __metadata('design:paramtypes', [])
- ], ColumnForceComponent);
- return ColumnForceComponent;
-}());
-exports.ColumnForceComponent = ColumnForceComponent;
-
-
-/***/ },
-
-/***/ "./demo/columns/column-standard.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var ColumnStandardComponent = (function () {
- function ColumnStandardComponent() {
- var _this = this;
- this.rows = [];
- this.fetch(function (data) {
- _this.rows = data.splice(0, 5);
- });
- }
- ColumnStandardComponent.prototype.fetch = function (cb) {
- var req = new XMLHttpRequest();
- req.open('GET', "assets/data/company.json");
- req.onload = function () {
- cb(JSON.parse(req.response));
- };
- req.send();
- };
- ColumnStandardComponent = __decorate([
- core_1.Component({
- selector: 'column-standard-demo',
- template: "\n \n
Fixed Column Widths
\n \n \n \n {{value}}\n \n \n \n \n {{value}}\n \n \n \n \n {{value}}\n \n \n \n \n "
- }),
- __metadata('design:paramtypes', [])
- ], ColumnStandardComponent);
- return ColumnStandardComponent;
-}());
-exports.ColumnStandardComponent = ColumnStandardComponent;
-
-
-/***/ },
-
-/***/ "./demo/columns/column-toggle.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var ColumnToggleComponent = (function () {
- function ColumnToggleComponent() {
- this.rows = [
- {
- name: 'Claudine Neal',
- gender: 'female',
- company: 'Sealoud'
- },
- {
- name: 'Beryl Rice',
- gender: 'female',
- company: 'Velity'
- }
- ];
- this.columns = [
- { name: 'Name' },
- { name: 'Gender' },
- { name: 'Company' }
- ];
- this.allColumns = [
- { name: 'Name' },
- { name: 'Gender' },
- { name: 'Company' }
- ];
- }
- ColumnToggleComponent.prototype.toggle = function (col) {
- var isChecked = this.isChecked(col);
- if (isChecked) {
- this.columns = this.columns.filter(function (c) {
- return c.name !== col.name;
- });
- }
- else {
- this.columns = this.columns.concat([col]);
- }
- };
- ColumnToggleComponent.prototype.isChecked = function (col) {
- return this.columns.find(function (c) {
- return c.name === col.name;
- });
- };
- ColumnToggleComponent = __decorate([
- core_1.Component({
- selector: 'column-toggle-demo',
- template: "\n \n
Column Toggling
\n
\n \n \n
\n
\n
Available Columns
\n
\n - \n \n \n
\n
\n
\n
\n
Column Pinning
\n \n \n \n \n \n \n \n \n \n \n \n \n \n "
- }),
- __metadata('design:paramtypes', [])
- ], ColumnPinningComponent);
- return ColumnPinningComponent;
-}());
-exports.ColumnPinningComponent = ColumnPinningComponent;
-
-
-/***/ },
-
-/***/ "./demo/module.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var platform_browser_1 = __webpack_require__(4);
-var hmr_1 = __webpack_require__("./node_modules/@angularclass/hmr/dist/index.js");
-var src_1 = __webpack_require__("./src/index.ts");
-var app_component_1 = __webpack_require__("./demo/app.component.ts");
-__webpack_require__("./src/components/datatable.scss");
-__webpack_require__("./src/themes/material.scss");
-// -- Basic
-var basic_fixed_1 = __webpack_require__("./demo/basic/basic-fixed.ts");
-var basic_auto_1 = __webpack_require__("./demo/basic/basic-auto.ts");
-var virtual_1 = __webpack_require__("./demo/basic/virtual.ts");
-var inline_1 = __webpack_require__("./demo/basic/inline.ts");
-var scrolling_1 = __webpack_require__("./demo/basic/scrolling.ts");
-var multiple_1 = __webpack_require__("./demo/basic/multiple.ts");
-var fullscreen_1 = __webpack_require__("./demo/basic/fullscreen.ts");
-var row_detail_1 = __webpack_require__("./demo/basic/row-detail.ts");
-var filter_1 = __webpack_require__("./demo/basic/filter.ts");
-var tabs_1 = __webpack_require__("./demo/basic/tabs.ts");
-var live_1 = __webpack_require__("./demo/basic/live.ts");
-// -- Paging
-var paging_client_1 = __webpack_require__("./demo/paging/paging-client.ts");
-var paging_server_1 = __webpack_require__("./demo/paging/paging-server.ts");
-// -- Sorting
-var sorting_comparator_1 = __webpack_require__("./demo/sorting/sorting-comparator.ts");
-var sorting_server_1 = __webpack_require__("./demo/sorting/sorting-server.ts");
-var sorting_client_1 = __webpack_require__("./demo/sorting/sorting-client.ts");
-// -- Templates
-var template_dom_1 = __webpack_require__("./demo/templates/template-dom.ts");
-var template_obj_1 = __webpack_require__("./demo/templates/template-obj.ts");
-// -- Selection
-var selection_cell_1 = __webpack_require__("./demo/selection/selection-cell.ts");
-var selection_multi_1 = __webpack_require__("./demo/selection/selection-multi.ts");
-var selection_single_1 = __webpack_require__("./demo/selection/selection-single.ts");
-var selection_shift_1 = __webpack_require__("./demo/selection/selection-shift.ts");
-var selection_disabled_1 = __webpack_require__("./demo/selection/selection-disabled.ts");
-// -- Columns
-var column_toggle_1 = __webpack_require__("./demo/columns/column-toggle.ts");
-var column_standard_1 = __webpack_require__("./demo/columns/column-standard.ts");
-var column_force_1 = __webpack_require__("./demo/columns/column-force.ts");
-var column_flex_1 = __webpack_require__("./demo/columns/column-flex.ts");
-var pinning_1 = __webpack_require__("./demo/columns/pinning.ts");
-var AppModule = (function () {
- function AppModule(appRef) {
- this.appRef = appRef;
- }
- AppModule.prototype.hmrOnDestroy = function (store) {
- var cmpLocation = this.appRef.components.map(function (cmp) { return cmp.location.nativeElement; });
- store.disposeOldHosts = hmr_1.createNewHosts(cmpLocation);
- hmr_1.removeNgStyles();
- };
- AppModule.prototype.hmrAfterDestroy = function (store) {
- store.disposeOldHosts();
- delete store.disposeOldHosts;
- };
- AppModule = __decorate([
- core_1.NgModule({
- declarations: [
- app_component_1.AppComponent,
- basic_auto_1.BasicAutoComponent,
- basic_fixed_1.BasicFixedComponent,
- fullscreen_1.FullScreenComponent,
- inline_1.InlineEditComponent,
- virtual_1.VirtualScrollComponent,
- scrolling_1.HorzVertScrolling,
- multiple_1.MultipleTablesComponent,
- row_detail_1.RowDetailsComponent,
- paging_client_1.ClientPagingComponent,
- paging_server_1.ServerPagingComponent,
- sorting_client_1.ClientSortingComponent,
- sorting_server_1.ServerSortingComponent,
- sorting_comparator_1.SortingComparatorComponent,
- selection_cell_1.CellSelectionComponent,
- selection_multi_1.MultiSelectionComponent,
- template_dom_1.InlineTemplatesComponent,
- template_obj_1.TemplateRefTemplatesComponent,
- column_flex_1.ColumnFlexComponent,
- column_toggle_1.ColumnToggleComponent,
- column_standard_1.ColumnStandardComponent,
- column_force_1.ColumnForceComponent,
- pinning_1.ColumnPinningComponent,
- filter_1.FilterBarComponent,
- tabs_1.TabsDemoComponent,
- selection_single_1.SingleSelectionComponent,
- live_1.LiveDataComponent,
- selection_shift_1.MultiShiftSelectionComponent,
- selection_disabled_1.MultiDisableSelectionComponent
- ],
- imports: [platform_browser_1.BrowserModule, src_1.Angular2DataTableModule],
- bootstrap: [app_component_1.AppComponent]
- }),
- __metadata('design:paramtypes', [core_1.ApplicationRef])
- ], AppModule);
- return AppModule;
-}());
-exports.AppModule = AppModule;
-
-
-/***/ },
-
-/***/ "./demo/paging/paging-client.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var ClientPagingComponent = (function () {
- function ClientPagingComponent() {
- var _this = this;
- this.rows = [];
- this.fetch(function (data) {
- _this.rows = data;
- });
- }
- ClientPagingComponent.prototype.fetch = function (cb) {
- var req = new XMLHttpRequest();
- req.open('GET', "assets/data/company.json");
- req.onload = function () {
- cb(JSON.parse(req.response));
- };
- req.send();
- };
- ClientPagingComponent = __decorate([
- core_1.Component({
- selector: 'client-paging-demo',
- template: "\n \n
Client-side Paging
\n \n \n \n "
- }),
- __metadata('design:paramtypes', [])
- ], ClientPagingComponent);
- return ClientPagingComponent;
-}());
-exports.ClientPagingComponent = ClientPagingComponent;
-
-
-/***/ },
-
-/***/ "./demo/paging/paging-server.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var ServerPagingComponent = (function () {
- function ServerPagingComponent() {
- this.rows = [];
- this.count = 0;
- this.offset = 0;
- this.limit = 10;
- }
- ServerPagingComponent.prototype.ngOnInit = function () {
- this.page(this.offset, this.limit);
- };
- ServerPagingComponent.prototype.page = function (offset, limit) {
- var _this = this;
- this.fetch(function (results) {
- _this.count = results.length;
- var start = offset * limit;
- var end = start + limit;
- var rows = _this.rows.slice();
- for (var i = start; i < end; i++) {
- rows[i] = results[i];
- }
- _this.rows = rows;
- console.log('Page Results', start, end, rows);
- });
- };
- ServerPagingComponent.prototype.fetch = function (cb) {
- var req = new XMLHttpRequest();
- req.open('GET', "assets/data/company.json");
- req.onload = function () {
- cb(JSON.parse(req.response));
- };
- req.send();
- };
- ServerPagingComponent.prototype.onPage = function (event) {
- console.log('Page Event', event);
- this.page(event.offset, event.limit);
- };
- ServerPagingComponent = __decorate([
- core_1.Component({
- selector: 'server-paging-demo',
- template: "\n \n
Server-side Paging
\n \n \n \n "
- }),
- __metadata('design:paramtypes', [])
- ], ServerPagingComponent);
- return ServerPagingComponent;
-}());
-exports.ServerPagingComponent = ServerPagingComponent;
-
-
-/***/ },
-
-/***/ "./demo/selection/selection-cell.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var CellSelectionComponent = (function () {
- function CellSelectionComponent() {
- var _this = this;
- this.rows = [];
- this.selected = [];
- this.columns = [
- { prop: 'name' },
- { name: 'Company' },
- { name: 'Gender' }
- ];
- this.fetch(function (data) {
- _this.rows = data;
- });
- }
- CellSelectionComponent.prototype.fetch = function (cb) {
- var req = new XMLHttpRequest();
- req.open('GET', "assets/data/company.json");
- req.onload = function () {
- cb(JSON.parse(req.response));
- };
- req.send();
- };
- CellSelectionComponent.prototype.onSelect = function (event) {
- console.log('Event: select', event, this.selected);
- };
- CellSelectionComponent.prototype.onActivate = function (event) {
- console.log('Event: activate', event);
- };
- CellSelectionComponent = __decorate([
- core_1.Component({
- selector: 'cell-selection-demo',
- template: "\n \n
Cell Selection
\n \n \n \n "
- }),
- __metadata('design:paramtypes', [])
- ], CellSelectionComponent);
- return CellSelectionComponent;
-}());
-exports.CellSelectionComponent = CellSelectionComponent;
-
-
-/***/ },
-
-/***/ "./demo/selection/selection-disabled.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var MultiDisableSelectionComponent = (function () {
- function MultiDisableSelectionComponent() {
- var _this = this;
- this.rows = [];
- this.selected = [];
- this.columns = [
- { prop: 'name' },
- { name: 'Company' },
- { name: 'Gender' }
- ];
- this.fetch(function (data) {
- _this.rows = data;
- });
- }
- MultiDisableSelectionComponent.prototype.fetch = function (cb) {
- var req = new XMLHttpRequest();
- req.open('GET', "assets/data/company.json");
- req.onload = function () {
- cb(JSON.parse(req.response));
- };
- req.send();
- };
- MultiDisableSelectionComponent.prototype.onSelect = function (_a) {
- var selected = _a.selected;
- console.log('Select Event', selected, this.selected);
- this.selected.splice(0, this.selected.length);
- (_b = this.selected).push.apply(_b, selected);
- var _b;
- };
- MultiDisableSelectionComponent.prototype.onActivate = function (event) {
- console.log('Activate Event', event);
- };
- MultiDisableSelectionComponent.prototype.checkSelectable = function (event) {
- console.log('Checking if selectable', event);
- return event.name !== 'Ethel Price';
- };
- MultiDisableSelectionComponent = __decorate([
- core_1.Component({
- selector: 'multidisable-selection-demo',
- template: "\n \n
Selection Callback to Disable Selections
\n
\n \n \n
\n\n
\n
Selections
\n
\n - \n {{sel.name}}\n
\n - No Selections
\n
\n
\n
\n
Multi Select via Click
\n
\n \n \n
\n\n
\n
Selections
\n
\n - \n {{sel.name}}\n
\n - No Selections
\n
\n
\n
\n
Multi Select via Shift
\n
\n \n \n
\n\n
\n
Selections
\n
\n - \n {{sel.name}}\n
\n - No Selections
\n
\n
\n
\n
Single Row Selection
\n
\n \n \n
\n\n
\n
Selections
\n
\n - \n {{sel.name}}\n
\n - No Selections
\n
\n
\n
\n
Client-side Sorting
\n \n \n \n "
- }),
- __metadata('design:paramtypes', [])
- ], ClientSortingComponent);
- return ClientSortingComponent;
-}());
-exports.ClientSortingComponent = ClientSortingComponent;
-
-
-/***/ },
-
-/***/ "./demo/sorting/sorting-comparator.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var SortingComparatorComponent = (function () {
- function SortingComparatorComponent() {
- var _this = this;
- this.rows = [];
- this.columns = [
- { name: 'Company', comparator: this.companyComparator.bind(this) },
- { name: 'Name', sortable: false },
- { name: 'Gender', sortable: false }
- ];
- this.fetch(function (data) {
- _this.rows = data;
- });
- }
- SortingComparatorComponent.prototype.fetch = function (cb) {
- var req = new XMLHttpRequest();
- req.open('GET', "assets/data/company.json");
- req.onload = function () {
- var data = JSON.parse(req.response);
- cb(data.splice(0, 20));
- };
- req.send();
- };
- SortingComparatorComponent.prototype.companyComparator = function (propA, propB) {
- console.log('Sorting Comparator', propA, propB);
- // Just a simple sort function comparisoins
- if (propA.toLowerCase() < propB.toLowerCase())
- return -1;
- if (propA.toLowerCase() > propB.toLowerCase())
- return 1;
- };
- SortingComparatorComponent = __decorate([
- core_1.Component({
- selector: 'comparator-sorting-demo',
- template: "\n \n
Custom Sorting Comparator
\n \n \n \n "
- }),
- __metadata('design:paramtypes', [])
- ], SortingComparatorComponent);
- return SortingComparatorComponent;
-}());
-exports.SortingComparatorComponent = SortingComparatorComponent;
-
-
-/***/ },
-
-/***/ "./demo/sorting/sorting-server.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var ServerSortingComponent = (function () {
- function ServerSortingComponent() {
- var _this = this;
- this.loading = false;
- this.rows = [];
- this.columns = [
- // we pass false to bypass the default
- // comparator function and use the event to sort
- { name: 'Company', sortable: true },
- { name: 'Name', sortable: true },
- { name: 'Gender', sortable: true }
- ];
- this.fetch(function (data) {
- _this.rows = data;
- });
- }
- ServerSortingComponent.prototype.fetch = function (cb) {
- var req = new XMLHttpRequest();
- req.open('GET', "assets/data/company.json");
- req.onload = function () {
- var data = JSON.parse(req.response);
- cb(data.splice(0, 20));
- };
- req.send();
- };
- ServerSortingComponent.prototype.onSort = function (event) {
- var _this = this;
- // event was triggered, start sort sequence
- console.log('Sort Event', event);
- this.loading = true;
- // emulate a server request with a timeout
- setTimeout(function () {
- var rows = _this.rows.slice();
- // this is only for demo purposes, normally
- // your server would return the result for
- // you and you would just set the rows prop
- var sort = event.sorts[0];
- rows.sort(function (a, b) {
- return a[sort.prop].localeCompare(b[sort.prop]) * (sort.dir === 'desc' ? -1 : 1);
- });
- _this.rows = rows;
- _this.loading = false;
- }, 1000);
- };
- ServerSortingComponent = __decorate([
- core_1.Component({
- selector: 'server-sorting-demo',
- template: "\n \n
Server-side Sorting
\n \n \n \n "
- }),
- __metadata('design:paramtypes', [])
- ], ServerSortingComponent);
- return ServerSortingComponent;
-}());
-exports.ServerSortingComponent = ServerSortingComponent;
-
-
-/***/ },
-
-/***/ "./demo/templates/template-dom.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var InlineTemplatesComponent = (function () {
- function InlineTemplatesComponent() {
- var _this = this;
- this.rows = [];
- this.joke = 'knock knock';
- this.fetch(function (data) {
- _this.rows = data.splice(0, 5);
- });
- }
- InlineTemplatesComponent.prototype.fetch = function (cb) {
- var req = new XMLHttpRequest();
- req.open('GET', "assets/data/company.json");
- req.onload = function () {
- cb(JSON.parse(req.response));
- };
- req.send();
- };
- InlineTemplatesComponent = __decorate([
- core_1.Component({
- selector: 'inline-templates-demo',
- template: "\n \n
Expressive Templates
\n
\n \n \n Holla! {{column.name}}\n \n \n Hi: {{value}}\n \n \n \n \n My name is: and {{value}}\n {{joke}}
\n \n \n \n \n \n \n \n \n \n
TemplateRef via Column Property
\n
\n \n\n \n Fancy: {{column.name}} !!\n \n\n \n \n \n \n \n \n \n \n \n
\n ",
- changeDetection: core_1.ChangeDetectionStrategy.OnPush
- }),
- __metadata('design:paramtypes', [core_1.ElementRef, core_1.Renderer])
- ], DataTableBodyCellComponent);
- return DataTableBodyCellComponent;
-}());
-exports.DataTableBodyCellComponent = DataTableBodyCellComponent;
-
-
-/***/ },
-
-/***/ "./src/components/body/body-row-wrapper.component.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var DataTableRowWrapperComponent = (function () {
- function DataTableRowWrapperComponent(element, renderer) {
- this.expanded = false;
- renderer.setElementClass(element.nativeElement, 'datatable-row-wrapper', true);
- }
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableRowWrapperComponent.prototype, "rowDetailTemplate", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableRowWrapperComponent.prototype, "detailRowHeight", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Boolean)
- ], DataTableRowWrapperComponent.prototype, "expanded", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableRowWrapperComponent.prototype, "row", void 0);
- DataTableRowWrapperComponent = __decorate([
- core_1.Component({
- selector: 'datatable-row-wrapper',
- template: "\n \n \n \n \n
\n ",
- changeDetection: core_1.ChangeDetectionStrategy.OnPush
- }),
- __metadata('design:paramtypes', [core_1.ElementRef, core_1.Renderer])
- ], DataTableRowWrapperComponent);
- return DataTableRowWrapperComponent;
-}());
-exports.DataTableRowWrapperComponent = DataTableRowWrapperComponent;
-
-
-/***/ },
-
-/***/ "./src/components/body/body-row.component.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var utils_1 = __webpack_require__("./src/utils/index.ts");
-var DataTableBodyRowComponent = (function () {
- function DataTableBodyRowComponent(element, renderer) {
- this.activate = new core_1.EventEmitter();
- this.element = element.nativeElement;
- renderer.setElementClass(this.element, 'datatable-body-row', true);
- }
- Object.defineProperty(DataTableBodyRowComponent.prototype, "columns", {
- get: function () {
- return this._columns;
- },
- set: function (val) {
- this._columns = val;
- this.recalculateColumns(val);
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableBodyRowComponent.prototype, "innerWidth", {
- get: function () {
- return this._innerWidth;
- },
- set: function (val) {
- this._innerWidth = val;
- this.recalculateColumns();
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableBodyRowComponent.prototype, "isEvenRow", {
- get: function () {
- return this.row.$$index % 2 === 0;
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableBodyRowComponent.prototype, "isOddRow", {
- get: function () {
- return this.row.$$index % 2 !== 0;
- },
- enumerable: true,
- configurable: true
- });
- DataTableBodyRowComponent.prototype.stylesByGroup = function (group) {
- var widths = this.columnGroupWidths;
- var offsetX = this.offsetX;
- var styles = {
- width: widths[group] + "px"
- };
- if (group === 'left') {
- utils_1.translateXY(styles, offsetX, 0);
- }
- else if (group === 'right') {
- var bodyWidth = parseInt(this.innerWidth + '', 0);
- var totalDiff = widths.total - bodyWidth;
- var offsetDiff = totalDiff - offsetX;
- var offset = (offsetDiff + utils_1.scrollbarWidth) * -1;
- utils_1.translateXY(styles, offset, 0);
- }
- return styles;
- };
- DataTableBodyRowComponent.prototype.onActivate = function (event, index) {
- event.cellIndex = index;
- event.rowElement = this.element;
- this.activate.emit(event);
- };
- DataTableBodyRowComponent.prototype.onKeyDown = function (event) {
- var keyCode = event.keyCode;
- var isTargetRow = event.target === this.element;
- var isAction = keyCode === utils_1.Keys.return ||
- keyCode === utils_1.Keys.down ||
- keyCode === utils_1.Keys.up ||
- keyCode === utils_1.Keys.left ||
- keyCode === utils_1.Keys.right;
- if (isAction && isTargetRow) {
- event.preventDefault();
- event.stopPropagation();
- this.activate.emit({
- type: 'keydown',
- event: event,
- row: this.row,
- rowElement: this.element
- });
- }
- };
- DataTableBodyRowComponent.prototype.recalculateColumns = function (val) {
- if (val === void 0) { val = this.columns; }
- var colsByPin = utils_1.columnsByPin(val);
- this.columnsByPin = utils_1.columnsByPinArr(val);
- this.columnGroupWidths = utils_1.columnGroupWidths(colsByPin, val);
- };
- __decorate([
- core_1.Input(),
- __metadata('design:type', Array),
- __metadata('design:paramtypes', [Array])
- ], DataTableBodyRowComponent.prototype, "columns", null);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number),
- __metadata('design:paramtypes', [Number])
- ], DataTableBodyRowComponent.prototype, "innerWidth", null);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableBodyRowComponent.prototype, "row", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DataTableBodyRowComponent.prototype, "offsetX", void 0);
- __decorate([
- core_1.HostBinding('style.height.px'),
- core_1.Input(),
- __metadata('design:type', Number)
- ], DataTableBodyRowComponent.prototype, "rowHeight", void 0);
- __decorate([
- core_1.HostBinding('class.active'),
- core_1.Input(),
- __metadata('design:type', Boolean)
- ], DataTableBodyRowComponent.prototype, "isSelected", void 0);
- __decorate([
- core_1.HostBinding('class.datatable-row-even'),
- __metadata('design:type', Boolean)
- ], DataTableBodyRowComponent.prototype, "isEvenRow", null);
- __decorate([
- core_1.HostBinding('class.datatable-row-odd'),
- __metadata('design:type', Boolean)
- ], DataTableBodyRowComponent.prototype, "isOddRow", null);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DataTableBodyRowComponent.prototype, "activate", void 0);
- __decorate([
- core_1.HostListener('keydown', ['$event']),
- __metadata('design:type', Function),
- __metadata('design:paramtypes', [Object]),
- __metadata('design:returntype', void 0)
- ], DataTableBodyRowComponent.prototype, "onKeyDown", null);
- DataTableBodyRowComponent = __decorate([
- core_1.Component({
- selector: 'datatable-body-row',
- template: "\n \n \n \n \n ",
- changeDetection: core_1.ChangeDetectionStrategy.OnPush
- }),
- __metadata('design:paramtypes', [core_1.ElementRef, core_1.Renderer])
- ], DataTableBodyRowComponent);
- return DataTableBodyRowComponent;
-}());
-exports.DataTableBodyRowComponent = DataTableBodyRowComponent;
-
-
-/***/ },
-
-/***/ "./src/components/body/body.component.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var utils_1 = __webpack_require__("./src/utils/index.ts");
-var types_1 = __webpack_require__("./src/types/index.ts");
-var scroller_component_1 = __webpack_require__("./src/components/body/scroller.component.ts");
-var DataTableBodyComponent = (function () {
- function DataTableBodyComponent(element, renderer) {
- this.selected = [];
- this.scroll = new core_1.EventEmitter();
- this.page = new core_1.EventEmitter();
- this.activate = new core_1.EventEmitter();
- this.select = new core_1.EventEmitter();
- this.detailToggle = new core_1.EventEmitter();
- this.rowHeightsCache = new utils_1.RowHeightCache();
- this.temp = [];
- this.offsetY = 0;
- this.indexes = {};
- renderer.setElementClass(element.nativeElement, 'datatable-body', true);
- // declare fn here so we can get access to the `this` property
- this.rowTrackingFn = function (index, row) {
- if (this.trackByProp) {
- return row.$$index + "-" + this.trackByProp;
- }
- else {
- return row.$$index;
- }
- }.bind(this);
- }
- Object.defineProperty(DataTableBodyComponent.prototype, "pageSize", {
- get: function () {
- return this._pageSize;
- },
- set: function (val) {
- this._pageSize = val;
- this.recalcLayout();
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableBodyComponent.prototype, "rows", {
- get: function () {
- return this._rows;
- },
- set: function (val) {
- this._rows = val;
- this.recalcLayout();
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableBodyComponent.prototype, "columns", {
- get: function () {
- return this._columns;
- },
- set: function (val) {
- this._columns = val;
- var colsByPin = utils_1.columnsByPin(val);
- this.columnGroupWidths = utils_1.columnGroupWidths(colsByPin, val);
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableBodyComponent.prototype, "offset", {
- get: function () {
- return this._offset;
- },
- set: function (val) {
- this._offset = val;
- this.recalcLayout();
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableBodyComponent.prototype, "rowCount", {
- get: function () {
- return this._rowCount;
- },
- set: function (val) {
- this._rowCount = val;
- this.recalcLayout();
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableBodyComponent.prototype, "bodyWidth", {
- get: function () {
- if (this.scrollbarH) {
- return this.innerWidth + 'px';
- }
- else {
- return '100%';
- }
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableBodyComponent.prototype, "bodyHeight", {
- get: function () {
- return this._bodyHeight;
- },
- set: function (val) {
- if (this.scrollbarV) {
- this._bodyHeight = val + 'px';
- }
- else {
- this._bodyHeight = 'auto';
- }
- this.recalcLayout();
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableBodyComponent.prototype, "selectEnabled", {
- get: function () {
- return !!this.selectionType;
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableBodyComponent.prototype, "scrollHeight", {
- /**
- * Property that would calculate the height of scroll bar
- * based on the row heights cache for virtual scroll. Other scenarios
- * calculate scroll height automatically (as height will be undefined).
- */
- get: function () {
- if (this.scrollbarV) {
- return this.rowHeightsCache.query(this.rowCount - 1);
- }
- },
- enumerable: true,
- configurable: true
- });
- DataTableBodyComponent.prototype.updateOffsetY = function (offset) {
- if (this.scrollbarV && offset) {
- // First get the row Index that we need to move to.
- var rowIndex = this.pageSize * offset;
- offset = this.rowHeightsCache.query(rowIndex - 1);
- }
- this.scroller.setOffset(offset || 0);
- };
- DataTableBodyComponent.prototype.onBodyScroll = function (_a) {
- var scrollYPos = _a.scrollYPos, scrollXPos = _a.scrollXPos, direction = _a.direction;
- // if scroll change, trigger update
- // this is mainly used for header cell positions
- if (this.offsetY !== scrollYPos || this.offsetX !== scrollXPos) {
- this.scroll.emit({
- offsetY: scrollYPos,
- offsetX: scrollXPos
- });
- }
- this.offsetY = scrollYPos;
- this.offsetX = scrollXPos;
- this.updateIndexes();
- this.updatePage(direction);
- this.updateRows();
- };
- DataTableBodyComponent.prototype.updatePage = function (direction) {
- var offset = this.indexes.first / this.pageSize;
- if (direction === 'up') {
- offset = Math.floor(offset);
- }
- else if (direction === 'down') {
- offset = Math.ceil(offset);
- }
- if (direction !== undefined && !isNaN(offset)) {
- this.page.emit({ offset: offset });
- }
- };
- DataTableBodyComponent.prototype.updateRows = function () {
- var _a = this.indexes, first = _a.first, last = _a.last;
- var rowIndex = first;
- var idx = 0;
- var temp = [];
- while (rowIndex < last && rowIndex < this.rowCount) {
- var row = this.rows[rowIndex];
- if (row) {
- row.$$index = rowIndex;
- temp[idx] = row;
- }
- idx++;
- rowIndex++;
- }
- this.temp = temp;
- };
- /**
- * Calculate row height based on the expanded state of the row.
- *
- * @param row the row for which the height need to be calculated.
- * @returns {number} height of the row.
- */
- DataTableBodyComponent.prototype.getRowHeight = function (row) {
- // Adding detail row height if its expanded.
- return this.rowHeight +
- (row.$$expanded === 1 ? this.detailRowHeight : 0);
- };
- /**
- * Calculates the styles for the row so that the rows can be moved in 2D space
- * during virtual scroll inside the DOM. In the below case the Y position is
- * manipulated. As an example, if the height of row 0 is 30 px and row 1 is
- * 100 px then following styles are generated:
- *
- * transform: translate3d(0px, 0px, 0px); -> row0
- * transform: translate3d(0px, 30px, 0px); -> row1
- * transform: translate3d(0px, 130px, 0px); -> row2
- *
- * Row heights have to be calculated based on the row heights cache as we wont
- * be able to determine which row is of what height before hand. In the above
- * case the positionY of the translate3d for row2 would be the sum of all the
- * heights of the rows before it (i.e. row0 and row1).
- *
- * @param row The row that needs to be placed in the 2D space.
- * @returns {{styles: string}} Returns the CSS3 style to be applied
- */
- DataTableBodyComponent.prototype.getRowsStyles = function (row) {
- var rowHeight = this.getRowHeight(row);
- var styles = {
- height: rowHeight + 'px'
- };
- if (this.scrollbarV) {
- var idx = row ? row.$$index : 0;
- // const pos = idx * rowHeight;
- // The position of this row would be the sum of all row heights
- // until the previous row position.
- var pos = this.rowHeightsCache.query(idx - 1);
- utils_1.translateXY(styles, 0, pos);
- }
- return styles;
- };
- DataTableBodyComponent.prototype.hideIndicator = function () {
- var _this = this;
- setTimeout(function () { return _this.loadingIndicator = false; }, 500);
- };
- DataTableBodyComponent.prototype.updateIndexes = function () {
- var first = 0;
- var last = 0;
- if (this.scrollbarV) {
- // Calculation of the first and last indexes will be based on where the
- // scrollY position would be at. The last index would be the one
- // that shows up inside the view port the last.
- var height = parseInt(this.bodyHeight, 0);
- first = this.rowHeightsCache.getRowIndex(this.offsetY);
- last = this.rowHeightsCache.getRowIndex(height + this.offsetY) + 1;
- }
- else {
- first = Math.max(this.offset * this.pageSize, 0);
- last = Math.min((first + this.pageSize), this.rowCount);
- }
- this.indexes = { first: first, last: last };
- };
- /**
- * Refreshes the full Row Height cache. Should be used
- * when the entire row array state has changed.
- */
- DataTableBodyComponent.prototype.refreshRowHeightCache = function () {
- if (!this.scrollbarV)
- return;
- // clear the previous row height cache if already present.
- // this is useful during sorts, filters where the state of the
- // rows array is changed.
- this.rowHeightsCache.clearCache();
- // Initialize the tree only if there are rows inside the tree.
- if (this.rows && this.rows.length) {
- this.rowHeightsCache.initCache(this.rows, this.rowHeight, this.detailRowHeight);
- }
- };
- DataTableBodyComponent.prototype.getAdjustedViewPortIndex = function () {
- // Capture the row index of the first row that is visible on the viewport.
- // If the scroll bar is just below the row which is highlighted then make that as the
- // first index.
- var viewPortFirstRowIndex = this.indexes.first;
- if (this.scrollbarV) {
- var offsetScroll = this.rowHeightsCache.query(viewPortFirstRowIndex - 1);
- return offsetScroll <= this.offsetY ? viewPortFirstRowIndex - 1 : viewPortFirstRowIndex;
- }
- return viewPortFirstRowIndex;
- };
- /**
- * Toggle the Expansion of the row i.e. if the row is expanded then it will
- * collapse and vice versa. Note that the expanded status is stored as
- * a part of the row object itself as we have to preserve the expanded row
- * status in case of sorting and filtering of the row set.
- *
- * @param row The row for which the expansion needs to be toggled.
- */
- DataTableBodyComponent.prototype.toggleRowExpansion = function (row) {
- // Capture the row index of the first row that is visible on the viewport.
- var viewPortFirstRowIndex = this.getAdjustedViewPortIndex();
- // If the detailRowHeight is auto --> only in case of non-virtualized scroll
- if (this.scrollbarV) {
- var detailRowHeight = this.detailRowHeight * (row.$$expanded ? -1 : 1);
- this.rowHeightsCache.update(row.$$index, detailRowHeight);
- }
- // Update the toggled row and update the heights in the cache.
- row.$$expanded ^= 1;
- this.detailToggle.emit({
- rows: [row],
- currentIndex: viewPortFirstRowIndex
- });
- };
- /**
- * Expand/Collapse all the rows no matter what their state is.
- * @param expanded When true, all rows are expanded and when false, all rows will be collapsed.
- */
- DataTableBodyComponent.prototype.toggleAllRows = function (expanded) {
- var rowExpanded = expanded ? 1 : 0;
- // Capture the row index of the first row that is visible on the viewport.
- var viewPortFirstRowIndex = this.getAdjustedViewPortIndex();
- for (var _i = 0, _a = this.rows; _i < _a.length; _i++) {
- var row = _a[_i];
- row.$$expanded = rowExpanded;
- }
- if (this.scrollbarV) {
- // Refresh the full row heights cache since every row was affected.
- this.refreshRowHeightCache();
- }
- // Emit all rows that have been expanded.
- this.detailToggle.emit({
- rows: this.rows,
- currentIndex: viewPortFirstRowIndex
- });
- };
- DataTableBodyComponent.prototype.recalcLayout = function () {
- this.refreshRowHeightCache();
- this.updateIndexes();
- this.updateRows();
- };
- __decorate([
- core_1.Input(),
- __metadata('design:type', Boolean)
- ], DataTableBodyComponent.prototype, "scrollbarV", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Boolean)
- ], DataTableBodyComponent.prototype, "scrollbarH", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Boolean)
- ], DataTableBodyComponent.prototype, "loadingIndicator", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DataTableBodyComponent.prototype, "rowHeight", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DataTableBodyComponent.prototype, "offsetX", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableBodyComponent.prototype, "detailRowHeight", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', String)
- ], DataTableBodyComponent.prototype, "emptyMessage", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DataTableBodyComponent.prototype, "selectionType", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Array)
- ], DataTableBodyComponent.prototype, "selected", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableBodyComponent.prototype, "rowIdentity", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableBodyComponent.prototype, "rowDetailTemplate", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableBodyComponent.prototype, "selectCheck", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', String)
- ], DataTableBodyComponent.prototype, "trackByProp", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number),
- __metadata('design:paramtypes', [Number])
- ], DataTableBodyComponent.prototype, "pageSize", null);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Array),
- __metadata('design:paramtypes', [Array])
- ], DataTableBodyComponent.prototype, "rows", null);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Array),
- __metadata('design:paramtypes', [Array])
- ], DataTableBodyComponent.prototype, "columns", null);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number),
- __metadata('design:paramtypes', [Number])
- ], DataTableBodyComponent.prototype, "offset", null);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number),
- __metadata('design:paramtypes', [Number])
- ], DataTableBodyComponent.prototype, "rowCount", null);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DataTableBodyComponent.prototype, "innerWidth", void 0);
- __decorate([
- core_1.HostBinding('style.width'),
- __metadata('design:type', String)
- ], DataTableBodyComponent.prototype, "bodyWidth", null);
- __decorate([
- core_1.Input(),
- core_1.HostBinding('style.height'),
- __metadata('design:type', Object),
- __metadata('design:paramtypes', [Object])
- ], DataTableBodyComponent.prototype, "bodyHeight", null);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DataTableBodyComponent.prototype, "scroll", void 0);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DataTableBodyComponent.prototype, "page", void 0);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DataTableBodyComponent.prototype, "activate", void 0);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DataTableBodyComponent.prototype, "select", void 0);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DataTableBodyComponent.prototype, "detailToggle", void 0);
- __decorate([
- core_1.ViewChild(scroller_component_1.ScrollerComponent),
- __metadata('design:type', scroller_component_1.ScrollerComponent)
- ], DataTableBodyComponent.prototype, "scroller", void 0);
- DataTableBodyComponent = __decorate([
- core_1.Component({
- selector: 'datatable-body',
- template: "\n \n \n \n \n \n \n \n \n \n \n \n \n ",
- changeDetection: core_1.ChangeDetectionStrategy.OnPush
- }),
- __metadata('design:paramtypes', [core_1.ElementRef, core_1.Renderer])
- ], DataTableBodyComponent);
- return DataTableBodyComponent;
-}());
-exports.DataTableBodyComponent = DataTableBodyComponent;
-
-
-/***/ },
-
-/***/ "./src/components/body/index.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-function __export(m) {
- for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
-}
-__export(__webpack_require__("./src/components/body/body.component.ts"));
-__export(__webpack_require__("./src/components/body/body-cell.component.ts"));
-__export(__webpack_require__("./src/components/body/body-row.component.ts"));
-__export(__webpack_require__("./src/components/body/progress-bar.component.ts"));
-__export(__webpack_require__("./src/components/body/scroller.component.ts"));
-__export(__webpack_require__("./src/components/body/body-row-wrapper.component.ts"));
-__export(__webpack_require__("./src/components/body/selection.component.ts"));
-
-
-/***/ },
-
-/***/ "./src/components/body/progress-bar.component.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var ProgressBarComponent = (function () {
- function ProgressBarComponent() {
- }
- ProgressBarComponent = __decorate([
- core_1.Component({
- selector: 'datatable-progress',
- template: "\n \n ",
- changeDetection: core_1.ChangeDetectionStrategy.OnPush
- }),
- __metadata('design:paramtypes', [])
- ], ProgressBarComponent);
- return ProgressBarComponent;
-}());
-exports.ProgressBarComponent = ProgressBarComponent;
-
-
-/***/ },
-
-/***/ "./src/components/body/scroller.component.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var ScrollerComponent = (function () {
- function ScrollerComponent(element) {
- this.scrollbarV = false;
- this.scrollbarH = false;
- this.scroll = new core_1.EventEmitter();
- this.scrollYPos = 0;
- this.scrollXPos = 0;
- this.prevScrollYPos = 0;
- this.prevScrollXPos = 0;
- this.element = element.nativeElement;
- this.element.classList.add('datatable-scroll');
- }
- ScrollerComponent.prototype.ngOnInit = function () {
- // manual bind so we don't always listen
- if (this.scrollbarV || this.scrollbarH) {
- this.parentElement = this.element.parentElement.parentElement;
- this.parentElement.addEventListener('scroll', this.onScrolled.bind(this));
- }
- };
- ScrollerComponent.prototype.ngOnDestroy = function () {
- if (this.scrollbarV || this.scrollbarH) {
- this.parentElement.removeEventListener('scroll');
- }
- };
- ScrollerComponent.prototype.setOffset = function (offsetY) {
- if (this.parentElement) {
- this.parentElement.scrollTop = offsetY;
- }
- };
- ScrollerComponent.prototype.onScrolled = function (event) {
- var dom = event.currentTarget;
- this.scrollYPos = dom.scrollTop;
- this.scrollXPos = dom.scrollLeft;
- requestAnimationFrame(this.updateOffset.bind(this));
- };
- ScrollerComponent.prototype.updateOffset = function () {
- var direction;
- if (this.scrollYPos < this.prevScrollYPos) {
- direction = 'down';
- }
- else if (this.scrollYPos > this.prevScrollYPos) {
- direction = 'up';
- }
- this.scroll.emit({
- direction: direction,
- scrollYPos: this.scrollYPos,
- scrollXPos: this.scrollXPos
- });
- this.prevScrollYPos = this.scrollYPos;
- this.prevScrollXPos = this.scrollXPos;
- };
- __decorate([
- core_1.Input(),
- __metadata('design:type', Boolean)
- ], ScrollerComponent.prototype, "scrollbarV", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Boolean)
- ], ScrollerComponent.prototype, "scrollbarH", void 0);
- __decorate([
- core_1.HostBinding('style.height.px'),
- core_1.Input(),
- __metadata('design:type', Number)
- ], ScrollerComponent.prototype, "scrollHeight", void 0);
- __decorate([
- core_1.HostBinding('style.width.px'),
- core_1.Input(),
- __metadata('design:type', Number)
- ], ScrollerComponent.prototype, "scrollWidth", void 0);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], ScrollerComponent.prototype, "scroll", void 0);
- ScrollerComponent = __decorate([
- core_1.Component({
- selector: 'datatable-scroller',
- template: "\n \n ",
- changeDetection: core_1.ChangeDetectionStrategy.OnPush
- }),
- __metadata('design:paramtypes', [core_1.ElementRef])
- ], ScrollerComponent);
- return ScrollerComponent;
-}());
-exports.ScrollerComponent = ScrollerComponent;
-
-
-/***/ },
-
-/***/ "./src/components/body/selection.component.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var utils_1 = __webpack_require__("./src/utils/index.ts");
-var types_1 = __webpack_require__("./src/types/index.ts");
-var DataTableSelectionComponent = (function () {
- function DataTableSelectionComponent() {
- this.activate = new core_1.EventEmitter();
- this.select = new core_1.EventEmitter();
- }
- DataTableSelectionComponent.prototype.selectRow = function (event, index, row) {
- if (!this.selectEnabled)
- return;
- var multiShift = this.selectionType === types_1.SelectionType.multiShift;
- var multiClick = this.selectionType === types_1.SelectionType.multi;
- var selected = [];
- if (multiShift || multiClick) {
- if (multiShift && event.shiftKey) {
- var newSelected = this.selected.slice();
- selected = utils_1.selectRowsBetween(newSelected, this.rows, index, this.prevIndex, this.getRowSelectedIdx.bind(this));
- }
- else if (multiShift && !event.shiftKey) {
- selected.push(row);
- }
- else {
- var newSelected = this.selected.slice();
- selected = utils_1.selectRows(newSelected, row, this.getRowSelectedIdx.bind(this));
- }
- }
- else {
- selected.push(row);
- }
- if (this.selectCheck) {
- selected = selected.filter(this.selectCheck.bind(this));
- }
- this.selected = selected;
- this.prevIndex = index;
- this.select.emit({
- selected: selected
- });
- };
- DataTableSelectionComponent.prototype.onActivate = function (model, index) {
- var type = model.type, event = model.event, row = model.row;
- if (type === 'click' || type === 'dblclick') {
- this.selectRow(event, index, row);
- }
- else if (type === 'keydown') {
- if (event.keyCode === utils_1.Keys.return) {
- this.selectRow(event, index, row);
- }
- else {
- this.onKeyboardFocus(model);
- }
- }
- this.activate.emit(model);
- };
- DataTableSelectionComponent.prototype.onKeyboardFocus = function (model) {
- var keyCode = model.event.keyCode;
- var shouldFocus = keyCode === utils_1.Keys.up ||
- keyCode === utils_1.Keys.down ||
- keyCode === utils_1.Keys.right ||
- keyCode === utils_1.Keys.left;
- if (shouldFocus) {
- var isCellSelection = this.selectionType === types_1.SelectionType.cell;
- if (!model.cellElement || !isCellSelection) {
- this.focusRow(model.rowElement, keyCode);
- }
- else if (isCellSelection) {
- this.focusCell(model.cellElement, model.rowElement, keyCode, model.cellIndex);
- }
- }
- };
- DataTableSelectionComponent.prototype.focusRow = function (rowElement, keyCode) {
- var nextRowElement = this.getPrevNextRow(rowElement, keyCode);
- if (nextRowElement)
- nextRowElement.focus();
- };
- DataTableSelectionComponent.prototype.getPrevNextRow = function (rowElement, keyCode) {
- var parentElement = rowElement.parentElement;
- if (parentElement) {
- var focusElement = void 0;
- if (keyCode === utils_1.Keys.up) {
- focusElement = parentElement.previousElementSibling;
- }
- else if (keyCode === utils_1.Keys.down) {
- focusElement = parentElement.nextElementSibling;
- }
- if (focusElement && focusElement.children.length) {
- return focusElement.children[0];
- }
- }
- };
- DataTableSelectionComponent.prototype.focusCell = function (cellElement, rowElement, keyCode, cellIndex) {
- var nextCellElement;
- if (keyCode === utils_1.Keys.left) {
- nextCellElement = cellElement.previousElementSibling;
- }
- else if (keyCode === utils_1.Keys.right) {
- nextCellElement = cellElement.nextElementSibling;
- }
- else if (keyCode === utils_1.Keys.up || keyCode === utils_1.Keys.down) {
- var nextRowElement = this.getPrevNextRow(rowElement, keyCode);
- if (nextRowElement) {
- var children = nextRowElement.getElementsByClassName('datatable-body-cell');
- if (children.length)
- nextCellElement = children[cellIndex];
- }
- }
- if (nextCellElement)
- nextCellElement.focus();
- };
- DataTableSelectionComponent.prototype.getRowSelected = function (row) {
- return this.getRowSelectedIdx(row, this.selected) > -1;
- };
- DataTableSelectionComponent.prototype.getRowSelectedIdx = function (row, selected) {
- var _this = this;
- if (!selected || !selected.length)
- return -1;
- var rowId = this.rowIdentity(row);
- return selected.findIndex(function (r) {
- var id = _this.rowIdentity(r);
- return id === rowId;
- });
- };
- __decorate([
- core_1.Input(),
- __metadata('design:type', Array)
- ], DataTableSelectionComponent.prototype, "rows", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Array)
- ], DataTableSelectionComponent.prototype, "selected", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Boolean)
- ], DataTableSelectionComponent.prototype, "selectEnabled", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DataTableSelectionComponent.prototype, "selectionType", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableSelectionComponent.prototype, "rowIdentity", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableSelectionComponent.prototype, "selectCheck", void 0);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DataTableSelectionComponent.prototype, "activate", void 0);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DataTableSelectionComponent.prototype, "select", void 0);
- DataTableSelectionComponent = __decorate([
- core_1.Component({
- selector: 'datatable-selection',
- template: "\n \n ",
- changeDetection: core_1.ChangeDetectionStrategy.OnPush
- }),
- __metadata('design:paramtypes', [])
- ], DataTableSelectionComponent);
- return DataTableSelectionComponent;
-}());
-exports.DataTableSelectionComponent = DataTableSelectionComponent;
-
-
-/***/ },
-
-/***/ "./src/components/column.directive.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var DataTableColumnDirective = (function () {
- function DataTableColumnDirective() {
- }
- Object.defineProperty(DataTableColumnDirective.prototype, "hasHeaderTemplate", {
- get: function () {
- // this is a tad nasty but can't think of a better way
- // to differate if the prop is header vs cell
- return this.templates.length === 2;
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableColumnDirective.prototype, "headerTemplate", {
- get: function () {
- if (!this.hasHeaderTemplate)
- return undefined;
- return this.templates.first;
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableColumnDirective.prototype, "cellTemplate", {
- get: function () {
- if (this.hasHeaderTemplate)
- return this.templates.last;
- return this.templates.first;
- },
- enumerable: true,
- configurable: true
- });
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableColumnDirective.prototype, "name", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableColumnDirective.prototype, "prop", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableColumnDirective.prototype, "frozenLeft", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableColumnDirective.prototype, "frozenRight", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableColumnDirective.prototype, "flexGrow", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableColumnDirective.prototype, "resizeable", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableColumnDirective.prototype, "comparator", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableColumnDirective.prototype, "pipe", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableColumnDirective.prototype, "sortable", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableColumnDirective.prototype, "draggable", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableColumnDirective.prototype, "canAutoResize", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableColumnDirective.prototype, "minWidth", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableColumnDirective.prototype, "width", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableColumnDirective.prototype, "maxWidth", void 0);
- __decorate([
- core_1.ContentChildren(core_1.TemplateRef),
- __metadata('design:type', core_1.QueryList)
- ], DataTableColumnDirective.prototype, "templates", void 0);
- DataTableColumnDirective = __decorate([
- core_1.Directive({
- selector: 'datatable-column',
- }),
- __metadata('design:paramtypes', [])
- ], DataTableColumnDirective);
- return DataTableColumnDirective;
-}());
-exports.DataTableColumnDirective = DataTableColumnDirective;
-
-
-/***/ },
-
-/***/ "./src/components/datatable.component.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var utils_1 = __webpack_require__("./src/utils/index.ts");
-var types_1 = __webpack_require__("./src/types/index.ts");
-var body_1 = __webpack_require__("./src/components/body/index.ts");
-var column_directive_1 = __webpack_require__("./src/components/column.directive.ts");
-var row_detail_directive_1 = __webpack_require__("./src/components/row-detail.directive.ts");
-var utils_2 = __webpack_require__("./src/utils/index.ts");
-var DatatableComponent = (function () {
- function DatatableComponent(renderer, element) {
- // Enable vertical scrollbars
- this.scrollbarV = false;
- // Enable horz scrollbars
- this.scrollbarH = false;
- // The row height; which is necessary
- // to calculate the height for the lazy rendering.
- this.rowHeight = 30;
- // The detail row height is required especially when virtual scroll is enabled.
- this.detailRowHeight = 0;
- // Type of column width distribution.
- // Example: flex, force, standard
- this.columnMode = types_1.ColumnMode.standard;
- // The minimum header height in pixels.
- // pass falsey for no header
- // note: number|string does not work right
- this.headerHeight = 30;
- // The minimum footer height in pixels.
- // pass falsey for no footer
- this.footerHeight = 0;
- // if external paging is turned on
- this.externalPaging = false;
- // if external sorting is turned on
- this.externalSorting = false;
- // Page size
- this.limit = undefined;
- // Total count
- this.count = 0;
- // Page offset
- this.offset = 0;
- // Loading indicator
- this.loadingIndicator = false;
- // if you can reorder columns
- this.reorderable = true;
- // type of sorting
- this.sortType = types_1.SortType.single;
- // sorts
- this.sorts = [];
- // css class overrides
- this.cssClasses = {
- sortAscending: 'icon-down',
- sortDescending: 'icon-up',
- pagerLeftArrow: 'icon-left',
- pagerRightArrow: 'icon-right',
- pagerPrevious: 'icon-prev',
- pagerNext: 'icon-skip'
- };
- // message overrides for localization
- this.messages = {
- // Message to show when array is presented
- // but contains no values
- emptyMessage: 'No data to display',
- // Footer total message
- totalMessage: 'total'
- };
- // This will be used when displaying or selecting rows:
- // when tracking/comparing them, we'll use the value of this fn,
- // (`fn(x) === fn(y)` instead of `x === y`)
- this.rowIdentity = (function (x) { return x; });
- this.scroll = new core_1.EventEmitter();
- this.activate = new core_1.EventEmitter();
- this.select = new core_1.EventEmitter();
- this.sort = new core_1.EventEmitter();
- this.page = new core_1.EventEmitter();
- this.detailToggle = new core_1.EventEmitter();
- this.reorder = new core_1.EventEmitter();
- this.resize = new core_1.EventEmitter();
- this.offsetX = 0;
- this.element = element.nativeElement;
- renderer.setElementClass(this.element, 'datatable', true);
- }
- Object.defineProperty(DatatableComponent.prototype, "rows", {
- get: function () {
- return this._rows;
- },
- // Rows
- set: function (val) {
- if (!this.externalSorting) {
- val = utils_1.sortRows(val, this.columns, this.sorts);
- }
- this._rows = val;
- this.recalculate();
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DatatableComponent.prototype, "columns", {
- get: function () {
- return this._columns;
- },
- // Columns
- set: function (val) {
- if (val) {
- utils_2.setColumnDefaults(val);
- this.recalculateColumns(val);
- }
- this._columns = val;
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DatatableComponent.prototype, "isFixedHeader", {
- get: function () {
- var headerHeight = this.headerHeight;
- return (typeof headerHeight === 'string') ?
- headerHeight !== 'auto' : true;
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DatatableComponent.prototype, "isFixedRow", {
- get: function () {
- var rowHeight = this.rowHeight;
- return (typeof rowHeight === 'string') ?
- rowHeight !== 'auto' : true;
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DatatableComponent.prototype, "isVertScroll", {
- get: function () {
- return this.scrollbarV;
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DatatableComponent.prototype, "isHorScroll", {
- get: function () {
- return this.scrollbarH;
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DatatableComponent.prototype, "isSelectable", {
- get: function () {
- return this.selectionType !== undefined;
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DatatableComponent.prototype, "columnTemplates", {
- get: function () {
- return this._columnTemplates;
- },
- set: function (val) {
- this._columnTemplates = val;
- if (val) {
- // only set this if results were brought back
- var arr = val.toArray();
- if (arr.length) {
- // translate them to normal objects
- this.columns = utils_2.translateTemplates(arr);
- }
- }
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DatatableComponent.prototype, "rowDetailTemplateChild", {
- get: function () {
- return this._rowDetailTemplateChild;
- },
- set: function (val) {
- this._rowDetailTemplateChild = val;
- if (val)
- this.rowDetailTemplate = val.rowDetailTemplate;
- },
- enumerable: true,
- configurable: true
- });
- DatatableComponent.prototype.ngOnInit = function () {
- // need to call this immediatly to size
- // if the table is hidden the visibility
- // listener will invoke this itself upon show
- this.recalculate();
- };
- DatatableComponent.prototype.ngAfterViewInit = function () {
- this.recalculate();
- };
- /**
- * Toggle the expansion of the row
- *
- * @param rowIndex
- */
- DatatableComponent.prototype.toggleExpandRow = function (row) {
- // Should we write a guard here??
- this.bodyComponent.toggleRowExpansion(row);
- };
- /**
- * API method to expand all the rows.
- */
- DatatableComponent.prototype.expandAllRows = function () {
- this.bodyComponent.toggleAllRows(true);
- };
- /**
- * API method to collapse all the rows.
- */
- DatatableComponent.prototype.collapseAllRows = function () {
- this.bodyComponent.toggleAllRows(false);
- };
- DatatableComponent.prototype.recalculate = function () {
- this.recalculateDims();
- this.recalculateColumns();
- };
- DatatableComponent.prototype.recalculateColumns = function (columns, forceIdx) {
- if (columns === void 0) { columns = this.columns; }
- if (!columns)
- return;
- var width = this.innerWidth;
- if (this.scrollbarV) {
- width = width - utils_2.scrollbarWidth;
- }
- if (this.columnMode === types_1.ColumnMode.force) {
- utils_1.forceFillColumnWidths(columns, width, forceIdx);
- }
- else if (this.columnMode === types_1.ColumnMode.flex) {
- utils_1.adjustColumnWidths(columns, width);
- }
- return columns;
- };
- DatatableComponent.prototype.recalculateDims = function () {
- var _a = this.element.getBoundingClientRect(), height = _a.height, width = _a.width;
- this.innerWidth = Math.floor(width);
- if (this.scrollbarV) {
- if (this.headerHeight)
- height = height - this.headerHeight;
- if (this.footerHeight)
- height = height - this.footerHeight;
- this.bodyHeight = height;
- }
- this.pageSize = this.calcPageSize();
- this.rowCount = this.calcRowCount();
- };
- DatatableComponent.prototype.onBodyPage = function (_a) {
- var offset = _a.offset;
- this.offset = offset;
- this.page.emit({
- count: this.count,
- pageSize: this.pageSize,
- limit: this.limit,
- offset: this.offset
- });
- };
- DatatableComponent.prototype.onBodyScroll = function (event) {
- this.offsetX = event.offsetX;
- this.scroll.emit(event);
- };
- DatatableComponent.prototype.onFooterPage = function (event) {
- this.offset = event.page - 1;
- this.bodyComponent.updateOffsetY(this.offset);
- this.page.emit({
- count: this.count,
- pageSize: this.pageSize,
- limit: this.limit,
- offset: this.offset
- });
- };
- DatatableComponent.prototype.calcPageSize = function (val) {
- if (val === void 0) { val = this.rows; }
- // Keep the page size constant even if the row has been expanded.
- // This is because an expanded row is still considered to be a child of
- // the original row. Hence calculation would use rowHeight only.
- if (this.scrollbarV)
- return Math.ceil(this.bodyHeight / this.rowHeight);
- // if limit is passed, we are paging
- if (this.limit !== undefined)
- return this.limit;
- // otherwise use row length
- if (val)
- return val.length;
- // other empty :(
- return 0;
- };
- DatatableComponent.prototype.calcRowCount = function (val) {
- if (val === void 0) { val = this.rows; }
- if (!this.externalPaging) {
- if (!val)
- return 0;
- return val.length;
- }
- return this.count;
- };
- DatatableComponent.prototype.onColumnResize = function (_a) {
- var column = _a.column, newValue = _a.newValue;
- var idx;
- var cols = this.columns.map(function (c, i) {
- c = Object.assign({}, c);
- if (c.$$id === column.$$id) {
- idx = i;
- c.width = newValue;
- // set this so we can force the column
- // width distribution to be to this value
- c.$$oldWidth = newValue;
- }
- return c;
- });
- this.recalculateColumns(cols, idx);
- this.columns = cols;
- this.resize.emit({
- column: column,
- newValue: newValue
- });
- };
- DatatableComponent.prototype.onColumnReorder = function (_a) {
- var column = _a.column, newValue = _a.newValue, prevValue = _a.prevValue;
- var cols = this.columns.map(function (c) {
- return Object.assign({}, c);
- });
- cols.splice(prevValue, 1);
- cols.splice(newValue, 0, column);
- this.columns = cols;
- this.reorder.emit({
- column: column,
- newValue: newValue,
- prevValue: prevValue
- });
- };
- DatatableComponent.prototype.onColumnSort = function (event) {
- var sorts = event.sorts;
- // this could be optimized better since it will resort
- // the rows again on the 'push' detection...
- if (this.externalSorting === false) {
- this.rows = utils_1.sortRows(this.rows, this.columns, sorts);
- }
- this.sorts = sorts;
- this.bodyComponent.updateOffsetY(0);
- this.sort.emit(event);
- };
- __decorate([
- core_1.Input(),
- __metadata('design:type', Array),
- __metadata('design:paramtypes', [Array])
- ], DatatableComponent.prototype, "rows", null);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Array),
- __metadata('design:paramtypes', [Array])
- ], DatatableComponent.prototype, "columns", null);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Array)
- ], DatatableComponent.prototype, "selected", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Boolean)
- ], DatatableComponent.prototype, "scrollbarV", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Boolean)
- ], DatatableComponent.prototype, "scrollbarH", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DatatableComponent.prototype, "rowHeight", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DatatableComponent.prototype, "detailRowHeight", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DatatableComponent.prototype, "columnMode", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DatatableComponent.prototype, "headerHeight", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DatatableComponent.prototype, "footerHeight", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Boolean)
- ], DatatableComponent.prototype, "externalPaging", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Boolean)
- ], DatatableComponent.prototype, "externalSorting", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DatatableComponent.prototype, "limit", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DatatableComponent.prototype, "count", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DatatableComponent.prototype, "offset", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Boolean)
- ], DatatableComponent.prototype, "loadingIndicator", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DatatableComponent.prototype, "selectionType", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Boolean)
- ], DatatableComponent.prototype, "reorderable", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DatatableComponent.prototype, "sortType", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Array)
- ], DatatableComponent.prototype, "sorts", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', core_1.TemplateRef)
- ], DatatableComponent.prototype, "rowDetailTemplate", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DatatableComponent.prototype, "cssClasses", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DatatableComponent.prototype, "messages", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DatatableComponent.prototype, "rowIdentity", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DatatableComponent.prototype, "selectCheck", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', String)
- ], DatatableComponent.prototype, "trackByProp", void 0);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DatatableComponent.prototype, "scroll", void 0);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DatatableComponent.prototype, "activate", void 0);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DatatableComponent.prototype, "select", void 0);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DatatableComponent.prototype, "sort", void 0);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DatatableComponent.prototype, "page", void 0);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DatatableComponent.prototype, "detailToggle", void 0);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DatatableComponent.prototype, "reorder", void 0);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DatatableComponent.prototype, "resize", void 0);
- __decorate([
- core_1.HostBinding('class.fixed-header'),
- __metadata('design:type', Object)
- ], DatatableComponent.prototype, "isFixedHeader", null);
- __decorate([
- core_1.HostBinding('class.fixed-row'),
- __metadata('design:type', Object)
- ], DatatableComponent.prototype, "isFixedRow", null);
- __decorate([
- core_1.HostBinding('class.scroll-vertical'),
- __metadata('design:type', Object)
- ], DatatableComponent.prototype, "isVertScroll", null);
- __decorate([
- core_1.HostBinding('class.scroll-horz'),
- __metadata('design:type', Object)
- ], DatatableComponent.prototype, "isHorScroll", null);
- __decorate([
- core_1.HostBinding('class.selectable'),
- __metadata('design:type', Object)
- ], DatatableComponent.prototype, "isSelectable", null);
- __decorate([
- core_1.ContentChildren(column_directive_1.DataTableColumnDirective),
- __metadata('design:type', core_1.QueryList),
- __metadata('design:paramtypes', [core_1.QueryList])
- ], DatatableComponent.prototype, "columnTemplates", null);
- __decorate([
- core_1.ContentChild(row_detail_directive_1.DatatableRowDetailDirective),
- __metadata('design:type', row_detail_directive_1.DatatableRowDetailDirective),
- __metadata('design:paramtypes', [row_detail_directive_1.DatatableRowDetailDirective])
- ], DatatableComponent.prototype, "rowDetailTemplateChild", null);
- __decorate([
- core_1.ViewChild(body_1.DataTableBodyComponent),
- __metadata('design:type', body_1.DataTableBodyComponent)
- ], DatatableComponent.prototype, "bodyComponent", void 0);
- __decorate([
- core_1.HostListener('window:resize'),
- __metadata('design:type', Function),
- __metadata('design:paramtypes', []),
- __metadata('design:returntype', void 0)
- ], DatatableComponent.prototype, "recalculate", null);
- DatatableComponent = __decorate([
- core_1.Component({
- selector: 'datatable',
- template: "\n \n \n \n \n \n \n \n \n ",
- changeDetection: core_1.ChangeDetectionStrategy.OnPush
- }),
- __metadata('design:paramtypes', [core_1.Renderer, core_1.ElementRef])
- ], DatatableComponent);
- return DatatableComponent;
-}());
-exports.DatatableComponent = DatatableComponent;
-
-
-/***/ },
-
-/***/ "./src/components/datatable.scss":
-/***/ function(module, exports) {
-
-// removed by extract-text-webpack-plugin
-
-/***/ },
-
-/***/ "./src/components/footer/footer.component.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var DataTableFooterComponent = (function () {
- function DataTableFooterComponent(element, renderer) {
- this.page = new core_1.EventEmitter();
- renderer.setElementClass(element.nativeElement, 'datatable-footer', true);
- }
- Object.defineProperty(DataTableFooterComponent.prototype, "isVisible", {
- get: function () {
- return (this.rowCount / this.pageSize) > 1;
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableFooterComponent.prototype, "curPage", {
- get: function () {
- return this.offset + 1;
- },
- enumerable: true,
- configurable: true
- });
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DataTableFooterComponent.prototype, "footerHeight", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DataTableFooterComponent.prototype, "rowCount", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DataTableFooterComponent.prototype, "pageSize", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DataTableFooterComponent.prototype, "offset", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', String)
- ], DataTableFooterComponent.prototype, "pagerLeftArrowIcon", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', String)
- ], DataTableFooterComponent.prototype, "pagerRightArrowIcon", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', String)
- ], DataTableFooterComponent.prototype, "pagerPreviousIcon", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', String)
- ], DataTableFooterComponent.prototype, "pagerNextIcon", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', String)
- ], DataTableFooterComponent.prototype, "totalMessage", void 0);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DataTableFooterComponent.prototype, "page", void 0);
- DataTableFooterComponent = __decorate([
- core_1.Component({
- selector: 'datatable-footer',
- template: "\n \n {{rowCount.toLocaleString()}} {{totalMessage}}
\n \n \n \n ",
- changeDetection: core_1.ChangeDetectionStrategy.OnPush
- }),
- __metadata('design:paramtypes', [core_1.ElementRef, core_1.Renderer])
- ], DataTableFooterComponent);
- return DataTableFooterComponent;
-}());
-exports.DataTableFooterComponent = DataTableFooterComponent;
-
-
-/***/ },
-
-/***/ "./src/components/footer/index.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-function __export(m) {
- for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
-}
-__export(__webpack_require__("./src/components/footer/footer.component.ts"));
-__export(__webpack_require__("./src/components/footer/pager.component.ts"));
-
-
-/***/ },
-
-/***/ "./src/components/footer/pager.component.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var DataTablePagerComponent = (function () {
- function DataTablePagerComponent(element, renderer) {
- this.change = new core_1.EventEmitter();
- this._count = 0;
- this._page = 1;
- this._size = 0;
- renderer.setElementClass(element.nativeElement, 'datatable-pager', true);
- }
- Object.defineProperty(DataTablePagerComponent.prototype, "size", {
- get: function () {
- return this._size;
- },
- set: function (val) {
- this._size = val;
- this.pages = this.calcPages();
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTablePagerComponent.prototype, "count", {
- get: function () {
- return this._count;
- },
- set: function (val) {
- this._count = val;
- this.pages = this.calcPages();
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTablePagerComponent.prototype, "page", {
- get: function () {
- return this._page;
- },
- set: function (val) {
- this._page = val;
- this.pages = this.calcPages();
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTablePagerComponent.prototype, "totalPages", {
- get: function () {
- var count = this.size < 1 ? 1 : Math.ceil(this.count / this.size);
- return Math.max(count || 0, 1);
- },
- enumerable: true,
- configurable: true
- });
- DataTablePagerComponent.prototype.canPrevious = function () {
- return this.page > 1;
- };
- DataTablePagerComponent.prototype.canNext = function () {
- return this.page < this.totalPages;
- };
- DataTablePagerComponent.prototype.prevPage = function () {
- this.selectPage(this.page - 1);
- };
- DataTablePagerComponent.prototype.nextPage = function () {
- this.selectPage(this.page + 1);
- };
- DataTablePagerComponent.prototype.selectPage = function (page) {
- if (page > 0 && page <= this.totalPages && page !== this.page) {
- this.page = page;
- this.change.emit({
- page: page
- });
- }
- };
- DataTablePagerComponent.prototype.calcPages = function (page) {
- var pages = [];
- var startPage = 1;
- var endPage = this.totalPages;
- var maxSize = 5;
- var isMaxSized = maxSize < this.totalPages;
- page = page || this.page;
- if (isMaxSized) {
- startPage = ((Math.ceil(page / maxSize) - 1) * maxSize) + 1;
- endPage = Math.min(startPage + maxSize - 1, this.totalPages);
- }
- for (var num = startPage; num <= endPage; num++) {
- pages.push({
- number: num,
- text: num
- });
- }
- return pages;
- };
- __decorate([
- core_1.Input(),
- __metadata('design:type', String)
- ], DataTablePagerComponent.prototype, "pagerLeftArrowIcon", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', String)
- ], DataTablePagerComponent.prototype, "pagerRightArrowIcon", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', String)
- ], DataTablePagerComponent.prototype, "pagerPreviousIcon", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', String)
- ], DataTablePagerComponent.prototype, "pagerNextIcon", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number),
- __metadata('design:paramtypes', [Number])
- ], DataTablePagerComponent.prototype, "size", null);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number),
- __metadata('design:paramtypes', [Number])
- ], DataTablePagerComponent.prototype, "count", null);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number),
- __metadata('design:paramtypes', [Number])
- ], DataTablePagerComponent.prototype, "page", null);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DataTablePagerComponent.prototype, "change", void 0);
- DataTablePagerComponent = __decorate([
- core_1.Component({
- selector: 'datatable-pager',
- template: "\n \n ",
- changeDetection: core_1.ChangeDetectionStrategy.OnPush
- }),
- __metadata('design:paramtypes', [core_1.ElementRef, core_1.Renderer])
- ], DataTablePagerComponent);
- return DataTablePagerComponent;
-}());
-exports.DataTablePagerComponent = DataTablePagerComponent;
-
-
-/***/ },
-
-/***/ "./src/components/header/header-cell.component.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var types_1 = __webpack_require__("./src/types/index.ts");
-var utils_1 = __webpack_require__("./src/utils/index.ts");
-var DataTableHeaderCellComponent = (function () {
- function DataTableHeaderCellComponent() {
- this.sort = new core_1.EventEmitter();
- }
- Object.defineProperty(DataTableHeaderCellComponent.prototype, "sorts", {
- get: function () {
- return this._sorts;
- },
- set: function (val) {
- this._sorts = val;
- this.sortDir = this.calcSortDir(val);
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableHeaderCellComponent.prototype, "columnCssClasses", {
- get: function () {
- var cls = 'datatable-header-cell';
- if (this.column.sortable)
- cls += ' sortable';
- if (this.column.resizeable)
- cls += ' resizeable';
- var sortDir = this.sortDir;
- if (sortDir) {
- cls += " sort-active sort-" + sortDir;
- }
- return cls;
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableHeaderCellComponent.prototype, "name", {
- get: function () {
- return this.column.name || this.column.prop;
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableHeaderCellComponent.prototype, "minWidth", {
- get: function () {
- return this.column.minWidth;
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableHeaderCellComponent.prototype, "maxWidth", {
- get: function () {
- return this.column.maxWidth;
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableHeaderCellComponent.prototype, "width", {
- get: function () {
- return this.column.width;
- },
- enumerable: true,
- configurable: true
- });
- DataTableHeaderCellComponent.prototype.sortClasses = function (dir) {
- var result = {};
- if (dir === types_1.SortDirection.asc) {
- result[("sort-asc " + this.sortAscendingIcon)] = true;
- }
- else if (dir === types_1.SortDirection.desc) {
- result[("sort-desc " + this.sortDescendingIcon)] = true;
- }
- return result;
- };
- DataTableHeaderCellComponent.prototype.calcSortDir = function (sorts) {
- var _this = this;
- if (sorts && this.column) {
- var sort = sorts.find(function (s) {
- return s.prop === _this.column.prop;
- });
- if (sort)
- return sort.dir;
- }
- };
- DataTableHeaderCellComponent.prototype.onSort = function () {
- if (!this.column.sortable)
- return;
- var newValue = utils_1.nextSortDir(this.sortType, this.sortDir);
- this.sort.emit({
- column: this.column,
- prevValue: this.sortDir,
- newValue: newValue
- });
- };
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DataTableHeaderCellComponent.prototype, "sortType", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableHeaderCellComponent.prototype, "column", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', String)
- ], DataTableHeaderCellComponent.prototype, "sortAscendingIcon", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', String)
- ], DataTableHeaderCellComponent.prototype, "sortDescendingIcon", void 0);
- __decorate([
- core_1.HostBinding('style.height.px'),
- core_1.Input(),
- __metadata('design:type', Number)
- ], DataTableHeaderCellComponent.prototype, "headerHeight", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Array),
- __metadata('design:paramtypes', [Array])
- ], DataTableHeaderCellComponent.prototype, "sorts", null);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DataTableHeaderCellComponent.prototype, "sort", void 0);
- __decorate([
- core_1.HostBinding('class'),
- __metadata('design:type', Object)
- ], DataTableHeaderCellComponent.prototype, "columnCssClasses", null);
- __decorate([
- core_1.HostBinding('attr.title'),
- __metadata('design:type', String)
- ], DataTableHeaderCellComponent.prototype, "name", null);
- __decorate([
- core_1.HostBinding('style.minWidth.px'),
- __metadata('design:type', Number)
- ], DataTableHeaderCellComponent.prototype, "minWidth", null);
- __decorate([
- core_1.HostBinding('style.maxWidth.px'),
- __metadata('design:type', Number)
- ], DataTableHeaderCellComponent.prototype, "maxWidth", null);
- __decorate([
- core_1.HostBinding('style.width.px'),
- __metadata('design:type', Number)
- ], DataTableHeaderCellComponent.prototype, "width", null);
- DataTableHeaderCellComponent = __decorate([
- core_1.Component({
- selector: 'datatable-header-cell',
- template: "\n \n
\n ",
- changeDetection: core_1.ChangeDetectionStrategy.OnPush
- }),
- __metadata('design:paramtypes', [])
- ], DataTableHeaderCellComponent);
- return DataTableHeaderCellComponent;
-}());
-exports.DataTableHeaderCellComponent = DataTableHeaderCellComponent;
-
-
-/***/ },
-
-/***/ "./src/components/header/header.component.ts":
-/***/ function(module, exports, __webpack_require__) {
-
-"use strict";
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = __webpack_require__(0);
-var types_1 = __webpack_require__("./src/types/index.ts");
-var utils_1 = __webpack_require__("./src/utils/index.ts");
-var DataTableHeaderComponent = (function () {
- function DataTableHeaderComponent(element, renderer) {
- this.sort = new core_1.EventEmitter();
- this.reorder = new core_1.EventEmitter();
- this.resize = new core_1.EventEmitter();
- renderer.setElementClass(element.nativeElement, 'datatable-header', true);
- }
- Object.defineProperty(DataTableHeaderComponent.prototype, "headerHeight", {
- get: function () {
- return this._headerHeight;
- },
- set: function (val) {
- if (val !== 'auto') {
- this._headerHeight = val + "px";
- }
- else {
- this._headerHeight = val;
- }
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableHeaderComponent.prototype, "columns", {
- get: function () {
- return this._columns;
- },
- set: function (val) {
- this._columns = val;
- var colsByPin = utils_1.columnsByPin(val);
- this.columnsByPin = utils_1.columnsByPinArr(val);
- this.columnGroupWidths = utils_1.columnGroupWidths(colsByPin, val);
- },
- enumerable: true,
- configurable: true
- });
- Object.defineProperty(DataTableHeaderComponent.prototype, "headerWidth", {
- get: function () {
- if (this.scrollbarH) {
- return this.innerWidth + 'px';
- }
- return '100%';
- },
- enumerable: true,
- configurable: true
- });
- DataTableHeaderComponent.prototype.onColumnResized = function (width, column) {
- if (width <= column.minWidth) {
- width = column.minWidth;
- }
- else if (width >= column.maxWidth) {
- width = column.maxWidth;
- }
- this.resize.emit({
- column: column,
- prevValue: column.width,
- newValue: width
- });
- };
- DataTableHeaderComponent.prototype.onColumnReordered = function (_a) {
- var prevIndex = _a.prevIndex, newIndex = _a.newIndex, model = _a.model;
- this.reorder.emit({
- column: model,
- prevValue: prevIndex,
- newValue: newIndex
- });
- };
- DataTableHeaderComponent.prototype.onSort = function (_a) {
- var column = _a.column, prevValue = _a.prevValue, newValue = _a.newValue;
- var sorts = this.calcNewSorts(column, prevValue, newValue);
- this.sort.emit({
- sorts: sorts,
- column: column,
- prevValue: prevValue,
- newValue: newValue
- });
- };
- DataTableHeaderComponent.prototype.calcNewSorts = function (column, prevValue, newValue) {
- var idx = 0;
- var sorts = this.sorts.map(function (s, i) {
- s = Object.assign({}, s);
- if (s.prop === column.prop)
- idx = i;
- return s;
- });
- if (newValue === undefined) {
- sorts.splice(idx, 1);
- }
- else if (prevValue) {
- sorts[idx].dir = newValue;
- }
- else {
- if (this.sortType === types_1.SortType.single) {
- sorts.splice(0, this.sorts.length);
- }
- sorts.push({ dir: newValue, prop: column.prop });
- }
- return sorts;
- };
- DataTableHeaderComponent.prototype.stylesByGroup = function (group) {
- var widths = this.columnGroupWidths;
- var offsetX = this.offsetX;
- var styles = {
- width: widths[group] + "px"
- };
- if (group === 'center') {
- utils_1.translateXY(styles, offsetX * -1, 0);
- }
- else if (group === 'right') {
- var totalDiff = widths.total - this.innerWidth;
- var offset = totalDiff * -1;
- utils_1.translateXY(styles, offset, 0);
- }
- return styles;
- };
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableHeaderComponent.prototype, "sortAscendingIcon", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Object)
- ], DataTableHeaderComponent.prototype, "sortDescendingIcon", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Boolean)
- ], DataTableHeaderComponent.prototype, "scrollbarH", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DataTableHeaderComponent.prototype, "innerWidth", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DataTableHeaderComponent.prototype, "offsetX", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Array)
- ], DataTableHeaderComponent.prototype, "sorts", void 0);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Number)
- ], DataTableHeaderComponent.prototype, "sortType", void 0);
- __decorate([
- core_1.HostBinding('style.height'),
- core_1.Input(),
- __metadata('design:type', Object),
- __metadata('design:paramtypes', [Object])
- ], DataTableHeaderComponent.prototype, "headerHeight", null);
- __decorate([
- core_1.Input(),
- __metadata('design:type', Array),
- __metadata('design:paramtypes', [Array])
- ], DataTableHeaderComponent.prototype, "columns", null);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DataTableHeaderComponent.prototype, "sort", void 0);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DataTableHeaderComponent.prototype, "reorder", void 0);
- __decorate([
- core_1.Output(),
- __metadata('design:type', core_1.EventEmitter)
- ], DataTableHeaderComponent.prototype, "resize", void 0);
- __decorate([
- core_1.HostBinding('style.width'),
- __metadata('design:type', String)
- ], DataTableHeaderComponent.prototype, "headerWidth", null);
- DataTableHeaderComponent = __decorate([
- core_1.Component({
- selector: 'datatable-header',
- template: "\n