# TableGrid

columnType: 'select' import Cell from "@/components/hash/elements/Cell"; import Column from "@/components/hash/elements/Column"; import numberComp from "@/components/hash/elements/NumberEditor"; import currencyComp from "@/components/hash/elements/CurrencyEditor"; import PhoneComp from "@/components/hash/elements/PhoneNumberEditor"; import singleSelectComp from "@/components/hash/elements/SingleSelectEditor"; import multiSelectComp from "@/components/hash/elements/MultiSelectEditor"; import longTextComp from "@/components/hash/elements/LongTextEditor"; import VINComp from "@/components/hash/elements/VinEditor"; import Toggle2 from "@/components/hash/elements/Toggle2"; const singleSelectEditor = VGridVueEditor( Vue.component("vueEditor", singleSelectComp) ); const multiSelectEditor = VGridVueEditor( Vue.component("vueEditor", multiSelectComp) ); const longTextEditor = VGridVueEditor(Vue.component("vueEditor", longTextComp)); const vinEditor = VGridVueEditor(Vue.component("vueEditor", VINComp)); const numberEditor = VGridVueEditor(Vue.component("vueEditor", numberComp)); const currencyEditor = VGridVueEditor(Vue.component("vueEditor", currencyComp)); const phoneEditor = VGridVueEditor(Vue.component("vueEditor", PhoneComp));

## Props

<!-- @vuese:TableGrid:props:start -->
|Name|Description|Type|Required|Default|
|---|---|---|---|---|
|title|-|`String`|`false`|null|
|theme|-|`String`|`false`|compact|
|readonly|-|`Boolean`|`false`|true|
|columns|-|`Array`|`true`|-|
|rows|-|`Array`|`true`|-|
|range|-|`Boolean`|`false`|true|
|filter|-|`Boolean`|`false`|true|
|dataTypes|-|`Object`|`false`|-|
|cssStyle|-|`String`|`false`|-|
|rowHeaders|-|`Boolean`|`false`|true|
|resize|-|`Boolean`|`false`|true|
|rowClass|-|`String`|`false`|rowClass|
|css|-|`Object`|`false`|-|

<!-- @vuese:TableGrid:props:end -->


## Events

<!-- @vuese:TableGrid:events:start -->
|Event Name|Description|Parameters|
|---|---|---|
|col-resize|-|-|
|row-updated|-|-|

<!-- @vuese:TableGrid:events:end -->


