1import { Color, Navigation, NavigationStack, Script, TabView, Text, VStack } from "scripting"
2
3function Example() {
4 const colors: Color[] = [
5 "red",
6 "green",
7 "blue",
8 "purple"
9 ]
10
11 return <NavigationStack>
12 <VStack
13 navigationTitle={"TabView"}
14 >
15 <TabView
16 tabViewStyle={"page"}
17 frame={{
18 height: 200
19 }}
20 >
21 {colors.map(color =>
22 <ColorView
23 color={color}
24 />
25 )}
26 </TabView>
27 </VStack>
28 </NavigationStack>
29}
30
31function ColorView({
32 color,
33}: {
34 color: Color
35}) {
36 return <VStack
37 frame={{
38 maxWidth: "infinity",
39 maxHeight: "infinity"
40 }}
41 background={color}
42 >
43 <Text>{color}</Text>
44 </VStack>
45}
46
47async function run() {
48 await Navigation.present({
49 element: <Example />
50 })
51
52 Script.exit()
53}
54
55run()
