primereact
Version:
PrimeReact is an open source UI library for React featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with Prime
2 lines (1 loc) • 1.76 kB
JavaScript
import*as e from"react";import t from"primereact/api";import{useMountEffect as r,useUpdateEffect as n,useUnmountEffect as c}from"primereact/hooks";import{DomHandler as u}from"primereact/utils";var o=e.memo(e.forwardRef((function(){var o=e.useRef(null),i=e.useRef(null),a=function(){return o.current&&o.current.parentElement},s=function(){i.current&&(i.current.addEventListener("mousedown",p),u.isTouchDevice()&&i.current.addEventListener("touchstart",l))},l=function(e){var t=u.getOffset(i.current),r=e.targetTouches[0].pageX-t.left+document.body.scrollTop-u.getWidth(o.current)/2,n=e.targetTouches[0].pageY-t.top+document.body.scrollLeft-u.getHeight(o.current)/2;f(r,n)},p=function(e){if(!u.isTouchDevice()){var t=u.getOffset(i.current),r=e.pageX-t.left+document.body.scrollTop-u.getWidth(o.current)/2,n=e.pageY-t.top+document.body.scrollLeft-u.getHeight(o.current)/2;f(r,n)}},f=function(e,t){if(o.current&&"none"!==getComputedStyle(o.current,null).display){if(u.removeClass(o.current,"p-ink-active"),!u.getHeight(o.current)&&!u.getWidth(o.current)){var r=Math.max(u.getOuterWidth(i.current),u.getOuterHeight(i.current));o.current.style.height=r+"px",o.current.style.width=r+"px"}o.current.style.top=t+"px",o.current.style.left=e+"px",u.addClass(o.current,"p-ink-active")}};return r((function(){o.current&&(i.current=a(),s())})),n((function(){o.current&&!i.current&&(i.current=a(),s())})),c((function(){o.current&&(i.current=null,i.current&&(i.current.removeEventListener("mousedown",p),u.isTouchDevice()&&i.current.removeEventListener("touchstart",l)))})),t.ripple?e.createElement("span",{role:"presentation",ref:o,className:"p-ink",onAnimationEnd:function(e){u.removeClass(e.currentTarget,"p-ink-active")}}):null})));o.displayName="Ripple";export{o as Ripple};