{"version":3,"file":"Ds6DN8-J.js","sources":["../../../../components/SideNav.vue","../../../../store/dialog.ts","../../../../components/Dialog.vue","../../../../components/LoaderOverlay.vue","../../../../composables/useResize.ts","../../../../components/Main.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useAuthStore } from '@/store/auth';\n\nconst authStore = useAuthStore();\n\nconst isLoggedIn = computed(() => {\n  return authStore.getUser != null;\n});\nconst isAdmin = computed(() => {\n  return authStore.getUser?.isAdmin;\n});\n</script>\n\n<template>\n  <v-list\n    nav\n    class=\"side-nav\"\n  >\n    <v-list-item\n      v-if=\"isLoggedIn\"\n      v-shortkey=\"['meta', '1']\"\n      value=\"pages\"\n      to=\"/pages\"\n      @shortkey=\"go('/pages')\"\n    >\n      <v-icon icon=\"$pages\" />\n    </v-list-item>\n    <v-list-item\n      v-if=\"isLoggedIn\"\n      v-shortkey=\"['meta', '2']\"\n      value=\"templates\"\n      to=\"/templates\"\n      @shortkey=\"go('/templates')\"\n    >\n      <v-icon icon=\"$templates\" />\n    </v-list-item>\n    <v-list-item\n      v-if=\"isLoggedIn\"\n      v-shortkey=\"['meta', '3']\"\n      value=\"public\"\n      to=\"/public\"\n      @shortkey=\"go('/public')\"\n    >\n      <v-icon icon=\"$public\" />\n    </v-list-item>\n    <v-list-item\n      v-shortkey=\"['meta', '4']\"\n      value=\"docs\"\n      to=\"/docs\"\n      @shortkey=\"go('/docs')\"\n    >\n      <v-icon icon=\"$docs\" />\n    </v-list-item>\n    <v-list-item\n      v-if=\"isAdmin && isLoggedIn\"\n      v-shortkey=\"['meta', '5']\"\n      value=\"admin\"\n      to=\"/admin\"\n      @shortkey=\"go('/admin')\"\n    >\n      <v-icon icon=\"$admin\" />\n    </v-list-item>\n\n    <v-spacer />\n\n    <v-list-item\n      v-if=\"isLoggedIn\"\n      v-shortkey=\"['meta', isAdmin ? '6' : '5']\"\n      value=\"settings\"\n      to=\"/settings\"\n      @shortkey=\"go('/settings')\"\n    >\n      <v-icon icon=\"$settings\" />\n    </v-list-item>\n  </v-list>\n</template>\n\n<style lang=\"scss\" local>\n.side-nav {\n  background-color: rgb(var(--v-theme-nav));\n  display: flex;\n  flex-direction: column;\n}\n\n.v-list-item__content {\n  text-align: center;\n}\n\n// .v-navigation-drawer--left {\n//   border-right-width: 0;\n// }\n</style>\n","import { defineStore } from 'pinia';\nimport type { ShallowRef } from 'vue';\n\ninterface Dialog {\n  title: string;\n  message: string;\n  component?: ShallowRef<unknown>;\n  cancel?: () => void;\n  execute: (_arg?: unknown) => void;\n}\n\n// Use options store for better dev tools integration\nexport const useDialogStore = defineStore('Dialog', {\n  state: () => ({\n    $visible: false as boolean,\n    $title: '',\n    $message: '',\n    $component: null as ShallowRef<unknown> | null,\n    $cancel: () => {},\n    $execute: (_arg?: unknown) => {},\n  }),\n\n  getters: {\n    isVisible: (state) => state.$visible,\n    title: (state) => state.$title,\n    message: (state) => state.$message,\n    component: (state) => state.$component,\n  },\n\n  actions: {\n    setVisibility(visible: boolean) {\n      this.$visible = visible;\n    },\n\n    showDialog(dialog: Dialog) {\n      this.$visible = true;\n      this.$title = dialog.title;\n\n      this.$message = dialog.message;\n      this.$execute = dialog.execute;\n\n      if (dialog.component) this.$component = dialog.component;\n      if (dialog.cancel) this.$cancel = dialog.cancel;\n    },\n\n    execute(arg?: unknown) {\n      this.$execute(arg);\n      this.resetState();\n    },\n\n    cancel() {\n      this.$cancel();\n      this.resetState();\n    },\n\n    resetState() {\n      this.$title = '';\n      this.$message = '';\n\n      this.$component = null;\n\n      this.$cancel = () => {};\n      this.$execute = () => {};\n\n      this.$visible = false;\n    },\n  },\n});\n","<script lang=\"ts\" setup>\nimport { useDialogStore } from '@/store/dialog';\nimport { useTheme } from 'vuetify';\n\nconst theme = useTheme();\n\nconst color = computed(() => {\n  return theme.global.name.value === 'dark' ? 'surface' : 'primary';\n});\n\nconst arg = ref();\n\nconst dialogStore = useDialogStore();\n</script>\n\n<template>\n  <v-dialog\n    transition=\"dialog-bottom-transition\"\n    :model-value=\"dialogStore.isVisible\"\n    close-on-back\n    width=\"auto\"\n    @update:model-value=\"dialogStore.setVisibility\"\n  >\n    <template #default>\n      <v-card>\n        <v-toolbar\n          :color=\"color\"\n          :title=\"dialogStore.title\"\n        >\n          <template #prepend>\n            <!-- <v-btn icon> -->\n            <Logo class=\"logo\" />\n            <!-- </v-btn> -->\n          </template>\n        </v-toolbar>\n        <v-card-text>\n          <div class=\"pa-5\">\n            {{ dialogStore.message }}\n          </div>\n        </v-card-text>\n\n        <component\n          :is=\"dialogStore.component\"\n          v-model=\"arg\"\n        />\n\n        <v-card-actions class=\"justify-space-between\">\n          <v-btn\n            variant=\"text\"\n            color=\"primary\"\n            class=\"ml-2\"\n            @click=\"dialogStore.cancel()\"\n          >\n            Annuleren\n          </v-btn>\n          <v-btn\n            variant=\"text\"\n            color=\"primary\"\n            class=\"mr-2\"\n            @click=\"dialogStore.execute(arg)\"\n          >\n            OK\n          </v-btn>\n        </v-card-actions>\n      </v-card>\n    </template>\n  </v-dialog>\n</template>\n\n<style scoped>\n.logo {\n  width: 24px;\n  height: 24px;\n  margin-left: 12px;\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { useLoaderStore } from '@/store/loader';\n\nconst loaderStore = useLoaderStore();\n</script>\n\n<template>\n  <v-overlay\n    :model-value=\"loaderStore.loading\"\n    class=\"align-center justify-center\"\n  >\n    <v-progress-circular\n      :size=\"150\"\n      :width=\"7\"\n      color=\"primary\"\n      indeterminate\n    >\n      <Logo class=\"logo\" />\n    </v-progress-circular>\n  </v-overlay>\n</template>\n\n<style scoped>\n.logo {\n  /* position: absolute; */\n  height: 64px;\n}\n</style>\n","import { onMounted, onUnmounted, ref } from 'vue';\n\nexport function useWindowResize(\n  shrinkHeightBy: number = 0,\n  shrinkWidthBy: number = 0\n) {\n  const height = ref(\n    (window.visualViewport?.height ?? window.innerHeight) - shrinkHeightBy\n  );\n  const width = ref(\n    (window.visualViewport?.width ?? window.innerWidth) - shrinkWidthBy\n  );\n\n  function handler() {\n    height.value =\n      (window.visualViewport?.height ?? window.innerHeight) - shrinkHeightBy;\n    width.value =\n      (window.visualViewport?.width ?? window.innerWidth) - shrinkWidthBy;\n  }\n\n  onMounted(() => window.addEventListener('resize', handler));\n  onUnmounted(() => window.removeEventListener('resize', handler));\n\n  return {\n    height,\n    heightpx: `${height.value}px`,\n    width,\n    widthpx: `${width.value}px`,\n  };\n}\n","<script lang=\"ts\" setup>\nimport { useDisplay, useTheme } from 'vuetify';\n// import { useSnackbarStore, type Snackbar } from '@/store/snackbar';\n\nconst props = withDefaults(\n  defineProps<{\n    panel?: boolean;\n  }>(),\n  {\n    panel: false,\n  }\n);\n\nconst { xs } = useDisplay();\nconst theme = useTheme();\n// const snackbarStore = useSnackbarStore();\nconst { width } = useWindowResize(xs.value ? 64 + 64 : 64 + 32);\n\nconst themeClass = computed(() => {\n  // v-theme--{light,dark}\n  return `v-theme--${theme.global.name.value}`;\n});\n\n// function refresh(_state: Snackbar) {\n//   const { $pwa } = useNuxtApp();\n\n//   if ($pwa) $pwa.updateServiceWorker();\n// }\n\n// onMounted(() => {\n//   const { $pwa } = useNuxtApp();\n\n//   if ($pwa?.needRefresh) {\n//     snackbarStore.showSnackbar({\n//       message: 'Er is een update beschikbaar',\n//       actionName: 'Update',\n//     });\n//   }\n// });\n</script>\n\n<template>\n  <!-- theme class needed for css variables -->\n  <div\n    :class=\"{\n      'main-layout': true,\n      [themeClass]: true,\n      panel: props.panel,\n      'bg-background': true,\n    }\"\n  >\n    <SideNav v-if=\"width > 625\" />\n\n    <slot\n      v-if=\"width > 625\"\n      name=\"panel\"\n    />\n\n    <!-- This slot is used to rended centered page images -->\n    <slot name=\"default\" />\n\n    <NuxtPage />\n\n    <Dialog />\n    <LoaderOverlay />\n    <Snackbar />\n  </div>\n</template>\n\n<style lang=\"scss\" local>\n.main-layout {\n  display: grid;\n  grid-template-columns: 80px 1fr;\n\n  &.panel {\n    grid-template-columns: 80px 1fr 2fr;\n  }\n\n  grid-template-rows: calc(100vh - 64px - 32px);\n  margin-top: 64px;\n  margin-bottom: 32px;\n  gap: 0;\n  height: calc(100vh - 64px - 32px);\n  width: 100vw;\n}\n\n@media (width <= 600px) and (orientation: portrait) {\n  .main-layout {\n    grid-template-columns: 100vw;\n\n    &.panel {\n      grid-template-columns: 100vw;\n    }\n\n    grid-template-rows: calc(100vh - 64px - 64px);\n    margin-bottom: 64px;\n    height: calc(100vh - 64px - 64px);\n  }\n}\n</style>\n"],"names":["authStore","useAuthStore","isLoggedIn","computed","isAdmin","_a","useDialogStore","defineStore","_arg","state","visible","dialog","arg","theme","useTheme","color","ref","dialogStore","loaderStore","useLoaderStore","useWindowResize","shrinkHeightBy","shrinkWidthBy","height","width","_b","handler","onMounted","onUnmounted","props","__props","xs","useDisplay","themeClass"],"mappings":"mzBAGA,MAAMA,EAAYC,IAEZC,EAAaC,EAAS,IACnBH,EAAU,SAAW,IAC7B,EACKI,EAAUD,EAAS,IAAM,OAC7B,OAAOE,EAAAL,EAAU,UAAV,YAAAK,EAAmB,OAAA,CAC3B,itCCEYC,GAAiBC,EAAY,SAAU,CAClD,MAAO,KAAO,CACZ,SAAU,GACV,OAAQ,GACR,SAAU,GACV,WAAY,KACZ,QAAS,IAAM,CAAC,EAChB,SAAWC,GAAmB,CAAC,CAAA,GAGjC,QAAS,CACP,UAAYC,GAAUA,EAAM,SAC5B,MAAQA,GAAUA,EAAM,OACxB,QAAUA,GAAUA,EAAM,SAC1B,UAAYA,GAAUA,EAAM,UAC9B,EAEA,QAAS,CACP,cAAcC,EAAkB,CAC9B,KAAK,SAAWA,CAClB,EAEA,WAAWC,EAAgB,CACzB,KAAK,SAAW,GAChB,KAAK,OAASA,EAAO,MAErB,KAAK,SAAWA,EAAO,QACvB,KAAK,SAAWA,EAAO,QAEnBA,EAAO,YAAW,KAAK,WAAaA,EAAO,WAC3CA,EAAO,SAAQ,KAAK,QAAUA,EAAO,OAC3C,EAEA,QAAQC,EAAe,CACrB,KAAK,SAASA,CAAG,EACjB,KAAK,WAAW,CAClB,EAEA,QAAS,CACP,KAAK,QAAQ,EACb,KAAK,WAAW,CAClB,EAEA,YAAa,CACX,KAAK,OAAS,GACd,KAAK,SAAW,GAEhB,KAAK,WAAa,KAElB,KAAK,QAAU,IAAM,CAAA,EACrB,KAAK,SAAW,IAAM,CAAA,EAEtB,KAAK,SAAW,EAClB,CACF,CACF,CAAC,mDC/DD,MAAMC,EAAQC,IAERC,EAAQZ,EAAS,IACdU,EAAM,OAAO,KAAK,QAAU,OAAS,UAAY,SACzD,EAEKD,EAAMI,IAENC,EAAcX,08BCTpB,MAAMY,EAAcC,ySCDb,SAASC,GACdC,EAAyB,EACzBC,EAAwB,EACxB,SACA,MAAMC,EAASP,KACZX,EAAA,OAAO,iBAAP,YAAAA,EAAuB,SAAU,OAAO,aAAegB,CAAA,EAEpDG,EAAQR,KACXS,EAAA,OAAO,iBAAP,YAAAA,EAAuB,QAAS,OAAO,YAAcH,CAAA,EAGxD,SAASI,GAAU,SACjBH,EAAO,SACJlB,EAAA,OAAO,iBAAP,YAAAA,EAAuB,SAAU,OAAO,aAAegB,EAC1DG,EAAM,SACHC,EAAA,OAAO,iBAAP,YAAAA,EAAuB,QAAS,OAAO,YAAcH,CAC1D,CAEA,OAAAK,EAAU,IAAM,OAAO,iBAAiB,SAAUD,CAAO,CAAC,EAC1DE,EAAY,IAAM,OAAO,oBAAoB,SAAUF,CAAO,CAAC,EAExD,CACL,OAAAH,EACA,SAAU,GAAGA,EAAO,KAAK,KACzB,MAAAC,EACA,QAAS,GAAGA,EAAM,KAAK,IAAA,CAE3B,4ECzBA,MAAMK,EAAQC,EASR,CAAE,GAAAC,GAAOC,IACTnB,EAAQC,IAER,CAAE,MAAAU,GAAUJ,GAAgBW,EAAG,MAAQ,IAAU,EAAO,EAExDE,EAAa9B,EAAS,IAEnB,YAAYU,EAAM,OAAO,KAAK,KAAK,EAC3C"}