← Todos los specs UI

Contrato del componente

loader

Indicador de carga indeterminada construido a partir del path del logo — dos mitades espejo oscilan alrededor del centro del anillo.

Versión
v1.0.0

Props

NombreTipoValoresPredeterminado
sizeenumsm, md, lgmd
labelstringLoading
speedenumslow, normal, fastnormal

Accesibilidad

category
static-display
native_element
span (custom element host)
role
status
labeling
aria-label (from `label` prop, default 'Loading')
reduced_motion
collapses swing rotation to a static opacity pulse (2s ease-in-out); no rotation, no translation
notes
Indeterminate progress indicator — no APG pattern applies (not a `progressbar`). Inner SVG is aria-hidden; host is the accessibility surface. Stroke inherits `currentColor`; consumers verify ≥ 3:1 non-text contrast (WCAG 1.4.11) against the surface.
JSON validado original
{
  "name": "loader",
  "version": "1.0.0",
  "props": {
    "size": {
      "type": "enum",
      "values": [
        "sm",
        "md",
        "lg"
      ],
      "default": "md"
    },
    "label": {
      "type": "string",
      "default": "Loading"
    },
    "speed": {
      "type": "enum",
      "values": [
        "slow",
        "normal",
        "fast"
      ],
      "default": "normal"
    }
  },
  "a11y": {
    "category": "static-display",
    "native_element": "span (custom element host)",
    "role": "status",
    "labeling": "aria-label (from `label` prop, default 'Loading')",
    "reduced_motion": "collapses swing rotation to a static opacity pulse (2s ease-in-out); no rotation, no translation",
    "notes": "Indeterminate progress indicator — no APG pattern applies (not a `progressbar`). Inner SVG is aria-hidden; host is the accessibility surface. Stroke inherits `currentColor`; consumers verify ≥ 3:1 non-text contrast (WCAG 1.4.11) against the surface."
  }
}