diegohaz / diegohaz/styled-tools
Improve Palette Types
- Dominant language
- JavaScript
- Stars
- 799
- Forks
- 24
- PR merge metrics
- No merged PRs in 30d
Description
## Bug In Documentation
As of now it lists that the second argument for palette is always `any`, but when there are three arguments the type interfaces enforces the second argument to be of type `number`. This can be better labeled in the documentation/readme

## Feature Request
It seems a bit weird to switch on the expected types, where the second value can be either the index or the default value. A possible extension of this could be to actually allow for `string | number` for both the first and second arguments and to declare the default as the prop within the component.
```
palette(arg1) => props.theme.palette[arg1] || defaultColor
palette(arg1, arg2) => props.theme.palette[arg1][arg2] || defaultColor
palette(arg1, arg2, arg3) => props.theme.palette[arg1]?.[arg2] || arg3
```
What this allows is for each argument to be either a string or number, and to access either an array or an object in the same way. This gives for some nicer formatting of palette when there are several different color organization options, in addition to extending the model to support more options.
```
const theme = {
palette: {
solids: {
black: '#000000',
white: '#FFFFFF',
},
gradients: {
blue: 'linear-gradient(135deg, #75F094 0%, #75B2F0 100%)',
}
}
}
```
If going with the latter solution, the documentation issue is moot and can be ignored.
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.