@vuetify/nightly 3.0.0-beta.10 → 3.0.0-beta.15

package/lib/components/VDataTable/VDataTable.mjs

@@ -1,52 +1,47 @@
 // @ts-nocheck
-
 /* eslint-disable */
-import "./VDataTable.css"; // Types
 
+import "./VDataTable.css";
+
+// Types
 // Components
 import { VData } from "../VData/index.mjs";
 import { VDataFooter, VDataIterator } from "../VDataIterator/index.mjs";
 import VBtn from "../VBtn/index.mjs";
 import VDataTableHeader from "./VDataTableHeader.mjs"; // import VVirtualTable from './VVirtualTable'
-
 import VIcon from "../VIcon/index.mjs";
 import Row from "./Row.mjs";
 import RowGroup from "./RowGroup.mjs";
 import VSimpleCheckbox from "../VCheckbox/VSimpleCheckbox.mjs";
 import VSimpleTable from "./VSimpleTable.mjs";
 import MobileRow from "./MobileRow.mjs"; // Mixins
-
 import Loadable from "../../mixins/loadable.mjs"; // Directives
-
 import ripple from "../../directives/ripple/index.mjs"; // Helpers
-
 import mixins from "../../util/mixins.mjs";
 import { deepEqual, getObjectValueByPath, getPrefixedScopedSlots, getSlot, defaultFilter, camelizeObjectKeys, getPropertyFromItem } from "../../util/helpers.mjs";
 import { breaking } from "../../util/console.mjs";
 import { mergeClasses } from "../../util/mergeData.mjs";
-
 function filterFn(item, search, filter) {
   return header => {
     const value = getObjectValueByPath(item, header.value);
     return header.filter ? header.filter(value, search, item) : filter(value, search, item);
   };
 }
-
 function searchTableItems(items, search, headersWithCustomFilters, headersWithoutCustomFilters, customFilter) {
   search = typeof search === 'string' ? search.trim() : null;
   return items.filter(item => {
     // Headers with custom filters are evaluated whether or not a search term has been provided.
     // We need to match every filter to be included in the results.
-    const matchesColumnFilters = headersWithCustomFilters.every(filterFn(item, search, defaultFilter)); // Headers without custom filters are only filtered by the `search` property if it is defined.
-    // We only need a single column to match the search term to be included in the results.
+    const matchesColumnFilters = headersWithCustomFilters.every(filterFn(item, search, defaultFilter));
 
+    // Headers without custom filters are only filtered by the `search` property if it is defined.
+    // We only need a single column to match the search term to be included in the results.
     const matchesSearchTerm = !search || headersWithoutCustomFilters.some(filterFn(item, search, customFilter));
     return matchesColumnFilters && matchesSearchTerm;
   });
 }
-/* @vue/component */
-
 
+/* @vue/component */
 export default mixins(VDataIterator, Loadable).extend({
   name: 'v-data-table',
   // https://github.com/vuejs/vue/issues/6872
@@ -89,7 +84,6 @@ export default mixins(VDataIterator, Loadable).extend({
       default: 4
     }
   },
-
   data() {
     return {
       internalGroupBy: [],
@@ -97,7 +91,6 @@ export default mixins(VDataIterator, Loadable).extend({
       widths: []
     };
   },
-
   computed: {
     computedHeaders() {
       if (!this.headers) return [];
@@ -107,119 +100,103 @@ export default mixins(VDataIterator, Loadable).extend({
         sortable: false,
         width: '1px'
       };
-
       if (this.showSelect) {
         const index = headers.findIndex(h => h.value === 'data-table-select');
-        if (index < 0) headers.unshift({ ...defaultHeader,
+        if (index < 0) headers.unshift({
+          ...defaultHeader,
           value: 'data-table-select'
-        });else headers.splice(index, 1, { ...defaultHeader,
+        });else headers.splice(index, 1, {
+          ...defaultHeader,
           ...headers[index]
         });
       }
-
       if (this.showExpand) {
         const index = headers.findIndex(h => h.value === 'data-table-expand');
-        if (index < 0) headers.unshift({ ...defaultHeader,
+        if (index < 0) headers.unshift({
+          ...defaultHeader,
           value: 'data-table-expand'
-        });else headers.splice(index, 1, { ...defaultHeader,
+        });else headers.splice(index, 1, {
+          ...defaultHeader,
           ...headers[index]
         });
       }
-
       return headers;
     },
-
     colspanAttrs() {
       return this.isMobile ? undefined : {
         colspan: this.headersLength || this.computedHeaders.length
       };
     },
-
     columnSorters() {
       return this.computedHeaders.reduce((acc, header) => {
         if (header.sort) acc[header.value] = header.sort;
         return acc;
       }, {});
     },
-
     headersWithCustomFilters() {
       return this.headers.filter(header => header.filter && (!header.hasOwnProperty('filterable') || header.filterable === true));
     },
-
     headersWithoutCustomFilters() {
       return this.headers.filter(header => !header.filter && (!header.hasOwnProperty('filterable') || header.filterable === true));
     },
-
     sanitizedHeaderProps() {
       return camelizeObjectKeys(this.headerProps);
     },
-
     computedItemsPerPage() {
       const itemsPerPage = this.options && this.options.itemsPerPage ? this.options.itemsPerPage : this.itemsPerPage;
       const itemsPerPageOptions = this.sanitizedFooterProps.itemsPerPageOptions;
-
       if (itemsPerPageOptions && !itemsPerPageOptions.find(item => typeof item === 'number' ? item === itemsPerPage : item.value === itemsPerPage)) {
         const firstOption = itemsPerPageOptions[0];
         return typeof firstOption === 'object' ? firstOption.value : firstOption;
       }
-
       return itemsPerPage;
     }
-
   },
-
   created() {
     const breakingProps = [['sort-icon', 'header-props.sort-icon'], ['hide-headers', 'hide-default-header'], ['select-all', 'show-select']];
-    /* istanbul ignore next */
 
+    /* istanbul ignore next */
     breakingProps.forEach(_ref => {
       let [original, replacement] = _ref;
       if (this.$attrs.hasOwnProperty(original)) breaking(original, replacement, this);
     });
   },
-
   mounted() {
     // if ((!this.sortBy || !this.sortBy.length) && (!this.options.sortBy || !this.options.sortBy.length)) {
     //   const firstSortable = this.headers.find(h => !('sortable' in h) || !!h.sortable)
     //   if (firstSortable) this.updateOptions({ sortBy: [firstSortable.value], sortDesc: [false] })
     // }
+
     if (this.calculateWidths) {
       window.addEventListener('resize', this.calcWidths);
       this.calcWidths();
     }
   },
-
   beforeDestroy() {
     if (this.calculateWidths) {
       window.removeEventListener('resize', this.calcWidths);
     }
   },
-
   methods: {
     calcWidths() {
       this.widths = Array.from(this.$el.querySelectorAll('th')).map(e => e.clientWidth);
     },
-
     customFilterWithColumns(items, search) {
       return searchTableItems(items, search, this.headersWithCustomFilters, this.headersWithoutCustomFilters, this.customFilter);
     },
-
     customSortWithHeaders(items, sortBy, sortDesc, locale) {
       return this.customSort(items, sortBy, sortDesc, locale, this.columnSorters);
     },
-
     createItemProps(item, index) {
       const props = VDataIterator.options.methods.createItemProps.call(this, item, index);
       return Object.assign(props, {
         headers: this.computedHeaders
       });
     },
-
     genCaption(props) {
       if (this.caption) return [this.$createElement('caption', [this.caption])];
       return getSlot(this, 'caption', props, true);
     },
-
     genColgroup(props) {
       return this.$createElement('colgroup', this.computedHeaders.map(header => {
         return this.$createElement('col', {
@@ -229,7 +206,6 @@ export default mixins(VDataIterator, Loadable).extend({
         });
       }));
     },
-
     genLoading() {
       const th = this.$createElement('th', {
         staticClass: 'column',
@@ -240,10 +216,10 @@ export default mixins(VDataIterator, Loadable).extend({
       }, [th]);
       return this.$createElement('thead', [tr]);
     },
-
     genHeaders(props) {
       const data = {
-        props: { ...this.sanitizedHeaderProps,
+        props: {
+          ...this.sanitizedHeaderProps,
           headers: this.computedHeaders,
           options: props.options,
           mobile: this.isMobile,
@@ -259,23 +235,23 @@ export default mixins(VDataIterator, Loadable).extend({
           group: props.group,
           'toggle-select-all': this.toggleSelectAll
         }
-      }; // TODO: rename to 'head'? (thead, tbody, tfoot)
+      };
 
-      const children = [getSlot(this, 'header', { ...data,
+      // TODO: rename to 'head'? (thead, tbody, tfoot)
+      const children = [getSlot(this, 'header', {
+        ...data,
         isMobile: this.isMobile
       })];
-
       if (!this.hideDefaultHeader) {
         const scopedSlots = getPrefixedScopedSlots('header.', this.$scopedSlots);
-        children.push(this.$createElement(VDataTableHeader, { ...data,
+        children.push(this.$createElement(VDataTableHeader, {
+          ...data,
           scopedSlots
         }));
       }
-
       if (this.loading) children.push(this.genLoading());
       return children;
     },
-
     genEmptyWrapper(content) {
       return this.$createElement('tr', {
         staticClass: 'v-data-table__empty-wrapper'
@@ -283,17 +259,14 @@ export default mixins(VDataIterator, Loadable).extend({
         attrs: this.colspanAttrs
       }, content)]);
     },
-
     genItems(items, props) {
       const empty = this.genEmpty(props.originalItemsLength, props.pagination.itemsLength);
       if (empty) return [empty];
       return props.groupedItems ? this.genGroupedRows(props.groupedItems, props) : this.genRows(items, props);
     },
-
     genGroupedRows(groupedItems, props) {
       return groupedItems.map(group => {
         if (!this.openCache.hasOwnProperty(group.name)) this.$set(this.openCache, group.name, true);
-
         if (this.$scopedSlots.group) {
           return this.$scopedSlots.group({
             group: group.name,
@@ -307,20 +280,16 @@ export default mixins(VDataIterator, Loadable).extend({
         }
       });
     },
-
     genDefaultGroupedRow(group, items, props) {
       const isOpen = !!this.openCache[group];
       const children = [this.$createElement('template', {
         slot: 'row.content'
       }, this.genRows(items, props))];
-
       const toggleFn = () => this.$set(this.openCache, group, !this.openCache[group]);
-
       const removeFn = () => props.updateOptions({
         groupBy: [],
         groupDesc: []
       });
-
       if (this.$scopedSlots['group.header']) {
         children.unshift(this.$createElement('template', {
           slot: 'column.header'
@@ -363,7 +332,6 @@ export default mixins(VDataIterator, Loadable).extend({
           slot: 'column.header'
         }, [column]));
       }
-
       if (this.$scopedSlots['group.summary']) {
         children.push(this.$createElement('template', {
           slot: 'column.summary'
@@ -377,7 +345,6 @@ export default mixins(VDataIterator, Loadable).extend({
           toggle: toggleFn
         })]));
       }
-
       return this.$createElement(RowGroup, {
         key: group,
         props: {
@@ -385,20 +352,17 @@ export default mixins(VDataIterator, Loadable).extend({
         }
       }, children);
     },
-
     genRows(items, props) {
       return this.$scopedSlots.item ? this.genScopedRows(items, props) : this.genDefaultRows(items, props);
     },
-
     genScopedRows(items, props) {
       const rows = [];
-
       for (let i = 0; i < items.length; i++) {
         const item = items[i];
-        rows.push(this.$scopedSlots.item({ ...this.createItemProps(item, i),
+        rows.push(this.$scopedSlots.item({
+          ...this.createItemProps(item, i),
           isMobile: this.isMobile
         }));
-
         if (this.isExpanded(item)) {
           rows.push(this.$scopedSlots['expanded-item']({
             headers: this.computedHeaders,
@@ -408,14 +372,11 @@ export default mixins(VDataIterator, Loadable).extend({
           }));
         }
       }
-
       return rows;
     },
-
     genDefaultRows(items, props) {
       return this.$scopedSlots['expanded-item'] ? items.map((item, index) => this.genDefaultExpandedRow(item, index)) : items.map((item, index) => this.genDefaultSimpleRow(item, index));
     },
-
     genDefaultExpandedRow(item, index) {
       const isExpanded = this.isExpanded(item);
       const classes = {
@@ -439,15 +400,14 @@ export default mixins(VDataIterator, Loadable).extend({
         slot: 'row.content'
       }, [expandedRow])]);
     },
-
     genDefaultSimpleRow(item, index) {
       let classes = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
       const scopedSlots = getPrefixedScopedSlots('item.', this.$scopedSlots);
       const data = this.createItemProps(item, index);
-
       if (this.showSelect) {
         const slot = scopedSlots['data-table-select'];
-        scopedSlots['data-table-select'] = slot ? () => slot({ ...data,
+        scopedSlots['data-table-select'] = slot ? () => slot({
+          ...data,
           isMobile: this.isMobile
         }) : () => this.$createElement(VSimpleCheckbox, {
           staticClass: 'v-data-table__checkbox',
@@ -461,7 +421,6 @@ export default mixins(VDataIterator, Loadable).extend({
           }
         });
       }
-
       if (this.showExpand) {
         const slot = scopedSlots['data-table-expand'];
         scopedSlots['data-table-expand'] = slot ? () => slot(data) : () => this.$createElement(VIcon, {
@@ -477,10 +436,10 @@ export default mixins(VDataIterator, Loadable).extend({
           }
         }, [this.expandIcon]);
       }
-
       return this.$createElement(this.isMobile ? MobileRow : Row, {
         key: getObjectValueByPath(item, this.itemKey),
-        class: mergeClasses({ ...classes,
+        class: mergeClasses({
+          ...classes,
           'v-data-table__selected': data.isSelected
         }, getPropertyFromItem(item, this.itemClass)),
         props: {
@@ -500,9 +459,9 @@ export default mixins(VDataIterator, Loadable).extend({
         }
       });
     },
-
     genBody(props) {
-      const data = { ...props,
+      const data = {
+        ...props,
         expand: this.expand,
         headers: this.computedHeaders,
         isExpanded: this.isExpanded,
@@ -510,20 +469,15 @@ export default mixins(VDataIterator, Loadable).extend({
         isSelected: this.isSelected,
         select: this.select
       };
-
       if (this.$scopedSlots.body) {
         return this.$scopedSlots.body(data);
       }
-
       return this.$createElement('tbody', [getSlot(this, 'body.prepend', data, true), this.genItems(props.items, props), getSlot(this, 'body.append', data, true)]);
     },
-
     genFoot(props) {
       var _this$$scopedSlots$fo, _this$$scopedSlots;
-
       return (_this$$scopedSlots$fo = (_this$$scopedSlots = this.$scopedSlots).foot) == null ? void 0 : _this$$scopedSlots$fo.call(_this$$scopedSlots, props);
     },
-
     genFooters(props) {
       const data = {
         props: {
@@ -539,22 +493,22 @@ export default mixins(VDataIterator, Loadable).extend({
         headers: this.computedHeaders
       };
       const children = [getSlot(this, 'footer', data, true)];
-
       if (!this.hideDefaultFooter) {
-        children.push(this.$createElement(VDataFooter, { ...data,
+        children.push(this.$createElement(VDataFooter, {
+          ...data,
           scopedSlots: getPrefixedScopedSlots('footer.', this.$scopedSlots)
         }));
       }
-
       return children;
     },
-
     genDefaultScopedSlot(props) {
       const simpleProps = {
         height: this.height,
         fixedHeader: this.fixedHeader,
         dense: this.dense
-      }; // if (this.virtualRows) {
+      };
+
+      // if (this.virtualRows) {
       //   return this.$createElement(VVirtualTable, {
       //     props: Object.assign(simpleProps, {
       //       items: props.items,
@@ -577,22 +531,21 @@ export default mixins(VDataIterator, Loadable).extend({
         class: {
           'v-data-table--mobile': this.isMobile
         }
-      }, [this.proxySlot('top', getSlot(this, 'top', { ...props,
+      }, [this.proxySlot('top', getSlot(this, 'top', {
+        ...props,
         isMobile: this.isMobile
       }, true)), this.genCaption(props), this.genColgroup(props), this.genHeaders(props), this.genBody(props), this.genFoot(props), this.proxySlot('bottom', this.genFooters(props))]);
     },
-
     proxySlot(slot, content) {
       return this.$createElement('template', {
         slot
       }, content);
     }
-
   },
-
   render() {
     return this.$createElement(VData, {
-      props: { ...this.$props,
+      props: {
+        ...this.$props,
         customFilter: this.customFilterWithColumns,
         customSort: this.customSortWithHeaders,
         itemsPerPage: this.computedItemsPerPage
@@ -620,6 +573,5 @@ export default mixins(VDataIterator, Loadable).extend({
       }
     });
   }
-
 });
 //# sourceMappingURL=VDataTable.mjs.map