UNPKG

i-react-utils

Version:
1 lines 7.01 kB
'use strict';Object.defineProperty(exports,'__esModule',{value:true});exports.SimpleListTable=exports.ListPagination=undefined;var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if('value'in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor)}}return function(Constructor,protoProps,staticProps){if(protoProps)defineProperties(Constructor.prototype,protoProps);if(staticProps)defineProperties(Constructor,staticProps);return Constructor}}();var _react=require('react');var _react2=_interopRequireDefault(_react);var _iJsUtils=require('i-js-utils');var _utilsInternal=require('./utils-internal');function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError('Cannot call a class as a function')}}function _possibleConstructorReturn(self,call){if(!self){throw new ReferenceError('this hasn\'t been initialised - super() hasn\'t been called')}return call&&(typeof call==='object'||typeof call==='function')?call:self}function _inherits(subClass,superClass){if(typeof superClass!=='function'&&superClass!==null){throw new TypeError('Super expression must either be null or a function, not '+typeof superClass)}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:false,writable:true,configurable:true}});if(superClass)Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass}var ListPagination=exports.ListPagination=function(_React$Component){_inherits(ListPagination,_React$Component);function ListPagination(props){_classCallCheck(this,ListPagination);var _this=_possibleConstructorReturn(this,(ListPagination.__proto__||Object.getPrototypeOf(ListPagination)).call(this));_this.props=props;_this._handlePageChange=_this._handlePageChange.bind(_this);return _this}_createClass(ListPagination,[{key:'_handlePageChange',value:function _handlePageChange(page){this.props.onPageChanged(page)}},{key:'render',value:function render(){var self=this;if(self.props.page!=undefined){var pages=Math.ceil(self.props.total/self.props.count);if(pages>1){return _react2.default.createElement('nav',{className:'list-pagination '+(this.props.className?this.props.className:''),id:self.props.id+'-pagination'},_react2.default.createElement('ul',{className:'pagination'},function(){var current=self.props.page;var pg=[],skipped=false;pg.push(_react2.default.createElement('li',{key:'pg-prev',className:self.props.page<2?'disabled':'',onClick:function onClick(){if(self.props.page>1){self._handlePageChange(self.props.page-1)}}},_react2.default.createElement('span',null,'\xAB')));var _loop=function _loop(p){if(pages<self.props.maxPagesDisplayed||p<2||p>pages-2||Math.abs(p-current)<2){skipped=false;pg.push(_react2.default.createElement('li',{key:'pg-pg-'+p,className:p==self.props.page?'active':'',onClick:function onClick(){if(p!=current){self._handlePageChange(p)}}},_react2.default.createElement('span',null,p)))}else{if(!skipped){skipped=true;pg.push(_react2.default.createElement('li',{key:'pg-skp-'+p,className:'pg-skp disabled'},_react2.default.createElement('span',null,'\u2026')))}}};for(var p=1;p<=pages;p++){_loop(p)}pg.push(_react2.default.createElement('li',{className:pages<=self.props.page?'disabled':'',key:'pg-next',onClick:function onClick(){if(pages>self.props.page){self._handlePageChange(self.props.page+1)}}},_react2.default.createElement('span',null,'\xBB')));return pg}()))}}return null}}]);return ListPagination}(_react2.default.Component);ListPagination.propTypes={onPageChanged:_react2.default.PropTypes.func.isRequired,id:_react.PropTypes.string.isRequired,total:_react.PropTypes.number.isRequired,count:_react.PropTypes.number.isRequired,page:_react.PropTypes.number.isRequired,maxPagesDisplayed:_react.PropTypes.number};ListPagination.defaultProps={maxPagesDisplayed:15};var SimpleListTable=exports.SimpleListTable=function(_React$Component2){_inherits(SimpleListTable,_React$Component2);function SimpleListTable(props){_classCallCheck(this,SimpleListTable);var _this2=_possibleConstructorReturn(this,(SimpleListTable.__proto__||Object.getPrototypeOf(SimpleListTable)).call(this));_this2.state={data:props.data};_this2.id=props.id;if(props.renderRow==undefined){throw'Missing function renderRow(item,index,key):component'}_this2.parts=SimpleListTable.parseListChildren(props.children);_this2.props=props;return _this2}_createClass(SimpleListTable,[{key:'componentWillReceiveProps',value:function componentWillReceiveProps(nextProps){if(this.props.children==undefined||nextProps.children!=this.props.children){this.parts=SimpleListTable.parseListChildren(nextProps.children)}if(nextProps.data!=this.props.data){this.setState({data:nextProps.data})}}},{key:'render',value:function render(){var _this3=this;var data=this.state.data;var hasData=data&&data.length>0;var showHeaders=hasData||this.props.headerAlwaysOn;return _react2.default.createElement('table',{className:'table '+(this.props.className?this.props.className:''),style:{width:'100%'},id:this.id+'-table'},showHeaders?this.parts.thead:null,function(){if(hasData){var rows=[];data.forEach(function(item,index){var realIndex=_this3.props.indexOffset+index;var key=_this3.id+'-row-'+realIndex;var newRow=_this3.props.renderRow(item,realIndex,key);if(newRow!=undefined&&newRow!=null){if(Array.isArray(newRow)){throw'Can return single &lt;tr&gt; component only'}else{rows.push(newRow)}}});return _react2.default.createElement('tbody',null,rows)}else{if(_this3.props.noDataElement){return _react2.default.createElement('tbody',null,_react2.default.createElement('tr',null,_react2.default.createElement('td',{colSpan:'100%'},_this3.props.noDataElement)))}else{return null}}}(),showHeaders?this.parts.tfoot:null)}}],[{key:'parseListChildren',value:function parseListChildren(childrenIn){var out={tfoot:null,thead:null};var children=Array.isArray(childrenIn)?childrenIn:[childrenIn];var _loop2=function _loop2(i){if(children[i]==null||children[i]==undefined){return'continue'}switch(children[i].type){case'tfoot':out.tfoot=children[i];break;case'thead':out.thead=children[i];break;default:(0,_iJsUtils.devOnly)(function(){console.error('List can contain thead or tfoot components only, but',children[i],'found in list')});}};for(var i=0;i<children.length;i++){var _ret2=_loop2(i);if(_ret2==='continue')continue}return out}}]);return SimpleListTable}(_react2.default.Component);SimpleListTable.propTypes={id:_react2.default.PropTypes.string.isRequired,data:_react2.default.PropTypes.any,renderRow:_react2.default.PropTypes.func.isRequired,headerAlwaysOn:_react2.default.PropTypes.bool.isRequired,noDataElement:_react2.default.PropTypes.element,indexOffset:_react2.default.PropTypes.number};SimpleListTable.defaultProps={indexOffset:0};