npm - @uiw/doc - Versions diffs - 5.0.0-bate-0 → 5.0.0-bate-1 - Mend

@uiw/doc 5.0.0-bate-0 → 5.0.0-bate-1

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 (328) hide show

package/web/static/js/7096.7233b97b.chunk.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";(self.webpackChunkwebsite=self.webpackChunkwebsite\|\|[]).push([[7096],{7096:function(e,t,n){n.r(t),t.default={components:{24:function(){var e,t=(e=n(8133))&&e.__esModule?e:{default:e},r=n(2814);return function(){return t.default.createElement(r.Row,{justify:"flex-start",gutter:10},t.default.createElement(r.Col,{fixed:!0},t.default.createElement(r.Menu,{bordered:!0},t.default.createElement(r.MenuItem,{icon:t.default.createElement(r.Icon,{type:"reload"}),text:"\u91cd\u65b0\u52a0\u8f7d"}),t.default.createElement(r.Menu.Divider,null),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"heart-on"}),text:"\u53e6\u5b58\u4e3a",active:!0}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"appstore"}),text:"\u5e94\u7528\u5546\u57ce"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"bar-chart"}),text:"\u6708\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"setting"}),text:"\u504f\u597d\u8bbe\u7f6e"}),t.default.createElement(r.Menu.Divider,null),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"map"}),text:"\u8c37\u6b4c\u5730\u56fe"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"map"}),text:"\u767e\u5ea6\u5730\u56fe",href:"https://map.baidu.com",target:"_blank"}))),t.default.createElement(r.Col,{fixed:!0},t.default.createElement(r.Menu,{bordered:!0},t.default.createElement(r.Menu.Divider,{title:"\u7f16\u8f91"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"file-add"}),text:"\u6dfb\u52a0\u6587\u4ef6"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"folder-add"}),text:"\u6dfb\u52a0\u6587\u4ef6\u5939"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"copy"}),text:"\u62f7\u8d1d"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"delete"}),disabled:!0,text:"\u5220\u9664"}),t.default.createElement(r.Menu.SubMenu,{icon:t.default.createElement(r.Icon,{type:"setting-o"}),text:"\u9009\u9879",collapse:!0},t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"ot-chart"}),text:"\u663e\u793a\u8fb9\u680f"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"date"}),text:"\u6dfb\u52a0\u65e5\u671f"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"tags-o"}),text:"\u6807\u7b7e\u540d\u79f0"})),t.default.createElement(r.Menu.Divider,{title:"\u5176\u5b83"}),t.default.createElement(r.Menu.SubMenu,{icon:t.default.createElement(r.Icon,{type:"bar-chart"}),text:"\u6708\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa",collapse:!0},t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"file-add"}),text:"\u6dfb\u52a0\u6587\u4ef6"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"folder-add"}),text:"\u6dfb\u52a0\u6587\u4ef6\u5939"}),t.default.createElement(r.Menu.Divider,{title:"\u7c7b\u522b"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"copy"}),text:"\u62f7\u8d1d"}),t.default.createElement(r.Menu.SubMenu,{icon:t.default.createElement(r.Icon,{type:"bar-chart"}),text:"\u62a5\u8868",collapse:!0},t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"file-add"}),text:"\u6dfb\u52a0\u6587\u4ef6"}),t.default.createElement(r.Menu.SubMenu,{icon:t.default.createElement(r.Icon,{type:"folder-add"}),text:"\u6dfb\u52a0\u6587\u4ef6\u5939"},t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"file-add"}),text:"\u6dfb\u52a0\u6587\u4ef6"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"folder-add"}),text:"\u6dfb\u52a0\u6587\u4ef6\u5939"})))),t.default.createElement(r.Menu.SubMenu,{icon:t.default.createElement(r.Icon,{type:"setting"}),disabled:!0,text:"\u504f\u597d\u8bbe\u7f6e"},t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"file-add"}),text:"\u6dfb\u52a0\u6587\u4ef6"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"folder-add"}),text:"\u6dfb\u52a0\u6587\u4ef6\u5939"})),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"map"}),text:"\u8c37\u6b4c\u5730\u56fe"}))),t.default.createElement(r.Col,{fixed:!0},t.default.createElement(r.Menu,{bordered:!0},t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"file-add"}),text:"\u6dfb\u52a0\u6587\u4ef6"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"folder-add"}),text:"\u6dfb\u52a0\u6587\u4ef6\u5939"}),t.default.createElement(r.Menu.SubMenu,{icon:t.default.createElement(r.Icon,{type:"bar-chart"}),text:"\u6708\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa",overlayProps:{isOpen:!0}},t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"file-add"}),text:"\u6dfb\u52a0\u6587\u4ef6"}),t.default.createElement(r.Menu.Divider,{title:"\u7c7b\u522b"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"copy"}),text:"\u62f7\u8d1d"}),t.default.createElement(r.Menu.SubMenu,{icon:t.default.createElement(r.Icon,{type:"bar-chart"}),text:"\u62a5\u8868",collapse:!0},t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"file-add"}),text:"\u6dfb\u52a0\u6587\u4ef6"}),t.default.createElement(r.Menu.SubMenu,{icon:t.default.createElement(r.Icon,{type:"folder-add"}),text:"\u6dfb\u52a0\u6587\u4ef6\u5939"},t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"file-add"}),text:"\u6dfb\u52a0\u6587\u4ef6"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"folder-add"}),text:"\u6dfb\u52a0\u6587\u4ef6\u5939"})))),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"map"}),text:"\u8c37\u6b4c\u5730\u56fe"}))))}}(),106:function(){var e,t,r,o=(e=n(8133))&&e.__esModule?e:{default:e},a=n(2814);function u(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function c(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?u(Object(n),!0).forEach((function(t){l(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):u(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function l(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}var i={position:"relative",width:70},d=o.default.createElement(a.Menu,null,o.default.createElement(a.Menu.Divider,{title:"\u7f16\u8f91"}),o.default.createElement(a.Menu.Item,(l(t={icon:o.default.createElement(a.Icon,{type:"file-add"})},"icon","file-add"),l(t,"text","\u6dfb\u52a0\u6587\u4ef6"),t)),o.default.createElement(a.Menu.Item,(l(r={icon:o.default.createElement(a.Icon,{type:"folder-add"})},"icon","folder-add"),l(r,"text","\u6dfb\u52a0\u6587\u4ef6\u5939"),r)),o.default.createElement(a.Menu.Item,{icon:o.default.createElement(a.Icon,{type:"copy"}),text:"\u62f7\u8d1d"}),o.default.createElement(a.Menu.Item,{icon:o.default.createElement(a.Icon,{type:"delete"}),disabled:!0,text:"\u5220\u9664"}),o.default.createElement(a.Menu.Divider,{title:"\u5176\u5b83"}),o.default.createElement(a.Menu.Item,{icon:o.default.createElement(a.Icon,{type:"bar-chart"}),text:"\u6708\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa"}),o.default.createElement(a.Menu.Item,{icon:o.default.createElement(a.Icon,{type:"setting"}),disabled:!0,text:"\u504f\u597d\u8bbe\u7f6e"}),o.default.createElement(a.Menu.Item,{icon:o.default.createElement(a.Icon,{type:"map"}),text:"\u8c37\u6b4c\u5730\u56fe"}));return function(){return o.default.createElement("div",null,o.default.createElement("div",{style:{position:"relative"}},o.default.createElement(a.Popover,{trigger:"click",placement:"topLeft",content:d},o.default.createElement(a.Button,{style:c(c({},i),{},{left:70})},"TL")),o.default.createElement(a.Popover,{trigger:"click",placement:"top",content:d},o.default.createElement(a.Button,{style:c(c({},i),{},{left:70})},"Top")),o.default.createElement(a.Popover,{trigger:"click",placement:"topRight",content:d},o.default.createElement(a.Button,{style:c(c({},i),{},{left:70})},"TR"))),o.default.createElement("div",{style:{position:"relative",paddingTop:10}},o.default.createElement(a.Popover,{trigger:"click",placement:"leftTop",content:d},o.default.createElement(a.Button,{style:c({},i)},"LT")),o.default.createElement(a.Popover,{trigger:"click",placement:"rightTop",content:d},o.default.createElement(a.Button,{style:c(c({},i),{},{left:216})},"RT"))),o.default.createElement("div",{style:{position:"relative",paddingTop:10}},o.default.createElement(a.Popover,{trigger:"click",placement:"left",content:d},o.default.createElement(a.Button,{style:c({},i)},"Left")),o.default.createElement(a.Popover,{trigger:"click",placement:"right",content:d},o.default.createElement(a.Button,{style:c(c({},i),{},{left:216})},"Right"))),o.default.createElement("div",{style:{position:"relative",paddingTop:10}},o.default.createElement(a.Popover,{trigger:"click",placement:"leftBottom",content:d},o.default.createElement(a.Button,{style:c({},i)},"LB")),o.default.createElement(a.Popover,{trigger:"click",placement:"rightBottom",content:d},o.default.createElement(a.Button,{style:c(c({},i),{},{left:216})},"RB"))),o.default.createElement("div",{style:{position:"relative",paddingTop:10}},o.default.createElement(a.Popover,{trigger:"click",placement:"bottomLeft",content:d},o.default.createElement(a.Button,{style:c(c({},i),{},{left:70})},"BL")),o.default.createElement(a.Popover,{trigger:"click",placement:"bottom",content:d},o.default.createElement(a.Button,{style:c(c({},i),{},{left:70})},"Bottom")),o.default.createElement(a.Popover,{trigger:"click",placement:"bottomRight",content:d},o.default.createElement(a.Button,{style:c(c({},i),{},{left:70})},"BR"))))}}(),191:function(){var e,t=(e=n(8133))&&e.__esModule?e:{default:e},r=n(2814);return function(){return t.default.createElement(r.Row,{justify:"flex-start",gutter:10},t.default.createElement(r.Col,{fixed:!0},t.default.createElement(r.Menu,{bordered:!0,style:{maxWidth:200}},t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"delete"}),disabled:!0,text:"\u5220\u9664"}),t.default.createElement(r.Menu.SubMenu,{icon:t.default.createElement(r.Icon,{type:"setting-o"}),text:"\u9009\u9879",disabled:!0,collapse:!0},t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"dot-chart"}),text:"\u663e\u793a\u8fb9\u680f"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"date"}),text:"\u6dfb\u52a0\u65e5\u671f"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"tags-o"}),text:"\u6807\u7b7e\u540d\u79f0"})),t.default.createElement(r.Menu.Divider,{title:"\u5176\u5b83"}),t.default.createElement(r.Menu.SubMenu,{icon:t.default.createElement(r.Icon,{type:"bar-chart"}),text:"\u6bcf\u5e742019\u5e74\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa",collapse:!0},t.default.createElement(r.Menu.Item,{text:"\u6dfb\u52a0\u6587\u4ef6"}),t.default.createElement(r.Menu.Item,{text:"\u6dfb\u52a0\u6587\u4ef6\u5939"}),t.default.createElement(r.Menu.Divider,{title:"\u7c7b\u522b"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"copy"}),text:"\u62f7\u8d1d"}),t.default.createElement(r.Menu.SubMenu,{icon:t.default.createElement(r.Icon,{type:"folder-add"}),text:"\u6dfb\u52a0\u6587\u4ef6\u5939",collapse:!0},t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"file-add"}),text:"\u6dfb\u52a0\u6587\u4ef6"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"folder-add"}),text:"\u6dfb\u52a0\u6587\u4ef6\u5939"}))),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"setting"}),disabled:!0,text:"\u504f\u597d\u8bbe\u7f6e"}),t.default.createElement(r.Menu.Item,{icon:t.default.createElement(r.Icon,{type:"map"}),text:"\u8c37\u6b4c\u5730\u56fe"}))))}}(),231:function(){function e(t){return e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},e(t)}var t,r=(t=n(8133))&&t.__esModule?t:{default:t},o=n(2814);function a(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function u(e,t){if(n=e,!(null!=(r=t)&&"undefined"!==typeof Symbol&&r[Symbol.hasInstance]?r[Symbol.hasInstance](n):n instanceof r))throw new TypeError("Cannot call a class as a function");var n,r}function c(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable\|\|!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function l(e,t){return l=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},l(e,t)}function i(e){var t=function(){if("undefined"===typeof Reflect\|\|!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"===typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var n,r=_(e);if(t){var o=_(this).constructor;n=Reflect.construct(r,arguments,o)}else n=r.apply(this,arguments);return d(this,n)}}function d(t,n){if(n&&("object"===e(n)\|\|"function"===typeof n))return n;if(void 0!==n)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(t)}function _(e){return _=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__\|\|Object.getPrototypeOf(e)},_(e)}return function(e){!function(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&l(e,t)}(m,e);var t,n,d,_=i(m);function m(e){var t;return u(this,m),(t=_.call(this,e)).state={theme:"dark"},t}return t=m,(n=[{key:"render",value:function(){var e,t=this;return r.default.createElement("div",null,r.default.createElement(o.Row,{justify:"flex-start",gutter:10},r.default.createElement(o.Col,{style:{paddingBottom:5}},r.default.createElement(o.Switch,{checked:!0,style:{marginRight:10},onChange:function(e){t.setState({theme:e.target.checked?"dark":"light"})}}))),r.default.createElement(o.Row,{justify:"flex-start",gutter:10},r.default.createElement(o.Col,{fixed:!0},r.default.createElement(o.Menu,{theme:this.state.theme,bordered:!0,style:{maxWidth:200}},r.default.createElement(o.Menu.Item,{icon:r.default.createElement(o.Icon,{type:"delete"}),disabled:!0,text:"\u5220\u9664"}),r.default.createElement(o.Menu.SubMenu,{icon:r.default.createElement(o.Icon,{type:"setting-o"}),text:"\u9009\u9879",disabled:!0,collapse:!0},r.default.createElement(o.Menu.Item,{icon:r.default.createElement(o.Icon,{type:"dot-chart"}),text:"\u663e\u793a\u8fb9\u680f"}),r.default.createElement(o.Menu.Item,{icon:r.default.createElement(o.Icon,{type:"date"}),text:"\u6dfb\u52a0\u65e5\u671f"}),r.default.createElement(o.Menu.Item,{icon:r.default.createElement(o.Icon,{type:"tags-o"}),text:"\u6807\u7b7e\u540d\u79f0"})),r.default.createElement(o.Menu.Divider,{title:"\u5176\u5b83"}),r.default.createElement(o.Menu.Item,{active:!0,icon:"map",text:"\u8c37\u6b4c\u5730\u56fe"}),r.default.createElement(o.Menu.SubMenu,{icon:r.default.createElement(o.Icon,{type:"bar-chart"}),text:"\u6bcf\u5e742019\u5e74\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa"},r.default.createElement(o.Menu.Item,{text:"\u6dfb\u52a0\u6587\u4ef6"}),r.default.createElement(o.Menu.Item,{text:"\u6dfb\u52a0\u6587\u4ef6\u5939"}),r.default.createElement(o.Menu.Divider,{title:"\u7c7b\u522b"}),r.default.createElement(o.Menu.SubMenu,{icon:r.default.createElement(o.Icon,{type:"folder-add"}),text:"\u6dfb\u52a0\u6587\u4ef6\u5939",collapse:!0},r.default.createElement(o.Menu.Item,{icon:r.default.createElement(o.Icon,{type:"file-add"}),text:"\u6dfb\u52a0\u6587\u4ef6"}),r.default.createElement(o.Menu.Item,{icon:r.default.createElement(o.Icon,{type:"folder-add"}),text:"\u6dfb\u52a0\u6587\u4ef6\u5939"})),r.default.createElement(o.Menu.Item,(a(e={icon:r.default.createElement(o.Icon,{type:"copy"})},"icon","copy"),a(e,"text","\u62f7\u8d1d"),e))),r.default.createElement(o.Menu.Item,{icon:"setting",disabled:!0,text:"\u504f\u597d\u8bbe\u7f6e"}),r.default.createElement(o.Menu.SubMenu,{icon:r.default.createElement(o.Icon,{type:"setting-o"}),text:"\u9009\u9879",collapse:!0},r.default.createElement(o.Menu.Item,{icon:r.default.createElement(o.Icon,{type:"dot-chart"}),text:"\u663e\u793a\u8fb9\u680f"}),r.default.createElement(o.Menu.Item,{icon:r.default.createElement(o.Icon,{type:"date"}),text:"\u6dfb\u52a0\u65e5\u671f"}),r.default.createElement(o.Menu.Item,{icon:r.default.createElement(o.Icon,{type:"tags-o"}),text:"\u6807\u7b7e\u540d\u79f0"}))))))}}])&&c(t.prototype,n),d&&c(t,d),Object.defineProperty(t,"prototype",{writable:!1}),m}(r.default.Component)}(),298:function(){function e(t){return e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},e(t)}var t,r=(t=n(8133))&&t.__esModule?t:{default:t},o=n(2814);function a(e,t){if(n=e,!(null!=(r=t)&&"undefined"!==typeof Symbol&&r[Symbol.hasInstance]?r[Symbol.hasInstance](n):n instanceof r))throw new TypeError("Cannot call a class as a function");var n,r}function u(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable\|\|!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function c(e,t){return c=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},c(e,t)}function l(e){var t=function(){if("undefined"===typeof Reflect\|\|!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"===typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var n,r=d(e);if(t){var o=d(this).constructor;n=Reflect.construct(r,arguments,o)}else n=r.apply(this,arguments);return i(this,n)}}function i(t,n){if(n&&("object"===e(n)\|\|"function"===typeof n))return n;if(void 0!==n)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(t)}function d(e){return d=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__\|\|Object.getPrototypeOf(e)},d(e)}return function(e){!function(e,t){if("function"!==typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&c(e,t)}(_,e);var t,n,i,d=l(_);function _(e){var t;return a(this,_),(t=d.call(this,e)).state={theme:"light",menus:[{key:"1",icon:"delete",label:"\u5220\u9664"},{icon:"setting-o",label:"\u9009\u9879",childrend:[{key:"1-1",icon:"dot-chart",label:"\u663e\u793a\u8fb9\u680f"},{key:"1-2",icon:"date",disabled:!0,label:"\u6dfb\u52a0\u65e5\u671f"},{key:"1-3",icon:"tags-o",label:"\u6807\u7b7e\u540d\u79f0"}]},{divider:!0},{key:"2",icon:"map",label:"\u8c37\u6b4c\u5730\u56fe"},{icon:"bar-chart",label:"\u6bcf\u5e742019\u5e74\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa",childrend:[{key:"2-1",label:"\u7edf\u8ba1\u6dfb\u52a0\u6587\u4ef6"},{key:"2-2",label:"\u7edf\u8ba1\u6dfb\u52a0\u6587\u4ef6\u5939"},{key:"2-3",icon:"tags-o",label:"\u7c7b\u522b",divider:!0},{icon:"folder-add",label:"\u6dfb\u52a0\u6587\u4ef6\u5939",childrend:[{key:"2-3-1",label:"\u6dfb\u52a0\u6587\u4ef6\u5939"},{key:"2-3-2",label:"\u6dfb\u52a0\u6587\u4ef6"},{key:"2-3-3",label:"\u6dfb\u52a0\u6587\u4ef6\u5939"}]}]}],active:"1"},t}return t=_,(n=[{key:"onClickItem",value:function(e){this.setState({active:e})}},{key:"renderMenu",value:function(e,t){var n=this,a=this.state.active,u=[];return e.forEach((function(e,c){e.childrend?u.push(r.default.createElement(o.Menu.SubMenu,{key:c,icon:r.default.createElement(o.Icon,{type:e.icon}),text:e.label,collapse:!0},n.renderMenu(e.childrend,"".concat(t).concat(c)))):e.divider?u.push(r.default.createElement(o.Menu.Divider,{key:"".concat(t).concat(c),title:e.label})):u.push(r.default.createElement(o.Menu.Item,{onClick:n.onClickItem.bind(n,e.key),active:a===e.key,key:"".concat(t).concat(c),icon:r.default.createElement(o.Icon,{type:e.icon}),text:e.label}))})),u}},{key:"render",value:function(){var e=this;return r.default.createElement("div",null,r.default.createElement(o.Row,{justify:"flex-start",gutter:10},r.default.createElement(o.Col,{style:{paddingBottom:5}},r.default.createElement(o.Switch,{checked:"dark"===this.state.theme,style:{marginRight:10},onChange:function(t){e.setState({theme:t.target.checked?"dark":"light"})}}))),r.default.createElement(o.Row,{justify:"flex-start",gutter:10},r.default.createElement(o.Col,{fixed:!0},r.default.createElement(o.Menu,{inlineIndent:13,theme:this.state.theme,bordered:!0,style:{maxWidth:200}},this.renderMenu(this.state.menus,"k")))))}}])&&u(t.prototype,n),i&&u(t,i),Object.defineProperty(t,"prototype",{writable:!1}),_}(r.default.Component)}(),409:function(){var e,t=(e=n(8133))&&e.__esModule?e:{default:e},r=n(2814);function o(e,t){return function(e){if(Array.isArray(e))return e}(e)\|\|function(e,t){var n=null==e?null:"undefined"!==typeof Symbol&&e[Symbol.iterator]\|\|e["@@iterator"];if(null==n)return;var r,o,a=[],u=!0,c=!1;try{for(n=n.call(e);!(u=(r=n.next()).done)&&(a.push(r.value),!t\|\|a.length!==t);u=!0);}catch(l){c=!0,o=l}finally{try{u\|\|null==n.return\|\|n.return()}finally{if(c)throw o}}return a}(e,t)\|\|function(e,t){if(!e)return;if("string"===typeof e)return a(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n\|\|"Set"===n)return Array.from(e);if("Arguments"===n\|\|/^(?:Ui\|I)nt(?:8\|16\|32)(?:Clamped)?Array$/.test(n))return a(e,t)}(e,t)\|\|function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function a(e,t){(null==t\|\|t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var u=[{key:"1",icon:"delete",label:"\u5220\u9664"},{icon:"setting-o",label:"\u9009\u9879",childrend:[{key:"1-1",icon:"dot-chart",label:"\u663e\u793a\u8fb9\u680f"},{key:"1-2",icon:"date",disabled:!0,label:"\u6dfb\u52a0\u65e5\u671f"},{key:"1-3",icon:"tags-o",label:"\u6807\u7b7e\u540d\u79f0"}]},{key:"2",icon:"map",label:"\u8c37\u6b4c\u5730\u56fe"},{icon:"bar-chart",label:"\u6bcf\u5e742019\u5e74\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa",childrend:[{key:"2-1",label:"\u7edf\u8ba1\u6dfb\u52a0\u6587\u4ef6"},{key:"2-2",label:"\u7edf\u8ba1\u6dfb\u52a0\u6587\u4ef6\u5939"},{key:"2-3",icon:"tags-o",label:"\u7c7b\u522b",divider:!0},{icon:"folder-add",label:"\u6dfb\u52a0\u6587\u4ef6\u5939",childrend:[{key:"2-3-1",label:"\u6dfb\u52a0\u6587\u4ef6\u5939"},{key:"2-3-2",label:"\u6dfb\u52a0\u6587\u4ef6"},{key:"2-3-3",label:"\u6dfb\u52a0\u6587\u4ef6\u5939"}]}]}];return function(){var e=o(t.default.useState("dark"),2),n=e[0],a=e[1],c=o(t.default.useState(!1),2),l=c[0],i=c[1],d=t.default.useRef();function _(){console.log(";;;;>>>")}return t.default.createElement("div",{style:{maxWidth:200}},t.default.createElement(r.Button,{type:"primary",size:"small",onClick:function(){return i(!l)},style:{marginBottom:10}},t.default.createElement(r.Icon,{type:l?"menu-fold":"menu-unfold"})),t.default.createElement(r.Switch,{size:"large","data-checked":"light","data-unchecked":"dark",checked:"dark"===n,style:{marginLeft:10,marginBottom:10,display:"inline-block"},onChange:function(e){return a(e.target.checked?"dark":"light")}}),t.default.createElement(r.Menu,{theme:n,ref:d,inlineCollapsed:l,inlineIndent:13,bordered:!0},function e(n){var o=this,a=[];return n.forEach((function(n,u){n.childrend?a.push(t.default.createElement(r.Menu.SubMenu,{key:u,icon:t.default.createElement(r.Icon,{type:n.icon}),text:n.label,collapse:l},e(n.childrend))):n.divider?a.push(t.default.createElement(r.Menu.Divider,{key:u,title:n.label})):a.push(t.default.createElement(r.Menu.Item,{onClick:_.bind(o,n.key),key:u,icon:t.default.createElement(r.Icon,{type:n.icon}),text:n.label}))})),a}(u)))}}()},data:{24:{name:24,meta:{background:"#fff",noScroll:"true",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\nvar Demo = function Demo() {\n return /#__PURE__/_react["default"].createElement(_uiw.Row, {\n justify: "flex-start",\n gutter: 10\n }, /#__PURE__/_react["default"].createElement(_uiw.Col, {\n fixed: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu, {\n bordered: true\n }, /#__PURE__/_react["default"].createElement(_uiw.MenuItem, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "reload"\n }),\n text: "\\u91CD\\u65B0\\u52A0\\u8F7D"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Divider, null), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "heart-on"\n }),\n text: "\\u53E6\\u5B58\\u4E3A",\n active: true\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "appstore"\n }),\n text: "\\u5E94\\u7528\\u5546\\u57CE"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "bar-chart"\n }),\n text: "\\u6708\\u7EDF\\u8BA1\\u62A5\\u8868\\u5BFC\\u51FA"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "setting"\n }),\n text: "\\u504F\\u597D\\u8BBE\\u7F6E"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Divider, null), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "map"\n }),\n text: "\\u8C37\\u6B4C\\u5730\\u56FE"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "map"\n }),\n text: "\\u767E\\u5EA6\\u5730\\u56FE",\n href: "https://map.baidu.com",\n target: "_blank"\n }))), /#__PURE__/_react["default"].createElement(_uiw.Col, {\n fixed: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu, {\n bordered: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu.Divider, {\n title: "\\u7F16\\u8F91"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "file-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "folder-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6\\u5939"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "copy"\n }),\n text: "\\u62F7\\u8D1D"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "delete"\n }),\n disabled: true,\n text: "\\u5220\\u9664"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.SubMenu, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "setting-o"\n }),\n text: "\\u9009\\u9879",\n collapse: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "ot-chart"\n }),\n text: "\\u663E\\u793A\\u8FB9\\u680F"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "date"\n }),\n text: "\\u6DFB\\u52A0\\u65E5\\u671F"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "tags-o"\n }),\n text: "\\u6807\\u7B7E\\u540D\\u79F0"\n })), /#__PURE__/_react["default"].createElement(_uiw.Menu.Divider, {\n title: "\\u5176\\u5B83"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.SubMenu, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "bar-chart"\n }),\n text: "\\u6708\\u7EDF\\u8BA1\\u62A5\\u8868\\u5BFC\\u51FA",\n collapse: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "file-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "folder-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6\\u5939"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Divider, {\n title: "\\u7C7B\\u522B"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "copy"\n }),\n text: "\\u62F7\\u8D1D"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.SubMenu, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "bar-chart"\n }),\n text: "\\u62A5\\u8868",\n collapse: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "file-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.SubMenu, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "folder-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6\\u5939"\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "file-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "folder-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6\\u5939"\n })))), /#__PURE__/_react["default"].createElement(_uiw.Menu.SubMenu, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "setting"\n }),\n disabled: true,\n text: "\\u504F\\u597D\\u8BBE\\u7F6E"\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "file-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "folder-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6\\u5939"\n })), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "map"\n }),\n text: "\\u8C37\\u6B4C\\u5730\\u56FE"\n }))), /#__PURE__/_react["default"].createElement(_uiw.Col, {\n fixed: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu, {\n bordered: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "file-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "folder-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6\\u5939"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.SubMenu, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "bar-chart"\n }),\n text: "\\u6708\\u7EDF\\u8BA1\\u62A5\\u8868\\u5BFC\\u51FA",\n overlayProps: {\n isOpen: true\n }\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "file-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Divider, {\n title: "\\u7C7B\\u522B"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "copy"\n }),\n text: "\\u62F7\\u8D1D"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.SubMenu, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "bar-chart"\n }),\n text: "\\u62A5\\u8868",\n collapse: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "file-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.SubMenu, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "folder-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6\\u5939"\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "file-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "folder-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6\\u5939"\n })))), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "map"\n }),\n text: "\\u8C37\\u6B4C\\u5730\\u56FE"\n }))));\n};\n\nreturn Demo;',language:"jsx",value:'import React from \'react\';\nimport { Menu, MenuItem, Row, Col ,Icon} from \'uiw\';\n\nconst Demo = () => (\n <Row justify="flex-start" gutter={10}>\n <Col fixed>\n <Menu bordered>\n <MenuItem icon={<Icon type="reload" />} text="\u91cd\u65b0\u52a0\u8f7d" />\n <Menu.Divider />\n <Menu.Item icon={<Icon type="heart-on" />} text="\u53e6\u5b58\u4e3a" active />\n <Menu.Item icon={<Icon type="appstore" />} text="\u5e94\u7528\u5546\u57ce" />\n <Menu.Item icon={<Icon type="bar-chart" />} text="\u6708\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa" />\n <Menu.Item icon={<Icon type="setting" />} text="\u504f\u597d\u8bbe\u7f6e" />\n <Menu.Divider />\n <Menu.Item icon={<Icon type="map" />} text="\u8c37\u6b4c\u5730\u56fe" />\n <Menu.Item icon={<Icon type="map" />} text="\u767e\u5ea6\u5730\u56fe" href="https://map.baidu.com" target="_blank" />\n </Menu>\n </Col>\n <Col fixed>\n <Menu bordered>\n <Menu.Divider title="\u7f16\u8f91" />\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n <Menu.Item icon={<Icon type="copy" />} text="\u62f7\u8d1d" />\n <Menu.Item icon={<Icon type="delete" />} disabled text="\u5220\u9664" />\n <Menu.SubMenu icon={<Icon type="setting-o" />} text="\u9009\u9879" collapse>\n <Menu.Item icon={<Icon type="ot-chart" />} text="\u663e\u793a\u8fb9\u680f" />\n <Menu.Item icon={<Icon type="date" />} text="\u6dfb\u52a0\u65e5\u671f" />\n <Menu.Item icon={<Icon type="tags-o" />} text="\u6807\u7b7e\u540d\u79f0" />\n </Menu.SubMenu>\n <Menu.Divider title="\u5176\u5b83" />\n <Menu.SubMenu icon={<Icon type="bar-chart" />} text="\u6708\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa" collapse>\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n <Menu.Divider title="\u7c7b\u522b" />\n <Menu.Item icon={<Icon type="copy" />} text="\u62f7\u8d1d" />\n <Menu.SubMenu icon={<Icon type="bar-chart" />} text="\u62a5\u8868" collapse>\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.SubMenu icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939">\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n </Menu.SubMenu>\n </Menu.SubMenu>\n </Menu.SubMenu>\n <Menu.SubMenu icon={<Icon type="setting" />} disabled text="\u504f\u597d\u8bbe\u7f6e">\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n </Menu.SubMenu>\n <Menu.Item icon={<Icon type="map" />} text="\u8c37\u6b4c\u5730\u56fe" />\n </Menu>\n </Col>\n <Col fixed>\n <Menu bordered>\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n <Menu.SubMenu icon={<Icon type="bar-chart" />} text="\u6708\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa"\n overlayProps={{\n isOpen: true\n }}\n >\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Divider title="\u7c7b\u522b" />\n <Menu.Item icon={<Icon type="copy" />} text="\u62f7\u8d1d" />\n <Menu.SubMenu icon={<Icon type="bar-chart" />} text="\u62a5\u8868" collapse>\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.SubMenu icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939">\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n </Menu.SubMenu>\n </Menu.SubMenu>\n </Menu.SubMenu>\n <Menu.Item icon={<Icon type="map" />} text="\u8c37\u6b4c\u5730\u56fe" />\n </Menu>\n </Col>\n </Row>\n)\nexport default Demo'},106:{name:106,meta:{background:"#fff",noScroll:"true",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nvar _React$createElement, _React$createElement2;\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 btnStl = {\n position: \'relative\',\n width: 70\n};\n\nvar content = /#__PURE__/_react["default"].createElement(_uiw.Menu, null, /#__PURE__/_react["default"].createElement(_uiw.Menu.Divider, {\n title: "\\u7F16\\u8F91"\n}), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, (_React$createElement = {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "file-add"\n })\n}, _defineProperty(_React$createElement, "icon", "file-add"), _defineProperty(_React$createElement, "text", "\\u6DFB\\u52A0\\u6587\\u4EF6"), _React$createElement)), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, (_React$createElement2 = {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "folder-add"\n })\n}, _defineProperty(_React$createElement2, "icon", "folder-add"), _defineProperty(_React$createElement2, "text", "\\u6DFB\\u52A0\\u6587\\u4EF6\\u5939"), _React$createElement2)), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "copy"\n }),\n text: "\\u62F7\\u8D1D"\n}), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "delete"\n }),\n disabled: true,\n text: "\\u5220\\u9664"\n}), /#__PURE__/_react["default"].createElement(_uiw.Menu.Divider, {\n title: "\\u5176\\u5B83"\n}), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "bar-chart"\n }),\n text: "\\u6708\\u7EDF\\u8BA1\\u62A5\\u8868\\u5BFC\\u51FA"\n}), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "setting"\n }),\n disabled: true,\n text: "\\u504F\\u597D\\u8BBE\\u7F6E"\n}), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "map"\n }),\n text: "\\u8C37\\u6B4C\\u5730\\u56FE"\n}));\n\nvar Demo = function Demo() {\n return /#__PURE__/_react["default"].createElement("div", null, /#__PURE__/_react["default"].createElement("div", {\n style: {\n position: \'relative\'\n }\n }, /#__PURE__/_react["default"].createElement(_uiw.Popover, {\n trigger: "click",\n placement: "topLeft",\n content: content\n }, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n style: _objectSpread(_objectSpread({}, btnStl), {}, {\n left: 70\n })\n }, "TL")), /#__PURE__/_react["default"].createElement(_uiw.Popover, {\n trigger: "click",\n placement: "top",\n content: content\n }, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n style: _objectSpread(_objectSpread({}, btnStl), {}, {\n left: 70\n })\n }, "Top")), /#__PURE__/_react["default"].createElement(_uiw.Popover, {\n trigger: "click",\n placement: "topRight",\n content: content\n }, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n style: _objectSpread(_objectSpread({}, btnStl), {}, {\n left: 70\n })\n }, "TR"))), /#__PURE__/_react["default"].createElement("div", {\n style: {\n position: \'relative\',\n paddingTop: 10\n }\n }, /#__PURE__/_react["default"].createElement(_uiw.Popover, {\n trigger: "click",\n placement: "leftTop",\n content: content\n }, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n style: _objectSpread({}, btnStl)\n }, "LT")), /#__PURE__/_react["default"].createElement(_uiw.Popover, {\n trigger: "click",\n placement: "rightTop",\n content: content\n }, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n style: _objectSpread(_objectSpread({}, btnStl), {}, {\n left: 216\n })\n }, "RT"))), /#__PURE__/_react["default"].createElement("div", {\n style: {\n position: \'relative\',\n paddingTop: 10\n }\n }, /#__PURE__/_react["default"].createElement(_uiw.Popover, {\n trigger: "click",\n placement: "left",\n content: content\n }, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n style: _objectSpread({}, btnStl)\n }, "Left")), /#__PURE__/_react["default"].createElement(_uiw.Popover, {\n trigger: "click",\n placement: "right",\n content: content\n }, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n style: _objectSpread(_objectSpread({}, btnStl), {}, {\n left: 216\n })\n }, "Right"))), /#__PURE__/_react["default"].createElement("div", {\n style: {\n position: \'relative\',\n paddingTop: 10\n }\n }, /#__PURE__/_react["default"].createElement(_uiw.Popover, {\n trigger: "click",\n placement: "leftBottom",\n content: content\n }, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n style: _objectSpread({}, btnStl)\n }, "LB")), /#__PURE__/_react["default"].createElement(_uiw.Popover, {\n trigger: "click",\n placement: "rightBottom",\n content: content\n }, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n style: _objectSpread(_objectSpread({}, btnStl), {}, {\n left: 216\n })\n }, "RB"))), /#__PURE__/_react["default"].createElement("div", {\n style: {\n position: \'relative\',\n paddingTop: 10\n }\n }, /#__PURE__/_react["default"].createElement(_uiw.Popover, {\n trigger: "click",\n placement: "bottomLeft",\n content: content\n }, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n style: _objectSpread(_objectSpread({}, btnStl), {}, {\n left: 70\n })\n }, "BL")), /#__PURE__/_react["default"].createElement(_uiw.Popover, {\n trigger: "click",\n placement: "bottom",\n content: content\n }, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n style: _objectSpread(_objectSpread({}, btnStl), {}, {\n left: 70\n })\n }, "Bottom")), /#__PURE__/_react["default"].createElement(_uiw.Popover, {\n trigger: "click",\n placement: "bottomRight",\n content: content\n }, /#__PURE__/_react["default"].createElement(_uiw.Button, {\n style: _objectSpread(_objectSpread({}, btnStl), {}, {\n left: 70\n })\n }, "BR"))));\n};\n\nreturn Demo;',language:"jsx",value:'import React from \'react\';\nimport { Menu, Popover, Button, Row, Col ,Icon} from \'uiw\';\n\nconst btnStl = {position: \'relative\', width: 70 }\nconst content = (\n <Menu>\n <Menu.Divider title="\u7f16\u8f91" />\n <Menu.Item icon={<Icon type="file-add" />} icon="file-add" text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item icon={<Icon type="folder-add" />} icon="folder-add" text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n <Menu.Item icon={<Icon type="copy" />} text="\u62f7\u8d1d" />\n <Menu.Item icon={<Icon type="delete" />} disabled text="\u5220\u9664" />\n <Menu.Divider title="\u5176\u5b83" />\n <Menu.Item icon={<Icon type="bar-chart" />} text="\u6708\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa" />\n <Menu.Item icon={<Icon type="setting" />} disabled text="\u504f\u597d\u8bbe\u7f6e" />\n <Menu.Item icon={<Icon type="map" />} text="\u8c37\u6b4c\u5730\u56fe" />\n </Menu>\n)\nconst Demo = () => (\n <div>\n <div style={{ position: \'relative\' }}>\n\n <Popover trigger="click" placement="topLeft" content={content}>\n <Button style={{ ...btnStl, left: 70 }}>TL</Button>\n </Popover>\n <Popover trigger="click" placement="top" content={content}>\n <Button style={{ ...btnStl, left: 70}}>Top</Button>\n </Popover>\n <Popover trigger="click" placement="topRight" content={content}>\n <Button style={{ ...btnStl, left: 70 }}>TR</Button>\n </Popover>\n\n </div>\n <div style={{ position: \'relative\', paddingTop: 10 }}>\n\n <Popover trigger="click" placement="leftTop" content={content}>\n <Button style={{ ...btnStl }}>LT</Button>\n </Popover>\n <Popover trigger="click" placement="rightTop" content={content}>\n <Button style={{ ...btnStl, left: 216 }}>RT</Button>\n </Popover>\n\n </div>\n <div style={{ position: \'relative\', paddingTop: 10 }}>\n\n <Popover trigger="click" placement="left" content={content}>\n <Button style={{ ...btnStl }}>Left</Button>\n </Popover>\n <Popover trigger="click" placement="right" content={content}>\n <Button style={{ ...btnStl, left: 216 }}>Right</Button>\n </Popover>\n\n </div>\n <div style={{ position: \'relative\', paddingTop: 10 }}>\n\n <Popover trigger="click" placement="leftBottom" content={content}>\n <Button style={{ ...btnStl }}>LB</Button>\n </Popover>\n <Popover trigger="click" placement="rightBottom" content={content}>\n <Button style={{ ...btnStl, left: 216 }}>RB</Button>\n </Popover>\n\n </div>\n <div style={{ position: \'relative\', paddingTop: 10 }}>\n\n <Popover trigger="click" placement="bottomLeft" content={content}>\n <Button style={{ ...btnStl, left: 70 }}>BL</Button>\n </Popover>\n <Popover trigger="click" placement="bottom" content={content}>\n <Button style={{ ...btnStl, left: 70 }}>Bottom</Button>\n </Popover>\n <Popover trigger="click" placement="bottomRight" content={content}>\n <Button style={{ ...btnStl, left: 70 }}>BR</Button>\n </Popover>\n\n </div>\n </div>\n)\nexport default Demo'},191:{name:191,meta:{background:"#fff",noScroll:"true",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\nvar Demo = function Demo() {\n return /#__PURE__/_react["default"].createElement(_uiw.Row, {\n justify: "flex-start",\n gutter: 10\n }, /#__PURE__/_react["default"].createElement(_uiw.Col, {\n fixed: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu, {\n bordered: true,\n style: {\n maxWidth: 200\n }\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "delete"\n }),\n disabled: true,\n text: "\\u5220\\u9664"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.SubMenu, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "setting-o"\n }),\n text: "\\u9009\\u9879",\n disabled: true,\n collapse: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "dot-chart"\n }),\n text: "\\u663E\\u793A\\u8FB9\\u680F"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "date"\n }),\n text: "\\u6DFB\\u52A0\\u65E5\\u671F"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "tags-o"\n }),\n text: "\\u6807\\u7B7E\\u540D\\u79F0"\n })), /#__PURE__/_react["default"].createElement(_uiw.Menu.Divider, {\n title: "\\u5176\\u5B83"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.SubMenu, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "bar-chart"\n }),\n text: "\\u6BCF\\u5E742019\\u5E74\\u7EDF\\u8BA1\\u62A5\\u8868\\u5BFC\\u51FA",\n collapse: true // overlayProps={{ isOpen: true }}\n\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6\\u5939"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Divider, {\n title: "\\u7C7B\\u522B"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "copy"\n }),\n text: "\\u62F7\\u8D1D"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.SubMenu, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "folder-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6\\u5939",\n collapse: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "file-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "folder-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6\\u5939"\n }))), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "setting"\n }),\n disabled: true,\n text: "\\u504F\\u597D\\u8BBE\\u7F6E"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "map"\n }),\n text: "\\u8C37\\u6B4C\\u5730\\u56FE"\n }))));\n};\n\nreturn Demo;',language:"jsx",value:'import React from \'react\';\nimport { Menu, Row, Col ,Icon } from \'uiw\';\n\nconst Demo = () => (\n <Row justify="flex-start" gutter={10}>\n <Col fixed>\n <Menu bordered style={{ maxWidth: 200 }}>\n <Menu.Item icon={<Icon type="delete" />} disabled text="\u5220\u9664" />\n <Menu.SubMenu icon={<Icon type="setting-o" />} text="\u9009\u9879" disabled collapse>\n <Menu.Item icon={<Icon type="dot-chart" />}text="\u663e\u793a\u8fb9\u680f" />\n <Menu.Item icon={<Icon type="date" />} text="\u6dfb\u52a0\u65e5\u671f" />\n <Menu.Item icon={<Icon type="tags-o" />} text="\u6807\u7b7e\u540d\u79f0" />\n </Menu.SubMenu>\n <Menu.Divider title="\u5176\u5b83" />\n <Menu.SubMenu icon={<Icon type="bar-chart" />} text="\u6bcf\u5e742019\u5e74\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa" collapse\n // overlayProps={{ isOpen: true }}\n >\n <Menu.Item text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n <Menu.Divider title="\u7c7b\u522b" />\n <Menu.Item icon={<Icon type="copy" />} text="\u62f7\u8d1d" />\n <Menu.SubMenu icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" collapse>\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n </Menu.SubMenu>\n </Menu.SubMenu>\n <Menu.Item icon={<Icon type="setting" />} disabled text="\u504f\u597d\u8bbe\u7f6e" />\n <Menu.Item icon={<Icon type="map" />} text="\u8c37\u6b4c\u5730\u56fe" />\n </Menu>\n </Col>\n </Row>\n)\nexport default Demo'},231:{name:231,meta:{background:"#fff",noScroll:"true",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nfunction _instanceof(left, right) { if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) { return !!right[Symbol.hasInstance](left); } else { return left instanceof right; } }\n\nfunction _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\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\nfunction _classCallCheck(instance, Constructor) { if (!_instanceof(instance, Constructor)) { throw new TypeError("Cannot call a class as a function"); } }\n\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable \|\| false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\n\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\n\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\nfunction _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\n\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" \|\| typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }\n\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn\'t been initialised - super() hasn\'t been called"); } return self; }\n\nfunction _isNativeReflectConstruct() { if (typeof Reflect === "undefined" \|\| !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\n\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ \|\| Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\nvar Demo = /#__PURE__/function (_React$Component) {\n _inherits(Demo, _React$Component);\n\n var _super = _createSuper(Demo);\n\n function Demo(props) {\n var _this;\n\n _classCallCheck(this, Demo);\n\n _this = _super.call(this, props);\n _this.state = {\n theme: \'dark\'\n };\n return _this;\n }\n\n _createClass(Demo, [{\n key: "render",\n value: function render() {\n var _this2 = this,\n _React$createElement;\n\n return /#__PURE__/_react["default"].createElement("div", null, /#__PURE__/_react["default"].createElement(_uiw.Row, {\n justify: "flex-start",\n gutter: 10\n }, /#__PURE__/_react["default"].createElement(_uiw.Col, {\n style: {\n paddingBottom: 5\n }\n }, /#__PURE__/_react["default"].createElement(_uiw.Switch, {\n checked: true,\n style: {\n marginRight: 10\n },\n onChange: function onChange(e) {\n _this2.setState({\n theme: e.target.checked ? \'dark\' : \'light\'\n });\n }\n }))), /#__PURE__/_react["default"].createElement(_uiw.Row, {\n justify: "flex-start",\n gutter: 10\n }, /#__PURE__/_react["default"].createElement(_uiw.Col, {\n fixed: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu, {\n theme: this.state.theme,\n bordered: true,\n style: {\n maxWidth: 200\n }\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "delete"\n }),\n disabled: true,\n text: "\\u5220\\u9664"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.SubMenu, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "setting-o"\n }),\n text: "\\u9009\\u9879",\n disabled: true,\n collapse: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "dot-chart"\n }),\n text: "\\u663E\\u793A\\u8FB9\\u680F"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "date"\n }),\n text: "\\u6DFB\\u52A0\\u65E5\\u671F"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "tags-o"\n }),\n text: "\\u6807\\u7B7E\\u540D\\u79F0"\n })), /#__PURE__/_react["default"].createElement(_uiw.Menu.Divider, {\n title: "\\u5176\\u5B83"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n active: true,\n icon: "map",\n text: "\\u8C37\\u6B4C\\u5730\\u56FE"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.SubMenu, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "bar-chart"\n }),\n text: "\\u6BCF\\u5E742019\\u5E74\\u7EDF\\u8BA1\\u62A5\\u8868\\u5BFC\\u51FA"\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6\\u5939"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Divider, {\n title: "\\u7C7B\\u522B"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.SubMenu, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "folder-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6\\u5939",\n collapse: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "file-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "folder-add"\n }),\n text: "\\u6DFB\\u52A0\\u6587\\u4EF6\\u5939"\n })), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, (_React$createElement = {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "copy"\n })\n }, _defineProperty(_React$createElement, "icon", "copy"), _defineProperty(_React$createElement, "text", "\\u62F7\\u8D1D"), _React$createElement))), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: "setting",\n disabled: true,\n text: "\\u504F\\u597D\\u8BBE\\u7F6E"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.SubMenu, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "setting-o"\n }),\n text: "\\u9009\\u9879",\n collapse: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "dot-chart"\n }),\n text: "\\u663E\\u793A\\u8FB9\\u680F"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "date"\n }),\n text: "\\u6DFB\\u52A0\\u65E5\\u671F"\n }), /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: "tags-o"\n }),\n text: "\\u6807\\u7B7E\\u540D\\u79F0"\n }))))));\n }\n }]);\n\n return Demo;\n}(_react["default"].Component);\n\nreturn Demo;',language:"jsx",value:'import React from \'react\';\nimport { Menu, Row, Col, Switch ,Icon} from \'uiw\';\n\nclass Demo extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n theme: \'dark\',\n }\n }\n render() {\n return (\n <div>\n <Row justify="flex-start" gutter={10}>\n <Col style={{ paddingBottom: 5 }}>\n <Switch\n checked\n style={{ marginRight: 10 }}\n onChange={(e) => {\n this.setState({ theme: e.target.checked ? \'dark\' : \'light\' });\n }}\n />\n </Col>\n </Row>\n <Row justify="flex-start" gutter={10}>\n <Col fixed>\n <Menu theme={this.state.theme} bordered style={{ maxWidth: 200 }}>\n <Menu.Item icon={<Icon type="delete" />} disabled text="\u5220\u9664" />\n <Menu.SubMenu icon={<Icon type="setting-o" />} text="\u9009\u9879" disabled collapse>\n <Menu.Item icon={<Icon type="dot-chart" />} text="\u663e\u793a\u8fb9\u680f" />\n <Menu.Item icon={<Icon type="date" />} text="\u6dfb\u52a0\u65e5\u671f" />\n <Menu.Item icon={<Icon type="tags-o" />} text="\u6807\u7b7e\u540d\u79f0" />\n </Menu.SubMenu>\n <Menu.Divider title="\u5176\u5b83" />\n <Menu.Item active icon="map" text="\u8c37\u6b4c\u5730\u56fe" />\n <Menu.SubMenu icon={<Icon type="bar-chart" />} text="\u6bcf\u5e742019\u5e74\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa">\n <Menu.Item text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n <Menu.Divider title="\u7c7b\u522b" />\n <Menu.SubMenu icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" collapse>\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n </Menu.SubMenu>\n <Menu.Item icon={<Icon type="copy" />} icon="copy" text="\u62f7\u8d1d" />\n </Menu.SubMenu>\n <Menu.Item icon="setting" disabled text="\u504f\u597d\u8bbe\u7f6e" />\n <Menu.SubMenu icon={<Icon type="setting-o" />} text="\u9009\u9879" collapse>\n <Menu.Item icon={<Icon type="dot-chart" />} text="\u663e\u793a\u8fb9\u680f" />\n <Menu.Item icon={<Icon type="date" />} text="\u6dfb\u52a0\u65e5\u671f" />\n <Menu.Item icon={<Icon type="tags-o" />} text="\u6807\u7b7e\u540d\u79f0" />\n </Menu.SubMenu>\n </Menu>\n </Col>\n </Row>\n </div>\n );\n }\n}\n\nexport default Demo'},298:{name:298,meta:{background:"#fff",noScroll:"true",codeSandbox:"true",codePen:"true"},code:'"use strict";\n\nfunction _instanceof(left, right) { if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) { return !!right[Symbol.hasInstance](left); } else { return left instanceof right; } }\n\nfunction _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }\n\nvar _react = _interopRequireDefault(require("react"));\n\nvar _uiw = require("uiw");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }\n\nfunction _classCallCheck(instance, Constructor) { if (!_instanceof(instance, Constructor)) { throw new TypeError("Cannot call a class as a function"); } }\n\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable \|\| false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\n\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\n\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\nfunction _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\n\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" \|\| typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }\n\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn\'t been initialised - super() hasn\'t been called"); } return self; }\n\nfunction _isNativeReflectConstruct() { if (typeof Reflect === "undefined" \|\| !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\n\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ \|\| Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\nvar Demo = /#__PURE__/function (_React$Component) {\n _inherits(Demo, _React$Component);\n\n var _super = _createSuper(Demo);\n\n function Demo(props) {\n var _this;\n\n _classCallCheck(this, Demo);\n\n _this = _super.call(this, props);\n _this.state = {\n theme: \'light\',\n menus: [{\n key: \'1\',\n icon: \'delete\',\n label: \'\u5220\u9664\'\n }, {\n icon: \'setting-o\',\n label: \'\u9009\u9879\',\n childrend: [{\n key: \'1-1\',\n icon: \'dot-chart\',\n label: \'\u663e\u793a\u8fb9\u680f\'\n }, {\n key: \'1-2\',\n icon: \'date\',\n disabled: true,\n label: \'\u6dfb\u52a0\u65e5\u671f\'\n }, {\n key: \'1-3\',\n icon: \'tags-o\',\n label: \'\u6807\u7b7e\u540d\u79f0\'\n }]\n }, {\n divider: true\n }, {\n key: \'2\',\n icon: \'map\',\n label: \'\u8c37\u6b4c\u5730\u56fe\'\n }, {\n icon: \'bar-chart\',\n label: \'\u6bcf\u5e742019\u5e74\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa\',\n childrend: [{\n key: \'2-1\',\n label: \'\u7edf\u8ba1\u6dfb\u52a0\u6587\u4ef6\'\n }, {\n key: \'2-2\',\n label: \'\u7edf\u8ba1\u6dfb\u52a0\u6587\u4ef6\u5939\'\n }, {\n key: \'2-3\',\n icon: \'tags-o\',\n label: \'\u7c7b\u522b\',\n divider: true\n }, {\n icon: \'folder-add\',\n label: \'\u6dfb\u52a0\u6587\u4ef6\u5939\',\n childrend: [{\n key: \'2-3-1\',\n label: \'\u6dfb\u52a0\u6587\u4ef6\u5939\'\n }, {\n key: \'2-3-2\',\n label: \'\u6dfb\u52a0\u6587\u4ef6\'\n }, {\n key: \'2-3-3\',\n label: \'\u6dfb\u52a0\u6587\u4ef6\u5939\'\n }]\n }]\n }],\n active: \'1\'\n };\n return _this;\n }\n\n _createClass(Demo, [{\n key: "onClickItem",\n value: function onClickItem(key) {\n this.setState({\n active: key\n });\n }\n }, {\n key: "renderMenu",\n value: function renderMenu(menus, k) {\n var _this2 = this;\n\n var active = this.state.active;\n var items = [];\n menus.forEach(function (item, key) {\n if (item.childrend) {\n items.push( /#__PURE__/_react["default"].createElement(_uiw.Menu.SubMenu, {\n key: key,\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: item.icon\n }),\n text: item.label,\n collapse: true // \u53c2\u6570 usePortal \u5bb9\u6613\u51fa\u95ee\u9898\n // overlayProps={{ usePortal: true }}\n\n }, _this2.renderMenu(item.childrend, "".concat(k).concat(key))));\n } else if (item.divider) {\n items.push( /#__PURE__/_react["default"].createElement(_uiw.Menu.Divider, {\n key: "".concat(k).concat(key),\n title: item.label\n }));\n } else {\n items.push( /#__PURE__/_react["default"].createElement(_uiw.Menu.Item, {\n onClick: _this2.onClickItem.bind(_this2, item.key),\n active: active === item.key,\n key: "".concat(k).concat(key),\n icon: /#__PURE__/_react["default"].createElement(_uiw.Icon, {\n type: item.icon\n }),\n text: item.label\n }));\n }\n });\n return items;\n }\n }, {\n key: "render",\n value: function render() {\n var _this3 = this;\n\n return /#__PURE__/_react["default"].createElement("div", null, /#__PURE__/_react["default"].createElement(_uiw.Row, {\n justify: "flex-start",\n gutter: 10\n }, /#__PURE__/_react["default"].createElement(_uiw.Col, {\n style: {\n paddingBottom: 5\n }\n }, /#__PURE__/_react["default"].createElement(_uiw.Switch, {\n checked: this.state.theme === \'dark\',\n style: {\n marginRight: 10\n },\n onChange: function onChange(e) {\n _this3.setState({\n theme: e.target.checked ? \'dark\' : \'light\'\n });\n }\n }))), /#__PURE__/_react["default"].createElement(_uiw.Row, {\n justify: "flex-start",\n gutter: 10\n }, /#__PURE__/_react["default"].createElement(_uiw.Col, {\n fixed: true\n }, /#__PURE__/_react["default"].createElement(_uiw.Menu, {\n inlineIndent: 13,\n theme: this.state.theme,\n bordered: true,\n style: {\n maxWidth: 200\n }\n }, this.renderMenu(this.state.menus, \'k\')))));\n }\n }]);\n\n return Demo;\n}(_react["default"].Component);\n\nreturn Demo;',language:"jsx",value:"import React from 'react';\nimport { Menu, Row, Col, Switch ,Icon} from 'uiw';\n\nclass Demo extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n theme: 'light',\n menus: [\n { key: '1', icon: 'delete', label: '\u5220\u9664' },\n {\n icon: 'setting-o',\n label: '\u9009\u9879',\n childrend: [\n { key: '1-1', icon: 'dot-chart', label: '\u663e\u793a\u8fb9\u680f' },\n { key: '1-2', icon: 'date', disabled: true, label: '\u6dfb\u52a0\u65e5\u671f' },\n { key: '1-3', icon: 'tags-o', label: '\u6807\u7b7e\u540d\u79f0' },\n ],\n },\n { divider: true },\n { key: '2', icon: 'map', label: '\u8c37\u6b4c\u5730\u56fe' },\n {\n icon: 'bar-chart',\n label: '\u6bcf\u5e742019\u5e74\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa',\n childrend: [\n { key: '2-1', label: '\u7edf\u8ba1\u6dfb\u52a0\u6587\u4ef6' },\n { key: '2-2', label: '\u7edf\u8ba1\u6dfb\u52a0\u6587\u4ef6\u5939' },\n { key: '2-3', icon: 'tags-o', label: '\u7c7b\u522b', divider: true },\n {\n icon: 'folder-add',\n label: '\u6dfb\u52a0\u6587\u4ef6\u5939',\n childrend: [\n { key: '2-3-1', label: '\u6dfb\u52a0\u6587\u4ef6\u5939' },\n { key: '2-3-2', label: '\u6dfb\u52a0\u6587\u4ef6' },\n { key: '2-3-3', label: '\u6dfb\u52a0\u6587\u4ef6\u5939' },\n ],\n },\n ],\n },\n ],\n active: '1',\n }\n }\n\n onClickItem(key) {\n this.setState({ active: key });\n }\n\n renderMenu(menus, k) {\n const { active } = this.state;\n const items = [];\n menus.forEach((item, key) => {\n if (item.childrend) {\n items.push(\n <Menu.SubMenu key={key} icon={<Icon type={item.icon} />} text={item.label} collapse\n // \u53c2\u6570 usePortal \u5bb9\u6613\u51fa\u95ee\u9898\n // overlayProps={{ usePortal: true }}\n >\n {this.renderMenu(item.childrend, `${k}${key}`)}\n </Menu.SubMenu>\n );\n } else if (item.divider) {\n items.push(<Menu.Divider key={`${k}${key}`} title={item.label} />);\n } else {\n items.push(\n <Menu.Item\n onClick={this.onClickItem.bind(this, item.key)}\n active={active === item.key} key={`${k}${key}`}\n icon={<Icon type={item.icon} />} \n text={item.label}\n />\n );\n }\n });\n return items;\n }\n\n render() {\n return (\n <div>\n <Row justify=\"flex-start\" gutter={10}>\n <Col style={{ paddingBottom: 5 }}>\n <Switch\n checked={this.state.theme === 'dark'}\n style={{ marginRight: 10 }}\n onChange={(e) => {\n this.setState({ theme: e.target.checked ? 'dark' : 'light' });\n }}\n />\n </Col>\n </Row>\n <Row justify=\"flex-start\" gutter={10}>\n <Col fixed>\n <Menu inlineIndent={13} theme={this.state.theme} bordered style={{ maxWidth: 200 }}>\n {this.renderMenu(this.state.menus, 'k')}\n </Menu>\n </Col>\n </Row>\n </div>\n );\n }\n}\n\nexport default Demo"},409:{name:409,meta:{background:"#fff",noScroll:"true",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 _slicedToArray(arr, i) { return _arrayWithHoles(arr) \|\| _iterableToArrayLimit(arr, i) \|\| _unsupportedIterableToArray(arr, i) \|\| _nonIterableRest(); }\n\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\n\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" \|\| n === \"Set\") return Array.from(o); if (n === \"Arguments\" \|\| /^(?:Ui\|I)nt(?:8\|16\|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\n\nfunction _arrayLikeToArray(arr, len) { if (len == null \|\| len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n\nfunction _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== \"undefined\" && arr[Symbol.iterator] \|\| arr[\"@@iterator\"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"] != null) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; }\n\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\nvar menusData = [{\n key: '1',\n icon: 'delete',\n label: '\u5220\u9664'\n}, {\n icon: 'setting-o',\n label: '\u9009\u9879',\n childrend: [{\n key: '1-1',\n icon: 'dot-chart',\n label: '\u663e\u793a\u8fb9\u680f'\n }, {\n key: '1-2',\n icon: 'date',\n disabled: true,\n label: '\u6dfb\u52a0\u65e5\u671f'\n }, {\n key: '1-3',\n icon: 'tags-o',\n label: '\u6807\u7b7e\u540d\u79f0'\n }]\n}, {\n key: '2',\n icon: 'map',\n label: '\u8c37\u6b4c\u5730\u56fe'\n}, {\n icon: 'bar-chart',\n label: '\u6bcf\u5e742019\u5e74\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa',\n childrend: [{\n key: '2-1',\n label: '\u7edf\u8ba1\u6dfb\u52a0\u6587\u4ef6'\n }, {\n key: '2-2',\n label: '\u7edf\u8ba1\u6dfb\u52a0\u6587\u4ef6\u5939'\n }, {\n key: '2-3',\n icon: 'tags-o',\n label: '\u7c7b\u522b',\n divider: true\n }, {\n icon: 'folder-add',\n label: '\u6dfb\u52a0\u6587\u4ef6\u5939',\n childrend: [{\n key: '2-3-1',\n label: '\u6dfb\u52a0\u6587\u4ef6\u5939'\n }, {\n key: '2-3-2',\n label: '\u6dfb\u52a0\u6587\u4ef6'\n }, {\n key: '2-3-3',\n label: '\u6dfb\u52a0\u6587\u4ef6\u5939'\n }]\n }]\n}];\n\nvar Demo = function Demo() {\n var _React$useState = _react[\"default\"].useState('dark'),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n theme = _React$useState2[0],\n setTheme = _React$useState2[1];\n\n var _React$useState3 = _react[\"default\"].useState(false),\n _React$useState4 = _slicedToArray(_React$useState3, 2),\n collapse = _React$useState4[0],\n setCollapse = _React$useState4[1];\n\n var menuRef = _react[\"default\"].useRef();\n\n function onClickItem() {\n console.log(';;;;>>>');\n }\n\n function renderMenu(menus) {\n var _this = this;\n\n var items = [];\n menus.forEach(function (item, key) {\n if (item.childrend) {\n items.push( /#__PURE__/_react[\"default\"].createElement(_uiw.Menu.SubMenu, {\n key: key,\n icon: /#__PURE__/_react[\"default\"].createElement(_uiw.Icon, {\n type: item.icon\n }),\n text: item.label,\n collapse: collapse\n }, renderMenu(item.childrend)));\n } else if (item.divider) {\n items.push( /#__PURE__/_react[\"default\"].createElement(_uiw.Menu.Divider, {\n key: key,\n title: item.label\n }));\n } else {\n items.push( /#__PURE__/_react[\"default\"].createElement(_uiw.Menu.Item, {\n onClick: onClickItem.bind(_this, item.key),\n key: key,\n icon: /#__PURE__/_react[\"default\"].createElement(_uiw.Icon, {\n type: item.icon\n }),\n text: item.label\n }));\n }\n });\n return items;\n }\n\n return /#__PURE__/_react[\"default\"].createElement(\"div\", {\n style: {\n maxWidth: 200\n }\n }, /#__PURE__/_react[\"default\"].createElement(_uiw.Button, {\n type: \"primary\",\n size: \"small\",\n onClick: function onClick() {\n return setCollapse(!collapse);\n },\n style: {\n marginBottom: 10\n }\n }, /#__PURE__/_react[\"default\"].createElement(_uiw.Icon, {\n type: collapse ? 'menu-fold' : 'menu-unfold'\n })), /#__PURE__/_react[\"default\"].createElement(_uiw.Switch, {\n size: \"large\",\n \"data-checked\": \"light\",\n \"data-unchecked\": \"dark\",\n checked: theme === 'dark',\n style: {\n marginLeft: 10,\n marginBottom: 10,\n display: 'inline-block'\n },\n onChange: function onChange(e) {\n return setTheme(e.target.checked ? 'dark' : 'light');\n }\n }), /#__PURE__/_react[\"default\"].createElement(_uiw.Menu, {\n theme: theme,\n ref: menuRef,\n inlineCollapsed: collapse,\n inlineIndent: 13,\n bordered: true // style={{ maxWidth: 200 }}\n\n }, renderMenu(menusData)));\n};\n\nreturn Demo;",language:"jsx",value:"import React from 'react';\nimport { Menu, Row, Col, Icon, Button, Switch } from 'uiw';\n\nconst menusData = [\n { key: '1', icon: 'delete', label: '\u5220\u9664' },\n {\n icon: 'setting-o',\n label: '\u9009\u9879',\n childrend: [\n { key: '1-1', icon: 'dot-chart', label: '\u663e\u793a\u8fb9\u680f' },\n { key: '1-2', icon: 'date', disabled: true, label: '\u6dfb\u52a0\u65e5\u671f' },\n { key: '1-3', icon: 'tags-o', label: '\u6807\u7b7e\u540d\u79f0' },\n ],\n },\n { key: '2', icon: 'map', label: '\u8c37\u6b4c\u5730\u56fe' },\n {\n icon: 'bar-chart',\n label: '\u6bcf\u5e742019\u5e74\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa',\n childrend: [\n { key: '2-1', label: '\u7edf\u8ba1\u6dfb\u52a0\u6587\u4ef6' },\n { key: '2-2', label: '\u7edf\u8ba1\u6dfb\u52a0\u6587\u4ef6\u5939' },\n { key: '2-3', icon: 'tags-o', label: '\u7c7b\u522b', divider: true },\n {\n icon: 'folder-add',\n label: '\u6dfb\u52a0\u6587\u4ef6\u5939',\n childrend: [\n { key: '2-3-1', label: '\u6dfb\u52a0\u6587\u4ef6\u5939' },\n { key: '2-3-2', label: '\u6dfb\u52a0\u6587\u4ef6' },\n { key: '2-3-3', label: '\u6dfb\u52a0\u6587\u4ef6\u5939' },\n ],\n },\n ],\n },\n];\n\nconst Demo = () => {\n const [theme, setTheme] = React.useState('dark');\n const [collapse, setCollapse] = React.useState(false);\n const menuRef = React.useRef();\n function onClickItem() {\n console.log(';;;;>>>')\n }\n function renderMenu(menus) {\n const items = [];\n menus.forEach((item, key) => {\n if (item.childrend) {\n items.push(\n <Menu.SubMenu key={key} icon={<Icon type={item.icon} />} text={item.label}\n collapse={collapse}\n >\n {renderMenu(item.childrend)}\n </Menu.SubMenu>\n );\n } else if (item.divider) {\n items.push(<Menu.Divider key={key} title={item.label} />);\n } else {\n items.push(\n <Menu.Item\n onClick={onClickItem.bind(this, item.key)}\n key={key}\n icon={<Icon type={item.icon} />} \n text={item.label}\n />\n );\n }\n });\n return items;\n }\n return (\n <div style={{ maxWidth: 200}}>\n <Button type=\"primary\" size=\"small\" onClick={() => setCollapse(!collapse)} style={{ marginBottom: 10 }}>\n <Icon type={collapse ? 'menu-fold' : 'menu-unfold' } />\n </Button>\n <Switch\n size=\"large\"\n data-checked=\"light\"\n data-unchecked=\"dark\"\n checked={theme === 'dark'}\n style={{ marginLeft: 10, marginBottom: 10, display: 'inline-block' }}\n onChange={(e) => setTheme(e.target.checked ? 'dark' : 'light')}\n />\n <Menu\n theme={theme}\n ref={menuRef}\n inlineCollapsed={collapse}\n inlineIndent={13}\n bordered\n // style={{ maxWidth: 200 }}\n >\n {renderMenu(menusData)}\n </Menu>\n </div>\n )\n}\n\nexport default Demo"}},source:'Menu \u83dc\u5355\n===\n\n[![Open in unpkg](https://img.shields.io/badge/Open%20in-unpkg-blue)](https://uiwjs.github.io/npm-unpkg/#/pkg/@uiw/react-menu/file/README.md)\n[![NPM Downloads](https://img.shields.io/npm/dm/@uiw/react-menu.svg?style=flat)](https://www.npmjs.com/package/@uiw/react-menu)\n[![npm version](https://img.shields.io/npm/v/@uiw/react-menu.svg?label=@uiw/react-menu)](https://www.npmjs.com/package/@uiw/react-menu)\n\n\u4e3a\u9875\u9762\u548c\u529f\u80fd\u63d0\u4f9b\u5bfc\u822a\u7684\u83dc\u5355\u5217\u8868\u3002\n\n```jsx\nimport { Menu } from \'uiw\';\nimport { MenuItem, MenuDivider, SubMenu } from \'uiw\'; // @ v4.10.0+\n// or\nimport Menu, { MenuItem, MenuDivider, SubMenu } from \'@uiw/react-menu\'; // @ v4.10.0+\n\n// Menu.Item === MenuItem\n// Menu.Divider === MenuDivider\n// Menu.SubMenu === SubMenu\n```\n\n### \u57fa\u672c\u7528\u6cd5\n\n\n```jsx mdx:preview&background=#fff&noScroll=true&codeSandbox=true&codePen=true\nimport React from \'react\';\nimport { Menu, MenuItem, Row, Col ,Icon} from \'uiw\';\n\nconst Demo = () => (\n <Row justify="flex-start" gutter={10}>\n <Col fixed>\n <Menu bordered>\n <MenuItem icon={<Icon type="reload" />} text="\u91cd\u65b0\u52a0\u8f7d" />\n <Menu.Divider />\n <Menu.Item icon={<Icon type="heart-on" />} text="\u53e6\u5b58\u4e3a" active />\n <Menu.Item icon={<Icon type="appstore" />} text="\u5e94\u7528\u5546\u57ce" />\n <Menu.Item icon={<Icon type="bar-chart" />} text="\u6708\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa" />\n <Menu.Item icon={<Icon type="setting" />} text="\u504f\u597d\u8bbe\u7f6e" />\n <Menu.Divider />\n <Menu.Item icon={<Icon type="map" />} text="\u8c37\u6b4c\u5730\u56fe" />\n <Menu.Item icon={<Icon type="map" />} text="\u767e\u5ea6\u5730\u56fe" href="https://map.baidu.com" target="_blank" />\n </Menu>\n </Col>\n <Col fixed>\n <Menu bordered>\n <Menu.Divider title="\u7f16\u8f91" />\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n <Menu.Item icon={<Icon type="copy" />} text="\u62f7\u8d1d" />\n <Menu.Item icon={<Icon type="delete" />} disabled text="\u5220\u9664" />\n <Menu.SubMenu icon={<Icon type="setting-o" />} text="\u9009\u9879" collapse>\n <Menu.Item icon={<Icon type="ot-chart" />} text="\u663e\u793a\u8fb9\u680f" />\n <Menu.Item icon={<Icon type="date" />} text="\u6dfb\u52a0\u65e5\u671f" />\n <Menu.Item icon={<Icon type="tags-o" />} text="\u6807\u7b7e\u540d\u79f0" />\n </Menu.SubMenu>\n <Menu.Divider title="\u5176\u5b83" />\n <Menu.SubMenu icon={<Icon type="bar-chart" />} text="\u6708\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa" collapse>\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n <Menu.Divider title="\u7c7b\u522b" />\n <Menu.Item icon={<Icon type="copy" />} text="\u62f7\u8d1d" />\n <Menu.SubMenu icon={<Icon type="bar-chart" />} text="\u62a5\u8868" collapse>\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.SubMenu icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939">\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n </Menu.SubMenu>\n </Menu.SubMenu>\n </Menu.SubMenu>\n <Menu.SubMenu icon={<Icon type="setting" />} disabled text="\u504f\u597d\u8bbe\u7f6e">\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n </Menu.SubMenu>\n <Menu.Item icon={<Icon type="map" />} text="\u8c37\u6b4c\u5730\u56fe" />\n </Menu>\n </Col>\n <Col fixed>\n <Menu bordered>\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n <Menu.SubMenu icon={<Icon type="bar-chart" />} text="\u6708\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa"\n overlayProps={{\n isOpen: true\n }}\n >\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Divider title="\u7c7b\u522b" />\n <Menu.Item icon={<Icon type="copy" />} text="\u62f7\u8d1d" />\n <Menu.SubMenu icon={<Icon type="bar-chart" />} text="\u62a5\u8868" collapse>\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.SubMenu icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939">\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n </Menu.SubMenu>\n </Menu.SubMenu>\n </Menu.SubMenu>\n <Menu.Item icon={<Icon type="map" />} text="\u8c37\u6b4c\u5730\u56fe" />\n </Menu>\n </Col>\n </Row>\n)\nexport default Demo\n```\n\n### \u4e0b\u62c9\u83dc\u5355\n\n```jsx mdx:preview&background=#fff&noScroll=true&codeSandbox=true&codePen=true\nimport React from \'react\';\nimport { Menu, Popover, Button, Row, Col ,Icon} from \'uiw\';\n\nconst btnStl = {position: \'relative\', width: 70 }\nconst content = (\n <Menu>\n <Menu.Divider title="\u7f16\u8f91" />\n <Menu.Item icon={<Icon type="file-add" />} icon="file-add" text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item icon={<Icon type="folder-add" />} icon="folder-add" text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n <Menu.Item icon={<Icon type="copy" />} text="\u62f7\u8d1d" />\n <Menu.Item icon={<Icon type="delete" />} disabled text="\u5220\u9664" />\n <Menu.Divider title="\u5176\u5b83" />\n <Menu.Item icon={<Icon type="bar-chart" />} text="\u6708\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa" />\n <Menu.Item icon={<Icon type="setting" />} disabled text="\u504f\u597d\u8bbe\u7f6e" />\n <Menu.Item icon={<Icon type="map" />} text="\u8c37\u6b4c\u5730\u56fe" />\n </Menu>\n)\nconst Demo = () => (\n <div>\n <div style={{ position: \'relative\' }}>\n\n <Popover trigger="click" placement="topLeft" content={content}>\n <Button style={{ ...btnStl, left: 70 }}>TL</Button>\n </Popover>\n <Popover trigger="click" placement="top" content={content}>\n <Button style={{ ...btnStl, left: 70}}>Top</Button>\n </Popover>\n <Popover trigger="click" placement="topRight" content={content}>\n <Button style={{ ...btnStl, left: 70 }}>TR</Button>\n </Popover>\n\n </div>\n <div style={{ position: \'relative\', paddingTop: 10 }}>\n\n <Popover trigger="click" placement="leftTop" content={content}>\n <Button style={{ ...btnStl }}>LT</Button>\n </Popover>\n <Popover trigger="click" placement="rightTop" content={content}>\n <Button style={{ ...btnStl, left: 216 }}>RT</Button>\n </Popover>\n\n </div>\n <div style={{ position: \'relative\', paddingTop: 10 }}>\n\n <Popover trigger="click" placement="left" content={content}>\n <Button style={{ ...btnStl }}>Left</Button>\n </Popover>\n <Popover trigger="click" placement="right" content={content}>\n <Button style={{ ...btnStl, left: 216 }}>Right</Button>\n </Popover>\n\n </div>\n <div style={{ position: \'relative\', paddingTop: 10 }}>\n\n <Popover trigger="click" placement="leftBottom" content={content}>\n <Button style={{ ...btnStl }}>LB</Button>\n </Popover>\n <Popover trigger="click" placement="rightBottom" content={content}>\n <Button style={{ ...btnStl, left: 216 }}>RB</Button>\n </Popover>\n\n </div>\n <div style={{ position: \'relative\', paddingTop: 10 }}>\n\n <Popover trigger="click" placement="bottomLeft" content={content}>\n <Button style={{ ...btnStl, left: 70 }}>BL</Button>\n </Popover>\n <Popover trigger="click" placement="bottom" content={content}>\n <Button style={{ ...btnStl, left: 70 }}>Bottom</Button>\n </Popover>\n <Popover trigger="click" placement="bottomRight" content={content}>\n <Button style={{ ...btnStl, left: 70 }}>BR</Button>\n </Popover>\n\n </div>\n </div>\n)\nexport default Demo\n```\n\n### \u5185\u5d4c\u83dc\u5355\n\n\u901a\u8fc7\u8bbe\u7f6e `overlayProps={ isOpen: true }`\uff0c\u8ba9\u83dc\u5355\u9ed8\u8ba4\u5c55\u5f00\u3002\n\n```jsx mdx:preview&background=#fff&noScroll=true&codeSandbox=true&codePen=true\nimport React from \'react\';\nimport { Menu, Row, Col ,Icon } from \'uiw\';\n\nconst Demo = () => (\n <Row justify="flex-start" gutter={10}>\n <Col fixed>\n <Menu bordered style={{ maxWidth: 200 }}>\n <Menu.Item icon={<Icon type="delete" />} disabled text="\u5220\u9664" />\n <Menu.SubMenu icon={<Icon type="setting-o" />} text="\u9009\u9879" disabled collapse>\n <Menu.Item icon={<Icon type="dot-chart" />}text="\u663e\u793a\u8fb9\u680f" />\n <Menu.Item icon={<Icon type="date" />} text="\u6dfb\u52a0\u65e5\u671f" />\n <Menu.Item icon={<Icon type="tags-o" />} text="\u6807\u7b7e\u540d\u79f0" />\n </Menu.SubMenu>\n <Menu.Divider title="\u5176\u5b83" />\n <Menu.SubMenu icon={<Icon type="bar-chart" />} text="\u6bcf\u5e742019\u5e74\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa" collapse\n // overlayProps={{ isOpen: true }}\n >\n <Menu.Item text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n <Menu.Divider title="\u7c7b\u522b" />\n <Menu.Item icon={<Icon type="copy" />} text="\u62f7\u8d1d" />\n <Menu.SubMenu icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" collapse>\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n </Menu.SubMenu>\n </Menu.SubMenu>\n <Menu.Item icon={<Icon type="setting" />} disabled text="\u504f\u597d\u8bbe\u7f6e" />\n <Menu.Item icon={<Icon type="map" />} text="\u8c37\u6b4c\u5730\u56fe" />\n </Menu>\n </Col>\n </Row>\n)\nexport default Demo\n```\n\n### \u4e3b\u9898\n\n\u5185\u5efa\u4e86\u4e24\u5957\u4e3b\u9898 `light`\u3001`dark`\uff0c\u9ed8\u8ba4 `light`\u3002\n\n```jsx mdx:preview&background=#fff&noScroll=true&codeSandbox=true&codePen=true\nimport React from \'react\';\nimport { Menu, Row, Col, Switch ,Icon} from \'uiw\';\n\nclass Demo extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n theme: \'dark\',\n }\n }\n render() {\n return (\n <div>\n <Row justify="flex-start" gutter={10}>\n <Col style={{ paddingBottom: 5 }}>\n <Switch\n checked\n style={{ marginRight: 10 }}\n onChange={(e) => {\n this.setState({ theme: e.target.checked ? \'dark\' : \'light\' });\n }}\n />\n </Col>\n </Row>\n <Row justify="flex-start" gutter={10}>\n <Col fixed>\n <Menu theme={this.state.theme} bordered style={{ maxWidth: 200 }}>\n <Menu.Item icon={<Icon type="delete" />} disabled text="\u5220\u9664" />\n <Menu.SubMenu icon={<Icon type="setting-o" />} text="\u9009\u9879" disabled collapse>\n <Menu.Item icon={<Icon type="dot-chart" />} text="\u663e\u793a\u8fb9\u680f" />\n <Menu.Item icon={<Icon type="date" />} text="\u6dfb\u52a0\u65e5\u671f" />\n <Menu.Item icon={<Icon type="tags-o" />} text="\u6807\u7b7e\u540d\u79f0" />\n </Menu.SubMenu>\n <Menu.Divider title="\u5176\u5b83" />\n <Menu.Item active icon="map" text="\u8c37\u6b4c\u5730\u56fe" />\n <Menu.SubMenu icon={<Icon type="bar-chart" />} text="\u6bcf\u5e742019\u5e74\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa">\n <Menu.Item text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n <Menu.Divider title="\u7c7b\u522b" />\n <Menu.SubMenu icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" collapse>\n <Menu.Item icon={<Icon type="file-add" />} text="\u6dfb\u52a0\u6587\u4ef6" />\n <Menu.Item icon={<Icon type="folder-add" />} text="\u6dfb\u52a0\u6587\u4ef6\u5939" />\n </Menu.SubMenu>\n <Menu.Item icon={<Icon type="copy" />} icon="copy" text="\u62f7\u8d1d" />\n </Menu.SubMenu>\n <Menu.Item icon="setting" disabled text="\u504f\u597d\u8bbe\u7f6e" />\n <Menu.SubMenu icon={<Icon type="setting-o" />} text="\u9009\u9879" collapse>\n <Menu.Item icon={<Icon type="dot-chart" />} text="\u663e\u793a\u8fb9\u680f" />\n <Menu.Item icon={<Icon type="date" />} text="\u6dfb\u52a0\u65e5\u671f" />\n <Menu.Item icon={<Icon type="tags-o" />} text="\u6807\u7b7e\u540d\u79f0" />\n </Menu.SubMenu>\n </Menu>\n </Col>\n </Row>\n </div>\n );\n }\n}\n\nexport default Demo\n```\n\n### \u5b8c\u6574\u83dc\u5355\u5c55\u793a\n\n\u5305\u62ec\u70b9\u51fb\u9009\u4e2d\u6548\u679c\uff0c\u4e8b\u4ef6\u7b49\u64cd\u4f5c\uff0c\u5b8c\u6574\u7684\u5b9e\u4f8b\u5c55\u793a\u3002\n\n```jsx mdx:preview&background=#fff&noScroll=true&codeSandbox=true&codePen=true\nimport React from \'react\';\nimport { Menu, Row, Col, Switch ,Icon} from \'uiw\';\n\nclass Demo extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n theme: \'light\',\n menus: [\n { key: \'1\', icon: \'delete\', label: \'\u5220\u9664\' },\n {\n icon: \'setting-o\',\n label: \'\u9009\u9879\',\n childrend: [\n { key: \'1-1\', icon: \'dot-chart\', label: \'\u663e\u793a\u8fb9\u680f\' },\n { key: \'1-2\', icon: \'date\', disabled: true, label: \'\u6dfb\u52a0\u65e5\u671f\' },\n { key: \'1-3\', icon: \'tags-o\', label: \'\u6807\u7b7e\u540d\u79f0\' },\n ],\n },\n { divider: true },\n { key: \'2\', icon: \'map\', label: \'\u8c37\u6b4c\u5730\u56fe\' },\n {\n icon: \'bar-chart\',\n label: \'\u6bcf\u5e742019\u5e74\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa\',\n childrend: [\n { key: \'2-1\', label: \'\u7edf\u8ba1\u6dfb\u52a0\u6587\u4ef6\' },\n { key: \'2-2\', label: \'\u7edf\u8ba1\u6dfb\u52a0\u6587\u4ef6\u5939\' },\n { key: \'2-3\', icon: \'tags-o\', label: \'\u7c7b\u522b\', divider: true },\n {\n icon: \'folder-add\',\n label: \'\u6dfb\u52a0\u6587\u4ef6\u5939\',\n childrend: [\n { key: \'2-3-1\', label: \'\u6dfb\u52a0\u6587\u4ef6\u5939\' },\n { key: \'2-3-2\', label: \'\u6dfb\u52a0\u6587\u4ef6\' },\n { key: \'2-3-3\', label: \'\u6dfb\u52a0\u6587\u4ef6\u5939\' },\n ],\n },\n ],\n },\n ],\n active: \'1\',\n }\n }\n\n onClickItem(key) {\n this.setState({ active: key });\n }\n\n renderMenu(menus, k) {\n const { active } = this.state;\n const items = [];\n menus.forEach((item, key) => {\n if (item.childrend) {\n items.push(\n <Menu.SubMenu key={key} icon={<Icon type={item.icon} />} text={item.label} collapse\n // \u53c2\u6570 usePortal \u5bb9\u6613\u51fa\u95ee\u9898\n // overlayProps={{ usePortal: true }}\n >\n {this.renderMenu(item.childrend, `${k}${key}`)}\n </Menu.SubMenu>\n );\n } else if (item.divider) {\n items.push(<Menu.Divider key={`${k}${key}`} title={item.label} />);\n } else {\n items.push(\n <Menu.Item\n onClick={this.onClickItem.bind(this, item.key)}\n active={active === item.key} key={`${k}${key}`}\n icon={<Icon type={item.icon} />} \n text={item.label}\n />\n );\n }\n });\n return items;\n }\n\n render() {\n return (\n <div>\n <Row justify="flex-start" gutter={10}>\n <Col style={{ paddingBottom: 5 }}>\n <Switch\n checked={this.state.theme === \'dark\'}\n style={{ marginRight: 10 }}\n onChange={(e) => {\n this.setState({ theme: e.target.checked ? \'dark\' : \'light\' });\n }}\n />\n </Col>\n </Row>\n <Row justify="flex-start" gutter={10}>\n <Col fixed>\n <Menu inlineIndent={13} theme={this.state.theme} bordered style={{ maxWidth: 200 }}>\n {this.renderMenu(this.state.menus, \'k\')}\n </Menu>\n </Col>\n </Row>\n </div>\n );\n }\n}\n\nexport default Demo\n```\n\n### \u7f29\u8d77\u5185\u5d4c\u83dc\u5355\n\n\u5185\u5d4c\u83dc\u5355\u53ef\u4ee5\u88ab\u7f29\u8d77/\u5c55\u5f00\uff0c\u9700\u8981 `SubMenu` \u7684\u53c2\u6570 `collapse` \u548c `inlineCollapsed` \u914d\u5408\u4f7f\u7528\u3002\n\n```jsx mdx:preview&background=#fff&noScroll=true&codeSandbox=true&codePen=true\nimport React from \'react\';\nimport { Menu, Row, Col, Icon, Button, Switch } from \'uiw\';\n\nconst menusData = [\n { key: \'1\', icon: \'delete\', label: \'\u5220\u9664\' },\n {\n icon: \'setting-o\',\n label: \'\u9009\u9879\',\n childrend: [\n { key: \'1-1\', icon: \'dot-chart\', label: \'\u663e\u793a\u8fb9\u680f\' },\n { key: \'1-2\', icon: \'date\', disabled: true, label: \'\u6dfb\u52a0\u65e5\u671f\' },\n { key: \'1-3\', icon: \'tags-o\', label: \'\u6807\u7b7e\u540d\u79f0\' },\n ],\n },\n { key: \'2\', icon: \'map\', label: \'\u8c37\u6b4c\u5730\u56fe\' },\n {\n icon: \'bar-chart\',\n label: \'\u6bcf\u5e742019\u5e74\u7edf\u8ba1\u62a5\u8868\u5bfc\u51fa\',\n childrend: [\n { key: \'2-1\', label: \'\u7edf\u8ba1\u6dfb\u52a0\u6587\u4ef6\' },\n { key: \'2-2\', label: \'\u7edf\u8ba1\u6dfb\u52a0\u6587\u4ef6\u5939\' },\n { key: \'2-3\', icon: \'tags-o\', label: \'\u7c7b\u522b\', divider: true },\n {\n icon: \'folder-add\',\n label: \'\u6dfb\u52a0\u6587\u4ef6\u5939\',\n childrend: [\n { key: \'2-3-1\', label: \'\u6dfb\u52a0\u6587\u4ef6\u5939\' },\n { key: \'2-3-2\', label: \'\u6dfb\u52a0\u6587\u4ef6\' },\n { key: \'2-3-3\', label: \'\u6dfb\u52a0\u6587\u4ef6\u5939\' },\n ],\n },\n ],\n },\n];\n\nconst Demo = () => {\n const [theme, setTheme] = React.useState(\'dark\');\n const [collapse, setCollapse] = React.useState(false);\n const menuRef = React.useRef();\n function onClickItem() {\n console.log(\';;;;>>>\')\n }\n function renderMenu(menus) {\n const items = [];\n menus.forEach((item, key) => {\n if (item.childrend) {\n items.push(\n <Menu.SubMenu key={key} icon={<Icon type={item.icon} />} text={item.label}\n collapse={collapse}\n >\n {renderMenu(item.childrend)}\n </Menu.SubMenu>\n );\n } else if (item.divider) {\n items.push(<Menu.Divider key={key} title={item.label} />);\n } else {\n items.push(\n <Menu.Item\n onClick={onClickItem.bind(this, item.key)}\n key={key}\n icon={<Icon type={item.icon} />} \n text={item.label}\n />\n );\n }\n });\n return items;\n }\n return (\n <div style={{ maxWidth: 200}}>\n <Button type="primary" size="small" onClick={() => setCollapse(!collapse)} style={{ marginBottom: 10 }}>\n <Icon type={collapse ? \'menu-fold\' : \'menu-unfold\' } />\n </Button>\n <Switch\n size="large"\n data-checked="light"\n data-unchecked="dark"\n checked={theme === \'dark\'}\n style={{ marginLeft: 10, marginBottom: 10, display: \'inline-block\' }}\n onChange={(e) => setTheme(e.target.checked ? \'dark\' : \'light\')}\n />\n <Menu\n theme={theme}\n ref={menuRef}\n inlineCollapsed={collapse}\n inlineIndent={13}\n bordered\n // style={{ maxWidth: 200 }}\n >\n {renderMenu(menusData)}\n </Menu>\n </div>\n )\n}\n\nexport default Demo\n```\n\n## Menu.Props\n\n\| \u53c2\u6570 \| \u8bf4\u660e \| \u7c7b\u578b \| \u9ed8\u8ba4\u503c \|\n\|--------- \|-------- \|--------- \|-------- \|\n\| className \| \u8bbe\u7f6e\u7c7b\u7684\u540d\u79f0 \| String \| - \|\n\| style \| \u5143\u7d20\u7684\u884c\u5185\u6837\u5f0f \| Object \| - \|\n\| inlineIndent \| \u83dc\u5355\u7f29\u8fdb\u5bbd\u5ea6 \| Number \| `10` \|\n\| theme \| \u4e3b\u9898\u989c\u8272 \| Enum{`light`, `dark`} \| - \|\n\| bordered \| \u662f\u5426\u6709\u8fb9\u6846 \| Boolean \| `false` \|\n\| inlineCollapsed \| \u83dc\u5355\u662f\u5426\u6536\u8d77\u72b6\u6001 \| Boolean \| `false` \|\n\n\n## Menu.Item.Props\n\n\| \u53c2\u6570 \| \u8bf4\u660e \| \u7c7b\u578b \| \u9ed8\u8ba4\u503c \|\n\|--------- \|-------- \|--------- \|-------- \|\n\| icon \| \u83dc\u5355\u56fe\u6807 [`<Icon />`](#/components/icon)\| ReactNode \| - \|\n\| text \| \u83dc\u5355\u6807\u9898\u5185\u5bb9 \| ReactNode \| - \|\n\| addonAfter \| \u83dc\u5355\u6807\u9898\u540e\u9762\u63d2\u5165\u5185\u5bb9 \| ReactNode \| - \|\n\| ~~isSubMenuItem~~ \| \u4e0d\u53ef\u7528\uff0cSubMenu \u7ec4\u4ef6\u4f20\u9012\u7ed9 Item \u7ec4\u4ef6\u7684\u6807\u8bb0\u5c5e\u6027\uff0c\u8fd9\u662f\u4e00\u4e2a\u5185\u90e8\u53c2\u6570\u3002 \| Boolean \| - \|\n\| tagName \| \u8bbe\u7f6e\u5b50\u8282\u70b9\u6807\u7b7e\u540d\uff0c\u9ed8\u8ba4 `<a />` \u6807\u7b7e\uff0c\u4e5f\u53ef\u4ee5\u6307\u5b9a\u8def\u7531 [`<Link />`](https://reacttraining.com/react-router/web/api/Link) \| String \| `a` \|\n\| active \| \u6fc0\u6d3b\u9009\u4e2d\u72b6\u6001 \| Boolean \| `false` \|\n\| disabled \| \u7981\u7528\u72b6\u6001 \| Boolean \| `false` \|\n\n\u5176\u5b83\u53c2\u6570\u53ef\u6839\u636e `tagName` \u6765\u8bbe\u7f6e\uff0c\u9ed8\u8ba4 `<a />` \u6807\u7b7e\u65f6\uff0c\u53ef\u8bbe\u7f6e `href="https://wwww.google.com"` \u6216\u8005 `target="_blank"` \u7b49\u53c2\u6570\uff0c\u4f60\u53ef\u4ee5\u8bbe\u7f6e [react-router-dom](https://github.com/ReactTraining/react-router) \u8def\u7531 `<Link>`\uff0c\u4f8b\u5982\uff1a\n\n```jsx\nimport { Menu } from \'uiw\';\nimport { Link } from \'react-router-dom\';\n\nconst Demo = () => {\n return (\n <Menu style={{ maxWidth: 200 }}>\n <Menu.Item tagName={Link} to="/home" icon="reload" text="\u8df3\u8f6c\u9996\u9875" />\n <Menu.Item icon="map" text="\u767e\u5ea6\u5730\u56fe" href="https://map.baidu.com" target="_blank" />\n </Menu>\n )\n}\n```\n\n## Menu.SubMenu.Props\n\n\| \u53c2\u6570 \| \u8bf4\u660e \| \u7c7b\u578b \| \u9ed8\u8ba4\u503c \|\n\|--------- \|-------- \|--------- \|-------- \|\n\| icon \| \u83dc\u5355\u56fe\u6807 [`<Icon />`](#/components/icon) \| ReactNode \| - \|\n\| text \| \u83dc\u5355\u6807\u9898\u5185\u5bb9 \| ReactNode \| - \|\n\| disabled \| \u7981\u7528\u72b6\u6001 \| Boolean \| `false` \|\n\| collapse \| \u9ed8\u8ba4\u5b50\u83dc\u5355\u662f OverlayTrigger \u7684\u5f39\u51fa\u5c42\uff0c\u901a\u8fc7\u8bbe\u7f6e `collapse={true}` \u53d8\u4e3a~~\u6298\u53e0~~(\u5f39\u51fa\u6846\u5f0f `@v4.2.0+`)\u83dc\u5355 \| Boolean \| `false` \|\n\| overlayProps \| \u5bf9\u8c61\u5c06\u4f20\u9012\u5230 `OverlayTrigger` \u7ec4\u4ef6\uff0c\u4fee\u6539\u90e8\u5206\u53c2\u6570\uff0c\u76f8\u5173\u53c2\u6570\u53c2\u8003 [`OverlayTrigger`](#/components/overlay-trigger) \| Object \| - \|\n\n## Menu.Divider.Props\n\n\| \u53c2\u6570 \| \u8bf4\u660e \| \u7c7b\u578b \| \u9ed8\u8ba4\u503c \|\n\|--------- \|-------- \|--------- \|-------- \|\n\| className \| \u8bbe\u7f6e\u7c7b\u7684\u540d\u79f0 \| String \| - \|\n\| style \| \u5143\u7d20\u7684\u884c\u5185\u6837\u5f0f \| Object \| - \|\n\| title \| \u6807\u9898 \| String \| - \|\n'}}}]);
2	+ //# sourceMappingURL=7096.7233b97b.chunk.js.map