| 1 |
// Parses the gradient color string |
| 2 |
export const parseGradientColor = ( |
| 3 |
gradientColor = `linear-gradient(45deg,#7967ff,#c277f2)` |
| 4 |
) => { |
| 5 |
let angle = 45, |
| 6 |
colorOnePosition = 0, |
| 7 |
colorTwoPosition = 100, |
| 8 |
radialShape = "ellipse", |
| 9 |
radialX = 50, |
| 10 |
radialY = 50; |
| 11 |
const [colorOne, colorTwo] = gradientColor.match( |
| 12 |
/\#[a-f\d]{3,8}|rgba?\([\d\,\.]{3,16}\)/gi |
| 13 |
) || ["rgba(0,0,0,0)", "rgba(0,0,0,0)"]; |
| 14 |
const [gradientType] = gradientColor.match(/\w{6}(?=-)/i) || ["linear"]; |
| 15 |
if (gradientType == "linear") { |
| 16 |
angle = gradientColor.match(/\d{1,3}(?=deg)/i)[0]; |
| 17 |
[colorOnePosition, colorTwoPosition] = gradientColor.match( |
| 18 |
/\d{1,3}(?=\%)/gi |
| 19 |
) || ["0", "100"]; |
| 20 |
} else { |
| 21 |
radialShape = (gradientColor.match(/\w+(?= at)/i) || ["circle"])[0]; |
| 22 |
|
| 23 |
const pcents = gradientColor.match(/\d{1,3}(?=\%)/gi) || [ |
| 24 |
"50", |
| 25 |
"50", |
| 26 |
"18", |
| 27 |
"82", |
| 28 |
]; |
| 29 |
|
| 30 |
radialX = pcents[0]; |
| 31 |
radialY = pcents[1]; |
| 32 |
colorOnePosition = pcents[2]; |
| 33 |
colorTwoPosition = pcents[3]; |
| 34 |
} |
| 35 |
return { |
| 36 |
gradientType, |
| 37 |
angle: parseInt(angle), |
| 38 |
colorOne, |
| 39 |
colorTwo, |
| 40 |
colorOnePosition: parseInt(colorOnePosition), |
| 41 |
colorTwoPosition: parseInt(colorTwoPosition), |
| 42 |
radialShape, |
| 43 |
radialX: parseInt(radialX), |
| 44 |
radialY: parseInt(radialY), |
| 45 |
}; |
| 46 |
}; |
| 47 |
|
