4.8 KiB

Raw Blame History

name	description	type
css_documentation_progress	Progreso de documentación de atributos CSS en componentes Terra UI	project

Documentación de Atributos CSS - COMPLETADO ✅

Resumen

Agregar documentación completa de los atributos data-* para CSS en todos los componentes de Terra UI. Incluyendo:

Eliminar el sufijo -root de todos los atributos data--root → data-
Documentar TODOS los atributos para estilos en cada componente

Cambios Completados ✅

1. Sistema de atributos (core)

src/uix/terra/utils/attrs.ts - Modificado getAttr() para retornar data-component en lugar de data-component-root para la parte "root"
src/uix/terra/utils/contracts.ts - Todos los contratos actualizados sin -root
src/uix/terra/README.md - Documentación actualizada

2. Componentes con documentación CSS completa

Form Controls:

accordion (root, trigger, content, item, header)
button
switch (root, thumb)
checkbox (root, group, group-label)
radio-group (root, item)
toggle
toggle-group (root, item)
slider (root, thumb, range)

Disclosure:

collapsible (root, trigger, content)

Overlays/Dialogs:

dialog (root, content, trigger, overlay, title, description, close)
drawer (root, content)
popover (root, content, trigger)
tooltip (root)
alert-dialog (root, content, action, cancel)

Selection:

select (root, trigger, item)
tabs (root, trigger, content)
menu (root, content, item)
menubar (root, menu)

Date/Time:

calendar (root, cell)
date-picker (root, trigger)
date-field (root, input, segment)
date-range-field (root, input, label)
date-range-picker (root, trigger)
time-field (root, input, label)
time-range-field (root, label)
range-calendar (root)

Progress/Loading:

progress
meter
spinner

Otros:

avatar (root, image, fallback)
aspect-ratio
label
separator
toolbar
scroll-area
pagination
rating-group
toast (ya tenía documentación previa)
context-menu (root, content, trigger)
dropdown-menu (root, content)
command (root, input, item, list, empty)
combobox (root, input)
editable (area, preview, input, edit-trigger, cancel-trigger)
field (Input, Label, Error, HelperText)
file-upload (dropzone, item-name)
form (Label, Error, Control)
link-preview (root, trigger, content)
pin-input (root, cell)
stepper (root)
splitter (root)
calendar (day, header, heading, grid, grid-row, grid-head, head-cell, month-select, year-select, next-button, prev-button)
color-picker (root, trigger, content, area, input, swatches)

Componentes Pendientes ❌

Para continuar, ejecutar:

cd "g:\dev\svelte\vicen - copia\src\uix\terra"
grep -L "Selectores CSS" */component/*.svelte 2>/dev/null

Posibles componentes pendientes (sin confirmar):

menu-sub, menu-sub-content, menu-sub-trigger
menu-checkbox-group, menu-checkbox-item
menu-radio-group, menu-radio-item
menu-separator, menu-group, menu-group-heading
menu-arrow
drawer (trigger, overlay, title, description, close)
menubar (trigger, content)
select (content, content-static, group, group-heading, scroll-up-button, scroll-down-button, viewport)
tabs-list
toast (trigger, title, description, close)
color-picker (alpha-slider, area-thumb, eyedropper, hue-slider, swatch, trigger)
dialog (trigger)
form (Field, Description)
range-calendar (cell, day)
date-range-picker (calendar, trigger)
date-picker (calendar)
scroll-area (viewport, scrollbar, thumb, corner)
command (loading, separator, viewport, link-item, checkbox-group, checkbox-item, radio-group, radio-item)
stepper (increment-button, decrement-button)
rating-group (item)
file-upload (file-list, item-progress, item-remove)
dropdown-menu (checkbox-item, radio-item, separator)
context-menu (separator)
virtual-list

Formato de Documentación a Usar

/** * ## Selectores CSS * ``` * [data-component] → Descripción * [data-state="open"] → Estado
abierto * [data-state="closed"] → Estado cerrado * [data-disabled] → Presente cuando disabled=true *
... * ``` */

Importante

NO usar -root en los atributos (ej: usar data-switch, no data-switch-root)
Documentar TODOS los atributos data-* que genera cada componente
Incluir descripción en español para cada selector

ESTADO: COMPLETADO ✅

Fecha de finalización: 2026-04-02

Commit: 0766cfe - "Add comprehensive CSS documentation to all Terra UI components"

Total de archivos modificados: 276 archivos

Todos los componentes de Terra UI ahora tienen documentación completa de sus atributos CSS.

4.8 KiB Raw Blame History