@vcmap/ui 6.0.0-rc.1 → 6.0.0-rc.10

package/src/vcsUiApp.d.ts

@@ -1,48 +1,33 @@
 export default VcsUiApp;
 export type VcsUiModuleConfig = import("@vcmap/core").VcsModuleConfig & {
-    plugins?: Object[];
+    plugins?: Record<string, unknown>[];
     contentTree?: import("./contentTree/contentTreeItem.js").ContentTreeItemOptions[];
     uiConfig?: import("./uiConfig.js").UiConfigurationItem<unknown>[];
     featureInfo?: import("./featureInfo/abstractFeatureInfoView.js").FeatureInfoViewOptions[];
-    i18n?: Object[];
+    i18n?: import("./i18n/i18nCollection.js").I18nConfigurationItem[];
 };
 export type PluginConfig = {
     name: string;
-    /**
-     * - path to the plugin's index.js
-     */
-    entry: string | undefined;
-    /**
-     * - version or version range
-     */
-    version: string | undefined;
+    entry?: string;
+    version?: string;
 };
-export type PluginConfigEditor = {
-    /**
-     * - A editor component to configure a plugin or item
-     */
-    component: import("vue").Component & {
-        title: string | undefined;
-    };
-    /**
-     * - The collection the item belongs to. Default is plugins collection.
-     */
-    collectionName?: string | undefined;
-    /**
-     * - The item the editor can be used for. Can be a name or className. Default is the plugin's name.
-     */
-    itemName?: string | undefined;
-    /**
-     * - An optional function returning an url referencing help or further information regarding the config editor.
-     */
-    infoUrlCallback?: (() => string) | undefined;
+export type PluginConfigEditorComponent<C extends Object> = import("vue").Component<{
+    getConfig(): C;
+    setConfig(config?: C): void;
+}>;
+export type PluginConfigEditor<C extends Object> = {
+    component: PluginConfigEditorComponent<C>;
+    title?: string;
+    collectionName?: string;
+    itemName?: string;
+    infoUrlCallback?: () => string;
 };
-export type createPlugin<P extends Object, S extends Object> = (arg0: P, arg1: string) => VcsPlugin<P, S>;
+export type createPlugin<C extends Object, S extends Object> = (arg0: C, arg1: string) => VcsPlugin<C, S>;
 /**
  * Interface for VcsPlugins.
  * The function implementing the interface should not throw!
  */
-export type VcsPlugin<P extends Object, S extends Object> = {
+export type VcsPlugin<C extends Object, S extends Object> = {
     name: string;
     version: string;
     mapVersion: string;
@@ -51,10 +36,10 @@ export type VcsPlugin<P extends Object, S extends Object> = {
     };
     initialize?: (arg0: import("@src/vcsUiApp.js").default, arg1: S | undefined) => void | Promise<void>;
     onVcsAppMounted?: (arg0: import("@src/vcsUiApp.js").default) => void;
-    toJSON?: () => P;
-    getDefaultOptions?: () => P;
+    toJSON?: () => C;
+    getDefaultOptions?: () => C;
     getState?: (arg0: boolean | undefined) => S | Promise<S>;
-    getConfigEditors?: () => Array<PluginConfigEditor>;
+    getConfigEditors?: () => Array<PluginConfigEditor<object>>;
     destroy?: () => void;
 };
 export type VcsComponentManager<T extends Object, O extends Object> = {
@@ -85,20 +70,21 @@ declare class VcsUiApp extends VcsApp {
      */
     themeChanged: VcsEvent<void>;
     /**
-     * @type {import("@vcmap/core").OverrideCollection<VcsPlugin>}
+     * @type {import("@vcmap/core").OverrideCollection<VcsPlugin<Object, Object>, Collection<VcsPlugin<Object, Object>>, Object>}
      * @private
      */
     private _plugins;
     /**
-     * @type {Array<function():void>}
+     * I18n Collection adds plugin listener first, so the plugin i18n data is available on plugin initialize
+     * @type {I18nCollection<Object>}
      * @private
      */
-    private _pluginListeners;
+    private _i18n;
     /**
-     * @type {I18nCollection<Object>}
+     * @type {Array<function():void>}
      * @private
      */
-    private _i18n;
+    private _pluginListeners;
     /**
      *
      * @type {import("vue-i18n").I18n}
@@ -128,10 +114,15 @@ declare class VcsUiApp extends VcsApp {
      */
     private _callbackClassRegistry;
     /**
-     * @type {import("@vcmap/core").OverrideClassRegistry<import("@vcmap/core").Ctor<ContentTreeItem>>}
+     * @type {import("@vcmap/core").OverrideClassRegistry<typeof ContentTreeItem>}
      * @private
      */
     private _contentTreeClassRegistry;
+    /**
+     * @type {import("@vcmap/core").OverrideCollection<import("./uiConfig.js").UiConfigurationItem<unknown>, UiConfig>}
+     * @private
+     */
+    private _uiConfig;
     /**
      * @type {import("@vcmap/core").OverrideCollection<import("./contentTree/contentTreeItem.js").ContentTreeItem, import("./contentTree/contentTreeCollection.js").ContentTreeCollection>}
      * @private
@@ -158,10 +149,10 @@ declare class VcsUiApp extends VcsApp {
      */
     private _navbarManager;
     /**
-     * @type {import("@vcmap/core").OverrideCollection<import("./uiConfig.js").UiConfigurationItem<unknown>, UiConfig>}
+     * @type {Search}
      * @private
      */
-    private _uiConfig;
+    private _search;
     /**
      * @type {import("@vcmap/core").OverrideClassRegistry<AbstractFeatureInfoView>}
      * @private
@@ -187,11 +178,6 @@ declare class VcsUiApp extends VcsApp {
      * @private
      */
     private _contextMenuManager;
-    /**
-     * @type {Search}
-     * @private
-     */
-    private _search;
     /**
      * @type {Notifier}
      * @private
@@ -209,26 +195,27 @@ declare class VcsUiApp extends VcsApp {
      */
     mounted: import("@vcmap/core").VcsEvent<string>;
     _destroySiteConfig: () => void;
+    _destroyObliqueFallback: () => void;
     /**
-     * @type {import("@vcmap/core").OverrideCollection<VcsPlugin<Object, Object>>}
+     * @type {import("@vcmap/core").OverrideCollection<VcsPlugin<Object, Object>, Collection<VcsPlugin<Object, Object>>, Object>}
      */
-    get plugins(): import("@vcmap/core").OverrideCollection<VcsPlugin<Object, Object>, Collection<VcsPlugin<Object, Object>>>;
+    get plugins(): import("@vcmap/core").OverrideCollection<VcsPlugin<Object, Object>, Collection<VcsPlugin<Object, Object>>, Object>;
     /**
      * @type {import("@vcmap/core").OverrideCollection<ContentTreeItem, ContentTreeCollection>}
      */
-    get contentTree(): import("@vcmap/core").OverrideCollection<ContentTreeItem, ContentTreeCollection>;
+    get contentTree(): import("@vcmap/core").OverrideCollection<ContentTreeItem, ContentTreeCollection, import("./contentTree/contentTreeItem.js").ContentTreeItemOptions>;
     /**
-     * @type {import("@vcmap/core").OverrideClassRegistry<import("@vcmap/core").Ctor<typeof import("./callback/vcsCallback.js").default>>}
+     * @type {import("@vcmap/core").OverrideClassRegistry<typeof import("./callback/vcsCallback.js").default>}
      */
-    get callbackClassRegistry(): OverrideClassRegistry<import("@vcmap/core").Ctor<typeof import("./callback/vcsCallback.js").default>>;
+    get callbackClassRegistry(): OverrideClassRegistry<typeof import("./callback/vcsCallback.js").default>;
     /**
-     * @type {import("@vcmap/core").OverrideClassRegistry<import("@vcmap/core").Ctor<typeof ContentTreeItem>>}
+     * @type {import("@vcmap/core").OverrideClassRegistry<typeof ContentTreeItem>}
      */
-    get contentTreeClassRegistry(): OverrideClassRegistry<import("@vcmap/core").Ctor<typeof ContentTreeItem>>;
+    get contentTreeClassRegistry(): OverrideClassRegistry<typeof ContentTreeItem>;
     /**
-     * @type {import("@vcmap/core").OverrideClassRegistry<import("@vcmap/core").Ctor<typeof AbstractFeatureInfoView>>}
+     * @type {import("@vcmap/core").OverrideClassRegistry<typeof AbstractFeatureInfoView>}
      */
-    get featureInfoClassRegistry(): OverrideClassRegistry<import("@vcmap/core").Ctor<typeof AbstractFeatureInfoView>>;
+    get featureInfoClassRegistry(): OverrideClassRegistry<typeof AbstractFeatureInfoView>;
     /**
      * @returns {ToolboxManager}
      */
@@ -267,14 +254,15 @@ declare class VcsUiApp extends VcsApp {
     get vuetify(): {
         install: (app: import("vue").App<any>) => void;
         defaults: import("vue").Ref<import("vuetify").DefaultsInstance>;
-        display: import("vuetify").DisplayInstance; /**
-         * @type {import("@vcmap/core").OverrideCollection<AbstractFeatureInfoView>}
-         * @private
-         */
+        display: import("vuetify").DisplayInstance;
         theme: import("vuetify").ThemeInstance & {
             install: (app: import("vue").App<any>) => void;
         };
-        icons: Record<string, any>;
+        icons: {
+            defaultSet: string;
+            aliases: Partial<import("vuetify").IconAliases>;
+            sets: Record<string, import("vuetify").IconSet>;
+        };
         locale: {
             isRtl: import("vue").Ref<boolean>;
             rtl: import("vue").Ref<Record<string, boolean>>;
@@ -294,7 +282,33 @@ declare class VcsUiApp extends VcsApp {
                     formats?: any;
                 }) => import("vuetify").DateInstance) | import("vuetify").DateInstance;
                 formats?: Record<string, any> | undefined;
-                locale: Record<string, any>;
+                locale: Record<string, any>; /**
+                 * Interface for VcsPlugins.
+                 * The function implementing the interface should not throw!
+                 * @typedef {{
+                 *   name: string,
+                 *   version: string,
+                 *   mapVersion: string,
+                 *   i18n?: Object<string, unknown>,
+                 *   initialize?: function(import("@src/vcsUiApp.js").default, S=):void|Promise<void>,
+                 *   onVcsAppMounted?: function(import("@src/vcsUiApp.js").default):void,
+                 *   toJSON?: function(): C,
+                 *   getDefaultOptions?: function(): C,
+                 *   getState?: function(boolean=):S|Promise<S>,
+                 *   getConfigEditors?: function():Array<PluginConfigEditor<object>>,
+                 *   destroy?: function(): void
+                 * }} VcsPlugin
+                 * @template {Object} C - plugin config
+                 * @template {Object} S - plugin state
+                 * @property {Object<string, *>} [i18n] - the i18n messages of this plugin
+                 * @property {function(import("@src/vcsUiApp.js").default, S=)} initialize - called on plugin added. Is passed the VcsUiApp and optionally, the state for the plugin
+                 * @property {function(import("@src/vcsUiApp.js").default)} onVcsAppMounted - called on mounted of VcsApp.vue
+                 * @property {function():C} [toJSON] - should return the plugin's serialization excluding all default values
+                 * @property {function():C} [getDefaultOptions] - should return the plugin's default options
+                 * @property {function(boolean=):S|Promise<S>} [getState] - should return the plugin's state or a promise for said state. is passed a "for url" flag. If true, only the state relevant for sharing a URL should be passed and short keys shall be used
+                 * @property {Array<PluginConfigEditor>} [getConfigEditors] - should return components for configuring the plugin or custom items defined by the plugin
+                 * @api
+                 */
             };
             instance: {
                 locale?: any;
@@ -305,14 +319,14 @@ declare class VcsUiApp extends VcsApp {
                 toISO: (date: unknown) => string;
                 startOfDay: (date: unknown) => unknown;
                 endOfDay: (date: unknown) => unknown;
-                startOfWeek: (date: unknown) => unknown; /**
-                 * An event triggered when the VcsApp was mounted and a target was set for the maps.
-                 * Provides the id of the target html element.
-                 * @type {import("@vcmap/core").VcsEvent<string>}
-                 */
+                startOfWeek: (date: unknown, firstDayOfWeek?: string | number | undefined) => unknown;
                 endOfWeek: (date: unknown) => unknown;
                 startOfMonth: (date: unknown) => unknown;
                 endOfMonth: (date: unknown) => unknown;
+                /**
+                 * @type {ContextMenuManager}
+                 * @private
+                 */
                 startOfYear: (date: unknown) => unknown;
                 endOfYear: (date: unknown) => unknown;
                 isAfter: (date: unknown, comparing: unknown) => boolean;
@@ -332,32 +346,28 @@ declare class VcsUiApp extends VcsApp {
                 getYear: (date: unknown) => number;
                 setYear: (date: unknown, year: number) => unknown;
                 getDiff: (date: unknown, comparing: unknown, unit?: string | undefined) => number;
-                getWeekArray: (date: unknown) => unknown[][];
-                getWeekdays: () => string[];
-                getMonth: (date: unknown) => number;
+                getWeekArray: (date: unknown, firstDayOfWeek?: string | number | undefined) => unknown[][];
+                getWeekdays: (firstDayOfWeek?: string | number | undefined) => string[];
+                getMonth: (date: unknown) => number; /**
+                 * @type {import("@vcmap/core").OverrideClassRegistry<typeof AbstractFeatureInfoView>}
+                 */
                 setMonth: (date: unknown, month: number) => unknown;
                 getDate: (date: unknown) => number;
                 setDate: (date: unknown, day: number) => unknown;
                 getNextMonth: (date: unknown) => unknown;
                 getPreviousMonth: (date: unknown) => unknown;
-                /**
-                 * @type {I18nCollection}
-                 */
                 getHours: (date: unknown) => number;
                 setHours: (date: unknown, hours: number) => unknown;
                 getMinutes: (date: unknown) => number;
                 setMinutes: (date: unknown, minutes: number) => unknown;
             };
         };
-        goTo: {
-            rtl: import("vue").Ref<boolean>;
-            options: Record<string, any>;
-        };
+        goTo: import("vuetify").GoToInstance;
     };
     /**
-     * @returns {import("vue-i18n").VueI18n}
+     * @returns {import("vue-i18n").Composer<{}, {}, {}, string, string, string>}
      */
-    get vueI18n(): import("vue-i18n").VueI18n<any, any, any, string, string, string, import("vue-i18n").Composer<any, any, any, string, string, string>>;
+    get vueI18n(): import("vue-i18n").Composer<{}, {}, {}, string, string, string>;
     /**
      * @returns {CategoryManager}
      */
@@ -373,7 +383,7 @@ declare class VcsUiApp extends VcsApp {
     /**
      * @type {import("@vcmap/core").OverrideCollection<import("./uiConfig.js").UiConfigurationItem<unknown>, UiConfig>}
      */
-    get uiConfig(): import("@vcmap/core").OverrideCollection<import("./uiConfig.js").UiConfigurationItem<unknown>, UiConfig>;
+    get uiConfig(): import("@vcmap/core").OverrideCollection<import("./uiConfig.js").UiConfigurationItem<unknown>, UiConfig, import("./uiConfig.js").UiConfigurationItem<unknown>>;
     /**
      * @type {Notifier}
      */

package/src/vcsUiApp.js

@@ -45,35 +45,49 @@ import { createVueI18n, setupI18n } from './vuePlugins/i18n.js';
 import { callbackClassRegistry } from './callback/vcsCallback.js';
 import createSiteConfig from './siteConfig.js';
 import { createVcsVuetify } from './vuePlugins/vuetify.js';
+import createObliqueFallbackWarnings from './obliqueFallbackWarnings.js';
 
 /**
  * @typedef {import("@vcmap/core").VcsModuleConfig & {
- *    plugins?: Object[],
+ *    plugins?: Record<string, unknown>[],
  *    contentTree?: import("./contentTree/contentTreeItem.js").ContentTreeItemOptions[],
  *    uiConfig?: import("./uiConfig.js").UiConfigurationItem<unknown>[],
  *    featureInfo?: import("./featureInfo/abstractFeatureInfoView.js").FeatureInfoViewOptions[],
- *    i18n?: Object[]
+ *    i18n?: import("./i18n/i18nCollection.js").I18nConfigurationItem[]
  *  }} VcsUiModuleConfig
  */
 
 /**
- * @typedef {Object} PluginConfig
+ * @typedef {{ name: string, entry?: string, version?: string}} PluginConfig
  * @property {string} name
- * @property {string|undefined} entry - path to the plugin's index.js
- * @property {string|undefined} version - version or version range
+ * @property {string|undefined} [entry] - path to the plugin's index.js
+ * @property {string|undefined} [version] - version or version range
  */
 
 /**
- * @typedef {Object} PluginConfigEditor
- * @property {import("vue").Component & { title: string | undefined}} component - A editor component to configure a plugin or item
+ * @typedef {import("vue").Component<{ getConfig(): C, setConfig(config?: C): void }>} PluginConfigEditorComponent
+ * @template {Object} C - plugin or item config
+ */
+
+/**
+ * @typedef {{
+ *   component: PluginConfigEditorComponent<C>,
+ *   title?: string,
+ *   collectionName?: string,
+ *   itemName?: string,
+ *   infoUrlCallback?: () => string,
+ * }} PluginConfigEditor
+ * @template {Object} C - plugin or item config
+ * @property {PluginConfigEditorComponent<C>} component - A editor component to configure a plugin or item
+ * @property {string} [title] - optional title to render in the window header & actions of this editor
  * @property {string} [collectionName='plugins'] - The collection the item belongs to. Default is plugins collection.
  * @property {string} [itemName] - The item the editor can be used for. Can be a name or className. Default is the plugin's name.
  * @property {function():string} [infoUrlCallback] - An optional function returning an url referencing help or further information regarding the config editor.
  */
 
 /**
- * @typedef {function(P, string):VcsPlugin<P, S>} createPlugin
- * @template {Object} P
+ * @typedef {function(C, string):VcsPlugin<C, S>} createPlugin
+ * @template {Object} C
  * @template {Object} S
  */
 
@@ -87,19 +101,19 @@ import { createVcsVuetify } from './vuePlugins/vuetify.js';
  *   i18n?: Object<string, unknown>,
  *   initialize?: function(import("@src/vcsUiApp.js").default, S=):void|Promise<void>,
  *   onVcsAppMounted?: function(import("@src/vcsUiApp.js").default):void,
- *   toJSON?: function(): P,
- *   getDefaultOptions?: function(): P,
+ *   toJSON?: function(): C,
+ *   getDefaultOptions?: function(): C,
  *   getState?: function(boolean=):S|Promise<S>,
- *   getConfigEditors?: function():Array<PluginConfigEditor>,
+ *   getConfigEditors?: function():Array<PluginConfigEditor<object>>,
  *   destroy?: function(): void
  * }} VcsPlugin
- * @template {Object} P
- * @template {Object} S
+ * @template {Object} C - plugin config
+ * @template {Object} S - plugin state
  * @property {Object<string, *>} [i18n] - the i18n messages of this plugin
  * @property {function(import("@src/vcsUiApp.js").default, S=)} initialize - called on plugin added. Is passed the VcsUiApp and optionally, the state for the plugin
  * @property {function(import("@src/vcsUiApp.js").default)} onVcsAppMounted - called on mounted of VcsApp.vue
- * @property {function():P} [toJSON] - should return the plugin's serialization excluding all default values
- * @property {function():P} [getDefaultOptions] - should return the plugin's default options
+ * @property {function():C} [toJSON] - should return the plugin's serialization excluding all default values
+ * @property {function():C} [getDefaultOptions] - should return the plugin's default options
  * @property {function(boolean=):S|Promise<S>} [getState] - should return the plugin's state or a promise for said state. is passed a "for url" flag. If true, only the state relevant for sharing a URL should be passed and short keys shall be used
  * @property {Array<PluginConfigEditor>} [getConfigEditors] - should return components for configuring the plugin or custom items defined by the plugin
  * @api
@@ -157,7 +171,7 @@ class VcsUiApp extends VcsApp {
      */
     this.themeChanged = new VcsEvent();
     /**
-     * @type {import("@vcmap/core").OverrideCollection<VcsPlugin>}
+     * @type {import("@vcmap/core").OverrideCollection<VcsPlugin<Object, Object>, Collection<VcsPlugin<Object, Object>>, Object>}
      * @private
      */
     this._plugins = makeOverrideCollection(
@@ -166,6 +180,17 @@ class VcsUiApp extends VcsApp {
       serializePlugin,
       deserializePlugin,
     );
+
+    /**
+     * I18n Collection adds plugin listener first, so the plugin i18n data is available on plugin initialize
+     * @type {I18nCollection<Object>}
+     * @private
+     */
+    this._i18n = makeOverrideCollection(
+      new I18nCollection(this._plugins),
+      () => this.dynamicModuleId,
+    );
+
     /**
      * @type {Array<function():void>}
      * @private
@@ -209,15 +234,6 @@ class VcsUiApp extends VcsApp {
       }),
     ];
 
-    /**
-     * @type {I18nCollection<Object>}
-     * @private
-     */
-    this._i18n = makeOverrideCollection(
-      new I18nCollection(this._plugins),
-      () => this.dynamicModuleId,
-    );
-
     /**
      *
      * @type {import("vue-i18n").I18n}
@@ -253,13 +269,19 @@ class VcsUiApp extends VcsApp {
     );
 
     /**
-     * @type {import("@vcmap/core").OverrideClassRegistry<import("@vcmap/core").Ctor<ContentTreeItem>>}
+     * @type {import("@vcmap/core").OverrideClassRegistry<typeof ContentTreeItem>}
      * @private
      */
     this._contentTreeClassRegistry = new OverrideClassRegistry(
       contentTreeClassRegistry,
     );
 
+    /**
+     * @type {import("@vcmap/core").OverrideCollection<import("./uiConfig.js").UiConfigurationItem<unknown>, UiConfig>}
+     * @private
+     */
+    this._uiConfig = new UiConfig(() => this.dynamicModuleId);
+
     /**
      * @type {import("@vcmap/core").OverrideCollection<import("./contentTree/contentTreeItem.js").ContentTreeItem, import("./contentTree/contentTreeCollection.js").ContentTreeCollection>}
      * @private
@@ -291,10 +313,11 @@ class VcsUiApp extends VcsApp {
     this._navbarManager = new NavbarManager();
 
     /**
-     * @type {import("@vcmap/core").OverrideCollection<import("./uiConfig.js").UiConfigurationItem<unknown>, UiConfig>}
+     * @type {Search}
      * @private
      */
-    this._uiConfig = new UiConfig(() => this.dynamicModuleId);
+    this._search = new Search(this);
+
     /**
      * @type {import("@vcmap/core").OverrideClassRegistry<AbstractFeatureInfoView>}
      * @private
@@ -333,12 +356,6 @@ class VcsUiApp extends VcsApp {
      */
     this._contextMenuManager = new ContextMenuManager(this);
 
-    /**
-     * @type {Search}
-     * @private
-     */
-    this._search = new Search(this);
-
     /**
      * @type {Notifier}
      * @private
@@ -358,10 +375,12 @@ class VcsUiApp extends VcsApp {
     this.mounted = new VcsEvent();
 
     this._destroySiteConfig = createSiteConfig(this._uiConfig);
+
+    this._destroyObliqueFallback = createObliqueFallbackWarnings(this);
   }
 
   /**
-   * @type {import("@vcmap/core").OverrideCollection<VcsPlugin<Object, Object>>}
+   * @type {import("@vcmap/core").OverrideCollection<VcsPlugin<Object, Object>, Collection<VcsPlugin<Object, Object>>, Object>}
    */
   get plugins() {
     return this._plugins;
@@ -375,21 +394,21 @@ class VcsUiApp extends VcsApp {
   }
 
   /**
-   * @type {import("@vcmap/core").OverrideClassRegistry<import("@vcmap/core").Ctor<typeof import("./callback/vcsCallback.js").default>>}
+   * @type {import("@vcmap/core").OverrideClassRegistry<typeof import("./callback/vcsCallback.js").default>}
    */
   get callbackClassRegistry() {
     return this._callbackClassRegistry;
   }
 
   /**
-   * @type {import("@vcmap/core").OverrideClassRegistry<import("@vcmap/core").Ctor<typeof ContentTreeItem>>}
+   * @type {import("@vcmap/core").OverrideClassRegistry<typeof ContentTreeItem>}
    */
   get contentTreeClassRegistry() {
     return this._contentTreeClassRegistry;
   }
 
   /**
-   * @type {import("@vcmap/core").OverrideClassRegistry<import("@vcmap/core").Ctor<typeof AbstractFeatureInfoView>>}
+   * @type {import("@vcmap/core").OverrideClassRegistry<typeof AbstractFeatureInfoView>}
    */
   get featureInfoClassRegistry() {
     return this._featureInfoClassRegistry;
@@ -459,7 +478,7 @@ class VcsUiApp extends VcsApp {
   }
 
   /**
-   * @returns {import("vue-i18n").VueI18n}
+   * @returns {import("vue-i18n").Composer<{}, {}, {}, string, string, string>}
    */
   get vueI18n() {
     return this._vueI18n;
@@ -520,7 +539,7 @@ class VcsUiApp extends VcsApp {
     )[0];
     return () => {
       const base =
-        this.uiConfig.config.value.helpBaseUrl || 'https://help.vc.systems/';
+        this.uiConfig.config.helpBaseUrl || 'https://help.vc.systems/';
       const url = `${
         this.locale
       }/${subpage}/v${mayorMinorVersion}/${path.replace(/^\//, '')}`;
@@ -737,6 +756,7 @@ class VcsUiApp extends VcsApp {
     this._featureInfo.destroy();
     this._uiConfig.destroy();
     this._destroySiteConfig();
+    this._destroyObliqueFallback();
     super.destroy();
   }
 }

package/src/vuePlugins/i18n.js

@@ -1,5 +1,6 @@
 import { createI18n } from 'vue-i18n';
 import { is } from '@vcsuite/check';
+import { resolveValue } from '@intlify/core-base';
 
 /**
  * creates a new VueI18n Instance.
@@ -8,10 +9,17 @@ import { is } from '@vcsuite/check';
 export function createVueI18n() {
   return createI18n({
     legacy: false,
+    globalInjection: true,
     locale: 'en',
     missingWarn: false,
     fallbackWarn: false,
     fallbackLocale: ['en', 'de'],
+    messageResolver: (obj, path) => {
+      const value = resolveValue(obj, path);
+      return typeof value === 'string'
+        ? value.replaceAll(/@/g, "{'@'}")
+        : value;
+    },
     messages: {
       en: {},
     },