bootstrap-vue-next
Version:
Seamless integration of Vue 3, Bootstrap 5, and TypeScript for modern, type-safe UI development
1 lines • 10.8 kB
Source Map (JSON)
{"version":3,"file":"BCollapse-DqeS5WyB.mjs","names":["$attrs"],"sources":["../src/components/BCollapse/BCollapse.vue","../src/components/BCollapse/BCollapse.vue"],"sourcesContent":["<template>\n <slot name=\"header\" v-bind=\"sharedSlots\" />\n <Transition\n v-if=\"renderRef || contentShowing\"\n v-bind=\"transitionProps\"\n :enter-active-class=\"computedNoAnimation ? '' : 'collapsing'\"\n :leave-active-class=\"computedNoAnimation ? '' : 'collapsing'\"\n :appear=\"modelValue || props.visible\"\n >\n <component\n :is=\"props.tag\"\n v-show=\"showRef\"\n :id=\"computedId\"\n ref=\"_element\"\n class=\"collapse\"\n :class=\"computedClasses\"\n :is-nav=\"props.isNav\"\n v-bind=\"$attrs\"\n >\n <slot v-if=\"contentShowing\" v-bind=\"sharedSlots\" />\n </component>\n </Transition>\n <slot name=\"footer\" v-bind=\"sharedSlots\" />\n</template>\n\n<script setup lang=\"ts\">\nimport {computed, type EmitFn, provide, readonly, toRef, useTemplateRef} from 'vue'\nimport {useDefaults} from '../../composables/useDefaults'\nimport {useId} from '../../composables/useId'\nimport {collapseInjectionKey} from '../../utils/keys'\nimport type {BCollapseProps} from '../../types/ComponentProps'\nimport type {BCollapseEmits} from '../../types/ComponentEmits'\nimport type {BCollapseSlots, ShowHideSlotsData} from '../../types/ComponentSlots'\nimport {useShowHide} from '../../composables/useShowHide'\n\ndefineOptions({\n inheritAttrs: false,\n})\n\nconst _props = withDefaults(defineProps<Omit<BCollapseProps, 'modelValue'>>(), {\n horizontal: false,\n id: undefined,\n initialAnimation: false,\n isNav: false,\n lazy: false,\n noAnimation: false,\n unmountLazy: false,\n tag: 'div',\n show: false,\n visible: false,\n})\nconst props = useDefaults(_props, 'BCollapse')\nconst emit = defineEmits<BCollapseEmits>()\ndefineSlots<BCollapseSlots>()\n\nconst modelValue = defineModel<Exclude<BCollapseProps['modelValue'], undefined>>({\n default: false,\n})\n\nconst computedId = useId(() => props.id, 'collapse')\n\nconst element = useTemplateRef<HTMLElement | null>('_element')\n\nlet inCollapse = false\nconst onEnter = (el: Element) => {\n inCollapse = true\n requestAnimationFrame(() => {\n if (props.horizontal) {\n ;(el as HTMLElement).style.width = `${(el as HTMLElement).scrollWidth}px`\n } else {\n ;(el as HTMLElement).style.height = `${(el as HTMLElement).scrollHeight}px`\n }\n })\n}\nconst onBeforeLeave = (el: Element) => {\n if (inCollapse) {\n return\n }\n if (props.horizontal) {\n ;(el as HTMLElement).style.width = `${el.scrollWidth}px`\n } else {\n ;(el as HTMLElement).style.height = `${el.scrollHeight}px`\n }\n\n // oxlint-disable-next-line no-unused-expressions\n ;(el as HTMLElement).offsetHeight // force reflow\n}\nconst onLeave = (el: Element) => {\n requestAnimationFrame(() => {\n if (props.horizontal) {\n ;(el as HTMLElement).style.width = ``\n } else {\n ;(el as HTMLElement).style.height = ``\n }\n })\n}\n\nconst onAfterEnter = (el: Element) => {\n ;(el as HTMLElement).style.height = ``\n ;(el as HTMLElement).style.width = ``\n inCollapse = false\n}\n\nconst onAfterLeave = (el: Element) => {\n ;(el as HTMLElement).style.height = ``\n ;(el as HTMLElement).style.width = ``\n inCollapse = false\n}\n\nconst {\n showRef,\n renderRef,\n hide,\n show,\n toggle,\n isActive,\n computedNoAnimation,\n contentShowing,\n transitionProps,\n} = useShowHide(modelValue, props, emit as EmitFn, element, computedId, {\n // addShowClass: false,\n transitionProps: {\n onBeforeLeave,\n onEnter,\n onLeave,\n onAfterEnter,\n onAfterLeave,\n enterToClass: '',\n leaveToClass: '',\n enterFromClass: '',\n leaveFromClass: '',\n enterActiveClass: '',\n leaveActiveClass: '',\n },\n})\n\nconst computedClasses = computed(() => ({\n 'show': isActive.value,\n 'navbar-collapse': props.isNav,\n 'collapse-horizontal': props.horizontal,\n}))\n\nconst sharedSlots = computed<ShowHideSlotsData>(() => ({\n toggle,\n show,\n hide,\n id: computedId.value,\n visible: showRef.value,\n active: isActive.value,\n}))\n\ndefineExpose({\n hide,\n isNav: props.isNav,\n show,\n toggle,\n visible: readonly(showRef),\n})\n\nprovide(collapseInjectionKey, {\n id: computedId,\n hide,\n show,\n toggle,\n visible: readonly(showRef),\n isNav: toRef(() => props.isNav),\n})\n</script>\n","<template>\n <slot name=\"header\" v-bind=\"sharedSlots\" />\n <Transition\n v-if=\"renderRef || contentShowing\"\n v-bind=\"transitionProps\"\n :enter-active-class=\"computedNoAnimation ? '' : 'collapsing'\"\n :leave-active-class=\"computedNoAnimation ? '' : 'collapsing'\"\n :appear=\"modelValue || props.visible\"\n >\n <component\n :is=\"props.tag\"\n v-show=\"showRef\"\n :id=\"computedId\"\n ref=\"_element\"\n class=\"collapse\"\n :class=\"computedClasses\"\n :is-nav=\"props.isNav\"\n v-bind=\"$attrs\"\n >\n <slot v-if=\"contentShowing\" v-bind=\"sharedSlots\" />\n </component>\n </Transition>\n <slot name=\"footer\" v-bind=\"sharedSlots\" />\n</template>\n\n<script setup lang=\"ts\">\nimport {computed, type EmitFn, provide, readonly, toRef, useTemplateRef} from 'vue'\nimport {useDefaults} from '../../composables/useDefaults'\nimport {useId} from '../../composables/useId'\nimport {collapseInjectionKey} from '../../utils/keys'\nimport type {BCollapseProps} from '../../types/ComponentProps'\nimport type {BCollapseEmits} from '../../types/ComponentEmits'\nimport type {BCollapseSlots, ShowHideSlotsData} from '../../types/ComponentSlots'\nimport {useShowHide} from '../../composables/useShowHide'\n\ndefineOptions({\n inheritAttrs: false,\n})\n\nconst _props = withDefaults(defineProps<Omit<BCollapseProps, 'modelValue'>>(), {\n horizontal: false,\n id: undefined,\n initialAnimation: false,\n isNav: false,\n lazy: false,\n noAnimation: false,\n unmountLazy: false,\n tag: 'div',\n show: false,\n visible: false,\n})\nconst props = useDefaults(_props, 'BCollapse')\nconst emit = defineEmits<BCollapseEmits>()\ndefineSlots<BCollapseSlots>()\n\nconst modelValue = defineModel<Exclude<BCollapseProps['modelValue'], undefined>>({\n default: false,\n})\n\nconst computedId = useId(() => props.id, 'collapse')\n\nconst element = useTemplateRef<HTMLElement | null>('_element')\n\nlet inCollapse = false\nconst onEnter = (el: Element) => {\n inCollapse = true\n requestAnimationFrame(() => {\n if (props.horizontal) {\n ;(el as HTMLElement).style.width = `${(el as HTMLElement).scrollWidth}px`\n } else {\n ;(el as HTMLElement).style.height = `${(el as HTMLElement).scrollHeight}px`\n }\n })\n}\nconst onBeforeLeave = (el: Element) => {\n if (inCollapse) {\n return\n }\n if (props.horizontal) {\n ;(el as HTMLElement).style.width = `${el.scrollWidth}px`\n } else {\n ;(el as HTMLElement).style.height = `${el.scrollHeight}px`\n }\n\n // oxlint-disable-next-line no-unused-expressions\n ;(el as HTMLElement).offsetHeight // force reflow\n}\nconst onLeave = (el: Element) => {\n requestAnimationFrame(() => {\n if (props.horizontal) {\n ;(el as HTMLElement).style.width = ``\n } else {\n ;(el as HTMLElement).style.height = ``\n }\n })\n}\n\nconst onAfterEnter = (el: Element) => {\n ;(el as HTMLElement).style.height = ``\n ;(el as HTMLElement).style.width = ``\n inCollapse = false\n}\n\nconst onAfterLeave = (el: Element) => {\n ;(el as HTMLElement).style.height = ``\n ;(el as HTMLElement).style.width = ``\n inCollapse = false\n}\n\nconst {\n showRef,\n renderRef,\n hide,\n show,\n toggle,\n isActive,\n computedNoAnimation,\n contentShowing,\n transitionProps,\n} = useShowHide(modelValue, props, emit as EmitFn, element, computedId, {\n // addShowClass: false,\n transitionProps: {\n onBeforeLeave,\n onEnter,\n onLeave,\n onAfterEnter,\n onAfterLeave,\n enterToClass: '',\n leaveToClass: '',\n enterFromClass: '',\n leaveFromClass: '',\n enterActiveClass: '',\n leaveActiveClass: '',\n },\n})\n\nconst computedClasses = computed(() => ({\n 'show': isActive.value,\n 'navbar-collapse': props.isNav,\n 'collapse-horizontal': props.horizontal,\n}))\n\nconst sharedSlots = computed<ShowHideSlotsData>(() => ({\n toggle,\n show,\n hide,\n id: computedId.value,\n visible: showRef.value,\n active: isActive.value,\n}))\n\ndefineExpose({\n hide,\n isNav: props.isNav,\n show,\n toggle,\n visible: readonly(showRef),\n})\n\nprovide(collapseInjectionKey, {\n id: computedId,\n hide,\n show,\n toggle,\n visible: readonly(showRef),\n isNav: toRef(() => props.isNav),\n})\n</script>\n"],"mappings":"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"}