25'ten fazla konu seçemezsiniz Konular bir harf veya rakamla başlamalı, kısa çizgiler ('-') içerebilir ve en fazla 35 karakter uzunluğunda olabilir.
 
 
 
 

212 satır
6.6 KiB

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