@cryptlex/web-components 1.0.0 → 1.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +11 -27
- package/dist/components/ui/accordion.es.js +47 -0
- package/dist/components/ui/accordion.es.js.map +1 -0
- package/dist/components/ui/badge.es.js +13 -12
- package/dist/components/ui/badge.es.js.map +1 -1
- package/dist/components/ui/button.es.js +1 -1
- package/dist/components/ui/button.es.js.map +1 -1
- package/dist/components/ui/card.es.js +26 -26
- package/dist/components/ui/card.es.js.map +1 -1
- package/dist/components/ui/input.es.js +10 -11
- package/dist/components/ui/input.es.js.map +1 -1
- package/dist/components/ui/navigation-menu.es.js +122 -0
- package/dist/components/ui/navigation-menu.es.js.map +1 -0
- package/dist/components/ui/password-input.es.js +8 -8
- package/dist/components/ui/password-input.es.js.map +1 -1
- package/dist/index.es.d.ts +31 -1
- package/dist/index.es.js +99 -83
- package/dist/index.es.js.map +1 -1
- package/lib/index.css +83 -11
- package/lib/tokens.css +170 -139
- package/package.json +18 -15
- package/tailwind.preset.ts +168 -68
package/lib/tokens.css
CHANGED
|
@@ -1,143 +1,174 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
This CSS is generated by tokens.css, do not modify directly.
|
|
3
|
+
Instead, compile the SCSS file again to create modifications.
|
|
4
|
+
*/
|
|
1
5
|
:root {
|
|
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
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
6
|
+
--primary-hue: 240;
|
|
7
|
+
--xprimary-1: 0.99 0.02 var(--primary-hue);
|
|
8
|
+
--xprimary-2: 0.97 0.03 var(--primary-hue);
|
|
9
|
+
--xprimary-3: 0.9 0.04 var(--primary-hue);
|
|
10
|
+
--xprimary-4: 0.72 0.13 var(--primary-hue);
|
|
11
|
+
--xprimary-5: 0.67 0.13 var(--primary-hue);
|
|
12
|
+
--xprimary-6: 0.5 0.13 var(--primary-hue);
|
|
13
|
+
--xprimary-7: 0.35 0.13 var(--primary-hue);
|
|
14
|
+
--xprimary-8: 0.25 0.13 var(--primary-hue);
|
|
15
|
+
--xprimary-9: 0.13 0.13 var(--primary-hue);
|
|
16
|
+
--xprimary-10: 0.05 0.13 var(--primary-hue);
|
|
17
|
+
--primary-1: var(--xprimary-1);
|
|
18
|
+
--primary-2: var(--xprimary-2);
|
|
19
|
+
--primary-3: var(--xprimary-3);
|
|
20
|
+
--primary-4: var(--xprimary-4);
|
|
21
|
+
--primary-5: var(--xprimary-5);
|
|
22
|
+
--primary-6: var(--xprimary-6);
|
|
23
|
+
--primary-7: var(--xprimary-7);
|
|
24
|
+
--primary-8: var(--xprimary-8);
|
|
25
|
+
--primary-9: var(--xprimary-9);
|
|
26
|
+
--primary-10: var(--xprimary-10);
|
|
27
|
+
--secondary-hue: calc(var(--primary-hue) + 60);
|
|
28
|
+
--xsecondary-1: 0.99 0.02 var(--secondary-hue);
|
|
29
|
+
--xsecondary-2: 0.97 0.03 var(--secondary-hue);
|
|
30
|
+
--xsecondary-3: 0.9 0.04 var(--secondary-hue);
|
|
31
|
+
--xsecondary-4: 0.72 0.13 var(--secondary-hue);
|
|
32
|
+
--xsecondary-5: 0.67 0.13 var(--secondary-hue);
|
|
33
|
+
--xsecondary-6: 0.5 0.13 var(--secondary-hue);
|
|
34
|
+
--xsecondary-7: 0.35 0.13 var(--secondary-hue);
|
|
35
|
+
--xsecondary-8: 0.25 0.13 var(--secondary-hue);
|
|
36
|
+
--xsecondary-9: 0.13 0.13 var(--secondary-hue);
|
|
37
|
+
--xsecondary-10: 0.05 0.13 var(--secondary-hue);
|
|
38
|
+
--secondary-1: var(--xsecondary-1);
|
|
39
|
+
--secondary-2: var(--xsecondary-2);
|
|
40
|
+
--secondary-3: var(--xsecondary-3);
|
|
41
|
+
--secondary-4: var(--xsecondary-4);
|
|
42
|
+
--secondary-5: var(--xsecondary-5);
|
|
43
|
+
--secondary-6: var(--xsecondary-6);
|
|
44
|
+
--secondary-7: var(--xsecondary-7);
|
|
45
|
+
--secondary-8: var(--xsecondary-8);
|
|
46
|
+
--secondary-9: var(--xsecondary-9);
|
|
47
|
+
--secondary-10: var(--xsecondary-10);
|
|
48
|
+
--destructive-hue: 10;
|
|
49
|
+
--xdestructive-1: 0.99 0.02 var(--destructive-hue);
|
|
50
|
+
--xdestructive-2: 0.97 0.03 var(--destructive-hue);
|
|
51
|
+
--xdestructive-3: 0.9 0.04 var(--destructive-hue);
|
|
52
|
+
--xdestructive-4: 0.72 0.13 var(--destructive-hue);
|
|
53
|
+
--xdestructive-5: 0.67 0.13 var(--destructive-hue);
|
|
54
|
+
--xdestructive-6: 0.5 0.13 var(--destructive-hue);
|
|
55
|
+
--xdestructive-7: 0.35 0.13 var(--destructive-hue);
|
|
56
|
+
--xdestructive-8: 0.25 0.13 var(--destructive-hue);
|
|
57
|
+
--xdestructive-9: 0.13 0.13 var(--destructive-hue);
|
|
58
|
+
--xdestructive-10: 0.05 0.13 var(--destructive-hue);
|
|
59
|
+
--destructive-1: var(--xdestructive-1);
|
|
60
|
+
--destructive-2: var(--xdestructive-2);
|
|
61
|
+
--destructive-3: var(--xdestructive-3);
|
|
62
|
+
--destructive-4: var(--xdestructive-4);
|
|
63
|
+
--destructive-5: var(--xdestructive-5);
|
|
64
|
+
--destructive-6: var(--xdestructive-6);
|
|
65
|
+
--destructive-7: var(--xdestructive-7);
|
|
66
|
+
--destructive-8: var(--xdestructive-8);
|
|
67
|
+
--destructive-9: var(--xdestructive-9);
|
|
68
|
+
--destructive-10: var(--xdestructive-10);
|
|
69
|
+
--success-hue: 152;
|
|
70
|
+
--xsuccess-1: 0.99 0.02 var(--success-hue);
|
|
71
|
+
--xsuccess-2: 0.97 0.03 var(--success-hue);
|
|
72
|
+
--xsuccess-3: 0.9 0.04 var(--success-hue);
|
|
73
|
+
--xsuccess-4: 0.72 0.13 var(--success-hue);
|
|
74
|
+
--xsuccess-5: 0.67 0.13 var(--success-hue);
|
|
75
|
+
--xsuccess-6: 0.5 0.13 var(--success-hue);
|
|
76
|
+
--xsuccess-7: 0.35 0.13 var(--success-hue);
|
|
77
|
+
--xsuccess-8: 0.25 0.13 var(--success-hue);
|
|
78
|
+
--xsuccess-9: 0.13 0.13 var(--success-hue);
|
|
79
|
+
--xsuccess-10: 0.05 0.13 var(--success-hue);
|
|
80
|
+
--success-1: var(--xsuccess-1);
|
|
81
|
+
--success-2: var(--xsuccess-2);
|
|
82
|
+
--success-3: var(--xsuccess-3);
|
|
83
|
+
--success-4: var(--xsuccess-4);
|
|
84
|
+
--success-5: var(--xsuccess-5);
|
|
85
|
+
--success-6: var(--xsuccess-6);
|
|
86
|
+
--success-7: var(--xsuccess-7);
|
|
87
|
+
--success-8: var(--xsuccess-8);
|
|
88
|
+
--success-9: var(--xsuccess-9);
|
|
89
|
+
--success-10: var(--xsuccess-10);
|
|
90
|
+
--neutral-hue: var(--primary-hue);
|
|
91
|
+
--neutral-s: 0.01;
|
|
92
|
+
--xneutral-1: 0.99 var(--neutral-s) var(--neutral-hue);
|
|
93
|
+
--xneutral-2: 0.97 var(--neutral-s) var(--neutral-hue);
|
|
94
|
+
--xneutral-3: 0.9 var(--neutral-s) var(--neutral-hue);
|
|
95
|
+
--xneutral-4: 0.72 var(--neutral-s) var(--neutral-hue);
|
|
96
|
+
--xneutral-5: 0.67 var(--neutral-s) var(--neutral-hue);
|
|
97
|
+
--xneutral-6: 0.5 var(--neutral-s) var(--neutral-hue);
|
|
98
|
+
--xneutral-7: 0.4 var(--neutral-s) var(--neutral-hue);
|
|
99
|
+
--xneutral-8: 0.35 var(--neutral-s) var(--neutral-hue);
|
|
100
|
+
--xneutral-9: 0.33 var(--neutral-s) var(--neutral-hue);
|
|
101
|
+
--xneutral-10: 0.25 var(--neutral-s) var(--neutral-hue);
|
|
102
|
+
--neutral-1: var(--xneutral-1);
|
|
103
|
+
--neutral-2: var(--xneutral-2);
|
|
104
|
+
--neutral-3: var(--xneutral-3);
|
|
105
|
+
--neutral-4: var(--xneutral-4);
|
|
106
|
+
--neutral-5: var(--xneutral-5);
|
|
107
|
+
--neutral-6: var(--xneutral-6);
|
|
108
|
+
--neutral-7: var(--xneutral-7);
|
|
109
|
+
--neutral-8: var(--xneutral-8);
|
|
110
|
+
--neutral-9: var(--xneutral-9);
|
|
111
|
+
--neutral-10: var(--xneutral-10);
|
|
112
|
+
/* Increase or decrease the number to change the vertical spacing globally*/
|
|
113
|
+
/* Base Vertical Spacing */
|
|
114
|
+
--space: 1.2;
|
|
115
|
+
/* Vertical Spacing - multiplier */
|
|
116
|
+
--vspace-1: calc(var(--space) * 1rem);
|
|
117
|
+
--vspace-2: calc(3 * var(--space) * 1rem);
|
|
118
|
+
--vspace-3: calc(2 * var(--space) * 1rem);
|
|
119
|
+
--vspace-4: calc(1.5 * var(--space) * 1rem);
|
|
120
|
+
--vspace-5: calc(0.5 * var(--space) * 1rem);
|
|
107
121
|
}
|
|
108
122
|
|
|
109
123
|
.dark {
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
124
|
+
--primary-1: var(--xprimary-10);
|
|
125
|
+
--primary-2: var(--xprimary-9);
|
|
126
|
+
--primary-3: var(--xprimary-8);
|
|
127
|
+
--primary-4: var(--xprimary-7);
|
|
128
|
+
--primary-5: var(--xprimary-6);
|
|
129
|
+
--primary-6: var(--xprimary-5);
|
|
130
|
+
--primary-7: var(--xprimary-4);
|
|
131
|
+
--primary-8: var(--xprimary-3);
|
|
132
|
+
--primary-9: var(--xprimary-2);
|
|
133
|
+
--primary-10: var(--xprimary-1);
|
|
134
|
+
--secondary-1: var(--xsecondary-10);
|
|
135
|
+
--secondary-2: var(--xsecondary-9);
|
|
136
|
+
--secondary-3: var(--xsecondary-8);
|
|
137
|
+
--secondary-4: var(--xsecondary-7);
|
|
138
|
+
--secondary-5: var(--xsecondary-6);
|
|
139
|
+
--secondary-6: var(--xsecondary-5);
|
|
140
|
+
--secondary-7: var(--xsecondary-4);
|
|
141
|
+
--secondary-8: var(--xsecondary-3);
|
|
142
|
+
--secondary-9: var(--xsecondary-2);
|
|
143
|
+
--secondary-10: var(--xsecondary-1);
|
|
144
|
+
--destructive-1: var(--xdestructive-10);
|
|
145
|
+
--destructive-2: var(--xdestructive-9);
|
|
146
|
+
--destructive-3: var(--xdestructive-8);
|
|
147
|
+
--destructive-4: var(--xdestructive-7);
|
|
148
|
+
--destructive-5: var(--xdestructive-6);
|
|
149
|
+
--destructive-6: var(--xdestructive-5);
|
|
150
|
+
--destructive-7: var(--xdestructive-4);
|
|
151
|
+
--destructive-8: var(--xdestructive-3);
|
|
152
|
+
--destructive-9: var(--xdestructive-2);
|
|
153
|
+
--destructive-10: var(--xdestructive-1);
|
|
154
|
+
--success-1: var(--xsuccess-10);
|
|
155
|
+
--success-2: var(--xsuccess-9);
|
|
156
|
+
--success-3: var(--xsuccess-8);
|
|
157
|
+
--success-4: var(--xsuccess-7);
|
|
158
|
+
--success-5: var(--xsuccess-6);
|
|
159
|
+
--success-6: var(--xsuccess-5);
|
|
160
|
+
--success-7: var(--xsuccess-4);
|
|
161
|
+
--success-8: var(--xsuccess-3);
|
|
162
|
+
--success-9: var(--xsuccess-2);
|
|
163
|
+
--success-10: var(--xsuccess-1);
|
|
164
|
+
--neutral-1: var(--xneutral-10);
|
|
165
|
+
--neutral-2: var(--xneutral-9);
|
|
166
|
+
--neutral-3: var(--xneutral-8);
|
|
167
|
+
--neutral-4: var(--xneutral-7);
|
|
168
|
+
--neutral-5: var(--xneutral-6);
|
|
169
|
+
--neutral-6: var(--xneutral-5);
|
|
170
|
+
--neutral-7: var(--xneutral-4);
|
|
171
|
+
--neutral-8: var(--xneutral-3);
|
|
172
|
+
--neutral-9: var(--xneutral-2);
|
|
173
|
+
--neutral-10: var(--xneutral-1);
|
|
174
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@cryptlex/web-components",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.2.0",
|
|
4
4
|
"description": "React component library for Cryptlex web applications",
|
|
5
5
|
"author": "Cryptlex",
|
|
6
6
|
"type": "module",
|
|
@@ -42,6 +42,7 @@
|
|
|
42
42
|
"access": "public"
|
|
43
43
|
},
|
|
44
44
|
"peerDependencies": {
|
|
45
|
+
"@radix-ui/react-accordion": "^1.2.1",
|
|
45
46
|
"@radix-ui/react-checkbox": "^1.1.2",
|
|
46
47
|
"@radix-ui/react-collapsible": "^1.1.1",
|
|
47
48
|
"@radix-ui/react-dialog": "^1.1.2",
|
|
@@ -54,6 +55,7 @@
|
|
|
54
55
|
"@radix-ui/react-separator": "^1.1.0",
|
|
55
56
|
"@radix-ui/react-slot": "^1.1.0",
|
|
56
57
|
"@radix-ui/react-tooltip": "^1.1.3",
|
|
58
|
+
"@radix-ui/react-navigation-menu": "^1.2.1",
|
|
57
59
|
"@tanstack/react-table": "^8.20.5",
|
|
58
60
|
"class-variance-authority": "^0.7.0",
|
|
59
61
|
"clsx": "^2.1.1",
|
|
@@ -63,24 +65,23 @@
|
|
|
63
65
|
"react": "^18.3.1",
|
|
64
66
|
"react-day-picker": "8.10.1",
|
|
65
67
|
"react-dom": "^18.3.1",
|
|
66
|
-
"recharts": "^2.13.0",
|
|
67
68
|
"react-hook-form": "^7.53.1",
|
|
69
|
+
"recharts": "^2.13.0",
|
|
68
70
|
"tailwind-merge": "^2.5.4",
|
|
69
71
|
"tailwindcss": "^3.4.14",
|
|
70
72
|
"tailwindcss-animate": "^1.0.7"
|
|
71
73
|
},
|
|
72
74
|
"devDependencies": {
|
|
73
|
-
"@chromatic-com/storybook": "^1.9.0",
|
|
74
75
|
"@eslint/js": "^9.11.1",
|
|
75
|
-
"@storybook/addon-docs": "^8.
|
|
76
|
-
"@storybook/addon-essentials": "^8.
|
|
77
|
-
"@storybook/addon-interactions": "^8.
|
|
78
|
-
"@storybook/addon-links": "^8.
|
|
79
|
-
"@storybook/addon-onboarding": "^8.
|
|
80
|
-
"@storybook/blocks": "^8.
|
|
81
|
-
"@storybook/react": "^8.
|
|
82
|
-
"@storybook/react-vite": "^8.
|
|
83
|
-
"@storybook/test": "^8.
|
|
76
|
+
"@storybook/addon-docs": "^8.4.2",
|
|
77
|
+
"@storybook/addon-essentials": "^8.4.2",
|
|
78
|
+
"@storybook/addon-interactions": "^8.4.2",
|
|
79
|
+
"@storybook/addon-links": "^8.4.2",
|
|
80
|
+
"@storybook/addon-onboarding": "^8.4.2",
|
|
81
|
+
"@storybook/blocks": "^8.4.2",
|
|
82
|
+
"@storybook/react": "^8.4.2",
|
|
83
|
+
"@storybook/react-vite": "^8.4.2",
|
|
84
|
+
"@storybook/test": "^8.4.2",
|
|
84
85
|
"@types/node": "^22.7.8",
|
|
85
86
|
"@types/react": "^18.3.10",
|
|
86
87
|
"@types/react-dom": "^18.3.0",
|
|
@@ -89,10 +90,11 @@
|
|
|
89
90
|
"eslint": "^9.11.1",
|
|
90
91
|
"eslint-plugin-react-hooks": "^5.1.0-rc.0",
|
|
91
92
|
"eslint-plugin-react-refresh": "^0.4.12",
|
|
92
|
-
"eslint-plugin-storybook": "^0.
|
|
93
|
+
"eslint-plugin-storybook": "^0.11.0",
|
|
93
94
|
"globals": "^15.9.0",
|
|
94
95
|
"postcss": "^8.4.47",
|
|
95
|
-
"
|
|
96
|
+
"sass": "^1.80.6",
|
|
97
|
+
"storybook": "^8.4.2",
|
|
96
98
|
"typescript": "^5.5.3",
|
|
97
99
|
"typescript-eslint": "^8.7.0",
|
|
98
100
|
"vite": "^5.4.8",
|
|
@@ -102,6 +104,7 @@
|
|
|
102
104
|
"build": "tsc && vite build",
|
|
103
105
|
"lint": "eslint .",
|
|
104
106
|
"storybook": "storybook dev -p 6006",
|
|
105
|
-
"build:storybook": "storybook build"
|
|
107
|
+
"build:storybook": "storybook build",
|
|
108
|
+
"build:tokens": "sass --no-source-map ./lib/tokens.scss ./lib/tokens.css"
|
|
106
109
|
}
|
|
107
110
|
}
|
package/tailwind.preset.ts
CHANGED
|
@@ -1,77 +1,177 @@
|
|
|
1
1
|
import type { Config } from 'tailwindcss';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
darkMode: ['class'],
|
|
6
|
-
content
|
|
7
|
-
|
|
8
|
-
'./stories/**/*.{tsx,ts}', // Paths to any storybook files
|
|
9
|
-
'./.storybook/**/*.{tsx,ts}', // Storybook config paths
|
|
10
|
-
],
|
|
3
|
+
export default {
|
|
4
|
+
// Enable dark mode based on class.
|
|
5
|
+
darkMode: ['class'],
|
|
6
|
+
// The preset does not define content, this is done in the host.
|
|
7
|
+
content: [],
|
|
11
8
|
theme: {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
9
|
+
borderRadius: {
|
|
10
|
+
lg: 'var(--radius)',
|
|
11
|
+
md: 'calc(var(--radius) - 2px)',
|
|
12
|
+
sm: 'calc(var(--radius) - 4px)',
|
|
13
|
+
},
|
|
14
|
+
colors: {
|
|
15
|
+
transparent: 'transparent',
|
|
16
|
+
current: 'currentColor',
|
|
17
|
+
white: '#ffffff',
|
|
18
|
+
black: '#000000',
|
|
19
|
+
background: 'oklch(var(--background) / <alpha-value>)',
|
|
20
|
+
foreground: 'oklch(var(--foreground) / <alpha-value>)',
|
|
21
|
+
card: {
|
|
22
|
+
DEFAULT: 'oklch(var(--card) / <alpha-value>)',
|
|
23
|
+
foreground: 'oklch(var(--card-foreground) / <alpha-value>)',
|
|
17
24
|
},
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
foreground: 'oklch(var(--foreground))',
|
|
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
|
-
'oklch(var(--sidebar-accent-foreground))',
|
|
68
|
-
border: 'oklch(var(--sidebar-border))',
|
|
69
|
-
ring: 'oklch(var(--sidebar-ring))',
|
|
70
|
-
},
|
|
25
|
+
popover: {
|
|
26
|
+
DEFAULT: 'oklch(var(--popover) / <alpha-value>)',
|
|
27
|
+
foreground: 'oklch(var(--popover-foreground) / <alpha-value>)',
|
|
28
|
+
},
|
|
29
|
+
primary: {
|
|
30
|
+
DEFAULT: 'oklch(var(--primary) / <alpha-value>)',
|
|
31
|
+
foreground: 'oklch(var(--primary-foreground) / <alpha-value>)',
|
|
32
|
+
},
|
|
33
|
+
secondary: {
|
|
34
|
+
DEFAULT: 'oklch(var(--secondary) / <alpha-value>)',
|
|
35
|
+
foreground: 'oklch(var(--secondary-foreground) / <alpha-value>)',
|
|
36
|
+
},
|
|
37
|
+
muted: {
|
|
38
|
+
DEFAULT: 'oklch(var(--muted) / <alpha-value>)',
|
|
39
|
+
foreground: 'oklch(var(--muted-foreground) / <alpha-value>)',
|
|
40
|
+
},
|
|
41
|
+
accent: {
|
|
42
|
+
DEFAULT: 'oklch(var(--accent) / <alpha-value>)',
|
|
43
|
+
foreground: 'oklch(var(--accent-foreground) / <alpha-value>)',
|
|
44
|
+
},
|
|
45
|
+
destructive: {
|
|
46
|
+
DEFAULT: 'oklch(var(--destructive) / <alpha-value>)',
|
|
47
|
+
foreground: 'oklch(var(--destructive-foreground) / <alpha-value>)',
|
|
48
|
+
},
|
|
49
|
+
success: {
|
|
50
|
+
DEFAULT: 'oklch(var(--success) / <alpha-value>)',
|
|
51
|
+
foreground: 'oklch(var(--success-foreground) / <alpha-value>)',
|
|
52
|
+
},
|
|
53
|
+
border: 'oklch(var(--border) / <alpha-value>)',
|
|
54
|
+
input: 'oklch(var(--input) / <alpha-value>)',
|
|
55
|
+
ring: 'oklch(var(--ring) / <alpha-value>)',
|
|
56
|
+
chart: {
|
|
57
|
+
1: 'oklch(var(--chart-1) / <alpha-value>)',
|
|
58
|
+
2: 'oklch(var(--chart-2) / <alpha-value>)',
|
|
59
|
+
3: 'oklch(var(--chart-3) / <alpha-value>)',
|
|
60
|
+
4: 'oklch(var(--chart-4) / <alpha-value>)',
|
|
61
|
+
5: 'oklch(var(--chart-5) / <alpha-value>)',
|
|
62
|
+
},
|
|
63
|
+
sidebar: {
|
|
64
|
+
DEFAULT: 'oklch(var(--sidebar-background) / <alpha-value>)',
|
|
65
|
+
foreground: 'oklch(var(--sidebar-foreground) / <alpha-value>)',
|
|
66
|
+
primary: 'oklch(var(--sidebar-primary) / <alpha-value>)',
|
|
67
|
+
primaryForeground:
|
|
68
|
+
'oklch(var(--sidebar-primary-foreground) / <alpha-value>)',
|
|
69
|
+
accent: 'oklch(var(--sidebar-accent) / <alpha-value>)',
|
|
70
|
+
accentForeground:
|
|
71
|
+
'oklch(var(--sidebar-accent-foreground) / <alpha-value>)',
|
|
72
|
+
border: 'oklch(var(--sidebar-border) / <alpha-value>)',
|
|
73
|
+
ring: 'oklch(var(--sidebar-ring) / <alpha-value>)',
|
|
71
74
|
},
|
|
72
75
|
},
|
|
76
|
+
extend: {
|
|
77
|
+
keyframes: {
|
|
78
|
+
'accordion-down': {
|
|
79
|
+
from: {
|
|
80
|
+
height: '0'
|
|
81
|
+
},
|
|
82
|
+
to: {
|
|
83
|
+
height: 'var(--radix-accordion-content-height)'
|
|
84
|
+
}
|
|
85
|
+
},
|
|
86
|
+
'accordion-up': {
|
|
87
|
+
from: {
|
|
88
|
+
height: 'var(--radix-accordion-content-height)'
|
|
89
|
+
},
|
|
90
|
+
to: {
|
|
91
|
+
height: '0'
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
},
|
|
95
|
+
animation: {
|
|
96
|
+
'accordion-down': 'accordion-down 0.2s ease-out',
|
|
97
|
+
'accordion-up': 'accordion-up 0.2s ease-out'
|
|
98
|
+
},
|
|
99
|
+
spacing: {
|
|
100
|
+
'v1': 'var(--vspace-1)',
|
|
101
|
+
'v2': 'var(--vspace-2)',
|
|
102
|
+
'v3': 'var(--vspace-3)',
|
|
103
|
+
'v4': 'var(--vspace-4)',
|
|
104
|
+
'v5': 'var(--vspace-5)',
|
|
105
|
+
},
|
|
106
|
+
fontSize: {
|
|
107
|
+
// text-caption
|
|
108
|
+
caption: [
|
|
109
|
+
"0.7708em",
|
|
110
|
+
{
|
|
111
|
+
lineHeight: "16px",
|
|
112
|
+
fontWeight: "400",
|
|
113
|
+
},
|
|
114
|
+
],
|
|
115
|
+
// text-body
|
|
116
|
+
body: [
|
|
117
|
+
"14px",
|
|
118
|
+
{
|
|
119
|
+
lineHeight: "20px",
|
|
120
|
+
fontWeight: "400",
|
|
121
|
+
},
|
|
122
|
+
],
|
|
123
|
+
// text-heading-6
|
|
124
|
+
"heading-6": [
|
|
125
|
+
"1em",
|
|
126
|
+
{
|
|
127
|
+
lineHeight: "var(--vspace-1)",
|
|
128
|
+
letterSpacing: "0em"
|
|
129
|
+
},
|
|
130
|
+
],
|
|
131
|
+
// text-heading-5
|
|
132
|
+
"heading-5": [
|
|
133
|
+
"1.1667em",
|
|
134
|
+
{
|
|
135
|
+
lineHeight: "var(--vspace-1)"
|
|
136
|
+
},
|
|
137
|
+
],
|
|
138
|
+
// text-heading-4
|
|
139
|
+
"heading-4": [
|
|
140
|
+
"1.3333em",
|
|
141
|
+
{
|
|
142
|
+
lineHeight: "var(--vspace-1)"
|
|
143
|
+
},
|
|
144
|
+
],
|
|
145
|
+
// text-heading-3
|
|
146
|
+
"heading-3": [
|
|
147
|
+
"1.75em",
|
|
148
|
+
{
|
|
149
|
+
lineHeight: "1em",
|
|
150
|
+
fontWeight: "500",
|
|
151
|
+
},
|
|
152
|
+
],
|
|
153
|
+
|
|
154
|
+
// text-heading-2
|
|
155
|
+
"heading-2": [
|
|
156
|
+
"2.6458em",
|
|
157
|
+
{
|
|
158
|
+
lineHeight: "1em",
|
|
159
|
+
fontWeight: "300",
|
|
160
|
+
},
|
|
161
|
+
],
|
|
162
|
+
|
|
163
|
+
// text-heading-1
|
|
164
|
+
"heading-1": [
|
|
165
|
+
"5.2917em",
|
|
166
|
+
{
|
|
167
|
+
lineHeight: "calc(5.2917/var(--space) * var(--vspace-1))",
|
|
168
|
+
fontWeight: "400",
|
|
169
|
+
},
|
|
170
|
+
],
|
|
171
|
+
},
|
|
172
|
+
}
|
|
73
173
|
},
|
|
74
174
|
plugins: [require('tailwindcss-animate')], // Include any plugins you need
|
|
75
|
-
};
|
|
175
|
+
} satisfies Config;
|
|
76
176
|
|
|
77
|
-
export default tailwindPreset;
|
|
177
|
+
// export default tailwindPreset;
|