@six-group/ui-library 4.0.0-beta.1 → 4.0.0-beta.2

package/dist/collection/utils/popover.js

@@ -14,7 +14,7 @@
 // - Popper uses `translate3d` to position elements, so adding a transition to the `transform` property may have an
 //   undesired effect when the element is shown and when its placement changes.
 //
-import { createPopper } from '@popperjs/core';
+import { createPopper } from "@popperjs/core";
 export default class Popover {
   constructor(anchor, popover, options) {
     this.handleTransitionEnd = this.handleTransitionEnd.bind(this);
@@ -27,27 +27,32 @@ export default class Popover {
       strategy: 'absolute',
       transitionElement: this.popover,
       visibleClass: 'popover-visible',
-      onAfterShow: () => { },
-      onAfterHide: () => { },
-      onTransitionEnd: () => { },
+      onAfterShow: () => Promise,
+      onAfterHide: () => Promise,
+      onTransitionEnd: () => Promise,
     }, options);
     this.isVisible = false;
     this.popover.hidden = true;
-    this.popover.classList.remove(this.options.visibleClass);
+    if (this.options.visibleClass != null) {
+      this.popover.classList.remove(this.options.visibleClass);
+    }
     this.popover.addEventListener('transitionend', this.handleTransitionEnd);
   }
   handleTransitionEnd(event) {
+    var _a, _b;
     const target = event.target;
     // Make sure the transition event originates from from the correct element, and not one that has bubbled up
     if (target === this.options.transitionElement) {
       // This is called before the element is hidden so users can do things like reset scroll. It will fire once for
       // every transition property. Use `event.propertyName` to determine which property has finished transitioning.
-      this.options.onTransitionEnd.call(this, event);
+      (_a = this.options.onTransitionEnd) === null || _a === void 0 ? void 0 : _a.call(this, event);
       // Make sure we only do this once, since transitionend will fire for every transition
       if (!this.isVisible && !this.popover.hidden) {
         this.popover.hidden = true;
-        this.popover.classList.remove(this.options.visibleClass);
-        this.options.onAfterHide.call(this);
+        if (this.options.visibleClass != null) {
+          this.popover.classList.remove(this.options.visibleClass);
+        }
+        (_b = this.options.onAfterHide) === null || _b === void 0 ? void 0 : _b.call(this);
       }
     }
   }
@@ -55,14 +60,18 @@ export default class Popover {
     this.popover.removeEventListener('transitionend', this.handleTransitionEnd);
     if (this.popper) {
       this.popper.destroy();
-      this.popper = null;
+      this.popper = undefined;
     }
   }
   show() {
     this.isVisible = true;
     this.popover.hidden = false;
     this.popover.clientWidth; // force reflow
-    requestAnimationFrame(() => this.popover.classList.add(this.options.visibleClass));
+    requestAnimationFrame(() => {
+      if (this.options.visibleClass != null) {
+        this.popover.classList.add(this.options.visibleClass);
+      }
+    });
     if (this.popper) {
       this.popper.destroy();
     }
@@ -84,30 +93,35 @@ export default class Popover {
         },
       ],
     });
-    this.popover.addEventListener('transitionend', () => this.options.onAfterShow.call(this), { once: true });
+    this.popover.addEventListener('transitionend', () => { var _a; return (_a = this.options.onAfterShow) === null || _a === void 0 ? void 0 : _a.call(this); }, { once: true });
     // Reposition the menu after it appears in case a modifier kicked in
     requestAnimationFrame(() => { var _a; return (_a = this.popper) === null || _a === void 0 ? void 0 : _a.update(); });
   }
   reposition() {
-    this.popper.update();
+    var _a;
+    (_a = this.popper) === null || _a === void 0 ? void 0 : _a.update();
   }
   hide() {
     // Apply the hidden styles and wait for the transition before hiding completely
     this.isVisible = false;
-    this.popover.classList.remove(this.options.visibleClass);
+    if (this.options.visibleClass != null) {
+      this.popover.classList.remove(this.options.visibleClass);
+    }
   }
   setOptions(options) {
     this.options = Object.assign(this.options, options);
-    this.isVisible
-      ? this.popover.classList.add(this.options.visibleClass)
-      : this.popover.classList.remove(this.options.visibleClass);
+    if (this.options.visibleClass != null) {
+      this.isVisible
+        ? this.popover.classList.add(this.options.visibleClass)
+        : this.popover.classList.remove(this.options.visibleClass);
+    }
     // Update popper options
-    if (this.popper) {
-      this.popper.setOptions({
+    if (this.popper != null) {
+      void this.popper.setOptions({
         placement: this.options.placement,
         strategy: this.options.strategy,
       });
-      requestAnimationFrame(() => this.popper.update());
+      requestAnimationFrame(() => { var _a; return (_a = this.popper) === null || _a === void 0 ? void 0 : _a.update(); });
     }
   }
 }

package/dist/collection/utils/popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover.js","sourceRoot":"","sources":["../../src/utils/popover.ts"],"names":[],"mappings":"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","sourcesContent":["//\n// A positioning utility for popovers that handles show/hide/transitionEnd events with simple callbacks.\n//\n// Powered by Popper.js.\n//\n// NOTE:\n//\n// - The popover MUST have at least one property that transitions, otherwise transitionEnd won't fire and the popover\n//   won't be hidden. If transitions are delegated to a child element, set the `transitionElement` property accordingly.\n//\n// - When the popover is shown, it's assigned `PopoverOptions.visibleClass`. You can use this class to provide different\n//   transitions for show/hide.\n//\n// - Popper uses `translate3d` to position elements, so adding a transition to the `transform` property may have an\n//   undesired effect when the element is shown and when its placement changes.\n//\nimport { createPopper } from '@popperjs/core';\nimport { PopperInstance } from './popper';\n\nexport default class Popover {\n  anchor: HTMLElement;\n  isVisible: boolean;\n  popover: HTMLElement;\n  popper: PopperInstance;\n  options: PopoverOptions;\n\n  constructor(anchor: HTMLElement, popover: HTMLElement, options?: PopoverOptions) {\n    this.handleTransitionEnd = this.handleTransitionEnd.bind(this);\n\n    this.anchor = anchor;\n    this.popover = popover;\n    this.options = Object.assign(\n      {\n        skidding: 0,\n        distance: 0,\n        placement: 'bottom-start',\n        strategy: 'absolute',\n        transitionElement: this.popover,\n        visibleClass: 'popover-visible',\n        onAfterShow: () => {},\n        onAfterHide: () => {},\n        onTransitionEnd: () => {},\n      },\n      options\n    );\n\n    this.isVisible = false;\n    this.popover.hidden = true;\n    this.popover.classList.remove(this.options.visibleClass);\n\n    this.popover.addEventListener('transitionend', this.handleTransitionEnd);\n  }\n\n  private handleTransitionEnd(event: TransitionEvent) {\n    const target = event.target as HTMLElement;\n\n    // Make sure the transition event originates from from the correct element, and not one that has bubbled up\n    if (target === this.options.transitionElement) {\n      // This is called before the element is hidden so users can do things like reset scroll. It will fire once for\n      // every transition property. Use `event.propertyName` to determine which property has finished transitioning.\n      this.options.onTransitionEnd.call(this, event);\n\n      // Make sure we only do this once, since transitionend will fire for every transition\n      if (!this.isVisible && !this.popover.hidden) {\n        this.popover.hidden = true;\n        this.popover.classList.remove(this.options.visibleClass);\n        this.options.onAfterHide.call(this);\n      }\n    }\n  }\n\n  destroy() {\n    this.popover.removeEventListener('transitionend', this.handleTransitionEnd);\n\n    if (this.popper) {\n      this.popper.destroy();\n      this.popper = null;\n    }\n  }\n\n  show() {\n    this.isVisible = true;\n    this.popover.hidden = false;\n    this.popover.clientWidth; // force reflow\n    requestAnimationFrame(() => this.popover.classList.add(this.options.visibleClass));\n\n    if (this.popper) {\n      this.popper.destroy();\n    }\n\n    this.popper = createPopper(this.anchor, this.popover, {\n      placement: this.options.placement,\n      strategy: this.options.strategy,\n      modifiers: [\n        {\n          name: 'flip',\n          options: {\n            boundary: 'viewport',\n          },\n        },\n        {\n          name: 'offset',\n          options: {\n            offset: [this.options.skidding, this.options.distance],\n          },\n        },\n      ],\n    });\n\n    this.popover.addEventListener('transitionend', () => this.options.onAfterShow.call(this), { once: true });\n\n    // Reposition the menu after it appears in case a modifier kicked in\n    requestAnimationFrame(() => this.popper?.update());\n  }\n\n  reposition() {\n    this.popper.update();\n  }\n\n  hide() {\n    // Apply the hidden styles and wait for the transition before hiding completely\n    this.isVisible = false;\n    this.popover.classList.remove(this.options.visibleClass);\n  }\n\n  setOptions(options: PopoverOptions) {\n    this.options = Object.assign(this.options, options);\n    this.isVisible\n      ? this.popover.classList.add(this.options.visibleClass)\n      : this.popover.classList.remove(this.options.visibleClass);\n\n    // Update popper options\n    if (this.popper) {\n      this.popper.setOptions({\n        placement: this.options.placement,\n        strategy: this.options.strategy,\n      });\n\n      requestAnimationFrame(() => this.popper.update());\n    }\n  }\n}\n\ninterface PopoverOptions {\n  distance?: number;\n  placement?:\n    | 'auto'\n    | 'auto-start'\n    | 'auto-end'\n    | 'top'\n    | 'top-start'\n    | 'top-end'\n    | 'bottom'\n    | 'bottom-start'\n    | 'bottom-end'\n    | 'right'\n    | 'right-start'\n    | 'right-end'\n    | 'left'\n    | 'left-start'\n    | 'left-end';\n  skidding?: number;\n  strategy?: 'absolute' | 'fixed';\n  transitionElement?: HTMLElement;\n  visibleClass?: string;\n  onAfterShow?: () => any;\n  onAfterHide?: () => any;\n  onTransitionEnd?: (event: TransitionEvent) => any;\n}\n"]}
+{"version":3,"file":"popover.js","sourceRoot":"","sources":["../../src/utils/popover.ts"],"names":[],"mappings":"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","sourcesContent":["//\n// A positioning utility for popovers that handles show/hide/transitionEnd events with simple callbacks.\n//\n// Powered by Popper.js.\n//\n// NOTE:\n//\n// - The popover MUST have at least one property that transitions, otherwise transitionEnd won't fire and the popover\n//   won't be hidden. If transitions are delegated to a child element, set the `transitionElement` property accordingly.\n//\n// - When the popover is shown, it's assigned `PopoverOptions.visibleClass`. You can use this class to provide different\n//   transitions for show/hide.\n//\n// - Popper uses `translate3d` to position elements, so adding a transition to the `transform` property may have an\n//   undesired effect when the element is shown and when its placement changes.\n//\nimport { createPopper, Instance } from '@popperjs/core';\n\nexport default class Popover {\n  anchor: HTMLElement;\n  isVisible: boolean;\n  popover: HTMLElement;\n  popper?: Instance;\n  options: PopoverOptions;\n\n  constructor(anchor: HTMLElement, popover: HTMLElement, options?: PopoverOptions) {\n    this.handleTransitionEnd = this.handleTransitionEnd.bind(this);\n\n    this.anchor = anchor;\n    this.popover = popover;\n    this.options = Object.assign(\n      {\n        skidding: 0,\n        distance: 0,\n        placement: 'bottom-start',\n        strategy: 'absolute',\n        transitionElement: this.popover,\n        visibleClass: 'popover-visible',\n        onAfterShow: () => Promise<void>,\n        onAfterHide: () => Promise<void>,\n        onTransitionEnd: () => Promise<void>,\n      },\n      options\n    );\n\n    this.isVisible = false;\n    this.popover.hidden = true;\n    if (this.options.visibleClass != null) {\n      this.popover.classList.remove(this.options.visibleClass);\n    }\n\n    this.popover.addEventListener('transitionend', this.handleTransitionEnd);\n  }\n\n  private handleTransitionEnd(event: TransitionEvent) {\n    const target = event.target as HTMLElement;\n\n    // Make sure the transition event originates from from the correct element, and not one that has bubbled up\n    if (target === this.options.transitionElement) {\n      // This is called before the element is hidden so users can do things like reset scroll. It will fire once for\n      // every transition property. Use `event.propertyName` to determine which property has finished transitioning.\n      this.options.onTransitionEnd?.call(this, event);\n\n      // Make sure we only do this once, since transitionend will fire for every transition\n      if (!this.isVisible && !this.popover.hidden) {\n        this.popover.hidden = true;\n        if (this.options.visibleClass != null) {\n          this.popover.classList.remove(this.options.visibleClass);\n        }\n        this.options.onAfterHide?.call(this);\n      }\n    }\n  }\n\n  destroy() {\n    this.popover.removeEventListener('transitionend', this.handleTransitionEnd);\n\n    if (this.popper) {\n      this.popper.destroy();\n      this.popper = undefined;\n    }\n  }\n\n  show() {\n    this.isVisible = true;\n    this.popover.hidden = false;\n    this.popover.clientWidth; // force reflow\n    requestAnimationFrame(() => {\n      if (this.options.visibleClass != null) {\n        this.popover.classList.add(this.options.visibleClass);\n      }\n    });\n\n    if (this.popper) {\n      this.popper.destroy();\n    }\n\n    this.popper = createPopper(this.anchor, this.popover, {\n      placement: this.options.placement,\n      strategy: this.options.strategy,\n      modifiers: [\n        {\n          name: 'flip',\n          options: {\n            boundary: 'viewport',\n          },\n        },\n        {\n          name: 'offset',\n          options: {\n            offset: [this.options.skidding, this.options.distance],\n          },\n        },\n      ],\n    });\n\n    this.popover.addEventListener('transitionend', () => this.options.onAfterShow?.call(this), { once: true });\n\n    // Reposition the menu after it appears in case a modifier kicked in\n    requestAnimationFrame(() => this.popper?.update());\n  }\n\n  reposition() {\n    this.popper?.update();\n  }\n\n  hide() {\n    // Apply the hidden styles and wait for the transition before hiding completely\n    this.isVisible = false;\n    if (this.options.visibleClass != null) {\n      this.popover.classList.remove(this.options.visibleClass);\n    }\n  }\n\n  setOptions(options: PopoverOptions) {\n    this.options = Object.assign(this.options, options);\n    if (this.options.visibleClass != null) {\n      this.isVisible\n        ? this.popover.classList.add(this.options.visibleClass)\n        : this.popover.classList.remove(this.options.visibleClass);\n    }\n\n    // Update popper options\n    if (this.popper != null) {\n      void this.popper.setOptions({\n        placement: this.options.placement,\n        strategy: this.options.strategy,\n      });\n\n      requestAnimationFrame(() => this.popper?.update());\n    }\n  }\n}\n\ninterface PopoverOptions {\n  distance?: number;\n  placement?:\n    | 'auto'\n    | 'auto-start'\n    | 'auto-end'\n    | 'top'\n    | 'top-start'\n    | 'top-end'\n    | 'bottom'\n    | 'bottom-start'\n    | 'bottom-end'\n    | 'right'\n    | 'right-start'\n    | 'right-end'\n    | 'left'\n    | 'left-start'\n    | 'left-end';\n  skidding?: number;\n  strategy?: 'absolute' | 'fixed';\n  transitionElement?: HTMLElement;\n  visibleClass?: string;\n  onAfterShow?: () => void;\n  onAfterHide?: () => void;\n  onTransitionEnd?: (event: TransitionEvent) => void;\n}\n"]}

package/dist/collection/utils/popup.js

@@ -0,0 +1,95 @@
+/**
+ * If the popup is hoisted we popup is hoisted its position will change to fix to not be clipped of by a containing container.
+ * To render the popup correctly we render it normally, and then assign this screenposition to the fixed popup
+ */
+export function adjustPopupForHoisting(hoist, popup, inputElement, wrapper, minPopupHeight, dropdownDirectionChanged) {
+  if (!hoist || popup == null || inputElement == null || wrapper == null) {
+    return;
+  }
+  // take a snapshot of normally rendered popup
+  const popupDimensions = setPopupAsFixPosition(popup);
+  const inputDimensions = inputElement.getBoundingClientRect();
+  const inputTop = inputDimensions.top;
+  const popupTop = popupDimensions.top;
+  const isUp = calcIsDropDownContentUp(inputElement, wrapper, minPopupHeight);
+  // check screen position to check whether the popup should be moved above or below the trigger element
+  if (isUp && inputTop < popupTop) {
+    //  move popup above input field if datepicker is at bottom of screen
+    popup.style.top = `${popupTop - popupDimensions.height - inputDimensions.height}px`;
+  }
+  dropdownDirectionChanged(isUp);
+}
+/*
+ * For small screens the datepicker popup could be cut-off even though there might still be space within the viewport.
+ * This is because the popup is always aligned with the trigger input field. However in the scenario of small screens
+ * we should reposition the popup to use the space available.
+ */
+export function adjustPopupForSmallScreens(popup) {
+  // execute after dropdown has been rendered to make sure the popup reference is correctly set
+  setTimeout(() => {
+    if (popup == null) {
+      return;
+    }
+    const popupDimensions = popup.getBoundingClientRect();
+    if (popupDimensions.y < 0 &&
+      window.innerHeight - popupDimensions.height > 0 &&
+      Math.abs(popupDimensions.y) <= popupDimensions.height) {
+      // handle case where popup is cut-off on top but there is still space available
+      setPopupAsFixPosition(popup);
+      popup.style.top = '0px';
+    }
+    else if (window.innerHeight < popupDimensions.y + popupDimensions.height &&
+      window.innerHeight > popupDimensions.height &&
+      Math.abs(popupDimensions.y - window.innerHeight) <= popupDimensions.height) {
+      // handle case where popup is cut-off at the bottom but there is still space available above
+      // apply screen position to fixed popup
+      setPopupAsFixPosition(popup);
+      popup.style.top = `${window.innerHeight - popupDimensions.height}px`;
+    }
+    if (window.innerWidth < popupDimensions.x + popupDimensions.width &&
+      window.innerWidth > popupDimensions.width &&
+      Math.abs(popupDimensions.x - window.innerWidth) <= popupDimensions.width) {
+      // handle case where popup is cut-off to the right
+      setPopupAsFixPosition(popup);
+      popup.style.left = `${window.innerWidth - popupDimensions.width}px`;
+    }
+  }, 0);
+}
+export function calcIsDropDownContentUp(inputElement, wrapper, minPopupHeight) {
+  const inputBoundingRect = inputElement.getBoundingClientRect();
+  const wrapperBoundingRect = wrapper.getBoundingClientRect();
+  const popupHeight = Math.max(wrapperBoundingRect.height, minPopupHeight);
+  const moreSpaceInTop = inputBoundingRect.y > window.innerHeight / 2;
+  return moreSpaceInTop && window.innerHeight < inputBoundingRect.bottom + popupHeight;
+}
+export function setPopupAsFixPosition(popup) {
+  const popupDimensions = popup.getBoundingClientRect();
+  popup.style.position = 'fixed';
+  popup.style.top = popupDimensions['top'] + 'px';
+  popup.style.left = popupDimensions['left'] + 'px';
+  popup.style.width = popupDimensions['width'] + 'px';
+  popup.style.height = popupDimensions['height'] + 'px';
+  return popupDimensions;
+}
+/*
+ * The position of the hoisted datepicker needs to be correctly calculated since the position changes to fixed.
+ * Thus if the user scrolls or adjusts the screen size we need to recalculate the datepicker position.
+ */
+export function movePopup(hoist, open, popup, inputElement, wrapper, minPopupHeight) {
+  if (!hoist || !open || popup == null || inputElement == null || wrapper == null) {
+    return;
+  }
+  const popupBoundingClientRect = popup.getBoundingClientRect();
+  const popupHeight = popupBoundingClientRect.height;
+  const inputBoundingClientRect = inputElement.getBoundingClientRect();
+  const inputTop = inputBoundingClientRect.top;
+  const inputHeight = inputBoundingClientRect.height;
+  const isUp = calcIsDropDownContentUp(inputElement, wrapper, minPopupHeight);
+  if (isUp) {
+    popup.style.top = `${inputTop - popupHeight}px`;
+  }
+  else {
+    popup.style.top = `${inputTop + inputHeight}px`;
+  }
+}
+//# sourceMappingURL=popup.js.map

package/dist/collection/utils/popup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"popup.js","sourceRoot":"","sources":["../../src/utils/popup.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * If the popup is hoisted we popup is hoisted its position will change to fix to not be clipped of by a containing container.\n * To render the popup correctly we render it normally, and then assign this screenposition to the fixed popup\n */\nexport function adjustPopupForHoisting(\n  hoist: boolean,\n  popup: HTMLElement | undefined,\n  inputElement: HTMLElement | undefined,\n  wrapper: HTMLElement | undefined,\n  minPopupHeight: number,\n  dropdownDirectionChanged: (isUp: boolean) => void\n) {\n  if (!hoist || popup == null || inputElement == null || wrapper == null) {\n    return;\n  }\n  // take a snapshot of normally rendered popup\n  const popupDimensions = setPopupAsFixPosition(popup);\n  const inputDimensions = inputElement.getBoundingClientRect();\n  const inputTop = inputDimensions.top;\n  const popupTop = popupDimensions.top;\n\n  const isUp = calcIsDropDownContentUp(inputElement, wrapper, minPopupHeight);\n  // check screen position to check whether the popup should be moved above or below the trigger element\n  if (isUp && inputTop < popupTop) {\n    //  move popup above input field if datepicker is at bottom of screen\n    popup.style.top = `${popupTop - popupDimensions.height - inputDimensions.height}px`;\n  }\n  dropdownDirectionChanged(isUp);\n}\n\n/*\n * For small screens the datepicker popup could be cut-off even though there might still be space within the viewport.\n * This is because the popup is always aligned with the trigger input field. However in the scenario of small screens\n * we should reposition the popup to use the space available.\n */\nexport function adjustPopupForSmallScreens(popup?: HTMLElement) {\n  // execute after dropdown has been rendered to make sure the popup reference is correctly set\n  setTimeout(() => {\n    if (popup == null) {\n      return;\n    }\n    const popupDimensions = popup.getBoundingClientRect();\n    if (\n      popupDimensions.y < 0 &&\n      window.innerHeight - popupDimensions.height > 0 &&\n      Math.abs(popupDimensions.y) <= popupDimensions.height\n    ) {\n      // handle case where popup is cut-off on top but there is still space available\n      setPopupAsFixPosition(popup);\n      popup.style.top = '0px';\n    } else if (\n      window.innerHeight < popupDimensions.y + popupDimensions.height &&\n      window.innerHeight > popupDimensions.height &&\n      Math.abs(popupDimensions.y - window.innerHeight) <= popupDimensions.height\n    ) {\n      // handle case where popup is cut-off at the bottom but there is still space available above\n      // apply screen position to fixed popup\n      setPopupAsFixPosition(popup);\n      popup.style.top = `${window.innerHeight - popupDimensions.height}px`;\n    }\n\n    if (\n      window.innerWidth < popupDimensions.x + popupDimensions.width &&\n      window.innerWidth > popupDimensions.width &&\n      Math.abs(popupDimensions.x - window.innerWidth) <= popupDimensions.width\n    ) {\n      // handle case where popup is cut-off to the right\n      setPopupAsFixPosition(popup);\n      popup.style.left = `${window.innerWidth - popupDimensions.width}px`;\n    }\n  }, 0);\n}\n\nexport function calcIsDropDownContentUp(\n  inputElement: HTMLElement,\n  wrapper: HTMLElement,\n  minPopupHeight: number\n): boolean {\n  const inputBoundingRect = inputElement.getBoundingClientRect();\n  const wrapperBoundingRect = wrapper.getBoundingClientRect();\n  const popupHeight = Math.max(wrapperBoundingRect.height, minPopupHeight);\n  const moreSpaceInTop = inputBoundingRect.y > window.innerHeight / 2;\n  return moreSpaceInTop && window.innerHeight < inputBoundingRect.bottom + popupHeight;\n}\n\nexport function setPopupAsFixPosition(popup: HTMLElement): DOMRect {\n  const popupDimensions = popup.getBoundingClientRect();\n  popup.style.position = 'fixed';\n  popup.style.top = popupDimensions['top'] + 'px';\n  popup.style.left = popupDimensions['left'] + 'px';\n  popup.style.width = popupDimensions['width'] + 'px';\n  popup.style.height = popupDimensions['height'] + 'px';\n  return popupDimensions;\n}\n\n/*\n * The position of the hoisted datepicker needs to be correctly calculated since the position changes to fixed.\n * Thus if the user scrolls or adjusts the screen size we need to recalculate the datepicker position.\n */\nexport function movePopup(\n  hoist: boolean,\n  open: boolean,\n  popup: HTMLElement | undefined,\n  inputElement: HTMLElement | undefined,\n  wrapper: HTMLElement | undefined,\n  minPopupHeight: number\n) {\n  if (!hoist || !open || popup == null || inputElement == null || wrapper == null) {\n    return;\n  }\n  const popupBoundingClientRect = popup.getBoundingClientRect();\n  const popupHeight = popupBoundingClientRect.height;\n  const inputBoundingClientRect = inputElement.getBoundingClientRect();\n  const inputTop = inputBoundingClientRect.top;\n  const inputHeight = inputBoundingClientRect.height;\n\n  const isUp = calcIsDropDownContentUp(inputElement, wrapper, minPopupHeight);\n\n  if (isUp) {\n    popup.style.top = `${inputTop - popupHeight}px`;\n  } else {\n    popup.style.top = `${inputTop + inputHeight}px`;\n  }\n}\n"]}

package/dist/collection/utils/scroll.js

@@ -1,4 +1,4 @@
-import { getOffset } from './offset';
+import { getOffset } from "./offset";
 const locks = new Set();
 //
 // Prevents body scrolling. Keeps track of which elements requested a lock so multiple levels of locking are possible

package/dist/collection/utils/scroll.spec.js

@@ -0,0 +1,122 @@
+import { scrollIntoView } from "./scroll";
+describe('scrollIntoView', () => {
+  describe('vertical scrolling', () => {
+    it('should scroll vertically if element is out of view', async () => {
+      // given
+      const element = {
+        clientWidth: 320,
+        clientHeight: 56,
+        getBoundingClientRect: () => ({
+          top: 1744,
+          left: 16,
+        }),
+      };
+      const mockScrollTo = jest.fn();
+      const container = {
+        scrollTop: 0,
+        scrollLeft: 0,
+        offsetWidth: 320,
+        offsetHeight: 754,
+        getBoundingClientRect: () => ({
+          top: 656,
+          left: 16,
+        }),
+        scrollTo: mockScrollTo,
+      };
+      // when
+      scrollIntoView(element, container);
+      // then
+      expect(mockScrollTo).toHaveBeenCalledWith({
+        top: 390,
+        behavior: 'smooth',
+      });
+    });
+    it('should not scroll vertically if element is in view', async () => {
+      // given
+      const element = {
+        clientWidth: 320,
+        clientHeight: 56,
+        getBoundingClientRect: () => ({
+          top: 700,
+          left: 16,
+        }),
+      };
+      const mockScrollTo = jest.fn();
+      const container = {
+        scrollTop: 0,
+        scrollLeft: 0,
+        offsetWidth: 320,
+        offsetHeight: 754,
+        getBoundingClientRect: () => ({
+          top: 656,
+          left: 16,
+        }),
+        scrollTo: mockScrollTo,
+      };
+      // when
+      scrollIntoView(element, container);
+      // then
+      expect(mockScrollTo).not.toHaveBeenCalled();
+    });
+  });
+  describe('horizontal scrolling', () => {
+    it('should scroll horizontally if element is out of view', async () => {
+      // given
+      const element = {
+        clientWidth: 320,
+        clientHeight: 56,
+        getBoundingClientRect: () => ({
+          top: 500,
+          left: 330,
+        }),
+      };
+      const mockScrollTo = jest.fn();
+      const container = {
+        scrollTop: 0,
+        scrollLeft: 0,
+        offsetWidth: 320,
+        offsetHeight: 754,
+        getBoundingClientRect: () => ({
+          top: 656,
+          left: 16,
+        }),
+        scrollTo: mockScrollTo,
+      };
+      // when
+      scrollIntoView(element, container, 'horizontal');
+      // then
+      expect(mockScrollTo).toHaveBeenCalledWith({
+        left: 314,
+        behavior: 'smooth',
+      });
+    });
+    it('should not scroll vertically if element is in view', async () => {
+      // given
+      const element = {
+        clientWidth: 320,
+        clientHeight: 56,
+        getBoundingClientRect: () => ({
+          top: 500,
+          left: 16,
+        }),
+      };
+      const mockScrollTo = jest.fn();
+      const container = {
+        scrollTop: 0,
+        scrollLeft: 0,
+        offsetWidth: 320,
+        offsetHeight: 754,
+        getBoundingClientRect: () => ({
+          top: 656,
+          left: 16,
+        }),
+        scrollTo: mockScrollTo,
+      };
+      // when
+      scrollIntoView(element, container, 'horizontal');
+      // then
+      expect(mockScrollTo).not.toHaveBeenCalled();
+    });
+  });
+});
+//# sourceMappingURL=scroll.spec.js.map

package/dist/collection/utils/scroll.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll.spec.js","sourceRoot":"","sources":["../../src/utils/scroll.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { scrollIntoView } from './scroll';\n\ndescribe('scrollIntoView', () => {\n  describe('vertical scrolling', () => {\n    it('should scroll vertically if element is out of view', async () => {\n      // given\n      const element: Partial<HTMLElement> = {\n        clientWidth: 320,\n        clientHeight: 56,\n        getBoundingClientRect: () =>\n          ({\n            top: 1744,\n            left: 16,\n          } as DOMRect),\n      };\n\n      const mockScrollTo = jest.fn();\n      const container: Partial<HTMLElement> = {\n        scrollTop: 0,\n        scrollLeft: 0,\n        offsetWidth: 320,\n        offsetHeight: 754,\n        getBoundingClientRect: () =>\n          ({\n            top: 656,\n            left: 16,\n          } as DOMRect),\n        scrollTo: mockScrollTo,\n      };\n\n      // when\n      scrollIntoView(element as HTMLElement, container as HTMLElement);\n\n      // then\n      expect(mockScrollTo).toHaveBeenCalledWith({\n        top: 390,\n        behavior: 'smooth',\n      });\n    });\n\n    it('should not scroll vertically if element is in view', async () => {\n      // given\n      const element: Partial<HTMLElement> = {\n        clientWidth: 320,\n        clientHeight: 56,\n        getBoundingClientRect: () =>\n          ({\n            top: 700,\n            left: 16,\n          } as DOMRect),\n      };\n\n      const mockScrollTo = jest.fn();\n      const container: Partial<HTMLElement> = {\n        scrollTop: 0,\n        scrollLeft: 0,\n        offsetWidth: 320,\n        offsetHeight: 754,\n        getBoundingClientRect: () =>\n          ({\n            top: 656,\n            left: 16,\n          } as DOMRect),\n        scrollTo: mockScrollTo,\n      };\n\n      // when\n      scrollIntoView(element as HTMLElement, container as HTMLElement);\n\n      // then\n      expect(mockScrollTo).not.toHaveBeenCalled();\n    });\n  });\n\n  describe('horizontal scrolling', () => {\n    it('should scroll horizontally if element is out of view', async () => {\n      // given\n      const element: Partial<HTMLElement> = {\n        clientWidth: 320,\n        clientHeight: 56,\n        getBoundingClientRect: () =>\n          ({\n            top: 500,\n            left: 330,\n          } as DOMRect),\n      };\n\n      const mockScrollTo = jest.fn();\n      const container: Partial<HTMLElement> = {\n        scrollTop: 0,\n        scrollLeft: 0,\n        offsetWidth: 320,\n        offsetHeight: 754,\n        getBoundingClientRect: () =>\n          ({\n            top: 656,\n            left: 16,\n          } as DOMRect),\n        scrollTo: mockScrollTo,\n      };\n\n      // when\n      scrollIntoView(element as HTMLElement, container as HTMLElement, 'horizontal');\n\n      // then\n      expect(mockScrollTo).toHaveBeenCalledWith({\n        left: 314,\n        behavior: 'smooth',\n      });\n    });\n\n    it('should not scroll vertically if element is in view', async () => {\n      // given\n      const element: Partial<HTMLElement> = {\n        clientWidth: 320,\n        clientHeight: 56,\n        getBoundingClientRect: () =>\n          ({\n            top: 500,\n            left: 16,\n          } as DOMRect),\n      };\n\n      const mockScrollTo = jest.fn();\n      const container: Partial<HTMLElement> = {\n        scrollTop: 0,\n        scrollLeft: 0,\n        offsetWidth: 320,\n        offsetHeight: 754,\n        getBoundingClientRect: () =>\n          ({\n            top: 656,\n            left: 16,\n          } as DOMRect),\n        scrollTo: mockScrollTo,\n      };\n\n      // when\n      scrollIntoView(element as HTMLElement, container as HTMLElement, 'horizontal');\n\n      // then\n      expect(mockScrollTo).not.toHaveBeenCalled();\n    });\n  });\n});\n"]}

package/dist/collection/utils/slot.js

@@ -1,26 +1,9 @@
 //
-// Given a slot, this function iterates over all of its assigned element and text nodes and returns the concatenated
-// HTML as a string. This is useful because we can't use slot.innerHTML as an alternative.
-//
-export function getInnerHTML(slot) {
-  const nodes = slot.assignedNodes({ flatten: true });
-  let html = '';
-  [...nodes].map((node) => {
-    if (node.nodeType === Node.ELEMENT_NODE) {
-      html += node.outerHTML;
-    }
-    if (node.nodeType === Node.TEXT_NODE) {
-      html += node.textContent;
-    }
-  });
-  return html;
-}
-//
 // Given a slot, this function iterates over all of its assigned text nodes and returns the concatenated text as a
 // string. This is useful because we can't use slot.textContent as an alternative.
 //
 export function getTextContent(slot) {
-  const nodes = slot ? slot.assignedNodes({ flatten: true }) : [];
+  const nodes = slot != null ? slot.assignedNodes({ flatten: true }) : [];
   let text = '';
   [...nodes].map((node) => {
     if (node.nodeType === Node.TEXT_NODE) {
@@ -35,12 +18,13 @@ export function getTextContent(slot) {
 //
 export function hasSlot(el, name) {
   // Look for a named slot
-  if (name) {
+  if (name != null && name !== '') {
     return el.querySelector(`[slot="${name}"]`) !== null;
   }
   // Look for a default slot
   return Array.from(el.childNodes).some((node) => {
-    if (node.nodeType === node.TEXT_NODE && node.textContent.trim() !== '') {
+    var _a;
+    if (node.nodeType === node.TEXT_NODE && ((_a = node.textContent) === null || _a === void 0 ? void 0 : _a.trim()) !== '') {
       return true;
     }
     if (node.nodeType === node.ELEMENT_NODE) {
@@ -52,9 +36,10 @@ export function hasSlot(el, name) {
     return false;
   });
 }
-const fromPairs = (acc, [k, v]) => (Object.assign(Object.assign({}, acc), { [k]: v }));
-export const getAvailableSlots = (slots) => (host) => Object.values(slots)
-  .map((name) => [name, hasSlot(host, name)])
-  .reduce(fromPairs, {});
 export const getSlotChildren = (el) => { var _a; return (_a = el.querySelector('slot')) === null || _a === void 0 ? void 0 : _a.assignedElements({ flatten: true }); };
+export function getSlot(element, slotName) {
+  if (element == null)
+    return null;
+  return element.querySelector(`[slot="${slotName}"]`);
+}
 //# sourceMappingURL=slot.js.map

package/dist/collection/utils/slot.js.map

@@ -1 +1 @@
-{"version":3,"file":"slot.js","sourceRoot":"","sources":["../../src/utils/slot.ts"],"names":[],"mappings":"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","sourcesContent":["//\n// Given a slot, this function iterates over all of its assigned element and text nodes and returns the concatenated\n// HTML as a string. This is useful because we can't use slot.innerHTML as an alternative.\n//\nexport function getInnerHTML(slot: HTMLSlotElement): string {\n  const nodes = slot.assignedNodes({ flatten: true });\n  let html = '';\n\n  [...nodes].map((node) => {\n    if (node.nodeType === Node.ELEMENT_NODE) {\n      html += (node as HTMLElement).outerHTML;\n    }\n\n    if (node.nodeType === Node.TEXT_NODE) {\n      html += node.textContent;\n    }\n  });\n\n  return html;\n}\n\n//\n// Given a slot, this function iterates over all of its assigned text nodes and returns the concatenated text as a\n// string. This is useful because we can't use slot.textContent as an alternative.\n//\nexport function getTextContent(slot: HTMLSlotElement): string {\n  const nodes = slot ? slot.assignedNodes({ flatten: true }) : [];\n  let text = '';\n\n  [...nodes].map((node) => {\n    if (node.nodeType === Node.TEXT_NODE) {\n      text += node.textContent;\n    }\n  });\n\n  return text;\n}\n\n//\n// Determines whether an element has a slot. If name is specified, the function will look for a corresponding named\n// slot, otherwise it will look for a \"default\" slot (e.g. a non-empty text node or an element with no slot attribute).\n//\nexport function hasSlot(el: HTMLElement, name?: string) {\n  // Look for a named slot\n  if (name) {\n    return el.querySelector(`[slot=\"${name}\"]`) !== null;\n  }\n\n  // Look for a default slot\n  return Array.from(el.childNodes).some((node) => {\n    if (node.nodeType === node.TEXT_NODE && node.textContent.trim() !== '') {\n      return true;\n    }\n\n    if (node.nodeType === node.ELEMENT_NODE) {\n      const el = node as HTMLElement;\n      if (!el.hasAttribute('slot')) {\n        return true;\n      }\n    }\n\n    return false;\n  });\n}\n\ntype AvailableSlots<T> = { readonly [K in keyof T]: boolean };\n\nconst fromPairs = <T extends string>(acc, [k, v]: [T, boolean]) => ({ ...acc, [k]: v });\n\nexport const getAvailableSlots =\n  <T extends object>(slots: T) =>\n  <E extends HTMLElement>(host: E): AvailableSlots<T> =>\n    Object.values(slots)\n      .map((name) => [name, hasSlot(host, name)])\n      .reduce(fromPairs, {} as AvailableSlots<T>);\n\nexport const getSlotChildren = <T extends HTMLElement>(el: HTMLElement) =>\n  el.querySelector('slot')?.assignedElements({ flatten: true }) as T[];\n"]}
+{"version":3,"file":"slot.js","sourceRoot":"","sources":["../../src/utils/slot.ts"],"names":[],"mappings":"AAAA,EAAE;AACF,kHAAkH;AAClH,kFAAkF;AAClF,EAAE;AACF,MAAM,UAAU,cAAc,CAAC,IAAsB;EACnD,MAAM,KAAK,GAAG,IAAI,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;EACxE,IAAI,IAAI,GAAG,EAAE,CAAC;EAEd,CAAC,GAAG,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;IACtB,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,SAAS,EAAE;MACpC,IAAI,IAAI,IAAI,CAAC,WAAW,CAAC;KAC1B;EACH,CAAC,CAAC,CAAC;EAEH,OAAO,IAAI,CAAC;AACd,CAAC;AAED,EAAE;AACF,mHAAmH;AACnH,uHAAuH;AACvH,EAAE;AACF,MAAM,UAAU,OAAO,CAAC,EAAe,EAAE,IAAa;EACpD,wBAAwB;EACxB,IAAI,IAAI,IAAI,IAAI,IAAI,IAAI,KAAK,EAAE,EAAE;IAC/B,OAAO,EAAE,CAAC,aAAa,CAAC,UAAU,IAAI,IAAI,CAAC,KAAK,IAAI,CAAC;GACtD;EAED,0BAA0B;EAC1B,OAAO,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,EAAE;;IAC7C,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,SAAS,IAAI,CAAA,MAAA,IAAI,CAAC,WAAW,0CAAE,IAAI,EAAE,MAAK,EAAE,EAAE;MACvE,OAAO,IAAI,CAAC;KACb;IAED,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,YAAY,EAAE;MACvC,MAAM,EAAE,GAAG,IAAmB,CAAC;MAC/B,IAAI,CAAC,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE;QAC5B,OAAO,IAAI,CAAC;OACb;KACF;IAED,OAAO,KAAK,CAAC;EACf,CAAC,CAAC,CAAC;AACL,CAAC;AAED,MAAM,CAAC,MAAM,eAAe,GAAG,CAAwB,EAAe,EAAE,EAAE,WACxE,OAAA,MAAA,EAAE,CAAC,aAAa,CAAC,MAAM,CAAC,0CAAE,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAQ,CAAA,EAAA,CAAC;AAEvE,MAAM,UAAU,OAAO,CAAC,OAAsC,EAAE,QAAgB;EAC9E,IAAI,OAAO,IAAI,IAAI;IAAE,OAAO,IAAI,CAAC;EACjC,OAAO,OAAO,CAAC,aAAa,CAAC,UAAU,QAAQ,IAAI,CAAC,CAAC;AACvD,CAAC","sourcesContent":["//\n// Given a slot, this function iterates over all of its assigned text nodes and returns the concatenated text as a\n// string. This is useful because we can't use slot.textContent as an alternative.\n//\nexport function getTextContent(slot?: HTMLSlotElement): string {\n  const nodes = slot != null ? slot.assignedNodes({ flatten: true }) : [];\n  let text = '';\n\n  [...nodes].map((node) => {\n    if (node.nodeType === Node.TEXT_NODE) {\n      text += node.textContent;\n    }\n  });\n\n  return text;\n}\n\n//\n// Determines whether an element has a slot. If name is specified, the function will look for a corresponding named\n// slot, otherwise it will look for a \"default\" slot (e.g. a non-empty text node or an element with no slot attribute).\n//\nexport function hasSlot(el: HTMLElement, name?: string): boolean {\n  // Look for a named slot\n  if (name != null && name !== '') {\n    return el.querySelector(`[slot=\"${name}\"]`) !== null;\n  }\n\n  // Look for a default slot\n  return Array.from(el.childNodes).some((node) => {\n    if (node.nodeType === node.TEXT_NODE && node.textContent?.trim() !== '') {\n      return true;\n    }\n\n    if (node.nodeType === node.ELEMENT_NODE) {\n      const el = node as HTMLElement;\n      if (!el.hasAttribute('slot')) {\n        return true;\n      }\n    }\n\n    return false;\n  });\n}\n\nexport const getSlotChildren = <T extends HTMLElement>(el: HTMLElement) =>\n  el.querySelector('slot')?.assignedElements({ flatten: true }) as T[];\n\nexport function getSlot(element: ParentNode | null | undefined, slotName: string): HTMLElement | null {\n  if (element == null) return null;\n  return element.querySelector(`[slot=\"${slotName}\"]`);\n}\n"]}

package/dist/collection/utils/tabbable.js

@@ -8,16 +8,16 @@ export function getNearestTabbableElement(el) {
     return el;
   }
   // Check the element's shadow root
-  if (el.shadowRoot) {
-    const tabbableShadowChild = [...el.shadowRoot.children].find(isTabbable);
-    if (tabbableShadowChild) {
+  if (el.shadowRoot != null) {
+    const tabbableShadowChild = [...el.shadowRoot.children].find((e) => isTabbable(e));
+    if (tabbableShadowChild != null) {
       return tabbableShadowChild;
     }
   }
   // Check the element's children
-  if (el.children) {
-    return [...el.children].map(getNearestTabbableElement)[0];
+  if (el.children != null) {
+    return [...el.children].map((e) => getNearestTabbableElement(e)).at(0);
   }
-  return null;
+  return undefined;
 }
 //# sourceMappingURL=tabbable.js.map

package/dist/collection/utils/tabbable.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabbable.js","sourceRoot":"","sources":["../../src/utils/tabbable.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,UAAU,CAAC,EAAe;EACxC,MAAM,QAAQ,GAAG,EAAE,CAAC,QAAQ,CAAC;EAC7B,OAAO,QAAQ,GAAG,CAAC,CAAC,CAAC;AACvB,CAAC;AAED,MAAM,UAAU,yBAAyB,CAAC,EAAe;EACvD,oBAAoB;EACpB,IAAI,UAAU,CAAC,EAAE,CAAC,EAAE;IAClB,OAAO,EAAE,CAAC;GACX;EAED,kCAAkC;EAClC,IAAI,EAAE,CAAC,UAAU,EAAE;IACjB,MAAM,mBAAmB,GAAG,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,UAAU,CAAgB,CAAC;IACxF,IAAI,mBAAmB,EAAE;MACvB,OAAO,mBAAmB,CAAC;KAC5B;GACF;EAED,+BAA+B;EAC/B,IAAI,EAAE,CAAC,QAAQ,EAAE;IACf,OAAO,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,yBAAyB,CAAC,CAAC,CAAC,CAAC,CAAC;GAC3D;EAED,OAAO,IAAI,CAAC;AACd,CAAC","sourcesContent":["export function isTabbable(el: HTMLElement) {\n  const tabIndex = el.tabIndex;\n  return tabIndex > -1;\n}\n\nexport function getNearestTabbableElement(el: HTMLElement): HTMLElement {\n  // Check the element\n  if (isTabbable(el)) {\n    return el;\n  }\n\n  // Check the element's shadow root\n  if (el.shadowRoot) {\n    const tabbableShadowChild = [...el.shadowRoot.children].find(isTabbable) as HTMLElement;\n    if (tabbableShadowChild) {\n      return tabbableShadowChild;\n    }\n  }\n\n  // Check the element's children\n  if (el.children) {\n    return [...el.children].map(getNearestTabbableElement)[0];\n  }\n\n  return null;\n}\n"]}
+{"version":3,"file":"tabbable.js","sourceRoot":"","sources":["../../src/utils/tabbable.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,UAAU,CAAC,EAAe;EACxC,MAAM,QAAQ,GAAG,EAAE,CAAC,QAAQ,CAAC;EAC7B,OAAO,QAAQ,GAAG,CAAC,CAAC,CAAC;AACvB,CAAC;AAED,MAAM,UAAU,yBAAyB,CAAC,EAAe;EACvD,oBAAoB;EACpB,IAAI,UAAU,CAAC,EAAE,CAAC,EAAE;IAClB,OAAO,EAAE,CAAC;GACX;EAED,kCAAkC;EAClC,IAAI,EAAE,CAAC,UAAU,IAAI,IAAI,EAAE;IACzB,MAAM,mBAAmB,GAAG,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,UAAU,CAAC,CAAgB,CAAC,CAAgB,CAAC;IACjH,IAAI,mBAAmB,IAAI,IAAI,EAAE;MAC/B,OAAO,mBAAmB,CAAC;KAC5B;GACF;EAED,+BAA+B;EAC/B,IAAI,EAAE,CAAC,QAAQ,IAAI,IAAI,EAAE;IACvB,OAAO,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,yBAAyB,CAAC,CAAgB,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;GACvF;EAED,OAAO,SAAS,CAAC;AACnB,CAAC","sourcesContent":["export function isTabbable(el: HTMLElement) {\n  const tabIndex = el.tabIndex;\n  return tabIndex > -1;\n}\n\nexport function getNearestTabbableElement(el: HTMLElement): HTMLElement | undefined {\n  // Check the element\n  if (isTabbable(el)) {\n    return el;\n  }\n\n  // Check the element's shadow root\n  if (el.shadowRoot != null) {\n    const tabbableShadowChild = [...el.shadowRoot.children].find((e) => isTabbable(e as HTMLElement)) as HTMLElement;\n    if (tabbableShadowChild != null) {\n      return tabbableShadowChild;\n    }\n  }\n\n  // Check the element's children\n  if (el.children != null) {\n    return [...el.children].map((e) => getNearestTabbableElement(e as HTMLElement)).at(0);\n  }\n\n  return undefined;\n}\n"]}