nanoclamp/dist/nanoclamp.js

Responsive text clamping component for React

"use strict";var e=require("react");module.exports=({accessibility:t=!0,debounce:r=300,ellipsis:n="…",is:u="div",lines:l=3,text:i,...s})=>{const c=e.useRef(null),o=e.useRef("."),f={ref:c,...t?{title:i}:{},...s},a=e.useMemo((()=>"string"==typeof i&&i.length>0),[i]),v=e.useCallback((()=>{if(!a)return;const e=e=>{o.current=e,null!=c.current&&(c.current.textContent=e)},t=()=>{var e,t;return null!==(t=null===(e=c.current)||void 0===e?void 0:e.clientHeight)&&void 0!==t?t:0};e(".");const r=(t()+1)*l+1;if(e(i),t()<=r)return;let u=0,s=0,f=i.length;for(;u<=f;){s=Math.floor((u+f)/2);e(i.slice(0,s).trim()+n),t()<=r?u=s+1:f=s-1}e(i.slice(0,s-1).trim()+n)}),[n,a,l,i]);return e.useLayoutEffect((()=>{if(v(),null==c.current)return;const e=new ResizeObserver(((e,t)=>{let r;const n=()=>{r=void 0,e()};return()=>{const u=null==r;clearTimeout(r),r=setTimeout(n,t),u&&e()}})(v,r));return e.observe(c.current),()=>e.disconnect()}),[v,r]),a?e.createElement(u,f,o.current):null};
//# sourceMappingURL=nanoclamp.js.map