@saooti/octopus-sdk 42.2.1 → 42.2.2

package/dist/RadioPage-DkBL81mI.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioPage-DkBL81mI.mjs","names":[],"sources":["../src/components/pages/RadioPage.vue","../src/components/pages/RadioPage.vue"],"sourcesContent":["<template>\n  <section class=\"page-box\">\n    <template v-if=\"loaded && !error && radio\">\n      <PodcastmakerHeader\n        v-if=\"isPodcastmaker\"\n        :page-title=\"t('Radio')\"\n        :img-url=\"radio.imageUrl\"\n      />\n      <div\n        v-if=\"radio\"\n        class=\"d-flex flex-column page-element\"\n        :class=\"isPodcastmaker ? 'page-element-podcastmaker' : ''\"\n      >\n        <section class=\"module-box\">\n          <div class=\"mb-5 description-text\">\n            <RadioImage :radio=\"radio\" />\n            <div class=\"d-flex align-items-center justify-content-between\">\n              <h2>{{ radio.name }}</h2>\n              <ShareAnonymous class=\"d-flex justify-content-end flex-grow-1\" :organisation-id=\"radio.organisationId\"/>\n            </div>\n            <div v-if=\"radio.description\">\n              {{ radio.description }}\n            </div>\n          </div>\n          <RadioCurrently :radio=\"radio\" />\n          <slot v-if=\"editRight\" name=\"edit-box-radio\" :radio=\"radio\" />\n        </section>\n        <ShareSocialsButtons :organisation-id=\"radio.organisationId\" />\n        <RadioPlanning :radio=\"radio\" />\n        <SharePlayerRadio\n          v-if=\"editRight\"\n          :canal=\"radio\"\n          :organisation-id=\"authOrgaId\"\n        />\n      </div>\n    </template>\n    <ClassicLoading\n      :loading-text=\"!loaded ? t('Loading content ...') : undefined\"\n      :error-text=\"error ? t(`Emission doesn't exist`) : undefined\"\n    />\n  </section>\n</template>\n\n<script setup lang=\"ts\">\nimport { useGeneralStore } from \"../../stores/GeneralStore\";\nimport classicApi from \"../../api/classicApi\";\nimport {useSeoTitleUrl} from \"../composable/route/useSeoTitleUrl\";\nimport {useOrgaComputed} from \"../composable/useOrgaComputed\";\nimport {useErrorHandler} from \"../composable/useErrorHandler\";\nimport ClassicLoading from \"../form/ClassicLoading.vue\";\nimport {  defineAsyncComponent, ref, Ref, computed, watch, onBeforeUnmount } from \"vue\";\nimport { AxiosError } from \"axios\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { useAuthStore } from \"../../stores/AuthStore\";\nimport { useI18n } from \"vue-i18n\";\nconst SharePlayerRadio = defineAsyncComponent(\n  () => import(\"../display/sharing/SharePlayerRadio.vue\"),\n);\nconst ShareSocialsButtons = defineAsyncComponent(\n  () => import(\"../display/sharing/ShareSocialsButtons.vue\"),\n);\nconst RadioCurrently = defineAsyncComponent(\n  () => import(\"../display/live/RadioCurrently.vue\"),\n);\nconst RadioImage = defineAsyncComponent(\n  () => import(\"../display/live/RadioImage.vue\"),\n);\nconst RadioPlanning = defineAsyncComponent(\n  () => import(\"../display/live/RadioPlanning.vue\"),\n);\nconst PodcastmakerHeader = defineAsyncComponent(\n  () => import(\"../display/podcastmaker/PodcastmakerHeader.vue\"),\n);\nconst ShareAnonymous = defineAsyncComponent(() => import(\"../display/sharing/ShareAnonymous.vue\"));\n \n//Props \nconst props = defineProps({\n  canalId: { default: undefined, type: Number },\n});\n\n\n//Data \nconst loaded = ref(false);\nconst error = ref(false);\nconst radio: Ref<Canal|undefined> = ref(undefined);\n\n\n//Composables\nconst { t } = useI18n();\nconst { isPodcastmaker, isEditRights, authOrgaId } = useOrgaComputed();\nconst { updatePathParams } = useSeoTitleUrl();\nconst {handle403} = useErrorHandler();\nconst authStore = useAuthStore();\nconst generalStore = useGeneralStore();\n\n\n//Computed\nconst editRight = computed(() =>isEditRights(radio.value?.organisationId, authStore.isRoleRadio));\n\n\n//Watch\nwatch(()=>props.canalId, () => {getRadioDetails()}, {immediate: true});\n\n\nonBeforeUnmount(() => {\n  generalStore.contentToDisplayUpdate(null);\n});\n\n\n//Methods\nasync function getRadioDetails(): Promise<void> {\n  loaded.value = false;\n  loaded.value = false;\n  try {\n    radio.value = await classicApi.fetchData<Canal>({\n      api: 14,\n      path: \"canal/\" + props.canalId,\n    });\n    generalStore.contentToDisplayUpdate(radio.value);\n    updatePathParams(radio.value.name);\n  } catch (error) {\n    handle403(error as AxiosError);\n    loaded.value = true;\n  }\n  loaded.value = true;\n}\n</script>\n","<template>\n  <section class=\"page-box\">\n    <template v-if=\"loaded && !error && radio\">\n      <PodcastmakerHeader\n        v-if=\"isPodcastmaker\"\n        :page-title=\"t('Radio')\"\n        :img-url=\"radio.imageUrl\"\n      />\n      <div\n        v-if=\"radio\"\n        class=\"d-flex flex-column page-element\"\n        :class=\"isPodcastmaker ? 'page-element-podcastmaker' : ''\"\n      >\n        <section class=\"module-box\">\n          <div class=\"mb-5 description-text\">\n            <RadioImage :radio=\"radio\" />\n            <div class=\"d-flex align-items-center justify-content-between\">\n              <h2>{{ radio.name }}</h2>\n              <ShareAnonymous class=\"d-flex justify-content-end flex-grow-1\" :organisation-id=\"radio.organisationId\"/>\n            </div>\n            <div v-if=\"radio.description\">\n              {{ radio.description }}\n            </div>\n          </div>\n          <RadioCurrently :radio=\"radio\" />\n          <slot v-if=\"editRight\" name=\"edit-box-radio\" :radio=\"radio\" />\n        </section>\n        <ShareSocialsButtons :organisation-id=\"radio.organisationId\" />\n        <RadioPlanning :radio=\"radio\" />\n        <SharePlayerRadio\n          v-if=\"editRight\"\n          :canal=\"radio\"\n          :organisation-id=\"authOrgaId\"\n        />\n      </div>\n    </template>\n    <ClassicLoading\n      :loading-text=\"!loaded ? t('Loading content ...') : undefined\"\n      :error-text=\"error ? t(`Emission doesn't exist`) : undefined\"\n    />\n  </section>\n</template>\n\n<script setup lang=\"ts\">\nimport { useGeneralStore } from \"../../stores/GeneralStore\";\nimport classicApi from \"../../api/classicApi\";\nimport {useSeoTitleUrl} from \"../composable/route/useSeoTitleUrl\";\nimport {useOrgaComputed} from \"../composable/useOrgaComputed\";\nimport {useErrorHandler} from \"../composable/useErrorHandler\";\nimport ClassicLoading from \"../form/ClassicLoading.vue\";\nimport {  defineAsyncComponent, ref, Ref, computed, watch, onBeforeUnmount } from \"vue\";\nimport { AxiosError } from \"axios\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { useAuthStore } from \"../../stores/AuthStore\";\nimport { useI18n } from \"vue-i18n\";\nconst SharePlayerRadio = defineAsyncComponent(\n  () => import(\"../display/sharing/SharePlayerRadio.vue\"),\n);\nconst ShareSocialsButtons = defineAsyncComponent(\n  () => import(\"../display/sharing/ShareSocialsButtons.vue\"),\n);\nconst RadioCurrently = defineAsyncComponent(\n  () => import(\"../display/live/RadioCurrently.vue\"),\n);\nconst RadioImage = defineAsyncComponent(\n  () => import(\"../display/live/RadioImage.vue\"),\n);\nconst RadioPlanning = defineAsyncComponent(\n  () => import(\"../display/live/RadioPlanning.vue\"),\n);\nconst PodcastmakerHeader = defineAsyncComponent(\n  () => import(\"../display/podcastmaker/PodcastmakerHeader.vue\"),\n);\nconst ShareAnonymous = defineAsyncComponent(() => import(\"../display/sharing/ShareAnonymous.vue\"));\n \n//Props \nconst props = defineProps({\n  canalId: { default: undefined, type: Number },\n});\n\n\n//Data \nconst loaded = ref(false);\nconst error = ref(false);\nconst radio: Ref<Canal|undefined> = ref(undefined);\n\n\n//Composables\nconst { t } = useI18n();\nconst { isPodcastmaker, isEditRights, authOrgaId } = useOrgaComputed();\nconst { updatePathParams } = useSeoTitleUrl();\nconst {handle403} = useErrorHandler();\nconst authStore = useAuthStore();\nconst generalStore = useGeneralStore();\n\n\n//Computed\nconst editRight = computed(() =>isEditRights(radio.value?.organisationId, authStore.isRoleRadio));\n\n\n//Watch\nwatch(()=>props.canalId, () => {getRadioDetails()}, {immediate: true});\n\n\nonBeforeUnmount(() => {\n  generalStore.contentToDisplayUpdate(null);\n});\n\n\n//Methods\nasync function getRadioDetails(): Promise<void> {\n  loaded.value = false;\n  loaded.value = false;\n  try {\n    radio.value = await classicApi.fetchData<Canal>({\n      api: 14,\n      path: \"canal/\" + props.canalId,\n    });\n    generalStore.contentToDisplayUpdate(radio.value);\n    updatePathParams(radio.value.name);\n  } catch (error) {\n    handle403(error as AxiosError);\n    loaded.value = true;\n  }\n  loaded.value = true;\n}\n</script>\n"],"mappings":"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"}

package/dist/{RadioPage-DVflzCV-.mjs → RadioPage-Jg2kmtna.mjs}

@@ -1,10 +1,10 @@
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
 import { t as ClassicLoading_default } from "./ClassicLoading-Crlw7cAx.mjs";
-import { i as useAuthStore, t as classicApi_default } from "./classicApi-CkDHWZG1.mjs";
+import { i as useAuthStore, t as classicApi_default } from "./classicApi-xjOqAovv.mjs";
 import { t as useGeneralStore } from "./GeneralStore-CUlq_NjO.mjs";
-import { t as useErrorHandler } from "./useErrorHandler-DtLjD9t_.mjs";
+import { t as useErrorHandler } from "./useErrorHandler-D3XVxUh6.mjs";
 import { t as useSeoTitleUrl } from "./useSeoTitleUrl-CrM1YzAc.mjs";
-import { t as useOrgaComputed } from "./useOrgaComputed-BLSpEDfb.mjs";
+import { t as useOrgaComputed } from "./useOrgaComputed-B2Bq0VBT.mjs";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineAsyncComponent, defineComponent, normalizeClass, onBeforeUnmount, openBlock, ref, renderSlot, toDisplayString, watch } from "vue";
 import { useI18n } from "vue-i18n";
 //#region src/components/pages/RadioPage.vue?vue&type=script&setup=true&lang.ts
@@ -16,13 +16,13 @@ var RadioPage_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
 	} },
 	setup(__props, { expose: __expose }) {
 		__expose();
-		const SharePlayerRadio = defineAsyncComponent(() => import("./SharePlayerRadio-D3LXD_gK.mjs"));
-		const ShareSocialsButtons = defineAsyncComponent(() => import("./ShareSocialsButtons-iHtSoQ3K.mjs"));
-		const RadioCurrently = defineAsyncComponent(() => import("./RadioCurrently-D5M81oIX.mjs").then((n) => n.n));
-		const RadioImage = defineAsyncComponent(() => import("./RadioImage-CUTRr3DL.mjs").then((n) => n.n));
-		const RadioPlanning = defineAsyncComponent(() => import("./RadioPlanning-CJ7Qqyhs.mjs"));
-		const PodcastmakerHeader = defineAsyncComponent(() => import("./PodcastmakerHeader-DAATtOG_.mjs"));
-		const ShareAnonymous = defineAsyncComponent(() => import("./ShareAnonymous-Chfdzzra.mjs"));
+		const SharePlayerRadio = defineAsyncComponent(() => import("./SharePlayerRadio-CI6glNuI.mjs"));
+		const ShareSocialsButtons = defineAsyncComponent(() => import("./ShareSocialsButtons-BYsXc2Jr.mjs"));
+		const RadioCurrently = defineAsyncComponent(() => import("./RadioCurrently-DWySwV64.mjs").then((n) => n.n));
+		const RadioImage = defineAsyncComponent(() => import("./RadioImage-BIe2KpG_.mjs").then((n) => n.n));
+		const RadioPlanning = defineAsyncComponent(() => import("./RadioPlanning-2aWTnbZb.mjs"));
+		const PodcastmakerHeader = defineAsyncComponent(() => import("./PodcastmakerHeader-Df0g2dCr.mjs"));
+		const ShareAnonymous = defineAsyncComponent(() => import("./ShareAnonymous-4UxjKrIe.mjs"));
 		const props = __props;
 		const loaded = ref(false);
 		const error = ref(false);
@@ -134,4 +134,4 @@ var RadioPage_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RadioPag
 //#endregion
 export { RadioPage_default as default };
 
-//# sourceMappingURL=RadioPage-DVflzCV-.mjs.map
+//# sourceMappingURL=RadioPage-Jg2kmtna.mjs.map

package/dist/RadioPage-Jg2kmtna.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioPage-Jg2kmtna.mjs","names":[],"sources":["../src/components/pages/RadioPage.vue","../src/components/pages/RadioPage.vue"],"sourcesContent":["<template>\n  <section class=\"page-box\">\n    <template v-if=\"loaded && !error && radio\">\n      <PodcastmakerHeader\n        v-if=\"isPodcastmaker\"\n        :page-title=\"t('Radio')\"\n        :img-url=\"radio.imageUrl\"\n      />\n      <div\n        v-if=\"radio\"\n        class=\"d-flex flex-column page-element\"\n        :class=\"isPodcastmaker ? 'page-element-podcastmaker' : ''\"\n      >\n        <section class=\"module-box\">\n          <div class=\"mb-5 description-text\">\n            <RadioImage :radio=\"radio\" />\n            <div class=\"d-flex align-items-center justify-content-between\">\n              <h2>{{ radio.name }}</h2>\n              <ShareAnonymous class=\"d-flex justify-content-end flex-grow-1\" :organisation-id=\"radio.organisationId\"/>\n            </div>\n            <div v-if=\"radio.description\">\n              {{ radio.description }}\n            </div>\n          </div>\n          <RadioCurrently :radio=\"radio\" />\n          <slot v-if=\"editRight\" name=\"edit-box-radio\" :radio=\"radio\" />\n        </section>\n        <ShareSocialsButtons :organisation-id=\"radio.organisationId\" />\n        <RadioPlanning :radio=\"radio\" />\n        <SharePlayerRadio\n          v-if=\"editRight\"\n          :canal=\"radio\"\n          :organisation-id=\"authOrgaId\"\n        />\n      </div>\n    </template>\n    <ClassicLoading\n      :loading-text=\"!loaded ? t('Loading content ...') : undefined\"\n      :error-text=\"error ? t(`Emission doesn't exist`) : undefined\"\n    />\n  </section>\n</template>\n\n<script setup lang=\"ts\">\nimport { useGeneralStore } from \"../../stores/GeneralStore\";\nimport classicApi from \"../../api/classicApi\";\nimport {useSeoTitleUrl} from \"../composable/route/useSeoTitleUrl\";\nimport {useOrgaComputed} from \"../composable/useOrgaComputed\";\nimport {useErrorHandler} from \"../composable/useErrorHandler\";\nimport ClassicLoading from \"../form/ClassicLoading.vue\";\nimport {  defineAsyncComponent, ref, Ref, computed, watch, onBeforeUnmount } from \"vue\";\nimport { AxiosError } from \"axios\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { useAuthStore } from \"../../stores/AuthStore\";\nimport { useI18n } from \"vue-i18n\";\nconst SharePlayerRadio = defineAsyncComponent(\n  () => import(\"../display/sharing/SharePlayerRadio.vue\"),\n);\nconst ShareSocialsButtons = defineAsyncComponent(\n  () => import(\"../display/sharing/ShareSocialsButtons.vue\"),\n);\nconst RadioCurrently = defineAsyncComponent(\n  () => import(\"../display/live/RadioCurrently.vue\"),\n);\nconst RadioImage = defineAsyncComponent(\n  () => import(\"../display/live/RadioImage.vue\"),\n);\nconst RadioPlanning = defineAsyncComponent(\n  () => import(\"../display/live/RadioPlanning.vue\"),\n);\nconst PodcastmakerHeader = defineAsyncComponent(\n  () => import(\"../display/podcastmaker/PodcastmakerHeader.vue\"),\n);\nconst ShareAnonymous = defineAsyncComponent(() => import(\"../display/sharing/ShareAnonymous.vue\"));\n \n//Props \nconst props = defineProps({\n  canalId: { default: undefined, type: Number },\n});\n\n\n//Data \nconst loaded = ref(false);\nconst error = ref(false);\nconst radio: Ref<Canal|undefined> = ref(undefined);\n\n\n//Composables\nconst { t } = useI18n();\nconst { isPodcastmaker, isEditRights, authOrgaId } = useOrgaComputed();\nconst { updatePathParams } = useSeoTitleUrl();\nconst {handle403} = useErrorHandler();\nconst authStore = useAuthStore();\nconst generalStore = useGeneralStore();\n\n\n//Computed\nconst editRight = computed(() =>isEditRights(radio.value?.organisationId, authStore.isRoleRadio));\n\n\n//Watch\nwatch(()=>props.canalId, () => {getRadioDetails()}, {immediate: true});\n\n\nonBeforeUnmount(() => {\n  generalStore.contentToDisplayUpdate(null);\n});\n\n\n//Methods\nasync function getRadioDetails(): Promise<void> {\n  loaded.value = false;\n  loaded.value = false;\n  try {\n    radio.value = await classicApi.fetchData<Canal>({\n      api: 14,\n      path: \"canal/\" + props.canalId,\n    });\n    generalStore.contentToDisplayUpdate(radio.value);\n    updatePathParams(radio.value.name);\n  } catch (error) {\n    handle403(error as AxiosError);\n    loaded.value = true;\n  }\n  loaded.value = true;\n}\n</script>\n","<template>\n  <section class=\"page-box\">\n    <template v-if=\"loaded && !error && radio\">\n      <PodcastmakerHeader\n        v-if=\"isPodcastmaker\"\n        :page-title=\"t('Radio')\"\n        :img-url=\"radio.imageUrl\"\n      />\n      <div\n        v-if=\"radio\"\n        class=\"d-flex flex-column page-element\"\n        :class=\"isPodcastmaker ? 'page-element-podcastmaker' : ''\"\n      >\n        <section class=\"module-box\">\n          <div class=\"mb-5 description-text\">\n            <RadioImage :radio=\"radio\" />\n            <div class=\"d-flex align-items-center justify-content-between\">\n              <h2>{{ radio.name }}</h2>\n              <ShareAnonymous class=\"d-flex justify-content-end flex-grow-1\" :organisation-id=\"radio.organisationId\"/>\n            </div>\n            <div v-if=\"radio.description\">\n              {{ radio.description }}\n            </div>\n          </div>\n          <RadioCurrently :radio=\"radio\" />\n          <slot v-if=\"editRight\" name=\"edit-box-radio\" :radio=\"radio\" />\n        </section>\n        <ShareSocialsButtons :organisation-id=\"radio.organisationId\" />\n        <RadioPlanning :radio=\"radio\" />\n        <SharePlayerRadio\n          v-if=\"editRight\"\n          :canal=\"radio\"\n          :organisation-id=\"authOrgaId\"\n        />\n      </div>\n    </template>\n    <ClassicLoading\n      :loading-text=\"!loaded ? t('Loading content ...') : undefined\"\n      :error-text=\"error ? t(`Emission doesn't exist`) : undefined\"\n    />\n  </section>\n</template>\n\n<script setup lang=\"ts\">\nimport { useGeneralStore } from \"../../stores/GeneralStore\";\nimport classicApi from \"../../api/classicApi\";\nimport {useSeoTitleUrl} from \"../composable/route/useSeoTitleUrl\";\nimport {useOrgaComputed} from \"../composable/useOrgaComputed\";\nimport {useErrorHandler} from \"../composable/useErrorHandler\";\nimport ClassicLoading from \"../form/ClassicLoading.vue\";\nimport {  defineAsyncComponent, ref, Ref, computed, watch, onBeforeUnmount } from \"vue\";\nimport { AxiosError } from \"axios\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { useAuthStore } from \"../../stores/AuthStore\";\nimport { useI18n } from \"vue-i18n\";\nconst SharePlayerRadio = defineAsyncComponent(\n  () => import(\"../display/sharing/SharePlayerRadio.vue\"),\n);\nconst ShareSocialsButtons = defineAsyncComponent(\n  () => import(\"../display/sharing/ShareSocialsButtons.vue\"),\n);\nconst RadioCurrently = defineAsyncComponent(\n  () => import(\"../display/live/RadioCurrently.vue\"),\n);\nconst RadioImage = defineAsyncComponent(\n  () => import(\"../display/live/RadioImage.vue\"),\n);\nconst RadioPlanning = defineAsyncComponent(\n  () => import(\"../display/live/RadioPlanning.vue\"),\n);\nconst PodcastmakerHeader = defineAsyncComponent(\n  () => import(\"../display/podcastmaker/PodcastmakerHeader.vue\"),\n);\nconst ShareAnonymous = defineAsyncComponent(() => import(\"../display/sharing/ShareAnonymous.vue\"));\n \n//Props \nconst props = defineProps({\n  canalId: { default: undefined, type: Number },\n});\n\n\n//Data \nconst loaded = ref(false);\nconst error = ref(false);\nconst radio: Ref<Canal|undefined> = ref(undefined);\n\n\n//Composables\nconst { t } = useI18n();\nconst { isPodcastmaker, isEditRights, authOrgaId } = useOrgaComputed();\nconst { updatePathParams } = useSeoTitleUrl();\nconst {handle403} = useErrorHandler();\nconst authStore = useAuthStore();\nconst generalStore = useGeneralStore();\n\n\n//Computed\nconst editRight = computed(() =>isEditRights(radio.value?.organisationId, authStore.isRoleRadio));\n\n\n//Watch\nwatch(()=>props.canalId, () => {getRadioDetails()}, {immediate: true});\n\n\nonBeforeUnmount(() => {\n  generalStore.contentToDisplayUpdate(null);\n});\n\n\n//Methods\nasync function getRadioDetails(): Promise<void> {\n  loaded.value = false;\n  loaded.value = false;\n  try {\n    radio.value = await classicApi.fetchData<Canal>({\n      api: 14,\n      path: \"canal/\" + props.canalId,\n    });\n    generalStore.contentToDisplayUpdate(radio.value);\n    updatePathParams(radio.value.name);\n  } catch (error) {\n    handle403(error as AxiosError);\n    loaded.value = true;\n  }\n  loaded.value = true;\n}\n</script>\n"],"mappings":"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"}

package/dist/{RadioPlanning-CJ7Qqyhs.mjs → RadioPlanning-2aWTnbZb.mjs}

@@ -1,8 +1,8 @@
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
 import { t as ClassicLoading_default } from "./ClassicLoading-Crlw7cAx.mjs";
-import { t as classicApi_default } from "./classicApi-CkDHWZG1.mjs";
+import { t as classicApi_default } from "./classicApi-xjOqAovv.mjs";
 import { t as useResizePhone } from "./useResizePhone-CpfFUmfV.mjs";
-import { t as useImageProxy } from "./useImageProxy-Bj0cOCct.mjs";
+import { t as useImageProxy } from "./useImageProxy-BdQJmj4a.mjs";
 import { Fragment, computed, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, nextTick, normalizeClass, onMounted, openBlock, ref, renderList, resolveComponent, resolveDirective, toDisplayString, withCtx, withDirectives } from "vue";
 import { useI18n } from "vue-i18n";
 import dayjs from "dayjs";
@@ -287,4 +287,4 @@ var RadioPlanning_default = /*#__PURE__*/ _plugin_vue_export_helper_default(Radi
 //#endregion
 export { RadioPlanning_default as default };
 
-//# sourceMappingURL=RadioPlanning-CJ7Qqyhs.mjs.map
+//# sourceMappingURL=RadioPlanning-2aWTnbZb.mjs.map

package/dist/RadioPlanning-2aWTnbZb.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioPlanning-2aWTnbZb.mjs","names":[],"sources":["../src/components/display/live/RadioPlanning.vue","../src/components/display/live/RadioPlanning.vue"],"sourcesContent":["<template>\n  <section class=\"module-box\">\n    <h2 class=\"mb-3\">\n      {{ t(\"Program\") }}\n    </h2>\n    <div class=\"py-3\">\n      <div class=\"d-flex align-items-center w-100 mb-3\">\n        <button\n          v-for=\"day in displayArrayDays\"\n          :key=\"day.date\"\n          class=\"button-date border\"\n          :class=\"day.date == daySelected ? 'bg-primary' : ''\"\n          @click=\"changeDate(day.date)\"\n        >\n          <span class=\"text-capitalize\" >{{ day.dayOfWeek }}</span>\n          <time :datetime=\"day.iso\">{{ day.title }}</time>\n        </button>\n      </div>\n      <button v-if=\"isPhone\" class=\"btn btn-primary mb-3 mx-0\" @click=\"showAllDays = !showAllDays\">\n        <template v-if=\"!showAllDays\">{{ t('Show more days') }}</template>\n        <template v-else>{{ t('Show fewer days') }}</template>\n      </button>\n      <div\n        class=\"d-flex align-items-center justify-content-center border-bottom\"\n      >\n        <button\n          v-for=\"period in periodOfDay\"\n          :key=\"period.id\"\n          class=\"btn btn-underline mb-2\"\n          @click=\"scrollToElement('planning-period-' + period.id)\"\n        >\n          {{ period.title }}\n        </button>\n        <button class=\"btn btn-underline mb-2\" @click=\"changePeriodNow\">\n          {{ t(\"Now\") }}\n        </button>\n      </div>\n\n      <div class=\"d-flex flex-column p-3\">\n        <ClassicLoading\n          :loading-text=\"loading ? t('Loading content ...') : undefined\"\n          :error-text=\"error ? t(`Error`) : undefined\"\n        />\n        <template v-if=\"!loading && !error\">\n          <div v-if=\"!planningLength[daySelected]\" class=\"text-center\">\n            {{ t(\"No programming\") }}\n          </div>\n          <div v-for=\"period in periodOfDay\" v-else :key=\"period.id\">\n            <template v-if=\"planning[daySelected][period.id].length\">\n              <div\n                :id=\"'planning-period-' + period.id\"\n                class=\"fw-bold my-3 pb-2 border-bottom border-primary text-primary\"\n              >\n                {{ period.title }}\n              </div>\n              <div\n                v-for=\"planningItem in planning[daySelected][period.id]\"\n                :id=\"\n                  'planning-occurrence-' +\n                  planningItem.occurrenceId +\n                  '' +\n                  planningItem.liveId\n                \"\n                :key=\"planningItem.occurrenceId + '' + planningItem.liveId\"\n                class=\"d-flex align-items-center mb-3\"\n              >\n                <time :datetime=\"planningItem.startDate\" class=\"program-item-date fw-bold flex-shrink-0\">\n                  {{ dateDisplay(planningItem.startDate) }}\n                </time>\n                <router-link\n                  class=\"d-flex align-items-center flex-nowrap text-dark\"\n                  :to=\"{\n                    name: 'podcast',\n                    params: { podcastId: planningItem.podcastId },\n                  }\"\n                  :title=\"t('Episode name page', { name: planningItem.title })\"\n                >\n                  <img\n                    v-lazy=\"\n                      useProxyImageUrl(planningItem.podcastData.imageUrl, '150')\n                    \"\n                    width=\"150\"\n                    height=\"150\"\n                    class=\"m-2 program-item-img\"\n                    aria-hidden=\"true\"\n        alt=\"\"\n                    \n                    :title=\"\n                      t('Episode name image', {\n                        name: planningItem.podcastData.title,\n                      })\n                    \"\n                  />\n                  <div class=\"d-flex flex-column\">\n                    <div class=\"d-flex align-items-center mb-2\">\n                      <div\n                        v-if=\"planningItem.liveId\"\n                        class=\"bg-complementary text-white p-1 me-1\"\n                      >\n                        {{ t(\"Live\") }}\n                      </div>\n                      <div class=\"flex-grow-1 fw-bold\">\n                        {{ planningItem.podcastData.title }}\n                      </div>\n                    </div>\n                  </div>\n                </router-link>\n              </div>\n            </template>\n          </div>\n        </template>\n      </div>\n    </div>\n  </section>\n</template>\n\n<script setup lang=\"ts\">\nimport dayjs from \"dayjs\";\nimport utc from \"dayjs/plugin/utc\";\ndayjs.extend(utc);\nimport classicApi from \"../../../api/classicApi\";\nimport {useImageProxy} from \"../../composable/useImageProxy\";\nimport {useResizePhone} from \"../../composable/useResizePhone\";\nimport ClassicLoading from \"../../form/ClassicLoading.vue\";\nimport { computed, nextTick, onMounted, ref, Ref } from \"vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { PlanningOccurrence } from \"@/stores/class/radio/recurrence\";\nimport { PlanningLive } from \"@/stores/class/radio/live\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Data \nconst planning: Ref<{\n  [key: number]: {\n    morning: Array<PlanningOccurrence | PlanningLive>;\n    afternoon: Array<PlanningOccurrence | PlanningLive>;\n    evening: Array<PlanningOccurrence | PlanningLive>;\n  };\n}> = ref({});\nconst planningLength: Ref<{ [key: number]: number }> = ref({});\nconst daySelected = ref(dayjs().valueOf());\nconst arrayDays: Ref<Array<{\n  title: string;\n  date: number;\n  dayOfWeek: string;\n  iso: string;\n}>> = ref([]);\nconst loading = ref(true);\nconst error = ref(false);\nconst showAllDays = ref(false);\n\n\n//Composables\nconst { t } = useI18n();\nconst { isPhone } = useResizePhone();\nconst { useProxyImageUrl } = useImageProxy();\n\n//Computed\nconst startOfDay = computed(() => dayjs(daySelected.value).startOf(\"date\").toISOString());\nconst endOfDay = computed(() => dayjs(daySelected.value).endOf(\"date\").toISOString());\nconst periodOfDay = computed(() => {\n  return [\n    {\n      id: \"morning\",\n      title: t(\"Morning\"),\n      end: dayjs(daySelected.value)\n        .hour(14)\n        .minute(0)\n        .second(0)\n        .millisecond(0),\n    },\n    {\n      id: \"afternoon\",\n      title: t(\"Afternoon\"),\n      end: dayjs(daySelected.value)\n        .hour(19)\n        .minute(0)\n        .second(0)\n        .millisecond(0),\n    },\n    {\n      id: \"evening\",\n      title: t(\"Evening\"),\n      end: dayjs(daySelected.value).endOf(\"date\"),\n    },\n  ];\n});\nconst displayArrayDays = computed(() => {\n  if(isPhone && !showAllDays.value){\n    return arrayDays.value.slice(6, 9);\n  }\n  return arrayDays.value;\n});\n\n\nonMounted(()=>{\n  createArrayDays();\n  fetchOccurrences();\n})\n\n\n//Mounted\nfunction scrollToElement(id: string) {\n  const element = document.getElementById(id);\n  if (element) {\n    const yOffset = -110;\n    const y =\n      element.getBoundingClientRect().top + window.scrollY + yOffset;\n    window.scrollTo({ top: y, behavior: \"smooth\" });\n  }\n}\nfunction changePeriodNow() {\n  const now = dayjs();\n  if (!dayjs(daySelected.value).isSame(now, \"day\")) {\n    changeDate(arrayDays.value[7].date);\n  }\n  nextTick(() => {\n    if (!planningLength.value[daySelected.value]) {\n      return;\n    }\n    const arrayOccurrences = Object.values(\n      planning.value[daySelected.value],\n    ).reduce((r, c) => r.concat(c), []);\n    let selectedOccurrence = arrayOccurrences[0];\n    for (const occ of arrayOccurrences) {\n      selectedOccurrence = occ;\n      if (dayjs(occ.endDate).isAfter(now)) {\n        break;\n      }\n    }\n    scrollToElement(\n      \"planning-occurrence-\" +\n        selectedOccurrence.occurrenceId +\n        \"\" +\n        selectedOccurrence.liveId,\n    );\n  });\n}\nfunction createArrayDays() {\n  for (let index = -7; index < 3; index++) {\n    const dayToAdd = dayjs().add(index, \"day\");\n    if (0 === index) {\n      daySelected.value = dayToAdd.valueOf();\n    }\n    arrayDays.value.push({\n      title: dayToAdd.format(\"D/MM\"),\n      dayOfWeek: dayToAdd.format(\"dddd\"),\n      date: dayToAdd.valueOf(),\n      iso: dayToAdd.format(\"MM-DD\"),\n    });\n  }\n}\nasync function fetchOccurrencesAndLives(): Promise<Array<PlanningOccurrence|PlanningLive>> {\n  const params = {\n    canalId: props.radio?.id,\n    from:startOfDay.value,\n    to:endOfDay.value,\n  };\n  let occurrences: Array<PlanningOccurrence | PlanningLive> =\n    await classicApi.fetchData<Array<PlanningOccurrence>>({\n      api: 14,\n      path: \"planning/occurrence/list\",\n      parameters: params,\n    });\n  const lives: Array<PlanningOccurrence> = await classicApi.fetchData<\n    Array<PlanningOccurrence>\n  >({\n    api: 14,\n    path: \"live/list\",\n    parameters: params,\n  });\n\n  if (lives.length) {\n    occurrences = occurrences.concat(lives);\n    occurrences.sort((a, b) => {\n      if (a.startDate > b.startDate) {\n        return 1;\n      }\n      return b.startDate > a.startDate ? -1 : 0;\n    });\n  }\n  return occurrences;\n}\n\nasync function fetchOccurrences(): Promise<void> {\n  if (planning.value[daySelected.value]) {\n    return;\n  }\n  planning.value[daySelected.value] = {\n    morning: [],\n    afternoon: [],\n    evening: [],\n  };\n  planningLength.value[daySelected.value] = 0;\n  loading.value = true;\n  error.value = false;\n  try {\n    const occurrences = await fetchOccurrencesAndLives();\n    let periodDayIndex = 0;\n    for (const occ of occurrences) {\n      if (!occ.podcastId) {\n        continue;\n      }\n      if (\n        !dayjs(occ.startDate).isBefore(periodOfDay.value[periodDayIndex].end)\n      ) {\n        periodDayIndex += 1;\n      }\n\n      switch (periodOfDay.value[periodDayIndex].id) {\n        case \"morning\":\n          planning.value[daySelected.value].morning.push(occ);\n          break;\n        case \"afternoon\":\n          planning.value[daySelected.value].afternoon.push(occ);\n          break;\n        case \"evening\":\n          planning.value[daySelected.value].evening.push(occ);\n          break;\n        default:\n          break;\n      }\n      planningLength.value[daySelected.value] += 1;\n    }\n  } catch(e) {\n    error.value = true;\n    console.error(e);\n  }\n  loading.value = false;\n}\nfunction changeDate(date: number) {\n  daySelected.value = date;\n  fetchOccurrences();\n}\nfunction dateDisplay(date: Date): string {\n  return dayjs(date).format(\"HH:mm\");\n}\n</script>\n<style lang=\"scss\">\n.octopus-app {\n  .program-item-date {\n    width: 100px;\n    font-size: 1.1rem;\n\n    @media (width <= 960px) {\n\t\t\tfont-size: 0.8rem;\n\t\t}\n  }\n\n  .program-item-img{\n    @media (width <= 960px) {\n\t\t\twidth: 80px;\n      height: 80px;\n      margin: 0.5rem 0.5rem 0 0 !important;\n\t\t}\n  }\n\n  .button-date {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    flex-grow: 1;\n    padding: 0.5rem;\n\n    &.bg-primary{\n      color: var(--octopus-color-on-primary) !important;\n    }\n\n    &:hover {\n      background: var(--octopus-secondary);\n    }\n\n    @media (width <= 960px) {\n\t\t\twidth: 80px;\n\t\t}\n  }\n}\n</style>\n","<template>\n  <section class=\"module-box\">\n    <h2 class=\"mb-3\">\n      {{ t(\"Program\") }}\n    </h2>\n    <div class=\"py-3\">\n      <div class=\"d-flex align-items-center w-100 mb-3\">\n        <button\n          v-for=\"day in displayArrayDays\"\n          :key=\"day.date\"\n          class=\"button-date border\"\n          :class=\"day.date == daySelected ? 'bg-primary' : ''\"\n          @click=\"changeDate(day.date)\"\n        >\n          <span class=\"text-capitalize\" >{{ day.dayOfWeek }}</span>\n          <time :datetime=\"day.iso\">{{ day.title }}</time>\n        </button>\n      </div>\n      <button v-if=\"isPhone\" class=\"btn btn-primary mb-3 mx-0\" @click=\"showAllDays = !showAllDays\">\n        <template v-if=\"!showAllDays\">{{ t('Show more days') }}</template>\n        <template v-else>{{ t('Show fewer days') }}</template>\n      </button>\n      <div\n        class=\"d-flex align-items-center justify-content-center border-bottom\"\n      >\n        <button\n          v-for=\"period in periodOfDay\"\n          :key=\"period.id\"\n          class=\"btn btn-underline mb-2\"\n          @click=\"scrollToElement('planning-period-' + period.id)\"\n        >\n          {{ period.title }}\n        </button>\n        <button class=\"btn btn-underline mb-2\" @click=\"changePeriodNow\">\n          {{ t(\"Now\") }}\n        </button>\n      </div>\n\n      <div class=\"d-flex flex-column p-3\">\n        <ClassicLoading\n          :loading-text=\"loading ? t('Loading content ...') : undefined\"\n          :error-text=\"error ? t(`Error`) : undefined\"\n        />\n        <template v-if=\"!loading && !error\">\n          <div v-if=\"!planningLength[daySelected]\" class=\"text-center\">\n            {{ t(\"No programming\") }}\n          </div>\n          <div v-for=\"period in periodOfDay\" v-else :key=\"period.id\">\n            <template v-if=\"planning[daySelected][period.id].length\">\n              <div\n                :id=\"'planning-period-' + period.id\"\n                class=\"fw-bold my-3 pb-2 border-bottom border-primary text-primary\"\n              >\n                {{ period.title }}\n              </div>\n              <div\n                v-for=\"planningItem in planning[daySelected][period.id]\"\n                :id=\"\n                  'planning-occurrence-' +\n                  planningItem.occurrenceId +\n                  '' +\n                  planningItem.liveId\n                \"\n                :key=\"planningItem.occurrenceId + '' + planningItem.liveId\"\n                class=\"d-flex align-items-center mb-3\"\n              >\n                <time :datetime=\"planningItem.startDate\" class=\"program-item-date fw-bold flex-shrink-0\">\n                  {{ dateDisplay(planningItem.startDate) }}\n                </time>\n                <router-link\n                  class=\"d-flex align-items-center flex-nowrap text-dark\"\n                  :to=\"{\n                    name: 'podcast',\n                    params: { podcastId: planningItem.podcastId },\n                  }\"\n                  :title=\"t('Episode name page', { name: planningItem.title })\"\n                >\n                  <img\n                    v-lazy=\"\n                      useProxyImageUrl(planningItem.podcastData.imageUrl, '150')\n                    \"\n                    width=\"150\"\n                    height=\"150\"\n                    class=\"m-2 program-item-img\"\n                    aria-hidden=\"true\"\n        alt=\"\"\n                    \n                    :title=\"\n                      t('Episode name image', {\n                        name: planningItem.podcastData.title,\n                      })\n                    \"\n                  />\n                  <div class=\"d-flex flex-column\">\n                    <div class=\"d-flex align-items-center mb-2\">\n                      <div\n                        v-if=\"planningItem.liveId\"\n                        class=\"bg-complementary text-white p-1 me-1\"\n                      >\n                        {{ t(\"Live\") }}\n                      </div>\n                      <div class=\"flex-grow-1 fw-bold\">\n                        {{ planningItem.podcastData.title }}\n                      </div>\n                    </div>\n                  </div>\n                </router-link>\n              </div>\n            </template>\n          </div>\n        </template>\n      </div>\n    </div>\n  </section>\n</template>\n\n<script setup lang=\"ts\">\nimport dayjs from \"dayjs\";\nimport utc from \"dayjs/plugin/utc\";\ndayjs.extend(utc);\nimport classicApi from \"../../../api/classicApi\";\nimport {useImageProxy} from \"../../composable/useImageProxy\";\nimport {useResizePhone} from \"../../composable/useResizePhone\";\nimport ClassicLoading from \"../../form/ClassicLoading.vue\";\nimport { computed, nextTick, onMounted, ref, Ref } from \"vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { PlanningOccurrence } from \"@/stores/class/radio/recurrence\";\nimport { PlanningLive } from \"@/stores/class/radio/live\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Data \nconst planning: Ref<{\n  [key: number]: {\n    morning: Array<PlanningOccurrence | PlanningLive>;\n    afternoon: Array<PlanningOccurrence | PlanningLive>;\n    evening: Array<PlanningOccurrence | PlanningLive>;\n  };\n}> = ref({});\nconst planningLength: Ref<{ [key: number]: number }> = ref({});\nconst daySelected = ref(dayjs().valueOf());\nconst arrayDays: Ref<Array<{\n  title: string;\n  date: number;\n  dayOfWeek: string;\n  iso: string;\n}>> = ref([]);\nconst loading = ref(true);\nconst error = ref(false);\nconst showAllDays = ref(false);\n\n\n//Composables\nconst { t } = useI18n();\nconst { isPhone } = useResizePhone();\nconst { useProxyImageUrl } = useImageProxy();\n\n//Computed\nconst startOfDay = computed(() => dayjs(daySelected.value).startOf(\"date\").toISOString());\nconst endOfDay = computed(() => dayjs(daySelected.value).endOf(\"date\").toISOString());\nconst periodOfDay = computed(() => {\n  return [\n    {\n      id: \"morning\",\n      title: t(\"Morning\"),\n      end: dayjs(daySelected.value)\n        .hour(14)\n        .minute(0)\n        .second(0)\n        .millisecond(0),\n    },\n    {\n      id: \"afternoon\",\n      title: t(\"Afternoon\"),\n      end: dayjs(daySelected.value)\n        .hour(19)\n        .minute(0)\n        .second(0)\n        .millisecond(0),\n    },\n    {\n      id: \"evening\",\n      title: t(\"Evening\"),\n      end: dayjs(daySelected.value).endOf(\"date\"),\n    },\n  ];\n});\nconst displayArrayDays = computed(() => {\n  if(isPhone && !showAllDays.value){\n    return arrayDays.value.slice(6, 9);\n  }\n  return arrayDays.value;\n});\n\n\nonMounted(()=>{\n  createArrayDays();\n  fetchOccurrences();\n})\n\n\n//Mounted\nfunction scrollToElement(id: string) {\n  const element = document.getElementById(id);\n  if (element) {\n    const yOffset = -110;\n    const y =\n      element.getBoundingClientRect().top + window.scrollY + yOffset;\n    window.scrollTo({ top: y, behavior: \"smooth\" });\n  }\n}\nfunction changePeriodNow() {\n  const now = dayjs();\n  if (!dayjs(daySelected.value).isSame(now, \"day\")) {\n    changeDate(arrayDays.value[7].date);\n  }\n  nextTick(() => {\n    if (!planningLength.value[daySelected.value]) {\n      return;\n    }\n    const arrayOccurrences = Object.values(\n      planning.value[daySelected.value],\n    ).reduce((r, c) => r.concat(c), []);\n    let selectedOccurrence = arrayOccurrences[0];\n    for (const occ of arrayOccurrences) {\n      selectedOccurrence = occ;\n      if (dayjs(occ.endDate).isAfter(now)) {\n        break;\n      }\n    }\n    scrollToElement(\n      \"planning-occurrence-\" +\n        selectedOccurrence.occurrenceId +\n        \"\" +\n        selectedOccurrence.liveId,\n    );\n  });\n}\nfunction createArrayDays() {\n  for (let index = -7; index < 3; index++) {\n    const dayToAdd = dayjs().add(index, \"day\");\n    if (0 === index) {\n      daySelected.value = dayToAdd.valueOf();\n    }\n    arrayDays.value.push({\n      title: dayToAdd.format(\"D/MM\"),\n      dayOfWeek: dayToAdd.format(\"dddd\"),\n      date: dayToAdd.valueOf(),\n      iso: dayToAdd.format(\"MM-DD\"),\n    });\n  }\n}\nasync function fetchOccurrencesAndLives(): Promise<Array<PlanningOccurrence|PlanningLive>> {\n  const params = {\n    canalId: props.radio?.id,\n    from:startOfDay.value,\n    to:endOfDay.value,\n  };\n  let occurrences: Array<PlanningOccurrence | PlanningLive> =\n    await classicApi.fetchData<Array<PlanningOccurrence>>({\n      api: 14,\n      path: \"planning/occurrence/list\",\n      parameters: params,\n    });\n  const lives: Array<PlanningOccurrence> = await classicApi.fetchData<\n    Array<PlanningOccurrence>\n  >({\n    api: 14,\n    path: \"live/list\",\n    parameters: params,\n  });\n\n  if (lives.length) {\n    occurrences = occurrences.concat(lives);\n    occurrences.sort((a, b) => {\n      if (a.startDate > b.startDate) {\n        return 1;\n      }\n      return b.startDate > a.startDate ? -1 : 0;\n    });\n  }\n  return occurrences;\n}\n\nasync function fetchOccurrences(): Promise<void> {\n  if (planning.value[daySelected.value]) {\n    return;\n  }\n  planning.value[daySelected.value] = {\n    morning: [],\n    afternoon: [],\n    evening: [],\n  };\n  planningLength.value[daySelected.value] = 0;\n  loading.value = true;\n  error.value = false;\n  try {\n    const occurrences = await fetchOccurrencesAndLives();\n    let periodDayIndex = 0;\n    for (const occ of occurrences) {\n      if (!occ.podcastId) {\n        continue;\n      }\n      if (\n        !dayjs(occ.startDate).isBefore(periodOfDay.value[periodDayIndex].end)\n      ) {\n        periodDayIndex += 1;\n      }\n\n      switch (periodOfDay.value[periodDayIndex].id) {\n        case \"morning\":\n          planning.value[daySelected.value].morning.push(occ);\n          break;\n        case \"afternoon\":\n          planning.value[daySelected.value].afternoon.push(occ);\n          break;\n        case \"evening\":\n          planning.value[daySelected.value].evening.push(occ);\n          break;\n        default:\n          break;\n      }\n      planningLength.value[daySelected.value] += 1;\n    }\n  } catch(e) {\n    error.value = true;\n    console.error(e);\n  }\n  loading.value = false;\n}\nfunction changeDate(date: number) {\n  daySelected.value = date;\n  fetchOccurrences();\n}\nfunction dateDisplay(date: Date): string {\n  return dayjs(date).format(\"HH:mm\");\n}\n</script>\n<style lang=\"scss\">\n.octopus-app {\n  .program-item-date {\n    width: 100px;\n    font-size: 1.1rem;\n\n    @media (width <= 960px) {\n\t\t\tfont-size: 0.8rem;\n\t\t}\n  }\n\n  .program-item-img{\n    @media (width <= 960px) {\n\t\t\twidth: 80px;\n      height: 80px;\n      margin: 0.5rem 0.5rem 0 0 !important;\n\t\t}\n  }\n\n  .button-date {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    flex-grow: 1;\n    padding: 0.5rem;\n\n    &.bg-primary{\n      color: var(--octopus-color-on-primary) !important;\n    }\n\n    &:hover {\n      background: var(--octopus-secondary);\n    }\n\n    @media (width <= 960px) {\n\t\t\twidth: 80px;\n\t\t}\n  }\n}\n</style>\n"],"mappings":"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"}

package/dist/RadioPlanning-DHxcBVQo.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioPlanning-DHxcBVQo.mjs","names":[],"sources":["../src/components/display/live/RadioPlanning.vue","../src/components/display/live/RadioPlanning.vue"],"sourcesContent":["<template>\n  <section class=\"module-box\">\n    <h2 class=\"mb-3\">\n      {{ t(\"Program\") }}\n    </h2>\n    <div class=\"py-3\">\n      <div class=\"d-flex align-items-center w-100 mb-3\">\n        <button\n          v-for=\"day in displayArrayDays\"\n          :key=\"day.date\"\n          class=\"button-date border\"\n          :class=\"day.date == daySelected ? 'bg-primary' : ''\"\n          @click=\"changeDate(day.date)\"\n        >\n          <span class=\"text-capitalize\" >{{ day.dayOfWeek }}</span>\n          <time :datetime=\"day.iso\">{{ day.title }}</time>\n        </button>\n      </div>\n      <button v-if=\"isPhone\" class=\"btn btn-primary mb-3 mx-0\" @click=\"showAllDays = !showAllDays\">\n        <template v-if=\"!showAllDays\">{{ t('Show more days') }}</template>\n        <template v-else>{{ t('Show fewer days') }}</template>\n      </button>\n      <div\n        class=\"d-flex align-items-center justify-content-center border-bottom\"\n      >\n        <button\n          v-for=\"period in periodOfDay\"\n          :key=\"period.id\"\n          class=\"btn btn-underline mb-2\"\n          @click=\"scrollToElement('planning-period-' + period.id)\"\n        >\n          {{ period.title }}\n        </button>\n        <button class=\"btn btn-underline mb-2\" @click=\"changePeriodNow\">\n          {{ t(\"Now\") }}\n        </button>\n      </div>\n\n      <div class=\"d-flex flex-column p-3\">\n        <ClassicLoading\n          :loading-text=\"loading ? t('Loading content ...') : undefined\"\n          :error-text=\"error ? t(`Error`) : undefined\"\n        />\n        <template v-if=\"!loading && !error\">\n          <div v-if=\"!planningLength[daySelected]\" class=\"text-center\">\n            {{ t(\"No programming\") }}\n          </div>\n          <div v-for=\"period in periodOfDay\" v-else :key=\"period.id\">\n            <template v-if=\"planning[daySelected][period.id].length\">\n              <div\n                :id=\"'planning-period-' + period.id\"\n                class=\"fw-bold my-3 pb-2 border-bottom border-primary text-primary\"\n              >\n                {{ period.title }}\n              </div>\n              <div\n                v-for=\"planningItem in planning[daySelected][period.id]\"\n                :id=\"\n                  'planning-occurrence-' +\n                  planningItem.occurrenceId +\n                  '' +\n                  planningItem.liveId\n                \"\n                :key=\"planningItem.occurrenceId + '' + planningItem.liveId\"\n                class=\"d-flex align-items-center mb-3\"\n              >\n                <time :datetime=\"planningItem.startDate\" class=\"program-item-date fw-bold flex-shrink-0\">\n                  {{ dateDisplay(planningItem.startDate) }}\n                </time>\n                <router-link\n                  class=\"d-flex align-items-center flex-nowrap text-dark\"\n                  :to=\"{\n                    name: 'podcast',\n                    params: { podcastId: planningItem.podcastId },\n                  }\"\n                  :title=\"t('Episode name page', { name: planningItem.title })\"\n                >\n                  <img\n                    v-lazy=\"\n                      useProxyImageUrl(planningItem.podcastData.imageUrl, '150')\n                    \"\n                    width=\"150\"\n                    height=\"150\"\n                    class=\"m-2 program-item-img\"\n                    aria-hidden=\"true\"\n        alt=\"\"\n                    \n                    :title=\"\n                      t('Episode name image', {\n                        name: planningItem.podcastData.title,\n                      })\n                    \"\n                  />\n                  <div class=\"d-flex flex-column\">\n                    <div class=\"d-flex align-items-center mb-2\">\n                      <div\n                        v-if=\"planningItem.liveId\"\n                        class=\"bg-complementary text-white p-1 me-1\"\n                      >\n                        {{ t(\"Live\") }}\n                      </div>\n                      <div class=\"flex-grow-1 fw-bold\">\n                        {{ planningItem.podcastData.title }}\n                      </div>\n                    </div>\n                  </div>\n                </router-link>\n              </div>\n            </template>\n          </div>\n        </template>\n      </div>\n    </div>\n  </section>\n</template>\n\n<script setup lang=\"ts\">\nimport dayjs from \"dayjs\";\nimport utc from \"dayjs/plugin/utc\";\ndayjs.extend(utc);\nimport classicApi from \"../../../api/classicApi\";\nimport {useImageProxy} from \"../../composable/useImageProxy\";\nimport {useResizePhone} from \"../../composable/useResizePhone\";\nimport ClassicLoading from \"../../form/ClassicLoading.vue\";\nimport { computed, nextTick, onMounted, ref, Ref } from \"vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { PlanningOccurrence } from \"@/stores/class/radio/recurrence\";\nimport { PlanningLive } from \"@/stores/class/radio/live\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Data \nconst planning: Ref<{\n  [key: number]: {\n    morning: Array<PlanningOccurrence | PlanningLive>;\n    afternoon: Array<PlanningOccurrence | PlanningLive>;\n    evening: Array<PlanningOccurrence | PlanningLive>;\n  };\n}> = ref({});\nconst planningLength: Ref<{ [key: number]: number }> = ref({});\nconst daySelected = ref(dayjs().valueOf());\nconst arrayDays: Ref<Array<{\n  title: string;\n  date: number;\n  dayOfWeek: string;\n  iso: string;\n}>> = ref([]);\nconst loading = ref(true);\nconst error = ref(false);\nconst showAllDays = ref(false);\n\n\n//Composables\nconst { t } = useI18n();\nconst { isPhone } = useResizePhone();\nconst { useProxyImageUrl } = useImageProxy();\n\n//Computed\nconst startOfDay = computed(() => dayjs(daySelected.value).startOf(\"date\").toISOString());\nconst endOfDay = computed(() => dayjs(daySelected.value).endOf(\"date\").toISOString());\nconst periodOfDay = computed(() => {\n  return [\n    {\n      id: \"morning\",\n      title: t(\"Morning\"),\n      end: dayjs(daySelected.value)\n        .hour(14)\n        .minute(0)\n        .second(0)\n        .millisecond(0),\n    },\n    {\n      id: \"afternoon\",\n      title: t(\"Afternoon\"),\n      end: dayjs(daySelected.value)\n        .hour(19)\n        .minute(0)\n        .second(0)\n        .millisecond(0),\n    },\n    {\n      id: \"evening\",\n      title: t(\"Evening\"),\n      end: dayjs(daySelected.value).endOf(\"date\"),\n    },\n  ];\n});\nconst displayArrayDays = computed(() => {\n  if(isPhone && !showAllDays.value){\n    return arrayDays.value.slice(6, 9);\n  }\n  return arrayDays.value;\n});\n\n\nonMounted(()=>{\n  createArrayDays();\n  fetchOccurrences();\n})\n\n\n//Mounted\nfunction scrollToElement(id: string) {\n  const element = document.getElementById(id);\n  if (element) {\n    const yOffset = -110;\n    const y =\n      element.getBoundingClientRect().top + window.scrollY + yOffset;\n    window.scrollTo({ top: y, behavior: \"smooth\" });\n  }\n}\nfunction changePeriodNow() {\n  const now = dayjs();\n  if (!dayjs(daySelected.value).isSame(now, \"day\")) {\n    changeDate(arrayDays.value[7].date);\n  }\n  nextTick(() => {\n    if (!planningLength.value[daySelected.value]) {\n      return;\n    }\n    const arrayOccurrences = Object.values(\n      planning.value[daySelected.value],\n    ).reduce((r, c) => r.concat(c), []);\n    let selectedOccurrence = arrayOccurrences[0];\n    for (const occ of arrayOccurrences) {\n      selectedOccurrence = occ;\n      if (dayjs(occ.endDate).isAfter(now)) {\n        break;\n      }\n    }\n    scrollToElement(\n      \"planning-occurrence-\" +\n        selectedOccurrence.occurrenceId +\n        \"\" +\n        selectedOccurrence.liveId,\n    );\n  });\n}\nfunction createArrayDays() {\n  for (let index = -7; index < 3; index++) {\n    const dayToAdd = dayjs().add(index, \"day\");\n    if (0 === index) {\n      daySelected.value = dayToAdd.valueOf();\n    }\n    arrayDays.value.push({\n      title: dayToAdd.format(\"D/MM\"),\n      dayOfWeek: dayToAdd.format(\"dddd\"),\n      date: dayToAdd.valueOf(),\n      iso: dayToAdd.format(\"MM-DD\"),\n    });\n  }\n}\nasync function fetchOccurrencesAndLives(): Promise<Array<PlanningOccurrence|PlanningLive>> {\n  const params = {\n    canalId: props.radio?.id,\n    from:startOfDay.value,\n    to:endOfDay.value,\n  };\n  let occurrences: Array<PlanningOccurrence | PlanningLive> =\n    await classicApi.fetchData<Array<PlanningOccurrence>>({\n      api: 14,\n      path: \"planning/occurrence/list\",\n      parameters: params,\n    });\n  const lives: Array<PlanningOccurrence> = await classicApi.fetchData<\n    Array<PlanningOccurrence>\n  >({\n    api: 14,\n    path: \"live/list\",\n    parameters: params,\n  });\n\n  if (lives.length) {\n    occurrences = occurrences.concat(lives);\n    occurrences.sort((a, b) => {\n      if (a.startDate > b.startDate) {\n        return 1;\n      }\n      return b.startDate > a.startDate ? -1 : 0;\n    });\n  }\n  return occurrences;\n}\n\nasync function fetchOccurrences(): Promise<void> {\n  if (planning.value[daySelected.value]) {\n    return;\n  }\n  planning.value[daySelected.value] = {\n    morning: [],\n    afternoon: [],\n    evening: [],\n  };\n  planningLength.value[daySelected.value] = 0;\n  loading.value = true;\n  error.value = false;\n  try {\n    const occurrences = await fetchOccurrencesAndLives();\n    let periodDayIndex = 0;\n    for (const occ of occurrences) {\n      if (!occ.podcastId) {\n        continue;\n      }\n      if (\n        !dayjs(occ.startDate).isBefore(periodOfDay.value[periodDayIndex].end)\n      ) {\n        periodDayIndex += 1;\n      }\n\n      switch (periodOfDay.value[periodDayIndex].id) {\n        case \"morning\":\n          planning.value[daySelected.value].morning.push(occ);\n          break;\n        case \"afternoon\":\n          planning.value[daySelected.value].afternoon.push(occ);\n          break;\n        case \"evening\":\n          planning.value[daySelected.value].evening.push(occ);\n          break;\n        default:\n          break;\n      }\n      planningLength.value[daySelected.value] += 1;\n    }\n  } catch(e) {\n    error.value = true;\n    console.error(e);\n  }\n  loading.value = false;\n}\nfunction changeDate(date: number) {\n  daySelected.value = date;\n  fetchOccurrences();\n}\nfunction dateDisplay(date: Date): string {\n  return dayjs(date).format(\"HH:mm\");\n}\n</script>\n<style lang=\"scss\">\n.octopus-app {\n  .program-item-date {\n    width: 100px;\n    font-size: 1.1rem;\n\n    @media (width <= 960px) {\n\t\t\tfont-size: 0.8rem;\n\t\t}\n  }\n\n  .program-item-img{\n    @media (width <= 960px) {\n\t\t\twidth: 80px;\n      height: 80px;\n      margin: 0.5rem 0.5rem 0 0 !important;\n\t\t}\n  }\n\n  .button-date {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    flex-grow: 1;\n    padding: 0.5rem;\n\n    &.bg-primary{\n      color: var(--octopus-color-on-primary) !important;\n    }\n\n    &:hover {\n      background: var(--octopus-secondary);\n    }\n\n    @media (width <= 960px) {\n\t\t\twidth: 80px;\n\t\t}\n  }\n}\n</style>\n","<template>\n  <section class=\"module-box\">\n    <h2 class=\"mb-3\">\n      {{ t(\"Program\") }}\n    </h2>\n    <div class=\"py-3\">\n      <div class=\"d-flex align-items-center w-100 mb-3\">\n        <button\n          v-for=\"day in displayArrayDays\"\n          :key=\"day.date\"\n          class=\"button-date border\"\n          :class=\"day.date == daySelected ? 'bg-primary' : ''\"\n          @click=\"changeDate(day.date)\"\n        >\n          <span class=\"text-capitalize\" >{{ day.dayOfWeek }}</span>\n          <time :datetime=\"day.iso\">{{ day.title }}</time>\n        </button>\n      </div>\n      <button v-if=\"isPhone\" class=\"btn btn-primary mb-3 mx-0\" @click=\"showAllDays = !showAllDays\">\n        <template v-if=\"!showAllDays\">{{ t('Show more days') }}</template>\n        <template v-else>{{ t('Show fewer days') }}</template>\n      </button>\n      <div\n        class=\"d-flex align-items-center justify-content-center border-bottom\"\n      >\n        <button\n          v-for=\"period in periodOfDay\"\n          :key=\"period.id\"\n          class=\"btn btn-underline mb-2\"\n          @click=\"scrollToElement('planning-period-' + period.id)\"\n        >\n          {{ period.title }}\n        </button>\n        <button class=\"btn btn-underline mb-2\" @click=\"changePeriodNow\">\n          {{ t(\"Now\") }}\n        </button>\n      </div>\n\n      <div class=\"d-flex flex-column p-3\">\n        <ClassicLoading\n          :loading-text=\"loading ? t('Loading content ...') : undefined\"\n          :error-text=\"error ? t(`Error`) : undefined\"\n        />\n        <template v-if=\"!loading && !error\">\n          <div v-if=\"!planningLength[daySelected]\" class=\"text-center\">\n            {{ t(\"No programming\") }}\n          </div>\n          <div v-for=\"period in periodOfDay\" v-else :key=\"period.id\">\n            <template v-if=\"planning[daySelected][period.id].length\">\n              <div\n                :id=\"'planning-period-' + period.id\"\n                class=\"fw-bold my-3 pb-2 border-bottom border-primary text-primary\"\n              >\n                {{ period.title }}\n              </div>\n              <div\n                v-for=\"planningItem in planning[daySelected][period.id]\"\n                :id=\"\n                  'planning-occurrence-' +\n                  planningItem.occurrenceId +\n                  '' +\n                  planningItem.liveId\n                \"\n                :key=\"planningItem.occurrenceId + '' + planningItem.liveId\"\n                class=\"d-flex align-items-center mb-3\"\n              >\n                <time :datetime=\"planningItem.startDate\" class=\"program-item-date fw-bold flex-shrink-0\">\n                  {{ dateDisplay(planningItem.startDate) }}\n                </time>\n                <router-link\n                  class=\"d-flex align-items-center flex-nowrap text-dark\"\n                  :to=\"{\n                    name: 'podcast',\n                    params: { podcastId: planningItem.podcastId },\n                  }\"\n                  :title=\"t('Episode name page', { name: planningItem.title })\"\n                >\n                  <img\n                    v-lazy=\"\n                      useProxyImageUrl(planningItem.podcastData.imageUrl, '150')\n                    \"\n                    width=\"150\"\n                    height=\"150\"\n                    class=\"m-2 program-item-img\"\n                    aria-hidden=\"true\"\n        alt=\"\"\n                    \n                    :title=\"\n                      t('Episode name image', {\n                        name: planningItem.podcastData.title,\n                      })\n                    \"\n                  />\n                  <div class=\"d-flex flex-column\">\n                    <div class=\"d-flex align-items-center mb-2\">\n                      <div\n                        v-if=\"planningItem.liveId\"\n                        class=\"bg-complementary text-white p-1 me-1\"\n                      >\n                        {{ t(\"Live\") }}\n                      </div>\n                      <div class=\"flex-grow-1 fw-bold\">\n                        {{ planningItem.podcastData.title }}\n                      </div>\n                    </div>\n                  </div>\n                </router-link>\n              </div>\n            </template>\n          </div>\n        </template>\n      </div>\n    </div>\n  </section>\n</template>\n\n<script setup lang=\"ts\">\nimport dayjs from \"dayjs\";\nimport utc from \"dayjs/plugin/utc\";\ndayjs.extend(utc);\nimport classicApi from \"../../../api/classicApi\";\nimport {useImageProxy} from \"../../composable/useImageProxy\";\nimport {useResizePhone} from \"../../composable/useResizePhone\";\nimport ClassicLoading from \"../../form/ClassicLoading.vue\";\nimport { computed, nextTick, onMounted, ref, Ref } from \"vue\";\nimport { Canal } from \"@/stores/class/radio/canal\";\nimport { PlanningOccurrence } from \"@/stores/class/radio/recurrence\";\nimport { PlanningLive } from \"@/stores/class/radio/live\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \nconst props = defineProps({\n  radio: { default: undefined, type: Object as () => Canal },\n})\n\n//Data \nconst planning: Ref<{\n  [key: number]: {\n    morning: Array<PlanningOccurrence | PlanningLive>;\n    afternoon: Array<PlanningOccurrence | PlanningLive>;\n    evening: Array<PlanningOccurrence | PlanningLive>;\n  };\n}> = ref({});\nconst planningLength: Ref<{ [key: number]: number }> = ref({});\nconst daySelected = ref(dayjs().valueOf());\nconst arrayDays: Ref<Array<{\n  title: string;\n  date: number;\n  dayOfWeek: string;\n  iso: string;\n}>> = ref([]);\nconst loading = ref(true);\nconst error = ref(false);\nconst showAllDays = ref(false);\n\n\n//Composables\nconst { t } = useI18n();\nconst { isPhone } = useResizePhone();\nconst { useProxyImageUrl } = useImageProxy();\n\n//Computed\nconst startOfDay = computed(() => dayjs(daySelected.value).startOf(\"date\").toISOString());\nconst endOfDay = computed(() => dayjs(daySelected.value).endOf(\"date\").toISOString());\nconst periodOfDay = computed(() => {\n  return [\n    {\n      id: \"morning\",\n      title: t(\"Morning\"),\n      end: dayjs(daySelected.value)\n        .hour(14)\n        .minute(0)\n        .second(0)\n        .millisecond(0),\n    },\n    {\n      id: \"afternoon\",\n      title: t(\"Afternoon\"),\n      end: dayjs(daySelected.value)\n        .hour(19)\n        .minute(0)\n        .second(0)\n        .millisecond(0),\n    },\n    {\n      id: \"evening\",\n      title: t(\"Evening\"),\n      end: dayjs(daySelected.value).endOf(\"date\"),\n    },\n  ];\n});\nconst displayArrayDays = computed(() => {\n  if(isPhone && !showAllDays.value){\n    return arrayDays.value.slice(6, 9);\n  }\n  return arrayDays.value;\n});\n\n\nonMounted(()=>{\n  createArrayDays();\n  fetchOccurrences();\n})\n\n\n//Mounted\nfunction scrollToElement(id: string) {\n  const element = document.getElementById(id);\n  if (element) {\n    const yOffset = -110;\n    const y =\n      element.getBoundingClientRect().top + window.scrollY + yOffset;\n    window.scrollTo({ top: y, behavior: \"smooth\" });\n  }\n}\nfunction changePeriodNow() {\n  const now = dayjs();\n  if (!dayjs(daySelected.value).isSame(now, \"day\")) {\n    changeDate(arrayDays.value[7].date);\n  }\n  nextTick(() => {\n    if (!planningLength.value[daySelected.value]) {\n      return;\n    }\n    const arrayOccurrences = Object.values(\n      planning.value[daySelected.value],\n    ).reduce((r, c) => r.concat(c), []);\n    let selectedOccurrence = arrayOccurrences[0];\n    for (const occ of arrayOccurrences) {\n      selectedOccurrence = occ;\n      if (dayjs(occ.endDate).isAfter(now)) {\n        break;\n      }\n    }\n    scrollToElement(\n      \"planning-occurrence-\" +\n        selectedOccurrence.occurrenceId +\n        \"\" +\n        selectedOccurrence.liveId,\n    );\n  });\n}\nfunction createArrayDays() {\n  for (let index = -7; index < 3; index++) {\n    const dayToAdd = dayjs().add(index, \"day\");\n    if (0 === index) {\n      daySelected.value = dayToAdd.valueOf();\n    }\n    arrayDays.value.push({\n      title: dayToAdd.format(\"D/MM\"),\n      dayOfWeek: dayToAdd.format(\"dddd\"),\n      date: dayToAdd.valueOf(),\n      iso: dayToAdd.format(\"MM-DD\"),\n    });\n  }\n}\nasync function fetchOccurrencesAndLives(): Promise<Array<PlanningOccurrence|PlanningLive>> {\n  const params = {\n    canalId: props.radio?.id,\n    from:startOfDay.value,\n    to:endOfDay.value,\n  };\n  let occurrences: Array<PlanningOccurrence | PlanningLive> =\n    await classicApi.fetchData<Array<PlanningOccurrence>>({\n      api: 14,\n      path: \"planning/occurrence/list\",\n      parameters: params,\n    });\n  const lives: Array<PlanningOccurrence> = await classicApi.fetchData<\n    Array<PlanningOccurrence>\n  >({\n    api: 14,\n    path: \"live/list\",\n    parameters: params,\n  });\n\n  if (lives.length) {\n    occurrences = occurrences.concat(lives);\n    occurrences.sort((a, b) => {\n      if (a.startDate > b.startDate) {\n        return 1;\n      }\n      return b.startDate > a.startDate ? -1 : 0;\n    });\n  }\n  return occurrences;\n}\n\nasync function fetchOccurrences(): Promise<void> {\n  if (planning.value[daySelected.value]) {\n    return;\n  }\n  planning.value[daySelected.value] = {\n    morning: [],\n    afternoon: [],\n    evening: [],\n  };\n  planningLength.value[daySelected.value] = 0;\n  loading.value = true;\n  error.value = false;\n  try {\n    const occurrences = await fetchOccurrencesAndLives();\n    let periodDayIndex = 0;\n    for (const occ of occurrences) {\n      if (!occ.podcastId) {\n        continue;\n      }\n      if (\n        !dayjs(occ.startDate).isBefore(periodOfDay.value[periodDayIndex].end)\n      ) {\n        periodDayIndex += 1;\n      }\n\n      switch (periodOfDay.value[periodDayIndex].id) {\n        case \"morning\":\n          planning.value[daySelected.value].morning.push(occ);\n          break;\n        case \"afternoon\":\n          planning.value[daySelected.value].afternoon.push(occ);\n          break;\n        case \"evening\":\n          planning.value[daySelected.value].evening.push(occ);\n          break;\n        default:\n          break;\n      }\n      planningLength.value[daySelected.value] += 1;\n    }\n  } catch(e) {\n    error.value = true;\n    console.error(e);\n  }\n  loading.value = false;\n}\nfunction changeDate(date: number) {\n  daySelected.value = date;\n  fetchOccurrences();\n}\nfunction dateDisplay(date: Date): string {\n  return dayjs(date).format(\"HH:mm\");\n}\n</script>\n<style lang=\"scss\">\n.octopus-app {\n  .program-item-date {\n    width: 100px;\n    font-size: 1.1rem;\n\n    @media (width <= 960px) {\n\t\t\tfont-size: 0.8rem;\n\t\t}\n  }\n\n  .program-item-img{\n    @media (width <= 960px) {\n\t\t\twidth: 80px;\n      height: 80px;\n      margin: 0.5rem 0.5rem 0 0 !important;\n\t\t}\n  }\n\n  .button-date {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    flex-grow: 1;\n    padding: 0.5rem;\n\n    &.bg-primary{\n      color: var(--octopus-color-on-primary) !important;\n    }\n\n    &:hover {\n      background: var(--octopus-secondary);\n    }\n\n    @media (width <= 960px) {\n\t\t\twidth: 80px;\n\t\t}\n  }\n}\n</style>\n"],"mappings":"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"}

package/dist/RadioProgressBar-BHAawrHe.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioProgressBar-BHAawrHe.mjs","names":[],"sources":["../src/components/misc/player/radio/RadioProgressBar.vue","../src/components/misc/player/radio/RadioProgressBar.vue"],"sourcesContent":["<template>\n  <progress\n    class=\"c-hand-auto mt-1\"\n    min=\"0\"\n    max=\"100\"\n    :value=\"percentProgress\"\n    :aria-label=\"t('Radio')\"\n    :class=\"isAmbiance ? 'ambiance-progress' : ''\"\n  />\n</template>\n\n<script setup lang=\"ts\">\nimport { usePlayerStore } from \"../../../../stores/PlayerStore\";\nimport dayjs from \"dayjs\";\nimport { useI18n } from \"vue-i18n\";\nimport { computed, onMounted, onUnmounted, ref, Ref } from \"vue\";\n\n//Data \nconst percentInterval: Ref<ReturnType<typeof setTimeout> | undefined> = ref(undefined);\n\n//Composables\nconst { t } = useI18n();\nconst playerStore = usePlayerStore();\n\n\n//Computed\nconst isAmbiance = computed(() => !playerStore.playerRadio?.podcast?.podcastId);\nconst percentProgress = computed(() => {\n  if (!playerStore.playerElapsed) {\n    return 0;\n  }\n  return playerStore.playerElapsed * 100;\n});\n\n\nonMounted(()=>handlePercentInterval())\nonUnmounted(()=>clearInterval(percentInterval.value as unknown as number))\n\n\n//Methods\nfunction handlePercentInterval(): void {\n  percentInterval.value = setInterval(() => {calculatePercent();}, 1000);\n}\nfunction calculatePercent(): void {\n  if (!playerStore.playerRadio?.metadata) {\n    return;\n  }\n  const actualMilliSecondsPlayed = dayjs()\n    .subtract(18, \"second\")\n    .diff(dayjs(playerStore.playerRadio.metadata.startDate));\n  const percentPlayed =\n    actualMilliSecondsPlayed /\n    (playerStore.playerRadio?.metadata.playDuration * 1000);\n    playerStore.playerUpdateElapsed(\n    percentPlayed,\n    playerStore.playerRadio?.metadata.playDuration,\n  );\n}\n</script>\n\n<style scoped lang=\"scss\">\n.octopus-app {\n  progress {\n      background-color: var(--octopus-player-progress-background-color);\n      border-radius: var(--octopus-border-radius);\n      accent-color: var(--octopus-player-progress-color-current);\n      color: var(--octopus-player-progress-color-current);\n      border: none;\n\n      &::-moz-progress-bar, &::-webkit-progress-value {\n        background: var(--octopus-player-progress-color-current);\n      }\n  }\n}\n</style>\n","<template>\n  <progress\n    class=\"c-hand-auto mt-1\"\n    min=\"0\"\n    max=\"100\"\n    :value=\"percentProgress\"\n    :aria-label=\"t('Radio')\"\n    :class=\"isAmbiance ? 'ambiance-progress' : ''\"\n  />\n</template>\n\n<script setup lang=\"ts\">\nimport { usePlayerStore } from \"../../../../stores/PlayerStore\";\nimport dayjs from \"dayjs\";\nimport { useI18n } from \"vue-i18n\";\nimport { computed, onMounted, onUnmounted, ref, Ref } from \"vue\";\n\n//Data \nconst percentInterval: Ref<ReturnType<typeof setTimeout> | undefined> = ref(undefined);\n\n//Composables\nconst { t } = useI18n();\nconst playerStore = usePlayerStore();\n\n\n//Computed\nconst isAmbiance = computed(() => !playerStore.playerRadio?.podcast?.podcastId);\nconst percentProgress = computed(() => {\n  if (!playerStore.playerElapsed) {\n    return 0;\n  }\n  return playerStore.playerElapsed * 100;\n});\n\n\nonMounted(()=>handlePercentInterval())\nonUnmounted(()=>clearInterval(percentInterval.value as unknown as number))\n\n\n//Methods\nfunction handlePercentInterval(): void {\n  percentInterval.value = setInterval(() => {calculatePercent();}, 1000);\n}\nfunction calculatePercent(): void {\n  if (!playerStore.playerRadio?.metadata) {\n    return;\n  }\n  const actualMilliSecondsPlayed = dayjs()\n    .subtract(18, \"second\")\n    .diff(dayjs(playerStore.playerRadio.metadata.startDate));\n  const percentPlayed =\n    actualMilliSecondsPlayed /\n    (playerStore.playerRadio?.metadata.playDuration * 1000);\n    playerStore.playerUpdateElapsed(\n    percentPlayed,\n    playerStore.playerRadio?.metadata.playDuration,\n  );\n}\n</script>\n\n<style scoped lang=\"scss\">\n.octopus-app {\n  progress {\n      background-color: var(--octopus-player-progress-background-color);\n      border-radius: var(--octopus-border-radius);\n      accent-color: var(--octopus-player-progress-color-current);\n      color: var(--octopus-player-progress-color-current);\n      border: none;\n\n      &::-moz-progress-bar, &::-webkit-progress-value {\n        background: var(--octopus-player-progress-color-current);\n      }\n  }\n}\n</style>\n"],"mappings":";;;;;;;;;;EAkBA,MAAM,kBAAkE,IAAI,KAAA,CAAS;EAGrF,MAAM,EAAE,MAAM,QAAQ;EACtB,MAAM,cAAc,eAAe;EAInC,MAAM,aAAa,eAAe,CAAC,YAAY,aAAa,SAAS,SAAS;EAC9E,MAAM,kBAAkB,eAAe;GACrC,IAAI,CAAC,YAAY,eACf,OAAO;GAET,OAAO,YAAY,gBAAgB;EACrC,CAAC;EAGD,gBAAc,sBAAsB,CAAC;EACrC,kBAAgB,cAAc,gBAAgB,KAA0B,CAAC;EAIzE,SAAS,wBAA8B;GACrC,gBAAgB,QAAQ,kBAAkB;IAAC,iBAAiB;GAAE,GAAG,GAAI;EACvE;EACA,SAAS,mBAAyB;GAChC,IAAI,CAAC,YAAY,aAAa,UAC5B;GAKF,MAAM,gBAH2B,MAAM,EACpC,SAAS,IAAI,QAAQ,EACrB,KAAK,MAAM,YAAY,YAAY,SAAS,SAAS,CAEtD,KACC,YAAY,aAAa,SAAS,eAAe;GAClD,YAAY,oBACZ,eACA,YAAY,aAAa,SAAS,YACpC;EACF;;;;;;;;;;;;;;;;;;;;;qBCxDE,mBAOE,YAAA;EANA,OAAK,eAAA,CAAC,oBAKE,OAAA,aAAU,sBAAA,EAAA,CAAA;EAJlB,KAAI;EACJ,KAAI;EACH,OAAO,OAAA;EACP,cAAY,OAAA,EAAC,OAAA"}

package/dist/RadioProgressBar-CPjLAoPB.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioProgressBar-CPjLAoPB.mjs","names":[],"sources":["../src/components/misc/player/radio/RadioProgressBar.vue","../src/components/misc/player/radio/RadioProgressBar.vue"],"sourcesContent":["<template>\n  <progress\n    class=\"c-hand-auto mt-1\"\n    min=\"0\"\n    max=\"100\"\n    :value=\"percentProgress\"\n    :aria-label=\"t('Radio')\"\n    :class=\"isAmbiance ? 'ambiance-progress' : ''\"\n  />\n</template>\n\n<script setup lang=\"ts\">\nimport { usePlayerStore } from \"../../../../stores/PlayerStore\";\nimport dayjs from \"dayjs\";\nimport { useI18n } from \"vue-i18n\";\nimport { computed, onMounted, onUnmounted, ref, Ref } from \"vue\";\n\n//Data \nconst percentInterval: Ref<ReturnType<typeof setTimeout> | undefined> = ref(undefined);\n\n//Composables\nconst { t } = useI18n();\nconst playerStore = usePlayerStore();\n\n\n//Computed\nconst isAmbiance = computed(() => !playerStore.playerRadio?.podcast?.podcastId);\nconst percentProgress = computed(() => {\n  if (!playerStore.playerElapsed) {\n    return 0;\n  }\n  return playerStore.playerElapsed * 100;\n});\n\n\nonMounted(()=>handlePercentInterval())\nonUnmounted(()=>clearInterval(percentInterval.value as unknown as number))\n\n\n//Methods\nfunction handlePercentInterval(): void {\n  percentInterval.value = setInterval(() => {calculatePercent();}, 1000);\n}\nfunction calculatePercent(): void {\n  if (!playerStore.playerRadio?.metadata) {\n    return;\n  }\n  const actualMilliSecondsPlayed = dayjs()\n    .subtract(18, \"second\")\n    .diff(dayjs(playerStore.playerRadio.metadata.startDate));\n  const percentPlayed =\n    actualMilliSecondsPlayed /\n    (playerStore.playerRadio?.metadata.playDuration * 1000);\n    playerStore.playerUpdateElapsed(\n    percentPlayed,\n    playerStore.playerRadio?.metadata.playDuration,\n  );\n}\n</script>\n\n<style scoped lang=\"scss\">\n.octopus-app {\n  progress {\n      background-color: var(--octopus-player-progress-background-color);\n      border-radius: var(--octopus-border-radius);\n      accent-color: var(--octopus-player-progress-color-current);\n      color: var(--octopus-player-progress-color-current);\n      border: none;\n\n      &::-moz-progress-bar, &::-webkit-progress-value {\n        background: var(--octopus-player-progress-color-current);\n      }\n  }\n}\n</style>\n","<template>\n  <progress\n    class=\"c-hand-auto mt-1\"\n    min=\"0\"\n    max=\"100\"\n    :value=\"percentProgress\"\n    :aria-label=\"t('Radio')\"\n    :class=\"isAmbiance ? 'ambiance-progress' : ''\"\n  />\n</template>\n\n<script setup lang=\"ts\">\nimport { usePlayerStore } from \"../../../../stores/PlayerStore\";\nimport dayjs from \"dayjs\";\nimport { useI18n } from \"vue-i18n\";\nimport { computed, onMounted, onUnmounted, ref, Ref } from \"vue\";\n\n//Data \nconst percentInterval: Ref<ReturnType<typeof setTimeout> | undefined> = ref(undefined);\n\n//Composables\nconst { t } = useI18n();\nconst playerStore = usePlayerStore();\n\n\n//Computed\nconst isAmbiance = computed(() => !playerStore.playerRadio?.podcast?.podcastId);\nconst percentProgress = computed(() => {\n  if (!playerStore.playerElapsed) {\n    return 0;\n  }\n  return playerStore.playerElapsed * 100;\n});\n\n\nonMounted(()=>handlePercentInterval())\nonUnmounted(()=>clearInterval(percentInterval.value as unknown as number))\n\n\n//Methods\nfunction handlePercentInterval(): void {\n  percentInterval.value = setInterval(() => {calculatePercent();}, 1000);\n}\nfunction calculatePercent(): void {\n  if (!playerStore.playerRadio?.metadata) {\n    return;\n  }\n  const actualMilliSecondsPlayed = dayjs()\n    .subtract(18, \"second\")\n    .diff(dayjs(playerStore.playerRadio.metadata.startDate));\n  const percentPlayed =\n    actualMilliSecondsPlayed /\n    (playerStore.playerRadio?.metadata.playDuration * 1000);\n    playerStore.playerUpdateElapsed(\n    percentPlayed,\n    playerStore.playerRadio?.metadata.playDuration,\n  );\n}\n</script>\n\n<style scoped lang=\"scss\">\n.octopus-app {\n  progress {\n      background-color: var(--octopus-player-progress-background-color);\n      border-radius: var(--octopus-border-radius);\n      accent-color: var(--octopus-player-progress-color-current);\n      color: var(--octopus-player-progress-color-current);\n      border: none;\n\n      &::-moz-progress-bar, &::-webkit-progress-value {\n        background: var(--octopus-player-progress-color-current);\n      }\n  }\n}\n</style>\n"],"mappings":";;;;;;;;;;EAkBA,MAAM,kBAAkE,IAAI,KAAA,CAAS;EAGrF,MAAM,EAAE,MAAM,QAAQ;EACtB,MAAM,cAAc,eAAe;EAInC,MAAM,aAAa,eAAe,CAAC,YAAY,aAAa,SAAS,SAAS;EAC9E,MAAM,kBAAkB,eAAe;GACrC,IAAI,CAAC,YAAY,eACf,OAAO;GAET,OAAO,YAAY,gBAAgB;EACrC,CAAC;EAGD,gBAAc,sBAAsB,CAAC;EACrC,kBAAgB,cAAc,gBAAgB,KAA0B,CAAC;EAIzE,SAAS,wBAA8B;GACrC,gBAAgB,QAAQ,kBAAkB;IAAC,iBAAiB;GAAE,GAAG,GAAI;EACvE;EACA,SAAS,mBAAyB;GAChC,IAAI,CAAC,YAAY,aAAa,UAC5B;GAKF,MAAM,gBAH2B,MAAM,EACpC,SAAS,IAAI,QAAQ,EACrB,KAAK,MAAM,YAAY,YAAY,SAAS,SAAS,CAEtD,KACC,YAAY,aAAa,SAAS,eAAe;GAClD,YAAY,oBACZ,eACA,YAAY,aAAa,SAAS,YACpC;EACF;;;;;;;;;;;;;;;;;;;;;qBCxDE,mBAOE,YAAA;EANA,OAAK,eAAA,CAAC,oBAKE,OAAA,aAAU,sBAAA,EAAA,CAAA;EAJlB,KAAI;EACJ,KAAI;EACH,OAAO,OAAA;EACP,cAAY,OAAA,EAAC,OAAA"}

package/dist/{RadioProgressBar-BmJbzzQA.mjs → RadioProgressBar-yIz1oI5d.mjs}

@@ -1,5 +1,5 @@
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
-import { n as usePlayerStore } from "./PlayerStore-DukkcHI_.mjs";
+import { n as usePlayerStore } from "./PlayerStore-vYmnOEA_.mjs";
 import { computed, createElementBlock, defineComponent, normalizeClass, onMounted, onUnmounted, openBlock, ref } from "vue";
 import { useI18n } from "vue-i18n";
 import dayjs from "dayjs";
@@ -64,4 +64,4 @@ var RadioProgressBar_default = /*#__PURE__*/ _plugin_vue_export_helper_default(R
 //#endregion
 export { RadioProgressBar_default as default };
 
-//# sourceMappingURL=RadioProgressBar-BmJbzzQA.mjs.map
+//# sourceMappingURL=RadioProgressBar-yIz1oI5d.mjs.map

package/dist/RadioProgressBar-yIz1oI5d.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioProgressBar-yIz1oI5d.mjs","names":[],"sources":["../src/components/misc/player/radio/RadioProgressBar.vue","../src/components/misc/player/radio/RadioProgressBar.vue"],"sourcesContent":["<template>\n  <progress\n    class=\"c-hand-auto mt-1\"\n    min=\"0\"\n    max=\"100\"\n    :value=\"percentProgress\"\n    :aria-label=\"t('Radio')\"\n    :class=\"isAmbiance ? 'ambiance-progress' : ''\"\n  />\n</template>\n\n<script setup lang=\"ts\">\nimport { usePlayerStore } from \"../../../../stores/PlayerStore\";\nimport dayjs from \"dayjs\";\nimport { useI18n } from \"vue-i18n\";\nimport { computed, onMounted, onUnmounted, ref, Ref } from \"vue\";\n\n//Data \nconst percentInterval: Ref<ReturnType<typeof setTimeout> | undefined> = ref(undefined);\n\n//Composables\nconst { t } = useI18n();\nconst playerStore = usePlayerStore();\n\n\n//Computed\nconst isAmbiance = computed(() => !playerStore.playerRadio?.podcast?.podcastId);\nconst percentProgress = computed(() => {\n  if (!playerStore.playerElapsed) {\n    return 0;\n  }\n  return playerStore.playerElapsed * 100;\n});\n\n\nonMounted(()=>handlePercentInterval())\nonUnmounted(()=>clearInterval(percentInterval.value as unknown as number))\n\n\n//Methods\nfunction handlePercentInterval(): void {\n  percentInterval.value = setInterval(() => {calculatePercent();}, 1000);\n}\nfunction calculatePercent(): void {\n  if (!playerStore.playerRadio?.metadata) {\n    return;\n  }\n  const actualMilliSecondsPlayed = dayjs()\n    .subtract(18, \"second\")\n    .diff(dayjs(playerStore.playerRadio.metadata.startDate));\n  const percentPlayed =\n    actualMilliSecondsPlayed /\n    (playerStore.playerRadio?.metadata.playDuration * 1000);\n    playerStore.playerUpdateElapsed(\n    percentPlayed,\n    playerStore.playerRadio?.metadata.playDuration,\n  );\n}\n</script>\n\n<style scoped lang=\"scss\">\n.octopus-app {\n  progress {\n      background-color: var(--octopus-player-progress-background-color);\n      border-radius: var(--octopus-border-radius);\n      accent-color: var(--octopus-player-progress-color-current);\n      color: var(--octopus-player-progress-color-current);\n      border: none;\n\n      &::-moz-progress-bar, &::-webkit-progress-value {\n        background: var(--octopus-player-progress-color-current);\n      }\n  }\n}\n</style>\n","<template>\n  <progress\n    class=\"c-hand-auto mt-1\"\n    min=\"0\"\n    max=\"100\"\n    :value=\"percentProgress\"\n    :aria-label=\"t('Radio')\"\n    :class=\"isAmbiance ? 'ambiance-progress' : ''\"\n  />\n</template>\n\n<script setup lang=\"ts\">\nimport { usePlayerStore } from \"../../../../stores/PlayerStore\";\nimport dayjs from \"dayjs\";\nimport { useI18n } from \"vue-i18n\";\nimport { computed, onMounted, onUnmounted, ref, Ref } from \"vue\";\n\n//Data \nconst percentInterval: Ref<ReturnType<typeof setTimeout> | undefined> = ref(undefined);\n\n//Composables\nconst { t } = useI18n();\nconst playerStore = usePlayerStore();\n\n\n//Computed\nconst isAmbiance = computed(() => !playerStore.playerRadio?.podcast?.podcastId);\nconst percentProgress = computed(() => {\n  if (!playerStore.playerElapsed) {\n    return 0;\n  }\n  return playerStore.playerElapsed * 100;\n});\n\n\nonMounted(()=>handlePercentInterval())\nonUnmounted(()=>clearInterval(percentInterval.value as unknown as number))\n\n\n//Methods\nfunction handlePercentInterval(): void {\n  percentInterval.value = setInterval(() => {calculatePercent();}, 1000);\n}\nfunction calculatePercent(): void {\n  if (!playerStore.playerRadio?.metadata) {\n    return;\n  }\n  const actualMilliSecondsPlayed = dayjs()\n    .subtract(18, \"second\")\n    .diff(dayjs(playerStore.playerRadio.metadata.startDate));\n  const percentPlayed =\n    actualMilliSecondsPlayed /\n    (playerStore.playerRadio?.metadata.playDuration * 1000);\n    playerStore.playerUpdateElapsed(\n    percentPlayed,\n    playerStore.playerRadio?.metadata.playDuration,\n  );\n}\n</script>\n\n<style scoped lang=\"scss\">\n.octopus-app {\n  progress {\n      background-color: var(--octopus-player-progress-background-color);\n      border-radius: var(--octopus-border-radius);\n      accent-color: var(--octopus-player-progress-color-current);\n      color: var(--octopus-player-progress-color-current);\n      border: none;\n\n      &::-moz-progress-bar, &::-webkit-progress-value {\n        background: var(--octopus-player-progress-color-current);\n      }\n  }\n}\n</style>\n"],"mappings":";;;;;;;;;;EAkBA,MAAM,kBAAkE,IAAI,KAAA,CAAS;EAGrF,MAAM,EAAE,MAAM,QAAQ;EACtB,MAAM,cAAc,eAAe;EAInC,MAAM,aAAa,eAAe,CAAC,YAAY,aAAa,SAAS,SAAS;EAC9E,MAAM,kBAAkB,eAAe;GACrC,IAAI,CAAC,YAAY,eACf,OAAO;GAET,OAAO,YAAY,gBAAgB;EACrC,CAAC;EAGD,gBAAc,sBAAsB,CAAC;EACrC,kBAAgB,cAAc,gBAAgB,KAA0B,CAAC;EAIzE,SAAS,wBAA8B;GACrC,gBAAgB,QAAQ,kBAAkB;IAAC,iBAAiB;GAAE,GAAG,GAAI;EACvE;EACA,SAAS,mBAAyB;GAChC,IAAI,CAAC,YAAY,aAAa,UAC5B;GAKF,MAAM,gBAH2B,MAAM,EACpC,SAAS,IAAI,QAAQ,EACrB,KAAK,MAAM,YAAY,YAAY,SAAS,SAAS,CAEtD,KACC,YAAY,aAAa,SAAS,eAAe;GAClD,YAAY,oBACZ,eACA,YAAY,aAAa,SAAS,YACpC;EACF;;;;;;;;;;;;;;;;;;;;;qBCxDE,mBAOE,YAAA;EANA,OAAK,eAAA,CAAC,oBAKE,OAAA,aAAU,sBAAA,EAAA,CAAA;EAJlB,KAAI;EACJ,KAAI;EACH,OAAO,OAAA;EACP,cAAY,OAAA,EAAC,OAAA"}

package/dist/RecaptchaModal-DKugsU7h.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RecaptchaModal-DKugsU7h.mjs","names":[],"sources":["../src/components/display/comments/modal/RecaptchaModal.vue","../src/components/display/comments/modal/RecaptchaModal.vue"],"sourcesContent":["<template>\n  <ClassicModal\n    :id-modal=\"idModal\"\n    :title-modal=\"titleModal\"\n    :closable=\"false\"\n    @close=\"closePopup\"\n  >\n    <template #body>\n      <div class=\"text-center text-danger\">{{ errorRecaptchaText }}</div>\n      <slot v-if=\"!isInTreatment\" name=\"form\" />\n      <ClassicLoading\n        v-else\n        :loading-text=\"\n          isInTreatment && !errorText && !successText\n            ? t('Loading content ...')\n            : undefined\n        \"\n        :error-text=\"errorText\"\n      />\n      <div v-if=\"successText\" class=\"text-center h3\">{{ successText }}</div>\n    </template>\n    <template #footer>\n      <button class=\"btn m-1\" @click=\"closePopup\">\n        {{ t(\"Close\") }}\n      </button>\n      <vue-recaptcha\n        v-if=\"!isVerify\"\n        ref=\"invisibleRecaptcha\"\n        :load-recaptcha-script=\"true\"\n        size=\"invisible\"\n        sitekey=\"6LfyP_4ZAAAAAPODj8nov2LvosIwcX0GYeBSungh\"\n        @verify=\"handleSuccess\"\n        @expired=\"handleError\"\n      />\n      <button\n        v-if=\"!errorText && !successText\"\n        class=\"btn btn-primary m-1\"\n        :disabled=\"disableValidate || isInTreatment\"\n        @click=\"submit\"\n      >\n        {{ t(\"Yes\") }}\n      </button>\n    </template>\n  </ClassicModal>\n</template>\n\n<script setup lang=\"ts\">\nimport { state } from \"../../../../stores/ParamSdkStore\";\nimport ClassicLoading from \"../../../form/ClassicLoading.vue\";\nimport ClassicModal from \"../../../misc/modal/ClassicModal.vue\";\nimport { CHECK_TOKEN_KEY } from \"../../../composable/keys\";\nimport { VueRecaptcha } from \"vue-recaptcha\";\nimport { computed, inject, ref, useTemplateRef } from \"vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \ndefineProps({\n  idModal: { default: undefined, type: String },\n  titleModal: { default: undefined, type: String },\n  disableValidate: { default: false, type: Boolean },\n  errorText: { default: undefined, type: String },\n  successText: { default: undefined, type: String },\n})\n\n//Emits\nconst emit = defineEmits([\"close\", \"validate\"]);\n\n//Data \nconst sendError = ref(false);\nconst isVerify = ref(false);\nconst isInTreatment = ref(false);\nconst captchRef = useTemplateRef('invisibleRecaptcha');\n\n\n//Composables\nconst { t } = useI18n();\n// checkToken is not defined in the SDK: it is resolved at runtime from the\n// consuming app's globally provided implementation (app.provide()), and\n// defaults to always-verified when the app hasn't provided one.\nconst checkToken = inject(CHECK_TOKEN_KEY, async () => true);\n\n//Computed\nconst errorRecaptchaText = computed(() =>{\n  if (isCaptchaTest.value) {\n    return t(\"Recaptcha not active\");\n  }\n  return sendError.value ? t(\"Recaptcha error\") : \"\";\n});\nconst isCaptchaTest = computed(() => state.generalParameters.isCaptchaTest as boolean);\n\n\n//Methods\nasync function handleSuccess(token: string) {\n  isVerify.value = await checkToken(token);\n  sendAction();\n}\nfunction handleError() {\n  isVerify.value = false;\n  sendError.value = true;\n}\nasync function submit(): Promise<void> {\n  isInTreatment.value = true;\n  if (!isVerify.value && !isCaptchaTest.value) {\n    (captchRef?.value as InstanceType<typeof VueRecaptcha>).execute();\n  }\n  sendAction();\n}\nfunction closePopup(): void {\n  emit(\"close\");\n}\nfunction sendAction(): void {\n  emit(\"validate\");\n}\n</script>\n","<template>\n  <ClassicModal\n    :id-modal=\"idModal\"\n    :title-modal=\"titleModal\"\n    :closable=\"false\"\n    @close=\"closePopup\"\n  >\n    <template #body>\n      <div class=\"text-center text-danger\">{{ errorRecaptchaText }}</div>\n      <slot v-if=\"!isInTreatment\" name=\"form\" />\n      <ClassicLoading\n        v-else\n        :loading-text=\"\n          isInTreatment && !errorText && !successText\n            ? t('Loading content ...')\n            : undefined\n        \"\n        :error-text=\"errorText\"\n      />\n      <div v-if=\"successText\" class=\"text-center h3\">{{ successText }}</div>\n    </template>\n    <template #footer>\n      <button class=\"btn m-1\" @click=\"closePopup\">\n        {{ t(\"Close\") }}\n      </button>\n      <vue-recaptcha\n        v-if=\"!isVerify\"\n        ref=\"invisibleRecaptcha\"\n        :load-recaptcha-script=\"true\"\n        size=\"invisible\"\n        sitekey=\"6LfyP_4ZAAAAAPODj8nov2LvosIwcX0GYeBSungh\"\n        @verify=\"handleSuccess\"\n        @expired=\"handleError\"\n      />\n      <button\n        v-if=\"!errorText && !successText\"\n        class=\"btn btn-primary m-1\"\n        :disabled=\"disableValidate || isInTreatment\"\n        @click=\"submit\"\n      >\n        {{ t(\"Yes\") }}\n      </button>\n    </template>\n  </ClassicModal>\n</template>\n\n<script setup lang=\"ts\">\nimport { state } from \"../../../../stores/ParamSdkStore\";\nimport ClassicLoading from \"../../../form/ClassicLoading.vue\";\nimport ClassicModal from \"../../../misc/modal/ClassicModal.vue\";\nimport { CHECK_TOKEN_KEY } from \"../../../composable/keys\";\nimport { VueRecaptcha } from \"vue-recaptcha\";\nimport { computed, inject, ref, useTemplateRef } from \"vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \ndefineProps({\n  idModal: { default: undefined, type: String },\n  titleModal: { default: undefined, type: String },\n  disableValidate: { default: false, type: Boolean },\n  errorText: { default: undefined, type: String },\n  successText: { default: undefined, type: String },\n})\n\n//Emits\nconst emit = defineEmits([\"close\", \"validate\"]);\n\n//Data \nconst sendError = ref(false);\nconst isVerify = ref(false);\nconst isInTreatment = ref(false);\nconst captchRef = useTemplateRef('invisibleRecaptcha');\n\n\n//Composables\nconst { t } = useI18n();\n// checkToken is not defined in the SDK: it is resolved at runtime from the\n// consuming app's globally provided implementation (app.provide()), and\n// defaults to always-verified when the app hasn't provided one.\nconst checkToken = inject(CHECK_TOKEN_KEY, async () => true);\n\n//Computed\nconst errorRecaptchaText = computed(() =>{\n  if (isCaptchaTest.value) {\n    return t(\"Recaptcha not active\");\n  }\n  return sendError.value ? t(\"Recaptcha error\") : \"\";\n});\nconst isCaptchaTest = computed(() => state.generalParameters.isCaptchaTest as boolean);\n\n\n//Methods\nasync function handleSuccess(token: string) {\n  isVerify.value = await checkToken(token);\n  sendAction();\n}\nfunction handleError() {\n  isVerify.value = false;\n  sendError.value = true;\n}\nasync function submit(): Promise<void> {\n  isInTreatment.value = true;\n  if (!isVerify.value && !isCaptchaTest.value) {\n    (captchRef?.value as InstanceType<typeof VueRecaptcha>).execute();\n  }\n  sendAction();\n}\nfunction closePopup(): void {\n  emit(\"close\");\n}\nfunction sendAction(): void {\n  emit(\"validate\");\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAiEA,MAAM,OAAO;EAGb,MAAM,YAAY,IAAI,KAAK;EAC3B,MAAM,WAAW,IAAI,KAAK;EAC1B,MAAM,gBAAgB,IAAI,KAAK;EAC/B,MAAM,YAAY,eAAe,oBAAoB;EAIrD,MAAM,EAAE,MAAM,QAAQ;EAItB,MAAM,aAAa,OAAO,iBAAiB,YAAY,IAAI;EAG3D,MAAM,qBAAqB,eAAc;GACvC,IAAI,cAAc,OAChB,OAAO,EAAE,sBAAsB;GAEjC,OAAO,UAAU,QAAQ,EAAE,iBAAiB,IAAI;EAClD,CAAC;EACD,MAAM,gBAAgB,eAAe,MAAM,kBAAkB,aAAwB;EAIrF,eAAe,cAAc,OAAe;GAC1C,SAAS,QAAQ,MAAM,WAAW,KAAK;GACvC,WAAW;EACb;EACA,SAAS,cAAc;GACrB,SAAS,QAAQ;GACjB,UAAU,QAAQ;EACpB;EACA,eAAe,SAAwB;GACrC,cAAc,QAAQ;GACtB,IAAI,CAAC,SAAS,SAAS,CAAC,cAAc,OACpC,CAAC,WAAW,OAA4C,QAAQ;GAElE,WAAW;EACb;EACA,SAAS,aAAmB;GAC1B,KAAK,OAAO;EACd;EACA,SAAS,aAAmB;GAC1B,KAAK,UAAU;EACjB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mBCxGW,OAAM,0BAAyB;;;CAWZ,OAAM;;;;qBAlBlC,YA0Ce,OAAA,iBAAA;EAzCZ,YAAU,OAAA;EACV,eAAa,OAAA;EACb,UAAU;EACV,SAAO,OAAA;;EAEG,MAAI,cACsD;GAAnE,mBAAmE,OAAnE,YAAmE,gBAA3B,OAAA,kBAAkB,GAAA,CAAA;IAC7C,OAAA,gBAAb,WAA0C,KAAA,QAAA,QAAA,EAAA,KAAA,EAAA,CAAA,KAAA,UAAA,GAC1C,YAQE,OAAA,mBAAA;;IANC,gBAAyB,OAAA,iBAAa,CAAK,OAAA,aAAS,CAAK,OAAA,cAA0B,OAAA,EAAC,qBAAA,IAAsC,KAAA;IAK1H,cAAY,OAAA;;GAEJ,OAAA,eAAA,UAAA,GAAX,mBAAsE,OAAtE,YAAsE,gBAApB,OAAA,WAAW,GAAA,CAAA,KAAA,mBAAA,QAAA,IAAA;;EAEpD,QAAM,cAGN;GAFT,mBAES,UAAA;IAFD,OAAM;IAAW,SAAO,OAAA;sBAC3B,OAAA,EAAC,OAAA,CAAA,GAAA,CAAA;IAGG,OAAA,YAAA,UAAA,GADT,YAQE,OAAA,iBAAA;;IANA,KAAI;IACH,yBAAuB;IACxB,MAAK;IACL,SAAQ;IACP,UAAQ,OAAA;IACR,WAAS,OAAA;;IAGH,OAAA,aAAS,CAAK,OAAA,eAAA,UAAA,GADvB,mBAOS,UAAA;;IALP,OAAM;IACL,UAAU,OAAA,mBAAmB,OAAA;IAC7B,SAAO,OAAA;sBAEL,OAAA,EAAC,KAAA,CAAA,GAAA,GAAA,UAAA,KAAA,mBAAA,QAAA,IAAA"}

package/dist/{RecaptchaModal-DX9rAHUg.mjs → RecaptchaModal-dfMCfebx.mjs}

@@ -1,6 +1,6 @@
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
 import { t as ClassicLoading_default } from "./ClassicLoading-Crlw7cAx.mjs";
-import { A as state } from "./classicApi-CkDHWZG1.mjs";
+import { A as state } from "./classicApi-xjOqAovv.mjs";
 import { t as ClassicModal_default } from "./ClassicModal-CilwHp9p.mjs";
 import { t as CHECK_TOKEN_KEY } from "./keys-TjlLYNQE.mjs";
 import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, inject, openBlock, ref, renderSlot, toDisplayString, useTemplateRef, withCtx } from "vue";
@@ -145,4 +145,4 @@ var RecaptchaModal_default = /*#__PURE__*/ _plugin_vue_export_helper_default(Rec
 //#endregion
 export { RecaptchaModal_default as t };
 
-//# sourceMappingURL=RecaptchaModal-DX9rAHUg.mjs.map
+//# sourceMappingURL=RecaptchaModal-dfMCfebx.mjs.map

package/dist/RecaptchaModal-dfMCfebx.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RecaptchaModal-dfMCfebx.mjs","names":[],"sources":["../src/components/display/comments/modal/RecaptchaModal.vue","../src/components/display/comments/modal/RecaptchaModal.vue"],"sourcesContent":["<template>\n  <ClassicModal\n    :id-modal=\"idModal\"\n    :title-modal=\"titleModal\"\n    :closable=\"false\"\n    @close=\"closePopup\"\n  >\n    <template #body>\n      <div class=\"text-center text-danger\">{{ errorRecaptchaText }}</div>\n      <slot v-if=\"!isInTreatment\" name=\"form\" />\n      <ClassicLoading\n        v-else\n        :loading-text=\"\n          isInTreatment && !errorText && !successText\n            ? t('Loading content ...')\n            : undefined\n        \"\n        :error-text=\"errorText\"\n      />\n      <div v-if=\"successText\" class=\"text-center h3\">{{ successText }}</div>\n    </template>\n    <template #footer>\n      <button class=\"btn m-1\" @click=\"closePopup\">\n        {{ t(\"Close\") }}\n      </button>\n      <vue-recaptcha\n        v-if=\"!isVerify\"\n        ref=\"invisibleRecaptcha\"\n        :load-recaptcha-script=\"true\"\n        size=\"invisible\"\n        sitekey=\"6LfyP_4ZAAAAAPODj8nov2LvosIwcX0GYeBSungh\"\n        @verify=\"handleSuccess\"\n        @expired=\"handleError\"\n      />\n      <button\n        v-if=\"!errorText && !successText\"\n        class=\"btn btn-primary m-1\"\n        :disabled=\"disableValidate || isInTreatment\"\n        @click=\"submit\"\n      >\n        {{ t(\"Yes\") }}\n      </button>\n    </template>\n  </ClassicModal>\n</template>\n\n<script setup lang=\"ts\">\nimport { state } from \"../../../../stores/ParamSdkStore\";\nimport ClassicLoading from \"../../../form/ClassicLoading.vue\";\nimport ClassicModal from \"../../../misc/modal/ClassicModal.vue\";\nimport { CHECK_TOKEN_KEY } from \"../../../composable/keys\";\nimport { VueRecaptcha } from \"vue-recaptcha\";\nimport { computed, inject, ref, useTemplateRef } from \"vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \ndefineProps({\n  idModal: { default: undefined, type: String },\n  titleModal: { default: undefined, type: String },\n  disableValidate: { default: false, type: Boolean },\n  errorText: { default: undefined, type: String },\n  successText: { default: undefined, type: String },\n})\n\n//Emits\nconst emit = defineEmits([\"close\", \"validate\"]);\n\n//Data \nconst sendError = ref(false);\nconst isVerify = ref(false);\nconst isInTreatment = ref(false);\nconst captchRef = useTemplateRef('invisibleRecaptcha');\n\n\n//Composables\nconst { t } = useI18n();\n// checkToken is not defined in the SDK: it is resolved at runtime from the\n// consuming app's globally provided implementation (app.provide()), and\n// defaults to always-verified when the app hasn't provided one.\nconst checkToken = inject(CHECK_TOKEN_KEY, async () => true);\n\n//Computed\nconst errorRecaptchaText = computed(() =>{\n  if (isCaptchaTest.value) {\n    return t(\"Recaptcha not active\");\n  }\n  return sendError.value ? t(\"Recaptcha error\") : \"\";\n});\nconst isCaptchaTest = computed(() => state.generalParameters.isCaptchaTest as boolean);\n\n\n//Methods\nasync function handleSuccess(token: string) {\n  isVerify.value = await checkToken(token);\n  sendAction();\n}\nfunction handleError() {\n  isVerify.value = false;\n  sendError.value = true;\n}\nasync function submit(): Promise<void> {\n  isInTreatment.value = true;\n  if (!isVerify.value && !isCaptchaTest.value) {\n    (captchRef?.value as InstanceType<typeof VueRecaptcha>).execute();\n  }\n  sendAction();\n}\nfunction closePopup(): void {\n  emit(\"close\");\n}\nfunction sendAction(): void {\n  emit(\"validate\");\n}\n</script>\n","<template>\n  <ClassicModal\n    :id-modal=\"idModal\"\n    :title-modal=\"titleModal\"\n    :closable=\"false\"\n    @close=\"closePopup\"\n  >\n    <template #body>\n      <div class=\"text-center text-danger\">{{ errorRecaptchaText }}</div>\n      <slot v-if=\"!isInTreatment\" name=\"form\" />\n      <ClassicLoading\n        v-else\n        :loading-text=\"\n          isInTreatment && !errorText && !successText\n            ? t('Loading content ...')\n            : undefined\n        \"\n        :error-text=\"errorText\"\n      />\n      <div v-if=\"successText\" class=\"text-center h3\">{{ successText }}</div>\n    </template>\n    <template #footer>\n      <button class=\"btn m-1\" @click=\"closePopup\">\n        {{ t(\"Close\") }}\n      </button>\n      <vue-recaptcha\n        v-if=\"!isVerify\"\n        ref=\"invisibleRecaptcha\"\n        :load-recaptcha-script=\"true\"\n        size=\"invisible\"\n        sitekey=\"6LfyP_4ZAAAAAPODj8nov2LvosIwcX0GYeBSungh\"\n        @verify=\"handleSuccess\"\n        @expired=\"handleError\"\n      />\n      <button\n        v-if=\"!errorText && !successText\"\n        class=\"btn btn-primary m-1\"\n        :disabled=\"disableValidate || isInTreatment\"\n        @click=\"submit\"\n      >\n        {{ t(\"Yes\") }}\n      </button>\n    </template>\n  </ClassicModal>\n</template>\n\n<script setup lang=\"ts\">\nimport { state } from \"../../../../stores/ParamSdkStore\";\nimport ClassicLoading from \"../../../form/ClassicLoading.vue\";\nimport ClassicModal from \"../../../misc/modal/ClassicModal.vue\";\nimport { CHECK_TOKEN_KEY } from \"../../../composable/keys\";\nimport { VueRecaptcha } from \"vue-recaptcha\";\nimport { computed, inject, ref, useTemplateRef } from \"vue\";\nimport { useI18n } from \"vue-i18n\";\n\n//Props \ndefineProps({\n  idModal: { default: undefined, type: String },\n  titleModal: { default: undefined, type: String },\n  disableValidate: { default: false, type: Boolean },\n  errorText: { default: undefined, type: String },\n  successText: { default: undefined, type: String },\n})\n\n//Emits\nconst emit = defineEmits([\"close\", \"validate\"]);\n\n//Data \nconst sendError = ref(false);\nconst isVerify = ref(false);\nconst isInTreatment = ref(false);\nconst captchRef = useTemplateRef('invisibleRecaptcha');\n\n\n//Composables\nconst { t } = useI18n();\n// checkToken is not defined in the SDK: it is resolved at runtime from the\n// consuming app's globally provided implementation (app.provide()), and\n// defaults to always-verified when the app hasn't provided one.\nconst checkToken = inject(CHECK_TOKEN_KEY, async () => true);\n\n//Computed\nconst errorRecaptchaText = computed(() =>{\n  if (isCaptchaTest.value) {\n    return t(\"Recaptcha not active\");\n  }\n  return sendError.value ? t(\"Recaptcha error\") : \"\";\n});\nconst isCaptchaTest = computed(() => state.generalParameters.isCaptchaTest as boolean);\n\n\n//Methods\nasync function handleSuccess(token: string) {\n  isVerify.value = await checkToken(token);\n  sendAction();\n}\nfunction handleError() {\n  isVerify.value = false;\n  sendError.value = true;\n}\nasync function submit(): Promise<void> {\n  isInTreatment.value = true;\n  if (!isVerify.value && !isCaptchaTest.value) {\n    (captchRef?.value as InstanceType<typeof VueRecaptcha>).execute();\n  }\n  sendAction();\n}\nfunction closePopup(): void {\n  emit(\"close\");\n}\nfunction sendAction(): void {\n  emit(\"validate\");\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAiEA,MAAM,OAAO;EAGb,MAAM,YAAY,IAAI,KAAK;EAC3B,MAAM,WAAW,IAAI,KAAK;EAC1B,MAAM,gBAAgB,IAAI,KAAK;EAC/B,MAAM,YAAY,eAAe,oBAAoB;EAIrD,MAAM,EAAE,MAAM,QAAQ;EAItB,MAAM,aAAa,OAAO,iBAAiB,YAAY,IAAI;EAG3D,MAAM,qBAAqB,eAAc;GACvC,IAAI,cAAc,OAChB,OAAO,EAAE,sBAAsB;GAEjC,OAAO,UAAU,QAAQ,EAAE,iBAAiB,IAAI;EAClD,CAAC;EACD,MAAM,gBAAgB,eAAe,MAAM,kBAAkB,aAAwB;EAIrF,eAAe,cAAc,OAAe;GAC1C,SAAS,QAAQ,MAAM,WAAW,KAAK;GACvC,WAAW;EACb;EACA,SAAS,cAAc;GACrB,SAAS,QAAQ;GACjB,UAAU,QAAQ;EACpB;EACA,eAAe,SAAwB;GACrC,cAAc,QAAQ;GACtB,IAAI,CAAC,SAAS,SAAS,CAAC,cAAc,OACpC,CAAC,WAAW,OAA4C,QAAQ;GAElE,WAAW;EACb;EACA,SAAS,aAAmB;GAC1B,KAAK,OAAO;EACd;EACA,SAAS,aAAmB;GAC1B,KAAK,UAAU;EACjB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mBCxGW,OAAM,0BAAyB;;;CAWZ,OAAM;;;;qBAlBlC,YA0Ce,OAAA,iBAAA;EAzCZ,YAAU,OAAA;EACV,eAAa,OAAA;EACb,UAAU;EACV,SAAO,OAAA;;EAEG,MAAI,cACsD;GAAnE,mBAAmE,OAAnE,YAAmE,gBAA3B,OAAA,kBAAkB,GAAA,CAAA;IAC7C,OAAA,gBAAb,WAA0C,KAAA,QAAA,QAAA,EAAA,KAAA,EAAA,CAAA,KAAA,UAAA,GAC1C,YAQE,OAAA,mBAAA;;IANC,gBAAyB,OAAA,iBAAa,CAAK,OAAA,aAAS,CAAK,OAAA,cAA0B,OAAA,EAAC,qBAAA,IAAsC,KAAA;IAK1H,cAAY,OAAA;;GAEJ,OAAA,eAAA,UAAA,GAAX,mBAAsE,OAAtE,YAAsE,gBAApB,OAAA,WAAW,GAAA,CAAA,KAAA,mBAAA,QAAA,IAAA;;EAEpD,QAAM,cAGN;GAFT,mBAES,UAAA;IAFD,OAAM;IAAW,SAAO,OAAA;sBAC3B,OAAA,EAAC,OAAA,CAAA,GAAA,CAAA;IAGG,OAAA,YAAA,UAAA,GADT,YAQE,OAAA,iBAAA;;IANA,KAAI;IACH,yBAAuB;IACxB,MAAK;IACL,SAAQ;IACP,UAAQ,OAAA;IACR,WAAS,OAAA;;IAGH,OAAA,aAAS,CAAK,OAAA,eAAA,UAAA,GADvB,mBAOS,UAAA;;IALP,OAAM;IACL,UAAU,OAAA,mBAAmB,OAAA;IAC7B,SAAO,OAAA;sBAEL,OAAA,EAAC,KAAA,CAAA,GAAA,GAAA,UAAA,KAAA,mBAAA,QAAA,IAAA"}

package/dist/ReportAbuseModal-Bxr7NTvH.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReportAbuseModal-Bxr7NTvH.mjs","names":[],"sources":["../src/components/display/comments/modal/ReportAbuseModal.vue","../src/components/display/comments/modal/ReportAbuseModal.vue"],"sourcesContent":["<template>\n  <RecaptchaModal\n    id-modal=\"report-abuse-modal\"\n    :title-modal=\"t('Report abuse')\"\n    :disable-validate=\"errorName || abuseDescriptionError\"\n    :error-text=\"errorSendAbuse\"\n    :success-text=\"successText\"\n    @close=\"emit('close')\"\n    @validate=\"reportAbuse\"\n  >\n    <template #form>\n      <ClassicInputText\n        v-if=\"!commentStore.commentUser?.name\"\n        v-model:text-init=\"name\"\n        v-model:error-variable=\"errorName\"\n        input-id=\"comment-user-name\"\n        focus\n        :label=\"t('Let\\'s get acquainted :')\"\n        :max-length=\"Constants.MAX_COMMENT_NAME\"\n        :placeholder=\"t('Your name')\"\n        autocomplete-type=\"name\"\n      />\n      <ClassicInputText\n        v-model:text-init=\"abuseDescription\"\n        v-model:error-variable=\"abuseDescriptionError\"\n        :is-textarea=\"true\"\n        input-id=\"abuse-description\"\n        :label=\"t('Describe the reason for the report')\"\n        :max-length=\"Constants.MAX_COMMENT\"\n        :focus=\"true\"\n      />\n    </template>\n  </RecaptchaModal>\n</template>\n\n<script setup lang=\"ts\">\nimport Constants from \"../../../../../public/config\";\nimport ClassicInputText from \"../../../form/ClassicInputText.vue\";\nimport RecaptchaModal from \"./RecaptchaModal.vue\";\nimport { Ref, ref } from \"vue\";\nimport { useCommentStore } from \"../../../../stores/CommentStore\";\nimport classicApi from \"../../../../api/classicApi\";\nimport {\n  CommentAbuseInfo,\n  CommentPodcast,\n} from \"@/stores/class/general/comment\";\nimport { useI18n } from \"vue-i18n\";\n\n\n//Props \nconst props = defineProps({\n  comment: { default: undefined, type: Object as () => CommentPodcast },\n})\n\n//Emits\nconst emit = defineEmits([\"close\", \"update:comment\"]);\n\n//Data \nconst errorName = ref(false);\nconst name: Ref<string | undefined> = ref(undefined);\nconst abuseDescription: Ref<string | undefined> = ref(undefined);\nconst abuseDescriptionError = ref(true);\nconst errorSendAbuse: Ref<string | undefined> = ref(undefined);\nconst successText: Ref<string | undefined> = ref(undefined);\n\n\n//Composables\nconst { t } = useI18n();\nconst commentStore = useCommentStore();\n\n//Methods\nasync function reportAbuse(): Promise<void> {\n  if (!commentStore.commentUser?.name) {\n    commentStore.setCommentUser(name.value ?? \"\");\n  }\n  try {\n    const abuseObject = {\n      commentId: props.comment?.commentId,\n      description: abuseDescription.value,\n      uuid: commentStore.commentUser?.uuid,\n    };\n    const commentAbuseInfo = await classicApi.postData<CommentAbuseInfo>({\n      api: 2,\n      path: \"abuse/\",\n      dataToSend: abuseObject,\n    });\n    emit(\"update:comment\", {\n      ...props.comment,\n      ...{ abuse: commentAbuseInfo.abuseCount },\n    });\n    successText.value = t(\"Thank you for reporting abuse\");\n  } catch {\n    errorSendAbuse.value = t(\n      \"Error occurs while post your comment...\",\n    );\n  }\n}\n</script>\n","<template>\n  <RecaptchaModal\n    id-modal=\"report-abuse-modal\"\n    :title-modal=\"t('Report abuse')\"\n    :disable-validate=\"errorName || abuseDescriptionError\"\n    :error-text=\"errorSendAbuse\"\n    :success-text=\"successText\"\n    @close=\"emit('close')\"\n    @validate=\"reportAbuse\"\n  >\n    <template #form>\n      <ClassicInputText\n        v-if=\"!commentStore.commentUser?.name\"\n        v-model:text-init=\"name\"\n        v-model:error-variable=\"errorName\"\n        input-id=\"comment-user-name\"\n        focus\n        :label=\"t('Let\\'s get acquainted :')\"\n        :max-length=\"Constants.MAX_COMMENT_NAME\"\n        :placeholder=\"t('Your name')\"\n        autocomplete-type=\"name\"\n      />\n      <ClassicInputText\n        v-model:text-init=\"abuseDescription\"\n        v-model:error-variable=\"abuseDescriptionError\"\n        :is-textarea=\"true\"\n        input-id=\"abuse-description\"\n        :label=\"t('Describe the reason for the report')\"\n        :max-length=\"Constants.MAX_COMMENT\"\n        :focus=\"true\"\n      />\n    </template>\n  </RecaptchaModal>\n</template>\n\n<script setup lang=\"ts\">\nimport Constants from \"../../../../../public/config\";\nimport ClassicInputText from \"../../../form/ClassicInputText.vue\";\nimport RecaptchaModal from \"./RecaptchaModal.vue\";\nimport { Ref, ref } from \"vue\";\nimport { useCommentStore } from \"../../../../stores/CommentStore\";\nimport classicApi from \"../../../../api/classicApi\";\nimport {\n  CommentAbuseInfo,\n  CommentPodcast,\n} from \"@/stores/class/general/comment\";\nimport { useI18n } from \"vue-i18n\";\n\n\n//Props \nconst props = defineProps({\n  comment: { default: undefined, type: Object as () => CommentPodcast },\n})\n\n//Emits\nconst emit = defineEmits([\"close\", \"update:comment\"]);\n\n//Data \nconst errorName = ref(false);\nconst name: Ref<string | undefined> = ref(undefined);\nconst abuseDescription: Ref<string | undefined> = ref(undefined);\nconst abuseDescriptionError = ref(true);\nconst errorSendAbuse: Ref<string | undefined> = ref(undefined);\nconst successText: Ref<string | undefined> = ref(undefined);\n\n\n//Composables\nconst { t } = useI18n();\nconst commentStore = useCommentStore();\n\n//Methods\nasync function reportAbuse(): Promise<void> {\n  if (!commentStore.commentUser?.name) {\n    commentStore.setCommentUser(name.value ?? \"\");\n  }\n  try {\n    const abuseObject = {\n      commentId: props.comment?.commentId,\n      description: abuseDescription.value,\n      uuid: commentStore.commentUser?.uuid,\n    };\n    const commentAbuseInfo = await classicApi.postData<CommentAbuseInfo>({\n      api: 2,\n      path: \"abuse/\",\n      dataToSend: abuseObject,\n    });\n    emit(\"update:comment\", {\n      ...props.comment,\n      ...{ abuse: commentAbuseInfo.abuseCount },\n    });\n    successText.value = t(\"Thank you for reporting abuse\");\n  } catch {\n    errorSendAbuse.value = t(\n      \"Error occurs while post your comment...\",\n    );\n  }\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;EAkDA,MAAM,QAAQ;EAKd,MAAM,OAAO;EAGb,MAAM,YAAY,IAAI,KAAK;EAC3B,MAAM,OAAgC,IAAI,KAAA,CAAS;EACnD,MAAM,mBAA4C,IAAI,KAAA,CAAS;EAC/D,MAAM,wBAAwB,IAAI,IAAI;EACtC,MAAM,iBAA0C,IAAI,KAAA,CAAS;EAC7D,MAAM,cAAuC,IAAI,KAAA,CAAS;EAI1D,MAAM,EAAE,MAAM,QAAQ;EACtB,MAAM,eAAe,gBAAgB;EAGrC,eAAe,cAA6B;GAC1C,IAAI,CAAC,aAAa,aAAa,MAC7B,aAAa,eAAe,KAAK,SAAS,EAAE;GAE9C,IAAI;IACF,MAAM,cAAc;KAClB,WAAW,MAAM,SAAS;KAC1B,aAAa,iBAAiB;KAC9B,MAAM,aAAa,aAAa;IAClC;IACA,MAAM,mBAAmB,MAAM,mBAAW,SAA2B;KACnE,KAAK;KACL,MAAM;KACN,YAAY;IACd,CAAC;IACD,KAAK,kBAAkB;KACrB,GAAG,MAAM;KACJ,OAAO,iBAAiB;IAC/B,CAAC;IACD,YAAY,QAAQ,EAAE,+BAA+B;GACvD,QAAQ;IACN,eAAe,QAAQ,EACrB,yCACF;GACF;EACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBC/FE,YA+BiB,OAAA,mBAAA;EA9Bf,YAAS;EACR,eAAa,OAAA,EAAC,cAAA;EACd,oBAAkB,OAAA,aAAa,OAAA;EAC/B,cAAY,OAAA;EACZ,gBAAc,OAAA;EACd,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,OAAA,KAAI,OAAA;EACX,YAAU,OAAA;;EAEA,MAAI,cAWX,CAAA,CATO,OAAA,aAAa,aAAa,QAAA,UAAA,GADnC,YAUE,OAAA,qBAAA;;GARQ,aAAW,OAAA;8DAAA,OAAA,OAAI;GACf,kBAAgB,OAAA;mEAAA,OAAA,YAAS;GACjC,YAAS;GACT,OAAA;GACC,OAAO,OAAA,EAAC,wBAAA;GACR,cAAY,OAAA,UAAU;GACtB,aAAa,OAAA,EAAC,WAAA;GACf,qBAAkB;;;;;;;0CAEpB,YAQE,OAAA,qBAAA;GAPQ,aAAW,OAAA;8DAAA,OAAA,mBAAgB;GAC3B,kBAAgB,OAAA;mEAAA,OAAA,wBAAqB;GAC5C,eAAa;GACd,YAAS;GACR,OAAO,OAAA,EAAC,oCAAA;GACR,cAAY,OAAA,UAAU;GACtB,OAAO"}

package/dist/{ReportAbuseModal-CYCRaFAY.mjs → ReportAbuseModal-DZKRbYXJ.mjs}

@@ -1,9 +1,9 @@
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
-import { t as classicApi_default } from "./classicApi-CkDHWZG1.mjs";
-import { t as useCommentStore } from "./CommentStore-Dv7j94Uo.mjs";
+import { t as classicApi_default } from "./classicApi-xjOqAovv.mjs";
+import { t as useCommentStore } from "./CommentStore-ClU882RI.mjs";
 import { t as config_default } from "./config-C73GMJpz.mjs";
 import { t as ClassicInputText_default } from "./ClassicInputText-D2wR2cwa.mjs";
-import { t as RecaptchaModal_default } from "./RecaptchaModal-DX9rAHUg.mjs";
+import { t as RecaptchaModal_default } from "./RecaptchaModal-dfMCfebx.mjs";
 import { createBlock, createCommentVNode, createVNode, defineComponent, openBlock, ref, withCtx } from "vue";
 import { useI18n } from "vue-i18n";
 //#region src/components/display/comments/modal/ReportAbuseModal.vue?vue&type=script&setup=true&lang.ts
@@ -131,4 +131,4 @@ var ReportAbuseModal_default = /*#__PURE__*/ _plugin_vue_export_helper_default(R
 //#endregion
 export { ReportAbuseModal_default as default };
 
-//# sourceMappingURL=ReportAbuseModal-CYCRaFAY.mjs.map
+//# sourceMappingURL=ReportAbuseModal-DZKRbYXJ.mjs.map

package/dist/ReportAbuseModal-DZKRbYXJ.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReportAbuseModal-DZKRbYXJ.mjs","names":[],"sources":["../src/components/display/comments/modal/ReportAbuseModal.vue","../src/components/display/comments/modal/ReportAbuseModal.vue"],"sourcesContent":["<template>\n  <RecaptchaModal\n    id-modal=\"report-abuse-modal\"\n    :title-modal=\"t('Report abuse')\"\n    :disable-validate=\"errorName || abuseDescriptionError\"\n    :error-text=\"errorSendAbuse\"\n    :success-text=\"successText\"\n    @close=\"emit('close')\"\n    @validate=\"reportAbuse\"\n  >\n    <template #form>\n      <ClassicInputText\n        v-if=\"!commentStore.commentUser?.name\"\n        v-model:text-init=\"name\"\n        v-model:error-variable=\"errorName\"\n        input-id=\"comment-user-name\"\n        focus\n        :label=\"t('Let\\'s get acquainted :')\"\n        :max-length=\"Constants.MAX_COMMENT_NAME\"\n        :placeholder=\"t('Your name')\"\n        autocomplete-type=\"name\"\n      />\n      <ClassicInputText\n        v-model:text-init=\"abuseDescription\"\n        v-model:error-variable=\"abuseDescriptionError\"\n        :is-textarea=\"true\"\n        input-id=\"abuse-description\"\n        :label=\"t('Describe the reason for the report')\"\n        :max-length=\"Constants.MAX_COMMENT\"\n        :focus=\"true\"\n      />\n    </template>\n  </RecaptchaModal>\n</template>\n\n<script setup lang=\"ts\">\nimport Constants from \"../../../../../public/config\";\nimport ClassicInputText from \"../../../form/ClassicInputText.vue\";\nimport RecaptchaModal from \"./RecaptchaModal.vue\";\nimport { Ref, ref } from \"vue\";\nimport { useCommentStore } from \"../../../../stores/CommentStore\";\nimport classicApi from \"../../../../api/classicApi\";\nimport {\n  CommentAbuseInfo,\n  CommentPodcast,\n} from \"@/stores/class/general/comment\";\nimport { useI18n } from \"vue-i18n\";\n\n\n//Props \nconst props = defineProps({\n  comment: { default: undefined, type: Object as () => CommentPodcast },\n})\n\n//Emits\nconst emit = defineEmits([\"close\", \"update:comment\"]);\n\n//Data \nconst errorName = ref(false);\nconst name: Ref<string | undefined> = ref(undefined);\nconst abuseDescription: Ref<string | undefined> = ref(undefined);\nconst abuseDescriptionError = ref(true);\nconst errorSendAbuse: Ref<string | undefined> = ref(undefined);\nconst successText: Ref<string | undefined> = ref(undefined);\n\n\n//Composables\nconst { t } = useI18n();\nconst commentStore = useCommentStore();\n\n//Methods\nasync function reportAbuse(): Promise<void> {\n  if (!commentStore.commentUser?.name) {\n    commentStore.setCommentUser(name.value ?? \"\");\n  }\n  try {\n    const abuseObject = {\n      commentId: props.comment?.commentId,\n      description: abuseDescription.value,\n      uuid: commentStore.commentUser?.uuid,\n    };\n    const commentAbuseInfo = await classicApi.postData<CommentAbuseInfo>({\n      api: 2,\n      path: \"abuse/\",\n      dataToSend: abuseObject,\n    });\n    emit(\"update:comment\", {\n      ...props.comment,\n      ...{ abuse: commentAbuseInfo.abuseCount },\n    });\n    successText.value = t(\"Thank you for reporting abuse\");\n  } catch {\n    errorSendAbuse.value = t(\n      \"Error occurs while post your comment...\",\n    );\n  }\n}\n</script>\n","<template>\n  <RecaptchaModal\n    id-modal=\"report-abuse-modal\"\n    :title-modal=\"t('Report abuse')\"\n    :disable-validate=\"errorName || abuseDescriptionError\"\n    :error-text=\"errorSendAbuse\"\n    :success-text=\"successText\"\n    @close=\"emit('close')\"\n    @validate=\"reportAbuse\"\n  >\n    <template #form>\n      <ClassicInputText\n        v-if=\"!commentStore.commentUser?.name\"\n        v-model:text-init=\"name\"\n        v-model:error-variable=\"errorName\"\n        input-id=\"comment-user-name\"\n        focus\n        :label=\"t('Let\\'s get acquainted :')\"\n        :max-length=\"Constants.MAX_COMMENT_NAME\"\n        :placeholder=\"t('Your name')\"\n        autocomplete-type=\"name\"\n      />\n      <ClassicInputText\n        v-model:text-init=\"abuseDescription\"\n        v-model:error-variable=\"abuseDescriptionError\"\n        :is-textarea=\"true\"\n        input-id=\"abuse-description\"\n        :label=\"t('Describe the reason for the report')\"\n        :max-length=\"Constants.MAX_COMMENT\"\n        :focus=\"true\"\n      />\n    </template>\n  </RecaptchaModal>\n</template>\n\n<script setup lang=\"ts\">\nimport Constants from \"../../../../../public/config\";\nimport ClassicInputText from \"../../../form/ClassicInputText.vue\";\nimport RecaptchaModal from \"./RecaptchaModal.vue\";\nimport { Ref, ref } from \"vue\";\nimport { useCommentStore } from \"../../../../stores/CommentStore\";\nimport classicApi from \"../../../../api/classicApi\";\nimport {\n  CommentAbuseInfo,\n  CommentPodcast,\n} from \"@/stores/class/general/comment\";\nimport { useI18n } from \"vue-i18n\";\n\n\n//Props \nconst props = defineProps({\n  comment: { default: undefined, type: Object as () => CommentPodcast },\n})\n\n//Emits\nconst emit = defineEmits([\"close\", \"update:comment\"]);\n\n//Data \nconst errorName = ref(false);\nconst name: Ref<string | undefined> = ref(undefined);\nconst abuseDescription: Ref<string | undefined> = ref(undefined);\nconst abuseDescriptionError = ref(true);\nconst errorSendAbuse: Ref<string | undefined> = ref(undefined);\nconst successText: Ref<string | undefined> = ref(undefined);\n\n\n//Composables\nconst { t } = useI18n();\nconst commentStore = useCommentStore();\n\n//Methods\nasync function reportAbuse(): Promise<void> {\n  if (!commentStore.commentUser?.name) {\n    commentStore.setCommentUser(name.value ?? \"\");\n  }\n  try {\n    const abuseObject = {\n      commentId: props.comment?.commentId,\n      description: abuseDescription.value,\n      uuid: commentStore.commentUser?.uuid,\n    };\n    const commentAbuseInfo = await classicApi.postData<CommentAbuseInfo>({\n      api: 2,\n      path: \"abuse/\",\n      dataToSend: abuseObject,\n    });\n    emit(\"update:comment\", {\n      ...props.comment,\n      ...{ abuse: commentAbuseInfo.abuseCount },\n    });\n    successText.value = t(\"Thank you for reporting abuse\");\n  } catch {\n    errorSendAbuse.value = t(\n      \"Error occurs while post your comment...\",\n    );\n  }\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;EAkDA,MAAM,QAAQ;EAKd,MAAM,OAAO;EAGb,MAAM,YAAY,IAAI,KAAK;EAC3B,MAAM,OAAgC,IAAI,KAAA,CAAS;EACnD,MAAM,mBAA4C,IAAI,KAAA,CAAS;EAC/D,MAAM,wBAAwB,IAAI,IAAI;EACtC,MAAM,iBAA0C,IAAI,KAAA,CAAS;EAC7D,MAAM,cAAuC,IAAI,KAAA,CAAS;EAI1D,MAAM,EAAE,MAAM,QAAQ;EACtB,MAAM,eAAe,gBAAgB;EAGrC,eAAe,cAA6B;GAC1C,IAAI,CAAC,aAAa,aAAa,MAC7B,aAAa,eAAe,KAAK,SAAS,EAAE;GAE9C,IAAI;IACF,MAAM,cAAc;KAClB,WAAW,MAAM,SAAS;KAC1B,aAAa,iBAAiB;KAC9B,MAAM,aAAa,aAAa;IAClC;IACA,MAAM,mBAAmB,MAAM,mBAAW,SAA2B;KACnE,KAAK;KACL,MAAM;KACN,YAAY;IACd,CAAC;IACD,KAAK,kBAAkB;KACrB,GAAG,MAAM;KACJ,OAAO,iBAAiB;IAC/B,CAAC;IACD,YAAY,QAAQ,EAAE,+BAA+B;GACvD,QAAQ;IACN,eAAe,QAAQ,EACrB,yCACF;GACF;EACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBC/FE,YA+BiB,OAAA,mBAAA;EA9Bf,YAAS;EACR,eAAa,OAAA,EAAC,cAAA;EACd,oBAAkB,OAAA,aAAa,OAAA;EAC/B,cAAY,OAAA;EACZ,gBAAc,OAAA;EACd,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,OAAA,KAAI,OAAA;EACX,YAAU,OAAA;;EAEA,MAAI,cAWX,CAAA,CATO,OAAA,aAAa,aAAa,QAAA,UAAA,GADnC,YAUE,OAAA,qBAAA;;GARQ,aAAW,OAAA;8DAAA,OAAA,OAAI;GACf,kBAAgB,OAAA;mEAAA,OAAA,YAAS;GACjC,YAAS;GACT,OAAA;GACC,OAAO,OAAA,EAAC,wBAAA;GACR,cAAY,OAAA,UAAU;GACtB,aAAa,OAAA,EAAC,WAAA;GACf,qBAAkB;;;;;;;0CAEpB,YAQE,OAAA,qBAAA;GAPQ,aAAW,OAAA;8DAAA,OAAA,mBAAgB;GAC3B,kBAAgB,OAAA;mEAAA,OAAA,wBAAqB;GAC5C,eAAa;GACd,YAAS;GACR,OAAO,OAAA,EAAC,oCAAA;GACR,cAAY,OAAA,UAAU;GACtB,OAAO"}

package/dist/RightsIndicator-BgW0q3af.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RightsIndicator-BgW0q3af.mjs","names":[],"sources":["../src/components/display/RightsIndicator.vue","../src/components/display/RightsIndicator.vue"],"sourcesContent":["<template>\n    <div\n        v-if=\"displayIndicator\"\n        :class=\"{ inline: inline }\"\n        title=\"\"\n    >\n        <RightsWrapper\n            v-if=\"!text\"\n            v-slot=\"{ id }\"\n            v-bind=\"props\"\n        >\n            <Icon\n                :id=\"id\"\n                class=\"rights-indicator-icon\"\n                :class=\"{ invisible: hasAccess }\"\n                aria-hidden=\"true\"\n                fill-color=\"var(--octopus-primary)\"\n                :size=\"inline ? 20 : 24\"\n            />\n        </RightsWrapper>\n        <div aria-live=\"polite\" aria-atomic=\"true\">\n            <ClassicAlert\n                v-if=\"text && !hasAccess\"\n                type=\"info\"\n            >\n                <template #icon>\n                    <Icon\n                        aria-hidden=\"true\"\n                        fill-color=\"var(--octopus-primary)\"\n                    />\n                </template>\n                {{ message }}\n            </ClassicAlert>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ClassicAlert from '../misc/ClassicAlert.vue';\nimport Icons from '@/components/icons'; \nimport RightsWrapper from './RightsWrapper.vue'; \nimport { RightsProps, useRightsIndicator } from '../composable/useRightsIndicator';\n\nconst Icon = Icons.RightsIndicator;\n\ntype PropsBase = RightsProps & {\n    /** Display reason as text instead of only tooltip */\n    text?: boolean;\n    /** Use inline instead of block */\n    inline?: boolean;\n}\n\nconst props = defineProps<PropsBase>();\n\nconst { displayIndicator, hasAccess, message } = useRightsIndicator(props);\n</script>\n\n<style scoped lang=\"scss\">\ndiv.inline {\n    display: inline;\n    // Properly align text with it\n    vertical-align: top;\n}\n\n.inline div {\n    display: inline;\n}\n\n.inline .rights-indicator-icon {\n    display: inline-flex;\n    // Propertly align content\n    position: relative;\n    bottom: -4px;\n    // Ensure it doesn't take place in the text\n    height: 1px;\n}\n\n.inline .invisible {\n    display: none;\n}\n\n/** Helper class to keep the data accessible for screen readers */\n.rights-visually-hidden {\n    position: absolute;\n    width: 1px;\n    height: 1px;\n    padding: 0;\n    margin: -1px;\n    overflow: hidden;\n    clip: rect(0, 0, 0, 0);\n    white-space: nowrap;\n    border: 0;\n}\n</style>\n","<template>\n    <div\n        v-if=\"displayIndicator\"\n        :class=\"{ inline: inline }\"\n        title=\"\"\n    >\n        <RightsWrapper\n            v-if=\"!text\"\n            v-slot=\"{ id }\"\n            v-bind=\"props\"\n        >\n            <Icon\n                :id=\"id\"\n                class=\"rights-indicator-icon\"\n                :class=\"{ invisible: hasAccess }\"\n                aria-hidden=\"true\"\n                fill-color=\"var(--octopus-primary)\"\n                :size=\"inline ? 20 : 24\"\n            />\n        </RightsWrapper>\n        <div aria-live=\"polite\" aria-atomic=\"true\">\n            <ClassicAlert\n                v-if=\"text && !hasAccess\"\n                type=\"info\"\n            >\n                <template #icon>\n                    <Icon\n                        aria-hidden=\"true\"\n                        fill-color=\"var(--octopus-primary)\"\n                    />\n                </template>\n                {{ message }}\n            </ClassicAlert>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ClassicAlert from '../misc/ClassicAlert.vue';\nimport Icons from '@/components/icons'; \nimport RightsWrapper from './RightsWrapper.vue'; \nimport { RightsProps, useRightsIndicator } from '../composable/useRightsIndicator';\n\nconst Icon = Icons.RightsIndicator;\n\ntype PropsBase = RightsProps & {\n    /** Display reason as text instead of only tooltip */\n    text?: boolean;\n    /** Use inline instead of block */\n    inline?: boolean;\n}\n\nconst props = defineProps<PropsBase>();\n\nconst { displayIndicator, hasAccess, message } = useRightsIndicator(props);\n</script>\n\n<style scoped lang=\"scss\">\ndiv.inline {\n    display: inline;\n    // Properly align text with it\n    vertical-align: top;\n}\n\n.inline div {\n    display: inline;\n}\n\n.inline .rights-indicator-icon {\n    display: inline-flex;\n    // Propertly align content\n    position: relative;\n    bottom: -4px;\n    // Ensure it doesn't take place in the text\n    height: 1px;\n}\n\n.inline .invisible {\n    display: none;\n}\n\n/** Helper class to keep the data accessible for screen readers */\n.rights-visually-hidden {\n    position: absolute;\n    width: 1px;\n    height: 1px;\n    padding: 0;\n    margin: -1px;\n    overflow: hidden;\n    clip: rect(0, 0, 0, 0);\n    white-space: nowrap;\n    border: 0;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2CA,MAAM,OAAO,cAAM;EASnB,MAAM,QAAQ;EAEd,MAAM,EAAE,kBAAkB,WAAW,YAAY,mBAAmB,KAAK;;;;;;;;;;;;;;;;;;;;;CClC5D,aAAU;CAAS,eAAY;;;QAlB9B,OAAA,oBAAA,UAAA,GADV,mBAiCM,OAAA;;EA/BD,OAAK,eAAA,EAAA,QAAY,OAAA,OAAM,CAAA;EACxB,OAAM;MAGK,OAAA,QAAA,UAAA,GADX,YAagB,OAAA,kBAAA,eAAA,WAAA,EAAA,KAAA,EAAA,GAVJ,OAAA,KAAK,CAAA,GAAA;oBASX,EAVQ,SAAE,CAGZ,YAOE,OAAA,SAAA;GANO;GACL,OAAK,eAAA,CAAC,yBAAuB,EAAA,WACR,OAAA,UAAS,CAAA,CAAA;GAC9B,eAAY;GACZ,cAAW;GACV,MAAM,OAAA,SAAM,KAAA;;;;;;;6CAGrB,mBAaM,OAbN,YAaM,CAXQ,OAAA,QAAI,CAAK,OAAA,aAAA,UAAA,GADnB,YAWe,OAAA,iBAAA;;EATX,MAAK;;EAEM,MAAI,cAIT,CAHF,YAGE,OAAA,SAAA;GAFE,eAAY;GACZ,cAAW;;yBAGnB,CAAA,gBADW,MACX,gBAAG,OAAA,OAAO,GAAA,CAAA,CAAA,CAAA"}

package/dist/RightsIndicator-BtzqiPWc.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RightsIndicator-BtzqiPWc.mjs","names":[],"sources":["../src/components/display/RightsIndicator.vue","../src/components/display/RightsIndicator.vue"],"sourcesContent":["<template>\n    <div\n        v-if=\"displayIndicator\"\n        :class=\"{ inline: inline }\"\n        title=\"\"\n    >\n        <RightsWrapper\n            v-if=\"!text\"\n            v-slot=\"{ id }\"\n            v-bind=\"props\"\n        >\n            <Icon\n                :id=\"id\"\n                class=\"rights-indicator-icon\"\n                :class=\"{ invisible: hasAccess }\"\n                aria-hidden=\"true\"\n                fill-color=\"var(--octopus-primary)\"\n                :size=\"inline ? 20 : 24\"\n            />\n        </RightsWrapper>\n        <div aria-live=\"polite\" aria-atomic=\"true\">\n            <ClassicAlert\n                v-if=\"text && !hasAccess\"\n                type=\"info\"\n            >\n                <template #icon>\n                    <Icon\n                        aria-hidden=\"true\"\n                        fill-color=\"var(--octopus-primary)\"\n                    />\n                </template>\n                {{ message }}\n            </ClassicAlert>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ClassicAlert from '../misc/ClassicAlert.vue';\nimport Icons from '@/components/icons'; \nimport RightsWrapper from './RightsWrapper.vue'; \nimport { RightsProps, useRightsIndicator } from '../composable/useRightsIndicator';\n\nconst Icon = Icons.RightsIndicator;\n\ntype PropsBase = RightsProps & {\n    /** Display reason as text instead of only tooltip */\n    text?: boolean;\n    /** Use inline instead of block */\n    inline?: boolean;\n}\n\nconst props = defineProps<PropsBase>();\n\nconst { displayIndicator, hasAccess, message } = useRightsIndicator(props);\n</script>\n\n<style scoped lang=\"scss\">\ndiv.inline {\n    display: inline;\n    // Properly align text with it\n    vertical-align: top;\n}\n\n.inline div {\n    display: inline;\n}\n\n.inline .rights-indicator-icon {\n    display: inline-flex;\n    // Propertly align content\n    position: relative;\n    bottom: -4px;\n    // Ensure it doesn't take place in the text\n    height: 1px;\n}\n\n.inline .invisible {\n    display: none;\n}\n\n/** Helper class to keep the data accessible for screen readers */\n.rights-visually-hidden {\n    position: absolute;\n    width: 1px;\n    height: 1px;\n    padding: 0;\n    margin: -1px;\n    overflow: hidden;\n    clip: rect(0, 0, 0, 0);\n    white-space: nowrap;\n    border: 0;\n}\n</style>\n","<template>\n    <div\n        v-if=\"displayIndicator\"\n        :class=\"{ inline: inline }\"\n        title=\"\"\n    >\n        <RightsWrapper\n            v-if=\"!text\"\n            v-slot=\"{ id }\"\n            v-bind=\"props\"\n        >\n            <Icon\n                :id=\"id\"\n                class=\"rights-indicator-icon\"\n                :class=\"{ invisible: hasAccess }\"\n                aria-hidden=\"true\"\n                fill-color=\"var(--octopus-primary)\"\n                :size=\"inline ? 20 : 24\"\n            />\n        </RightsWrapper>\n        <div aria-live=\"polite\" aria-atomic=\"true\">\n            <ClassicAlert\n                v-if=\"text && !hasAccess\"\n                type=\"info\"\n            >\n                <template #icon>\n                    <Icon\n                        aria-hidden=\"true\"\n                        fill-color=\"var(--octopus-primary)\"\n                    />\n                </template>\n                {{ message }}\n            </ClassicAlert>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ClassicAlert from '../misc/ClassicAlert.vue';\nimport Icons from '@/components/icons'; \nimport RightsWrapper from './RightsWrapper.vue'; \nimport { RightsProps, useRightsIndicator } from '../composable/useRightsIndicator';\n\nconst Icon = Icons.RightsIndicator;\n\ntype PropsBase = RightsProps & {\n    /** Display reason as text instead of only tooltip */\n    text?: boolean;\n    /** Use inline instead of block */\n    inline?: boolean;\n}\n\nconst props = defineProps<PropsBase>();\n\nconst { displayIndicator, hasAccess, message } = useRightsIndicator(props);\n</script>\n\n<style scoped lang=\"scss\">\ndiv.inline {\n    display: inline;\n    // Properly align text with it\n    vertical-align: top;\n}\n\n.inline div {\n    display: inline;\n}\n\n.inline .rights-indicator-icon {\n    display: inline-flex;\n    // Propertly align content\n    position: relative;\n    bottom: -4px;\n    // Ensure it doesn't take place in the text\n    height: 1px;\n}\n\n.inline .invisible {\n    display: none;\n}\n\n/** Helper class to keep the data accessible for screen readers */\n.rights-visually-hidden {\n    position: absolute;\n    width: 1px;\n    height: 1px;\n    padding: 0;\n    margin: -1px;\n    overflow: hidden;\n    clip: rect(0, 0, 0, 0);\n    white-space: nowrap;\n    border: 0;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2CA,MAAM,OAAO,cAAM;EASnB,MAAM,QAAQ;EAEd,MAAM,EAAE,kBAAkB,WAAW,YAAY,mBAAmB,KAAK;;;;;;;;;;;;;;;;;;;;;CClC5D,aAAU;CAAS,eAAY;;;QAlB9B,OAAA,oBAAA,UAAA,GADV,mBAiCM,OAAA;;EA/BD,OAAK,eAAA,EAAA,QAAY,OAAA,OAAM,CAAA;EACxB,OAAM;MAGK,OAAA,QAAA,UAAA,GADX,YAagB,OAAA,kBAAA,eAAA,WAAA,EAAA,KAAA,EAAA,GAVJ,OAAA,KAAK,CAAA,GAAA;oBASX,EAVQ,SAAE,CAGZ,YAOE,OAAA,SAAA;GANO;GACL,OAAK,eAAA,CAAC,yBAAuB,EAAA,WACR,OAAA,UAAS,CAAA,CAAA;GAC9B,eAAY;GACZ,cAAW;GACV,MAAM,OAAA,SAAM,KAAA;;;;;;;6CAGrB,mBAaM,OAbN,YAaM,CAXQ,OAAA,QAAI,CAAK,OAAA,aAAA,UAAA,GADnB,YAWe,OAAA,iBAAA;;EATX,MAAK;;EAEM,MAAI,cAIT,CAHF,YAGE,OAAA,SAAA;GAFE,eAAY;GACZ,cAAW;;yBAGnB,CAAA,gBADW,MACX,gBAAG,OAAA,OAAO,GAAA,CAAA,CAAA,CAAA"}

package/dist/{RightsIndicator-qIU4_wiF.mjs → RightsIndicator-D5I3DOfO.mjs}

@@ -2,7 +2,7 @@ import { t as __exportAll } from "./rolldown-runtime-D7D4PA-g.mjs";
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
 import { t as icons_default } from "./icons-1GR2yFzw.mjs";
 import { t as ClassicAlert_default } from "./ClassicAlert-DUQplMvs.mjs";
-import { r as useRightsIndicator, t as RightsWrapper_default } from "./RightsWrapper-Cs6prZ3E.mjs";
+import { r as useRightsIndicator, t as RightsWrapper_default } from "./RightsWrapper-HasUbnny.mjs";
 import { createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeProps, normalizeClass, normalizeProps, openBlock, toDisplayString, withCtx } from "vue";
 //#region src/components/display/RightsIndicator.vue?vue&type=script&setup=true&lang.ts
 var RightsIndicator_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
@@ -121,4 +121,4 @@ var RightsIndicator_default = /*#__PURE__*/ _plugin_vue_export_helper_default(Ri
 //#endregion
 export { RightsIndicator_exports as n, RightsIndicator_default as t };
 
-//# sourceMappingURL=RightsIndicator-qIU4_wiF.mjs.map
+//# sourceMappingURL=RightsIndicator-D5I3DOfO.mjs.map

package/dist/RightsIndicator-D5I3DOfO.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RightsIndicator-D5I3DOfO.mjs","names":[],"sources":["../src/components/display/RightsIndicator.vue","../src/components/display/RightsIndicator.vue"],"sourcesContent":["<template>\n    <div\n        v-if=\"displayIndicator\"\n        :class=\"{ inline: inline }\"\n        title=\"\"\n    >\n        <RightsWrapper\n            v-if=\"!text\"\n            v-slot=\"{ id }\"\n            v-bind=\"props\"\n        >\n            <Icon\n                :id=\"id\"\n                class=\"rights-indicator-icon\"\n                :class=\"{ invisible: hasAccess }\"\n                aria-hidden=\"true\"\n                fill-color=\"var(--octopus-primary)\"\n                :size=\"inline ? 20 : 24\"\n            />\n        </RightsWrapper>\n        <div aria-live=\"polite\" aria-atomic=\"true\">\n            <ClassicAlert\n                v-if=\"text && !hasAccess\"\n                type=\"info\"\n            >\n                <template #icon>\n                    <Icon\n                        aria-hidden=\"true\"\n                        fill-color=\"var(--octopus-primary)\"\n                    />\n                </template>\n                {{ message }}\n            </ClassicAlert>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ClassicAlert from '../misc/ClassicAlert.vue';\nimport Icons from '@/components/icons'; \nimport RightsWrapper from './RightsWrapper.vue'; \nimport { RightsProps, useRightsIndicator } from '../composable/useRightsIndicator';\n\nconst Icon = Icons.RightsIndicator;\n\ntype PropsBase = RightsProps & {\n    /** Display reason as text instead of only tooltip */\n    text?: boolean;\n    /** Use inline instead of block */\n    inline?: boolean;\n}\n\nconst props = defineProps<PropsBase>();\n\nconst { displayIndicator, hasAccess, message } = useRightsIndicator(props);\n</script>\n\n<style scoped lang=\"scss\">\ndiv.inline {\n    display: inline;\n    // Properly align text with it\n    vertical-align: top;\n}\n\n.inline div {\n    display: inline;\n}\n\n.inline .rights-indicator-icon {\n    display: inline-flex;\n    // Propertly align content\n    position: relative;\n    bottom: -4px;\n    // Ensure it doesn't take place in the text\n    height: 1px;\n}\n\n.inline .invisible {\n    display: none;\n}\n\n/** Helper class to keep the data accessible for screen readers */\n.rights-visually-hidden {\n    position: absolute;\n    width: 1px;\n    height: 1px;\n    padding: 0;\n    margin: -1px;\n    overflow: hidden;\n    clip: rect(0, 0, 0, 0);\n    white-space: nowrap;\n    border: 0;\n}\n</style>\n","<template>\n    <div\n        v-if=\"displayIndicator\"\n        :class=\"{ inline: inline }\"\n        title=\"\"\n    >\n        <RightsWrapper\n            v-if=\"!text\"\n            v-slot=\"{ id }\"\n            v-bind=\"props\"\n        >\n            <Icon\n                :id=\"id\"\n                class=\"rights-indicator-icon\"\n                :class=\"{ invisible: hasAccess }\"\n                aria-hidden=\"true\"\n                fill-color=\"var(--octopus-primary)\"\n                :size=\"inline ? 20 : 24\"\n            />\n        </RightsWrapper>\n        <div aria-live=\"polite\" aria-atomic=\"true\">\n            <ClassicAlert\n                v-if=\"text && !hasAccess\"\n                type=\"info\"\n            >\n                <template #icon>\n                    <Icon\n                        aria-hidden=\"true\"\n                        fill-color=\"var(--octopus-primary)\"\n                    />\n                </template>\n                {{ message }}\n            </ClassicAlert>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ClassicAlert from '../misc/ClassicAlert.vue';\nimport Icons from '@/components/icons'; \nimport RightsWrapper from './RightsWrapper.vue'; \nimport { RightsProps, useRightsIndicator } from '../composable/useRightsIndicator';\n\nconst Icon = Icons.RightsIndicator;\n\ntype PropsBase = RightsProps & {\n    /** Display reason as text instead of only tooltip */\n    text?: boolean;\n    /** Use inline instead of block */\n    inline?: boolean;\n}\n\nconst props = defineProps<PropsBase>();\n\nconst { displayIndicator, hasAccess, message } = useRightsIndicator(props);\n</script>\n\n<style scoped lang=\"scss\">\ndiv.inline {\n    display: inline;\n    // Properly align text with it\n    vertical-align: top;\n}\n\n.inline div {\n    display: inline;\n}\n\n.inline .rights-indicator-icon {\n    display: inline-flex;\n    // Propertly align content\n    position: relative;\n    bottom: -4px;\n    // Ensure it doesn't take place in the text\n    height: 1px;\n}\n\n.inline .invisible {\n    display: none;\n}\n\n/** Helper class to keep the data accessible for screen readers */\n.rights-visually-hidden {\n    position: absolute;\n    width: 1px;\n    height: 1px;\n    padding: 0;\n    margin: -1px;\n    overflow: hidden;\n    clip: rect(0, 0, 0, 0);\n    white-space: nowrap;\n    border: 0;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2CA,MAAM,OAAO,cAAM;EASnB,MAAM,QAAQ;EAEd,MAAM,EAAE,kBAAkB,WAAW,YAAY,mBAAmB,KAAK;;;;;;;;;;;;;;;;;;;;;CClC5D,aAAU;CAAS,eAAY;;;QAlB9B,OAAA,oBAAA,UAAA,GADV,mBAiCM,OAAA;;EA/BD,OAAK,eAAA,EAAA,QAAY,OAAA,OAAM,CAAA;EACxB,OAAM;MAGK,OAAA,QAAA,UAAA,GADX,YAagB,OAAA,kBAAA,eAAA,WAAA,EAAA,KAAA,EAAA,GAVJ,OAAA,KAAK,CAAA,GAAA;oBASX,EAVQ,SAAE,CAGZ,YAOE,OAAA,SAAA;GANO;GACL,OAAK,eAAA,CAAC,yBAAuB,EAAA,WACR,OAAA,UAAS,CAAA,CAAA;GAC9B,eAAY;GACZ,cAAW;GACV,MAAM,OAAA,SAAM,KAAA;;;;;;;6CAGrB,mBAaM,OAbN,YAaM,CAXQ,OAAA,QAAI,CAAK,OAAA,aAAA,UAAA,GADnB,YAWe,OAAA,iBAAA;;EATX,MAAK;;EAEM,MAAI,cAIT,CAHF,YAGE,OAAA,SAAA;GAFE,eAAY;GACZ,cAAW;;yBAGnB,CAAA,gBADW,MACX,gBAAG,OAAA,OAAO,GAAA,CAAA,CAAA,CAAA"}

package/dist/RightsIndicator-NOZ05rEh.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RightsIndicator-NOZ05rEh.mjs","names":[],"sources":["../src/components/display/RightsIndicator.vue","../src/components/display/RightsIndicator.vue"],"sourcesContent":["<template>\n    <div\n        v-if=\"displayIndicator\"\n        :class=\"{ inline: inline }\"\n        title=\"\"\n    >\n        <RightsWrapper\n            v-if=\"!text\"\n            v-slot=\"{ id }\"\n            v-bind=\"props\"\n        >\n            <Icon\n                :id=\"id\"\n                class=\"rights-indicator-icon\"\n                :class=\"{ invisible: hasAccess }\"\n                aria-hidden=\"true\"\n                fill-color=\"var(--octopus-primary)\"\n                :size=\"inline ? 20 : 24\"\n            />\n        </RightsWrapper>\n        <div aria-live=\"polite\" aria-atomic=\"true\">\n            <ClassicAlert\n                v-if=\"text && !hasAccess\"\n                type=\"info\"\n            >\n                <template #icon>\n                    <Icon\n                        aria-hidden=\"true\"\n                        fill-color=\"var(--octopus-primary)\"\n                    />\n                </template>\n                {{ message }}\n            </ClassicAlert>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ClassicAlert from '../misc/ClassicAlert.vue';\nimport Icons from '@/components/icons'; \nimport RightsWrapper from './RightsWrapper.vue'; \nimport { RightsProps, useRightsIndicator } from '../composable/useRightsIndicator';\n\nconst Icon = Icons.RightsIndicator;\n\ntype PropsBase = RightsProps & {\n    /** Display reason as text instead of only tooltip */\n    text?: boolean;\n    /** Use inline instead of block */\n    inline?: boolean;\n}\n\nconst props = defineProps<PropsBase>();\n\nconst { displayIndicator, hasAccess, message } = useRightsIndicator(props);\n</script>\n\n<style scoped lang=\"scss\">\ndiv.inline {\n    display: inline;\n    // Properly align text with it\n    vertical-align: top;\n}\n\n.inline div {\n    display: inline;\n}\n\n.inline .rights-indicator-icon {\n    display: inline-flex;\n    // Propertly align content\n    position: relative;\n    bottom: -4px;\n    // Ensure it doesn't take place in the text\n    height: 1px;\n}\n\n.inline .invisible {\n    display: none;\n}\n\n/** Helper class to keep the data accessible for screen readers */\n.rights-visually-hidden {\n    position: absolute;\n    width: 1px;\n    height: 1px;\n    padding: 0;\n    margin: -1px;\n    overflow: hidden;\n    clip: rect(0, 0, 0, 0);\n    white-space: nowrap;\n    border: 0;\n}\n</style>\n","<template>\n    <div\n        v-if=\"displayIndicator\"\n        :class=\"{ inline: inline }\"\n        title=\"\"\n    >\n        <RightsWrapper\n            v-if=\"!text\"\n            v-slot=\"{ id }\"\n            v-bind=\"props\"\n        >\n            <Icon\n                :id=\"id\"\n                class=\"rights-indicator-icon\"\n                :class=\"{ invisible: hasAccess }\"\n                aria-hidden=\"true\"\n                fill-color=\"var(--octopus-primary)\"\n                :size=\"inline ? 20 : 24\"\n            />\n        </RightsWrapper>\n        <div aria-live=\"polite\" aria-atomic=\"true\">\n            <ClassicAlert\n                v-if=\"text && !hasAccess\"\n                type=\"info\"\n            >\n                <template #icon>\n                    <Icon\n                        aria-hidden=\"true\"\n                        fill-color=\"var(--octopus-primary)\"\n                    />\n                </template>\n                {{ message }}\n            </ClassicAlert>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport ClassicAlert from '../misc/ClassicAlert.vue';\nimport Icons from '@/components/icons'; \nimport RightsWrapper from './RightsWrapper.vue'; \nimport { RightsProps, useRightsIndicator } from '../composable/useRightsIndicator';\n\nconst Icon = Icons.RightsIndicator;\n\ntype PropsBase = RightsProps & {\n    /** Display reason as text instead of only tooltip */\n    text?: boolean;\n    /** Use inline instead of block */\n    inline?: boolean;\n}\n\nconst props = defineProps<PropsBase>();\n\nconst { displayIndicator, hasAccess, message } = useRightsIndicator(props);\n</script>\n\n<style scoped lang=\"scss\">\ndiv.inline {\n    display: inline;\n    // Properly align text with it\n    vertical-align: top;\n}\n\n.inline div {\n    display: inline;\n}\n\n.inline .rights-indicator-icon {\n    display: inline-flex;\n    // Propertly align content\n    position: relative;\n    bottom: -4px;\n    // Ensure it doesn't take place in the text\n    height: 1px;\n}\n\n.inline .invisible {\n    display: none;\n}\n\n/** Helper class to keep the data accessible for screen readers */\n.rights-visually-hidden {\n    position: absolute;\n    width: 1px;\n    height: 1px;\n    padding: 0;\n    margin: -1px;\n    overflow: hidden;\n    clip: rect(0, 0, 0, 0);\n    white-space: nowrap;\n    border: 0;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2CA,MAAM,OAAO,cAAM;EASnB,MAAM,QAAQ;EAEd,MAAM,EAAE,kBAAkB,WAAW,YAAY,mBAAmB,KAAK;;;;;;;;;;;;;;;;;;;;;CClC5D,aAAU;CAAS,eAAY;;;QAlB9B,OAAA,oBAAA,UAAA,GADV,mBAiCM,OAAA;;EA/BD,OAAK,eAAA,EAAA,QAAY,OAAA,OAAM,CAAA;EACxB,OAAM;MAGK,OAAA,QAAA,UAAA,GADX,YAagB,OAAA,kBAAA,eAAA,WAAA,EAAA,KAAA,EAAA,GAVJ,OAAA,KAAK,CAAA,GAAA;oBASX,EAVQ,SAAE,CAGZ,YAOE,OAAA,SAAA;GANO;GACL,OAAK,eAAA,CAAC,yBAAuB,EAAA,WACR,OAAA,UAAS,CAAA,CAAA;GAC9B,eAAY;GACZ,cAAW;GACV,MAAM,OAAA,SAAM,KAAA;;;;;;;6CAGrB,mBAaM,OAbN,YAaM,CAXQ,OAAA,QAAI,CAAK,OAAA,aAAA,UAAA,GADnB,YAWe,OAAA,iBAAA;;EATX,MAAK;;EAEM,MAAI,cAIT,CAHF,YAGE,OAAA,SAAA;GAFE,eAAY;GACZ,cAAW;;yBAGnB,CAAA,gBADW,MACX,gBAAG,OAAA,OAAO,GAAA,CAAA,CAAA,CAAA"}