1import { tintColor } from './constants';
2import { ImageTestGroup, ImageTestPropsFnInput } from '../types';
3
4const backgroundColor = '#fff';
5
6const imageTests: ImageTestGroup = {
7  name: 'Shadows',
8  tests: [
9    {
10      name: 'Shadow',
11      props: ({ range }: ImageTestPropsFnInput) => ({
12        style: {
13          backgroundColor,
14          shadowColor: '#000',
15          shadowOffset: {
16            width: 0,
17            height: range(2, 5),
18          },
19          shadowOpacity: range(0.2, 0.5),
20          shadowRadius: range(0, 10),
21          elevation: range(0, 10),
22        },
23      }),
24    },
25    {
26      name: 'Shadow: and border-radius',
27      props: ({ range }: ImageTestPropsFnInput) => ({
28        style: {
29          backgroundColor,
30          borderRadius: range(0, 100),
31          shadowColor: '#000',
32          shadowOffset: {
33            width: 0,
34            height: range(2, 5),
35          },
36          shadowOpacity: range(0.2, 0.5),
37          shadowRadius: range(0, 10),
38          elevation: range(0, 10),
39        },
40      }),
41    },
42    {
43      name: 'Shadow: and separate border-radius',
44      props: ({ range }: ImageTestPropsFnInput) => ({
45        style: {
46          backgroundColor,
47          borderTopLeftRadius: range(0, 25),
48          borderTopRightRadius: range(0, 50),
49          borderBottomLeftRadius: range(0, 75),
50          borderBottomRightRadius: range(0, 200),
51          shadowColor: '#000',
52          shadowOffset: {
53            width: 0,
54            height: 5,
55          },
56          shadowOpacity: 0.5,
57          shadowRadius: 10,
58          elevation: 10,
59        },
60      }),
61    },
62    {
63      name: 'Shadow: Color (iOS only)',
64      props: ({ range }: ImageTestPropsFnInput) => ({
65        style: {
66          backgroundColor,
67          shadowColor: tintColor,
68          shadowOffset: {
69            width: 0,
70            height: 5,
71          },
72          shadowOpacity: 0.7,
73          shadowRadius: 10,
74          elevation: 10,
75        },
76      }),
77    },
78    {
79      name: 'Shadow: and no background (gives warning)',
80      props: ({ range }: ImageTestPropsFnInput) => ({
81        style: {
82          shadowColor: '#000',
83          shadowOffset: {
84            width: 0,
85            height: range(2, 5),
86          },
87          shadowOpacity: range(0.2, 0.5),
88          shadowRadius: range(0, 10),
89          elevation: range(0, 10),
90        },
91      }),
92    },
93    {
94      name: 'Shadow: and transparent background (gives warning)',
95      props: ({ range }: ImageTestPropsFnInput) => ({
96        style: {
97          backgroundColor: '#00000088',
98          shadowColor: '#000',
99          shadowOffset: {
100            width: 0,
101            height: range(2, 5),
102          },
103          shadowOpacity: range(0.2, 0.5),
104          shadowRadius: range(0, 10),
105          elevation: range(0, 10),
106        },
107      }),
108    },
109  ],
110};
111
112export default imageTests;
113