# gd-tag-input



<!-- Auto Generated Below -->


## Properties

| Property       | Attribute       | Description                                                | Type                 | Default     |
| -------------- | --------------- | ---------------------------------------------------------- | -------------------- | ----------- |
| `controlId`    | `control-id`    | The element id                                             | `string`             | `undefined` |
| `defaultValue` | `default-value` | The initial value of the input                             | `string \| string[]` | `undefined` |
| `disabled`     | `disabled`      | Disables the input / select / textarea from edit or copy.  | `boolean`            | `undefined` |
| `htmlSize`     | `html-size`     | Specifies how much of the input is shown.                  | `number`             | `undefined` |
| `name`         | `name`          | The name applied to the input                              | `string`             | `undefined` |
| `placeholder`  | `placeholder`   | The placeholder text for the input                         | `string`             | `undefined` |
| `readOnly`     | `read-only`     | The value of the input is not editable.                    | `boolean`            | `undefined` |
| `required`     | `required`      | Used for making form control required                      | `boolean`            | `false`     |
| `size`         | `size`          | Used to change the size of inputs and labels respectively. | `"lg" \| "sm"`       | `undefined` |
| `variant`      | `variant`       | change the style of the tags                               | `"pills"`            | `undefined` |


## Events

| Event        | Description                               | Type                              |
| ------------ | ----------------------------------------- | --------------------------------- |
| `tagsChange` | The event is emitted when the tags change | `CustomEvent<string \| string[]>` |


## Methods

### `addTags(tags: Tags) => Promise<void>`



#### Returns

Type: `Promise<void>`




## Dependencies

### Used by

 - [gd-user-dashboard](../gd-user-dashboard)
 - [gd-user-dashboard-bulk-tag-dialog](../gd-user-dashboard-bulk-tag-dialog)
 - [gd-user-dashboard-list-item](../gd-user-dashboard-list-item)

### Graph
```mermaid
graph TD;
  gd-user-dashboard --> gd-tag-input
  gd-user-dashboard-bulk-tag-dialog --> gd-tag-input
  gd-user-dashboard-list-item --> gd-tag-input
  style gd-tag-input fill:#f9f,stroke:#333,stroke-width:4px
```

----------------------------------------------

*Built with [StencilJS](https://stenciljs.com/)*
