/v1.0

ReadOnlyColorField

ReadOnlyColorField renderiza un valor de color como salida no editable. Típicamente muestra una muestra de color junto al código del color (ej. un string hexadecimal), siendo adecuado para mostrar colores de marca, etiquetas de categorías o cualquier atributo con código de color en pantallas de detalle y visualización.

Props

| Prop | Tipo | Requerido | Por defecto | Descripción | |------|------|-----------|-------------|-------------| | value | string | Sí | — | El valor de color a mostrar (ej. "#ff5722", "rgb(255,87,34)"). | | label | string | No | — | Etiqueta mostrada encima del campo. | | description | string | No | — | Texto de ayuda mostrado debajo del campo en cursiva. | | containerStyle | React.CSSProperties | No | — | Estilos personalizados para el div contenedor externo. | | valueStyle | React.CSSProperties | No | — | Estilos personalizados para el área de visualización del valor. | | labelStyle | React.CSSProperties | No | — | Estilos personalizados para el elemento de etiqueta. | | descriptionStyle | React.CSSProperties | No | — | Estilos personalizados para el texto de descripción. |

Uso

Básico

import ReadOnlyColorField from '@/components/read-only-fields/ReadOnlyColorField';

<ReadOnlyColorField
  label="Color de marca"
  value="#ff5722"
/>

Con descripción

<ReadOnlyColorField
  label="Color de categoría"
  value="#1565c0"
  description="Color utilizado para identificar esta categoría en los listados."
/>