elrumordelaluz / coloreact Goto Github PK
View Code? Open in Web Editor NEWA tiny Color Picker for React
Home Page: https://elrumordelaluz.github.io/coloreact/
License: MIT License
A tiny Color Picker for React
Home Page: https://elrumordelaluz.github.io/coloreact/
License: MIT License
Lines 46 to 48 in 283367f
Because we get npm errors ๐ค
https://github.blog/2021-02-02-npm-7-is-now-generally-available/#peer-dependencies
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: my-project
npm ERR! Found: [email protected]
npm ERR! node_modules/react
npm ERR! react@"~17.0.2" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^15.6.1 || ^16.0.0" from [email protected]
npm ERR! node_modules/coloreact
npm ERR! coloreact@"~0.3.1" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
See:
Hi, I am using your component, and I found an issue in ColorPicker class on this function:
output () {
const c = tinycolor(this.state.color);
return {
hsl: c.toHsl(),
hex: c.toHex(),
hexString: c.toHexString(),
rgb: c.toRgb(),
rgbString: c.toRgbString(),
}
return c;
}
Could you please, remove the second return, so I can use it alongside TypeScript?
Thank you.
Hey mate,
I'm trying to install this via NPM but it seems the /lib folder is missing.
Your package.json references "main": "lib/index.js",
but when viewing the installed folder within node_modules/coloreact
only docs, examples, node_modules and src are present.
Hey.
I stumbled across your project and noticed that it is a derivative of my color picker for react, which itself was a derivative of this other colorpicker for react.
In case you weren't aware, the MIT license - which both of those projects are licensed under - requires that you preserve the original copyright notice. You are free to fork, modify etc the code subject to that one condition.
As such, it would be cool if you could add appropriate attribution to @stayradiated and myself. Not sure whether the ISC license (which you list in package.json) is compatible with MIT, so you may want to investigate that or revert simply back to MIT.
The default hue slider is currently looking like this (rough discrete overview):
Red
Orange
Yellow
Green
Light Blue
Blue
Purple
Pink
Red
If you bring up the demo and move the hue slider to the green section, the main panel is in shades of blue.
Red
Orange
Yellow
Green <--- Move slider cursor here
Light Blue
Blue <--- Color of the panel
Purple
Pink
Red
If you move the hue slider to the blue section, the main panel is in shades of green.
Red
Orange
Yellow
Green <--- Color of the panel
Light Blue
Blue <--- Move slider cursor here
Purple
Pink
Red
As you go further up or down the hue slider, the main panel color is actually the mirror color of what you actually select on the hue slider, as though the vertical color spectrum has been flipped.
Hi,
I wanted to send a pull request for #6. But I can't get coloreact to build.
npm install
npm run start
I get the following error:ERROR in bundle.js from UglifyJs
Unexpected token: name (urlParts) [bundle.js:4622,4]
webpack: Failed to compile.
I tried with nodejs
version 8
, 10
, and 12
, without luck. Can anyone reproduce the issue?
Hi guys,
Can we move the opacity slider to the same place where the hue slider is?
Hi there, thanks for sharing this. I love this package, because it allows me to customize every bit quite easily.
There is one thing I've noticed for the default Hue Pickers: The yellow sections is rather small, so it's difficult to pick a pure yellow.
The current Slider uses this:
#FF0000 0%,
#FF0099 10%,
#CD00FF 20%,
#3200FF 30%,
#0066FF 40%,
#00FFFD 50%,
#00FF66 60%,
#35FF00 70%,
#CDFF00 80%,
#FF9900 90%,
#FF0000 100%
I think these values work a little nicer (taken from here: https://github.com/casesandberg/react-color/blob/master/src/components/common/Hue.js)
#f00 0%,
#ff0 17%,
#0f0 33%,
#0ff 50%,
#00f 67%,
#f0f 83%,
#f00 100%
I'd suggest using those for the default pickers.
Cheers! :-)
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.