npm - @xsolla/xui-button - Versions diffs - 0.171.2 → 0.171.3 - Mend

@xsolla/xui-button 0.171.2 → 0.171.3

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.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../src/index.tsx","../../src/Button.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx","../../../../foundation/primitives-native/src/Spinner.tsx","../../../../foundation/primitives-native/src/Icon.tsx","../../src/IconButton.tsx","../../src/FlexButton.tsx","../../src/AppButton.tsx","../../src/ButtonGroup.tsx"],"sourcesContent":["export * from \"./Button\";\nexport * from \"./IconButton\";\nexport * from \"./FlexButton\";\nexport * from \"./AppButton\";\nexport * from \"./ButtonGroup\";\n","import React, { useState } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Spinner } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\n\n// Local type definitions for button styling\ninterface ControlVariantStyles {\n bg: string;\n bgHover: string;\n bgPress: string;\n bgDisable?: string;\n border: string;\n borderHover: string;\n borderPress: string;\n borderDisable?: string;\n}\n\ninterface ControlTextStyles {\n primary: string;\n secondary: string;\n tertiary: string;\n ghost: string;\n disable: string;\n}\n\ninterface ButtonSizeStyles {\n height: number;\n padding: number;\n fontSize: number;\n sublabelFontSize: number;\n spinnerSize: number;\n iconSize: number;\n iconContainerSize: number;\n iconPadding: number;\n loadingPadding: number;\n borderRadius: number;\n labelIconSize: number;\n labelIconGap: number;\n}\n\n/*\n Helper to clone an icon element with default props.\n * Only applies size/color if not already specified by the user.\n * This allows users to override the default size: <ArrowRight size={16} />\n /\nconst cloneIconWithDefaults = (\n icon: React.ReactNode,\n defaultSize: number,\n defaultColor: string\n): React.ReactNode => {\n if (!React.isValidElement(icon)) return icon;\n\n const iconElement = icon as React.ReactElement<any>;\n const existingProps = iconElement.props \|\| {};\n\n return React.cloneElement(iconElement, {\n ...existingProps, // Preserve existing props (including accessibility attributes)\n size: existingProps.size ?? defaultSize,\n color: existingProps.color ?? defaultColor,\n });\n};\n\nexport interface ButtonProps extends ThemeOverrideProps {\n /* Visual variant of the button /\n variant?: \"primary\" \| \"secondary\" \| \"tertiary\" \| \"ghost\";\n /* Color tone of the button /\n tone?: \"brand\" \| \"brandExtra\" \| \"alert\" \| \"mono\";\n /* Size of the button /\n size?: \"xl\" \| \"lg\" \| \"md\" \| \"sm\" \| \"xs\";\n /* Whether the button is disabled /\n disabled?: boolean;\n /* Whether the button is in a loading state /\n loading?: boolean;\n /* Button content /\n children: React.ReactNode;\n /* Click handler /\n onPress?: () => void;\n /\n Icon to display on the left side.\n * Size and color are automatically set based on button size/state.\n * To override, specify size/color on the icon: `iconLeft={<ArrowLeft size={16} />}`\n /\n iconLeft?: React.ReactNode;\n /\n Icon to display on the right side.\n * Size and color are automatically set based on button size/state.\n * To override, specify size/color on the icon: `iconRight={<ArrowRight size={16} />}`\n /\n iconRight?: React.ReactNode;\n /* Secondary text displayed inline with the main label (e.g., price), shown with 40% opacity /\n sublabel?: string;\n /* Alignment of the label text /\n labelAlignment?: \"left\" \| \"center\";\n /\n Small icon displayed directly next to the label text.\n * Size and color are automatically set based on button size/state.\n * To override, specify size/color on the icon: `labelIcon={<InfoIcon size={12} />}`\n /\n labelIcon?: React.ReactNode;\n /* Custom content slot for badges, tags, or other elements /\n customContent?: React.ReactNode;\n /* Accessible label for screen readers (use for icon-only buttons) /\n \"aria-label\"?: string;\n /* ID of element that describes this button /\n \"aria-describedby\"?: string;\n /* Indicates the button controls an expandable element /\n \"aria-expanded\"?: boolean;\n /* Indicates the type of popup triggered by the button /\n \"aria-haspopup\"?: boolean \| \"menu\" \| \"listbox\" \| \"tree\" \| \"grid\" \| \"dialog\";\n /* Indicates the button is pressed (for toggle buttons) /\n \"aria-pressed\"?: boolean \| \"mixed\";\n /* ID of the element this button controls /\n \"aria-controls\"?: string;\n /* Test ID for testing frameworks /\n testID?: string;\n /* HTML id attribute /\n id?: string;\n /* HTML type attribute for the button /\n type?: \"button\" \| \"submit\" \| \"reset\";\n /* Whether the button should stretch to fill the full width of its container /\n fullWidth?: boolean;\n}\n\n/\n Button - An accessible button component\n \n Renders as a semantic `<button>` element with full ARIA support.\n * Supports various visual variants, sizes, and states including loading.\n \n ## Accessibility Features\n \n - Semantic HTML: Renders as a native `<button>` element\n * - Keyboard Navigation: Focusable via Tab, activated with Enter or Space\n * - ARIA States: Properly announces disabled and loading states\n * - Focus Indicator: Visible focus ring for keyboard navigation\n * - Screen Reader Support: Announces button label, state, and any associated descriptions\n \n /\nexport const Button: React.FC<ButtonProps> = ({\n variant = \"primary\",\n tone = \"brand\",\n size = \"md\",\n disabled = false,\n loading = false,\n children,\n onPress,\n iconLeft,\n iconRight,\n sublabel,\n labelAlignment = \"center\",\n labelIcon,\n customContent,\n \"aria-label\": ariaLabel,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n testID,\n id,\n type = \"button\",\n fullWidth = false,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const [isKeyboardPressed, setIsKeyboardPressed] = useState(false);\n\n const isDisabled = disabled \|\| loading;\n\n // Resolve Config from Theme - type assertion for extended sizing properties\n const sizeStyles = theme.sizing.button(size) as ButtonSizeStyles;\n\n // Type assertion for control variant styles - the JSON tokens include tertiary\n const controlTone = theme?.colors?.control?.[tone] as unknown as\n \| (Record<string, ControlVariantStyles> & { text: ControlTextStyles })\n \| undefined;\n\n const variantStyles: ControlVariantStyles = controlTone?.[variant] \|\|\n (\n theme?.colors?.control?.brand as unknown as Record<\n string,\n ControlVariantStyles\n >\n )?.primary \|\| {\n bg: \"transparent\",\n bgHover: \"transparent\",\n bgPress: \"transparent\",\n bgDisable: \"transparent\",\n border: \"transparent\",\n borderHover: \"transparent\",\n borderPress: \"transparent\",\n borderDisable: \"transparent\",\n };\n\n // Text colors are at the tone level, mapped by variant name\n const textStyles: ControlTextStyles = controlTone?.text \|\|\n (theme?.colors?.control?.brand as unknown as { text: ControlTextStyles })\n ?.text \|\| {\n primary: \"#000\",\n secondary: \"#fff\",\n tertiary: \"#888\",\n ghost: \"#000\",\n disable: \"#666\",\n };\n\n const handlePress = () => {\n if (!isDisabled && onPress) {\n onPress();\n }\n };\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (isDisabled) return;\n\n if (e.key === \"Enter\" \|\| e.key === \" \") {\n e.preventDefault();\n setIsKeyboardPressed(true);\n }\n };\n\n const handleKeyUp = (e: React.KeyboardEvent) => {\n if (isDisabled) return;\n\n if (e.key === \"Enter\" \|\| e.key === \" \") {\n e.preventDefault();\n setIsKeyboardPressed(false);\n if (onPress) {\n onPress();\n }\n }\n };\n\n // Determine background color based on state\n let backgroundColor = variantStyles.bg;\n if (disabled) {\n backgroundColor = variantStyles.bgDisable \|\| variantStyles.bg;\n } else if (isKeyboardPressed) {\n backgroundColor = variantStyles.bgPress \|\| variantStyles.bg;\n }\n\n const borderColor = disabled\n ? variantStyles.borderDisable \|\| variantStyles.border\n : variantStyles.border;\n\n // Text color is determined by variant, with disable color for disabled state\n const textColor = disabled ? textStyles.disable : textStyles[variant];\n\n // Only use aria-label when explicitly provided\n // Text content provides accessible name naturally for buttons with visible text\n const computedAriaLabel = ariaLabel;\n\n return (\n <Box\n as=\"button\"\n type={type}\n id={id}\n onPress={handlePress}\n onKeyDown={handleKeyDown}\n onKeyUp={handleKeyUp}\n disabled={isDisabled}\n aria-label={computedAriaLabel}\n aria-disabled={isDisabled \|\| undefined}\n aria-busy={loading \|\| undefined}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n testID={testID}\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={\n borderColor !== \"transparent\" &&\n borderColor !== \"rgba(255, 255, 255, 0)\"\n ? 1\n : 0\n }\n borderRadius={sizeStyles.borderRadius}\n height={sizeStyles.height}\n width={fullWidth ? \"100%\" : undefined}\n padding={0}\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"center\"\n position=\"relative\"\n cursor={disabled ? \"not-allowed\" : loading ? \"wait\" : \"pointer\"}\n style={{ transition: \"background-color 500ms ease\", opacity: 1 }}\n hoverStyle={\n !isDisabled\n ? {\n backgroundColor: variantStyles?.bgHover,\n }\n : undefined\n }\n pressStyle={\n !isDisabled\n ? {\n backgroundColor: variantStyles?.bgPress,\n }\n : undefined\n }\n focusStyle={{\n outlineColor: theme.colors.border.brand,\n outlineWidth: 2,\n outlineOffset: 2,\n outlineStyle: \"solid\",\n }}\n >\n {/* Loading Spinner - Absolutely positioned in center /}\n {loading && (\n <Box\n position=\"absolute\"\n top={0}\n left={0}\n right={0}\n bottom={0}\n alignItems=\"center\"\n justifyContent=\"center\"\n zIndex={1}\n >\n <Spinner\n color={textColor}\n size={sizeStyles.spinnerSize}\n aria-hidden={true}\n />\n </Box>\n )}\n\n {/ Left Icon Section - Square container matching button height /}\n {iconLeft && (\n <Box\n width={sizeStyles.iconContainerSize}\n height={sizeStyles.iconContainerSize}\n alignItems=\"center\"\n justifyContent=\"center\"\n aria-hidden={true}\n style={{\n opacity: loading ? 0 : 1,\n pointerEvents: loading ? \"none\" : \"auto\",\n }}\n >\n {cloneIconWithDefaults(iconLeft, sizeStyles.iconSize, textColor)}\n </Box>\n )}\n\n {/ Center Section: Content Area /}\n <Box\n flex={fullWidth ? 1 : undefined}\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent={labelAlignment === \"left\" ? \"flex-start\" : \"center\"}\n paddingHorizontal={sizeStyles.padding}\n height=\"100%\"\n gap={sizeStyles.labelIconGap}\n style={{\n opacity: loading ? 0 : 1,\n pointerEvents: loading ? \"none\" : \"auto\",\n }}\n aria-hidden={loading ? true : undefined}\n >\n {/ Label Icon (left of text) /}\n {labelIcon && (\n <Box aria-hidden={true}>\n {cloneIconWithDefaults(\n labelIcon,\n sizeStyles.labelIconSize,\n textColor\n )}\n </Box>\n )}\n\n {/ Label /}\n <Text color={textColor} fontSize={sizeStyles.fontSize} fontWeight=\"500\">\n {children}\n </Text>\n\n {/ Sublabel - inline with label, 40% opacity as per Figma /}\n {sublabel && (\n <Text\n color={textColor}\n fontSize={sizeStyles.fontSize}\n fontWeight=\"500\"\n style={{ opacity: 0.4 }}\n >\n {sublabel}\n </Text>\n )}\n\n {/ Custom Content Slot /}\n {customContent && <Box aria-hidden={true}>{customContent}</Box>}\n </Box>\n\n {/ Right Icon Section - Square container matching button height /}\n {iconRight && (\n <Box\n width={sizeStyles.iconContainerSize}\n height={sizeStyles.iconContainerSize}\n alignItems=\"center\"\n justifyContent=\"center\"\n aria-hidden={true}\n style={{\n opacity: loading ? 0 : 1,\n pointerEvents: loading ? \"none\" : \"auto\",\n }}\n >\n {cloneIconWithDefaults(iconRight, sizeStyles.iconSize, textColor)}\n </Box>\n )}\n </Box>\n );\n};\n\nButton.displayName = \"Button\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n flexDirection,\n alignItems,\n justifyContent,\n position,\n top,\n bottom,\n left,\n right,\n width,\n minWidth,\n minHeight,\n maxWidth,\n maxHeight,\n flex,\n overflow,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n minWidth: minWidth as DimensionValue,\n minHeight: minHeight as DimensionValue,\n maxWidth: maxWidth as DimensionValue,\n maxHeight: maxHeight as DimensionValue,\n padding: padding as DimensionValue,\n paddingHorizontal: paddingHorizontal as DimensionValue,\n paddingVertical: paddingVertical as DimensionValue,\n margin: margin as DimensionValue,\n marginTop: marginTop as DimensionValue,\n marginBottom: marginBottom as DimensionValue,\n marginLeft: marginLeft as DimensionValue,\n marginRight: marginRight as DimensionValue,\n flexDirection,\n alignItems,\n justifyContent,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId \|\| testID;\n\n // Destructure and drop web-only props from rest before passing to RN components\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": _ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": _ariaDisabled,\n \"aria-live\": _ariaLive,\n className,\n \"data-testid\": _dataTestId,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n if (onPress) {\n return (\n <Pressable\n onPress={onPress}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\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 testID,\n \"data-testid\": dataTestId,\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={dataTestId \|\| testID \|\| id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","import type React from \"react\";\nimport { ActivityIndicator, View } from \"react-native\";\nimport type { SpinnerProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Spinner: React.FC<SpinnerProps> = ({\n color,\n size,\n role,\n \"aria-label\": ariaLabel,\n \"aria-live\": ariaLive,\n testID,\n}) => {\n return (\n <View\n accessible={true}\n accessibilityRole={role === \"status\" ? \"none\" : undefined}\n accessibilityLabel={ariaLabel}\n accessibilityLiveRegion={\n ariaLive === \"polite\"\n ? \"polite\"\n : ariaLive === \"assertive\"\n ? \"assertive\"\n : \"none\"\n }\n testID={testID}\n >\n <ActivityIndicator\n color={color}\n size={typeof size === \"number\" ? size : \"small\"}\n />\n </View>\n );\n};\n\nSpinner.displayName = \"Spinner\";\n","import React from \"react\";\nimport { View, ViewStyle } from \"react-native\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Icon: React.FC<IconProps> = ({\n children,\n color,\n size,\n testID,\n \"data-testid\": dataTestId,\n}) => {\n const style: ViewStyle = {\n width: typeof size === \"number\" ? size : undefined,\n height: typeof size === \"number\" ? size : undefined,\n alignItems: \"center\",\n justifyContent: \"center\",\n };\n\n // On native, we try to pass the color down to children (like Text primitives)\n // to mimic the CSS inheritance behavior of the web version.\n const childrenWithProps = React.Children.map(children, (child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n color: child.props.color \|\| color,\n // Also pass size if child seems to be an icon that needs it\n size: child.props.size \|\| size,\n });\n }\n return child;\n });\n\n return (\n <View style={style} testID={dataTestId \|\| testID}>\n {childrenWithProps}\n </View>\n );\n};\n","import React, { useState } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Spinner } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\n\n// Local type definitions for button styling\ninterface ControlVariantStyles {\n bg: string;\n bgHover: string;\n bgPress: string;\n bgDisable?: string;\n border: string;\n borderHover: string;\n borderPress: string;\n borderDisable?: string;\n}\n\ninterface ControlTextStyles {\n primary: string;\n secondary: string;\n tertiary: string;\n disable: string;\n}\n\ninterface ButtonSizeStyles {\n height: number;\n padding: number;\n fontSize: number;\n spinnerSize: number;\n iconSize: number;\n iconContainerSize: number;\n iconPadding: number;\n loadingPadding: number;\n borderRadius: number;\n}\n\n/\n Helper to clone an icon element with default props.\n * Only applies size/color if not already specified by the user, so consumers\n * can override the default size: `<ArrowRight size={16} />`.\n /\nconst cloneIconWithDefaults = (\n icon: React.ReactNode,\n defaultSize: number,\n defaultColor: string\n): React.ReactNode => {\n if (!React.isValidElement(icon)) return icon;\n\n const iconElement = icon as React.ReactElement<any>;\n const existingProps = iconElement.props \|\| {};\n\n return React.cloneElement(iconElement, {\n ...existingProps, // Preserve existing props (including accessibility attributes)\n size: existingProps.size ?? defaultSize,\n color: existingProps.color ?? defaultColor,\n });\n};\n\nexport interface IconButtonProps extends ThemeOverrideProps {\n /* Visual variant of the button /\n variant?: \"primary\" \| \"secondary\" \| \"tertiary\";\n /* Color tone of the button /\n tone?: \"brand\" \| \"brandExtra\" \| \"alert\" \| \"mono\";\n /* Size of the button /\n size?: \"xl\" \| \"lg\" \| \"md\" \| \"sm\" \| \"xs\";\n /* Whether the button is disabled /\n disabled?: boolean;\n /* Whether the button is in a loading state /\n loading?: boolean;\n /\n Icon to display in the button (required).\n * Size and color are automatically set based on button size/state.\n * To override, specify size/color on the icon: `icon={<CloseIcon size={16} />}`\n /\n icon: React.ReactNode;\n /\n Optional badge rendered absolutely at the top-right corner.\n * Pass a `<Badge>` element from `@xsolla/xui-badge`.\n /\n badge?: React.ReactNode;\n /* Click handler /\n onPress?: () => void;\n /\n Accessible label for screen readers (REQUIRED for icon-only buttons)\n * Since icon buttons have no visible text, this label is essential for accessibility.\n * @example aria-label=\"Close dialog\"\n * @example aria-label=\"Open settings menu\"\n /\n \"aria-label\": string;\n /* ID of element that describes this button /\n \"aria-describedby\"?: string;\n /* Indicates the button controls an expandable element /\n \"aria-expanded\"?: boolean;\n /* Indicates the type of popup triggered by the button /\n \"aria-haspopup\"?: boolean \| \"menu\" \| \"listbox\" \| \"tree\" \| \"grid\" \| \"dialog\";\n /* Indicates the button is pressed (for toggle buttons) /\n \"aria-pressed\"?: boolean \| \"mixed\";\n /* ID of the element this button controls /\n \"aria-controls\"?: string;\n /* Test ID for testing frameworks /\n testID?: string;\n /* HTML id attribute /\n id?: string;\n /* HTML type attribute for the button /\n type?: \"button\" \| \"submit\" \| \"reset\";\n /* Override the hover background color. Pass \"none\" to remove it entirely. /\n hoverBackground?: string \| \"none\";\n}\n\n/\n IconButton - An accessible icon-only button component\n \n Renders as a semantic `<button>` element with full ARIA support.\n * Supports various visual variants, sizes, and states including loading.\n \n ## Accessibility Features\n \n - Semantic HTML: Renders as a native `<button>` element\n * - Required aria-label: Ensures screen readers can announce the button's purpose\n * - Keyboard Navigation: Focusable via Tab, activated with Enter or Space\n * - ARIA States: Properly announces disabled and loading states\n * - Focus Indicator: Visible focus ring for keyboard navigation\n * - Screen Reader Support: Announces button label, state, and any associated descriptions\n \n ## Usage\n \n ```tsx\n * // Basic usage - aria-label is required\n * <IconButton icon={<CloseIcon />} aria-label=\"Close dialog\" onPress={handleClose} />\n \n // Toggle button\n * <IconButton\n * icon={<MenuIcon />}\n * aria-label=\"Toggle menu\"\n * aria-expanded={isOpen}\n * aria-controls=\"menu-id\"\n * onPress={toggleMenu}\n * />\n \n // Loading state\n * <IconButton icon={<SaveIcon />} aria-label=\"Save changes\" loading />\n * ```\n /\nexport const IconButton: React.FC<IconButtonProps> = ({\n variant = \"primary\",\n tone = \"brand\",\n size = \"md\",\n disabled = false,\n loading = false,\n icon,\n badge,\n onPress,\n \"aria-label\": ariaLabel,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n testID,\n id,\n type = \"button\",\n themeMode,\n themeProductContext,\n hoverBackground,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const [isKeyboardPressed, setIsKeyboardPressed] = useState(false);\n\n const isDisabled = disabled \|\| loading;\n\n // Type assertion for extended sizing properties\n const sizeStyles = theme.sizing.button(size) as ButtonSizeStyles;\n\n // Type assertion for control variant styles - the JSON tokens include tertiary\n const controlTone = theme?.colors?.control?.[tone] as unknown as\n \| (Record<string, ControlVariantStyles> & { text: ControlTextStyles })\n \| undefined;\n\n const variantStyles: ControlVariantStyles = controlTone?.[variant] \|\|\n (\n theme?.colors?.control?.brand as unknown as Record<\n string,\n ControlVariantStyles\n >\n )?.primary \|\| {\n bg: \"transparent\",\n bgHover: \"transparent\",\n bgPress: \"transparent\",\n bgDisable: \"transparent\",\n border: \"transparent\",\n borderHover: \"transparent\",\n borderPress: \"transparent\",\n borderDisable: \"transparent\",\n };\n\n // Text colors are at the tone level, mapped by variant name\n const textStyles: ControlTextStyles = controlTone?.text \|\|\n (theme?.colors?.control?.brand as unknown as { text: ControlTextStyles })\n ?.text \|\| {\n primary: \"#000\",\n secondary: \"#fff\",\n tertiary: \"#888\",\n disable: \"#666\",\n };\n\n const handlePress = () => {\n if (!isDisabled && onPress) {\n onPress();\n }\n };\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (isDisabled) return;\n\n if (e.key === \"Enter\" \|\| e.key === \" \") {\n e.preventDefault();\n setIsKeyboardPressed(true);\n }\n };\n\n const handleKeyUp = (e: React.KeyboardEvent) => {\n if (isDisabled) return;\n\n if (e.key === \"Enter\" \|\| e.key === \" \") {\n e.preventDefault();\n setIsKeyboardPressed(false);\n if (onPress) {\n onPress();\n }\n }\n };\n\n // Disabled state is identical across all variants AND tones per Figma —\n // always resolve from control.brand.primary, ignoring the active tone/variant.\n // bg/border tokens are typed optional, so fall back to transparent.\n const brandControl = theme.colors.control.brand as unknown as Record<\n string,\n ControlVariantStyles\n > & { text: ControlTextStyles };\n const disabledBg = brandControl.primary.bgDisable ?? \"transparent\";\n const disabledBorder = brandControl.primary.borderDisable ?? \"transparent\";\n const disabledText = brandControl.text.disable;\n\n let backgroundColor = variantStyles.bg;\n if (disabled) {\n backgroundColor = disabledBg;\n } else if (isKeyboardPressed) {\n backgroundColor = variantStyles.bgPress \|\| variantStyles.bg;\n }\n\n const borderColor = disabled ? disabledBorder : variantStyles.border;\n\n const textColor = disabled ? disabledText : textStyles[variant];\n\n return (\n <Box\n as=\"button\"\n type={type}\n id={id}\n onPress={handlePress}\n onKeyDown={handleKeyDown}\n onKeyUp={handleKeyUp}\n disabled={isDisabled}\n aria-label={ariaLabel}\n aria-disabled={isDisabled \|\| undefined}\n aria-busy={loading \|\| undefined}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n testID={testID}\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={\n borderColor !== \"transparent\" &&\n borderColor !== \"rgba(255, 255, 255, 0)\"\n ? 1\n : 0\n }\n borderRadius={sizeStyles.borderRadius}\n height={sizeStyles.height}\n width={sizeStyles.height}\n padding={0}\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"center\"\n position=\"relative\"\n cursor={disabled ? \"not-allowed\" : loading ? \"wait\" : \"pointer\"}\n style={{ opacity: 1 }}\n hoverStyle={\n !isDisabled\n ? {\n backgroundColor:\n hoverBackground === \"none\"\n ? \"transparent\"\n : (hoverBackground ?? variantStyles.bgHover),\n }\n : undefined\n }\n pressStyle={\n !isDisabled\n ? {\n backgroundColor: variantStyles.bgPress,\n }\n : undefined\n }\n focusStyle={{\n outlineColor: theme.colors.border.brand,\n outlineWidth: 2,\n outlineOffset: 2,\n outlineStyle: \"solid\",\n }}\n >\n {/ Loading Spinner - Absolutely positioned in center /}\n {loading && (\n <Box\n position=\"absolute\"\n top={0}\n left={0}\n right={0}\n bottom={0}\n alignItems=\"center\"\n justifyContent=\"center\"\n zIndex={1}\n >\n <Spinner\n color={textColor}\n size={sizeStyles.spinnerSize}\n aria-hidden={true}\n />\n </Box>\n )}\n\n {/ Icon - Hidden when loading but maintains layout /}\n <Box\n aria-hidden={true}\n style={{\n opacity: loading ? 0 : 1,\n pointerEvents: loading ? \"none\" : \"auto\",\n }}\n >\n {cloneIconWithDefaults(icon, sizeStyles.iconSize, textColor)}\n </Box>\n\n {badge && (\n <Box\n position=\"absolute\"\n top={0}\n right={0}\n zIndex={2}\n pointerEvents=\"none\"\n style={{ transform: \"translate(50%, -50%)\" }}\n >\n {badge}\n </Box>\n )}\n </Box>\n );\n};\n\nIconButton.displayName = \"IconButton\";\n","import React, {\n useRef,\n useState,\n type CSSProperties,\n type ReactNode,\n} from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Spinner, Icon } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\n\nexport interface FlexButtonProps\n extends\n Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, \"type\">,\n ThemeOverrideProps {\n /* Button content /\n children: ReactNode;\n /* Visual variant of the button /\n variant?:\n \| \"brand\"\n \| \"primary\"\n \| \"secondary\"\n \| \"tertiary\"\n \| \"brandExtra\"\n \| \"inverse\";\n /* Size of the button /\n size?: \"xl\" \| \"lg\" \| \"md\" \| \"sm\" \| \"xs\";\n /* Whether to show background fill /\n background?: boolean;\n /* Whether the button is disabled /\n disabled?: boolean;\n /* Whether the button is in a loading state /\n loading?: boolean;\n /* Icon to display on the left side /\n iconLeft?: ReactNode;\n /* Icon to display on the right side /\n iconRight?: ReactNode;\n /* Click handler /\n onPress?: () => void;\n /* HTML type attribute for the button /\n type?: \"button\" \| \"submit\" \| \"reset\";\n /* Accessible label for screen readers /\n \"aria-label\"?: string;\n /* ID of element that describes this button /\n \"aria-describedby\"?: string;\n /* Indicates the button controls an expandable element /\n \"aria-expanded\"?: boolean;\n /* Indicates the type of popup triggered by the button /\n \"aria-haspopup\"?: boolean \| \"menu\" \| \"listbox\" \| \"tree\" \| \"grid\" \| \"dialog\";\n /* Indicates the button is pressed (for toggle buttons) /\n \"aria-pressed\"?: boolean \| \"mixed\";\n /* ID of the element this button controls /\n \"aria-controls\"?: string;\n /* Test ID for testing frameworks /\n testID?: string;\n}\n\ntype ButtonState = \"default\" \| \"hover\" \| \"press\";\n\nconst ICON_SIZES: Record<NonNullable<FlexButtonProps[\"size\"]>, number> = {\n xs: 12,\n sm: 14,\n md: 16,\n lg: 18,\n xl: 20,\n};\n\nconst SPINNER_SIZES: Record<NonNullable<FlexButtonProps[\"size\"]>, number> = {\n xs: 12,\n sm: 14,\n md: 16,\n lg: 18,\n xl: 20,\n};\n\nconst LINE_HEIGHTS: Record<NonNullable<FlexButtonProps[\"size\"]>, string> = {\n xs: \"14px\",\n sm: \"16px\",\n md: \"18px\",\n lg: \"20px\",\n xl: \"22px\",\n};\n\nconst FONT_SIZES: Record<NonNullable<FlexButtonProps[\"size\"]>, number> = {\n xs: 12,\n sm: 14,\n md: 14,\n lg: 16,\n xl: 18,\n};\n\nconst BORDER_RADIUS: Record<NonNullable<FlexButtonProps[\"size\"]>, number> = {\n xl: 4,\n lg: 4,\n md: 2,\n sm: 2,\n xs: 2,\n};\n\n/\n FlexButton - A compact button component designed for use in modals and popups.\n \n Renders as a semantic `<button>` element with full ARIA support.\n \n ## Accessibility Features\n \n - Semantic HTML: Renders as a native `<button>` element\n * - Keyboard Navigation: Focusable via Tab, activated with Enter or Space\n * - ARIA States: Properly announces disabled and loading states\n * - Focus Indicator: Visible focus ring for keyboard navigation\n * - Screen Reader Support: Announces button label, state, and any associated descriptions\n /\nexport const FlexButton: React.FC<FlexButtonProps> = ({\n children,\n variant = \"brand\",\n size = \"md\",\n background = false,\n disabled = false,\n loading = false,\n iconLeft,\n iconRight,\n onPress,\n onClick,\n className,\n type = \"button\",\n \"aria-label\": ariaLabel,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n testID,\n tabIndex = 0,\n themeMode,\n themeProductContext,\n ...buttonProps\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const [state, setState] = useState<ButtonState>(\"default\");\n const [isFocused, setIsFocused] = useState(false);\n const isMouseOverRef = useRef(false);\n\n const isDisabled = disabled \|\| loading;\n\n const getVariantColors = (\n currentState: ButtonState\n ): { bg: string; text: string; border?: string } => {\n if (isDisabled) {\n return {\n bg: background ? theme.colors.overlay.mono : \"transparent\",\n text: theme.colors.control.text.disable,\n border: undefined,\n };\n }\n\n const effectiveBackground = loading ? false : background;\n\n switch (variant) {\n case \"brand\":\n if (effectiveBackground) {\n return {\n bg:\n currentState === \"press\"\n ? theme.colors.control.brand.primary.bgPress\n : currentState === \"hover\"\n ? theme.colors.control.brand.primary.bgHover\n : theme.colors.background.brand.primary,\n text: theme.colors.content.on.brand,\n border: undefined,\n };\n }\n return {\n bg:\n currentState === \"press\"\n ? theme.colors.background.brand.primary\n : currentState === \"hover\"\n ? theme.colors.overlay.brand\n : \"transparent\",\n text:\n currentState === \"press\"\n ? theme.colors.content.on.brand\n : theme.colors.content.brand.primary,\n border: undefined,\n };\n\n case \"primary\":\n if (effectiveBackground) {\n return {\n bg: theme.colors.background.primary,\n text: theme.colors.content.primary,\n border:\n currentState === \"press\"\n ? theme.colors.border.primary\n : undefined,\n };\n }\n return {\n bg:\n currentState === \"press\" \|\| currentState === \"hover\"\n ? theme.colors.overlay.mono\n : \"transparent\",\n text: theme.colors.content.primary,\n border:\n currentState === \"press\" ? theme.colors.border.primary : undefined,\n };\n\n case \"secondary\":\n if (effectiveBackground) {\n return {\n bg:\n currentState === \"press\"\n ? theme.colors.control.mono.secondary.bgPress\n : currentState === \"hover\"\n ? theme.colors.control.mono.secondary.bgHover\n : theme.colors.background.secondary,\n text: theme.colors.content.secondary,\n border: undefined,\n };\n }\n return {\n bg:\n currentState === \"press\" \|\| currentState === \"hover\"\n ? theme.colors.overlay.mono\n : \"transparent\",\n text:\n currentState === \"press\"\n ? theme.colors.content.primary\n : currentState === \"hover\"\n ? theme.colors.content.secondary\n : theme.colors.content.secondary,\n border: undefined,\n };\n\n case \"tertiary\":\n if (effectiveBackground) {\n return {\n bg:\n currentState === \"press\"\n ? theme.colors.control.mono.secondary.bgPress\n : currentState === \"hover\"\n ? theme.colors.control.mono.secondary.bgHover\n : theme.colors.background.secondary,\n text: theme.colors.content.tertiary,\n border: undefined,\n };\n }\n return {\n bg:\n currentState === \"press\" \|\| currentState === \"hover\"\n ? theme.colors.overlay.mono\n : \"transparent\",\n text:\n currentState === \"press\"\n ? theme.colors.content.secondary\n : currentState === \"hover\"\n ? theme.colors.content.tertiary\n : theme.colors.content.tertiary,\n border: undefined,\n };\n\n case \"brandExtra\":\n if (effectiveBackground) {\n return {\n bg:\n currentState === \"press\"\n ? theme.colors.control.brandExtra.primary.bgPress\n : currentState === \"hover\"\n ? theme.colors.control.brandExtra.primary.bgHover\n : theme.colors.background.brandExtra.primary,\n text: theme.colors.content.on.brandExtra,\n border: undefined,\n };\n }\n return {\n bg:\n currentState === \"press\"\n ? theme.colors.background.brandExtra.primary\n : currentState === \"hover\"\n ? theme.colors.overlay.brandExtra\n : \"transparent\",\n text:\n currentState === \"press\"\n ? theme.colors.content.on.brandExtra\n : theme.colors.content.brandExtra.secondary,\n border: undefined,\n };\n\n case \"inverse\":\n if (effectiveBackground) {\n return {\n bg:\n currentState === \"press\"\n ? theme.colors.control.mono.primary.bgPress\n : currentState === \"hover\"\n ? theme.colors.control.mono.primary.bgHover\n : theme.colors.background.inverse,\n text: theme.colors.content.inverse,\n border: undefined,\n };\n }\n return {\n bg:\n currentState === \"press\" \|\| currentState === \"hover\"\n ? theme.colors.overlay.mono\n : \"transparent\",\n text: theme.colors.content.inverse,\n border: undefined,\n };\n\n default:\n return {\n bg: \"transparent\",\n text: theme.colors.content.primary,\n border: undefined,\n };\n }\n };\n\n const getFocusRingColor = (): string => {\n switch (variant) {\n case \"brand\":\n return theme.colors.overlay.brand;\n case \"brandExtra\":\n return theme.colors.overlay.brandExtra;\n case \"inverse\":\n return \"rgba(255, 255, 255, 0.3)\";\n default:\n return theme.colors.overlay.mono;\n }\n };\n\n const getSpinnerColor = (): string => {\n switch (variant) {\n case \"brand\":\n return theme.colors.content.brand.primary;\n case \"primary\":\n return theme.colors.content.primary;\n case \"secondary\":\n return theme.colors.content.secondary;\n case \"tertiary\":\n return theme.colors.content.tertiary;\n case \"brandExtra\":\n return theme.colors.content.brandExtra.secondary;\n case \"inverse\":\n return theme.colors.content.inverse;\n default:\n return theme.colors.content.brand.primary;\n }\n };\n\n const colors = getVariantColors(state);\n const focusRingColor = getFocusRingColor();\n const spinnerColor = getSpinnerColor();\n const iconSize = ICON_SIZES[size];\n const spinnerSize = SPINNER_SIZES[size];\n const fontSize = FONT_SIZES[size];\n const borderRadius = BORDER_RADIUS[size];\n const lineHeight = LINE_HEIGHTS[size];\n\n const handleMouseEnter = () => {\n if (!isDisabled) {\n isMouseOverRef.current = true;\n setState(\"hover\");\n }\n };\n\n const handleMouseLeave = () => {\n if (!isDisabled) {\n isMouseOverRef.current = false;\n setState(\"default\");\n }\n };\n\n const handleMouseDown = () => {\n if (!isDisabled) {\n setState(\"press\");\n }\n };\n\n const handleMouseUp = () => {\n if (!isDisabled) {\n setState(isMouseOverRef.current ? \"hover\" : \"default\");\n }\n };\n\n const handleFocus = () => {\n if (!isDisabled) {\n setIsFocused(true);\n }\n };\n\n const handleBlur = () => {\n setIsFocused(false);\n };\n\n const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n if (isDisabled) return;\n if (onPress) {\n onPress();\n }\n if (onClick) {\n onClick(event);\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n if (isDisabled) return;\n if (event.key === \"Enter\" \|\| event.key === \" \") {\n event.preventDefault();\n setState(\"press\");\n }\n };\n\n const handleKeyUp = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n if (isDisabled) return;\n if (event.key === \"Enter\" \|\| event.key === \" \") {\n event.preventDefault();\n setState(isMouseOverRef.current ? \"hover\" : \"default\");\n if (onPress) {\n onPress();\n }\n }\n };\n\n const borderShadow = colors.border\n ? `inset 0 0 0 1px ${colors.border}`\n : undefined;\n const focusShadow =\n isFocused && !isDisabled ? `0 0 0 2px ${focusRingColor}` : undefined;\n\n const boxShadows: string[] = [];\n if (borderShadow) boxShadows.push(borderShadow);\n if (focusShadow) boxShadows.push(focusShadow);\n const combinedBoxShadow =\n boxShadows.length > 0 ? boxShadows.join(\", \") : \"none\";\n\n const buttonStyle: CSSProperties = {\n display: \"inline-flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n gap: \"2px\",\n padding: \"4px\",\n backgroundColor: loading ? \"transparent\" : colors.bg,\n color: colors.text,\n border: \"none\",\n borderWidth: \"0px\",\n borderRadius: `${borderRadius}px`,\n cursor: isDisabled ? \"not-allowed\" : \"pointer\",\n fontSize: `${fontSize}px`,\n fontWeight: 500,\n lineHeight: lineHeight,\n fontFamily: \"inherit\",\n transition:\n \"background-color 100ms ease-in-out, color 100ms ease-in-out, box-shadow 100ms ease-in-out\",\n outline: \"none\",\n boxShadow: combinedBoxShadow,\n opacity: isDisabled && !loading ? 0.6 : 1,\n };\n\n const contentStyle: CSSProperties = {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n gap: \"2px\",\n };\n\n const spinnerStyle: CSSProperties = {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n backgroundColor: \"transparent\",\n height: lineHeight,\n };\n\n const computedAriaLabel =\n ariaLabel \|\| (typeof children === \"string\" ? children : undefined);\n\n return (\n <button\n {...buttonProps}\n type={type}\n className={className}\n disabled={isDisabled}\n onClick={handleClick}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onMouseDown={handleMouseDown}\n onMouseUp={handleMouseUp}\n onKeyDown={handleKeyDown}\n onKeyUp={handleKeyUp}\n onFocus={handleFocus}\n onBlur={handleBlur}\n aria-label={computedAriaLabel}\n aria-busy={loading \|\| undefined}\n aria-disabled={isDisabled \|\| undefined}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n tabIndex={tabIndex}\n style={buttonStyle}\n data-testid={testID \|\| \"flex-button\"}\n >\n <span style={contentStyle}>\n {loading ? (\n <span style={spinnerStyle}>\n <Spinner size={spinnerSize} color={spinnerColor} />\n </span>\n ) : (\n <>\n {iconLeft && (\n <Icon size={iconSize} color={colors.text}>\n {iconLeft}\n </Icon>\n )}\n <span>{children}</span>\n {iconRight && (\n <Icon size={iconSize} color={colors.text}>\n {iconRight}\n </Icon>\n )}\n </>\n )}\n </span>\n </button>\n );\n};\n\nFlexButton.displayName = \"FlexButton\";\n","import React, { useState } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Spinner } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\n\ninterface AppButtonTokens {\n bg: string;\n bgHover: string;\n bgPress: string;\n border: string;\n borderHover: string;\n borderPress: string;\n text: string;\n textDisable: string;\n}\n\ninterface ButtonSizeStyles {\n height: number;\n padding: number;\n fontSize: number;\n sublabelFontSize: number;\n spinnerSize: number;\n iconSize: number;\n iconContainerSize: number;\n iconPadding: number;\n loadingPadding: number;\n borderRadius: number;\n labelIconSize: number;\n labelIconGap: number;\n}\n\nconst cloneIconWithDefaults = (\n icon: React.ReactNode,\n defaultSize: number,\n defaultColor: string\n): React.ReactNode => {\n if (!React.isValidElement(icon)) return icon;\n\n const iconElement = icon as React.ReactElement<any>;\n const existingProps = iconElement.props \|\| {};\n\n return React.cloneElement(iconElement, {\n ...existingProps,\n size: existingProps.size ?? defaultSize,\n color: existingProps.color ?? defaultColor,\n });\n};\n\nexport interface AppButtonProps extends ThemeOverrideProps {\n /* Size of the button /\n size?: \"xl\" \| \"lg\" \| \"md\" \| \"sm\" \| \"xs\";\n /* Whether the button is disabled /\n disabled?: boolean;\n /* Whether the button is in a loading state /\n loading?: boolean;\n /* Button content /\n children: React.ReactNode;\n /* Click handler /\n onPress?: () => void;\n /* Icon to display on the left side /\n iconLeft?: React.ReactNode;\n /* Icon to display on the right side /\n iconRight?: React.ReactNode;\n /* Secondary text displayed inline with the main label /\n sublabel?: string;\n /* Alignment of the label text /\n labelAlignment?: \"left\" \| \"center\";\n /* Small icon displayed directly next to the label text /\n labelIcon?: React.ReactNode;\n /* Custom content slot for badges, tags, or other elements /\n customContent?: React.ReactNode;\n /* Accessible label for screen readers /\n \"aria-label\"?: string;\n /* ID of element that describes this button /\n \"aria-describedby\"?: string;\n /* Indicates the button controls an expandable element /\n \"aria-expanded\"?: boolean;\n /* Indicates the type of popup triggered by the button /\n \"aria-haspopup\"?: boolean \| \"menu\" \| \"listbox\" \| \"tree\" \| \"grid\" \| \"dialog\";\n /* Indicates the button is pressed (for toggle buttons) /\n \"aria-pressed\"?: boolean \| \"mixed\";\n /* ID of the element this button controls /\n \"aria-controls\"?: string;\n /* Test ID for testing frameworks /\n testID?: string;\n /* HTML id attribute /\n id?: string;\n /* HTML type attribute for the button /\n type?: \"button\" \| \"submit\" \| \"reset\";\n /* Whether the button should stretch to fill the full width of its container /\n fullWidth?: boolean;\n}\n\n/\n AppButton - A prominent filled button for app-level actions.\n \n Uses the `control.appButton` theme tokens for styling.\n * Supports all the same layout features as Button (icons, sublabels, etc.).\n /\nexport const AppButton: React.FC<AppButtonProps> = ({\n size = \"md\",\n disabled = false,\n loading = false,\n children,\n onPress,\n iconLeft,\n iconRight,\n sublabel,\n labelAlignment = \"center\",\n labelIcon,\n customContent,\n \"aria-label\": ariaLabel,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n testID,\n id,\n type = \"button\",\n fullWidth = false,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const [isKeyboardPressed, setIsKeyboardPressed] = useState(false);\n\n const isDisabled = disabled \|\| loading;\n\n const sizeStyles = theme.sizing.button(size) as ButtonSizeStyles;\n\n const tokens: AppButtonTokens = (theme?.colors?.control as any)\n ?.appButton \|\| {\n bg: \"#34474b\",\n bgHover: \"#3d5256\",\n bgPress: \"#2b3b3e\",\n border: \"rgba(255, 255, 255, 0.12)\",\n borderHover: \"rgba(255, 255, 255, 0.18)\",\n borderPress: \"rgba(255, 255, 255, 0.12)\",\n text: \"#b7c5c8\",\n textDisable: \"#b3b3b3\",\n };\n\n const handlePress = () => {\n if (!isDisabled && onPress) {\n onPress();\n }\n };\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (isDisabled) return;\n if (e.key === \"Enter\" \|\| e.key === \" \") {\n e.preventDefault();\n setIsKeyboardPressed(true);\n }\n };\n\n const handleKeyUp = (e: React.KeyboardEvent) => {\n if (isDisabled) return;\n if (e.key === \"Enter\" \|\| e.key === \" \") {\n e.preventDefault();\n setIsKeyboardPressed(false);\n if (onPress) {\n onPress();\n }\n }\n };\n\n let backgroundColor = tokens.bg;\n if (disabled) {\n backgroundColor = tokens.bg;\n } else if (isKeyboardPressed) {\n backgroundColor = tokens.bgPress;\n }\n\n const borderColor = tokens.border;\n const textColor = disabled ? tokens.textDisable : tokens.text;\n\n return (\n <Box\n as=\"button\"\n type={type}\n id={id}\n onPress={handlePress}\n onKeyDown={handleKeyDown}\n onKeyUp={handleKeyUp}\n disabled={isDisabled}\n aria-label={ariaLabel}\n aria-disabled={isDisabled \|\| undefined}\n aria-busy={loading \|\| undefined}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n testID={testID}\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={\n borderColor !== \"transparent\" &&\n borderColor !== \"rgba(255, 255, 255, 0)\" &&\n borderColor !== \"rgba(0, 0, 0, 0)\" &&\n !borderColor.endsWith(\", 0)\")\n ? 1\n : 0\n }\n borderRadius={sizeStyles.borderRadius}\n height={sizeStyles.height}\n width={fullWidth ? \"100%\" : undefined}\n padding={0}\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"center\"\n position=\"relative\"\n cursor={disabled ? \"not-allowed\" : loading ? \"wait\" : \"pointer\"}\n opacity={disabled ? 0.6 : 1}\n hoverStyle={\n !isDisabled\n ? {\n backgroundColor: tokens.bgHover,\n borderColor: tokens.borderHover,\n }\n : undefined\n }\n pressStyle={\n !isDisabled\n ? {\n backgroundColor: tokens.bgPress,\n borderColor: tokens.borderPress,\n }\n : undefined\n }\n focusStyle={{\n outlineColor: theme.colors.border.brand,\n outlineWidth: 2,\n outlineOffset: 2,\n outlineStyle: \"solid\",\n }}\n >\n {loading && (\n <Box\n position=\"absolute\"\n top={0}\n left={0}\n right={0}\n bottom={0}\n alignItems=\"center\"\n justifyContent=\"center\"\n zIndex={1}\n >\n <Spinner\n color={textColor}\n size={sizeStyles.spinnerSize}\n aria-hidden={true}\n />\n </Box>\n )}\n\n {iconLeft && (\n <Box\n width={sizeStyles.iconContainerSize}\n height={sizeStyles.iconContainerSize}\n alignItems=\"center\"\n justifyContent=\"center\"\n aria-hidden={true}\n style={{\n opacity: loading ? 0 : 1,\n pointerEvents: loading ? \"none\" : \"auto\",\n }}\n >\n {cloneIconWithDefaults(iconLeft, sizeStyles.iconSize, textColor)}\n </Box>\n )}\n\n <Box\n flex={fullWidth ? 1 : undefined}\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent={labelAlignment === \"left\" ? \"flex-start\" : \"center\"}\n paddingHorizontal={sizeStyles.padding}\n height=\"100%\"\n gap={sizeStyles.labelIconGap}\n style={{\n opacity: loading ? 0 : 1,\n pointerEvents: loading ? \"none\" : \"auto\",\n }}\n aria-hidden={loading ? true : undefined}\n >\n {labelIcon && (\n <Box aria-hidden={true}>\n {cloneIconWithDefaults(\n labelIcon,\n sizeStyles.labelIconSize,\n textColor\n )}\n </Box>\n )}\n\n <Text color={textColor} fontSize={sizeStyles.fontSize} fontWeight=\"500\">\n {children}\n </Text>\n\n {sublabel && (\n <Text\n color={textColor}\n fontSize={sizeStyles.fontSize}\n fontWeight=\"500\"\n style={{ opacity: 0.4 }}\n >\n {sublabel}\n </Text>\n )}\n\n {customContent && <Box aria-hidden={true}>{customContent}</Box>}\n </Box>\n\n {iconRight && (\n <Box\n width={sizeStyles.iconContainerSize}\n height={sizeStyles.iconContainerSize}\n alignItems=\"center\"\n justifyContent=\"center\"\n aria-hidden={true}\n style={{\n opacity: loading ? 0 : 1,\n pointerEvents: loading ? \"none\" : \"auto\",\n }}\n >\n {cloneIconWithDefaults(iconRight, sizeStyles.iconSize, textColor)}\n </Box>\n )}\n </Box>\n );\n};\n\nAppButton.displayName = \"AppButton\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\n\nexport interface ButtonGroupProps extends ThemeOverrideProps {\n /\n Layout orientation of the buttons\n * @default 'horizontal'\n /\n orientation?: \"horizontal\" \| \"vertical\";\n /\n Size of the button group, determines default gap between buttons\n * @default 'md'\n /\n size?: \"xl\" \| \"lg\" \| \"md\" \| \"sm\" \| \"xs\";\n /\n Buttons to be grouped\n /\n children: React.ReactNode;\n /\n Optional description text below the buttons\n /\n description?: string;\n /\n Optional error message text below the buttons\n /\n error?: string;\n /\n Custom gap between buttons (in pixels). If not provided, uses size and orientation based default.\n /\n gap?: number;\n /\n Accessible label for the button group\n /\n \"aria-label\"?: string;\n /\n ID of element that labels this button group\n /\n \"aria-labelledby\"?: string;\n /\n ID of element that describes this button group\n /\n \"aria-describedby\"?: string;\n /\n HTML id attribute\n /\n id?: string;\n /\n Test ID for testing frameworks\n /\n testID?: string;\n}\n\n/\n ButtonGroup - A container for grouping related buttons\n \n Provides semantic grouping for related actions with proper accessibility support.\n \n ## Accessibility Features\n \n - Semantic Grouping: Uses `role=\"group\"` to indicate related buttons\n * - Accessible Name: Supports `aria-label` or `aria-labelledby` to describe the group's purpose\n * - Error Announcements: Errors are announced to screen readers via `aria-live`\n * - Description Support: Optional description text for additional context\n \n /\nexport const ButtonGroup: React.FC<ButtonGroupProps> = ({\n orientation = \"horizontal\",\n size = \"md\",\n children,\n description,\n error,\n gap,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n id,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n // Flatten children to handle fragments and get actual button elements\n const flattenChildren = (children: React.ReactNode): React.ReactNode[] => {\n const result: React.ReactNode[] = [];\n React.Children.forEach(children, (child) => {\n if (React.isValidElement(child) && child.type === React.Fragment) {\n result.push(...flattenChildren(child.props.children));\n } else if (child !== null && child !== undefined) {\n result.push(child);\n }\n });\n return result;\n };\n\n const flatChildren = flattenChildren(children);\n const childCount = flatChildren.length;\n\n // Check if we need space-between layout (horizontal with more than 2 buttons)\n const useSpaceBetween = orientation === \"horizontal\" && childCount > 2;\n\n // Size-based default gaps by orientation\n const verticalGapMap = {\n xl: 16,\n lg: 16,\n md: 12,\n sm: 8,\n xs: 4,\n };\n\n const horizontalGapMap = {\n xl: 16,\n lg: 16,\n md: 16,\n sm: 12,\n xs: 12,\n };\n\n // Use provided gap or fall back to orientation and size based default\n const computedGap =\n gap ??\n (orientation === \"vertical\"\n ? verticalGapMap[size]\n : horizontalGapMap[size]);\n\n // Generate IDs for description and error elements\n const descriptionId = id ? `${id}-description` : undefined;\n const errorId = id ? `${id}-error` : undefined;\n\n // Build aria-describedby value combining external and internal references\n const computedAriaDescribedBy =\n [\n ariaDescribedBy,\n error && errorId ? errorId : undefined,\n description && descriptionId ? descriptionId : undefined,\n ]\n .filter(Boolean)\n .join(\" \") \|\| undefined;\n\n // Per Figma: vertical buttons always stretch; horizontal 1-2 buttons fill\n // the full row width (a pair splits 50/50); 3 use space-between.\n const stretchChildren =\n orientation === \"vertical\" \|\|\n (orientation === \"horizontal\" && childCount <= 2);\n\n const processChildren = (childrenToProcess: React.ReactNode[]) => {\n if (stretchChildren) {\n return childrenToProcess.map((child, index) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n ...child.props,\n fullWidth: true,\n key: child.key ?? index,\n });\n }\n return child;\n });\n }\n return childrenToProcess;\n };\n\n // Split children for space-between layout\n const renderChildren = () => {\n const processedChildren = processChildren(flatChildren);\n\n if (useSpaceBetween) {\n const firstChild = processedChildren[0];\n const restChildren = processedChildren.slice(1);\n\n return (\n <>\n {firstChild}\n <Box flexDirection=\"row\" gap={computedGap}>\n {restChildren}\n </Box>\n </>\n );\n }\n\n // For non-space-between layout, processChildren is a no-op unless\n // the children should stretch\n return processedChildren;\n };\n\n return (\n <Box flexDirection=\"column\" width=\"100%\" gap={8}>\n <Box\n role=\"group\"\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-describedby={computedAriaDescribedBy}\n id={id}\n testID={testID}\n flexDirection={orientation === \"horizontal\" ? \"row\" : \"column\"}\n alignItems=\"stretch\"\n gap={computedGap}\n justifyContent={useSpaceBetween ? \"space-between\" : undefined}\n width=\"100%\"\n >\n {renderChildren()}\n </Box>\n\n {error && (\n <Box marginTop={4}>\n <Text\n id={errorId}\n role=\"alert\"\n aria-live=\"assertive\"\n color={theme.colors.content.alert.primary}\n fontSize={14}\n fontWeight=\"400\"\n style={\n orientation === \"vertical\" ? { textAlign: \"center\" } : undefined\n }\n >\n {error}\n </Text>\n </Box>\n )}\n\n {description && (\n <Box marginTop={4}>\n <Text\n id={descriptionId}\n color={theme.colors.content.tertiary}\n fontSize={14}\n fontWeight=\"400\"\n style={\n orientation === \"vertical\" ? { textAlign: \"center\" } : undefined\n }\n >\n {description}\n </Text>\n </Box>\n )}\n </Box>\n );\n};\n\nButtonGroup.displayName = \"ButtonGroup\";\n"],"mappings":"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","names":["import_react","import_react_native","import_jsx_runtime","RNText","import_react_native","import_jsx_runtime","import_react_native","import_jsx_runtime","React","import_jsx_runtime","React","import_react","import_xui_core","import_jsx_runtime","cloneIconWithDefaults","React","import_react","import_xui_core","import_jsx_runtime","import_react","import_xui_core","import_jsx_runtime","cloneIconWithDefaults","React","import_react","import_xui_core","import_jsx_runtime","children","React"]}
1	+ {"version":3,"sources":["../../src/index.tsx","../../src/Button.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx","../../../../foundation/primitives-native/src/Spinner.tsx","../../../../foundation/primitives-native/src/Icon.tsx","../../src/IconButton.tsx","../../src/FlexButton.tsx","../../src/AppButton.tsx","../../src/ButtonGroup.tsx"],"sourcesContent":["export * from \"./Button\";\nexport * from \"./IconButton\";\nexport * from \"./FlexButton\";\nexport * from \"./AppButton\";\nexport * from \"./ButtonGroup\";\n","import React, { useState } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Spinner } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\n\n// Local type definitions for button styling\ninterface ControlVariantStyles {\n bg: string;\n bgHover: string;\n bgPress: string;\n bgDisable?: string;\n border: string;\n borderHover: string;\n borderPress: string;\n borderDisable?: string;\n}\n\ninterface ControlTextStyles {\n primary: string;\n secondary: string;\n tertiary: string;\n ghost: string;\n disable: string;\n}\n\ninterface ButtonSizeStyles {\n height: number;\n padding: number;\n fontSize: number;\n lineHeight: number;\n sublabelFontSize: number;\n spinnerSize: number;\n iconSize: number;\n iconContainerSize: number;\n borderRadius: number;\n labelIconSize: number;\n labelIconGap: number;\n}\n\n/*\n Helper to clone an icon element with default props.\n * Only applies size/color if not already specified by the user.\n * This allows users to override the default size: <ArrowRight size={16} />\n /\nconst cloneIconWithDefaults = (\n icon: React.ReactNode,\n defaultSize: number,\n defaultColor: string\n): React.ReactNode => {\n if (!React.isValidElement(icon)) return icon;\n\n const iconElement = icon as React.ReactElement<any>;\n const existingProps = iconElement.props \|\| {};\n\n return React.cloneElement(iconElement, {\n ...existingProps, // Preserve existing props (including accessibility attributes)\n size: existingProps.size ?? defaultSize,\n color: existingProps.color ?? defaultColor,\n });\n};\n\nexport interface ButtonProps extends ThemeOverrideProps {\n /* Visual variant of the button /\n variant?: \"primary\" \| \"secondary\" \| \"tertiary\" \| \"ghost\";\n /* Color tone of the button /\n tone?: \"brand\" \| \"brandExtra\" \| \"alert\" \| \"mono\";\n /* Size of the button /\n size?: \"xl\" \| \"lg\" \| \"md\" \| \"sm\" \| \"xs\";\n /* Whether the button is disabled /\n disabled?: boolean;\n /* Whether the button is in a loading state /\n loading?: boolean;\n /* Button content /\n children: React.ReactNode;\n /* Click handler /\n onPress?: () => void;\n /\n Icon to display on the left side.\n * Size and color are automatically set based on button size/state.\n * To override, specify size/color on the icon: `iconLeft={<ArrowLeft size={16} />}`\n /\n iconLeft?: React.ReactNode;\n /\n Icon to display on the right side.\n * Size and color are automatically set based on button size/state.\n * To override, specify size/color on the icon: `iconRight={<ArrowRight size={16} />}`\n /\n iconRight?: React.ReactNode;\n /* Secondary text displayed inline with the main label (e.g., price), shown with 40% opacity /\n sublabel?: string;\n /* Alignment of the label text /\n labelAlignment?: \"left\" \| \"center\";\n /\n Small icon displayed directly to the left of the label text.\n * Size and color are automatically set based on button size/state.\n * To override, specify size/color on the icon: `labelIcon={<InfoIcon size={12} />}`\n /\n labelIcon?: React.ReactNode;\n /\n Small icon displayed directly to the right of the label text.\n * Size and color are automatically set based on button size/state.\n * To override, specify size/color on the icon: `labelIconRight={<InfoIcon size={12} />}`\n /\n labelIconRight?: React.ReactNode;\n /* Custom content slot for badges, tags, or other elements /\n customContent?: React.ReactNode;\n /* Accessible label for screen readers (use for icon-only buttons) /\n \"aria-label\"?: string;\n /* ID of element that describes this button /\n \"aria-describedby\"?: string;\n /* Indicates the button controls an expandable element /\n \"aria-expanded\"?: boolean;\n /* Indicates the type of popup triggered by the button /\n \"aria-haspopup\"?: boolean \| \"menu\" \| \"listbox\" \| \"tree\" \| \"grid\" \| \"dialog\";\n /* Indicates the button is pressed (for toggle buttons) /\n \"aria-pressed\"?: boolean \| \"mixed\";\n /* ID of the element this button controls /\n \"aria-controls\"?: string;\n /* Test ID for testing frameworks /\n testID?: string;\n /* HTML id attribute /\n id?: string;\n /* HTML type attribute for the button /\n type?: \"button\" \| \"submit\" \| \"reset\";\n /* Whether the button should stretch to fill the full width of its container /\n fullWidth?: boolean;\n}\n\n/\n Button - An accessible button component\n \n Renders as a semantic `<button>` element with full ARIA support.\n * Supports various visual variants, sizes, and states including loading.\n \n ## Accessibility Features\n \n - Semantic HTML: Renders as a native `<button>` element\n * - Keyboard Navigation: Focusable via Tab, activated with Enter or Space\n * - ARIA States: Properly announces disabled and loading states\n * - Focus Indicator: Visible focus ring for keyboard navigation\n * - Screen Reader Support: Announces button label, state, and any associated descriptions\n \n /\nexport const Button: React.FC<ButtonProps> = ({\n variant = \"primary\",\n tone = \"brand\",\n size = \"md\",\n disabled = false,\n loading = false,\n children,\n onPress,\n iconLeft,\n iconRight,\n sublabel,\n labelAlignment = \"center\",\n labelIcon,\n labelIconRight,\n customContent,\n \"aria-label\": ariaLabel,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n testID,\n id,\n type = \"button\",\n fullWidth = false,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const [isKeyboardPressed, setIsKeyboardPressed] = useState(false);\n\n const isDisabled = disabled \|\| loading;\n\n // Resolve Config from Theme - type assertion for extended sizing properties\n const sizeStyles = theme.sizing.button(size) as ButtonSizeStyles;\n\n // Type assertion for control variant styles - the JSON tokens include tertiary\n const controlTone = theme?.colors?.control?.[tone] as unknown as\n \| (Record<string, ControlVariantStyles> & { text: ControlTextStyles })\n \| undefined;\n\n const variantStyles: ControlVariantStyles = controlTone?.[variant] \|\|\n (\n theme?.colors?.control?.brand as unknown as Record<\n string,\n ControlVariantStyles\n >\n )?.primary \|\| {\n bg: \"transparent\",\n bgHover: \"transparent\",\n bgPress: \"transparent\",\n bgDisable: \"transparent\",\n border: \"transparent\",\n borderHover: \"transparent\",\n borderPress: \"transparent\",\n borderDisable: \"transparent\",\n };\n\n // Text colors are at the tone level, mapped by variant name\n const textStyles: ControlTextStyles = controlTone?.text \|\|\n (theme?.colors?.control?.brand as unknown as { text: ControlTextStyles })\n ?.text \|\| {\n primary: \"#000\",\n secondary: \"#fff\",\n tertiary: \"#888\",\n ghost: \"#000\",\n disable: \"#666\",\n };\n\n // Uses the aria-disabled pattern (not the native `disabled` attribute) so the\n // button stays focusable and can surface a tooltip explaining why it is\n // unavailable. Activation must therefore be blocked manually: preventDefault on\n // the triggering event stops form submission / default button behaviour.\n const handlePress = (e?: React.MouseEvent<HTMLButtonElement>) => {\n if (isDisabled) {\n e?.preventDefault();\n return;\n }\n if (onPress) {\n onPress();\n }\n };\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === \"Enter\" \|\| e.key === \" \") {\n // Block native activation while disabled, keeping the element focusable.\n if (isDisabled) {\n e.preventDefault();\n return;\n }\n e.preventDefault();\n setIsKeyboardPressed(true);\n }\n };\n\n const handleKeyUp = (e: React.KeyboardEvent) => {\n if (isDisabled) return;\n\n if (e.key === \"Enter\" \|\| e.key === \" \") {\n e.preventDefault();\n setIsKeyboardPressed(false);\n if (onPress) {\n onPress();\n }\n }\n };\n\n // Disabled state is identical across all variants and tones. Figma maps every\n // disabled button to the canonical brand tokens (control/brand/primary/bg-disable,\n // control/brand/primary/border-disable, control/brand/text/disable), so resolve\n // them from brand regardless of the active variant/tone.\n const brandControl = theme?.colors?.control?.brand as unknown as\n \| (Record<string, ControlVariantStyles> & { text: ControlTextStyles })\n \| undefined;\n const disabledBg =\n brandControl?.primary?.bgDisable ??\n variantStyles.bgDisable ??\n variantStyles.bg;\n const disabledBorder =\n brandControl?.primary?.borderDisable ??\n variantStyles.borderDisable ??\n variantStyles.border;\n const disabledText = brandControl?.text?.disable ?? textStyles.disable;\n\n // Determine background color based on state\n let backgroundColor = variantStyles.bg;\n if (disabled) {\n backgroundColor = disabledBg;\n } else if (isKeyboardPressed) {\n backgroundColor = variantStyles.bgPress \|\| variantStyles.bg;\n }\n\n // Border color tracks state alongside the background. Hover/press are applied\n // via hoverStyle/pressStyle below; the keyboard-activated press is resolved here.\n let borderColor = variantStyles.border;\n if (disabled) {\n borderColor = disabledBorder;\n } else if (isKeyboardPressed) {\n borderColor = variantStyles.borderPress \|\| variantStyles.border;\n }\n\n // Text/icon color shares the single disabled color when disabled\n const textColor = disabled ? disabledText : textStyles[variant];\n\n // Only use aria-label when explicitly provided\n // Text content provides accessible name naturally for buttons with visible text\n const computedAriaLabel = ariaLabel;\n\n return (\n <Box\n as=\"button\"\n type={type}\n id={id}\n onPress={handlePress}\n onKeyDown={handleKeyDown}\n onKeyUp={handleKeyUp}\n aria-label={computedAriaLabel}\n aria-disabled={isDisabled \|\| undefined}\n aria-busy={loading \|\| undefined}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n testID={testID}\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={\n borderColor !== \"transparent\" &&\n borderColor !== \"rgba(255, 255, 255, 0)\"\n ? 1\n : 0\n }\n borderRadius={sizeStyles.borderRadius}\n height={sizeStyles.height}\n width={fullWidth ? \"100%\" : undefined}\n padding={0}\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"center\"\n position=\"relative\"\n cursor={disabled ? \"not-allowed\" : loading ? \"wait\" : \"pointer\"}\n style={{\n transition: \"background-color 500ms ease, border-color 500ms ease\",\n opacity: 1,\n }}\n hoverStyle={\n !isDisabled\n ? {\n backgroundColor: variantStyles?.bgHover,\n borderColor: variantStyles?.borderHover,\n }\n : undefined\n }\n pressStyle={\n !isDisabled\n ? {\n backgroundColor: variantStyles?.bgPress,\n borderColor: variantStyles?.borderPress,\n }\n : undefined\n }\n focusStyle={{\n outlineColor: theme.colors.border.brand,\n outlineWidth: 2,\n outlineOffset: 2,\n outlineStyle: \"solid\",\n }}\n >\n {/* Loading Spinner - Absolutely positioned in center /}\n {loading && (\n <Box\n position=\"absolute\"\n top={0}\n left={0}\n right={0}\n bottom={0}\n alignItems=\"center\"\n justifyContent=\"center\"\n zIndex={1}\n >\n <Spinner\n color={textColor}\n size={sizeStyles.spinnerSize}\n aria-hidden={true}\n />\n </Box>\n )}\n\n {/ Left Icon Section - Square container matching button height /}\n {iconLeft && (\n <Box\n width={sizeStyles.iconContainerSize}\n height={sizeStyles.iconContainerSize}\n alignItems=\"center\"\n justifyContent=\"center\"\n aria-hidden={true}\n style={{\n opacity: loading ? 0 : 1,\n pointerEvents: loading ? \"none\" : \"auto\",\n }}\n >\n {cloneIconWithDefaults(iconLeft, sizeStyles.iconSize, textColor)}\n </Box>\n )}\n\n {/ Center Section: Content Area /}\n <Box\n flex={fullWidth ? 1 : undefined}\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent={labelAlignment === \"left\" ? \"flex-start\" : \"center\"}\n paddingHorizontal={sizeStyles.padding}\n height=\"100%\"\n gap={sizeStyles.labelIconGap}\n style={{\n opacity: loading ? 0 : 1,\n pointerEvents: loading ? \"none\" : \"auto\",\n }}\n aria-hidden={loading ? true : undefined}\n >\n {/ Label Icon (left of text) /}\n {labelIcon && (\n <Box aria-hidden={true}>\n {cloneIconWithDefaults(\n labelIcon,\n sizeStyles.labelIconSize,\n textColor\n )}\n </Box>\n )}\n\n {/ Label /}\n <Text\n color={textColor}\n fontSize={sizeStyles.fontSize}\n lineHeight={sizeStyles.lineHeight}\n fontWeight=\"500\"\n >\n {children}\n </Text>\n\n {/ Label Icon (right of text) /}\n {labelIconRight && (\n <Box aria-hidden={true}>\n {cloneIconWithDefaults(\n labelIconRight,\n sizeStyles.labelIconSize,\n textColor\n )}\n </Box>\n )}\n\n {/ Sublabel - inline with label, 40% opacity as per Figma /}\n {sublabel && (\n <Text\n color={textColor}\n fontSize={sizeStyles.sublabelFontSize}\n lineHeight={sizeStyles.lineHeight}\n fontWeight=\"500\"\n style={{ opacity: 0.4 }}\n >\n {sublabel}\n </Text>\n )}\n\n {/ Custom Content Slot /}\n {customContent && <Box aria-hidden={true}>{customContent}</Box>}\n </Box>\n\n {/ Right Icon Section - Square container matching button height /}\n {iconRight && (\n <Box\n width={sizeStyles.iconContainerSize}\n height={sizeStyles.iconContainerSize}\n alignItems=\"center\"\n justifyContent=\"center\"\n aria-hidden={true}\n style={{\n opacity: loading ? 0 : 1,\n pointerEvents: loading ? \"none\" : \"auto\",\n }}\n >\n {cloneIconWithDefaults(iconRight, sizeStyles.iconSize, textColor)}\n </Box>\n )}\n </Box>\n );\n};\n\nButton.displayName = \"Button\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n flexDirection,\n alignItems,\n justifyContent,\n position,\n top,\n bottom,\n left,\n right,\n width,\n minWidth,\n minHeight,\n maxWidth,\n maxHeight,\n flex,\n overflow,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n minWidth: minWidth as DimensionValue,\n minHeight: minHeight as DimensionValue,\n maxWidth: maxWidth as DimensionValue,\n maxHeight: maxHeight as DimensionValue,\n padding: padding as DimensionValue,\n paddingHorizontal: paddingHorizontal as DimensionValue,\n paddingVertical: paddingVertical as DimensionValue,\n margin: margin as DimensionValue,\n marginTop: marginTop as DimensionValue,\n marginBottom: marginBottom as DimensionValue,\n marginLeft: marginLeft as DimensionValue,\n marginRight: marginRight as DimensionValue,\n flexDirection,\n alignItems,\n justifyContent,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId \|\| testID;\n\n // Destructure and drop web-only props from rest before passing to RN components\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": _ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": _ariaDisabled,\n \"aria-live\": _ariaLive,\n className,\n \"data-testid\": _dataTestId,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n if (onPress) {\n return (\n <Pressable\n onPress={onPress}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\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 testID,\n \"data-testid\": dataTestId,\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={dataTestId \|\| testID \|\| id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","import type React from \"react\";\nimport { ActivityIndicator, View } from \"react-native\";\nimport type { SpinnerProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Spinner: React.FC<SpinnerProps> = ({\n color,\n size,\n role,\n \"aria-label\": ariaLabel,\n \"aria-live\": ariaLive,\n testID,\n}) => {\n return (\n <View\n accessible={true}\n accessibilityRole={role === \"status\" ? \"none\" : undefined}\n accessibilityLabel={ariaLabel}\n accessibilityLiveRegion={\n ariaLive === \"polite\"\n ? \"polite\"\n : ariaLive === \"assertive\"\n ? \"assertive\"\n : \"none\"\n }\n testID={testID}\n >\n <ActivityIndicator\n color={color}\n size={typeof size === \"number\" ? size : \"small\"}\n />\n </View>\n );\n};\n\nSpinner.displayName = \"Spinner\";\n","import React from \"react\";\nimport { View, ViewStyle } from \"react-native\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Icon: React.FC<IconProps> = ({\n children,\n color,\n size,\n testID,\n \"data-testid\": dataTestId,\n}) => {\n const style: ViewStyle = {\n width: typeof size === \"number\" ? size : undefined,\n height: typeof size === \"number\" ? size : undefined,\n alignItems: \"center\",\n justifyContent: \"center\",\n };\n\n // On native, we try to pass the color down to children (like Text primitives)\n // to mimic the CSS inheritance behavior of the web version.\n const childrenWithProps = React.Children.map(children, (child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n color: child.props.color \|\| color,\n // Also pass size if child seems to be an icon that needs it\n size: child.props.size \|\| size,\n });\n }\n return child;\n });\n\n return (\n <View style={style} testID={dataTestId \|\| testID}>\n {childrenWithProps}\n </View>\n );\n};\n","import React, { useState } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Spinner } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\n\n// Local type definitions for button styling\ninterface ControlVariantStyles {\n bg: string;\n bgHover: string;\n bgPress: string;\n bgDisable?: string;\n border: string;\n borderHover: string;\n borderPress: string;\n borderDisable?: string;\n}\n\ninterface ControlTextStyles {\n primary: string;\n secondary: string;\n tertiary: string;\n disable: string;\n}\n\ninterface ButtonSizeStyles {\n height: number;\n padding: number;\n fontSize: number;\n spinnerSize: number;\n iconSize: number;\n iconContainerSize: number;\n borderRadius: number;\n}\n\n/\n Helper to clone an icon element with default props.\n * Only applies size/color if not already specified by the user, so consumers\n * can override the default size: `<ArrowRight size={16} />`.\n /\nconst cloneIconWithDefaults = (\n icon: React.ReactNode,\n defaultSize: number,\n defaultColor: string\n): React.ReactNode => {\n if (!React.isValidElement(icon)) return icon;\n\n const iconElement = icon as React.ReactElement<any>;\n const existingProps = iconElement.props \|\| {};\n\n return React.cloneElement(iconElement, {\n ...existingProps, // Preserve existing props (including accessibility attributes)\n size: existingProps.size ?? defaultSize,\n color: existingProps.color ?? defaultColor,\n });\n};\n\nexport interface IconButtonProps extends ThemeOverrideProps {\n /* Visual variant of the button /\n variant?: \"primary\" \| \"secondary\" \| \"tertiary\";\n /* Color tone of the button /\n tone?: \"brand\" \| \"brandExtra\" \| \"alert\" \| \"mono\";\n /* Size of the button /\n size?: \"xl\" \| \"lg\" \| \"md\" \| \"sm\" \| \"xs\";\n /* Whether the button is disabled /\n disabled?: boolean;\n /* Whether the button is in a loading state /\n loading?: boolean;\n /\n Icon to display in the button (required).\n * Size and color are automatically set based on button size/state.\n * To override, specify size/color on the icon: `icon={<CloseIcon size={16} />}`\n /\n icon: React.ReactNode;\n /\n Optional badge rendered absolutely at the top-right corner.\n * Pass a `<Badge>` element from `@xsolla/xui-badge`.\n /\n badge?: React.ReactNode;\n /* Click handler /\n onPress?: () => void;\n /\n Accessible label for screen readers (REQUIRED for icon-only buttons)\n * Since icon buttons have no visible text, this label is essential for accessibility.\n * @example aria-label=\"Close dialog\"\n * @example aria-label=\"Open settings menu\"\n /\n \"aria-label\": string;\n /* ID of element that describes this button /\n \"aria-describedby\"?: string;\n /* Indicates the button controls an expandable element /\n \"aria-expanded\"?: boolean;\n /* Indicates the type of popup triggered by the button /\n \"aria-haspopup\"?: boolean \| \"menu\" \| \"listbox\" \| \"tree\" \| \"grid\" \| \"dialog\";\n /* Indicates the button is pressed (for toggle buttons) /\n \"aria-pressed\"?: boolean \| \"mixed\";\n /* ID of the element this button controls /\n \"aria-controls\"?: string;\n /* Test ID for testing frameworks /\n testID?: string;\n /* HTML id attribute /\n id?: string;\n /* HTML type attribute for the button /\n type?: \"button\" \| \"submit\" \| \"reset\";\n /* Override the hover background color. Pass \"none\" to remove it entirely. /\n hoverBackground?: string \| \"none\";\n}\n\n/\n IconButton - An accessible icon-only button component\n \n Renders as a semantic `<button>` element with full ARIA support.\n * Supports various visual variants, sizes, and states including loading.\n \n ## Accessibility Features\n \n - Semantic HTML: Renders as a native `<button>` element\n * - Required aria-label: Ensures screen readers can announce the button's purpose\n * - Keyboard Navigation: Focusable via Tab, activated with Enter or Space\n * - ARIA States: Properly announces disabled and loading states\n * - Focus Indicator: Visible focus ring for keyboard navigation\n * - Screen Reader Support: Announces button label, state, and any associated descriptions\n \n ## Usage\n \n ```tsx\n * // Basic usage - aria-label is required\n * <IconButton icon={<CloseIcon />} aria-label=\"Close dialog\" onPress={handleClose} />\n \n // Toggle button\n * <IconButton\n * icon={<MenuIcon />}\n * aria-label=\"Toggle menu\"\n * aria-expanded={isOpen}\n * aria-controls=\"menu-id\"\n * onPress={toggleMenu}\n * />\n \n // Loading state\n * <IconButton icon={<SaveIcon />} aria-label=\"Save changes\" loading />\n * ```\n /\nexport const IconButton: React.FC<IconButtonProps> = ({\n variant = \"primary\",\n tone = \"brand\",\n size = \"md\",\n disabled = false,\n loading = false,\n icon,\n badge,\n onPress,\n \"aria-label\": ariaLabel,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n testID,\n id,\n type = \"button\",\n themeMode,\n themeProductContext,\n hoverBackground,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const [isKeyboardPressed, setIsKeyboardPressed] = useState(false);\n\n const isDisabled = disabled \|\| loading;\n\n // Type assertion for extended sizing properties\n const sizeStyles = theme.sizing.button(size) as ButtonSizeStyles;\n\n // Type assertion for control variant styles - the JSON tokens include tertiary\n const controlTone = theme?.colors?.control?.[tone] as unknown as\n \| (Record<string, ControlVariantStyles> & { text: ControlTextStyles })\n \| undefined;\n\n const variantStyles: ControlVariantStyles = controlTone?.[variant] \|\|\n (\n theme?.colors?.control?.brand as unknown as Record<\n string,\n ControlVariantStyles\n >\n )?.primary \|\| {\n bg: \"transparent\",\n bgHover: \"transparent\",\n bgPress: \"transparent\",\n bgDisable: \"transparent\",\n border: \"transparent\",\n borderHover: \"transparent\",\n borderPress: \"transparent\",\n borderDisable: \"transparent\",\n };\n\n // Text colors are at the tone level, mapped by variant name\n const textStyles: ControlTextStyles = controlTone?.text \|\|\n (theme?.colors?.control?.brand as unknown as { text: ControlTextStyles })\n ?.text \|\| {\n primary: \"#000\",\n secondary: \"#fff\",\n tertiary: \"#888\",\n disable: \"#666\",\n };\n\n const handlePress = () => {\n if (!isDisabled && onPress) {\n onPress();\n }\n };\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (isDisabled) return;\n\n if (e.key === \"Enter\" \|\| e.key === \" \") {\n e.preventDefault();\n setIsKeyboardPressed(true);\n }\n };\n\n const handleKeyUp = (e: React.KeyboardEvent) => {\n if (isDisabled) return;\n\n if (e.key === \"Enter\" \|\| e.key === \" \") {\n e.preventDefault();\n setIsKeyboardPressed(false);\n if (onPress) {\n onPress();\n }\n }\n };\n\n // Disabled state is identical across all variants AND tones per Figma —\n // always resolve from control.brand.primary, ignoring the active tone/variant.\n // bg/border tokens are typed optional, so fall back to transparent.\n const brandControl = theme.colors.control.brand as unknown as Record<\n string,\n ControlVariantStyles\n > & { text: ControlTextStyles };\n const disabledBg = brandControl.primary.bgDisable ?? \"transparent\";\n const disabledBorder = brandControl.primary.borderDisable ?? \"transparent\";\n const disabledText = brandControl.text.disable;\n\n let backgroundColor = variantStyles.bg;\n if (disabled) {\n backgroundColor = disabledBg;\n } else if (isKeyboardPressed) {\n backgroundColor = variantStyles.bgPress \|\| variantStyles.bg;\n }\n\n const borderColor = disabled ? disabledBorder : variantStyles.border;\n\n const textColor = disabled ? disabledText : textStyles[variant];\n\n return (\n <Box\n as=\"button\"\n type={type}\n id={id}\n onPress={handlePress}\n onKeyDown={handleKeyDown}\n onKeyUp={handleKeyUp}\n disabled={isDisabled}\n aria-label={ariaLabel}\n aria-disabled={isDisabled \|\| undefined}\n aria-busy={loading \|\| undefined}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n testID={testID}\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={\n borderColor !== \"transparent\" &&\n borderColor !== \"rgba(255, 255, 255, 0)\"\n ? 1\n : 0\n }\n borderRadius={sizeStyles.borderRadius}\n height={sizeStyles.height}\n width={sizeStyles.height}\n padding={0}\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"center\"\n position=\"relative\"\n cursor={disabled ? \"not-allowed\" : loading ? \"wait\" : \"pointer\"}\n style={{ opacity: 1 }}\n hoverStyle={\n !isDisabled\n ? {\n backgroundColor:\n hoverBackground === \"none\"\n ? \"transparent\"\n : (hoverBackground ?? variantStyles.bgHover),\n }\n : undefined\n }\n pressStyle={\n !isDisabled\n ? {\n backgroundColor: variantStyles.bgPress,\n }\n : undefined\n }\n focusStyle={{\n outlineColor: theme.colors.border.brand,\n outlineWidth: 2,\n outlineOffset: 2,\n outlineStyle: \"solid\",\n }}\n >\n {/ Loading Spinner - Absolutely positioned in center /}\n {loading && (\n <Box\n position=\"absolute\"\n top={0}\n left={0}\n right={0}\n bottom={0}\n alignItems=\"center\"\n justifyContent=\"center\"\n zIndex={1}\n >\n <Spinner\n color={textColor}\n size={sizeStyles.spinnerSize}\n aria-hidden={true}\n />\n </Box>\n )}\n\n {/ Icon - Hidden when loading but maintains layout /}\n <Box\n aria-hidden={true}\n style={{\n opacity: loading ? 0 : 1,\n pointerEvents: loading ? \"none\" : \"auto\",\n }}\n >\n {cloneIconWithDefaults(icon, sizeStyles.iconSize, textColor)}\n </Box>\n\n {badge && (\n <Box\n position=\"absolute\"\n top={0}\n right={0}\n zIndex={2}\n pointerEvents=\"none\"\n style={{ transform: \"translate(50%, -50%)\" }}\n >\n {badge}\n </Box>\n )}\n </Box>\n );\n};\n\nIconButton.displayName = \"IconButton\";\n","import React, {\n useRef,\n useState,\n type CSSProperties,\n type ReactNode,\n} from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Spinner, Icon } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\n\nexport interface FlexButtonProps\n extends\n Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, \"type\">,\n ThemeOverrideProps {\n /* Button content /\n children: ReactNode;\n /* Visual variant of the button /\n variant?:\n \| \"brand\"\n \| \"primary\"\n \| \"secondary\"\n \| \"tertiary\"\n \| \"brandExtra\"\n \| \"inverse\";\n /* Size of the button /\n size?: \"xl\" \| \"lg\" \| \"md\" \| \"sm\" \| \"xs\";\n /* Whether to show background fill /\n background?: boolean;\n /* Whether the button is disabled /\n disabled?: boolean;\n /* Whether the button is in a loading state /\n loading?: boolean;\n /* Icon to display on the left side /\n iconLeft?: ReactNode;\n /* Icon to display on the right side /\n iconRight?: ReactNode;\n /* Click handler /\n onPress?: () => void;\n /* HTML type attribute for the button /\n type?: \"button\" \| \"submit\" \| \"reset\";\n /* Accessible label for screen readers /\n \"aria-label\"?: string;\n /* ID of element that describes this button /\n \"aria-describedby\"?: string;\n /* Indicates the button controls an expandable element /\n \"aria-expanded\"?: boolean;\n /* Indicates the type of popup triggered by the button /\n \"aria-haspopup\"?: boolean \| \"menu\" \| \"listbox\" \| \"tree\" \| \"grid\" \| \"dialog\";\n /* Indicates the button is pressed (for toggle buttons) /\n \"aria-pressed\"?: boolean \| \"mixed\";\n /* ID of the element this button controls /\n \"aria-controls\"?: string;\n /* Test ID for testing frameworks /\n testID?: string;\n}\n\ntype ButtonState = \"default\" \| \"hover\" \| \"press\";\n\nconst ICON_SIZES: Record<NonNullable<FlexButtonProps[\"size\"]>, number> = {\n xs: 12,\n sm: 14,\n md: 16,\n lg: 18,\n xl: 20,\n};\n\nconst SPINNER_SIZES: Record<NonNullable<FlexButtonProps[\"size\"]>, number> = {\n xs: 12,\n sm: 14,\n md: 16,\n lg: 18,\n xl: 20,\n};\n\nconst LINE_HEIGHTS: Record<NonNullable<FlexButtonProps[\"size\"]>, string> = {\n xs: \"14px\",\n sm: \"16px\",\n md: \"18px\",\n lg: \"20px\",\n xl: \"22px\",\n};\n\nconst FONT_SIZES: Record<NonNullable<FlexButtonProps[\"size\"]>, number> = {\n xs: 12,\n sm: 14,\n md: 14,\n lg: 16,\n xl: 18,\n};\n\nconst BORDER_RADIUS: Record<NonNullable<FlexButtonProps[\"size\"]>, number> = {\n xl: 4,\n lg: 4,\n md: 2,\n sm: 2,\n xs: 2,\n};\n\n/\n FlexButton - A compact button component designed for use in modals and popups.\n \n Renders as a semantic `<button>` element with full ARIA support.\n \n ## Accessibility Features\n \n - Semantic HTML: Renders as a native `<button>` element\n * - Keyboard Navigation: Focusable via Tab, activated with Enter or Space\n * - ARIA States: Properly announces disabled and loading states\n * - Focus Indicator: Visible focus ring for keyboard navigation\n * - Screen Reader Support: Announces button label, state, and any associated descriptions\n /\nexport const FlexButton: React.FC<FlexButtonProps> = ({\n children,\n variant = \"brand\",\n size = \"md\",\n background = false,\n disabled = false,\n loading = false,\n iconLeft,\n iconRight,\n onPress,\n onClick,\n className,\n type = \"button\",\n \"aria-label\": ariaLabel,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n testID,\n tabIndex = 0,\n themeMode,\n themeProductContext,\n ...buttonProps\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const [state, setState] = useState<ButtonState>(\"default\");\n const [isFocused, setIsFocused] = useState(false);\n const isMouseOverRef = useRef(false);\n\n const isDisabled = disabled \|\| loading;\n\n const getVariantColors = (\n currentState: ButtonState\n ): { bg: string; text: string; border?: string } => {\n if (isDisabled) {\n return {\n bg: background ? theme.colors.overlay.mono : \"transparent\",\n text: theme.colors.control.text.disable,\n border: undefined,\n };\n }\n\n const effectiveBackground = loading ? false : background;\n\n switch (variant) {\n case \"brand\":\n if (effectiveBackground) {\n return {\n bg:\n currentState === \"press\"\n ? theme.colors.control.brand.primary.bgPress\n : currentState === \"hover\"\n ? theme.colors.control.brand.primary.bgHover\n : theme.colors.background.brand.primary,\n text: theme.colors.content.on.brand,\n border: undefined,\n };\n }\n return {\n bg:\n currentState === \"press\"\n ? theme.colors.background.brand.primary\n : currentState === \"hover\"\n ? theme.colors.overlay.brand\n : \"transparent\",\n text:\n currentState === \"press\"\n ? theme.colors.content.on.brand\n : theme.colors.content.brand.primary,\n border: undefined,\n };\n\n case \"primary\":\n if (effectiveBackground) {\n return {\n bg: theme.colors.background.primary,\n text: theme.colors.content.primary,\n border:\n currentState === \"press\"\n ? theme.colors.border.primary\n : undefined,\n };\n }\n return {\n bg:\n currentState === \"press\" \|\| currentState === \"hover\"\n ? theme.colors.overlay.mono\n : \"transparent\",\n text: theme.colors.content.primary,\n border:\n currentState === \"press\" ? theme.colors.border.primary : undefined,\n };\n\n case \"secondary\":\n if (effectiveBackground) {\n return {\n bg:\n currentState === \"press\"\n ? theme.colors.control.mono.secondary.bgPress\n : currentState === \"hover\"\n ? theme.colors.control.mono.secondary.bgHover\n : theme.colors.background.secondary,\n text: theme.colors.content.secondary,\n border: undefined,\n };\n }\n return {\n bg:\n currentState === \"press\" \|\| currentState === \"hover\"\n ? theme.colors.overlay.mono\n : \"transparent\",\n text:\n currentState === \"press\"\n ? theme.colors.content.primary\n : currentState === \"hover\"\n ? theme.colors.content.secondary\n : theme.colors.content.secondary,\n border: undefined,\n };\n\n case \"tertiary\":\n if (effectiveBackground) {\n return {\n bg:\n currentState === \"press\"\n ? theme.colors.control.mono.secondary.bgPress\n : currentState === \"hover\"\n ? theme.colors.control.mono.secondary.bgHover\n : theme.colors.background.secondary,\n text: theme.colors.content.tertiary,\n border: undefined,\n };\n }\n return {\n bg:\n currentState === \"press\" \|\| currentState === \"hover\"\n ? theme.colors.overlay.mono\n : \"transparent\",\n text:\n currentState === \"press\"\n ? theme.colors.content.secondary\n : currentState === \"hover\"\n ? theme.colors.content.tertiary\n : theme.colors.content.tertiary,\n border: undefined,\n };\n\n case \"brandExtra\":\n if (effectiveBackground) {\n return {\n bg:\n currentState === \"press\"\n ? theme.colors.control.brandExtra.primary.bgPress\n : currentState === \"hover\"\n ? theme.colors.control.brandExtra.primary.bgHover\n : theme.colors.background.brandExtra.primary,\n text: theme.colors.content.on.brandExtra,\n border: undefined,\n };\n }\n return {\n bg:\n currentState === \"press\"\n ? theme.colors.background.brandExtra.primary\n : currentState === \"hover\"\n ? theme.colors.overlay.brandExtra\n : \"transparent\",\n text:\n currentState === \"press\"\n ? theme.colors.content.on.brandExtra\n : theme.colors.content.brandExtra.secondary,\n border: undefined,\n };\n\n case \"inverse\":\n if (effectiveBackground) {\n return {\n bg:\n currentState === \"press\"\n ? theme.colors.control.mono.primary.bgPress\n : currentState === \"hover\"\n ? theme.colors.control.mono.primary.bgHover\n : theme.colors.background.inverse,\n text: theme.colors.content.inverse,\n border: undefined,\n };\n }\n return {\n bg:\n currentState === \"press\" \|\| currentState === \"hover\"\n ? theme.colors.overlay.mono\n : \"transparent\",\n text: theme.colors.content.inverse,\n border: undefined,\n };\n\n default:\n return {\n bg: \"transparent\",\n text: theme.colors.content.primary,\n border: undefined,\n };\n }\n };\n\n const getFocusRingColor = (): string => {\n switch (variant) {\n case \"brand\":\n return theme.colors.overlay.brand;\n case \"brandExtra\":\n return theme.colors.overlay.brandExtra;\n case \"inverse\":\n return \"rgba(255, 255, 255, 0.3)\";\n default:\n return theme.colors.overlay.mono;\n }\n };\n\n const getSpinnerColor = (): string => {\n switch (variant) {\n case \"brand\":\n return theme.colors.content.brand.primary;\n case \"primary\":\n return theme.colors.content.primary;\n case \"secondary\":\n return theme.colors.content.secondary;\n case \"tertiary\":\n return theme.colors.content.tertiary;\n case \"brandExtra\":\n return theme.colors.content.brandExtra.secondary;\n case \"inverse\":\n return theme.colors.content.inverse;\n default:\n return theme.colors.content.brand.primary;\n }\n };\n\n const colors = getVariantColors(state);\n const focusRingColor = getFocusRingColor();\n const spinnerColor = getSpinnerColor();\n const iconSize = ICON_SIZES[size];\n const spinnerSize = SPINNER_SIZES[size];\n const fontSize = FONT_SIZES[size];\n const borderRadius = BORDER_RADIUS[size];\n const lineHeight = LINE_HEIGHTS[size];\n\n const handleMouseEnter = () => {\n if (!isDisabled) {\n isMouseOverRef.current = true;\n setState(\"hover\");\n }\n };\n\n const handleMouseLeave = () => {\n if (!isDisabled) {\n isMouseOverRef.current = false;\n setState(\"default\");\n }\n };\n\n const handleMouseDown = () => {\n if (!isDisabled) {\n setState(\"press\");\n }\n };\n\n const handleMouseUp = () => {\n if (!isDisabled) {\n setState(isMouseOverRef.current ? \"hover\" : \"default\");\n }\n };\n\n const handleFocus = () => {\n if (!isDisabled) {\n setIsFocused(true);\n }\n };\n\n const handleBlur = () => {\n setIsFocused(false);\n };\n\n const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n if (isDisabled) return;\n if (onPress) {\n onPress();\n }\n if (onClick) {\n onClick(event);\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n if (isDisabled) return;\n if (event.key === \"Enter\" \|\| event.key === \" \") {\n event.preventDefault();\n setState(\"press\");\n }\n };\n\n const handleKeyUp = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n if (isDisabled) return;\n if (event.key === \"Enter\" \|\| event.key === \" \") {\n event.preventDefault();\n setState(isMouseOverRef.current ? \"hover\" : \"default\");\n if (onPress) {\n onPress();\n }\n }\n };\n\n const borderShadow = colors.border\n ? `inset 0 0 0 1px ${colors.border}`\n : undefined;\n const focusShadow =\n isFocused && !isDisabled ? `0 0 0 2px ${focusRingColor}` : undefined;\n\n const boxShadows: string[] = [];\n if (borderShadow) boxShadows.push(borderShadow);\n if (focusShadow) boxShadows.push(focusShadow);\n const combinedBoxShadow =\n boxShadows.length > 0 ? boxShadows.join(\", \") : \"none\";\n\n const buttonStyle: CSSProperties = {\n display: \"inline-flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n gap: \"2px\",\n padding: \"4px\",\n backgroundColor: loading ? \"transparent\" : colors.bg,\n color: colors.text,\n border: \"none\",\n borderWidth: \"0px\",\n borderRadius: `${borderRadius}px`,\n cursor: isDisabled ? \"not-allowed\" : \"pointer\",\n fontSize: `${fontSize}px`,\n fontWeight: 500,\n lineHeight: lineHeight,\n fontFamily: \"inherit\",\n transition:\n \"background-color 100ms ease-in-out, color 100ms ease-in-out, box-shadow 100ms ease-in-out\",\n outline: \"none\",\n boxShadow: combinedBoxShadow,\n opacity: isDisabled && !loading ? 0.6 : 1,\n };\n\n const contentStyle: CSSProperties = {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n gap: \"2px\",\n };\n\n const spinnerStyle: CSSProperties = {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n backgroundColor: \"transparent\",\n height: lineHeight,\n };\n\n const computedAriaLabel =\n ariaLabel \|\| (typeof children === \"string\" ? children : undefined);\n\n return (\n <button\n {...buttonProps}\n type={type}\n className={className}\n disabled={isDisabled}\n onClick={handleClick}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onMouseDown={handleMouseDown}\n onMouseUp={handleMouseUp}\n onKeyDown={handleKeyDown}\n onKeyUp={handleKeyUp}\n onFocus={handleFocus}\n onBlur={handleBlur}\n aria-label={computedAriaLabel}\n aria-busy={loading \|\| undefined}\n aria-disabled={isDisabled \|\| undefined}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n tabIndex={tabIndex}\n style={buttonStyle}\n data-testid={testID \|\| \"flex-button\"}\n >\n <span style={contentStyle}>\n {loading ? (\n <span style={spinnerStyle}>\n <Spinner size={spinnerSize} color={spinnerColor} />\n </span>\n ) : (\n <>\n {iconLeft && (\n <Icon size={iconSize} color={colors.text}>\n {iconLeft}\n </Icon>\n )}\n <span>{children}</span>\n {iconRight && (\n <Icon size={iconSize} color={colors.text}>\n {iconRight}\n </Icon>\n )}\n </>\n )}\n </span>\n </button>\n );\n};\n\nFlexButton.displayName = \"FlexButton\";\n","import React, { useState } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Spinner } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\n\ninterface AppButtonTokens {\n bg: string;\n bgHover: string;\n bgPress: string;\n border: string;\n borderHover: string;\n borderPress: string;\n text: string;\n textDisable: string;\n}\n\ninterface ButtonSizeStyles {\n height: number;\n padding: number;\n fontSize: number;\n sublabelFontSize: number;\n spinnerSize: number;\n iconSize: number;\n iconContainerSize: number;\n borderRadius: number;\n labelIconSize: number;\n labelIconGap: number;\n}\n\nconst cloneIconWithDefaults = (\n icon: React.ReactNode,\n defaultSize: number,\n defaultColor: string\n): React.ReactNode => {\n if (!React.isValidElement(icon)) return icon;\n\n const iconElement = icon as React.ReactElement<any>;\n const existingProps = iconElement.props \|\| {};\n\n return React.cloneElement(iconElement, {\n ...existingProps,\n size: existingProps.size ?? defaultSize,\n color: existingProps.color ?? defaultColor,\n });\n};\n\nexport interface AppButtonProps extends ThemeOverrideProps {\n /* Size of the button /\n size?: \"xl\" \| \"lg\" \| \"md\" \| \"sm\" \| \"xs\";\n /* Whether the button is disabled /\n disabled?: boolean;\n /* Whether the button is in a loading state /\n loading?: boolean;\n /* Button content /\n children: React.ReactNode;\n /* Click handler /\n onPress?: () => void;\n /* Icon to display on the left side /\n iconLeft?: React.ReactNode;\n /* Icon to display on the right side /\n iconRight?: React.ReactNode;\n /* Secondary text displayed inline with the main label /\n sublabel?: string;\n /* Alignment of the label text /\n labelAlignment?: \"left\" \| \"center\";\n /* Small icon displayed directly next to the label text /\n labelIcon?: React.ReactNode;\n /* Custom content slot for badges, tags, or other elements /\n customContent?: React.ReactNode;\n /* Accessible label for screen readers /\n \"aria-label\"?: string;\n /* ID of element that describes this button /\n \"aria-describedby\"?: string;\n /* Indicates the button controls an expandable element /\n \"aria-expanded\"?: boolean;\n /* Indicates the type of popup triggered by the button /\n \"aria-haspopup\"?: boolean \| \"menu\" \| \"listbox\" \| \"tree\" \| \"grid\" \| \"dialog\";\n /* Indicates the button is pressed (for toggle buttons) /\n \"aria-pressed\"?: boolean \| \"mixed\";\n /* ID of the element this button controls /\n \"aria-controls\"?: string;\n /* Test ID for testing frameworks /\n testID?: string;\n /* HTML id attribute /\n id?: string;\n /* HTML type attribute for the button /\n type?: \"button\" \| \"submit\" \| \"reset\";\n /* Whether the button should stretch to fill the full width of its container /\n fullWidth?: boolean;\n}\n\n/\n AppButton - A prominent filled button for app-level actions.\n \n Uses the `control.appButton` theme tokens for styling.\n * Supports all the same layout features as Button (icons, sublabels, etc.).\n /\nexport const AppButton: React.FC<AppButtonProps> = ({\n size = \"md\",\n disabled = false,\n loading = false,\n children,\n onPress,\n iconLeft,\n iconRight,\n sublabel,\n labelAlignment = \"center\",\n labelIcon,\n customContent,\n \"aria-label\": ariaLabel,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n testID,\n id,\n type = \"button\",\n fullWidth = false,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const [isKeyboardPressed, setIsKeyboardPressed] = useState(false);\n\n const isDisabled = disabled \|\| loading;\n\n const sizeStyles = theme.sizing.button(size) as ButtonSizeStyles;\n\n const tokens: AppButtonTokens = (theme?.colors?.control as any)\n ?.appButton \|\| {\n bg: \"#34474b\",\n bgHover: \"#3d5256\",\n bgPress: \"#2b3b3e\",\n border: \"rgba(255, 255, 255, 0.12)\",\n borderHover: \"rgba(255, 255, 255, 0.18)\",\n borderPress: \"rgba(255, 255, 255, 0.12)\",\n text: \"#b7c5c8\",\n textDisable: \"#b3b3b3\",\n };\n\n const handlePress = () => {\n if (!isDisabled && onPress) {\n onPress();\n }\n };\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (isDisabled) return;\n if (e.key === \"Enter\" \|\| e.key === \" \") {\n e.preventDefault();\n setIsKeyboardPressed(true);\n }\n };\n\n const handleKeyUp = (e: React.KeyboardEvent) => {\n if (isDisabled) return;\n if (e.key === \"Enter\" \|\| e.key === \" \") {\n e.preventDefault();\n setIsKeyboardPressed(false);\n if (onPress) {\n onPress();\n }\n }\n };\n\n let backgroundColor = tokens.bg;\n if (disabled) {\n backgroundColor = tokens.bg;\n } else if (isKeyboardPressed) {\n backgroundColor = tokens.bgPress;\n }\n\n const borderColor = tokens.border;\n const textColor = disabled ? tokens.textDisable : tokens.text;\n\n return (\n <Box\n as=\"button\"\n type={type}\n id={id}\n onPress={handlePress}\n onKeyDown={handleKeyDown}\n onKeyUp={handleKeyUp}\n disabled={isDisabled}\n aria-label={ariaLabel}\n aria-disabled={isDisabled \|\| undefined}\n aria-busy={loading \|\| undefined}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n testID={testID}\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={\n borderColor !== \"transparent\" &&\n borderColor !== \"rgba(255, 255, 255, 0)\" &&\n borderColor !== \"rgba(0, 0, 0, 0)\" &&\n !borderColor.endsWith(\", 0)\")\n ? 1\n : 0\n }\n borderRadius={sizeStyles.borderRadius}\n height={sizeStyles.height}\n width={fullWidth ? \"100%\" : undefined}\n padding={0}\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"center\"\n position=\"relative\"\n cursor={disabled ? \"not-allowed\" : loading ? \"wait\" : \"pointer\"}\n opacity={disabled ? 0.6 : 1}\n hoverStyle={\n !isDisabled\n ? {\n backgroundColor: tokens.bgHover,\n borderColor: tokens.borderHover,\n }\n : undefined\n }\n pressStyle={\n !isDisabled\n ? {\n backgroundColor: tokens.bgPress,\n borderColor: tokens.borderPress,\n }\n : undefined\n }\n focusStyle={{\n outlineColor: theme.colors.border.brand,\n outlineWidth: 2,\n outlineOffset: 2,\n outlineStyle: \"solid\",\n }}\n >\n {loading && (\n <Box\n position=\"absolute\"\n top={0}\n left={0}\n right={0}\n bottom={0}\n alignItems=\"center\"\n justifyContent=\"center\"\n zIndex={1}\n >\n <Spinner\n color={textColor}\n size={sizeStyles.spinnerSize}\n aria-hidden={true}\n />\n </Box>\n )}\n\n {iconLeft && (\n <Box\n width={sizeStyles.iconContainerSize}\n height={sizeStyles.iconContainerSize}\n alignItems=\"center\"\n justifyContent=\"center\"\n aria-hidden={true}\n style={{\n opacity: loading ? 0 : 1,\n pointerEvents: loading ? \"none\" : \"auto\",\n }}\n >\n {cloneIconWithDefaults(iconLeft, sizeStyles.iconSize, textColor)}\n </Box>\n )}\n\n <Box\n flex={fullWidth ? 1 : undefined}\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent={labelAlignment === \"left\" ? \"flex-start\" : \"center\"}\n paddingHorizontal={sizeStyles.padding}\n height=\"100%\"\n gap={sizeStyles.labelIconGap}\n style={{\n opacity: loading ? 0 : 1,\n pointerEvents: loading ? \"none\" : \"auto\",\n }}\n aria-hidden={loading ? true : undefined}\n >\n {labelIcon && (\n <Box aria-hidden={true}>\n {cloneIconWithDefaults(\n labelIcon,\n sizeStyles.labelIconSize,\n textColor\n )}\n </Box>\n )}\n\n <Text color={textColor} fontSize={sizeStyles.fontSize} fontWeight=\"500\">\n {children}\n </Text>\n\n {sublabel && (\n <Text\n color={textColor}\n fontSize={sizeStyles.fontSize}\n fontWeight=\"500\"\n style={{ opacity: 0.4 }}\n >\n {sublabel}\n </Text>\n )}\n\n {customContent && <Box aria-hidden={true}>{customContent}</Box>}\n </Box>\n\n {iconRight && (\n <Box\n width={sizeStyles.iconContainerSize}\n height={sizeStyles.iconContainerSize}\n alignItems=\"center\"\n justifyContent=\"center\"\n aria-hidden={true}\n style={{\n opacity: loading ? 0 : 1,\n pointerEvents: loading ? \"none\" : \"auto\",\n }}\n >\n {cloneIconWithDefaults(iconRight, sizeStyles.iconSize, textColor)}\n </Box>\n )}\n </Box>\n );\n};\n\nAppButton.displayName = \"AppButton\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\n\nexport interface ButtonGroupProps extends ThemeOverrideProps {\n /\n Layout orientation of the buttons\n * @default 'horizontal'\n /\n orientation?: \"horizontal\" \| \"vertical\";\n /\n Size of the button group, determines default gap between buttons\n * @default 'md'\n /\n size?: \"xl\" \| \"lg\" \| \"md\" \| \"sm\" \| \"xs\";\n /\n Buttons to be grouped\n /\n children: React.ReactNode;\n /\n Optional description text below the buttons\n /\n description?: string;\n /\n Optional error message text below the buttons\n /\n error?: string;\n /\n Custom gap between buttons (in pixels). If not provided, uses size and orientation based default.\n /\n gap?: number;\n /\n Accessible label for the button group\n /\n \"aria-label\"?: string;\n /\n ID of element that labels this button group\n /\n \"aria-labelledby\"?: string;\n /\n ID of element that describes this button group\n /\n \"aria-describedby\"?: string;\n /\n HTML id attribute\n /\n id?: string;\n /\n Test ID for testing frameworks\n /\n testID?: string;\n}\n\n/\n ButtonGroup - A container for grouping related buttons\n \n Provides semantic grouping for related actions with proper accessibility support.\n \n ## Accessibility Features\n \n - Semantic Grouping: Uses `role=\"group\"` to indicate related buttons\n * - Accessible Name: Supports `aria-label` or `aria-labelledby` to describe the group's purpose\n * - Error Announcements: Errors are announced to screen readers via `aria-live`\n * - Description Support: Optional description text for additional context\n \n /\nexport const ButtonGroup: React.FC<ButtonGroupProps> = ({\n orientation = \"horizontal\",\n size = \"md\",\n children,\n description,\n error,\n gap,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n id,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n // Flatten children to handle fragments and get actual button elements\n const flattenChildren = (children: React.ReactNode): React.ReactNode[] => {\n const result: React.ReactNode[] = [];\n React.Children.forEach(children, (child) => {\n if (React.isValidElement(child) && child.type === React.Fragment) {\n result.push(...flattenChildren(child.props.children));\n } else if (child !== null && child !== undefined) {\n result.push(child);\n }\n });\n return result;\n };\n\n const flatChildren = flattenChildren(children);\n const childCount = flatChildren.length;\n\n // Check if we need space-between layout (horizontal with more than 2 buttons)\n const useSpaceBetween = orientation === \"horizontal\" && childCount > 2;\n\n // Size-based default gaps by orientation\n const verticalGapMap = {\n xl: 16,\n lg: 16,\n md: 12,\n sm: 8,\n xs: 4,\n };\n\n const horizontalGapMap = {\n xl: 16,\n lg: 16,\n md: 16,\n sm: 12,\n xs: 12,\n };\n\n // Use provided gap or fall back to orientation and size based default\n const computedGap =\n gap ??\n (orientation === \"vertical\"\n ? verticalGapMap[size]\n : horizontalGapMap[size]);\n\n // Generate IDs for description and error elements\n const descriptionId = id ? `${id}-description` : undefined;\n const errorId = id ? `${id}-error` : undefined;\n\n // Build aria-describedby value combining external and internal references\n const computedAriaDescribedBy =\n [\n ariaDescribedBy,\n error && errorId ? errorId : undefined,\n description && descriptionId ? descriptionId : undefined,\n ]\n .filter(Boolean)\n .join(\" \") \|\| undefined;\n\n // Per Figma: vertical buttons always stretch; horizontal 1-2 buttons fill\n // the full row width (a pair splits 50/50); 3 use space-between.\n const stretchChildren =\n orientation === \"vertical\" \|\|\n (orientation === \"horizontal\" && childCount <= 2);\n\n const processChildren = (childrenToProcess: React.ReactNode[]) => {\n if (stretchChildren) {\n return childrenToProcess.map((child, index) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n ...child.props,\n fullWidth: true,\n key: child.key ?? index,\n });\n }\n return child;\n });\n }\n return childrenToProcess;\n };\n\n // Split children for space-between layout\n const renderChildren = () => {\n const processedChildren = processChildren(flatChildren);\n\n if (useSpaceBetween) {\n const firstChild = processedChildren[0];\n const restChildren = processedChildren.slice(1);\n\n return (\n <>\n {firstChild}\n <Box flexDirection=\"row\" gap={computedGap}>\n {restChildren}\n </Box>\n </>\n );\n }\n\n // For non-space-between layout, processChildren is a no-op unless\n // the children should stretch\n return processedChildren;\n };\n\n return (\n <Box flexDirection=\"column\" width=\"100%\" gap={8}>\n <Box\n role=\"group\"\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-describedby={computedAriaDescribedBy}\n id={id}\n testID={testID}\n flexDirection={orientation === \"horizontal\" ? \"row\" : \"column\"}\n alignItems=\"stretch\"\n gap={computedGap}\n justifyContent={useSpaceBetween ? \"space-between\" : undefined}\n width=\"100%\"\n >\n {renderChildren()}\n </Box>\n\n {error && (\n <Box marginTop={4}>\n <Text\n id={errorId}\n role=\"alert\"\n aria-live=\"assertive\"\n color={theme.colors.content.alert.primary}\n fontSize={14}\n fontWeight=\"400\"\n style={\n orientation === \"vertical\" ? { textAlign: \"center\" } : undefined\n }\n >\n {error}\n </Text>\n </Box>\n )}\n\n {description && (\n <Box marginTop={4}>\n <Text\n id={descriptionId}\n color={theme.colors.content.tertiary}\n fontSize={14}\n fontWeight=\"400\"\n style={\n orientation === \"vertical\" ? { textAlign: \"center\" } : undefined\n }\n >\n {description}\n </Text>\n </Box>\n )}\n </Box>\n );\n};\n\nButtonGroup.displayName = \"ButtonGroup\";\n"],"mappings":"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","names":["import_react","import_react_native","import_jsx_runtime","RNText","import_react_native","import_jsx_runtime","import_react_native","import_jsx_runtime","React","import_jsx_runtime","React","import_react","import_xui_core","import_jsx_runtime","cloneIconWithDefaults","React","import_react","import_xui_core","import_jsx_runtime","import_react","import_xui_core","import_jsx_runtime","cloneIconWithDefaults","React","import_react","import_xui_core","import_jsx_runtime","children","React"]}

package/native/index.mjs CHANGED Viewed

@@ -335,6 +335,7 @@ var Button = ({
   sublabel,
   labelAlignment = "center",
   labelIcon,
+  labelIconRight,
   customContent,
   "aria-label": ariaLabel,
   "aria-describedby": ariaDescribedBy,
@@ -371,14 +372,21 @@ var Button = ({
     ghost: "#000",
     disable: "#666"
   };
-  const handlePress = () => {
-    if (!isDisabled && onPress) {
+  const handlePress = (e) => {
+    if (isDisabled) {
+      e?.preventDefault();
+      return;
+    }
+    if (onPress) {
       onPress();
     }
   };
   const handleKeyDown = (e) => {
-    if (isDisabled) return;
     if (e.key === "Enter" || e.key === " ") {
+      if (isDisabled) {
+        e.preventDefault();
+        return;
+      }
       e.preventDefault();
       setIsKeyboardPressed(true);
     }
@@ -393,14 +401,23 @@ var Button = ({
       }
     }
   };
+  const brandControl = theme?.colors?.control?.brand;
+  const disabledBg = brandControl?.primary?.bgDisable ?? variantStyles.bgDisable ?? variantStyles.bg;
+  const disabledBorder = brandControl?.primary?.borderDisable ?? variantStyles.borderDisable ?? variantStyles.border;
+  const disabledText = brandControl?.text?.disable ?? textStyles.disable;
   let backgroundColor = variantStyles.bg;
   if (disabled) {
-    backgroundColor = variantStyles.bgDisable || variantStyles.bg;
+    backgroundColor = disabledBg;
   } else if (isKeyboardPressed) {
     backgroundColor = variantStyles.bgPress || variantStyles.bg;
   }
-  const borderColor = disabled ? variantStyles.borderDisable || variantStyles.border : variantStyles.border;
-  const textColor = disabled ? textStyles.disable : textStyles[variant];
+  let borderColor = variantStyles.border;
+  if (disabled) {
+    borderColor = disabledBorder;
+  } else if (isKeyboardPressed) {
+    borderColor = variantStyles.borderPress || variantStyles.border;
+  }
+  const textColor = disabled ? disabledText : textStyles[variant];
   const computedAriaLabel = ariaLabel;
   return /* @__PURE__ */ jsxs(
     Box,
@@ -411,7 +428,6 @@ var Button = ({
       onPress: handlePress,
       onKeyDown: handleKeyDown,
       onKeyUp: handleKeyUp,
-      disabled: isDisabled,
       "aria-label": computedAriaLabel,
       "aria-disabled": isDisabled || void 0,
       "aria-busy": loading || void 0,
@@ -433,12 +449,17 @@ var Button = ({
       justifyContent: "center",
       position: "relative",
       cursor: disabled ? "not-allowed" : loading ? "wait" : "pointer",
-      style: { transition: "background-color 500ms ease", opacity: 1 },
+      style: {
+        transition: "background-color 500ms ease, border-color 500ms ease",
+        opacity: 1
+      },
       hoverStyle: !isDisabled ? {
-        backgroundColor: variantStyles?.bgHover
+        backgroundColor: variantStyles?.bgHover,
+        borderColor: variantStyles?.borderHover
       } : void 0,
       pressStyle: !isDisabled ? {
-        backgroundColor: variantStyles?.bgPress
+        backgroundColor: variantStyles?.bgPress,
+        borderColor: variantStyles?.borderPress
       } : void 0,
       focusStyle: {
         outlineColor: theme.colors.border.brand,
@@ -504,12 +525,27 @@ var Button = ({
                 sizeStyles.labelIconSize,
                 textColor
               ) }),
-              /* @__PURE__ */ jsx5(Text, { color: textColor, fontSize: sizeStyles.fontSize, fontWeight: "500", children }),
-              sublabel && /* @__PURE__ */ jsx5(
+              /* @__PURE__ */ jsx5(
                 Text,
                 {
                   color: textColor,
                   fontSize: sizeStyles.fontSize,
+                  lineHeight: sizeStyles.lineHeight,
+                  fontWeight: "500",
+                  children
+                }
+              ),
+              labelIconRight && /* @__PURE__ */ jsx5(Box, { "aria-hidden": true, children: cloneIconWithDefaults(
+                labelIconRight,
+                sizeStyles.labelIconSize,
+                textColor
+              ) }),
+              sublabel && /* @__PURE__ */ jsx5(
+                Text,
+                {
+                  color: textColor,
+                  fontSize: sizeStyles.sublabelFontSize,
+                  lineHeight: sizeStyles.lineHeight,
                   fontWeight: "500",
                   style: { opacity: 0.4 },
                   children: sublabel