diff --git a/lib/frappe-datatable.js b/lib/frappe-datatable.js
deleted file mode 100644
index d9f68c5..0000000
--- a/lib/frappe-datatable.js
+++ /dev/null
@@ -1,4069 +0,0 @@
-(function webpackUniversalModuleDefinition(root, factory) {
- if(typeof exports === 'object' && typeof module === 'object')
- module.exports = factory(require("sortablejs"), require("clusterize.js"));
- else if(typeof define === 'function' && define.amd)
- define("DataTable", [, ], factory);
- else if(typeof exports === 'object')
- exports["DataTable"] = factory(require("sortablejs"), require("clusterize.js"));
- else
- root["DataTable"] = factory(root["Sortable"], root["Clusterize"]);
-})(typeof self !== 'undefined' ? self : this, function(__WEBPACK_EXTERNAL_MODULE_7__, __WEBPACK_EXTERNAL_MODULE_10__) {
-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;
-/******/
-/******/ // define getter function for harmony exports
-/******/ __webpack_require__.d = function(exports, name, getter) {
-/******/ if(!__webpack_require__.o(exports, name)) {
-/******/ 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 = 3);
-/******/ })
-/************************************************************************/
-/******/ ([
-/* 0 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
- value: true
-});
-
-var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
-
-exports.default = $;
-function $(expr, con) {
- return typeof expr === 'string' ? (con || document).querySelector(expr) : expr || null;
-}
-
-$.each = function (expr, con) {
- return typeof expr === 'string' ? Array.from((con || document).querySelectorAll(expr)) : expr || null;
-};
-
-$.create = function (tag, o) {
- var element = document.createElement(tag);
-
- var _loop = function _loop(i) {
- var val = o[i];
-
- if (i === 'inside') {
- $(val).appendChild(element);
- } else if (i === 'around') {
- var ref = $(val);
- ref.parentNode.insertBefore(element, ref);
- element.appendChild(ref);
- } else if (i === 'styles') {
- if ((typeof val === 'undefined' ? 'undefined' : _typeof(val)) === 'object') {
- Object.keys(val).map(function (prop) {
- element.style[prop] = val[prop];
- });
- }
- } else if (i in element) {
- element[i] = val;
- } else {
- element.setAttribute(i, val);
- }
- };
-
- for (var i in o) {
- _loop(i);
- }
-
- return element;
-};
-
-$.on = function (element, event, selector, callback) {
- if (!callback) {
- callback = selector;
- $.bind(element, event, callback);
- } else {
- $.delegate(element, event, selector, callback);
- }
-};
-
-$.off = function (element, event, handler) {
- element.removeEventListener(event, handler);
-};
-
-$.bind = function (element, event, callback) {
- event.split(/\s+/).forEach(function (event) {
- element.addEventListener(event, callback);
- });
-};
-
-$.delegate = function (element, event, selector, callback) {
- element.addEventListener(event, function (e) {
- var delegatedTarget = e.target.closest(selector);
- if (delegatedTarget) {
- e.delegatedTarget = delegatedTarget;
- callback.call(this, e, delegatedTarget);
- }
- });
-};
-
-$.unbind = function (element, o) {
- if (element) {
- var _loop2 = function _loop2(event) {
- var callback = o[event];
-
- event.split(/\s+/).forEach(function (event) {
- element.removeEventListener(event, callback);
- });
- };
-
- for (var event in o) {
- _loop2(event);
- }
- }
-};
-
-$.fire = function (target, type, properties) {
- var evt = document.createEvent('HTMLEvents');
-
- evt.initEvent(type, true, true);
-
- for (var j in properties) {
- evt[j] = properties[j];
- }
-
- return target.dispatchEvent(evt);
-};
-
-$.data = function (element, attrs) {
- // eslint-disable-line
- if (!attrs) {
- return element.dataset;
- }
-
- for (var attr in attrs) {
- element.dataset[attr] = attrs[attr];
- }
-};
-
-$.style = function (elements, styleMap) {
- // eslint-disable-line
-
- if (typeof styleMap === 'string') {
- return $.getStyle(elements, styleMap);
- }
-
- if (!Array.isArray(elements)) {
- elements = [elements];
- }
-
- elements.map(function (element) {
- for (var prop in styleMap) {
- element.style[prop] = styleMap[prop];
- }
- });
-};
-
-$.removeStyle = function (elements, styleProps) {
- if (!Array.isArray(elements)) {
- elements = [elements];
- }
-
- if (!Array.isArray(styleProps)) {
- styleProps = [styleProps];
- }
-
- elements.map(function (element) {
- var _iteratorNormalCompletion = true;
- var _didIteratorError = false;
- var _iteratorError = undefined;
-
- try {
- for (var _iterator = styleProps[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
- var prop = _step.value;
-
- element.style[prop] = '';
- }
- } catch (err) {
- _didIteratorError = true;
- _iteratorError = err;
- } finally {
- try {
- if (!_iteratorNormalCompletion && _iterator.return) {
- _iterator.return();
- }
- } finally {
- if (_didIteratorError) {
- throw _iteratorError;
- }
- }
- }
- });
-};
-
-$.getStyle = function (element, prop) {
- var val = getComputedStyle(element)[prop];
-
- if (['width', 'height'].includes(prop)) {
- val = parseFloat(val);
- }
-
- return val;
-};
-
-$.closest = function (selector, element) {
- if (!element) return null;
-
- if (element.matches(selector)) {
- return element;
- }
-
- return $.closest(selector, element.parentNode);
-};
-
-$.inViewport = function (el, parentEl) {
- var _el$getBoundingClient = el.getBoundingClientRect(),
- top = _el$getBoundingClient.top,
- left = _el$getBoundingClient.left,
- bottom = _el$getBoundingClient.bottom,
- right = _el$getBoundingClient.right;
-
- var _parentEl$getBounding = parentEl.getBoundingClientRect(),
- pTop = _parentEl$getBounding.top,
- pLeft = _parentEl$getBounding.left,
- pBottom = _parentEl$getBounding.bottom,
- pRight = _parentEl$getBounding.right;
-
- return top >= pTop && left >= pLeft && bottom <= pBottom && right <= pRight;
-};
-
-$.scrollTop = function scrollTop(element, pixels) {
- requestAnimationFrame(function () {
- element.scrollTop = pixels;
- });
-};
-module.exports = exports['default'];
-
-/***/ }),
-/* 1 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
- value: true
-});
-exports.camelCaseToDash = camelCaseToDash;
-exports.makeDataAttributeString = makeDataAttributeString;
-exports.getDefault = getDefault;
-exports.escapeRegExp = escapeRegExp;
-exports.getCSSString = getCSSString;
-exports.getCSSRuleBlock = getCSSRuleBlock;
-exports.buildCSSRule = buildCSSRule;
-exports.removeCSSRule = removeCSSRule;
-exports.copyTextToClipboard = copyTextToClipboard;
-exports.isNumeric = isNumeric;
-exports.throttle = throttle;
-exports.promisify = promisify;
-exports.chainPromises = chainPromises;
-exports.linkProperties = linkProperties;
-function camelCaseToDash(str) {
- return str.replace(/([A-Z])/g, function (g) {
- return '-' + g[0].toLowerCase();
- });
-}
-
-function makeDataAttributeString(props) {
- var keys = Object.keys(props);
-
- return keys.map(function (key) {
- var _key = camelCaseToDash(key);
- var val = props[key];
-
- if (val === undefined) return '';
- return 'data-' + _key + '="' + val + '" ';
- }).join('').trim();
-}
-
-function getDefault(a, b) {
- return a !== undefined ? a : b;
-}
-
-function escapeRegExp(str) {
- // https://stackoverflow.com/a/6969486
- return str.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, '\\$&');
-}
-
-function getCSSString(styleMap) {
- var style = '';
-
- for (var prop in styleMap) {
- if (styleMap.hasOwnProperty(prop)) {
- style += prop + ': ' + styleMap[prop] + '; ';
- }
- }
-
- return style.trim();
-}
-
-function getCSSRuleBlock(rule, styleMap) {
- return rule + ' { ' + getCSSString(styleMap) + ' }';
-}
-
-function buildCSSRule(rule, styleMap) {
- var cssRulesString = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '';
-
- // build css rules efficiently,
- // append new rule if doesnt exist,
- // update existing ones
-
- var rulePatternStr = escapeRegExp(rule) + ' {([^}]*)}';
- var rulePattern = new RegExp(rulePatternStr, 'g');
-
- if (cssRulesString && cssRulesString.match(rulePattern)) {
- var _loop = function _loop(property) {
- var value = styleMap[property];
- var propPattern = new RegExp(escapeRegExp(property) + ':([^;]*);');
-
- cssRulesString = cssRulesString.replace(rulePattern, function (match, propertyStr) {
- if (propertyStr.match(propPattern)) {
- // property exists, replace value with new value
- propertyStr = propertyStr.replace(propPattern, function (match, valueStr) {
- return property + ': ' + value + ';';
- });
- }
- propertyStr = propertyStr.trim();
-
- var replacer = rule + ' { ' + propertyStr + ' }';
-
- return replacer;
- });
- };
-
- for (var property in styleMap) {
- _loop(property);
- }
-
- return cssRulesString;
- }
- // no match, append new rule block
- return '' + cssRulesString + getCSSRuleBlock(rule, styleMap);
-}
-
-function removeCSSRule(rule) {
- var cssRulesString = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
-
- var rulePatternStr = escapeRegExp(rule) + ' {([^}]*)}';
- var rulePattern = new RegExp(rulePatternStr, 'g');
- var output = cssRulesString;
-
- if (cssRulesString && cssRulesString.match(rulePattern)) {
- output = cssRulesString.replace(rulePattern, '');
- }
-
- return output.trim();
-}
-
-function copyTextToClipboard(text) {
- // https://stackoverflow.com/a/30810322/5353542
- var textArea = document.createElement('textarea');
-
- //
- // *** This styling is an extra step which is likely not required. ***
- //
- // Why is it here? To ensure:
- // 1. the element is able to have focus and selection.
- // 2. if element was to flash render it has minimal visual impact.
- // 3. less flakyness with selection and copying which **might** occur if
- // the textarea element is not visible.
- //
- // The likelihood is the element won't even render, not even a flash,
- // so some of these are just precautions. However in IE the element
- // is visible whilst the popup box asking the user for permission for
- // the web page to copy to the clipboard.
- //
-
- // Place in top-left corner of screen regardless of scroll position.
- textArea.style.position = 'fixed';
- textArea.style.top = 0;
- textArea.style.left = 0;
-
- // Ensure it has a small width and height. Setting to 1px / 1em
- // doesn't work as this gives a negative w/h on some browsers.
- textArea.style.width = '2em';
- textArea.style.height = '2em';
-
- // We don't need padding, reducing the size if it does flash render.
- textArea.style.padding = 0;
-
- // Clean up any borders.
- textArea.style.border = 'none';
- textArea.style.outline = 'none';
- textArea.style.boxShadow = 'none';
-
- // Avoid flash of white box if rendered for any reason.
- textArea.style.background = 'transparent';
-
- textArea.value = text;
-
- document.body.appendChild(textArea);
-
- textArea.select();
-
- try {
- document.execCommand('copy');
- } catch (err) {
- console.log('Oops, unable to copy');
- }
-
- document.body.removeChild(textArea);
-}
-
-function isNumeric(val) {
- return !isNaN(val);
-}
-
-// https://stackoverflow.com/a/27078401
-function throttle(func, wait, options) {
- var context, args, result;
- var timeout = null;
- var previous = 0;
- if (!options) options = {};
-
- var later = function later() {
- previous = options.leading === false ? 0 : Date.now();
- timeout = null;
- result = func.apply(context, args);
- if (!timeout) context = args = null;
- };
-
- return function () {
- var now = Date.now();
- if (!previous && options.leading === false) previous = now;
- var remaining = wait - (now - previous);
- context = this;
- args = arguments;
- if (remaining <= 0 || remaining > wait) {
- if (timeout) {
- clearTimeout(timeout);
- timeout = null;
- }
- previous = now;
- result = func.apply(context, args);
- if (!timeout) context = args = null;
- } else if (!timeout && options.trailing !== false) {
- timeout = setTimeout(later, remaining);
- }
- return result;
- };
-};
-
-function promisify(fn) {
- var context = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
-
- return function () {
- for (var _len = arguments.length, args = Array(_len), _key2 = 0; _key2 < _len; _key2++) {
- args[_key2] = arguments[_key2];
- }
-
- return new Promise(function (resolve) {
- setTimeout(function () {
- fn.apply(context, args);
- resolve('done', fn.name);
- }, 0);
- });
- };
-};
-
-function chainPromises(promises) {
- return promises.reduce(function (prev, cur) {
- return prev.then(cur);
- }, Promise.resolve());
-};
-
-function linkProperties(target, source, properties) {
- var props = properties.reduce(function (acc, prop) {
- acc[prop] = {
- get: function get() {
- return source[prop];
- }
- };
- return acc;
- }, {});
- Object.defineProperties(target, props);
-};
-
-/***/ }),
-/* 2 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
- value: true
-});
-exports.getDropdownHTML = undefined;
-
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
-
-var _dom = __webpack_require__(0);
-
-var _dom2 = _interopRequireDefault(_dom);
-
-var _sortablejs = __webpack_require__(7);
-
-var _sortablejs2 = _interopRequireDefault(_sortablejs);
-
-var _utils = __webpack_require__(1);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-var ColumnManager = function () {
- function ColumnManager(instance) {
- _classCallCheck(this, ColumnManager);
-
- this.instance = instance;
-
- (0, _utils.linkProperties)(this, this.instance, ['options', 'fireEvent', 'header', 'datamanager', 'style', 'wrapper', 'rowmanager', 'bodyScrollable']);
-
- this.bindEvents();
- exports.getDropdownHTML = getDropdownHTML = getDropdownHTML.bind(this, this.options.dropdownButton);
- }
-
- _createClass(ColumnManager, [{
- key: 'renderHeader',
- value: function renderHeader() {
- this.header.innerHTML = '';
- this.refreshHeader();
- }
- }, {
- key: 'refreshHeader',
- value: function refreshHeader() {
- var _this = this;
-
- var columns = this.datamanager.getColumns();
-
- if (!(0, _dom2.default)('.data-table-col', this.header)) {
- // insert html
- (0, _dom2.default)('thead', this.header).innerHTML = this.rowmanager.getRowHTML(columns, { isHeader: 1 });
- } else {
- // refresh dom state
- var $cols = _dom2.default.each('.data-table-col', this.header);
- if (columns.length < $cols.length) {
- // deleted column
- (0, _dom2.default)('thead', this.header).innerHTML = this.rowmanager.getRowHTML(columns, { isHeader: 1 });
- return;
- }
-
- $cols.map(function ($col, i) {
- var column = columns[i];
- // column sorted or order changed
- // update colIndex of each header cell
- _dom2.default.data($col, {
- colIndex: column.colIndex
- });
-
- // refresh sort indicator
- var sortIndicator = (0, _dom2.default)('.sort-indicator', $col);
- if (sortIndicator) {
- sortIndicator.innerHTML = _this.options.sortIndicator[column.sortOrder];
- }
- });
- }
- // reset columnMap
- this.$columnMap = [];
- }
- }, {
- key: 'bindEvents',
- value: function bindEvents() {
- this.bindDropdown();
- this.bindResizeColumn();
- this.bindMoveColumn();
- }
- }, {
- key: 'bindDropdown',
- value: function bindDropdown() {
- var _this2 = this;
-
- var $activeDropdown = void 0;
- _dom2.default.on(this.header, 'click', '.data-table-dropdown-toggle', function (e, $button) {
- var $dropdown = _dom2.default.closest('.data-table-dropdown', $button);
-
- if (!$dropdown.classList.contains('is-active')) {
- deactivateDropdown();
- $dropdown.classList.add('is-active');
- $activeDropdown = $dropdown;
- } else {
- deactivateDropdown();
- }
- });
-
- _dom2.default.on(document.body, 'click', function (e) {
- if (e.target.matches('.data-table-dropdown-toggle')) return;
- deactivateDropdown();
- });
-
- var dropdownItems = this.options.headerDropdown;
-
- _dom2.default.on(this.header, 'click', '.data-table-dropdown-list > div', function (e, $item) {
- var $col = _dom2.default.closest('.data-table-col', $item);
-
- var _$$data = _dom2.default.data($item),
- index = _$$data.index;
-
- var _$$data2 = _dom2.default.data($col),
- colIndex = _$$data2.colIndex;
-
- var callback = dropdownItems[index].action;
-
- callback && callback.call(_this2.instance, _this2.getColumn(colIndex));
- });
-
- function deactivateDropdown(e) {
- $activeDropdown && $activeDropdown.classList.remove('is-active');
- $activeDropdown = null;
- }
- }
- }, {
- key: 'bindResizeColumn',
- value: function bindResizeColumn() {
- var _this3 = this;
-
- var isDragging = false;
- var $resizingCell = void 0,
- startWidth = void 0,
- startX = void 0;
-
- _dom2.default.on(this.header, 'mousedown', '.data-table-col .column-resizer', function (e, $handle) {
- document.body.classList.add('data-table-resize');
- var $cell = $handle.parentNode.parentNode;
- $resizingCell = $cell;
-
- var _$$data3 = _dom2.default.data($resizingCell),
- colIndex = _$$data3.colIndex;
-
- var col = _this3.getColumn(colIndex);
-
- if (col && col.resizable === false) {
- return;
- }
-
- isDragging = true;
- startWidth = _dom2.default.style((0, _dom2.default)('.content', $resizingCell), 'width');
- startX = e.pageX;
- });
-
- _dom2.default.on(document.body, 'mouseup', function (e) {
- document.body.classList.remove('data-table-resize');
- if (!$resizingCell) return;
- isDragging = false;
-
- var _$$data4 = _dom2.default.data($resizingCell),
- colIndex = _$$data4.colIndex;
-
- _this3.setColumnWidth(colIndex);
- _this3.style.setBodyStyle();
- $resizingCell = null;
- });
-
- _dom2.default.on(document.body, 'mousemove', function (e) {
- if (!isDragging) return;
- var finalWidth = startWidth + (e.pageX - startX);
-
- var _$$data5 = _dom2.default.data($resizingCell),
- colIndex = _$$data5.colIndex;
-
- if (_this3.getColumnMinWidth(colIndex) > finalWidth) {
- // don't resize past minWidth
- return;
- }
- _this3.datamanager.updateColumn(colIndex, { width: finalWidth });
- _this3.setColumnHeaderWidth(colIndex);
- });
- }
- }, {
- key: 'bindMoveColumn',
- value: function bindMoveColumn() {
- var _this4 = this;
-
- var initialized = void 0;
-
- var initialize = function initialize() {
- if (initialized) {
- _dom2.default.off(document.body, 'mousemove', initialize);
- return;
- }
- var ready = (0, _dom2.default)('.data-table-col', _this4.header);
- if (!ready) return;
-
- var $parent = (0, _dom2.default)('.data-table-row', _this4.header);
-
- _this4.sortable = _sortablejs2.default.create($parent, {
- onEnd: function onEnd(e) {
- var oldIndex = e.oldIndex,
- newIndex = e.newIndex;
-
- var $draggedCell = e.item;
-
- var _$$data6 = _dom2.default.data($draggedCell),
- colIndex = _$$data6.colIndex;
-
- if (+colIndex === newIndex) return;
-
- _this4.switchColumn(oldIndex, newIndex);
- },
- preventOnFilter: false,
- filter: '.column-resizer, .data-table-dropdown',
- animation: 150
- });
- };
-
- _dom2.default.on(document.body, 'mousemove', initialize);
- }
- }, {
- key: 'bindSortColumn',
- value: function bindSortColumn() {
- var _this5 = this;
-
- _dom2.default.on(this.header, 'click', '.data-table-col .column-title', function (e, span) {
- var $cell = span.closest('.data-table-col');
-
- var _$$data7 = _dom2.default.data($cell),
- colIndex = _$$data7.colIndex,
- sortOrder = _$$data7.sortOrder;
-
- sortOrder = (0, _utils.getDefault)(sortOrder, 'none');
- var col = _this5.getColumn(colIndex);
-
- if (col && col.sortable === false) {
- return;
- }
-
- // reset sort indicator
- (0, _dom2.default)('.sort-indicator', _this5.header).textContent = '';
- _dom2.default.each('.data-table-col', _this5.header).map(function ($cell) {
- _dom2.default.data($cell, {
- sortOrder: 'none'
- });
- });
-
- var nextSortOrder = void 0,
- textContent = void 0;
- if (sortOrder === 'none') {
- nextSortOrder = 'asc';
- textContent = '▲';
- } else if (sortOrder === 'asc') {
- nextSortOrder = 'desc';
- textContent = '▼';
- } else if (sortOrder === 'desc') {
- nextSortOrder = 'none';
- textContent = '';
- }
-
- _dom2.default.data($cell, {
- sortOrder: nextSortOrder
- });
- (0, _dom2.default)('.sort-indicator', $cell).textContent = textContent;
-
- _this5.sortColumn(colIndex, nextSortOrder);
- });
- }
- }, {
- key: 'sortColumn',
- value: function sortColumn(colIndex, nextSortOrder) {
- var _this6 = this;
-
- this.instance.freeze();
- this.sortRows(colIndex, nextSortOrder).then(function () {
- _this6.refreshHeader();
- return _this6.rowmanager.refreshRows();
- }).then(function () {
- return _this6.instance.unfreeze();
- }).then(function () {
- _this6.fireEvent('onSortColumn', _this6.getColumn(colIndex));
- });
- }
- }, {
- key: 'removeColumn',
- value: function removeColumn(colIndex) {
- var _this7 = this;
-
- var removedCol = this.getColumn(colIndex);
- this.instance.freeze();
- this.datamanager.removeColumn(colIndex).then(function () {
- _this7.refreshHeader();
- return _this7.rowmanager.refreshRows();
- }).then(function () {
- return _this7.instance.unfreeze();
- }).then(function () {
- _this7.fireEvent('onRemoveColumn', removedCol);
- });
- }
- }, {
- key: 'switchColumn',
- value: function switchColumn(oldIndex, newIndex) {
- var _this8 = this;
-
- this.instance.freeze();
- this.datamanager.switchColumn(oldIndex, newIndex).then(function () {
- _this8.refreshHeader();
- return _this8.rowmanager.refreshRows();
- }).then(function () {
- _this8.setColumnWidth(oldIndex);
- _this8.setColumnWidth(newIndex);
- _this8.instance.unfreeze();
- }).then(function () {
- _this8.fireEvent('onSwitchColumn', _this8.getColumn(oldIndex), _this8.getColumn(newIndex));
- });
- }
- }, {
- key: 'sortRows',
- value: function sortRows(colIndex, sortOrder) {
- return this.datamanager.sortRows(colIndex, sortOrder);
- }
- }, {
- key: 'getColumn',
- value: function getColumn(colIndex) {
- return this.datamanager.getColumn(colIndex);
- }
- }, {
- key: 'getColumns',
- value: function getColumns() {
- return this.datamanager.getColumns();
- }
- }, {
- key: 'setColumnWidth',
- value: function setColumnWidth(colIndex) {
- colIndex = +colIndex;
- this._columnWidthMap = this._columnWidthMap || [];
-
- var _getColumn = this.getColumn(colIndex),
- width = _getColumn.width;
-
- var index = this._columnWidthMap[colIndex];
- var selector = '[data-col-index="' + colIndex + '"] .content, [data-col-index="' + colIndex + '"] .edit-cell';
- var styles = {
- width: width + 'px'
- };
-
- index = this.style.setStyle(selector, styles, index);
- this._columnWidthMap[colIndex] = index;
- }
- }, {
- key: 'setColumnHeaderWidth',
- value: function setColumnHeaderWidth(colIndex) {
- colIndex = +colIndex;
- this.$columnMap = this.$columnMap || [];
- var selector = '[data-col-index="' + colIndex + '"][data-is-header] .content';
-
- var _getColumn2 = this.getColumn(colIndex),
- width = _getColumn2.width;
-
- var $column = this.$columnMap[colIndex];
- if (!$column) {
- $column = this.header.querySelector(selector);
- this.$columnMap[colIndex] = $column;
- }
-
- $column.style.width = width + 'px';
- }
- }, {
- key: 'getColumnMinWidth',
- value: function getColumnMinWidth(colIndex) {
- colIndex = +colIndex;
- return this.getColumn(colIndex).minWidth || 24;
- }
- }, {
- key: 'getFirstColumnIndex',
- value: function getFirstColumnIndex() {
- if (this.options.addCheckboxColumn && this.options.addSerialNoColumn) {
- return 2;
- }
-
- if (this.options.addCheckboxColumn || this.options.addSerialNoColumn) {
- return 1;
- }
-
- return 0;
- }
- }, {
- key: 'getHeaderCell$',
- value: function getHeaderCell$(colIndex) {
- return (0, _dom2.default)('.data-table-col[data-col-index="' + colIndex + '"]', this.header);
- }
- }, {
- key: 'getLastColumnIndex',
- value: function getLastColumnIndex() {
- return this.datamanager.getColumnCount() - 1;
- }
- }, {
- key: 'getSerialColumnIndex',
- value: function getSerialColumnIndex() {
- var columns = this.datamanager.getColumns();
-
- return columns.findIndex(function (column) {
- return column.content.includes('Sr. No');
- });
- }
- }]);
-
- return ColumnManager;
-}();
-
-// eslint-disable-next-line
-
-
-exports.default = ColumnManager;
-var getDropdownHTML = function getDropdownHTML() {
- var dropdownButton = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'v';
-
- // add dropdown buttons
- var dropdownItems = this.options.headerDropdown;
-
- return '' + dropdownButton + '
\n \n ' + dropdownItems.map(function (d, i) {
- return '
' + d.label + '
';
- }).join('') + '\n
\n \n
\n
\n
\n ' + this.options.freezeMessage + '\n
\n \n
\n ' + this.getCellContent(cell) + '\n | \n ';
- }
- }, {
- key: 'getCellContent',
- value: function getCellContent(cell) {
- var isHeader = cell.isHeader;
-
-
- var editable = !isHeader && cell.editable !== false;
- var editCellHTML = editable ? this.getEditCellHTML() : '';
-
- var sortable = isHeader && cell.sortable !== false;
- var sortIndicator = sortable ? '' : '';
-
- var resizable = isHeader && cell.resizable !== false;
- var resizeColumn = resizable ? '' : '';
-
- var hasDropdown = isHeader && cell.dropdown !== false;
- var dropdown = hasDropdown ? '' + (0, _columnmanager.getDropdownHTML)() + '
' : '';
-
- var contentHTML = !cell.isHeader && cell.column.format ? cell.column.format(cell.content) : cell.content;
-
- return '\n \n ' + contentHTML + '\n ' + sortIndicator + '\n ' + resizeColumn + '\n ' + dropdown + '\n
\n ' + editCellHTML + '\n ';
- }
- }, {
- key: 'getEditCellHTML',
- value: function getEditCellHTML() {
- return '\n \n ';
- }
- }, {
- key: 'cellSelector',
- value: function cellSelector(colIndex, rowIndex) {
- return '.data-table-col[data-col-index="' + colIndex + '"][data-row-index="' + rowIndex + '"]';
- }
- }]);
-
- return CellManager;
-}();
-
-exports.default = CellManager;
-module.exports = exports['default'];
-
-/***/ }),
-/* 7 */
-/***/ (function(module, exports) {
-
-module.exports = __WEBPACK_EXTERNAL_MODULE_7__;
-
-/***/ }),
-/* 8 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
- value: true
-});
-
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
-
-var _dom = __webpack_require__(0);
-
-var _dom2 = _interopRequireDefault(_dom);
-
-var _utils = __webpack_require__(1);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-var RowManager = function () {
- function RowManager(instance) {
- _classCallCheck(this, RowManager);
-
- this.instance = instance;
- this.options = this.instance.options;
- this.wrapper = this.instance.wrapper;
- this.bodyScrollable = this.instance.bodyScrollable;
-
- this.bindEvents();
- this.refreshRows = (0, _utils.promisify)(this.refreshRows, this);
- }
-
- _createClass(RowManager, [{
- key: 'bindEvents',
- value: function bindEvents() {
- this.bindCheckbox();
- }
- }, {
- key: 'bindCheckbox',
- value: function bindCheckbox() {
- var _this = this;
-
- if (!this.options.addCheckboxColumn) return;
-
- // map of checked rows
- this.checkMap = [];
-
- _dom2.default.on(this.wrapper, 'click', '.data-table-col[data-col-index="0"] [type="checkbox"]', function (e, $checkbox) {
- var $cell = $checkbox.closest('.data-table-col');
-
- var _$$data = _dom2.default.data($cell),
- rowIndex = _$$data.rowIndex,
- isHeader = _$$data.isHeader;
-
- var checked = $checkbox.checked;
-
- if (isHeader) {
- _this.checkAll(checked);
- } else {
- _this.checkRow(rowIndex, checked);
- }
- });
- }
- }, {
- key: 'refreshRows',
- value: function refreshRows() {
- this.instance.renderBody();
- this.instance.setDimensions();
- }
- }, {
- key: 'refreshRow',
- value: function refreshRow(row, rowIndex) {
- var _this2 = this;
-
- var _row = this.datamanager.updateRow(row, rowIndex);
-
- _row.forEach(function (cell) {
- _this2.cellmanager.refreshCell(cell);
- });
- }
- }, {
- key: 'getCheckedRows',
- value: function getCheckedRows() {
- if (!this.checkMap) {
- return [];
- }
-
- return this.checkMap.map(function (c, rowIndex) {
- if (c) {
- return rowIndex;
- }
- return null;
- }).filter(function (c) {
- return c !== null || c !== undefined;
- });
- }
- }, {
- key: 'highlightCheckedRows',
- value: function highlightCheckedRows() {
- var _this3 = this;
-
- this.getCheckedRows().map(function (rowIndex) {
- return _this3.checkRow(rowIndex, true);
- });
- }
- }, {
- key: 'checkRow',
- value: function checkRow(rowIndex, toggle) {
- var value = toggle ? 1 : 0;
-
- // update internal map
- this.checkMap[rowIndex] = value;
- // set checkbox value explicitly
- _dom2.default.each('.data-table-col[data-row-index="' + rowIndex + '"][data-col-index="0"] [type="checkbox"]', this.bodyScrollable).map(function (input) {
- input.checked = toggle;
- });
- // highlight row
- this.highlightRow(rowIndex, toggle);
- }
- }, {
- key: 'checkAll',
- value: function checkAll(toggle) {
- var value = toggle ? 1 : 0;
-
- // update internal map
- if (toggle) {
- this.checkMap = Array.from(Array(this.getTotalRows())).map(function (c) {
- return value;
- });
- } else {
- this.checkMap = [];
- }
- // set checkbox value
- _dom2.default.each('.data-table-col[data-col-index="0"] [type="checkbox"]', this.bodyScrollable).map(function (input) {
- input.checked = toggle;
- });
- // highlight all
- this.highlightAll(toggle);
- }
- }, {
- key: 'highlightRow',
- value: function highlightRow(rowIndex) {
- var toggle = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
-
- var $row = this.getRow$(rowIndex);
- if (!$row) return;
-
- if (!toggle && this.bodyScrollable.classList.contains('row-highlight-all')) {
- $row.classList.add('row-unhighlight');
- return;
- }
-
- if (toggle && $row.classList.contains('row-unhighlight')) {
- $row.classList.remove('row-unhighlight');
- }
-
- this._highlightedRows = this._highlightedRows || {};
-
- if (toggle) {
- $row.classList.add('row-highlight');
- this._highlightedRows[rowIndex] = $row;
- } else {
- $row.classList.remove('row-highlight');
- delete this._highlightedRows[rowIndex];
- }
- }
- }, {
- key: 'highlightAll',
- value: function highlightAll() {
- var toggle = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
-
- if (toggle) {
- this.bodyScrollable.classList.add('row-highlight-all');
- } else {
- this.bodyScrollable.classList.remove('row-highlight-all');
- for (var rowIndex in this._highlightedRows) {
- var $row = this._highlightedRows[rowIndex];
- $row.classList.remove('row-highlight');
- }
- this._highlightedRows = {};
- }
- }
- }, {
- key: 'getRow$',
- value: function getRow$(rowIndex) {
- return (0, _dom2.default)('.data-table-row[data-row-index="' + rowIndex + '"]', this.bodyScrollable);
- }
- }, {
- key: 'getTotalRows',
- value: function getTotalRows() {
- return this.datamanager.getRowCount();
- }
- }, {
- key: 'getFirstRowIndex',
- value: function getFirstRowIndex() {
- return 0;
- }
- }, {
- key: 'getLastRowIndex',
- value: function getLastRowIndex() {
- return this.datamanager.getRowCount() - 1;
- }
- }, {
- key: 'scrollToRow',
- value: function scrollToRow(rowIndex) {
- rowIndex = +rowIndex;
- this._lastScrollTo = this._lastScrollTo || 0;
- var $row = this.getRow$(rowIndex);
- if (_dom2.default.inViewport($row, this.bodyScrollable)) return;
-
- var _$row$getBoundingClie = $row.getBoundingClientRect(),
- height = _$row$getBoundingClie.height;
-
- var _bodyScrollable$getBo = this.bodyScrollable.getBoundingClientRect(),
- top = _bodyScrollable$getBo.top,
- bottom = _bodyScrollable$getBo.bottom;
-
- var rowsInView = Math.floor((bottom - top) / height);
-
- var offset = 0;
- if (rowIndex > this._lastScrollTo) {
- offset = height * (rowIndex + 1 - rowsInView);
- } else {
- offset = height * (rowIndex + 1 - 1);
- }
-
- this._lastScrollTo = rowIndex;
- _dom2.default.scrollTop(this.bodyScrollable, offset);
- }
- }, {
- key: 'getRowHTML',
- value: function getRowHTML(row, props) {
- var _this4 = this;
-
- var dataAttr = (0, _utils.makeDataAttributeString)(props);
-
- return '\n \n ' + row.map(function (cell) {
- return _this4.cellmanager.getCellHTML(cell);
- }).join('') + '\n
\n ';
- }
- }, {
- key: 'datamanager',
- get: function get() {
- return this.instance.datamanager;
- }
- }, {
- key: 'cellmanager',
- get: function get() {
- return this.instance.cellmanager;
- }
- }]);
-
- return RowManager;
-}();
-
-exports.default = RowManager;
-module.exports = exports['default'];
-
-/***/ }),
-/* 9 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
- value: true
-});
-
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
-
-exports.getBodyHTML = getBodyHTML;
-
-var _dom = __webpack_require__(0);
-
-var _dom2 = _interopRequireDefault(_dom);
-
-var _clusterize = __webpack_require__(10);
-
-var _clusterize2 = _interopRequireDefault(_clusterize);
-
-var _utils = __webpack_require__(1);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-var BodyRenderer = function () {
- function BodyRenderer(instance) {
- _classCallCheck(this, BodyRenderer);
-
- this.instance = instance;
- this.options = instance.options;
- this.datamanager = instance.datamanager;
- this.rowmanager = instance.rowmanager;
- this.cellmanager = instance.cellmanager;
- this.bodyScrollable = instance.bodyScrollable;
- this.log = instance.log;
- this.appendRemainingData = (0, _utils.promisify)(this.appendRemainingData, this);
- }
-
- _createClass(BodyRenderer, [{
- key: 'render',
- value: function render() {
- if (this.options.enableClusterize) {
- this.renderBodyWithClusterize();
- } else {
- this.renderBodyHTML();
- }
- }
- }, {
- key: 'renderBodyHTML',
- value: function renderBodyHTML() {
- var rows = this.datamanager.getRows();
-
- this.bodyScrollable.innerHTML = '\n \n ' + getBodyHTML(rows) + '\n
\n ';
- this.instance.setDimensions();
- this.restoreState();
- }
- }, {
- key: 'renderBodyWithClusterize',
- value: function renderBodyWithClusterize() {
- var _this = this;
-
- // first page
- var rows = this.datamanager.getRows(0, 20);
- var initialData = this.getDataForClusterize(rows);
-
- if (!this.clusterize) {
- // empty body
- this.bodyScrollable.innerHTML = '\n \n ' + getBodyHTML([]) + '\n
\n ';
-
- // first 20 rows will appended
- // rest of them in nextTick
- this.clusterize = new _clusterize2.default({
- rows: initialData,
- scrollElem: this.bodyScrollable,
- contentElem: (0, _dom2.default)('tbody', this.bodyScrollable),
- callbacks: {
- clusterChanged: function clusterChanged() {
- _this.restoreState();
- }
- },
- /* eslint-disable */
- no_data_text: this.options.noDataMessage,
- no_data_class: 'empty-state'
- /* eslint-enable */
- });
-
- // setDimensions requires atleast 1 row to exist in dom
- this.instance.setDimensions();
- } else {
- this.clusterize.update(initialData);
- }
-
- this.appendRemainingData();
- }
- }, {
- key: 'restoreState',
- value: function restoreState() {
- this.rowmanager.highlightCheckedRows();
- this.cellmanager.selectAreaOnClusterChanged();
- this.cellmanager.focusCellOnClusterChanged();
- }
- }, {
- key: 'appendRemainingData',
- value: function appendRemainingData() {
- var rows = this.datamanager.getRows(20);
- var data = this.getDataForClusterize(rows);
- this.clusterize.append(data);
- }
- }, {
- key: 'getDataForClusterize',
- value: function getDataForClusterize(rows) {
- var _this2 = this;
-
- return rows.map(function (row) {
- return _this2.rowmanager.getRowHTML(row, { rowIndex: row[0].rowIndex });
- });
- }
- }]);
-
- return BodyRenderer;
-}();
-
-exports.default = BodyRenderer;
-;
-
-function getBodyHTML(rows) {
- var _this3 = this;
-
- return '\n \n ' + rows.map(function (row) {
- return _this3.rowmanager.getRowHTML(row, { rowIndex: row[0].rowIndex });
- }).join('') + '\n \n ';
-}
-
-/***/ }),
-/* 10 */
-/***/ (function(module, exports) {
-
-module.exports = __WEBPACK_EXTERNAL_MODULE_10__;
-
-/***/ }),
-/* 11 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
- value: true
-});
-
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
-
-var _dom = __webpack_require__(0);
-
-var _dom2 = _interopRequireDefault(_dom);
-
-var _utils = __webpack_require__(1);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-var Style = function () {
- function Style(instance) {
- _classCallCheck(this, Style);
-
- this.instance = instance;
-
- (0, _utils.linkProperties)(this, this.instance, ['options', 'datamanager', 'columnmanager', 'header', 'bodyScrollable', 'getColumn']);
-
- this.scopeClass = 'datatable-instance-' + instance.constructor.instances;
- instance.datatableWrapper.classList.add(this.scopeClass);
-
- var styleEl = document.createElement('style');
- instance.wrapper.insertBefore(styleEl, instance.datatableWrapper);
- this.styleEl = styleEl;
- this.styleSheet = styleEl.sheet;
-
- this.bindResizeWindow();
- }
-
- _createClass(Style, [{
- key: 'bindResizeWindow',
- value: function bindResizeWindow() {
- var _this = this;
-
- if (this.options.layout === 'fluid') {
- _dom2.default.on(window, 'resize', (0, _utils.throttle)(function () {
- _this.distributeRemainingWidth();
- _this.refreshColumnWidth();
- _this.setBodyStyle();
- }, 300));
- }
- }
- }, {
- key: 'destroy',
- value: function destroy() {
- this.styleEl.remove();
- }
- }, {
- key: 'setStyle',
- value: function setStyle(rule, styleMap) {
- var index = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : -1;
-
- var styles = Object.keys(styleMap).map(function (prop) {
- if (!prop.includes('-')) {
- prop = (0, _utils.camelCaseToDash)(prop);
- }
- return prop + ':' + styleMap[prop] + ';';
- }).join('');
- var ruleString = '.' + this.scopeClass + ' ' + rule + ' { ' + styles + ' }';
-
- var _index = this.styleSheet.cssRules.length;
- if (index !== -1) {
- this.styleSheet.deleteRule(index);
- _index = index;
- }
-
- this.styleSheet.insertRule(ruleString, _index);
- return _index;
- }
- }, {
- key: 'setDimensions',
- value: function setDimensions() {
- this.setHeaderStyle();
-
- this.setupMinWidth();
- this.setupNaturalColumnWidth();
- this.setupColumnWidth();
-
- this.distributeRemainingWidth();
- this.setColumnStyle();
- this.setDefaultCellHeight();
- this.setBodyStyle();
- }
- }, {
- key: 'setHeaderStyle',
- value: function setHeaderStyle() {
- if (this.options.layout === 'fluid') {
- // setting width as 0 will ensure that the
- // header doesn't take the available space
- _dom2.default.style(this.header, {
- width: 0
- });
- }
-
- _dom2.default.style(this.header, {
- margin: 0
- });
-
- // don't show resize cursor on nonResizable columns
- var nonResizableColumnsSelector = this.datamanager.getColumns().filter(function (col) {
- return col.resizable === false;
- }).map(function (col) {
- return col.colIndex;
- }).map(function (i) {
- return '.data-table-header [data-col-index="' + i + '"]';
- }).join();
-
- this.setStyle(nonResizableColumnsSelector, {
- cursor: 'pointer'
- });
- }
- }, {
- key: 'setupMinWidth',
- value: function setupMinWidth() {
- var _this2 = this;
-
- _dom2.default.each('.data-table-col', this.header).map(function (col) {
- var width = _dom2.default.style((0, _dom2.default)('.content', col), 'width');
-
- var _$$data = _dom2.default.data(col),
- colIndex = _$$data.colIndex;
-
- var column = _this2.getColumn(colIndex);
-
- if (!column.minWidth) {
- // only set this once
- column.minWidth = width;
- }
- });
- }
- }, {
- key: 'setupNaturalColumnWidth',
- value: function setupNaturalColumnWidth() {
- var _this3 = this;
-
- if (!(0, _dom2.default)('.data-table-row')) return;
-
- // set initial width as naturally calculated by table's first row
- _dom2.default.each('.data-table-row[data-row-index="0"] .data-table-col', this.bodyScrollable).map(function ($cell) {
- var _$$data2 = _dom2.default.data($cell),
- colIndex = _$$data2.colIndex;
-
- var column = _this3.datamanager.getColumn(colIndex);
-
- var naturalWidth = _dom2.default.style((0, _dom2.default)('.content', $cell), 'width');
- column.naturalWidth = naturalWidth;
- });
- }
- }, {
- key: 'setupColumnWidth',
- value: function setupColumnWidth() {
- this.datamanager.getColumns().map(function (column) {
- if (column.width === null) {
- column.width = column.naturalWidth;
- }
- if (column.width < column.minWidth) {
- column.width = column.minWidth;
- }
- });
- }
- }, {
- key: 'distributeRemainingWidth',
- value: function distributeRemainingWidth() {
- var _this4 = this;
-
- if (this.options.layout !== 'fluid') return;
-
- var wrapperWidth = _dom2.default.style(this.instance.datatableWrapper, 'width');
- var headerWidth = _dom2.default.style(this.header, 'width');
- var resizableColumns = this.datamanager.getColumns().filter(function (col) {
- return col.resizable;
- });
- var deltaWidth = (wrapperWidth - headerWidth) / resizableColumns.length;
-
- resizableColumns.map(function (col) {
- var width = _dom2.default.style(_this4.getColumnHeaderElement(col.colIndex), 'width');
- var finalWidth = Math.floor(width + deltaWidth) - 2;
-
- _this4.datamanager.updateColumn(col.colIndex, {
- width: finalWidth
- });
- });
- }
- }, {
- key: 'setDefaultCellHeight',
- value: function setDefaultCellHeight() {
- if (this.__cellHeightSet) return;
- var height = _dom2.default.style((0, _dom2.default)('.data-table-col', this.instance.datatableWrapper), 'height');
- if (height) {
- this.setCellHeight(height);
- this.__cellHeightSet = true;
- }
- }
- }, {
- key: 'setCellHeight',
- value: function setCellHeight(height) {
- this.setStyle('.data-table-col .content', {
- height: height + 'px'
- });
- this.setStyle('.data-table-col .edit-cell', {
- height: height + 'px'
- });
- }
- }, {
- key: 'setColumnStyle',
- value: function setColumnStyle() {
- var _this5 = this;
-
- // align columns
- this.datamanager.getColumns().map(function (column) {
- // alignment
- if (['left', 'center', 'right'].includes(column.align)) {
- _this5.setStyle('[data-col-index="' + column.colIndex + '"]', {
- 'text-align': column.align
- });
- }
- // width
- _this5.columnmanager.setColumnHeaderWidth(column.colIndex);
- _this5.columnmanager.setColumnWidth(column.colIndex);
- });
- this.setBodyStyle();
- }
- }, {
- key: 'refreshColumnWidth',
- value: function refreshColumnWidth() {
- var _this6 = this;
-
- this.datamanager.getColumns().map(function (column) {
- _this6.columnmanager.setColumnHeaderWidth(column.colIndex);
- _this6.columnmanager.setColumnWidth(column.colIndex);
- });
- }
- }, {
- key: 'setBodyStyle',
- value: function setBodyStyle() {
- var width = _dom2.default.style(this.header, 'width');
-
- _dom2.default.style(this.bodyScrollable, {
- width: width + 'px'
- });
-
- _dom2.default.style(this.bodyScrollable, {
- marginTop: _dom2.default.style(this.header, 'height') + 'px'
- });
-
- _dom2.default.style((0, _dom2.default)('table', this.bodyScrollable), {
- margin: 0
- });
- }
- }, {
- key: 'getColumnHeaderElement',
- value: function getColumnHeaderElement(colIndex) {
- colIndex = +colIndex;
- if (colIndex < 0) return null;
- return (0, _dom2.default)('.data-table-col[data-col-index="' + colIndex + '"]', this.header);
- }
- }]);
-
- return Style;
-}();
-
-exports.default = Style;
-module.exports = exports['default'];
-
-/***/ }),
-/* 12 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
- value: true
-});
-
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
-
-var _dom = __webpack_require__(0);
-
-var _dom2 = _interopRequireDefault(_dom);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-var KEYCODES = {
- 13: 'enter',
- 91: 'meta',
- 16: 'shift',
- 17: 'ctrl',
- 18: 'alt',
- 37: 'left',
- 38: 'up',
- 39: 'right',
- 40: 'down',
- 9: 'tab',
- 27: 'esc',
- 67: 'c'
-};
-
-var Keyboard = function () {
- function Keyboard(element) {
- _classCallCheck(this, Keyboard);
-
- this.listeners = {};
- _dom2.default.on(element, 'keydown', this.handler.bind(this));
- }
-
- _createClass(Keyboard, [{
- key: 'handler',
- value: function handler(e) {
- var key = KEYCODES[e.keyCode];
-
- if (e.shiftKey && key !== 'shift') {
- key = 'shift+' + key;
- }
-
- if (e.ctrlKey && key !== 'ctrl' || e.metaKey && key !== 'meta') {
- key = 'ctrl+' + key;
- }
-
- var listeners = this.listeners[key];
-
- if (listeners && listeners.length > 0) {
- var _iteratorNormalCompletion = true;
- var _didIteratorError = false;
- var _iteratorError = undefined;
-
- try {
- for (var _iterator = listeners[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
- var listener = _step.value;
-
- var preventBubbling = listener();
- if (preventBubbling === undefined || preventBubbling === true) {
- e.preventDefault();
- }
- }
- } catch (err) {
- _didIteratorError = true;
- _iteratorError = err;
- } finally {
- try {
- if (!_iteratorNormalCompletion && _iterator.return) {
- _iterator.return();
- }
- } finally {
- if (_didIteratorError) {
- throw _iteratorError;
- }
- }
- }
- }
- }
- }, {
- key: 'on',
- value: function on(key, listener) {
- var _this = this;
-
- var keys = key.split(',').map(function (k) {
- return k.trim();
- });
-
- keys.map(function (key) {
- _this.listeners[key] = _this.listeners[key] || [];
- _this.listeners[key].push(listener);
- });
- }
- }]);
-
- return Keyboard;
-}();
-
-exports.default = Keyboard;
-module.exports = exports['default'];
-
-/***/ }),
-/* 13 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", {
- value: true
-});
-exports.default = {
- columns: [],
- data: [],
- dropdownButton: '▼',
- headerDropdown: [{
- label: 'Sort Ascending',
- action: function action(column) {
- this.sortColumn(column.colIndex, 'asc');
- }
- }, {
- label: 'Sort Descending',
- action: function action(column) {
- this.sortColumn(column.colIndex, 'desc');
- }
- }, {
- label: 'Reset sorting',
- action: function action(column) {
- this.sortColumn(column.colIndex, 'none');
- }
- }, {
- label: 'Remove column',
- action: function action(column) {
- this.removeColumn(column.colIndex);
- }
- }],
- events: {
- onRemoveColumn: function onRemoveColumn(column) {},
- onSwitchColumn: function onSwitchColumn(column1, column2) {},
- onSortColumn: function onSortColumn(column) {}
- },
- sortIndicator: {
- asc: '↑',
- desc: '↓',
- none: ''
- },
- freezeMessage: '',
- getEditor: function getEditor() {},
- addSerialNoColumn: true,
- addCheckboxColumn: false,
- enableClusterize: true,
- enableLogs: false,
- layout: 'fixed', // fixed, fluid
- noDataMessage: 'No Data'
-};
-module.exports = exports['default'];
-
-/***/ }),
-/* 14 */
-/***/ (function(module, exports, __webpack_require__) {
-
-// style-loader: Adds some css to the DOM by adding a