@directus/themes 0.0.2 → 0.0.3

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