feat(chips): Synchronise with mdc-web v0.32.0 (add choice and filter)

components/chips/Chip.vue

@@ -37,8 +37,9 @@ export default {
         n.elm.setAttribute('tabindex', '0')
       })
     }
-
-    this.mdcChip = MDCChip.attachTo(this.$el)
+    
+    // this done by MDCChipSet:
+    // this.mdcChip = MDCChip.attachTo(this.$el)
   }
 }
 </script>

components/chips/ChipSet.vue

@@ -1,18 +1,45 @@
 <template>
-  <div class="mdc-chip-set" />
+  <div
+    class="mdc-chip-set" 
+    :class="classes">
+    <slot/>
+  </div>
 </template>
 
 <script>
 import { MDCChipSet } from '@material/chips'
 
 export default {
+  props: {
+    choice: {
+      type: Boolean,
+      default: false
+    },
+    filter: {
+      type: Boolean,
+      default: false
+    }
+  },
   data () {
     return {
       mdcChipSet: null
     }
   },
+  computed: {
+    classes () {
+      return {
+        'mdc-chip-set--choice': this.choice,
+        'mdc-chip-set--filter': this.filter
+      }
+    }
+  },
   mounted () {
     this.mdcChipSet = MDCChipSet.attachTo(this.$el)
+  },
+  methods: {
+    getSelectedChips () {
+      return this.mdcChipSet.foundation_.selectedChips_
+    }
   }
 }
 </script>

components/chips/README.md

@@ -14,6 +14,17 @@
 </m-chip-set>
 ```
 
+### Props & methods
+
+| Prop | Type | Default | Description |
+|------|------|---------|-------------|
+| choice | Boolean | false | single selection chips in set |
+| filter | Boolean | false | multiple selection chips in set |
+
+| Method | Description |
+|--------|-------------|
+| getSelectedChips | returns all selected chips of the set as array |
+
 ## Chip
 
 ### Slots