Skip to content

Commit 5ce6fc5

Browse files
committed
Create theme
1 parent 03b7dd0 commit 5ce6fc5

3 files changed

Lines changed: 588 additions & 32 deletions

File tree

libs/extractor/src/snapshots/extractor__tests__vanilla_extract_theme-2.snap

Lines changed: 67 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,71 @@ source: libs/extractor/src/lib.rs
33
expression: "ToBTreeSet::from(extract(\"theme-contract.css.ts\",\nr#\"import { createThemeContract, createTheme, style } from '@devup-ui/react'\nconst vars = createThemeContract({\n color: {\n brand: null,\n text: null\n }\n})\nexport const lightTheme = createTheme(vars, {\n color: {\n brand: 'blue',\n text: 'black'\n }\n})\nexport const darkTheme = createTheme(vars, {\n color: {\n brand: 'lightblue',\n text: 'white'\n }\n})\n\"#,\nExtractOption\n{\n package: \"@devup-ui/react\".to_string(), css_dir:\n \"@devup-ui/react\".to_string(), single_css: true, import_main_css: false\n}).unwrap())"
44
---
55
ToBTreeSet {
6-
styles: {},
7-
code: "export const darkTheme = createTheme(vars, { color: {\n\tbrand: \"lightblue\",\n\ttext: \"white\"\n} });\nexport const lightTheme = createTheme(vars, { color: {\n\tbrand: \"blue\",\n\ttext: \"black\"\n} });\n",
6+
styles: {
7+
Static(
8+
ExtractStaticStyle {
9+
property: "--color-brand",
10+
value: "blue",
11+
level: 0,
12+
selector: Some(
13+
Global(
14+
".f14_lightTheme",
15+
"theme-contract.css.ts",
16+
),
17+
),
18+
style_order: Some(
19+
0,
20+
),
21+
},
22+
),
23+
Static(
24+
ExtractStaticStyle {
25+
property: "--color-brand",
26+
value: "lightblue",
27+
level: 0,
28+
selector: Some(
29+
Global(
30+
".f14_darkTheme",
31+
"theme-contract.css.ts",
32+
),
33+
),
34+
style_order: Some(
35+
0,
36+
),
37+
},
38+
),
39+
Static(
40+
ExtractStaticStyle {
41+
property: "--color-text",
42+
value: "black",
43+
level: 0,
44+
selector: Some(
45+
Global(
46+
".f14_lightTheme",
47+
"theme-contract.css.ts",
48+
),
49+
),
50+
style_order: Some(
51+
0,
52+
),
53+
},
54+
),
55+
Static(
56+
ExtractStaticStyle {
57+
property: "--color-text",
58+
value: "white",
59+
level: 0,
60+
selector: Some(
61+
Global(
62+
".f14_darkTheme",
63+
"theme-contract.css.ts",
64+
),
65+
),
66+
style_order: Some(
67+
0,
68+
),
69+
},
70+
),
71+
},
72+
code: "import \"@devup-ui/react/devup-ui.css\";\nexport const darkTheme = \"f14_darkTheme\";\nexport const lightTheme = \"f14_lightTheme\";\n;\n;\n",
873
}

libs/extractor/src/snapshots/extractor__tests__vanilla_extract_theme.snap

Lines changed: 101 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,105 @@ source: libs/extractor/src/lib.rs
33
expression: "ToBTreeSet::from(extract(\"theme.css.ts\",\nr#\"import { createTheme, style } from '@devup-ui/react'\nexport const [themeClass, vars] = createTheme({\n color: {\n brand: 'blue',\n text: 'black'\n },\n space: {\n small: '4px',\n medium: '8px',\n large: '16px'\n }\n})\nexport const box = style({\n color: vars.color.text,\n padding: vars.space.medium\n})\n\"#,\nExtractOption\n{\n package: \"@devup-ui/react\".to_string(), css_dir:\n \"@devup-ui/react\".to_string(), single_css: true, import_main_css: false\n}).unwrap())"
44
---
55
ToBTreeSet {
6-
styles: {},
7-
code: "import { createTheme, style } from \"@devup-ui/react\";\nexport const [themeClass, vars] = createTheme({\n\tcolor: {\n\t\tbrand: \"blue\",\n\t\ttext: \"black\"\n\t},\n\tspace: {\n\t\tsmall: \"4px\",\n\t\tmedium: \"8px\",\n\t\tlarge: \"16px\"\n\t}\n});\nexport const box = style({\n\tcolor: vars.color.text,\n\tpadding: vars.space.medium\n});\n",
6+
styles: {
7+
Static(
8+
ExtractStaticStyle {
9+
property: "--color-brand-style_0-0",
10+
value: "blue",
11+
level: 0,
12+
selector: Some(
13+
Global(
14+
".f13_themeClass",
15+
"theme.css.ts",
16+
),
17+
),
18+
style_order: Some(
19+
0,
20+
),
21+
},
22+
),
23+
Static(
24+
ExtractStaticStyle {
25+
property: "--color-text-style_0-1",
26+
value: "black",
27+
level: 0,
28+
selector: Some(
29+
Global(
30+
".f13_themeClass",
31+
"theme.css.ts",
32+
),
33+
),
34+
style_order: Some(
35+
0,
36+
),
37+
},
38+
),
39+
Static(
40+
ExtractStaticStyle {
41+
property: "--space-large-style_0-4",
42+
value: "16px",
43+
level: 0,
44+
selector: Some(
45+
Global(
46+
".f13_themeClass",
47+
"theme.css.ts",
48+
),
49+
),
50+
style_order: Some(
51+
0,
52+
),
53+
},
54+
),
55+
Static(
56+
ExtractStaticStyle {
57+
property: "--space-medium-style_0-3",
58+
value: "8px",
59+
level: 0,
60+
selector: Some(
61+
Global(
62+
".f13_themeClass",
63+
"theme.css.ts",
64+
),
65+
),
66+
style_order: Some(
67+
0,
68+
),
69+
},
70+
),
71+
Static(
72+
ExtractStaticStyle {
73+
property: "--space-small-style_0-2",
74+
value: "4px",
75+
level: 0,
76+
selector: Some(
77+
Global(
78+
".f13_themeClass",
79+
"theme.css.ts",
80+
),
81+
),
82+
style_order: Some(
83+
0,
84+
),
85+
},
86+
),
87+
Static(
88+
ExtractStaticStyle {
89+
property: "color",
90+
value: "var(--color-text-style_0-1)",
91+
level: 0,
92+
selector: None,
93+
style_order: None,
94+
},
95+
),
96+
Static(
97+
ExtractStaticStyle {
98+
property: "padding",
99+
value: "var(--space-medium-style_0-3)",
100+
level: 0,
101+
selector: None,
102+
style_order: None,
103+
},
104+
),
105+
},
106+
code: "import \"@devup-ui/react/devup-ui.css\";\nexport const box = \"a b\";\nexport const [themeClass, vars] = [\"f13_themeClass\", {\n\t\"color\": {\n\t\t\"brand\": \"var(--color-brand-style_0-0)\",\n\t\t\"text\": \"var(--color-text-style_0-1)\"\n\t},\n\t\"space\": {\n\t\t\"small\": \"var(--space-small-style_0-2)\",\n\t\t\"medium\": \"var(--space-medium-style_0-3)\",\n\t\t\"large\": \"var(--space-large-style_0-4)\"\n\t}\n}];\n;\n",
8107
}

0 commit comments

Comments
 (0)