web-ui-pack/helpers/styleHelpers.js

Web package with UI elements

export function styleTransform(el, prop, value) {
    const reg = new RegExp(`( )*${prop}\\(([%d \\w.,-]+)\\)( )*`);
    const setValue = value || value === 0;
    let isDone = !setValue;
    const s = setValue
        ? el.style.transform.replace(reg, (_t, p1, _p2, p3) => {
            isDone = true;
            return `${p1 || ""}${prop}(${value})${p3 || ""}`;
        })
        : el.style.transform.replace(reg, " ").trim();
    el.style.transform = isDone ? s : `${el.style.transform} ${prop}(${value})`.trimStart();
    return el.style.transform;
}
export function px2Number(styleValue) {
    return +(/([0-9]+)/.exec(styleValue)?.[0] || 0);
}
export function getBoundingInternalRect(el, options) {
    if (el._savedBoundingRect && !options?.ignoreCache) {
        return { ...el._savedBoundingRect };
    }
    const { borderTopWidth, borderLeftWidth } = options?.computedStyle ?? getComputedStyle(el);
    let { left, top } = options?.elRect ?? el.getBoundingClientRect();
    top = Math.round(top + px2Number(borderTopWidth));
    left = Math.round(left + px2Number(borderLeftWidth));
    const r = {
        top,
        left,
        right: left + el.clientWidth,
        bottom: top + el.clientHeight,
        width: el.clientWidth,
        height: el.clientHeight,
    };
    el._savedBoundingRect = { ...r };
    setTimeout(() => delete el._savedBoundingRect);
    return r;
}
export function parseMsTime(v) {
    let t = Number.parseFloat(v);
    if (!v.endsWith("ms")) {
        t *= 1000;
    }
    if (Number.isNaN(t)) {
        return 0;
    }
    return t;
}