@atlaskit/button 23.5.3 → 23.6.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 (39) hide show
  1. package/CHANGELOG.md +19 -0
  2. package/dist/cjs/new-button/containers/split-button/split-button.compiled.css +2 -6
  3. package/dist/cjs/new-button/containers/split-button/split-button.js +7 -14
  4. package/dist/cjs/new-button/variants/default/link.compiled.css +41 -68
  5. package/dist/cjs/new-button/variants/default/link.js +12 -22
  6. package/dist/cjs/new-button/variants/icon/link.compiled.css +30 -52
  7. package/dist/cjs/new-button/variants/icon/link.js +9 -17
  8. package/dist/cjs/new-button/variants/shared/button-base.compiled.css +14 -25
  9. package/dist/cjs/new-button/variants/shared/button-base.js +11 -17
  10. package/dist/cjs/old-button/shared/button-base.js +1 -1
  11. package/dist/cjs/old-button/shared/css.js +46 -129
  12. package/dist/es2019/new-button/containers/split-button/split-button.compiled.css +2 -6
  13. package/dist/es2019/new-button/containers/split-button/split-button.js +7 -14
  14. package/dist/es2019/new-button/variants/default/link.compiled.css +41 -68
  15. package/dist/es2019/new-button/variants/default/link.js +12 -22
  16. package/dist/es2019/new-button/variants/icon/link.compiled.css +30 -52
  17. package/dist/es2019/new-button/variants/icon/link.js +9 -17
  18. package/dist/es2019/new-button/variants/shared/button-base.compiled.css +14 -25
  19. package/dist/es2019/new-button/variants/shared/button-base.js +11 -17
  20. package/dist/es2019/old-button/shared/button-base.js +1 -1
  21. package/dist/es2019/old-button/shared/css.js +32 -132
  22. package/dist/esm/new-button/containers/split-button/split-button.compiled.css +2 -6
  23. package/dist/esm/new-button/containers/split-button/split-button.js +7 -14
  24. package/dist/esm/new-button/variants/default/link.compiled.css +41 -68
  25. package/dist/esm/new-button/variants/default/link.js +12 -22
  26. package/dist/esm/new-button/variants/icon/link.compiled.css +30 -52
  27. package/dist/esm/new-button/variants/icon/link.js +9 -17
  28. package/dist/esm/new-button/variants/shared/button-base.compiled.css +14 -25
  29. package/dist/esm/new-button/variants/shared/button-base.js +11 -17
  30. package/dist/esm/old-button/shared/button-base.js +1 -1
  31. package/dist/esm/old-button/shared/css.js +46 -129
  32. package/dist/types/old-button/shared/css.d.ts +1 -1
  33. package/dist/types-ts4.5/old-button/shared/css.d.ts +1 -1
  34. package/package.json +8 -11
  35. package/dist/cjs/old-button/shared/colors.js +0 -328
  36. package/dist/es2019/old-button/shared/colors.js +0 -320
  37. package/dist/esm/old-button/shared/colors.js +0 -320
  38. package/dist/types/old-button/shared/colors.d.ts +0 -23
  39. package/dist/types-ts4.5/old-button/shared/colors.d.ts +0 -23
package/dist/esm/old-button/shared/colors.js DELETED
@@ -1,320 +0,0 @@
1
- import * as colors from '@atlaskit/theme/colors';
2
- // Hard coding the active rgba color value rather than using a helper to convert it
3
- // With helper it would be: hex2rgba(colors.B75, 0.6)
4
- var fadedB75 = 'rgba(179, 212, 255, 0.6)';
5
- var values = {
6
- // Default appearance
7
- background: {
8
- default: {
9
- default: {
10
- light: "var(--ds-background-neutral, ".concat(colors.N20A, ")"),
11
- dark: "var(--ds-background-neutral, ".concat(colors.DN70, ")")
12
- },
13
- hover: {
14
- light: "var(--ds-background-neutral-hovered, ".concat(colors.N30A, ")"),
15
- dark: "var(--ds-background-neutral-hovered, ".concat(colors.DN60, ")")
16
- },
17
- active: {
18
- light: "var(--ds-background-neutral-pressed, ".concat(fadedB75, ")"),
19
- dark: "var(--ds-background-neutral-pressed, ".concat(colors.B75, ")")
20
- },
21
- disabled: {
22
- light: "var(--ds-background-disabled, ".concat(colors.N20A, ")"),
23
- dark: "var(--ds-background-disabled, ".concat(colors.DN70, ")")
24
- },
25
- selected: {
26
- light: "var(--ds-background-selected, ".concat(colors.N700, ")"),
27
- dark: "var(--ds-background-selected, ".concat(colors.DN0, ")")
28
- },
29
- focusSelected: {
30
- light: "var(--ds-background-selected, ".concat(colors.N700, ")"),
31
- dark: "var(--ds-background-selected, ".concat(colors.DN0, ")")
32
- }
33
- },
34
- primary: {
35
- default: {
36
- light: "var(--ds-background-brand-bold, ".concat(colors.B400, ")"),
37
- dark: "var(--ds-background-brand-bold, ".concat(colors.B100, ")")
38
- },
39
- hover: {
40
- light: "var(--ds-background-brand-bold-hovered, ".concat(colors.B300, ")"),
41
- dark: "var(--ds-background-brand-bold-hovered, ".concat(colors.B75, ")")
42
- },
43
- active: {
44
- light: "var(--ds-background-brand-bold-pressed, ".concat(colors.B500, ")"),
45
- dark: "var(--ds-background-brand-bold-pressed, ".concat(colors.B200, ")")
46
- },
47
- disabled: {
48
- light: "var(--ds-background-disabled, ".concat(colors.N20A, ")"),
49
- dark: "var(--ds-background-disabled, ".concat(colors.DN70, ")")
50
- },
51
- selected: {
52
- light: "var(--ds-background-selected, ".concat(colors.N700, ")"),
53
- dark: "var(--ds-background-selected, ".concat(colors.DN0, ")")
54
- },
55
- focusSelected: {
56
- light: "var(--ds-background-selected, ".concat(colors.N700, ")"),
57
- dark: "var(--ds-background-selected, ".concat(colors.DN0, ")")
58
- }
59
- },
60
- warning: {
61
- default: {
62
- light: "var(--ds-background-warning-bold, ".concat(colors.Y300, ")"),
63
- dark: "var(--ds-background-warning-bold, ".concat(colors.Y300, ")")
64
- },
65
- hover: {
66
- light: "var(--ds-background-warning-bold-hovered, ".concat(colors.Y200, ")"),
67
- dark: "var(--ds-background-warning-bold-hovered, ".concat(colors.Y200, ")")
68
- },
69
- active: {
70
- light: "var(--ds-background-warning-bold-pressed, ".concat(colors.Y400, ")"),
71
- dark: "var(--ds-background-warning-bold-pressed, ".concat(colors.Y400, ")")
72
- },
73
- disabled: {
74
- light: "var(--ds-background-disabled, ".concat(colors.N20A, ")"),
75
- dark: "var(--ds-background-disabled, ".concat(colors.DN70, ")")
76
- },
77
- selected: {
78
- light: "var(--ds-background-selected, ".concat(colors.Y400, ")"),
79
- dark: "var(--ds-background-selected, ".concat(colors.Y400, ")")
80
- },
81
- focusSelected: {
82
- light: "var(--ds-background-selected, ".concat(colors.Y400, ")"),
83
- dark: "var(--ds-background-selected, ".concat(colors.Y400, ")")
84
- }
85
- },
86
- danger: {
87
- default: {
88
- light: "var(--ds-background-danger-bold, ".concat(colors.R400, ")"),
89
- dark: "var(--ds-background-danger-bold, ".concat(colors.R400, ")")
90
- },
91
- hover: {
92
- light: "var(--ds-background-danger-bold-hovered, ".concat(colors.R300, ")"),
93
- dark: "var(--ds-background-danger-bold-hovered, ".concat(colors.R300, ")")
94
- },
95
- active: {
96
- light: "var(--ds-background-danger-bold-pressed, ".concat(colors.R500, ")"),
97
- dark: "var(--ds-background-danger-bold-pressed, ".concat(colors.R500, ")")
98
- },
99
- disabled: {
100
- light: "var(--ds-background-disabled, ".concat(colors.N20A, ")"),
101
- dark: "var(--ds-background-disabled, ".concat(colors.DN70, ")")
102
- },
103
- selected: {
104
- light: "var(--ds-background-selected, ".concat(colors.R500, ")"),
105
- dark: "var(--ds-background-selected, ".concat(colors.R500, ")")
106
- },
107
- focusSelected: {
108
- light: "var(--ds-background-selected, ".concat(colors.R500, ")"),
109
- dark: "var(--ds-background-selected, ".concat(colors.R500, ")")
110
- }
111
- },
112
- link: {
113
- default: {
114
- light: "var(--ds-background-neutral-subtle, none)",
115
- dark: "var(--ds-background-neutral-subtle, none)"
116
- },
117
- selected: {
118
- light: "var(--ds-background-selected, ".concat(colors.N700, ")"),
119
- dark: "var(--ds-background-selected, ".concat(colors.N20, ")")
120
- },
121
- focusSelected: {
122
- light: "var(--ds-background-selected, ".concat(colors.N700, ")"),
123
- dark: "var(--ds-background-selected, ".concat(colors.N20, ")")
124
- }
125
- },
126
- subtle: {
127
- default: {
128
- light: "var(--ds-background-neutral-subtle, none)",
129
- dark: "var(--ds-background-neutral-subtle, none)"
130
- },
131
- hover: {
132
- light: "var(--ds-background-neutral-subtle-hovered, ".concat(colors.N30A, ")"),
133
- dark: "var(--ds-background-neutral-subtle-hovered, ".concat(colors.DN60, ")")
134
- },
135
- active: {
136
- light: "var(--ds-background-neutral-subtle-pressed, ".concat(fadedB75, ")"),
137
- dark: "var(--ds-background-neutral-subtle-pressed, ".concat(colors.B75, ")")
138
- },
139
- disabled: {
140
- light: "var(--ds-background-neutral-subtle, none)",
141
- dark: "var(--ds-background-neutral-subtle, none)"
142
- },
143
- selected: {
144
- light: "var(--ds-background-selected, ".concat(colors.N700, ")"),
145
- dark: "var(--ds-background-selected, ".concat(colors.DN0, ")")
146
- },
147
- focusSelected: {
148
- light: "var(--ds-background-selected, ".concat(colors.N700, ")"),
149
- dark: "var(--ds-background-selected, ".concat(colors.DN0, ")")
150
- }
151
- },
152
- 'subtle-link': {
153
- default: {
154
- light: "var(--ds-background-neutral-subtle, none)",
155
- dark: "var(--ds-background-neutral-subtle, none)"
156
- },
157
- selected: {
158
- light: "var(--ds-background-selected, ".concat(colors.N700, ")"),
159
- dark: "var(--ds-background-selected, ".concat(colors.N20, ")")
160
- },
161
- focusSelected: {
162
- light: "var(--ds-background-selected, ".concat(colors.N700, ")"),
163
- dark: "var(--ds-background-selected, ".concat(colors.N20, ")")
164
- }
165
- }
166
- },
167
- color: {
168
- default: {
169
- default: {
170
- light: "var(--ds-text, ".concat(colors.N500, ")"),
171
- dark: "var(--ds-text, ".concat(colors.DN400, ")")
172
- },
173
- active: {
174
- light: "var(--ds-text, ".concat(colors.B400, ")"),
175
- dark: "var(--ds-text, ".concat(colors.B400, ")")
176
- },
177
- disabled: {
178
- light: "var(--ds-text-disabled, ".concat(colors.N70, ")"),
179
- dark: "var(--ds-text-disabled, ".concat(colors.DN30, ")")
180
- },
181
- selected: {
182
- light: "var(--ds-text-selected, ".concat(colors.N20, ")"),
183
- dark: "var(--ds-text-selected, ".concat(colors.DN400, ")")
184
- },
185
- focusSelected: {
186
- light: "var(--ds-text-selected, ".concat(colors.N20, ")"),
187
- dark: "var(--ds-text-selected, ".concat(colors.DN400, ")")
188
- }
189
- },
190
- primary: {
191
- default: {
192
- light: "var(--ds-text-inverse, ".concat(colors.N0, ")"),
193
- dark: "var(--ds-text-inverse, ".concat(colors.DN30, ")")
194
- },
195
- disabled: {
196
- light: "var(--ds-text-disabled, ".concat(colors.N70, ")"),
197
- dark: "var(--ds-text-disabled, ".concat(colors.DN30, ")")
198
- },
199
- selected: {
200
- light: "var(--ds-text-selected, ".concat(colors.N20, ")"),
201
- dark: "var(--ds-text-selected, ".concat(colors.DN400, ")")
202
- },
203
- focusSelected: {
204
- light: "var(--ds-text-selected, ".concat(colors.N20, ")"),
205
- dark: "var(--ds-text-selected, ".concat(colors.DN400, ")")
206
- }
207
- },
208
- warning: {
209
- default: {
210
- light: "var(--ds-text-warning-inverse, ".concat(colors.N800, ")"),
211
- dark: "var(--ds-text-warning-inverse, ".concat(colors.N800, ")")
212
- },
213
- disabled: {
214
- light: "var(--ds-text-disabled, ".concat(colors.N70, ")"),
215
- dark: "var(--ds-text-disabled, ".concat(colors.DN30, ")")
216
- },
217
- selected: {
218
- light: "var(--ds-text-selected, ".concat(colors.N800, ")"),
219
- dark: "var(--ds-text-selected, ".concat(colors.N800, ")")
220
- },
221
- focusSelected: {
222
- light: "var(--ds-text-selected, ".concat(colors.N800, ")"),
223
- dark: "var(--ds-text-selected, ".concat(colors.N800, ")")
224
- }
225
- },
226
- danger: {
227
- default: {
228
- light: "var(--ds-text-inverse, ".concat(colors.N0, ")"),
229
- dark: "var(--ds-text-inverse, ".concat(colors.N0, ")")
230
- },
231
- disabled: {
232
- light: "var(--ds-text-disabled, ".concat(colors.N70, ")"),
233
- dark: "var(--ds-text-disabled, ".concat(colors.DN30, ")")
234
- },
235
- selected: {
236
- light: "var(--ds-text-selected, ".concat(colors.N0, ")"),
237
- dark: "var(--ds-text-selected, ".concat(colors.N0, ")")
238
- },
239
- focusSelected: {
240
- light: "var(--ds-text-selected, ".concat(colors.N0, ")"),
241
- dark: "var(--ds-text-selected, ".concat(colors.N0, ")")
242
- }
243
- },
244
- link: {
245
- default: {
246
- light: "var(--ds-link, ".concat(colors.B400, ")"),
247
- dark: "var(--ds-link, ".concat(colors.B100, ")")
248
- },
249
- hover: {
250
- light: "var(--ds-link, ".concat(colors.B300, ")"),
251
- dark: "var(--ds-link, ".concat(colors.B75, ")")
252
- },
253
- active: {
254
- light: "var(--ds-link-pressed, ".concat(colors.B500, ")"),
255
- dark: "var(--ds-link-pressed, ".concat(colors.B200, ")")
256
- },
257
- disabled: {
258
- light: "var(--ds-text-disabled, ".concat(colors.N70, ")"),
259
- dark: "var(--ds-text-disabled, ".concat(colors.DN100, ")")
260
- },
261
- selected: {
262
- light: "var(--ds-text-selected, ".concat(colors.N20, ")"),
263
- dark: "var(--ds-text-selected, ".concat(colors.N700, ")")
264
- },
265
- focusSelected: {
266
- light: "var(--ds-text-selected, ".concat(colors.N20, ")"),
267
- dark: "var(--ds-text-selected, ".concat(colors.N700, ")")
268
- }
269
- },
270
- subtle: {
271
- default: {
272
- light: "var(--ds-text, ".concat(colors.N500, ")"),
273
- dark: "var(--ds-text, ".concat(colors.DN400, ")")
274
- },
275
- active: {
276
- light: "var(--ds-text, ".concat(colors.B400, ")"),
277
- dark: "var(--ds-text, ".concat(colors.B400, ")")
278
- },
279
- disabled: {
280
- light: "var(--ds-text-disabled, ".concat(colors.N70, ")"),
281
- dark: "var(--ds-text-disabled, ".concat(colors.DN100, ")")
282
- },
283
- selected: {
284
- light: "var(--ds-text-selected, ".concat(colors.N20, ")"),
285
- dark: "var(--ds-text-selected, ".concat(colors.DN400, ")")
286
- },
287
- focusSelected: {
288
- light: "var(--ds-text-selected, ".concat(colors.N20, ")"),
289
- dark: "var(--ds-text-selected, ".concat(colors.DN400, ")")
290
- }
291
- },
292
- 'subtle-link': {
293
- default: {
294
- light: "var(--ds-text-subtle, ".concat(colors.N200, ")"),
295
- dark: "var(--ds-text-subtle, ".concat(colors.DN400, ")")
296
- },
297
- hover: {
298
- light: "var(--ds-text-subtle, ".concat(colors.N90, ")"),
299
- dark: "var(--ds-text-subtle, ".concat(colors.B50, ")")
300
- },
301
- active: {
302
- light: "var(--ds-text, ".concat(colors.N400, ")"),
303
- dark: "var(--ds-text, ".concat(colors.DN300, ")")
304
- },
305
- disabled: {
306
- light: "var(--ds-text-disabled, ".concat(colors.N70, ")"),
307
- dark: "var(--ds-text-disabled, ".concat(colors.DN100, ")")
308
- },
309
- selected: {
310
- light: "var(--ds-text-selected, ".concat(colors.N20, ")"),
311
- dark: "var(--ds-text-selected, ".concat(colors.DN400, ")")
312
- },
313
- focusSelected: {
314
- light: "var(--ds-text-selected, ".concat(colors.N20, ")"),
315
- dark: "var(--ds-text-selected, ".concat(colors.DN400, ")")
316
- }
317
- }
318
- }
319
- };
320
- export default values;
package/dist/types/old-button/shared/colors.d.ts DELETED
@@ -1,23 +0,0 @@
1
- import { type ThemeModes } from '@atlaskit/theme/types';
2
- import { type Appearance } from '../types';
3
- export type ColorRule = {
4
- [key in ThemeModes]: string;
5
- };
6
- export type ColorGroup = {
7
- default: ColorRule;
8
- hover?: ColorRule;
9
- active?: ColorRule;
10
- disabled?: ColorRule;
11
- selected?: ColorRule;
12
- focus?: ColorRule;
13
- focusSelected?: ColorRule;
14
- };
15
- type ColorPreset = {
16
- [key in Appearance]: ColorGroup;
17
- };
18
- type Values = {
19
- background: ColorPreset;
20
- color: ColorPreset;
21
- };
22
- declare const values: Values;
23
- export default values;
package/dist/types-ts4.5/old-button/shared/colors.d.ts DELETED
@@ -1,23 +0,0 @@
1
- import { type ThemeModes } from '@atlaskit/theme/types';
2
- import { type Appearance } from '../types';
3
- export type ColorRule = {
4
- [key in ThemeModes]: string;
5
- };
6
- export type ColorGroup = {
7
- default: ColorRule;
8
- hover?: ColorRule;
9
- active?: ColorRule;
10
- disabled?: ColorRule;
11
- selected?: ColorRule;
12
- focus?: ColorRule;
13
- focusSelected?: ColorRule;
14
- };
15
- type ColorPreset = {
16
- [key in Appearance]: ColorGroup;
17
- };
18
- type Values = {
19
- background: ColorPreset;
20
- color: ColorPreset;
21
- };
22
- declare const values: Values;
23
- export default values;