@xsolla/xui-input-color 0.196.1 → 0.197.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/package.json +3 -3
- package/web/index.js +34 -2
- package/web/index.js.map +1 -1
- package/web/index.mjs +34 -2
- package/web/index.mjs.map +1 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@xsolla/xui-input-color",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.197.0",
|
|
4
4
|
"main": "./web/index.js",
|
|
5
5
|
"module": "./web/index.mjs",
|
|
6
6
|
"types": "./web/index.d.ts",
|
|
@@ -13,8 +13,8 @@
|
|
|
13
13
|
"test:coverage": "vitest run --coverage"
|
|
14
14
|
},
|
|
15
15
|
"dependencies": {
|
|
16
|
-
"@xsolla/xui-core": "0.
|
|
17
|
-
"@xsolla/xui-primitives-core": "0.
|
|
16
|
+
"@xsolla/xui-core": "0.197.0",
|
|
17
|
+
"@xsolla/xui-primitives-core": "0.197.0"
|
|
18
18
|
},
|
|
19
19
|
"peerDependencies": {
|
|
20
20
|
"react": ">=16.8.0",
|
package/web/index.js
CHANGED
|
@@ -83,7 +83,11 @@ var ADDITIONAL_BLOCKED_PROPS = /* @__PURE__ */ new Set([
|
|
|
83
83
|
"fontSize",
|
|
84
84
|
"fontWeight",
|
|
85
85
|
"fontFamily",
|
|
86
|
-
"textDecoration"
|
|
86
|
+
"textDecoration",
|
|
87
|
+
// Cross-platform layout prop that Text consumes as CSS, never as an
|
|
88
|
+
// attribute. Pinned explicitly because it is now spread into the styled
|
|
89
|
+
// component rather than destructured away before it can reach the DOM.
|
|
90
|
+
"numberOfLines"
|
|
87
91
|
]);
|
|
88
92
|
function shouldForwardProp(key) {
|
|
89
93
|
if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;
|
|
@@ -290,6 +294,32 @@ Box.displayName = "Box";
|
|
|
290
294
|
|
|
291
295
|
// ../../foundation/primitives-web/src/Text.tsx
|
|
292
296
|
var import_styled_components2 = __toESM(require("styled-components"));
|
|
297
|
+
|
|
298
|
+
// ../../foundation/primitives-web/src/textTruncation.ts
|
|
299
|
+
var truncationStyles = (numberOfLines) => {
|
|
300
|
+
if (!numberOfLines || numberOfLines < 1) return "";
|
|
301
|
+
if (numberOfLines === 1) {
|
|
302
|
+
return `
|
|
303
|
+
display: block;
|
|
304
|
+
max-width: 100%;
|
|
305
|
+
min-width: 0;
|
|
306
|
+
overflow: hidden;
|
|
307
|
+
text-overflow: ellipsis;
|
|
308
|
+
white-space: nowrap;
|
|
309
|
+
`;
|
|
310
|
+
}
|
|
311
|
+
return `
|
|
312
|
+
display: -webkit-box;
|
|
313
|
+
-webkit-box-orient: vertical;
|
|
314
|
+
-webkit-line-clamp: ${numberOfLines};
|
|
315
|
+
line-clamp: ${numberOfLines};
|
|
316
|
+
max-width: 100%;
|
|
317
|
+
min-width: 0;
|
|
318
|
+
overflow: hidden;
|
|
319
|
+
`;
|
|
320
|
+
};
|
|
321
|
+
|
|
322
|
+
// ../../foundation/primitives-web/src/Text.tsx
|
|
293
323
|
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
294
324
|
var FilteredSpan = createFilteredElement("span");
|
|
295
325
|
var StyledText = (0, import_styled_components2.default)(FilteredSpan)`
|
|
@@ -301,6 +331,9 @@ var StyledText = (0, import_styled_components2.default)(FilteredSpan)`
|
|
|
301
331
|
white-space: ${(props) => props.whiteSpace || "normal"};
|
|
302
332
|
text-align: ${(props) => props.textAlign || "inherit"};
|
|
303
333
|
text-decoration: ${(props) => props.textDecoration || "none"};
|
|
334
|
+
|
|
335
|
+
/* Keep last: single-line truncation has to win over white-space above. */
|
|
336
|
+
${(props) => truncationStyles(props.numberOfLines)}
|
|
304
337
|
`;
|
|
305
338
|
var Text = ({
|
|
306
339
|
style,
|
|
@@ -309,7 +342,6 @@ var Text = ({
|
|
|
309
342
|
role,
|
|
310
343
|
testID,
|
|
311
344
|
"data-testid": dataTestId,
|
|
312
|
-
numberOfLines: _numberOfLines,
|
|
313
345
|
...props
|
|
314
346
|
}) => {
|
|
315
347
|
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
package/web/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/index.tsx","../../src/InputColor.tsx","../../../../foundation/primitives-web/src/Box.tsx","../../../../foundation/primitives-web/src/filterDOMProps.ts","../../../../../node_modules/@emotion/memoize/dist/memoize.esm.js","../../../../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js","../../../../foundation/primitives-web/src/Text.tsx","../../../../foundation/primitives-web/src/Input.tsx","../../../../foundation/primitives-web/src/index.tsx"],"sourcesContent":["export * from \"./InputColor\";\n","import React, { forwardRef, useEffect, useMemo, useRef, useState } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, InputPrimitive, isWeb } from \"@xsolla/xui-primitives\";\nimport {\n useResolvedTheme,\n useId,\n type ThemeOverrideProps,\n} from \"@xsolla/xui-core\";\n\n/**\n * Display variant of the InputColor control. Maps 1:1 to the Figma `Type` prop:\n * - `color` → \"Color only\" (swatch preview only, no editable field)\n * - `color-hex` → \"Color + HEX\" (swatch + editable hex field)\n * - `color-rgb` → \"Color + HSL/HSB/RGB\" (swatch + editable R/G/B channels)\n * - `hex` → \"HEX\" (editable hex field only)\n * - `rgb` → \"HSL/HSB/RGB\" (editable R/G/B channels only)\n */\nexport type InputColorType =\n | \"color\"\n | \"color-hex\"\n | \"color-rgb\"\n | \"hex\"\n | \"rgb\";\n\nexport type InputColorSize = \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n\nexport interface InputColorProps extends ThemeOverrideProps {\n /**\n * The current color value as a hex string (controlled mode), e.g. `#22A8C3`.\n * When `transparency` is enabled an 8-digit hex (`#RRGGBBAA`) is accepted.\n */\n value?: string;\n /**\n * The initial color value for uncontrolled usage. Defaults to `#000000`.\n */\n defaultValue?: string;\n /**\n * Event handler fired when the color changes. Always receives a hex string.\n */\n onChange?: (value: string) => void;\n /**\n * Fired when the swatch is activated. The swatch is only interactive when\n * `type=\"color\"` — its role is to open the parent ColorPicker panel. For all\n * other types the swatch is a decorative preview and this is never called.\n */\n onSwatchClick?: () => void;\n /**\n * Display variant of the control. Defaults to `color-hex`.\n */\n type?: InputColorType;\n /**\n * Enables the alpha channel. Adds an alpha field and splits the swatch to\n * preview the transparency against a checkerboard.\n */\n transparency?: boolean;\n /**\n * Property for changing the size of the control.\n */\n size?: InputColorSize;\n /**\n * Property for displaying a label above the control.\n */\n label?: string;\n /**\n * Unique identifier for the control. 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 testID?: string;\n}\n\ntype Rgba = { r: number; g: number; b: number; a: number };\n\nconst clamp = (n: number, min: number, max: number) =>\n Math.min(Math.max(n, min), max);\n\nconst HEX_CHARS = /[^0-9a-fA-F]/g;\n\n/** Parse a `#RGB`/`#RGBA`/`#RRGGBB`/`#RRGGBBAA` hex string into RGBA. */\nfunction hexToRgba(hex: string): Rgba {\n let h = (hex || \"\").replace(/^#/, \"\");\n if (h.length === 3 || h.length === 4) {\n h = h\n .split(\"\")\n .map((c) => c + c)\n .join(\"\");\n }\n const r = parseInt(h.slice(0, 2), 16);\n const g = parseInt(h.slice(2, 4), 16);\n const b = parseInt(h.slice(4, 6), 16);\n const a = h.length >= 8 ? parseInt(h.slice(6, 8), 16) / 255 : 1;\n return {\n r: Number.isNaN(r) ? 0 : r,\n g: Number.isNaN(g) ? 0 : g,\n b: Number.isNaN(b) ? 0 : b,\n a: Number.isNaN(a) ? 1 : parseFloat(a.toFixed(2)),\n };\n}\n\n/** Serialize RGBA back to an uppercase hex string. */\nfunction rgbaToHex({ r, g, b, a }: Rgba, includeAlpha: boolean): string {\n const toHex = (n: number) =>\n Math.round(clamp(n, 0, 255))\n .toString(16)\n .padStart(2, \"0\");\n const alpha = includeAlpha ? toHex(clamp(a, 0, 1) * 255) : \"\";\n return `#${toHex(r)}${toHex(g)}${toHex(b)}${alpha}`.toUpperCase();\n}\n\nconst SWATCH_SIZE: Record<InputColorSize, number> = {\n xl: 36,\n lg: 32,\n md: 26,\n sm: 20,\n xs: 14,\n};\n\n// Width of the trailing alpha (\"%\") segment per size, derived from the Figma\n// \"Color only / Transparency=True\" widths (total − swatch square − 2px gap).\nconst ALPHA_WIDTH: Record<InputColorSize, number> = {\n xl: 96,\n lg: 86,\n md: 77,\n sm: 67,\n xs: 58,\n};\n\n// Gap between the swatch and the value content inside a field, from the Figma\n// `input/<size>/frame/gap` tokens.\nconst FRAME_GAP: Record<InputColorSize, number> = {\n xl: 10,\n lg: 10,\n md: 8,\n sm: 6,\n xs: 4,\n};\n\n// CSS checkerboard, only visible behind partially-transparent colors.\nconst CHECKERBOARD =\n \"conic-gradient(rgba(0,0,0,0.45) 25%, transparent 0 50%, rgba(0,0,0,0.45) 0 75%, transparent 0)\";\n\ntype Corner = \"left\" | \"right\" | \"middle\" | \"all\";\n\nfunction cornerRadii(corner: Corner, radius: number) {\n const map = {\n all: [radius, radius, radius, radius],\n left: [radius, 0, 0, radius],\n right: [0, radius, radius, 0],\n middle: [0, 0, 0, 0],\n } as const;\n const [tl, tr, br, bl] = map[corner];\n return {\n borderTopLeftRadius: tl,\n borderTopRightRadius: tr,\n borderBottomRightRadius: br,\n borderBottomLeftRadius: bl,\n };\n}\n\n/* -------------------------------------------------------------------------- */\n/* Color swatch */\n/* -------------------------------------------------------------------------- */\n\nfunction ColorSwatch({\n size,\n rgba,\n transparency,\n borderColor,\n}: {\n size: number;\n rgba: Rgba;\n transparency: boolean;\n borderColor: string;\n}) {\n const solid = `rgb(${rgba.r}, ${rgba.g}, ${rgba.b})`;\n const withAlpha = `rgba(${rgba.r}, ${rgba.g}, ${rgba.b}, ${rgba.a})`;\n return (\n <Box\n width={size}\n height={size}\n position=\"relative\"\n borderColor={borderColor}\n borderWidth={1}\n style={{ borderRadius: 4, overflow: \"hidden\" }}\n data-testid=\"input-color__swatch-preview\"\n >\n {transparency && (\n <Box\n aria-hidden\n style={{\n position: \"absolute\",\n inset: 0,\n backgroundImage: CHECKERBOARD,\n backgroundSize: \"8px 8px\",\n opacity: 0.2,\n }}\n />\n )}\n {transparency ? (\n <>\n <Box\n style={{\n position: \"absolute\",\n top: 0,\n bottom: 0,\n left: 0,\n right: \"50%\",\n backgroundColor: solid,\n }}\n />\n <Box\n style={{\n position: \"absolute\",\n top: 0,\n bottom: 0,\n left: \"50%\",\n right: 0,\n backgroundColor: withAlpha,\n }}\n />\n </>\n ) : (\n <Box\n style={{ position: \"absolute\", inset: 0, backgroundColor: solid }}\n />\n )}\n </Box>\n );\n}\n\n/* -------------------------------------------------------------------------- */\n/* Editable text field */\n/* -------------------------------------------------------------------------- */\n\ntype TextFieldProps = {\n value: string;\n onCommit: (text: string) => void;\n sanitize: (text: string) => string;\n maxLength?: number;\n textAlign?: \"left\" | \"center\";\n color: string;\n fontSize: number;\n fontFamily: string;\n ariaLabel: string;\n inputMode?: \"numeric\" | \"text\";\n /** When set, Arrow Up/Down step the numeric value within [min, max]. */\n step?: { min: number; max: number };\n testID?: string;\n onFocus: () => void;\n onBlur: () => void;\n};\n\n/**\n * A controlled-but-buffered text field. Keeps the raw keystrokes locally so the\n * user can type freely, but resyncs to the canonical `value` on prop change and\n * on blur.\n */\nfunction TextField({\n value,\n onCommit,\n sanitize,\n maxLength,\n textAlign = \"left\",\n color,\n fontSize,\n fontFamily,\n ariaLabel,\n inputMode = \"text\",\n step,\n testID,\n onFocus,\n onBlur,\n}: TextFieldProps) {\n const [text, setText] = useState(value);\n // While the field is focused we keep the user's raw keystrokes and never\n // overwrite them with the canonical (normalized/expanded/clamped) value —\n // that resync is what caused the field to \"auto-fill\" mid-typing. We only\n // resync from `value` for external changes (unfocused) and on blur.\n const isFocusedRef = useRef(false);\n\n useEffect(() => {\n if (!isFocusedRef.current) setText(value);\n }, [value]);\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const next = sanitize(e.target.value);\n setText(next);\n onCommit(next);\n };\n\n const handleFocus = () => {\n isFocusedRef.current = true;\n onFocus();\n };\n\n const handleBlur = () => {\n isFocusedRef.current = false;\n setText(value);\n onBlur();\n };\n\n // Enter commits/normalizes by blurring (the value already propagates live).\n // Arrow Up/Down step numeric fields by ±1 within their range.\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"Enter\") {\n e.currentTarget.blur();\n return;\n }\n if (step && (e.key === \"ArrowUp\" || e.key === \"ArrowDown\")) {\n e.preventDefault();\n const current = Number.parseInt(text, 10);\n const base = Number.isNaN(current) ? 0 : current;\n const next = String(\n clamp(base + (e.key === \"ArrowUp\" ? 1 : -1), step.min, step.max)\n );\n setText(next);\n onCommit(next);\n }\n };\n\n return (\n <Box flex={1} height=\"100%\" justifyContent=\"center\">\n <InputPrimitive\n value={text}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n type=\"text\"\n inputMode={inputMode}\n maxLength={maxLength}\n color={color}\n fontSize={fontSize}\n fontFamily={fontFamily}\n aria-label={ariaLabel}\n data-testid={testID}\n style={textAlign === \"center\" ? { textAlign: \"center\" } : undefined}\n />\n </Box>\n );\n}\n\n/* -------------------------------------------------------------------------- */\n/* InputColor */\n/* -------------------------------------------------------------------------- */\n\nconst CHANNEL_LABEL: Record<\"red\" | \"green\" | \"blue\" | \"alpha\", string> = {\n red: \"Red channel\",\n green: \"Green channel\",\n blue: \"Blue channel\",\n alpha: \"Opacity percentage\",\n};\n\nexport const InputColor = forwardRef<HTMLDivElement, InputColorProps>(\n (\n {\n value,\n defaultValue,\n onChange,\n onSwatchClick,\n type = \"color-hex\",\n transparency = false,\n size = \"md\",\n label,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n themeMode,\n themeProductContext,\n },\n ref\n ) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n // Mirrors the Input \"useUpdatableState\" pattern: always keep an internal\n // value so the swatch and fields reflect edits immediately — even if a\n // controlled parent doesn't echo onChange back — and sync from `value`\n // whenever it changes externally.\n const [internalValue, setInternalValue] = useState(\n value ?? defaultValue ?? \"#000000\"\n );\n useEffect(() => {\n if (value !== undefined) setInternalValue(value);\n }, [value]);\n const currentValue = internalValue;\n\n // Which segment currently owns focus (for outline styling).\n const [focusedKey, setFocusedKey] = useState<string | null>(null);\n\n // Polite live-region message announced to screen readers on each edit.\n const [liveMessage, setLiveMessage] = useState(\"\");\n\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-color-${safeId}`;\n const labelId = `${inputId}-label`;\n\n const rgba = useMemo(() => hexToRgba(currentValue), [currentValue]);\n\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n const borderRadius = theme.shape.input[size].borderRadius;\n const swatchSize = SWATCH_SIZE[size];\n\n const showSwatch =\n type === \"color\" || type === \"color-hex\" || type === \"color-rgb\";\n const isHex = type === \"hex\" || type === \"color-hex\";\n const isRgb = type === \"rgb\" || type === \"color-rgb\";\n const isSwatchOnly = type === \"color\";\n\n const textColor = inputColors.text;\n const placeholderColor = inputColors.placeholder;\n const fontFamily = theme.fonts.body;\n\n const emit = (next: string) => {\n setInternalValue(next);\n setLiveMessage(`Color updated to ${next}`);\n onChange?.(next);\n };\n\n const emitFromRgba = (next: Rgba) => emit(rgbaToHex(next, transparency));\n\n /* ---- per-segment visual state ---- */\n const segmentVisuals = (focused: boolean) => {\n let backgroundColor = inputColors.bg;\n let borderColor = inputColors.border;\n let outlineColor: string | undefined;\n if (focused) {\n backgroundColor = theme.colors.control.focus.bg;\n outlineColor = theme.colors.border.brand;\n }\n return { backgroundColor, borderColor, outlineColor };\n };\n\n const renderSegment = (\n key: string,\n corner: Corner,\n content: React.ReactNode,\n opts: { flex?: number; width?: number; square?: boolean } = {}\n ) => {\n const focused = focusedKey === key;\n const { backgroundColor, borderColor, outlineColor } =\n segmentVisuals(focused);\n const width = opts.square ? sizeStyles.height : opts.width;\n return (\n <Box\n key={key}\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={1}\n height={sizeStyles.height}\n width={width}\n flex={opts.flex}\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent={opts.square ? \"center\" : \"flex-start\"}\n gap={FRAME_GAP[size]}\n paddingHorizontal={opts.square ? 0 : sizeStyles.paddingHorizontal}\n position=\"relative\"\n style={{\n ...cornerRadii(corner, borderRadius),\n minWidth: opts.square ? undefined : 40,\n ...(outlineColor && isWeb\n ? { outline: `1px solid ${outlineColor}`, outlineOffset: \"-1px\" }\n : outlineColor && !isWeb\n ? { borderColor: outlineColor }\n : {}),\n }}\n hoverStyle={\n !focused\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n {content}\n </Box>\n );\n };\n\n /* ---- swatch node ----\n * Per the Figma spec the swatch is only interactive when type=\"color\": it\n * acts as the trigger that opens the parent ColorPicker panel (via\n * onSwatchClick). For every other type it is a decorative preview. */\n const swatchVisual = (\n <ColorSwatch\n size={swatchSize}\n rgba={rgba}\n transparency={transparency}\n borderColor={theme.colors.border.secondary}\n />\n );\n const swatchNode = isSwatchOnly ? (\n <Box\n as=\"button\"\n type=\"button\"\n onPress={() => onSwatchClick?.()}\n cursor=\"pointer\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n padding={0}\n alignItems=\"center\"\n justifyContent=\"center\"\n aria-label=\"Open color picker\"\n data-testid=\"input-color__swatch\"\n onFocus={() => setFocusedKey(\"swatch\")}\n onBlur={() => setFocusedKey(null)}\n >\n {swatchVisual}\n </Box>\n ) : (\n <Box\n aria-hidden\n alignItems=\"center\"\n justifyContent=\"center\"\n data-testid=\"input-color__swatch-decorative\"\n >\n {swatchVisual}\n </Box>\n );\n\n /* ---- hex field content ---- */\n const hexContent = (\n <>\n <Text\n color={placeholderColor}\n fontSize={sizeStyles.fontSize}\n style={{ lineHeight: `${sizeStyles.lineHeight}px` }}\n >\n #\n </Text>\n <TextField\n // Hex field is always the RGB triplet; alpha is edited via its own\n // \"%\" segment, so the value never carries an alpha pair here.\n value={rgbaToHex(rgba, false).replace(/^#/, \"\")}\n sanitize={(t) => t.replace(HEX_CHARS, \"\").toUpperCase()}\n maxLength={6}\n onCommit={(digits) => {\n if (digits.length === 3 || digits.length === 6) {\n const next = hexToRgba(`#${digits}`);\n emitFromRgba({ ...next, a: rgba.a });\n }\n }}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n fontFamily={fontFamily}\n ariaLabel=\"Hex color value\"\n testID=\"input-color__hex\"\n onFocus={() => setFocusedKey(\"hex\")}\n onBlur={() => setFocusedKey(null)}\n />\n </>\n );\n\n /* ---- channel field ---- */\n const channelContent = (channel: \"red\" | \"green\" | \"blue\" | \"alpha\") => {\n const isAlpha = channel === \"alpha\";\n const display = isAlpha\n ? Math.round(rgba.a * 100)\n : rgba[channel[0] as \"r\" | \"g\" | \"b\"];\n const field = (\n <TextField\n value={String(display)}\n inputMode=\"numeric\"\n sanitize={(t) => t.replace(/[^0-9]/g, \"\")}\n maxLength={3}\n step={isAlpha ? { min: 0, max: 100 } : { min: 0, max: 255 }}\n onCommit={(t) => {\n if (t === \"\") return;\n const num = parseInt(t, 10);\n if (Number.isNaN(num)) return;\n if (isAlpha) {\n emitFromRgba({ ...rgba, a: clamp(num, 0, 100) / 100 });\n } else {\n const k = channel[0] as \"r\" | \"g\" | \"b\";\n emitFromRgba({ ...rgba, [k]: clamp(num, 0, 255) });\n }\n }}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n fontFamily={fontFamily}\n ariaLabel={CHANNEL_LABEL[channel]}\n testID={`input-color__channel-${channel}`}\n onFocus={() => setFocusedKey(`channel-${channel}`)}\n onBlur={() => setFocusedKey(null)}\n />\n );\n if (!isAlpha) return field;\n return (\n <>\n {field}\n <Text\n color={placeholderColor}\n fontSize={sizeStyles.fontSize}\n style={{ lineHeight: `${sizeStyles.lineHeight}px` }}\n >\n %\n </Text>\n </>\n );\n };\n\n /* ---- assemble control by type ----\n * Build an ordered list of cells, then enabling `transparency` simply\n * appends a trailing alpha (\"%\") cell. Corners are rounded across the whole\n * list: a single cell is fully rounded; otherwise first → left, last →\n * right, the rest square. */\n type Cell = {\n key: string;\n content: React.ReactNode;\n flex?: number;\n width?: number;\n square?: boolean;\n };\n const cells: Cell[] = [];\n\n if (isSwatchOnly) {\n cells.push({ key: \"swatch\", content: swatchNode, square: true });\n } else if (isHex) {\n cells.push({\n key: \"field\",\n flex: 1,\n content: (\n <>\n {showSwatch && swatchNode}\n <Box flex={1} flexDirection=\"row\" alignItems=\"center\" gap={4}>\n {hexContent}\n </Box>\n </>\n ),\n });\n } else if (isRgb) {\n if (showSwatch) {\n cells.push({ key: \"swatch\", content: swatchNode, square: true });\n }\n ([\"red\", \"green\", \"blue\"] as const).forEach((channel) =>\n cells.push({\n key: `channel-${channel}`,\n content: channelContent(channel),\n flex: 1,\n })\n );\n }\n\n if (transparency) {\n cells.push({\n key: \"channel-alpha\",\n content: channelContent(\"alpha\"),\n width: ALPHA_WIDTH[size],\n });\n }\n\n const control = cells.map((cell, i) => {\n const corner: Corner =\n cells.length === 1\n ? \"all\"\n : i === 0\n ? \"left\"\n : i === cells.length - 1\n ? \"right\"\n : \"middle\";\n return renderSegment(cell.key, corner, cell.content, {\n flex: cell.flex,\n width: cell.width,\n square: cell.square,\n });\n });\n\n return (\n <Box\n ref={ref}\n flexDirection=\"column\"\n gap={sizeStyles.fieldGap}\n width={isSwatchOnly ? undefined : \"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 flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n width={isSwatchOnly ? undefined : \"100%\"}\n role=\"group\"\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n >\n {control}\n </Box>\n {isWeb && (\n <Box\n role=\"status\"\n aria-live=\"polite\"\n data-testid=\"input-color__live\"\n style={{\n position: \"absolute\",\n width: 1,\n height: 1,\n padding: 0,\n margin: -1,\n overflow: \"hidden\",\n clip: \"rect(0 0 0 0)\",\n whiteSpace: \"nowrap\",\n border: 0,\n }}\n >\n {liveMessage}\n </Box>\n )}\n </Box>\n );\n }\n);\n\nInputColor.displayName = \"InputColor\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<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 max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\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 onError,\n onLoad,\n type,\n disabled,\n id,\n testID,\n \"data-testid\": dataTestId,\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 onError={onError}\n onLoad={onLoad}\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 ...props.style,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n elementType={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 data-testid={dataTestId || testID}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport isPropValid from \"@emotion/is-prop-valid\";\n\n// Props that @emotion/is-prop-valid incorrectly treats as valid HTML.\n// These are React Native or component-specific props that match\n// valid HTML patterns (on* event handlers, SVG attributes).\nexport const ADDITIONAL_BLOCKED_PROPS = new Set([\n // RN-only event handlers (pass isPropValid's on* pattern)\n \"onPress\",\n \"onChangeText\",\n \"onLayout\",\n \"onMoveShouldSetResponder\",\n \"onResponderGrant\",\n \"onResponderMove\",\n \"onResponderRelease\",\n \"onResponderTerminate\",\n // SVG attributes that pass isPropValid\n \"strokeWidth\",\n // CSS properties that pass isPropValid but are used as component props\n \"overflow\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n]);\n\nfunction shouldForwardProp(key: string): boolean {\n if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;\n return isPropValid(key);\n}\n\n/**\n * Creates a React component that renders the given HTML tag\n * but filters out non-HTML props before they reach the DOM.\n *\n * Uses @emotion/is-prop-valid (same library styled-components v4\n * uses internally) to automatically block invalid HTML attributes,\n * plus a small blocklist for false positives (RN on* handlers, SVG attrs).\n *\n * Usage: `const FilteredDiv = createFilteredElement(\"div\");`\n * Then: `const StyledBox = styled(FilteredDiv)<BoxProps>\\`...\\`;`\n *\n * styled-components can still read ALL props for CSS interpolation,\n * but only valid HTML attributes are forwarded to the DOM element.\n */\nexport function createFilteredElement(defaultTag: string) {\n const Component = React.forwardRef<HTMLElement, Record<string, unknown>>(\n ({ children, elementType, ...props }, ref) => {\n const Tag = (elementType as string) || defaultTag;\n const htmlProps: Record<string, unknown> = {};\n for (const key of Object.keys(props)) {\n if (shouldForwardProp(key)) {\n htmlProps[key] = props[key];\n }\n }\n return React.createElement(\n Tag,\n { ref, ...htmlProps },\n children as React.ReactNode\n );\n }\n );\n Component.displayName = `Filtered(${defaultTag})`;\n return Component;\n}\n","function memoize(fn) {\n var cache = {};\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport default memoize;\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|inert|itemProp|itemScope|itemType|itemID|itemRef|on|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar index = memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport default index;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredSpan = createFilteredElement(\"span\");\n\nconst StyledText = styled(FilteredSpan)<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n testID,\n \"data-testid\": dataTestId,\n numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n data-testid={dataTestId || testID}\n />\n );\n};\n","import React, { forwardRef } from \"react\";\nimport styled from \"styled-components\";\nimport { InputPrimitiveProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredInput = createFilteredElement(\"input\");\n\nconst StyledInput = styled(FilteredInput)<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: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\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 /* Override browser autofill background */\n &:-webkit-autofill,\n &:-webkit-autofill:hover,\n &:-webkit-autofill:focus,\n &:-webkit-autofill:active {\n -webkit-box-shadow: 0 0 0 1000px transparent inset !important;\n -webkit-background-clip: text !important;\n -webkit-text-fill-color: ${(props) => props.color || \"inherit\"} !important;\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 fontFamily,\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 testID,\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 return (\n <StyledInput\n ref={ref}\n id={id}\n value={value}\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 fontFamily={fontFamily}\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 || testID}\n {...rest}\n />\n );\n }\n);\n\nInputPrimitive.displayName = \"InputPrimitive\";\n","export * from \"./Box\";\nexport * from \"./Text\";\nexport * from \"./Spinner\";\nexport * from \"./Icon\";\nexport * from \"./Divider\";\nexport * from \"./Input\";\nexport * from \"./TextArea\";\nexport * from \"./LinearGradient\";\n\nexport const isWeb = true;\nexport const isNative = false;\n"],"mappings":"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","names":["import_react","import_react","React","styled","React","import_styled_components","import_jsx_runtime","styled","import_react","import_styled_components","import_jsx_runtime","styled","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../../src/index.tsx","../../src/InputColor.tsx","../../../../foundation/primitives-web/src/Box.tsx","../../../../foundation/primitives-web/src/filterDOMProps.ts","../../../../../node_modules/@emotion/memoize/dist/memoize.esm.js","../../../../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js","../../../../foundation/primitives-web/src/Text.tsx","../../../../foundation/primitives-web/src/textTruncation.ts","../../../../foundation/primitives-web/src/Input.tsx","../../../../foundation/primitives-web/src/index.tsx"],"sourcesContent":["export * from \"./InputColor\";\n","import React, { forwardRef, useEffect, useMemo, useRef, useState } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, InputPrimitive, isWeb } from \"@xsolla/xui-primitives\";\nimport {\n useResolvedTheme,\n useId,\n type ThemeOverrideProps,\n} from \"@xsolla/xui-core\";\n\n/**\n * Display variant of the InputColor control. Maps 1:1 to the Figma `Type` prop:\n * - `color` → \"Color only\" (swatch preview only, no editable field)\n * - `color-hex` → \"Color + HEX\" (swatch + editable hex field)\n * - `color-rgb` → \"Color + HSL/HSB/RGB\" (swatch + editable R/G/B channels)\n * - `hex` → \"HEX\" (editable hex field only)\n * - `rgb` → \"HSL/HSB/RGB\" (editable R/G/B channels only)\n */\nexport type InputColorType =\n | \"color\"\n | \"color-hex\"\n | \"color-rgb\"\n | \"hex\"\n | \"rgb\";\n\nexport type InputColorSize = \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n\nexport interface InputColorProps extends ThemeOverrideProps {\n /**\n * The current color value as a hex string (controlled mode), e.g. `#22A8C3`.\n * When `transparency` is enabled an 8-digit hex (`#RRGGBBAA`) is accepted.\n */\n value?: string;\n /**\n * The initial color value for uncontrolled usage. Defaults to `#000000`.\n */\n defaultValue?: string;\n /**\n * Event handler fired when the color changes. Always receives a hex string.\n */\n onChange?: (value: string) => void;\n /**\n * Fired when the swatch is activated. The swatch is only interactive when\n * `type=\"color\"` — its role is to open the parent ColorPicker panel. For all\n * other types the swatch is a decorative preview and this is never called.\n */\n onSwatchClick?: () => void;\n /**\n * Display variant of the control. Defaults to `color-hex`.\n */\n type?: InputColorType;\n /**\n * Enables the alpha channel. Adds an alpha field and splits the swatch to\n * preview the transparency against a checkerboard.\n */\n transparency?: boolean;\n /**\n * Property for changing the size of the control.\n */\n size?: InputColorSize;\n /**\n * Property for displaying a label above the control.\n */\n label?: string;\n /**\n * Unique identifier for the control. 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 testID?: string;\n}\n\ntype Rgba = { r: number; g: number; b: number; a: number };\n\nconst clamp = (n: number, min: number, max: number) =>\n Math.min(Math.max(n, min), max);\n\nconst HEX_CHARS = /[^0-9a-fA-F]/g;\n\n/** Parse a `#RGB`/`#RGBA`/`#RRGGBB`/`#RRGGBBAA` hex string into RGBA. */\nfunction hexToRgba(hex: string): Rgba {\n let h = (hex || \"\").replace(/^#/, \"\");\n if (h.length === 3 || h.length === 4) {\n h = h\n .split(\"\")\n .map((c) => c + c)\n .join(\"\");\n }\n const r = parseInt(h.slice(0, 2), 16);\n const g = parseInt(h.slice(2, 4), 16);\n const b = parseInt(h.slice(4, 6), 16);\n const a = h.length >= 8 ? parseInt(h.slice(6, 8), 16) / 255 : 1;\n return {\n r: Number.isNaN(r) ? 0 : r,\n g: Number.isNaN(g) ? 0 : g,\n b: Number.isNaN(b) ? 0 : b,\n a: Number.isNaN(a) ? 1 : parseFloat(a.toFixed(2)),\n };\n}\n\n/** Serialize RGBA back to an uppercase hex string. */\nfunction rgbaToHex({ r, g, b, a }: Rgba, includeAlpha: boolean): string {\n const toHex = (n: number) =>\n Math.round(clamp(n, 0, 255))\n .toString(16)\n .padStart(2, \"0\");\n const alpha = includeAlpha ? toHex(clamp(a, 0, 1) * 255) : \"\";\n return `#${toHex(r)}${toHex(g)}${toHex(b)}${alpha}`.toUpperCase();\n}\n\nconst SWATCH_SIZE: Record<InputColorSize, number> = {\n xl: 36,\n lg: 32,\n md: 26,\n sm: 20,\n xs: 14,\n};\n\n// Width of the trailing alpha (\"%\") segment per size, derived from the Figma\n// \"Color only / Transparency=True\" widths (total − swatch square − 2px gap).\nconst ALPHA_WIDTH: Record<InputColorSize, number> = {\n xl: 96,\n lg: 86,\n md: 77,\n sm: 67,\n xs: 58,\n};\n\n// Gap between the swatch and the value content inside a field, from the Figma\n// `input/<size>/frame/gap` tokens.\nconst FRAME_GAP: Record<InputColorSize, number> = {\n xl: 10,\n lg: 10,\n md: 8,\n sm: 6,\n xs: 4,\n};\n\n// CSS checkerboard, only visible behind partially-transparent colors.\nconst CHECKERBOARD =\n \"conic-gradient(rgba(0,0,0,0.45) 25%, transparent 0 50%, rgba(0,0,0,0.45) 0 75%, transparent 0)\";\n\ntype Corner = \"left\" | \"right\" | \"middle\" | \"all\";\n\nfunction cornerRadii(corner: Corner, radius: number) {\n const map = {\n all: [radius, radius, radius, radius],\n left: [radius, 0, 0, radius],\n right: [0, radius, radius, 0],\n middle: [0, 0, 0, 0],\n } as const;\n const [tl, tr, br, bl] = map[corner];\n return {\n borderTopLeftRadius: tl,\n borderTopRightRadius: tr,\n borderBottomRightRadius: br,\n borderBottomLeftRadius: bl,\n };\n}\n\n/* -------------------------------------------------------------------------- */\n/* Color swatch */\n/* -------------------------------------------------------------------------- */\n\nfunction ColorSwatch({\n size,\n rgba,\n transparency,\n borderColor,\n}: {\n size: number;\n rgba: Rgba;\n transparency: boolean;\n borderColor: string;\n}) {\n const solid = `rgb(${rgba.r}, ${rgba.g}, ${rgba.b})`;\n const withAlpha = `rgba(${rgba.r}, ${rgba.g}, ${rgba.b}, ${rgba.a})`;\n return (\n <Box\n width={size}\n height={size}\n position=\"relative\"\n borderColor={borderColor}\n borderWidth={1}\n style={{ borderRadius: 4, overflow: \"hidden\" }}\n data-testid=\"input-color__swatch-preview\"\n >\n {transparency && (\n <Box\n aria-hidden\n style={{\n position: \"absolute\",\n inset: 0,\n backgroundImage: CHECKERBOARD,\n backgroundSize: \"8px 8px\",\n opacity: 0.2,\n }}\n />\n )}\n {transparency ? (\n <>\n <Box\n style={{\n position: \"absolute\",\n top: 0,\n bottom: 0,\n left: 0,\n right: \"50%\",\n backgroundColor: solid,\n }}\n />\n <Box\n style={{\n position: \"absolute\",\n top: 0,\n bottom: 0,\n left: \"50%\",\n right: 0,\n backgroundColor: withAlpha,\n }}\n />\n </>\n ) : (\n <Box\n style={{ position: \"absolute\", inset: 0, backgroundColor: solid }}\n />\n )}\n </Box>\n );\n}\n\n/* -------------------------------------------------------------------------- */\n/* Editable text field */\n/* -------------------------------------------------------------------------- */\n\ntype TextFieldProps = {\n value: string;\n onCommit: (text: string) => void;\n sanitize: (text: string) => string;\n maxLength?: number;\n textAlign?: \"left\" | \"center\";\n color: string;\n fontSize: number;\n fontFamily: string;\n ariaLabel: string;\n inputMode?: \"numeric\" | \"text\";\n /** When set, Arrow Up/Down step the numeric value within [min, max]. */\n step?: { min: number; max: number };\n testID?: string;\n onFocus: () => void;\n onBlur: () => void;\n};\n\n/**\n * A controlled-but-buffered text field. Keeps the raw keystrokes locally so the\n * user can type freely, but resyncs to the canonical `value` on prop change and\n * on blur.\n */\nfunction TextField({\n value,\n onCommit,\n sanitize,\n maxLength,\n textAlign = \"left\",\n color,\n fontSize,\n fontFamily,\n ariaLabel,\n inputMode = \"text\",\n step,\n testID,\n onFocus,\n onBlur,\n}: TextFieldProps) {\n const [text, setText] = useState(value);\n // While the field is focused we keep the user's raw keystrokes and never\n // overwrite them with the canonical (normalized/expanded/clamped) value —\n // that resync is what caused the field to \"auto-fill\" mid-typing. We only\n // resync from `value` for external changes (unfocused) and on blur.\n const isFocusedRef = useRef(false);\n\n useEffect(() => {\n if (!isFocusedRef.current) setText(value);\n }, [value]);\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const next = sanitize(e.target.value);\n setText(next);\n onCommit(next);\n };\n\n const handleFocus = () => {\n isFocusedRef.current = true;\n onFocus();\n };\n\n const handleBlur = () => {\n isFocusedRef.current = false;\n setText(value);\n onBlur();\n };\n\n // Enter commits/normalizes by blurring (the value already propagates live).\n // Arrow Up/Down step numeric fields by ±1 within their range.\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"Enter\") {\n e.currentTarget.blur();\n return;\n }\n if (step && (e.key === \"ArrowUp\" || e.key === \"ArrowDown\")) {\n e.preventDefault();\n const current = Number.parseInt(text, 10);\n const base = Number.isNaN(current) ? 0 : current;\n const next = String(\n clamp(base + (e.key === \"ArrowUp\" ? 1 : -1), step.min, step.max)\n );\n setText(next);\n onCommit(next);\n }\n };\n\n return (\n <Box flex={1} height=\"100%\" justifyContent=\"center\">\n <InputPrimitive\n value={text}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n type=\"text\"\n inputMode={inputMode}\n maxLength={maxLength}\n color={color}\n fontSize={fontSize}\n fontFamily={fontFamily}\n aria-label={ariaLabel}\n data-testid={testID}\n style={textAlign === \"center\" ? { textAlign: \"center\" } : undefined}\n />\n </Box>\n );\n}\n\n/* -------------------------------------------------------------------------- */\n/* InputColor */\n/* -------------------------------------------------------------------------- */\n\nconst CHANNEL_LABEL: Record<\"red\" | \"green\" | \"blue\" | \"alpha\", string> = {\n red: \"Red channel\",\n green: \"Green channel\",\n blue: \"Blue channel\",\n alpha: \"Opacity percentage\",\n};\n\nexport const InputColor = forwardRef<HTMLDivElement, InputColorProps>(\n (\n {\n value,\n defaultValue,\n onChange,\n onSwatchClick,\n type = \"color-hex\",\n transparency = false,\n size = \"md\",\n label,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n themeMode,\n themeProductContext,\n },\n ref\n ) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n // Mirrors the Input \"useUpdatableState\" pattern: always keep an internal\n // value so the swatch and fields reflect edits immediately — even if a\n // controlled parent doesn't echo onChange back — and sync from `value`\n // whenever it changes externally.\n const [internalValue, setInternalValue] = useState(\n value ?? defaultValue ?? \"#000000\"\n );\n useEffect(() => {\n if (value !== undefined) setInternalValue(value);\n }, [value]);\n const currentValue = internalValue;\n\n // Which segment currently owns focus (for outline styling).\n const [focusedKey, setFocusedKey] = useState<string | null>(null);\n\n // Polite live-region message announced to screen readers on each edit.\n const [liveMessage, setLiveMessage] = useState(\"\");\n\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-color-${safeId}`;\n const labelId = `${inputId}-label`;\n\n const rgba = useMemo(() => hexToRgba(currentValue), [currentValue]);\n\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n const borderRadius = theme.shape.input[size].borderRadius;\n const swatchSize = SWATCH_SIZE[size];\n\n const showSwatch =\n type === \"color\" || type === \"color-hex\" || type === \"color-rgb\";\n const isHex = type === \"hex\" || type === \"color-hex\";\n const isRgb = type === \"rgb\" || type === \"color-rgb\";\n const isSwatchOnly = type === \"color\";\n\n const textColor = inputColors.text;\n const placeholderColor = inputColors.placeholder;\n const fontFamily = theme.fonts.body;\n\n const emit = (next: string) => {\n setInternalValue(next);\n setLiveMessage(`Color updated to ${next}`);\n onChange?.(next);\n };\n\n const emitFromRgba = (next: Rgba) => emit(rgbaToHex(next, transparency));\n\n /* ---- per-segment visual state ---- */\n const segmentVisuals = (focused: boolean) => {\n let backgroundColor = inputColors.bg;\n let borderColor = inputColors.border;\n let outlineColor: string | undefined;\n if (focused) {\n backgroundColor = theme.colors.control.focus.bg;\n outlineColor = theme.colors.border.brand;\n }\n return { backgroundColor, borderColor, outlineColor };\n };\n\n const renderSegment = (\n key: string,\n corner: Corner,\n content: React.ReactNode,\n opts: { flex?: number; width?: number; square?: boolean } = {}\n ) => {\n const focused = focusedKey === key;\n const { backgroundColor, borderColor, outlineColor } =\n segmentVisuals(focused);\n const width = opts.square ? sizeStyles.height : opts.width;\n return (\n <Box\n key={key}\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={1}\n height={sizeStyles.height}\n width={width}\n flex={opts.flex}\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent={opts.square ? \"center\" : \"flex-start\"}\n gap={FRAME_GAP[size]}\n paddingHorizontal={opts.square ? 0 : sizeStyles.paddingHorizontal}\n position=\"relative\"\n style={{\n ...cornerRadii(corner, borderRadius),\n minWidth: opts.square ? undefined : 40,\n ...(outlineColor && isWeb\n ? { outline: `1px solid ${outlineColor}`, outlineOffset: \"-1px\" }\n : outlineColor && !isWeb\n ? { borderColor: outlineColor }\n : {}),\n }}\n hoverStyle={\n !focused\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n {content}\n </Box>\n );\n };\n\n /* ---- swatch node ----\n * Per the Figma spec the swatch is only interactive when type=\"color\": it\n * acts as the trigger that opens the parent ColorPicker panel (via\n * onSwatchClick). For every other type it is a decorative preview. */\n const swatchVisual = (\n <ColorSwatch\n size={swatchSize}\n rgba={rgba}\n transparency={transparency}\n borderColor={theme.colors.border.secondary}\n />\n );\n const swatchNode = isSwatchOnly ? (\n <Box\n as=\"button\"\n type=\"button\"\n onPress={() => onSwatchClick?.()}\n cursor=\"pointer\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n padding={0}\n alignItems=\"center\"\n justifyContent=\"center\"\n aria-label=\"Open color picker\"\n data-testid=\"input-color__swatch\"\n onFocus={() => setFocusedKey(\"swatch\")}\n onBlur={() => setFocusedKey(null)}\n >\n {swatchVisual}\n </Box>\n ) : (\n <Box\n aria-hidden\n alignItems=\"center\"\n justifyContent=\"center\"\n data-testid=\"input-color__swatch-decorative\"\n >\n {swatchVisual}\n </Box>\n );\n\n /* ---- hex field content ---- */\n const hexContent = (\n <>\n <Text\n color={placeholderColor}\n fontSize={sizeStyles.fontSize}\n style={{ lineHeight: `${sizeStyles.lineHeight}px` }}\n >\n #\n </Text>\n <TextField\n // Hex field is always the RGB triplet; alpha is edited via its own\n // \"%\" segment, so the value never carries an alpha pair here.\n value={rgbaToHex(rgba, false).replace(/^#/, \"\")}\n sanitize={(t) => t.replace(HEX_CHARS, \"\").toUpperCase()}\n maxLength={6}\n onCommit={(digits) => {\n if (digits.length === 3 || digits.length === 6) {\n const next = hexToRgba(`#${digits}`);\n emitFromRgba({ ...next, a: rgba.a });\n }\n }}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n fontFamily={fontFamily}\n ariaLabel=\"Hex color value\"\n testID=\"input-color__hex\"\n onFocus={() => setFocusedKey(\"hex\")}\n onBlur={() => setFocusedKey(null)}\n />\n </>\n );\n\n /* ---- channel field ---- */\n const channelContent = (channel: \"red\" | \"green\" | \"blue\" | \"alpha\") => {\n const isAlpha = channel === \"alpha\";\n const display = isAlpha\n ? Math.round(rgba.a * 100)\n : rgba[channel[0] as \"r\" | \"g\" | \"b\"];\n const field = (\n <TextField\n value={String(display)}\n inputMode=\"numeric\"\n sanitize={(t) => t.replace(/[^0-9]/g, \"\")}\n maxLength={3}\n step={isAlpha ? { min: 0, max: 100 } : { min: 0, max: 255 }}\n onCommit={(t) => {\n if (t === \"\") return;\n const num = parseInt(t, 10);\n if (Number.isNaN(num)) return;\n if (isAlpha) {\n emitFromRgba({ ...rgba, a: clamp(num, 0, 100) / 100 });\n } else {\n const k = channel[0] as \"r\" | \"g\" | \"b\";\n emitFromRgba({ ...rgba, [k]: clamp(num, 0, 255) });\n }\n }}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n fontFamily={fontFamily}\n ariaLabel={CHANNEL_LABEL[channel]}\n testID={`input-color__channel-${channel}`}\n onFocus={() => setFocusedKey(`channel-${channel}`)}\n onBlur={() => setFocusedKey(null)}\n />\n );\n if (!isAlpha) return field;\n return (\n <>\n {field}\n <Text\n color={placeholderColor}\n fontSize={sizeStyles.fontSize}\n style={{ lineHeight: `${sizeStyles.lineHeight}px` }}\n >\n %\n </Text>\n </>\n );\n };\n\n /* ---- assemble control by type ----\n * Build an ordered list of cells, then enabling `transparency` simply\n * appends a trailing alpha (\"%\") cell. Corners are rounded across the whole\n * list: a single cell is fully rounded; otherwise first → left, last →\n * right, the rest square. */\n type Cell = {\n key: string;\n content: React.ReactNode;\n flex?: number;\n width?: number;\n square?: boolean;\n };\n const cells: Cell[] = [];\n\n if (isSwatchOnly) {\n cells.push({ key: \"swatch\", content: swatchNode, square: true });\n } else if (isHex) {\n cells.push({\n key: \"field\",\n flex: 1,\n content: (\n <>\n {showSwatch && swatchNode}\n <Box flex={1} flexDirection=\"row\" alignItems=\"center\" gap={4}>\n {hexContent}\n </Box>\n </>\n ),\n });\n } else if (isRgb) {\n if (showSwatch) {\n cells.push({ key: \"swatch\", content: swatchNode, square: true });\n }\n ([\"red\", \"green\", \"blue\"] as const).forEach((channel) =>\n cells.push({\n key: `channel-${channel}`,\n content: channelContent(channel),\n flex: 1,\n })\n );\n }\n\n if (transparency) {\n cells.push({\n key: \"channel-alpha\",\n content: channelContent(\"alpha\"),\n width: ALPHA_WIDTH[size],\n });\n }\n\n const control = cells.map((cell, i) => {\n const corner: Corner =\n cells.length === 1\n ? \"all\"\n : i === 0\n ? \"left\"\n : i === cells.length - 1\n ? \"right\"\n : \"middle\";\n return renderSegment(cell.key, corner, cell.content, {\n flex: cell.flex,\n width: cell.width,\n square: cell.square,\n });\n });\n\n return (\n <Box\n ref={ref}\n flexDirection=\"column\"\n gap={sizeStyles.fieldGap}\n width={isSwatchOnly ? undefined : \"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 flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n width={isSwatchOnly ? undefined : \"100%\"}\n role=\"group\"\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n >\n {control}\n </Box>\n {isWeb && (\n <Box\n role=\"status\"\n aria-live=\"polite\"\n data-testid=\"input-color__live\"\n style={{\n position: \"absolute\",\n width: 1,\n height: 1,\n padding: 0,\n margin: -1,\n overflow: \"hidden\",\n clip: \"rect(0 0 0 0)\",\n whiteSpace: \"nowrap\",\n border: 0,\n }}\n >\n {liveMessage}\n </Box>\n )}\n </Box>\n );\n }\n);\n\nInputColor.displayName = \"InputColor\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<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 max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\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 onError,\n onLoad,\n type,\n disabled,\n id,\n testID,\n \"data-testid\": dataTestId,\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 onError={onError}\n onLoad={onLoad}\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 ...props.style,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n elementType={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 data-testid={dataTestId || testID}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport isPropValid from \"@emotion/is-prop-valid\";\n\n// Props that @emotion/is-prop-valid incorrectly treats as valid HTML.\n// These are React Native or component-specific props that match\n// valid HTML patterns (on* event handlers, SVG attributes).\nexport const ADDITIONAL_BLOCKED_PROPS = new Set([\n // RN-only event handlers (pass isPropValid's on* pattern)\n \"onPress\",\n \"onChangeText\",\n \"onLayout\",\n \"onMoveShouldSetResponder\",\n \"onResponderGrant\",\n \"onResponderMove\",\n \"onResponderRelease\",\n \"onResponderTerminate\",\n // SVG attributes that pass isPropValid\n \"strokeWidth\",\n // CSS properties that pass isPropValid but are used as component props\n \"overflow\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n // Cross-platform layout prop that Text consumes as CSS, never as an\n // attribute. Pinned explicitly because it is now spread into the styled\n // component rather than destructured away before it can reach the DOM.\n \"numberOfLines\",\n]);\n\nfunction shouldForwardProp(key: string): boolean {\n if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;\n return isPropValid(key);\n}\n\n/**\n * Creates a React component that renders the given HTML tag\n * but filters out non-HTML props before they reach the DOM.\n *\n * Uses @emotion/is-prop-valid (same library styled-components v4\n * uses internally) to automatically block invalid HTML attributes,\n * plus a small blocklist for false positives (RN on* handlers, SVG attrs).\n *\n * Usage: `const FilteredDiv = createFilteredElement(\"div\");`\n * Then: `const StyledBox = styled(FilteredDiv)<BoxProps>\\`...\\`;`\n *\n * styled-components can still read ALL props for CSS interpolation,\n * but only valid HTML attributes are forwarded to the DOM element.\n */\nexport function createFilteredElement(defaultTag: string) {\n const Component = React.forwardRef<HTMLElement, Record<string, unknown>>(\n ({ children, elementType, ...props }, ref) => {\n const Tag = (elementType as string) || defaultTag;\n const htmlProps: Record<string, unknown> = {};\n for (const key of Object.keys(props)) {\n if (shouldForwardProp(key)) {\n htmlProps[key] = props[key];\n }\n }\n return React.createElement(\n Tag,\n { ref, ...htmlProps },\n children as React.ReactNode\n );\n }\n );\n Component.displayName = `Filtered(${defaultTag})`;\n return Component;\n}\n","function memoize(fn) {\n var cache = {};\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport default memoize;\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|inert|itemProp|itemScope|itemType|itemID|itemRef|on|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar index = memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport default index;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\nimport { truncationStyles } from \"./textTruncation\";\n\nconst FilteredSpan = createFilteredElement(\"span\");\n\nconst StyledText = styled(FilteredSpan)<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n\n /* Keep last: single-line truncation has to win over white-space above. */\n ${(props) => truncationStyles(props.numberOfLines)}\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n testID,\n \"data-testid\": dataTestId,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n data-testid={dataTestId || testID}\n />\n );\n};\n","/**\n * Web implementation of the cross-platform `numberOfLines` text prop.\n *\n * Native maps `numberOfLines` straight onto `RNText`. A web `<span>` has no\n * equivalent, so emit the CSS that produces the same result.\n *\n * Two details matter for the single-line case:\n * - `text-overflow` only takes effect on a block container, so the inline\n * `<span>` is promoted to `display: block` and capped at `max-width: 100%`.\n * - `min-width: 0` lets the text shrink below its own content width when it\n * sits in a flex row. Without it a `nowrap` label keeps its full intrinsic\n * width and pushes its siblings (icons, chevrons) out of a fixed-width field.\n *\n * Returns an empty string when there is nothing to clamp, so the declaration\n * block stays untouched for the majority of callers.\n */\nexport const truncationStyles = (numberOfLines?: number): string => {\n if (!numberOfLines || numberOfLines < 1) return \"\";\n\n if (numberOfLines === 1) {\n return `\n display: block;\n max-width: 100%;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n `;\n }\n\n return `\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: ${numberOfLines};\n line-clamp: ${numberOfLines};\n max-width: 100%;\n min-width: 0;\n overflow: hidden;\n `;\n};\n","import React, { forwardRef } from \"react\";\nimport styled from \"styled-components\";\nimport { InputPrimitiveProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredInput = createFilteredElement(\"input\");\n\nconst StyledInput = styled(FilteredInput)<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: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\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 /* Override browser autofill background */\n &:-webkit-autofill,\n &:-webkit-autofill:hover,\n &:-webkit-autofill:focus,\n &:-webkit-autofill:active {\n -webkit-box-shadow: 0 0 0 1000px transparent inset !important;\n -webkit-background-clip: text !important;\n -webkit-text-fill-color: ${(props) => props.color || \"inherit\"} !important;\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 fontFamily,\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 testID,\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 return (\n <StyledInput\n ref={ref}\n id={id}\n value={value}\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 fontFamily={fontFamily}\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 || testID}\n {...rest}\n />\n );\n }\n);\n\nInputPrimitive.displayName = \"InputPrimitive\";\n","export * from \"./Box\";\nexport * from \"./Text\";\nexport * from \"./Spinner\";\nexport * from \"./Icon\";\nexport * from \"./Divider\";\nexport * from \"./Input\";\nexport * from \"./TextArea\";\nexport * from \"./LinearGradient\";\n\nexport const isWeb = true;\nexport const isNative = false;\n"],"mappings":"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","names":["import_react","import_react","React","styled","React","import_styled_components","import_jsx_runtime","styled","import_react","import_styled_components","import_jsx_runtime","styled","import_jsx_runtime"]}
|
package/web/index.mjs
CHANGED
|
@@ -47,7 +47,11 @@ var ADDITIONAL_BLOCKED_PROPS = /* @__PURE__ */ new Set([
|
|
|
47
47
|
"fontSize",
|
|
48
48
|
"fontWeight",
|
|
49
49
|
"fontFamily",
|
|
50
|
-
"textDecoration"
|
|
50
|
+
"textDecoration",
|
|
51
|
+
// Cross-platform layout prop that Text consumes as CSS, never as an
|
|
52
|
+
// attribute. Pinned explicitly because it is now spread into the styled
|
|
53
|
+
// component rather than destructured away before it can reach the DOM.
|
|
54
|
+
"numberOfLines"
|
|
51
55
|
]);
|
|
52
56
|
function shouldForwardProp(key) {
|
|
53
57
|
if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;
|
|
@@ -254,6 +258,32 @@ Box.displayName = "Box";
|
|
|
254
258
|
|
|
255
259
|
// ../../foundation/primitives-web/src/Text.tsx
|
|
256
260
|
import styled2 from "styled-components";
|
|
261
|
+
|
|
262
|
+
// ../../foundation/primitives-web/src/textTruncation.ts
|
|
263
|
+
var truncationStyles = (numberOfLines) => {
|
|
264
|
+
if (!numberOfLines || numberOfLines < 1) return "";
|
|
265
|
+
if (numberOfLines === 1) {
|
|
266
|
+
return `
|
|
267
|
+
display: block;
|
|
268
|
+
max-width: 100%;
|
|
269
|
+
min-width: 0;
|
|
270
|
+
overflow: hidden;
|
|
271
|
+
text-overflow: ellipsis;
|
|
272
|
+
white-space: nowrap;
|
|
273
|
+
`;
|
|
274
|
+
}
|
|
275
|
+
return `
|
|
276
|
+
display: -webkit-box;
|
|
277
|
+
-webkit-box-orient: vertical;
|
|
278
|
+
-webkit-line-clamp: ${numberOfLines};
|
|
279
|
+
line-clamp: ${numberOfLines};
|
|
280
|
+
max-width: 100%;
|
|
281
|
+
min-width: 0;
|
|
282
|
+
overflow: hidden;
|
|
283
|
+
`;
|
|
284
|
+
};
|
|
285
|
+
|
|
286
|
+
// ../../foundation/primitives-web/src/Text.tsx
|
|
257
287
|
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
258
288
|
var FilteredSpan = createFilteredElement("span");
|
|
259
289
|
var StyledText = styled2(FilteredSpan)`
|
|
@@ -265,6 +295,9 @@ var StyledText = styled2(FilteredSpan)`
|
|
|
265
295
|
white-space: ${(props) => props.whiteSpace || "normal"};
|
|
266
296
|
text-align: ${(props) => props.textAlign || "inherit"};
|
|
267
297
|
text-decoration: ${(props) => props.textDecoration || "none"};
|
|
298
|
+
|
|
299
|
+
/* Keep last: single-line truncation has to win over white-space above. */
|
|
300
|
+
${(props) => truncationStyles(props.numberOfLines)}
|
|
268
301
|
`;
|
|
269
302
|
var Text = ({
|
|
270
303
|
style,
|
|
@@ -273,7 +306,6 @@ var Text = ({
|
|
|
273
306
|
role,
|
|
274
307
|
testID,
|
|
275
308
|
"data-testid": dataTestId,
|
|
276
|
-
numberOfLines: _numberOfLines,
|
|
277
309
|
...props
|
|
278
310
|
}) => {
|
|
279
311
|
return /* @__PURE__ */ jsx2(
|
package/web/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/InputColor.tsx","../../../../foundation/primitives-web/src/Box.tsx","../../../../foundation/primitives-web/src/filterDOMProps.ts","../../../../../node_modules/@emotion/memoize/dist/memoize.esm.js","../../../../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js","../../../../foundation/primitives-web/src/Text.tsx","../../../../foundation/primitives-web/src/Input.tsx","../../../../foundation/primitives-web/src/index.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useMemo, useRef, useState } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, InputPrimitive, isWeb } from \"@xsolla/xui-primitives\";\nimport {\n useResolvedTheme,\n useId,\n type ThemeOverrideProps,\n} from \"@xsolla/xui-core\";\n\n/**\n * Display variant of the InputColor control. Maps 1:1 to the Figma `Type` prop:\n * - `color` → \"Color only\" (swatch preview only, no editable field)\n * - `color-hex` → \"Color + HEX\" (swatch + editable hex field)\n * - `color-rgb` → \"Color + HSL/HSB/RGB\" (swatch + editable R/G/B channels)\n * - `hex` → \"HEX\" (editable hex field only)\n * - `rgb` → \"HSL/HSB/RGB\" (editable R/G/B channels only)\n */\nexport type InputColorType =\n | \"color\"\n | \"color-hex\"\n | \"color-rgb\"\n | \"hex\"\n | \"rgb\";\n\nexport type InputColorSize = \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n\nexport interface InputColorProps extends ThemeOverrideProps {\n /**\n * The current color value as a hex string (controlled mode), e.g. `#22A8C3`.\n * When `transparency` is enabled an 8-digit hex (`#RRGGBBAA`) is accepted.\n */\n value?: string;\n /**\n * The initial color value for uncontrolled usage. Defaults to `#000000`.\n */\n defaultValue?: string;\n /**\n * Event handler fired when the color changes. Always receives a hex string.\n */\n onChange?: (value: string) => void;\n /**\n * Fired when the swatch is activated. The swatch is only interactive when\n * `type=\"color\"` — its role is to open the parent ColorPicker panel. For all\n * other types the swatch is a decorative preview and this is never called.\n */\n onSwatchClick?: () => void;\n /**\n * Display variant of the control. Defaults to `color-hex`.\n */\n type?: InputColorType;\n /**\n * Enables the alpha channel. Adds an alpha field and splits the swatch to\n * preview the transparency against a checkerboard.\n */\n transparency?: boolean;\n /**\n * Property for changing the size of the control.\n */\n size?: InputColorSize;\n /**\n * Property for displaying a label above the control.\n */\n label?: string;\n /**\n * Unique identifier for the control. 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 testID?: string;\n}\n\ntype Rgba = { r: number; g: number; b: number; a: number };\n\nconst clamp = (n: number, min: number, max: number) =>\n Math.min(Math.max(n, min), max);\n\nconst HEX_CHARS = /[^0-9a-fA-F]/g;\n\n/** Parse a `#RGB`/`#RGBA`/`#RRGGBB`/`#RRGGBBAA` hex string into RGBA. */\nfunction hexToRgba(hex: string): Rgba {\n let h = (hex || \"\").replace(/^#/, \"\");\n if (h.length === 3 || h.length === 4) {\n h = h\n .split(\"\")\n .map((c) => c + c)\n .join(\"\");\n }\n const r = parseInt(h.slice(0, 2), 16);\n const g = parseInt(h.slice(2, 4), 16);\n const b = parseInt(h.slice(4, 6), 16);\n const a = h.length >= 8 ? parseInt(h.slice(6, 8), 16) / 255 : 1;\n return {\n r: Number.isNaN(r) ? 0 : r,\n g: Number.isNaN(g) ? 0 : g,\n b: Number.isNaN(b) ? 0 : b,\n a: Number.isNaN(a) ? 1 : parseFloat(a.toFixed(2)),\n };\n}\n\n/** Serialize RGBA back to an uppercase hex string. */\nfunction rgbaToHex({ r, g, b, a }: Rgba, includeAlpha: boolean): string {\n const toHex = (n: number) =>\n Math.round(clamp(n, 0, 255))\n .toString(16)\n .padStart(2, \"0\");\n const alpha = includeAlpha ? toHex(clamp(a, 0, 1) * 255) : \"\";\n return `#${toHex(r)}${toHex(g)}${toHex(b)}${alpha}`.toUpperCase();\n}\n\nconst SWATCH_SIZE: Record<InputColorSize, number> = {\n xl: 36,\n lg: 32,\n md: 26,\n sm: 20,\n xs: 14,\n};\n\n// Width of the trailing alpha (\"%\") segment per size, derived from the Figma\n// \"Color only / Transparency=True\" widths (total − swatch square − 2px gap).\nconst ALPHA_WIDTH: Record<InputColorSize, number> = {\n xl: 96,\n lg: 86,\n md: 77,\n sm: 67,\n xs: 58,\n};\n\n// Gap between the swatch and the value content inside a field, from the Figma\n// `input/<size>/frame/gap` tokens.\nconst FRAME_GAP: Record<InputColorSize, number> = {\n xl: 10,\n lg: 10,\n md: 8,\n sm: 6,\n xs: 4,\n};\n\n// CSS checkerboard, only visible behind partially-transparent colors.\nconst CHECKERBOARD =\n \"conic-gradient(rgba(0,0,0,0.45) 25%, transparent 0 50%, rgba(0,0,0,0.45) 0 75%, transparent 0)\";\n\ntype Corner = \"left\" | \"right\" | \"middle\" | \"all\";\n\nfunction cornerRadii(corner: Corner, radius: number) {\n const map = {\n all: [radius, radius, radius, radius],\n left: [radius, 0, 0, radius],\n right: [0, radius, radius, 0],\n middle: [0, 0, 0, 0],\n } as const;\n const [tl, tr, br, bl] = map[corner];\n return {\n borderTopLeftRadius: tl,\n borderTopRightRadius: tr,\n borderBottomRightRadius: br,\n borderBottomLeftRadius: bl,\n };\n}\n\n/* -------------------------------------------------------------------------- */\n/* Color swatch */\n/* -------------------------------------------------------------------------- */\n\nfunction ColorSwatch({\n size,\n rgba,\n transparency,\n borderColor,\n}: {\n size: number;\n rgba: Rgba;\n transparency: boolean;\n borderColor: string;\n}) {\n const solid = `rgb(${rgba.r}, ${rgba.g}, ${rgba.b})`;\n const withAlpha = `rgba(${rgba.r}, ${rgba.g}, ${rgba.b}, ${rgba.a})`;\n return (\n <Box\n width={size}\n height={size}\n position=\"relative\"\n borderColor={borderColor}\n borderWidth={1}\n style={{ borderRadius: 4, overflow: \"hidden\" }}\n data-testid=\"input-color__swatch-preview\"\n >\n {transparency && (\n <Box\n aria-hidden\n style={{\n position: \"absolute\",\n inset: 0,\n backgroundImage: CHECKERBOARD,\n backgroundSize: \"8px 8px\",\n opacity: 0.2,\n }}\n />\n )}\n {transparency ? (\n <>\n <Box\n style={{\n position: \"absolute\",\n top: 0,\n bottom: 0,\n left: 0,\n right: \"50%\",\n backgroundColor: solid,\n }}\n />\n <Box\n style={{\n position: \"absolute\",\n top: 0,\n bottom: 0,\n left: \"50%\",\n right: 0,\n backgroundColor: withAlpha,\n }}\n />\n </>\n ) : (\n <Box\n style={{ position: \"absolute\", inset: 0, backgroundColor: solid }}\n />\n )}\n </Box>\n );\n}\n\n/* -------------------------------------------------------------------------- */\n/* Editable text field */\n/* -------------------------------------------------------------------------- */\n\ntype TextFieldProps = {\n value: string;\n onCommit: (text: string) => void;\n sanitize: (text: string) => string;\n maxLength?: number;\n textAlign?: \"left\" | \"center\";\n color: string;\n fontSize: number;\n fontFamily: string;\n ariaLabel: string;\n inputMode?: \"numeric\" | \"text\";\n /** When set, Arrow Up/Down step the numeric value within [min, max]. */\n step?: { min: number; max: number };\n testID?: string;\n onFocus: () => void;\n onBlur: () => void;\n};\n\n/**\n * A controlled-but-buffered text field. Keeps the raw keystrokes locally so the\n * user can type freely, but resyncs to the canonical `value` on prop change and\n * on blur.\n */\nfunction TextField({\n value,\n onCommit,\n sanitize,\n maxLength,\n textAlign = \"left\",\n color,\n fontSize,\n fontFamily,\n ariaLabel,\n inputMode = \"text\",\n step,\n testID,\n onFocus,\n onBlur,\n}: TextFieldProps) {\n const [text, setText] = useState(value);\n // While the field is focused we keep the user's raw keystrokes and never\n // overwrite them with the canonical (normalized/expanded/clamped) value —\n // that resync is what caused the field to \"auto-fill\" mid-typing. We only\n // resync from `value` for external changes (unfocused) and on blur.\n const isFocusedRef = useRef(false);\n\n useEffect(() => {\n if (!isFocusedRef.current) setText(value);\n }, [value]);\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const next = sanitize(e.target.value);\n setText(next);\n onCommit(next);\n };\n\n const handleFocus = () => {\n isFocusedRef.current = true;\n onFocus();\n };\n\n const handleBlur = () => {\n isFocusedRef.current = false;\n setText(value);\n onBlur();\n };\n\n // Enter commits/normalizes by blurring (the value already propagates live).\n // Arrow Up/Down step numeric fields by ±1 within their range.\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"Enter\") {\n e.currentTarget.blur();\n return;\n }\n if (step && (e.key === \"ArrowUp\" || e.key === \"ArrowDown\")) {\n e.preventDefault();\n const current = Number.parseInt(text, 10);\n const base = Number.isNaN(current) ? 0 : current;\n const next = String(\n clamp(base + (e.key === \"ArrowUp\" ? 1 : -1), step.min, step.max)\n );\n setText(next);\n onCommit(next);\n }\n };\n\n return (\n <Box flex={1} height=\"100%\" justifyContent=\"center\">\n <InputPrimitive\n value={text}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n type=\"text\"\n inputMode={inputMode}\n maxLength={maxLength}\n color={color}\n fontSize={fontSize}\n fontFamily={fontFamily}\n aria-label={ariaLabel}\n data-testid={testID}\n style={textAlign === \"center\" ? { textAlign: \"center\" } : undefined}\n />\n </Box>\n );\n}\n\n/* -------------------------------------------------------------------------- */\n/* InputColor */\n/* -------------------------------------------------------------------------- */\n\nconst CHANNEL_LABEL: Record<\"red\" | \"green\" | \"blue\" | \"alpha\", string> = {\n red: \"Red channel\",\n green: \"Green channel\",\n blue: \"Blue channel\",\n alpha: \"Opacity percentage\",\n};\n\nexport const InputColor = forwardRef<HTMLDivElement, InputColorProps>(\n (\n {\n value,\n defaultValue,\n onChange,\n onSwatchClick,\n type = \"color-hex\",\n transparency = false,\n size = \"md\",\n label,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n themeMode,\n themeProductContext,\n },\n ref\n ) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n // Mirrors the Input \"useUpdatableState\" pattern: always keep an internal\n // value so the swatch and fields reflect edits immediately — even if a\n // controlled parent doesn't echo onChange back — and sync from `value`\n // whenever it changes externally.\n const [internalValue, setInternalValue] = useState(\n value ?? defaultValue ?? \"#000000\"\n );\n useEffect(() => {\n if (value !== undefined) setInternalValue(value);\n }, [value]);\n const currentValue = internalValue;\n\n // Which segment currently owns focus (for outline styling).\n const [focusedKey, setFocusedKey] = useState<string | null>(null);\n\n // Polite live-region message announced to screen readers on each edit.\n const [liveMessage, setLiveMessage] = useState(\"\");\n\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-color-${safeId}`;\n const labelId = `${inputId}-label`;\n\n const rgba = useMemo(() => hexToRgba(currentValue), [currentValue]);\n\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n const borderRadius = theme.shape.input[size].borderRadius;\n const swatchSize = SWATCH_SIZE[size];\n\n const showSwatch =\n type === \"color\" || type === \"color-hex\" || type === \"color-rgb\";\n const isHex = type === \"hex\" || type === \"color-hex\";\n const isRgb = type === \"rgb\" || type === \"color-rgb\";\n const isSwatchOnly = type === \"color\";\n\n const textColor = inputColors.text;\n const placeholderColor = inputColors.placeholder;\n const fontFamily = theme.fonts.body;\n\n const emit = (next: string) => {\n setInternalValue(next);\n setLiveMessage(`Color updated to ${next}`);\n onChange?.(next);\n };\n\n const emitFromRgba = (next: Rgba) => emit(rgbaToHex(next, transparency));\n\n /* ---- per-segment visual state ---- */\n const segmentVisuals = (focused: boolean) => {\n let backgroundColor = inputColors.bg;\n let borderColor = inputColors.border;\n let outlineColor: string | undefined;\n if (focused) {\n backgroundColor = theme.colors.control.focus.bg;\n outlineColor = theme.colors.border.brand;\n }\n return { backgroundColor, borderColor, outlineColor };\n };\n\n const renderSegment = (\n key: string,\n corner: Corner,\n content: React.ReactNode,\n opts: { flex?: number; width?: number; square?: boolean } = {}\n ) => {\n const focused = focusedKey === key;\n const { backgroundColor, borderColor, outlineColor } =\n segmentVisuals(focused);\n const width = opts.square ? sizeStyles.height : opts.width;\n return (\n <Box\n key={key}\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={1}\n height={sizeStyles.height}\n width={width}\n flex={opts.flex}\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent={opts.square ? \"center\" : \"flex-start\"}\n gap={FRAME_GAP[size]}\n paddingHorizontal={opts.square ? 0 : sizeStyles.paddingHorizontal}\n position=\"relative\"\n style={{\n ...cornerRadii(corner, borderRadius),\n minWidth: opts.square ? undefined : 40,\n ...(outlineColor && isWeb\n ? { outline: `1px solid ${outlineColor}`, outlineOffset: \"-1px\" }\n : outlineColor && !isWeb\n ? { borderColor: outlineColor }\n : {}),\n }}\n hoverStyle={\n !focused\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n {content}\n </Box>\n );\n };\n\n /* ---- swatch node ----\n * Per the Figma spec the swatch is only interactive when type=\"color\": it\n * acts as the trigger that opens the parent ColorPicker panel (via\n * onSwatchClick). For every other type it is a decorative preview. */\n const swatchVisual = (\n <ColorSwatch\n size={swatchSize}\n rgba={rgba}\n transparency={transparency}\n borderColor={theme.colors.border.secondary}\n />\n );\n const swatchNode = isSwatchOnly ? (\n <Box\n as=\"button\"\n type=\"button\"\n onPress={() => onSwatchClick?.()}\n cursor=\"pointer\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n padding={0}\n alignItems=\"center\"\n justifyContent=\"center\"\n aria-label=\"Open color picker\"\n data-testid=\"input-color__swatch\"\n onFocus={() => setFocusedKey(\"swatch\")}\n onBlur={() => setFocusedKey(null)}\n >\n {swatchVisual}\n </Box>\n ) : (\n <Box\n aria-hidden\n alignItems=\"center\"\n justifyContent=\"center\"\n data-testid=\"input-color__swatch-decorative\"\n >\n {swatchVisual}\n </Box>\n );\n\n /* ---- hex field content ---- */\n const hexContent = (\n <>\n <Text\n color={placeholderColor}\n fontSize={sizeStyles.fontSize}\n style={{ lineHeight: `${sizeStyles.lineHeight}px` }}\n >\n #\n </Text>\n <TextField\n // Hex field is always the RGB triplet; alpha is edited via its own\n // \"%\" segment, so the value never carries an alpha pair here.\n value={rgbaToHex(rgba, false).replace(/^#/, \"\")}\n sanitize={(t) => t.replace(HEX_CHARS, \"\").toUpperCase()}\n maxLength={6}\n onCommit={(digits) => {\n if (digits.length === 3 || digits.length === 6) {\n const next = hexToRgba(`#${digits}`);\n emitFromRgba({ ...next, a: rgba.a });\n }\n }}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n fontFamily={fontFamily}\n ariaLabel=\"Hex color value\"\n testID=\"input-color__hex\"\n onFocus={() => setFocusedKey(\"hex\")}\n onBlur={() => setFocusedKey(null)}\n />\n </>\n );\n\n /* ---- channel field ---- */\n const channelContent = (channel: \"red\" | \"green\" | \"blue\" | \"alpha\") => {\n const isAlpha = channel === \"alpha\";\n const display = isAlpha\n ? Math.round(rgba.a * 100)\n : rgba[channel[0] as \"r\" | \"g\" | \"b\"];\n const field = (\n <TextField\n value={String(display)}\n inputMode=\"numeric\"\n sanitize={(t) => t.replace(/[^0-9]/g, \"\")}\n maxLength={3}\n step={isAlpha ? { min: 0, max: 100 } : { min: 0, max: 255 }}\n onCommit={(t) => {\n if (t === \"\") return;\n const num = parseInt(t, 10);\n if (Number.isNaN(num)) return;\n if (isAlpha) {\n emitFromRgba({ ...rgba, a: clamp(num, 0, 100) / 100 });\n } else {\n const k = channel[0] as \"r\" | \"g\" | \"b\";\n emitFromRgba({ ...rgba, [k]: clamp(num, 0, 255) });\n }\n }}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n fontFamily={fontFamily}\n ariaLabel={CHANNEL_LABEL[channel]}\n testID={`input-color__channel-${channel}`}\n onFocus={() => setFocusedKey(`channel-${channel}`)}\n onBlur={() => setFocusedKey(null)}\n />\n );\n if (!isAlpha) return field;\n return (\n <>\n {field}\n <Text\n color={placeholderColor}\n fontSize={sizeStyles.fontSize}\n style={{ lineHeight: `${sizeStyles.lineHeight}px` }}\n >\n %\n </Text>\n </>\n );\n };\n\n /* ---- assemble control by type ----\n * Build an ordered list of cells, then enabling `transparency` simply\n * appends a trailing alpha (\"%\") cell. Corners are rounded across the whole\n * list: a single cell is fully rounded; otherwise first → left, last →\n * right, the rest square. */\n type Cell = {\n key: string;\n content: React.ReactNode;\n flex?: number;\n width?: number;\n square?: boolean;\n };\n const cells: Cell[] = [];\n\n if (isSwatchOnly) {\n cells.push({ key: \"swatch\", content: swatchNode, square: true });\n } else if (isHex) {\n cells.push({\n key: \"field\",\n flex: 1,\n content: (\n <>\n {showSwatch && swatchNode}\n <Box flex={1} flexDirection=\"row\" alignItems=\"center\" gap={4}>\n {hexContent}\n </Box>\n </>\n ),\n });\n } else if (isRgb) {\n if (showSwatch) {\n cells.push({ key: \"swatch\", content: swatchNode, square: true });\n }\n ([\"red\", \"green\", \"blue\"] as const).forEach((channel) =>\n cells.push({\n key: `channel-${channel}`,\n content: channelContent(channel),\n flex: 1,\n })\n );\n }\n\n if (transparency) {\n cells.push({\n key: \"channel-alpha\",\n content: channelContent(\"alpha\"),\n width: ALPHA_WIDTH[size],\n });\n }\n\n const control = cells.map((cell, i) => {\n const corner: Corner =\n cells.length === 1\n ? \"all\"\n : i === 0\n ? \"left\"\n : i === cells.length - 1\n ? \"right\"\n : \"middle\";\n return renderSegment(cell.key, corner, cell.content, {\n flex: cell.flex,\n width: cell.width,\n square: cell.square,\n });\n });\n\n return (\n <Box\n ref={ref}\n flexDirection=\"column\"\n gap={sizeStyles.fieldGap}\n width={isSwatchOnly ? undefined : \"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 flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n width={isSwatchOnly ? undefined : \"100%\"}\n role=\"group\"\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n >\n {control}\n </Box>\n {isWeb && (\n <Box\n role=\"status\"\n aria-live=\"polite\"\n data-testid=\"input-color__live\"\n style={{\n position: \"absolute\",\n width: 1,\n height: 1,\n padding: 0,\n margin: -1,\n overflow: \"hidden\",\n clip: \"rect(0 0 0 0)\",\n whiteSpace: \"nowrap\",\n border: 0,\n }}\n >\n {liveMessage}\n </Box>\n )}\n </Box>\n );\n }\n);\n\nInputColor.displayName = \"InputColor\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<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 max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\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 onError,\n onLoad,\n type,\n disabled,\n id,\n testID,\n \"data-testid\": dataTestId,\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 onError={onError}\n onLoad={onLoad}\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 ...props.style,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n elementType={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 data-testid={dataTestId || testID}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport isPropValid from \"@emotion/is-prop-valid\";\n\n// Props that @emotion/is-prop-valid incorrectly treats as valid HTML.\n// These are React Native or component-specific props that match\n// valid HTML patterns (on* event handlers, SVG attributes).\nexport const ADDITIONAL_BLOCKED_PROPS = new Set([\n // RN-only event handlers (pass isPropValid's on* pattern)\n \"onPress\",\n \"onChangeText\",\n \"onLayout\",\n \"onMoveShouldSetResponder\",\n \"onResponderGrant\",\n \"onResponderMove\",\n \"onResponderRelease\",\n \"onResponderTerminate\",\n // SVG attributes that pass isPropValid\n \"strokeWidth\",\n // CSS properties that pass isPropValid but are used as component props\n \"overflow\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n]);\n\nfunction shouldForwardProp(key: string): boolean {\n if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;\n return isPropValid(key);\n}\n\n/**\n * Creates a React component that renders the given HTML tag\n * but filters out non-HTML props before they reach the DOM.\n *\n * Uses @emotion/is-prop-valid (same library styled-components v4\n * uses internally) to automatically block invalid HTML attributes,\n * plus a small blocklist for false positives (RN on* handlers, SVG attrs).\n *\n * Usage: `const FilteredDiv = createFilteredElement(\"div\");`\n * Then: `const StyledBox = styled(FilteredDiv)<BoxProps>\\`...\\`;`\n *\n * styled-components can still read ALL props for CSS interpolation,\n * but only valid HTML attributes are forwarded to the DOM element.\n */\nexport function createFilteredElement(defaultTag: string) {\n const Component = React.forwardRef<HTMLElement, Record<string, unknown>>(\n ({ children, elementType, ...props }, ref) => {\n const Tag = (elementType as string) || defaultTag;\n const htmlProps: Record<string, unknown> = {};\n for (const key of Object.keys(props)) {\n if (shouldForwardProp(key)) {\n htmlProps[key] = props[key];\n }\n }\n return React.createElement(\n Tag,\n { ref, ...htmlProps },\n children as React.ReactNode\n );\n }\n );\n Component.displayName = `Filtered(${defaultTag})`;\n return Component;\n}\n","function memoize(fn) {\n var cache = {};\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport default memoize;\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|inert|itemProp|itemScope|itemType|itemID|itemRef|on|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar index = memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport default index;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredSpan = createFilteredElement(\"span\");\n\nconst StyledText = styled(FilteredSpan)<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n testID,\n \"data-testid\": dataTestId,\n numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n data-testid={dataTestId || testID}\n />\n );\n};\n","import React, { forwardRef } from \"react\";\nimport styled from \"styled-components\";\nimport { InputPrimitiveProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredInput = createFilteredElement(\"input\");\n\nconst StyledInput = styled(FilteredInput)<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: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\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 /* Override browser autofill background */\n &:-webkit-autofill,\n &:-webkit-autofill:hover,\n &:-webkit-autofill:focus,\n &:-webkit-autofill:active {\n -webkit-box-shadow: 0 0 0 1000px transparent inset !important;\n -webkit-background-clip: text !important;\n -webkit-text-fill-color: ${(props) => props.color || \"inherit\"} !important;\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 fontFamily,\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 testID,\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 return (\n <StyledInput\n ref={ref}\n id={id}\n value={value}\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 fontFamily={fontFamily}\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 || testID}\n {...rest}\n />\n );\n }\n);\n\nInputPrimitive.displayName = \"InputPrimitive\";\n","export * from \"./Box\";\nexport * from \"./Text\";\nexport * from \"./Spinner\";\nexport * from \"./Icon\";\nexport * from \"./Divider\";\nexport * from \"./Input\";\nexport * from \"./TextArea\";\nexport * from \"./LinearGradient\";\n\nexport const isWeb = true;\nexport const isNative = false;\n"],"mappings":"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","names":["forwardRef","React","React","styled","jsx","styled","styled","jsx","styled","jsx","forwardRef"]}
|
|
1
|
+
{"version":3,"sources":["../../src/InputColor.tsx","../../../../foundation/primitives-web/src/Box.tsx","../../../../foundation/primitives-web/src/filterDOMProps.ts","../../../../../node_modules/@emotion/memoize/dist/memoize.esm.js","../../../../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js","../../../../foundation/primitives-web/src/Text.tsx","../../../../foundation/primitives-web/src/textTruncation.ts","../../../../foundation/primitives-web/src/Input.tsx","../../../../foundation/primitives-web/src/index.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useMemo, useRef, useState } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, InputPrimitive, isWeb } from \"@xsolla/xui-primitives\";\nimport {\n useResolvedTheme,\n useId,\n type ThemeOverrideProps,\n} from \"@xsolla/xui-core\";\n\n/**\n * Display variant of the InputColor control. Maps 1:1 to the Figma `Type` prop:\n * - `color` → \"Color only\" (swatch preview only, no editable field)\n * - `color-hex` → \"Color + HEX\" (swatch + editable hex field)\n * - `color-rgb` → \"Color + HSL/HSB/RGB\" (swatch + editable R/G/B channels)\n * - `hex` → \"HEX\" (editable hex field only)\n * - `rgb` → \"HSL/HSB/RGB\" (editable R/G/B channels only)\n */\nexport type InputColorType =\n | \"color\"\n | \"color-hex\"\n | \"color-rgb\"\n | \"hex\"\n | \"rgb\";\n\nexport type InputColorSize = \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n\nexport interface InputColorProps extends ThemeOverrideProps {\n /**\n * The current color value as a hex string (controlled mode), e.g. `#22A8C3`.\n * When `transparency` is enabled an 8-digit hex (`#RRGGBBAA`) is accepted.\n */\n value?: string;\n /**\n * The initial color value for uncontrolled usage. Defaults to `#000000`.\n */\n defaultValue?: string;\n /**\n * Event handler fired when the color changes. Always receives a hex string.\n */\n onChange?: (value: string) => void;\n /**\n * Fired when the swatch is activated. The swatch is only interactive when\n * `type=\"color\"` — its role is to open the parent ColorPicker panel. For all\n * other types the swatch is a decorative preview and this is never called.\n */\n onSwatchClick?: () => void;\n /**\n * Display variant of the control. Defaults to `color-hex`.\n */\n type?: InputColorType;\n /**\n * Enables the alpha channel. Adds an alpha field and splits the swatch to\n * preview the transparency against a checkerboard.\n */\n transparency?: boolean;\n /**\n * Property for changing the size of the control.\n */\n size?: InputColorSize;\n /**\n * Property for displaying a label above the control.\n */\n label?: string;\n /**\n * Unique identifier for the control. 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 testID?: string;\n}\n\ntype Rgba = { r: number; g: number; b: number; a: number };\n\nconst clamp = (n: number, min: number, max: number) =>\n Math.min(Math.max(n, min), max);\n\nconst HEX_CHARS = /[^0-9a-fA-F]/g;\n\n/** Parse a `#RGB`/`#RGBA`/`#RRGGBB`/`#RRGGBBAA` hex string into RGBA. */\nfunction hexToRgba(hex: string): Rgba {\n let h = (hex || \"\").replace(/^#/, \"\");\n if (h.length === 3 || h.length === 4) {\n h = h\n .split(\"\")\n .map((c) => c + c)\n .join(\"\");\n }\n const r = parseInt(h.slice(0, 2), 16);\n const g = parseInt(h.slice(2, 4), 16);\n const b = parseInt(h.slice(4, 6), 16);\n const a = h.length >= 8 ? parseInt(h.slice(6, 8), 16) / 255 : 1;\n return {\n r: Number.isNaN(r) ? 0 : r,\n g: Number.isNaN(g) ? 0 : g,\n b: Number.isNaN(b) ? 0 : b,\n a: Number.isNaN(a) ? 1 : parseFloat(a.toFixed(2)),\n };\n}\n\n/** Serialize RGBA back to an uppercase hex string. */\nfunction rgbaToHex({ r, g, b, a }: Rgba, includeAlpha: boolean): string {\n const toHex = (n: number) =>\n Math.round(clamp(n, 0, 255))\n .toString(16)\n .padStart(2, \"0\");\n const alpha = includeAlpha ? toHex(clamp(a, 0, 1) * 255) : \"\";\n return `#${toHex(r)}${toHex(g)}${toHex(b)}${alpha}`.toUpperCase();\n}\n\nconst SWATCH_SIZE: Record<InputColorSize, number> = {\n xl: 36,\n lg: 32,\n md: 26,\n sm: 20,\n xs: 14,\n};\n\n// Width of the trailing alpha (\"%\") segment per size, derived from the Figma\n// \"Color only / Transparency=True\" widths (total − swatch square − 2px gap).\nconst ALPHA_WIDTH: Record<InputColorSize, number> = {\n xl: 96,\n lg: 86,\n md: 77,\n sm: 67,\n xs: 58,\n};\n\n// Gap between the swatch and the value content inside a field, from the Figma\n// `input/<size>/frame/gap` tokens.\nconst FRAME_GAP: Record<InputColorSize, number> = {\n xl: 10,\n lg: 10,\n md: 8,\n sm: 6,\n xs: 4,\n};\n\n// CSS checkerboard, only visible behind partially-transparent colors.\nconst CHECKERBOARD =\n \"conic-gradient(rgba(0,0,0,0.45) 25%, transparent 0 50%, rgba(0,0,0,0.45) 0 75%, transparent 0)\";\n\ntype Corner = \"left\" | \"right\" | \"middle\" | \"all\";\n\nfunction cornerRadii(corner: Corner, radius: number) {\n const map = {\n all: [radius, radius, radius, radius],\n left: [radius, 0, 0, radius],\n right: [0, radius, radius, 0],\n middle: [0, 0, 0, 0],\n } as const;\n const [tl, tr, br, bl] = map[corner];\n return {\n borderTopLeftRadius: tl,\n borderTopRightRadius: tr,\n borderBottomRightRadius: br,\n borderBottomLeftRadius: bl,\n };\n}\n\n/* -------------------------------------------------------------------------- */\n/* Color swatch */\n/* -------------------------------------------------------------------------- */\n\nfunction ColorSwatch({\n size,\n rgba,\n transparency,\n borderColor,\n}: {\n size: number;\n rgba: Rgba;\n transparency: boolean;\n borderColor: string;\n}) {\n const solid = `rgb(${rgba.r}, ${rgba.g}, ${rgba.b})`;\n const withAlpha = `rgba(${rgba.r}, ${rgba.g}, ${rgba.b}, ${rgba.a})`;\n return (\n <Box\n width={size}\n height={size}\n position=\"relative\"\n borderColor={borderColor}\n borderWidth={1}\n style={{ borderRadius: 4, overflow: \"hidden\" }}\n data-testid=\"input-color__swatch-preview\"\n >\n {transparency && (\n <Box\n aria-hidden\n style={{\n position: \"absolute\",\n inset: 0,\n backgroundImage: CHECKERBOARD,\n backgroundSize: \"8px 8px\",\n opacity: 0.2,\n }}\n />\n )}\n {transparency ? (\n <>\n <Box\n style={{\n position: \"absolute\",\n top: 0,\n bottom: 0,\n left: 0,\n right: \"50%\",\n backgroundColor: solid,\n }}\n />\n <Box\n style={{\n position: \"absolute\",\n top: 0,\n bottom: 0,\n left: \"50%\",\n right: 0,\n backgroundColor: withAlpha,\n }}\n />\n </>\n ) : (\n <Box\n style={{ position: \"absolute\", inset: 0, backgroundColor: solid }}\n />\n )}\n </Box>\n );\n}\n\n/* -------------------------------------------------------------------------- */\n/* Editable text field */\n/* -------------------------------------------------------------------------- */\n\ntype TextFieldProps = {\n value: string;\n onCommit: (text: string) => void;\n sanitize: (text: string) => string;\n maxLength?: number;\n textAlign?: \"left\" | \"center\";\n color: string;\n fontSize: number;\n fontFamily: string;\n ariaLabel: string;\n inputMode?: \"numeric\" | \"text\";\n /** When set, Arrow Up/Down step the numeric value within [min, max]. */\n step?: { min: number; max: number };\n testID?: string;\n onFocus: () => void;\n onBlur: () => void;\n};\n\n/**\n * A controlled-but-buffered text field. Keeps the raw keystrokes locally so the\n * user can type freely, but resyncs to the canonical `value` on prop change and\n * on blur.\n */\nfunction TextField({\n value,\n onCommit,\n sanitize,\n maxLength,\n textAlign = \"left\",\n color,\n fontSize,\n fontFamily,\n ariaLabel,\n inputMode = \"text\",\n step,\n testID,\n onFocus,\n onBlur,\n}: TextFieldProps) {\n const [text, setText] = useState(value);\n // While the field is focused we keep the user's raw keystrokes and never\n // overwrite them with the canonical (normalized/expanded/clamped) value —\n // that resync is what caused the field to \"auto-fill\" mid-typing. We only\n // resync from `value` for external changes (unfocused) and on blur.\n const isFocusedRef = useRef(false);\n\n useEffect(() => {\n if (!isFocusedRef.current) setText(value);\n }, [value]);\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const next = sanitize(e.target.value);\n setText(next);\n onCommit(next);\n };\n\n const handleFocus = () => {\n isFocusedRef.current = true;\n onFocus();\n };\n\n const handleBlur = () => {\n isFocusedRef.current = false;\n setText(value);\n onBlur();\n };\n\n // Enter commits/normalizes by blurring (the value already propagates live).\n // Arrow Up/Down step numeric fields by ±1 within their range.\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"Enter\") {\n e.currentTarget.blur();\n return;\n }\n if (step && (e.key === \"ArrowUp\" || e.key === \"ArrowDown\")) {\n e.preventDefault();\n const current = Number.parseInt(text, 10);\n const base = Number.isNaN(current) ? 0 : current;\n const next = String(\n clamp(base + (e.key === \"ArrowUp\" ? 1 : -1), step.min, step.max)\n );\n setText(next);\n onCommit(next);\n }\n };\n\n return (\n <Box flex={1} height=\"100%\" justifyContent=\"center\">\n <InputPrimitive\n value={text}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n type=\"text\"\n inputMode={inputMode}\n maxLength={maxLength}\n color={color}\n fontSize={fontSize}\n fontFamily={fontFamily}\n aria-label={ariaLabel}\n data-testid={testID}\n style={textAlign === \"center\" ? { textAlign: \"center\" } : undefined}\n />\n </Box>\n );\n}\n\n/* -------------------------------------------------------------------------- */\n/* InputColor */\n/* -------------------------------------------------------------------------- */\n\nconst CHANNEL_LABEL: Record<\"red\" | \"green\" | \"blue\" | \"alpha\", string> = {\n red: \"Red channel\",\n green: \"Green channel\",\n blue: \"Blue channel\",\n alpha: \"Opacity percentage\",\n};\n\nexport const InputColor = forwardRef<HTMLDivElement, InputColorProps>(\n (\n {\n value,\n defaultValue,\n onChange,\n onSwatchClick,\n type = \"color-hex\",\n transparency = false,\n size = \"md\",\n label,\n id: providedId,\n \"aria-label\": ariaLabel,\n testID,\n themeMode,\n themeProductContext,\n },\n ref\n ) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n // Mirrors the Input \"useUpdatableState\" pattern: always keep an internal\n // value so the swatch and fields reflect edits immediately — even if a\n // controlled parent doesn't echo onChange back — and sync from `value`\n // whenever it changes externally.\n const [internalValue, setInternalValue] = useState(\n value ?? defaultValue ?? \"#000000\"\n );\n useEffect(() => {\n if (value !== undefined) setInternalValue(value);\n }, [value]);\n const currentValue = internalValue;\n\n // Which segment currently owns focus (for outline styling).\n const [focusedKey, setFocusedKey] = useState<string | null>(null);\n\n // Polite live-region message announced to screen readers on each edit.\n const [liveMessage, setLiveMessage] = useState(\"\");\n\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const inputId = providedId || `input-color-${safeId}`;\n const labelId = `${inputId}-label`;\n\n const rgba = useMemo(() => hexToRgba(currentValue), [currentValue]);\n\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n const borderRadius = theme.shape.input[size].borderRadius;\n const swatchSize = SWATCH_SIZE[size];\n\n const showSwatch =\n type === \"color\" || type === \"color-hex\" || type === \"color-rgb\";\n const isHex = type === \"hex\" || type === \"color-hex\";\n const isRgb = type === \"rgb\" || type === \"color-rgb\";\n const isSwatchOnly = type === \"color\";\n\n const textColor = inputColors.text;\n const placeholderColor = inputColors.placeholder;\n const fontFamily = theme.fonts.body;\n\n const emit = (next: string) => {\n setInternalValue(next);\n setLiveMessage(`Color updated to ${next}`);\n onChange?.(next);\n };\n\n const emitFromRgba = (next: Rgba) => emit(rgbaToHex(next, transparency));\n\n /* ---- per-segment visual state ---- */\n const segmentVisuals = (focused: boolean) => {\n let backgroundColor = inputColors.bg;\n let borderColor = inputColors.border;\n let outlineColor: string | undefined;\n if (focused) {\n backgroundColor = theme.colors.control.focus.bg;\n outlineColor = theme.colors.border.brand;\n }\n return { backgroundColor, borderColor, outlineColor };\n };\n\n const renderSegment = (\n key: string,\n corner: Corner,\n content: React.ReactNode,\n opts: { flex?: number; width?: number; square?: boolean } = {}\n ) => {\n const focused = focusedKey === key;\n const { backgroundColor, borderColor, outlineColor } =\n segmentVisuals(focused);\n const width = opts.square ? sizeStyles.height : opts.width;\n return (\n <Box\n key={key}\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={1}\n height={sizeStyles.height}\n width={width}\n flex={opts.flex}\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent={opts.square ? \"center\" : \"flex-start\"}\n gap={FRAME_GAP[size]}\n paddingHorizontal={opts.square ? 0 : sizeStyles.paddingHorizontal}\n position=\"relative\"\n style={{\n ...cornerRadii(corner, borderRadius),\n minWidth: opts.square ? undefined : 40,\n ...(outlineColor && isWeb\n ? { outline: `1px solid ${outlineColor}`, outlineOffset: \"-1px\" }\n : outlineColor && !isWeb\n ? { borderColor: outlineColor }\n : {}),\n }}\n hoverStyle={\n !focused\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n {content}\n </Box>\n );\n };\n\n /* ---- swatch node ----\n * Per the Figma spec the swatch is only interactive when type=\"color\": it\n * acts as the trigger that opens the parent ColorPicker panel (via\n * onSwatchClick). For every other type it is a decorative preview. */\n const swatchVisual = (\n <ColorSwatch\n size={swatchSize}\n rgba={rgba}\n transparency={transparency}\n borderColor={theme.colors.border.secondary}\n />\n );\n const swatchNode = isSwatchOnly ? (\n <Box\n as=\"button\"\n type=\"button\"\n onPress={() => onSwatchClick?.()}\n cursor=\"pointer\"\n backgroundColor=\"transparent\"\n borderWidth={0}\n padding={0}\n alignItems=\"center\"\n justifyContent=\"center\"\n aria-label=\"Open color picker\"\n data-testid=\"input-color__swatch\"\n onFocus={() => setFocusedKey(\"swatch\")}\n onBlur={() => setFocusedKey(null)}\n >\n {swatchVisual}\n </Box>\n ) : (\n <Box\n aria-hidden\n alignItems=\"center\"\n justifyContent=\"center\"\n data-testid=\"input-color__swatch-decorative\"\n >\n {swatchVisual}\n </Box>\n );\n\n /* ---- hex field content ---- */\n const hexContent = (\n <>\n <Text\n color={placeholderColor}\n fontSize={sizeStyles.fontSize}\n style={{ lineHeight: `${sizeStyles.lineHeight}px` }}\n >\n #\n </Text>\n <TextField\n // Hex field is always the RGB triplet; alpha is edited via its own\n // \"%\" segment, so the value never carries an alpha pair here.\n value={rgbaToHex(rgba, false).replace(/^#/, \"\")}\n sanitize={(t) => t.replace(HEX_CHARS, \"\").toUpperCase()}\n maxLength={6}\n onCommit={(digits) => {\n if (digits.length === 3 || digits.length === 6) {\n const next = hexToRgba(`#${digits}`);\n emitFromRgba({ ...next, a: rgba.a });\n }\n }}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n fontFamily={fontFamily}\n ariaLabel=\"Hex color value\"\n testID=\"input-color__hex\"\n onFocus={() => setFocusedKey(\"hex\")}\n onBlur={() => setFocusedKey(null)}\n />\n </>\n );\n\n /* ---- channel field ---- */\n const channelContent = (channel: \"red\" | \"green\" | \"blue\" | \"alpha\") => {\n const isAlpha = channel === \"alpha\";\n const display = isAlpha\n ? Math.round(rgba.a * 100)\n : rgba[channel[0] as \"r\" | \"g\" | \"b\"];\n const field = (\n <TextField\n value={String(display)}\n inputMode=\"numeric\"\n sanitize={(t) => t.replace(/[^0-9]/g, \"\")}\n maxLength={3}\n step={isAlpha ? { min: 0, max: 100 } : { min: 0, max: 255 }}\n onCommit={(t) => {\n if (t === \"\") return;\n const num = parseInt(t, 10);\n if (Number.isNaN(num)) return;\n if (isAlpha) {\n emitFromRgba({ ...rgba, a: clamp(num, 0, 100) / 100 });\n } else {\n const k = channel[0] as \"r\" | \"g\" | \"b\";\n emitFromRgba({ ...rgba, [k]: clamp(num, 0, 255) });\n }\n }}\n color={textColor}\n fontSize={sizeStyles.fontSize}\n fontFamily={fontFamily}\n ariaLabel={CHANNEL_LABEL[channel]}\n testID={`input-color__channel-${channel}`}\n onFocus={() => setFocusedKey(`channel-${channel}`)}\n onBlur={() => setFocusedKey(null)}\n />\n );\n if (!isAlpha) return field;\n return (\n <>\n {field}\n <Text\n color={placeholderColor}\n fontSize={sizeStyles.fontSize}\n style={{ lineHeight: `${sizeStyles.lineHeight}px` }}\n >\n %\n </Text>\n </>\n );\n };\n\n /* ---- assemble control by type ----\n * Build an ordered list of cells, then enabling `transparency` simply\n * appends a trailing alpha (\"%\") cell. Corners are rounded across the whole\n * list: a single cell is fully rounded; otherwise first → left, last →\n * right, the rest square. */\n type Cell = {\n key: string;\n content: React.ReactNode;\n flex?: number;\n width?: number;\n square?: boolean;\n };\n const cells: Cell[] = [];\n\n if (isSwatchOnly) {\n cells.push({ key: \"swatch\", content: swatchNode, square: true });\n } else if (isHex) {\n cells.push({\n key: \"field\",\n flex: 1,\n content: (\n <>\n {showSwatch && swatchNode}\n <Box flex={1} flexDirection=\"row\" alignItems=\"center\" gap={4}>\n {hexContent}\n </Box>\n </>\n ),\n });\n } else if (isRgb) {\n if (showSwatch) {\n cells.push({ key: \"swatch\", content: swatchNode, square: true });\n }\n ([\"red\", \"green\", \"blue\"] as const).forEach((channel) =>\n cells.push({\n key: `channel-${channel}`,\n content: channelContent(channel),\n flex: 1,\n })\n );\n }\n\n if (transparency) {\n cells.push({\n key: \"channel-alpha\",\n content: channelContent(\"alpha\"),\n width: ALPHA_WIDTH[size],\n });\n }\n\n const control = cells.map((cell, i) => {\n const corner: Corner =\n cells.length === 1\n ? \"all\"\n : i === 0\n ? \"left\"\n : i === cells.length - 1\n ? \"right\"\n : \"middle\";\n return renderSegment(cell.key, corner, cell.content, {\n flex: cell.flex,\n width: cell.width,\n square: cell.square,\n });\n });\n\n return (\n <Box\n ref={ref}\n flexDirection=\"column\"\n gap={sizeStyles.fieldGap}\n width={isSwatchOnly ? undefined : \"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 flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n width={isSwatchOnly ? undefined : \"100%\"}\n role=\"group\"\n aria-labelledby={label ? labelId : undefined}\n aria-label={!label ? ariaLabel : undefined}\n >\n {control}\n </Box>\n {isWeb && (\n <Box\n role=\"status\"\n aria-live=\"polite\"\n data-testid=\"input-color__live\"\n style={{\n position: \"absolute\",\n width: 1,\n height: 1,\n padding: 0,\n margin: -1,\n overflow: \"hidden\",\n clip: \"rect(0 0 0 0)\",\n whiteSpace: \"nowrap\",\n border: 0,\n }}\n >\n {liveMessage}\n </Box>\n )}\n </Box>\n );\n }\n);\n\nInputColor.displayName = \"InputColor\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<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 max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\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 onError,\n onLoad,\n type,\n disabled,\n id,\n testID,\n \"data-testid\": dataTestId,\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 onError={onError}\n onLoad={onLoad}\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 ...props.style,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n elementType={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 data-testid={dataTestId || testID}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport isPropValid from \"@emotion/is-prop-valid\";\n\n// Props that @emotion/is-prop-valid incorrectly treats as valid HTML.\n// These are React Native or component-specific props that match\n// valid HTML patterns (on* event handlers, SVG attributes).\nexport const ADDITIONAL_BLOCKED_PROPS = new Set([\n // RN-only event handlers (pass isPropValid's on* pattern)\n \"onPress\",\n \"onChangeText\",\n \"onLayout\",\n \"onMoveShouldSetResponder\",\n \"onResponderGrant\",\n \"onResponderMove\",\n \"onResponderRelease\",\n \"onResponderTerminate\",\n // SVG attributes that pass isPropValid\n \"strokeWidth\",\n // CSS properties that pass isPropValid but are used as component props\n \"overflow\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n // Cross-platform layout prop that Text consumes as CSS, never as an\n // attribute. Pinned explicitly because it is now spread into the styled\n // component rather than destructured away before it can reach the DOM.\n \"numberOfLines\",\n]);\n\nfunction shouldForwardProp(key: string): boolean {\n if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;\n return isPropValid(key);\n}\n\n/**\n * Creates a React component that renders the given HTML tag\n * but filters out non-HTML props before they reach the DOM.\n *\n * Uses @emotion/is-prop-valid (same library styled-components v4\n * uses internally) to automatically block invalid HTML attributes,\n * plus a small blocklist for false positives (RN on* handlers, SVG attrs).\n *\n * Usage: `const FilteredDiv = createFilteredElement(\"div\");`\n * Then: `const StyledBox = styled(FilteredDiv)<BoxProps>\\`...\\`;`\n *\n * styled-components can still read ALL props for CSS interpolation,\n * but only valid HTML attributes are forwarded to the DOM element.\n */\nexport function createFilteredElement(defaultTag: string) {\n const Component = React.forwardRef<HTMLElement, Record<string, unknown>>(\n ({ children, elementType, ...props }, ref) => {\n const Tag = (elementType as string) || defaultTag;\n const htmlProps: Record<string, unknown> = {};\n for (const key of Object.keys(props)) {\n if (shouldForwardProp(key)) {\n htmlProps[key] = props[key];\n }\n }\n return React.createElement(\n Tag,\n { ref, ...htmlProps },\n children as React.ReactNode\n );\n }\n );\n Component.displayName = `Filtered(${defaultTag})`;\n return Component;\n}\n","function memoize(fn) {\n var cache = {};\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport default memoize;\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|inert|itemProp|itemScope|itemType|itemID|itemRef|on|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar index = memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport default index;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\nimport { truncationStyles } from \"./textTruncation\";\n\nconst FilteredSpan = createFilteredElement(\"span\");\n\nconst StyledText = styled(FilteredSpan)<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n\n /* Keep last: single-line truncation has to win over white-space above. */\n ${(props) => truncationStyles(props.numberOfLines)}\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n testID,\n \"data-testid\": dataTestId,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n data-testid={dataTestId || testID}\n />\n );\n};\n","/**\n * Web implementation of the cross-platform `numberOfLines` text prop.\n *\n * Native maps `numberOfLines` straight onto `RNText`. A web `<span>` has no\n * equivalent, so emit the CSS that produces the same result.\n *\n * Two details matter for the single-line case:\n * - `text-overflow` only takes effect on a block container, so the inline\n * `<span>` is promoted to `display: block` and capped at `max-width: 100%`.\n * - `min-width: 0` lets the text shrink below its own content width when it\n * sits in a flex row. Without it a `nowrap` label keeps its full intrinsic\n * width and pushes its siblings (icons, chevrons) out of a fixed-width field.\n *\n * Returns an empty string when there is nothing to clamp, so the declaration\n * block stays untouched for the majority of callers.\n */\nexport const truncationStyles = (numberOfLines?: number): string => {\n if (!numberOfLines || numberOfLines < 1) return \"\";\n\n if (numberOfLines === 1) {\n return `\n display: block;\n max-width: 100%;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n `;\n }\n\n return `\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: ${numberOfLines};\n line-clamp: ${numberOfLines};\n max-width: 100%;\n min-width: 0;\n overflow: hidden;\n `;\n};\n","import React, { forwardRef } from \"react\";\nimport styled from \"styled-components\";\nimport { InputPrimitiveProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredInput = createFilteredElement(\"input\");\n\nconst StyledInput = styled(FilteredInput)<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: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\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 /* Override browser autofill background */\n &:-webkit-autofill,\n &:-webkit-autofill:hover,\n &:-webkit-autofill:focus,\n &:-webkit-autofill:active {\n -webkit-box-shadow: 0 0 0 1000px transparent inset !important;\n -webkit-background-clip: text !important;\n -webkit-text-fill-color: ${(props) => props.color || \"inherit\"} !important;\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 fontFamily,\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 testID,\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 return (\n <StyledInput\n ref={ref}\n id={id}\n value={value}\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 fontFamily={fontFamily}\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 || testID}\n {...rest}\n />\n );\n }\n);\n\nInputPrimitive.displayName = \"InputPrimitive\";\n","export * from \"./Box\";\nexport * from \"./Text\";\nexport * from \"./Spinner\";\nexport * from \"./Icon\";\nexport * from \"./Divider\";\nexport * from \"./Input\";\nexport * from \"./TextArea\";\nexport * from \"./LinearGradient\";\n\nexport const isWeb = true;\nexport const isNative = false;\n"],"mappings":"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","names":["forwardRef","React","React","styled","jsx","styled","styled","jsx","styled","jsx","forwardRef"]}
|