dtd/es/grid/row.js

根据数梦工场视觉规范打造的组件库，感谢react-components和ant design

import _defineProperty from"babel-runtime/helpers/defineProperty";import _extends from"babel-runtime/helpers/extends";import _typeof from"babel-runtime/helpers/typeof";import _classCallCheck from"babel-runtime/helpers/classCallCheck";import _createClass from"babel-runtime/helpers/createClass";import _possibleConstructorReturn from"babel-runtime/helpers/possibleConstructorReturn";import _inherits from"babel-runtime/helpers/inherits";var __rest=this&&this.__rest||function(e,t){var r={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&t.indexOf(n)<0&&(r[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var s=0;for(n=Object.getOwnPropertySymbols(e);s<n.length;s++)t.indexOf(n[s])<0&&(r[n[s]]=e[n[s]])}return r},enquire=void 0;if("undefined"!=typeof window){var matchMediaPolyfill=function(e){return{media:e,matches:!1,addListener:function(){},removeListener:function(){}}};window.matchMedia=window.matchMedia||matchMediaPolyfill,enquire=require("enquire.js")}import*as React from"react";import{Children,cloneElement}from"react";import classNames from"classnames";import*as PropTypes from"prop-types";var responsiveArray=["xxl","xl","lg","md","sm","xs"],responsiveMap={xs:"(max-width: 575px)",sm:"(min-width: 576px)",md:"(min-width: 768px)",lg:"(min-width: 992px)",xl:"(min-width: 1200px)",xxl:"(min-width: 1600px)"},Row=function(e){function t(){_classCallCheck(this,t);var e=_possibleConstructorReturn(this,(t.__proto__||Object.getPrototypeOf(t)).apply(this,arguments));return e.state={screens:{}},e}return _inherits(t,e),_createClass(t,[{key:"componentDidMount",value:function(){var e=this;Object.keys(responsiveMap).map(function(t){return enquire.register(responsiveMap[t],{match:function(){"object"===_typeof(e.props.gutter)&&e.setState(function(e){return{screens:_extends({},e.screens,_defineProperty({},t,!0))}})},unmatch:function(){"object"===_typeof(e.props.gutter)&&e.setState(function(e){return{screens:_extends({},e.screens,_defineProperty({},t,!1))}})},destroy:function(){}})})}},{key:"componentWillUnmount",value:function(){Object.keys(responsiveMap).map(function(e){return enquire.unregister(responsiveMap[e])})}},{key:"getGutter",value:function(){var e=this.props.gutter;if("object"===(void 0===e?"undefined":_typeof(e)))for(var t=0;t<=responsiveArray.length;t++){var r=responsiveArray[t];if(this.state.screens[r]&&void 0!==e[r])return e[r]}return e}},{key:"render",value:function(){var e,t=this.props,r=t.type,n=t.justify,s=t.align,i=t.className,o=t.style,p=t.children,a=t.prefixCls,l=void 0===a?"dt-row":a,u=__rest(t,["type","justify","align","className","style","children","prefixCls"]),c=this.getGutter(),f=classNames((_defineProperty(e={},l,!r),_defineProperty(e,l+"-"+r,r),_defineProperty(e,l+"-"+r+"-"+n,r&&n),_defineProperty(e,l+"-"+r+"-"+s,r&&s),e),i),m=c>0?_extends({marginLeft:c/-2,marginRight:c/-2},o):o,d=Children.map(p,function(e){return e?e.props&&c>0?cloneElement(e,{style:_extends({paddingLeft:c/2,paddingRight:c/2},e.props.style)}):e:null}),y=_extends({},u);return delete y.gutter,React.createElement("div",_extends({},y,{className:f,style:m}),d)}}]),t}(React.Component);export default Row;Row.defaultProps={gutter:0},Row.propTypes={type:PropTypes.string,align:PropTypes.string,justify:PropTypes.string,className:PropTypes.string,children:PropTypes.node,gutter:PropTypes.oneOfType([PropTypes.object,PropTypes.number]),prefixCls:PropTypes.string};