@vcmap/ui 6.0.0-rc.5 → 6.0.0-rc.6

package/src/uiConfig.d.ts

@@ -45,7 +45,7 @@ export type UiConfigObject = {
      */
     appTitle?: string | undefined;
     /**
-     * - an optional primary color to use in all themes
+     * - an optional primary color to use in all themes, can be overwritten by `vuetifyTheme`
      */
     primaryColor?: string | undefined;
     /**
@@ -136,6 +136,10 @@ export type UiConfigObject = {
      * - the display quality settings
      */
     displayQuality?: import("@vcmap/core").DisplayQualityOptions | undefined;
+    /**
+     * - Vuetify Theming, also see vuetify configuration https://vuetifyjs.com/en/features/theme/
+     */
+    vuetifyTheme?: any;
 };
 /**
  * @typedef {{
@@ -179,7 +183,7 @@ export type UiConfigObject = {
  * @property {string} [logo] - the company logo to display. this will override any and all css overrides.
  * @property {string} [mobileLogo] - an alternative logo to display in mobile view
  * @property {string} [appTitle] - an optional title to display next to the company logo
- * @property {string} [primaryColor] - an optional primary color to use in all themes
+ * @property {string} [primaryColor] - an optional primary color to use in all themes, can be overwritten by `vuetifyTheme`
  * @property {boolean} [startingFeatureInfo] - an optional flag whether to activate feature info on startup (default active)
  * @property {string} [positionDisplayEventType] - mouse event, when position display is updated. Either 'click' (default) or 'move'.
  * @property {string} [helpBaseUrl='https://help.vc.systems/'] - an optional URL to a help landing page
@@ -202,6 +206,7 @@ export type UiConfigObject = {
  * @property {boolean} [hideSettings] - can be used to hide the settings Window
  * @property {boolean} [overviewMapActiveOnStartup] - can be used to activate the overviewMap on startup
  * @property {import("@vcmap/core").DisplayQualityOptions} [displayQuality] - the display quality settings
+ * @property {import("./vuetifyPlugins/vuetify.js").VcsThemes} [vuetifyTheme] - Vuetify Theming, also see vuetify configuration https://vuetifyjs.com/en/features/theme/
  */
 /**
  * @extends {Collection<UiConfigurationItem<unknown>>}
@@ -245,7 +250,7 @@ declare class UiConfig extends Collection<UiConfigurationItem<unknown>> {
          */
         readonly appTitle?: string | undefined;
         /**
-         * - an optional primary color to use in all themes
+         * - an optional primary color to use in all themes, can be overwritten by `vuetifyTheme`
          */
         readonly primaryColor?: string | undefined;
         /**
@@ -466,6 +471,10 @@ declare class UiConfig extends Collection<UiConfigurationItem<unknown>> {
                 readonly layerSSEFactor?: number | undefined;
             } | undefined;
         } | undefined;
+        /**
+         * - Vuetify Theming, also see vuetify configuration https://vuetifyjs.com/en/features/theme/
+         */
+        readonly vuetifyTheme?: any;
     };
 }
 import { Collection } from '@vcmap/core';

package/src/uiConfig.js

@@ -47,7 +47,7 @@ import { reactive, readonly } from 'vue';
  * @property {string} [logo] - the company logo to display. this will override any and all css overrides.
  * @property {string} [mobileLogo] - an alternative logo to display in mobile view
  * @property {string} [appTitle] - an optional title to display next to the company logo
- * @property {string} [primaryColor] - an optional primary color to use in all themes
+ * @property {string} [primaryColor] - an optional primary color to use in all themes, can be overwritten by `vuetifyTheme`
  * @property {boolean} [startingFeatureInfo] - an optional flag whether to activate feature info on startup (default active)
  * @property {string} [positionDisplayEventType] - mouse event, when position display is updated. Either 'click' (default) or 'move'.
  * @property {string} [helpBaseUrl='https://help.vc.systems/'] - an optional URL to a help landing page
@@ -70,6 +70,7 @@ import { reactive, readonly } from 'vue';
  * @property {boolean} [hideSettings] - can be used to hide the settings Window
  * @property {boolean} [overviewMapActiveOnStartup] - can be used to activate the overviewMap on startup
  * @property {import("@vcmap/core").DisplayQualityOptions} [displayQuality] - the display quality settings
+ * @property {import("./vuetifyPlugins/vuetify.js").VcsThemes} [vuetifyTheme] - Vuetify Theming, also see vuetify configuration https://vuetifyjs.com/en/features/theme/
  */
 
 /**

package/src/vcsUiApp.d.ts

@@ -1,64 +1,45 @@
 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 PluginConfigEditorComponent<Config extends Object> = import("vue").Component<{
-    getConfig(): Promise<Config>;
-    setConfig(config: Config): Promise<void>;
-}> & {
+    getConfig(): Config;
+    setConfig(config?: Config): void;
+}>;
+export type PluginConfigEditor<Config extends Object> = {
+    component: PluginConfigEditorComponent<Config>;
     title?: string;
+    collectionName?: string;
+    itemName?: string;
+    infoUrlCallback?: () => string;
 };
-export type PluginConfigEditor = {
-    /**
-     * - A editor component to configure a plugin or item
-     */
-    component: PluginConfigEditorComponent<object>;
-    /**
-     * - 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 createPlugin<P extends Object, S extends Object> = (arg0: P, arg1: string) => VcsPlugin<P, S>;
+export type createPlugin<Config extends Object, State extends Object> = (arg0: Config, arg1: string) => VcsPlugin<Config, State>;
 /**
  * Interface for VcsPlugins.
  * The function implementing the interface should not throw!
  */
-export type VcsPlugin<P extends Object, S extends Object> = {
+export type VcsPlugin<Config extends Object, State extends Object> = {
     name: string;
     version: string;
     mapVersion: string;
     i18n?: {
         [x: string]: unknown;
     };
-    initialize?: (arg0: import("@src/vcsUiApp.js").default, arg1: S | undefined) => void | Promise<void>;
+    initialize?: (arg0: import("@src/vcsUiApp.js").default, arg1: State | undefined) => void | Promise<void>;
     onVcsAppMounted?: (arg0: import("@src/vcsUiApp.js").default) => void;
-    toJSON?: () => P;
-    getDefaultOptions?: () => P;
-    getState?: (arg0: boolean | undefined) => S | Promise<S>;
-    getConfigEditors?: () => Array<PluginConfigEditor>;
+    toJSON?: () => Config;
+    getDefaultOptions?: () => Config;
+    getState?: (arg0: boolean | undefined) => State | Promise<State>;
+    getConfigEditors?: () => Array<PluginConfigEditor<Config>>;
     destroy?: () => void;
 };
 export type VcsComponentManager<T extends Object, O extends Object> = {
@@ -89,7 +70,7 @@ declare class VcsUiApp extends VcsApp {
      */
     themeChanged: VcsEvent<void>;
     /**
-     * @type {import("@vcmap/core").OverrideCollection<VcsPlugin>}
+     * @type {import("@vcmap/core").OverrideCollection<VcsPlugin, Collection<VcsPlugin>, Object>}
      * @private
      */
     private _plugins;
@@ -132,7 +113,7 @@ 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;
@@ -214,25 +195,25 @@ declare class VcsUiApp extends VcsApp {
     mounted: import("@vcmap/core").VcsEvent<string>;
     _destroySiteConfig: () => void;
     /**
-     * @type {import("@vcmap/core").OverrideCollection<VcsPlugin<Object, Object>>}
+     * @type {import("@vcmap/core").OverrideCollection<VcsPlugin, Collection<VcsPlugin>, Object>}
      */
-    get plugins(): import("@vcmap/core").OverrideCollection<VcsPlugin<Object, Object>, Collection<VcsPlugin<Object, Object>>>;
+    get plugins(): import("@vcmap/core").OverrideCollection<any, Collection<any>, 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}
      */
@@ -278,10 +259,7 @@ declare class VcsUiApp extends VcsApp {
         icons: {
             defaultSet: string;
             aliases: Partial<import("vuetify").IconAliases>;
-            sets: Record<string, import("vuetify").IconSet>; /**
-             * @type {Array<function():void>}
-             * @private
-             */
+            sets: Record<string, import("vuetify").IconSet>;
         };
         locale: {
             isRtl: import("vue").Ref<boolean>;
@@ -328,13 +306,20 @@ declare class VcsUiApp extends VcsApp {
                 isEqual: (date: unknown, comparing: unknown) => boolean;
                 isValid: (date: any) => boolean;
                 isWithinRange: (date: unknown, range: [unknown, unknown]) => boolean;
-                addMinutes: (date: unknown, amount: number) => unknown;
+                addMinutes: (date: unknown, amount: number) => unknown; /**
+                 * @type {import("@vcmap/core").OverrideClassRegistry<typeof import("./callback/vcsCallback.js").default>}
+                 */
                 addHours: (date: unknown, amount: number) => unknown;
                 addDays: (date: unknown, amount: number) => unknown;
                 addWeeks: (date: unknown, amount: number) => unknown;
+                /**
+                 * @type {import("@vcmap/core").OverrideClassRegistry<typeof ContentTreeItem>}
+                 */
                 addMonths: (date: unknown, amount: number) => unknown;
                 getYear: (date: unknown) => number;
-                setYear: (date: unknown, year: number) => unknown;
+                setYear: (date: unknown, year: number) => unknown; /**
+                 * @type {import("@vcmap/core").OverrideClassRegistry<typeof AbstractFeatureInfoView>}
+                 */
                 getDiff: (date: unknown, comparing: unknown, unit?: string | undefined) => number;
                 getWeekArray: (date: unknown, firstDayOfWeek?: string | number | undefined) => unknown[][];
                 getWeekdays: (firstDayOfWeek?: string | number | undefined) => string[];
@@ -371,7 +356,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

@@ -48,40 +48,46 @@ import { createVcsVuetify } from './vuePlugins/vuetify.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
  */
 
 /**
- * @typedef {import("vue").Component<{ getConfig(): Promise<Config>, setConfig(config: Config): Promise<void> }> & {
- *  title?: string
- * }} PluginConfigEditorComponent
+ * @typedef {import("vue").Component<{ getConfig(): Config, setConfig(config?: Config): void }>} PluginConfigEditorComponent
  * @template {Object} Config
  */
 
 /**
- * @typedef {Object} PluginConfigEditor
- * @property {PluginConfigEditorComponent<object>} component - A editor component to configure a plugin or item
+ * @typedef {{
+ *   component: PluginConfigEditorComponent<Config>,
+ *   title?: string,
+ *   collectionName?: string,
+ *   itemName?: string,
+ *   infoUrlCallback?: () => string,
+ * }} PluginConfigEditor
+ * @template {Object} Config
+ * @property {PluginConfigEditorComponent<Config>} 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
- * @template {Object} S
+ * @typedef {function(Config, string):VcsPlugin<Config, State>} createPlugin
+ * @template {Object} Config
+ * @template {Object} State
  */
 
 /**
@@ -92,22 +98,22 @@ import { createVcsVuetify } from './vuePlugins/vuetify.js';
  *   version: string,
  *   mapVersion: string,
  *   i18n?: Object<string, unknown>,
- *   initialize?: function(import("@src/vcsUiApp.js").default, S=):void|Promise<void>,
+ *   initialize?: function(import("@src/vcsUiApp.js").default, State=):void|Promise<void>,
  *   onVcsAppMounted?: function(import("@src/vcsUiApp.js").default):void,
- *   toJSON?: function(): P,
- *   getDefaultOptions?: function(): P,
- *   getState?: function(boolean=):S|Promise<S>,
- *   getConfigEditors?: function():Array<PluginConfigEditor>,
+ *   toJSON?: function(): Config,
+ *   getDefaultOptions?: function(): Config,
+ *   getState?: function(boolean=):State|Promise<State>,
+ *   getConfigEditors?: function():Array<PluginConfigEditor<Config>>,
  *   destroy?: function(): void
  * }} VcsPlugin
- * @template {Object} P
- * @template {Object} S
+ * @template {Object} Config
+ * @template {Object} 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, State=)} 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(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 {function():Config} [toJSON] - should return the plugin's serialization excluding all default values
+ * @property {function():Config} [getDefaultOptions] - should return the plugin's default options
+ * @property {function(boolean=):S|Promise<State>} [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
  */
@@ -164,7 +170,7 @@ class VcsUiApp extends VcsApp {
      */
     this.themeChanged = new VcsEvent();
     /**
-     * @type {import("@vcmap/core").OverrideCollection<VcsPlugin>}
+     * @type {import("@vcmap/core").OverrideCollection<VcsPlugin, Collection<VcsPlugin>, Object>}
      * @private
      */
     this._plugins = makeOverrideCollection(
@@ -260,7 +266,7 @@ 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(
@@ -369,7 +375,7 @@ class VcsUiApp extends VcsApp {
   }
 
   /**
-   * @type {import("@vcmap/core").OverrideCollection<VcsPlugin<Object, Object>>}
+   * @type {import("@vcmap/core").OverrideCollection<VcsPlugin, Collection<VcsPlugin>, Object>}
    */
   get plugins() {
     return this._plugins;
@@ -383,21 +389,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;

package/src/vuePlugins/vuetify.d.ts

@@ -1,61 +1,54 @@
-export function createVcsThemes(): {
-    light: {
-        colors: {
-            base: string;
-            'base-lighten-5': string;
-            'base-lighten-4': string;
-            'base-lighten-3': string;
-            'base-lighten-2': string;
-            'base-lighten-1': string;
-            'base-darken-1': string;
-            'base-darken-2': string;
-            'base-darken-3': string;
-            'base-darken-4': string;
-            primary: string;
-            warning: string;
-            error: string;
-            info: string;
-            success: string;
-            'surface-light': string;
-        };
-        variables: {
-            'hover-opacity': number;
-            'high-emphasis-opacity': number;
-            'medium-emphasis-opacity': number;
-            'vcs-item-height': string;
-            'vcs-font-size': string;
-            'vcs-font-family': string;
-        };
-    };
-    dark: {
-        colors: {
-            base: string;
-            'base-lighten-5': string;
-            'base-lighten-4': string;
-            'base-lighten-3': string;
-            'base-lighten-2': string;
-            'base-lighten-1': string;
-            'base-darken-1': string;
-            'base-darken-2': string;
-            'base-darken-3': string;
-            'base-darken-4': string;
-            primary: string;
-            warning: string;
-            error: string;
-            info: string;
-            success: string;
-            'surface-light': string;
-        };
-        variables: {
-            'hover-opacity': number;
-            'high-emphasis-opacity': number;
-            'medium-emphasis-opacity': number;
-            'vcs-item-height': string;
-            'vcs-font-size': string;
-            'vcs-font-family': string;
-        };
-    };
-};
+/**
+ * @typedef {Object} VcsColors
+ * @property {string} [base]
+ * @property {string} [base-lighten-5]
+ * @property {string} [base-lighten-4]
+ * @property {string} [base-lighten-3]
+ * @property {string} [base-lighten-2]
+ * @property {string} [base-lighten-1]
+ * @property {string} [base-darken-1]
+ * @property {string} [base-darken-2]
+ * @property {string} [base-darken-3]
+ * @property {string} [base-darken-4]
+ * @property {string} [primary]
+ * @property {string} [warning]
+ * @property {string} [error]
+ * @property {string} [info]
+ * @property {string} [success]
+ * @property {string} [surface-light]
+ */
+/**
+ * @typedef {Object} VcsVariables
+ * @property {string} [hover-opacity]
+ * @property {string} [high-emphasis-opacity]
+ * @property {string} [medium-emphasis-opacity]
+ * @property {string} [vcs-font-size]
+ * @property {string} [vcs-font-family]
+ */
+/**
+ * @typedef {Object} VcsTheme
+ * @property {VcsColors} [colors]
+ * @property {VcsVariables} [variables]
+ */
+/**
+ * @typedef {Object} VcsThemes
+ * @property {VcsTheme} [dark]
+ * @property {VcsTheme} [light]
+ */
+/**
+ * @param {VcsThemes} [options]
+ * @param {{ dark:string, light:string }|string} [primaryColor]
+ * @returns {VcsThemes}
+ */
+export function createVcsThemes(options?: VcsThemes | undefined, primaryColor?: string | {
+    dark: string;
+    light: string;
+} | undefined): VcsThemes;
+/**
+ * @param {ReturnType<typeof import("vuetify").createVuetify>} vuetify
+ * @param {VcsThemes} theme
+ */
+export function setTheme(vuetify: ReturnType<typeof import("vuetify").createVuetify>, theme: VcsThemes): void;
 /**
  * @param {import("vue-i18n").I18n} i18n
  * @returns {ReturnType<typeof import("vuetify").createVuetify>}
@@ -81,15 +74,15 @@ export function getDefaultPrimaryColor(app: import("../vcsUiApp.js").default): s
  */
 export function getColorByKey(app: import("../vcsUiApp.js").default, value: string, variant?: string | undefined): string;
 /**
- * returns the itemHeight as a number
+ * returns the fontSize as a number
  * @returns {import("vue").ComputedRef<number>}
  */
-export function useItemHeight(): import("vue").ComputedRef<number>;
+export function useFontSize(): import("vue").ComputedRef<number>;
 /**
- * returns the fontSize as a number
+ * returns the default IconSize as a number, value is based on the fontSize
  * @returns {import("vue").ComputedRef<number>}
  */
-export function useFontSize(): import("vue").ComputedRef<number>;
+export function useIconSize(): import("vue").ComputedRef<number>;
 /**
  * @type {{light:string,dark:string}}
  */
@@ -97,3 +90,36 @@ export const defaultPrimaryColor: {
     light: string;
     dark: string;
 };
+export type VcsColors = {
+    base?: string | undefined;
+    "base-lighten-5"?: string | undefined;
+    "base-lighten-4"?: string | undefined;
+    "base-lighten-3"?: string | undefined;
+    "base-lighten-2"?: string | undefined;
+    "base-lighten-1"?: string | undefined;
+    "base-darken-1"?: string | undefined;
+    "base-darken-2"?: string | undefined;
+    "base-darken-3"?: string | undefined;
+    "base-darken-4"?: string | undefined;
+    primary?: string | undefined;
+    warning?: string | undefined;
+    error?: string | undefined;
+    info?: string | undefined;
+    success?: string | undefined;
+    "surface-light"?: string | undefined;
+};
+export type VcsVariables = {
+    "hover-opacity"?: string | undefined;
+    "high-emphasis-opacity"?: string | undefined;
+    "medium-emphasis-opacity"?: string | undefined;
+    "vcs-font-size"?: string | undefined;
+    "vcs-font-family"?: string | undefined;
+};
+export type VcsTheme = {
+    colors?: VcsColors | undefined;
+    variables?: VcsVariables | undefined;
+};
+export type VcsThemes = {
+    dark?: VcsTheme | undefined;
+    light?: VcsTheme | undefined;
+};