@xsolla/xui-textarea 0.89.0 → 0.91.0

package/web/index.mjs

@@ -1,5 +1,5 @@
 // src/TextArea.tsx
-import { useState, forwardRef as forwardRef3 } from "react";
+import { useState, forwardRef as forwardRef2 } from "react";
 
 // ../primitives-web/src/Box.tsx
 import React from "react";
@@ -202,193 +202,11 @@ var Text = ({
   );
 };
 
-// ../primitives-web/src/Spinner.tsx
-import styled3, { keyframes } from "styled-components";
-import { jsx as jsx3 } from "react/jsx-runtime";
-var rotate = keyframes`
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-`;
-var StyledSpinner = styled3.div`
-  width: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
-  height: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
-  border: ${(props) => props.strokeWidth || 2}px solid
-    ${(props) => props.color || "currentColor"};
-  border-bottom-color: transparent;
-  border-radius: 50%;
-  display: inline-block;
-  box-sizing: border-box;
-  animation: ${rotate} 1s linear infinite;
-`;
-var Spinner = ({
-  role = "status",
-  "aria-label": ariaLabel,
-  "aria-live": ariaLive = "polite",
-  "aria-describedby": ariaDescribedBy,
-  testID,
-  ...props
-}) => {
-  return /* @__PURE__ */ jsx3(
-    StyledSpinner,
-    {
-      role,
-      "aria-label": ariaLabel,
-      "aria-live": ariaLive,
-      "aria-describedby": ariaDescribedBy,
-      "data-testid": testID,
-      ...props
-    }
-  );
-};
-Spinner.displayName = "Spinner";
-
-// ../primitives-web/src/Icon.tsx
-import styled4 from "styled-components";
-import { jsx as jsx4 } from "react/jsx-runtime";
-var StyledIcon = styled4.div`
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
-  height: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
-  color: ${(props) => props.color || "currentColor"};
-
-  svg {
-    width: 100%;
-    height: 100%;
-    fill: none;
-    stroke: currentColor;
-  }
-`;
-
-// ../primitives-web/src/Divider.tsx
-import styled5 from "styled-components";
-import { jsx as jsx5 } from "react/jsx-runtime";
-var StyledDivider = styled5.div`
-  background-color: ${(props) => props.dashStroke ? "transparent" : props.color || "rgba(255, 255, 255, 0.15)"};
-  width: ${(props) => props.vertical ? typeof props.width === "number" ? `${props.width}px` : props.width || "1px" : "100%"};
-  height: ${(props) => props.vertical ? "100%" : typeof props.height === "number" ? `${props.height}px` : props.height || "1px"};
-
-  ${(props) => props.dashStroke && `
-    border-style: dashed;
-    border-color: ${props.color || "rgba(255, 255, 255, 0.15)"};
-    border-width: 0;
-    ${props.vertical ? `
-      border-left-width: ${typeof props.width === "number" ? `${props.width}px` : props.width || "1px"};
-      height: 100%;
-    ` : `
-      border-top-width: ${typeof props.height === "number" ? `${props.height}px` : props.height || "1px"};
-      width: 100%;
-    `}
-  `}
-`;
-
-// ../primitives-web/src/Input.tsx
-import { forwardRef } from "react";
-import styled6 from "styled-components";
-import { jsx as jsx6 } from "react/jsx-runtime";
-var StyledInput = styled6.input`
-  background: transparent;
-  border: none;
-  outline: none;
-  width: 100%;
-  height: 100%;
-  padding: 0;
-  margin: 0;
-  color: ${(props) => props.color || "inherit"};
-  font-size: ${(props) => typeof props.fontSize === "number" ? `${props.fontSize}px` : props.fontSize || "inherit"};
-  font-family: inherit;
-  text-align: inherit;
-
-  &::placeholder {
-    color: ${(props) => props.placeholderTextColor || "rgba(255, 255, 255, 0.5)"};
-  }
-
-  &:disabled {
-    cursor: not-allowed;
-  }
-`;
-var InputPrimitive = forwardRef(
-  ({
-    value,
-    placeholder,
-    onChange,
-    onChangeText,
-    onFocus,
-    onBlur,
-    onKeyDown,
-    disabled,
-    secureTextEntry,
-    style,
-    color,
-    fontSize,
-    placeholderTextColor,
-    maxLength,
-    name,
-    type,
-    inputMode,
-    autoComplete,
-    id,
-    "aria-invalid": ariaInvalid,
-    "aria-describedby": ariaDescribedBy,
-    "aria-labelledby": ariaLabelledBy,
-    "aria-label": ariaLabel,
-    "aria-disabled": ariaDisabled,
-    "data-testid": dataTestId,
-    ...rest
-  }, ref) => {
-    const handleChange = (e) => {
-      if (onChange) {
-        onChange(e);
-      }
-      if (onChangeText) {
-        onChangeText(e.target.value);
-      }
-    };
-    const inputValue = value !== void 0 ? value : "";
-    return /* @__PURE__ */ jsx6(
-      StyledInput,
-      {
-        ref,
-        id,
-        value: inputValue,
-        name,
-        placeholder,
-        onChange: handleChange,
-        onFocus,
-        onBlur,
-        onKeyDown,
-        disabled,
-        type: secureTextEntry ? "password" : type || "text",
-        inputMode,
-        autoComplete,
-        style,
-        color,
-        fontSize,
-        placeholderTextColor,
-        maxLength,
-        "aria-invalid": ariaInvalid,
-        "aria-describedby": ariaDescribedBy,
-        "aria-labelledby": ariaLabelledBy,
-        "aria-label": ariaLabel,
-        "aria-disabled": ariaDisabled,
-        "data-testid": dataTestId,
-        ...rest
-      }
-    );
-  }
-);
-InputPrimitive.displayName = "InputPrimitive";
-
 // ../primitives-web/src/TextArea.tsx
-import { forwardRef as forwardRef2 } from "react";
-import styled7 from "styled-components";
-import { jsx as jsx7 } from "react/jsx-runtime";
-var StyledTextArea = styled7.textarea`
+import { forwardRef } from "react";
+import styled3 from "styled-components";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var StyledTextArea = styled3.textarea`
   background: transparent;
   border: none;
   outline: none;
@@ -410,7 +228,7 @@ var StyledTextArea = styled7.textarea`
     cursor: not-allowed;
   }
 `;
-var TextAreaPrimitive = forwardRef2(
+var TextAreaPrimitive = forwardRef(
   ({
     value,
     placeholder,
@@ -426,7 +244,7 @@ var TextAreaPrimitive = forwardRef2(
     maxLength,
     rows
   }, ref) => {
-    return /* @__PURE__ */ jsx7(
+    return /* @__PURE__ */ jsx3(
       StyledTextArea,
       {
         ref,
@@ -451,7 +269,7 @@ TextAreaPrimitive.displayName = "TextAreaPrimitive";
 
 // src/TextArea.tsx
 import { useDesignSystem, useId } from "@xsolla/xui-core";
-import { jsx as jsx8, jsxs } from "react/jsx-runtime";
+import { jsx as jsx4, jsxs } from "react/jsx-runtime";
 var paddingMap = {
   xl: 16,
   lg: 14,
@@ -459,7 +277,7 @@ var paddingMap = {
   sm: 10,
   xs: 10
 };
-var TextArea = forwardRef3(
+var TextArea = forwardRef2(
   ({
     value,
     placeholder,
@@ -513,7 +331,7 @@ var TextArea = forwardRef3(
     const computedDescribedBy = describedByIds.length > 0 ? describedByIds.join(" ") : void 0;
     const outlineColor = isFocused && !disabled ? theme.colors.border.brand : void 0;
     return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", gap: 8, width: "100%", children: [
-      /* @__PURE__ */ jsx8(
+      /* @__PURE__ */ jsx4(
         Box,
         {
           backgroundColor,
@@ -536,7 +354,7 @@ var TextArea = forwardRef3(
           hoverStyle: !disabled && !isFocused && !isError ? {
             backgroundColor: inputColors.bgHover
           } : void 0,
-          children: /* @__PURE__ */ jsx8(Box, { flex: 1, height: "100%", children: /* @__PURE__ */ jsx8(
+          children: /* @__PURE__ */ jsx4(Box, { flex: 1, height: "100%", children: /* @__PURE__ */ jsx4(
             TextAreaPrimitive,
             {
               ref,
@@ -559,7 +377,7 @@ var TextArea = forwardRef3(
           ) })
         }
       ),
-      isError && /* @__PURE__ */ jsx8(
+      isError && /* @__PURE__ */ jsx4(
         Text,
         {
           id: errorId,

package/web/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/TextArea.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 { useState, forwardRef } from \"react\";\nimport { Box, Text, TextAreaPrimitive } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem, useId } from \"@xsolla/xui-core\";\n\nconst paddingMap: Record<string, number> = {\n  xl: 16,\n  lg: 14,\n  md: 12,\n  sm: 10,\n  xs: 10,\n};\n\nexport interface TextAreaProps {\n  /** Current value of the textarea */\n  value?: string;\n  /** Placeholder text when empty */\n  placeholder?: string;\n  /** Event handler when the text changes */\n  onChangeText?: (text: string) => void;\n  /** Size of the textarea */\n  size?: \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n  /** Whether the textarea is disabled */\n  disabled?: boolean;\n  /** Error message displayed below the textarea */\n  errorMessage?: string;\n  /** Accessible label for screen readers */\n  \"aria-label\"?: string;\n  /** ID of element that describes this textarea */\n  \"aria-describedby\"?: string;\n  /** Unique identifier for the textarea element */\n  id?: string;\n  /** Test ID for testing frameworks */\n  testID?: string;\n}\n\n/**\n * TextArea - An accessible multi-line text input component\n *\n * Renders as a semantic `<textarea>` element with full ARIA support.\n * Supports labels, error states, and various sizes.\n *\n * ## Accessibility Features\n *\n * - **Semantic HTML**: Renders as a native `<textarea>` element\n * - **Keyboard Navigation**: Focusable via Tab\n * - **ARIA States**: Properly announces disabled and error states\n * - **Error Announcements**: Error messages use `role=\"alert\"` for immediate announcement\n * - **Focus Indicator**: Visible focus ring for keyboard navigation\n *\n */\nexport const TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n  (\n    {\n      value,\n      placeholder,\n      onChangeText,\n      size = \"md\",\n      disabled = false,\n      errorMessage,\n      \"aria-label\": ariaLabel,\n      \"aria-describedby\": ariaDescribedBy,\n      id: externalId,\n      testID,\n    },\n    ref\n  ) => {\n    const { theme } = useDesignSystem();\n    const [isFocused, setIsFocused] = useState(false);\n\n    // Generate unique IDs for accessibility linking\n    const generatedId = useId();\n    const textareaId = externalId || generatedId;\n    const errorId = `${textareaId}-error`;\n\n    const isError = !!errorMessage;\n\n    // Resolve Config from Theme\n    const sizeStyles = theme.sizing.textarea(size);\n    const inputColors = theme.colors.control.input;\n\n    const handleFocus = () => {\n      if (!disabled) {\n        setIsFocused(true);\n      }\n    };\n\n    const handleBlur = () => {\n      if (!disabled) {\n        setIsFocused(false);\n      }\n    };\n\n    // Resolve background and border colors based on state\n    let backgroundColor = inputColors.bg;\n    let borderColor = inputColors.border;\n\n    if (disabled) {\n      backgroundColor = inputColors.bgDisable;\n      borderColor = inputColors.borderDisable;\n    } else if (isError) {\n      borderColor = theme.colors.border.alert;\n    } else if (isFocused) {\n      backgroundColor = theme.colors.control.focus.bg;\n      borderColor = inputColors.borderHover;\n    }\n\n    const textColor = disabled ? inputColors.textDisable : inputColors.text;\n    const placeholderColor = inputColors.placeholder;\n\n    // Build aria-describedby from error and external describedby\n    const describedByIds: string[] = [];\n    if (isError) {\n      describedByIds.push(errorId);\n    }\n    if (ariaDescribedBy) {\n      describedByIds.push(ariaDescribedBy);\n    }\n    const computedDescribedBy =\n      describedByIds.length > 0 ? describedByIds.join(\" \") : undefined;\n\n    // Focus outline color\n    const outlineColor =\n      isFocused && !disabled ? theme.colors.border.brand : undefined;\n\n    return (\n      <Box flexDirection=\"column\" gap={8} width=\"100%\">\n        <Box\n          backgroundColor={backgroundColor}\n          borderColor={borderColor}\n          borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n          borderRadius={theme.radius.button}\n          height={sizeStyles.height}\n          padding={paddingMap[size]}\n          flexDirection=\"row\"\n          alignItems=\"flex-start\"\n          gap={12}\n          position=\"relative\"\n          cursor={disabled ? \"not-allowed\" : \"text\"}\n          style={{\n            ...(outlineColor\n              ? {\n                  outline: `2px solid ${outlineColor}`,\n                  outlineOffset: \"-2px\",\n                }\n              : {}),\n          }}\n          hoverStyle={\n            !disabled && !isFocused && !isError\n              ? {\n                  backgroundColor: inputColors.bgHover,\n                }\n              : undefined\n          }\n        >\n          <Box flex={1} height=\"100%\">\n            <TextAreaPrimitive\n              ref={ref}\n              id={textareaId}\n              value={value}\n              placeholder={placeholder}\n              onChangeText={onChangeText}\n              onFocus={handleFocus}\n              onBlur={handleBlur}\n              disabled={disabled}\n              color={textColor}\n              fontSize={sizeStyles.fontSize}\n              placeholderTextColor={placeholderColor}\n              aria-label={ariaLabel}\n              aria-invalid={isError || undefined}\n              aria-disabled={disabled || undefined}\n              aria-describedby={computedDescribedBy}\n              data-testid={testID}\n            />\n          </Box>\n        </Box>\n\n        {isError && (\n          <Text\n            id={errorId}\n            role=\"alert\"\n            color={theme.colors.content.alert.primary}\n            fontSize={sizeStyles.fontSize - 2}\n          >\n            {errorMessage}\n          </Text>\n        )}\n      </Box>\n    );\n  }\n);\n\nTextArea.displayName = \"TextArea\";\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":["forwardRef","styled","jsx","styled","jsx","styled","jsx","styled","jsx","styled","jsx","forwardRef","styled","jsx","jsx","forwardRef"]}
+{"version":3,"sources":["../../src/TextArea.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx","../../../primitives-web/src/TextArea.tsx"],"sourcesContent":["import { useState, forwardRef } from \"react\";\nimport { Box, Text, TextAreaPrimitive } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem, useId } from \"@xsolla/xui-core\";\n\nconst paddingMap: Record<string, number> = {\n  xl: 16,\n  lg: 14,\n  md: 12,\n  sm: 10,\n  xs: 10,\n};\n\nexport interface TextAreaProps {\n  /** Current value of the textarea */\n  value?: string;\n  /** Placeholder text when empty */\n  placeholder?: string;\n  /** Event handler when the text changes */\n  onChangeText?: (text: string) => void;\n  /** Size of the textarea */\n  size?: \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n  /** Whether the textarea is disabled */\n  disabled?: boolean;\n  /** Error message displayed below the textarea */\n  errorMessage?: string;\n  /** Accessible label for screen readers */\n  \"aria-label\"?: string;\n  /** ID of element that describes this textarea */\n  \"aria-describedby\"?: string;\n  /** Unique identifier for the textarea element */\n  id?: string;\n  /** Test ID for testing frameworks */\n  testID?: string;\n}\n\n/**\n * TextArea - An accessible multi-line text input component\n *\n * Renders as a semantic `<textarea>` element with full ARIA support.\n * Supports labels, error states, and various sizes.\n *\n * ## Accessibility Features\n *\n * - **Semantic HTML**: Renders as a native `<textarea>` element\n * - **Keyboard Navigation**: Focusable via Tab\n * - **ARIA States**: Properly announces disabled and error states\n * - **Error Announcements**: Error messages use `role=\"alert\"` for immediate announcement\n * - **Focus Indicator**: Visible focus ring for keyboard navigation\n *\n */\nexport const TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n  (\n    {\n      value,\n      placeholder,\n      onChangeText,\n      size = \"md\",\n      disabled = false,\n      errorMessage,\n      \"aria-label\": ariaLabel,\n      \"aria-describedby\": ariaDescribedBy,\n      id: externalId,\n      testID,\n    },\n    ref\n  ) => {\n    const { theme } = useDesignSystem();\n    const [isFocused, setIsFocused] = useState(false);\n\n    // Generate unique IDs for accessibility linking\n    const generatedId = useId();\n    const textareaId = externalId || generatedId;\n    const errorId = `${textareaId}-error`;\n\n    const isError = !!errorMessage;\n\n    // Resolve Config from Theme\n    const sizeStyles = theme.sizing.textarea(size);\n    const inputColors = theme.colors.control.input;\n\n    const handleFocus = () => {\n      if (!disabled) {\n        setIsFocused(true);\n      }\n    };\n\n    const handleBlur = () => {\n      if (!disabled) {\n        setIsFocused(false);\n      }\n    };\n\n    // Resolve background and border colors based on state\n    let backgroundColor = inputColors.bg;\n    let borderColor = inputColors.border;\n\n    if (disabled) {\n      backgroundColor = inputColors.bgDisable;\n      borderColor = inputColors.borderDisable;\n    } else if (isError) {\n      borderColor = theme.colors.border.alert;\n    } else if (isFocused) {\n      backgroundColor = theme.colors.control.focus.bg;\n      borderColor = inputColors.borderHover;\n    }\n\n    const textColor = disabled ? inputColors.textDisable : inputColors.text;\n    const placeholderColor = inputColors.placeholder;\n\n    // Build aria-describedby from error and external describedby\n    const describedByIds: string[] = [];\n    if (isError) {\n      describedByIds.push(errorId);\n    }\n    if (ariaDescribedBy) {\n      describedByIds.push(ariaDescribedBy);\n    }\n    const computedDescribedBy =\n      describedByIds.length > 0 ? describedByIds.join(\" \") : undefined;\n\n    // Focus outline color\n    const outlineColor =\n      isFocused && !disabled ? theme.colors.border.brand : undefined;\n\n    return (\n      <Box flexDirection=\"column\" gap={8} width=\"100%\">\n        <Box\n          backgroundColor={backgroundColor}\n          borderColor={borderColor}\n          borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n          borderRadius={theme.radius.button}\n          height={sizeStyles.height}\n          padding={paddingMap[size]}\n          flexDirection=\"row\"\n          alignItems=\"flex-start\"\n          gap={12}\n          position=\"relative\"\n          cursor={disabled ? \"not-allowed\" : \"text\"}\n          style={{\n            ...(outlineColor\n              ? {\n                  outline: `2px solid ${outlineColor}`,\n                  outlineOffset: \"-2px\",\n                }\n              : {}),\n          }}\n          hoverStyle={\n            !disabled && !isFocused && !isError\n              ? {\n                  backgroundColor: inputColors.bgHover,\n                }\n              : undefined\n          }\n        >\n          <Box flex={1} height=\"100%\">\n            <TextAreaPrimitive\n              ref={ref}\n              id={textareaId}\n              value={value}\n              placeholder={placeholder}\n              onChangeText={onChangeText}\n              onFocus={handleFocus}\n              onBlur={handleBlur}\n              disabled={disabled}\n              color={textColor}\n              fontSize={sizeStyles.fontSize}\n              placeholderTextColor={placeholderColor}\n              aria-label={ariaLabel}\n              aria-invalid={isError || undefined}\n              aria-disabled={disabled || undefined}\n              aria-describedby={computedDescribedBy}\n              data-testid={testID}\n            />\n          </Box>\n        </Box>\n\n        {isError && (\n          <Text\n            id={errorId}\n            role=\"alert\"\n            color={theme.colors.content.alert.primary}\n            fontSize={sizeStyles.fontSize - 2}\n          >\n            {errorMessage}\n          </Text>\n        )}\n      </Box>\n    );\n  }\n);\n\nTextArea.displayName = \"TextArea\";\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 { 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":["forwardRef","styled","jsx","styled","jsx","jsx","forwardRef"]}