@dxos/ui-theme 0.8.4-main.abd8ff62ef → 0.8.4-main.bc2380dfbc

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 (49) hide show
  1. package/LICENSE +102 -5
  2. package/README.md +1 -1
  3. package/dist/lib/browser/index.mjs +29 -31
  4. package/dist/lib/browser/index.mjs.map +3 -3
  5. package/dist/lib/browser/meta.json +1 -1
  6. package/dist/lib/node-esm/index.mjs +29 -31
  7. package/dist/lib/node-esm/index.mjs.map +3 -3
  8. package/dist/lib/node-esm/meta.json +1 -1
  9. package/dist/plugin/node-cjs/main.css +85 -79
  10. package/dist/plugin/node-cjs/main.css.map +2 -2
  11. package/dist/plugin/node-cjs/meta.json +1 -1
  12. package/dist/plugin/node-esm/main.css +85 -79
  13. package/dist/plugin/node-esm/main.css.map +2 -2
  14. package/dist/plugin/node-esm/meta.json +1 -1
  15. package/dist/types/src/defs.d.ts +1 -1
  16. package/dist/types/src/defs.d.ts.map +1 -1
  17. package/dist/types/src/fragments/hover.d.ts +0 -1
  18. package/dist/types/src/fragments/hover.d.ts.map +1 -1
  19. package/dist/types/src/theme/components/button.d.ts +2 -2
  20. package/dist/types/src/theme/components/button.d.ts.map +1 -1
  21. package/dist/types/src/util/hash-styles.d.ts +1 -1
  22. package/dist/types/src/util/hash-styles.d.ts.map +1 -1
  23. package/dist/types/tsconfig.tsbuildinfo +1 -1
  24. package/package.json +8 -9
  25. package/src/Theme.stories.tsx +5 -5
  26. package/src/css/DESIGN_SYSTEM.md +159 -0
  27. package/src/css/base/base.css +2 -2
  28. package/src/css/components/button.css +3 -3
  29. package/src/css/components/checkbox.css +1 -1
  30. package/src/css/components/focus.css +12 -12
  31. package/src/css/components/panel.css +23 -23
  32. package/src/css/components/selected.css +58 -17
  33. package/src/css/components/surface.css +4 -4
  34. package/src/css/components/tag.css +23 -23
  35. package/src/css/theme/semantic.css +36 -40
  36. package/src/css/theme/spacing.css +1 -1
  37. package/src/css/theme/styles.css +22 -22
  38. package/src/defs.ts +1 -1
  39. package/src/fragments/AUDIT.md +0 -2
  40. package/src/fragments/hover.ts +0 -2
  41. package/src/main.css +3 -3
  42. package/src/theme/components/button.ts +2 -2
  43. package/src/theme/components/focus.ts +2 -2
  44. package/src/theme/components/icon-button.ts +1 -1
  45. package/src/theme/components/input.ts +5 -5
  46. package/src/theme/components/message.ts +1 -1
  47. package/src/theme/components/select.ts +1 -1
  48. package/src/theme/components/tooltip.ts +1 -1
  49. package/src/util/hash-styles.ts +19 -19
package/src/util/hash-styles.ts CHANGED
@@ -11,7 +11,7 @@ export type ColorStyles = {
11
11
  hue: Hue;
12
12
  fill: string; // -fill
13
13
  surface: string; // -surface
14
- surfaceText: string; // -surface-text
14
+ foreground: string; // -foreground
15
15
  text: string; // -text
16
16
  border: string; // -border
17
17
  };
@@ -20,7 +20,7 @@ const neutral: ColorStyles = {
20
20
  hue: 'neutral',
21
21
  fill: 'bg-neutral-fill',
22
22
  surface: 'bg-neutral-surface',
23
- surfaceText: 'text-neutral-surface-text',
23
+ foreground: 'text-neutral-foreground',
24
24
  text: 'text-neutral-text',
25
25
  border: 'border-neutral-border',
26
26
  };
@@ -32,7 +32,7 @@ const styles: ColorStyles[] = [
32
32
  hue: 'red',
33
33
  fill: 'bg-red-fill',
34
34
  surface: 'bg-red-surface',
35
- surfaceText: 'text-red-surface-text',
35
+ foreground: 'text-red-foreground',
36
36
  text: 'text-red-text',
37
37
  border: 'border-red-border',
38
38
  },
@@ -40,7 +40,7 @@ const styles: ColorStyles[] = [
40
40
  hue: 'orange',
41
41
  fill: 'bg-orange-fill',
42
42
  surface: 'bg-orange-surface',
43
- surfaceText: 'text-orange-surface-text',
43
+ foreground: 'text-orange-foreground',
44
44
  text: 'text-orange-text',
45
45
  border: 'border-orange-border',
46
46
  },
@@ -48,7 +48,7 @@ const styles: ColorStyles[] = [
48
48
  hue: 'amber',
49
49
  fill: 'bg-amber-fill',
50
50
  surface: 'bg-amber-surface',
51
- surfaceText: 'text-amber-surface-text',
51
+ foreground: 'text-amber-foreground',
52
52
  text: 'text-amber-text',
53
53
  border: 'border-amber-border',
54
54
  },
@@ -56,7 +56,7 @@ const styles: ColorStyles[] = [
56
56
  hue: 'yellow',
57
57
  fill: 'bg-yellow-fill',
58
58
  surface: 'bg-yellow-surface',
59
- surfaceText: 'text-yellow-surface-text',
59
+ foreground: 'text-yellow-foreground',
60
60
  text: 'text-yellow-text',
61
61
  border: 'border-yellow-border',
62
62
  },
@@ -64,7 +64,7 @@ const styles: ColorStyles[] = [
64
64
  hue: 'lime',
65
65
  fill: 'bg-lime-fill',
66
66
  surface: 'bg-lime-surface',
67
- surfaceText: 'text-lime-surface-text',
67
+ foreground: 'text-lime-foreground',
68
68
  text: 'text-lime-text',
69
69
  border: 'border-lime-border',
70
70
  },
@@ -72,7 +72,7 @@ const styles: ColorStyles[] = [
72
72
  hue: 'green',
73
73
  fill: 'bg-green-fill',
74
74
  surface: 'bg-green-surface',
75
- surfaceText: 'text-green-surface-text',
75
+ foreground: 'text-green-foreground',
76
76
  text: 'text-green-text',
77
77
  border: 'border-green-border',
78
78
  },
@@ -80,7 +80,7 @@ const styles: ColorStyles[] = [
80
80
  hue: 'emerald',
81
81
  fill: 'bg-emerald-fill',
82
82
  surface: 'bg-emerald-surface',
83
- surfaceText: 'text-emerald-surface-text',
83
+ foreground: 'text-emerald-foreground',
84
84
  text: 'text-emerald-text',
85
85
  border: 'border-emerald-border',
86
86
  },
@@ -88,7 +88,7 @@ const styles: ColorStyles[] = [
88
88
  hue: 'teal',
89
89
  fill: 'bg-teal-fill',
90
90
  surface: 'bg-teal-surface',
91
- surfaceText: 'text-teal-surface-text',
91
+ foreground: 'text-teal-foreground',
92
92
  text: 'text-teal-text',
93
93
  border: 'border-teal-border',
94
94
  },
@@ -96,7 +96,7 @@ const styles: ColorStyles[] = [
96
96
  hue: 'cyan',
97
97
  fill: 'bg-cyan-fill',
98
98
  surface: 'bg-cyan-surface',
99
- surfaceText: 'text-cyan-surface-text',
99
+ foreground: 'text-cyan-foreground',
100
100
  text: 'text-cyan-text',
101
101
  border: 'border-cyan-border',
102
102
  },
@@ -104,7 +104,7 @@ const styles: ColorStyles[] = [
104
104
  hue: 'sky',
105
105
  fill: 'bg-sky-fill',
106
106
  surface: 'bg-sky-surface',
107
- surfaceText: 'text-sky-surface-text',
107
+ foreground: 'text-sky-foreground',
108
108
  text: 'text-sky-text',
109
109
  border: 'border-sky-border',
110
110
  },
@@ -112,7 +112,7 @@ const styles: ColorStyles[] = [
112
112
  hue: 'blue',
113
113
  fill: 'bg-blue-fill',
114
114
  surface: 'bg-blue-surface',
115
- surfaceText: 'text-blue-surface-text',
115
+ foreground: 'text-blue-foreground',
116
116
  text: 'text-blue-text',
117
117
  border: 'border-blue-border',
118
118
  },
@@ -120,7 +120,7 @@ const styles: ColorStyles[] = [
120
120
  hue: 'indigo',
121
121
  fill: 'bg-indigo-fill',
122
122
  surface: 'bg-indigo-surface',
123
- surfaceText: 'text-indigo-surface-text',
123
+ foreground: 'text-indigo-foreground',
124
124
  text: 'text-indigo-text',
125
125
  border: 'border-indigo-border',
126
126
  },
@@ -128,7 +128,7 @@ const styles: ColorStyles[] = [
128
128
  hue: 'violet',
129
129
  fill: 'bg-violet-fill',
130
130
  surface: 'bg-violet-surface',
131
- surfaceText: 'text-violet-surface-text',
131
+ foreground: 'text-violet-foreground',
132
132
  text: 'text-violet-text',
133
133
  border: 'border-violet-border',
134
134
  },
@@ -136,7 +136,7 @@ const styles: ColorStyles[] = [
136
136
  hue: 'purple',
137
137
  fill: 'bg-purple-fill',
138
138
  surface: 'bg-purple-surface',
139
- surfaceText: 'text-purple-surface-text',
139
+ foreground: 'text-purple-foreground',
140
140
  text: 'text-purple-text',
141
141
  border: 'border-purple-border',
142
142
  },
@@ -144,7 +144,7 @@ const styles: ColorStyles[] = [
144
144
  hue: 'fuchsia',
145
145
  fill: 'bg-fuchsia-fill',
146
146
  surface: 'bg-fuchsia-surface',
147
- surfaceText: 'text-fuchsia-surface-text',
147
+ foreground: 'text-fuchsia-foreground',
148
148
  text: 'text-fuchsia-text',
149
149
  border: 'border-fuchsia-border',
150
150
  },
@@ -152,7 +152,7 @@ const styles: ColorStyles[] = [
152
152
  hue: 'pink',
153
153
  fill: 'bg-pink-fill',
154
154
  surface: 'bg-pink-surface',
155
- surfaceText: 'text-pink-surface-text',
155
+ foreground: 'text-pink-foreground',
156
156
  text: 'text-pink-text',
157
157
  border: 'border-pink-border',
158
158
  },
@@ -160,7 +160,7 @@ const styles: ColorStyles[] = [
160
160
  hue: 'rose',
161
161
  fill: 'bg-rose-fill',
162
162
  surface: 'bg-rose-surface',
163
- surfaceText: 'text-rose-surface-text',
163
+ foreground: 'text-rose-foreground',
164
164
  text: 'text-rose-text',
165
165
  border: 'border-rose-border',
166
166
  },