buefy 0.7.9 → 0.8.2

package/dist/esm/table.js

@@ -0,0 +1,872 @@
+import { _ as _defineProperty, b as _toConsumableArray } from './chunk-d6200087.js';
+import { g as getValueByPath, a as indexOf } from './chunk-e5fce48f.js';
+import './chunk-9e3207cc.js';
+import './chunk-10c85529.js';
+import { I as Icon } from './chunk-e84b4047.js';
+import { _ as __vue_normalize__, r as registerComponent, u as use } from './chunk-cca88db8.js';
+import { C as Checkbox } from './chunk-9a776697.js';
+import { S as Select } from './chunk-912ed715.js';
+import { P as Pagination } from './chunk-cc718c15.js';
+import { S as SlotComponent } from './chunk-0e3f4fb5.js';
+
+var _components;
+var script = {
+  name: 'BTableMobileSort',
+  components: (_components = {}, _defineProperty(_components, Select.name, Select), _defineProperty(_components, Icon.name, Icon), _components),
+  props: {
+    currentSortColumn: Object,
+    isAsc: Boolean,
+    columns: Array,
+    placeholder: String
+  },
+  data: function data() {
+    return {
+      mobileSort: this.currentSortColumn
+    };
+  },
+  computed: {
+    showPlaceholder: function showPlaceholder() {
+      var _this = this;
+
+      return !this.columns || !this.columns.some(function (column) {
+        return column === _this.mobileSort;
+      });
+    }
+  },
+  watch: {
+    mobileSort: function mobileSort(column) {
+      if (this.currentSortColumn === column) return;
+      this.$emit('sort', column);
+    },
+    currentSortColumn: function currentSortColumn(column) {
+      this.mobileSort = column;
+    }
+  },
+  methods: {
+    sort: function sort() {
+      this.$emit('sort', this.mobileSort);
+    }
+  }
+};
+
+/* script */
+const __vue_script__ = script;
+
+/* template */
+var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"field table-mobile-sort"},[_c('div',{staticClass:"field has-addons"},[_c('b-select',{attrs:{"expanded":""},model:{value:(_vm.mobileSort),callback:function ($$v) {_vm.mobileSort=$$v;},expression:"mobileSort"}},[(_vm.placeholder)?[_c('option',{directives:[{name:"show",rawName:"v-show",value:(_vm.showPlaceholder),expression:"showPlaceholder"}],attrs:{"selected":"","disabled":"","hidden":""},domProps:{"value":{}}},[_vm._v("\n                    "+_vm._s(_vm.placeholder)+"\n                ")])]:_vm._e(),_vm._v(" "),_vm._l((_vm.columns),function(column,index){return (column.sortable)?_c('option',{key:index,domProps:{"value":column}},[_vm._v("\n                "+_vm._s(column.label)+"\n            ")]):_vm._e()})],2),_vm._v(" "),_c('div',{staticClass:"control"},[_c('button',{staticClass:"button is-primary",on:{"click":_vm.sort}},[_c('b-icon',{directives:[{name:"show",rawName:"v-show",value:(_vm.currentSortColumn === _vm.mobileSort),expression:"currentSortColumn === mobileSort"}],class:{ 'is-desc': !_vm.isAsc },attrs:{"icon":"arrow-up","size":"is-small","both":""}})],1)])],1)])};
+var __vue_staticRenderFns__ = [];
+
+  /* style */
+  const __vue_inject_styles__ = undefined;
+  /* scoped */
+  const __vue_scope_id__ = undefined;
+  /* module identifier */
+  const __vue_module_identifier__ = undefined;
+  /* functional template */
+  const __vue_is_functional_template__ = false;
+  /* style inject */
+  
+  /* style inject SSR */
+  
+
+  
+  var TableMobileSort = __vue_normalize__(
+    { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
+    __vue_inject_styles__,
+    __vue_script__,
+    __vue_scope_id__,
+    __vue_is_functional_template__,
+    __vue_module_identifier__,
+    undefined,
+    undefined
+  );
+
+//
+//
+//
+//
+//
+//
+//
+//
+//
+var script$1 = {
+  name: 'BTableColumn',
+  props: {
+    label: String,
+    customKey: [String, Number],
+    field: String,
+    meta: [String, Number, Boolean, Function, Object, Array],
+    width: [Number, String],
+    numeric: Boolean,
+    centered: Boolean,
+    sortable: Boolean,
+    visible: {
+      type: Boolean,
+      default: true
+    },
+    customSort: Function,
+    internal: Boolean // Used internally by Table
+
+  },
+  data: function data() {
+    return {
+      newKey: this.customKey || this.label
+    };
+  },
+  computed: {
+    rootClasses: function rootClasses() {
+      return {
+        'has-text-right': this.numeric && !this.centered,
+        'has-text-centered': this.centered
+      };
+    }
+  },
+  methods: {
+    addRefToTable: function addRefToTable() {
+      var _this = this;
+
+      if (!this.$parent.$data._isTable) {
+        this.$destroy();
+        throw new Error('You should wrap bTableColumn on a bTable');
+      }
+
+      if (this.internal) return; // Since we're using scoped prop the columns gonna be multiplied,
+      // this finds when to stop based on the newKey property.
+
+      var repeated = this.$parent.newColumns.some(function (column) {
+        return column.newKey === _this.newKey;
+      });
+      !repeated && this.$parent.newColumns.push(this);
+    }
+  },
+  beforeMount: function beforeMount() {
+    this.addRefToTable();
+  },
+  beforeUpdate: function beforeUpdate() {
+    this.addRefToTable();
+  },
+  beforeDestroy: function beforeDestroy() {
+    var index = this.$parent.newColumns.map(function (column) {
+      return column.newKey;
+    }).indexOf(this.newKey);
+
+    if (index >= 0) {
+      this.$parent.newColumns.splice(index, 1);
+    }
+  }
+};
+
+/* script */
+const __vue_script__$1 = script$1;
+
+/* template */
+var __vue_render__$1 = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return (_vm.visible)?_c('td',{class:_vm.rootClasses,attrs:{"data-label":_vm.label}},[_vm._t("default")],2):_vm._e()};
+var __vue_staticRenderFns__$1 = [];
+
+  /* style */
+  const __vue_inject_styles__$1 = undefined;
+  /* scoped */
+  const __vue_scope_id__$1 = undefined;
+  /* module identifier */
+  const __vue_module_identifier__$1 = undefined;
+  /* functional template */
+  const __vue_is_functional_template__$1 = false;
+  /* style inject */
+  
+  /* style inject SSR */
+  
+
+  
+  var TableColumn = __vue_normalize__(
+    { render: __vue_render__$1, staticRenderFns: __vue_staticRenderFns__$1 },
+    __vue_inject_styles__$1,
+    __vue_script__$1,
+    __vue_scope_id__$1,
+    __vue_is_functional_template__$1,
+    __vue_module_identifier__$1,
+    undefined,
+    undefined
+  );
+
+var _components$1;
+var script$2 = {
+  name: 'BTable',
+  components: (_components$1 = {}, _defineProperty(_components$1, Checkbox.name, Checkbox), _defineProperty(_components$1, Icon.name, Icon), _defineProperty(_components$1, Pagination.name, Pagination), _defineProperty(_components$1, SlotComponent.name, SlotComponent), _defineProperty(_components$1, TableMobileSort.name, TableMobileSort), _defineProperty(_components$1, TableColumn.name, TableColumn), _components$1),
+  props: {
+    data: {
+      type: Array,
+      default: function _default() {
+        return [];
+      }
+    },
+    columns: {
+      type: Array,
+      default: function _default() {
+        return [];
+      }
+    },
+    bordered: Boolean,
+    striped: Boolean,
+    narrowed: Boolean,
+    hoverable: Boolean,
+    loading: Boolean,
+    detailed: Boolean,
+    checkable: Boolean,
+    headerCheckable: {
+      type: Boolean,
+      default: true
+    },
+    checkboxPosition: {
+      type: String,
+      default: 'left',
+      validator: function validator(value) {
+        return ['left', 'right'].indexOf(value) >= 0;
+      }
+    },
+    selected: Object,
+    focusable: Boolean,
+    customIsChecked: Function,
+    isRowCheckable: {
+      type: Function,
+      default: function _default() {
+        return true;
+      }
+    },
+    checkedRows: {
+      type: Array,
+      default: function _default() {
+        return [];
+      }
+    },
+    mobileCards: {
+      type: Boolean,
+      default: true
+    },
+    defaultSort: [String, Array],
+    defaultSortDirection: {
+      type: String,
+      default: 'asc'
+    },
+    sortIcon: {
+      type: String,
+      default: 'arrow-up'
+    },
+    sortIconSize: {
+      type: String,
+      default: 'is-small'
+    },
+    paginated: Boolean,
+    currentPage: {
+      type: Number,
+      default: 1
+    },
+    perPage: {
+      type: [Number, String],
+      default: 20
+    },
+    showDetailIcon: {
+      type: Boolean,
+      default: true
+    },
+    paginationSimple: Boolean,
+    paginationSize: String,
+    paginationPosition: {
+      type: String,
+      default: 'bottom',
+      validator: function validator(value) {
+        return ['bottom', 'top', 'both'].indexOf(value) >= 0;
+      }
+    },
+    backendSorting: Boolean,
+    rowClass: {
+      type: Function,
+      default: function _default() {
+        return '';
+      }
+    },
+    openedDetailed: {
+      type: Array,
+      default: function _default() {
+        return [];
+      }
+    },
+    hasDetailedVisible: {
+      type: Function,
+      default: function _default() {
+        return true;
+      }
+    },
+    detailKey: {
+      type: String,
+      default: ''
+    },
+    customDetailRow: {
+      type: Boolean,
+      default: false
+    },
+    backendPagination: Boolean,
+    total: {
+      type: [Number, String],
+      default: 0
+    },
+    iconPack: String,
+    mobileSortPlaceholder: String,
+    customRowKey: String,
+    draggable: {
+      type: Boolean,
+      defualt: false
+    },
+    ariaNextLabel: String,
+    ariaPreviousLabel: String,
+    ariaPageLabel: String,
+    ariaCurrentLabel: String
+  },
+  data: function data() {
+    return {
+      getValueByPath: getValueByPath,
+      newColumns: _toConsumableArray(this.columns),
+      visibleDetailRows: this.openedDetailed,
+      newData: this.data,
+      newDataTotal: this.backendPagination ? this.total : this.data.length,
+      newCheckedRows: _toConsumableArray(this.checkedRows),
+      newCurrentPage: this.currentPage,
+      currentSortColumn: {},
+      isAsc: true,
+      firstTimeSort: true,
+      // Used by first time initSort
+      _isTable: true // Used by TableColumn
+
+    };
+  },
+  computed: {
+    /**
+    * return if detailed row tabled
+    * will be with chevron column & icon or not
+    */
+    showDetailRowIcon: function showDetailRowIcon() {
+      return this.detailed && this.showDetailIcon;
+    },
+    tableClasses: function tableClasses() {
+      return {
+        'is-bordered': this.bordered,
+        'is-striped': this.striped,
+        'is-narrow': this.narrowed,
+        'has-mobile-cards': this.mobileCards,
+        'is-hoverable': (this.hoverable || this.focusable) && this.visibleData.length
+      };
+    },
+
+    /**
+    * Splitted data based on the pagination.
+    */
+    visibleData: function visibleData() {
+      if (!this.paginated) return this.newData;
+      var currentPage = this.newCurrentPage;
+      var perPage = this.perPage;
+
+      if (this.newData.length <= perPage) {
+        return this.newData;
+      } else {
+        var start = (currentPage - 1) * perPage;
+        var end = parseInt(start, 10) + parseInt(perPage, 10);
+        return this.newData.slice(start, end);
+      }
+    },
+    visibleColumns: function visibleColumns() {
+      if (!this.newColumns) return this.newColumns;
+      return this.newColumns.filter(function (column) {
+        return column.visible || column.visible === undefined;
+      });
+    },
+
+    /**
+    * Check if all rows in the page are checked.
+    */
+    isAllChecked: function isAllChecked() {
+      var _this = this;
+
+      var validVisibleData = this.visibleData.filter(function (row) {
+        return _this.isRowCheckable(row);
+      });
+      if (validVisibleData.length === 0) return false;
+      var isAllChecked = validVisibleData.some(function (currentVisibleRow) {
+        return indexOf(_this.newCheckedRows, currentVisibleRow, _this.customIsChecked) < 0;
+      });
+      return !isAllChecked;
+    },
+
+    /**
+    * Check if all rows in the page are checkable.
+    */
+    isAllUncheckable: function isAllUncheckable() {
+      var _this2 = this;
+
+      var validVisibleData = this.visibleData.filter(function (row) {
+        return _this2.isRowCheckable(row);
+      });
+      return validVisibleData.length === 0;
+    },
+
+    /**
+    * Check if has any sortable column.
+    */
+    hasSortablenewColumns: function hasSortablenewColumns() {
+      return this.newColumns.some(function (column) {
+        return column.sortable;
+      });
+    },
+
+    /**
+    * Return total column count based if it's checkable or expanded
+    */
+    columnCount: function columnCount() {
+      var count = this.newColumns.length;
+      count += this.checkable ? 1 : 0;
+      count += this.detailed ? 1 : 0;
+      return count;
+    }
+  },
+  watch: {
+    /**
+    * When data prop change:
+    *   1. Update internal value.
+    *   2. Reset newColumns (thead), in case it's on a v-for loop.
+    *   3. Sort again if it's not backend-sort.
+    *   4. Set new total if it's not backend-paginated.
+    */
+    data: function data(value) {
+      var _this3 = this;
+
+      // Save newColumns before resetting
+      var newColumns = this.newColumns;
+      this.newColumns = [];
+      this.newData = value; // Prevent table from being headless, data could change and created hook
+      // on column might not trigger
+
+      this.$nextTick(function () {
+        if (!_this3.newColumns.length) _this3.newColumns = newColumns;
+      });
+
+      if (!this.backendSorting) {
+        this.sort(this.currentSortColumn, true);
+      }
+
+      if (!this.backendPagination) {
+        this.newDataTotal = value.length;
+      }
+    },
+
+    /**
+    * When Pagination total change, update internal total
+    * only if it's backend-paginated.
+    */
+    total: function total(newTotal) {
+      if (!this.backendPagination) return;
+      this.newDataTotal = newTotal;
+    },
+
+    /**
+    * When checkedRows prop change, update internal value without
+    * mutating original data.
+    */
+    checkedRows: function checkedRows(rows) {
+      this.newCheckedRows = _toConsumableArray(rows);
+    },
+    columns: function columns(value) {
+      this.newColumns = _toConsumableArray(value);
+    },
+    newColumns: function newColumns(value) {
+      this.checkSort();
+    },
+
+    /**
+        * When the user wants to control the detailed rows via props.
+        * Or wants to open the details of certain row with the router for example.
+        */
+    openedDetailed: function openedDetailed(expandedRows) {
+      this.visibleDetailRows = expandedRows;
+    },
+    currentPage: function currentPage(newVal) {
+      this.newCurrentPage = newVal;
+    }
+  },
+  methods: {
+    /**
+    * Sort an array by key without mutating original data.
+    * Call the user sort function if it was passed.
+    */
+    sortBy: function sortBy(array, key, fn, isAsc) {
+      var sorted = []; // Sorting without mutating original data
+
+      if (fn && typeof fn === 'function') {
+        sorted = _toConsumableArray(array).sort(function (a, b) {
+          return fn(a, b, isAsc);
+        });
+      } else {
+        sorted = _toConsumableArray(array).sort(function (a, b) {
+          // Get nested values from objects
+          var newA = getValueByPath(a, key);
+          var newB = getValueByPath(b, key); // sort boolean type
+
+          if (typeof newA === 'boolean' && typeof newB === 'boolean') {
+            return isAsc ? newA - newB : newB - newA;
+          }
+
+          if (!newA && newA !== 0) return 1;
+          if (!newB && newB !== 0) return -1;
+          if (newA === newB) return 0;
+          newA = typeof newA === 'string' ? newA.toUpperCase() : newA;
+          newB = typeof newB === 'string' ? newB.toUpperCase() : newB;
+          return isAsc ? newA > newB ? 1 : -1 : newA > newB ? -1 : 1;
+        });
+      }
+
+      return sorted;
+    },
+
+    /**
+    * Sort the column.
+    * Toggle current direction on column if it's sortable
+    * and not just updating the prop.
+    */
+    sort: function sort(column) {
+      var updatingData = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+      if (!column || !column.sortable) return;
+
+      if (!updatingData) {
+        this.isAsc = column === this.currentSortColumn ? !this.isAsc : this.defaultSortDirection.toLowerCase() !== 'desc';
+      }
+
+      if (!this.firstTimeSort) {
+        this.$emit('sort', column.field, this.isAsc ? 'asc' : 'desc');
+      }
+
+      if (!this.backendSorting) {
+        this.newData = this.sortBy(this.newData, column.field, column.customSort, this.isAsc);
+      }
+
+      this.currentSortColumn = column;
+    },
+
+    /**
+    * Check if the row is checked (is added to the array).
+    */
+    isRowChecked: function isRowChecked(row) {
+      return indexOf(this.newCheckedRows, row, this.customIsChecked) >= 0;
+    },
+
+    /**
+    * Remove a checked row from the array.
+    */
+    removeCheckedRow: function removeCheckedRow(row) {
+      var index = indexOf(this.newCheckedRows, row, this.customIsChecked);
+
+      if (index >= 0) {
+        this.newCheckedRows.splice(index, 1);
+      }
+    },
+
+    /**
+    * Header checkbox click listener.
+    * Add or remove all rows in current page.
+    */
+    checkAll: function checkAll() {
+      var _this4 = this;
+
+      var isAllChecked = this.isAllChecked;
+      this.visibleData.forEach(function (currentRow) {
+        _this4.removeCheckedRow(currentRow);
+
+        if (!isAllChecked) {
+          if (_this4.isRowCheckable(currentRow)) {
+            _this4.newCheckedRows.push(currentRow);
+          }
+        }
+      });
+      this.$emit('check', this.newCheckedRows);
+      this.$emit('check-all', this.newCheckedRows); // Emit checked rows to update user variable
+
+      this.$emit('update:checkedRows', this.newCheckedRows);
+    },
+
+    /**
+    * Row checkbox click listener.
+    * Add or remove a single row.
+    */
+    checkRow: function checkRow(row) {
+      if (!this.isRowChecked(row)) {
+        this.newCheckedRows.push(row);
+      } else {
+        this.removeCheckedRow(row);
+      }
+
+      this.$emit('check', this.newCheckedRows, row); // Emit checked rows to update user variable
+
+      this.$emit('update:checkedRows', this.newCheckedRows);
+    },
+
+    /**
+    * Row click listener.
+    * Emit all necessary events.
+    */
+    selectRow: function selectRow(row, index) {
+      this.$emit('click', row);
+      if (this.selected === row) return; // Emit new and old row
+
+      this.$emit('select', row, this.selected); // Emit new row to update user variable
+
+      this.$emit('update:selected', row);
+    },
+
+    /**
+    * Paginator change listener.
+    */
+    pageChanged: function pageChanged(page) {
+      this.newCurrentPage = page > 0 ? page : 1;
+      this.$emit('page-change', this.newCurrentPage);
+      this.$emit('update:currentPage', this.newCurrentPage);
+    },
+
+    /**
+    * Toggle to show/hide details slot
+    */
+    toggleDetails: function toggleDetails(obj) {
+      var found = this.isVisibleDetailRow(obj);
+
+      if (found) {
+        this.closeDetailRow(obj);
+        this.$emit('details-close', obj);
+      } else {
+        this.openDetailRow(obj);
+        this.$emit('details-open', obj);
+      } // Syncs the detailed rows with the parent component
+
+
+      this.$emit('update:openedDetailed', this.visibleDetailRows);
+    },
+    openDetailRow: function openDetailRow(obj) {
+      var index = this.handleDetailKey(obj);
+      this.visibleDetailRows.push(index);
+    },
+    closeDetailRow: function closeDetailRow(obj) {
+      var index = this.handleDetailKey(obj);
+      var i = this.visibleDetailRows.indexOf(index);
+      this.visibleDetailRows.splice(i, 1);
+    },
+    isVisibleDetailRow: function isVisibleDetailRow(obj) {
+      var index = this.handleDetailKey(obj);
+      var result = this.visibleDetailRows.indexOf(index) >= 0;
+      return result;
+    },
+    isActiveDetailRow: function isActiveDetailRow(row) {
+      return this.detailed && !this.customDetailRow && this.isVisibleDetailRow(row);
+    },
+    isActiveCustomDetailRow: function isActiveCustomDetailRow(row) {
+      return this.detailed && this.customDetailRow && this.isVisibleDetailRow(row);
+    },
+
+    /**
+        * When the detailKey is defined we use the object[detailKey] as index.
+        * If not, use the object reference by default.
+        */
+    handleDetailKey: function handleDetailKey(index) {
+      var key = this.detailKey;
+      return !key.length ? index : index[key];
+    },
+    checkPredefinedDetailedRows: function checkPredefinedDetailedRows() {
+      var defaultExpandedRowsDefined = this.openedDetailed.length > 0;
+
+      if (defaultExpandedRowsDefined && !this.detailKey.length) {
+        throw new Error('If you set a predefined opened-detailed, you must provide a unique key using the prop "detail-key"');
+      }
+    },
+
+    /**
+    * Call initSort only first time (For example async data).
+    */
+    checkSort: function checkSort() {
+      if (this.newColumns.length && this.firstTimeSort) {
+        this.initSort();
+        this.firstTimeSort = false;
+      } else if (this.newColumns.length) {
+        if (this.currentSortColumn.field) {
+          for (var i = 0; i < this.newColumns.length; i++) {
+            if (this.newColumns[i].field === this.currentSortColumn.field) {
+              this.currentSortColumn = this.newColumns[i];
+              break;
+            }
+          }
+        }
+      }
+    },
+
+    /**
+    * Check if footer slot has custom content.
+    */
+    hasCustomFooterSlot: function hasCustomFooterSlot() {
+      if (this.$slots.footer.length > 1) return true;
+      var tag = this.$slots.footer[0].tag;
+      if (tag !== 'th' && tag !== 'td') return false;
+      return true;
+    },
+
+    /**
+    * Check if bottom-left slot exists.
+    */
+    hasBottomLeftSlot: function hasBottomLeftSlot() {
+      return typeof this.$slots['bottom-left'] !== 'undefined';
+    },
+
+    /**
+    * Table arrow keys listener, change selection.
+    */
+    pressedArrow: function pressedArrow(pos) {
+      if (!this.visibleData.length) return;
+      var index = this.visibleData.indexOf(this.selected) + pos; // Prevent from going up from first and down from last
+
+      index = index < 0 ? 0 : index > this.visibleData.length - 1 ? this.visibleData.length - 1 : index;
+      this.selectRow(this.visibleData[index]);
+    },
+
+    /**
+    * Focus table element if has selected prop.
+    */
+    focus: function focus() {
+      if (!this.focusable) return;
+      this.$el.querySelector('table').focus();
+    },
+
+    /**
+    * Initial sorted column based on the default-sort prop.
+    */
+    initSort: function initSort() {
+      var _this5 = this;
+
+      if (!this.defaultSort) return;
+      var sortField = '';
+      var sortDirection = this.defaultSortDirection;
+
+      if (Array.isArray(this.defaultSort)) {
+        sortField = this.defaultSort[0];
+
+        if (this.defaultSort[1]) {
+          sortDirection = this.defaultSort[1];
+        }
+      } else {
+        sortField = this.defaultSort;
+      }
+
+      this.newColumns.forEach(function (column) {
+        if (column.field === sortField) {
+          _this5.isAsc = sortDirection.toLowerCase() !== 'desc';
+
+          _this5.sort(column, true);
+        }
+      });
+    },
+
+    /**
+    * Emits drag start event
+    */
+    handleDragStart: function handleDragStart(event, row, index) {
+      this.$emit('dragstart', {
+        event: event,
+        row: row,
+        index: index
+      });
+    },
+
+    /**
+    * Emits drop event
+    */
+    handleDrop: function handleDrop(event, row, index) {
+      this.$emit('drop', {
+        event: event,
+        row: row,
+        index: index
+      });
+    },
+
+    /**
+    * Emits drag over event
+    */
+    handleDragOver: function handleDragOver(event, row, index) {
+      this.$emit('dragover', {
+        event: event,
+        row: row,
+        index: index
+      });
+    },
+
+    /**
+    * Emits drag leave event
+    */
+    handleDragLeave: function handleDragLeave(event, row, index) {
+      this.$emit('dragleave', {
+        event: event,
+        row: row,
+        index: index
+      });
+    }
+  },
+  mounted: function mounted() {
+    this.checkPredefinedDetailedRows();
+    this.checkSort();
+  }
+};
+
+/* script */
+const __vue_script__$2 = script$2;
+
+/* template */
+var __vue_render__$2 = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"b-table",class:{ 'is-loading': _vm.loading }},[(_vm.mobileCards && _vm.hasSortablenewColumns)?_c('b-table-mobile-sort',{attrs:{"current-sort-column":_vm.currentSortColumn,"is-asc":_vm.isAsc,"columns":_vm.newColumns,"placeholder":_vm.mobileSortPlaceholder},on:{"sort":function (column) { return _vm.sort(column); }}}):_vm._e(),_vm._v(" "),(_vm.paginated && (_vm.paginationPosition === 'top' || _vm.paginationPosition === 'both'))?_c('div',{staticClass:"top level"},[_c('div',{staticClass:"level-left"},[_vm._t("top-left")],2),_vm._v(" "),_c('div',{staticClass:"level-right"},[(_vm.paginated)?_c('div',{staticClass:"level-item"},[_c('b-pagination',{attrs:{"icon-pack":_vm.iconPack,"total":_vm.newDataTotal,"per-page":_vm.perPage,"simple":_vm.paginationSimple,"size":_vm.paginationSize,"current":_vm.newCurrentPage,"aria-next-label":_vm.ariaNextLabel,"aria-previous-label":_vm.ariaPreviousLabel,"aria-page-label":_vm.ariaPageLabel,"aria-current-label":_vm.ariaCurrentLabel},on:{"change":_vm.pageChanged}})],1):_vm._e()])]):_vm._e(),_vm._v(" "),_c('div',{staticClass:"table-wrapper"},[_c('table',{staticClass:"table",class:_vm.tableClasses,attrs:{"tabindex":!_vm.focusable ? false : 0},on:{"keydown":[function($event){if(!('button' in $event)&&_vm._k($event.keyCode,"up",38,$event.key)){ return null; }if($event.target !== $event.currentTarget){ return null; }$event.preventDefault();_vm.pressedArrow(-1);},function($event){if(!('button' in $event)&&_vm._k($event.keyCode,"down",40,$event.key)){ return null; }if($event.target !== $event.currentTarget){ return null; }$event.preventDefault();_vm.pressedArrow(1);}]}},[(_vm.newColumns.length)?_c('thead',[_c('tr',[(_vm.showDetailRowIcon)?_c('th',{attrs:{"width":"40px"}}):_vm._e(),_vm._v(" "),(_vm.checkable && _vm.checkboxPosition === 'left')?_c('th',{staticClass:"checkbox-cell"},[(_vm.headerCheckable)?[_c('b-checkbox',{attrs:{"value":_vm.isAllChecked,"disabled":_vm.isAllUncheckable},nativeOn:{"change":function($event){_vm.checkAll($event);}}})]:_vm._e()],2):_vm._e(),_vm._v(" "),_vm._l((_vm.visibleColumns),function(column,index){return _c('th',{key:index,class:{
+                            'is-current-sort': _vm.currentSortColumn === column,
+                            'is-sortable': column.sortable
+                        },style:({
+                            width: column.width === undefined ? null : column.width + 'px'
+                        }),on:{"click":function($event){$event.stopPropagation();_vm.sort(column);}}},[_c('div',{staticClass:"th-wrap",class:{
+                                'is-numeric': column.numeric,
+                                'is-centered': column.centered
+                        }},[(column.$scopedSlots && column.$scopedSlots.header)?[_c('b-slot-component',{attrs:{"component":column,"scoped":true,"name":"header","tag":"span","props":{ column: column, index: index }}})]:(_vm.$scopedSlots.header)?[_vm._t("header",null,{column:column,index:index})]:[_vm._v(_vm._s(column.label))],_vm._v(" "),_c('b-icon',{directives:[{name:"show",rawName:"v-show",value:(_vm.currentSortColumn === column),expression:"currentSortColumn === column"}],class:{ 'is-desc': !_vm.isAsc },attrs:{"icon":_vm.sortIcon,"pack":_vm.iconPack,"both":"","size":_vm.sortIconSize}})],2)])}),_vm._v(" "),(_vm.checkable && _vm.checkboxPosition === 'right')?_c('th',{staticClass:"checkbox-cell"},[(_vm.headerCheckable)?[_c('b-checkbox',{attrs:{"value":_vm.isAllChecked,"disabled":_vm.isAllUncheckable},nativeOn:{"change":function($event){_vm.checkAll($event);}}})]:_vm._e()],2):_vm._e()],2)]):_vm._e(),_vm._v(" "),(_vm.visibleData.length)?_c('tbody',[_vm._l((_vm.visibleData),function(row,index){return [_c('tr',{key:_vm.customRowKey ? row[_vm.customRowKey] : index,class:[_vm.rowClass(row, index), {
+                            'is-selected': row === _vm.selected,
+                            'is-checked': _vm.isRowChecked(row),
+                        }],attrs:{"draggable":_vm.draggable},on:{"click":function($event){_vm.selectRow(row);},"dblclick":function($event){_vm.$emit('dblclick', row);},"mouseenter":function($event){_vm.$emit('mouseenter', row);},"mouseleave":function($event){_vm.$emit('mouseleave', row);},"contextmenu":function($event){_vm.$emit('contextmenu', row, $event);},"dragstart":function($event){_vm.handleDragStart($event, row, index);},"drop":function($event){_vm.handleDrop($event, row, index);},"dragover":function($event){_vm.handleDragOver($event, row, index);},"dragleave":function($event){_vm.handleDragLeave($event, row, index);}}},[(_vm.showDetailRowIcon)?_c('td',{staticClass:"chevron-cell"},[(_vm.hasDetailedVisible(row))?_c('a',{attrs:{"role":"button"},on:{"click":function($event){$event.stopPropagation();_vm.toggleDetails(row);}}},[_c('b-icon',{class:{'is-expanded': _vm.isVisibleDetailRow(row)},attrs:{"icon":"chevron-right","pack":_vm.iconPack,"both":""}})],1):_vm._e()]):_vm._e(),_vm._v(" "),(_vm.checkable && _vm.checkboxPosition === 'left')?_c('td',{staticClass:"checkbox-cell"},[_c('b-checkbox',{attrs:{"disabled":!_vm.isRowCheckable(row),"value":_vm.isRowChecked(row)},nativeOn:{"change":function($event){_vm.checkRow(row);},"click":function($event){$event.stopPropagation();}}})],1):_vm._e(),_vm._v(" "),(_vm.$scopedSlots.default)?_vm._t("default",null,{row:row,index:index}):_vm._l((_vm.newColumns),function(column){return _c('BTableColumn',_vm._b({key:column.field,attrs:{"internal":""}},'BTableColumn',column,false),[(column.renderHtml)?_c('span',{domProps:{"innerHTML":_vm._s(_vm.getValueByPath(row, column.field))}}):[_vm._v("\n                                    "+_vm._s(_vm.getValueByPath(row, column.field))+"\n                                ")]],2)}),_vm._v(" "),(_vm.checkable && _vm.checkboxPosition === 'right')?_c('td',{staticClass:"checkbox-cell"},[_c('b-checkbox',{attrs:{"disabled":!_vm.isRowCheckable(row),"value":_vm.isRowChecked(row)},nativeOn:{"change":function($event){_vm.checkRow(row);},"click":function($event){$event.stopPropagation();}}})],1):_vm._e()],2),_vm._v(" "),(_vm.isActiveDetailRow(row))?_c('tr',{staticClass:"detail"},[_c('td',{attrs:{"colspan":_vm.columnCount}},[_c('div',{staticClass:"detail-container"},[_vm._t("detail",null,{row:row,index:index})],2)])]):_vm._e(),_vm._v(" "),(_vm.isActiveCustomDetailRow(row))?_vm._t("detail",null,{row:row,index:index}):_vm._e()]})],2):_c('tbody',[_c('tr',{staticClass:"is-empty"},[_c('td',{attrs:{"colspan":_vm.columnCount}},[_vm._t("empty")],2)])]),_vm._v(" "),(_vm.$slots.footer !== undefined)?_c('tfoot',[_c('tr',{staticClass:"table-footer"},[(_vm.hasCustomFooterSlot())?_vm._t("footer"):_c('th',{attrs:{"colspan":_vm.columnCount}},[_vm._t("footer")],2)],2)]):_vm._e()])]),_vm._v(" "),((_vm.checkable && _vm.hasBottomLeftSlot()) ||
+        (_vm.paginated && (_vm.paginationPosition === 'bottom' || _vm.paginationPosition === 'both')))?_c('div',{staticClass:"level"},[_c('div',{staticClass:"level-left"},[_vm._t("bottom-left")],2),_vm._v(" "),_c('div',{staticClass:"level-right"},[(_vm.paginated)?_c('div',{staticClass:"level-item"},[_c('b-pagination',{attrs:{"icon-pack":_vm.iconPack,"total":_vm.newDataTotal,"per-page":_vm.perPage,"simple":_vm.paginationSimple,"size":_vm.paginationSize,"current":_vm.newCurrentPage,"aria-next-label":_vm.ariaNextLabel,"aria-previous-label":_vm.ariaPreviousLabel,"aria-page-label":_vm.ariaPageLabel,"aria-current-label":_vm.ariaCurrentLabel},on:{"change":_vm.pageChanged}})],1):_vm._e()])]):_vm._e()],1)};
+var __vue_staticRenderFns__$2 = [];
+
+  /* style */
+  const __vue_inject_styles__$2 = undefined;
+  /* scoped */
+  const __vue_scope_id__$2 = undefined;
+  /* module identifier */
+  const __vue_module_identifier__$2 = undefined;
+  /* functional template */
+  const __vue_is_functional_template__$2 = false;
+  /* style inject */
+  
+  /* style inject SSR */
+  
+
+  
+  var Table = __vue_normalize__(
+    { render: __vue_render__$2, staticRenderFns: __vue_staticRenderFns__$2 },
+    __vue_inject_styles__$2,
+    __vue_script__$2,
+    __vue_scope_id__$2,
+    __vue_is_functional_template__$2,
+    __vue_module_identifier__$2,
+    undefined,
+    undefined
+  );
+
+var Plugin = {
+  install: function install(Vue) {
+    registerComponent(Vue, Table);
+    registerComponent(Vue, TableColumn);
+  }
+};
+use(Plugin);
+
+export default Plugin;
+export { Table, TableColumn };