@xsolla/switch-theme-customization 0.187.3 → 0.188.1

package/index.mjs

@@ -1937,45 +1937,51 @@ var themesColorsScheme = {
   emailsDark: emailsDarkScheme
 };
 
-// src/pentagram-primitives/typo-primitives.json
+// src/xui-primitives/typo-primitives.json
 var typo_primitives_default = {
   heading: {
     h1: {
-      fontSize: "450",
-      lineHeight: "display/450",
+      fontFamily: "font-family/display",
+      fontSize: "font-size/450",
+      lineHeight: "line-height-display/450",
       fontWeight: 700
     },
     h2: {
-      fontSize: "350",
-      lineHeight: "display/350",
+      fontFamily: "font-family/display",
+      fontSize: "font-size/350",
+      lineHeight: "line-height-display/350",
       fontWeight: 700
     },
     h3: {
-      fontSize: "300",
-      lineHeight: "display/300",
+      fontFamily: "font-family/display",
+      fontSize: "font-size/300",
+      lineHeight: "line-height-display/300",
       fontWeight: 700
     },
     h4: {
-      fontSize: "250",
-      lineHeight: "display/250",
+      fontFamily: "font-family/display",
+      fontSize: "font-size/250",
+      lineHeight: "line-height-display/250",
       fontWeight: 700
     },
     h5: {
-      fontSize: "200",
-      lineHeight: "display/200",
+      fontFamily: "font-family/display",
+      fontSize: "font-size/200",
+      lineHeight: "line-height-display/200",
       fontWeight: 700
     }
   },
   basic: {
     display: {
-      fontFamily: "compact",
-      fontSize: "300",
-      lineHeight: "compact/300",
+      fontFamily: "font-family/compact",
+      fontSize: "font-size/300",
+      lineHeight: "line-height-compact/300",
       fontWeight: 500
     },
     bodyLg: {
-      fontSize: "175",
-      lineHeight: "compact/175",
+      fontFamily: "font-family/compact",
+      fontSize: "font-size/175",
+      lineHeight: "line-height-compact/175",
       default: {
         fontWeight: 400
       },
@@ -1984,12 +1990,13 @@ var typo_primitives_default = {
       },
       paragraph: {
         spacing: "spacing/250",
-        lineHeight: "text/175"
+        lineHeight: "line-height-text/175"
       }
     },
     bodyMd: {
-      fontSize: "150",
-      lineHeight: "compact/150",
+      fontFamily: "font-family/compact",
+      fontSize: "font-size/150",
+      lineHeight: "line-height-compact/150",
       default: {
         fontWeight: 400
       },
@@ -1998,12 +2005,13 @@ var typo_primitives_default = {
       },
       paragraph: {
         spacing: "spacing/200",
-        lineHeight: "text/150"
+        lineHeight: "line-height-text/150"
       }
     },
     bodySm: {
-      fontSize: "125",
-      lineHeight: "compact/125",
+      fontFamily: "font-family/compact",
+      fontSize: "font-size/125",
+      lineHeight: "line-height-compact/125",
       default: {
         fontWeight: 400
       },
@@ -2012,12 +2020,13 @@ var typo_primitives_default = {
       },
       paragraph: {
         spacing: "spacing/150",
-        lineHeight: "text/125"
+        lineHeight: "line-height-text/125"
       }
     },
     bodyXs: {
-      fontSize: "100",
-      lineHeight: "compact/100",
+      fontFamily: "font-family/compact",
+      fontSize: "font-size/100",
+      lineHeight: "line-height-compact/100",
       default: {
         fontWeight: 400
       },
@@ -2026,12 +2035,13 @@ var typo_primitives_default = {
       },
       paragraph: {
         spacing: "spacing/100",
-        lineHeight: "text/100"
+        lineHeight: "line-height-text/100"
       }
     },
     bodyXxs: {
-      fontSize: "75",
-      lineHeight: "compact/75",
+      fontFamily: "font-family/compact",
+      fontSize: "font-size/75",
+      lineHeight: "line-height-compact/75",
       default: {
         fontWeight: 400
       },
@@ -2040,68 +2050,179 @@ var typo_primitives_default = {
       },
       paragraph: {
         spacing: "spacing/75",
-        lineHeight: "text/75"
+        lineHeight: "line-height-text/75"
       }
     }
   },
   control: {
     button: {
-      xl: { scale: "600" },
-      lg: { scale: "500" },
-      md: { scale: "400" },
-      sm: { scale: "300" },
-      xs: { scale: "200" }
+      xl: {
+        fontSize: "component-scale-font-size/600",
+        lineHeight: "component-scale-line-height/600"
+      },
+      lg: {
+        fontSize: "component-scale-font-size/500",
+        lineHeight: "component-scale-line-height/500"
+      },
+      md: {
+        fontSize: "component-scale-font-size/400",
+        lineHeight: "component-scale-line-height/400"
+      },
+      sm: {
+        fontSize: "component-scale-font-size/300",
+        lineHeight: "component-scale-line-height/300"
+      },
+      xs: {
+        fontSize: "component-scale-font-size/200",
+        lineHeight: "component-scale-line-height/200"
+      }
     },
     input: {
-      xl: { scale: "600" },
-      lg: { scale: "500" },
-      md: { scale: "400" },
-      sm: { scale: "300" },
-      xs: { scale: "200" }
+      xl: {
+        fontSize: "component-scale-font-size/600",
+        lineHeight: "component-scale-line-height/600"
+      },
+      lg: {
+        fontSize: "component-scale-font-size/500",
+        lineHeight: "component-scale-line-height/500"
+      },
+      md: {
+        fontSize: "component-scale-font-size/400",
+        lineHeight: "component-scale-line-height/400"
+      },
+      sm: {
+        fontSize: "component-scale-font-size/300",
+        lineHeight: "component-scale-line-height/300"
+      },
+      xs: {
+        fontSize: "component-scale-font-size/200",
+        lineHeight: "component-scale-line-height/200"
+      }
     },
     checkbox: {
-      xl: { scale: "600" },
-      lg: { scale: "500" },
-      md: { scale: "400" },
-      sm: { scale: "300" }
+      xl: {
+        fontSize: "component-scale-font-size/600",
+        lineHeight: "component-scale-line-height/600"
+      },
+      lg: {
+        fontSize: "component-scale-font-size/500",
+        lineHeight: "component-scale-line-height/500"
+      },
+      md: {
+        fontSize: "component-scale-font-size/400",
+        lineHeight: "component-scale-line-height/400"
+      },
+      sm: {
+        fontSize: "component-scale-font-size/300",
+        lineHeight: "component-scale-line-height/300"
+      }
     },
     tab: {
-      xl: { scale: "600" },
-      lg: { scale: "500" },
-      md: { scale: "400" },
-      sm: { scale: "300" },
-      xs: { scale: "300" }
+      xl: {
+        fontSize: "component-scale-font-size/600",
+        lineHeight: "component-scale-line-height/600"
+      },
+      lg: {
+        fontSize: "component-scale-font-size/500",
+        lineHeight: "component-scale-line-height/500"
+      },
+      md: {
+        fontSize: "component-scale-font-size/400",
+        lineHeight: "component-scale-line-height/400"
+      },
+      sm: {
+        fontSize: "component-scale-font-size/300",
+        lineHeight: "component-scale-line-height/300"
+      },
+      xs: {
+        fontSize: "component-scale-font-size/300",
+        lineHeight: "component-scale-line-height/300"
+      }
     },
     radio: {
-      xl: { scale: "600" },
-      lg: { scale: "500" },
-      md: { scale: "400" },
-      sm: { scale: "300" }
+      xl: {
+        fontSize: "component-scale-font-size/600",
+        lineHeight: "component-scale-line-height/600"
+      },
+      lg: {
+        fontSize: "component-scale-font-size/500",
+        lineHeight: "component-scale-line-height/500"
+      },
+      md: {
+        fontSize: "component-scale-font-size/400",
+        lineHeight: "component-scale-line-height/400"
+      },
+      sm: {
+        fontSize: "component-scale-font-size/300",
+        lineHeight: "component-scale-line-height/300"
+      }
     },
     segmentedItem: {
-      xl: { scale: "500" },
-      lg: { scale: "400" },
-      md: { scale: "300" },
-      sm: { scale: "200" }
+      xl: {
+        fontSize: "component-scale-font-size/500",
+        lineHeight: "component-scale-line-height/500"
+      },
+      lg: {
+        fontSize: "component-scale-font-size/400",
+        lineHeight: "component-scale-line-height/400"
+      },
+      md: {
+        fontSize: "component-scale-font-size/300",
+        lineHeight: "component-scale-line-height/300"
+      },
+      sm: {
+        fontSize: "component-scale-font-size/200",
+        lineHeight: "component-scale-line-height/200"
+      }
     },
     tag: {
-      xl: { scale: "600" },
-      lg: { scale: "500" },
-      md: { scale: "400" },
-      sm: { scale: "300" },
-      xs: { scale: "200" }
+      xl: {
+        fontSize: "component-scale-font-size/600",
+        lineHeight: "component-scale-line-height/600"
+      },
+      lg: {
+        fontSize: "component-scale-font-size/500",
+        lineHeight: "component-scale-line-height/500"
+      },
+      md: {
+        fontSize: "component-scale-font-size/400",
+        lineHeight: "component-scale-line-height/400"
+      },
+      sm: {
+        fontSize: "component-scale-font-size/300",
+        lineHeight: "component-scale-line-height/300"
+      },
+      xs: {
+        fontSize: "component-scale-font-size/200",
+        lineHeight: "component-scale-line-height/200"
+      }
     },
     toggleButton: {
-      xl: { scale: "600" },
-      lg: { scale: "500" },
-      md: { scale: "400" },
-      sm: { scale: "300" },
-      xs: { scale: "200" }
+      xl: {
+        fontSize: "component-scale-font-size/600",
+        lineHeight: "component-scale-line-height/600"
+      },
+      lg: {
+        fontSize: "component-scale-font-size/500",
+        lineHeight: "component-scale-line-height/500"
+      },
+      md: {
+        fontSize: "component-scale-font-size/400",
+        lineHeight: "component-scale-line-height/400"
+      },
+      sm: {
+        fontSize: "component-scale-font-size/300",
+        lineHeight: "component-scale-line-height/300"
+      },
+      xs: {
+        fontSize: "component-scale-font-size/200",
+        lineHeight: "component-scale-line-height/200"
+      }
     }
   }
 };
 
-// src/pentagram-primitives/shape-primitives.json
+// src/xui-primitives/shape-primitives.json
 var shape_primitives_default = {
   button: {
     xl: {
@@ -2379,7 +2500,7 @@ var shape_primitives_default = {
   }
 };
 
-// src/pentagram-to-legacy/pentagram-resolver.ts
+// src/xui-to-legacy/xui-resolver.ts
 var FONT_SIZE_SCALE = {
   "75": { desktop: "10px", mobile: "10px" },
   "100": { desktop: "12px", mobile: "11px" },
@@ -2441,18 +2562,20 @@ var LINE_HEIGHT_TEXT = {
   "750": { desktop: "88px", mobile: "72px" }
 };
 var TYPOGRAPHY_SCALE_FONT_SIZE = {
-  "200": "10px",
-  "300": "12px",
-  "400": "14px",
-  "500": "16px",
-  "600": "18px"
+  "100": "10px",
+  "200": "12px",
+  "300": "14px",
+  "400": "16px",
+  "500": "18px",
+  "600": "20px"
 };
 var TYPOGRAPHY_SCALE_LINE_HEIGHT = {
-  "200": "16px",
-  "300": "18px",
-  "400": "20px",
-  "500": "22px",
-  "600": "24px"
+  "100": "12px",
+  "200": "14px",
+  "300": "16px",
+  "400": "18px",
+  "500": "20px",
+  "600": "22px"
 };
 var SPACING_SCALE = {
   "50": "2px",
@@ -2487,7 +2610,7 @@ var STROKE_SCALE = {
   "2": "2px",
   "3": "3px"
 };
-var PentagramResolver = class {
+var XuiResolver = class {
   device;
   constructor(device = "desktop") {
     this.device = device;
@@ -2556,10 +2679,41 @@ var PentagramResolver = class {
       const step = alias.replace("typography-scale/line-height/", "");
       return TYPOGRAPHY_SCALE_LINE_HEIGHT[step] ?? alias;
     }
+    if (alias.startsWith("scale/")) {
+      const step = alias.replace("scale/", "");
+      return context === "lineHeight" ? TYPOGRAPHY_SCALE_LINE_HEIGHT[step] ?? alias : TYPOGRAPHY_SCALE_FONT_SIZE[step] ?? alias;
+    }
+    if (alias.startsWith("line-height-display/")) {
+      const step = alias.replace("line-height-display/", "");
+      const value = LINE_HEIGHT_DISPLAY[step];
+      return value ? value[this.device] : alias;
+    }
+    if (alias.startsWith("line-height-compact/")) {
+      const step = alias.replace("line-height-compact/", "");
+      const value = LINE_HEIGHT_COMPACT[step];
+      return value ? value[this.device] : alias;
+    }
+    if (alias.startsWith("line-height-text/")) {
+      const step = alias.replace("line-height-text/", "");
+      const value = LINE_HEIGHT_TEXT[step];
+      return value ? value[this.device] : alias;
+    }
+    if (alias.startsWith("component-scale-font-size/")) {
+      const step = alias.replace("component-scale-font-size/", "");
+      return TYPOGRAPHY_SCALE_FONT_SIZE[step] ?? alias;
+    }
+    if (alias.startsWith("component-scale-line-height/")) {
+      const step = alias.replace("component-scale-line-height/", "");
+      return TYPOGRAPHY_SCALE_LINE_HEIGHT[step] ?? alias;
+    }
     if (alias.startsWith("spacing/")) {
       const step = alias.replace("spacing/", "");
       return SPACING_SCALE[step] ?? alias;
     }
+    if (alias.startsWith("font-family/")) {
+      const key = alias.replace("font-family/", "");
+      return FONT_FAMILY[key] ?? alias;
+    }
     if (FONT_FAMILY[alias]) {
       return FONT_FAMILY[alias];
     }
@@ -2620,16 +2774,16 @@ var PentagramResolver = class {
   }
 };
 function createResolver(device = "desktop") {
-  return new PentagramResolver(device);
+  return new XuiResolver(device);
 }
 function resolveForDesktop(obj) {
-  return new PentagramResolver("desktop").resolvePrimitives(obj);
+  return new XuiResolver("desktop").resolvePrimitives(obj);
 }
 function resolveForMobile(obj) {
-  return new PentagramResolver("mobile").resolvePrimitives(obj);
+  return new XuiResolver("mobile").resolvePrimitives(obj);
 }
 
-// src/pentagram-to-legacy/map-pentagram-typo-to-legacy.ts
+// src/xui-to-legacy/map-xui-typo-to-legacy.ts
 function extractControlTypo(size, defaultFontWeight = 400) {
   if (!size) {
     return {
@@ -2660,8 +2814,8 @@ function buildParagraphStyle(variant) {
   };
 }
 var DEFAULT_FONT_FAMILY = `'GraphikLCWebUikit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif`;
-function mapPentagramTypoToLegacy(pentagram, fontFamily = DEFAULT_FONT_FAMILY) {
-  const { heading, basic, control } = pentagram;
+function mapXuiTypoToLegacy(xui, fontFamily = DEFAULT_FONT_FAMILY) {
+  const { heading, basic, control } = xui;
   return {
     fontFamily,
     core: {
@@ -2748,7 +2902,7 @@ var DELETED_LEGACY_TYPO_VARS = [
   "core.bodyLg"
 ];
 
-// src/pentagram-to-legacy/map-pentagram-shape-to-legacy.ts
+// src/xui-to-legacy/map-xui-shape-to-legacy.ts
 function getShapeBorderRadius(shape, preferredSize = "md", fallback = "8px") {
   if (!shape) return fallback;
   const size = shape[preferredSize] ?? shape["lg"] ?? shape["sm"] ?? Object.values(shape)[0];
@@ -2759,17 +2913,17 @@ function getShapeBorderWidth(shape, preferredSize = "md", fallback = "1px") {
   const size = shape[preferredSize] ?? shape["lg"] ?? shape["sm"] ?? Object.values(shape)[0];
   return size?.borderWidth ?? fallback;
 }
-function mapPentagramShapeToLegacy(pentagram, existingMisc) {
-  const buttonRadius = getShapeBorderRadius(pentagram.button, "md", "8px");
-  const inputRadius = getShapeBorderRadius(pentagram.input, "md", "8px");
-  const checkboxRadius = getShapeBorderRadius(pentagram.checkbox, "md", "4px");
-  const tagRadius = getShapeBorderRadius(pentagram.tag, "md", "8px");
-  const popupRadius = pentagram.modal?.borderRadius ?? pentagram.contextMenu?.md?.borderRadius ?? pentagram.tooltip?.md?.borderRadius ?? "8px";
-  const borderWidth = getShapeBorderWidth(pentagram.button, "md", "2px");
-  const buttonSm = pentagram.button?.sm?.borderRadius ?? "4px";
-  const buttonMd = pentagram.button?.md?.borderRadius ?? "6px";
-  const buttonLg = pentagram.button?.lg?.borderRadius ?? "8px";
-  const buttonXl = pentagram.button?.xl?.borderRadius ?? "8px";
+function mapXuiShapeToLegacy(xui, existingMisc) {
+  const buttonRadius = getShapeBorderRadius(xui.button, "md", "8px");
+  const inputRadius = getShapeBorderRadius(xui.input, "md", "8px");
+  const checkboxRadius = getShapeBorderRadius(xui.checkbox, "md", "4px");
+  const tagRadius = getShapeBorderRadius(xui.tag, "md", "8px");
+  const popupRadius = xui.modal?.borderRadius ?? xui.contextMenu?.md?.borderRadius ?? xui.tooltip?.md?.borderRadius ?? "8px";
+  const borderWidth = getShapeBorderWidth(xui.button, "md", "2px");
+  const buttonSm = xui.button?.sm?.borderRadius ?? "4px";
+  const buttonMd = xui.button?.md?.borderRadius ?? "6px";
+  const buttonLg = xui.button?.lg?.borderRadius ?? "8px";
+  const buttonXl = xui.button?.xl?.borderRadius ?? "8px";
   return {
     borderRadiusScale: {
       sm: existingMisc?.borderRadiusScale?.sm ?? buttonSm,
@@ -2791,7 +2945,7 @@ function mapPentagramShapeToLegacy(pentagram, existingMisc) {
     }
   };
 }
-function flattenPentagramShapeToVars(pentagram) {
+function flattenXuiShapeToVars(xui) {
   const vars = {};
   function addSizedComponent(name, shape) {
     if (!shape) return;
@@ -2804,32 +2958,32 @@ function flattenPentagramShapeToVars(pentagram) {
       }
     }
   }
-  addSizedComponent("button", pentagram.button);
-  addSizedComponent("input", pentagram.input);
-  addSizedComponent("checkbox", pentagram.checkbox);
-  addSizedComponent("tab", pentagram.tabItem);
-  addSizedComponent("tag", pentagram.tag);
-  addSizedComponent("radio", pentagram.radio);
-  addSizedComponent("switch", pentagram.switch);
-  addSizedComponent("segmented", pentagram.segmented);
-  addSizedComponent("segmentedItem", pentagram.segmentedItem);
-  addSizedComponent("tooltip", pentagram.tooltip);
-  addSizedComponent("contextMenu", pentagram.contextMenu);
-  addSizedComponent("avatar", pentagram.avatar);
-  addSizedComponent("toggleButtonGroup", pentagram.toggleButtonGroup);
-  if (pentagram.modal?.borderRadius) {
-    vars["shape-modal-borderRadius"] = pentagram.modal.borderRadius;
+  addSizedComponent("button", xui.button);
+  addSizedComponent("input", xui.input);
+  addSizedComponent("checkbox", xui.checkbox);
+  addSizedComponent("tab", xui.tabItem);
+  addSizedComponent("tag", xui.tag);
+  addSizedComponent("radio", xui.radio);
+  addSizedComponent("switch", xui.switch);
+  addSizedComponent("segmented", xui.segmented);
+  addSizedComponent("segmentedItem", xui.segmentedItem);
+  addSizedComponent("tooltip", xui.tooltip);
+  addSizedComponent("contextMenu", xui.contextMenu);
+  addSizedComponent("avatar", xui.avatar);
+  addSizedComponent("toggleButtonGroup", xui.toggleButtonGroup);
+  if (xui.modal?.borderRadius) {
+    vars["shape-modal-borderRadius"] = xui.modal.borderRadius;
   }
-  if (pentagram.cell?.borderRadius) {
-    vars["shape-cell-borderRadius"] = pentagram.cell.borderRadius;
+  if (xui.cell?.borderRadius) {
+    vars["shape-cell-borderRadius"] = xui.cell.borderRadius;
   }
-  if (pentagram.toast?.borderRadius) {
-    vars["shape-toast-borderRadius"] = pentagram.toast.borderRadius;
+  if (xui.toast?.borderRadius) {
+    vars["shape-toast-borderRadius"] = xui.toast.borderRadius;
   }
   return vars;
 }
 
-// src/themes/pentagram/mappers/scheme-to-legacy.ts
+// src/themes/xui/mappers/scheme-to-legacy.ts
 function mapThemeSchemeToLegacy(colors) {
   return {
     core: {
@@ -2839,9 +2993,9 @@ function mapThemeSchemeToLegacy(colors) {
         ghost: colors.overlay.mono,
         tone: colors.layer.scrim,
         selection: "transparent",
-        // deleted in Pentagram
+        // deleted in XUI
         hover: "transparent",
-        // deleted in Pentagram
+        // deleted in XUI
         brand: colors.background.brand.secondary,
         brandSecondary: colors.background.brandExtra.secondary,
         success: colors.background.success.secondary,
@@ -2947,8 +3101,8 @@ function mapThemeSchemeToLegacy(colors) {
   };
 }
 
-// src/pentagram-to-legacy/map-pentagram-theme-to-legacy.ts
-function buildBaseColorsFromPentagram(colors) {
+// src/xui-to-legacy/map-xui-theme-to-legacy.ts
+function buildBaseColorsFromXui(colors) {
   return {
     content: colors.content.primary,
     surface: colors.background.primary,
@@ -2962,22 +3116,22 @@ function buildBaseColorsFromPentagram(colors) {
     neutral: colors.content.neutral.primary
   };
 }
-function mapPentagramThemeToLegacy(pentagram, device = "desktop") {
+function mapXuiThemeToLegacy(xui, device = "desktop") {
   const resolver = createResolver(device);
-  const resolvedTypo = resolver.resolvePrimitives(pentagram.typo);
-  const resolvedShape = resolver.resolvePrimitives(pentagram.shape);
+  const resolvedTypo = resolver.resolvePrimitives(xui.text);
+  const resolvedShape = resolver.resolvePrimitives(xui.shape);
   return {
     colors: {
-      base: buildBaseColorsFromPentagram(pentagram.colors),
-      ...mapThemeSchemeToLegacy(pentagram.colors)
+      base: buildBaseColorsFromXui(xui.color),
+      ...mapThemeSchemeToLegacy(xui.color)
     },
-    typo: mapPentagramTypoToLegacy(resolvedTypo),
-    misc: mapPentagramShapeToLegacy(resolvedShape),
-    shadows: pentagram.shadows
+    typo: mapXuiTypoToLegacy(resolvedTypo),
+    misc: mapXuiShapeToLegacy(resolvedShape),
+    shadows: xui.shadow
   };
 }
 
-// src/themes/pentagram/presets/pay-station-dark.ts
+// src/themes/xui/presets/pay-station-dark.ts
 import { colord as colord10 } from "colord";
 var baseDark = {
   content: colord10("#ffffff"),
@@ -3000,7 +3154,7 @@ var baseDark = {
   onAlert: colord10("#000000"),
   onNeutral: colord10("#000000")
 };
-var pentagramDarkScheme = (b) => ({
+var xuiDarkScheme = (b) => ({
   base: {
     content: b.content.toRgbString(),
     contentInverse: b.contentInverse.toRgbString(),
@@ -3332,9 +3486,9 @@ var pentagramDarkScheme = (b) => ({
     }
   }
 });
-var pentagramDark = pentagramDarkScheme(baseDark);
+var xuiDark = xuiDarkScheme(baseDark);
 
-// src/themes/pentagram/presets/pay-station-light.ts
+// src/themes/xui/presets/pay-station-light.ts
 import { colord as colord11 } from "colord";
 var base10 = {
   content: colord11("#000000"),
@@ -3357,7 +3511,7 @@ var base10 = {
   onAlert: colord11("#000000"),
   onNeutral: colord11("#000000")
 };
-var pentagramLightScheme = (b) => ({
+var xuiLightScheme = (b) => ({
   base: {
     content: b.content.toRgbString(),
     contentInverse: b.contentInverse.toRgbString(),
@@ -3689,21 +3843,21 @@ var pentagramLightScheme = (b) => ({
     }
   }
 });
-var pentagramLight = pentagramLightScheme(base10);
+var xuiLight = xuiLightScheme(base10);
 
-// src/themes/pentagram/pentagram.ts
-function convertToLegacyBase(pentagramBase) {
+// src/themes/xui/xui.ts
+function convertToLegacyBase(xuiBase) {
   return {
-    content: pentagramBase.content.toRgbString(),
-    surface: pentagramBase.background.toRgbString(),
-    project: pentagramBase.brand.toRgbString(),
-    accent: pentagramBase.brandExtra.toRgbString(),
-    phantom: pentagramBase.mono.toRgbString(),
-    path: pentagramBase.brand.toRgbString(),
-    success: pentagramBase.success.toRgbString(),
-    warning: pentagramBase.warning.toRgbString(),
-    alert: pentagramBase.alert.toRgbString(),
-    neutral: pentagramBase.neutral.toRgbString()
+    content: xuiBase.content.toRgbString(),
+    surface: xuiBase.background.toRgbString(),
+    project: xuiBase.brand.toRgbString(),
+    accent: xuiBase.brandExtra.toRgbString(),
+    phantom: xuiBase.mono.toRgbString(),
+    path: xuiBase.brand.toRgbString(),
+    success: xuiBase.success.toRgbString(),
+    warning: xuiBase.warning.toRgbString(),
+    alert: xuiBase.alert.toRgbString(),
+    neutral: xuiBase.neutral.toRgbString()
   };
 }
 var desktopResolver = createResolver("desktop");
@@ -3711,41 +3865,41 @@ var resolvedTypoDesktop = desktopResolver.resolvePrimitives(
   typo_primitives_default
 );
 var resolvedShapeDesktop = desktopResolver.resolvePrimitives(shape_primitives_default);
-var pentagramTypo = mapPentagramTypoToLegacy(resolvedTypoDesktop);
-var pentagramMisc = mapPentagramShapeToLegacy(resolvedShapeDesktop);
-var paystation4PentagramLightLegacyCompatible = {
+var xuiTypo = mapXuiTypoToLegacy(resolvedTypoDesktop);
+var xuiMisc = mapXuiShapeToLegacy(resolvedShapeDesktop);
+var paystationXuiLightLegacyCompatible = {
   colors: {
     base: convertToLegacyBase(base10),
-    ...mapThemeSchemeToLegacy(pentagramLight)
+    ...mapThemeSchemeToLegacy(xuiLight)
   },
-  typo: pentagramTypo,
-  misc: pentagramMisc,
+  typo: xuiTypo,
+  misc: xuiMisc,
   shadows: shadowsDefault,
-  globalStyle: "pentagram"
+  globalStyle: "xui"
 };
-var paystation4PentagramDarkLegacyCompatible = {
+var paystationXuiDarkLegacyCompatible = {
   colors: {
     base: convertToLegacyBase(baseDark),
-    ...mapThemeSchemeToLegacy(pentagramDark)
+    ...mapThemeSchemeToLegacy(xuiDark)
   },
-  typo: pentagramTypo,
-  misc: pentagramMisc,
+  typo: xuiTypo,
+  misc: xuiMisc,
   shadows: shadowsDefault,
-  globalStyle: "pentagram"
+  globalStyle: "xui"
 };
-var paystation4PentagramLight = {
-  colors: pentagramLight,
+var paystationXuiLight = {
+  color: xuiLight,
   shape: shape_primitives_default,
-  typo: typo_primitives_default,
-  shadows: shadowsDefault,
-  globalStyle: "pentagram"
+  text: typo_primitives_default,
+  shadow: shadowsDefault,
+  globalStyle: "xui"
 };
-var paystation4PentagramDark = {
-  colors: pentagramDark,
+var paystationXuiDark = {
+  color: xuiDark,
   shape: shape_primitives_default,
-  typo: typo_primitives_default,
-  shadows: shadowsDefault,
-  globalStyle: "pentagram"
+  text: typo_primitives_default,
+  shadow: shadowsDefault,
+  globalStyle: "xui"
 };
 
 // src/themes/index.ts
@@ -3926,15 +4080,15 @@ var palettes = {
 // src/generators/themeGenerator.ts
 import { colord as colord12 } from "colord";
 import merge from "lodash.merge";
-var pentagramBaseColors = {
+var xuiBaseColors = {
   payStationLight: base10,
   payStationDark: baseDark
 };
-var pentagramColorsScheme = {
-  payStationLight: pentagramLightScheme,
-  payStationDark: pentagramDarkScheme
+var xuiColorsScheme = {
+  payStationLight: xuiLightScheme,
+  payStationDark: xuiDarkScheme
 };
-var pentagramBaseColorsKeys = [
+var xuiBaseColorsKeys = [
   "content",
   "contentInverse",
   "background",
@@ -3983,12 +4137,9 @@ var generateWithScheme = ({
 };
 function themeGenerator(props) {
   const { schemeName, baseColors } = props;
-  if (schemeName in pentagramColorsScheme) {
-    const schemeBase = baseColors ? applyPentagramColors(
-      pentagramBaseColors[schemeName],
-      baseColors
-    ) : { ...pentagramBaseColors[schemeName] };
-    return pentagramColorsScheme[schemeName](schemeBase);
+  if (schemeName in xuiColorsScheme) {
+    const schemeBase = baseColors ? applyXuiColors(xuiBaseColors[schemeName], baseColors) : { ...xuiBaseColors[schemeName] };
+    return xuiColorsScheme[schemeName](schemeBase);
   }
   const { customParams, parentTheme: propParentTheme } = props;
   const parentTheme = propParentTheme || themes[schemeName] || {};
@@ -4007,44 +4158,58 @@ function themeGenerator(props) {
   }
   return generateTheme;
 }
-var applyPentagramColors = (schemeBase, overrides) => {
+var applyXuiColors = (schemeBase, overrides) => {
   const result = { ...schemeBase };
-  pentagramBaseColorsKeys.forEach((key) => {
+  xuiBaseColorsKeys.forEach((key) => {
     if (overrides[key]) result[key] = colord12(overrides[key]);
   });
   return result;
 };
 export {
   DELETED_LEGACY_TYPO_VARS,
-  PentagramResolver,
+  XuiResolver as PentagramResolver,
+  XuiResolver,
   base10 as base,
   baseDark,
-  buildBaseColorsFromPentagram,
+  buildBaseColorsFromXui as buildBaseColorsFromPentagram,
+  buildBaseColorsFromXui,
   createResolver,
   emails,
   emailsDark,
   emailsThemes,
-  flattenPentagramShapeToVars,
+  flattenXuiShapeToVars as flattenPentagramShapeToVars,
+  flattenXuiShapeToVars,
   generateWithScheme,
-  mapPentagramShapeToLegacy,
-  mapPentagramThemeToLegacy,
-  mapPentagramTypoToLegacy,
+  mapXuiShapeToLegacy as mapPentagramShapeToLegacy,
+  mapXuiThemeToLegacy as mapPentagramThemeToLegacy,
+  mapXuiTypoToLegacy as mapPentagramTypoToLegacy,
   mapThemeSchemeToLegacy,
+  mapXuiShapeToLegacy,
+  mapXuiThemeToLegacy,
+  mapXuiTypoToLegacy,
   palettes,
   paystation4,
   paystation4Dark,
   paystation4Gaijin,
   paystation4Nexters,
-  paystation4PentagramDark,
-  paystation4PentagramDarkLegacyCompatible,
-  paystation4PentagramLight,
-  paystation4PentagramLightLegacyCompatible,
+  paystationXuiDark as paystation4PentagramDark,
+  paystationXuiDarkLegacyCompatible as paystation4PentagramDarkLegacyCompatible,
+  paystationXuiLight as paystation4PentagramLight,
+  paystationXuiLightLegacyCompatible as paystation4PentagramLightLegacyCompatible,
   paystation4Take2,
   paystation4Themes,
-  pentagramDark,
-  pentagramDarkScheme,
-  pentagramLight,
-  pentagramLightScheme,
+  paystationXuiDark as paystation4XuiDark,
+  paystationXuiDarkLegacyCompatible as paystation4XuiDarkLegacyCompatible,
+  paystationXuiLight as paystation4XuiLight,
+  paystationXuiLightLegacyCompatible as paystation4XuiLightLegacyCompatible,
+  paystationXuiDark,
+  paystationXuiDarkLegacyCompatible,
+  paystationXuiLight,
+  paystationXuiLightLegacyCompatible,
+  xuiDark as pentagramDark,
+  xuiDarkScheme as pentagramDarkScheme,
+  xuiLight as pentagramLight,
+  xuiLightScheme as pentagramLightScheme,
   primaryPalette,
   publisherV2,
   publisherV2Dark,
@@ -4057,6 +4222,10 @@ export {
   themesBaseColors,
   themesBaseColorsArray,
   themesColorsScheme,
-  typo_primitives_default as typoPrimitives
+  typo_primitives_default as typoPrimitives,
+  xuiDark,
+  xuiDarkScheme,
+  xuiLight,
+  xuiLightScheme
 };
 //# sourceMappingURL=index.mjs.map