UNPKG

@progress/kendo-ui

Version:

This package is part of the [Kendo UI for jQuery](http://www.telerik.com/kendo-ui) suite.

1,334 lines (1,148 loc) 591 kB
'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); require('./kendo.data.js'); require('./kendo.columnsorter.js'); require('./kendo.editable.js'); require('./kendo.window.js'); require('./kendo.filtermenu.js'); require('./kendo.filtercell.js'); require('./kendo.columnmenu.js'); require('./kendo.groupable.js'); require('./kendo.pager.js'); require('./kendo.selectable.js'); require('./kendo.sortable.js'); require('./kendo.reorderable.js'); require('./kendo.resizable.js'); require('./kendo.ooxml.js'); require('./mixins-RbnksPfz.js'); require('./kendo.pane.js'); require('./kendo.core.js'); require('./html-sdnHcjkh.js'); require('./mixins-D385O08Q.js'); require('./kendo.dialog.js'); require('./kendo.switch.js'); require('./kendo.html.button.js'); require('./kendo.textbox.js'); require('./kendo.form.js'); require('./kendo.toolbar.js'); require('./kendo.icons.js'); require('./kendo.menu.js'); require('./kendo.loader.js'); require('./kendo.html.loadercontainer.js'); var loaderContainer = require('./loaderContainer-_4RtKBV7.js'); require('./kendo.data.odata.js'); require('./kendo.licensing.js'); require('@progress/kendo-licensing'); require('./kendo.data.xml.js'); require('./kendo.html.icon.js'); require('./kendo.html.base.js'); require('@progress/kendo-svg-icons'); require('./kendo.checkbox.js'); require('./kendo.toggleinputbase.js'); require('./kendo.html.input.js'); require('./kendo.dropdownlist.js'); require('./kendo.list.js'); require('./kendo.popup.js'); require('./kendo.label.js'); require('./kendo.floatinglabel.js'); require('./kendo.actionsheet.js'); require('./dropdowns-loader-Bc4IELFi.js'); require('./kendo.mobile.scroller.js'); require('./kendo.fx.js'); require('./kendo.draganddrop.js'); require('./kendo.userevents.js'); require('./kendo.virtuallist.js'); require('./valueMapper-q_OtZ-Tj.js'); require('./kendo.datepicker.js'); require('./kendo.calendar.js'); require('./kendo.dateinput.js'); require('@progress/kendo-dateinputs-common'); require('./kendo.numerictextbox.js'); require('./prefix-suffix-containers-BmDm564f.js'); require('./kendo.validator.js'); require('./kendo.binder.js'); require('./kendo.otpinput.js'); require('./kendo.buttongroup.js'); require('./kendo.togglebutton.js'); require('./kendo.button.js'); require('./kendo.badge.js'); require('./kendo.autocomplete.js'); require('./kendo.combobox.js'); require('./kendo.tabstrip.js'); require('./kendo.expansionpanel.js'); require('./kendo.view.js'); require('./kendo.chip.js'); require('./kendo.html.chip.js'); require('./kendo.chiplist.js'); require('./kendo.html.chiplist.js'); require('@progress/kendo-ooxml'); require('@progress/kendo-drawing'); require('./kendo.color.js'); require('./kendo.splitbutton.js'); require('./kendo.button.menu.js'); require('./kendo.dropdownbutton.js'); (function($, undefined$1) { var kendo = window.kendo, ui = kendo.ui, ContextMenu = ui.ContextMenu, extend = $.extend, encode = kendo.htmlEncode; var ACTION = "action"; var GridContextMenu = ContextMenu.extend({ init: function(element, options) { var that = this; ContextMenu.fn.init.call(that, element, options); that._overrideTemplates(); that._extendItems(); that.bind("select", that._onSelect.bind(that)); that.bind("open", that._onOpen.bind(that)); }, _overrideTemplates: function() { this.templates.sprite = ({ icon, spriteCssClass }) => `${(icon || spriteCssClass) ? kendo.ui.icon({ icon: encode(icon || ""), iconClass: encode(spriteCssClass || "") }) : ''}`; }, defaultItems: { "separator": { name: "separator", separator: true }, "create": { name: "create", text: "Add", icon: "plus", command: "AddCommand", rules: "isEditable" }, "edit": { name: "edit", text: "Edit", icon: "pencil", command: "EditCommand", rules: "isEditable" }, "destroy": { name: "destroy", text: "Delete", icon: "trash", command: "DeleteCommand", rules: "isEditable" }, "select": { name: "select", text: "Select", icon: "table-body", rules: "isSelectable", items: [ { name: "selectRow", text: "Row", icon: "table-row-groups", command: "SelectRowCommand" }, { name: "selectAllRows", text: "All rows", icon: "grid", command: "SelectAllRowsCommand" }, { name: "clearSelection", text: "Clear selection", icon: "table-unmerge", softRules: "hasSelection", command: "ClearSelectionCommand" }, ] }, "copySelection": { name: "copySelection", text: "Copy selection", icon: "page-header-section", rules: "isSelectable", softRules: "hasSelection", command: "CopySelectionCommand", options: "withHeaders" }, "copySelectionNoHeaders": { name: "copySelectionNoHeaders", text: "Copy selection (No Headers)", icon: "file-txt", rules: "isSelectable", softRules: "hasSelection", command: "CopySelectionCommand" }, "paste": { name: "paste", text: "Paste (use CTRL/⌘ + V)", rules: "allowPaste", softRules: "alwaysDisabled", icon: "clipboard" }, "reorderRow": { name: "reorderRow", text: "Reorder row", icon: "caret-alt-expand", rules: "isRowReorderable", softRules: "isSorted", items: [ { name: "reorderRowUp", text: "Up", icon: "caret-alt-up", command: "ReorderRowCommand", options: "dir:up" }, { name: "reorderRowDown", text: "Down", icon: "caret-alt-down", command: "ReorderRowCommand", options: "dir:down" }, { name: "reorderRowTop", text: "Top", icon: "caret-alt-to-top", command: "ReorderRowCommand", options: "dir:top" }, { name: "reorderRowBottom", text: "Bottom", icon: "caret-alt-to-bottom", command: "ReorderRowCommand", options: "dir:bottom" } ] }, "exportPDF": { name: "exportPDF", text: "Export to PDF", icon: "file-pdf", command: "ExportPDFCommand" }, "exportExcel": { name: "exportExcel", text: "Export to Excel", icon: "file-excel", items: [ { name: "exportToExcelAll", text: "All", command: "ExportExcelCommand" }, { name: "exportToExcelSelection", text: "Selection", command: "ExportExcelCommand", softRules: "hasSelection", options: "selection,withHeaders" }, { name: "exportToExcelSelectionNoHeaders", text: "Selection (No Headers)", softRules: "hasSelection", command: "ExportExcelCommand", options: "selection" } ] }, "sortAsc": { name: "sortAsc", text: "Sort Ascending", icon: "sort-asc-small", rules: "isSortable", command: "SortCommand", options: "dir:asc" }, "sortDesc": { name: "sortDesc", text: "Sort Descending", icon: "sort-desc-small", rules: "isSortable", command: "SortCommand", options: "dir:desc" }, "moveGroupPrevious": { name: "moveGroupPrevious", text: "Move previous", icon: "arrow-left", rules: "isGroupable", softRules: "canMoveGroupPrev", command: "MoveGroupCommand", options: "dir:prev" }, "moveGroupNext": { name: "moveGroupNext", text: "Move next", icon: "arrow-right", rules: "isGroupable", softRules: "canMoveGroupNext", command: "MoveGroupCommand", options: "dir:next" } // "filter": { name: "filter", text: "Filter", icon: "filter", attr: { [kendo.attr("is-filter")]: true }, items: [ // { content: '<div class="k-columnmenu-item-wrapper"><div class="k-columnmenu-item-content k-column-menu-filter"><div class="k-filterable"></div></div></div>' } // ] }, }, events: ContextMenu.fn.events.concat([ ACTION ]), _onSelect: function(ev) { var command = $(ev.item).data("command"); var options = $(ev.item).data("options"); options = options ? options.split(",") .map(val => { if (val.indexOf(":") > -1) { var [key, val] = val.split(":"); return { [key || "_"]: val }; } return { [val]: true }; }) .reduce((acc, v) => Object.assign(acc, v), {}) : {}; var target = $(ev.target); if (!command) { return; } this.action({ command: command, options: Object.assign(options, { target: target }) }); }, _onOpen: function(ev) { var menu = ev.sender, items = menu.options.items, elTarget = $(ev.event ? ev.event.target : null); if ((!items && $.isEmptyObject(this.defaultItems)) || elTarget.closest(".k-grid-column-menu").length) { ev.preventDefault(); return; } this._toggleSeparatorVisibility(); menu.element.find(`[${kendo.attr('soft-rules')}]`).each((i, item) => { var rules = $(item).attr(kendo.attr('soft-rules')).split(";"); menu.enable(item, this._validateSoftRules(rules, elTarget)); }); }, _toggleSeparatorVisibility: function() { var that = this, items = that.element.find(".k-item.k-separator").filter((i, item) => { var prev = $(item).prev(".k-item:not(.k-separator)"); var next = $(item).next(".k-item:not(.k-separator)"); return !(prev.length && next.length); }); items.hide(); }, _extendItems: function() { var that = this, items = that.options.items, item, isBuiltInTool; if (items && items.length) { for (var i = 0; i < items.length; i++) { item = items[i]; isBuiltInTool = $.isPlainObject(item) && Object.keys(item).length === 1 && item.name; if (isBuiltInTool) { item = item.name; } if ($.isPlainObject(item)) { that._append(item); } else if (that.defaultItems[item]) { item = that.defaultItems[item]; that._append(item); } else if (typeof(item) === "string") { item = { name: item, text: item, spriteCssClass: item, command: item + "Command" }; that._append(item); } } } else { for (var key in that.defaultItems) { item = that.defaultItems[key]; that._append(item); } } }, _extendItem: function(item) { var that = this, messages = that.options.messages, attr = item.attr || {}; if (item.command) { attr[kendo.attr("command")] = item.command; } if (item.options) { attr[kendo.attr("options")] = item.options; } if (item.softRules) { attr[kendo.attr("soft-rules")] = item.softRules; } if (item.items) { for (var j = 0; j < item.items.length; j++) { item.items.forEach(subItem => { that._extendItem(subItem); }); } } extend(item, { text: messages.commands[item.name], icon: item.icon || "", spriteCssClass: item.spriteCssClass || "", attr: attr, uid: kendo.guid() }); }, _validateSoftRules: function(rules, target) { if (!rules || !(rules && rules.length)) { return true; } for (var i = 0; i < rules.length; i++) { if (!this._readState(rules[i], target)) { return false; } } return true; }, _validateRules: function(tool) { var rules = tool.rules ? tool.rules.split(";") : []; if (!rules.length) { return true; } for (var i = 0; i < rules.length; i++) { if (!this._readState(rules[i])) { return false; } } return true; }, _readState: function(state, target) { var that = this, states = that.options.states; if (kendo.isFunction(states[state])) { return states[state](target); } else { return states[state]; } }, _append: function(item) { var that = this; that._extendItem(item); if (that._validateRules(item)) { that.append(item); } }, action: function(args) { this.trigger(ACTION, args); } }); kendo.ui.grid = kendo.ui.grid || {}; extend(kendo.ui.grid, { ContextMenu: GridContextMenu }); })(window.kendo.jQuery); (function($, undefined$1) { var kendo = window.kendo, extend = $.extend, Class = kendo.Class; var Command = Class.extend({ init: function(options) { this.options = options; this.grid = options.grid; } }); var MoveGroupCommand = Command.extend({ exec: function() { var that = this, grid = that.grid, groupable = grid.groupable, options = that.options, target = options.target.closest(".k-chip"), method = options.dir === "next" ? "after" : "before", position = options.dir === "next" ? target.next() : target.prev(); position[method](target); groupable._change(); }, }); var SortCommand = Command.extend({ exec: function() { var that = this, grid = that.grid, dataSource = grid.dataSource, sort = dataSource.sort() || [], options = that.options, dir = options.dir, field = grid._getCellField(options.target), multipleMode = grid.options.sortable.mode && grid.options.sortable.mode === "multiple", compare = grid.options.compare, length, idx; if (multipleMode) { for (idx = 0, length = sort.length; idx < length; idx++) { if (sort[idx].field === field) { sort.splice(idx, 1); break; } } sort.push({ field: field, dir: dir, compare: compare }); } else { sort = [{ field: field, dir: dir, compare: compare }]; } dataSource.sort(sort); }, }); var AddCommand = Command.extend({ exec: function() { var that = this, grid = that.grid; grid.addRow(); } }); var EditCommand = Command.extend({ exec: function() { var that = this, grid = that.grid, inCellMode = grid._editMode() === "incell", target = inCellMode ? that.options.target : that.options.target.closest("tr"); if (inCellMode) { grid.editCell(target); } else { grid.editRow(target); } } }); var DeleteCommand = Command.extend({ exec: function() { var that = this, grid = that.grid, target = that.options.target.closest("tr"); grid.removeRow(target); } }); var CopySelectionCommand = Command.extend({ exec: function() { var that = this, grid = that.grid, withHeaders = that.options.withHeaders; grid.copySelectionToClipboard(withHeaders); } }); var SelectRowCommand = Command.extend({ exec: function() { var that = this, grid = that.grid, selectMode = kendo.ui.Selectable.parseOptions(grid.options.selectable), target = that.options.target.closest("tr"); grid.select(selectMode.cell ? target.find('td') : target); } }); var SelectAllRowsCommand = Command.extend({ exec: function() { var that = this, grid = that.grid, selectMode = kendo.ui.Selectable.parseOptions(grid.options.selectable), rows = grid.items(); grid.select(selectMode.cell ? rows.find('td') : rows); } }); var ClearSelectionCommand = Command.extend({ exec: function() { var that = this, grid = that.grid; grid.clearSelection(); } }); var ReorderRowCommand = Command.extend({ exec: function() { var that = this, grid = that.grid, dir = that.options.dir, target = that.options.target.closest("tr"), index = target.index(), newIndex; switch (dir) { case "up": newIndex = index - 1; break; case "down": newIndex = index + 2; break; case "top": newIndex = 0; break; case "bottom": newIndex = grid.items().length; break; } grid.reorderRowTo(target, newIndex); } }); var ExportPDFCommand = Command.extend({ exec: function() { var that = this, grid = that.grid; grid.saveAsPDF(); } }); var ExportExcelCommand = Command.extend({ exec: function() { var that = this, selection = that.options.selection, withHeaders = that.options.withHeaders, grid = that.grid; if (selection) { grid.exportSelectedToExcel(withHeaders); } else { grid.saveAsExcel(); } } }); kendo.ui.grid = kendo.ui.grid || {}; extend(kendo.ui.grid, { GridCommand: Command, commands: { SortCommand: SortCommand, AddCommand: AddCommand, EditCommand: EditCommand, DeleteCommand: DeleteCommand, CopySelectionCommand: CopySelectionCommand, SelectRowCommand: SelectRowCommand, SelectAllRowsCommand: SelectAllRowsCommand, ClearSelectionCommand: ClearSelectionCommand, ReorderRowCommand: ReorderRowCommand, ExportPDFCommand: ExportPDFCommand, ExportExcelCommand: ExportExcelCommand, MoveGroupCommand: MoveGroupCommand } }); })(window.kendo.jQuery); const __meta__ = { id: "grid", name: "Grid", category: "web", description: "The Grid widget displays tabular data and offers rich support for interacting with data,including paging, sorting, grouping, and selection.", depends: [ "data", "columnsorter", "sortable", "toolbar", "html.button", "icons", "menu", "loader", "html.loadercontainer" ], features: [ { id: "grid-editing", name: "Editing", description: "Support for record editing", depends: [ "editable", "window", "textbox", "form" ] }, { id: "grid-filtering", name: "Filtering", description: "Support for record filtering", depends: [ "filtermenu" ] }, { id: "grid-columnmenu", name: "Column menu", description: "Support for header column menu", depends: [ "columnmenu" ] }, { id: "grid-grouping", name: "Grouping", description: "Support for grid grouping", depends: [ "groupable" ] }, { id: "grid-filtercell", name: "Row filter", description: "Support for grid header filtering", depends: [ "filtercell" ] }, { id: "grid-paging", name: "Paging", description: "Support for grid paging", depends: [ "pager" ] }, { id: "grid-selection", name: "Selection", description: "Support for row selection", depends: [ "selectable" ] }, { id: "grid-column-reorder", name: "Column reordering", description: "Support for column reordering", depends: [ "reorderable" ] }, { id: "grid-column-resize", name: "Column resizing", description: "Support for column resizing", depends: [ "resizable" ] }, { id: "grid-mobile", name: "Grid adaptive rendering", description: "Support for adaptive rendering", depends: [ "dialog", "pane", "switch" ] }, { id: "grid-excel-export", name: "Excel export", description: "Export grid data as Excel spreadsheet", depends: [ "excel" ] }, { id: "grid-pdf-export", name: "PDF export", description: "Export grid data as PDF", depends: [ "pdf", "drawing" ] } ] }; (function($, undefined$1) { let kendo = window.kendo, ui = kendo.ui, DataSource = kendo.data.DataSource, ObservableObject = kendo.data.ObservableObject, tbodySupportsInnerHtml = kendo.support.tbodyInnerHtml, activeElement = kendo._activeElement, Widget = ui.Widget, outerWidth = kendo._outerWidth, outerHeight = kendo._outerHeight, keys = kendo.keys, getType = kendo.type, isPlainObject = $.isPlainObject, extend = $.extend, map = $.map, grep = $.grep, isArray = Array.isArray, inArray = $.inArray, push = Array.prototype.push, isFunction = kendo.isFunction, encode = kendo.htmlEncode, isEmptyObject = $.isEmptyObject, contains = $.contains, math = Math, DOT = ".", PROGRESS = "progress", ERROR = "error", HIERARCHY_CELL_CLASS = "k-hierarchy-cell", DATA_CELL = ":not(.k-group-cell):not([" + kendo.attr("virtual") + "]):not(.k-hierarchy-cell:not(:has(.k-icon.k-i-caret-alt-down,.k-icon.k-i-caret-alt-right,.k-svg-icon.k-svg-i-caret-alt-down,.k-svg-icon.k-svg-i-caret-alt-right,.k-svg-icon.k-svg-i-caret-alt-left,.k-icon.k-i-caret-alt-left))):visible", DATA_CELL_HIDDENINCLUDED = ":not([" + kendo.attr("virtual") + "]):not(.k-hierarchy-cell:not(:has(.k-icon.k-i-caret-alt-down,.k-icon.k-i-caret-alt-right,.k-svg-icon.k-svg-i-caret-alt-down,.k-svg-icon.k-svg-i-caret-alt-right,.k-svg-icon.k-svg-i-caret-alt-left,.k-icon.k-i-caret-alt-left)))", SELECTION_CELL_SELECTOR = "tbody>tr:not(.k-grouping-row):not(.k-detail-row):not(.k-group-footer):not([data-skeleton-row]) > td:not(.k-group-cell):not(.k-hierarchy-cell)", NAVROW = "tr:not(.k-footer-template):visible", NAVCELL = ":not(.k-group-cell):not(.k-detail-cell):not(.k-hierarchy-cell):visible", ITEMROW = "tr:not(.k-grouping-row):not(.k-detail-row):not(.k-footer-template):not(.k-group-footer):visible", COLGROUP = "col:not(.k-group-col, .k-hierarchy-col)", HEADERCELLS = "th.k-header:not(.k-group-cell):not(.k-hierarchy-cell)", CARET_ALT_DOWN = "a[class*='-i-caret-alt-down']", CARET_ALT_RIGHT = "a[class*='-i-caret-alt-right']", CARET_ALT_RIGHT_CACHE = CARET_ALT_RIGHT, CARET_ALT_LEFT = "a[class*='-i-caret-alt-left']", WRAPPER = ".k-grid", NS = ".kendoGrid", CONTENTRLOCKEDCONTAINER = "k-grid-content-locked", GROUPCELLCLASS = "k-group-cell", INPUT_SELECTORS = ":button,a,:input,a>.k-icon,a>.k-svg-icon,textarea,span.k-select,span.k-icon,span.k-svg-icon,span.k-svg-icon>svg,span.k-svg-icon>svg>path,span.k-link,label.k-checkbox-label,.k-input,.k-multiselect-wrap,.k-picker-wrap,.k-picker-wrap>.k-selected-color,.k-tool-icon,.k-dropdownlist,.k-switch-thumb,.k-switch-track,.k-switch-label-off,.k-switch-label-on", EDIT = "edit", BEFOREEDIT = "beforeEdit", SAVE = "save", REMOVE = "remove", DETAILINIT = "detailInit", FILTERMENUINIT = "filterMenuInit", COLUMNMENUINIT = "columnMenuInit", FILTERMENUOPEN = "filterMenuOpen", COLUMNMENUOPEN = "columnMenuOpen", CELLCLOSE = "cellClose", CHANGING = "changing", CHANGE = "change", COLUMNHIDE = "columnHide", COLUMNSHOW = "columnShow", SAVECHANGES = "saveChanges", DATABOUND = "dataBound", DETAILEXPAND = "detailExpand", DETAILCOLLAPSE = "detailCollapse", ITEM_CHANGE = "itemchange", PAGE = "page", PAGING = "paging", PASTE = "paste", SCROLL = "scroll", SYNC = "sync", LOAD_START = "loadStart", LOAD_END = "loadEnd", REQUESTEND = "requestEnd", FOCUSED = "k-focus", HOVER = "k-hover", ACTIVE = "k-active", FOCUSABLE = ":kendoFocusable", SELECTED = "k-selected", CHECKBOX = "k-checkbox", CHECKBOXINPUT = "input[data-role='checkbox'].k-select-checkbox." + CHECKBOX, NORECORDSCLASS = "k-grid-norecords", LINK_CLASS = "k-link", ICON_CLASS = "k-icon", SVG_ICON_CLASS = "k-svg-icon", ORDER_CLASS = "k-sort-order", SORTED_CLASS = "k-sorted", HEADER_CLASS = "k-header", HEADER_COLUMN_MENU_CLASS = "k-grid-column-menu", FILTER_MENU_CLASS = "k-grid-filter-menu", STICKY_CELL_CLASS = "k-grid-content-sticky", STICKY_HEADER_CLASS = "k-grid-header-sticky", STICKY_FOOTER_CLASS = "k-grid-footer-sticky", STICKY_HEADER_NO_BORDER_CLASS = "k-grid-no-left-border", ROW_RESIZER = "k-row-resizer", ROW_RESIZER_WRAP = "k-resizer-wrap", GROUPING_ROW = "k-grouping-row", RESIZE = "resize", ROWRESIZE = "rowResize", COLUMNRESIZE = "columnResize", COLUMNREORDER = "columnReorder", COLUMNLOCK = "columnLock", COLUMNUNLOCK = "columnUnlock", COLUMNSTICK = "columnStick", COLUMNUNSTICK = "columnUnstick", ROWREORDER = "rowReorder", NAVIGATE = "navigate", CLICK = "click", MOUSEDOWN = "mousedown", MOUSEUP = "mouseup", MOUSEENTER = "mouseenter", MOUSELEAVE = "mouseleave", MOUSEMOVE = "mousemove", DUBLECLICK = "dblclick", HEIGHT = "height", WIDTH = "width", AUTO = "auto", TABINDEX = "tabIndex", FUNCTION = "function", STRING = "string", BOTTOM = "bottom", CONTAINER_FOR = "container-for", FIELD = "field", INPUT = "input", INCELL = "incell", INLINE = "inline", UNIQUE_ID = "uid", MINCOLSPANVALUE = 1, COLSPAN = "colSpan", OVERFLOW = "overflow", HIDDEN = "hidden", SORT = "sort", GROUP_SORT = "group-sort", DELETECONFIRM = "Are you sure you want to delete this record?", NORECORDS = "No records available.", CONFIRMDELETE = "Delete", CANCELDELETE = "Cancel", COLLAPSE = "Collapse", EXPAND = "Expand", ID = "id", PX = "px", TR = "tr", TH = "th", TD = "td", DIV = "div", ARIA_LABEL = "aria-label", ARIA_OWNS = "aria-owns", ARIA_ROWCOUNT = "aria-rowcount", ARIA_COLCOUNT = "aria-colcount", ARIA_CONTROLS = "aria-controls", ARIA_COLINDEX = "aria-colindex", ARIA_ROWINDEX = "aria-rowindex", ARIA_EXPANDED = "aria-expanded", ARIA_CHECKED = "aria-checked", ARIA_ACTIVEDESCENDANT = "aria-activedescendant", ROLE = "role", NONE = "none", ROW = "row", ROWGROUP = "rowgroup", COLUMNHEADER = "columnheader", GRIDCELL = "gridcell", formatRegExp = /(\}|\#)/ig, whitespaceRegExp = "[\\x20\\t\\r\\n\\f]", nonDataCellsRegExp = new RegExp("(^|" + whitespaceRegExp + ")" + "(k-group-cell|k-hierarchy-cell)" + "(" + whitespaceRegExp + "|$)"), filterRowRegExp = new RegExp("(^|" + whitespaceRegExp + ")" + "(k-filter-row)" + "(" + whitespaceRegExp + "|$)"), COMMANDBUTTONTMPL = ({ className, attr, text }) => `<button type="button" class="${className}" ${attr}>${kendo.htmlEncode(text)}</button>`, DEFAULTSELECTCOLUMNTMPL = (size, ariaLabel) => `<span class="k-checkbox-wrap"><input tabindex="-1" class="k-select-checkbox ${CHECKBOX} ${size} k-rounded-md" data-role="checkbox" aria-label="${ariaLabel}" aria-checked="false" type="checkbox"></span>`, SELECTCOLUMNTMPL = ({ size }) => DEFAULTSELECTCOLUMNTMPL(size, "Select row"), SELECTCOLUMNHEADERTMPL = ({ size }) => DEFAULTSELECTCOLUMNTMPL(size, "Select all rows"), DRAGHANDLECOLUMNTMPL = () => kendo.ui.icon("reorder"), DEFAULTHEADERTEMPLATE = ({ text }) => `<span class="k-cell-inner"><span class="k-link"><span class="k-column-title">${text}</span></span></span>`, isRtl = false, browser = kendo.support.browser; var isIE11 = browser.msie && browser.version === 11; var isMac = /Mac OS/.test(navigator.userAgent); var classNames = { content: "k-content", scrollContainer: "k-scroll-container", headerCellInner: "k-cell-inner" }; var GroupsPager; var defaultBodyContextMenu = [ "copySelection", "copySelectionNoHeaders", "paste", "separator", "create", "edit", "destroy", "select", "separator", "reorderRow", "exportPDF", "exportExcel", "separator" ]; var defaultHeadContextMenu = [ "sortAsc", "sortDesc", "separator" ]; var defaultGroupsContextMenu = [ "moveGroupPrevious", "moveGroupNext", "separator" ]; if (ui.Pager) { GroupsPager = ui.Pager.extend({ init: function(element, options) { ui.Pager.fn.init.call(this, element, extend(true, {}, options)); this.dataSource.options.useRanges = true; this.dataSource._omitPrefetch = true; }, options: { name: "GroupsPager" }, totalPages: function() { var that = this; return Math.ceil((that._collapsedTotal() || 0) / (that.pageSize() || 1)); }, _collapsedTotal: function() { var dataSource = this.dataSource; return dataSource ? (dataSource.groupsTotal(true) || 0) : 0; } }); } var VirtualScrollable = Widget.extend({ init: function(element, options) { var that = this; Widget.fn.init.call(that, element, options); that._refreshHandler = that.refresh.bind(that); that.setDataSource(options.dataSource); that.wrap(); }, setDataSource: function(dataSource) { var that = this; if (that.dataSource) { that.dataSource.unbind(CHANGE, that._refreshHandler); } that.dataSource = dataSource; that.dataSource.bind(CHANGE, that._refreshHandler); that.dataSource.options.useRanges = true; that.dataSource.options.virtual = true; }, options: { name: "VirtualScrollable", itemHeight: $.noop, prefetch: true, maxScrollHeight: 250000 }, events: [ PAGING, PAGE, SCROLL, LOAD_START, LOAD_END ], destroy: function() { var that = this; Widget.fn.destroy.call(that); that.dataSource.unbind(CHANGE, that._refreshHandler); that.wrapper.add(that.verticalScrollbar).off(NS); clearTimeout(that._timeout); if (that._scrollingTimeout) { clearTimeout(that._scrollingTimeout); } if (that.drag) { that.drag.destroy(); that.drag = null; } that.wrapper = that.element = that.verticalScrollbar = null; that._refreshHandler = null; }, wrap: function() { var that = this, // workaround for IE issue where scroll is not raised if container is same width as the scrollbar scrollbar = kendo.support.scrollbar() + 1, element = that.element, wrapper; element.css( { width: AUTO, overflow: "hidden" }).css((isRtl ? "padding-left" : "padding-right"), scrollbar); that.content = element.children().first(); wrapper = that.wrapper = that.content.wrap('<div class="k-virtual-scrollable-wrap"/>') .parent() .on("DOMMouseScroll" + NS + " mousewheel" + NS, that._wheelScroll.bind(that)); that._wrapper(); if (kendo.support.kineticScrollNeeded || kendo.support.touch) { that.wrapper.css("touch-action", NONE); that.drag = new kendo.UserEvents(that.wrapper, { global: true, allowSelection: true, start: function(e) { e.sender.capture(); }, move: function(e) { that.verticalScrollbar.scrollTop(that.verticalScrollbar.scrollTop() - e.y.delta); kendo.scrollLeft(wrapper, kendo.scrollLeft(wrapper) - e.x.delta); e.preventDefault(); } }); } that.verticalScrollbar = $('<div class="k-scrollbar k-scrollbar-vertical" tabindex="-1"/>') .css({ width: scrollbar }).appendTo(element) .on("scroll" + NS, that._scroll.bind(that)); }, _wrapper: function() { var that = this; if (isIE11) { //scrolling the virtual scrollbar to the bottom and then //scrolling the horizontal content scrollbar does not fire the "scroll" event //seems like a problem in IE 11 only (after version 11.0.9600.18860) //https://github.com/telerik/kendo-ui-core/issues/3779 that.wrapper.css({ "overflow-y": SCROLL }); //hide the wrapper behind the virtual scrollbar that.element.css((isRtl ? "padding-left" : "padding-right"), 0); } }, _wheelScroll: function(e) { if (e.ctrlKey) { return; } var scrollbar = this.verticalScrollbar, scrollTop = scrollbar.scrollTop(), delta = kendo.wheelDeltaY(e); if (delta && !(delta > 0 && scrollTop === 0) && !(delta < 0 && scrollTop + scrollbar[0].clientHeight == scrollbar[0].scrollHeight)) { e.preventDefault(); this.verticalScrollbar.scrollTop(scrollTop + (-delta)); } }, _scroll: function(e) { var that = this, delayLoading = !that.options.prefetch, scrollTop = e.currentTarget.scrollTop, dataSource = that.dataSource, rowHeight = that.itemHeight, skip = dataSource.skip() || 0, start = that._rangeStart || skip, height = that.element.innerHeight(), isScrollingUp = !!(that._scrollbarTop && that._scrollbarTop > scrollTop), firstItemIndex = math.max(math.floor(scrollTop / rowHeight), 0), lastItemOffset = isScrollingUp ? math.ceil(height / rowHeight) : math.floor(height / rowHeight), lastItemIndex = math.max(firstItemIndex + lastItemOffset, 0); if (that._preventScroll) { that._preventScroll = false; return; } that._prevScrollTop = that._scrollTop; that._scrollTop = scrollTop - (start * rowHeight); that._scrollbarTop = scrollTop; that._scrolling = delayLoading; if (!that._fetch(firstItemIndex, lastItemIndex, isScrollingUp)) { that.wrapper[0].scrollTop = that._scrollTop; } that.trigger(SCROLL); if (delayLoading) { if (that._scrollingTimeout) { clearTimeout(that._scrollingTimeout); } that._scrollingTimeout = setTimeout(function() { that._scrolling = false; that._page(that._rangeStart, that.dataSource.take()); }, 100); } }, scrollToTop: function() { this._scrollTo(0); }, scrollToBottom: function() { var scrollbar = this.verticalScrollbar; this._scrollTo(scrollbar[0].scrollHeight - scrollbar.height()); }, _scrollWrapperToTop: function() { this.wrapper.scrollTop(0); }, _scrollWrapperToBottom: function() { this.wrapper.scrollTop(this.wrapper[0].scrollHeight); }, _scrollWrapperOnColumnResize: function() { var that = this; var wrapper = this.wrapper; var initialScrollTop = wrapper.scrollTop(); if (wrapper[0].scrollWidth > wrapper[0].clientWidth) { if ((!that._wrapperScrolled && initialScrollTop) || that._isScrolledToBottom()) { wrapper.scrollTop(initialScrollTop + kendo.support.scrollbar()); that._scrollTop = wrapper.scrollTop(); that._wrapperScrolled = true; } } else if (that._wrapperScrolled) { if (!that._isWrapperScrolledToBottom()) { wrapper.scrollTop(initialScrollTop - kendo.support.scrollbar()); that._scrollTop = wrapper.scrollTop(); } that._wrapperScrolled = false; } }, _scrollTo: function(scrollTop, programmaticScrollPosition) { var that = this; var scrollbar = that.verticalScrollbar; if (scrollbar.scrollTop() !== scrollTop) { that._preventScroll = true; } that.wrapper.scrollTop(scrollTop); that._scrollTop = that.wrapper.scrollTop(); scrollbar.scrollTop(programmaticScrollPosition ?? scrollTop); that._scrollbarTop = scrollbar.scrollTop(); }, _isScrolledToTop: function() { return this.verticalScrollbar.scrollTop() === 0; }, _isScrolledToBottom: function() { var scrollbar = this.verticalScrollbar; var scrollTop = scrollbar.scrollTop(); return (scrollTop > 0 && scrollTop >= parseInt(scrollbar[0].scrollHeight - scrollbar.height(), 10)); }, _isWrapperScrolledToBottom: function() { var wrapper = this.wrapper; return (wrapper.scrollTop() >= parseInt(wrapper[0].scrollHeight - wrapper.height(), 10)); }, itemIndex: function(rowIndex) { var rangeStart = this._rangeStart || this.dataSource.skip() || 0; return rangeStart + rowIndex; }, position: function(index) { var rangeStart = this._rangeStart || this.dataSource.skip() || 0; var pageSize = this.dataSource.pageSize(); var result; if (index > rangeStart) { result = index - rangeStart; } else { result = rangeStart - index - 1; } return result > pageSize ? pageSize : result; }, scrollIntoView: function(row) { var container = this.wrapper[0]; var containerHeight = container.clientHeight; var containerScroll = !this._isScrolledToBottom() ? (this._scrollTop || container.scrollTop) : container.scrollTop; var elementOffset = row[0].offsetTop; var elementHeight = row[0].offsetHeight; if (containerScroll > elementOffset) { this.verticalScrollbar[0].scrollTop -= containerHeight / 2; } else if (elementOffset + elementHeight >= containerScroll + containerHeight) { this.verticalScrollbar[0].scrollTop += containerHeight / 2; } }, _fetch: function(firstItemIndex, lastItemIndex, scrollingUp) { var that = this, dataSource = that.dataSource, itemHeight = that.itemHeight, take = dataSource.take(), rangeStart = that._rangeStart || dataSource.skip() || 0, currentSkip = math.floor(firstItemIndex / take) * take, fetching = false, prefetchAt = 0.33; var scrollbar = that.verticalScrollbar; var webkitCorrection = browser.webkit ? 1 : 0; var total = dataSource._isGroupPaged() ? dataSource.groupsTotal(true) : dataSource.total(); if (firstItemIndex < rangeStart) { fetching = true; if (that._alwaysScrollTop) { rangeStart = math.min(firstItemIndex, total - take); that._scrollTop = 0; } else { rangeStart = math.max(0, lastItemIndex - take); that._scrollTop = scrollbar.scrollTop() - (rangeStart * itemHeight); } that._page(rangeStart, take); } else if (lastItemIndex >= rangeStart + take && !scrollingUp) { fetching = true; rangeStart = math.min(firstItemIndex, total - take); //ensure the scrollbar can be scrolled to bottom with mouse drag if (scrollbar.scrollTop() >= scrollbar[0].scrollHeight - scrollbar[0].offsetHeight - webkitCorrection) { that._scrollTop = that.wrapper[0].scrollHeight - that.wrapper[0].offsetHeight; } else if (that.dataSource._isGroupPaged() && firstItemIndex >= total - take) { that._scrollTop = that.wrapper[0].scrollHeight - that.wrapper[0].offsetHeight - (that._scrollTop - that._prevScrollTop); } else if (that._alwaysScrollTop) { that._scrollTop = 0; } else { that._scrollTop = itemHeight; } that._page(rangeStart, take); } else if (!that._fetching && that.options.prefetch) { if (firstItemIndex < (currentSkip + take) - take * prefetchAt && firstItemIndex > take) { dataSource.prefetch(currentSkip - take, take, $.noop); } if (lastItemIndex > currentSkip + take * prefetchAt) { dataSource.prefetch(currentSkip + take, take, $.noop); } } return fetching; }, fetching: function() { return this._fetching; }, _page: function(skip, take, callback) { var that = this, delayLoading = !that.options.prefetch, dataSource = that.dataSource, isGroupPaged = dataSource._isGroupPaged(); callback = isFunction(callback) ? callback : $.noop; if (that.trigger(PAGING, { skip: skip, take: take })) { return; } clearTimeout(that._timeout); that._fetching = true; that._rangeStart = skip; if ((isGroupPaged && dataSource._groupRangeExists(skip, skip + take)) || (!isGroupPaged && dataSource.inRange(skip, take))) { that.trigger(LOAD_START); dataSource.range(skip, take, function() { that.trigger(LOAD_END); callback(); that.trigger(PAGE); }, "page"); } else { if (!delayLoading) { that.trigger(LOAD_START); } that._timeout = setTimeout(function() { if (!that._scrolling) { if (delayLoading) { that.trigger(LOAD_START); } dataSource.range(skip, take, function() { that.trigger(LOAD_END); callback(); that.trigger(PAGE); }); } }, 100); } }, repaintScrollbar: function(shouldScrollWrapper) { var that = this, maxHeight = that.options.maxScrollHeight, dataSource = that.dataSource, scrollbar = !kendo.support.kineticScrollNeeded ? kendo.support.scrollbar() : 0, wrapperElement = that.wrapper[0], totalHeight, itemHeight; var wasScrolledToBottom = that._isScrolledToBottom(); itemHeight = that.itemHeight = that.options.itemHeight() || 0; var addScrollBarHeight = (wrapperElement.scrollWidth > wrapperElement.offsetWidth) ? scrollbar : 0; totalHeight = (dataSource._isGroupPaged() ? dataSource.groupsTotal(true) : dataSource.total()) * itemHeight + addScrollBarHeight; var divElements = $(new Array(math.floor(totalHeight / maxHeight) + 1).join('<div></div>')) .css({ width: "1px", height: `${maxHeight}px` }); if (totalHeight % maxHeight) { divElements = divElements.add($("<div></div>").css({ width: "1px", height: `${(totalHeight % maxHeight)}px` })); } that.verticalScrollbar.empty().append(divElements); if (wasScrolledToBottom && !that._isScrolledToBottom() && !that.dataSource._isGroupPaged()) { that.scrollToBottom(); } if (typeof(that._scrollTop) !== "undefined" && !!shouldScrollWrapper) { wrapperElement.scrollTop = that._scrollTop; that._scrollWrapperOnColumnResize(); } }, refresh: function(e) { var that = this, dataSource = that.dataSource, rangeStart = that._rangeStart; var action = (e || {}).action; var shouldScrollWrapper = that._isScrolledToBottom() || !action || (action !== ITEM_CHANGE && action !== REMOVE && action !== SYNC); that.trigger(LOAD_END); clearTimeout(that._timeout); that.repaintScrollbar(shouldScrollWrapper); if (that.drag) { that.drag.cancel(); } if (typeof(rangeStart) !== "undefined" && !that._fetching) { // we are rebound from outside local range should be reset if (!action || (action !== SYNC && action !== ITEM_CHANGE && action !== "expandGroup")) { that._rangeStart = dataSource.skip(); } if (dataSource.page() === 1 && (!action || (action !== SYNC && action !== ITEM_CHANGE && action !== "expandGroup" && action !== "collapseGroup"))) { // reset the scrollbar position if datasource is filtered that.verticalScrollbar[0].scrollTop = 0; } } if (that._programmaticallyScrolling && that._programmaticallyScrolling.state() !== 'resolved') { that._programmaticallyScrolling.resolve(); } if (that._alwaysScrollTop) { delete that._alwaysScrollTop; } that._fetching = false; } }); function attrEquals(attrName, attrValue) { return "[" + kendo.attr(attrName) + "=" + attrValue + "]"; } function groupCells(count) { return new Array(count + 1).join('<td class="k-group-cell k-table-group-td k-table-td">&nbsp;</td>'); } function cellsExcludingSpecialColumns(cells) { return cells.filter((i,cell) => { const $cell = $(cell); const hasCheckbox = $cell.children(".k-select-checkbox").length > 0; const hasWrappedCheckbox = $cell.find("> .k-checkbox-wrap > .k-select-checkbox").length > 0; return !$cell.hasClass("k-drag-cell") && !$cell.hasClass("k-command-cell") && !hasCheckbox && !hasWrappedCheckbox; }); } function stringifyAttributes(attributes) { var attr, result = " "; if (attributes) { if (typeof attributes === STRING) { return attributes; } for (attr in attributes) { if (attri