1 | "use strict";
|
2 |
|
3 | var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
4 |
|
5 | var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
|
6 |
|
7 | Object.defineProperty(exports, "__esModule", {
|
8 | value: true
|
9 | });
|
10 | exports.default = void 0;
|
11 |
|
12 | var React = _interopRequireWildcard(require("react"));
|
13 |
|
14 | var _propTypes = _interopRequireDefault(require("prop-types"));
|
15 |
|
16 | var _clsx = _interopRequireDefault(require("clsx"));
|
17 |
|
18 | var _useEventCallback = _interopRequireDefault(require("../utils/useEventCallback"));
|
19 |
|
20 | var useEnhancedEffect = typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect;
|
21 |
|
22 |
|
23 |
|
24 |
|
25 | function Ripple(props) {
|
26 | var classes = props.classes,
|
27 | _props$pulsate = props.pulsate,
|
28 | pulsate = _props$pulsate === void 0 ? false : _props$pulsate,
|
29 | rippleX = props.rippleX,
|
30 | rippleY = props.rippleY,
|
31 | rippleSize = props.rippleSize,
|
32 | inProp = props.in,
|
33 | _props$onExited = props.onExited,
|
34 | onExited = _props$onExited === void 0 ? function () {} : _props$onExited,
|
35 | timeout = props.timeout;
|
36 |
|
37 | var _React$useState = React.useState(false),
|
38 | leaving = _React$useState[0],
|
39 | setLeaving = _React$useState[1];
|
40 |
|
41 | var rippleClassName = (0, _clsx.default)(classes.ripple, classes.rippleVisible, pulsate && classes.ripplePulsate);
|
42 | var rippleStyles = {
|
43 | width: rippleSize,
|
44 | height: rippleSize,
|
45 | top: -(rippleSize / 2) + rippleY,
|
46 | left: -(rippleSize / 2) + rippleX
|
47 | };
|
48 | var childClassName = (0, _clsx.default)(classes.child, leaving && classes.childLeaving, pulsate && classes.childPulsate);
|
49 | var handleExited = (0, _useEventCallback.default)(onExited);
|
50 |
|
51 | useEnhancedEffect(function () {
|
52 | if (!inProp) {
|
53 |
|
54 | setLeaving(true);
|
55 |
|
56 | var timeoutId = setTimeout(handleExited, timeout);
|
57 | return function () {
|
58 | clearTimeout(timeoutId);
|
59 | };
|
60 | }
|
61 |
|
62 | return undefined;
|
63 | }, [handleExited, inProp, timeout]);
|
64 | return React.createElement("span", {
|
65 | className: rippleClassName,
|
66 | style: rippleStyles
|
67 | }, React.createElement("span", {
|
68 | className: childClassName
|
69 | }));
|
70 | }
|
71 |
|
72 | process.env.NODE_ENV !== "production" ? Ripple.propTypes = {
|
73 | |
74 |
|
75 |
|
76 |
|
77 | classes: _propTypes.default.object.isRequired,
|
78 |
|
79 | |
80 |
|
81 |
|
82 | in: _propTypes.default.bool,
|
83 |
|
84 | |
85 |
|
86 |
|
87 | onExited: _propTypes.default.func,
|
88 |
|
89 | |
90 |
|
91 |
|
92 | pulsate: _propTypes.default.bool,
|
93 |
|
94 | |
95 |
|
96 |
|
97 | rippleSize: _propTypes.default.number,
|
98 |
|
99 | |
100 |
|
101 |
|
102 | rippleX: _propTypes.default.number,
|
103 |
|
104 | |
105 |
|
106 |
|
107 | rippleY: _propTypes.default.number,
|
108 |
|
109 | |
110 |
|
111 |
|
112 | timeout: _propTypes.default.number.isRequired
|
113 | } : void 0;
|
114 | var _default = Ripple;
|
115 | exports.default = _default; |
\ | No newline at end of file |