@directus/themes 0.0.2 → 0.1.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.
Files changed (11) hide show
  1. package/dist/index.d.ts +4 -106
  2. package/dist/index.js +411 -60
  3. package/dist/schema.d.ts +123 -0
  4. package/dist/schema.json +464 -0
  5. package/dist/store.d.ts +686 -0
  6. package/dist/theme-provider.vue.d.ts +487 -0
  7. package/dist/themes/dark-directus.d.ts +2 -0
  8. package/dist/themes/light-directus.d.ts +2 -0
  9. package/dist/use-fonts.d.ts +6 -0
  10. package/dist/use-theme.d.ts +117 -0
  11. package/package.json +22 -14
package/dist/schema.d.ts ADDED
@@ -0,0 +1,123 @@
1
+ import type { Static } from '@sinclair/typebox';
2
+ export declare const TypeId: {
3
+ Color: string;
4
+ FontFamily: string;
5
+ };
6
+ export declare const ThemeSchema: import("@sinclair/typebox").TObject<{
7
+ name: import("@sinclair/typebox").TString;
8
+ appearance: import("@sinclair/typebox").TUnion<[import("@sinclair/typebox").TLiteral<"light">, import("@sinclair/typebox").TLiteral<"dark">]>;
9
+ rules: import("@sinclair/typebox").TObject<{
10
+ foreground: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
11
+ foregroundSubdued: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
12
+ foregroundAccent: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
13
+ background: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
14
+ primary: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
15
+ primaryBackground: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
16
+ primarySubdued: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
17
+ primaryAccent: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
18
+ secondary: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
19
+ secondaryBackground: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
20
+ secondarySubdued: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
21
+ secondaryAccent: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
22
+ success: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
23
+ successBackground: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
24
+ successSubdued: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
25
+ successAccent: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
26
+ warning: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
27
+ warningBackground: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
28
+ warningSubdued: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
29
+ warningAccent: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
30
+ danger: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
31
+ dangerBackground: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
32
+ dangerSubdued: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
33
+ dangerAccent: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
34
+ fontFamilyDisplay: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
35
+ fontFamilySansSerif: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
36
+ fontFamilySerif: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
37
+ fontFamilyMonospace: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
38
+ navigation: import("@sinclair/typebox").TObject<{
39
+ background: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
40
+ project: import("@sinclair/typebox").TObject<{
41
+ background: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
42
+ foreground: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
43
+ fontFamily: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
44
+ }>;
45
+ modules: import("@sinclair/typebox").TObject<{
46
+ background: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
47
+ button: import("@sinclair/typebox").TObject<{
48
+ foreground: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
49
+ foregroundHover: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
50
+ foregroundActive: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
51
+ background: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
52
+ backgroundHover: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
53
+ backgroundActive: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
54
+ }>;
55
+ }>;
56
+ list: import("@sinclair/typebox").TObject<{
57
+ icon: import("@sinclair/typebox").TObject<{
58
+ foreground: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
59
+ foregroundHover: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
60
+ foregroundActive: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
61
+ }>;
62
+ foreground: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
63
+ foregroundHover: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
64
+ foregroundActive: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
65
+ background: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
66
+ backgroundHover: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
67
+ backgroundActive: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
68
+ fontFamily: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
69
+ }>;
70
+ }>;
71
+ header: import("@sinclair/typebox").TObject<{
72
+ background: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
73
+ headline: import("@sinclair/typebox").TObject<{
74
+ foreground: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
75
+ fontFamily: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
76
+ }>;
77
+ title: import("@sinclair/typebox").TObject<{
78
+ foreground: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
79
+ fontFamily: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
80
+ }>;
81
+ }>;
82
+ form: import("@sinclair/typebox").TObject<{
83
+ field: import("@sinclair/typebox").TObject<{
84
+ label: import("@sinclair/typebox").TObject<{
85
+ foreground: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
86
+ fontFamily: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
87
+ }>;
88
+ input: import("@sinclair/typebox").TObject<{
89
+ background: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
90
+ foreground: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
91
+ foregroundSubdued: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
92
+ }>;
93
+ }>;
94
+ }>;
95
+ sidebar: import("@sinclair/typebox").TObject<{
96
+ background: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
97
+ foreground: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
98
+ fontFamily: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
99
+ section: import("@sinclair/typebox").TObject<{
100
+ toggle: import("@sinclair/typebox").TObject<{
101
+ icon: import("@sinclair/typebox").TObject<{
102
+ foreground: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
103
+ foregroundHover: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
104
+ foregroundActive: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
105
+ }>;
106
+ foreground: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
107
+ foregroundHover: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
108
+ foregroundActive: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
109
+ background: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
110
+ backgroundHover: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
111
+ backgroundActive: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
112
+ fontFamily: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
113
+ }>;
114
+ }>;
115
+ }>;
116
+ }>;
117
+ }>;
118
+ export declare const Definitions: {
119
+ $defs: {
120
+ [x: string]: import("@sinclair/typebox").TRef<import("@sinclair/typebox").TString>;
121
+ };
122
+ };
123
+ export type Theme = Static<typeof ThemeSchema>;
package/dist/schema.json ADDED
@@ -0,0 +1,464 @@
1
+ {
2
+ "type": "object",
3
+ "properties": {
4
+ "name": {
5
+ "type": "string"
6
+ },
7
+ "appearance": {
8
+ "anyOf": [
9
+ {
10
+ "const": "light",
11
+ "type": "string"
12
+ },
13
+ {
14
+ "const": "dark",
15
+ "type": "string"
16
+ }
17
+ ]
18
+ },
19
+ "rules": {
20
+ "type": "object",
21
+ "properties": {
22
+ "foreground": {
23
+ "$ref": "Color"
24
+ },
25
+ "foregroundSubdued": {
26
+ "$ref": "Color"
27
+ },
28
+ "foregroundAccent": {
29
+ "$ref": "Color"
30
+ },
31
+ "background": {
32
+ "$ref": "Color"
33
+ },
34
+ "primary": {
35
+ "$ref": "Color"
36
+ },
37
+ "primaryBackground": {
38
+ "$ref": "Color"
39
+ },
40
+ "primarySubdued": {
41
+ "$ref": "Color"
42
+ },
43
+ "primaryAccent": {
44
+ "$ref": "Color"
45
+ },
46
+ "secondary": {
47
+ "$ref": "Color"
48
+ },
49
+ "secondaryBackground": {
50
+ "$ref": "Color"
51
+ },
52
+ "secondarySubdued": {
53
+ "$ref": "Color"
54
+ },
55
+ "secondaryAccent": {
56
+ "$ref": "Color"
57
+ },
58
+ "success": {
59
+ "$ref": "Color"
60
+ },
61
+ "successBackground": {
62
+ "$ref": "Color"
63
+ },
64
+ "successSubdued": {
65
+ "$ref": "Color"
66
+ },
67
+ "successAccent": {
68
+ "$ref": "Color"
69
+ },
70
+ "warning": {
71
+ "$ref": "Color"
72
+ },
73
+ "warningBackground": {
74
+ "$ref": "Color"
75
+ },
76
+ "warningSubdued": {
77
+ "$ref": "Color"
78
+ },
79
+ "warningAccent": {
80
+ "$ref": "Color"
81
+ },
82
+ "danger": {
83
+ "$ref": "Color"
84
+ },
85
+ "dangerBackground": {
86
+ "$ref": "Color"
87
+ },
88
+ "dangerSubdued": {
89
+ "$ref": "Color"
90
+ },
91
+ "dangerAccent": {
92
+ "$ref": "Color"
93
+ },
94
+ "fontFamilyDisplay": {
95
+ "$ref": "FontFamily"
96
+ },
97
+ "fontFamilySansSerif": {
98
+ "$ref": "FontFamily"
99
+ },
100
+ "fontFamilySerif": {
101
+ "$ref": "FontFamily"
102
+ },
103
+ "fontFamilyMonospace": {
104
+ "$ref": "FontFamily"
105
+ },
106
+ "navigation": {
107
+ "type": "object",
108
+ "properties": {
109
+ "background": {
110
+ "$ref": "Color"
111
+ },
112
+ "project": {
113
+ "type": "object",
114
+ "properties": {
115
+ "background": {
116
+ "$ref": "Color"
117
+ },
118
+ "foreground": {
119
+ "$ref": "Color"
120
+ },
121
+ "fontFamily": {
122
+ "$ref": "FontFamily"
123
+ }
124
+ },
125
+ "required": [
126
+ "background",
127
+ "foreground",
128
+ "fontFamily"
129
+ ]
130
+ },
131
+ "modules": {
132
+ "type": "object",
133
+ "properties": {
134
+ "background": {
135
+ "$ref": "Color"
136
+ },
137
+ "button": {
138
+ "type": "object",
139
+ "properties": {
140
+ "foreground": {
141
+ "$ref": "Color"
142
+ },
143
+ "foregroundHover": {
144
+ "$ref": "Color"
145
+ },
146
+ "foregroundActive": {
147
+ "$ref": "Color"
148
+ },
149
+ "background": {
150
+ "$ref": "Color"
151
+ },
152
+ "backgroundHover": {
153
+ "$ref": "Color"
154
+ },
155
+ "backgroundActive": {
156
+ "$ref": "Color"
157
+ }
158
+ },
159
+ "required": [
160
+ "foreground",
161
+ "foregroundHover",
162
+ "foregroundActive",
163
+ "background",
164
+ "backgroundHover",
165
+ "backgroundActive"
166
+ ]
167
+ }
168
+ },
169
+ "required": [
170
+ "background",
171
+ "button"
172
+ ]
173
+ },
174
+ "list": {
175
+ "type": "object",
176
+ "properties": {
177
+ "icon": {
178
+ "type": "object",
179
+ "properties": {
180
+ "foreground": {
181
+ "$ref": "Color"
182
+ },
183
+ "foregroundHover": {
184
+ "$ref": "Color"
185
+ },
186
+ "foregroundActive": {
187
+ "$ref": "Color"
188
+ }
189
+ },
190
+ "required": [
191
+ "foreground",
192
+ "foregroundHover",
193
+ "foregroundActive"
194
+ ]
195
+ },
196
+ "foreground": {
197
+ "$ref": "Color"
198
+ },
199
+ "foregroundHover": {
200
+ "$ref": "Color"
201
+ },
202
+ "foregroundActive": {
203
+ "$ref": "Color"
204
+ },
205
+ "background": {
206
+ "$ref": "Color"
207
+ },
208
+ "backgroundHover": {
209
+ "$ref": "Color"
210
+ },
211
+ "backgroundActive": {
212
+ "$ref": "Color"
213
+ },
214
+ "fontFamily": {
215
+ "$ref": "FontFamily"
216
+ }
217
+ },
218
+ "required": [
219
+ "icon",
220
+ "foreground",
221
+ "foregroundHover",
222
+ "foregroundActive",
223
+ "background",
224
+ "backgroundHover",
225
+ "backgroundActive",
226
+ "fontFamily"
227
+ ]
228
+ }
229
+ },
230
+ "required": [
231
+ "background",
232
+ "project",
233
+ "modules",
234
+ "list"
235
+ ]
236
+ },
237
+ "header": {
238
+ "type": "object",
239
+ "properties": {
240
+ "background": {
241
+ "$ref": "Color"
242
+ },
243
+ "headline": {
244
+ "type": "object",
245
+ "properties": {
246
+ "foreground": {
247
+ "$ref": "Color"
248
+ },
249
+ "fontFamily": {
250
+ "$ref": "FontFamily"
251
+ }
252
+ },
253
+ "required": [
254
+ "foreground",
255
+ "fontFamily"
256
+ ]
257
+ },
258
+ "title": {
259
+ "type": "object",
260
+ "properties": {
261
+ "foreground": {
262
+ "$ref": "Color"
263
+ },
264
+ "fontFamily": {
265
+ "$ref": "FontFamily"
266
+ }
267
+ },
268
+ "required": [
269
+ "foreground",
270
+ "fontFamily"
271
+ ]
272
+ }
273
+ },
274
+ "required": [
275
+ "background",
276
+ "headline",
277
+ "title"
278
+ ]
279
+ },
280
+ "form": {
281
+ "type": "object",
282
+ "properties": {
283
+ "field": {
284
+ "type": "object",
285
+ "properties": {
286
+ "label": {
287
+ "type": "object",
288
+ "properties": {
289
+ "foreground": {
290
+ "$ref": "Color"
291
+ },
292
+ "fontFamily": {
293
+ "$ref": "FontFamily"
294
+ }
295
+ },
296
+ "required": [
297
+ "foreground",
298
+ "fontFamily"
299
+ ]
300
+ },
301
+ "input": {
302
+ "type": "object",
303
+ "properties": {
304
+ "background": {
305
+ "$ref": "Color"
306
+ },
307
+ "foreground": {
308
+ "$ref": "Color"
309
+ },
310
+ "foregroundSubdued": {
311
+ "$ref": "Color"
312
+ }
313
+ },
314
+ "required": [
315
+ "background",
316
+ "foreground",
317
+ "foregroundSubdued"
318
+ ]
319
+ }
320
+ },
321
+ "required": [
322
+ "label",
323
+ "input"
324
+ ]
325
+ }
326
+ },
327
+ "required": [
328
+ "field"
329
+ ]
330
+ },
331
+ "sidebar": {
332
+ "type": "object",
333
+ "properties": {
334
+ "background": {
335
+ "$ref": "Color"
336
+ },
337
+ "foreground": {
338
+ "$ref": "Color"
339
+ },
340
+ "fontFamily": {
341
+ "$ref": "FontFamily"
342
+ },
343
+ "section": {
344
+ "type": "object",
345
+ "properties": {
346
+ "toggle": {
347
+ "type": "object",
348
+ "properties": {
349
+ "icon": {
350
+ "type": "object",
351
+ "properties": {
352
+ "foreground": {
353
+ "$ref": "Color"
354
+ },
355
+ "foregroundHover": {
356
+ "$ref": "Color"
357
+ },
358
+ "foregroundActive": {
359
+ "$ref": "Color"
360
+ }
361
+ },
362
+ "required": [
363
+ "foreground",
364
+ "foregroundHover",
365
+ "foregroundActive"
366
+ ]
367
+ },
368
+ "foreground": {
369
+ "$ref": "Color"
370
+ },
371
+ "foregroundHover": {
372
+ "$ref": "Color"
373
+ },
374
+ "foregroundActive": {
375
+ "$ref": "Color"
376
+ },
377
+ "background": {
378
+ "$ref": "Color"
379
+ },
380
+ "backgroundHover": {
381
+ "$ref": "Color"
382
+ },
383
+ "backgroundActive": {
384
+ "$ref": "Color"
385
+ },
386
+ "fontFamily": {
387
+ "$ref": "FontFamily"
388
+ }
389
+ },
390
+ "required": [
391
+ "icon",
392
+ "foreground",
393
+ "foregroundHover",
394
+ "foregroundActive",
395
+ "background",
396
+ "backgroundHover",
397
+ "backgroundActive",
398
+ "fontFamily"
399
+ ]
400
+ }
401
+ },
402
+ "required": [
403
+ "toggle"
404
+ ]
405
+ }
406
+ },
407
+ "required": [
408
+ "background",
409
+ "foreground",
410
+ "fontFamily",
411
+ "section"
412
+ ]
413
+ }
414
+ },
415
+ "required": [
416
+ "foreground",
417
+ "foregroundSubdued",
418
+ "foregroundAccent",
419
+ "background",
420
+ "primary",
421
+ "primaryBackground",
422
+ "primarySubdued",
423
+ "primaryAccent",
424
+ "secondary",
425
+ "secondaryBackground",
426
+ "secondarySubdued",
427
+ "secondaryAccent",
428
+ "success",
429
+ "successBackground",
430
+ "successSubdued",
431
+ "successAccent",
432
+ "warning",
433
+ "warningBackground",
434
+ "warningSubdued",
435
+ "warningAccent",
436
+ "danger",
437
+ "dangerBackground",
438
+ "dangerSubdued",
439
+ "dangerAccent",
440
+ "fontFamilyDisplay",
441
+ "fontFamilySansSerif",
442
+ "fontFamilySerif",
443
+ "fontFamilyMonospace",
444
+ "navigation",
445
+ "header",
446
+ "form",
447
+ "sidebar"
448
+ ]
449
+ }
450
+ },
451
+ "required": [
452
+ "name",
453
+ "appearance",
454
+ "rules"
455
+ ],
456
+ "$defs": {
457
+ "Color": {
458
+ "$ref": "Color"
459
+ },
460
+ "FontFamily": {
461
+ "$ref": "FontFamily"
462
+ }
463
+ }
464
+ }