@styleless-ui/react/esm/utils/useButtonBase.js

Completely unstyled, headless and accessible React UI components.

import*as e from"react";import{useEventCallback as n,useForkedRefs as r,useIsFocusVisible as t,useIsMounted as u,useIsomorphicLayoutEffect as o}from".";export default function(c){var l=c.onBlur,a=c.onFocus,i=c.onKeyDown,s=c.onKeyUp,f=c.onClick,d=c.autoFocus,y=void 0!==d&&d,k=c.disabled,v=void 0!==k&&k,p=u(),g=t(),h=g.isFocusVisibleRef,w=g.onBlur,C=g.onFocus,F=g.ref,R=e.useRef(),m=r(R,F),B=e.useRef(!1),D=e.useRef(!1),K=e.useState((function(){return!v&&y})),L=K[0],b=K[1];v&&L&&b(!1),e.useEffect((function(){h.current=L})),o((function(){var e;L&&(null===(e=R.current)||void 0===e||e.focus())}),[]);var T=n((function(e){e.preventDefault(),!v&&p()&&(null==f||f(e))})),U=n((function(e){!v&&p()&&(R.current||(R.current=e.currentTarget),C(e),h.current&&b(!0),null==a||a(e))})),V=n((function(e){!v&&p()&&(w(e),!1===h.current&&b(!1),null==l||l(e))})),x=n((function(e){!v&&p()&&(L&&(!1===B.current&&" "===e.key&&(B.current=!0),!1===D.current&&"enter"===e.key.toLowerCase()&&(D.current=!0)),e.target===e.currentTarget&&[" ","enter"].includes(e.key.toLowerCase())&&e.preventDefault(),null==i||i(e))})),E=n((function(e){!v&&p()&&(L&&(" "===e.key&&(B.current=!1),"enter"===e.key.toLowerCase()&&(D.current=!1)),null==s||s(e),e.target===e.currentTarget&&[" ","enter"].includes(e.key.toLowerCase())&&e.target.click())}));return{isFocusedVisible:L,handleBlur:V,handleClick:T,handleFocus:U,handleKeyDown:x,handleKeyUp:E,handleButtonRef:m}}