@watermarkinsights/ripple 5.16.0-alpha.0 → 5.16.0-alpha.2

package/dist/collection/global/functions.js

@@ -1,927 +0,0 @@
-import * as lang from "../lang/lang";
-import { createIntl, createIntlCache } from "@formatjs/intl";
-const DEFAULT_LANGUAGE = "en";
-function getBrowserLang() {
-    const langAttr = document.documentElement.getAttribute("lang");
-    if (!!langAttr) {
-        return langAttr;
-    }
-    else if (window.navigator && window.navigator.language) {
-        const lang = window.navigator.languages ? window.navigator.languages[0] : window.navigator.language;
-        return lang.slice(0, 2);
-    }
-    else {
-        return DEFAULT_LANGUAGE;
-    }
-}
-// prevents memory leak
-const cache = createIntlCache();
-const locale = getBrowserLang();
-export const intl = createIntl({
-    locale: locale,
-    defaultLocale: "en",
-    messages: lang[locale] || lang.en,
-}, cache);
-export function generateId() {
-    return "wmcl-" + Math.random().toString(36).substr(2, 10);
-}
-// limits how many times a function fires
-// use when the function should run periodically, but not too often (e.g. window resize)
-export function throttle(fn, wait) {
-    let timeout;
-    let shouldWait = false;
-    return function () {
-        const context = this;
-        if (!shouldWait) {
-            fn.apply(context, arguments);
-            shouldWait = true;
-            clearTimeout(timeout);
-            timeout = setTimeout(function () {
-                shouldWait = false;
-            }, wait);
-        }
-    };
-}
-// waits until it hasn't been called for [timeout] ms.
-// use when the function should run only after something (event) is done firing
-export function debounce(fn, wait) {
-    let timeout;
-    return function () {
-        const context = this;
-        const functionCall = () => fn.apply(context, arguments);
-        clearTimeout(timeout);
-        timeout = setTimeout(functionCall, wait);
-    };
-}
-export function getTextDir() {
-    const dir = document.querySelector("html").getAttribute("dir");
-    return dir ? dir.toLowerCase() : "";
-}
-export function getPosition(el) {
-    const coords = el.getBoundingClientRect();
-    let x = coords.x;
-    let y = coords.y;
-    // Edge doesn't have x and y
-    if (!x) {
-        if (getTextDir() === "rtl") {
-            x = coords.right;
-        }
-        else {
-            x = coords.left;
-        }
-        y = coords.top;
-    }
-    return { x, y };
-}
-function getParentOrHost(el) {
-    // Handle slot traversal - if element is assigned to a slot, go to the slot first
-    if (el.assignedSlot) {
-        return el.assignedSlot;
-    }
-    let nextEl = el.parentElement;
-    if (!nextEl) {
-        // Check if we're at a shadow root boundary
-        const rootNode = el.getRootNode();
-        if (rootNode instanceof ShadowRoot && rootNode.host) {
-            nextEl = rootNode.host;
-        }
-    }
-    return nextEl;
-}
-function findPositionedAncestor(el) {
-    // Used to find the nearest positioned ancestor of an element (typically absolute or fixed)
-    let positionedAncestor = getParentOrHost(el);
-    while (positionedAncestor && positionedAncestor !== document.documentElement) {
-        const ancestorStyle = window.getComputedStyle(positionedAncestor);
-        if (["relative", "absolute", "fixed", "sticky"].includes(ancestorStyle.position)) {
-            return positionedAncestor;
-        }
-        positionedAncestor = getParentOrHost(positionedAncestor);
-    }
-    // If no positioned ancestor found, that ancestor is the document element
-    return document.documentElement;
-}
-function findPositioningBoundary(el) {
-    // Check for positioned elements that create new positioning contexts
-    let current = el;
-    while (current && current !== document.documentElement) {
-        const currentStyle = window.getComputedStyle(current);
-        // Elements with position: fixed are positioned relative to viewport
-        if (currentStyle.position === "fixed") {
-            return current;
-        }
-        // Elements with position: absolute are positioned relative to nearest positioned ancestor
-        if (currentStyle.position === "absolute") {
-            return findPositionedAncestor(current);
-        }
-        current = getParentOrHost(current);
-    }
-    return null; // No special positioning context found
-}
-export function findAllScrollableParents(el) {
-    const scrollableParents = [];
-    let currentEl = getParentOrHost(el);
-    // Traverse up to and including the document.documentElement (html element)
-    while (currentEl) {
-        const style = window.getComputedStyle(currentEl);
-        if (["scroll", "auto"].includes(style.overflowY) || ["scroll", "auto"].includes(style.overflowX)) {
-            scrollableParents.push(currentEl);
-        }
-        currentEl = getParentOrHost(currentEl);
-    }
-    if (document.documentElement && !scrollableParents.includes(document.documentElement)) {
-        // Check if the document itself is scrollable (common case for page-level scrolling)
-        // Special case: document element can scroll even with overflow: visible when content overflows viewport
-        const htmlStyle = window.getComputedStyle(document.documentElement);
-        if (["scroll", "auto"].includes(htmlStyle.overflowY) ||
-            ["scroll", "auto"].includes(htmlStyle.overflowX) ||
-            // For document element only: also check if page content can actually scroll
-            document.documentElement.scrollHeight > document.documentElement.clientHeight ||
-            document.documentElement.scrollWidth > document.documentElement.clientWidth) {
-            scrollableParents.push(document.documentElement);
-        }
-    }
-    return scrollableParents;
-}
-export function getCumulativeScrollOffset(el) {
-    const scrollableParents = findAllScrollableParents(el);
-    let totalScrollX = 0;
-    let totalScrollY = 0;
-    // Find the positioning context boundary - this determines which scroll offsets are relevant
-    const positioningBoundary = findPositioningBoundary(el);
-    scrollableParents.forEach((parent) => {
-        // Skip scroll offsets from elements outside the positioning boundary, but include the positioning boundary itself
-        if (positioningBoundary && parent !== positioningBoundary && !positioningBoundary.contains(parent)) {
-            return;
-        }
-        if (parent === document.documentElement) {
-            // For the document element, use window scroll values
-            totalScrollX += window.scrollX || window.pageXOffset || 0;
-            totalScrollY += window.scrollY || window.pageYOffset || 0;
-        }
-        else {
-            // For regular elements, use scrollLeft/scrollTop
-            totalScrollX += parent.scrollLeft;
-            totalScrollY += parent.scrollTop;
-        }
-    });
-    return { x: totalScrollX, y: totalScrollY };
-}
-export function findParentWithHiddenOverflow(el) {
-    while (!!el) {
-        if (window.getComputedStyle(el).overflowY !== "visible") {
-            return el;
-        }
-        el = getParentOrHost(el);
-    }
-}
-export function isElOrChild(componentEl, el) {
-    var _a;
-    // determines whether or not the element is the component, a child of the component, or exists within the component's shadowroot
-    return el === componentEl || componentEl.contains(el) || ((_a = componentEl.shadowRoot) === null || _a === void 0 ? void 0 : _a.contains(el));
-}
-export function getContextMeasurements(el) {
-    const fixedRect = el.getBoundingClientRect();
-    const parentEl = findParentWithHiddenOverflow(el);
-    const parentRect = parentEl && parentEl.getBoundingClientRect();
-    // if parentEl is not found, measurements are checked against the viewport
-    return {
-        // NB boundingClientRect.bottom is space from top of viewport to bottom of el
-        // to get space below the el -> height of viewport minus boundingClientRect.bottom
-        spaceAbove: parentRect ? fixedRect.top - parentRect.top : fixedRect.top,
-        // NB boundingClientRect.bottom is space from top of viewport to bottom of el
-        // to get space below the el -> height of viewport minus boundingClientRect.bottom
-        spaceBelow: parentRect
-            ? parentRect.bottom - fixedRect.bottom
-            : document.documentElement.clientHeight - fixedRect.bottom,
-        spaceLeft: parentRect ? fixedRect.left - parentRect.left : fixedRect.left,
-        spaceRight: parentRect
-            ? parentRect.right - fixedRect.right
-            : document.documentElement.clientWidth - fixedRect.right,
-    };
-}
-export function shouldOpenUp(fixedEl, //the element visible on the page when the component is closed
-closableElHeight, //the dropdown/popup/etc that becomes visible when the component is open
-offsetAbove = 0, // if closableEl covers a part of fixedEl, that part should be offset
-offsetBelow = 0) {
-    const { spaceAbove, spaceBelow } = getContextMeasurements(fixedEl);
-    //we want to open up only if there's not enough space below AND there is enough space above
-    const openUp = closableElHeight > spaceBelow + offsetBelow && closableElHeight <= spaceAbove + offsetAbove;
-    return openUp;
-}
-export function shouldOpenDown(fixedEl, //the element visible on the page when the component is closed
-closableElHeight, //the dropdown/popup/etc that becomes visible when the component is open
-offsetAbove = 0, // if closableEl covers a part of fixedEl, that part should be offset
-offsetBelow = 0) {
-    const { spaceAbove, spaceBelow } = getContextMeasurements(fixedEl);
-    //we want to open up only if there's not enough space below AND there is enough space above
-    const openDown = closableElHeight > spaceAbove + offsetAbove && closableElHeight <= spaceBelow + offsetBelow;
-    return openDown;
-}
-export function shouldShiftRight(fixedEl, closableElWidth) {
-    const { spaceLeft, spaceRight } = getContextMeasurements(fixedEl);
-    const needsSpaceLeft = closableElWidth > spaceLeft && spaceRight > spaceLeft;
-    return needsSpaceLeft;
-}
-export function shouldShiftLeft(fixedEl, closableElWidth) {
-    const { spaceLeft, spaceRight } = getContextMeasurements(fixedEl);
-    const needsSpaceRight = closableElWidth > spaceRight && spaceLeft > spaceRight;
-    return needsSpaceRight;
-}
-export function adjustTooltipPlacement(placement, anchorEl, tooltipHeight, tooltipWidth) {
-    const { spaceLeft, spaceRight, spaceBelow, spaceAbove } = getContextMeasurements(anchorEl);
-    const enoughSpaceAbove = spaceAbove > tooltipHeight;
-    const enoughSpaceBelow = spaceBelow > tooltipHeight;
-    // a tooltip should never be closer than 24px to the edge of a screen
-    const enoughSpaceLeft = spaceLeft - 24 > tooltipWidth;
-    const enoughSpaceRight = spaceRight - 24 > tooltipWidth;
-    const swapAbove = (placement) => {
-        return !enoughSpaceAbove ? placement.replace("top", "bottom") : placement;
-    };
-    const swapBelow = (placement) => {
-        return !enoughSpaceBelow && enoughSpaceAbove ? placement.replace("bottom", "top") : placement;
-    };
-    const swapLeft = (placement, centeredPosition) => {
-        if (!enoughSpaceLeft && enoughSpaceRight) {
-            placement = placement.replace("left", "right");
-        }
-        else if (!enoughSpaceLeft && !enoughSpaceRight) {
-            placement = centeredPosition;
-        }
-        return placement;
-    };
-    const swapRight = (placement, centeredPosition) => {
-        if (!enoughSpaceRight && enoughSpaceLeft) {
-            placement = placement.replace("right", "left");
-        }
-        else if (!enoughSpaceRight && !enoughSpaceLeft) {
-            placement = centeredPosition;
-        }
-        return placement;
-    };
-    // horizontal checks must occur before vertical checks, because horizontal can affect vertical placement but not vice versa
-    switch (placement) {
-        case "left":
-            placement = swapLeft(placement, "bottom");
-        case "right":
-            placement = swapRight(placement, "bottom");
-        case "top-left":
-            placement = swapLeft(placement, "top");
-            placement = swapAbove(placement);
-        case "top-right":
-            placement = swapRight(placement, "top");
-            placement = swapAbove(placement);
-        case "bottom-left":
-            placement = swapLeft(placement, "bottom");
-            placement = swapBelow(placement);
-        case "bottom-right":
-            placement = swapRight(placement, "bottom");
-            placement = swapBelow(placement);
-        case "top":
-            placement = swapAbove(placement);
-        case "bottom":
-            placement = swapBelow(placement);
-    }
-    return placement;
-}
-export function showTooltip(placement, anchorEl, tooltipText) {
-    // until popover is supported by firefox, we have to check for and position additional tooltip rendered within the modal's dialog element
-    // this additional tooltip is only rendered in browsers that do not support popover
-    const tooltipEls = document.querySelectorAll(".wm-tooltip");
-    tooltipEls.forEach((tooltipEl) => {
-        //@ts-ignore
-        if (!!tooltipEl.showPopover) {
-            //@ts-ignore
-            tooltipEl.showPopover();
-        }
-        tooltipEl.classList.add("show");
-        tooltipEl.textContent = tooltipText;
-        // tooltip only has a maxWidth if it contains whitespace and can break
-        const hasNoWhitespace = tooltipText.match(/^[^\s]+$/);
-        if (hasNoWhitespace) {
-            tooltipEl.classList.add("single-word");
-            tooltipEl.style.setProperty("--wmTooltipMaxWidth", "none");
-        }
-        else {
-            tooltipEl.classList.remove("single-word");
-            tooltipEl.style.removeProperty("--wmTooltipMaxWidth");
-        }
-        const tooltipRect = tooltipEl.getBoundingClientRect();
-        const anchorRect = anchorEl.getBoundingClientRect();
-        const adjustedPlacement = adjustTooltipPlacement(placement, anchorEl, tooltipRect.height, tooltipRect.width);
-        let verticalPos, horizontalPos;
-        [verticalPos, horizontalPos] = positionTooltip(adjustedPlacement, anchorRect, tooltipRect.height, tooltipRect.width);
-        tooltipEl.style.setProperty("--wmTooltipTop", verticalPos + "px");
-        tooltipEl.style.setProperty("--wmTooltipLeft", horizontalPos + "px");
-    });
-}
-export function hideTooltip() {
-    const tooltipEls = document.querySelectorAll(".wm-tooltip");
-    tooltipEls.forEach((tooltipEl) => {
-        //@ts-ignore
-        if (!!tooltipEl.hidePopover) {
-            //@ts-ignore
-            tooltipEl.hidePopover();
-        }
-        tooltipEl.classList.remove("show");
-    });
-}
-function positionTooltip(placement, anchorRect, tooltipHeight, tooltipWidth) {
-    // to get the center positions, calculate the difference between the button width and the tooltip width
-    const verticalDiff = (anchorRect.height - tooltipHeight) / 2;
-    const horizontalDiff = (anchorRect.width - tooltipWidth) / 2;
-    // the naming convention defaults to center in the absence of a value
-    // "top" and "bottom" imply centering horizontally; "right" and "left" imply centering vertically
-    // therefore we first set to center and adjust accordingly
-    let verticalPos = anchorRect.top + verticalDiff;
-    let horizontalPos = anchorRect.left + horizontalDiff;
-    if (placement.includes("top")) {
-        verticalPos = anchorRect.top - tooltipHeight - 8;
-    }
-    if (placement.includes("bottom")) {
-        verticalPos = anchorRect.bottom + 8;
-    }
-    if (placement.includes("left")) {
-        horizontalPos = anchorRect.left - tooltipWidth - 8;
-    }
-    if (placement.includes("right")) {
-        horizontalPos = anchorRect.right + 8;
-    }
-    // after all positioning has been calculated, if tooltip is off-screen or closer than 24px it is readjusted
-    // this only occurs when the tooltip is overflowing to the left and is placed top or bottom
-    // (button placed too far left, or screen size under 268px)
-    horizontalPos = Math.max(horizontalPos, 24);
-    return [verticalPos, horizontalPos];
-}
-export function hasRoomRight(x, spaceNeeded) {
-    let horizOffset = 0;
-    // if (getTextDir() === "ltr") {
-    if (x.type === "click") {
-        // if it's a mouse event, deal with mouse coords
-        horizOffset = x.clientX;
-        // if it's a focus event, the offset is 0
-    }
-    else if (x.type === "focus") {
-        horizOffset = 0;
-    }
-    else {
-        // otherwise an element was passed, calculate how far it is from the edge of the window
-        let el = x; // re-assignment is for clarity
-        while (el) {
-            if (el.tagName == "BODY") {
-                // deal with browser quirks with body/window/document and page scroll
-                var xScroll = el.scrollLeft || document.documentElement.scrollLeft;
-                horizOffset += el.offsetLeft - xScroll + el.clientLeft;
-            }
-            else {
-                // for all other non-BODY elements
-                horizOffset += el.offsetLeft - el.scrollLeft + el.clientLeft;
-            }
-            el = el.offsetParent;
-        }
-        // }
-    }
-    return window.innerWidth - horizOffset >= spaceNeeded;
-}
-export function checkForActiveElInShadow(element) {
-    while (element && element.shadowRoot) {
-        element = element.shadowRoot.activeElement;
-    }
-    return element;
-}
-export function checkForFocusableElInShadow(element) {
-    const selectors = [
-        "button",
-        "a",
-        "input",
-        "select",
-        "textarea",
-        "wm-button",
-        "wm-search",
-        "wm-select",
-        "wm-action-menu",
-        "wm-tab-item",
-        "wm-datepicker",
-    ];
-    let focusableEl = element;
-    selectors.forEach((selector) => {
-        if (focusableEl && focusableEl.shadowRoot) {
-            let elInShadow = focusableEl.shadowRoot.querySelector(selector);
-            if (elInShadow) {
-                if (selector.startsWith("wm-")) {
-                    focusableEl = checkForFocusableElInShadow(elInShadow);
-                }
-                else {
-                    focusableEl = elInShadow;
-                }
-            }
-        }
-    });
-    return focusableEl;
-}
-export function isFocusable(element) {
-    if (element.tabIndex > 0 || (element.tabIndex === 0 && element.getAttribute("tabIndex") !== null)) {
-        return true;
-    }
-    if (element.disabled) {
-        return false;
-    }
-    switch (element.nodeName) {
-        case "A":
-            return !!element.href && element.rel != "ignore";
-        case "INPUT":
-            return element.type != "hidden" && element.type != "file";
-        case "BUTTON":
-        case "SELECT":
-        case "TEXTAREA":
-        case "WM-BUTTON":
-        case "WM-SELECT":
-        case "WM-ACTION-MENU":
-        case "WM-DATEPICKER":
-        case "WM-TIMEPICKER":
-        case "WM-INPUT":
-        case "WM-TAG-INPUT":
-        case "WM-TAB-ITEM":
-        case "WM-SEARCH":
-            return true;
-        default:
-            return false;
-    }
-}
-export function getFirstFocusableDescendant(element) {
-    if (isFocusable(element)) {
-        return checkForFocusableElInShadow(element);
-    }
-    else if (element.childNodes.length > 0) {
-        element.childNodes.forEach((i) => {
-            const childEl = getFirstFocusableDescendant(i);
-            return childEl && checkForFocusableElInShadow(childEl);
-        });
-    }
-}
-export function getLastFocusableDescendant(element) {
-    if (isFocusable(element)) {
-        return checkForFocusableElInShadow(element);
-    }
-    else if (element.childNodes.length > 0) {
-        // Convert to array and reverse to process children from last to first
-        const children = Array.from(element.childNodes).reverse();
-        return children.reduce((focusable, child) => {
-            if (focusable)
-                return focusable;
-            const childEl = getLastFocusableDescendant(child);
-            return childEl ? checkForFocusableElInShadow(childEl) : null;
-        }, null);
-    }
-    return null;
-}
-// takes a string (space separated list of extensions), returns an array of strings (corresponding MIME types)
-export function getAcceptedMimeTypesList(acceptedExtensions) {
-    // this is just a list of common file types (regardless of whether they are/can be valid or not)
-    // front end checks are just a convenience to users, independent of security.
-    // it allows users to be notified of an invalid type as soon as they select the file, rather than when it gets uploaded
-    const lookupTable = {
-        aac: ["audio/aac"],
-        abw: ["application/x-abiword"],
-        arc: ["application/x-freearc"],
-        avi: ["video/x-msvideo"],
-        azw: ["application/vnd.amazon.ebook"],
-        bin: ["application/octet-stream"],
-        bmp: ["image/bmp"],
-        bz: ["application/x-bzip"],
-        bz2: ["application/x-bzip2"],
-        csh: ["application/x-csh"],
-        css: ["text/css"],
-        csv: ["text/csv"],
-        doc: ["application/msword"],
-        docx: ["application/vnd.openxmlformats-officedocument.wordprocessingml.document"],
-        eot: ["application/vnd.ms-fontobject"],
-        epub: ["application/epub+zip"],
-        gz: ["application/gzip"],
-        gif: ["image/gif"],
-        htm: ["text/html"],
-        html: ["text/html"],
-        ico: ["image/vnd.microsoft.icon"],
-        ics: ["text/calendar"],
-        jar: ["application/java-archive"],
-        jpeg: ["image/jpeg"],
-        jpg: ["image/jpeg"],
-        js: ["text/javascript"],
-        json: ["application/json"],
-        jsonld: ["application/ld+json"],
-        log: ["text/plain"],
-        mid: ["audio/x-midi"],
-        midi: ["audio/x-midi"],
-        mjs: ["text/javascript"],
-        mp3: ["audio/mpeg"],
-        mpeg: ["video/mpeg"],
-        mpkg: ["application/vnd.apple.installer+xml"],
-        odp: ["application/vnd.oasis.opendocument.presentation"],
-        ods: ["application/vnd.oasis.opendocument.spreadsheet"],
-        odt: ["application/vnd.oasis.opendocument.text"],
-        oga: ["audio/ogg"],
-        ogv: ["video/ogg"],
-        ogx: ["application/ogg"],
-        opus: ["audio/opus"],
-        otf: ["font/otf"],
-        png: ["image/png"],
-        pdf: ["application/pdf"],
-        php: ["application/php"],
-        ppt: ["application/vnd.ms-powerpoint"],
-        pptx: ["application/vnd.openxmlformats-officedocument.presentationml.presentation"],
-        rar: ["application/vnd.rar", "application/x-rar", "application/x-rar-compressed"],
-        rtf: ["application/rtf"],
-        sh: ["application/x-sh"],
-        svg: ["image/svg+xml"],
-        swf: ["application/x-shockwave-flash"],
-        tar: ["application/x-tar"],
-        tif: ["image/tiff"],
-        tiff: ["image/tiff"],
-        ts: ["video/mp2t"],
-        ttf: ["font/ttf"],
-        txt: ["text/plain"],
-        vsd: ["application/vnd.visio"],
-        wav: ["audio/wav"],
-        weba: ["audio/webm"],
-        webm: ["video/webm"],
-        webp: ["image/webp"],
-        woff: ["font/woff"],
-        woff2: ["font/woff2"],
-        xhtml: ["application/xhtml+xml"],
-        xls: ["application/vnd.ms-excel"],
-        xlsx: ["application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"],
-        xml: ["application/xml", "text/xml"],
-        xul: ["application/vnd.mozilla.xul+xml"],
-        zip: ["application/zip", "application/x-zip-compressed", "multipart/x-zip"],
-        "3gp": ["video/3gpp", "audio/3gpp"],
-        "3g2": ["video/3gpp2", "audio/3gpp2"],
-        "7z": ["application/x-7z-compressed"],
-    };
-    return acceptedExtensions.reduce((acc, ext) => acc.concat(lookupTable[ext]), []);
-}
-export function snakeCaseToCamelCase(str) {
-    const snakeCaseRegexp = /^([a-z0-9]*)(_[a-z0-9]*)*$/g;
-    if (snakeCaseRegexp.test(str)) {
-        let camelCase = "";
-        let arr = str.split("_");
-        arr.forEach((word, idx) => {
-            camelCase += idx === 0 ? word.toLowerCase() : word.charAt(0).toUpperCase() + word.slice(1);
-        });
-        return camelCase;
-    }
-    else {
-        return str;
-    }
-}
-export function csvToArray(csv) {
-    return csv ? csv.split(/, ?/) : [];
-}
-export function getNewIndexToFocus(currentIndex, direction, listLength) {
-    let newIndex = currentIndex;
-    if (direction === "ArrowDown") {
-        newIndex = (currentIndex + 1) % listLength;
-    }
-    if (direction === "ArrowUp") {
-        newIndex = currentIndex === 0 ? listLength - 1 : currentIndex - 1;
-    }
-    return newIndex;
-}
-export function isRelatedTarget(ev, id) {
-    // used for onBlur events to check the element that has been clicked
-    const ids = id.split(" ");
-    return ev.relatedTarget && ids.includes(ev.relatedTarget.id);
-}
-export function toBool(val) {
-    // string "false" needs to be treated as bool False because react wrappers convert bool to string.
-    return val == "false" ? false : !!val;
-}
-export function measureText(originEl, placeholderText) {
-    const measurementEl = document.createElement("div");
-    const originStyles = getComputedStyle(originEl);
-    measurementEl.style.position = "absolute";
-    measurementEl.style.top = "-100vh";
-    measurementEl.style.fontFamily = originStyles.fontFamily;
-    measurementEl.style.fontWeight = originStyles.fontWeight;
-    measurementEl.style.fontSize = originStyles.fontSize;
-    measurementEl.textContent = placeholderText;
-    document.body.appendChild(measurementEl);
-    const boundingClientRect = measurementEl.getBoundingClientRect();
-    document.body.removeChild(measurementEl);
-    return boundingClientRect;
-}
-export function truncateText(textEl, text, availableSpace, endAmt) {
-    const cloneEl = document.createElement("div");
-    cloneEl.style.visibility = "hidden";
-    cloneEl.style.position = "absolute";
-    cloneEl.style.top = "-200vh";
-    cloneEl.style.left = "-200vh";
-    cloneEl.textContent = text;
-    textEl.appendChild(cloneEl);
-    const ellipses = "...";
-    const minimumLength = 2 + ellipses.length + endAmt;
-    let canFitText = availableSpace > cloneEl.clientWidth;
-    if (!canFitText && text.length > minimumLength) {
-        let frontChars = text.slice(0, text.length - endAmt - ellipses.length).trim();
-        let endChars = text.slice(-endAmt).trim();
-        let truncatedText = frontChars + ellipses + endChars;
-        cloneEl.textContent = truncatedText;
-        canFitText = availableSpace > cloneEl.clientWidth;
-        while (!canFitText && truncatedText.length > minimumLength) {
-            frontChars = frontChars.slice(0, -1).trim();
-            truncatedText = frontChars + ellipses + endChars;
-            cloneEl.textContent = truncatedText;
-            canFitText = availableSpace > cloneEl.clientWidth;
-        }
-    }
-    const truncatedText = cloneEl.textContent;
-    cloneEl.remove();
-    return truncatedText;
-}
-export function transposeMatrix(originalMatrix) {
-    let newMatrix = [];
-    for (let i = 0; i < originalMatrix[0].length; i++) {
-        let column = [];
-        for (let j = 0; j < originalMatrix.length; j++) {
-            column.push(originalMatrix[j][i]);
-        }
-        newMatrix.push(column);
-    }
-    return newMatrix;
-}
-// wrap around includes 0, so it won't work for something like dates (wrapping around months)
-export function wrapAround(currentIdx, step, endIdx) {
-    currentIdx += step;
-    if (currentIdx > endIdx) {
-        currentIdx = (currentIdx - 1) % endIdx;
-    }
-    while (currentIdx < 0) {
-        currentIdx = endIdx - Math.abs(currentIdx) + 1;
-    }
-    return currentIdx;
-}
-export function skipByInterval(list, skipInterval) {
-    let skippedList = [];
-    for (let i = 0; i < list.length; i += 1 + skipInterval) {
-        skippedList.push(list[i]);
-    }
-    return skippedList;
-}
-export function getSmallestSkipInterval(list, maxLength) {
-    let skipInterval = 0;
-    let skippedList = list;
-    while (skipByInterval(list, skipInterval).length > maxLength) {
-        skipInterval++;
-        skippedList = skipByInterval(list, skipInterval);
-    }
-    return { skipInterval: skipInterval, skippedList: skippedList };
-}
-export function calcPercentageInRange(value, rangeLowest, rangeHighest) {
-    const rangeDistance = rangeHighest - rangeLowest;
-    const adjustedValue = Math.abs(value - rangeLowest);
-    const percentage = (adjustedValue / rangeDistance) * 100;
-    return percentage;
-}
-export function triggerFormSubmit(formEl) {
-    // requestSubmit is not supported by Safari v<16, use a polyfill for this
-    if (formEl.requestSubmit) {
-        formEl.requestSubmit();
-    }
-    else {
-        const submitButton = document.createElement("button");
-        submitButton.style.display = "none";
-        formEl.appendChild(submitButton);
-        submitButton.click();
-        document.removeChild(submitButton);
-    }
-}
-export function handleDisabledAttribute(el, isDisabled) {
-    if (isDisabled == false && el.hasAttribute("disabled")) {
-        el.removeAttribute("disabled");
-    }
-}
-// get the prev/next element with an option to circle through the list
-export function findPrev(list, item, loop = false) {
-    if (!!list && !item)
-        return list[list.length - 1]; // if list was passed but no item, get the last item
-    if (!list.includes(item))
-        return; // if list is empty or doesn't include item
-    let current = list.indexOf(item);
-    let beforeFirst = loop ? list.length - 1 : 0; // before first item can be first (hard stop) or back to last
-    let prev = current > 0 ? current - 1 : beforeFirst;
-    return list[prev];
-}
-export function findNext(list, item, loop = false) {
-    if (!!list && !item)
-        return list[0]; // if list was passed but no item, get the first item
-    if (!list.includes(item))
-        return; // if list is empty or doesn't include item
-    let current = list.indexOf(item);
-    const last = list.length - 1;
-    let afterLast = loop ? 0 : last; // after last item can be last (hard stop) or back to first
-    let next = current !== last ? current + 1 : afterLast;
-    return list[next];
-}
-export function safeMultiplyFloat(factor1, factor2) {
-    // There can be floating point precision errors when multiplying floats.
-    // For example 0.2 * 3 will result in 0.6000000000000001 instead of the expected 0.6
-    const factor1DecimalCount = countDecimals(factor1);
-    const factor2DecimalCount = countDecimals(factor2);
-    const expectedDecimals = factor1DecimalCount + factor2DecimalCount;
-    return parseFloat((factor1 * factor2).toFixed(expectedDecimals));
-}
-function countDecimals(num) {
-    const asString = num.toString();
-    const decimalPointIndex = asString.indexOf(".");
-    if (decimalPointIndex == -1) {
-        return 0;
-    }
-    else {
-        return asString.split(".")[1].length;
-    }
-}
-export function getMonthLength(month, year) {
-    const months30 = [4, 6, 9, 11];
-    const leapYear = year % 4 === 0;
-    return month === 2 ? (leapYear ? 29 : 28) : months30.includes(month) ? 30 : 31;
-}
-export function dateToISO(date) {
-    return `${date.getUTCFullYear()}-${(date.getUTCMonth() + 1).toString().padStart(2, "0")}-${date
-        .getDate()
-        .toString()
-        .padStart(2, "0")}`;
-}
-function splitISO(isoDate) {
-    const [year, month, day] = isoDate.split("-");
-    return {
-        year: { asInt: parseInt(year), asString: year },
-        month: { asInt: parseInt(month), asString: month },
-        day: { asInt: parseInt(day), asString: day },
-    };
-}
-export function makeISO(y, m, d) {
-    return `${y}-${m.toString().padStart(2, "0")}-${d.toString().padStart(2, "0")}`;
-}
-export const dateFind = {
-    year: {
-        asString: (date) => splitISO(date).year.asString,
-        asInt: (date) => splitISO(date).year.asInt,
-        increase: (date, n) => {
-            const _date = splitISO(date);
-            const y = _date.year.asInt;
-            const m = _date.month.asInt;
-            const d = _date.day.asInt;
-            return makeISO(y + n, m, d);
-        },
-        decrease: (date, n) => {
-            const _date = splitISO(date);
-            const y = _date.year.asInt;
-            const m = _date.month.asInt;
-            const d = _date.day.asInt;
-            return makeISO(y - n, m, d);
-        },
-    },
-    month: {
-        asString: (date) => splitISO(date).month.asString,
-        asInt: (date) => splitISO(date).month.asInt,
-        increase: (date, n) => {
-            const _date = splitISO(date);
-            const yearsToAdd = Math.floor(n / 12);
-            const monthsToAdd = n % 12;
-            let y = _date.year.asInt;
-            let m = _date.month.asInt;
-            const d = _date.day.asInt;
-            y = m + monthsToAdd > 12 ? y + 1 : y;
-            y = y + yearsToAdd;
-            m = m + monthsToAdd;
-            // modulo requires zero-indexing
-            m = ((m - 1) % 12) + 1;
-            return makeISO(y, m, d);
-        },
-        decrease: (date, n) => {
-            const _date = splitISO(date);
-            const yearsToRemove = Math.floor(n / 12);
-            const monthsToRemove = n % 12;
-            let y = _date.year.asInt;
-            let m = _date.month.asInt;
-            const d = _date.day.asInt;
-            y = m - monthsToRemove < 1 ? y - 1 : y;
-            y = y - yearsToRemove;
-            // ensure no negative value by shifting up
-            m = m + 12;
-            m = m - monthsToRemove;
-            // modulo needs zero-indexing
-            m = ((m - 1) % 12) + 1;
-            return makeISO(y, m, d);
-        },
-    },
-    day: {
-        asString: (date) => splitISO(date).day.asString,
-        asInt: (date) => splitISO(date).day.asInt,
-        increase: (date, n) => {
-            if (n > 7)
-                throw new Error("this.dateFind.day.increase(): max 7 days");
-            const _date = splitISO(date);
-            let y = _date.year.asInt;
-            let m = _date.month.asInt;
-            let d = _date.day.asInt;
-            const maxDays = getMonthLength(m, y);
-            const goesToNextMonth = d + n > maxDays;
-            const goesToNextYear = goesToNextMonth && m === 12;
-            m = goesToNextMonth ? (goesToNextYear ? 1 : m + 1) : m;
-            y = goesToNextYear ? y + 1 : y;
-            d = ((d - 1 + n) % maxDays) + 1;
-            return makeISO(y, m, d);
-        },
-        decrease: (date, n) => {
-            if (n > 7)
-                throw new Error("this.dateFind.day.decrease(): max 7 days");
-            const _date = splitISO(date);
-            let y = _date.year.asInt;
-            let m = _date.month.asInt;
-            let d = _date.day.asInt;
-            const prevMonth = m === 1 ? 12 : m - 1;
-            const maxDays = getMonthLength(prevMonth, y);
-            const goesToPreviousMonth = d - n < 1;
-            const goesToPreviousYear = goesToPreviousMonth && m === 1;
-            // ensure no negative value by shifting up
-            d = d + maxDays;
-            d = d - n;
-            // modulo needs zero-indexing
-            d = ((d - 1) % maxDays) + 1;
-            m = goesToPreviousMonth ? (goesToPreviousYear ? 12 : m - 1) : m;
-            y = goesToPreviousYear ? y - 1 : y;
-            return makeISO(y, m, d);
-        },
-    },
-};
-export const calendar_months = [
-    intl.formatMessage({
-        id: "date.january",
-        defaultMessage: "January",
-        description: "Month of the year",
-    }),
-    intl.formatMessage({
-        id: "date.february",
-        defaultMessage: "February",
-        description: "Month of the year",
-    }),
-    intl.formatMessage({
-        id: "date.march",
-        defaultMessage: "March",
-        description: "Month of the year",
-    }),
-    intl.formatMessage({
-        id: "date.april",
-        defaultMessage: "April",
-        description: "Month of the year",
-    }),
-    intl.formatMessage({
-        id: "date.may",
-        defaultMessage: "May",
-        description: "Month of the year",
-    }),
-    intl.formatMessage({
-        id: "date.june",
-        defaultMessage: "June",
-        description: "Month of the year",
-    }),
-    intl.formatMessage({
-        id: "date.july",
-        defaultMessage: "July",
-        description: "Month of the year",
-    }),
-    intl.formatMessage({
-        id: "date.august",
-        defaultMessage: "August",
-        description: "Month of the year",
-    }),
-    intl.formatMessage({
-        id: "date.september",
-        defaultMessage: "September",
-        description: "Month of the year",
-    }),
-    intl.formatMessage({
-        id: "date.october",
-        defaultMessage: "October",
-        description: "Month of the year",
-    }),
-    intl.formatMessage({
-        id: "date.november",
-        defaultMessage: "November",
-        description: "Month of the year",
-    }),
-    intl.formatMessage({
-        id: "date.december",
-        defaultMessage: "December",
-        description: "Month of the year",
-    }),
-];
-export const weekdays = [
-    intl.formatMessage({ id: "date.sunday", defaultMessage: "Sunday" }),
-    intl.formatMessage({ id: "date.monday", defaultMessage: "Monday" }),
-    intl.formatMessage({ id: "date.tuesday", defaultMessage: "Tuesday" }),
-    intl.formatMessage({ id: "date.wednesday", defaultMessage: "Wednesday" }),
-    intl.formatMessage({ id: "date.thursday", defaultMessage: "Thursday" }),
-    intl.formatMessage({ id: "date.friday", defaultMessage: "Friday" }),
-    intl.formatMessage({ id: "date.saturday", defaultMessage: "Saturday" }),
-];