From 955975bf4eb8ba932297175b4eb9a78f83bb7afe Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 10:05:16 -0300
Subject: [PATCH 01/24] Update mixin-selectable.js

---
 src/components/table/helpers/mixin-selectable.js | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/src/components/table/helpers/mixin-selectable.js b/src/components/table/helpers/mixin-selectable.js
index b350dc9e893..9ced5db9f30 100644
--- a/src/components/table/helpers/mixin-selectable.js
+++ b/src/components/table/helpers/mixin-selectable.js
@@ -23,6 +23,14 @@ export default {
       selectedLastRow: -1
     }
   },
+  computed: {
+    isSelecting() {
+      return this.selectable &&
+        this.selectMode === 'range' &&
+        this.selectedRows &&
+        this.selectedRows.some(Boolean)
+    }
+  },
   watch: {
     computedItems(newVal, oldVal) {
       // Reset for selectable

From 9a4c6d667f8dca8115a0af1f36e45d258f97a8d7 Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 10:07:56 -0300
Subject: [PATCH 02/24] Update mixin-selectable.js

---
 src/components/table/helpers/mixin-selectable.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/table/helpers/mixin-selectable.js b/src/components/table/helpers/mixin-selectable.js
index 9ced5db9f30..4d3d5713e65 100644
--- a/src/components/table/helpers/mixin-selectable.js
+++ b/src/components/table/helpers/mixin-selectable.js
@@ -25,10 +25,12 @@ export default {
   },
   computed: {
     isSelecting() {
-      return this.selectable &&
+      return (
+        this.selectable &&
         this.selectMode === 'range' &&
         this.selectedRows &&
         this.selectedRows.some(Boolean)
+      )
     }
   },
   watch: {

From d98e6346003e68e0c3cccea37f7b3b37490aeebb Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 10:14:47 -0300
Subject: [PATCH 03/24] Update _table.scss

---
 src/components/table/_table.scss | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/components/table/_table.scss b/src/components/table/_table.scss
index 14f20c57192..d4f4507df86 100644
--- a/src/components/table/_table.scss
+++ b/src/components/table/_table.scss
@@ -159,7 +159,12 @@
 }
 
 /* b-table: selectable rows */
-table.b-table.b-table-selectable > tbody > tr {
+.b-table.table.b-table-selectable {
   cursor: pointer;
-  // user-select: none;
+
+  // Disabled text-selection when in mode range with at
+  // least one row selected
+  &.b-table-selecting {
+    user-select: none;
+  }
 }

From bab6987df83f917648a62df8c0477e16e2d6383b Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 10:15:59 -0300
Subject: [PATCH 04/24] Update _table.scss

---
 src/components/table/_table.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/table/_table.scss b/src/components/table/_table.scss
index d4f4507df86..b080d53d97a 100644
--- a/src/components/table/_table.scss
+++ b/src/components/table/_table.scss
@@ -164,7 +164,7 @@
 
   // Disabled text-selection when in mode range with at
   // least one row selected
-  &.b-table-selecting {
+  &.b-table-selecting-range {
     user-select: none;
   }
 }

From ce244399894d4c647f42d6d52f36ea36853937f0 Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 10:17:32 -0300
Subject: [PATCH 05/24] Update table.js

---
 src/components/table/table.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/table/table.js b/src/components/table/table.js
index fb484250fd7..c0aace322bb 100644
--- a/src/components/table/table.js
+++ b/src/components/table/table.js
@@ -198,7 +198,8 @@ export default {
         'b-table-fixed': this.fixed,
         'b-table-stacked': this.stacked === true || this.stacked === '',
         [`b-table-stacked-${this.stacked}`]: this.stacked !== true && this.stacked,
-        'b-table-selectable': this.selectable
+        'b-table-selectable': this.selectable,
+        'b-table-selecting-range': this.isSelectingRange
       }
     },
     // Items related computed props

From c7966935631fe9ce10ed0218953a37a1544fd45d Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 10:18:31 -0300
Subject: [PATCH 06/24] Update mixin-selectable.js

---
 src/components/table/helpers/mixin-selectable.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/table/helpers/mixin-selectable.js b/src/components/table/helpers/mixin-selectable.js
index 4d3d5713e65..dd7385dfaa8 100644
--- a/src/components/table/helpers/mixin-selectable.js
+++ b/src/components/table/helpers/mixin-selectable.js
@@ -24,7 +24,7 @@ export default {
     }
   },
   computed: {
-    isSelecting() {
+    isSelectingRange() {
       return (
         this.selectable &&
         this.selectMode === 'range' &&

From 72a377a7a954aac2f43019bc5612c75bfebfee78 Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 10:23:45 -0300
Subject: [PATCH 07/24] Update _table.scss

---
 src/components/table/_table.scss | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/components/table/_table.scss b/src/components/table/_table.scss
index b080d53d97a..4d4ed665b7b 100644
--- a/src/components/table/_table.scss
+++ b/src/components/table/_table.scss
@@ -160,11 +160,15 @@
 
 /* b-table: selectable rows */
 .b-table.table.b-table-selectable {
-  cursor: pointer;
+  & > tbody > tr {
+    cursor: pointer;
+  }
 
   // Disabled text-selection when in mode range with at
   // least one row selected
   &.b-table-selecting-range {
-    user-select: none;
+    & > tbody > tr {
+      user-select: none;
+    }
   }
 }

From 8a642e0594ef76eac59e4cbf5af6743df1ce0fc1 Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 10:29:49 -0300
Subject: [PATCH 08/24] Update table-selectable.spec.js

---
 src/components/table/table-selectable.spec.js | 44 +++++++++++++++++++
 1 file changed, 44 insertions(+)

diff --git a/src/components/table/table-selectable.spec.js b/src/components/table/table-selectable.spec.js
index 5ebf113454e..05bd8f0b64b 100644
--- a/src/components/table/table-selectable.spec.js
+++ b/src/components/table/table-selectable.spec.js
@@ -28,6 +28,8 @@ describe('table row select', () => {
     })
     expect(wrapper).toBeDefined()
     await wrapper.vm.$nextTick()
+    expect(wrapper.classes()).not.toContain('b-table-selectable')
+    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
     const $rows = wrapper.findAll('tbody > tr')
     expect($rows.length).toBe(4)
     // Doesn't have aria-selected attribute on all TRs
@@ -50,6 +52,8 @@ describe('table row select', () => {
     })
     expect(wrapper).toBeDefined()
     await wrapper.vm.$nextTick()
+    expect(wrapper.classes()).not.toContain('b-table-selectable')
+    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
     const $rows = wrapper.findAll('tbody > tr')
     expect($rows.length).toBe(4)
     // Doesn't have aria-selected attribute on all TRs
@@ -73,6 +77,8 @@ describe('table row select', () => {
 
     expect(wrapper).toBeDefined()
     await wrapper.vm.$nextTick()
+    expect(wrapper.classes()).toContain('b-table-selectable')
+    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
     expect(wrapper.emitted('row-selected')).not.toBeDefined()
     $rows = wrapper.findAll('tbody > tr')
     expect($rows.length).toBe(4)
@@ -94,6 +100,8 @@ describe('table row select', () => {
     expect($rows.at(1).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
+    expect(wrapper.classes()).toContain('b-table-selectable')
+    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
 
     // Click third row
     wrapper
@@ -109,6 +117,8 @@ describe('table row select', () => {
     expect($rows.at(1).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(2).is('[aria-selected="true"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
+    expect(wrapper.classes()).toContain('b-table-selectable')
+    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
 
     // Click third row again
     wrapper
@@ -124,6 +134,8 @@ describe('table row select', () => {
     expect($rows.at(1).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
+    expect(wrapper.classes()).toContain('b-table-selectable')
+    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
 
     wrapper.destroy()
   })
@@ -140,6 +152,8 @@ describe('table row select', () => {
     let $rows
     expect(wrapper).toBeDefined()
     await wrapper.vm.$nextTick()
+    expect(wrapper.classes()).toContain('b-table-selectable')
+    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
     expect(wrapper.emitted('row-selected')).not.toBeDefined()
 
     // Click first row
@@ -157,6 +171,8 @@ describe('table row select', () => {
     expect($rows.at(1).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
+    expect(wrapper.classes()).toContain('b-table-selectable')
+    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
 
     // Click third row
     wrapper
@@ -172,6 +188,8 @@ describe('table row select', () => {
     expect($rows.at(1).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(2).is('[aria-selected="true"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
+    expect(wrapper.classes()).toContain('b-table-selectable')
+    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
 
     // Click third row again
     wrapper
@@ -187,6 +205,8 @@ describe('table row select', () => {
     expect($rows.at(1).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
+    expect(wrapper.classes()).toContain('b-table-selectable')
+    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
 
     // Click first row again
     wrapper
@@ -202,6 +222,8 @@ describe('table row select', () => {
     expect($rows.at(1).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
+    expect(wrapper.classes()).toContain('b-table-selectable')
+    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
 
     wrapper.destroy()
   })
@@ -218,6 +240,8 @@ describe('table row select', () => {
     let $rows
     expect(wrapper).toBeDefined()
     await wrapper.vm.$nextTick()
+    expect(wrapper.classes()).toContain('b-table-selectable')
+    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
     expect(wrapper.emitted('row-selected')).not.toBeDefined()
     $rows = wrapper.findAll('tbody > tr')
     expect($rows.is('[tabindex="0"]')).toBe(true)
@@ -238,6 +262,8 @@ describe('table row select', () => {
     expect($rows.at(1).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
+    expect(wrapper.classes()).toContain('b-table-selectable')
+    expect(wrapper.classes()).toContain('b-table-selecting-range')
 
     // Shift-Click third row
     wrapper
@@ -257,6 +283,8 @@ describe('table row select', () => {
     expect($rows.at(1).is('[aria-selected="true"]')).toBe(true)
     expect($rows.at(2).is('[aria-selected="true"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
+    expect(wrapper.classes()).toContain('b-table-selectable')
+    expect(wrapper.classes()).toContain('b-table-selecting-range')
 
     // Click third row again
     wrapper
@@ -272,6 +300,8 @@ describe('table row select', () => {
     expect($rows.at(1).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(2).is('[aria-selected="true"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
+    expect(wrapper.classes()).toContain('b-table-selectable')
+    expect(wrapper.classes()).toContain('b-table-selecting-range')
 
     // Click fourth row
     wrapper
@@ -287,6 +317,8 @@ describe('table row select', () => {
     expect($rows.at(1).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="true"]')).toBe(true)
+    expect(wrapper.classes()).toContain('b-table-selectable')
+    expect(wrapper.classes()).toContain('b-table-selecting-range')
 
     // Click fourth row again
     wrapper
@@ -302,6 +334,8 @@ describe('table row select', () => {
     expect($rows.at(1).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="true"]')).toBe(true)
+    expect(wrapper.classes()).toContain('b-table-selectable')
+    expect(wrapper.classes()).toContain('b-table-selecting-range')
 
     // Ctrl-Click second row
     wrapper
@@ -317,6 +351,8 @@ describe('table row select', () => {
     expect($rows.at(1).is('[aria-selected="true"]')).toBe(true)
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="true"]')).toBe(true)
+    expect(wrapper.classes()).toContain('b-table-selectable')
+    expect(wrapper.classes()).toContain('b-table-selecting-range')
 
     // Ctrl-Click second row
     wrapper
@@ -332,6 +368,8 @@ describe('table row select', () => {
     expect($rows.at(1).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="true"]')).toBe(true)
+    expect(wrapper.classes()).toContain('b-table-selectable')
+    expect(wrapper.classes()).toContain('b-table-selecting-range')
 
     // Ctrl-Click fourth row
     wrapper
@@ -347,6 +385,8 @@ describe('table row select', () => {
     expect($rows.at(1).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
+    expect(wrapper.classes()).toContain('b-table-selectable')
+    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
 
     wrapper.destroy()
   })
@@ -572,6 +612,8 @@ describe('table row select', () => {
     expect($rows.at(1).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
+    expect(wrapper.classes()).toContain('b-table-selectable')
+    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
 
     // Disabled selectable
     wrapper.setProps({
@@ -584,6 +626,8 @@ describe('table row select', () => {
     // Should remove tabindex and aria-selected attributes
     expect($rows.is('[tabindex]')).toBe(false)
     expect($rows.is('[aria-selected]')).toBe(false)
+    expect(wrapper.classes()).not.toContain('b-table-selectable')
+    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
 
     wrapper.destroy()
   })

From e37388933f9ca401892d142167ebcc5de6fd0904 Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 21:28:46 -0300
Subject: [PATCH 09/24] Update mixin-selectable.js

---
 .../table/helpers/mixin-selectable.js         | 45 ++++++++++++++-----
 1 file changed, 35 insertions(+), 10 deletions(-)

diff --git a/src/components/table/helpers/mixin-selectable.js b/src/components/table/helpers/mixin-selectable.js
index dd7385dfaa8..a3a1e19550f 100644
--- a/src/components/table/helpers/mixin-selectable.js
+++ b/src/components/table/helpers/mixin-selectable.js
@@ -1,5 +1,5 @@
 import looseEqual from '../../../utils/loose-equal'
-import { isArray } from '../../../utils/array'
+import { isArray, arrayIncludes } from '../../../utils/array'
 import sanitizeRow from './sanitize-row'
 
 export default {
@@ -24,13 +24,26 @@ export default {
     }
   },
   computed: {
-    isSelectingRange() {
-      return (
-        this.selectable &&
-        this.selectMode === 'range' &&
-        this.selectedRows &&
-        this.selectedRows.some(Boolean)
-      )
+    selectableTableClasses() {
+      const selectable = this.selectable
+      const isSelecting = selectable && this.selectedRows && this.selectedRows.some(Boolean)
+      return {
+        'b-table-selectable': selectable,
+        [`b-table-select-${this.selectMode}`]: selectable,
+        'b-table-selecting': isSelecting
+      }
+    },
+    selectableTableAttributes() {
+      return {
+        'aria-multiselectable': this.selectableIsMultiSelect
+      }
+    },
+    selectableIsMultiSelect() {
+      if (this.selectable) {
+        return arrayIncludes(['range', 'multi'], this.selectMode) ? 'true' : 'false'
+      } else {
+        return null
+      }
     }
   },
   watch: {
@@ -95,6 +108,20 @@ export default {
         return {}
       }
     },
+    selectableRowClasses(idx) {
+      const rowSelected = this.isRowSelected(idx)
+      const base = this.dark ? 'bg' : 'table'
+      const variant = this.selectedVariant
+      return {
+        'b-table-row-selected': this.selectable && rowSelected,
+        [`${base}-${variant}`]: this.selectable && rowSelected && variant
+      }
+    },
+    selectableRowAttributes(idx) {
+      return {
+        'aria-selected' = !this.selectable ? null : this.isRowSelected(idx) ? 'true' : 'false'
+      }
+    },
     clearSelected() {
       let hasSelection = this.selectedRows.reduce((prev, v) => {
         return prev || v
@@ -135,7 +162,6 @@ export default {
             idx <= Math.max(this.selectedLastRow, index);
             idx++
           ) {
-            // this.$set(this.selectedRows, idx, true)
             selectedRows[idx] = true
           }
           selected = true
@@ -148,7 +174,6 @@ export default {
           this.selectedLastRow = selected ? index : -1
         }
       }
-      // this.$set(this.selectedRows, index, selected)
       selectedRows[index] = selected
       this.selectedRows = selectedRows
     }

From 5e07057bb448902bfe1a507595db8c25e75ceff2 Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 21:37:04 -0300
Subject: [PATCH 10/24] Update table.js

---
 src/components/table/table.js | 76 +++++++++++++++++------------------
 1 file changed, 38 insertions(+), 38 deletions(-)

diff --git a/src/components/table/table.js b/src/components/table/table.js
index c0aace322bb..ddd4f3c980b 100644
--- a/src/components/table/table.js
+++ b/src/components/table/table.js
@@ -186,20 +186,44 @@ export default {
           : ''
     },
     tableClasses() {
+      return [
+        {
+          'table-striped': this.striped,
+          'table-hover': this.hover,
+          'table-dark': this.dark,
+          'table-bordered': this.bordered,
+          'table-borderless': this.borderless,
+          'table-sm': this.small,
+          border: this.outlined,
+          // The following are b-table custom styles
+          'b-table-fixed': this.fixed,
+          'b-table-stacked': this.stacked === true || this.stacked === '',
+          [`b-table-stacked-${this.stacked}`]: this.stacked !== true && this.stacked
+        },
+        // Selectable classes
+        this.selectableTableClasses
+      ]
+    },
+    tableAttrs() {
+      // Preserve user supplied aria-describedby, if provided in $attrs
+      const adb =
+        [(this.$attrs || {})['aria-describedby'], this.captionId]
+          .filter(Boolean)
+          .join(' ') || null
+
       return {
-        'table-striped': this.striped,
-        'table-hover': this.hover,
-        'table-dark': this.dark,
-        'table-bordered': this.bordered,
-        'table-borderless': this.borderless,
-        'table-sm': this.small,
-        border: this.outlined,
-        // The following are b-table custom styles
-        'b-table-fixed': this.fixed,
-        'b-table-stacked': this.stacked === true || this.stacked === '',
-        [`b-table-stacked-${this.stacked}`]: this.stacked !== true && this.stacked,
-        'b-table-selectable': this.selectable,
-        'b-table-selecting-range': this.isSelectingRange
+        // We set aria-rowcount before merging in $attrs, in case user has supplied their own
+        'aria-rowcount':
+          this.filteredItems.length > items.length ? String(this.filteredItems.length) : null,
+        // Merge in user supplied $attrs if any
+        ...this.$attrs,
+        // Now we can override any $attrs here
+        id: this.safeId(),
+        role: this.isStacked ? 'table' : null,
+        'aria-busy': this.computedBusy ? 'true' : 'false',
+        'aria-colcount': String(fields.length),
+        'aria-describedby': adb,
+        ...this.selectableTableAttrs
       }
     },
     // Items related computed props
@@ -503,31 +527,7 @@ export default {
         key: 'b-table',
         staticClass: 'table b-table',
         class: this.tableClasses,
-        attrs: {
-          // We set aria-rowcount before merging in $attrs, in case user has supplied their own
-          'aria-rowcount':
-            this.filteredItems.length > items.length ? String(this.filteredItems.length) : null,
-          // Merge in user supplied $attrs if any
-          ...this.$attrs,
-          // Now we can override any $attrs here
-          id: this.safeId(),
-          role: this.isStacked ? 'table' : null,
-          'aria-multiselectable': this.selectable
-            ? this.selectMode === 'single'
-              ? 'false'
-              : 'true'
-            : null,
-          'aria-busy': this.computedBusy ? 'true' : 'false',
-          'aria-colcount': String(fields.length),
-          'aria-describedby':
-            [
-              // Preserve user supplied aria-describedby, if provided in $attrs
-              (this.$attrs || {})['aria-describedby'],
-              this.captionId
-            ]
-              .filter(a => a)
-              .join(' ') || null
-        }
+        attrs: this.tableAttrs,
       },
       [$caption, $colgroup, $thead, $tfoot, $tbody]
     )

From c8b1d3652e1b8f70bd54c3d9f3ff57aa431c3910 Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 21:38:13 -0300
Subject: [PATCH 11/24] Update mixin-selectable.js

---
 src/components/table/helpers/mixin-selectable.js | 15 +--------------
 1 file changed, 1 insertion(+), 14 deletions(-)

diff --git a/src/components/table/helpers/mixin-selectable.js b/src/components/table/helpers/mixin-selectable.js
index a3a1e19550f..5bac661fb38 100644
--- a/src/components/table/helpers/mixin-selectable.js
+++ b/src/components/table/helpers/mixin-selectable.js
@@ -33,7 +33,7 @@ export default {
         'b-table-selecting': isSelecting
       }
     },
-    selectableTableAttributes() {
+    selectableTableAttrs() {
       return {
         'aria-multiselectable': this.selectableIsMultiSelect
       }
@@ -95,19 +95,6 @@ export default {
     isRowSelected(idx) {
       return Boolean(this.selectedRows[idx])
     },
-    rowSelectedClasses(idx) {
-      if (this.selectable) {
-        const rowSelected = this.isRowSelected(idx)
-        const base = this.dark ? 'bg' : 'table'
-        const variant = this.selectedVariant
-        return {
-          'b-row-selected': rowSelected,
-          [`${base}-${variant}`]: rowSelected && variant
-        }
-      } else {
-        return {}
-      }
-    },
     selectableRowClasses(idx) {
       const rowSelected = this.isRowSelected(idx)
       const base = this.dark ? 'bg' : 'table'

From c1c0746c3ebf7515d2a36ee75cc250b47c6be4a8 Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 21:42:04 -0300
Subject: [PATCH 12/24] Update mixin-tbody-row.js

---
 src/components/table/helpers/mixin-tbody-row.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/table/helpers/mixin-tbody-row.js b/src/components/table/helpers/mixin-tbody-row.js
index a53a4e4519e..4c295fbfa75 100644
--- a/src/components/table/helpers/mixin-tbody-row.js
+++ b/src/components/table/helpers/mixin-tbody-row.js
@@ -244,7 +244,7 @@ export default {
             key: `__b-table-row-${rowKey}__`,
             class: [
               this.rowClasses(item),
-              this.rowSelectedClasses(rowIndex),
+              this.selectableRowClasses(rowIndex),
               {
                 'b-table-has-details': rowShowDetails
               }
@@ -256,8 +256,8 @@ export default {
               'aria-describedby': detailsId,
               'aria-owns': detailsId,
               'aria-rowindex': ariaRowIndex,
-              'aria-selected': this.selectable ? (rowSelected ? 'true' : 'false') : null,
-              role: 'row'
+              role: 'row',
+              ...this.selectableRowAttrs(rowIndex)
             },
             on: {
               // TODO: only instatiate handlers if we have registered listeners (except row-clicked)

From d855ae8011426265a24c8b61655d136d1de1c906 Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 21:44:00 -0300
Subject: [PATCH 13/24] Update mixin-selectable.js

---
 src/components/table/helpers/mixin-selectable.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/table/helpers/mixin-selectable.js b/src/components/table/helpers/mixin-selectable.js
index 5bac661fb38..0611cace17f 100644
--- a/src/components/table/helpers/mixin-selectable.js
+++ b/src/components/table/helpers/mixin-selectable.js
@@ -104,7 +104,7 @@ export default {
         [`${base}-${variant}`]: this.selectable && rowSelected && variant
       }
     },
-    selectableRowAttributes(idx) {
+    selectableRowAttrs(idx) {
       return {
         'aria-selected' = !this.selectable ? null : this.isRowSelected(idx) ? 'true' : 'false'
       }

From fe2abb8f8dd2c75eebf174d070d12b922c40175a Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 21:45:06 -0300
Subject: [PATCH 14/24] Update mixin-selectable.js

---
 src/components/table/helpers/mixin-selectable.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/table/helpers/mixin-selectable.js b/src/components/table/helpers/mixin-selectable.js
index 0611cace17f..2eaba14ee03 100644
--- a/src/components/table/helpers/mixin-selectable.js
+++ b/src/components/table/helpers/mixin-selectable.js
@@ -106,7 +106,7 @@ export default {
     },
     selectableRowAttrs(idx) {
       return {
-        'aria-selected' = !this.selectable ? null : this.isRowSelected(idx) ? 'true' : 'false'
+        'aria-selected': !this.selectable ? null : this.isRowSelected(idx) ? 'true' : 'false'
       }
     },
     clearSelected() {

From 389d6f91670dfde98962893f3fff1403d8bccfbf Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 21:46:06 -0300
Subject: [PATCH 15/24] Update mixin-tbody-row.js

---
 src/components/table/helpers/mixin-tbody-row.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/table/helpers/mixin-tbody-row.js b/src/components/table/helpers/mixin-tbody-row.js
index 4c295fbfa75..17b61256ffc 100644
--- a/src/components/table/helpers/mixin-tbody-row.js
+++ b/src/components/table/helpers/mixin-tbody-row.js
@@ -195,7 +195,6 @@ export default {
       const hasRowClickHandler = this.$listeners['row-clicked'] || this.selectable
       const $detailsSlot = $scoped['row-details']
       const rowShowDetails = Boolean(item._showDetails && $detailsSlot)
-      const rowSelected = this.isRowSelected(rowIndex) /* from selctable mixin */
 
       // We can return more than one TR if rowDetails enabled
       const $rows = []

From 373b6b5dfbc3f6c586436c416125006040cbe729 Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 21:49:16 -0300
Subject: [PATCH 16/24] Update table.js

---
 src/components/table/table.js | 11 +++--------
 1 file changed, 3 insertions(+), 8 deletions(-)

diff --git a/src/components/table/table.js b/src/components/table/table.js
index ddd4f3c980b..c3398bcfdcc 100644
--- a/src/components/table/table.js
+++ b/src/components/table/table.js
@@ -207,21 +207,19 @@ export default {
     tableAttrs() {
       // Preserve user supplied aria-describedby, if provided in $attrs
       const adb =
-        [(this.$attrs || {})['aria-describedby'], this.captionId]
-          .filter(Boolean)
-          .join(' ') || null
+        [(this.$attrs || {})['aria-describedby'], this.captionId].filter(Boolean).join(' ') || null
 
       return {
         // We set aria-rowcount before merging in $attrs, in case user has supplied their own
         'aria-rowcount':
-          this.filteredItems.length > items.length ? String(this.filteredItems.length) : null,
+          this.filteredItems.length > this.items.length ? String(this.filteredItems.length) : null,
         // Merge in user supplied $attrs if any
         ...this.$attrs,
         // Now we can override any $attrs here
         id: this.safeId(),
         role: this.isStacked ? 'table' : null,
         'aria-busy': this.computedBusy ? 'true' : 'false',
-        'aria-colcount': String(fields.length),
+        'aria-colcount': String(this.fields.length),
         'aria-describedby': adb,
         ...this.selectableTableAttrs
       }
@@ -502,9 +500,6 @@ export default {
     }
   },
   render(h) {
-    const fields = this.computedFields
-    const items = this.computedItems
-
     // Build the caption (from caption mixin)
     const $caption = this.renderCaption()
 

From b84328453a1dd14fd40a34ad83c508df1dc284ad Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 21:51:01 -0300
Subject: [PATCH 17/24] Update table.js

---
 src/components/table/table.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/table/table.js b/src/components/table/table.js
index c3398bcfdcc..4a20185b9b2 100644
--- a/src/components/table/table.js
+++ b/src/components/table/table.js
@@ -522,7 +522,7 @@ export default {
         key: 'b-table',
         staticClass: 'table b-table',
         class: this.tableClasses,
-        attrs: this.tableAttrs,
+        attrs: this.tableAttrs
       },
       [$caption, $colgroup, $thead, $tfoot, $tbody]
     )

From 532fd2d01580c272f77a2883628025627d0c7863 Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 22:39:35 -0300
Subject: [PATCH 18/24] Update table-selectable.spec.js

---
 src/components/table/table-selectable.spec.js | 109 ++++++++++++++----
 1 file changed, 87 insertions(+), 22 deletions(-)

diff --git a/src/components/table/table-selectable.spec.js b/src/components/table/table-selectable.spec.js
index 05bd8f0b64b..dec5f366d6f 100644
--- a/src/components/table/table-selectable.spec.js
+++ b/src/components/table/table-selectable.spec.js
@@ -28,8 +28,12 @@ describe('table row select', () => {
     })
     expect(wrapper).toBeDefined()
     await wrapper.vm.$nextTick()
+    expect(wrapper.atributes('aria-multiselectable')).not.toBeDefined()
     expect(wrapper.classes()).not.toContain('b-table-selectable')
-    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
+    expect(wrapper.classes()).not.toContain('b-table-selecting')
+    expect(wrapper.classes()).not.toContain('b-table-select-single')
+    expect(wrapper.classes()).not.toContain('b-table-select-multi')
+    expect(wrapper.classes()).not.toContain('b-table-select-range')
     const $rows = wrapper.findAll('tbody > tr')
     expect($rows.length).toBe(4)
     // Doesn't have aria-selected attribute on all TRs
@@ -52,8 +56,12 @@ describe('table row select', () => {
     })
     expect(wrapper).toBeDefined()
     await wrapper.vm.$nextTick()
+    expect(wrapper.atributes('aria-multiselectable')).not.toBeDefined()
     expect(wrapper.classes()).not.toContain('b-table-selectable')
-    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
+    expect(wrapper.classes()).not.toContain('b-table-selecting')
+    expect(wrapper.classes()).not.toContain('b-table-select-single')
+    expect(wrapper.classes()).not.toContain('b-table-select-multi')
+    expect(wrapper.classes()).not.toContain('b-table-select-range')
     const $rows = wrapper.findAll('tbody > tr')
     expect($rows.length).toBe(4)
     // Doesn't have aria-selected attribute on all TRs
@@ -77,8 +85,12 @@ describe('table row select', () => {
 
     expect(wrapper).toBeDefined()
     await wrapper.vm.$nextTick()
+    expect(wrapper.atributes('aria-multiselectable')).toBe('false')
     expect(wrapper.classes()).toContain('b-table-selectable')
-    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
+    expect(wrapper.classes()).toContain('b-table-select-single')
+    expect(wrapper.classes()).not.toContain('b-table-selecting')
+    expect(wrapper.classes()).not.toContain('b-table-select-multi')
+    expect(wrapper.classes()).not.toContain('b-table-select-range')
     expect(wrapper.emitted('row-selected')).not.toBeDefined()
     $rows = wrapper.findAll('tbody > tr')
     expect($rows.length).toBe(4)
@@ -101,9 +113,12 @@ describe('table row select', () => {
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
     expect(wrapper.classes()).toContain('b-table-selectable')
-    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
+    expect(wrapper.classes()).toContain('b-table-select-single')
+    expect(wrapper.classes()).toContain('b-table-selecting')
+    expect(wrapper.classes()).not.toContain('b-table-select-multi')
+    expect(wrapper.classes()).not.toContain('b-table-select-range')
 
-    // Click third row
+    // Click third row to select it
     wrapper
       .findAll('tbody > tr')
       .at(2)
@@ -118,9 +133,12 @@ describe('table row select', () => {
     expect($rows.at(2).is('[aria-selected="true"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
     expect(wrapper.classes()).toContain('b-table-selectable')
-    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
+    expect(wrapper.classes()).toContain('b-table-select-single')
+    expect(wrapper.classes()).toContain('b-table-selecting')
+    expect(wrapper.classes()).not.toContain('b-table-select-multi')
+    expect(wrapper.classes()).not.toContain('b-table-select-range')
 
-    // Click third row again
+    // Click third row again to clear selection
     wrapper
       .findAll('tbody > tr')
       .at(2)
@@ -135,7 +153,10 @@ describe('table row select', () => {
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
     expect(wrapper.classes()).toContain('b-table-selectable')
-    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
+    expect(wrapper.classes()).toContain('b-table-select-single')
+    expect(wrapper.classes()).not.toContain('b-table-selecting')
+    expect(wrapper.classes()).not.toContain('b-table-select-multi')
+    expect(wrapper.classes()).not.toContain('b-table-select-range')
 
     wrapper.destroy()
   })
@@ -152,8 +173,12 @@ describe('table row select', () => {
     let $rows
     expect(wrapper).toBeDefined()
     await wrapper.vm.$nextTick()
+    expect(wrapper.atributes('aria-multiselectable')).toBe('true')
     expect(wrapper.classes()).toContain('b-table-selectable')
-    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
+    expect(wrapper.classes()).toContain('b-table-select-multi')
+    expect(wrapper.classes()).not.toContain('b-table-select-single')
+    expect(wrapper.classes()).not.toContain('b-table-select-range')
+    expect(wrapper.classes()).not.toContain('b-table-selecting')
     expect(wrapper.emitted('row-selected')).not.toBeDefined()
 
     // Click first row
@@ -172,7 +197,10 @@ describe('table row select', () => {
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
     expect(wrapper.classes()).toContain('b-table-selectable')
-    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
+    expect(wrapper.classes()).toContain('b-table-selecting')
+    expect(wrapper.classes()).toContain('b-table-select-multi')
+    expect(wrapper.classes()).not.toContain('b-table-select-single')
+    expect(wrapper.classes()).not.toContain('b-table-select-range')
 
     // Click third row
     wrapper
@@ -189,7 +217,10 @@ describe('table row select', () => {
     expect($rows.at(2).is('[aria-selected="true"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
     expect(wrapper.classes()).toContain('b-table-selectable')
-    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
+    expect(wrapper.classes()).toContain('b-table-selecting')
+    expect(wrapper.classes()).toContain('b-table-select-multi')
+    expect(wrapper.classes()).not.toContain('b-table-select-single')
+    expect(wrapper.classes()).not.toContain('b-table-select-range')
 
     // Click third row again
     wrapper
@@ -206,7 +237,10 @@ describe('table row select', () => {
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
     expect(wrapper.classes()).toContain('b-table-selectable')
-    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
+    expect(wrapper.classes()).toContain('b-table-selecting')
+    expect(wrapper.classes()).toContain('b-table-select-multi')
+    expect(wrapper.classes()).not.toContain('b-table-select-single')
+    expect(wrapper.classes()).not.toContain('b-table-select-range')
 
     // Click first row again
     wrapper
@@ -223,7 +257,10 @@ describe('table row select', () => {
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
     expect(wrapper.classes()).toContain('b-table-selectable')
-    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
+    expect(wrapper.classes()).toContain('b-table-select-multi')
+    expect(wrapper.classes()).not.toContain('b-table-selecting')
+    expect(wrapper.classes()).not.toContain('b-table-select-single')
+    expect(wrapper.classes()).not.toContain('b-table-select-range')
 
     wrapper.destroy()
   })
@@ -240,8 +277,12 @@ describe('table row select', () => {
     let $rows
     expect(wrapper).toBeDefined()
     await wrapper.vm.$nextTick()
+    expect(wrapper.atributes('aria-multiselectable')).toBe('true')
     expect(wrapper.classes()).toContain('b-table-selectable')
-    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
+    expect(wrapper.classes()).toContain('b-table-select-range')
+    expect(wrapper.classes()).not.toContain('b-table-selecting')
+    expect(wrapper.classes()).not.toContain('b-table-select-single')
+    expect(wrapper.classes()).not.toContain('b-table-select-multi')
     expect(wrapper.emitted('row-selected')).not.toBeDefined()
     $rows = wrapper.findAll('tbody > tr')
     expect($rows.is('[tabindex="0"]')).toBe(true)
@@ -263,7 +304,10 @@ describe('table row select', () => {
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
     expect(wrapper.classes()).toContain('b-table-selectable')
-    expect(wrapper.classes()).toContain('b-table-selecting-range')
+    expect(wrapper.classes()).toContain('b-table-select-range')
+    expect(wrapper.classes()).toContain('b-table-selecting')
+    expect(wrapper.classes()).not.toContain('b-table-select-single')
+    expect(wrapper.classes()).not.toContain('b-table-select-multi')
 
     // Shift-Click third row
     wrapper
@@ -284,7 +328,10 @@ describe('table row select', () => {
     expect($rows.at(2).is('[aria-selected="true"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
     expect(wrapper.classes()).toContain('b-table-selectable')
-    expect(wrapper.classes()).toContain('b-table-selecting-range')
+    expect(wrapper.classes()).toContain('b-table-select-range')
+    expect(wrapper.classes()).toContain('b-table-selecting')
+    expect(wrapper.classes()).not.toContain('b-table-select-single')
+    expect(wrapper.classes()).not.toContain('b-table-select-multi')
 
     // Click third row again
     wrapper
@@ -301,7 +348,10 @@ describe('table row select', () => {
     expect($rows.at(2).is('[aria-selected="true"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
     expect(wrapper.classes()).toContain('b-table-selectable')
-    expect(wrapper.classes()).toContain('b-table-selecting-range')
+    expect(wrapper.classes()).toContain('b-table-select-range')
+    expect(wrapper.classes()).toContain('b-table-selecting')
+    expect(wrapper.classes()).not.toContain('b-table-select-single')
+    expect(wrapper.classes()).not.toContain('b-table-select-multi')
 
     // Click fourth row
     wrapper
@@ -318,7 +368,10 @@ describe('table row select', () => {
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="true"]')).toBe(true)
     expect(wrapper.classes()).toContain('b-table-selectable')
-    expect(wrapper.classes()).toContain('b-table-selecting-range')
+    expect(wrapper.classes()).toContain('b-table-select-range')
+    expect(wrapper.classes()).toContain('b-table-selecting')
+    expect(wrapper.classes()).not.toContain('b-table-select-single')
+    expect(wrapper.classes()).not.toContain('b-table-select-multi')
 
     // Click fourth row again
     wrapper
@@ -335,7 +388,10 @@ describe('table row select', () => {
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="true"]')).toBe(true)
     expect(wrapper.classes()).toContain('b-table-selectable')
-    expect(wrapper.classes()).toContain('b-table-selecting-range')
+    expect(wrapper.classes()).toContain('b-table-select-range')
+    expect(wrapper.classes()).toContain('b-table-selecting')
+    expect(wrapper.classes()).not.toContain('b-table-select-single')
+    expect(wrapper.classes()).not.toContain('b-table-select-multi')
 
     // Ctrl-Click second row
     wrapper
@@ -352,7 +408,10 @@ describe('table row select', () => {
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="true"]')).toBe(true)
     expect(wrapper.classes()).toContain('b-table-selectable')
-    expect(wrapper.classes()).toContain('b-table-selecting-range')
+    expect(wrapper.classes()).toContain('b-table-select-range')
+    expect(wrapper.classes()).toContain('b-table-selecting')
+    expect(wrapper.classes()).not.toContain('b-table-select-single')
+    expect(wrapper.classes()).not.toContain('b-table-select-multi')
 
     // Ctrl-Click second row
     wrapper
@@ -369,7 +428,10 @@ describe('table row select', () => {
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="true"]')).toBe(true)
     expect(wrapper.classes()).toContain('b-table-selectable')
-    expect(wrapper.classes()).toContain('b-table-selecting-range')
+    expect(wrapper.classes()).toContain('b-table-select-range')
+    expect(wrapper.classes()).toContain('b-table-selecting')
+    expect(wrapper.classes()).not.toContain('b-table-select-single')
+    expect(wrapper.classes()).not.toContain('b-table-select-multi')
 
     // Ctrl-Click fourth row
     wrapper
@@ -386,7 +448,10 @@ describe('table row select', () => {
     expect($rows.at(2).is('[aria-selected="false"]')).toBe(true)
     expect($rows.at(3).is('[aria-selected="false"]')).toBe(true)
     expect(wrapper.classes()).toContain('b-table-selectable')
-    expect(wrapper.classes()).not.toContain('b-table-selecting-range')
+    expect(wrapper.classes()).toContain('b-table-select-range')
+    expect(wrapper.classes()).not.toContain('b-table-selecting')
+    expect(wrapper.classes()).not.toContain('b-table-select-single')
+    expect(wrapper.classes()).not.toContain('b-table-select-multi')
 
     wrapper.destroy()
   })

From 9c30635dc8592856b89b16e920fa0c810c616a27 Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 22:41:20 -0300
Subject: [PATCH 19/24] Update _table.scss

---
 src/components/table/_table.scss | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/components/table/_table.scss b/src/components/table/_table.scss
index 4d4ed665b7b..c63c2014801 100644
--- a/src/components/table/_table.scss
+++ b/src/components/table/_table.scss
@@ -164,11 +164,13 @@
     cursor: pointer;
   }
 
-  // Disabled text-selection when in mode range with at
-  // least one row selected
-  &.b-table-selecting-range {
-    & > tbody > tr {
-      user-select: none;
+  &.b-table-selecting {
+    // Disabled text-selection when in mode range with at
+    // least one row selected
+    &.b-table-select-range {
+      & > tbody > tr {
+        user-select: none;
+      }
     }
   }
 }

From 938ec5a7a721c04d04ef8807f41f77432f9906fc Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 22:42:38 -0300
Subject: [PATCH 20/24] Update table-selectable.spec.js

---
 src/components/table/table-selectable.spec.js | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/components/table/table-selectable.spec.js b/src/components/table/table-selectable.spec.js
index dec5f366d6f..b495d528900 100644
--- a/src/components/table/table-selectable.spec.js
+++ b/src/components/table/table-selectable.spec.js
@@ -28,7 +28,7 @@ describe('table row select', () => {
     })
     expect(wrapper).toBeDefined()
     await wrapper.vm.$nextTick()
-    expect(wrapper.atributes('aria-multiselectable')).not.toBeDefined()
+    expect(wrapper.attributes('aria-multiselectable')).not.toBeDefined()
     expect(wrapper.classes()).not.toContain('b-table-selectable')
     expect(wrapper.classes()).not.toContain('b-table-selecting')
     expect(wrapper.classes()).not.toContain('b-table-select-single')
@@ -56,7 +56,7 @@ describe('table row select', () => {
     })
     expect(wrapper).toBeDefined()
     await wrapper.vm.$nextTick()
-    expect(wrapper.atributes('aria-multiselectable')).not.toBeDefined()
+    expect(wrapper.attributes('aria-multiselectable')).not.toBeDefined()
     expect(wrapper.classes()).not.toContain('b-table-selectable')
     expect(wrapper.classes()).not.toContain('b-table-selecting')
     expect(wrapper.classes()).not.toContain('b-table-select-single')
@@ -85,7 +85,7 @@ describe('table row select', () => {
 
     expect(wrapper).toBeDefined()
     await wrapper.vm.$nextTick()
-    expect(wrapper.atributes('aria-multiselectable')).toBe('false')
+    expect(wrapper.attributes('aria-multiselectable')).toBe('false')
     expect(wrapper.classes()).toContain('b-table-selectable')
     expect(wrapper.classes()).toContain('b-table-select-single')
     expect(wrapper.classes()).not.toContain('b-table-selecting')
@@ -173,7 +173,7 @@ describe('table row select', () => {
     let $rows
     expect(wrapper).toBeDefined()
     await wrapper.vm.$nextTick()
-    expect(wrapper.atributes('aria-multiselectable')).toBe('true')
+    expect(wrapper.attributes('aria-multiselectable')).toBe('true')
     expect(wrapper.classes()).toContain('b-table-selectable')
     expect(wrapper.classes()).toContain('b-table-select-multi')
     expect(wrapper.classes()).not.toContain('b-table-select-single')
@@ -277,7 +277,7 @@ describe('table row select', () => {
     let $rows
     expect(wrapper).toBeDefined()
     await wrapper.vm.$nextTick()
-    expect(wrapper.atributes('aria-multiselectable')).toBe('true')
+    expect(wrapper.attributes('aria-multiselectable')).toBe('true')
     expect(wrapper.classes()).toContain('b-table-selectable')
     expect(wrapper.classes()).toContain('b-table-select-range')
     expect(wrapper.classes()).not.toContain('b-table-selecting')

From 755334e40054f99142bd43345d806049187e9461 Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 23:04:57 -0300
Subject: [PATCH 21/24] Update table.js

---
 src/components/table/table.js | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/components/table/table.js b/src/components/table/table.js
index 4a20185b9b2..1678a43955e 100644
--- a/src/components/table/table.js
+++ b/src/components/table/table.js
@@ -208,18 +208,19 @@ export default {
       // Preserve user supplied aria-describedby, if provided in $attrs
       const adb =
         [(this.$attrs || {})['aria-describedby'], this.captionId].filter(Boolean).join(' ') || null
-
+      const items = this.computedItems
+      const fields = this.computedFields
       return {
         // We set aria-rowcount before merging in $attrs, in case user has supplied their own
         'aria-rowcount':
-          this.filteredItems.length > this.items.length ? String(this.filteredItems.length) : null,
+          this.filteredItems.length > items.length ? String(this.filteredItems.length) : null,
         // Merge in user supplied $attrs if any
         ...this.$attrs,
         // Now we can override any $attrs here
         id: this.safeId(),
         role: this.isStacked ? 'table' : null,
         'aria-busy': this.computedBusy ? 'true' : 'false',
-        'aria-colcount': String(this.fields.length),
+        'aria-colcount': String(fields.length),
         'aria-describedby': adb,
         ...this.selectableTableAttrs
       }

From 95230a83b6b2a23ca84f2fc11817837bb7613f59 Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 23:20:57 -0300
Subject: [PATCH 22/24] Update _table.scss

---
 src/components/table/_table.scss | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/src/components/table/_table.scss b/src/components/table/_table.scss
index c63c2014801..42a1f847ad4 100644
--- a/src/components/table/_table.scss
+++ b/src/components/table/_table.scss
@@ -165,10 +165,8 @@
   }
 
   &.b-table-selecting {
-    // Disabled text-selection when in mode range with at
-    // least one row selected
-    &.b-table-select-range {
-      & > tbody > tr {
+    // Disabled text-selection when in mode range when at least one row selected
+    &.b-table-select-range > tbody > tr {
         user-select: none;
       }
     }

From 460ed91babdfb8e46d2d366a7d79e9b0dcd0aae0 Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 23:23:48 -0300
Subject: [PATCH 23/24] Update _table.scss

---
 src/components/table/_table.scss | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/components/table/_table.scss b/src/components/table/_table.scss
index 42a1f847ad4..aa6e24c516d 100644
--- a/src/components/table/_table.scss
+++ b/src/components/table/_table.scss
@@ -167,8 +167,7 @@
   &.b-table-selecting {
     // Disabled text-selection when in mode range when at least one row selected
     &.b-table-select-range > tbody > tr {
-        user-select: none;
-      }
+      user-select: none;
     }
   }
 }

From e5135f95063e0985dfe42a896d8e330dc1681cfc Mon Sep 17 00:00:00 2001
From: Troy Morehouse <troymore@nbnet.nb.ca>
Date: Mon, 18 Mar 2019 23:39:00 -0300
Subject: [PATCH 24/24] Update README.md

---
 src/components/table/README.md | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/src/components/table/README.md b/src/components/table/README.md
index 74aef89bd59..46f71fafcc9 100644
--- a/src/components/table/README.md
+++ b/src/components/table/README.md
@@ -1188,6 +1188,16 @@ as read-only.**
 <!-- b-table-selectable.vue -->
 ```
 
+When table is selectable, it will have class `b-table-selectable`, and one of the following three
+classes (depending on which mode is in use), on the `<table>` element:
+
+- `b-table-select-single`
+- `b-table-select-multi`
+- `b-table-select-range`
+
+When at least one row is selected the class `b-table-selecting` will be active on the `<table>`
+element.
+
 **Notes:**
 
 - _Paging, filtering, or sorting will clear the selection. The `row-selected` event will be emitted