AI Plan Generation. Clear button sets focus

src/components/FilledInput.tsx

@@ -26,6 +26,7 @@ const FilledInput: React.FC<FilledInputProps> = ({
     multiline = false, rows = 3
 }) => {
     const id = useId();
+    const inputRef = React.useRef<HTMLInputElement | HTMLTextAreaElement>(null);
 
     const handleClear = () => {
         const syntheticEvent = {
@@ -33,6 +34,7 @@ const FilledInput: React.FC<FilledInputProps> = ({
         } as React.ChangeEvent<HTMLInputElement>;
         onChange(syntheticEvent);
         if (onClear) onClear();
+        inputRef.current?.focus();
     };
 
     return (
@@ -43,6 +45,7 @@ const FilledInput: React.FC<FilledInputProps> = ({
 
             {!multiline ? (
                 <input
+                    ref={inputRef as React.RefObject<HTMLInputElement>}
                     id={id}
                     type={type}
                     step={step}
@@ -59,6 +62,7 @@ const FilledInput: React.FC<FilledInputProps> = ({
                 />
             ) : (
                 <textarea
+                    ref={inputRef as React.RefObject<HTMLTextAreaElement>}
                     id={id}
                     rows={rows}
                     className={`w-full pt-6 pb-2 pl-4 bg-transparent text-body-lg text-on-surface focus:outline-none placeholder-transparent resize-none ${rightElement ? 'pr-20' : 'pr-10'}`}