Added a data prop to be set when modal is open, in order to disable key bindings

src/components/Settings/SettingsContainer.vue

@@ -1,12 +1,16 @@
 <template>
   <section>
-    <SearchBar @user-is-searchin="userIsTypingSomething" ref="SearchBar" v-if="searchVisible" />
+    <SearchBar ref="SearchBar"
+      @user-is-searchin="userIsTypingSomething"
+      v-if="searchVisible"
+      :active="!modalOpen"
+    />
     <div class="options-container" v-if="settingsVisible">
       <ThemeSelector :themes="availableThemes"
         :confTheme="getInitialTheme()" :userThemes="getUserThemes()" />
       <LayoutSelector :displayLayout="displayLayout" @layoutUpdated="updateDisplayLayout"/>
       <ItemSizeSelector :iconSize="iconSize" @iconSizeUpdated="updateIconSize" />
-      <ConfigEditor :sections="sections" />
+      <ConfigLauncher :sections="sections" @modalChanged="modalChanged" />
     </div>
     <KeyboardShortcutInfo />
   </section>
@@ -15,7 +19,7 @@
 <script>
 import Defaults from '@/utils/defaults';
 import SearchBar from '@/components/Settings/SearchBar';
-import ConfigEditor from '@/components/Settings/ConfigEditor';
+import ConfigLauncher from '@/components/Settings/ConfigLauncher';
 import ThemeSelector from '@/components/Settings/ThemeSelector';
 import LayoutSelector from '@/components/Settings/LayoutSelector';
 import ItemSizeSelector from '@/components/Settings/ItemSizeSelector';
@@ -29,10 +33,11 @@ export default {
     availableThemes: Object,
     appConfig: Object,
     sections: Array,
+    modalOpen: Boolean,
   },
   components: {
     SearchBar,
-    ConfigEditor,
+    ConfigLauncher,
     ThemeSelector,
     LayoutSelector,
     ItemSizeSelector,
@@ -51,6 +56,9 @@ export default {
     updateIconSize(iconSize) {
       this.$emit('change-icon-size', iconSize);
     },
+    modalChanged(changedTo) {
+      this.$emit('change-modal-visibility', changedTo);
+    },
     getInitialTheme() {
       return this.appConfig.theme || '';
     },
@@ -63,7 +71,7 @@ export default {
   },
   data() {
     return {
-      searchVisible: Defaults.visibleComponents.searchBar,
+      searchVisible: Defaults.visibleComponents.searchBar && !this.modalOpen,
       settingsVisible: Defaults.visibleComponents.settings,
     };
   },