co-color-picker

Selector de color basado en presets. El disparador muestra la muestra actual junto al valor hex y abre un popover con una cuadrícula de colores predefinidos. El valor hex es de solo lectura (sin edición manual) e incluye un botón para copiarlo al portapapeles.

Demo

Ver código

<co-color-picker label="Color" value="#0066FF"></co-color-picker>

API

Props

Prop	Atributo	Tipo	Default	Descripción
disabled	disabled	boolean	false	Disable the field.
helperText	helper-text	string | undefined	—	Helper/error text below the field.
label	label	string | undefined	—	Field label.
layout	layout	"horizontal" | "vertical"	'vertical'	Label layout: vertical (label above) or horizontal (label beside)
name	name	string | undefined	—	Field name for form submission.
placeholder	placeholder	string	'Select color'	Placeholder text when no color is selected.
presets	presets	ColorPreset[] | string | string[]	''	Preset colors as a JSON stringified array of `{ name, value }` objects or plain hex strings. When set programmatically, accepts an actual array.
required	required	boolean	false	Show required indicator.
size	size	"lg" | "md" | "s" | "sm"	'md'	Field size (mirrors co-input): s 28 / sm 32 / md 40 / lg 48.
status	status	"default" | "error" | "success" | "warning"	'default'	Validation status.
value	value	string	''	Current color value as hex string (e.g. "#0066FF").

Eventos

Evento	Detail	Bubbles	Cancelable	Descripción
coChange	string	✓	✓	Emits the selected hex color on change.

Slots

Este componente no expone slots.

CSS Parts

Este componente no expone CSS parts.

CSS Custom Properties

Este componente no expone CSS custom properties.