@antv/s2
Version:
effective spreadsheet render core lib
64 lines • 2.84 kB
JavaScript
import { __awaiter } from "tslib";
import { debounce, isBoolean } from 'lodash';
import { floor } from '../../utils';
import { RESIZE_RENDER_DELAY } from '../constant/resize';
export const analyzeAdaptive = (defaultContainer, adaptive) => {
var _a, _b, _c;
if (isBoolean(adaptive)) {
return {
container: defaultContainer,
adaptiveWidth: true,
adaptiveHeight: false,
};
}
return {
container: ((_a = adaptive === null || adaptive === void 0 ? void 0 : adaptive.getContainer) === null || _a === void 0 ? void 0 : _a.call(adaptive)) || defaultContainer,
adaptiveWidth: (_b = adaptive === null || adaptive === void 0 ? void 0 : adaptive.width) !== null && _b !== void 0 ? _b : true,
adaptiveHeight: (_c = adaptive === null || adaptive === void 0 ? void 0 : adaptive.height) !== null && _c !== void 0 ? _c : true,
};
};
export const createResizeObserver = (params) => {
let isFirstRender = true;
const { s2, adaptive, container, wrapper } = params;
const { container: actualWrapper, adaptiveWidth, adaptiveHeight, } = analyzeAdaptive(wrapper, adaptive);
if (!actualWrapper || !container || !adaptive || !s2) {
return;
}
const render = (width, height) => __awaiter(void 0, void 0, void 0, function* () {
s2 === null || s2 === void 0 ? void 0 : s2.changeSheetSize(width, height);
yield (s2 === null || s2 === void 0 ? void 0 : s2.render(false));
});
const debounceRender = debounce(render, RESIZE_RENDER_DELAY);
const onResize = () => __awaiter(void 0, void 0, void 0, function* () {
// 解决父容器有缩放, 获取宽高不对的问题: https://github.com/antvis/S2/pull/1425
const { clientWidth: containerWidth, clientHeight: containerHeight } = container;
const width = adaptiveWidth
? floor(containerWidth !== null && containerWidth !== void 0 ? containerWidth : s2.options.width)
: s2.options.width;
// 去除 header 和 page 后才是 sheet 真正的高度
const height = adaptiveHeight
? floor(containerHeight !== null && containerHeight !== void 0 ? containerHeight : s2.options.height)
: s2.options.height;
if (!adaptiveWidth && !adaptiveHeight) {
return;
}
if (isFirstRender) {
yield render(width, height);
isFirstRender = false;
return;
}
debounceRender(width, height);
});
const resizeObserver = new ResizeObserver(([entry] = []) => {
if (entry) {
onResize();
}
});
resizeObserver.observe(actualWrapper, {
box: 'border-box',
});
return () => {
resizeObserver.unobserve(actualWrapper);
};
};
//# sourceMappingURL=resize.js.map