[d565449] | 1 | import { __spreadArrays } from "tslib";
|
---|
| 2 | import * as React from 'react';
|
---|
| 3 | import { isBrowser, off, on } from './misc/util';
|
---|
| 4 | var useState = React.useState, useEffect = React.useEffect, useRef = React.useRef;
|
---|
| 5 | var DRAF = function (callback) { return setTimeout(callback, 35); };
|
---|
| 6 | var useSize = function (element, _a) {
|
---|
| 7 | var _b = _a === void 0 ? {} : _a, _c = _b.width, width = _c === void 0 ? Infinity : _c, _d = _b.height, height = _d === void 0 ? Infinity : _d;
|
---|
| 8 | if (!isBrowser) {
|
---|
| 9 | return [
|
---|
| 10 | typeof element === 'function' ? element({ width: width, height: height }) : element,
|
---|
| 11 | { width: width, height: height },
|
---|
| 12 | ];
|
---|
| 13 | }
|
---|
| 14 | // eslint-disable-next-line react-hooks/rules-of-hooks
|
---|
| 15 | var _e = useState({ width: width, height: height }), state = _e[0], setState = _e[1];
|
---|
| 16 | if (typeof element === 'function') {
|
---|
| 17 | element = element(state);
|
---|
| 18 | }
|
---|
| 19 | var style = element.props.style || {};
|
---|
| 20 | // eslint-disable-next-line react-hooks/rules-of-hooks
|
---|
| 21 | var ref = useRef(null);
|
---|
| 22 | var window = null;
|
---|
| 23 | var setSize = function () {
|
---|
| 24 | var iframe = ref.current;
|
---|
| 25 | var size = iframe
|
---|
| 26 | ? {
|
---|
| 27 | width: iframe.offsetWidth,
|
---|
| 28 | height: iframe.offsetHeight,
|
---|
| 29 | }
|
---|
| 30 | : { width: width, height: height };
|
---|
| 31 | setState(size);
|
---|
| 32 | };
|
---|
| 33 | var onWindow = function (windowToListenOn) {
|
---|
| 34 | on(windowToListenOn, 'resize', setSize);
|
---|
| 35 | DRAF(setSize);
|
---|
| 36 | };
|
---|
| 37 | // eslint-disable-next-line react-hooks/rules-of-hooks
|
---|
| 38 | useEffect(function () {
|
---|
| 39 | var iframe = ref.current;
|
---|
| 40 | if (!iframe) {
|
---|
| 41 | // iframe will be undefined if component is already unmounted
|
---|
| 42 | return;
|
---|
| 43 | }
|
---|
| 44 | if (iframe.contentWindow) {
|
---|
| 45 | window = iframe.contentWindow;
|
---|
| 46 | onWindow(window);
|
---|
| 47 | }
|
---|
| 48 | else {
|
---|
| 49 | var onLoad_1 = function () {
|
---|
| 50 | on(iframe, 'load', onLoad_1);
|
---|
| 51 | window = iframe.contentWindow;
|
---|
| 52 | onWindow(window);
|
---|
| 53 | };
|
---|
| 54 | off(iframe, 'load', onLoad_1);
|
---|
| 55 | }
|
---|
| 56 | return function () {
|
---|
| 57 | if (window && window.removeEventListener) {
|
---|
| 58 | off(window, 'resize', setSize);
|
---|
| 59 | }
|
---|
| 60 | };
|
---|
| 61 | }, []);
|
---|
| 62 | style.position = 'relative';
|
---|
| 63 | var sized = React.cloneElement.apply(React, __spreadArrays([element, { style: style }], __spreadArrays([
|
---|
| 64 | React.createElement('iframe', {
|
---|
| 65 | ref: ref,
|
---|
| 66 | style: {
|
---|
| 67 | background: 'transparent',
|
---|
| 68 | border: 'none',
|
---|
| 69 | height: '100%',
|
---|
| 70 | left: 0,
|
---|
| 71 | position: 'absolute',
|
---|
| 72 | top: 0,
|
---|
| 73 | width: '100%',
|
---|
| 74 | zIndex: -1,
|
---|
| 75 | },
|
---|
| 76 | })
|
---|
| 77 | ], React.Children.toArray(element.props.children))));
|
---|
| 78 | return [sized, state];
|
---|
| 79 | };
|
---|
| 80 | export default useSize;
|
---|