FlatColorPickerProps
Represents the properties of FlatColorPicker component.
Definition
Package:@progress/kendo-react-inputs
Properties
Sets the initially active view when both 'gradient' and 'palette' views are rendered.
Use with the views property.
'gradient'
ariaLabel?
string
Represents the label of the FlatColorPicker component.
ariaLabelledBy?
string
Identifies the element(s) which will label the component.
className?
string
Sets additional classes to the FlatColorPicker.
defaultValue?
string
Sets the default color value.
disabled?
boolean
Determines whether the FlatColorPicker is disabled.
format?
"rgba" | "hex" | "rgb"
Sets the default input format in the gradient input editor.
'rgb'
header?
ReactNode | ComponentType<object>
Sets custom header component.
id?
string
Sets the id property of the top div element of the FlatColorPicker.
onChange?
(event: FlatColorPickerChangeEvent) => void
The event handler that will be fired when the user click the "Apply" button or on blur when the "Apply" button is not present.
onPreviewChange?
(event: FlatColorPickerChangeEvent) => void
The event handler that will be fired when the user changes the preview color.
opacity?
boolean
Specifies whether we should display the opacity slider to allow selection of transparency.
true
showButtons?
boolean
Specifies whether action buttons will be rendered in the footer.
showClearButton?
boolean
Specifies whether clear button will be rendered in the header.
showPreview?
boolean
Specifies whether preview and revert color boxes will be rendered in the header.
size?
"small" | "medium" | "large"
Configures the size of the FlatColorPicker.
The available options are:
smallmediumlargenull—This option removes the the built-in size styles of the FlatColorPicker. Allows for custompadding.
medium
style?
CSSProperties
Sets additional CSS styles to the FlatColorPicker.
tabIndex?
number
Sets the tabIndex property of the FlatColorPicker.
value?
string
Sets the color value.
view?
"ColorGradient" | "ColorPalette"
Deprecated. Use views prop instead.
Specifies the views that will be rendered. By default both the gradient and palette views will be rendered.
['gradient', 'palette']