UNPKG

1.54 kBJavaScriptView Raw
1import _extends from "@babel/runtime/helpers/esm/extends";
2import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
3var _excluded = ["className", "children"];
4
5var _fadeStyles;
6
7import classNames from 'classnames';
8import React, { useCallback } from 'react';
9import Transition, { ENTERED, ENTERING } from 'react-transition-group/Transition';
10import transitionEndListener from './transitionEndListener';
11import triggerBrowserReflow from './triggerBrowserReflow';
12var defaultProps = {
13 in: false,
14 timeout: 300,
15 mountOnEnter: false,
16 unmountOnExit: false,
17 appear: false
18};
19var fadeStyles = (_fadeStyles = {}, _fadeStyles[ENTERING] = 'show', _fadeStyles[ENTERED] = 'show', _fadeStyles);
20var Fade = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
21 var className = _ref.className,
22 children = _ref.children,
23 props = _objectWithoutPropertiesLoose(_ref, _excluded);
24
25 var handleEnter = useCallback(function (node) {
26 triggerBrowserReflow(node);
27 if (props.onEnter) props.onEnter(node);
28 }, [props]);
29 return /*#__PURE__*/React.createElement(Transition, _extends({
30 ref: ref,
31 addEndListener: transitionEndListener
32 }, props, {
33 onEnter: handleEnter
34 }), function (status, innerProps) {
35 return /*#__PURE__*/React.cloneElement(children, _extends({}, innerProps, {
36 className: classNames('fade', className, children.props.className, fadeStyles[status])
37 }));
38 });
39});
40Fade.defaultProps = defaultProps;
41Fade.displayName = 'Fade';
42export default Fade;
\No newline at end of file