clicknhold/dist/index.min.js

React hook for handling click and hold events

"use strict";var n=require("react");exports.useClicknHold=function(e){var t=void 0===e?{}:e,o=t.duration,u=void 0===o?2e3:o,r=t.onComplete,l=t.onStart,a=t.onCancel,c=t.onProgress,i=t.disabled,s=void 0!==i&&i,d=n.useState(!1),f=d[0],v=d[1],k=n.useRef(),w=n.useRef(),C=n.useCallback((function(){k.current&&(window.clearInterval(k.current),k.current=void 0),w.current=void 0,v(!1)}),[]),p=n.useCallback((function(n){"preventDefault"in n&&n.preventDefault(),s||(w.current=Date.now(),v(!0),null==l||l(),k.current=window.setInterval((function(){var n=Date.now()-w.current,e=Math.min(n/u,1);null==c||c(e),n>=u&&(C(),null==r||r())}),16))}),[u,r,l,c,C,s]),b=n.useCallback((function(){f&&(C(),null==a||a())}),[f,C,a]),y=n.useCallback((function(n){"Enter"!==n.key&&" "!==n.key||p(n)}),[p]),D=n.useCallback((function(n){"Enter"!==n.key&&" "!==n.key||b()}),[b]);return n.useEffect((function(){return C}),[C]),{isHolding:f,handlers:{onMouseDown:p,onMouseUp:b,onMouseLeave:b,onTouchStart:p,onTouchEnd:b,onKeyDown:y,onKeyUp:D},startHolding:p,stopHolding:b}};