Вы не можете выбрать более 25 тем Темы должны начинаться с буквы или цифры, могут содержать дефисы(-) и должны содержать не более 35 символов.

3 лет назад
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210
  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. var _EnhancedButton = require('../internal/EnhancedButton');
  26. var _EnhancedButton2 = _interopRequireDefault(_EnhancedButton);
  27. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  28. function getStyles(props, context) {
  29. var tabs = context.muiTheme.tabs;
  30. return {
  31. root: {
  32. color: props.selected ? tabs.selectedTextColor : tabs.textColor,
  33. fontWeight: 500,
  34. fontSize: 14,
  35. width: props.width,
  36. textTransform: 'uppercase',
  37. padding: 0
  38. },
  39. button: {
  40. display: 'flex',
  41. flexDirection: 'column',
  42. alignItems: 'center',
  43. justifyContent: 'center',
  44. height: props.label && props.icon ? 72 : 48
  45. }
  46. };
  47. }
  48. var Tab = function (_Component) {
  49. (0, _inherits3.default)(Tab, _Component);
  50. function Tab() {
  51. var _ref;
  52. var _temp, _this, _ret;
  53. (0, _classCallCheck3.default)(this, Tab);
  54. for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
  55. args[_key] = arguments[_key];
  56. }
  57. return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref = Tab.__proto__ || (0, _getPrototypeOf2.default)(Tab)).call.apply(_ref, [this].concat(args))), _this), _this.handleClick = function (event) {
  58. if (_this.props.onClick) {
  59. _this.props.onClick(_this.props.value, event, _this);
  60. }
  61. }, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
  62. }
  63. (0, _createClass3.default)(Tab, [{
  64. key: 'render',
  65. value: function render() {
  66. var _props = this.props,
  67. icon = _props.icon,
  68. index = _props.index,
  69. onActive = _props.onActive,
  70. onClick = _props.onClick,
  71. selected = _props.selected,
  72. label = _props.label,
  73. buttonStyle = _props.buttonStyle,
  74. style = _props.style,
  75. value = _props.value,
  76. width = _props.width,
  77. other = (0, _objectWithoutProperties3.default)(_props, ['icon', 'index', 'onActive', 'onClick', 'selected', 'label', 'buttonStyle', 'style', 'value', 'width']);
  78. var styles = getStyles(this.props, this.context);
  79. var iconElement = void 0;
  80. if (icon && _react2.default.isValidElement(icon)) {
  81. iconElement = _react2.default.cloneElement(icon, {
  82. style: {
  83. fontSize: 24,
  84. color: icon.props && icon.props.style && icon.props.style.color ? icon.props.style.color : styles.root.color,
  85. marginBottom: label ? 5 : 0
  86. }
  87. });
  88. }
  89. var rippleOpacity = 0.3;
  90. var rippleColor = this.context.muiTheme.tabs.selectedTextColor;
  91. return _react2.default.createElement(
  92. _EnhancedButton2.default,
  93. (0, _extends3.default)({}, other, {
  94. style: (0, _simpleAssign2.default)(styles.root, style),
  95. focusRippleColor: rippleColor,
  96. touchRippleColor: rippleColor,
  97. focusRippleOpacity: rippleOpacity,
  98. touchRippleOpacity: rippleOpacity,
  99. onClick: this.handleClick
  100. }),
  101. _react2.default.createElement(
  102. 'div',
  103. { style: (0, _simpleAssign2.default)(styles.button, buttonStyle) },
  104. iconElement,
  105. label
  106. )
  107. );
  108. }
  109. }]);
  110. return Tab;
  111. }(_react.Component);
  112. Tab.muiName = 'Tab';
  113. Tab.contextTypes = {
  114. muiTheme: _propTypes2.default.object.isRequired
  115. };
  116. Tab.propTypes = process.env.NODE_ENV !== "production" ? {
  117. /**
  118. * Override the inline-styles of the button element.
  119. */
  120. buttonStyle: _propTypes2.default.object,
  121. /**
  122. * The css class name of the root element.
  123. */
  124. className: _propTypes2.default.string,
  125. /**
  126. * Sets the icon of the tab, you can pass `FontIcon` or `SvgIcon` elements.
  127. */
  128. icon: _propTypes2.default.node,
  129. /**
  130. * @ignore
  131. */
  132. index: _propTypes2.default.any,
  133. /**
  134. * Sets the text value of the tab item to the string specified.
  135. */
  136. label: _propTypes2.default.node,
  137. /**
  138. * Fired when the active tab changes by touch or tap.
  139. * Use this event to specify any functionality when an active tab changes.
  140. * For example - we are using this to route to home when the third tab becomes active.
  141. * This function will always recieve the active tab as it\'s first argument.
  142. */
  143. onActive: _propTypes2.default.func,
  144. /**
  145. * @ignore
  146. * This property is overriden by the Tabs component.
  147. */
  148. onClick: _propTypes2.default.func,
  149. /**
  150. * @ignore
  151. * Defines if the current tab is selected or not.
  152. * The Tabs component is responsible for setting this property.
  153. */
  154. selected: _propTypes2.default.bool,
  155. /**
  156. * Override the inline-styles of the root element.
  157. */
  158. style: _propTypes2.default.object,
  159. /**
  160. * If value prop passed to Tabs component, this value prop is also required.
  161. * It assigns a value to the tab so that it can be selected by the Tabs.
  162. */
  163. value: _propTypes2.default.any,
  164. /**
  165. * @ignore
  166. * This property is overriden by the Tabs component.
  167. */
  168. width: _propTypes2.default.string
  169. } : {};
  170. exports.default = Tab;