bootstrap-vue-next
Version:
Seamless integration of Vue 3, Bootstrap 5, and TypeScript for modern, type-safe UI development
1 lines • 7.9 kB
Source Map (JSON)
{"version":3,"file":"BTableSimple-DfE2d_yr.mjs","names":[],"sources":["../src/components/BTable/BTableSimple.vue","../src/components/BTable/BTableSimple.vue"],"sourcesContent":["<template>\n <!-- tables definitions are shared. Can't use createReusableTemplate cause it becomes a non-root node -->\n <div v-if=\"isResponsive\" :class=\"responsiveClasses\" :style=\"responsiveStyles\">\n <table v-bind=\"computedTableAttrs\">\n <slot />\n </table>\n </div>\n <table v-else v-bind=\"computedTableAttrs\">\n <slot />\n </table>\n</template>\n\n<script setup lang=\"ts\">\nimport {computed, type StyleValue} from 'vue'\nimport type {BTableSimpleProps} from '../../types/ComponentProps'\nimport {useDefaults} from '../../composables/useDefaults'\nimport {useNumberishToStyle} from '../../composables/useNumberishToStyle'\nimport {useColorVariantClasses} from '../../composables/useColorVariantClasses'\nimport {useId} from '../../composables/useId'\nimport type {BTableSimpleSlots} from '../../types'\n\nconst defaultStickyHeaderHeight = '300px'\n\nconst _props = withDefaults(defineProps<BTableSimpleProps>(), {\n borderVariant: null,\n tableClass: undefined,\n variant: null,\n bordered: false,\n borderless: false,\n captionTop: false,\n dark: false,\n hover: false,\n id: undefined,\n noBorderCollapse: false,\n outlined: false,\n fixed: false,\n responsive: false,\n stacked: false,\n striped: false,\n stripedColumns: false,\n small: false,\n stickyHeader: false,\n tableAttrs: undefined,\n})\nconst props = useDefaults(_props, 'BTableSimple')\ndefineSlots<BTableSimpleSlots>()\n\nconst computedId = useId(() => props.id)\n\nconst colorClasses = useColorVariantClasses(\n computed(() => ({\n borderVariant: props.borderVariant,\n }))\n)\nconst computedClasses = computed(() => [\n props.tableClass,\n 'table',\n 'b-table',\n colorClasses.value,\n {\n 'border': props.outlined,\n 'table-bordered': props.bordered,\n 'table-borderless': props.borderless,\n 'caption-top': props.captionTop,\n 'table-dark': props.dark,\n 'table-hover': props.hover,\n 'b-table-stacked': props.stacked === true,\n [`b-table-stacked-${props.stacked}`]: typeof props.stacked === 'string',\n 'table-striped': props.striped,\n 'table-sm': props.small,\n [`table-${props.variant}`]: props.variant !== null,\n 'table-striped-columns': props.stripedColumns,\n 'b-table-fixed': props.fixed,\n 'b-table-no-border-collapse': props.noBorderCollapse,\n },\n])\nconst computedTableAttrs = computed(() => ({\n id: computedId.value,\n class: computedClasses.value,\n ...props.tableAttrs,\n}))\n\nconst computedSticky = useNumberishToStyle(\n computed(\n () =>\n (props.stickyHeader === true ? defaultStickyHeaderHeight : props.stickyHeader) || Number.NaN\n )\n)\nconst stickyIsValid = computed(() => props.stickyHeader !== false)\n\nconst isResponsive = computed(() => props.responsive !== false || stickyIsValid.value)\nconst responsiveStyles = computed<StyleValue | undefined>(() =>\n stickyIsValid.value ? {maxHeight: computedSticky.value} : undefined\n)\nconst responsiveClasses = computed(() => ({\n 'table-responsive': props.responsive === true,\n [`table-responsive-${props.responsive}`]: typeof props.responsive === 'string',\n 'b-table-sticky-header': stickyIsValid.value,\n}))\n</script>\n","<template>\n <!-- tables definitions are shared. Can't use createReusableTemplate cause it becomes a non-root node -->\n <div v-if=\"isResponsive\" :class=\"responsiveClasses\" :style=\"responsiveStyles\">\n <table v-bind=\"computedTableAttrs\">\n <slot />\n </table>\n </div>\n <table v-else v-bind=\"computedTableAttrs\">\n <slot />\n </table>\n</template>\n\n<script setup lang=\"ts\">\nimport {computed, type StyleValue} from 'vue'\nimport type {BTableSimpleProps} from '../../types/ComponentProps'\nimport {useDefaults} from '../../composables/useDefaults'\nimport {useNumberishToStyle} from '../../composables/useNumberishToStyle'\nimport {useColorVariantClasses} from '../../composables/useColorVariantClasses'\nimport {useId} from '../../composables/useId'\nimport type {BTableSimpleSlots} from '../../types'\n\nconst defaultStickyHeaderHeight = '300px'\n\nconst _props = withDefaults(defineProps<BTableSimpleProps>(), {\n borderVariant: null,\n tableClass: undefined,\n variant: null,\n bordered: false,\n borderless: false,\n captionTop: false,\n dark: false,\n hover: false,\n id: undefined,\n noBorderCollapse: false,\n outlined: false,\n fixed: false,\n responsive: false,\n stacked: false,\n striped: false,\n stripedColumns: false,\n small: false,\n stickyHeader: false,\n tableAttrs: undefined,\n})\nconst props = useDefaults(_props, 'BTableSimple')\ndefineSlots<BTableSimpleSlots>()\n\nconst computedId = useId(() => props.id)\n\nconst colorClasses = useColorVariantClasses(\n computed(() => ({\n borderVariant: props.borderVariant,\n }))\n)\nconst computedClasses = computed(() => [\n props.tableClass,\n 'table',\n 'b-table',\n colorClasses.value,\n {\n 'border': props.outlined,\n 'table-bordered': props.bordered,\n 'table-borderless': props.borderless,\n 'caption-top': props.captionTop,\n 'table-dark': props.dark,\n 'table-hover': props.hover,\n 'b-table-stacked': props.stacked === true,\n [`b-table-stacked-${props.stacked}`]: typeof props.stacked === 'string',\n 'table-striped': props.striped,\n 'table-sm': props.small,\n [`table-${props.variant}`]: props.variant !== null,\n 'table-striped-columns': props.stripedColumns,\n 'b-table-fixed': props.fixed,\n 'b-table-no-border-collapse': props.noBorderCollapse,\n },\n])\nconst computedTableAttrs = computed(() => ({\n id: computedId.value,\n class: computedClasses.value,\n ...props.tableAttrs,\n}))\n\nconst computedSticky = useNumberishToStyle(\n computed(\n () =>\n (props.stickyHeader === true ? defaultStickyHeaderHeight : props.stickyHeader) || Number.NaN\n )\n)\nconst stickyIsValid = computed(() => props.stickyHeader !== false)\n\nconst isResponsive = computed(() => props.responsive !== false || stickyIsValid.value)\nconst responsiveStyles = computed<StyleValue | undefined>(() =>\n stickyIsValid.value ? {maxHeight: computedSticky.value} : undefined\n)\nconst responsiveClasses = computed(() => ({\n 'table-responsive': props.responsive === true,\n [`table-responsive-${props.responsive}`]: typeof props.responsive === 'string',\n 'b-table-sticky-header': stickyIsValid.value,\n}))\n</script>\n"],"mappings":";;;;;;AAqBA,IAAM,4BAA4B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuBlC,MAAM,QAAQ,YArBC,SAqBmB,eAAc;EAGhD,MAAM,aAAa,cAAY,MAAM,GAAE;EAEvC,MAAM,eAAe,uBACnB,gBAAgB,EACd,eAAe,MAAM,eACtB,EAAC,CACJ;EACA,MAAM,kBAAkB,eAAe;GACrC,MAAM;GACN;GACA;GACA,aAAa;GACb;IACE,UAAU,MAAM;IAChB,kBAAkB,MAAM;IACxB,oBAAoB,MAAM;IAC1B,eAAe,MAAM;IACrB,cAAc,MAAM;IACpB,eAAe,MAAM;IACrB,mBAAmB,MAAM,YAAY;KACpC,mBAAmB,MAAM,YAAY,OAAO,MAAM,YAAY;IAC/D,iBAAiB,MAAM;IACvB,YAAY,MAAM;KACjB,SAAS,MAAM,YAAY,MAAM,YAAY;IAC9C,yBAAyB,MAAM;IAC/B,iBAAiB,MAAM;IACvB,8BAA8B,MAAM;;GAEvC,CAAA;EACD,MAAM,qBAAqB,gBAAgB;GACzC,IAAI,WAAW;GACf,OAAO,gBAAgB;GACvB,GAAG,MAAM;GACV,EAAC;EAEF,MAAM,iBAAiB,oBACrB,gBAEK,MAAM,iBAAiB,OAAO,4BAA4B,MAAM,iBAAiB,IACtF,CACF;EACA,MAAM,gBAAgB,eAAe,MAAM,iBAAiB,MAAK;EAEjE,MAAM,eAAe,eAAe,MAAM,eAAe,SAAS,cAAc,MAAK;EACrF,MAAM,mBAAmB,eACvB,cAAc,QAAQ,EAAC,WAAW,eAAe,OAAM,GAAG,KAAA,EAC5D;EACA,MAAM,oBAAoB,gBAAgB;GACxC,oBAAoB,MAAM,eAAe;IACxC,oBAAoB,MAAM,eAAe,OAAO,MAAM,eAAe;GACtE,yBAAyB,cAAc;GACxC,EAAC;;UAhGW,aAAA,SAAA,WAAA,EAAX,mBAIM,OAAA;;IAJoB,OAAK,eAAE,kBAAA,MAAiB;IAAG,OAAK,eAAE,iBAAA,MAAA;OAC1D,mBAEQ,SAAA,eAAA,mBAFO,mBAAA,MAAkB,CAAA,EAAA,CAC/B,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,GAAA,CAAA,EAAA,EAAA,KAAA,WAAA,EAGZ,mBAEQ,SAAA,eAAA,WAAA,EAAA,KAAA,GAAA,EAFc,mBAAA,MAAkB,CAAA,EAAA,CACtC,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,GAAA"}