feat: focus

src/client/sidebar.jsx

@@ -105,6 +105,7 @@ const Sidebar = () => {
         canNodeHaveChildren={(node) => !node.uri}
         generateNodeProps={({node}) => ({
           onClick: (event) => {
+            event.target.focus();
             if (node.uri) {
               dispatch(setActiveResourceUri(node.uri));
             }
@@ -124,6 +125,7 @@ const Sidebar = () => {
               }));
             }
           },
+          tabIndex: 0,
         })}
         // eslint-disable-next-line no-shadow
         onChange={(treeData) => setTreeData(treeData)}

src/client/sidebar.raw.scss

@@ -62,7 +62,13 @@ h2 {
 .rstcustom__node {
   padding: 0 0.5em;
   &:hover {
-    background-color: rgba(255, 255, 255, 0.025);
+    background-color: rgba(102, 85, 255, 0.025);
+  }
+  &:focus-within {
+    background-color: #353e7d;
+  }
+  > :focus {
+    box-shadow: none;
   }
   button {
     top: 0.75em;