@servicetitan/hammer-token 0.0.0-rc-1.47.0-20251104205759 → 0.0.0-rc-3.0.0-20260114215531

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 (76) hide show
  1. package/CHANGELOG.md +29 -1
  2. package/README.md +222 -0
  3. package/build/web/core/component-variables.scss +114 -130
  4. package/build/web/core/component.d.ts +65 -0
  5. package/build/web/core/component.js +248 -267
  6. package/build/web/core/component.scss +63 -69
  7. package/build/web/core/css-utils/a2-border.css +39 -41
  8. package/build/web/core/css-utils/a2-color.css +351 -227
  9. package/build/web/core/css-utils/a2-font.css +0 -2
  10. package/build/web/core/css-utils/a2-spacing.css +0 -2
  11. package/build/web/core/css-utils/a2-utils.css +418 -292
  12. package/build/web/core/css-utils/border.css +39 -41
  13. package/build/web/core/css-utils/color.css +351 -227
  14. package/build/web/core/css-utils/font.css +0 -2
  15. package/build/web/core/css-utils/spacing.css +0 -2
  16. package/build/web/core/css-utils/utils.css +418 -292
  17. package/build/web/core/index.d.ts +6 -0
  18. package/build/web/core/index.js +1 -1
  19. package/build/web/core/primitive-variables.scss +130 -71
  20. package/build/web/core/primitive.d.ts +185 -0
  21. package/build/web/core/primitive.js +328 -72
  22. package/build/web/core/primitive.scss +183 -124
  23. package/build/web/core/semantic-variables.scss +287 -220
  24. package/build/web/core/semantic.d.ts +194 -0
  25. package/build/web/core/semantic.js +875 -347
  26. package/build/web/core/semantic.scss +192 -140
  27. package/build/web/index.d.ts +3 -4
  28. package/build/web/index.js +0 -1
  29. package/build/web/types.d.ts +17 -0
  30. package/config.js +121 -496
  31. package/package.json +5 -4
  32. package/src/global/primitive/breakpoint.tokens.json +39 -0
  33. package/src/global/primitive/color.tokens.json +536 -0
  34. package/src/global/primitive/duration.tokens.json +32 -0
  35. package/src/global/primitive/font.tokens.json +103 -0
  36. package/src/global/primitive/radius.tokens.json +67 -0
  37. package/src/global/primitive/size.tokens.json +123 -0
  38. package/src/global/primitive/transition.tokens.json +20 -0
  39. package/src/theme/core/background.tokens.json +981 -0
  40. package/src/theme/core/border.tokens.json +148 -0
  41. package/src/theme/core/charts.tokens.json +802 -0
  42. package/src/theme/core/component/button.tokens.json +752 -0
  43. package/src/theme/core/component/checkbox.tokens.json +292 -0
  44. package/src/theme/core/focus.tokens.json +48 -0
  45. package/src/theme/core/foreground.tokens.json +288 -0
  46. package/src/theme/core/shadow.tokens.json +43 -0
  47. package/src/theme/core/status.tokens.json +70 -0
  48. package/src/theme/core/typography.tokens.json +100 -0
  49. package/src/utils/copy-css-utils-cli.js +13 -0
  50. package/src/utils/css-utils-format-utils.js +98 -1
  51. package/src/utils/sd-build-configs.js +372 -0
  52. package/src/utils/sd-formats.js +752 -0
  53. package/src/utils/sd-transforms.js +126 -0
  54. package/src/utils/token-helpers.js +555 -0
  55. package/tsconfig.json +18 -0
  56. package/.turbo/turbo-build.log +0 -37
  57. package/build/web/core/raw.js +0 -234
  58. package/src/global/primitive/breakpoint.js +0 -19
  59. package/src/global/primitive/color.js +0 -231
  60. package/src/global/primitive/duration.js +0 -16
  61. package/src/global/primitive/font.js +0 -60
  62. package/src/global/primitive/radius.js +0 -31
  63. package/src/global/primitive/size.js +0 -55
  64. package/src/global/primitive/transition.js +0 -16
  65. package/src/theme/core/background.js +0 -170
  66. package/src/theme/core/border.js +0 -103
  67. package/src/theme/core/charts.js +0 -464
  68. package/src/theme/core/component/button.js +0 -708
  69. package/src/theme/core/component/checkbox.js +0 -405
  70. package/src/theme/core/focus.js +0 -35
  71. package/src/theme/core/foreground.js +0 -148
  72. package/src/theme/core/overlay.js +0 -137
  73. package/src/theme/core/shadow.js +0 -29
  74. package/src/theme/core/status.js +0 -49
  75. package/src/theme/core/typography.js +0 -82
  76. package/type/types.ts +0 -344
@@ -1,252 +1,319 @@
1
1
  $light: (
2
- background-color: #ffffff,
3
- background-color-strong: #f7f7f7,
4
- background-color-stronger: #eeeeee,
5
- background-color-strongest: #bcbcbd,
6
- background-color-primary: #0265DC,
7
- background-color-primary-subdued: #E0F2FF,
8
- background-color-success: #007A4D,
9
- background-color-success-subdued: #CEF8E0,
10
- background-color-danger: #e13212,
11
- background-color-danger-subdued: #ffece9,
12
- background-color-warning: #ffbe00,
13
- background-color-disabled: #606162,
14
- background-color-inverted: #2d2e31,
15
- background-color-inverted-strong: #141414,
16
- border-color: #949596,
17
- border-color-subdued: #dfe0e1,
18
- border-color-strong: #444445,
19
- border-color-primary: #0265DC,
20
- border-color-success: #007A4D,
21
- border-color-danger: #e13212,
22
- charts-monochrome-01-color: #3892F3,
23
- charts-monochrome-01-stroke: transparent,
24
- charts-monochrome-01-pattern: solid,
2
+ status-color-info: var(--a2-color-blue-500, #1a82ff),
3
+ status-color-danger: var(--a2-color-red-500, #ff3914),
4
+ status-color-success: var(--a2-color-green-500, #09a569),
5
+ status-color-warning: var(--a2-color-yellow-500, #d6a000),
6
+ background-color-default: var(--a2-color-neutral-0, #ffffff),
7
+ background-color-default-hover: var(--a2-color-neutral-10, #fcfcfc),
8
+ background-color-default-active: var(--a2-color-neutral-30, #f6f6f6),
9
+ background-color-secondary: #0404040F,
10
+ background-color-secondary-hover: #04040414,
11
+ background-color-secondary-active: #04040429,
12
+ background-color-transparent-default: "rgba(0, 0, 0, 0)",
13
+ background-color-transparent-default-hover: #8b8b8b14,
14
+ background-color-transparent-default-active: #8b8b8b29,
15
+ background-color-transparent-primary: "rgba(0, 0, 0, 0)",
16
+ background-color-transparent-primary-hover: #1a82ff1A,
17
+ background-color-transparent-primary-active: #1a82ff4D,
18
+ background-color-transparent-danger: "rgba(0, 0, 0, 0)",
19
+ background-color-transparent-danger-hover: #ff39141A,
20
+ background-color-transparent-danger-active: #ff39144D,
21
+ background-color-strong: var(--a2-color-neutral-30, #f6f6f6),
22
+ background-color-strong-hover: var(--a2-color-neutral-50, #eeeeee),
23
+ background-color-strong-active: var(--a2-color-neutral-60, #ebebeb),
24
+ background-color-stronger: var(--a2-color-neutral-70, #e8e8e8),
25
+ background-color-stronger-hover: var(--a2-color-neutral-90, #e2e2e2),
26
+ background-color-stronger-active: var(--a2-color-neutral-100, #dfdfdf),
27
+ background-color-strongest: var(--a2-color-neutral-70, #e8e8e8),
28
+ background-color-strongest-hover: var(--a2-color-neutral-90, #e2e2e2),
29
+ background-color-strongest-active: var(--a2-color-neutral-100, #dfdfdf),
30
+ background-color-primary: var(--a2-color-blue-500, #1a82ff),
31
+ background-color-primary-hover: var(--a2-color-blue-600, #0065de),
32
+ background-color-primary-active: var(--a2-color-blue-700, #004da9),
33
+ background-color-primary-subdued: var(--a2-color-blue-100, #cce3ff),
34
+ background-color-primary-subdued-hover: var(--a2-color-blue-200, #9ecaff),
35
+ background-color-primary-subdued-active: var(--a2-color-blue-300, #70b1ff),
36
+ background-color-success: var(--a2-status-color-success, var(--a2-color-green-500, #09a569)),
37
+ background-color-success-hover: var(--a2-color-green-700, #05613e),
38
+ background-color-success-active: var(--a2-color-green-700, #05613e),
39
+ background-color-success-subdued: var(--a2-color-green-100, #b8f5dd),
40
+ background-color-success-subdued-hover: var(--a2-color-green-700, #05613e),
41
+ background-color-success-subdued-active: var(--a2-color-green-700, #05613e),
42
+ background-color-danger: var(--a2-status-color-danger, var(--a2-color-red-500, #ff3914)),
43
+ background-color-danger-hover: var(--a2-color-red-600, #d62100),
44
+ background-color-danger-active: var(--a2-color-red-700, #a31900),
45
+ background-color-danger-subdued: var(--a2-color-red-100, #ffd4cc),
46
+ background-color-danger-subdued-hover: var(--a2-color-red-200, #ffac9e),
47
+ background-color-danger-subdued-active: var(--a2-color-red-300, #ff8974),
48
+ background-color-warning: var(--a2-status-color-warning, var(--a2-color-yellow-500, #d6a000)),
49
+ background-color-warning-hover: var(--a2-color-yellow-600, #a87d00),
50
+ background-color-warning-active: var(--a2-color-yellow-600, #a87d00),
51
+ background-color-warning-subdued: var(--a2-color-yellow-100, #fff0c2),
52
+ background-color-warning-subdued-hover: var(--a2-color-yellow-600, #a87d00),
53
+ background-color-warning-subdued-active: var(--a2-color-yellow-600, #a87d00),
54
+ background-color-disabled: var(--a2-color-neutral-100, #dfdfdf),
55
+ background-color-inverted: var(--a2-color-neutral-300, #a8a8a8),
56
+ background-color-inverted-hover: var(--a2-color-neutral-300, #a8a8a8),
57
+ background-color-inverted-active: var(--a2-color-neutral-300, #a8a8a8),
58
+ background-color-inverted-strong: var(--a2-color-neutral-400, #8b8b8b),
59
+ background-color-inverted-strong-hover: var(--a2-color-neutral-300, #a8a8a8),
60
+ background-color-inverted-strong-active: var(--a2-color-neutral-300, #a8a8a8),
61
+ border-color-default: var(--a2-color-neutral-80, #e5e5e5),
62
+ border-color-subdued: var(--a2-color-neutral-60, #ebebeb),
63
+ border-color-strong: var(--a2-color-neutral-200, #c4c4c4),
64
+ border-color-primary: var(--a2-status-color-info, var(--a2-color-blue-500, #1a82ff)),
65
+ border-color-success: var(--a2-status-color-success, var(--a2-color-green-500, #09a569)),
66
+ border-color-danger: var(--a2-status-color-danger, var(--a2-color-red-500, #ff3914)),
67
+ charts-monochrome-01-color: #3892f3,
68
+ charts-monochrome-01-stroke-color: "rgba(0, 0, 0, 0)",
25
69
  charts-monochrome-02-color: #08389c,
26
- charts-monochrome-02-stroke: transparent,
27
- charts-monochrome-02-pattern: solid,
28
- charts-monochrome-03-color: #F2F9FF,
29
- charts-monochrome-03-stroke: #3892F3,
30
- charts-monochrome-03-pattern: striped,
31
- charts-monochrome-04-color: #F2F9FF,
32
- charts-monochrome-04-stroke: #3892F3,
33
- charts-monochrome-04-pattern: solid,
34
- charts-categorical-10-color: #D57A5C,
35
- charts-categorical-10-stroke: transparent,
36
- charts-categorical-10-pattern: solid,
37
- charts-categorical-01-color: #3892F3,
38
- charts-categorical-01-stroke: transparent,
39
- charts-categorical-01-pattern: solid,
70
+ charts-monochrome-02-stroke-color: "rgba(0, 0, 0, 0)",
71
+ charts-monochrome-03-color: #f2f9ff,
72
+ charts-monochrome-03-stroke-color: #3892f3,
73
+ charts-monochrome-04-color: #f2f9ff,
74
+ charts-monochrome-04-stroke-color: #3892f3,
75
+ charts-categorical-10-color: #d57a5c,
76
+ charts-categorical-10-stroke-color: "rgba(0, 0, 0, 0)",
77
+ charts-categorical-01-color: #3892f3,
78
+ charts-categorical-01-stroke-color: "rgba(0, 0, 0, 0)",
40
79
  charts-categorical-02-color: #08389c,
41
- charts-categorical-02-stroke: transparent,
42
- charts-categorical-02-pattern: solid,
43
- charts-categorical-03-color: #0FA2B8,
44
- charts-categorical-03-stroke: transparent,
45
- charts-categorical-03-pattern: solid,
46
- charts-categorical-04-color: #907AF5,
47
- charts-categorical-04-stroke: transparent,
48
- charts-categorical-04-pattern: solid,
49
- charts-categorical-05-color: #DE52CE,
50
- charts-categorical-05-stroke: transparent,
51
- charts-categorical-05-pattern: solid,
52
- charts-categorical-06-color: #C2185B,
53
- charts-categorical-06-stroke: transparent,
54
- charts-categorical-06-pattern: solid,
55
- charts-categorical-07-color: #759E15,
56
- charts-categorical-07-stroke: transparent,
57
- charts-categorical-07-pattern: solid,
58
- charts-categorical-08-color: #AC6400,
59
- charts-categorical-08-stroke: transparent,
60
- charts-categorical-08-pattern: solid,
61
- charts-categorical-09-color: #EB7200,
62
- charts-categorical-09-stroke: transparent,
63
- charts-categorical-09-pattern: solid,
64
- charts-status-success-color: #007A4D,
65
- charts-status-success-stroke: transparent,
66
- charts-status-success-pattern: solid,
80
+ charts-categorical-02-stroke-color: "rgba(0, 0, 0, 0)",
81
+ charts-categorical-03-color: #0fa2b8,
82
+ charts-categorical-03-stroke-color: "rgba(0, 0, 0, 0)",
83
+ charts-categorical-04-color: #907af5,
84
+ charts-categorical-04-stroke-color: "rgba(0, 0, 0, 0)",
85
+ charts-categorical-05-color: #de52ce,
86
+ charts-categorical-05-stroke-color: "rgba(0, 0, 0, 0)",
87
+ charts-categorical-06-color: #c2185b,
88
+ charts-categorical-06-stroke-color: "rgba(0, 0, 0, 0)",
89
+ charts-categorical-07-color: #759e15,
90
+ charts-categorical-07-stroke-color: "rgba(0, 0, 0, 0)",
91
+ charts-categorical-08-color: #ac6400,
92
+ charts-categorical-08-stroke-color: "rgba(0, 0, 0, 0)",
93
+ charts-categorical-09-color: #eb7200,
94
+ charts-categorical-09-stroke-color: "rgba(0, 0, 0, 0)",
95
+ charts-status-success-color: #007a4d,
96
+ charts-status-success-stroke-color: "rgba(0, 0, 0, 0)",
67
97
  charts-status-warning-color: #ffbe00,
68
- charts-status-warning-stroke: transparent,
69
- charts-status-warning-pattern: solid,
98
+ charts-status-warning-stroke-color: "rgba(0, 0, 0, 0)",
70
99
  charts-status-danger-color: #e13212,
71
- charts-status-danger-stroke: transparent,
72
- charts-status-danger-pattern: solid,
100
+ charts-status-danger-stroke-color: "rgba(0, 0, 0, 0)",
73
101
  charts-status-neutral-color: #ffffff,
74
- charts-status-neutral-stroke: #8C9CA5,
75
- charts-status-neutral-pattern: striped,
76
- focus-ring-color: #0265DC,
77
- focus-ring-color-danger: #e13212,
78
- foreground-color: #141414,
79
- foreground-color-subdued: #737475,
80
- foreground-color-primary: #0265DC,
81
- foreground-color-danger: #e13212,
82
- foreground-color-inverted: #ffffff,
83
- foreground-color-on-primary: #ffffff,
84
- foreground-color-on-danger: #ffffff,
85
- foreground-color-on-danger-subdued: #bf2a00,
86
- foreground-color-on-warning: #141414,
87
- foreground-color-active-primary: #004491,
88
- foreground-color-active-danger: #bf2a00,
89
- foreground-color-hover-primary: #004491,
90
- foreground-color-hover-danger: #bf2a00,
91
- overlay-color-active: #14141429,
92
- overlay-color-active-primary: #0265DC4D,
93
- overlay-color-active-danger: #e132124D,
94
- overlay-color-active-on: #14141429,
95
- overlay-color-active-on-primary: #14141466,
96
- overlay-color-active-on-danger: #14141466,
97
- overlay-color-hover: #14141414,
98
- overlay-color-hover-primary: #0265DC1A,
99
- overlay-color-hover-danger: #e132121A,
100
- overlay-color-hover-on: #14141414,
101
- overlay-color-hover-on-primary: #14141433,
102
- overlay-color-hover-on-danger: #14141433,
103
- shadow-color: #14141414,
104
- status-color-info: #0265DC,
105
- status-color-danger: #e13212,
106
- status-color-success: #007A4D,
107
- status-color-warning: #ffbe00,
102
+ charts-status-neutral-stroke-color: #8c9ca5,
103
+ focus-ring-color-default: var(--a2-color-blue-500, #1a82ff),
104
+ focus-ring-color-danger: var(--a2-color-red-500, #ff3914),
105
+ foreground-color-default: var(--a2-color-neutral-950, #040404),
106
+ foreground-color-subdued: var(--a2-color-neutral-90, #e2e2e2),
107
+ foreground-color-primary: var(--a2-color-blue-500, #1a82ff),
108
+ foreground-color-primary-hover: var(--a2-color-blue-600, #0065de),
109
+ foreground-color-primary-active: var(--a2-color-blue-600, #0065de),
110
+ foreground-color-danger: var(--a2-status-color-danger, var(--a2-color-red-500, #ff3914)),
111
+ foreground-color-danger-hover: var(--a2-color-red-600, #d62100),
112
+ foreground-color-danger-active: var(--a2-color-red-600, #d62100),
113
+ foreground-color-inverted: var(--a2-color-neutral-0, #ffffff),
114
+ foreground-color-on-primary: var(--a2-color-neutral-0, #ffffff),
115
+ foreground-color-on-primary-hover: var(--a2-color-neutral-0, #ffffff),
116
+ foreground-color-on-primary-active: var(--a2-color-neutral-0, #ffffff),
117
+ foreground-color-on-danger: var(--a2-color-neutral-0, #ffffff),
118
+ foreground-color-on-danger-subdued: var(--a2-color-red-600, #d62100),
119
+ foreground-color-on-danger-hover: var(--a2-color-neutral-0, #ffffff),
120
+ foreground-color-on-danger-active: var(--a2-color-neutral-0, #ffffff),
121
+ foreground-color-on-warning: var(--a2-color-neutral-950, #040404),
122
+ shadow-color: #8b8b8b14,
108
123
  );
109
124
  $dark: (
110
- background-color: #141414,
111
- background-color-strong: #2d2e31,
112
- background-color-stronger: #444445,
113
- background-color-strongest: #737475,
114
- background-color-primary: #78BBFA,
115
- background-color-primary-subdued: #78BBFA33,
116
- background-color-success: #49CC93,
117
- background-color-success-subdued: #49CC9333,
118
- background-color-danger: #ff745f,
119
- background-color-danger-subdued: #ff745f33,
120
- background-color-warning: #ffe278,
121
- background-color-disabled: #606162,
122
- background-color-inverted: #fafafa,
123
- background-color-inverted-strong: #ffffff,
124
- border-color: #606162,
125
- border-color-subdued: #444445,
126
- border-color-strong: #dfe0e1,
127
- border-color-primary: #78BBFA,
128
- border-color-success: #49CC93,
129
- border-color-danger: #ff745f,
125
+ status-color-info: var(--a2-color-blue-100, #cce3ff),
126
+ status-color-danger: var(--a2-color-red-100, #ffd4cc),
127
+ status-color-success: var(--a2-color-green-100, #b8f5dd),
128
+ status-color-warning: var(--a2-color-yellow-100, #fff0c2),
129
+ background-color-default: var(--a2-color-neutral-400, #8b8b8b),
130
+ background-color-default-hover: var(--a2-color-neutral-30, #f6f6f6),
131
+ background-color-default-active: var(--a2-color-neutral-10, #fcfcfc),
132
+ background-color-secondary: #ffffff0F,
133
+ background-color-secondary-hover: #ffffff14,
134
+ background-color-secondary-active: #ffffff29,
135
+ background-color-transparent-default: "rgba(0, 0, 0, 0)",
136
+ background-color-transparent-default-hover: #ffffff14,
137
+ background-color-transparent-default-active: #ffffff29,
138
+ background-color-transparent-primary: "rgba(0, 0, 0, 0)",
139
+ background-color-transparent-primary-hover: #70b1ff1A,
140
+ background-color-transparent-primary-active: #70b1ff40,
141
+ background-color-transparent-danger: "rgba(0, 0, 0, 0)",
142
+ background-color-transparent-danger-hover: #ff89741A,
143
+ background-color-transparent-danger-active: #ff897440,
144
+ background-color-strong: var(--a2-color-neutral-300, #a8a8a8),
145
+ background-color-strong-hover: var(--a2-color-neutral-900, #1a1a1a),
146
+ background-color-strong-active: var(--a2-color-neutral-800, #292929),
147
+ background-color-stronger: var(--a2-color-neutral-800, #292929),
148
+ background-color-stronger-hover: var(--a2-color-neutral-700, #404040),
149
+ background-color-stronger-active: var(--a2-color-neutral-600, #545454),
150
+ background-color-strongest: var(--a2-color-neutral-90, #e2e2e2),
151
+ background-color-strongest-hover: var(--a2-color-neutral-10, #fcfcfc),
152
+ background-color-strongest-active: var(--a2-color-neutral-900, #1a1a1a),
153
+ background-color-primary: var(--a2-color-blue-300, #70b1ff),
154
+ background-color-primary-hover: var(--a2-color-blue-200, #9ecaff),
155
+ background-color-primary-active: var(--a2-color-blue-100, #cce3ff),
156
+ background-color-primary-subdued: #70b1ff33,
157
+ background-color-primary-subdued-hover: var(--a2-color-blue-800, #003472),
158
+ background-color-primary-subdued-active: var(--a2-color-blue-700, #004da9),
159
+ background-color-success: var(--a2-status-color-success, var(--a2-color-green-500, #09a569)),
160
+ background-color-success-hover: var(--a2-color-green-100, #b8f5dd),
161
+ background-color-success-active: var(--a2-color-green-100, #b8f5dd),
162
+ background-color-success-subdued: #3be3a233,
163
+ background-color-success-subdued-hover: var(--a2-color-green-100, #b8f5dd),
164
+ background-color-success-subdued-active: var(--a2-color-green-100, #b8f5dd),
165
+ background-color-danger: var(--a2-status-color-danger, var(--a2-color-red-500, #ff3914)),
166
+ background-color-danger-hover: var(--a2-color-red-200, #ffac9e),
167
+ background-color-danger-active: var(--a2-color-red-100, #ffd4cc),
168
+ background-color-danger-subdued: #ff897433,
169
+ background-color-danger-subdued-hover: var(--a2-color-red-600, #d62100),
170
+ background-color-danger-subdued-active: var(--a2-color-red-800, #731100),
171
+ background-color-warning: var(--a2-status-color-warning, var(--a2-color-yellow-500, #d6a000)),
172
+ background-color-warning-hover: var(--a2-color-yellow-100, #fff0c2),
173
+ background-color-warning-active: var(--a2-color-yellow-100, #fff0c2),
174
+ background-color-warning-subdued: #ffcf4233,
175
+ background-color-warning-subdued-hover: var(--a2-color-yellow-100, #fff0c2),
176
+ background-color-warning-subdued-active: var(--a2-color-yellow-100, #fff0c2),
177
+ background-color-disabled: var(--a2-color-neutral-100, #dfdfdf),
178
+ background-color-inverted: var(--a2-color-neutral-20, #f9f9f9),
179
+ background-color-inverted-hover: var(--a2-color-neutral-20, #f9f9f9),
180
+ background-color-inverted-active: var(--a2-color-neutral-20, #f9f9f9),
181
+ background-color-inverted-strong: var(--a2-color-neutral-0, #ffffff),
182
+ background-color-inverted-strong-hover: var(--a2-color-neutral-20, #f9f9f9),
183
+ background-color-inverted-strong-active: var(--a2-color-neutral-20, #f9f9f9),
184
+ border-color-default: var(--a2-color-neutral-100, #dfdfdf),
185
+ border-color-subdued: var(--a2-color-neutral-200, #c4c4c4),
186
+ border-color-strong: var(--a2-color-neutral-60, #ebebeb),
187
+ border-color-primary: var(--a2-status-color-info, var(--a2-color-blue-500, #1a82ff)),
188
+ border-color-success: var(--a2-status-color-success, var(--a2-color-green-500, #09a569)),
189
+ border-color-danger: var(--a2-status-color-danger, var(--a2-color-red-500, #ff3914)),
130
190
  charts-monochrome-01-color: #8AC3FF,
131
- charts-monochrome-01-stroke: transparent,
132
- charts-monochrome-01-pattern: solid,
191
+ charts-monochrome-01-stroke-color: rgba(0, 0, 0, 0),
133
192
  charts-monochrome-02-color: #3476FF,
134
- charts-monochrome-02-stroke: transparent,
135
- charts-monochrome-02-pattern: solid,
193
+ charts-monochrome-02-stroke-color: rgba(0, 0, 0, 0),
136
194
  charts-monochrome-03-color: #141414,
137
- charts-monochrome-03-stroke: #8AC3FF,
138
- charts-monochrome-03-pattern: striped,
195
+ charts-monochrome-03-stroke-color: #8AC3FF,
139
196
  charts-monochrome-04-color: #F2F9FF,
140
- charts-monochrome-04-stroke: #8AC3FF,
141
- charts-monochrome-04-pattern: solid,
197
+ charts-monochrome-04-stroke-color: #8AC3FF,
142
198
  charts-categorical-10-color: #D99078,
143
- charts-categorical-10-stroke: transparent,
144
- charts-categorical-10-pattern: solid,
199
+ charts-categorical-10-stroke-color: rgba(0, 0, 0, 0),
145
200
  charts-categorical-01-color: #3892F3,
146
- charts-categorical-01-stroke: transparent,
147
- charts-categorical-01-pattern: solid,
201
+ charts-categorical-01-stroke-color: rgba(0, 0, 0, 0),
148
202
  charts-categorical-02-color: #3476FF,
149
- charts-categorical-02-stroke: transparent,
150
- charts-categorical-02-pattern: solid,
203
+ charts-categorical-02-stroke-color: rgba(0, 0, 0, 0),
151
204
  charts-categorical-03-color: #C6F6FF,
152
- charts-categorical-03-stroke: transparent,
153
- charts-categorical-03-pattern: solid,
205
+ charts-categorical-03-stroke-color: rgba(0, 0, 0, 0),
154
206
  charts-categorical-04-color: #C6B8F4,
155
- charts-categorical-04-stroke: transparent,
156
- charts-categorical-04-pattern: solid,
207
+ charts-categorical-04-stroke-color: rgba(0, 0, 0, 0),
157
208
  charts-categorical-05-color: #D949A9,
158
- charts-categorical-05-stroke: transparent,
159
- charts-categorical-05-pattern: solid,
209
+ charts-categorical-05-stroke-color: rgba(0, 0, 0, 0),
160
210
  charts-categorical-06-color: #ED1369,
161
- charts-categorical-06-stroke: transparent,
162
- charts-categorical-06-pattern: solid,
211
+ charts-categorical-06-stroke-color: rgba(0, 0, 0, 0),
163
212
  charts-categorical-07-color: #8CC30B,
164
- charts-categorical-07-stroke: transparent,
165
- charts-categorical-07-pattern: solid,
213
+ charts-categorical-07-stroke-color: rgba(0, 0, 0, 0),
166
214
  charts-categorical-08-color: #B36800,
167
- charts-categorical-08-stroke: transparent,
168
- charts-categorical-08-pattern: solid,
215
+ charts-categorical-08-stroke-color: rgba(0, 0, 0, 0),
169
216
  charts-categorical-09-color: #FFA037,
170
- charts-categorical-09-stroke: transparent,
171
- charts-categorical-09-pattern: solid,
217
+ charts-categorical-09-stroke-color: rgba(0, 0, 0, 0),
172
218
  charts-status-success-color: #49CC93,
173
- charts-status-success-stroke: transparent,
174
- charts-status-success-pattern: solid,
219
+ charts-status-success-stroke-color: rgba(0, 0, 0, 0),
175
220
  charts-status-warning-color: #ffe278,
176
- charts-status-warning-stroke: transparent,
177
- charts-status-warning-pattern: solid,
221
+ charts-status-warning-stroke-color: rgba(0, 0, 0, 0),
178
222
  charts-status-danger-color: #ff745f,
179
- charts-status-danger-stroke: transparent,
180
- charts-status-danger-pattern: solid,
223
+ charts-status-danger-stroke-color: rgba(0, 0, 0, 0),
181
224
  charts-status-neutral-color: #141414,
182
- charts-status-neutral-stroke: #B4C1C8,
183
- charts-status-neutral-pattern: striped,
184
- focus-ring-color: #78BBFA,
185
- focus-ring-color-danger: #ff745f,
186
- foreground-color: #ffffff,
187
- foreground-color-subdued: #bcbcbd,
188
- foreground-color-primary: #78BBFA,
189
- foreground-color-danger: #ff745f,
190
- foreground-color-inverted: #141414,
191
- foreground-color-on-primary: #141414,
192
- foreground-color-on-danger: #141414,
193
- foreground-color-on-danger-subdued: #ffffff,
194
- foreground-color-on-warning: #141414,
195
- foreground-color-active-primary: #B5DEFF,
196
- foreground-color-active-danger: #ff745f,
197
- foreground-color-hover-primary: #B5DEFF,
198
- foreground-color-hover-danger: #ff745f,
199
- overlay-color-active: #ffffff29,
200
- overlay-color-active-primary: #78BBFA40,
201
- overlay-color-active-danger: #f94d3240,
202
- overlay-color-active-on: #14141429,
203
- overlay-color-active-on-primary: #14141429,
204
- overlay-color-active-on-danger: #14141429,
205
- overlay-color-hover: #ffffff14,
206
- overlay-color-hover-primary: #78BBFA1A,
207
- overlay-color-hover-danger: #f94d3226,
208
- overlay-color-hover-on: #ffffff14,
209
- overlay-color-hover-on-primary: #ffffff29,
210
- overlay-color-hover-on-danger: #ffffff29,
225
+ charts-status-neutral-stroke-color: #B4C1C8,
226
+ focus-ring-color-default: var(--a2-color-blue-300, #70b1ff),
227
+ focus-ring-color-danger: var(--a2-color-red-300, #ff8974),
228
+ foreground-color-default: var(--a2-color-neutral-0, #ffffff),
229
+ foreground-color-subdued: var(--a2-color-neutral-70, #e8e8e8),
230
+ foreground-color-primary: var(--a2-color-blue-300, #70b1ff),
231
+ foreground-color-primary-hover: var(--a2-color-blue-200, #9ecaff),
232
+ foreground-color-primary-active: var(--a2-color-blue-200, #9ecaff),
233
+ foreground-color-danger: var(--a2-status-color-danger, var(--a2-color-red-500, #ff3914)),
234
+ foreground-color-danger-hover: var(--a2-status-color-danger, var(--a2-color-red-500, #ff3914)),
235
+ foreground-color-danger-active: var(--a2-status-color-danger, var(--a2-color-red-500, #ff3914)),
236
+ foreground-color-inverted: var(--a2-color-neutral-950, #040404),
237
+ foreground-color-on-primary: var(--a2-color-neutral-950, #040404),
238
+ foreground-color-on-primary-hover: var(--a2-color-neutral-950, #040404),
239
+ foreground-color-on-primary-active: var(--a2-color-neutral-950, #040404),
240
+ foreground-color-on-danger: var(--a2-color-neutral-950, #040404),
241
+ foreground-color-on-danger-subdued: var(--a2-color-neutral-0, #ffffff),
242
+ foreground-color-on-danger-hover: var(--a2-color-neutral-950, #040404),
243
+ foreground-color-on-danger-active: var(--a2-color-neutral-950, #040404),
244
+ foreground-color-on-warning: var(--a2-color-neutral-950, #040404),
211
245
  shadow-color: #ffffff14,
212
- status-color-info: #78BBFA,
213
- status-color-danger: #ff745f,
214
- status-color-success: #49CC93,
215
- status-color-warning: #ffe278,
216
246
  );
217
247
  $nonColor: (
218
- border-radius-none: 0,
219
- border-radius-small: 0.1875rem,
220
- border-radius-medium: 0.375rem,
221
- border-radius-large: 0.75rem,
222
- border-radius-xlarge: 1.5rem,
248
+ border-radius-none: 0rem,
249
+ border-radius-small: var(--a2-radius-1, 0.1875rem),
250
+ border-radius-medium: var(--a2-radius-2, 0.375rem),
251
+ border-radius-large: var(--a2-radius-4, 0.75rem),
252
+ border-radius-xlarge: var(--a2-radius-8, 1.5rem),
223
253
  border-radius-circular: 100%,
224
254
  border-width-none: 0rem,
225
- border-width: 0.0625rem,
226
- border-width-strong: 0.125rem,
227
- focus-ring-width: 0.25rem,
228
- shadow-size-flat: 0rem 0rem 0rem,
229
- shadow-size-float: 0rem 0.125rem 0.5rem,
230
- shadow-size-overlay: 0rem 0.5rem 1.5rem,
231
- typography-paragraph-size-xsmall: 0.75rem,
232
- typography-paragraph-size-small: 0.875rem,
233
- typography-paragraph-size: 1rem,
234
- typography-paragraph-size-large: 1.25rem,
235
- typography-paragraph-size-xlarge: 1.5rem,
236
- typography-paragraph-font-weight: 400,
237
- typography-paragraph-font-family: "'Nunito Sans', sans-serif",
238
- typography-heading-size-xsmall: 0.875rem,
239
- typography-heading-size-small: 1rem,
240
- typography-heading-size: 1.25rem,
241
- typography-heading-size-large: 1.5rem,
242
- typography-heading-size-xlarge: 2rem,
243
- typography-heading-font-weight: 700,
244
- typography-heading-font-family: "'Sofia Pro', SofiaPro, sans-serif",
245
- typography-label-size-xsmall: 0.625rem,
246
- typography-label-size-small: 0.75rem,
247
- typography-label-size: 0.875rem,
248
- typography-label-size-large: 1rem,
249
- typography-label-size-xlarge: 1.25rem,
250
- typography-label-font-weight: 600,
251
- typography-label-font-family: "'Nunito Sans', sans-serif",
255
+ border-width-default: var(--a2-size-quarter, 0.0625rem),
256
+ border-width-strong: var(--a2-size-half, 0.125rem),
257
+ charts-monochrome-01-stroke-style: solid,
258
+ charts-monochrome-01-pattern: solid,
259
+ charts-monochrome-02-stroke-style: solid,
260
+ charts-monochrome-02-pattern: solid,
261
+ charts-monochrome-03-stroke-style: solid,
262
+ charts-monochrome-03-pattern: striped,
263
+ charts-monochrome-04-stroke-style: solid,
264
+ charts-monochrome-04-pattern: solid,
265
+ charts-categorical-10-stroke-style: solid,
266
+ charts-categorical-10-pattern: solid,
267
+ charts-categorical-01-stroke-style: solid,
268
+ charts-categorical-01-pattern: solid,
269
+ charts-categorical-02-stroke-style: solid,
270
+ charts-categorical-02-pattern: solid,
271
+ charts-categorical-03-stroke-style: solid,
272
+ charts-categorical-03-pattern: solid,
273
+ charts-categorical-04-stroke-style: solid,
274
+ charts-categorical-04-pattern: solid,
275
+ charts-categorical-05-stroke-style: solid,
276
+ charts-categorical-05-pattern: solid,
277
+ charts-categorical-06-stroke-style: solid,
278
+ charts-categorical-06-pattern: solid,
279
+ charts-categorical-07-stroke-style: solid,
280
+ charts-categorical-07-pattern: solid,
281
+ charts-categorical-08-stroke-style: solid,
282
+ charts-categorical-08-pattern: solid,
283
+ charts-categorical-09-stroke-style: solid,
284
+ charts-categorical-09-pattern: solid,
285
+ charts-status-success-stroke-style: solid,
286
+ charts-status-success-pattern: solid,
287
+ charts-status-warning-stroke-style: solid,
288
+ charts-status-warning-pattern: solid,
289
+ charts-status-danger-stroke-style: solid,
290
+ charts-status-danger-pattern: solid,
291
+ charts-status-neutral-stroke-style: solid,
292
+ charts-status-neutral-pattern: striped,
293
+ focus-ring-width: var(--a2-size-1, 0.25rem),
294
+ focus-ring-style: solid,
295
+ shadow-size-flat: var(--a2-size-0, 0rem) var(--a2-size-0, 0rem) var(--a2-size-0, 0rem),
296
+ shadow-size-float: var(--a2-size-0, 0rem) var(--a2-size-half, 0.125rem) var(--a2-size-2, 0.5rem),
297
+ shadow-size-overlay: var(--a2-size-0, 0rem) var(--a2-size-2, 0.5rem) var(--a2-size-6, 1.5rem),
298
+ typography-paragraph-size-xsmall: var(--a2-font-size-200, 0.75rem),
299
+ typography-paragraph-size-small: var(--a2-font-size-300, 0.875rem),
300
+ typography-paragraph-size-default: var(--a2-font-size-400, 1rem),
301
+ typography-paragraph-size-large: var(--a2-font-size-500, 1.25rem),
302
+ typography-paragraph-size-xlarge: var(--a2-font-size-600, 1.5rem),
303
+ typography-paragraph-font-weight: var(--a2-font-weight-normal, 400),
304
+ typography-paragraph-font-family: var(--a2-font-family-base, "'Nunito Sans', sans-serif"),
305
+ typography-heading-size-xsmall: var(--a2-font-size-300, 0.875rem),
306
+ typography-heading-size-small: var(--a2-font-size-400, 1rem),
307
+ typography-heading-size-default: var(--a2-font-size-500, 1.25rem),
308
+ typography-heading-size-large: var(--a2-font-size-600, 1.5rem),
309
+ typography-heading-size-xlarge: var(--a2-font-size-800, 2rem),
310
+ typography-heading-font-weight: var(--a2-font-weight-bold, 700),
311
+ typography-heading-font-family: var(--a2-font-family-display, "'Sofia Pro', SofiaPro, sans-serif"),
312
+ typography-label-size-xsmall: var(--a2-font-size-100, 0.625rem),
313
+ typography-label-size-small: var(--a2-font-size-200, 0.75rem),
314
+ typography-label-size-default: var(--a2-font-size-300, 0.875rem),
315
+ typography-label-size-large: var(--a2-font-size-400, 1rem),
316
+ typography-label-size-xlarge: var(--a2-font-size-500, 1.25rem),
317
+ typography-label-font-weight: var(--a2-font-weight-semibold, 600),
318
+ typography-label-font-family: var(--a2-font-family-base, "'Nunito Sans', sans-serif"),
252
319
  );