{"version":3,"file":"DIrhj8oR.js","sources":["../../../../src/components/components/core/accordion/vdv/accordion-single.vue","../../../../src/components/components/core/accordion/vdv/accordion-multi.vue"],"sourcesContent":["<template>\n  <article :class=\"props.classes\">\n    <div\n      class=\"flex items-center border-white rounded-sm cursor-pointer py-2xs px-xs border-t-1 border-r-1 border-l-1\"\n      :class=\"getActiveBarClasses()\"\n      @click=\"toggleVisibility()\"\n    >\n      <slot name=\"title\" />\n      <div v-show=\"isOpen\" class=\"ml-auto mr-xs md:mr-md\">\n        <FaIcon icon-class=\"fal fa-angle-up\" classes=\"mx-auto\" />\n      </div>\n      <div v-show=\"!isOpen\" class=\"ml-auto mr-xs md:mr-md\">\n        <FaIcon icon-class=\"fal fa-angle-down\" classes=\"mx-auto\" />\n      </div>\n    </div>\n    <div\n      v-if=\"isOpen\"\n      class=\"overflow-hidden bg-white text-vdv-font max-h-[100vh]\"\n    >\n      <div class=\"p-sm md:px-md\">\n        <slot name=\"content\" />\n      </div>\n    </div>\n  </article>\n</template>\n\n<script setup lang=\"ts\">\nimport FaIcon from '@/components/fa-icon.vue';\nconst props = defineProps({\n  componentId: {\n    type: String,\n    required: false,\n    default: null,\n  },\n  isOpen: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  // Styling\n  classes: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  activeBarColor: {\n    type: String,\n    required: false,\n    default: 'bg-activesection-base',\n  },\n  activeBarTextColor: {\n    type: String,\n    required: false,\n    default: 'text-vdv-font',\n  },\n  barColor: {\n    type: String,\n    required: false,\n    default: 'bg-vdv-bg-base',\n  },\n  barTextColor: {\n    type: String,\n    required: false,\n    default: 'text-vdv-font',\n  },\n  // TODO: Following Props are not implemented yet\n  contentColor: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  contentTextColor: {\n    type: String,\n    required: false,\n    default: '',\n  },\n});\n\nconst emit = defineEmits<{\n  (e: 'close', id: string): string;\n  (e: 'open', id: string): string;\n}>();\n\nfunction toggleVisibility(): void {\n  if (!props.isOpen) {\n    emit('open', props.componentId);\n  } else {\n    emit('close', props.componentId);\n  }\n}\n\nfunction getActiveBarClasses(): string {\n  if (props.isOpen) {\n    return `${props.activeBarColor} ${props.activeBarTextColor} font-bold`;\n  } else {\n    return `${props.barColor} ${props.barTextColor}`;\n  }\n}\n</script>\n\n<style scoped lang=\"postcss\">\n.vdv-accordion-single__content-wrapper > :slotted(*) {\n  @apply px-sm;\n  @apply pb-2xs;\n  @apply pt-2xs;\n}\n</style>\n","<template>\n  <div :class=\"classes\">\n    <AccordionSingle\n      v-for=\"accordion in state.accordionItems\"\n      :key=\"accordion.componentId\"\n      :component-id=\"accordion.componentId\"\n      :classes=\"accordion.classes\"\n      :active-bar-color=\"accordion.activeBarColor\"\n      :active-bar-text-color=\"accordion.activeBarTextColor\"\n      :bar-color=\"accordion.barColor\"\n      :bar-text-color=\"accordion.barTextColor\"\n      :is-open=\"accordion.isOpen\"\n      @open=\"accordionOpenHandler($event, $el)\"\n      @close=\"accordionCloseHandler\"\n    >\n      <template #title>\n        <p class=\"ml-[5px] md:ml-[20px]\">\n          {{ accordion.titleSlot }}\n        </p>\n      </template>\n      <template #content>\n        <div class=\"vdv-accordion-multi__content-slot\">\n          <WYSIWYGContentRaw\n            v-if=\"props.contentType === EAccordionContentType.WYSIWYG\"\n            :content=\"accordion.contentSlot\"\n            no-container-padding\n          />\n          <Wysiwyg\n            v-if=\"props.contentType === EAccordionContentType.TEMPLATE\"\n            :content=\"accordion.contentSlot\"\n            no-container-padding\n          />\n          <!-- eslint-disable vue/no-v-html -->\n          <div\n            v-if=\"props.contentType === EAccordionContentType.TEXT\"\n            v-html=\"accordion.contentSlot\"\n          ></div>\n        </div>\n      </template>\n    </AccordionSingle>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { v4 as uuidv4 } from 'uuid';\nimport { EAccordionContentType, type IAccordionItem } from '@/@types/accordion';\nimport { scrollToElement } from '@/helpers/scroll';\nimport AccordionSingle from '@/components/components/core/accordion/vdv/accordion-single.vue';\nimport { WYSIWYGContentRaw } from '~/complib';\nimport Wysiwyg from '~/components/components/cms/wysiwyg/wysiwyg.vue';\n\nconst props = defineProps({\n  accordionItems: {\n    type: Object as PropType<IAccordionItem[]>,\n    required: true,\n  },\n  classes: {\n    type: String,\n    required: false,\n    default: '',\n  },\n  closeAll: {\n    type: Boolean,\n    required: false,\n    default: null,\n  },\n  contentType: {\n    type: String,\n    required: false,\n    default: EAccordionContentType.TEMPLATE,\n  },\n});\n\nconst state: AccordionMultiState = reactive({\n  accordionItems: getAccordionItems(),\n});\n\nfunction getAccordionItems(): IAccordionItem[] {\n  return props.accordionItems.map((accordionItem) => {\n    accordionItem.componentId = uuidv4() as string;\n    accordionItem.isOpen = false;\n    return accordionItem;\n  });\n}\n\nfunction accordionOpenHandler(accordionId: string, el: Element): void {\n  scrollToElement(el, 200);\n  accordionOpen(accordionId);\n}\n\nfunction accordionCloseHandler(accordionId: string): void {\n  accordionClose(accordionId);\n}\n\n// Extend these functions and introduce a settings-prop if you need more control over when accordions auto-close\nfunction accordionOpen(accordionId: string): void {\n  state.accordionItems.map((accordion) => {\n    accordion.isOpen = accordion.componentId === accordionId;\n    return accordion;\n  });\n}\n\nfunction accordionClose(accordionId: string): void {\n  state.accordionItems.find((x) => x.componentId === accordionId).isOpen =\n    false;\n}\n\n// Type Definitions\ntype AccordionMultiState = {\n  accordionItems: IAccordionItem[];\n};\n</script>\n\n<style scoped></style>\n"],"names":["props","__props","emit","__emit","toggleVisibility","getActiveBarClasses","state","reactive","getAccordionItems","accordionItem","uuidv4","accordionOpenHandler","accordionId","el","scrollToElement","accordionOpen","accordionCloseHandler","accordionClose","accordion","x"],"mappings":"qkCA4BA,MAAMA,EAAQC,EAkDRC,EAAOC,EAKb,SAASC,GAAyB,CAC3BJ,EAAM,OAGJE,EAAA,QAASF,EAAM,WAAW,EAF1BE,EAAA,OAAQF,EAAM,WAAW,CAIlC,CAEA,SAASK,GAA8B,CACrC,OAAIL,EAAM,OACD,GAAGA,EAAM,cAAc,IAAIA,EAAM,kBAAkB,aAEnD,GAAGA,EAAM,QAAQ,IAAIA,EAAM,YAAY,EAElD,62BC9CA,MAAMA,EAAQC,EAsBRK,EAA6BC,EAAS,CAC1C,eAAgBC,EAAkB,CAAA,CACnC,EAED,SAASA,GAAsC,CAC7C,OAAOR,EAAM,eAAe,IAAKS,IAC/BA,EAAc,YAAcC,IAC5BD,EAAc,OAAS,GAChBA,EACR,CACH,CAES,SAAAE,EAAqBC,EAAqBC,EAAmB,CACpEC,EAAgBD,EAAI,GAAG,EACvBE,EAAcH,CAAW,CAC3B,CAEA,SAASI,EAAsBJ,EAA2B,CACxDK,EAAeL,CAAW,CAC5B,CAGA,SAASG,EAAcH,EAA2B,CAC1CN,EAAA,eAAe,IAAKY,IACdA,EAAA,OAASA,EAAU,cAAgBN,EACtCM,EACR,CACH,CAEA,SAASD,EAAeL,EAA2B,CAC3CN,EAAA,eAAe,KAAMa,GAAMA,EAAE,cAAgBP,CAAW,EAAE,OAC9D,EACJ"}