react-resize-aware
Version:
A React hook that makes it possible to listen to element resize events.
3 lines (2 loc) • 1.46 kB
JavaScript
var e=require("react"),t=require("react/jsx-runtime");function n(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach(function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}}),t.default=e,t}var r=/*#__PURE__*/n(e),u={display:"block",opacity:0,position:"absolute",top:0,left:0,height:"100%",width:"100%",overflow:"hidden",pointerEvents:"none",zIndex:-1,maxHeight:"inherit",maxWidth:"inherit"},i=function(e){var n=e.onResize,i=r.useRef();return function(e,t){var n=function(){return e.current&&e.current.contentDocument&&e.current.contentDocument.defaultView};function u(){t();var e=n();e&&e.addEventListener("resize",t)}r.useEffect(function(){return n()?u():e.current&&"addEventListener"in e.current&&e.current.addEventListener("load",u),function(){var e=n();null!=e&&e&&"function"==typeof e.removeEventListener&&e.removeEventListener("resize",t)}},[])}(i,function(){return n(i)}),/*#__PURE__*/t.jsx("iframe",{style:u,src:"about:blank",ref:i,"aria-hidden":!0,tabIndex:-1,frameBorder:0})},o=function(e){return null!=e?{width:e.offsetWidth,height:e.offsetHeight}:null};module.exports=function(e){void 0===e&&(e=o);var n=r.useState(e(null)),u=n[0],c=n[1],a=r.useCallback(function(t){return c(e(t.current))},[e]);return[r.useMemo(function(){/*#__PURE__*/return t.jsx(i,{onResize:a})},[a]),u]};
//# sourceMappingURL=index.cjs.map