feat(droppable): tab and select file with enter key

- Add ability to tab into droppable.
- Add ability to select file using the enter key.

Author: Brian Ochan

packages/core/src/Droppable/__snapshots__/index.test.tsx.snap

@@ -133,6 +133,8 @@ exports[`Droppable Droppable 1`] = `
         onDragLeave={[Function]}
         onDragOver={[Function]}
         onDrop={[Function]}
+        onKeyUp={[Function]}
+        tabIndex={0}
       >
         <span
           className="c3 c4"
@@ -325,6 +327,8 @@ exports[`Droppable Droppable 2`] = `
         onDragLeave={[Function]}
         onDragOver={[Function]}
         onDrop={[Function]}
+        onKeyUp={[Function]}
+        tabIndex={0}
       >
         <span
           className="c3 c4"

packages/core/src/Droppable/index.tsx

@@ -139,6 +139,18 @@ export const Droppable: React.FC<DroppableProps> = ({
     [handleFile, onChange]
   )
 
+  const handleKeyUp = useCallback<React.KeyboardEventHandler<BaseElement>>(
+    e => {
+      switch (e.key) {
+        case 'Enter': {
+          handleLinkClick()
+          break
+        }
+      }
+    },
+    [handleLinkClick]
+  )
+
   const hasSelectedFile = selectedFileName !== undefined
 
   return (
@@ -151,6 +163,8 @@ export const Droppable: React.FC<DroppableProps> = ({
       onDrop={handleDragAndDrop}
       onClick={handleLinkClick}
       className={className}
+      tabIndex={0}
+      onKeyUp={handleKeyUp}
     >
       <DroppableIcon icon={DropIcon} />
       <DroppableInputFile