feat: ✨ made select events select all text on inputs

icssc · Jan 25, 2024 · 5fe0174 · 5fe0174
1 parent a833048
commit 5fe0174
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 8 deletions.
diff --git a/src/lib/components/meetingSetup/MeetingNameField.svelte b/src/lib/components/meetingSetup/MeetingNameField.svelte
@@ -8,8 +8,11 @@
     $meetingName = DEFAULT_MEETING_NAME;
   });
 
-  const onSelect = () => {
-    // TODO: Select all text in field
+  const onFocus = (e: Event) => {
+    (e.target as HTMLInputElement).select();
+  };
+  const onSelect = (e: Event) => {
+    (e.target as HTMLInputElement).select();
   };
 </script>
 
@@ -19,6 +22,7 @@
     alt="meeting name input"
     id="meeting-name-input"
     class="input h-full w-full rounded-lg text-center text-2xl text-zinc-500"
+    on:focus={onFocus}
     on:select={onSelect}
     bind:value={$meetingName}
   />

diff --git a/src/lib/components/meetingSetup/MeetingTimeField.svelte b/src/lib/components/meetingSetup/MeetingTimeField.svelte
@@ -8,10 +8,6 @@
     $startTime = DEFAULT_MEETING_TIMES.startTime;
     $endTime = DEFAULT_MEETING_TIMES.endTime;
   });
-
-  const onSelect = () => {
-    // TODO: Select all text in field
-  };
 </script>
 
 <!--TODO: make custom step -->
@@ -22,7 +18,6 @@
     id="meeting-start-time-input"
     class="input h-full w-full rounded-lg text-center text-2xl text-zinc-500"
     step="900"
-    on:select={onSelect}
     bind:value={$startTime}
   />
   <input
@@ -31,7 +26,6 @@
     id="meeting-end-time-input"
     class="input h-full w-full rounded-lg text-center text-2xl text-zinc-500"
     step="900"
-    on:select={onSelect}
     bind:value={$endTime}
   />
 </div>