diff options
Diffstat (limited to 'source/library')
| -rw-r--r-- | source/library/components/Editor.svelte | 3 | ||||
| -rw-r--r-- | source/library/components/TabBar.svelte | 15 |
2 files changed, 13 insertions, 5 deletions
diff --git a/source/library/components/Editor.svelte b/source/library/components/Editor.svelte index f2bf82d..393812a 100644 --- a/source/library/components/Editor.svelte +++ b/source/library/components/Editor.svelte @@ -1,7 +1,6 @@ <script lang="ts"> /*** IMPORT ------------------------------------------- ***/ - import { browser } from "$app/environment"; import { onMount } from "svelte"; import type { Extension } from "@codemirror/state"; import type { EditorView } from "@codemirror/view"; @@ -33,7 +32,7 @@ let view = $state<EditorView | null>(null); onMount(() => { - if (!browser) + if (typeof globalThis.document === "undefined") return; let disposed = false; diff --git a/source/library/components/TabBar.svelte b/source/library/components/TabBar.svelte index 9c34f20..0bfec02 100644 --- a/source/library/components/TabBar.svelte +++ b/source/library/components/TabBar.svelte @@ -130,13 +130,22 @@ } </style> -<div class="tabbar"> +<div class="tabbar" role="tablist"> {#each tabs as tab (tab.id)} - <button + <div + aria-selected={tab.id === activeId} class="tab" class:active={tab.id === activeId} ondblclick={() => startEditing(tab)} onclick={() => onSelect(tab.id)} + onkeydown={(e) => { + if (e.key === "Enter" || e.key === " ") { + e.preventDefault(); + onSelect(tab.id); + } + }} + role="tab" + tabindex="0" > {#if editingId === tab.id} <input @@ -157,7 +166,7 @@ class="close" onclick={(e) => handleClose(e, tab.id)} >×</button> - </button> + </div> {/each} <button aria-label="New tab" class="add" onclick={onAdd}>+</button> </div> |