{"version":3,"file":"BAVqWOKw.js","sources":["../../../../components/collections/TabSection.vue","../../../../components/blocks/TabContentBlock.vue"],"sourcesContent":["<template>\n  <span :id=\"model?.system?.id\">\n    <SmartLinkItemComponent :id=\"model?.system?.id\" :component=\"!model?.system?.workflow\">\n      <SmartLinkStandaloneElement\n        v-if=\"!isEmpty(data.content)\"\n        :codename=\"type.elements.content.codename\"\n      >\n        <div :class=\"model?.system.codename\">\n          <RichText :value=\"data.content\" />\n        </div>\n      </SmartLinkStandaloneElement>\n      <SmartLinkStandaloneElement v-else :codename=\"type.elements.content.codename\">\n        <div :class=\"model?.system.codename\">\n          <template v-if=\"data.readMoreCount != 0\">\n            <div v-html=\"split[0]\"></div>\n            <div :id=\"`collapse-${model?.system?.id}`\" ref=\"showMore\" class=\"collapse\">\n              <div v-html=\"split[1]\"></div>\n            </div>\n          </template>\n          <div v-else v-html=\"data.richTextCustomElement\"></div>\n        </div>\n      </SmartLinkStandaloneElement>\n      <button\n        v-if=\"splitCharacterCount != 0\"\n        :id=\"`collapse-button-${model?.system?.id}`\"\n        class=\"btn btn-light px-0\"\n        type=\"button\"\n        aria-expanded=\"false\"\n        data-bs-toggle=\"collapse\"\n        :data-bs-target=\"`#collapse-${model?.system?.id}`\"\n        :aria-controls=\"`collapse-${model?.system?.id}`\"\n      >\n        <template v-if=\"showMoreCollapsed\">\n          Show More\n          <IconCaretDown height=\"20\" />\n        </template>\n        <template v-else>\n          Show Less\n          <IconCaretUp height=\"20\" />\n        </template>\n      </button>\n    </SmartLinkItemComponent>\n  </span>\n</template>\n<script setup lang=\"ts\">\nimport type { TabSectionModel } from '~/models'\nimport { contentTypes } from '~/models'\nimport { useEventListener } from '@vueuse/core'\n\nconst type = contentTypes.tab_section\n\nconst props = defineProps<{ model: TabSectionModel }>()\nconst data = {\n  title: props.model?.elements.title.value,\n  content: props.model?.elements.content.value,\n  richTextCustomElement: props.model?.elements.richTextInterpreterRichText.value,\n  readMoreCount: props.model?.elements.readMoreCharacterCount.value ?? 0\n}\nconst splitCharacterCount = props.model?.elements.readMoreCharacterCount.value ?? 0\nconst { splitHtml } = useHtmlSplitter()\nconst split = splitHtml(`<div>${data.richTextCustomElement}</div>`, data.readMoreCount)\n\nconst { scrollToElementById } = useSmoothScroll()\nconst showMoreCollapsed = ref<boolean>(true)\nconst showMore = ref<HTMLElement | null>(null)\nconst initShowMore = () => {\n  if (!showMore.value) return\n  useEventListener(showMore.value, 'show.bs.collapse', () => {\n    showMoreCollapsed.value = false\n    const prev = showMore.value?.previousElementSibling as HTMLElement\n    const firstChild = showMore.value?.firstElementChild as HTMLElement\n    if (prev && firstChild && prev.tagName == 'UL' && firstChild.tagName == 'UL') {\n      prev.style.marginBottom = '0px'\n    }\n  })\n  useEventListener(showMore.value, 'hide.bs.collapse', () => {\n    showMoreCollapsed.value = true\n    ;(showMore.value?.previousElementSibling as HTMLElement).style.marginBottom = 'revert'\n    scrollToElementById(props.model.system.id, 150, true)\n  })\n}\n\nonMounted(() => {\n  initShowMore()\n})\n</script>\n","<template>\n  <span :id=\"model?.system?.id\">\n    <SmartLinkItemComponent class=\"tab-content-block\" :id=\"model?.system?.id\" :component=\"!model?.system?.workflow\">\n      <div class=\"container tab-content-block__content d-grid\">\n        <SmartLinkStandaloneElement :codename=\"type.elements.title.codename\">\n          <h2 v-if=\"model?.elements.title.value.length > 0\" class=\"tab-content-block__title\">\n            {{ model?.elements.title.value }}\n          </h2>\n        </SmartLinkStandaloneElement>\n\n        <div class=\"tab-content-block__nav-wrapper\">\n          <div :id=\"`tab-${model?.system?.id}`\" class=\"tab-content-block__nav\" role=\"tablist\" ref=\"scrollRef\"\n            @touchstart=\"onTouchStart\" @touchmove=\"onTouchMove\" @touchend=\"handleSwipe\">\n            <div v-for=\"(tab, index) in data.tabSections\" class=\"nav-item\" role=\"presentation\">\n              <SmartLinkStandaloneElement :codename=\"typeTabSection.elements.title.codename\">\n                <button :class=\"['btn', 'nav-link', { active: activeTabIndex === index }]\" data-bs-toggle=\"tab\"\n                  type=\"button\" role=\"tab\" :id=\"`tab-${tab.system.id}`\"\n                  :data-bs-target=\"`#tab-section-${tab.system.id}`\" :aria-controls=\"`tab-section-${tab.system.id}`\"\n                  :aria-selected=\"activeTabIndex === index\" @click=\"activeTabIndex = index\">\n                  {{ tab.elements.title.value }}\n                </button>\n              </SmartLinkStandaloneElement>\n            </div>\n          </div>\n          <div class=\"tab-content-block__nav__overlay-left\" :style=\"{ display: showLeftArrow ? 'inherit' : 'none' }\" />\n          <div class=\"tab-content-block__nav__overlay-right\"\n            :style=\"{ display: showRightArrow ? 'inherit' : 'none' }\" />\n          <div class=\"tab-content-block__nav__arrow-left\" @click=\"scrollLeft(scrollAmount); updateArrows()\"\n            :style=\"{ display: showLeftArrow ? 'inherit' : 'none' }\" />\n          <div class=\"tab-content-block__nav__arrow-right\" @click=\"scrollRight(scrollAmount); updateArrows()\"\n            :style=\"{ display: showRightArrow ? 'inherit' : 'none' }\" />\n        </div>\n\n        <SmartLinkStandaloneElement :codename=\"type.elements.tab_sections.codename\">\n          <div class=\"tab-content\" :id=\"`tab-sections-${model?.system?.id}`\">\n            <div v-for=\"(tab, index) in data.tabSections\"\n              :class=\"`tab-pane fade ${activeTabIndex === index ? 'show active' : ''} tab-content-block__tab-pane`\"\n              :id=\"`tab-section-${tab.system.id}`\" :aria-labelledby=\"`tab-${tab.system.id}`\" role=\"tabpanel\">\n              <TabSection :model=\"tab\" />\n            </div>\n          </div>\n        </SmartLinkStandaloneElement>\n      </div>\n    </SmartLinkItemComponent>\n  </span>\n\n</template>\n<script setup lang=\"ts\">\nimport type { TabContentBlockModel, TabSectionModel } from \"~/models\";\nimport { contentTypes } from '~/models';\nimport delay from 'lodash/delay';\n\nconst pageStore = usePageStore();\nconst props = defineProps<{ model: TabContentBlockModel }>();\nconst type = contentTypes.tab_content_block;\nconst typeTabSection = contentTypes.tab_section;\nconst activeTabIndex = ref(0)\n\nconst scrollAmount = 300\nconst { scrollRef, scrollLeft, scrollRight } = useScroll()\nconst { showLeftArrow, showRightArrow, checkVisibility } = useSliderVisibility(scrollRef)\nconst updateArrows = () => delay(checkVisibility, 500)\nconst { onTouchStart, onTouchMove, onTouchEnd } = useSwipe()\n\nconst handleSwipe = () => {\n  onTouchEnd((direction) => {\n    if (scrollRef.value) {\n      if (direction === 'right') {\n        scrollLeft(scrollAmount)\n        updateArrows()\n      } else if (direction === 'left') {\n        scrollRight(scrollAmount)\n        updateArrows()\n      }\n    }\n  })\n}\n\nconst data = {\n  tabSections: pageStore.getListAs<TabSectionModel>(props.model?.elements.tabSections.value),\n  tableOfContent: props.model?.elements.tableOfContentLinksTableOfContents.value,\n};\n</script>\n"],"names":["type","contentTypes","props","__props","data","_a","_b","_c","_d","splitCharacterCount","_e","splitHtml","useHtmlSplitter","split","scrollToElementById","useSmoothScroll","showMoreCollapsed","ref","showMore","initShowMore","useEventListener","prev","firstChild","onMounted","scrollAmount","pageStore","usePageStore","typeTabSection","activeTabIndex","scrollRef","scrollLeft","scrollRight","useScroll","showLeftArrow","showRightArrow","checkVisibility","useSliderVisibility","updateArrows","delay","onTouchStart","onTouchMove","onTouchEnd","useSwipe","handleSwipe","direction"],"mappings":"swBAiDA,MAAMA,EAAOC,EAAa,YAEpBC,EAAQC,EACRC,EAAO,CACX,OAAOC,EAAAH,EAAM,QAAN,YAAAG,EAAa,SAAS,MAAM,MACnC,SAASC,EAAAJ,EAAM,QAAN,YAAAI,EAAa,SAAS,QAAQ,MACvC,uBAAuBC,EAAAL,EAAM,QAAN,YAAAK,EAAa,SAAS,4BAA4B,MACzE,gBAAeC,EAAAN,EAAM,QAAN,YAAAM,EAAa,SAAS,uBAAuB,QAAS,CACvE,EACMC,IAAsBC,EAAAR,EAAM,QAAN,YAAAQ,EAAa,SAAS,uBAAuB,QAAS,EAC5E,CAAE,UAAAC,CAAU,EAAIC,GAAgB,EAChCC,EAAQF,EAAU,QAAQP,EAAK,qBAAqB,SAAUA,EAAK,aAAa,EAEhF,CAAE,oBAAAU,CAAoB,EAAIC,GAAgB,EAC1CC,EAAoBC,EAAa,EAAI,EACrCC,EAAWD,EAAwB,IAAI,EACvCE,EAAe,IAAM,CACpBD,EAAS,QACGE,GAAAF,EAAS,MAAO,mBAAoB,IAAM,SACzDF,EAAkB,MAAQ,GACpB,MAAAK,GAAOhB,EAAAa,EAAS,QAAT,YAAAb,EAAgB,uBACvBiB,GAAahB,EAAAY,EAAS,QAAT,YAAAZ,EAAgB,kBAC/Be,GAAQC,GAAcD,EAAK,SAAW,MAAQC,EAAW,SAAW,OACtED,EAAK,MAAM,aAAe,MAC5B,CACD,EACgBD,GAAAF,EAAS,MAAO,mBAAoB,IAAM,OACzDF,EAAkB,MAAQ,KACxBX,EAAAa,EAAS,QAAT,YAAAb,EAAgB,wBAAuC,MAAM,aAAe,SAC9ES,EAAoBZ,EAAM,MAAM,OAAO,GAAI,IAAK,EAAI,CAAA,CACrD,EACH,EAEA,OAAAqB,GAAU,IAAM,CACDJ,EAAA,CAAA,CACd,47DC1BKK,EAAe,sEANrB,MAAMC,EAAYC,GAAa,EACzBxB,EAAQC,EACRH,EAAOC,EAAa,kBACpB0B,EAAiB1B,EAAa,YAC9B2B,EAAiBX,EAAI,CAAC,EAGtB,CAAE,UAAAY,EAAW,WAAAC,EAAY,YAAAC,CAAA,EAAgBC,GAAU,EACnD,CAAE,cAAAC,EAAe,eAAAC,EAAgB,gBAAAC,CAAgB,EAAIC,GAAoBP,CAAS,EAClFQ,EAAe,IAAMC,GAAMH,EAAiB,GAAG,EAC/C,CAAE,aAAAI,EAAc,YAAAC,EAAa,WAAAC,CAAA,EAAeC,GAAS,EAErDC,EAAc,IAAM,CACxBF,EAAYG,GAAc,CACpBf,EAAU,QACRe,IAAc,SAChBd,EAAWN,CAAY,EACVa,EAAA,GACJO,IAAc,SACvBb,EAAYP,CAAY,EACXa,EAAA,GAEjB,CACD,CACH,EAEMjC,EAAO,CACX,YAAaqB,EAAU,WAA2BpB,EAAAH,EAAM,QAAN,YAAAG,EAAa,SAAS,YAAY,KAAK,EACzF,gBAAgBC,EAAAJ,EAAM,QAAN,YAAAI,EAAa,SAAS,mCAAmC,KAC3E"}