Fix tsc errors

src/components/Explorer/FileExplorer.tsx

@@ -11,6 +11,7 @@ import { ContextMenu, ContextMenuItem } from '@src/components/ContextMenu'
 import type { Dispatch } from 'react'
 import { useRef, useState } from 'react'
 import { DeleteConfirmationDialog } from '@src/components/ProjectCard/DeleteProjectDialog'
+import type { MaybePressOrBlur, SubmitByPressOrBlur } from '@src/lib/types'
 
 export const StatusDot = () => {
   return <span className="text-primary hue-rotate-90">•</span>
@@ -131,12 +132,12 @@ function RenameForm({
   onSubmit,
 }: {
   row: FileExplorerRender
-  onSubmit: (e: React.KeyboardEvent<HTMLElement> | null) => void
+  onSubmit: SubmitByPressOrBlur
 }) {
   const inputRef = useRef<HTMLInputElement>(null)
 
-  function handleRenameSubmit(e: React.KeyboardEvent<HTMLElement>) {
-    if (e.key !== 'Enter') {
+  function handleRenameSubmit(e: NonNullable<MaybePressOrBlur>) {
+    if ('key' in e && e.key !== 'Enter') {
       return
     }
     // To get out of the renaming state, without this the current file is still in renaming mode
@@ -288,7 +289,7 @@ export const FileExplorerRowElement = ({
       ) : (
         <RenameForm
           row={row}
-          onSubmit={(event: React.KeyboardEvent<HTMLElement> | null) => {
+          onSubmit={(event: MaybePressOrBlur) => {
             row.onRenameEnd(event)
           }}
         ></RenameForm>

src/components/Explorer/ProjectExplorer.tsx

@@ -31,6 +31,7 @@ import {
 } from '@src/lib/paths'
 import { kclErrorsByFilename } from '@src/lang/errors'
 import { useKclContext } from '@src/lang/KclProvider'
+import type { MaybePressOrBlur } from '@src/lib/types'
 
 const isFileExplorerEntryOpened = (
   rows: { [key: string]: boolean },
@@ -331,7 +332,7 @@ export const ProjectExplorer = ({
             setIsRenaming(true)
             isRenamingRef.current = true
           },
-          onRenameEnd: (event: React.KeyboardEvent<HTMLElement> | null) => {
+          onRenameEnd: (event: MaybePressOrBlur) => {
             // TODO: Implement renameFolder and renameFile to navigate
             setIsRenaming(false)
             isRenamingRef.current = false
@@ -341,7 +342,12 @@ export const ProjectExplorer = ({
               return
             }
 
-            const requestedName = String(event?.target?.value || '')
+            const requestedName = String(
+              (event?.target &&
+                'value' in event.target &&
+                event.target.value) ||
+                ''
+            )
             if (!requestedName) {
               // user pressed esc
               return

src/components/Explorer/utils.ts

@@ -3,6 +3,7 @@ import type { CustomIconName } from '@src/components/CustomIcon'
 import { sortFilesAndDirectories } from '@src/lib/desktopFS'
 import type { FileEntry } from '@src/lib/project'
 import { desktopSafePathJoin, joinOSPaths } from '@src/lib/paths'
+import type { SubmitByPressOrBlur } from '@src/lib/types'
 
 /**
  * Remap FileEntry data into another data structure for the Project Explorer
@@ -42,7 +43,7 @@ export interface FileExplorerRow extends FileExplorerEntry {
   onOpenInNewWindow: () => void
   onDelete: () => void
   onRenameStart: () => void
-  onRenameEnd: (e: React.KeyboardEvent<HTMLElement> | null) => void
+  onRenameEnd: SubmitByPressOrBlur
 }
 
 /**

src/lib/types.ts

@@ -151,3 +151,11 @@ export type FileMeta =
       relPath: string
       data: Blob
     }
+
+/** A union type for form submissions that fire on submit or blur */
+export type MaybePressOrBlur =
+  | React.FocusEvent<HTMLElement>
+  | React.KeyboardEvent<HTMLElement>
+  | null
+/** A form submission handler function that is triggered by submission or blurring focus */
+export type SubmitByPressOrBlur = (e: MaybePressOrBlur) => void