@xsolla/xui-core 0.154.1 → 0.154.2-pr250.1779075465

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
@@ -2464,6 +2464,7 @@ declare const spacing: {
2464
2464
  declare const radius: {
2465
2465
  button: number;
2466
2466
  card: number;
2467
+ contextMenu: number;
2467
2468
  input: number;
2468
2469
  tagSmall: number;
2469
2470
  tagMedium: number;
@@ -2479,6 +2480,7 @@ declare const shadow: {
2479
2480
  surfaceHover: string;
2480
2481
  popover: string;
2481
2482
  modal: string;
2483
+ contextMenu: string;
2482
2484
  };
2483
2485
 
2484
2486
  /**
@@ -3850,6 +3852,7 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
3850
3852
  radius: {
3851
3853
  button: number;
3852
3854
  card: number;
3855
+ contextMenu: number;
3853
3856
  input: number;
3854
3857
  tagSmall: number;
3855
3858
  tagMedium: number;
@@ -3864,6 +3867,7 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
3864
3867
  surfaceHover: string;
3865
3868
  popover: string;
3866
3869
  modal: string;
3870
+ contextMenu: string;
3867
3871
  };
3868
3872
  fonts: {
3869
3873
  heading: string;
@@ -4801,6 +4805,11 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
4801
4805
  iconSize: number;
4802
4806
  gap: number;
4803
4807
  minWidth: number;
4808
+ panelWidth: number;
4809
+ statusDotSize: number;
4810
+ iconWrapperSize: number;
4811
+ triggerOffset: number;
4812
+ borderRadius: number;
4804
4813
  searchPaddingHorizontal: number;
4805
4814
  searchPaddingVertical: number;
4806
4815
  searchGap: number;
@@ -4817,6 +4826,11 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
4817
4826
  iconSize: number;
4818
4827
  gap: number;
4819
4828
  minWidth: number;
4829
+ panelWidth: number;
4830
+ statusDotSize: number;
4831
+ iconWrapperSize: number;
4832
+ triggerOffset: number;
4833
+ borderRadius: number;
4820
4834
  searchPaddingHorizontal: number;
4821
4835
  searchPaddingVertical: number;
4822
4836
  searchGap: number;
@@ -4833,6 +4847,11 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
4833
4847
  iconSize: number;
4834
4848
  gap: number;
4835
4849
  minWidth: number;
4850
+ panelWidth: number;
4851
+ statusDotSize: number;
4852
+ iconWrapperSize: number;
4853
+ triggerOffset: number;
4854
+ borderRadius: number;
4836
4855
  searchPaddingHorizontal: number;
4837
4856
  searchPaddingVertical: number;
4838
4857
  searchGap: number;
@@ -4849,6 +4868,11 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
4849
4868
  iconSize: number;
4850
4869
  gap: number;
4851
4870
  minWidth: number;
4871
+ panelWidth: number;
4872
+ statusDotSize: number;
4873
+ iconWrapperSize: number;
4874
+ triggerOffset: number;
4875
+ borderRadius: number;
4852
4876
  searchPaddingHorizontal: number;
4853
4877
  searchPaddingVertical: number;
4854
4878
  searchGap: number;
@@ -6286,6 +6310,7 @@ declare const useResolvedTheme: (overrides?: ThemeOverrideProps) => {
6286
6310
  radius: {
6287
6311
  button: number;
6288
6312
  card: number;
6313
+ contextMenu: number;
6289
6314
  input: number;
6290
6315
  tagSmall: number;
6291
6316
  tagMedium: number;
@@ -6300,6 +6325,7 @@ declare const useResolvedTheme: (overrides?: ThemeOverrideProps) => {
6300
6325
  surfaceHover: string;
6301
6326
  popover: string;
6302
6327
  modal: string;
6328
+ contextMenu: string;
6303
6329
  };
6304
6330
  fonts: {
6305
6331
  heading: string;
@@ -7237,6 +7263,11 @@ declare const useResolvedTheme: (overrides?: ThemeOverrideProps) => {
7237
7263
  iconSize: number;
7238
7264
  gap: number;
7239
7265
  minWidth: number;
7266
+ panelWidth: number;
7267
+ statusDotSize: number;
7268
+ iconWrapperSize: number;
7269
+ triggerOffset: number;
7270
+ borderRadius: number;
7240
7271
  searchPaddingHorizontal: number;
7241
7272
  searchPaddingVertical: number;
7242
7273
  searchGap: number;
@@ -7253,6 +7284,11 @@ declare const useResolvedTheme: (overrides?: ThemeOverrideProps) => {
7253
7284
  iconSize: number;
7254
7285
  gap: number;
7255
7286
  minWidth: number;
7287
+ panelWidth: number;
7288
+ statusDotSize: number;
7289
+ iconWrapperSize: number;
7290
+ triggerOffset: number;
7291
+ borderRadius: number;
7256
7292
  searchPaddingHorizontal: number;
7257
7293
  searchPaddingVertical: number;
7258
7294
  searchGap: number;
@@ -7269,6 +7305,11 @@ declare const useResolvedTheme: (overrides?: ThemeOverrideProps) => {
7269
7305
  iconSize: number;
7270
7306
  gap: number;
7271
7307
  minWidth: number;
7308
+ panelWidth: number;
7309
+ statusDotSize: number;
7310
+ iconWrapperSize: number;
7311
+ triggerOffset: number;
7312
+ borderRadius: number;
7272
7313
  searchPaddingHorizontal: number;
7273
7314
  searchPaddingVertical: number;
7274
7315
  searchGap: number;
@@ -7285,6 +7326,11 @@ declare const useResolvedTheme: (overrides?: ThemeOverrideProps) => {
7285
7326
  iconSize: number;
7286
7327
  gap: number;
7287
7328
  minWidth: number;
7329
+ panelWidth: number;
7330
+ statusDotSize: number;
7331
+ iconWrapperSize: number;
7332
+ triggerOffset: number;
7333
+ borderRadius: number;
7288
7334
  searchPaddingHorizontal: number;
7289
7335
  searchPaddingVertical: number;
7290
7336
  searchGap: number;
package/index.d.ts CHANGED
@@ -2464,6 +2464,7 @@ declare const spacing: {
2464
2464
  declare const radius: {
2465
2465
  button: number;
2466
2466
  card: number;
2467
+ contextMenu: number;
2467
2468
  input: number;
2468
2469
  tagSmall: number;
2469
2470
  tagMedium: number;
@@ -2479,6 +2480,7 @@ declare const shadow: {
2479
2480
  surfaceHover: string;
2480
2481
  popover: string;
2481
2482
  modal: string;
2483
+ contextMenu: string;
2482
2484
  };
2483
2485
 
2484
2486
  /**
@@ -3850,6 +3852,7 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
3850
3852
  radius: {
3851
3853
  button: number;
3852
3854
  card: number;
3855
+ contextMenu: number;
3853
3856
  input: number;
3854
3857
  tagSmall: number;
3855
3858
  tagMedium: number;
@@ -3864,6 +3867,7 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
3864
3867
  surfaceHover: string;
3865
3868
  popover: string;
3866
3869
  modal: string;
3870
+ contextMenu: string;
3867
3871
  };
3868
3872
  fonts: {
3869
3873
  heading: string;
@@ -4801,6 +4805,11 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
4801
4805
  iconSize: number;
4802
4806
  gap: number;
4803
4807
  minWidth: number;
4808
+ panelWidth: number;
4809
+ statusDotSize: number;
4810
+ iconWrapperSize: number;
4811
+ triggerOffset: number;
4812
+ borderRadius: number;
4804
4813
  searchPaddingHorizontal: number;
4805
4814
  searchPaddingVertical: number;
4806
4815
  searchGap: number;
@@ -4817,6 +4826,11 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
4817
4826
  iconSize: number;
4818
4827
  gap: number;
4819
4828
  minWidth: number;
4829
+ panelWidth: number;
4830
+ statusDotSize: number;
4831
+ iconWrapperSize: number;
4832
+ triggerOffset: number;
4833
+ borderRadius: number;
4820
4834
  searchPaddingHorizontal: number;
4821
4835
  searchPaddingVertical: number;
4822
4836
  searchGap: number;
@@ -4833,6 +4847,11 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
4833
4847
  iconSize: number;
4834
4848
  gap: number;
4835
4849
  minWidth: number;
4850
+ panelWidth: number;
4851
+ statusDotSize: number;
4852
+ iconWrapperSize: number;
4853
+ triggerOffset: number;
4854
+ borderRadius: number;
4836
4855
  searchPaddingHorizontal: number;
4837
4856
  searchPaddingVertical: number;
4838
4857
  searchGap: number;
@@ -4849,6 +4868,11 @@ declare const themeConfig: (mode?: ThemeMode, productContext?: ProductContext) =
4849
4868
  iconSize: number;
4850
4869
  gap: number;
4851
4870
  minWidth: number;
4871
+ panelWidth: number;
4872
+ statusDotSize: number;
4873
+ iconWrapperSize: number;
4874
+ triggerOffset: number;
4875
+ borderRadius: number;
4852
4876
  searchPaddingHorizontal: number;
4853
4877
  searchPaddingVertical: number;
4854
4878
  searchGap: number;
@@ -6286,6 +6310,7 @@ declare const useResolvedTheme: (overrides?: ThemeOverrideProps) => {
6286
6310
  radius: {
6287
6311
  button: number;
6288
6312
  card: number;
6313
+ contextMenu: number;
6289
6314
  input: number;
6290
6315
  tagSmall: number;
6291
6316
  tagMedium: number;
@@ -6300,6 +6325,7 @@ declare const useResolvedTheme: (overrides?: ThemeOverrideProps) => {
6300
6325
  surfaceHover: string;
6301
6326
  popover: string;
6302
6327
  modal: string;
6328
+ contextMenu: string;
6303
6329
  };
6304
6330
  fonts: {
6305
6331
  heading: string;
@@ -7237,6 +7263,11 @@ declare const useResolvedTheme: (overrides?: ThemeOverrideProps) => {
7237
7263
  iconSize: number;
7238
7264
  gap: number;
7239
7265
  minWidth: number;
7266
+ panelWidth: number;
7267
+ statusDotSize: number;
7268
+ iconWrapperSize: number;
7269
+ triggerOffset: number;
7270
+ borderRadius: number;
7240
7271
  searchPaddingHorizontal: number;
7241
7272
  searchPaddingVertical: number;
7242
7273
  searchGap: number;
@@ -7253,6 +7284,11 @@ declare const useResolvedTheme: (overrides?: ThemeOverrideProps) => {
7253
7284
  iconSize: number;
7254
7285
  gap: number;
7255
7286
  minWidth: number;
7287
+ panelWidth: number;
7288
+ statusDotSize: number;
7289
+ iconWrapperSize: number;
7290
+ triggerOffset: number;
7291
+ borderRadius: number;
7256
7292
  searchPaddingHorizontal: number;
7257
7293
  searchPaddingVertical: number;
7258
7294
  searchGap: number;
@@ -7269,6 +7305,11 @@ declare const useResolvedTheme: (overrides?: ThemeOverrideProps) => {
7269
7305
  iconSize: number;
7270
7306
  gap: number;
7271
7307
  minWidth: number;
7308
+ panelWidth: number;
7309
+ statusDotSize: number;
7310
+ iconWrapperSize: number;
7311
+ triggerOffset: number;
7312
+ borderRadius: number;
7272
7313
  searchPaddingHorizontal: number;
7273
7314
  searchPaddingVertical: number;
7274
7315
  searchGap: number;
@@ -7285,6 +7326,11 @@ declare const useResolvedTheme: (overrides?: ThemeOverrideProps) => {
7285
7326
  iconSize: number;
7286
7327
  gap: number;
7287
7328
  minWidth: number;
7329
+ panelWidth: number;
7330
+ statusDotSize: number;
7331
+ iconWrapperSize: number;
7332
+ triggerOffset: number;
7333
+ borderRadius: number;
7288
7334
  searchPaddingHorizontal: number;
7289
7335
  searchPaddingVertical: number;
7290
7336
  searchGap: number;
package/index.js CHANGED
@@ -1283,6 +1283,7 @@ var spacing = {
1283
1283
  var radius = {
1284
1284
  button: 4,
1285
1285
  card: 12,
1286
+ contextMenu: 8,
1286
1287
  input: 4,
1287
1288
  tagSmall: 4,
1288
1289
  tagMedium: 6,
@@ -1298,7 +1299,8 @@ var shadow = {
1298
1299
  surface: "0px 1px 2px rgba(7, 7, 8, 0.2), 0px 2px 6px 2px rgba(7, 7, 8, 0.1)",
1299
1300
  surfaceHover: "0px 4px 8px 3px rgba(7, 7, 8, 0.1), 0px 1px 3px rgba(7, 7, 8, 0.2)",
1300
1301
  popover: "0px 6px 10px 4px rgba(7, 7, 8, 0.1), 0px 2px 3px rgba(7, 7, 8, 0.2)",
1301
- modal: "0px 8px 12px 6px rgba(7, 7, 8, 0.1), 0px 4px 4px rgba(7, 7, 8, 0.2)"
1302
+ modal: "0px 8px 12px 6px rgba(7, 7, 8, 0.1), 0px 4px 4px rgba(7, 7, 8, 0.2)",
1303
+ contextMenu: "0px 4px 12px rgba(0, 0, 0, 0.15)"
1302
1304
  };
1303
1305
 
1304
1306
  // src/tokens/fonts.ts
@@ -1375,11 +1377,11 @@ var typographyTokens = {
1375
1377
  },
1376
1378
  basic: {
1377
1379
  display: {
1378
- fontSize: 48,
1379
- lineHeight: "48px",
1380
- fontWeight: 800,
1381
- scaleStep: "550",
1382
- lineHeightCategory: "display"
1380
+ fontSize: 28,
1381
+ lineHeight: "36px",
1382
+ fontWeight: 500,
1383
+ scaleStep: "300",
1384
+ lineHeightCategory: "compact"
1383
1385
  },
1384
1386
  "body-lg": {
1385
1387
  fontSize: 18,
@@ -3108,17 +3110,22 @@ var themeConfig = (mode = "dark", productContext = defaultProductContext) => {
3108
3110
  itemPaddingHorizontal: 16,
3109
3111
  itemPaddingVertical: 18,
3110
3112
  fontSize: 20,
3111
- lineHeight: 22,
3113
+ lineHeight: 26,
3112
3114
  descriptionFontSize: 18,
3113
3115
  iconSize: 18,
3114
3116
  gap: 12,
3115
3117
  minWidth: 276,
3118
+ panelWidth: 320,
3119
+ statusDotSize: 12,
3120
+ iconWrapperSize: 40,
3121
+ triggerOffset: 4,
3122
+ borderRadius: 8,
3116
3123
  // Search sizing from Figma
3117
3124
  searchPaddingHorizontal: 16,
3118
3125
  searchPaddingVertical: 18,
3119
3126
  searchGap: 18,
3120
3127
  searchFontSize: 20,
3121
- searchLineHeight: 22,
3128
+ searchLineHeight: 26,
3122
3129
  searchIconSize: 18
3123
3130
  },
3124
3131
  lg: {
@@ -3126,17 +3133,22 @@ var themeConfig = (mode = "dark", productContext = defaultProductContext) => {
3126
3133
  itemPaddingHorizontal: 14,
3127
3134
  itemPaddingVertical: 14,
3128
3135
  fontSize: 18,
3129
- lineHeight: 20,
3136
+ lineHeight: 24,
3130
3137
  descriptionFontSize: 16,
3131
3138
  iconSize: 18,
3132
3139
  gap: 10,
3133
3140
  minWidth: 220,
3141
+ panelWidth: 296,
3142
+ statusDotSize: 10,
3143
+ iconWrapperSize: 36,
3144
+ triggerOffset: 4,
3145
+ borderRadius: 8,
3134
3146
  // Search sizing from Figma
3135
3147
  searchPaddingHorizontal: 14,
3136
3148
  searchPaddingVertical: 14,
3137
3149
  searchGap: 14,
3138
3150
  searchFontSize: 18,
3139
- searchLineHeight: 20,
3151
+ searchLineHeight: 24,
3140
3152
  searchIconSize: 18
3141
3153
  },
3142
3154
  md: {
@@ -3144,17 +3156,22 @@ var themeConfig = (mode = "dark", productContext = defaultProductContext) => {
3144
3156
  itemPaddingHorizontal: 12,
3145
3157
  itemPaddingVertical: 11,
3146
3158
  fontSize: 16,
3147
- lineHeight: 18,
3159
+ lineHeight: 20,
3148
3160
  descriptionFontSize: 14,
3149
3161
  iconSize: 18,
3150
3162
  gap: 8,
3151
3163
  minWidth: 172,
3164
+ panelWidth: 272,
3165
+ statusDotSize: 8,
3166
+ iconWrapperSize: 32,
3167
+ triggerOffset: 4,
3168
+ borderRadius: 8,
3152
3169
  // Search sizing from Figma
3153
3170
  searchPaddingHorizontal: 12,
3154
3171
  searchPaddingVertical: 11,
3155
3172
  searchGap: 10,
3156
3173
  searchFontSize: 16,
3157
- searchLineHeight: 18,
3174
+ searchLineHeight: 20,
3158
3175
  searchIconSize: 18
3159
3176
  },
3160
3177
  sm: {
@@ -3162,17 +3179,22 @@ var themeConfig = (mode = "dark", productContext = defaultProductContext) => {
3162
3179
  itemPaddingHorizontal: 10,
3163
3180
  itemPaddingVertical: 8,
3164
3181
  fontSize: 14,
3165
- lineHeight: 16,
3182
+ lineHeight: 18,
3166
3183
  descriptionFontSize: 12,
3167
3184
  iconSize: 18,
3168
3185
  gap: 8,
3169
3186
  minWidth: 132,
3187
+ panelWidth: 248,
3188
+ statusDotSize: 6,
3189
+ iconWrapperSize: 24,
3190
+ triggerOffset: 4,
3191
+ borderRadius: 4,
3170
3192
  // Search sizing from Figma
3171
3193
  searchPaddingHorizontal: 10,
3172
3194
  searchPaddingVertical: 7,
3173
3195
  searchGap: 6,
3174
3196
  searchFontSize: 14,
3175
- searchLineHeight: 16,
3197
+ searchLineHeight: 18,
3176
3198
  searchIconSize: 18
3177
3199
  }
3178
3200
  };