melondtable 1.19.0 → 1.20.7

package/dist/melondtable.js

@@ -290,21 +290,21 @@ var DataTable = (function (Sortable) {
 
     var _freeGlobal = freeGlobal;
 
+    var _freeGlobal$1 = /*#__PURE__*/Object.freeze({
+        default: _freeGlobal,
+        __moduleExports: _freeGlobal
+    });
+
+    var freeGlobal$1 = ( _freeGlobal$1 && _freeGlobal ) || _freeGlobal$1;
+
     /** Detect free variable `self`. */
     var freeSelf = typeof self == 'object' && self && self.Object === Object && self;
 
     /** Used as a reference to the global object. */
-    var root = _freeGlobal || freeSelf || Function('return this')();
+    var root = freeGlobal$1 || freeSelf || Function('return this')();
 
     var _root = root;
 
-    var _root$1 = /*#__PURE__*/Object.freeze({
-        default: _root,
-        __moduleExports: _root
-    });
-
-    var root$1 = ( _root$1 && _root ) || _root$1;
-
     /**
      * Gets the timestamp of the number of milliseconds that have elapsed since
      * the Unix epoch (1 January 1970 00:00:00 UTC).
@@ -322,13 +322,13 @@ var DataTable = (function (Sortable) {
      * // => Logs the number of milliseconds it took for the deferred invocation.
      */
     var now = function() {
-      return root$1.Date.now();
+      return _root.Date.now();
     };
 
     var now_1 = now;
 
     /** Built-in value references. */
-    var Symbol = root$1.Symbol;
+    var Symbol = _root.Symbol;
 
     var _Symbol = Symbol;
 
@@ -461,6 +461,13 @@ var DataTable = (function (Sortable) {
 
     var isObjectLike_1 = isObjectLike;
 
+    var isObjectLike$1 = /*#__PURE__*/Object.freeze({
+        default: isObjectLike_1,
+        __moduleExports: isObjectLike_1
+    });
+
+    var isObjectLike$2 = ( isObjectLike$1 && isObjectLike_1 ) || isObjectLike$1;
+
     /** `Object#toString` result references. */
     var symbolTag = '[object Symbol]';
 
@@ -483,18 +490,11 @@ var DataTable = (function (Sortable) {
      */
     function isSymbol(value) {
       return typeof value == 'symbol' ||
-        (isObjectLike_1(value) && _baseGetTag(value) == symbolTag);
+        (isObjectLike$2(value) && _baseGetTag(value) == symbolTag);
     }
 
     var isSymbol_1 = isSymbol;
 
-    var isSymbol$1 = /*#__PURE__*/Object.freeze({
-        default: isSymbol_1,
-        __moduleExports: isSymbol_1
-    });
-
-    var isSymbol$2 = ( isSymbol$1 && isSymbol_1 ) || isSymbol$1;
-
     /** Used as references for various `Number` constants. */
     var NAN = 0 / 0;
 
@@ -540,7 +540,7 @@ var DataTable = (function (Sortable) {
       if (typeof value == 'number') {
         return value;
       }
-      if (isSymbol$2(value)) {
+      if (isSymbol_1(value)) {
         return NAN;
       }
       if (isObject_1(value)) {
@@ -848,8 +848,13 @@ var DataTable = (function (Sortable) {
 
     var isFunction_1 = isFunction;
 
+    var isFunction$1 = /*#__PURE__*/Object.freeze({
+        default: isFunction_1,
+        __moduleExports: isFunction_1
+    });
+
     /** Used to detect overreaching core-js shims. */
-    var coreJsData = root$1['__core-js_shared__'];
+    var coreJsData = _root['__core-js_shared__'];
 
     var _coreJsData = coreJsData;
 
@@ -899,6 +904,8 @@ var DataTable = (function (Sortable) {
 
     var _toSource = toSource;
 
+    var isFunction$2 = ( isFunction$1 && isFunction_1 ) || isFunction$1;
+
     /**
      * Used to match `RegExp`
      * [syntax characters](http://ecma-international.org/ecma-262/7.0/#sec-patterns).
@@ -936,17 +943,12 @@ var DataTable = (function (Sortable) {
       if (!isObject_1(value) || _isMasked(value)) {
         return false;
       }
-      var pattern = isFunction_1(value) ? reIsNative : reIsHostCtor;
+      var pattern = isFunction$2(value) ? reIsNative : reIsHostCtor;
       return pattern.test(_toSource(value));
     }
 
     var _baseIsNative = baseIsNative;
 
-    var _baseIsNative$1 = /*#__PURE__*/Object.freeze({
-        default: _baseIsNative,
-        __moduleExports: _baseIsNative
-    });
-
     /**
      * Gets the value at `key` of `object`.
      *
@@ -961,8 +963,6 @@ var DataTable = (function (Sortable) {
 
     var _getValue = getValue;
 
-    var baseIsNative$1 = ( _baseIsNative$1 && _baseIsNative ) || _baseIsNative$1;
-
     /**
      * Gets the native function at `key` of `object`.
      *
@@ -973,7 +973,7 @@ var DataTable = (function (Sortable) {
      */
     function getNative(object, key) {
       var value = _getValue(object, key);
-      return baseIsNative$1(value) ? value : undefined;
+      return _baseIsNative(value) ? value : undefined;
     }
 
     var _getNative = getNative;
@@ -1066,6 +1066,11 @@ var DataTable = (function (Sortable) {
 
     var _hashHas = hashHas;
 
+    var _hashHas$1 = /*#__PURE__*/Object.freeze({
+        default: _hashHas,
+        __moduleExports: _hashHas
+    });
+
     /** Used to stand-in for `undefined` hash values. */
     var HASH_UNDEFINED$1 = '__lodash_hash_undefined__';
 
@@ -1088,6 +1093,8 @@ var DataTable = (function (Sortable) {
 
     var _hashSet = hashSet;
 
+    var hashHas$1 = ( _hashHas$1 && _hashHas ) || _hashHas$1;
+
     /**
      * Creates a hash object.
      *
@@ -1110,7 +1117,7 @@ var DataTable = (function (Sortable) {
     Hash.prototype.clear = _hashClear;
     Hash.prototype['delete'] = _hashDelete;
     Hash.prototype.get = _hashGet;
-    Hash.prototype.has = _hashHas;
+    Hash.prototype.has = hashHas$1;
     Hash.prototype.set = _hashSet;
 
     var _Hash = Hash;
@@ -1167,6 +1174,13 @@ var DataTable = (function (Sortable) {
 
     var eq_1 = eq;
 
+    var eq$1 = /*#__PURE__*/Object.freeze({
+        default: eq_1,
+        __moduleExports: eq_1
+    });
+
+    var eq$2 = ( eq$1 && eq_1 ) || eq$1;
+
     /**
      * Gets the index at which the `key` is found in `array` of key-value pairs.
      *
@@ -1178,7 +1192,7 @@ var DataTable = (function (Sortable) {
     function assocIndexOf(array, key) {
       var length = array.length;
       while (length--) {
-        if (eq_1(array[length][0], key)) {
+        if (eq$2(array[length][0], key)) {
           return length;
         }
       }
@@ -1187,6 +1201,13 @@ var DataTable = (function (Sortable) {
 
     var _assocIndexOf = assocIndexOf;
 
+    var _assocIndexOf$1 = /*#__PURE__*/Object.freeze({
+        default: _assocIndexOf,
+        __moduleExports: _assocIndexOf
+    });
+
+    var assocIndexOf$1 = ( _assocIndexOf$1 && _assocIndexOf ) || _assocIndexOf$1;
+
     /** Used for built-in method references. */
     var arrayProto = Array.prototype;
 
@@ -1204,7 +1225,7 @@ var DataTable = (function (Sortable) {
      */
     function listCacheDelete(key) {
       var data = this.__data__,
-          index = _assocIndexOf(data, key);
+          index = assocIndexOf$1(data, key);
 
       if (index < 0) {
         return false;
@@ -1232,7 +1253,7 @@ var DataTable = (function (Sortable) {
      */
     function listCacheGet(key) {
       var data = this.__data__,
-          index = _assocIndexOf(data, key);
+          index = assocIndexOf$1(data, key);
 
       return index < 0 ? undefined : data[index][1];
     }
@@ -1249,7 +1270,7 @@ var DataTable = (function (Sortable) {
      * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
      */
     function listCacheHas(key) {
-      return _assocIndexOf(this.__data__, key) > -1;
+      return assocIndexOf$1(this.__data__, key) > -1;
     }
 
     var _listCacheHas = listCacheHas;
@@ -1266,7 +1287,7 @@ var DataTable = (function (Sortable) {
      */
     function listCacheSet(key, value) {
       var data = this.__data__,
-          index = _assocIndexOf(data, key);
+          index = assocIndexOf$1(data, key);
 
       if (index < 0) {
         ++this.size;
@@ -1307,17 +1328,10 @@ var DataTable = (function (Sortable) {
     var _ListCache = ListCache;
 
     /* Built-in method references that are verified to be native. */
-    var Map = _getNative(root$1, 'Map');
+    var Map = _getNative(_root, 'Map');
 
     var _Map = Map;
 
-    var _Map$1 = /*#__PURE__*/Object.freeze({
-        default: _Map,
-        __moduleExports: _Map
-    });
-
-    var Map$1 = ( _Map$1 && _Map ) || _Map$1;
-
     /**
      * Removes all key-value entries from the map.
      *
@@ -1329,13 +1343,18 @@ var DataTable = (function (Sortable) {
       this.size = 0;
       this.__data__ = {
         'hash': new _Hash,
-        'map': new (Map$1 || _ListCache),
+        'map': new (_Map || _ListCache),
         'string': new _Hash
       };
     }
 
     var _mapCacheClear = mapCacheClear;
 
+    var _mapCacheClear$1 = /*#__PURE__*/Object.freeze({
+        default: _mapCacheClear,
+        __moduleExports: _mapCacheClear
+    });
+
     /**
      * Checks if `value` is suitable for use as unique object key.
      *
@@ -1352,6 +1371,13 @@ var DataTable = (function (Sortable) {
 
     var _isKeyable = isKeyable;
 
+    var _isKeyable$1 = /*#__PURE__*/Object.freeze({
+        default: _isKeyable,
+        __moduleExports: _isKeyable
+    });
+
+    var isKeyable$1 = ( _isKeyable$1 && _isKeyable ) || _isKeyable$1;
+
     /**
      * Gets the data for `map`.
      *
@@ -1362,13 +1388,20 @@ var DataTable = (function (Sortable) {
      */
     function getMapData(map, key) {
       var data = map.__data__;
-      return _isKeyable(key)
+      return isKeyable$1(key)
         ? data[typeof key == 'string' ? 'string' : 'hash']
         : data.map;
     }
 
     var _getMapData = getMapData;
 
+    var _getMapData$1 = /*#__PURE__*/Object.freeze({
+        default: _getMapData,
+        __moduleExports: _getMapData
+    });
+
+    var getMapData$1 = ( _getMapData$1 && _getMapData ) || _getMapData$1;
+
     /**
      * Removes `key` and its value from the map.
      *
@@ -1379,7 +1412,7 @@ var DataTable = (function (Sortable) {
      * @returns {boolean} Returns `true` if the entry was removed, else `false`.
      */
     function mapCacheDelete(key) {
-      var result = _getMapData(this, key)['delete'](key);
+      var result = getMapData$1(this, key)['delete'](key);
       this.size -= result ? 1 : 0;
       return result;
     }
@@ -1396,7 +1429,7 @@ var DataTable = (function (Sortable) {
      * @returns {*} Returns the entry value.
      */
     function mapCacheGet(key) {
-      return _getMapData(this, key).get(key);
+      return getMapData$1(this, key).get(key);
     }
 
     var _mapCacheGet = mapCacheGet;
@@ -1411,7 +1444,7 @@ var DataTable = (function (Sortable) {
      * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
      */
     function mapCacheHas(key) {
-      return _getMapData(this, key).has(key);
+      return getMapData$1(this, key).has(key);
     }
 
     var _mapCacheHas = mapCacheHas;
@@ -1427,7 +1460,7 @@ var DataTable = (function (Sortable) {
      * @returns {Object} Returns the map cache instance.
      */
     function mapCacheSet(key, value) {
-      var data = _getMapData(this, key),
+      var data = getMapData$1(this, key),
           size = data.size;
 
       data.set(key, value);
@@ -1437,6 +1470,8 @@ var DataTable = (function (Sortable) {
 
     var _mapCacheSet = mapCacheSet;
 
+    var mapCacheClear$1 = ( _mapCacheClear$1 && _mapCacheClear ) || _mapCacheClear$1;
+
     /**
      * Creates a map cache object to store key-value pairs.
      *
@@ -1456,7 +1491,7 @@ var DataTable = (function (Sortable) {
     }
 
     // Add methods to `MapCache`.
-    MapCache.prototype.clear = _mapCacheClear;
+    MapCache.prototype.clear = mapCacheClear$1;
     MapCache.prototype['delete'] = _mapCacheDelete;
     MapCache.prototype.get = _mapCacheGet;
     MapCache.prototype.has = _mapCacheHas;
@@ -1585,13 +1620,6 @@ var DataTable = (function (Sortable) {
 
     var _strictIndexOf = strictIndexOf;
 
-    var _strictIndexOf$1 = /*#__PURE__*/Object.freeze({
-        default: _strictIndexOf,
-        __moduleExports: _strictIndexOf
-    });
-
-    var strictIndexOf$1 = ( _strictIndexOf$1 && _strictIndexOf ) || _strictIndexOf$1;
-
     /**
      * The base implementation of `_.indexOf` without `fromIndex` bounds checks.
      *
@@ -1603,12 +1631,19 @@ var DataTable = (function (Sortable) {
      */
     function baseIndexOf(array, value, fromIndex) {
       return value === value
-        ? strictIndexOf$1(array, value, fromIndex)
+        ? _strictIndexOf(array, value, fromIndex)
         : _baseFindIndex(array, _baseIsNaN, fromIndex);
     }
 
     var _baseIndexOf = baseIndexOf;
 
+    var _baseIndexOf$1 = /*#__PURE__*/Object.freeze({
+        default: _baseIndexOf,
+        __moduleExports: _baseIndexOf
+    });
+
+    var baseIndexOf$1 = ( _baseIndexOf$1 && _baseIndexOf ) || _baseIndexOf$1;
+
     /**
      * A specialized version of `_.includes` for arrays without support for
      * specifying an index to search from.
@@ -1620,11 +1655,16 @@ var DataTable = (function (Sortable) {
      */
     function arrayIncludes(array, value) {
       var length = array == null ? 0 : array.length;
-      return !!length && _baseIndexOf(array, value, 0) > -1;
+      return !!length && baseIndexOf$1(array, value, 0) > -1;
     }
 
     var _arrayIncludes = arrayIncludes;
 
+    var _arrayIncludes$1 = /*#__PURE__*/Object.freeze({
+        default: _arrayIncludes,
+        __moduleExports: _arrayIncludes
+    });
+
     /**
      * This function is like `arrayIncludes` except that it accepts a comparator.
      *
@@ -1663,7 +1703,7 @@ var DataTable = (function (Sortable) {
     var _cacheHas = cacheHas;
 
     /* Built-in method references that are verified to be native. */
-    var Set$1 = _getNative(root$1, 'Set');
+    var Set$1 = _getNative(_root, 'Set');
 
     var _Set = Set$1;
 
@@ -1720,6 +1760,8 @@ var DataTable = (function (Sortable) {
 
     var _createSet = createSet;
 
+    var arrayIncludes$1 = ( _arrayIncludes$1 && _arrayIncludes ) || _arrayIncludes$1;
+
     /** Used as the size to enable large array optimizations. */
     var LARGE_ARRAY_SIZE = 200;
 
@@ -1734,7 +1776,7 @@ var DataTable = (function (Sortable) {
      */
     function baseUniq(array, iteratee, comparator) {
       var index = -1,
-          includes = _arrayIncludes,
+          includes = arrayIncludes$1,
           length = array.length,
           isCommon = true,
           result = [],
@@ -2033,6 +2075,7 @@ var DataTable = (function (Sortable) {
                     sortable: false,
                     focusable: false,
                     dropdown: false,
+                    sticky: true,
                     width: 32
                 };
                 this.columns.push(cell);
@@ -2041,16 +2084,14 @@ var DataTable = (function (Sortable) {
             if (this.options.serialNoColumn && !this.hasColumnById('_rowIndex')) {
                 let cell = {
                     id: '_rowIndex',
-                    content: '',
+                    content: this.options.serialNoColumnLabel || '',
                     align: 'center',
                     editable: false,
-                    resizable: false,
+                    resizable: true,
                     focusable: false,
-                    dropdown: false
+                    dropdown: false,
+                    sticky: true
                 };
-                if (this.options.data.length > 1000) {
-                    cell.resizable = true;
-                }
                 this.columns.push(cell);
             }
         }
@@ -2634,6 +2675,7 @@ var DataTable = (function (Sortable) {
             this.bindKeyboardSelection();
             this.bindCopyCellContents();
             this.bindMouseEvents();
+            this.bindWheelEvents();
             this.bindTreeEvents();
         }
 
@@ -2682,6 +2724,7 @@ var DataTable = (function (Sortable) {
                 }
 
                 this.focusCell($cell);
+                sessionStorage.setItem('dt-last-nav-method', 'key');
                 return true;
             };
 
@@ -2790,6 +2833,12 @@ var DataTable = (function (Sortable) {
             $.on(this.bodyScrollable, 'mousemove', '.dt-cell', throttle$1(selectArea, 50));
         }
 
+        bindWheelEvents() {
+            $.on(this.bodyScrollable, 'wheel', (e) => {
+                sessionStorage.setItem('dt-last-nav-method', 'scroll');
+            });
+        }
+
         bindTreeEvents() {
             $.on(this.bodyScrollable, 'click', '.dt-tree-node__toggle', (e, $toggle) => {
                 const $cell = $.closest('.dt-cell', $toggle);
@@ -2914,11 +2963,13 @@ var DataTable = (function (Sortable) {
             // this function is called after hyperlist renders the rows after scroll,
             // focusCell calls clearSelection which resets the area selection
             // so a flag to skip it
-            // we also skip DOM focus and scroll to cell
-            // because it fights with the user scroll
+            // we skip scroll to cell
+            // and also skip DOM focus (if user is scrolling) because it fights with the user scroll
+            const skipDOMFocus = sessionStorage.getItem('dt-last-nav-method') !== 'key';
+
             this.focusCell($cell, {
+                skipDOMFocus,
                 skipClearSelection: 1,
-                skipDOMFocus: 1,
                 skipScrollToCell: 1
             });
         }
@@ -3315,6 +3366,7 @@ var DataTable = (function (Sortable) {
             }
 
             this.focusCell($cell);
+            sessionStorage.setItem('dt-last-nav-method', 'key');
             return true;
         }
 
@@ -3413,8 +3465,15 @@ var DataTable = (function (Sortable) {
             });
 
             const row = this.datamanager.getRow(rowIndex);
+            const column = cell.column || this.datamanager.getColumn(colIndex) || {};
 
             const isBodyCell = !(isHeader || isFilter || isTotalRow);
+            const isSticky = Boolean(column.sticky);
+            const stickyColumns = this.datamanager.getColumns().filter(col => col.sticky);
+            const lastStickyColumn = stickyColumns[stickyColumns.length - 1];
+            const isLastStickyColumn = isSticky &&
+                lastStickyColumn &&
+                lastStickyColumn.colIndex === colIndex;
 
             const className = [
                 'dt-cell',
@@ -3424,7 +3483,10 @@ var DataTable = (function (Sortable) {
                 isHeader ? 'dt-cell--header' : '',
                 isHeader ? `dt-cell--header-${colIndex}` : '',
                 isFilter ? 'dt-cell--filter' : '',
-                isBodyCell && (row && row.meta.isTreeNodeClose) ? 'dt-cell--tree-close' : ''
+                isBodyCell && (row && row.meta.isTreeNodeClose) ? 'dt-cell--tree-close' : '',
+                isSticky ? 'dt-cell--sticky' : '',
+                isSticky && !isBodyCell ? 'dt-cell--sticky-top' : '',
+                isLastStickyColumn ? 'dt-cell--sticky-last' : ''
             ].join(' ');
 
             return `
@@ -3622,7 +3684,7 @@ var DataTable = (function (Sortable) {
             });
 
             $.on(this.$dropdownList, 'click', '.dt-dropdown__list-item', (e, $item) => {
-                if (!this._dropdownActiveColIndex) return;
+                if (this._dropdownActiveColIndex == null) return;
                 const dropdownItems = this.options.headerDropdown;
                 const { index } = $.data($item);
                 const colIndex = this._dropdownActiveColIndex;
@@ -3637,6 +3699,11 @@ var DataTable = (function (Sortable) {
                 _this.hideDropdown();
             }
 
+            this.stickDropdownIndex = this.options.headerDropdown
+                .findIndex(item => item.stickyAction === 'stick');
+            this.unstickDropdownIndex = this.options.headerDropdown
+                .findIndex(item => item.stickyAction === 'unstick');
+
             this.hideDropdown();
         }
 
@@ -3653,6 +3720,7 @@ var DataTable = (function (Sortable) {
             const $cell = $.closest('.dt-cell', e.target);
             const { colIndex } = $.data($cell);
             this._dropdownActiveColIndex = colIndex;
+            this.updateStickyDropdownItems(this.getColumn(colIndex));
         }
 
         hideDropdown() {
@@ -3833,6 +3901,20 @@ var DataTable = (function (Sortable) {
                 });
         }
 
+        setColumnSticky(colIndex, sticky) {
+            const column = this.getColumn(colIndex);
+            if (!column || column.sticky === sticky) {
+                return;
+            }
+
+            this.instance.freeze();
+            this.datamanager.updateColumn(colIndex, { sticky });
+
+            this.refreshHeader();
+            this.rowmanager.refreshRows()
+                .then(() => this.instance.unfreeze());
+        }
+
         switchColumn(oldIndex, newIndex) {
             this.instance.freeze();
             this.datamanager.switchColumn(oldIndex, newIndex)
@@ -4022,6 +4104,23 @@ var DataTable = (function (Sortable) {
         toggleDropdownItem(index) {
             $('.dt-dropdown__list', this.instance.dropdownContainer).children[index].classList.toggle('dt-hidden');
         }
+
+        updateStickyDropdownItems(column) {
+            if (!column) return;
+            if (this.stickDropdownIndex === -1 || this.unstickDropdownIndex === -1) return;
+
+            const stickItem = this.$dropdownList.children[this.stickDropdownIndex];
+            const unstickItem = this.$dropdownList.children[this.unstickDropdownIndex];
+            if (!(stickItem && unstickItem)) return;
+
+            if (column.sticky) {
+                stickItem.classList.add('dt-hidden');
+                unstickItem.classList.remove('dt-hidden');
+            } else {
+                stickItem.classList.remove('dt-hidden');
+                unstickItem.classList.add('dt-hidden');
+            }
+        }
     }
 
     class RowManager {
@@ -4889,12 +4988,26 @@ var DataTable = (function (Sortable) {
         }
 
         render() {
-            const rows = this.datamanager.getRowsForView();
+            const rows = this.getRowsToRender();
             this.renderRows(rows);
             // setDimensions requires atleast 1 row to exist in dom
             this.instance.setDimensions();
         }
 
+        // Keep the current tree expand/collapse state on a full re-render
+        getRowsToRender() {
+            const rows = this.datamanager.getRowsForView();
+            let closedIndent = null;
+            return rows.filter(row => {
+                const { indent, isTreeNodeClose } = row.meta;
+                if (closedIndent !== null && indent > closedIndent) {
+                    return false;
+                }
+                closedIndent = isTreeNodeClose ? indent : null;
+                return true;
+            });
+        }
+
         renderFooter() {
             if (!this.options.showTotalRow) return;
 
@@ -5024,6 +5137,7 @@ var DataTable = (function (Sortable) {
 
         bindScrollHeader() {
             this._settingHeaderPosition = false;
+            this.updateStickyTopPositions(0);
 
             $.on(this.bodyScrollable, 'scroll', (e) => {
                 if (this._settingHeaderPosition) return;
@@ -5031,7 +5145,8 @@ var DataTable = (function (Sortable) {
                 this._settingHeaderPosition = true;
 
                 requestAnimationFrame(() => {
-                    const left = -e.target.scrollLeft;
+                    const scrollLeft = e.target.scrollLeft;
+                    const left = -scrollLeft;
 
                     $.style(this.header, {
                         transform: `translateX(${left}px)`
@@ -5039,6 +5154,7 @@ var DataTable = (function (Sortable) {
                     $.style(this.footer, {
                         transform: `translateX(${left}px)`
                     });
+                    this.updateStickyTopPositions(scrollLeft);
                     this._settingHeaderPosition = false;
                     if (this.instance.noData) {
                         $.style($('.no-data-message'), {
@@ -5136,6 +5252,8 @@ var DataTable = (function (Sortable) {
             this.setupColumnWidth();
             this.distributeRemainingWidth();
             this.setColumnStyle();
+            this.setStickyColumnStyle();
+            this.updateStickyTopPositions(this.bodyScrollable.scrollLeft || 0);
             this.setBodyStyle();
         }
 
@@ -5293,6 +5411,8 @@ var DataTable = (function (Sortable) {
                     this.columnmanager.setColumnHeaderWidth(column.colIndex);
                     this.columnmanager.setColumnWidth(column.colIndex);
                 });
+            this.setStickyColumnStyle();
+            this.updateStickyTopPositions(this.bodyScrollable.scrollLeft || 0);
         }
 
         setBodyStyle() {
@@ -5354,6 +5474,56 @@ var DataTable = (function (Sortable) {
             return $(`.dt-cell--col-${colIndex}`, this.header);
         }
 
+        setStickyColumnStyle() {
+            if (!this.datamanager || !this.datamanager.getColumns) return;
+
+            const stickySelectors = [];
+            let stickyOffset = 0;
+            let normalOffset = 0;
+
+            this.datamanager.getColumns().forEach((column) => {
+                const $headerCell = this.getColumnHeaderElement(column.colIndex);
+                const renderedWidth = $headerCell ? $headerCell.offsetWidth : column.width;
+
+                if (column.sticky) {
+                    const selector = `.dt-cell--col-${column.colIndex}.dt-cell--sticky`;
+                    const style = {
+                        left: `${stickyOffset}px`
+                    };
+
+                    column.stickyLeft = stickyOffset;
+                    column.stickyScrollTrigger = normalOffset - stickyOffset;
+                    column.renderedWidth = renderedWidth;
+                    this.setStyle(selector, style);
+                    stickySelectors.push(selector);
+                    stickyOffset += renderedWidth;
+                }
+                normalOffset += renderedWidth;
+            });
+
+            const staleSelectors = (this._stickySelectors || [])
+                .filter(selector => !stickySelectors.includes(selector));
+
+            staleSelectors.forEach(selector => this.removeStyle(selector));
+            this._stickySelectors = stickySelectors;
+        }
+
+        updateStickyTopPositions(scrollLeft) {
+            if (!this.datamanager || !this.datamanager.getColumns) return;
+
+            const stickyColumns = this.datamanager.getColumns().filter(column => column.sticky);
+
+            stickyColumns.forEach((column) => {
+                const trigger = Math.max(0, column.stickyScrollTrigger || 0);
+                const compensation = Math.max(0, scrollLeft - trigger);
+                const cells = $.each(`.dt-cell--col-${column.colIndex}.dt-cell--sticky-top`, this.wrapper) || [];
+
+                $.style(cells, {
+                    transform: compensation ? `translateX(${compensation}px)` : ''
+                });
+            });
+        }
+
         getRowIndexColumnWidth() {
             const rowCount = this.datamanager.getRowCount();
             const padding = 22;
@@ -5417,7 +5587,11 @@ var DataTable = (function (Sortable) {
         }
     }
 
+    var Freeze = "Freeze";
+    var Unfreeze = "Unfreeze";
     var en = {
+    	Freeze: Freeze,
+    	Unfreeze: Unfreeze,
     	"Sort Ascending": "Sort Ascending",
     	"Sort Descending": "Sort Descending",
     	"Reset sorting": "Reset sorting",
@@ -5427,7 +5601,11 @@ var DataTable = (function (Sortable) {
     	"{count} rows selected": {"1":"{count} row selected","default":"{count} rows selected"}
     };
 
+    var Freeze$1 = "Bevriezen";
+    var Unfreeze$1 = "Ontdooien";
     var de = {
+    	Freeze: Freeze$1,
+    	Unfreeze: Unfreeze$1,
     	"Sort Ascending": "Aufsteigend sortieren",
     	"Sort Descending": "Absteigend sortieren",
     	"Reset sorting": "Sortierung zurücksetzen",
@@ -5437,7 +5615,11 @@ var DataTable = (function (Sortable) {
     	"{count} rows selected": {"1":"{count} Zeile ausgewählt","default":"{count} Zeilen ausgewählt"}
     };
 
+    var Freeze$2 = "Geler";
+    var Unfreeze$2 = "Dégeler";
     var fr = {
+    	Freeze: Freeze$2,
+    	Unfreeze: Unfreeze$2,
     	"Sort Ascending": "Trier par ordre croissant",
     	"Sort Descending": "Trier par ordre décroissant",
     	"Reset sorting": "Réinitialiser le tri",
@@ -5447,7 +5629,11 @@ var DataTable = (function (Sortable) {
     	"{count} rows selected": {"1":"{count} ligne sélectionnée","default":"{count} lignes sélectionnées"}
     };
 
+    var Freeze$3 = "Congelare";
+    var Unfreeze$3 = "Dégeler";
     var it = {
+    	Freeze: Freeze$3,
+    	Unfreeze: Unfreeze$3,
     	"Sort Ascending": "Ordinamento ascendente",
     	"Sort Descending": "Ordinamento decrescente",
     	"Reset sorting": "Azzeramento ordinamento",
@@ -5729,6 +5915,22 @@ var DataTable = (function (Sortable) {
                     action: function (column) {
                         this.removeColumn(column.colIndex);
                     }
+                },
+                {
+                    label: instance.translate('Freeze'),
+                    stickyAction: 'stick',
+                    display: 'hidden',
+                    action: function (column) {
+                        this.setColumnSticky(column.colIndex, true);
+                    }
+                },
+                {
+                    label: instance.translate('Unfreeze'),
+                    stickyAction: 'unstick',
+                    display: 'hidden',
+                    action: function (column) {
+                        this.setColumnSticky(column.colIndex, false);
+                    }
                 }
             ],
             events: {
@@ -5753,6 +5955,7 @@ var DataTable = (function (Sortable) {
             freezeMessage: '',
             getEditor: null,
             serialNoColumn: true,
+            serialNoColumnLabel: '',
             checkboxColumn: false,
             clusterize: true,
             logs: false,
@@ -5984,6 +6187,10 @@ var DataTable = (function (Sortable) {
             this.columnmanager.removeColumn(colIndex);
         }
 
+        setColumnSticky(colIndex, sticky) {
+            this.columnmanager.setColumnSticky(colIndex, sticky);
+        }
+
         scrollToLastColumn() {
             this.datatableWrapper.scrollLeft = 9999;
         }
@@ -6063,7 +6270,7 @@ var DataTable = (function (Sortable) {
     var jsdelivr = "dist/melondtable.min.js";
     var scripts = {"start":"yarn run dev","build":"rollup -c && NODE_ENV=production rollup -c","dev":"rollup -c -w","cy:server":"http-server -p 8989","cy:open":"cypress open","cy:run":"cypress run","test":"start-server-and-test cy:server http://localhost:8989 cy:run","test-local":"start-server-and-test cy:server http://localhost:8989 cy:open","travis-deploy-once":"travis-deploy-once","semantic-release":"semantic-release","lint":"eslint src","lint-and-build":"yarn lint && yarn build","commit":"npx git-cz"};
     var files = ["dist","src"];
-    var devDependencies = {"autoprefixer":"^9.0.0","chai":"3.5.0","cypress":"^9.2.0","cz-conventional-changelog":"^2.1.0","deepmerge":"^2.0.1","eslint":"^5.0.1","eslint-config-airbnb":"^16.1.0","eslint-config-airbnb-base":"^12.1.0","eslint-plugin-import":"^2.11.0","http-server":"^0.11.1","mocha":"3.3.0","postcss-custom-properties":"^7.0.0","postcss-nested":"^3.0.0","rollup":"^0.59.4","rollup-plugin-commonjs":"^8.3.0","rollup-plugin-eslint":"^4.0.0","rollup-plugin-json":"^2.3.0","rollup-plugin-node-resolve":"^3.0.3","rollup-plugin-postcss":"^1.2.8","rollup-plugin-uglify-es":"^0.0.1","semantic-release":"^17.1.1","start-server-and-test":"^1.4.1","travis-deploy-once":"^5.0.1"};
+    var devDependencies = {"autoprefixer":"^9.0.0","chai":"3.5.0","cypress":"^9.2.0","cz-conventional-changelog":"^2.1.0","deepmerge":"^2.0.1","eslint":"^5.0.1","eslint-config-airbnb":"^16.1.0","eslint-config-airbnb-base":"^12.1.0","eslint-plugin-import":"^2.11.0","http-server":"^0.11.1","mocha":"3.3.0","postcss-custom-properties":"^7.0.0","postcss-nested":"^3.0.0","rollup":"^0.59.4","rollup-plugin-commonjs":"^8.3.0","rollup-plugin-eslint":"^4.0.0","rollup-plugin-json":"^2.3.0","rollup-plugin-node-resolve":"^3.0.3","rollup-plugin-postcss":"^1.2.8","rollup-plugin-uglify-es":"^0.0.1","semantic-release":"^25.0.3","start-server-and-test":"^1.4.1","travis-deploy-once":"^5.0.1"};
     var repository = {"type":"git","url":"https://github.com/amonak/melondtable.git"};
     var keywords = ["datatable","data","grid","table"];
     var author = "Alphamonak Solutions";