1import { Gauge, List, Navigation, NavigationStack, Script, Section, Text } from "scripting"
2
3function Example() {
4
5 return <NavigationStack>
6 <List
7 navigationTitle={"Gauge"}
8 navigationBarTitleDisplayMode={"inline"}
9 >
10 <Section
11 header={
12 <Text>accessoryCircular</Text>
13 }
14 >
15 <Gauge
16 value={0.4}
17 label={<Text>0 100</Text>}
18 currentValueLabel={<Text>40%</Text>}
19 gaugeStyle={"accessoryCircular"}
20 tint={"systemGreen"}
21 />
22 </Section>
23
24 <Section
25 header={
26 <Text>accessoryCircularCapacity</Text>
27 }
28 >
29 <Gauge
30 value={0.4}
31 label={<Text>Battery Level</Text>}
32 currentValueLabel={<Text>40%</Text>}
33 gaugeStyle={"accessoryCircularCapacity"}
34 />
35 </Section>
36
37 <Section
38 header={
39 <Text>linearCapacity</Text>
40 }
41 >
42 <Gauge
43 value={0.4}
44 label={<Text>Battery Level</Text>}
45 currentValueLabel={<Text>40%</Text>}
46 gaugeStyle={"linearCapacity"}
47 />
48 </Section>
49
50 <Section
51 header={
52 <Text>accessoryLinear</Text>
53 }
54 >
55 <Gauge
56 value={0.4}
57 label={<Text>Battery Level</Text>}
58 currentValueLabel={<Text>40%</Text>}
59 gaugeStyle={"accessoryLinear"}
60 />
61 </Section>
62 <Section
63 header={
64 <Text>accessoryLinearCapacity</Text>
65 }
66 >
67 <Gauge
68 value={0.4}
69 label={<Text>Battery Level</Text>}
70 currentValueLabel={<Text>40%</Text>}
71 gaugeStyle={"accessoryLinearCapacity"}
72 />
73 </Section>
74 </List>
75 </NavigationStack>
76}
77
78async function run() {
79 await Navigation.present({
80 element: <Example />
81 })
82
83 Script.exit()
84}
85
86run()