Skip to content

Commit 69ef331

Browse files
allozaurallozaur
committed
feat: UI components & Storybook WIP
1 parent 0c80bac commit 69ef331

File tree

85 files changed

+2662
-452
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

85 files changed

+2662
-452
lines changed

‎tools/server/webui/package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
"version": "0.0.1",
55
"type": "module",
66
"scripts": {
7-
"dev": "vite dev",
7+
"dev": "vite dev & storybook dev -p 6006",
88
"build": "vite build",
99
"preview": "vite preview",
1010
"prepare": "svelte-kit sync || echo ''",
@@ -68,4 +68,4 @@
6868
"dependencies": {
6969
"mode-watcher": "^1.1.0"
7070
}
71-
}
71+
}

‎tools/server/webui/src/app.css‎

Lines changed: 107 additions & 107 deletions
Original file line numberDiff line numberDiff line change
@@ -1,121 +1,121 @@
1-
@import "tailwindcss";
1+
@import 'tailwindcss';
22

3-
@import "tw-animate-css";
3+
@import 'tw-animate-css';
44

55
@custom-variant dark (&:is(.dark *));
66

77
:root {
8-
--radius: 0.625rem;
9-
--background: oklch(1 0 0);
10-
--foreground: oklch(0.145 0 0);
11-
--card: oklch(1 0 0);
12-
--card-foreground: oklch(0.145 0 0);
13-
--popover: oklch(1 0 0);
14-
--popover-foreground: oklch(0.145 0 0);
15-
--primary: oklch(0.205 0 0);
16-
--primary-foreground: oklch(0.985 0 0);
17-
--secondary: oklch(0.97 0 0);
18-
--secondary-foreground: oklch(0.205 0 0);
19-
--muted: oklch(0.97 0 0);
20-
--muted-foreground: oklch(0.556 0 0);
21-
--accent: oklch(0.97 0 0);
22-
--accent-foreground: oklch(0.205 0 0);
23-
--destructive: oklch(0.577 0.245 27.325);
24-
--border: oklch(0.922 0 0);
25-
--input: oklch(0.922 0 0);
26-
--ring: oklch(0.708 0 0);
27-
--chart-1: oklch(0.646 0.222 41.116);
28-
--chart-2: oklch(0.6 0.118 184.704);
29-
--chart-3: oklch(0.398 0.07 227.392);
30-
--chart-4: oklch(0.828 0.189 84.429);
31-
--chart-5: oklch(0.769 0.188 70.08);
32-
--sidebar: oklch(0.985 0 0);
33-
--sidebar-foreground: oklch(0.145 0 0);
34-
--sidebar-primary: oklch(0.205 0 0);
35-
--sidebar-primary-foreground: oklch(0.985 0 0);
36-
--sidebar-accent: oklch(0.97 0 0);
37-
--sidebar-accent-foreground: oklch(0.205 0 0);
38-
--sidebar-border: oklch(0.922 0 0);
39-
--sidebar-ring: oklch(0.708 0 0);
8+
--radius: 0.625rem;
9+
--background: oklch(1 0 0);
10+
--foreground: oklch(0.145 0 0);
11+
--card: oklch(1 0 0);
12+
--card-foreground: oklch(0.145 0 0);
13+
--popover: oklch(1 0 0);
14+
--popover-foreground: oklch(0.145 0 0);
15+
--primary: oklch(0.205 0 0);
16+
--primary-foreground: oklch(0.985 0 0);
17+
--secondary: oklch(0.97 0 0);
18+
--secondary-foreground: oklch(0.205 0 0);
19+
--muted: oklch(0.97 0 0);
20+
--muted-foreground: oklch(0.556 0 0);
21+
--accent: oklch(0.97 0 0);
22+
--accent-foreground: oklch(0.205 0 0);
23+
--destructive: oklch(0.577 0.245 27.325);
24+
--border: oklch(0.88 0 0);
25+
--input: oklch(0.922 0 0);
26+
--ring: oklch(0.708 0 0);
27+
--chart-1: oklch(0.646 0.222 41.116);
28+
--chart-2: oklch(0.6 0.118 184.704);
29+
--chart-3: oklch(0.398 0.07 227.392);
30+
--chart-4: oklch(0.828 0.189 84.429);
31+
--chart-5: oklch(0.769 0.188 70.08);
32+
--sidebar: oklch(0.985 0 0);
33+
--sidebar-foreground: oklch(0.145 0 0);
34+
--sidebar-primary: oklch(0.205 0 0);
35+
--sidebar-primary-foreground: oklch(0.985 0 0);
36+
--sidebar-accent: oklch(0.97 0 0);
37+
--sidebar-accent-foreground: oklch(0.205 0 0);
38+
--sidebar-border: oklch(0.922 0 0);
39+
--sidebar-ring: oklch(0.708 0 0);
4040
}
4141

4242
.dark {
43-
--background: oklch(0.145 0 0);
44-
--foreground: oklch(0.985 0 0);
45-
--card: oklch(0.205 0 0);
46-
--card-foreground: oklch(0.985 0 0);
47-
--popover: oklch(0.205 0 0);
48-
--popover-foreground: oklch(0.985 0 0);
49-
--primary: oklch(0.922 0 0);
50-
--primary-foreground: oklch(0.205 0 0);
51-
--secondary: oklch(0.269 0 0);
52-
--secondary-foreground: oklch(0.985 0 0);
53-
--muted: oklch(0.269 0 0);
54-
--muted-foreground: oklch(0.708 0 0);
55-
--accent: oklch(0.269 0 0);
56-
--accent-foreground: oklch(0.985 0 0);
57-
--destructive: oklch(0.704 0.191 22.216);
58-
--border: oklch(1 0 0 / 10%);
59-
--input: oklch(1 0 0 / 15%);
60-
--ring: oklch(0.556 0 0);
61-
--chart-1: oklch(0.488 0.243 264.376);
62-
--chart-2: oklch(0.696 0.17 162.48);
63-
--chart-3: oklch(0.769 0.188 70.08);
64-
--chart-4: oklch(0.627 0.265 303.9);
65-
--chart-5: oklch(0.645 0.246 16.439);
66-
--sidebar: oklch(0.205 0 0);
67-
--sidebar-foreground: oklch(0.985 0 0);
68-
--sidebar-primary: oklch(0.488 0.243 264.376);
69-
--sidebar-primary-foreground: oklch(0.985 0 0);
70-
--sidebar-accent: oklch(0.269 0 0);
71-
--sidebar-accent-foreground: oklch(0.985 0 0);
72-
--sidebar-border: oklch(1 0 0 / 10%);
73-
--sidebar-ring: oklch(0.556 0 0);
43+
--background: oklch(0.145 0 0);
44+
--foreground: oklch(0.985 0 0);
45+
--card: oklch(0.205 0 0);
46+
--card-foreground: oklch(0.985 0 0);
47+
--popover: oklch(0.205 0 0);
48+
--popover-foreground: oklch(0.985 0 0);
49+
--primary: oklch(0.922 0 0);
50+
--primary-foreground: oklch(0.205 0 0);
51+
--secondary: oklch(0.269 0 0);
52+
--secondary-foreground: oklch(0.985 0 0);
53+
--muted: oklch(0.269 0 0);
54+
--muted-foreground: oklch(0.708 0 0);
55+
--accent: oklch(0.269 0 0);
56+
--accent-foreground: oklch(0.985 0 0);
57+
--destructive: oklch(0.704 0.191 22.216);
58+
--border: oklch(1 0 0 / 15%);
59+
--input: oklch(1 0 0 / 15%);
60+
--ring: oklch(0.556 0 0);
61+
--chart-1: oklch(0.488 0.243 264.376);
62+
--chart-2: oklch(0.696 0.17 162.48);
63+
--chart-3: oklch(0.769 0.188 70.08);
64+
--chart-4: oklch(0.627 0.265 303.9);
65+
--chart-5: oklch(0.645 0.246 16.439);
66+
--sidebar: oklch(0.205 0 0);
67+
--sidebar-foreground: oklch(0.985 0 0);
68+
--sidebar-primary: oklch(0.488 0.243 264.376);
69+
--sidebar-primary-foreground: oklch(0.985 0 0);
70+
--sidebar-accent: oklch(0.269 0 0);
71+
--sidebar-accent-foreground: oklch(0.985 0 0);
72+
--sidebar-border: oklch(1 0 0 / 10%);
73+
--sidebar-ring: oklch(0.556 0 0);
7474
}
7575

7676
@theme inline {
77-
--radius-sm: calc(var(--radius) - 4px);
78-
--radius-md: calc(var(--radius) - 2px);
79-
--radius-lg: var(--radius);
80-
--radius-xl: calc(var(--radius) + 4px);
81-
--color-background: var(--background);
82-
--color-foreground: var(--foreground);
83-
--color-card: var(--card);
84-
--color-card-foreground: var(--card-foreground);
85-
--color-popover: var(--popover);
86-
--color-popover-foreground: var(--popover-foreground);
87-
--color-primary: var(--primary);
88-
--color-primary-foreground: var(--primary-foreground);
89-
--color-secondary: var(--secondary);
90-
--color-secondary-foreground: var(--secondary-foreground);
91-
--color-muted: var(--muted);
92-
--color-muted-foreground: var(--muted-foreground);
93-
--color-accent: var(--accent);
94-
--color-accent-foreground: var(--accent-foreground);
95-
--color-destructive: var(--destructive);
96-
--color-border: var(--border);
97-
--color-input: var(--input);
98-
--color-ring: var(--ring);
99-
--color-chart-1: var(--chart-1);
100-
--color-chart-2: var(--chart-2);
101-
--color-chart-3: var(--chart-3);
102-
--color-chart-4: var(--chart-4);
103-
--color-chart-5: var(--chart-5);
104-
--color-sidebar: var(--sidebar);
105-
--color-sidebar-foreground: var(--sidebar-foreground);
106-
--color-sidebar-primary: var(--sidebar-primary);
107-
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
108-
--color-sidebar-accent: var(--sidebar-accent);
109-
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
110-
--color-sidebar-border: var(--sidebar-border);
111-
--color-sidebar-ring: var(--sidebar-ring);
77+
--radius-sm: calc(var(--radius) - 4px);
78+
--radius-md: calc(var(--radius) - 2px);
79+
--radius-lg: var(--radius);
80+
--radius-xl: calc(var(--radius) + 4px);
81+
--color-background: var(--background);
82+
--color-foreground: var(--foreground);
83+
--color-card: var(--card);
84+
--color-card-foreground: var(--card-foreground);
85+
--color-popover: var(--popover);
86+
--color-popover-foreground: var(--popover-foreground);
87+
--color-primary: var(--primary);
88+
--color-primary-foreground: var(--primary-foreground);
89+
--color-secondary: var(--secondary);
90+
--color-secondary-foreground: var(--secondary-foreground);
91+
--color-muted: var(--muted);
92+
--color-muted-foreground: var(--muted-foreground);
93+
--color-accent: var(--accent);
94+
--color-accent-foreground: var(--accent-foreground);
95+
--color-destructive: var(--destructive);
96+
--color-border: var(--border);
97+
--color-input: var(--input);
98+
--color-ring: var(--ring);
99+
--color-chart-1: var(--chart-1);
100+
--color-chart-2: var(--chart-2);
101+
--color-chart-3: var(--chart-3);
102+
--color-chart-4: var(--chart-4);
103+
--color-chart-5: var(--chart-5);
104+
--color-sidebar: var(--sidebar);
105+
--color-sidebar-foreground: var(--sidebar-foreground);
106+
--color-sidebar-primary: var(--sidebar-primary);
107+
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
108+
--color-sidebar-accent: var(--sidebar-accent);
109+
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
110+
--color-sidebar-border: var(--sidebar-border);
111+
--color-sidebar-ring: var(--sidebar-ring);
112112
}
113113

114114
@layer base {
115-
* {
116-
@apply border-border outline-ring/50;
117-
}
118-
body {
119-
@apply bg-background text-foreground;
120-
}
121-
}
115+
* {
116+
@apply border-border outline-ring/50;
117+
}
118+
body {
119+
@apply bg-background text-foreground;
120+
}
121+
}

‎tools/server/webui/src/lib/components/ChatForm.svelte‎

Lines changed: 0 additions & 86 deletions
This file was deleted.

0 commit comments

Comments
 (0)