{"version":3,"file":"IframeLoader-CFp5poTT.js","sources":["../../../app/javascript/shared/components/ArticleSkeletonLoader.vue","../../../app/javascript/shared/components/IframeLoader.vue"],"sourcesContent":["<template>\n  <div class=\"p-4 space-y-6 bg-white dark:bg-slate-900\">\n    <div class=\"space-y-2 animate-loader-pulse\">\n      <div class=\"h-6 bg-slate-100 dark:bg-slate-700 rounded w-1/5\" />\n      <div class=\"h-10 bg-slate-100 dark:bg-slate-700 rounded w-3/5\" />\n    </div>\n    <div class=\"space-y-2 animate-loader-pulse\">\n      <div class=\"h-5 bg-slate-100 dark:bg-slate-700 rounded\" />\n      <div class=\"h-5 bg-slate-100 dark:bg-slate-700 rounded\" />\n      <div class=\"h-5 bg-slate-100 dark:bg-slate-700 rounded\" />\n      <div class=\"h-5 bg-slate-100 dark:bg-slate-700 rounded w-4/5\" />\n    </div>\n    <div class=\"space-y-2 animate-loader-pulse\">\n      <div class=\"h-5 bg-slate-100 dark:bg-slate-700 rounded\" />\n      <div class=\"h-5 bg-slate-100 dark:bg-slate-700 rounded\" />\n      <div class=\"h-5 bg-slate-100 dark:bg-slate-700 rounded w-3/5\" />\n      <div class=\"h-5 bg-slate-100 dark:bg-slate-700 rounded\" />\n    </div>\n    <div class=\"space-y-2 animate-loader-pulse\">\n      <div class=\"h-5 bg-slate-100 dark:bg-slate-700 rounded\" />\n      <div class=\"h-5 bg-slate-100 dark:bg-slate-700 rounded\" />\n      <div class=\"h-5 bg-slate-100 dark:bg-slate-700 rounded\" />\n      <div class=\"h-5 bg-slate-100 dark:bg-slate-700 rounded w-3/5\" />\n    </div>\n  </div>\n</template>\n","<script>\nimport ArticleSkeletonLoader from 'shared/components/ArticleSkeletonLoader.vue';\n\nexport default {\n  name: 'IframeLoader',\n  components: {\n    ArticleSkeletonLoader,\n  },\n  props: {\n    url: {\n      type: String,\n      default: '',\n    },\n  },\n  data() {\n    return {\n      isLoading: true,\n      showEmptyState: !this.url,\n    };\n  },\n  methods: {\n    handleIframeLoad() {\n      // Once loaded, the loading state is hidden\n      this.isLoading = false;\n    },\n    handleIframeError() {\n      // Hide the loading state and show the empty state when an error occurs\n      this.isLoading = false;\n      this.showEmptyState = true;\n    },\n  },\n};\n</script>\n\n<template>\n  <div class=\"relative overflow-hidden pb-1/2 h-full\">\n    <iframe\n      v-if=\"url\"\n      :src=\"url\"\n      class=\"absolute w-full h-full top-0 left-0\"\n      @load=\"handleIframeLoad\"\n      @error=\"handleIframeError\"\n    />\n    <ArticleSkeletonLoader\n      v-if=\"isLoading\"\n      class=\"absolute w-full h-full top-0 left-0\"\n    />\n    <div\n      v-if=\"showEmptyState\"\n      class=\"absolute w-full h-full top-0 left-0 flex justify-center items-center\"\n    >\n      <p>{{ $t('PORTAL.IFRAME_ERROR') }}</p>\n    </div>\n  </div>\n</template>\n"],"names":["_sfc_render","_ctx","_cache","_openBlock","_createElementBlock","_hoisted_1","_sfc_main","ArticleSkeletonLoader","_hoisted_2","$props","$options","args","_createCommentVNode","$data","_createBlock","_component_ArticleSkeletonLoader","_hoisted_3","_createElementVNode"],"mappings":"qLACE,SAAAA,EAAAC,EAAAC,EAAA,CADF,OAAAC,EAAA,EAAAC,EAAA,MAAAC,EAAAH,EAAA,CAAA,IAAAA,EAAA,CAAA,EAAA,mnCCGKI,EAAU,CACb,KAAM,eACN,WAAY,CACV,sBAAAC,CACD,EACD,MAAO,CACL,IAAK,CACH,KAAM,OACN,QAAS,EACV,CACF,EACD,MAAO,CACL,MAAO,CACL,UAAW,GACX,eAAgB,CAAC,KAAK,IAEzB,EACD,QAAS,CACP,kBAAmB,CAEjB,KAAK,UAAY,EAClB,EACD,mBAAoB,CAElB,KAAK,UAAY,GACjB,KAAK,eAAiB,EACvB,CACF,CACH,EAIOF,EAAA,CAAA,MAAM,wCAAwC,EAnCrDG,EAAA,CAAA,KAAA,KAAA,IAAA,EAiDM,MAAM,mIAdV,OAAAL,EAAA,EAAAC,EAkBM,MAlBNC,EAkBM,CAhBII,EAAG,SADXL,EAME,SAAA,CA1CN,IAAA,EAsCO,IAAKK,EAAG,IACT,MAAM,sCACL,2BAAMC,EAAgB,kBAAAA,EAAA,iBAAA,GAAAC,CAAA,GACtB,4BAAOD,EAAiB,mBAAAA,EAAA,kBAAA,GAAAC,CAAA,EAzC/B,EAAA,KAAA,GAAAH,CAAA,GAAAI,EAAA,GAAA,EAAA,EA4CYC,EAAS,eADjBC,EAGEC,EAAA,CA9CN,IAAA,EA6CM,MAAM,yCA7CZH,EAAA,GAAA,EAAA,EAgDYC,EAAc,gBADtBV,IAAAC,EAKM,MALNY,EAKM,CADJC,EAAsC,WAAhChB,EAAE,GAAA,qBAAA,CAAA,EAAA,CAAA,KAnDdW,EAAA,GAAA,EAAA"}