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

170 строки
5.0 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. var _reactDom = require('react-dom');
  26. var _reactDom2 = _interopRequireDefault(_reactDom);
  27. var _autoPrefix = require('../utils/autoPrefix');
  28. var _autoPrefix2 = _interopRequireDefault(_autoPrefix);
  29. var _transitions = require('../styles/transitions');
  30. var _transitions2 = _interopRequireDefault(_transitions);
  31. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  32. var ScaleInChild = function (_Component) {
  33. (0, _inherits3.default)(ScaleInChild, _Component);
  34. function ScaleInChild() {
  35. (0, _classCallCheck3.default)(this, ScaleInChild);
  36. return (0, _possibleConstructorReturn3.default)(this, (ScaleInChild.__proto__ || (0, _getPrototypeOf2.default)(ScaleInChild)).apply(this, arguments));
  37. }
  38. (0, _createClass3.default)(ScaleInChild, [{
  39. key: 'componentWillUnmount',
  40. value: function componentWillUnmount() {
  41. clearTimeout(this.enterTimer);
  42. clearTimeout(this.leaveTimer);
  43. }
  44. }, {
  45. key: 'componentWillAppear',
  46. value: function componentWillAppear(callback) {
  47. this.initializeAnimation(callback);
  48. }
  49. }, {
  50. key: 'componentWillEnter',
  51. value: function componentWillEnter(callback) {
  52. this.initializeAnimation(callback);
  53. }
  54. }, {
  55. key: 'componentDidAppear',
  56. value: function componentDidAppear() {
  57. this.animate();
  58. }
  59. }, {
  60. key: 'componentDidEnter',
  61. value: function componentDidEnter() {
  62. this.animate();
  63. }
  64. }, {
  65. key: 'componentWillLeave',
  66. value: function componentWillLeave(callback) {
  67. var style = _reactDom2.default.findDOMNode(this).style;
  68. style.opacity = '0';
  69. _autoPrefix2.default.set(style, 'transform', 'scale(' + this.props.minScale + ')');
  70. this.leaveTimer = setTimeout(callback, 450);
  71. }
  72. }, {
  73. key: 'animate',
  74. value: function animate() {
  75. var style = _reactDom2.default.findDOMNode(this).style;
  76. style.opacity = '1';
  77. _autoPrefix2.default.set(style, 'transform', 'scale(' + this.props.maxScale + ')');
  78. }
  79. }, {
  80. key: 'initializeAnimation',
  81. value: function initializeAnimation(callback) {
  82. var style = _reactDom2.default.findDOMNode(this).style;
  83. style.opacity = '0';
  84. _autoPrefix2.default.set(style, 'transform', 'scale(0)');
  85. this.enterTimer = setTimeout(callback, this.props.enterDelay);
  86. }
  87. }, {
  88. key: 'render',
  89. value: function render() {
  90. var _props = this.props,
  91. children = _props.children,
  92. enterDelay = _props.enterDelay,
  93. maxScale = _props.maxScale,
  94. minScale = _props.minScale,
  95. style = _props.style,
  96. other = (0, _objectWithoutProperties3.default)(_props, ['children', 'enterDelay', 'maxScale', 'minScale', 'style']);
  97. var prepareStyles = this.context.muiTheme.prepareStyles;
  98. var mergedRootStyles = (0, _simpleAssign2.default)({}, {
  99. position: 'absolute',
  100. height: '100%',
  101. width: '100%',
  102. top: 0,
  103. left: 0,
  104. transition: _transitions2.default.easeOut(null, ['transform', 'opacity'])
  105. }, style);
  106. return _react2.default.createElement(
  107. 'div',
  108. (0, _extends3.default)({}, other, { style: prepareStyles(mergedRootStyles) }),
  109. children
  110. );
  111. }
  112. }]);
  113. return ScaleInChild;
  114. }(_react.Component);
  115. ScaleInChild.defaultProps = {
  116. enterDelay: 0,
  117. maxScale: 1,
  118. minScale: 0
  119. };
  120. ScaleInChild.contextTypes = {
  121. muiTheme: _propTypes2.default.object.isRequired
  122. };
  123. ScaleInChild.propTypes = process.env.NODE_ENV !== "production" ? {
  124. children: _propTypes2.default.node,
  125. enterDelay: _propTypes2.default.number,
  126. maxScale: _propTypes2.default.number,
  127. minScale: _propTypes2.default.number,
  128. style: _propTypes2.default.object
  129. } : {};
  130. exports.default = ScaleInChild;