@xsolla/xui-core 0.227.0 → 0.229.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/index.d.mts CHANGED
@@ -477,8 +477,12 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
477
477
  textCompact: string;
478
478
  };
479
479
  rarity: {
480
- bg: string;
481
- text: string;
480
+ common: string;
481
+ uncommon: string;
482
+ rare: string;
483
+ epic: string;
484
+ legendary: string;
485
+ content: string;
482
486
  };
483
487
  name: {
484
488
  bg: string;
@@ -917,8 +921,12 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
917
921
  textCompact: string;
918
922
  };
919
923
  rarity: {
920
- bg: string;
921
- text: string;
924
+ common: string;
925
+ uncommon: string;
926
+ rare: string;
927
+ epic: string;
928
+ legendary: string;
929
+ content: string;
922
930
  };
923
931
  name: {
924
932
  bg: string;
@@ -1357,8 +1365,12 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
1357
1365
  textCompact: string;
1358
1366
  };
1359
1367
  rarity: {
1360
- bg: string;
1361
- text: string;
1368
+ common: string;
1369
+ uncommon: string;
1370
+ rare: string;
1371
+ epic: string;
1372
+ legendary: string;
1373
+ content: string;
1362
1374
  };
1363
1375
  name: {
1364
1376
  bg: string;
@@ -1797,8 +1809,12 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
1797
1809
  textCompact: string;
1798
1810
  };
1799
1811
  rarity: {
1800
- bg: string;
1801
- text: string;
1812
+ common: string;
1813
+ uncommon: string;
1814
+ rare: string;
1815
+ epic: string;
1816
+ legendary: string;
1817
+ content: string;
1802
1818
  };
1803
1819
  name: {
1804
1820
  bg: string;
@@ -2237,8 +2253,12 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
2237
2253
  textCompact: string;
2238
2254
  };
2239
2255
  rarity: {
2240
- bg: string;
2241
- text: string;
2256
+ common: string;
2257
+ uncommon: string;
2258
+ rare: string;
2259
+ epic: string;
2260
+ legendary: string;
2261
+ content: string;
2242
2262
  };
2243
2263
  name: {
2244
2264
  bg: string;
@@ -2677,8 +2697,12 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
2677
2697
  textCompact: string;
2678
2698
  };
2679
2699
  rarity: {
2680
- bg: string;
2681
- text: string;
2700
+ common: string;
2701
+ uncommon: string;
2702
+ rare: string;
2703
+ epic: string;
2704
+ legendary: string;
2705
+ content: string;
2682
2706
  };
2683
2707
  name: {
2684
2708
  bg: string;
@@ -3117,8 +3141,12 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
3117
3141
  textCompact: string;
3118
3142
  };
3119
3143
  rarity: {
3120
- bg: string;
3121
- text: string;
3144
+ common: string;
3145
+ uncommon: string;
3146
+ rare: string;
3147
+ epic: string;
3148
+ legendary: string;
3149
+ content: string;
3122
3150
  };
3123
3151
  name: {
3124
3152
  bg: string;
@@ -4252,7 +4280,7 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
4252
4280
  gap: number;
4253
4281
  paddingHorizontal: number;
4254
4282
  };
4255
- segmented: (size: "xl" | "lg" | "md" | "sm") => {
4283
+ segmented: (size: "xl" | "lg" | "md" | "sm" | "xs") => {
4256
4284
  height: number;
4257
4285
  containerPadding: number;
4258
4286
  containerRadius: 8;
@@ -4300,6 +4328,18 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
4300
4328
  lineHeight: number;
4301
4329
  iconSize: number;
4302
4330
  gap: number;
4331
+ } | {
4332
+ height: number;
4333
+ containerPadding: number;
4334
+ containerRadius: 4;
4335
+ itemHeight: number;
4336
+ itemPaddingHorizontal: number;
4337
+ itemPaddingVertical: number;
4338
+ itemRadius: 2;
4339
+ fontSize: number;
4340
+ lineHeight: number;
4341
+ iconSize: number;
4342
+ gap: number;
4303
4343
  };
4304
4344
  tabsSegmented: (size: "xl" | "lg" | "md" | "sm") => {
4305
4345
  height: number;
@@ -5486,8 +5526,12 @@ var control = {
5486
5526
  textCompact: "rgba(255, 255, 255, 0.48)"
5487
5527
  },
5488
5528
  rarity: {
5489
- bg: "#141d1f",
5490
- text: "#22a8c3"
5529
+ common: "#d9d9d9",
5530
+ uncommon: "#a3c245",
5531
+ rare: "#7cd9f1",
5532
+ epic: "#9282f7",
5533
+ legendary: "#eaaf64",
5534
+ content: "#000000"
5491
5535
  },
5492
5536
  name: {
5493
5537
  bg: "#233134",
@@ -5948,8 +5992,12 @@ declare const colors: {
5948
5992
  textCompact: string;
5949
5993
  };
5950
5994
  rarity: {
5951
- bg: string;
5952
- text: string;
5995
+ common: string;
5996
+ uncommon: string;
5997
+ rare: string;
5998
+ epic: string;
5999
+ legendary: string;
6000
+ content: string;
5953
6001
  };
5954
6002
  name: {
5955
6003
  bg: string;
@@ -6389,8 +6437,12 @@ declare const colors: {
6389
6437
  textCompact: string;
6390
6438
  };
6391
6439
  rarity: {
6392
- bg: string;
6393
- text: string;
6440
+ common: string;
6441
+ uncommon: string;
6442
+ rare: string;
6443
+ epic: string;
6444
+ legendary: string;
6445
+ content: string;
6394
6446
  };
6395
6447
  name: {
6396
6448
  bg: string;
@@ -6830,8 +6882,12 @@ declare const colors: {
6830
6882
  textCompact: string;
6831
6883
  };
6832
6884
  rarity: {
6833
- bg: string;
6834
- text: string;
6885
+ common: string;
6886
+ uncommon: string;
6887
+ rare: string;
6888
+ epic: string;
6889
+ legendary: string;
6890
+ content: string;
6835
6891
  };
6836
6892
  name: {
6837
6893
  bg: string;
@@ -7271,8 +7327,12 @@ declare const colors: {
7271
7327
  textCompact: string;
7272
7328
  };
7273
7329
  rarity: {
7274
- bg: string;
7275
- text: string;
7330
+ common: string;
7331
+ uncommon: string;
7332
+ rare: string;
7333
+ epic: string;
7334
+ legendary: string;
7335
+ content: string;
7276
7336
  };
7277
7337
  name: {
7278
7338
  bg: string;
@@ -7712,8 +7772,12 @@ declare const colors: {
7712
7772
  textCompact: string;
7713
7773
  };
7714
7774
  rarity: {
7715
- bg: string;
7716
- text: string;
7775
+ common: string;
7776
+ uncommon: string;
7777
+ rare: string;
7778
+ epic: string;
7779
+ legendary: string;
7780
+ content: string;
7717
7781
  };
7718
7782
  name: {
7719
7783
  bg: string;
@@ -8153,8 +8217,12 @@ declare const colors: {
8153
8217
  textCompact: string;
8154
8218
  };
8155
8219
  rarity: {
8156
- bg: string;
8157
- text: string;
8220
+ common: string;
8221
+ uncommon: string;
8222
+ rare: string;
8223
+ epic: string;
8224
+ legendary: string;
8225
+ content: string;
8158
8226
  };
8159
8227
  name: {
8160
8228
  bg: string;
@@ -8594,8 +8662,12 @@ declare const colors: {
8594
8662
  textCompact: string;
8595
8663
  };
8596
8664
  rarity: {
8597
- bg: string;
8598
- text: string;
8665
+ common: string;
8666
+ uncommon: string;
8667
+ rare: string;
8668
+ epic: string;
8669
+ legendary: string;
8670
+ content: string;
8599
8671
  };
8600
8672
  name: {
8601
8673
  bg: string;
@@ -9035,8 +9107,12 @@ declare const colors: {
9035
9107
  textCompact: string;
9036
9108
  };
9037
9109
  rarity: {
9038
- bg: string;
9039
- text: string;
9110
+ common: string;
9111
+ uncommon: string;
9112
+ rare: string;
9113
+ epic: string;
9114
+ legendary: string;
9115
+ content: string;
9040
9116
  };
9041
9117
  name: {
9042
9118
  bg: string;
@@ -9476,8 +9552,12 @@ declare const colors: {
9476
9552
  textCompact: string;
9477
9553
  };
9478
9554
  rarity: {
9479
- bg: string;
9480
- text: string;
9555
+ common: string;
9556
+ uncommon: string;
9557
+ rare: string;
9558
+ epic: string;
9559
+ legendary: string;
9560
+ content: string;
9481
9561
  };
9482
9562
  name: {
9483
9563
  bg: string;
package/index.d.ts CHANGED
@@ -477,8 +477,12 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
477
477
  textCompact: string;
478
478
  };
479
479
  rarity: {
480
- bg: string;
481
- text: string;
480
+ common: string;
481
+ uncommon: string;
482
+ rare: string;
483
+ epic: string;
484
+ legendary: string;
485
+ content: string;
482
486
  };
483
487
  name: {
484
488
  bg: string;
@@ -917,8 +921,12 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
917
921
  textCompact: string;
918
922
  };
919
923
  rarity: {
920
- bg: string;
921
- text: string;
924
+ common: string;
925
+ uncommon: string;
926
+ rare: string;
927
+ epic: string;
928
+ legendary: string;
929
+ content: string;
922
930
  };
923
931
  name: {
924
932
  bg: string;
@@ -1357,8 +1365,12 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
1357
1365
  textCompact: string;
1358
1366
  };
1359
1367
  rarity: {
1360
- bg: string;
1361
- text: string;
1368
+ common: string;
1369
+ uncommon: string;
1370
+ rare: string;
1371
+ epic: string;
1372
+ legendary: string;
1373
+ content: string;
1362
1374
  };
1363
1375
  name: {
1364
1376
  bg: string;
@@ -1797,8 +1809,12 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
1797
1809
  textCompact: string;
1798
1810
  };
1799
1811
  rarity: {
1800
- bg: string;
1801
- text: string;
1812
+ common: string;
1813
+ uncommon: string;
1814
+ rare: string;
1815
+ epic: string;
1816
+ legendary: string;
1817
+ content: string;
1802
1818
  };
1803
1819
  name: {
1804
1820
  bg: string;
@@ -2237,8 +2253,12 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
2237
2253
  textCompact: string;
2238
2254
  };
2239
2255
  rarity: {
2240
- bg: string;
2241
- text: string;
2256
+ common: string;
2257
+ uncommon: string;
2258
+ rare: string;
2259
+ epic: string;
2260
+ legendary: string;
2261
+ content: string;
2242
2262
  };
2243
2263
  name: {
2244
2264
  bg: string;
@@ -2677,8 +2697,12 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
2677
2697
  textCompact: string;
2678
2698
  };
2679
2699
  rarity: {
2680
- bg: string;
2681
- text: string;
2700
+ common: string;
2701
+ uncommon: string;
2702
+ rare: string;
2703
+ epic: string;
2704
+ legendary: string;
2705
+ content: string;
2682
2706
  };
2683
2707
  name: {
2684
2708
  bg: string;
@@ -3117,8 +3141,12 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
3117
3141
  textCompact: string;
3118
3142
  };
3119
3143
  rarity: {
3120
- bg: string;
3121
- text: string;
3144
+ common: string;
3145
+ uncommon: string;
3146
+ rare: string;
3147
+ epic: string;
3148
+ legendary: string;
3149
+ content: string;
3122
3150
  };
3123
3151
  name: {
3124
3152
  bg: string;
@@ -4252,7 +4280,7 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
4252
4280
  gap: number;
4253
4281
  paddingHorizontal: number;
4254
4282
  };
4255
- segmented: (size: "xl" | "lg" | "md" | "sm") => {
4283
+ segmented: (size: "xl" | "lg" | "md" | "sm" | "xs") => {
4256
4284
  height: number;
4257
4285
  containerPadding: number;
4258
4286
  containerRadius: 8;
@@ -4300,6 +4328,18 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
4300
4328
  lineHeight: number;
4301
4329
  iconSize: number;
4302
4330
  gap: number;
4331
+ } | {
4332
+ height: number;
4333
+ containerPadding: number;
4334
+ containerRadius: 4;
4335
+ itemHeight: number;
4336
+ itemPaddingHorizontal: number;
4337
+ itemPaddingVertical: number;
4338
+ itemRadius: 2;
4339
+ fontSize: number;
4340
+ lineHeight: number;
4341
+ iconSize: number;
4342
+ gap: number;
4303
4343
  };
4304
4344
  tabsSegmented: (size: "xl" | "lg" | "md" | "sm") => {
4305
4345
  height: number;
@@ -5486,8 +5526,12 @@ var control = {
5486
5526
  textCompact: "rgba(255, 255, 255, 0.48)"
5487
5527
  },
5488
5528
  rarity: {
5489
- bg: "#141d1f",
5490
- text: "#22a8c3"
5529
+ common: "#d9d9d9",
5530
+ uncommon: "#a3c245",
5531
+ rare: "#7cd9f1",
5532
+ epic: "#9282f7",
5533
+ legendary: "#eaaf64",
5534
+ content: "#000000"
5491
5535
  },
5492
5536
  name: {
5493
5537
  bg: "#233134",
@@ -5948,8 +5992,12 @@ declare const colors: {
5948
5992
  textCompact: string;
5949
5993
  };
5950
5994
  rarity: {
5951
- bg: string;
5952
- text: string;
5995
+ common: string;
5996
+ uncommon: string;
5997
+ rare: string;
5998
+ epic: string;
5999
+ legendary: string;
6000
+ content: string;
5953
6001
  };
5954
6002
  name: {
5955
6003
  bg: string;
@@ -6389,8 +6437,12 @@ declare const colors: {
6389
6437
  textCompact: string;
6390
6438
  };
6391
6439
  rarity: {
6392
- bg: string;
6393
- text: string;
6440
+ common: string;
6441
+ uncommon: string;
6442
+ rare: string;
6443
+ epic: string;
6444
+ legendary: string;
6445
+ content: string;
6394
6446
  };
6395
6447
  name: {
6396
6448
  bg: string;
@@ -6830,8 +6882,12 @@ declare const colors: {
6830
6882
  textCompact: string;
6831
6883
  };
6832
6884
  rarity: {
6833
- bg: string;
6834
- text: string;
6885
+ common: string;
6886
+ uncommon: string;
6887
+ rare: string;
6888
+ epic: string;
6889
+ legendary: string;
6890
+ content: string;
6835
6891
  };
6836
6892
  name: {
6837
6893
  bg: string;
@@ -7271,8 +7327,12 @@ declare const colors: {
7271
7327
  textCompact: string;
7272
7328
  };
7273
7329
  rarity: {
7274
- bg: string;
7275
- text: string;
7330
+ common: string;
7331
+ uncommon: string;
7332
+ rare: string;
7333
+ epic: string;
7334
+ legendary: string;
7335
+ content: string;
7276
7336
  };
7277
7337
  name: {
7278
7338
  bg: string;
@@ -7712,8 +7772,12 @@ declare const colors: {
7712
7772
  textCompact: string;
7713
7773
  };
7714
7774
  rarity: {
7715
- bg: string;
7716
- text: string;
7775
+ common: string;
7776
+ uncommon: string;
7777
+ rare: string;
7778
+ epic: string;
7779
+ legendary: string;
7780
+ content: string;
7717
7781
  };
7718
7782
  name: {
7719
7783
  bg: string;
@@ -8153,8 +8217,12 @@ declare const colors: {
8153
8217
  textCompact: string;
8154
8218
  };
8155
8219
  rarity: {
8156
- bg: string;
8157
- text: string;
8220
+ common: string;
8221
+ uncommon: string;
8222
+ rare: string;
8223
+ epic: string;
8224
+ legendary: string;
8225
+ content: string;
8158
8226
  };
8159
8227
  name: {
8160
8228
  bg: string;
@@ -8594,8 +8662,12 @@ declare const colors: {
8594
8662
  textCompact: string;
8595
8663
  };
8596
8664
  rarity: {
8597
- bg: string;
8598
- text: string;
8665
+ common: string;
8666
+ uncommon: string;
8667
+ rare: string;
8668
+ epic: string;
8669
+ legendary: string;
8670
+ content: string;
8599
8671
  };
8600
8672
  name: {
8601
8673
  bg: string;
@@ -9035,8 +9107,12 @@ declare const colors: {
9035
9107
  textCompact: string;
9036
9108
  };
9037
9109
  rarity: {
9038
- bg: string;
9039
- text: string;
9110
+ common: string;
9111
+ uncommon: string;
9112
+ rare: string;
9113
+ epic: string;
9114
+ legendary: string;
9115
+ content: string;
9040
9116
  };
9041
9117
  name: {
9042
9118
  bg: string;
@@ -9476,8 +9552,12 @@ declare const colors: {
9476
9552
  textCompact: string;
9477
9553
  };
9478
9554
  rarity: {
9479
- bg: string;
9480
- text: string;
9555
+ common: string;
9556
+ uncommon: string;
9557
+ rare: string;
9558
+ epic: string;
9559
+ legendary: string;
9560
+ content: string;
9481
9561
  };
9482
9562
  name: {
9483
9563
  bg: string;
package/index.js CHANGED
@@ -469,8 +469,12 @@ var dark_default = {
469
469
  textCompact: "rgba(255, 255, 255, 0.48)"
470
470
  },
471
471
  rarity: {
472
- bg: "#141d1f",
473
- text: "#22a8c3"
472
+ common: "#d9d9d9",
473
+ uncommon: "#a3c245",
474
+ rare: "#7cd9f1",
475
+ epic: "#9282f7",
476
+ legendary: "#eaaf64",
477
+ content: "#000000"
474
478
  },
475
479
  name: {
476
480
  bg: "#233134",
@@ -912,8 +916,12 @@ var light_default = {
912
916
  textCompact: "rgba(0, 0, 0, 0.48)"
913
917
  },
914
918
  rarity: {
915
- bg: "#141d1f",
916
- text: "#22a8c3"
919
+ common: "#d9d9d9",
920
+ uncommon: "#a3c245",
921
+ rare: "#7cd9f1",
922
+ epic: "#9282f7",
923
+ legendary: "#eaaf64",
924
+ content: "#000000"
917
925
  },
918
926
  name: {
919
927
  bg: "rgba(155, 165, 145, 0.1)",
@@ -1355,8 +1363,12 @@ var ltg_dark_default = {
1355
1363
  textCompact: "rgba(255, 255, 255, 0.48)"
1356
1364
  },
1357
1365
  rarity: {
1358
- bg: "#141d1f",
1359
- text: "#22a8c3"
1366
+ common: "#d9d9d9",
1367
+ uncommon: "#a3c245",
1368
+ rare: "#7cd9f1",
1369
+ epic: "#9282f7",
1370
+ legendary: "#eaaf64",
1371
+ content: "#000000"
1360
1372
  },
1361
1373
  name: {
1362
1374
  bg: "#ffffff",
@@ -1798,8 +1810,12 @@ var ltg_light_default = {
1798
1810
  textCompact: "rgba(0, 0, 0, 0.48)"
1799
1811
  },
1800
1812
  rarity: {
1801
- bg: "#141d1f",
1802
- text: "#22a8c3"
1813
+ common: "#d9d9d9",
1814
+ uncommon: "#a3c245",
1815
+ rare: "#7cd9f1",
1816
+ epic: "#9282f7",
1817
+ legendary: "#eaaf64",
1818
+ content: "#000000"
1803
1819
  },
1804
1820
  name: {
1805
1821
  bg: "rgba(155, 165, 145, 0.1)",
@@ -2241,8 +2257,12 @@ var blueprints_default = {
2241
2257
  textCompact: "rgba(0, 0, 0, 0.48)"
2242
2258
  },
2243
2259
  rarity: {
2244
- bg: "#141d1f",
2245
- text: "#22a8c3"
2260
+ common: "#d9d9d9",
2261
+ uncommon: "#a3c245",
2262
+ rare: "#7cd9f1",
2263
+ epic: "#9282f7",
2264
+ legendary: "#eaaf64",
2265
+ content: "#000000"
2246
2266
  },
2247
2267
  name: {
2248
2268
  bg: "#ffffff",
@@ -2684,8 +2704,12 @@ var corpsite_dark_default = {
2684
2704
  textCompact: "rgba(255, 255, 255, 0.48)"
2685
2705
  },
2686
2706
  rarity: {
2687
- bg: "#141d1f",
2688
- text: "#22a8c3"
2707
+ common: "#d9d9d9",
2708
+ uncommon: "#a3c245",
2709
+ rare: "#7cd9f1",
2710
+ epic: "#9282f7",
2711
+ legendary: "#eaaf64",
2712
+ content: "#000000"
2689
2713
  },
2690
2714
  name: {
2691
2715
  bg: "#233134",
@@ -3127,8 +3151,12 @@ var corpsite_light_default = {
3127
3151
  textCompact: "rgba(0, 0, 0, 0.48)"
3128
3152
  },
3129
3153
  rarity: {
3130
- bg: "#141d1f",
3131
- text: "#22a8c3"
3154
+ common: "#d9d9d9",
3155
+ uncommon: "#a3c245",
3156
+ rare: "#7cd9f1",
3157
+ epic: "#9282f7",
3158
+ legendary: "#eaaf64",
3159
+ content: "#000000"
3132
3160
  },
3133
3161
  name: {
3134
3162
  bg: "#ffffff",
@@ -4862,6 +4890,24 @@ var segmented = (size) => {
4862
4890
  lineHeight: 16,
4863
4891
  iconSize: 20,
4864
4892
  gap: 4
4893
+ },
4894
+ xs: {
4895
+ // Container 36px / item 28px. In Figma the xs container binds the same
4896
+ // radius variable as sm (there is no `segmented/xs` shape token), so it
4897
+ // reuses shape.segmented.sm. The item uses the existing segmentedItem.xs.
4898
+ // Paddings and gaps are not token-bound in Figma yet (raw 12/6/4,
4899
+ // identical to sm).
4900
+ height: 36,
4901
+ containerPadding: 3,
4902
+ containerRadius: shape.segmented.sm.borderRadius,
4903
+ itemHeight: 28,
4904
+ itemPaddingHorizontal: 12,
4905
+ itemPaddingVertical: 6,
4906
+ itemRadius: shape.segmentedItem.xs.borderRadius,
4907
+ fontSize: 10,
4908
+ lineHeight: 12,
4909
+ iconSize: 16,
4910
+ gap: 4
4865
4911
  }
4866
4912
  };
4867
4913
  return configs[size];