An ATproto social media client -- with an independent Appview.
quilling.dev
1import {LinearGradient} from 'expo-linear-gradient'
2
3import {atoms as a, type tokens, type ViewStyleProp} from '#/alf'
4
5export function GradientFill({
6 gradient,
7 style,
8}: ViewStyleProp & {
9 gradient:
10 | typeof tokens.gradients.primary
11 | typeof tokens.gradients.sky
12 | typeof tokens.gradients.midnight
13 | typeof tokens.gradients.sunrise
14 | typeof tokens.gradients.sunset
15 | typeof tokens.gradients.bonfire
16 | typeof tokens.gradients.summer
17 | typeof tokens.gradients.nordic
18}) {
19 if (gradient.values.length < 2) {
20 throw new Error('Gradient must have at least 2 colors')
21 }
22
23 return (
24 <LinearGradient
25 colors={gradient.values.map(c => c[1]) as [string, string, ...string[]]}
26 locations={
27 gradient.values.map(c => c[0]) as [number, number, ...number[]]
28 }
29 start={{x: 0, y: 0}}
30 end={{x: 1, y: 1}}
31 style={[a.absolute, a.inset_0, style]}
32 />
33 )
34}