@xsolla/xui-input 0.89.0 → 0.91.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/web/index.mjs CHANGED
@@ -1,7 +1,7 @@
1
1
  // src/Input.tsx
2
2
  import React3, {
3
3
  useState,
4
- forwardRef as forwardRef3,
4
+ forwardRef as forwardRef2,
5
5
  useRef,
6
6
  useEffect
7
7
  } from "react";
@@ -207,54 +207,10 @@ var Text = ({
207
207
  );
208
208
  };
209
209
 
210
- // ../primitives-web/src/Spinner.tsx
211
- import styled3, { keyframes } from "styled-components";
212
- import { jsx as jsx3 } from "react/jsx-runtime";
213
- var rotate = keyframes`
214
- from {
215
- transform: rotate(0deg);
216
- }
217
- to {
218
- transform: rotate(360deg);
219
- }
220
- `;
221
- var StyledSpinner = styled3.div`
222
- width: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
223
- height: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
224
- border: ${(props) => props.strokeWidth || 2}px solid
225
- ${(props) => props.color || "currentColor"};
226
- border-bottom-color: transparent;
227
- border-radius: 50%;
228
- display: inline-block;
229
- box-sizing: border-box;
230
- animation: ${rotate} 1s linear infinite;
231
- `;
232
- var Spinner = ({
233
- role = "status",
234
- "aria-label": ariaLabel,
235
- "aria-live": ariaLive = "polite",
236
- "aria-describedby": ariaDescribedBy,
237
- testID,
238
- ...props
239
- }) => {
240
- return /* @__PURE__ */ jsx3(
241
- StyledSpinner,
242
- {
243
- role,
244
- "aria-label": ariaLabel,
245
- "aria-live": ariaLive,
246
- "aria-describedby": ariaDescribedBy,
247
- "data-testid": testID,
248
- ...props
249
- }
250
- );
251
- };
252
- Spinner.displayName = "Spinner";
253
-
254
210
  // ../primitives-web/src/Icon.tsx
255
- import styled4 from "styled-components";
256
- import { jsx as jsx4 } from "react/jsx-runtime";
257
- var StyledIcon = styled4.div`
211
+ import styled3 from "styled-components";
212
+ import { jsx as jsx3 } from "react/jsx-runtime";
213
+ var StyledIcon = styled3.div`
258
214
  display: flex;
259
215
  align-items: center;
260
216
  justify-content: center;
@@ -270,36 +226,14 @@ var StyledIcon = styled4.div`
270
226
  }
271
227
  `;
272
228
  var Icon = ({ children, ...props }) => {
273
- return /* @__PURE__ */ jsx4(StyledIcon, { ...props, children });
229
+ return /* @__PURE__ */ jsx3(StyledIcon, { ...props, children });
274
230
  };
275
231
 
276
- // ../primitives-web/src/Divider.tsx
277
- import styled5 from "styled-components";
278
- import { jsx as jsx5 } from "react/jsx-runtime";
279
- var StyledDivider = styled5.div`
280
- background-color: ${(props) => props.dashStroke ? "transparent" : props.color || "rgba(255, 255, 255, 0.15)"};
281
- width: ${(props) => props.vertical ? typeof props.width === "number" ? `${props.width}px` : props.width || "1px" : "100%"};
282
- height: ${(props) => props.vertical ? "100%" : typeof props.height === "number" ? `${props.height}px` : props.height || "1px"};
283
-
284
- ${(props) => props.dashStroke && `
285
- border-style: dashed;
286
- border-color: ${props.color || "rgba(255, 255, 255, 0.15)"};
287
- border-width: 0;
288
- ${props.vertical ? `
289
- border-left-width: ${typeof props.width === "number" ? `${props.width}px` : props.width || "1px"};
290
- height: 100%;
291
- ` : `
292
- border-top-width: ${typeof props.height === "number" ? `${props.height}px` : props.height || "1px"};
293
- width: 100%;
294
- `}
295
- `}
296
- `;
297
-
298
232
  // ../primitives-web/src/Input.tsx
299
233
  import { forwardRef } from "react";
300
- import styled6 from "styled-components";
301
- import { jsx as jsx6 } from "react/jsx-runtime";
302
- var StyledInput = styled6.input`
234
+ import styled4 from "styled-components";
235
+ import { jsx as jsx4 } from "react/jsx-runtime";
236
+ var StyledInput = styled4.input`
303
237
  background: transparent;
304
238
  border: none;
305
239
  outline: none;
@@ -358,7 +292,7 @@ var InputPrimitive = forwardRef(
358
292
  }
359
293
  };
360
294
  const inputValue = value !== void 0 ? value : "";
361
- return /* @__PURE__ */ jsx6(
295
+ return /* @__PURE__ */ jsx4(
362
296
  StyledInput,
363
297
  {
364
298
  ref,
@@ -392,76 +326,11 @@ var InputPrimitive = forwardRef(
392
326
  );
393
327
  InputPrimitive.displayName = "InputPrimitive";
394
328
 
395
- // ../primitives-web/src/TextArea.tsx
396
- import { forwardRef as forwardRef2 } from "react";
397
- import styled7 from "styled-components";
398
- import { jsx as jsx7 } from "react/jsx-runtime";
399
- var StyledTextArea = styled7.textarea`
400
- background: transparent;
401
- border: none;
402
- outline: none;
403
- width: 100%;
404
- height: 100%;
405
- padding: 0;
406
- margin: 0;
407
- color: ${(props) => props.color || "inherit"};
408
- font-size: ${(props) => typeof props.fontSize === "number" ? `${props.fontSize}px` : props.fontSize || "inherit"};
409
- font-family: inherit;
410
- text-align: inherit;
411
- resize: none;
412
-
413
- &::placeholder {
414
- color: ${(props) => props.placeholderTextColor || "rgba(255, 255, 255, 0.5)"};
415
- }
416
-
417
- &:disabled {
418
- cursor: not-allowed;
419
- }
420
- `;
421
- var TextAreaPrimitive = forwardRef2(
422
- ({
423
- value,
424
- placeholder,
425
- onChangeText,
426
- onFocus,
427
- onBlur,
428
- onKeyDown,
429
- disabled,
430
- style,
431
- color,
432
- fontSize,
433
- placeholderTextColor,
434
- maxLength,
435
- rows
436
- }, ref) => {
437
- return /* @__PURE__ */ jsx7(
438
- StyledTextArea,
439
- {
440
- ref,
441
- value,
442
- placeholder,
443
- onChange: (e) => onChangeText?.(e.target.value),
444
- onFocus,
445
- onBlur,
446
- onKeyDown,
447
- disabled,
448
- style,
449
- color,
450
- fontSize,
451
- placeholderTextColor,
452
- maxLength,
453
- rows
454
- }
455
- );
456
- }
457
- );
458
- TextAreaPrimitive.displayName = "TextAreaPrimitive";
459
-
460
329
  // src/Input.tsx
461
330
  import { useDesignSystem, useId } from "@xsolla/xui-core";
462
331
  import { Check, X } from "@xsolla/xui-icons";
463
- import { jsx as jsx8, jsxs } from "react/jsx-runtime";
464
- var Input = forwardRef3(
332
+ import { jsx as jsx5, jsxs } from "react/jsx-runtime";
333
+ var Input = forwardRef2(
465
334
  ({
466
335
  value,
467
336
  placeholder,
@@ -480,7 +349,7 @@ var Input = forwardRef3(
480
349
  extraClear = false,
481
350
  onRemove,
482
351
  checked = false,
483
- checkedIcon = /* @__PURE__ */ jsx8(Check, {}),
352
+ checkedIcon = /* @__PURE__ */ jsx5(Check, {}),
484
353
  type,
485
354
  id: providedId,
486
355
  "aria-label": ariaLabel,
@@ -635,7 +504,7 @@ var Input = forwardRef3(
635
504
  width: "100%",
636
505
  testID,
637
506
  children: [
638
- label && /* @__PURE__ */ jsx8(Box, { as: "label", id: labelId, children: /* @__PURE__ */ jsx8(
507
+ label && /* @__PURE__ */ jsx5(Box, { as: "label", id: labelId, children: /* @__PURE__ */ jsx5(
639
508
  Text,
640
509
  {
641
510
  color: theme.colors.content.secondary,
@@ -672,8 +541,8 @@ var Input = forwardRef3(
672
541
  borderColor: inputColors.borderHover
673
542
  } : void 0,
674
543
  children: [
675
- isLeftInputIconShown && /* @__PURE__ */ jsx8(Box, { alignItems: "center", justifyContent: "center", children: /* @__PURE__ */ jsx8(Icon, { size: iconSize, color: textColor, children: iconLeft }) }),
676
- /* @__PURE__ */ jsx8(Box, { flex: 1, height: "100%", justifyContent: "center", children: /* @__PURE__ */ jsx8(
544
+ isLeftInputIconShown && /* @__PURE__ */ jsx5(Box, { alignItems: "center", justifyContent: "center", children: /* @__PURE__ */ jsx5(Icon, { size: iconSize, color: textColor, children: iconLeft }) }),
545
+ /* @__PURE__ */ jsx5(Box, { flex: 1, height: "100%", justifyContent: "center", children: /* @__PURE__ */ jsx5(
677
546
  InputPrimitive,
678
547
  {
679
548
  ref: inputRef,
@@ -700,7 +569,7 @@ var Input = forwardRef3(
700
569
  }
701
570
  ) }),
702
571
  extrasCount > 0 && /* @__PURE__ */ jsxs(Box, { flexDirection: "row", alignItems: "center", gap: 4, children: [
703
- isExtraClearIconShown && /* @__PURE__ */ jsx8(
572
+ isExtraClearIconShown && /* @__PURE__ */ jsx5(
704
573
  Box,
705
574
  {
706
575
  as: "button",
@@ -715,17 +584,17 @@ var Input = forwardRef3(
715
584
  onPress: !disabled ? handleClear : void 0,
716
585
  disabled,
717
586
  "data-testid": "input__extra-clear-button",
718
- children: /* @__PURE__ */ jsx8(Icon, { size: iconSize, color: textColor, children: /* @__PURE__ */ jsx8(X, {}) })
587
+ children: /* @__PURE__ */ jsx5(Icon, { size: iconSize, color: textColor, children: /* @__PURE__ */ jsx5(X, {}) })
719
588
  }
720
589
  ),
721
- isCheckedShown && /* @__PURE__ */ jsx8(
590
+ isCheckedShown && /* @__PURE__ */ jsx5(
722
591
  Box,
723
592
  {
724
593
  alignItems: "center",
725
594
  justifyContent: "center",
726
595
  width: iconSize,
727
596
  height: "100%",
728
- children: /* @__PURE__ */ jsx8(
597
+ children: /* @__PURE__ */ jsx5(
729
598
  Icon,
730
599
  {
731
600
  size: iconSize,
@@ -735,12 +604,12 @@ var Input = forwardRef3(
735
604
  )
736
605
  }
737
606
  ),
738
- isRightInputIconShown && /* @__PURE__ */ jsx8(Box, { alignItems: "center", justifyContent: "center", children: /* @__PURE__ */ jsx8(Icon, { size: iconRightSize || iconSize, color: textColor, children: iconRight }) })
607
+ isRightInputIconShown && /* @__PURE__ */ jsx5(Box, { alignItems: "center", justifyContent: "center", children: /* @__PURE__ */ jsx5(Icon, { size: iconRightSize || iconSize, color: textColor, children: iconRight }) })
739
608
  ] })
740
609
  ]
741
610
  }
742
611
  ),
743
- errorMessage && /* @__PURE__ */ jsx8(
612
+ errorMessage && /* @__PURE__ */ jsx5(
744
613
  Text,
745
614
  {
746
615
  id: errorId,
package/web/index.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Input.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx","../../../primitives-web/src/Spinner.tsx","../../../primitives-web/src/Icon.tsx","../../../primitives-web/src/Divider.tsx","../../../primitives-web/src/Input.tsx","../../../primitives-web/src/TextArea.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 { Check, X } from \"@xsolla/xui-icons\";\n\nexport interface InputProps extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"onChange\"\n> {\n /**\n * Property for specifying the value of the control.\n */\n value?: string;\n /**\n * Property for specifying the placeholder of the control.\n */\n placeholder?: string;\n /**\n * Event handler when the value changes (for controlled mode).\n */\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /**\n * Event handler when the text changes (alternative to onChange).\n */\n onChangeText?: (text: string) => void;\n /**\n * Property for changing the size of the input.\n */\n size?: \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n /**\n * Property for disabling the control.\n */\n disabled?: boolean;\n /**\n * Property for displaying a label above the input.\n */\n label?: string;\n /**\n * Property for displaying an error message and highlighting the control as invalid.\n */\n errorMessage?: string;\n /**\n * Property for displaying an error and highlighting the control as invalid.\n */\n error?: boolean;\n /**\n * Property to display an icon on the left side.\n */\n iconLeft?: React.ReactNode;\n /**\n * Property to display an icon on the right side.\n */\n iconRight?: React.ReactNode;\n /**\n * Add function clear for input.\n */\n extraClear?: boolean;\n /**\n * Function triggered when user clicks on extraClear button.\n */\n onRemove?: () => void;\n /**\n * Property for show checked status in input. Show only if not errorMessage.\n */\n checked?: boolean;\n /**\n * Property for passing a new icon to replace the default checked icon.\n */\n checkedIcon?: React.ReactNode;\n /**\n * Property to specify the size of the right icon.\n */\n iconRightSize?: number | string;\n /**\n * Unique identifier for the input element. Used for accessibility linking.\n */\n id?: string;\n /**\n * Accessible label for screen readers when no visible label is present.\n */\n \"aria-label\"?: string;\n /**\n * Override border radius for top-left corner.\n */\n borderTopLeftRadius?: number;\n /**\n * Override border radius for top-right corner.\n */\n borderTopRightRadius?: number;\n /**\n * Override border radius for bottom-left corner.\n */\n borderBottomLeftRadius?: number;\n /**\n * Override border radius for bottom-right corner.\n */\n borderBottomRightRadius?: number;\n /**\n * Custom background color for the input.\n */\n backgroundColor?: string;\n /**\n * Test identifier for the input.\n */\n testID?: string;\n}\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onKeyDown,\n size = \"md\",\n disabled = false,\n name,\n label,\n errorMessage,\n error,\n iconLeft,\n iconRight,\n iconRightSize,\n extraClear = false,\n onRemove,\n checked = false,\n checkedIcon = <Check />,\n type,\n id: providedId,\n \"aria-label\": ariaLabel,\n borderTopLeftRadius: borderTopLeftRadiusOverride,\n borderTopRightRadius: borderTopRightRadiusOverride,\n borderBottomLeftRadius: borderBottomLeftRadiusOverride,\n borderBottomRightRadius: borderBottomRightRadiusOverride,\n backgroundColor: backgroundColorProp,\n testID,\n onBlur: externalOnBlur,\n onFocus: externalOnFocus,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [internalState, setInternalState] = useState<\"default\" | \"focus\">(\n \"default\"\n );\n // Internal value state - mimics useUpdatableState from switch-repo\n const [passValue, setPassValue] = useState(value ?? \"\");\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n // Sanitize useId() output to remove colons (e.g., :r0: -> r0)\n // This ensures valid HTML id attributes and ARIA references\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-${safeId}`;\n const labelId = `${inputId}-label`;\n const errorId = `${inputId}-error`;\n\n // Forward ref to input element\n React.useImperativeHandle(\n ref,\n () => inputRef.current as HTMLInputElement,\n []\n );\n\n // Sync passValue with value prop when it changes (like useUpdatableState)\n useEffect(() => {\n if (value !== undefined) {\n setPassValue(value);\n }\n }, [value]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const isFocus = internalState === \"focus\";\n\n const isLeftInputIconShown = !!iconLeft;\n const isRightInputIconShown = !!iconRight;\n\n // Handle checked status (only show if not error)\n const isCheckedShown = checked && !errorMessage;\n // Clear button visibility depends on internal state\n const isExtraClearIconShown = !disabled && extraClear && !!passValue;\n const extrasCount =\n Number(isExtraClearIconShown) +\n Number(isCheckedShown) +\n Number(isRightInputIconShown);\n\n // Resolve Config from Theme\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"focus\");\n }\n externalOnFocus?.(e);\n };\n\n const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"default\");\n }\n externalOnBlur?.(e);\n };\n\n // Match switch-repo handleChange pattern exactly\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n\n // If onChange is provided (controlled mode), call it\n // But ALWAYS update internal state for clear button visibility\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(newValue);\n }\n\n // Always update internal state (this is key for uncontrolled mode in Storybook)\n setPassValue(newValue);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"Escape\") {\n e.currentTarget.blur();\n }\n if (onKeyDown) {\n onKeyDown(e);\n }\n };\n\n // Match switch-repo onClear pattern - NO direct DOM manipulation\n const handleClear = (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n\n // Update internal state first (this makes the input show empty)\n setPassValue(\"\");\n\n // Call onRemove callback\n onRemove?.();\n\n // Create synthetic change event and call onChange if provided\n if (inputRef.current) {\n // Web-specific: Use the native setter to properly set the value\n // without shadowing the property (only on web platform)\n if (typeof window !== \"undefined\" && window.HTMLInputElement) {\n const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n window.HTMLInputElement.prototype,\n \"value\"\n )?.set;\n\n if (nativeInputValueSetter) {\n nativeInputValueSetter.call(inputRef.current, \"\");\n }\n }\n\n // Create a proper synthetic event\n const syntheticEvent = {\n target: inputRef.current,\n currentTarget: inputRef.current,\n type: \"change\",\n } as React.ChangeEvent<HTMLInputElement>;\n\n onChange?.(syntheticEvent);\n inputRef.current.focus();\n }\n };\n\n // Resolve background and border colors based on state\n let backgroundColor = backgroundColorProp || inputColors.bg;\n let borderColor = inputColors.border;\n let outlineColor: string | undefined;\n\n if (isDisable) {\n backgroundColor = inputColors.bgDisable;\n borderColor = inputColors.borderDisable;\n } else if (isError) {\n outlineColor = theme.colors.border.alert;\n if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n }\n } else if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n outlineColor = theme.colors.border.brand;\n }\n\n const textColor = isDisable ? inputColors.textDisable : inputColors.text;\n const placeholderColor = inputColors.placeholder;\n\n // Padding values from Figma design\n const paddingConfig = {\n xl: { vertical: 12, horizontal: 12 },\n lg: { vertical: 14, horizontal: 12 },\n md: { vertical: 11, horizontal: 12 },\n sm: { vertical: 7, horizontal: 10 },\n xs: { vertical: 7, horizontal: 10 },\n };\n\n // Border radius from Figma design\n const borderRadiusConfig = {\n xl: 4,\n lg: 4,\n md: 2,\n sm: 2,\n xs: 2,\n };\n\n // Icon sizes from Figma design\n const iconSizeConfig = {\n xl: 18,\n lg: 18,\n md: 18,\n sm: 16,\n xs: 16,\n };\n\n // Focus outline config from Figma design\n const focusOutlineConfig = {\n xl: { width: 2, offset: -2 },\n lg: { width: 2, offset: -2 },\n md: { width: 1, offset: -1 },\n sm: { width: 1, offset: -1 },\n xs: { width: 1, offset: -1 },\n };\n\n const padding = paddingConfig[size];\n const borderRadius = borderRadiusConfig[size];\n const iconSize = iconSizeConfig[size];\n const focusOutline = focusOutlineConfig[size];\n\n return (\n <Box\n flexDirection=\"column\"\n gap={sizeStyles.fieldGap}\n width=\"100%\"\n testID={testID}\n >\n {label && (\n <Box as=\"label\" id={labelId}>\n <Text\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n </Box>\n )}\n <Box\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n height={sizeStyles.height}\n paddingVertical={padding.vertical}\n paddingHorizontal={padding.horizontal}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={10}\n position=\"relative\"\n style={{\n borderTopLeftRadius: borderTopLeftRadiusOverride ?? borderRadius,\n borderTopRightRadius: borderTopRightRadiusOverride ?? borderRadius,\n borderBottomLeftRadius:\n borderBottomLeftRadiusOverride ?? borderRadius,\n borderBottomRightRadius:\n borderBottomRightRadiusOverride ?? borderRadius,\n ...(outlineColor\n ? {\n outline: `${focusOutline.width}px solid ${outlineColor}`,\n outlineOffset: `${focusOutline.offset}px`,\n }\n : {}),\n }}\n hoverStyle={\n !isDisable && !isFocus && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n {isLeftInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconSize} color={textColor}>\n {iconLeft}\n </Icon>\n </Box>\n )}\n\n <Box flex={1} height=\"100%\" justifyContent=\"center\">\n <InputPrimitive\n ref={inputRef}\n id={inputId}\n value={passValue}\n name={name}\n placeholder={placeholder}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n disabled={isDisable}\n type={type || \"text\"}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n placeholderTextColor={placeholderColor}\n aria-invalid={isError || undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n aria-disabled={isDisable || undefined}\n data-testid=\"input__field\"\n {...rest}\n />\n </Box>\n\n {/* Right-side Extras Wrapper */}\n {extrasCount > 0 && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={4}>\n {isExtraClearIconShown && (\n <Box\n as=\"button\"\n type=\"button\"\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n cursor={disabled ? \"not-allowed\" : \"pointer\"}\n onPress={!disabled ? handleClear : undefined}\n disabled={disabled}\n data-testid=\"input__extra-clear-button\"\n >\n <Icon size={iconSize} color={textColor}>\n <X />\n </Icon>\n </Box>\n )}\n {isCheckedShown && (\n <Box\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.success.primary}\n >\n {checkedIcon}\n </Icon>\n </Box>\n )}\n {isRightInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconRightSize || iconSize} color={textColor}>\n {iconRight}\n </Icon>\n </Box>\n )}\n </Box>\n )}\n </Box>\n\n {errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInput.displayName = \"Input\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledBox = styled.div<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (props.disabled ? 0.5 : 1)};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n type,\n disabled,\n id,\n ...props\n },\n ref\n ) => {\n // Handle as=\"img\" for rendering images with proper border-radius\n if (as === \"img\" && src) {\n return (\n <img\n src={src}\n alt={alt || \"\"}\n style={{\n display: \"block\",\n objectFit: \"cover\",\n width:\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width,\n height:\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height,\n borderRadius:\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius,\n position: props.position,\n top: typeof props.top === \"number\" ? `${props.top}px` : props.top,\n left:\n typeof props.left === \"number\" ? `${props.left}px` : props.left,\n right:\n typeof props.right === \"number\"\n ? `${props.right}px`\n : props.right,\n bottom:\n typeof props.bottom === \"number\"\n ? `${props.bottom}px`\n : props.bottom,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n as={as}\n id={id}\n type={as === \"button\" ? type || \"button\" : undefined}\n disabled={as === \"button\" ? disabled : undefined}\n onClick={onPress}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n role={role}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-current={ariaCurrent}\n aria-disabled={ariaDisabled}\n aria-busy={ariaBusy}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n aria-live={ariaLive}\n tabIndex={tabIndex !== undefined ? tabIndex : undefined}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledText = styled.span<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Pilat Wide Bold\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif !important'};\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, { keyframes } from \"styled-components\";\nimport type { SpinnerProps } from \"@xsolla/xui-primitives-core\";\n\nconst rotate = keyframes`\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n`;\n\nconst StyledSpinner = styled.div<SpinnerProps>`\n width: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n height: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n border: ${(props) => props.strokeWidth || 2}px solid\n ${(props) => props.color || \"currentColor\"};\n border-bottom-color: transparent;\n border-radius: 50%;\n display: inline-block;\n box-sizing: border-box;\n animation: ${rotate} 1s linear infinite;\n`;\n\nexport const Spinner: React.FC<SpinnerProps> = ({\n role = \"status\",\n \"aria-label\": ariaLabel,\n \"aria-live\": ariaLive = \"polite\",\n \"aria-describedby\": ariaDescribedBy,\n testID,\n ...props\n}) => {\n return (\n <StyledSpinner\n role={role}\n aria-label={ariaLabel}\n aria-live={ariaLive}\n aria-describedby={ariaDescribedBy}\n data-testid={testID}\n {...props}\n />\n );\n};\n\nSpinner.displayName = \"Spinner\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\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 from \"react\";\nimport styled from \"styled-components\";\nimport { DividerProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledDivider = styled.div<DividerProps>`\n background-color: ${(props) =>\n props.dashStroke\n ? \"transparent\"\n : props.color || \"rgba(255, 255, 255, 0.15)\"};\n width: ${(props) =>\n props.vertical\n ? typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"1px\"\n : \"100%\"};\n height: ${(props) =>\n props.vertical\n ? \"100%\"\n : typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"1px\"};\n\n ${(props) =>\n props.dashStroke &&\n `\n border-style: dashed;\n border-color: ${props.color || \"rgba(255, 255, 255, 0.15)\"};\n border-width: 0;\n ${\n props.vertical\n ? `\n border-left-width: ${typeof props.width === \"number\" ? `${props.width}px` : props.width || \"1px\"};\n height: 100%;\n `\n : `\n border-top-width: ${typeof props.height === \"number\" ? `${props.height}px` : props.height || \"1px\"};\n width: 100%;\n `\n }\n `}\n`;\n\nexport const Divider: React.FC<DividerProps> = (props) => {\n return <StyledDivider {...props} />;\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","import { forwardRef } from \"react\";\nimport styled from \"styled-components\";\nimport { TextAreaPrimitiveProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledTextArea = styled.textarea<TextAreaPrimitiveProps>`\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 resize: none;\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 TextAreaPrimitive = forwardRef<\n HTMLTextAreaElement,\n TextAreaPrimitiveProps\n>(\n (\n {\n value,\n placeholder,\n onChangeText,\n onFocus,\n onBlur,\n onKeyDown,\n disabled,\n style,\n color,\n fontSize,\n placeholderTextColor,\n maxLength,\n rows,\n },\n ref\n ) => {\n return (\n <StyledTextArea\n ref={ref}\n value={value}\n placeholder={placeholder}\n onChange={(e) => onChangeText?.(e.target.value)}\n onFocus={onFocus}\n onBlur={onBlur}\n onKeyDown={onKeyDown}\n disabled={disabled}\n style={style}\n color={color}\n fontSize={fontSize}\n placeholderTextColor={placeholderTextColor}\n maxLength={maxLength}\n rows={rows}\n />\n );\n }\n);\n\nTextAreaPrimitive.displayName = \"TextAreaPrimitive\";\n"],"mappings":"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","names":["React","forwardRef","styled","jsx","styled","jsx","styled","jsx","styled","jsx","styled","jsx","forwardRef","styled","jsx","jsx","forwardRef","React"]}
1
+ {"version":3,"sources":["../../src/Input.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx","../../../primitives-web/src/Icon.tsx","../../../primitives-web/src/Input.tsx"],"sourcesContent":["import React, {\n useState,\n forwardRef,\n useRef,\n useEffect,\n type InputHTMLAttributes,\n} from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon, InputPrimitive } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem, useId } from \"@xsolla/xui-core\";\nimport { Check, X } from \"@xsolla/xui-icons\";\n\nexport interface InputProps extends Omit<\n InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"onChange\"\n> {\n /**\n * Property for specifying the value of the control.\n */\n value?: string;\n /**\n * Property for specifying the placeholder of the control.\n */\n placeholder?: string;\n /**\n * Event handler when the value changes (for controlled mode).\n */\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /**\n * Event handler when the text changes (alternative to onChange).\n */\n onChangeText?: (text: string) => void;\n /**\n * Property for changing the size of the input.\n */\n size?: \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n /**\n * Property for disabling the control.\n */\n disabled?: boolean;\n /**\n * Property for displaying a label above the input.\n */\n label?: string;\n /**\n * Property for displaying an error message and highlighting the control as invalid.\n */\n errorMessage?: string;\n /**\n * Property for displaying an error and highlighting the control as invalid.\n */\n error?: boolean;\n /**\n * Property to display an icon on the left side.\n */\n iconLeft?: React.ReactNode;\n /**\n * Property to display an icon on the right side.\n */\n iconRight?: React.ReactNode;\n /**\n * Add function clear for input.\n */\n extraClear?: boolean;\n /**\n * Function triggered when user clicks on extraClear button.\n */\n onRemove?: () => void;\n /**\n * Property for show checked status in input. Show only if not errorMessage.\n */\n checked?: boolean;\n /**\n * Property for passing a new icon to replace the default checked icon.\n */\n checkedIcon?: React.ReactNode;\n /**\n * Property to specify the size of the right icon.\n */\n iconRightSize?: number | string;\n /**\n * Unique identifier for the input element. Used for accessibility linking.\n */\n id?: string;\n /**\n * Accessible label for screen readers when no visible label is present.\n */\n \"aria-label\"?: string;\n /**\n * Override border radius for top-left corner.\n */\n borderTopLeftRadius?: number;\n /**\n * Override border radius for top-right corner.\n */\n borderTopRightRadius?: number;\n /**\n * Override border radius for bottom-left corner.\n */\n borderBottomLeftRadius?: number;\n /**\n * Override border radius for bottom-right corner.\n */\n borderBottomRightRadius?: number;\n /**\n * Custom background color for the input.\n */\n backgroundColor?: string;\n /**\n * Test identifier for the input.\n */\n testID?: string;\n}\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onKeyDown,\n size = \"md\",\n disabled = false,\n name,\n label,\n errorMessage,\n error,\n iconLeft,\n iconRight,\n iconRightSize,\n extraClear = false,\n onRemove,\n checked = false,\n checkedIcon = <Check />,\n type,\n id: providedId,\n \"aria-label\": ariaLabel,\n borderTopLeftRadius: borderTopLeftRadiusOverride,\n borderTopRightRadius: borderTopRightRadiusOverride,\n borderBottomLeftRadius: borderBottomLeftRadiusOverride,\n borderBottomRightRadius: borderBottomRightRadiusOverride,\n backgroundColor: backgroundColorProp,\n testID,\n onBlur: externalOnBlur,\n onFocus: externalOnFocus,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const [internalState, setInternalState] = useState<\"default\" | \"focus\">(\n \"default\"\n );\n // Internal value state - mimics useUpdatableState from switch-repo\n const [passValue, setPassValue] = useState(value ?? \"\");\n const inputRef = useRef<HTMLInputElement>(null);\n\n // Generate unique IDs for accessibility\n // Sanitize useId() output to remove colons (e.g., :r0: -> r0)\n // This ensures valid HTML id attributes and ARIA references\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-${safeId}`;\n const labelId = `${inputId}-label`;\n const errorId = `${inputId}-error`;\n\n // Forward ref to input element\n React.useImperativeHandle(\n ref,\n () => inputRef.current as HTMLInputElement,\n []\n );\n\n // Sync passValue with value prop when it changes (like useUpdatableState)\n useEffect(() => {\n if (value !== undefined) {\n setPassValue(value);\n }\n }, [value]);\n\n const isDisable = disabled;\n const isError = !!(errorMessage || error);\n const isFocus = internalState === \"focus\";\n\n const isLeftInputIconShown = !!iconLeft;\n const isRightInputIconShown = !!iconRight;\n\n // Handle checked status (only show if not error)\n const isCheckedShown = checked && !errorMessage;\n // Clear button visibility depends on internal state\n const isExtraClearIconShown = !disabled && extraClear && !!passValue;\n const extrasCount =\n Number(isExtraClearIconShown) +\n Number(isCheckedShown) +\n Number(isRightInputIconShown);\n\n // Resolve Config from Theme\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n\n const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"focus\");\n }\n externalOnFocus?.(e);\n };\n\n const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n if (!isDisable) {\n setInternalState(\"default\");\n }\n externalOnBlur?.(e);\n };\n\n // Match switch-repo handleChange pattern exactly\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n\n // If onChange is provided (controlled mode), call it\n // But ALWAYS update internal state for clear button visibility\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(newValue);\n }\n\n // Always update internal state (this is key for uncontrolled mode in Storybook)\n setPassValue(newValue);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"Escape\") {\n e.currentTarget.blur();\n }\n if (onKeyDown) {\n onKeyDown(e);\n }\n };\n\n // Match switch-repo onClear pattern - NO direct DOM manipulation\n const handleClear = (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n\n // Update internal state first (this makes the input show empty)\n setPassValue(\"\");\n\n // Call onRemove callback\n onRemove?.();\n\n // Create synthetic change event and call onChange if provided\n if (inputRef.current) {\n // Web-specific: Use the native setter to properly set the value\n // without shadowing the property (only on web platform)\n if (typeof window !== \"undefined\" && window.HTMLInputElement) {\n const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n window.HTMLInputElement.prototype,\n \"value\"\n )?.set;\n\n if (nativeInputValueSetter) {\n nativeInputValueSetter.call(inputRef.current, \"\");\n }\n }\n\n // Create a proper synthetic event\n const syntheticEvent = {\n target: inputRef.current,\n currentTarget: inputRef.current,\n type: \"change\",\n } as React.ChangeEvent<HTMLInputElement>;\n\n onChange?.(syntheticEvent);\n inputRef.current.focus();\n }\n };\n\n // Resolve background and border colors based on state\n let backgroundColor = backgroundColorProp || inputColors.bg;\n let borderColor = inputColors.border;\n let outlineColor: string | undefined;\n\n if (isDisable) {\n backgroundColor = inputColors.bgDisable;\n borderColor = inputColors.borderDisable;\n } else if (isError) {\n outlineColor = theme.colors.border.alert;\n if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n }\n } else if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n outlineColor = theme.colors.border.brand;\n }\n\n const textColor = isDisable ? inputColors.textDisable : inputColors.text;\n const placeholderColor = inputColors.placeholder;\n\n // Padding values from Figma design\n const paddingConfig = {\n xl: { vertical: 12, horizontal: 12 },\n lg: { vertical: 14, horizontal: 12 },\n md: { vertical: 11, horizontal: 12 },\n sm: { vertical: 7, horizontal: 10 },\n xs: { vertical: 7, horizontal: 10 },\n };\n\n // Border radius from Figma design\n const borderRadiusConfig = {\n xl: 4,\n lg: 4,\n md: 2,\n sm: 2,\n xs: 2,\n };\n\n // Icon sizes from Figma design\n const iconSizeConfig = {\n xl: 18,\n lg: 18,\n md: 18,\n sm: 16,\n xs: 16,\n };\n\n // Focus outline config from Figma design\n const focusOutlineConfig = {\n xl: { width: 2, offset: -2 },\n lg: { width: 2, offset: -2 },\n md: { width: 1, offset: -1 },\n sm: { width: 1, offset: -1 },\n xs: { width: 1, offset: -1 },\n };\n\n const padding = paddingConfig[size];\n const borderRadius = borderRadiusConfig[size];\n const iconSize = iconSizeConfig[size];\n const focusOutline = focusOutlineConfig[size];\n\n return (\n <Box\n flexDirection=\"column\"\n gap={sizeStyles.fieldGap}\n width=\"100%\"\n testID={testID}\n >\n {label && (\n <Box as=\"label\" id={labelId}>\n <Text\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n </Box>\n )}\n <Box\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n height={sizeStyles.height}\n paddingVertical={padding.vertical}\n paddingHorizontal={padding.horizontal}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={10}\n position=\"relative\"\n style={{\n borderTopLeftRadius: borderTopLeftRadiusOverride ?? borderRadius,\n borderTopRightRadius: borderTopRightRadiusOverride ?? borderRadius,\n borderBottomLeftRadius:\n borderBottomLeftRadiusOverride ?? borderRadius,\n borderBottomRightRadius:\n borderBottomRightRadiusOverride ?? borderRadius,\n ...(outlineColor\n ? {\n outline: `${focusOutline.width}px solid ${outlineColor}`,\n outlineOffset: `${focusOutline.offset}px`,\n }\n : {}),\n }}\n hoverStyle={\n !isDisable && !isFocus && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n {isLeftInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconSize} color={textColor}>\n {iconLeft}\n </Icon>\n </Box>\n )}\n\n <Box flex={1} height=\"100%\" justifyContent=\"center\">\n <InputPrimitive\n ref={inputRef}\n id={inputId}\n value={passValue}\n name={name}\n placeholder={placeholder}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n disabled={isDisable}\n type={type || \"text\"}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n placeholderTextColor={placeholderColor}\n aria-invalid={isError || undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n aria-disabled={isDisable || undefined}\n data-testid=\"input__field\"\n {...rest}\n />\n </Box>\n\n {/* Right-side Extras Wrapper */}\n {extrasCount > 0 && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={4}>\n {isExtraClearIconShown && (\n <Box\n as=\"button\"\n type=\"button\"\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n cursor={disabled ? \"not-allowed\" : \"pointer\"}\n onPress={!disabled ? handleClear : undefined}\n disabled={disabled}\n data-testid=\"input__extra-clear-button\"\n >\n <Icon size={iconSize} color={textColor}>\n <X />\n </Icon>\n </Box>\n )}\n {isCheckedShown && (\n <Box\n alignItems=\"center\"\n justifyContent=\"center\"\n width={iconSize}\n height=\"100%\"\n >\n <Icon\n size={iconSize}\n color={theme.colors.content.success.primary}\n >\n {checkedIcon}\n </Icon>\n </Box>\n )}\n {isRightInputIconShown && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={iconRightSize || iconSize} color={textColor}>\n {iconRight}\n </Icon>\n </Box>\n )}\n </Box>\n )}\n </Box>\n\n {errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nInput.displayName = \"Input\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledBox = styled.div<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (props.disabled ? 0.5 : 1)};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n type,\n disabled,\n id,\n ...props\n },\n ref\n ) => {\n // Handle as=\"img\" for rendering images with proper border-radius\n if (as === \"img\" && src) {\n return (\n <img\n src={src}\n alt={alt || \"\"}\n style={{\n display: \"block\",\n objectFit: \"cover\",\n width:\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width,\n height:\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height,\n borderRadius:\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius,\n position: props.position,\n top: typeof props.top === \"number\" ? `${props.top}px` : props.top,\n left:\n typeof props.left === \"number\" ? `${props.left}px` : props.left,\n right:\n typeof props.right === \"number\"\n ? `${props.right}px`\n : props.right,\n bottom:\n typeof props.bottom === \"number\"\n ? `${props.bottom}px`\n : props.bottom,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n as={as}\n id={id}\n type={as === \"button\" ? type || \"button\" : undefined}\n disabled={as === \"button\" ? disabled : undefined}\n onClick={onPress}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n role={role}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-current={ariaCurrent}\n aria-disabled={ariaDisabled}\n aria-busy={ariaBusy}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n aria-live={ariaLive}\n tabIndex={tabIndex !== undefined ? tabIndex : undefined}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledText = styled.span<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Pilat Wide Bold\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif !important'};\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":";AAAA,OAAOA;AAAA,EACL;AAAA,EACA,cAAAC;AAAA,EACA;AAAA,EACA;AAAA,OAEK;;;ACNP,OAAO,WAAW;AAClB,OAAO,YAAY;AAuMX;AApMR,IAAM,YAAY,OAAO;AAAA;AAAA;AAAA,sBAGH,CAAC,UAAU,MAAM,mBAAmB,aAAa;AAAA,kBACrD,CAAC,UAAU,MAAM,eAAe,aAAa;AAAA,kBAC7C,CAAC,UACf,OAAO,MAAM,gBAAgB,WACzB,GAAG,MAAM,WAAW,OACpB,MAAM,eAAe,CAAC;AAAA;AAAA,IAE1B,CAAC,UACD,MAAM,sBAAsB,UAC5B;AAAA,2BACuB,OAAO,MAAM,sBAAsB,WAAW,GAAG,MAAM,iBAAiB,OAAO,MAAM,iBAAiB;AAAA,2BACtG,MAAM,qBAAqB,MAAM,eAAe,aAAa;AAAA;AAAA,GAErF;AAAA,IACC,CAAC,UACD,MAAM,mBAAmB,UACzB;AAAA,wBACoB,OAAO,MAAM,mBAAmB,WAAW,GAAG,MAAM,cAAc,OAAO,MAAM,cAAc;AAAA,wBAC7F,MAAM,kBAAkB,MAAM,eAAe,aAAa;AAAA;AAAA,GAE/E;AAAA,IACC,CAAC,UACD,MAAM,oBAAoB,UAC1B;AAAA,yBACqB,OAAO,MAAM,oBAAoB,WAAW,GAAG,MAAM,eAAe,OAAO,MAAM,eAAe;AAAA,yBAChG,MAAM,mBAAmB,MAAM,eAAe,aAAa;AAAA;AAAA,GAEjF;AAAA,IACC,CAAC,UACD,MAAM,qBAAqB,UAC3B;AAAA,0BACsB,OAAO,MAAM,qBAAqB,WAAW,GAAG,MAAM,gBAAgB,OAAO,MAAM,gBAAgB;AAAA,0BACnG,MAAM,oBAAoB,MAAM,eAAe,aAAa;AAAA;AAAA,GAEnF;AAAA;AAAA,kBAEe,CAAC,UACf,MAAM,gBACL,MAAM,eACP,MAAM,qBACN,MAAM,kBACN,MAAM,mBACN,MAAM,mBACF,UACA,OAAO;AAAA,mBACI,CAAC,UAChB,OAAO,MAAM,iBAAiB,WAC1B,GAAG,MAAM,YAAY,OACrB,MAAM,gBAAgB,CAAC;AAAA,YACnB,CAAC,UACT,OAAO,MAAM,WAAW,WACpB,GAAG,MAAM,MAAM,OACf,MAAM,UAAU,MAAM;AAAA,WACnB,CAAC,UACR,OAAO,MAAM,UAAU,WACnB,GAAG,MAAM,KAAK,OACd,MAAM,SAAS,MAAM;AAAA,eACd,CAAC,UACZ,OAAO,MAAM,aAAa,WACtB,GAAG,MAAM,QAAQ,OACjB,MAAM,YAAY,MAAM;AAAA,gBAChB,CAAC,UACb,OAAO,MAAM,cAAc,WACvB,GAAG,MAAM,SAAS,OAClB,MAAM,aAAa,MAAM;AAAA;AAAA,aAEpB,CAAC,UACV,OAAO,MAAM,YAAY,WACrB,GAAG,MAAM,OAAO,OAChB,MAAM,WAAW,CAAC;AAAA,IACtB,CAAC,UACD,MAAM,qBACN;AAAA,oBACgB,OAAO,MAAM,sBAAsB,WAAW,GAAG,MAAM,iBAAiB,OAAO,MAAM,iBAAiB;AAAA,qBACrG,OAAO,MAAM,sBAAsB,WAAW,GAAG,MAAM,iBAAiB,OAAO,MAAM,iBAAiB;AAAA,GACxH;AAAA,IACC,CAAC,UACD,MAAM,mBACN;AAAA,mBACe,OAAO,MAAM,oBAAoB,WAAW,GAAG,MAAM,eAAe,OAAO,MAAM,eAAe;AAAA,sBAC7F,OAAO,MAAM,oBAAoB,WAAW,GAAG,MAAM,eAAe,OAAO,MAAM,eAAe;AAAA,GACnH;AAAA,IACC,CAAC,UACD,MAAM,eAAe,UACrB,gBAAgB,OAAO,MAAM,eAAe,WAAW,GAAG,MAAM,UAAU,OAAO,MAAM,UAAU,GAAG;AAAA,IACpG,CAAC,UACD,MAAM,kBAAkB,UACxB,mBAAmB,OAAO,MAAM,kBAAkB,WAAW,GAAG,MAAM,aAAa,OAAO,MAAM,aAAa,GAAG;AAAA,IAChH,CAAC,UACD,MAAM,gBAAgB,UACtB,iBAAiB,OAAO,MAAM,gBAAgB,WAAW,GAAG,MAAM,WAAW,OAAO,MAAM,WAAW,GAAG;AAAA,IACxG,CAAC,UACD,MAAM,iBAAiB,UACvB,kBAAkB,OAAO,MAAM,iBAAiB,WAAW,GAAG,MAAM,YAAY,OAAO,MAAM,YAAY,GAAG;AAAA;AAAA,YAEpG,CAAC,UACT,OAAO,MAAM,WAAW,WAAW,GAAG,MAAM,MAAM,OAAO,MAAM,UAAU,CAAC;AAAA,IAC1E,CAAC,UACD,MAAM,cAAc,UACpB,eAAe,OAAO,MAAM,cAAc,WAAW,GAAG,MAAM,SAAS,OAAO,MAAM,SAAS,GAAG;AAAA,IAChG,CAAC,UACD,MAAM,iBAAiB,UACvB,kBAAkB,OAAO,MAAM,iBAAiB,WAAW,GAAG,MAAM,YAAY,OAAO,MAAM,YAAY,GAAG;AAAA,IAC5G,CAAC,UACD,MAAM,eAAe,UACrB,gBAAgB,OAAO,MAAM,eAAe,WAAW,GAAG,MAAM,UAAU,OAAO,MAAM,UAAU,GAAG;AAAA,IACpG,CAAC,UACD,MAAM,gBAAgB,UACtB,iBAAiB,OAAO,MAAM,gBAAgB,WAAW,GAAG,MAAM,WAAW,OAAO,MAAM,WAAW,GAAG;AAAA;AAAA,oBAExF,CAAC,UAAU,MAAM,iBAAiB,QAAQ;AAAA,eAC/C,CAAC,UAAU,MAAM,YAAY,QAAQ;AAAA,iBACnC,CAAC,UAAU,MAAM,cAAc,SAAS;AAAA,qBACpC,CAAC,UAAU,MAAM,kBAAkB,YAAY;AAAA,YACxD,CAAC,UACT,MAAM,SACF,MAAM,SACN,MAAM,WAAW,MAAM,UACrB,YACA,SAAS;AAAA,cACL,CAAC,UAAU,MAAM,YAAY,QAAQ;AAAA,SAC1C,CAAC,UACN,OAAO,MAAM,QAAQ,WAAW,GAAG,MAAM,GAAG,OAAO,MAAM,GAAG;AAAA,YACpD,CAAC,UACT,OAAO,MAAM,WAAW,WAAW,GAAG,MAAM,MAAM,OAAO,MAAM,MAAM;AAAA,UAC/D,CAAC,UACP,OAAO,MAAM,SAAS,WAAW,GAAG,MAAM,IAAI,OAAO,MAAM,IAAI;AAAA,WACxD,CAAC,UACR,OAAO,MAAM,UAAU,WAAW,GAAG,MAAM,KAAK,OAAO,MAAM,KAAK;AAAA,UAC5D,CAAC,UAAU,MAAM,IAAI;AAAA,iBACd,CAAC,UAAU,MAAM,cAAc,CAAC;AAAA,SACxC,CAAC,UACN,OAAO,MAAM,QAAQ,WAAW,GAAG,MAAM,GAAG,OAAO,MAAM,OAAO,CAAC;AAAA,gBACrD,CAAC,UAAU,MAAM,aAAa,MAAM;AAAA,cACtC,CAAC,UAAU,MAAM,YAAY,SAAS;AAAA,gBACpC,CAAC,UAAU,MAAM,aAAa,SAAS;AAAA,gBACvC,CAAC,UAAU,MAAM,aAAa,SAAS;AAAA,aAC1C,CAAC,UAAU,MAAM,MAAM;AAAA,aACvB,CAAC,UAAW,MAAM,WAAW,MAAM,CAAE;AAAA,oBAC9B,CAAC,UAAW,MAAM,WAAW,SAAS,MAAO;AAAA;AAAA;AAAA,MAG3D,CAAC,UACD,MAAM,YAAY,mBAClB,qBAAqB,MAAM,WAAW,eAAe,GAAG;AAAA,MACxD,CAAC,UACD,MAAM,YAAY,eAClB,iBAAiB,MAAM,WAAW,WAAW,GAAG;AAAA;AAAA;AAAA;AAAA,MAIhD,CAAC,UACD,MAAM,YAAY,mBAClB,qBAAqB,MAAM,WAAW,eAAe,GAAG;AAAA;AAAA;AAIvD,IAAM,MAAM,MAAM;AAAA,EAIvB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB,aAAa;AAAA,IACb,aAAa;AAAA,IACb,oBAAoB;AAAA,IACpB,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,IACjB,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AAEH,QAAI,OAAO,SAAS,KAAK;AACvB,aACE;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,KAAK,OAAO;AAAA,UACZ,OAAO;AAAA,YACL,SAAS;AAAA,YACT,WAAW;AAAA,YACX,OACE,OAAO,MAAM,UAAU,WACnB,GAAG,MAAM,KAAK,OACd,MAAM;AAAA,YACZ,QACE,OAAO,MAAM,WAAW,WACpB,GAAG,MAAM,MAAM,OACf,MAAM;AAAA,YACZ,cACE,OAAO,MAAM,iBAAiB,WAC1B,GAAG,MAAM,YAAY,OACrB,MAAM;AAAA,YACZ,UAAU,MAAM;AAAA,YAChB,KAAK,OAAO,MAAM,QAAQ,WAAW,GAAG,MAAM,GAAG,OAAO,MAAM;AAAA,YAC9D,MACE,OAAO,MAAM,SAAS,WAAW,GAAG,MAAM,IAAI,OAAO,MAAM;AAAA,YAC7D,OACE,OAAO,MAAM,UAAU,WACnB,GAAG,MAAM,KAAK,OACd,MAAM;AAAA,YACZ,QACE,OAAO,MAAM,WAAW,WACpB,GAAG,MAAM,MAAM,OACf,MAAM;AAAA,UACd;AAAA;AAAA,MACF;AAAA,IAEJ;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA,MAAM,OAAO,WAAW,QAAQ,WAAW;AAAA,QAC3C,UAAU,OAAO,WAAW,WAAW;AAAA,QACvC,SAAS;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA,cAAY;AAAA,QACZ,mBAAiB;AAAA,QACjB,gBAAc;AAAA,QACd,iBAAe;AAAA,QACf,aAAW;AAAA,QACX,oBAAkB;AAAA,QAClB,iBAAe;AAAA,QACf,iBAAe;AAAA,QACf,gBAAc;AAAA,QACd,iBAAe;AAAA,QACf,aAAW;AAAA,QACX,UAAU,aAAa,SAAY,WAAW;AAAA,QAC7C,GAAG;AAAA,QAEH;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,IAAI,cAAc;;;ACzQlB,OAAOC,aAAY;AA8Bf,gBAAAC,YAAA;AA3BJ,IAAM,aAAaD,QAAO;AAAA,WACf,CAAC,UAAU,MAAM,SAAS,SAAS;AAAA,eAC/B,CAAC,UACZ,OAAO,MAAM,aAAa,WACtB,GAAG,MAAM,QAAQ,OACjB,MAAM,YAAY,SAAS;AAAA,iBAClB,CAAC,UAAU,MAAM,cAAc,QAAQ;AAAA,iBACvC,CAAC,UACd,MAAM,cACN,mHAAmH;AAAA,iBACtG,CAAC,UACd,OAAO,MAAM,eAAe,WACxB,GAAG,MAAM,UAAU,OACnB,MAAM,cAAc,SAAS;AAAA,iBACpB,CAAC,UAAU,MAAM,cAAc,QAAQ;AAAA,gBACxC,CAAC,UAAU,MAAM,aAAa,SAAS;AAAA,qBAClC,CAAC,UAAU,MAAM,kBAAkB,MAAM;AAAA;AAGvD,IAAM,OAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,SACE,gBAAAC;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,EACF;AAEJ;;;ACtCA,OAAOC,aAAY;AAsBV,gBAAAC,YAAA;AAnBT,IAAM,aAAaD,QAAO;AAAA;AAAA;AAAA;AAAA,WAIf,CAAC,UACR,OAAO,MAAM,SAAS,WAAW,GAAG,MAAM,IAAI,OAAO,MAAM,QAAQ,MAAM;AAAA,YACjE,CAAC,UACT,OAAO,MAAM,SAAS,WAAW,GAAG,MAAM,IAAI,OAAO,MAAM,QAAQ,MAAM;AAAA,WAClE,CAAC,UAAU,MAAM,SAAS,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAU5C,IAAM,OAA4B,CAAC,EAAE,UAAU,GAAG,MAAM,MAAM;AACnE,SAAO,gBAAAC,KAAC,cAAY,GAAG,OAAQ,UAAS;AAC1C;;;ACxBA,SAAgB,kBAAkB;AAClC,OAAOC,aAAY;AA0Eb,gBAAAC,YAAA;AAvEN,IAAM,cAAcD,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAQhB,CAAC,UAAU,MAAM,SAAS,SAAS;AAAA,eAC/B,CAAC,UACZ,OAAO,MAAM,aAAa,WACtB,GAAG,MAAM,QAAQ,OACjB,MAAM,YAAY,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA,aAKtB,CAAC,UACR,MAAM,wBAAwB,0BAA0B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQvD,IAAM,iBAAiB;AAAA,EAC5B,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB,oBAAoB;AAAA,IACpB,mBAAmB;AAAA,IACnB,cAAc;AAAA,IACd,iBAAiB;AAAA,IACjB,eAAe;AAAA,IACf,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,eAAe,CAAC,MAA2C;AAC/D,UAAI,UAAU;AACZ,iBAAS,CAAC;AAAA,MACZ;AACA,UAAI,cAAc;AAChB,qBAAa,EAAE,OAAO,KAAK;AAAA,MAC7B;AAAA,IACF;AAGA,UAAM,aAAa,UAAU,SAAY,QAAQ;AAEjD,WACE,gBAAAC;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,OAAO;AAAA,QACP;AAAA,QACA;AAAA,QACA,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,MAAM,kBAAkB,aAAa,QAAQ;AAAA,QAC7C;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,gBAAc;AAAA,QACd,oBAAkB;AAAA,QAClB,mBAAiB;AAAA,QACjB,cAAY;AAAA,QACZ,iBAAe;AAAA,QACf,eAAa;AAAA,QACZ,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,eAAe,cAAc;;;AJjG7B,SAAS,iBAAiB,aAAa;AACvC,SAAS,OAAO,SAAS;AA4HL,gBAAAC,MAsSR,YAtSQ;AApBb,IAAM,QAAQC;AAAA,EACnB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,aAAa;AAAA,IACb;AAAA,IACA,UAAU;AAAA,IACV,cAAc,gBAAAD,KAAC,SAAM;AAAA,IACrB;AAAA,IACA,IAAI;AAAA,IACJ,cAAc;AAAA,IACd,qBAAqB;AAAA,IACrB,sBAAsB;AAAA,IACtB,wBAAwB;AAAA,IACxB,yBAAyB;AAAA,IACzB,iBAAiB;AAAA,IACjB;AAAA,IACA,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,EAAE,MAAM,IAAI,gBAAgB;AAClC,UAAM,CAAC,eAAe,gBAAgB,IAAI;AAAA,MACxC;AAAA,IACF;AAEA,UAAM,CAAC,WAAW,YAAY,IAAI,SAAS,SAAS,EAAE;AACtD,UAAM,WAAW,OAAyB,IAAI;AAK9C,UAAM,QAAQ,MAAM;AACpB,UAAM,SAAS,MAAM,QAAQ,MAAM,EAAE;AACrC,UAAM,UAAU,cAAc,SAAS,MAAM;AAC7C,UAAM,UAAU,GAAG,OAAO;AAC1B,UAAM,UAAU,GAAG,OAAO;AAG1B,IAAAE,OAAM;AAAA,MACJ;AAAA,MACA,MAAM,SAAS;AAAA,MACf,CAAC;AAAA,IACH;AAGA,cAAU,MAAM;AACd,UAAI,UAAU,QAAW;AACvB,qBAAa,KAAK;AAAA,MACpB;AAAA,IACF,GAAG,CAAC,KAAK,CAAC;AAEV,UAAM,YAAY;AAClB,UAAM,UAAU,CAAC,EAAE,gBAAgB;AACnC,UAAM,UAAU,kBAAkB;AAElC,UAAM,uBAAuB,CAAC,CAAC;AAC/B,UAAM,wBAAwB,CAAC,CAAC;AAGhC,UAAM,iBAAiB,WAAW,CAAC;AAEnC,UAAM,wBAAwB,CAAC,YAAY,cAAc,CAAC,CAAC;AAC3D,UAAM,cACJ,OAAO,qBAAqB,IAC5B,OAAO,cAAc,IACrB,OAAO,qBAAqB;AAG9B,UAAM,aAAa,MAAM,OAAO,MAAM,IAAI;AAC1C,UAAM,cAAc,MAAM,OAAO,QAAQ;AAEzC,UAAM,cAAc,CAAC,MAA0C;AAC7D,UAAI,CAAC,WAAW;AACd,yBAAiB,OAAO;AAAA,MAC1B;AACA,wBAAkB,CAAC;AAAA,IACrB;AAEA,UAAM,aAAa,CAAC,MAA0C;AAC5D,UAAI,CAAC,WAAW;AACd,yBAAiB,SAAS;AAAA,MAC5B;AACA,uBAAiB,CAAC;AAAA,IACpB;AAGA,UAAM,eAAe,CAAC,MAA2C;AAC/D,YAAM,WAAW,EAAE,OAAO;AAI1B,UAAI,UAAU;AACZ,iBAAS,CAAC;AAAA,MACZ;AACA,UAAI,cAAc;AAChB,qBAAa,QAAQ;AAAA,MACvB;AAGA,mBAAa,QAAQ;AAAA,IACvB;AAEA,UAAM,gBAAgB,CAAC,MAA6C;AAClE,UAAI,EAAE,QAAQ,UAAU;AACtB,UAAE,cAAc,KAAK;AAAA,MACvB;AACA,UAAI,WAAW;AACb,kBAAU,CAAC;AAAA,MACb;AAAA,IACF;AAGA,UAAM,cAAc,CAAC,MAAqC;AACxD,QAAE,gBAAgB;AAGlB,mBAAa,EAAE;AAGf,iBAAW;AAGX,UAAI,SAAS,SAAS;AAGpB,YAAI,OAAO,WAAW,eAAe,OAAO,kBAAkB;AAC5D,gBAAM,yBAAyB,OAAO;AAAA,YACpC,OAAO,iBAAiB;AAAA,YACxB;AAAA,UACF,GAAG;AAEH,cAAI,wBAAwB;AAC1B,mCAAuB,KAAK,SAAS,SAAS,EAAE;AAAA,UAClD;AAAA,QACF;AAGA,cAAM,iBAAiB;AAAA,UACrB,QAAQ,SAAS;AAAA,UACjB,eAAe,SAAS;AAAA,UACxB,MAAM;AAAA,QACR;AAEA,mBAAW,cAAc;AACzB,iBAAS,QAAQ,MAAM;AAAA,MACzB;AAAA,IACF;AAGA,QAAI,kBAAkB,uBAAuB,YAAY;AACzD,QAAI,cAAc,YAAY;AAC9B,QAAI;AAEJ,QAAI,WAAW;AACb,wBAAkB,YAAY;AAC9B,oBAAc,YAAY;AAAA,IAC5B,WAAW,SAAS;AAClB,qBAAe,MAAM,OAAO,OAAO;AACnC,UAAI,SAAS;AACX,0BAAkB,MAAM,OAAO,QAAQ,MAAM;AAAA,MAC/C;AAAA,IACF,WAAW,SAAS;AAClB,wBAAkB,MAAM,OAAO,QAAQ,MAAM;AAC7C,qBAAe,MAAM,OAAO,OAAO;AAAA,IACrC;AAEA,UAAM,YAAY,YAAY,YAAY,cAAc,YAAY;AACpE,UAAM,mBAAmB,YAAY;AAGrC,UAAM,gBAAgB;AAAA,MACpB,IAAI,EAAE,UAAU,IAAI,YAAY,GAAG;AAAA,MACnC,IAAI,EAAE,UAAU,IAAI,YAAY,GAAG;AAAA,MACnC,IAAI,EAAE,UAAU,IAAI,YAAY,GAAG;AAAA,MACnC,IAAI,EAAE,UAAU,GAAG,YAAY,GAAG;AAAA,MAClC,IAAI,EAAE,UAAU,GAAG,YAAY,GAAG;AAAA,IACpC;AAGA,UAAM,qBAAqB;AAAA,MACzB,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAGA,UAAM,iBAAiB;AAAA,MACrB,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAGA,UAAM,qBAAqB;AAAA,MACzB,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG;AAAA,MAC3B,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG;AAAA,MAC3B,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG;AAAA,MAC3B,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG;AAAA,MAC3B,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG;AAAA,IAC7B;AAEA,UAAM,UAAU,cAAc,IAAI;AAClC,UAAM,eAAe,mBAAmB,IAAI;AAC5C,UAAM,WAAW,eAAe,IAAI;AACpC,UAAM,eAAe,mBAAmB,IAAI;AAE5C,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAc;AAAA,QACd,KAAK,WAAW;AAAA,QAChB,OAAM;AAAA,QACN;AAAA,QAEC;AAAA,mBACC,gBAAAF,KAAC,OAAI,IAAG,SAAQ,IAAI,SAClB,0BAAAA;AAAA,YAAC;AAAA;AAAA,cACC,OAAO,MAAM,OAAO,QAAQ;AAAA,cAC5B,UAAU,WAAW,WAAW;AAAA,cAChC,YAAW;AAAA,cAEV;AAAA;AAAA,UACH,GACF;AAAA,UAEF;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA,aAAa,gBAAgB,gBAAgB,IAAI;AAAA,cACjD,QAAQ,WAAW;AAAA,cACnB,iBAAiB,QAAQ;AAAA,cACzB,mBAAmB,QAAQ;AAAA,cAC3B,eAAc;AAAA,cACd,YAAW;AAAA,cACX,KAAK;AAAA,cACL,UAAS;AAAA,cACT,OAAO;AAAA,gBACL,qBAAqB,+BAA+B;AAAA,gBACpD,sBAAsB,gCAAgC;AAAA,gBACtD,wBACE,kCAAkC;AAAA,gBACpC,yBACE,mCAAmC;AAAA,gBACrC,GAAI,eACA;AAAA,kBACE,SAAS,GAAG,aAAa,KAAK,YAAY,YAAY;AAAA,kBACtD,eAAe,GAAG,aAAa,MAAM;AAAA,gBACvC,IACA,CAAC;AAAA,cACP;AAAA,cACA,YACE,CAAC,aAAa,CAAC,WAAW,CAAC,UACvB;AAAA,gBACE,iBAAiB,YAAY;AAAA,gBAC7B,aAAa,YAAY;AAAA,cAC3B,IACA;AAAA,cAGL;AAAA,wCACC,gBAAAA,KAAC,OAAI,YAAW,UAAS,gBAAe,UACtC,0BAAAA,KAAC,QAAK,MAAM,UAAU,OAAO,WAC1B,oBACH,GACF;AAAA,gBAGF,gBAAAA,KAAC,OAAI,MAAM,GAAG,QAAO,QAAO,gBAAe,UACzC,0BAAAA;AAAA,kBAAC;AAAA;AAAA,oBACC,KAAK;AAAA,oBACL,IAAI;AAAA,oBACJ,OAAO;AAAA,oBACP;AAAA,oBACA;AAAA,oBACA,UAAU;AAAA,oBACV,SAAS;AAAA,oBACT,QAAQ;AAAA,oBACR,WAAW;AAAA,oBACX,UAAU;AAAA,oBACV,MAAM,QAAQ;AAAA,oBACd,OAAO;AAAA,oBACP,UAAU,WAAW;AAAA,oBACrB,sBAAsB;AAAA,oBACtB,gBAAc,WAAW;AAAA,oBACzB,oBAAkB,eAAe,UAAU;AAAA,oBAC3C,mBAAiB,QAAQ,UAAU;AAAA,oBACnC,cAAY,CAAC,QAAQ,YAAY;AAAA,oBACjC,iBAAe,aAAa;AAAA,oBAC5B,eAAY;AAAA,oBACX,GAAG;AAAA;AAAA,gBACN,GACF;AAAA,gBAGC,cAAc,KACb,qBAAC,OAAI,eAAc,OAAM,YAAW,UAAS,KAAK,GAC/C;AAAA,2CACC,gBAAAA;AAAA,oBAAC;AAAA;AAAA,sBACC,IAAG;AAAA,sBACH,MAAK;AAAA,sBACL,YAAW;AAAA,sBACX,gBAAe;AAAA,sBACf,OAAO;AAAA,sBACP,QAAO;AAAA,sBACP,iBAAgB;AAAA,sBAChB,aAAa;AAAA,sBACb,QAAQ,WAAW,gBAAgB;AAAA,sBACnC,SAAS,CAAC,WAAW,cAAc;AAAA,sBACnC;AAAA,sBACA,eAAY;AAAA,sBAEZ,0BAAAA,KAAC,QAAK,MAAM,UAAU,OAAO,WAC3B,0BAAAA,KAAC,KAAE,GACL;AAAA;AAAA,kBACF;AAAA,kBAED,kBACC,gBAAAA;AAAA,oBAAC;AAAA;AAAA,sBACC,YAAW;AAAA,sBACX,gBAAe;AAAA,sBACf,OAAO;AAAA,sBACP,QAAO;AAAA,sBAEP,0BAAAA;AAAA,wBAAC;AAAA;AAAA,0BACC,MAAM;AAAA,0BACN,OAAO,MAAM,OAAO,QAAQ,QAAQ;AAAA,0BAEnC;AAAA;AAAA,sBACH;AAAA;AAAA,kBACF;AAAA,kBAED,yBACC,gBAAAA,KAAC,OAAI,YAAW,UAAS,gBAAe,UACtC,0BAAAA,KAAC,QAAK,MAAM,iBAAiB,UAAU,OAAO,WAC3C,qBACH,GACF;AAAA,mBAEJ;AAAA;AAAA;AAAA,UAEJ;AAAA,UAEC,gBACC,gBAAAA;AAAA,YAAC;AAAA;AAAA,cACC,IAAI;AAAA,cACJ,MAAK;AAAA,cACL,OAAO,MAAM,OAAO,QAAQ,MAAM;AAAA,cAClC,UAAU,WAAW,WAAW;AAAA,cAChC,OAAO,EAAE,YAAY,WAAW,aAAa,KAAK;AAAA,cAEjD;AAAA;AAAA,UACH;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,MAAM,cAAc;","names":["React","forwardRef","styled","jsx","styled","jsx","styled","jsx","jsx","forwardRef","React"]}