import React from 'react';
import ReactDOM from 'react-dom';
import Shell from '..';
import { Icon, Nav } from '../..';
const { Item, SubNav } = Nav;
class App extends React.Component {
    render() {
        return (React.createElement("div", null,
            React.createElement(Shell, { className: 'iframe-hack', style: { border: '1px solid #eee' } },
                React.createElement(Shell.Branding, null,
                    React.createElement("div", { className: "rectangular" }),
                    React.createElement("span", { style: { marginLeft: 10 } }, "App Name")),
                React.createElement(Shell.Navigation, { direction: "hoz", align: "left" },
                    React.createElement(Nav, { direction: "hoz", type: "secondary", triggerType: "hover" },
                        React.createElement(Item, { key: "item_1" }, "\u4EA7\u54C1\u7C7B\u76EE\u4E00"),
                        React.createElement(Item, { key: "item_2" }, "\u4EA7\u54C1\u7C7B\u76EE\u4E8C"),
                        React.createElement(Item, { key: "item_3" }, "\u4EA7\u54C1\u7C7B\u76EE\u4E09"),
                        React.createElement(Item, { key: "item_4" }, "\u4EA7\u54C1\u7C7B\u76EE\u56DB"),
                        React.createElement(Item, { key: "item_5" }, "\u4EA7\u54C1\u7C7B\u76EE\u4E94"),
                        React.createElement(SubNav, { label: "\u4EA7\u54C1\u7C7B\u76EE\u516D", noIcon: true },
                            React.createElement(Item, { key: "item_a" }, "\u9009\u9879A"),
                            React.createElement(Item, { key: "item_b" }, "\u9009\u9879B"),
                            React.createElement(Item, { key: "item_c" }, "\u9009\u9879C"),
                            React.createElement(Item, { key: "item_d" }, "\u9009\u9879D")))),
                React.createElement(Shell.Action, null,
                    React.createElement(Icon, { type: "ic_tongzhi" }),
                    React.createElement("img", { src: "https://img.alicdn.com/tfs/TB1.ZBecq67gK0jSZFHXXa9jVXa-904-826.png", className: "avatar", alt: "\u7528\u6237\u5934\u50CF" }),
                    React.createElement("span", { style: { marginLeft: 10 } }, "MyName")),
                React.createElement(Shell.Content, null,
                    React.createElement("div", { style: { minHeight: 1200, background: '#fff' } })),
                React.createElement(Shell.Footer, null,
                    React.createElement("span", null, "Alibaba Fusion"),
                    React.createElement("span", null, "@ 2019 Alibaba Piecework \u7248\u6743\u6240\u6709")))));
    }
}
ReactDOM.render(React.createElement(App, null), document.getElementById('shell-demo-1'));
