1import { Capsule, Circle, Ellipse, List, Navigation, NavigationStack, Rectangle, RoundedRectangle, Script, Section, Text, UnevenRoundedRectangle, } from "scripting"
2
3function Example() {
4
5 return <NavigationStack>
6 <List
7 navigationTitle={"Shapes"}
8 navigationBarTitleDisplayMode={"inline"}
9 >
10 <Section
11 header={
12 <Text>Rectangle</Text>
13 }
14 >
15 <Rectangle
16 fill={"orange"}
17 stroke={"red"}
18 strokeLineWidth={3}
19 frame={{
20 width: 100,
21 height: 100,
22 }}
23 />
24 </Section>
25
26 <Section
27 header={
28 <Text>RoundedRectangle</Text>
29 }
30 >
31 <RoundedRectangle
32 fill={"blue"}
33 cornerRadius={16}
34 frame={{
35 width: 100,
36 height: 100,
37 }}
38 />
39 </Section>
40
41 <Section
42 header={
43 <Text>Circle</Text>
44 }
45 >
46 <Circle
47 stroke={"purple"}
48 strokeLineWidth={4}
49 frame={{
50 width: 100,
51 height: 100,
52 }}
53 />
54 </Section>
55
56 <Section
57 header={
58 <Text>Capsule</Text>
59 }
60 >
61 <Capsule
62 fill={"systemIndigo"}
63 frame={{
64 width: 100,
65 height: 40,
66 }}
67 />
68 </Section>
69
70 <Section
71 header={
72 <Text>Ellipse</Text>
73 }
74 >
75 <Ellipse
76 fill={"green"}
77 frame={{
78 width: 40,
79 height: 100,
80 }}
81 />
82 </Section>
83
84 <Section
85 header={
86 <Text>UnevenRoundedRectangle</Text>
87 }
88 >
89 <UnevenRoundedRectangle
90 fill={"brown"}
91 topLeadingRadius={16}
92 topTrailingRadius={0}
93 bottomLeadingRadius={0}
94 bottomTrailingRadius={16}
95 frame={{
96 width: 100,
97 height: 50,
98 }}
99 />
100 </Section>
101 </List>
102 </NavigationStack>
103}
104
105async function run() {
106 await Navigation.present({
107 element: <Example />
108 })
109
110 Script.exit()
111}
112
113run()
