Package Exports
- @uiw/react-color
- @uiw/react-color/cjs/index.js
- @uiw/react-color/esm/index.js
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@uiw/react-color) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
react-color is a tiny color picker widget component for React apps. These components can be installed and used separately.
Getting Started
npm i @uiw/react-color
import { Slider, Sketch, Material, Colorful, Compact, Circle, Wheel, Block, Github, Chrome } from '@uiw/react-color';
import { Alpha, Hue, ShadeSlider, Saturation, Interactive, hsvaToHslaString } from '@uiw/react-color';
import { EditableInput, EditableInputRGBA, EditableInputHSLA } from '@uiw/react-color';
function Demo() {
const [hex, setHex] = useState("#fff");
return (
<Sketch
style={{ marginLeft: 20 }}
color={hex}
onChange={(color) => {
setHex(color.hex);
}}
/>
);
}Packages
Base Components
Development
npm install # Installation dependencies
npm run build # Compile all packagecd packages/color-block
# listen to the component compile and output the .js file
# listen for compilation output type .d.ts file
npm run watch # Monitor the compiled package `@uiw/react-block`npm run start # development mode, listen to compile preview website instanceLicense
Licensed under the MIT License.