ColorSlider

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

Import

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

Props

Props for ColorSlider in @proyecto-viviana/ui
Prop	Type	Default	Description
`styles`	StylesProp	—	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.
`class`	string	—	Backward-compatible class alias. Prefer UNSAFE_className for S2 parity.
`size`	'sm' \| 'md' \| 'lg'	—	Deprecated legacy size prop. ColorSlider uses the Spectrum 2 fixed track size.
`showValue`	false \| true	—	Deprecated legacy value visibility prop. Spectrum 2 shows horizontal output.
`contextualHelp`	number \| boolean \| RenderedElement \| ArrayElement \| (string & {}) \| Node \| JSX.ArrayElement	—	Contextual help shown next to the visible label.
`slot`	string \| false	—	A slot name for the component. HTML `slot` may be `false` to omit. solidaria-components
`id`	string	—	Element id for the slider track group. solidaria
`onChange`	(color: Color) => void	—	Handler called when the color changes. solidaria-components
`aria-describedby`	string	—	ID of element that describes the slider. solidaria
`aria-details`	string	—	ID of element that provides detailed information about the slider. solidaria
`aria-label`	string	—	Accessible label for the slider. solidaria
`aria-labelledby`	string	—	ID of element that labels the slider. solidaria
`isDisabled`	false \| true	—	Whether the slider is disabled. solidaria
`form`	string	—	Associated form owner for the hidden range input. solidaria
`name`	string	—	Name for the hidden range input. solidaria
`value`	string \| Color	—	The current color value (controlled). solidaria-components
`orientation`	'horizontal' \| 'vertical'	—	The slider orientation. solidaria
`label`	number \| boolean \| RenderedElement \| ArrayElement \| (string & {}) \| Node \| JSX.ArrayElement	—	A visible label for the slider. solidaria-components
`defaultValue`	string \| Color	—	The default color value (uncontrolled). solidaria-components
`onChangeEnd`	(color: Color) => void	—	Handler called when dragging ends. solidaria-components
`colorSpace`	'rgb' \| 'hsl' \| 'hsb'	—	Color space used for channel values. solidaria-components
`channel`*	'red' \| 'green' \| 'blue' \| 'hue' \| 'saturation' \| 'brightness' \| 'lightness' \| 'alpha'	—	The color channel to control. solidaria-components
`channelName`	string	—	Localized channel name. 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.