@dialpad/dialtone-tokens 1.6.5 → 1.7.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.
@@ -1,55 +1,66 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Tue, 31 Jan 2023 17:55:46 GMT
3
+ // Generated on Wed, 12 Apr 2023 00:40:06 GMT
4
4
 
5
- @dt-token-set-order-0: base;
6
- @dt-token-set-order-1: semantic;
7
- @dt-token-set-order-2: components/foo;
8
- @dt-token-set-order-3: components/bar;
9
- @dt-button-color-background-default: transparent;
10
- @dt-button-color-background-primary: #7C52FF;
11
- @dt-button-color-background-danger: #EC0E0E;
12
- @dt-button-color-text-default: #7C52FF;
13
- @dt-button-color-text-primary: #fff;
14
- @dt-button-color-text-danger: #fff;
15
- @dt-button-border-radius-extra-small: 0.7rem;
16
- @dt-button-border-radius-small: 0.75rem;
17
- @dt-button-border-radius-medium: 0.8rem;
18
- @dt-button-border-radius-large: 0.9rem;
19
- @dt-button-border-radius-extra-large: 1rem;
20
- @dt-button-space-gap: 16px;
21
- @dt-button-padding-horizontal-extra-small: 15px;
22
- @dt-button-padding-horizontal-small: 15px;
23
- @dt-button-padding-horizontal-medium: 15px;
24
- @dt-button-padding-horizontal-large: 63px;
25
- @dt-button-padding-horizontal-extra-large: 15px;
26
- @dt-button-padding-vertical-extra-small: 13px;
27
- @dt-button-padding-vertical-small: 13px;
28
- @dt-button-padding-vertical-medium: 15px;
29
- @dt-button-padding-vertical-large: 31px;
30
- @dt-button-padding-vertical-extra-large: 31px;
31
- @dt-button-font-size-extra-small: 1.2rem;
32
- @dt-button-font-size-small: 1.2rem;
33
- @dt-button-font-size-medium: 1.5rem;
34
- @dt-button-font-size-large: 1.9rem;
35
- @dt-button-font-size-extra-large: 2.7rem;
36
- @dt-button-line-height-size-extra-small: 120%;
37
- @dt-button-line-height-size-small: 140%;
38
- @dt-button-line-height-size-medium: 140%;
39
- @dt-button-line-height-size-large: 160%;
40
- @dt-button-line-height-size-extra-large: 160%;
41
- @dt-color-text-primary: #000000;
42
- @dt-color-text-secondary: #3a3a3a;
43
- @dt-color-text-tertiary: #555555;
44
- @dt-color-text-muted: #222222;
45
- @dt-color-text-placeholder: #808080;
46
- @dt-color-text-disabled: #808080;
47
- @dt-color-text-critical: #ec0e0e;
48
- @dt-color-text-success: #1aa340;
49
- @dt-color-text-warning: #815008;
50
- @dt-color-text-inverted-primary: #ffffff;
51
- @dt-color-text-inverted-secondary: #e9e9e9;
52
- @dt-color-text-link-primary: #7c52ff;
5
+ @dt-color-foreground-primary: #000000;
6
+ @dt-color-foreground-secondary: #3a3a3a;
7
+ @dt-color-foreground-tertiary: #555555;
8
+ @dt-color-foreground-muted: #222222;
9
+ @dt-color-foreground-placeholder: #808080;
10
+ @dt-color-foreground-disabled: #808080;
11
+ @dt-color-foreground-critical: #ec0e0e;
12
+ @dt-color-foreground-critical-strong: #b70b0b;
13
+ @dt-color-foreground-success: #1aa340;
14
+ @dt-color-foreground-success-strong: #124620;
15
+ @dt-color-foreground-warning: #815008;
16
+ @dt-color-foreground-primary-inverted: #ffffff;
17
+ @dt-color-foreground-secondary-inverted: #e9e9e9;
18
+ @dt-color-foreground-tertiary-inverted: #d2d2d2;
19
+ @dt-color-foreground-muted-inverted: #e9e9e9;
20
+ @dt-color-foreground-placeholder-inverted: #808080;
21
+ @dt-color-foreground-disabled-inverted: #808080;
22
+ @dt-color-foreground-critical-inverted: #ff8585;
23
+ @dt-color-foreground-critical-strong-inverted: #ffa4a4;
24
+ @dt-color-foreground-success-inverted: #b0ffa3;
25
+ @dt-color-foreground-success-strong-inverted: #d3ffcd;
26
+ @dt-color-foreground-warning-inverted: #fff4cc;
27
+ @dt-color-link-primary: #7c52ff;
28
+ @dt-color-link-critical: #ec0e0e;
29
+ @dt-color-link-success: #1aa340;
30
+ @dt-color-link-warning: #815008;
31
+ @dt-color-link-muted: #222222;
32
+ @dt-color-link-disabled: #808080;
33
+ @dt-color-link-primary-inverted: #ab7eff;
34
+ @dt-color-link-critical-inverted: #ff8585;
35
+ @dt-color-link-success-inverted: #b0ffa3;
36
+ @dt-color-link-warning-inverted: #fff4cc;
37
+ @dt-color-link-muted-inverted: #e9e9e9;
38
+ @dt-color-link-disabled-inverted: #808080;
39
+ @dt-color-link-primary-hover: #3a1d95;
40
+ @dt-color-link-critical-hover: #b70b0b;
41
+ @dt-color-link-success-hover: #124620;
42
+ @dt-color-link-warning-hover: #555555;
43
+ @dt-color-link-muted-hover: #000000;
44
+ @dt-color-link-disabled-hover: #808080;
45
+ @dt-color-link-primary-inverted-hover: #dac7ff;
46
+ @dt-color-link-critical-inverted-hover: #ffa4a4;
47
+ @dt-color-link-success-inverted-hover: #d3ffcd;
48
+ @dt-color-link-warning-inverted-hover: #f9f9f9;
49
+ @dt-color-link-muted-inverted-hover: #f9f9f9;
50
+ @dt-color-link-disabled-inverted-hover: #808080;
51
+ @dt-color-surface-secondary-opaque: #000000;
52
+ @dt-color-surface-moderate-opaque: #000000;
53
+ @dt-color-surface-bold-opaque: #000000;
54
+ @dt-color-surface-strong-opaque: #000000;
55
+ @dt-color-surface-contrast-opaque: #000000;
56
+ @dt-color-surface-critical-opaque: #ec0e0e;
57
+ @dt-color-surface-critical-subtle-opaque: #ec0e0e;
58
+ @dt-color-surface-warning-opaque: #ffdb80;
59
+ @dt-color-surface-warning-subtle-opaque: #ffdb80;
60
+ @dt-color-surface-success-opaque: #1aa341;
61
+ @dt-color-surface-success-subtle-opaque: #1aa341;
62
+ @dt-color-surface-info-opaque: #1769c6;
63
+ @dt-color-surface-info-subtle-opaque: #1769c6;
53
64
  @dt-color-surface-primary: #ffffff;
54
65
  @dt-color-surface-secondary: #f9f9f9;
55
66
  @dt-color-surface-moderate: #e9e9e9;
@@ -57,11 +68,55 @@
57
68
  @dt-color-surface-strong: #555555;
58
69
  @dt-color-surface-contrast: #222222;
59
70
  @dt-color-surface-critical: #ffe5e6;
71
+ @dt-color-surface-critical-subtle: #fff2f3;
72
+ @dt-color-surface-critical-strong: #b70b0b;
60
73
  @dt-color-surface-warning: #fff4cc;
74
+ @dt-color-surface-warning-subtle: #fffae5;
75
+ @dt-color-surface-warning-strong: #ffdb80;
61
76
  @dt-color-surface-success: #edf9eb;
77
+ @dt-color-surface-success-subtle: #f8fdf7;
78
+ @dt-color-surface-success-strong: #1aa340;
62
79
  @dt-color-surface-info: #eaf2fa;
80
+ @dt-color-surface-info-subtle: #f5f9fd;
81
+ @dt-color-surface-info-strong: #1768c6;
82
+ @dt-color-border-subtle: #000000;
83
+ @dt-color-border-default: #000000;
84
+ @dt-color-border-moderate: #000000;
85
+ @dt-color-border-bold: #000000;
86
+ @dt-color-border-subtle-inverted: #ffffff;
87
+ @dt-color-border-default-inverted: #ffffff;
88
+ @dt-color-border-moderate-inverted: #ffffff;
89
+ @dt-color-border-bold-inverted: #ffffff;
90
+ @dt-color-border-focus: #51a0fe;
91
+ @dt-color-border-critical: #ec0e0e;
92
+ @dt-color-border-success: #1aa340;
93
+ @dt-color-border-warning: #d28f2b;
94
+ @dt-color-border-brand: #7c52ff;
95
+ @dt-color-border-ai: #000000;
96
+ @dt-color-border-accent: #f9008e;
97
+ @dt-color-border-critical-subtle: #ff8585;
98
+ @dt-color-border-critical-strong: #b70b0b;
99
+ @dt-color-border-success-subtle: #b0ffa3;
100
+ @dt-color-border-success-strong: #124620;
101
+ @dt-color-border-warning-subtle: #ffdb80;
102
+ @dt-color-border-warning-strong: #674006;
103
+ @dt-color-border-brand-subtle: #dac7ff;
104
+ @dt-color-border-brand-strong: #3a1d95;
105
+ @dt-color-border-critical-inverted: #ff8585;
106
+ @dt-color-border-success-inverted: #b0ffa3;
107
+ @dt-color-border-warning-inverted: #ffdb80;
108
+ @dt-color-border-brand-inverted: #7c52ff;
109
+ @dt-color-border-critical-subtle-inverted: #b70b0b;
110
+ @dt-color-border-critical-strong-inverted: #ffe5e6;
111
+ @dt-color-border-success-subtle-inverted: #1aa340;
112
+ @dt-color-border-success-strong-inverted: #edf9eb;
113
+ @dt-color-border-warning-subtle-inverted: #d28f2b;
114
+ @dt-color-border-warning-strong-inverted: #fff4cc;
115
+ @dt-color-border-brand-subtle-inverted: #3a1d95;
116
+ @dt-color-border-brand-strong-inverted: #dac7ff;
63
117
  @dt-color-neutral-white: #ffffff;
64
118
  @dt-color-neutral-black: #000000;
119
+ @dt-color-neutral-transparent: #000000;
65
120
  @dt-color-black-100: #f9f9f9;
66
121
  @dt-color-black-200: #e9e9e9;
67
122
  @dt-color-black-300: #d2d2d2;
@@ -108,6 +163,8 @@
108
163
  @dt-color-tan-400: #3f3d3c;
109
164
  @dt-color-tan-500: #121212;
110
165
  @dt-color-gradient-magenta-purple: #000000;
166
+ @dt-color-brand-purple: #7c52ff;
167
+ @dt-color-brand-magenta: #f9008e;
111
168
  @dt-typography-body-small-font-family: -apple-system,BlinkMacSystemFont,"SF Pro","Segoe UI Adjusted","Segoe UI",SFMono,"Helvetica Neue",Cantarell,Ubuntu,Roboto,Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
112
169
  @dt-typography-body-small-font-weight: 400;
113
170
  @dt-typography-body-small-line-height: 140%;
@@ -252,27 +309,13 @@
252
309
  @dt-size-600: 3.2rem;
253
310
  @dt-size-700: 6.4rem;
254
311
  @dt-size-800: 12.8rem;
255
- @dt-size-icon-100: 1.2rem;
256
- @dt-size-icon-200: 1.4rem;
257
- @dt-size-icon-300: 1.8rem;
258
- @dt-size-icon-400: 2rem;
259
- @dt-size-icon-500: 2.4rem;
260
- @dt-size-icon-600: 3.2rem;
261
- @dt-size-icon-700: 3.8rem;
262
- @dt-size-icon-800: 4.8rem;
263
312
  @dt-size-border-0: 0;
264
313
  @dt-size-border-100: 0.1rem;
314
+ @dt-size-border-150: 0.15rem;
265
315
  @dt-size-border-200: 0.2rem;
266
316
  @dt-size-border-300: 0.4rem;
267
317
  @dt-size-border-400: 0.8rem;
268
- @dt-size-border-icon-100: 0.1rem;
269
- @dt-size-border-icon-200: 0.125rem;
270
- @dt-size-border-icon-300: 0.15rem;
271
- @dt-size-border-icon-400: 0.175rem;
272
- @dt-size-border-icon-500: 0.175rem;
273
- @dt-size-border-icon-600: 0.25rem;
274
- @dt-size-border-icon-700: 0.275rem;
275
- @dt-size-border-icon-800: 0.35rem;
318
+ @dt-size-border-focus: 0.3rem;
276
319
  @dt-size-base: 0.8rem;
277
320
  @dt-size-radius-0: 0;
278
321
  @dt-size-radius-100: 0.1rem;
@@ -281,6 +324,90 @@
281
324
  @dt-size-radius-400: 0.8rem;
282
325
  @dt-size-radius-500: 1.6rem;
283
326
  @dt-size-radius-600: 3.2rem;
327
+ @dt-inputs-size-border-default: 0.15rem;
328
+ @dt-inputs-size-border-status: 0.2rem;
329
+ @dt-inputs-size-radius-xs: 0.4rem;
330
+ @dt-inputs-size-radius-sm: 0.8rem;
331
+ @dt-inputs-size-radius-md: 0.8rem;
332
+ @dt-inputs-size-radius-lg: 1.2rem;
333
+ @dt-inputs-size-radius-xl: 1.6rem;
334
+ @dt-inputs-line-height-default: 120%;
335
+ @dt-inputs-font-size-xs: 1.2rem;
336
+ @dt-inputs-font-size-sm: 1.2rem;
337
+ @dt-inputs-font-size-md: 1.5rem;
338
+ @dt-inputs-font-size-lg: 1.9rem;
339
+ @dt-inputs-font-size-xl: 2.7rem;
340
+ @dt-inputs-color-foreground-default: #3A3A3A;
341
+ @dt-inputs-color-foreground-placeholder: #808080;
342
+ @dt-inputs-color-foreground-disabled: #808080;
343
+ @dt-inputs-color-border-default: #0000001a;
344
+ @dt-inputs-color-border-focus: #51A0FE;
345
+ @dt-inputs-color-border-critical: #EC0E0E;
346
+ @dt-inputs-color-border-success: #1AA340;
347
+ @dt-inputs-color-border-warning: #D28F2B;
348
+ @dt-inputs-color-border-disabled: transparent;
349
+ @dt-inputs-color-background-default: #00000008;
350
+ @dt-inputs-color-background-focus: #00000003;
351
+ @dt-inputs-color-background-disabled: #0000001f;
352
+ @dt-action-color-foreground-base-default: #7C52FF;
353
+ @dt-action-color-foreground-base-hover: #551FFF;
354
+ @dt-action-color-foreground-base-active: #551FFF;
355
+ @dt-action-color-foreground-base-primary-default: #ffffff;
356
+ @dt-action-color-foreground-critical-default: #EC0E0E;
357
+ @dt-action-color-foreground-critical-hover: #D90D0D;
358
+ @dt-action-color-foreground-critical-active: #D90D0D;
359
+ @dt-action-color-foreground-critical-primary-default: #ffffff;
360
+ @dt-action-color-foreground-inverted-default: #ffffff;
361
+ @dt-action-color-foreground-inverted-hover: #ffffff;
362
+ @dt-action-color-foreground-inverted-active: #ffffff;
363
+ @dt-action-color-foreground-inverted-primary-default: #7C52FF;
364
+ @dt-action-color-foreground-inverted-primary-hover: #3A1D95;
365
+ @dt-action-color-foreground-inverted-primary-active: #3A1D95;
366
+ @dt-action-color-foreground-muted-default: #3A3A3A;
367
+ @dt-action-color-foreground-muted-hover: #3A3A3A;
368
+ @dt-action-color-foreground-muted-active: #3A3A3A;
369
+ @dt-action-color-foreground-disabled-default: #808080;
370
+ @dt-action-color-background-base-default: transparent;
371
+ @dt-action-color-background-base-hover: #7c52ff0a;
372
+ @dt-action-color-background-base-active: #7c52ff24;
373
+ @dt-action-color-background-base-primary-default: #7C52FF;
374
+ @dt-action-color-background-base-primary-hover: #6533FF;
375
+ @dt-action-color-background-base-primary-active: #4D14FF;
376
+ @dt-action-color-background-critical-default: transparent;
377
+ @dt-action-color-background-critical-hover: #ec0e0e08;
378
+ @dt-action-color-background-critical-active: #ec0e0e17;
379
+ @dt-action-color-background-critical-primary-default: #EC0E0E;
380
+ @dt-action-color-background-critical-primary-hover: #D90D0D;
381
+ @dt-action-color-background-critical-primary-active: #C50C0C;
382
+ @dt-action-color-background-inverted-default: transparent;
383
+ @dt-action-color-background-inverted-hover: #ffffff26;
384
+ @dt-action-color-background-inverted-active: #ffffff4d;
385
+ @dt-action-color-background-inverted-primary-default: #ffffff;
386
+ @dt-action-color-background-inverted-primary-hover: #F5F0FF;
387
+ @dt-action-color-background-inverted-primary-active: #E1D1FF;
388
+ @dt-action-color-background-muted-default: transparent;
389
+ @dt-action-color-background-muted-hover: #2222220d;
390
+ @dt-action-color-background-muted-active: #2222221a;
391
+ @dt-action-color-background-disabled-default: #D2D2D2;
392
+ @dt-action-color-border-base-outlined-default: #7C52FF;
393
+ @dt-action-color-border-critical-outlined-default: #EC0E0E;
394
+ @dt-action-color-border-inverted-outlined-default: #F9F9F9;
395
+ @dt-action-color-border-muted-outlined-default: #555555;
396
+ @dt-theme-sidebar-color-foreground: #000000;
397
+ @dt-theme-sidebar-color-background: #F9F9F9;
398
+ @dt-theme-sidebar-icon-color-foreground: #3A3A3A;
399
+ @dt-theme-sidebar-status-color-foreground: #555555;
400
+ @dt-theme-sidebar-row-color-background: transparent;
401
+ @dt-theme-sidebar-row-color-background-hover: #0000001a;
402
+ @dt-theme-sidebar-row-color-background-active: #D2D2D2;
403
+ @dt-theme-sidebar-selected-row-color-foreground: #000000;
404
+ @dt-theme-sidebar-selected-row-color-background: #E9E9E9;
405
+ @dt-theme-presence-color-background-available: #1AA340;
406
+ @dt-theme-presence-color-background-busy-unavailable: #EC0E0E;
407
+ @dt-theme-presence-color-background-busy: #F6AB3C;
408
+ @dt-theme-presence-color-background-offline: #ffffff;
409
+ @dt-theme-mention-color-foreground: #ffffff;
410
+ @dt-theme-mention-color-background: #7C52FF;
284
411
  @dt-opacity-0: 0;
285
412
  @dt-opacity-100: 0.05;
286
413
  @dt-opacity-200: 0.1;
package/dist/tokens.json CHANGED
@@ -1,64 +1,119 @@
1
1
  {
2
- "dtTokenSetOrder0": "base",
3
- "dtTokenSetOrder1": "semantic",
4
- "dtTokenSetOrder2": "components/foo",
5
- "dtTokenSetOrder3": "components/bar",
6
- "dtButtonColorBackgroundDefault": "transparent",
7
- "dtButtonColorBackgroundPrimary": "#7C52FF",
8
- "dtButtonColorBackgroundDanger": "#EC0E0E",
9
- "dtButtonColorTextDefault": "#7C52FF",
10
- "dtButtonColorTextPrimary": "#fff",
11
- "dtButtonColorTextDanger": "#fff",
12
- "dtButtonBorderRadiusExtraSmall": "0.7rem",
13
- "dtButtonBorderRadiusSmall": "0.75rem",
14
- "dtButtonBorderRadiusMedium": "0.8rem",
15
- "dtButtonBorderRadiusLarge": "0.9rem",
16
- "dtButtonBorderRadiusExtraLarge": "1rem",
17
- "dtButtonSpaceGap": "16px",
18
- "dtButtonPaddingHorizontalExtraSmall": "15px",
19
- "dtButtonPaddingHorizontalSmall": "15px",
20
- "dtButtonPaddingHorizontalMedium": "15px",
21
- "dtButtonPaddingHorizontalLarge": "63px",
22
- "dtButtonPaddingHorizontalExtraLarge": "15px",
23
- "dtButtonPaddingVerticalExtraSmall": "13px",
24
- "dtButtonPaddingVerticalSmall": "13px",
25
- "dtButtonPaddingVerticalMedium": "15px",
26
- "dtButtonPaddingVerticalLarge": "31px",
27
- "dtButtonPaddingVerticalExtraLarge": "31px",
28
- "dtButtonFontSizeExtraSmall": "1.2rem",
29
- "dtButtonFontSizeSmall": "1.2rem",
30
- "dtButtonFontSizeMedium": "1.5rem",
31
- "dtButtonFontSizeLarge": "1.9rem",
32
- "dtButtonFontSizeExtraLarge": "2.7rem",
33
- "dtButtonLineHeightSizeExtraSmall": "120%",
34
- "dtButtonLineHeightSizeSmall": "140%",
35
- "dtButtonLineHeightSizeMedium": "140%",
36
- "dtButtonLineHeightSizeLarge": "160%",
37
- "dtButtonLineHeightSizeExtraLarge": "160%",
38
- "dtColorTextPrimary": "#000000",
39
- "dtColorTextSecondary": "#3A3A3A",
40
- "dtColorTextTertiary": "#555555",
41
- "dtColorTextMuted": "#22222280",
42
- "dtColorTextPlaceholder": "#808080",
43
- "dtColorTextDisabled": "#808080",
44
- "dtColorTextCritical": "#EC0E0E",
45
- "dtColorTextSuccess": "#1AA340",
46
- "dtColorTextWarning": "#815008",
47
- "dtColorTextInvertedPrimary": "#fff",
48
- "dtColorTextInvertedSecondary": "#E9E9E9",
49
- "dtColorTextLinkPrimary": "#7C52FF",
50
- "dtColorSurfacePrimary": "#fff",
2
+ "dtColorForegroundPrimary": "#000000",
3
+ "dtColorForegroundSecondary": "#3A3A3A",
4
+ "dtColorForegroundTertiary": "#555555",
5
+ "dtColorForegroundMuted": "#22222280",
6
+ "dtColorForegroundPlaceholder": "#808080",
7
+ "dtColorForegroundDisabled": "#808080",
8
+ "dtColorForegroundCritical": "#EC0E0E",
9
+ "dtColorForegroundCriticalStrong": "#B70B0B",
10
+ "dtColorForegroundSuccess": "#1AA340",
11
+ "dtColorForegroundSuccessStrong": "#124620",
12
+ "dtColorForegroundWarning": "#815008",
13
+ "dtColorForegroundPrimaryInverted": "#ffffff",
14
+ "dtColorForegroundSecondaryInverted": "#E9E9E9",
15
+ "dtColorForegroundTertiaryInverted": "#D2D2D2",
16
+ "dtColorForegroundMutedInverted": "#e9e9e999",
17
+ "dtColorForegroundPlaceholderInverted": "#808080",
18
+ "dtColorForegroundDisabledInverted": "#808080",
19
+ "dtColorForegroundCriticalInverted": "#FF8585",
20
+ "dtColorForegroundCriticalStrongInverted": "#ffa4a4",
21
+ "dtColorForegroundSuccessInverted": "#B0FFA3",
22
+ "dtColorForegroundSuccessStrongInverted": "#d3ffcd",
23
+ "dtColorForegroundWarningInverted": "#FFF4CC",
24
+ "dtColorLinkPrimary": "#7C52FF",
25
+ "dtColorLinkCritical": "#EC0E0E",
26
+ "dtColorLinkSuccess": "#1AA340",
27
+ "dtColorLinkWarning": "#815008",
28
+ "dtColorLinkMuted": "#22222280",
29
+ "dtColorLinkDisabled": "#808080",
30
+ "dtColorLinkPrimaryInverted": "#AB7EFF",
31
+ "dtColorLinkCriticalInverted": "#FF8585",
32
+ "dtColorLinkSuccessInverted": "#B0FFA3",
33
+ "dtColorLinkWarningInverted": "#FFF4CC",
34
+ "dtColorLinkMutedInverted": "#e9e9e999",
35
+ "dtColorLinkDisabledInverted": "#808080",
36
+ "dtColorLinkPrimaryHover": "#3A1D95",
37
+ "dtColorLinkCriticalHover": "#B70B0B",
38
+ "dtColorLinkSuccessHover": "#124620",
39
+ "dtColorLinkWarningHover": "#555555",
40
+ "dtColorLinkMutedHover": "#000000",
41
+ "dtColorLinkDisabledHover": "#808080",
42
+ "dtColorLinkPrimaryInvertedHover": "#DAC7FF",
43
+ "dtColorLinkCriticalInvertedHover": "#ffa4a4",
44
+ "dtColorLinkSuccessInvertedHover": "#d3ffcd",
45
+ "dtColorLinkWarningInvertedHover": "#F9F9F9",
46
+ "dtColorLinkMutedInvertedHover": "#F9F9F9",
47
+ "dtColorLinkDisabledInvertedHover": "#808080",
48
+ "dtColorSurfaceSecondaryOpaque": "#00000005",
49
+ "dtColorSurfaceModerateOpaque": "#00000017",
50
+ "dtColorSurfaceBoldOpaque": "#0000002e",
51
+ "dtColorSurfaceStrongOpaque": "#000000ab",
52
+ "dtColorSurfaceContrastOpaque": "#000000de",
53
+ "dtColorSurfaceCriticalOpaque": "#ec0e0e1c",
54
+ "dtColorSurfaceCriticalSubtleOpaque": "#ec0e0e0d",
55
+ "dtColorSurfaceWarningOpaque": "#ffdb8061",
56
+ "dtColorSurfaceWarningSubtleOpaque": "#ffdb802e",
57
+ "dtColorSurfaceSuccessOpaque": "#1aa34114",
58
+ "dtColorSurfaceSuccessSubtleOpaque": "#1aa34108",
59
+ "dtColorSurfaceInfoOpaque": "#1769c617",
60
+ "dtColorSurfaceInfoSubtleOpaque": "#1769c60a",
61
+ "dtColorSurfacePrimary": "#ffffff",
51
62
  "dtColorSurfaceSecondary": "#F9F9F9",
52
63
  "dtColorSurfaceModerate": "#E9E9E9",
53
64
  "dtColorSurfaceBold": "#D2D2D2",
54
65
  "dtColorSurfaceStrong": "#555555",
55
66
  "dtColorSurfaceContrast": "#222222",
56
67
  "dtColorSurfaceCritical": "#FFE5E6",
68
+ "dtColorSurfaceCriticalSubtle": "#fff2f3",
69
+ "dtColorSurfaceCriticalStrong": "#B70B0B",
57
70
  "dtColorSurfaceWarning": "#FFF4CC",
71
+ "dtColorSurfaceWarningSubtle": "#fffae5",
72
+ "dtColorSurfaceWarningStrong": "#FFDB80",
58
73
  "dtColorSurfaceSuccess": "#EDF9EB",
74
+ "dtColorSurfaceSuccessSubtle": "#f8fdf7",
75
+ "dtColorSurfaceSuccessStrong": "#1AA340",
59
76
  "dtColorSurfaceInfo": "#EAF2FA",
60
- "dtColorNeutralWhite": "#fff",
77
+ "dtColorSurfaceInfoSubtle": "#f5f9fd",
78
+ "dtColorSurfaceInfoStrong": "#1768C6",
79
+ "dtColorBorderSubtle": "#0000001a",
80
+ "dtColorBorderDefault": "#0000002e",
81
+ "dtColorBorderModerate": "#00000057",
82
+ "dtColorBorderBold": "#00000080",
83
+ "dtColorBorderSubtleInverted": "#ffffff24",
84
+ "dtColorBorderDefaultInverted": "#ffffff38",
85
+ "dtColorBorderModerateInverted": "#ffffff61",
86
+ "dtColorBorderBoldInverted": "#ffffff80",
87
+ "dtColorBorderFocus": "#51A0FE",
88
+ "dtColorBorderCritical": "#EC0E0E",
89
+ "dtColorBorderSuccess": "#1AA340",
90
+ "dtColorBorderWarning": "#D28F2B",
91
+ "dtColorBorderBrand": "#7C52FF",
92
+ "dtColorBorderAi": "linear-gradient(135deg, #F9008E 10%, #7C52FF 90%)",
93
+ "dtColorBorderAccent": "#F9008E",
94
+ "dtColorBorderCriticalSubtle": "#FF8585",
95
+ "dtColorBorderCriticalStrong": "#B70B0B",
96
+ "dtColorBorderSuccessSubtle": "#B0FFA3",
97
+ "dtColorBorderSuccessStrong": "#124620",
98
+ "dtColorBorderWarningSubtle": "#FFDB80",
99
+ "dtColorBorderWarningStrong": "#674006",
100
+ "dtColorBorderBrandSubtle": "#DAC7FF",
101
+ "dtColorBorderBrandStrong": "#3A1D95",
102
+ "dtColorBorderCriticalInverted": "#FF8585",
103
+ "dtColorBorderSuccessInverted": "#B0FFA3",
104
+ "dtColorBorderWarningInverted": "#FFDB80",
105
+ "dtColorBorderBrandInverted": "#7C52FF",
106
+ "dtColorBorderCriticalSubtleInverted": "#B70B0B",
107
+ "dtColorBorderCriticalStrongInverted": "#FFE5E6",
108
+ "dtColorBorderSuccessSubtleInverted": "#1AA340",
109
+ "dtColorBorderSuccessStrongInverted": "#EDF9EB",
110
+ "dtColorBorderWarningSubtleInverted": "#D28F2B",
111
+ "dtColorBorderWarningStrongInverted": "#FFF4CC",
112
+ "dtColorBorderBrandSubtleInverted": "#3A1D95",
113
+ "dtColorBorderBrandStrongInverted": "#DAC7FF",
114
+ "dtColorNeutralWhite": "#ffffff",
61
115
  "dtColorNeutralBlack": "#000000",
116
+ "dtColorNeutralTransparent": "transparent",
62
117
  "dtColorBlack100": "#F9F9F9",
63
118
  "dtColorBlack200": "#E9E9E9",
64
119
  "dtColorBlack300": "#D2D2D2",
@@ -105,6 +160,8 @@
105
160
  "dtColorTan400": "#3F3D3C",
106
161
  "dtColorTan500": "#121212",
107
162
  "dtColorGradientMagentaPurple": "linear-gradient(135deg, #F9008E 10%, #7C52FF 90%)",
163
+ "dtColorBrandPurple": "#7C52FF",
164
+ "dtColorBrandMagenta": "#F9008E",
108
165
  "dtTypographyBodySmallFontFamily": "-apple-system,BlinkMacSystemFont,\"SF Pro\",\"Segoe UI Adjusted\",\"Segoe UI\",SFMono,\"Helvetica Neue\",Cantarell,Ubuntu,Roboto,Arial,\"Noto Sans\",sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\"",
109
166
  "dtTypographyBodySmallFontWeight": 400,
110
167
  "dtTypographyBodySmallLineHeight": "140%",
@@ -249,27 +306,13 @@
249
306
  "dtSize600": "3.2rem",
250
307
  "dtSize700": "6.4rem",
251
308
  "dtSize800": "12.8rem",
252
- "dtSizeIcon100": "1.2rem",
253
- "dtSizeIcon200": "1.4rem",
254
- "dtSizeIcon300": "1.8rem",
255
- "dtSizeIcon400": "2rem",
256
- "dtSizeIcon500": "2.4rem",
257
- "dtSizeIcon600": "3.2rem",
258
- "dtSizeIcon700": "3.8rem",
259
- "dtSizeIcon800": "4.8rem",
260
309
  "dtSizeBorder0": "0",
261
310
  "dtSizeBorder100": "0.1rem",
311
+ "dtSizeBorder150": "0.15rem",
262
312
  "dtSizeBorder200": "0.2rem",
263
313
  "dtSizeBorder300": "0.4rem",
264
314
  "dtSizeBorder400": "0.8rem",
265
- "dtSizeBorderIcon100": "0.1rem",
266
- "dtSizeBorderIcon200": "0.125rem",
267
- "dtSizeBorderIcon300": "0.15rem",
268
- "dtSizeBorderIcon400": "0.175rem",
269
- "dtSizeBorderIcon500": "0.175rem",
270
- "dtSizeBorderIcon600": "0.25rem",
271
- "dtSizeBorderIcon700": "0.275rem",
272
- "dtSizeBorderIcon800": "0.35rem",
315
+ "dtSizeBorderFocus": "0.3rem",
273
316
  "dtSizeBase": "0.8rem",
274
317
  "dtSizeRadius0": "0",
275
318
  "dtSizeRadius100": "0.1rem",
@@ -278,6 +321,90 @@
278
321
  "dtSizeRadius400": "0.8rem",
279
322
  "dtSizeRadius500": "1.6rem",
280
323
  "dtSizeRadius600": "3.2rem",
324
+ "dtInputsSizeBorderDefault": "0.15rem",
325
+ "dtInputsSizeBorderStatus": "0.2rem",
326
+ "dtInputsSizeRadiusXs": "0.4rem",
327
+ "dtInputsSizeRadiusSm": "0.8rem",
328
+ "dtInputsSizeRadiusMd": "0.8rem",
329
+ "dtInputsSizeRadiusLg": "1.2rem",
330
+ "dtInputsSizeRadiusXl": "1.6rem",
331
+ "dtInputsLineHeightDefault": "120%",
332
+ "dtInputsFontSizeXs": "1.2rem",
333
+ "dtInputsFontSizeSm": "1.2rem",
334
+ "dtInputsFontSizeMd": "1.5rem",
335
+ "dtInputsFontSizeLg": "1.9rem",
336
+ "dtInputsFontSizeXl": "2.7rem",
337
+ "dtInputsColorForegroundDefault": "#3A3A3A",
338
+ "dtInputsColorForegroundPlaceholder": "#808080",
339
+ "dtInputsColorForegroundDisabled": "#808080",
340
+ "dtInputsColorBorderDefault": "#0000001a",
341
+ "dtInputsColorBorderFocus": "#51A0FE",
342
+ "dtInputsColorBorderCritical": "#EC0E0E",
343
+ "dtInputsColorBorderSuccess": "#1AA340",
344
+ "dtInputsColorBorderWarning": "#D28F2B",
345
+ "dtInputsColorBorderDisabled": "transparent",
346
+ "dtInputsColorBackgroundDefault": "#00000008",
347
+ "dtInputsColorBackgroundFocus": "#00000003",
348
+ "dtInputsColorBackgroundDisabled": "#0000001f",
349
+ "dtActionColorForegroundBaseDefault": "#7C52FF",
350
+ "dtActionColorForegroundBaseHover": "#551FFF",
351
+ "dtActionColorForegroundBaseActive": "#551FFF",
352
+ "dtActionColorForegroundBasePrimaryDefault": "#ffffff",
353
+ "dtActionColorForegroundCriticalDefault": "#EC0E0E",
354
+ "dtActionColorForegroundCriticalHover": "#D90D0D",
355
+ "dtActionColorForegroundCriticalActive": "#D90D0D",
356
+ "dtActionColorForegroundCriticalPrimaryDefault": "#ffffff",
357
+ "dtActionColorForegroundInvertedDefault": "#ffffff",
358
+ "dtActionColorForegroundInvertedHover": "#ffffff",
359
+ "dtActionColorForegroundInvertedActive": "#ffffff",
360
+ "dtActionColorForegroundInvertedPrimaryDefault": "#7C52FF",
361
+ "dtActionColorForegroundInvertedPrimaryHover": "#3A1D95",
362
+ "dtActionColorForegroundInvertedPrimaryActive": "#3A1D95",
363
+ "dtActionColorForegroundMutedDefault": "#3A3A3A",
364
+ "dtActionColorForegroundMutedHover": "#3A3A3A",
365
+ "dtActionColorForegroundMutedActive": "#3A3A3A",
366
+ "dtActionColorForegroundDisabledDefault": "#808080",
367
+ "dtActionColorBackgroundBaseDefault": "transparent",
368
+ "dtActionColorBackgroundBaseHover": "#7c52ff0a",
369
+ "dtActionColorBackgroundBaseActive": "#7c52ff24",
370
+ "dtActionColorBackgroundBasePrimaryDefault": "#7C52FF",
371
+ "dtActionColorBackgroundBasePrimaryHover": "#6533FF",
372
+ "dtActionColorBackgroundBasePrimaryActive": "#4D14FF",
373
+ "dtActionColorBackgroundCriticalDefault": "transparent",
374
+ "dtActionColorBackgroundCriticalHover": "#ec0e0e08",
375
+ "dtActionColorBackgroundCriticalActive": "#ec0e0e17",
376
+ "dtActionColorBackgroundCriticalPrimaryDefault": "#EC0E0E",
377
+ "dtActionColorBackgroundCriticalPrimaryHover": "#D90D0D",
378
+ "dtActionColorBackgroundCriticalPrimaryActive": "#C50C0C",
379
+ "dtActionColorBackgroundInvertedDefault": "transparent",
380
+ "dtActionColorBackgroundInvertedHover": "#ffffff26",
381
+ "dtActionColorBackgroundInvertedActive": "#ffffff4d",
382
+ "dtActionColorBackgroundInvertedPrimaryDefault": "#ffffff",
383
+ "dtActionColorBackgroundInvertedPrimaryHover": "#F5F0FF",
384
+ "dtActionColorBackgroundInvertedPrimaryActive": "#E1D1FF",
385
+ "dtActionColorBackgroundMutedDefault": "transparent",
386
+ "dtActionColorBackgroundMutedHover": "#2222220d",
387
+ "dtActionColorBackgroundMutedActive": "#2222221a",
388
+ "dtActionColorBackgroundDisabledDefault": "#D2D2D2",
389
+ "dtActionColorBorderBaseOutlinedDefault": "#7C52FF",
390
+ "dtActionColorBorderCriticalOutlinedDefault": "#EC0E0E",
391
+ "dtActionColorBorderInvertedOutlinedDefault": "#F9F9F9",
392
+ "dtActionColorBorderMutedOutlinedDefault": "#555555",
393
+ "dtThemeSidebarColorForeground": "#000000",
394
+ "dtThemeSidebarColorBackground": "#F9F9F9",
395
+ "dtThemeSidebarIconColorForeground": "#3A3A3A",
396
+ "dtThemeSidebarStatusColorForeground": "#555555",
397
+ "dtThemeSidebarRowColorBackground": "transparent",
398
+ "dtThemeSidebarRowColorBackgroundHover": "#0000001a",
399
+ "dtThemeSidebarRowColorBackgroundActive": "#D2D2D2",
400
+ "dtThemeSidebarSelectedRowColorForeground": "#000000",
401
+ "dtThemeSidebarSelectedRowColorBackground": "#E9E9E9",
402
+ "dtThemePresenceColorBackgroundAvailable": "#1AA340",
403
+ "dtThemePresenceColorBackgroundBusyUnavailable": "#EC0E0E",
404
+ "dtThemePresenceColorBackgroundBusy": "#F6AB3C",
405
+ "dtThemePresenceColorBackgroundOffline": "#ffffff",
406
+ "dtThemeMentionColorForeground": "#ffffff",
407
+ "dtThemeMentionColorBackground": "#7C52FF",
281
408
  "dtOpacity0": 0,
282
409
  "dtOpacity100": 0.05,
283
410
  "dtOpacity200": 0.1,
package/package.json CHANGED
@@ -1,12 +1,12 @@
1
1
  {
2
2
  "name": "@dialpad/dialtone-tokens",
3
- "version": "1.6.5",
3
+ "version": "1.7.0",
4
4
  "description": "Design tokens for Dialtone.",
5
5
  "main": "index.js",
6
6
  "scripts": {
7
7
  "test": "echo \"Error: no test specified\" && exit 1",
8
8
  "build": "npm run transform && ./build.js && cp ./AndroidManifest.xml dist/android && ./gradlew publishToMavenLocal -Pversion=$npm_package_version && ./build-ios.js",
9
- "transform": "token-transformer base.json tokens/tokens.json --expandTypography=true --expandShadow=true",
9
+ "transform": "token-transformer base.json tokens/tokens.json base,semantic --expandTypography=true --expandShadow=true",
10
10
  "prepublishOnly": "npm run build",
11
11
  "release": "semantic-release --no-ci --extends ./release-local.config.js"
12
12
  },
@@ -33,7 +33,7 @@
33
33
  "@semantic-release/exec": "^6.0.3",
34
34
  "@semantic-release/git": "^10.0.1",
35
35
  "maven": "^5.0.0",
36
- "style-dictionary": "^3.7.1",
37
- "token-transformer": "^0.0.24"
36
+ "style-dictionary": "^3.7.2",
37
+ "token-transformer": "^0.0.32"
38
38
  }
39
39
  }