init component

node_modules/buetify/lib/components/table/BTable.js

@@ -0,0 +1,166 @@
+import { isEmpty } from 'fp-ts/lib/Array';
+import { defineComponent, h, computed, toRef } from 'vue';
+import { useProxy } from '../../composables/proxy';
+import { useWindowSize } from '../../composables/windowSize';
+import { isBoolean } from '../../utils/helpers';
+import BPagination from '../pagination/BPagination';
+import BSimpleTable, { BSimpleTablePropsDefinition } from './BSimpleTable';
+import BTableHeader from './BTableHeader';
+import BTableMobileSort from './BTableMobileSort';
+import BTableRowElement from './BTableRow';
+import { provideVisibleColumns } from './composables/shared';
+import { BTableCheckPropsDefinition, useCheckableTable } from './composables/useCheckableTable';
+import { BTableDraggablePropsDefinition, useDraggableTable } from './composables/useDraggableTable';
+import { BTableSelectablePropsDefinition, useSelectableTable } from './composables/useSelectableTable';
+import { BTableSortingPropsDefinition, useSortableTable } from './composables/useSortableTable';
+export const BTablePropsDefinition = {
+  columns: {
+    type: Array,
+    required: true
+  },
+  isFocusable: {
+    type: Boolean,
+    default: false
+  },
+  mobileSortPlaceholder: {
+    type: String
+  },
+  headerClasses: {
+    type: [String, Object, Array],
+    default: undefined
+  },
+  onRowClick: {
+    type: Function,
+    required: false
+  },
+  pagination: {
+    type: [Boolean, Object],
+    required: false
+  },
+  ...BSimpleTablePropsDefinition,
+  ...BTableCheckPropsDefinition,
+  ...BTableDraggablePropsDefinition,
+  ...BTableSelectablePropsDefinition,
+  ...BTableSortingPropsDefinition,
+  useMobileCards: {
+    type: Boolean,
+    default: true
+  }
+};
+
+function generateTableHeader(classes, slots) {
+  return h(BTableHeader, {
+    class: classes
+  }, { ...slots
+  });
+}
+
+function generateEmptyTable(visibleColumns, slots) {
+  return h('tbody', [h('tr', {
+    class: 'is-empty'
+  }, [h('td', {
+    colspan: visibleColumns.value.length
+  }, slots.empty && slots.empty())])]);
+}
+
+function generateTableBody(props, rows, visibleColumns, slots) {
+  if (isEmpty(props.rows)) {
+    return generateEmptyTable(visibleColumns, slots);
+  }
+
+  const onRowClick = props.onRowClick;
+  return h('tbody', rows.map((row, index) => slots.row ? slots.row({
+    row,
+    index,
+    onRowClick,
+    columns: visibleColumns.value
+  }) : h(BTableRowElement, {
+    key: row.id,
+    row,
+    index,
+    onRowClick
+  }, { ...slots
+  })));
+}
+
+function generateTableFooter(visibleColumns, slots) {
+  return h('tfoot', [h('tr', {
+    class: 'table-footer'
+  }, slots.footer && slots.footer({
+    numberOfColumns: visibleColumns.value.length,
+    columns: visibleColumns.value
+  }))]);
+}
+
+function generateTable(props, rows, visibleColumns, slots) {
+  return h(BSimpleTable, props, () => {
+    const nodes = [generateTableHeader(props.headerClasses, slots), generateTableBody(props, rows, visibleColumns, slots)];
+
+    if (slots.footer) {
+      nodes.push(generateTableFooter(visibleColumns, slots));
+    }
+
+    return nodes;
+  });
+}
+
+export default defineComponent({
+  name: 'b-table',
+  props: BTablePropsDefinition,
+
+  setup(props, {
+    slots
+  }) {
+    const {
+      value: rows
+    } = useProxy(toRef(props, 'rows'));
+    const visibleColumns = computed(() => props.columns.filter(column => column.isVisible ?? true));
+    provideVisibleColumns(visibleColumns);
+    const {
+      hasSortableColumns
+    } = useSortableTable(props, rows, visibleColumns);
+    useCheckableTable(props, rows);
+    useSelectableTable(props);
+    useDraggableTable(props);
+    const windowSize = useWindowSize();
+    const useMobileSorting = computed(() => props.useMobileCards && hasSortableColumns.value && windowSize.value.isTouch);
+    return () => {
+      const nodes = [];
+
+      if (useMobileSorting.value) {
+        nodes.push(h(BTableMobileSort, {
+          placeholder: props.mobileSortPlaceholder
+        }));
+      }
+
+      if (props.pagination) {
+        nodes.push(h(BPagination, isBoolean(props.pagination) ? {
+          total: props.rows.length,
+          items: rows.value
+        } : {
+          isSimple: props.pagination.isSimple,
+          isRounded: props.pagination.isRounded,
+          modelValue: props.pagination.page,
+          'onUpdate:modelValue': props.pagination['onUpdate:page'],
+          total: props.rows.length,
+          items: rows.value,
+          perPage: props.pagination.perPage,
+          size: props.pagination.size,
+          position: props.pagination.horizontalPosition,
+          verticalPosition: props.pagination.verticalPosition
+        }, // eslint-disable-line
+        {
+          default: paginatedState => {
+            return generateTable(props, paginatedState.paginatedItems, visibleColumns, slots);
+          }
+        }));
+        return h('div', nodes);
+      } else {
+        nodes.push(generateTable(props, rows.value, visibleColumns, slots));
+        return h('div', nodes);
+      }
+    };
+  }
+
+});
+//# sourceMappingURL=BTable.js.map