multiline clip name

electron-ui/src/renderer/components/Trimmer/dialogs/DeleteClipDialog.tsx

@@ -35,6 +35,7 @@ export default function DeleteClipDialog({
         <button
           type="button"
           onClick={onDelete}
+          autoFocus
           className="bg-plum hover:bg-plumDark text-white font-bold h-10 px-4 rounded-md"
         >
           Delete

electron-ui/src/renderer/components/Trimmer/dialogs/NameEditDialog.tsx

@@ -4,6 +4,7 @@ import {
   DialogTitle,
   DialogContent,
   DialogActions,
+  TextField,
 } from '@mui/material';
 
 export default function NameEditDialog({
@@ -35,17 +36,17 @@ export default function NameEditDialog({
     >
       <DialogTitle>Edit Clip Name</DialogTitle>
       <DialogContent>
-        <textarea
+        <TextField
           autoFocus
+          multiline
+          variant="standard"
           className="font-bold text-lg bg-transparent outline-none border-b border-plum focus:border-plumDark text-white mb-1 w-full text-center resize-y"
           value={input}
           onChange={(e) => {
             setInput(e.target.value);
           }}
-          rows={3}
           onFocus={(event) => event.target.select()}
           aria-label="Edit clip name"
-          style={{ minHeight: '3em' }}
         />
       </DialogContent>
       <DialogActions>