ColorArea

The props declared for ColorArea, generated from the types @proyecto-viviana/ui ships.

Import

import { ColorArea } from "@proyecto-viviana/ui";

Props

Props for ColorArea in @proyecto-viviana/ui
Prop	Type	Default	Description
`styles`	StylesPropWithHeight	—	Spectrum-defined generated classes.
`UNSAFE_className`	string \| UnsafeClassName	—	Additional CSS class name. Use only as a last resort.
`UNSAFE_style`	JSX.CSSProperties	—	Additional inline styles. Use only as a last resort.
`slot`	string \| false	—	A slot name for the component. HTML `slot` may be `false` to omit. solidaria-components
`id`	string	—	Element id for the color area. solidaria
`onChange`	(color: Color) => void	—	Handler called when the color changes. solidaria-components
`aria-describedby`	string	—	ID of element that describes the area. solidaria
`aria-details`	string	—	ID of element that provides detailed information about the area. solidaria
`aria-label`	string	—	Accessible label for the area. solidaria
`aria-labelledby`	string	—	ID of element that labels the area. solidaria
`isDisabled`	false \| true	—	Whether the area is disabled. solidaria
`form`	string	—	Associated form owner for the hidden range inputs. solidaria
`value`	string \| Color	—	The current color value (controlled). solidaria-components
`defaultValue`	string \| Color	—	The default color value (uncontrolled). solidaria-components
`onChangeEnd`	(color: Color) => void	—	Handler called when dragging ends. solidaria-components
`xChannel`	'red' \| 'green' \| 'blue' \| 'hue' \| 'saturation' \| 'brightness' \| 'lightness' \| 'alpha'	—	The X channel to control. solidaria-components
`yChannel`	'red' \| 'green' \| 'blue' \| 'hue' \| 'saturation' \| 'brightness' \| 'lightness' \| 'alpha'	—	The Y channel to control. solidaria-components
`colorSpace`	'rgb' \| 'hsl' \| 'hsb'	—	Color space to use for channel axes. solidaria
`xName`	string	—	Name for the hidden X-axis range input. solidaria
`yName`	string	—	Name for the hidden Y-axis range input. solidaria
`inputXRef`	Accessor<HTMLInputElement \| null \| undefined>	—	A ref to the input that represents the x axis of the color area. solidaria
`inputYRef`	Accessor<HTMLInputElement \| null \| undefined>	—	A ref to the input that represents the y axis of the color area. solidaria

Declared in packages/viviana-ui/src/color/index.tsx.

Props marked solidaria or solidaria-components come from the headless layer underneath and behave the same in both registers. Components that wrap a DOM element also accept that element's standard attributes, which are left out here on purpose — listing them would bury the props that are actually ours.