src/features/DisplayFont/index.ts

@@ -1 +1,2 @@
+export { displayedFontsStore } from './model';
 export { FontDisplay } from './ui';

src/features/DisplayFont/model/store/displayedFontsStore.svelte.ts

@@ -28,6 +28,8 @@ export class DisplayedFontsStore {
 
     #selectedPair = $state<Partial<[UnifiedFont, UnifiedFont]>>([]);
 
+    #hasAnySelectedFonts = $derived(this.#displayedFonts.length > 0);
+
     get fonts() {
         return this.#displayedFonts;
     }
@@ -41,7 +43,9 @@ export class DisplayedFontsStore {
     }
 
     set selectedPair(pair: Partial<[UnifiedFont, UnifiedFont]>) {
-        this.#selectedPair = pair;
+        const [first, second] = this.#selectedPair;
+        const [newFist, newSecond] = pair;
+        this.#selectedPair = [newFist ?? first, newSecond ?? second];
     }
 
     get text() {
@@ -52,6 +56,10 @@ export class DisplayedFontsStore {
         this.#sampleText = text;
     }
 
+    get hasAnyFonts() {
+        return this.#hasAnySelectedFonts;
+    }
+
     isSelectedPairEmpty(): boolean {
         const [font1, font2] = this.#selectedPair;
         return !font1 || !font2;