seti-ramesesv1
Version:
Reusable components and context for Next.js apps
86 lines (83 loc) • 2.25 kB
JavaScript
import * as React from 'react';
import PropTypes from '../../../../../_virtual/index.js';
import { clsx } from '../../../../clsx/dist/clsx.js';
import { jsx } from 'react/jsx-runtime';
function Ripple(props) {
const {
className,
classes,
pulsate = false,
rippleX,
rippleY,
rippleSize,
in: inProp,
onExited,
timeout
} = props;
const [leaving, setLeaving] = React.useState(false);
const rippleClassName = clsx(className, classes.ripple, classes.rippleVisible, pulsate && classes.ripplePulsate);
const rippleStyles = {
width: rippleSize,
height: rippleSize,
top: -(rippleSize / 2) + rippleY,
left: -(rippleSize / 2) + rippleX
};
const childClassName = clsx(classes.child, leaving && classes.childLeaving, pulsate && classes.childPulsate);
if (!inProp && !leaving) {
setLeaving(true);
}
React.useEffect(() => {
if (!inProp && onExited != null) {
// react-transition-group#onExited
const timeoutId = setTimeout(onExited, timeout);
return () => {
clearTimeout(timeoutId);
};
}
return undefined;
}, [onExited, inProp, timeout]);
return /*#__PURE__*/jsx("span", {
className: rippleClassName,
style: rippleStyles,
children: /*#__PURE__*/jsx("span", {
className: childClassName
})
});
}
process.env.NODE_ENV !== "production" ? Ripple.propTypes /* remove-proptypes */ = {
/**
* Override or extend the styles applied to the component.
*/
classes: PropTypes.object.isRequired,
className: PropTypes.string,
/**
* @ignore - injected from TransitionGroup
*/
in: PropTypes.bool,
/**
* @ignore - injected from TransitionGroup
*/
onExited: PropTypes.func,
/**
* If `true`, the ripple pulsates, typically indicating the keyboard focus state of an element.
*/
pulsate: PropTypes.bool,
/**
* Diameter of the ripple.
*/
rippleSize: PropTypes.number,
/**
* Horizontal position of the ripple center.
*/
rippleX: PropTypes.number,
/**
* Vertical position of the ripple center.
*/
rippleY: PropTypes.number,
/**
* exit delay
*/
timeout: PropTypes.number.isRequired
} : void 0;
export { Ripple as default };
//# sourceMappingURL=Ripple.js.map