fix: editor not getting focus when clicking inside the welcome screen…

… of table mode
josdejong · Mar 13, 2024 · 919a31e · 919a31e
1 parent 7123249
commit 919a31e
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 5 deletions.
diff --git a/src/lib/components/controls/SearchBox.svelte b/src/lib/components/controls/SearchBox.svelte
@@ -229,7 +229,6 @@
   // we pass searchText and json as argument to trigger search when these variables change,
   // via various listeners like applyChangedSearchText
   async function applySearch(showSearch: boolean, text: string, json: unknown) {
-    debug('applySearch', { showSearch, text })
     if (!showSearch) {
       if (searchResult) {
         searchResult = undefined
@@ -238,6 +237,8 @@
       return
     }
 
+    debug('applySearch', { showSearch, text })
+
     if (text === '') {
       debug('clearing search result')
 

diff --git a/src/lib/components/modes/tablemode/TableMode.svelte b/src/lib/components/modes/tablemode/TableMode.svelte
@@ -2026,7 +2026,19 @@
       />
       <JSONPreview {text} {json} {indentation} {parser} />
     {:else}
-      <TableModeWelcome {text} {json} {readOnly} {parser} {openJSONEditorModal} {onChangeMode} />
+      <TableModeWelcome
+        {text}
+        {json}
+        {readOnly}
+        {parser}
+        {openJSONEditorModal}
+        {onChangeMode}
+        onClick={() => {
+          // FIXME: this is a workaround for the editor not putting the focus on refHiddenInput
+          //  when clicking in the welcome screen so you cannot paste a document from clipboard.
+          focus()
+        }}
+      />
     {/if}
   {:else}
     <div class="jse-contents jse-contents-loading">

diff --git a/src/lib/components/modes/tablemode/TableModeWelcome.svelte b/src/lib/components/modes/tablemode/TableModeWelcome.svelte
@@ -16,6 +16,7 @@
   export let parser: JSONParser
   export let openJSONEditorModal: (path: JSONPath) => void
   export let onChangeMode: OnChangeMode
+  export let onClick: () => void
 
   $: action = readOnly ? 'View' : 'Edit'
 
@@ -43,7 +44,7 @@
   }
 </script>
 
-<div class="jse-table-mode-welcome">
+<div class="jse-table-mode-welcome" on:click={() => onClick()} role="none">
   <div class="jse-space jse-before" />
 
   <div class="jse-nested-arrays">

diff --git a/src/lib/components/modes/treemode/TreeMode.svelte b/src/lib/components/modes/treemode/TreeMode.svelte
@@ -2040,8 +2040,7 @@
           }}
           onClick={() => {
             // FIXME: this is a workaround for the editor not putting the focus on refHiddenInput
-            //  when clicking in the welcome screen (only occurs in 'tree' mode,
-            //  so you cannot paste a document from clipboard.
+            //  when clicking in the welcome screen so you cannot paste a document from clipboard.
             focus()
           }}
         />