Fixed focus and tabindex

Squashed commit of the following:

commit e334586
Author: Ponlawat W <[email protected]>
Date:   Mon Aug 21 09:22:40 2023 +0700

    Added tabindex for copy button

commit d3b4b0c
Author: Ponlawat W <[email protected]>
Date:   Mon Aug 21 09:16:19 2023 +0700

    Added default focus to textarea

src/App.svelte

@@ -1,14 +1,13 @@
 <script lang="ts">
+  import { Characters } from 'lanna-utils';
   import { getKeyDict, type KeyDict } from './keyboards/mapping';
   import { isDarkMode } from './stores/theme';
   import { KeyboardSource, type InsertCharacterEvent } from './keyboards/events';
-  import { Characters } from 'lanna-utils';
+  import { onMount, setContext } from 'svelte';
+  import { writable, type Writable } from 'svelte/store';
   import DefaultKeyMappings from './keyboards/mappings/default';
   import Keyboard from './keyboards/Keyboard.svelte';
-  import { writable, type Writable } from 'svelte/store';
-  import { setContext } from 'svelte';
-    import type { SuggestionEvent } from './keyboards/suggestions';
-    import { text } from 'svelte/internal';
+  import type { SuggestionEvent } from './keyboards/suggestions';
 
   $: dark = $isDarkMode;
   $: document.body.className = dark ? 'bg-dark text-light' : 'bg-light text-dark';
@@ -185,6 +184,10 @@
     }
     navigator.clipboard.writeText(textarea.value);
   };
+
+  onMount(() => {
+    textarea.focus();
+  });
 </script>
 
 <div class="float-start">
@@ -202,7 +205,7 @@
   </div>
 </div>
 <div class="float-end">
-  <button class="btn btn-sm btn-outline-success" on:click={copyText}>
+  <button class="btn btn-sm btn-outline-success" tabindex="-1" on:click={copyText}>
     ᨣᩬ᩶ᨷᨸᩦ᩶
   </button>
 </div>