UNPKG

3.53 kBJavaScriptView Raw
1"use strict";
2
3var _interopRequireDefault = require("@babel/runtime-corejs2/helpers/interopRequireDefault");
4
5var _interopRequireWildcard = require("@babel/runtime-corejs2/helpers/interopRequireWildcard");
6
7exports.__esModule = true;
8exports.default = void 0;
9
10var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/extends"));
11
12var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/objectWithoutPropertiesLoose"));
13
14var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/inheritsLoose"));
15
16var _classnames = _interopRequireDefault(require("classnames"));
17
18var _react = _interopRequireDefault(require("react"));
19
20var _propTypes = _interopRequireDefault(require("prop-types"));
21
22var _Transition = _interopRequireWildcard(require("react-transition-group/Transition"));
23
24var _fadeStyles;
25
26var propTypes = {
27 /**
28 * Show the component; triggers the fade in or fade out animation
29 */
30 in: _propTypes.default.bool,
31
32 /**
33 * Wait until the first "enter" transition to mount the component (add it to the DOM)
34 */
35 mountOnEnter: _propTypes.default.bool,
36
37 /**
38 * Unmount the component (remove it from the DOM) when it is faded out
39 */
40 unmountOnExit: _propTypes.default.bool,
41
42 /**
43 * Run the fade in animation when the component mounts, if it is initially
44 * shown
45 */
46 appear: _propTypes.default.bool,
47
48 /**
49 * Duration of the fade animation in milliseconds, to ensure that finishing
50 * callbacks are fired even if the original browser transition end events are
51 * canceled
52 */
53 timeout: _propTypes.default.number,
54
55 /**
56 * Callback fired before the component fades in
57 */
58 onEnter: _propTypes.default.func,
59
60 /**
61 * Callback fired after the component starts to fade in
62 */
63 onEntering: _propTypes.default.func,
64
65 /**
66 * Callback fired after the has component faded in
67 */
68 onEntered: _propTypes.default.func,
69
70 /**
71 * Callback fired before the component fades out
72 */
73 onExit: _propTypes.default.func,
74
75 /**
76 * Callback fired after the component starts to fade out
77 */
78 onExiting: _propTypes.default.func,
79
80 /**
81 * Callback fired after the component has faded out
82 */
83 onExited: _propTypes.default.func
84};
85var defaultProps = {
86 in: false,
87 timeout: 300,
88 mountOnEnter: false,
89 unmountOnExit: false,
90 appear: false
91};
92var fadeStyles = (_fadeStyles = {}, _fadeStyles[_Transition.ENTERING] = 'in', _fadeStyles[_Transition.ENTERED] = 'in', _fadeStyles);
93
94var Fade =
95/*#__PURE__*/
96function (_React$Component) {
97 (0, _inheritsLoose2.default)(Fade, _React$Component);
98
99 function Fade() {
100 return _React$Component.apply(this, arguments) || this;
101 }
102
103 var _proto = Fade.prototype;
104
105 _proto.render = function render() {
106 var _this$props = this.props,
107 className = _this$props.className,
108 children = _this$props.children,
109 props = (0, _objectWithoutPropertiesLoose2.default)(_this$props, ["className", "children"]);
110 return _react.default.createElement(_Transition.default, props, function (status, innerProps) {
111 return _react.default.cloneElement(children, (0, _extends2.default)({}, innerProps, {
112 className: (0, _classnames.default)('fade', className, children.props.className, fadeStyles[status])
113 }));
114 });
115 };
116
117 return Fade;
118}(_react.default.Component);
119
120Fade.propTypes = propTypes;
121Fade.defaultProps = defaultProps;
122var _default = Fade;
123exports.default = _default;
124module.exports = exports["default"];
\No newline at end of file