@xsolla/switch-theme-customization 0.153.1-pr264.1778643174

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.
package/index.mjs ADDED
@@ -0,0 +1,2180 @@
1
+ // src/themes/paystation4/variants/dark.ts
2
+ import { colord } from "colord";
3
+ var base = {
4
+ content: colord({ h: 211, s: 8, l: 100 }),
5
+ surface: colord({ h: 255, s: 26, l: 20 }),
6
+ project: colord({ h: 237, s: 90, l: 60 }),
7
+ phantom: colord({ h: 211, s: 8, l: 100 }),
8
+ path: colord({ h: 231, s: 90, l: 80 }),
9
+ accent: colord({ h: 343, s: 100, l: 60 }),
10
+ success: colord({ h: 147, s: 80, l: 80 }),
11
+ warning: colord({ h: 31, s: 100, l: 80 }),
12
+ alert: colord({ h: 346, s: 100, l: 70 }),
13
+ neutral: colord({ h: 237, s: 26, l: 80 })
14
+ };
15
+ var ps4DarkScheme = (base10) => ({
16
+ colors: {
17
+ base: {
18
+ content: base10.content.toRgbString(),
19
+ surface: base10.surface.toRgbString(),
20
+ project: base10.project.toRgbString(),
21
+ phantom: base10.phantom.toRgbString(),
22
+ path: base10.path.toRgbString(),
23
+ accent: base10.accent.toRgbString(),
24
+ success: base10.success.toRgbString(),
25
+ warning: base10.warning.toRgbString(),
26
+ alert: base10.alert.toRgbString(),
27
+ neutral: base10.neutral.toRgbString()
28
+ },
29
+ core: {
30
+ background: {
31
+ primary: base10.surface.toRgbString(),
32
+ secondary: base10.surface.rotate(3).darken(0.1).toRgbString(),
33
+ ghost: base10.phantom.alpha(0.05).toRgbString(),
34
+ tone: base10.phantom.darken(1).alpha(0.3).toRgbString(),
35
+ selection: base10.phantom.alpha(0.15).toRgbString(),
36
+ hover: base10.phantom.alpha(0.1).toRgbString(),
37
+ brand: base10.project.rotate(-6).lighten(0.2).toRgbString(),
38
+ brandSecondary: base10.accent.rotate(-9).darken(0.3).alpha(0.5).toRgbString(),
39
+ success: base10.success.rotate(6).darken(0.2).alpha(0.35).toRgbString(),
40
+ warning: base10.warning.rotate(-6).darken(0.2).alpha(0.35).toRgbString(),
41
+ alert: base10.alert.rotate(-3).darken(0.1).alpha(0.35).toRgbString(),
42
+ neutral: base10.neutral.rotate(15).darken(0.5).toRgbString()
43
+ },
44
+ divider: {
45
+ divider: base10.phantom.alpha(0.15).toRgbString()
46
+ },
47
+ text: {
48
+ primary: base10.content.toRgbString(),
49
+ secondary: base10.content.alpha(0.72).toRgbString(),
50
+ tertiary: base10.content.alpha(0.56).toRgbString(),
51
+ brand: base10.project.rotate(-3).lighten(0.1).toRgbString(),
52
+ brandSecondary: base10.accent.toRgbString(),
53
+ success: base10.success.toRgbString(),
54
+ warning: base10.warning.toRgbString(),
55
+ alert: base10.alert.rotate(3).lighten(0.1).toRgbString(),
56
+ neutral: base10.neutral.toRgbString()
57
+ },
58
+ link: {
59
+ link: base10.path.toRgbString(),
60
+ linkHover: base10.path.alpha(0.7).toRgbString(),
61
+ linkMinor: base10.path.rotate(-3).lighten(0.1).toRgbString(),
62
+ linkMinorHover: base10.path.rotate(-3).lighten(0.1).alpha(0.7).toRgbString()
63
+ }
64
+ },
65
+ control: {
66
+ primary: {
67
+ bg: base10.project.toRgbString(),
68
+ bgHover: base10.project.rotate(3).darken(0.1).toRgbString(),
69
+ bgPress: base10.project.rotate(-3).lighten(0.1).toRgbString(),
70
+ bgDisabled: base10.surface.rotate(-3).lighten(0.1).toRgbString(),
71
+ border: base10.project.toRgbString(),
72
+ borderHover: base10.project.rotate(3).darken(0.1).toRgbString(),
73
+ borderPress: base10.project.rotate(-3).lighten(0.1).toRgbString()
74
+ },
75
+ secondary: {
76
+ bg: "transparent",
77
+ bgHover: base10.project.rotate(-3).lighten(0.1).alpha(0.1).toRgbString(),
78
+ bgPress: base10.project.rotate(-3).lighten(0.1).alpha(0.3).toRgbString(),
79
+ border: base10.project.rotate(-3).lighten(0.1).toRgbString(),
80
+ borderHover: base10.project.toRgbString(),
81
+ borderPress: base10.project.toRgbString()
82
+ },
83
+ default: {
84
+ bg: colord({ h: 214, s: 8, l: 97 }).toRgbString(),
85
+ bgHover: colord({ h: 220, s: 80, l: 90 }).toRgbString(),
86
+ bgPress: colord({ h: 217, s: 8, l: 95 }).toRgbString(),
87
+ border: colord({ h: 214, s: 8, l: 97 }).toRgbString(),
88
+ borderHover: colord({ h: 220, s: 80, l: 90 }).toRgbString(),
89
+ borderPress: colord({ h: 217, s: 8, l: 95 }).toRgbString()
90
+ },
91
+ input: {
92
+ bg: base10.phantom.alpha(0.07).toRgbString(),
93
+ bgHover: base10.phantom.alpha(0.1).toRgbString(),
94
+ bgDisabled: base10.phantom.alpha(0.2).toRgbString(),
95
+ border: "transparent",
96
+ borderHover: base10.phantom.alpha(0.1).toRgbString(),
97
+ borderDisabled: "transparent",
98
+ text: base10.content.toRgbString(),
99
+ textDisabled: base10.content.alpha(0.36).toRgbString(),
100
+ placeholder: base10.content.alpha(0.55).toRgbString()
101
+ },
102
+ focus: {
103
+ bg: base10.surface.rotate(3).darken(0.1).toRgbString(),
104
+ border: base10.project.toRgbString()
105
+ },
106
+ alert: {
107
+ bg: "transparent",
108
+ bgHover: base10.alert.rotate(3).lighten(0.1).alpha(0.1).toRgbString(),
109
+ bgPress: base10.alert.rotate(3).lighten(0.1).alpha(0.2).toRgbString(),
110
+ border: base10.alert.toRgbString(),
111
+ borderHover: base10.alert.rotate(-3).darken(0.1).toRgbString(),
112
+ borderPress: base10.alert.rotate(-3).darken(0.1).toRgbString()
113
+ },
114
+ check: {
115
+ bg: base10.project.toRgbString(),
116
+ bgHover: base10.project.rotate(3).darken(0.1).toRgbString(),
117
+ bgDisabled: base10.phantom.alpha(0.2).toRgbString()
118
+ },
119
+ faint: {
120
+ bg: base10.phantom.alpha(0.15).toRgbString(),
121
+ bgHover: base10.phantom.alpha(0.2).toRgbString(),
122
+ border: "transparent",
123
+ borderHover: base10.phantom.alpha(0.12).toRgbString()
124
+ },
125
+ toggle: {
126
+ bg: base10.phantom.alpha(0.15).toRgbString(),
127
+ bgHover: base10.phantom.alpha(0.2).toRgbString()
128
+ },
129
+ text: {
130
+ active: base10.content.toRgbString(),
131
+ secondary: base10.project.rotate(-3).lighten(0.1).toRgbString(),
132
+ default: base10.content.darken(1).toRgbString(),
133
+ primary: base10.content.toRgbString(),
134
+ disabled: base10.content.alpha(0.3).toRgbString(),
135
+ faint: base10.content.toRgbString(),
136
+ alert: base10.alert.toRgbString()
137
+ }
138
+ }
139
+ }
140
+ });
141
+ var dark = ps4DarkScheme(base);
142
+
143
+ // src/themes/paystation4/variants/light.ts
144
+ import { colord as colord2 } from "colord";
145
+ var base2 = {
146
+ content: colord2({ h: 244, s: 8, l: 10 }),
147
+ surface: colord2({ h: 211, s: 8, l: 100 }),
148
+ project: colord2({ h: 237, s: 90, l: 60 }),
149
+ phantom: colord2({ h: 252, s: 26, l: 30 }),
150
+ path: colord2({ h: 243, s: 90, l: 40 }),
151
+ accent: colord2({ h: 343, s: 100, l: 60 }),
152
+ success: colord2({ h: 162, s: 80, l: 30 }),
153
+ warning: colord2({ h: 19, s: 100, l: 40 }),
154
+ alert: colord2({ h: 337, s: 100, l: 40 }),
155
+ neutral: colord2({ h: 252, s: 26, l: 30 })
156
+ };
157
+ var ps4LightScheme = (base10) => ({
158
+ colors: {
159
+ base: {
160
+ content: base10.content.toRgbString(),
161
+ surface: base10.surface.toRgbString(),
162
+ project: base10.project.toRgbString(),
163
+ phantom: base10.phantom.toRgbString(),
164
+ path: base10.path.toRgbString(),
165
+ accent: base10.accent.toRgbString(),
166
+ success: base10.success.toRgbString(),
167
+ warning: base10.warning.toRgbString(),
168
+ alert: base10.alert.toRgbString(),
169
+ neutral: base10.neutral.toRgbString()
170
+ },
171
+ core: {
172
+ background: {
173
+ primary: base10.surface.toRgbString(),
174
+ secondary: base10.surface.toRgbString(),
175
+ ghost: base10.phantom.alpha(0.05).toRgbString(),
176
+ tone: base10.phantom.desaturate(0.16).alpha(0.5).toRgbString(),
177
+ selection: base10.phantom.alpha(0.1).toRgbString(),
178
+ hover: base10.phantom.alpha(0.08).toRgbString(),
179
+ brand: base10.project.rotate(-9).lighten(0.3).toRgbString(),
180
+ brandSecondary: base10.accent.rotate(6).lighten(0.2).toRgbString(),
181
+ success: base10.success.rotate(-21).lighten(0.65).toRgbString(),
182
+ warning: base10.warning.rotate(18).lighten(0.55).toRgbString(),
183
+ alert: base10.alert.rotate(18).lighten(0.55).toRgbString(),
184
+ neutral: base10.neutral.rotate(-21).lighten(0.65).toRgbString()
185
+ },
186
+ divider: {
187
+ divider: base10.phantom.alpha(0.15).toRgbString()
188
+ },
189
+ text: {
190
+ primary: base10.content.toRgbString(),
191
+ secondary: base10.content.alpha(0.75).toRgbString(),
192
+ tertiary: base10.content.alpha(0.61).toRgbString(),
193
+ brand: base10.project.toRgbString(),
194
+ brandSecondary: base10.accent.toRgbString(),
195
+ success: base10.success.toRgbString(),
196
+ warning: base10.warning.toRgbString(),
197
+ alert: base10.alert.rotate(-3).darken(0.1).toRgbString(),
198
+ neutral: base10.neutral.toRgbString()
199
+ },
200
+ link: {
201
+ link: base10.path.toRgbString(),
202
+ linkHover: base10.path.alpha(0.7).toRgbString(),
203
+ linkMinor: base10.path.rotate(-6).lighten(0.2).toRgbString(),
204
+ linkMinorHover: base10.path.rotate(-6).lighten(0.2).alpha(0.7).toRgbString()
205
+ }
206
+ },
207
+ control: {
208
+ primary: {
209
+ bg: base10.project.toRgbString(),
210
+ bgHover: base10.project.rotate(3).darken(0.1).toRgbString(),
211
+ bgPress: base10.project.rotate(-3).lighten(0.1).toRgbString(),
212
+ bgDisabled: base10.surface.rotate(12).darken(0.2).toRgbString(),
213
+ border: base10.project.toRgbString(),
214
+ borderHover: base10.project.rotate(3).darken(0.1).toRgbString(),
215
+ borderPress: base10.project.rotate(-3).lighten(0.1).toRgbString()
216
+ },
217
+ secondary: {
218
+ bg: "transparent",
219
+ bgHover: base10.project.rotate(-6).lighten(0.2).alpha(0.2).toRgbString(),
220
+ bgPress: base10.project.rotate(-6).lighten(0.2).alpha(0.5).toRgbString(),
221
+ border: base10.project.toRgbString(),
222
+ borderHover: base10.project.rotate(3).darken(0.1).toRgbString(),
223
+ borderPress: base10.project.rotate(3).darken(0.1).toRgbString()
224
+ },
225
+ default: {
226
+ bg: base10.surface.rotate(33).darken(0.9).toRgbString(),
227
+ bgHover: base10.surface.rotate(33).darken(0.95).toRgbString(),
228
+ bgPress: base10.surface.rotate(33).darken(0.8).toRgbString(),
229
+ border: base10.surface.rotate(33).darken(0.9).toRgbString(),
230
+ borderHover: base10.surface.rotate(33).darken(0.95).toRgbString(),
231
+ borderPress: base10.surface.rotate(33).darken(0.8).toRgbString()
232
+ },
233
+ input: {
234
+ bg: base10.phantom.alpha(0.07).toRgbString(),
235
+ bgHover: base10.phantom.alpha(0.1).toRgbString(),
236
+ bgDisabled: base10.phantom.alpha(0.15).toRgbString(),
237
+ border: "transparent",
238
+ borderHover: base10.phantom.alpha(0.1).toRgbString(),
239
+ borderDisabled: "transparent",
240
+ text: base10.content.toRgbString(),
241
+ textDisabled: base10.content.alpha(0.36).toRgbString(),
242
+ placeholder: base10.content.alpha(0.61).toRgbString()
243
+ },
244
+ focus: {
245
+ bg: base10.surface.toRgbString(),
246
+ border: base10.project.toRgbString()
247
+ },
248
+ alert: {
249
+ bg: "transparent",
250
+ bgHover: base10.alert.rotate(9).lighten(0.3).alpha(0.2).toRgbString(),
251
+ bgPress: base10.alert.rotate(9).lighten(0.3).alpha(0.5).toRgbString(),
252
+ border: base10.alert.toRgbString(),
253
+ borderHover: base10.alert.rotate(-3).darken(0.1).toRgbString(),
254
+ borderPress: base10.alert.rotate(-3).darken(0.1).toRgbString()
255
+ },
256
+ check: {
257
+ bg: base10.project.toRgbString(),
258
+ bgHover: base10.project.rotate(3).darken(0.1).toRgbString(),
259
+ bgDisabled: base10.phantom.alpha(0.2).toRgbString()
260
+ },
261
+ faint: {
262
+ bg: base10.phantom.alpha(0.15).toRgbString(),
263
+ bgHover: base10.phantom.alpha(0.2).toRgbString(),
264
+ border: "transparent",
265
+ borderHover: base10.phantom.alpha(0.15).toRgbString()
266
+ },
267
+ toggle: {
268
+ bg: base10.phantom.alpha(0.15).toRgbString(),
269
+ bgHover: base10.phantom.alpha(0.2).toRgbString()
270
+ },
271
+ text: {
272
+ active: base10.content.lighten(1).toRgbString(),
273
+ secondary: base10.project.toRgbString(),
274
+ default: base10.content.lighten(1).toRgbString(),
275
+ primary: base10.content.toRgbString(),
276
+ disabled: base10.content.alpha(0.3).toRgbString(),
277
+ faint: base10.content.lighten(1).toRgbString(),
278
+ alert: base10.alert.toRgbString()
279
+ }
280
+ }
281
+ }
282
+ });
283
+ var light = ps4LightScheme(base2);
284
+
285
+ // src/themes/paystation4/variants/take2.ts
286
+ import { colord as colord3 } from "colord";
287
+ var base3 = {
288
+ content: colord3("#FFFFFF"),
289
+ surface: colord3("#2C2640"),
290
+ project: colord3("#3D46F5"),
291
+ phantom: colord3("#FFFFFF"),
292
+ path: colord3("#6E7BF7"),
293
+ accent: colord3("#FF336D"),
294
+ success: colord3("#04A476"),
295
+ warning: colord3("#FFC633"),
296
+ alert: colord3("#FF668B"),
297
+ neutral: colord3("#817FB3")
298
+ };
299
+ var ps4Take2Scheme = () => ({
300
+ colors: {
301
+ base: {
302
+ content: base3.content.toRgbString(),
303
+ surface: base3.surface.toRgbString(),
304
+ project: base3.project.toRgbString(),
305
+ phantom: base3.phantom.toRgbString(),
306
+ path: base3.path.toRgbString(),
307
+ accent: base3.accent.toRgbString(),
308
+ success: base3.success.toRgbString(),
309
+ warning: base3.warning.toRgbString(),
310
+ alert: base3.alert.toRgbString(),
311
+ neutral: base3.neutral.toRgbString()
312
+ },
313
+ core: {
314
+ background: {
315
+ primary: colord3({ r: 17, g: 19, b: 40, a: 1 }).toRgbString(),
316
+ secondary: base3.surface.toRgbString(),
317
+ ghost: colord3({ r: 255, g: 255, b: 255, a: 0.05 }).toRgbString(),
318
+ tone: colord3({ r: 2, g: 2, b: 4, a: 0.3 }).toRgbString(),
319
+ selection: colord3({ r: 255, g: 255, b: 255, a: 0.15 }).toRgbString(),
320
+ hover: colord3({ r: 255, g: 255, b: 255, a: 0.05 }).toRgbString(),
321
+ brand: colord3({ r: 244, g: 163, b: 2, a: 0.3 }).toRgbString(),
322
+ brandSecondary: base3.accent.rotate(-9).darken(0.3).alpha(0.5).toRgbString(),
323
+ success: colord3({ r: 71, g: 235, b: 161, a: 0.35 }).toRgbString(),
324
+ warning: colord3({ r: 255, g: 136, b: 51, a: 0.35 }).toRgbString(),
325
+ alert: colord3({ r: 255, g: 51, b: 109, a: 0.35 }).toRgbString(),
326
+ neutral: colord3({ r: 65, g: 57, b: 96, a: 1 }).toRgbString()
327
+ },
328
+ divider: {
329
+ divider: colord3({ r: 255, g: 255, b: 255, a: 0.15 }).toRgbString()
330
+ },
331
+ text: {
332
+ primary: colord3({ r: 248, g: 249, b: 255, a: 1 }).toRgbString(),
333
+ secondary: colord3({ r: 248, g: 249, b: 255, a: 0.7 }).toRgbString(),
334
+ tertiary: colord3({ r: 248, g: 249, b: 255, a: 0.5 }).toRgbString(),
335
+ brand: colord3({ r: 244, g: 163, b: 2, a: 1 }).toRgbString(),
336
+ brandSecondary: base3.accent.toRgbString(),
337
+ success: colord3({ r: 163, g: 245, b: 200, a: 1 }).toRgbString(),
338
+ warning: colord3({ r: 255, g: 206, b: 153, a: 1 }).toRgbString(),
339
+ alert: colord3({ r: 255, g: 153, b: 172, a: 1 }).toRgbString(),
340
+ neutral: colord3({ r: 191, g: 192, b: 217, a: 1 }).toRgbString()
341
+ },
342
+ link: {
343
+ link: colord3({ r: 244, g: 163, b: 2, a: 1 }).toRgbString(),
344
+ linkHover: colord3({ r: 244, g: 163, b: 2, a: 0.7 }).toRgbString(),
345
+ linkMinor: colord3({ r: 147, g: 165, b: 236, a: 1 }).toRgbString(),
346
+ linkMinorHover: colord3({ r: 147, g: 165, b: 236, a: 0.7 }).toRgbString()
347
+ }
348
+ },
349
+ control: {
350
+ primary: {
351
+ bg: colord3({ r: 244, g: 163, b: 2, a: 1 }).toRgbString(),
352
+ bgHover: colord3({ r: 192, g: 138, b: 2, a: 1 }).toRgbString(),
353
+ bgPress: colord3({ r: 253, g: 172, b: 43, a: 1 }).toRgbString(),
354
+ bgDisabled: colord3({ r: 117, g: 120, b: 138, a: 1 }).toRgbString(),
355
+ border: colord3({ r: 244, g: 163, b: 2, a: 1 }).toRgbString(),
356
+ borderHover: colord3({ r: 192, g: 138, b: 2, a: 1 }).toRgbString(),
357
+ borderPress: colord3({ r: 253, g: 172, b: 43, a: 1 }).toRgbString()
358
+ },
359
+ secondary: {
360
+ bg: colord3({ r: 26, g: 28, b: 40, a: 0 }).toRgbString(),
361
+ bgHover: colord3({ r: 110, g: 123, b: 247, a: 0.1 }).toRgbString(),
362
+ bgPress: colord3({ r: 110, g: 123, b: 247, a: 0.3 }).toRgbString(),
363
+ border: colord3({ r: 244, g: 163, b: 2, a: 1 }).toRgbString(),
364
+ borderHover: colord3({ r: 192, g: 138, b: 2, a: 1 }).toRgbString(),
365
+ borderPress: colord3({ r: 192, g: 138, b: 2, a: 1 }).toRgbString()
366
+ },
367
+ default: {
368
+ bg: colord3({ r: 247, g: 247, b: 248, a: 1 }).toRgbString(),
369
+ bgHover: colord3({ r: 227, g: 229, b: 231, a: 1 }).toRgbString(),
370
+ bgPress: colord3({ r: 255, g: 255, b: 255, a: 1 }).toRgbString(),
371
+ border: colord3({ r: 247, g: 247, b: 248, a: 1 }).toRgbString(),
372
+ borderHover: colord3({ r: 227, g: 229, b: 231, a: 1 }).toRgbString(),
373
+ borderPress: colord3({ r: 255, g: 255, b: 255, a: 1 }).toRgbString()
374
+ },
375
+ input: {
376
+ bg: colord3({ r: 255, g: 255, b: 255, a: 0.07 }).toRgbString(),
377
+ bgHover: colord3({ r: 255, g: 255, b: 255, a: 0.1 }).toRgbString(),
378
+ bgDisabled: colord3({ r: 255, g: 255, b: 255, a: 0.2 }).toRgbString(),
379
+ border: colord3({ r: 255, g: 255, b: 255, a: 0 }).toRgbString(),
380
+ borderHover: colord3({ r: 255, g: 255, b: 255, a: 0.1 }).toRgbString(),
381
+ borderDisabled: colord3({ r: 255, g: 255, b: 255, a: 0 }).toRgbString(),
382
+ text: colord3({ r: 255, g: 255, b: 255, a: 1 }).toRgbString(),
383
+ textDisabled: colord3({ r: 255, g: 255, b: 255, a: 0.3 }).toRgbString(),
384
+ placeholder: colord3({ r: 255, g: 255, b: 255, a: 0.55 }).toRgbString()
385
+ },
386
+ focus: {
387
+ bg: colord3({ r: 27, g: 32, b: 64, a: 1 }).toRgbString(),
388
+ border: colord3({ r: 244, g: 163, b: 2, a: 1 }).toRgbString()
389
+ },
390
+ alert: {
391
+ bg: "transparent",
392
+ bgHover: colord3({ r: 255, g: 153, b: 172, a: 0.1 }).toRgbString(),
393
+ bgPress: colord3({ r: 255, g: 153, b: 172, a: 0.2 }).toRgbString(),
394
+ border: colord3({ r: 255, g: 102, b: 138, a: 1 }).toRgbString(),
395
+ borderHover: colord3({ r: 255, g: 51, b: 109, a: 1 }).toRgbString(),
396
+ borderPress: colord3({ r: 255, g: 51, b: 109, a: 1 }).toRgbString()
397
+ },
398
+ check: {
399
+ bg: colord3({ r: 244, g: 163, b: 2, a: 1 }).toRgbString(),
400
+ bgHover: colord3({ r: 192, g: 138, b: 2, a: 1 }).toRgbString(),
401
+ bgDisabled: colord3({ r: 255, g: 255, b: 255, a: 0.2 }).toRgbString()
402
+ },
403
+ faint: {
404
+ bg: colord3({ r: 255, g: 255, b: 255, a: 0.15 }).toRgbString(),
405
+ bgHover: colord3({ r: 255, g: 255, b: 255, a: 0.2 }).toRgbString(),
406
+ border: colord3({ r: 255, g: 255, b: 255, a: 0 }).toRgbString(),
407
+ borderHover: colord3({ r: 255, g: 255, b: 255, a: 0.12 }).toRgbString()
408
+ },
409
+ toggle: {
410
+ bg: colord3({ r: 255, g: 255, b: 255, a: 0.15 }).toRgbString(),
411
+ bgHover: colord3({ r: 255, g: 255, b: 255, a: 0.2 }).toRgbString()
412
+ },
413
+ text: {
414
+ active: colord3({ r: 255, g: 255, b: 255, a: 1 }).toRgbString(),
415
+ secondary: colord3({ r: 244, g: 163, b: 2, a: 1 }).toRgbString(),
416
+ default: colord3({ r: 2, g: 2, b: 3, a: 1 }).toRgbString(),
417
+ primary: colord3({ r: 255, g: 255, b: 255, a: 1 }).toRgbString(),
418
+ disabled: colord3({ r: 255, g: 255, b: 255, a: 0.3 }).toRgbString(),
419
+ faint: colord3({ r: 255, g: 255, b: 255, a: 1 }).toRgbString(),
420
+ alert: colord3({ r: 255, g: 102, b: 138, a: 1 }).toRgbString()
421
+ }
422
+ }
423
+ }
424
+ });
425
+ var take2 = ps4Take2Scheme();
426
+
427
+ // src/themes/paystation4/variants/gaijin.ts
428
+ import { colord as colord4 } from "colord";
429
+ var base4 = {
430
+ content: colord4("#FFFFFF"),
431
+ surface: colord4("#2C2640"),
432
+ project: colord4("#3D46F5"),
433
+ phantom: colord4("#FFFFFF"),
434
+ path: colord4("#6E7BF7"),
435
+ accent: colord4("#FF336D"),
436
+ success: colord4("#04A476"),
437
+ warning: colord4("#FFC633"),
438
+ alert: colord4("#FF668B"),
439
+ neutral: colord4("#817FB3")
440
+ };
441
+ var ps4GaijinScheme = () => ({
442
+ colors: {
443
+ base: {
444
+ content: base4.content.toRgbString(),
445
+ surface: base4.surface.toRgbString(),
446
+ project: base4.project.toRgbString(),
447
+ phantom: base4.phantom.toRgbString(),
448
+ path: base4.path.toRgbString(),
449
+ accent: base4.accent.toRgbString(),
450
+ success: base4.success.toRgbString(),
451
+ warning: base4.warning.toRgbString(),
452
+ alert: base4.alert.toRgbString(),
453
+ neutral: base4.neutral.toRgbString()
454
+ },
455
+ core: {
456
+ background: {
457
+ primary: colord4({ r: 46, g: 58, b: 71, a: 1 }).toRgbString(),
458
+ secondary: base4.surface.toRgbString(),
459
+ ghost: colord4({ r: 3, g: 12, b: 21, a: 0.4 }).toRgbString(),
460
+ tone: colord4({ r: 2, g: 2, b: 4, a: 0.3 }).toRgbString(),
461
+ selection: colord4({ r: 255, g: 255, b: 255, a: 0.15 }).toRgbString(),
462
+ hover: colord4({ r: 255, g: 255, b: 255, a: 0.05 }).toRgbString(),
463
+ brand: colord4({ r: 16, g: 112, b: 112, a: 1 }).toRgbString(),
464
+ brandSecondary: base4.accent.rotate(-9).darken(0.3).alpha(0.5).toRgbString(),
465
+ success: colord4({ r: 71, g: 235, b: 161, a: 0.35 }).toRgbString(),
466
+ warning: colord4({ r: 255, g: 136, b: 51, a: 0.35 }).toRgbString(),
467
+ alert: colord4({ r: 255, g: 51, b: 109, a: 0.35 }).toRgbString(),
468
+ neutral: colord4({ r: 65, g: 57, b: 96, a: 1 }).toRgbString()
469
+ },
470
+ divider: {
471
+ divider: colord4({ r: 255, g: 255, b: 255, a: 0.15 }).toRgbString()
472
+ },
473
+ text: {
474
+ primary: colord4({ r: 255, g: 255, b: 255, a: 1 }).toRgbString(),
475
+ secondary: colord4({ r: 255, g: 255, b: 255, a: 0.75 }).toRgbString(),
476
+ tertiary: colord4({ r: 255, g: 255, b: 255, a: 0.6 }).toRgbString(),
477
+ brand: colord4({ r: 27, g: 188, b: 183, a: 1 }).toRgbString(),
478
+ brandSecondary: base4.accent.toRgbString(),
479
+ success: colord4({ r: 163, g: 245, b: 200, a: 1 }).toRgbString(),
480
+ warning: colord4({ r: 255, g: 206, b: 153, a: 1 }).toRgbString(),
481
+ alert: colord4({ r: 255, g: 153, b: 172, a: 1 }).toRgbString(),
482
+ neutral: colord4({ r: 191, g: 192, b: 217, a: 1 }).toRgbString()
483
+ },
484
+ link: {
485
+ link: colord4({ r: 49, g: 238, b: 218, a: 1 }).toRgbString(),
486
+ linkHover: colord4({ r: 49, g: 238, b: 218, a: 0.7 }).toRgbString(),
487
+ linkMinor: colord4({ r: 41, g: 178, b: 188, a: 1 }).toRgbString(),
488
+ linkMinorHover: colord4({ r: 41, g: 178, b: 188, a: 0.7 }).toRgbString()
489
+ }
490
+ },
491
+ control: {
492
+ primary: {
493
+ bg: colord4({ r: 27, g: 188, b: 183, a: 1 }).toRgbString(),
494
+ bgHover: colord4({ r: 7, g: 158, b: 169, a: 1 }).toRgbString(),
495
+ bgPress: colord4({ r: 12, g: 97, b: 94, a: 1 }).toRgbString(),
496
+ bgDisabled: colord4({ r: 117, g: 120, b: 138, a: 1 }).toRgbString(),
497
+ border: colord4({ r: 27, g: 188, b: 183, a: 1 }).toRgbString(),
498
+ borderHover: colord4({ r: 7, g: 158, b: 169, a: 1 }).toRgbString(),
499
+ borderPress: colord4({ r: 12, g: 97, b: 94, a: 1 }).toRgbString()
500
+ },
501
+ secondary: {
502
+ bg: colord4({ r: 26, g: 28, b: 40, a: 0 }).toRgbString(),
503
+ bgHover: colord4({ r: 49, g: 238, b: 218, a: 0.1 }).toRgbString(),
504
+ bgPress: colord4({ r: 49, g: 238, b: 218, a: 0.3 }).toRgbString(),
505
+ border: colord4({ r: 27, g: 188, b: 183, a: 1 }).toRgbString(),
506
+ borderHover: colord4({ r: 7, g: 158, b: 169, a: 1 }).toRgbString(),
507
+ borderPress: colord4({ r: 7, g: 158, b: 169, a: 1 }).toRgbString()
508
+ },
509
+ default: {
510
+ bg: colord4({ r: 247, g: 247, b: 258, a: 1 }).toRgbString(),
511
+ bgHover: colord4({ r: 227, g: 229, b: 231, a: 1 }).toRgbString(),
512
+ bgPress: colord4({ r: 225, g: 255, b: 255, a: 1 }).toRgbString(),
513
+ border: colord4({ r: 247, g: 247, b: 258, a: 1 }).toRgbString(),
514
+ borderHover: colord4({ r: 227, g: 229, b: 231, a: 1 }).toRgbString(),
515
+ borderPress: colord4({ r: 225, g: 255, b: 255, a: 1 }).toRgbString()
516
+ },
517
+ input: {
518
+ bg: colord4({ r: 3, g: 12, b: 21, a: 0.2 }).toRgbString(),
519
+ bgHover: colord4({ r: 3, g: 12, b: 12, a: 0.2 }).toRgbString(),
520
+ bgDisabled: colord4({ r: 255, g: 255, b: 255, a: 0.2 }).toRgbString(),
521
+ border: colord4({ r: 87, g: 97, b: 108, a: 1 }).toRgbString(),
522
+ borderHover: colord4({ r: 87, g: 97, b: 108, a: 1 }).toRgbString(),
523
+ borderDisabled: colord4({ r: 255, g: 255, b: 255, a: 0 }).toRgbString(),
524
+ text: colord4({ r: 255, g: 255, b: 255, a: 1 }).toRgbString(),
525
+ textDisabled: colord4({ r: 255, g: 255, b: 255, a: 0.3 }).toRgbString(),
526
+ placeholder: colord4({ r: 255, g: 255, b: 255, a: 0.75 }).toRgbString()
527
+ },
528
+ focus: {
529
+ bg: colord4({ r: 58, g: 75, b: 90, a: 1 }).toRgbString(),
530
+ border: colord4({ r: 49, g: 238, b: 218, a: 1 }).toRgbString()
531
+ },
532
+ alert: {
533
+ bg: colord4({ r: 24, g: 23, b: 28, a: 0 }).toRgbString(),
534
+ bgHover: colord4({ r: 255, g: 153, b: 172, a: 0.1 }).toRgbString(),
535
+ bgPress: colord4({ r: 255, g: 153, b: 172, a: 0.2 }).toRgbString(),
536
+ border: colord4({ r: 255, g: 102, b: 138, a: 1 }).toRgbString(),
537
+ borderHover: colord4({ r: 255, g: 51, b: 109, a: 1 }).toRgbString(),
538
+ borderPress: colord4({ r: 255, g: 51, b: 109, a: 1 }).toRgbString()
539
+ },
540
+ check: {
541
+ bg: colord4({ r: 49, g: 238, b: 218, a: 1 }).toRgbString(),
542
+ bgHover: colord4({ r: 7, g: 158, b: 169, a: 1 }).toRgbString(),
543
+ bgDisabled: colord4({ r: 255, g: 255, b: 255, a: 0.2 }).toRgbString()
544
+ },
545
+ faint: {
546
+ bg: colord4({ r: 255, g: 255, b: 255, a: 0 }).toRgbString(),
547
+ bgHover: colord4({ r: 255, g: 255, b: 255, a: 0 }).toRgbString(),
548
+ border: colord4({ r: 49, g: 238, b: 218, a: 1 }).toRgbString(),
549
+ borderHover: colord4({ r: 7, g: 158, b: 169, a: 1 }).toRgbString()
550
+ },
551
+ toggle: {
552
+ bg: colord4({ r: 255, g: 255, b: 255, a: 0.15 }).toRgbString(),
553
+ bgHover: colord4({ r: 255, g: 255, b: 255, a: 0.2 }).toRgbString()
554
+ },
555
+ text: {
556
+ active: colord4({ r: 255, g: 255, b: 255, a: 1 }).toRgbString(),
557
+ secondary: colord4({ r: 27, g: 188, b: 183, a: 1 }).toRgbString(),
558
+ default: colord4({ r: 2, g: 2, b: 3, a: 1 }).toRgbString(),
559
+ primary: colord4({ r: 255, g: 255, b: 255, a: 1 }).toRgbString(),
560
+ disabled: colord4({ r: 255, g: 255, b: 255, a: 0.3 }).toRgbString(),
561
+ faint: colord4({ r: 46, g: 58, b: 72, a: 1 }).toRgbString(),
562
+ alert: colord4({ r: 255, g: 102, b: 138, a: 1 }).toRgbString()
563
+ }
564
+ }
565
+ }
566
+ });
567
+ var gaijin = ps4GaijinScheme();
568
+
569
+ // src/themes/paystation4/variants/nexters.ts
570
+ import { colord as colord5 } from "colord";
571
+ var base5 = {
572
+ content: colord5({ h: 211, s: 8, l: 100 }),
573
+ surface: colord5({ h: 255, s: 26, l: 20 }),
574
+ project: colord5({ h: 237, s: 90, l: 60 }),
575
+ phantom: colord5({ h: 211, s: 8, l: 100 }),
576
+ path: colord5({ h: 234, s: 90, l: 70 }),
577
+ accent: colord5("#FF336D"),
578
+ success: colord5({ h: 147, s: 80, l: 80 }),
579
+ warning: colord5({ h: 31, s: 100, l: 80 }),
580
+ alert: colord5({ h: 346, s: 100, l: 70 }),
581
+ neutral: colord5({ h: 237, s: 26, l: 80 })
582
+ };
583
+ var ps4NextersScheme = () => ({
584
+ colors: {
585
+ base: {
586
+ content: base5.content.toRgbString(),
587
+ surface: base5.surface.toRgbString(),
588
+ project: base5.project.toRgbString(),
589
+ phantom: base5.phantom.toRgbString(),
590
+ path: base5.path.toRgbString(),
591
+ accent: base5.accent.toRgbString(),
592
+ success: base5.success.toRgbString(),
593
+ warning: base5.warning.toRgbString(),
594
+ alert: base5.alert.toRgbString(),
595
+ neutral: base5.neutral.toRgbString()
596
+ },
597
+ core: {
598
+ background: {
599
+ primary: colord5({ r: 32, g: 19, b: 8, a: 1 }).toRgbString(),
600
+ secondary: base5.surface.toRgbString(),
601
+ ghost: colord5({ r: 45, g: 25, b: 13, a: 1 }).toRgbString(),
602
+ tone: colord5({ r: 51, g: 28, b: 14, a: 1 }).toRgbString(),
603
+ selection: colord5({ r: 255, g: 255, b: 255, a: 0.15 }).toRgbString(),
604
+ hover: colord5({ r: 255, g: 255, b: 255, a: 0.05 }).toRgbString(),
605
+ brand: colord5({ r: 244, g: 163, b: 2, a: 0.3 }).toRgbString(),
606
+ brandSecondary: base5.accent.rotate(-9).darken(0.3).alpha(0.5).toRgbString(),
607
+ success: colord5({ r: 75, g: 148, b: 29, a: 1 }).toRgbString(),
608
+ warning: colord5({ r: 145, g: 93, b: 36, a: 1 }).toRgbString(),
609
+ alert: colord5({ r: 194, g: 18, b: 19, a: 1 }).toRgbString(),
610
+ neutral: colord5({ r: 13, g: 106, b: 185, a: 1 }).toRgbString()
611
+ },
612
+ divider: {
613
+ divider: colord5({ r: 61, g: 31, b: 14, a: 1 }).toRgbString()
614
+ },
615
+ text: {
616
+ primary: colord5({ r: 255, g: 250, b: 214, a: 1 }).toRgbString(),
617
+ secondary: colord5({ r: 190, g: 150, b: 128, a: 1 }).toRgbString(),
618
+ tertiary: colord5({ r: 155, g: 113, b: 89, a: 1 }).toRgbString(),
619
+ brand: colord5({ r: 255, g: 250, b: 214, a: 1 }).toRgbString(),
620
+ brandSecondary: base5.accent.toRgbString(),
621
+ success: colord5({ r: 163, g: 245, b: 200, a: 1 }).toRgbString(),
622
+ warning: colord5({ r: 255, g: 206, b: 153, a: 1 }).toRgbString(),
623
+ alert: colord5({ r: 255, g: 153, b: 172, a: 1 }).toRgbString(),
624
+ neutral: colord5({ r: 191, g: 192, b: 217, a: 1 }).toRgbString()
625
+ },
626
+ link: {
627
+ link: colord5({ r: 104, g: 202, b: 45, a: 1 }).toRgbString(),
628
+ linkHover: colord5({ r: 75, g: 148, b: 29, a: 1 }).toRgbString(),
629
+ linkMinor: colord5({ r: 255, g: 214, b: 109, a: 1 }).toRgbString(),
630
+ linkMinorHover: colord5({ r: 254, g: 196, b: 57, a: 1 }).toRgbString()
631
+ }
632
+ },
633
+ control: {
634
+ primary: {
635
+ bg: colord5({ r: 75, g: 148, b: 29, a: 1 }).toRgbString(),
636
+ bgHover: colord5({ r: 104, g: 202, b: 45, a: 1 }).toRgbString(),
637
+ bgPress: colord5({ r: 115, g: 226, b: 62, a: 1 }).toRgbString(),
638
+ bgDisabled: colord5({ r: 102, g: 102, b: 102, a: 1 }).toRgbString(),
639
+ border: colord5({ r: 75, g: 148, b: 29, a: 1 }).toRgbString(),
640
+ borderHover: colord5({ r: 104, g: 202, b: 45, a: 1 }).toRgbString(),
641
+ borderPress: colord5({ r: 115, g: 226, b: 62, a: 1 }).toRgbString()
642
+ },
643
+ secondary: {
644
+ bg: colord5({ r: 51, g: 28, b: 14, a: 1 }).toRgbString(),
645
+ bgHover: colord5({ r: 61, g: 31, b: 14, a: 1 }).toRgbString(),
646
+ bgPress: colord5({ r: 71, g: 35, b: 14, a: 1 }).toRgbString(),
647
+ border: colord5({ r: 75, g: 148, b: 29, a: 1 }).toRgbString(),
648
+ borderHover: colord5({ r: 104, g: 202, b: 45, a: 1 }).toRgbString(),
649
+ borderPress: colord5({ r: 115, g: 226, b: 62, a: 1 }).toRgbString()
650
+ },
651
+ default: {
652
+ bg: colord5({ r: 247, g: 247, b: 248, a: 1 }).toRgbString(),
653
+ bgHover: colord5({ r: 227, g: 229, b: 231, a: 1 }).toRgbString(),
654
+ bgPress: colord5({ r: 255, g: 255, b: 255, a: 1 }).toRgbString(),
655
+ border: colord5({ r: 247, g: 247, b: 248, a: 1 }).toRgbString(),
656
+ borderHover: colord5({ r: 227, g: 229, b: 231, a: 1 }).toRgbString(),
657
+ borderPress: colord5({ r: 255, g: 255, b: 255, a: 1 }).toRgbString()
658
+ },
659
+ input: {
660
+ bg: colord5({ r: 51, g: 28, b: 14, a: 1 }).toRgbString(),
661
+ bgHover: colord5({ r: 51, g: 28, b: 14, a: 1 }).toRgbString(),
662
+ bgDisabled: colord5({ r: 51, g: 51, b: 51, a: 1 }).toRgbString(),
663
+ border: colord5({ r: 77, g: 44, b: 7, a: 1 }).toRgbString(),
664
+ borderHover: colord5({ r: 145, g: 93, b: 36, a: 1 }).toRgbString(),
665
+ borderDisabled: colord5({ r: 32, g: 19, b: 8, a: 1 }).toRgbString(),
666
+ text: colord5({ r: 255, g: 250, b: 214, a: 1 }).toRgbString(),
667
+ textDisabled: colord5({ r: 102, g: 102, b: 102, a: 1 }).toRgbString(),
668
+ placeholder: colord5({ r: 145, g: 93, b: 36, a: 1 }).toRgbString()
669
+ },
670
+ focus: {
671
+ bg: colord5({ r: 71, g: 35, b: 14, a: 1 }).toRgbString(),
672
+ border: colord5({ r: 75, g: 148, b: 29, a: 1 }).toRgbString()
673
+ },
674
+ alert: {
675
+ bg: "transparent",
676
+ bgHover: colord5({ r: 194, g: 18, b: 19, a: 0.1 }).toRgbString(),
677
+ bgPress: colord5({ r: 194, g: 18, b: 19, a: 0.2 }).toRgbString(),
678
+ border: colord5({ r: 194, g: 18, b: 19, a: 1 }).toRgbString(),
679
+ borderHover: colord5({ r: 211, g: 40, b: 41, a: 1 }).toRgbString(),
680
+ borderPress: colord5({ r: 236, g: 49, b: 50, a: 1 }).toRgbString()
681
+ },
682
+ check: {
683
+ bg: colord5({ r: 75, g: 148, b: 29, a: 1 }).toRgbString(),
684
+ bgHover: colord5({ r: 192, g: 138, b: 2, a: 1 }).toRgbString(),
685
+ bgDisabled: colord5({ r: 51, g: 51, b: 51, a: 1 }).toRgbString()
686
+ },
687
+ faint: {
688
+ bg: "transparent",
689
+ bgHover: colord5({ r: 75, g: 148, b: 29, a: 0.3 }).toRgbString(),
690
+ border: colord5({ r: 75, g: 148, b: 29, a: 1 }).toRgbString(),
691
+ borderHover: colord5({ r: 75, g: 148, b: 29, a: 1 }).toRgbString()
692
+ },
693
+ toggle: {
694
+ bg: colord5({ r: 255, g: 255, b: 255, a: 0.1 }).toRgbString(),
695
+ bgHover: colord5({ r: 255, g: 255, b: 255, a: 0.2 }).toRgbString()
696
+ },
697
+ text: {
698
+ active: colord5({ r: 255, g: 250, b: 214, a: 1 }).toRgbString(),
699
+ secondary: colord5({ r: 104, g: 202, b: 45, a: 1 }).toRgbString(),
700
+ default: colord5({ r: 2, g: 2, b: 3, a: 1 }).toRgbString(),
701
+ primary: colord5({ r: 255, g: 250, b: 214, a: 1 }).toRgbString(),
702
+ disabled: colord5({ r: 153, g: 153, b: 153, a: 1 }).toRgbString(),
703
+ faint: colord5({ r: 255, g: 250, b: 214, a: 1 }).toRgbString(),
704
+ alert: colord5({ r: 194, g: 18, b: 19, a: 1 }).toRgbString()
705
+ }
706
+ }
707
+ }
708
+ });
709
+ var nexters = ps4NextersScheme();
710
+
711
+ // src/themes/paystation4/misc.ts
712
+ var borderRadiusScale = {
713
+ sm: "4px",
714
+ md: "8px",
715
+ lg: "12px",
716
+ xl: "16px"
717
+ };
718
+ var misc = {
719
+ borderRadiusScale,
720
+ borderWidth: "2px",
721
+ borderRadius: {
722
+ /* for Autocomplet, Select, TextField, DatePicker, Pin */
723
+ input: borderRadiusScale.md,
724
+ /* for Button, Upload */
725
+ button: borderRadiusScale.md,
726
+ buttonIcon: borderRadiusScale.md,
727
+ /* Calendar, ContextMenu, Tooltip, Notification, Avatar (square type), */
728
+ popup: borderRadiusScale.md,
729
+ checkbox: borderRadiusScale.sm,
730
+ tag: "18px"
731
+ },
732
+ minWidth: {
733
+ button: "40px"
734
+ }
735
+ };
736
+
737
+ // src/themes/paystation4/scale.ts
738
+ var typoScale = {
739
+ fontSize: {
740
+ $xs: "10px",
741
+ $sm: "12px",
742
+ $md: "14px",
743
+ $lg: "16px",
744
+ $xl: "18px",
745
+ $2xl: "20px",
746
+ $3xl: "24px",
747
+ $4xl: "30px"
748
+ },
749
+ lineHeight: {
750
+ $xs: "14px",
751
+ $sm: "17px",
752
+ $md: "20px",
753
+ $lg: "22px",
754
+ $xl: "25px",
755
+ $2xl: "28px",
756
+ $3xl: "32px",
757
+ $4xl: "36px"
758
+ }
759
+ };
760
+
761
+ // src/themes/paystation4/typo.ts
762
+ var typo = {
763
+ fontFamily: `'GraphikLCWebUikit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
764
+ Helvetica, Arial, sans-serif`,
765
+ core: {
766
+ strong: {
767
+ fontSize: "36px",
768
+ lineHeight: "40px"
769
+ },
770
+ h1: {
771
+ fontSize: typoScale.fontSize.$4xl,
772
+ lineHeight: typoScale.lineHeight.$4xl,
773
+ fontWeight: 500
774
+ },
775
+ h2: {
776
+ fontSize: typoScale.fontSize.$3xl,
777
+ lineHeight: typoScale.lineHeight.$3xl,
778
+ fontWeight: 500
779
+ },
780
+ h3: {
781
+ fontSize: typoScale.fontSize.$2xl,
782
+ lineHeight: typoScale.lineHeight.$2xl,
783
+ fontWeight: 500
784
+ },
785
+ h4: { fontSize: typoScale.fontSize.$xl, lineHeight: typoScale.lineHeight.$xl, fontWeight: 500 },
786
+ bodyMd: { fontSize: typoScale.fontSize.$md, lineHeight: typoScale.lineHeight.$md },
787
+ bodyMdAccent: {
788
+ fontSize: typoScale.fontSize.$md,
789
+ lineHeight: typoScale.lineHeight.$md,
790
+ fontWeight: 500
791
+ },
792
+ bodyLg: {
793
+ fontSize: typoScale.fontSize.$lg,
794
+ lineHeight: typoScale.lineHeight.$md,
795
+ fontWeight: 400
796
+ },
797
+ bodyLgAccent: {
798
+ fontSize: typoScale.fontSize.$lg,
799
+ lineHeight: typoScale.lineHeight.$md,
800
+ fontWeight: 500
801
+ },
802
+ paragraph: { fontSize: typoScale.fontSize.$md, lineHeight: typoScale.lineHeight.$md },
803
+ label: { fontSize: typoScale.fontSize.$md, lineHeight: typoScale.lineHeight.$md },
804
+ minor: { fontSize: typoScale.fontSize.$sm, lineHeight: typoScale.lineHeight.$sm }
805
+ },
806
+ components: {
807
+ button: {
808
+ sm: {
809
+ fontSize: typoScale.fontSize.$sm,
810
+ lineHeight: typoScale.lineHeight.$sm,
811
+ fontWeight: 500
812
+ },
813
+ md: {
814
+ fontSize: typoScale.fontSize.$md,
815
+ lineHeight: typoScale.lineHeight.$md,
816
+ fontWeight: 500
817
+ },
818
+ lg: {
819
+ fontSize: typoScale.fontSize.$lg,
820
+ lineHeight: typoScale.lineHeight.$lg,
821
+ fontWeight: 500
822
+ }
823
+ },
824
+ input: {
825
+ sm: {
826
+ fontSize: typoScale.fontSize.$sm,
827
+ lineHeight: typoScale.lineHeight.$sm,
828
+ fontWeight: 400
829
+ },
830
+ md: {
831
+ fontSize: typoScale.fontSize.$md,
832
+ lineHeight: typoScale.lineHeight.$md,
833
+ fontWeight: 400
834
+ },
835
+ lg: {
836
+ fontSize: typoScale.fontSize.$lg,
837
+ lineHeight: typoScale.lineHeight.$lg,
838
+ fontWeight: 400
839
+ }
840
+ },
841
+ tab: {
842
+ sm: {
843
+ fontSize: typoScale.fontSize.$sm,
844
+ lineHeight: typoScale.lineHeight.$sm,
845
+ fontWeight: 500
846
+ },
847
+ md: {
848
+ fontSize: typoScale.fontSize.$md,
849
+ lineHeight: typoScale.lineHeight.$md,
850
+ fontWeight: 500
851
+ },
852
+ lg: {
853
+ fontSize: typoScale.fontSize.$lg,
854
+ lineHeight: typoScale.lineHeight.$lg,
855
+ fontWeight: 500
856
+ }
857
+ },
858
+ check: {
859
+ sm: {
860
+ fontSize: typoScale.fontSize.$sm,
861
+ lineHeight: typoScale.lineHeight.$sm,
862
+ fontWeight: 400
863
+ },
864
+ md: {
865
+ fontSize: typoScale.fontSize.$md,
866
+ lineHeight: typoScale.lineHeight.$md,
867
+ fontWeight: 400
868
+ },
869
+ lg: {
870
+ fontSize: typoScale.fontSize.$lg,
871
+ lineHeight: typoScale.lineHeight.$lg,
872
+ fontWeight: 400
873
+ }
874
+ },
875
+ heading: {
876
+ sm: {
877
+ fontSize: typoScale.fontSize.$xs,
878
+ lineHeight: typoScale.lineHeight.$xs,
879
+ fontWeight: 400,
880
+ textTransform: "uppercase"
881
+ },
882
+ md: {
883
+ fontSize: typoScale.fontSize.$sm,
884
+ lineHeight: typoScale.lineHeight.$sm,
885
+ fontWeight: 400,
886
+ textTransform: "uppercase"
887
+ },
888
+ lg: {
889
+ fontSize: typoScale.fontSize.$md,
890
+ lineHeight: typoScale.lineHeight.$md,
891
+ fontWeight: 400,
892
+ textTransform: "uppercase"
893
+ }
894
+ },
895
+ label: {
896
+ sm: {
897
+ fontSize: typoScale.fontSize.$xs,
898
+ lineHeight: typoScale.lineHeight.$xs,
899
+ fontWeight: 400
900
+ },
901
+ md: {
902
+ fontSize: typoScale.fontSize.$sm,
903
+ lineHeight: typoScale.lineHeight.$sm,
904
+ fontWeight: 400
905
+ },
906
+ lg: {
907
+ fontSize: typoScale.fontSize.$md,
908
+ lineHeight: typoScale.lineHeight.$md,
909
+ fontWeight: 400
910
+ }
911
+ },
912
+ fieldGroup: {
913
+ sm: {
914
+ fontSize: typoScale.fontSize.$xs,
915
+ lineHeight: typoScale.lineHeight.$xs,
916
+ fontWeight: 400
917
+ },
918
+ md: {
919
+ fontSize: typoScale.fontSize.$sm,
920
+ lineHeight: typoScale.lineHeight.$sm,
921
+ fontWeight: 400
922
+ },
923
+ lg: {
924
+ fontSize: typoScale.fontSize.$md,
925
+ lineHeight: typoScale.lineHeight.$md,
926
+ fontWeight: 400
927
+ }
928
+ }
929
+ }
930
+ };
931
+
932
+ // src/default/shadows.ts
933
+ var shadowsDefault = {
934
+ active: "0px 1px 2px rgba(7, 7, 8, 0.2), 0px 1px 3px 1px rgba(7, 7, 8, 0.1)",
935
+ surface: "0px 1px 2px rgba(7, 7, 8, 0.2), 0px 2px 6px 2px rgba(7, 7, 8, 0.1)",
936
+ surfaceHover: "0px 4px 8px 3px rgba(7, 7, 8, 0.1), 0px 1px 3px rgba(7, 7, 8, 0.2)",
937
+ popover: "0px 6px 10px 4px rgba(7, 7, 8, 0.1), 0px 2px 3px rgba(7, 7, 8, 0.2)",
938
+ modal: "0px 8px 12px 6px rgba(7, 7, 8, 0.1), 0px 4px 4px rgba(7, 7, 8, 0.2)"
939
+ };
940
+
941
+ // src/themes/paystation4/shadows.ts
942
+ var shadows = shadowsDefault;
943
+
944
+ // src/themes/paystation4/paystation4.ts
945
+ var paystation4 = {
946
+ ...light,
947
+ typo,
948
+ misc,
949
+ shadows
950
+ };
951
+ var paystation4Dark = {
952
+ ...paystation4,
953
+ ...dark
954
+ };
955
+ var paystation4Take2 = {
956
+ ...paystation4,
957
+ ...take2
958
+ };
959
+ var paystation4Gaijin = {
960
+ ...paystation4,
961
+ ...gaijin
962
+ };
963
+ var paystation4Nexters = {
964
+ ...paystation4,
965
+ ...nexters
966
+ };
967
+ var paystation4Themes = {
968
+ light: paystation4,
969
+ dark: paystation4Dark,
970
+ take2: paystation4Take2,
971
+ gaijin: paystation4Gaijin,
972
+ nexters: paystation4Nexters
973
+ };
974
+
975
+ // src/themes/emails/variants/dark.ts
976
+ import { colord as colord6 } from "colord";
977
+ var base6 = {
978
+ content: colord6({ h: 211, s: 8, l: 100 }),
979
+ surface: colord6({ h: 255, s: 26, l: 20 }),
980
+ project: colord6({ h: 237, s: 90, l: 60 }),
981
+ phantom: colord6({ h: 211, s: 8, l: 100 }),
982
+ path: colord6({ h: 231, s: 90, l: 80 }),
983
+ accent: colord6({ h: 343, s: 100, l: 60 }),
984
+ success: colord6({ h: 147, s: 80, l: 80 }),
985
+ warning: colord6({ h: 31, s: 100, l: 80 }),
986
+ alert: colord6({ h: 346, s: 100, l: 70 }),
987
+ neutral: colord6({ h: 237, s: 26, l: 80 })
988
+ };
989
+ var emailsDarkScheme = (base10) => ({
990
+ colors: {
991
+ base: {
992
+ content: base10.content.toRgbString(),
993
+ surface: base10.surface.toRgbString(),
994
+ project: base10.project.toRgbString(),
995
+ phantom: base10.phantom.toRgbString(),
996
+ path: base10.path.toRgbString(),
997
+ accent: base10.accent.toRgbString(),
998
+ success: base10.success.toRgbString(),
999
+ warning: base10.warning.toRgbString(),
1000
+ alert: base10.alert.toRgbString(),
1001
+ neutral: base10.neutral.toRgbString()
1002
+ },
1003
+ core: {
1004
+ background: {
1005
+ primary: base10.surface.toRgbString(),
1006
+ secondary: base10.surface.rotate(3).darken(0.1).toRgbString(),
1007
+ ghost: base10.phantom.alpha(0.05).toRgbString(),
1008
+ tone: base10.phantom.darken(1).alpha(0.3).toRgbString(),
1009
+ selection: base10.phantom.alpha(0.15).toRgbString(),
1010
+ hover: base10.phantom.alpha(0.1).toRgbString(),
1011
+ brand: base10.project.rotate(-6).lighten(0.2).toRgbString(),
1012
+ brandSecondary: base10.accent.rotate(-9).darken(0.3).alpha(0.5).toRgbString(),
1013
+ success: base10.success.rotate(6).darken(0.2).alpha(0.35).toRgbString(),
1014
+ warning: base10.warning.rotate(-6).darken(0.2).alpha(0.35).toRgbString(),
1015
+ alert: base10.alert.rotate(-3).darken(0.1).alpha(0.35).toRgbString(),
1016
+ neutral: base10.neutral.rotate(15).darken(0.5).toRgbString()
1017
+ },
1018
+ divider: {
1019
+ divider: base10.phantom.alpha(0.15).toRgbString()
1020
+ },
1021
+ text: {
1022
+ primary: base10.content.toRgbString(),
1023
+ secondary: base10.content.alpha(0.72).toRgbString(),
1024
+ tertiary: base10.content.alpha(0.56).toRgbString(),
1025
+ brand: base10.project.rotate(-3).lighten(0.1).toRgbString(),
1026
+ brandSecondary: base10.accent.toRgbString(),
1027
+ success: base10.success.toRgbString(),
1028
+ warning: base10.warning.toRgbString(),
1029
+ alert: base10.alert.rotate(3).lighten(0.1).toRgbString(),
1030
+ neutral: base10.neutral.toRgbString()
1031
+ },
1032
+ link: {
1033
+ link: base10.path.toRgbString(),
1034
+ linkHover: base10.path.alpha(0.7).toRgbString(),
1035
+ linkMinor: base10.path.rotate(-3).lighten(0.1).toRgbString(),
1036
+ linkMinorHover: base10.path.rotate(-3).lighten(0.1).alpha(0.7).toRgbString()
1037
+ }
1038
+ },
1039
+ control: {
1040
+ primary: {
1041
+ bg: base10.project.toRgbString(),
1042
+ bgHover: base10.project.rotate(3).darken(0.1).toRgbString(),
1043
+ bgPress: base10.project.rotate(-3).lighten(0.1).toRgbString(),
1044
+ bgDisabled: base10.surface.rotate(-3).lighten(0.1).toRgbString(),
1045
+ border: base10.project.toRgbString(),
1046
+ borderHover: base10.project.rotate(3).darken(0.1).toRgbString(),
1047
+ borderPress: base10.project.rotate(-3).lighten(0.1).toRgbString()
1048
+ },
1049
+ secondary: {
1050
+ bg: "transparent",
1051
+ bgHover: base10.project.rotate(-3).lighten(0.1).alpha(0.1).toRgbString(),
1052
+ bgPress: base10.project.rotate(-3).lighten(0.1).alpha(0.3).toRgbString(),
1053
+ border: base10.project.rotate(-3).lighten(0.1).toRgbString(),
1054
+ borderHover: base10.project.toRgbString(),
1055
+ borderPress: base10.project.toRgbString()
1056
+ },
1057
+ default: {
1058
+ bg: colord6({ h: 214, s: 8, l: 97 }).toRgbString(),
1059
+ bgHover: colord6({ h: 220, s: 80, l: 90 }).toRgbString(),
1060
+ bgPress: colord6({ h: 217, s: 8, l: 95 }).toRgbString(),
1061
+ border: colord6({ h: 214, s: 8, l: 97 }).toRgbString(),
1062
+ borderHover: colord6({ h: 220, s: 80, l: 90 }).toRgbString(),
1063
+ borderPress: colord6({ h: 217, s: 8, l: 95 }).toRgbString()
1064
+ },
1065
+ input: {
1066
+ bg: base10.phantom.alpha(0.07).toRgbString(),
1067
+ bgHover: base10.phantom.alpha(0.1).toRgbString(),
1068
+ bgDisabled: base10.phantom.alpha(0.2).toRgbString(),
1069
+ border: "transparent",
1070
+ borderHover: base10.phantom.alpha(0.1).toRgbString(),
1071
+ borderDisabled: "transparent",
1072
+ text: base10.content.toRgbString(),
1073
+ textDisabled: base10.content.alpha(0.36).toRgbString(),
1074
+ placeholder: base10.content.alpha(0.55).toRgbString()
1075
+ },
1076
+ focus: {
1077
+ bg: base10.surface.rotate(3).darken(0.1).toRgbString(),
1078
+ border: base10.project.toRgbString()
1079
+ },
1080
+ alert: {
1081
+ bg: "transparent",
1082
+ bgHover: base10.alert.rotate(3).lighten(0.1).alpha(0.1).toRgbString(),
1083
+ bgPress: base10.alert.rotate(3).lighten(0.1).alpha(0.2).toRgbString(),
1084
+ border: base10.alert.toRgbString(),
1085
+ borderHover: base10.alert.rotate(-3).darken(0.1).toRgbString(),
1086
+ borderPress: base10.alert.rotate(-3).darken(0.1).toRgbString()
1087
+ },
1088
+ check: {
1089
+ bg: base10.project.toRgbString(),
1090
+ bgHover: base10.project.rotate(3).darken(0.1).toRgbString(),
1091
+ bgDisabled: base10.phantom.alpha(0.2).toRgbString()
1092
+ },
1093
+ faint: {
1094
+ bg: base10.phantom.alpha(0.15).toRgbString(),
1095
+ bgHover: base10.phantom.alpha(0.2).toRgbString(),
1096
+ border: "transparent",
1097
+ borderHover: base10.phantom.alpha(0.12).toRgbString()
1098
+ },
1099
+ toggle: {
1100
+ bg: base10.phantom.alpha(0.15).toRgbString(),
1101
+ bgHover: base10.phantom.alpha(0.2).toRgbString()
1102
+ },
1103
+ text: {
1104
+ active: base10.content.toRgbString(),
1105
+ secondary: base10.project.rotate(-3).lighten(0.1).toRgbString(),
1106
+ default: base10.content.darken(1).toRgbString(),
1107
+ primary: base10.content.toRgbString(),
1108
+ disabled: base10.content.alpha(0.3).toRgbString(),
1109
+ faint: base10.content.toRgbString(),
1110
+ alert: base10.alert.toRgbString()
1111
+ }
1112
+ }
1113
+ }
1114
+ });
1115
+ var dark2 = emailsDarkScheme(base6);
1116
+
1117
+ // src/themes/emails/variants/light.ts
1118
+ import { colord as colord7 } from "colord";
1119
+ var base7 = {
1120
+ content: colord7({ h: 244, s: 8, l: 10 }),
1121
+ surface: colord7({ h: 211, s: 8, l: 100 }),
1122
+ project: colord7({ h: 237, s: 90, l: 60 }),
1123
+ phantom: colord7({ h: 252, s: 26, l: 30 }),
1124
+ path: colord7({ h: 243, s: 90, l: 40 }),
1125
+ accent: colord7({ h: 343, s: 100, l: 60 }),
1126
+ success: colord7({ h: 162, s: 80, l: 30 }),
1127
+ warning: colord7({ h: 19, s: 100, l: 40 }),
1128
+ alert: colord7({ h: 337, s: 100, l: 40 }),
1129
+ neutral: colord7({ h: 252, s: 26, l: 30 })
1130
+ };
1131
+ var emailsLightScheme = (base10) => ({
1132
+ colors: {
1133
+ base: {
1134
+ content: base10.content.toRgbString(),
1135
+ surface: base10.surface.toRgbString(),
1136
+ project: base10.project.toRgbString(),
1137
+ phantom: base10.phantom.toRgbString(),
1138
+ path: base10.path.toRgbString(),
1139
+ accent: base10.accent.toRgbString(),
1140
+ success: base10.success.toRgbString(),
1141
+ warning: base10.warning.toRgbString(),
1142
+ alert: base10.alert.toRgbString(),
1143
+ neutral: base10.neutral.toRgbString()
1144
+ },
1145
+ core: {
1146
+ background: {
1147
+ primary: base10.surface.toRgbString(),
1148
+ secondary: base10.surface.toRgbString(),
1149
+ ghost: base10.phantom.alpha(0.05).toRgbString(),
1150
+ tone: base10.phantom.desaturate(0.16).alpha(0.5).toRgbString(),
1151
+ selection: base10.phantom.alpha(0.1).toRgbString(),
1152
+ hover: base10.phantom.alpha(0.08).toRgbString(),
1153
+ brand: base10.project.rotate(-9).lighten(0.3).toRgbString(),
1154
+ brandSecondary: base10.accent.rotate(6).lighten(0.2).toRgbString(),
1155
+ success: base10.success.rotate(-21).lighten(0.65).toRgbString(),
1156
+ warning: base10.warning.rotate(18).lighten(0.55).toRgbString(),
1157
+ alert: base10.alert.rotate(18).lighten(0.55).toRgbString(),
1158
+ neutral: base10.neutral.rotate(-21).lighten(0.65).toRgbString()
1159
+ },
1160
+ divider: {
1161
+ divider: base10.phantom.alpha(0.15).toRgbString()
1162
+ },
1163
+ text: {
1164
+ primary: base10.content.toRgbString(),
1165
+ secondary: base10.content.alpha(0.75).toRgbString(),
1166
+ tertiary: base10.content.alpha(0.61).toRgbString(),
1167
+ brand: base10.project.toRgbString(),
1168
+ brandSecondary: base10.accent.toRgbString(),
1169
+ success: base10.success.toRgbString(),
1170
+ warning: base10.warning.toRgbString(),
1171
+ alert: base10.alert.rotate(-3).darken(0.1).toRgbString(),
1172
+ neutral: base10.neutral.toRgbString()
1173
+ },
1174
+ link: {
1175
+ link: base10.path.toRgbString(),
1176
+ linkHover: base10.path.alpha(0.7).toRgbString(),
1177
+ linkMinor: base10.path.rotate(-6).lighten(0.2).toRgbString(),
1178
+ linkMinorHover: base10.path.rotate(-6).lighten(0.2).alpha(0.7).toRgbString()
1179
+ }
1180
+ },
1181
+ control: {
1182
+ primary: {
1183
+ bg: base10.project.toRgbString(),
1184
+ bgHover: base10.project.rotate(3).darken(0.1).toRgbString(),
1185
+ bgPress: base10.project.rotate(-3).lighten(0.1).toRgbString(),
1186
+ bgDisabled: base10.surface.rotate(12).darken(0.2).toRgbString(),
1187
+ border: base10.project.toRgbString(),
1188
+ borderHover: base10.project.rotate(3).darken(0.1).toRgbString(),
1189
+ borderPress: base10.project.rotate(-3).lighten(0.1).toRgbString()
1190
+ },
1191
+ secondary: {
1192
+ bg: "transparent",
1193
+ bgHover: base10.project.rotate(-6).lighten(0.2).alpha(0.2).toRgbString(),
1194
+ bgPress: base10.project.rotate(-6).lighten(0.2).alpha(0.5).toRgbString(),
1195
+ border: base10.project.toRgbString(),
1196
+ borderHover: base10.project.rotate(3).darken(0.1).toRgbString(),
1197
+ borderPress: base10.project.rotate(3).darken(0.1).toRgbString()
1198
+ },
1199
+ default: {
1200
+ bg: base10.surface.rotate(33).darken(0.9).toRgbString(),
1201
+ bgHover: base10.surface.rotate(33).darken(0.95).toRgbString(),
1202
+ bgPress: base10.surface.rotate(33).darken(0.8).toRgbString(),
1203
+ border: base10.surface.rotate(33).darken(0.9).toRgbString(),
1204
+ borderHover: base10.surface.rotate(33).darken(0.95).toRgbString(),
1205
+ borderPress: base10.surface.rotate(33).darken(0.8).toRgbString()
1206
+ },
1207
+ input: {
1208
+ bg: base10.phantom.alpha(0.07).toRgbString(),
1209
+ bgHover: base10.phantom.alpha(0.1).toRgbString(),
1210
+ bgDisabled: base10.phantom.alpha(0.15).toRgbString(),
1211
+ border: "transparent",
1212
+ borderHover: base10.phantom.alpha(0.1).toRgbString(),
1213
+ borderDisabled: "transparent",
1214
+ text: base10.content.toRgbString(),
1215
+ textDisabled: base10.content.alpha(0.36).toRgbString(),
1216
+ placeholder: base10.content.alpha(0.61).toRgbString()
1217
+ },
1218
+ focus: {
1219
+ bg: base10.surface.toRgbString(),
1220
+ border: base10.project.toRgbString()
1221
+ },
1222
+ alert: {
1223
+ bg: "transparent",
1224
+ bgHover: base10.alert.rotate(9).lighten(0.3).alpha(0.2).toRgbString(),
1225
+ bgPress: base10.alert.rotate(9).lighten(0.3).alpha(0.5).toRgbString(),
1226
+ border: base10.alert.toRgbString(),
1227
+ borderHover: base10.alert.rotate(-3).darken(0.1).toRgbString(),
1228
+ borderPress: base10.alert.rotate(-3).darken(0.1).toRgbString()
1229
+ },
1230
+ check: {
1231
+ bg: base10.project.toRgbString(),
1232
+ bgHover: base10.project.rotate(3).darken(0.1).toRgbString(),
1233
+ bgDisabled: base10.phantom.alpha(0.2).toRgbString()
1234
+ },
1235
+ faint: {
1236
+ bg: base10.phantom.alpha(0.15).toRgbString(),
1237
+ bgHover: base10.phantom.alpha(0.2).toRgbString(),
1238
+ border: "transparent",
1239
+ borderHover: base10.phantom.alpha(0.15).toRgbString()
1240
+ },
1241
+ toggle: {
1242
+ bg: base10.phantom.alpha(0.15).toRgbString(),
1243
+ bgHover: base10.phantom.alpha(0.2).toRgbString()
1244
+ },
1245
+ text: {
1246
+ active: base10.content.lighten(1).toRgbString(),
1247
+ secondary: base10.project.toRgbString(),
1248
+ default: base10.content.lighten(1).toRgbString(),
1249
+ primary: base10.content.toRgbString(),
1250
+ disabled: base10.content.alpha(0.3).toRgbString(),
1251
+ faint: base10.content.lighten(1).toRgbString(),
1252
+ alert: base10.alert.toRgbString()
1253
+ }
1254
+ }
1255
+ }
1256
+ });
1257
+ var light2 = emailsLightScheme(base7);
1258
+
1259
+ // src/themes/emails/misc.ts
1260
+ var borderRadiusScale2 = {
1261
+ sm: "4px",
1262
+ md: "8px",
1263
+ lg: "12px",
1264
+ xl: "16px"
1265
+ };
1266
+ var misc2 = {
1267
+ borderRadiusScale: borderRadiusScale2,
1268
+ borderWidth: "2px",
1269
+ borderRadius: {
1270
+ /* for Autocomplet, Select, TextField, DatePicker, Pin */
1271
+ input: borderRadiusScale2.md,
1272
+ /* for Button, Upload */
1273
+ button: borderRadiusScale2.md,
1274
+ buttonIcon: borderRadiusScale2.md,
1275
+ /* Calendar, ContextMenu, Tooltip, Notification, Avatar (square type), */
1276
+ popup: borderRadiusScale2.md,
1277
+ checkbox: borderRadiusScale2.sm,
1278
+ tag: "18px"
1279
+ },
1280
+ minWidth: {
1281
+ button: "40px"
1282
+ }
1283
+ };
1284
+
1285
+ // src/themes/emails/scale.ts
1286
+ var typoScale2 = {
1287
+ fontSize: {
1288
+ $xs: "10px",
1289
+ $sm: "12px",
1290
+ $md: "14px",
1291
+ $lg: "16px",
1292
+ $xl: "18px",
1293
+ $2xl: "20px",
1294
+ $3xl: "24px",
1295
+ $4xl: "30px"
1296
+ },
1297
+ lineHeight: {
1298
+ $xs: "14px",
1299
+ $sm: "17px",
1300
+ $md: "20px",
1301
+ $lg: "22px",
1302
+ $xl: "25px",
1303
+ $2xl: "28px",
1304
+ $3xl: "32px",
1305
+ $4xl: "36px"
1306
+ }
1307
+ };
1308
+
1309
+ // src/themes/emails/typo.ts
1310
+ var typo2 = {
1311
+ fontFamily: `'GraphikLCWebUikit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
1312
+ Helvetica, Arial, sans-serif`,
1313
+ core: {
1314
+ strong: {
1315
+ fontSize: "36px",
1316
+ lineHeight: "40px"
1317
+ },
1318
+ h1: { fontSize: typoScale2.fontSize.$4xl, lineHeight: typoScale2.lineHeight.$4xl, fontWeight: 500 },
1319
+ h2: { fontSize: typoScale2.fontSize.$3xl, lineHeight: typoScale2.lineHeight.$3xl, fontWeight: 500 },
1320
+ h3: { fontSize: typoScale2.fontSize.$2xl, lineHeight: typoScale2.lineHeight.$2xl, fontWeight: 500 },
1321
+ h4: { fontSize: typoScale2.fontSize.$xl, lineHeight: typoScale2.lineHeight.$xl, fontWeight: 500 },
1322
+ bodyMd: { fontSize: typoScale2.fontSize.$md, lineHeight: typoScale2.lineHeight.$md },
1323
+ bodyMdAccent: {
1324
+ fontSize: typoScale2.fontSize.$md,
1325
+ lineHeight: typoScale2.lineHeight.$md,
1326
+ fontWeight: 500
1327
+ },
1328
+ bodyLg: {
1329
+ fontSize: typoScale2.fontSize.$lg,
1330
+ lineHeight: typoScale2.lineHeight.$md,
1331
+ fontWeight: 400
1332
+ },
1333
+ bodyLgAccent: {
1334
+ fontSize: typoScale2.fontSize.$lg,
1335
+ lineHeight: typoScale2.lineHeight.$md,
1336
+ fontWeight: 500
1337
+ },
1338
+ paragraph: { fontSize: typoScale2.fontSize.$md, lineHeight: typoScale2.lineHeight.$md },
1339
+ label: { fontSize: typoScale2.fontSize.$md, lineHeight: typoScale2.lineHeight.$md },
1340
+ minor: { fontSize: typoScale2.fontSize.$sm, lineHeight: typoScale2.lineHeight.$sm }
1341
+ },
1342
+ components: {
1343
+ button: {
1344
+ sm: { fontSize: typoScale2.fontSize.$sm, lineHeight: typoScale2.lineHeight.$sm, fontWeight: 500 },
1345
+ md: { fontSize: typoScale2.fontSize.$md, lineHeight: typoScale2.lineHeight.$md, fontWeight: 500 },
1346
+ lg: { fontSize: typoScale2.fontSize.$lg, lineHeight: typoScale2.lineHeight.$lg, fontWeight: 500 }
1347
+ },
1348
+ input: {
1349
+ sm: { fontSize: typoScale2.fontSize.$sm, lineHeight: typoScale2.lineHeight.$sm, fontWeight: 400 },
1350
+ md: { fontSize: typoScale2.fontSize.$md, lineHeight: typoScale2.lineHeight.$md, fontWeight: 400 },
1351
+ lg: { fontSize: typoScale2.fontSize.$lg, lineHeight: typoScale2.lineHeight.$lg, fontWeight: 400 }
1352
+ },
1353
+ tab: {
1354
+ sm: { fontSize: typoScale2.fontSize.$sm, lineHeight: typoScale2.lineHeight.$sm, fontWeight: 500 },
1355
+ md: { fontSize: typoScale2.fontSize.$md, lineHeight: typoScale2.lineHeight.$md, fontWeight: 500 },
1356
+ lg: { fontSize: typoScale2.fontSize.$lg, lineHeight: typoScale2.lineHeight.$lg, fontWeight: 500 }
1357
+ },
1358
+ check: {
1359
+ sm: { fontSize: typoScale2.fontSize.$sm, lineHeight: typoScale2.lineHeight.$sm, fontWeight: 400 },
1360
+ md: { fontSize: typoScale2.fontSize.$md, lineHeight: typoScale2.lineHeight.$md, fontWeight: 400 },
1361
+ lg: { fontSize: typoScale2.fontSize.$lg, lineHeight: typoScale2.lineHeight.$lg, fontWeight: 400 }
1362
+ },
1363
+ heading: {
1364
+ sm: {
1365
+ fontSize: typoScale2.fontSize.$xs,
1366
+ lineHeight: typoScale2.lineHeight.$xs,
1367
+ fontWeight: 400,
1368
+ textTransform: "uppercase"
1369
+ },
1370
+ md: {
1371
+ fontSize: typoScale2.fontSize.$sm,
1372
+ lineHeight: typoScale2.lineHeight.$sm,
1373
+ fontWeight: 400,
1374
+ textTransform: "uppercase"
1375
+ },
1376
+ lg: {
1377
+ fontSize: typoScale2.fontSize.$md,
1378
+ lineHeight: typoScale2.lineHeight.$md,
1379
+ fontWeight: 400,
1380
+ textTransform: "uppercase"
1381
+ }
1382
+ },
1383
+ label: {
1384
+ sm: {
1385
+ fontSize: typoScale2.fontSize.$xs,
1386
+ lineHeight: typoScale2.lineHeight.$xs,
1387
+ fontWeight: 400
1388
+ },
1389
+ md: { fontSize: typoScale2.fontSize.$sm, lineHeight: typoScale2.lineHeight.$sm, fontWeight: 400 },
1390
+ lg: { fontSize: typoScale2.fontSize.$md, lineHeight: typoScale2.lineHeight.$md, fontWeight: 400 }
1391
+ },
1392
+ fieldGroup: {
1393
+ sm: {
1394
+ fontSize: typoScale2.fontSize.$xs,
1395
+ lineHeight: typoScale2.lineHeight.$xs,
1396
+ fontWeight: 400
1397
+ },
1398
+ md: { fontSize: typoScale2.fontSize.$sm, lineHeight: typoScale2.lineHeight.$sm, fontWeight: 400 },
1399
+ lg: { fontSize: typoScale2.fontSize.$md, lineHeight: typoScale2.lineHeight.$md, fontWeight: 400 }
1400
+ }
1401
+ }
1402
+ };
1403
+
1404
+ // src/themes/emails/shadows.ts
1405
+ var shadows2 = shadowsDefault;
1406
+
1407
+ // src/themes/emails/emails.ts
1408
+ var emails = {
1409
+ ...light2,
1410
+ typo: typo2,
1411
+ misc: misc2,
1412
+ shadows: shadows2
1413
+ };
1414
+ var emailsDark = {
1415
+ ...emails,
1416
+ ...dark2
1417
+ };
1418
+ var emailsThemes = {
1419
+ light: emails,
1420
+ dark: emailsDark
1421
+ };
1422
+
1423
+ // src/themes/publisherV2/variants/light.ts
1424
+ import { colord as colord8 } from "colord";
1425
+ var base8 = {
1426
+ content: colord8({ h: 244, s: 8, l: 10 }),
1427
+ surface: colord8({ h: 240, s: 7, l: 97 }),
1428
+ project: colord8({ h: 255, s: 94, l: 60 }),
1429
+ phantom: colord8({ h: 252, s: 26, l: 30 }),
1430
+ path: colord8({ h: 258, s: 94, l: 50 }),
1431
+ accent: colord8({ h: 77, s: 90, l: 60 }),
1432
+ success: colord8({ h: 162, s: 80, l: 30 }),
1433
+ warning: colord8({ h: 19, s: 100, l: 40 }),
1434
+ alert: colord8({ h: 337, s: 100, l: 40 }),
1435
+ neutral: colord8({ h: 252, s: 25, l: 30 })
1436
+ };
1437
+ var publisherV2LightScheme = (base10) => ({
1438
+ colors: {
1439
+ base: {
1440
+ content: base10.content.toRgbString(),
1441
+ surface: base10.surface.toRgbString(),
1442
+ project: base10.project.toRgbString(),
1443
+ phantom: base10.phantom.toRgbString(),
1444
+ path: base10.path.toRgbString(),
1445
+ accent: base10.accent.toRgbString(),
1446
+ success: base10.success.toRgbString(),
1447
+ warning: base10.warning.toRgbString(),
1448
+ alert: base10.alert.toRgbString(),
1449
+ neutral: base10.neutral.toRgbString()
1450
+ },
1451
+ core: {
1452
+ background: {
1453
+ primary: base10.surface.toRgbString(),
1454
+ secondary: base10.surface.rotate(-3).lighten(0.03).toRgbString(),
1455
+ ghost: base10.phantom.alpha(0.05).toRgbString(),
1456
+ tone: base10.phantom.desaturate(0.08).alpha(0.5).toRgbString(),
1457
+ selection: base10.phantom.alpha(0.1).toRgbString(),
1458
+ hover: base10.phantom.alpha(0.08).toRgbString(),
1459
+ brand: base10.project.toRgbString(),
1460
+ brandSecondary: base10.accent.toRgbString(),
1461
+ /* status */
1462
+ success: base10.success.rotate(-19).lighten(0.6).toRgbString(),
1463
+ warning: base10.warning.rotate(15).lighten(0.5).toRgbString(),
1464
+ alert: base10.alert.rotate(-329).desaturate(0.12).lighten(0.5).toRgbString(),
1465
+ neutral: base10.neutral.rotate(-17).lighten(0.6).toRgbString()
1466
+ },
1467
+ divider: {
1468
+ divider: base10.phantom.alpha(0.15).toRgbString()
1469
+ },
1470
+ text: {
1471
+ primary: base10.content.toRgbString(),
1472
+ secondary: base10.content.alpha(0.7).toRgbString(),
1473
+ tertiary: base10.content.alpha(0.5).toRgbString(),
1474
+ brand: base10.project.toRgbString(),
1475
+ brandSecondary: base10.accent.toRgbString(),
1476
+ success: base10.success.toRgbString(),
1477
+ warning: base10.warning.toRgbString(),
1478
+ alert: base10.alert.toRgbString(),
1479
+ neutral: base10.neutral.toRgbString()
1480
+ },
1481
+ link: {
1482
+ link: base10.path.toRgbString(),
1483
+ linkHover: base10.path.alpha(0.7).toRgbString(),
1484
+ linkMinor: base10.path.rotate(-6).lighten(0.2).toRgbString(),
1485
+ linkMinorHover: base10.path.rotate(-6).lighten(0.2).alpha(0.7).toRgbString()
1486
+ }
1487
+ },
1488
+ control: {
1489
+ primary: {
1490
+ bg: base10.project.toRgbString(),
1491
+ bgHover: base10.project.rotate(3).darken(0.1).toRgbString(),
1492
+ bgPress: base10.project.rotate(-3).lighten(0.1).toRgbString(),
1493
+ bgDisabled: base10.surface.rotate(9).darken(0.17).toRgbString(),
1494
+ border: "transparent",
1495
+ borderHover: "transparent",
1496
+ borderPress: "transparent"
1497
+ },
1498
+ secondary: {
1499
+ bg: "transparent",
1500
+ bgHover: base10.project.rotate(-6).lighten(0.2).alpha(0.2).toRgbString(),
1501
+ bgPress: base10.project.rotate(-6).lighten(0.2).alpha(0.5).toRgbString(),
1502
+ border: base10.project.toRgbString(),
1503
+ borderHover: base10.project.rotate(3).darken(0.1).toRgbString(),
1504
+ borderPress: base10.project.rotate(3).darken(0.1).toRgbString()
1505
+ },
1506
+ tertiary: {
1507
+ bg: base10.phantom.alpha(0.07).toRgbString(),
1508
+ bgHover: base10.phantom.alpha(0.15).toRgbString(),
1509
+ bgPress: base10.phantom.alpha(0.25).toRgbString(),
1510
+ border: "transparent",
1511
+ borderHover: "transparent",
1512
+ borderPress: "transparent"
1513
+ },
1514
+ default: {
1515
+ bg: colord8({ h: 244, s: 8, l: 10 }).toRgbString(),
1516
+ bgHover: colord8({ h: 238, s: 8, l: 30 }).toRgbString(),
1517
+ bgPress: colord8({ h: 241, s: 8, l: 20 }).toRgbString(),
1518
+ border: "transparent",
1519
+ borderHover: "transparent",
1520
+ borderPress: "transparent"
1521
+ },
1522
+ input: {
1523
+ bg: "transparent",
1524
+ bgHover: base10.project.rotate(-6).lighten(0.2).alpha(0.1).toRgbString(),
1525
+ bgDisabled: base10.phantom.alpha(0.07).toRgbString(),
1526
+ border: base10.phantom.alpha(0.15).toRgbString(),
1527
+ borderHover: base10.phantom.alpha(0.25).toRgbString(),
1528
+ borderDisabled: "transparent",
1529
+ text: base10.content.toRgbString(),
1530
+ placeholder: base10.content.alpha(0.55).toRgbString(),
1531
+ textDisabled: base10.content.alpha(0.3).toRgbString()
1532
+ },
1533
+ focus: {
1534
+ bg: "transparent",
1535
+ border: base10.project.toRgbString()
1536
+ },
1537
+ alert: {
1538
+ bg: "transparent",
1539
+ bgHover: base10.alert.rotate(9).lighten(0.3).alpha(0.2).toRgbString(),
1540
+ bgPress: base10.alert.rotate(9).lighten(0.3).alpha(0.5).toRgbString(),
1541
+ border: base10.alert.toRgbString(),
1542
+ borderHover: base10.alert.rotate(-3).darken(0.1).toRgbString(),
1543
+ borderPress: base10.alert.rotate(-3).darken(0.1).toRgbString()
1544
+ },
1545
+ check: {
1546
+ bg: base10.project.darken(0.6).toRgbString(),
1547
+ bgHover: base10.project.rotate(3).darken(0.51).toRgbString(),
1548
+ bgDisabled: base10.phantom.alpha(0.2).toRgbString()
1549
+ },
1550
+ faint: {
1551
+ bg: base10.phantom.alpha(0.15).toRgbString(),
1552
+ bgHover: base10.phantom.alpha(0.2).toRgbString(),
1553
+ border: "transparent",
1554
+ borderHover: base10.phantom.alpha(0.15).toRgbString()
1555
+ },
1556
+ toggle: {
1557
+ bg: base10.phantom.alpha(0.15).toRgbString(),
1558
+ bgHover: base10.phantom.alpha(0.2).toRgbString()
1559
+ },
1560
+ text: {
1561
+ active: base10.content.lighten(1).toRgbString(),
1562
+ secondary: base10.project.toRgbString(),
1563
+ default: base10.content.lighten(1).toRgbString(),
1564
+ primary: base10.content.toRgbString(),
1565
+ tertiary: base10.content.toRgbString(),
1566
+ disabled: base10.content.alpha(0.3).toRgbString(),
1567
+ faint: base10.content.lighten(1).toRgbString(),
1568
+ alert: base10.alert.toRgbString()
1569
+ }
1570
+ }
1571
+ }
1572
+ });
1573
+ var light3 = publisherV2LightScheme(base8);
1574
+
1575
+ // src/themes/publisherV2/variants/dark.ts
1576
+ import { colord as colord9 } from "colord";
1577
+ var base9 = {
1578
+ content: colord9({ h: 0, s: 0, l: 100 }),
1579
+ surface: colord9({ h: 240, s: 8, l: 20 }),
1580
+ project: colord9({ h: 255, s: 94, l: 60 }),
1581
+ phantom: colord9({ h: 0, s: 0, l: 100 }),
1582
+ path: colord9({ h: 252, s: 94, l: 70 }),
1583
+ accent: colord9({ h: 77, s: 90, l: 60 }),
1584
+ success: colord9({ h: 147, s: 80, l: 80 }),
1585
+ warning: colord9({ h: 31, s: 100, l: 80 }),
1586
+ alert: colord9({ h: 345, s: 100, l: 70 }),
1587
+ neutral: colord9({ h: 237, s: 26, l: 80 })
1588
+ };
1589
+ var publisherV2DarkScheme = (base10) => ({
1590
+ colors: {
1591
+ base: {
1592
+ content: base10.content.toRgbString(),
1593
+ surface: base10.surface.toRgbString(),
1594
+ project: base10.project.toRgbString(),
1595
+ phantom: base10.phantom.toRgbString(),
1596
+ path: base10.path.toRgbString(),
1597
+ accent: base10.accent.toRgbString(),
1598
+ success: base10.success.toRgbString(),
1599
+ warning: base10.warning.toRgbString(),
1600
+ alert: base10.alert.toRgbString(),
1601
+ neutral: base10.neutral.toRgbString()
1602
+ },
1603
+ core: {
1604
+ background: {
1605
+ primary: base10.surface.saturate(0.01).darken(0.06).toRgbString(),
1606
+ secondary: base10.surface.darken(0.15).toRgbString(),
1607
+ ghost: base10.phantom.alpha(0.05).toRgbString(),
1608
+ tone: base10.project.rotate(-3).lighten(0.1).alpha(0.1).toRgbString(),
1609
+ selection: base10.phantom.alpha(0.15).toRgbString(),
1610
+ hover: base10.phantom.alpha(0.05).toRgbString(),
1611
+ brand: base10.project.rotate(-3).lighten(0.1).toRgbString(),
1612
+ brandSecondary: base10.accent.toRgbString(),
1613
+ /* status */
1614
+ success: base10.surface.toRgbString(),
1615
+ warning: base10.surface.toRgbString(),
1616
+ alert: base10.surface.toRgbString(),
1617
+ neutral: base10.surface.toRgbString()
1618
+ },
1619
+ divider: {
1620
+ divider: base10.phantom.alpha(0.15).toRgbString()
1621
+ },
1622
+ text: {
1623
+ primary: base10.content.toRgbString(),
1624
+ secondary: base10.content.alpha(0.7).toRgbString(),
1625
+ tertiary: base10.content.alpha(0.5).toRgbString(),
1626
+ brand: base10.project.rotate(-3).lighten(0.1).toRgbString(),
1627
+ brandSecondary: base10.accent.toRgbString(),
1628
+ success: base10.success.toRgbString(),
1629
+ warning: base10.warning.toRgbString(),
1630
+ alert: base10.alert.toRgbString(),
1631
+ neutral: base10.neutral.toRgbString()
1632
+ },
1633
+ link: {
1634
+ link: base10.path.toRgbString(),
1635
+ linkHover: base10.path.alpha(0.7).toRgbString(),
1636
+ linkMinor: base10.path.rotate(-6).lighten(0.2).toRgbString(),
1637
+ linkMinorHover: base10.path.rotate(-6).lighten(0.2).alpha(0.7).toRgbString()
1638
+ }
1639
+ },
1640
+ control: {
1641
+ primary: {
1642
+ bg: base10.project.toRgbString(),
1643
+ bgHover: base10.project.rotate(3).darken(0.1).toRgbString(),
1644
+ bgPress: base10.project.rotate(-3).lighten(0.1).toRgbString(),
1645
+ bgDisabled: base10.phantom.alpha(0.1).toRgbString(),
1646
+ border: "transparent",
1647
+ borderHover: "transparent",
1648
+ borderPress: "transparent"
1649
+ },
1650
+ secondary: {
1651
+ bg: "transparent",
1652
+ bgHover: base10.project.rotate(-3).lighten(0.1).alpha(0.1).toRgbString(),
1653
+ bgPress: base10.project.rotate(-3).lighten(0.1).alpha(0.3).toRgbString(),
1654
+ border: base10.project.rotate(-3).lighten(0.1).toRgbString(),
1655
+ borderHover: base10.project.toRgbString(),
1656
+ borderPress: base10.project.toRgbString()
1657
+ },
1658
+ tertiary: {
1659
+ bg: base10.phantom.alpha(0.15).toRgbString(),
1660
+ bgHover: base10.phantom.alpha(0.25).toRgbString(),
1661
+ bgPress: base10.phantom.alpha(0.35).toRgbString(),
1662
+ border: "transparent",
1663
+ borderHover: "transparent",
1664
+ borderPress: "transparent"
1665
+ },
1666
+ default: {
1667
+ bg: colord9({ h: 214, s: 8, l: 97 }).toRgbString(),
1668
+ bgHover: colord9({ h: 220, s: 8, l: 90 }).toRgbString(),
1669
+ bgPress: colord9({ h: 217, s: 8, l: 95 }).toRgbString(),
1670
+ border: "transparent",
1671
+ borderHover: "transparent",
1672
+ borderPress: "transparent"
1673
+ },
1674
+ input: {
1675
+ bg: "transparent",
1676
+ bgHover: base10.project.rotate(-3).lighten(0.1).alpha(0.1).toRgbString(),
1677
+ bgDisabled: base10.phantom.alpha(0.1).toRgbString(),
1678
+ border: base10.phantom.alpha(0.3).toRgbString(),
1679
+ borderHover: base10.phantom.alpha(0.4).toRgbString(),
1680
+ borderDisabled: base10.phantom.alpha(0.1).toRgbString(),
1681
+ text: base10.content.toRgbString(),
1682
+ placeholder: base10.content.alpha(0.55).toRgbString(),
1683
+ textDisabled: base10.content.alpha(0.15).toRgbString()
1684
+ },
1685
+ focus: {
1686
+ bg: base10.surface.toRgbString(),
1687
+ border: base10.project.rotate(-3).lighten(0.1).toRgbString()
1688
+ },
1689
+ alert: {
1690
+ bg: "transparent",
1691
+ bgHover: base10.alert.rotate(3).lighten(0.1).alpha(0.1).toRgbString(),
1692
+ bgPress: base10.alert.rotate(3).lighten(0.1).alpha(0.2).toRgbString(),
1693
+ border: base10.alert.toRgbString(),
1694
+ borderHover: base10.alert.rotate(-3).darken(0.1).toRgbString(),
1695
+ borderPress: base10.alert.rotate(-3).darken(0.1).toRgbString()
1696
+ },
1697
+ check: {
1698
+ bg: base10.project.toRgbString(),
1699
+ bgHover: base10.project.rotate(3).darken(0.1).toRgbString(),
1700
+ bgDisabled: base10.phantom.alpha(0.2).toRgbString()
1701
+ },
1702
+ faint: {
1703
+ bg: base10.phantom.alpha(0.15).toRgbString(),
1704
+ bgHover: base10.phantom.alpha(0.2).toRgbString(),
1705
+ border: "transparent",
1706
+ borderHover: base10.phantom.alpha(0.12).toRgbString()
1707
+ },
1708
+ toggle: {
1709
+ bg: base10.phantom.alpha(0.15).toRgbString(),
1710
+ bgHover: base10.phantom.alpha(0.2).toRgbString()
1711
+ },
1712
+ text: {
1713
+ active: base10.content.toRgbString(),
1714
+ secondary: base10.project.rotate(-3).lighten(0.1).toRgbString(),
1715
+ tertiary: base10.content.toRgbString(),
1716
+ default: base10.content.darken(0.99).toRgbString(),
1717
+ primary: base10.content.toRgbString(),
1718
+ disabled: base10.content.alpha(0.15).toRgbString(),
1719
+ faint: base10.content.toRgbString(),
1720
+ alert: base10.alert.toRgbString()
1721
+ }
1722
+ }
1723
+ }
1724
+ });
1725
+ var dark3 = publisherV2DarkScheme(base9);
1726
+
1727
+ // src/themes/publisherV2/misc.ts
1728
+ var borderRadiusScale3 = {
1729
+ sm: "4px",
1730
+ md: "8px",
1731
+ lg: "12px",
1732
+ xl: "16px"
1733
+ };
1734
+ var misc3 = {
1735
+ borderRadiusScale: borderRadiusScale3,
1736
+ borderWidth: "1px",
1737
+ borderRadius: {
1738
+ /* for Autocomplete, Select, TextField, DatePicker, Pin */
1739
+ input: borderRadiusScale3.md,
1740
+ /* for Button, Upload */
1741
+ button: borderRadiusScale3.md,
1742
+ buttonIcon: borderRadiusScale3.md,
1743
+ /* Calendar, ContextMenu, Tooltip, Notification, Avatar (square type), */
1744
+ popup: borderRadiusScale3.md,
1745
+ checkbox: borderRadiusScale3.sm,
1746
+ tag: borderRadiusScale3.md
1747
+ },
1748
+ minWidth: {
1749
+ button: "40px"
1750
+ }
1751
+ };
1752
+
1753
+ // src/themes/publisherV2/typo.ts
1754
+ var graphikLCWeb = '"GraphikLCWebUikit", -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica", Arial, sans-serif';
1755
+ var typo3 = {
1756
+ fontFamily: graphikLCWeb,
1757
+ core: {
1758
+ h1: { fontSize: "56px", lineHeight: "58px", fontWeight: 500, letterSpacing: "-0.02em" },
1759
+ h2: { fontSize: "48px", lineHeight: "50px", fontWeight: 500 },
1760
+ h3: { fontSize: "32px", lineHeight: "38px", fontWeight: 500 },
1761
+ h4: { fontSize: "24px", lineHeight: "28px", fontWeight: 500 },
1762
+ strong: { fontSize: "72px", lineHeight: "72px", fontWeight: 500 },
1763
+ bodyLgAccent: {
1764
+ fontSize: "56px",
1765
+ lineHeight: "64px",
1766
+ fontWeight: 500
1767
+ },
1768
+ bodyLg: {
1769
+ fontSize: "40px",
1770
+ lineHeight: "48px",
1771
+ fontWeight: 500
1772
+ },
1773
+ bodyMd: {
1774
+ fontSize: "16px",
1775
+ lineHeight: "24px",
1776
+ fontWeight: 400
1777
+ },
1778
+ bodyMdAccent: {
1779
+ fontSize: "20px",
1780
+ lineHeight: "28px",
1781
+ fontWeight: 500
1782
+ },
1783
+ paragraph: { fontSize: "16px", lineHeight: "24px", fontWeight: 400 },
1784
+ label: {
1785
+ fontSize: "16px",
1786
+ lineHeight: "20px",
1787
+ letterSpacing: "0.5px",
1788
+ fontWeight: 500
1789
+ },
1790
+ minor: { fontSize: "14px", lineHeight: "18px", fontWeight: 400 }
1791
+ },
1792
+ components: {
1793
+ button: {
1794
+ sm: {
1795
+ fontSize: "12px",
1796
+ lineHeight: "17px",
1797
+ fontWeight: 500,
1798
+ letterSpacing: "0.5px"
1799
+ },
1800
+ md: {
1801
+ fontSize: "14px",
1802
+ lineHeight: "20px",
1803
+ fontWeight: 500,
1804
+ letterSpacing: "0.5px"
1805
+ },
1806
+ lg: {
1807
+ fontSize: "16px",
1808
+ lineHeight: "22px",
1809
+ fontWeight: 500,
1810
+ letterSpacing: "0.5px"
1811
+ },
1812
+ xl: {
1813
+ fontSize: "18px",
1814
+ lineHeight: "24px",
1815
+ fontWeight: 500,
1816
+ letterSpacing: "0.5px"
1817
+ }
1818
+ },
1819
+ input: {
1820
+ sm: { fontSize: "12px", lineHeight: "17px", fontWeight: 400 },
1821
+ md: { fontSize: "14px", lineHeight: "20px", fontWeight: 400 },
1822
+ lg: { fontSize: "16px", lineHeight: "22px", fontWeight: 400 },
1823
+ xl: { fontSize: "18px", lineHeight: "24px", fontWeight: 400 }
1824
+ },
1825
+ tab: {
1826
+ sm: { fontSize: "12px", lineHeight: "17px", fontWeight: 500 },
1827
+ md: { fontSize: "14px", lineHeight: "20px", fontWeight: 500 },
1828
+ lg: { fontSize: "16px", lineHeight: "22px", fontWeight: 500 },
1829
+ xl: { fontSize: "18px", lineHeight: "24px", fontWeight: 500 }
1830
+ },
1831
+ check: {
1832
+ sm: { fontSize: "12px", lineHeight: "17px", fontWeight: 400 },
1833
+ md: { fontSize: "14px", lineHeight: "20px", fontWeight: 400 },
1834
+ lg: { fontSize: "16px", lineHeight: "22px", fontWeight: 400 },
1835
+ xl: { fontSize: "18px", lineHeight: "24px", fontWeight: 400 }
1836
+ },
1837
+ heading: {
1838
+ sm: {
1839
+ fontSize: "10px",
1840
+ lineHeight: "14px",
1841
+ fontWeight: 500,
1842
+ letterSpacing: "1px",
1843
+ textTransform: "uppercase"
1844
+ },
1845
+ md: {
1846
+ fontSize: "12px",
1847
+ lineHeight: "17px",
1848
+ fontWeight: 500,
1849
+ letterSpacing: "1px",
1850
+ textTransform: "uppercase"
1851
+ },
1852
+ lg: {
1853
+ fontSize: "14px",
1854
+ lineHeight: "20px",
1855
+ fontWeight: 500,
1856
+ letterSpacing: "1px",
1857
+ textTransform: "uppercase"
1858
+ },
1859
+ xl: {
1860
+ fontSize: "16px",
1861
+ lineHeight: "24px",
1862
+ fontWeight: 500,
1863
+ letterSpacing: "1px",
1864
+ textTransform: "uppercase"
1865
+ }
1866
+ },
1867
+ label: {
1868
+ sm: { fontSize: "10px", lineHeight: "14px", fontWeight: 400 },
1869
+ md: { fontSize: "12px", lineHeight: "17px", fontWeight: 400 },
1870
+ lg: { fontSize: "14px", lineHeight: "20px", fontWeight: 400 },
1871
+ xl: { fontSize: "16px", lineHeight: "24px", fontWeight: 400 }
1872
+ }
1873
+ }
1874
+ };
1875
+
1876
+ // src/themes/publisherV2/shadows.ts
1877
+ var shadows3 = {
1878
+ active: "0px 1px 2px rgba(7, 7, 8, 0.2), 0px 1px 3px 1px rgba(7, 7, 8, 0.1)",
1879
+ surface: "0px 1px 2px rgba(7, 7, 8, 0.2), 0px 2px 6px 2px rgba(7, 7, 8, 0.1)",
1880
+ surfaceHover: "0px 4px 8px 3px rgba(7, 7, 8, 0.1), 0px 1px 3px rgba(7, 7, 8, 0.2)",
1881
+ popover: "0px 2px 25px 0px rgba(7, 7, 8, 0.15)",
1882
+ modal: "0px 4px 50px 0px rgba(7, 7, 8, 0.15)"
1883
+ };
1884
+
1885
+ // src/themes/publisherV2/publisherV2.ts
1886
+ var publisherV2 = {
1887
+ ...light3,
1888
+ typo: typo3,
1889
+ misc: misc3,
1890
+ shadows: shadows3,
1891
+ globalStyle: "publisherV2"
1892
+ };
1893
+ var publisherV2Dark = {
1894
+ ...dark3,
1895
+ typo: typo3,
1896
+ misc: misc3,
1897
+ shadows: shadows3,
1898
+ globalStyle: "publisherV2"
1899
+ };
1900
+ var publisherV2Themes = {
1901
+ light: publisherV2,
1902
+ dark: publisherV2Dark
1903
+ };
1904
+
1905
+ // src/themes/baseColors.ts
1906
+ var themesBaseColorsArray = [
1907
+ { theme: "publisherV2", baseColors: base8 },
1908
+ { theme: "publisherV2Dark", baseColors: base9 },
1909
+ { theme: "paystation4", baseColors: base2 },
1910
+ { theme: "paystation4Dark", baseColors: base },
1911
+ { theme: "paystation4Take2", baseColors: base3 },
1912
+ { theme: "paystation4Gaijin", baseColors: base4 },
1913
+ { theme: "paystation4Nexters", baseColors: base5 },
1914
+ { theme: "emails", baseColors: base7 },
1915
+ { theme: "emailsDark", baseColors: base6 }
1916
+ ];
1917
+ var themesBaseColors = {
1918
+ publisherV2: base8,
1919
+ publisherV2Dark: base9,
1920
+ paystation4: base2,
1921
+ paystation4Dark: base,
1922
+ paystation4Take2: base3,
1923
+ paystation4Gaijin: base4,
1924
+ paystation4Nexters: base5,
1925
+ emails: base7,
1926
+ emailsDark: base6
1927
+ };
1928
+ var themesColorsScheme = {
1929
+ publisherV2: publisherV2LightScheme,
1930
+ publisherV2Dark: publisherV2DarkScheme,
1931
+ paystation4: ps4LightScheme,
1932
+ paystation4Dark: ps4DarkScheme,
1933
+ paystation4Take2: ps4Take2Scheme,
1934
+ paystation4Gaijin: ps4GaijinScheme,
1935
+ paystation4Nexters: ps4NextersScheme,
1936
+ emails: emailsLightScheme,
1937
+ emailsDark: emailsDarkScheme
1938
+ };
1939
+
1940
+ // src/themes/index.ts
1941
+ var themes = {
1942
+ paystation4,
1943
+ paystation4Nexters,
1944
+ paystation4Gaijin,
1945
+ paystation4Take2,
1946
+ paystation4Dark,
1947
+ emails,
1948
+ emailsDark,
1949
+ publisherV2,
1950
+ publisherV2Dark
1951
+ };
1952
+
1953
+ // src/palettes/primaryPalette.ts
1954
+ var primaryPalette = {
1955
+ gray: {
1956
+ white: { h: 0, s: 0, l: 100 },
1957
+ 25: { h: 217, s: 8, l: 97 },
1958
+ 50: { h: 218, s: 8, l: 95 },
1959
+ 100: { h: 220, s: 8, l: 90 },
1960
+ 200: { h: 223, s: 8, l: 80 },
1961
+ 300: { h: 226, s: 8, l: 70 },
1962
+ 400: { h: 229, s: 8, l: 60 },
1963
+ 500: { h: 232, s: 8, l: 50 },
1964
+ 600: { h: 235, s: 8, l: 40 },
1965
+ 700: { h: 238, s: 8, l: 30 },
1966
+ 800: { h: 241, s: 8, l: 20 },
1967
+ 900: { h: 244, s: 8, l: 10 },
1968
+ 950: { h: 245, s: 8, l: 5 },
1969
+ dark: { h: 246, s: 8, l: 3 }
1970
+ },
1971
+ magenta: {
1972
+ 50: { h: 353, s: 100, l: 95 },
1973
+ 100: { h: 351, s: 100, l: 90 },
1974
+ 200: { h: 348, s: 100, l: 80 },
1975
+ 300: { h: 345, s: 100, l: 70 },
1976
+ 400: { h: 342, s: 100, l: 60 },
1977
+ 500: { h: 339, s: 100, l: 50 },
1978
+ 600: { h: 336, s: 100, l: 40 },
1979
+ 700: { h: 333, s: 100, l: 30 },
1980
+ 800: { h: 330, s: 100, l: 20 },
1981
+ 900: { h: 327, s: 100, l: 10 },
1982
+ 950: { h: 326, s: 100, l: 5 }
1983
+ },
1984
+ red: {
1985
+ 50: { h: 11, s: 90, l: 95 },
1986
+ 100: { h: 9, s: 90, l: 90 },
1987
+ 200: { h: 6, s: 90, l: 80 },
1988
+ 300: { h: 3, s: 90, l: 70 },
1989
+ 400: { h: 360, s: 90, l: 60 },
1990
+ 500: { h: 357, s: 90, l: 50 },
1991
+ 600: { h: 354, s: 90, l: 40 },
1992
+ 700: { h: 351, s: 90, l: 30 },
1993
+ 800: { h: 348, s: 90, l: 20 },
1994
+ 900: { h: 345, s: 90, l: 10 }
1995
+ },
1996
+ orange: {
1997
+ 50: { h: 36, s: 100, l: 95 },
1998
+ 100: { h: 34, s: 100, l: 90 },
1999
+ 200: { h: 31, s: 100, l: 80 },
2000
+ 300: { h: 28, s: 100, l: 70 },
2001
+ 400: { h: 25, s: 100, l: 60 },
2002
+ 500: { h: 22, s: 100, l: 50 },
2003
+ 600: { h: 19, s: 100, l: 40 },
2004
+ 700: { h: 16, s: 100, l: 30 },
2005
+ 800: { h: 13, s: 100, l: 20 },
2006
+ 900: { h: 10, s: 100, l: 10 }
2007
+ },
2008
+ yellow: {
2009
+ 50: { h: 54, s: 100, l: 95 },
2010
+ 100: { h: 52, s: 100, l: 90 },
2011
+ 200: { h: 49, s: 100, l: 80 },
2012
+ 300: { h: 46, s: 100, l: 70 },
2013
+ 400: { h: 43, s: 100, l: 60 },
2014
+ 500: { h: 40, s: 100, l: 50 },
2015
+ 600: { h: 37, s: 100, l: 40 },
2016
+ 700: { h: 34, s: 100, l: 30 },
2017
+ 800: { h: 31, s: 100, l: 20 },
2018
+ 900: { h: 28, s: 100, l: 10 },
2019
+ 950: { h: 27, s: 100, l: 5 }
2020
+ },
2021
+ acidGreen: {
2022
+ 50: { h: 66, s: 90, l: 95 },
2023
+ 100: { h: 68, s: 90, l: 90 },
2024
+ 200: { h: 71, s: 90, l: 80 },
2025
+ 300: { h: 74, s: 90, l: 70 },
2026
+ 400: { h: 77, s: 90, l: 60 },
2027
+ 500: { h: 80, s: 90, l: 50 },
2028
+ 600: { h: 83, s: 90, l: 40 },
2029
+ 700: { h: 86, s: 90, l: 30 },
2030
+ 800: { h: 89, s: 90, l: 20 },
2031
+ 900: { h: 92, s: 90, l: 10 }
2032
+ },
2033
+ green: {
2034
+ 50: { h: 142, s: 80, l: 95 },
2035
+ 100: { h: 144, s: 80, l: 90 },
2036
+ 200: { h: 147, s: 80, l: 80 },
2037
+ 300: { h: 150, s: 80, l: 70 },
2038
+ 400: { h: 153, s: 80, l: 60 },
2039
+ 500: { h: 156, s: 80, l: 50 },
2040
+ 600: { h: 159, s: 80, l: 40 },
2041
+ 700: { h: 162, s: 80, l: 30 },
2042
+ 800: { h: 165, s: 80, l: 20 },
2043
+ 900: { h: 168, s: 80, l: 10 },
2044
+ 950: { h: 169, s: 80, l: 5 }
2045
+ },
2046
+ cyan: {
2047
+ 50: { h: 171, s: 100, l: 95 },
2048
+ 100: { h: 174, s: 100, l: 90 },
2049
+ 200: { h: 177, s: 100, l: 80 },
2050
+ 300: { h: 180, s: 100, l: 70 },
2051
+ 400: { h: 183, s: 100, l: 60 },
2052
+ 500: { h: 186, s: 100, l: 50 },
2053
+ 600: { h: 189, s: 100, l: 40 },
2054
+ 700: { h: 192, s: 100, l: 30 },
2055
+ 800: { h: 195, s: 100, l: 20 },
2056
+ 900: { h: 198, s: 100, l: 10 }
2057
+ },
2058
+ neonPink: {
2059
+ 50: { h: 296, s: 100, l: 95 },
2060
+ 100: { h: 298, s: 100, l: 90 },
2061
+ 200: { h: 301, s: 100, l: 80 },
2062
+ 300: { h: 304, s: 100, l: 70 },
2063
+ 400: { h: 307, s: 100, l: 60 },
2064
+ 500: { h: 310, s: 100, l: 50 },
2065
+ 600: { h: 313, s: 100, l: 40 },
2066
+ 700: { h: 316, s: 100, l: 30 },
2067
+ 800: { h: 319, s: 100, l: 20 },
2068
+ 900: { h: 322, s: 100, l: 10 }
2069
+ },
2070
+ marine: {
2071
+ 50: { h: 226, s: 90, l: 95 },
2072
+ 100: { h: 228, s: 90, l: 90 },
2073
+ 200: { h: 231, s: 90, l: 80 },
2074
+ 300: { h: 234, s: 90, l: 70 },
2075
+ 400: { h: 237, s: 90, l: 60 },
2076
+ 500: { h: 240, s: 90, l: 50 },
2077
+ 600: { h: 243, s: 90, l: 40 },
2078
+ 700: { h: 246, s: 90, l: 30 },
2079
+ 800: { h: 249, s: 90, l: 20 },
2080
+ 900: { h: 252, s: 90, l: 10 }
2081
+ },
2082
+ purple: {
2083
+ 50: { h: 244, s: 94, l: 95 },
2084
+ 100: { h: 246, s: 94, l: 90 },
2085
+ 200: { h: 249, s: 94, l: 80 },
2086
+ 300: { h: 252, s: 94, l: 70 },
2087
+ 400: { h: 255, s: 94, l: 60 },
2088
+ 500: { h: 258, s: 94, l: 50 },
2089
+ 600: { h: 261, s: 94, l: 40 },
2090
+ 700: { h: 264, s: 94, l: 30 },
2091
+ 800: { h: 267, s: 94, l: 20 },
2092
+ 900: { h: 270, s: 94, l: 10 }
2093
+ },
2094
+ paleBlue: {
2095
+ 50: { h: 232, s: 26, l: 95 },
2096
+ 100: { h: 234, s: 26, l: 90 },
2097
+ 200: { h: 237, s: 26, l: 80 },
2098
+ 300: { h: 240, s: 26, l: 70 },
2099
+ 400: { h: 243, s: 26, l: 60 },
2100
+ 500: { h: 246, s: 26, l: 50 },
2101
+ 600: { h: 249, s: 26, l: 40 },
2102
+ 700: { h: 252, s: 26, l: 30 },
2103
+ 800: { h: 256, s: 26, l: 20 },
2104
+ 850: { h: 256, s: 26, l: 15 },
2105
+ 900: { h: 258, s: 26, l: 10 },
2106
+ 950: { h: 259, s: 26, l: 5 }
2107
+ }
2108
+ };
2109
+
2110
+ // src/palettes/index.ts
2111
+ var palettes = {
2112
+ primaryPalette
2113
+ };
2114
+
2115
+ // src/generators/themeGenerator.ts
2116
+ import { colord as colord10 } from "colord";
2117
+ import merge from "lodash.merge";
2118
+ var bColorsMap = [
2119
+ "content",
2120
+ "surface",
2121
+ "project",
2122
+ "accent",
2123
+ "phantom",
2124
+ "path",
2125
+ "success",
2126
+ "warning",
2127
+ "alert",
2128
+ "neutral"
2129
+ ];
2130
+ var generateWithScheme = ({ schemeName, baseColors, parentTheme }) => {
2131
+ const scheme = themesColorsScheme[schemeName] || themesColorsScheme.paystation4;
2132
+ const base10 = themesBaseColors[schemeName] || themesBaseColors.paystation4;
2133
+ if (baseColors) {
2134
+ bColorsMap.map((value) => {
2135
+ base10[value] = colord10(baseColors[value]);
2136
+ });
2137
+ }
2138
+ return merge({}, parentTheme, scheme(base10));
2139
+ };
2140
+ var themeGenerator = (props) => {
2141
+ const { baseColors, customParams } = props;
2142
+ const schemeName = props.schemeName || "paystation4";
2143
+ const parentTheme = props.parentTheme || themes[schemeName] || {};
2144
+ let generateTheme = { ...parentTheme };
2145
+ if (schemeName && baseColors) {
2146
+ generateTheme = generateWithScheme({ schemeName, baseColors, parentTheme });
2147
+ }
2148
+ if (customParams) {
2149
+ const generateColors = { ...generateTheme.colors };
2150
+ const generateTypo = { ...generateTheme.typo };
2151
+ const generateMisc = { ...generateTheme.misc };
2152
+ generateTheme.colors = merge({}, generateColors, customParams.colors);
2153
+ generateTheme.typo = merge({}, generateTypo, customParams.typo);
2154
+ generateTheme.misc = merge({}, generateMisc, customParams.misc);
2155
+ }
2156
+ return generateTheme;
2157
+ };
2158
+ export {
2159
+ emails,
2160
+ emailsDark,
2161
+ emailsThemes,
2162
+ generateWithScheme,
2163
+ palettes,
2164
+ paystation4,
2165
+ paystation4Dark,
2166
+ paystation4Gaijin,
2167
+ paystation4Nexters,
2168
+ paystation4Take2,
2169
+ paystation4Themes,
2170
+ primaryPalette,
2171
+ publisherV2,
2172
+ publisherV2Dark,
2173
+ publisherV2Themes,
2174
+ themeGenerator,
2175
+ themes,
2176
+ themesBaseColors,
2177
+ themesBaseColorsArray,
2178
+ themesColorsScheme
2179
+ };
2180
+ //# sourceMappingURL=index.mjs.map