fix(VDataTable): replace hardcoded icons for presets in grouped rows (v…

…uetifyjs#8285) closes vuetifyjs#8255
bytheway · Aug 12, 2019 · 014910a · 014910a
1 parent 313f634
commit 014910a
Show file tree

Hide file tree

Showing 8 changed files with 34 additions and 20 deletions.
diff --git a/packages/vuetify/src/components/VDataTable/VDataTable.ts b/packages/vuetify/src/components/VDataTable/VDataTable.ts
@@ -316,7 +316,7 @@ export default VDataIterator.extend({
           on: {
             click: () => this.$set(this.openCache, group, !this.openCache[group]),
           },
-        }, [this.$createElement(VIcon, [isOpen ? 'remove' : 'add'])])
+        }, [this.$createElement(VIcon, [isOpen ? '$vuetify.icons.minus' : '$vuetify.icons.plus'])])
 
         const remove = this.$createElement(VBtn, {
           staticClass: 'ma-0',
@@ -327,7 +327,7 @@ export default VDataIterator.extend({
           on: {
             click: () => props.updateOptions({ groupBy: [], groupDesc: [] }),
           },
-        }, [this.$createElement(VIcon, ['close'])])
+        }, [this.$createElement(VIcon, ['$vuetify.icons.close'])])
 
         const column = this.$createElement('td', {
           staticClass: 'text-start',

diff --git a/packages/vuetify/src/components/VDataTable/__tests__/__snapshots__/VDataTable.spec.ts.snap b/packages/vuetify/src/components/VDataTable/__tests__/__snapshots__/VDataTable.spec.ts.snap
@@ -1484,7 +1484,7 @@ exports[`VDataTable.ts should render with group.summary scoped slot 1`] = `
                 <i aria-hidden="true"
                    class="v-icon notranslate material-icons theme--light"
                 >
-                  remove
+                  $vuetify.icons.minus
                 </i>
               </span>
             </button>
@@ -1496,7 +1496,7 @@ exports[`VDataTable.ts should render with group.summary scoped slot 1`] = `
                 <i aria-hidden="true"
                    class="v-icon notranslate material-icons theme--light"
                 >
-                  close
+                  $vuetify.icons.close
                 </i>
               </span>
             </button>
@@ -1535,7 +1535,7 @@ exports[`VDataTable.ts should render with group.summary scoped slot 1`] = `
                 <i aria-hidden="true"
                    class="v-icon notranslate material-icons theme--light"
                 >
-                  remove
+                  $vuetify.icons.minus
                 </i>
               </span>
             </button>
@@ -1547,7 +1547,7 @@ exports[`VDataTable.ts should render with group.summary scoped slot 1`] = `
                 <i aria-hidden="true"
                    class="v-icon notranslate material-icons theme--light"
                 >
-                  close
+                  $vuetify.icons.close
                 </i>
               </span>
             </button>
@@ -1586,7 +1586,7 @@ exports[`VDataTable.ts should render with group.summary scoped slot 1`] = `
                 <i aria-hidden="true"
                    class="v-icon notranslate material-icons theme--light"
                 >
-                  remove
+                  $vuetify.icons.minus
                 </i>
               </span>
             </button>
@@ -1598,7 +1598,7 @@ exports[`VDataTable.ts should render with group.summary scoped slot 1`] = `
                 <i aria-hidden="true"
                    class="v-icon notranslate material-icons theme--light"
                 >
-                  close
+                  $vuetify.icons.close
                 </i>
               </span>
             </button>
@@ -1637,7 +1637,7 @@ exports[`VDataTable.ts should render with group.summary scoped slot 1`] = `
                 <i aria-hidden="true"
                    class="v-icon notranslate material-icons theme--light"
                 >
-                  remove
+                  $vuetify.icons.minus
                 </i>
               </span>
             </button>
@@ -1649,7 +1649,7 @@ exports[`VDataTable.ts should render with group.summary scoped slot 1`] = `
                 <i aria-hidden="true"
                    class="v-icon notranslate material-icons theme--light"
                 >
-                  close
+                  $vuetify.icons.close
                 </i>
               </span>
             </button>
@@ -1688,7 +1688,7 @@ exports[`VDataTable.ts should render with group.summary scoped slot 1`] = `
                 <i aria-hidden="true"
                    class="v-icon notranslate material-icons theme--light"
                 >
-                  remove
+                  $vuetify.icons.minus
                 </i>
               </span>
             </button>
@@ -1700,7 +1700,7 @@ exports[`VDataTable.ts should render with group.summary scoped slot 1`] = `
                 <i aria-hidden="true"
                    class="v-icon notranslate material-icons theme--light"
                 >
-                  close
+                  $vuetify.icons.close
                 </i>
               </span>
             </button>
@@ -1911,7 +1911,7 @@ exports[`VDataTable.ts should render with grouped rows 1`] = `
                 <i aria-hidden="true"
                    class="v-icon notranslate material-icons theme--light"
                 >
-                  remove
+                  $vuetify.icons.minus
                 </i>
               </span>
             </button>
@@ -1923,7 +1923,7 @@ exports[`VDataTable.ts should render with grouped rows 1`] = `
                 <i aria-hidden="true"
                    class="v-icon notranslate material-icons theme--light"
                 >
-                  close
+                  $vuetify.icons.close
                 </i>
               </span>
             </button>
@@ -1974,7 +1974,7 @@ exports[`VDataTable.ts should render with grouped rows 1`] = `
                 <i aria-hidden="true"
                    class="v-icon notranslate material-icons theme--light"
                 >
-                  remove
+                  $vuetify.icons.minus
                 </i>
               </span>
             </button>
@@ -1986,7 +1986,7 @@ exports[`VDataTable.ts should render with grouped rows 1`] = `
                 <i aria-hidden="true"
                    class="v-icon notranslate material-icons theme--light"
                 >
-                  close
+                  $vuetify.icons.close
                 </i>
               </span>
             </button>
@@ -2020,7 +2020,7 @@ exports[`VDataTable.ts should render with grouped rows 1`] = `
                 <i aria-hidden="true"
                    class="v-icon notranslate material-icons theme--light"
                 >
-                  remove
+                  $vuetify.icons.minus
                 </i>
               </span>
             </button>
@@ -2032,7 +2032,7 @@ exports[`VDataTable.ts should render with grouped rows 1`] = `
                 <i aria-hidden="true"
                    class="v-icon notranslate material-icons theme--light"
                 >
-                  close
+                  $vuetify.icons.close
                 </i>
               </span>
             </button>
@@ -2066,7 +2066,7 @@ exports[`VDataTable.ts should render with grouped rows 1`] = `
                 <i aria-hidden="true"
                    class="v-icon notranslate material-icons theme--light"
                 >
-                  remove
+                  $vuetify.icons.minus
                 </i>
               </span>
             </button>
@@ -2078,7 +2078,7 @@ exports[`VDataTable.ts should render with grouped rows 1`] = `
                 <i aria-hidden="true"
                    class="v-icon notranslate material-icons theme--light"
                 >
-                  close
+                  $vuetify.icons.close
                 </i>
               </span>
             </button>

diff --git a/packages/vuetify/src/services/icons/__tests__/__snapshots__/icons.spec.ts.snap b/packages/vuetify/src/services/icons/__tests__/__snapshots__/icons.spec.ts.snap
@@ -21,7 +21,9 @@ Object {
   "last": "mdi-page-last",
   "loading": "mdi-cached",
   "menu": "mdi-menu",
+  "minus": "mdi-minus",
   "next": "mdi-chevron-right",
+  "plus": "mdi-plus",
   "prev": "mdi-chevron-left",
   "radioOff": "mdi-radiobox-blank",
   "radioOn": "mdi-radiobox-marked",
@@ -57,7 +59,9 @@ Object {
   "last": "fa fa-step-forward",
   "loading": "fa fa-refresh",
   "menu": "fa fa-bars",
+  "minus": "fa fa-minus",
   "next": "fa fa-chevron-right",
+  "plus": "fa fa-plus",
   "prev": "fa fa-chevron-left",
   "radioOff": "fa fa-circle-o",
   "radioOn": "fa fa-dot-circle-o",

diff --git a/packages/vuetify/src/services/icons/presets/fa.ts b/packages/vuetify/src/services/icons/presets/fa.ts
@@ -32,6 +32,8 @@ const icons: VuetifyIcons = {
   last: 'fas fa-step-forward',
   unfold: 'fas fa-arrows-alt-v',
   file: 'fas fa-paperclip',
+  plus: 'fas fa-plus',
+  minus: 'fas fa-minus',
 }
 
 export default icons
diff --git a/packages/vuetify/src/services/icons/presets/fa4.ts b/packages/vuetify/src/services/icons/presets/fa4.ts
@@ -32,6 +32,8 @@ const icons: VuetifyIcons = {
   last: 'fa fa-step-forward',
   unfold: 'fa fa-angle-double-down',
   file: 'fa fa-paperclip',
+  plus: 'fa fa-plus',
+  minus: 'fa fa-minus',
 }
 
 export default icons
diff --git a/packages/vuetify/src/services/icons/presets/md.ts b/packages/vuetify/src/services/icons/presets/md.ts
@@ -32,6 +32,8 @@ const icons: VuetifyIcons = {
   last: 'last_page',
   unfold: 'unfold_more',
   file: 'attach_file',
+  plus: 'add',
+  minus: 'remove',
 }
 
 export default icons
diff --git a/packages/vuetify/src/services/icons/presets/mdi-svg.ts b/packages/vuetify/src/services/icons/presets/mdi-svg.ts
@@ -32,6 +32,8 @@ const icons: VuetifyIcons = {
   last: 'M5.59,7.41L10.18,12L5.59,16.59L7,18L13,12L7,6L5.59,7.41M16,6H18V18H16V6Z',
   unfold: 'M12,18.17L8.83,15L7.42,16.41L12,21L16.59,16.41L15.17,15M12,5.83L15.17,9L16.58,7.59L12,3L7.41,7.59L8.83,9L12,5.83Z',
   file: 'M16.5,6V17.5C16.5,19.71 14.71,21.5 12.5,21.5C10.29,21.5 8.5,19.71 8.5,17.5V5C8.5,3.62 9.62,2.5 11,2.5C12.38,2.5 13.5,3.62 13.5,5V15.5C13.5,16.05 13.05,16.5 12.5,16.5C11.95,16.5 11.5,16.05 11.5,15.5V6H10V15.5C10,16.88 11.12,18 12.5,18C13.88,18 15,16.88 15,15.5V5C15,2.79 13.21,1 11,1C8.79,1 7,2.79 7,5V17.5C7,20.54 9.46,23 12.5,23C15.54,23 18,20.54 18,17.5V6H16.5Z',
+  plus: 'M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z',
+  minus: 'M19,13H5V11H19V13Z',
 }
 
 export default icons
diff --git a/packages/vuetify/src/services/icons/presets/mdi.ts b/packages/vuetify/src/services/icons/presets/mdi.ts
@@ -32,6 +32,8 @@ const icons: VuetifyIcons = {
   last: 'mdi-page-last',
   unfold: 'mdi-unfold-more-horizontal',
   file: 'mdi-paperclip',
+  plus: 'mdi-plus',
+  minus: 'mdi-minus',
 }
 
 export default icons