svelte-kit-vice/DATA_ATTRS.md

# Terra Data Attributes Contracts

> Contrato formal de atributos `data-*` entre Terra y Air.
> Generado automáticamente desde `src/uix/terra/utils/contracts.ts`.
>
> ⚠️ **Estos attrs son API PÚBLICA.** Cambiarlos es un breaking change.

---

## Índice

- [Switch](#switch)
- [Checkbox](#checkbox)
- [RadioGroup](#radio-group)
- [Toggle](#toggle)
- [ToggleGroup](#toggle-group)
- [Slider](#slider)
- [Accordion](#accordion)
- [Collapsible](#collapsible)
- [Dialog](#dialog)
- [AlertDialog](#alert-dialog)
- [Drawer](#drawer)
- [Popover](#popover)
- [Form](#form)
- [Tooltip](#tooltip)
- [DropdownMenu](#dropdown-menu)
- [ContextMenu](#context-menu)
- [Menubar](#menubar)
- [Field](#field)
- [NumberField](#number-field)
- [TagsInput](#tags-input)
- [VirtualList](#virtual-list)
- [Select](#select)
- [Combobox](#combobox)
- [Stepper](#stepper)
- [Editable](#editable)
- [Command](#command)
- [Tabs](#tabs)
- [Calendar](#calendar)
- [DatePicker](#date-picker)
- [DateField](#date-field)
- [TimeField](#time-field)
- [DateRangeField](#date-range-field)
- [TimeRangeField](#time-range-field)
- [PinInput](#pin-input)
- [LinkPreview](#link-preview)
- [Progress](#progress)
- [Meter](#meter)
- [Spinner](#spinner)
- [Avatar](#avatar)
- [Label](#label)
- [Separator](#separator)
- [AspectRatio](#aspect-ratio)
- [Toolbar](#toolbar)
- [Splitter](#splitter)
- [ScrollArea](#scroll-area)
- [Pagination](#pagination)
- [RatingGroup](#rating-group)
- [ColorPicker](#color-picker)
- [Toast](#toast)
- [FileUpload](#file-upload)

---

## Switch

**Versión del contrato:** 1

### Root

| Attr            | Valores                  | Descripción                            |
| --------------- | ------------------------ | -------------------------------------- |
| `data-switch`   | (flag)                   | Siempre presente en el root del Switch |
| `data-state`    | `checked` \| `unchecked` | Estado del switch: checked o unchecked |
| `data-disabled` | (flag)                   | Presente cuando disabled=true          |
| `data-required` | (flag)                   | Presente cuando required=true          |

### Thumb

| Attr                | Valores                  | Descripción                           |
| ------------------- | ------------------------ | ------------------------------------- |
| `data-switch-thumb` | (flag)                   | Siempre presente en el elemento thumb |
| `data-state`        | `checked` \| `unchecked` | Hereda estado del root                |
| `data-disabled`     | (flag)                   | Hereda disabled del root              |
| `data-required`     | (flag)                   | Hereda required del root              |

---

## Checkbox

**Versión del contrato:** 1

### Root

| Attr            | Valores                                     | Descripción                                |
| --------------- | ------------------------------------------- | ------------------------------------------ |
| `data-checkbox` | (flag)                                      | Siempre presente en el root del Checkbox   |
| `data-state`    | `checked` \| `unchecked` \| `indeterminate` | Estado: checked, unchecked o indeterminate |
| `data-disabled` | (flag)                                      | Presente cuando disabled=true              |
| `data-readonly` | (flag)                                      | Presente cuando readonly=true              |

### Group

| Attr                  | Valores | Descripción                                  |
| --------------------- | ------- | -------------------------------------------- |
| `data-checkbox-group` | (flag)  | Siempre presente en el grupo de checkboxes   |
| `data-disabled`       | (flag)  | Presente cuando el grupo tiene disabled=true |

### Group-label

| Attr                        | Valores | Descripción                            |
| --------------------------- | ------- | -------------------------------------- |
| `data-checkbox-group-label` | (flag)  | Siempre presente en la label del grupo |
| `data-disabled`             | (flag)  | Hereda disabled del grupo              |

### Input

| Attr                  | Valores | Descripción                         |
| --------------------- | ------- | ----------------------------------- |
| `data-checkbox-input` | (flag)  | Siempre presente en el input hidden |

---

## RadioGroup

**Versión del contrato:** 1

### Root

| Attr               | Valores                    | Descripción                                |
| ------------------ | -------------------------- | ------------------------------------------ |
| `data-radio-group` | (flag)                     | Siempre presente en el root del RadioGroup |
| `data-disabled`    | (flag)                     | Presente cuando disabled=true              |
| `data-readonly`    | (flag)                     | Presente cuando readonly=true              |
| `data-orientation` | `horizontal` \| `vertical` | Orientación del grupo                      |

### Item

| Attr                    | Valores                    | Descripción                                   |
| ----------------------- | -------------------------- | --------------------------------------------- |
| `data-radio-group-item` | (flag)                     | Siempre presente en cada item                 |
| `data-state`            | `checked` \| `unchecked`   | Estado: checked o unchecked                   |
| `data-disabled`         | (flag)                     | Presente cuando el item o grupo está disabled |
| `data-readonly`         | (flag)                     | Presente cuando el grupo está readonly        |
| `data-value`            | (flag)                     | Valor del item                                |
| `data-orientation`      | `horizontal` \| `vertical` | Hereda orientación del root                   |

---

## Toggle

**Versión del contrato:** 1

### Root

| Attr            | Valores       | Descripción                            |
| --------------- | ------------- | -------------------------------------- |
| `data-toggle`   | (flag)        | Siempre presente en el root del Toggle |
| `data-state`    | `on` \| `off` | Estado: on u off (pressed)             |
| `data-disabled` | (flag)        | Presente cuando disabled=true          |

---

## ToggleGroup

**Versión del contrato:** 1

### Root

| Attr                | Valores                    | Descripción                                 |
| ------------------- | -------------------------- | ------------------------------------------- |
| `data-toggle-group` | (flag)                     | Siempre presente en el root del ToggleGroup |
| `data-disabled`     | (flag)                     | Presente cuando disabled=true               |
| `data-orientation`  | `horizontal` \| `vertical` | Orientación del grupo                       |
| `data-type`         | `single` \| `multiple`     | Tipo de selección: single o multiple        |

### Item

| Attr                     | Valores                    | Descripción                                   |
| ------------------------ | -------------------------- | --------------------------------------------- |
| `data-toggle-group-item` | (flag)                     | Siempre presente en cada item                 |
| `data-state`             | `on` \| `off`              | Estado: on u off                              |
| `data-disabled`          | (flag)                     | Presente cuando el item o grupo está disabled |
| `data-orientation`       | `horizontal` \| `vertical` | Hereda orientación del root                   |

---

## Slider

**Versión del contrato:** 1

### Root

| Attr               | Valores                    | Descripción                            |
| ------------------ | -------------------------- | -------------------------------------- |
| `data-slider`      | (flag)                     | Siempre presente en el root del Slider |
| `data-disabled`    | (flag)                     | Presente cuando disabled=true          |
| `data-orientation` | `horizontal` \| `vertical` | Orientación del slider                 |

### Thumb

| Attr                | Valores | Descripción                  |
| ------------------- | ------- | ---------------------------- |
| `data-slider-thumb` | (flag)  | Siempre presente en el thumb |
| `data-disabled`     | (flag)  | Hereda disabled del root     |

### Track

| Attr                | Valores | Descripción                  |
| ------------------- | ------- | ---------------------------- |
| `data-slider-track` | (flag)  | Siempre presente en el track |

### Range

| Attr                | Valores | Descripción                        |
| ------------------- | ------- | ---------------------------------- |
| `data-slider-range` | (flag)  | Porción del track con valor activo |

---

## Accordion

**Versión del contrato:** 1

### Root

| Attr               | Valores                    | Descripción                               |
| ------------------ | -------------------------- | ----------------------------------------- |
| `data-accordion`   | (flag)                     | Siempre presente en el root del Accordion |
| `data-disabled`    | (flag)                     | Presente cuando disabled=true (global)    |
| `data-orientation` | `horizontal` \| `vertical` | Orientación de navegación                 |

### Item

| Attr                  | Valores                    | Descripción                           |
| --------------------- | -------------------------- | ------------------------------------- |
| `data-accordion-item` | (flag)                     | Siempre presente en cada item         |
| `data-disabled`       | (flag)                     | Presente cuando el item está disabled |
| `data-state`          | `open` \| `closed`         | Estado del item: open o closed        |
| `data-orientation`    | `horizontal` \| `vertical` | Hereda orientación del root           |

### List

| Attr               | Valores                    | Descripción                           |
| ------------------ | -------------------------- | ------------------------------------- |
| `data-tabs-list`   | (flag)                     | Siempre presente en la lista de tabs  |
| `data-disabled`    | (flag)                     | Presente cuando el root está disabled |
| `data-orientation` | `horizontal` \| `vertical` | Hereda orientación del root           |

### Trigger

| Attr                     | Valores                    | Descripción                    |
| ------------------------ | -------------------------- | ------------------------------ |
| `data-accordion-trigger` | (flag)                     | Siempre presente en el trigger |
| `data-disabled`          | (flag)                     | Presente cuando disabled       |
| `data-state`             | `open` \| `closed`         | Estado del item asociado       |
| `data-orientation`       | `horizontal` \| `vertical` | Hereda orientación             |

### Content

| Attr                     | Valores                    | Descripción                    |
| ------------------------ | -------------------------- | ------------------------------ |
| `data-accordion-content` | (flag)                     | Siempre presente en el content |
| `data-disabled`          | (flag)                     | Hereda disabled del item       |
| `data-state`             | `open` \| `closed`         | Estado del item asociado       |
| `data-orientation`       | `horizontal` \| `vertical` | Hereda orientación             |

### Header

| Attr                    | Valores                    | Descripción                   |
| ----------------------- | -------------------------- | ----------------------------- |
| `data-accordion-header` | (flag)                     | Siempre presente en el header |
| `data-heading-level`    | (flag)                     | Nivel del heading (1-6)       |
| `data-state`            | `open` \| `closed`         | Estado del item asociado      |
| `data-orientation`      | `horizontal` \| `vertical` | Hereda orientación            |

---

## Collapsible

**Versión del contrato:** 1

### Root

| Attr               | Valores            | Descripción                   |
| ------------------ | ------------------ | ----------------------------- |
| `data-collapsible` | (flag)             | Siempre presente en el root   |
| `data-state`       | `open` \| `closed` | Estado: open o closed         |
| `data-disabled`    | (flag)             | Presente cuando disabled=true |

### Trigger

| Attr                       | Valores            | Descripción                    |
| -------------------------- | ------------------ | ------------------------------ |
| `data-collapsible-trigger` | (flag)             | Siempre presente en el trigger |
| `data-state`               | `open` \| `closed` | Estado del collapsible         |
| `data-disabled`            | (flag)             | Presente cuando disabled       |

### Content

| Attr                       | Valores            | Descripción                    |
| -------------------------- | ------------------ | ------------------------------ |
| `data-collapsible-content` | (flag)             | Siempre presente en el content |
| `data-state`               | `open` \| `closed` | Estado del collapsible         |
| `data-disabled`            | (flag)             | Hereda disabled del root       |

---

## Dialog

**Versión del contrato:** 1

### Content

| Attr                  | Valores            | Descripción                                           |
| --------------------- | ------------------ | ----------------------------------------------------- |
| `data-dialog-content` | (flag)             | Siempre presente en el content                        |
| `data-state`          | `open` \| `closed` | Estado: open o closed                                 |
| `data-nested`         | (flag)             | Presente cuando el dialog está anidado dentro de otro |
| `data-nested-open`    | (flag)             | Presente cuando hay dialogs anidados abiertos         |

### Trigger

| Attr                  | Valores | Descripción                    |
| --------------------- | ------- | ------------------------------ |
| `data-dialog-trigger` | (flag)  | Siempre presente en el trigger |

### Overlay

| Attr                  | Valores            | Descripción                                   |
| --------------------- | ------------------ | --------------------------------------------- |
| `data-dialog-overlay` | (flag)             | Siempre presente en el overlay                |
| `data-state`          | `open` \| `closed` | Estado: open o closed                         |
| `data-nested`         | (flag)             | Presente cuando el dialog está anidado        |
| `data-nested-open`    | (flag)             | Presente cuando hay dialogs anidados abiertos |

### Title

| Attr                | Valores | Descripción                  |
| ------------------- | ------- | ---------------------------- |
| `data-dialog-title` | (flag)  | Siempre presente en el title |

### Description

| Attr                      | Valores | Descripción                        |
| ------------------------- | ------- | ---------------------------------- |
| `data-dialog-description` | (flag)  | Siempre presente en la description |

### Close

| Attr                | Valores | Descripción                        |
| ------------------- | ------- | ---------------------------------- |
| `data-dialog-close` | (flag)  | Siempre presente en el botón close |

### Cancel

| Attr                 | Valores | Descripción                     |
| -------------------- | ------- | ------------------------------- |
| `data-dialog-cancel` | (flag)  | Botón de cancelar (AlertDialog) |

### Action

| Attr                 | Valores | Descripción                             |
| -------------------- | ------- | --------------------------------------- |
| `data-dialog-action` | (flag)  | Botón de acción principal (AlertDialog) |

---

## AlertDialog

**Versión del contrato:** 1

### Content

| Attr                  | Valores            | Descripción                    |
| --------------------- | ------------------ | ------------------------------ |
| `data-dialog-content` | (flag)             | Siempre presente en el content |
| `data-state`          | `open` \| `closed` | Estado: open o closed          |

### Trigger

| Attr                  | Valores | Descripción                    |
| --------------------- | ------- | ------------------------------ |
| `data-dialog-trigger` | (flag)  | Siempre presente en el trigger |

### Overlay

| Attr                  | Valores | Descripción                    |
| --------------------- | ------- | ------------------------------ |
| `data-dialog-overlay` | (flag)  | Siempre presente en el overlay |

### Title

| Attr                | Valores | Descripción                  |
| ------------------- | ------- | ---------------------------- |
| `data-dialog-title` | (flag)  | Siempre presente en el title |

### Description

| Attr                      | Valores | Descripción                        |
| ------------------------- | ------- | ---------------------------------- |
| `data-dialog-description` | (flag)  | Siempre presente en la description |

### Cancel

| Attr                 | Valores | Descripción       |
| -------------------- | ------- | ----------------- |
| `data-dialog-cancel` | (flag)  | Botón de cancelar |

### Action

| Attr                 | Valores | Descripción               |
| -------------------- | ------- | ------------------------- |
| `data-dialog-action` | (flag)  | Botón de acción principal |

---

## Drawer

**Versión del contrato:** 1

### Content

| Attr                  | Valores                                | Descripción                        |
| --------------------- | -------------------------------------- | ---------------------------------- |
| `data-drawer-content` | (flag)                                 | Siempre presente en el content     |
| `data-state`          | `open` \| `closed`                     | Estado: open o closed              |
| `data-side`           | `top` \| `right` \| `bottom` \| `left` | Lado desde donde se abre el drawer |

### Trigger

| Attr                  | Valores | Descripción                    |
| --------------------- | ------- | ------------------------------ |
| `data-drawer-trigger` | (flag)  | Siempre presente en el trigger |

### Overlay

| Attr                  | Valores | Descripción                    |
| --------------------- | ------- | ------------------------------ |
| `data-drawer-overlay` | (flag)  | Siempre presente en el overlay |

### Title

| Attr                | Valores | Descripción                  |
| ------------------- | ------- | ---------------------------- |
| `data-drawer-title` | (flag)  | Siempre presente en el title |

### Description

| Attr                      | Valores | Descripción                        |
| ------------------------- | ------- | ---------------------------------- |
| `data-drawer-description` | (flag)  | Siempre presente en la description |

### Close

| Attr                | Valores | Descripción                        |
| ------------------- | ------- | ---------------------------------- |
| `data-drawer-close` | (flag)  | Siempre presente en el botón close |

---

## Popover

**Versión del contrato:** 1

### Content

| Attr                   | Valores            | Descripción                    |
| ---------------------- | ------------------ | ------------------------------ |
| `data-popover-content` | (flag)             | Siempre presente en el content |
| `data-state`           | `open` \| `closed` | Estado: open o closed          |

### Trigger

| Attr                   | Valores            | Descripción                    |
| ---------------------- | ------------------ | ------------------------------ |
| `data-popover-trigger` | (flag)             | Siempre presente en el trigger |
| `data-state`           | `open` \| `closed` | Estado: open o closed          |

### Close

| Attr                 | Valores | Descripción                  |
| -------------------- | ------- | ---------------------------- |
| `data-popover-close` | (flag)  | Botón para cerrar el popover |

### Overlay

| Attr                   | Valores            | Descripción                  |
| ---------------------- | ------------------ | ---------------------------- |
| `data-popover-overlay` | (flag)             | Overlay opcional del popover |
| `data-state`           | `open` \| `closed` | Estado: open o closed        |

### Arrow

| Attr                 | Valores | Descripción                  |
| -------------------- | ------- | ---------------------------- |
| `data-popover-arrow` | (flag)  | Flecha indicadora (opcional) |

---

## Form

**Versión del contrato:** 1

### Root

| Attr            | Valores | Descripción                   |
| --------------- | ------- | ----------------------------- |
| `data-form`     | (flag)  | Siempre presente en el root   |
| `data-disabled` | (flag)  | Presente cuando disabled=true |
| `data-readonly` | (flag)  | Presente cuando readonly=true |
| `data-pending`  | (flag)  | Presente cuando pending=true  |

### Field

| Attr              | Valores | Descripción                            |
| ----------------- | ------- | -------------------------------------- |
| `data-form-field` | (flag)  | Contenedor de un campo                 |
| `data-invalid`    | (flag)  | Presente cuando invalid=true           |
| `data-disabled`   | (flag)  | Presente cuando el campo está disabled |
| `data-readonly`   | (flag)  | Presente cuando el campo está readonly |
| `data-required`   | (flag)  | Presente cuando required=true          |
| `data-pending`    | (flag)  | Presente cuando el campo está pending  |

### Label

| Attr              | Valores | Descripción               |
| ----------------- | ------- | ------------------------- |
| `data-form-label` | (flag)  | Label del campo           |
| `data-invalid`    | (flag)  | Hereda invalid del campo  |
| `data-disabled`   | (flag)  | Hereda disabled del campo |
| `data-required`   | (flag)  | Hereda required del campo |

### Description

| Attr                    | Valores | Descripción                    |
| ----------------------- | ------- | ------------------------------ |
| `data-form-description` | (flag)  | Descripción auxiliar del campo |
| `data-disabled`         | (flag)  | Hereda disabled del campo      |

### Error

| Attr              | Valores | Descripción                |
| ----------------- | ------- | -------------------------- |
| `data-form-error` | (flag)  | Mensaje de error del campo |
| `data-invalid`    | (flag)  | Hereda invalid del campo   |

### Control

| Attr                | Valores | Descripción                  |
| ------------------- | ------- | ---------------------------- |
| `data-form-control` | (flag)  | Wrapper del control asociado |
| `data-invalid`      | (flag)  | Hereda invalid del campo     |
| `data-disabled`     | (flag)  | Hereda disabled del campo    |

### Submit

| Attr               | Valores | Descripción                               |
| ------------------ | ------- | ----------------------------------------- |
| `data-form-submit` | (flag)  | Botón submit del formulario               |
| `data-disabled`    | (flag)  | Presente cuando submit no está disponible |
| `data-pending`     | (flag)  | Presente cuando el form está pending      |

---

## Tooltip

**Versión del contrato:** 1

### Content

| Attr                   | Valores            | Descripción                    |
| ---------------------- | ------------------ | ------------------------------ |
| `data-tooltip-content` | (flag)             | Siempre presente en el content |
| `data-state`           | `open` \| `closed` | Estado: open o closed          |

### Trigger

| Attr                   | Valores | Descripción                    |
| ---------------------- | ------- | ------------------------------ |
| `data-tooltip-trigger` | (flag)  | Siempre presente en el trigger |

### Arrow

| Attr                 | Valores | Descripción                  |
| -------------------- | ------- | ---------------------------- |
| `data-tooltip-arrow` | (flag)  | Flecha indicadora (opcional) |

---

## DropdownMenu

**Versión del contrato:** 1

### Root

| Attr                 | Valores | Descripción                        |
| -------------------- | ------- | ---------------------------------- |
| `data-dropdown-menu` | (flag)  | Contexto raíz (no genera elemento) |

### Trigger

| Attr                         | Valores            | Descripción                    |
| ---------------------------- | ------------------ | ------------------------------ |
| `data-dropdown-menu-trigger` | (flag)             | Siempre presente en el trigger |
| `data-disabled`              | (flag)             | Presente cuando disabled=true  |
| `data-state`                 | `open` \| `closed` | Estado: open o closed          |

### Content

| Attr                         | Valores            | Descripción                    |
| ---------------------------- | ------------------ | ------------------------------ |
| `data-dropdown-menu-content` | (flag)             | Siempre presente en el content |
| `data-state`                 | `open` \| `closed` | Estado: open o closed          |

### Sub-content

| Attr                             | Valores            | Descripción                                |
| -------------------------------- | ------------------ | ------------------------------------------ |
| `data-dropdown-menu-content`     | (flag)             | Base compartida del content del submenú    |
| `data-dropdown-menu-sub-content` | (flag)             | Siempre presente en el content del submenú |
| `data-state`                     | `open` \| `closed` | Estado: open o closed                      |

### Item

| Attr                      | Valores | Descripción                                |
| ------------------------- | ------- | ------------------------------------------ |
| `data-dropdown-menu-item` | (flag)  | Siempre presente en cada item              |
| `data-highlighted`        | (flag)  | Presente cuando el item está highlighteado |
| `data-disabled`           | (flag)  | Presente cuando disabled=true              |

### Sub-trigger

| Attr                             | Valores            | Descripción                                    |
| -------------------------------- | ------------------ | ---------------------------------------------- |
| `data-dropdown-menu-item`        | (flag)             | Base compartida del item disparador de submenú |
| `data-dropdown-menu-sub-trigger` | (flag)             | Siempre presente en el trigger del submenú     |
| `data-highlighted`               | (flag)             | Presente cuando el item está highlighteado     |
| `data-disabled`                  | (flag)             | Presente cuando disabled=true                  |
| `data-state`                     | `open` \| `closed` | Estado del submenú: open o closed              |

### Group

| Attr                       | Valores | Descripción             |
| -------------------------- | ------- | ----------------------- |
| `data-dropdown-menu-group` | (flag)  | Grupo de items del menú |

### Group-heading

| Attr                               | Valores | Descripción                |
| ---------------------------------- | ------- | -------------------------- |
| `data-dropdown-menu-group-heading` | (flag)  | Título o heading del grupo |

### Checkbox-group

| Attr                                | Valores | Descripción             |
| ----------------------------------- | ------- | ----------------------- |
| `data-dropdown-menu-checkbox-group` | (flag)  | Grupo de items checkbox |

### Checkbox-item

| Attr                               | Valores                  | Descripción                                |
| ---------------------------------- | ------------------------ | ------------------------------------------ |
| `data-dropdown-menu-item`          | (flag)                   | Base compartida del item checkbox          |
| `data-dropdown-menu-checkbox-item` | (flag)                   | Item de tipo checkbox                      |
| `data-state`                       | `checked` \| `unchecked` | Estado: checked o unchecked                |
| `data-highlighted`                 | (flag)                   | Presente cuando el item está highlighteado |
| `data-disabled`                    | (flag)                   | Presente cuando disabled=true              |

### Radio-group

| Attr                             | Valores | Descripción          |
| -------------------------------- | ------- | -------------------- |
| `data-dropdown-menu-radio-group` | (flag)  | Grupo de items radio |

### Radio-item

| Attr                            | Valores                  | Descripción                                |
| ------------------------------- | ------------------------ | ------------------------------------------ |
| `data-dropdown-menu-item`       | (flag)                   | Base compartida del item radio             |
| `data-dropdown-menu-radio-item` | (flag)                   | Item de tipo radio                         |
| `data-state`                    | `checked` \| `unchecked` | Estado: checked o unchecked                |
| `data-highlighted`              | (flag)                   | Presente cuando el item está highlighteado |
| `data-disabled`                 | (flag)                   | Presente cuando disabled=true              |

### Separator

| Attr                           | Valores | Descripción      |
| ------------------------------ | ------- | ---------------- |
| `data-dropdown-menu-separator` | (flag)  | Separador visual |

### Arrow

| Attr                       | Valores | Descripción                |
| -------------------------- | ------- | -------------------------- |
| `data-dropdown-menu-arrow` | (flag)  | Flecha indicadora del menú |

---

## ContextMenu

**Versión del contrato:** 1

### Trigger

| Attr                        | Valores            | Descripción                      |
| --------------------------- | ------------------ | -------------------------------- |
| `data-context-menu-trigger` | (flag)             | Área trigger del menú contextual |
| `data-disabled`             | (flag)             | Presente cuando disabled=true    |
| `data-state`                | `open` \| `closed` | Estado: open o closed            |

### Content

| Attr                        | Valores            | Descripción                    |
| --------------------------- | ------------------ | ------------------------------ |
| `data-context-menu-content` | (flag)             | Siempre presente en el content |
| `data-state`                | `open` \| `closed` | Estado: open o closed          |

### Sub-content

| Attr                            | Valores            | Descripción                                |
| ------------------------------- | ------------------ | ------------------------------------------ |
| `data-context-menu-content`     | (flag)             | Base compartida del content del submenú    |
| `data-context-menu-sub-content` | (flag)             | Siempre presente en el content del submenú |
| `data-state`                    | `open` \| `closed` | Estado: open o closed                      |

### Item

| Attr                     | Valores | Descripción                                |
| ------------------------ | ------- | ------------------------------------------ |
| `data-context-menu-item` | (flag)  | Siempre presente en cada item              |
| `data-highlighted`       | (flag)  | Presente cuando el item está highlighteado |
| `data-disabled`          | (flag)  | Presente cuando disabled=true              |

### Sub-trigger

| Attr                            | Valores            | Descripción                                    |
| ------------------------------- | ------------------ | ---------------------------------------------- |
| `data-context-menu-item`        | (flag)             | Base compartida del item disparador de submenú |
| `data-context-menu-sub-trigger` | (flag)             | Siempre presente en el trigger del submenú     |
| `data-highlighted`              | (flag)             | Presente cuando el item está highlighteado     |
| `data-disabled`                 | (flag)             | Presente cuando disabled=true                  |
| `data-state`                    | `open` \| `closed` | Estado del submenú: open o closed              |

### Group

| Attr                      | Valores | Descripción             |
| ------------------------- | ------- | ----------------------- |
| `data-context-menu-group` | (flag)  | Grupo de items del menú |

### Group-heading

| Attr                              | Valores | Descripción                |
| --------------------------------- | ------- | -------------------------- |
| `data-context-menu-group-heading` | (flag)  | Título o heading del grupo |

### Checkbox-group

| Attr                               | Valores | Descripción             |
| ---------------------------------- | ------- | ----------------------- |
| `data-context-menu-checkbox-group` | (flag)  | Grupo de items checkbox |

### Checkbox-item

| Attr                              | Valores                  | Descripción                                |
| --------------------------------- | ------------------------ | ------------------------------------------ |
| `data-context-menu-item`          | (flag)                   | Base compartida del item checkbox          |
| `data-context-menu-checkbox-item` | (flag)                   | Item de tipo checkbox                      |
| `data-state`                      | `checked` \| `unchecked` | Estado: checked o unchecked                |
| `data-highlighted`                | (flag)                   | Presente cuando el item está highlighteado |
| `data-disabled`                   | (flag)                   | Presente cuando disabled=true              |

### Radio-group

| Attr                            | Valores | Descripción          |
| ------------------------------- | ------- | -------------------- |
| `data-context-menu-radio-group` | (flag)  | Grupo de items radio |

### Radio-item

| Attr                           | Valores                  | Descripción                                |
| ------------------------------ | ------------------------ | ------------------------------------------ |
| `data-context-menu-item`       | (flag)                   | Base compartida del item radio             |
| `data-context-menu-radio-item` | (flag)                   | Item de tipo radio                         |
| `data-state`                   | `checked` \| `unchecked` | Estado: checked o unchecked                |
| `data-highlighted`             | (flag)                   | Presente cuando el item está highlighteado |
| `data-disabled`                | (flag)                   | Presente cuando disabled=true              |

### Separator

| Attr                          | Valores | Descripción      |
| ----------------------------- | ------- | ---------------- |
| `data-context-menu-separator` | (flag)  | Separador visual |

### Arrow

| Attr                      | Valores | Descripción                |
| ------------------------- | ------- | -------------------------- |
| `data-context-menu-arrow` | (flag)  | Flecha indicadora del menú |

---

## Menubar

**Versión del contrato:** 1

### Root

| Attr           | Valores | Descripción                 |
| -------------- | ------- | --------------------------- |
| `data-menubar` | (flag)  | Siempre presente en el root |

### Trigger

| Attr                   | Valores            | Descripción                                 |
| ---------------------- | ------------------ | ------------------------------------------- |
| `data-menubar-trigger` | (flag)             | Siempre presente en el trigger de cada menú |
| `data-state`           | `open` \| `closed` | Estado: open o closed                       |
| `data-highlighted`     | (flag)             | Presente cuando tiene foco o hover          |
| `data-disabled`        | (flag)             | Presente cuando disabled=true               |
| `data-menu-value`      | (flag)             | Valor del menú (value prop)                 |

### Content

| Attr                   | Valores            | Descripción                    |
| ---------------------- | ------------------ | ------------------------------ |
| `data-menubar-content` | (flag)             | Siempre presente en el content |
| `data-state`           | `open` \| `closed` | Estado: open o closed          |

### Sub-content

| Attr                       | Valores            | Descripción                                |
| -------------------------- | ------------------ | ------------------------------------------ |
| `data-menubar-content`     | (flag)             | Base compartida del content del submenú    |
| `data-menubar-sub-content` | (flag)             | Siempre presente en el content del submenú |
| `data-state`               | `open` \| `closed` | Estado: open o closed                      |

### Item

| Attr                | Valores | Descripción                                |
| ------------------- | ------- | ------------------------------------------ |
| `data-menubar-item` | (flag)  | Siempre presente en cada item del menú     |
| `data-highlighted`  | (flag)  | Presente cuando el item está highlighteado |
| `data-disabled`     | (flag)  | Presente cuando disabled=true              |

### Sub-trigger

| Attr                       | Valores            | Descripción                                    |
| -------------------------- | ------------------ | ---------------------------------------------- |
| `data-menubar-item`        | (flag)             | Base compartida del item disparador de submenú |
| `data-menubar-sub-trigger` | (flag)             | Siempre presente en el trigger del submenú     |
| `data-highlighted`         | (flag)             | Presente cuando el item está highlighteado     |
| `data-disabled`            | (flag)             | Presente cuando disabled=true                  |
| `data-state`               | `open` \| `closed` | Estado del submenú: open o closed              |

### Group

| Attr                 | Valores | Descripción             |
| -------------------- | ------- | ----------------------- |
| `data-menubar-group` | (flag)  | Grupo de items del menú |

### Group-heading

| Attr                         | Valores | Descripción                |
| ---------------------------- | ------- | -------------------------- |
| `data-menubar-group-heading` | (flag)  | Título o heading del grupo |

### Checkbox-group

| Attr                          | Valores | Descripción             |
| ----------------------------- | ------- | ----------------------- |
| `data-menubar-checkbox-group` | (flag)  | Grupo de items checkbox |

### Checkbox-item

| Attr                         | Valores                  | Descripción                                |
| ---------------------------- | ------------------------ | ------------------------------------------ |
| `data-menubar-item`          | (flag)                   | Base compartida del item checkbox          |
| `data-menubar-checkbox-item` | (flag)                   | Item de tipo checkbox                      |
| `data-state`                 | `checked` \| `unchecked` | Estado: checked o unchecked                |
| `data-highlighted`           | (flag)                   | Presente cuando el item está highlighteado |
| `data-disabled`              | (flag)                   | Presente cuando disabled=true              |

### Radio-group

| Attr                       | Valores | Descripción          |
| -------------------------- | ------- | -------------------- |
| `data-menubar-radio-group` | (flag)  | Grupo de items radio |

### Radio-item

| Attr                      | Valores                  | Descripción                                |
| ------------------------- | ------------------------ | ------------------------------------------ |
| `data-menubar-item`       | (flag)                   | Base compartida del item radio             |
| `data-menubar-radio-item` | (flag)                   | Item de tipo radio                         |
| `data-state`              | `checked` \| `unchecked` | Estado: checked o unchecked                |
| `data-highlighted`        | (flag)                   | Presente cuando el item está highlighteado |
| `data-disabled`           | (flag)                   | Presente cuando disabled=true              |

### Separator

| Attr                     | Valores | Descripción      |
| ------------------------ | ------- | ---------------- |
| `data-menubar-separator` | (flag)  | Separador visual |

### Arrow

| Attr                 | Valores | Descripción                |
| -------------------- | ------- | -------------------------- |
| `data-menubar-arrow` | (flag)  | Flecha indicadora del menú |

---

## Field

**Versión del contrato:** 1

### Root

| Attr            | Valores                                                    | Descripción                   |
| --------------- | ---------------------------------------------------------- | ----------------------------- |
| `data-field`    | (flag)                                                     | Siempre presente en el root   |
| `data-state`    | `idle` \| `error` \| `disabled` \| `readonly` \| `loading` | Estado del campo              |
| `data-disabled` | (flag)                                                     | Presente cuando disabled=true |
| `data-readonly` | (flag)                                                     | Presente cuando readonly=true |
| `data-required` | (flag)                                                     | Presente cuando required=true |

### Label

| Attr               | Valores | Descripción                            |
| ------------------ | ------- | -------------------------------------- |
| `data-field-label` | (flag)  | Label asociada al campo                |
| `data-disabled`    | (flag)  | Presente cuando disabled=true          |
| `data-error`       | (flag)  | Presente cuando el campo está en error |
| `data-required`    | (flag)  | Presente cuando required=true          |

### Control

| Attr                 | Valores                                                    | Descripción                      |
| -------------------- | ---------------------------------------------------------- | -------------------------------- |
| `data-field-control` | (flag)                                                     | Contenedor del control principal |
| `data-state`         | `idle` \| `error` \| `disabled` \| `readonly` \| `loading` | Estado del campo                 |
| `data-disabled`      | (flag)                                                     | Presente cuando disabled=true    |

### Input

| Attr               | Valores                                                    | Descripción               |
| ------------------ | ---------------------------------------------------------- | ------------------------- |
| `data-field-input` | (flag)                                                     | Input principal del campo |
| `data-state`       | `idle` \| `error` \| `disabled` \| `readonly` \| `loading` | Estado del campo          |

### Helper-text

| Attr                     | Valores | Descripción                   |
| ------------------------ | ------- | ----------------------------- |
| `data-field-helper-text` | (flag)  | Texto de ayuda del campo      |
| `data-disabled`          | (flag)  | Presente cuando disabled=true |

### Error

| Attr               | Valores | Descripción                            |
| ------------------ | ------- | -------------------------------------- |
| `data-field-error` | (flag)  | Mensaje de error del campo             |
| `data-error`       | (flag)  | Presente cuando el campo está en error |

### Prefix

| Attr                | Valores | Descripción                            |
| ------------------- | ------- | -------------------------------------- |
| `data-field-prefix` | (flag)  | Contenido decorativo anterior al input |

### Suffix

| Attr                | Valores | Descripción                             |
| ------------------- | ------- | --------------------------------------- |
| `data-field-suffix` | (flag)  | Contenido decorativo posterior al input |

---

## NumberField

**Versión del contrato:** 1

### Label

| Attr                      | Valores | Descripción                   |
| ------------------------- | ------- | ----------------------------- |
| `data-number-field-label` | (flag)  | Label del campo numérico      |
| `data-disabled`           | (flag)  | Presente cuando disabled=true |
| `data-invalid`            | (flag)  | Presente cuando invalid=true  |

### Input

| Attr                      | Valores | Descripción                      |
| ------------------------- | ------- | -------------------------------- |
| `data-number-field-input` | (flag)  | Input principal del number field |
| `data-disabled`           | (flag)  | Presente cuando disabled=true    |
| `data-readonly`           | (flag)  | Presente cuando readonly=true    |
| `data-invalid`            | (flag)  | Presente cuando invalid=true     |

### Increment

| Attr                          | Valores | Descripción                                 |
| ----------------------------- | ------- | ------------------------------------------- |
| `data-number-field-increment` | (flag)  | Botón para incrementar el valor             |
| `data-disabled`               | (flag)  | Presente cuando el botón no puede activarse |

### Decrement

| Attr                          | Valores | Descripción                                 |
| ----------------------------- | ------- | ------------------------------------------- |
| `data-number-field-decrement` | (flag)  | Botón para decrementar el valor             |
| `data-disabled`               | (flag)  | Presente cuando el botón no puede activarse |

---

## TagsInput

**Versión del contrato:** 1

### Root

| Attr              | Valores | Descripción                   |
| ----------------- | ------- | ----------------------------- |
| `data-tags-input` | (flag)  | Siempre presente en el root   |
| `data-disabled`   | (flag)  | Presente cuando disabled=true |
| `data-readonly`   | (flag)  | Presente cuando readonly=true |
| `data-invalid`    | (flag)  | Presente cuando invalid=true  |

### Input

| Attr                    | Valores | Descripción                   |
| ----------------------- | ------- | ----------------------------- |
| `data-tags-input-input` | (flag)  | Input para añadir tags        |
| `data-disabled`         | (flag)  | Presente cuando disabled=true |
| `data-invalid`          | (flag)  | Presente cuando invalid=true  |

### Tag

| Attr                  | Valores | Descripción                   |
| --------------------- | ------- | ----------------------------- |
| `data-tags-input-tag` | (flag)  | Tag individual                |
| `data-disabled`       | (flag)  | Presente cuando disabled=true |
| `data-tag-value`      | (flag)  | Valor textual de la tag       |

### Tag-text

| Attr                       | Valores | Descripción             |
| -------------------------- | ------- | ----------------------- |
| `data-tags-input-tag-text` | (flag)  | Texto visible de la tag |

### Tag-remove

| Attr                         | Valores | Descripción                                 |
| ---------------------------- | ------- | ------------------------------------------- |
| `data-tags-input-tag-remove` | (flag)  | Botón para eliminar una tag                 |
| `data-disabled`              | (flag)  | Presente cuando el botón no puede activarse |

### Clear

| Attr                    | Valores | Descripción                                 |
| ----------------------- | ------- | ------------------------------------------- |
| `data-tags-input-clear` | (flag)  | Botón para limpiar todas las tags           |
| `data-disabled`         | (flag)  | Presente cuando el botón no puede activarse |

---

## VirtualList

**Versión del contrato:** 1

### Root

| Attr                | Valores                    | Descripción                                          |
| ------------------- | -------------------------- | ---------------------------------------------------- |
| `data-virtual-list` | (flag)                     | Siempre presente en el root                          |
| `data-direction`    | `vertical` \| `horizontal` | Dirección de la lista virtual                        |
| `data-use-window`   | (flag)                     | Presente cuando usa window como contenedor de scroll |

### Spacer

| Attr                       | Valores | Descripción                                 |
| -------------------------- | ------- | ------------------------------------------- |
| `data-virtual-list-spacer` | (flag)  | Espaciador con el tamaño total virtualizado |

### Item

| Attr                     | Valores | Descripción                             |
| ------------------------ | ------- | --------------------------------------- |
| `data-virtual-list-item` | (flag)  | Item visible dentro de la lista virtual |
| `data-index`             | (flag)  | Índice real del item en la colección    |

---

## Select

**Versión del contrato:** 1

### Trigger

| Attr                  | Valores            | Descripción                               |
| --------------------- | ------------------ | ----------------------------------------- |
| `data-select-trigger` | (flag)             | Siempre presente en el trigger            |
| `data-state`          | `open` \| `closed` | Estado: open o closed                     |
| `data-disabled`       | (flag)             | Presente cuando disabled=true             |
| `data-placeholder`    | (flag)             | Presente cuando no hay valor seleccionado |

### Content

| Attr                  | Valores            | Descripción                    |
| --------------------- | ------------------ | ------------------------------ |
| `data-select-content` | (flag)             | Siempre presente en el content |
| `data-state`          | `open` \| `closed` | Estado: open o closed          |

### Item

| Attr               | Valores | Descripción                       |
| ------------------ | ------- | --------------------------------- |
| `data-select-item` | (flag)  | Siempre presente en cada item     |
| `data-highlighted` | (flag)  | Presente cuando highlighteado     |
| `data-selected`    | (flag)  | Presente cuando está seleccionado |
| `data-disabled`    | (flag)  | Presente cuando disabled=true     |
| `data-value`       | (flag)  | Valor lógico del item             |
| `data-label`       | (flag)  | Etiqueta asociada al item         |

### Group

| Attr                | Valores | Descripción                     |
| ------------------- | ------- | ------------------------------- |
| `data-select-group` | (flag)  | Contenedor de grupo de opciones |

### Group-label

| Attr                      | Valores | Descripción                |
| ------------------------- | ------- | -------------------------- |
| `data-select-group-label` | (flag)  | Etiqueta visible del grupo |

### Viewport

| Attr                   | Valores | Descripción              |
| ---------------------- | ------- | ------------------------ |
| `data-select-viewport` | (flag)  | Área visible del content |

### Scroll-down-button

| Attr                             | Valores | Descripción                                  |
| -------------------------------- | ------- | -------------------------------------------- |
| `data-select-scroll-down-button` | (flag)  | Botón para desplazar el viewport hacia abajo |

### Scroll-up-button

| Attr                           | Valores | Descripción                                   |
| ------------------------------ | ------- | --------------------------------------------- |
| `data-select-scroll-up-button` | (flag)  | Botón para desplazar el viewport hacia arriba |

---

## Combobox

**Versión del contrato:** 1

### Trigger

| Attr                    | Valores            | Descripción                                          |
| ----------------------- | ------------------ | ---------------------------------------------------- |
| `data-combobox-trigger` | (flag)             | Siempre presente en el trigger auxiliar del combobox |
| `data-state`            | `open` \| `closed` | Estado: open o closed                                |
| `data-disabled`         | (flag)             | Presente cuando disabled=true                        |

### Input

| Attr                  | Valores            | Descripción                   |
| --------------------- | ------------------ | ----------------------------- |
| `data-combobox-input` | (flag)             | Siempre presente en el input  |
| `data-state`          | `open` \| `closed` | Estado: open o closed         |
| `data-disabled`       | (flag)             | Presente cuando disabled=true |

### Content

| Attr                    | Valores            | Descripción                    |
| ----------------------- | ------------------ | ------------------------------ |
| `data-combobox-content` | (flag)             | Siempre presente en el content |
| `data-state`            | `open` \| `closed` | Estado: open o closed          |

### Item

| Attr                 | Valores | Descripción                       |
| -------------------- | ------- | --------------------------------- |
| `data-combobox-item` | (flag)  | Siempre presente en cada item     |
| `data-highlighted`   | (flag)  | Presente cuando highlighteado     |
| `data-selected`      | (flag)  | Presente cuando está seleccionado |
| `data-disabled`      | (flag)  | Presente cuando disabled=true     |
| `data-value`         | (flag)  | Valor lógico del item             |
| `data-label`         | (flag)  | Etiqueta asociada al item         |

### Group

| Attr                  | Valores | Descripción                     |
| --------------------- | ------- | ------------------------------- |
| `data-combobox-group` | (flag)  | Contenedor de grupo de opciones |

### Group-label

| Attr                        | Valores | Descripción                |
| --------------------------- | ------- | -------------------------- |
| `data-combobox-group-label` | (flag)  | Etiqueta visible del grupo |

### Viewport

| Attr                     | Valores | Descripción              |
| ------------------------ | ------- | ------------------------ |
| `data-combobox-viewport` | (flag)  | Área visible del content |

### Scroll-down-button

| Attr                               | Valores | Descripción                                  |
| ---------------------------------- | ------- | -------------------------------------------- |
| `data-combobox-scroll-down-button` | (flag)  | Botón para desplazar el viewport hacia abajo |

### Scroll-up-button

| Attr                             | Valores | Descripción                                   |
| -------------------------------- | ------- | --------------------------------------------- |
| `data-combobox-scroll-up-button` | (flag)  | Botón para desplazar el viewport hacia arriba |

---

## Stepper

**Versión del contrato:** 1

### Root

| Attr               | Valores                    | Descripción                   |
| ------------------ | -------------------------- | ----------------------------- |
| `data-stepper`     | (flag)                     | Siempre presente en el root   |
| `data-orientation` | `horizontal` \| `vertical` | Orientación del stepper       |
| `data-disabled`    | (flag)                     | Presente cuando disabled=true |

### List

| Attr                | Valores                    | Descripción                           |
| ------------------- | -------------------------- | ------------------------------------- |
| `data-stepper-list` | (flag)                     | Lista de pasos                        |
| `data-orientation`  | `horizontal` \| `vertical` | Hereda orientación del root           |
| `data-disabled`     | (flag)                     | Presente cuando el root está disabled |

### Item

| Attr                | Valores                                 | Descripción                 |
| ------------------- | --------------------------------------- | --------------------------- |
| `data-stepper-item` | (flag)                                  | Paso individual             |
| `data-state`        | `active` \| `completed` \| `incomplete` | Estado del paso             |
| `data-index`        | (flag)                                  | Índice 0-based del paso     |
| `data-first`        | (flag)                                  | Presente en el primer paso  |
| `data-last`         | (flag)                                  | Presente en el último paso  |
| `data-orientation`  | `horizontal` \| `vertical`              | Hereda orientación del root |

### Trigger

| Attr                   | Valores                                 | Descripción                              |
| ---------------------- | --------------------------------------- | ---------------------------------------- |
| `data-stepper-trigger` | (flag)                                  | Trigger de navegación del paso           |
| `data-state`           | `active` \| `completed` \| `incomplete` | Estado del paso                          |
| `data-disabled`        | (flag)                                  | Presente cuando el trigger está disabled |
| `data-orientation`     | `horizontal` \| `vertical`              | Hereda orientación del root              |

### Indicator

| Attr                     | Valores                                 | Descripción               |
| ------------------------ | --------------------------------------- | ------------------------- |
| `data-stepper-indicator` | (flag)                                  | Indicador visual del paso |
| `data-state`             | `active` \| `completed` \| `incomplete` | Estado del paso           |

### Title

| Attr                 | Valores                                 | Descripción     |
| -------------------- | --------------------------------------- | --------------- |
| `data-stepper-title` | (flag)                                  | Título del paso |
| `data-state`         | `active` \| `completed` \| `incomplete` | Estado del paso |

### Description

| Attr                       | Valores                                 | Descripción          |
| -------------------------- | --------------------------------------- | -------------------- |
| `data-stepper-description` | (flag)                                  | Descripción del paso |
| `data-state`               | `active` \| `completed` \| `incomplete` | Estado del paso      |

### Separator

| Attr                     | Valores                                 | Descripción                 |
| ------------------------ | --------------------------------------- | --------------------------- |
| `data-stepper-separator` | (flag)                                  | Separador entre pasos       |
| `data-state`             | `active` \| `completed` \| `incomplete` | Estado del paso asociado    |
| `data-orientation`       | `horizontal` \| `vertical`              | Hereda orientación del root |

### Content

| Attr                   | Valores                                 | Descripción        |
| ---------------------- | --------------------------------------- | ------------------ |
| `data-stepper-content` | (flag)                                  | Contenido del paso |
| `data-state`           | `active` \| `completed` \| `incomplete` | Estado del paso    |

### Next-trigger

| Attr                        | Valores | Descripción                          |
| --------------------------- | ------- | ------------------------------------ |
| `data-stepper-next-trigger` | (flag)  | Botón para avanzar al siguiente paso |
| `data-disabled`             | (flag)  | Presente cuando no puede avanzar     |

### Prev-trigger

| Attr                        | Valores | Descripción                            |
| --------------------------- | ------- | -------------------------------------- |
| `data-stepper-prev-trigger` | (flag)  | Botón para retroceder al paso anterior |
| `data-disabled`             | (flag)  | Presente cuando no puede retroceder    |

---

## Editable

**Versión del contrato:** 1

### Root

| Attr            | Valores | Descripción                                      |
| --------------- | ------- | ------------------------------------------------ |
| `data-editable` | (flag)  | Siempre presente en el root                      |
| `data-editing`  | (flag)  | Presente cuando el editable está en modo edición |
| `data-disabled` | (flag)  | Presente cuando disabled=true                    |
| `data-readonly` | (flag)  | Presente cuando readonly=true                    |

### Area

| Attr                 | Valores | Descripción                  |
| -------------------- | ------- | ---------------------------- |
| `data-editable-area` | (flag)  | Contenedor del área editable |

### Preview

| Attr                    | Valores | Descripción                                      |
| ----------------------- | ------- | ------------------------------------------------ |
| `data-editable-preview` | (flag)  | Vista previa del valor cuando no se edita        |
| `data-editing`          | (flag)  | Presente cuando el editable está en modo edición |
| `data-empty`            | (flag)  | Presente cuando el valor está vacío              |
| `data-disabled`         | (flag)  | Presente cuando disabled=true                    |
| `data-readonly`         | (flag)  | Presente cuando readonly=true                    |

### Input

| Attr                  | Valores | Descripción                                      |
| --------------------- | ------- | ------------------------------------------------ |
| `data-editable-input` | (flag)  | Input usado durante la edición                   |
| `data-editing`        | (flag)  | Presente cuando el editable está en modo edición |

### Edit-trigger

| Attr                         | Valores | Descripción                                      |
| ---------------------------- | ------- | ------------------------------------------------ |
| `data-editable-edit-trigger` | (flag)  | Trigger para entrar en modo edición              |
| `data-editing`               | (flag)  | Presente cuando el editable está en modo edición |
| `data-disabled`              | (flag)  | Presente cuando no puede activarse               |

### Submit-trigger

| Attr                           | Valores | Descripción                                      |
| ------------------------------ | ------- | ------------------------------------------------ |
| `data-editable-submit-trigger` | (flag)  | Trigger para confirmar la edición                |
| `data-editing`                 | (flag)  | Presente cuando el editable está en modo edición |
| `data-disabled`                | (flag)  | Presente cuando no puede activarse               |

### Cancel-trigger

| Attr                           | Valores | Descripción                                      |
| ------------------------------ | ------- | ------------------------------------------------ |
| `data-editable-cancel-trigger` | (flag)  | Trigger para cancelar la edición                 |
| `data-editing`                 | (flag)  | Presente cuando el editable está en modo edición |
| `data-disabled`                | (flag)  | Presente cuando no puede activarse               |

---

## Command

**Versión del contrato:** 1

### Root

| Attr           | Valores | Descripción                 |
| -------------- | ------- | --------------------------- |
| `data-command` | (flag)  | Siempre presente en el root |

### List

| Attr                | Valores | Descripción    |
| ------------------- | ------- | -------------- |
| `data-command-list` | (flag)  | Lista de items |

### Input

| Attr                 | Valores | Descripción                              |
| -------------------- | ------- | ---------------------------------------- |
| `data-command-input` | (flag)  | Siempre presente en el input de búsqueda |

### Separator

| Attr                     | Valores | Descripción      |
| ------------------------ | ------- | ---------------- |
| `data-command-separator` | (flag)  | Separador visual |

### Loading

| Attr                   | Valores | Descripción        |
| ---------------------- | ------- | ------------------ |
| `data-command-loading` | (flag)  | Indicador de carga |

### Empty

| Attr                 | Valores | Descripción                      |
| -------------------- | ------- | -------------------------------- |
| `data-command-empty` | (flag)  | Mensaje cuando no hay resultados |

### Group

| Attr                 | Valores | Descripción                       |
| -------------------- | ------- | --------------------------------- |
| `data-command-group` | (flag)  | Contenedor de grupo de resultados |
| `data-value`         | (flag)  | Valor lógico del grupo            |

### Group-items

| Attr                       | Valores | Descripción                   |
| -------------------------- | ------- | ----------------------------- |
| `data-command-group-items` | (flag)  | Contenedor de items del grupo |

### Group-heading

| Attr                         | Valores | Descripción       |
| ---------------------------- | ------- | ----------------- |
| `data-command-group-heading` | (flag)  | Heading del grupo |

### Item

| Attr                | Valores | Descripción                       |
| ------------------- | ------- | --------------------------------- |
| `data-command-item` | (flag)  | Siempre presente en cada item     |
| `data-value`        | (flag)  | Valor del item para filtrado      |
| `data-disabled`     | (flag)  | Presente cuando disabled=true     |
| `data-selected`     | (flag)  | Presente cuando está seleccionado |
| `data-group`        | (flag)  | Valor del grupo al que pertenece  |

### Viewport

| Attr                    | Valores | Descripción                  |
| ----------------------- | ------- | ---------------------------- |
| `data-command-viewport` | (flag)  | Viewport medible de la lista |

### Input-label

| Attr                       | Valores | Descripción            |
| -------------------------- | ------- | ---------------------- |
| `data-command-input-label` | (flag)  | Label oculta del input |

---

## Tabs

**Versión del contrato:** 1

### Root

| Attr               | Valores                    | Descripción                 |
| ------------------ | -------------------------- | --------------------------- |
| `data-tabs`        | (flag)                     | Siempre presente en el root |
| `data-orientation` | `horizontal` \| `vertical` | Orientación de las tabs     |

### Trigger

| Attr                | Valores                    | Descripción                      |
| ------------------- | -------------------------- | -------------------------------- |
| `data-tabs-trigger` | (flag)                     | Siempre presente en cada trigger |
| `data-state`        | `active` \| `inactive`     | Estado: active o inactive        |
| `data-disabled`     | (flag)                     | Presente cuando disabled=true    |
| `data-value`        | (flag)                     | Valor identificador de la tab    |
| `data-orientation`  | `horizontal` \| `vertical` | Hereda orientación del root      |

### Content

| Attr                | Valores                    | Descripción                      |
| ------------------- | -------------------------- | -------------------------------- |
| `data-tabs-content` | (flag)                     | Siempre presente en cada content |
| `data-value`        | (flag)                     | Valor identificador del content  |
| `data-state`        | `active` \| `inactive`     | Estado: active o inactive        |
| `data-orientation`  | `horizontal` \| `vertical` | Hereda orientación del root      |

---

## Calendar

**Versión del contrato:** 1

### Root

| Attr            | Valores | Descripción                   |
| --------------- | ------- | ----------------------------- |
| `data-calendar` | (flag)  | Siempre presente en el root   |
| `data-disabled` | (flag)  | Presente cuando disabled=true |
| `data-readonly` | (flag)  | Presente cuando readonly=true |

### Cell

| Attr                          | Valores                              | Descripción                                 |
| ----------------------------- | ------------------------------------ | ------------------------------------------- |
| `data-calendar-cell`          | (flag)                               | Celda individual del calendario             |
| `data-disabled`               | (flag)                               | Presente cuando la celda está deshabilitada |
| `data-readonly`               | (flag)                               | Presente cuando readonly=true               |
| `data-unavailable`            | (flag)                               | Presente cuando la fecha no está disponible |
| `data-today`                  | (flag)                               | Presente si es la fecha de hoy              |
| `data-outside-month`          | (flag)                               | Presente si es de otro mes                  |
| `data-outside-visible-months` | (flag)                               | Presente si está fuera del rango visible    |
| `data-focused`                | (flag)                               | Presente si tiene foco                      |
| `data-selected`               | (flag)                               | Presente si está seleccionada               |
| `data-value`                  | (flag)                               | Valor de la fecha (ISO string)              |
| `data-type`                   | `day` \| `week` \| `month` \| `year` | Tipo de fecha                               |

### Day

| Attr                | Valores | Descripción                 |
| ------------------- | ------- | --------------------------- |
| `data-calendar-day` | (flag)  | Celda que representa un día |

### Header

| Attr                   | Valores | Descripción              |
| ---------------------- | ------- | ------------------------ |
| `data-calendar-header` | (flag)  | Header con navegación    |
| `data-disabled`        | (flag)  | Hereda disabled del root |
| `data-readonly`        | (flag)  | Hereda readonly del root |

### Heading

| Attr                    | Valores | Descripción        |
| ----------------------- | ------- | ------------------ |
| `data-calendar-heading` | (flag)  | Título con mes/año |

---

## DatePicker

**Versión del contrato:** 1

### Root

| Attr               | Valores | Descripción                 |
| ------------------ | ------- | --------------------------- |
| `data-date-picker` | (flag)  | Siempre presente en el root |

### Trigger

| Attr                       | Valores | Descripción                  |
| -------------------------- | ------- | ---------------------------- |
| `data-date-picker-trigger` | (flag)  | Trigger que abre el calendar |

---

## DateField

**Versión del contrato:** 1

### Input

| Attr                    | Valores | Descripción                                     |
| ----------------------- | ------- | ----------------------------------------------- |
| `data-date-field-input` | (flag)  | Contenedor interactivo principal del date field |
| `data-invalid`          | (flag)  | Presente cuando el valor es inválido            |
| `data-disabled`         | (flag)  | Presente cuando disabled=true                   |

### Label

| Attr                    | Valores | Descripción                          |
| ----------------------- | ------- | ------------------------------------ |
| `data-date-field-label` | (flag)  | Label asociada al date field         |
| `data-invalid`          | (flag)  | Presente cuando el valor es inválido |
| `data-disabled`         | (flag)  | Presente cuando disabled=true        |

### Segment

| Attr                      | Valores | Descripción                                |
| ------------------------- | ------- | ------------------------------------------ |
| `data-date-field-segment` | (flag)  | Segmento editable o literal del date field |
| `data-segment`            | (flag)  | Tipo lógico de segmento                    |
| `data-invalid`            | (flag)  | Presente cuando el valor es inválido       |
| `data-disabled`           | (flag)  | Presente cuando disabled=true              |
| `data-readonly`           | (flag)  | Presente cuando el segmento no es editable |

---

## TimeField

**Versión del contrato:** 1

### Input

| Attr                    | Valores | Descripción                                     |
| ----------------------- | ------- | ----------------------------------------------- |
| `data-time-field-input` | (flag)  | Contenedor interactivo principal del time field |
| `data-invalid`          | (flag)  | Presente cuando el valor es inválido            |
| `data-disabled`         | (flag)  | Presente cuando disabled=true                   |

### Label

| Attr                    | Valores | Descripción                          |
| ----------------------- | ------- | ------------------------------------ |
| `data-time-field-label` | (flag)  | Label asociada al time field         |
| `data-invalid`          | (flag)  | Presente cuando el valor es inválido |
| `data-disabled`         | (flag)  | Presente cuando disabled=true        |

### Segment

| Attr                      | Valores | Descripción                                |
| ------------------------- | ------- | ------------------------------------------ |
| `data-time-field-segment` | (flag)  | Segmento editable o literal del time field |
| `data-segment`            | (flag)  | Tipo lógico de segmento                    |
| `data-invalid`            | (flag)  | Presente cuando el valor es inválido       |
| `data-disabled`           | (flag)  | Presente cuando disabled=true              |
| `data-readonly`           | (flag)  | Presente cuando el segmento no es editable |

---

## DateRangeField

**Versión del contrato:** 1

### Root

| Attr                    | Valores | Descripción                          |
| ----------------------- | ------- | ------------------------------------ |
| `data-date-range-field` | (flag)  | Siempre presente en el root          |
| `data-invalid`          | (flag)  | Presente cuando el rango es inválido |

### Label

| Attr                          | Valores | Descripción                          |
| ----------------------------- | ------- | ------------------------------------ |
| `data-date-range-field-label` | (flag)  | Label asociada al date range field   |
| `data-invalid`                | (flag)  | Presente cuando el rango es inválido |
| `data-disabled`               | (flag)  | Presente cuando disabled=true        |

---

## TimeRangeField

**Versión del contrato:** 1

### Root

| Attr                    | Valores | Descripción                          |
| ----------------------- | ------- | ------------------------------------ |
| `data-time-range-field` | (flag)  | Siempre presente en el root          |
| `data-invalid`          | (flag)  | Presente cuando el rango es inválido |

### Label

| Attr                          | Valores | Descripción                          |
| ----------------------------- | ------- | ------------------------------------ |
| `data-time-range-field-label` | (flag)  | Label asociada al rango horario      |
| `data-invalid`                | (flag)  | Presente cuando el rango es inválido |
| `data-disabled`               | (flag)  | Presente cuando disabled=true        |

---

## PinInput

**Versión del contrato:** 1

### Root

| Attr             | Valores | Descripción                 |
| ---------------- | ------- | --------------------------- |
| `data-pin-input` | (flag)  | Siempre presente en el root |

### Cell

| Attr                  | Valores | Descripción                            |
| --------------------- | ------- | -------------------------------------- |
| `data-pin-input-cell` | (flag)  | Celda visual individual del pin input  |
| `data-active`         | (flag)  | Presente cuando la celda está activa   |
| `data-inactive`       | (flag)  | Presente cuando la celda está inactiva |

---

## LinkPreview

**Versión del contrato:** 1

### Trigger

| Attr                        | Valores            | Descripción                      |
| --------------------------- | ------------------ | -------------------------------- |
| `data-link-preview-trigger` | (flag)             | Trigger que abre el link preview |
| `data-state`                | `open` \| `closed` | Estado: open o closed            |

### Content

| Attr                        | Valores            | Descripción                         |
| --------------------------- | ------------------ | ----------------------------------- |
| `data-link-preview-content` | (flag)             | Contenido flotante del link preview |
| `data-state`                | `open` \| `closed` | Estado: open o closed               |

---

## Progress

**Versión del contrato:** 1

### Root

| Attr            | Valores                                  | Descripción                 |
| --------------- | ---------------------------------------- | --------------------------- |
| `data-progress` | (flag)                                   | Siempre presente en el root |
| `data-value`    | (flag)                                   | Valor actual cuando existe  |
| `data-max`      | (flag)                                   | Valor maximo                |
| `data-min`      | (flag)                                   | Valor minimo                |
| `data-state`    | `indeterminate` \| `loading` \| `loaded` | Estado del progress         |

### Track

| Attr                  | Valores | Descripción    |
| --------------------- | ------- | -------------- |
| `data-progress-track` | (flag)  | Track de fondo |

### Fill

| Attr                 | Valores                       | Descripción        |
| -------------------- | ----------------------------- | ------------------ |
| `data-progress-fill` | (flag)                        | Porción completada |
| `data-state`         | `indeterminate` \| `complete` | Estado especial    |

---

## Meter

**Versión del contrato:** 1

### Root

| Attr         | Valores | Descripción                 |
| ------------ | ------- | --------------------------- |
| `data-meter` | (flag)  | Siempre presente en el root |
| `data-value` | (flag)  | Valor actual                |
| `data-max`   | (flag)  | Valor maximo                |
| `data-min`   | (flag)  | Valor minimo                |

---

## Spinner

**Versión del contrato:** 1

### Root

| Attr           | Valores | Descripción                 |
| -------------- | ------- | --------------------------- |
| `data-spinner` | (flag)  | Siempre presente en el root |
| `data-variant` | (flag)  | Variante visual del spinner |
| `data-size`    | (flag)  | Tamano del spinner          |
| `data-speed`   | (flag)  | Velocidad del spinner       |

---

## Avatar

**Versión del contrato:** 1

### Root

| Attr          | Valores                          | Descripción                  |
| ------------- | -------------------------------- | ---------------------------- |
| `data-avatar` | (flag)                           | Siempre presente en el root  |
| `data-status` | `loading` \| `loaded` \| `error` | Estado de carga de la imagen |

### Image

| Attr                | Valores                          | Descripción        |
| ------------------- | -------------------------------- | ------------------ |
| `data-avatar-image` | (flag)                           | Elemento de imagen |
| `data-status`       | `loading` \| `loaded` \| `error` | Estado de carga    |

### Fallback

| Attr                   | Valores                          | Descripción                   |
| ---------------------- | -------------------------------- | ----------------------------- |
| `data-avatar-fallback` | (flag)                           | Fallback cuando no hay imagen |
| `data-status`          | `loading` \| `loaded` \| `error` | Estado heredado               |

---

## Label

**Versión del contrato:** 1

### Root

| Attr         | Valores | Descripción                 |
| ------------ | ------- | --------------------------- |
| `data-label` | (flag)  | Siempre presente en el root |

---

## Separator

**Versión del contrato:** 1

### Root

| Attr               | Valores                    | Descripción               |
| ------------------ | -------------------------- | ------------------------- |
| `data-separator`   | (flag)                     | Siempre presente          |
| `data-orientation` | `horizontal` \| `vertical` | Orientación del separador |

---

## AspectRatio

**Versión del contrato:** 1

### Root

| Attr                | Valores | Descripción                 |
| ------------------- | ------- | --------------------------- |
| `data-aspect-ratio` | (flag)  | Siempre presente en el root |

---

## Toolbar

**Versión del contrato:** 1

### Root

| Attr               | Valores                    | Descripción                 |
| ------------------ | -------------------------- | --------------------------- |
| `data-toolbar`     | (flag)                     | Siempre presente en el root |
| `data-orientation` | `horizontal` \| `vertical` | Orientación del toolbar     |

### Group

| Attr                 | Valores                    | Descripción                            |
| -------------------- | -------------------------- | -------------------------------------- |
| `data-toolbar-group` | (flag)                     | Grupo de controles relacionados        |
| `data-orientation`   | `horizontal` \| `vertical` | Hereda orientación del root            |
| `data-disabled`      | (flag)                     | Presente cuando el grupo está disabled |

### Group-item

| Attr                      | Valores                    | Descripción                                   |
| ------------------------- | -------------------------- | --------------------------------------------- |
| `data-toolbar-item`       | (flag)                     | Ítem navegable del toolbar                    |
| `data-toolbar-group-item` | (flag)                     | Ítem toggle dentro de un grupo                |
| `data-orientation`        | `horizontal` \| `vertical` | Hereda orientación del root                   |
| `data-disabled`           | (flag)                     | Presente cuando el item o grupo está disabled |
| `data-state`              | `on` \| `off`              | Estado pressed del item                       |
| `data-value`              | (flag)                     | Valor del item dentro del grupo               |

### Button

| Attr                  | Valores                    | Descripción                            |
| --------------------- | -------------------------- | -------------------------------------- |
| `data-toolbar-item`   | (flag)                     | Ítem navegable del toolbar             |
| `data-toolbar-button` | (flag)                     | Botón estándar dentro del toolbar      |
| `data-orientation`    | `horizontal` \| `vertical` | Hereda orientación del root            |
| `data-disabled`       | (flag)                     | Presente cuando el botón está disabled |

### Link

| Attr                | Valores                    | Descripción                 |
| ------------------- | -------------------------- | --------------------------- |
| `data-toolbar-item` | (flag)                     | Ítem navegable del toolbar  |
| `data-toolbar-link` | (flag)                     | Enlace dentro del toolbar   |
| `data-orientation`  | `horizontal` \| `vertical` | Hereda orientación del root |

---

## Splitter

**Versión del contrato:** 1

### Root

| Attr               | Valores                    | Descripción                   |
| ------------------ | -------------------------- | ----------------------------- |
| `data-splitter`    | (flag)                     | Siempre presente en el root   |
| `data-orientation` | `horizontal` \| `vertical` | Orientación del splitter      |
| `data-disabled`    | (flag)                     | Presente cuando disabled=true |

### Panel

| Attr                  | Valores | Descripción                               |
| --------------------- | ------- | ----------------------------------------- |
| `data-splitter-panel` | (flag)  | Panel redimensionable                     |
| `data-panel-id`       | (flag)  | Identificador lógico del panel            |
| `data-disabled`       | (flag)  | Presente cuando el splitter está disabled |

### Resize-trigger

| Attr                           | Valores                    | Descripción                                     |
| ------------------------------ | -------------------------- | ----------------------------------------------- |
| `data-splitter-resize-trigger` | (flag)                     | Handle para redimensionar entre paneles         |
| `data-orientation`             | `horizontal` \| `vertical` | Orientación del handle                          |
| `data-disabled`                | (flag)                     | Presente cuando el handle está disabled         |
| `data-dragging`                | (flag)                     | Presente mientras el usuario arrastra el handle |

---

## ScrollArea

**Versión del contrato:** 1

### Root

| Attr               | Valores | Descripción                 |
| ------------------ | ------- | --------------------------- |
| `data-scroll-area` | (flag)  | Siempre presente en el root |

### Viewport

| Attr                        | Valores | Descripción     |
| --------------------------- | ------- | --------------- |
| `data-scroll-area-viewport` | (flag)  | Área con scroll |

### Content

| Attr                       | Valores | Descripción                                  |
| -------------------------- | ------- | -------------------------------------------- |
| `data-scroll-area-content` | (flag)  | Contenedor interno del contenido desplazable |

### Scrollbar

| Attr                         | Valores                    | Descripción                 |
| ---------------------------- | -------------------------- | --------------------------- |
| `data-scroll-area-scrollbar` | (flag)                     | Scrollbar personalizada     |
| `data-orientation`           | `horizontal` \| `vertical` | Orientación de la scrollbar |
| `data-state`                 | `visible` \| `hidden`      | Visibilidad de la scrollbar |

### Thumb

| Attr                     | Valores               | Descripción           |
| ------------------------ | --------------------- | --------------------- |
| `data-scroll-area-thumb` | (flag)                | Thumb de la scrollbar |
| `data-state`             | `visible` \| `hidden` | Visibilidad del thumb |

### Corner

| Attr                      | Valores | Descripción              |
| ------------------------- | ------- | ------------------------ |
| `data-scroll-area-corner` | (flag)  | Esquina entre scrollbars |

---

## Pagination

**Versión del contrato:** 1

### Root

| Attr               | Valores                    | Descripción                  |
| ------------------ | -------------------------- | ---------------------------- |
| `data-pagination`  | (flag)                     | Siempre presente en el root  |
| `data-orientation` | `horizontal` \| `vertical` | Orientación de la paginación |

### Page

| Attr                   | Valores | Descripción                                 |
| ---------------------- | ------- | ------------------------------------------- |
| `data-pagination-page` | (flag)  | Botón de página individual                  |
| `data-selected`        | (flag)  | Presente cuando la página está seleccionada |
| `data-page`            | (flag)  | Número de página asociado                   |

### Prev-button

| Attr                          | Valores | Descripción                                  |
| ----------------------------- | ------- | -------------------------------------------- |
| `data-pagination-prev-button` | (flag)  | Botón para ir a la página anterior           |
| `data-disabled`               | (flag)  | Presente cuando no puede navegar hacia atrás |

### Next-button

| Attr                          | Valores | Descripción                                    |
| ----------------------------- | ------- | ---------------------------------------------- |
| `data-pagination-next-button` | (flag)  | Botón para ir a la página siguiente            |
| `data-disabled`               | (flag)  | Presente cuando no puede navegar hacia delante |

---

## RatingGroup

**Versión del contrato:** 1

### Root

| Attr                | Valores                    | Descripción                   |
| ------------------- | -------------------------- | ----------------------------- |
| `data-rating-group` | (flag)                     | Siempre presente en el root   |
| `data-disabled`     | (flag)                     | Presente cuando disabled=true |
| `data-readonly`     | (flag)                     | Presente cuando readonly=true |
| `data-orientation`  | `horizontal` \| `vertical` | Orientación del rating        |

### Item

| Attr                     | Valores                             | Descripción                      |
| ------------------------ | ----------------------------------- | -------------------------------- |
| `data-rating-group-item` | (flag)                              | Cada item de rating              |
| `data-state`             | `active` \| `partial` \| `inactive` | Estado del item                  |
| `data-disabled`          | (flag)                              | Hereda disabled del root         |
| `data-readonly`          | (flag)                              | Hereda readonly del root         |
| `data-orientation`       | `horizontal` \| `vertical`          | Hereda orientación del root      |
| `data-value`             | (flag)                              | Índice visual del item (1-based) |

---

## ColorPicker

**Versión del contrato:** 1

### Trigger

| Attr                        | Valores | Descripción                            |
| --------------------------- | ------- | -------------------------------------- |
| `data-color-picker-trigger` | (flag)  | Boton disparador del selector de color |
| `data-disabled`             | (flag)  | Presente cuando disabled=true          |

### Content

| Attr                        | Valores | Descripción                           |
| --------------------------- | ------- | ------------------------------------- |
| `data-color-picker-content` | (flag)  | Panel principal del selector de color |

### Area

| Attr                     | Valores | Descripción                 |
| ------------------------ | ------- | --------------------------- |
| `data-color-picker-area` | (flag)  | Area de saturacion y brillo |

### Area-thumb

| Attr                           | Valores | Descripción                       |
| ------------------------------ | ------- | --------------------------------- |
| `data-color-picker-area-thumb` | (flag)  | Thumb de posicion dentro del area |

### Hue-slider

| Attr                           | Valores | Descripción             |
| ------------------------------ | ------- | ----------------------- |
| `data-color-picker-hue-slider` | (flag)  | Slider de hue del color |

### Alpha-slider

| Attr                             | Valores | Descripción               |
| -------------------------------- | ------- | ------------------------- |
| `data-color-picker-alpha-slider` | (flag)  | Slider de alpha del color |

### Input

| Attr                      | Valores | Descripción                |
| ------------------------- | ------- | -------------------------- |
| `data-color-picker-input` | (flag)  | Input de edicion del color |

### Swatches

| Attr                         | Valores | Descripción                         |
| ---------------------------- | ------- | ----------------------------------- |
| `data-color-picker-swatches` | (flag)  | Contenedor de muestras predefinidas |

### Swatch

| Attr                       | Valores | Descripción                                  |
| -------------------------- | ------- | -------------------------------------------- |
| `data-color-picker-swatch` | (flag)  | Muestra individual seleccionable             |
| `data-selected`            | (flag)  | Presente cuando la muestra esta seleccionada |

### Eyedropper

| Attr                           | Valores | Descripción                                |
| ------------------------------ | ------- | ------------------------------------------ |
| `data-color-picker-eyedropper` | (flag)  | Boton para abrir el eyedropper del sistema |

---

## Toast

**Versión del contrato:** 1

### Root

| Attr         | Valores                                                  | Descripción                 |
| ------------ | -------------------------------------------------------- | --------------------------- |
| `data-toast` | (flag)                                                   | Siempre presente en el root |
| `data-state` | `open` \| `closed`                                       | Estado del toast            |
| `data-type`  | `default` \| `success` \| `error` \| `warning` \| `info` | Tipo de toast               |

---

## FileUpload

**Versión del contrato:** 1

### Root

| Attr               | Valores | Descripción                   |
| ------------------ | ------- | ----------------------------- |
| `data-file-upload` | (flag)  | Siempre presente en el root   |
| `data-disabled`    | (flag)  | Presente cuando disabled=true |

### Dropzone

| Attr                        | Valores | Descripción                  |
| --------------------------- | ------- | ---------------------------- |
| `data-file-upload-dropzone` | (flag)  | Zona de drag & drop          |
| `data-disabled`             | (flag)  | Hereda disabled del root     |
| `data-dragging`             | (flag)  | Presente durante drag activo |

### File-list

| Attr                         | Valores | Descripción       |
| ---------------------------- | ------- | ----------------- |
| `data-file-upload-file-list` | (flag)  | Lista de archivos |

### Item

| Attr                    | Valores | Descripción                 |
| ----------------------- | ------- | --------------------------- |
| `data-file-upload-item` | (flag)  | Item de archivo             |
| `data-file-name`        | (flag)  | Nombre del archivo asociado |

### Item-name

| Attr                         | Valores | Descripción                |
| ---------------------------- | ------- | -------------------------- |
| `data-file-upload-item-name` | (flag)  | Nombre visible del archivo |

### Item-size

| Attr                         | Valores | Descripción                   |
| ---------------------------- | ------- | ----------------------------- |
| `data-file-upload-item-size` | (flag)  | Tamano formateado del archivo |

### Item-remove

| Attr                           | Valores | Descripción                  |
| ------------------------------ | ------- | ---------------------------- |
| `data-file-upload-item-remove` | (flag)  | Accion para eliminar archivo |

### Item-progress

| Attr                             | Valores | Descripción                 |
| -------------------------------- | ------- | --------------------------- |
| `data-file-upload-item-progress` | (flag)  | Indicador/barra de progreso |

---