@vcmap/ui 6.3.10 → 7.0.0-rc.1

package/src/application/VcsSplashScreen.vue

@@ -79,10 +79,10 @@
     setToLocalStorage,
   } from '../localStorage.js';
   import { executeCallbacks } from '../callback/vcsCallback.js';
-  import VcsFormButton from '../components/buttons/VcsFormButton.vue';
-  import VcsCheckbox from '../components/form-inputs-controls/VcsCheckbox.vue';
-  import VcsMarkdown from '../components/form-output/VcsMarkdown.vue';
-  import { useProxiedAtomicModel } from '../components/modelHelper.js';
+  import VcsFormButton from '../components/buttons/VcsFormButton.ts.vue';
+  import VcsCheckbox from '../components/form-inputs-controls/VcsCheckbox.ts.vue';
+  import VcsMarkdown from '../components/form-output/VcsMarkdown.ts.vue';
+  import { useProxiedAtomicModel } from '../components/modelHelper.ts';
   import { name } from '../../package.json';
 
   /**

package/src/application/VcsSplashScreen.vue.d.ts

@@ -9,7 +9,9 @@ export function getSplashScreenHash(app: import("@vcmap/ui").VcsUiApp): Promise<
  * @returns {boolean} - true if the SplashScreenConfigHash of the local storage is different from the current SplashScreenConfigHash
  */
 export function shouldShowSplashSceen(app: import("../vcsUiApp.js").default): boolean;
-declare const _default: import("vue").DefineComponent<{
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue", { with: { "resolution-mode": "import" } }).DefineComponent<{
     modelValue: {
         type: BooleanConstructor;
         default: boolean;
@@ -19,18 +21,18 @@ declare const _default: import("vue").DefineComponent<{
         required: true;
     };
 }, {
-    localValue: import("vue").Ref<any>;
+    localValue: import("vue", { with: { "resolution-mode": "import" } }).WritableComputedRef<boolean>;
     exitScreen: () => void;
     secondaryButtonClicked: () => void;
-    checkBox: import("vue").Ref<boolean>;
-    dontShowAgain: import("vue").Ref<boolean>;
-    position: import("vue").ComputedRef<{
+    checkBox: import("vue", { with: { "resolution-mode": "import" } }).Ref<boolean>;
+    dontShowAgain: import("vue", { with: { "resolution-mode": "import" } }).Ref<boolean>;
+    position: import("vue", { with: { "resolution-mode": "import" } }).ComputedRef<{
         width: any;
         height: any;
         maxWidth: any;
         maxHeight: any;
     }>;
-}, any, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+}, any, {}, {}, import("vue", { with: { "resolution-mode": "import" } }).ComponentOptionsMixin, import("vue", { with: { "resolution-mode": "import" } }).ComponentOptionsMixin, {}, string, import("vue", { with: { "resolution-mode": "import" } }).PublicProps, Readonly<import("vue", { with: { "resolution-mode": "import" } }).ExtractPropTypes<{
     modelValue: {
         type: BooleanConstructor;
         default: boolean;
@@ -42,4 +44,3 @@ declare const _default: import("vue").DefineComponent<{
 }>>, {
     modelValue: boolean;
 }, {}>;
-export default _default;

package/src/application/VcsTextPage.vue

@@ -6,7 +6,7 @@
 
 <script>
   import { VContainer } from 'vuetify/components';
-  import VcsMarkdown from '../components/form-output/VcsMarkdown.vue';
+  import VcsMarkdown from '../components/form-output/VcsMarkdown.ts.vue';
 
   /**
    * @description Container wrapper around VcsMarkdown

package/src/application/VcsTextPage.vue.d.ts

@@ -1,12 +1,13 @@
-declare const _default: import("vue").DefineComponent<{
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue", { with: { "resolution-mode": "import" } }).DefineComponent<{
     content: {
         type: StringConstructor;
         required: true;
     };
-}, any, any, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+}, any, any, {}, {}, import("vue", { with: { "resolution-mode": "import" } }).ComponentOptionsMixin, import("vue", { with: { "resolution-mode": "import" } }).ComponentOptionsMixin, {}, string, import("vue", { with: { "resolution-mode": "import" } }).PublicProps, Readonly<import("vue", { with: { "resolution-mode": "import" } }).ExtractPropTypes<{
     content: {
         type: StringConstructor;
         required: true;
     };
 }>>, {}, {}>;
-export default _default;

package/src/application/VcsTextPageFooter.vue.d.ts

@@ -1,4 +1,6 @@
-declare const _default: import("vue").DefineComponent<{
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue", { with: { "resolution-mode": "import" } }).DefineComponent<{
     textPage: {
         type: ObjectConstructor;
         default: () => void;
@@ -9,7 +11,7 @@ declare const _default: import("vue").DefineComponent<{
     };
 }, {
     addTextPage: () => void;
-}, any, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+}, any, {}, {}, import("vue", { with: { "resolution-mode": "import" } }).ComponentOptionsMixin, import("vue", { with: { "resolution-mode": "import" } }).ComponentOptionsMixin, {}, string, import("vue", { with: { "resolution-mode": "import" } }).PublicProps, Readonly<import("vue", { with: { "resolution-mode": "import" } }).ExtractPropTypes<{
     textPage: {
         type: ObjectConstructor;
         default: () => void;
@@ -21,4 +23,3 @@ declare const _default: import("vue").DefineComponent<{
 }>>, {
     textPage: Record<string, any>;
 }, {}>;
-export default _default;

package/src/application/uiConfigHelper.d.ts

@@ -3,22 +3,22 @@
  * @param {import("../uiConfig.js").UiConfigObject} uiConfig - The UI configuration object from the app.
  * @returns {import('vue').ComputedRef<import('../uiConfig.js').TextPageType|undefined>}
  */
-export function getDataProtection(uiConfig: import("../uiConfig.js").UiConfigObject): import('vue').ComputedRef<import('../uiConfig.js').TextPageType | undefined>;
+export function getDataProtection(uiConfig: import("../uiConfig.js").UiConfigObject): import("vue").ComputedRef<import("../uiConfig.js").TextPageType | undefined>;
 /**
  * Creates a computed property for imprint configuration.
  * @param {import("../uiConfig.js").UiConfigObject} uiConfig - The UI configuration object from the app.
  * @returns {import('vue').ComputedRef<import('../uiConfig.js').TextPageType|undefined>}
  */
-export function getImprint(uiConfig: import("../uiConfig.js").UiConfigObject): import('vue').ComputedRef<import('../uiConfig.js').TextPageType | undefined>;
+export function getImprint(uiConfig: import("../uiConfig.js").UiConfigObject): import("vue").ComputedRef<import("../uiConfig.js").TextPageType | undefined>;
 /**
  * Creates a computed property for additional footer information configuration.
  * @param {import("../uiConfig.js").UiConfigObject} uiConfig - The UI configuration object from the app.
  * @returns {import('vue').ComputedRef<import('../uiConfig.js').TextPageType[]|undefined>}
  */
-export function getFooterInformation(uiConfig: import("../uiConfig.js").UiConfigObject): import('vue').ComputedRef<import('../uiConfig.js').TextPageType[] | undefined>;
+export function getFooterInformation(uiConfig: import("../uiConfig.js").UiConfigObject): import("vue").ComputedRef<import("../uiConfig.js").TextPageType[] | undefined>;
 /**
  * Creates a computed property for mobile logo.
  * @param {import("../vcsUiApp.js").default} app - The VcsUiApp.
  * @returns {import('vue').ComputedRef<string>}
  */
-export function getMobileLogo(app: import("../vcsUiApp.js").default): import('vue').ComputedRef<string>;
+export function getMobileLogo(app: import("../vcsUiApp.js").default): import("vue").ComputedRef<string>;

package/src/callback/hideObjectsCallback.d.ts

@@ -12,7 +12,7 @@ export default class HideObjectsCallback extends VcsCallback {
      * @param {HideObjectsCallbackOptions} options
      * @param {import('@vcmap/ui').VcsUiApp} app
      */
-    constructor(options: HideObjectsCallbackOptions, app: import('@vcmap/ui').VcsUiApp);
+    constructor(options: HideObjectsCallbackOptions, app: import("@vcmap/ui").VcsUiApp);
     /** @type {string | undefined} */
     _layerName: string | undefined;
     /** @type {string[]} */
@@ -21,7 +21,7 @@ export default class HideObjectsCallback extends VcsCallback {
     /** @returns {HideObjectsCallbackOptions} */
     toJSON(): HideObjectsCallbackOptions;
 }
-export type HideObjectsCallbackOptions = import('@vcmap/ui').VcsCallbackOptions & {
+export type HideObjectsCallbackOptions = import("@vcmap/ui").VcsCallbackOptions & {
     layerName?: string;
     objectIds: string[];
 };

package/src/callback/highlightObjectsCallback.d.ts

@@ -15,7 +15,7 @@ export default class HighlightObjectsCallback extends VcsCallback {
      * @param {HighlightObjectsCallbackOptions} options
      * @param {import('@vcmap/ui').VcsUiApp} app
      */
-    constructor(options: HighlightObjectsCallbackOptions, app: import('@vcmap/ui').VcsUiApp);
+    constructor(options: HighlightObjectsCallbackOptions, app: import("@vcmap/ui").VcsUiApp);
     /** @type {string} */
     _layerName: string;
     /** @type {Record<string, VectorStyleItemOptions>} */
@@ -24,8 +24,8 @@ export default class HighlightObjectsCallback extends VcsCallback {
     /** @returns {HighlightObjectsCallbackOptions} */
     toJSON(): HighlightObjectsCallbackOptions;
 }
-export type VectorStyleItemOptions = import('@vcmap/core').VectorStyleItemOptions;
-export type HighlightObjectsCallbackOptions = import('@vcmap/ui').VcsCallbackOptions & {
+export type VectorStyleItemOptions = import("@vcmap/core").VectorStyleItemOptions;
+export type HighlightObjectsCallbackOptions = import("@vcmap/ui").VcsCallbackOptions & {
     layerName: string;
     toHighlight: Record<string, VectorStyleItemOptions>;
 };

package/src/callback/showObjectsCallback.d.ts

@@ -12,7 +12,7 @@ export default class ShowObjectsCallback extends VcsCallback {
      * @param {ShowObjectsCallbackOptions} options
      * @param {import('@vcmap/ui').VcsUiApp} app
      */
-    constructor(options: ShowObjectsCallbackOptions, app: import('@vcmap/ui').VcsUiApp);
+    constructor(options: ShowObjectsCallbackOptions, app: import("@vcmap/ui").VcsUiApp);
     /** @type {string | undefined} */
     _layerName: string | undefined;
     /** @type {string[]} */
@@ -21,7 +21,7 @@ export default class ShowObjectsCallback extends VcsCallback {
     /** @returns {ShowObjectsCallbackOptions} */
     toJSON(): ShowObjectsCallbackOptions;
 }
-export type ShowObjectsCallbackOptions = import('@vcmap/ui').VcsCallbackOptions & {
+export type ShowObjectsCallbackOptions = import("@vcmap/ui").VcsCallbackOptions & {
     layerName?: string;
     objectIds: string[];
 };

package/src/callback/startFlightCallback.d.ts

@@ -14,7 +14,7 @@ export default class StartFlightCallback extends VcsCallback {
      * @param {StartFlightCallbackOptions} options
      * @param {import('@vcmap/ui').VcsUiApp} app
      */
-    constructor(options: StartFlightCallbackOptions, app: import('@vcmap/ui').VcsUiApp);
+    constructor(options: StartFlightCallbackOptions, app: import("@vcmap/ui").VcsUiApp);
     /** @type {string | FlightInstanceOptions} */
     _flight: string | FlightInstanceOptions;
     /** @returns {Promise<void>} */
@@ -22,8 +22,8 @@ export default class StartFlightCallback extends VcsCallback {
     /** @returns {StartFlightCallbackOptions} */
     toJSON(): StartFlightCallbackOptions;
 }
-export type FlightInstanceOptions = import('@vcmap/core').FlightInstanceOptions;
-export type StartFlightCallbackOptions = import('@vcmap/ui').VcsCallbackOptions & {
+export type FlightInstanceOptions = import("@vcmap/core").FlightInstanceOptions;
+export type StartFlightCallbackOptions = import("@vcmap/ui").VcsCallbackOptions & {
     flight: string | FlightInstanceOptions;
 };
 import VcsCallback from './vcsCallback.js';

package/src/callback/stopFlightCallback.d.ts

@@ -11,14 +11,14 @@ export default class StopFlightCallback extends VcsCallback {
      * @param {StopFlightCallbackOptions} options
      * @param {import('@vcmap/ui').VcsUiApp} app
      */
-    constructor(options: StopFlightCallbackOptions, app: import('@vcmap/ui').VcsUiApp);
+    constructor(options: StopFlightCallbackOptions, app: import("@vcmap/ui").VcsUiApp);
     /** @type {string} */
     _flightName: string;
     callback(): void;
     /** @returns {StopFlightCallbackOptions} */
     toJSON(): StopFlightCallbackOptions;
 }
-export type StopFlightCallbackOptions = import('@vcmap/ui').VcsCallbackOptions & {
+export type StopFlightCallbackOptions = import("@vcmap/ui").VcsCallbackOptions & {
     flightName: string;
 };
 import VcsCallback from './vcsCallback.js';

package/src/callback/unHighlightObjectsCallback.d.ts

@@ -12,7 +12,7 @@ export default class UnHighlightObjectsCallback extends VcsCallback {
      * @param {UnHighlightObjectsCallbackOptions} options
      * @param {import('@vcmap/ui').VcsUiApp} app
      */
-    constructor(options: UnHighlightObjectsCallbackOptions, app: import('@vcmap/ui').VcsUiApp);
+    constructor(options: UnHighlightObjectsCallbackOptions, app: import("@vcmap/ui").VcsUiApp);
     /** @type {string} */
     _layerName: string;
     /** @type {(string | number)[]} */
@@ -21,7 +21,7 @@ export default class UnHighlightObjectsCallback extends VcsCallback {
     /** @returns {UnHighlightObjectsCallbackOptions} */
     toJSON(): UnHighlightObjectsCallbackOptions;
 }
-export type UnHighlightObjectsCallbackOptions = import('@vcmap/ui').VcsCallbackOptions & {
+export type UnHighlightObjectsCallbackOptions = import("@vcmap/ui").VcsCallbackOptions & {
     layerName: string;
     toUnHighlight: (string | number)[];
 };

package/src/components/{ImageElementInjector.vue → ImageElementInjector.ts.vue}

@@ -2,12 +2,13 @@
   <div />
 </template>
 
-<script>
+<script lang="ts">
+  import { defineComponent } from 'vue';
   /**
    * @description A component injecting an HTMLCanvasElement or HTMLImageElement in a div.
    * @vue-prop {HTMLCanvasElement|HTMLImageElement} element
    */
-  export default {
+  export default defineComponent({
     name: 'ImageElementInjector',
     props: {
       element: {
@@ -18,7 +19,7 @@
     mounted() {
       this.$el.replaceWith(this.element);
     },
-  };
+  });
 </script>
 
 <style scoped></style>

package/src/components/ImageElementInjector.ts.vue.d.ts

@@ -0,0 +1,29 @@
+/**
+ * @description A component injecting an HTMLCanvasElement or HTMLImageElement in a div.
+ * @vue-prop {HTMLCanvasElement|HTMLImageElement} element
+ */
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue", { with: { "resolution-mode": "import" } }).DefineComponent<{
+    element: {
+        type: ({
+            new (): HTMLCanvasElement;
+            prototype: HTMLCanvasElement;
+        } | {
+            new (): HTMLImageElement;
+            prototype: HTMLImageElement;
+        })[];
+        required: true;
+    };
+}, unknown, unknown, {}, {}, import("vue", { with: { "resolution-mode": "import" } }).ComponentOptionsMixin, import("vue", { with: { "resolution-mode": "import" } }).ComponentOptionsMixin, {}, string, import("vue", { with: { "resolution-mode": "import" } }).PublicProps, Readonly<import("vue", { with: { "resolution-mode": "import" } }).ExtractPropTypes<{
+    element: {
+        type: ({
+            new (): HTMLCanvasElement;
+            prototype: HTMLCanvasElement;
+        } | {
+            new (): HTMLImageElement;
+            prototype: HTMLImageElement;
+        })[];
+        required: true;
+    };
+}>>, {}, {}>;

package/src/components/attrsHelpers.d.ts

@@ -1,5 +1 @@
-/**
- * @param {Record<string, unknown>} attrs
- * @returns {Record<string, unknown>}
- */
-export function removeListenersFromAttrs(attrs: Record<string, unknown>): Record<string, unknown>;
+export declare function removeListenersFromAttrs(attrs: Record<string, unknown>): Record<string, unknown>;

package/src/components/attrsHelpers.ts

@@ -0,0 +1,11 @@
+import { is } from '@vcsuite/check';
+
+export function removeListenersFromAttrs(
+  attrs: Record<string, unknown>,
+): Record<string, unknown> {
+  return Object.fromEntries(
+    Object.entries(attrs).filter(
+      ([key, value]): boolean => !(key.startsWith('on') && is(value, Function)),
+    ),
+  );
+}

package/src/components/buttons/{VcsActionButtonList.vue → VcsActionButtonList.ts.vue}

@@ -42,20 +42,24 @@
     <v-spacer v-else-if="blockOverflow" />
   </div>
 </template>
-<script>
+
+<script lang="ts">
   import { VIcon, VMenu, VSpacer } from 'vuetify/components';
-  import VcsButton from './VcsButton.vue';
-  import VcsToolButton from './VcsToolButton.vue';
-  import VcsFormButton from './VcsFormButton.vue';
-  import VcsActionList, { validateActions } from '../lists/VcsActionList.vue';
+  import { computed, defineComponent, inject, type PropType } from 'vue';
+  import type VcsUiApp from '../../vcsUiApp.js';
+  import VcsButton from './VcsButton.ts.vue';
+  import VcsToolButton from './VcsToolButton.ts.vue';
+  import VcsFormButton from './VcsFormButton.ts.vue';
+  import VcsActionList, {
+    validateActions,
+  } from '../lists/VcsActionList.ts.vue';
+  import type { VcsAction } from '../../actions/actionHelper.js';
 
   /**
    * compares two strings token based
-   * @param {string} str1
-   * @param {string} str2
-   * @returns {number} the convergence of both strings in percent
+   * @returns the convergence of both strings in percent
    */
-  function jaccardSimilarity(str1, str2) {
+  function jaccardSimilarity(str1: string, str2: string): number {
     const set1 = new Set(str1.split(' '));
     const set2 = new Set(str2.split(' '));
     const intersection = new Set([...set1].filter((x) => set2.has(x)));
@@ -80,7 +84,7 @@
    * @vue-computed {Array<VcsAction>} buttons - buttons rendered directly, have to provide an icon
    * @vue-computed {Array<VcsAction>} overflowButtons - rest of buttons rendered in overflow
    */
-  export default {
+  export default defineComponent({
     name: 'VcsActionButtonList',
     components: {
       VcsActionList,
@@ -93,14 +97,14 @@
     },
     props: {
       actions: {
-        type: Array,
+        type: Array as PropType<VcsAction[]>,
         required: true,
         validator: validateActions,
       },
       button: {
         type: String,
         default: 'VcsButton',
-        validator: (type) =>
+        validator: (type: string) =>
           ['VcsButton', 'VcsToolButton', 'VcsFormButton'].includes(type),
       },
       overflowCount: {
@@ -128,52 +132,58 @@
         default: 'bottom',
       },
     },
-    computed: {
-      right() {
-        return this.$attrs.right !== undefined && this.$attrs.right !== false;
-      },
-      computedCount() {
+    setup(props, { attrs }) {
+      const app = inject('vcsApp') as VcsUiApp;
+      const right = computed(
+        () => attrs.right !== undefined && attrs.right !== false,
+      );
+      const computedCount = computed(() => {
         if (
-          !this.forceOverflow &&
-          this.actions.length === this.overflowCount + 1
+          !props.forceOverflow &&
+          props.actions.length === props.overflowCount + 1
         ) {
-          return this.actions.length;
+          return props.actions.length;
         }
-        return this.overflowCount;
-      },
-      buttons() {
-        const buttons = this.actions
+        return props.overflowCount;
+      });
+      const buttons = computed(() => {
+        const b = props.actions
           .filter((i) => i.icon)
-          .slice(0, this.computedCount);
-        if (this.right) {
-          return buttons.reverse();
-        }
-        return buttons;
-      },
-      overflowButtons() {
-        const buttonsNames = this.buttons.map((i) => i.name);
-        return this.actions
-          .filter((i) => !buttonsNames.includes(i.name))
-          .map((i) => {
-            const { title, ...button } = i;
-            if (
-              title &&
-              jaccardSimilarity(this.$t(i.name), this.$t(title)) > 0.5
-            ) {
-              return button;
-            }
-            return i;
-          });
-      },
-      classes() {
-        const classes = ['d-flex', 'align-center', 'action-btn-wrap'];
-        if (this.right) {
-          classes.push('justify-end');
+          .slice(0, computedCount.value);
+        if (right.value) {
+          return b.reverse();
         }
-        return classes;
-      },
+        return b;
+      });
+
+      return {
+        buttons,
+        overflowButtons: computed(() => {
+          const buttonsNames = buttons.value.map((i) => i.name);
+          return props.actions
+            .filter((i) => !buttonsNames.includes(i.name))
+            .map((i) => {
+              const { title, ...button } = i;
+              if (
+                title &&
+                jaccardSimilarity(app.vueI18n.t(i.name), app.vueI18n.t(title)) >
+                  0.5
+              ) {
+                return button;
+              }
+              return i;
+            });
+        }),
+        classes: computed(() => {
+          const classes = ['d-flex', 'align-center', 'action-btn-wrap'];
+          if (right.value) {
+            classes.push('justify-end');
+          }
+          return classes;
+        }),
+      };
     },
-  };
+  });
 </script>
 <style scoped lang="scss">
   :deep(.v-spacer) {

package/src/components/buttons/VcsActionButtonList.ts.vue.d.ts

@@ -0,0 +1,133 @@
+import { type PropType } from 'vue';
+import { validateActions } from '../lists/VcsActionList.ts.vue';
+import type { VcsAction } from '../../actions/actionHelper.js';
+/**
+ * @description
+ * A component rendering a list of actions with overflow mechanic using
+ * For overflow buttons the title is only rendered, if it differs significantly from the action's name.
+ * {@link VcsButton} and {@link VcsActionList}.
+ * @vue-prop {Array<VcsAction>} actions - Array of actions
+ * @vue-prop {string} [button='VcsButton'] - used button type (one of 'VcsButton', 'VcsToolButton' or 'VcsFormButton)
+ * @vue-prop {number} [overflowCount=2] - number of buttons rendered until overflow.
+ * @vue-prop {string} [overflowIcon='$vcsKebab'] - optional custom icon for overflow button
+ * @vue-prop {boolean} [blockOverflow=false] - if space for the overflow should be blocked or not (e.g. when rendering lists in a grid)
+ * @vue-prop {boolean} [forceOverflow=true] - if there is only one overflow button, this button can be rendered instead of the overflow button by setting this option to false
+ * @vue-prop {boolean} [disabled=false] - disable all actions
+ * @vue-prop {('bottom' | 'left' | 'top' | 'right')}  tooltipPosition - Position of the tooltip.
+ * @vue-computed {Array<VcsAction>} buttons - buttons rendered directly, have to provide an icon
+ * @vue-computed {Array<VcsAction>} overflowButtons - rest of buttons rendered in overflow
+ */
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue", { with: { "resolution-mode": "import" } }).DefineComponent<{
+    actions: {
+        type: PropType<VcsAction[]>;
+        required: true;
+        validator: typeof validateActions;
+    };
+    button: {
+        type: StringConstructor;
+        default: string;
+        validator: (type: string) => boolean;
+    };
+    overflowCount: {
+        type: NumberConstructor;
+        default: number;
+    };
+    overflowIcon: {
+        type: StringConstructor;
+        default: string;
+    };
+    blockOverflow: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    forceOverflow: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    tooltipPosition: {
+        type: StringConstructor;
+        default: string;
+    };
+}, {
+    buttons: import("vue", { with: { "resolution-mode": "import" } }).ComputedRef<VcsAction[]>;
+    overflowButtons: import("vue", { with: { "resolution-mode": "import" } }).ComputedRef<{
+        /**
+         * - reactive and translatable name rendered in overflow
+         */
+        name: string;
+        /**
+         * - icon rendered on the button. If no icon provided, item is rendered in overflow
+         */
+        icon?: string | undefined;
+        /**
+         * - callback function is triggered when the button is clicked
+         */
+        callback: import("../../actions/actionHelper.js", { with: { "resolution-mode": "import" } }).ActionCallback;
+        /**
+         * - optional state of button. If active, button is rendered in primary color
+         */
+        active?: boolean | undefined;
+        /**
+         * - optional hasUpdate of button. If true, a yellow notification is rendered next to the button
+         */
+        hasUpdate?: boolean | undefined;
+        /**
+         * - optional background state. If active and background, button is rendered in primary color outlined
+         */
+        background?: boolean | undefined;
+        /**
+         * - optional flag to indicate that the action is disabled
+         */
+        disabled?: boolean | undefined;
+    }[]>;
+    classes: import("vue", { with: { "resolution-mode": "import" } }).ComputedRef<string[]>;
+}, unknown, {}, {}, import("vue", { with: { "resolution-mode": "import" } }).ComponentOptionsMixin, import("vue", { with: { "resolution-mode": "import" } }).ComponentOptionsMixin, {}, string, import("vue", { with: { "resolution-mode": "import" } }).PublicProps, Readonly<import("vue", { with: { "resolution-mode": "import" } }).ExtractPropTypes<{
+    actions: {
+        type: PropType<VcsAction[]>;
+        required: true;
+        validator: typeof validateActions;
+    };
+    button: {
+        type: StringConstructor;
+        default: string;
+        validator: (type: string) => boolean;
+    };
+    overflowCount: {
+        type: NumberConstructor;
+        default: number;
+    };
+    overflowIcon: {
+        type: StringConstructor;
+        default: string;
+    };
+    blockOverflow: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    forceOverflow: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    tooltipPosition: {
+        type: StringConstructor;
+        default: string;
+    };
+}>>, {
+    button: string;
+    disabled: boolean;
+    tooltipPosition: string;
+    overflowCount: number;
+    overflowIcon: string;
+    blockOverflow: boolean;
+    forceOverflow: boolean;
+}, {}>;