|
1 | 1 | import './App.css'; |
2 | | -import {Provider, defaultTheme, Item, TagGroup, Cell, Column, Row, TableBody, TableHeader, TableView, Content, Heading} from '@adobe/react-spectrum'; |
| 2 | +import {Provider, defaultTheme, Item, TagGroup, Cell, Column, Row, TableBody, TableHeader, TableView, Content, Heading, Form, ComboBox, Button} from '@adobe/react-spectrum'; |
3 | 3 | import Lighting from './Lighting'; |
4 | 4 | import {useState} from 'react' |
5 | 5 | import BodyContent from './BodyContent'; |
@@ -27,8 +27,7 @@ function App() { |
27 | 27 |
|
28 | 28 | return ( |
29 | 29 | <Provider theme={defaultTheme} |
30 | | - colorScheme={selected ? "light" : "dark"} |
31 | | - height="100%"> |
| 30 | + colorScheme={selected ? "light" : "dark"}> |
32 | 31 | <div className="content-padding"> |
33 | 32 | <Lighting selected={selected} switch={setSelection}/> |
34 | 33 | <TagGroup aria-label="Static TagGroup items example"> |
@@ -56,6 +55,17 @@ function App() { |
56 | 55 | <Heading>Payment Information</Heading> |
57 | 56 | <Content>Enter your billing address, shipping address, and payment method to complete your purchase.</Content> |
58 | 57 | </InlineAlert> |
| 58 | + <Form width="250px"> |
| 59 | + <ComboBox label="Favorite Animal"> |
| 60 | + <Item key="red panda">Red Panda</Item> |
| 61 | + <Item key="cat">Cat</Item> |
| 62 | + <Item key="dog">Dog</Item> |
| 63 | + <Item key="aardvark">Aardvark</Item> |
| 64 | + <Item key="kangaroo">Kangaroo</Item> |
| 65 | + <Item key="snake">Snake</Item> |
| 66 | + </ComboBox> |
| 67 | + <Button variant="cta">Click Me</Button> |
| 68 | + </Form> |
59 | 69 | </div> |
60 | 70 | </Provider> |
61 | 71 | ); |
|
0 commit comments