@xsolla/xui-button 0.206.2 → 0.208.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/web/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.tsx","../../src/Button.tsx","../../../../foundation/primitives-web/src/Box.tsx","../../../../foundation/primitives-web/src/filterDOMProps.ts","../../../../../node_modules/@emotion/memoize/dist/memoize.esm.js","../../../../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js","../../../../foundation/primitives-web/src/Text.tsx","../../../../foundation/primitives-web/src/textTruncation.ts","../../../../foundation/primitives-web/src/Spinner.tsx","../../../../foundation/primitives-web/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 /**\n * Activation handler. Invoked on click, or on Enter/Space when the button is\n * focused. Not called while `disabled` or `loading`.\n */\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 testID?: string;\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 // 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 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 styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n /* Only emit overflow-x/y when explicitly set. Defaulting them to\n visible after overflow would override the shorthand and break\n clipping (e.g. OtherCard bottom-right promo image). */\n overflow: ${(props) => props.overflow || \"visible\"};\n ${(props) =>\n props.overflowX != null ? `overflow-x: ${props.overflowX};` : \"\"}\n ${(props) =>\n props.overflowY != null ? `overflow-y: ${props.overflowY};` : \"\"}\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) =>\n props.opacity != null ? props.opacity : props.disabled ? 0.5 : 1};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n onError,\n onLoad,\n type,\n disabled,\n id,\n testID,\n \"data-testid\": dataTestId,\n ...props\n },\n ref\n ) => {\n // Handle as=\"img\" for rendering images with proper border-radius\n if (as === \"img\" && src) {\n return (\n <img\n src={src}\n alt={alt || \"\"}\n onError={onError}\n onLoad={onLoad}\n data-testid={dataTestId || testID}\n style={{\n display: \"block\",\n objectFit: \"cover\",\n width:\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width,\n height:\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height,\n borderRadius:\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius,\n position: props.position,\n top: typeof props.top === \"number\" ? `${props.top}px` : props.top,\n left:\n typeof props.left === \"number\" ? `${props.left}px` : props.left,\n right:\n typeof props.right === \"number\"\n ? `${props.right}px`\n : props.right,\n bottom:\n typeof props.bottom === \"number\"\n ? `${props.bottom}px`\n : props.bottom,\n ...props.style,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n elementType={as}\n id={id}\n type={as === \"button\" ? type || \"button\" : undefined}\n disabled={as === \"button\" ? disabled : undefined}\n onClick={onPress}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n role={role}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-current={ariaCurrent}\n aria-disabled={ariaDisabled}\n aria-busy={ariaBusy}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n aria-live={ariaLive}\n tabIndex={tabIndex !== undefined ? tabIndex : undefined}\n data-testid={dataTestId || testID}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport isPropValid from \"@emotion/is-prop-valid\";\n\n// Props that @emotion/is-prop-valid incorrectly treats as valid HTML.\n// These are React Native or component-specific props that match\n// valid HTML patterns (on* event handlers, SVG attributes).\nexport const ADDITIONAL_BLOCKED_PROPS = new Set([\n // RN-only event handlers (pass isPropValid's on* pattern)\n \"onPress\",\n \"onChangeText\",\n \"onLayout\",\n \"onMoveShouldSetResponder\",\n \"onResponderGrant\",\n \"onResponderMove\",\n \"onResponderRelease\",\n \"onResponderTerminate\",\n // SVG attributes that pass isPropValid\n \"strokeWidth\",\n // CSS properties that pass isPropValid but are used as component props\n \"overflow\",\n \"opacity\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n // Cross-platform layout prop that Text consumes as CSS, never as an\n // attribute. Pinned explicitly because it is now spread into the styled\n // component rather than destructured away before it can reach the DOM.\n \"numberOfLines\",\n]);\n\nfunction shouldForwardProp(key: string): boolean {\n if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;\n return isPropValid(key);\n}\n\n/**\n * Creates a React component that renders the given HTML tag\n * but filters out non-HTML props before they reach the DOM.\n *\n * Uses @emotion/is-prop-valid (same library styled-components v4\n * uses internally) to automatically block invalid HTML attributes,\n * plus a small blocklist for false positives (RN on* handlers, SVG attrs).\n *\n * Usage: `const FilteredDiv = createFilteredElement(\"div\");`\n * Then: `const StyledBox = styled(FilteredDiv)<BoxProps>\\`...\\`;`\n *\n * styled-components can still read ALL props for CSS interpolation,\n * but only valid HTML attributes are forwarded to the DOM element.\n */\nexport function createFilteredElement(defaultTag: string) {\n const Component = React.forwardRef<HTMLElement, Record<string, unknown>>(\n ({ children, elementType, ...props }, ref) => {\n const Tag = (elementType as string) || defaultTag;\n const htmlProps: Record<string, unknown> = {};\n for (const key of Object.keys(props)) {\n if (shouldForwardProp(key)) {\n htmlProps[key] = props[key];\n }\n }\n return React.createElement(\n Tag,\n { ref, ...htmlProps },\n children as React.ReactNode\n );\n }\n );\n Component.displayName = `Filtered(${defaultTag})`;\n return Component;\n}\n","function memoize(fn) {\n var cache = {};\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport default memoize;\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|inert|itemProp|itemScope|itemType|itemID|itemRef|on|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar index = memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport default index;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\nimport { truncationStyles } from \"./textTruncation\";\n\nconst FilteredSpan = createFilteredElement(\"span\");\n\nconst StyledText = styled(FilteredSpan)<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n\n /* Keep last: single-line truncation has to win over white-space above. */\n ${(props) => truncationStyles(props.numberOfLines)}\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n testID,\n \"data-testid\": dataTestId,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n data-testid={dataTestId || testID}\n />\n );\n};\n","/**\n * Web implementation of the cross-platform `numberOfLines` text prop.\n *\n * Native maps `numberOfLines` straight onto `RNText`. A web `<span>` has no\n * equivalent, so emit the CSS that produces the same result.\n *\n * Two details matter for the single-line case:\n * - `text-overflow` only takes effect on a block container, so the inline\n * `<span>` is promoted to `display: block` and capped at `max-width: 100%`.\n * - `min-width: 0` lets the text shrink below its own content width when it\n * sits in a flex row. Without it a `nowrap` label keeps its full intrinsic\n * width and pushes its siblings (icons, chevrons) out of a fixed-width field.\n *\n * Returns an empty string when there is nothing to clamp, so the declaration\n * block stays untouched for the majority of callers.\n */\nexport const truncationStyles = (numberOfLines?: number): string => {\n if (!numberOfLines || numberOfLines < 1) return \"\";\n\n if (numberOfLines === 1) {\n return `\n display: block;\n max-width: 100%;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n `;\n }\n\n return `\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: ${numberOfLines};\n line-clamp: ${numberOfLines};\n max-width: 100%;\n min-width: 0;\n overflow: hidden;\n `;\n};\n","import React from \"react\";\nimport styled, { keyframes } from \"styled-components\";\nimport type { SpinnerProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst rotate = keyframes`\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n`;\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledSpinner = styled(FilteredDiv)<SpinnerProps>`\n width: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n height: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n border: ${(props) => props.strokeWidth || 2}px solid\n ${(props) => props.color || \"currentColor\"};\n border-bottom-color: transparent;\n border-radius: 50%;\n display: inline-block;\n box-sizing: border-box;\n animation: ${rotate} 1s linear infinite;\n`;\n\nexport const Spinner: React.FC<SpinnerProps> = ({\n role = \"status\",\n \"aria-label\": ariaLabel,\n \"aria-live\": ariaLive = \"polite\",\n \"aria-describedby\": ariaDescribedBy,\n testID,\n ...props\n}) => {\n return (\n <StyledSpinner\n role={role}\n aria-label={ariaLabel}\n aria-live={ariaLive}\n aria-describedby={ariaDescribedBy}\n data-testid={testID}\n {...props}\n />\n );\n};\n\nSpinner.displayName = \"Spinner\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledIcon = styled(FilteredDiv)<IconProps>`\n display: flex;\n align-items: center;\n justify-content: center;\n width: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n height: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n color: ${(props) => props.color || \"currentColor\"};\n\n /* Icons paint themselves — each icon's own SVG sets its fill/stroke\n (icons-base via inline \"fill: currentColor\", Lucide via \"fill\"/\"stroke\"\n attributes). Do not add fill/stroke here: it re-strokes fill-based icons\n and thickens the glyph. See FEP-877. */\n svg {\n width: 100%;\n height: 100%;\n }\n`;\n\nexport const Icon: React.FC<IconProps> = ({\n children,\n testID,\n \"data-testid\": dataTestId,\n ...props\n}) => {\n return (\n <StyledIcon data-testid={dataTestId || testID} {...props}>\n {children}\n </StyledIcon>\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\n// Matches an rgba() token whose alpha channel is 0 — i.e. fully transparent.\nconst TRANSPARENT_RGBA =\n /^rgba\\(\\s*[\\d.]+\\s*,\\s*[\\d.]+\\s*,\\s*[\\d.]+\\s*,\\s*(?:0|0?\\.0+)\\s*\\)$/;\n\n/**\n * Detects a fully transparent color token. The design tokens express \"no fill\"\n * for tertiary variants with several forms — the `transparent` keyword, an\n * `rgba(…, 0)` value with a zero alpha channel (each tertiary tone uses a\n * different RGB triplet: `rgba(255, 255, 255, 0)`, `rgba(80, 49, 232, 0)`,\n * `rgba(255, 43, 0, 0)`), or an 8-digit hex ending in `00`. Used so transparent\n * variants keep their resting transparent background when disabled instead of\n * picking up the canonical grey disable swatch.\n */\nconst isTransparentColor = (color?: string): boolean => {\n if (!color) return true;\n const value = color.trim().toLowerCase();\n if (value === \"transparent\") return true;\n if (TRANSPARENT_RGBA.test(value)) return true;\n if (/^#[0-9a-f]{6}00$/.test(value)) return true;\n return false;\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 testID?: string;\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 colors come from the canonical control.brand.primary swatch — Figma\n // maps every *filled* disabled control to the same grey regardless of the\n // active tone/variant. The exception: variants whose resting background is\n // transparent (tertiary, across every tone) must STAY transparent when\n // disabled — the disabled state is conveyed by the dimmed icon alone, not a\n // grey fill. Token bg/border values are typed optional, so fall back safely.\n const brandControl = theme.colors.control.brand as unknown as Record<\n string,\n ControlVariantStyles\n > & { text: ControlTextStyles };\n // tertiary tones express \"no fill\" with several rgba(…, 0) forms rather than a\n // single \"transparent\" string, so detect the alpha channel, don't string-match.\n const variantHasFill = !isTransparentColor(variantStyles.bg);\n // Filled variants (primary/secondary) share the canonical brand disable swatch;\n // transparent variants (tertiary) keep their resting transparent background.\n const filledDisabledBg =\n brandControl.primary.bgDisable ??\n variantStyles.bgDisable ??\n variantStyles.bg;\n const disabledBg = variantHasFill ? filledDisabledBg : variantStyles.bg;\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 forwardRef,\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 /**\n * Button label. Omit for icon-only buttons (provide `aria-label`).\n *\n * An icon may also be passed directly as `children` instead of via\n * `iconLeft`/`iconRight`. When `children` carries no text, the button is\n * treated as icon-only and renders as a square sized from the design-system\n * height token for `size`.\n */\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 /**\n * Whether to show the hover/press background color.\n * When `false`, the button background stays transparent in all interactive\n * states, producing a text-only appearance with no hover fill.\n * @default true\n */\n hoverBackground?: boolean;\n /**\n * Remove the button's internal padding so it sits flush against its content.\n * The component applies padding via an inline style, which overrides any CSS\n * class or `style` prop a consumer passes, so this prop is the supported way\n * to render a zero-padding FlexButton (e.g. an inline text action).\n *\n * Icon-only buttons keep their square dimensions when `noPadding` is set —\n * only the inner padding is removed.\n * @default false\n */\n noPadding?: 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 testID?: string;\n}\n\ntype ButtonState = \"default\" | \"hover\" | \"press\";\n\n/** Icon frame size per size. Mirrors `theme.sizing.flexButton(size).iconSize`. */\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\n/** Must match {@link ICON_SIZES}, or the button resizes when loading starts. */\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 FLEX_BUTTON_PADDING = 4;\n\n/**\n * Whether `node` contributes visible *text* to the button label.\n *\n * React elements are unwrapped one level at a time so an icon element — which\n * renders an `<svg>` and carries no text children — is not mistaken for a text\n * label, while a wrapped label such as `<span>Save</span>` still counts.\n */\nconst hasVisibleLabel = (node: ReactNode): boolean => {\n if (node == null || node === false || node === true) return false;\n if (typeof node === \"string\") return node.trim().length > 0;\n if (typeof node === \"number\") return true;\n if (Array.isArray(node)) return node.some(hasVisibleLabel);\n if (React.isValidElement(node)) {\n const { children: elementChildren } = (node.props ?? {}) as {\n children?: ReactNode;\n };\n return hasVisibleLabel(elementChildren);\n }\n return true;\n};\n\n/** Whether `node` renders anything at all (text or element). */\nconst hasRenderableContent = (node: ReactNode): boolean => {\n if (node == null || node === false || node === true) return false;\n if (typeof node === \"string\") return node.trim().length > 0;\n if (Array.isArray(node)) return node.some(hasRenderableContent);\n return true;\n};\n\n/**\n * Square side of an icon-only `FlexButton`, in px — mirrors\n * `theme.sizing.flexButton(size).height`, which is theme-independent.\n *\n * Duplicated here so layouts that reserve space for a `FlexButton` (e.g. the\n * Modal header columns) can size themselves without a theme lookup. Guarded by\n * a test that compares this table against the token.\n */\nconst BOX_SIZES: Record<NonNullable<FlexButtonProps[\"size\"]>, number> = {\n xs: 20,\n sm: 22,\n md: 28,\n lg: 32,\n xl: 36,\n};\n\n/**\n * Total hit-area size of an icon-only `FlexButton`, in px. `noPadding` does not\n * change it — only the inner padding is removed.\n */\nexport const getFlexButtonBoxSize = (\n size: NonNullable<FlexButtonProps[\"size\"]> = \"md\"\n): number => BOX_SIZES[size];\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 * ## Icon-only buttons\n *\n * A FlexButton is icon-only when it has no text label and an icon is supplied\n * either as `children` or via `iconLeft`/`iconRight`. Icon-only buttons render\n * as a square whose side equals `theme.sizing.flexButton(size).height`, so they\n * line up with the Modal header icon slots (36x36 at `size=\"xl\"`).\n *\n * ```tsx\n * <FlexButton variant=\"secondary\" size=\"xl\" aria-label=\"Go back\">\n * <BackwardAlt variant=\"line\" />\n * </FlexButton>\n * ```\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 = forwardRef<HTMLButtonElement, FlexButtonProps>(\n (\n {\n children,\n variant = \"brand\",\n size = \"md\",\n background = false,\n hoverBackground = true,\n noPadding = 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 ref\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\n ? theme.colors.control.brand.primary.bgDisable\n : \"transparent\",\n text: theme.colors.control.brand.text.disable,\n border: undefined,\n };\n }\n\n const effectiveBackground = loading ? false : background;\n\n // When hoverBackground is disabled, hover/press states use transparent bg.\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: !hoverBackground\n ? \"transparent\"\n : currentState === \"press\"\n ? theme.colors.background.brand.primary\n : currentState === \"hover\"\n ? theme.colors.overlay.brand\n : \"transparent\",\n text:\n currentState === \"press\" && hoverBackground\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: !hoverBackground\n ? \"transparent\"\n : currentState === \"press\" || currentState === \"hover\"\n ? theme.colors.overlay.mono\n : \"transparent\",\n text: theme.colors.content.primary,\n border:\n currentState === \"press\"\n ? theme.colors.border.primary\n : 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: !hoverBackground\n ? \"transparent\"\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: !hoverBackground\n ? \"transparent\"\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: !hoverBackground\n ? \"transparent\"\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: !hoverBackground\n ? \"transparent\"\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 const showTextLabel = hasVisibleLabel(children);\n // An icon passed as `children` (rather than via iconLeft/iconRight) is still\n // icon content, so it must not fall through to the text-rendering path.\n const hasIconChildren = !showTextLabel && hasRenderableContent(children);\n const isIconOnly =\n !loading &&\n !showTextLabel &&\n Boolean(iconLeft || iconRight || hasIconChildren);\n // Square hit area comes from the design-system height token so an icon-only\n // FlexButton matches the Modal header icon slots (36px at `xl`) instead of\n // collapsing to `iconSize + padding`.\n const iconOnlyHitArea = getFlexButtonBoxSize(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 // No whole-element opacity for the disabled state: the disabled palette is\n // already flat and deliberate (`control.brand.primary.bgDisable` /\n // transparent fill plus `control.brand.text.disable` label), and layering\n // opacity on top composited it against the host surface — a solid token\n // rendered translucent in consuming apps while looking correct in\n // Storybook. See FEP-828.\n const buttonStyle: CSSProperties = {\n display: \"inline-flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n gap: isIconOnly ? 0 : \"2px\",\n boxSizing: \"border-box\",\n padding: noPadding ? \"0px\" : `${FLEX_BUTTON_PADDING}px`,\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: isIconOnly ? 0 : 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 ...(isIconOnly && {\n width: iconOnlyHitArea,\n height: iconOnlyHitArea,\n minWidth: iconOnlyHitArea,\n minHeight: iconOnlyHitArea,\n flexShrink: 0,\n }),\n };\n\n const contentStyle: CSSProperties = {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n gap: isIconOnly ? 0 : \"2px\",\n ...(isIconOnly && {\n width: \"100%\",\n height: \"100%\",\n lineHeight: 0,\n }),\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 ref={ref}\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 {showTextLabel && <span>{children}</span>}\n {hasIconChildren && (\n <Icon size={iconSize} color={colors.text}>\n {children}\n </Icon>\n )}\n {iconRight && (\n <Icon size={iconSize} color={colors.text}>\n {iconRight}\n </Icon>\n )}\n </>\n )}\n </span>\n </button>\n );\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 testID?: string;\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 id?: string;\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 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 const computedGap =\n gap ??\n (orientation === \"vertical\"\n ? verticalGapMap[size]\n : horizontalGapMap[size]);\n\n const descriptionId = id ? `${id}-description` : undefined;\n const errorId = id ? `${id}-error` : undefined;\n\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","React","styled","React","import_styled_components","import_jsx_runtime","styled","import_styled_components","import_jsx_runtime","FilteredDiv","styled","import_styled_components","import_jsx_runtime","FilteredDiv","styled","import_jsx_runtime","React","import_react","import_xui_core","import_jsx_runtime","cloneIconWithDefaults","React","import_react","import_xui_core","import_jsx_runtime","React","import_react","import_xui_core","import_jsx_runtime","cloneIconWithDefaults","React","import_react","import_xui_core","import_jsx_runtime","children","React","index"]}
1
+ {"version":3,"sources":["../../src/index.tsx","../../src/Button.tsx","../../../../foundation/primitives-web/src/Box.tsx","../../../../foundation/primitives-web/src/filterDOMProps.ts","../../../../../node_modules/@emotion/memoize/dist/memoize.esm.js","../../../../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js","../../../../foundation/primitives-web/src/Text.tsx","../../../../foundation/primitives-web/src/textTruncation.ts","../../../../foundation/primitives-web/src/Spinner.tsx","../../../../foundation/primitives-web/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 /**\n * Activation handler. Invoked on click, or on Enter/Space when the button is\n * focused. Not called while `disabled` or `loading`.\n */\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 testID?: string;\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 // 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 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 styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n /* Only emit overflow-x/y when explicitly set. Defaulting them to\n visible after overflow would override the shorthand and break\n clipping (e.g. OtherCard bottom-right promo image). */\n overflow: ${(props) => props.overflow || \"visible\"};\n ${(props) =>\n props.overflowX != null ? `overflow-x: ${props.overflowX};` : \"\"}\n ${(props) =>\n props.overflowY != null ? `overflow-y: ${props.overflowY};` : \"\"}\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) =>\n props.opacity != null ? props.opacity : props.disabled ? 0.5 : 1};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n onError,\n onLoad,\n type,\n disabled,\n id,\n testID,\n \"data-testid\": dataTestId,\n ...props\n },\n ref\n ) => {\n // Handle as=\"img\" for rendering images with proper border-radius\n if (as === \"img\" && src) {\n return (\n <img\n src={src}\n alt={alt || \"\"}\n onError={onError}\n onLoad={onLoad}\n data-testid={dataTestId || testID}\n style={{\n display: \"block\",\n objectFit: \"cover\",\n width:\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width,\n height:\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height,\n borderRadius:\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius,\n position: props.position,\n top: typeof props.top === \"number\" ? `${props.top}px` : props.top,\n left:\n typeof props.left === \"number\" ? `${props.left}px` : props.left,\n right:\n typeof props.right === \"number\"\n ? `${props.right}px`\n : props.right,\n bottom:\n typeof props.bottom === \"number\"\n ? `${props.bottom}px`\n : props.bottom,\n ...props.style,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n elementType={as}\n id={id}\n type={as === \"button\" ? type || \"button\" : undefined}\n disabled={as === \"button\" ? disabled : undefined}\n onClick={onPress}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n role={role}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-current={ariaCurrent}\n aria-disabled={ariaDisabled}\n aria-busy={ariaBusy}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n aria-live={ariaLive}\n tabIndex={tabIndex !== undefined ? tabIndex : undefined}\n data-testid={dataTestId || testID}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport isPropValid from \"@emotion/is-prop-valid\";\n\n// Props that @emotion/is-prop-valid incorrectly treats as valid HTML.\n// These are React Native or component-specific props that match\n// valid HTML patterns (on* event handlers, SVG attributes).\nexport const ADDITIONAL_BLOCKED_PROPS = new Set([\n // RN-only event handlers (pass isPropValid's on* pattern)\n \"onPress\",\n \"onChangeText\",\n \"onLayout\",\n \"onMoveShouldSetResponder\",\n \"onResponderGrant\",\n \"onResponderMove\",\n \"onResponderRelease\",\n \"onResponderTerminate\",\n // SVG attributes that pass isPropValid\n \"strokeWidth\",\n // CSS properties that pass isPropValid but are used as component props\n \"overflow\",\n \"opacity\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n // Cross-platform layout prop that Text consumes as CSS, never as an\n // attribute. Pinned explicitly because it is now spread into the styled\n // component rather than destructured away before it can reach the DOM.\n \"numberOfLines\",\n]);\n\nfunction shouldForwardProp(key: string): boolean {\n if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;\n return isPropValid(key);\n}\n\n/**\n * Creates a React component that renders the given HTML tag\n * but filters out non-HTML props before they reach the DOM.\n *\n * Uses @emotion/is-prop-valid (same library styled-components v4\n * uses internally) to automatically block invalid HTML attributes,\n * plus a small blocklist for false positives (RN on* handlers, SVG attrs).\n *\n * Usage: `const FilteredDiv = createFilteredElement(\"div\");`\n * Then: `const StyledBox = styled(FilteredDiv)<BoxProps>\\`...\\`;`\n *\n * styled-components can still read ALL props for CSS interpolation,\n * but only valid HTML attributes are forwarded to the DOM element.\n */\nexport function createFilteredElement(defaultTag: string) {\n const Component = React.forwardRef<HTMLElement, Record<string, unknown>>(\n ({ children, elementType, ...props }, ref) => {\n const Tag = (elementType as string) || defaultTag;\n const htmlProps: Record<string, unknown> = {};\n for (const key of Object.keys(props)) {\n if (shouldForwardProp(key)) {\n htmlProps[key] = props[key];\n }\n }\n return React.createElement(\n Tag,\n { ref, ...htmlProps },\n children as React.ReactNode\n );\n }\n );\n Component.displayName = `Filtered(${defaultTag})`;\n return Component;\n}\n","function memoize(fn) {\n var cache = {};\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport default memoize;\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|inert|itemProp|itemScope|itemType|itemID|itemRef|on|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar index = memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport default index;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\nimport { truncationStyles } from \"./textTruncation\";\n\nconst FilteredSpan = createFilteredElement(\"span\");\n\nconst StyledText = styled(FilteredSpan)<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n\n /* Keep last: single-line truncation has to win over white-space above. */\n ${(props) => truncationStyles(props.numberOfLines)}\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n testID,\n \"data-testid\": dataTestId,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n data-testid={dataTestId || testID}\n />\n );\n};\n","/**\n * Web implementation of the cross-platform `numberOfLines` text prop.\n *\n * Native maps `numberOfLines` straight onto `RNText`. A web `<span>` has no\n * equivalent, so emit the CSS that produces the same result.\n *\n * Two details matter for the single-line case:\n * - `text-overflow` only takes effect on a block container, so the inline\n * `<span>` is promoted to `display: block` and capped at `max-width: 100%`.\n * - `min-width: 0` lets the text shrink below its own content width when it\n * sits in a flex row. Without it a `nowrap` label keeps its full intrinsic\n * width and pushes its siblings (icons, chevrons) out of a fixed-width field.\n *\n * Returns an empty string when there is nothing to clamp, so the declaration\n * block stays untouched for the majority of callers.\n */\nexport const truncationStyles = (numberOfLines?: number): string => {\n if (!numberOfLines || numberOfLines < 1) return \"\";\n\n if (numberOfLines === 1) {\n return `\n display: block;\n max-width: 100%;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n `;\n }\n\n return `\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: ${numberOfLines};\n line-clamp: ${numberOfLines};\n max-width: 100%;\n min-width: 0;\n overflow: hidden;\n `;\n};\n","import React from \"react\";\nimport styled, { keyframes } from \"styled-components\";\nimport type { SpinnerProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst rotate = keyframes`\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n`;\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledSpinner = styled(FilteredDiv)<SpinnerProps>`\n width: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n height: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n border: ${(props) => props.strokeWidth || 2}px solid\n ${(props) => props.color || \"currentColor\"};\n border-bottom-color: transparent;\n border-radius: 50%;\n display: inline-block;\n box-sizing: border-box;\n animation: ${rotate} 1s linear infinite;\n`;\n\nexport const Spinner: React.FC<SpinnerProps> = ({\n role = \"status\",\n \"aria-label\": ariaLabel,\n \"aria-live\": ariaLive = \"polite\",\n \"aria-describedby\": ariaDescribedBy,\n testID,\n ...props\n}) => {\n return (\n <StyledSpinner\n role={role}\n aria-label={ariaLabel}\n aria-live={ariaLive}\n aria-describedby={ariaDescribedBy}\n data-testid={testID}\n {...props}\n />\n );\n};\n\nSpinner.displayName = \"Spinner\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledIcon = styled(FilteredDiv)<IconProps>`\n display: flex;\n align-items: center;\n justify-content: center;\n width: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n height: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n color: ${(props) => props.color || \"currentColor\"};\n\n /* Icons paint themselves — each icon's own SVG sets its fill/stroke\n (icons-base via inline \"fill: currentColor\", Lucide via \"fill\"/\"stroke\"\n attributes). Do not add fill/stroke here: it re-strokes fill-based icons\n and thickens the glyph. See FEP-877. */\n svg {\n width: 100%;\n height: 100%;\n }\n`;\n\nexport const Icon: React.FC<IconProps> = ({\n children,\n testID,\n \"data-testid\": dataTestId,\n ...props\n}) => {\n return (\n <StyledIcon data-testid={dataTestId || testID} {...props}>\n {children}\n </StyledIcon>\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\n// Matches an rgba() token whose alpha channel is 0 — i.e. fully transparent.\nconst TRANSPARENT_RGBA =\n /^rgba\\(\\s*[\\d.]+\\s*,\\s*[\\d.]+\\s*,\\s*[\\d.]+\\s*,\\s*(?:0|0?\\.0+)\\s*\\)$/;\n\n/**\n * Detects a fully transparent color token. The design tokens express \"no fill\"\n * for tertiary variants with several forms — the `transparent` keyword, an\n * `rgba(…, 0)` value with a zero alpha channel (each tertiary tone uses a\n * different RGB triplet: `rgba(255, 255, 255, 0)`, `rgba(80, 49, 232, 0)`,\n * `rgba(255, 43, 0, 0)`), or an 8-digit hex ending in `00`. Used so transparent\n * variants keep their resting transparent background when disabled instead of\n * picking up the canonical grey disable swatch.\n */\nconst isTransparentColor = (color?: string): boolean => {\n if (!color) return true;\n const value = color.trim().toLowerCase();\n if (value === \"transparent\") return true;\n if (TRANSPARENT_RGBA.test(value)) return true;\n if (/^#[0-9a-f]{6}00$/.test(value)) return true;\n return false;\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 testID?: string;\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 colors come from the canonical control.brand.primary swatch — Figma\n // maps every *filled* disabled control to the same grey regardless of the\n // active tone/variant. The exception: variants whose resting background is\n // transparent (tertiary, across every tone) must STAY transparent when\n // disabled — the disabled state is conveyed by the dimmed icon alone, not a\n // grey fill. Token bg/border values are typed optional, so fall back safely.\n const brandControl = theme.colors.control.brand as unknown as Record<\n string,\n ControlVariantStyles\n > & { text: ControlTextStyles };\n // tertiary tones express \"no fill\" with several rgba(…, 0) forms rather than a\n // single \"transparent\" string, so detect the alpha channel, don't string-match.\n const variantHasFill = !isTransparentColor(variantStyles.bg);\n // Filled variants (primary/secondary) share the canonical brand disable swatch;\n // transparent variants (tertiary) keep their resting transparent background.\n const filledDisabledBg =\n brandControl.primary.bgDisable ??\n variantStyles.bgDisable ??\n variantStyles.bg;\n const disabledBg = variantHasFill ? filledDisabledBg : variantStyles.bg;\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 forwardRef,\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 /**\n * Button label. Omit for icon-only buttons (provide `aria-label`).\n *\n * An icon may also be passed directly as `children` instead of via\n * `iconLeft`/`iconRight`. When `children` carries no text, the button is\n * treated as icon-only and renders as a square sized from the design-system\n * height token for `size`.\n */\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 /**\n * Whether to show the hover/press background color.\n * When `false`, the button background stays transparent in all interactive\n * states, producing a text-only appearance with no hover fill.\n * @default true\n */\n hoverBackground?: boolean;\n /**\n * Remove the button's internal padding so it sits flush against its content.\n * The component applies padding via an inline style, which overrides any CSS\n * class or `style` prop a consumer passes, so this prop is the supported way\n * to render a zero-padding FlexButton (e.g. an inline text action).\n *\n * Icon-only buttons keep their square dimensions when `noPadding` is set —\n * only the inner padding is removed.\n * @default false\n */\n noPadding?: 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 testID?: string;\n}\n\ntype ButtonState = \"default\" | \"hover\" | \"press\";\n\n/** Icon frame size per size. Mirrors `theme.sizing.flexButton(size).iconSize`. */\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\n/** Must match {@link ICON_SIZES}, or the button resizes when loading starts. */\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 FLEX_BUTTON_PADDING = 4;\n\n/**\n * Whether `node` contributes visible *text* to the button label.\n *\n * React elements are unwrapped one level at a time so an icon element — which\n * renders an `<svg>` and carries no text children — is not mistaken for a text\n * label, while a wrapped label such as `<span>Save</span>` still counts.\n */\nconst hasVisibleLabel = (node: ReactNode): boolean => {\n if (node == null || node === false || node === true) return false;\n if (typeof node === \"string\") return node.trim().length > 0;\n if (typeof node === \"number\") return true;\n if (Array.isArray(node)) return node.some(hasVisibleLabel);\n if (React.isValidElement(node)) {\n const { children: elementChildren } = (node.props ?? {}) as {\n children?: ReactNode;\n };\n return hasVisibleLabel(elementChildren);\n }\n return true;\n};\n\n/** Whether `node` renders anything at all (text or element). */\nconst hasRenderableContent = (node: ReactNode): boolean => {\n if (node == null || node === false || node === true) return false;\n if (typeof node === \"string\") return node.trim().length > 0;\n if (Array.isArray(node)) return node.some(hasRenderableContent);\n return true;\n};\n\n/**\n * Square side of an icon-only `FlexButton`, in px — mirrors\n * `theme.sizing.flexButton(size).height`, which is theme-independent.\n *\n * Duplicated here so layouts that reserve space for a `FlexButton` (e.g. the\n * Modal header columns) can size themselves without a theme lookup. Guarded by\n * a test that compares this table against the token.\n */\nconst BOX_SIZES: Record<NonNullable<FlexButtonProps[\"size\"]>, number> = {\n xs: 20,\n sm: 22,\n md: 28,\n lg: 32,\n xl: 36,\n};\n\n/**\n * Total hit-area size of an icon-only `FlexButton`, in px. `noPadding` does not\n * change it — only the inner padding is removed.\n */\nexport const getFlexButtonBoxSize = (\n size: NonNullable<FlexButtonProps[\"size\"]> = \"md\"\n): number => BOX_SIZES[size];\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 * ## Icon-only buttons\n *\n * A FlexButton is icon-only when it has no text label and an icon is supplied\n * either as `children` or via `iconLeft`/`iconRight`. Icon-only buttons render\n * as a square whose side equals `theme.sizing.flexButton(size).height`, so they\n * line up with the Modal header icon slots (36x36 at `size=\"xl\"`).\n *\n * ```tsx\n * <FlexButton variant=\"secondary\" size=\"xl\" aria-label=\"Go back\">\n * <BackwardAlt variant=\"line\" />\n * </FlexButton>\n * ```\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 = forwardRef<HTMLButtonElement, FlexButtonProps>(\n (\n {\n children,\n variant = \"brand\",\n size = \"md\",\n background = false,\n hoverBackground = true,\n noPadding = 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 ref\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\n ? theme.colors.control.brand.primary.bgDisable\n : \"transparent\",\n text: theme.colors.control.brand.text.disable,\n border: undefined,\n };\n }\n\n const effectiveBackground = loading ? false : background;\n\n // When hoverBackground is disabled, hover/press states use transparent bg.\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: !hoverBackground\n ? \"transparent\"\n : currentState === \"press\"\n ? theme.colors.background.brand.primary\n : currentState === \"hover\"\n ? theme.colors.overlay.brand\n : \"transparent\",\n text:\n currentState === \"press\" && hoverBackground\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: !hoverBackground\n ? \"transparent\"\n : currentState === \"press\" || currentState === \"hover\"\n ? theme.colors.overlay.mono\n : \"transparent\",\n text: theme.colors.content.primary,\n border:\n currentState === \"press\"\n ? theme.colors.border.primary\n : 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: !hoverBackground\n ? \"transparent\"\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: !hoverBackground\n ? \"transparent\"\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: !hoverBackground\n ? \"transparent\"\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: !hoverBackground\n ? \"transparent\"\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 const showTextLabel = hasVisibleLabel(children);\n // An icon passed as `children` (rather than via iconLeft/iconRight) is still\n // icon content, so it must not fall through to the text-rendering path.\n const hasIconChildren = !showTextLabel && hasRenderableContent(children);\n const isIconOnly =\n !loading &&\n !showTextLabel &&\n Boolean(iconLeft || iconRight || hasIconChildren);\n // Square hit area comes from the design-system height token so an icon-only\n // FlexButton matches the Modal header icon slots (36px at `xl`) instead of\n // collapsing to `iconSize + padding`.\n const iconOnlyHitArea = getFlexButtonBoxSize(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 // No whole-element opacity for the disabled state: the disabled palette is\n // already flat and deliberate (`control.brand.primary.bgDisable` /\n // transparent fill plus `control.brand.text.disable` label), and layering\n // opacity on top composited it against the host surface — a solid token\n // rendered translucent in consuming apps while looking correct in\n // Storybook. See FEP-828.\n const buttonStyle: CSSProperties = {\n display: \"inline-flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n gap: isIconOnly ? 0 : \"2px\",\n boxSizing: \"border-box\",\n padding: noPadding ? \"0px\" : `${FLEX_BUTTON_PADDING}px`,\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: isIconOnly ? 0 : 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 ...(isIconOnly && {\n width: iconOnlyHitArea,\n height: iconOnlyHitArea,\n minWidth: iconOnlyHitArea,\n minHeight: iconOnlyHitArea,\n flexShrink: 0,\n }),\n };\n\n const contentStyle: CSSProperties = {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n gap: isIconOnly ? 0 : \"2px\",\n ...(isIconOnly && {\n width: \"100%\",\n height: \"100%\",\n lineHeight: 0,\n }),\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 ref={ref}\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 {showTextLabel && <span>{children}</span>}\n {hasIconChildren && (\n <Icon size={iconSize} color={colors.text}>\n {children}\n </Icon>\n )}\n {iconRight && (\n <Icon size={iconSize} color={colors.text}>\n {iconRight}\n </Icon>\n )}\n </>\n )}\n </span>\n </button>\n );\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 testID?: string;\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 * Force or suppress the split (\"space-between\") layout, in which the first\n * button is pinned to the left edge and the remaining buttons are grouped\n * on the right.\n *\n * When omitted, the layout is chosen by child count: horizontal groups with\n * 3 or more buttons split, smaller groups do not. Set `split` to override\n * that heuristic in either direction:\n *\n * - `split` — split a 2-button group (buttons keep their natural width\n * instead of stretching to fill the row)\n * - `split={false}` — opt a 3+ button group out of the split layout\n *\n * Has no effect when `orientation=\"vertical\"` or when the group has fewer\n * than 2 children.\n */\n split?: boolean;\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 id?: string;\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 split,\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 // `split` overrides the child-count heuristic in both directions. A single\n // child can never split, regardless of the prop.\n const useSpaceBetween =\n orientation === \"horizontal\" && childCount > 1 && (split ?? 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 const computedGap =\n gap ??\n (orientation === \"vertical\"\n ? verticalGapMap[size]\n : horizontalGapMap[size]);\n\n const descriptionId = id ? `${id}-description` : undefined;\n const errorId = id ? `${id}-error` : undefined;\n\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 // An explicit `split` opts a pair into space-between, and stretched children\n // would fill the row and hide that layout — so never stretch when splitting.\n const stretchChildren =\n orientation === \"vertical\" ||\n (orientation === \"horizontal\" && childCount <= 2 && !useSpaceBetween);\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","React","styled","React","import_styled_components","import_jsx_runtime","styled","import_styled_components","import_jsx_runtime","FilteredDiv","styled","import_styled_components","import_jsx_runtime","FilteredDiv","styled","import_jsx_runtime","React","import_react","import_xui_core","import_jsx_runtime","cloneIconWithDefaults","React","import_react","import_xui_core","import_jsx_runtime","React","import_react","import_xui_core","import_jsx_runtime","cloneIconWithDefaults","React","import_react","import_xui_core","import_jsx_runtime","children","React","index"]}