@directus/themes 1.2.5 → 1.3.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 (21) hide show
  1. package/dist/index.d.ts +2139 -5
  2. package/dist/index.js +14867 -12190
  3. package/package.json +10 -11
  4. package/dist/components/index.d.ts +0 -1
  5. package/dist/components/theme-provider.vue.d.ts +0 -15
  6. package/dist/composables/index.d.ts +0 -2
  7. package/dist/composables/use-fonts.d.ts +0 -5
  8. package/dist/composables/use-fonts.test.d.ts +0 -1
  9. package/dist/composables/use-theme.d.ts +0 -519
  10. package/dist/stores/index.d.ts +0 -1
  11. package/dist/stores/theme.d.ts +0 -1586
  12. package/dist/themes/dark/default.d.ts +0 -259
  13. package/dist/themes/dark/index.d.ts +0 -1
  14. package/dist/themes/index.d.ts +0 -3
  15. package/dist/themes/light/color-match.d.ts +0 -98
  16. package/dist/themes/light/default.d.ts +0 -259
  17. package/dist/themes/light/index.d.ts +0 -3
  18. package/dist/themes/light/minimal.d.ts +0 -118
  19. package/dist/utils/define-theme.d.ts +0 -2
  20. package/dist/utils/index.d.ts +0 -2
  21. package/dist/utils/rules-to-css-vars.d.ts +0 -2
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@directus/themes",
3
- "version": "1.2.5",
3
+ "version": "1.3.0",
4
4
  "description": "Themes for Directus",
5
5
  "homepage": "https://directus.io",
6
6
  "repository": {
@@ -24,22 +24,21 @@
24
24
  "dependencies": {
25
25
  "decamelize": "6.0.1",
26
26
  "flat": "6.0.1",
27
- "lodash-es": "4.17.21",
28
- "@directus/utils": "13.3.0"
27
+ "lodash-es": "4.17.23",
28
+ "@directus/utils": "13.3.2"
29
29
  },
30
30
  "devDependencies": {
31
- "@directus/tsconfig": "3.0.0",
31
+ "@directus/tsconfig": "4.0.0",
32
32
  "@types/lodash-es": "4.17.12",
33
33
  "@unhead/vue": "1.11.20",
34
- "@vitejs/plugin-vue": "6.0.1",
35
34
  "pinia": "2.3.1",
36
- "rollup-plugin-node-externals": "8.1.2",
35
+ "tsdown": "0.15.11",
37
36
  "typescript": "5.9.3",
38
- "vite": "7.2.2",
39
- "vite-plugin-dts": "4.5.4",
37
+ "unplugin-vue": "7.1.1",
40
38
  "vitest": "3.2.4",
41
39
  "vue": "3.5.24",
42
- "@directus/types": "14.3.0"
40
+ "vue-tsc": "3.1.3",
41
+ "@directus/types": "15.0.0"
43
42
  },
44
43
  "peerDependencies": {
45
44
  "@unhead/vue": "1.11.20",
@@ -47,8 +46,8 @@
47
46
  "vue": "3.5.24"
48
47
  },
49
48
  "scripts": {
50
- "build": "vite build",
51
- "dev": "vite build --watch",
49
+ "build": "tsdown",
50
+ "dev": "tsdown --watch",
52
51
  "test": "vitest run",
53
52
  "test:watch": "vitest"
54
53
  }
package/dist/components/index.d.ts DELETED
@@ -1 +0,0 @@
1
- export { default as ThemeProvider } from './theme-provider.vue';
package/dist/components/theme-provider.vue.d.ts DELETED
@@ -1,15 +0,0 @@
1
- import { DeepPartial, Theme } from '@directus/types';
2
- type __VLS_Props = {
3
- darkMode: boolean;
4
- themeLight?: string | null;
5
- themeLightOverrides?: DeepPartial<Theme['rules']>;
6
- themeDark?: string | null;
7
- themeDarkOverrides?: DeepPartial<Theme['rules']>;
8
- };
9
- declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
10
- themeLight: string | null;
11
- themeLightOverrides: DeepPartial<Theme["rules"]>;
12
- themeDark: string | null;
13
- themeDarkOverrides: DeepPartial<Theme["rules"]>;
14
- }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
15
- export default _default;
package/dist/composables/index.d.ts DELETED
@@ -1,2 +0,0 @@
1
- export * from './use-fonts.js';
2
- export * from './use-theme.js';
package/dist/composables/use-fonts.d.ts DELETED
@@ -1,5 +0,0 @@
1
- import { DeepPartial, Theme } from '@directus/types';
2
- import { MaybeRef } from 'vue';
3
- export declare const useFonts: (theme: MaybeRef<Theme | DeepPartial<Theme>>) => {
4
- googleFonts: import('vue').ComputedRef<string[]>;
5
- };
package/dist/composables/use-fonts.test.d.ts DELETED
@@ -1 +0,0 @@
1
- export {};
package/dist/composables/use-theme.d.ts DELETED
@@ -1,519 +0,0 @@
1
- import { DeepPartial, Theme } from '@directus/types';
2
- import { MaybeRef } from 'vue';
3
- export declare const useTheme: (darkMode: MaybeRef<boolean>, themeLight: MaybeRef<string | null>, themeDark: MaybeRef<string | null>, themeLightOverrides: MaybeRef<DeepPartial<Theme["rules"]>>, themeDarkOverrides: MaybeRef<DeepPartial<Theme["rules"]>>) => {
4
- theme: import('vue').ComputedRef<{
5
- id: string;
6
- name: string;
7
- appearance: "dark";
8
- rules: {
9
- borderRadius: string;
10
- borderWidth: string;
11
- foreground: string;
12
- foregroundAccent: string;
13
- foregroundSubdued: string;
14
- background: string;
15
- backgroundNormal: string;
16
- backgroundAccent: string;
17
- backgroundSubdued: string;
18
- borderColor: string;
19
- borderColorAccent: string;
20
- borderColorSubdued: string;
21
- primary: string;
22
- primaryBackground: string;
23
- primarySubdued: string;
24
- primaryAccent: string;
25
- secondary: string;
26
- secondaryBackground: string;
27
- secondarySubdued: string;
28
- secondaryAccent: string;
29
- success: string;
30
- successBackground: string;
31
- successSubdued: string;
32
- successAccent: string;
33
- warning: string;
34
- warningBackground: string;
35
- warningSubdued: string;
36
- warningAccent: string;
37
- danger: string;
38
- dangerBackground: string;
39
- dangerSubdued: string;
40
- dangerAccent: string;
41
- fonts: {
42
- display: {
43
- fontFamily: string;
44
- fontWeight: string;
45
- };
46
- sans: {
47
- fontFamily: string;
48
- fontWeight: string;
49
- };
50
- serif: {
51
- fontFamily: string;
52
- fontWeight: string;
53
- };
54
- monospace: {
55
- fontFamily: string;
56
- fontWeight: string;
57
- };
58
- };
59
- navigation: {
60
- background: string;
61
- backgroundAccent: string;
62
- borderColor: string;
63
- borderWidth: string;
64
- project: {
65
- borderColor: string;
66
- borderWidth: string;
67
- background: string;
68
- foreground: string;
69
- fontFamily: string;
70
- };
71
- modules: {
72
- background: string;
73
- borderColor: string;
74
- borderWidth: string;
75
- button: {
76
- foreground: string;
77
- foregroundHover: string;
78
- foregroundActive: string;
79
- background: string;
80
- backgroundHover: string;
81
- backgroundActive: string;
82
- };
83
- };
84
- list: {
85
- icon: {
86
- foreground: string;
87
- foregroundHover: string;
88
- foregroundActive: string;
89
- };
90
- foreground: string;
91
- foregroundHover: string;
92
- foregroundActive: string;
93
- background: string;
94
- backgroundHover: string;
95
- backgroundActive: string;
96
- fontFamily: string;
97
- divider: {
98
- borderColor: string;
99
- borderWidth: string;
100
- };
101
- };
102
- };
103
- header: {
104
- background: string;
105
- borderColor: string;
106
- borderWidth: string;
107
- boxShadow: string;
108
- headline: {
109
- foreground: string;
110
- fontFamily: string;
111
- };
112
- title: {
113
- foreground: string;
114
- fontFamily: string;
115
- fontWeight: string;
116
- };
117
- };
118
- form: {
119
- columnGap: string;
120
- rowGap: string;
121
- field: {
122
- label: {
123
- foreground: string;
124
- fontFamily: string;
125
- fontWeight: string;
126
- };
127
- input: {
128
- background: string;
129
- backgroundSubdued: string;
130
- foreground: string;
131
- foregroundSubdued: string;
132
- borderColor: string;
133
- borderColorHover: string;
134
- borderColorFocus: string;
135
- boxShadow: string;
136
- boxShadowHover: string;
137
- boxShadowFocus: string;
138
- height: string;
139
- padding: string;
140
- };
141
- };
142
- };
143
- sidebar: {
144
- background: string;
145
- foreground: string;
146
- fontFamily: string;
147
- borderColor: string;
148
- borderWidth: string;
149
- section: {
150
- toggle: {
151
- icon: {
152
- foreground: string;
153
- foregroundHover: string;
154
- foregroundActive: string;
155
- };
156
- foreground: string;
157
- foregroundHover: string;
158
- foregroundActive: string;
159
- background: string;
160
- backgroundHover: string;
161
- backgroundActive: string;
162
- fontFamily: string;
163
- borderColor: string;
164
- borderWidth: string;
165
- };
166
- form: {
167
- columnGap: string;
168
- rowGap: string;
169
- label: {
170
- foreground: string;
171
- fontFamily: string;
172
- };
173
- field: {
174
- input: {
175
- background: string;
176
- foreground: string;
177
- foregroundSubdued: string;
178
- borderColor: string;
179
- borderColorHover: string;
180
- borderColorFocus: string;
181
- boxShadow: string;
182
- boxShadowHover: string;
183
- boxShadowFocus: string;
184
- height: string;
185
- padding: string;
186
- };
187
- };
188
- };
189
- };
190
- };
191
- public: {
192
- background: string;
193
- foreground: string;
194
- foregroundAccent: string;
195
- art: {
196
- background: string;
197
- primary: string;
198
- secondary: string;
199
- speed: string;
200
- };
201
- form: {
202
- columnGap: string;
203
- rowGap: string;
204
- field: {
205
- label: {
206
- foreground: string;
207
- fontFamily: string;
208
- };
209
- input: {
210
- background: string;
211
- foreground: string;
212
- foregroundSubdued: string;
213
- borderColor: string;
214
- borderColorHover: string;
215
- borderColorFocus: string;
216
- boxShadow: string;
217
- boxShadowHover: string;
218
- boxShadowFocus: string;
219
- height: string;
220
- padding: string;
221
- };
222
- };
223
- };
224
- };
225
- popover: {
226
- menu: {
227
- background: string;
228
- borderRadius: string;
229
- boxShadow: string;
230
- };
231
- };
232
- banner: {
233
- background: string;
234
- padding: string;
235
- borderRadius: string;
236
- avatar: {
237
- borderRadius: string;
238
- foreground: string;
239
- background: string;
240
- };
241
- headline: {
242
- foreground: string;
243
- fontFamily: string;
244
- fontWeight: string;
245
- };
246
- title: {
247
- foreground: string;
248
- fontFamily: string;
249
- fontWeight: string;
250
- };
251
- subtitle: {
252
- foreground: string;
253
- fontFamily: string;
254
- fontWeight: string;
255
- };
256
- art: {
257
- foreground: string;
258
- };
259
- };
260
- };
261
- } | {
262
- id: string;
263
- name: string;
264
- appearance: "light";
265
- rules: {
266
- borderRadius: string;
267
- borderWidth: string;
268
- foreground: string;
269
- foregroundAccent: string;
270
- foregroundSubdued: string;
271
- background: string;
272
- backgroundNormal: string;
273
- backgroundAccent: string;
274
- backgroundSubdued: string;
275
- borderColor: string;
276
- borderColorAccent: string;
277
- borderColorSubdued: string;
278
- primary: string;
279
- primaryBackground: string;
280
- primarySubdued: string;
281
- primaryAccent: string;
282
- secondary: string;
283
- secondaryBackground: string;
284
- secondarySubdued: string;
285
- secondaryAccent: string;
286
- success: string;
287
- successBackground: string;
288
- successSubdued: string;
289
- successAccent: string;
290
- warning: string;
291
- warningBackground: string;
292
- warningSubdued: string;
293
- warningAccent: string;
294
- danger: string;
295
- dangerBackground: string;
296
- dangerSubdued: string;
297
- dangerAccent: string;
298
- fonts: {
299
- display: {
300
- fontFamily: string;
301
- fontWeight: string;
302
- };
303
- sans: {
304
- fontFamily: string;
305
- fontWeight: string;
306
- };
307
- serif: {
308
- fontFamily: string;
309
- fontWeight: string;
310
- };
311
- monospace: {
312
- fontFamily: string;
313
- fontWeight: string;
314
- };
315
- };
316
- navigation: {
317
- background: string;
318
- backgroundAccent: string;
319
- borderColor: string;
320
- borderWidth: string;
321
- project: {
322
- borderColor: string;
323
- borderWidth: string;
324
- background: string;
325
- foreground: string;
326
- fontFamily: string;
327
- };
328
- modules: {
329
- background: string;
330
- borderColor: string;
331
- borderWidth: string;
332
- button: {
333
- foreground: string;
334
- foregroundHover: string;
335
- foregroundActive: string;
336
- background: string;
337
- backgroundHover: string;
338
- backgroundActive: string;
339
- };
340
- };
341
- list: {
342
- icon: {
343
- foreground: string;
344
- foregroundHover: string;
345
- foregroundActive: string;
346
- };
347
- foreground: string;
348
- foregroundHover: string;
349
- foregroundActive: string;
350
- background: string;
351
- backgroundHover: string;
352
- backgroundActive: string;
353
- fontFamily: string;
354
- divider: {
355
- borderColor: string;
356
- borderWidth: string;
357
- };
358
- };
359
- };
360
- header: {
361
- background: string;
362
- borderColor: string;
363
- borderWidth: string;
364
- boxShadow: string;
365
- headline: {
366
- foreground: string;
367
- fontFamily: string;
368
- };
369
- title: {
370
- foreground: string;
371
- fontFamily: string;
372
- fontWeight: string;
373
- };
374
- };
375
- form: {
376
- columnGap: string;
377
- rowGap: string;
378
- field: {
379
- label: {
380
- foreground: string;
381
- fontFamily: string;
382
- fontWeight: string;
383
- };
384
- input: {
385
- background: string;
386
- backgroundSubdued: string;
387
- foreground: string;
388
- foregroundSubdued: string;
389
- borderColor: string;
390
- borderColorHover: string;
391
- borderColorFocus: string;
392
- boxShadow: string;
393
- boxShadowHover: string;
394
- boxShadowFocus: string;
395
- height: string;
396
- padding: string;
397
- };
398
- };
399
- };
400
- sidebar: {
401
- background: string;
402
- foreground: string;
403
- fontFamily: string;
404
- borderColor: string;
405
- borderWidth: string;
406
- section: {
407
- toggle: {
408
- icon: {
409
- foreground: string;
410
- foregroundHover: string;
411
- foregroundActive: string;
412
- };
413
- foreground: string;
414
- foregroundHover: string;
415
- foregroundActive: string;
416
- background: string;
417
- backgroundHover: string;
418
- backgroundActive: string;
419
- fontFamily: string;
420
- borderColor: string;
421
- borderWidth: string;
422
- };
423
- form: {
424
- columnGap: string;
425
- rowGap: string;
426
- label: {
427
- foreground: string;
428
- fontFamily: string;
429
- };
430
- field: {
431
- input: {
432
- background: string;
433
- foreground: string;
434
- foregroundSubdued: string;
435
- borderColor: string;
436
- borderColorHover: string;
437
- borderColorFocus: string;
438
- boxShadow: string;
439
- boxShadowHover: string;
440
- boxShadowFocus: string;
441
- height: string;
442
- padding: string;
443
- };
444
- };
445
- };
446
- };
447
- };
448
- public: {
449
- background: string;
450
- foreground: string;
451
- foregroundAccent: string;
452
- art: {
453
- background: string;
454
- primary: string;
455
- secondary: string;
456
- speed: string;
457
- };
458
- form: {
459
- columnGap: string;
460
- rowGap: string;
461
- label: {
462
- foreground: string;
463
- fontFamily: string;
464
- };
465
- field: {
466
- input: {
467
- background: string;
468
- foreground: string;
469
- foregroundSubdued: string;
470
- borderColor: string;
471
- borderColorHover: string;
472
- borderColorFocus: string;
473
- boxShadow: string;
474
- boxShadowHover: string;
475
- boxShadowFocus: string;
476
- height: string;
477
- padding: string;
478
- };
479
- };
480
- };
481
- };
482
- popover: {
483
- menu: {
484
- background: string;
485
- borderRadius: string;
486
- boxShadow: string;
487
- };
488
- };
489
- banner: {
490
- background: string;
491
- padding: string;
492
- borderRadius: string;
493
- avatar: {
494
- borderRadius: string;
495
- foreground: string;
496
- background: string;
497
- };
498
- headline: {
499
- foreground: string;
500
- fontFamily: string;
501
- fontWeight: string;
502
- };
503
- title: {
504
- foreground: string;
505
- fontFamily: string;
506
- fontWeight: string;
507
- };
508
- subtitle: {
509
- foreground: string;
510
- fontFamily: string;
511
- fontWeight: string;
512
- };
513
- art: {
514
- foreground: string;
515
- };
516
- };
517
- };
518
- }>;
519
- };
package/dist/stores/index.d.ts DELETED
@@ -1 +0,0 @@
1
- export * from './theme.js';