canvas-datagrid
Version:
Canvas based data grid web component. Capable of displaying millions of contiguous hierarchical rows and columns without paging or loading, on a single canvas element.
1 lines • 139 kB
JavaScript
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.canvasDatagrid=t():e.canvasDatagrid=t()}(this,function(){return function(e){function t(r){if(o[r])return o[r].exports;var n=o[r]={i:r,l:!1,exports:{}};return e[r].call(n.exports,n,n.exports,t),n.l=!0,n.exports}var o={};return t.m=e,t.c=o,t.d=function(e,o,r){t.o(e,o)||Object.defineProperty(e,o,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var o=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(o,"a",o),o},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=1)}([function(e,t,o){var r,n;r=[],void 0!==(n=function(){"use strict";return function(e){e.defaults={attributes:[["allowColumnReordering",!0],["allowColumnResize",!0],["allowColumnResizeFromCell",!1],["allowFreezingRows",!1],["allowFreezingColumns",!1],["allowMovingSelection",!0],["allowRowHeaderResize",!0],["allowRowReordering",!1],["allowRowResize",!0],["allowRowResizeFromCell",!1],["allowSorting",!0],["autoResizeColumns",!1],["borderDragBehavior","none"],["borderResizeZone",10],["clearSettingsOptionText","Clear saved settings"],["columnHeaderClickBehavior","sort"],["columnSelectorHiddenText"," "],["columnSelectorText","Add/Remove columns"],["columnSelectorVisibleText","✓"],["contextHoverScrollAmount",2],["contextHoverScrollRateMs",5],["copyText","Copy"],["debug",!1],["editable",!0],["filterOptionText","Filter %s"],["filterTextPrefix","(filtered) "],["globalRowResize",!1],["hideColumnText","Hide %s"],["maxAutoCompleteItems",200],["multiLine",!1],["name",""],["pageUpDownOverlap",1],["pasteText","Paste"],["persistantSelectionMode",!1],["removeFilterOptionText","Remove filter on %s"],["reorderDeadZone",3],["resizeScrollZone",20],["rowGrabZoneSize",5],["saveAppearance",!0],["scrollAnimationPPSThreshold",.75],["scrollPointerLock",!1],["scrollRepeatRate",75],["selectionFollowsActiveCell",!1],["selectionHandleBehavior","none"],["selectionMode","cell"],["selectionScrollIncrement",20],["selectionScrollZone",20],["showClearSettingsOption",!0],["showColumnHeaders",!0],["showColumnSelector",!0],["showCopy",!0],["showFilter",!0],["showNewRow",!1],["showOrderByOption",!0],["showOrderByOptionTextAsc","Order by %s ascending"],["showOrderByOptionTextDesc","Order by %s descending"],["showPaste",!1],["showPerformance",!1],["showRowHeaders",!0],["showRowNumbers",!0],["snapToRow",!1],["touchContextMenuTimeMs",800],["touchDeadZone",3],["touchEasingMethod","easeOutQuad"],["touchReleaseAcceleration",1e3],["touchReleaseAnimationDurationMs",2e3],["touchScrollZone",20],["touchSelectHandleZone",20],["touchZoomSensitivity",.005],["touchZoomMin",.5],["touchZoomMax",1.75],["maxPixelRatio",1],["tree",!1],["treeHorizontalScroll",!1]],styles:[["activeCellBackgroundColor","rgba(255, 255, 255, 1)"],["activeCellBorderColor","rgba(110, 168, 255, 1)"],["activeCellBorderWidth",1],["activeCellColor","rgba(0, 0, 0, 1)"],["activeCellFont","16px sans-serif"],["activeCellHoverBackgroundColor","rgba(255, 255, 255, 1)"],["activeCellHoverColor","rgba(0, 0, 0, 1)"],["activeCellOverlayBorderColor","rgba(66, 133, 244, 1)"],["activeCellOverlayBorderWidth",1],["activeCellPaddingBottom",5],["activeCellPaddingLeft",5],["activeCellPaddingRight",7],["activeCellPaddingTop",5],["activeCellSelectedBackgroundColor","rgba(236, 243, 255, 1)"],["activeCellSelectedColor","rgba(0, 0, 0, 1)"],["activeColumnHeaderCellBackgroundColor","rgba(225, 225, 225, 1)"],["activeColumnHeaderCellColor","rgba(0, 0, 0, 1)"],["activeRowHeaderCellBackgroundColor","rgba(225, 225, 225, 1)"],["activeRowHeaderCellColor","rgba(0, 0, 0, 1)"],["autocompleteBottomMargin",60],["autosizeHeaderCellPadding",8],["autosizePadding",5],["cellAutoResizePadding",13],["cellBackgroundColor","rgba(255, 255, 255, 1)"],["cellBorderColor","rgba(195, 199, 202, 1)"],["cellBorderWidth",1],["cellColor","rgba(0, 0, 0, 1)"],["cellFont","16px sans-serif"],["cellGridHeight",250],["cellHeight",24],["cellHeightWithChildGrid",150],["cellHorizontalAlignment","left"],["cellHoverBackgroundColor","rgba(255, 255, 255, 1)"],["cellHoverColor","rgba(0, 0, 0, 1)"],["cellPaddingBottom",5],["cellPaddingLeft",5],["cellPaddingRight",7],["cellPaddingTop",5],["cellSelectedBackgroundColor","rgba(236, 243, 255, 1)"],["cellSelectedColor","rgba(0, 0, 0, 1)"],["cellVerticalAlignment","center"],["cellWidth",250],["cellWidthWithChildGrid",250],["childContextMenuArrowColor","rgba(43, 48, 43, 1)"],["childContextMenuArrowHTML","►"],["childContextMenuMarginLeft",-11],["childContextMenuMarginTop",-6],["columnHeaderCellBackgroundColor","rgba(240, 240, 240, 1)"],["columnHeaderCellBorderColor","rgba(172, 172, 172, 1)"],["columnHeaderCellBorderWidth",1],["columnHeaderCellColor","rgba(50, 50, 50, 1)"],["columnHeaderCellFont","16px sans-serif"],["columnHeaderCellHeight",25],["columnHeaderCellHorizontalAlignment","left"],["columnHeaderCellHoverBackgroundColor","rgba(235, 235, 235, 1)"],["columnHeaderCellHoverColor","rgba(0, 0, 0, 1)"],["columnHeaderCellPaddingBottom",5],["columnHeaderCellPaddingLeft",5],["columnHeaderCellPaddingRight",7],["columnHeaderCellPaddingTop",5],["columnHeaderCellVerticalAlignment","center"],["columnHeaderOrderByArrowBorderColor","rgba(195, 199, 202, 1)"],["columnHeaderOrderByArrowBorderWidth",1],["columnHeaderOrderByArrowColor","rgba(155, 155, 155, 1)"],["columnHeaderOrderByArrowHeight",8],["columnHeaderOrderByArrowMarginLeft",0],["columnHeaderOrderByArrowMarginRight",5],["columnHeaderOrderByArrowMarginTop",6],["columnHeaderOrderByArrowWidth",13],["contextFilterButtonBorder","solid 1px rgba(158, 163, 169, 1)"],["contextFilterButtonBorderRadius","3px"],["contextFilterButtonHTML","▼"],["contextFilterInputBackground","rgba(255,255,255,1)"],["contextFilterInputBorder","solid 1px rgba(158, 163, 169, 1)"],["contextFilterInputBorderRadius","0"],["contextFilterInputColor","rgba(0,0,0,1)"],["contextFilterInputFontFamily","sans-serif"],["contextFilterInputFontSize","14px"],["contextFilterInvalidRegExpBackground","rgba(180, 6, 1, 1)"],["contextFilterInvalidRegExpColor","rgba(255, 255, 255, 1)"],["contextMenuArrowColor","rgba(43, 48, 43, 1)"],["contextMenuArrowDownHTML","▼"],["contextMenuArrowUpHTML","▲"],["contextMenuBackground","rgba(240, 240, 240, 1)"],["contextMenuBorder","solid 1px rgba(158, 163, 169, 1)"],["contextMenuBorderRadius","3px"],["contextMenuChildArrowFontSize","12px"],["contextMenuColor","rgba(43, 48, 43, 1)"],["contextMenuFilterButtonFontFamily","sans-serif"],["contextMenuFilterButtonFontSize","10px"],["contextMenuFilterInvalidExpresion","rgba(237, 155, 156, 1)"],["contextMenuFontFamily","sans-serif"],["contextMenuFontSize","16px"],["contextMenuHoverBackground","rgba(182, 205, 250, 1)"],["contextMenuHoverColor","rgba(43, 48, 153, 1)"],["contextMenuItemBorderRadius","3px"],["contextMenuItemMargin","2px"],["contextMenuLabelDisplay","inline-block"],["contextMenuLabelMargin","0 3px 0 0"],["contextMenuLabelMaxWidth","700px"],["contextMenuLabelMinWidth","75px"],["contextMenuMarginLeft",3],["contextMenuMarginTop",-3],["contextMenuOpacity","0.98"],["contextMenuPadding","2px"],["contextMenuWindowMargin",100],["contextMenuZIndex",1e4],["cornerCellBackgroundColor","rgba(240, 240, 240, 1)"],["cornerCellBorderColor","rgba(202, 202, 202, 1)"],["editCellBackgroundColor","white"],["editCellBorder","solid 1px rgba(110, 168, 255, 1)"],["editCellBoxShadow","0 2px 5px rgba(0,0,0,0.4)"],["editCellColor","black"],["editCellFontFamily","sans-serif"],["editCellFontSize","16px"],["editCellPaddingLeft",4],["editCellZIndex",1e4],["frozenMarkerHoverColor","rgba(236, 243, 255, 1)"],["frozenMarkerHoverBorderColor","rgba(110, 168, 255, 1)"],["frozenMarkerActiveColor","rgba(236, 243, 255, 1)"],["frozenMarkerActiveBorderColor","rgba(110, 168, 255, 1)"],["frozenMarkerColor","rgba(222, 222, 222, 1)"],["frozenMarkerBorderColor","rgba(168, 168, 168, 1)"],["frozenMarkerBorderWidth",1],["frozenMarkerWidth",2],["gridBackgroundColor","rgba(240, 240, 240, 1)"],["gridBorderCollapse","collapse"],["gridBorderColor","rgba(202, 202, 202, 1)"],["gridBorderWidth",1],["minColumnWidth",45],["minRowHeight",24],["mobileContextMenuMargin",10],["mobileEditInputHeight",30],["mobileEditFontFamily","sans-serif"],["mobileEditFontSize","16px"],["moveOverlayBorderWidth",1],["moveOverlayBorderColor","rgba(66, 133, 244, 1)"],["moveOverlayBorderSegments","12, 7"],["name","default"],["reorderMarkerBackgroundColor","rgba(0, 0, 0, 0.1)"],["reorderMarkerBorderColor","rgba(0, 0, 0, 0.2)"],["reorderMarkerBorderWidth",1.25],["reorderMarkerIndexBorderColor","rgba(66, 133, 244, 1)"],["reorderMarkerIndexBorderWidth",2.75],["rowHeaderCellBackgroundColor","rgba(240, 240, 240, 1)"],["rowHeaderCellBorderColor","rgba(200, 200, 200, 1)"],["rowHeaderCellBorderWidth",1],["rowHeaderCellColor","rgba(50, 50, 50, 1)"],["rowHeaderCellFont","16px sans-serif"],["rowHeaderCellHeight",25],["rowHeaderCellHorizontalAlignment","left"],["rowHeaderCellHoverBackgroundColor","rgba(235, 235, 235, 1)"],["rowHeaderCellHoverColor","rgba(0, 0, 0, 1)"],["rowHeaderCellPaddingBottom",5],["rowHeaderCellPaddingLeft",5],["rowHeaderCellPaddingRight",5],["rowHeaderCellPaddingTop",5],["rowHeaderCellSelectedBackgroundColor","rgba(217, 217, 217, 1)"],["rowHeaderCellSelectedColor","rgba(50, 50, 50, 1)"],["rowHeaderCellVerticalAlignment","center"],["rowHeaderCellWidth",57],["scrollBarActiveColor","rgba(125, 125, 125, 1)"],["scrollBarBackgroundColor","rgba(240, 240, 240, 1)"],["scrollBarBorderColor","rgba(202, 202, 202, 1)"],["scrollBarBorderWidth",.5],["scrollBarBoxBorderRadius",4.125],["scrollBarBoxColor","rgba(192, 192, 192, 1)"],["scrollBarBoxMargin",2],["scrollBarBoxMinSize",15],["scrollBarBoxWidth",8],["scrollBarCornerBackgroundColor","rgba(240, 240, 240, 1)"],["scrollBarCornerBorderColor","rgba(202, 202, 202, 1)"],["scrollBarWidth",11],["selectionHandleBorderColor","rgba(255, 255, 255, 1)"],["selectionHandleBorderWidth",1.5],["selectionHandleColor","rgba(66, 133, 244, 1)"],["selectionHandleSize",8],["selectionHandleType","square"],["selectionOverlayBorderColor","rgba(66, 133, 244, 1)"],["selectionOverlayBorderWidth",1],["treeArrowBorderColor","rgba(195, 199, 202, 1)"],["treeArrowBorderWidth",1],["treeArrowClickRadius",5],["treeArrowColor","rgba(155, 155, 155, 1)"],["treeArrowHeight",8],["treeArrowMarginLeft",0],["treeArrowMarginRight",5],["treeArrowMarginTop",6],["treeArrowWidth",13],["treeGridHeight",250]]}}}.apply(t,r))&&(e.exports=n)},function(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;__WEBPACK_AMD_DEFINE_ARRAY__=[__webpack_require__(2),__webpack_require__(0),__webpack_require__(3),__webpack_require__(4),__webpack_require__(5),__webpack_require__(6),__webpack_require__(7),__webpack_require__(8),__webpack_require__(9)],void 0!==(__WEBPACK_AMD_DEFINE_RESULT__=function context(component){"use strict";function Grid(args){args=args||{};var self={};return self.isComponent=void 0===args.component,self.isChildGrid=args.parentNode&&/canvas-datagrid-(cell|tree)/.test(args.parentNode.nodeType),self.isChildGrid?self.intf={}:self.intf=self.isComponent?eval("Reflect.construct(HTMLElement, [], new.target)"):document.createElement("section"),self.args=args,self.createGrid=function(e){return e.component=!1,new Grid(e)},modules.forEach(function(e){e(self)}),self.isChildGrid?(self.shadowRoot=args.parentNode.shadowRoot,self.parentNode=args.parentNode):self.intf.createShadowRoot?(self.shadowRoot=self.intf.attachShadow({mode:self.args.debug?"open":"closed"}),self.parentNode=self.shadowRoot):self.parentNode=self.intf,self.init(),self.intf}component=component();var modules=Array.prototype.slice.call(arguments);return window.HTMLElement&&(Grid.prototype=Object.create(window.HTMLElement.prototype)),window.customElements&&(Grid.observedAttributes=component.getObservableAttributes(),Grid.prototype.disconnectedCallback=component.disconnectedCallback,Grid.prototype.attributeChangedCallback=component.attributeChangedCallback,Grid.prototype.connectedCallback=component.connectedCallback,Grid.prototype.adoptedCallback=component.adoptedCallback,window.customElements.define("canvas-datagrid",Grid)),!window||window.canvasDatagrid||window.require||(window.canvasDatagrid=function(e){return new Grid(e)}),module.exports=function(e){e=e||{};var t,o=["style","schema","data","formatters","sorters","filters"];return window.customElements&&document.body.createShadowRoot?(t=document.createElement("canvas-datagrid"),t.style.width="100%",t.style.height="100%",Object.keys(e).forEach(function(r){return"parentNode"===r?void e.parentNode.appendChild(t):-1!==o.indexOf(r)?void o.forEach(function(o){void 0!==e[o]&&o===r&&(-1!==["formatters","sorters","filters"].indexOf(r)?"object"==typeof e[o]&&null!==e[o]&&Object.keys(e[o]).forEach(function(r){t[o][r]=e[o][r]}):t[o]=e[o])}):void(t.attributes[r]=e[r])}),t):(e.component=!1,t=new Grid(e),e.parentNode&&e.parentNode.appendChild&&e.parentNode.appendChild(t),t.style.width="100%",t.style.height="100%",t)},module.exports}.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__))&&(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)},function(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;__WEBPACK_AMD_DEFINE_ARRAY__=[__webpack_require__(0)],void 0!==(__WEBPACK_AMD_DEFINE_RESULT__=function(defaults){"use strict";return function(){function hyphenateProperty(e,t){var o="";return Array.prototype.forEach.call(e,function(e){if(e===e.toUpperCase())return void(o+="-"+e.toLowerCase());o+=e}),(t?"--cdg-":"")+o}function getDefaultItem(e,t){var o={};return defaults(o),o.defaults[e].filter(function(e){return e[0].toLowerCase()===t.toLowerCase()||hyphenateProperty(e[0])===t.toLowerCase()||hyphenateProperty(e[0],!0)===t.toLowerCase()})[0]}function applyComponentStyle(e,t){var o=window.getComputedStyle(t,null),r={};t.computedStyle=o,defaults(r),r=r.defaults.styles,r.forEach(function(e){var r=o.getPropertyValue(hyphenateProperty(e[0],!0));""===r&&(r=o.getPropertyValue(hyphenateProperty(e[0],!1))),""!==r&&t.setStyleProperty(e[0],typeMap[typeof e[1]](r,e[1]))}),requestAnimationFrame(function(){t.resize(!0)}),!e&&t.dispatchEvent&&t.dispatchEvent("stylechanged",t.style)}var typeMap,component={};return typeMap={data:function(e){try{return JSON.parse(e)}catch(e){throw new Error("Cannot read JSON data in canvas-datagrid data.")}},schema:function(e){try{return JSON.parse(e)}catch(e){throw new Error("Cannot read JSON data in canvas-datagrid schema attribute.")}},number:function(e,t){var o=parseInt(e,10);return isNaN(o)?t:o},boolean:function(e){return/true/i.test(e)},string:function(e){return e}},component.getObservableAttributes=function(){var e={},t=["data","schema","style","className","name"];return defaults(e),e.defaults.attributes.forEach(function(e){t.push(e[0].toLowerCase())}),t},component.disconnectedCallback=function(){this.connected=!1},component.connectedCallback=function(){var e=this;e.connected=!0,component.observe(e),applyComponentStyle(!0,e),e.resize(!0)},component.adoptedCallback=function(){this.resize()},component.attributeChangedCallback=function(attrName,oldVal,newVal){var tfn,intf=this,def;if("style"===attrName)return void requestAnimationFrame(function(){applyComponentStyle(!1,intf)});if("data"===attrName)return void(intf.args.data=typeMap.data(newVal));if("schema"===attrName)return void(intf.args.schema=typeMap.schema(newVal));if("name"===attrName)return void(intf.name=newVal);if("class"!==attrName&&"className"!==attrName){if(def=getDefaultItem("attributes",attrName))return tfn=typeMap[typeof def[1]],void(intf.attributes[def[0]]=tfn(newVal));/^on/.test(attrName)&&intf.addEventListener("on"+attrName,function(e){eval(newVal)})}},component.observe=function(e){var t;window.MutationObserver&&(e.applyComponentStyle=function(){applyComponentStyle(!1,e),e.resize()},t=new window.MutationObserver(function(t){var o,r;Array.prototype.forEach.call(t,function(t){return"class"===t.attributeName||"style"===t.attributeName?void e.applyComponentStyle(!1,e):t.target.parentNode&&"STYLE"===t.target.parentNode.nodeName?void(r=!0):void((t.addedNodes.length>0||"characterData"===t.type)&&(o=!0))}),r&&e.applyComponentStyle(!1,e),o&&(e.data=typeMap.data(e.innerHTML))}),t.observe(e,{characterData:!0,childList:!0,attributes:!0,subtree:!0}),t.observe(e.canvas,{attributes:!0}),Array.prototype.forEach.call(document.querySelectorAll("style"),function(e){t.observe(e,{characterData:!0,childList:!0,attributes:!0,subtree:!0})}))},component}}.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__))&&(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)},function(e,t,o){var r,n;r=[],void 0!==(n=function(){"use strict";return function(e){function t(t,o,r,n,l,i,a,s,c){var d=t/l.length,u=o/a;r+=e.canvasOffsetLeft,n+=e.canvasOffsetTop,e.ctx.beginPath(),e.ctx.moveTo(r,n+o),l.forEach(function(t){var l,a,s=void 0===i?t:t[i];c&&(s=Math.abs(s)),l=r+d,a=n+o-s*u,e.ctx.lineTo(l,a),r+=d}),e.ctx.moveTo(r+t,n+o),e.ctx.strokeStyle=s,e.ctx.stroke()}function o(){var t=!0;Object.keys(e.htmlImageCache).forEach(function(o){e.htmlImageCache[o].complete||(t=!1)}),t&&e.draw()}function r(t){var r,n=t.innerHTML||t.formattedValue,l=t.x+e.canvasOffsetLeft,i=t.y+e.canvasOffsetTop;if(e.htmlImageCache[n]){if(r=e.htmlImageCache[n],r.height===t.height&&r.width===t.width){if(!r.complete)return;return e.ctx.drawImage(r,l,i)}e.htmlImageCache[n]=void 0}r=new Image(t.width,t.height),e.htmlImageCache[n]=r,r.onload=function(){e.ctx.drawImage(r,l,i),o()},r.src="data:image/svg+xml;base64,"+btoa('<svg xmlns="http://www.w3.org/2000/svg" width="'+t.width+'" height="'+t.height+'">\n<foreignObject class="node" x="0" y="0" width="100%" height="100%">\n<body xmlns="http://www.w3.org/1999/xhtml" style="margin:0;padding:0;">\n'+n+"\n</body></foreignObject>\n</svg>\n")}function n(t,o){var r=e.style.columnHeaderOrderByArrowMarginTop*e.scale,n=e.style.columnHeaderOrderByArrowMarginLeft*e.scale,l=e.style.columnHeaderOrderByArrowMarginRight*e.scale,i=e.style.columnHeaderOrderByArrowWidth*e.scale,a=e.style.columnHeaderOrderByArrowHeight*e.scale;return t+=e.canvasOffsetLeft,o+=e.canvasOffsetTop,e.ctx.fillStyle=e.style.columnHeaderOrderByArrowColor,e.ctx.strokeStyle=e.style.columnHeaderOrderByArrowBorderColor,e.ctx.beginPath(),t+=n,o+=r,"asc"===e.orderDirection?(e.ctx.moveTo(t,o),e.ctx.lineTo(t+i,o),e.ctx.lineTo(t+.5*i,o+a),e.ctx.moveTo(t,o)):(e.ctx.lineTo(t,o+a),e.ctx.lineTo(t+i,o+a),e.ctx.lineTo(t+.5*i,o),e.ctx.lineTo(t,o+a)),e.ctx.stroke(),e.ctx.fill(),n+i+l}function l(t,o,r){var n=e.style.treeArrowMarginTop*e.scale,l=e.style.treeArrowMarginRight*e.scale,i=e.style.treeArrowMarginLeft*e.scale,a=e.style.treeArrowWidth*e.scale,s=e.style.treeArrowHeight*e.scale;return o+=e.canvasOffsetLeft,r+=e.canvasOffsetTop,e.ctx.fillStyle=e.style.treeArrowColor,e.ctx.strokeStyle=e.style.treeArrowBorderColor,e.ctx.beginPath(),o+=i,r+=n,e.openChildren[t.data[e.uniqueId]]?(e.ctx.moveTo(o,r),e.ctx.lineTo(o+a,r),e.ctx.lineTo(o+.5*a,r+s),e.ctx.moveTo(o,r)):(e.ctx.lineTo(o,r),e.ctx.lineTo(o+s,r+.5*a),e.ctx.lineTo(o,r+a),e.ctx.lineTo(o,r)),e.ctx.stroke(),e.ctx.fill(),i+a+l}function i(t,o,r,n,l){t+=e.canvasOffsetLeft,o+=e.canvasOffsetTop;var i=t+r,a=o+n;e.ctx.beginPath(),e.ctx.moveTo(t+l,o),e.ctx.lineTo(i-l,o),e.ctx.quadraticCurveTo(i,o,i,o+l),e.ctx.lineTo(i,o+n-l),e.ctx.quadraticCurveTo(i,a,i-l,a),e.ctx.lineTo(t+l,a),e.ctx.quadraticCurveTo(t,a,t,a-l),e.ctx.lineTo(t,o+l),e.ctx.quadraticCurveTo(t,o,t+l,o)}function a(t,o,r,n){t+=e.canvasOffsetLeft,o+=e.canvasOffsetTop,e.ctx.fillRect(t,o,r,n)}function s(t,o,r,n){t+=e.canvasOffsetLeft,o+=e.canvasOffsetTop,e.ctx.strokeRect(t,o,r,n)}function c(t,o,r){o+=e.canvasOffsetLeft,r+=e.canvasOffsetTop,e.ctx.fillText(t,o,r)}function d(t,o,r){t+=e.canvasOffsetLeft,o+=e.canvasOffsetTop,e.ctx.beginPath(),e.ctx.arc(t,o,r,0,2*Math.PI),e.ctx.fill()}function u(t,o,r){t+=e.canvasOffsetLeft,o+=e.canvasOffsetTop,e.ctx.beginPath(),e.ctx.arc(t,o,r,0,2*Math.PI),e.ctx.stroke()}function h(t){e.ctx.beginPath(),0===t&&(e.ctx.moveTo(e.lastFrozenColumnPixel,e.lastFrozenRowPixel),e.ctx.lineTo(e.lastFrozenColumnPixel,e.height),e.ctx.lineTo(e.width,e.height),e.ctx.lineTo(e.width,e.lastFrozenRowPixel)),1===t&&(e.ctx.moveTo(0,e.lastFrozenRowPixel),e.ctx.lineTo(0,e.height),e.ctx.lineTo(e.width,e.height),e.ctx.lineTo(e.width,e.lastFrozenRowPixel)),2===t&&(e.ctx.moveTo(e.lastFrozenColumnPixel,0),e.ctx.lineTo(e.width,0),e.ctx.lineTo(e.width,e.height),e.ctx.lineTo(e.lastFrozenColumnPixel,e.height)),e.ctx.clip()}function f(t,o,r){if("circle"===e.style.selectionHandleType)return d(t,o,.5*r);a(t-.5*r,o-.5*r,r,r)}function g(t,o,r){if("circle"===e.style.selectionHandleType)return u(t,o,.5*r);s(t-.5*r,o-.5*r,r,r)}function m(t,o){var r=e.style.selectionHandleSize;({tr:function(){f(t.x+t.width,t.y,r),g(t.x+t.width,t.y,r)},br:function(){f(t.x+t.width,t.y+t.height,r),g(t.x+t.width,t.y+t.height,r)},tl:function(){f(t.x,t.y,r),g(t.x,t.y,r)},bl:function(){f(t.x,t.y+t.height,r),g(t.x,t.y+t.height,r)}})[o]()}function x(t,o){e.ctx.beginPath(),{t:function(){e.ctx.moveTo(t.x+e.canvasOffsetLeft,t.y+e.canvasOffsetTop),e.ctx.lineTo(t.x+e.canvasOffsetLeft+t.width,t.y+e.canvasOffsetTop)},r:function(){e.ctx.moveTo(t.x+e.canvasOffsetLeft+t.width,t.y+e.canvasOffsetTop),e.ctx.lineTo(t.x+e.canvasOffsetLeft+t.width,t.y+e.canvasOffsetTop+t.height)},b:function(){e.ctx.moveTo(t.x+e.canvasOffsetLeft,t.y+e.canvasOffsetTop+t.height),e.ctx.lineTo(t.x+e.canvasOffsetLeft+t.width,t.y+e.canvasOffsetTop+t.height)},l:function(){e.ctx.moveTo(t.x+e.canvasOffsetLeft,t.y+e.canvasOffsetTop),e.ctx.lineTo(t.x+e.canvasOffsetLeft,t.y+e.canvasOffsetTop+t.height)}}[o](),e.ctx.stroke()}function p(t,o){var r,n=0;return e.ellipsisCache[t]&&e.ellipsisCache[t][o]?e.ellipsisCache[t][o]:(n=e.ctx.measureText(t).width,e.ellipsisCache[t]=e.ellipsisCache[t]||{},r={value:t,width:n},e.ellipsisCache[t][o]=r,r)}function y(t){var o=e.style[t.style+"PaddingLeft"]*e.scale,r=e.style[t.style+"PaddingTop"]*e.scale,n=e.style[t.style+"PaddingRight"]*e.scale,l=e.style[t.style+"PaddingBottom"]*e.scale,i=r+t.height-.5*t.height,a=o+t.treeArrowWidth+t.orderByArrowWidth;t.text=p(t.formattedValue,t.width-n-o),t.text.height=t.fontHeight,"right"===t.horizontalAlignment?a=t.width-t.text.width-n:"center"===t.horizontalAlignment&&(a=t.width/2-t.text.width/2),"top"===t.verticalAlignment?i=r+t.text.height:"bottom"===t.verticalAlignment&&(i=t.height-l-t.text.height),t.text.x=t.x+a,t.text.y=t.y+i,c(t.text.value,t.text.x,t.text.y)}function v(){for(var t,o=0,r=e.getVisibleSchema(),n=0,l=Math.min(e.frozenColumn,r.length);n<l;)t=r[e.orders.columns[n]],o+=(e.sizes.columns[t[e.uniqueId]]||t.width||e.style.cellWidth)*e.scale,n+=1;return o}var w=[],b=0,C=300,B=[],S=[],I=[];e.htmlImageCache={},e.draw=function(o){function d(t){(e.attributes.allowMovingSelection||e.mobile)&&(t.selectionBorderTop&&t.selectionBorderRight&&e.mobile&&(K.push([t,"tr"]),t.selectionHandle="tr"),t.selectionBorderTop&&t.selectionBorderLeft&&e.mobile&&(K.push([t,"tl"]),t.selectionHandle="tl"),t.selectionBorderBottom&&t.selectionBorderLeft&&e.mobile&&(K.push([t,"bl"]),t.selectionHandle="bl"),t.selectionBorderBottom&&t.selectionBorderRight&&("none"!==e.attributes.selectionHandleBehavior||e.mobile)&&(K.push([t,"br"]),t.selectionHandle="br"))}function u(t,o,r,n){n=n||{x:0,y:0},t.selectionBorder="",!t.isRowHeader&&e.selections[t.rowIndex+-n.y]&&-1!==e.selections[t.rowIndex+-n.y].indexOf(t.columnIndex+-n.x)&&(e.selections[t.rowIndex-1-n.y]&&-1!==e.selections[t.rowIndex-1-n.y].indexOf(t.columnIndex+-n.x)&&0!==t.rowIndex||t.isHeader||(o.push([t,"t"]),t[r+"BorderTop"]=!0,t[r+"Border"]+="t"),e.selections[t.rowIndex+1+-n.y]&&-1!==e.selections[t.rowIndex+1+-n.y].indexOf(t.columnIndex+-n.x)||(o.push([t,"b"]),t[r+"BorderBottom"]=!0,t[r+"Border"]+="b"),e.selections[t.rowIndex+-n.y]&&0!==t.columnIndex&&-1!==e.selections[t.rowIndex+-n.y].indexOf(t.columnIndex-1-n.x)||(o.push([t,"l"]),t[r+"BorderLeft"]=!0,t[r+"Border"]+="l"),e.selections[t.rowIndex+-n.y]&&t.columnIndex!==N.length&&-1!==e.selections[t.rowIndex+-n.y].indexOf(t.columnIndex+1+-n.x)||(o.push([t,"r"]),t[r+"BorderRight"]=!0,t[r+"Border"]+="r"))}function f(t,o,c){return function(h,f,g){var m,x,p,v=h.style||"cell",w=/HeaderCell/.test(v),b=/cornerCell/.test(v),C="rowHeaderCell"===v,B="columnHeaderCell"===v,S=e.selections[o]&&-1!==e.selections[o].indexOf(g),I=e.hovers[t[e.uniqueId]]&&-1!==e.hovers[t[e.uniqueId]].indexOf(g),E=e.activeCell.rowIndex===o&&e.activeCell.columnIndex===g,z="object"==typeof t[h.name]&&null!==t[h.name]&&void 0!==t[h.name],H=!(e.orders.rows[e.activeCell.rowIndex]!==o&&e.orders.columns[e.activeCell.columnIndex]!==g||-1!==g&&-1!==o)&&(C?"activeRowHeaderCell":"activeColumnHeaderCell"),R=e.formatters[h.type||"string"],D=0,F=0,N=e.sizes.columns[C?"cornerCell":h[e.uniqueId]]||h.width,j={value:t[h.name],row:t,header:h};if("headerCellCap"===v&&(N=W-A),void 0===N&&(N=e.style.cellWidth),N*=e.scale,A+N+e.style.cellBorderWidth<0&&(A+=N+e.style.cellBorderWidth),E&&"cornerCell"!==v&&(v="activeCell"),-1!==e.visibleRows.indexOf(c)||w||e.visibleRows.push(c),p=e.dispatchEvent("formatcellvalue",j),T=A,P=L,"cornerCell"===v?(T=0,P=0):C?T=0:w&&(P=0),x={type:z?"canvas-datagrid-cell":h.type,style:v,nodeType:"canvas-datagrid-cell",x:T,y:P,horizontalAlignment:e.style[v+"HorizontalAlignment"],verticalAlignment:e.style[v+"VerticalAlignment"],offsetTop:e.canvasOffsetTop+P,offsetLeft:e.canvasOffsetLeft+T,scrollTop:e.scrollBox.scrollTop,scrollLeft:e.scrollBox.scrollLeft,active:E||H,hovered:I,selected:S,width:N,height:ee,offsetWidth:N,offsetHeight:ee,parentNode:e.intf.parentNode,offsetParent:e.intf.parentNode,data:t,isCorner:b,isHeader:w,isColumnHeader:B,isHeaderCellCap:!!h.isHeaderCellCap,isRowHeader:C,rowOpen:O,header:h,columnIndex:g,rowIndex:o,sortColumnIndex:f,sortRowIndex:c,isGrid:z,isNormal:!z&&!b&&!w,gridId:(e.attributes.name||"")+t[e.uniqueId]+":"+h[e.uniqueId],parentGrid:e.intf,innerHTML:"",activeHeader:H,value:w&&!C?h.title||h.name:t[h.name]},j.cell=x,x.userHeight=x.isHeader?e.sizes.rows[-1]:k,x.userWidth=x.isHeader?e.sizes.columns.cornerCell:e.sizes.columns[h[e.uniqueId]],x[e.uniqueId]=t[e.uniqueId],e.visibleCells.unshift(x),!e.dispatchEvent("beforerendercell",j)){if(e.ctx.fillStyle=e.style[v+"BackgroundColor"],e.ctx.strokeStyle=e.style[v+"BorderColor"],e.ctx.lineWidth=e.style[v+"BorderWidth"],I&&(e.ctx.fillStyle=e.style[v+"HoverBackgroundColor"],e.ctx.strokeStyle=e.style[v+"HoverBorderColor"]),S&&(e.ctx.fillStyle=e.style[v+"SelectedBackgroundColor"],e.ctx.strokeStyle=e.style[v+"SelectedBorderColor"]),H&&(e.ctx.fillStyle=e.style[H+"BackgroundColor"]),e.dispatchEvent("rendercell",j),x.isGrid&&(x.height!==k&&(x.height=k||e.style.cellHeightWithChildGrid,M=!0),x.width=e.sizes.columns[h[e.uniqueId]]||e.style.cellWidthWithChildGrid),O&&!x.isRowHeader&&(x.height=e.sizes.rows[_[e.uniqueId]]||e.style.cellHeight),x.isGrid||(a(T,P,x.width,x.height),s(T,P,x.width,x.height)),e.ctx.save(),i(x.x,x.y,x.width,x.height,0),e.ctx.clip(),e.dispatchEvent("afterrendercell",j),x.height===ee||O&&!x.isRowHeader||(e.sizes.rows[w?-1:t[e.uniqueId]]=x.height,M=!0),x.width!==N&&(e.sizes.columns[h[e.uniqueId]]=x.width,M=!0),C&&e.attributes.tree&&(e.dispatchEvent("rendertreearrow",j)||(F=l(x,e.style[v+"PaddingLeft"],P,0))),e.attributes.showRowNumbers&&C||!C)if(x.isGrid&&!e.dispatchEvent("beforerendercellgrid",j)){if(!e.childGrids[x.gridId]){if(m=e.args.cellGridAttributes||e.args,m.name=e.attributes.saveAppearance?x.gridId:void 0,m.component=!1,m.parentNode=x,m.data=t[h.name],m.style=m.style||e.style,j.cellGridAttributes=m,e.dispatchEvent("beforecreatecellgrid",j))return;e.childGrids[x.gridId]=e.createGrid(m),e.sizes.rows[_[e.uniqueId]]=e.sizes.rows[_[e.uniqueId]]||e.style.cellGridHeight,M=!0}x.grid=e.childGrids[x.gridId],x.grid.parentNode=x,x.grid.visible=!0,x.grid.draw(),e.dispatchEvent("rendercellgrid",j)}else x.isGrid||(e.childGrids[x.gridId]&&(e.childGrids[x.gridId].parentNode.offsetHeight=0),w&&e.orderBy===h.name&&(e.dispatchEvent("renderorderbyarrow",j)||(D=n(T+e.style[v+"PaddingLeft"],0))),e.ctx.fillStyle=e.style[v+"Color"],I&&(e.ctx.fillStyle=e.style[v+"HoverColor"]),S&&(e.ctx.fillStyle=e.style[v+"SelectedColor"]),H&&(e.ctx.fillStyle=e.style[H+"Color"]),e.ctx.font=e.style[v+"FontHeight"]*e.scale+"px "+e.style[v+"FontName"],x.fontHeight=e.style[v+"FontHeight"]*e.scale,x.treeArrowWidth=F,x.orderByArrowWidth=D,p=void 0!==p?p:R?R(j):"",void 0!==p||R||(p="",console.warn("canvas-datagrid: Unknown format "+h.type+" add a cellFormater")),x.formattedValue=(void 0!==p&&null!==p?p:"").toString(),e.columnFilters&&void 0!==e.columnFilters[p]&&w&&(x.formattedValue=e.attributes.filterTextPrefix+p),e.dispatchEvent("rendertext",j)||(x.innerHTML||"html"===h.type?r(x):y(x)));return E&&(G=x),u(x,V,"selection"),d(x),e.movingSelection&&u(x,Z,"move",e.moveOffset),e.ctx.restore(),A+=x.width+(q?0:e.style.cellBorderWidth),x.width}}}function g(t,o,r){var n;e.attributes.showRowHeaders&&(A=0,E={rowHeaderCell:o+1},E[e.uniqueId]=t[e.uniqueId],n={name:"rowHeaderCell",width:e.style.rowHeaderCellWidth,style:"rowHeaderCell",type:"string",data:t[e.uniqueId],index:-1},n[e.uniqueId]=t[e.uniqueId],O=e.openChildren[t[e.uniqueId]],f(E,o,r)(n,-1,-1))}function p(t,o){var r,n,l,i,a=N.length;if(L-2*ee>F)return!1;if(_=e.data[t],O=e.openChildren[_[e.uniqueId]],l=(e.sizes.rows[_[e.uniqueId]]||e.style.cellHeight)*e.scale,n=(O?e.sizes.trees[_[e.uniqueId]]:0)*e.scale,k=l+n,L<-k)return!1;for(e.attributes.showRowHeaders&&(A+=$),ee=k,e.attributes.allowFreezingColumns&&(A+=Y),i=e.scrollIndexLeft+e.frozenColumn;i<a;i+=1)if(r=e.orders.columns[i],(A+=f(_,t,o)(N[r],r,i))>e.width){e.scrollIndexRight=i,e.scrollPixelRight=A;break}for(A=0,e.attributes.showRowHeaders&&(A+=$),i=0;i<e.frozenColumn&&(r=e.orders.columns[i],!((A+=f(_,t,o)(N[r],r,i))>e.width));i+=1);return e.lastFrozenColumnPixel=A,ee=k,A=-e.scrollBox.scrollLeft+e.scrollPixelLeft+e.style.cellBorderWidth,H=e.childGrids[_[e.uniqueId]],t!==e.data.length&&O?(H.visible=!0,H.parentNode={offsetTop:L+l+e.canvasOffsetTop,offsetLeft:$-1+e.canvasOffsetLeft,offsetHeight:n,offsetWidth:e.width-$-e.style.scrollBarWidth-1,offsetParent:e.intf.parentNode,parentNode:e.intf.parentNode,style:e.style,nodeType:"canvas-datagrid-tree",scrollTop:e.scrollBox.scrollTop,scrollLeft:e.scrollBox.scrollLeft,rowIndex:t},e.visibleCells.unshift({rowIndex:t,columnIndex:0,y:H.parentNode.offsetTop,x:H.parentNode.offsetLeft,height:H.height,width:H.width,style:"tree-grid",type:H.parentNode.nodeType}),H.draw()):H&&(H.parentNode.offsetHeight=0,delete e.sizes.trees[_[e.uniqueId]]),U.push([_,t,o,L,k]),e.visibleRowHeights[t]=k,L+=ee+(q?0:e.style.cellBorderWidth),!0}if(!e.dispatchEvent("beforedraw",{})&&(e.isChildGrid||e.height&&e.width)){if(e.isChildGrid&&o)return void requestAnimationFrame(e.parentGrid.draw);if(!1!==e.intf.visible){var M,E,z,T,P,H,O,k,R,L,A,D,F,W,N,j,_,G,q="collapse"===e.style.gridBorderCollapse,V=[],Z=[],K=[],U=[],Y=v(),Q=e.data.length,X=e.currentCell||{},J=e.getColumnHeaderCellHeight(),$=e.getRowHeaderCellWidth(),ee=e.style.cellHeight;b+=1,z=performance.now(),e.visibleRowHeights=[],e.data.length>e.orders.rows.length&&e.createRowOrders(),e.ctx.save(),function(){e.visibleRows=[],N=e.getVisibleSchema(),e.visibleCells=[],e.canvasOffsetTop=e.isChildGrid?e.parentNode.offsetTop:0,e.canvasOffsetLeft=e.isChildGrid?e.parentNode.offsetLeft:0,F=e.height,W=e.width}(),function(){i(0,0,W,F,0),e.ctx.clip(),e.ctx.fillStyle=e.style.gridBackgroundColor,a(0,0,W,F)}(),function(){var t,o=Math.min(e.data.length,e.frozenRow);for(A=-e.scrollBox.scrollLeft+e.scrollPixelLeft+e.style.cellBorderWidth,L=J,j=0;j<o&&(t=e.orders.rows[j],p(t,j));j+=1);e.attributes.allowFreezingRows&&(L+=e.style.frozenMarkerBorderWidth+e.style.frozenMarkerWidth-.4999999999),e.lastFrozenRowPixel=L}(),function(){e.ctx.save(),e.frozenRow>0&&(i(0,e.lastFrozenRowPixel,e.width,e.height-e.lastFrozenRowPixel,0),e.ctx.clip());var t,o,r,n=N.length;for(A=-e.scrollBox.scrollLeft+e.scrollPixelLeft+e.style.cellBorderWidth,e.attributes.snapToRow||(L+=-e.scrollBox.scrollTop+e.scrollPixelTop),j=e.frozenRow+e.scrollIndexTop;j<Q;j+=1)if(o=e.orders.rows[j],!p(o,j)){e.scrollIndexBottom=j,e.scrollPixelBottom=L;break}if(e.attributes.showNewRow){for(e.attributes.showRowHeaders&&(A+=$),k=ee=e.style.cellHeight,O=!1,t=e.scrollIndexLeft;t<n&&(r=e.orders.columns[t],!((A+=f(e.newRow,e.data.length,e.data.length)(N[r],r,t))>e.width+e.scrollBox.scrollLeft));t+=1);U.push([e.newRow,e.data.length,e.data.length,L,k])}e.ctx.restore()}(),function(){if(G){e.ctx.save();var t=e.activeCell.columnIndex+1>e.frozenColumn||e.activeCell.rowIndex+1>e.frozenRow;i(t?e.lastFrozenColumnPixel:0,t?e.lastFrozenRowPixel:0,t?e.width-e.lastFrozenColumnPixel:e.width,t?e.height-e.lastFrozenRowPixel:e.height,0),e.ctx.clip(),"row"===e.attributes.selectionMode?e.activeCell&&e.activeCell.rowIndex===G.rowIndex&&(e.ctx.lineWidth=e.style.activeCellOverlayBorderWidth,e.ctx.strokeStyle=e.style.activeCellOverlayBorderColor,s(0,G.y,e.getHeaderWidth()+$,e.visibleRowHeights[G.rowIndex])):(e.ctx.lineWidth=e.style.activeCellOverlayBorderWidth,e.ctx.strokeStyle=e.style.activeCellOverlayBorderColor,s(G.x,G.y,G.width,G.height)),e.ctx.restore()}}(),function(){function t(t,i){for(i=Math.min(i,c),n=t;n<i&&(r=e.orders.columns[n],a=N[r],o={title:a.title,name:a.name,width:a.width||e.style.cellWidth,style:"columnHeaderCell",type:"string",index:n,order:r},l={columnHeaderCell:a.title||a.name},l[e.uniqueId]="h"+a[e.uniqueId],o[e.uniqueId]=a[e.uniqueId],!((A+=f(l,-1,-1)(o,n,r))>e.width+e.scrollBox.scrollLeft));n+=1);}var o,r,n,l,a,s,c=N.length;U.forEach(function(t,o){L=t[3],ee=t[4],o===e.frozenRow&&(e.ctx.save(),i(0,e.lastFrozenRowPixel,e.width,e.height-e.lastFrozenRowPixel,0),e.ctx.clip()),g(t[0],t[1],t[2])}),e.ctx.restore(),e.attributes.showColumnHeaders&&(A=-e.scrollBox.scrollLeft+e.scrollPixelLeft+e.style.columnHeaderCellBorderWidth,e.attributes.showRowHeaders&&(A+=$),A+=Y,L=0,ee=e.getColumnHeaderCellHeight(),t(e.scrollIndexLeft+e.frozenColumn,c),s=A,A=e.style.columnHeaderCellBorderWidth,e.attributes.showRowHeaders&&(A+=$),t(0,e.frozenColumn),A=s,A<W&&(D={name:"",width:e.style.scrollBarWidth,style:"headerCellCap",isHeaderCell:!0,isHeaderCellCap:!0,type:"string",index:N.length},D[e.uniqueId]="columnHeaderCell",f({endCap:""},-1,-1)(D,-1,-1)),e.attributes.showRowHeaders&&(R={cornerCell:""},R[e.uniqueId]="cornerCell",A=0,D={name:"cornerCell",width:e.style.rowHeaderCellWidth,style:"cornerCell",type:"string",index:-1},D[e.uniqueId]="cornerCell",f(R,-1,-1)(D,-1,-1)))}(),function(){var t=e.lastFrozenRowPixel-e.style.frozenMarkerWidth,o=e.lastFrozenColumnPixel-e.style.frozenMarkerBorderWidth,r=e.currentCell&&"frozen-row-marker"===e.currentCell.style,n=e.currentCell&&"frozen-column-marker"===e.currentCell.style;e.ctx.lineWidth=e.style.frozenMarkerBorderWidth,e.attributes.allowFreezingColumns&&(e.ctx.fillStyle=n?e.style.frozenMarkerHoverColor:e.style.frozenMarkerColor,e.ctx.strokeStyle=n?e.style.frozenMarkerHoverBorderColor:e.style.frozenMarkerBorderColor,a(o,0,e.style.frozenMarkerWidth,e.height),s(o,0,e.style.frozenMarkerWidth,e.height),e.visibleCells.unshift({x:o,y:0,height:e.height,width:e.style.frozenMarkerWidth+e.style.frozenMarkerBorderWidth,style:"frozen-column-marker"})),e.attributes.allowFreezingRows&&(e.ctx.fillStyle=r?e.style.frozenMarkerHoverColor:e.style.frozenMarkerColor,e.ctx.strokeStyle=r?e.style.frozenMarkerHoverBorderColor:e.style.frozenMarkerBorderColor,a(0,t,e.width,e.style.frozenMarkerWidth),s(0,t,e.width,e.style.frozenMarkerWidth),e.visibleCells.unshift({x:0,y:t,height:e.style.frozenMarkerWidth+e.style.frozenMarkerBorderWidth,width:e.width,style:"frozen-row-marker"})),e.freezeMarkerPosition&&(e.ctx.fillStyle=e.style.frozenMarkerActiveColor,e.ctx.strokeStyle=e.style.frozenMarkerActiveBorderColor,"frozen-column-marker"===e.dragMode?(a(e.freezeMarkerPosition.x,0,e.style.frozenMarkerWidth,e.height),s(e.freezeMarkerPosition.x,0,e.style.frozenMarkerWidth,e.height)):(a(0,e.freezeMarkerPosition.y,e.width,e.style.frozenMarkerWidth),s(0,e.freezeMarkerPosition.y,e.width,e.style.frozenMarkerWidth)))}(),function(){function t(e){x(e[0],e[1])}e.ctx.lineWidth=e.style.selectionOverlayBorderWidth,e.ctx.strokeStyle=e.style.selectionOverlayBorderColor,V.filter(function(t){return t[0].rowIndex<e.frozenRow&&t[0].columnIndex<e.frozenColumn}).forEach(t),e.ctx.save(),h(0),V.filter(function(t){return t[0].rowIndex>=e.frozenRow&&t[0].columnIndex>=e.frozenColumn}).forEach(t),e.ctx.restore(),e.ctx.save(),h(1),V.filter(function(t){return t[0].rowIndex>=e.frozenRow&&t[0].columnIndex<e.frozenColumn}).forEach(t),e.ctx.restore(),e.ctx.save(),h(2),V.filter(function(t){return t[0].rowIndex<e.frozenRow&&t[0].columnIndex>=e.frozenColumn}).forEach(t),e.ctx.restore()}(),function(){(e.mobile||e.attributes.allowMovingSelection)&&(e.ctx.lineWidth=e.style.selectionHandleBorderWidth,e.ctx.strokeStyle=e.style.selectionHandleBorderColor,e.ctx.fillStyle=e.style.selectionHandleColor,K.forEach(function(t){m(t[0],t[1]);var o=e.attributes.touchSelectHandleZone/2,r=t[0].x+("tl"===t[1]||"bl"===t[1]?0:t[0].width)-o,n=t[0].y+("bl"===t[1]||"br"===t[1]?t[0].height:0)-o;e.visibleCells.unshift({x:r,y:n,height:e.style.selectionHandleSize+o,width:e.style.selectionHandleSize+o,style:"selection-handle-"+t[1]})}))}(),function(){if(e.reorderObject){var t={height:e.reorderObject.height,width:e.reorderObject.width,x:e.reorderObject.x+e.reorderObject.dragOffset.x,y:e.reorderObject.y+e.reorderObject.dragOffset.y},o={width:W,height:F,x:0,y:0};e.ctx.fillStyle=e.style.reorderMarkerBackgroundColor,e.ctx.lineWidth=e.style.reorderMarkerBorderWidth,e.ctx.strokeStyle=e.style.reorderMarkerBorderColor,"row-reorder"===e.dragMode?(t.width=W,t.x=0,o.width=W,o.height=e.currentCell.height,o.y=e.currentCell.y,a(t.x,t.y,t.width,t.height),s(t.x,t.y,t.width,t.height),e.ctx.lineWidth=e.style.reorderMarkerIndexBorderWidth,e.ctx.strokeStyle=e.style.reorderMarkerIndexBorderColor,e.currentCell.rowIndex!==e.reorderObject.rowIndex&&e.currentCell.rowIndex>-1&&e.currentCell.rowIndex<Q&&x(o,e.reorderTarget.sortRowIndex>e.reorderObject.sortRowIndex?"b":"t")):"column-reorder"===e.dragMode&&e.reorderObject&&(t.height=F,t.y=0,o.height=F,o.width=e.currentCell.width,o.y=0,o.x=e.currentCell.x,a(t.x,t.y,t.width,t.height),s(t.x,t.y,t.width,t.height),e.ctx.lineWidth=e.style.reorderMarkerIndexBorderWidth,e.ctx.strokeStyle=e.style.reorderMarkerIndexBorderColor,e.currentCell.columnIndex!==e.reorderObject.columnIndex&&e.currentCell.columnIndex>-1&&e.currentCell.columnIndex<N.length&&x(o,e.reorderTarget.sortColumnIndex>e.reorderObject.sortColumnIndex?"r":"l"))}}(),function(){e.movingSelection&&(e.ctx.lineWidth=e.style.moveOverlayBorderWidth,e.ctx.strokeStyle=e.style.moveOverlayBorderColor,e.ctx.setLineDash(e.style.moveOverlayBorderSegments),Z.forEach(function(e){x(e[0],e[1])}),e.ctx.setLineDash([]))}(),function(){var t={x:0,y:0,height:0,width:0,style:"vertical-scroll-bar"},o={x:0,y:0,height:0,width:0,style:"horizontal-scroll-bar"},r={x:0,y:0,height:0,width:0,style:"vertical-scroll-box"},n={x:0,y:0,height:0,width:0,style:"horizontal-scroll-box"},l={x:0,y:0,height:0,width:0,isCorner:!0,isScrollBoxCorner:!0,style:"scroll-box-corner"},c=2*e.style.scrollBarBoxMargin,d=.5*e.style.scrollBarBoxMargin;e.ctx.strokeStyle=e.style.scrollBarBorderColor,e.ctx.lineWidth=e.style.scrollBarBorderWidth,t.x+=W-e.style.scrollBarWidth-e.style.scrollBarBorderWidth-d,t.y+=J,t.width=e.style.scrollBarWidth+e.style.scrollBarBorderWidth+d,t.height=F-J-e.style.scrollBarWidth-d-c,e.ctx.fillStyle=e.style.scrollBarBackgroundColor,a(t.x,t.y,t.width,t.height+c),s(t.x,t.y,t.width,t.height+c),r.x=t.x+e.style.scrollBarBoxMargin,r.y=J+e.style.scrollBarBoxMargin+(t.height-e.scrollBox.scrollBoxHeight)*(e.scrollBox.scrollTop/e.scrollBox.scrollHeight),r.width=e.style.scrollBarBoxWidth,r.height=e.scrollBox.scrollBoxHeight,e.ctx.fillStyle=e.style.scrollBarBoxColor,/vertical/.test(X.context)&&(e.ctx.fillStyle=e.style.scrollBarActiveColor),r.height<t.height&&(i(r.x,r.y,r.width,r.height,e.style.scrollBarBoxBorderRadius),e.ctx.stroke(),e.ctx.fill()),o.x+=$,o.y+=F-e.style.scrollBarWidth-d,o.width=W-e.style.scrollBarWidth-$-d-c,o.height=e.style.scrollBarWidth+e.style.scrollBarBorderWidth+d,e.ctx.fillStyle=e.style.scrollBarBackgroundColor,a(o.x,o.y,o.width+c,o.height),s(o.x,o.y,o.width+c,o.height),n.y=o.y+e.style.scrollBarBoxMargin,n.x=$+e.style.scrollBarBoxMargin+(o.width-e.scrollBox.scrollBoxWidth)*(e.scrollBox.scrollLeft/e.scrollBox.scrollWidth),n.width=e.scrollBox.scrollBoxWidth,n.height=e.style.scrollBarBoxWidth,e.ctx.fillStyle=e.style.scrollBarBoxColor,/horizontal/.test(X.context)&&(e.ctx.fillStyle=e.style.scrollBarActiveColor),n.width<o.width&&(i(n.x,n.y,n.width,n.height,e.style.scrollBarBoxBorderRadius),e.ctx.stroke(),e.ctx.fill()),e.ctx.strokeStyle=e.style.scrollBarCornerBorderColor,e.ctx.fillStyle=e.style.scrollBarCornerBackgroundColor,l.x=o.x+o.width+c,l.y=t.y+t.height+c,l.width=e.style.scrollBarWidth+e.style.scrollBarBorderWidth,l.height=e.style.scrollBarWidth+e.style.scrollBarBorderWidth,i(l.x,l.y,l.width,l.height,0),e.ctx.stroke(),e.ctx.fill(),e.visibleCells.unshift(t),e.visibleCells.unshift(r),e.visibleCells.unshift(o),e.visibleCells.unshift(n),e.visibleCells.unshift(l),e.scrollBox.bar={v:t,h:o},e.scrollBox.box={v:r,h:n}}(),M&&e.resize(!0),function(){e.ctx.lineWidth=e.style.gridBorderWidth,e.ctx.strokeStyle=e.style.gridBorderColor,s(0,0,e.width,e.height)}(),function(){e.ctx.save();var t;if((e.attributes.showPerformance||e.attributes.debug)&&(0===w.length&&(w=e.fillArray(0,C,1,0)),w.pop(),w.unshift(performance.now()-z)),!e.attributes.debug)return void e.ctx.restore();e.ctx.font="14px sans-serif",t={},t.perf=(w.reduce(function(e,t){return e+t},0)/Math.min(b,w.length)).toFixed(1),t.htmlImages=Object.keys(e.htmlImageCache).length,t.reorderObject="x: "+(e.reorderObject||{columnIndex:0}).columnIndex+", y: "+(e.reorderObject||{rowIndex:0}).rowIndex,t.reorderTarget="x: "+(e.reorderTarget||{columnIndex:0}).columnIndex+", y: "+(e.reorderTarget||{rowIndex:0}).rowIndex,t.scale=e.scale,t.startScale=e.startScale,t.scaleDelta=e.scaleDelta,t.zoomDeltaStart=e.zoomDeltaStart,t.touchLength=e.touchLength,t.touches="y0: "+(e.touchPosition||{y:0}).y+" y1: "+(e.touchPosition1||{y:0}).y,t.scrollBox=e.scrollBox.toString(),t.scrollIndex="x: "+e.scrollIndexLeft+", y: "+e.scrollIndexTop,t.scrollPixel="x: "+e.scrollPixelLeft+", y: "+e.scrollPixelTop,t.canvasOffset="x: "+e.canvasOffsetLeft+", y: "+e.canvasOffsetTop,t.touchDelta="x: "+e.touchDelta.x+", y: "+e.touchDelta.y,t.touchAnimateTo="x: "+e.touchAnimateTo.x+", y: "+e.touchAnimateTo.y,t.scrollAnimation="x: "+e.scrollAnimation.x+", y: "+e.scrollAnimation.y,t.touchPPS="x: "+e.xPPS+", y: "+e.yPPS,t.touchPPST="x: "+e.xPPST+", y: "+e.yPPST,t.touchDuration=e.touchDuration,t.pointerLockPosition=e.pointerLockPosition?e.pointerLockPosition.x+", "+e.pointerLockPosition.y:"",t.size="w: "+e.width+", h: "+e.height,t.mouse="x: "+e.mouse.x+", y: "+e.mouse.y,t.touch=e.touchStart?"x: "+e.touchStart.x+", y: "+e.touchStart.y:"",t.entities=e.visibleCells.length,t.hasFocus=e.hasFocus,t.dragMode=e.dragMode,e.currentCell&&(t.columnIndex=e.currentCell.columnIndex,t.rowIndex=e.currentCell.rowIndex,t.sortColumnIndex=e.currentCell.sortColumnIndex,t.sortRowIndex=e.currentCell.sortRowIndex,t.context=e.currentCell.context,t.dragContext=e.currentCell.dragContext,t.style=e.currentCell.style,t.type=e.currentCell.type),e.ctx.textAlign="right",e.ctx.fillStyle="rgba(0, 0, 0, .60)",a(0,0,e.width,e.height),Object.keys(t).forEach(function(o,r){var n=o+": "+t[o];e.ctx.fillStyle="rgba(37, 254, 21, 1)",c(n,W-20,(e.attributes.showPerformance?140:24)+14*r)}),e.ctx.restore()}(),function(){function o(o,s,d,u,h,f,g){var m;t(r,i,n,l,s,d,u,h,f),e.ctx.fillStyle=h,a(3+n,l+9+11*g,8,8),e.ctx.fillStyle="#999999",m=void 0!==d?s[0][d]:s[0],c(o+" "+(isNaN(m)?0:m).toFixed(3),14+n,l+16+11*g)}if(e.attributes.showPerformance){var r=250,n=e.width-r-e.style.scrollBarWidth-2*e.style.scrollBarBorderWidth,l=J,i=100;0===S.length&&(S=e.fillArray(0,C,1,function(){return[0,0]})),0===I.length&&(I=e.fillArray(0,C,1,function(){return[0,0]})),0===B.length&&(B=e.fillArray(0,C,1,0)),e.ctx.lineWidth=.5,e.ctx.textAlign="left",e.ctx.font="8px sans-serif",e.ctx.fillStyle="rgba(29, 25, 26, 1.00)",a(n,l,r,i),[["Scroll Height",S,0,e.scrollBox.scrollHeight,"rgba(248, 33, 103, 1.00)",!1],["Scroll Width",S,1,e.scrollBox.scrollWidth,"rgba(66, 255, 27, 1.00)",!1],["Performance",w,void 0,200,"rgba(252, 255, 37, 1.00)",!1],["Entities",B,void 0,1500,"rgba(76, 231, 239, 1.00)",!1],["TouchPPSX",I,0,1e3,"rgba(246, 102, 24, 1.00)",!0],["TouchPPSY",I,1,1e3,"purple",!0]].forEach(function(e,t){e.push(t),o.apply(null,e)}),e.ctx.fillStyle="rgba(255, 255, 255, 0.8)",B.pop(),B.unshift(e.visibleCells.length),S.pop(),S.unshift([e.scrollBox.scrollTop,e.scrollBox.scrollLeft]),I.pop(),I.unshift([e.yPPS,e.xPPS])}}(),e.dispatchEvent("afterdraw",{})||e.ctx.restore()}}}}}.apply(t,r))&&(e.exports=n)},function(e,t,o){var r,n;r=[],void 0!==(n=function(){"use strict";return function(e){var t;e.stopPropagation=function(e){e.stopPropagation()},e.addEventListener=function(t,o){e.events[t]=e.events[t]||[],e.events[t].unshift(o)},e.removeEventListener=function(t,o){(e.events[t]||[]).forEach(function(r,n){o===r&&e.events[t].splice(n,1)})},e.dispatchEvent=function(t,o){function r(){n=!0}o=t.type?t:o||{},t=t.type||t;var n;if(e.events[t])return e.events[t].forEach(function(t){o.ctx=e.ctx,o.preventDefault=r,t.apply(e.intf,[o])}),n},e.getRatio=function(){return Math.min(e.attributes.maxPixelRatio,(window.devicePixelRatio||1)/(e.ctx.webkitBackingStorePixelRatio||e.ctx.mozBackingStorePixelRatio||e.ctx.msBackingStorePixelRatio||e.ctx.oBackingStorePixelRatio||e.ctx.backingStorePixelRatio||1))},e.resize=function(t){if(e.canvas){var o,r,n=e.getRatio(),l="collapse"===e.style.gridBorderCollapse?1:2,i=e.style.cellBorderWidth*l,a=e.style.columnHeaderCellBorderWidth*l,s=e.getColumnHeaderCellHeight(),c=e.getRowHeaderCellWidth(),d=e.style.cellHeight;return o=e.data.reduce(function(t,o,r){return t+((e.sizes.rows[o[e.uniqueId]]||d)+(e.sizes.trees[o[e.uniqueId]]||0))*e.scale+i+(e.frozenRow>r?e.sizes.trees[o[e.uniqueId]]||0:0)},0)||0,r=e.getVisibleSchema().reduce(function(t,o){return o.hidden?t:t+(e.sizes.columns[o[e.uniqueId]]||o.width||e.style.cellWidth)*e.scale+i},0)||0,e.isChildGrid?(e.width=e.parentNode.offsetWidth,e.height=e.parentNode.offsetHeight):(e.height=e.canvas.offsetHeight,e.width=e.canvas.offsetWidth,e.canvas.width=e.width*n,e.canvas.height=e.height*n,e.ctx.scale(n,n),e.canvasOffsetLeft=e.args.canvasOffsetLeft||0,e.canvasOffsetTop=e.args.canvasOffsetTop||0),e.attributes.showNewRow&&(o+=d+i),e.scrollBox.width=e.width-c,e.scrollBox.height=e.height-s-a,e.scrollBox.top=s+a,e.scrollBox.left=c,e.scrollBox.scrollHeight=o+e.style.scrollBarWidth-e.scrollBox.height,e.scrollBox.scrollWidth=r+e.style.scrollBarWidth-e.scrollBox.width,e.scrollBox.widthBoxRatio=(e.scrollBox.width-15)/(e.scrollBox.scrollWidth+e.scrollBox.width-15),e.scrollBox.scrollBoxWidth=e.scrollBox.width*e.scrollBox.widthBoxRatio-e.style.scrollBarWidth,e.scrollBox.heightBoxRatio=(e.scrollBox.height-30)/(e.scrollBox.scrollHeight+(e.scrollBox.height-30)),e.scrollBox.scrollBoxHeight=e.scrollBox.height*e.scrollBox.heightBoxRatio-e.style.scrollBarWidth,e.scrollBox.scrollBoxWidth=Math.max(e.scrollBox.scrollBoxWidth,e.style.scrollBarBoxMinSize),e.scrollBox.scrollBoxHeight=Math.max(e.scrollBox.scrollBoxHeight,e.style.scrollBarBoxMinSize),e.page=e.visibleRows.length-3-e.attributes.pageUpDownOverlap,e.resizeEditInput(),e.scroll(!0),t&&e.draw(!0),e.dispatchEvent("resize",{}),!0}},e.scroll=function(t){var o="collapse"===e.style.gridBorderCollapse?1:2,r=e.getVisibleSchema(),n=e.style.cellBorderWidth*o,l=e.style.cellHeight;for(e.scrollIndexTop=0,e.scrollPixelTop=0,e.scrollIndexLeft=0,e.scrollPixelLeft=0;e.scrollPixelTop<e.scrollBox.scrollTop&&e.scrollIndexTop<e.data.length;)e.scrollPixelTop+=((e.sizes.rows[e.data[e.scrollIndexTop][e.uniqueId]]||l)+(e.sizes.trees[e.data[e.scrollIndexTop][e.uniqueId]]||0))*e.scale+n,e.scrollIndexTop+=1;for(;e.scrollPixelLeft<e.scrollBox.scrollLeft&&e.scrollIndexLeft<r.length;)e.scrollPixelLeft+=(e.sizes.columns[r[e.scrollIndexLeft][e.uniqueId]]||r[e.scrollIndexLeft].width||e.style.cellWidth)*e.scale+n,e.scrollIndexLeft+=1;e.data.length>0&&(e.scrollIndexLeft=Math.max(e.scrollIndexLeft-1,0),e.scrollPixelLeft=Math.max(e.scrollPixelLeft-(e.sizes.columns[r[e.scrollIndexLeft][e.uniqueId]]||r[e.scrollIndexLeft].width||e.style.cellWidth)*e.scale,0),e.scrollIndexTop=Math.max(e.scrollIndexTop-1,0),e.scrollPixelTop=Math.max(e.scrollPixelTop-((e.sizes.rows[e.data[e.scrollIndexTop][e.uniqueId]]||l)+(e.sizes.trees[e.data[e.scrollIndexTop][e.uniqueId]]||0))*e.scale,0)),e.ellipsisCache={},t||e.draw(!0),requestAnimationFrame(e.resizeEditInput),e.dispatchEvent("scroll",{top:e.scrollBox.scrollTop,left:e.scrollBox.scrollLeft})},e.mousemove=function(t,o){if(!e.contextMenu&&!e.input){e.mouse=o||e.getLayerPos(t);var r,n,l,i,a=t.ctrlKey||t.metaKey||e.attributes.persistantSelectionMode,s=e.getVisibleSchema(),c=e.mouse.x,d=e.mouse.y,u=e.getCellAt(c,d),h={NativeEvent:t,cell:u,x:c,y:d},f=e.currentCell;if(clearTimeout(e.scrollTimer),e.isInGrid({x:c,y:d})||(e.hasFocus=!1),!e.dispatchEvent("mousemove",h)&&(u&&e.currentCell&&(e.rowBoundaryCrossed=e.currentCell.rowIndex!==u.rowIndex,e.columnBoundaryCrossed=e.currentCell.columnIndex!==u.columnIndex,e.cellBoundaryCrossed=e.rowBoundaryCrossed||e.columnBoundaryCrossed,["row","column","cell"].forEach(function(t){e[t+"BoundaryCrossed"]&&(h.cell=f,e.dispatchEvent(t+"mouseout",h),h.cell=u,e.dispatchEvent(t+"mouseover",h))})),e.currentCell=u,e.hasFocus)){if(e.hovers={},!e.draggingItem&&u&&-1===e.scrollModes.indexOf(u.context)&&(e.dragItem=u,e.dragMode=u.dragContext,e.cursor=u.context,"cell"===u.context&&u.data&&(e.cursor="default",e.hovers[u.data[e.uniqueId]]=[u.columnIndex]),(e.selecting||e.reorderObject)&&"cell"===u.context&&u.data)){if(l=e.getSelectionBounds(),i={x:Math.abs(e.dragStart.x-c),y:Math.abs(e.dragStart