1 | 'use strict';
|
2 |
|
3 | Object.defineProperty(exports, "__esModule", {
|
4 | value: true
|
5 | });
|
6 |
|
7 | var _extends2 = require('babel-runtime/helpers/extends');
|
8 |
|
9 | var _extends3 = _interopRequireDefault(_extends2);
|
10 |
|
11 | var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
|
12 |
|
13 | var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
|
14 |
|
15 | var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
|
16 |
|
17 | var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
|
18 |
|
19 | var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
|
20 |
|
21 | var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
|
22 |
|
23 | var _createClass2 = require('babel-runtime/helpers/createClass');
|
24 |
|
25 | var _createClass3 = _interopRequireDefault(_createClass2);
|
26 |
|
27 | var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
|
28 |
|
29 | var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
|
30 |
|
31 | var _inherits2 = require('babel-runtime/helpers/inherits');
|
32 |
|
33 | var _inherits3 = _interopRequireDefault(_inherits2);
|
34 |
|
35 | var _simpleAssign = require('simple-assign');
|
36 |
|
37 | var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
|
38 |
|
39 | var _react = require('react');
|
40 |
|
41 | var _react2 = _interopRequireDefault(_react);
|
42 |
|
43 | var _propTypes = require('prop-types');
|
44 |
|
45 | var _propTypes2 = _interopRequireDefault(_propTypes);
|
46 |
|
47 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
48 |
|
49 | function getStyles(props, context) {
|
50 | var firstChild = props.firstChild,
|
51 | lastChild = props.lastChild;
|
52 | var _context$muiTheme = context.muiTheme,
|
53 | baseTheme = _context$muiTheme.baseTheme,
|
54 | button = _context$muiTheme.button,
|
55 | toolbar = _context$muiTheme.toolbar;
|
56 |
|
57 |
|
58 | var marginHorizontal = baseTheme.spacing.desktopGutter;
|
59 | var marginVertical = (toolbar.height - button.height) / 2;
|
60 |
|
61 | var styles = {
|
62 | root: {
|
63 | position: 'relative',
|
64 | marginLeft: firstChild ? -marginHorizontal : undefined,
|
65 | marginRight: lastChild ? -marginHorizontal : undefined,
|
66 | display: 'flex',
|
67 | justifyContent: 'space-between',
|
68 | alignItems: 'center'
|
69 | },
|
70 | dropDownMenu: {
|
71 | root: {
|
72 | color: toolbar.color,
|
73 | marginRight: baseTheme.spacing.desktopGutter,
|
74 | flex: 1,
|
75 | whiteSpace: 'nowrap'
|
76 | },
|
77 | controlBg: {
|
78 | backgroundColor: toolbar.menuHoverColor,
|
79 | borderRadius: 0
|
80 | },
|
81 | underline: {
|
82 | display: 'none'
|
83 | }
|
84 | },
|
85 | button: {
|
86 | margin: marginVertical + 'px ' + marginHorizontal + 'px',
|
87 | position: 'relative'
|
88 | },
|
89 | icon: {
|
90 | root: {
|
91 | cursor: 'pointer',
|
92 | lineHeight: toolbar.height + 'px',
|
93 | paddingLeft: baseTheme.spacing.desktopGutter
|
94 | }
|
95 | },
|
96 | span: {
|
97 | color: toolbar.iconColor,
|
98 | lineHeight: toolbar.height + 'px'
|
99 | }
|
100 | };
|
101 |
|
102 | return styles;
|
103 | }
|
104 |
|
105 | var ToolbarGroup = function (_Component) {
|
106 | (0, _inherits3.default)(ToolbarGroup, _Component);
|
107 |
|
108 | function ToolbarGroup() {
|
109 | (0, _classCallCheck3.default)(this, ToolbarGroup);
|
110 | return (0, _possibleConstructorReturn3.default)(this, (ToolbarGroup.__proto__ || (0, _getPrototypeOf2.default)(ToolbarGroup)).apply(this, arguments));
|
111 | }
|
112 |
|
113 | (0, _createClass3.default)(ToolbarGroup, [{
|
114 | key: 'handleMouseLeaveFontIcon',
|
115 | value: function handleMouseLeaveFontIcon(style) {
|
116 | return function (event) {
|
117 | event.target.style.zIndex = 'auto';
|
118 | event.target.style.color = style.root.color;
|
119 | };
|
120 | }
|
121 | }, {
|
122 | key: 'render',
|
123 | value: function render() {
|
124 | var _this2 = this;
|
125 |
|
126 | var _props = this.props,
|
127 | children = _props.children,
|
128 | className = _props.className,
|
129 | firstChild = _props.firstChild,
|
130 | lastChild = _props.lastChild,
|
131 | style = _props.style,
|
132 | other = (0, _objectWithoutProperties3.default)(_props, ['children', 'className', 'firstChild', 'lastChild', 'style']);
|
133 | var prepareStyles = this.context.muiTheme.prepareStyles;
|
134 |
|
135 | var styles = getStyles(this.props, this.context);
|
136 |
|
137 | var newChildren = _react2.default.Children.map(children, function (currentChild) {
|
138 | if (!currentChild) {
|
139 | return null;
|
140 | }
|
141 | if (!currentChild.type) {
|
142 | return currentChild;
|
143 | }
|
144 | switch (currentChild.type.muiName) {
|
145 | case 'DropDownMenu':
|
146 | return _react2.default.cloneElement(currentChild, {
|
147 | style: (0, _simpleAssign2.default)({}, styles.dropDownMenu.root, currentChild.props.style),
|
148 | underlineStyle: styles.dropDownMenu.underline
|
149 | });
|
150 | case 'RaisedButton':
|
151 | case 'FlatButton':
|
152 | return _react2.default.cloneElement(currentChild, {
|
153 | style: (0, _simpleAssign2.default)({}, styles.button, currentChild.props.style)
|
154 | });
|
155 | case 'FontIcon':
|
156 | return _react2.default.cloneElement(currentChild, {
|
157 | style: (0, _simpleAssign2.default)({}, styles.icon.root, currentChild.props.style),
|
158 | color: currentChild.props.color || _this2.context.muiTheme.toolbar.iconColor,
|
159 | hoverColor: currentChild.props.hoverColor || _this2.context.muiTheme.toolbar.hoverColor
|
160 | });
|
161 | case 'ToolbarSeparator':
|
162 | case 'ToolbarTitle':
|
163 | return _react2.default.cloneElement(currentChild, {
|
164 | style: (0, _simpleAssign2.default)({}, styles.span, currentChild.props.style)
|
165 | });
|
166 | default:
|
167 | return currentChild;
|
168 | }
|
169 | }, this);
|
170 |
|
171 | return _react2.default.createElement(
|
172 | 'div',
|
173 | (0, _extends3.default)({}, other, { className: className, style: prepareStyles((0, _simpleAssign2.default)({}, styles.root, style)) }),
|
174 | newChildren
|
175 | );
|
176 | }
|
177 | }]);
|
178 | return ToolbarGroup;
|
179 | }(_react.Component);
|
180 |
|
181 | ToolbarGroup.defaultProps = {
|
182 | firstChild: false,
|
183 | lastChild: false
|
184 | };
|
185 | ToolbarGroup.contextTypes = {
|
186 | muiTheme: _propTypes2.default.object.isRequired
|
187 | };
|
188 | ToolbarGroup.propTypes = process.env.NODE_ENV !== "production" ? {
|
189 | |
190 |
|
191 |
|
192 | children: _propTypes2.default.node,
|
193 | |
194 |
|
195 |
|
196 | className: _propTypes2.default.string,
|
197 | |
198 |
|
199 |
|
200 |
|
201 | firstChild: _propTypes2.default.bool,
|
202 | |
203 |
|
204 |
|
205 |
|
206 | lastChild: _propTypes2.default.bool,
|
207 | |
208 |
|
209 |
|
210 | style: _propTypes2.default.object
|
211 | } : {};
|
212 | exports.default = ToolbarGroup; |
\ | No newline at end of file |