/v1.0

ReadOnlyColorPaletteField

ReadOnlyColorPaletteField renderiza una paleta de múltiples valores de color como salida no editable. Cada color se muestra como una muestra, siendo adecuado para mostrar paletas de tema, variantes de color de productos o cualquier atributo de múltiples colores en pantallas de detalle y visualización.

Props

| Prop | Tipo | Requerido | Por defecto | Descripción | |------|------|-----------|-------------|-------------| | value | string[] | Sí | — | Array de strings de color a mostrar (ej. ["#ff5722", "#1565c0"]). | | label | string | No | — | Etiqueta mostrada encima de la paleta. | | 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 de la paleta. | | 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 ReadOnlyColorPaletteField from '@/components/read-only-fields/ReadOnlyColorPaletteField';

<ReadOnlyColorPaletteField
  label="Colores del tema"
  value={['#1565c0', '#e53935', '#43a047']}
/>

Con descripción

<ReadOnlyColorPaletteField
  label="Variantes disponibles"
  value={product.colors}
  description="Colores en los que está disponible este producto."
/>