Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

rb-table

Package Overview
Dependencies
Maintainers
1
Versions
16
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

rb-table - npm Package Compare versions

Comparing version 1.0.7 to 1.0.8

2

dist/rb-table.bundle.min.js

@@ -1,1 +0,1 @@

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):e.RBTable=t(e.React)}(this,function(e){"use strict";e=e&&e.hasOwnProperty("default")?e.default:e;var t=Object.getOwnPropertySymbols,r=Object.prototype.hasOwnProperty,o=Object.prototype.propertyIsEnumerable;!function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var t={},r=0;10>r;r++)t["_"+String.fromCharCode(r)]=r;if("0123456789"!==Object.getOwnPropertyNames(t).map(function(e){return t[e]}).join(""))return!1;var o={};"abcdefghijklmnopqrst".split("").forEach(function(e){o[e]=e}),Object.keys(Object.assign({},o)).join("")}catch(e){return!1}}();var n="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED";function i(){}var l,a,s,d,c,h,f,u,p,b,m,y,w,v,_,g,x=(function(e){e.exports=function(){function e(e,t,r,o,i,l){if(l!==n){var a=Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw a.name="Invariant Violation",a}}function t(){return e}e.isRequired=e;var r={array:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t};return r.checkPropTypes=i,r.PropTypes=r,r}()}(l={exports:{}},l.exports),l.exports),E=!1;function S(){if(!E){E=!0;var e=navigator.userAgent,t=/(?:MSIE.(\d+\.\d+))|(?:(?:Firefox|GranParadiso|Iceweasel).(\d+\.\d+))|(?:Opera(?:.+Version.|.)(\d+\.\d+))|(?:AppleWebKit.(\d+(?:\.\d+)?))|(?:Trident\/\d+\.\d+.*rv:(\d+\.\d+))/.exec(e),r=/(Mac OS X)|(Windows)|(Linux)/.exec(e);if(w=/\b(iPhone|iP[ao]d)/.exec(e),v=/\b(iP[ao]d)/.exec(e),m=/Android/i.exec(e),_=/FBAN\/\w+;/i.exec(e),g=/Mobile/i.exec(e),y=!!/Win64/.exec(e),t){(a=t[1]?parseFloat(t[1]):t[5]?parseFloat(t[5]):NaN)&&document&&document.documentMode&&(a=document.documentMode);var o=/(?:Trident\/(\d+.\d+))/.exec(e);f=o?parseFloat(o[1])+4:a,s=t[2]?parseFloat(t[2]):NaN,d=t[3]?parseFloat(t[3]):NaN,(c=t[4]?parseFloat(t[4]):NaN)?(t=/(?:Chrome\/(\d+\.\d+))/.exec(e),h=t&&t[1]?parseFloat(t[1]):NaN):h=NaN}else a=s=d=h=c=NaN;if(r){if(r[1]){var n=/(?:Mac OS X (\d+(?:[._]\d+)?))/.exec(e);u=!n||parseFloat(n[1].replace("_","."))}else u=!1;p=!!r[2],b=!!r[3]}else u=p=b=!1}}var M,O={ie:function(){return S()||a},ieCompatibilityMode:function(){return S()||f>a},ie64:function(){return O.ie()&&y},firefox:function(){return S()||s},opera:function(){return S()||d},webkit:function(){return S()||c},safari:function(){return O.webkit()},chrome:function(){return S()||h},windows:function(){return S()||p},osx:function(){return S()||u},linux:function(){return S()||b},iphone:function(){return S()||w},mobile:function(){return S()||w||v||m||g},nativeApp:function(){return S()||_},android:function(){return S()||m},ipad:function(){return S()||v}},C=O,N=!("undefined"==typeof window||!window.document||!window.document.createElement),k={canUseDOM:N,canUseWorkers:"undefined"!=typeof Worker,canUseEventListeners:N&&!(!window.addEventListener&&!window.attachEvent),canUseViewport:N&&!!window.screen,isInWorker:!N};k.canUseDOM&&(M=document.implementation&&document.implementation.hasFeature&&!0!==document.implementation.hasFeature("",""));var R=function(e,t){if(!k.canUseDOM||t&&!("addEventListener"in document))return!1;var r="on"+e,o=r in document;if(!o){var n=document.createElement("div");n.setAttribute(r,"return;"),o="function"==typeof n[r]}return!o&&M&&"wheel"===e&&(o=document.implementation.hasFeature("Events.wheel","3.0")),o},D=10,T=40,z=800;function W(e){var t=0,r=0,o=0,n=0;return"detail"in e&&(r=e.detail),"wheelDelta"in e&&(r=-e.wheelDelta/120),"wheelDeltaY"in e&&(r=-e.wheelDeltaY/120),"wheelDeltaX"in e&&(t=-e.wheelDeltaX/120),"axis"in e&&e.axis===e.HORIZONTAL_AXIS&&(t=r,r=0),o=t*D,n=r*D,"deltaY"in e&&(n=e.deltaY),"deltaX"in e&&(o=e.deltaX),(o||n)&&e.deltaMode&&(1==e.deltaMode?(o*=T,n*=T):(o*=z,n*=z)),o&&!t&&(t=1>o?-1:1),n&&!r&&(r=1>n?-1:1),{spinX:t,spinY:r,pixelX:o,pixelY:n}}W.getEventType=function(){return C.firefox()?"DOMMouseScroll":R("wheel")?"wheel":"mousewheel"};var B,L,P=W,X=navigator.userAgent.match(/Trident/),A=(B=window.requestAnimationFrame||window.mozRequestAnimationFrame||window.webkitRequestAnimationFrame||function(e){return window.setTimeout(e,20)},function(e){return B(e)}),F=(L=window.cancelAnimationFrame||window.mozCancelAnimationFrame||window.webkitCancelAnimationFrame||window.clearTimeout,function(e){return L(e)});function j(e){var t=e.target||e.srcElement;t.__resizeRAF__&&F(t.__resizeRAF__),t.__resizeRAF__=A(function(){var r=t.__resizeTrigger__;r.__resizeListeners__.forEach(function(t){t.call(r,e)})})}function q(){this.contentDocument.defaultView.__resizeTrigger__=this.__resizeElement__,this.contentDocument.defaultView.addEventListener("resize",j)}function H(e,t){if(!e.__resizeListeners__){e.__resizeListeners__=[];var r=e.__resizeTrigger__=document.createElement("object");r.setAttribute("style","display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; pointer-events: none; z-index: -1;"),r.__resizeElement__=e,r.onload=q,r.type="text/html",X&&e.appendChild(r),r.data="about:blank",X||e.appendChild(r)}e.__resizeListeners__.push(t)}function I(e,t){var r={};for(var o in e)0>t.indexOf(o)&&Object.prototype.hasOwnProperty.call(e,o)&&(r[o]=e[o]);return r}function U(t){for(var r=arguments.length,o=Array(r>1?r-1:0),n=1;r>n;n++)o[n-1]=arguments[n];if(t)return"string"==typeof t||"number"==typeof t?t:"function"==typeof t?t.apply(void 0,o):e.isValidElement(t)?e.cloneElement(t,{tablecontext:o}):void 0}function Y(e){return e.width?{width:e.width}:null}function V(e){return e?e+"px":e}function G(e,t){e.style.height=t}function K(e,t,r){return e.width&&e[t]?Error(r+".column."+t+" will not take effect when column.width is set."):"maxWidth"===t&&e.minWidth>e.maxWidth?Error(r+".column.maxWidth is smaller then column.minWidth"):void 0}var Z=function(t){function r(e){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,r);var o=function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}(this,t.call(this,e));return o.setTableRef=o.setTableRef.bind(o),o.handleResize=o.handleResize.bind(o),o.handleScroll=o.handleScroll.bind(o),o.handleClickRow=o.handleClickRow.bind(o),o.handleWindowMouseUp=o.handleWindowMouseUp.bind(o),o.handleWindowMouseMove=o.handleWindowMouseMove.bind(o),o.hScrollPanelMouseDown=o.hScrollPanelMouseDown.bind(o),o.vScrollPanelMouseDown=o.vScrollPanelMouseDown.bind(o),o.hScrollBarMouseDown=o.hScrollBarMouseDown.bind(o),o.vScrollBarMouseDown=o.vScrollBarMouseDown.bind(o),o}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(r,t),r.prototype.componentWillUnmount=function(){H(this.table,this.handleResize),window.removeEventListener("mouseup",this.handleWindowMouseUp),window.removeEventListener("mousemove",this.handleWindowMouseMove)},r.prototype.componentDidMount=function(){var e=this;window.addEventListener("mouseup",this.handleWindowMouseUp),window.addEventListener("mousemove",this.handleWindowMouseMove),setTimeout(function(){e.reflow()})},r.prototype.setTableRef=function(e){var t,r;e&&(this.table&&(r=this.handleResize,(t=this.table).__resizeListeners__&&(t.__resizeListeners__.splice(t.__resizeListeners__.indexOf(r),1),t.__resizeListeners__.length||(t.__resizeTrigger__.contentDocument.defaultView.removeEventListener("resize",j),t.__resizeTrigger__=!t.removeChild(t.__resizeTrigger__)))),this.table=e,H(e,this.handleResize))},r.prototype.componentDidUpdate=function(){this.reflow()},r.prototype.handleResize=function(){this.reflow()},r.prototype.reflow=function(){this.alignTable(),this.scrollByOffset(0,0)},r.prototype.handleScroll=function(e){if(!this.autoSize){var t=P(e),r=t.pixelY,o=t.pixelX;r=Math.round(.5*r);var n=this.scrollByOffset(o=Math.round(.5*o),r).hasOffset;this.autoSize||e.preventDefault(),n&&e.stopPropagation()}},r.prototype.handleClickRow=function(e,t){this.props.onRowClick&&this.props.onRowClick(e,t)},r.prototype.setLocation=function(e,t){this.x=e,this.y=t},r.prototype.handleWindowMouseUp=function(){this.mouseIsDownRight=!1,this.mouseIsDownBottom=!1},r.prototype.handleWindowMouseMove=function(e){var t=e.clientY;this.mouseIsDownBottom?this.handleMouseMove(e.clientX,this.y):this.mouseIsDownRight&&this.handleMouseMove(this.x,t)},r.prototype.hScrollPanelMouseDown=function(e){if(1===e.nativeEvent.which){e.preventDefault(),e.stopPropagation();var t=e.clientX-this.refs.hScrollBar.getBoundingClientRect().left;this.scrollByOffset(t,0)}},r.prototype.vScrollPanelMouseDown=function(e){if(1===e.nativeEvent.which){e.preventDefault(),e.stopPropagation();var t=e.clientY-this.refs.vScrollBar.getBoundingClientRect().top;this.scrollByOffset(0,t)}},r.prototype.hScrollBarMouseDown=function(e){1===e.nativeEvent.which&&(e.preventDefault(),e.stopPropagation(),this.mouseIsDownBottom=!0,this.setLocation(e.clientX,e.clientY))},r.prototype.vScrollBarMouseDown=function(e){1===e.nativeEvent.which&&(e.preventDefault(),e.stopPropagation(),this.mouseIsDownRight=!0,this.setLocation(e.clientX,e.clientY))},r.prototype.handleMouseMove=function(e,t){var r=e-this.x,o=t-this.y;this.setLocation(e,t),this.scrollByOffset(r,o)},r.prototype.getHoverClass=function(){var e=this.props.prefixCls,t=" "+e+"-row--hover";return this.props.onRowClick&&(t+=e+"-row--clickable"),t},r.prototype.bodies=function(){var e=this.refs;return[e.bodyMiddleContent,e.bodyLeftContent,e.bodyRightContent].filter(function(e){return!!e})},r.prototype.handleRowEnter=function(e){var t=this;this.bodies().forEach(function(r){return r.children[e].className+=t.getHoverClass()})},r.prototype.handleRowLeave=function(e){var t=this;this.bodies().forEach(function(r){return r.children[e].className=r.children[e].className.replace(t.getHoverClass(),"")})},r.prototype.getTableWidthHeight=function(){var e=this.refs,t=e.virtualTable,r=e.scrollX,o=[],n=[];t.style.width="",r.clientWidth-this.props.columns.length>t.offsetWidth&&(t.style.width=V(r.clientWidth-this.props.columns.length));var i=t.querySelector("thead > tr"),l=t.querySelector("colgroup");function a(){for(var e=0;i.children.length>e;e++)o[e]=i.children[e].offsetWidth+1}return this.props.columns.forEach(function(e,t){l.children[t].style.width=V(e.width||"")}),a(),this.props.columns.forEach(function(e,t){var r=e.width,n=e.minWidth,i=e.maxWidth;(i||n)&&(r=o[t],r=Math.min(i||r,r),l.children[t].style.width=V(r=Math.max(n||r,r)))}),a(),t.querySelectorAll("tbody > tr").forEach(function(e,t){n[t]=e.offsetHeight}),{columnWs:o,rowHs:n}},r.prototype.alignTable=function(){var e=this,t=this.refs,r=t.headerLeft,o=t.headerRight,n=t.body,i=this.props.columns,l=[r,o].filter(function(e){return!!e});l.forEach(function(e){G(e.querySelector("tr"),"")});var a,s,d=this.getTableWidthHeight(),c=d.columnWs,h=d.rowHs,f=this.refs.virtualTable.querySelector("thead > tr").clientHeight,u=this.table.clientHeight,p=this.refs.hScrollPanel.offsetHeight,b=this.refs.bodyMiddle.querySelector("colgroup"),m=this.refs.headerMiddle.querySelector("colgroup"),y=0,w=0;c.forEach(function(t,n){var l=V(t);y+=t,b.children[n].style.width=l,m.children[n].style.width=l,i[n].width||("left"===i[n].fixed?(r.querySelector("colgroup").children[n].style.width=l,e.refs.bodyLeft.querySelector("colgroup").children[n].style.width=l):"right"===i[n].fixed&&(o.querySelector("colgroup").children[w].style.width=l,e.refs.bodyRight.querySelector("colgroup").children[w].style.width=l,w++))}),a=this.refs.header,s=V(y=Math.max(y,this.refs.scrollX.clientWidth)),a.style.width=s,n.style.width=V(this.refs.header.clientWidth+(this.autoSize?0:300+n.offsetWidth-n.clientWidth));var v=this.refs.header.offsetHeight;(l.forEach(function(e){G(e.querySelector("tr"),V(f)),G(e.parentElement,V(v))}),this.bodies().forEach(function(e){!function(e,t){for(var r=0;e.children.length>r;r++)t(e.children[r],r)}(e,function(e,t){return G(e,V(h[t]))})}),u>99999||this.autoSize)?(this.autoSize=!0,n.style.width=V(this.refs.header.clientWidth),this.refs.scrollX.style.paddingBottom=0,this.refs.scrollX.style.overflowX="auto",this.refs.body.style.paddingRight=0,this.refs.body.style.overflowY="hidden",this.table.style.height=V(this.refs.scrollX.offsetHeight)):this.refs.body.style.height=V(u-v-p)},r.prototype.scrollByOffset=function(e,t){var r=this.refs,o=r.bodyMiddle,n=r.hScrollBar,i=r.hScrollPanel,l=r.vScrollBar,a=r.vScrollPanel;if(!this.table||this.autoSize)return i.style.visibility="hidden",void(a.style.visibility="hidden");if(o){var s=this.refs.scrollX.offsetWidth,d=this.refs.body.clientHeight,c=o.offsetWidth,h=o.offsetHeight,f=1,u=1;if(h>d||(a.style.visibility="hidden",l=null,a=null),c>s||(i.style.visibility="hidden",n=null,i=null),n){var p=i.offsetWidth,b=Math.max(p*s/c,20);f=(c-s)/(p-b)}if(l){var m=a.offsetHeight,y=Math.max(m*d/h,20);u=(h-d)/(m-y)}var w=this.refs.scrollX.scrollLeft+(e*=f),v=this.refs.body.scrollTop+(t*=u),_=!0;if(w>c-s&&(w=c-s,_=!1),0>w&&(w=0,_=!1),v>h-d&&(v=h-d,_=!1),0>v&&(v=0,_=!1),this.refs.body.scrollTop=v,this.refs.scrollX.scrollLeft=w,n)i.style.visibility="visible",n.style.width=Math.round(b)+"px",n.style.transform="translateX("+Math.round(w/f)+"px)";if(x(this.refs.bodyLeft,w),x(this.refs.bodyRight,w-c+s),l){var g=Math.round(v/u);a.style.visibility="visible",l.style.height=Math.round(y)+"px",l.style.transform="translateY("+g+"px)"}return{hasOffset:_}}function x(e,t){e&&(0===t&&e?e.parentElement.parentElement.style.display="none":(e.parentElement.parentElement.style.display="block",e.style.transform="translateY("+-v+"px)"))}},r.prototype.renderHeaderSideOf=function(t){var r=t.side,o=I(t,["side"]),n=r.toLowerCase(),i=o[n+"Columns"];if(0===i.length)return null;var l=this.props.prefixCls;return e.createElement("table",{ref:"header"+r},e.createElement("colgroup",null,i.map(function(t,r){return e.createElement("col",{key:r,style:Y(t)})})),e.createElement("thead",null,e.createElement("tr",{className:l+"-row "+l+"-row--header"},i.map(function(t,r){return e.createElement("td",{key:t.dataIndex||r,className:l+"-cell "+l+"-cell--header "+(t.headerClassName||""),style:t.headerStyle},U(t.header,o.data,t))}))))},r.prototype.renderBodySideOf=function(t){var r=this,o=t.side,n=t.data,i=I(t,["side","data"])[o.toLowerCase()+"Columns"];if(0===i.length)return null;var l=this.props.prefixCls;return e.createElement("table",{ref:"body"+o},e.createElement("colgroup",null,i.map(function(t,r){return e.createElement("col",{key:r,style:Y(t)})})),e.createElement("tbody",{ref:"body"+o+"Content"},n.map(function(t,o){return e.createElement("tr",{key:o,className:l+"-row "+l+"-row--body",onMouseEnter:function(){return r.handleRowEnter(o)},onMouseLeave:function(){return r.handleRowLeave(o)},onClick:function(){return r.handleClickRow(t,o)}},i.map(function(r,o){return e.createElement("td",{key:o,style:r.cellStyle,className:l+"-cell "+l+"-cell--body "+(r.cellClassName||"")},U(r.cell,t,n,r))}))})))},r.prototype.renderVirtualTable=function(t){var r=t.data,o=t.columns,n=this.props.prefixCls;return e.createElement("table",{className:n+"-hidden-layout",ref:"virtualTable"},e.createElement("colgroup",null,o.map(function(t,r){return e.createElement("col",{key:r,style:Y(t)})})),e.createElement("thead",null,e.createElement("tr",{className:n+"-row "+n+"-row--header"},o.map(function(r,o){return e.createElement("td",{key:r.dataIndex||o,className:n+"-cell "+n+"-cell--header",style:r.headerStyle},U(r.header,t.data,r))}))),e.createElement("tbody",{ref:"virtualTableBody"},r.map(function(t,i){return e.createElement("tr",{key:i,className:n+"-row "+n+"-row--body"},o.map(function(o,i){return e.createElement("td",{key:i,style:o.cellStyle,className:n+"-cell "+n+"-cell--body "+(o.cellClassName||"")},U(o.cell,t,r,o))}))})))},r.prototype.render=function(){var t=this,r=this.props,o=r.data,n=r.columns,i=r.prefixCls,l=r.style,a=r.className,s=n.slice(),d=n.filter(function(e){return"left"===e.fixed}),c=n.filter(function(e){return"right"===e.fixed}),h=function(e){return{side:e,columns:n,leftColumns:d,rightColumns:c,middleColumns:s,data:o}};return e.createElement("div",{className:i+" "+(a||""),key:"rb-table",ref:this.setTableRef,onWheel:this.handleScroll,style:l},e.createElement("div",{ref:"scrollX",className:i+"-scrollx",onScroll:function(){return t.scrollByOffset(0,0)}},e.createElement("div",{className:i+"__header",ref:"header"},this.renderHeaderSideOf(h("Middle"))),e.createElement("div",{className:i+"__body",ref:"body",onScroll:function(){return t.scrollByOffset(0,0)}},this.renderBodySideOf(h("Middle")),this.renderVirtualTable(h("virtual")))),!!d.length&&e.createElement("div",{className:i+"-fixed "+i+"-fixed--left"},e.createElement("div",{className:i+"-fixed__header"},this.renderHeaderSideOf(h("Left"))),e.createElement("div",{className:i+"-fixed__body"},this.renderBodySideOf(h("Left")))),!!c.length&&e.createElement("div",{className:i+"-fixed "+i+"-fixed--right"},e.createElement("div",{className:i+"-fixed__header"},this.renderHeaderSideOf(h("Right"))),e.createElement("div",{className:i+"-fixed__body"},this.renderBodySideOf(h("Right")))),e.createElement("div",{className:i+"__vscroll",ref:"vScrollPanel",onMouseDown:this.vScrollPanelMouseDown},e.createElement("div",{ref:"vScrollBar",className:i+"__vscroll__bar",onMouseDown:this.vScrollBarMouseDown})),e.createElement("div",{className:i+"__hscroll",ref:"hScrollPanel",onMouseDown:this.hScrollPanelMouseDown},e.createElement("div",{ref:"hScrollBar",className:i+"__hscroll__bar",onMouseDown:this.hScrollBarMouseDown})),this.props.children)},r}(e.Component);Z.propTypes={columns:x.arrayOf(x.shape({header:x.oneOfType([x.string,x.number,x.func,x.element]).isRequired,cell:x.oneOfType([x.string,x.number,x.func,x.element]).isRequired,width:x.number,minWidth:K,maxWidth:K,fixed:x.oneOf(["left","right"]),headerClassName:x.string,cellClassName:x.string,headerStyle:x.obj,cellStyle:x.obj})),data:x.array.isRequired,prefixCls:x.string.isRequired,onRowClick:x.func},Z.defaultProps={prefixCls:"rb-table",data:[]};return function(e,t){void 0===t&&(t={});var r=t.insertAt;if(e&&"undefined"!=typeof document){var o=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===r&&o.firstChild?o.insertBefore(n,o.firstChild):o.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.appendChild(document.createTextNode(e))}}('.rb-table{overflow:hidden;position:relative;background:#fff;color:#333;box-sizing:border-box;border:1px solid #e8e8e8}.rb-table table{width:100%;border-spacing:0;font-size:12px;table-layout:fixed;border:none;word-break:break-all}.rb-table-scrollx{position:relative;overflow-x:scroll;overflow-y:hidden;padding-bottom:99999px}.rb-table__body{overflow:scroll;overflow-x:hidden;box-sizing:border-box;padding-right:300px}.rb-table__body .rb-table-hidden-layout{position:fixed;visibility:hidden;top:1000000px;width:-webkit-max-content;width:-moz-max-content;width:max-content;table-layout:auto}.rb-table-fixed{overflow:hidden;position:absolute;top:0;background:#fff}.rb-table-fixed table{width:auto}.rb-table-fixed__body{overflow:hidden}.rb-table-fixed--left{left:0;border-right:1px solid #e8e8e8}.rb-table-fixed--right{right:0;border-left:1px solid #e8e8e8}.rb-table-row--hover{background-color:#fafafa}.rb-table-row--clickable{cursor:pointer}.rb-table-cell{padding:14px 10px;border-bottom:1px solid #e8e8e8;font-size:12px}.rb-table__hscroll{visibility:hidden;position:absolute;box-sizing:border-box;left:0;bottom:0;right:14px;background:#f9f9f9;height:14px;z-index:1}.rb-table__hscroll__bar{padding:3px 0;height:100%;box-sizing:border-box}.rb-table__hscroll__bar:before{content:"";display:block;background:#bfbfbf;border-radius:14px;height:100%;width:100%}.rb-table__hscroll__bar:hover:before{background:#7f7f7f}.rb-table__vscroll{visibility:hidden;position:absolute;box-sizing:border-box;background:#f9f9f9;top:0;bottom:0;right:0;width:14px;z-index:1}.rb-table__vscroll__bar{padding:0 3px}.rb-table__vscroll__bar:before{content:"";display:block;background:#bfbfbf;border-radius:14px;height:100%;width:100%}.rb-table__vscroll__bar:hover:before{background:#7f7f7f}.rb-table-fixed--left .rb-table-cell:first-child,.rb-table-scrollx .rb-table-cell:first-child{padding-left:30px}.rb-table-fixed--right .rb-table-cell:last-child,.rb-table-scrollx .rb-table-cell:last-child{padding-right:30px}'),Z});
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):e.RBTable=t(e.React)}(this,function(e){"use strict";e=e&&e.hasOwnProperty("default")?e.default:e;var t=Object.getOwnPropertySymbols,r=Object.prototype.hasOwnProperty,n=Object.prototype.propertyIsEnumerable;!function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var t={},r=0;10>r;r++)t["_"+String.fromCharCode(r)]=r;if("0123456789"!==Object.getOwnPropertyNames(t).map(function(e){return t[e]}).join(""))return!1;var n={};"abcdefghijklmnopqrst".split("").forEach(function(e){n[e]=e}),Object.keys(Object.assign({},n)).join("")}catch(e){return!1}}();var o="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED";function i(){}var l,a,s,c,d,h,u,f,p,b,m,y,v,w,_,g,x=(function(e){e.exports=function(){function e(e,t,r,n,i,l){if(l!==o){var a=Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw a.name="Invariant Violation",a}}function t(){return e}e.isRequired=e;var r={array:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t};return r.checkPropTypes=i,r.PropTypes=r,r}()}(l={exports:{}},l.exports),l.exports),E=!1;function S(){if(!E){E=!0;var e=navigator.userAgent,t=/(?:MSIE.(\d+\.\d+))|(?:(?:Firefox|GranParadiso|Iceweasel).(\d+\.\d+))|(?:Opera(?:.+Version.|.)(\d+\.\d+))|(?:AppleWebKit.(\d+(?:\.\d+)?))|(?:Trident\/\d+\.\d+.*rv:(\d+\.\d+))/.exec(e),r=/(Mac OS X)|(Windows)|(Linux)/.exec(e);if(v=/\b(iPhone|iP[ao]d)/.exec(e),w=/\b(iP[ao]d)/.exec(e),m=/Android/i.exec(e),_=/FBAN\/\w+;/i.exec(e),g=/Mobile/i.exec(e),y=!!/Win64/.exec(e),t){(a=t[1]?parseFloat(t[1]):t[5]?parseFloat(t[5]):NaN)&&document&&document.documentMode&&(a=document.documentMode);var n=/(?:Trident\/(\d+.\d+))/.exec(e);u=n?parseFloat(n[1])+4:a,s=t[2]?parseFloat(t[2]):NaN,c=t[3]?parseFloat(t[3]):NaN,(d=t[4]?parseFloat(t[4]):NaN)?(t=/(?:Chrome\/(\d+\.\d+))/.exec(e),h=t&&t[1]?parseFloat(t[1]):NaN):h=NaN}else a=s=c=h=d=NaN;if(r){if(r[1]){var o=/(?:Mac OS X (\d+(?:[._]\d+)?))/.exec(e);f=!o||parseFloat(o[1].replace("_","."))}else f=!1;p=!!r[2],b=!!r[3]}else f=p=b=!1}}var M,O={ie:function(){return S()||a},ieCompatibilityMode:function(){return S()||u>a},ie64:function(){return O.ie()&&y},firefox:function(){return S()||s},opera:function(){return S()||c},webkit:function(){return S()||d},safari:function(){return O.webkit()},chrome:function(){return S()||h},windows:function(){return S()||p},osx:function(){return S()||f},linux:function(){return S()||b},iphone:function(){return S()||v},mobile:function(){return S()||v||w||m||g},nativeApp:function(){return S()||_},android:function(){return S()||m},ipad:function(){return S()||w}},T=O,C=!("undefined"==typeof window||!window.document||!window.document.createElement),N={canUseDOM:C,canUseWorkers:"undefined"!=typeof Worker,canUseEventListeners:C&&!(!window.addEventListener&&!window.attachEvent),canUseViewport:C&&!!window.screen,isInWorker:!C};N.canUseDOM&&(M=document.implementation&&document.implementation.hasFeature&&!0!==document.implementation.hasFeature("",""));var k=function(e,t){if(!N.canUseDOM||t&&!("addEventListener"in document))return!1;var r="on"+e,n=r in document;if(!n){var o=document.createElement("div");o.setAttribute(r,"return;"),n="function"==typeof o[r]}return!n&&M&&"wheel"===e&&(n=document.implementation.hasFeature("Events.wheel","3.0")),n},R=10,z=40,D=800;function P(e){var t=0,r=0,n=0,o=0;return"detail"in e&&(r=e.detail),"wheelDelta"in e&&(r=-e.wheelDelta/120),"wheelDeltaY"in e&&(r=-e.wheelDeltaY/120),"wheelDeltaX"in e&&(t=-e.wheelDeltaX/120),"axis"in e&&e.axis===e.HORIZONTAL_AXIS&&(t=r,r=0),n=t*R,o=r*R,"deltaY"in e&&(o=e.deltaY),"deltaX"in e&&(n=e.deltaX),(n||o)&&e.deltaMode&&(1==e.deltaMode?(n*=z,o*=z):(n*=D,o*=D)),n&&!t&&(t=1>n?-1:1),o&&!r&&(r=1>o?-1:1),{spinX:t,spinY:r,pixelX:n,pixelY:o}}P.getEventType=function(){return T.firefox()?"DOMMouseScroll":k("wheel")?"wheel":"mousewheel"};var L,W,X=P,B=navigator.userAgent.match(/Trident/),j=(L=window.requestAnimationFrame||window.mozRequestAnimationFrame||window.webkitRequestAnimationFrame||function(e){return window.setTimeout(e,20)},function(e){return L(e)}),A=(W=window.cancelAnimationFrame||window.mozCancelAnimationFrame||window.webkitCancelAnimationFrame||window.clearTimeout,function(e){return W(e)});function F(e){var t=e.target||e.srcElement;t.__resizeRAF__&&A(t.__resizeRAF__),t.__resizeRAF__=j(function(){var r=t.__resizeTrigger__;r.__resizeListeners__.forEach(function(t){t.call(r,e)})})}function q(){this.contentDocument.defaultView.__resizeTrigger__=this.__resizeElement__,this.contentDocument.defaultView.addEventListener("resize",F)}function H(e,t){if(!e.__resizeListeners__){e.__resizeListeners__=[];var r=e.__resizeTrigger__=document.createElement("object");r.setAttribute("style","display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; pointer-events: none; z-index: -1;"),r.__resizeElement__=e,r.onload=q,r.type="text/html",B&&e.appendChild(r),r.data="about:blank",B||e.appendChild(r)}e.__resizeListeners__.push(t)}var I=Object.assign||function(e){for(var t=1;arguments.length>t;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e};function Y(e,t){var r={};for(var n in e)0>t.indexOf(n)&&Object.prototype.hasOwnProperty.call(e,n)&&(r[n]=e[n]);return r}function U(t){for(var r=arguments.length,n=Array(r>1?r-1:0),o=1;r>o;o++)n[o-1]=arguments[o];if(t)return"string"==typeof t||"number"==typeof t?t:"function"==typeof t?t.apply(void 0,n):e.isValidElement(t)?e.cloneElement(t,{tablecontext:n}):void 0}function V(e){return e.width?{width:e.width}:null}function G(e){return e?e+"px":e}function K(e,t){e.style.height=t}function Z(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},t=e.touches,r=e.clientX,n=e.clientY;if(t&&t.length>0){var o=t[0];r=o.clientX,n=o.clientY}return{clientX:r,clientY:n}}function J(e){e.preventDefault()}function Q(e,t,r){return e.width&&e[t]?Error(r+".column."+t+" will not take effect when column.width is set."):"maxWidth"===t&&e.minWidth>e.maxWidth?Error(r+".column.maxWidth is smaller then column.minWidth"):void 0}var $=function(t){function r(e){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,r);var n=function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}(this,t.call(this,e));return n.setTableRef=n.setTableRef.bind(n),n.handleResize=n.handleResize.bind(n),n.handleScroll=n.handleScroll.bind(n),n.handleClickRow=n.handleClickRow.bind(n),n.handleMoveEnd=n.handleMoveEnd.bind(n),n.handleMove=n.handleMove.bind(n),n.hScrollPanelMouseDown=n.hScrollPanelMouseDown.bind(n),n.vScrollPanelMouseDown=n.vScrollPanelMouseDown.bind(n),n.horizontalMoveStart=n.horizontalMoveStart.bind(n),n.verticalMoveStart=n.verticalMoveStart.bind(n),n.touchStart=n.touchStart.bind(n),n.touchEnd=n.touchEnd.bind(n),n}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(r,t),r.prototype.componentWillUnmount=function(){H(this.table,this.handleResize),window.removeEventListener("mousemove",this.handleMove),window.removeEventListener("mouseup",this.handleMoveEnd)},r.prototype.componentDidMount=function(){var e=this;window.addEventListener("mousemove",this.handleMove),window.addEventListener("mouseup",this.handleMoveEnd),setTimeout(function(){e.reflow()})},r.prototype.setTableRef=function(e){var t,r;e&&(this.table&&(r=this.handleResize,(t=this.table).__resizeListeners__&&(t.__resizeListeners__.splice(t.__resizeListeners__.indexOf(r),1),t.__resizeListeners__.length||(t.__resizeTrigger__.contentDocument.defaultView.removeEventListener("resize",F),t.__resizeTrigger__=!t.removeChild(t.__resizeTrigger__)))),this.table=e,H(e,this.handleResize))},r.prototype.componentDidUpdate=function(){this.reflow()},r.prototype.handleResize=function(){this.reflow()},r.prototype.reflow=function(){this.alignTable(),this.scrollByOffset(0,0)},r.prototype.handleScroll=function(e){if(!this.autoSize){var t=X(e),r=t.pixelY,n=t.pixelX;r=Math.round(.5*r);var o=this.scrollByOffset(n=Math.round(.5*n),r).hasOffset;this.autoSize||e.preventDefault(),o&&e.stopPropagation()}},r.prototype.handleClickRow=function(e,t){this.props.onRowClick&&this.props.onRowClick(e,t)},r.prototype.setLocation=function(e){var t=e.clientY;this.x=e.clientX,this.y=t},r.prototype.handleMoveEnd=function(){this.mouseIsDownRight=!1,this.mouseIsDownBottom=!1,this.touchIsStarted=!1},r.prototype.handleMove=function(e){var t=Z(e),r=t.clientX,n=t.clientY;this.mouseIsDownBottom?this.move({clientX:r,clientY:this.y}):this.mouseIsDownRight?this.move({clientX:this.x,clientY:n}):this.touchIsStarted&&(e.preventDefault(),this.move({clientX:r,clientY:n},-1))},r.prototype.move=function(e){var t=e.clientX,r=e.clientY,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:1,o=t-this.x,i=r-this.y;this.setLocation({clientX:t,clientY:r}),this.scrollByOffset(n*o,n*i)},r.prototype.touchStart=function(e){this.touchIsStarted=!0,this.setLocation(Z(e))},r.prototype.touchEnd=function(e){this.touchIsStarted=!1},r.prototype.hScrollPanelMouseDown=function(e){if(1>=e.nativeEvent.which){e.preventDefault(),e.stopPropagation();var t=this.refs.hScrollBar.getBoundingClientRect(),r=t.left,n=t.right,o=Z(e).clientX-.5*(r+n);this.scrollByOffset(o,0)}},r.prototype.vScrollPanelMouseDown=function(e){if(1>=e.nativeEvent.which){e.preventDefault(),e.stopPropagation();var t=this.refs.vScrollBar.getBoundingClientRect(),r=t.top,n=t.bottom,o=Z(e).clientY-.5*(r+n);this.scrollByOffset(0,o)}},r.prototype.horizontalMoveStart=function(e){e.nativeEvent.which>1||(e.preventDefault(),e.stopPropagation(),this.mouseIsDownBottom=!0,this.setLocation(Z(e)))},r.prototype.verticalMoveStart=function(e){e.nativeEvent.which>1||(e.preventDefault(),e.stopPropagation(),this.mouseIsDownRight=!0,this.setLocation(Z(e)))},r.prototype.getHoverClass=function(){var e=this.props.prefixCls,t=" "+e+"-row--hover";return this.props.onRowClick&&(t+=e+"-row--clickable"),t},r.prototype.bodies=function(){var e=this.refs;return[e.bodyMiddleContent,e.bodyLeftContent,e.bodyRightContent].filter(function(e){return!!e})},r.prototype.handleRowEnter=function(e){var t=this;this.bodies().forEach(function(r){return r.children[e].className+=t.getHoverClass()})},r.prototype.handleRowLeave=function(e){var t=this;this.bodies().forEach(function(r){return r.children[e].className=r.children[e].className.replace(t.getHoverClass(),"")})},r.prototype.getTableWidthHeight=function(){var e=this.refs,t=e.virtualTable,r=e.scrollX,n=[],o=[];t.style.width="",r.clientWidth-this.props.columns.length>t.offsetWidth&&(t.style.width=G(r.clientWidth-this.props.columns.length));var i=t.querySelector("thead > tr"),l=t.querySelector("colgroup");function a(){for(var e=0;i.children.length>e;e++)n[e]=i.children[e].offsetWidth+1}return this.props.columns.forEach(function(e,t){l.children[t].style.width=G(e.width||"")}),a(),this.props.columns.forEach(function(e,t){var r=e.width,o=e.minWidth,i=e.maxWidth;(i||o)&&(r=n[t],r=Math.min(i||r,r),l.children[t].style.width=G(r=Math.max(o||r,r)))}),a(),t.querySelectorAll("tbody > tr").forEach(function(e,t){o[t]=e.offsetHeight}),{columnWs:n,rowHs:o}},r.prototype.alignTable=function(){var e=this,t=this.refs,r=t.headerLeft,n=t.headerRight,o=t.body,i=this.props.columns,l=[r,n].filter(function(e){return!!e});l.forEach(function(e){K(e.querySelector("tr"),"")});var a,s,c=this.getTableWidthHeight(),d=c.columnWs,h=c.rowHs,u=this.refs.virtualTable.querySelector("thead > tr").clientHeight,f=this.table.clientHeight,p=this.refs.hScrollPanel.offsetHeight,b=this.refs.bodyMiddle.querySelector("colgroup"),m=this.refs.headerMiddle.querySelector("colgroup"),y=0,v=0;d.forEach(function(t,o){var l=G(t);y+=t,b.children[o].style.width=l,m.children[o].style.width=l,i[o].width||("left"===i[o].fixed?(r.querySelector("colgroup").children[o].style.width=l,e.refs.bodyLeft.querySelector("colgroup").children[o].style.width=l):"right"===i[o].fixed&&(n.querySelector("colgroup").children[v].style.width=l,e.refs.bodyRight.querySelector("colgroup").children[v].style.width=l,v++))}),a=this.refs.header,s=G(y=Math.max(y,this.refs.scrollX.clientWidth)),a.style.width=s,o.style.width=G(this.refs.header.clientWidth+(this.autoSize?0:300+o.offsetWidth-o.clientWidth));var w=this.refs.header.offsetHeight;(l.forEach(function(e){K(e.querySelector("tr"),G(u)),K(e.parentElement,G(w))}),this.bodies().forEach(function(e){!function(e,t){for(var r=0;e.children.length>r;r++)t(e.children[r],r)}(e,function(e,t){return K(e,G(h[t]))})}),f>99999||this.autoSize)?(this.autoSize=!0,o.style.width=G(this.refs.header.clientWidth),this.refs.scrollX.style.paddingBottom=0,this.refs.scrollX.style.overflowX="auto",this.refs.body.style.paddingRight=0,this.refs.body.style.overflowY="hidden",this.table.style.height=G(this.refs.scrollX.offsetHeight)):this.refs.body.style.height=G(f-w-p)},r.prototype.scrollByOffset=function(e,t){var r=this.refs,n=r.bodyMiddle,o=r.hScrollBar,i=r.hScrollPanel,l=r.vScrollBar,a=r.vScrollPanel;if(!this.table||this.autoSize)return i.style.visibility="hidden",void(a.style.visibility="hidden");if(n){var s=this.refs.scrollX.offsetWidth,c=this.refs.body.clientHeight,d=n.offsetWidth,h=n.offsetHeight,u=1,f=1;if(h>c||(a.style.visibility="hidden",l=null,a=null),d>s||(i.style.visibility="hidden",o=null,i=null),o){var p=i.offsetWidth,b=Math.max(p*s/d,20);u=(d-s)/(p-b)}if(l){var m=a.offsetHeight,y=Math.max(m*c/h,20);f=(h-c)/(m-y)}var v=this.refs.scrollX.scrollLeft+(e*=u),w=this.refs.body.scrollTop+(t*=f),_=!0;if(v>d-s&&(v=d-s,_=!1),0>v&&(v=0,_=!1),w>h-c&&(w=h-c,_=!1),0>w&&(w=0,_=!1),this.refs.body.scrollTop=w,this.refs.scrollX.scrollLeft=v,o)i.style.visibility="visible",o.style.width=Math.round(b)+"px",o.style.transform="translateX("+Math.round(v/u)+"px)";if(x(this.refs.bodyLeft,v),x(this.refs.bodyRight,v-d+s),l){var g=Math.round(w/f);a.style.visibility="visible",l.style.height=Math.round(y)+"px",l.style.transform="translateY("+g+"px)"}return{hasOffset:_}}function x(e,t){e&&(0===t&&e?e.parentElement.parentElement.style.display="none":(e.parentElement.parentElement.style.display="block",e.style.transform="translateY("+-w+"px)"))}},r.prototype.renderHeaderSideOf=function(t){var r=t.side,n=Y(t,["side"]),o=r.toLowerCase(),i=n[o+"Columns"];if(0===i.length)return null;var l=this.props.prefixCls;return e.createElement("table",{ref:"header"+r},e.createElement("colgroup",null,i.map(function(t,r){return e.createElement("col",{key:r,style:V(t)})})),e.createElement("thead",null,e.createElement("tr",{className:l+"-row "+l+"-row--header"},i.map(function(t,r){return e.createElement("td",{key:t.dataIndex||r,className:l+"-cell "+l+"-cell--header "+(t.headerClassName||""),style:t.headerStyle},U(t.header,n.data,t))}))))},r.prototype.renderBodySideOf=function(t){var r=this,n=t.side,o=t.data,i=Y(t,["side","data"])[n.toLowerCase()+"Columns"];if(0===i.length)return null;var l=this.props.prefixCls;return e.createElement("table",{ref:"body"+n},e.createElement("colgroup",null,i.map(function(t,r){return e.createElement("col",{key:r,style:V(t)})})),e.createElement("tbody",{ref:"body"+n+"Content"},o.map(function(t,n){return e.createElement("tr",{key:n,className:l+"-row "+l+"-row--body",onMouseEnter:function(){return r.handleRowEnter(n)},onMouseLeave:function(){return r.handleRowLeave(n)},onClick:function(){return r.handleClickRow(t,n)}},i.map(function(r,n){return e.createElement("td",{key:n,style:r.cellStyle,className:l+"-cell "+l+"-cell--body "+(r.cellClassName||"")},U(r.cell,t,o,r))}))})))},r.prototype.renderVirtualTable=function(t){var r=t.data,n=t.columns,o=this.props.prefixCls;return e.createElement("table",{className:o+"-hidden-layout",ref:"virtualTable"},e.createElement("colgroup",null,n.map(function(t,r){return e.createElement("col",{key:r,style:V(t)})})),e.createElement("thead",null,e.createElement("tr",{className:o+"-row "+o+"-row--header"},n.map(function(r,n){return e.createElement("td",{key:r.dataIndex||n,className:o+"-cell "+o+"-cell--header",style:r.headerStyle},U(r.header,t.data,r))}))),e.createElement("tbody",{ref:"virtualTableBody"},r.map(function(t,i){return e.createElement("tr",{key:i,className:o+"-row "+o+"-row--body"},n.map(function(n,i){return e.createElement("td",{key:i,style:n.cellStyle,className:o+"-cell "+o+"-cell--body "+(n.cellClassName||"")},U(n.cell,t,r,n))}))})))},r.prototype.render=function(){var t=this,r=this.props,n=r.data,o=r.columns,i=r.prefixCls,l=r.style,a=r.className,s=o.slice(),c=o.filter(function(e){return"left"===e.fixed}),d=o.filter(function(e){return"right"===e.fixed}),h=function(e){return{side:e,columns:o,leftColumns:c,rightColumns:d,middleColumns:s,data:n}},u={onTouchStart:J,onTouchMove:J};return e.createElement("div",{className:i+" "+(a||""),key:"rb-table",ref:this.setTableRef,onWheel:this.handleScroll,onTouchStart:this.touchStart,onTouchMove:this.handleMove,onTouchEnd:this.touchEnd,style:l},e.createElement("div",I({ref:"scrollX",className:i+"-scrollx",onScroll:function(){return t.scrollByOffset(0,0)}},u),e.createElement("div",{className:i+"__header",ref:"header"},this.renderHeaderSideOf(h("Middle"))),e.createElement("div",I({className:i+"__body",ref:"body",onScroll:function(){return t.scrollByOffset(0,0)}},u),this.renderBodySideOf(h("Middle")),this.renderVirtualTable(h("virtual")))),!!c.length&&e.createElement("div",{className:i+"-fixed "+i+"-fixed--left"},e.createElement("div",{className:i+"-fixed__header"},this.renderHeaderSideOf(h("Left"))),e.createElement("div",{className:i+"-fixed__body"},this.renderBodySideOf(h("Left")))),!!d.length&&e.createElement("div",{className:i+"-fixed "+i+"-fixed--right"},e.createElement("div",{className:i+"-fixed__header"},this.renderHeaderSideOf(h("Right"))),e.createElement("div",{className:i+"-fixed__body"},this.renderBodySideOf(h("Right")))),e.createElement("div",{className:i+"__vscroll",ref:"vScrollPanel",onMouseDown:this.vScrollPanelMouseDown,onTouchStart:this.vScrollPanelMouseDown},e.createElement("div",{ref:"vScrollBar",className:i+"__vscroll__bar",onMouseDown:this.verticalMoveStart,onTouchStart:this.verticalMoveStart,onTouchMove:this.handleMove,onTouchEnd:this.handleMoveEnd})),e.createElement("div",{className:i+"__hscroll",ref:"hScrollPanel",onMouseDown:this.hScrollPanelMouseDown,onTouchStart:this.hScrollPanelMouseDown},e.createElement("div",{ref:"hScrollBar",className:i+"__hscroll__bar",onMouseDown:this.horizontalMoveStart,onTouchStart:this.horizontalMoveStart,onTouchMove:this.handleMove,onTouchEnd:this.handleMoveEnd})),this.props.children)},r}(e.Component);$.propTypes={columns:x.arrayOf(x.shape({header:x.oneOfType([x.string,x.number,x.func,x.element]).isRequired,cell:x.oneOfType([x.string,x.number,x.func,x.element]).isRequired,width:x.number,minWidth:Q,maxWidth:Q,fixed:x.oneOf(["left","right"]),headerClassName:x.string,cellClassName:x.string,headerStyle:x.obj,cellStyle:x.obj})),data:x.array.isRequired,prefixCls:x.string.isRequired,onRowClick:x.func},$.defaultProps={prefixCls:"rb-table",data:[]};return function(e,t){void 0===t&&(t={});var r=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===r&&n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.styleSheet?o.styleSheet.cssText=e:o.appendChild(document.createTextNode(e))}}('.rb-table{overflow:hidden;position:relative;background:#fff;color:#333;box-sizing:border-box;border:1px solid #e8e8e8;touch-action:none!important}.rb-table table{width:100%;border-spacing:0;font-size:12px;table-layout:fixed;border:none;word-break:break-all}.rb-table-scrollx{position:relative;overflow-x:scroll;overflow-y:hidden;padding-bottom:99999px;touch-action:none!important}.rb-table__body{overflow-y:scroll;overflow-x:hidden;touch-action:none!important;box-sizing:border-box;padding-right:300px}.rb-table__body .rb-table-hidden-layout{position:fixed;visibility:hidden;top:1000000px;width:-webkit-max-content;width:-moz-max-content;width:max-content;table-layout:auto}.rb-table-fixed{overflow:hidden;position:absolute;top:0;background:#fff}.rb-table-fixed table{width:auto}.rb-table-fixed__body{overflow:hidden}.rb-table-fixed--left{left:0;border-right:1px solid #e8e8e8}.rb-table-fixed--right{right:0;border-left:1px solid #e8e8e8}.rb-table-row--hover{background-color:#fafafa}.rb-table-row--clickable{cursor:pointer}.rb-table-cell{padding:14px 10px;border-bottom:1px solid #e8e8e8;font-size:12px}.rb-table__hscroll{visibility:hidden;position:absolute;box-sizing:border-box;left:0;bottom:0;right:14px;background:#f9f9f9;height:14px;z-index:1}.rb-table__hscroll__bar{padding:3px 0;height:100%;box-sizing:border-box;touch-action:none!important}.rb-table__hscroll__bar:before{content:"";display:block;background:#bfbfbf;border-radius:14px;height:100%;width:100%}.rb-table__hscroll__bar:hover:before{background:#7f7f7f}.rb-table__vscroll{visibility:hidden;position:absolute;box-sizing:border-box;background:#f9f9f9;top:0;bottom:0;right:0;width:14px;z-index:1}.rb-table__vscroll__bar{padding:0 3px;touch-action:none!important}.rb-table__vscroll__bar:before{content:"";display:block;background:#bfbfbf;border-radius:14px;height:100%;width:100%}.rb-table__vscroll__bar:hover:before{background:#7f7f7f}.rb-table-fixed--left .rb-table-cell:first-child,.rb-table-scrollx .rb-table-cell:first-child{padding-left:30px}.rb-table-fixed--right .rb-table-cell:last-child,.rb-table-scrollx .rb-table-cell:last-child{padding-right:30px}'),$});

2

dist/rb-table.min.js

@@ -1,1 +0,1 @@

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):e.RBTable=t(e.React)}(this,function(e){"use strict";e=e&&e.hasOwnProperty("default")?e.default:e;var t=Object.getOwnPropertySymbols,n=Object.prototype.hasOwnProperty,r=Object.prototype.propertyIsEnumerable;!function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var t={},n=0;10>n;n++)t["_"+String.fromCharCode(n)]=n;if("0123456789"!==Object.getOwnPropertyNames(t).map(function(e){return t[e]}).join(""))return!1;var r={};"abcdefghijklmnopqrst".split("").forEach(function(e){r[e]=e}),Object.keys(Object.assign({},r)).join("")}catch(e){return!1}}();var o="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED";function i(){}var l,s,a,c,d,u,h,f,p,m,y,w,v,b,_,g,E=(function(e){e.exports=function(){function e(e,t,n,r,i,l){if(l!==o){var s=Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw s.name="Invariant Violation",s}}function t(){return e}e.isRequired=e;var n={array:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t};return n.checkPropTypes=i,n.PropTypes=n,n}()}(l={exports:{}},l.exports),l.exports),S=!1;function x(){if(!S){S=!0;var e=navigator.userAgent,t=/(?:MSIE.(\d+\.\d+))|(?:(?:Firefox|GranParadiso|Iceweasel).(\d+\.\d+))|(?:Opera(?:.+Version.|.)(\d+\.\d+))|(?:AppleWebKit.(\d+(?:\.\d+)?))|(?:Trident\/\d+\.\d+.*rv:(\d+\.\d+))/.exec(e),n=/(Mac OS X)|(Windows)|(Linux)/.exec(e);if(v=/\b(iPhone|iP[ao]d)/.exec(e),b=/\b(iP[ao]d)/.exec(e),y=/Android/i.exec(e),_=/FBAN\/\w+;/i.exec(e),g=/Mobile/i.exec(e),w=!!/Win64/.exec(e),t){(s=t[1]?parseFloat(t[1]):t[5]?parseFloat(t[5]):NaN)&&document&&document.documentMode&&(s=document.documentMode);var r=/(?:Trident\/(\d+.\d+))/.exec(e);h=r?parseFloat(r[1])+4:s,a=t[2]?parseFloat(t[2]):NaN,c=t[3]?parseFloat(t[3]):NaN,(d=t[4]?parseFloat(t[4]):NaN)?(t=/(?:Chrome\/(\d+\.\d+))/.exec(e),u=t&&t[1]?parseFloat(t[1]):NaN):u=NaN}else s=a=c=u=d=NaN;if(n){if(n[1]){var o=/(?:Mac OS X (\d+(?:[._]\d+)?))/.exec(e);f=!o||parseFloat(o[1].replace("_","."))}else f=!1;p=!!n[2],m=!!n[3]}else f=p=m=!1}}var M,O={ie:function(){return x()||s},ieCompatibilityMode:function(){return x()||h>s},ie64:function(){return O.ie()&&w},firefox:function(){return x()||a},opera:function(){return x()||c},webkit:function(){return x()||d},safari:function(){return O.webkit()},chrome:function(){return x()||u},windows:function(){return x()||p},osx:function(){return x()||f},linux:function(){return x()||m},iphone:function(){return x()||v},mobile:function(){return x()||v||b||y||g},nativeApp:function(){return x()||_},android:function(){return x()||y},ipad:function(){return x()||b}},R=O,N=!("undefined"==typeof window||!window.document||!window.document.createElement),C={canUseDOM:N,canUseWorkers:"undefined"!=typeof Worker,canUseEventListeners:N&&!(!window.addEventListener&&!window.attachEvent),canUseViewport:N&&!!window.screen,isInWorker:!N};C.canUseDOM&&(M=document.implementation&&document.implementation.hasFeature&&!0!==document.implementation.hasFeature("",""));var D=function(e,t){if(!C.canUseDOM||t&&!("addEventListener"in document))return!1;var n="on"+e,r=n in document;if(!r){var o=document.createElement("div");o.setAttribute(n,"return;"),r="function"==typeof o[n]}return!r&&M&&"wheel"===e&&(r=document.implementation.hasFeature("Events.wheel","3.0")),r},T=10,W=40,L=800;function k(e){var t=0,n=0,r=0,o=0;return"detail"in e&&(n=e.detail),"wheelDelta"in e&&(n=-e.wheelDelta/120),"wheelDeltaY"in e&&(n=-e.wheelDeltaY/120),"wheelDeltaX"in e&&(t=-e.wheelDeltaX/120),"axis"in e&&e.axis===e.HORIZONTAL_AXIS&&(t=n,n=0),r=t*T,o=n*T,"deltaY"in e&&(o=e.deltaY),"deltaX"in e&&(r=e.deltaX),(r||o)&&e.deltaMode&&(1==e.deltaMode?(r*=W,o*=W):(r*=L,o*=L)),r&&!t&&(t=1>r?-1:1),o&&!n&&(n=1>o?-1:1),{spinX:t,spinY:n,pixelX:r,pixelY:o}}k.getEventType=function(){return R.firefox()?"DOMMouseScroll":D("wheel")?"wheel":"mousewheel"};var P,z,B=k,X=navigator.userAgent.match(/Trident/),F=(P=window.requestAnimationFrame||window.mozRequestAnimationFrame||window.webkitRequestAnimationFrame||function(e){return window.setTimeout(e,20)},function(e){return P(e)}),j=(z=window.cancelAnimationFrame||window.mozCancelAnimationFrame||window.webkitCancelAnimationFrame||window.clearTimeout,function(e){return z(e)});function q(e){var t=e.target||e.srcElement;t.__resizeRAF__&&j(t.__resizeRAF__),t.__resizeRAF__=F(function(){var n=t.__resizeTrigger__;n.__resizeListeners__.forEach(function(t){t.call(n,e)})})}function A(){this.contentDocument.defaultView.__resizeTrigger__=this.__resizeElement__,this.contentDocument.defaultView.addEventListener("resize",q)}function H(e,t){if(!e.__resizeListeners__){e.__resizeListeners__=[];var n=e.__resizeTrigger__=document.createElement("object");n.setAttribute("style","display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; pointer-events: none; z-index: -1;"),n.__resizeElement__=e,n.onload=A,n.type="text/html",X&&e.appendChild(n),n.data="about:blank",X||e.appendChild(n)}e.__resizeListeners__.push(t)}function I(e,t){var n={};for(var r in e)0>t.indexOf(r)&&Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function U(t){for(var n=arguments.length,r=Array(n>1?n-1:0),o=1;n>o;o++)r[o-1]=arguments[o];if(t)return"string"==typeof t||"number"==typeof t?t:"function"==typeof t?t.apply(void 0,r):e.isValidElement(t)?e.cloneElement(t,{tablecontext:r}):void 0}function Y(e){return e.width?{width:e.width}:null}function V(e){return e?e+"px":e}function G(e,t){e.style.height=t}function K(e,t,n){return e.width&&e[t]?Error(n+".column."+t+" will not take effect when column.width is set."):"maxWidth"===t&&e.minWidth>e.maxWidth?Error(n+".column.maxWidth is smaller then column.minWidth"):void 0}var Z=function(t){function n(e){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,n);var r=function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}(this,t.call(this,e));return r.setTableRef=r.setTableRef.bind(r),r.handleResize=r.handleResize.bind(r),r.handleScroll=r.handleScroll.bind(r),r.handleClickRow=r.handleClickRow.bind(r),r.handleWindowMouseUp=r.handleWindowMouseUp.bind(r),r.handleWindowMouseMove=r.handleWindowMouseMove.bind(r),r.hScrollPanelMouseDown=r.hScrollPanelMouseDown.bind(r),r.vScrollPanelMouseDown=r.vScrollPanelMouseDown.bind(r),r.hScrollBarMouseDown=r.hScrollBarMouseDown.bind(r),r.vScrollBarMouseDown=r.vScrollBarMouseDown.bind(r),r}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(n,t),n.prototype.componentWillUnmount=function(){H(this.table,this.handleResize),window.removeEventListener("mouseup",this.handleWindowMouseUp),window.removeEventListener("mousemove",this.handleWindowMouseMove)},n.prototype.componentDidMount=function(){var e=this;window.addEventListener("mouseup",this.handleWindowMouseUp),window.addEventListener("mousemove",this.handleWindowMouseMove),setTimeout(function(){e.reflow()})},n.prototype.setTableRef=function(e){var t,n;e&&(this.table&&(n=this.handleResize,(t=this.table).__resizeListeners__&&(t.__resizeListeners__.splice(t.__resizeListeners__.indexOf(n),1),t.__resizeListeners__.length||(t.__resizeTrigger__.contentDocument.defaultView.removeEventListener("resize",q),t.__resizeTrigger__=!t.removeChild(t.__resizeTrigger__)))),this.table=e,H(e,this.handleResize))},n.prototype.componentDidUpdate=function(){this.reflow()},n.prototype.handleResize=function(){this.reflow()},n.prototype.reflow=function(){this.alignTable(),this.scrollByOffset(0,0)},n.prototype.handleScroll=function(e){if(!this.autoSize){var t=B(e),n=t.pixelY,r=t.pixelX;n=Math.round(.5*n);var o=this.scrollByOffset(r=Math.round(.5*r),n).hasOffset;this.autoSize||e.preventDefault(),o&&e.stopPropagation()}},n.prototype.handleClickRow=function(e,t){this.props.onRowClick&&this.props.onRowClick(e,t)},n.prototype.setLocation=function(e,t){this.x=e,this.y=t},n.prototype.handleWindowMouseUp=function(){this.mouseIsDownRight=!1,this.mouseIsDownBottom=!1},n.prototype.handleWindowMouseMove=function(e){var t=e.clientY;this.mouseIsDownBottom?this.handleMouseMove(e.clientX,this.y):this.mouseIsDownRight&&this.handleMouseMove(this.x,t)},n.prototype.hScrollPanelMouseDown=function(e){if(1===e.nativeEvent.which){e.preventDefault(),e.stopPropagation();var t=e.clientX-this.refs.hScrollBar.getBoundingClientRect().left;this.scrollByOffset(t,0)}},n.prototype.vScrollPanelMouseDown=function(e){if(1===e.nativeEvent.which){e.preventDefault(),e.stopPropagation();var t=e.clientY-this.refs.vScrollBar.getBoundingClientRect().top;this.scrollByOffset(0,t)}},n.prototype.hScrollBarMouseDown=function(e){1===e.nativeEvent.which&&(e.preventDefault(),e.stopPropagation(),this.mouseIsDownBottom=!0,this.setLocation(e.clientX,e.clientY))},n.prototype.vScrollBarMouseDown=function(e){1===e.nativeEvent.which&&(e.preventDefault(),e.stopPropagation(),this.mouseIsDownRight=!0,this.setLocation(e.clientX,e.clientY))},n.prototype.handleMouseMove=function(e,t){var n=e-this.x,r=t-this.y;this.setLocation(e,t),this.scrollByOffset(n,r)},n.prototype.getHoverClass=function(){var e=this.props.prefixCls,t=" "+e+"-row--hover";return this.props.onRowClick&&(t+=e+"-row--clickable"),t},n.prototype.bodies=function(){var e=this.refs;return[e.bodyMiddleContent,e.bodyLeftContent,e.bodyRightContent].filter(function(e){return!!e})},n.prototype.handleRowEnter=function(e){var t=this;this.bodies().forEach(function(n){return n.children[e].className+=t.getHoverClass()})},n.prototype.handleRowLeave=function(e){var t=this;this.bodies().forEach(function(n){return n.children[e].className=n.children[e].className.replace(t.getHoverClass(),"")})},n.prototype.getTableWidthHeight=function(){var e=this.refs,t=e.virtualTable,n=e.scrollX,r=[],o=[];t.style.width="",n.clientWidth-this.props.columns.length>t.offsetWidth&&(t.style.width=V(n.clientWidth-this.props.columns.length));var i=t.querySelector("thead > tr"),l=t.querySelector("colgroup");function s(){for(var e=0;i.children.length>e;e++)r[e]=i.children[e].offsetWidth+1}return this.props.columns.forEach(function(e,t){l.children[t].style.width=V(e.width||"")}),s(),this.props.columns.forEach(function(e,t){var n=e.width,o=e.minWidth,i=e.maxWidth;(i||o)&&(n=r[t],n=Math.min(i||n,n),l.children[t].style.width=V(n=Math.max(o||n,n)))}),s(),t.querySelectorAll("tbody > tr").forEach(function(e,t){o[t]=e.offsetHeight}),{columnWs:r,rowHs:o}},n.prototype.alignTable=function(){var e=this,t=this.refs,n=t.headerLeft,r=t.headerRight,o=t.body,i=this.props.columns,l=[n,r].filter(function(e){return!!e});l.forEach(function(e){G(e.querySelector("tr"),"")});var s,a,c=this.getTableWidthHeight(),d=c.columnWs,u=c.rowHs,h=this.refs.virtualTable.querySelector("thead > tr").clientHeight,f=this.table.clientHeight,p=this.refs.hScrollPanel.offsetHeight,m=this.refs.bodyMiddle.querySelector("colgroup"),y=this.refs.headerMiddle.querySelector("colgroup"),w=0,v=0;d.forEach(function(t,o){var l=V(t);w+=t,m.children[o].style.width=l,y.children[o].style.width=l,i[o].width||("left"===i[o].fixed?(n.querySelector("colgroup").children[o].style.width=l,e.refs.bodyLeft.querySelector("colgroup").children[o].style.width=l):"right"===i[o].fixed&&(r.querySelector("colgroup").children[v].style.width=l,e.refs.bodyRight.querySelector("colgroup").children[v].style.width=l,v++))}),s=this.refs.header,a=V(w=Math.max(w,this.refs.scrollX.clientWidth)),s.style.width=a,o.style.width=V(this.refs.header.clientWidth+(this.autoSize?0:300+o.offsetWidth-o.clientWidth));var b=this.refs.header.offsetHeight;(l.forEach(function(e){G(e.querySelector("tr"),V(h)),G(e.parentElement,V(b))}),this.bodies().forEach(function(e){!function(e,t){for(var n=0;e.children.length>n;n++)t(e.children[n],n)}(e,function(e,t){return G(e,V(u[t]))})}),f>99999||this.autoSize)?(this.autoSize=!0,o.style.width=V(this.refs.header.clientWidth),this.refs.scrollX.style.paddingBottom=0,this.refs.scrollX.style.overflowX="auto",this.refs.body.style.paddingRight=0,this.refs.body.style.overflowY="hidden",this.table.style.height=V(this.refs.scrollX.offsetHeight)):this.refs.body.style.height=V(f-b-p)},n.prototype.scrollByOffset=function(e,t){var n=this.refs,r=n.bodyMiddle,o=n.hScrollBar,i=n.hScrollPanel,l=n.vScrollBar,s=n.vScrollPanel;if(!this.table||this.autoSize)return i.style.visibility="hidden",void(s.style.visibility="hidden");if(r){var a=this.refs.scrollX.offsetWidth,c=this.refs.body.clientHeight,d=r.offsetWidth,u=r.offsetHeight,h=1,f=1;if(u>c||(s.style.visibility="hidden",l=null,s=null),d>a||(i.style.visibility="hidden",o=null,i=null),o){var p=i.offsetWidth,m=Math.max(p*a/d,20);h=(d-a)/(p-m)}if(l){var y=s.offsetHeight,w=Math.max(y*c/u,20);f=(u-c)/(y-w)}var v=this.refs.scrollX.scrollLeft+(e*=h),b=this.refs.body.scrollTop+(t*=f),_=!0;if(v>d-a&&(v=d-a,_=!1),0>v&&(v=0,_=!1),b>u-c&&(b=u-c,_=!1),0>b&&(b=0,_=!1),this.refs.body.scrollTop=b,this.refs.scrollX.scrollLeft=v,o)i.style.visibility="visible",o.style.width=Math.round(m)+"px",o.style.transform="translateX("+Math.round(v/h)+"px)";if(E(this.refs.bodyLeft,v),E(this.refs.bodyRight,v-d+a),l){var g=Math.round(b/f);s.style.visibility="visible",l.style.height=Math.round(w)+"px",l.style.transform="translateY("+g+"px)"}return{hasOffset:_}}function E(e,t){e&&(0===t&&e?e.parentElement.parentElement.style.display="none":(e.parentElement.parentElement.style.display="block",e.style.transform="translateY("+-b+"px)"))}},n.prototype.renderHeaderSideOf=function(t){var n=t.side,r=I(t,["side"]),o=n.toLowerCase(),i=r[o+"Columns"];if(0===i.length)return null;var l=this.props.prefixCls;return e.createElement("table",{ref:"header"+n},e.createElement("colgroup",null,i.map(function(t,n){return e.createElement("col",{key:n,style:Y(t)})})),e.createElement("thead",null,e.createElement("tr",{className:l+"-row "+l+"-row--header"},i.map(function(t,n){return e.createElement("td",{key:t.dataIndex||n,className:l+"-cell "+l+"-cell--header "+(t.headerClassName||""),style:t.headerStyle},U(t.header,r.data,t))}))))},n.prototype.renderBodySideOf=function(t){var n=this,r=t.side,o=t.data,i=I(t,["side","data"])[r.toLowerCase()+"Columns"];if(0===i.length)return null;var l=this.props.prefixCls;return e.createElement("table",{ref:"body"+r},e.createElement("colgroup",null,i.map(function(t,n){return e.createElement("col",{key:n,style:Y(t)})})),e.createElement("tbody",{ref:"body"+r+"Content"},o.map(function(t,r){return e.createElement("tr",{key:r,className:l+"-row "+l+"-row--body",onMouseEnter:function(){return n.handleRowEnter(r)},onMouseLeave:function(){return n.handleRowLeave(r)},onClick:function(){return n.handleClickRow(t,r)}},i.map(function(n,r){return e.createElement("td",{key:r,style:n.cellStyle,className:l+"-cell "+l+"-cell--body "+(n.cellClassName||"")},U(n.cell,t,o,n))}))})))},n.prototype.renderVirtualTable=function(t){var n=t.data,r=t.columns,o=this.props.prefixCls;return e.createElement("table",{className:o+"-hidden-layout",ref:"virtualTable"},e.createElement("colgroup",null,r.map(function(t,n){return e.createElement("col",{key:n,style:Y(t)})})),e.createElement("thead",null,e.createElement("tr",{className:o+"-row "+o+"-row--header"},r.map(function(n,r){return e.createElement("td",{key:n.dataIndex||r,className:o+"-cell "+o+"-cell--header",style:n.headerStyle},U(n.header,t.data,n))}))),e.createElement("tbody",{ref:"virtualTableBody"},n.map(function(t,i){return e.createElement("tr",{key:i,className:o+"-row "+o+"-row--body"},r.map(function(r,i){return e.createElement("td",{key:i,style:r.cellStyle,className:o+"-cell "+o+"-cell--body "+(r.cellClassName||"")},U(r.cell,t,n,r))}))})))},n.prototype.render=function(){var t=this,n=this.props,r=n.data,o=n.columns,i=n.prefixCls,l=n.style,s=n.className,a=o.slice(),c=o.filter(function(e){return"left"===e.fixed}),d=o.filter(function(e){return"right"===e.fixed}),u=function(e){return{side:e,columns:o,leftColumns:c,rightColumns:d,middleColumns:a,data:r}};return e.createElement("div",{className:i+" "+(s||""),key:"rb-table",ref:this.setTableRef,onWheel:this.handleScroll,style:l},e.createElement("div",{ref:"scrollX",className:i+"-scrollx",onScroll:function(){return t.scrollByOffset(0,0)}},e.createElement("div",{className:i+"__header",ref:"header"},this.renderHeaderSideOf(u("Middle"))),e.createElement("div",{className:i+"__body",ref:"body",onScroll:function(){return t.scrollByOffset(0,0)}},this.renderBodySideOf(u("Middle")),this.renderVirtualTable(u("virtual")))),!!c.length&&e.createElement("div",{className:i+"-fixed "+i+"-fixed--left"},e.createElement("div",{className:i+"-fixed__header"},this.renderHeaderSideOf(u("Left"))),e.createElement("div",{className:i+"-fixed__body"},this.renderBodySideOf(u("Left")))),!!d.length&&e.createElement("div",{className:i+"-fixed "+i+"-fixed--right"},e.createElement("div",{className:i+"-fixed__header"},this.renderHeaderSideOf(u("Right"))),e.createElement("div",{className:i+"-fixed__body"},this.renderBodySideOf(u("Right")))),e.createElement("div",{className:i+"__vscroll",ref:"vScrollPanel",onMouseDown:this.vScrollPanelMouseDown},e.createElement("div",{ref:"vScrollBar",className:i+"__vscroll__bar",onMouseDown:this.vScrollBarMouseDown})),e.createElement("div",{className:i+"__hscroll",ref:"hScrollPanel",onMouseDown:this.hScrollPanelMouseDown},e.createElement("div",{ref:"hScrollBar",className:i+"__hscroll__bar",onMouseDown:this.hScrollBarMouseDown})),this.props.children)},n}(e.Component);return Z.propTypes={columns:E.arrayOf(E.shape({header:E.oneOfType([E.string,E.number,E.func,E.element]).isRequired,cell:E.oneOfType([E.string,E.number,E.func,E.element]).isRequired,width:E.number,minWidth:K,maxWidth:K,fixed:E.oneOf(["left","right"]),headerClassName:E.string,cellClassName:E.string,headerStyle:E.obj,cellStyle:E.obj})),data:E.array.isRequired,prefixCls:E.string.isRequired,onRowClick:E.func},Z.defaultProps={prefixCls:"rb-table",data:[]},Z});
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):e.RBTable=t(e.React)}(this,function(e){"use strict";e=e&&e.hasOwnProperty("default")?e.default:e;var t=Object.getOwnPropertySymbols,n=Object.prototype.hasOwnProperty,r=Object.prototype.propertyIsEnumerable;!function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var t={},n=0;10>n;n++)t["_"+String.fromCharCode(n)]=n;if("0123456789"!==Object.getOwnPropertyNames(t).map(function(e){return t[e]}).join(""))return!1;var r={};"abcdefghijklmnopqrst".split("").forEach(function(e){r[e]=e}),Object.keys(Object.assign({},r)).join("")}catch(e){return!1}}();var o="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED";function i(){}var l,a,s,c,d,h,u,f,p,m,y,v,w,b,_,g,E=(function(e){e.exports=function(){function e(e,t,n,r,i,l){if(l!==o){var a=Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw a.name="Invariant Violation",a}}function t(){return e}e.isRequired=e;var n={array:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t};return n.checkPropTypes=i,n.PropTypes=n,n}()}(l={exports:{}},l.exports),l.exports),S=!1;function x(){if(!S){S=!0;var e=navigator.userAgent,t=/(?:MSIE.(\d+\.\d+))|(?:(?:Firefox|GranParadiso|Iceweasel).(\d+\.\d+))|(?:Opera(?:.+Version.|.)(\d+\.\d+))|(?:AppleWebKit.(\d+(?:\.\d+)?))|(?:Trident\/\d+\.\d+.*rv:(\d+\.\d+))/.exec(e),n=/(Mac OS X)|(Windows)|(Linux)/.exec(e);if(w=/\b(iPhone|iP[ao]d)/.exec(e),b=/\b(iP[ao]d)/.exec(e),y=/Android/i.exec(e),_=/FBAN\/\w+;/i.exec(e),g=/Mobile/i.exec(e),v=!!/Win64/.exec(e),t){(a=t[1]?parseFloat(t[1]):t[5]?parseFloat(t[5]):NaN)&&document&&document.documentMode&&(a=document.documentMode);var r=/(?:Trident\/(\d+.\d+))/.exec(e);u=r?parseFloat(r[1])+4:a,s=t[2]?parseFloat(t[2]):NaN,c=t[3]?parseFloat(t[3]):NaN,(d=t[4]?parseFloat(t[4]):NaN)?(t=/(?:Chrome\/(\d+\.\d+))/.exec(e),h=t&&t[1]?parseFloat(t[1]):NaN):h=NaN}else a=s=c=h=d=NaN;if(n){if(n[1]){var o=/(?:Mac OS X (\d+(?:[._]\d+)?))/.exec(e);f=!o||parseFloat(o[1].replace("_","."))}else f=!1;p=!!n[2],m=!!n[3]}else f=p=m=!1}}var M,O={ie:function(){return x()||a},ieCompatibilityMode:function(){return x()||u>a},ie64:function(){return O.ie()&&v},firefox:function(){return x()||s},opera:function(){return x()||c},webkit:function(){return x()||d},safari:function(){return O.webkit()},chrome:function(){return x()||h},windows:function(){return x()||p},osx:function(){return x()||f},linux:function(){return x()||m},iphone:function(){return x()||w},mobile:function(){return x()||w||b||y||g},nativeApp:function(){return x()||_},android:function(){return x()||y},ipad:function(){return x()||b}},T=O,R=!("undefined"==typeof window||!window.document||!window.document.createElement),N={canUseDOM:R,canUseWorkers:"undefined"!=typeof Worker,canUseEventListeners:R&&!(!window.addEventListener&&!window.attachEvent),canUseViewport:R&&!!window.screen,isInWorker:!R};N.canUseDOM&&(M=document.implementation&&document.implementation.hasFeature&&!0!==document.implementation.hasFeature("",""));var C=function(e,t){if(!N.canUseDOM||t&&!("addEventListener"in document))return!1;var n="on"+e,r=n in document;if(!r){var o=document.createElement("div");o.setAttribute(n,"return;"),r="function"==typeof o[n]}return!r&&M&&"wheel"===e&&(r=document.implementation.hasFeature("Events.wheel","3.0")),r},D=10,z=40,P=800;function L(e){var t=0,n=0,r=0,o=0;return"detail"in e&&(n=e.detail),"wheelDelta"in e&&(n=-e.wheelDelta/120),"wheelDeltaY"in e&&(n=-e.wheelDeltaY/120),"wheelDeltaX"in e&&(t=-e.wheelDeltaX/120),"axis"in e&&e.axis===e.HORIZONTAL_AXIS&&(t=n,n=0),r=t*D,o=n*D,"deltaY"in e&&(o=e.deltaY),"deltaX"in e&&(r=e.deltaX),(r||o)&&e.deltaMode&&(1==e.deltaMode?(r*=z,o*=z):(r*=P,o*=P)),r&&!t&&(t=1>r?-1:1),o&&!n&&(n=1>o?-1:1),{spinX:t,spinY:n,pixelX:r,pixelY:o}}L.getEventType=function(){return T.firefox()?"DOMMouseScroll":C("wheel")?"wheel":"mousewheel"};var k,W,X=L,B=navigator.userAgent.match(/Trident/),j=(k=window.requestAnimationFrame||window.mozRequestAnimationFrame||window.webkitRequestAnimationFrame||function(e){return window.setTimeout(e,20)},function(e){return k(e)}),F=(W=window.cancelAnimationFrame||window.mozCancelAnimationFrame||window.webkitCancelAnimationFrame||window.clearTimeout,function(e){return W(e)});function q(e){var t=e.target||e.srcElement;t.__resizeRAF__&&F(t.__resizeRAF__),t.__resizeRAF__=j(function(){var n=t.__resizeTrigger__;n.__resizeListeners__.forEach(function(t){t.call(n,e)})})}function A(){this.contentDocument.defaultView.__resizeTrigger__=this.__resizeElement__,this.contentDocument.defaultView.addEventListener("resize",q)}function H(e,t){if(!e.__resizeListeners__){e.__resizeListeners__=[];var n=e.__resizeTrigger__=document.createElement("object");n.setAttribute("style","display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; pointer-events: none; z-index: -1;"),n.__resizeElement__=e,n.onload=A,n.type="text/html",B&&e.appendChild(n),n.data="about:blank",B||e.appendChild(n)}e.__resizeListeners__.push(t)}var I=Object.assign||function(e){for(var t=1;arguments.length>t;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e};function Y(e,t){var n={};for(var r in e)0>t.indexOf(r)&&Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function U(t){for(var n=arguments.length,r=Array(n>1?n-1:0),o=1;n>o;o++)r[o-1]=arguments[o];if(t)return"string"==typeof t||"number"==typeof t?t:"function"==typeof t?t.apply(void 0,r):e.isValidElement(t)?e.cloneElement(t,{tablecontext:r}):void 0}function V(e){return e.width?{width:e.width}:null}function G(e){return e?e+"px":e}function K(e,t){e.style.height=t}function Z(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},t=e.touches,n=e.clientX,r=e.clientY;if(t&&t.length>0){var o=t[0];n=o.clientX,r=o.clientY}return{clientX:n,clientY:r}}function J(e){e.preventDefault()}function Q(e,t,n){return e.width&&e[t]?Error(n+".column."+t+" will not take effect when column.width is set."):"maxWidth"===t&&e.minWidth>e.maxWidth?Error(n+".column.maxWidth is smaller then column.minWidth"):void 0}var $=function(t){function n(e){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,n);var r=function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}(this,t.call(this,e));return r.setTableRef=r.setTableRef.bind(r),r.handleResize=r.handleResize.bind(r),r.handleScroll=r.handleScroll.bind(r),r.handleClickRow=r.handleClickRow.bind(r),r.handleMoveEnd=r.handleMoveEnd.bind(r),r.handleMove=r.handleMove.bind(r),r.hScrollPanelMouseDown=r.hScrollPanelMouseDown.bind(r),r.vScrollPanelMouseDown=r.vScrollPanelMouseDown.bind(r),r.horizontalMoveStart=r.horizontalMoveStart.bind(r),r.verticalMoveStart=r.verticalMoveStart.bind(r),r.touchStart=r.touchStart.bind(r),r.touchEnd=r.touchEnd.bind(r),r}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(n,t),n.prototype.componentWillUnmount=function(){H(this.table,this.handleResize),window.removeEventListener("mousemove",this.handleMove),window.removeEventListener("mouseup",this.handleMoveEnd)},n.prototype.componentDidMount=function(){var e=this;window.addEventListener("mousemove",this.handleMove),window.addEventListener("mouseup",this.handleMoveEnd),setTimeout(function(){e.reflow()})},n.prototype.setTableRef=function(e){var t,n;e&&(this.table&&(n=this.handleResize,(t=this.table).__resizeListeners__&&(t.__resizeListeners__.splice(t.__resizeListeners__.indexOf(n),1),t.__resizeListeners__.length||(t.__resizeTrigger__.contentDocument.defaultView.removeEventListener("resize",q),t.__resizeTrigger__=!t.removeChild(t.__resizeTrigger__)))),this.table=e,H(e,this.handleResize))},n.prototype.componentDidUpdate=function(){this.reflow()},n.prototype.handleResize=function(){this.reflow()},n.prototype.reflow=function(){this.alignTable(),this.scrollByOffset(0,0)},n.prototype.handleScroll=function(e){if(!this.autoSize){var t=X(e),n=t.pixelY,r=t.pixelX;n=Math.round(.5*n);var o=this.scrollByOffset(r=Math.round(.5*r),n).hasOffset;this.autoSize||e.preventDefault(),o&&e.stopPropagation()}},n.prototype.handleClickRow=function(e,t){this.props.onRowClick&&this.props.onRowClick(e,t)},n.prototype.setLocation=function(e){var t=e.clientY;this.x=e.clientX,this.y=t},n.prototype.handleMoveEnd=function(){this.mouseIsDownRight=!1,this.mouseIsDownBottom=!1,this.touchIsStarted=!1},n.prototype.handleMove=function(e){var t=Z(e),n=t.clientX,r=t.clientY;this.mouseIsDownBottom?this.move({clientX:n,clientY:this.y}):this.mouseIsDownRight?this.move({clientX:this.x,clientY:r}):this.touchIsStarted&&(e.preventDefault(),this.move({clientX:n,clientY:r},-1))},n.prototype.move=function(e){var t=e.clientX,n=e.clientY,r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:1,o=t-this.x,i=n-this.y;this.setLocation({clientX:t,clientY:n}),this.scrollByOffset(r*o,r*i)},n.prototype.touchStart=function(e){this.touchIsStarted=!0,this.setLocation(Z(e))},n.prototype.touchEnd=function(e){this.touchIsStarted=!1},n.prototype.hScrollPanelMouseDown=function(e){if(1>=e.nativeEvent.which){e.preventDefault(),e.stopPropagation();var t=this.refs.hScrollBar.getBoundingClientRect(),n=t.left,r=t.right,o=Z(e).clientX-.5*(n+r);this.scrollByOffset(o,0)}},n.prototype.vScrollPanelMouseDown=function(e){if(1>=e.nativeEvent.which){e.preventDefault(),e.stopPropagation();var t=this.refs.vScrollBar.getBoundingClientRect(),n=t.top,r=t.bottom,o=Z(e).clientY-.5*(n+r);this.scrollByOffset(0,o)}},n.prototype.horizontalMoveStart=function(e){e.nativeEvent.which>1||(e.preventDefault(),e.stopPropagation(),this.mouseIsDownBottom=!0,this.setLocation(Z(e)))},n.prototype.verticalMoveStart=function(e){e.nativeEvent.which>1||(e.preventDefault(),e.stopPropagation(),this.mouseIsDownRight=!0,this.setLocation(Z(e)))},n.prototype.getHoverClass=function(){var e=this.props.prefixCls,t=" "+e+"-row--hover";return this.props.onRowClick&&(t+=e+"-row--clickable"),t},n.prototype.bodies=function(){var e=this.refs;return[e.bodyMiddleContent,e.bodyLeftContent,e.bodyRightContent].filter(function(e){return!!e})},n.prototype.handleRowEnter=function(e){var t=this;this.bodies().forEach(function(n){return n.children[e].className+=t.getHoverClass()})},n.prototype.handleRowLeave=function(e){var t=this;this.bodies().forEach(function(n){return n.children[e].className=n.children[e].className.replace(t.getHoverClass(),"")})},n.prototype.getTableWidthHeight=function(){var e=this.refs,t=e.virtualTable,n=e.scrollX,r=[],o=[];t.style.width="",n.clientWidth-this.props.columns.length>t.offsetWidth&&(t.style.width=G(n.clientWidth-this.props.columns.length));var i=t.querySelector("thead > tr"),l=t.querySelector("colgroup");function a(){for(var e=0;i.children.length>e;e++)r[e]=i.children[e].offsetWidth+1}return this.props.columns.forEach(function(e,t){l.children[t].style.width=G(e.width||"")}),a(),this.props.columns.forEach(function(e,t){var n=e.width,o=e.minWidth,i=e.maxWidth;(i||o)&&(n=r[t],n=Math.min(i||n,n),l.children[t].style.width=G(n=Math.max(o||n,n)))}),a(),t.querySelectorAll("tbody > tr").forEach(function(e,t){o[t]=e.offsetHeight}),{columnWs:r,rowHs:o}},n.prototype.alignTable=function(){var e=this,t=this.refs,n=t.headerLeft,r=t.headerRight,o=t.body,i=this.props.columns,l=[n,r].filter(function(e){return!!e});l.forEach(function(e){K(e.querySelector("tr"),"")});var a,s,c=this.getTableWidthHeight(),d=c.columnWs,h=c.rowHs,u=this.refs.virtualTable.querySelector("thead > tr").clientHeight,f=this.table.clientHeight,p=this.refs.hScrollPanel.offsetHeight,m=this.refs.bodyMiddle.querySelector("colgroup"),y=this.refs.headerMiddle.querySelector("colgroup"),v=0,w=0;d.forEach(function(t,o){var l=G(t);v+=t,m.children[o].style.width=l,y.children[o].style.width=l,i[o].width||("left"===i[o].fixed?(n.querySelector("colgroup").children[o].style.width=l,e.refs.bodyLeft.querySelector("colgroup").children[o].style.width=l):"right"===i[o].fixed&&(r.querySelector("colgroup").children[w].style.width=l,e.refs.bodyRight.querySelector("colgroup").children[w].style.width=l,w++))}),a=this.refs.header,s=G(v=Math.max(v,this.refs.scrollX.clientWidth)),a.style.width=s,o.style.width=G(this.refs.header.clientWidth+(this.autoSize?0:300+o.offsetWidth-o.clientWidth));var b=this.refs.header.offsetHeight;(l.forEach(function(e){K(e.querySelector("tr"),G(u)),K(e.parentElement,G(b))}),this.bodies().forEach(function(e){!function(e,t){for(var n=0;e.children.length>n;n++)t(e.children[n],n)}(e,function(e,t){return K(e,G(h[t]))})}),f>99999||this.autoSize)?(this.autoSize=!0,o.style.width=G(this.refs.header.clientWidth),this.refs.scrollX.style.paddingBottom=0,this.refs.scrollX.style.overflowX="auto",this.refs.body.style.paddingRight=0,this.refs.body.style.overflowY="hidden",this.table.style.height=G(this.refs.scrollX.offsetHeight)):this.refs.body.style.height=G(f-b-p)},n.prototype.scrollByOffset=function(e,t){var n=this.refs,r=n.bodyMiddle,o=n.hScrollBar,i=n.hScrollPanel,l=n.vScrollBar,a=n.vScrollPanel;if(!this.table||this.autoSize)return i.style.visibility="hidden",void(a.style.visibility="hidden");if(r){var s=this.refs.scrollX.offsetWidth,c=this.refs.body.clientHeight,d=r.offsetWidth,h=r.offsetHeight,u=1,f=1;if(h>c||(a.style.visibility="hidden",l=null,a=null),d>s||(i.style.visibility="hidden",o=null,i=null),o){var p=i.offsetWidth,m=Math.max(p*s/d,20);u=(d-s)/(p-m)}if(l){var y=a.offsetHeight,v=Math.max(y*c/h,20);f=(h-c)/(y-v)}var w=this.refs.scrollX.scrollLeft+(e*=u),b=this.refs.body.scrollTop+(t*=f),_=!0;if(w>d-s&&(w=d-s,_=!1),0>w&&(w=0,_=!1),b>h-c&&(b=h-c,_=!1),0>b&&(b=0,_=!1),this.refs.body.scrollTop=b,this.refs.scrollX.scrollLeft=w,o)i.style.visibility="visible",o.style.width=Math.round(m)+"px",o.style.transform="translateX("+Math.round(w/u)+"px)";if(E(this.refs.bodyLeft,w),E(this.refs.bodyRight,w-d+s),l){var g=Math.round(b/f);a.style.visibility="visible",l.style.height=Math.round(v)+"px",l.style.transform="translateY("+g+"px)"}return{hasOffset:_}}function E(e,t){e&&(0===t&&e?e.parentElement.parentElement.style.display="none":(e.parentElement.parentElement.style.display="block",e.style.transform="translateY("+-b+"px)"))}},n.prototype.renderHeaderSideOf=function(t){var n=t.side,r=Y(t,["side"]),o=n.toLowerCase(),i=r[o+"Columns"];if(0===i.length)return null;var l=this.props.prefixCls;return e.createElement("table",{ref:"header"+n},e.createElement("colgroup",null,i.map(function(t,n){return e.createElement("col",{key:n,style:V(t)})})),e.createElement("thead",null,e.createElement("tr",{className:l+"-row "+l+"-row--header"},i.map(function(t,n){return e.createElement("td",{key:t.dataIndex||n,className:l+"-cell "+l+"-cell--header "+(t.headerClassName||""),style:t.headerStyle},U(t.header,r.data,t))}))))},n.prototype.renderBodySideOf=function(t){var n=this,r=t.side,o=t.data,i=Y(t,["side","data"])[r.toLowerCase()+"Columns"];if(0===i.length)return null;var l=this.props.prefixCls;return e.createElement("table",{ref:"body"+r},e.createElement("colgroup",null,i.map(function(t,n){return e.createElement("col",{key:n,style:V(t)})})),e.createElement("tbody",{ref:"body"+r+"Content"},o.map(function(t,r){return e.createElement("tr",{key:r,className:l+"-row "+l+"-row--body",onMouseEnter:function(){return n.handleRowEnter(r)},onMouseLeave:function(){return n.handleRowLeave(r)},onClick:function(){return n.handleClickRow(t,r)}},i.map(function(n,r){return e.createElement("td",{key:r,style:n.cellStyle,className:l+"-cell "+l+"-cell--body "+(n.cellClassName||"")},U(n.cell,t,o,n))}))})))},n.prototype.renderVirtualTable=function(t){var n=t.data,r=t.columns,o=this.props.prefixCls;return e.createElement("table",{className:o+"-hidden-layout",ref:"virtualTable"},e.createElement("colgroup",null,r.map(function(t,n){return e.createElement("col",{key:n,style:V(t)})})),e.createElement("thead",null,e.createElement("tr",{className:o+"-row "+o+"-row--header"},r.map(function(n,r){return e.createElement("td",{key:n.dataIndex||r,className:o+"-cell "+o+"-cell--header",style:n.headerStyle},U(n.header,t.data,n))}))),e.createElement("tbody",{ref:"virtualTableBody"},n.map(function(t,i){return e.createElement("tr",{key:i,className:o+"-row "+o+"-row--body"},r.map(function(r,i){return e.createElement("td",{key:i,style:r.cellStyle,className:o+"-cell "+o+"-cell--body "+(r.cellClassName||"")},U(r.cell,t,n,r))}))})))},n.prototype.render=function(){var t=this,n=this.props,r=n.data,o=n.columns,i=n.prefixCls,l=n.style,a=n.className,s=o.slice(),c=o.filter(function(e){return"left"===e.fixed}),d=o.filter(function(e){return"right"===e.fixed}),h=function(e){return{side:e,columns:o,leftColumns:c,rightColumns:d,middleColumns:s,data:r}},u={onTouchStart:J,onTouchMove:J};return e.createElement("div",{className:i+" "+(a||""),key:"rb-table",ref:this.setTableRef,onWheel:this.handleScroll,onTouchStart:this.touchStart,onTouchMove:this.handleMove,onTouchEnd:this.touchEnd,style:l},e.createElement("div",I({ref:"scrollX",className:i+"-scrollx",onScroll:function(){return t.scrollByOffset(0,0)}},u),e.createElement("div",{className:i+"__header",ref:"header"},this.renderHeaderSideOf(h("Middle"))),e.createElement("div",I({className:i+"__body",ref:"body",onScroll:function(){return t.scrollByOffset(0,0)}},u),this.renderBodySideOf(h("Middle")),this.renderVirtualTable(h("virtual")))),!!c.length&&e.createElement("div",{className:i+"-fixed "+i+"-fixed--left"},e.createElement("div",{className:i+"-fixed__header"},this.renderHeaderSideOf(h("Left"))),e.createElement("div",{className:i+"-fixed__body"},this.renderBodySideOf(h("Left")))),!!d.length&&e.createElement("div",{className:i+"-fixed "+i+"-fixed--right"},e.createElement("div",{className:i+"-fixed__header"},this.renderHeaderSideOf(h("Right"))),e.createElement("div",{className:i+"-fixed__body"},this.renderBodySideOf(h("Right")))),e.createElement("div",{className:i+"__vscroll",ref:"vScrollPanel",onMouseDown:this.vScrollPanelMouseDown,onTouchStart:this.vScrollPanelMouseDown},e.createElement("div",{ref:"vScrollBar",className:i+"__vscroll__bar",onMouseDown:this.verticalMoveStart,onTouchStart:this.verticalMoveStart,onTouchMove:this.handleMove,onTouchEnd:this.handleMoveEnd})),e.createElement("div",{className:i+"__hscroll",ref:"hScrollPanel",onMouseDown:this.hScrollPanelMouseDown,onTouchStart:this.hScrollPanelMouseDown},e.createElement("div",{ref:"hScrollBar",className:i+"__hscroll__bar",onMouseDown:this.horizontalMoveStart,onTouchStart:this.horizontalMoveStart,onTouchMove:this.handleMove,onTouchEnd:this.handleMoveEnd})),this.props.children)},n}(e.Component);return $.propTypes={columns:E.arrayOf(E.shape({header:E.oneOfType([E.string,E.number,E.func,E.element]).isRequired,cell:E.oneOfType([E.string,E.number,E.func,E.element]).isRequired,width:E.number,minWidth:Q,maxWidth:Q,fixed:E.oneOf(["left","right"]),headerClassName:E.string,cellClassName:E.string,headerStyle:E.obj,cellStyle:E.obj})),data:E.array.isRequired,prefixCls:E.string.isRequired,onRowClick:E.func},$.defaultProps={prefixCls:"rb-table",data:[]},$});

178

es/rb-table.js

@@ -61,2 +61,4 @@ import React from 'react';

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }

@@ -96,2 +98,21 @@

}
function clientXY() {
var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
touches = _ref.touches,
clientX = _ref.clientX,
clientY = _ref.clientY;
if (touches && touches.length > 0) {
var touch = touches[0];
clientX = touch.clientX;
clientY = touch.clientY;
}
return { clientX: clientX, clientY: clientY };
}
function preventDefault(e) {
e.preventDefault();
}
// 遍历

@@ -124,8 +145,10 @@ function forEachChildren(parent, cb) {

_this.handleClickRow = _this.handleClickRow.bind(_this);
_this.handleWindowMouseUp = _this.handleWindowMouseUp.bind(_this);
_this.handleWindowMouseMove = _this.handleWindowMouseMove.bind(_this);
_this.handleMoveEnd = _this.handleMoveEnd.bind(_this);
_this.handleMove = _this.handleMove.bind(_this);
_this.hScrollPanelMouseDown = _this.hScrollPanelMouseDown.bind(_this);
_this.vScrollPanelMouseDown = _this.vScrollPanelMouseDown.bind(_this);
_this.hScrollBarMouseDown = _this.hScrollBarMouseDown.bind(_this);
_this.vScrollBarMouseDown = _this.vScrollBarMouseDown.bind(_this);
_this.horizontalMoveStart = _this.horizontalMoveStart.bind(_this);
_this.verticalMoveStart = _this.verticalMoveStart.bind(_this);
_this.touchStart = _this.touchStart.bind(_this);
_this.touchEnd = _this.touchEnd.bind(_this);
return _this;

@@ -136,4 +159,4 @@ }

addResizeListener(this.table, this.handleResize);
window.removeEventListener('mouseup', this.handleWindowMouseUp);
window.removeEventListener('mousemove', this.handleWindowMouseMove);
window.removeEventListener('mousemove', this.handleMove);
window.removeEventListener('mouseup', this.handleMoveEnd);
};

@@ -144,4 +167,4 @@

window.addEventListener('mouseup', this.handleWindowMouseUp);
window.addEventListener('mousemove', this.handleWindowMouseMove);
window.addEventListener('mousemove', this.handleMove);
window.addEventListener('mouseup', this.handleMoveEnd);
// 子元素或者兄弟元素可能在之后加载导致当前元素的高度变化，setTimeout hack 这个情况

@@ -201,3 +224,6 @@ setTimeout(function () {

RBTable.prototype.setLocation = function setLocation(clientX, clientY) {
RBTable.prototype.setLocation = function setLocation(_ref2) {
var clientX = _ref2.clientX,
clientY = _ref2.clientY;
this.x = clientX;

@@ -207,23 +233,53 @@ this.y = clientY;

RBTable.prototype.handleWindowMouseUp = function handleWindowMouseUp() {
RBTable.prototype.handleMoveEnd = function handleMoveEnd() {
this.mouseIsDownRight = false;
this.mouseIsDownBottom = false;
this.touchIsStarted = false;
};
RBTable.prototype.handleWindowMouseMove = function handleWindowMouseMove(_ref) {
var clientX = _ref.clientX,
clientY = _ref.clientY;
RBTable.prototype.handleMove = function handleMove(e) {
var _clientXY = clientXY(e),
clientX = _clientXY.clientX,
clientY = _clientXY.clientY;
if (this.mouseIsDownBottom) {
this.handleMouseMove(clientX, this.y);
this.move({ clientX: clientX, clientY: this.y });
} else if (this.mouseIsDownRight) {
this.handleMouseMove(this.x, clientY);
this.move({ clientX: this.x, clientY: clientY });
} else if (this.touchIsStarted) {
e.preventDefault();
this.move({ clientX: clientX, clientY: clientY }, -1);
}
};
RBTable.prototype.move = function move(_ref3) {
var clientX = _ref3.clientX,
clientY = _ref3.clientY;
var multi = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
var offsetX = clientX - this.x;
var offsetY = clientY - this.y;
this.setLocation({ clientX: clientX, clientY: clientY });
this.scrollByOffset(multi * offsetX, multi * offsetY);
};
RBTable.prototype.touchStart = function touchStart(e) {
this.touchIsStarted = true;
this.setLocation(clientXY(e));
};
RBTable.prototype.touchEnd = function touchEnd(e) {
this.touchIsStarted = false;
};
RBTable.prototype.hScrollPanelMouseDown = function hScrollPanelMouseDown(e) {
if (e.nativeEvent.which !== 1) return;
if (e.nativeEvent.which > 1) return;
e.preventDefault();
e.stopPropagation();
var x = e.clientX - this.refs.hScrollBar.getBoundingClientRect().left;
var _refs$hScrollBar$getB = this.refs.hScrollBar.getBoundingClientRect(),
left = _refs$hScrollBar$getB.left,
right = _refs$hScrollBar$getB.right;
var x = clientXY(e).clientX - (left + right) * .5;
this.scrollByOffset(x, 0);

@@ -233,32 +289,30 @@ };

RBTable.prototype.vScrollPanelMouseDown = function vScrollPanelMouseDown(e) {
if (e.nativeEvent.which !== 1) return;
if (e.nativeEvent.which > 1) return;
e.preventDefault();
e.stopPropagation();
var y = e.clientY - this.refs.vScrollBar.getBoundingClientRect().top;
var _refs$vScrollBar$getB = this.refs.vScrollBar.getBoundingClientRect(),
top = _refs$vScrollBar$getB.top,
bottom = _refs$vScrollBar$getB.bottom;
var y = clientXY(e).clientY - (top + bottom) * .5;
this.scrollByOffset(0, y);
};
RBTable.prototype.hScrollBarMouseDown = function hScrollBarMouseDown(e) {
if (e.nativeEvent.which !== 1) return;
RBTable.prototype.horizontalMoveStart = function horizontalMoveStart(e) {
if (e.nativeEvent.which > 1) return;
e.preventDefault();
e.stopPropagation();
this.mouseIsDownBottom = true;
this.setLocation(e.clientX, e.clientY);
this.setLocation(clientXY(e));
};
RBTable.prototype.vScrollBarMouseDown = function vScrollBarMouseDown(e) {
if (e.nativeEvent.which !== 1) return;
RBTable.prototype.verticalMoveStart = function verticalMoveStart(e) {
if (e.nativeEvent.which > 1) return;
e.preventDefault();
e.stopPropagation();
this.mouseIsDownRight = true;
this.setLocation(e.clientX, e.clientY);
this.setLocation(clientXY(e));
};
RBTable.prototype.handleMouseMove = function handleMouseMove(clientX, clientY) {
var offsetX = clientX - this.x;
var offsetY = clientY - this.y;
this.setLocation(clientX, clientY);
this.scrollByOffset(offsetX, offsetY);
};
RBTable.prototype.getHoverClass = function getHoverClass() {

@@ -338,6 +392,6 @@ var prefixCls = this.props.prefixCls;

// 如果有 maxWidth 和 minWidth，如果有需要重新 layout table
this.props.columns.forEach(function (_ref2, i) {
var width = _ref2.width,
minWidth = _ref2.minWidth,
maxWidth = _ref2.maxWidth;
this.props.columns.forEach(function (_ref4, i) {
var width = _ref4.width,
minWidth = _ref4.minWidth,
maxWidth = _ref4.maxWidth;

@@ -551,5 +605,5 @@ if (maxWidth || minWidth) {

RBTable.prototype.renderHeaderSideOf = function renderHeaderSideOf(_ref3) {
var side = _ref3.side,
params = _objectWithoutProperties(_ref3, ['side']);
RBTable.prototype.renderHeaderSideOf = function renderHeaderSideOf(_ref5) {
var side = _ref5.side,
params = _objectWithoutProperties(_ref5, ['side']);

@@ -590,8 +644,8 @@ var sideL = side.toLowerCase();

RBTable.prototype.renderBodySideOf = function renderBodySideOf(_ref4) {
RBTable.prototype.renderBodySideOf = function renderBodySideOf(_ref6) {
var _this6 = this;
var side = _ref4.side,
data = _ref4.data,
params = _objectWithoutProperties(_ref4, ['side', 'data']);
var side = _ref6.side,
data = _ref6.data,
params = _objectWithoutProperties(_ref6, ['side', 'data']);

@@ -723,2 +777,5 @@ var sideL = side.toLowerCase();

};
var noTouchScroll = {
onTouchStart: preventDefault, onTouchMove: preventDefault
};
return React.createElement(

@@ -730,2 +787,5 @@ 'div',

onWheel: this.handleScroll,
onTouchStart: this.touchStart,
onTouchMove: this.handleMove,
onTouchEnd: this.touchEnd,
style: style

@@ -735,5 +795,7 @@ },

'div',
{ ref: 'scrollX', className: prefixCls + '-scrollx', onScroll: function onScroll() {
_extends({ ref: 'scrollX', className: prefixCls + '-scrollx',
onScroll: function onScroll() {
return _this7.scrollByOffset(0, 0);
} },
}
}, noTouchScroll),
React.createElement(

@@ -746,5 +808,7 @@ 'div',

'div',
{ className: prefixCls + '__body', ref: 'body', onScroll: function onScroll() {
_extends({ className: prefixCls + '__body', ref: 'body',
onScroll: function onScroll() {
return _this7.scrollByOffset(0, 0);
} },
}
}, noTouchScroll),
this.renderBodySideOf(getParams('Middle')),

@@ -786,5 +850,11 @@ this.renderVirtualTable(getParams('virtual'))

ref: 'vScrollPanel',
onMouseDown: this.vScrollPanelMouseDown
onMouseDown: this.vScrollPanelMouseDown,
onTouchStart: this.vScrollPanelMouseDown
},
React.createElement('div', { ref: 'vScrollBar', className: prefixCls + '__vscroll__bar', onMouseDown: this.vScrollBarMouseDown })
React.createElement('div', { ref: 'vScrollBar', className: prefixCls + '__vscroll__bar',
onMouseDown: this.verticalMoveStart,
onTouchStart: this.verticalMoveStart,
onTouchMove: this.handleMove,
onTouchEnd: this.handleMoveEnd
})
),

@@ -795,5 +865,11 @@ React.createElement(

ref: 'hScrollPanel',
onMouseDown: this.hScrollPanelMouseDown
onMouseDown: this.hScrollPanelMouseDown,
onTouchStart: this.hScrollPanelMouseDown
},
React.createElement('div', { ref: 'hScrollBar', className: prefixCls + '__hscroll__bar', onMouseDown: this.hScrollBarMouseDown })
React.createElement('div', { ref: 'hScrollBar', className: prefixCls + '__hscroll__bar',
onMouseDown: this.horizontalMoveStart,
onTouchStart: this.horizontalMoveStart,
onTouchMove: this.handleMove,
onTouchEnd: this.handleMoveEnd
})
),

@@ -800,0 +876,0 @@ this.props.children

178

lib/rb-table.js

@@ -65,2 +65,4 @@ 'use strict';

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }

@@ -100,2 +102,21 @@

}
function clientXY() {
var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
touches = _ref.touches,
clientX = _ref.clientX,
clientY = _ref.clientY;
if (touches && touches.length > 0) {
var touch = touches[0];
clientX = touch.clientX;
clientY = touch.clientY;
}
return { clientX: clientX, clientY: clientY };
}
function preventDefault(e) {
e.preventDefault();
}
// 遍历

@@ -128,8 +149,10 @@ function forEachChildren(parent, cb) {

_this.handleClickRow = _this.handleClickRow.bind(_this);
_this.handleWindowMouseUp = _this.handleWindowMouseUp.bind(_this);
_this.handleWindowMouseMove = _this.handleWindowMouseMove.bind(_this);
_this.handleMoveEnd = _this.handleMoveEnd.bind(_this);
_this.handleMove = _this.handleMove.bind(_this);
_this.hScrollPanelMouseDown = _this.hScrollPanelMouseDown.bind(_this);
_this.vScrollPanelMouseDown = _this.vScrollPanelMouseDown.bind(_this);
_this.hScrollBarMouseDown = _this.hScrollBarMouseDown.bind(_this);
_this.vScrollBarMouseDown = _this.vScrollBarMouseDown.bind(_this);
_this.horizontalMoveStart = _this.horizontalMoveStart.bind(_this);
_this.verticalMoveStart = _this.verticalMoveStart.bind(_this);
_this.touchStart = _this.touchStart.bind(_this);
_this.touchEnd = _this.touchEnd.bind(_this);
return _this;

@@ -140,4 +163,4 @@ }

addResizeListener(this.table, this.handleResize);
window.removeEventListener('mouseup', this.handleWindowMouseUp);
window.removeEventListener('mousemove', this.handleWindowMouseMove);
window.removeEventListener('mousemove', this.handleMove);
window.removeEventListener('mouseup', this.handleMoveEnd);
};

@@ -148,4 +171,4 @@

window.addEventListener('mouseup', this.handleWindowMouseUp);
window.addEventListener('mousemove', this.handleWindowMouseMove);
window.addEventListener('mousemove', this.handleMove);
window.addEventListener('mouseup', this.handleMoveEnd);
// 子元素或者兄弟元素可能在之后加载导致当前元素的高度变化，setTimeout hack 这个情况

@@ -205,3 +228,6 @@ setTimeout(function () {

RBTable.prototype.setLocation = function setLocation(clientX, clientY) {
RBTable.prototype.setLocation = function setLocation(_ref2) {
var clientX = _ref2.clientX,
clientY = _ref2.clientY;
this.x = clientX;

@@ -211,23 +237,53 @@ this.y = clientY;

RBTable.prototype.handleWindowMouseUp = function handleWindowMouseUp() {
RBTable.prototype.handleMoveEnd = function handleMoveEnd() {
this.mouseIsDownRight = false;
this.mouseIsDownBottom = false;
this.touchIsStarted = false;
};
RBTable.prototype.handleWindowMouseMove = function handleWindowMouseMove(_ref) {
var clientX = _ref.clientX,
clientY = _ref.clientY;
RBTable.prototype.handleMove = function handleMove(e) {
var _clientXY = clientXY(e),
clientX = _clientXY.clientX,
clientY = _clientXY.clientY;
if (this.mouseIsDownBottom) {
this.handleMouseMove(clientX, this.y);
this.move({ clientX: clientX, clientY: this.y });
} else if (this.mouseIsDownRight) {
this.handleMouseMove(this.x, clientY);
this.move({ clientX: this.x, clientY: clientY });
} else if (this.touchIsStarted) {
e.preventDefault();
this.move({ clientX: clientX, clientY: clientY }, -1);
}
};
RBTable.prototype.move = function move(_ref3) {
var clientX = _ref3.clientX,
clientY = _ref3.clientY;
var multi = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
var offsetX = clientX - this.x;
var offsetY = clientY - this.y;
this.setLocation({ clientX: clientX, clientY: clientY });
this.scrollByOffset(multi * offsetX, multi * offsetY);
};
RBTable.prototype.touchStart = function touchStart(e) {
this.touchIsStarted = true;
this.setLocation(clientXY(e));
};
RBTable.prototype.touchEnd = function touchEnd(e) {
this.touchIsStarted = false;
};
RBTable.prototype.hScrollPanelMouseDown = function hScrollPanelMouseDown(e) {
if (e.nativeEvent.which !== 1) return;
if (e.nativeEvent.which > 1) return;
e.preventDefault();
e.stopPropagation();
var x = e.clientX - this.refs.hScrollBar.getBoundingClientRect().left;
var _refs$hScrollBar$getB = this.refs.hScrollBar.getBoundingClientRect(),
left = _refs$hScrollBar$getB.left,
right = _refs$hScrollBar$getB.right;
var x = clientXY(e).clientX - (left + right) * .5;
this.scrollByOffset(x, 0);

@@ -237,32 +293,30 @@ };

RBTable.prototype.vScrollPanelMouseDown = function vScrollPanelMouseDown(e) {
if (e.nativeEvent.which !== 1) return;
if (e.nativeEvent.which > 1) return;
e.preventDefault();
e.stopPropagation();
var y = e.clientY - this.refs.vScrollBar.getBoundingClientRect().top;
var _refs$vScrollBar$getB = this.refs.vScrollBar.getBoundingClientRect(),
top = _refs$vScrollBar$getB.top,
bottom = _refs$vScrollBar$getB.bottom;
var y = clientXY(e).clientY - (top + bottom) * .5;
this.scrollByOffset(0, y);
};
RBTable.prototype.hScrollBarMouseDown = function hScrollBarMouseDown(e) {
if (e.nativeEvent.which !== 1) return;
RBTable.prototype.horizontalMoveStart = function horizontalMoveStart(e) {
if (e.nativeEvent.which > 1) return;
e.preventDefault();
e.stopPropagation();
this.mouseIsDownBottom = true;
this.setLocation(e.clientX, e.clientY);
this.setLocation(clientXY(e));
};
RBTable.prototype.vScrollBarMouseDown = function vScrollBarMouseDown(e) {
if (e.nativeEvent.which !== 1) return;
RBTable.prototype.verticalMoveStart = function verticalMoveStart(e) {
if (e.nativeEvent.which > 1) return;
e.preventDefault();
e.stopPropagation();
this.mouseIsDownRight = true;
this.setLocation(e.clientX, e.clientY);
this.setLocation(clientXY(e));
};
RBTable.prototype.handleMouseMove = function handleMouseMove(clientX, clientY) {
var offsetX = clientX - this.x;
var offsetY = clientY - this.y;
this.setLocation(clientX, clientY);
this.scrollByOffset(offsetX, offsetY);
};
RBTable.prototype.getHoverClass = function getHoverClass() {

@@ -342,6 +396,6 @@ var prefixCls = this.props.prefixCls;

// 如果有 maxWidth 和 minWidth，如果有需要重新 layout table
this.props.columns.forEach(function (_ref2, i) {
var width = _ref2.width,
minWidth = _ref2.minWidth,
maxWidth = _ref2.maxWidth;
this.props.columns.forEach(function (_ref4, i) {
var width = _ref4.width,
minWidth = _ref4.minWidth,
maxWidth = _ref4.maxWidth;

@@ -555,5 +609,5 @@ if (maxWidth || minWidth) {

RBTable.prototype.renderHeaderSideOf = function renderHeaderSideOf(_ref3) {
var side = _ref3.side,
params = _objectWithoutProperties(_ref3, ['side']);
RBTable.prototype.renderHeaderSideOf = function renderHeaderSideOf(_ref5) {
var side = _ref5.side,
params = _objectWithoutProperties(_ref5, ['side']);

@@ -594,8 +648,8 @@ var sideL = side.toLowerCase();

RBTable.prototype.renderBodySideOf = function renderBodySideOf(_ref4) {
RBTable.prototype.renderBodySideOf = function renderBodySideOf(_ref6) {
var _this6 = this;
var side = _ref4.side,
data = _ref4.data,
params = _objectWithoutProperties(_ref4, ['side', 'data']);
var side = _ref6.side,
data = _ref6.data,
params = _objectWithoutProperties(_ref6, ['side', 'data']);

@@ -727,2 +781,5 @@ var sideL = side.toLowerCase();

};
var noTouchScroll = {
onTouchStart: preventDefault, onTouchMove: preventDefault
};
return React.createElement(

@@ -734,2 +791,5 @@ 'div',

onWheel: this.handleScroll,
onTouchStart: this.touchStart,
onTouchMove: this.handleMove,
onTouchEnd: this.touchEnd,
style: style

@@ -739,5 +799,7 @@ },

'div',
{ ref: 'scrollX', className: prefixCls + '-scrollx', onScroll: function onScroll() {
_extends({ ref: 'scrollX', className: prefixCls + '-scrollx',
onScroll: function onScroll() {
return _this7.scrollByOffset(0, 0);
} },
}
}, noTouchScroll),
React.createElement(

@@ -750,5 +812,7 @@ 'div',

'div',
{ className: prefixCls + '__body', ref: 'body', onScroll: function onScroll() {
_extends({ className: prefixCls + '__body', ref: 'body',
onScroll: function onScroll() {
return _this7.scrollByOffset(0, 0);
} },
}
}, noTouchScroll),
this.renderBodySideOf(getParams('Middle')),

@@ -790,5 +854,11 @@ this.renderVirtualTable(getParams('virtual'))

ref: 'vScrollPanel',
onMouseDown: this.vScrollPanelMouseDown
onMouseDown: this.vScrollPanelMouseDown,
onTouchStart: this.vScrollPanelMouseDown
},
React.createElement('div', { ref: 'vScrollBar', className: prefixCls + '__vscroll__bar', onMouseDown: this.vScrollBarMouseDown })
React.createElement('div', { ref: 'vScrollBar', className: prefixCls + '__vscroll__bar',
onMouseDown: this.verticalMoveStart,
onTouchStart: this.verticalMoveStart,
onTouchMove: this.handleMove,
onTouchEnd: this.handleMoveEnd
})
),

@@ -799,5 +869,11 @@ React.createElement(

ref: 'hScrollPanel',
onMouseDown: this.hScrollPanelMouseDown
onMouseDown: this.hScrollPanelMouseDown,
onTouchStart: this.hScrollPanelMouseDown
},
React.createElement('div', { ref: 'hScrollBar', className: prefixCls + '__hscroll__bar', onMouseDown: this.hScrollBarMouseDown })
React.createElement('div', { ref: 'hScrollBar', className: prefixCls + '__hscroll__bar',
onMouseDown: this.horizontalMoveStart,
onTouchStart: this.horizontalMoveStart,
onTouchMove: this.handleMove,
onTouchEnd: this.handleMoveEnd
})
),

@@ -804,0 +880,0 @@ this.props.children

4

package.json
{
"name": "rb-table",
"version": "1.0.7",
"version": "1.0.8",
"description": "High performance table with fixed columns and header support",

@@ -19,3 +19,3 @@ "main": "lib/rb-table.js",

"build-doc": "webpack",
"prepare": "npm run clean && npm run build && npm run build-doc"
"prepare": "npm run clean && npm run build"
},

@@ -22,0 +22,0 @@ "keywords": [

23

README.md
# rb-table
Declarative React table component with highly customizable scroll and layout feature. [demo](https://sijiecai.github.io/rb-table/index.html)
Declarative React table component with highly customizable scroll and layout feature. [demo](https://sijiecai.github.io/rb-table/playground.html)

@@ -65,3 +65,24 @@ ## Festures

## Layout Design
The column layout strategy of rb-table simply try to make content in one line as much as possible. If columns total width exceeds container width, it display a horizontal scrollbar.
The height layout strategy depends on if .rb-table has a specified height, if it does a vertical scrollbar will display when table total height is exceeded. otherwise it just takes as height as it should be just like normal table. You can specify height using css style or to make it into a column flexbox and set "flex: 1 0 0".
## Comparison with existing Library
Compare with [react-virtualize](https://bvaughn.github.io/react-virtualized/#/components/Table) and [fixed-data-table-2](https://github.com/schrodinger/fixed-data-table-2)
- **rb-table pros:** you can use `Crtl + F` to search and auto scroll to matched content.
- **react-virtualize & fixed-data-table-2 pros:** Handles large amount of data. fixed-data-table-2 is feature rich but the scrolling experience is not so good.
Compare with antd [rc-table](https://ant.design/components/table-cn/)
- **rb-table pros:** You are able to scroll the table anywhere, even on top of fixed columns/header. Better performance.
- **rc-table pros:** Much more features provided, bundle with antd is a big plus.
Unique of rb-table
A special designed table layout are provided which makes table layout so much easier in a lot scenes.
## Customize Theme

@@ -68,0 +89,0 @@ `rb-table` provide the less/scss style file with predefined theme variables, so you can easily customize the look by modifying these variable as well as override the default style. if you are useing wepack, bellow is an example as well as a complete list of variables:

128

src/table.js

@@ -28,2 +28,14 @@ import React from 'react'

}
function clientXY({ touches, clientX, clientY } = {}) {
if (touches && touches.length > 0) {
var touch = touches[0];
clientX = touch.clientX;
clientY = touch.clientY;
}
return { clientX, clientY };
}
function preventDefault(e) { e.preventDefault(); }
// 遍历

@@ -55,19 +67,22 @@ function forEachChildren(parent, cb) {

this.handleClickRow = this.handleClickRow.bind(this);
this.handleWindowMouseUp = this.handleWindowMouseUp.bind(this);
this.handleWindowMouseMove = this.handleWindowMouseMove.bind(this);
this.handleMoveEnd = this.handleMoveEnd.bind(this);
this.handleMove = this.handleMove.bind(this);
this.hScrollPanelMouseDown = this.hScrollPanelMouseDown.bind(this);
this.vScrollPanelMouseDown = this.vScrollPanelMouseDown.bind(this);
this.hScrollBarMouseDown = this.hScrollBarMouseDown.bind(this);
this.vScrollBarMouseDown = this.vScrollBarMouseDown.bind(this);
this.horizontalMoveStart = this.horizontalMoveStart.bind(this);
this.verticalMoveStart = this.verticalMoveStart.bind(this);
this.touchStart = this.touchStart.bind(this);
this.touchEnd = this.touchEnd.bind(this);
}
componentWillUnmount() {
addResizeListener(this.table, this.handleResize);
window.removeEventListener('mouseup', this.handleWindowMouseUp);
window.removeEventListener('mousemove', this.handleWindowMouseMove);
window.removeEventListener('mousemove', this.handleMove);
window.removeEventListener('mouseup', this.handleMoveEnd);
}
componentDidMount() {
window.addEventListener('mouseup', this.handleWindowMouseUp);
window.addEventListener('mousemove', this.handleWindowMouseMove);
window.addEventListener('mousemove', this.handleMove);
window.addEventListener('mouseup', this.handleMoveEnd);
// 子元素或者兄弟元素可能在之后加载导致当前元素的高度变化，setTimeout hack 这个情况

@@ -120,3 +135,3 @@ setTimeout(() => {

setLocation(clientX, clientY) {
setLocation({ clientX, clientY }) {
this.x = clientX;

@@ -126,20 +141,43 @@ this.y = clientY;

handleWindowMouseUp() {
handleMoveEnd() {
this.mouseIsDownRight = false;
this.mouseIsDownBottom = false;
this.touchIsStarted = false;
}
handleWindowMouseMove({ clientX, clientY }) {
handleMove(e) {
const { clientX, clientY } = clientXY(e);
if (this.mouseIsDownBottom) {
this.handleMouseMove(clientX, this.y);
this.move({ clientX, clientY: this.y });
} else if (this.mouseIsDownRight) {
this.handleMouseMove(this.x, clientY);
this.move({ clientX: this.x, clientY });
} else if (this.touchIsStarted) {
e.preventDefault();
this.move({ clientX, clientY }, -1);
}
}
move({ clientX, clientY }, multi = 1) {
var offsetX = clientX - this.x;
var offsetY = clientY - this.y;
this.setLocation({ clientX, clientY });
this.scrollByOffset(multi * offsetX, multi * offsetY);
}
touchStart(e) {
this.touchIsStarted = true;
this.setLocation(clientXY(e));
}
touchEnd(e) {
this.touchIsStarted = false;
}
hScrollPanelMouseDown(e) {
if (e.nativeEvent.which !== 1) return;
if (e.nativeEvent.which > 1) return;
e.preventDefault();
e.stopPropagation();
let x = e.clientX - this.refs.hScrollBar.getBoundingClientRect().left;
const { left, right } = this.refs.hScrollBar.getBoundingClientRect();
let x = clientXY(e).clientX - (left + right) * .5;
this.scrollByOffset(x, 0);

@@ -149,32 +187,26 @@ }

vScrollPanelMouseDown(e) {
if (e.nativeEvent.which !== 1) return;
if (e.nativeEvent.which > 1) return;
e.preventDefault();
e.stopPropagation();
let y = e.clientY - this.refs.vScrollBar.getBoundingClientRect().top;
const { top, bottom } = this.refs.vScrollBar.getBoundingClientRect();
let y = clientXY(e).clientY - (top + bottom) * .5;
this.scrollByOffset(0, y);
}
hScrollBarMouseDown(e) {
if (e.nativeEvent.which !== 1) return;
horizontalMoveStart(e) {
if (e.nativeEvent.which > 1) return;
e.preventDefault();
e.stopPropagation();
this.mouseIsDownBottom = true;
this.setLocation(e.clientX, e.clientY);
this.setLocation(clientXY(e));
}
vScrollBarMouseDown(e) {
if (e.nativeEvent.which !== 1) return;
verticalMoveStart(e) {
if (e.nativeEvent.which > 1) return;
e.preventDefault();
e.stopPropagation();
this.mouseIsDownRight = true;
this.setLocation(e.clientX, e.clientY);
this.setLocation(clientXY(e));
}
handleMouseMove(clientX, clientY) {
const offsetX = clientX - this.x;
var offsetY = clientY - this.y;
this.setLocation(clientX, clientY);
this.scrollByOffset(offsetX, offsetY);
}
getHoverClass() {

@@ -211,5 +243,5 @@ const { prefixCls } = this.props

if (virtualTable.offsetWidth < scrollX.clientWidth - this.props.columns.length ) {
if (virtualTable.offsetWidth < scrollX.clientWidth - this.props.columns.length) {
// 获取列换的加了1，这个减掉
virtualTable.style.width = px(scrollX.clientWidth - this.props.columns.length );
virtualTable.style.width = px(scrollX.clientWidth - this.props.columns.length);
}

@@ -527,2 +559,5 @@

const getParams = side => ({ side, columns, leftColumns, rightColumns, middleColumns, data });
const noTouchScroll = {
onTouchStart: preventDefault, onTouchMove: preventDefault
}
return (

@@ -533,9 +568,18 @@ <div className={`${prefixCls} ${className || ''}`}

onWheel={this.handleScroll}
onTouchStart={this.touchStart}
onTouchMove={this.handleMove}
onTouchEnd={this.touchEnd}
style={style}
>
<div ref="scrollX" className={`${prefixCls}-scrollx`} onScroll={() => this.scrollByOffset(0, 0)} >
<div ref="scrollX" className={`${prefixCls}-scrollx`}
onScroll={() => this.scrollByOffset(0, 0)}
{...noTouchScroll}
>
<div className={`${prefixCls}__header`} ref="header" >
{this.renderHeaderSideOf(getParams('Middle'))}
</div>
<div className={`${prefixCls}__body`} ref="body" onScroll={() => this.scrollByOffset(0, 0)}>
<div className={`${prefixCls}__body`} ref="body"
onScroll={() => this.scrollByOffset(0, 0)}
{...noTouchScroll}
>
{this.renderBodySideOf(getParams('Middle'))}

@@ -568,4 +612,10 @@ {this.renderVirtualTable(getParams('virtual'))}

onMouseDown={this.vScrollPanelMouseDown}
onTouchStart={this.vScrollPanelMouseDown}
>
<div ref="vScrollBar" className={`${prefixCls}__vscroll__bar`} onMouseDown={this.vScrollBarMouseDown} />
<div ref="vScrollBar" className={`${prefixCls}__vscroll__bar`}
onMouseDown={this.verticalMoveStart}
onTouchStart={this.verticalMoveStart}
onTouchMove={this.handleMove}
onTouchEnd={this.handleMoveEnd}
/>
</div>

@@ -576,4 +626,10 @@

onMouseDown={this.hScrollPanelMouseDown}
onTouchStart={this.hScrollPanelMouseDown}
>
<div ref="hScrollBar" className={`${prefixCls}__hscroll__bar`} onMouseDown={this.hScrollBarMouseDown} />
<div ref="hScrollBar" className={`${prefixCls}__hscroll__bar`}
onMouseDown={this.horizontalMoveStart}
onTouchStart={this.horizontalMoveStart}
onTouchMove={this.handleMove}
onTouchEnd={this.handleMoveEnd}
/>
</div>

@@ -580,0 +636,0 @@ {this.props.children}

dist/rb-table.css

Sorry, the diff of this file is not supported yet

dist/rb-table.js

Sorry, the diff of this file is too big to display

dist/rb-table.less

Sorry, the diff of this file is not supported yet

dist/rb-table.min.css

Sorry, the diff of this file is not supported yet

es/rb-table.css

Sorry, the diff of this file is not supported yet

es/rb-table.less

Sorry, the diff of this file is not supported yet

es/rb-table.mjs

Sorry, the diff of this file is not supported yet

lib/rb-table.css

Sorry, the diff of this file is not supported yet

lib/rb-table.less

Sorry, the diff of this file is not supported yet

src/style.less

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc