/**
   * Limit focus to focusable elements inside `element`
   * @param {HTMLElement} element - DOM element to focus trap inside
   * @return {Function} cleanup function
   */
  function focusTrap(element) {
    const focusableElements = getFocusableElements(element)
    const firstFocusableEl = focusableElements[0]
    const lastFocusableEl = focusableElements[focusableElements.length - 1]
  
    // Wait for the case the element was not yet rendered
    setTimeout(() => firstFocusableEl.focus(), 50)
  
    /**
     * Get all focusable elements inside `element`
     * @param {HTMLElement} element - DOM element to focus trap inside
     * @return {HTMLElement[]} List of focusable elements
     */
    function getFocusableElements(element = document) {
      return [
        ...element.querySelectorAll(
          'a, button, details, input, select, textarea, [tabindex]:not([tabindex="-1"])'
        ),
      ].filter((e) => !e.hasAttribute('disabled'))
    }
  
    function handleKeyDown(e) {
      const TAB = 9
      const isTab = e.key.toLowerCase() === 'tab' || e.keyCode === TAB
  
      if (!isTab) return
  
      if (e.shiftKey) {
        if (document.activeElement === firstFocusableEl) {
          lastFocusableEl.focus()
          e.preventDefault()
        }
      } else {
        if (document.activeElement === lastFocusableEl) {
          firstFocusableEl.focus()
          e.preventDefault()
        }
      }
    }
  
    element.addEventListener('keydown', handleKeyDown)
  
    return function cleanup() {
      element.removeEventListener('keydown', handleKeyDown)
    }
  }