# ez-guide-navigator



<!-- Auto Generated Below -->


## Properties

| Property          | Attribute     | Description                                                             | Type                                                            | Default     |
| ----------------- | ------------- | ----------------------------------------------------------------------- | --------------------------------------------------------------- | ----------- |
| `items`           | --            | Lista de itens do menu de navegação.                                    | `IGuideItem[]`                                                  | `[]`        |
| `open`            | `open`        | Define se o menu de navegação está aberto.                              | `boolean`                                                       | `true`      |
| `selectedId`      | `selected-id` | Define o id do item selecionado.                                        | `string`                                                        | `undefined` |
| `tooltipResolver` | --            | Define uma função que vai resolver o `tooltip` ou `title` daquele item. | `(item: IGuideItem, enabled: boolean, level: number) => string` | `undefined` |


## Events

| Event               | Description                                                       | Type                      |
| ------------------- | ----------------------------------------------------------------- | ------------------------- |
| `ezSelectionChange` | Evento emitido quando o item selecionado no navigator é alterado. | `CustomEvent<IGuideItem>` |


## Methods

### `disableItem(id: string | Array<string>) => Promise<void>`

Desabilita um ou mais itens.

#### Returns

Type: `Promise<void>`

---

### `enableItem(id: string | Array<string>) => Promise<void>`

Habilita um ou mais itens.

#### Returns

Type: `Promise<void>`

---

### `getCurrentPath() => Promise<Array<IGuideItem>>`

Obtem um array do caminho de itens da seleção atual.

#### Returns

Type: `Promise<IGuideItem[]>`

Retorna um array do caminho de itens da seleção atual.

---

### `getItem(id: string) => Promise<IGuideItem>`

Obtem um item pelo id

#### Returns

Type: `Promise<IGuideItem>`

---

### `getParent(id: string) => Promise<IGuideItem>`

Obtem o item pai a partir de um id

#### Returns

Type: `Promise<IGuideItem>`

---

### `openGuideNavidator() => Promise<void>`

Abre o navegador de Guia

#### Returns

Type: `Promise<void>`

---

### `selectGuide(id: string) => Promise<void>`

Seleciona o item desejado pelo ID.

#### Returns

Type: `Promise<void>`

---

### `updateItem(item: IGuideItem | Array<IGuideItem>) => Promise<void>`

Atualiza um ou mais items

#### Returns

Type: `Promise<void>`




## Dependencies

### Depends on

- [ez-sidebar-button](../ez-sidebar-button)
- [ez-filter-input](../ez-filter-input)
- [ez-button](../ez-button)
- [ez-scroller](../ez-scroller)
- [ez-tree](../ez-tree)

### Graph
```mermaid
graph TD;
  ez-guide-navigator --> ez-sidebar-button
  ez-guide-navigator --> ez-filter-input
  ez-guide-navigator --> ez-button
  ez-guide-navigator --> ez-scroller
  ez-guide-navigator --> ez-tree
  ez-sidebar-button --> ez-icon
  ez-filter-input --> ez-text-input
  ez-filter-input --> ez-icon
  ez-text-input --> ez-tooltip
  ez-text-input --> ez-icon
  ez-button --> ez-icon
  ez-tree --> ez-icon
  style ez-guide-navigator fill:#f9f,stroke:#333,stroke-width:4px
```

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




## CSS Variables
| Variable  | Description | 
 |-|-|
| --ez-guide-navigator--padding-left | Define o espaçamento da esquerda do container | 
| --ez-guide-navigator--padding-right | Define o espaçamento da direita do container | 
| --ez-guide-navigator--box-shadow | Define a cor de shadow box do container de label | 
| --ez-guide-navigator--background-color | Define a cor de fundo do container de label | 
| --ez-guide-navigator--border-radius | Define o border radius do container de label | 
| --ez-guide-navigator--actions-gap | Define o espaçamento entre as ações | 
| --ez-guide-navigator--actions-margin | Define a margem vertical do elemento | 
| --ez-guide-navigator--actions-padding-right | Define o espaçamento da direita do elemento |