@xsolla/xui-input-password 0.112.0 → 0.113.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 +31 -3
- package/native/index.js.map +1 -1
- package/native/index.mjs +35 -4
- package/native/index.mjs.map +1 -1
- package/package.json +4 -4
- package/web/index.js +1 -0
- package/web/index.js.map +1 -1
- package/web/index.mjs +1 -0
- package/web/index.mjs.map +1 -1
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
|
|
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)(
|
|
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
|
package/native/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/index.tsx","../../src/InputPassword.tsx","../../../primitives-native/src/Box.tsx","../../../primitives-native/src/Text.tsx","../../../primitives-native/src/Icon.tsx","../../../primitives-native/src/Input.tsx"],"sourcesContent":["export * from \"./InputPassword\";\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 {\n Eye,\n EyeOff,\n Remove,\n CheckCr,\n ExclamationMarkCr,\n} from \"@xsolla/xui-icons-base\";\n\nexport interface InputPasswordProps extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"onChange\"\n> {\n /**\n * Add eye in input with see password function.\n */\n extraSee?: boolean;\n /**\n * Add function clear for input.\n */\n extraClear?: boolean;\n /**\n * Property for specifying the name of the control.\n */\n name?: string;\n /**\n * Property for displaying an error and highlighting the control as invalid.\n */\n error?: boolean;\n /**\n * Visible password in the field.\n */\n initialVisible?: boolean;\n /**\n * Add checkup function for input. Can use after change input value.\n */\n extraCheckup?: (pass: string) => boolean;\n /**\n * Property for specifying the value of the control.\n */\n value?: string;\n /**\n * Property for displaying an error message and highlighting the control as invalid.\n */\n errorMessage?: string;\n /**\n * Property for specifying the placeholder of the control.\n */\n placeholder?: string;\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 and highlighting it as an inactive state.\n */\n disabled?: boolean;\n /**\n * Property for displaying a label above the input.\n */\n label?: string;\n /**\n * Property for displaying helper text below the input.\n */\n helperText?: 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 * Function triggered when user clicks on extraClear button.\n */\n onRemove?: () => void;\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 * Test identifier for the component.\n */\n testID?: string;\n}\n\nexport const InputPassword = forwardRef<HTMLInputElement, InputPasswordProps>(\n (\n {\n extraSee = false,\n extraClear = false,\n extraCheckup,\n initialVisible = false,\n value,\n placeholder,\n onChange,\n onChangeText,\n onKeyDown,\n onRemove,\n size = \"md\",\n disabled = false,\n name,\n label,\n helperText,\n errorMessage,\n error,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [isVisible, setIsVisible] = useState(initialVisible);\n const [internalState, setInternalState] = useState<\"default\" | \"focus\">(\n \"default\"\n );\n const [passValue, setPassValue] = useState(value ?? \"\");\n const [isChecked, setIsChecked] = useState(false);\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-password-${safeId}`;\n const labelId = `${inputId}-label`;\n const errorId = `${inputId}-error`;\n const helperId = `${inputId}-helper`;\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\n useEffect(() => {\n if (value !== undefined) {\n setPassValue(value);\n }\n }, [value]);\n\n // Run extraCheckup when passValue changes\n useEffect(() => {\n if (extraCheckup && passValue) {\n setIsChecked(extraCheckup(passValue));\n } else {\n setIsChecked(false);\n }\n }, [passValue, extraCheckup]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const isFocus = internalState === \"focus\";\n\n // Handle checked status (only show if not error and extraCheckup returns true)\n const isCheckedShown = isChecked && !isError;\n // Clear button visibility depends on internal state\n const isExtraClearIconShown = !disabled && extraClear && !!passValue;\n // Eye toggle visibility\n const isExtraSeeShown = extraSee;\n // Error icon visibility\n const isErrorIconShown = isError;\n\n const extrasCount =\n Number(isExtraClearIconShown) +\n Number(isCheckedShown) +\n Number(isExtraSeeShown) +\n Number(isErrorIconShown);\n\n // Resolve Config from Theme\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n const handleFocus = () => {\n if (!isDisable) {\n setInternalState(\"focus\");\n }\n };\n\n const handleBlur = () => {\n if (!isDisable) {\n setInternalState(\"default\");\n }\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(newValue);\n }\n\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 const handleClear = (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n setPassValue(\"\");\n onRemove?.();\n\n if (inputRef.current) {\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 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 const toggleVisibility = () => {\n setIsVisible(!isVisible);\n };\n\n // Resolve background and border colors based on state\n let backgroundColor = 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 const iconColor = isDisable ? inputColors.placeholder : inputColors.text;\n\n // Padding values from Figma design\n const paddingConfig: Record<\n string,\n { vertical: number; horizontal: number }\n > = {\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: Record<string, number> = {\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: Record<string, number> = {\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: Record<\n string,\n { width: number; offset: number }\n > = {\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 flexDirection=\"column\" gap={8} width=\"100%\" testID={testID}>\n {label && (\n <Box as=\"label\" id={labelId} htmlFor={inputId}>\n <Text\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n </Box>\n )}\n <Box\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n borderRadius={borderRadius}\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 ...(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 <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={isVisible ? \"text\" : \"password\"}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n placeholderTextColor={placeholderColor}\n aria-invalid={isError || undefined}\n aria-describedby={\n errorMessage ? errorId : helperText ? helperId : undefined\n }\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n aria-disabled={isDisable || undefined}\n data-testid=\"input-password__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 aria-label=\"Clear input\"\n data-testid=\"input-password__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 role=\"img\"\n aria-label=\"Password meets requirements\"\n data-testid=\"input-password__check-icon\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.success.primary}\n >\n <CheckCr />\n </Icon>\n </Box>\n )}\n {isExtraSeeShown && (\n <Box\n as=\"button\"\n type=\"button\"\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n cursor=\"pointer\"\n onPress={toggleVisibility}\n aria-label={isVisible ? \"Hide password\" : \"Show password\"}\n aria-pressed={isVisible}\n data-testid=\"input-password__visibility-toggle\"\n >\n {isVisible ? (\n <Eye size={iconSize} color={iconColor} />\n ) : (\n <EyeOff size={iconSize} color={iconColor} />\n )}\n </Box>\n )}\n {isErrorIconShown && (\n <Box\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n role=\"img\"\n aria-label=\"Error\"\n data-testid=\"input-password__error-icon\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.alert.primary}\n >\n <ExclamationMarkCr />\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 >\n {errorMessage}\n </Text>\n )}\n\n {helperText && !errorMessage && (\n <Text\n id={helperId}\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n >\n {helperText}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInputPassword.displayName = \"InputPassword\";\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/InputPassword.tsx","../../../primitives-native/src/Box.tsx","../../../primitives-native/src/Text.tsx","../../../primitives-native/src/Icon.tsx","../../../primitives-native/src/Input.tsx"],"sourcesContent":["export * from \"./InputPassword\";\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 {\n Eye,\n EyeOff,\n Remove,\n CheckCr,\n ExclamationMarkCr,\n} from \"@xsolla/xui-icons-base\";\n\nexport interface InputPasswordProps extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"onChange\"\n> {\n /**\n * Add eye in input with see password function.\n */\n extraSee?: boolean;\n /**\n * Add function clear for input.\n */\n extraClear?: boolean;\n /**\n * Property for specifying the name of the control.\n */\n name?: string;\n /**\n * Property for displaying an error and highlighting the control as invalid.\n */\n error?: boolean;\n /**\n * Visible password in the field.\n */\n initialVisible?: boolean;\n /**\n * Add checkup function for input. Can use after change input value.\n */\n extraCheckup?: (pass: string) => boolean;\n /**\n * Property for specifying the value of the control.\n */\n value?: string;\n /**\n * Property for displaying an error message and highlighting the control as invalid.\n */\n errorMessage?: string;\n /**\n * Property for specifying the placeholder of the control.\n */\n placeholder?: string;\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 and highlighting it as an inactive state.\n */\n disabled?: boolean;\n /**\n * Property for displaying a label above the input.\n */\n label?: string;\n /**\n * Property for displaying helper text below the input.\n */\n helperText?: 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 * Function triggered when user clicks on extraClear button.\n */\n onRemove?: () => void;\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 * Test identifier for the component.\n */\n testID?: string;\n}\n\nexport const InputPassword = forwardRef<HTMLInputElement, InputPasswordProps>(\n (\n {\n extraSee = false,\n extraClear = false,\n extraCheckup,\n initialVisible = false,\n value,\n placeholder,\n onChange,\n onChangeText,\n onKeyDown,\n onRemove,\n size = \"md\",\n disabled = false,\n name,\n label,\n helperText,\n errorMessage,\n error,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [isVisible, setIsVisible] = useState(initialVisible);\n const [internalState, setInternalState] = useState<\"default\" | \"focus\">(\n \"default\"\n );\n const [passValue, setPassValue] = useState(value ?? \"\");\n const [isChecked, setIsChecked] = useState(false);\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-password-${safeId}`;\n const labelId = `${inputId}-label`;\n const errorId = `${inputId}-error`;\n const helperId = `${inputId}-helper`;\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\n useEffect(() => {\n if (value !== undefined) {\n setPassValue(value);\n }\n }, [value]);\n\n // Run extraCheckup when passValue changes\n useEffect(() => {\n if (extraCheckup && passValue) {\n setIsChecked(extraCheckup(passValue));\n } else {\n setIsChecked(false);\n }\n }, [passValue, extraCheckup]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const isFocus = internalState === \"focus\";\n\n // Handle checked status (only show if not error and extraCheckup returns true)\n const isCheckedShown = isChecked && !isError;\n // Clear button visibility depends on internal state\n const isExtraClearIconShown = !disabled && extraClear && !!passValue;\n // Eye toggle visibility\n const isExtraSeeShown = extraSee;\n // Error icon visibility\n const isErrorIconShown = isError;\n\n const extrasCount =\n Number(isExtraClearIconShown) +\n Number(isCheckedShown) +\n Number(isExtraSeeShown) +\n Number(isErrorIconShown);\n\n // Resolve Config from Theme\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n const handleFocus = () => {\n if (!isDisable) {\n setInternalState(\"focus\");\n }\n };\n\n const handleBlur = () => {\n if (!isDisable) {\n setInternalState(\"default\");\n }\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(newValue);\n }\n\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 const handleClear = (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n setPassValue(\"\");\n onRemove?.();\n\n if (inputRef.current) {\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 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 const toggleVisibility = () => {\n setIsVisible(!isVisible);\n };\n\n // Resolve background and border colors based on state\n let backgroundColor = 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 const iconColor = isDisable ? inputColors.placeholder : inputColors.text;\n\n // Padding values from Figma design\n const paddingConfig: Record<\n string,\n { vertical: number; horizontal: number }\n > = {\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: Record<string, number> = {\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: Record<string, number> = {\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: Record<\n string,\n { width: number; offset: number }\n > = {\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 flexDirection=\"column\" gap={8} width=\"100%\" testID={testID}>\n {label && (\n <Box as=\"label\" id={labelId} htmlFor={inputId}>\n <Text\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n </Box>\n )}\n <Box\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n borderRadius={borderRadius}\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 ...(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 <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={isVisible ? \"text\" : \"password\"}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n placeholderTextColor={placeholderColor}\n aria-invalid={isError || undefined}\n aria-describedby={\n errorMessage ? errorId : helperText ? helperId : undefined\n }\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n aria-disabled={isDisable || undefined}\n data-testid=\"input-password__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 aria-label=\"Clear input\"\n data-testid=\"input-password__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 role=\"img\"\n aria-label=\"Password meets requirements\"\n data-testid=\"input-password__check-icon\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.success.primary}\n >\n <CheckCr />\n </Icon>\n </Box>\n )}\n {isExtraSeeShown && (\n <Box\n as=\"button\"\n type=\"button\"\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n cursor=\"pointer\"\n onPress={toggleVisibility}\n aria-label={isVisible ? \"Hide password\" : \"Show password\"}\n aria-pressed={isVisible}\n data-testid=\"input-password__visibility-toggle\"\n >\n {isVisible ? (\n <Eye size={iconSize} color={iconColor} />\n ) : (\n <EyeOff size={iconSize} color={iconColor} />\n )}\n </Box>\n )}\n {isErrorIconShown && (\n <Box\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n role=\"img\"\n aria-label=\"Error\"\n data-testid=\"input-password__error-icon\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.alert.primary}\n >\n <ExclamationMarkCr />\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 >\n {errorMessage}\n </Text>\n )}\n\n {helperText && !errorMessage && (\n <Text\n id={helperId}\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n >\n {helperText}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInputPassword.displayName = \"InputPassword\";\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,IAAAA,gBAMO;;;ACLP,0BAQO;AAmID;AAhIC,IAAM,MAA0B,CAAC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,oBAAoB,CAAC,aAAkC;AAAA,IAC3D,iBACE,WAAW,YAAY,kBACnB,WAAW,kBACX;AAAA,IACN;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;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,GAAI;AAAA,EACN;AAEA,QAAM,cAAc,cAAc;AAIlC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB,aAAa;AAAA,IACb;AAAA,IACA,eAAe;AAAA,IACf,GAAG;AAAA,EACL,IAAI;AAGJ,MAAI,OAAO,SAAS,KAAK;AACvB,UAAM,aAAyB;AAAA,MAC7B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAI;AAAA,IACN;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,QAAQ,EAAE,KAAK,IAAI;AAAA,QACnB,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,YAAW;AAAA,QACV,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AAEA,MAAI,SAAS;AACX,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,OAAO,CAAC,EAAE,QAAQ,MAAM,kBAAkB,OAAO;AAAA,QACjD,QAAQ;AAAA,QACP,GAAG;AAAA,QAEH;AAAA;AAAA,IACH;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,kBAAkB;AAAA,MACzB,QAAQ;AAAA,MACR;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;;;ACvLA,IAAAC,uBAKO;AAmEH,IAAAC,sBAAA;AAhEJ,IAAM,UAA6C;AAAA,EACjD,OAAO;AAAA,EACP,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,MAAM;AACR;AAEA,IAAM,oBAAoB,CACxB,UACuB;AACvB,MAAI,UAAU,OAAW,QAAO;AAChC,MAAI,OAAO,UAAU,SAAU,QAAO;AACtC,QAAM,SAAS,WAAW,KAAK;AAC/B,SAAO,MAAM,MAAM,IAAI,SAAY;AACrC;AAEO,IAAM,OAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,GAAG;AACL,MAAM;AACJ,MAAI,qBAAqB,aACrB,WAAW,MAAM,GAAG,EAAE,CAAC,EAAE,QAAQ,SAAS,EAAE,EAAE,KAAK,IACnD;AAEJ,MACE,uBAAuB,gBACvB,uBAAuB,qBACvB,uBAAuB,iBACvB;AACA,yBAAqB;AAAA,EACvB;AAEA,QAAM,gBAAgB,gCAAW,QAAQ,SAAS;AAElD,QAAM,YAAuB;AAAA,IAC3B;AAAA,IACA,UAAU,OAAO,aAAa,WAAW,WAAW;AAAA,IACpD;AAAA,IACA,YAAY;AAAA,IACZ,oBAAoB,MAAM;AAAA,IAC1B,WAAW,aAAa,eAAe;AAAA,IACvC,YAAY,kBAAkB,cAAc,eAAe,UAAU;AAAA,IACrE,WAAW;AAAA,MACT,eAAe;AAAA,IACjB;AAAA,IACA,cAAc;AAAA,MACZ,eAAe;AAAA,IACjB;AAAA,EACF;AAEA,QAAM,oBAAoB,OAAO,QAAQ,IAAI,IAAI;AAEjD,SACE;AAAA,IAAC,qBAAAC;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,MACP;AAAA,MACA,QAAQ;AAAA,MACR;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;;;AClFA,mBAAkB;AAClB,IAAAC,uBAAgC;AAwBvB,IAAAC,sBAAA;AArBF,IAAM,OAA4B,CAAC,EAAE,UAAU,OAAO,KAAK,MAAM;AACtE,QAAM,QAAmB;AAAA,IACvB,OAAO,OAAO,SAAS,WAAW,OAAO;AAAA,IACzC,QAAQ,OAAO,SAAS,WAAW,OAAO;AAAA,IAC1C,YAAY;AAAA,IACZ,gBAAgB;AAAA,EAClB;AAIA,QAAM,oBAAoB,aAAAC,QAAM,SAAS,IAAI,UAAU,CAAC,UAAU;AAChE,QAAI,aAAAA,QAAM,eAAe,KAAK,GAAG;AAC/B,aAAO,aAAAA,QAAM,aAAa,OAAO;AAAA,QAC/B,OAAO,MAAM,MAAM,SAAS;AAAA;AAAA,QAE5B,MAAM,MAAM,MAAM,QAAQ;AAAA,MAC5B,CAAC;AAAA,IACH;AACA,WAAO;AAAA,EACT,CAAC;AAED,SAAO,6CAAC,6BAAK,OAAe,6BAAkB;AAChD;;;AC1BA,IAAAC,gBAAkC;AAClC,IAAAC,uBAAyC;AAkGnC,IAAAC,sBAAA;AA9FN,IAAM,kBAAuC;AAAA,EAC3C,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,KAAK;AAAA,EACL,KAAK;AAAA,EACL,SAAS;AACX;AAGA,IAAM,0BAA+C;AAAA,EACnD,MAAM;AAAA,EACN,MAAM;AAAA,EACN,SAAS;AAAA,EACT,SAAS;AAAA,EACT,KAAK;AAAA,EACL,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,KAAK;AACP;AAGA,IAAM,gCAAqD;AAAA,EACzD,iBAAiB;AAAA,EACjB,OAAO;AAAA,EACP,UAAU;AAAA,EACV,UAAU;AAAA,EACV,gBAAgB;AAAA,EAChB,KAAK;AAAA,EACL,eAAe;AAAA,EACf,MAAM;AACR;AAEO,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,oBAAoB;AAAA,IACpB,cAAc;AAAA,IACd,iBAAiB;AAAA,IACjB,eAAe;AAAA,EACjB,GACA,QACG;AACH,UAAM,mBAAmB,CAAC,SAAiB;AACzC,qBAAe,IAAI;AAKnB,UAAI,UAAU;AACZ,cAAM,iBAAiB;AAAA,UACrB,QAAQ,EAAE,OAAO,KAAK;AAAA,UACtB,eAAe,EAAE,OAAO,KAAK;AAAA,UAC7B,MAAM;AAAA,UACN,aAAa,EAAE,KAAK;AAAA,UACpB,gBAAgB,MAAM;AAAA,UAAC;AAAA,UACvB,iBAAiB,MAAM;AAAA,UAAC;AAAA,UACxB,WAAW;AAAA,QACb;AACA,iBAAS,cAAc;AAAA,MACzB;AAAA,IACF;AAGA,UAAM,eAAe,YACjB,wBAAwB,SAAS,KAAK,YACtC,OACE,gBAAgB,IAAI,KAAK,YACzB;AAGN,UAAM,kBAAkB,eACpB,8BAA8B,YAAY,IAC1C;AAEJ,WACE;AAAA,MAAC,qBAAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA,cAAc;AAAA,QACd;AAAA,QACA;AAAA,QACA,YAAY,CAAC,MAAM;AAGjB,cAAI,WAAW;AACb,sBAAU;AAAA,cACR,KAAK,EAAE,YAAY;AAAA,cACnB,gBAAgB,MAAM;AAAA,cAAC;AAAA,YACzB,CAAQ;AAAA,UACV;AAAA,QACF;AAAA,QACA,UAAU,CAAC;AAAA,QACX,iBAAiB,mBAAmB,SAAS;AAAA,QAC7C;AAAA,QACA;AAAA,QACA,OAAO;AAAA,UACL;AAAA,YACE;AAAA,YACA,UAAU,OAAO,aAAa,WAAW,WAAW;AAAA,YACpD,MAAM;AAAA,YACN,SAAS;AAAA,YACT,WAAY,OAAe,aAAa;AAAA,UAC1C;AAAA,UACA;AAAA,QACF;AAAA,QACA;AAAA,QACA;AAAA,QAEA,QAAQ,cAAc;AAAA,QACtB,oBAAoB;AAAA,QACpB,mBAAmB;AAAA,QACnB,oBAAoB;AAAA,UAClB,UAAU,YAAY;AAAA,QACxB;AAAA,QACA,YAAY;AAAA;AAAA,IACd;AAAA,EAEJ;AACF;AAEA,eAAe,cAAc;;;AJxI7B,sBAAuC;AACvC,4BAMO;AAyTK,IAAAC,sBAAA;AArOL,IAAM,oBAAgB;AAAA,EAC3B,CACE;AAAA,IACE,WAAW;AAAA,IACX,aAAa;AAAA,IACb;AAAA,IACA,iBAAiB;AAAA,IACjB;AAAA,IACA;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,IAAI;AAAA,IACJ,cAAc;AAAA,IACd;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,EAAE,MAAM,QAAI,iCAAgB;AAClC,UAAM,CAAC,WAAW,YAAY,QAAI,wBAAS,cAAc;AACzD,UAAM,CAAC,eAAe,gBAAgB,QAAI;AAAA,MACxC;AAAA,IACF;AACA,UAAM,CAAC,WAAW,YAAY,QAAI,wBAAS,SAAS,EAAE;AACtD,UAAM,CAAC,WAAW,YAAY,QAAI,wBAAS,KAAK;AAChD,UAAM,eAAW,sBAAyB,IAAI;AAG9C,UAAM,YAAQ,uBAAM;AACpB,UAAM,SAAS,MAAM,QAAQ,MAAM,EAAE;AACrC,UAAM,UAAU,cAAc,kBAAkB,MAAM;AACtD,UAAM,UAAU,GAAG,OAAO;AAC1B,UAAM,UAAU,GAAG,OAAO;AAC1B,UAAM,WAAW,GAAG,OAAO;AAG3B,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;AAGV,iCAAU,MAAM;AACd,UAAI,gBAAgB,WAAW;AAC7B,qBAAa,aAAa,SAAS,CAAC;AAAA,MACtC,OAAO;AACL,qBAAa,KAAK;AAAA,MACpB;AAAA,IACF,GAAG,CAAC,WAAW,YAAY,CAAC;AAE5B,UAAM,YAAY;AAClB,UAAM,UAAU,CAAC,EAAE,gBAAgB;AACnC,UAAM,UAAU,kBAAkB;AAGlC,UAAM,iBAAiB,aAAa,CAAC;AAErC,UAAM,wBAAwB,CAAC,YAAY,cAAc,CAAC,CAAC;AAE3D,UAAM,kBAAkB;AAExB,UAAM,mBAAmB;AAEzB,UAAM,cACJ,OAAO,qBAAqB,IAC5B,OAAO,cAAc,IACrB,OAAO,eAAe,IACtB,OAAO,gBAAgB;AAGzB,UAAM,aAAa,MAAM,OAAO,MAAM,IAAI;AAC1C,UAAM,cAAc,MAAM,OAAO,QAAQ;AAEzC,UAAM,cAAc,MAAM;AACxB,UAAI,CAAC,WAAW;AACd,yBAAiB,OAAO;AAAA,MAC1B;AAAA,IACF;AAEA,UAAM,aAAa,MAAM;AACvB,UAAI,CAAC,WAAW;AACd,yBAAiB,SAAS;AAAA,MAC5B;AAAA,IACF;AAEA,UAAM,eAAe,CAAC,MAA2C;AAC/D,YAAM,WAAW,EAAE,OAAO;AAE1B,UAAI,UAAU;AACZ,iBAAS,CAAC;AAAA,MACZ;AACA,UAAI,cAAc;AAChB,qBAAa,QAAQ;AAAA,MACvB;AAEA,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;AAEA,UAAM,cAAc,CAAC,MAAqC;AACxD,QAAE,gBAAgB;AAClB,mBAAa,EAAE;AACf,iBAAW;AAEX,UAAI,SAAS,SAAS;AACpB,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;AAEA,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;AAEA,UAAM,mBAAmB,MAAM;AAC7B,mBAAa,CAAC,SAAS;AAAA,IACzB;AAGA,QAAI,kBAAkB,YAAY;AAClC,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;AACrC,UAAM,YAAY,YAAY,YAAY,cAAc,YAAY;AAGpE,UAAM,gBAGF;AAAA,MACF,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,qBAA6C;AAAA,MACjD,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAGA,UAAM,iBAAyC;AAAA,MAC7C,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAGA,UAAM,qBAGF;AAAA,MACF,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,8CAAC,OAAI,eAAc,UAAS,KAAK,GAAG,OAAM,QAAO,QAC9C;AAAA,eACC,6CAAC,OAAI,IAAG,SAAQ,IAAI,SAAS,SAAS,SACpC;AAAA,QAAC;AAAA;AAAA,UACC,OAAO,MAAM,OAAO,QAAQ;AAAA,UAC5B,UAAU,WAAW,WAAW;AAAA,UAChC,YAAW;AAAA,UAEV;AAAA;AAAA,MACH,GACF;AAAA,MAEF;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA,aAAa,gBAAgB,gBAAgB,IAAI;AAAA,UACjD;AAAA,UACA,QAAQ,WAAW;AAAA,UACnB,iBAAiB,QAAQ;AAAA,UACzB,mBAAmB,QAAQ;AAAA,UAC3B,eAAc;AAAA,UACd,YAAW;AAAA,UACX,KAAK;AAAA,UACL,UAAS;AAAA,UACT,OAAO;AAAA,YACL,GAAI,eACA;AAAA,cACE,SAAS,GAAG,aAAa,KAAK,YAAY,YAAY;AAAA,cACtD,eAAe,GAAG,aAAa,MAAM;AAAA,YACvC,IACA,CAAC;AAAA,UACP;AAAA,UACA,YACE,CAAC,aAAa,CAAC,WAAW,CAAC,UACvB;AAAA,YACE,iBAAiB,YAAY;AAAA,YAC7B,aAAa,YAAY;AAAA,UAC3B,IACA;AAAA,UAGN;AAAA,yDAAC,OAAI,MAAM,GAAG,QAAO,QAAO,gBAAe,UACzC;AAAA,cAAC;AAAA;AAAA,gBACC,KAAK;AAAA,gBACL,IAAI;AAAA,gBACJ,OAAO;AAAA,gBACP;AAAA,gBACA;AAAA,gBACA,UAAU;AAAA,gBACV,SAAS;AAAA,gBACT,QAAQ;AAAA,gBACR,WAAW;AAAA,gBACX,UAAU;AAAA,gBACV,MAAM,YAAY,SAAS;AAAA,gBAC3B,OAAO;AAAA,gBACP,UAAU,WAAW;AAAA,gBACrB,sBAAsB;AAAA,gBACtB,gBAAc,WAAW;AAAA,gBACzB,oBACE,eAAe,UAAU,aAAa,WAAW;AAAA,gBAEnD,mBAAiB,QAAQ,UAAU;AAAA,gBACnC,cAAY,CAAC,QAAQ,YAAY;AAAA,gBACjC,iBAAe,aAAa;AAAA,gBAC5B,eAAY;AAAA,gBACX,GAAG;AAAA;AAAA,YACN,GACF;AAAA,YAGC,cAAc,KACb,8CAAC,OAAI,eAAc,OAAM,YAAW,UAAS,KAAK,GAC/C;AAAA,uCACC;AAAA,gBAAC;AAAA;AAAA,kBACC,IAAG;AAAA,kBACH,MAAK;AAAA,kBACL,YAAW;AAAA,kBACX,gBAAe;AAAA,kBACf,OAAO;AAAA,kBACP,QAAO;AAAA,kBACP,iBAAgB;AAAA,kBAChB,aAAa;AAAA,kBACb,QAAQ,WAAW,gBAAgB;AAAA,kBACnC,SAAS,CAAC,WAAW,cAAc;AAAA,kBACnC;AAAA,kBACA,cAAW;AAAA,kBACX,eAAY;AAAA,kBAEZ,uDAAC,QAAK,MAAM,UAAU,OAAO,WAC3B,uDAAC,gCAAO,GACV;AAAA;AAAA,cACF;AAAA,cAED,kBACC;AAAA,gBAAC;AAAA;AAAA,kBACC,YAAW;AAAA,kBACX,gBAAe;AAAA,kBACf,OAAO;AAAA,kBACP,QAAO;AAAA,kBACP,MAAK;AAAA,kBACL,cAAW;AAAA,kBACX,eAAY;AAAA,kBAEZ;AAAA,oBAAC;AAAA;AAAA,sBACC,MAAM;AAAA,sBACN,OAAO,MAAM,OAAO,QAAQ,QAAQ;AAAA,sBAEpC,uDAAC,iCAAQ;AAAA;AAAA,kBACX;AAAA;AAAA,cACF;AAAA,cAED,mBACC;AAAA,gBAAC;AAAA;AAAA,kBACC,IAAG;AAAA,kBACH,MAAK;AAAA,kBACL,YAAW;AAAA,kBACX,gBAAe;AAAA,kBACf,iBAAgB;AAAA,kBAChB,aAAa;AAAA,kBACb,QAAO;AAAA,kBACP,SAAS;AAAA,kBACT,cAAY,YAAY,kBAAkB;AAAA,kBAC1C,gBAAc;AAAA,kBACd,eAAY;AAAA,kBAEX,sBACC,6CAAC,6BAAI,MAAM,UAAU,OAAO,WAAW,IAEvC,6CAAC,gCAAO,MAAM,UAAU,OAAO,WAAW;AAAA;AAAA,cAE9C;AAAA,cAED,oBACC;AAAA,gBAAC;AAAA;AAAA,kBACC,YAAW;AAAA,kBACX,gBAAe;AAAA,kBACf,OAAO;AAAA,kBACP,QAAO;AAAA,kBACP,MAAK;AAAA,kBACL,cAAW;AAAA,kBACX,eAAY;AAAA,kBAEZ;AAAA,oBAAC;AAAA;AAAA,sBACC,MAAM;AAAA,sBACN,OAAO,MAAM,OAAO,QAAQ,MAAM;AAAA,sBAElC,uDAAC,2CAAkB;AAAA;AAAA,kBACrB;AAAA;AAAA,cACF;AAAA,eAEJ;AAAA;AAAA;AAAA,MAEJ;AAAA,MAEC,gBACC;AAAA,QAAC;AAAA;AAAA,UACC,IAAI;AAAA,UACJ,MAAK;AAAA,UACL,OAAO,MAAM,OAAO,QAAQ,MAAM;AAAA,UAClC,UAAU,WAAW,WAAW;AAAA,UAE/B;AAAA;AAAA,MACH;AAAA,MAGD,cAAc,CAAC,gBACd;AAAA,QAAC;AAAA;AAAA,UACC,IAAI;AAAA,UACJ,OAAO,MAAM,OAAO,QAAQ;AAAA,UAC5B,UAAU,WAAW,WAAW;AAAA,UAE/B;AAAA;AAAA,MACH;AAAA,OAEJ;AAAA,EAEJ;AACF;AAEA,cAAc,cAAc;","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 {
|
|
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
|
|
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(
|
|
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
|
package/native/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/InputPassword.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 {\n Eye,\n EyeOff,\n Remove,\n CheckCr,\n ExclamationMarkCr,\n} from \"@xsolla/xui-icons-base\";\n\nexport interface InputPasswordProps extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"onChange\"\n> {\n /**\n * Add eye in input with see password function.\n */\n extraSee?: boolean;\n /**\n * Add function clear for input.\n */\n extraClear?: boolean;\n /**\n * Property for specifying the name of the control.\n */\n name?: string;\n /**\n * Property for displaying an error and highlighting the control as invalid.\n */\n error?: boolean;\n /**\n * Visible password in the field.\n */\n initialVisible?: boolean;\n /**\n * Add checkup function for input. Can use after change input value.\n */\n extraCheckup?: (pass: string) => boolean;\n /**\n * Property for specifying the value of the control.\n */\n value?: string;\n /**\n * Property for displaying an error message and highlighting the control as invalid.\n */\n errorMessage?: string;\n /**\n * Property for specifying the placeholder of the control.\n */\n placeholder?: string;\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 and highlighting it as an inactive state.\n */\n disabled?: boolean;\n /**\n * Property for displaying a label above the input.\n */\n label?: string;\n /**\n * Property for displaying helper text below the input.\n */\n helperText?: 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 * Function triggered when user clicks on extraClear button.\n */\n onRemove?: () => void;\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 * Test identifier for the component.\n */\n testID?: string;\n}\n\nexport const InputPassword = forwardRef<HTMLInputElement, InputPasswordProps>(\n (\n {\n extraSee = false,\n extraClear = false,\n extraCheckup,\n initialVisible = false,\n value,\n placeholder,\n onChange,\n onChangeText,\n onKeyDown,\n onRemove,\n size = \"md\",\n disabled = false,\n name,\n label,\n helperText,\n errorMessage,\n error,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [isVisible, setIsVisible] = useState(initialVisible);\n const [internalState, setInternalState] = useState<\"default\" | \"focus\">(\n \"default\"\n );\n const [passValue, setPassValue] = useState(value ?? \"\");\n const [isChecked, setIsChecked] = useState(false);\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-password-${safeId}`;\n const labelId = `${inputId}-label`;\n const errorId = `${inputId}-error`;\n const helperId = `${inputId}-helper`;\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\n useEffect(() => {\n if (value !== undefined) {\n setPassValue(value);\n }\n }, [value]);\n\n // Run extraCheckup when passValue changes\n useEffect(() => {\n if (extraCheckup && passValue) {\n setIsChecked(extraCheckup(passValue));\n } else {\n setIsChecked(false);\n }\n }, [passValue, extraCheckup]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const isFocus = internalState === \"focus\";\n\n // Handle checked status (only show if not error and extraCheckup returns true)\n const isCheckedShown = isChecked && !isError;\n // Clear button visibility depends on internal state\n const isExtraClearIconShown = !disabled && extraClear && !!passValue;\n // Eye toggle visibility\n const isExtraSeeShown = extraSee;\n // Error icon visibility\n const isErrorIconShown = isError;\n\n const extrasCount =\n Number(isExtraClearIconShown) +\n Number(isCheckedShown) +\n Number(isExtraSeeShown) +\n Number(isErrorIconShown);\n\n // Resolve Config from Theme\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n const handleFocus = () => {\n if (!isDisable) {\n setInternalState(\"focus\");\n }\n };\n\n const handleBlur = () => {\n if (!isDisable) {\n setInternalState(\"default\");\n }\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(newValue);\n }\n\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 const handleClear = (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n setPassValue(\"\");\n onRemove?.();\n\n if (inputRef.current) {\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 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 const toggleVisibility = () => {\n setIsVisible(!isVisible);\n };\n\n // Resolve background and border colors based on state\n let backgroundColor = 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 const iconColor = isDisable ? inputColors.placeholder : inputColors.text;\n\n // Padding values from Figma design\n const paddingConfig: Record<\n string,\n { vertical: number; horizontal: number }\n > = {\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: Record<string, number> = {\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: Record<string, number> = {\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: Record<\n string,\n { width: number; offset: number }\n > = {\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 flexDirection=\"column\" gap={8} width=\"100%\" testID={testID}>\n {label && (\n <Box as=\"label\" id={labelId} htmlFor={inputId}>\n <Text\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n </Box>\n )}\n <Box\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n borderRadius={borderRadius}\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 ...(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 <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={isVisible ? \"text\" : \"password\"}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n placeholderTextColor={placeholderColor}\n aria-invalid={isError || undefined}\n aria-describedby={\n errorMessage ? errorId : helperText ? helperId : undefined\n }\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n aria-disabled={isDisable || undefined}\n data-testid=\"input-password__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 aria-label=\"Clear input\"\n data-testid=\"input-password__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 role=\"img\"\n aria-label=\"Password meets requirements\"\n data-testid=\"input-password__check-icon\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.success.primary}\n >\n <CheckCr />\n </Icon>\n </Box>\n )}\n {isExtraSeeShown && (\n <Box\n as=\"button\"\n type=\"button\"\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n cursor=\"pointer\"\n onPress={toggleVisibility}\n aria-label={isVisible ? \"Hide password\" : \"Show password\"}\n aria-pressed={isVisible}\n data-testid=\"input-password__visibility-toggle\"\n >\n {isVisible ? (\n <Eye size={iconSize} color={iconColor} />\n ) : (\n <EyeOff size={iconSize} color={iconColor} />\n )}\n </Box>\n )}\n {isErrorIconShown && (\n <Box\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n role=\"img\"\n aria-label=\"Error\"\n data-testid=\"input-password__error-icon\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.alert.primary}\n >\n <ExclamationMarkCr />\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 >\n {errorMessage}\n </Text>\n )}\n\n {helperText && !errorMessage && (\n <Text\n id={helperId}\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n >\n {helperText}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInputPassword.displayName = \"InputPassword\";\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/InputPassword.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 {\n Eye,\n EyeOff,\n Remove,\n CheckCr,\n ExclamationMarkCr,\n} from \"@xsolla/xui-icons-base\";\n\nexport interface InputPasswordProps extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"onChange\"\n> {\n /**\n * Add eye in input with see password function.\n */\n extraSee?: boolean;\n /**\n * Add function clear for input.\n */\n extraClear?: boolean;\n /**\n * Property for specifying the name of the control.\n */\n name?: string;\n /**\n * Property for displaying an error and highlighting the control as invalid.\n */\n error?: boolean;\n /**\n * Visible password in the field.\n */\n initialVisible?: boolean;\n /**\n * Add checkup function for input. Can use after change input value.\n */\n extraCheckup?: (pass: string) => boolean;\n /**\n * Property for specifying the value of the control.\n */\n value?: string;\n /**\n * Property for displaying an error message and highlighting the control as invalid.\n */\n errorMessage?: string;\n /**\n * Property for specifying the placeholder of the control.\n */\n placeholder?: string;\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 and highlighting it as an inactive state.\n */\n disabled?: boolean;\n /**\n * Property for displaying a label above the input.\n */\n label?: string;\n /**\n * Property for displaying helper text below the input.\n */\n helperText?: 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 * Function triggered when user clicks on extraClear button.\n */\n onRemove?: () => void;\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 * Test identifier for the component.\n */\n testID?: string;\n}\n\nexport const InputPassword = forwardRef<HTMLInputElement, InputPasswordProps>(\n (\n {\n extraSee = false,\n extraClear = false,\n extraCheckup,\n initialVisible = false,\n value,\n placeholder,\n onChange,\n onChangeText,\n onKeyDown,\n onRemove,\n size = \"md\",\n disabled = false,\n name,\n label,\n helperText,\n errorMessage,\n error,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [isVisible, setIsVisible] = useState(initialVisible);\n const [internalState, setInternalState] = useState<\"default\" | \"focus\">(\n \"default\"\n );\n const [passValue, setPassValue] = useState(value ?? \"\");\n const [isChecked, setIsChecked] = useState(false);\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-password-${safeId}`;\n const labelId = `${inputId}-label`;\n const errorId = `${inputId}-error`;\n const helperId = `${inputId}-helper`;\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\n useEffect(() => {\n if (value !== undefined) {\n setPassValue(value);\n }\n }, [value]);\n\n // Run extraCheckup when passValue changes\n useEffect(() => {\n if (extraCheckup && passValue) {\n setIsChecked(extraCheckup(passValue));\n } else {\n setIsChecked(false);\n }\n }, [passValue, extraCheckup]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const isFocus = internalState === \"focus\";\n\n // Handle checked status (only show if not error and extraCheckup returns true)\n const isCheckedShown = isChecked && !isError;\n // Clear button visibility depends on internal state\n const isExtraClearIconShown = !disabled && extraClear && !!passValue;\n // Eye toggle visibility\n const isExtraSeeShown = extraSee;\n // Error icon visibility\n const isErrorIconShown = isError;\n\n const extrasCount =\n Number(isExtraClearIconShown) +\n Number(isCheckedShown) +\n Number(isExtraSeeShown) +\n Number(isErrorIconShown);\n\n // Resolve Config from Theme\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n const handleFocus = () => {\n if (!isDisable) {\n setInternalState(\"focus\");\n }\n };\n\n const handleBlur = () => {\n if (!isDisable) {\n setInternalState(\"default\");\n }\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(newValue);\n }\n\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 const handleClear = (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n setPassValue(\"\");\n onRemove?.();\n\n if (inputRef.current) {\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 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 const toggleVisibility = () => {\n setIsVisible(!isVisible);\n };\n\n // Resolve background and border colors based on state\n let backgroundColor = 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 const iconColor = isDisable ? inputColors.placeholder : inputColors.text;\n\n // Padding values from Figma design\n const paddingConfig: Record<\n string,\n { vertical: number; horizontal: number }\n > = {\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: Record<string, number> = {\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: Record<string, number> = {\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: Record<\n string,\n { width: number; offset: number }\n > = {\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 flexDirection=\"column\" gap={8} width=\"100%\" testID={testID}>\n {label && (\n <Box as=\"label\" id={labelId} htmlFor={inputId}>\n <Text\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n </Box>\n )}\n <Box\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n borderRadius={borderRadius}\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 ...(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 <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={isVisible ? \"text\" : \"password\"}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n placeholderTextColor={placeholderColor}\n aria-invalid={isError || undefined}\n aria-describedby={\n errorMessage ? errorId : helperText ? helperId : undefined\n }\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n aria-disabled={isDisable || undefined}\n data-testid=\"input-password__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 aria-label=\"Clear input\"\n data-testid=\"input-password__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 role=\"img\"\n aria-label=\"Password meets requirements\"\n data-testid=\"input-password__check-icon\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.success.primary}\n >\n <CheckCr />\n </Icon>\n </Box>\n )}\n {isExtraSeeShown && (\n <Box\n as=\"button\"\n type=\"button\"\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n cursor=\"pointer\"\n onPress={toggleVisibility}\n aria-label={isVisible ? \"Hide password\" : \"Show password\"}\n aria-pressed={isVisible}\n data-testid=\"input-password__visibility-toggle\"\n >\n {isVisible ? (\n <Eye size={iconSize} color={iconColor} />\n ) : (\n <EyeOff size={iconSize} color={iconColor} />\n )}\n </Box>\n )}\n {isErrorIconShown && (\n <Box\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n role=\"img\"\n aria-label=\"Error\"\n data-testid=\"input-password__error-icon\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.alert.primary}\n >\n <ExclamationMarkCr />\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 >\n {errorMessage}\n </Text>\n )}\n\n {helperText && !errorMessage && (\n <Text\n id={helperId}\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n >\n {helperText}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInputPassword.displayName = \"InputPassword\";\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-password",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.113.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.
|
|
17
|
-
"@xsolla/xui-icons-base": "0.
|
|
18
|
-
"@xsolla/xui-primitives-core": "0.
|
|
16
|
+
"@xsolla/xui-core": "0.113.0",
|
|
17
|
+
"@xsolla/xui-icons-base": "0.113.0",
|
|
18
|
+
"@xsolla/xui-primitives-core": "0.113.0"
|
|
19
19
|
},
|
|
20
20
|
"peerDependencies": {
|
|
21
21
|
"react": ">=16.8.0",
|
package/web/index.js
CHANGED
package/web/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/index.tsx","../../src/InputPassword.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx","../../../primitives-web/src/Icon.tsx","../../../primitives-web/src/Input.tsx"],"sourcesContent":["export * from \"./InputPassword\";\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 {\n Eye,\n EyeOff,\n Remove,\n CheckCr,\n ExclamationMarkCr,\n} from \"@xsolla/xui-icons-base\";\n\nexport interface InputPasswordProps extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"onChange\"\n> {\n /**\n * Add eye in input with see password function.\n */\n extraSee?: boolean;\n /**\n * Add function clear for input.\n */\n extraClear?: boolean;\n /**\n * Property for specifying the name of the control.\n */\n name?: string;\n /**\n * Property for displaying an error and highlighting the control as invalid.\n */\n error?: boolean;\n /**\n * Visible password in the field.\n */\n initialVisible?: boolean;\n /**\n * Add checkup function for input. Can use after change input value.\n */\n extraCheckup?: (pass: string) => boolean;\n /**\n * Property for specifying the value of the control.\n */\n value?: string;\n /**\n * Property for displaying an error message and highlighting the control as invalid.\n */\n errorMessage?: string;\n /**\n * Property for specifying the placeholder of the control.\n */\n placeholder?: string;\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 and highlighting it as an inactive state.\n */\n disabled?: boolean;\n /**\n * Property for displaying a label above the input.\n */\n label?: string;\n /**\n * Property for displaying helper text below the input.\n */\n helperText?: 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 * Function triggered when user clicks on extraClear button.\n */\n onRemove?: () => void;\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 * Test identifier for the component.\n */\n testID?: string;\n}\n\nexport const InputPassword = forwardRef<HTMLInputElement, InputPasswordProps>(\n (\n {\n extraSee = false,\n extraClear = false,\n extraCheckup,\n initialVisible = false,\n value,\n placeholder,\n onChange,\n onChangeText,\n onKeyDown,\n onRemove,\n size = \"md\",\n disabled = false,\n name,\n label,\n helperText,\n errorMessage,\n error,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [isVisible, setIsVisible] = useState(initialVisible);\n const [internalState, setInternalState] = useState<\"default\" | \"focus\">(\n \"default\"\n );\n const [passValue, setPassValue] = useState(value ?? \"\");\n const [isChecked, setIsChecked] = useState(false);\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-password-${safeId}`;\n const labelId = `${inputId}-label`;\n const errorId = `${inputId}-error`;\n const helperId = `${inputId}-helper`;\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\n useEffect(() => {\n if (value !== undefined) {\n setPassValue(value);\n }\n }, [value]);\n\n // Run extraCheckup when passValue changes\n useEffect(() => {\n if (extraCheckup && passValue) {\n setIsChecked(extraCheckup(passValue));\n } else {\n setIsChecked(false);\n }\n }, [passValue, extraCheckup]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const isFocus = internalState === \"focus\";\n\n // Handle checked status (only show if not error and extraCheckup returns true)\n const isCheckedShown = isChecked && !isError;\n // Clear button visibility depends on internal state\n const isExtraClearIconShown = !disabled && extraClear && !!passValue;\n // Eye toggle visibility\n const isExtraSeeShown = extraSee;\n // Error icon visibility\n const isErrorIconShown = isError;\n\n const extrasCount =\n Number(isExtraClearIconShown) +\n Number(isCheckedShown) +\n Number(isExtraSeeShown) +\n Number(isErrorIconShown);\n\n // Resolve Config from Theme\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n const handleFocus = () => {\n if (!isDisable) {\n setInternalState(\"focus\");\n }\n };\n\n const handleBlur = () => {\n if (!isDisable) {\n setInternalState(\"default\");\n }\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(newValue);\n }\n\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 const handleClear = (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n setPassValue(\"\");\n onRemove?.();\n\n if (inputRef.current) {\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 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 const toggleVisibility = () => {\n setIsVisible(!isVisible);\n };\n\n // Resolve background and border colors based on state\n let backgroundColor = 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 const iconColor = isDisable ? inputColors.placeholder : inputColors.text;\n\n // Padding values from Figma design\n const paddingConfig: Record<\n string,\n { vertical: number; horizontal: number }\n > = {\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: Record<string, number> = {\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: Record<string, number> = {\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: Record<\n string,\n { width: number; offset: number }\n > = {\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 flexDirection=\"column\" gap={8} width=\"100%\" testID={testID}>\n {label && (\n <Box as=\"label\" id={labelId} htmlFor={inputId}>\n <Text\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n </Box>\n )}\n <Box\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n borderRadius={borderRadius}\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 ...(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 <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={isVisible ? \"text\" : \"password\"}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n placeholderTextColor={placeholderColor}\n aria-invalid={isError || undefined}\n aria-describedby={\n errorMessage ? errorId : helperText ? helperId : undefined\n }\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n aria-disabled={isDisable || undefined}\n data-testid=\"input-password__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 aria-label=\"Clear input\"\n data-testid=\"input-password__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 role=\"img\"\n aria-label=\"Password meets requirements\"\n data-testid=\"input-password__check-icon\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.success.primary}\n >\n <CheckCr />\n </Icon>\n </Box>\n )}\n {isExtraSeeShown && (\n <Box\n as=\"button\"\n type=\"button\"\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n cursor=\"pointer\"\n onPress={toggleVisibility}\n aria-label={isVisible ? \"Hide password\" : \"Show password\"}\n aria-pressed={isVisible}\n data-testid=\"input-password__visibility-toggle\"\n >\n {isVisible ? (\n <Eye size={iconSize} color={iconColor} />\n ) : (\n <EyeOff size={iconSize} color={iconColor} />\n )}\n </Box>\n )}\n {isErrorIconShown && (\n <Box\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n role=\"img\"\n aria-label=\"Error\"\n data-testid=\"input-password__error-icon\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.alert.primary}\n >\n <ExclamationMarkCr />\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 >\n {errorMessage}\n </Text>\n )}\n\n {helperText && !errorMessage && (\n <Text\n id={helperId}\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n >\n {helperText}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInputPassword.displayName = \"InputPassword\";\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/InputPassword.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx","../../../primitives-web/src/Icon.tsx","../../../primitives-web/src/Input.tsx"],"sourcesContent":["export * from \"./InputPassword\";\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 {\n Eye,\n EyeOff,\n Remove,\n CheckCr,\n ExclamationMarkCr,\n} from \"@xsolla/xui-icons-base\";\n\nexport interface InputPasswordProps extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"onChange\"\n> {\n /**\n * Add eye in input with see password function.\n */\n extraSee?: boolean;\n /**\n * Add function clear for input.\n */\n extraClear?: boolean;\n /**\n * Property for specifying the name of the control.\n */\n name?: string;\n /**\n * Property for displaying an error and highlighting the control as invalid.\n */\n error?: boolean;\n /**\n * Visible password in the field.\n */\n initialVisible?: boolean;\n /**\n * Add checkup function for input. Can use after change input value.\n */\n extraCheckup?: (pass: string) => boolean;\n /**\n * Property for specifying the value of the control.\n */\n value?: string;\n /**\n * Property for displaying an error message and highlighting the control as invalid.\n */\n errorMessage?: string;\n /**\n * Property for specifying the placeholder of the control.\n */\n placeholder?: string;\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 and highlighting it as an inactive state.\n */\n disabled?: boolean;\n /**\n * Property for displaying a label above the input.\n */\n label?: string;\n /**\n * Property for displaying helper text below the input.\n */\n helperText?: 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 * Function triggered when user clicks on extraClear button.\n */\n onRemove?: () => void;\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 * Test identifier for the component.\n */\n testID?: string;\n}\n\nexport const InputPassword = forwardRef<HTMLInputElement, InputPasswordProps>(\n (\n {\n extraSee = false,\n extraClear = false,\n extraCheckup,\n initialVisible = false,\n value,\n placeholder,\n onChange,\n onChangeText,\n onKeyDown,\n onRemove,\n size = \"md\",\n disabled = false,\n name,\n label,\n helperText,\n errorMessage,\n error,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [isVisible, setIsVisible] = useState(initialVisible);\n const [internalState, setInternalState] = useState<\"default\" | \"focus\">(\n \"default\"\n );\n const [passValue, setPassValue] = useState(value ?? \"\");\n const [isChecked, setIsChecked] = useState(false);\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-password-${safeId}`;\n const labelId = `${inputId}-label`;\n const errorId = `${inputId}-error`;\n const helperId = `${inputId}-helper`;\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\n useEffect(() => {\n if (value !== undefined) {\n setPassValue(value);\n }\n }, [value]);\n\n // Run extraCheckup when passValue changes\n useEffect(() => {\n if (extraCheckup && passValue) {\n setIsChecked(extraCheckup(passValue));\n } else {\n setIsChecked(false);\n }\n }, [passValue, extraCheckup]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const isFocus = internalState === \"focus\";\n\n // Handle checked status (only show if not error and extraCheckup returns true)\n const isCheckedShown = isChecked && !isError;\n // Clear button visibility depends on internal state\n const isExtraClearIconShown = !disabled && extraClear && !!passValue;\n // Eye toggle visibility\n const isExtraSeeShown = extraSee;\n // Error icon visibility\n const isErrorIconShown = isError;\n\n const extrasCount =\n Number(isExtraClearIconShown) +\n Number(isCheckedShown) +\n Number(isExtraSeeShown) +\n Number(isErrorIconShown);\n\n // Resolve Config from Theme\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n const handleFocus = () => {\n if (!isDisable) {\n setInternalState(\"focus\");\n }\n };\n\n const handleBlur = () => {\n if (!isDisable) {\n setInternalState(\"default\");\n }\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(newValue);\n }\n\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 const handleClear = (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n setPassValue(\"\");\n onRemove?.();\n\n if (inputRef.current) {\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 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 const toggleVisibility = () => {\n setIsVisible(!isVisible);\n };\n\n // Resolve background and border colors based on state\n let backgroundColor = 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 const iconColor = isDisable ? inputColors.placeholder : inputColors.text;\n\n // Padding values from Figma design\n const paddingConfig: Record<\n string,\n { vertical: number; horizontal: number }\n > = {\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: Record<string, number> = {\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: Record<string, number> = {\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: Record<\n string,\n { width: number; offset: number }\n > = {\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 flexDirection=\"column\" gap={8} width=\"100%\" testID={testID}>\n {label && (\n <Box as=\"label\" id={labelId} htmlFor={inputId}>\n <Text\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n </Box>\n )}\n <Box\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n borderRadius={borderRadius}\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 ...(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 <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={isVisible ? \"text\" : \"password\"}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n placeholderTextColor={placeholderColor}\n aria-invalid={isError || undefined}\n aria-describedby={\n errorMessage ? errorId : helperText ? helperId : undefined\n }\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n aria-disabled={isDisable || undefined}\n data-testid=\"input-password__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 aria-label=\"Clear input\"\n data-testid=\"input-password__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 role=\"img\"\n aria-label=\"Password meets requirements\"\n data-testid=\"input-password__check-icon\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.success.primary}\n >\n <CheckCr />\n </Icon>\n </Box>\n )}\n {isExtraSeeShown && (\n <Box\n as=\"button\"\n type=\"button\"\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n cursor=\"pointer\"\n onPress={toggleVisibility}\n aria-label={isVisible ? \"Hide password\" : \"Show password\"}\n aria-pressed={isVisible}\n data-testid=\"input-password__visibility-toggle\"\n >\n {isVisible ? (\n <Eye size={iconSize} color={iconColor} />\n ) : (\n <EyeOff size={iconSize} color={iconColor} />\n )}\n </Box>\n )}\n {isErrorIconShown && (\n <Box\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n role=\"img\"\n aria-label=\"Error\"\n data-testid=\"input-password__error-icon\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.alert.primary}\n >\n <ExclamationMarkCr />\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 >\n {errorMessage}\n </Text>\n )}\n\n {helperText && !errorMessage && (\n <Text\n id={helperId}\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n >\n {helperText}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInputPassword.displayName = \"InputPassword\";\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":["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
package/web/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/InputPassword.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 {\n Eye,\n EyeOff,\n Remove,\n CheckCr,\n ExclamationMarkCr,\n} from \"@xsolla/xui-icons-base\";\n\nexport interface InputPasswordProps extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"onChange\"\n> {\n /**\n * Add eye in input with see password function.\n */\n extraSee?: boolean;\n /**\n * Add function clear for input.\n */\n extraClear?: boolean;\n /**\n * Property for specifying the name of the control.\n */\n name?: string;\n /**\n * Property for displaying an error and highlighting the control as invalid.\n */\n error?: boolean;\n /**\n * Visible password in the field.\n */\n initialVisible?: boolean;\n /**\n * Add checkup function for input. Can use after change input value.\n */\n extraCheckup?: (pass: string) => boolean;\n /**\n * Property for specifying the value of the control.\n */\n value?: string;\n /**\n * Property for displaying an error message and highlighting the control as invalid.\n */\n errorMessage?: string;\n /**\n * Property for specifying the placeholder of the control.\n */\n placeholder?: string;\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 and highlighting it as an inactive state.\n */\n disabled?: boolean;\n /**\n * Property for displaying a label above the input.\n */\n label?: string;\n /**\n * Property for displaying helper text below the input.\n */\n helperText?: 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 * Function triggered when user clicks on extraClear button.\n */\n onRemove?: () => void;\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 * Test identifier for the component.\n */\n testID?: string;\n}\n\nexport const InputPassword = forwardRef<HTMLInputElement, InputPasswordProps>(\n (\n {\n extraSee = false,\n extraClear = false,\n extraCheckup,\n initialVisible = false,\n value,\n placeholder,\n onChange,\n onChangeText,\n onKeyDown,\n onRemove,\n size = \"md\",\n disabled = false,\n name,\n label,\n helperText,\n errorMessage,\n error,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [isVisible, setIsVisible] = useState(initialVisible);\n const [internalState, setInternalState] = useState<\"default\" | \"focus\">(\n \"default\"\n );\n const [passValue, setPassValue] = useState(value ?? \"\");\n const [isChecked, setIsChecked] = useState(false);\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-password-${safeId}`;\n const labelId = `${inputId}-label`;\n const errorId = `${inputId}-error`;\n const helperId = `${inputId}-helper`;\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\n useEffect(() => {\n if (value !== undefined) {\n setPassValue(value);\n }\n }, [value]);\n\n // Run extraCheckup when passValue changes\n useEffect(() => {\n if (extraCheckup && passValue) {\n setIsChecked(extraCheckup(passValue));\n } else {\n setIsChecked(false);\n }\n }, [passValue, extraCheckup]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const isFocus = internalState === \"focus\";\n\n // Handle checked status (only show if not error and extraCheckup returns true)\n const isCheckedShown = isChecked && !isError;\n // Clear button visibility depends on internal state\n const isExtraClearIconShown = !disabled && extraClear && !!passValue;\n // Eye toggle visibility\n const isExtraSeeShown = extraSee;\n // Error icon visibility\n const isErrorIconShown = isError;\n\n const extrasCount =\n Number(isExtraClearIconShown) +\n Number(isCheckedShown) +\n Number(isExtraSeeShown) +\n Number(isErrorIconShown);\n\n // Resolve Config from Theme\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n const handleFocus = () => {\n if (!isDisable) {\n setInternalState(\"focus\");\n }\n };\n\n const handleBlur = () => {\n if (!isDisable) {\n setInternalState(\"default\");\n }\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(newValue);\n }\n\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 const handleClear = (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n setPassValue(\"\");\n onRemove?.();\n\n if (inputRef.current) {\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 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 const toggleVisibility = () => {\n setIsVisible(!isVisible);\n };\n\n // Resolve background and border colors based on state\n let backgroundColor = 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 const iconColor = isDisable ? inputColors.placeholder : inputColors.text;\n\n // Padding values from Figma design\n const paddingConfig: Record<\n string,\n { vertical: number; horizontal: number }\n > = {\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: Record<string, number> = {\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: Record<string, number> = {\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: Record<\n string,\n { width: number; offset: number }\n > = {\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 flexDirection=\"column\" gap={8} width=\"100%\" testID={testID}>\n {label && (\n <Box as=\"label\" id={labelId} htmlFor={inputId}>\n <Text\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n </Box>\n )}\n <Box\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n borderRadius={borderRadius}\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 ...(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 <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={isVisible ? \"text\" : \"password\"}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n placeholderTextColor={placeholderColor}\n aria-invalid={isError || undefined}\n aria-describedby={\n errorMessage ? errorId : helperText ? helperId : undefined\n }\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n aria-disabled={isDisable || undefined}\n data-testid=\"input-password__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 aria-label=\"Clear input\"\n data-testid=\"input-password__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 role=\"img\"\n aria-label=\"Password meets requirements\"\n data-testid=\"input-password__check-icon\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.success.primary}\n >\n <CheckCr />\n </Icon>\n </Box>\n )}\n {isExtraSeeShown && (\n <Box\n as=\"button\"\n type=\"button\"\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n cursor=\"pointer\"\n onPress={toggleVisibility}\n aria-label={isVisible ? \"Hide password\" : \"Show password\"}\n aria-pressed={isVisible}\n data-testid=\"input-password__visibility-toggle\"\n >\n {isVisible ? (\n <Eye size={iconSize} color={iconColor} />\n ) : (\n <EyeOff size={iconSize} color={iconColor} />\n )}\n </Box>\n )}\n {isErrorIconShown && (\n <Box\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n role=\"img\"\n aria-label=\"Error\"\n data-testid=\"input-password__error-icon\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.alert.primary}\n >\n <ExclamationMarkCr />\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 >\n {errorMessage}\n </Text>\n )}\n\n {helperText && !errorMessage && (\n <Text\n id={helperId}\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n >\n {helperText}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInputPassword.displayName = \"InputPassword\";\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/InputPassword.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 {\n Eye,\n EyeOff,\n Remove,\n CheckCr,\n ExclamationMarkCr,\n} from \"@xsolla/xui-icons-base\";\n\nexport interface InputPasswordProps extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"onChange\"\n> {\n /**\n * Add eye in input with see password function.\n */\n extraSee?: boolean;\n /**\n * Add function clear for input.\n */\n extraClear?: boolean;\n /**\n * Property for specifying the name of the control.\n */\n name?: string;\n /**\n * Property for displaying an error and highlighting the control as invalid.\n */\n error?: boolean;\n /**\n * Visible password in the field.\n */\n initialVisible?: boolean;\n /**\n * Add checkup function for input. Can use after change input value.\n */\n extraCheckup?: (pass: string) => boolean;\n /**\n * Property for specifying the value of the control.\n */\n value?: string;\n /**\n * Property for displaying an error message and highlighting the control as invalid.\n */\n errorMessage?: string;\n /**\n * Property for specifying the placeholder of the control.\n */\n placeholder?: string;\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 and highlighting it as an inactive state.\n */\n disabled?: boolean;\n /**\n * Property for displaying a label above the input.\n */\n label?: string;\n /**\n * Property for displaying helper text below the input.\n */\n helperText?: 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 * Function triggered when user clicks on extraClear button.\n */\n onRemove?: () => void;\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 * Test identifier for the component.\n */\n testID?: string;\n}\n\nexport const InputPassword = forwardRef<HTMLInputElement, InputPasswordProps>(\n (\n {\n extraSee = false,\n extraClear = false,\n extraCheckup,\n initialVisible = false,\n value,\n placeholder,\n onChange,\n onChangeText,\n onKeyDown,\n onRemove,\n size = \"md\",\n disabled = false,\n name,\n label,\n helperText,\n errorMessage,\n error,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [isVisible, setIsVisible] = useState(initialVisible);\n const [internalState, setInternalState] = useState<\"default\" | \"focus\">(\n \"default\"\n );\n const [passValue, setPassValue] = useState(value ?? \"\");\n const [isChecked, setIsChecked] = useState(false);\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-password-${safeId}`;\n const labelId = `${inputId}-label`;\n const errorId = `${inputId}-error`;\n const helperId = `${inputId}-helper`;\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\n useEffect(() => {\n if (value !== undefined) {\n setPassValue(value);\n }\n }, [value]);\n\n // Run extraCheckup when passValue changes\n useEffect(() => {\n if (extraCheckup && passValue) {\n setIsChecked(extraCheckup(passValue));\n } else {\n setIsChecked(false);\n }\n }, [passValue, extraCheckup]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const isFocus = internalState === \"focus\";\n\n // Handle checked status (only show if not error and extraCheckup returns true)\n const isCheckedShown = isChecked && !isError;\n // Clear button visibility depends on internal state\n const isExtraClearIconShown = !disabled && extraClear && !!passValue;\n // Eye toggle visibility\n const isExtraSeeShown = extraSee;\n // Error icon visibility\n const isErrorIconShown = isError;\n\n const extrasCount =\n Number(isExtraClearIconShown) +\n Number(isCheckedShown) +\n Number(isExtraSeeShown) +\n Number(isErrorIconShown);\n\n // Resolve Config from Theme\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n const handleFocus = () => {\n if (!isDisable) {\n setInternalState(\"focus\");\n }\n };\n\n const handleBlur = () => {\n if (!isDisable) {\n setInternalState(\"default\");\n }\n };\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(newValue);\n }\n\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 const handleClear = (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n setPassValue(\"\");\n onRemove?.();\n\n if (inputRef.current) {\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 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 const toggleVisibility = () => {\n setIsVisible(!isVisible);\n };\n\n // Resolve background and border colors based on state\n let backgroundColor = 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 const iconColor = isDisable ? inputColors.placeholder : inputColors.text;\n\n // Padding values from Figma design\n const paddingConfig: Record<\n string,\n { vertical: number; horizontal: number }\n > = {\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: Record<string, number> = {\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: Record<string, number> = {\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: Record<\n string,\n { width: number; offset: number }\n > = {\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 flexDirection=\"column\" gap={8} width=\"100%\" testID={testID}>\n {label && (\n <Box as=\"label\" id={labelId} htmlFor={inputId}>\n <Text\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n </Box>\n )}\n <Box\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n borderRadius={borderRadius}\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 ...(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 <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={isVisible ? \"text\" : \"password\"}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n placeholderTextColor={placeholderColor}\n aria-invalid={isError || undefined}\n aria-describedby={\n errorMessage ? errorId : helperText ? helperId : undefined\n }\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n aria-disabled={isDisable || undefined}\n data-testid=\"input-password__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 aria-label=\"Clear input\"\n data-testid=\"input-password__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 role=\"img\"\n aria-label=\"Password meets requirements\"\n data-testid=\"input-password__check-icon\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.success.primary}\n >\n <CheckCr />\n </Icon>\n </Box>\n )}\n {isExtraSeeShown && (\n <Box\n as=\"button\"\n type=\"button\"\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n cursor=\"pointer\"\n onPress={toggleVisibility}\n aria-label={isVisible ? \"Hide password\" : \"Show password\"}\n aria-pressed={isVisible}\n data-testid=\"input-password__visibility-toggle\"\n >\n {isVisible ? (\n <Eye size={iconSize} color={iconColor} />\n ) : (\n <EyeOff size={iconSize} color={iconColor} />\n )}\n </Box>\n )}\n {isErrorIconShown && (\n <Box\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n role=\"img\"\n aria-label=\"Error\"\n data-testid=\"input-password__error-icon\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.alert.primary}\n >\n <ExclamationMarkCr />\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 >\n {errorMessage}\n </Text>\n )}\n\n {helperText && !errorMessage && (\n <Text\n id={helperId}\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n >\n {helperText}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInputPassword.displayName = \"InputPassword\";\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"]}
|