@vcmap/ui 6.3.0-rc.1 → 6.3.0-rc.2

package/dist/assets/ui.js

@@ -1 +1 @@
-export * from "./ui-94adeedc.js";
+export * from "./ui-e61976d4.js";

package/dist/assets/vue.js

@@ -1 +1 @@
-export * from "./vue-225a7b37.js";
+export * from "./vue-f6136dc6.js";

package/dist/assets/{vuetify-2f71239e.js → vuetify-de6f6eb0.js}

@@ -10,7 +10,7 @@ function loadCss(href) {
     elem.onerror = reject;
     document.head.appendChild(elem);
   });
-} await loadCss('./assets/vuetify-2f71239e.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-225a7b37.js";
+} await loadCss('./assets/vuetify-de6f6eb0.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-f6136dc6.js";
 function rt(e, n) {
   let t;
   function a() {

package/dist/assets/vuetify.js

@@ -1 +1 @@
-export * from "./vuetify-2f71239e.js";
+export * from "./vuetify-de6f6eb0.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.3.0-rc.1",
+  "version": "6.3.0-rc.2",
   "author": "Virtual City Systems",
   "license": "MIT",
   "scripts": {

package/plugins/@vcmap-show-case/panel-tester/src/TextPanelExample.vue

@@ -3,7 +3,7 @@
     <h1>{{ $attrs['panel-state'].location }}</h1>
     <p>{{ $attrs['panel-state'].id }}</p>
     <div class="d-flex flex-column overflow-hidden w-full h-full pa-1">
-      <p>
+      <p v-for="a in [...Array(5).keys()]" :key="a">
         Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy
         eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam
         voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet

package/plugins/package.json

@@ -9,9 +9,9 @@
     "@vcmap/swipe-tool": "^4.0.0",
     "@vcmap/export": "^2.0.0",
     "@vcmap/viewshed": "^3.0.0",
-    "@vcmap/measurement": "^4.0.0",
+    "@vcmap/measurement": "^5.0.0",
     "@vcmap/multi-view": "^3.0.0",
-    "@vcmap/draw": "^4.0.0",
+    "@vcmap/draw": "^5.0.0",
     "@vcmap/shadow": "^3.0.0",
     "@vcmap/search-wfs": "^2.0.0",
     "@vcmap/search-esri": "^2.0.0",
@@ -31,7 +31,8 @@
     "@vcmap/cesium-inspector": "^2.0.0",
     "@vcmap/event-control": "^1.0.1",
     "@vcmap/dynamic-layer": "^1.0.0",
-    "@vcmap/geofence": "^1.0.2"
+    "@vcmap/geofence": "^1.0.2",
+    "@vcmap/panorama": "^1.0.0"
   },
   "optionalDependencies": {
     "@vcmap/planning": "^7.0.0"

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/application/VcsApp.vue

@@ -28,6 +28,12 @@
         :text-page="dataProtection"
         :window-id="'dataProtectionWindow'"
       />
+      <VcsTextPageFooter
+        v-for="(info, idx) in footerInformation"
+        :key="idx"
+        :text-page="info"
+        :window-id="'footerInfoWindow_' + idx"
+      />
       <v-spacer />
       <VcsAttributionsFooter
         :entries="attributionEntries"
@@ -89,7 +95,11 @@
   import VcsAttributions from './VcsAttributions.vue';
   import { getAttributions } from './attributionsHelper.js';
   import VcsPositionDisplay from './VcsPositionDisplay.vue';
-  import { getDataProtection, getImprint } from './uiConfigHelper.js';
+  import {
+    getDataProtection,
+    getImprint,
+    getFooterInformation,
+  } from './uiConfigHelper.js';
   import VcsPanoramaFooter from './VcsPanoramaFooter.vue';
 
   /**
@@ -888,6 +898,7 @@
         footerHeight,
         imprint: getImprint(app.uiConfig.config),
         dataProtection: getDataProtection(app.uiConfig.config),
+        footerInformation: getFooterInformation(app.uiConfig.config),
         showSplashScreen,
         splashScreen,
         attributionEntries,

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

@@ -184,6 +184,29 @@ declare const _default: import("vue").DefineComponent<{
             } | undefined;
             readonly content?: string | undefined;
         } | undefined;
+        /**
+         * - optionnal, additional information to show in the footer as links or dialogs
+         */
+        readonly footerInformation?: readonly {
+            readonly title?: string | undefined;
+            readonly url?: string | {
+                readonly hash: string;
+                readonly host: string;
+                readonly hostname: string;
+                readonly href: string;
+                readonly toString: () => string;
+                readonly origin: string;
+                readonly password: string;
+                readonly pathname: string;
+                readonly port: string;
+                readonly protocol: string;
+                readonly search: string;
+                readonly searchParams: ReadonlyMap<string, string | null>;
+                readonly username: string;
+                readonly toJSON: () => string;
+            } | undefined;
+            readonly content?: string | undefined;
+        }[] | undefined;
         /**
          * - an option splashScreen, will show a splash Screen on Map Load.
          */
@@ -297,6 +320,10 @@ declare const _default: import("vue").DefineComponent<{
          * - can be used to hide the integrated Search bar
          */
         readonly hideSearch?: boolean | undefined;
+        /**
+         * - can be used to set the pitch angle of the viewpoint of features zoomed to from Search, in degrees. Defaults to -35 degrees.
+         */
+        readonly searchViewpointPitch?: number | undefined;
         /**
          * - can be used to hide the sharee button
          */
@@ -345,6 +372,10 @@ declare const _default: import("vue").DefineComponent<{
          * - can be used to hide the oblique name in the footer
          */
         readonly hideObliqueFooter?: boolean | undefined;
+        /**
+         * - can be used to hide the panorama name in the footer
+         */
+        readonly hidePanoramaFooter?: boolean | undefined;
         /**
          * - can be used to activate the overviewMap on startup
          */
@@ -411,6 +442,7 @@ declare const _default: import("vue").DefineComponent<{
     footerHeight: import("vue").ComputedRef<number>;
     imprint: import("vue").ComputedRef<import("../uiConfig.js", { with: { "resolution-mode": "import" } }).TextPageType | undefined>;
     dataProtection: import("vue").ComputedRef<import("../uiConfig.js", { with: { "resolution-mode": "import" } }).TextPageType | undefined>;
+    footerInformation: import("vue").ComputedRef<import("../uiConfig.js", { with: { "resolution-mode": "import" } }).TextPageType[] | undefined>;
     showSplashScreen: import("vue").Ref<boolean>;
     splashScreen: import("vue").ShallowRef<{
         title: string;

package/src/application/VcsAttributions.vue

@@ -11,7 +11,11 @@
           v-for="attribution in attributions"
           :key="attribution.provider"
           :title="`${$st(attribution.provider)} ${attribution.year}`"
+          class="d-inline-flex align-end"
         >
+          <v-icon v-if="attribution.icon" class="mr-2 attribution-icon">
+            {{ attribution.icon }}
+          </v-icon>
           <a :href="attribution.url ? attribution.url : null" target="_blank">
             {{ $st(attribution.provider) }} {{ attribution.year }}
           </a>
@@ -26,6 +30,7 @@
 
 <script>
   import {
+    VIcon,
     VList,
     VListItem,
     VListItemTitle,
@@ -40,6 +45,7 @@
   export default {
     name: 'VcsAttributions',
     components: {
+      VIcon,
       VList,
       VListItem,
       VListItemTitle,
@@ -65,4 +71,7 @@
       content: '\00a9';
     }
   }
+  .attribution-icon {
+    max-width: 30px;
+  }
 </style>

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

@@ -12,6 +12,7 @@ declare const _default: import("vue").DefineComponent<{
         provider: string;
         years: string;
         url: string;
+        icon?: string | undefined;
     }[]>;
 }, any, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     entries: {

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

@@ -96,6 +96,29 @@ declare const _default: import("vue").DefineComponent<{
             } | undefined;
             readonly content?: string | undefined;
         } | undefined;
+        /**
+         * - optionnal, additional information to show in the footer as links or dialogs
+         */
+        readonly footerInformation?: readonly {
+            readonly title?: string | undefined;
+            readonly url?: string | {
+                readonly hash: string;
+                readonly host: string;
+                readonly hostname: string;
+                readonly href: string;
+                readonly toString: () => string;
+                readonly origin: string;
+                readonly password: string;
+                readonly pathname: string;
+                readonly port: string;
+                readonly protocol: string;
+                readonly search: string;
+                readonly searchParams: ReadonlyMap<string, string | null>;
+                readonly username: string;
+                readonly toJSON: () => string;
+            } | undefined;
+            readonly content?: string | undefined;
+        }[] | undefined;
         /**
          * - an option splashScreen, will show a splash Screen on Map Load.
          */
@@ -209,6 +232,10 @@ declare const _default: import("vue").DefineComponent<{
          * - can be used to hide the integrated Search bar
          */
         readonly hideSearch?: boolean | undefined;
+        /**
+         * - can be used to set the pitch angle of the viewpoint of features zoomed to from Search, in degrees. Defaults to -35 degrees.
+         */
+        readonly searchViewpointPitch?: number | undefined;
         /**
          * - can be used to hide the sharee button
          */
@@ -257,6 +284,10 @@ declare const _default: import("vue").DefineComponent<{
          * - can be used to hide the oblique name in the footer
          */
         readonly hideObliqueFooter?: boolean | undefined;
+        /**
+         * - can be used to hide the panorama name in the footer
+         */
+        readonly hidePanoramaFooter?: boolean | undefined;
         /**
          * - can be used to activate the overviewMap on startup
          */

package/src/application/VcsMobileMenuList.vue

@@ -7,7 +7,11 @@
     getActionsByLocation,
   } from '../manager/navbarManager.js';
   import VcsTextPageFooter from './VcsTextPageFooter.vue';
-  import { getDataProtection, getImprint } from './uiConfigHelper.js';
+  import {
+    getDataProtection,
+    getImprint,
+    getFooterInformation,
+  } from './uiConfigHelper.js';
   import { toolboxComponentId } from '../manager/toolbox/ToolboxManagerComponent.vue';
 
   const app = inject('vcsApp');
@@ -55,6 +59,7 @@
 
   const dataProtection = getDataProtection(app.uiConfig?.config);
   const imprint = getImprint(app.uiConfig?.config);
+  const footerInformation = getFooterInformation(app.uiConfig?.config);
 </script>
 
 <template>
@@ -88,6 +93,16 @@
         />
       </v-list-item>
     </template>
+    <template v-for="(info, idx) in footerInformation" :key="idx">
+      <v-divider></v-divider>
+      <v-list-item v-if="info">
+        <VcsTextPageFooter
+          class="plainStyle"
+          :text-page="info"
+          :window-id="'footerInfoWindow_' + idx"
+        />
+      </v-list-item>
+    </template>
   </v-list>
 </template>
 

package/src/application/VcsObliqueFooter.vue

@@ -1,10 +1,9 @@
 <template>
-  <!-- eslint-disable vue/no-v-html -->
-  <span
-    v-if="content"
-    class="d-flex align-center overflow-hidden vcs-oblique-footer"
-    v-html="content"
-  />
+  <span v-if="content" class="vcs-oblique-footer">
+    <!-- eslint-disable vue/no-v-html -->
+    <span class="overflow-hidden" v-html="content" />
+    <div v-if="hasLinks" class="ml-1">|</div>
+  </span>
 </template>
 
 <script>
@@ -85,6 +84,13 @@
         mapChangedListener();
       });
 
+      const hasLinks = computed(
+        () =>
+          !!app.uiConfig.config?.dataProtection ||
+          !!app.uiConfig.config?.imprint ||
+          app.uiConfig.config?.footerInformation?.length > 0,
+      );
+
       const content = computed(() => {
         if (!app.uiConfig.config.hideObliqueFooter && currentImage.value) {
           const template =
@@ -102,6 +108,7 @@
 
       return {
         content,
+        hasLinks,
       };
     },
   };
@@ -109,8 +116,14 @@
 
 <style lang="scss" scoped>
   .vcs-oblique-footer {
+    display: flex;
+    align-items: center;
+    > div {
+      font-size: smaller;
+    }
     :deep(p) {
       font-size: smaller;
+      display: inline;
       margin: 0;
     }
   }

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

@@ -1,4 +1,5 @@
 declare const _default: import("vue").DefineComponent<{}, {
     content: import("vue").ComputedRef<string | null>;
+    hasLinks: import("vue").ComputedRef<boolean>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
 export default _default;

package/src/application/VcsPanoramaFooter.vue

@@ -1,10 +1,21 @@
 <script setup>
-  import { ref, inject, onUnmounted } from 'vue';
+  import { ref, inject, onUnmounted, computed } from 'vue';
   import { PanoramaMap } from '@vcmap/core';
 
+  /** @type {import('../vcsUiApp').default} */
   const app = inject('vcsApp');
   const name = ref();
   const time = ref();
+  const hasLinks = computed(
+    () =>
+      !!app.uiConfig.config?.dataProtection ||
+      !!app.uiConfig.config?.imprint ||
+      app.uiConfig.config?.footerInformation?.length > 0,
+  );
+
+  const showPanoramaFooter = computed(
+    () => !app.uiConfig.config.hidePanoramaFooter,
+  );
 
   let imageChangedListener = () => {};
   const setImage = (image) => {
@@ -42,11 +53,20 @@
 </script>
 
 <template>
-  <span
-    v-if="name && time"
-    class="d-flex align-center overflow-hidden vcs-panorama-footer"
-    >{{ time }} - {{ name }}
+  <span v-if="showPanoramaFooter && name && time" class="vcs-panorama-footer">
+    <span class="overflow-hidden"> {{ time }} - {{ name }} </span>
+    <span v-if="hasLinks" class="ml-1">|</span>
   </span>
 </template>
 
-<style scoped lang="scss"></style>
+<style scoped lang="scss">
+  .vcs-panorama-footer {
+    display: flex;
+    align-items: center;
+    & > span {
+      display: inline-flex;
+      font-size: smaller;
+      align-items: center;
+    }
+  }
+</style>

package/src/application/VcsTextPageFooter.vue

@@ -85,8 +85,12 @@
 <style lang="scss" scoped>
   .text-page-footer {
     font-size: smaller;
+    display: flex;
+    align-items: center;
     a {
       color: var(--v-text-color);
+      display: flex;
+      align-items: center;
     }
   }
 </style>

package/src/application/attributionsHelper.d.ts

@@ -3,6 +3,7 @@
  * @property {string} provider - name of the data provider
  * @property {number} [year] - year of dataset
  * @property {string} url - link to data provider
+ * @property {string} [icon] - provider logo
  */
 /**
  * @typedef {Object} AttributionEntry
@@ -13,12 +14,13 @@
 /**
  * merges attribution entries of same providers
  * @param {Array<AttributionEntry>} entries
- * @returns {Array<{provider: string, years: string, url: string}>}
+ * @returns {Array<{provider: string, years: string, url: string, icon?:string}>}
  */
 export function mergeAttributions(entries: Array<AttributionEntry>): Array<{
     provider: string;
     years: string;
     url: string;
+    icon?: string;
 }>;
 /**
  * Gets attributions of all active maps, layers and oblique collections and returns an array of entries.
@@ -45,6 +47,10 @@ export type AttributionOptions = {
      * - link to data provider
      */
     url: string;
+    /**
+     * - provider logo
+     */
+    icon?: string | undefined;
 };
 export type AttributionEntry = {
     /**

package/src/application/attributionsHelper.js

@@ -6,6 +6,7 @@ import { ObliqueMap } from '@vcmap/core';
  * @property {string} provider - name of the data provider
  * @property {number} [year] - year of dataset
  * @property {string} url - link to data provider
+ * @property {string} [icon] - provider logo
  */
 
 /**
@@ -18,12 +19,12 @@ import { ObliqueMap } from '@vcmap/core';
 /**
  * merges attribution entries of same providers
  * @param {Array<AttributionEntry>} entries
- * @returns {Array<{provider: string, years: string, url: string}>}
+ * @returns {Array<{provider: string, years: string, url: string, icon?:string}>}
  */
 export function mergeAttributions(entries) {
   const providers = {};
   entries.forEach(({ attributions }) => {
-    attributions.forEach(({ provider, year, url }) => {
+    attributions.forEach(({ provider, year, url, icon }) => {
       const providerObject = providers[provider];
       if (providerObject) {
         if (year) {
@@ -36,12 +37,16 @@ export function mergeAttributions(entries) {
               const set = new Set([...providerObject.years, Number(year)]);
               providerObject.years = [...set].sort((a, b) => a - b);
             }
+            if (icon && !providerObject.icon) {
+              providerObject.icon = icon;
+            }
           }
         }
       } else {
         providers[provider] = {
           years: year ? [Number(year)] : [],
           url,
+          ...(icon && { icon }),
         };
       }
     });

package/src/application/uiConfigHelper.d.ts

@@ -10,6 +10,12 @@ export function getDataProtection(uiConfig: import("../uiConfig.js").UiConfigObj
  * @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>;
+/**
+ * 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>;
 /**
  * Creates a computed property for mobile logo.
  * @param {import("../vcsUiApp.js").default} app - The VcsUiApp.

package/src/application/uiConfigHelper.js

@@ -1,3 +1,4 @@
+import { getLogger } from '@vcsuite/logger';
 import { computed } from 'vue';
 
 /**
@@ -35,6 +36,33 @@ export function getImprint(uiConfig) {
     return 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) {
+  return computed(() => {
+    if (uiConfig?.footerInformation) {
+      return uiConfig.footerInformation
+        .filter((info) => {
+          if (!info.title && !info.url) {
+            getLogger('uiConfigHelper').warn(
+              'Footer information item skipped, missing title or url',
+              info,
+            );
+            return false;
+          }
+          return true;
+        })
+        .map((info) => ({
+          title: info.title || new URL(info.url, window.location.href).hostname,
+          ...info,
+        }));
+    }
+    return undefined;
+  });
+}
 
 /**
  * Creates a computed property for mobile logo.