@optiaxiom/globals 3.0.0 → 3.0.2

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 (24) hide show
  1. package/dist/cjs/fonts.js +3 -6
  2. package/dist/cjs/index.js +593 -402
  3. package/dist/esm/context.js +3 -3
  4. package/dist/esm/fonts.js +3 -3
  5. package/dist/esm/index.js +8 -7
  6. package/dist/esm/modal-context.js +3 -3
  7. package/dist/esm/surface-context.js +36 -48
  8. package/dist/esm/theme-css.js +175 -2
  9. package/dist/esm/toast-context.js +3 -3
  10. package/dist/esm/toaster.js +56 -61
  11. package/dist/esm/tokens/borderRadius.js +9 -9
  12. package/dist/esm/tokens/boxShadow.js +6 -5
  13. package/dist/esm/tokens/colors.js +222 -178
  14. package/dist/esm/tokens/duration.js +5 -4
  15. package/dist/esm/tokens/fontFamily.js +5 -4
  16. package/dist/esm/tokens/fontSize.js +35 -35
  17. package/dist/esm/tokens/index.js +22 -22
  18. package/dist/esm/tokens/maxSize.js +7 -7
  19. package/dist/esm/tokens/rem.js +2 -1
  20. package/dist/esm/tokens/screens.js +5 -5
  21. package/dist/esm/tokens/size.js +10 -10
  22. package/dist/esm/tokens/zIndex.js +5 -4
  23. package/dist/index.d.ts +464 -467
  24. package/package.json +3 -3
package/dist/esm/tokens/colors.js CHANGED
@@ -1,184 +1,228 @@
1
+ //#region src/tokens/colors.ts
1
2
  const palette = {
2
- "blue.100": "#E2F5F5",
3
- "blue.200": "#91DBDA",
4
- "blue.300": "#60B4BE",
5
- "blue.400": "#409AAB",
6
- "blue.500": "#197A94",
7
- "blue.600": "#036988",
8
- "blue.800": "#01303E",
9
- "blue.dark.200": "#93C5FD",
10
- "blue.dark.900": "#1E3140",
11
- "brand.50": "#EEFFD9",
12
- "brand.200": "#DFFFB8",
13
- "brand.300": "#CEFF93",
14
- "brand.400": "#BFFF70",
15
- "brand.500": "#ABFF44",
16
- "brand.550": "#99F141",
17
- "brand.600": "#7DDD3D",
18
- "brand.700": "#3AB533",
19
- "brand.800": "#226B1E",
20
- "brand.900": "#123810",
21
- "brand.1000": "#08251A",
22
- "brand.dark.400": "#D3FF9D",
23
- "brand.dark.500": "#C5FF7E",
24
- "brand.dark.800": "#38735D",
25
- "brand.dark.900": "#203526",
26
- "green.200": "#BCD5CC",
27
- "green.400": "#80B09F",
28
- "green.500": "#5F9B85",
29
- "green.700": "#197050",
30
- "green.800": "#114C36",
31
- "green.dark.200": "#86EFAC",
32
- "neutral.00": "#FFFFFF",
33
- "neutral.25": "#F9FCF8",
34
- "neutral.50": "#F6FAF3",
35
- "neutral.75": "#EFF5EB",
36
- "neutral.100": "#E4F0DA",
37
- "neutral.150": "#D8E4CB",
38
- "neutral.200": "#D2DEC2",
39
- "neutral.300": "#B2BD9E",
40
- "neutral.400": "#A1AC8D",
41
- "neutral.600": "#717863",
42
- "neutral.700": "#616755",
43
- "neutral.800": "#484E46",
44
- "neutral.900": "#383E38",
45
- "neutral.1000": "#2B2E2B",
46
- "neutral.1050": "#252825",
47
- "neutral.1100": "#202320",
48
- "neutral.50/6": "#DDE9D20D",
49
- "neutral.50/12": "#DDE9D21F",
50
- "neutral.50/18": "#DDE9D224",
51
- "neutral.1200/4": "#5F931F14",
52
- "neutral.1200/16": "#5E8B2729",
53
- "neutral.1200/32": "#393E3252",
54
- "purple.100": "#EDE9FE",
55
- "purple.500": "#7C3AED",
56
- "purple.600": "#6D28D9",
57
- "purple.700": "#5B21B6",
58
- "red.50": "#FFF1F5",
59
- "red.100": "#FFDFE8",
60
- "red.200": "#FFC1D3",
61
- "red.300": "#FF99B6",
62
- "red.400": "#E284A0",
63
- "red.500": "#A95A77",
64
- "red.600": "#8F4764",
65
- "red.700": "#5D2E41",
66
- "red.dark.200": "#FCA5A5",
67
- "red.dark.400": "#A85C5C",
68
- "red.dark.450": "#904A4A",
69
- "red.dark.500": "#803F3F",
70
- "red.dark.700": "#593030",
71
- "red.dark.800": "#3E2D2D",
72
- "red.dark.900": "#372C2C",
73
- "yellow.100": "#FEF1C6",
74
- "yellow.200": "#FEDF88",
75
- "yellow.300": "#FFC84B",
76
- "yellow.400": "#FDB022",
77
- "yellow.500": "#F79008",
78
- "yellow.600": "#DC6903",
79
- "yellow.700": "#B54707",
80
- "yellow.800": "#7A2E0D",
81
- "yellow.dark.200": "#FCD34D",
82
- "yellow.dark.900": "#3A2D1A"
3
+ "blue.50": "#EFFAFA",
4
+ "blue.100": "#E2F5F5",
5
+ "blue.200": "#91DBDA",
6
+ "blue.300": "#60B4BE",
7
+ "blue.400": "#409AAB",
8
+ "blue.500": "#197A94",
9
+ "blue.600": "#036988",
10
+ "blue.700": "#01485E",
11
+ "blue.800": "#01303E",
12
+ "blue.900": "#00222D",
13
+ "blue.dark.200": "#93C5FD",
14
+ "blue.dark.900": "#1E3140",
15
+ "brand.50": "#EEFFD9",
16
+ "brand.100": "#E6FFC7",
17
+ "brand.200": "#DFFFB8",
18
+ "brand.300": "#CEFF93",
19
+ "brand.400": "#BFFF70",
20
+ "brand.500": "#ABFF44",
21
+ "brand.550": "#99F141",
22
+ "brand.600": "#7DDD3D",
23
+ "brand.700": "#3AB533",
24
+ "brand.800": "#226B1E",
25
+ "brand.900": "#123810",
26
+ "brand.1000": "#08251A",
27
+ "brand.dark.50": "#EEFFD9",
28
+ "brand.dark.100": "#CDD8FC",
29
+ "brand.dark.200": "#B3C3FF",
30
+ "brand.dark.300": "#DDFFB4",
31
+ "brand.dark.400": "#D3FF9D",
32
+ "brand.dark.500": "#C5FF7E",
33
+ "brand.dark.550": "#B3F175",
34
+ "brand.dark.600": "#A3E578",
35
+ "brand.dark.700": "#80B77C",
36
+ "brand.dark.800": "#38735D",
37
+ "brand.dark.900": "#203526",
38
+ "cyan.50": "#ECFEFF",
39
+ "cyan.100": "#CFFAFE",
40
+ "cyan.200": "#99F0F9",
41
+ "cyan.300": "#67E8F9",
42
+ "cyan.400": "#22D3EE",
43
+ "cyan.500": "#06B6D4",
44
+ "cyan.600": "#0891B2",
45
+ "cyan.700": "#0E7490",
46
+ "cyan.800": "#155E75",
47
+ "cyan.900": "#083344",
48
+ "green.50": "#EFF5F3",
49
+ "green.100": "#DEF2EB",
50
+ "green.200": "#BCD5CC",
51
+ "green.300": "#A4C7BA",
52
+ "green.400": "#80B09F",
53
+ "green.500": "#5F9B85",
54
+ "green.600": "#388367",
55
+ "green.700": "#197050",
56
+ "green.800": "#114C36",
57
+ "green.900": "#082319",
58
+ "green.dark.200": "#86EFAC",
59
+ "green.dark.900": "#1E3329",
60
+ "magenta.50": "#FDF4FF",
61
+ "magenta.100": "#FAE8FF",
62
+ "magenta.200": "#F5D0FE",
63
+ "magenta.300": "#F0ABFC",
64
+ "magenta.400": "#D765E9",
65
+ "magenta.500": "#C026D3",
66
+ "magenta.600": "#A21CAF",
67
+ "magenta.700": "#86198F",
68
+ "magenta.800": "#701A75",
69
+ "magenta.900": "#4A044E",
70
+ "neutral.00": "#FFFFFF",
71
+ "neutral.25": "#F9FCF8",
72
+ "neutral.50": "#F6FAF3",
73
+ "neutral.75": "#EFF5EB",
74
+ "neutral.100": "#E4F0DA",
75
+ "neutral.150": "#D8E4CB",
76
+ "neutral.200": "#D2DEC2",
77
+ "neutral.300": "#B2BD9E",
78
+ "neutral.400": "#A1AC8D",
79
+ "neutral.600": "#717863",
80
+ "neutral.700": "#616755",
81
+ "neutral.800": "#484E46",
82
+ "neutral.900": "#383E38",
83
+ "neutral.1000": "#2B2E2B",
84
+ "neutral.1050": "#252825",
85
+ "neutral.1100": "#202320",
86
+ "neutral.50/6": "#DDE9D20D",
87
+ "neutral.50/12": "#DDE9D21F",
88
+ "neutral.50/18": "#DDE9D224",
89
+ "neutral.50/22": "#DDE9D238",
90
+ "neutral.50/32": "#DDE9D252",
91
+ "neutral.1200/4": "#5F931F14",
92
+ "neutral.1200/8": "#5D813121",
93
+ "neutral.1200/16": "#5E8B2729",
94
+ "neutral.1200/22": "#4E5A3F38",
95
+ "neutral.1200/32": "#393E3252",
96
+ "purple.50": "#F5F3FF",
97
+ "purple.100": "#EDE9FE",
98
+ "purple.200": "#DDD6FE",
99
+ "purple.300": "#C3B6FD",
100
+ "purple.400": "#A88BFA",
101
+ "purple.500": "#7C3AED",
102
+ "purple.600": "#6D28D9",
103
+ "purple.700": "#5B21B6",
104
+ "purple.800": "#4C1D95",
105
+ "purple.900": "#2E1065",
106
+ "red.50": "#FFF1F5",
107
+ "red.100": "#FFDFE8",
108
+ "red.200": "#FFC1D3",
109
+ "red.300": "#FF99B6",
110
+ "red.400": "#E284A0",
111
+ "red.500": "#A95A77",
112
+ "red.600": "#8F4764",
113
+ "red.700": "#5D2E41",
114
+ "red.800": "#391C27",
115
+ "red.900": "#170B10",
116
+ "red.dark.200": "#FCA5A5",
117
+ "red.dark.300": "#FF8383",
118
+ "red.dark.400": "#A85C5C",
119
+ "red.dark.450": "#904A4A",
120
+ "red.dark.500": "#803F3F",
121
+ "red.dark.700": "#593030",
122
+ "red.dark.800": "#3E2D2D",
123
+ "red.dark.900": "#372C2C",
124
+ "yellow.50": "#FFFAEA",
125
+ "yellow.100": "#FEF1C6",
126
+ "yellow.200": "#FEDF88",
127
+ "yellow.300": "#FFC84B",
128
+ "yellow.400": "#FDB022",
129
+ "yellow.500": "#F79008",
130
+ "yellow.600": "#DC6903",
131
+ "yellow.700": "#B54707",
132
+ "yellow.800": "#7A2E0D",
133
+ "yellow.900": "#4E1D09",
134
+ "yellow.dark.200": "#FCD34D",
135
+ "yellow.dark.900": "#3A2D1A"
83
136
  };
84
137
  const ld = (a, b) => `light-dark(${a}, ${b})`;
85
138
  const colors = {
86
- "bg.accent": ld(palette["brand.500"], palette["brand.500"]),
87
- "bg.accent.hovered": ld(palette["brand.550"], palette["brand.dark.500"]),
88
- "bg.accent.light": ld(palette["brand.200"], palette["brand.dark.800"]),
89
- "bg.accent.pressed": ld(palette["brand.600"], palette["brand.dark.400"]),
90
- "bg.accent.subtle": ld(palette["brand.50"], palette["brand.dark.900"]),
91
- "bg.avatar.neutral": ld(palette["neutral.75"], palette["neutral.1100"]),
92
- "bg.avatar.purple": ld(palette["purple.100"], palette["purple.500"]),
93
- "bg.default": ld(palette["neutral.00"], palette["neutral.1000"]),
94
- "bg.default.hovered": ld(palette["neutral.1200/4"], palette["neutral.50/6"]),
95
- "bg.default.inverse": ld(palette["neutral.1050"], palette["neutral.25"]),
96
- "bg.default.inverse.hovered": ld(
97
- palette["neutral.900"],
98
- palette["neutral.200"]
99
- ),
100
- "bg.default.inverse.pressed": ld(
101
- palette["neutral.1000"],
102
- palette["neutral.200"]
103
- ),
104
- "bg.default.pressed": ld(
105
- palette["neutral.1200/16"],
106
- palette["neutral.50/18"]
107
- ),
108
- "bg.error": ld(palette["red.500"], palette["red.dark.500"]),
109
- "bg.error.hovered": ld(palette["red.600"], palette["red.dark.450"]),
110
- "bg.error.light": ld(palette["red.200"], palette["red.dark.700"]),
111
- "bg.error.pressed": ld(palette["red.700"], palette["red.dark.400"]),
112
- "bg.error.subtle": ld(palette["red.100"], palette["red.dark.800"]),
113
- "bg.error.subtlest": ld(palette["red.50"], palette["red.dark.900"]),
114
- "bg.information": ld(palette["blue.600"], palette["blue.600"]),
115
- "bg.information.light": ld(palette["blue.200"], palette["blue.800"]),
116
- "bg.information.subtle": ld(palette["blue.100"], palette["blue.dark.900"]),
117
- "bg.overlay": ld(palette["neutral.1200/32"], palette["neutral.1200/32"]),
118
- "bg.page": ld(palette["neutral.25"], palette["neutral.1050"]),
119
- "bg.pill.default": ld(palette["neutral.150"], palette["neutral.800"]),
120
- "bg.pill.hovered": ld(palette["neutral.200"], palette["neutral.700"]),
121
- "bg.secondary": ld(palette["neutral.75"], palette["neutral.1100"]),
122
- "bg.secondary.hovered": ld(palette["neutral.75"], palette["neutral.50/18"]),
123
- "bg.spinner.default": ld(palette["neutral.1100"], palette["neutral.50"]),
124
- "bg.spinner.inverse": ld(palette["neutral.50"], palette["neutral.50"]),
125
- "bg.success": ld(palette["brand.500"], palette["brand.500"]),
126
- "bg.success.hovered": ld(palette["green.700"], palette["green.400"]),
127
- "bg.success.light": ld(palette["green.200"], palette["green.800"]),
128
- "bg.success.subtle": ld(palette["brand.50"], palette["brand.900"]),
129
- "bg.tertiary": ld(palette["neutral.75"], palette["neutral.1100"]),
130
- "bg.tertiary.hovered": ld(palette["neutral.200"], palette["neutral.50/18"]),
131
- "bg.warning": ld(palette["yellow.300"], palette["yellow.500"]),
132
- "bg.warning.hovered": ld(palette["yellow.600"], palette["yellow.400"]),
133
- "bg.warning.light": ld(palette["yellow.200"], palette["yellow.800"]),
134
- "bg.warning.subtle": ld(palette["yellow.100"], palette["yellow.dark.900"]),
135
- "border.accent": ld(palette["brand.500"], palette["brand.300"]),
136
- "border.control": ld(palette["neutral.400"], palette["neutral.600"]),
137
- "border.control.hovered": ld(palette["neutral.600"], palette["neutral.400"]),
138
- "border.default": ld(palette["neutral.150"], palette["neutral.800"]),
139
- "border.disabled": ld(palette["neutral.150"], palette["neutral.50/12"]),
140
- "border.error": ld(palette["red.500"], palette["red.dark.200"]),
141
- "border.focus": ld(palette["blue.500"], palette["blue.400"]),
142
- "border.focus.error": ld(palette["red.400"], palette["red.300"]),
143
- "border.secondary": ld(palette["neutral.100"], palette["neutral.900"]),
144
- "border.success": ld(palette["green.500"], palette["green.500"]),
145
- "border.tertiary": ld(palette["neutral.100"], palette["neutral.900"]),
146
- "border.warning": ld(palette["yellow.500"], palette["yellow.500"]),
147
- "fg.accent": ld(palette["brand.500"], palette["brand.500"]),
148
- "fg.accent.hovered": ld(palette["brand.700"], palette["brand.400"]),
149
- "fg.accent.strong": ld(palette["brand.800"], palette["brand.300"]),
150
- "fg.avatar.neutral": ld(palette["neutral.800"], palette["neutral.300"]),
151
- "fg.avatar.purple": ld(palette["purple.700"], palette["neutral.00"]),
152
- "fg.black": ld(palette["neutral.1100"], palette["neutral.1100"]),
153
- "fg.default": ld(palette["neutral.1100"], palette["neutral.200"]),
154
- "fg.default.inverse": ld(palette["neutral.00"], palette["neutral.1100"]),
155
- "fg.disabled": ld(palette["neutral.400"], palette["neutral.600"]),
156
- "fg.error": ld(palette["red.600"], palette["red.dark.200"]),
157
- "fg.error.hovered": ld(palette["red.700"], palette["red.400"]),
158
- "fg.error.light": ld(palette["red.300"], palette["red.500"]),
159
- "fg.error.strong": ld(palette["red.700"], palette["red.dark.200"]),
160
- "fg.information": ld(palette["blue.500"], palette["blue.dark.200"]),
161
- "fg.information.light": ld(palette["blue.300"], palette["blue.300"]),
162
- "fg.information.strong": ld(palette["blue.600"], palette["blue.dark.200"]),
163
- "fg.link.default": ld(palette["brand.800"], palette["brand.700"]),
164
- "fg.link.default.hovered": ld(palette["brand.900"], palette["brand.600"]),
165
- "fg.link.inverse": ld(palette["neutral.00"], palette["neutral.1100"]),
166
- "fg.link.subtle": ld(palette["neutral.1100"], palette["neutral.200"]),
167
- "fg.link.visited": ld(palette["purple.600"], palette["purple.500"]),
168
- "fg.secondary": ld(palette["neutral.800"], palette["neutral.300"]),
169
- "fg.spinner.default": ld(palette["brand.1000"], palette["neutral.150"]),
170
- "fg.spinner.inverse": ld(palette["neutral.00"], palette["brand.1000"]),
171
- "fg.success": ld(palette["brand.700"], palette["green.dark.200"]),
172
- "fg.success.hovered": ld(palette["brand.800"], palette["brand.500"]),
173
- "fg.success.light": ld(palette["brand.300"], palette["brand.700"]),
174
- "fg.success.strong": ld(palette["brand.800"], palette["brand.500"]),
175
- "fg.tertiary": ld(palette["neutral.700"], palette["neutral.400"]),
176
- "fg.warning": ld(palette["yellow.500"], palette["yellow.dark.200"]),
177
- "fg.warning.hovered": ld(palette["yellow.600"], palette["yellow.600"]),
178
- "fg.warning.inverse": ld(palette["neutral.800"], palette["neutral.800"]),
179
- "fg.warning.light": ld(palette["yellow.300"], palette["yellow.600"]),
180
- "fg.warning.strong": ld(palette["yellow.700"], palette["yellow.dark.200"]),
181
- "fg.white": ld(palette["neutral.00"], palette["neutral.200"])
139
+ "bg.accent": ld(palette["brand.500"], palette["brand.500"]),
140
+ "bg.accent.hovered": ld(palette["brand.550"], palette["brand.dark.500"]),
141
+ "bg.accent.light": ld(palette["brand.200"], palette["brand.dark.800"]),
142
+ "bg.accent.pressed": ld(palette["brand.600"], palette["brand.dark.400"]),
143
+ "bg.accent.subtle": ld(palette["brand.50"], palette["brand.dark.900"]),
144
+ "bg.avatar.neutral": ld(palette["neutral.75"], palette["neutral.1100"]),
145
+ "bg.avatar.purple": ld(palette["purple.100"], palette["purple.500"]),
146
+ "bg.default": ld(palette["neutral.00"], palette["neutral.1000"]),
147
+ "bg.default.hovered": ld(palette["neutral.1200/4"], palette["neutral.50/6"]),
148
+ "bg.default.inverse": ld(palette["neutral.1050"], palette["neutral.25"]),
149
+ "bg.default.inverse.hovered": ld(palette["neutral.900"], palette["neutral.200"]),
150
+ "bg.default.inverse.pressed": ld(palette["neutral.1000"], palette["neutral.200"]),
151
+ "bg.default.pressed": ld(palette["neutral.1200/16"], palette["neutral.50/18"]),
152
+ "bg.error": ld(palette["red.500"], palette["red.dark.500"]),
153
+ "bg.error.hovered": ld(palette["red.600"], palette["red.dark.450"]),
154
+ "bg.error.light": ld(palette["red.200"], palette["red.dark.700"]),
155
+ "bg.error.pressed": ld(palette["red.700"], palette["red.dark.400"]),
156
+ "bg.error.subtle": ld(palette["red.100"], palette["red.dark.800"]),
157
+ "bg.error.subtlest": ld(palette["red.50"], palette["red.dark.900"]),
158
+ "bg.information": ld(palette["blue.600"], palette["blue.600"]),
159
+ "bg.information.light": ld(palette["blue.200"], palette["blue.800"]),
160
+ "bg.information.subtle": ld(palette["blue.100"], palette["blue.dark.900"]),
161
+ "bg.overlay": ld(palette["neutral.1200/32"], palette["neutral.1200/32"]),
162
+ "bg.page": ld(palette["neutral.25"], palette["neutral.1050"]),
163
+ "bg.pill.default": ld(palette["neutral.150"], palette["neutral.800"]),
164
+ "bg.pill.hovered": ld(palette["neutral.200"], palette["neutral.700"]),
165
+ "bg.secondary": ld(palette["neutral.75"], palette["neutral.1100"]),
166
+ "bg.secondary.hovered": ld(palette["neutral.75"], palette["neutral.50/18"]),
167
+ "bg.spinner.default": ld(palette["neutral.1100"], palette["neutral.50"]),
168
+ "bg.spinner.inverse": ld(palette["neutral.50"], palette["neutral.50"]),
169
+ "bg.success": ld(palette["brand.500"], palette["brand.500"]),
170
+ "bg.success.hovered": ld(palette["green.700"], palette["green.400"]),
171
+ "bg.success.light": ld(palette["green.200"], palette["green.800"]),
172
+ "bg.success.subtle": ld(palette["brand.50"], palette["brand.900"]),
173
+ "bg.tertiary": ld(palette["neutral.75"], palette["neutral.1100"]),
174
+ "bg.tertiary.hovered": ld(palette["neutral.200"], palette["neutral.50/18"]),
175
+ "bg.warning": ld(palette["yellow.300"], palette["yellow.500"]),
176
+ "bg.warning.hovered": ld(palette["yellow.600"], palette["yellow.400"]),
177
+ "bg.warning.light": ld(palette["yellow.200"], palette["yellow.800"]),
178
+ "bg.warning.subtle": ld(palette["yellow.100"], palette["yellow.dark.900"]),
179
+ "border.accent": ld(palette["brand.500"], palette["brand.300"]),
180
+ "border.control": ld(palette["neutral.400"], palette["neutral.600"]),
181
+ "border.control.hovered": ld(palette["neutral.600"], palette["neutral.400"]),
182
+ "border.default": ld(palette["neutral.150"], palette["neutral.800"]),
183
+ "border.disabled": ld(palette["neutral.1200/22"], palette["neutral.50/22"]),
184
+ "border.error": ld(palette["red.500"], palette["red.dark.200"]),
185
+ "border.focus": ld(palette["blue.500"], palette["blue.400"]),
186
+ "border.focus.error": ld(palette["red.400"], palette["red.300"]),
187
+ "border.secondary": ld(palette["neutral.100"], palette["neutral.900"]),
188
+ "border.success": ld(palette["green.500"], palette["green.500"]),
189
+ "border.tertiary": ld(palette["neutral.100"], palette["neutral.900"]),
190
+ "border.warning": ld(palette["yellow.500"], palette["yellow.500"]),
191
+ "fg.accent": ld(palette["brand.500"], palette["brand.500"]),
192
+ "fg.accent.hovered": ld(palette["brand.700"], palette["brand.400"]),
193
+ "fg.accent.strong": ld(palette["brand.800"], palette["brand.300"]),
194
+ "fg.avatar.neutral": ld(palette["neutral.800"], palette["neutral.300"]),
195
+ "fg.avatar.purple": ld(palette["purple.700"], palette["neutral.00"]),
196
+ "fg.black": ld(palette["neutral.1100"], palette["neutral.1100"]),
197
+ "fg.default": ld(palette["neutral.1100"], palette["neutral.200"]),
198
+ "fg.default.inverse": ld(palette["neutral.00"], palette["neutral.1100"]),
199
+ "fg.disabled": ld(palette["neutral.400"], palette["neutral.600"]),
200
+ "fg.error": ld(palette["red.600"], palette["red.dark.200"]),
201
+ "fg.error.hovered": ld(palette["red.700"], palette["red.400"]),
202
+ "fg.error.light": ld(palette["red.300"], palette["red.500"]),
203
+ "fg.error.strong": ld(palette["red.700"], palette["red.dark.200"]),
204
+ "fg.information": ld(palette["blue.500"], palette["blue.dark.200"]),
205
+ "fg.information.light": ld(palette["blue.300"], palette["blue.300"]),
206
+ "fg.information.strong": ld(palette["blue.600"], palette["blue.dark.200"]),
207
+ "fg.link.default": ld(palette["brand.800"], palette["brand.700"]),
208
+ "fg.link.default.hovered": ld(palette["brand.900"], palette["brand.600"]),
209
+ "fg.link.inverse": ld(palette["neutral.00"], palette["neutral.1100"]),
210
+ "fg.link.subtle": ld(palette["neutral.1100"], palette["neutral.200"]),
211
+ "fg.link.visited": ld(palette["purple.600"], palette["purple.500"]),
212
+ "fg.secondary": ld(palette["neutral.800"], palette["neutral.300"]),
213
+ "fg.spinner.default": ld(palette["brand.1000"], palette["neutral.150"]),
214
+ "fg.spinner.inverse": ld(palette["neutral.00"], palette["brand.1000"]),
215
+ "fg.success": ld(palette["brand.700"], palette["green.dark.200"]),
216
+ "fg.success.hovered": ld(palette["brand.800"], palette["brand.500"]),
217
+ "fg.success.light": ld(palette["brand.300"], palette["brand.700"]),
218
+ "fg.success.strong": ld(palette["brand.800"], palette["brand.500"]),
219
+ "fg.tertiary": ld(palette["neutral.700"], palette["neutral.400"]),
220
+ "fg.warning": ld(palette["yellow.500"], palette["yellow.dark.200"]),
221
+ "fg.warning.hovered": ld(palette["yellow.600"], palette["yellow.600"]),
222
+ "fg.warning.inverse": ld(palette["neutral.800"], palette["neutral.800"]),
223
+ "fg.warning.light": ld(palette["yellow.300"], palette["yellow.600"]),
224
+ "fg.warning.strong": ld(palette["yellow.700"], palette["yellow.dark.200"]),
225
+ "fg.white": ld(palette["neutral.00"], palette["neutral.200"])
182
226
  };
183
-
227
+ //#endregion
184
228
  export { colors };
package/dist/esm/tokens/duration.js CHANGED
@@ -1,7 +1,8 @@
1
+ //#region src/tokens/duration.ts
1
2
  const duration = {
2
- sm: "150ms",
3
- md: "250ms",
4
- lg: "350ms"
3
+ sm: "150ms",
4
+ md: "250ms",
5
+ lg: "350ms"
5
6
  };
6
-
7
+ //#endregion
7
8
  export { duration };
package/dist/esm/tokens/fontFamily.js CHANGED
@@ -1,7 +1,8 @@
1
+ //#region src/tokens/fontFamily.ts
1
2
  const fontFamily = {
2
- heading: "Nudge SemiNormal, Roboto Condensed Variable, system-ui, sans-serif",
3
- mono: "Roboto Mono Variable, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace",
4
- sans: "DI Grotesk B, Roboto Variable, system-ui, sans-serif"
3
+ heading: "Nudge SemiNormal, Roboto Condensed Variable, system-ui, sans-serif",
4
+ mono: "Roboto Mono Variable, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace",
5
+ sans: "DI Grotesk B, Roboto Variable, system-ui, sans-serif"
5
6
  };
6
-
7
+ //#endregion
7
8
  export { fontFamily };
package/dist/esm/tokens/fontSize.js CHANGED
@@ -1,38 +1,38 @@
1
- import { rem } from './rem.js';
2
-
1
+ import { rem } from "./rem.js";
2
+ //#region src/tokens/fontSize.ts
3
3
  const fontSize = {
4
- xs: {
5
- fontSize: rem("10px"),
6
- lineHeight: rem("14px")
7
- },
8
- sm: {
9
- fontSize: rem("12px"),
10
- lineHeight: rem("16px")
11
- },
12
- md: {
13
- fontSize: rem("14px"),
14
- lineHeight: rem("20px")
15
- },
16
- lg: {
17
- fontSize: rem("16px"),
18
- lineHeight: rem("24px")
19
- },
20
- xl: {
21
- fontSize: rem("20px"),
22
- lineHeight: rem("28px")
23
- },
24
- "2xl": {
25
- fontSize: rem("24px"),
26
- lineHeight: rem("32px")
27
- },
28
- "3xl": {
29
- fontSize: rem("28px"),
30
- lineHeight: rem("40px")
31
- },
32
- "4xl": {
33
- fontSize: rem("50px"),
34
- lineHeight: rem("60px")
35
- }
4
+ xs: {
5
+ fontSize: rem("10px"),
6
+ lineHeight: rem("14px")
7
+ },
8
+ sm: {
9
+ fontSize: rem("12px"),
10
+ lineHeight: rem("16px")
11
+ },
12
+ md: {
13
+ fontSize: rem("14px"),
14
+ lineHeight: rem("20px")
15
+ },
16
+ lg: {
17
+ fontSize: rem("16px"),
18
+ lineHeight: rem("24px")
19
+ },
20
+ xl: {
21
+ fontSize: rem("20px"),
22
+ lineHeight: rem("28px")
23
+ },
24
+ "2xl": {
25
+ fontSize: rem("24px"),
26
+ lineHeight: rem("32px")
27
+ },
28
+ "3xl": {
29
+ fontSize: rem("28px"),
30
+ lineHeight: rem("40px")
31
+ },
32
+ "4xl": {
33
+ fontSize: rem("50px"),
34
+ lineHeight: rem("60px")
35
+ }
36
36
  };
37
-
37
+ //#endregion
38
38
  export { fontSize };
package/dist/esm/tokens/index.js CHANGED
@@ -1,25 +1,25 @@
1
- import { borderRadius } from './borderRadius.js';
2
- import { boxShadow } from './boxShadow.js';
3
- import { colors } from './colors.js';
4
- import { duration } from './duration.js';
5
- import { fontFamily } from './fontFamily.js';
6
- import { fontSize } from './fontSize.js';
7
- import { maxSize } from './maxSize.js';
8
- import { screens } from './screens.js';
9
- import { size } from './size.js';
10
- import { zIndex } from './zIndex.js';
11
-
1
+ import { borderRadius } from "./borderRadius.js";
2
+ import { boxShadow } from "./boxShadow.js";
3
+ import { colors } from "./colors.js";
4
+ import { duration } from "./duration.js";
5
+ import { fontFamily } from "./fontFamily.js";
6
+ import { fontSize } from "./fontSize.js";
7
+ import { maxSize } from "./maxSize.js";
8
+ import { screens } from "./screens.js";
9
+ import { size } from "./size.js";
10
+ import { zIndex } from "./zIndex.js";
11
+ //#region src/tokens/index.ts
12
12
  const tokens = {
13
- borderRadius,
14
- boxShadow,
15
- colors,
16
- duration,
17
- fontFamily,
18
- fontSize,
19
- maxSize,
20
- screens,
21
- size,
22
- zIndex
13
+ borderRadius,
14
+ boxShadow,
15
+ colors,
16
+ duration,
17
+ fontFamily,
18
+ fontSize,
19
+ maxSize,
20
+ screens,
21
+ size,
22
+ zIndex
23
23
  };
24
-
24
+ //#endregion
25
25
  export { tokens };
package/dist/esm/tokens/maxSize.js CHANGED
@@ -1,10 +1,10 @@
1
- import { rem } from './rem.js';
2
-
1
+ import { rem } from "./rem.js";
2
+ //#region src/tokens/maxSize.ts
3
3
  const maxSize = {
4
- xs: rem("320px"),
5
- sm: rem("384px"),
6
- md: rem("448px"),
7
- lg: rem("512px")
4
+ xs: rem("320px"),
5
+ sm: rem("384px"),
6
+ md: rem("448px"),
7
+ lg: rem("512px")
8
8
  };
9
-
9
+ //#endregion
10
10
  export { maxSize };
package/dist/esm/tokens/rem.js CHANGED
@@ -1,3 +1,4 @@
1
+ //#region src/tokens/rem.ts
1
2
  const rem = (px) => `${parseFloat((parseFloat(px.slice(0, -2)) / 16).toFixed(3))}rem`;
2
-
3
+ //#endregion
3
4
  export { rem };