-
-
Notifications
You must be signed in to change notification settings - Fork 209
/
hsla.js
68 lines (64 loc) · 1.87 KB
/
hsla.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
// @flow
import hslToHex from '../internalHelpers/_hslToHex'
import hslToRgb from '../internalHelpers/_hslToRgb'
import type { HslaColor } from '../types/color'
/**
* Returns a string value for the color. The returned result is the smallest possible rgba or hex notation.
*
* @example
* // Styles as object usage
* const styles = {
* background: hsla(359, 0.75, 0.4, 0.7),
* background: hsla({ hue: 360, saturation: 0.75, lightness: 0.4, alpha: 0,7 }),
* background: hsla(359, 0.75, 0.4, 1),
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${hsla(359, 0.75, 0.4, 0.7)};
* background: ${hsla({ hue: 360, saturation: 0.75, lightness: 0.4, alpha: 0,7 })};
* background: ${hsla(359, 0.75, 0.4, 1)};
* `
*
* // CSS in JS Output
*
* element {
* background: "rgba(179,25,28,0.7)";
* background: "rgba(179,25,28,0.7)";
* background: "#b3191c";
* }
*/
function hsla(
value: HslaColor | number,
saturation?: number,
lightness?: number,
alpha?: number,
): string {
if (
typeof value === 'number' &&
typeof saturation === 'number' &&
typeof lightness === 'number' &&
typeof alpha === 'number'
) {
return alpha >= 1
? hslToHex(value, saturation, lightness)
: `rgba(${hslToRgb(value, saturation, lightness)},${alpha})`
} else if (
typeof value === 'object' &&
saturation === undefined &&
lightness === undefined &&
alpha === undefined
) {
return value.alpha >= 1
? hslToHex(value.hue, value.saturation, value.lightness)
: `rgba(${hslToRgb(
value.hue,
value.saturation,
value.lightness,
)},${value.alpha})`
}
throw new Error(
'Passed invalid arguments to hsla, please pass multiple numbers e.g. hsl(360, 0.75, 0.4, 0.7) or an object e.g. rgb({ hue: 255, saturation: 0.4, lightness: 0.75, alpha: 0.7 }).',
)
}
export default hsla