@vcmap/ui 6.2.3 → 6.2.4

package/dist/assets/ui.js

@@ -1 +1 @@
-export * from "./ui-d3a7bd39.js";
+export * from "./ui-f33a5ee2.js";

package/dist/assets/vue.js

@@ -1 +1 @@
-export * from "./vue-cbd2bd60.js";
+export * from "./vue-004523e0.js";

package/dist/assets/{vuetify-8e1623b2.js → vuetify-2fc014c4.js}

@@ -10,7 +10,7 @@ function loadCss(href) {
     elem.onerror = reject;
     document.head.appendChild(elem);
   });
-} await loadCss('./assets/vuetify-8e1623b2.css');import { watch as Q, onScopeDispose as Ze, effectScope as Zl, shallowRef as K, Fragment as ie, reactive as it, computed as b, watchEffect as Fe, toRefs as Yt, capitalize as Nn, isVNode as Rc, Comment as Nc, unref as ot, warn as ja, getCurrentInstance as Hc, ref as j, provide as De, inject as ye, defineComponent as zc, camelize as Ir, h as Gt, toRaw as Be, createVNode as r, mergeProps as O, onBeforeUnmount as Qe, readonly as Ql, onDeactivated as _r, onActivated as Wc, onMounted as Ye, nextTick as we, TransitionGroup as Jl, Transition as jt, isRef as Tn, toRef as $, onBeforeMount as ra, withDirectives as $e, resolveDirective as gt, vShow as Ct, onUpdated as jc, Text as Uc, resolveDynamicComponent as Yc, markRaw as Gc, Teleport as Kc, cloneVNode as qc, createTextVNode as Tt, onUnmounted as Tr, onBeforeUpdate as Xc, withModifiers as Tl, toDisplayString as Zc, vModelText as Qc, resolveComponent as Jc, render as Ar } from "./vue-cbd2bd60.js";
+} await loadCss('./assets/vuetify-2fc014c4.css');import { watch as Q, onScopeDispose as Ze, effectScope as Zl, shallowRef as K, Fragment as ie, reactive as it, computed as b, watchEffect as Fe, toRefs as Yt, capitalize as Nn, isVNode as Rc, Comment as Nc, unref as ot, warn as ja, getCurrentInstance as Hc, ref as j, provide as De, inject as ye, defineComponent as zc, camelize as Ir, h as Gt, toRaw as Be, createVNode as r, mergeProps as O, onBeforeUnmount as Qe, readonly as Ql, onDeactivated as _r, onActivated as Wc, onMounted as Ye, nextTick as we, TransitionGroup as Jl, Transition as jt, isRef as Tn, toRef as $, onBeforeMount as ra, withDirectives as $e, resolveDirective as gt, vShow as Ct, onUpdated as jc, Text as Uc, resolveDynamicComponent as Yc, markRaw as Gc, Teleport as Kc, cloneVNode as qc, createTextVNode as Tt, onUnmounted as Tr, onBeforeUpdate as Xc, withModifiers as Tl, toDisplayString as Zc, vModelText as Qc, resolveComponent as Jc, render as Ar } from "./vue-004523e0.js";
 function rt(e, n) {
   let t;
   function a() {

package/dist/assets/vuetify.js

@@ -1 +1 @@
-export * from "./vuetify-8e1623b2.js";
+export * from "./vuetify-2fc014c4.js";

package/index.d.ts

@@ -279,13 +279,15 @@ export { default as VcsSplashScreen } from "./src/application/VcsSplashScreen.vu
 export type * from "./src/application/VcsSplashScreen.vue.d.ts";
 export { default as Search } from "./src/search/search.js";
 export type * from "./src/search/search.d.ts";
+export { searchComponentId } from "./src/search/SearchComponent.vue";
+export type * from "./src/search/SearchComponent.vue.d.ts";
 export { markText } from "./src/search/markText.js";
 export type * from "./src/search/markText.d.ts";
 export { default as ResultItemComponent } from "./src/search/ResultItem.vue";
 export type * from "./src/search/ResultItem.vue.d.ts";
 export { default as ResultsComponent } from "./src/search/ResultsComponent.vue";
 export type * from "./src/search/ResultsComponent.vue.d.ts";
-export { addLoadingOverlay, callSafeAction, createMapButtonAction, createToggleAction, createModalAction, createLinkAction, createGoToViewpointAction, createZoomToFeatureAction, searchComponentId } from "./src/actions/actionHelper.js";
+export { addLoadingOverlay, callSafeAction, createMapButtonAction, createToggleAction, createModalAction, createLinkAction, createGoToViewpointAction, createZoomToFeatureAction } from "./src/actions/actionHelper.js";
 export type * from "./src/actions/actionHelper.d.ts";
 export { createDeepPickingAction, deepPickingWindowId } from "./src/actions/deepPickingAction.js";
 export type * from "./src/actions/deepPickingAction.d.ts";

package/index.js

@@ -11,7 +11,6 @@ export {
   createLinkAction,
   createGoToViewpointAction,
   createZoomToFeatureAction,
-  searchComponentId,
 } from './src/actions/actionHelper.js';
 export {
   createDeepPickingAction,
@@ -377,6 +376,7 @@ export {
   getLegendEntries,
 } from './src/legend/legendHelper.js';
 export { default as Search } from './src/search/search.js';
+export { searchComponentId } from './src/search/SearchComponent.vue';
 export { markText } from './src/search/markText.js';
 export { default as ResultItemComponent } from './src/search/ResultItem.vue';
 export { default as ResultsComponent } from './src/search/ResultsComponent.vue';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vcmap/ui",
-  "version": "6.2.3",
+  "version": "6.2.4",
   "author": "Virtual City Systems",
   "license": "MIT",
   "scripts": {

package/plugins/@vcmap-show-case/extent-example/src/ExtentExample.vue

@@ -0,0 +1,28 @@
+<template>
+  <v-container class="pa-0">
+    <VcsExtentEditor heading="Default WGS84 projection" v-model="wgs84Extent" />
+    <VcsExtentEditor
+      heading="Mercator projection example"
+      v-model="mercatorExtent"
+    />
+  </v-container>
+</template>
+<script>
+  import { VcsExtentEditor } from '@vcmap/ui';
+  import { VContainer } from 'vuetify/components';
+  import { Extent, mercatorProjection, wgs84Projection } from '@vcmap/core';
+
+  export default {
+    name: 'ExtentExample',
+    components: { VcsExtentEditor, VContainer },
+    setup() {
+      const wgs84Extent = new Extent({ projection: wgs84Projection }).toJSON();
+      const mercatorExtent = new Extent({
+        projection: mercatorProjection,
+      }).toJSON();
+
+      return { wgs84Extent, mercatorExtent };
+    },
+  };
+</script>
+<style lang="scss" scoped></style>

package/plugins/@vcmap-show-case/extent-example/src/index.js

@@ -1,19 +1,11 @@
-import {
-  ButtonLocation,
-  createToggleAction,
-  WindowSlot,
-  VcsExtentEditor,
-} from '@vcmap/ui';
-import { Extent } from '@vcmap/core';
-import { reactive } from 'vue';
+import { ButtonLocation, createToggleAction, WindowSlot } from '@vcmap/ui';
 import packageJSON from '../package.json';
+import ExtentExample from './ExtentExample.vue';
 
 /**
  * @returns {VcsPlugin}
  */
 export default async function extentExample() {
-  const modelValue = reactive(new Extent().toJSON());
-
   return {
     get name() {
       return packageJSON.name;
@@ -33,15 +25,12 @@ export default async function extentExample() {
         },
         {
           id: 'extent-example',
-          component: VcsExtentEditor,
+          component: ExtentExample,
           slot: WindowSlot.DYNAMIC_LEFT,
           state: {
             headerTitle: 'Extent Example',
             headerIcon: '$vcsBoundingBox',
           },
-          props: {
-            modelValue,
-          },
         },
         app.windowManager,
         packageJSON.name,

package/src/actions/actionHelper.d.ts

@@ -118,7 +118,6 @@ export function addLoadingOverlay(app: import("../vcsUiApp.js").default, owner:
     maxWidth?: string | number | undefined;
     persistent?: boolean | undefined;
 } | undefined): () => void;
-export const searchComponentId: "searchId";
 export type ActionOptions = Omit<VcsAction, 'callback'>;
 export type ActionCallback = (p?: PointerEvent) => (void | Promise<void>);
 export type VcsAction = {

package/src/actions/actionHelper.js

@@ -18,7 +18,9 @@ import {
   getFittedWindowPositionOptions,
   getTargetSize,
 } from '../manager/window/windowHelper.js';
-import SearchComponent from '../search/SearchComponent.vue';
+import SearchComponent, {
+  searchComponentId,
+} from '../search/SearchComponent.vue';
 import VcsLoadingOverlay from '../components/plugins/VcsLoadingOverlay.vue';
 
 /**
@@ -215,8 +217,6 @@ export function createToggleAction(
   return { action, destroy };
 }
 
-export const searchComponentId = 'searchId';
-
 /**
  * @param {import("../vcsUiApp.js").default} app
  * @returns {{action: import("vue").UnwrapRef<VcsAction>, destroy: function():void}}

package/src/components/extent/VcsExtent.vue

@@ -18,6 +18,7 @@
       hide-z
       v-model="min"
       :disabled="disabled"
+      :extent="extent"
       :axis-rules="[
         [(v) => checkInput(v, max[0])],
         [(v) => checkInput(v, max[1])],
@@ -35,6 +36,7 @@
       hide-z
       v-model="max"
       :disabled="disabled"
+      :extent="extent"
       :axis-rules="[
         [(v) => checkInput(min[0], v)],
         [(v) => checkInput(min[1], v)],
@@ -54,7 +56,7 @@
 <script>
   import { computed, toRaw } from 'vue';
   import { VCol, VContainer, VRow } from 'vuetify/components';
-  import { Extent } from '@vcmap/core';
+  import { Extent, Projection } from '@vcmap/core';
   import VcsLabel from '../form-inputs-controls/VcsLabel.vue';
   import VcsTextField from '../form-inputs-controls/VcsTextField.vue';
   import VcsCoordinate from '../form-inputs-controls/VcsCoordinate.vue';
@@ -100,6 +102,14 @@
     setup(props, { emit }) {
       const localValue = useProxiedComplexModel(props, 'modelValue', emit);
 
+      const { proj } = new Projection(localValue.value.projection);
+      const extent = proj.getExtent() || [
+        -Infinity,
+        -Infinity,
+        Infinity,
+        Infinity,
+      ];
+
       const getCoordinate = (start, end = 4) =>
         computed({
           get() {
@@ -121,6 +131,7 @@
         min: getCoordinate(0, 2),
         max: getCoordinate(2),
         checkInput,
+        extent,
         cid,
       };
     },

package/src/components/extent/VcsExtent.vue.d.ts

@@ -15,6 +15,7 @@ declare const _default: import("vue").DefineComponent<{
     min: import("vue").WritableComputedRef<any>;
     max: import("vue").WritableComputedRef<any>;
     checkInput: typeof checkInput;
+    extent: import("ol/extent.js", { with: { "resolution-mode": "import" } }).Extent;
     cid: string;
 }, any, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     modelValue: {

package/src/contentTree/contentTreeItem.js

@@ -436,7 +436,7 @@ class ContentTreeItem {
   removeAction(actionName) {
     const index = this._getActionIndex(actionName);
     if (index > -1) {
-      this._actions.value.splice(index, 1);
+      this._actions.value = this._actions.value.filter((_, i) => i !== index);
     }
   }
 

package/src/contentTree/wmsGroupContentTreeItem.d.ts

@@ -16,9 +16,31 @@ export type WMSEntry = {
     name: string;
     active: import("vue").Ref<boolean>;
     activeStyle: import("vue").Ref<string>;
-    title: string;
-    extent: import("@vcmap/core").Extent;
-    styles: Array<WMSStyleEntry>;
+    title?: string | undefined;
+    extent?: import("@vcmap/core").Extent | undefined;
+    styles?: WMSStyleEntry[] | undefined;
+};
+export type SerializedWMSLegend = {
+    url: string;
+    width: number;
+    height: number;
+};
+export type SerializedWMSStyle = {
+    name: string;
+    title?: string | undefined;
+    legend?: SerializedWMSLegend[] | undefined;
+};
+export type SerializedWMSLayer = {
+    name: string;
+    title?: string | undefined;
+    /**
+     * Layer extent, in WGS84 coordinates
+     */
+    extent?: number[] | undefined;
+    styles?: SerializedWMSStyle[] | undefined;
+};
+export type SerializedWMSCapabilities = {
+    layers: Array<SerializedWMSLayer>;
 };
 /**
  * @typedef {import('./contentTreeItem.js').ContentTreeItemOptions &
@@ -41,9 +63,33 @@ export type WMSEntry = {
  * @property {string} name
  * @property {import("vue").Ref<boolean>} active
  * @property {import("vue").Ref<string>} activeStyle
- * @property {string} title
- * @property {import("@vcmap/core").Extent} extent
- * @property {Array<WMSStyleEntry>} styles
+ * @property {string} [title]
+ * @property {import("@vcmap/core").Extent} [extent]
+ * @property {Array<WMSStyleEntry>} [styles]
+ */
+/**
+ * @typedef {Object} SerializedWMSLegend
+ * @property {string} url
+ * @property {number} width
+ * @property {number} height
+ */
+/**
+ * @typedef {Object} SerializedWMSStyle
+ * @property {string} name
+ * @property {string} [title]
+ * @property {SerializedWMSLegend[]} [legend]
+ */
+/**
+ * @typedef {Object} SerializedWMSLayer
+ * @property {string} name
+ * @property {string} [title]
+ * @property {number[]} [extent] Layer extent, in WGS84 coordinates
+ * @property {SerializedWMSStyle[]} [styles]
+ */
+/**
+ * @description The serialized form of WMS Capabilities are used in the configuration to avoid fetching the capabilities on every startup.
+ * @typedef {Object} SerializedWMSCapabilities
+ * @property {Array<SerializedWMSLayer>} layers
  */
 /**
  * A WMSGroupItem, will take over a WMSLayer and request the Capabilities of the layer to show all available

package/src/contentTree/wmsGroupContentTreeItem.js

@@ -2,6 +2,7 @@ import { markVolatile } from '@vcmap/core';
 import { getLogger } from '@vcsuite/logger';
 import { ref } from 'vue';
 import { parseBoolean } from '@vcsuite/parsers';
+import { is } from '@vcsuite/check';
 import deepEqual from 'fast-deep-equal';
 import WMSCapabilities from 'ol/format/WMSCapabilities';
 import { StateActionState } from '../actions/stateRefAction.js';
@@ -10,6 +11,90 @@ import WmsChildContentTreeItem from './wmsChildContentTreeItem.js';
 import VcsObjectContentTreeItem from './vcsObjectContentTreeItem.js';
 import { legendSymbol } from '../legend/legendHelper.js';
 
+/**
+ *
+ * @param {string} src The OnlineRessource property of the legend
+ * @param {number} width The width of the image
+ * @param {string} title The title of the layer.
+ * @returns {import('../legend/legendHelper.js').StyleLegendItem}
+ */
+function parseLegend(src, width, title) {
+  if (width < 25) {
+    return {
+      type: 'StyleLegendItem',
+      colNr: 1,
+      rows: [{ type: 'IconLegendRow', title, image: { src } }],
+    };
+  }
+  return { type: 'ImageLegendItem', popoutBtn: true, src };
+}
+
+/**
+ *
+ * @param {SerializedWMSCapabilities} capabilities
+ * @returns {WMSEntry[]}
+ */
+function parseSerializedCapabilities(capabilities) {
+  if (capabilities?.layers?.length > 0) {
+    return capabilities.layers
+      .filter((layer) => {
+        if (!is(layer, { name: String })) {
+          getLogger(this.className).warn(
+            `Ignoring WMS Layer without name in layer ${this._layerName}`,
+          );
+          return false;
+        }
+        return true;
+      })
+      .map((layer) => {
+        const styles = layer.styles
+          ?.filter((s) => {
+            if (!is(s, { name: String })) {
+              getLogger(this.className).warn(
+                `Ignoring WMS Style without name in layer ${this._layerName}`,
+              );
+              return false;
+            }
+            return true;
+          })
+          .map((s) => ({
+            name: s.name,
+            title: s.title,
+            legend:
+              s.legend
+                ?.filter((l) => {
+                  if (!is(l, { url: String, width: Number, height: Number })) {
+                    getLogger(this.className).warn(
+                      `Ignoring invalid WMS Legend in style ${s.name} in layer ${this._layerName}`,
+                    );
+                    return false;
+                  }
+                  return true;
+                })
+                .map((l) => parseLegend(l.url, l.width, s.title || '')) || [],
+          }));
+
+        const wmsEntry = {
+          name: layer.name,
+          active: ref(false),
+          activeStyle: ref(''),
+        };
+        if (layer.title) {
+          wmsEntry.title = layer.title;
+        }
+        if (layer.extent) {
+          wmsEntry.extent = layer.extent;
+        }
+        if (styles?.length > 0) {
+          wmsEntry.styles = styles;
+        }
+        return wmsEntry;
+      });
+  } else {
+    return [];
+  }
+}
+
 /**
  * @param {string} rawUrl
  * @param {Record<string, string>} parameters
@@ -49,27 +134,9 @@ async function getWMSEntries(rawUrl, parameters) {
             title: style.Title,
             legend: style.LegendURL?.filter(
               (legend) => legend.OnlineResource,
-            ).map((legend) => {
-              const src = legend.OnlineResource;
-              if (legend.size[0] < 25) {
-                return {
-                  type: 'StyleLegendItem',
-                  colNr: 1,
-                  rows: [
-                    {
-                      type: 'IconLegendRow',
-                      title: layer.Title,
-                      image: { src },
-                    },
-                  ],
-                };
-              }
-              return {
-                type: 'ImageLegendItem',
-                src,
-                popoutBtn: true,
-              };
-            }),
+            ).map((legend) =>
+              parseLegend(legend.OnlineResource, legend.size[0], layer.Title),
+            ),
           };
         }) ?? [];
       return {
@@ -133,9 +200,34 @@ function createWMSChildContentTreeItem(
  * @property {string} name
  * @property {import("vue").Ref<boolean>} active
  * @property {import("vue").Ref<string>} activeStyle
- * @property {string} title
- * @property {import("@vcmap/core").Extent} extent
- * @property {Array<WMSStyleEntry>} styles
+ * @property {string} [title]
+ * @property {import("@vcmap/core").Extent} [extent]
+ * @property {Array<WMSStyleEntry>} [styles]
+ */
+
+/**
+ * @typedef {Object} SerializedWMSLegend
+ * @property {string} url
+ * @property {number} width
+ * @property {number} height
+ */
+/**
+ * @typedef {Object} SerializedWMSStyle
+ * @property {string} name
+ * @property {string} [title]
+ * @property {SerializedWMSLegend[]} [legend]
+ */
+/**
+ * @typedef {Object} SerializedWMSLayer
+ * @property {string} name
+ * @property {string} [title]
+ * @property {number[]} [extent] Layer extent, in WGS84 coordinates
+ * @property {SerializedWMSStyle[]} [styles]
+ */
+/**
+ * @description The serialized form of WMS Capabilities are used in the configuration to avoid fetching the capabilities on every startup.
+ * @typedef {Object} SerializedWMSCapabilities
+ * @property {Array<SerializedWMSLayer>} layers
  */
 
 /**
@@ -496,10 +588,17 @@ class WMSGroupContentTreeItem extends VcsObjectContentTreeItem {
     this.clickable = !this._setWMSLayersExclusive;
 
     try {
-      const availableWMSEntries = await getWMSEntries(
-        this._layer.url,
-        this._layer.parameters,
-      );
+      let availableWMSEntries = [];
+      if (this._layer.properties.capabilities) {
+        availableWMSEntries = parseSerializedCapabilities(
+          this._layer.properties.capabilities,
+        );
+      } else {
+        availableWMSEntries = await getWMSEntries(
+          this._layer.url,
+          this._layer.parameters,
+        );
+      }
       // check if the layer still exists, it can happen that the layer was removed while fetching the capabilities.
       if (!this._layer) {
         return;
@@ -612,6 +711,7 @@ class WMSGroupContentTreeItem extends VcsObjectContentTreeItem {
           }
         }),
       );
+
       if (this._loadOnStartup) {
         await this._loadWMSChildren();
       }

package/src/i18n/de.d.ts

@@ -527,6 +527,7 @@ declare namespace messages {
         export let select: string;
         let placeholder_1: string;
         export { placeholder_1 as placeholder };
+        export let hideWindow: string;
         export let zoomToFeatureAction: string;
         export let zoomToAll: string;
         export let zoomToAllMobile: string;

package/src/i18n/de.js

@@ -372,6 +372,7 @@ const messages = {
     tooltip: 'Suche',
     select: 'Suchergebnis auswählen',
     placeholder: 'Suche nach Adresse oder Ort/Sehenswürdigkeit',
+    hideWindow: 'Suche ausblenden',
     zoomToFeatureAction: 'Auf Ergebnis zoomen',
     zoomToAll: 'Auf alle Ergebnisse zoomen',
     zoomToAllMobile: 'Auf alle zoomen',

package/src/i18n/en.d.ts

@@ -527,6 +527,7 @@ declare namespace messages {
         export let select: string;
         let placeholder_1: string;
         export { placeholder_1 as placeholder };
+        export let hideWindow: string;
         export let zoomToFeatureAction: string;
         export let zoomToAllMobile: string;
         export let zoomToAll: string;

package/src/i18n/en.js

@@ -372,6 +372,7 @@ const messages = {
     tooltip: 'Search',
     select: 'Select result item',
     placeholder: 'Search for address or landmark/point of interest',
+    hideWindow: 'Hide search',
     zoomToFeatureAction: 'Zoom to result',
     zoomToAllMobile: 'Zoom to all',
     zoomToAll: 'Zoom to all',

package/src/manager/collectionManager/CollectionManager.vue

@@ -28,7 +28,7 @@
 </template>
 
 <script>
-  import { computed, inject, ref } from 'vue';
+  import { computed, inject, onUnmounted, ref } from 'vue';
   import { VExpansionPanels, VContainer } from 'vuetify/components';
   import CollectionComponentProvider from './CollectionComponentProvider.vue';
   import CollectionComponentList from './CollectionComponentList.vue';
@@ -57,6 +57,19 @@
        * @type {import("vue").Ref<string|null>}
        */
       const componentView = ref(null);
+
+      const removedListener = collectionManager.removed.addEventListener(
+        (collectionComponent) => {
+          if (componentView.value === collectionComponent.id) {
+            componentView.value = null;
+          }
+        },
+      );
+
+      onUnmounted(() => {
+        removedListener();
+      });
+
       /**
        * @type {import("vue").WritableComputedRef<number[]>}
        */

package/src/search/SearchComponent.vue

@@ -21,11 +21,7 @@
     </span>
     <template v-if="results.length > 0">
       <v-divider class="mt-1 base-darken-1" />
-      <ResultsComponent
-        :query="query"
-        :results="results"
-        :show-selected-only="showSelectedOnly"
-      />
+      <ResultsComponent :query="query" :results="results" />
       <v-divider />
 
       <v-row no-gutters>
@@ -33,9 +29,10 @@
           <div class="button-container d-flex align-center px-2 pt-2 pb-1">
             <VcsFormButton
               class="fixed-button"
-              @click="showSelectedOnly = !showSelectedOnly"
+              tooltip="search.hideWindow"
+              @click="closeWindow"
             >
-              <v-icon icon="mdi-arrow-collapse-vertical" />
+              <v-icon icon="mdi-minus-box-multiple-outline" />
             </VcsFormButton>
             <VcsFormButton
               @click="zoomToAll"
@@ -71,6 +68,8 @@
   import VcsFormButton from '../components/buttons/VcsFormButton.vue';
   import { useFontSize } from '../vuePlugins/vuetify.js';
 
+  export const searchComponentId = 'searchId';
+
   /**
    * @description Stylized search component providing an input field for search inputs.
    * Renders a list of results using {@link ResultsComponent }
@@ -98,8 +97,6 @@
       const { xs } = useDisplay();
       let queryPreSuggestion = '';
 
-      const showSelectedOnly = ref(false);
-
       let suggestionTimeout;
 
       const onInput = () => {
@@ -140,7 +137,6 @@
         suggesting.value = '';
         suggestions.value = [];
         queryPreSuggestion = '';
-        showSelectedOnly.value = false;
       };
 
       const search = async () => {
@@ -163,7 +159,6 @@
         return fontSize.value + 11;
       });
       return {
-        showSelectedOnly,
         xs,
         query,
         searching,
@@ -193,6 +188,9 @@
             query.value = queryPreSuggestion;
           }
         },
+        closeWindow() {
+          app.windowManager.remove(searchComponentId);
+        },
       };
     },
   };

package/src/search/SearchComponent.vue.d.ts

@@ -1,5 +1,5 @@
+export const searchComponentId: "searchId";
 declare const _default: import("vue").DefineComponent<{}, {
-    showSelectedOnly: import("vue").Ref<boolean>;
     xs: import("vue").Ref<boolean>;
     query: import("vue").Ref<string>;
     searching: import("vue").Ref<boolean>;
@@ -15,5 +15,6 @@ declare const _default: import("vue").DefineComponent<{}, {
     selectedSuggestion: import("vue").Ref<number>;
     onInput: () => void;
     selectSuggestion(value: any): void;
+    closeWindow(): void;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
 export default _default;