@optiaxiom/globals 1.1.11 → 1.1.13

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,168 +1,197 @@
1
+ //#region src/tokens/colors.ts
1
2
  const palette = {
2
- "blue.100": "#C6DBFA",
3
- "blue.200": "#A1C2F7",
4
- "blue.300": "#7BAAF4",
5
- "blue.500": "#2F7AEE",
6
- "blue.600": "#115DD4",
7
- "blue.700": "#0D46A0",
8
- "blue.800": "#09306D",
9
- "blue.900": "#051939",
10
- "brand.50": "#F0F3FF",
11
- "brand.200": "#B3C3FF",
12
- "brand.300": "#6A8FFC",
13
- "brand.400": "#2E66F7",
14
- "brand.500": "#0037FF",
15
- "brand.600": "#002CCC",
16
- "brand.700": "#002894",
17
- "brand.800": "#001666",
18
- "brand.900": "#000B33",
19
- "green.100": "#D1F0E1",
20
- "green.200": "#A5E1C3",
21
- "green.300": "#7CD2A7",
22
- "green.400": "#5AC58A",
23
- "green.500": "#03A65D",
24
- "green.600": "#038047",
25
- "green.700": "#24663E",
26
- "green.800": "#17492B",
27
- "green.900": "#082415",
28
- "neutral.00": "#FFFFFF",
29
- "neutral.50": "#F9FAFC",
30
- "neutral.75": "#F5F6FA",
31
- "neutral.100": "#E9EDF5",
32
- "neutral.150": "#DADFEB",
33
- "neutral.200": "#CACFDC",
34
- "neutral.300": "#B8BECB",
35
- "neutral.500": "#838DA4",
36
- "neutral.600": "#66708C",
37
- "neutral.700": "#4F576E",
38
- "neutral.800": "#2E3442",
39
- "neutral.900": "#1C212B",
40
- "neutral.1000": "#1C2029",
41
- "neutral.1100": "#171A23",
42
- "neutral.1200": "#091E42",
43
- "neutral.50/6": "#F9FAFC0F",
44
- "neutral.50/12": "#F9FAFC1F",
45
- "neutral.50/18": "#F9FAFC2E",
46
- "neutral.50/32": "#F9FAFC52",
47
- "neutral.1200/4": "#091E420A",
48
- "neutral.1200/8": "#091E4214",
49
- "neutral.1200/32": "#091E4252",
50
- "purple.100": "#E5DCF4",
51
- "purple.500": "#693AB6",
52
- "purple.600": "#532E8F",
53
- "purple.700": "#412470",
54
- "red.50": "#FFF7F7",
55
- "red.100": "#FFD7D7",
56
- "red.200": "#FFB4B4",
57
- "red.300": "#FC8B8B",
58
- "red.400": "#F64F4F",
59
- "red.500": "#CC1616",
60
- "red.600": "#B21313",
61
- "red.700": "#911D1D",
62
- "red.800": "#601313",
63
- "red.900": "#300A0A",
64
- "yellow.100": "#FEF1C6",
65
- "yellow.200": "#FEDF88",
66
- "yellow.300": "#FFC84B",
67
- "yellow.400": "#FDB022",
68
- "yellow.500": "#F79008",
69
- "yellow.600": "#DC6903",
70
- "yellow.700": "#B54707",
71
- "yellow.800": "#7A2E0D",
72
- "yellow.900": "#4E1D09"
3
+ "blue.50": "#D9E7FC",
4
+ "blue.100": "#C6DBFA",
5
+ "blue.200": "#A1C2F7",
6
+ "blue.300": "#7BAAF4",
7
+ "blue.400": "#5592F1",
8
+ "blue.500": "#2F7AEE",
9
+ "blue.600": "#115DD4",
10
+ "blue.700": "#0D46A0",
11
+ "blue.800": "#09306D",
12
+ "blue.900": "#051939",
13
+ "brand.50": "#F0F3FF",
14
+ "brand.100": "#CDD8FC",
15
+ "brand.200": "#B3C3FF",
16
+ "brand.300": "#6A8FFC",
17
+ "brand.400": "#2E66F7",
18
+ "brand.500": "#0037FF",
19
+ "brand.600": "#002CCC",
20
+ "brand.700": "#002894",
21
+ "brand.800": "#001666",
22
+ "brand.900": "#000B33",
23
+ "cyan.50": "#ECFEFF",
24
+ "cyan.100": "#CFFAFE",
25
+ "cyan.200": "#99F0F9",
26
+ "cyan.300": "#67E8F9",
27
+ "cyan.400": "#22D3EE",
28
+ "cyan.500": "#06B6D4",
29
+ "cyan.600": "#0891B2",
30
+ "cyan.700": "#0E7490",
31
+ "cyan.800": "#155E75",
32
+ "cyan.900": "#083344",
33
+ "green.50": "#E9F7F1",
34
+ "green.100": "#D1F0E1",
35
+ "green.200": "#A5E1C3",
36
+ "green.300": "#7CD2A7",
37
+ "green.400": "#5AC58A",
38
+ "green.500": "#03A65D",
39
+ "green.600": "#038047",
40
+ "green.700": "#24663E",
41
+ "green.800": "#17492B",
42
+ "green.900": "#082415",
43
+ "magenta.50": "#FDF4FF",
44
+ "magenta.100": "#FAE8FF",
45
+ "magenta.200": "#F5D0FE",
46
+ "magenta.300": "#F0ABFC",
47
+ "magenta.400": "#D765E9",
48
+ "magenta.500": "#C026D3",
49
+ "magenta.600": "#A21CAF",
50
+ "magenta.700": "#86198F",
51
+ "magenta.800": "#701A75",
52
+ "magenta.900": "#4A044E",
53
+ "neutral.00": "#FFFFFF",
54
+ "neutral.50": "#F9FAFC",
55
+ "neutral.75": "#F5F6FA",
56
+ "neutral.100": "#E9EDF5",
57
+ "neutral.150": "#DADFEB",
58
+ "neutral.200": "#CACFDC",
59
+ "neutral.300": "#B8BECB",
60
+ "neutral.500": "#838DA4",
61
+ "neutral.600": "#66708C",
62
+ "neutral.700": "#4F576E",
63
+ "neutral.800": "#2E3442",
64
+ "neutral.900": "#1C212B",
65
+ "neutral.1000": "#1C2029",
66
+ "neutral.1100": "#171A23",
67
+ "neutral.1200": "#091E42",
68
+ "neutral.50/6": "#F9FAFC0F",
69
+ "neutral.50/12": "#F9FAFC1F",
70
+ "neutral.50/18": "#F9FAFC2E",
71
+ "neutral.50/22": "#F9FAFC38",
72
+ "neutral.50/32": "#F9FAFC52",
73
+ "neutral.1200/4": "#091E420A",
74
+ "neutral.1200/8": "#091E4214",
75
+ "neutral.1200/16": "#091E4229",
76
+ "neutral.1200/22": "#091E4238",
77
+ "neutral.1200/32": "#091E4252",
78
+ "purple.50": "#F1ECF8",
79
+ "purple.100": "#E5DCF4",
80
+ "purple.200": "#C4B1E2",
81
+ "purple.300": "#9570D1",
82
+ "purple.400": "#7E51C8",
83
+ "purple.500": "#693AB6",
84
+ "purple.600": "#532E8F",
85
+ "purple.700": "#412470",
86
+ "purple.800": "#331C59",
87
+ "purple.900": "#261542",
88
+ "red.50": "#FFF7F7",
89
+ "red.100": "#FFD7D7",
90
+ "red.200": "#FFB4B4",
91
+ "red.300": "#FC8B8B",
92
+ "red.400": "#F64F4F",
93
+ "red.500": "#CC1616",
94
+ "red.600": "#B21313",
95
+ "red.700": "#911D1D",
96
+ "red.800": "#601313",
97
+ "red.900": "#300A0A",
98
+ "yellow.50": "#FFFAEA",
99
+ "yellow.100": "#FEF1C6",
100
+ "yellow.200": "#FEDF88",
101
+ "yellow.300": "#FFC84B",
102
+ "yellow.400": "#FDB022",
103
+ "yellow.500": "#F79008",
104
+ "yellow.600": "#DC6903",
105
+ "yellow.700": "#B54707",
106
+ "yellow.800": "#7A2E0D",
107
+ "yellow.900": "#4E1D09"
73
108
  };
74
109
  const ld = (a, b) => `light-dark(${a}, ${b})`;
75
110
  const colors = {
76
- "bg.accent": ld(palette["brand.500"], palette["brand.400"]),
77
- "bg.accent.hovered": ld(palette["brand.600"], palette["brand.400"]),
78
- "bg.accent.light": ld(palette["brand.200"], palette["brand.800"]),
79
- "bg.accent.pressed": ld(palette["brand.700"], palette["brand.600"]),
80
- "bg.accent.subtle": ld(palette["brand.50"], palette["brand.900"]),
81
- "bg.avatar.neutral": ld(palette["neutral.100"], palette["neutral.800"]),
82
- "bg.avatar.purple": ld(palette["purple.100"], palette["purple.700"]),
83
- "bg.default": ld(palette["neutral.00"], palette["neutral.1000"]),
84
- "bg.default.hovered": ld(palette["neutral.1200/4"], palette["neutral.50/6"]),
85
- "bg.default.inverse": ld(palette["neutral.800"], palette["neutral.100"]),
86
- "bg.default.inverse.hovered": ld(
87
- palette["neutral.900"],
88
- palette["neutral.200"]
89
- ),
90
- "bg.default.inverse.pressed": ld(
91
- palette["neutral.1000"],
92
- palette["neutral.300"]
93
- ),
94
- "bg.default.pressed": ld(palette["neutral.1200/8"], palette["neutral.50/12"]),
95
- "bg.error": ld(palette["red.500"], palette["red.500"]),
96
- "bg.error.hovered": ld(palette["red.600"], palette["red.400"]),
97
- "bg.error.light": ld(palette["red.200"], palette["red.700"]),
98
- "bg.error.pressed": ld(palette["red.700"], palette["red.600"]),
99
- "bg.error.subtle": ld(palette["red.100"], palette["red.800"]),
100
- "bg.error.subtlest": ld(palette["red.50"], palette["red.900"]),
101
- "bg.information": ld(palette["blue.600"], palette["blue.600"]),
102
- "bg.information.light": ld(palette["blue.200"], palette["blue.800"]),
103
- "bg.information.subtle": ld(palette["blue.100"], palette["blue.900"]),
104
- "bg.overlay": ld(palette["neutral.1200/32"], palette["neutral.50/32"]),
105
- "bg.page": ld(palette["neutral.50"], palette["neutral.1100"]),
106
- "bg.secondary": ld(palette["neutral.75"], palette["neutral.900"]),
107
- "bg.secondary.hovered": ld(palette["neutral.75"], palette["neutral.50/12"]),
108
- "bg.spinner.default": ld(palette["neutral.1200"], palette["neutral.50"]),
109
- "bg.spinner.inverse": ld(palette["neutral.50"], palette["neutral.50"]),
110
- "bg.success": ld(palette["green.600"], palette["green.600"]),
111
- "bg.success.hovered": ld(palette["green.700"], palette["green.400"]),
112
- "bg.success.light": ld(palette["green.200"], palette["green.800"]),
113
- "bg.success.subtle": ld(palette["green.100"], palette["green.900"]),
114
- "bg.tertiary": ld(palette["neutral.150"], palette["neutral.700"]),
115
- "bg.tertiary.hovered": ld(palette["neutral.200"], palette["neutral.50/18"]),
116
- "bg.warning": ld(palette["yellow.300"], palette["yellow.500"]),
117
- "bg.warning.hovered": ld(palette["yellow.600"], palette["yellow.400"]),
118
- "bg.warning.light": ld(palette["yellow.200"], palette["yellow.800"]),
119
- "bg.warning.subtle": ld(palette["yellow.100"], palette["yellow.900"]),
120
- "border.accent": ld(palette["brand.500"], palette["brand.300"]),
121
- "border.control": ld(palette["neutral.500"], palette["neutral.700"]),
122
- "border.control.hovered": ld(palette["neutral.600"], palette["neutral.600"]),
123
- "border.default": ld(palette["neutral.200"], palette["neutral.600"]),
124
- "border.disabled": ld(palette["neutral.75"], palette["neutral.800"]),
125
- "border.error": ld(palette["red.500"], palette["red.200"]),
126
- "border.focus": ld(palette["brand.400"], palette["brand.300"]),
127
- "border.focus.error": ld(palette["red.400"], palette["red.300"]),
128
- "border.secondary": ld(palette["neutral.150"], palette["neutral.700"]),
129
- "border.success": ld(palette["green.500"], palette["green.500"]),
130
- "border.tertiary": ld(palette["neutral.100"], palette["neutral.800"]),
131
- "border.warning": ld(palette["yellow.500"], palette["yellow.500"]),
132
- "fg.accent": ld(palette["brand.500"], palette["brand.300"]),
133
- "fg.accent.hovered": ld(palette["brand.600"], palette["brand.500"]),
134
- "fg.accent.strong": ld(palette["brand.700"], palette["brand.400"]),
135
- "fg.avatar.neutral": ld(palette["neutral.700"], palette["neutral.100"]),
136
- "fg.avatar.purple": ld(palette["purple.700"], palette["purple.100"]),
137
- "fg.default": ld(palette["neutral.800"], palette["neutral.75"]),
138
- "fg.default.inverse": ld(palette["neutral.00"], palette["neutral.800"]),
139
- "fg.disabled": ld(palette["neutral.500"], palette["neutral.50/32"]),
140
- "fg.error": ld(palette["red.500"], palette["red.300"]),
141
- "fg.error.hovered": ld(palette["red.600"], palette["red.600"]),
142
- "fg.error.light": ld(palette["red.300"], palette["red.500"]),
143
- "fg.error.strong": ld(palette["red.700"], palette["red.200"]),
144
- "fg.information": ld(palette["blue.500"], palette["blue.300"]),
145
- "fg.information.light": ld(palette["blue.300"], palette["blue.500"]),
146
- "fg.information.strong": ld(palette["blue.700"], palette["blue.200"]),
147
- "fg.link.default": ld(palette["brand.500"], palette["brand.400"]),
148
- "fg.link.default.hovered": ld(palette["brand.600"], palette["brand.200"]),
149
- "fg.link.inverse": ld(palette["neutral.00"], palette["neutral.800"]),
150
- "fg.link.subtle": ld(palette["neutral.800"], palette["neutral.75"]),
151
- "fg.link.visited": ld(palette["purple.600"], palette["purple.500"]),
152
- "fg.secondary": ld(palette["neutral.700"], palette["neutral.200"]),
153
- "fg.spinner.default": ld(palette["neutral.800"], palette["neutral.200"]),
154
- "fg.spinner.inverse": ld(palette["neutral.200"], palette["neutral.800"]),
155
- "fg.success": ld(palette["green.500"], palette["green.300"]),
156
- "fg.success.hovered": ld(palette["green.600"], palette["green.600"]),
157
- "fg.success.light": ld(palette["green.300"], palette["green.500"]),
158
- "fg.success.strong": ld(palette["green.700"], palette["green.200"]),
159
- "fg.tertiary": ld(palette["neutral.600"], palette["neutral.500"]),
160
- "fg.warning": ld(palette["yellow.500"], palette["yellow.300"]),
161
- "fg.warning.hovered": ld(palette["yellow.600"], palette["yellow.600"]),
162
- "fg.warning.inverse": ld(palette["neutral.800"], palette["neutral.800"]),
163
- "fg.warning.light": ld(palette["yellow.300"], palette["yellow.500"]),
164
- "fg.warning.strong": ld(palette["yellow.700"], palette["yellow.200"]),
165
- "fg.white": ld(palette["neutral.00"], palette["neutral.00"])
111
+ "bg.accent": ld(palette["brand.500"], palette["brand.400"]),
112
+ "bg.accent.hovered": ld(palette["brand.600"], palette["brand.400"]),
113
+ "bg.accent.light": ld(palette["brand.200"], palette["brand.800"]),
114
+ "bg.accent.pressed": ld(palette["brand.700"], palette["brand.600"]),
115
+ "bg.accent.subtle": ld(palette["brand.50"], palette["brand.900"]),
116
+ "bg.avatar.neutral": ld(palette["neutral.100"], palette["neutral.800"]),
117
+ "bg.avatar.purple": ld(palette["purple.100"], palette["purple.700"]),
118
+ "bg.default": ld(palette["neutral.00"], palette["neutral.1000"]),
119
+ "bg.default.hovered": ld(palette["neutral.1200/4"], palette["neutral.50/6"]),
120
+ "bg.default.inverse": ld(palette["neutral.800"], palette["neutral.100"]),
121
+ "bg.default.inverse.hovered": ld(palette["neutral.900"], palette["neutral.200"]),
122
+ "bg.default.inverse.pressed": ld(palette["neutral.1000"], palette["neutral.300"]),
123
+ "bg.default.pressed": ld(palette["neutral.1200/8"], palette["neutral.50/12"]),
124
+ "bg.error": ld(palette["red.500"], palette["red.500"]),
125
+ "bg.error.hovered": ld(palette["red.600"], palette["red.400"]),
126
+ "bg.error.light": ld(palette["red.200"], palette["red.700"]),
127
+ "bg.error.pressed": ld(palette["red.700"], palette["red.600"]),
128
+ "bg.error.subtle": ld(palette["red.100"], palette["red.800"]),
129
+ "bg.error.subtlest": ld(palette["red.50"], palette["red.900"]),
130
+ "bg.information": ld(palette["blue.600"], palette["blue.600"]),
131
+ "bg.information.light": ld(palette["blue.200"], palette["blue.800"]),
132
+ "bg.information.subtle": ld(palette["blue.100"], palette["blue.900"]),
133
+ "bg.overlay": ld(palette["neutral.1200/32"], palette["neutral.50/32"]),
134
+ "bg.page": ld(palette["neutral.50"], palette["neutral.1100"]),
135
+ "bg.secondary": ld(palette["neutral.75"], palette["neutral.900"]),
136
+ "bg.secondary.hovered": ld(palette["neutral.75"], palette["neutral.50/12"]),
137
+ "bg.spinner.default": ld(palette["neutral.1200"], palette["neutral.50"]),
138
+ "bg.spinner.inverse": ld(palette["neutral.50"], palette["neutral.50"]),
139
+ "bg.success": ld(palette["green.600"], palette["green.600"]),
140
+ "bg.success.hovered": ld(palette["green.700"], palette["green.400"]),
141
+ "bg.success.light": ld(palette["green.200"], palette["green.800"]),
142
+ "bg.success.subtle": ld(palette["green.100"], palette["green.900"]),
143
+ "bg.tertiary": ld(palette["neutral.150"], palette["neutral.700"]),
144
+ "bg.tertiary.hovered": ld(palette["neutral.200"], palette["neutral.50/18"]),
145
+ "bg.warning": ld(palette["yellow.300"], palette["yellow.500"]),
146
+ "bg.warning.hovered": ld(palette["yellow.600"], palette["yellow.400"]),
147
+ "bg.warning.light": ld(palette["yellow.200"], palette["yellow.800"]),
148
+ "bg.warning.subtle": ld(palette["yellow.100"], palette["yellow.900"]),
149
+ "border.accent": ld(palette["brand.500"], palette["brand.300"]),
150
+ "border.control": ld(palette["neutral.500"], palette["neutral.700"]),
151
+ "border.control.hovered": ld(palette["neutral.600"], palette["neutral.600"]),
152
+ "border.default": ld(palette["neutral.200"], palette["neutral.600"]),
153
+ "border.disabled": ld(palette["neutral.75"], palette["neutral.800"]),
154
+ "border.error": ld(palette["red.500"], palette["red.200"]),
155
+ "border.focus": ld(palette["brand.400"], palette["brand.300"]),
156
+ "border.focus.error": ld(palette["red.400"], palette["red.300"]),
157
+ "border.secondary": ld(palette["neutral.150"], palette["neutral.700"]),
158
+ "border.success": ld(palette["green.500"], palette["green.500"]),
159
+ "border.tertiary": ld(palette["neutral.100"], palette["neutral.800"]),
160
+ "border.warning": ld(palette["yellow.500"], palette["yellow.500"]),
161
+ "fg.accent": ld(palette["brand.500"], palette["brand.300"]),
162
+ "fg.accent.hovered": ld(palette["brand.600"], palette["brand.500"]),
163
+ "fg.accent.strong": ld(palette["brand.700"], palette["brand.400"]),
164
+ "fg.avatar.neutral": ld(palette["neutral.700"], palette["neutral.100"]),
165
+ "fg.avatar.purple": ld(palette["purple.700"], palette["purple.100"]),
166
+ "fg.default": ld(palette["neutral.800"], palette["neutral.75"]),
167
+ "fg.default.inverse": ld(palette["neutral.00"], palette["neutral.800"]),
168
+ "fg.disabled": ld(palette["neutral.500"], palette["neutral.50/32"]),
169
+ "fg.error": ld(palette["red.500"], palette["red.300"]),
170
+ "fg.error.hovered": ld(palette["red.600"], palette["red.600"]),
171
+ "fg.error.light": ld(palette["red.300"], palette["red.500"]),
172
+ "fg.error.strong": ld(palette["red.700"], palette["red.200"]),
173
+ "fg.information": ld(palette["blue.500"], palette["blue.300"]),
174
+ "fg.information.light": ld(palette["blue.300"], palette["blue.500"]),
175
+ "fg.information.strong": ld(palette["blue.700"], palette["blue.200"]),
176
+ "fg.link.default": ld(palette["brand.500"], palette["brand.400"]),
177
+ "fg.link.default.hovered": ld(palette["brand.600"], palette["brand.200"]),
178
+ "fg.link.inverse": ld(palette["neutral.00"], palette["neutral.800"]),
179
+ "fg.link.subtle": ld(palette["neutral.800"], palette["neutral.75"]),
180
+ "fg.link.visited": ld(palette["purple.600"], palette["purple.500"]),
181
+ "fg.secondary": ld(palette["neutral.700"], palette["neutral.200"]),
182
+ "fg.spinner.default": ld(palette["neutral.800"], palette["neutral.200"]),
183
+ "fg.spinner.inverse": ld(palette["neutral.200"], palette["neutral.800"]),
184
+ "fg.success": ld(palette["green.500"], palette["green.300"]),
185
+ "fg.success.hovered": ld(palette["green.600"], palette["green.600"]),
186
+ "fg.success.light": ld(palette["green.300"], palette["green.500"]),
187
+ "fg.success.strong": ld(palette["green.700"], palette["green.200"]),
188
+ "fg.tertiary": ld(palette["neutral.600"], palette["neutral.500"]),
189
+ "fg.warning": ld(palette["yellow.500"], palette["yellow.300"]),
190
+ "fg.warning.hovered": ld(palette["yellow.600"], palette["yellow.600"]),
191
+ "fg.warning.inverse": ld(palette["neutral.800"], palette["neutral.800"]),
192
+ "fg.warning.light": ld(palette["yellow.300"], palette["yellow.500"]),
193
+ "fg.warning.strong": ld(palette["yellow.700"], palette["yellow.200"]),
194
+ "fg.white": ld(palette["neutral.00"], palette["neutral.00"])
166
195
  };
167
-
196
+ //#endregion
168
197
  export { colors };
@@ -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 };
@@ -1,6 +1,7 @@
1
+ //#region src/tokens/fontFamily.ts
1
2
  const fontFamily = {
2
- mono: "Fira Code Variable, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace",
3
- sans: "InterVariable, system-ui, sans-serif"
3
+ mono: "Fira Code Variable, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace",
4
+ sans: "InterVariable, system-ui, sans-serif"
4
5
  };
5
-
6
+ //#endregion
6
7
  export { fontFamily };
@@ -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("32px"),
34
- lineHeight: rem("44px")
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("32px"),
34
+ lineHeight: rem("44px")
35
+ }
36
36
  };
37
-
37
+ //#endregion
38
38
  export { fontSize };
@@ -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 };
@@ -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 };
@@ -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 };
@@ -1,8 +1,8 @@
1
- import { rem } from './rem.js';
2
-
1
+ import { rem } from "./rem.js";
2
+ //#region src/tokens/screens.ts
3
3
  const screens = {
4
- sm: rem("600px"),
5
- md: rem("900px")
4
+ sm: rem("600px"),
5
+ md: rem("900px")
6
6
  };
7
-
7
+ //#endregion
8
8
  export { screens };
@@ -1,13 +1,13 @@
1
- import { rem } from './rem.js';
2
-
1
+ import { rem } from "./rem.js";
2
+ //#region src/tokens/size.ts
3
3
  const size = {
4
- "2xs": rem("16px"),
5
- xs: rem("20px"),
6
- sm: rem("24px"),
7
- md: rem("32px"),
8
- lg: rem("40px"),
9
- xl: rem("48px"),
10
- "3xl": rem("80px")
4
+ "2xs": rem("16px"),
5
+ xs: rem("20px"),
6
+ sm: rem("24px"),
7
+ md: rem("32px"),
8
+ lg: rem("40px"),
9
+ xl: rem("48px"),
10
+ "3xl": rem("80px")
11
11
  };
12
-
12
+ //#endregion
13
13
  export { size };
@@ -1,7 +1,8 @@
1
+ //#region src/tokens/zIndex.ts
1
2
  const zIndex = {
2
- popover: "3000",
3
- toast: "3010",
4
- tooltip: "10000"
3
+ popover: "3000",
4
+ toast: "3010",
5
+ tooltip: "10000"
5
6
  };
6
-
7
+ //#endregion
7
8
  export { zIndex };