From eb6af4b4f0b561653fe57ec41c272cb1cb127ecc Mon Sep 17 00:00:00 2001
From: Nicolai Ort <info@nicolai-ort.com>
Date: Thu, 18 Mar 2021 14:59:11 +0100
Subject: [PATCH] Svelte select is now 100% keyboard useable (or at least in
 one modal it is....)

ref #92
---
 src/components/scans/AddScanModal.svelte | 11 ++++-------
 1 file changed, 4 insertions(+), 7 deletions(-)

diff --git a/src/components/scans/AddScanModal.svelte b/src/components/scans/AddScanModal.svelte
index d964b659..73dbe174 100644
--- a/src/components/scans/AddScanModal.svelte
+++ b/src/components/scans/AddScanModal.svelte
@@ -14,15 +14,14 @@
     option.firstname + " " + (option.middlename || "") + " " + option.lastname;
   const filterRunners = (label, filterText, option) =>
     label.toLowerCase().includes(filterText.toLowerCase()) ||
-    option.id.toString().startsWith(filterText.toLowerCase());
+    option.value.toString().startsWith(filterText.toLowerCase());
   function focus(el) {
     el.focus();
   }
   $: runner = 0;
-  $: runners = [];
-  $: is_fixed = false;
+  $: runners = ['One', 'Two', 'Three'];
   RunnerService.runnerControllerGetAll().then((val) => {
-    runners = val;
+    runners = val.map(r => {return {label: getRunnerLabel(r), value: r}});
   });
   $: distance_input = 0;
   $: processed_last_submit = true;
@@ -133,14 +132,12 @@
                     class="block text-sm font-medium text-gray-700">{$_('runner')}</label>
                   <Select
                     containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
-                    getSelectionLabel={(option) => getRunnerLabel(option)}
-                    getOptionLabel={(option) => getRunnerLabel(option)}
                     itemFilter={(label, filterText, option) => filterRunners(label, filterText, option)}
                     items={runners}
                     showChevron={true}
                     placeholder={$_('search-for-runner-by-name-or-id')}
                     noOptionsMessage={$_('no-runners-found')}
-                    on:select={(selectedValue) => (runner = selectedValue.detail.id)}
+                    on:select={(selectedValue) => (runner = selectedValue.detail.value.id)}
                     on:clear={() => (runner = null)} />
                 </div>
                 <div class="col-span-6">