@xsolla/xui-input-copy 0.111.0 → 0.112.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/native/index.js CHANGED
@@ -264,7 +264,7 @@ var Icon = ({ children, color, size }) => {
264
264
 
265
265
  // src/InputCopy.tsx
266
266
  var import_xui_input = require("@xsolla/xui-input");
267
- var import_xui_icons = require("@xsolla/xui-icons");
267
+ var import_xui_icons_base = require("@xsolla/xui-icons-base");
268
268
  var import_xui_core = require("@xsolla/xui-core");
269
269
  var import_jsx_runtime4 = require("react/jsx-runtime");
270
270
  var InputCopy = (0, import_react2.forwardRef)(
@@ -377,7 +377,7 @@ var InputCopy = (0, import_react2.forwardRef)(
377
377
  "aria-label": isVisible ? "Hide text" : "Show text",
378
378
  "aria-pressed": isVisible,
379
379
  "data-testid": "input-copy__visibility-toggle",
380
- children: isVisible ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_xui_icons.Eye, { size: iconSize, color: iconColor }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_xui_icons.EyeOff, { size: iconSize, color: iconColor })
380
+ children: isVisible ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_xui_icons_base.Eye, { size: iconSize, color: iconColor }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_xui_icons_base.EyeOff, { size: iconSize, color: iconColor })
381
381
  }
382
382
  ) : null;
383
383
  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Box, { flexDirection: "column", gap: 8, width: "100%", testID, children: [
@@ -447,7 +447,7 @@ var InputCopy = (0, import_react2.forwardRef)(
447
447
  backgroundColor: inputColors.bgHover,
448
448
  borderColor: inputColors.borderHover
449
449
  } : void 0,
450
- children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Icon, { size: iconSize, color: copyIconColor, children: copied ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_xui_icons.Check, {}) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_xui_icons.Copy, {}) })
450
+ children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Icon, { size: iconSize, color: copyIconColor, children: copied ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_xui_icons_base.CheckCr, {}) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_xui_icons_base.Copy, {}) })
451
451
  }
452
452
  )
453
453
  ] }),
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.tsx","../../src/InputCopy.tsx","../../../primitives-native/src/Box.tsx","../../../primitives-native/src/Text.tsx","../../../primitives-native/src/Icon.tsx"],"sourcesContent":["export * from \"./InputCopy\";\n","import React, { useState, useEffect, forwardRef, useRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Icon, Text } from \"@xsolla/xui-primitives\";\nimport { Input, InputProps } from \"@xsolla/xui-input\";\nimport { Copy, Check, Eye, EyeOff } from \"@xsolla/xui-icons\";\nimport { useDesignSystem, useId } from \"@xsolla/xui-core\";\n\nexport interface InputCopyProps extends Omit<InputProps, \"onCopy\"> {\n /**\n * Callback when value is copied to clipboard\n */\n onCopy?: (value: string) => void;\n /**\n * Whether to hide the text (like a password field)\n */\n secureTextEntry?: boolean;\n /**\n * Initial visibility state when secureTextEntry is true\n */\n initialVisible?: boolean;\n /**\n * Test identifier for the component\n */\n testID?: string;\n}\n\nexport const InputCopy = forwardRef<HTMLInputElement, InputCopyProps>(\n (\n {\n value = \"\",\n onCopy,\n onChange,\n onChangeText,\n size = \"md\",\n disabled = false,\n label,\n errorMessage,\n error,\n secureTextEntry = false,\n initialVisible = false,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n ...props\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [copied, setCopied] = useState(false);\n const [isVisible, setIsVisible] = useState(\n secureTextEntry ? initialVisible : true\n );\n // Internal value state to track current input value\n const [internalValue, setInternalValue] = useState(value);\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-copy-${safeId}`;\n const labelId = `${inputId}-label`;\n const errorId = `${inputId}-error`;\n\n // Forward ref to input element\n React.useImperativeHandle(\n ref,\n () => inputRef.current as HTMLInputElement,\n []\n );\n\n // Sync internalValue with value prop when it changes\n useEffect(() => {\n setInternalValue(value);\n }, [value]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n // Border radius config matching Input component\n const borderRadiusConfig: Record<string, number> = {\n xl: 8,\n lg: 8,\n md: 8,\n sm: 4,\n xs: 4,\n };\n\n // Icon sizes matching Input component\n const iconSizeConfig: Record<string, number> = {\n xl: 18,\n lg: 18,\n md: 18,\n sm: 16,\n xs: 16,\n };\n\n const borderRadius = borderRadiusConfig[size];\n const iconSize = iconSizeConfig[size];\n\n const handleCopy = async () => {\n if (internalValue && !isDisable) {\n try {\n // Use clipboard API (works on both web and can be polyfilled for RN)\n if (\n typeof navigator !== \"undefined\" &&\n navigator.clipboard?.writeText\n ) {\n await navigator.clipboard.writeText(String(internalValue));\n } else {\n throw new Error(\"Clipboard API not available\");\n }\n setCopied(true);\n onCopy?.(String(internalValue));\n } catch {\n // Silently fail - clipboard operations can fail due to permissions or browser restrictions\n setCopied(false);\n return;\n }\n setTimeout(() => setCopied(false), 2000);\n }\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n setInternalValue(newValue);\n if (onChange) onChange(e);\n if (onChangeText) onChangeText(newValue);\n };\n\n const toggleVisibility = () => {\n if (!isDisable) {\n setIsVisible(!isVisible);\n }\n };\n\n // Icon colors - disabled icons use placeholder color per Figma spec\n const iconColor = isDisable ? inputColors.placeholder : inputColors.text;\n const copyIconColor = isDisable\n ? inputColors.placeholder\n : copied\n ? theme.colors.content.success.secondary\n : inputColors.text;\n\n // Button background color\n let buttonBgColor = inputColors.bg;\n if (isDisable) {\n buttonBgColor = inputColors.bgDisable;\n }\n\n // Button border color\n let buttonBorderColor = inputColors.border;\n if (isDisable) {\n buttonBorderColor = inputColors.borderDisable;\n }\n\n // Visibility toggle icon component\n const VisibilityToggle = secureTextEntry ? (\n <Box\n as=\"button\"\n type=\"button\"\n onPress={toggleVisibility}\n cursor={isDisable ? \"default\" : \"pointer\"}\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n aria-label={isVisible ? \"Hide text\" : \"Show text\"}\n aria-pressed={isVisible}\n data-testid=\"input-copy__visibility-toggle\"\n >\n {isVisible ? (\n <Eye size={iconSize} color={iconColor} />\n ) : (\n <EyeOff size={iconSize} color={iconColor} />\n )}\n </Box>\n ) : null;\n\n return (\n <Box flexDirection=\"column\" gap={8} width=\"100%\" testID={testID}>\n {label && (\n <Box as=\"label\" id={labelId} htmlFor={inputId}>\n <Text\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n </Box>\n )}\n <Box flexDirection=\"row\" width=\"100%\" gap={2}>\n <Box flex={1}>\n <Input\n {...props}\n ref={inputRef}\n id={inputId}\n value={internalValue}\n onChange={handleChange}\n size={size}\n disabled={disabled}\n error={isError}\n type={secureTextEntry && !isVisible ? \"password\" : \"text\"}\n iconRight={VisibilityToggle}\n borderTopLeftRadius={borderRadius}\n borderBottomLeftRadius={borderRadius}\n borderTopRightRadius={0}\n borderBottomRightRadius={0}\n aria-label={!label ? ariaLabel : undefined}\n aria-labelledby={label ? labelId : undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n aria-invalid={isError || undefined}\n // Clear label and errorMessage here as we handle them in InputCopy\n label={undefined}\n errorMessage={undefined}\n testID=\"input-copy__field\"\n />\n </Box>\n <Box\n as=\"button\"\n type=\"button\"\n width={sizeStyles.height}\n height={sizeStyles.height}\n backgroundColor={buttonBgColor}\n borderColor={buttonBorderColor}\n borderWidth={1}\n alignItems=\"center\"\n justifyContent=\"center\"\n onPress={handleCopy}\n cursor={isDisable ? \"default\" : \"pointer\"}\n disabled={isDisable}\n aria-label={copied ? \"Copied\" : \"Copy to clipboard\"}\n aria-disabled={isDisable || undefined}\n data-testid=\"input-copy__copy-button\"\n style={{\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n borderTopRightRadius: borderRadius,\n borderBottomRightRadius: borderRadius,\n background: buttonBgColor,\n opacity: 1,\n }}\n hoverStyle={\n !isDisable && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n <Icon size={iconSize} color={copyIconColor}>\n {copied ? <Check /> : <Copy />}\n </Icon>\n </Box>\n </Box>\n {isError && errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInputCopy.displayName = \"InputCopy\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n flexDirection,\n alignItems,\n justifyContent,\n position,\n top,\n bottom,\n left,\n right,\n width,\n flex,\n overflow,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n padding: padding as DimensionValue,\n paddingHorizontal: paddingHorizontal as DimensionValue,\n paddingVertical: paddingVertical as DimensionValue,\n margin: margin as DimensionValue,\n marginTop: marginTop as DimensionValue,\n marginBottom: marginBottom as DimensionValue,\n marginLeft: marginLeft as DimensionValue,\n marginRight: marginRight as DimensionValue,\n flexDirection,\n alignItems,\n justifyContent,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Destructure and drop web-only props from rest before passing to RN components\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": _ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": _ariaDisabled,\n \"aria-live\": _ariaLive,\n className,\n \"data-testid\": _dataTestId,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n if (onPress) {\n return (\n <Pressable\n onPress={onPress}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\n","import React from \"react\";\nimport { Text as RNText, TextStyle, AccessibilityRole } from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\n// Map web roles to React Native accessibility roles\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n id,\n role,\n ...props\n}) => {\n // Extract the first font name from a comma-separated list (e.g. for web-style font stacks)\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n // On native, if we don't have the custom font loaded, fall back to the system font\n if (\n resolvedFontFamily === \"Pilat Wide\" ||\n resolvedFontFamily === \"Pilat Wide Bold\" ||\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const style: TextStyle = {\n color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n };\n\n // Map role to React Native accessibilityRole\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText style={style} testID={id} accessibilityRole={accessibilityRole}>\n {children}\n </RNText>\n );\n};\n","import React from \"react\";\nimport { View, ViewStyle } from \"react-native\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Icon: React.FC<IconProps> = ({ children, color, size }) => {\n const style: ViewStyle = {\n width: typeof size === \"number\" ? size : undefined,\n height: typeof size === \"number\" ? size : undefined,\n alignItems: \"center\",\n justifyContent: \"center\",\n };\n\n // On native, we try to pass the color down to children (like Text primitives)\n // to mimic the CSS inheritance behavior of the web version.\n const childrenWithProps = React.Children.map(children, (child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n color: child.props.color || color,\n // Also pass size if child seems to be an icon that needs it\n size: child.props.size || size,\n });\n }\n return child;\n });\n\n return <View style={style}>{childrenWithProps}</View>;\n};\n"],"mappings":"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","names":["import_react","import_react_native","import_jsx_runtime","RNText","import_react_native","import_jsx_runtime","React","import_jsx_runtime","React"]}
1
+ {"version":3,"sources":["../../src/index.tsx","../../src/InputCopy.tsx","../../../primitives-native/src/Box.tsx","../../../primitives-native/src/Text.tsx","../../../primitives-native/src/Icon.tsx"],"sourcesContent":["export * from \"./InputCopy\";\n","import React, { useState, useEffect, forwardRef, useRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Icon, Text } from \"@xsolla/xui-primitives\";\nimport { Input, InputProps } from \"@xsolla/xui-input\";\nimport { Copy, CheckCr, Eye, EyeOff } from \"@xsolla/xui-icons-base\";\nimport { useDesignSystem, useId } from \"@xsolla/xui-core\";\n\nexport interface InputCopyProps extends Omit<InputProps, \"onCopy\"> {\n /**\n * Callback when value is copied to clipboard\n */\n onCopy?: (value: string) => void;\n /**\n * Whether to hide the text (like a password field)\n */\n secureTextEntry?: boolean;\n /**\n * Initial visibility state when secureTextEntry is true\n */\n initialVisible?: boolean;\n /**\n * Test identifier for the component\n */\n testID?: string;\n}\n\nexport const InputCopy = forwardRef<HTMLInputElement, InputCopyProps>(\n (\n {\n value = \"\",\n onCopy,\n onChange,\n onChangeText,\n size = \"md\",\n disabled = false,\n label,\n errorMessage,\n error,\n secureTextEntry = false,\n initialVisible = false,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n ...props\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [copied, setCopied] = useState(false);\n const [isVisible, setIsVisible] = useState(\n secureTextEntry ? initialVisible : true\n );\n // Internal value state to track current input value\n const [internalValue, setInternalValue] = useState(value);\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-copy-${safeId}`;\n const labelId = `${inputId}-label`;\n const errorId = `${inputId}-error`;\n\n // Forward ref to input element\n React.useImperativeHandle(\n ref,\n () => inputRef.current as HTMLInputElement,\n []\n );\n\n // Sync internalValue with value prop when it changes\n useEffect(() => {\n setInternalValue(value);\n }, [value]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n // Border radius config matching Input component\n const borderRadiusConfig: Record<string, number> = {\n xl: 8,\n lg: 8,\n md: 8,\n sm: 4,\n xs: 4,\n };\n\n // Icon sizes matching Input component\n const iconSizeConfig: Record<string, number> = {\n xl: 18,\n lg: 18,\n md: 18,\n sm: 16,\n xs: 16,\n };\n\n const borderRadius = borderRadiusConfig[size];\n const iconSize = iconSizeConfig[size];\n\n const handleCopy = async () => {\n if (internalValue && !isDisable) {\n try {\n // Use clipboard API (works on both web and can be polyfilled for RN)\n if (\n typeof navigator !== \"undefined\" &&\n navigator.clipboard?.writeText\n ) {\n await navigator.clipboard.writeText(String(internalValue));\n } else {\n throw new Error(\"Clipboard API not available\");\n }\n setCopied(true);\n onCopy?.(String(internalValue));\n } catch {\n // Silently fail - clipboard operations can fail due to permissions or browser restrictions\n setCopied(false);\n return;\n }\n setTimeout(() => setCopied(false), 2000);\n }\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n setInternalValue(newValue);\n if (onChange) onChange(e);\n if (onChangeText) onChangeText(newValue);\n };\n\n const toggleVisibility = () => {\n if (!isDisable) {\n setIsVisible(!isVisible);\n }\n };\n\n // Icon colors - disabled icons use placeholder color per Figma spec\n const iconColor = isDisable ? inputColors.placeholder : inputColors.text;\n const copyIconColor = isDisable\n ? inputColors.placeholder\n : copied\n ? theme.colors.content.success.secondary\n : inputColors.text;\n\n // Button background color\n let buttonBgColor = inputColors.bg;\n if (isDisable) {\n buttonBgColor = inputColors.bgDisable;\n }\n\n // Button border color\n let buttonBorderColor = inputColors.border;\n if (isDisable) {\n buttonBorderColor = inputColors.borderDisable;\n }\n\n // Visibility toggle icon component\n const VisibilityToggle = secureTextEntry ? (\n <Box\n as=\"button\"\n type=\"button\"\n onPress={toggleVisibility}\n cursor={isDisable ? \"default\" : \"pointer\"}\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n aria-label={isVisible ? \"Hide text\" : \"Show text\"}\n aria-pressed={isVisible}\n data-testid=\"input-copy__visibility-toggle\"\n >\n {isVisible ? (\n <Eye size={iconSize} color={iconColor} />\n ) : (\n <EyeOff size={iconSize} color={iconColor} />\n )}\n </Box>\n ) : null;\n\n return (\n <Box flexDirection=\"column\" gap={8} width=\"100%\" testID={testID}>\n {label && (\n <Box as=\"label\" id={labelId} htmlFor={inputId}>\n <Text\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n </Box>\n )}\n <Box flexDirection=\"row\" width=\"100%\" gap={2}>\n <Box flex={1}>\n <Input\n {...props}\n ref={inputRef}\n id={inputId}\n value={internalValue}\n onChange={handleChange}\n size={size}\n disabled={disabled}\n error={isError}\n type={secureTextEntry && !isVisible ? \"password\" : \"text\"}\n iconRight={VisibilityToggle}\n borderTopLeftRadius={borderRadius}\n borderBottomLeftRadius={borderRadius}\n borderTopRightRadius={0}\n borderBottomRightRadius={0}\n aria-label={!label ? ariaLabel : undefined}\n aria-labelledby={label ? labelId : undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n aria-invalid={isError || undefined}\n // Clear label and errorMessage here as we handle them in InputCopy\n label={undefined}\n errorMessage={undefined}\n testID=\"input-copy__field\"\n />\n </Box>\n <Box\n as=\"button\"\n type=\"button\"\n width={sizeStyles.height}\n height={sizeStyles.height}\n backgroundColor={buttonBgColor}\n borderColor={buttonBorderColor}\n borderWidth={1}\n alignItems=\"center\"\n justifyContent=\"center\"\n onPress={handleCopy}\n cursor={isDisable ? \"default\" : \"pointer\"}\n disabled={isDisable}\n aria-label={copied ? \"Copied\" : \"Copy to clipboard\"}\n aria-disabled={isDisable || undefined}\n data-testid=\"input-copy__copy-button\"\n style={{\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n borderTopRightRadius: borderRadius,\n borderBottomRightRadius: borderRadius,\n background: buttonBgColor,\n opacity: 1,\n }}\n hoverStyle={\n !isDisable && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n <Icon size={iconSize} color={copyIconColor}>\n {copied ? <CheckCr /> : <Copy />}\n </Icon>\n </Box>\n </Box>\n {isError && errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInputCopy.displayName = \"InputCopy\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n flexDirection,\n alignItems,\n justifyContent,\n position,\n top,\n bottom,\n left,\n right,\n width,\n flex,\n overflow,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n padding: padding as DimensionValue,\n paddingHorizontal: paddingHorizontal as DimensionValue,\n paddingVertical: paddingVertical as DimensionValue,\n margin: margin as DimensionValue,\n marginTop: marginTop as DimensionValue,\n marginBottom: marginBottom as DimensionValue,\n marginLeft: marginLeft as DimensionValue,\n marginRight: marginRight as DimensionValue,\n flexDirection,\n alignItems,\n justifyContent,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Destructure and drop web-only props from rest before passing to RN components\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": _ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": _ariaDisabled,\n \"aria-live\": _ariaLive,\n className,\n \"data-testid\": _dataTestId,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n if (onPress) {\n return (\n <Pressable\n onPress={onPress}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\n","import React from \"react\";\nimport { Text as RNText, TextStyle, AccessibilityRole } from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\n// Map web roles to React Native accessibility roles\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n id,\n role,\n ...props\n}) => {\n // Extract the first font name from a comma-separated list (e.g. for web-style font stacks)\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n // On native, if we don't have the custom font loaded, fall back to the system font\n if (\n resolvedFontFamily === \"Pilat Wide\" ||\n resolvedFontFamily === \"Pilat Wide Bold\" ||\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const style: TextStyle = {\n color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n };\n\n // Map role to React Native accessibilityRole\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText style={style} testID={id} accessibilityRole={accessibilityRole}>\n {children}\n </RNText>\n );\n};\n","import React from \"react\";\nimport { View, ViewStyle } from \"react-native\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Icon: React.FC<IconProps> = ({ children, color, size }) => {\n const style: ViewStyle = {\n width: typeof size === \"number\" ? size : undefined,\n height: typeof size === \"number\" ? size : undefined,\n alignItems: \"center\",\n justifyContent: \"center\",\n };\n\n // On native, we try to pass the color down to children (like Text primitives)\n // to mimic the CSS inheritance behavior of the web version.\n const childrenWithProps = React.Children.map(children, (child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n color: child.props.color || color,\n // Also pass size if child seems to be an icon that needs it\n size: child.props.size || size,\n });\n }\n return child;\n });\n\n return <View style={style}>{childrenWithProps}</View>;\n};\n"],"mappings":"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","names":["import_react","import_react_native","import_jsx_runtime","RNText","import_react_native","import_jsx_runtime","React","import_jsx_runtime","React"]}
package/native/index.mjs CHANGED
@@ -232,7 +232,7 @@ var Icon = ({ children, color, size }) => {
232
232
 
233
233
  // src/InputCopy.tsx
234
234
  import { Input } from "@xsolla/xui-input";
235
- import { Copy, Check, Eye, EyeOff } from "@xsolla/xui-icons";
235
+ import { Copy, CheckCr, Eye, EyeOff } from "@xsolla/xui-icons-base";
236
236
  import { useDesignSystem, useId } from "@xsolla/xui-core";
237
237
  import { jsx as jsx4, jsxs } from "react/jsx-runtime";
238
238
  var InputCopy = forwardRef(
@@ -415,7 +415,7 @@ var InputCopy = forwardRef(
415
415
  backgroundColor: inputColors.bgHover,
416
416
  borderColor: inputColors.borderHover
417
417
  } : void 0,
418
- children: /* @__PURE__ */ jsx4(Icon, { size: iconSize, color: copyIconColor, children: copied ? /* @__PURE__ */ jsx4(Check, {}) : /* @__PURE__ */ jsx4(Copy, {}) })
418
+ children: /* @__PURE__ */ jsx4(Icon, { size: iconSize, color: copyIconColor, children: copied ? /* @__PURE__ */ jsx4(CheckCr, {}) : /* @__PURE__ */ jsx4(Copy, {}) })
419
419
  }
420
420
  )
421
421
  ] }),
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/InputCopy.tsx","../../../primitives-native/src/Box.tsx","../../../primitives-native/src/Text.tsx","../../../primitives-native/src/Icon.tsx"],"sourcesContent":["import React, { useState, useEffect, forwardRef, useRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Icon, Text } from \"@xsolla/xui-primitives\";\nimport { Input, InputProps } from \"@xsolla/xui-input\";\nimport { Copy, Check, Eye, EyeOff } from \"@xsolla/xui-icons\";\nimport { useDesignSystem, useId } from \"@xsolla/xui-core\";\n\nexport interface InputCopyProps extends Omit<InputProps, \"onCopy\"> {\n /**\n * Callback when value is copied to clipboard\n */\n onCopy?: (value: string) => void;\n /**\n * Whether to hide the text (like a password field)\n */\n secureTextEntry?: boolean;\n /**\n * Initial visibility state when secureTextEntry is true\n */\n initialVisible?: boolean;\n /**\n * Test identifier for the component\n */\n testID?: string;\n}\n\nexport const InputCopy = forwardRef<HTMLInputElement, InputCopyProps>(\n (\n {\n value = \"\",\n onCopy,\n onChange,\n onChangeText,\n size = \"md\",\n disabled = false,\n label,\n errorMessage,\n error,\n secureTextEntry = false,\n initialVisible = false,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n ...props\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [copied, setCopied] = useState(false);\n const [isVisible, setIsVisible] = useState(\n secureTextEntry ? initialVisible : true\n );\n // Internal value state to track current input value\n const [internalValue, setInternalValue] = useState(value);\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-copy-${safeId}`;\n const labelId = `${inputId}-label`;\n const errorId = `${inputId}-error`;\n\n // Forward ref to input element\n React.useImperativeHandle(\n ref,\n () => inputRef.current as HTMLInputElement,\n []\n );\n\n // Sync internalValue with value prop when it changes\n useEffect(() => {\n setInternalValue(value);\n }, [value]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n // Border radius config matching Input component\n const borderRadiusConfig: Record<string, number> = {\n xl: 8,\n lg: 8,\n md: 8,\n sm: 4,\n xs: 4,\n };\n\n // Icon sizes matching Input component\n const iconSizeConfig: Record<string, number> = {\n xl: 18,\n lg: 18,\n md: 18,\n sm: 16,\n xs: 16,\n };\n\n const borderRadius = borderRadiusConfig[size];\n const iconSize = iconSizeConfig[size];\n\n const handleCopy = async () => {\n if (internalValue && !isDisable) {\n try {\n // Use clipboard API (works on both web and can be polyfilled for RN)\n if (\n typeof navigator !== \"undefined\" &&\n navigator.clipboard?.writeText\n ) {\n await navigator.clipboard.writeText(String(internalValue));\n } else {\n throw new Error(\"Clipboard API not available\");\n }\n setCopied(true);\n onCopy?.(String(internalValue));\n } catch {\n // Silently fail - clipboard operations can fail due to permissions or browser restrictions\n setCopied(false);\n return;\n }\n setTimeout(() => setCopied(false), 2000);\n }\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n setInternalValue(newValue);\n if (onChange) onChange(e);\n if (onChangeText) onChangeText(newValue);\n };\n\n const toggleVisibility = () => {\n if (!isDisable) {\n setIsVisible(!isVisible);\n }\n };\n\n // Icon colors - disabled icons use placeholder color per Figma spec\n const iconColor = isDisable ? inputColors.placeholder : inputColors.text;\n const copyIconColor = isDisable\n ? inputColors.placeholder\n : copied\n ? theme.colors.content.success.secondary\n : inputColors.text;\n\n // Button background color\n let buttonBgColor = inputColors.bg;\n if (isDisable) {\n buttonBgColor = inputColors.bgDisable;\n }\n\n // Button border color\n let buttonBorderColor = inputColors.border;\n if (isDisable) {\n buttonBorderColor = inputColors.borderDisable;\n }\n\n // Visibility toggle icon component\n const VisibilityToggle = secureTextEntry ? (\n <Box\n as=\"button\"\n type=\"button\"\n onPress={toggleVisibility}\n cursor={isDisable ? \"default\" : \"pointer\"}\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n aria-label={isVisible ? \"Hide text\" : \"Show text\"}\n aria-pressed={isVisible}\n data-testid=\"input-copy__visibility-toggle\"\n >\n {isVisible ? (\n <Eye size={iconSize} color={iconColor} />\n ) : (\n <EyeOff size={iconSize} color={iconColor} />\n )}\n </Box>\n ) : null;\n\n return (\n <Box flexDirection=\"column\" gap={8} width=\"100%\" testID={testID}>\n {label && (\n <Box as=\"label\" id={labelId} htmlFor={inputId}>\n <Text\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n </Box>\n )}\n <Box flexDirection=\"row\" width=\"100%\" gap={2}>\n <Box flex={1}>\n <Input\n {...props}\n ref={inputRef}\n id={inputId}\n value={internalValue}\n onChange={handleChange}\n size={size}\n disabled={disabled}\n error={isError}\n type={secureTextEntry && !isVisible ? \"password\" : \"text\"}\n iconRight={VisibilityToggle}\n borderTopLeftRadius={borderRadius}\n borderBottomLeftRadius={borderRadius}\n borderTopRightRadius={0}\n borderBottomRightRadius={0}\n aria-label={!label ? ariaLabel : undefined}\n aria-labelledby={label ? labelId : undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n aria-invalid={isError || undefined}\n // Clear label and errorMessage here as we handle them in InputCopy\n label={undefined}\n errorMessage={undefined}\n testID=\"input-copy__field\"\n />\n </Box>\n <Box\n as=\"button\"\n type=\"button\"\n width={sizeStyles.height}\n height={sizeStyles.height}\n backgroundColor={buttonBgColor}\n borderColor={buttonBorderColor}\n borderWidth={1}\n alignItems=\"center\"\n justifyContent=\"center\"\n onPress={handleCopy}\n cursor={isDisable ? \"default\" : \"pointer\"}\n disabled={isDisable}\n aria-label={copied ? \"Copied\" : \"Copy to clipboard\"}\n aria-disabled={isDisable || undefined}\n data-testid=\"input-copy__copy-button\"\n style={{\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n borderTopRightRadius: borderRadius,\n borderBottomRightRadius: borderRadius,\n background: buttonBgColor,\n opacity: 1,\n }}\n hoverStyle={\n !isDisable && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n <Icon size={iconSize} color={copyIconColor}>\n {copied ? <Check /> : <Copy />}\n </Icon>\n </Box>\n </Box>\n {isError && errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInputCopy.displayName = \"InputCopy\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n flexDirection,\n alignItems,\n justifyContent,\n position,\n top,\n bottom,\n left,\n right,\n width,\n flex,\n overflow,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n padding: padding as DimensionValue,\n paddingHorizontal: paddingHorizontal as DimensionValue,\n paddingVertical: paddingVertical as DimensionValue,\n margin: margin as DimensionValue,\n marginTop: marginTop as DimensionValue,\n marginBottom: marginBottom as DimensionValue,\n marginLeft: marginLeft as DimensionValue,\n marginRight: marginRight as DimensionValue,\n flexDirection,\n alignItems,\n justifyContent,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Destructure and drop web-only props from rest before passing to RN components\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": _ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": _ariaDisabled,\n \"aria-live\": _ariaLive,\n className,\n \"data-testid\": _dataTestId,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n if (onPress) {\n return (\n <Pressable\n onPress={onPress}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\n","import React from \"react\";\nimport { Text as RNText, TextStyle, AccessibilityRole } from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\n// Map web roles to React Native accessibility roles\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n id,\n role,\n ...props\n}) => {\n // Extract the first font name from a comma-separated list (e.g. for web-style font stacks)\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n // On native, if we don't have the custom font loaded, fall back to the system font\n if (\n resolvedFontFamily === \"Pilat Wide\" ||\n resolvedFontFamily === \"Pilat Wide Bold\" ||\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const style: TextStyle = {\n color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n };\n\n // Map role to React Native accessibilityRole\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText style={style} testID={id} accessibilityRole={accessibilityRole}>\n {children}\n </RNText>\n );\n};\n","import React from \"react\";\nimport { View, ViewStyle } from \"react-native\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Icon: React.FC<IconProps> = ({ children, color, size }) => {\n const style: ViewStyle = {\n width: typeof size === \"number\" ? size : undefined,\n height: typeof size === \"number\" ? size : undefined,\n alignItems: \"center\",\n justifyContent: \"center\",\n };\n\n // On native, we try to pass the color down to children (like Text primitives)\n // to mimic the CSS inheritance behavior of the web version.\n const childrenWithProps = React.Children.map(children, (child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n color: child.props.color || color,\n // Also pass size if child seems to be an icon that needs it\n size: child.props.size || size,\n });\n }\n return child;\n });\n\n return <View style={style}>{childrenWithProps}</View>;\n};\n"],"mappings":"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","names":["React","jsx","View","jsx","jsx","React"]}
1
+ {"version":3,"sources":["../../src/InputCopy.tsx","../../../primitives-native/src/Box.tsx","../../../primitives-native/src/Text.tsx","../../../primitives-native/src/Icon.tsx"],"sourcesContent":["import React, { useState, useEffect, forwardRef, useRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Icon, Text } from \"@xsolla/xui-primitives\";\nimport { Input, InputProps } from \"@xsolla/xui-input\";\nimport { Copy, CheckCr, Eye, EyeOff } from \"@xsolla/xui-icons-base\";\nimport { useDesignSystem, useId } from \"@xsolla/xui-core\";\n\nexport interface InputCopyProps extends Omit<InputProps, \"onCopy\"> {\n /**\n * Callback when value is copied to clipboard\n */\n onCopy?: (value: string) => void;\n /**\n * Whether to hide the text (like a password field)\n */\n secureTextEntry?: boolean;\n /**\n * Initial visibility state when secureTextEntry is true\n */\n initialVisible?: boolean;\n /**\n * Test identifier for the component\n */\n testID?: string;\n}\n\nexport const InputCopy = forwardRef<HTMLInputElement, InputCopyProps>(\n (\n {\n value = \"\",\n onCopy,\n onChange,\n onChangeText,\n size = \"md\",\n disabled = false,\n label,\n errorMessage,\n error,\n secureTextEntry = false,\n initialVisible = false,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n ...props\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [copied, setCopied] = useState(false);\n const [isVisible, setIsVisible] = useState(\n secureTextEntry ? initialVisible : true\n );\n // Internal value state to track current input value\n const [internalValue, setInternalValue] = useState(value);\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-copy-${safeId}`;\n const labelId = `${inputId}-label`;\n const errorId = `${inputId}-error`;\n\n // Forward ref to input element\n React.useImperativeHandle(\n ref,\n () => inputRef.current as HTMLInputElement,\n []\n );\n\n // Sync internalValue with value prop when it changes\n useEffect(() => {\n setInternalValue(value);\n }, [value]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n // Border radius config matching Input component\n const borderRadiusConfig: Record<string, number> = {\n xl: 8,\n lg: 8,\n md: 8,\n sm: 4,\n xs: 4,\n };\n\n // Icon sizes matching Input component\n const iconSizeConfig: Record<string, number> = {\n xl: 18,\n lg: 18,\n md: 18,\n sm: 16,\n xs: 16,\n };\n\n const borderRadius = borderRadiusConfig[size];\n const iconSize = iconSizeConfig[size];\n\n const handleCopy = async () => {\n if (internalValue && !isDisable) {\n try {\n // Use clipboard API (works on both web and can be polyfilled for RN)\n if (\n typeof navigator !== \"undefined\" &&\n navigator.clipboard?.writeText\n ) {\n await navigator.clipboard.writeText(String(internalValue));\n } else {\n throw new Error(\"Clipboard API not available\");\n }\n setCopied(true);\n onCopy?.(String(internalValue));\n } catch {\n // Silently fail - clipboard operations can fail due to permissions or browser restrictions\n setCopied(false);\n return;\n }\n setTimeout(() => setCopied(false), 2000);\n }\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n setInternalValue(newValue);\n if (onChange) onChange(e);\n if (onChangeText) onChangeText(newValue);\n };\n\n const toggleVisibility = () => {\n if (!isDisable) {\n setIsVisible(!isVisible);\n }\n };\n\n // Icon colors - disabled icons use placeholder color per Figma spec\n const iconColor = isDisable ? inputColors.placeholder : inputColors.text;\n const copyIconColor = isDisable\n ? inputColors.placeholder\n : copied\n ? theme.colors.content.success.secondary\n : inputColors.text;\n\n // Button background color\n let buttonBgColor = inputColors.bg;\n if (isDisable) {\n buttonBgColor = inputColors.bgDisable;\n }\n\n // Button border color\n let buttonBorderColor = inputColors.border;\n if (isDisable) {\n buttonBorderColor = inputColors.borderDisable;\n }\n\n // Visibility toggle icon component\n const VisibilityToggle = secureTextEntry ? (\n <Box\n as=\"button\"\n type=\"button\"\n onPress={toggleVisibility}\n cursor={isDisable ? \"default\" : \"pointer\"}\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n aria-label={isVisible ? \"Hide text\" : \"Show text\"}\n aria-pressed={isVisible}\n data-testid=\"input-copy__visibility-toggle\"\n >\n {isVisible ? (\n <Eye size={iconSize} color={iconColor} />\n ) : (\n <EyeOff size={iconSize} color={iconColor} />\n )}\n </Box>\n ) : null;\n\n return (\n <Box flexDirection=\"column\" gap={8} width=\"100%\" testID={testID}>\n {label && (\n <Box as=\"label\" id={labelId} htmlFor={inputId}>\n <Text\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n </Box>\n )}\n <Box flexDirection=\"row\" width=\"100%\" gap={2}>\n <Box flex={1}>\n <Input\n {...props}\n ref={inputRef}\n id={inputId}\n value={internalValue}\n onChange={handleChange}\n size={size}\n disabled={disabled}\n error={isError}\n type={secureTextEntry && !isVisible ? \"password\" : \"text\"}\n iconRight={VisibilityToggle}\n borderTopLeftRadius={borderRadius}\n borderBottomLeftRadius={borderRadius}\n borderTopRightRadius={0}\n borderBottomRightRadius={0}\n aria-label={!label ? ariaLabel : undefined}\n aria-labelledby={label ? labelId : undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n aria-invalid={isError || undefined}\n // Clear label and errorMessage here as we handle them in InputCopy\n label={undefined}\n errorMessage={undefined}\n testID=\"input-copy__field\"\n />\n </Box>\n <Box\n as=\"button\"\n type=\"button\"\n width={sizeStyles.height}\n height={sizeStyles.height}\n backgroundColor={buttonBgColor}\n borderColor={buttonBorderColor}\n borderWidth={1}\n alignItems=\"center\"\n justifyContent=\"center\"\n onPress={handleCopy}\n cursor={isDisable ? \"default\" : \"pointer\"}\n disabled={isDisable}\n aria-label={copied ? \"Copied\" : \"Copy to clipboard\"}\n aria-disabled={isDisable || undefined}\n data-testid=\"input-copy__copy-button\"\n style={{\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n borderTopRightRadius: borderRadius,\n borderBottomRightRadius: borderRadius,\n background: buttonBgColor,\n opacity: 1,\n }}\n hoverStyle={\n !isDisable && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n <Icon size={iconSize} color={copyIconColor}>\n {copied ? <CheckCr /> : <Copy />}\n </Icon>\n </Box>\n </Box>\n {isError && errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInputCopy.displayName = \"InputCopy\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n flexDirection,\n alignItems,\n justifyContent,\n position,\n top,\n bottom,\n left,\n right,\n width,\n flex,\n overflow,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n padding: padding as DimensionValue,\n paddingHorizontal: paddingHorizontal as DimensionValue,\n paddingVertical: paddingVertical as DimensionValue,\n margin: margin as DimensionValue,\n marginTop: marginTop as DimensionValue,\n marginBottom: marginBottom as DimensionValue,\n marginLeft: marginLeft as DimensionValue,\n marginRight: marginRight as DimensionValue,\n flexDirection,\n alignItems,\n justifyContent,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Destructure and drop web-only props from rest before passing to RN components\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": _ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": _ariaDisabled,\n \"aria-live\": _ariaLive,\n className,\n \"data-testid\": _dataTestId,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n if (onPress) {\n return (\n <Pressable\n onPress={onPress}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\n","import React from \"react\";\nimport { Text as RNText, TextStyle, AccessibilityRole } from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\n// Map web roles to React Native accessibility roles\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n id,\n role,\n ...props\n}) => {\n // Extract the first font name from a comma-separated list (e.g. for web-style font stacks)\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n // On native, if we don't have the custom font loaded, fall back to the system font\n if (\n resolvedFontFamily === \"Pilat Wide\" ||\n resolvedFontFamily === \"Pilat Wide Bold\" ||\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const style: TextStyle = {\n color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n };\n\n // Map role to React Native accessibilityRole\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText style={style} testID={id} accessibilityRole={accessibilityRole}>\n {children}\n </RNText>\n );\n};\n","import React from \"react\";\nimport { View, ViewStyle } from \"react-native\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Icon: React.FC<IconProps> = ({ children, color, size }) => {\n const style: ViewStyle = {\n width: typeof size === \"number\" ? size : undefined,\n height: typeof size === \"number\" ? size : undefined,\n alignItems: \"center\",\n justifyContent: \"center\",\n };\n\n // On native, we try to pass the color down to children (like Text primitives)\n // to mimic the CSS inheritance behavior of the web version.\n const childrenWithProps = React.Children.map(children, (child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n color: child.props.color || color,\n // Also pass size if child seems to be an icon that needs it\n size: child.props.size || size,\n });\n }\n return child;\n });\n\n return <View style={style}>{childrenWithProps}</View>;\n};\n"],"mappings":"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","names":["React","jsx","View","jsx","jsx","React"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@xsolla/xui-input-copy",
3
- "version": "0.111.0",
3
+ "version": "0.112.0",
4
4
  "main": "./web/index.js",
5
5
  "module": "./web/index.mjs",
6
6
  "types": "./web/index.d.ts",
@@ -13,11 +13,11 @@
13
13
  "test:coverage": "vitest run --coverage"
14
14
  },
15
15
  "dependencies": {
16
- "@xsolla/xui-button": "0.111.0",
17
- "@xsolla/xui-core": "0.111.0",
18
- "@xsolla/xui-icons": "0.111.0",
19
- "@xsolla/xui-input": "0.111.0",
20
- "@xsolla/xui-primitives-core": "0.111.0"
16
+ "@xsolla/xui-button": "0.112.0",
17
+ "@xsolla/xui-core": "0.112.0",
18
+ "@xsolla/xui-icons-base": "0.112.0",
19
+ "@xsolla/xui-input": "0.112.0",
20
+ "@xsolla/xui-primitives-core": "0.112.0"
21
21
  },
22
22
  "peerDependencies": {
23
23
  "react": ">=16.8.0",
package/web/index.js CHANGED
@@ -262,7 +262,7 @@ var Icon = ({ children, ...props }) => {
262
262
 
263
263
  // src/InputCopy.tsx
264
264
  var import_xui_input = require("@xsolla/xui-input");
265
- var import_xui_icons = require("@xsolla/xui-icons");
265
+ var import_xui_icons_base = require("@xsolla/xui-icons-base");
266
266
  var import_xui_core = require("@xsolla/xui-core");
267
267
  var import_jsx_runtime4 = require("react/jsx-runtime");
268
268
  var InputCopy = (0, import_react2.forwardRef)(
@@ -375,7 +375,7 @@ var InputCopy = (0, import_react2.forwardRef)(
375
375
  "aria-label": isVisible ? "Hide text" : "Show text",
376
376
  "aria-pressed": isVisible,
377
377
  "data-testid": "input-copy__visibility-toggle",
378
- children: isVisible ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_xui_icons.Eye, { size: iconSize, color: iconColor }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_xui_icons.EyeOff, { size: iconSize, color: iconColor })
378
+ children: isVisible ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_xui_icons_base.Eye, { size: iconSize, color: iconColor }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_xui_icons_base.EyeOff, { size: iconSize, color: iconColor })
379
379
  }
380
380
  ) : null;
381
381
  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Box, { flexDirection: "column", gap: 8, width: "100%", testID, children: [
@@ -445,7 +445,7 @@ var InputCopy = (0, import_react2.forwardRef)(
445
445
  backgroundColor: inputColors.bgHover,
446
446
  borderColor: inputColors.borderHover
447
447
  } : void 0,
448
- children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Icon, { size: iconSize, color: copyIconColor, children: copied ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_xui_icons.Check, {}) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_xui_icons.Copy, {}) })
448
+ children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Icon, { size: iconSize, color: copyIconColor, children: copied ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_xui_icons_base.CheckCr, {}) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_xui_icons_base.Copy, {}) })
449
449
  }
450
450
  )
451
451
  ] }),
package/web/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.tsx","../../src/InputCopy.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx","../../../primitives-web/src/Icon.tsx"],"sourcesContent":["export * from \"./InputCopy\";\n","import React, { useState, useEffect, forwardRef, useRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Icon, Text } from \"@xsolla/xui-primitives\";\nimport { Input, InputProps } from \"@xsolla/xui-input\";\nimport { Copy, Check, Eye, EyeOff } from \"@xsolla/xui-icons\";\nimport { useDesignSystem, useId } from \"@xsolla/xui-core\";\n\nexport interface InputCopyProps extends Omit<InputProps, \"onCopy\"> {\n /**\n * Callback when value is copied to clipboard\n */\n onCopy?: (value: string) => void;\n /**\n * Whether to hide the text (like a password field)\n */\n secureTextEntry?: boolean;\n /**\n * Initial visibility state when secureTextEntry is true\n */\n initialVisible?: boolean;\n /**\n * Test identifier for the component\n */\n testID?: string;\n}\n\nexport const InputCopy = forwardRef<HTMLInputElement, InputCopyProps>(\n (\n {\n value = \"\",\n onCopy,\n onChange,\n onChangeText,\n size = \"md\",\n disabled = false,\n label,\n errorMessage,\n error,\n secureTextEntry = false,\n initialVisible = false,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n ...props\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [copied, setCopied] = useState(false);\n const [isVisible, setIsVisible] = useState(\n secureTextEntry ? initialVisible : true\n );\n // Internal value state to track current input value\n const [internalValue, setInternalValue] = useState(value);\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-copy-${safeId}`;\n const labelId = `${inputId}-label`;\n const errorId = `${inputId}-error`;\n\n // Forward ref to input element\n React.useImperativeHandle(\n ref,\n () => inputRef.current as HTMLInputElement,\n []\n );\n\n // Sync internalValue with value prop when it changes\n useEffect(() => {\n setInternalValue(value);\n }, [value]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n // Border radius config matching Input component\n const borderRadiusConfig: Record<string, number> = {\n xl: 8,\n lg: 8,\n md: 8,\n sm: 4,\n xs: 4,\n };\n\n // Icon sizes matching Input component\n const iconSizeConfig: Record<string, number> = {\n xl: 18,\n lg: 18,\n md: 18,\n sm: 16,\n xs: 16,\n };\n\n const borderRadius = borderRadiusConfig[size];\n const iconSize = iconSizeConfig[size];\n\n const handleCopy = async () => {\n if (internalValue && !isDisable) {\n try {\n // Use clipboard API (works on both web and can be polyfilled for RN)\n if (\n typeof navigator !== \"undefined\" &&\n navigator.clipboard?.writeText\n ) {\n await navigator.clipboard.writeText(String(internalValue));\n } else {\n throw new Error(\"Clipboard API not available\");\n }\n setCopied(true);\n onCopy?.(String(internalValue));\n } catch {\n // Silently fail - clipboard operations can fail due to permissions or browser restrictions\n setCopied(false);\n return;\n }\n setTimeout(() => setCopied(false), 2000);\n }\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n setInternalValue(newValue);\n if (onChange) onChange(e);\n if (onChangeText) onChangeText(newValue);\n };\n\n const toggleVisibility = () => {\n if (!isDisable) {\n setIsVisible(!isVisible);\n }\n };\n\n // Icon colors - disabled icons use placeholder color per Figma spec\n const iconColor = isDisable ? inputColors.placeholder : inputColors.text;\n const copyIconColor = isDisable\n ? inputColors.placeholder\n : copied\n ? theme.colors.content.success.secondary\n : inputColors.text;\n\n // Button background color\n let buttonBgColor = inputColors.bg;\n if (isDisable) {\n buttonBgColor = inputColors.bgDisable;\n }\n\n // Button border color\n let buttonBorderColor = inputColors.border;\n if (isDisable) {\n buttonBorderColor = inputColors.borderDisable;\n }\n\n // Visibility toggle icon component\n const VisibilityToggle = secureTextEntry ? (\n <Box\n as=\"button\"\n type=\"button\"\n onPress={toggleVisibility}\n cursor={isDisable ? \"default\" : \"pointer\"}\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n aria-label={isVisible ? \"Hide text\" : \"Show text\"}\n aria-pressed={isVisible}\n data-testid=\"input-copy__visibility-toggle\"\n >\n {isVisible ? (\n <Eye size={iconSize} color={iconColor} />\n ) : (\n <EyeOff size={iconSize} color={iconColor} />\n )}\n </Box>\n ) : null;\n\n return (\n <Box flexDirection=\"column\" gap={8} width=\"100%\" testID={testID}>\n {label && (\n <Box as=\"label\" id={labelId} htmlFor={inputId}>\n <Text\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n </Box>\n )}\n <Box flexDirection=\"row\" width=\"100%\" gap={2}>\n <Box flex={1}>\n <Input\n {...props}\n ref={inputRef}\n id={inputId}\n value={internalValue}\n onChange={handleChange}\n size={size}\n disabled={disabled}\n error={isError}\n type={secureTextEntry && !isVisible ? \"password\" : \"text\"}\n iconRight={VisibilityToggle}\n borderTopLeftRadius={borderRadius}\n borderBottomLeftRadius={borderRadius}\n borderTopRightRadius={0}\n borderBottomRightRadius={0}\n aria-label={!label ? ariaLabel : undefined}\n aria-labelledby={label ? labelId : undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n aria-invalid={isError || undefined}\n // Clear label and errorMessage here as we handle them in InputCopy\n label={undefined}\n errorMessage={undefined}\n testID=\"input-copy__field\"\n />\n </Box>\n <Box\n as=\"button\"\n type=\"button\"\n width={sizeStyles.height}\n height={sizeStyles.height}\n backgroundColor={buttonBgColor}\n borderColor={buttonBorderColor}\n borderWidth={1}\n alignItems=\"center\"\n justifyContent=\"center\"\n onPress={handleCopy}\n cursor={isDisable ? \"default\" : \"pointer\"}\n disabled={isDisable}\n aria-label={copied ? \"Copied\" : \"Copy to clipboard\"}\n aria-disabled={isDisable || undefined}\n data-testid=\"input-copy__copy-button\"\n style={{\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n borderTopRightRadius: borderRadius,\n borderBottomRightRadius: borderRadius,\n background: buttonBgColor,\n opacity: 1,\n }}\n hoverStyle={\n !isDisable && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n <Icon size={iconSize} color={copyIconColor}>\n {copied ? <Check /> : <Copy />}\n </Icon>\n </Box>\n </Box>\n {isError && errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInputCopy.displayName = \"InputCopy\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledBox = styled.div<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\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 overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (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 type,\n disabled,\n id,\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 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 }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n as={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 {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledText = styled.span<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledIcon = styled.div<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 svg {\n width: 100%;\n height: 100%;\n fill: none;\n stroke: currentColor;\n }\n`;\n\nexport const Icon: React.FC<IconProps> = ({ children, ...props }) => {\n return <StyledIcon {...props}>{children}</StyledIcon>;\n};\n"],"mappings":"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","names":["import_react","styled","React","import_styled_components","import_jsx_runtime","styled","import_styled_components","import_jsx_runtime","styled","import_jsx_runtime","React"]}
1
+ {"version":3,"sources":["../../src/index.tsx","../../src/InputCopy.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx","../../../primitives-web/src/Icon.tsx"],"sourcesContent":["export * from \"./InputCopy\";\n","import React, { useState, useEffect, forwardRef, useRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Icon, Text } from \"@xsolla/xui-primitives\";\nimport { Input, InputProps } from \"@xsolla/xui-input\";\nimport { Copy, CheckCr, Eye, EyeOff } from \"@xsolla/xui-icons-base\";\nimport { useDesignSystem, useId } from \"@xsolla/xui-core\";\n\nexport interface InputCopyProps extends Omit<InputProps, \"onCopy\"> {\n /**\n * Callback when value is copied to clipboard\n */\n onCopy?: (value: string) => void;\n /**\n * Whether to hide the text (like a password field)\n */\n secureTextEntry?: boolean;\n /**\n * Initial visibility state when secureTextEntry is true\n */\n initialVisible?: boolean;\n /**\n * Test identifier for the component\n */\n testID?: string;\n}\n\nexport const InputCopy = forwardRef<HTMLInputElement, InputCopyProps>(\n (\n {\n value = \"\",\n onCopy,\n onChange,\n onChangeText,\n size = \"md\",\n disabled = false,\n label,\n errorMessage,\n error,\n secureTextEntry = false,\n initialVisible = false,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n ...props\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [copied, setCopied] = useState(false);\n const [isVisible, setIsVisible] = useState(\n secureTextEntry ? initialVisible : true\n );\n // Internal value state to track current input value\n const [internalValue, setInternalValue] = useState(value);\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-copy-${safeId}`;\n const labelId = `${inputId}-label`;\n const errorId = `${inputId}-error`;\n\n // Forward ref to input element\n React.useImperativeHandle(\n ref,\n () => inputRef.current as HTMLInputElement,\n []\n );\n\n // Sync internalValue with value prop when it changes\n useEffect(() => {\n setInternalValue(value);\n }, [value]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n // Border radius config matching Input component\n const borderRadiusConfig: Record<string, number> = {\n xl: 8,\n lg: 8,\n md: 8,\n sm: 4,\n xs: 4,\n };\n\n // Icon sizes matching Input component\n const iconSizeConfig: Record<string, number> = {\n xl: 18,\n lg: 18,\n md: 18,\n sm: 16,\n xs: 16,\n };\n\n const borderRadius = borderRadiusConfig[size];\n const iconSize = iconSizeConfig[size];\n\n const handleCopy = async () => {\n if (internalValue && !isDisable) {\n try {\n // Use clipboard API (works on both web and can be polyfilled for RN)\n if (\n typeof navigator !== \"undefined\" &&\n navigator.clipboard?.writeText\n ) {\n await navigator.clipboard.writeText(String(internalValue));\n } else {\n throw new Error(\"Clipboard API not available\");\n }\n setCopied(true);\n onCopy?.(String(internalValue));\n } catch {\n // Silently fail - clipboard operations can fail due to permissions or browser restrictions\n setCopied(false);\n return;\n }\n setTimeout(() => setCopied(false), 2000);\n }\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n setInternalValue(newValue);\n if (onChange) onChange(e);\n if (onChangeText) onChangeText(newValue);\n };\n\n const toggleVisibility = () => {\n if (!isDisable) {\n setIsVisible(!isVisible);\n }\n };\n\n // Icon colors - disabled icons use placeholder color per Figma spec\n const iconColor = isDisable ? inputColors.placeholder : inputColors.text;\n const copyIconColor = isDisable\n ? inputColors.placeholder\n : copied\n ? theme.colors.content.success.secondary\n : inputColors.text;\n\n // Button background color\n let buttonBgColor = inputColors.bg;\n if (isDisable) {\n buttonBgColor = inputColors.bgDisable;\n }\n\n // Button border color\n let buttonBorderColor = inputColors.border;\n if (isDisable) {\n buttonBorderColor = inputColors.borderDisable;\n }\n\n // Visibility toggle icon component\n const VisibilityToggle = secureTextEntry ? (\n <Box\n as=\"button\"\n type=\"button\"\n onPress={toggleVisibility}\n cursor={isDisable ? \"default\" : \"pointer\"}\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n aria-label={isVisible ? \"Hide text\" : \"Show text\"}\n aria-pressed={isVisible}\n data-testid=\"input-copy__visibility-toggle\"\n >\n {isVisible ? (\n <Eye size={iconSize} color={iconColor} />\n ) : (\n <EyeOff size={iconSize} color={iconColor} />\n )}\n </Box>\n ) : null;\n\n return (\n <Box flexDirection=\"column\" gap={8} width=\"100%\" testID={testID}>\n {label && (\n <Box as=\"label\" id={labelId} htmlFor={inputId}>\n <Text\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n </Box>\n )}\n <Box flexDirection=\"row\" width=\"100%\" gap={2}>\n <Box flex={1}>\n <Input\n {...props}\n ref={inputRef}\n id={inputId}\n value={internalValue}\n onChange={handleChange}\n size={size}\n disabled={disabled}\n error={isError}\n type={secureTextEntry && !isVisible ? \"password\" : \"text\"}\n iconRight={VisibilityToggle}\n borderTopLeftRadius={borderRadius}\n borderBottomLeftRadius={borderRadius}\n borderTopRightRadius={0}\n borderBottomRightRadius={0}\n aria-label={!label ? ariaLabel : undefined}\n aria-labelledby={label ? labelId : undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n aria-invalid={isError || undefined}\n // Clear label and errorMessage here as we handle them in InputCopy\n label={undefined}\n errorMessage={undefined}\n testID=\"input-copy__field\"\n />\n </Box>\n <Box\n as=\"button\"\n type=\"button\"\n width={sizeStyles.height}\n height={sizeStyles.height}\n backgroundColor={buttonBgColor}\n borderColor={buttonBorderColor}\n borderWidth={1}\n alignItems=\"center\"\n justifyContent=\"center\"\n onPress={handleCopy}\n cursor={isDisable ? \"default\" : \"pointer\"}\n disabled={isDisable}\n aria-label={copied ? \"Copied\" : \"Copy to clipboard\"}\n aria-disabled={isDisable || undefined}\n data-testid=\"input-copy__copy-button\"\n style={{\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n borderTopRightRadius: borderRadius,\n borderBottomRightRadius: borderRadius,\n background: buttonBgColor,\n opacity: 1,\n }}\n hoverStyle={\n !isDisable && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n <Icon size={iconSize} color={copyIconColor}>\n {copied ? <CheckCr /> : <Copy />}\n </Icon>\n </Box>\n </Box>\n {isError && errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInputCopy.displayName = \"InputCopy\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledBox = styled.div<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\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 overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (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 type,\n disabled,\n id,\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 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 }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n as={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 {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledText = styled.span<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledIcon = styled.div<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 svg {\n width: 100%;\n height: 100%;\n fill: none;\n stroke: currentColor;\n }\n`;\n\nexport const Icon: React.FC<IconProps> = ({ children, ...props }) => {\n return <StyledIcon {...props}>{children}</StyledIcon>;\n};\n"],"mappings":"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","names":["import_react","styled","React","import_styled_components","import_jsx_runtime","styled","import_styled_components","import_jsx_runtime","styled","import_jsx_runtime","React"]}
package/web/index.mjs CHANGED
@@ -226,7 +226,7 @@ var Icon = ({ children, ...props }) => {
226
226
 
227
227
  // src/InputCopy.tsx
228
228
  import { Input } from "@xsolla/xui-input";
229
- import { Copy, Check, Eye, EyeOff } from "@xsolla/xui-icons";
229
+ import { Copy, CheckCr, Eye, EyeOff } from "@xsolla/xui-icons-base";
230
230
  import { useDesignSystem, useId } from "@xsolla/xui-core";
231
231
  import { jsx as jsx4, jsxs } from "react/jsx-runtime";
232
232
  var InputCopy = forwardRef(
@@ -409,7 +409,7 @@ var InputCopy = forwardRef(
409
409
  backgroundColor: inputColors.bgHover,
410
410
  borderColor: inputColors.borderHover
411
411
  } : void 0,
412
- children: /* @__PURE__ */ jsx4(Icon, { size: iconSize, color: copyIconColor, children: copied ? /* @__PURE__ */ jsx4(Check, {}) : /* @__PURE__ */ jsx4(Copy, {}) })
412
+ children: /* @__PURE__ */ jsx4(Icon, { size: iconSize, color: copyIconColor, children: copied ? /* @__PURE__ */ jsx4(CheckCr, {}) : /* @__PURE__ */ jsx4(Copy, {}) })
413
413
  }
414
414
  )
415
415
  ] }),
package/web/index.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/InputCopy.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx","../../../primitives-web/src/Icon.tsx"],"sourcesContent":["import React, { useState, useEffect, forwardRef, useRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Icon, Text } from \"@xsolla/xui-primitives\";\nimport { Input, InputProps } from \"@xsolla/xui-input\";\nimport { Copy, Check, Eye, EyeOff } from \"@xsolla/xui-icons\";\nimport { useDesignSystem, useId } from \"@xsolla/xui-core\";\n\nexport interface InputCopyProps extends Omit<InputProps, \"onCopy\"> {\n /**\n * Callback when value is copied to clipboard\n */\n onCopy?: (value: string) => void;\n /**\n * Whether to hide the text (like a password field)\n */\n secureTextEntry?: boolean;\n /**\n * Initial visibility state when secureTextEntry is true\n */\n initialVisible?: boolean;\n /**\n * Test identifier for the component\n */\n testID?: string;\n}\n\nexport const InputCopy = forwardRef<HTMLInputElement, InputCopyProps>(\n (\n {\n value = \"\",\n onCopy,\n onChange,\n onChangeText,\n size = \"md\",\n disabled = false,\n label,\n errorMessage,\n error,\n secureTextEntry = false,\n initialVisible = false,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n ...props\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [copied, setCopied] = useState(false);\n const [isVisible, setIsVisible] = useState(\n secureTextEntry ? initialVisible : true\n );\n // Internal value state to track current input value\n const [internalValue, setInternalValue] = useState(value);\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-copy-${safeId}`;\n const labelId = `${inputId}-label`;\n const errorId = `${inputId}-error`;\n\n // Forward ref to input element\n React.useImperativeHandle(\n ref,\n () => inputRef.current as HTMLInputElement,\n []\n );\n\n // Sync internalValue with value prop when it changes\n useEffect(() => {\n setInternalValue(value);\n }, [value]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n // Border radius config matching Input component\n const borderRadiusConfig: Record<string, number> = {\n xl: 8,\n lg: 8,\n md: 8,\n sm: 4,\n xs: 4,\n };\n\n // Icon sizes matching Input component\n const iconSizeConfig: Record<string, number> = {\n xl: 18,\n lg: 18,\n md: 18,\n sm: 16,\n xs: 16,\n };\n\n const borderRadius = borderRadiusConfig[size];\n const iconSize = iconSizeConfig[size];\n\n const handleCopy = async () => {\n if (internalValue && !isDisable) {\n try {\n // Use clipboard API (works on both web and can be polyfilled for RN)\n if (\n typeof navigator !== \"undefined\" &&\n navigator.clipboard?.writeText\n ) {\n await navigator.clipboard.writeText(String(internalValue));\n } else {\n throw new Error(\"Clipboard API not available\");\n }\n setCopied(true);\n onCopy?.(String(internalValue));\n } catch {\n // Silently fail - clipboard operations can fail due to permissions or browser restrictions\n setCopied(false);\n return;\n }\n setTimeout(() => setCopied(false), 2000);\n }\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n setInternalValue(newValue);\n if (onChange) onChange(e);\n if (onChangeText) onChangeText(newValue);\n };\n\n const toggleVisibility = () => {\n if (!isDisable) {\n setIsVisible(!isVisible);\n }\n };\n\n // Icon colors - disabled icons use placeholder color per Figma spec\n const iconColor = isDisable ? inputColors.placeholder : inputColors.text;\n const copyIconColor = isDisable\n ? inputColors.placeholder\n : copied\n ? theme.colors.content.success.secondary\n : inputColors.text;\n\n // Button background color\n let buttonBgColor = inputColors.bg;\n if (isDisable) {\n buttonBgColor = inputColors.bgDisable;\n }\n\n // Button border color\n let buttonBorderColor = inputColors.border;\n if (isDisable) {\n buttonBorderColor = inputColors.borderDisable;\n }\n\n // Visibility toggle icon component\n const VisibilityToggle = secureTextEntry ? (\n <Box\n as=\"button\"\n type=\"button\"\n onPress={toggleVisibility}\n cursor={isDisable ? \"default\" : \"pointer\"}\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n aria-label={isVisible ? \"Hide text\" : \"Show text\"}\n aria-pressed={isVisible}\n data-testid=\"input-copy__visibility-toggle\"\n >\n {isVisible ? (\n <Eye size={iconSize} color={iconColor} />\n ) : (\n <EyeOff size={iconSize} color={iconColor} />\n )}\n </Box>\n ) : null;\n\n return (\n <Box flexDirection=\"column\" gap={8} width=\"100%\" testID={testID}>\n {label && (\n <Box as=\"label\" id={labelId} htmlFor={inputId}>\n <Text\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n </Box>\n )}\n <Box flexDirection=\"row\" width=\"100%\" gap={2}>\n <Box flex={1}>\n <Input\n {...props}\n ref={inputRef}\n id={inputId}\n value={internalValue}\n onChange={handleChange}\n size={size}\n disabled={disabled}\n error={isError}\n type={secureTextEntry && !isVisible ? \"password\" : \"text\"}\n iconRight={VisibilityToggle}\n borderTopLeftRadius={borderRadius}\n borderBottomLeftRadius={borderRadius}\n borderTopRightRadius={0}\n borderBottomRightRadius={0}\n aria-label={!label ? ariaLabel : undefined}\n aria-labelledby={label ? labelId : undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n aria-invalid={isError || undefined}\n // Clear label and errorMessage here as we handle them in InputCopy\n label={undefined}\n errorMessage={undefined}\n testID=\"input-copy__field\"\n />\n </Box>\n <Box\n as=\"button\"\n type=\"button\"\n width={sizeStyles.height}\n height={sizeStyles.height}\n backgroundColor={buttonBgColor}\n borderColor={buttonBorderColor}\n borderWidth={1}\n alignItems=\"center\"\n justifyContent=\"center\"\n onPress={handleCopy}\n cursor={isDisable ? \"default\" : \"pointer\"}\n disabled={isDisable}\n aria-label={copied ? \"Copied\" : \"Copy to clipboard\"}\n aria-disabled={isDisable || undefined}\n data-testid=\"input-copy__copy-button\"\n style={{\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n borderTopRightRadius: borderRadius,\n borderBottomRightRadius: borderRadius,\n background: buttonBgColor,\n opacity: 1,\n }}\n hoverStyle={\n !isDisable && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n <Icon size={iconSize} color={copyIconColor}>\n {copied ? <Check /> : <Copy />}\n </Icon>\n </Box>\n </Box>\n {isError && errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInputCopy.displayName = \"InputCopy\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledBox = styled.div<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\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 overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (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 type,\n disabled,\n id,\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 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 }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n as={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 {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledText = styled.span<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledIcon = styled.div<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 svg {\n width: 100%;\n height: 100%;\n fill: none;\n stroke: currentColor;\n }\n`;\n\nexport const Icon: React.FC<IconProps> = ({ children, ...props }) => {\n return <StyledIcon {...props}>{children}</StyledIcon>;\n};\n"],"mappings":"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","names":["React","styled","jsx","styled","jsx","jsx","React"]}
1
+ {"version":3,"sources":["../../src/InputCopy.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx","../../../primitives-web/src/Icon.tsx"],"sourcesContent":["import React, { useState, useEffect, forwardRef, useRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Icon, Text } from \"@xsolla/xui-primitives\";\nimport { Input, InputProps } from \"@xsolla/xui-input\";\nimport { Copy, CheckCr, Eye, EyeOff } from \"@xsolla/xui-icons-base\";\nimport { useDesignSystem, useId } from \"@xsolla/xui-core\";\n\nexport interface InputCopyProps extends Omit<InputProps, \"onCopy\"> {\n /**\n * Callback when value is copied to clipboard\n */\n onCopy?: (value: string) => void;\n /**\n * Whether to hide the text (like a password field)\n */\n secureTextEntry?: boolean;\n /**\n * Initial visibility state when secureTextEntry is true\n */\n initialVisible?: boolean;\n /**\n * Test identifier for the component\n */\n testID?: string;\n}\n\nexport const InputCopy = forwardRef<HTMLInputElement, InputCopyProps>(\n (\n {\n value = \"\",\n onCopy,\n onChange,\n onChangeText,\n size = \"md\",\n disabled = false,\n label,\n errorMessage,\n error,\n secureTextEntry = false,\n initialVisible = false,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n ...props\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [copied, setCopied] = useState(false);\n const [isVisible, setIsVisible] = useState(\n secureTextEntry ? initialVisible : true\n );\n // Internal value state to track current input value\n const [internalValue, setInternalValue] = useState(value);\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-copy-${safeId}`;\n const labelId = `${inputId}-label`;\n const errorId = `${inputId}-error`;\n\n // Forward ref to input element\n React.useImperativeHandle(\n ref,\n () => inputRef.current as HTMLInputElement,\n []\n );\n\n // Sync internalValue with value prop when it changes\n useEffect(() => {\n setInternalValue(value);\n }, [value]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n // Border radius config matching Input component\n const borderRadiusConfig: Record<string, number> = {\n xl: 8,\n lg: 8,\n md: 8,\n sm: 4,\n xs: 4,\n };\n\n // Icon sizes matching Input component\n const iconSizeConfig: Record<string, number> = {\n xl: 18,\n lg: 18,\n md: 18,\n sm: 16,\n xs: 16,\n };\n\n const borderRadius = borderRadiusConfig[size];\n const iconSize = iconSizeConfig[size];\n\n const handleCopy = async () => {\n if (internalValue && !isDisable) {\n try {\n // Use clipboard API (works on both web and can be polyfilled for RN)\n if (\n typeof navigator !== \"undefined\" &&\n navigator.clipboard?.writeText\n ) {\n await navigator.clipboard.writeText(String(internalValue));\n } else {\n throw new Error(\"Clipboard API not available\");\n }\n setCopied(true);\n onCopy?.(String(internalValue));\n } catch {\n // Silently fail - clipboard operations can fail due to permissions or browser restrictions\n setCopied(false);\n return;\n }\n setTimeout(() => setCopied(false), 2000);\n }\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n setInternalValue(newValue);\n if (onChange) onChange(e);\n if (onChangeText) onChangeText(newValue);\n };\n\n const toggleVisibility = () => {\n if (!isDisable) {\n setIsVisible(!isVisible);\n }\n };\n\n // Icon colors - disabled icons use placeholder color per Figma spec\n const iconColor = isDisable ? inputColors.placeholder : inputColors.text;\n const copyIconColor = isDisable\n ? inputColors.placeholder\n : copied\n ? theme.colors.content.success.secondary\n : inputColors.text;\n\n // Button background color\n let buttonBgColor = inputColors.bg;\n if (isDisable) {\n buttonBgColor = inputColors.bgDisable;\n }\n\n // Button border color\n let buttonBorderColor = inputColors.border;\n if (isDisable) {\n buttonBorderColor = inputColors.borderDisable;\n }\n\n // Visibility toggle icon component\n const VisibilityToggle = secureTextEntry ? (\n <Box\n as=\"button\"\n type=\"button\"\n onPress={toggleVisibility}\n cursor={isDisable ? \"default\" : \"pointer\"}\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n aria-label={isVisible ? \"Hide text\" : \"Show text\"}\n aria-pressed={isVisible}\n data-testid=\"input-copy__visibility-toggle\"\n >\n {isVisible ? (\n <Eye size={iconSize} color={iconColor} />\n ) : (\n <EyeOff size={iconSize} color={iconColor} />\n )}\n </Box>\n ) : null;\n\n return (\n <Box flexDirection=\"column\" gap={8} width=\"100%\" testID={testID}>\n {label && (\n <Box as=\"label\" id={labelId} htmlFor={inputId}>\n <Text\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n </Box>\n )}\n <Box flexDirection=\"row\" width=\"100%\" gap={2}>\n <Box flex={1}>\n <Input\n {...props}\n ref={inputRef}\n id={inputId}\n value={internalValue}\n onChange={handleChange}\n size={size}\n disabled={disabled}\n error={isError}\n type={secureTextEntry && !isVisible ? \"password\" : \"text\"}\n iconRight={VisibilityToggle}\n borderTopLeftRadius={borderRadius}\n borderBottomLeftRadius={borderRadius}\n borderTopRightRadius={0}\n borderBottomRightRadius={0}\n aria-label={!label ? ariaLabel : undefined}\n aria-labelledby={label ? labelId : undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n aria-invalid={isError || undefined}\n // Clear label and errorMessage here as we handle them in InputCopy\n label={undefined}\n errorMessage={undefined}\n testID=\"input-copy__field\"\n />\n </Box>\n <Box\n as=\"button\"\n type=\"button\"\n width={sizeStyles.height}\n height={sizeStyles.height}\n backgroundColor={buttonBgColor}\n borderColor={buttonBorderColor}\n borderWidth={1}\n alignItems=\"center\"\n justifyContent=\"center\"\n onPress={handleCopy}\n cursor={isDisable ? \"default\" : \"pointer\"}\n disabled={isDisable}\n aria-label={copied ? \"Copied\" : \"Copy to clipboard\"}\n aria-disabled={isDisable || undefined}\n data-testid=\"input-copy__copy-button\"\n style={{\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n borderTopRightRadius: borderRadius,\n borderBottomRightRadius: borderRadius,\n background: buttonBgColor,\n opacity: 1,\n }}\n hoverStyle={\n !isDisable && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n <Icon size={iconSize} color={copyIconColor}>\n {copied ? <CheckCr /> : <Copy />}\n </Icon>\n </Box>\n </Box>\n {isError && errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInputCopy.displayName = \"InputCopy\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledBox = styled.div<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\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 overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (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 type,\n disabled,\n id,\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 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 }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n as={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 {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledText = styled.span<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledIcon = styled.div<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 svg {\n width: 100%;\n height: 100%;\n fill: none;\n stroke: currentColor;\n }\n`;\n\nexport const Icon: React.FC<IconProps> = ({ children, ...props }) => {\n return <StyledIcon {...props}>{children}</StyledIcon>;\n};\n"],"mappings":"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","names":["React","styled","jsx","styled","jsx","jsx","React"]}