Skip to content

Commit 8e13753

Browse files
Update docs
1 parent 0a836a3 commit 8e13753

File tree

1 file changed

+15
-19
lines changed

1 file changed

+15
-19
lines changed

src/channel-picker/README.md

Lines changed: 15 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -35,14 +35,11 @@ You can hide the `color-space` part with CSS to show only the coordinates of the
3535

3636
### Events
3737

38-
You can listen to the `valuechange` event to get the current value (the `value`
39-
property). When a new color space is selected, the channel will be either
40-
preserved (if it is in the new space) or reset to the first available one:
38+
You can listen to the `valuechange` event to get the current value (the `value` property). When a new color space is selected,
39+
the channel will be either preserved (if it is in the new space) or reset to the first available one:
4140

4241
```html
43-
<channel-picker
44-
onvaluechange="this.nextElementSibling.textContent = this.value"
45-
></channel-picker>
42+
<channel-picker onvaluechange="this.nextElementSibling.textContent = this.value"></channel-picker>
4643
<output></output>
4744
```
4845

@@ -62,8 +59,7 @@ All properties are reactive and can be set programmatically:
6259
<channel-picker></channel-picker>
6360
```
6461

65-
`<channel-picker>` plays nicely with other color elements, like
66-
[`<channel-slider>`](../channel-slider):
62+
`<channel-picker>` plays nicely with other color elements, like [`<channel-slider>`](../channel-slider):
6763

6864
```html
6965
<channel-picker id="channel_picker" value="oklch.c"></channel-picker>
@@ -91,32 +87,32 @@ All properties are reactive and can be set programmatically:
9187
### Attributes & Properties
9288

9389
| Attribute | Property | Property type | Default value | Description |
94-
| --------- | -------- | ------------- | ------------- | -------------------------------- |
90+
|-----------|----------|---------------|---------------|----------------------------------|
9591
| `value` | `value` | `string` | `oklch.l` | The current value of the picker. |
9692
| `compact` | `compact` | `boolean` | `false` | Whether the picker should be rendered compact or not. |
9793

9894
### Getters
9995

10096
These properties are read-only.
10197

102-
| Property | Type | Description |
103-
| ----------------- | ------------ | ------------------------------------------------------------------- |
104-
| `selectedSpace` | `ColorSpace` | Color space object corresponding to the space picker current value. |
105-
| `selectedChannel` | `object` | The current channel metadata. |
98+
| Property | Type | Description |
99+
|----------|------|-------------|
100+
| `selectedSpace` | `ColorSpace` | Color space object corresponding to the space picker current value. |
101+
| `selectedChannel` | `object` | The current channel metadata.|
106102

107103
### Events
108104

109-
| Name | Description |
110-
| ------------- | ---------------------------------------------------------------------------- |
111-
| `input` | Fired when the color space or channel changes due to user action. |
112-
| `change` | Fired when the color space or channel changes due to user action. |
113-
| `valuechange` | Fired when the value changes for any reason, and once during initialization. |
105+
| Name | Description |
106+
|-----------------|--------------------------------------------------------------------------------|
107+
| `input` | Fired when the color space or channel changes due to user action. |
108+
| `change` | Fired when the color space or channel changes due to user action. |
109+
| `valuechange` | Fired when the value changes for any reason, and once during initialization. |
114110

115111
### Parts
116112

117113
| Name | Description |
118114
|----------------|------------------------------------------------------|
119115
| `color-space` | The internal [`<space-picker>`](../space-picker/) element. |
120116
| `color-space-base` | The internal `<select>` element of [`<space-picker>`](../space-picker/). |
121-
| `channels` | The container that wraps the current color space channels. |
122117
| `color-channel-base` | If the picker is compact, the internal `<select>` element used to render the channels. |
118+
| `channels` | The container that wraps the current color space channels. |

0 commit comments

Comments
 (0)