Vous ne pouvez pas sélectionner plus de 25 sujets Les noms de sujets doivent commencer par une lettre ou un nombre, peuvent contenir des tirets ('-') et peuvent comporter jusqu'à 35 caractères.
 
 
 
 

172 lignes
5.2 KiB

  1. 'use strict';
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
  6. var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
  7. var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
  8. var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
  9. var _createClass2 = require('babel-runtime/helpers/createClass');
  10. var _createClass3 = _interopRequireDefault(_createClass2);
  11. var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
  12. var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
  13. var _inherits2 = require('babel-runtime/helpers/inherits');
  14. var _inherits3 = _interopRequireDefault(_inherits2);
  15. var _simpleAssign = require('simple-assign');
  16. var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
  17. var _transitions = require('../styles/transitions');
  18. var _transitions2 = _interopRequireDefault(_transitions);
  19. var _react = require('react');
  20. var _react2 = _interopRequireDefault(_react);
  21. var _propTypes = require('prop-types');
  22. var _propTypes2 = _interopRequireDefault(_propTypes);
  23. var _propTypes3 = require('../utils/propTypes');
  24. var _propTypes4 = _interopRequireDefault(_propTypes3);
  25. var _Paper = require('../Paper');
  26. var _Paper2 = _interopRequireDefault(_Paper);
  27. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  28. function getStyles(props, context, state) {
  29. var targetOrigin = props.targetOrigin;
  30. var open = state.open;
  31. var muiTheme = context.muiTheme;
  32. var horizontal = targetOrigin.horizontal.replace('middle', 'vertical');
  33. return {
  34. root: {
  35. position: 'fixed',
  36. zIndex: muiTheme.zIndex.popover,
  37. opacity: open ? 1 : 0,
  38. transform: open ? 'scale(1, 1)' : 'scale(0, 0)',
  39. transformOrigin: horizontal + ' ' + targetOrigin.vertical,
  40. transition: _transitions2.default.easeOut('250ms', ['transform', 'opacity']),
  41. maxHeight: '100%'
  42. },
  43. horizontal: {
  44. maxHeight: '100%',
  45. overflowY: 'auto',
  46. transform: open ? 'scaleX(1)' : 'scaleX(0)',
  47. opacity: open ? 1 : 0,
  48. transformOrigin: horizontal + ' ' + targetOrigin.vertical,
  49. transition: _transitions2.default.easeOut('250ms', ['transform', 'opacity'])
  50. },
  51. vertical: {
  52. opacity: open ? 1 : 0,
  53. transform: open ? 'scaleY(1)' : 'scaleY(0)',
  54. transformOrigin: horizontal + ' ' + targetOrigin.vertical,
  55. transition: _transitions2.default.easeOut('500ms', ['transform', 'opacity'])
  56. }
  57. };
  58. }
  59. var PopoverAnimationDefault = function (_Component) {
  60. (0, _inherits3.default)(PopoverAnimationDefault, _Component);
  61. function PopoverAnimationDefault() {
  62. var _ref;
  63. var _temp, _this, _ret;
  64. (0, _classCallCheck3.default)(this, PopoverAnimationDefault);
  65. for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
  66. args[_key] = arguments[_key];
  67. }
  68. return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref = PopoverAnimationDefault.__proto__ || (0, _getPrototypeOf2.default)(PopoverAnimationDefault)).call.apply(_ref, [this].concat(args))), _this), _this.state = {
  69. open: false
  70. }, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
  71. }
  72. (0, _createClass3.default)(PopoverAnimationDefault, [{
  73. key: 'componentDidMount',
  74. value: function componentDidMount() {
  75. this.setState({ open: true }); // eslint-disable-line react/no-did-mount-set-state
  76. }
  77. }, {
  78. key: 'componentWillReceiveProps',
  79. value: function componentWillReceiveProps(nextProps) {
  80. this.setState({
  81. open: nextProps.open
  82. });
  83. }
  84. }, {
  85. key: 'render',
  86. value: function render() {
  87. var _props = this.props,
  88. className = _props.className,
  89. style = _props.style,
  90. zDepth = _props.zDepth;
  91. var prepareStyles = this.context.muiTheme.prepareStyles;
  92. var styles = getStyles(this.props, this.context, this.state);
  93. return _react2.default.createElement(
  94. _Paper2.default,
  95. {
  96. style: (0, _simpleAssign2.default)(styles.root, style),
  97. zDepth: zDepth,
  98. className: className
  99. },
  100. _react2.default.createElement(
  101. 'div',
  102. { style: prepareStyles(styles.horizontal) },
  103. _react2.default.createElement(
  104. 'div',
  105. { style: prepareStyles(styles.vertical) },
  106. this.props.children
  107. )
  108. )
  109. );
  110. }
  111. }]);
  112. return PopoverAnimationDefault;
  113. }(_react.Component);
  114. PopoverAnimationDefault.defaultProps = {
  115. style: {},
  116. zDepth: 1
  117. };
  118. PopoverAnimationDefault.contextTypes = {
  119. muiTheme: _propTypes2.default.object.isRequired
  120. };
  121. PopoverAnimationDefault.propTypes = process.env.NODE_ENV !== "production" ? {
  122. children: _propTypes2.default.node,
  123. /**
  124. * The css class name of the root element.
  125. */
  126. className: _propTypes2.default.string,
  127. open: _propTypes2.default.bool.isRequired,
  128. /**
  129. * Override the inline-styles of the root element.
  130. */
  131. style: _propTypes2.default.object,
  132. targetOrigin: _propTypes4.default.origin.isRequired,
  133. zDepth: _propTypes4.default.zDepth
  134. } : {};
  135. exports.default = PopoverAnimationDefault;