uiwjs
React Color Editable Input HSLA
EditableInputHSLA Component is a subcomponent of @react-color.
Install
npm i @uiw/react-color-editable-input-hslaUsage
```jsx mdx:preview import React, { useState } from 'react'; import { hsvaToHex } from '@uiw/color-convert'; import EditableInputHSLA from '@uiw/react-color-editable-input-hsla';
export default function Demo() { const [hsva, setHsva] = useState({ h: 209, s: 36, v: 90, a: 1 }); return (
<EditableInputHSLA
hsva={hsva}
onChange={(color) => {
setHsva({ ...hsva, ...color.hsva });
}}
/>
);
}
## Props
```ts
import React from 'react';
import { EditableInputRGBAProps } from '@uiw/react-color-editable-input-rgba';
export interface EditableInputHSLAProps extends Omit<EditableInputRGBAProps, 'rProps' | 'gProps' | 'bProps'> {
hProps?: EditableInputRGBAProps['gProps'];
sProps?: EditableInputRGBAProps['gProps'];
lProps?: EditableInputRGBAProps['gProps'];
aProps?: false | EditableInputRGBAProps['aProps'];
}
declare const EditableInputHSLA: React.ForwardRefExoticComponent<EditableInputHSLAProps & React.RefAttributes<HTMLDivElement>>;
export default EditableInputHSLA;Contributors
As always, thanks to our amazing contributors!
Made with contributors.
License
Licensed under the MIT License.