@xsolla/xui-input 0.112.0 → 0.114.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
@@ -213,29 +213,57 @@ var roleMap = {
213
213
  link: "link",
214
214
  text: "text"
215
215
  };
216
+ var parseNumericValue = (value) => {
217
+ if (value === void 0) return void 0;
218
+ if (typeof value === "number") return value;
219
+ const parsed = parseFloat(value);
220
+ return isNaN(parsed) ? void 0 : parsed;
221
+ };
216
222
  var Text = ({
217
223
  children,
218
224
  color,
219
225
  fontSize,
220
226
  fontWeight,
221
227
  fontFamily,
228
+ textAlign,
229
+ lineHeight,
230
+ numberOfLines,
222
231
  id,
223
232
  role,
233
+ style: styleProp,
224
234
  ...props
225
235
  }) => {
226
236
  let resolvedFontFamily = fontFamily ? fontFamily.split(",")[0].replace(/['"]/g, "").trim() : void 0;
227
237
  if (resolvedFontFamily === "Pilat Wide" || resolvedFontFamily === "Pilat Wide Bold" || resolvedFontFamily === "Aktiv Grotesk") {
228
238
  resolvedFontFamily = void 0;
229
239
  }
230
- const style = {
240
+ const incomingStyle = import_react_native2.StyleSheet.flatten(styleProp);
241
+ const baseStyle = {
231
242
  color,
232
243
  fontSize: typeof fontSize === "number" ? fontSize : void 0,
233
244
  fontWeight,
234
245
  fontFamily: resolvedFontFamily,
235
- textDecorationLine: props.textDecoration
246
+ textDecorationLine: props.textDecoration,
247
+ textAlign: textAlign ?? incomingStyle?.textAlign,
248
+ lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),
249
+ marginTop: parseNumericValue(
250
+ incomingStyle?.marginTop
251
+ ),
252
+ marginBottom: parseNumericValue(
253
+ incomingStyle?.marginBottom
254
+ )
236
255
  };
237
256
  const accessibilityRole = role ? roleMap[role] : void 0;
238
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native2.Text, { style, testID: id, accessibilityRole, children });
257
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
258
+ import_react_native2.Text,
259
+ {
260
+ style: baseStyle,
261
+ numberOfLines,
262
+ testID: id,
263
+ accessibilityRole,
264
+ children
265
+ }
266
+ );
239
267
  };
240
268
 
241
269
  // ../primitives-native/src/Icon.tsx
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.tsx","../../src/Input.tsx","../../../primitives-native/src/Box.tsx","../../../primitives-native/src/Text.tsx","../../../primitives-native/src/Icon.tsx","../../../primitives-native/src/Input.tsx"],"sourcesContent":["export * from \"./Input\";\n","import React, {\n useState,\n forwardRef,\n useRef,\n useEffect,\n type InputHTMLAttributes,\n} from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon, InputPrimitive } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem, useId } from \"@xsolla/xui-core\";\nimport { CheckCr, Remove } from \"@xsolla/xui-icons-base\";\n\nexport interface InputProps extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"onChange\"\n> {\n /**\n * Property for specifying the value of the control.\n */\n value?: string;\n /**\n * Property for specifying the placeholder of the control.\n */\n placeholder?: string;\n /**\n * Event handler when the value changes (for controlled mode).\n */\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /**\n * Event handler when the text changes (alternative to onChange).\n */\n onChangeText?: (text: string) => void;\n /**\n * Property for changing the size of the input.\n */\n size?: \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n /**\n * Property for disabling the control.\n */\n disabled?: boolean;\n /**\n * Property for displaying a label above the input.\n */\n label?: string;\n /**\n * Property for displaying an error message and highlighting the control as invalid.\n */\n errorMessage?: string;\n /**\n * Property for displaying an error and highlighting the control as invalid.\n */\n error?: boolean;\n /**\n * Property to display an icon on the left side.\n */\n iconLeft?: React.ReactNode;\n /**\n * Property to display an icon on the right side.\n */\n iconRight?: React.ReactNode;\n /**\n * Add function clear for input.\n */\n extraClear?: boolean;\n /**\n * Function triggered when user clicks on extraClear button.\n */\n onRemove?: () => void;\n /**\n * Property for show checked status in input. Show only if not errorMessage.\n */\n checked?: boolean;\n /**\n * Property for passing a new icon to replace the default checked icon.\n */\n checkedIcon?: React.ReactNode;\n /**\n * Property to specify the size of the right icon.\n */\n iconRightSize?: number | string;\n /**\n * Unique identifier for the input element. Used for accessibility linking.\n */\n id?: string;\n /**\n * Accessible label for screen readers when no visible label is present.\n */\n \"aria-label\"?: string;\n /**\n * Override border radius for top-left corner.\n */\n borderTopLeftRadius?: number;\n /**\n * Override border radius for top-right corner.\n */\n borderTopRightRadius?: number;\n /**\n * Override border radius for bottom-left corner.\n */\n borderBottomLeftRadius?: number;\n /**\n * Override border radius for bottom-right corner.\n */\n borderBottomRightRadius?: number;\n /**\n * Custom background color for the input.\n */\n backgroundColor?: string;\n /**\n * Test identifier for the input.\n */\n testID?: string;\n}\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onKeyDown,\n size = \"md\",\n disabled = false,\n name,\n label,\n errorMessage,\n error,\n iconLeft,\n iconRight,\n iconRightSize,\n extraClear = false,\n onRemove,\n checked = false,\n checkedIcon = <CheckCr />,\n type,\n id: providedId,\n \"aria-label\": ariaLabel,\n borderTopLeftRadius: borderTopLeftRadiusOverride,\n borderTopRightRadius: borderTopRightRadiusOverride,\n borderBottomLeftRadius: borderBottomLeftRadiusOverride,\n borderBottomRightRadius: borderBottomRightRadiusOverride,\n backgroundColor: backgroundColorProp,\n testID,\n onBlur: externalOnBlur,\n onFocus: externalOnFocus,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [internalState, setInternalState] = useState<\"default\" | \"focus\">(\n \"default\"\n );\n // Internal value state - mimics useUpdatableState from switch-repo\n const [passValue, setPassValue] = useState(value ?? \"\");\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n // Sanitize useId() output to remove colons (e.g., :r0: -> r0)\n // This ensures valid HTML id attributes and ARIA references\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-${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 passValue with value prop when it changes (like useUpdatableState)\n useEffect(() => {\n if (value !== undefined) {\n setPassValue(value);\n }\n }, [value]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const isFocus = internalState === \"focus\";\n\n const isLeftInputIconShown = !!iconLeft;\n const isRightInputIconShown = !!iconRight;\n\n // Handle checked status (only show if not error)\n const isCheckedShown = checked && !errorMessage;\n // Clear button visibility depends on internal state\n const isExtraClearIconShown = !disabled && extraClear && !!passValue;\n const extrasCount =\n Number(isExtraClearIconShown) +\n Number(isCheckedShown) +\n Number(isRightInputIconShown);\n\n // Resolve Config from Theme\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"focus\");\n }\n externalOnFocus?.(e);\n };\n\n const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"default\");\n }\n externalOnBlur?.(e);\n };\n\n // Match switch-repo handleChange pattern exactly\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n\n // If onChange is provided (controlled mode), call it\n // But ALWAYS update internal state for clear button visibility\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(newValue);\n }\n\n // Always update internal state (this is key for uncontrolled mode in Storybook)\n setPassValue(newValue);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"Escape\") {\n e.currentTarget.blur();\n }\n if (onKeyDown) {\n onKeyDown(e);\n }\n };\n\n // Match switch-repo onClear pattern - NO direct DOM manipulation\n const handleClear = (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n\n // Update internal state first (this makes the input show empty)\n setPassValue(\"\");\n\n // Call onRemove callback\n onRemove?.();\n\n // Create synthetic change event and call onChange if provided\n if (inputRef.current) {\n // Web-specific: Use the native setter to properly set the value\n // without shadowing the property (only on web platform)\n if (typeof window !== \"undefined\" && window.HTMLInputElement) {\n const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n window.HTMLInputElement.prototype,\n \"value\"\n )?.set;\n\n if (nativeInputValueSetter) {\n nativeInputValueSetter.call(inputRef.current, \"\");\n }\n }\n\n // Create a proper synthetic event\n const syntheticEvent = {\n target: inputRef.current,\n currentTarget: inputRef.current,\n type: \"change\",\n } as React.ChangeEvent<HTMLInputElement>;\n\n onChange?.(syntheticEvent);\n inputRef.current.focus();\n }\n };\n\n // Resolve background and border colors based on state\n let backgroundColor = backgroundColorProp || inputColors.bg;\n let borderColor = inputColors.border;\n let outlineColor: string | undefined;\n\n if (isDisable) {\n backgroundColor = inputColors.bgDisable;\n borderColor = inputColors.borderDisable;\n } else if (isError) {\n outlineColor = theme.colors.border.alert;\n if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n }\n } else if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n outlineColor = theme.colors.border.brand;\n }\n\n const textColor = isDisable ? inputColors.textDisable : inputColors.text;\n const placeholderColor = inputColors.placeholder;\n\n // Padding values from Figma design\n const paddingConfig = {\n xl: { vertical: 12, horizontal: 12 },\n lg: { vertical: 14, horizontal: 12 },\n md: { vertical: 11, horizontal: 12 },\n sm: { vertical: 7, horizontal: 10 },\n xs: { vertical: 7, horizontal: 10 },\n };\n\n // Border radius from Figma design\n const borderRadiusConfig = {\n xl: 8,\n lg: 8,\n md: 8,\n sm: 4,\n xs: 4,\n };\n\n // Icon sizes from Figma design\n const iconSizeConfig = {\n xl: 18,\n lg: 18,\n md: 18,\n sm: 16,\n xs: 16,\n };\n\n // Focus outline config from Figma design\n const focusOutlineConfig = {\n xl: { width: 1, offset: -1 },\n lg: { width: 1, offset: -1 },\n md: { width: 1, offset: -1 },\n sm: { width: 1, offset: -1 },\n xs: { width: 1, offset: -1 },\n };\n\n const padding = paddingConfig[size];\n const borderRadius = borderRadiusConfig[size];\n const iconSize = iconSizeConfig[size];\n const focusOutline = focusOutlineConfig[size];\n\n return (\n <Box\n flexDirection=\"column\"\n gap={sizeStyles.fieldGap}\n width=\"100%\"\n testID={testID}\n >\n {label && (\n <Box as=\"label\" id={labelId}>\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\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n height={sizeStyles.height}\n paddingVertical={padding.vertical}\n paddingHorizontal={padding.horizontal}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={10}\n position=\"relative\"\n style={{\n borderTopLeftRadius: borderTopLeftRadiusOverride ?? borderRadius,\n borderTopRightRadius: borderTopRightRadiusOverride ?? borderRadius,\n borderBottomLeftRadius:\n borderBottomLeftRadiusOverride ?? borderRadius,\n borderBottomRightRadius:\n borderBottomRightRadiusOverride ?? borderRadius,\n ...(outlineColor\n ? {\n outline: `${focusOutline.width}px solid ${outlineColor}`,\n outlineOffset: `${focusOutline.offset}px`,\n }\n : {}),\n }}\n hoverStyle={\n !isDisable && !isFocus && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n {isLeftInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconSize} color={textColor}>\n {iconLeft}\n </Icon>\n </Box>\n )}\n\n <Box flex={1} height=\"100%\" justifyContent=\"center\">\n <InputPrimitive\n ref={inputRef}\n id={inputId}\n value={passValue}\n name={name}\n placeholder={placeholder}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n disabled={isDisable}\n type={type || \"text\"}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n placeholderTextColor={placeholderColor}\n aria-invalid={isError || undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n aria-disabled={isDisable || undefined}\n data-testid=\"input__field\"\n {...rest}\n />\n </Box>\n\n {/* Right-side Extras Wrapper */}\n {extrasCount > 0 && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={4}>\n {isExtraClearIconShown && (\n <Box\n as=\"button\"\n type=\"button\"\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n cursor={disabled ? \"not-allowed\" : \"pointer\"}\n onPress={!disabled ? handleClear : undefined}\n disabled={disabled}\n data-testid=\"input__extra-clear-button\"\n >\n <Icon size={iconSize} color={textColor}>\n <Remove />\n </Icon>\n </Box>\n )}\n {isCheckedShown && (\n <Box\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.success.primary}\n >\n {checkedIcon}\n </Icon>\n </Box>\n )}\n {isRightInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconRightSize || iconSize} color={textColor}>\n {iconRight}\n </Icon>\n </Box>\n )}\n </Box>\n )}\n </Box>\n\n {errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInput.displayName = \"Input\";\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","import React, { forwardRef } from \"react\";\nimport { TextInput as RNTextInput } from \"react-native\";\nimport { InputPrimitiveProps } from \"@xsolla/xui-primitives-core\";\n\n// Map web input types to React Native keyboard types\nconst keyboardTypeMap: Record<string, any> = {\n text: \"default\",\n number: \"numeric\",\n email: \"email-address\",\n tel: \"phone-pad\",\n url: \"url\",\n decimal: \"decimal-pad\",\n};\n\n// Map web inputMode to React Native keyboard types\nconst inputModeToKeyboardType: Record<string, any> = {\n none: \"default\",\n text: \"default\",\n decimal: \"decimal-pad\",\n numeric: \"number-pad\",\n tel: \"phone-pad\",\n search: \"default\",\n email: \"email-address\",\n url: \"url\",\n};\n\n// Map web autoComplete to React Native textContentType (iOS)\nconst autoCompleteToTextContentType: Record<string, any> = {\n \"one-time-code\": \"oneTimeCode\",\n email: \"emailAddress\",\n username: \"username\",\n password: \"password\",\n \"new-password\": \"newPassword\",\n tel: \"telephoneNumber\",\n \"postal-code\": \"postalCode\",\n name: \"name\",\n};\n\nexport const InputPrimitive = forwardRef<RNTextInput, InputPrimitiveProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onFocus,\n onBlur,\n onKeyDown,\n disabled,\n secureTextEntry,\n style,\n color,\n fontSize,\n placeholderTextColor,\n maxLength,\n type,\n inputMode,\n autoComplete,\n id,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-label\": ariaLabel,\n \"aria-disabled\": ariaDisabled,\n \"data-testid\": dataTestId,\n },\n ref\n ) => {\n const handleChangeText = (text: string) => {\n onChangeText?.(text);\n\n // Create a synthetic event for onChange compatibility\n // Include nativeEvent and no-op methods to prevent runtime errors\n // when consumers expect DOM-like event behavior\n if (onChange) {\n const syntheticEvent = {\n target: { value: text },\n currentTarget: { value: text },\n type: \"change\",\n nativeEvent: { text },\n preventDefault: () => {},\n stopPropagation: () => {},\n isTrusted: false,\n } as unknown as React.ChangeEvent<HTMLInputElement>;\n onChange(syntheticEvent);\n }\n };\n\n // Determine keyboard type - inputMode takes precedence over type\n const keyboardType = inputMode\n ? inputModeToKeyboardType[inputMode] || \"default\"\n : type\n ? keyboardTypeMap[type] || \"default\"\n : \"default\";\n\n // Determine textContentType for iOS autofill\n const textContentType = autoComplete\n ? autoCompleteToTextContentType[autoComplete]\n : undefined;\n\n return (\n <RNTextInput\n ref={ref}\n value={value}\n placeholder={placeholder}\n onChangeText={handleChangeText}\n onFocus={onFocus}\n onBlur={onBlur}\n onKeyPress={(e) => {\n // Map onKeyPress to onKeyDown for cross-platform compatibility\n // Include preventDefault to avoid runtime errors when consumers call it\n if (onKeyDown) {\n onKeyDown({\n key: e.nativeEvent.key,\n preventDefault: () => {},\n } as any);\n }\n }}\n editable={!disabled}\n secureTextEntry={secureTextEntry || type === \"password\"}\n keyboardType={keyboardType}\n textContentType={textContentType}\n style={[\n {\n color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n flex: 1,\n padding: 0,\n textAlign: (style as any)?.textAlign || \"left\",\n },\n style as any,\n ]}\n placeholderTextColor={placeholderTextColor}\n maxLength={maxLength}\n // React Native accessibility props\n testID={dataTestId || id}\n accessibilityLabel={ariaLabel}\n accessibilityHint={ariaDescribedBy}\n accessibilityState={{\n disabled: disabled || ariaDisabled,\n }}\n accessible={true}\n />\n );\n }\n);\n\nInputPrimitive.displayName = \"InputPrimitive\";\n"],"mappings":"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","names":["import_react","import_react_native","import_jsx_runtime","RNText","import_react_native","import_jsx_runtime","React","import_react","import_react_native","import_jsx_runtime","RNTextInput","import_jsx_runtime","React"]}
1
+ {"version":3,"sources":["../../src/index.tsx","../../src/Input.tsx","../../../primitives-native/src/Box.tsx","../../../primitives-native/src/Text.tsx","../../../primitives-native/src/Icon.tsx","../../../primitives-native/src/Input.tsx"],"sourcesContent":["export * from \"./Input\";\n","import React, {\n useState,\n forwardRef,\n useRef,\n useEffect,\n type InputHTMLAttributes,\n} from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon, InputPrimitive } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem, useId } from \"@xsolla/xui-core\";\nimport { CheckCr, Remove } from \"@xsolla/xui-icons-base\";\n\nexport interface InputProps extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"onChange\"\n> {\n /**\n * Property for specifying the value of the control.\n */\n value?: string;\n /**\n * Property for specifying the placeholder of the control.\n */\n placeholder?: string;\n /**\n * Event handler when the value changes (for controlled mode).\n */\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /**\n * Event handler when the text changes (alternative to onChange).\n */\n onChangeText?: (text: string) => void;\n /**\n * Property for changing the size of the input.\n */\n size?: \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n /**\n * Property for disabling the control.\n */\n disabled?: boolean;\n /**\n * Property for displaying a label above the input.\n */\n label?: string;\n /**\n * Property for displaying an error message and highlighting the control as invalid.\n */\n errorMessage?: string;\n /**\n * Property for displaying an error and highlighting the control as invalid.\n */\n error?: boolean;\n /**\n * Property to display an icon on the left side.\n */\n iconLeft?: React.ReactNode;\n /**\n * Property to display an icon on the right side.\n */\n iconRight?: React.ReactNode;\n /**\n * Add function clear for input.\n */\n extraClear?: boolean;\n /**\n * Function triggered when user clicks on extraClear button.\n */\n onRemove?: () => void;\n /**\n * Property for show checked status in input. Show only if not errorMessage.\n */\n checked?: boolean;\n /**\n * Property for passing a new icon to replace the default checked icon.\n */\n checkedIcon?: React.ReactNode;\n /**\n * Property to specify the size of the right icon.\n */\n iconRightSize?: number | string;\n /**\n * Unique identifier for the input element. Used for accessibility linking.\n */\n id?: string;\n /**\n * Accessible label for screen readers when no visible label is present.\n */\n \"aria-label\"?: string;\n /**\n * Override border radius for top-left corner.\n */\n borderTopLeftRadius?: number;\n /**\n * Override border radius for top-right corner.\n */\n borderTopRightRadius?: number;\n /**\n * Override border radius for bottom-left corner.\n */\n borderBottomLeftRadius?: number;\n /**\n * Override border radius for bottom-right corner.\n */\n borderBottomRightRadius?: number;\n /**\n * Custom background color for the input.\n */\n backgroundColor?: string;\n /**\n * Test identifier for the input.\n */\n testID?: string;\n}\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onKeyDown,\n size = \"md\",\n disabled = false,\n name,\n label,\n errorMessage,\n error,\n iconLeft,\n iconRight,\n iconRightSize,\n extraClear = false,\n onRemove,\n checked = false,\n checkedIcon = <CheckCr />,\n type,\n id: providedId,\n \"aria-label\": ariaLabel,\n borderTopLeftRadius: borderTopLeftRadiusOverride,\n borderTopRightRadius: borderTopRightRadiusOverride,\n borderBottomLeftRadius: borderBottomLeftRadiusOverride,\n borderBottomRightRadius: borderBottomRightRadiusOverride,\n backgroundColor: backgroundColorProp,\n testID,\n onBlur: externalOnBlur,\n onFocus: externalOnFocus,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [internalState, setInternalState] = useState<\"default\" | \"focus\">(\n \"default\"\n );\n // Internal value state - mimics useUpdatableState from switch-repo\n const [passValue, setPassValue] = useState(value ?? \"\");\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n // Sanitize useId() output to remove colons (e.g., :r0: -> r0)\n // This ensures valid HTML id attributes and ARIA references\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-${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 passValue with value prop when it changes (like useUpdatableState)\n useEffect(() => {\n if (value !== undefined) {\n setPassValue(value);\n }\n }, [value]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const isFocus = internalState === \"focus\";\n\n const isLeftInputIconShown = !!iconLeft;\n const isRightInputIconShown = !!iconRight;\n\n // Handle checked status (only show if not error)\n const isCheckedShown = checked && !errorMessage;\n // Clear button visibility depends on internal state\n const isExtraClearIconShown = !disabled && extraClear && !!passValue;\n const extrasCount =\n Number(isExtraClearIconShown) +\n Number(isCheckedShown) +\n Number(isRightInputIconShown);\n\n // Resolve Config from Theme\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"focus\");\n }\n externalOnFocus?.(e);\n };\n\n const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"default\");\n }\n externalOnBlur?.(e);\n };\n\n // Match switch-repo handleChange pattern exactly\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n\n // If onChange is provided (controlled mode), call it\n // But ALWAYS update internal state for clear button visibility\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(newValue);\n }\n\n // Always update internal state (this is key for uncontrolled mode in Storybook)\n setPassValue(newValue);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"Escape\") {\n e.currentTarget.blur();\n }\n if (onKeyDown) {\n onKeyDown(e);\n }\n };\n\n // Match switch-repo onClear pattern - NO direct DOM manipulation\n const handleClear = (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n\n // Update internal state first (this makes the input show empty)\n setPassValue(\"\");\n\n // Call onRemove callback\n onRemove?.();\n\n // Create synthetic change event and call onChange if provided\n if (inputRef.current) {\n // Web-specific: Use the native setter to properly set the value\n // without shadowing the property (only on web platform)\n if (typeof window !== \"undefined\" && window.HTMLInputElement) {\n const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n window.HTMLInputElement.prototype,\n \"value\"\n )?.set;\n\n if (nativeInputValueSetter) {\n nativeInputValueSetter.call(inputRef.current, \"\");\n }\n }\n\n // Create a proper synthetic event\n const syntheticEvent = {\n target: inputRef.current,\n currentTarget: inputRef.current,\n type: \"change\",\n } as React.ChangeEvent<HTMLInputElement>;\n\n onChange?.(syntheticEvent);\n inputRef.current.focus();\n }\n };\n\n // Resolve background and border colors based on state\n let backgroundColor = backgroundColorProp || inputColors.bg;\n let borderColor = inputColors.border;\n let outlineColor: string | undefined;\n\n if (isDisable) {\n backgroundColor = inputColors.bgDisable;\n borderColor = inputColors.borderDisable;\n } else if (isError) {\n outlineColor = theme.colors.border.alert;\n if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n }\n } else if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n outlineColor = theme.colors.border.brand;\n }\n\n const textColor = isDisable ? inputColors.textDisable : inputColors.text;\n const placeholderColor = inputColors.placeholder;\n\n // Padding values from Figma design\n const paddingConfig = {\n xl: { vertical: 12, horizontal: 12 },\n lg: { vertical: 14, horizontal: 12 },\n md: { vertical: 11, horizontal: 12 },\n sm: { vertical: 7, horizontal: 10 },\n xs: { vertical: 7, horizontal: 10 },\n };\n\n // Border radius from Figma design\n const borderRadiusConfig = {\n xl: 8,\n lg: 8,\n md: 8,\n sm: 4,\n xs: 4,\n };\n\n // Icon sizes from Figma design\n const iconSizeConfig = {\n xl: 18,\n lg: 18,\n md: 18,\n sm: 16,\n xs: 16,\n };\n\n // Focus outline config from Figma design\n const focusOutlineConfig = {\n xl: { width: 1, offset: -1 },\n lg: { width: 1, offset: -1 },\n md: { width: 1, offset: -1 },\n sm: { width: 1, offset: -1 },\n xs: { width: 1, offset: -1 },\n };\n\n const padding = paddingConfig[size];\n const borderRadius = borderRadiusConfig[size];\n const iconSize = iconSizeConfig[size];\n const focusOutline = focusOutlineConfig[size];\n\n return (\n <Box\n flexDirection=\"column\"\n gap={sizeStyles.fieldGap}\n width=\"100%\"\n testID={testID}\n >\n {label && (\n <Box as=\"label\" id={labelId}>\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\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n height={sizeStyles.height}\n paddingVertical={padding.vertical}\n paddingHorizontal={padding.horizontal}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={10}\n position=\"relative\"\n style={{\n borderTopLeftRadius: borderTopLeftRadiusOverride ?? borderRadius,\n borderTopRightRadius: borderTopRightRadiusOverride ?? borderRadius,\n borderBottomLeftRadius:\n borderBottomLeftRadiusOverride ?? borderRadius,\n borderBottomRightRadius:\n borderBottomRightRadiusOverride ?? borderRadius,\n ...(outlineColor\n ? {\n outline: `${focusOutline.width}px solid ${outlineColor}`,\n outlineOffset: `${focusOutline.offset}px`,\n }\n : {}),\n }}\n hoverStyle={\n !isDisable && !isFocus && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n {isLeftInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconSize} color={textColor}>\n {iconLeft}\n </Icon>\n </Box>\n )}\n\n <Box flex={1} height=\"100%\" justifyContent=\"center\">\n <InputPrimitive\n ref={inputRef}\n id={inputId}\n value={passValue}\n name={name}\n placeholder={placeholder}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n disabled={isDisable}\n type={type || \"text\"}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n placeholderTextColor={placeholderColor}\n aria-invalid={isError || undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n aria-disabled={isDisable || undefined}\n data-testid=\"input__field\"\n {...rest}\n />\n </Box>\n\n {/* Right-side Extras Wrapper */}\n {extrasCount > 0 && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={4}>\n {isExtraClearIconShown && (\n <Box\n as=\"button\"\n type=\"button\"\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n cursor={disabled ? \"not-allowed\" : \"pointer\"}\n onPress={!disabled ? handleClear : undefined}\n disabled={disabled}\n data-testid=\"input__extra-clear-button\"\n >\n <Icon size={iconSize} color={textColor}>\n <Remove />\n </Icon>\n </Box>\n )}\n {isCheckedShown && (\n <Box\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.success.primary}\n >\n {checkedIcon}\n </Icon>\n </Box>\n )}\n {isRightInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconRightSize || iconSize} color={textColor}>\n {iconRight}\n </Icon>\n </Box>\n )}\n </Box>\n )}\n </Box>\n\n {errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInput.displayName = \"Input\";\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 {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string | number | undefined\n): number | undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n style: styleProp,\n ...props\n}) => {\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n if (\n resolvedFontFamily === \"Pilat Wide\" ||\n resolvedFontFamily === \"Pilat Wide Bold\" ||\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const incomingStyle = StyleSheet.flatten(styleProp) as TextStyle | undefined;\n\n const baseStyle: TextStyle = {\n color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n textAlign: textAlign ?? incomingStyle?.textAlign,\n lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),\n marginTop: parseNumericValue(\n incomingStyle?.marginTop as number | string | undefined\n ),\n marginBottom: parseNumericValue(\n incomingStyle?.marginBottom as number | string | undefined\n ),\n };\n\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText\n style={baseStyle}\n numberOfLines={numberOfLines}\n testID={id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","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","import React, { forwardRef } from \"react\";\nimport { TextInput as RNTextInput } from \"react-native\";\nimport { InputPrimitiveProps } from \"@xsolla/xui-primitives-core\";\n\n// Map web input types to React Native keyboard types\nconst keyboardTypeMap: Record<string, any> = {\n text: \"default\",\n number: \"numeric\",\n email: \"email-address\",\n tel: \"phone-pad\",\n url: \"url\",\n decimal: \"decimal-pad\",\n};\n\n// Map web inputMode to React Native keyboard types\nconst inputModeToKeyboardType: Record<string, any> = {\n none: \"default\",\n text: \"default\",\n decimal: \"decimal-pad\",\n numeric: \"number-pad\",\n tel: \"phone-pad\",\n search: \"default\",\n email: \"email-address\",\n url: \"url\",\n};\n\n// Map web autoComplete to React Native textContentType (iOS)\nconst autoCompleteToTextContentType: Record<string, any> = {\n \"one-time-code\": \"oneTimeCode\",\n email: \"emailAddress\",\n username: \"username\",\n password: \"password\",\n \"new-password\": \"newPassword\",\n tel: \"telephoneNumber\",\n \"postal-code\": \"postalCode\",\n name: \"name\",\n};\n\nexport const InputPrimitive = forwardRef<RNTextInput, InputPrimitiveProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onFocus,\n onBlur,\n onKeyDown,\n disabled,\n secureTextEntry,\n style,\n color,\n fontSize,\n placeholderTextColor,\n maxLength,\n type,\n inputMode,\n autoComplete,\n id,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-label\": ariaLabel,\n \"aria-disabled\": ariaDisabled,\n \"data-testid\": dataTestId,\n },\n ref\n ) => {\n const handleChangeText = (text: string) => {\n onChangeText?.(text);\n\n // Create a synthetic event for onChange compatibility\n // Include nativeEvent and no-op methods to prevent runtime errors\n // when consumers expect DOM-like event behavior\n if (onChange) {\n const syntheticEvent = {\n target: { value: text },\n currentTarget: { value: text },\n type: \"change\",\n nativeEvent: { text },\n preventDefault: () => {},\n stopPropagation: () => {},\n isTrusted: false,\n } as unknown as React.ChangeEvent<HTMLInputElement>;\n onChange(syntheticEvent);\n }\n };\n\n // Determine keyboard type - inputMode takes precedence over type\n const keyboardType = inputMode\n ? inputModeToKeyboardType[inputMode] || \"default\"\n : type\n ? keyboardTypeMap[type] || \"default\"\n : \"default\";\n\n // Determine textContentType for iOS autofill\n const textContentType = autoComplete\n ? autoCompleteToTextContentType[autoComplete]\n : undefined;\n\n return (\n <RNTextInput\n ref={ref}\n value={value}\n placeholder={placeholder}\n onChangeText={handleChangeText}\n onFocus={onFocus}\n onBlur={onBlur}\n onKeyPress={(e) => {\n // Map onKeyPress to onKeyDown for cross-platform compatibility\n // Include preventDefault to avoid runtime errors when consumers call it\n if (onKeyDown) {\n onKeyDown({\n key: e.nativeEvent.key,\n preventDefault: () => {},\n } as any);\n }\n }}\n editable={!disabled}\n secureTextEntry={secureTextEntry || type === \"password\"}\n keyboardType={keyboardType}\n textContentType={textContentType}\n style={[\n {\n color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n flex: 1,\n padding: 0,\n textAlign: (style as any)?.textAlign || \"left\",\n },\n style as any,\n ]}\n placeholderTextColor={placeholderTextColor}\n maxLength={maxLength}\n // React Native accessibility props\n testID={dataTestId || id}\n accessibilityLabel={ariaLabel}\n accessibilityHint={ariaDescribedBy}\n accessibilityState={{\n disabled: disabled || ariaDisabled,\n }}\n accessible={true}\n />\n );\n }\n);\n\nInputPrimitive.displayName = \"InputPrimitive\";\n"],"mappings":"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","names":["import_react","import_react_native","import_jsx_runtime","RNText","import_react_native","import_jsx_runtime","React","import_react","import_react_native","import_jsx_runtime","RNTextInput","import_jsx_runtime","React"]}
package/native/index.mjs CHANGED
@@ -177,7 +177,10 @@ var Box = ({
177
177
  };
178
178
 
179
179
  // ../primitives-native/src/Text.tsx
180
- import { Text as RNText } from "react-native";
180
+ import {
181
+ Text as RNText,
182
+ StyleSheet
183
+ } from "react-native";
181
184
  import { jsx as jsx2 } from "react/jsx-runtime";
182
185
  var roleMap = {
183
186
  alert: "alert",
@@ -186,29 +189,57 @@ var roleMap = {
186
189
  link: "link",
187
190
  text: "text"
188
191
  };
192
+ var parseNumericValue = (value) => {
193
+ if (value === void 0) return void 0;
194
+ if (typeof value === "number") return value;
195
+ const parsed = parseFloat(value);
196
+ return isNaN(parsed) ? void 0 : parsed;
197
+ };
189
198
  var Text = ({
190
199
  children,
191
200
  color,
192
201
  fontSize,
193
202
  fontWeight,
194
203
  fontFamily,
204
+ textAlign,
205
+ lineHeight,
206
+ numberOfLines,
195
207
  id,
196
208
  role,
209
+ style: styleProp,
197
210
  ...props
198
211
  }) => {
199
212
  let resolvedFontFamily = fontFamily ? fontFamily.split(",")[0].replace(/['"]/g, "").trim() : void 0;
200
213
  if (resolvedFontFamily === "Pilat Wide" || resolvedFontFamily === "Pilat Wide Bold" || resolvedFontFamily === "Aktiv Grotesk") {
201
214
  resolvedFontFamily = void 0;
202
215
  }
203
- const style = {
216
+ const incomingStyle = StyleSheet.flatten(styleProp);
217
+ const baseStyle = {
204
218
  color,
205
219
  fontSize: typeof fontSize === "number" ? fontSize : void 0,
206
220
  fontWeight,
207
221
  fontFamily: resolvedFontFamily,
208
- textDecorationLine: props.textDecoration
222
+ textDecorationLine: props.textDecoration,
223
+ textAlign: textAlign ?? incomingStyle?.textAlign,
224
+ lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),
225
+ marginTop: parseNumericValue(
226
+ incomingStyle?.marginTop
227
+ ),
228
+ marginBottom: parseNumericValue(
229
+ incomingStyle?.marginBottom
230
+ )
209
231
  };
210
232
  const accessibilityRole = role ? roleMap[role] : void 0;
211
- return /* @__PURE__ */ jsx2(RNText, { style, testID: id, accessibilityRole, children });
233
+ return /* @__PURE__ */ jsx2(
234
+ RNText,
235
+ {
236
+ style: baseStyle,
237
+ numberOfLines,
238
+ testID: id,
239
+ accessibilityRole,
240
+ children
241
+ }
242
+ );
212
243
  };
213
244
 
214
245
  // ../primitives-native/src/Icon.tsx
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Input.tsx","../../../primitives-native/src/Box.tsx","../../../primitives-native/src/Text.tsx","../../../primitives-native/src/Icon.tsx","../../../primitives-native/src/Input.tsx"],"sourcesContent":["import React, {\n useState,\n forwardRef,\n useRef,\n useEffect,\n type InputHTMLAttributes,\n} from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon, InputPrimitive } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem, useId } from \"@xsolla/xui-core\";\nimport { CheckCr, Remove } from \"@xsolla/xui-icons-base\";\n\nexport interface InputProps extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"onChange\"\n> {\n /**\n * Property for specifying the value of the control.\n */\n value?: string;\n /**\n * Property for specifying the placeholder of the control.\n */\n placeholder?: string;\n /**\n * Event handler when the value changes (for controlled mode).\n */\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /**\n * Event handler when the text changes (alternative to onChange).\n */\n onChangeText?: (text: string) => void;\n /**\n * Property for changing the size of the input.\n */\n size?: \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n /**\n * Property for disabling the control.\n */\n disabled?: boolean;\n /**\n * Property for displaying a label above the input.\n */\n label?: string;\n /**\n * Property for displaying an error message and highlighting the control as invalid.\n */\n errorMessage?: string;\n /**\n * Property for displaying an error and highlighting the control as invalid.\n */\n error?: boolean;\n /**\n * Property to display an icon on the left side.\n */\n iconLeft?: React.ReactNode;\n /**\n * Property to display an icon on the right side.\n */\n iconRight?: React.ReactNode;\n /**\n * Add function clear for input.\n */\n extraClear?: boolean;\n /**\n * Function triggered when user clicks on extraClear button.\n */\n onRemove?: () => void;\n /**\n * Property for show checked status in input. Show only if not errorMessage.\n */\n checked?: boolean;\n /**\n * Property for passing a new icon to replace the default checked icon.\n */\n checkedIcon?: React.ReactNode;\n /**\n * Property to specify the size of the right icon.\n */\n iconRightSize?: number | string;\n /**\n * Unique identifier for the input element. Used for accessibility linking.\n */\n id?: string;\n /**\n * Accessible label for screen readers when no visible label is present.\n */\n \"aria-label\"?: string;\n /**\n * Override border radius for top-left corner.\n */\n borderTopLeftRadius?: number;\n /**\n * Override border radius for top-right corner.\n */\n borderTopRightRadius?: number;\n /**\n * Override border radius for bottom-left corner.\n */\n borderBottomLeftRadius?: number;\n /**\n * Override border radius for bottom-right corner.\n */\n borderBottomRightRadius?: number;\n /**\n * Custom background color for the input.\n */\n backgroundColor?: string;\n /**\n * Test identifier for the input.\n */\n testID?: string;\n}\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onKeyDown,\n size = \"md\",\n disabled = false,\n name,\n label,\n errorMessage,\n error,\n iconLeft,\n iconRight,\n iconRightSize,\n extraClear = false,\n onRemove,\n checked = false,\n checkedIcon = <CheckCr />,\n type,\n id: providedId,\n \"aria-label\": ariaLabel,\n borderTopLeftRadius: borderTopLeftRadiusOverride,\n borderTopRightRadius: borderTopRightRadiusOverride,\n borderBottomLeftRadius: borderBottomLeftRadiusOverride,\n borderBottomRightRadius: borderBottomRightRadiusOverride,\n backgroundColor: backgroundColorProp,\n testID,\n onBlur: externalOnBlur,\n onFocus: externalOnFocus,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [internalState, setInternalState] = useState<\"default\" | \"focus\">(\n \"default\"\n );\n // Internal value state - mimics useUpdatableState from switch-repo\n const [passValue, setPassValue] = useState(value ?? \"\");\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n // Sanitize useId() output to remove colons (e.g., :r0: -> r0)\n // This ensures valid HTML id attributes and ARIA references\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-${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 passValue with value prop when it changes (like useUpdatableState)\n useEffect(() => {\n if (value !== undefined) {\n setPassValue(value);\n }\n }, [value]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const isFocus = internalState === \"focus\";\n\n const isLeftInputIconShown = !!iconLeft;\n const isRightInputIconShown = !!iconRight;\n\n // Handle checked status (only show if not error)\n const isCheckedShown = checked && !errorMessage;\n // Clear button visibility depends on internal state\n const isExtraClearIconShown = !disabled && extraClear && !!passValue;\n const extrasCount =\n Number(isExtraClearIconShown) +\n Number(isCheckedShown) +\n Number(isRightInputIconShown);\n\n // Resolve Config from Theme\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"focus\");\n }\n externalOnFocus?.(e);\n };\n\n const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"default\");\n }\n externalOnBlur?.(e);\n };\n\n // Match switch-repo handleChange pattern exactly\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n\n // If onChange is provided (controlled mode), call it\n // But ALWAYS update internal state for clear button visibility\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(newValue);\n }\n\n // Always update internal state (this is key for uncontrolled mode in Storybook)\n setPassValue(newValue);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"Escape\") {\n e.currentTarget.blur();\n }\n if (onKeyDown) {\n onKeyDown(e);\n }\n };\n\n // Match switch-repo onClear pattern - NO direct DOM manipulation\n const handleClear = (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n\n // Update internal state first (this makes the input show empty)\n setPassValue(\"\");\n\n // Call onRemove callback\n onRemove?.();\n\n // Create synthetic change event and call onChange if provided\n if (inputRef.current) {\n // Web-specific: Use the native setter to properly set the value\n // without shadowing the property (only on web platform)\n if (typeof window !== \"undefined\" && window.HTMLInputElement) {\n const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n window.HTMLInputElement.prototype,\n \"value\"\n )?.set;\n\n if (nativeInputValueSetter) {\n nativeInputValueSetter.call(inputRef.current, \"\");\n }\n }\n\n // Create a proper synthetic event\n const syntheticEvent = {\n target: inputRef.current,\n currentTarget: inputRef.current,\n type: \"change\",\n } as React.ChangeEvent<HTMLInputElement>;\n\n onChange?.(syntheticEvent);\n inputRef.current.focus();\n }\n };\n\n // Resolve background and border colors based on state\n let backgroundColor = backgroundColorProp || inputColors.bg;\n let borderColor = inputColors.border;\n let outlineColor: string | undefined;\n\n if (isDisable) {\n backgroundColor = inputColors.bgDisable;\n borderColor = inputColors.borderDisable;\n } else if (isError) {\n outlineColor = theme.colors.border.alert;\n if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n }\n } else if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n outlineColor = theme.colors.border.brand;\n }\n\n const textColor = isDisable ? inputColors.textDisable : inputColors.text;\n const placeholderColor = inputColors.placeholder;\n\n // Padding values from Figma design\n const paddingConfig = {\n xl: { vertical: 12, horizontal: 12 },\n lg: { vertical: 14, horizontal: 12 },\n md: { vertical: 11, horizontal: 12 },\n sm: { vertical: 7, horizontal: 10 },\n xs: { vertical: 7, horizontal: 10 },\n };\n\n // Border radius from Figma design\n const borderRadiusConfig = {\n xl: 8,\n lg: 8,\n md: 8,\n sm: 4,\n xs: 4,\n };\n\n // Icon sizes from Figma design\n const iconSizeConfig = {\n xl: 18,\n lg: 18,\n md: 18,\n sm: 16,\n xs: 16,\n };\n\n // Focus outline config from Figma design\n const focusOutlineConfig = {\n xl: { width: 1, offset: -1 },\n lg: { width: 1, offset: -1 },\n md: { width: 1, offset: -1 },\n sm: { width: 1, offset: -1 },\n xs: { width: 1, offset: -1 },\n };\n\n const padding = paddingConfig[size];\n const borderRadius = borderRadiusConfig[size];\n const iconSize = iconSizeConfig[size];\n const focusOutline = focusOutlineConfig[size];\n\n return (\n <Box\n flexDirection=\"column\"\n gap={sizeStyles.fieldGap}\n width=\"100%\"\n testID={testID}\n >\n {label && (\n <Box as=\"label\" id={labelId}>\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\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n height={sizeStyles.height}\n paddingVertical={padding.vertical}\n paddingHorizontal={padding.horizontal}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={10}\n position=\"relative\"\n style={{\n borderTopLeftRadius: borderTopLeftRadiusOverride ?? borderRadius,\n borderTopRightRadius: borderTopRightRadiusOverride ?? borderRadius,\n borderBottomLeftRadius:\n borderBottomLeftRadiusOverride ?? borderRadius,\n borderBottomRightRadius:\n borderBottomRightRadiusOverride ?? borderRadius,\n ...(outlineColor\n ? {\n outline: `${focusOutline.width}px solid ${outlineColor}`,\n outlineOffset: `${focusOutline.offset}px`,\n }\n : {}),\n }}\n hoverStyle={\n !isDisable && !isFocus && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n {isLeftInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconSize} color={textColor}>\n {iconLeft}\n </Icon>\n </Box>\n )}\n\n <Box flex={1} height=\"100%\" justifyContent=\"center\">\n <InputPrimitive\n ref={inputRef}\n id={inputId}\n value={passValue}\n name={name}\n placeholder={placeholder}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n disabled={isDisable}\n type={type || \"text\"}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n placeholderTextColor={placeholderColor}\n aria-invalid={isError || undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n aria-disabled={isDisable || undefined}\n data-testid=\"input__field\"\n {...rest}\n />\n </Box>\n\n {/* Right-side Extras Wrapper */}\n {extrasCount > 0 && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={4}>\n {isExtraClearIconShown && (\n <Box\n as=\"button\"\n type=\"button\"\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n cursor={disabled ? \"not-allowed\" : \"pointer\"}\n onPress={!disabled ? handleClear : undefined}\n disabled={disabled}\n data-testid=\"input__extra-clear-button\"\n >\n <Icon size={iconSize} color={textColor}>\n <Remove />\n </Icon>\n </Box>\n )}\n {isCheckedShown && (\n <Box\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.success.primary}\n >\n {checkedIcon}\n </Icon>\n </Box>\n )}\n {isRightInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconRightSize || iconSize} color={textColor}>\n {iconRight}\n </Icon>\n </Box>\n )}\n </Box>\n )}\n </Box>\n\n {errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInput.displayName = \"Input\";\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","import React, { forwardRef } from \"react\";\nimport { TextInput as RNTextInput } from \"react-native\";\nimport { InputPrimitiveProps } from \"@xsolla/xui-primitives-core\";\n\n// Map web input types to React Native keyboard types\nconst keyboardTypeMap: Record<string, any> = {\n text: \"default\",\n number: \"numeric\",\n email: \"email-address\",\n tel: \"phone-pad\",\n url: \"url\",\n decimal: \"decimal-pad\",\n};\n\n// Map web inputMode to React Native keyboard types\nconst inputModeToKeyboardType: Record<string, any> = {\n none: \"default\",\n text: \"default\",\n decimal: \"decimal-pad\",\n numeric: \"number-pad\",\n tel: \"phone-pad\",\n search: \"default\",\n email: \"email-address\",\n url: \"url\",\n};\n\n// Map web autoComplete to React Native textContentType (iOS)\nconst autoCompleteToTextContentType: Record<string, any> = {\n \"one-time-code\": \"oneTimeCode\",\n email: \"emailAddress\",\n username: \"username\",\n password: \"password\",\n \"new-password\": \"newPassword\",\n tel: \"telephoneNumber\",\n \"postal-code\": \"postalCode\",\n name: \"name\",\n};\n\nexport const InputPrimitive = forwardRef<RNTextInput, InputPrimitiveProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onFocus,\n onBlur,\n onKeyDown,\n disabled,\n secureTextEntry,\n style,\n color,\n fontSize,\n placeholderTextColor,\n maxLength,\n type,\n inputMode,\n autoComplete,\n id,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-label\": ariaLabel,\n \"aria-disabled\": ariaDisabled,\n \"data-testid\": dataTestId,\n },\n ref\n ) => {\n const handleChangeText = (text: string) => {\n onChangeText?.(text);\n\n // Create a synthetic event for onChange compatibility\n // Include nativeEvent and no-op methods to prevent runtime errors\n // when consumers expect DOM-like event behavior\n if (onChange) {\n const syntheticEvent = {\n target: { value: text },\n currentTarget: { value: text },\n type: \"change\",\n nativeEvent: { text },\n preventDefault: () => {},\n stopPropagation: () => {},\n isTrusted: false,\n } as unknown as React.ChangeEvent<HTMLInputElement>;\n onChange(syntheticEvent);\n }\n };\n\n // Determine keyboard type - inputMode takes precedence over type\n const keyboardType = inputMode\n ? inputModeToKeyboardType[inputMode] || \"default\"\n : type\n ? keyboardTypeMap[type] || \"default\"\n : \"default\";\n\n // Determine textContentType for iOS autofill\n const textContentType = autoComplete\n ? autoCompleteToTextContentType[autoComplete]\n : undefined;\n\n return (\n <RNTextInput\n ref={ref}\n value={value}\n placeholder={placeholder}\n onChangeText={handleChangeText}\n onFocus={onFocus}\n onBlur={onBlur}\n onKeyPress={(e) => {\n // Map onKeyPress to onKeyDown for cross-platform compatibility\n // Include preventDefault to avoid runtime errors when consumers call it\n if (onKeyDown) {\n onKeyDown({\n key: e.nativeEvent.key,\n preventDefault: () => {},\n } as any);\n }\n }}\n editable={!disabled}\n secureTextEntry={secureTextEntry || type === \"password\"}\n keyboardType={keyboardType}\n textContentType={textContentType}\n style={[\n {\n color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n flex: 1,\n padding: 0,\n textAlign: (style as any)?.textAlign || \"left\",\n },\n style as any,\n ]}\n placeholderTextColor={placeholderTextColor}\n maxLength={maxLength}\n // React Native accessibility props\n testID={dataTestId || id}\n accessibilityLabel={ariaLabel}\n accessibilityHint={ariaDescribedBy}\n accessibilityState={{\n disabled: disabled || ariaDisabled,\n }}\n accessible={true}\n />\n );\n }\n);\n\nInputPrimitive.displayName = \"InputPrimitive\";\n"],"mappings":"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","names":["React","forwardRef","jsx","View","jsx","jsx","jsx","forwardRef","React"]}
1
+ {"version":3,"sources":["../../src/Input.tsx","../../../primitives-native/src/Box.tsx","../../../primitives-native/src/Text.tsx","../../../primitives-native/src/Icon.tsx","../../../primitives-native/src/Input.tsx"],"sourcesContent":["import React, {\n useState,\n forwardRef,\n useRef,\n useEffect,\n type InputHTMLAttributes,\n} from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon, InputPrimitive } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem, useId } from \"@xsolla/xui-core\";\nimport { CheckCr, Remove } from \"@xsolla/xui-icons-base\";\n\nexport interface InputProps extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"onChange\"\n> {\n /**\n * Property for specifying the value of the control.\n */\n value?: string;\n /**\n * Property for specifying the placeholder of the control.\n */\n placeholder?: string;\n /**\n * Event handler when the value changes (for controlled mode).\n */\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /**\n * Event handler when the text changes (alternative to onChange).\n */\n onChangeText?: (text: string) => void;\n /**\n * Property for changing the size of the input.\n */\n size?: \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n /**\n * Property for disabling the control.\n */\n disabled?: boolean;\n /**\n * Property for displaying a label above the input.\n */\n label?: string;\n /**\n * Property for displaying an error message and highlighting the control as invalid.\n */\n errorMessage?: string;\n /**\n * Property for displaying an error and highlighting the control as invalid.\n */\n error?: boolean;\n /**\n * Property to display an icon on the left side.\n */\n iconLeft?: React.ReactNode;\n /**\n * Property to display an icon on the right side.\n */\n iconRight?: React.ReactNode;\n /**\n * Add function clear for input.\n */\n extraClear?: boolean;\n /**\n * Function triggered when user clicks on extraClear button.\n */\n onRemove?: () => void;\n /**\n * Property for show checked status in input. Show only if not errorMessage.\n */\n checked?: boolean;\n /**\n * Property for passing a new icon to replace the default checked icon.\n */\n checkedIcon?: React.ReactNode;\n /**\n * Property to specify the size of the right icon.\n */\n iconRightSize?: number | string;\n /**\n * Unique identifier for the input element. Used for accessibility linking.\n */\n id?: string;\n /**\n * Accessible label for screen readers when no visible label is present.\n */\n \"aria-label\"?: string;\n /**\n * Override border radius for top-left corner.\n */\n borderTopLeftRadius?: number;\n /**\n * Override border radius for top-right corner.\n */\n borderTopRightRadius?: number;\n /**\n * Override border radius for bottom-left corner.\n */\n borderBottomLeftRadius?: number;\n /**\n * Override border radius for bottom-right corner.\n */\n borderBottomRightRadius?: number;\n /**\n * Custom background color for the input.\n */\n backgroundColor?: string;\n /**\n * Test identifier for the input.\n */\n testID?: string;\n}\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onKeyDown,\n size = \"md\",\n disabled = false,\n name,\n label,\n errorMessage,\n error,\n iconLeft,\n iconRight,\n iconRightSize,\n extraClear = false,\n onRemove,\n checked = false,\n checkedIcon = <CheckCr />,\n type,\n id: providedId,\n \"aria-label\": ariaLabel,\n borderTopLeftRadius: borderTopLeftRadiusOverride,\n borderTopRightRadius: borderTopRightRadiusOverride,\n borderBottomLeftRadius: borderBottomLeftRadiusOverride,\n borderBottomRightRadius: borderBottomRightRadiusOverride,\n backgroundColor: backgroundColorProp,\n testID,\n onBlur: externalOnBlur,\n onFocus: externalOnFocus,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [internalState, setInternalState] = useState<\"default\" | \"focus\">(\n \"default\"\n );\n // Internal value state - mimics useUpdatableState from switch-repo\n const [passValue, setPassValue] = useState(value ?? \"\");\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n // Sanitize useId() output to remove colons (e.g., :r0: -> r0)\n // This ensures valid HTML id attributes and ARIA references\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-${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 passValue with value prop when it changes (like useUpdatableState)\n useEffect(() => {\n if (value !== undefined) {\n setPassValue(value);\n }\n }, [value]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const isFocus = internalState === \"focus\";\n\n const isLeftInputIconShown = !!iconLeft;\n const isRightInputIconShown = !!iconRight;\n\n // Handle checked status (only show if not error)\n const isCheckedShown = checked && !errorMessage;\n // Clear button visibility depends on internal state\n const isExtraClearIconShown = !disabled && extraClear && !!passValue;\n const extrasCount =\n Number(isExtraClearIconShown) +\n Number(isCheckedShown) +\n Number(isRightInputIconShown);\n\n // Resolve Config from Theme\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"focus\");\n }\n externalOnFocus?.(e);\n };\n\n const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"default\");\n }\n externalOnBlur?.(e);\n };\n\n // Match switch-repo handleChange pattern exactly\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n\n // If onChange is provided (controlled mode), call it\n // But ALWAYS update internal state for clear button visibility\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(newValue);\n }\n\n // Always update internal state (this is key for uncontrolled mode in Storybook)\n setPassValue(newValue);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"Escape\") {\n e.currentTarget.blur();\n }\n if (onKeyDown) {\n onKeyDown(e);\n }\n };\n\n // Match switch-repo onClear pattern - NO direct DOM manipulation\n const handleClear = (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n\n // Update internal state first (this makes the input show empty)\n setPassValue(\"\");\n\n // Call onRemove callback\n onRemove?.();\n\n // Create synthetic change event and call onChange if provided\n if (inputRef.current) {\n // Web-specific: Use the native setter to properly set the value\n // without shadowing the property (only on web platform)\n if (typeof window !== \"undefined\" && window.HTMLInputElement) {\n const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n window.HTMLInputElement.prototype,\n \"value\"\n )?.set;\n\n if (nativeInputValueSetter) {\n nativeInputValueSetter.call(inputRef.current, \"\");\n }\n }\n\n // Create a proper synthetic event\n const syntheticEvent = {\n target: inputRef.current,\n currentTarget: inputRef.current,\n type: \"change\",\n } as React.ChangeEvent<HTMLInputElement>;\n\n onChange?.(syntheticEvent);\n inputRef.current.focus();\n }\n };\n\n // Resolve background and border colors based on state\n let backgroundColor = backgroundColorProp || inputColors.bg;\n let borderColor = inputColors.border;\n let outlineColor: string | undefined;\n\n if (isDisable) {\n backgroundColor = inputColors.bgDisable;\n borderColor = inputColors.borderDisable;\n } else if (isError) {\n outlineColor = theme.colors.border.alert;\n if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n }\n } else if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n outlineColor = theme.colors.border.brand;\n }\n\n const textColor = isDisable ? inputColors.textDisable : inputColors.text;\n const placeholderColor = inputColors.placeholder;\n\n // Padding values from Figma design\n const paddingConfig = {\n xl: { vertical: 12, horizontal: 12 },\n lg: { vertical: 14, horizontal: 12 },\n md: { vertical: 11, horizontal: 12 },\n sm: { vertical: 7, horizontal: 10 },\n xs: { vertical: 7, horizontal: 10 },\n };\n\n // Border radius from Figma design\n const borderRadiusConfig = {\n xl: 8,\n lg: 8,\n md: 8,\n sm: 4,\n xs: 4,\n };\n\n // Icon sizes from Figma design\n const iconSizeConfig = {\n xl: 18,\n lg: 18,\n md: 18,\n sm: 16,\n xs: 16,\n };\n\n // Focus outline config from Figma design\n const focusOutlineConfig = {\n xl: { width: 1, offset: -1 },\n lg: { width: 1, offset: -1 },\n md: { width: 1, offset: -1 },\n sm: { width: 1, offset: -1 },\n xs: { width: 1, offset: -1 },\n };\n\n const padding = paddingConfig[size];\n const borderRadius = borderRadiusConfig[size];\n const iconSize = iconSizeConfig[size];\n const focusOutline = focusOutlineConfig[size];\n\n return (\n <Box\n flexDirection=\"column\"\n gap={sizeStyles.fieldGap}\n width=\"100%\"\n testID={testID}\n >\n {label && (\n <Box as=\"label\" id={labelId}>\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\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n height={sizeStyles.height}\n paddingVertical={padding.vertical}\n paddingHorizontal={padding.horizontal}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={10}\n position=\"relative\"\n style={{\n borderTopLeftRadius: borderTopLeftRadiusOverride ?? borderRadius,\n borderTopRightRadius: borderTopRightRadiusOverride ?? borderRadius,\n borderBottomLeftRadius:\n borderBottomLeftRadiusOverride ?? borderRadius,\n borderBottomRightRadius:\n borderBottomRightRadiusOverride ?? borderRadius,\n ...(outlineColor\n ? {\n outline: `${focusOutline.width}px solid ${outlineColor}`,\n outlineOffset: `${focusOutline.offset}px`,\n }\n : {}),\n }}\n hoverStyle={\n !isDisable && !isFocus && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n {isLeftInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconSize} color={textColor}>\n {iconLeft}\n </Icon>\n </Box>\n )}\n\n <Box flex={1} height=\"100%\" justifyContent=\"center\">\n <InputPrimitive\n ref={inputRef}\n id={inputId}\n value={passValue}\n name={name}\n placeholder={placeholder}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n disabled={isDisable}\n type={type || \"text\"}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n placeholderTextColor={placeholderColor}\n aria-invalid={isError || undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n aria-disabled={isDisable || undefined}\n data-testid=\"input__field\"\n {...rest}\n />\n </Box>\n\n {/* Right-side Extras Wrapper */}\n {extrasCount > 0 && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={4}>\n {isExtraClearIconShown && (\n <Box\n as=\"button\"\n type=\"button\"\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n cursor={disabled ? \"not-allowed\" : \"pointer\"}\n onPress={!disabled ? handleClear : undefined}\n disabled={disabled}\n data-testid=\"input__extra-clear-button\"\n >\n <Icon size={iconSize} color={textColor}>\n <Remove />\n </Icon>\n </Box>\n )}\n {isCheckedShown && (\n <Box\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.success.primary}\n >\n {checkedIcon}\n </Icon>\n </Box>\n )}\n {isRightInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconRightSize || iconSize} color={textColor}>\n {iconRight}\n </Icon>\n </Box>\n )}\n </Box>\n )}\n </Box>\n\n {errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInput.displayName = \"Input\";\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 {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string | number | undefined\n): number | undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n style: styleProp,\n ...props\n}) => {\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n if (\n resolvedFontFamily === \"Pilat Wide\" ||\n resolvedFontFamily === \"Pilat Wide Bold\" ||\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const incomingStyle = StyleSheet.flatten(styleProp) as TextStyle | undefined;\n\n const baseStyle: TextStyle = {\n color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n textAlign: textAlign ?? incomingStyle?.textAlign,\n lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),\n marginTop: parseNumericValue(\n incomingStyle?.marginTop as number | string | undefined\n ),\n marginBottom: parseNumericValue(\n incomingStyle?.marginBottom as number | string | undefined\n ),\n };\n\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText\n style={baseStyle}\n numberOfLines={numberOfLines}\n testID={id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","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","import React, { forwardRef } from \"react\";\nimport { TextInput as RNTextInput } from \"react-native\";\nimport { InputPrimitiveProps } from \"@xsolla/xui-primitives-core\";\n\n// Map web input types to React Native keyboard types\nconst keyboardTypeMap: Record<string, any> = {\n text: \"default\",\n number: \"numeric\",\n email: \"email-address\",\n tel: \"phone-pad\",\n url: \"url\",\n decimal: \"decimal-pad\",\n};\n\n// Map web inputMode to React Native keyboard types\nconst inputModeToKeyboardType: Record<string, any> = {\n none: \"default\",\n text: \"default\",\n decimal: \"decimal-pad\",\n numeric: \"number-pad\",\n tel: \"phone-pad\",\n search: \"default\",\n email: \"email-address\",\n url: \"url\",\n};\n\n// Map web autoComplete to React Native textContentType (iOS)\nconst autoCompleteToTextContentType: Record<string, any> = {\n \"one-time-code\": \"oneTimeCode\",\n email: \"emailAddress\",\n username: \"username\",\n password: \"password\",\n \"new-password\": \"newPassword\",\n tel: \"telephoneNumber\",\n \"postal-code\": \"postalCode\",\n name: \"name\",\n};\n\nexport const InputPrimitive = forwardRef<RNTextInput, InputPrimitiveProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onFocus,\n onBlur,\n onKeyDown,\n disabled,\n secureTextEntry,\n style,\n color,\n fontSize,\n placeholderTextColor,\n maxLength,\n type,\n inputMode,\n autoComplete,\n id,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-label\": ariaLabel,\n \"aria-disabled\": ariaDisabled,\n \"data-testid\": dataTestId,\n },\n ref\n ) => {\n const handleChangeText = (text: string) => {\n onChangeText?.(text);\n\n // Create a synthetic event for onChange compatibility\n // Include nativeEvent and no-op methods to prevent runtime errors\n // when consumers expect DOM-like event behavior\n if (onChange) {\n const syntheticEvent = {\n target: { value: text },\n currentTarget: { value: text },\n type: \"change\",\n nativeEvent: { text },\n preventDefault: () => {},\n stopPropagation: () => {},\n isTrusted: false,\n } as unknown as React.ChangeEvent<HTMLInputElement>;\n onChange(syntheticEvent);\n }\n };\n\n // Determine keyboard type - inputMode takes precedence over type\n const keyboardType = inputMode\n ? inputModeToKeyboardType[inputMode] || \"default\"\n : type\n ? keyboardTypeMap[type] || \"default\"\n : \"default\";\n\n // Determine textContentType for iOS autofill\n const textContentType = autoComplete\n ? autoCompleteToTextContentType[autoComplete]\n : undefined;\n\n return (\n <RNTextInput\n ref={ref}\n value={value}\n placeholder={placeholder}\n onChangeText={handleChangeText}\n onFocus={onFocus}\n onBlur={onBlur}\n onKeyPress={(e) => {\n // Map onKeyPress to onKeyDown for cross-platform compatibility\n // Include preventDefault to avoid runtime errors when consumers call it\n if (onKeyDown) {\n onKeyDown({\n key: e.nativeEvent.key,\n preventDefault: () => {},\n } as any);\n }\n }}\n editable={!disabled}\n secureTextEntry={secureTextEntry || type === \"password\"}\n keyboardType={keyboardType}\n textContentType={textContentType}\n style={[\n {\n color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n flex: 1,\n padding: 0,\n textAlign: (style as any)?.textAlign || \"left\",\n },\n style as any,\n ]}\n placeholderTextColor={placeholderTextColor}\n maxLength={maxLength}\n // React Native accessibility props\n testID={dataTestId || id}\n accessibilityLabel={ariaLabel}\n accessibilityHint={ariaDescribedBy}\n accessibilityState={{\n disabled: disabled || ariaDisabled,\n }}\n accessible={true}\n />\n );\n }\n);\n\nInputPrimitive.displayName = \"InputPrimitive\";\n"],"mappings":"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","names":["React","forwardRef","jsx","View","jsx","jsx","jsx","forwardRef","React"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@xsolla/xui-input",
3
- "version": "0.112.0",
3
+ "version": "0.114.0",
4
4
  "main": "./web/index.js",
5
5
  "module": "./web/index.mjs",
6
6
  "types": "./web/index.d.ts",
@@ -13,9 +13,9 @@
13
13
  "test:coverage": "vitest run --coverage"
14
14
  },
15
15
  "dependencies": {
16
- "@xsolla/xui-core": "0.112.0",
17
- "@xsolla/xui-icons-base": "0.112.0",
18
- "@xsolla/xui-primitives-core": "0.112.0"
16
+ "@xsolla/xui-core": "0.114.0",
17
+ "@xsolla/xui-icons-base": "0.114.0",
18
+ "@xsolla/xui-primitives-core": "0.114.0"
19
19
  },
20
20
  "peerDependencies": {
21
21
  "react": ">=16.8.0",
package/web/index.js CHANGED
@@ -224,6 +224,7 @@ var Text = ({
224
224
  className,
225
225
  id,
226
226
  role,
227
+ numberOfLines: _numberOfLines,
227
228
  ...props
228
229
  }) => {
229
230
  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
package/web/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.tsx","../../src/Input.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx","../../../primitives-web/src/Icon.tsx","../../../primitives-web/src/Input.tsx"],"sourcesContent":["export * from \"./Input\";\n","import React, {\n useState,\n forwardRef,\n useRef,\n useEffect,\n type InputHTMLAttributes,\n} from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon, InputPrimitive } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem, useId } from \"@xsolla/xui-core\";\nimport { CheckCr, Remove } from \"@xsolla/xui-icons-base\";\n\nexport interface InputProps extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"onChange\"\n> {\n /**\n * Property for specifying the value of the control.\n */\n value?: string;\n /**\n * Property for specifying the placeholder of the control.\n */\n placeholder?: string;\n /**\n * Event handler when the value changes (for controlled mode).\n */\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /**\n * Event handler when the text changes (alternative to onChange).\n */\n onChangeText?: (text: string) => void;\n /**\n * Property for changing the size of the input.\n */\n size?: \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n /**\n * Property for disabling the control.\n */\n disabled?: boolean;\n /**\n * Property for displaying a label above the input.\n */\n label?: string;\n /**\n * Property for displaying an error message and highlighting the control as invalid.\n */\n errorMessage?: string;\n /**\n * Property for displaying an error and highlighting the control as invalid.\n */\n error?: boolean;\n /**\n * Property to display an icon on the left side.\n */\n iconLeft?: React.ReactNode;\n /**\n * Property to display an icon on the right side.\n */\n iconRight?: React.ReactNode;\n /**\n * Add function clear for input.\n */\n extraClear?: boolean;\n /**\n * Function triggered when user clicks on extraClear button.\n */\n onRemove?: () => void;\n /**\n * Property for show checked status in input. Show only if not errorMessage.\n */\n checked?: boolean;\n /**\n * Property for passing a new icon to replace the default checked icon.\n */\n checkedIcon?: React.ReactNode;\n /**\n * Property to specify the size of the right icon.\n */\n iconRightSize?: number | string;\n /**\n * Unique identifier for the input element. Used for accessibility linking.\n */\n id?: string;\n /**\n * Accessible label for screen readers when no visible label is present.\n */\n \"aria-label\"?: string;\n /**\n * Override border radius for top-left corner.\n */\n borderTopLeftRadius?: number;\n /**\n * Override border radius for top-right corner.\n */\n borderTopRightRadius?: number;\n /**\n * Override border radius for bottom-left corner.\n */\n borderBottomLeftRadius?: number;\n /**\n * Override border radius for bottom-right corner.\n */\n borderBottomRightRadius?: number;\n /**\n * Custom background color for the input.\n */\n backgroundColor?: string;\n /**\n * Test identifier for the input.\n */\n testID?: string;\n}\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onKeyDown,\n size = \"md\",\n disabled = false,\n name,\n label,\n errorMessage,\n error,\n iconLeft,\n iconRight,\n iconRightSize,\n extraClear = false,\n onRemove,\n checked = false,\n checkedIcon = <CheckCr />,\n type,\n id: providedId,\n \"aria-label\": ariaLabel,\n borderTopLeftRadius: borderTopLeftRadiusOverride,\n borderTopRightRadius: borderTopRightRadiusOverride,\n borderBottomLeftRadius: borderBottomLeftRadiusOverride,\n borderBottomRightRadius: borderBottomRightRadiusOverride,\n backgroundColor: backgroundColorProp,\n testID,\n onBlur: externalOnBlur,\n onFocus: externalOnFocus,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [internalState, setInternalState] = useState<\"default\" | \"focus\">(\n \"default\"\n );\n // Internal value state - mimics useUpdatableState from switch-repo\n const [passValue, setPassValue] = useState(value ?? \"\");\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n // Sanitize useId() output to remove colons (e.g., :r0: -> r0)\n // This ensures valid HTML id attributes and ARIA references\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-${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 passValue with value prop when it changes (like useUpdatableState)\n useEffect(() => {\n if (value !== undefined) {\n setPassValue(value);\n }\n }, [value]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const isFocus = internalState === \"focus\";\n\n const isLeftInputIconShown = !!iconLeft;\n const isRightInputIconShown = !!iconRight;\n\n // Handle checked status (only show if not error)\n const isCheckedShown = checked && !errorMessage;\n // Clear button visibility depends on internal state\n const isExtraClearIconShown = !disabled && extraClear && !!passValue;\n const extrasCount =\n Number(isExtraClearIconShown) +\n Number(isCheckedShown) +\n Number(isRightInputIconShown);\n\n // Resolve Config from Theme\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"focus\");\n }\n externalOnFocus?.(e);\n };\n\n const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"default\");\n }\n externalOnBlur?.(e);\n };\n\n // Match switch-repo handleChange pattern exactly\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n\n // If onChange is provided (controlled mode), call it\n // But ALWAYS update internal state for clear button visibility\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(newValue);\n }\n\n // Always update internal state (this is key for uncontrolled mode in Storybook)\n setPassValue(newValue);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"Escape\") {\n e.currentTarget.blur();\n }\n if (onKeyDown) {\n onKeyDown(e);\n }\n };\n\n // Match switch-repo onClear pattern - NO direct DOM manipulation\n const handleClear = (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n\n // Update internal state first (this makes the input show empty)\n setPassValue(\"\");\n\n // Call onRemove callback\n onRemove?.();\n\n // Create synthetic change event and call onChange if provided\n if (inputRef.current) {\n // Web-specific: Use the native setter to properly set the value\n // without shadowing the property (only on web platform)\n if (typeof window !== \"undefined\" && window.HTMLInputElement) {\n const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n window.HTMLInputElement.prototype,\n \"value\"\n )?.set;\n\n if (nativeInputValueSetter) {\n nativeInputValueSetter.call(inputRef.current, \"\");\n }\n }\n\n // Create a proper synthetic event\n const syntheticEvent = {\n target: inputRef.current,\n currentTarget: inputRef.current,\n type: \"change\",\n } as React.ChangeEvent<HTMLInputElement>;\n\n onChange?.(syntheticEvent);\n inputRef.current.focus();\n }\n };\n\n // Resolve background and border colors based on state\n let backgroundColor = backgroundColorProp || inputColors.bg;\n let borderColor = inputColors.border;\n let outlineColor: string | undefined;\n\n if (isDisable) {\n backgroundColor = inputColors.bgDisable;\n borderColor = inputColors.borderDisable;\n } else if (isError) {\n outlineColor = theme.colors.border.alert;\n if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n }\n } else if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n outlineColor = theme.colors.border.brand;\n }\n\n const textColor = isDisable ? inputColors.textDisable : inputColors.text;\n const placeholderColor = inputColors.placeholder;\n\n // Padding values from Figma design\n const paddingConfig = {\n xl: { vertical: 12, horizontal: 12 },\n lg: { vertical: 14, horizontal: 12 },\n md: { vertical: 11, horizontal: 12 },\n sm: { vertical: 7, horizontal: 10 },\n xs: { vertical: 7, horizontal: 10 },\n };\n\n // Border radius from Figma design\n const borderRadiusConfig = {\n xl: 8,\n lg: 8,\n md: 8,\n sm: 4,\n xs: 4,\n };\n\n // Icon sizes from Figma design\n const iconSizeConfig = {\n xl: 18,\n lg: 18,\n md: 18,\n sm: 16,\n xs: 16,\n };\n\n // Focus outline config from Figma design\n const focusOutlineConfig = {\n xl: { width: 1, offset: -1 },\n lg: { width: 1, offset: -1 },\n md: { width: 1, offset: -1 },\n sm: { width: 1, offset: -1 },\n xs: { width: 1, offset: -1 },\n };\n\n const padding = paddingConfig[size];\n const borderRadius = borderRadiusConfig[size];\n const iconSize = iconSizeConfig[size];\n const focusOutline = focusOutlineConfig[size];\n\n return (\n <Box\n flexDirection=\"column\"\n gap={sizeStyles.fieldGap}\n width=\"100%\"\n testID={testID}\n >\n {label && (\n <Box as=\"label\" id={labelId}>\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\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n height={sizeStyles.height}\n paddingVertical={padding.vertical}\n paddingHorizontal={padding.horizontal}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={10}\n position=\"relative\"\n style={{\n borderTopLeftRadius: borderTopLeftRadiusOverride ?? borderRadius,\n borderTopRightRadius: borderTopRightRadiusOverride ?? borderRadius,\n borderBottomLeftRadius:\n borderBottomLeftRadiusOverride ?? borderRadius,\n borderBottomRightRadius:\n borderBottomRightRadiusOverride ?? borderRadius,\n ...(outlineColor\n ? {\n outline: `${focusOutline.width}px solid ${outlineColor}`,\n outlineOffset: `${focusOutline.offset}px`,\n }\n : {}),\n }}\n hoverStyle={\n !isDisable && !isFocus && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n {isLeftInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconSize} color={textColor}>\n {iconLeft}\n </Icon>\n </Box>\n )}\n\n <Box flex={1} height=\"100%\" justifyContent=\"center\">\n <InputPrimitive\n ref={inputRef}\n id={inputId}\n value={passValue}\n name={name}\n placeholder={placeholder}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n disabled={isDisable}\n type={type || \"text\"}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n placeholderTextColor={placeholderColor}\n aria-invalid={isError || undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n aria-disabled={isDisable || undefined}\n data-testid=\"input__field\"\n {...rest}\n />\n </Box>\n\n {/* Right-side Extras Wrapper */}\n {extrasCount > 0 && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={4}>\n {isExtraClearIconShown && (\n <Box\n as=\"button\"\n type=\"button\"\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n cursor={disabled ? \"not-allowed\" : \"pointer\"}\n onPress={!disabled ? handleClear : undefined}\n disabled={disabled}\n data-testid=\"input__extra-clear-button\"\n >\n <Icon size={iconSize} color={textColor}>\n <Remove />\n </Icon>\n </Box>\n )}\n {isCheckedShown && (\n <Box\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.success.primary}\n >\n {checkedIcon}\n </Icon>\n </Box>\n )}\n {isRightInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconRightSize || iconSize} color={textColor}>\n {iconRight}\n </Icon>\n </Box>\n )}\n </Box>\n )}\n </Box>\n\n {errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInput.displayName = \"Input\";\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","import React, { forwardRef } from \"react\";\nimport styled from \"styled-components\";\nimport { InputPrimitiveProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledInput = styled.input<InputPrimitiveProps>`\n background: transparent;\n border: none;\n outline: none;\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\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-family: inherit;\n text-align: inherit;\n\n &::placeholder {\n color: ${(props) =>\n props.placeholderTextColor || \"rgba(255, 255, 255, 0.5)\"};\n }\n\n &:disabled {\n cursor: not-allowed;\n }\n`;\n\nexport const InputPrimitive = forwardRef<HTMLInputElement, InputPrimitiveProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onFocus,\n onBlur,\n onKeyDown,\n disabled,\n secureTextEntry,\n style,\n color,\n fontSize,\n placeholderTextColor,\n maxLength,\n name,\n type,\n inputMode,\n autoComplete,\n id,\n \"aria-invalid\": ariaInvalid,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-label\": ariaLabel,\n \"aria-disabled\": ariaDisabled,\n \"data-testid\": dataTestId,\n ...rest\n },\n ref\n ) => {\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(e.target.value);\n }\n };\n\n // Always pass value to make it a controlled input\n const inputValue = value !== undefined ? value : \"\";\n\n return (\n <StyledInput\n ref={ref}\n id={id}\n value={inputValue}\n name={name}\n placeholder={placeholder}\n onChange={handleChange}\n onFocus={onFocus}\n onBlur={onBlur}\n onKeyDown={onKeyDown}\n disabled={disabled}\n type={secureTextEntry ? \"password\" : type || \"text\"}\n inputMode={inputMode}\n autoComplete={autoComplete}\n style={style}\n color={color}\n fontSize={fontSize}\n placeholderTextColor={placeholderTextColor}\n maxLength={maxLength}\n aria-invalid={ariaInvalid}\n aria-describedby={ariaDescribedBy}\n aria-labelledby={ariaLabelledBy}\n aria-label={ariaLabel}\n aria-disabled={ariaDisabled}\n data-testid={dataTestId}\n {...rest}\n />\n );\n }\n);\n\nInputPrimitive.displayName = \"InputPrimitive\";\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_react","import_styled_components","import_jsx_runtime","styled","import_jsx_runtime","React"]}
1
+ {"version":3,"sources":["../../src/index.tsx","../../src/Input.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx","../../../primitives-web/src/Icon.tsx","../../../primitives-web/src/Input.tsx"],"sourcesContent":["export * from \"./Input\";\n","import React, {\n useState,\n forwardRef,\n useRef,\n useEffect,\n type InputHTMLAttributes,\n} from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon, InputPrimitive } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem, useId } from \"@xsolla/xui-core\";\nimport { CheckCr, Remove } from \"@xsolla/xui-icons-base\";\n\nexport interface InputProps extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"onChange\"\n> {\n /**\n * Property for specifying the value of the control.\n */\n value?: string;\n /**\n * Property for specifying the placeholder of the control.\n */\n placeholder?: string;\n /**\n * Event handler when the value changes (for controlled mode).\n */\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /**\n * Event handler when the text changes (alternative to onChange).\n */\n onChangeText?: (text: string) => void;\n /**\n * Property for changing the size of the input.\n */\n size?: \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n /**\n * Property for disabling the control.\n */\n disabled?: boolean;\n /**\n * Property for displaying a label above the input.\n */\n label?: string;\n /**\n * Property for displaying an error message and highlighting the control as invalid.\n */\n errorMessage?: string;\n /**\n * Property for displaying an error and highlighting the control as invalid.\n */\n error?: boolean;\n /**\n * Property to display an icon on the left side.\n */\n iconLeft?: React.ReactNode;\n /**\n * Property to display an icon on the right side.\n */\n iconRight?: React.ReactNode;\n /**\n * Add function clear for input.\n */\n extraClear?: boolean;\n /**\n * Function triggered when user clicks on extraClear button.\n */\n onRemove?: () => void;\n /**\n * Property for show checked status in input. Show only if not errorMessage.\n */\n checked?: boolean;\n /**\n * Property for passing a new icon to replace the default checked icon.\n */\n checkedIcon?: React.ReactNode;\n /**\n * Property to specify the size of the right icon.\n */\n iconRightSize?: number | string;\n /**\n * Unique identifier for the input element. Used for accessibility linking.\n */\n id?: string;\n /**\n * Accessible label for screen readers when no visible label is present.\n */\n \"aria-label\"?: string;\n /**\n * Override border radius for top-left corner.\n */\n borderTopLeftRadius?: number;\n /**\n * Override border radius for top-right corner.\n */\n borderTopRightRadius?: number;\n /**\n * Override border radius for bottom-left corner.\n */\n borderBottomLeftRadius?: number;\n /**\n * Override border radius for bottom-right corner.\n */\n borderBottomRightRadius?: number;\n /**\n * Custom background color for the input.\n */\n backgroundColor?: string;\n /**\n * Test identifier for the input.\n */\n testID?: string;\n}\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onKeyDown,\n size = \"md\",\n disabled = false,\n name,\n label,\n errorMessage,\n error,\n iconLeft,\n iconRight,\n iconRightSize,\n extraClear = false,\n onRemove,\n checked = false,\n checkedIcon = <CheckCr />,\n type,\n id: providedId,\n \"aria-label\": ariaLabel,\n borderTopLeftRadius: borderTopLeftRadiusOverride,\n borderTopRightRadius: borderTopRightRadiusOverride,\n borderBottomLeftRadius: borderBottomLeftRadiusOverride,\n borderBottomRightRadius: borderBottomRightRadiusOverride,\n backgroundColor: backgroundColorProp,\n testID,\n onBlur: externalOnBlur,\n onFocus: externalOnFocus,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [internalState, setInternalState] = useState<\"default\" | \"focus\">(\n \"default\"\n );\n // Internal value state - mimics useUpdatableState from switch-repo\n const [passValue, setPassValue] = useState(value ?? \"\");\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n // Sanitize useId() output to remove colons (e.g., :r0: -> r0)\n // This ensures valid HTML id attributes and ARIA references\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-${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 passValue with value prop when it changes (like useUpdatableState)\n useEffect(() => {\n if (value !== undefined) {\n setPassValue(value);\n }\n }, [value]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const isFocus = internalState === \"focus\";\n\n const isLeftInputIconShown = !!iconLeft;\n const isRightInputIconShown = !!iconRight;\n\n // Handle checked status (only show if not error)\n const isCheckedShown = checked && !errorMessage;\n // Clear button visibility depends on internal state\n const isExtraClearIconShown = !disabled && extraClear && !!passValue;\n const extrasCount =\n Number(isExtraClearIconShown) +\n Number(isCheckedShown) +\n Number(isRightInputIconShown);\n\n // Resolve Config from Theme\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"focus\");\n }\n externalOnFocus?.(e);\n };\n\n const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"default\");\n }\n externalOnBlur?.(e);\n };\n\n // Match switch-repo handleChange pattern exactly\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n\n // If onChange is provided (controlled mode), call it\n // But ALWAYS update internal state for clear button visibility\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(newValue);\n }\n\n // Always update internal state (this is key for uncontrolled mode in Storybook)\n setPassValue(newValue);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"Escape\") {\n e.currentTarget.blur();\n }\n if (onKeyDown) {\n onKeyDown(e);\n }\n };\n\n // Match switch-repo onClear pattern - NO direct DOM manipulation\n const handleClear = (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n\n // Update internal state first (this makes the input show empty)\n setPassValue(\"\");\n\n // Call onRemove callback\n onRemove?.();\n\n // Create synthetic change event and call onChange if provided\n if (inputRef.current) {\n // Web-specific: Use the native setter to properly set the value\n // without shadowing the property (only on web platform)\n if (typeof window !== \"undefined\" && window.HTMLInputElement) {\n const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n window.HTMLInputElement.prototype,\n \"value\"\n )?.set;\n\n if (nativeInputValueSetter) {\n nativeInputValueSetter.call(inputRef.current, \"\");\n }\n }\n\n // Create a proper synthetic event\n const syntheticEvent = {\n target: inputRef.current,\n currentTarget: inputRef.current,\n type: \"change\",\n } as React.ChangeEvent<HTMLInputElement>;\n\n onChange?.(syntheticEvent);\n inputRef.current.focus();\n }\n };\n\n // Resolve background and border colors based on state\n let backgroundColor = backgroundColorProp || inputColors.bg;\n let borderColor = inputColors.border;\n let outlineColor: string | undefined;\n\n if (isDisable) {\n backgroundColor = inputColors.bgDisable;\n borderColor = inputColors.borderDisable;\n } else if (isError) {\n outlineColor = theme.colors.border.alert;\n if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n }\n } else if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n outlineColor = theme.colors.border.brand;\n }\n\n const textColor = isDisable ? inputColors.textDisable : inputColors.text;\n const placeholderColor = inputColors.placeholder;\n\n // Padding values from Figma design\n const paddingConfig = {\n xl: { vertical: 12, horizontal: 12 },\n lg: { vertical: 14, horizontal: 12 },\n md: { vertical: 11, horizontal: 12 },\n sm: { vertical: 7, horizontal: 10 },\n xs: { vertical: 7, horizontal: 10 },\n };\n\n // Border radius from Figma design\n const borderRadiusConfig = {\n xl: 8,\n lg: 8,\n md: 8,\n sm: 4,\n xs: 4,\n };\n\n // Icon sizes from Figma design\n const iconSizeConfig = {\n xl: 18,\n lg: 18,\n md: 18,\n sm: 16,\n xs: 16,\n };\n\n // Focus outline config from Figma design\n const focusOutlineConfig = {\n xl: { width: 1, offset: -1 },\n lg: { width: 1, offset: -1 },\n md: { width: 1, offset: -1 },\n sm: { width: 1, offset: -1 },\n xs: { width: 1, offset: -1 },\n };\n\n const padding = paddingConfig[size];\n const borderRadius = borderRadiusConfig[size];\n const iconSize = iconSizeConfig[size];\n const focusOutline = focusOutlineConfig[size];\n\n return (\n <Box\n flexDirection=\"column\"\n gap={sizeStyles.fieldGap}\n width=\"100%\"\n testID={testID}\n >\n {label && (\n <Box as=\"label\" id={labelId}>\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\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n height={sizeStyles.height}\n paddingVertical={padding.vertical}\n paddingHorizontal={padding.horizontal}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={10}\n position=\"relative\"\n style={{\n borderTopLeftRadius: borderTopLeftRadiusOverride ?? borderRadius,\n borderTopRightRadius: borderTopRightRadiusOverride ?? borderRadius,\n borderBottomLeftRadius:\n borderBottomLeftRadiusOverride ?? borderRadius,\n borderBottomRightRadius:\n borderBottomRightRadiusOverride ?? borderRadius,\n ...(outlineColor\n ? {\n outline: `${focusOutline.width}px solid ${outlineColor}`,\n outlineOffset: `${focusOutline.offset}px`,\n }\n : {}),\n }}\n hoverStyle={\n !isDisable && !isFocus && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n {isLeftInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconSize} color={textColor}>\n {iconLeft}\n </Icon>\n </Box>\n )}\n\n <Box flex={1} height=\"100%\" justifyContent=\"center\">\n <InputPrimitive\n ref={inputRef}\n id={inputId}\n value={passValue}\n name={name}\n placeholder={placeholder}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n disabled={isDisable}\n type={type || \"text\"}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n placeholderTextColor={placeholderColor}\n aria-invalid={isError || undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n aria-disabled={isDisable || undefined}\n data-testid=\"input__field\"\n {...rest}\n />\n </Box>\n\n {/* Right-side Extras Wrapper */}\n {extrasCount > 0 && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={4}>\n {isExtraClearIconShown && (\n <Box\n as=\"button\"\n type=\"button\"\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n cursor={disabled ? \"not-allowed\" : \"pointer\"}\n onPress={!disabled ? handleClear : undefined}\n disabled={disabled}\n data-testid=\"input__extra-clear-button\"\n >\n <Icon size={iconSize} color={textColor}>\n <Remove />\n </Icon>\n </Box>\n )}\n {isCheckedShown && (\n <Box\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.success.primary}\n >\n {checkedIcon}\n </Icon>\n </Box>\n )}\n {isRightInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconRightSize || iconSize} color={textColor}>\n {iconRight}\n </Icon>\n </Box>\n )}\n </Box>\n )}\n </Box>\n\n {errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInput.displayName = \"Input\";\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 numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n","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","import React, { forwardRef } from \"react\";\nimport styled from \"styled-components\";\nimport { InputPrimitiveProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledInput = styled.input<InputPrimitiveProps>`\n background: transparent;\n border: none;\n outline: none;\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\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-family: inherit;\n text-align: inherit;\n\n &::placeholder {\n color: ${(props) =>\n props.placeholderTextColor || \"rgba(255, 255, 255, 0.5)\"};\n }\n\n &:disabled {\n cursor: not-allowed;\n }\n`;\n\nexport const InputPrimitive = forwardRef<HTMLInputElement, InputPrimitiveProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onFocus,\n onBlur,\n onKeyDown,\n disabled,\n secureTextEntry,\n style,\n color,\n fontSize,\n placeholderTextColor,\n maxLength,\n name,\n type,\n inputMode,\n autoComplete,\n id,\n \"aria-invalid\": ariaInvalid,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-label\": ariaLabel,\n \"aria-disabled\": ariaDisabled,\n \"data-testid\": dataTestId,\n ...rest\n },\n ref\n ) => {\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(e.target.value);\n }\n };\n\n // Always pass value to make it a controlled input\n const inputValue = value !== undefined ? value : \"\";\n\n return (\n <StyledInput\n ref={ref}\n id={id}\n value={inputValue}\n name={name}\n placeholder={placeholder}\n onChange={handleChange}\n onFocus={onFocus}\n onBlur={onBlur}\n onKeyDown={onKeyDown}\n disabled={disabled}\n type={secureTextEntry ? \"password\" : type || \"text\"}\n inputMode={inputMode}\n autoComplete={autoComplete}\n style={style}\n color={color}\n fontSize={fontSize}\n placeholderTextColor={placeholderTextColor}\n maxLength={maxLength}\n aria-invalid={ariaInvalid}\n aria-describedby={ariaDescribedBy}\n aria-labelledby={ariaLabelledBy}\n aria-label={ariaLabel}\n aria-disabled={ariaDisabled}\n data-testid={dataTestId}\n {...rest}\n />\n );\n }\n);\n\nInputPrimitive.displayName = \"InputPrimitive\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,IAAAA,gBAMO;;;ACNP,mBAAkB;AAClB,+BAAmB;AAuMX;AApMR,IAAM,YAAY,yBAAAC,QAAO;AAAA;AAAA;AAAA,sBAGH,CAAC,UAAU,MAAM,mBAAmB,aAAa;AAAA,kBACrD,CAAC,UAAU,MAAM,eAAe,aAAa;AAAA,kBAC7C,CAAC,UACf,OAAO,MAAM,gBAAgB,WACzB,GAAG,MAAM,WAAW,OACpB,MAAM,eAAe,CAAC;AAAA;AAAA,IAE1B,CAAC,UACD,MAAM,sBAAsB,UAC5B;AAAA,2BACuB,OAAO,MAAM,sBAAsB,WAAW,GAAG,MAAM,iBAAiB,OAAO,MAAM,iBAAiB;AAAA,2BACtG,MAAM,qBAAqB,MAAM,eAAe,aAAa;AAAA;AAAA,GAErF;AAAA,IACC,CAAC,UACD,MAAM,mBAAmB,UACzB;AAAA,wBACoB,OAAO,MAAM,mBAAmB,WAAW,GAAG,MAAM,cAAc,OAAO,MAAM,cAAc;AAAA,wBAC7F,MAAM,kBAAkB,MAAM,eAAe,aAAa;AAAA;AAAA,GAE/E;AAAA,IACC,CAAC,UACD,MAAM,oBAAoB,UAC1B;AAAA,yBACqB,OAAO,MAAM,oBAAoB,WAAW,GAAG,MAAM,eAAe,OAAO,MAAM,eAAe;AAAA,yBAChG,MAAM,mBAAmB,MAAM,eAAe,aAAa;AAAA;AAAA,GAEjF;AAAA,IACC,CAAC,UACD,MAAM,qBAAqB,UAC3B;AAAA,0BACsB,OAAO,MAAM,qBAAqB,WAAW,GAAG,MAAM,gBAAgB,OAAO,MAAM,gBAAgB;AAAA,0BACnG,MAAM,oBAAoB,MAAM,eAAe,aAAa;AAAA;AAAA,GAEnF;AAAA;AAAA,kBAEe,CAAC,UACf,MAAM,gBACL,MAAM,eACP,MAAM,qBACN,MAAM,kBACN,MAAM,mBACN,MAAM,mBACF,UACA,OAAO;AAAA,mBACI,CAAC,UAChB,OAAO,MAAM,iBAAiB,WAC1B,GAAG,MAAM,YAAY,OACrB,MAAM,gBAAgB,CAAC;AAAA,YACnB,CAAC,UACT,OAAO,MAAM,WAAW,WACpB,GAAG,MAAM,MAAM,OACf,MAAM,UAAU,MAAM;AAAA,WACnB,CAAC,UACR,OAAO,MAAM,UAAU,WACnB,GAAG,MAAM,KAAK,OACd,MAAM,SAAS,MAAM;AAAA,eACd,CAAC,UACZ,OAAO,MAAM,aAAa,WACtB,GAAG,MAAM,QAAQ,OACjB,MAAM,YAAY,MAAM;AAAA,gBAChB,CAAC,UACb,OAAO,MAAM,cAAc,WACvB,GAAG,MAAM,SAAS,OAClB,MAAM,aAAa,MAAM;AAAA;AAAA,aAEpB,CAAC,UACV,OAAO,MAAM,YAAY,WACrB,GAAG,MAAM,OAAO,OAChB,MAAM,WAAW,CAAC;AAAA,IACtB,CAAC,UACD,MAAM,qBACN;AAAA,oBACgB,OAAO,MAAM,sBAAsB,WAAW,GAAG,MAAM,iBAAiB,OAAO,MAAM,iBAAiB;AAAA,qBACrG,OAAO,MAAM,sBAAsB,WAAW,GAAG,MAAM,iBAAiB,OAAO,MAAM,iBAAiB;AAAA,GACxH;AAAA,IACC,CAAC,UACD,MAAM,mBACN;AAAA,mBACe,OAAO,MAAM,oBAAoB,WAAW,GAAG,MAAM,eAAe,OAAO,MAAM,eAAe;AAAA,sBAC7F,OAAO,MAAM,oBAAoB,WAAW,GAAG,MAAM,eAAe,OAAO,MAAM,eAAe;AAAA,GACnH;AAAA,IACC,CAAC,UACD,MAAM,eAAe,UACrB,gBAAgB,OAAO,MAAM,eAAe,WAAW,GAAG,MAAM,UAAU,OAAO,MAAM,UAAU,GAAG;AAAA,IACpG,CAAC,UACD,MAAM,kBAAkB,UACxB,mBAAmB,OAAO,MAAM,kBAAkB,WAAW,GAAG,MAAM,aAAa,OAAO,MAAM,aAAa,GAAG;AAAA,IAChH,CAAC,UACD,MAAM,gBAAgB,UACtB,iBAAiB,OAAO,MAAM,gBAAgB,WAAW,GAAG,MAAM,WAAW,OAAO,MAAM,WAAW,GAAG;AAAA,IACxG,CAAC,UACD,MAAM,iBAAiB,UACvB,kBAAkB,OAAO,MAAM,iBAAiB,WAAW,GAAG,MAAM,YAAY,OAAO,MAAM,YAAY,GAAG;AAAA;AAAA,YAEpG,CAAC,UACT,OAAO,MAAM,WAAW,WAAW,GAAG,MAAM,MAAM,OAAO,MAAM,UAAU,CAAC;AAAA,IAC1E,CAAC,UACD,MAAM,cAAc,UACpB,eAAe,OAAO,MAAM,cAAc,WAAW,GAAG,MAAM,SAAS,OAAO,MAAM,SAAS,GAAG;AAAA,IAChG,CAAC,UACD,MAAM,iBAAiB,UACvB,kBAAkB,OAAO,MAAM,iBAAiB,WAAW,GAAG,MAAM,YAAY,OAAO,MAAM,YAAY,GAAG;AAAA,IAC5G,CAAC,UACD,MAAM,eAAe,UACrB,gBAAgB,OAAO,MAAM,eAAe,WAAW,GAAG,MAAM,UAAU,OAAO,MAAM,UAAU,GAAG;AAAA,IACpG,CAAC,UACD,MAAM,gBAAgB,UACtB,iBAAiB,OAAO,MAAM,gBAAgB,WAAW,GAAG,MAAM,WAAW,OAAO,MAAM,WAAW,GAAG;AAAA;AAAA,oBAExF,CAAC,UAAU,MAAM,iBAAiB,QAAQ;AAAA,eAC/C,CAAC,UAAU,MAAM,YAAY,QAAQ;AAAA,iBACnC,CAAC,UAAU,MAAM,cAAc,SAAS;AAAA,qBACpC,CAAC,UAAU,MAAM,kBAAkB,YAAY;AAAA,YACxD,CAAC,UACT,MAAM,SACF,MAAM,SACN,MAAM,WAAW,MAAM,UACrB,YACA,SAAS;AAAA,cACL,CAAC,UAAU,MAAM,YAAY,QAAQ;AAAA,SAC1C,CAAC,UACN,OAAO,MAAM,QAAQ,WAAW,GAAG,MAAM,GAAG,OAAO,MAAM,GAAG;AAAA,YACpD,CAAC,UACT,OAAO,MAAM,WAAW,WAAW,GAAG,MAAM,MAAM,OAAO,MAAM,MAAM;AAAA,UAC/D,CAAC,UACP,OAAO,MAAM,SAAS,WAAW,GAAG,MAAM,IAAI,OAAO,MAAM,IAAI;AAAA,WACxD,CAAC,UACR,OAAO,MAAM,UAAU,WAAW,GAAG,MAAM,KAAK,OAAO,MAAM,KAAK;AAAA,UAC5D,CAAC,UAAU,MAAM,IAAI;AAAA,iBACd,CAAC,UAAU,MAAM,cAAc,CAAC;AAAA,SACxC,CAAC,UACN,OAAO,MAAM,QAAQ,WAAW,GAAG,MAAM,GAAG,OAAO,MAAM,OAAO,CAAC;AAAA,gBACrD,CAAC,UAAU,MAAM,aAAa,MAAM;AAAA,cACtC,CAAC,UAAU,MAAM,YAAY,SAAS;AAAA,gBACpC,CAAC,UAAU,MAAM,aAAa,SAAS;AAAA,gBACvC,CAAC,UAAU,MAAM,aAAa,SAAS;AAAA,aAC1C,CAAC,UAAU,MAAM,MAAM;AAAA,aACvB,CAAC,UAAW,MAAM,WAAW,MAAM,CAAE;AAAA,oBAC9B,CAAC,UAAW,MAAM,WAAW,SAAS,MAAO;AAAA;AAAA;AAAA,MAG3D,CAAC,UACD,MAAM,YAAY,mBAClB,qBAAqB,MAAM,WAAW,eAAe,GAAG;AAAA,MACxD,CAAC,UACD,MAAM,YAAY,eAClB,iBAAiB,MAAM,WAAW,WAAW,GAAG;AAAA;AAAA;AAAA;AAAA,MAIhD,CAAC,UACD,MAAM,YAAY,mBAClB,qBAAqB,MAAM,WAAW,eAAe,GAAG;AAAA;AAAA;AAIvD,IAAM,MAAM,aAAAC,QAAM;AAAA,EAIvB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB,aAAa;AAAA,IACb,aAAa;AAAA,IACb,oBAAoB;AAAA,IACpB,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,IACjB,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AAEH,QAAI,OAAO,SAAS,KAAK;AACvB,aACE;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,KAAK,OAAO;AAAA,UACZ,OAAO;AAAA,YACL,SAAS;AAAA,YACT,WAAW;AAAA,YACX,OACE,OAAO,MAAM,UAAU,WACnB,GAAG,MAAM,KAAK,OACd,MAAM;AAAA,YACZ,QACE,OAAO,MAAM,WAAW,WACpB,GAAG,MAAM,MAAM,OACf,MAAM;AAAA,YACZ,cACE,OAAO,MAAM,iBAAiB,WAC1B,GAAG,MAAM,YAAY,OACrB,MAAM;AAAA,YACZ,UAAU,MAAM;AAAA,YAChB,KAAK,OAAO,MAAM,QAAQ,WAAW,GAAG,MAAM,GAAG,OAAO,MAAM;AAAA,YAC9D,MACE,OAAO,MAAM,SAAS,WAAW,GAAG,MAAM,IAAI,OAAO,MAAM;AAAA,YAC7D,OACE,OAAO,MAAM,UAAU,WACnB,GAAG,MAAM,KAAK,OACd,MAAM;AAAA,YACZ,QACE,OAAO,MAAM,WAAW,WACpB,GAAG,MAAM,MAAM,OACf,MAAM;AAAA,UACd;AAAA;AAAA,MACF;AAAA,IAEJ;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA,MAAM,OAAO,WAAW,QAAQ,WAAW;AAAA,QAC3C,UAAU,OAAO,WAAW,WAAW;AAAA,QACvC,SAAS;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA,cAAY;AAAA,QACZ,mBAAiB;AAAA,QACjB,gBAAc;AAAA,QACd,iBAAe;AAAA,QACf,aAAW;AAAA,QACX,oBAAkB;AAAA,QAClB,iBAAe;AAAA,QACf,iBAAe;AAAA,QACf,gBAAc;AAAA,QACd,iBAAe;AAAA,QACf,aAAW;AAAA,QACX,UAAU,aAAa,SAAY,WAAW;AAAA,QAC7C,GAAG;AAAA,QAEH;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,IAAI,cAAc;;;ACzQlB,IAAAC,4BAAmB;AA+Bf,IAAAC,sBAAA;AA5BJ,IAAM,aAAa,0BAAAC,QAAO;AAAA,WACf,CAAC,UAAU,MAAM,SAAS,SAAS;AAAA,eAC/B,CAAC,UACZ,OAAO,MAAM,aAAa,WACtB,GAAG,MAAM,QAAQ,OACjB,MAAM,YAAY,SAAS;AAAA,iBAClB,CAAC,UAAU,MAAM,cAAc,QAAQ;AAAA,iBACvC,CAAC,UACd,MAAM,cACN,sGAAsG;AAAA,iBACzF,CAAC,UACd,OAAO,MAAM,eAAe,WACxB,GAAG,MAAM,UAAU,OACnB,MAAM,cAAc,SAAS;AAAA,iBACpB,CAAC,UAAU,MAAM,cAAc,QAAQ;AAAA,gBACxC,CAAC,UAAU,MAAM,aAAa,SAAS;AAAA,qBAClC,CAAC,UAAU,MAAM,kBAAkB,MAAM;AAAA;AAGvD,IAAM,OAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf,GAAG;AACL,MAAM;AACJ,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,EACF;AAEJ;;;ACvCA,IAAAC,4BAAmB;AAsBV,IAAAC,sBAAA;AAnBT,IAAM,aAAa,0BAAAC,QAAO;AAAA;AAAA;AAAA;AAAA,WAIf,CAAC,UACR,OAAO,MAAM,SAAS,WAAW,GAAG,MAAM,IAAI,OAAO,MAAM,QAAQ,MAAM;AAAA,YACjE,CAAC,UACT,OAAO,MAAM,SAAS,WAAW,GAAG,MAAM,IAAI,OAAO,MAAM,QAAQ,MAAM;AAAA,WAClE,CAAC,UAAU,MAAM,SAAS,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAU5C,IAAM,OAA4B,CAAC,EAAE,UAAU,GAAG,MAAM,MAAM;AACnE,SAAO,6CAAC,cAAY,GAAG,OAAQ,UAAS;AAC1C;;;ACxBA,IAAAC,gBAAkC;AAClC,IAAAC,4BAAmB;AA0Eb,IAAAC,sBAAA;AAvEN,IAAM,cAAc,0BAAAC,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAQhB,CAAC,UAAU,MAAM,SAAS,SAAS;AAAA,eAC/B,CAAC,UACZ,OAAO,MAAM,aAAa,WACtB,GAAG,MAAM,QAAQ,OACjB,MAAM,YAAY,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA,aAKtB,CAAC,UACR,MAAM,wBAAwB,0BAA0B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQvD,IAAM,qBAAiB;AAAA,EAC5B,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB,oBAAoB;AAAA,IACpB,mBAAmB;AAAA,IACnB,cAAc;AAAA,IACd,iBAAiB;AAAA,IACjB,eAAe;AAAA,IACf,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,eAAe,CAAC,MAA2C;AAC/D,UAAI,UAAU;AACZ,iBAAS,CAAC;AAAA,MACZ;AACA,UAAI,cAAc;AAChB,qBAAa,EAAE,OAAO,KAAK;AAAA,MAC7B;AAAA,IACF;AAGA,UAAM,aAAa,UAAU,SAAY,QAAQ;AAEjD,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,OAAO;AAAA,QACP;AAAA,QACA;AAAA,QACA,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,MAAM,kBAAkB,aAAa,QAAQ;AAAA,QAC7C;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,gBAAc;AAAA,QACd,oBAAkB;AAAA,QAClB,mBAAiB;AAAA,QACjB,cAAY;AAAA,QACZ,iBAAe;AAAA,QACf,eAAa;AAAA,QACZ,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,eAAe,cAAc;;;AJjG7B,sBAAuC;AACvC,4BAAgC;AA4HZ,IAAAC,sBAAA;AApBb,IAAM,YAAQ;AAAA,EACnB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,aAAa;AAAA,IACb;AAAA,IACA,UAAU;AAAA,IACV,cAAc,6CAAC,iCAAQ;AAAA,IACvB;AAAA,IACA,IAAI;AAAA,IACJ,cAAc;AAAA,IACd,qBAAqB;AAAA,IACrB,sBAAsB;AAAA,IACtB,wBAAwB;AAAA,IACxB,yBAAyB;AAAA,IACzB,iBAAiB;AAAA,IACjB;AAAA,IACA,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,EAAE,MAAM,QAAI,iCAAgB;AAClC,UAAM,CAAC,eAAe,gBAAgB,QAAI;AAAA,MACxC;AAAA,IACF;AAEA,UAAM,CAAC,WAAW,YAAY,QAAI,wBAAS,SAAS,EAAE;AACtD,UAAM,eAAW,sBAAyB,IAAI;AAK9C,UAAM,YAAQ,uBAAM;AACpB,UAAM,SAAS,MAAM,QAAQ,MAAM,EAAE;AACrC,UAAM,UAAU,cAAc,SAAS,MAAM;AAC7C,UAAM,UAAU,GAAG,OAAO;AAC1B,UAAM,UAAU,GAAG,OAAO;AAG1B,kBAAAC,QAAM;AAAA,MACJ;AAAA,MACA,MAAM,SAAS;AAAA,MACf,CAAC;AAAA,IACH;AAGA,iCAAU,MAAM;AACd,UAAI,UAAU,QAAW;AACvB,qBAAa,KAAK;AAAA,MACpB;AAAA,IACF,GAAG,CAAC,KAAK,CAAC;AAEV,UAAM,YAAY;AAClB,UAAM,UAAU,CAAC,EAAE,gBAAgB;AACnC,UAAM,UAAU,kBAAkB;AAElC,UAAM,uBAAuB,CAAC,CAAC;AAC/B,UAAM,wBAAwB,CAAC,CAAC;AAGhC,UAAM,iBAAiB,WAAW,CAAC;AAEnC,UAAM,wBAAwB,CAAC,YAAY,cAAc,CAAC,CAAC;AAC3D,UAAM,cACJ,OAAO,qBAAqB,IAC5B,OAAO,cAAc,IACrB,OAAO,qBAAqB;AAG9B,UAAM,aAAa,MAAM,OAAO,MAAM,IAAI;AAC1C,UAAM,cAAc,MAAM,OAAO,QAAQ;AAEzC,UAAM,cAAc,CAAC,MAA0C;AAC7D,UAAI,CAAC,WAAW;AACd,yBAAiB,OAAO;AAAA,MAC1B;AACA,wBAAkB,CAAC;AAAA,IACrB;AAEA,UAAM,aAAa,CAAC,MAA0C;AAC5D,UAAI,CAAC,WAAW;AACd,yBAAiB,SAAS;AAAA,MAC5B;AACA,uBAAiB,CAAC;AAAA,IACpB;AAGA,UAAM,eAAe,CAAC,MAA2C;AAC/D,YAAM,WAAW,EAAE,OAAO;AAI1B,UAAI,UAAU;AACZ,iBAAS,CAAC;AAAA,MACZ;AACA,UAAI,cAAc;AAChB,qBAAa,QAAQ;AAAA,MACvB;AAGA,mBAAa,QAAQ;AAAA,IACvB;AAEA,UAAM,gBAAgB,CAAC,MAA6C;AAClE,UAAI,EAAE,QAAQ,UAAU;AACtB,UAAE,cAAc,KAAK;AAAA,MACvB;AACA,UAAI,WAAW;AACb,kBAAU,CAAC;AAAA,MACb;AAAA,IACF;AAGA,UAAM,cAAc,CAAC,MAAqC;AACxD,QAAE,gBAAgB;AAGlB,mBAAa,EAAE;AAGf,iBAAW;AAGX,UAAI,SAAS,SAAS;AAGpB,YAAI,OAAO,WAAW,eAAe,OAAO,kBAAkB;AAC5D,gBAAM,yBAAyB,OAAO;AAAA,YACpC,OAAO,iBAAiB;AAAA,YACxB;AAAA,UACF,GAAG;AAEH,cAAI,wBAAwB;AAC1B,mCAAuB,KAAK,SAAS,SAAS,EAAE;AAAA,UAClD;AAAA,QACF;AAGA,cAAM,iBAAiB;AAAA,UACrB,QAAQ,SAAS;AAAA,UACjB,eAAe,SAAS;AAAA,UACxB,MAAM;AAAA,QACR;AAEA,mBAAW,cAAc;AACzB,iBAAS,QAAQ,MAAM;AAAA,MACzB;AAAA,IACF;AAGA,QAAI,kBAAkB,uBAAuB,YAAY;AACzD,QAAI,cAAc,YAAY;AAC9B,QAAI;AAEJ,QAAI,WAAW;AACb,wBAAkB,YAAY;AAC9B,oBAAc,YAAY;AAAA,IAC5B,WAAW,SAAS;AAClB,qBAAe,MAAM,OAAO,OAAO;AACnC,UAAI,SAAS;AACX,0BAAkB,MAAM,OAAO,QAAQ,MAAM;AAAA,MAC/C;AAAA,IACF,WAAW,SAAS;AAClB,wBAAkB,MAAM,OAAO,QAAQ,MAAM;AAC7C,qBAAe,MAAM,OAAO,OAAO;AAAA,IACrC;AAEA,UAAM,YAAY,YAAY,YAAY,cAAc,YAAY;AACpE,UAAM,mBAAmB,YAAY;AAGrC,UAAM,gBAAgB;AAAA,MACpB,IAAI,EAAE,UAAU,IAAI,YAAY,GAAG;AAAA,MACnC,IAAI,EAAE,UAAU,IAAI,YAAY,GAAG;AAAA,MACnC,IAAI,EAAE,UAAU,IAAI,YAAY,GAAG;AAAA,MACnC,IAAI,EAAE,UAAU,GAAG,YAAY,GAAG;AAAA,MAClC,IAAI,EAAE,UAAU,GAAG,YAAY,GAAG;AAAA,IACpC;AAGA,UAAM,qBAAqB;AAAA,MACzB,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAGA,UAAM,iBAAiB;AAAA,MACrB,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAGA,UAAM,qBAAqB;AAAA,MACzB,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG;AAAA,MAC3B,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG;AAAA,MAC3B,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG;AAAA,MAC3B,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG;AAAA,MAC3B,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG;AAAA,IAC7B;AAEA,UAAM,UAAU,cAAc,IAAI;AAClC,UAAM,eAAe,mBAAmB,IAAI;AAC5C,UAAM,WAAW,eAAe,IAAI;AACpC,UAAM,eAAe,mBAAmB,IAAI;AAE5C,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAc;AAAA,QACd,KAAK,WAAW;AAAA,QAChB,OAAM;AAAA,QACN;AAAA,QAEC;AAAA,mBACC,6CAAC,OAAI,IAAG,SAAQ,IAAI,SAClB;AAAA,YAAC;AAAA;AAAA,cACC,OAAO,MAAM,OAAO,QAAQ;AAAA,cAC5B,UAAU,WAAW,WAAW;AAAA,cAChC,YAAW;AAAA,cAEV;AAAA;AAAA,UACH,GACF;AAAA,UAEF;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA,aAAa,gBAAgB,gBAAgB,IAAI;AAAA,cACjD,QAAQ,WAAW;AAAA,cACnB,iBAAiB,QAAQ;AAAA,cACzB,mBAAmB,QAAQ;AAAA,cAC3B,eAAc;AAAA,cACd,YAAW;AAAA,cACX,KAAK;AAAA,cACL,UAAS;AAAA,cACT,OAAO;AAAA,gBACL,qBAAqB,+BAA+B;AAAA,gBACpD,sBAAsB,gCAAgC;AAAA,gBACtD,wBACE,kCAAkC;AAAA,gBACpC,yBACE,mCAAmC;AAAA,gBACrC,GAAI,eACA;AAAA,kBACE,SAAS,GAAG,aAAa,KAAK,YAAY,YAAY;AAAA,kBACtD,eAAe,GAAG,aAAa,MAAM;AAAA,gBACvC,IACA,CAAC;AAAA,cACP;AAAA,cACA,YACE,CAAC,aAAa,CAAC,WAAW,CAAC,UACvB;AAAA,gBACE,iBAAiB,YAAY;AAAA,gBAC7B,aAAa,YAAY;AAAA,cAC3B,IACA;AAAA,cAGL;AAAA,wCACC,6CAAC,OAAI,YAAW,UAAS,gBAAe,UACtC,uDAAC,QAAK,MAAM,UAAU,OAAO,WAC1B,oBACH,GACF;AAAA,gBAGF,6CAAC,OAAI,MAAM,GAAG,QAAO,QAAO,gBAAe,UACzC;AAAA,kBAAC;AAAA;AAAA,oBACC,KAAK;AAAA,oBACL,IAAI;AAAA,oBACJ,OAAO;AAAA,oBACP;AAAA,oBACA;AAAA,oBACA,UAAU;AAAA,oBACV,SAAS;AAAA,oBACT,QAAQ;AAAA,oBACR,WAAW;AAAA,oBACX,UAAU;AAAA,oBACV,MAAM,QAAQ;AAAA,oBACd,OAAO;AAAA,oBACP,UAAU,WAAW;AAAA,oBACrB,sBAAsB;AAAA,oBACtB,gBAAc,WAAW;AAAA,oBACzB,oBAAkB,eAAe,UAAU;AAAA,oBAC3C,mBAAiB,QAAQ,UAAU;AAAA,oBACnC,cAAY,CAAC,QAAQ,YAAY;AAAA,oBACjC,iBAAe,aAAa;AAAA,oBAC5B,eAAY;AAAA,oBACX,GAAG;AAAA;AAAA,gBACN,GACF;AAAA,gBAGC,cAAc,KACb,8CAAC,OAAI,eAAc,OAAM,YAAW,UAAS,KAAK,GAC/C;AAAA,2CACC;AAAA,oBAAC;AAAA;AAAA,sBACC,IAAG;AAAA,sBACH,MAAK;AAAA,sBACL,YAAW;AAAA,sBACX,gBAAe;AAAA,sBACf,OAAO;AAAA,sBACP,QAAO;AAAA,sBACP,iBAAgB;AAAA,sBAChB,aAAa;AAAA,sBACb,QAAQ,WAAW,gBAAgB;AAAA,sBACnC,SAAS,CAAC,WAAW,cAAc;AAAA,sBACnC;AAAA,sBACA,eAAY;AAAA,sBAEZ,uDAAC,QAAK,MAAM,UAAU,OAAO,WAC3B,uDAAC,gCAAO,GACV;AAAA;AAAA,kBACF;AAAA,kBAED,kBACC;AAAA,oBAAC;AAAA;AAAA,sBACC,YAAW;AAAA,sBACX,gBAAe;AAAA,sBACf,OAAO;AAAA,sBACP,QAAO;AAAA,sBAEP;AAAA,wBAAC;AAAA;AAAA,0BACC,MAAM;AAAA,0BACN,OAAO,MAAM,OAAO,QAAQ,QAAQ;AAAA,0BAEnC;AAAA;AAAA,sBACH;AAAA;AAAA,kBACF;AAAA,kBAED,yBACC,6CAAC,OAAI,YAAW,UAAS,gBAAe,UACtC,uDAAC,QAAK,MAAM,iBAAiB,UAAU,OAAO,WAC3C,qBACH,GACF;AAAA,mBAEJ;AAAA;AAAA;AAAA,UAEJ;AAAA,UAEC,gBACC;AAAA,YAAC;AAAA;AAAA,cACC,IAAI;AAAA,cACJ,MAAK;AAAA,cACL,OAAO,MAAM,OAAO,QAAQ,MAAM;AAAA,cAClC,UAAU,WAAW,WAAW;AAAA,cAChC,OAAO,EAAE,YAAY,WAAW,aAAa,KAAK;AAAA,cAEjD;AAAA;AAAA,UACH;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,MAAM,cAAc;","names":["import_react","styled","React","import_styled_components","import_jsx_runtime","styled","import_styled_components","import_jsx_runtime","styled","import_react","import_styled_components","import_jsx_runtime","styled","import_jsx_runtime","React"]}
package/web/index.mjs CHANGED
@@ -193,6 +193,7 @@ var Text = ({
193
193
  className,
194
194
  id,
195
195
  role,
196
+ numberOfLines: _numberOfLines,
196
197
  ...props
197
198
  }) => {
198
199
  return /* @__PURE__ */ jsx2(
package/web/index.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Input.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx","../../../primitives-web/src/Icon.tsx","../../../primitives-web/src/Input.tsx"],"sourcesContent":["import React, {\n useState,\n forwardRef,\n useRef,\n useEffect,\n type InputHTMLAttributes,\n} from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon, InputPrimitive } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem, useId } from \"@xsolla/xui-core\";\nimport { CheckCr, Remove } from \"@xsolla/xui-icons-base\";\n\nexport interface InputProps extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"onChange\"\n> {\n /**\n * Property for specifying the value of the control.\n */\n value?: string;\n /**\n * Property for specifying the placeholder of the control.\n */\n placeholder?: string;\n /**\n * Event handler when the value changes (for controlled mode).\n */\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /**\n * Event handler when the text changes (alternative to onChange).\n */\n onChangeText?: (text: string) => void;\n /**\n * Property for changing the size of the input.\n */\n size?: \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n /**\n * Property for disabling the control.\n */\n disabled?: boolean;\n /**\n * Property for displaying a label above the input.\n */\n label?: string;\n /**\n * Property for displaying an error message and highlighting the control as invalid.\n */\n errorMessage?: string;\n /**\n * Property for displaying an error and highlighting the control as invalid.\n */\n error?: boolean;\n /**\n * Property to display an icon on the left side.\n */\n iconLeft?: React.ReactNode;\n /**\n * Property to display an icon on the right side.\n */\n iconRight?: React.ReactNode;\n /**\n * Add function clear for input.\n */\n extraClear?: boolean;\n /**\n * Function triggered when user clicks on extraClear button.\n */\n onRemove?: () => void;\n /**\n * Property for show checked status in input. Show only if not errorMessage.\n */\n checked?: boolean;\n /**\n * Property for passing a new icon to replace the default checked icon.\n */\n checkedIcon?: React.ReactNode;\n /**\n * Property to specify the size of the right icon.\n */\n iconRightSize?: number | string;\n /**\n * Unique identifier for the input element. Used for accessibility linking.\n */\n id?: string;\n /**\n * Accessible label for screen readers when no visible label is present.\n */\n \"aria-label\"?: string;\n /**\n * Override border radius for top-left corner.\n */\n borderTopLeftRadius?: number;\n /**\n * Override border radius for top-right corner.\n */\n borderTopRightRadius?: number;\n /**\n * Override border radius for bottom-left corner.\n */\n borderBottomLeftRadius?: number;\n /**\n * Override border radius for bottom-right corner.\n */\n borderBottomRightRadius?: number;\n /**\n * Custom background color for the input.\n */\n backgroundColor?: string;\n /**\n * Test identifier for the input.\n */\n testID?: string;\n}\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onKeyDown,\n size = \"md\",\n disabled = false,\n name,\n label,\n errorMessage,\n error,\n iconLeft,\n iconRight,\n iconRightSize,\n extraClear = false,\n onRemove,\n checked = false,\n checkedIcon = <CheckCr />,\n type,\n id: providedId,\n \"aria-label\": ariaLabel,\n borderTopLeftRadius: borderTopLeftRadiusOverride,\n borderTopRightRadius: borderTopRightRadiusOverride,\n borderBottomLeftRadius: borderBottomLeftRadiusOverride,\n borderBottomRightRadius: borderBottomRightRadiusOverride,\n backgroundColor: backgroundColorProp,\n testID,\n onBlur: externalOnBlur,\n onFocus: externalOnFocus,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [internalState, setInternalState] = useState<\"default\" | \"focus\">(\n \"default\"\n );\n // Internal value state - mimics useUpdatableState from switch-repo\n const [passValue, setPassValue] = useState(value ?? \"\");\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n // Sanitize useId() output to remove colons (e.g., :r0: -> r0)\n // This ensures valid HTML id attributes and ARIA references\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-${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 passValue with value prop when it changes (like useUpdatableState)\n useEffect(() => {\n if (value !== undefined) {\n setPassValue(value);\n }\n }, [value]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const isFocus = internalState === \"focus\";\n\n const isLeftInputIconShown = !!iconLeft;\n const isRightInputIconShown = !!iconRight;\n\n // Handle checked status (only show if not error)\n const isCheckedShown = checked && !errorMessage;\n // Clear button visibility depends on internal state\n const isExtraClearIconShown = !disabled && extraClear && !!passValue;\n const extrasCount =\n Number(isExtraClearIconShown) +\n Number(isCheckedShown) +\n Number(isRightInputIconShown);\n\n // Resolve Config from Theme\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"focus\");\n }\n externalOnFocus?.(e);\n };\n\n const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"default\");\n }\n externalOnBlur?.(e);\n };\n\n // Match switch-repo handleChange pattern exactly\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n\n // If onChange is provided (controlled mode), call it\n // But ALWAYS update internal state for clear button visibility\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(newValue);\n }\n\n // Always update internal state (this is key for uncontrolled mode in Storybook)\n setPassValue(newValue);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"Escape\") {\n e.currentTarget.blur();\n }\n if (onKeyDown) {\n onKeyDown(e);\n }\n };\n\n // Match switch-repo onClear pattern - NO direct DOM manipulation\n const handleClear = (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n\n // Update internal state first (this makes the input show empty)\n setPassValue(\"\");\n\n // Call onRemove callback\n onRemove?.();\n\n // Create synthetic change event and call onChange if provided\n if (inputRef.current) {\n // Web-specific: Use the native setter to properly set the value\n // without shadowing the property (only on web platform)\n if (typeof window !== \"undefined\" && window.HTMLInputElement) {\n const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n window.HTMLInputElement.prototype,\n \"value\"\n )?.set;\n\n if (nativeInputValueSetter) {\n nativeInputValueSetter.call(inputRef.current, \"\");\n }\n }\n\n // Create a proper synthetic event\n const syntheticEvent = {\n target: inputRef.current,\n currentTarget: inputRef.current,\n type: \"change\",\n } as React.ChangeEvent<HTMLInputElement>;\n\n onChange?.(syntheticEvent);\n inputRef.current.focus();\n }\n };\n\n // Resolve background and border colors based on state\n let backgroundColor = backgroundColorProp || inputColors.bg;\n let borderColor = inputColors.border;\n let outlineColor: string | undefined;\n\n if (isDisable) {\n backgroundColor = inputColors.bgDisable;\n borderColor = inputColors.borderDisable;\n } else if (isError) {\n outlineColor = theme.colors.border.alert;\n if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n }\n } else if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n outlineColor = theme.colors.border.brand;\n }\n\n const textColor = isDisable ? inputColors.textDisable : inputColors.text;\n const placeholderColor = inputColors.placeholder;\n\n // Padding values from Figma design\n const paddingConfig = {\n xl: { vertical: 12, horizontal: 12 },\n lg: { vertical: 14, horizontal: 12 },\n md: { vertical: 11, horizontal: 12 },\n sm: { vertical: 7, horizontal: 10 },\n xs: { vertical: 7, horizontal: 10 },\n };\n\n // Border radius from Figma design\n const borderRadiusConfig = {\n xl: 8,\n lg: 8,\n md: 8,\n sm: 4,\n xs: 4,\n };\n\n // Icon sizes from Figma design\n const iconSizeConfig = {\n xl: 18,\n lg: 18,\n md: 18,\n sm: 16,\n xs: 16,\n };\n\n // Focus outline config from Figma design\n const focusOutlineConfig = {\n xl: { width: 1, offset: -1 },\n lg: { width: 1, offset: -1 },\n md: { width: 1, offset: -1 },\n sm: { width: 1, offset: -1 },\n xs: { width: 1, offset: -1 },\n };\n\n const padding = paddingConfig[size];\n const borderRadius = borderRadiusConfig[size];\n const iconSize = iconSizeConfig[size];\n const focusOutline = focusOutlineConfig[size];\n\n return (\n <Box\n flexDirection=\"column\"\n gap={sizeStyles.fieldGap}\n width=\"100%\"\n testID={testID}\n >\n {label && (\n <Box as=\"label\" id={labelId}>\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\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n height={sizeStyles.height}\n paddingVertical={padding.vertical}\n paddingHorizontal={padding.horizontal}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={10}\n position=\"relative\"\n style={{\n borderTopLeftRadius: borderTopLeftRadiusOverride ?? borderRadius,\n borderTopRightRadius: borderTopRightRadiusOverride ?? borderRadius,\n borderBottomLeftRadius:\n borderBottomLeftRadiusOverride ?? borderRadius,\n borderBottomRightRadius:\n borderBottomRightRadiusOverride ?? borderRadius,\n ...(outlineColor\n ? {\n outline: `${focusOutline.width}px solid ${outlineColor}`,\n outlineOffset: `${focusOutline.offset}px`,\n }\n : {}),\n }}\n hoverStyle={\n !isDisable && !isFocus && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n {isLeftInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconSize} color={textColor}>\n {iconLeft}\n </Icon>\n </Box>\n )}\n\n <Box flex={1} height=\"100%\" justifyContent=\"center\">\n <InputPrimitive\n ref={inputRef}\n id={inputId}\n value={passValue}\n name={name}\n placeholder={placeholder}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n disabled={isDisable}\n type={type || \"text\"}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n placeholderTextColor={placeholderColor}\n aria-invalid={isError || undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n aria-disabled={isDisable || undefined}\n data-testid=\"input__field\"\n {...rest}\n />\n </Box>\n\n {/* Right-side Extras Wrapper */}\n {extrasCount > 0 && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={4}>\n {isExtraClearIconShown && (\n <Box\n as=\"button\"\n type=\"button\"\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n cursor={disabled ? \"not-allowed\" : \"pointer\"}\n onPress={!disabled ? handleClear : undefined}\n disabled={disabled}\n data-testid=\"input__extra-clear-button\"\n >\n <Icon size={iconSize} color={textColor}>\n <Remove />\n </Icon>\n </Box>\n )}\n {isCheckedShown && (\n <Box\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.success.primary}\n >\n {checkedIcon}\n </Icon>\n </Box>\n )}\n {isRightInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconRightSize || iconSize} color={textColor}>\n {iconRight}\n </Icon>\n </Box>\n )}\n </Box>\n )}\n </Box>\n\n {errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInput.displayName = \"Input\";\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","import React, { forwardRef } from \"react\";\nimport styled from \"styled-components\";\nimport { InputPrimitiveProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledInput = styled.input<InputPrimitiveProps>`\n background: transparent;\n border: none;\n outline: none;\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\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-family: inherit;\n text-align: inherit;\n\n &::placeholder {\n color: ${(props) =>\n props.placeholderTextColor || \"rgba(255, 255, 255, 0.5)\"};\n }\n\n &:disabled {\n cursor: not-allowed;\n }\n`;\n\nexport const InputPrimitive = forwardRef<HTMLInputElement, InputPrimitiveProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onFocus,\n onBlur,\n onKeyDown,\n disabled,\n secureTextEntry,\n style,\n color,\n fontSize,\n placeholderTextColor,\n maxLength,\n name,\n type,\n inputMode,\n autoComplete,\n id,\n \"aria-invalid\": ariaInvalid,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-label\": ariaLabel,\n \"aria-disabled\": ariaDisabled,\n \"data-testid\": dataTestId,\n ...rest\n },\n ref\n ) => {\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(e.target.value);\n }\n };\n\n // Always pass value to make it a controlled input\n const inputValue = value !== undefined ? value : \"\";\n\n return (\n <StyledInput\n ref={ref}\n id={id}\n value={inputValue}\n name={name}\n placeholder={placeholder}\n onChange={handleChange}\n onFocus={onFocus}\n onBlur={onBlur}\n onKeyDown={onKeyDown}\n disabled={disabled}\n type={secureTextEntry ? \"password\" : type || \"text\"}\n inputMode={inputMode}\n autoComplete={autoComplete}\n style={style}\n color={color}\n fontSize={fontSize}\n placeholderTextColor={placeholderTextColor}\n maxLength={maxLength}\n aria-invalid={ariaInvalid}\n aria-describedby={ariaDescribedBy}\n aria-labelledby={ariaLabelledBy}\n aria-label={ariaLabel}\n aria-disabled={ariaDisabled}\n data-testid={dataTestId}\n {...rest}\n />\n );\n }\n);\n\nInputPrimitive.displayName = \"InputPrimitive\";\n"],"mappings":"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","names":["React","forwardRef","styled","jsx","styled","jsx","styled","jsx","jsx","forwardRef","React"]}
1
+ {"version":3,"sources":["../../src/Input.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx","../../../primitives-web/src/Icon.tsx","../../../primitives-web/src/Input.tsx"],"sourcesContent":["import React, {\n useState,\n forwardRef,\n useRef,\n useEffect,\n type InputHTMLAttributes,\n} from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon, InputPrimitive } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem, useId } from \"@xsolla/xui-core\";\nimport { CheckCr, Remove } from \"@xsolla/xui-icons-base\";\n\nexport interface InputProps extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"onChange\"\n> {\n /**\n * Property for specifying the value of the control.\n */\n value?: string;\n /**\n * Property for specifying the placeholder of the control.\n */\n placeholder?: string;\n /**\n * Event handler when the value changes (for controlled mode).\n */\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /**\n * Event handler when the text changes (alternative to onChange).\n */\n onChangeText?: (text: string) => void;\n /**\n * Property for changing the size of the input.\n */\n size?: \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n /**\n * Property for disabling the control.\n */\n disabled?: boolean;\n /**\n * Property for displaying a label above the input.\n */\n label?: string;\n /**\n * Property for displaying an error message and highlighting the control as invalid.\n */\n errorMessage?: string;\n /**\n * Property for displaying an error and highlighting the control as invalid.\n */\n error?: boolean;\n /**\n * Property to display an icon on the left side.\n */\n iconLeft?: React.ReactNode;\n /**\n * Property to display an icon on the right side.\n */\n iconRight?: React.ReactNode;\n /**\n * Add function clear for input.\n */\n extraClear?: boolean;\n /**\n * Function triggered when user clicks on extraClear button.\n */\n onRemove?: () => void;\n /**\n * Property for show checked status in input. Show only if not errorMessage.\n */\n checked?: boolean;\n /**\n * Property for passing a new icon to replace the default checked icon.\n */\n checkedIcon?: React.ReactNode;\n /**\n * Property to specify the size of the right icon.\n */\n iconRightSize?: number | string;\n /**\n * Unique identifier for the input element. Used for accessibility linking.\n */\n id?: string;\n /**\n * Accessible label for screen readers when no visible label is present.\n */\n \"aria-label\"?: string;\n /**\n * Override border radius for top-left corner.\n */\n borderTopLeftRadius?: number;\n /**\n * Override border radius for top-right corner.\n */\n borderTopRightRadius?: number;\n /**\n * Override border radius for bottom-left corner.\n */\n borderBottomLeftRadius?: number;\n /**\n * Override border radius for bottom-right corner.\n */\n borderBottomRightRadius?: number;\n /**\n * Custom background color for the input.\n */\n backgroundColor?: string;\n /**\n * Test identifier for the input.\n */\n testID?: string;\n}\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onKeyDown,\n size = \"md\",\n disabled = false,\n name,\n label,\n errorMessage,\n error,\n iconLeft,\n iconRight,\n iconRightSize,\n extraClear = false,\n onRemove,\n checked = false,\n checkedIcon = <CheckCr />,\n type,\n id: providedId,\n \"aria-label\": ariaLabel,\n borderTopLeftRadius: borderTopLeftRadiusOverride,\n borderTopRightRadius: borderTopRightRadiusOverride,\n borderBottomLeftRadius: borderBottomLeftRadiusOverride,\n borderBottomRightRadius: borderBottomRightRadiusOverride,\n backgroundColor: backgroundColorProp,\n testID,\n onBlur: externalOnBlur,\n onFocus: externalOnFocus,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [internalState, setInternalState] = useState<\"default\" | \"focus\">(\n \"default\"\n );\n // Internal value state - mimics useUpdatableState from switch-repo\n const [passValue, setPassValue] = useState(value ?? \"\");\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n // Sanitize useId() output to remove colons (e.g., :r0: -> r0)\n // This ensures valid HTML id attributes and ARIA references\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-${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 passValue with value prop when it changes (like useUpdatableState)\n useEffect(() => {\n if (value !== undefined) {\n setPassValue(value);\n }\n }, [value]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const isFocus = internalState === \"focus\";\n\n const isLeftInputIconShown = !!iconLeft;\n const isRightInputIconShown = !!iconRight;\n\n // Handle checked status (only show if not error)\n const isCheckedShown = checked && !errorMessage;\n // Clear button visibility depends on internal state\n const isExtraClearIconShown = !disabled && extraClear && !!passValue;\n const extrasCount =\n Number(isExtraClearIconShown) +\n Number(isCheckedShown) +\n Number(isRightInputIconShown);\n\n // Resolve Config from Theme\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"focus\");\n }\n externalOnFocus?.(e);\n };\n\n const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"default\");\n }\n externalOnBlur?.(e);\n };\n\n // Match switch-repo handleChange pattern exactly\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n\n // If onChange is provided (controlled mode), call it\n // But ALWAYS update internal state for clear button visibility\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(newValue);\n }\n\n // Always update internal state (this is key for uncontrolled mode in Storybook)\n setPassValue(newValue);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"Escape\") {\n e.currentTarget.blur();\n }\n if (onKeyDown) {\n onKeyDown(e);\n }\n };\n\n // Match switch-repo onClear pattern - NO direct DOM manipulation\n const handleClear = (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n\n // Update internal state first (this makes the input show empty)\n setPassValue(\"\");\n\n // Call onRemove callback\n onRemove?.();\n\n // Create synthetic change event and call onChange if provided\n if (inputRef.current) {\n // Web-specific: Use the native setter to properly set the value\n // without shadowing the property (only on web platform)\n if (typeof window !== \"undefined\" && window.HTMLInputElement) {\n const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n window.HTMLInputElement.prototype,\n \"value\"\n )?.set;\n\n if (nativeInputValueSetter) {\n nativeInputValueSetter.call(inputRef.current, \"\");\n }\n }\n\n // Create a proper synthetic event\n const syntheticEvent = {\n target: inputRef.current,\n currentTarget: inputRef.current,\n type: \"change\",\n } as React.ChangeEvent<HTMLInputElement>;\n\n onChange?.(syntheticEvent);\n inputRef.current.focus();\n }\n };\n\n // Resolve background and border colors based on state\n let backgroundColor = backgroundColorProp || inputColors.bg;\n let borderColor = inputColors.border;\n let outlineColor: string | undefined;\n\n if (isDisable) {\n backgroundColor = inputColors.bgDisable;\n borderColor = inputColors.borderDisable;\n } else if (isError) {\n outlineColor = theme.colors.border.alert;\n if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n }\n } else if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n outlineColor = theme.colors.border.brand;\n }\n\n const textColor = isDisable ? inputColors.textDisable : inputColors.text;\n const placeholderColor = inputColors.placeholder;\n\n // Padding values from Figma design\n const paddingConfig = {\n xl: { vertical: 12, horizontal: 12 },\n lg: { vertical: 14, horizontal: 12 },\n md: { vertical: 11, horizontal: 12 },\n sm: { vertical: 7, horizontal: 10 },\n xs: { vertical: 7, horizontal: 10 },\n };\n\n // Border radius from Figma design\n const borderRadiusConfig = {\n xl: 8,\n lg: 8,\n md: 8,\n sm: 4,\n xs: 4,\n };\n\n // Icon sizes from Figma design\n const iconSizeConfig = {\n xl: 18,\n lg: 18,\n md: 18,\n sm: 16,\n xs: 16,\n };\n\n // Focus outline config from Figma design\n const focusOutlineConfig = {\n xl: { width: 1, offset: -1 },\n lg: { width: 1, offset: -1 },\n md: { width: 1, offset: -1 },\n sm: { width: 1, offset: -1 },\n xs: { width: 1, offset: -1 },\n };\n\n const padding = paddingConfig[size];\n const borderRadius = borderRadiusConfig[size];\n const iconSize = iconSizeConfig[size];\n const focusOutline = focusOutlineConfig[size];\n\n return (\n <Box\n flexDirection=\"column\"\n gap={sizeStyles.fieldGap}\n width=\"100%\"\n testID={testID}\n >\n {label && (\n <Box as=\"label\" id={labelId}>\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\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n height={sizeStyles.height}\n paddingVertical={padding.vertical}\n paddingHorizontal={padding.horizontal}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={10}\n position=\"relative\"\n style={{\n borderTopLeftRadius: borderTopLeftRadiusOverride ?? borderRadius,\n borderTopRightRadius: borderTopRightRadiusOverride ?? borderRadius,\n borderBottomLeftRadius:\n borderBottomLeftRadiusOverride ?? borderRadius,\n borderBottomRightRadius:\n borderBottomRightRadiusOverride ?? borderRadius,\n ...(outlineColor\n ? {\n outline: `${focusOutline.width}px solid ${outlineColor}`,\n outlineOffset: `${focusOutline.offset}px`,\n }\n : {}),\n }}\n hoverStyle={\n !isDisable && !isFocus && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n {isLeftInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconSize} color={textColor}>\n {iconLeft}\n </Icon>\n </Box>\n )}\n\n <Box flex={1} height=\"100%\" justifyContent=\"center\">\n <InputPrimitive\n ref={inputRef}\n id={inputId}\n value={passValue}\n name={name}\n placeholder={placeholder}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n disabled={isDisable}\n type={type || \"text\"}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n placeholderTextColor={placeholderColor}\n aria-invalid={isError || undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n aria-disabled={isDisable || undefined}\n data-testid=\"input__field\"\n {...rest}\n />\n </Box>\n\n {/* Right-side Extras Wrapper */}\n {extrasCount > 0 && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={4}>\n {isExtraClearIconShown && (\n <Box\n as=\"button\"\n type=\"button\"\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n cursor={disabled ? \"not-allowed\" : \"pointer\"}\n onPress={!disabled ? handleClear : undefined}\n disabled={disabled}\n data-testid=\"input__extra-clear-button\"\n >\n <Icon size={iconSize} color={textColor}>\n <Remove />\n </Icon>\n </Box>\n )}\n {isCheckedShown && (\n <Box\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.success.primary}\n >\n {checkedIcon}\n </Icon>\n </Box>\n )}\n {isRightInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconRightSize || iconSize} color={textColor}>\n {iconRight}\n </Icon>\n </Box>\n )}\n </Box>\n )}\n </Box>\n\n {errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInput.displayName = \"Input\";\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 numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n","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","import React, { forwardRef } from \"react\";\nimport styled from \"styled-components\";\nimport { InputPrimitiveProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledInput = styled.input<InputPrimitiveProps>`\n background: transparent;\n border: none;\n outline: none;\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\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-family: inherit;\n text-align: inherit;\n\n &::placeholder {\n color: ${(props) =>\n props.placeholderTextColor || \"rgba(255, 255, 255, 0.5)\"};\n }\n\n &:disabled {\n cursor: not-allowed;\n }\n`;\n\nexport const InputPrimitive = forwardRef<HTMLInputElement, InputPrimitiveProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onFocus,\n onBlur,\n onKeyDown,\n disabled,\n secureTextEntry,\n style,\n color,\n fontSize,\n placeholderTextColor,\n maxLength,\n name,\n type,\n inputMode,\n autoComplete,\n id,\n \"aria-invalid\": ariaInvalid,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-label\": ariaLabel,\n \"aria-disabled\": ariaDisabled,\n \"data-testid\": dataTestId,\n ...rest\n },\n ref\n ) => {\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(e.target.value);\n }\n };\n\n // Always pass value to make it a controlled input\n const inputValue = value !== undefined ? value : \"\";\n\n return (\n <StyledInput\n ref={ref}\n id={id}\n value={inputValue}\n name={name}\n placeholder={placeholder}\n onChange={handleChange}\n onFocus={onFocus}\n onBlur={onBlur}\n onKeyDown={onKeyDown}\n disabled={disabled}\n type={secureTextEntry ? \"password\" : type || \"text\"}\n inputMode={inputMode}\n autoComplete={autoComplete}\n style={style}\n color={color}\n fontSize={fontSize}\n placeholderTextColor={placeholderTextColor}\n maxLength={maxLength}\n aria-invalid={ariaInvalid}\n aria-describedby={ariaDescribedBy}\n aria-labelledby={ariaLabelledBy}\n aria-label={ariaLabel}\n aria-disabled={ariaDisabled}\n data-testid={dataTestId}\n {...rest}\n />\n );\n }\n);\n\nInputPrimitive.displayName = \"InputPrimitive\";\n"],"mappings":"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","names":["React","forwardRef","styled","jsx","styled","jsx","styled","jsx","jsx","forwardRef","React"]}