@fle-ui/next 1.0.0-alpha.8 → 1.0.0-alpha.9

package/es/layout/demo/fixedSider/index.js

@@ -1,81 +0,0 @@
-/**
- * title: 固定侧边栏
- * desc: 当内容较长时，使用固定侧边栏可以提供更好的体验。
- *
- */
-import React from 'react';
-import { Layout, Menu } from '@fle-ui/next';
-import { AppstoreOutlined, BarChartOutlined, CloudOutlined, ShopOutlined, TeamOutlined, UserOutlined, UploadOutlined, VideoCameraOutlined } from '@ant-design/icons';
-import './index.less';
-var Header = Layout.Header,
-    Content = Layout.Content,
-    Footer = Layout.Footer,
-    Sider = Layout.Sider;
-
-var FixedSiderDemo = function FixedSiderDemo() {
-  return /*#__PURE__*/React.createElement(Layout, null, /*#__PURE__*/React.createElement(Sider, {
-    style: {
-      overflow: 'auto',
-      height: '100vh',
-      position: 'fixed',
-      left: 0
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "logo"
-  }), /*#__PURE__*/React.createElement(Menu, {
-    theme: "dark",
-    mode: "inline",
-    defaultSelectedKeys: ['4']
-  }, /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "1",
-    icon: /*#__PURE__*/React.createElement(UserOutlined, null)
-  }, "nav 1"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "2",
-    icon: /*#__PURE__*/React.createElement(VideoCameraOutlined, null)
-  }, "nav 2"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "3",
-    icon: /*#__PURE__*/React.createElement(UploadOutlined, null)
-  }, "nav 3"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "4",
-    icon: /*#__PURE__*/React.createElement(BarChartOutlined, null)
-  }, "nav 4"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "5",
-    icon: /*#__PURE__*/React.createElement(CloudOutlined, null)
-  }, "nav 5"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "6",
-    icon: /*#__PURE__*/React.createElement(AppstoreOutlined, null)
-  }, "nav 6"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "7",
-    icon: /*#__PURE__*/React.createElement(TeamOutlined, null)
-  }, "nav 7"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "8",
-    icon: /*#__PURE__*/React.createElement(ShopOutlined, null)
-  }, "nav 8"))), /*#__PURE__*/React.createElement(Layout, {
-    className: "site-layout",
-    style: {
-      marginLeft: 200
-    }
-  }, /*#__PURE__*/React.createElement(Header, {
-    className: "site-layout-background",
-    style: {
-      padding: 0
-    }
-  }), /*#__PURE__*/React.createElement(Content, {
-    style: {
-      margin: '24px 16px 0',
-      overflow: 'initial'
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "site-layout-background",
-    style: {
-      padding: 24,
-      textAlign: 'center'
-    }
-  }, "...", /*#__PURE__*/React.createElement("br", null), "Really", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "long", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "...", /*#__PURE__*/React.createElement("br", null), "content")), /*#__PURE__*/React.createElement(Footer, {
-    style: {
-      textAlign: 'center'
-    }
-  }, "Ant Design \xA92018 Created by Ant UED")));
-};
-
-export default FixedSiderDemo;

package/es/layout/demo/responsive.d.ts

@@ -1,7 +0,0 @@
-/**
- * title: 响应式布局
- * desc: Layout.Sider 支持响应式布局。<br/> 说明：配置 `breakpoint` 属性即生效，视窗宽度小于 `breakpoint` 时 Sider 缩小为 `collapsedWidth` 宽度，若将 `collapsedWidth` 设置为 0，会出现特殊 trigger。
- *
- */
-declare const ResponsiveDemo: () => JSX.Element;
-export default ResponsiveDemo;

package/es/layout/demo/responsive.js

@@ -1,64 +0,0 @@
-/**
- * title: 响应式布局
- * desc: Layout.Sider 支持响应式布局。<br/> 说明：配置 `breakpoint` 属性即生效，视窗宽度小于 `breakpoint` 时 Sider 缩小为 `collapsedWidth` 宽度，若将 `collapsedWidth` 设置为 0，会出现特殊 trigger。
- *
- */
-import React from 'react';
-import { Layout, Menu } from '@fle-ui/next';
-import { UploadOutlined, UserOutlined, VideoCameraOutlined } from '@ant-design/icons';
-var Header = Layout.Header,
-    Content = Layout.Content,
-    Footer = Layout.Footer,
-    Sider = Layout.Sider;
-
-var ResponsiveDemo = function ResponsiveDemo() {
-  return /*#__PURE__*/React.createElement(Layout, null, /*#__PURE__*/React.createElement(Sider, {
-    breakpoint: "lg",
-    collapsedWidth: "0",
-    onBreakpoint: function onBreakpoint(broken) {
-      console.log(broken);
-    },
-    onCollapse: function onCollapse(collapsed, type) {
-      console.log(collapsed, type);
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "logo"
-  }), /*#__PURE__*/React.createElement(Menu, {
-    theme: "dark",
-    mode: "inline",
-    defaultSelectedKeys: ['4']
-  }, /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "1",
-    icon: /*#__PURE__*/React.createElement(UserOutlined, null)
-  }, "nav 1"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "2",
-    icon: /*#__PURE__*/React.createElement(VideoCameraOutlined, null)
-  }, "nav 2"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "3",
-    icon: /*#__PURE__*/React.createElement(UploadOutlined, null)
-  }, "nav 3"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "4",
-    icon: /*#__PURE__*/React.createElement(UserOutlined, null)
-  }, "nav 4"))), /*#__PURE__*/React.createElement(Layout, null, /*#__PURE__*/React.createElement(Header, {
-    className: "site-layout-sub-header-background",
-    style: {
-      padding: 0
-    }
-  }), /*#__PURE__*/React.createElement(Content, {
-    style: {
-      margin: '24px 16px 0'
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "site-layout-background",
-    style: {
-      padding: 24,
-      minHeight: 360
-    }
-  }, "content")), /*#__PURE__*/React.createElement(Footer, {
-    style: {
-      textAlign: 'center'
-    }
-  }, "Ant Design \xA92018 Created by Ant UED")));
-};
-
-export default ResponsiveDemo;

package/es/layout/demo/side/index.d.ts

@@ -1,11 +0,0 @@
-/**
- * title: 侧边布局
- * desc: 侧边两列式布局。页面横向空间有限时，侧边导航可收起。
- *
- *   侧边导航在页面布局上采用的是左右的结构，一般主导航放置于页面的左侧固定位置，辅助菜单放置于工作区顶部。内容根据浏览器终端进行自适应，能提高横向空间的使用率，但是整个页面排版不稳定。侧边导航的模式层级扩展性强，一、二、三级导航项目可以更为顺畅且具关联性的被展示，同时侧边导航可以固定，使得用户在操作和浏览中可以快速的定位和切换当前位置，有很高的操作效率。但这类导航横向页面内容的空间会被牺牲一部分。
- *
- *   > 🛎️ 想要 3 分钟实现？试试 [ProLayout](https://procomponents.ant.design/components/layout)！
- */
-import './index.less';
-declare const SideDemo: () => JSX.Element;
-export default SideDemo;

package/es/layout/demo/side/index.js

@@ -1,101 +0,0 @@
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-
-/**
- * title: 侧边布局
- * desc: 侧边两列式布局。页面横向空间有限时，侧边导航可收起。
- *
- *   侧边导航在页面布局上采用的是左右的结构，一般主导航放置于页面的左侧固定位置，辅助菜单放置于工作区顶部。内容根据浏览器终端进行自适应，能提高横向空间的使用率，但是整个页面排版不稳定。侧边导航的模式层级扩展性强，一、二、三级导航项目可以更为顺畅且具关联性的被展示，同时侧边导航可以固定，使得用户在操作和浏览中可以快速的定位和切换当前位置，有很高的操作效率。但这类导航横向页面内容的空间会被牺牲一部分。
- *
- *   > 🛎️ 想要 3 分钟实现？试试 [ProLayout](https://procomponents.ant.design/components/layout)！
- */
-import React, { useState } from 'react';
-import { Layout, Menu, Breadcrumb } from '@fle-ui/next';
-import { DesktopOutlined, PieChartOutlined, FileOutlined, TeamOutlined, UserOutlined } from '@ant-design/icons';
-import './index.less';
-var Header = Layout.Header,
-    Content = Layout.Content,
-    Footer = Layout.Footer,
-    Sider = Layout.Sider;
-var SubMenu = Menu.SubMenu;
-
-var SideDemo = function SideDemo() {
-  var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      collapsed = _useState2[0],
-      setCollapsed = _useState2[1];
-
-  var onCollapse = function onCollapse(collapsed) {
-    console.log(collapsed);
-    setCollapsed(collapsed);
-  };
-
-  return /*#__PURE__*/React.createElement(Layout, {
-    style: {
-      minHeight: '100vh'
-    }
-  }, /*#__PURE__*/React.createElement(Sider, {
-    collapsible: true,
-    collapsed: collapsed,
-    onCollapse: onCollapse
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "logo"
-  }), /*#__PURE__*/React.createElement(Menu, {
-    theme: "dark",
-    defaultSelectedKeys: ['1'],
-    mode: "inline"
-  }, /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "1",
-    icon: /*#__PURE__*/React.createElement(PieChartOutlined, null)
-  }, "Option 1"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "2",
-    icon: /*#__PURE__*/React.createElement(DesktopOutlined, null)
-  }, "Option 2"), /*#__PURE__*/React.createElement(SubMenu, {
-    key: "sub1",
-    icon: /*#__PURE__*/React.createElement(UserOutlined, null),
-    title: "User"
-  }, /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "3"
-  }, "Tom"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "4"
-  }, "Bill"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "5"
-  }, "Alex")), /*#__PURE__*/React.createElement(SubMenu, {
-    key: "sub2",
-    icon: /*#__PURE__*/React.createElement(TeamOutlined, null),
-    title: "Team"
-  }, /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "6"
-  }, "Team 1"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "8"
-  }, "Team 2")), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "9",
-    icon: /*#__PURE__*/React.createElement(FileOutlined, null)
-  }, "Files"))), /*#__PURE__*/React.createElement(Layout, {
-    className: "site-layout"
-  }, /*#__PURE__*/React.createElement(Header, {
-    className: "site-layout-background",
-    style: {
-      padding: 0
-    }
-  }), /*#__PURE__*/React.createElement(Content, {
-    style: {
-      margin: '0 16px'
-    }
-  }, /*#__PURE__*/React.createElement(Breadcrumb, {
-    style: {
-      margin: '16px 0'
-    }
-  }, /*#__PURE__*/React.createElement(Breadcrumb.Item, null, "User"), /*#__PURE__*/React.createElement(Breadcrumb.Item, null, "Bill")), /*#__PURE__*/React.createElement("div", {
-    className: "site-layout-background",
-    style: {
-      padding: 24,
-      minHeight: 360
-    }
-  }, "Bill is a cat.")), /*#__PURE__*/React.createElement(Footer, {
-    style: {
-      textAlign: 'center'
-    }
-  }, "Ant Design \xA92018 Created by Ant UED")));
-};
-
-export default SideDemo;

package/es/layout/demo/top.d.ts

@@ -1,8 +0,0 @@
-/**
- * title: 上中下布局
- * desc: 最基本的『上-中-下』布局。
- *      一般主导航放置于页面的顶端，从左自右依次为：logo、一级导航项、辅助菜单（用户、设置、通知等）。通常将内容放在固定尺寸（例如：1200px）内，整个页面排版稳定，不受用户终端显示器影响；上下级的结构符合用户上下浏览的习惯，也是较为经典的网站导航模式。页面上下切分的方式提高了主工作区域的信息展示效率，但在纵向空间上会有一些牺牲。此外，由于导航栏水平空间的限制，不适合那些一级导航项很多的信息结构。
- *       典型的页面布局。
- */
-declare const TopDemo: () => JSX.Element;
-export default TopDemo;

package/es/layout/demo/top.js

@@ -1,44 +0,0 @@
-/**
- * title: 上中下布局
- * desc: 最基本的『上-中-下』布局。
- *      一般主导航放置于页面的顶端，从左自右依次为：logo、一级导航项、辅助菜单（用户、设置、通知等）。通常将内容放在固定尺寸（例如：1200px）内，整个页面排版稳定，不受用户终端显示器影响；上下级的结构符合用户上下浏览的习惯，也是较为经典的网站导航模式。页面上下切分的方式提高了主工作区域的信息展示效率，但在纵向空间上会有一些牺牲。此外，由于导航栏水平空间的限制，不适合那些一级导航项很多的信息结构。
- *       典型的页面布局。
- */
-import React from 'react';
-import { Layout, Menu, Breadcrumb } from '@fle-ui/next';
-var Header = Layout.Header,
-    Content = Layout.Content,
-    Footer = Layout.Footer;
-
-var TopDemo = function TopDemo() {
-  return /*#__PURE__*/React.createElement(Layout, {
-    className: "layout"
-  }, /*#__PURE__*/React.createElement(Header, null, /*#__PURE__*/React.createElement("div", {
-    className: "logo"
-  }), /*#__PURE__*/React.createElement(Menu, {
-    theme: "dark",
-    mode: "horizontal",
-    defaultSelectedKeys: ['2']
-  }, new Array(15).fill(null).map(function (_, index) {
-    var key = index + 1;
-    return /*#__PURE__*/React.createElement(Menu.Item, {
-      key: key
-    }, "nav ".concat(key));
-  }))), /*#__PURE__*/React.createElement(Content, {
-    style: {
-      padding: '0 50px'
-    }
-  }, /*#__PURE__*/React.createElement(Breadcrumb, {
-    style: {
-      margin: '16px 0'
-    }
-  }, /*#__PURE__*/React.createElement(Breadcrumb.Item, null, "Home"), /*#__PURE__*/React.createElement(Breadcrumb.Item, null, "List"), /*#__PURE__*/React.createElement(Breadcrumb.Item, null, "App")), /*#__PURE__*/React.createElement("div", {
-    className: "site-layout-content"
-  }, "Content")), /*#__PURE__*/React.createElement(Footer, {
-    style: {
-      textAlign: 'center'
-    }
-  }, "Ant Design \xA92018 Created by Ant UED"));
-};
-
-export default TopDemo;

package/es/layout/demo/topSide.d.ts

@@ -1,6 +0,0 @@
-/**
- * title: 顶部-侧边布局
- * desc: 拥有顶部导航及侧边栏的页面，多用于展示类网站。
- */
-declare const TopSideDemo: () => JSX.Element;
-export default TopSideDemo;

package/es/layout/demo/topSide.js

@@ -1,100 +0,0 @@
-/**
- * title: 顶部-侧边布局
- * desc: 拥有顶部导航及侧边栏的页面，多用于展示类网站。
- */
-import React from 'react';
-import { Layout, Menu, Breadcrumb } from '@fle-ui/next';
-import { UserOutlined, LaptopOutlined, NotificationOutlined } from '@ant-design/icons';
-var SubMenu = Menu.SubMenu;
-var Header = Layout.Header,
-    Content = Layout.Content,
-    Footer = Layout.Footer,
-    Sider = Layout.Sider;
-
-var TopSideDemo = function TopSideDemo() {
-  return /*#__PURE__*/React.createElement(Layout, null, /*#__PURE__*/React.createElement(Header, {
-    className: "header"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "logo"
-  }), /*#__PURE__*/React.createElement(Menu, {
-    theme: "dark",
-    mode: "horizontal",
-    defaultSelectedKeys: ['2']
-  }, /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "1"
-  }, "nav 1"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "2"
-  }, "nav 2"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "3"
-  }, "nav 3"))), /*#__PURE__*/React.createElement(Content, {
-    style: {
-      padding: '0 50px'
-    }
-  }, /*#__PURE__*/React.createElement(Breadcrumb, {
-    style: {
-      margin: '16px 0'
-    }
-  }, /*#__PURE__*/React.createElement(Breadcrumb.Item, null, "Home"), /*#__PURE__*/React.createElement(Breadcrumb.Item, null, "List"), /*#__PURE__*/React.createElement(Breadcrumb.Item, null, "App")), /*#__PURE__*/React.createElement(Layout, {
-    className: "site-layout-background",
-    style: {
-      padding: '24px 0'
-    }
-  }, /*#__PURE__*/React.createElement(Sider, {
-    className: "site-layout-background",
-    width: 200
-  }, /*#__PURE__*/React.createElement(Menu, {
-    mode: "inline",
-    defaultSelectedKeys: ['1'],
-    defaultOpenKeys: ['sub1'],
-    style: {
-      height: '100%'
-    }
-  }, /*#__PURE__*/React.createElement(SubMenu, {
-    key: "sub1",
-    icon: /*#__PURE__*/React.createElement(UserOutlined, null),
-    title: "subnav 1"
-  }, /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "1"
-  }, "option1"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "2"
-  }, "option2"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "3"
-  }, "option3"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "4"
-  }, "option4")), /*#__PURE__*/React.createElement(SubMenu, {
-    key: "sub2",
-    icon: /*#__PURE__*/React.createElement(LaptopOutlined, null),
-    title: "subnav 2"
-  }, /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "5"
-  }, "option5"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "6"
-  }, "option6"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "7"
-  }, "option7"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "8"
-  }, "option8")), /*#__PURE__*/React.createElement(SubMenu, {
-    key: "sub3",
-    icon: /*#__PURE__*/React.createElement(NotificationOutlined, null),
-    title: "subnav 3"
-  }, /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "9"
-  }, "option9"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "10"
-  }, "option10"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "11"
-  }, "option11"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "12"
-  }, "option12")))), /*#__PURE__*/React.createElement(Content, {
-    style: {
-      padding: '0 24px',
-      minHeight: 280
-    }
-  }, "Content"))), /*#__PURE__*/React.createElement(Footer, {
-    style: {
-      textAlign: 'center'
-    }
-  }, "Ant Design \xA92018 Created by Ant UED"));
-};
-
-export default TopSideDemo;

package/es/layout/demo/topSide2.d.ts

@@ -1,6 +0,0 @@
-/**
- * title: 顶部-侧边布局-通栏
- * desc: 同样拥有顶部导航及侧边栏，区别是两边未留边距，多用于应用型的网站。
- */
-declare const TopSide2Demo: () => JSX.Element;
-export default TopSide2Demo;

package/es/layout/demo/topSide2.js

@@ -1,93 +0,0 @@
-/**
- * title: 顶部-侧边布局-通栏
- * desc: 同样拥有顶部导航及侧边栏，区别是两边未留边距，多用于应用型的网站。
- */
-import React from 'react';
-import { Layout, Menu, Breadcrumb } from '@fle-ui/next';
-import { UserOutlined, LaptopOutlined, NotificationOutlined } from '@ant-design/icons';
-var SubMenu = Menu.SubMenu;
-var Header = Layout.Header,
-    Content = Layout.Content,
-    Sider = Layout.Sider;
-
-var TopSide2Demo = function TopSide2Demo() {
-  return /*#__PURE__*/React.createElement(Layout, null, /*#__PURE__*/React.createElement(Header, {
-    className: "header"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "logo"
-  }), /*#__PURE__*/React.createElement(Menu, {
-    theme: "dark",
-    mode: "horizontal",
-    defaultSelectedKeys: ['2']
-  }, /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "1"
-  }, "nav 1"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "2"
-  }, "nav 2"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "3"
-  }, "nav 3"))), /*#__PURE__*/React.createElement(Layout, null, /*#__PURE__*/React.createElement(Sider, {
-    width: 200,
-    className: "site-layout-background"
-  }, /*#__PURE__*/React.createElement(Menu, {
-    mode: "inline",
-    defaultSelectedKeys: ['1'],
-    defaultOpenKeys: ['sub1'],
-    style: {
-      height: '100%',
-      borderRight: 0
-    }
-  }, /*#__PURE__*/React.createElement(SubMenu, {
-    key: "sub1",
-    icon: /*#__PURE__*/React.createElement(UserOutlined, null),
-    title: "subnav 1"
-  }, /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "1"
-  }, "option1"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "2"
-  }, "option2"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "3"
-  }, "option3"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "4"
-  }, "option4")), /*#__PURE__*/React.createElement(SubMenu, {
-    key: "sub2",
-    icon: /*#__PURE__*/React.createElement(LaptopOutlined, null),
-    title: "subnav 2"
-  }, /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "5"
-  }, "option5"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "6"
-  }, "option6"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "7"
-  }, "option7"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "8"
-  }, "option8")), /*#__PURE__*/React.createElement(SubMenu, {
-    key: "sub3",
-    icon: /*#__PURE__*/React.createElement(NotificationOutlined, null),
-    title: "subnav 3"
-  }, /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "9"
-  }, "option9"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "10"
-  }, "option10"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "11"
-  }, "option11"), /*#__PURE__*/React.createElement(Menu.Item, {
-    key: "12"
-  }, "option12")))), /*#__PURE__*/React.createElement(Layout, {
-    style: {
-      padding: '0 24px 24px'
-    }
-  }, /*#__PURE__*/React.createElement(Breadcrumb, {
-    style: {
-      margin: '16px 0'
-    }
-  }, /*#__PURE__*/React.createElement(Breadcrumb.Item, null, "Home"), /*#__PURE__*/React.createElement(Breadcrumb.Item, null, "List"), /*#__PURE__*/React.createElement(Breadcrumb.Item, null, "App")), /*#__PURE__*/React.createElement(Content, {
-    className: "site-layout-background",
-    style: {
-      padding: 24,
-      margin: 0,
-      minHeight: 280
-    }
-  }, "Content"))));
-};
-
-export default TopSide2Demo;