@watermarkinsights/ripple 4.3.0 → 4.4.0-0

package/dist/collection/global/functions.js

@@ -2,614 +2,614 @@ 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;
-  }
+    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,
+    locale: locale,
+    defaultLocale: "en",
+    messages: lang[locale] || lang.en,
 }, cache);
 export function generateId() {
-  return "wmcl-" + Math.random().toString(36).substr(2, 10);
+    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);
-    }
-  };
+    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);
-  };
+    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() : "";
+    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;
+    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;
     }
-    y = coords.top;
-  }
-  return { x, y };
+    return { x, y };
 }
 export function findParentWithScrollbar(el) {
-  while (!!el) {
-    if (el.scrollHeight > el.clientHeight && ["scroll", "auto"].includes(window.getComputedStyle(el).overflowY)) {
-      return el;
+    while (!!el) {
+        if (el.scrollHeight > el.clientHeight && ["scroll", "auto"].includes(window.getComputedStyle(el).overflowY)) {
+            return el;
+        }
+        el = el.parentElement;
     }
-    el = el.parentElement;
-  }
 }
 export function findParentWithHiddenOverflow(el) {
-  while (!!el) {
-    if (window.getComputedStyle(el).overflowY !== "visible") {
-      return el;
+    while (!!el) {
+        if (window.getComputedStyle(el).overflowY !== "visible") {
+            return el;
+        }
+        el = el.parentElement;
     }
-    el = el.parentElement;
-  }
 }
 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,
-  };
+    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;
+    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;
+    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;
+    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;
+    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;
+    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;
-  };
-  // 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");
-  });
+    // 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");
-  });
+    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];
+    // 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;
+    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;
+    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;
+    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;
+    });
+    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;
-  }
+    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);
-    });
-  }
+    if (isFocusable(element)) {
+        return checkForFocusableElInShadow(element);
+    }
+    else if (element.childNodes.length > 0) {
+        element.childNodes.forEach((i) => {
+            const childEl = getFirstFocusableDescendant(i);
+            return childEl && checkForFocusableElInShadow(childEl);
+        });
+    }
 }
 // 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]), []);
+    // 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;
-  }
+    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(/, ?/) : [];
+    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;
+    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);
+    // 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;
+    // 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;
+    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;
+    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]);
+    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);
     }
-    newMatrix.push(column);
-  }
-  return newMatrix;
+    return newMatrix;
 }
 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;
+    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;
+    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 };
+    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;
+    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);
-  }
+    // 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");
-  }
+    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];
+    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];
+    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];
 }