Adds colorPalette service #1209
Conversation
| <p> | ||
| Generate a custom palette of any length from two hexidecimal color | ||
| codes such as | ||
| <EuiCode>colorPalette('custom', 'FF0000', '#00FFFF', 25)</EuiCode>. |
There was a problem hiding this comment.
Does this service need the hash mark for hex colors? I see you have it both ways here, just wondering if that's a typo or if the service accepts both.
There was a problem hiding this comment.
Also, instead of having to pass 'custom' as the first value, can we make the service smart enough to recognize if the first param is a named palette or a color?
There was a problem hiding this comment.
You can pass it with or without the # so I was just demonstrating that in the examples... then copy/paste happened and it's now in all three examples :D . I'll look into the latter suggestion, I set that aside initially and didn't return to it.
ryankeairns
force-pushed
the
rk/eui-color-palettes
branch
from
1c451da to
f45931f
Compare
ryankeairns
changed the title
|
There is a known console warning (repeating 6x) that originates from the chart example. Several EUI chart components validate the color code against the viz color palette. @cchaos mentioned she removed this PropType, but I've rebased against master and still see the warning. I might have misunderstood, but either way, feedback on resolving that warning would be welcome as it might result in us removing that validation check (if it hasn't been already) or doing something else like validating based upon a provided palette ('path to file' feels kinda messy), or simply validating against the
|
ryankeairns
force-pushed
the
rk/eui-color-palettes
branch
from
f45931f to
b3783db
Compare
There was a problem hiding this comment.
I gave comments during our weekly. They were mostly docs related.
- The docs should provide guidelines and palettes for what we consider good "qualitative" and "quantitative" palettes. The only palettes in the docs should be ones we're comfortable with devs using for visualizations. Any of the other examples should be removed so that people don't use them. We should describe the palettes by saying "This is a good qualitative palette for health measurement", "This is a good one for...", ...etc.
- The EUI palette needs to show "EUI Light" and "EUI Dark", which are just mirrors of our sass ones. Currently "EUI light" in this iterative is a slant of what we already provide and is safe to remove.
That's my bad, I didn't realize that the color props were also expecting only one of the Vis colors. What I was referring to was removing this warning: https://github.com/elastic/eui/pull/1198/files#diff-1107a4e514bdba21c291b3d986be0217 I think it's safe to change those prop types to string, unless there's a better way to restrict to a color of hex type. |
|
Updates:
|
ryankeairns
force-pushed
the
rk/eui-color-palettes
branch
from
f609e93 to
3748c9f
Compare
There was a problem hiding this comment.
Did a more thorough code review. Can't wait to use this stuff. My comments are pretty trivial and mostly deal with presentation.
Basically I'd think of this page less as "here's a way to build palettes" and more "this is what palettes design has said are good to use".
ryankeairns
force-pushed
the
rk/eui-color-palettes
branch
from
4e2fb2a to
28bc100
Compare
Summary
Adds a service that accepts a palette name and returns an array of hexidecimal color codes for use in other EUI components such as charts.
You can either...
a) pull a palette by name from the eui_palettes file,
b) provide your own palettes file, or
c) use the "custom" palette name along with two hex color codes and a number of stops for a gradiated array of hex color codes.
Checklist
Any props added have proper autodocs- No props since it's a service, but documented codeThis was checked against keyboard-only and screenreader scenarios- There is no UI as this is a service/function.