Dropdown component

[platypii]

Adds a Dropdown component to the hyperparam package. Useful for the demos, etc.

I also fixed a few random nits and upgraded the dependencies.

[severo]

cool. Some comments + I made a PR against this branch: #207

[platypii]

@bleakley

[bleakley]

We should also add a keyboard handler here for up/down arrow. Going down from the main button should loop through the children but not cycle back to the main button again.

function handleArrowKeys(event: KeyboardEvent) {
      if (isOpen && (event.key === 'ArrowDown' || event.key === 'ArrowUp')) {
        event.preventDefault()
        const focusableElements = menuRef.current?.querySelectorAll<HTMLElement>(
          'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
        )
        if (focusableElements && focusableElements.length > 0) {
          const currentIndex = Array.from(focusableElements).indexOf(document.activeElement as HTMLElement)
          let nextIndex = currentIndex
          if (event.key === 'ArrowDown') {
            nextIndex = (currentIndex + 1) % focusableElements.length
          } else if (event.key === 'ArrowUp') {
            nextIndex = (currentIndex - 1 + focusableElements.length) % focusableElements.length
          }
          focusableElements[nextIndex]?.focus()
        }
      }
    }

[bleakley]

Arrow key handling would be nice but not absolutely needed

[bleakley]

I don't think we need to add this escape key listener to the dropdown anymore, unless there's some tiny part of the element that's outside of the button and the content.

[platypii]

if the user tabs out to another part of the page and hits escape, we should probably close the menu? leaving it for now