1import { List, Navigation, NavigationStack, Picker, PickerStyle, Script, Section, Text, useMemo, useState, } from "scripting"
2
3function Example() {
4 const [value, setValue] = useState<number>(0)
5 const options = useMemo<PickerStyle[]>(() => [
6 'automatic',
7 'inline',
8 'menu',
9 'navigationLink',
10 'palette',
11 'segmented',
12 'wheel'
13 ], [])
14 const users = useMemo<string[]>(() => [
15 "Jobs", "Elon", "Zack", "Joe"
16 ], [])
17
18 return <NavigationStack>
19 <List
20 navigationTitle={"Picker"}
21 navigationBarTitleDisplayMode={"inline"}
22 >
23 {options.map((style) =>
24 <Section
25 header={
26 <Text>Picker: {style}</Text>}
27 >
28 <Picker
29 title={"Picker: " + style}
30 pickerStyle={style}
31 value={value}
32 onChanged={setValue}
33 >
34 {users.map((user, index) =>
35 <Text
36 tag={index}
37 >{user}</Text>
38 )}
39 </Picker>
40 </Section>
41 )}
42 </List>
43 </NavigationStack>
44}
45
46async function run() {
47 await Navigation.present({
48 element: <Example />
49 })
50
51 Script.exit()
52}
53
54run()
