@xsolla/xui-core 0.74.0 → 0.75.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 +75 -0
- package/index.d.ts +75 -0
- package/index.js +65 -0
- package/index.js.flow +1992 -0
- package/index.js.map +1 -1
- package/index.mjs +65 -0
- package/index.mjs.map +1 -1
- package/package.json +1 -1
package/index.d.mts
CHANGED
|
@@ -232,6 +232,12 @@ var control = {
|
|
|
232
232
|
bg: "rgba(255, 255, 255, 0.1)",
|
|
233
233
|
bgHover: "rgba(255, 255, 255, 0.15)"
|
|
234
234
|
},
|
|
235
|
+
segmented: {
|
|
236
|
+
bg: "rgba(255, 255, 255, 0.08)",
|
|
237
|
+
bgHover: "rgba(255, 255, 255, 0.10)",
|
|
238
|
+
bgActive: "#ffffff",
|
|
239
|
+
textActive: "#1a1a1a"
|
|
240
|
+
},
|
|
235
241
|
text: {
|
|
236
242
|
primary: "#ffffff",
|
|
237
243
|
secondary: "#ffffff",
|
|
@@ -488,6 +494,12 @@ declare const colors: {
|
|
|
488
494
|
bg: string;
|
|
489
495
|
bgHover: string;
|
|
490
496
|
};
|
|
497
|
+
segmented: {
|
|
498
|
+
bg: string;
|
|
499
|
+
bgHover: string;
|
|
500
|
+
bgActive: string;
|
|
501
|
+
textActive: string;
|
|
502
|
+
};
|
|
491
503
|
text: {
|
|
492
504
|
primary: string;
|
|
493
505
|
secondary: string;
|
|
@@ -735,6 +747,12 @@ declare const colors: {
|
|
|
735
747
|
bg: string;
|
|
736
748
|
bgHover: string;
|
|
737
749
|
};
|
|
750
|
+
segmented: {
|
|
751
|
+
bg: string;
|
|
752
|
+
bgHover: string;
|
|
753
|
+
bgActive: string;
|
|
754
|
+
textActive: string;
|
|
755
|
+
};
|
|
738
756
|
text: {
|
|
739
757
|
primary: string;
|
|
740
758
|
secondary: string;
|
|
@@ -1028,6 +1046,12 @@ declare const themeConfig: (mode?: ThemeMode) => {
|
|
|
1028
1046
|
bg: string;
|
|
1029
1047
|
bgHover: string;
|
|
1030
1048
|
};
|
|
1049
|
+
segmented: {
|
|
1050
|
+
bg: string;
|
|
1051
|
+
bgHover: string;
|
|
1052
|
+
bgActive: string;
|
|
1053
|
+
textActive: string;
|
|
1054
|
+
};
|
|
1031
1055
|
text: {
|
|
1032
1056
|
primary: string;
|
|
1033
1057
|
secondary: string;
|
|
@@ -1274,6 +1298,12 @@ declare const themeConfig: (mode?: ThemeMode) => {
|
|
|
1274
1298
|
bg: string;
|
|
1275
1299
|
bgHover: string;
|
|
1276
1300
|
};
|
|
1301
|
+
segmented: {
|
|
1302
|
+
bg: string;
|
|
1303
|
+
bgHover: string;
|
|
1304
|
+
bgActive: string;
|
|
1305
|
+
textActive: string;
|
|
1306
|
+
};
|
|
1277
1307
|
text: {
|
|
1278
1308
|
primary: string;
|
|
1279
1309
|
secondary: string;
|
|
@@ -1810,6 +1840,51 @@ declare const themeConfig: (mode?: ThemeMode) => {
|
|
|
1810
1840
|
gap: number;
|
|
1811
1841
|
padding: number;
|
|
1812
1842
|
};
|
|
1843
|
+
tabsSegmented: (size: "xl" | "lg" | "md" | "sm") => {
|
|
1844
|
+
height: number;
|
|
1845
|
+
containerPadding: number;
|
|
1846
|
+
containerRadius: number;
|
|
1847
|
+
itemPaddingHorizontal: number;
|
|
1848
|
+
itemPaddingVertical: number;
|
|
1849
|
+
itemRadius: number;
|
|
1850
|
+
fontSize: number;
|
|
1851
|
+
lineHeight: number;
|
|
1852
|
+
iconSize: number;
|
|
1853
|
+
gap: number;
|
|
1854
|
+
} | {
|
|
1855
|
+
height: number;
|
|
1856
|
+
containerPadding: number;
|
|
1857
|
+
containerRadius: number;
|
|
1858
|
+
itemPaddingHorizontal: number;
|
|
1859
|
+
itemPaddingVertical: number;
|
|
1860
|
+
itemRadius: number;
|
|
1861
|
+
fontSize: number;
|
|
1862
|
+
lineHeight: number;
|
|
1863
|
+
iconSize: number;
|
|
1864
|
+
gap: number;
|
|
1865
|
+
} | {
|
|
1866
|
+
height: number;
|
|
1867
|
+
containerPadding: number;
|
|
1868
|
+
containerRadius: number;
|
|
1869
|
+
itemPaddingHorizontal: number;
|
|
1870
|
+
itemPaddingVertical: number;
|
|
1871
|
+
itemRadius: number;
|
|
1872
|
+
fontSize: number;
|
|
1873
|
+
lineHeight: number;
|
|
1874
|
+
iconSize: number;
|
|
1875
|
+
gap: number;
|
|
1876
|
+
} | {
|
|
1877
|
+
height: number;
|
|
1878
|
+
containerPadding: number;
|
|
1879
|
+
containerRadius: number;
|
|
1880
|
+
itemPaddingHorizontal: number;
|
|
1881
|
+
itemPaddingVertical: number;
|
|
1882
|
+
itemRadius: number;
|
|
1883
|
+
fontSize: number;
|
|
1884
|
+
lineHeight: number;
|
|
1885
|
+
iconSize: number;
|
|
1886
|
+
gap: number;
|
|
1887
|
+
};
|
|
1813
1888
|
badge: (size: "xl" | "lg" | "md" | "sm" | "xs") => {
|
|
1814
1889
|
size: number;
|
|
1815
1890
|
fontSize: number;
|
package/index.d.ts
CHANGED
|
@@ -232,6 +232,12 @@ var control = {
|
|
|
232
232
|
bg: "rgba(255, 255, 255, 0.1)",
|
|
233
233
|
bgHover: "rgba(255, 255, 255, 0.15)"
|
|
234
234
|
},
|
|
235
|
+
segmented: {
|
|
236
|
+
bg: "rgba(255, 255, 255, 0.08)",
|
|
237
|
+
bgHover: "rgba(255, 255, 255, 0.10)",
|
|
238
|
+
bgActive: "#ffffff",
|
|
239
|
+
textActive: "#1a1a1a"
|
|
240
|
+
},
|
|
235
241
|
text: {
|
|
236
242
|
primary: "#ffffff",
|
|
237
243
|
secondary: "#ffffff",
|
|
@@ -488,6 +494,12 @@ declare const colors: {
|
|
|
488
494
|
bg: string;
|
|
489
495
|
bgHover: string;
|
|
490
496
|
};
|
|
497
|
+
segmented: {
|
|
498
|
+
bg: string;
|
|
499
|
+
bgHover: string;
|
|
500
|
+
bgActive: string;
|
|
501
|
+
textActive: string;
|
|
502
|
+
};
|
|
491
503
|
text: {
|
|
492
504
|
primary: string;
|
|
493
505
|
secondary: string;
|
|
@@ -735,6 +747,12 @@ declare const colors: {
|
|
|
735
747
|
bg: string;
|
|
736
748
|
bgHover: string;
|
|
737
749
|
};
|
|
750
|
+
segmented: {
|
|
751
|
+
bg: string;
|
|
752
|
+
bgHover: string;
|
|
753
|
+
bgActive: string;
|
|
754
|
+
textActive: string;
|
|
755
|
+
};
|
|
738
756
|
text: {
|
|
739
757
|
primary: string;
|
|
740
758
|
secondary: string;
|
|
@@ -1028,6 +1046,12 @@ declare const themeConfig: (mode?: ThemeMode) => {
|
|
|
1028
1046
|
bg: string;
|
|
1029
1047
|
bgHover: string;
|
|
1030
1048
|
};
|
|
1049
|
+
segmented: {
|
|
1050
|
+
bg: string;
|
|
1051
|
+
bgHover: string;
|
|
1052
|
+
bgActive: string;
|
|
1053
|
+
textActive: string;
|
|
1054
|
+
};
|
|
1031
1055
|
text: {
|
|
1032
1056
|
primary: string;
|
|
1033
1057
|
secondary: string;
|
|
@@ -1274,6 +1298,12 @@ declare const themeConfig: (mode?: ThemeMode) => {
|
|
|
1274
1298
|
bg: string;
|
|
1275
1299
|
bgHover: string;
|
|
1276
1300
|
};
|
|
1301
|
+
segmented: {
|
|
1302
|
+
bg: string;
|
|
1303
|
+
bgHover: string;
|
|
1304
|
+
bgActive: string;
|
|
1305
|
+
textActive: string;
|
|
1306
|
+
};
|
|
1277
1307
|
text: {
|
|
1278
1308
|
primary: string;
|
|
1279
1309
|
secondary: string;
|
|
@@ -1810,6 +1840,51 @@ declare const themeConfig: (mode?: ThemeMode) => {
|
|
|
1810
1840
|
gap: number;
|
|
1811
1841
|
padding: number;
|
|
1812
1842
|
};
|
|
1843
|
+
tabsSegmented: (size: "xl" | "lg" | "md" | "sm") => {
|
|
1844
|
+
height: number;
|
|
1845
|
+
containerPadding: number;
|
|
1846
|
+
containerRadius: number;
|
|
1847
|
+
itemPaddingHorizontal: number;
|
|
1848
|
+
itemPaddingVertical: number;
|
|
1849
|
+
itemRadius: number;
|
|
1850
|
+
fontSize: number;
|
|
1851
|
+
lineHeight: number;
|
|
1852
|
+
iconSize: number;
|
|
1853
|
+
gap: number;
|
|
1854
|
+
} | {
|
|
1855
|
+
height: number;
|
|
1856
|
+
containerPadding: number;
|
|
1857
|
+
containerRadius: number;
|
|
1858
|
+
itemPaddingHorizontal: number;
|
|
1859
|
+
itemPaddingVertical: number;
|
|
1860
|
+
itemRadius: number;
|
|
1861
|
+
fontSize: number;
|
|
1862
|
+
lineHeight: number;
|
|
1863
|
+
iconSize: number;
|
|
1864
|
+
gap: number;
|
|
1865
|
+
} | {
|
|
1866
|
+
height: number;
|
|
1867
|
+
containerPadding: number;
|
|
1868
|
+
containerRadius: number;
|
|
1869
|
+
itemPaddingHorizontal: number;
|
|
1870
|
+
itemPaddingVertical: number;
|
|
1871
|
+
itemRadius: number;
|
|
1872
|
+
fontSize: number;
|
|
1873
|
+
lineHeight: number;
|
|
1874
|
+
iconSize: number;
|
|
1875
|
+
gap: number;
|
|
1876
|
+
} | {
|
|
1877
|
+
height: number;
|
|
1878
|
+
containerPadding: number;
|
|
1879
|
+
containerRadius: number;
|
|
1880
|
+
itemPaddingHorizontal: number;
|
|
1881
|
+
itemPaddingVertical: number;
|
|
1882
|
+
itemRadius: number;
|
|
1883
|
+
fontSize: number;
|
|
1884
|
+
lineHeight: number;
|
|
1885
|
+
iconSize: number;
|
|
1886
|
+
gap: number;
|
|
1887
|
+
};
|
|
1813
1888
|
badge: (size: "xl" | "lg" | "md" | "sm" | "xs") => {
|
|
1814
1889
|
size: number;
|
|
1815
1890
|
fontSize: number;
|
package/index.js
CHANGED
|
@@ -284,6 +284,12 @@ var xsolla_dark_default = {
|
|
|
284
284
|
bg: "rgba(255, 255, 255, 0.1)",
|
|
285
285
|
bgHover: "rgba(255, 255, 255, 0.15)"
|
|
286
286
|
},
|
|
287
|
+
segmented: {
|
|
288
|
+
bg: "rgba(255, 255, 255, 0.08)",
|
|
289
|
+
bgHover: "rgba(255, 255, 255, 0.10)",
|
|
290
|
+
bgActive: "#ffffff",
|
|
291
|
+
textActive: "#1a1a1a"
|
|
292
|
+
},
|
|
287
293
|
text: {
|
|
288
294
|
primary: "#ffffff",
|
|
289
295
|
secondary: "#ffffff",
|
|
@@ -533,6 +539,12 @@ var xsolla_light_default = {
|
|
|
533
539
|
bg: "rgba(0, 0, 0, 0.1)",
|
|
534
540
|
bgHover: "rgba(0, 0, 0, 0.15)"
|
|
535
541
|
},
|
|
542
|
+
segmented: {
|
|
543
|
+
bg: "rgba(0, 0, 0, 0.08)",
|
|
544
|
+
bgHover: "rgba(0, 0, 0, 0.10)",
|
|
545
|
+
bgActive: "#ffffff",
|
|
546
|
+
textActive: "#1a1a1a"
|
|
547
|
+
},
|
|
536
548
|
text: {
|
|
537
549
|
primary: "#000000",
|
|
538
550
|
secondary: "#000000",
|
|
@@ -1110,6 +1122,59 @@ var themeConfig = (mode = "dark") => ({
|
|
|
1110
1122
|
};
|
|
1111
1123
|
return configs[size];
|
|
1112
1124
|
},
|
|
1125
|
+
tabsSegmented: (size) => {
|
|
1126
|
+
const configs = {
|
|
1127
|
+
xl: {
|
|
1128
|
+
height: 64,
|
|
1129
|
+
containerPadding: 4,
|
|
1130
|
+
containerRadius: 4,
|
|
1131
|
+
itemPaddingHorizontal: 16,
|
|
1132
|
+
itemPaddingVertical: 18,
|
|
1133
|
+
itemRadius: 2,
|
|
1134
|
+
fontSize: 20,
|
|
1135
|
+
lineHeight: 22,
|
|
1136
|
+
iconSize: 24,
|
|
1137
|
+
gap: 8
|
|
1138
|
+
},
|
|
1139
|
+
lg: {
|
|
1140
|
+
height: 56,
|
|
1141
|
+
containerPadding: 4,
|
|
1142
|
+
containerRadius: 4,
|
|
1143
|
+
itemPaddingHorizontal: 16,
|
|
1144
|
+
itemPaddingVertical: 14,
|
|
1145
|
+
itemRadius: 2,
|
|
1146
|
+
fontSize: 18,
|
|
1147
|
+
lineHeight: 20,
|
|
1148
|
+
iconSize: 24,
|
|
1149
|
+
gap: 8
|
|
1150
|
+
},
|
|
1151
|
+
md: {
|
|
1152
|
+
height: 48,
|
|
1153
|
+
containerPadding: 4,
|
|
1154
|
+
containerRadius: 4,
|
|
1155
|
+
itemPaddingHorizontal: 12,
|
|
1156
|
+
itemPaddingVertical: 11,
|
|
1157
|
+
itemRadius: 2,
|
|
1158
|
+
fontSize: 16,
|
|
1159
|
+
lineHeight: 18,
|
|
1160
|
+
iconSize: 24,
|
|
1161
|
+
gap: 6
|
|
1162
|
+
},
|
|
1163
|
+
sm: {
|
|
1164
|
+
height: 40,
|
|
1165
|
+
containerPadding: 3,
|
|
1166
|
+
containerRadius: 2,
|
|
1167
|
+
itemPaddingHorizontal: 12,
|
|
1168
|
+
itemPaddingVertical: 8,
|
|
1169
|
+
itemRadius: 2,
|
|
1170
|
+
fontSize: 14,
|
|
1171
|
+
lineHeight: 16,
|
|
1172
|
+
iconSize: 20,
|
|
1173
|
+
gap: 6
|
|
1174
|
+
}
|
|
1175
|
+
};
|
|
1176
|
+
return configs[size];
|
|
1177
|
+
},
|
|
1113
1178
|
badge: (size) => {
|
|
1114
1179
|
const configs = {
|
|
1115
1180
|
xl: {
|