DiscoverTypeCarousel-BXBb_L14.chunk.mjs.map

{"version":3,"file":"DiscoverTypeCarousel-BXBb_L14.chunk.mjs","sources":["../build/frontend/apps/appstore/src/components/DiscoverType/DiscoverTypeCarousel.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2024 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n<template>\n\t<section :aria-roledescription=\"t('appstore', 'Carousel')\" :aria-labelledby=\"headingId ? `${headingId}` : undefined\">\n\t\t<h3 v-if=\"headline\" :id=\"headingId\">\n\t\t\t{{ translatedHeadline }}\n\t\t</h3>\n\t\t<div class=\"app-discover-carousel__wrapper\">\n\t\t\t<div class=\"app-discover-carousel__button-wrapper\">\n\t\t\t\t<NcButton\n\t\t\t\t\tclass=\"app-discover-carousel__button app-discover-carousel__button--previous\"\n\t\t\t\t\tvariant=\"tertiary-no-background\"\n\t\t\t\t\t:aria-label=\"t('appstore', 'Previous slide')\"\n\t\t\t\t\t:disabled=\"!hasPrevious\"\n\t\t\t\t\t@click=\"currentIndex -= 1\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiChevronLeft\" />\n\t\t\t\t\t</template>\n\t\t\t\t</NcButton>\n\t\t\t</div>\n\n\t\t\t<Transition :name=\"transitionName\" mode=\"out-in\">\n\t\t\t\t<DiscoverTypePost\n\t\t\t\t\tv-bind=\"shownElement\"\n\t\t\t\t\t:key=\"shownElement.id ?? currentIndex\"\n\t\t\t\t\t:aria-labelledby=\"`${internalId}-tab-${currentIndex}`\"\n\t\t\t\t\t:domId=\"`${internalId}-tabpanel-${currentIndex}`\"\n\t\t\t\t\tinline\n\t\t\t\t\trole=\"tabpanel\" />\n\t\t\t</Transition>\n\n\t\t\t<div class=\"app-discover-carousel__button-wrapper\">\n\t\t\t\t<NcButton\n\t\t\t\t\tclass=\"app-discover-carousel__button app-discover-carousel__button--next\"\n\t\t\t\t\tvariant=\"tertiary-no-background\"\n\t\t\t\t\t:aria-label=\"t('appstore', 'Next slide')\"\n\t\t\t\t\t:disabled=\"!hasNext\"\n\t\t\t\t\t@click=\"currentIndex += 1\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiChevronRight\" />\n\t\t\t\t\t</template>\n\t\t\t\t</NcButton>\n\t\t\t</div>\n\t\t</div>\n\t\t<div class=\"app-discover-carousel__tabs\" role=\"tablist\" :aria-label=\"t('appstore', 'Choose slide to display')\">\n\t\t\t<NcButton\n\t\t\t\tv-for=\"index of content.length\"\n\t\t\t\t:id=\"`${internalId}-tab-${index}`\"\n\t\t\t\t:key=\"index\"\n\t\t\t\t:aria-label=\"t('appstore', '{index} of {total}', { index, total: content.length })\"\n\t\t\t\t:aria-controls=\"`${internalId}-tabpanel-${index}`\"\n\t\t\t\t:aria-selected=\"`${currentIndex === (index - 1)}`\"\n\t\t\t\trole=\"tab\"\n\t\t\t\tvariant=\"tertiary-no-background\"\n\t\t\t\t@click=\"currentIndex = index - 1\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<NcIconSvgWrapper :path=\"currentIndex === (index - 1) ? mdiCircleSlice8 : mdiCircleOutline\" />\n\t\t\t\t</template>\n\t\t\t</NcButton>\n\t\t</div>\n\t</section>\n</template>\n\n<script setup lang=\"ts\">\nimport type { PropType } from 'vue'\nimport type { IAppDiscoverCarousel } from '../../apps-discover.d.ts'\n\nimport { mdiChevronLeft, mdiChevronRight, mdiCircleOutline, mdiCircleSlice8 } from '@mdi/js'\nimport { t } from '@nextcloud/l10n'\nimport { computed, nextTick, ref, watch } from 'vue'\nimport NcButton from '@nextcloud/vue/components/NcButton'\nimport NcIconSvgWrapper from '@nextcloud/vue/components/NcIconSvgWrapper'\nimport DiscoverTypePost from './DiscoverTypePost.vue'\nimport { useLocalizedValue } from '../../composables/useGetLocalizedValue.ts'\nimport { commonAppDiscoverProps } from './common.ts'\n\nconst props = defineProps({\n\t...commonAppDiscoverProps,\n\n\t/**\n\t * The content of the carousel\n\t */\n\tcontent: {\n\t\ttype: Array as PropType<IAppDiscoverCarousel['content']>,\n\t\trequired: true,\n\t},\n})\n\nconst translatedHeadline = useLocalizedValue(computed(() => props.headline))\n\nconst currentIndex = ref(Math.min(1, props.content.length - 1))\nconst shownElement = ref(props.content[currentIndex.value]!)\nconst hasNext = computed(() => currentIndex.value < (props.content.length - 1))\nconst hasPrevious = computed(() => currentIndex.value > 0)\n\nconst internalId = computed(() => props.id ?? (Math.random() + 1).toString(36).substring(7))\nconst headingId = computed(() => `${internalId.value}-h`)\n\nconst transitionName = ref('slide-in')\nwatch(() => currentIndex.value, (o, n) => {\n\tif (o < n) {\n\t\ttransitionName.value = 'slide-in'\n\t} else {\n\t\ttransitionName.value = 'slide-out'\n\t}\n\n\t// Wait next tick\n\tnextTick(() => {\n\t\tshownElement.value = props.content[currentIndex.value]!\n\t})\n})\n</script>\n\n<style scoped lang=\"scss\">\nh3 {\n\tfont-size: 24px;\n\tfont-weight: 600;\n\tmargin-block: 0 1em;\n}\n\n.app-discover-carousel {\n\t&__wrapper {\n\t\tdisplay: flex;\n\t}\n\n\t&__button {\n\t\tcolor: var(--color-text-maxcontrast);\n\t\tposition: absolute;\n\t\ttop: calc(50% - 22px); // 50% minus half of button height\n\n\t\t&-wrapper {\n\t\t\tposition: relative;\n\t\t}\n\n\t\t// See padding of discover section\n\t\t&--next {\n\t\t\tinset-inline-end: -54px;\n\t\t}\n\t\t&--previous {\n\t\t\tinset-inline-start: -54px;\n\t\t}\n\t}\n\n\t&__tabs {\n\t\tdisplay: flex;\n\t\tflex-direction: row;\n\t\tjustify-content: center;\n\n\t\t> * {\n\t\t\tcolor: var(--color-text-maxcontrast);\n\t\t}\n\t}\n}\n</style>\n\n<style>\n.slide-in-enter-active,\n.slide-in-leave-active,\n.slide-out-enter-active,\n.slide-out-leave-active {\n  transition: all .4s ease-out;\n}\n\n.slide-in-leave-to,\n.slide-out-enter {\n  opacity: 0;\n  transform: translateX(50%);\n}\n\n.slide-in-enter,\n.slide-out-leave-to {\n  opacity: 0;\n  transform: translateX(-50%);\n}\n</style>\n"],"names":["props","__props","translatedHeadline","useLocalizedValue","computed","currentIndex","ref","shownElement","hasNext","hasPrevious","internalId","headingId","transitionName","watch","o","n","nextTick","_createElementBlock","_unref","t","headline","_hoisted_2","_createElementVNode","_hoisted_3","_hoisted_4","_createVNode","NcButton","NcIconSvgWrapper","mdiChevronLeft","_Transition","_createBlock","DiscoverTypePost","_mergeProps","_hoisted_5","mdiChevronRight","_openBlock","_Fragment","_renderList","index","$event","mdiCircleSlice8","mdiCircleOutline"],"mappings":"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"}