npm - @xsolla/xui-typography - Versions diffs - 0.128.0 → 0.130.0 - Mend

@xsolla/xui-typography 0.128.0 → 0.130.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.

Files changed (13) hide show

package/native/index.d.mts CHANGED Viewed

@@ -1,12 +1,13 @@
 import * as react from 'react';
 import { ReactNode, ElementType } from 'react';
+import { ThemeOverrideProps } from '@xsolla/xui-core';
 type AlignType = "center" | "inherit" | "justify" | "left" | "right";
 type VariantType = "h1" | "h2" | "h3" | "h4" | "h5" | "display" | "bodyLg" | "bodyLgAccent" | "bodyLgParagraph" | "bodyMd" | "bodyMdAccent" | "bodyMdParagraph" | "bodySm" | "bodySmAccent" | "bodySmParagraph" | "bodyXs" | "bodyXsAccent" | "bodyXsParagraph";
 type ThemeColorType = "primary" | "secondary" | "tertiary" | "brand" | "brandSecondary" | "success" | "warning" | "alert" | "neutral";
 type ColorType = ThemeColorType | "inherit";
 type ProductContext = "b2c" | "b2b" | "paystation" | "presentation";
-interface TypographyProps extends Omit<any, "color"> {
+interface TypographyProps extends Omit<any, "color">, ThemeOverrideProps {
     children?: ReactNode;
     align?: AlignType;
     noWrap?: boolean;

package/native/index.d.ts CHANGED Viewed

@@ -1,12 +1,13 @@
 import * as react from 'react';
 import { ReactNode, ElementType } from 'react';
+import { ThemeOverrideProps } from '@xsolla/xui-core';
 type AlignType = "center" | "inherit" | "justify" | "left" | "right";
 type VariantType = "h1" | "h2" | "h3" | "h4" | "h5" | "display" | "bodyLg" | "bodyLgAccent" | "bodyLgParagraph" | "bodyMd" | "bodyMdAccent" | "bodyMdParagraph" | "bodySm" | "bodySmAccent" | "bodySmParagraph" | "bodyXs" | "bodyXsAccent" | "bodyXsParagraph";
 type ThemeColorType = "primary" | "secondary" | "tertiary" | "brand" | "brandSecondary" | "success" | "warning" | "alert" | "neutral";
 type ColorType = ThemeColorType | "inherit";
 type ProductContext = "b2c" | "b2b" | "paystation" | "presentation";
-interface TypographyProps extends Omit<any, "color"> {
+interface TypographyProps extends Omit<any, "color">, ThemeOverrideProps {
     children?: ReactNode;
     align?: AlignType;
     noWrap?: boolean;

package/native/index.js CHANGED Viewed

@@ -63,7 +63,7 @@ var Text = ({
   }
   const incomingStyle = import_react_native.StyleSheet.flatten(styleProp);
   const baseStyle = {
-    color,
+    color: color ?? incomingStyle?.color,
     fontSize: typeof fontSize === "number" ? fontSize : void 0,
     fontWeight,
     fontFamily: resolvedFontFamily,
@@ -94,7 +94,9 @@ var Text = ({
 var import_xui_core = require("@xsolla/xui-core");
 var import_jsx_runtime2 = require("react/jsx-runtime");
 var getColor = (color, theme) => {
-  if (color === "inherit") return void 0;
+  if (color === "inherit") {
+    return import_xui_core.isNative ? theme?.colors?.content?.primary : void 0;
+  }
   const colorMap = {
     primary: theme?.colors?.content?.primary,
     secondary: theme?.colors?.content?.secondary,
@@ -220,9 +222,11 @@ var Typography = (0, import_react.forwardRef)(
     marginTop = 0,
     as,
     productContext,
+    themeMode,
+    themeProductContext,
     ...rest
   }, ref) => {
-    const { theme } = (0, import_xui_core.useDesignSystem)();
+    const { theme } = (0, import_xui_core.useResolvedTheme)({ themeMode, themeProductContext });
     const typographyTokens = productContext ? (0, import_xui_core.getTypographyTokens)(productContext) : theme.typographyTokens;
     const variantStyles = getVariantStyles(variant, typographyTokens);
     const colorValue = getColor(color, theme);

package/native/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../src/index.tsx","../../src/Typography.tsx","../../../primitives-native/src/Text.tsx"],"sourcesContent":["export * from \"./Typography\";\nexport * from \"./types\";\n","import { forwardRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Text } from \"@xsolla/xui-primitives\";\nimport {\n useDesignSystem,\n getTypographyTokens,\n getFonts,\n} from \"@xsolla/xui-core\";\nimport type { ColorType, TypographyProps, VariantType } from \"./types\";\n\nconst getColor = (\n color: ColorType \| string,\n theme: any\n): string \| undefined => {\n if (color === \"inherit\") return undefined;\n\n const colorMap: Record<string, string> = {\n primary: theme?.colors?.content?.primary,\n secondary: theme?.colors?.content?.secondary,\n tertiary: theme?.colors?.content?.tertiary,\n brand: theme?.colors?.content?.brand?.primary,\n brandSecondary: theme?.colors?.content?.brand?.secondary,\n success: theme?.colors?.content?.success?.primary,\n warning: theme?.colors?.content?.warning?.primary,\n alert: theme?.colors?.content?.alert?.primary,\n neutral: theme?.colors?.content?.neutral?.primary,\n };\n\n return colorMap[color] \|\| color;\n};\n\nconst isHeadingVariant = (variant: VariantType): boolean =>\n variant === \"h1\" \|\|\n variant === \"h2\" \|\|\n variant === \"h3\" \|\|\n variant === \"h4\" \|\|\n variant === \"h5\" \|\|\n variant === \"display\";\n\nconst getVariantStyles = (variant: VariantType, typographyTokens?: any) => {\n // If typography tokens are provided from theme, use them\n if (typographyTokens) {\n const headingMap: Record<string, keyof typeof typographyTokens.heading> = {\n h1: \"h1\",\n h2: \"h2\",\n h3: \"h3\",\n h4: \"h4\",\n h5: \"h5\",\n };\n\n if (headingMap[variant]) {\n const token = typographyTokens.heading[headingMap[variant]];\n if (token) {\n return {\n fontSize: token.fontSize,\n fontWeight: String(token.fontWeight),\n lineHeight: token.lineHeight,\n };\n }\n }\n\n if (variant === \"display\" && typographyTokens.basic?.display) {\n const token = typographyTokens.basic.display;\n return {\n fontSize: token.fontSize,\n fontWeight: String(token.fontWeight),\n lineHeight: token.lineHeight,\n };\n }\n\n // Body variants\n const bodyMap: Record<string, string> = {\n bodyLg: \"body-lg\",\n bodyLgAccent: \"body-lg\",\n bodyLgParagraph: \"body-lg\",\n bodyMd: \"body-md\",\n bodyMdAccent: \"body-md\",\n bodyMdParagraph: \"body-md\",\n bodySm: \"body-sm\",\n bodySmAccent: \"body-sm\",\n bodySmParagraph: \"body-sm\",\n bodyXs: \"body-xs\",\n bodyXsAccent: \"body-xs\",\n bodyXsParagraph: \"body-xs\",\n };\n\n const bodyKey = bodyMap[variant];\n if (bodyKey && typographyTokens.basic?.[bodyKey]) {\n const token = typographyTokens.basic[bodyKey];\n let fontWeight = token.fontWeight;\n let lineHeight = token.lineHeight;\n\n if (variant.includes(\"Accent\") && token.accent) {\n fontWeight = token.accent.fontWeight;\n }\n\n if (variant.includes(\"Paragraph\") && token.paragraph) {\n lineHeight = token.paragraph.lineHeight;\n }\n\n return {\n fontSize: token.fontSize,\n fontWeight: String(fontWeight),\n lineHeight: lineHeight,\n };\n }\n }\n\n // Fallback to default styles (B2B mode for backwards compatibility)\n switch (variant) {\n case \"h1\":\n return { fontSize: 56, fontWeight: \"400\", lineHeight: \"68px\" };\n case \"h2\":\n return { fontSize: 48, fontWeight: \"400\", lineHeight: \"58px\" };\n case \"h3\":\n return { fontSize: 32, fontWeight: \"400\", lineHeight: \"38px\" };\n case \"h4\":\n return { fontSize: 24, fontWeight: \"400\", lineHeight: \"28px\" };\n case \"h5\":\n return { fontSize: 20, fontWeight: \"600\", lineHeight: \"24px\" };\n case \"display\":\n return { fontSize: 64, fontWeight: \"400\", lineHeight: \"78px\" };\n case \"bodyLg\":\n return { fontSize: 18, fontWeight: \"400\", lineHeight: \"24px\" };\n case \"bodyLgAccent\":\n return { fontSize: 18, fontWeight: \"500\", lineHeight: \"24px\" };\n case \"bodyLgParagraph\":\n return { fontSize: 18, fontWeight: \"400\", lineHeight: \"26px\" };\n case \"bodyMd\":\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"20px\" };\n case \"bodyMdAccent\":\n return { fontSize: 16, fontWeight: \"500\", lineHeight: \"20px\" };\n case \"bodyMdParagraph\":\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"22px\" };\n case \"bodySm\":\n return { fontSize: 14, fontWeight: \"400\", lineHeight: \"18px\" };\n case \"bodySmAccent\":\n return { fontSize: 14, fontWeight: \"500\", lineHeight: \"18px\" };\n case \"bodySmParagraph\":\n return { fontSize: 14, fontWeight: \"400\", lineHeight: \"20px\" };\n case \"bodyXs\":\n return { fontSize: 12, fontWeight: \"400\", lineHeight: \"16px\" };\n case \"bodyXsAccent\":\n return { fontSize: 12, fontWeight: \"500\", lineHeight: \"16px\" };\n case \"bodyXsParagraph\":\n return { fontSize: 12, fontWeight: \"400\", lineHeight: \"18px\" };\n default:\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"20px\" };\n }\n};\n\nexport const Typography = forwardRef<any, TypographyProps>(\n (\n {\n children,\n align = \"inherit\",\n noWrap = false,\n variant = \"bodyMd\",\n color = \"inherit\",\n marginBottom = 0,\n marginTop = 0,\n as,\n productContext,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n // If productContext is provided, use tokens for that specific context\n // Otherwise, use the tokens from the theme (context)\n const typographyTokens = productContext\n ? getTypographyTokens(productContext)\n : (theme as any).typographyTokens;\n const variantStyles = getVariantStyles(variant, typographyTokens);\n const colorValue = getColor(color, theme);\n const contextFonts = productContext\n ? getFonts(productContext)\n : (theme.fonts as Record<string, string>);\n const fontFamily = isHeadingVariant(variant)\n ? contextFonts?.heading\n : contextFonts?.body;\n\n return (\n <Text\n {...rest}\n ref={ref}\n as={as}\n color={colorValue}\n fontSize={variantStyles.fontSize}\n fontWeight={variantStyles.fontWeight}\n fontFamily={fontFamily}\n numberOfLines={noWrap ? 1 : undefined}\n style={{\n marginTop,\n marginBottom,\n textAlign: align === \"inherit\" ? undefined : align,\n lineHeight: variantStyles.lineHeight,\n ...(noWrap && {\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n }),\n ...rest.style,\n }}\n >\n {children}\n </Text>\n );\n }\n);\n\nTypography.displayName = \"Typography\";\n","import React from \"react\";\nimport {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string \| number \| undefined\n): number \| undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n style: styleProp,\n ...props\n}) => {\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n if (\n resolvedFontFamily === \"Pilat Wide\" \|\|\n resolvedFontFamily === \"Pilat Wide Bold\" \|\|\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const incomingStyle = StyleSheet.flatten(styleProp) as TextStyle \| undefined;\n\n const baseStyle: TextStyle = {\n color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n textAlign: textAlign ?? incomingStyle?.textAlign,\n lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),\n marginTop: parseNumericValue(\n incomingStyle?.marginTop as number \| string \| undefined\n ),\n marginBottom: parseNumericValue(\n incomingStyle?.marginBottom as number \| string \| undefined\n ),\n };\n\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText\n style={baseStyle}\n numberOfLines={numberOfLines}\n testID={id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n"],"mappings":"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","names":["RNText","import_jsx_runtime"]}
1	+ {"version":3,"sources":["../../src/index.tsx","../../src/Typography.tsx","../../../primitives-native/src/Text.tsx"],"sourcesContent":["export * from \"./Typography\";\nexport * from \"./types\";\n","import { forwardRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Text } from \"@xsolla/xui-primitives\";\nimport {\n useResolvedTheme,\n getTypographyTokens,\n getFonts,\n isNative,\n} from \"@xsolla/xui-core\";\nimport type { ColorType, TypographyProps, VariantType } from \"./types\";\n\nconst getColor = (\n color: ColorType \| string,\n theme: any\n): string \| undefined => {\n if (color === \"inherit\") {\n return isNative ? theme?.colors?.content?.primary : undefined;\n }\n\n const colorMap: Record<string, string> = {\n primary: theme?.colors?.content?.primary,\n secondary: theme?.colors?.content?.secondary,\n tertiary: theme?.colors?.content?.tertiary,\n brand: theme?.colors?.content?.brand?.primary,\n brandSecondary: theme?.colors?.content?.brand?.secondary,\n success: theme?.colors?.content?.success?.primary,\n warning: theme?.colors?.content?.warning?.primary,\n alert: theme?.colors?.content?.alert?.primary,\n neutral: theme?.colors?.content?.neutral?.primary,\n };\n\n return colorMap[color] \|\| color;\n};\n\nconst isHeadingVariant = (variant: VariantType): boolean =>\n variant === \"h1\" \|\|\n variant === \"h2\" \|\|\n variant === \"h3\" \|\|\n variant === \"h4\" \|\|\n variant === \"h5\" \|\|\n variant === \"display\";\n\nconst getVariantStyles = (variant: VariantType, typographyTokens?: any) => {\n // If typography tokens are provided from theme, use them\n if (typographyTokens) {\n const headingMap: Record<string, keyof typeof typographyTokens.heading> = {\n h1: \"h1\",\n h2: \"h2\",\n h3: \"h3\",\n h4: \"h4\",\n h5: \"h5\",\n };\n\n if (headingMap[variant]) {\n const token = typographyTokens.heading[headingMap[variant]];\n if (token) {\n return {\n fontSize: token.fontSize,\n fontWeight: String(token.fontWeight),\n lineHeight: token.lineHeight,\n };\n }\n }\n\n if (variant === \"display\" && typographyTokens.basic?.display) {\n const token = typographyTokens.basic.display;\n return {\n fontSize: token.fontSize,\n fontWeight: String(token.fontWeight),\n lineHeight: token.lineHeight,\n };\n }\n\n // Body variants\n const bodyMap: Record<string, string> = {\n bodyLg: \"body-lg\",\n bodyLgAccent: \"body-lg\",\n bodyLgParagraph: \"body-lg\",\n bodyMd: \"body-md\",\n bodyMdAccent: \"body-md\",\n bodyMdParagraph: \"body-md\",\n bodySm: \"body-sm\",\n bodySmAccent: \"body-sm\",\n bodySmParagraph: \"body-sm\",\n bodyXs: \"body-xs\",\n bodyXsAccent: \"body-xs\",\n bodyXsParagraph: \"body-xs\",\n };\n\n const bodyKey = bodyMap[variant];\n if (bodyKey && typographyTokens.basic?.[bodyKey]) {\n const token = typographyTokens.basic[bodyKey];\n let fontWeight = token.fontWeight;\n let lineHeight = token.lineHeight;\n\n if (variant.includes(\"Accent\") && token.accent) {\n fontWeight = token.accent.fontWeight;\n }\n\n if (variant.includes(\"Paragraph\") && token.paragraph) {\n lineHeight = token.paragraph.lineHeight;\n }\n\n return {\n fontSize: token.fontSize,\n fontWeight: String(fontWeight),\n lineHeight: lineHeight,\n };\n }\n }\n\n // Fallback to default styles (B2B mode for backwards compatibility)\n switch (variant) {\n case \"h1\":\n return { fontSize: 56, fontWeight: \"400\", lineHeight: \"68px\" };\n case \"h2\":\n return { fontSize: 48, fontWeight: \"400\", lineHeight: \"58px\" };\n case \"h3\":\n return { fontSize: 32, fontWeight: \"400\", lineHeight: \"38px\" };\n case \"h4\":\n return { fontSize: 24, fontWeight: \"400\", lineHeight: \"28px\" };\n case \"h5\":\n return { fontSize: 20, fontWeight: \"600\", lineHeight: \"24px\" };\n case \"display\":\n return { fontSize: 64, fontWeight: \"400\", lineHeight: \"78px\" };\n case \"bodyLg\":\n return { fontSize: 18, fontWeight: \"400\", lineHeight: \"24px\" };\n case \"bodyLgAccent\":\n return { fontSize: 18, fontWeight: \"500\", lineHeight: \"24px\" };\n case \"bodyLgParagraph\":\n return { fontSize: 18, fontWeight: \"400\", lineHeight: \"26px\" };\n case \"bodyMd\":\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"20px\" };\n case \"bodyMdAccent\":\n return { fontSize: 16, fontWeight: \"500\", lineHeight: \"20px\" };\n case \"bodyMdParagraph\":\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"22px\" };\n case \"bodySm\":\n return { fontSize: 14, fontWeight: \"400\", lineHeight: \"18px\" };\n case \"bodySmAccent\":\n return { fontSize: 14, fontWeight: \"500\", lineHeight: \"18px\" };\n case \"bodySmParagraph\":\n return { fontSize: 14, fontWeight: \"400\", lineHeight: \"20px\" };\n case \"bodyXs\":\n return { fontSize: 12, fontWeight: \"400\", lineHeight: \"16px\" };\n case \"bodyXsAccent\":\n return { fontSize: 12, fontWeight: \"500\", lineHeight: \"16px\" };\n case \"bodyXsParagraph\":\n return { fontSize: 12, fontWeight: \"400\", lineHeight: \"18px\" };\n default:\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"20px\" };\n }\n};\n\nexport const Typography = forwardRef<any, TypographyProps>(\n (\n {\n children,\n align = \"inherit\",\n noWrap = false,\n variant = \"bodyMd\",\n color = \"inherit\",\n marginBottom = 0,\n marginTop = 0,\n as,\n productContext,\n themeMode,\n themeProductContext,\n ...rest\n },\n ref\n ) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n // If productContext is provided, use tokens for that specific context\n // Otherwise, use the tokens from the theme (context)\n const typographyTokens = productContext\n ? getTypographyTokens(productContext)\n : (theme as any).typographyTokens;\n const variantStyles = getVariantStyles(variant, typographyTokens);\n const colorValue = getColor(color, theme);\n const contextFonts = productContext\n ? getFonts(productContext)\n : (theme.fonts as Record<string, string>);\n const fontFamily = isHeadingVariant(variant)\n ? contextFonts?.heading\n : contextFonts?.body;\n\n return (\n <Text\n {...rest}\n ref={ref}\n as={as}\n color={colorValue}\n fontSize={variantStyles.fontSize}\n fontWeight={variantStyles.fontWeight}\n fontFamily={fontFamily}\n numberOfLines={noWrap ? 1 : undefined}\n style={{\n marginTop,\n marginBottom,\n textAlign: align === \"inherit\" ? undefined : align,\n lineHeight: variantStyles.lineHeight,\n ...(noWrap && {\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n }),\n ...rest.style,\n }}\n >\n {children}\n </Text>\n );\n }\n);\n\nTypography.displayName = \"Typography\";\n","import React from \"react\";\nimport {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string \| number \| undefined\n): number \| undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n style: styleProp,\n ...props\n}) => {\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n if (\n resolvedFontFamily === \"Pilat Wide\" \|\|\n resolvedFontFamily === \"Pilat Wide Bold\" \|\|\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const incomingStyle = StyleSheet.flatten(styleProp) as TextStyle \| undefined;\n\n const baseStyle: TextStyle = {\n color: color ?? incomingStyle?.color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n textAlign: textAlign ?? incomingStyle?.textAlign,\n lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),\n marginTop: parseNumericValue(\n incomingStyle?.marginTop as number \| string \| undefined\n ),\n marginBottom: parseNumericValue(\n incomingStyle?.marginBottom as number \| string \| undefined\n ),\n };\n\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText\n style={baseStyle}\n numberOfLines={numberOfLines}\n testID={id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n"],"mappings":"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","names":["RNText","import_jsx_runtime"]}

package/native/index.mjs CHANGED Viewed

@@ -40,7 +40,7 @@ var Text = ({
   }
   const incomingStyle = StyleSheet.flatten(styleProp);
   const baseStyle = {
-    color,
+    color: color ?? incomingStyle?.color,
     fontSize: typeof fontSize === "number" ? fontSize : void 0,
     fontWeight,
     fontFamily: resolvedFontFamily,
@@ -69,13 +69,16 @@ var Text = ({
 // src/Typography.tsx
 import {
-  useDesignSystem,
+  useResolvedTheme,
   getTypographyTokens,
-  getFonts
+  getFonts,
+  isNative
 } from "@xsolla/xui-core";
 import { jsx as jsx2 } from "react/jsx-runtime";
 var getColor = (color, theme) => {
-  if (color === "inherit") return void 0;
+  if (color === "inherit") {
+    return isNative ? theme?.colors?.content?.primary : void 0;
+  }
   const colorMap = {
     primary: theme?.colors?.content?.primary,
     secondary: theme?.colors?.content?.secondary,
@@ -201,9 +204,11 @@ var Typography = forwardRef(
     marginTop = 0,
     as,
     productContext,
+    themeMode,
+    themeProductContext,
     ...rest
   }, ref) => {
-    const { theme } = useDesignSystem();
+    const { theme } = useResolvedTheme({ themeMode, themeProductContext });
     const typographyTokens = productContext ? getTypographyTokens(productContext) : theme.typographyTokens;
     const variantStyles = getVariantStyles(variant, typographyTokens);
     const colorValue = getColor(color, theme);

package/native/index.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../src/Typography.tsx","../../../primitives-native/src/Text.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Text } from \"@xsolla/xui-primitives\";\nimport {\n useDesignSystem,\n getTypographyTokens,\n getFonts,\n} from \"@xsolla/xui-core\";\nimport type { ColorType, TypographyProps, VariantType } from \"./types\";\n\nconst getColor = (\n color: ColorType \| string,\n theme: any\n): string \| undefined => {\n if (color === \"inherit\") return undefined;\n\n const colorMap: Record<string, string> = {\n primary: theme?.colors?.content?.primary,\n secondary: theme?.colors?.content?.secondary,\n tertiary: theme?.colors?.content?.tertiary,\n brand: theme?.colors?.content?.brand?.primary,\n brandSecondary: theme?.colors?.content?.brand?.secondary,\n success: theme?.colors?.content?.success?.primary,\n warning: theme?.colors?.content?.warning?.primary,\n alert: theme?.colors?.content?.alert?.primary,\n neutral: theme?.colors?.content?.neutral?.primary,\n };\n\n return colorMap[color] \|\| color;\n};\n\nconst isHeadingVariant = (variant: VariantType): boolean =>\n variant === \"h1\" \|\|\n variant === \"h2\" \|\|\n variant === \"h3\" \|\|\n variant === \"h4\" \|\|\n variant === \"h5\" \|\|\n variant === \"display\";\n\nconst getVariantStyles = (variant: VariantType, typographyTokens?: any) => {\n // If typography tokens are provided from theme, use them\n if (typographyTokens) {\n const headingMap: Record<string, keyof typeof typographyTokens.heading> = {\n h1: \"h1\",\n h2: \"h2\",\n h3: \"h3\",\n h4: \"h4\",\n h5: \"h5\",\n };\n\n if (headingMap[variant]) {\n const token = typographyTokens.heading[headingMap[variant]];\n if (token) {\n return {\n fontSize: token.fontSize,\n fontWeight: String(token.fontWeight),\n lineHeight: token.lineHeight,\n };\n }\n }\n\n if (variant === \"display\" && typographyTokens.basic?.display) {\n const token = typographyTokens.basic.display;\n return {\n fontSize: token.fontSize,\n fontWeight: String(token.fontWeight),\n lineHeight: token.lineHeight,\n };\n }\n\n // Body variants\n const bodyMap: Record<string, string> = {\n bodyLg: \"body-lg\",\n bodyLgAccent: \"body-lg\",\n bodyLgParagraph: \"body-lg\",\n bodyMd: \"body-md\",\n bodyMdAccent: \"body-md\",\n bodyMdParagraph: \"body-md\",\n bodySm: \"body-sm\",\n bodySmAccent: \"body-sm\",\n bodySmParagraph: \"body-sm\",\n bodyXs: \"body-xs\",\n bodyXsAccent: \"body-xs\",\n bodyXsParagraph: \"body-xs\",\n };\n\n const bodyKey = bodyMap[variant];\n if (bodyKey && typographyTokens.basic?.[bodyKey]) {\n const token = typographyTokens.basic[bodyKey];\n let fontWeight = token.fontWeight;\n let lineHeight = token.lineHeight;\n\n if (variant.includes(\"Accent\") && token.accent) {\n fontWeight = token.accent.fontWeight;\n }\n\n if (variant.includes(\"Paragraph\") && token.paragraph) {\n lineHeight = token.paragraph.lineHeight;\n }\n\n return {\n fontSize: token.fontSize,\n fontWeight: String(fontWeight),\n lineHeight: lineHeight,\n };\n }\n }\n\n // Fallback to default styles (B2B mode for backwards compatibility)\n switch (variant) {\n case \"h1\":\n return { fontSize: 56, fontWeight: \"400\", lineHeight: \"68px\" };\n case \"h2\":\n return { fontSize: 48, fontWeight: \"400\", lineHeight: \"58px\" };\n case \"h3\":\n return { fontSize: 32, fontWeight: \"400\", lineHeight: \"38px\" };\n case \"h4\":\n return { fontSize: 24, fontWeight: \"400\", lineHeight: \"28px\" };\n case \"h5\":\n return { fontSize: 20, fontWeight: \"600\", lineHeight: \"24px\" };\n case \"display\":\n return { fontSize: 64, fontWeight: \"400\", lineHeight: \"78px\" };\n case \"bodyLg\":\n return { fontSize: 18, fontWeight: \"400\", lineHeight: \"24px\" };\n case \"bodyLgAccent\":\n return { fontSize: 18, fontWeight: \"500\", lineHeight: \"24px\" };\n case \"bodyLgParagraph\":\n return { fontSize: 18, fontWeight: \"400\", lineHeight: \"26px\" };\n case \"bodyMd\":\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"20px\" };\n case \"bodyMdAccent\":\n return { fontSize: 16, fontWeight: \"500\", lineHeight: \"20px\" };\n case \"bodyMdParagraph\":\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"22px\" };\n case \"bodySm\":\n return { fontSize: 14, fontWeight: \"400\", lineHeight: \"18px\" };\n case \"bodySmAccent\":\n return { fontSize: 14, fontWeight: \"500\", lineHeight: \"18px\" };\n case \"bodySmParagraph\":\n return { fontSize: 14, fontWeight: \"400\", lineHeight: \"20px\" };\n case \"bodyXs\":\n return { fontSize: 12, fontWeight: \"400\", lineHeight: \"16px\" };\n case \"bodyXsAccent\":\n return { fontSize: 12, fontWeight: \"500\", lineHeight: \"16px\" };\n case \"bodyXsParagraph\":\n return { fontSize: 12, fontWeight: \"400\", lineHeight: \"18px\" };\n default:\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"20px\" };\n }\n};\n\nexport const Typography = forwardRef<any, TypographyProps>(\n (\n {\n children,\n align = \"inherit\",\n noWrap = false,\n variant = \"bodyMd\",\n color = \"inherit\",\n marginBottom = 0,\n marginTop = 0,\n as,\n productContext,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n // If productContext is provided, use tokens for that specific context\n // Otherwise, use the tokens from the theme (context)\n const typographyTokens = productContext\n ? getTypographyTokens(productContext)\n : (theme as any).typographyTokens;\n const variantStyles = getVariantStyles(variant, typographyTokens);\n const colorValue = getColor(color, theme);\n const contextFonts = productContext\n ? getFonts(productContext)\n : (theme.fonts as Record<string, string>);\n const fontFamily = isHeadingVariant(variant)\n ? contextFonts?.heading\n : contextFonts?.body;\n\n return (\n <Text\n {...rest}\n ref={ref}\n as={as}\n color={colorValue}\n fontSize={variantStyles.fontSize}\n fontWeight={variantStyles.fontWeight}\n fontFamily={fontFamily}\n numberOfLines={noWrap ? 1 : undefined}\n style={{\n marginTop,\n marginBottom,\n textAlign: align === \"inherit\" ? undefined : align,\n lineHeight: variantStyles.lineHeight,\n ...(noWrap && {\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n }),\n ...rest.style,\n }}\n >\n {children}\n </Text>\n );\n }\n);\n\nTypography.displayName = \"Typography\";\n","import React from \"react\";\nimport {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string \| number \| undefined\n): number \| undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n style: styleProp,\n ...props\n}) => {\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n if (\n resolvedFontFamily === \"Pilat Wide\" \|\|\n resolvedFontFamily === \"Pilat Wide Bold\" \|\|\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const incomingStyle = StyleSheet.flatten(styleProp) as TextStyle \| undefined;\n\n const baseStyle: TextStyle = {\n color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n textAlign: textAlign ?? incomingStyle?.textAlign,\n lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),\n marginTop: parseNumericValue(\n incomingStyle?.marginTop as number \| string \| undefined\n ),\n marginBottom: parseNumericValue(\n incomingStyle?.marginBottom as number \| string \| undefined\n ),\n };\n\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText\n style={baseStyle}\n numberOfLines={numberOfLines}\n testID={id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n"],"mappings":"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","names":["jsx"]}
1	+ {"version":3,"sources":["../../src/Typography.tsx","../../../primitives-native/src/Text.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Text } from \"@xsolla/xui-primitives\";\nimport {\n useResolvedTheme,\n getTypographyTokens,\n getFonts,\n isNative,\n} from \"@xsolla/xui-core\";\nimport type { ColorType, TypographyProps, VariantType } from \"./types\";\n\nconst getColor = (\n color: ColorType \| string,\n theme: any\n): string \| undefined => {\n if (color === \"inherit\") {\n return isNative ? theme?.colors?.content?.primary : undefined;\n }\n\n const colorMap: Record<string, string> = {\n primary: theme?.colors?.content?.primary,\n secondary: theme?.colors?.content?.secondary,\n tertiary: theme?.colors?.content?.tertiary,\n brand: theme?.colors?.content?.brand?.primary,\n brandSecondary: theme?.colors?.content?.brand?.secondary,\n success: theme?.colors?.content?.success?.primary,\n warning: theme?.colors?.content?.warning?.primary,\n alert: theme?.colors?.content?.alert?.primary,\n neutral: theme?.colors?.content?.neutral?.primary,\n };\n\n return colorMap[color] \|\| color;\n};\n\nconst isHeadingVariant = (variant: VariantType): boolean =>\n variant === \"h1\" \|\|\n variant === \"h2\" \|\|\n variant === \"h3\" \|\|\n variant === \"h4\" \|\|\n variant === \"h5\" \|\|\n variant === \"display\";\n\nconst getVariantStyles = (variant: VariantType, typographyTokens?: any) => {\n // If typography tokens are provided from theme, use them\n if (typographyTokens) {\n const headingMap: Record<string, keyof typeof typographyTokens.heading> = {\n h1: \"h1\",\n h2: \"h2\",\n h3: \"h3\",\n h4: \"h4\",\n h5: \"h5\",\n };\n\n if (headingMap[variant]) {\n const token = typographyTokens.heading[headingMap[variant]];\n if (token) {\n return {\n fontSize: token.fontSize,\n fontWeight: String(token.fontWeight),\n lineHeight: token.lineHeight,\n };\n }\n }\n\n if (variant === \"display\" && typographyTokens.basic?.display) {\n const token = typographyTokens.basic.display;\n return {\n fontSize: token.fontSize,\n fontWeight: String(token.fontWeight),\n lineHeight: token.lineHeight,\n };\n }\n\n // Body variants\n const bodyMap: Record<string, string> = {\n bodyLg: \"body-lg\",\n bodyLgAccent: \"body-lg\",\n bodyLgParagraph: \"body-lg\",\n bodyMd: \"body-md\",\n bodyMdAccent: \"body-md\",\n bodyMdParagraph: \"body-md\",\n bodySm: \"body-sm\",\n bodySmAccent: \"body-sm\",\n bodySmParagraph: \"body-sm\",\n bodyXs: \"body-xs\",\n bodyXsAccent: \"body-xs\",\n bodyXsParagraph: \"body-xs\",\n };\n\n const bodyKey = bodyMap[variant];\n if (bodyKey && typographyTokens.basic?.[bodyKey]) {\n const token = typographyTokens.basic[bodyKey];\n let fontWeight = token.fontWeight;\n let lineHeight = token.lineHeight;\n\n if (variant.includes(\"Accent\") && token.accent) {\n fontWeight = token.accent.fontWeight;\n }\n\n if (variant.includes(\"Paragraph\") && token.paragraph) {\n lineHeight = token.paragraph.lineHeight;\n }\n\n return {\n fontSize: token.fontSize,\n fontWeight: String(fontWeight),\n lineHeight: lineHeight,\n };\n }\n }\n\n // Fallback to default styles (B2B mode for backwards compatibility)\n switch (variant) {\n case \"h1\":\n return { fontSize: 56, fontWeight: \"400\", lineHeight: \"68px\" };\n case \"h2\":\n return { fontSize: 48, fontWeight: \"400\", lineHeight: \"58px\" };\n case \"h3\":\n return { fontSize: 32, fontWeight: \"400\", lineHeight: \"38px\" };\n case \"h4\":\n return { fontSize: 24, fontWeight: \"400\", lineHeight: \"28px\" };\n case \"h5\":\n return { fontSize: 20, fontWeight: \"600\", lineHeight: \"24px\" };\n case \"display\":\n return { fontSize: 64, fontWeight: \"400\", lineHeight: \"78px\" };\n case \"bodyLg\":\n return { fontSize: 18, fontWeight: \"400\", lineHeight: \"24px\" };\n case \"bodyLgAccent\":\n return { fontSize: 18, fontWeight: \"500\", lineHeight: \"24px\" };\n case \"bodyLgParagraph\":\n return { fontSize: 18, fontWeight: \"400\", lineHeight: \"26px\" };\n case \"bodyMd\":\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"20px\" };\n case \"bodyMdAccent\":\n return { fontSize: 16, fontWeight: \"500\", lineHeight: \"20px\" };\n case \"bodyMdParagraph\":\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"22px\" };\n case \"bodySm\":\n return { fontSize: 14, fontWeight: \"400\", lineHeight: \"18px\" };\n case \"bodySmAccent\":\n return { fontSize: 14, fontWeight: \"500\", lineHeight: \"18px\" };\n case \"bodySmParagraph\":\n return { fontSize: 14, fontWeight: \"400\", lineHeight: \"20px\" };\n case \"bodyXs\":\n return { fontSize: 12, fontWeight: \"400\", lineHeight: \"16px\" };\n case \"bodyXsAccent\":\n return { fontSize: 12, fontWeight: \"500\", lineHeight: \"16px\" };\n case \"bodyXsParagraph\":\n return { fontSize: 12, fontWeight: \"400\", lineHeight: \"18px\" };\n default:\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"20px\" };\n }\n};\n\nexport const Typography = forwardRef<any, TypographyProps>(\n (\n {\n children,\n align = \"inherit\",\n noWrap = false,\n variant = \"bodyMd\",\n color = \"inherit\",\n marginBottom = 0,\n marginTop = 0,\n as,\n productContext,\n themeMode,\n themeProductContext,\n ...rest\n },\n ref\n ) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n // If productContext is provided, use tokens for that specific context\n // Otherwise, use the tokens from the theme (context)\n const typographyTokens = productContext\n ? getTypographyTokens(productContext)\n : (theme as any).typographyTokens;\n const variantStyles = getVariantStyles(variant, typographyTokens);\n const colorValue = getColor(color, theme);\n const contextFonts = productContext\n ? getFonts(productContext)\n : (theme.fonts as Record<string, string>);\n const fontFamily = isHeadingVariant(variant)\n ? contextFonts?.heading\n : contextFonts?.body;\n\n return (\n <Text\n {...rest}\n ref={ref}\n as={as}\n color={colorValue}\n fontSize={variantStyles.fontSize}\n fontWeight={variantStyles.fontWeight}\n fontFamily={fontFamily}\n numberOfLines={noWrap ? 1 : undefined}\n style={{\n marginTop,\n marginBottom,\n textAlign: align === \"inherit\" ? undefined : align,\n lineHeight: variantStyles.lineHeight,\n ...(noWrap && {\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n }),\n ...rest.style,\n }}\n >\n {children}\n </Text>\n );\n }\n);\n\nTypography.displayName = \"Typography\";\n","import React from \"react\";\nimport {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string \| number \| undefined\n): number \| undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n style: styleProp,\n ...props\n}) => {\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n if (\n resolvedFontFamily === \"Pilat Wide\" \|\|\n resolvedFontFamily === \"Pilat Wide Bold\" \|\|\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const incomingStyle = StyleSheet.flatten(styleProp) as TextStyle \| undefined;\n\n const baseStyle: TextStyle = {\n color: color ?? incomingStyle?.color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n textAlign: textAlign ?? incomingStyle?.textAlign,\n lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),\n marginTop: parseNumericValue(\n incomingStyle?.marginTop as number \| string \| undefined\n ),\n marginBottom: parseNumericValue(\n incomingStyle?.marginBottom as number \| string \| undefined\n ),\n };\n\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText\n style={baseStyle}\n numberOfLines={numberOfLines}\n testID={id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n"],"mappings":"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","names":["jsx"]}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@xsolla/xui-typography",
-  "version": "0.128.0",
+  "version": "0.130.0",
   "main": "./web/index.js",
   "module": "./web/index.mjs",
   "types": "./web/index.d.ts",
@@ -13,8 +13,8 @@
     "test:coverage": "vitest run --coverage"
   },
   "dependencies": {
-    "@xsolla/xui-core": "0.128.0",
-    "@xsolla/xui-primitives-core": "0.128.0"
+    "@xsolla/xui-core": "0.130.0",
+    "@xsolla/xui-primitives-core": "0.130.0"
   },
   "peerDependencies": {
     "react": ">=16.8.0",

package/web/index.d.mts CHANGED Viewed

@@ -1,12 +1,13 @@
 import * as react from 'react';
 import { ReactNode, ElementType } from 'react';
+import { ThemeOverrideProps } from '@xsolla/xui-core';
 type AlignType = "center" | "inherit" | "justify" | "left" | "right";
 type VariantType = "h1" | "h2" | "h3" | "h4" | "h5" | "display" | "bodyLg" | "bodyLgAccent" | "bodyLgParagraph" | "bodyMd" | "bodyMdAccent" | "bodyMdParagraph" | "bodySm" | "bodySmAccent" | "bodySmParagraph" | "bodyXs" | "bodyXsAccent" | "bodyXsParagraph";
 type ThemeColorType = "primary" | "secondary" | "tertiary" | "brand" | "brandSecondary" | "success" | "warning" | "alert" | "neutral";
 type ColorType = ThemeColorType | "inherit";
 type ProductContext = "b2c" | "b2b" | "paystation" | "presentation";
-interface TypographyProps extends Omit<any, "color"> {
+interface TypographyProps extends Omit<any, "color">, ThemeOverrideProps {
     children?: ReactNode;
     align?: AlignType;
     noWrap?: boolean;

package/web/index.d.ts CHANGED Viewed

@@ -1,12 +1,13 @@
 import * as react from 'react';
 import { ReactNode, ElementType } from 'react';
+import { ThemeOverrideProps } from '@xsolla/xui-core';
 type AlignType = "center" | "inherit" | "justify" | "left" | "right";
 type VariantType = "h1" | "h2" | "h3" | "h4" | "h5" | "display" | "bodyLg" | "bodyLgAccent" | "bodyLgParagraph" | "bodyMd" | "bodyMdAccent" | "bodyMdParagraph" | "bodySm" | "bodySmAccent" | "bodySmParagraph" | "bodyXs" | "bodyXsAccent" | "bodyXsParagraph";
 type ThemeColorType = "primary" | "secondary" | "tertiary" | "brand" | "brandSecondary" | "success" | "warning" | "alert" | "neutral";
 type ColorType = ThemeColorType | "inherit";
 type ProductContext = "b2c" | "b2b" | "paystation" | "presentation";
-interface TypographyProps extends Omit<any, "color"> {
+interface TypographyProps extends Omit<any, "color">, ThemeOverrideProps {
     children?: ReactNode;
     align?: AlignType;
     noWrap?: boolean;

package/web/index.js CHANGED Viewed

@@ -74,7 +74,9 @@ var Text = ({
 var import_xui_core = require("@xsolla/xui-core");
 var import_jsx_runtime2 = require("react/jsx-runtime");
 var getColor = (color, theme) => {
-  if (color === "inherit") return void 0;
+  if (color === "inherit") {
+    return import_xui_core.isNative ? theme?.colors?.content?.primary : void 0;
+  }
   const colorMap = {
     primary: theme?.colors?.content?.primary,
     secondary: theme?.colors?.content?.secondary,
@@ -200,9 +202,11 @@ var Typography = (0, import_react.forwardRef)(
     marginTop = 0,
     as,
     productContext,
+    themeMode,
+    themeProductContext,
     ...rest
   }, ref) => {
-    const { theme } = (0, import_xui_core.useDesignSystem)();
+    const { theme } = (0, import_xui_core.useResolvedTheme)({ themeMode, themeProductContext });
     const typographyTokens = productContext ? (0, import_xui_core.getTypographyTokens)(productContext) : theme.typographyTokens;
     const variantStyles = getVariantStyles(variant, typographyTokens);
     const colorValue = getColor(color, theme);

package/web/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../src/index.tsx","../../src/Typography.tsx","../../../primitives-web/src/Text.tsx"],"sourcesContent":["export * from \"./Typography\";\nexport * from \"./types\";\n","import { forwardRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Text } from \"@xsolla/xui-primitives\";\nimport {\n useDesignSystem,\n getTypographyTokens,\n getFonts,\n} from \"@xsolla/xui-core\";\nimport type { ColorType, TypographyProps, VariantType } from \"./types\";\n\nconst getColor = (\n color: ColorType \| string,\n theme: any\n): string \| undefined => {\n if (color === \"inherit\") return undefined;\n\n const colorMap: Record<string, string> = {\n primary: theme?.colors?.content?.primary,\n secondary: theme?.colors?.content?.secondary,\n tertiary: theme?.colors?.content?.tertiary,\n brand: theme?.colors?.content?.brand?.primary,\n brandSecondary: theme?.colors?.content?.brand?.secondary,\n success: theme?.colors?.content?.success?.primary,\n warning: theme?.colors?.content?.warning?.primary,\n alert: theme?.colors?.content?.alert?.primary,\n neutral: theme?.colors?.content?.neutral?.primary,\n };\n\n return colorMap[color] \|\| color;\n};\n\nconst isHeadingVariant = (variant: VariantType): boolean =>\n variant === \"h1\" \|\|\n variant === \"h2\" \|\|\n variant === \"h3\" \|\|\n variant === \"h4\" \|\|\n variant === \"h5\" \|\|\n variant === \"display\";\n\nconst getVariantStyles = (variant: VariantType, typographyTokens?: any) => {\n // If typography tokens are provided from theme, use them\n if (typographyTokens) {\n const headingMap: Record<string, keyof typeof typographyTokens.heading> = {\n h1: \"h1\",\n h2: \"h2\",\n h3: \"h3\",\n h4: \"h4\",\n h5: \"h5\",\n };\n\n if (headingMap[variant]) {\n const token = typographyTokens.heading[headingMap[variant]];\n if (token) {\n return {\n fontSize: token.fontSize,\n fontWeight: String(token.fontWeight),\n lineHeight: token.lineHeight,\n };\n }\n }\n\n if (variant === \"display\" && typographyTokens.basic?.display) {\n const token = typographyTokens.basic.display;\n return {\n fontSize: token.fontSize,\n fontWeight: String(token.fontWeight),\n lineHeight: token.lineHeight,\n };\n }\n\n // Body variants\n const bodyMap: Record<string, string> = {\n bodyLg: \"body-lg\",\n bodyLgAccent: \"body-lg\",\n bodyLgParagraph: \"body-lg\",\n bodyMd: \"body-md\",\n bodyMdAccent: \"body-md\",\n bodyMdParagraph: \"body-md\",\n bodySm: \"body-sm\",\n bodySmAccent: \"body-sm\",\n bodySmParagraph: \"body-sm\",\n bodyXs: \"body-xs\",\n bodyXsAccent: \"body-xs\",\n bodyXsParagraph: \"body-xs\",\n };\n\n const bodyKey = bodyMap[variant];\n if (bodyKey && typographyTokens.basic?.[bodyKey]) {\n const token = typographyTokens.basic[bodyKey];\n let fontWeight = token.fontWeight;\n let lineHeight = token.lineHeight;\n\n if (variant.includes(\"Accent\") && token.accent) {\n fontWeight = token.accent.fontWeight;\n }\n\n if (variant.includes(\"Paragraph\") && token.paragraph) {\n lineHeight = token.paragraph.lineHeight;\n }\n\n return {\n fontSize: token.fontSize,\n fontWeight: String(fontWeight),\n lineHeight: lineHeight,\n };\n }\n }\n\n // Fallback to default styles (B2B mode for backwards compatibility)\n switch (variant) {\n case \"h1\":\n return { fontSize: 56, fontWeight: \"400\", lineHeight: \"68px\" };\n case \"h2\":\n return { fontSize: 48, fontWeight: \"400\", lineHeight: \"58px\" };\n case \"h3\":\n return { fontSize: 32, fontWeight: \"400\", lineHeight: \"38px\" };\n case \"h4\":\n return { fontSize: 24, fontWeight: \"400\", lineHeight: \"28px\" };\n case \"h5\":\n return { fontSize: 20, fontWeight: \"600\", lineHeight: \"24px\" };\n case \"display\":\n return { fontSize: 64, fontWeight: \"400\", lineHeight: \"78px\" };\n case \"bodyLg\":\n return { fontSize: 18, fontWeight: \"400\", lineHeight: \"24px\" };\n case \"bodyLgAccent\":\n return { fontSize: 18, fontWeight: \"500\", lineHeight: \"24px\" };\n case \"bodyLgParagraph\":\n return { fontSize: 18, fontWeight: \"400\", lineHeight: \"26px\" };\n case \"bodyMd\":\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"20px\" };\n case \"bodyMdAccent\":\n return { fontSize: 16, fontWeight: \"500\", lineHeight: \"20px\" };\n case \"bodyMdParagraph\":\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"22px\" };\n case \"bodySm\":\n return { fontSize: 14, fontWeight: \"400\", lineHeight: \"18px\" };\n case \"bodySmAccent\":\n return { fontSize: 14, fontWeight: \"500\", lineHeight: \"18px\" };\n case \"bodySmParagraph\":\n return { fontSize: 14, fontWeight: \"400\", lineHeight: \"20px\" };\n case \"bodyXs\":\n return { fontSize: 12, fontWeight: \"400\", lineHeight: \"16px\" };\n case \"bodyXsAccent\":\n return { fontSize: 12, fontWeight: \"500\", lineHeight: \"16px\" };\n case \"bodyXsParagraph\":\n return { fontSize: 12, fontWeight: \"400\", lineHeight: \"18px\" };\n default:\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"20px\" };\n }\n};\n\nexport const Typography = forwardRef<any, TypographyProps>(\n (\n {\n children,\n align = \"inherit\",\n noWrap = false,\n variant = \"bodyMd\",\n color = \"inherit\",\n marginBottom = 0,\n marginTop = 0,\n as,\n productContext,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n // If productContext is provided, use tokens for that specific context\n // Otherwise, use the tokens from the theme (context)\n const typographyTokens = productContext\n ? getTypographyTokens(productContext)\n : (theme as any).typographyTokens;\n const variantStyles = getVariantStyles(variant, typographyTokens);\n const colorValue = getColor(color, theme);\n const contextFonts = productContext\n ? getFonts(productContext)\n : (theme.fonts as Record<string, string>);\n const fontFamily = isHeadingVariant(variant)\n ? contextFonts?.heading\n : contextFonts?.body;\n\n return (\n <Text\n {...rest}\n ref={ref}\n as={as}\n color={colorValue}\n fontSize={variantStyles.fontSize}\n fontWeight={variantStyles.fontWeight}\n fontFamily={fontFamily}\n numberOfLines={noWrap ? 1 : undefined}\n style={{\n marginTop,\n marginBottom,\n textAlign: align === \"inherit\" ? undefined : align,\n lineHeight: variantStyles.lineHeight,\n ...(noWrap && {\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n }),\n ...rest.style,\n }}\n >\n {children}\n </Text>\n );\n }\n);\n\nTypography.displayName = \"Typography\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledText = styled.span<TextProps>`\n color: ${(props) => props.color \|\| \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize \|\| \"inherit\"};\n font-weight: ${(props) => props.fontWeight \|\| \"normal\"};\n font-family: ${(props) =>\n props.fontFamily \|\|\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight \|\| \"inherit\"};\n white-space: ${(props) => props.whiteSpace \|\| \"normal\"};\n text-align: ${(props) => props.textAlign \|\| \"inherit\"};\n text-decoration: ${(props) => props.textDecoration \|\| \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n"],"mappings":"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","names":["styled","import_jsx_runtime"]}
1	+ {"version":3,"sources":["../../src/index.tsx","../../src/Typography.tsx","../../../primitives-web/src/Text.tsx"],"sourcesContent":["export * from \"./Typography\";\nexport * from \"./types\";\n","import { forwardRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Text } from \"@xsolla/xui-primitives\";\nimport {\n useResolvedTheme,\n getTypographyTokens,\n getFonts,\n isNative,\n} from \"@xsolla/xui-core\";\nimport type { ColorType, TypographyProps, VariantType } from \"./types\";\n\nconst getColor = (\n color: ColorType \| string,\n theme: any\n): string \| undefined => {\n if (color === \"inherit\") {\n return isNative ? theme?.colors?.content?.primary : undefined;\n }\n\n const colorMap: Record<string, string> = {\n primary: theme?.colors?.content?.primary,\n secondary: theme?.colors?.content?.secondary,\n tertiary: theme?.colors?.content?.tertiary,\n brand: theme?.colors?.content?.brand?.primary,\n brandSecondary: theme?.colors?.content?.brand?.secondary,\n success: theme?.colors?.content?.success?.primary,\n warning: theme?.colors?.content?.warning?.primary,\n alert: theme?.colors?.content?.alert?.primary,\n neutral: theme?.colors?.content?.neutral?.primary,\n };\n\n return colorMap[color] \|\| color;\n};\n\nconst isHeadingVariant = (variant: VariantType): boolean =>\n variant === \"h1\" \|\|\n variant === \"h2\" \|\|\n variant === \"h3\" \|\|\n variant === \"h4\" \|\|\n variant === \"h5\" \|\|\n variant === \"display\";\n\nconst getVariantStyles = (variant: VariantType, typographyTokens?: any) => {\n // If typography tokens are provided from theme, use them\n if (typographyTokens) {\n const headingMap: Record<string, keyof typeof typographyTokens.heading> = {\n h1: \"h1\",\n h2: \"h2\",\n h3: \"h3\",\n h4: \"h4\",\n h5: \"h5\",\n };\n\n if (headingMap[variant]) {\n const token = typographyTokens.heading[headingMap[variant]];\n if (token) {\n return {\n fontSize: token.fontSize,\n fontWeight: String(token.fontWeight),\n lineHeight: token.lineHeight,\n };\n }\n }\n\n if (variant === \"display\" && typographyTokens.basic?.display) {\n const token = typographyTokens.basic.display;\n return {\n fontSize: token.fontSize,\n fontWeight: String(token.fontWeight),\n lineHeight: token.lineHeight,\n };\n }\n\n // Body variants\n const bodyMap: Record<string, string> = {\n bodyLg: \"body-lg\",\n bodyLgAccent: \"body-lg\",\n bodyLgParagraph: \"body-lg\",\n bodyMd: \"body-md\",\n bodyMdAccent: \"body-md\",\n bodyMdParagraph: \"body-md\",\n bodySm: \"body-sm\",\n bodySmAccent: \"body-sm\",\n bodySmParagraph: \"body-sm\",\n bodyXs: \"body-xs\",\n bodyXsAccent: \"body-xs\",\n bodyXsParagraph: \"body-xs\",\n };\n\n const bodyKey = bodyMap[variant];\n if (bodyKey && typographyTokens.basic?.[bodyKey]) {\n const token = typographyTokens.basic[bodyKey];\n let fontWeight = token.fontWeight;\n let lineHeight = token.lineHeight;\n\n if (variant.includes(\"Accent\") && token.accent) {\n fontWeight = token.accent.fontWeight;\n }\n\n if (variant.includes(\"Paragraph\") && token.paragraph) {\n lineHeight = token.paragraph.lineHeight;\n }\n\n return {\n fontSize: token.fontSize,\n fontWeight: String(fontWeight),\n lineHeight: lineHeight,\n };\n }\n }\n\n // Fallback to default styles (B2B mode for backwards compatibility)\n switch (variant) {\n case \"h1\":\n return { fontSize: 56, fontWeight: \"400\", lineHeight: \"68px\" };\n case \"h2\":\n return { fontSize: 48, fontWeight: \"400\", lineHeight: \"58px\" };\n case \"h3\":\n return { fontSize: 32, fontWeight: \"400\", lineHeight: \"38px\" };\n case \"h4\":\n return { fontSize: 24, fontWeight: \"400\", lineHeight: \"28px\" };\n case \"h5\":\n return { fontSize: 20, fontWeight: \"600\", lineHeight: \"24px\" };\n case \"display\":\n return { fontSize: 64, fontWeight: \"400\", lineHeight: \"78px\" };\n case \"bodyLg\":\n return { fontSize: 18, fontWeight: \"400\", lineHeight: \"24px\" };\n case \"bodyLgAccent\":\n return { fontSize: 18, fontWeight: \"500\", lineHeight: \"24px\" };\n case \"bodyLgParagraph\":\n return { fontSize: 18, fontWeight: \"400\", lineHeight: \"26px\" };\n case \"bodyMd\":\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"20px\" };\n case \"bodyMdAccent\":\n return { fontSize: 16, fontWeight: \"500\", lineHeight: \"20px\" };\n case \"bodyMdParagraph\":\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"22px\" };\n case \"bodySm\":\n return { fontSize: 14, fontWeight: \"400\", lineHeight: \"18px\" };\n case \"bodySmAccent\":\n return { fontSize: 14, fontWeight: \"500\", lineHeight: \"18px\" };\n case \"bodySmParagraph\":\n return { fontSize: 14, fontWeight: \"400\", lineHeight: \"20px\" };\n case \"bodyXs\":\n return { fontSize: 12, fontWeight: \"400\", lineHeight: \"16px\" };\n case \"bodyXsAccent\":\n return { fontSize: 12, fontWeight: \"500\", lineHeight: \"16px\" };\n case \"bodyXsParagraph\":\n return { fontSize: 12, fontWeight: \"400\", lineHeight: \"18px\" };\n default:\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"20px\" };\n }\n};\n\nexport const Typography = forwardRef<any, TypographyProps>(\n (\n {\n children,\n align = \"inherit\",\n noWrap = false,\n variant = \"bodyMd\",\n color = \"inherit\",\n marginBottom = 0,\n marginTop = 0,\n as,\n productContext,\n themeMode,\n themeProductContext,\n ...rest\n },\n ref\n ) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n // If productContext is provided, use tokens for that specific context\n // Otherwise, use the tokens from the theme (context)\n const typographyTokens = productContext\n ? getTypographyTokens(productContext)\n : (theme as any).typographyTokens;\n const variantStyles = getVariantStyles(variant, typographyTokens);\n const colorValue = getColor(color, theme);\n const contextFonts = productContext\n ? getFonts(productContext)\n : (theme.fonts as Record<string, string>);\n const fontFamily = isHeadingVariant(variant)\n ? contextFonts?.heading\n : contextFonts?.body;\n\n return (\n <Text\n {...rest}\n ref={ref}\n as={as}\n color={colorValue}\n fontSize={variantStyles.fontSize}\n fontWeight={variantStyles.fontWeight}\n fontFamily={fontFamily}\n numberOfLines={noWrap ? 1 : undefined}\n style={{\n marginTop,\n marginBottom,\n textAlign: align === \"inherit\" ? undefined : align,\n lineHeight: variantStyles.lineHeight,\n ...(noWrap && {\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n }),\n ...rest.style,\n }}\n >\n {children}\n </Text>\n );\n }\n);\n\nTypography.displayName = \"Typography\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledText = styled.span<TextProps>`\n color: ${(props) => props.color \|\| \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize \|\| \"inherit\"};\n font-weight: ${(props) => props.fontWeight \|\| \"normal\"};\n font-family: ${(props) =>\n props.fontFamily \|\|\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight \|\| \"inherit\"};\n white-space: ${(props) => props.whiteSpace \|\| \"normal\"};\n text-align: ${(props) => props.textAlign \|\| \"inherit\"};\n text-decoration: ${(props) => props.textDecoration \|\| \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n"],"mappings":"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","names":["styled","import_jsx_runtime"]}

package/web/index.mjs CHANGED Viewed

@@ -36,13 +36,16 @@ var Text = ({
 // src/Typography.tsx
 import {
-  useDesignSystem,
+  useResolvedTheme,
   getTypographyTokens,
-  getFonts
+  getFonts,
+  isNative
 } from "@xsolla/xui-core";
 import { jsx as jsx2 } from "react/jsx-runtime";
 var getColor = (color, theme) => {
-  if (color === "inherit") return void 0;
+  if (color === "inherit") {
+    return isNative ? theme?.colors?.content?.primary : void 0;
+  }
   const colorMap = {
     primary: theme?.colors?.content?.primary,
     secondary: theme?.colors?.content?.secondary,
@@ -168,9 +171,11 @@ var Typography = forwardRef(
     marginTop = 0,
     as,
     productContext,
+    themeMode,
+    themeProductContext,
     ...rest
   }, ref) => {
-    const { theme } = useDesignSystem();
+    const { theme } = useResolvedTheme({ themeMode, themeProductContext });
     const typographyTokens = productContext ? getTypographyTokens(productContext) : theme.typographyTokens;
     const variantStyles = getVariantStyles(variant, typographyTokens);
     const colorValue = getColor(color, theme);

package/web/index.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../src/Typography.tsx","../../../primitives-web/src/Text.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Text } from \"@xsolla/xui-primitives\";\nimport {\n useDesignSystem,\n getTypographyTokens,\n getFonts,\n} from \"@xsolla/xui-core\";\nimport type { ColorType, TypographyProps, VariantType } from \"./types\";\n\nconst getColor = (\n color: ColorType \| string,\n theme: any\n): string \| undefined => {\n if (color === \"inherit\") return undefined;\n\n const colorMap: Record<string, string> = {\n primary: theme?.colors?.content?.primary,\n secondary: theme?.colors?.content?.secondary,\n tertiary: theme?.colors?.content?.tertiary,\n brand: theme?.colors?.content?.brand?.primary,\n brandSecondary: theme?.colors?.content?.brand?.secondary,\n success: theme?.colors?.content?.success?.primary,\n warning: theme?.colors?.content?.warning?.primary,\n alert: theme?.colors?.content?.alert?.primary,\n neutral: theme?.colors?.content?.neutral?.primary,\n };\n\n return colorMap[color] \|\| color;\n};\n\nconst isHeadingVariant = (variant: VariantType): boolean =>\n variant === \"h1\" \|\|\n variant === \"h2\" \|\|\n variant === \"h3\" \|\|\n variant === \"h4\" \|\|\n variant === \"h5\" \|\|\n variant === \"display\";\n\nconst getVariantStyles = (variant: VariantType, typographyTokens?: any) => {\n // If typography tokens are provided from theme, use them\n if (typographyTokens) {\n const headingMap: Record<string, keyof typeof typographyTokens.heading> = {\n h1: \"h1\",\n h2: \"h2\",\n h3: \"h3\",\n h4: \"h4\",\n h5: \"h5\",\n };\n\n if (headingMap[variant]) {\n const token = typographyTokens.heading[headingMap[variant]];\n if (token) {\n return {\n fontSize: token.fontSize,\n fontWeight: String(token.fontWeight),\n lineHeight: token.lineHeight,\n };\n }\n }\n\n if (variant === \"display\" && typographyTokens.basic?.display) {\n const token = typographyTokens.basic.display;\n return {\n fontSize: token.fontSize,\n fontWeight: String(token.fontWeight),\n lineHeight: token.lineHeight,\n };\n }\n\n // Body variants\n const bodyMap: Record<string, string> = {\n bodyLg: \"body-lg\",\n bodyLgAccent: \"body-lg\",\n bodyLgParagraph: \"body-lg\",\n bodyMd: \"body-md\",\n bodyMdAccent: \"body-md\",\n bodyMdParagraph: \"body-md\",\n bodySm: \"body-sm\",\n bodySmAccent: \"body-sm\",\n bodySmParagraph: \"body-sm\",\n bodyXs: \"body-xs\",\n bodyXsAccent: \"body-xs\",\n bodyXsParagraph: \"body-xs\",\n };\n\n const bodyKey = bodyMap[variant];\n if (bodyKey && typographyTokens.basic?.[bodyKey]) {\n const token = typographyTokens.basic[bodyKey];\n let fontWeight = token.fontWeight;\n let lineHeight = token.lineHeight;\n\n if (variant.includes(\"Accent\") && token.accent) {\n fontWeight = token.accent.fontWeight;\n }\n\n if (variant.includes(\"Paragraph\") && token.paragraph) {\n lineHeight = token.paragraph.lineHeight;\n }\n\n return {\n fontSize: token.fontSize,\n fontWeight: String(fontWeight),\n lineHeight: lineHeight,\n };\n }\n }\n\n // Fallback to default styles (B2B mode for backwards compatibility)\n switch (variant) {\n case \"h1\":\n return { fontSize: 56, fontWeight: \"400\", lineHeight: \"68px\" };\n case \"h2\":\n return { fontSize: 48, fontWeight: \"400\", lineHeight: \"58px\" };\n case \"h3\":\n return { fontSize: 32, fontWeight: \"400\", lineHeight: \"38px\" };\n case \"h4\":\n return { fontSize: 24, fontWeight: \"400\", lineHeight: \"28px\" };\n case \"h5\":\n return { fontSize: 20, fontWeight: \"600\", lineHeight: \"24px\" };\n case \"display\":\n return { fontSize: 64, fontWeight: \"400\", lineHeight: \"78px\" };\n case \"bodyLg\":\n return { fontSize: 18, fontWeight: \"400\", lineHeight: \"24px\" };\n case \"bodyLgAccent\":\n return { fontSize: 18, fontWeight: \"500\", lineHeight: \"24px\" };\n case \"bodyLgParagraph\":\n return { fontSize: 18, fontWeight: \"400\", lineHeight: \"26px\" };\n case \"bodyMd\":\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"20px\" };\n case \"bodyMdAccent\":\n return { fontSize: 16, fontWeight: \"500\", lineHeight: \"20px\" };\n case \"bodyMdParagraph\":\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"22px\" };\n case \"bodySm\":\n return { fontSize: 14, fontWeight: \"400\", lineHeight: \"18px\" };\n case \"bodySmAccent\":\n return { fontSize: 14, fontWeight: \"500\", lineHeight: \"18px\" };\n case \"bodySmParagraph\":\n return { fontSize: 14, fontWeight: \"400\", lineHeight: \"20px\" };\n case \"bodyXs\":\n return { fontSize: 12, fontWeight: \"400\", lineHeight: \"16px\" };\n case \"bodyXsAccent\":\n return { fontSize: 12, fontWeight: \"500\", lineHeight: \"16px\" };\n case \"bodyXsParagraph\":\n return { fontSize: 12, fontWeight: \"400\", lineHeight: \"18px\" };\n default:\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"20px\" };\n }\n};\n\nexport const Typography = forwardRef<any, TypographyProps>(\n (\n {\n children,\n align = \"inherit\",\n noWrap = false,\n variant = \"bodyMd\",\n color = \"inherit\",\n marginBottom = 0,\n marginTop = 0,\n as,\n productContext,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n // If productContext is provided, use tokens for that specific context\n // Otherwise, use the tokens from the theme (context)\n const typographyTokens = productContext\n ? getTypographyTokens(productContext)\n : (theme as any).typographyTokens;\n const variantStyles = getVariantStyles(variant, typographyTokens);\n const colorValue = getColor(color, theme);\n const contextFonts = productContext\n ? getFonts(productContext)\n : (theme.fonts as Record<string, string>);\n const fontFamily = isHeadingVariant(variant)\n ? contextFonts?.heading\n : contextFonts?.body;\n\n return (\n <Text\n {...rest}\n ref={ref}\n as={as}\n color={colorValue}\n fontSize={variantStyles.fontSize}\n fontWeight={variantStyles.fontWeight}\n fontFamily={fontFamily}\n numberOfLines={noWrap ? 1 : undefined}\n style={{\n marginTop,\n marginBottom,\n textAlign: align === \"inherit\" ? undefined : align,\n lineHeight: variantStyles.lineHeight,\n ...(noWrap && {\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n }),\n ...rest.style,\n }}\n >\n {children}\n </Text>\n );\n }\n);\n\nTypography.displayName = \"Typography\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledText = styled.span<TextProps>`\n color: ${(props) => props.color \|\| \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize \|\| \"inherit\"};\n font-weight: ${(props) => props.fontWeight \|\| \"normal\"};\n font-family: ${(props) =>\n props.fontFamily \|\|\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight \|\| \"inherit\"};\n white-space: ${(props) => props.whiteSpace \|\| \"normal\"};\n text-align: ${(props) => props.textAlign \|\| \"inherit\"};\n text-decoration: ${(props) => props.textDecoration \|\| \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n"],"mappings":"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","names":["jsx"]}
1	+ {"version":3,"sources":["../../src/Typography.tsx","../../../primitives-web/src/Text.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Text } from \"@xsolla/xui-primitives\";\nimport {\n useResolvedTheme,\n getTypographyTokens,\n getFonts,\n isNative,\n} from \"@xsolla/xui-core\";\nimport type { ColorType, TypographyProps, VariantType } from \"./types\";\n\nconst getColor = (\n color: ColorType \| string,\n theme: any\n): string \| undefined => {\n if (color === \"inherit\") {\n return isNative ? theme?.colors?.content?.primary : undefined;\n }\n\n const colorMap: Record<string, string> = {\n primary: theme?.colors?.content?.primary,\n secondary: theme?.colors?.content?.secondary,\n tertiary: theme?.colors?.content?.tertiary,\n brand: theme?.colors?.content?.brand?.primary,\n brandSecondary: theme?.colors?.content?.brand?.secondary,\n success: theme?.colors?.content?.success?.primary,\n warning: theme?.colors?.content?.warning?.primary,\n alert: theme?.colors?.content?.alert?.primary,\n neutral: theme?.colors?.content?.neutral?.primary,\n };\n\n return colorMap[color] \|\| color;\n};\n\nconst isHeadingVariant = (variant: VariantType): boolean =>\n variant === \"h1\" \|\|\n variant === \"h2\" \|\|\n variant === \"h3\" \|\|\n variant === \"h4\" \|\|\n variant === \"h5\" \|\|\n variant === \"display\";\n\nconst getVariantStyles = (variant: VariantType, typographyTokens?: any) => {\n // If typography tokens are provided from theme, use them\n if (typographyTokens) {\n const headingMap: Record<string, keyof typeof typographyTokens.heading> = {\n h1: \"h1\",\n h2: \"h2\",\n h3: \"h3\",\n h4: \"h4\",\n h5: \"h5\",\n };\n\n if (headingMap[variant]) {\n const token = typographyTokens.heading[headingMap[variant]];\n if (token) {\n return {\n fontSize: token.fontSize,\n fontWeight: String(token.fontWeight),\n lineHeight: token.lineHeight,\n };\n }\n }\n\n if (variant === \"display\" && typographyTokens.basic?.display) {\n const token = typographyTokens.basic.display;\n return {\n fontSize: token.fontSize,\n fontWeight: String(token.fontWeight),\n lineHeight: token.lineHeight,\n };\n }\n\n // Body variants\n const bodyMap: Record<string, string> = {\n bodyLg: \"body-lg\",\n bodyLgAccent: \"body-lg\",\n bodyLgParagraph: \"body-lg\",\n bodyMd: \"body-md\",\n bodyMdAccent: \"body-md\",\n bodyMdParagraph: \"body-md\",\n bodySm: \"body-sm\",\n bodySmAccent: \"body-sm\",\n bodySmParagraph: \"body-sm\",\n bodyXs: \"body-xs\",\n bodyXsAccent: \"body-xs\",\n bodyXsParagraph: \"body-xs\",\n };\n\n const bodyKey = bodyMap[variant];\n if (bodyKey && typographyTokens.basic?.[bodyKey]) {\n const token = typographyTokens.basic[bodyKey];\n let fontWeight = token.fontWeight;\n let lineHeight = token.lineHeight;\n\n if (variant.includes(\"Accent\") && token.accent) {\n fontWeight = token.accent.fontWeight;\n }\n\n if (variant.includes(\"Paragraph\") && token.paragraph) {\n lineHeight = token.paragraph.lineHeight;\n }\n\n return {\n fontSize: token.fontSize,\n fontWeight: String(fontWeight),\n lineHeight: lineHeight,\n };\n }\n }\n\n // Fallback to default styles (B2B mode for backwards compatibility)\n switch (variant) {\n case \"h1\":\n return { fontSize: 56, fontWeight: \"400\", lineHeight: \"68px\" };\n case \"h2\":\n return { fontSize: 48, fontWeight: \"400\", lineHeight: \"58px\" };\n case \"h3\":\n return { fontSize: 32, fontWeight: \"400\", lineHeight: \"38px\" };\n case \"h4\":\n return { fontSize: 24, fontWeight: \"400\", lineHeight: \"28px\" };\n case \"h5\":\n return { fontSize: 20, fontWeight: \"600\", lineHeight: \"24px\" };\n case \"display\":\n return { fontSize: 64, fontWeight: \"400\", lineHeight: \"78px\" };\n case \"bodyLg\":\n return { fontSize: 18, fontWeight: \"400\", lineHeight: \"24px\" };\n case \"bodyLgAccent\":\n return { fontSize: 18, fontWeight: \"500\", lineHeight: \"24px\" };\n case \"bodyLgParagraph\":\n return { fontSize: 18, fontWeight: \"400\", lineHeight: \"26px\" };\n case \"bodyMd\":\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"20px\" };\n case \"bodyMdAccent\":\n return { fontSize: 16, fontWeight: \"500\", lineHeight: \"20px\" };\n case \"bodyMdParagraph\":\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"22px\" };\n case \"bodySm\":\n return { fontSize: 14, fontWeight: \"400\", lineHeight: \"18px\" };\n case \"bodySmAccent\":\n return { fontSize: 14, fontWeight: \"500\", lineHeight: \"18px\" };\n case \"bodySmParagraph\":\n return { fontSize: 14, fontWeight: \"400\", lineHeight: \"20px\" };\n case \"bodyXs\":\n return { fontSize: 12, fontWeight: \"400\", lineHeight: \"16px\" };\n case \"bodyXsAccent\":\n return { fontSize: 12, fontWeight: \"500\", lineHeight: \"16px\" };\n case \"bodyXsParagraph\":\n return { fontSize: 12, fontWeight: \"400\", lineHeight: \"18px\" };\n default:\n return { fontSize: 16, fontWeight: \"400\", lineHeight: \"20px\" };\n }\n};\n\nexport const Typography = forwardRef<any, TypographyProps>(\n (\n {\n children,\n align = \"inherit\",\n noWrap = false,\n variant = \"bodyMd\",\n color = \"inherit\",\n marginBottom = 0,\n marginTop = 0,\n as,\n productContext,\n themeMode,\n themeProductContext,\n ...rest\n },\n ref\n ) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n // If productContext is provided, use tokens for that specific context\n // Otherwise, use the tokens from the theme (context)\n const typographyTokens = productContext\n ? getTypographyTokens(productContext)\n : (theme as any).typographyTokens;\n const variantStyles = getVariantStyles(variant, typographyTokens);\n const colorValue = getColor(color, theme);\n const contextFonts = productContext\n ? getFonts(productContext)\n : (theme.fonts as Record<string, string>);\n const fontFamily = isHeadingVariant(variant)\n ? contextFonts?.heading\n : contextFonts?.body;\n\n return (\n <Text\n {...rest}\n ref={ref}\n as={as}\n color={colorValue}\n fontSize={variantStyles.fontSize}\n fontWeight={variantStyles.fontWeight}\n fontFamily={fontFamily}\n numberOfLines={noWrap ? 1 : undefined}\n style={{\n marginTop,\n marginBottom,\n textAlign: align === \"inherit\" ? undefined : align,\n lineHeight: variantStyles.lineHeight,\n ...(noWrap && {\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n }),\n ...rest.style,\n }}\n >\n {children}\n </Text>\n );\n }\n);\n\nTypography.displayName = \"Typography\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledText = styled.span<TextProps>`\n color: ${(props) => props.color \|\| \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize \|\| \"inherit\"};\n font-weight: ${(props) => props.fontWeight \|\| \"normal\"};\n font-family: ${(props) =>\n props.fontFamily \|\|\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight \|\| \"inherit\"};\n white-space: ${(props) => props.whiteSpace \|\| \"normal\"};\n text-align: ${(props) => props.textAlign \|\| \"inherit\"};\n text-decoration: ${(props) => props.textDecoration \|\| \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n"],"mappings":"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","names":["jsx"]}