UNPKG

2.22 kBJavaScriptView Raw
1'use client';
2
3import * as React from 'react';
4import PropTypes from 'prop-types';
5import clsx from 'clsx';
6
7/**
8 * @ignore - internal component.
9 */
10import { jsx as _jsx } from "react/jsx-runtime";
11function Ripple(props) {
12 const {
13 className,
14 classes,
15 pulsate = false,
16 rippleX,
17 rippleY,
18 rippleSize,
19 in: inProp,
20 onExited,
21 timeout
22 } = props;
23 const [leaving, setLeaving] = React.useState(false);
24 const rippleClassName = clsx(className, classes.ripple, classes.rippleVisible, pulsate && classes.ripplePulsate);
25 const rippleStyles = {
26 width: rippleSize,
27 height: rippleSize,
28 top: -(rippleSize / 2) + rippleY,
29 left: -(rippleSize / 2) + rippleX
30 };
31 const childClassName = clsx(classes.child, leaving && classes.childLeaving, pulsate && classes.childPulsate);
32 if (!inProp && !leaving) {
33 setLeaving(true);
34 }
35 React.useEffect(() => {
36 if (!inProp && onExited != null) {
37 // react-transition-group#onExited
38 const timeoutId = setTimeout(onExited, timeout);
39 return () => {
40 clearTimeout(timeoutId);
41 };
42 }
43 return undefined;
44 }, [onExited, inProp, timeout]);
45 return /*#__PURE__*/_jsx("span", {
46 className: rippleClassName,
47 style: rippleStyles,
48 children: /*#__PURE__*/_jsx("span", {
49 className: childClassName
50 })
51 });
52}
53process.env.NODE_ENV !== "production" ? Ripple.propTypes /* remove-proptypes */ = {
54 /**
55 * Override or extend the styles applied to the component.
56 */
57 classes: PropTypes.object.isRequired,
58 className: PropTypes.string,
59 /**
60 * @ignore - injected from TransitionGroup
61 */
62 in: PropTypes.bool,
63 /**
64 * @ignore - injected from TransitionGroup
65 */
66 onExited: PropTypes.func,
67 /**
68 * If `true`, the ripple pulsates, typically indicating the keyboard focus state of an element.
69 */
70 pulsate: PropTypes.bool,
71 /**
72 * Diameter of the ripple.
73 */
74 rippleSize: PropTypes.number,
75 /**
76 * Horizontal position of the ripple center.
77 */
78 rippleX: PropTypes.number,
79 /**
80 * Vertical position of the ripple center.
81 */
82 rippleY: PropTypes.number,
83 /**
84 * exit delay
85 */
86 timeout: PropTypes.number.isRequired
87} : void 0;
88export default Ripple;
\No newline at end of file