# @tkweb/ui-table
> ## Project setup ``` npm install ```
Latest version **0.0.2** (published 2021-11-19) · MIT license · 0 weekly downloads
## Install
```sh
npm install @tkweb/ui-table
pnpm add @tkweb/ui-table
yarn add @tkweb/ui-table
bun add @tkweb/ui-table
```
## Health
**Score 20/100 (F)** — status: abandoned.
Positive: esm support; no vulnerabilities.
Warnings: low downloads; no types; pre 1.0.
Negative: abandoned; low maintenance score.
## Facts
| | |
|---|---|
| Version | 0.0.2 |
| Published | 2021-11-19 |
| First published | 2021-11-19 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 12 |
| Unpacked size | 6.4 MB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| Author | Karthick Thangaraju |
| Maintainers | karthickt13 |
| Keywords | elements, tabel, h8 |
## Links
- npm: https://www.npmjs.com/package/@tkweb/ui-table
- Repository: https://github.com/karthick-thangaraju/ui-table
- Homepage: https://github.com/karthick-thangaraju/ui-table#readme
- Issues: https://github.com/karthick-thangaraju/ui-table/issues
- npm.io page: https://npm.io/package/@tkweb/ui-table
## Dependencies (12)
- [vue](https://npm.io/package/vue.md) ^2.6.11
- [vuex](https://npm.io/package/vuex.md) ^3.4.0
- [lodash](https://npm.io/package/lodash.md) ^4.17.21
- [core-js](https://npm.io/package/core-js.md) ^3.6.5
- [@vuedoc/md](https://npm.io/package/@vuedoc/md.md) ^3.2.0
- [vue-router](https://npm.io/package/vue-router.md) ^3.2.0
- [@vuedoc/parser](https://npm.io/package/@vuedoc/parser.md) ^3.4.0
- [@tkweb/elements](https://npm.io/package/@tkweb/elements.md) *
- [vue-currency-input](https://npm.io/package/vue-currency-input.md) ^2.1.0
- [@revolist/vue-datagrid](https://npm.io/package/@revolist/vue-datagrid.md) ^3.0.97
- [@revolist/revogrid-column-date](https://npm.io/package/@revolist/revogrid-column-date.md) ^1.1.0
- [@revolist/revogrid-column-numeral](https://npm.io/package/@revolist/revogrid-column-numeral.md) ^1.0.2
## Recent versions
- 0.0.2 (latest) — 2021-11-19
## README
# VinEditor
const numberEditor = VGridVueEditor(Vue.component("vueEditor", numberComp));
## Props
| Name | Type | Description | Default |
| -------------------- | --------- | ----------- | ----------------------------------------- |
| `row-index` | `Number` | | |
| `prop` | `String` | | |
| `model` | `Object` | | |
| `column` | `Object` | | |
| `data` | `Array` | | |
| `inner-class` | `String` | | |
| `prop` | `unknown` | | |
| `model` | `unknown` | | |
| `column` | `unknown` | | |
| `row-index` | `unknown` | | |
| `data` | `unknown` | | |
| `row-index` | `unknown` | | |
| `prop` | `unknown` | | |
| `column` | `unknown` | | |
| `model` | `unknown` | | |
| `close` | `unknown` | | |
| `save` | `unknown` | | |
| `columns` | `Array` | | `function() { return []; }` |
| `rows` | `Array` | | `function() { return []; }` |
| `row-index` | `unknown` | | |
| `prop` | `unknown` | | |
| `column` | `unknown` | | |
| `model` | `unknown` | | |
| `close` | `unknown` | | |
| `save` | `unknown` | | |
| `title` | `String` | | `null` |
| `theme` | `String` | | `"compact"` |
| `readonly` | `Boolean` | | `true` |
| `columns` *required* | `Array` | | |
| `rows` *required* | `Array` | | |
| `range` | `Boolean` | | `true` |
| `filter` | `Boolean` | | `true` |
| `data-types` | `Object` | | |
| `css-style` | `String` | | |
| `row-headers` | `Boolean` | | `true` |
| `resize` | `Boolean` | | `true` |
| `row-class` | `String` | | `"rowClass"` |
| `css` | `Object` | | |
| `row-index` | `unknown` | | |
| `prop` | `unknown` | | |
| `column` | `unknown` | | |
| `model` | `unknown` | | |
| `close` | `unknown` | | |
| `save` | `unknown` | | |
## Data
| Name | Type | Description | Initial value |
| ------------- | --------- | ----------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| `columnTypes` | `object` | | `{}` |
| `hexTokens` | `object` | | `{"F":{"type":"object","value":{"pattern":{"type":"regexp","value":"/[0-9a-fA-F]/","raw":"/[0-9a-fA-F]/","member":false},"transform":{"type":"ArrowFunctionExpression","value":"(v) => v.toLocaleUpperCase()","raw":"(v) => v.toLocaleUpperCase()","member":false}},"raw":"{\"pattern\":{\"type\":\"regexp\",\"value\":\"/[0-9a-fA-F]/\",\"raw\":\"/[0-9a-fA-F]/\",\"member\":false},\"transform\":{\"type\":\"ArrowFunctionExpression\",\"value\":\"(v) => v.toLocaleUpperCase()\",\"raw\":\"(v) => v.toLocaleUpperCase()\",\"member\":false}}","member":false}}` |
| `gridEditors` | `object` | | `{"vin":{"type":"unknown","value":"VGridVueEditor(Vue.component(\"vueEditor\", VINComp))","raw":"VGridVueEditor(Vue.component(\"vueEditor\", VINComp))","member":false}}` |
| `columnTypes` | `object` | | `{"number":{"type":"NumberColumnType","value":"new NumberColumnType(\"0,0\")","raw":"new NumberColumnType(\"0,0\")","member":false},"currency":{"type":"NumberColumnType","value":"new NumberColumnType(\"$0,0.00\")","raw":"new NumberColumnType(\"$0,0.00\")","member":false},"date":{"type":"VGridDate","value":"new VGridDate()","raw":"new VGridDate()","member":false}}` |
| `valid` | `boolean` | | `true` |
## Computed Properties
| Name | Type | Description |
| ----------------- | --------- | -------------------------------------------- |
| `computedColumns` | `unknown` | **Dependencies:** `columns`, `getColumnIcon` |
| `vinValue` | `object` | **Dependencies:** `model`, `prop` |
| `isValid` | `boolean` | **Dependencies:** `valid` |
## Events
| Name | Description |
| ------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `col-resize` |
**Arguments**
- **`{ type: "aftercolumnresize", id: e.detail[Object.getOwnPropertyNames(e.detail)[0]].id, field: e.detail, width: e.detail[Object.getOwnPropertyNames(e.detail)[0]].size, }: object`**
|
## Methods
### updateText()
**Syntax**
```typescript
updateText(): void
```
### updateText()
**Syntax**
```typescript
updateText(): void
```
### aftercolumnresize()
**Syntax**
```typescript
aftercolumnresize(e: unknown): void
```
### headerclick()
**Syntax**
```typescript
headerclick(): void
```
### eventHandler()
**Syntax**
```typescript
eventHandler(e: unknown): void
```
### getColumnIcon()
**Syntax**
```typescript
getColumnIcon(column: unknown): unknown
```
### focusInput()
**Syntax**
```typescript
focusInput(): void
```
### validateVin()
**Syntax**
```typescript
validateVin(event: unknown): unknown
```
### updateVIN()
**Syntax**
```typescript
updateVIN(event: unknown): void
```
### closeEditor()
**Syntax**
```typescript
closeEditor(event: unknown): void
```
---
_Source: https://npm.io/package/@tkweb/ui-table · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._