@wix/design-system
Version:
@wix/design-system
168 lines (167 loc) • 5.44 kB
JavaScript
var _classCallCheck = require("@babel/runtime/helpers/classCallCheck");
var _createClass = require("@babel/runtime/helpers/createClass");
var _possibleConstructorReturn = require("@babel/runtime/helpers/possibleConstructorReturn");
var _getPrototypeOf = require("@babel/runtime/helpers/getPrototypeOf");
var _inherits = require("@babel/runtime/helpers/inherits");
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/esm/Sidebar/docs/InnerMenuExample.jsx";
function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
/* eslint-disable */
var InnerMenuExample = /*#__PURE__*/function (_React$Component) {
"use strict";
function InnerMenuExample(props) {
var _this;
_classCallCheck(this, InnerMenuExample);
_this = _callSuper(this, InnerMenuExample, [props]);
_this.state = {
isHidden: false
};
_this.onClick = _this.onClick.bind(_this);
return _this;
}
_inherits(InnerMenuExample, _React$Component);
return _createClass(InnerMenuExample, [{
key: "render",
value: function render() {
return /*#__PURE__*/React.createElement("div", {
style: {
overflow: 'hidden',
height: '500px',
color: 'white'
},
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 11,
columnNumber: 7
}
}, /*#__PURE__*/React.createElement(Sidebar, {
selectedKey: 'item1',
isHidden: this.state.isHidden,
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 12,
columnNumber: 9
}
}, /*#__PURE__*/React.createElement(Sidebar.PersistentHeader, {
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 13,
columnNumber: 11
}
}, /*#__PURE__*/React.createElement("div", {
style: {
textAlign: 'center',
fontSize: '20px',
margin: '10px'
},
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 14,
columnNumber: 13
}
}, "Inner Menu Sidebar")), /*#__PURE__*/React.createElement(SidebarSectionItem, {
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 21,
columnNumber: 11
}
}, "Item 1"), /*#__PURE__*/React.createElement(SidebarSectionItem, {
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 24,
columnNumber: 11
}
}, "Item 2"), /*#__PURE__*/React.createElement(Sidebar.Item, {
itemKey: 'apps',
innerMenu: [/*#__PURE__*/React.createElement(Sidebar.BackButton, {
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 31,
columnNumber: 15
}
}, /*#__PURE__*/React.createElement(SidebarBackButton, {
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 32,
columnNumber: 17
}
}, "Main Menu")), /*#__PURE__*/React.createElement(SidebarSectionItem, {
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 36,
columnNumber: 15
}
}, "Inner item 1"), /*#__PURE__*/React.createElement(SidebarSectionItem, {
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 39,
columnNumber: 15
}
}, "Inner item 2")],
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 28,
columnNumber: 11
}
}, /*#__PURE__*/React.createElement(SidebarSectionItem, {
drillable: true,
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 44,
columnNumber: 13
}
}, "Inner Menu")), /*#__PURE__*/React.createElement(Sidebar.PersistentFooter, {
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 49,
columnNumber: 11
}
}, /*#__PURE__*/React.createElement("div", {
style: {
textAlign: 'center',
fontSize: '20px',
margin: '10px'
},
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 50,
columnNumber: 13
}
}, "Inner Menu Footer"))), /*#__PURE__*/React.createElement("button", {
style: {
position: 'absolute',
left: '300px',
top: '50%'
},
onClick: this.onClick,
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 58,
columnNumber: 9
}
}, "Toggle"));
}
}, {
key: "onClick",
value: function onClick() {
this.setState({
isHidden: !this.state.isHidden
});
}
}]);
}(React.Component);