support multiselect fields

src/types/data.ts

@@ -7,6 +7,7 @@ export const FieldTypes = [
   'image',
   'number',
   'dropdown',
+  'multiselect',
   'toggle',
 ] as const
 

src/views/Editor/DataEditor.vue

@@ -4,9 +4,11 @@ import { v7 as uuidv7 } from 'uuid'
 import Button from 'primevue/button'
 import Checkbox from 'primevue/checkbox'
 import Column from 'primevue/column'
+import Chip from 'primevue/chip'
 import DataTable from 'primevue/datatable'
 import Image from 'primevue/image'
 import InputText  from 'primevue/inputtext'
+import MultiSelect from 'primevue/multiselect'
 import Select from 'primevue/select'
 
 import {
@@ -142,14 +144,27 @@ DataTable.data-editor(
           disabled
         )
       div(
+        v-else-if='col.type === "multiselect"'
+      )
+        span.empty(
+          v-if='!slotProps.data[col.name] || (Array.isArray(slotProps.data[col.name]) && slotProps.data[col.name].length === 0)'
+        ) not set
+        .chips(
           v-else
         )
-        span(
+          Chip(
-          v-if='slotProps.data[col.name]'
+            v-for='chip in slotProps.data[col.name]'
-        ) {{ slotProps.data[col.name] }}
+            :label='chip'
-        span.empty(
+          )
+      div(
         v-else
+      )
+        span.empty(
+          v-if='!slotProps.data[col.name]'
         ) not set
+        span(
+          v-else
+        ) {{ slotProps.data[col.name] }}
     template(
       #editor='slotProps'
     )
@@ -185,6 +200,18 @@ DataTable.data-editor(
           showClear
           fluid
         )
+      div(
+        v-else-if='col.type === "multiselect"'
+      )
+        MultiSelect(
+          v-model='slotProps.data[slotProps.field]'
+          :options='col.options'
+          placeholder='Select from Options'
+          filter
+          showClear
+          fluid
+          display='chip'
+        )
       div(
         v-else
       )

src/views/Editor/FieldEditor.vue

@@ -167,7 +167,7 @@ DataTable.field-editor(
     #expansion='slotProps'
   )
     div(
-      v-if='slotProps.data.type === "dropdown"'
+      v-if='slotProps.data.type === "dropdown" || slotProps.data.type === "multiselect"'
     )
       InputChips(
         v-model='slotProps.data.options'