81 lines
4.4 KiB
JavaScript
81 lines
4.4 KiB
JavaScript
import { ResizeObserverBoxOptions } from '../ResizeObserverBoxOptions';
|
|
import { DOMRectReadOnly } from '../DOMRectReadOnly';
|
|
import { isSVG, isHidden } from '../utils/element';
|
|
import { global } from '../utils/global';
|
|
var cache = new WeakMap();
|
|
var scrollRegexp = /auto|scroll/;
|
|
var verticalRegexp = /^tb|vertical/;
|
|
var IE = (/msie|trident/i).test(global.navigator && global.navigator.userAgent);
|
|
var parseDimension = function (pixel) { return parseFloat(pixel || '0'); };
|
|
var size = function (inlineSize, blockSize, switchSizes) {
|
|
if (inlineSize === void 0) { inlineSize = 0; }
|
|
if (blockSize === void 0) { blockSize = 0; }
|
|
if (switchSizes === void 0) { switchSizes = false; }
|
|
return Object.freeze({
|
|
inlineSize: (switchSizes ? blockSize : inlineSize) || 0,
|
|
blockSize: (switchSizes ? inlineSize : blockSize) || 0
|
|
});
|
|
};
|
|
var zeroBoxes = Object.freeze({
|
|
devicePixelContentBoxSize: size(),
|
|
borderBoxSize: size(),
|
|
contentBoxSize: size(),
|
|
contentRect: new DOMRectReadOnly(0, 0, 0, 0)
|
|
});
|
|
var calculateBoxSizes = function (target, forceRecalculation) {
|
|
if (forceRecalculation === void 0) { forceRecalculation = false; }
|
|
if (cache.has(target) && !forceRecalculation) {
|
|
return cache.get(target);
|
|
}
|
|
if (isHidden(target)) {
|
|
cache.set(target, zeroBoxes);
|
|
return zeroBoxes;
|
|
}
|
|
var cs = getComputedStyle(target);
|
|
var svg = isSVG(target) && target.ownerSVGElement && target.getBBox();
|
|
var removePadding = !IE && cs.boxSizing === 'border-box';
|
|
var switchSizes = verticalRegexp.test(cs.writingMode || '');
|
|
var canScrollVertically = !svg && scrollRegexp.test(cs.overflowY || '');
|
|
var canScrollHorizontally = !svg && scrollRegexp.test(cs.overflowX || '');
|
|
var paddingTop = svg ? 0 : parseDimension(cs.paddingTop);
|
|
var paddingRight = svg ? 0 : parseDimension(cs.paddingRight);
|
|
var paddingBottom = svg ? 0 : parseDimension(cs.paddingBottom);
|
|
var paddingLeft = svg ? 0 : parseDimension(cs.paddingLeft);
|
|
var borderTop = svg ? 0 : parseDimension(cs.borderTopWidth);
|
|
var borderRight = svg ? 0 : parseDimension(cs.borderRightWidth);
|
|
var borderBottom = svg ? 0 : parseDimension(cs.borderBottomWidth);
|
|
var borderLeft = svg ? 0 : parseDimension(cs.borderLeftWidth);
|
|
var horizontalPadding = paddingLeft + paddingRight;
|
|
var verticalPadding = paddingTop + paddingBottom;
|
|
var horizontalBorderArea = borderLeft + borderRight;
|
|
var verticalBorderArea = borderTop + borderBottom;
|
|
var horizontalScrollbarThickness = !canScrollHorizontally ? 0 : target.offsetHeight - verticalBorderArea - target.clientHeight;
|
|
var verticalScrollbarThickness = !canScrollVertically ? 0 : target.offsetWidth - horizontalBorderArea - target.clientWidth;
|
|
var widthReduction = removePadding ? horizontalPadding + horizontalBorderArea : 0;
|
|
var heightReduction = removePadding ? verticalPadding + verticalBorderArea : 0;
|
|
var contentWidth = svg ? svg.width : parseDimension(cs.width) - widthReduction - verticalScrollbarThickness;
|
|
var contentHeight = svg ? svg.height : parseDimension(cs.height) - heightReduction - horizontalScrollbarThickness;
|
|
var borderBoxWidth = contentWidth + horizontalPadding + verticalScrollbarThickness + horizontalBorderArea;
|
|
var borderBoxHeight = contentHeight + verticalPadding + horizontalScrollbarThickness + verticalBorderArea;
|
|
var boxes = Object.freeze({
|
|
devicePixelContentBoxSize: size(Math.round(contentWidth * devicePixelRatio), Math.round(contentHeight * devicePixelRatio), switchSizes),
|
|
borderBoxSize: size(borderBoxWidth, borderBoxHeight, switchSizes),
|
|
contentBoxSize: size(contentWidth, contentHeight, switchSizes),
|
|
contentRect: new DOMRectReadOnly(paddingLeft, paddingTop, contentWidth, contentHeight)
|
|
});
|
|
cache.set(target, boxes);
|
|
return boxes;
|
|
};
|
|
var calculateBoxSize = function (target, observedBox, forceRecalculation) {
|
|
var _a = calculateBoxSizes(target, forceRecalculation), borderBoxSize = _a.borderBoxSize, contentBoxSize = _a.contentBoxSize, devicePixelContentBoxSize = _a.devicePixelContentBoxSize;
|
|
switch (observedBox) {
|
|
case ResizeObserverBoxOptions.DEVICE_PIXEL_CONTENT_BOX:
|
|
return devicePixelContentBoxSize;
|
|
case ResizeObserverBoxOptions.BORDER_BOX:
|
|
return borderBoxSize;
|
|
default:
|
|
return contentBoxSize;
|
|
}
|
|
};
|
|
export { calculateBoxSize, calculateBoxSizes };
|