metro.js/test/src/_recover/index-ComboBox.tsx.txt at master · tiamatou/metro.js · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
// register Metro design fonts
import "com.sweaxizone.metro/fonts";

// third-party
import { createRoot } from "react-dom/client";
import * as React from "react";
import {
  Root,
  Group,
  HGroup,
  VGroup,
  Button,
  Label,
  Icon,
  ComboBox,
  Option,
} from "com.sweaxizone.metro/components";
import { RTLProvider } from "com.sweaxizone.metro/layout";
import {
  Primary,
  ThemePresets,
  ThemeProvider,
  type Theme,
} from "com.sweaxizone.metro/theme";

/**
 * The test.
 */
function App() {
  return (
    <ThemeProvider theme={ThemePresets.get("dark")}>
      <RTLProvider rtl={false}>
        <Primary prefer>
          <Root
            full
            solid
            selection={false}
            style={{
              overflowY: "auto",
            }}>
            <VGroup padding={10}>
              <ComboBox default="foo">
                <Option value="foo">foo</Option>
                <Option value="bar">bar</Option>
                <Option value="qux">qux</Option>
              </ComboBox>
              <ComboBox big>
                <Option value="foo">foo</Option>
                <Option value="bar">bar</Option>
                <Option value="qux">qux</Option>
              </ComboBox>
              <ComboBox default="foo" medium>
                <Option value="foo">foo</Option>
                <Option value="bar">bar</Option>
                <Option value="qux">qux</Option>
                <Option value="foo1">foo1</Option>
                <Option value="bar1">bar1</Option>
                <Option value="qux1">qux1</Option>
                <Option value="foo2">foo2</Option>
                <Option value="bar2">bar2</Option>
                <Option value="qux2">qux2</Option>
                <Option value="foo3">foo3</Option>
                <Option value="bar3">bar3</Option>
                <Option value="qux3">qux3</Option>
                <Option value="foo4">foo4</Option>
                <Option value="bar4">bar4</Option>
                <Option value="qux4">qux4</Option>
                <Option value="foo5">foo5</Option>
                <Option value="bar5">bar5</Option>
                <Option value="qux5">qux5</Option>
              </ComboBox>
            </VGroup>
          </Root>
        </Primary>
      </RTLProvider>
    </ThemeProvider>
  );
}

// Render App
const root = createRoot(document.getElementById("root")!);
root.render(<App />);