From 1834bf5f6cdb4833d8a332abeda721deabfd5bf6 Mon Sep 17 00:00:00 2001
From: Danielo Rodriguez <rdanielo@gmail.com>
Date: Tue, 2 Jan 2024 09:03:02 +0100
Subject: [PATCH] feat: tags input allow any value to be selected, even if it
 does not exist yet

---
 src/FormModal.ts                        |  1 +
 src/suggesters/MultiSuggest.ts          | 19 +++++++++++++++----
 src/views/components/MultiSelect.svelte |  2 ++
 3 files changed, 18 insertions(+), 4 deletions(-)

diff --git a/src/FormModal.ts b/src/FormModal.ts
index 44df7f79..768a6ba2 100644
--- a/src/FormModal.ts
+++ b/src/FormModal.ts
@@ -195,6 +195,7 @@ export class FormModal extends Modal {
                                 setting: fieldBase,
                                 errors: fieldStore.errors,
                                 app: this.app,
+                                allowUnknownValues: true,
                             },
                         }),
                     );
diff --git a/src/suggesters/MultiSuggest.ts b/src/suggesters/MultiSuggest.ts
index 43e51bc0..7eb6c9a2 100644
--- a/src/suggesters/MultiSuggest.ts
+++ b/src/suggesters/MultiSuggest.ts
@@ -1,17 +1,27 @@
-import { AbstractInputSuggest, App } from 'obsidian'
+import { AbstractInputSuggest, App } from "obsidian";
 
 export class MultiSuggest extends AbstractInputSuggest<string> {
     content: Set<string>;
 
-    constructor(private inputEl: HTMLInputElement, content: Set<string>, private onSelectCb: (value: string) => void, app: App) {
+    constructor(
+        private inputEl: HTMLInputElement,
+        content: Set<string>,
+        private onSelectCb: (value: string) => void,
+        app: App,
+        private allowUnknownValues = false,
+    ) {
         super(app, inputEl);
         this.content = content;
     }
 
     getSuggestions(inputStr: string): string[] {
         const lowerCaseInputStr = inputStr.toLocaleLowerCase();
-        return [...this.content].filter((content) =>
-            content.toLocaleLowerCase().contains(lowerCaseInputStr)
+        const candidates =
+            this.allowUnknownValues && inputStr !== ""
+                ? [...this.content, inputStr]
+                : Array.from(this.content);
+        return candidates.filter((content) =>
+            content.toLocaleLowerCase().contains(lowerCaseInputStr),
         );
     }
 
@@ -20,6 +30,7 @@ export class MultiSuggest extends AbstractInputSuggest<string> {
     }
 
     selectSuggestion(content: string, evt: MouseEvent | KeyboardEvent): void {
+        console.log("selectSuggestion", content);
         this.onSelectCb(content);
         this.inputEl.value = "";
         this.close();
diff --git a/src/views/components/MultiSelect.svelte b/src/views/components/MultiSelect.svelte
index 3e0c534b..e407caa7 100644
--- a/src/views/components/MultiSelect.svelte
+++ b/src/views/components/MultiSelect.svelte
@@ -7,6 +7,7 @@
     export let availableOptions: string[] = [];
     export let errors: Readable<string[]>;
     export let values: Writable<string[]>;
+    export let allowUnknownValues: boolean = false;
     // We take the setting to make it consistent with the other input components
     export let setting: Setting;
     export let app: App;
@@ -27,6 +28,7 @@
                 values.update((x) => [...x, selected]);
             },
             app,
+            allowUnknownValues,
         );
     }
     function removeValue(value: string) {