{"version":3,"file":"BnoAlhwk.js","sources":["../../../../components/modules/JiraFeedback.vue","../../../../components/layout/ProfileMenuItem.vue","../../../../virtual:public?%2Ficons%2Fchevron-right-24px-black.svg","../../../../components/layout/TheProfileMenu.vue","../../../../virtual:public?%2Ficons%2Fhelp-24px-white.svg","../../../../components/layout/TheHeader.vue","../../../../node_modules/nuxt/dist/app/components/client-only.js","../../../../components/basic/BasicNavItem.vue","../../../../components/basic/BasicNestedNavItem.vue","../../../../components/layout/TheNavigation.vue","../../../../layouts/default.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  // Quick fix to load script; when using useHead and switching layouts it will not load the script anymore\n  onMounted(() => {\n    let divScripts = document.getElementById('load-script')\n    let newScript = document.createElement('script')\n    newScript.src =\n      'https://xuntos.atlassian.net/s/d41d8cd98f00b204e9800998ecf8427e-T/-vg1gsr/b/8/c95134bc67d3a521bb3f4331beb9b804/_/download/batch/com.atlassian.jira.collector.plugin.jira-issue-collector-plugin:issuecollector/com.atlassian.jira.collector.plugin.jira-issue-collector-plugin:issuecollector.js?locale=en-US&collectorId=eef0ad55'\n    divScripts.appendChild(newScript)\n  })\n\n  window.ATL_JQ_PAGE_PROPS = {\n    triggerFunction: (showCollectorDialog) => {\n      document.querySelectorAll('.jira-feedback-button').forEach((e) => {\n        e.onclick = (e) => {\n          e.preventDefault()\n          showCollectorDialog()\n        }\n      })\n    },\n  }\n</script>\n\n<template>\n  <div id=\"load-script\"></div>\n  <BasicBtn\n    driver-id=\"feedback-button\"\n    class=\"jira-feedback-button flex-shrink-0 bg-[#6ab7e7] text-white hover:bg-[#6ab7e7]/80 hover:text-white/80 active:bg-[#6ab7e7]/60 active:text-white/60 focus:text-white/60\"\n    color=\"textual-borderless\"\n    size=\"regular\"\n  >\n    <template #prepend-icon>\n      <Icon name=\"ic:outline-chat\" class=\"size-5\" />\n    </template>\n    Feedback\n  </BasicBtn>\n</template>\n\n<style scoped>\n  #load-script {\n    display: none;\n  }\n</style>\n","<script setup lang=\"ts\">\n  const props = defineProps<{\n    label: string\n    icon?: string\n    active?: boolean\n    radio?: boolean\n  }>()\n\n  const emit = defineEmits<{\n    (e: 'click'): void\n  }>()\n\n  const { t } = useI18n()\n</script>\n\n<template>\n  <button\n    type=\"button\"\n    @click.stop=\"emit('click')\"\n    class=\"p-4 text-left flex flex-row items-center hover:bg-gray-100 transition-all duration-300 font-bold w-full disabled:text-primary disabled:hover:bg-gray-100 focus:ring-4 focus:outline-none focus:ring-focused duration-250\"\n  >\n    <span\n      v-if=\"active && radio\"\n      class=\"mr-4 min-w-6 w-6 h-6 border-gray-200 border-[6px] bg-primary rounded-full\"\n    >\n    </span>\n    <span\n      v-else-if=\"!active && radio\"\n      class=\"mr-4 min-w-6 w-6 h-6 bg-gray-200 border-[6px] rounded-full\"\n    >\n    </span>\n    <slot name=\"prefix\" />\n    <span v-if=\"icon\">\n      <Icon v-if=\"icon.startsWith('ic:')\" :name=\"icon\" class=\"mr-2 size-6\" />\n      <img v-else :src=\"`/icons/${props.icon}.svg`\" class=\"w-6 h-6 mr-2\" alt=\"\" />\n    </span>\n    <span>\n      {{ t(props.label) }}\n    </span>\n    <slot />\n  </button>\n</template>\n\n<style scoped></style>\n","import { publicAssetsURL } from '#internal/nuxt/paths';export default publicAssetsURL(\"/icons/chevron-right-24px-black.svg\")","<script setup lang=\"ts\">\n  import { AuthRole } from '~/utils/auth'\n\n  const open = ref(false)\n  const props = defineProps<{\n    environment: 'portal' | 'management'\n  }>()\n\n  const subMenuOpen = ref(false)\n  const { locale, setLocale, t } = useI18n()\n\n  const toggleMenu = () => {\n    if (open.value) {\n      open.value = false\n      subMenuOpen.value = false\n    } else {\n      open.value = true\n    }\n  }\n\n  const profileMenu = ref<HTMLElement | null>(null)\n\n  onClickOutside(profileMenu, (evt) => {\n    if (open.value) {\n      open.value = false\n      subMenuOpen.value = false\n    }\n  })\n\n  const authStore = useAuthStore()\n\n  const initials = computed(() => {\n    return authStore?.name\n      .match(/(\\b\\S)?/g)\n      .join('')\n      .match(/(^\\S|\\S$)?/g)\n      .join('')\n      .toUpperCase()\n  })\n\n  const buttonUrl = computed(() =>\n    props.environment === 'portal' ? '/hub/dashboard' : '/portal/dashboard',\n  )\n</script>\n\n<template>\n  <div class=\"relative\" ref=\"profileMenu\">\n    <button\n      type=\"button\"\n      class=\"cursor-pointer flex flex-row items-center relative rounded-full focus:ring-4 focus:outline-none focus:ring-focused transition-all duration-250\"\n      @click.stop=\"toggleMenu\"\n    >\n      <span\n        class=\"bg-primary w-8 h-8 text-center font-bold mr-2 text-sm text-white rounded-full justify-center flex items-center\"\n        >{{ initials }}\n      </span>\n      <span class=\"flex flex-col text-sm mr-6\">\n        <span class=\"text-left text-primary font-bold leading-3\">\n          {{ authStore?.name }}\n        </span>\n        <!-- <span class=\"text-left text-gray-400\">GMP+ International</span> -->\n      </span>\n      <img\n        src=\"/icons/chevron-down-primary.svg\"\n        alt=\"\"\n        class=\"w-3 h-3 transform transition-all duration-300\"\n        :class=\"{\n          'rotate-180': open,\n          'rotate-0': !open,\n        }\"\n      />\n    </button>\n\n    <div\n      v-show=\"open && !subMenuOpen\"\n      class=\"absolute mt-4 border right-0 flex flex-col min-w-[200px] divide-y rounded-lg bg-white transition-all\"\n    >\n      <AuthGuard :roles=\"[AuthRole.QRAY_GMP]\">\n        <ProfileMenuItem\n          @click=\"navigateTo(buttonUrl)\"\n          @click.middle=\"navigateTo(buttonUrl, { open: { target: '_blank' } })\"\n          :label=\"`nav.profile.switch.${props.environment === 'portal' ? 'management' : 'portal'}`\"\n          icon=\"env-24px-black\"\n        />\n      </AuthGuard>\n\n      <ProfileMenuItem\n        label=\"nav.profile.language.title\"\n        icon=\"language-24px-black\"\n        @click=\"subMenuOpen = !subMenuOpen\"\n      >\n        <img src=\"/icons/chevron-right-24px-black.svg\" alt=\"\" class=\"w-6 h-6 ml-auto\" />\n      </ProfileMenuItem>\n      <ProfileMenuItem\n        @click=\"navigateTo('/user')\"\n        @click.middle=\"navigateTo('/user', { open: { target: '_blank' } })\"\n        label=\"nav.profile.settings\"\n        icon=\"settings-outline-black\"\n      />\n      <ProfileMenuItem\n        label=\"nav.profile.tou\"\n        icon=\"ic:outline-assignment\"\n        @click=\"navigateTo(t('nav.profile.touLink'), { open: { target: '_blank' } })\"\n      />\n      <ProfileMenuItem\n        label=\"nav.profile.logout\"\n        icon=\"logoff-24px-black\"\n        @click=\"authStore.logout()\"\n      />\n    </div>\n    <div\n      v-if=\"subMenuOpen\"\n      class=\"absolute mt-4 border right-0 flex flex-col w-max min-w-[200px] divide-y rounded-lg bg-white\"\n    >\n      <ProfileMenuItem label=\"nav.profile.language.title\" @click=\"subMenuOpen = false\">\n        <template #prefix>\n          <img src=\"/icons/chevron-right-24px-black.svg\" alt=\"\" class=\"w-6 h-6 mr-2 rotate-180\" />\n        </template>\n      </ProfileMenuItem>\n      <ProfileMenuItem\n        radio\n        label=\"nav.profile.language.en\"\n        @click=\"setLocale('en')\"\n        :active=\"locale == 'en'\"\n      >\n        <template #prefix>\n          <img src=\"/flags/en.svg\" alt=\"\" class=\"w-6 h-6 mr-2\" />\n        </template>\n      </ProfileMenuItem>\n      <ProfileMenuItem\n        radio\n        label=\"nav.profile.language.nl\"\n        @click=\"setLocale('nl')\"\n        :active=\"locale == 'nl'\"\n      >\n        <template #prefix>\n          <img src=\"/flags/nl.svg\" alt=\"\" class=\"w-6 h-6 mr-2\" />\n        </template>\n      </ProfileMenuItem>\n      <ProfileMenuItem\n        radio\n        label=\"nav.profile.language.de\"\n        @click=\"setLocale('de')\"\n        :active=\"locale == 'de'\"\n      >\n        <template #prefix>\n          <img src=\"/flags/de.svg\" alt=\"\" class=\"w-6 h-6 mr-2\" />\n        </template>\n      </ProfileMenuItem>\n    </div>\n  </div>\n</template>\n\n<style scoped></style>\n","import { publicAssetsURL } from '#internal/nuxt/paths';export default publicAssetsURL(\"/icons/help-24px-white.svg\")","<script lang=\"ts\" setup>\n  const props = defineProps<{\n    environment: keyof typeof environments\n  }>()\n\n  const { t } = useI18n()\n\n  const route = useRoute()\n\n  const environments = {\n    portal: { color: 'text-primary', title: '' },\n    management: { color: 'text-affirmative', title: 'Management' },\n    academy: { color: 'text-critical', title: 'Academy' },\n    cms: { color: 'text-black', title: 'CMS' },\n    settings: { color: 'text-black', title: '' },\n  }\n  const openSupportPlatform = () => {\n    window.open('https://www.gmpplus.org/support-platform/', '_support')\n  }\n\n  const selectedEnvironment = computed(() => environments[props.environment])\n</script>\n\n<template>\n  <header class=\"h-20 px-12 border-b border-[#e3e3e3] flex items-center shrink-0 bg-white\">\n    <div id=\"logo\" class=\"flex-shrink-0\">\n      <NuxtLink to=\"/\">\n        <img alt=\"logo\" src=\"/icons/Logo.svg\" />\n      </NuxtLink>\n    </div>\n    <div id=\"env\" class=\"px-12 w-full\">\n      <h3 :class=\"selectedEnvironment.color\" class=\"text-2xl font-bold\">\n        {{ selectedEnvironment.title }}\n      </h3>\n    </div>\n    <div class=\"flex flex-row mr-4 gap-2\">\n      <BasicBtn\n        class=\"flex items-center justify-center gap-1 px-7 py-2s\"\n        size=\"regular\"\n        type=\"submit\"\n        color=\"affirmative\"\n        @click=\"openSupportPlatform()\"\n      >\n        <img :alt=\"t('nav.menu.support')\" src=\"/icons/help-24px-white.svg\" class=\"w-5 h-5\" />\n        {{ t('nav.menu.support') }}\n      </BasicBtn>\n    </div>\n    <div class=\"flex flex-row justify-end mr-4 gap-2\">\n      <JiraFeedback />\n    </div>\n    <div class=\"ml-auto flex-shrink-0\">\n      <TheProfileMenu id=\"profile-menu\" :environment=\"environment\" />\n    </div>\n  </header>\n</template>\n\n<style scoped></style>\n","import { cloneVNode, createElementBlock, defineComponent, getCurrentInstance, h, onMounted, provide, ref } from \"vue\";\nimport { isPromise } from \"@vue/shared\";\nimport { useNuxtApp } from \"../nuxt.js\";\nimport ServerPlaceholder from \"./server-placeholder.js\";\nimport { elToStaticVNode } from \"./utils.js\";\nexport const clientOnlySymbol = Symbol.for(\"nuxt:client-only\");\nconst STATIC_DIV = \"<div></div>\";\nexport default defineComponent({\n  name: \"ClientOnly\",\n  inheritAttrs: false,\n  props: [\"fallback\", \"placeholder\", \"placeholderTag\", \"fallbackTag\"],\n  setup(_, { slots, attrs }) {\n    const mounted = ref(false);\n    onMounted(() => {\n      mounted.value = true;\n    });\n    if (import.meta.dev) {\n      const nuxtApp = useNuxtApp();\n      nuxtApp._isNuxtPageUsed = true;\n      nuxtApp._isNuxtLayoutUsed = true;\n    }\n    provide(clientOnlySymbol, true);\n    return (props) => {\n      if (mounted.value) {\n        return slots.default?.();\n      }\n      const slot = slots.fallback || slots.placeholder;\n      if (slot) {\n        return slot();\n      }\n      const fallbackStr = props.fallback || props.placeholder || \"\";\n      const fallbackTag = props.fallbackTag || props.placeholderTag || \"span\";\n      return createElementBlock(fallbackTag, attrs, fallbackStr);\n    };\n  }\n});\nconst cache = /* @__PURE__ */ new WeakMap();\n// @__NO_SIDE_EFFECTS__\nexport function createClientOnly(component) {\n  if (import.meta.server) {\n    return ServerPlaceholder;\n  }\n  if (cache.has(component)) {\n    return cache.get(component);\n  }\n  const clone = { ...component };\n  if (clone.render) {\n    clone.render = (ctx, cache2, $props, $setup, $data, $options) => {\n      if ($setup.mounted$ ?? ctx.mounted$) {\n        const res = component.render?.bind(ctx)(ctx, cache2, $props, $setup, $data, $options);\n        return res.children === null || typeof res.children === \"string\" ? cloneVNode(res) : h(res);\n      }\n      return elToStaticVNode(ctx._.vnode.el, STATIC_DIV);\n    };\n  } else if (clone.template) {\n    clone.template = `\n      <template v-if=\"mounted$\">${component.template}</template>\n      <template v-else>${STATIC_DIV}</template>\n    `;\n  }\n  clone.setup = (props, ctx) => {\n    const nuxtApp = useNuxtApp();\n    const mounted$ = ref(nuxtApp.isHydrating === false);\n    const instance = getCurrentInstance();\n    if (nuxtApp.isHydrating) {\n      const attrs = { ...instance.attrs };\n      const directives = extractDirectives(instance);\n      for (const key in attrs) {\n        delete instance.attrs[key];\n      }\n      onMounted(() => {\n        Object.assign(instance.attrs, attrs);\n        instance.vnode.dirs = directives;\n      });\n    }\n    onMounted(() => {\n      mounted$.value = true;\n    });\n    const setupState = component.setup?.(props, ctx) || {};\n    if (isPromise(setupState)) {\n      return Promise.resolve(setupState).then((setupState2) => {\n        if (typeof setupState2 !== \"function\") {\n          setupState2 ||= {};\n          setupState2.mounted$ = mounted$;\n          return setupState2;\n        }\n        return (...args) => {\n          if (mounted$.value || !nuxtApp.isHydrating) {\n            const res = setupState2(...args);\n            return res.children === null || typeof res.children === \"string\" ? cloneVNode(res) : h(res);\n          }\n          return elToStaticVNode(instance?.vnode.el, STATIC_DIV);\n        };\n      });\n    } else {\n      if (typeof setupState === \"function\") {\n        return (...args) => {\n          if (mounted$.value) {\n            return h(setupState(...args), ctx.attrs);\n          }\n          return elToStaticVNode(instance?.vnode.el, STATIC_DIV);\n        };\n      }\n      return Object.assign(setupState, { mounted$ });\n    }\n  };\n  cache.set(component, clone);\n  return clone;\n}\nfunction extractDirectives(instance) {\n  if (!instance || !instance.vnode.dirs) {\n    return null;\n  }\n  const directives = instance.vnode.dirs;\n  instance.vnode.dirs = null;\n  return directives;\n}\n","<script setup lang=\"ts\">\n  const props = defineProps<{\n    item: {\n      auth?: string[]\n      name: string\n      path: string\n      icon?: string\n      children?: any[]\n      disabled?: boolean\n      target?: string\n    }\n    to?: string\n    iconOnly?: boolean\n    flip?: boolean\n    selected?: boolean\n  }>()\n\n  const route = useRoute()\n  const { t } = useI18n()\n\n  const isActive = (path: string | object) => {\n    if (typeof path === 'object') {\n      return route.path.startsWith(path.path)\n    }\n    return route.path.startsWith(path)\n  }\n\n  const authStore = useAuthStore()\n</script>\n\n<template>\n  <li v-if=\"authStore.isInRoles(item.auth?.roles ?? [])\">\n    <NuxtLink\n      :to=\"props.item.disabled ? '#' : (props.to ?? props.item.path)\"\n      :target=\"props.item.target\"\n      class=\"m-2 px-2 py-3 rounded text-base flex gap-2\"\n      :class=\"{\n        'cursor-pointer': !props.item.disabled,\n        'bg-primary text-white': isActive(props.item.path),\n        'hover:bg-gray-100 hover:text-black': !isActive(props.item.path),\n        'bg-gray-100 text-black': props.selected,\n        'font-bold': (item.icon && !to) || isActive(props.item.path),\n        ' cursor-not-allowed text-gray-500/60': props.item.disabled,\n      }\"\n    >\n      <Icon\n        v-if=\"props.item.icon\"\n        :name=\"props.item.icon\"\n        class=\"min-w-6 size-6 block\"\n        :class=\"{\n          'rotate-180': props.flip,\n          'text-white': isActive(props.item.path),\n          'text-black': !isActive(props.item.path),\n        }\"\n      />\n      <span\n        class=\"transition-opacity duration-300 whitespace-nowrap text-ellipsis overflow-hidden ... text-nowrap\"\n        :class=\"iconOnly ? 'opacity-0 invisible' : 'opacity-100'\"\n      >\n        {{ t(`nav.menu.${props.item.name}`) }}\n      </span>\n      <Icon\n        v-if=\"props.item.children\"\n        name=\"ic:baseline-chevron-right\"\n        class=\"transition-opacity size-6\"\n        :class=\"{\n          'opacity-0 invisible': iconOnly,\n          'opacity-100': !iconOnly,\n          'text-white': isActive(props.item.path),\n          'text-black': !isActive(props.item.path),\n        }\"\n      />\n    </NuxtLink>\n  </li>\n</template>\n\n<style scoped></style>\n","<script setup lang=\"ts\">\n  const props = defineProps<{\n    item: {\n      name: string\n      icon?: string\n      path: string\n      children?: any[]\n      isClickable?: boolean\n      auth?: string[]\n    }\n    iconOnly?: boolean\n    selected?: boolean\n    hasParent?: boolean\n  }>()\n\n  const route = useRoute()\n  const { t } = useI18n()\n\n  const isActive = (path: string) => {\n    return route.path.startsWith(path)\n  }\n\n  const emits = defineEmits(['clickArrow'])\n\n  const authStore = useAuthStore()\n</script>\n\n<template>\n  <li v-if=\"authStore.isInRoles(item.auth?.roles ?? [])\">\n    <NuxtLink\n      :to=\"props.item.isClickable ? props.item.path : '#'\"\n      class=\"m-2 px-2 py-3 rounded text-base flex gap-2\"\n      :class=\"{\n        'bg-primary text-white': isActive(props.item.path),\n        'hover:bg-gray-100 hover:text-black': !isActive(props.item.path),\n        'bg-gray-100 text-black': props.selected,\n        'font-bold': !props.hasParent,\n        'cursor-pointer': props.item.isClickable,\n      }\"\n    >\n      <Icon\n        v-if=\"props.item.icon\"\n        :name=\"props.item.icon\"\n        class=\"size-6 block min-w-6\"\n        :class=\"{\n          'text-white': isActive(props.item.path),\n          'text-black': !isActive(props.item.path),\n        }\"\n      />\n      <span\n        class=\"transition-opacity duration-300 whitespace-nowrap flex-grow text-ellipsis overflow-hidden ... text-nowrap\"\n        :class=\"iconOnly ? 'opacity-0 invisible' : 'opacity-100'\"\n      >\n        {{ t(`nav.menu.${props.item.name}`) }}\n      </span>\n      <Icon\n        v-if=\"props.item.children\"\n        @click=\"emits('clickArrow')\"\n        name=\"ic:baseline-chevron-right\"\n        class=\"transition-opacity size-6\"\n        :class=\"{\n          'opacity-0 invisible': iconOnly,\n          'opacity-100': !iconOnly,\n          'text-white': isActive(props.item.path),\n          'text-black': !isActive(props.item.path),\n        }\"\n      />\n    </NuxtLink>\n  </li>\n</template>\n\n<style scoped></style>\n","<script setup lang=\"ts\">\n  import BasicNavItem from '../basic/BasicNavItem.vue'\n  import BasicNestedNavItem from '../basic/BasicNestedNavItem.vue'\n  import { get } from 'lodash'\n\n  const { t } = useI18n()\n\n  const props = defineProps<{\n    routes: {\n      name: string\n      path: string\n      icon?: string\n      disabled?: boolean\n      auth?: {\n        roles: string[]\n      }\n      children?: {\n        name: string\n        path: string\n        disabled?: boolean\n        auth?: {\n          roles: string[]\n        }\n        children?: {\n          name: string\n          path: string\n          disabled?: boolean\n          auth?: {\n            roles: string[]\n          }\n        }[]\n      }[]\n    }[]\n  }>()\n\n  const navigationStore = useNavigationStore()\n\n  const selectedIndex = ref([])\n  const manualShowClicked = useLocalStorage('lockNavigation2', () => false)\n  const router = useRouter()\n\n  const selectedIndexPath = computed(() =>\n    selectedIndex.value.flatMap((value, index, array) => {\n      return index < array.length - 1 ? [value, 'children'] : [value]\n    }),\n  )\n  const selectedRoutes = computed(() => selectedParent.value.children)\n  const selectedParent = computed(() => get(props.routes, selectedIndexPath.value))\n\n  watch(props, () => {\n    selectedIndex.value = []\n  })\n\n  const { width } = useWindowSize()\n\n  const hover = ref(false)\n\n  const svgVisible = ref(false)\n\n  const authStore = useAuthStore()\n\n  const toggleSvg = () => {\n    svgVisible.value = true\n\n    setTimeout(() => {\n      svgVisible.value = false\n    }, 500)\n  }\n\n  const navigateToHelpdesk = () => {\n    const helpdeskLink = t('nav.menu.helpdeskLink')\n    navigateTo(helpdeskLink, {\n      open: {\n        target: '_blank',\n      },\n    })\n  }\n\n  watch(\n    () => navigationStore.$state.lockNavigation,\n    () => {\n      toggleSvg()\n    },\n  )\n</script>\n\n<template>\n  <nav\n    class=\"duration-500 border-r flex flex-col items-stretch overflow-y-auto bg-white\"\n    @mouseover=\"hover = true\"\n    @mouseleave=\"hover = false\"\n    :class=\"{\n      'min-w-[345px] max-w-[345px]': navigationStore.lockNavigation || hover,\n      'min-w-[57px] max-w-[57px]': !navigationStore.lockNavigation && !hover,\n      'min-w-[345px] max-w-[345px] absolute z-30 bg-white bottom-0 top-20 shadow-2xl':\n        (width < 1280 && navigationStore.lockNavigation) || (width < 1280 && hover),\n      'min-w-[57px] max-w-[57px] absolute z-30 bg-white bottom-0 top-20':\n        width < 1280 && !navigationStore.lockNavigation && !hover,\n    }\"\n  >\n    <div\n      class=\"px-3 py-2 border-b h-12 transition-all\"\n      :class=\"navigationStore.lockNavigation ? 'flex justify-between' : ''\"\n    >\n      <button\n        driver-id=\"navigation-lock-button\"\n        class=\"rounded-full transition-all border hover:bg-gray-500/10 bg-center bg-[length:20px_20px] w-8 h-8 bg-no-repeat duration-500\"\n        :class=\"{\n          'ml-[calc(345px-32px-24px)] bg-[url(/icons/lock_24px_outlined.svg)]':\n            navigationStore.lockNavigation,\n          'ml-0 bg-[url(/icons/lock_open_24px_outlined.svg)]': !navigationStore.lockNavigation,\n        }\"\n        @click=\"\n          () => {\n            navigationStore.toggleLockNavigation()\n            manualShowClicked = true\n          }\n        \"\n      />\n    </div>\n    <div class=\"flex flex-row flex-grow\">\n      <ul\n        id=\"root-nav\"\n        class=\"transition-all duration-100\"\n        :class=\"selectedIndex.length > 0 ? 'w-[57px] border-r' : 'w-full'\"\n      >\n        <template v-for=\"(route, index) in props.routes\" :key=\"index\">\n          <BasicNavItem\n            :id=\"route.id\"\n            v-if=\"!route.children && route.path\"\n            @click=\"selectedIndex = []\"\n            :item=\"route\"\n            :icon-only=\"(!navigationStore.lockNavigation && !hover) || selectedIndex.length > 0\"\n          />\n          <BasicNestedNavItem\n            :id=\"route.id\"\n            @click=\"\n              () => {\n                selectedIndex = [index]\n              }\n            \"\n            :icon-only=\"(!navigationStore.lockNavigation && !hover) || selectedIndex.length > 0\"\n            v-else-if=\"route.children\"\n            :item=\"route\"\n            :selected=\"selectedIndex[0] == index\"\n          />\n          <BasicNavItem\n            :id=\"route.id\"\n            v-else\n            :item=\"route\"\n            :icon-only=\"(!navigationStore.lockNavigation && !hover) || selectedIndex.length > 0\"\n          />\n        </template>\n      </ul>\n      <ul\n        id=\"nested\"\n        v-if=\"selectedIndex.length > 0\"\n        class=\"w-full overflow-auto max-h-[calc(100vh-8rem)]\"\n      >\n        <BasicNavItem\n          :item=\"{\n            name: selectedIndex.length > 1 ? selectedParent?.name : 'mainMenu',\n            icon: 'ic:baseline-chevron-right',\n          }\"\n          flip\n          @click=\"selectedIndex.pop()\"\n          v-show=\"navigationStore.lockNavigation || hover\"\n        />\n        <template v-for=\"(route, index) in selectedRoutes\" :key=\"index\">\n          <BasicNavItem\n            :item=\"route\"\n            v-if=\"!route.children && route.path\"\n            v-show=\"navigationStore.lockNavigation || hover\"\n          />\n          <BasicNestedNavItem\n            has-parent\n            @click=\"selectedIndex.push(index)\"\n            :item=\"route\"\n            v-else-if=\"route.children\"\n            v-show=\"navigationStore.lockNavigation || hover\"\n          />\n        </template>\n      </ul>\n    </div>\n    <div class=\"block border-t py-4 px-3\">\n      <!--      todo: help icon-->\n      <div\n        driver-id=\"help-button\"\n        class=\"flex justify-center items-center h-8 bg-affirmative rounded-full cursor-pointer\"\n        :class=\"{}\"\n        @click=\"navigateToHelpdesk\"\n      >\n        <img src=\"/icons/help-24px-white.svg\" class=\"w-5 h-5\" />\n        <p\n          v-if=\"navigationStore.lockNavigation || hover\"\n          class=\"opacity-100 transition-opacity text-white ml-2\"\n        >\n          {{ t('nav.menu.helpdesk') }}\n        </p>\n      </div>\n    </div>\n  </nav>\n\n  <ClientOnly>\n    <Teleport to=\"body\">\n      <div\n        class=\"fixed inset-0 flex flex-col items-center justify-center pointer-events-none transition-all ease-in-out duration-500 z-[999] bg-white/30\"\n        :class=\"{\n          'opacity-0': !svgVisible,\n          'opacity-100': svgVisible,\n        }\"\n      >\n        <img\n          :src=\"\n            navigationStore.lockNavigation\n              ? `/icons/lock_24px_outlined.svg`\n              : '/icons/lock_open_24px_outlined.svg'\n          \"\n          class=\"w-20 h-20\"\n        />\n        <p class=\"text-primary-light\">\n          {{ navigationStore.lockNavigation ? 'Locked' : 'Unlocked' }} menu position\n        </p>\n      </div>\n    </Teleport>\n  </ClientOnly>\n</template>\n","<script setup lang=\"ts\">\n  import JiraFeedback from '~/components/modules/JiraFeedback.vue'\n\n  const route = useRoute()\n\n  const mainElement = ref<HTMLElement | null>(null)\n  const { arrivedState } = useScroll(mainElement)\n  const { width } = useWindowSize()\n\n  const navigationStore = useNavigationStore()\n</script>\n\n<template>\n  <div>\n    <TheHeader\n      :environment=\"route.meta.environment ?? 'portal'\"\n      :class=\"{ 'shadow-md': !arrivedState.top }\"\n      class=\"sticky top-0 z-30 transition-shadow\"\n    />\n    <div class=\"flex flex-row\">\n      <TheNavigation :routes=\"navigationStore.items ?? []\" />\n      <main\n        ref=\"mainElement\"\n        class=\"grow flex flex-row overflow-auto h-[calc(100vh-5rem)]\"\n        :class=\"[width < 1280 ? 'ml-14' : '', $slots.utility ? 'mr-64' : '']\"\n      >\n        <div class=\"p-12 h-fit w-full\">\n          <slot />\n        </div>\n        <div\n          v-if=\"$slots.utility\"\n          class=\"bg-[#F5F5F5] border-l fixed right-0 bottom-0 top-20 overflow-y-auto\"\n        >\n          <div class=\"w-64 h-full flex flex-1 flex-col justify-between\">\n            <slot name=\"utility\" />\n          </div>\n        </div>\n      </main>\n    </div>\n  </div>\n</template>\n\n<style scoped></style>\n"],"names":["onMounted","divScripts","newScript","showCollectorDialog","e","props","__props","emit","__emit","t","useI18n","_imports_1","publicAssetsURL","open","ref","subMenuOpen","locale","setLocale","toggleMenu","profileMenu","onClickOutside","evt","authStore","useAuthStore","initials","computed","buttonUrl","_imports_0","useRoute","environments","openSupportPlatform","selectedEnvironment","clientOnlySymbol","__nuxt_component_0","defineComponent","_","slots","attrs","mounted","provide","_a","slot","fallbackStr","fallbackTag","createElementBlock","route","isActive","path","emits","navigationStore","useNavigationStore","selectedIndex","manualShowClicked","useLocalStorage","useRouter","selectedIndexPath","value","index","array","selectedRoutes","selectedParent","get","watch","width","useWindowSize","hover","svgVisible","toggleSvg","navigateToHelpdesk","helpdeskLink","navigateTo","mainElement","arrivedState","useScroll"],"mappings":"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","x_google_ignoreList":[6]}