@uiw/doc 5.0.0-bate-3 → 5.0.0-bate-4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (14) hide show
  1. package/package.json +1 -1
  2. package/web/asset-manifest.json +8 -8
  3. package/web/index.html +1 -1
  4. package/web/locales/en-US/translation.json +2 -1
  5. package/web/locales/zh-CN/translation.json +3 -2
  6. package/web/static/css/{main.7a17942f.css → main.fe418263.css} +2 -2
  7. package/web/static/css/main.fe418263.css.map +1 -0
  8. package/web/static/js/{9609.1f692a2e.chunk.js → 9609.af1fd322.chunk.js} +2 -2
  9. package/web/static/js/{9609.1f692a2e.chunk.js.map → 9609.af1fd322.chunk.js.map} +1 -1
  10. package/web/static/js/main.a3231e89.js +2 -0
  11. package/web/static/js/main.a3231e89.js.map +1 -0
  12. package/web/static/css/main.7a17942f.css.map +0 -1
  13. package/web/static/js/main.edb001bb.js +0 -2
  14. package/web/static/js/main.edb001bb.js.map +0 -1
package/web/static/js/{9609.1f692a2e.chunk.js → 9609.af1fd322.chunk.js} RENAMED
@@ -1,2 +1,2 @@
1
- "use strict";(self.webpackChunkwebsite=self.webpackChunkwebsite||[]).push([[9609],{9609:function(e,n,t){t.r(n),n.default={components:{18:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},r=t(968);function l(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function a(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?l(Object(t),!0).forEach((function(n){o(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):l(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function o(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}var u=function(e){var t=e.num,r=e.height,l=e.width,o=e.style,u=e.background;return n.default.createElement("div",{style:a(a({},o),{},{textAlign:"center",paddingTop:5,paddingBottom:5,background:u,width:l,height:r})},"Col ",t)};return function(){return n.default.createElement(r.Row,null,n.default.createElement(r.Col,{fixed:!0,style:{width:150}}," ",n.default.createElement(u,{num:"1",background:"#A5A5A5"})," "),n.default.createElement(r.Col,{grow:2}," ",n.default.createElement(u,{num:"2",background:"#dedede"})," "),n.default.createElement(r.Col,{grow:1}," ",n.default.createElement(u,{num:"3",background:"#A5A5A5"})," "))}}(),37:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},r=t(968);function l(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function a(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?l(Object(t),!0).forEach((function(n){o(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):l(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function o(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}var u=function(e){var t=e.num,r=e.height,l=e.width,o=e.style,u=e.background;return n.default.createElement("div",{style:a(a({},o),{},{textAlign:"center",paddingTop:5,paddingBottom:5,background:u,width:l,height:r})},"Col ",t)};return function(){return n.default.createElement("div",null,n.default.createElement(r.Row,{gutter:10},n.default.createElement(r.Col,null," ",n.default.createElement(u,{background:"#A5A5A5",num:1})," "),n.default.createElement(r.Col,null," ",n.default.createElement(u,{background:"#dedede",num:2})," "),n.default.createElement(r.Col,null," ",n.default.createElement(u,{background:"#A5A5A5",num:3})," ")),n.default.createElement(r.Row,{style:{marginTop:10}},n.default.createElement(r.Col,null," ",n.default.createElement(u,{background:"#A5A5A5",num:1})," "),n.default.createElement(r.Col,null," ",n.default.createElement(u,{background:"#dedede",num:2})," "),n.default.createElement(r.Col,null," ",n.default.createElement(u,{background:"#A5A5A5",num:3})," ")))}}(),63:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},r=t(968);function l(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function a(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?l(Object(t),!0).forEach((function(n){o(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):l(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function o(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}var u={backgroundColor:"rgba(230, 230, 230, 0.67)",marginBottom:10},c=function(e){var t=e.num,r=e.height,l=e.style,o=e.background,u=void 0===o?"#2EA3F4":o;return n.default.createElement("div",{style:a(a({},l),{},{textAlign:"center",color:"#fff",paddingTop:5,paddingBottom:5,background:u,height:r})},"Col ",t)};return function(){return n.default.createElement("div",null,n.default.createElement(r.Row,{gutter:10,justify:"center",align:"top",style:u},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:35,num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:50,num:2})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:70,num:3})," ")),n.default.createElement(r.Row,{gutter:10,justify:"space-around",align:"middle",style:u},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:35,num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:50,num:2})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:70,num:3})," ")),n.default.createElement(r.Row,{gutter:10,justify:"space-between",align:"bottom",style:u},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:35,num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:50,num:2})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:70,num:3})," ")),n.default.createElement(r.Row,{gutter:10,justify:"flex-end",align:"bottom",style:u},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:35,num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:50,num:2})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:70,num:3})," ")),n.default.createElement(r.Row,{gutter:10,justify:"center",align:"baseline",style:a(a({},u),{},{marginBottom:0})},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:85,style:{lineHeight:"85px"},num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:50,num:2})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:70,num:3})," ")))}}(),103:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},r=t(968);function l(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function a(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?l(Object(t),!0).forEach((function(n){o(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):l(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function o(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}var u=function(e){var t=e.num,r=e.style,l=e.background,o=void 0===l?"#2EA3F4":l;return n.default.createElement("div",{style:a(a({},r),{},{textAlign:"center",color:"#fff",paddingTop:5,paddingBottom:5,background:o})},"Col ",t)};return function(){return n.default.createElement("div",null,n.default.createElement(r.Row,{gutter:10,style:{height:130}},n.default.createElement(r.Col,{align:"top"}," ",n.default.createElement(u,{num:1})," "),n.default.createElement(r.Col,{align:"middle"}," ",n.default.createElement(u,{num:2})," "),n.default.createElement(r.Col,{align:"bottom"}," ",n.default.createElement(u,{num:3})," ")))}}(),122:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},r=t(968);function l(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function a(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?l(Object(t),!0).forEach((function(n){o(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):l(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function o(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}var u={backgroundColor:"rgba(230, 230, 230, 0.67)",marginBottom:10},c=function(e){var t=e.num,r=e.height,l=e.width,o=e.style,u=e.background,c=void 0===u?"#2EA3F4":u;return n.default.createElement("div",{style:a(a({},o),{},{textAlign:"center",color:"#fff",paddingTop:5,paddingBottom:5,background:c,width:l,height:r})},"Col ",t)};return function(){return n.default.createElement("div",null,n.default.createElement(r.Row,{gutter:10,justify:"flex-start",style:u},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:2})," ")),n.default.createElement(r.Row,{gutter:10,justify:"center",style:u},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:2})," ")),n.default.createElement(r.Row,{gutter:10,justify:"flex-end",style:u},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:2})," ")),n.default.createElement(r.Row,{gutter:10,justify:"space-between",style:u},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:2})," ")),n.default.createElement(r.Row,{gutter:10,justify:"space-around",style:u},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:2})," ")),n.default.createElement(r.Row,{gutter:10,justify:"space-evenly",style:a(a({},u),{},{marginBottom:0})},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:2})," ")))}}(),163:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},r=t(968);function l(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function a(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?l(Object(t),!0).forEach((function(n){o(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):l(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function o(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}var u=function(e){var t=e.num,r=e.height,l=e.width,o=e.style,u=e.background,c=void 0===u?"#2EA3F4":u;return n.default.createElement("div",{style:a(a({},o),{},{textAlign:"center",color:"#fff",paddingTop:5,paddingBottom:5,background:c,width:l,height:r})},"Col ",t)};return function(){return n.default.createElement("div",null,n.default.createElement(r.Row,{gutter:10,style:{marginBottom:10}},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:2})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:3})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:4})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:5})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:6})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:7})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:8})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:9})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:10})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:11})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:12})," ")),n.default.createElement(r.Row,{gutter:10,style:{marginBottom:10}},n.default.createElement(r.Col,{span:"16"}," ",n.default.createElement(u,{num:1})," "),n.default.createElement(r.Col,{span:"8"}," ",n.default.createElement(u,{num:2})," ")),n.default.createElement(r.Row,{gutter:10,style:{marginBottom:10}},n.default.createElement(r.Col,{span:"8"}," ",n.default.createElement(u,{num:1})," "),n.default.createElement(r.Col,{span:"8"}," ",n.default.createElement(u,{num:2})," "),n.default.createElement(r.Col,{span:"8"}," ",n.default.createElement(u,{num:3})," ")),n.default.createElement(r.Row,{gutter:10},n.default.createElement(r.Col,{span:"12"}," ",n.default.createElement(u,{num:1})," "),n.default.createElement(r.Col,{span:"12"}," ",n.default.createElement(u,{num:2})," ")))}}(),204:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},r=t(968);function l(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function a(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?l(Object(t),!0).forEach((function(n){o(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):l(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function o(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}var u=function(e){var t=e.num,r=e.style,l=e.background,o=void 0===l?"#2EA3F4":l;return n.default.createElement("div",{style:a(a({},r),{},{textAlign:"center",color:"#fff",paddingTop:5,paddingBottom:5,background:o})},"Col ",t)};return function(){return n.default.createElement("div",null,n.default.createElement(r.Row,{gutter:10,style:{marginBottom:10}},n.default.createElement(r.Col,null," ",n.default.createElement(u,{num:1})," "),n.default.createElement(r.Col,{grow:2}," ",n.default.createElement(u,{num:2})," ")),n.default.createElement(r.Row,{gutter:10},n.default.createElement(r.Col,null," ",n.default.createElement(u,{num:1})," "),n.default.createElement(r.Col,{grow:2}," ",n.default.createElement(u,{num:2})," "),n.default.createElement(r.Col,{grow:5}," ",n.default.createElement(u,{num:3})," ")))}}()},data:{18:{name:18,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar Box = function Box(_ref) {\n var num = _ref.num,\n height = _ref.height,\n width = _ref.width,\n style = _ref.style,\n background = _ref.background;\n return /*#__PURE__*/_react["default"].createElement("div", {\n style: _objectSpread(_objectSpread({}, style), {}, {\n textAlign: \'center\',\n paddingTop: 5,\n paddingBottom: 5,\n background: background,\n width: width,\n height: height\n })\n }, "Col ", num);\n};\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react["default"].createElement(_uiw.Row, null, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n fixed: true,\n style: {\n width: 150\n }\n }, " ", /*#__PURE__*/_react["default"].createElement(Box, {\n num: "1",\n background: "#A5A5A5"\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n grow: 2\n }, " ", /*#__PURE__*/_react["default"].createElement(Box, {\n num: "2",\n background: "#dedede"\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n grow: 1\n }, " ", /*#__PURE__*/_react["default"].createElement(Box, {\n num: "3",\n background: "#A5A5A5"\n }), " "));\n};\n\nreturn Demo;',language:"jsx",value:'import React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst Box = ({ num, height, width, style, background }) => <div style={{ ...style, textAlign: \'center\', paddingTop: 5, paddingBottom: 5, background, width, height}}>Col {num}</div>\nconst Demo = () => (\n <Row>\n <Col fixed style={{ width: 150 }}> <Box num="1" background="#A5A5A5" /> </Col>\n <Col grow={2}> <Box num="2" background="#dedede" /> </Col>\n <Col grow={1}> <Box num="3" background="#A5A5A5" /> </Col>\n </Row>\n);\nexport default Demo'},37:{name:37,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar Blank = function Blank(_ref) {\n var num = _ref.num,\n height = _ref.height,\n width = _ref.width,\n style = _ref.style,\n background = _ref.background;\n return /*#__PURE__*/_react["default"].createElement("div", {\n style: _objectSpread(_objectSpread({}, style), {}, {\n textAlign: \'center\',\n paddingTop: 5,\n paddingBottom: 5,\n background: background,\n width: width,\n height: height\n })\n }, "Col ", num);\n};\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, null, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n background: "#A5A5A5",\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, null, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n background: "#dedede",\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, null, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n background: "#A5A5A5",\n num: 3\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n style: {\n marginTop: 10\n }\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, null, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n background: "#A5A5A5",\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, null, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n background: "#dedede",\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, null, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n background: "#A5A5A5",\n num: 3\n }), " ")));\n};\n\nreturn Demo;',language:"jsx",value:'import React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst Blank = ({ num, height, width, style, background }) => <div style={{ ...style, textAlign: \'center\', paddingTop: 5,paddingBottom: 5, background, width, height}}>Col {num}</div>\n\nconst Demo =() =>(\n <div>\n <Row gutter={10}>\n <Col> <Blank background="#A5A5A5" num={1}/> </Col>\n <Col> <Blank background="#dedede" num={2}/> </Col>\n <Col> <Blank background="#A5A5A5" num={3}/> </Col>\n </Row>\n <Row style={{ marginTop: 10 }}>\n <Col> <Blank background="#A5A5A5" num={1}/> </Col>\n <Col> <Blank background="#dedede" num={2}/> </Col>\n <Col> <Blank background="#A5A5A5" num={3}/> </Col>\n </Row>\n </div>\n);\nexport default Demo\n'},63:{name:63,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar colStyl = {\n backgroundColor: \'rgba(230, 230, 230, 0.67)\',\n marginBottom: 10\n};\n\nvar Blank = function Blank(_ref) {\n var num = _ref.num,\n height = _ref.height,\n style = _ref.style,\n _ref$background = _ref.background,\n background = _ref$background === void 0 ? \'#2EA3F4\' : _ref$background;\n return /*#__PURE__*/_react["default"].createElement("div", {\n style: _objectSpread(_objectSpread({}, style), {}, {\n textAlign: \'center\',\n color: \'#fff\',\n paddingTop: 5,\n paddingBottom: 5,\n background: background,\n height: height\n })\n }, "Col ", num);\n};\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "center",\n align: "top",\n style: colStyl\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 35,\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 50,\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 70,\n num: 3\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "space-around",\n align: "middle",\n style: colStyl\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 35,\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 50,\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 70,\n num: 3\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "space-between",\n align: "bottom",\n style: colStyl\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 35,\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 50,\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 70,\n num: 3\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "flex-end",\n align: "bottom",\n style: colStyl\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 35,\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 50,\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 70,\n num: 3\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "center",\n align: "baseline",\n style: _objectSpread(_objectSpread({}, colStyl), {}, {\n marginBottom: 0\n })\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 85,\n style: {\n lineHeight: \'85px\'\n },\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 50,\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 70,\n num: 3\n }), " ")));\n};\n\nreturn Demo;',language:"jsx",value:'import React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst colStyl = { backgroundColor: \'rgba(230, 230, 230, 0.67)\', marginBottom: 10 }\nconst Blank = ({ num, height, style, background = \'#2EA3F4\' }) => <div style={{ ...style, textAlign: \'center\', color: \'#fff\', paddingTop: 5, paddingBottom: 5, background, height}}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} justify="center" align="top" style={colStyl}>\n <Col span="2"> <Blank height={35} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n <Row gutter={10} justify="space-around" align="middle" style={colStyl}>\n <Col span="2"> <Blank height={35} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n <Row gutter={10} justify="space-between" align="bottom" style={colStyl}>\n <Col span="2"> <Blank height={35} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n <Row gutter={10} justify="flex-end" align="bottom" style={colStyl}>\n <Col span="2"> <Blank height={35} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n <Row gutter={10} justify="center" align="baseline" style={{ ...colStyl, marginBottom: 0 }}>\n <Col span="2"> <Blank height={85} style={{ lineHeight: \'85px\' }} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n </div>\n);\nexport default Demo'},103:{name:103,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar Blank = function Blank(_ref) {\n var num = _ref.num,\n style = _ref.style,\n _ref$background = _ref.background,\n background = _ref$background === void 0 ? \'#2EA3F4\' : _ref$background;\n return /*#__PURE__*/_react["default"].createElement("div", {\n style: _objectSpread(_objectSpread({}, style), {}, {\n textAlign: \'center\',\n color: \'#fff\',\n paddingTop: 5,\n paddingBottom: 5,\n background: background\n })\n }, "Col ", num);\n};\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n style: {\n height: 130\n }\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n align: "top"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n align: "middle"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n align: "bottom"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 3\n }), " ")));\n};\n\nreturn Demo;',language:"jsx",value:"import React from \"react\"\nimport { Row, Col } from 'uiw';\n\nconst Blank = ({ num, style, background = '#2EA3F4' }) => <div style={{ ...style, textAlign: 'center', color: '#fff', paddingTop: 5, paddingBottom: 5, background }}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} style={{height: 130}}>\n <Col align=\"top\"> <Blank num={1}/> </Col>\n <Col align=\"middle\"> <Blank num={2}/> </Col>\n <Col align=\"bottom\"> <Blank num={3}/> </Col>\n </Row>\n </div>\n);\nexport default Demo"},122:{name:122,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar rowStyl = {\n backgroundColor: \'rgba(230, 230, 230, 0.67)\',\n marginBottom: 10\n};\n\nvar Blank = function Blank(_ref) {\n var num = _ref.num,\n height = _ref.height,\n width = _ref.width,\n style = _ref.style,\n _ref$background = _ref.background,\n background = _ref$background === void 0 ? \'#2EA3F4\' : _ref$background;\n return /*#__PURE__*/_react["default"].createElement("div", {\n style: _objectSpread(_objectSpread({}, style), {}, {\n textAlign: \'center\',\n color: \'#fff\',\n paddingTop: 5,\n paddingBottom: 5,\n background: background,\n width: width,\n height: height\n })\n }, "Col ", num);\n};\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "flex-start",\n style: rowStyl\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "center",\n style: rowStyl\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "flex-end",\n style: rowStyl\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "space-between",\n style: rowStyl\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "space-around",\n style: rowStyl\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "space-evenly",\n style: _objectSpread(_objectSpread({}, rowStyl), {}, {\n marginBottom: 0\n })\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " ")));\n};\n\nreturn Demo;',language:"jsx",value:'import React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst rowStyl = { backgroundColor: \'rgba(230, 230, 230, 0.67)\', marginBottom: 10 }\nconst Blank = ({ num, height, width, style, background = \'#2EA3F4\' }) => <div style={{ ...style, textAlign: \'center\', color: \'#fff\', paddingTop: 5, paddingBottom: 5, background, width, height}}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} justify="flex-start" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="center" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="flex-end" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="space-between" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="space-around" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="space-evenly" style={{...rowStyl, marginBottom: 0 }}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n </div>\n);\nexport default Demo'},163:{name:163,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar Blank = function Blank(_ref) {\n var num = _ref.num,\n height = _ref.height,\n width = _ref.width,\n style = _ref.style,\n _ref$background = _ref.background,\n background = _ref$background === void 0 ? \'#2EA3F4\' : _ref$background;\n return /*#__PURE__*/_react["default"].createElement("div", {\n style: _objectSpread(_objectSpread({}, style), {}, {\n textAlign: \'center\',\n color: \'#fff\',\n paddingTop: 5,\n paddingBottom: 5,\n background: background,\n width: width,\n height: height\n })\n }, "Col ", num);\n};\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n style: {\n marginBottom: 10\n }\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 3\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 4\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 5\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 6\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 7\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 8\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 9\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 10\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 11\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 12\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n style: {\n marginBottom: 10\n }\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "16"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "8"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n style: {\n marginBottom: 10\n }\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "8"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "8"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "8"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 3\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "12"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "12"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " ")));\n};\n\nreturn Demo;',language:"jsx",value:'import React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst Blank = ({ num, height, width, style, background = \'#2EA3F4\' }) => <div style={{ ...style, textAlign: \'center\', color: \'#fff\', paddingTop: 5, paddingBottom: 5, background, width, height}}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} style={{ marginBottom: 10 }}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n <Col span="2"> <Blank num={3}/> </Col>\n <Col span="2"> <Blank num={4}/> </Col>\n <Col span="2"> <Blank num={5}/> </Col>\n <Col span="2"> <Blank num={6}/> </Col>\n <Col span="2"> <Blank num={7}/> </Col>\n <Col span="2"> <Blank num={8}/> </Col>\n <Col span="2"> <Blank num={9}/> </Col>\n <Col span="2"> <Blank num={10}/> </Col>\n <Col span="2"> <Blank num={11}/> </Col>\n <Col span="2"> <Blank num={12}/> </Col>\n </Row>\n <Row gutter={10} style={{ marginBottom: 10 }}>\n <Col span="16"> <Blank num={1}/> </Col>\n <Col span="8"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} style={{ marginBottom: 10 }}>\n <Col span="8"> <Blank num={1}/> </Col>\n <Col span="8"> <Blank num={2}/> </Col>\n <Col span="8"> <Blank num={3}/> </Col>\n </Row>\n <Row gutter={10}>\n <Col span="12"> <Blank num={1}/> </Col>\n <Col span="12"> <Blank num={2}/> </Col>\n </Row>\n </div>\n);\nexport default Demo'},204:{name:204,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar Blank = function Blank(_ref) {\n var num = _ref.num,\n style = _ref.style,\n _ref$background = _ref.background,\n background = _ref$background === void 0 ? \'#2EA3F4\' : _ref$background;\n return /*#__PURE__*/_react["default"].createElement("div", {\n style: _objectSpread(_objectSpread({}, style), {}, {\n textAlign: \'center\',\n color: \'#fff\',\n paddingTop: 5,\n paddingBottom: 5,\n background: background\n })\n }, "Col ", num);\n};\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n style: {\n marginBottom: 10\n }\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, null, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n grow: 2\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, null, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n grow: 2\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n grow: 5\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 3\n }), " ")));\n};\n\nreturn Demo;',language:"jsx",value:"import React from \"react\"\nimport { Row, Col } from 'uiw';\n\nconst Blank = ({ num, style, background = '#2EA3F4' }) => <div style={{ ...style, textAlign: 'center', color: '#fff', paddingTop: 5, paddingBottom: 5, background }}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} style={{ marginBottom: 10 }}>\n <Col> <Blank num={1}/> </Col>\n <Col grow={2}> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10}>\n <Col> <Blank num={1}/> </Col>\n <Col grow={2}> <Blank num={2}/> </Col>\n <Col grow={5}> <Blank num={3}/> </Col>\n </Row>\n </div>\n);\nexport default Demo"}},source:'Grid \u5220\u683c\n===\n\n[![Open in unpkg](https://img.shields.io/badge/Open%20in-unpkg-blue)](https://uiwjs.github.io/npm-unpkg/#/pkg/@uiw/react-grid/file/README.md)\n[![NPM Downloads](https://img.shields.io/npm/dm/@uiw/react-grid.svg?style=flat)](https://www.npmjs.com/package/@uiw/react-grid)\n[![npm version](https://img.shields.io/npm/v/@uiw/react-grid.svg?label=@uiw/react-grid)](https://npmjs.com/@uiw/react-grid)\n\n\u57fa\u4e8e `flex` \u6805\u683c\u7cfb\u7edf\u3002\n\n```jsx\nimport { Row, Col } from \'uiw\';\n// or\nimport { Row, Col } from \'@uiw/react-grid\';\n```\n\n### \u57fa\u7840\u7528\u6cd5\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst Box = ({ num, height, width, style, background }) => <div style={{ ...style, textAlign: \'center\', paddingTop: 5, paddingBottom: 5, background, width, height}}>Col {num}</div>\nconst Demo = () => (\n <Row>\n <Col fixed style={{ width: 150 }}> <Box num="1" background="#A5A5A5" /> </Col>\n <Col grow={2}> <Box num="2" background="#dedede" /> </Col>\n <Col grow={1}> <Box num="3" background="#A5A5A5" /> </Col>\n </Row>\n);\nexport default Demo\n```\n\n### Gutter\n\n\u6805\u683c\u95f4\u9694\uff0c\u53ef\u4ee5\u5199\u6210\u50cf\u7d20\u503c\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst Blank = ({ num, height, width, style, background }) => <div style={{ ...style, textAlign: \'center\', paddingTop: 5,paddingBottom: 5, background, width, height}}>Col {num}</div>\n\nconst Demo =() =>(\n <div>\n <Row gutter={10}>\n <Col> <Blank background="#A5A5A5" num={1}/> </Col>\n <Col> <Blank background="#dedede" num={2}/> </Col>\n <Col> <Blank background="#A5A5A5" num={3}/> </Col>\n </Row>\n <Row style={{ marginTop: 10 }}>\n <Col> <Blank background="#A5A5A5" num={1}/> </Col>\n <Col> <Blank background="#dedede" num={2}/> </Col>\n <Col> <Blank background="#A5A5A5" num={3}/> </Col>\n </Row>\n </div>\n);\nexport default Demo\n\n```\n\n### Flex \u884c\u8bbe\u7f6e\u5217\u5bf9\u9f50\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst colStyl = { backgroundColor: \'rgba(230, 230, 230, 0.67)\', marginBottom: 10 }\nconst Blank = ({ num, height, style, background = \'#2EA3F4\' }) => <div style={{ ...style, textAlign: \'center\', color: \'#fff\', paddingTop: 5, paddingBottom: 5, background, height}}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} justify="center" align="top" style={colStyl}>\n <Col span="2"> <Blank height={35} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n <Row gutter={10} justify="space-around" align="middle" style={colStyl}>\n <Col span="2"> <Blank height={35} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n <Row gutter={10} justify="space-between" align="bottom" style={colStyl}>\n <Col span="2"> <Blank height={35} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n <Row gutter={10} justify="flex-end" align="bottom" style={colStyl}>\n <Col span="2"> <Blank height={35} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n <Row gutter={10} justify="center" align="baseline" style={{ ...colStyl, marginBottom: 0 }}>\n <Col span="2"> <Blank height={85} style={{ lineHeight: \'85px\' }} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n </div>\n);\nexport default Demo\n```\n\n### Flex \u5217\u5bf9\u9f50\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst Blank = ({ num, style, background = \'#2EA3F4\' }) => <div style={{ ...style, textAlign: \'center\', color: \'#fff\', paddingTop: 5, paddingBottom: 5, background }}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} style={{height: 130}}>\n <Col align="top"> <Blank num={1}/> </Col>\n <Col align="middle"> <Blank num={2}/> </Col>\n <Col align="bottom"> <Blank num={3}/> </Col>\n </Row>\n </div>\n);\nexport default Demo\n```\n\n### \u5bf9\u9f50\u5185\u5bb9\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst rowStyl = { backgroundColor: \'rgba(230, 230, 230, 0.67)\', marginBottom: 10 }\nconst Blank = ({ num, height, width, style, background = \'#2EA3F4\' }) => <div style={{ ...style, textAlign: \'center\', color: \'#fff\', paddingTop: 5, paddingBottom: 5, background, width, height}}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} justify="flex-start" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="center" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="flex-end" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="space-between" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="space-around" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="space-evenly" style={{...rowStyl, marginBottom: 0 }}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n </div>\n);\nexport default Demo\n```\n\n### 24\u5220\u683c\n\n\u53ef\u4ee5\u901a\u8fc7\u6307\u5b9a `24` \u5217\u4e2d\u6bcf\u5217\u7684\u5bbd\u5ea6\u6765\u521b\u5efa\u57fa\u672c\u7f51\u683c\u7cfb\u7edf\u3002\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst Blank = ({ num, height, width, style, background = \'#2EA3F4\' }) => <div style={{ ...style, textAlign: \'center\', color: \'#fff\', paddingTop: 5, paddingBottom: 5, background, width, height}}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} style={{ marginBottom: 10 }}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n <Col span="2"> <Blank num={3}/> </Col>\n <Col span="2"> <Blank num={4}/> </Col>\n <Col span="2"> <Blank num={5}/> </Col>\n <Col span="2"> <Blank num={6}/> </Col>\n <Col span="2"> <Blank num={7}/> </Col>\n <Col span="2"> <Blank num={8}/> </Col>\n <Col span="2"> <Blank num={9}/> </Col>\n <Col span="2"> <Blank num={10}/> </Col>\n <Col span="2"> <Blank num={11}/> </Col>\n <Col span="2"> <Blank num={12}/> </Col>\n </Row>\n <Row gutter={10} style={{ marginBottom: 10 }}>\n <Col span="16"> <Blank num={1}/> </Col>\n <Col span="8"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} style={{ marginBottom: 10 }}>\n <Col span="8"> <Blank num={1}/> </Col>\n <Col span="8"> <Blank num={2}/> </Col>\n <Col span="8"> <Blank num={3}/> </Col>\n </Row>\n <Row gutter={10}>\n <Col span="12"> <Blank num={1}/> </Col>\n <Col span="12"> <Blank num={2}/> </Col>\n </Row>\n </div>\n);\nexport default Demo\n```\n\n### \u52a8\u6001\u5217\u589e\u957f\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst Blank = ({ num, style, background = \'#2EA3F4\' }) => <div style={{ ...style, textAlign: \'center\', color: \'#fff\', paddingTop: 5, paddingBottom: 5, background }}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} style={{ marginBottom: 10 }}>\n <Col> <Blank num={1}/> </Col>\n <Col grow={2}> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10}>\n <Col> <Blank num={1}/> </Col>\n <Col grow={2}> <Blank num={2}/> </Col>\n <Col grow={5}> <Blank num={3}/> </Col>\n </Row>\n </div>\n);\nexport default Demo\n```\n\n## Row\n\n| \u53c2\u6570 | \u8bf4\u660e | \u7c7b\u578b | \u9ed8\u8ba4\u503c |\n|--------- |-------- |--------- |-------- |\n| gutter | \u6805\u683c\u95f4\u9694\u95f4\u8ddd | number | - |\n| justify | flex \u5e03\u5c40\u4e0b\u7684\u6c34\u5e73\u6392\u5217\u65b9\u5f0f | Enum{`flex-start`, `flex-end`, `center`, `space-between`, `space-around`, `space-evenly`} | - |\n| align | flex \u5e03\u5c40\u4e0b\u7684\u5782\u76f4\u5bf9\u9f50\u65b9\u5f0f | Enum{`top`, `middle`, `bottom`, `baseline`} | - |\n\n\n## Col\n\n| \u53c2\u6570 | \u8bf4\u660e | \u7c7b\u578b | \u9ed8\u8ba4\u503c |\n|--------- |-------- |--------- |-------- |\n| fixed | \u5982\u679c\u4e3a `true`\uff0c\u5219\u5217\u5bbd\u56fa\u5b9a\u4e3a\u5176\u5185\u5bb9\u7684\u5bbd\u5ea6 | boolean | - |\n| grow | \u5217\u7684\u5bbd\u5ea6\u76f8\u5bf9\u4e8e\u540c\u4e00\u7f51\u683c\u4e2d\u5176\u4ed6\u5217\u7684\u6bd4\u7387 | number | - |\n| align | \u7f51\u683c\u4e2d\u5217\u7684\u5bf9\u9f50\u65b9\u5f0f | Enum{`top`, `middle`, `bottom`, `baseline`} | - |'}}}]);
2
- //# sourceMappingURL=9609.1f692a2e.chunk.js.map
1
+ "use strict";(self.webpackChunkwebsite=self.webpackChunkwebsite||[]).push([[9609],{9609:function(e,n,t){t.r(n),n.default={components:{18:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},r=t(968);function l(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function a(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?l(Object(t),!0).forEach((function(n){o(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):l(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function o(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}var u=function(e){var t=e.num,r=e.height,l=e.width,o=e.style,u=e.background;return n.default.createElement("div",{style:a(a({},o),{},{textAlign:"center",paddingTop:5,paddingBottom:5,background:u,width:l,height:r})},"Col ",t)};return function(){return n.default.createElement(r.Row,null,n.default.createElement(r.Col,{fixed:!0,style:{width:150}}," ",n.default.createElement(u,{num:"1",background:"#A5A5A5"})," "),n.default.createElement(r.Col,{grow:2}," ",n.default.createElement(u,{num:"2",background:"#dedede"})," "),n.default.createElement(r.Col,{grow:1}," ",n.default.createElement(u,{num:"3",background:"#A5A5A5"})," "))}}(),37:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},r=t(968);function l(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function a(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?l(Object(t),!0).forEach((function(n){o(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):l(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function o(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}var u=function(e){var t=e.num,r=e.height,l=e.width,o=e.style,u=e.background;return n.default.createElement("div",{style:a(a({},o),{},{textAlign:"center",paddingTop:5,paddingBottom:5,background:u,width:l,height:r})},"Col ",t)};return function(){return n.default.createElement("div",null,n.default.createElement(r.Row,{gutter:10},n.default.createElement(r.Col,null," ",n.default.createElement(u,{background:"#A5A5A5",num:1})," "),n.default.createElement(r.Col,null," ",n.default.createElement(u,{background:"#dedede",num:2})," "),n.default.createElement(r.Col,null," ",n.default.createElement(u,{background:"#A5A5A5",num:3})," ")),n.default.createElement(r.Row,{style:{marginTop:10}},n.default.createElement(r.Col,null," ",n.default.createElement(u,{background:"#A5A5A5",num:1})," "),n.default.createElement(r.Col,null," ",n.default.createElement(u,{background:"#dedede",num:2})," "),n.default.createElement(r.Col,null," ",n.default.createElement(u,{background:"#A5A5A5",num:3})," ")))}}(),63:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},r=t(968);function l(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function a(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?l(Object(t),!0).forEach((function(n){o(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):l(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function o(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}var u={backgroundColor:"rgba(230, 230, 230, 0.67)",marginBottom:10},c=function(e){var t=e.num,r=e.height,l=e.style,o=e.background,u=void 0===o?"#2EA3F4":o;return n.default.createElement("div",{style:a(a({},l),{},{textAlign:"center",color:"#fff",paddingTop:5,paddingBottom:5,background:u,height:r})},"Col ",t)};return function(){return n.default.createElement("div",null,n.default.createElement(r.Row,{gutter:10,justify:"center",align:"top",style:u},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:35,num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:50,num:2})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:70,num:3})," ")),n.default.createElement(r.Row,{gutter:10,justify:"space-around",align:"middle",style:u},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:35,num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:50,num:2})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:70,num:3})," ")),n.default.createElement(r.Row,{gutter:10,justify:"space-between",align:"bottom",style:u},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:35,num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:50,num:2})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:70,num:3})," ")),n.default.createElement(r.Row,{gutter:10,justify:"flex-end",align:"bottom",style:u},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:35,num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:50,num:2})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:70,num:3})," ")),n.default.createElement(r.Row,{gutter:10,justify:"center",align:"baseline",style:a(a({},u),{},{marginBottom:0})},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:85,style:{lineHeight:"85px"},num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:50,num:2})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{height:70,num:3})," ")))}}(),103:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},r=t(968);function l(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function a(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?l(Object(t),!0).forEach((function(n){o(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):l(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function o(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}var u=function(e){var t=e.num,r=e.style,l=e.background,o=void 0===l?"#2EA3F4":l;return n.default.createElement("div",{style:a(a({},r),{},{textAlign:"center",color:"#fff",paddingTop:5,paddingBottom:5,background:o})},"Col ",t)};return function(){return n.default.createElement("div",null,n.default.createElement(r.Row,{gutter:10,style:{height:130}},n.default.createElement(r.Col,{align:"top"}," ",n.default.createElement(u,{num:1})," "),n.default.createElement(r.Col,{align:"middle"}," ",n.default.createElement(u,{num:2})," "),n.default.createElement(r.Col,{align:"bottom"}," ",n.default.createElement(u,{num:3})," ")))}}(),122:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},r=t(968);function l(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function a(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?l(Object(t),!0).forEach((function(n){o(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):l(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function o(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}var u={backgroundColor:"rgba(230, 230, 230, 0.67)",marginBottom:10},c=function(e){var t=e.num,r=e.height,l=e.width,o=e.style,u=e.background,c=void 0===u?"#2EA3F4":u;return n.default.createElement("div",{style:a(a({},o),{},{textAlign:"center",color:"#fff",paddingTop:5,paddingBottom:5,background:c,width:l,height:r})},"Col ",t)};return function(){return n.default.createElement("div",null,n.default.createElement(r.Row,{gutter:10,justify:"flex-start",style:u},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:2})," ")),n.default.createElement(r.Row,{gutter:10,justify:"center",style:u},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:2})," ")),n.default.createElement(r.Row,{gutter:10,justify:"flex-end",style:u},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:2})," ")),n.default.createElement(r.Row,{gutter:10,justify:"space-between",style:u},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:2})," ")),n.default.createElement(r.Row,{gutter:10,justify:"space-around",style:u},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:2})," ")),n.default.createElement(r.Row,{gutter:10,justify:"space-evenly",style:a(a({},u),{},{marginBottom:0})},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(c,{num:2})," ")))}}(),163:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},r=t(968);function l(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function a(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?l(Object(t),!0).forEach((function(n){o(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):l(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function o(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}var u=function(e){var t=e.num,r=e.height,l=e.width,o=e.style,u=e.background,c=void 0===u?"#2EA3F4":u;return n.default.createElement("div",{style:a(a({},o),{},{textAlign:"center",color:"#fff",paddingTop:5,paddingBottom:5,background:c,width:l,height:r})},"Col ",t)};return function(){return n.default.createElement("div",null,n.default.createElement(r.Row,{gutter:10,style:{marginBottom:10}},n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:1})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:2})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:3})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:4})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:5})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:6})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:7})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:8})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:9})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:10})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:11})," "),n.default.createElement(r.Col,{span:"2"}," ",n.default.createElement(u,{num:12})," ")),n.default.createElement(r.Row,{gutter:10,style:{marginBottom:10}},n.default.createElement(r.Col,{span:"16"}," ",n.default.createElement(u,{num:1})," "),n.default.createElement(r.Col,{span:"8"}," ",n.default.createElement(u,{num:2})," ")),n.default.createElement(r.Row,{gutter:10,style:{marginBottom:10}},n.default.createElement(r.Col,{span:"8"}," ",n.default.createElement(u,{num:1})," "),n.default.createElement(r.Col,{span:"8"}," ",n.default.createElement(u,{num:2})," "),n.default.createElement(r.Col,{span:"8"}," ",n.default.createElement(u,{num:3})," ")),n.default.createElement(r.Row,{gutter:10},n.default.createElement(r.Col,{span:"12"}," ",n.default.createElement(u,{num:1})," "),n.default.createElement(r.Col,{span:"12"}," ",n.default.createElement(u,{num:2})," ")))}}(),204:function(){var e,n=(e=t(8133))&&e.__esModule?e:{default:e},r=t(968);function l(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function a(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?l(Object(t),!0).forEach((function(n){o(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):l(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function o(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}var u=function(e){var t=e.num,r=e.style,l=e.background,o=void 0===l?"#2EA3F4":l;return n.default.createElement("div",{style:a(a({},r),{},{textAlign:"center",color:"#fff",paddingTop:5,paddingBottom:5,background:o})},"Col ",t)};return function(){return n.default.createElement("div",null,n.default.createElement(r.Row,{gutter:10,style:{marginBottom:10}},n.default.createElement(r.Col,null," ",n.default.createElement(u,{num:1})," "),n.default.createElement(r.Col,{grow:2}," ",n.default.createElement(u,{num:2})," ")),n.default.createElement(r.Row,{gutter:10},n.default.createElement(r.Col,null," ",n.default.createElement(u,{num:1})," "),n.default.createElement(r.Col,{grow:2}," ",n.default.createElement(u,{num:2})," "),n.default.createElement(r.Col,{grow:5}," ",n.default.createElement(u,{num:3})," ")))}}()},data:{18:{name:18,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar Box = function Box(_ref) {\n var num = _ref.num,\n height = _ref.height,\n width = _ref.width,\n style = _ref.style,\n background = _ref.background;\n return /*#__PURE__*/_react["default"].createElement("div", {\n style: _objectSpread(_objectSpread({}, style), {}, {\n textAlign: \'center\',\n paddingTop: 5,\n paddingBottom: 5,\n background: background,\n width: width,\n height: height\n })\n }, "Col ", num);\n};\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react["default"].createElement(_uiw.Row, null, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n fixed: true,\n style: {\n width: 150\n }\n }, " ", /*#__PURE__*/_react["default"].createElement(Box, {\n num: "1",\n background: "#A5A5A5"\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n grow: 2\n }, " ", /*#__PURE__*/_react["default"].createElement(Box, {\n num: "2",\n background: "#dedede"\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n grow: 1\n }, " ", /*#__PURE__*/_react["default"].createElement(Box, {\n num: "3",\n background: "#A5A5A5"\n }), " "));\n};\n\nreturn Demo;',language:"jsx",value:'import React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst Box = ({ num, height, width, style, background }) => <div style={{ ...style, textAlign: \'center\', paddingTop: 5, paddingBottom: 5, background, width, height}}>Col {num}</div>\nconst Demo = () => (\n <Row>\n <Col fixed style={{ width: 150 }}> <Box num="1" background="#A5A5A5" /> </Col>\n <Col grow={2}> <Box num="2" background="#dedede" /> </Col>\n <Col grow={1}> <Box num="3" background="#A5A5A5" /> </Col>\n </Row>\n);\nexport default Demo'},37:{name:37,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar Blank = function Blank(_ref) {\n var num = _ref.num,\n height = _ref.height,\n width = _ref.width,\n style = _ref.style,\n background = _ref.background;\n return /*#__PURE__*/_react["default"].createElement("div", {\n style: _objectSpread(_objectSpread({}, style), {}, {\n textAlign: \'center\',\n paddingTop: 5,\n paddingBottom: 5,\n background: background,\n width: width,\n height: height\n })\n }, "Col ", num);\n};\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, null, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n background: "#A5A5A5",\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, null, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n background: "#dedede",\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, null, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n background: "#A5A5A5",\n num: 3\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n style: {\n marginTop: 10\n }\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, null, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n background: "#A5A5A5",\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, null, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n background: "#dedede",\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, null, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n background: "#A5A5A5",\n num: 3\n }), " ")));\n};\n\nreturn Demo;',language:"jsx",value:'import React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst Blank = ({ num, height, width, style, background }) => <div style={{ ...style, textAlign: \'center\', paddingTop: 5,paddingBottom: 5, background, width, height}}>Col {num}</div>\n\nconst Demo =() =>(\n <div>\n <Row gutter={10}>\n <Col> <Blank background="#A5A5A5" num={1}/> </Col>\n <Col> <Blank background="#dedede" num={2}/> </Col>\n <Col> <Blank background="#A5A5A5" num={3}/> </Col>\n </Row>\n <Row style={{ marginTop: 10 }}>\n <Col> <Blank background="#A5A5A5" num={1}/> </Col>\n <Col> <Blank background="#dedede" num={2}/> </Col>\n <Col> <Blank background="#A5A5A5" num={3}/> </Col>\n </Row>\n </div>\n);\nexport default Demo\n'},63:{name:63,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar colStyl = {\n backgroundColor: \'rgba(230, 230, 230, 0.67)\',\n marginBottom: 10\n};\n\nvar Blank = function Blank(_ref) {\n var num = _ref.num,\n height = _ref.height,\n style = _ref.style,\n _ref$background = _ref.background,\n background = _ref$background === void 0 ? \'#2EA3F4\' : _ref$background;\n return /*#__PURE__*/_react["default"].createElement("div", {\n style: _objectSpread(_objectSpread({}, style), {}, {\n textAlign: \'center\',\n color: \'#fff\',\n paddingTop: 5,\n paddingBottom: 5,\n background: background,\n height: height\n })\n }, "Col ", num);\n};\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "center",\n align: "top",\n style: colStyl\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 35,\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 50,\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 70,\n num: 3\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "space-around",\n align: "middle",\n style: colStyl\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 35,\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 50,\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 70,\n num: 3\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "space-between",\n align: "bottom",\n style: colStyl\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 35,\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 50,\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 70,\n num: 3\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "flex-end",\n align: "bottom",\n style: colStyl\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 35,\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 50,\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 70,\n num: 3\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "center",\n align: "baseline",\n style: _objectSpread(_objectSpread({}, colStyl), {}, {\n marginBottom: 0\n })\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 85,\n style: {\n lineHeight: \'85px\'\n },\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 50,\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n height: 70,\n num: 3\n }), " ")));\n};\n\nreturn Demo;',language:"jsx",value:'import React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst colStyl = { backgroundColor: \'rgba(230, 230, 230, 0.67)\', marginBottom: 10 }\nconst Blank = ({ num, height, style, background = \'#2EA3F4\' }) => <div style={{ ...style, textAlign: \'center\', color: \'#fff\', paddingTop: 5, paddingBottom: 5, background, height}}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} justify="center" align="top" style={colStyl}>\n <Col span="2"> <Blank height={35} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n <Row gutter={10} justify="space-around" align="middle" style={colStyl}>\n <Col span="2"> <Blank height={35} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n <Row gutter={10} justify="space-between" align="bottom" style={colStyl}>\n <Col span="2"> <Blank height={35} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n <Row gutter={10} justify="flex-end" align="bottom" style={colStyl}>\n <Col span="2"> <Blank height={35} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n <Row gutter={10} justify="center" align="baseline" style={{ ...colStyl, marginBottom: 0 }}>\n <Col span="2"> <Blank height={85} style={{ lineHeight: \'85px\' }} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n </div>\n);\nexport default Demo'},103:{name:103,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar Blank = function Blank(_ref) {\n var num = _ref.num,\n style = _ref.style,\n _ref$background = _ref.background,\n background = _ref$background === void 0 ? \'#2EA3F4\' : _ref$background;\n return /*#__PURE__*/_react["default"].createElement("div", {\n style: _objectSpread(_objectSpread({}, style), {}, {\n textAlign: \'center\',\n color: \'#fff\',\n paddingTop: 5,\n paddingBottom: 5,\n background: background\n })\n }, "Col ", num);\n};\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n style: {\n height: 130\n }\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n align: "top"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n align: "middle"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n align: "bottom"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 3\n }), " ")));\n};\n\nreturn Demo;',language:"jsx",value:"import React from \"react\"\nimport { Row, Col } from 'uiw';\n\nconst Blank = ({ num, style, background = '#2EA3F4' }) => <div style={{ ...style, textAlign: 'center', color: '#fff', paddingTop: 5, paddingBottom: 5, background }}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} style={{height: 130}}>\n <Col align=\"top\"> <Blank num={1}/> </Col>\n <Col align=\"middle\"> <Blank num={2}/> </Col>\n <Col align=\"bottom\"> <Blank num={3}/> </Col>\n </Row>\n </div>\n);\nexport default Demo"},122:{name:122,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar rowStyl = {\n backgroundColor: \'rgba(230, 230, 230, 0.67)\',\n marginBottom: 10\n};\n\nvar Blank = function Blank(_ref) {\n var num = _ref.num,\n height = _ref.height,\n width = _ref.width,\n style = _ref.style,\n _ref$background = _ref.background,\n background = _ref$background === void 0 ? \'#2EA3F4\' : _ref$background;\n return /*#__PURE__*/_react["default"].createElement("div", {\n style: _objectSpread(_objectSpread({}, style), {}, {\n textAlign: \'center\',\n color: \'#fff\',\n paddingTop: 5,\n paddingBottom: 5,\n background: background,\n width: width,\n height: height\n })\n }, "Col ", num);\n};\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "flex-start",\n style: rowStyl\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "center",\n style: rowStyl\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "flex-end",\n style: rowStyl\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "space-between",\n style: rowStyl\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "space-around",\n style: rowStyl\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n justify: "space-evenly",\n style: _objectSpread(_objectSpread({}, rowStyl), {}, {\n marginBottom: 0\n })\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " ")));\n};\n\nreturn Demo;',language:"jsx",value:'import React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst rowStyl = { backgroundColor: \'rgba(230, 230, 230, 0.67)\', marginBottom: 10 }\nconst Blank = ({ num, height, width, style, background = \'#2EA3F4\' }) => <div style={{ ...style, textAlign: \'center\', color: \'#fff\', paddingTop: 5, paddingBottom: 5, background, width, height}}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} justify="flex-start" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="center" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="flex-end" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="space-between" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="space-around" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="space-evenly" style={{...rowStyl, marginBottom: 0 }}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n </div>\n);\nexport default Demo'},163:{name:163,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar Blank = function Blank(_ref) {\n var num = _ref.num,\n height = _ref.height,\n width = _ref.width,\n style = _ref.style,\n _ref$background = _ref.background,\n background = _ref$background === void 0 ? \'#2EA3F4\' : _ref$background;\n return /*#__PURE__*/_react["default"].createElement("div", {\n style: _objectSpread(_objectSpread({}, style), {}, {\n textAlign: \'center\',\n color: \'#fff\',\n paddingTop: 5,\n paddingBottom: 5,\n background: background,\n width: width,\n height: height\n })\n }, "Col ", num);\n};\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n style: {\n marginBottom: 10\n }\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 3\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 4\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 5\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 6\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 7\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 8\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 9\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 10\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 11\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "2"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 12\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n style: {\n marginBottom: 10\n }\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "16"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "8"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n style: {\n marginBottom: 10\n }\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "8"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "8"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "8"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 3\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "12"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n span: "12"\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " ")));\n};\n\nreturn Demo;',language:"jsx",value:'import React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst Blank = ({ num, height, width, style, background = \'#2EA3F4\' }) => <div style={{ ...style, textAlign: \'center\', color: \'#fff\', paddingTop: 5, paddingBottom: 5, background, width, height}}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} style={{ marginBottom: 10 }}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n <Col span="2"> <Blank num={3}/> </Col>\n <Col span="2"> <Blank num={4}/> </Col>\n <Col span="2"> <Blank num={5}/> </Col>\n <Col span="2"> <Blank num={6}/> </Col>\n <Col span="2"> <Blank num={7}/> </Col>\n <Col span="2"> <Blank num={8}/> </Col>\n <Col span="2"> <Blank num={9}/> </Col>\n <Col span="2"> <Blank num={10}/> </Col>\n <Col span="2"> <Blank num={11}/> </Col>\n <Col span="2"> <Blank num={12}/> </Col>\n </Row>\n <Row gutter={10} style={{ marginBottom: 10 }}>\n <Col span="16"> <Blank num={1}/> </Col>\n <Col span="8"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} style={{ marginBottom: 10 }}>\n <Col span="8"> <Blank num={1}/> </Col>\n <Col span="8"> <Blank num={2}/> </Col>\n <Col span="8"> <Blank num={3}/> </Col>\n </Row>\n <Row gutter={10}>\n <Col span="12"> <Blank num={1}/> </Col>\n <Col span="12"> <Blank num={2}/> </Col>\n </Row>\n </div>\n);\nexport default Demo'},204:{name:204,meta:{background:"#fff",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar Blank = function Blank(_ref) {\n var num = _ref.num,\n style = _ref.style,\n _ref$background = _ref.background,\n background = _ref$background === void 0 ? \'#2EA3F4\' : _ref$background;\n return /*#__PURE__*/_react["default"].createElement("div", {\n style: _objectSpread(_objectSpread({}, style), {}, {\n textAlign: \'center\',\n color: \'#fff\',\n paddingTop: 5,\n paddingBottom: 5,\n background: background\n })\n }, "Col ", num);\n};\n\nvar Demo = function Demo() {\n return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10,\n style: {\n marginBottom: 10\n }\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, null, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n grow: 2\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " ")), /*#__PURE__*/_react["default"].createElement(_uiw.Row, {\n gutter: 10\n }, /*#__PURE__*/_react["default"].createElement(_uiw.Col, null, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 1\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n grow: 2\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 2\n }), " "), /*#__PURE__*/_react["default"].createElement(_uiw.Col, {\n grow: 5\n }, " ", /*#__PURE__*/_react["default"].createElement(Blank, {\n num: 3\n }), " ")));\n};\n\nreturn Demo;',language:"jsx",value:"import React from \"react\"\nimport { Row, Col } from 'uiw';\n\nconst Blank = ({ num, style, background = '#2EA3F4' }) => <div style={{ ...style, textAlign: 'center', color: '#fff', paddingTop: 5, paddingBottom: 5, background }}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} style={{ marginBottom: 10 }}>\n <Col> <Blank num={1}/> </Col>\n <Col grow={2}> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10}>\n <Col> <Blank num={1}/> </Col>\n <Col grow={2}> <Blank num={2}/> </Col>\n <Col grow={5}> <Blank num={3}/> </Col>\n </Row>\n </div>\n);\nexport default Demo"}},source:'Grid \u6805\u683c\n===\n\n[![Open in unpkg](https://img.shields.io/badge/Open%20in-unpkg-blue)](https://uiwjs.github.io/npm-unpkg/#/pkg/@uiw/react-grid/file/README.md)\n[![NPM Downloads](https://img.shields.io/npm/dm/@uiw/react-grid.svg?style=flat)](https://www.npmjs.com/package/@uiw/react-grid)\n[![npm version](https://img.shields.io/npm/v/@uiw/react-grid.svg?label=@uiw/react-grid)](https://npmjs.com/@uiw/react-grid)\n\n\u57fa\u4e8e `flex` \u6805\u683c\u7cfb\u7edf\u3002\n\n```jsx\nimport { Row, Col } from \'uiw\';\n// or\nimport { Row, Col } from \'@uiw/react-grid\';\n```\n\n### \u57fa\u7840\u7528\u6cd5\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst Box = ({ num, height, width, style, background }) => <div style={{ ...style, textAlign: \'center\', paddingTop: 5, paddingBottom: 5, background, width, height}}>Col {num}</div>\nconst Demo = () => (\n <Row>\n <Col fixed style={{ width: 150 }}> <Box num="1" background="#A5A5A5" /> </Col>\n <Col grow={2}> <Box num="2" background="#dedede" /> </Col>\n <Col grow={1}> <Box num="3" background="#A5A5A5" /> </Col>\n </Row>\n);\nexport default Demo\n```\n\n### Gutter\n\n\u6805\u683c\u95f4\u9694\uff0c\u53ef\u4ee5\u5199\u6210\u50cf\u7d20\u503c\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst Blank = ({ num, height, width, style, background }) => <div style={{ ...style, textAlign: \'center\', paddingTop: 5,paddingBottom: 5, background, width, height}}>Col {num}</div>\n\nconst Demo =() =>(\n <div>\n <Row gutter={10}>\n <Col> <Blank background="#A5A5A5" num={1}/> </Col>\n <Col> <Blank background="#dedede" num={2}/> </Col>\n <Col> <Blank background="#A5A5A5" num={3}/> </Col>\n </Row>\n <Row style={{ marginTop: 10 }}>\n <Col> <Blank background="#A5A5A5" num={1}/> </Col>\n <Col> <Blank background="#dedede" num={2}/> </Col>\n <Col> <Blank background="#A5A5A5" num={3}/> </Col>\n </Row>\n </div>\n);\nexport default Demo\n\n```\n\n### Flex \u884c\u8bbe\u7f6e\u5217\u5bf9\u9f50\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst colStyl = { backgroundColor: \'rgba(230, 230, 230, 0.67)\', marginBottom: 10 }\nconst Blank = ({ num, height, style, background = \'#2EA3F4\' }) => <div style={{ ...style, textAlign: \'center\', color: \'#fff\', paddingTop: 5, paddingBottom: 5, background, height}}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} justify="center" align="top" style={colStyl}>\n <Col span="2"> <Blank height={35} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n <Row gutter={10} justify="space-around" align="middle" style={colStyl}>\n <Col span="2"> <Blank height={35} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n <Row gutter={10} justify="space-between" align="bottom" style={colStyl}>\n <Col span="2"> <Blank height={35} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n <Row gutter={10} justify="flex-end" align="bottom" style={colStyl}>\n <Col span="2"> <Blank height={35} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n <Row gutter={10} justify="center" align="baseline" style={{ ...colStyl, marginBottom: 0 }}>\n <Col span="2"> <Blank height={85} style={{ lineHeight: \'85px\' }} num={1}/> </Col>\n <Col span="2"> <Blank height={50} num={2}/> </Col>\n <Col span="2"> <Blank height={70} num={3}/> </Col>\n </Row>\n </div>\n);\nexport default Demo\n```\n\n### Flex \u5217\u5bf9\u9f50\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst Blank = ({ num, style, background = \'#2EA3F4\' }) => <div style={{ ...style, textAlign: \'center\', color: \'#fff\', paddingTop: 5, paddingBottom: 5, background }}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} style={{height: 130}}>\n <Col align="top"> <Blank num={1}/> </Col>\n <Col align="middle"> <Blank num={2}/> </Col>\n <Col align="bottom"> <Blank num={3}/> </Col>\n </Row>\n </div>\n);\nexport default Demo\n```\n\n### \u5bf9\u9f50\u5185\u5bb9\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst rowStyl = { backgroundColor: \'rgba(230, 230, 230, 0.67)\', marginBottom: 10 }\nconst Blank = ({ num, height, width, style, background = \'#2EA3F4\' }) => <div style={{ ...style, textAlign: \'center\', color: \'#fff\', paddingTop: 5, paddingBottom: 5, background, width, height}}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} justify="flex-start" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="center" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="flex-end" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="space-between" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="space-around" style={rowStyl}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} justify="space-evenly" style={{...rowStyl, marginBottom: 0 }}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n </Row>\n </div>\n);\nexport default Demo\n```\n\n### 24\u5220\u683c\n\n\u53ef\u4ee5\u901a\u8fc7\u6307\u5b9a `24` \u5217\u4e2d\u6bcf\u5217\u7684\u5bbd\u5ea6\u6765\u521b\u5efa\u57fa\u672c\u7f51\u683c\u7cfb\u7edf\u3002\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst Blank = ({ num, height, width, style, background = \'#2EA3F4\' }) => <div style={{ ...style, textAlign: \'center\', color: \'#fff\', paddingTop: 5, paddingBottom: 5, background, width, height}}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} style={{ marginBottom: 10 }}>\n <Col span="2"> <Blank num={1}/> </Col>\n <Col span="2"> <Blank num={2}/> </Col>\n <Col span="2"> <Blank num={3}/> </Col>\n <Col span="2"> <Blank num={4}/> </Col>\n <Col span="2"> <Blank num={5}/> </Col>\n <Col span="2"> <Blank num={6}/> </Col>\n <Col span="2"> <Blank num={7}/> </Col>\n <Col span="2"> <Blank num={8}/> </Col>\n <Col span="2"> <Blank num={9}/> </Col>\n <Col span="2"> <Blank num={10}/> </Col>\n <Col span="2"> <Blank num={11}/> </Col>\n <Col span="2"> <Blank num={12}/> </Col>\n </Row>\n <Row gutter={10} style={{ marginBottom: 10 }}>\n <Col span="16"> <Blank num={1}/> </Col>\n <Col span="8"> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10} style={{ marginBottom: 10 }}>\n <Col span="8"> <Blank num={1}/> </Col>\n <Col span="8"> <Blank num={2}/> </Col>\n <Col span="8"> <Blank num={3}/> </Col>\n </Row>\n <Row gutter={10}>\n <Col span="12"> <Blank num={1}/> </Col>\n <Col span="12"> <Blank num={2}/> </Col>\n </Row>\n </div>\n);\nexport default Demo\n```\n\n### \u52a8\u6001\u5217\u589e\u957f\n\n```jsx mdx:preview&background=#fff&codeSandbox=true&codePen=true\nimport React from "react"\nimport { Row, Col } from \'uiw\';\n\nconst Blank = ({ num, style, background = \'#2EA3F4\' }) => <div style={{ ...style, textAlign: \'center\', color: \'#fff\', paddingTop: 5, paddingBottom: 5, background }}>Col {num}</div>\nconst Demo = () => (\n <div>\n <Row gutter={10} style={{ marginBottom: 10 }}>\n <Col> <Blank num={1}/> </Col>\n <Col grow={2}> <Blank num={2}/> </Col>\n </Row>\n <Row gutter={10}>\n <Col> <Blank num={1}/> </Col>\n <Col grow={2}> <Blank num={2}/> </Col>\n <Col grow={5}> <Blank num={3}/> </Col>\n </Row>\n </div>\n);\nexport default Demo\n```\n\n## Row\n\n| \u53c2\u6570 | \u8bf4\u660e | \u7c7b\u578b | \u9ed8\u8ba4\u503c |\n|--------- |-------- |--------- |-------- |\n| gutter | \u6805\u683c\u95f4\u9694\u95f4\u8ddd | number | - |\n| justify | flex \u5e03\u5c40\u4e0b\u7684\u6c34\u5e73\u6392\u5217\u65b9\u5f0f | Enum{`flex-start`, `flex-end`, `center`, `space-between`, `space-around`, `space-evenly`} | - |\n| align | flex \u5e03\u5c40\u4e0b\u7684\u5782\u76f4\u5bf9\u9f50\u65b9\u5f0f | Enum{`top`, `middle`, `bottom`, `baseline`} | - |\n\n\n## Col\n\n| \u53c2\u6570 | \u8bf4\u660e | \u7c7b\u578b | \u9ed8\u8ba4\u503c |\n|--------- |-------- |--------- |-------- |\n| fixed | \u5982\u679c\u4e3a `true`\uff0c\u5219\u5217\u5bbd\u56fa\u5b9a\u4e3a\u5176\u5185\u5bb9\u7684\u5bbd\u5ea6 | boolean | - |\n| grow | \u5217\u7684\u5bbd\u5ea6\u76f8\u5bf9\u4e8e\u540c\u4e00\u7f51\u683c\u4e2d\u5176\u4ed6\u5217\u7684\u6bd4\u7387 | number | - |\n| align | \u7f51\u683c\u4e2d\u5217\u7684\u5bf9\u9f50\u65b9\u5f0f | Enum{`top`, `middle`, `bottom`, `baseline`} | - |'}}}]);
2
+ //# sourceMappingURL=9609.af1fd322.chunk.js.map