fix(search): improve arrow key navigation in DID search panel

- Arrow keys now move cursor within input field
- Only switch between fields when cursor is at edge position
- Right arrow switches from scope to name when at end of text
- Left arrow switches from name to scope when at beginning

Author: maany

src/component-library/features/search/DIDSearchPanel.tsx

@@ -242,13 +242,26 @@ export const DIDSearchPanel = (props: SearchPanelProps) => {
 
     const onScopeArrowDown = (event: React.KeyboardEvent<HTMLInputElement>) => {
         if (event.key === 'ArrowRight') {
-            nameInputRef.current?.focus();
+            const input = event.currentTarget;
+            const cursorPosition = input.selectionStart;
+            const textLength = input.value.length;
+
+            // Only switch to name input if cursor is at the end
+            if (cursorPosition === textLength) {
+                nameInputRef.current?.focus();
+            }
         }
     };
 
     const onNameArrowDown = (event: React.KeyboardEvent<HTMLInputElement>) => {
         if (event.key === 'ArrowLeft') {
-            scopeInputRef.current?.focus();
+            const input = event.currentTarget;
+            const cursorPosition = input.selectionStart;
+
+            // Only switch to scope input if cursor is at the beginning
+            if (cursorPosition === 0) {
+                scopeInputRef.current?.focus();
+            }
         }
     };