@gitlab/ui 87.5.1 → 87.6.1

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 (32) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/index.css +1 -1
  3. package/dist/index.css.map +1 -1
  4. package/dist/index.js +1 -0
  5. package/dist/tokens/build/js/tokens.dark.js +93 -88
  6. package/dist/tokens/build/js/tokens.js +93 -88
  7. package/dist/tokens/css/tokens.css +42 -37
  8. package/dist/tokens/css/tokens.dark.css +42 -37
  9. package/dist/tokens/js/tokens.dark.js +92 -87
  10. package/dist/tokens/js/tokens.js +92 -87
  11. package/dist/tokens/json/tokens.dark.json +4462 -4007
  12. package/dist/tokens/json/tokens.json +4462 -4007
  13. package/dist/tokens/scss/_tokens.dark.scss +42 -37
  14. package/dist/tokens/scss/_tokens.scss +42 -37
  15. package/dist/tokens/scss/_tokens_custom_properties.scss +55 -50
  16. package/package.json +1 -1
  17. package/src/components/base/breadcrumb/breadcrumb.scss +13 -1
  18. package/src/index.js +1 -0
  19. package/src/tokens/build/css/tokens.css +42 -37
  20. package/src/tokens/build/css/tokens.dark.css +42 -37
  21. package/src/tokens/build/js/tokens.dark.js +92 -87
  22. package/src/tokens/build/js/tokens.js +92 -87
  23. package/src/tokens/build/json/tokens.dark.json +4462 -4007
  24. package/src/tokens/build/json/tokens.json +4462 -4007
  25. package/src/tokens/build/scss/_tokens.dark.scss +42 -37
  26. package/src/tokens/build/scss/_tokens.scss +42 -37
  27. package/src/tokens/build/scss/_tokens_custom_properties.scss +55 -50
  28. package/src/tokens/{color.theme.tokens.json → deprecated.color.theme.tokens.json} +144 -72
  29. package/src/tokens/{color.tokens.json → deprecated.color.tokens.json} +155 -75
  30. package/src/tokens/{color.transparency.tokens.json → deprecated.color.transparency.tokens.json} +13 -0
  31. package/src/tokens/feedback.tokens.json +60 -10
  32. package/src/tokens/text.tokens.json +3 -3
package/src/tokens/{color.transparency.tokens.json → deprecated.color.transparency.tokens.json} RENAMED
@@ -3,6 +3,7 @@
3
3
  "02": {
4
4
  "$value": "rgba(05, 05, 06, 0.02)",
5
5
  "$type": "color",
6
+ "$description": "Use color.alpha.dark.2 instead.",
6
7
  "themeable": true,
7
8
  "prefix": false,
8
9
  "deprecated": true
@@ -10,6 +11,7 @@
10
11
  "04": {
11
12
  "$value": "rgba(05, 05, 06, 0.04)",
12
13
  "$type": "color",
14
+ "$description": "Use color.alpha.dark.4 instead.",
13
15
  "themeable": true,
14
16
  "prefix": false,
15
17
  "deprecated": true
@@ -17,6 +19,7 @@
17
19
  "06": {
18
20
  "$value": "rgba(05, 05, 06, 0.06)",
19
21
  "$type": "color",
22
+ "$description": "Use color.alpha.dark.6 instead.",
20
23
  "themeable": true,
21
24
  "prefix": false,
22
25
  "deprecated": true
@@ -24,6 +27,7 @@
24
27
  "08": {
25
28
  "$value": "rgba(05, 05, 06, 0.08)",
26
29
  "$type": "color",
30
+ "$description": "Use color.alpha.dark.8 instead.",
27
31
  "themeable": true,
28
32
  "prefix": false,
29
33
  "deprecated": true
@@ -31,6 +35,7 @@
31
35
  "16": {
32
36
  "$value": "rgba(05, 05, 06, 0.16)",
33
37
  "$type": "color",
38
+ "$description": "Use color.alpha.dark.16 instead.",
34
39
  "themeable": true,
35
40
  "prefix": false,
36
41
  "deprecated": true
@@ -38,6 +43,7 @@
38
43
  "24": {
39
44
  "$value": "rgba(05, 05, 06, 0.24)",
40
45
  "$type": "color",
46
+ "$description": "Use color.alpha.dark.24 instead.",
41
47
  "themeable": true,
42
48
  "prefix": false,
43
49
  "deprecated": true
@@ -47,6 +53,7 @@
47
53
  "02": {
48
54
  "$value": "rgba(255, 255, 255, 0.02)",
49
55
  "$type": "color",
56
+ "$description": "Use color.alpha.light.2 instead.",
50
57
  "themeable": true,
51
58
  "prefix": false,
52
59
  "deprecated": true
@@ -54,6 +61,7 @@
54
61
  "04": {
55
62
  "$value": "rgba(255, 255, 255, 0.04)",
56
63
  "$type": "color",
64
+ "$description": "Use color.alpha.light.4 instead.",
57
65
  "themeable": true,
58
66
  "prefix": false,
59
67
  "deprecated": true
@@ -61,6 +69,7 @@
61
69
  "06": {
62
70
  "$value": "rgba(255, 255, 255, 0.06)",
63
71
  "$type": "color",
72
+ "$description": "Use color.alpha.light.6 instead.",
64
73
  "themeable": true,
65
74
  "prefix": false,
66
75
  "deprecated": true
@@ -68,6 +77,7 @@
68
77
  "08": {
69
78
  "$value": "rgba(255, 255, 255, 0.08)",
70
79
  "$type": "color",
80
+ "$description": "Use color.alpha.light.8 instead.",
71
81
  "themeable": true,
72
82
  "prefix": false,
73
83
  "deprecated": true
@@ -75,6 +85,7 @@
75
85
  "16": {
76
86
  "$value": "rgba(255, 255, 255, 0.16)",
77
87
  "$type": "color",
88
+ "$description": "Use color.alpha.light.16 instead.",
78
89
  "themeable": true,
79
90
  "prefix": false,
80
91
  "deprecated": true
@@ -82,6 +93,7 @@
82
93
  "24": {
83
94
  "$value": "rgba(255, 255, 255, 0.24)",
84
95
  "$type": "color",
96
+ "$description": "Use color.alpha.light.24 instead.",
85
97
  "themeable": true,
86
98
  "prefix": false,
87
99
  "deprecated": true
@@ -89,6 +101,7 @@
89
101
  "36": {
90
102
  "$value": "rgba(255, 255, 255, 0.36)",
91
103
  "$type": "color",
104
+ "$description": "Use color.alpha.light.36 instead.",
92
105
  "themeable": true,
93
106
  "prefix": false,
94
107
  "deprecated": true
package/src/tokens/feedback.tokens.json CHANGED
@@ -56,7 +56,17 @@
56
56
  "dark": "{color.neutral.900}"
57
57
  },
58
58
  "$type": "color",
59
- "$description": "Used for a background associated with neutral feedback."
59
+ "$description": "Used for the background of a neutral feedback item when there isn't a specific meaning or urgency."
60
+ }
61
+ },
62
+ "text": {
63
+ "color": {
64
+ "$value": {
65
+ "default": "{color.neutral.700}",
66
+ "dark": "{color.neutral.200}"
67
+ },
68
+ "$type": "color",
69
+ "$description": "Used for the text of a neutral feedback item when there isn't a specific meaning or urgency."
60
70
  }
61
71
  },
62
72
  "icon": {
@@ -66,7 +76,7 @@
66
76
  "dark": "{color.neutral.300}"
67
77
  },
68
78
  "$type": "color",
69
- "$description": "Used for an icon associated with a neutral feedback section."
79
+ "$description": "Used for the icon of a neutral feedback item when there isn't a specific meaning or urgency."
70
80
  }
71
81
  }
72
82
  },
@@ -78,7 +88,17 @@
78
88
  "dark": "{color.blue.900}"
79
89
  },
80
90
  "$type": "color",
81
- "$description": "Used for a background associated with informational feedback or a highlighted section resulting from a user action."
91
+ "$description": "Used for the background of an informational feedback item when highlighting new information or a change that doesn't require immediate action."
92
+ }
93
+ },
94
+ "text": {
95
+ "color": {
96
+ "$value": {
97
+ "default": "{color.blue.700}",
98
+ "dark": "{color.blue.200}"
99
+ },
100
+ "$type": "color",
101
+ "$description": "Used for the text of an informational feedback item when highlighting new information or a change that doesn't require immediate action."
82
102
  }
83
103
  },
84
104
  "icon": {
@@ -88,7 +108,7 @@
88
108
  "dark": "{color.blue.300}"
89
109
  },
90
110
  "$type": "color",
91
- "$description": "Used for an icon associated with informational feedback."
111
+ "$description": "Used for the icon of an informational feedback item when highlighting new information or a change that doesn't require immediate action."
92
112
  }
93
113
  }
94
114
  },
@@ -100,7 +120,17 @@
100
120
  "dark": "{color.green.900}"
101
121
  },
102
122
  "$type": "color",
103
- "$description": "Used for a background associated with successful feedback or a new section resulting from a user action."
123
+ "$description": "Used for the background of a success feedback item when confirming the successful completion of a user-initiated action."
124
+ }
125
+ },
126
+ "text": {
127
+ "color": {
128
+ "$value": {
129
+ "default": "{color.green.700}",
130
+ "dark": "{color.green.200}"
131
+ },
132
+ "$type": "color",
133
+ "$description": "Used for the text of a success feedback item when confirming the successful completion of a user-initiated action."
104
134
  }
105
135
  },
106
136
  "icon": {
@@ -110,7 +140,7 @@
110
140
  "dark": "{color.green.300}"
111
141
  },
112
142
  "$type": "color",
113
- "$description": "Used for an icon associated with successful feedback or a new section."
143
+ "$description": "Used for the icon of a success feedback item when confirming the successful completion of a user-initiated action."
114
144
  }
115
145
  }
116
146
  },
@@ -122,7 +152,17 @@
122
152
  "dark": "{color.orange.900}"
123
153
  },
124
154
  "$type": "color",
125
- "$description": "Used for a background associated with warning feedback or to let a user know about confidential content."
155
+ "$description": "Used for the background of a warning feedback item when notifying about a potential issue or sensitive information."
156
+ }
157
+ },
158
+ "text": {
159
+ "color": {
160
+ "$value": {
161
+ "default": "{color.orange.700}",
162
+ "dark": "{color.orange.200}"
163
+ },
164
+ "$type": "color",
165
+ "$description": "Used for the text of a warning feedback item when notifying about a potential issue or sensitive information."
126
166
  }
127
167
  },
128
168
  "icon": {
@@ -132,7 +172,7 @@
132
172
  "dark": "{color.orange.300}"
133
173
  },
134
174
  "$type": "color",
135
- "$description": "Used for an icon associated with warning feedback or confidential content."
175
+ "$description": "Used for the icon of a warning feedback item when notifying about a potential issue or sensitive information."
136
176
  }
137
177
  }
138
178
  },
@@ -144,7 +184,17 @@
144
184
  "dark": "{color.red.900}"
145
185
  },
146
186
  "$type": "color",
147
- "$description": "Used for a background associated with danger or critical feedback."
187
+ "$description": "Used for the background of a danger feedback item when notifying about a critical issue that has just occurred and requires immediate attention."
188
+ }
189
+ },
190
+ "text": {
191
+ "color": {
192
+ "$value": {
193
+ "default": "{color.red.700}",
194
+ "dark": "{color.red.200}"
195
+ },
196
+ "$type": "color",
197
+ "$description": "Used for the text of a danger feedback item when notifying about a critical issue that has just occurred and requires immediate attention."
148
198
  }
149
199
  },
150
200
  "icon": {
@@ -154,7 +204,7 @@
154
204
  "dark": "{color.red.300}"
155
205
  },
156
206
  "$type": "color",
157
- "$description": "Used for an icon associated with danger or critical feedback."
207
+ "$description": "Used for the icon of a danger feedback item when notifying about a critical issue that has just occurred and requires immediate attention."
158
208
  }
159
209
  }
160
210
  }
package/src/tokens/text.tokens.json CHANGED
@@ -6,7 +6,7 @@
6
6
  "dark": "#ececef"
7
7
  },
8
8
  "$type": "color",
9
- "$description": "Use text.color.default instead",
9
+ "$description": "Use text.color.default instead.",
10
10
  "deprecated": true
11
11
  },
12
12
  "secondary": {
@@ -15,7 +15,7 @@
15
15
  "dark": "#89888d"
16
16
  },
17
17
  "$type": "color",
18
- "$description": "Use text.color.subtle instead",
18
+ "$description": "Use text.color.subtle instead.",
19
19
  "deprecated": true
20
20
  },
21
21
  "tertiary": {
@@ -24,7 +24,7 @@
24
24
  "dark": "#737278"
25
25
  },
26
26
  "$type": "color",
27
- "$description": "Use text.color.disabled instead",
27
+ "$description": "Use text.color.disabled instead.",
28
28
  "deprecated": true
29
29
  },
30
30
  "color": {