@palette/color-picker
Advanced tools
Comparing version
{ | ||
"name": "@palette/color-picker", | ||
"version": "0.1.2", | ||
"version": "0.1.3", | ||
"description": "", | ||
@@ -5,0 +5,0 @@ "main": "lib/index.js", |
@@ -1,10 +0,9 @@ | ||
<div align="center"> | ||
<span style="font-size:72px;line-height:1;">🎨</span> | ||
<br> | ||
<h3>@palette/color-picker</h3> | ||
<p>A hackable React color picker that exposes all the right things</p> | ||
<br> | ||
</div> | ||
# 🎨 @palette/color-picker | ||
A hackable React color picker that exposes all the right things | ||
--- | ||
### Why another color picker? | ||
@@ -39,7 +38,10 @@ | ||
--- | ||
## Component Configuration with Props | ||
#### `showInspector` | ||
| Type | Required? | Default | | ||
|:----: | :-------: | :-------: | | ||
| Type | Required? | Default | | ||
| ------- | :-------: | :-------: | | ||
| `string` | **YES** | `red` | | ||
The initial rendered color for your component & the only required | ||
@@ -50,16 +52,17 @@ Should be a string containing a valid color (rgb(a), hex(8), hsl(a), hsv) | ||
#### `modes` | ||
| Type | Required? | Default | | ||
|:----: | :-------: | :-------: | | ||
| `array` | N | `['hex', 'hex8', 'rgb', 'hsl']` | | ||
| Type | Required? | Default | | ||
| ------ | :-------: | :-------: | | ||
| `array` | N | `['hex', 'hex8', 'rgb', 'hsl']` | | ||
An array of color formats to accept | ||
#### `mode` | ||
| Type | Required? | Default | | ||
|:----: | :-------: | :-------: | | ||
| `string` | N | color mode of `defaultValue` | | ||
| Type | Required? | Default | | ||
| ------ | :-------: | :-------: | | ||
| `string` | N | color mode of `defaultValue` | | ||
The mode with which to initialize the picker. | ||
#### `update` | ||
| Type | Required? | Default | | ||
|:----: | :-------: | :-------: | | ||
| Type | Required? | Default | | ||
| --------------- | :-------: | :-------: | | ||
| `function(evt)` | N | none | | ||
@@ -71,10 +74,10 @@ | ||
<br /> | ||
--- | ||
<br /> | ||
### Subcomponent Configuration with Props | ||
#### `showInspector` | ||
| Type | Required? | Default | | ||
|:----: | :-------: | :-------: | | ||
|------ | :-------: | :-------: | | ||
| `bool` | N | true | | ||
Chooses whether to show the Color Inspector (eyedropper) subcomponent | ||
@@ -85,4 +88,5 @@ | ||
| Type | Required? | Default | | ||
|:----: | :-------: | :-------: | | ||
|------- | :-------: | :-------: | | ||
| `bool` | N | true | | ||
Chooses whether to show the Color Range Sliders (hue & opacity) | ||
@@ -92,4 +96,5 @@ | ||
| Type | Required? | Default | | ||
|:----: | :-------: | :-------: | | ||
|------- | :-------: | :-------: | | ||
| `bool` | N | true | | ||
Chooses whether to show the Color Value Editor subcomponent | ||
@@ -102,10 +107,12 @@ | ||
| Type | Required? | Default | | ||
|:----: | :-------: | :-------: | | ||
|------- | :-------: | :-------: | | ||
| `bool` | N | true | | ||
Chooses whether to show the Color Swatch subcomponent | ||
#### `swatches` | ||
| Type | Required? | Default | | ||
|:----: | :-------: | :-------: | | ||
| Type | Required? | Default | | ||
|---- | :-------: | :-------: | | ||
| `object[]` | N | true | | ||
Prescribe the default swatches that are shown in the color picker like: | ||
@@ -122,5 +129,6 @@ | ||
#### `swatchesLabel` | ||
| Type | Required? | Default | | ||
|:----: | :-------: | :-------: | | ||
| `string` | N | '' | | ||
| Type | Required? | Default | | ||
| ------- | :-------: | :-------: | | ||
| `string` | N | '' | | ||
Provide a label to describe your swatches | ||
@@ -130,4 +138,5 @@ | ||
| Type | Required? | Default | | ||
|:----: | :-------: | :-------: | | ||
| `bool` | N | true | | ||
| ----- | :-------: | :-------: | | ||
| `bool` | N | true | | ||
Chooses whether to show a tooltip revealing a color's name of swatch hover |
135
7.14%89537
-0.03%