Nie możesz wybrać więcej, niż 25 tematów Tematy muszą się zaczynać od litery lub cyfry, mogą zawierać myślniki ('-') i mogą mieć do 35 znaków.
 
 
 
 

170 wiersze
4.8 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 backgroundColor = props.backgroundColor,
  28. color = props.color,
  29. size = props.size;
  30. var avatar = context.muiTheme.avatar;
  31. var styles = {
  32. root: {
  33. color: color || avatar.color,
  34. backgroundColor: backgroundColor || avatar.backgroundColor,
  35. userSelect: 'none',
  36. display: 'inline-flex',
  37. alignItems: 'center',
  38. justifyContent: 'center',
  39. fontSize: size / 2,
  40. borderRadius: '50%',
  41. height: size,
  42. width: size
  43. },
  44. icon: {
  45. color: color || avatar.color,
  46. width: size * 0.6,
  47. height: size * 0.6,
  48. fontSize: size * 0.6,
  49. margin: size * 0.2
  50. }
  51. };
  52. return styles;
  53. }
  54. var Avatar = function (_Component) {
  55. (0, _inherits3.default)(Avatar, _Component);
  56. function Avatar() {
  57. (0, _classCallCheck3.default)(this, Avatar);
  58. return (0, _possibleConstructorReturn3.default)(this, (Avatar.__proto__ || (0, _getPrototypeOf2.default)(Avatar)).apply(this, arguments));
  59. }
  60. (0, _createClass3.default)(Avatar, [{
  61. key: 'render',
  62. value: function render() {
  63. var _props = this.props,
  64. backgroundColor = _props.backgroundColor,
  65. icon = _props.icon,
  66. src = _props.src,
  67. style = _props.style,
  68. className = _props.className,
  69. other = (0, _objectWithoutProperties3.default)(_props, ['backgroundColor', 'icon', 'src', 'style', 'className']);
  70. var prepareStyles = this.context.muiTheme.prepareStyles;
  71. var styles = getStyles(this.props, this.context);
  72. if (src) {
  73. return _react2.default.createElement('img', (0, _extends3.default)({
  74. style: prepareStyles((0, _simpleAssign2.default)(styles.root, style))
  75. }, other, {
  76. src: src,
  77. className: className
  78. }));
  79. } else {
  80. return _react2.default.createElement(
  81. 'div',
  82. (0, _extends3.default)({}, other, {
  83. style: prepareStyles((0, _simpleAssign2.default)(styles.root, style)),
  84. className: className
  85. }),
  86. icon && _react2.default.cloneElement(icon, {
  87. color: styles.icon.color,
  88. style: (0, _simpleAssign2.default)(styles.icon, icon.props.style)
  89. }),
  90. this.props.children
  91. );
  92. }
  93. }
  94. }]);
  95. return Avatar;
  96. }(_react.Component);
  97. Avatar.muiName = 'Avatar';
  98. Avatar.defaultProps = {
  99. size: 40
  100. };
  101. Avatar.contextTypes = {
  102. muiTheme: _propTypes2.default.object.isRequired
  103. };
  104. Avatar.propTypes = process.env.NODE_ENV !== "production" ? {
  105. /**
  106. * The backgroundColor of the avatar. Does not apply to image avatars.
  107. */
  108. backgroundColor: _propTypes2.default.string,
  109. /**
  110. * Can be used, for instance, to render a letter inside the avatar.
  111. */
  112. children: _propTypes2.default.node,
  113. /**
  114. * The css class name of the root `div` or `img` element.
  115. */
  116. className: _propTypes2.default.string,
  117. /**
  118. * The icon or letter's color.
  119. */
  120. color: _propTypes2.default.string,
  121. /**
  122. * This is the SvgIcon or FontIcon to be used inside the avatar.
  123. */
  124. icon: _propTypes2.default.element,
  125. /**
  126. * This is the size of the avatar in pixels.
  127. */
  128. size: _propTypes2.default.number,
  129. /**
  130. * If passed in, this component will render an img element. Otherwise, a div will be rendered.
  131. */
  132. src: _propTypes2.default.string,
  133. /**
  134. * Override the inline-styles of the root element.
  135. */
  136. style: _propTypes2.default.object
  137. } : {};
  138. exports.default = Avatar;