@xsolla/xui-core 0.99.0 → 0.100.0-pr159.1771990165

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
@@ -1040,6 +1040,9 @@ declare const shadow: {
1040
1040
  };
1041
1041
 
1042
1042
  declare const fonts: {
1043
+ heading: string;
1044
+ body: string;
1045
+ /** @deprecated Use `heading` or `body` instead */
1043
1046
  primary: string;
1044
1047
  };
1045
1048
  declare const typography: {
@@ -1054,6 +1057,24 @@ declare const isNative: boolean;
1054
1057
  declare const isIOS: boolean;
1055
1058
  declare const isAndroid: boolean;
1056
1059
 
1060
+ /**
1061
+ * React component that loads the toolkit's font-face declarations.
1062
+ * Drop-in for any framework — works in Next.js, Vite, CRA, etc.
1063
+ *
1064
+ * Renders nothing to the DOM. Injects a single `<style>` tag into `<head>` on mount.
1065
+ */
1066
+ declare const FontLoader: React.FC;
1067
+
1068
+ /**
1069
+ * @font-face CSS for all toolkit fonts, loaded from Xsolla CDN.
1070
+ *
1071
+ * Pilat Wide — heading/display font, registered at weights 600–800.
1072
+ *
1073
+ * Aktiv Grotesk — body font, mapped from the Sharp Grotesk CDN files
1074
+ * which are the same typeface under a legacy name.
1075
+ */
1076
+ declare const fontFacesCSS = "\n /* \u2500\u2500 Pilat Wide (headings) \u2500\u2500 */\n\n @font-face {\n font-family: 'Pilat Wide';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Demi_Bold_bee67c470a/Pilat_Test_Demi_Bold_bee67c470a.ttf') format('truetype');\n font-weight: 600;\n font-style: normal;\n font-display: swap;\n }\n @font-face {\n font-family: 'Pilat Wide';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Bold_b12b40d234/Pilat_Test_Bold_b12b40d234.ttf') format('truetype');\n font-weight: 700;\n font-style: normal;\n font-display: swap;\n }\n @font-face {\n font-family: 'Pilat Wide';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Heavy_2885678ca4/Pilat_Test_Heavy_2885678ca4.otf') format('opentype');\n font-weight: 800;\n font-style: normal;\n font-display: swap;\n }\n\n /* \u2500\u2500 Aktiv Grotesk (body) \u2014 served from Sharp Grotesk CDN files \u2500\u2500 */\n\n @font-face {\n font-family: 'Aktiv Grotesk';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Light_c4650750bb/Pilat_Test_Light_c4650750bb.otf') format('opentype');\n font-weight: 300;\n font-style: normal;\n font-display: swap;\n }\n @font-face {\n font-family: 'Aktiv Grotesk';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Book_5cb49cd592/Pilat_Test_Book_5cb49cd592.otf') format('opentype');\n font-weight: 400;\n font-style: normal;\n font-display: swap;\n }\n @font-face {\n font-family: 'Aktiv Grotesk';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Demi_e9bed59107/Pilat_Test_Demi_e9bed59107.otf') format('opentype');\n font-weight: 500;\n font-style: normal;\n font-display: swap;\n }\n @font-face {\n font-family: 'Aktiv Grotesk';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Bold_195d1b44fa/Pilat_Test_Bold_195d1b44fa.otf') format('opentype');\n font-weight: 700;\n font-style: normal;\n font-display: swap;\n }\n";
1077
+
1057
1078
  type ThemeMode = "dark" | "light";
1058
1079
  declare const themeConfig: (mode?: ThemeMode) => {
1059
1080
  colors: {
@@ -1748,10 +1769,14 @@ declare const themeConfig: (mode?: ThemeMode) => {
1748
1769
  modal: string;
1749
1770
  };
1750
1771
  fonts: {
1772
+ heading: string;
1773
+ body: string;
1751
1774
  primary: string;
1752
1775
  };
1753
1776
  typography: {
1754
1777
  primary: string;
1778
+ heading: string;
1779
+ body: string;
1755
1780
  };
1756
1781
  sizing: {
1757
1782
  button: (size: "xl" | "lg" | "md" | "sm" | "xs") => {
@@ -2607,6 +2632,8 @@ interface DesignSystemContextType {
2607
2632
  declare const XUIProvider: React.FC<{
2608
2633
  children: React.ReactNode;
2609
2634
  initialMode?: ThemeMode;
2635
+ /** Load toolkit fonts from the Xsolla CDN. Defaults to true on web, no-ops on native. */
2636
+ loadFonts?: boolean;
2610
2637
  }>;
2611
2638
  declare const useDesignSystem: () => DesignSystemContextType;
2612
2639
  declare const useId: () => string;
@@ -2623,4 +2650,4 @@ declare const ModalIdContext: React.Context<string | null>;
2623
2650
  */
2624
2651
  declare const useModalId: () => string | null;
2625
2652
 
2626
- export { ModalIdContext, type ThemeColors, type ThemeMode, XUIProvider, colors, fonts, isAndroid, isIOS, isNative, isWeb, radius, shadow, spacing, themeConfig, typography, useDesignSystem, useId, useModalId };
2653
+ export { FontLoader, ModalIdContext, type ThemeColors, type ThemeMode, XUIProvider, colors, fontFacesCSS, fonts, isAndroid, isIOS, isNative, isWeb, radius, shadow, spacing, themeConfig, typography, useDesignSystem, useId, useModalId };
package/index.d.ts CHANGED
@@ -1040,6 +1040,9 @@ declare const shadow: {
1040
1040
  };
1041
1041
 
1042
1042
  declare const fonts: {
1043
+ heading: string;
1044
+ body: string;
1045
+ /** @deprecated Use `heading` or `body` instead */
1043
1046
  primary: string;
1044
1047
  };
1045
1048
  declare const typography: {
@@ -1054,6 +1057,24 @@ declare const isNative: boolean;
1054
1057
  declare const isIOS: boolean;
1055
1058
  declare const isAndroid: boolean;
1056
1059
 
1060
+ /**
1061
+ * React component that loads the toolkit's font-face declarations.
1062
+ * Drop-in for any framework — works in Next.js, Vite, CRA, etc.
1063
+ *
1064
+ * Renders nothing to the DOM. Injects a single `<style>` tag into `<head>` on mount.
1065
+ */
1066
+ declare const FontLoader: React.FC;
1067
+
1068
+ /**
1069
+ * @font-face CSS for all toolkit fonts, loaded from Xsolla CDN.
1070
+ *
1071
+ * Pilat Wide — heading/display font, registered at weights 600–800.
1072
+ *
1073
+ * Aktiv Grotesk — body font, mapped from the Sharp Grotesk CDN files
1074
+ * which are the same typeface under a legacy name.
1075
+ */
1076
+ declare const fontFacesCSS = "\n /* \u2500\u2500 Pilat Wide (headings) \u2500\u2500 */\n\n @font-face {\n font-family: 'Pilat Wide';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Demi_Bold_bee67c470a/Pilat_Test_Demi_Bold_bee67c470a.ttf') format('truetype');\n font-weight: 600;\n font-style: normal;\n font-display: swap;\n }\n @font-face {\n font-family: 'Pilat Wide';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Bold_b12b40d234/Pilat_Test_Bold_b12b40d234.ttf') format('truetype');\n font-weight: 700;\n font-style: normal;\n font-display: swap;\n }\n @font-face {\n font-family: 'Pilat Wide';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Heavy_2885678ca4/Pilat_Test_Heavy_2885678ca4.otf') format('opentype');\n font-weight: 800;\n font-style: normal;\n font-display: swap;\n }\n\n /* \u2500\u2500 Aktiv Grotesk (body) \u2014 served from Sharp Grotesk CDN files \u2500\u2500 */\n\n @font-face {\n font-family: 'Aktiv Grotesk';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Light_c4650750bb/Pilat_Test_Light_c4650750bb.otf') format('opentype');\n font-weight: 300;\n font-style: normal;\n font-display: swap;\n }\n @font-face {\n font-family: 'Aktiv Grotesk';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Book_5cb49cd592/Pilat_Test_Book_5cb49cd592.otf') format('opentype');\n font-weight: 400;\n font-style: normal;\n font-display: swap;\n }\n @font-face {\n font-family: 'Aktiv Grotesk';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Demi_e9bed59107/Pilat_Test_Demi_e9bed59107.otf') format('opentype');\n font-weight: 500;\n font-style: normal;\n font-display: swap;\n }\n @font-face {\n font-family: 'Aktiv Grotesk';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Bold_195d1b44fa/Pilat_Test_Bold_195d1b44fa.otf') format('opentype');\n font-weight: 700;\n font-style: normal;\n font-display: swap;\n }\n";
1077
+
1057
1078
  type ThemeMode = "dark" | "light";
1058
1079
  declare const themeConfig: (mode?: ThemeMode) => {
1059
1080
  colors: {
@@ -1748,10 +1769,14 @@ declare const themeConfig: (mode?: ThemeMode) => {
1748
1769
  modal: string;
1749
1770
  };
1750
1771
  fonts: {
1772
+ heading: string;
1773
+ body: string;
1751
1774
  primary: string;
1752
1775
  };
1753
1776
  typography: {
1754
1777
  primary: string;
1778
+ heading: string;
1779
+ body: string;
1755
1780
  };
1756
1781
  sizing: {
1757
1782
  button: (size: "xl" | "lg" | "md" | "sm" | "xs") => {
@@ -2607,6 +2632,8 @@ interface DesignSystemContextType {
2607
2632
  declare const XUIProvider: React.FC<{
2608
2633
  children: React.ReactNode;
2609
2634
  initialMode?: ThemeMode;
2635
+ /** Load toolkit fonts from the Xsolla CDN. Defaults to true on web, no-ops on native. */
2636
+ loadFonts?: boolean;
2610
2637
  }>;
2611
2638
  declare const useDesignSystem: () => DesignSystemContextType;
2612
2639
  declare const useId: () => string;
@@ -2623,4 +2650,4 @@ declare const ModalIdContext: React.Context<string | null>;
2623
2650
  */
2624
2651
  declare const useModalId: () => string | null;
2625
2652
 
2626
- export { ModalIdContext, type ThemeColors, type ThemeMode, XUIProvider, colors, fonts, isAndroid, isIOS, isNative, isWeb, radius, shadow, spacing, themeConfig, typography, useDesignSystem, useId, useModalId };
2653
+ export { FontLoader, ModalIdContext, type ThemeColors, type ThemeMode, XUIProvider, colors, fontFacesCSS, fonts, isAndroid, isIOS, isNative, isWeb, radius, shadow, spacing, themeConfig, typography, useDesignSystem, useId, useModalId };
package/index.js CHANGED
@@ -30,9 +30,11 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
30
30
  // src/index.tsx
31
31
  var index_exports = {};
32
32
  __export(index_exports, {
33
+ FontLoader: () => FontLoader,
33
34
  ModalIdContext: () => ModalIdContext,
34
35
  XUIProvider: () => XUIProvider,
35
36
  colors: () => colors,
37
+ fontFacesCSS: () => fontFacesCSS,
36
38
  fonts: () => fonts,
37
39
  isAndroid: () => isAndroid,
38
40
  isIOS: () => isIOS,
@@ -48,7 +50,7 @@ __export(index_exports, {
48
50
  useModalId: () => useModalId
49
51
  });
50
52
  module.exports = __toCommonJS(index_exports);
51
- var import_react = __toESM(require("react"));
53
+ var import_react2 = __toESM(require("react"));
52
54
 
53
55
  // src/tokens/xsolla-dark.json
54
56
  var xsolla_dark_default = {
@@ -758,22 +760,108 @@ var shadow = {
758
760
 
759
761
  // src/tokens/fonts.ts
760
762
  var fonts = {
761
- // Use a string that works for web but can be parsed/ignored by native
762
- primary: '"Pilat Wide Bold", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'
763
+ heading: '"Pilat Wide", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif',
764
+ body: '"Aktiv Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif',
765
+ /** @deprecated Use `heading` or `body` instead */
766
+ primary: '"Aktiv Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'
763
767
  };
764
768
  var typography = {
765
769
  button: {
766
- fontFamily: fonts.primary,
770
+ fontFamily: fonts.body,
767
771
  fontWeight: "bold"
768
772
  }
769
773
  };
770
774
 
775
+ // src/fonts/FontLoader.tsx
776
+ var import_react = require("react");
777
+
771
778
  // src/platform.ts
772
779
  var isWeb = typeof document !== "undefined";
773
780
  var isNative = !isWeb;
774
781
  var isIOS = isNative && typeof global !== "undefined" && global.Platform?.OS === "ios";
775
782
  var isAndroid = isNative && typeof global !== "undefined" && global.Platform?.OS === "android";
776
783
 
784
+ // src/fonts/fontFaces.ts
785
+ var CDN_BASE = "https://cdn.xsolla.net/strapi-v2-bucket-prod";
786
+ var fontFacesCSS = `
787
+ /* \u2500\u2500 Pilat Wide (headings) \u2500\u2500 */
788
+
789
+ @font-face {
790
+ font-family: 'Pilat Wide';
791
+ src: url('${CDN_BASE}/Pilat_Test_Demi_Bold_bee67c470a/Pilat_Test_Demi_Bold_bee67c470a.ttf') format('truetype');
792
+ font-weight: 600;
793
+ font-style: normal;
794
+ font-display: swap;
795
+ }
796
+ @font-face {
797
+ font-family: 'Pilat Wide';
798
+ src: url('${CDN_BASE}/Pilat_Test_Bold_b12b40d234/Pilat_Test_Bold_b12b40d234.ttf') format('truetype');
799
+ font-weight: 700;
800
+ font-style: normal;
801
+ font-display: swap;
802
+ }
803
+ @font-face {
804
+ font-family: 'Pilat Wide';
805
+ src: url('${CDN_BASE}/Pilat_Test_Heavy_2885678ca4/Pilat_Test_Heavy_2885678ca4.otf') format('opentype');
806
+ font-weight: 800;
807
+ font-style: normal;
808
+ font-display: swap;
809
+ }
810
+
811
+ /* \u2500\u2500 Aktiv Grotesk (body) \u2014 served from Sharp Grotesk CDN files \u2500\u2500 */
812
+
813
+ @font-face {
814
+ font-family: 'Aktiv Grotesk';
815
+ src: url('${CDN_BASE}/Pilat_Test_Light_c4650750bb/Pilat_Test_Light_c4650750bb.otf') format('opentype');
816
+ font-weight: 300;
817
+ font-style: normal;
818
+ font-display: swap;
819
+ }
820
+ @font-face {
821
+ font-family: 'Aktiv Grotesk';
822
+ src: url('${CDN_BASE}/Pilat_Test_Book_5cb49cd592/Pilat_Test_Book_5cb49cd592.otf') format('opentype');
823
+ font-weight: 400;
824
+ font-style: normal;
825
+ font-display: swap;
826
+ }
827
+ @font-face {
828
+ font-family: 'Aktiv Grotesk';
829
+ src: url('${CDN_BASE}/Pilat_Test_Demi_e9bed59107/Pilat_Test_Demi_e9bed59107.otf') format('opentype');
830
+ font-weight: 500;
831
+ font-style: normal;
832
+ font-display: swap;
833
+ }
834
+ @font-face {
835
+ font-family: 'Aktiv Grotesk';
836
+ src: url('${CDN_BASE}/Pilat_Test_Bold_195d1b44fa/Pilat_Test_Bold_195d1b44fa.otf') format('opentype');
837
+ font-weight: 700;
838
+ font-style: normal;
839
+ font-display: swap;
840
+ }
841
+ `;
842
+
843
+ // src/fonts/FontLoader.tsx
844
+ var injected = false;
845
+ function injectFontStyles() {
846
+ if (!isWeb || injected) return;
847
+ const style = document.createElement("style");
848
+ style.setAttribute("data-xui-fonts", "");
849
+ style.textContent = fontFacesCSS;
850
+ document.head.appendChild(style);
851
+ injected = true;
852
+ }
853
+ var FontLoader = () => {
854
+ const mountedRef = (0, import_react.useRef)(false);
855
+ (0, import_react.useEffect)(() => {
856
+ if (!mountedRef.current) {
857
+ injectFontStyles();
858
+ mountedRef.current = true;
859
+ }
860
+ }, []);
861
+ return null;
862
+ };
863
+ FontLoader.displayName = "FontLoader";
864
+
777
865
  // src/index.tsx
778
866
  var import_jsx_runtime = require("react/jsx-runtime");
779
867
  var themeConfig = (mode = "dark") => ({
@@ -783,7 +871,9 @@ var themeConfig = (mode = "dark") => ({
783
871
  shadow,
784
872
  fonts,
785
873
  typography: {
786
- primary: fonts.primary
874
+ primary: fonts.body,
875
+ heading: fonts.heading,
876
+ body: fonts.body
787
877
  },
788
878
  sizing: {
789
879
  button: (size) => {
@@ -1621,12 +1711,12 @@ var themeConfig = (mode = "dark") => ({
1621
1711
  }
1622
1712
  }
1623
1713
  });
1624
- var DesignSystemContext = (0, import_react.createContext)(
1714
+ var DesignSystemContext = (0, import_react2.createContext)(
1625
1715
  void 0
1626
1716
  );
1627
- var XUIProvider = ({ children, initialMode = "dark" }) => {
1628
- const [mode, setMode] = (0, import_react.useState)(initialMode);
1629
- const value = (0, import_react.useMemo)(
1717
+ var XUIProvider = ({ children, initialMode = "dark", loadFonts = true }) => {
1718
+ const [mode, setMode] = (0, import_react2.useState)(initialMode);
1719
+ const value = (0, import_react2.useMemo)(
1630
1720
  () => ({
1631
1721
  mode,
1632
1722
  setMode,
@@ -1634,10 +1724,13 @@ var XUIProvider = ({ children, initialMode = "dark" }) => {
1634
1724
  }),
1635
1725
  [mode]
1636
1726
  );
1637
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DesignSystemContext.Provider, { value, children });
1727
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(DesignSystemContext.Provider, { value, children: [
1728
+ loadFonts && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FontLoader, {}),
1729
+ children
1730
+ ] });
1638
1731
  };
1639
1732
  var useDesignSystem = () => {
1640
- const context = (0, import_react.useContext)(DesignSystemContext);
1733
+ const context = (0, import_react2.useContext)(DesignSystemContext);
1641
1734
  if (!context) {
1642
1735
  return {
1643
1736
  mode: "dark",
@@ -1649,19 +1742,21 @@ var useDesignSystem = () => {
1649
1742
  return context;
1650
1743
  };
1651
1744
  var idCounter = 0;
1652
- var hasReactUseId = typeof import_react.default.useId === "function";
1745
+ var hasReactUseId = typeof import_react2.default.useId === "function";
1653
1746
  var useIdFallback = () => {
1654
- const [id] = (0, import_react.useState)(() => `xui-${++idCounter}`);
1747
+ const [id] = (0, import_react2.useState)(() => `xui-${++idCounter}`);
1655
1748
  return id;
1656
1749
  };
1657
- var useId = hasReactUseId ? import_react.default.useId : useIdFallback;
1658
- var ModalIdContext = (0, import_react.createContext)(null);
1659
- var useModalId = () => (0, import_react.useContext)(ModalIdContext);
1750
+ var useId = hasReactUseId ? import_react2.default.useId : useIdFallback;
1751
+ var ModalIdContext = (0, import_react2.createContext)(null);
1752
+ var useModalId = () => (0, import_react2.useContext)(ModalIdContext);
1660
1753
  // Annotate the CommonJS export names for ESM import in node:
1661
1754
  0 && (module.exports = {
1755
+ FontLoader,
1662
1756
  ModalIdContext,
1663
1757
  XUIProvider,
1664
1758
  colors,
1759
+ fontFacesCSS,
1665
1760
  fonts,
1666
1761
  isAndroid,
1667
1762
  isIOS,
package/index.js.flow CHANGED
@@ -706,13 +706,36 @@ surfaceHover: string,
706
706
  popover: string,
707
707
  modal: string,...
708
708
  };declare var fonts: {
709
+ heading: string,
710
+ body: string,
711
+
712
+ /**
713
+ * @deprecated Use `heading` or `body` instead
714
+ */
709
715
  primary: string,...
710
716
  };declare var typography: {
711
717
  button: {
712
718
  fontFamily: string,
713
719
  fontWeight: string,...
714
720
  },...
715
- };declare var isWeb: boolean;declare var isNative: boolean;declare var isIOS: boolean;declare var isAndroid: boolean;declare type ThemeMode = "dark" | "light";declare var themeConfig: (
721
+ };declare var isWeb: boolean;declare var isNative: boolean;declare var isIOS: boolean;declare var isAndroid: boolean;
722
+ /**
723
+ * React component that loads the toolkit's font-face declarations.
724
+ * Drop-in for any framework — works in Next.js, Vite, CRA, etc.
725
+ *
726
+ * Renders nothing to the DOM. Injects a single `<style>` tag into `<head>` on mount.
727
+ */
728
+ declare var FontLoader: React.FC;
729
+ /**
730
+ * @font-face CSS for all toolkit fonts, loaded from Xsolla CDN.
731
+ *
732
+ * Pilat Wide — heading/display font, registered at weights 600–800.
733
+ *
734
+ * Aktiv Grotesk — body font, mapped from the Sharp Grotesk CDN files
735
+ * which are the same typeface under a legacy name.
736
+ */
737
+ declare var fontFacesCSS: "\n /* ── Pilat Wide (headings) ── */\n\n @font-face {\n font-family: 'Pilat Wide';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Demi_Bold_bee67c470a/Pilat_Test_Demi_Bold_bee67c470a.ttf') format('truetype');\n font-weight: 600;\n font-style: normal;\n font-display: swap;\n }\n @font-face {\n font-family: 'Pilat Wide';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Bold_b12b40d234/Pilat_Test_Bold_b12b40d234.ttf') format('truetype');\n font-weight: 700;\n font-style: normal;\n font-display: swap;\n }\n @font-face {\n font-family: 'Pilat Wide';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Heavy_2885678ca4/Pilat_Test_Heavy_2885678ca4.otf') format('opentype');\n font-weight: 800;\n font-style: normal;\n font-display: swap;\n }\n\n /* ── Aktiv Grotesk (body) — served from Sharp Grotesk CDN files ── */\n\n @font-face {\n font-family: 'Aktiv Grotesk';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Light_c4650750bb/Pilat_Test_Light_c4650750bb.otf') format('opentype');\n font-weight: 300;\n font-style: normal;\n font-display: swap;\n }\n @font-face {\n font-family: 'Aktiv Grotesk';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Book_5cb49cd592/Pilat_Test_Book_5cb49cd592.otf') format('opentype');\n font-weight: 400;\n font-style: normal;\n font-display: swap;\n }\n @font-face {\n font-family: 'Aktiv Grotesk';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Demi_e9bed59107/Pilat_Test_Demi_e9bed59107.otf') format('opentype');\n font-weight: 500;\n font-style: normal;\n font-display: swap;\n }\n @font-face {\n font-family: 'Aktiv Grotesk';\n src: url('https://cdn.xsolla.net/strapi-v2-bucket-prod/Pilat_Test_Bold_195d1b44fa/Pilat_Test_Bold_195d1b44fa.otf') format('opentype');\n font-weight: 700;\n font-style: normal;\n font-display: swap;\n }\n"
738
+ ;declare type ThemeMode = "dark" | "light";declare var themeConfig: (
716
739
  mode?: ThemeMode) => {
717
740
  colors: {
718
741
  background: {
@@ -1406,10 +1429,14 @@ popover: string,
1406
1429
  modal: string,...
1407
1430
  },
1408
1431
  fonts: {
1432
+ heading: string,
1433
+ body: string,
1409
1434
  primary: string,...
1410
1435
  },
1411
1436
  typography: {
1412
- primary: string,...
1437
+ primary: string,
1438
+ heading: string,
1439
+ body: string,...
1413
1440
  },
1414
1441
  sizing: {
1415
1442
  button: (
@@ -2387,7 +2414,12 @@ setMode: (mode: ThemeMode) => void,
2387
2414
  theme: $Call<<R>((...args: any[]) => R) => R, typeof themeConfig>,
2388
2415
  } declare var XUIProvider: React.FC<{
2389
2416
  children: React.ReactNode,
2390
- initialMode?: ThemeMode,...
2417
+ initialMode?: ThemeMode,
2418
+
2419
+ /**
2420
+ * Load toolkit fonts from the Xsolla CDN. Defaults to true on web, no-ops on native.
2421
+ */
2422
+ loadFonts?: boolean,...
2391
2423
  }>;declare var useDesignSystem: () => DesignSystemContextType;declare var useId: () => string;
2392
2424
  /**
2393
2425
  * Context for the current modal's ID.
@@ -2404,5 +2436,5 @@ declare var useModalId: () => string | null;export type {
2404
2436
  ThemeColors,ThemeMode
2405
2437
  }
2406
2438
  declare export {
2407
- ModalIdContext,XUIProvider,colors,fonts,isAndroid,isIOS,isNative,isWeb,radius,shadow,spacing,themeConfig,typography,useDesignSystem,useId,useModalId
2439
+ FontLoader,ModalIdContext,XUIProvider,colors,fontFacesCSS,fonts,isAndroid,isIOS,isNative,isWeb,radius,shadow,spacing,themeConfig,typography,useDesignSystem,useId,useModalId
2408
2440
  }