UNPKG

@6thquake/react-material

Version:

React components that implement Google's Material Design.

149 lines (114 loc) 4.08 kB
"use strict"; var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard"); var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")); var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck")); var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass")); var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn")); var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf")); var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits")); var _react = _interopRequireWildcard(require("react")); var _propTypes = _interopRequireDefault(require("prop-types")); var _withStyles = _interopRequireDefault(require("../styles/withStyles")); var _Snackbar = _interopRequireDefault(require("../Snackbar")); var _transitions = require("../transitions"); var styles = function styles(theme) { return { snackbar: { margin: theme.spacing(1) } }; }; var Message = /*#__PURE__*/ function (_Component) { (0, _inherits2.default)(Message, _Component); function Message() { var _getPrototypeOf2; var _this; (0, _classCallCheck2.default)(this, Message); for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { args[_key] = arguments[_key]; } _this = (0, _possibleConstructorReturn2.default)(this, (_getPrototypeOf2 = (0, _getPrototypeOf3.default)(Message)).call.apply(_getPrototypeOf2, [this].concat(args))); _this._transition = function (props) { switch (_this.props.animation) { case 'fade': return _react.default.createElement(_transitions.Fade, props); break; case 'slide': return _react.default.createElement(_transitions.Slide, (0, _extends2.default)({ direction: "up" }, props)); break; case 'collapse': return _react.default.createElement(_transitions.Collapse, props); break; case 'grow': return _react.default.createElement(_transitions.Grow, props); break; case 'zoom': return _react.default.createElement(_transitions.Zoom, props); break; default: return _react.default.createElement(_transitions.Fade, props); } }; return _this; } (0, _createClass2.default)(Message, [{ key: "render", value: function render() { var _this$props = this.props, open = _this$props.open, action = _this$props.action, onClose = _this$props.onClose, anchorOrigin = _this$props.anchorOrigin, classes = _this$props.classes; return _react.default.createElement(_Snackbar.default, (0, _extends2.default)({}, classes, { TransitionComponent: this._transition, open: open, anchorOrigin: anchorOrigin, onClose: onClose, message: this.props.children, action: action })); } }]); return Message; }(_react.Component); Message.propTypes = { /** * This is usually about message action */ action: _propTypes.default.element, /** * The anchor of the Message. */ anchorOrigin: _propTypes.default.object, /** * This is usually an animation of open or close the message,include slide、collapse、fade、grow、zoom */ animation: _propTypes.default.string, /** * This is usually about message open or close */ open: _propTypes.default.bool.isRequired }; Message.defaultProps = { open: false, animation: 'fade', action: null, anchorOrigin: { vertical: 'bottom', horizontal: 'center' } }; var _default = (0, _withStyles.default)(styles, { name: 'RMMessage' })(Message); exports.default = _default;