@flyyer/use-fit-text
Version:
React hook used to fit text in a div
3 lines (2 loc) • 2.03 kB
JavaScript
import{useCallback as n,useRef as e,useState as t,useEffect as r,useLayoutEffect as i}from"react";import{dequal as o}from"dequal/lite";function c(){return(c=Object.assign||function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n}).apply(this,arguments)}var f={debug:10,info:20,warn:30,error:40,none:100},a="undefined"!=typeof window&&window.document&&window.document.createElement?i:r;function u(i,u){var l=void 0===i?{}:i,d=l.logLevel,z=l.maxFontSize,S=void 0===z?100:z,s=l.minFontSize,v=void 0===s?20:s,w=l.onFinish,m=l.onStart,h=l.resolution,M=void 0===h?5:h,y=f[void 0===d?"warn":d],p=n(function(){return{calcKey:0,fontSize:S,fontSizePrev:v,fontSizeMax:S,fontSizeMin:v}},[S,v]),x=e(null),g=e(!1),b=e(),F=t(p),K=F[0],P=F[1],O=t(!1),j=O[0],q=O[1],A=K.calcKey,H=K.fontSize,W=K.fontSizeMax,C=K.fontSizeMin,E=K.fontSizePrev,L=null,R=t(function(){return new window.ResizeObserver(function(){L=window.requestAnimationFrame(function(){g.current||(m&&m(),g.current=!0,q(!0),P(c({},p(),{calcKey:A+1})))})})})[0];r(function(){return x.current&&R.observe(x.current),function(){L&&window.cancelAnimationFrame(L),R.disconnect()}},[L,R]);var k=b.current;return r(function(){0===A||g.current||(o(k,u)||(m&&m(),q(!0),P(c({},p(),{calcKey:A+1}))),b.current=u)},[A,p,m,k].concat(u)),a(function(){if(0!==A){var n=Math.abs(H-E)<=M,e=!!x.current&&(x.current.scrollHeight>x.current.offsetHeight||x.current.scrollWidth>x.current.offsetWidth),t=H>E;if(n)e&&H===E?(g.current=!1,q(!1),y<=f.info&&console.info("[use-fit-text] reached `minFontSize = "+v+"` without fitting text")):e?P({fontSize:t?E:C,fontSizeMax:W,fontSizeMin:C,fontSizePrev:E,calcKey:A}):(g.current=!1,q(!1),w&&w(H));else{var r,i=W,o=C;e?(r=t?E-H:C-H,i=Math.min(W,H)):(r=t?W-H:E-H,o=Math.max(C,H)),P({calcKey:A,fontSize:H+r/2,fontSizeMax:i,fontSizeMin:o,fontSizePrev:H})}}},[A,H,W,C,E,w,x,M]),{fontSize:H+"%",ref:x,isCalculating:j}}export{u as useFitText};
//# sourceMappingURL=index.esm.js.map