@xsolla/xui-b2b-itemer-group 0.218.1 → 0.219.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/native/index.js +3 -0
- package/native/index.js.map +1 -1
- package/native/index.mjs +3 -0
- package/native/index.mjs.map +1 -1
- package/package.json +6 -6
- package/web/index.js +6 -2
- package/web/index.js.map +1 -1
- package/web/index.mjs +6 -2
- package/web/index.mjs.map +1 -1
package/native/index.js
CHANGED
|
@@ -76,6 +76,7 @@ var toGapValue = (gap) => {
|
|
|
76
76
|
const asNumber = Number(gap);
|
|
77
77
|
return Number.isFinite(asNumber) ? asNumber : void 0;
|
|
78
78
|
};
|
|
79
|
+
var toNativeDisplay = (display) => display === "none" ? "none" : void 0;
|
|
79
80
|
var Box = ({
|
|
80
81
|
children,
|
|
81
82
|
onPress,
|
|
@@ -107,6 +108,7 @@ var Box = ({
|
|
|
107
108
|
marginBottom,
|
|
108
109
|
marginLeft,
|
|
109
110
|
marginRight,
|
|
111
|
+
display,
|
|
110
112
|
flexDirection,
|
|
111
113
|
flexWrap,
|
|
112
114
|
alignItems,
|
|
@@ -170,6 +172,7 @@ var Box = ({
|
|
|
170
172
|
marginBottom,
|
|
171
173
|
marginLeft,
|
|
172
174
|
marginRight,
|
|
175
|
+
display: toNativeDisplay(display),
|
|
173
176
|
flexDirection,
|
|
174
177
|
flexWrap,
|
|
175
178
|
alignItems,
|
package/native/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/index.tsx","../../src/ItemerGroup.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx","../../../../foundation/primitives-native/src/Spinner.tsx","../../../../foundation/primitives-native/src/index.tsx","../../src/ItemerGroupContext.tsx","../../src/ItemerGroupColumn.tsx","../../src/ItemerGroupRow.tsx","../../src/ItemerGroupFileCell.tsx","../../src/ItemerGroupPreview.tsx"],"sourcesContent":["export { ItemerGroup } from \"./ItemerGroup\";\nexport { ItemerGroupRow } from \"./ItemerGroupRow\";\nexport { ItemerGroupFileCell } from \"./ItemerGroupFileCell\";\nexport { ItemerGroupPreview } from \"./ItemerGroupPreview\";\nexport { ItemerGroupContext } from \"./ItemerGroupContext\";\nexport type {\n ItemerGroupProps,\n ItemerGroupRowProps,\n ItemerGroupFileCellProps,\n ItemerGroupPreviewProps,\n ItemerGroupRemoveIcon,\n ItemerGroupRemoveButtonIcon,\n ItemerGroupColumnWidth,\n} from \"./types\";\n","import React, { useMemo } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { Button } from \"@xsolla/xui-button\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport { Plus, Minus, Remove } from \"@xsolla/xui-icons-base\";\nimport { ItemerGroupContext } from \"./ItemerGroupContext\";\nimport { ItemerGroupColumn } from \"./ItemerGroupColumn\";\nimport type { ItemerGroupProps, ItemerGroupRemoveButtonIcon } from \"./types\";\n\n// Size of the IconButton size=\"sm\" — used to reserve matching space in the label row\nconst REMOVE_BUTTON_SIZE = 40;\n\nconst removeIconByName = (name: ItemerGroupRemoveButtonIcon) =>\n name === \"minus\" ? Minus : Remove;\n\nexport const ItemerGroup: React.FC<ItemerGroupProps> = ({\n label,\n showLabel = true,\n children,\n draggable = false,\n minRows = 1,\n maxRows,\n removeButtonIcon = \"cross\",\n removeIcon,\n columnWidths,\n onAdd,\n addButtonLabel = \"Add line\",\n showAddButton,\n actions,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const rowCount = React.Children.toArray(children).length;\n // Figma: once the list is at its cap every \"add item\" affordance disappears —\n // the built-in add button and anything in `actions` (e.g. \"Upload file\").\n const isAtMaxRows = maxRows !== undefined && rowCount >= maxRows;\n const shouldShowAddButton =\n (showAddButton ?? Boolean(onAdd)) && !isAtMaxRows;\n const showActionRow =\n !isAtMaxRows && (shouldShowAddButton || Boolean(actions));\n const resolvedRemoveIcon = removeIcon ?? removeIconByName(removeButtonIcon);\n const contextValue = useMemo(\n () => ({\n draggable,\n rowCount,\n minRows,\n removeIcon: resolvedRemoveIcon,\n columnWidths,\n }),\n [draggable, rowCount, minRows, resolvedRemoveIcon, columnWidths]\n );\n\n const showDragSpacer = draggable && rowCount > 1;\n // Remove buttons are hidden while the group is at its minimum row count, so\n // the label row only reserves space for them while they can appear.\n const showRemoveSpacer = rowCount > minRows;\n\n const renderLabel = () => {\n if (!showLabel || !label) return null;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {Array.isArray(label) ? (\n <>\n <Box flex={1} flexDirection=\"row\" alignItems=\"flex-start\" gap={4}>\n {label.map((l, i) => (\n <ItemerGroupColumn key={i} width={columnWidths?.[i]}>\n <Typography\n variant=\"bodyXs\"\n color={theme.colors.content.secondary}\n >\n {l}\n </Typography>\n </ItemerGroupColumn>\n ))}\n </Box>\n {showRemoveSpacer && (\n <Box width={REMOVE_BUTTON_SIZE} flexShrink={0} />\n )}\n </>\n ) : (\n <Typography variant=\"bodyXs\" color={theme.colors.content.secondary}>\n {label}\n </Typography>\n )}\n </Box>\n );\n };\n\n return (\n <ItemerGroupContext.Provider value={contextValue}>\n <Box flexDirection=\"column\" gap={8} testID={testID} className={className}>\n <Box flexDirection=\"column\" gap={4}>\n {renderLabel()}\n {children}\n </Box>\n {showActionRow && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {shouldShowAddButton && (\n <Button\n variant=\"secondary\"\n tone=\"brand\"\n size=\"sm\"\n iconRight={<Plus size={16} />}\n onPress={onAdd}\n >\n {addButtonLabel}\n </Button>\n )}\n {actions}\n </Box>\n )}\n </Box>\n </ItemerGroupContext.Provider>\n );\n};\n\nItemerGroup.displayName = \"ItemerGroup\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n AccessibilityRole,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleToAccessibilityRole: Record<string, AccessibilityRole> = {\n button: \"button\",\n link: \"link\",\n img: \"image\",\n image: \"image\",\n summary: \"summary\",\n switch: \"switch\",\n checkbox: \"checkbox\",\n radio: \"radio\",\n heading: \"header\",\n text: \"text\",\n search: \"search\",\n alert: \"alert\",\n none: \"none\",\n presentation: \"none\",\n progressbar: \"progressbar\",\n scrollbar: \"scrollbar\",\n adjustable: \"adjustable\",\n tab: \"tab\",\n menu: \"menu\",\n menuitem: \"menuitem\",\n list: \"list\",\n timer: \"timer\",\n};\n\n/** RN ViewStyle.gap is typed as number (Yoga gap), not DimensionValue. */\nconst toGapValue = (gap: number | string | undefined): number | undefined => {\n if (gap === undefined) return undefined;\n if (typeof gap === \"number\") return gap;\n const pxMatch = /^(\\d+(?:\\.\\d+)?)px$/.exec(gap);\n if (pxMatch) return Number(pxMatch[1]);\n const asNumber = Number(gap);\n return Number.isFinite(asNumber) ? asNumber : undefined;\n};\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n flexDirection,\n flexWrap,\n alignItems,\n justifyContent,\n alignSelf,\n position,\n top,\n bottom,\n left,\n right,\n width,\n minWidth,\n minHeight,\n maxWidth,\n maxHeight,\n flex,\n flexShrink,\n gap,\n overflow,\n opacity,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n disabled,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n opacity: opacity ?? (disabled ? 0.5 : undefined),\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n minWidth: minWidth as DimensionValue,\n minHeight: minHeight as DimensionValue,\n maxWidth: maxWidth as DimensionValue,\n maxHeight: maxHeight as DimensionValue,\n padding: padding as DimensionValue,\n paddingHorizontal: paddingHorizontal as DimensionValue,\n paddingVertical: paddingVertical as DimensionValue,\n margin: margin as DimensionValue,\n marginTop: marginTop as DimensionValue,\n marginBottom: marginBottom as DimensionValue,\n marginLeft: marginLeft as DimensionValue,\n marginRight: marginRight as DimensionValue,\n flexDirection,\n flexWrap,\n alignItems,\n justifyContent,\n alignSelf,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n flexShrink,\n gap: toGapValue(gap),\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Map web a11y props; drop the rest of the web-only attributes before\n // spreading onto RN hosts (unknown props warn at runtime).\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n className,\n \"data-testid\": _dataTestId,\n cursor: _cursor,\n type: _type,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n const accessibilityRole =\n (typeof role === \"string\" && roleToAccessibilityRole[role]) ||\n (as === \"button\" ? \"button\" : undefined);\n const isDisabled = Boolean(disabled || ariaDisabled);\n const accessibilityState = {\n disabled: isDisabled || undefined,\n busy: Boolean(ariaBusy) || undefined,\n };\n const accessibilityLiveRegion =\n ariaLive === \"polite\" || ariaLive === \"assertive\" ? ariaLive : undefined;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n accessibilityLabel={typeof ariaLabel === \"string\" ? ariaLabel : alt}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n // Prefer Pressable whenever the node is interactive or explicitly a button,\n // so disabled / aria-disabled controls stay in the a11y tree as buttons.\n if (onPress || as === \"button\") {\n return (\n <Pressable\n onPress={!isDisabled && onPress ? onPress : undefined}\n disabled={isDisabled}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n accessibilityRole={accessibilityRole}\n accessibilityLabel={\n typeof ariaLabel === \"string\" ? ariaLabel : undefined\n }\n accessibilityState={accessibilityState}\n accessibilityLiveRegion={accessibilityLiveRegion}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n accessibilityRole={accessibilityRole}\n accessibilityLabel={typeof ariaLabel === \"string\" ? ariaLabel : undefined}\n accessibilityState={accessibilityState}\n accessibilityLiveRegion={accessibilityLiveRegion}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\n","import React from \"react\";\nimport {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string | number | undefined\n): number | undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n testID,\n \"data-testid\": dataTestId,\n style: styleProp,\n ...props\n}) => {\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n if (\n resolvedFontFamily === \"Pilat Wide\" ||\n resolvedFontFamily === \"Pilat Wide Bold\" ||\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const incomingStyle = StyleSheet.flatten(styleProp) as TextStyle | undefined;\n\n const baseStyle: TextStyle = {\n color: color ?? incomingStyle?.color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n textAlign: textAlign ?? incomingStyle?.textAlign,\n lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),\n marginTop: parseNumericValue(\n incomingStyle?.marginTop as number | string | undefined\n ),\n marginBottom: parseNumericValue(\n incomingStyle?.marginBottom as number | string | undefined\n ),\n };\n\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText\n style={baseStyle}\n numberOfLines={numberOfLines}\n testID={dataTestId || testID || id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","import type React from \"react\";\nimport { ActivityIndicator, View } from \"react-native\";\nimport type { SpinnerProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Spinner: React.FC<SpinnerProps> = ({\n color,\n size,\n role,\n \"aria-label\": ariaLabel,\n \"aria-live\": ariaLive,\n testID,\n}) => {\n return (\n <View\n accessible={true}\n accessibilityRole={role === \"status\" ? \"none\" : undefined}\n accessibilityLabel={ariaLabel}\n accessibilityLiveRegion={\n ariaLive === \"polite\"\n ? \"polite\"\n : ariaLive === \"assertive\"\n ? \"assertive\"\n : \"none\"\n }\n testID={testID}\n >\n <ActivityIndicator\n color={color}\n size={typeof size === \"number\" ? size : \"small\"}\n />\n </View>\n );\n};\n\nSpinner.displayName = \"Spinner\";\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 = false;\nexport const isNative = true;\n","import { createContext, useContext } from \"react\";\nimport { Remove } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupColumnWidth, ItemerGroupRemoveIcon } from \"./types\";\n\ninterface ItemerGroupContextValue {\n draggable: boolean;\n /**\n * Number of rows in the group. `0` means the row is rendered outside an\n * `ItemerGroup`, so the row count is unknown.\n */\n rowCount: number;\n /**\n * Minimum number of rows the group keeps. Remove buttons are hidden while\n * `rowCount <= minRows`.\n */\n minRows: number;\n removeIcon: ItemerGroupRemoveIcon;\n columnWidths?: ItemerGroupColumnWidth[];\n}\n\nexport const ItemerGroupContext = createContext<ItemerGroupContextValue>({\n draggable: false,\n rowCount: 0,\n minRows: 1,\n removeIcon: Remove,\n});\n\nexport const useItemerGroupContext = () => useContext(ItemerGroupContext);\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport type { ItemerGroupColumnWidth } from \"./types\";\n\ninterface ItemerGroupColumnProps {\n width?: ItemerGroupColumnWidth;\n children: React.ReactNode;\n}\n\n/**\n * Sizes one column of a row — a control in `ItemerGroupRow` or its header in\n * the label row. Both use this so headers always line up with their controls.\n *\n * - `width` omitted → `flex: 1`, i.e. every column takes an equal share.\n * - `number` → used as the flex grow factor.\n * - `\"auto\"` → the column keeps its control's intrinsic width and neither\n * grows nor shrinks (fixed-size controls such as `ItemerGroupPreview`).\n * - other `string` → used as `flex-basis` (e.g. `\"40%\"`). Columns may still\n * shrink, so percentages summing to 100% absorb the inter-column gaps\n * instead of overflowing the row.\n */\nexport const ItemerGroupColumn: React.FC<ItemerGroupColumnProps> = ({\n width,\n children,\n}) => {\n if (width === \"auto\") {\n return <Box flexShrink={0}>{children}</Box>;\n }\n\n if (typeof width === \"string\") {\n return (\n <Box\n minWidth={0}\n style={{ flexBasis: width, flexGrow: 0, flexShrink: 1 }}\n >\n {children}\n </Box>\n );\n }\n\n return (\n <Box flex={width ?? 1} minWidth={0}>\n {children}\n </Box>\n );\n};\n\nItemerGroupColumn.displayName = \"ItemerGroupColumn\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { IconButton } from \"@xsolla/xui-button\";\nimport { Drag } from \"@xsolla/xui-icons-base\";\nimport { useItemerGroupContext } from \"./ItemerGroupContext\";\nimport { ItemerGroupColumn } from \"./ItemerGroupColumn\";\nimport type { ItemerGroupRowProps } from \"./types\";\n\nconst REMOVE_ICON_SIZE = 20;\n\nexport const ItemerGroupRow: React.FC<ItemerGroupRowProps> = ({\n children,\n onRemove,\n className,\n}) => {\n const { theme } = useResolvedTheme({});\n const {\n draggable,\n rowCount,\n minRows,\n removeIcon: RemoveIcon,\n columnWidths,\n } = useItemerGroupContext();\n\n const columns = React.Children.toArray(children);\n\n // `rowCount` is 0 when the row is rendered outside an `ItemerGroup` — the\n // group size is unknown there, so only hide the button when the group is\n // provably at its minimum row count.\n const isAtMinRows = rowCount > 0 && rowCount <= minRows;\n const showRemoveButton = Boolean(onRemove) && !isAtMinRows;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8} className={className}>\n {draggable && rowCount > 1 && (\n <Box\n data-drag-handle=\"true\"\n width={28}\n height={28}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n style={{ cursor: \"grab\" }}\n >\n <Drag size={20} color={theme.colors.content.tertiary} />\n </Box>\n )}\n <Box\n flex={1}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={4}\n minWidth={0}\n >\n {columns.map((child, index) => (\n <ItemerGroupColumn key={index} width={columnWidths?.[index]}>\n {child}\n </ItemerGroupColumn>\n ))}\n {showRemoveButton && (\n <IconButton\n aria-label=\"Remove row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onRemove}\n icon={<RemoveIcon size={REMOVE_ICON_SIZE} />}\n />\n )}\n </Box>\n </Box>\n );\n};\n\nItemerGroupRow.displayName = \"ItemerGroupRow\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, isWeb } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, useId } from \"@xsolla/xui-core\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport type { ItemerGroupFileCellProps } from \"./types\";\n\n// Figma \"ItemergGroupUploaderCell\": input-like chrome with 8px left / 12px\n// right padding and an 8px gap between the name and the meta text.\nconst PADDING_LEFT = 8;\nconst PADDING_RIGHT = 12;\nconst CONTENT_GAP = 8;\n// Mirrors the error outline `Input` draws — 1px pulled inside the border box\n// so the cell does not grow when it becomes invalid.\nconst ERROR_OUTLINE_WIDTH = 1;\nconst ERROR_OUTLINE_OFFSET = -1;\n\n/**\n * Read-only row content for an uploaded file — the file name on the left and\n * an optional meta text (typically the size) on the right, styled like a\n * `size=\"sm\"` input so it lines up with other controls in the group.\n *\n * The cell is non-interactive by design: the user cannot edit the file name\n * despite the input-like chrome. Pass `errorMessage` to surface file-level\n * validation (e.g. \"file is too large\") below the cell, matching how `Input`\n * renders its own errors.\n *\n * Pair it with `ItemerGroupPreview` for a thumbnail column and with the group's\n * `actions` slot for an \"Upload file\" button.\n */\nexport const ItemerGroupFileCell: React.FC<ItemerGroupFileCellProps> = ({\n name,\n meta,\n error,\n errorMessage,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const inputColors = theme.colors.control.input;\n const sizeStyles = theme.sizing.input(\"sm\");\n\n // Sanitize useId() output to remove colons (e.g. :r0: -> r0) so the value is\n // a valid HTML id and ARIA reference.\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const errorId = `itemer-group-file-cell-${safeId}-error`;\n\n const isError = !!(errorMessage || error);\n const outlineColor = isError ? theme.colors.border.alert : undefined;\n\n return (\n <Box flexDirection=\"column\" gap={sizeStyles.fieldGap} width=\"100%\">\n <Box\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"space-between\"\n gap={CONTENT_GAP}\n height={sizeStyles.height}\n paddingLeft={PADDING_LEFT}\n paddingRight={PADDING_RIGHT}\n backgroundColor={inputColors.bg}\n borderWidth={1}\n borderStyle=\"solid\"\n borderColor={inputColors.border}\n borderRadius={theme.shape.input.sm.borderRadius}\n minWidth={0}\n aria-invalid={isError || undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n className={className}\n testID={testID}\n style={\n outlineColor\n ? isWeb\n ? {\n outline: `${ERROR_OUTLINE_WIDTH}px solid ${outlineColor}`,\n outlineOffset: `${ERROR_OUTLINE_OFFSET}px`,\n }\n : {\n borderColor: outlineColor,\n borderWidth: ERROR_OUTLINE_WIDTH,\n }\n : undefined\n }\n >\n <Typography\n variant=\"bodySm\"\n color={inputColors.text}\n noWrap\n title={name}\n style={{ minWidth: 0 }}\n >\n {name}\n </Typography>\n {meta && (\n <Typography\n variant=\"bodySm\"\n color={inputColors.placeholder}\n noWrap\n style={{ flexShrink: 0 }}\n >\n {meta}\n </Typography>\n )}\n </Box>\n {errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n};\n\nItemerGroupFileCell.displayName = \"ItemerGroupFileCell\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Spinner } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { FileText } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupPreviewProps } from \"./types\";\n\n// Figma \"ItemerGroupPreview\" — a 16:9 thumbnail matching the 40px row height.\nconst ITEMER_GROUP_PREVIEW_WIDTH = 77;\nconst ITEMER_GROUP_PREVIEW_HEIGHT = 40;\nconst PREVIEW_RADIUS = 4;\nconst PLACEHOLDER_ICON_SIZE = 20;\n// The loading tile keeps the placeholder chrome and swaps the file icon for a\n// brand spinner, so the row does not resize while the preview resolves.\nconst SPINNER_SIZE = 18;\nconst SPINNER_STROKE_WIDTH = 2;\n\n/**\n * Fixed-size 77×40 thumbnail for a file row. Renders, in order of precedence:\n * a spinner while `loading`, the image when `src` is set, and a neutral\n * placeholder with a file icon otherwise.\n *\n * Because the size is fixed, give its column `\"auto\"` in the parent group's\n * `columnWidths` (e.g. `columnWidths={[\"auto\", 1]}`) so it does not stretch.\n */\nexport const ItemerGroupPreview: React.FC<ItemerGroupPreviewProps> = ({\n src,\n alt = \"\",\n loading = false,\n loadingLabel = \"Loading preview\",\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n // `loading` wins over `src` so a stale thumbnail is never shown while a new\n // one is being fetched.\n const showImage = !loading && Boolean(src);\n\n return (\n <Box\n width={ITEMER_GROUP_PREVIEW_WIDTH}\n height={ITEMER_GROUP_PREVIEW_HEIGHT}\n flexShrink={0}\n borderRadius={PREVIEW_RADIUS}\n overflow=\"hidden\"\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor={showImage ? undefined : theme.colors.overlay.mono}\n className={className}\n testID={testID}\n >\n {loading ? (\n <Spinner\n size={SPINNER_SIZE}\n strokeWidth={SPINNER_STROKE_WIDTH}\n color={theme.colors.content.brand.primary}\n aria-label={loadingLabel}\n />\n ) : showImage ? (\n <Box\n as=\"img\"\n src={src}\n alt={alt}\n width=\"100%\"\n height=\"100%\"\n style={{ objectFit: \"cover\", display: \"block\" }}\n />\n ) : (\n <FileText\n size={PLACEHOLDER_ICON_SIZE}\n color={theme.colors.content.tertiary}\n />\n )}\n </Box>\n );\n};\n\nItemerGroupPreview.displayName = \"ItemerGroupPreview\";\n"],"mappings":"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","names":["import_react","import_react_native","import_jsx_runtime","RNText","import_react_native","import_jsx_runtime","import_xui_icons_base","import_jsx_runtime","import_jsx_runtime","React","import_react","import_xui_core","import_xui_button","import_xui_icons_base","import_jsx_runtime","React","import_xui_core","import_xui_typography","import_jsx_runtime","import_xui_core","import_xui_icons_base","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../../src/index.tsx","../../src/ItemerGroup.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx","../../../../foundation/primitives-native/src/Spinner.tsx","../../../../foundation/primitives-native/src/index.tsx","../../src/ItemerGroupContext.tsx","../../src/ItemerGroupColumn.tsx","../../src/ItemerGroupRow.tsx","../../src/ItemerGroupFileCell.tsx","../../src/ItemerGroupPreview.tsx"],"sourcesContent":["export { ItemerGroup } from \"./ItemerGroup\";\nexport { ItemerGroupRow } from \"./ItemerGroupRow\";\nexport { ItemerGroupFileCell } from \"./ItemerGroupFileCell\";\nexport { ItemerGroupPreview } from \"./ItemerGroupPreview\";\nexport { ItemerGroupContext } from \"./ItemerGroupContext\";\nexport type {\n ItemerGroupProps,\n ItemerGroupRowProps,\n ItemerGroupFileCellProps,\n ItemerGroupPreviewProps,\n ItemerGroupRemoveIcon,\n ItemerGroupRemoveButtonIcon,\n ItemerGroupColumnWidth,\n} from \"./types\";\n","import React, { useMemo } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { Button } from \"@xsolla/xui-button\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport { Plus, Minus, Remove } from \"@xsolla/xui-icons-base\";\nimport { ItemerGroupContext } from \"./ItemerGroupContext\";\nimport { ItemerGroupColumn } from \"./ItemerGroupColumn\";\nimport type { ItemerGroupProps, ItemerGroupRemoveButtonIcon } from \"./types\";\n\n// Size of the IconButton size=\"sm\" — used to reserve matching space in the label row\nconst REMOVE_BUTTON_SIZE = 40;\n\nconst removeIconByName = (name: ItemerGroupRemoveButtonIcon) =>\n name === \"minus\" ? Minus : Remove;\n\nexport const ItemerGroup: React.FC<ItemerGroupProps> = ({\n label,\n showLabel = true,\n children,\n draggable = false,\n minRows = 1,\n maxRows,\n removeButtonIcon = \"cross\",\n removeIcon,\n columnWidths,\n onAdd,\n addButtonLabel = \"Add line\",\n showAddButton,\n actions,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const rowCount = React.Children.toArray(children).length;\n // Figma: once the list is at its cap every \"add item\" affordance disappears —\n // the built-in add button and anything in `actions` (e.g. \"Upload file\").\n const isAtMaxRows = maxRows !== undefined && rowCount >= maxRows;\n const shouldShowAddButton =\n (showAddButton ?? Boolean(onAdd)) && !isAtMaxRows;\n const showActionRow =\n !isAtMaxRows && (shouldShowAddButton || Boolean(actions));\n const resolvedRemoveIcon = removeIcon ?? removeIconByName(removeButtonIcon);\n const contextValue = useMemo(\n () => ({\n draggable,\n rowCount,\n minRows,\n removeIcon: resolvedRemoveIcon,\n columnWidths,\n }),\n [draggable, rowCount, minRows, resolvedRemoveIcon, columnWidths]\n );\n\n const showDragSpacer = draggable && rowCount > 1;\n // Remove buttons are hidden while the group is at its minimum row count, so\n // the label row only reserves space for them while they can appear.\n const showRemoveSpacer = rowCount > minRows;\n\n const renderLabel = () => {\n if (!showLabel || !label) return null;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {Array.isArray(label) ? (\n <>\n <Box flex={1} flexDirection=\"row\" alignItems=\"flex-start\" gap={4}>\n {label.map((l, i) => (\n <ItemerGroupColumn key={i} width={columnWidths?.[i]}>\n <Typography\n variant=\"bodyXs\"\n color={theme.colors.content.secondary}\n >\n {l}\n </Typography>\n </ItemerGroupColumn>\n ))}\n </Box>\n {showRemoveSpacer && (\n <Box width={REMOVE_BUTTON_SIZE} flexShrink={0} />\n )}\n </>\n ) : (\n <Typography variant=\"bodyXs\" color={theme.colors.content.secondary}>\n {label}\n </Typography>\n )}\n </Box>\n );\n };\n\n return (\n <ItemerGroupContext.Provider value={contextValue}>\n <Box flexDirection=\"column\" gap={8} testID={testID} className={className}>\n <Box flexDirection=\"column\" gap={4}>\n {renderLabel()}\n {children}\n </Box>\n {showActionRow && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {shouldShowAddButton && (\n <Button\n variant=\"secondary\"\n tone=\"brand\"\n size=\"sm\"\n iconRight={<Plus size={16} />}\n onPress={onAdd}\n >\n {addButtonLabel}\n </Button>\n )}\n {actions}\n </Box>\n )}\n </Box>\n </ItemerGroupContext.Provider>\n );\n};\n\nItemerGroup.displayName = \"ItemerGroup\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n AccessibilityRole,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleToAccessibilityRole: Record<string, AccessibilityRole> = {\n button: \"button\",\n link: \"link\",\n img: \"image\",\n image: \"image\",\n summary: \"summary\",\n switch: \"switch\",\n checkbox: \"checkbox\",\n radio: \"radio\",\n heading: \"header\",\n text: \"text\",\n search: \"search\",\n alert: \"alert\",\n none: \"none\",\n presentation: \"none\",\n progressbar: \"progressbar\",\n scrollbar: \"scrollbar\",\n adjustable: \"adjustable\",\n tab: \"tab\",\n menu: \"menu\",\n menuitem: \"menuitem\",\n list: \"list\",\n timer: \"timer\",\n};\n\n/** RN ViewStyle.gap is typed as number (Yoga gap), not DimensionValue. */\nconst toGapValue = (gap: number | string | undefined): number | undefined => {\n if (gap === undefined) return undefined;\n if (typeof gap === \"number\") return gap;\n const pxMatch = /^(\\d+(?:\\.\\d+)?)px$/.exec(gap);\n if (pxMatch) return Number(pxMatch[1]);\n const asNumber = Number(gap);\n return Number.isFinite(asNumber) ? asNumber : undefined;\n};\n\n/**\n * Yoga has no inline formatting context, so RN's ViewStyle.display only\n * accepts \"flex\" | \"none\". Every inline-ish web value collapses to a plain\n * flex container — the box already fills only its content on native, which is\n * what those callers wanted on web anyway. Returning undefined (rather than\n * \"flex\") leaves RN's own default in place.\n */\nconst toNativeDisplay = (\n display: BoxProps[\"display\"]\n): ViewStyle[\"display\"] => (display === \"none\" ? \"none\" : undefined);\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n display,\n flexDirection,\n flexWrap,\n alignItems,\n justifyContent,\n alignSelf,\n position,\n top,\n bottom,\n left,\n right,\n width,\n minWidth,\n minHeight,\n maxWidth,\n maxHeight,\n flex,\n flexShrink,\n gap,\n overflow,\n opacity,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n disabled,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n opacity: opacity ?? (disabled ? 0.5 : undefined),\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n minWidth: minWidth as DimensionValue,\n minHeight: minHeight as DimensionValue,\n maxWidth: maxWidth as DimensionValue,\n maxHeight: maxHeight as DimensionValue,\n padding: padding as DimensionValue,\n paddingHorizontal: paddingHorizontal as DimensionValue,\n paddingVertical: paddingVertical as DimensionValue,\n margin: margin as DimensionValue,\n marginTop: marginTop as DimensionValue,\n marginBottom: marginBottom as DimensionValue,\n marginLeft: marginLeft as DimensionValue,\n marginRight: marginRight as DimensionValue,\n display: toNativeDisplay(display),\n flexDirection,\n flexWrap,\n alignItems,\n justifyContent,\n alignSelf,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n flexShrink,\n gap: toGapValue(gap),\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Map web a11y props; drop the rest of the web-only attributes before\n // spreading onto RN hosts (unknown props warn at runtime).\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n className,\n \"data-testid\": _dataTestId,\n cursor: _cursor,\n type: _type,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n const accessibilityRole =\n (typeof role === \"string\" && roleToAccessibilityRole[role]) ||\n (as === \"button\" ? \"button\" : undefined);\n const isDisabled = Boolean(disabled || ariaDisabled);\n const accessibilityState = {\n disabled: isDisabled || undefined,\n busy: Boolean(ariaBusy) || undefined,\n };\n const accessibilityLiveRegion =\n ariaLive === \"polite\" || ariaLive === \"assertive\" ? ariaLive : undefined;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n accessibilityLabel={typeof ariaLabel === \"string\" ? ariaLabel : alt}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n // Prefer Pressable whenever the node is interactive or explicitly a button,\n // so disabled / aria-disabled controls stay in the a11y tree as buttons.\n if (onPress || as === \"button\") {\n return (\n <Pressable\n onPress={!isDisabled && onPress ? onPress : undefined}\n disabled={isDisabled}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n accessibilityRole={accessibilityRole}\n accessibilityLabel={\n typeof ariaLabel === \"string\" ? ariaLabel : undefined\n }\n accessibilityState={accessibilityState}\n accessibilityLiveRegion={accessibilityLiveRegion}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n accessibilityRole={accessibilityRole}\n accessibilityLabel={typeof ariaLabel === \"string\" ? ariaLabel : undefined}\n accessibilityState={accessibilityState}\n accessibilityLiveRegion={accessibilityLiveRegion}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\n","import React from \"react\";\nimport {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string | number | undefined\n): number | undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n testID,\n \"data-testid\": dataTestId,\n style: styleProp,\n ...props\n}) => {\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n if (\n resolvedFontFamily === \"Pilat Wide\" ||\n resolvedFontFamily === \"Pilat Wide Bold\" ||\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const incomingStyle = StyleSheet.flatten(styleProp) as TextStyle | undefined;\n\n const baseStyle: TextStyle = {\n color: color ?? incomingStyle?.color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n textAlign: textAlign ?? incomingStyle?.textAlign,\n lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),\n marginTop: parseNumericValue(\n incomingStyle?.marginTop as number | string | undefined\n ),\n marginBottom: parseNumericValue(\n incomingStyle?.marginBottom as number | string | undefined\n ),\n };\n\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText\n style={baseStyle}\n numberOfLines={numberOfLines}\n testID={dataTestId || testID || id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","import type React from \"react\";\nimport { ActivityIndicator, View } from \"react-native\";\nimport type { SpinnerProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Spinner: React.FC<SpinnerProps> = ({\n color,\n size,\n role,\n \"aria-label\": ariaLabel,\n \"aria-live\": ariaLive,\n testID,\n}) => {\n return (\n <View\n accessible={true}\n accessibilityRole={role === \"status\" ? \"none\" : undefined}\n accessibilityLabel={ariaLabel}\n accessibilityLiveRegion={\n ariaLive === \"polite\"\n ? \"polite\"\n : ariaLive === \"assertive\"\n ? \"assertive\"\n : \"none\"\n }\n testID={testID}\n >\n <ActivityIndicator\n color={color}\n size={typeof size === \"number\" ? size : \"small\"}\n />\n </View>\n );\n};\n\nSpinner.displayName = \"Spinner\";\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 = false;\nexport const isNative = true;\n","import { createContext, useContext } from \"react\";\nimport { Remove } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupColumnWidth, ItemerGroupRemoveIcon } from \"./types\";\n\ninterface ItemerGroupContextValue {\n draggable: boolean;\n /**\n * Number of rows in the group. `0` means the row is rendered outside an\n * `ItemerGroup`, so the row count is unknown.\n */\n rowCount: number;\n /**\n * Minimum number of rows the group keeps. Remove buttons are hidden while\n * `rowCount <= minRows`.\n */\n minRows: number;\n removeIcon: ItemerGroupRemoveIcon;\n columnWidths?: ItemerGroupColumnWidth[];\n}\n\nexport const ItemerGroupContext = createContext<ItemerGroupContextValue>({\n draggable: false,\n rowCount: 0,\n minRows: 1,\n removeIcon: Remove,\n});\n\nexport const useItemerGroupContext = () => useContext(ItemerGroupContext);\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport type { ItemerGroupColumnWidth } from \"./types\";\n\ninterface ItemerGroupColumnProps {\n width?: ItemerGroupColumnWidth;\n children: React.ReactNode;\n}\n\n/**\n * Sizes one column of a row — a control in `ItemerGroupRow` or its header in\n * the label row. Both use this so headers always line up with their controls.\n *\n * - `width` omitted → `flex: 1`, i.e. every column takes an equal share.\n * - `number` → used as the flex grow factor.\n * - `\"auto\"` → the column keeps its control's intrinsic width and neither\n * grows nor shrinks (fixed-size controls such as `ItemerGroupPreview`).\n * - other `string` → used as `flex-basis` (e.g. `\"40%\"`). Columns may still\n * shrink, so percentages summing to 100% absorb the inter-column gaps\n * instead of overflowing the row.\n */\nexport const ItemerGroupColumn: React.FC<ItemerGroupColumnProps> = ({\n width,\n children,\n}) => {\n if (width === \"auto\") {\n return <Box flexShrink={0}>{children}</Box>;\n }\n\n if (typeof width === \"string\") {\n return (\n <Box\n minWidth={0}\n style={{ flexBasis: width, flexGrow: 0, flexShrink: 1 }}\n >\n {children}\n </Box>\n );\n }\n\n return (\n <Box flex={width ?? 1} minWidth={0}>\n {children}\n </Box>\n );\n};\n\nItemerGroupColumn.displayName = \"ItemerGroupColumn\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { IconButton } from \"@xsolla/xui-button\";\nimport { Drag } from \"@xsolla/xui-icons-base\";\nimport { useItemerGroupContext } from \"./ItemerGroupContext\";\nimport { ItemerGroupColumn } from \"./ItemerGroupColumn\";\nimport type { ItemerGroupRowProps } from \"./types\";\n\nconst REMOVE_ICON_SIZE = 20;\n\nexport const ItemerGroupRow: React.FC<ItemerGroupRowProps> = ({\n children,\n onRemove,\n className,\n}) => {\n const { theme } = useResolvedTheme({});\n const {\n draggable,\n rowCount,\n minRows,\n removeIcon: RemoveIcon,\n columnWidths,\n } = useItemerGroupContext();\n\n const columns = React.Children.toArray(children);\n\n // `rowCount` is 0 when the row is rendered outside an `ItemerGroup` — the\n // group size is unknown there, so only hide the button when the group is\n // provably at its minimum row count.\n const isAtMinRows = rowCount > 0 && rowCount <= minRows;\n const showRemoveButton = Boolean(onRemove) && !isAtMinRows;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8} className={className}>\n {draggable && rowCount > 1 && (\n <Box\n data-drag-handle=\"true\"\n width={28}\n height={28}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n style={{ cursor: \"grab\" }}\n >\n <Drag size={20} color={theme.colors.content.tertiary} />\n </Box>\n )}\n <Box\n flex={1}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={4}\n minWidth={0}\n >\n {columns.map((child, index) => (\n <ItemerGroupColumn key={index} width={columnWidths?.[index]}>\n {child}\n </ItemerGroupColumn>\n ))}\n {showRemoveButton && (\n <IconButton\n aria-label=\"Remove row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onRemove}\n icon={<RemoveIcon size={REMOVE_ICON_SIZE} />}\n />\n )}\n </Box>\n </Box>\n );\n};\n\nItemerGroupRow.displayName = \"ItemerGroupRow\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, isWeb } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, useId } from \"@xsolla/xui-core\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport type { ItemerGroupFileCellProps } from \"./types\";\n\n// Figma \"ItemergGroupUploaderCell\": input-like chrome with 8px left / 12px\n// right padding and an 8px gap between the name and the meta text.\nconst PADDING_LEFT = 8;\nconst PADDING_RIGHT = 12;\nconst CONTENT_GAP = 8;\n// Mirrors the error outline `Input` draws — 1px pulled inside the border box\n// so the cell does not grow when it becomes invalid.\nconst ERROR_OUTLINE_WIDTH = 1;\nconst ERROR_OUTLINE_OFFSET = -1;\n\n/**\n * Read-only row content for an uploaded file — the file name on the left and\n * an optional meta text (typically the size) on the right, styled like a\n * `size=\"sm\"` input so it lines up with other controls in the group.\n *\n * The cell is non-interactive by design: the user cannot edit the file name\n * despite the input-like chrome. Pass `errorMessage` to surface file-level\n * validation (e.g. \"file is too large\") below the cell, matching how `Input`\n * renders its own errors.\n *\n * Pair it with `ItemerGroupPreview` for a thumbnail column and with the group's\n * `actions` slot for an \"Upload file\" button.\n */\nexport const ItemerGroupFileCell: React.FC<ItemerGroupFileCellProps> = ({\n name,\n meta,\n error,\n errorMessage,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const inputColors = theme.colors.control.input;\n const sizeStyles = theme.sizing.input(\"sm\");\n\n // Sanitize useId() output to remove colons (e.g. :r0: -> r0) so the value is\n // a valid HTML id and ARIA reference.\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const errorId = `itemer-group-file-cell-${safeId}-error`;\n\n const isError = !!(errorMessage || error);\n const outlineColor = isError ? theme.colors.border.alert : undefined;\n\n return (\n <Box flexDirection=\"column\" gap={sizeStyles.fieldGap} width=\"100%\">\n <Box\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"space-between\"\n gap={CONTENT_GAP}\n height={sizeStyles.height}\n paddingLeft={PADDING_LEFT}\n paddingRight={PADDING_RIGHT}\n backgroundColor={inputColors.bg}\n borderWidth={1}\n borderStyle=\"solid\"\n borderColor={inputColors.border}\n borderRadius={theme.shape.input.sm.borderRadius}\n minWidth={0}\n aria-invalid={isError || undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n className={className}\n testID={testID}\n style={\n outlineColor\n ? isWeb\n ? {\n outline: `${ERROR_OUTLINE_WIDTH}px solid ${outlineColor}`,\n outlineOffset: `${ERROR_OUTLINE_OFFSET}px`,\n }\n : {\n borderColor: outlineColor,\n borderWidth: ERROR_OUTLINE_WIDTH,\n }\n : undefined\n }\n >\n <Typography\n variant=\"bodySm\"\n color={inputColors.text}\n noWrap\n title={name}\n style={{ minWidth: 0 }}\n >\n {name}\n </Typography>\n {meta && (\n <Typography\n variant=\"bodySm\"\n color={inputColors.placeholder}\n noWrap\n style={{ flexShrink: 0 }}\n >\n {meta}\n </Typography>\n )}\n </Box>\n {errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n};\n\nItemerGroupFileCell.displayName = \"ItemerGroupFileCell\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Spinner } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { FileText } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupPreviewProps } from \"./types\";\n\n// Figma \"ItemerGroupPreview\" — a 16:9 thumbnail matching the 40px row height.\nconst ITEMER_GROUP_PREVIEW_WIDTH = 77;\nconst ITEMER_GROUP_PREVIEW_HEIGHT = 40;\nconst PREVIEW_RADIUS = 4;\nconst PLACEHOLDER_ICON_SIZE = 20;\n// The loading tile keeps the placeholder chrome and swaps the file icon for a\n// brand spinner, so the row does not resize while the preview resolves.\nconst SPINNER_SIZE = 18;\nconst SPINNER_STROKE_WIDTH = 2;\n\n/**\n * Fixed-size 77×40 thumbnail for a file row. Renders, in order of precedence:\n * a spinner while `loading`, the image when `src` is set, and a neutral\n * placeholder with a file icon otherwise.\n *\n * Because the size is fixed, give its column `\"auto\"` in the parent group's\n * `columnWidths` (e.g. `columnWidths={[\"auto\", 1]}`) so it does not stretch.\n */\nexport const ItemerGroupPreview: React.FC<ItemerGroupPreviewProps> = ({\n src,\n alt = \"\",\n loading = false,\n loadingLabel = \"Loading preview\",\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n // `loading` wins over `src` so a stale thumbnail is never shown while a new\n // one is being fetched.\n const showImage = !loading && Boolean(src);\n\n return (\n <Box\n width={ITEMER_GROUP_PREVIEW_WIDTH}\n height={ITEMER_GROUP_PREVIEW_HEIGHT}\n flexShrink={0}\n borderRadius={PREVIEW_RADIUS}\n overflow=\"hidden\"\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor={showImage ? undefined : theme.colors.overlay.mono}\n className={className}\n testID={testID}\n >\n {loading ? (\n <Spinner\n size={SPINNER_SIZE}\n strokeWidth={SPINNER_STROKE_WIDTH}\n color={theme.colors.content.brand.primary}\n aria-label={loadingLabel}\n />\n ) : showImage ? (\n <Box\n as=\"img\"\n src={src}\n alt={alt}\n width=\"100%\"\n height=\"100%\"\n style={{ objectFit: \"cover\", display: \"block\" }}\n />\n ) : (\n <FileText\n size={PLACEHOLDER_ICON_SIZE}\n color={theme.colors.content.tertiary}\n />\n )}\n </Box>\n );\n};\n\nItemerGroupPreview.displayName = \"ItemerGroupPreview\";\n"],"mappings":"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","names":["import_react","import_react_native","import_jsx_runtime","RNText","import_react_native","import_jsx_runtime","import_xui_icons_base","import_jsx_runtime","import_jsx_runtime","React","import_react","import_xui_core","import_xui_button","import_xui_icons_base","import_jsx_runtime","React","import_xui_core","import_xui_typography","import_jsx_runtime","import_xui_core","import_xui_icons_base","import_jsx_runtime"]}
|
package/native/index.mjs
CHANGED
|
@@ -40,6 +40,7 @@ var toGapValue = (gap) => {
|
|
|
40
40
|
const asNumber = Number(gap);
|
|
41
41
|
return Number.isFinite(asNumber) ? asNumber : void 0;
|
|
42
42
|
};
|
|
43
|
+
var toNativeDisplay = (display) => display === "none" ? "none" : void 0;
|
|
43
44
|
var Box = ({
|
|
44
45
|
children,
|
|
45
46
|
onPress,
|
|
@@ -71,6 +72,7 @@ var Box = ({
|
|
|
71
72
|
marginBottom,
|
|
72
73
|
marginLeft,
|
|
73
74
|
marginRight,
|
|
75
|
+
display,
|
|
74
76
|
flexDirection,
|
|
75
77
|
flexWrap,
|
|
76
78
|
alignItems,
|
|
@@ -134,6 +136,7 @@ var Box = ({
|
|
|
134
136
|
marginBottom,
|
|
135
137
|
marginLeft,
|
|
136
138
|
marginRight,
|
|
139
|
+
display: toNativeDisplay(display),
|
|
137
140
|
flexDirection,
|
|
138
141
|
flexWrap,
|
|
139
142
|
alignItems,
|
package/native/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/ItemerGroup.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx","../../../../foundation/primitives-native/src/Spinner.tsx","../../../../foundation/primitives-native/src/index.tsx","../../src/ItemerGroupContext.tsx","../../src/ItemerGroupColumn.tsx","../../src/ItemerGroupRow.tsx","../../src/ItemerGroupFileCell.tsx","../../src/ItemerGroupPreview.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { Button } from \"@xsolla/xui-button\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport { Plus, Minus, Remove } from \"@xsolla/xui-icons-base\";\nimport { ItemerGroupContext } from \"./ItemerGroupContext\";\nimport { ItemerGroupColumn } from \"./ItemerGroupColumn\";\nimport type { ItemerGroupProps, ItemerGroupRemoveButtonIcon } from \"./types\";\n\n// Size of the IconButton size=\"sm\" — used to reserve matching space in the label row\nconst REMOVE_BUTTON_SIZE = 40;\n\nconst removeIconByName = (name: ItemerGroupRemoveButtonIcon) =>\n name === \"minus\" ? Minus : Remove;\n\nexport const ItemerGroup: React.FC<ItemerGroupProps> = ({\n label,\n showLabel = true,\n children,\n draggable = false,\n minRows = 1,\n maxRows,\n removeButtonIcon = \"cross\",\n removeIcon,\n columnWidths,\n onAdd,\n addButtonLabel = \"Add line\",\n showAddButton,\n actions,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const rowCount = React.Children.toArray(children).length;\n // Figma: once the list is at its cap every \"add item\" affordance disappears —\n // the built-in add button and anything in `actions` (e.g. \"Upload file\").\n const isAtMaxRows = maxRows !== undefined && rowCount >= maxRows;\n const shouldShowAddButton =\n (showAddButton ?? Boolean(onAdd)) && !isAtMaxRows;\n const showActionRow =\n !isAtMaxRows && (shouldShowAddButton || Boolean(actions));\n const resolvedRemoveIcon = removeIcon ?? removeIconByName(removeButtonIcon);\n const contextValue = useMemo(\n () => ({\n draggable,\n rowCount,\n minRows,\n removeIcon: resolvedRemoveIcon,\n columnWidths,\n }),\n [draggable, rowCount, minRows, resolvedRemoveIcon, columnWidths]\n );\n\n const showDragSpacer = draggable && rowCount > 1;\n // Remove buttons are hidden while the group is at its minimum row count, so\n // the label row only reserves space for them while they can appear.\n const showRemoveSpacer = rowCount > minRows;\n\n const renderLabel = () => {\n if (!showLabel || !label) return null;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {Array.isArray(label) ? (\n <>\n <Box flex={1} flexDirection=\"row\" alignItems=\"flex-start\" gap={4}>\n {label.map((l, i) => (\n <ItemerGroupColumn key={i} width={columnWidths?.[i]}>\n <Typography\n variant=\"bodyXs\"\n color={theme.colors.content.secondary}\n >\n {l}\n </Typography>\n </ItemerGroupColumn>\n ))}\n </Box>\n {showRemoveSpacer && (\n <Box width={REMOVE_BUTTON_SIZE} flexShrink={0} />\n )}\n </>\n ) : (\n <Typography variant=\"bodyXs\" color={theme.colors.content.secondary}>\n {label}\n </Typography>\n )}\n </Box>\n );\n };\n\n return (\n <ItemerGroupContext.Provider value={contextValue}>\n <Box flexDirection=\"column\" gap={8} testID={testID} className={className}>\n <Box flexDirection=\"column\" gap={4}>\n {renderLabel()}\n {children}\n </Box>\n {showActionRow && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {shouldShowAddButton && (\n <Button\n variant=\"secondary\"\n tone=\"brand\"\n size=\"sm\"\n iconRight={<Plus size={16} />}\n onPress={onAdd}\n >\n {addButtonLabel}\n </Button>\n )}\n {actions}\n </Box>\n )}\n </Box>\n </ItemerGroupContext.Provider>\n );\n};\n\nItemerGroup.displayName = \"ItemerGroup\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n AccessibilityRole,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleToAccessibilityRole: Record<string, AccessibilityRole> = {\n button: \"button\",\n link: \"link\",\n img: \"image\",\n image: \"image\",\n summary: \"summary\",\n switch: \"switch\",\n checkbox: \"checkbox\",\n radio: \"radio\",\n heading: \"header\",\n text: \"text\",\n search: \"search\",\n alert: \"alert\",\n none: \"none\",\n presentation: \"none\",\n progressbar: \"progressbar\",\n scrollbar: \"scrollbar\",\n adjustable: \"adjustable\",\n tab: \"tab\",\n menu: \"menu\",\n menuitem: \"menuitem\",\n list: \"list\",\n timer: \"timer\",\n};\n\n/** RN ViewStyle.gap is typed as number (Yoga gap), not DimensionValue. */\nconst toGapValue = (gap: number | string | undefined): number | undefined => {\n if (gap === undefined) return undefined;\n if (typeof gap === \"number\") return gap;\n const pxMatch = /^(\\d+(?:\\.\\d+)?)px$/.exec(gap);\n if (pxMatch) return Number(pxMatch[1]);\n const asNumber = Number(gap);\n return Number.isFinite(asNumber) ? asNumber : undefined;\n};\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n flexDirection,\n flexWrap,\n alignItems,\n justifyContent,\n alignSelf,\n position,\n top,\n bottom,\n left,\n right,\n width,\n minWidth,\n minHeight,\n maxWidth,\n maxHeight,\n flex,\n flexShrink,\n gap,\n overflow,\n opacity,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n disabled,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n opacity: opacity ?? (disabled ? 0.5 : undefined),\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n minWidth: minWidth as DimensionValue,\n minHeight: minHeight as DimensionValue,\n maxWidth: maxWidth as DimensionValue,\n maxHeight: maxHeight as DimensionValue,\n padding: padding as DimensionValue,\n paddingHorizontal: paddingHorizontal as DimensionValue,\n paddingVertical: paddingVertical as DimensionValue,\n margin: margin as DimensionValue,\n marginTop: marginTop as DimensionValue,\n marginBottom: marginBottom as DimensionValue,\n marginLeft: marginLeft as DimensionValue,\n marginRight: marginRight as DimensionValue,\n flexDirection,\n flexWrap,\n alignItems,\n justifyContent,\n alignSelf,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n flexShrink,\n gap: toGapValue(gap),\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Map web a11y props; drop the rest of the web-only attributes before\n // spreading onto RN hosts (unknown props warn at runtime).\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n className,\n \"data-testid\": _dataTestId,\n cursor: _cursor,\n type: _type,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n const accessibilityRole =\n (typeof role === \"string\" && roleToAccessibilityRole[role]) ||\n (as === \"button\" ? \"button\" : undefined);\n const isDisabled = Boolean(disabled || ariaDisabled);\n const accessibilityState = {\n disabled: isDisabled || undefined,\n busy: Boolean(ariaBusy) || undefined,\n };\n const accessibilityLiveRegion =\n ariaLive === \"polite\" || ariaLive === \"assertive\" ? ariaLive : undefined;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n accessibilityLabel={typeof ariaLabel === \"string\" ? ariaLabel : alt}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n // Prefer Pressable whenever the node is interactive or explicitly a button,\n // so disabled / aria-disabled controls stay in the a11y tree as buttons.\n if (onPress || as === \"button\") {\n return (\n <Pressable\n onPress={!isDisabled && onPress ? onPress : undefined}\n disabled={isDisabled}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n accessibilityRole={accessibilityRole}\n accessibilityLabel={\n typeof ariaLabel === \"string\" ? ariaLabel : undefined\n }\n accessibilityState={accessibilityState}\n accessibilityLiveRegion={accessibilityLiveRegion}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n accessibilityRole={accessibilityRole}\n accessibilityLabel={typeof ariaLabel === \"string\" ? ariaLabel : undefined}\n accessibilityState={accessibilityState}\n accessibilityLiveRegion={accessibilityLiveRegion}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\n","import React from \"react\";\nimport {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string | number | undefined\n): number | undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n testID,\n \"data-testid\": dataTestId,\n style: styleProp,\n ...props\n}) => {\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n if (\n resolvedFontFamily === \"Pilat Wide\" ||\n resolvedFontFamily === \"Pilat Wide Bold\" ||\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const incomingStyle = StyleSheet.flatten(styleProp) as TextStyle | undefined;\n\n const baseStyle: TextStyle = {\n color: color ?? incomingStyle?.color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n textAlign: textAlign ?? incomingStyle?.textAlign,\n lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),\n marginTop: parseNumericValue(\n incomingStyle?.marginTop as number | string | undefined\n ),\n marginBottom: parseNumericValue(\n incomingStyle?.marginBottom as number | string | undefined\n ),\n };\n\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText\n style={baseStyle}\n numberOfLines={numberOfLines}\n testID={dataTestId || testID || id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","import type React from \"react\";\nimport { ActivityIndicator, View } from \"react-native\";\nimport type { SpinnerProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Spinner: React.FC<SpinnerProps> = ({\n color,\n size,\n role,\n \"aria-label\": ariaLabel,\n \"aria-live\": ariaLive,\n testID,\n}) => {\n return (\n <View\n accessible={true}\n accessibilityRole={role === \"status\" ? \"none\" : undefined}\n accessibilityLabel={ariaLabel}\n accessibilityLiveRegion={\n ariaLive === \"polite\"\n ? \"polite\"\n : ariaLive === \"assertive\"\n ? \"assertive\"\n : \"none\"\n }\n testID={testID}\n >\n <ActivityIndicator\n color={color}\n size={typeof size === \"number\" ? size : \"small\"}\n />\n </View>\n );\n};\n\nSpinner.displayName = \"Spinner\";\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 = false;\nexport const isNative = true;\n","import { createContext, useContext } from \"react\";\nimport { Remove } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupColumnWidth, ItemerGroupRemoveIcon } from \"./types\";\n\ninterface ItemerGroupContextValue {\n draggable: boolean;\n /**\n * Number of rows in the group. `0` means the row is rendered outside an\n * `ItemerGroup`, so the row count is unknown.\n */\n rowCount: number;\n /**\n * Minimum number of rows the group keeps. Remove buttons are hidden while\n * `rowCount <= minRows`.\n */\n minRows: number;\n removeIcon: ItemerGroupRemoveIcon;\n columnWidths?: ItemerGroupColumnWidth[];\n}\n\nexport const ItemerGroupContext = createContext<ItemerGroupContextValue>({\n draggable: false,\n rowCount: 0,\n minRows: 1,\n removeIcon: Remove,\n});\n\nexport const useItemerGroupContext = () => useContext(ItemerGroupContext);\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport type { ItemerGroupColumnWidth } from \"./types\";\n\ninterface ItemerGroupColumnProps {\n width?: ItemerGroupColumnWidth;\n children: React.ReactNode;\n}\n\n/**\n * Sizes one column of a row — a control in `ItemerGroupRow` or its header in\n * the label row. Both use this so headers always line up with their controls.\n *\n * - `width` omitted → `flex: 1`, i.e. every column takes an equal share.\n * - `number` → used as the flex grow factor.\n * - `\"auto\"` → the column keeps its control's intrinsic width and neither\n * grows nor shrinks (fixed-size controls such as `ItemerGroupPreview`).\n * - other `string` → used as `flex-basis` (e.g. `\"40%\"`). Columns may still\n * shrink, so percentages summing to 100% absorb the inter-column gaps\n * instead of overflowing the row.\n */\nexport const ItemerGroupColumn: React.FC<ItemerGroupColumnProps> = ({\n width,\n children,\n}) => {\n if (width === \"auto\") {\n return <Box flexShrink={0}>{children}</Box>;\n }\n\n if (typeof width === \"string\") {\n return (\n <Box\n minWidth={0}\n style={{ flexBasis: width, flexGrow: 0, flexShrink: 1 }}\n >\n {children}\n </Box>\n );\n }\n\n return (\n <Box flex={width ?? 1} minWidth={0}>\n {children}\n </Box>\n );\n};\n\nItemerGroupColumn.displayName = \"ItemerGroupColumn\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { IconButton } from \"@xsolla/xui-button\";\nimport { Drag } from \"@xsolla/xui-icons-base\";\nimport { useItemerGroupContext } from \"./ItemerGroupContext\";\nimport { ItemerGroupColumn } from \"./ItemerGroupColumn\";\nimport type { ItemerGroupRowProps } from \"./types\";\n\nconst REMOVE_ICON_SIZE = 20;\n\nexport const ItemerGroupRow: React.FC<ItemerGroupRowProps> = ({\n children,\n onRemove,\n className,\n}) => {\n const { theme } = useResolvedTheme({});\n const {\n draggable,\n rowCount,\n minRows,\n removeIcon: RemoveIcon,\n columnWidths,\n } = useItemerGroupContext();\n\n const columns = React.Children.toArray(children);\n\n // `rowCount` is 0 when the row is rendered outside an `ItemerGroup` — the\n // group size is unknown there, so only hide the button when the group is\n // provably at its minimum row count.\n const isAtMinRows = rowCount > 0 && rowCount <= minRows;\n const showRemoveButton = Boolean(onRemove) && !isAtMinRows;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8} className={className}>\n {draggable && rowCount > 1 && (\n <Box\n data-drag-handle=\"true\"\n width={28}\n height={28}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n style={{ cursor: \"grab\" }}\n >\n <Drag size={20} color={theme.colors.content.tertiary} />\n </Box>\n )}\n <Box\n flex={1}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={4}\n minWidth={0}\n >\n {columns.map((child, index) => (\n <ItemerGroupColumn key={index} width={columnWidths?.[index]}>\n {child}\n </ItemerGroupColumn>\n ))}\n {showRemoveButton && (\n <IconButton\n aria-label=\"Remove row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onRemove}\n icon={<RemoveIcon size={REMOVE_ICON_SIZE} />}\n />\n )}\n </Box>\n </Box>\n );\n};\n\nItemerGroupRow.displayName = \"ItemerGroupRow\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, isWeb } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, useId } from \"@xsolla/xui-core\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport type { ItemerGroupFileCellProps } from \"./types\";\n\n// Figma \"ItemergGroupUploaderCell\": input-like chrome with 8px left / 12px\n// right padding and an 8px gap between the name and the meta text.\nconst PADDING_LEFT = 8;\nconst PADDING_RIGHT = 12;\nconst CONTENT_GAP = 8;\n// Mirrors the error outline `Input` draws — 1px pulled inside the border box\n// so the cell does not grow when it becomes invalid.\nconst ERROR_OUTLINE_WIDTH = 1;\nconst ERROR_OUTLINE_OFFSET = -1;\n\n/**\n * Read-only row content for an uploaded file — the file name on the left and\n * an optional meta text (typically the size) on the right, styled like a\n * `size=\"sm\"` input so it lines up with other controls in the group.\n *\n * The cell is non-interactive by design: the user cannot edit the file name\n * despite the input-like chrome. Pass `errorMessage` to surface file-level\n * validation (e.g. \"file is too large\") below the cell, matching how `Input`\n * renders its own errors.\n *\n * Pair it with `ItemerGroupPreview` for a thumbnail column and with the group's\n * `actions` slot for an \"Upload file\" button.\n */\nexport const ItemerGroupFileCell: React.FC<ItemerGroupFileCellProps> = ({\n name,\n meta,\n error,\n errorMessage,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const inputColors = theme.colors.control.input;\n const sizeStyles = theme.sizing.input(\"sm\");\n\n // Sanitize useId() output to remove colons (e.g. :r0: -> r0) so the value is\n // a valid HTML id and ARIA reference.\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const errorId = `itemer-group-file-cell-${safeId}-error`;\n\n const isError = !!(errorMessage || error);\n const outlineColor = isError ? theme.colors.border.alert : undefined;\n\n return (\n <Box flexDirection=\"column\" gap={sizeStyles.fieldGap} width=\"100%\">\n <Box\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"space-between\"\n gap={CONTENT_GAP}\n height={sizeStyles.height}\n paddingLeft={PADDING_LEFT}\n paddingRight={PADDING_RIGHT}\n backgroundColor={inputColors.bg}\n borderWidth={1}\n borderStyle=\"solid\"\n borderColor={inputColors.border}\n borderRadius={theme.shape.input.sm.borderRadius}\n minWidth={0}\n aria-invalid={isError || undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n className={className}\n testID={testID}\n style={\n outlineColor\n ? isWeb\n ? {\n outline: `${ERROR_OUTLINE_WIDTH}px solid ${outlineColor}`,\n outlineOffset: `${ERROR_OUTLINE_OFFSET}px`,\n }\n : {\n borderColor: outlineColor,\n borderWidth: ERROR_OUTLINE_WIDTH,\n }\n : undefined\n }\n >\n <Typography\n variant=\"bodySm\"\n color={inputColors.text}\n noWrap\n title={name}\n style={{ minWidth: 0 }}\n >\n {name}\n </Typography>\n {meta && (\n <Typography\n variant=\"bodySm\"\n color={inputColors.placeholder}\n noWrap\n style={{ flexShrink: 0 }}\n >\n {meta}\n </Typography>\n )}\n </Box>\n {errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n};\n\nItemerGroupFileCell.displayName = \"ItemerGroupFileCell\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Spinner } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { FileText } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupPreviewProps } from \"./types\";\n\n// Figma \"ItemerGroupPreview\" — a 16:9 thumbnail matching the 40px row height.\nconst ITEMER_GROUP_PREVIEW_WIDTH = 77;\nconst ITEMER_GROUP_PREVIEW_HEIGHT = 40;\nconst PREVIEW_RADIUS = 4;\nconst PLACEHOLDER_ICON_SIZE = 20;\n// The loading tile keeps the placeholder chrome and swaps the file icon for a\n// brand spinner, so the row does not resize while the preview resolves.\nconst SPINNER_SIZE = 18;\nconst SPINNER_STROKE_WIDTH = 2;\n\n/**\n * Fixed-size 77×40 thumbnail for a file row. Renders, in order of precedence:\n * a spinner while `loading`, the image when `src` is set, and a neutral\n * placeholder with a file icon otherwise.\n *\n * Because the size is fixed, give its column `\"auto\"` in the parent group's\n * `columnWidths` (e.g. `columnWidths={[\"auto\", 1]}`) so it does not stretch.\n */\nexport const ItemerGroupPreview: React.FC<ItemerGroupPreviewProps> = ({\n src,\n alt = \"\",\n loading = false,\n loadingLabel = \"Loading preview\",\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n // `loading` wins over `src` so a stale thumbnail is never shown while a new\n // one is being fetched.\n const showImage = !loading && Boolean(src);\n\n return (\n <Box\n width={ITEMER_GROUP_PREVIEW_WIDTH}\n height={ITEMER_GROUP_PREVIEW_HEIGHT}\n flexShrink={0}\n borderRadius={PREVIEW_RADIUS}\n overflow=\"hidden\"\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor={showImage ? undefined : theme.colors.overlay.mono}\n className={className}\n testID={testID}\n >\n {loading ? (\n <Spinner\n size={SPINNER_SIZE}\n strokeWidth={SPINNER_STROKE_WIDTH}\n color={theme.colors.content.brand.primary}\n aria-label={loadingLabel}\n />\n ) : showImage ? (\n <Box\n as=\"img\"\n src={src}\n alt={alt}\n width=\"100%\"\n height=\"100%\"\n style={{ objectFit: \"cover\", display: \"block\" }}\n />\n ) : (\n <FileText\n size={PLACEHOLDER_ICON_SIZE}\n color={theme.colors.content.tertiary}\n />\n )}\n </Box>\n );\n};\n\nItemerGroupPreview.displayName = \"ItemerGroupPreview\";\n"],"mappings":";AAAA,OAAO,SAAS,eAAe;;;ACC/B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OAMK;AAwMD;AArMN,IAAM,0BAA6D;AAAA,EACjE,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,KAAK;AAAA,EACL,OAAO;AAAA,EACP,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,OAAO;AAAA,EACP,SAAS;AAAA,EACT,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,MAAM;AAAA,EACN,cAAc;AAAA,EACd,aAAa;AAAA,EACb,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,KAAK;AAAA,EACL,MAAM;AAAA,EACN,UAAU;AAAA,EACV,MAAM;AAAA,EACN,OAAO;AACT;AAGA,IAAM,aAAa,CAAC,QAAyD;AAC3E,MAAI,QAAQ,OAAW,QAAO;AAC9B,MAAI,OAAO,QAAQ,SAAU,QAAO;AACpC,QAAM,UAAU,sBAAsB,KAAK,GAAG;AAC9C,MAAI,QAAS,QAAO,OAAO,QAAQ,CAAC,CAAC;AACrC,QAAM,WAAW,OAAO,GAAG;AAC3B,SAAO,OAAO,SAAS,QAAQ,IAAI,WAAW;AAChD;AAEO,IAAM,MAA0B,CAAC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,oBAAoB,CAAC,aAAkC;AAAA,IAC3D,iBACE,WAAW,YAAY,kBACnB,WAAW,kBACX;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS,YAAY,WAAW,MAAM;AAAA,IACtC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,KAAK,WAAW,GAAG;AAAA,IACnB,GAAI;AAAA,EACN;AAEA,QAAM,cAAc,cAAc;AAKlC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB,aAAa;AAAA,IACb,aAAa;AAAA,IACb;AAAA,IACA,eAAe;AAAA,IACf,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,GAAG;AAAA,EACL,IAAI;AAEJ,QAAM,oBACH,OAAO,SAAS,YAAY,wBAAwB,IAAI,MACxD,OAAO,WAAW,WAAW;AAChC,QAAM,aAAa,QAAQ,YAAY,YAAY;AACnD,QAAM,qBAAqB;AAAA,IACzB,UAAU,cAAc;AAAA,IACxB,MAAM,QAAQ,QAAQ,KAAK;AAAA,EAC7B;AACA,QAAM,0BACJ,aAAa,YAAY,aAAa,cAAc,WAAW;AAGjE,MAAI,OAAO,SAAS,KAAK;AACvB,UAAM,aAAyB;AAAA,MAC7B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAI;AAAA,IACN;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,QAAQ,EAAE,KAAK,IAAI;AAAA,QACnB,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,oBAAoB,OAAO,cAAc,WAAW,YAAY;AAAA,QAChE,YAAW;AAAA,QACV,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AAIA,MAAI,WAAW,OAAO,UAAU;AAC9B,WACE;AAAA,MAAC;AAAA;AAAA,QACC,SAAS,CAAC,cAAc,UAAU,UAAU;AAAA,QAC5C,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,OAAO,CAAC,EAAE,QAAQ,MAAM,kBAAkB,OAAO;AAAA,QACjD,QAAQ;AAAA,QACR;AAAA,QACA,oBACE,OAAO,cAAc,WAAW,YAAY;AAAA,QAE9C;AAAA,QACA;AAAA,QACC,GAAG;AAAA,QAEH;AAAA;AAAA,IACH;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,kBAAkB;AAAA,MACzB,QAAQ;AAAA,MACR;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,oBAAoB,OAAO,cAAc,WAAW,YAAY;AAAA,MAChE;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;;;AC3QA;AAAA,EACE,QAAQ;AAAA,EAGR;AAAA,OACK;AAqEH,gBAAAA,YAAA;AAlEJ,IAAM,UAA6C;AAAA,EACjD,OAAO;AAAA,EACP,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,MAAM;AACR;AAEA,IAAM,oBAAoB,CACxB,UACuB;AACvB,MAAI,UAAU,OAAW,QAAO;AAChC,MAAI,OAAO,UAAU,SAAU,QAAO;AACtC,QAAM,SAAS,WAAW,KAAK;AAC/B,SAAO,MAAM,MAAM,IAAI,SAAY;AACrC;AAEO,IAAM,OAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf,OAAO;AAAA,EACP,GAAG;AACL,MAAM;AACJ,MAAI,qBAAqB,aACrB,WAAW,MAAM,GAAG,EAAE,CAAC,EAAE,QAAQ,SAAS,EAAE,EAAE,KAAK,IACnD;AAEJ,MACE,uBAAuB,gBACvB,uBAAuB,qBACvB,uBAAuB,iBACvB;AACA,yBAAqB;AAAA,EACvB;AAEA,QAAM,gBAAgB,WAAW,QAAQ,SAAS;AAElD,QAAM,YAAuB;AAAA,IAC3B,OAAO,SAAS,eAAe;AAAA,IAC/B,UAAU,OAAO,aAAa,WAAW,WAAW;AAAA,IACpD;AAAA,IACA,YAAY;AAAA,IACZ,oBAAoB,MAAM;AAAA,IAC1B,WAAW,aAAa,eAAe;AAAA,IACvC,YAAY,kBAAkB,cAAc,eAAe,UAAU;AAAA,IACrE,WAAW;AAAA,MACT,eAAe;AAAA,IACjB;AAAA,IACA,cAAc;AAAA,MACZ,eAAe;AAAA,IACjB;AAAA,EACF;AAEA,QAAM,oBAAoB,OAAO,QAAQ,IAAI,IAAI;AAEjD,SACE,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP;AAAA,MACA,QAAQ,cAAc,UAAU;AAAA,MAChC;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;;;ACnFA,SAAS,mBAAmB,QAAAC,aAAY;AAyBlC,gBAAAC,YAAA;AAtBC,IAAM,UAAkC,CAAC;AAAA,EAC9C;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,aAAa;AAAA,EACb;AACF,MAAM;AACJ,SACE,gBAAAA;AAAA,IAACD;AAAA,IAAA;AAAA,MACC,YAAY;AAAA,MACZ,mBAAmB,SAAS,WAAW,SAAS;AAAA,MAChD,oBAAoB;AAAA,MACpB,yBACE,aAAa,WACT,WACA,aAAa,cACX,cACA;AAAA,MAER;AAAA,MAEA,0BAAAC;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,MAAM,OAAO,SAAS,WAAW,OAAO;AAAA;AAAA,MAC1C;AAAA;AAAA,EACF;AAEJ;AAEA,QAAQ,cAAc;;;ACzBf,IAAM,QAAQ;;;AJNrB,SAAS,wBAAwB;AACjC,SAAS,cAAc;AACvB,SAAS,kBAAkB;AAC3B,SAAS,MAAM,OAAO,UAAAC,eAAc;;;AKNpC,SAAS,eAAe,kBAAkB;AAC1C,SAAS,cAAc;AAmBhB,IAAM,qBAAqB,cAAuC;AAAA,EACvE,WAAW;AAAA,EACX,UAAU;AAAA,EACV,SAAS;AAAA,EACT,YAAY;AACd,CAAC;AAEM,IAAM,wBAAwB,MAAM,WAAW,kBAAkB;;;ACA7D,gBAAAC,YAAA;AALJ,IAAM,oBAAsD,CAAC;AAAA,EAClE;AAAA,EACA;AACF,MAAM;AACJ,MAAI,UAAU,QAAQ;AACpB,WAAO,gBAAAA,KAAC,OAAI,YAAY,GAAI,UAAS;AAAA,EACvC;AAEA,MAAI,OAAO,UAAU,UAAU;AAC7B,WACE,gBAAAA;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QACV,OAAO,EAAE,WAAW,OAAO,UAAU,GAAG,YAAY,EAAE;AAAA,QAErD;AAAA;AAAA,IACH;AAAA,EAEJ;AAEA,SACE,gBAAAA,KAAC,OAAI,MAAM,SAAS,GAAG,UAAU,GAC9B,UACH;AAEJ;AAEA,kBAAkB,cAAc;;;ANmBL,SAEjB,UAFiB,OAAAC,MAEjB,YAFiB;AAvD3B,IAAM,qBAAqB;AAE3B,IAAM,mBAAmB,CAAC,SACxB,SAAS,UAAU,QAAQC;AAEtB,IAAM,cAA0C,CAAC;AAAA,EACtD;AAAA,EACA,YAAY;AAAA,EACZ;AAAA,EACA,YAAY;AAAA,EACZ,UAAU;AAAA,EACV;AAAA,EACA,mBAAmB;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,MAAM,IAAI,iBAAiB,EAAE,WAAW,oBAAoB,CAAC;AACrE,QAAM,WAAW,MAAM,SAAS,QAAQ,QAAQ,EAAE;AAGlD,QAAM,cAAc,YAAY,UAAa,YAAY;AACzD,QAAM,uBACH,iBAAiB,QAAQ,KAAK,MAAM,CAAC;AACxC,QAAM,gBACJ,CAAC,gBAAgB,uBAAuB,QAAQ,OAAO;AACzD,QAAM,qBAAqB,cAAc,iBAAiB,gBAAgB;AAC1E,QAAM,eAAe;AAAA,IACnB,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA,YAAY;AAAA,MACZ;AAAA,IACF;AAAA,IACA,CAAC,WAAW,UAAU,SAAS,oBAAoB,YAAY;AAAA,EACjE;AAEA,QAAM,iBAAiB,aAAa,WAAW;AAG/C,QAAM,mBAAmB,WAAW;AAEpC,QAAM,cAAc,MAAM;AACxB,QAAI,CAAC,aAAa,CAAC,MAAO,QAAO;AAEjC,WACE,qBAAC,OAAI,eAAc,OAAM,YAAW,UAAS,KAAK,GAC/C;AAAA,wBAAkB,gBAAAD,KAAC,OAAI,OAAO,IAAI,YAAY,GAAG;AAAA,MACjD,MAAM,QAAQ,KAAK,IAClB,iCACE;AAAA,wBAAAA,KAAC,OAAI,MAAM,GAAG,eAAc,OAAM,YAAW,cAAa,KAAK,GAC5D,gBAAM,IAAI,CAAC,GAAG,MACb,gBAAAA,KAAC,qBAA0B,OAAO,eAAe,CAAC,GAChD,0BAAAA;AAAA,UAAC;AAAA;AAAA,YACC,SAAQ;AAAA,YACR,OAAO,MAAM,OAAO,QAAQ;AAAA,YAE3B;AAAA;AAAA,QACH,KANsB,CAOxB,CACD,GACH;AAAA,QACC,oBACC,gBAAAA,KAAC,OAAI,OAAO,oBAAoB,YAAY,GAAG;AAAA,SAEnD,IAEA,gBAAAA,KAAC,cAAW,SAAQ,UAAS,OAAO,MAAM,OAAO,QAAQ,WACtD,iBACH;AAAA,OAEJ;AAAA,EAEJ;AAEA,SACE,gBAAAA,KAAC,mBAAmB,UAAnB,EAA4B,OAAO,cAClC,+BAAC,OAAI,eAAc,UAAS,KAAK,GAAG,QAAgB,WAClD;AAAA,yBAAC,OAAI,eAAc,UAAS,KAAK,GAC9B;AAAA,kBAAY;AAAA,MACZ;AAAA,OACH;AAAA,IACC,iBACC,qBAAC,OAAI,eAAc,OAAM,YAAW,UAAS,KAAK,GAC/C;AAAA,wBAAkB,gBAAAA,KAAC,OAAI,OAAO,IAAI,YAAY,GAAG;AAAA,MACjD,uBACC,gBAAAA;AAAA,QAAC;AAAA;AAAA,UACC,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,MAAK;AAAA,UACL,WAAW,gBAAAA,KAAC,QAAK,MAAM,IAAI;AAAA,UAC3B,SAAS;AAAA,UAER;AAAA;AAAA,MACH;AAAA,MAED;AAAA,OACH;AAAA,KAEJ,GACF;AAEJ;AAEA,YAAY,cAAc;;;AO5H1B,OAAOE,YAAW;AAGlB,SAAS,oBAAAC,yBAAwB;AACjC,SAAS,kBAAkB;AAC3B,SAAS,YAAY;AAyCX,gBAAAC,MAGJ,QAAAC,aAHI;AApCV,IAAM,mBAAmB;AAElB,IAAM,iBAAgD,CAAC;AAAA,EAC5D;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,MAAM,IAAIC,kBAAiB,CAAC,CAAC;AACrC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ;AAAA,EACF,IAAI,sBAAsB;AAE1B,QAAM,UAAUC,OAAM,SAAS,QAAQ,QAAQ;AAK/C,QAAM,cAAc,WAAW,KAAK,YAAY;AAChD,QAAM,mBAAmB,QAAQ,QAAQ,KAAK,CAAC;AAE/C,SACE,gBAAAF,MAAC,OAAI,eAAc,OAAM,YAAW,UAAS,KAAK,GAAG,WAClD;AAAA,iBAAa,WAAW,KACvB,gBAAAD;AAAA,MAAC;AAAA;AAAA,QACC,oBAAiB;AAAA,QACjB,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,YAAW;AAAA,QACX,gBAAe;AAAA,QACf,YAAY;AAAA,QACZ,OAAO,EAAE,QAAQ,OAAO;AAAA,QAExB,0BAAAA,KAAC,QAAK,MAAM,IAAI,OAAO,MAAM,OAAO,QAAQ,UAAU;AAAA;AAAA,IACxD;AAAA,IAEF,gBAAAC;AAAA,MAAC;AAAA;AAAA,QACC,MAAM;AAAA,QACN,eAAc;AAAA,QACd,YAAW;AAAA,QACX,KAAK;AAAA,QACL,UAAU;AAAA,QAET;AAAA,kBAAQ,IAAI,CAAC,OAAO,UACnB,gBAAAD,KAAC,qBAA8B,OAAO,eAAe,KAAK,GACvD,mBADqB,KAExB,CACD;AAAA,UACA,oBACC,gBAAAA;AAAA,YAAC;AAAA;AAAA,cACC,cAAW;AAAA,cACX,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,MAAK;AAAA,cACL,SAAS;AAAA,cACT,MAAM,gBAAAA,KAAC,cAAW,MAAM,kBAAkB;AAAA;AAAA,UAC5C;AAAA;AAAA;AAAA,IAEJ;AAAA,KACF;AAEJ;AAEA,eAAe,cAAc;;;ACzE7B,SAAS,oBAAAI,mBAAkB,aAAa;AACxC,SAAS,cAAAC,mBAAkB;AAmDrB,SAgCE,OAAAC,MAhCF,QAAAC,aAAA;AA9CN,IAAM,eAAe;AACrB,IAAM,gBAAgB;AACtB,IAAM,cAAc;AAGpB,IAAM,sBAAsB;AAC5B,IAAM,uBAAuB;AAetB,IAAM,sBAA0D,CAAC;AAAA,EACtE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,MAAM,IAAIH,kBAAiB,EAAE,WAAW,oBAAoB,CAAC;AACrE,QAAM,cAAc,MAAM,OAAO,QAAQ;AACzC,QAAM,aAAa,MAAM,OAAO,MAAM,IAAI;AAI1C,QAAM,QAAQ,MAAM;AACpB,QAAM,SAAS,MAAM,QAAQ,MAAM,EAAE;AACrC,QAAM,UAAU,0BAA0B,MAAM;AAEhD,QAAM,UAAU,CAAC,EAAE,gBAAgB;AACnC,QAAM,eAAe,UAAU,MAAM,OAAO,OAAO,QAAQ;AAE3D,SACE,gBAAAG,MAAC,OAAI,eAAc,UAAS,KAAK,WAAW,UAAU,OAAM,QAC1D;AAAA,oBAAAA;AAAA,MAAC;AAAA;AAAA,QACC,eAAc;AAAA,QACd,YAAW;AAAA,QACX,gBAAe;AAAA,QACf,KAAK;AAAA,QACL,QAAQ,WAAW;AAAA,QACnB,aAAa;AAAA,QACb,cAAc;AAAA,QACd,iBAAiB,YAAY;AAAA,QAC7B,aAAa;AAAA,QACb,aAAY;AAAA,QACZ,aAAa,YAAY;AAAA,QACzB,cAAc,MAAM,MAAM,MAAM,GAAG;AAAA,QACnC,UAAU;AAAA,QACV,gBAAc,WAAW;AAAA,QACzB,oBAAkB,eAAe,UAAU;AAAA,QAC3C;AAAA,QACA;AAAA,QACA,OACE,eACI,QACE;AAAA,UACE,SAAS,GAAG,mBAAmB,YAAY,YAAY;AAAA,UACvD,eAAe,GAAG,oBAAoB;AAAA,QACxC,IACA;AAAA,UACE,aAAa;AAAA,UACb,aAAa;AAAA,QACf,IACF;AAAA,QAGN;AAAA,0BAAAD;AAAA,YAACD;AAAA,YAAA;AAAA,cACC,SAAQ;AAAA,cACR,OAAO,YAAY;AAAA,cACnB,QAAM;AAAA,cACN,OAAO;AAAA,cACP,OAAO,EAAE,UAAU,EAAE;AAAA,cAEpB;AAAA;AAAA,UACH;AAAA,UACC,QACC,gBAAAC;AAAA,YAACD;AAAA,YAAA;AAAA,cACC,SAAQ;AAAA,cACR,OAAO,YAAY;AAAA,cACnB,QAAM;AAAA,cACN,OAAO,EAAE,YAAY,EAAE;AAAA,cAEtB;AAAA;AAAA,UACH;AAAA;AAAA;AAAA,IAEJ;AAAA,IACC,gBACC,gBAAAC;AAAA,MAAC;AAAA;AAAA,QACC,IAAI;AAAA,QACJ,MAAK;AAAA,QACL,OAAO,MAAM,OAAO,QAAQ,MAAM;AAAA,QAClC,UAAU,WAAW,WAAW;AAAA,QAChC,OAAO,EAAE,YAAY,WAAW,aAAa,KAAK;AAAA,QAEjD;AAAA;AAAA,IACH;AAAA,KAEJ;AAEJ;AAEA,oBAAoB,cAAc;;;ACvHlC,SAAS,oBAAAE,yBAAwB;AACjC,SAAS,gBAAgB;AAmDjB,gBAAAC,YAAA;AA/CR,IAAM,6BAA6B;AACnC,IAAM,8BAA8B;AACpC,IAAM,iBAAiB;AACvB,IAAM,wBAAwB;AAG9B,IAAM,eAAe;AACrB,IAAM,uBAAuB;AAUtB,IAAM,qBAAwD,CAAC;AAAA,EACpE;AAAA,EACA,MAAM;AAAA,EACN,UAAU;AAAA,EACV,eAAe;AAAA,EACf;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,MAAM,IAAID,kBAAiB,EAAE,WAAW,oBAAoB,CAAC;AAIrE,QAAM,YAAY,CAAC,WAAW,QAAQ,GAAG;AAEzC,SACE,gBAAAC;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,YAAY;AAAA,MACZ,cAAc;AAAA,MACd,UAAS;AAAA,MACT,YAAW;AAAA,MACX,gBAAe;AAAA,MACf,iBAAiB,YAAY,SAAY,MAAM,OAAO,QAAQ;AAAA,MAC9D;AAAA,MACA;AAAA,MAEC,oBACC,gBAAAA;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,aAAa;AAAA,UACb,OAAO,MAAM,OAAO,QAAQ,MAAM;AAAA,UAClC,cAAY;AAAA;AAAA,MACd,IACE,YACF,gBAAAA;AAAA,QAAC;AAAA;AAAA,UACC,IAAG;AAAA,UACH;AAAA,UACA;AAAA,UACA,OAAM;AAAA,UACN,QAAO;AAAA,UACP,OAAO,EAAE,WAAW,SAAS,SAAS,QAAQ;AAAA;AAAA,MAChD,IAEA,gBAAAA;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,OAAO,MAAM,OAAO,QAAQ;AAAA;AAAA,MAC9B;AAAA;AAAA,EAEJ;AAEJ;AAEA,mBAAmB,cAAc;","names":["jsx","View","jsx","Remove","jsx","jsx","Remove","React","useResolvedTheme","jsx","jsxs","useResolvedTheme","React","useResolvedTheme","Typography","jsx","jsxs","useResolvedTheme","jsx"]}
|
|
1
|
+
{"version":3,"sources":["../../src/ItemerGroup.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx","../../../../foundation/primitives-native/src/Spinner.tsx","../../../../foundation/primitives-native/src/index.tsx","../../src/ItemerGroupContext.tsx","../../src/ItemerGroupColumn.tsx","../../src/ItemerGroupRow.tsx","../../src/ItemerGroupFileCell.tsx","../../src/ItemerGroupPreview.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { Button } from \"@xsolla/xui-button\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport { Plus, Minus, Remove } from \"@xsolla/xui-icons-base\";\nimport { ItemerGroupContext } from \"./ItemerGroupContext\";\nimport { ItemerGroupColumn } from \"./ItemerGroupColumn\";\nimport type { ItemerGroupProps, ItemerGroupRemoveButtonIcon } from \"./types\";\n\n// Size of the IconButton size=\"sm\" — used to reserve matching space in the label row\nconst REMOVE_BUTTON_SIZE = 40;\n\nconst removeIconByName = (name: ItemerGroupRemoveButtonIcon) =>\n name === \"minus\" ? Minus : Remove;\n\nexport const ItemerGroup: React.FC<ItemerGroupProps> = ({\n label,\n showLabel = true,\n children,\n draggable = false,\n minRows = 1,\n maxRows,\n removeButtonIcon = \"cross\",\n removeIcon,\n columnWidths,\n onAdd,\n addButtonLabel = \"Add line\",\n showAddButton,\n actions,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const rowCount = React.Children.toArray(children).length;\n // Figma: once the list is at its cap every \"add item\" affordance disappears —\n // the built-in add button and anything in `actions` (e.g. \"Upload file\").\n const isAtMaxRows = maxRows !== undefined && rowCount >= maxRows;\n const shouldShowAddButton =\n (showAddButton ?? Boolean(onAdd)) && !isAtMaxRows;\n const showActionRow =\n !isAtMaxRows && (shouldShowAddButton || Boolean(actions));\n const resolvedRemoveIcon = removeIcon ?? removeIconByName(removeButtonIcon);\n const contextValue = useMemo(\n () => ({\n draggable,\n rowCount,\n minRows,\n removeIcon: resolvedRemoveIcon,\n columnWidths,\n }),\n [draggable, rowCount, minRows, resolvedRemoveIcon, columnWidths]\n );\n\n const showDragSpacer = draggable && rowCount > 1;\n // Remove buttons are hidden while the group is at its minimum row count, so\n // the label row only reserves space for them while they can appear.\n const showRemoveSpacer = rowCount > minRows;\n\n const renderLabel = () => {\n if (!showLabel || !label) return null;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {Array.isArray(label) ? (\n <>\n <Box flex={1} flexDirection=\"row\" alignItems=\"flex-start\" gap={4}>\n {label.map((l, i) => (\n <ItemerGroupColumn key={i} width={columnWidths?.[i]}>\n <Typography\n variant=\"bodyXs\"\n color={theme.colors.content.secondary}\n >\n {l}\n </Typography>\n </ItemerGroupColumn>\n ))}\n </Box>\n {showRemoveSpacer && (\n <Box width={REMOVE_BUTTON_SIZE} flexShrink={0} />\n )}\n </>\n ) : (\n <Typography variant=\"bodyXs\" color={theme.colors.content.secondary}>\n {label}\n </Typography>\n )}\n </Box>\n );\n };\n\n return (\n <ItemerGroupContext.Provider value={contextValue}>\n <Box flexDirection=\"column\" gap={8} testID={testID} className={className}>\n <Box flexDirection=\"column\" gap={4}>\n {renderLabel()}\n {children}\n </Box>\n {showActionRow && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {shouldShowAddButton && (\n <Button\n variant=\"secondary\"\n tone=\"brand\"\n size=\"sm\"\n iconRight={<Plus size={16} />}\n onPress={onAdd}\n >\n {addButtonLabel}\n </Button>\n )}\n {actions}\n </Box>\n )}\n </Box>\n </ItemerGroupContext.Provider>\n );\n};\n\nItemerGroup.displayName = \"ItemerGroup\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n AccessibilityRole,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleToAccessibilityRole: Record<string, AccessibilityRole> = {\n button: \"button\",\n link: \"link\",\n img: \"image\",\n image: \"image\",\n summary: \"summary\",\n switch: \"switch\",\n checkbox: \"checkbox\",\n radio: \"radio\",\n heading: \"header\",\n text: \"text\",\n search: \"search\",\n alert: \"alert\",\n none: \"none\",\n presentation: \"none\",\n progressbar: \"progressbar\",\n scrollbar: \"scrollbar\",\n adjustable: \"adjustable\",\n tab: \"tab\",\n menu: \"menu\",\n menuitem: \"menuitem\",\n list: \"list\",\n timer: \"timer\",\n};\n\n/** RN ViewStyle.gap is typed as number (Yoga gap), not DimensionValue. */\nconst toGapValue = (gap: number | string | undefined): number | undefined => {\n if (gap === undefined) return undefined;\n if (typeof gap === \"number\") return gap;\n const pxMatch = /^(\\d+(?:\\.\\d+)?)px$/.exec(gap);\n if (pxMatch) return Number(pxMatch[1]);\n const asNumber = Number(gap);\n return Number.isFinite(asNumber) ? asNumber : undefined;\n};\n\n/**\n * Yoga has no inline formatting context, so RN's ViewStyle.display only\n * accepts \"flex\" | \"none\". Every inline-ish web value collapses to a plain\n * flex container — the box already fills only its content on native, which is\n * what those callers wanted on web anyway. Returning undefined (rather than\n * \"flex\") leaves RN's own default in place.\n */\nconst toNativeDisplay = (\n display: BoxProps[\"display\"]\n): ViewStyle[\"display\"] => (display === \"none\" ? \"none\" : undefined);\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n display,\n flexDirection,\n flexWrap,\n alignItems,\n justifyContent,\n alignSelf,\n position,\n top,\n bottom,\n left,\n right,\n width,\n minWidth,\n minHeight,\n maxWidth,\n maxHeight,\n flex,\n flexShrink,\n gap,\n overflow,\n opacity,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n disabled,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n opacity: opacity ?? (disabled ? 0.5 : undefined),\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n minWidth: minWidth as DimensionValue,\n minHeight: minHeight as DimensionValue,\n maxWidth: maxWidth as DimensionValue,\n maxHeight: maxHeight as DimensionValue,\n padding: padding as DimensionValue,\n paddingHorizontal: paddingHorizontal as DimensionValue,\n paddingVertical: paddingVertical as DimensionValue,\n margin: margin as DimensionValue,\n marginTop: marginTop as DimensionValue,\n marginBottom: marginBottom as DimensionValue,\n marginLeft: marginLeft as DimensionValue,\n marginRight: marginRight as DimensionValue,\n display: toNativeDisplay(display),\n flexDirection,\n flexWrap,\n alignItems,\n justifyContent,\n alignSelf,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n flexShrink,\n gap: toGapValue(gap),\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Map web a11y props; drop the rest of the web-only attributes before\n // spreading onto RN hosts (unknown props warn at runtime).\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n className,\n \"data-testid\": _dataTestId,\n cursor: _cursor,\n type: _type,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n const accessibilityRole =\n (typeof role === \"string\" && roleToAccessibilityRole[role]) ||\n (as === \"button\" ? \"button\" : undefined);\n const isDisabled = Boolean(disabled || ariaDisabled);\n const accessibilityState = {\n disabled: isDisabled || undefined,\n busy: Boolean(ariaBusy) || undefined,\n };\n const accessibilityLiveRegion =\n ariaLive === \"polite\" || ariaLive === \"assertive\" ? ariaLive : undefined;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n accessibilityLabel={typeof ariaLabel === \"string\" ? ariaLabel : alt}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n // Prefer Pressable whenever the node is interactive or explicitly a button,\n // so disabled / aria-disabled controls stay in the a11y tree as buttons.\n if (onPress || as === \"button\") {\n return (\n <Pressable\n onPress={!isDisabled && onPress ? onPress : undefined}\n disabled={isDisabled}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n accessibilityRole={accessibilityRole}\n accessibilityLabel={\n typeof ariaLabel === \"string\" ? ariaLabel : undefined\n }\n accessibilityState={accessibilityState}\n accessibilityLiveRegion={accessibilityLiveRegion}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n accessibilityRole={accessibilityRole}\n accessibilityLabel={typeof ariaLabel === \"string\" ? ariaLabel : undefined}\n accessibilityState={accessibilityState}\n accessibilityLiveRegion={accessibilityLiveRegion}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\n","import React from \"react\";\nimport {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string | number | undefined\n): number | undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n testID,\n \"data-testid\": dataTestId,\n style: styleProp,\n ...props\n}) => {\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n if (\n resolvedFontFamily === \"Pilat Wide\" ||\n resolvedFontFamily === \"Pilat Wide Bold\" ||\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const incomingStyle = StyleSheet.flatten(styleProp) as TextStyle | undefined;\n\n const baseStyle: TextStyle = {\n color: color ?? incomingStyle?.color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n textAlign: textAlign ?? incomingStyle?.textAlign,\n lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),\n marginTop: parseNumericValue(\n incomingStyle?.marginTop as number | string | undefined\n ),\n marginBottom: parseNumericValue(\n incomingStyle?.marginBottom as number | string | undefined\n ),\n };\n\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText\n style={baseStyle}\n numberOfLines={numberOfLines}\n testID={dataTestId || testID || id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","import type React from \"react\";\nimport { ActivityIndicator, View } from \"react-native\";\nimport type { SpinnerProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Spinner: React.FC<SpinnerProps> = ({\n color,\n size,\n role,\n \"aria-label\": ariaLabel,\n \"aria-live\": ariaLive,\n testID,\n}) => {\n return (\n <View\n accessible={true}\n accessibilityRole={role === \"status\" ? \"none\" : undefined}\n accessibilityLabel={ariaLabel}\n accessibilityLiveRegion={\n ariaLive === \"polite\"\n ? \"polite\"\n : ariaLive === \"assertive\"\n ? \"assertive\"\n : \"none\"\n }\n testID={testID}\n >\n <ActivityIndicator\n color={color}\n size={typeof size === \"number\" ? size : \"small\"}\n />\n </View>\n );\n};\n\nSpinner.displayName = \"Spinner\";\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 = false;\nexport const isNative = true;\n","import { createContext, useContext } from \"react\";\nimport { Remove } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupColumnWidth, ItemerGroupRemoveIcon } from \"./types\";\n\ninterface ItemerGroupContextValue {\n draggable: boolean;\n /**\n * Number of rows in the group. `0` means the row is rendered outside an\n * `ItemerGroup`, so the row count is unknown.\n */\n rowCount: number;\n /**\n * Minimum number of rows the group keeps. Remove buttons are hidden while\n * `rowCount <= minRows`.\n */\n minRows: number;\n removeIcon: ItemerGroupRemoveIcon;\n columnWidths?: ItemerGroupColumnWidth[];\n}\n\nexport const ItemerGroupContext = createContext<ItemerGroupContextValue>({\n draggable: false,\n rowCount: 0,\n minRows: 1,\n removeIcon: Remove,\n});\n\nexport const useItemerGroupContext = () => useContext(ItemerGroupContext);\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport type { ItemerGroupColumnWidth } from \"./types\";\n\ninterface ItemerGroupColumnProps {\n width?: ItemerGroupColumnWidth;\n children: React.ReactNode;\n}\n\n/**\n * Sizes one column of a row — a control in `ItemerGroupRow` or its header in\n * the label row. Both use this so headers always line up with their controls.\n *\n * - `width` omitted → `flex: 1`, i.e. every column takes an equal share.\n * - `number` → used as the flex grow factor.\n * - `\"auto\"` → the column keeps its control's intrinsic width and neither\n * grows nor shrinks (fixed-size controls such as `ItemerGroupPreview`).\n * - other `string` → used as `flex-basis` (e.g. `\"40%\"`). Columns may still\n * shrink, so percentages summing to 100% absorb the inter-column gaps\n * instead of overflowing the row.\n */\nexport const ItemerGroupColumn: React.FC<ItemerGroupColumnProps> = ({\n width,\n children,\n}) => {\n if (width === \"auto\") {\n return <Box flexShrink={0}>{children}</Box>;\n }\n\n if (typeof width === \"string\") {\n return (\n <Box\n minWidth={0}\n style={{ flexBasis: width, flexGrow: 0, flexShrink: 1 }}\n >\n {children}\n </Box>\n );\n }\n\n return (\n <Box flex={width ?? 1} minWidth={0}>\n {children}\n </Box>\n );\n};\n\nItemerGroupColumn.displayName = \"ItemerGroupColumn\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { IconButton } from \"@xsolla/xui-button\";\nimport { Drag } from \"@xsolla/xui-icons-base\";\nimport { useItemerGroupContext } from \"./ItemerGroupContext\";\nimport { ItemerGroupColumn } from \"./ItemerGroupColumn\";\nimport type { ItemerGroupRowProps } from \"./types\";\n\nconst REMOVE_ICON_SIZE = 20;\n\nexport const ItemerGroupRow: React.FC<ItemerGroupRowProps> = ({\n children,\n onRemove,\n className,\n}) => {\n const { theme } = useResolvedTheme({});\n const {\n draggable,\n rowCount,\n minRows,\n removeIcon: RemoveIcon,\n columnWidths,\n } = useItemerGroupContext();\n\n const columns = React.Children.toArray(children);\n\n // `rowCount` is 0 when the row is rendered outside an `ItemerGroup` — the\n // group size is unknown there, so only hide the button when the group is\n // provably at its minimum row count.\n const isAtMinRows = rowCount > 0 && rowCount <= minRows;\n const showRemoveButton = Boolean(onRemove) && !isAtMinRows;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8} className={className}>\n {draggable && rowCount > 1 && (\n <Box\n data-drag-handle=\"true\"\n width={28}\n height={28}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n style={{ cursor: \"grab\" }}\n >\n <Drag size={20} color={theme.colors.content.tertiary} />\n </Box>\n )}\n <Box\n flex={1}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={4}\n minWidth={0}\n >\n {columns.map((child, index) => (\n <ItemerGroupColumn key={index} width={columnWidths?.[index]}>\n {child}\n </ItemerGroupColumn>\n ))}\n {showRemoveButton && (\n <IconButton\n aria-label=\"Remove row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onRemove}\n icon={<RemoveIcon size={REMOVE_ICON_SIZE} />}\n />\n )}\n </Box>\n </Box>\n );\n};\n\nItemerGroupRow.displayName = \"ItemerGroupRow\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, isWeb } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, useId } from \"@xsolla/xui-core\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport type { ItemerGroupFileCellProps } from \"./types\";\n\n// Figma \"ItemergGroupUploaderCell\": input-like chrome with 8px left / 12px\n// right padding and an 8px gap between the name and the meta text.\nconst PADDING_LEFT = 8;\nconst PADDING_RIGHT = 12;\nconst CONTENT_GAP = 8;\n// Mirrors the error outline `Input` draws — 1px pulled inside the border box\n// so the cell does not grow when it becomes invalid.\nconst ERROR_OUTLINE_WIDTH = 1;\nconst ERROR_OUTLINE_OFFSET = -1;\n\n/**\n * Read-only row content for an uploaded file — the file name on the left and\n * an optional meta text (typically the size) on the right, styled like a\n * `size=\"sm\"` input so it lines up with other controls in the group.\n *\n * The cell is non-interactive by design: the user cannot edit the file name\n * despite the input-like chrome. Pass `errorMessage` to surface file-level\n * validation (e.g. \"file is too large\") below the cell, matching how `Input`\n * renders its own errors.\n *\n * Pair it with `ItemerGroupPreview` for a thumbnail column and with the group's\n * `actions` slot for an \"Upload file\" button.\n */\nexport const ItemerGroupFileCell: React.FC<ItemerGroupFileCellProps> = ({\n name,\n meta,\n error,\n errorMessage,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const inputColors = theme.colors.control.input;\n const sizeStyles = theme.sizing.input(\"sm\");\n\n // Sanitize useId() output to remove colons (e.g. :r0: -> r0) so the value is\n // a valid HTML id and ARIA reference.\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const errorId = `itemer-group-file-cell-${safeId}-error`;\n\n const isError = !!(errorMessage || error);\n const outlineColor = isError ? theme.colors.border.alert : undefined;\n\n return (\n <Box flexDirection=\"column\" gap={sizeStyles.fieldGap} width=\"100%\">\n <Box\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"space-between\"\n gap={CONTENT_GAP}\n height={sizeStyles.height}\n paddingLeft={PADDING_LEFT}\n paddingRight={PADDING_RIGHT}\n backgroundColor={inputColors.bg}\n borderWidth={1}\n borderStyle=\"solid\"\n borderColor={inputColors.border}\n borderRadius={theme.shape.input.sm.borderRadius}\n minWidth={0}\n aria-invalid={isError || undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n className={className}\n testID={testID}\n style={\n outlineColor\n ? isWeb\n ? {\n outline: `${ERROR_OUTLINE_WIDTH}px solid ${outlineColor}`,\n outlineOffset: `${ERROR_OUTLINE_OFFSET}px`,\n }\n : {\n borderColor: outlineColor,\n borderWidth: ERROR_OUTLINE_WIDTH,\n }\n : undefined\n }\n >\n <Typography\n variant=\"bodySm\"\n color={inputColors.text}\n noWrap\n title={name}\n style={{ minWidth: 0 }}\n >\n {name}\n </Typography>\n {meta && (\n <Typography\n variant=\"bodySm\"\n color={inputColors.placeholder}\n noWrap\n style={{ flexShrink: 0 }}\n >\n {meta}\n </Typography>\n )}\n </Box>\n {errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n};\n\nItemerGroupFileCell.displayName = \"ItemerGroupFileCell\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Spinner } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { FileText } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupPreviewProps } from \"./types\";\n\n// Figma \"ItemerGroupPreview\" — a 16:9 thumbnail matching the 40px row height.\nconst ITEMER_GROUP_PREVIEW_WIDTH = 77;\nconst ITEMER_GROUP_PREVIEW_HEIGHT = 40;\nconst PREVIEW_RADIUS = 4;\nconst PLACEHOLDER_ICON_SIZE = 20;\n// The loading tile keeps the placeholder chrome and swaps the file icon for a\n// brand spinner, so the row does not resize while the preview resolves.\nconst SPINNER_SIZE = 18;\nconst SPINNER_STROKE_WIDTH = 2;\n\n/**\n * Fixed-size 77×40 thumbnail for a file row. Renders, in order of precedence:\n * a spinner while `loading`, the image when `src` is set, and a neutral\n * placeholder with a file icon otherwise.\n *\n * Because the size is fixed, give its column `\"auto\"` in the parent group's\n * `columnWidths` (e.g. `columnWidths={[\"auto\", 1]}`) so it does not stretch.\n */\nexport const ItemerGroupPreview: React.FC<ItemerGroupPreviewProps> = ({\n src,\n alt = \"\",\n loading = false,\n loadingLabel = \"Loading preview\",\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n // `loading` wins over `src` so a stale thumbnail is never shown while a new\n // one is being fetched.\n const showImage = !loading && Boolean(src);\n\n return (\n <Box\n width={ITEMER_GROUP_PREVIEW_WIDTH}\n height={ITEMER_GROUP_PREVIEW_HEIGHT}\n flexShrink={0}\n borderRadius={PREVIEW_RADIUS}\n overflow=\"hidden\"\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor={showImage ? undefined : theme.colors.overlay.mono}\n className={className}\n testID={testID}\n >\n {loading ? (\n <Spinner\n size={SPINNER_SIZE}\n strokeWidth={SPINNER_STROKE_WIDTH}\n color={theme.colors.content.brand.primary}\n aria-label={loadingLabel}\n />\n ) : showImage ? (\n <Box\n as=\"img\"\n src={src}\n alt={alt}\n width=\"100%\"\n height=\"100%\"\n style={{ objectFit: \"cover\", display: \"block\" }}\n />\n ) : (\n <FileText\n size={PLACEHOLDER_ICON_SIZE}\n color={theme.colors.content.tertiary}\n />\n )}\n </Box>\n );\n};\n\nItemerGroupPreview.displayName = \"ItemerGroupPreview\";\n"],"mappings":"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","names":["jsx","View","jsx","Remove","jsx","jsx","Remove","React","useResolvedTheme","jsx","jsxs","useResolvedTheme","React","useResolvedTheme","Typography","jsx","jsxs","useResolvedTheme","jsx"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@xsolla/xui-b2b-itemer-group",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.219.0",
|
|
4
4
|
"main": "./web/index.js",
|
|
5
5
|
"module": "./web/index.mjs",
|
|
6
6
|
"types": "./web/index.d.ts",
|
|
@@ -13,11 +13,11 @@
|
|
|
13
13
|
"test:coverage": "vitest run --coverage"
|
|
14
14
|
},
|
|
15
15
|
"dependencies": {
|
|
16
|
-
"@xsolla/xui-button": "0.
|
|
17
|
-
"@xsolla/xui-core": "0.
|
|
18
|
-
"@xsolla/xui-icons-base": "0.
|
|
19
|
-
"@xsolla/xui-primitives-core": "0.
|
|
20
|
-
"@xsolla/xui-typography": "0.
|
|
16
|
+
"@xsolla/xui-button": "0.219.0",
|
|
17
|
+
"@xsolla/xui-core": "0.219.0",
|
|
18
|
+
"@xsolla/xui-icons-base": "0.219.0",
|
|
19
|
+
"@xsolla/xui-primitives-core": "0.219.0",
|
|
20
|
+
"@xsolla/xui-typography": "0.219.0"
|
|
21
21
|
},
|
|
22
22
|
"peerDependencies": {
|
|
23
23
|
"react": ">=16.8.0",
|
package/web/index.js
CHANGED
|
@@ -89,6 +89,10 @@ var ADDITIONAL_BLOCKED_PROPS = /* @__PURE__ */ new Set([
|
|
|
89
89
|
"fontWeight",
|
|
90
90
|
"fontFamily",
|
|
91
91
|
"textDecoration",
|
|
92
|
+
// `display` is a presentation attribute on SVG, so isPropValid lets it
|
|
93
|
+
// through — but Box consumes it purely as CSS. Without this it lands on the
|
|
94
|
+
// DOM node as a bogus `display="inline-flex"` attribute.
|
|
95
|
+
"display",
|
|
92
96
|
// Cross-platform layout prop that Text consumes as CSS, never as an
|
|
93
97
|
// attribute. Pinned explicitly because it is now spread into the styled
|
|
94
98
|
// component rather than destructured away before it can reach the DOM.
|
|
@@ -123,7 +127,7 @@ function createFilteredElement(defaultTag) {
|
|
|
123
127
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
124
128
|
var FilteredDiv = createFilteredElement("div");
|
|
125
129
|
var StyledBox = (0, import_styled_components.default)(FilteredDiv)`
|
|
126
|
-
display: flex;
|
|
130
|
+
display: ${(props) => props.display || "flex"};
|
|
127
131
|
box-sizing: border-box;
|
|
128
132
|
background-color: ${(props) => props.backgroundColor || "transparent"};
|
|
129
133
|
border-color: ${(props) => props.borderColor || "transparent"};
|
|
@@ -259,7 +263,7 @@ var Box = import_react2.default.forwardRef(
|
|
|
259
263
|
onLoad,
|
|
260
264
|
"data-testid": dataTestId || testID,
|
|
261
265
|
style: {
|
|
262
|
-
display: "block",
|
|
266
|
+
display: props.display || "block",
|
|
263
267
|
objectFit: "cover",
|
|
264
268
|
width: typeof props.width === "number" ? `${props.width}px` : props.width,
|
|
265
269
|
height: typeof props.height === "number" ? `${props.height}px` : props.height,
|
package/web/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/index.tsx","../../src/ItemerGroup.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/Spinner.tsx","../../../../foundation/primitives-web/src/index.tsx","../../src/ItemerGroupContext.tsx","../../src/ItemerGroupColumn.tsx","../../src/ItemerGroupRow.tsx","../../src/ItemerGroupFileCell.tsx","../../src/ItemerGroupPreview.tsx"],"sourcesContent":["export { ItemerGroup } from \"./ItemerGroup\";\nexport { ItemerGroupRow } from \"./ItemerGroupRow\";\nexport { ItemerGroupFileCell } from \"./ItemerGroupFileCell\";\nexport { ItemerGroupPreview } from \"./ItemerGroupPreview\";\nexport { ItemerGroupContext } from \"./ItemerGroupContext\";\nexport type {\n ItemerGroupProps,\n ItemerGroupRowProps,\n ItemerGroupFileCellProps,\n ItemerGroupPreviewProps,\n ItemerGroupRemoveIcon,\n ItemerGroupRemoveButtonIcon,\n ItemerGroupColumnWidth,\n} from \"./types\";\n","import React, { useMemo } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { Button } from \"@xsolla/xui-button\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport { Plus, Minus, Remove } from \"@xsolla/xui-icons-base\";\nimport { ItemerGroupContext } from \"./ItemerGroupContext\";\nimport { ItemerGroupColumn } from \"./ItemerGroupColumn\";\nimport type { ItemerGroupProps, ItemerGroupRemoveButtonIcon } from \"./types\";\n\n// Size of the IconButton size=\"sm\" — used to reserve matching space in the label row\nconst REMOVE_BUTTON_SIZE = 40;\n\nconst removeIconByName = (name: ItemerGroupRemoveButtonIcon) =>\n name === \"minus\" ? Minus : Remove;\n\nexport const ItemerGroup: React.FC<ItemerGroupProps> = ({\n label,\n showLabel = true,\n children,\n draggable = false,\n minRows = 1,\n maxRows,\n removeButtonIcon = \"cross\",\n removeIcon,\n columnWidths,\n onAdd,\n addButtonLabel = \"Add line\",\n showAddButton,\n actions,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const rowCount = React.Children.toArray(children).length;\n // Figma: once the list is at its cap every \"add item\" affordance disappears —\n // the built-in add button and anything in `actions` (e.g. \"Upload file\").\n const isAtMaxRows = maxRows !== undefined && rowCount >= maxRows;\n const shouldShowAddButton =\n (showAddButton ?? Boolean(onAdd)) && !isAtMaxRows;\n const showActionRow =\n !isAtMaxRows && (shouldShowAddButton || Boolean(actions));\n const resolvedRemoveIcon = removeIcon ?? removeIconByName(removeButtonIcon);\n const contextValue = useMemo(\n () => ({\n draggable,\n rowCount,\n minRows,\n removeIcon: resolvedRemoveIcon,\n columnWidths,\n }),\n [draggable, rowCount, minRows, resolvedRemoveIcon, columnWidths]\n );\n\n const showDragSpacer = draggable && rowCount > 1;\n // Remove buttons are hidden while the group is at its minimum row count, so\n // the label row only reserves space for them while they can appear.\n const showRemoveSpacer = rowCount > minRows;\n\n const renderLabel = () => {\n if (!showLabel || !label) return null;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {Array.isArray(label) ? (\n <>\n <Box flex={1} flexDirection=\"row\" alignItems=\"flex-start\" gap={4}>\n {label.map((l, i) => (\n <ItemerGroupColumn key={i} width={columnWidths?.[i]}>\n <Typography\n variant=\"bodyXs\"\n color={theme.colors.content.secondary}\n >\n {l}\n </Typography>\n </ItemerGroupColumn>\n ))}\n </Box>\n {showRemoveSpacer && (\n <Box width={REMOVE_BUTTON_SIZE} flexShrink={0} />\n )}\n </>\n ) : (\n <Typography variant=\"bodyXs\" color={theme.colors.content.secondary}>\n {label}\n </Typography>\n )}\n </Box>\n );\n };\n\n return (\n <ItemerGroupContext.Provider value={contextValue}>\n <Box flexDirection=\"column\" gap={8} testID={testID} className={className}>\n <Box flexDirection=\"column\" gap={4}>\n {renderLabel()}\n {children}\n </Box>\n {showActionRow && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {shouldShowAddButton && (\n <Button\n variant=\"secondary\"\n tone=\"brand\"\n size=\"sm\"\n iconRight={<Plus size={16} />}\n onPress={onAdd}\n >\n {addButtonLabel}\n </Button>\n )}\n {actions}\n </Box>\n )}\n </Box>\n </ItemerGroupContext.Provider>\n );\n};\n\nItemerGroup.displayName = \"ItemerGroup\";\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 /* Only emit overflow-x/y when explicitly set. Defaulting them to\n visible after overflow would override the shorthand and break\n clipping (e.g. OtherCard bottom-right promo image). */\n overflow: ${(props) => props.overflow || \"visible\"};\n ${(props) =>\n props.overflowX != null ? `overflow-x: ${props.overflowX};` : \"\"}\n ${(props) =>\n props.overflowY != null ? `overflow-y: ${props.overflowY};` : \"\"}\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) =>\n props.opacity != null ? props.opacity : props.disabled ? 0.5 : 1};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n /* \\`background\\` is emitted before \\`background-color\\` so a caller passing\n both still gets backgroundColor as the winner. Use the shorthand for a\n layered fill (e.g. an overlay tint over a resting surface colour), which\n a single background-color cannot express. */\n &:hover {\n ${(props) =>\n props.hoverStyle?.background &&\n `background: ${props.hoverStyle.background};`}\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?.background &&\n `background: ${props.pressStyle.background};`}\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 data-testid={dataTestId || testID}\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 \"opacity\",\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 from \"react\";\nimport styled, { keyframes } from \"styled-components\";\nimport type { SpinnerProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst rotate = keyframes`\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n`;\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledSpinner = styled(FilteredDiv)<SpinnerProps>`\n width: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n height: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n border: ${(props) => props.strokeWidth || 2}px solid\n ${(props) => props.color || \"currentColor\"};\n border-bottom-color: transparent;\n border-radius: 50%;\n display: inline-block;\n box-sizing: border-box;\n animation: ${rotate} 1s linear infinite;\n`;\n\nexport const Spinner: React.FC<SpinnerProps> = ({\n role = \"status\",\n \"aria-label\": ariaLabel,\n \"aria-live\": ariaLive = \"polite\",\n \"aria-describedby\": ariaDescribedBy,\n testID,\n ...props\n}) => {\n return (\n <StyledSpinner\n role={role}\n aria-label={ariaLabel}\n aria-live={ariaLive}\n aria-describedby={ariaDescribedBy}\n data-testid={testID}\n {...props}\n />\n );\n};\n\nSpinner.displayName = \"Spinner\";\n","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","import { createContext, useContext } from \"react\";\nimport { Remove } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupColumnWidth, ItemerGroupRemoveIcon } from \"./types\";\n\ninterface ItemerGroupContextValue {\n draggable: boolean;\n /**\n * Number of rows in the group. `0` means the row is rendered outside an\n * `ItemerGroup`, so the row count is unknown.\n */\n rowCount: number;\n /**\n * Minimum number of rows the group keeps. Remove buttons are hidden while\n * `rowCount <= minRows`.\n */\n minRows: number;\n removeIcon: ItemerGroupRemoveIcon;\n columnWidths?: ItemerGroupColumnWidth[];\n}\n\nexport const ItemerGroupContext = createContext<ItemerGroupContextValue>({\n draggable: false,\n rowCount: 0,\n minRows: 1,\n removeIcon: Remove,\n});\n\nexport const useItemerGroupContext = () => useContext(ItemerGroupContext);\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport type { ItemerGroupColumnWidth } from \"./types\";\n\ninterface ItemerGroupColumnProps {\n width?: ItemerGroupColumnWidth;\n children: React.ReactNode;\n}\n\n/**\n * Sizes one column of a row — a control in `ItemerGroupRow` or its header in\n * the label row. Both use this so headers always line up with their controls.\n *\n * - `width` omitted → `flex: 1`, i.e. every column takes an equal share.\n * - `number` → used as the flex grow factor.\n * - `\"auto\"` → the column keeps its control's intrinsic width and neither\n * grows nor shrinks (fixed-size controls such as `ItemerGroupPreview`).\n * - other `string` → used as `flex-basis` (e.g. `\"40%\"`). Columns may still\n * shrink, so percentages summing to 100% absorb the inter-column gaps\n * instead of overflowing the row.\n */\nexport const ItemerGroupColumn: React.FC<ItemerGroupColumnProps> = ({\n width,\n children,\n}) => {\n if (width === \"auto\") {\n return <Box flexShrink={0}>{children}</Box>;\n }\n\n if (typeof width === \"string\") {\n return (\n <Box\n minWidth={0}\n style={{ flexBasis: width, flexGrow: 0, flexShrink: 1 }}\n >\n {children}\n </Box>\n );\n }\n\n return (\n <Box flex={width ?? 1} minWidth={0}>\n {children}\n </Box>\n );\n};\n\nItemerGroupColumn.displayName = \"ItemerGroupColumn\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { IconButton } from \"@xsolla/xui-button\";\nimport { Drag } from \"@xsolla/xui-icons-base\";\nimport { useItemerGroupContext } from \"./ItemerGroupContext\";\nimport { ItemerGroupColumn } from \"./ItemerGroupColumn\";\nimport type { ItemerGroupRowProps } from \"./types\";\n\nconst REMOVE_ICON_SIZE = 20;\n\nexport const ItemerGroupRow: React.FC<ItemerGroupRowProps> = ({\n children,\n onRemove,\n className,\n}) => {\n const { theme } = useResolvedTheme({});\n const {\n draggable,\n rowCount,\n minRows,\n removeIcon: RemoveIcon,\n columnWidths,\n } = useItemerGroupContext();\n\n const columns = React.Children.toArray(children);\n\n // `rowCount` is 0 when the row is rendered outside an `ItemerGroup` — the\n // group size is unknown there, so only hide the button when the group is\n // provably at its minimum row count.\n const isAtMinRows = rowCount > 0 && rowCount <= minRows;\n const showRemoveButton = Boolean(onRemove) && !isAtMinRows;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8} className={className}>\n {draggable && rowCount > 1 && (\n <Box\n data-drag-handle=\"true\"\n width={28}\n height={28}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n style={{ cursor: \"grab\" }}\n >\n <Drag size={20} color={theme.colors.content.tertiary} />\n </Box>\n )}\n <Box\n flex={1}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={4}\n minWidth={0}\n >\n {columns.map((child, index) => (\n <ItemerGroupColumn key={index} width={columnWidths?.[index]}>\n {child}\n </ItemerGroupColumn>\n ))}\n {showRemoveButton && (\n <IconButton\n aria-label=\"Remove row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onRemove}\n icon={<RemoveIcon size={REMOVE_ICON_SIZE} />}\n />\n )}\n </Box>\n </Box>\n );\n};\n\nItemerGroupRow.displayName = \"ItemerGroupRow\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, isWeb } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, useId } from \"@xsolla/xui-core\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport type { ItemerGroupFileCellProps } from \"./types\";\n\n// Figma \"ItemergGroupUploaderCell\": input-like chrome with 8px left / 12px\n// right padding and an 8px gap between the name and the meta text.\nconst PADDING_LEFT = 8;\nconst PADDING_RIGHT = 12;\nconst CONTENT_GAP = 8;\n// Mirrors the error outline `Input` draws — 1px pulled inside the border box\n// so the cell does not grow when it becomes invalid.\nconst ERROR_OUTLINE_WIDTH = 1;\nconst ERROR_OUTLINE_OFFSET = -1;\n\n/**\n * Read-only row content for an uploaded file — the file name on the left and\n * an optional meta text (typically the size) on the right, styled like a\n * `size=\"sm\"` input so it lines up with other controls in the group.\n *\n * The cell is non-interactive by design: the user cannot edit the file name\n * despite the input-like chrome. Pass `errorMessage` to surface file-level\n * validation (e.g. \"file is too large\") below the cell, matching how `Input`\n * renders its own errors.\n *\n * Pair it with `ItemerGroupPreview` for a thumbnail column and with the group's\n * `actions` slot for an \"Upload file\" button.\n */\nexport const ItemerGroupFileCell: React.FC<ItemerGroupFileCellProps> = ({\n name,\n meta,\n error,\n errorMessage,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const inputColors = theme.colors.control.input;\n const sizeStyles = theme.sizing.input(\"sm\");\n\n // Sanitize useId() output to remove colons (e.g. :r0: -> r0) so the value is\n // a valid HTML id and ARIA reference.\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const errorId = `itemer-group-file-cell-${safeId}-error`;\n\n const isError = !!(errorMessage || error);\n const outlineColor = isError ? theme.colors.border.alert : undefined;\n\n return (\n <Box flexDirection=\"column\" gap={sizeStyles.fieldGap} width=\"100%\">\n <Box\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"space-between\"\n gap={CONTENT_GAP}\n height={sizeStyles.height}\n paddingLeft={PADDING_LEFT}\n paddingRight={PADDING_RIGHT}\n backgroundColor={inputColors.bg}\n borderWidth={1}\n borderStyle=\"solid\"\n borderColor={inputColors.border}\n borderRadius={theme.shape.input.sm.borderRadius}\n minWidth={0}\n aria-invalid={isError || undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n className={className}\n testID={testID}\n style={\n outlineColor\n ? isWeb\n ? {\n outline: `${ERROR_OUTLINE_WIDTH}px solid ${outlineColor}`,\n outlineOffset: `${ERROR_OUTLINE_OFFSET}px`,\n }\n : {\n borderColor: outlineColor,\n borderWidth: ERROR_OUTLINE_WIDTH,\n }\n : undefined\n }\n >\n <Typography\n variant=\"bodySm\"\n color={inputColors.text}\n noWrap\n title={name}\n style={{ minWidth: 0 }}\n >\n {name}\n </Typography>\n {meta && (\n <Typography\n variant=\"bodySm\"\n color={inputColors.placeholder}\n noWrap\n style={{ flexShrink: 0 }}\n >\n {meta}\n </Typography>\n )}\n </Box>\n {errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n};\n\nItemerGroupFileCell.displayName = \"ItemerGroupFileCell\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Spinner } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { FileText } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupPreviewProps } from \"./types\";\n\n// Figma \"ItemerGroupPreview\" — a 16:9 thumbnail matching the 40px row height.\nconst ITEMER_GROUP_PREVIEW_WIDTH = 77;\nconst ITEMER_GROUP_PREVIEW_HEIGHT = 40;\nconst PREVIEW_RADIUS = 4;\nconst PLACEHOLDER_ICON_SIZE = 20;\n// The loading tile keeps the placeholder chrome and swaps the file icon for a\n// brand spinner, so the row does not resize while the preview resolves.\nconst SPINNER_SIZE = 18;\nconst SPINNER_STROKE_WIDTH = 2;\n\n/**\n * Fixed-size 77×40 thumbnail for a file row. Renders, in order of precedence:\n * a spinner while `loading`, the image when `src` is set, and a neutral\n * placeholder with a file icon otherwise.\n *\n * Because the size is fixed, give its column `\"auto\"` in the parent group's\n * `columnWidths` (e.g. `columnWidths={[\"auto\", 1]}`) so it does not stretch.\n */\nexport const ItemerGroupPreview: React.FC<ItemerGroupPreviewProps> = ({\n src,\n alt = \"\",\n loading = false,\n loadingLabel = \"Loading preview\",\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n // `loading` wins over `src` so a stale thumbnail is never shown while a new\n // one is being fetched.\n const showImage = !loading && Boolean(src);\n\n return (\n <Box\n width={ITEMER_GROUP_PREVIEW_WIDTH}\n height={ITEMER_GROUP_PREVIEW_HEIGHT}\n flexShrink={0}\n borderRadius={PREVIEW_RADIUS}\n overflow=\"hidden\"\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor={showImage ? undefined : theme.colors.overlay.mono}\n className={className}\n testID={testID}\n >\n {loading ? (\n <Spinner\n size={SPINNER_SIZE}\n strokeWidth={SPINNER_STROKE_WIDTH}\n color={theme.colors.content.brand.primary}\n aria-label={loadingLabel}\n />\n ) : showImage ? (\n <Box\n as=\"img\"\n src={src}\n alt={alt}\n width=\"100%\"\n height=\"100%\"\n style={{ objectFit: \"cover\", display: \"block\" }}\n />\n ) : (\n <FileText\n size={PLACEHOLDER_ICON_SIZE}\n color={theme.colors.content.tertiary}\n />\n )}\n </Box>\n );\n};\n\nItemerGroupPreview.displayName = \"ItemerGroupPreview\";\n"],"mappings":"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","names":["import_react","import_react","React","styled","React","import_styled_components","import_jsx_runtime","styled","import_styled_components","import_jsx_runtime","FilteredDiv","styled","import_xui_icons_base","import_react","import_jsx_runtime","import_jsx_runtime","React","import_react","import_xui_core","import_xui_button","import_xui_icons_base","import_jsx_runtime","React","index","import_xui_core","import_xui_typography","import_jsx_runtime","import_xui_core","import_xui_icons_base","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../../src/index.tsx","../../src/ItemerGroup.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/Spinner.tsx","../../../../foundation/primitives-web/src/index.tsx","../../src/ItemerGroupContext.tsx","../../src/ItemerGroupColumn.tsx","../../src/ItemerGroupRow.tsx","../../src/ItemerGroupFileCell.tsx","../../src/ItemerGroupPreview.tsx"],"sourcesContent":["export { ItemerGroup } from \"./ItemerGroup\";\nexport { ItemerGroupRow } from \"./ItemerGroupRow\";\nexport { ItemerGroupFileCell } from \"./ItemerGroupFileCell\";\nexport { ItemerGroupPreview } from \"./ItemerGroupPreview\";\nexport { ItemerGroupContext } from \"./ItemerGroupContext\";\nexport type {\n ItemerGroupProps,\n ItemerGroupRowProps,\n ItemerGroupFileCellProps,\n ItemerGroupPreviewProps,\n ItemerGroupRemoveIcon,\n ItemerGroupRemoveButtonIcon,\n ItemerGroupColumnWidth,\n} from \"./types\";\n","import React, { useMemo } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { Button } from \"@xsolla/xui-button\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport { Plus, Minus, Remove } from \"@xsolla/xui-icons-base\";\nimport { ItemerGroupContext } from \"./ItemerGroupContext\";\nimport { ItemerGroupColumn } from \"./ItemerGroupColumn\";\nimport type { ItemerGroupProps, ItemerGroupRemoveButtonIcon } from \"./types\";\n\n// Size of the IconButton size=\"sm\" — used to reserve matching space in the label row\nconst REMOVE_BUTTON_SIZE = 40;\n\nconst removeIconByName = (name: ItemerGroupRemoveButtonIcon) =>\n name === \"minus\" ? Minus : Remove;\n\nexport const ItemerGroup: React.FC<ItemerGroupProps> = ({\n label,\n showLabel = true,\n children,\n draggable = false,\n minRows = 1,\n maxRows,\n removeButtonIcon = \"cross\",\n removeIcon,\n columnWidths,\n onAdd,\n addButtonLabel = \"Add line\",\n showAddButton,\n actions,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const rowCount = React.Children.toArray(children).length;\n // Figma: once the list is at its cap every \"add item\" affordance disappears —\n // the built-in add button and anything in `actions` (e.g. \"Upload file\").\n const isAtMaxRows = maxRows !== undefined && rowCount >= maxRows;\n const shouldShowAddButton =\n (showAddButton ?? Boolean(onAdd)) && !isAtMaxRows;\n const showActionRow =\n !isAtMaxRows && (shouldShowAddButton || Boolean(actions));\n const resolvedRemoveIcon = removeIcon ?? removeIconByName(removeButtonIcon);\n const contextValue = useMemo(\n () => ({\n draggable,\n rowCount,\n minRows,\n removeIcon: resolvedRemoveIcon,\n columnWidths,\n }),\n [draggable, rowCount, minRows, resolvedRemoveIcon, columnWidths]\n );\n\n const showDragSpacer = draggable && rowCount > 1;\n // Remove buttons are hidden while the group is at its minimum row count, so\n // the label row only reserves space for them while they can appear.\n const showRemoveSpacer = rowCount > minRows;\n\n const renderLabel = () => {\n if (!showLabel || !label) return null;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {Array.isArray(label) ? (\n <>\n <Box flex={1} flexDirection=\"row\" alignItems=\"flex-start\" gap={4}>\n {label.map((l, i) => (\n <ItemerGroupColumn key={i} width={columnWidths?.[i]}>\n <Typography\n variant=\"bodyXs\"\n color={theme.colors.content.secondary}\n >\n {l}\n </Typography>\n </ItemerGroupColumn>\n ))}\n </Box>\n {showRemoveSpacer && (\n <Box width={REMOVE_BUTTON_SIZE} flexShrink={0} />\n )}\n </>\n ) : (\n <Typography variant=\"bodyXs\" color={theme.colors.content.secondary}>\n {label}\n </Typography>\n )}\n </Box>\n );\n };\n\n return (\n <ItemerGroupContext.Provider value={contextValue}>\n <Box flexDirection=\"column\" gap={8} testID={testID} className={className}>\n <Box flexDirection=\"column\" gap={4}>\n {renderLabel()}\n {children}\n </Box>\n {showActionRow && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {shouldShowAddButton && (\n <Button\n variant=\"secondary\"\n tone=\"brand\"\n size=\"sm\"\n iconRight={<Plus size={16} />}\n onPress={onAdd}\n >\n {addButtonLabel}\n </Button>\n )}\n {actions}\n </Box>\n )}\n </Box>\n </ItemerGroupContext.Provider>\n );\n};\n\nItemerGroup.displayName = \"ItemerGroup\";\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: ${(props) => props.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 /* Only emit overflow-x/y when explicitly set. Defaulting them to\n visible after overflow would override the shorthand and break\n clipping (e.g. OtherCard bottom-right promo image). */\n overflow: ${(props) => props.overflow || \"visible\"};\n ${(props) =>\n props.overflowX != null ? `overflow-x: ${props.overflowX};` : \"\"}\n ${(props) =>\n props.overflowY != null ? `overflow-y: ${props.overflowY};` : \"\"}\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) =>\n props.opacity != null ? props.opacity : props.disabled ? 0.5 : 1};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n /* \\`background\\` is emitted before \\`background-color\\` so a caller passing\n both still gets backgroundColor as the winner. Use the shorthand for a\n layered fill (e.g. an overlay tint over a resting surface colour), which\n a single background-color cannot express. */\n &:hover {\n ${(props) =>\n props.hoverStyle?.background &&\n `background: ${props.hoverStyle.background};`}\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?.background &&\n `background: ${props.pressStyle.background};`}\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 data-testid={dataTestId || testID}\n style={{\n display: props.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 \"opacity\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n // `display` is a presentation attribute on SVG, so isPropValid lets it\n // through — but Box consumes it purely as CSS. Without this it lands on the\n // DOM node as a bogus `display=\"inline-flex\"` attribute.\n \"display\",\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 from \"react\";\nimport styled, { keyframes } from \"styled-components\";\nimport type { SpinnerProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst rotate = keyframes`\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n`;\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledSpinner = styled(FilteredDiv)<SpinnerProps>`\n width: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n height: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n border: ${(props) => props.strokeWidth || 2}px solid\n ${(props) => props.color || \"currentColor\"};\n border-bottom-color: transparent;\n border-radius: 50%;\n display: inline-block;\n box-sizing: border-box;\n animation: ${rotate} 1s linear infinite;\n`;\n\nexport const Spinner: React.FC<SpinnerProps> = ({\n role = \"status\",\n \"aria-label\": ariaLabel,\n \"aria-live\": ariaLive = \"polite\",\n \"aria-describedby\": ariaDescribedBy,\n testID,\n ...props\n}) => {\n return (\n <StyledSpinner\n role={role}\n aria-label={ariaLabel}\n aria-live={ariaLive}\n aria-describedby={ariaDescribedBy}\n data-testid={testID}\n {...props}\n />\n );\n};\n\nSpinner.displayName = \"Spinner\";\n","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","import { createContext, useContext } from \"react\";\nimport { Remove } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupColumnWidth, ItemerGroupRemoveIcon } from \"./types\";\n\ninterface ItemerGroupContextValue {\n draggable: boolean;\n /**\n * Number of rows in the group. `0` means the row is rendered outside an\n * `ItemerGroup`, so the row count is unknown.\n */\n rowCount: number;\n /**\n * Minimum number of rows the group keeps. Remove buttons are hidden while\n * `rowCount <= minRows`.\n */\n minRows: number;\n removeIcon: ItemerGroupRemoveIcon;\n columnWidths?: ItemerGroupColumnWidth[];\n}\n\nexport const ItemerGroupContext = createContext<ItemerGroupContextValue>({\n draggable: false,\n rowCount: 0,\n minRows: 1,\n removeIcon: Remove,\n});\n\nexport const useItemerGroupContext = () => useContext(ItemerGroupContext);\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport type { ItemerGroupColumnWidth } from \"./types\";\n\ninterface ItemerGroupColumnProps {\n width?: ItemerGroupColumnWidth;\n children: React.ReactNode;\n}\n\n/**\n * Sizes one column of a row — a control in `ItemerGroupRow` or its header in\n * the label row. Both use this so headers always line up with their controls.\n *\n * - `width` omitted → `flex: 1`, i.e. every column takes an equal share.\n * - `number` → used as the flex grow factor.\n * - `\"auto\"` → the column keeps its control's intrinsic width and neither\n * grows nor shrinks (fixed-size controls such as `ItemerGroupPreview`).\n * - other `string` → used as `flex-basis` (e.g. `\"40%\"`). Columns may still\n * shrink, so percentages summing to 100% absorb the inter-column gaps\n * instead of overflowing the row.\n */\nexport const ItemerGroupColumn: React.FC<ItemerGroupColumnProps> = ({\n width,\n children,\n}) => {\n if (width === \"auto\") {\n return <Box flexShrink={0}>{children}</Box>;\n }\n\n if (typeof width === \"string\") {\n return (\n <Box\n minWidth={0}\n style={{ flexBasis: width, flexGrow: 0, flexShrink: 1 }}\n >\n {children}\n </Box>\n );\n }\n\n return (\n <Box flex={width ?? 1} minWidth={0}>\n {children}\n </Box>\n );\n};\n\nItemerGroupColumn.displayName = \"ItemerGroupColumn\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { IconButton } from \"@xsolla/xui-button\";\nimport { Drag } from \"@xsolla/xui-icons-base\";\nimport { useItemerGroupContext } from \"./ItemerGroupContext\";\nimport { ItemerGroupColumn } from \"./ItemerGroupColumn\";\nimport type { ItemerGroupRowProps } from \"./types\";\n\nconst REMOVE_ICON_SIZE = 20;\n\nexport const ItemerGroupRow: React.FC<ItemerGroupRowProps> = ({\n children,\n onRemove,\n className,\n}) => {\n const { theme } = useResolvedTheme({});\n const {\n draggable,\n rowCount,\n minRows,\n removeIcon: RemoveIcon,\n columnWidths,\n } = useItemerGroupContext();\n\n const columns = React.Children.toArray(children);\n\n // `rowCount` is 0 when the row is rendered outside an `ItemerGroup` — the\n // group size is unknown there, so only hide the button when the group is\n // provably at its minimum row count.\n const isAtMinRows = rowCount > 0 && rowCount <= minRows;\n const showRemoveButton = Boolean(onRemove) && !isAtMinRows;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8} className={className}>\n {draggable && rowCount > 1 && (\n <Box\n data-drag-handle=\"true\"\n width={28}\n height={28}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n style={{ cursor: \"grab\" }}\n >\n <Drag size={20} color={theme.colors.content.tertiary} />\n </Box>\n )}\n <Box\n flex={1}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={4}\n minWidth={0}\n >\n {columns.map((child, index) => (\n <ItemerGroupColumn key={index} width={columnWidths?.[index]}>\n {child}\n </ItemerGroupColumn>\n ))}\n {showRemoveButton && (\n <IconButton\n aria-label=\"Remove row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onRemove}\n icon={<RemoveIcon size={REMOVE_ICON_SIZE} />}\n />\n )}\n </Box>\n </Box>\n );\n};\n\nItemerGroupRow.displayName = \"ItemerGroupRow\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, isWeb } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, useId } from \"@xsolla/xui-core\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport type { ItemerGroupFileCellProps } from \"./types\";\n\n// Figma \"ItemergGroupUploaderCell\": input-like chrome with 8px left / 12px\n// right padding and an 8px gap between the name and the meta text.\nconst PADDING_LEFT = 8;\nconst PADDING_RIGHT = 12;\nconst CONTENT_GAP = 8;\n// Mirrors the error outline `Input` draws — 1px pulled inside the border box\n// so the cell does not grow when it becomes invalid.\nconst ERROR_OUTLINE_WIDTH = 1;\nconst ERROR_OUTLINE_OFFSET = -1;\n\n/**\n * Read-only row content for an uploaded file — the file name on the left and\n * an optional meta text (typically the size) on the right, styled like a\n * `size=\"sm\"` input so it lines up with other controls in the group.\n *\n * The cell is non-interactive by design: the user cannot edit the file name\n * despite the input-like chrome. Pass `errorMessage` to surface file-level\n * validation (e.g. \"file is too large\") below the cell, matching how `Input`\n * renders its own errors.\n *\n * Pair it with `ItemerGroupPreview` for a thumbnail column and with the group's\n * `actions` slot for an \"Upload file\" button.\n */\nexport const ItemerGroupFileCell: React.FC<ItemerGroupFileCellProps> = ({\n name,\n meta,\n error,\n errorMessage,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const inputColors = theme.colors.control.input;\n const sizeStyles = theme.sizing.input(\"sm\");\n\n // Sanitize useId() output to remove colons (e.g. :r0: -> r0) so the value is\n // a valid HTML id and ARIA reference.\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const errorId = `itemer-group-file-cell-${safeId}-error`;\n\n const isError = !!(errorMessage || error);\n const outlineColor = isError ? theme.colors.border.alert : undefined;\n\n return (\n <Box flexDirection=\"column\" gap={sizeStyles.fieldGap} width=\"100%\">\n <Box\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"space-between\"\n gap={CONTENT_GAP}\n height={sizeStyles.height}\n paddingLeft={PADDING_LEFT}\n paddingRight={PADDING_RIGHT}\n backgroundColor={inputColors.bg}\n borderWidth={1}\n borderStyle=\"solid\"\n borderColor={inputColors.border}\n borderRadius={theme.shape.input.sm.borderRadius}\n minWidth={0}\n aria-invalid={isError || undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n className={className}\n testID={testID}\n style={\n outlineColor\n ? isWeb\n ? {\n outline: `${ERROR_OUTLINE_WIDTH}px solid ${outlineColor}`,\n outlineOffset: `${ERROR_OUTLINE_OFFSET}px`,\n }\n : {\n borderColor: outlineColor,\n borderWidth: ERROR_OUTLINE_WIDTH,\n }\n : undefined\n }\n >\n <Typography\n variant=\"bodySm\"\n color={inputColors.text}\n noWrap\n title={name}\n style={{ minWidth: 0 }}\n >\n {name}\n </Typography>\n {meta && (\n <Typography\n variant=\"bodySm\"\n color={inputColors.placeholder}\n noWrap\n style={{ flexShrink: 0 }}\n >\n {meta}\n </Typography>\n )}\n </Box>\n {errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n};\n\nItemerGroupFileCell.displayName = \"ItemerGroupFileCell\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Spinner } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { FileText } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupPreviewProps } from \"./types\";\n\n// Figma \"ItemerGroupPreview\" — a 16:9 thumbnail matching the 40px row height.\nconst ITEMER_GROUP_PREVIEW_WIDTH = 77;\nconst ITEMER_GROUP_PREVIEW_HEIGHT = 40;\nconst PREVIEW_RADIUS = 4;\nconst PLACEHOLDER_ICON_SIZE = 20;\n// The loading tile keeps the placeholder chrome and swaps the file icon for a\n// brand spinner, so the row does not resize while the preview resolves.\nconst SPINNER_SIZE = 18;\nconst SPINNER_STROKE_WIDTH = 2;\n\n/**\n * Fixed-size 77×40 thumbnail for a file row. Renders, in order of precedence:\n * a spinner while `loading`, the image when `src` is set, and a neutral\n * placeholder with a file icon otherwise.\n *\n * Because the size is fixed, give its column `\"auto\"` in the parent group's\n * `columnWidths` (e.g. `columnWidths={[\"auto\", 1]}`) so it does not stretch.\n */\nexport const ItemerGroupPreview: React.FC<ItemerGroupPreviewProps> = ({\n src,\n alt = \"\",\n loading = false,\n loadingLabel = \"Loading preview\",\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n // `loading` wins over `src` so a stale thumbnail is never shown while a new\n // one is being fetched.\n const showImage = !loading && Boolean(src);\n\n return (\n <Box\n width={ITEMER_GROUP_PREVIEW_WIDTH}\n height={ITEMER_GROUP_PREVIEW_HEIGHT}\n flexShrink={0}\n borderRadius={PREVIEW_RADIUS}\n overflow=\"hidden\"\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor={showImage ? undefined : theme.colors.overlay.mono}\n className={className}\n testID={testID}\n >\n {loading ? (\n <Spinner\n size={SPINNER_SIZE}\n strokeWidth={SPINNER_STROKE_WIDTH}\n color={theme.colors.content.brand.primary}\n aria-label={loadingLabel}\n />\n ) : showImage ? (\n <Box\n as=\"img\"\n src={src}\n alt={alt}\n width=\"100%\"\n height=\"100%\"\n style={{ objectFit: \"cover\", display: \"block\" }}\n />\n ) : (\n <FileText\n size={PLACEHOLDER_ICON_SIZE}\n color={theme.colors.content.tertiary}\n />\n )}\n </Box>\n );\n};\n\nItemerGroupPreview.displayName = \"ItemerGroupPreview\";\n"],"mappings":"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","names":["import_react","import_react","React","styled","React","import_styled_components","import_jsx_runtime","styled","import_styled_components","import_jsx_runtime","FilteredDiv","styled","import_xui_icons_base","import_react","import_jsx_runtime","import_jsx_runtime","React","import_react","import_xui_core","import_xui_button","import_xui_icons_base","import_jsx_runtime","React","index","import_xui_core","import_xui_typography","import_jsx_runtime","import_xui_core","import_xui_icons_base","import_jsx_runtime"]}
|
package/web/index.mjs
CHANGED
|
@@ -49,6 +49,10 @@ var ADDITIONAL_BLOCKED_PROPS = /* @__PURE__ */ new Set([
|
|
|
49
49
|
"fontWeight",
|
|
50
50
|
"fontFamily",
|
|
51
51
|
"textDecoration",
|
|
52
|
+
// `display` is a presentation attribute on SVG, so isPropValid lets it
|
|
53
|
+
// through — but Box consumes it purely as CSS. Without this it lands on the
|
|
54
|
+
// DOM node as a bogus `display="inline-flex"` attribute.
|
|
55
|
+
"display",
|
|
52
56
|
// Cross-platform layout prop that Text consumes as CSS, never as an
|
|
53
57
|
// attribute. Pinned explicitly because it is now spread into the styled
|
|
54
58
|
// component rather than destructured away before it can reach the DOM.
|
|
@@ -83,7 +87,7 @@ function createFilteredElement(defaultTag) {
|
|
|
83
87
|
import { jsx } from "react/jsx-runtime";
|
|
84
88
|
var FilteredDiv = createFilteredElement("div");
|
|
85
89
|
var StyledBox = styled(FilteredDiv)`
|
|
86
|
-
display: flex;
|
|
90
|
+
display: ${(props) => props.display || "flex"};
|
|
87
91
|
box-sizing: border-box;
|
|
88
92
|
background-color: ${(props) => props.backgroundColor || "transparent"};
|
|
89
93
|
border-color: ${(props) => props.borderColor || "transparent"};
|
|
@@ -219,7 +223,7 @@ var Box = React2.forwardRef(
|
|
|
219
223
|
onLoad,
|
|
220
224
|
"data-testid": dataTestId || testID,
|
|
221
225
|
style: {
|
|
222
|
-
display: "block",
|
|
226
|
+
display: props.display || "block",
|
|
223
227
|
objectFit: "cover",
|
|
224
228
|
width: typeof props.width === "number" ? `${props.width}px` : props.width,
|
|
225
229
|
height: typeof props.height === "number" ? `${props.height}px` : props.height,
|
package/web/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/ItemerGroup.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/Spinner.tsx","../../../../foundation/primitives-web/src/index.tsx","../../src/ItemerGroupContext.tsx","../../src/ItemerGroupColumn.tsx","../../src/ItemerGroupRow.tsx","../../src/ItemerGroupFileCell.tsx","../../src/ItemerGroupPreview.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { Button } from \"@xsolla/xui-button\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport { Plus, Minus, Remove } from \"@xsolla/xui-icons-base\";\nimport { ItemerGroupContext } from \"./ItemerGroupContext\";\nimport { ItemerGroupColumn } from \"./ItemerGroupColumn\";\nimport type { ItemerGroupProps, ItemerGroupRemoveButtonIcon } from \"./types\";\n\n// Size of the IconButton size=\"sm\" — used to reserve matching space in the label row\nconst REMOVE_BUTTON_SIZE = 40;\n\nconst removeIconByName = (name: ItemerGroupRemoveButtonIcon) =>\n name === \"minus\" ? Minus : Remove;\n\nexport const ItemerGroup: React.FC<ItemerGroupProps> = ({\n label,\n showLabel = true,\n children,\n draggable = false,\n minRows = 1,\n maxRows,\n removeButtonIcon = \"cross\",\n removeIcon,\n columnWidths,\n onAdd,\n addButtonLabel = \"Add line\",\n showAddButton,\n actions,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const rowCount = React.Children.toArray(children).length;\n // Figma: once the list is at its cap every \"add item\" affordance disappears —\n // the built-in add button and anything in `actions` (e.g. \"Upload file\").\n const isAtMaxRows = maxRows !== undefined && rowCount >= maxRows;\n const shouldShowAddButton =\n (showAddButton ?? Boolean(onAdd)) && !isAtMaxRows;\n const showActionRow =\n !isAtMaxRows && (shouldShowAddButton || Boolean(actions));\n const resolvedRemoveIcon = removeIcon ?? removeIconByName(removeButtonIcon);\n const contextValue = useMemo(\n () => ({\n draggable,\n rowCount,\n minRows,\n removeIcon: resolvedRemoveIcon,\n columnWidths,\n }),\n [draggable, rowCount, minRows, resolvedRemoveIcon, columnWidths]\n );\n\n const showDragSpacer = draggable && rowCount > 1;\n // Remove buttons are hidden while the group is at its minimum row count, so\n // the label row only reserves space for them while they can appear.\n const showRemoveSpacer = rowCount > minRows;\n\n const renderLabel = () => {\n if (!showLabel || !label) return null;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {Array.isArray(label) ? (\n <>\n <Box flex={1} flexDirection=\"row\" alignItems=\"flex-start\" gap={4}>\n {label.map((l, i) => (\n <ItemerGroupColumn key={i} width={columnWidths?.[i]}>\n <Typography\n variant=\"bodyXs\"\n color={theme.colors.content.secondary}\n >\n {l}\n </Typography>\n </ItemerGroupColumn>\n ))}\n </Box>\n {showRemoveSpacer && (\n <Box width={REMOVE_BUTTON_SIZE} flexShrink={0} />\n )}\n </>\n ) : (\n <Typography variant=\"bodyXs\" color={theme.colors.content.secondary}>\n {label}\n </Typography>\n )}\n </Box>\n );\n };\n\n return (\n <ItemerGroupContext.Provider value={contextValue}>\n <Box flexDirection=\"column\" gap={8} testID={testID} className={className}>\n <Box flexDirection=\"column\" gap={4}>\n {renderLabel()}\n {children}\n </Box>\n {showActionRow && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {shouldShowAddButton && (\n <Button\n variant=\"secondary\"\n tone=\"brand\"\n size=\"sm\"\n iconRight={<Plus size={16} />}\n onPress={onAdd}\n >\n {addButtonLabel}\n </Button>\n )}\n {actions}\n </Box>\n )}\n </Box>\n </ItemerGroupContext.Provider>\n );\n};\n\nItemerGroup.displayName = \"ItemerGroup\";\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 /* Only emit overflow-x/y when explicitly set. Defaulting them to\n visible after overflow would override the shorthand and break\n clipping (e.g. OtherCard bottom-right promo image). */\n overflow: ${(props) => props.overflow || \"visible\"};\n ${(props) =>\n props.overflowX != null ? `overflow-x: ${props.overflowX};` : \"\"}\n ${(props) =>\n props.overflowY != null ? `overflow-y: ${props.overflowY};` : \"\"}\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) =>\n props.opacity != null ? props.opacity : props.disabled ? 0.5 : 1};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n /* \\`background\\` is emitted before \\`background-color\\` so a caller passing\n both still gets backgroundColor as the winner. Use the shorthand for a\n layered fill (e.g. an overlay tint over a resting surface colour), which\n a single background-color cannot express. */\n &:hover {\n ${(props) =>\n props.hoverStyle?.background &&\n `background: ${props.hoverStyle.background};`}\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?.background &&\n `background: ${props.pressStyle.background};`}\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 data-testid={dataTestId || testID}\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 \"opacity\",\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 from \"react\";\nimport styled, { keyframes } from \"styled-components\";\nimport type { SpinnerProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst rotate = keyframes`\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n`;\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledSpinner = styled(FilteredDiv)<SpinnerProps>`\n width: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n height: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n border: ${(props) => props.strokeWidth || 2}px solid\n ${(props) => props.color || \"currentColor\"};\n border-bottom-color: transparent;\n border-radius: 50%;\n display: inline-block;\n box-sizing: border-box;\n animation: ${rotate} 1s linear infinite;\n`;\n\nexport const Spinner: React.FC<SpinnerProps> = ({\n role = \"status\",\n \"aria-label\": ariaLabel,\n \"aria-live\": ariaLive = \"polite\",\n \"aria-describedby\": ariaDescribedBy,\n testID,\n ...props\n}) => {\n return (\n <StyledSpinner\n role={role}\n aria-label={ariaLabel}\n aria-live={ariaLive}\n aria-describedby={ariaDescribedBy}\n data-testid={testID}\n {...props}\n />\n );\n};\n\nSpinner.displayName = \"Spinner\";\n","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","import { createContext, useContext } from \"react\";\nimport { Remove } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupColumnWidth, ItemerGroupRemoveIcon } from \"./types\";\n\ninterface ItemerGroupContextValue {\n draggable: boolean;\n /**\n * Number of rows in the group. `0` means the row is rendered outside an\n * `ItemerGroup`, so the row count is unknown.\n */\n rowCount: number;\n /**\n * Minimum number of rows the group keeps. Remove buttons are hidden while\n * `rowCount <= minRows`.\n */\n minRows: number;\n removeIcon: ItemerGroupRemoveIcon;\n columnWidths?: ItemerGroupColumnWidth[];\n}\n\nexport const ItemerGroupContext = createContext<ItemerGroupContextValue>({\n draggable: false,\n rowCount: 0,\n minRows: 1,\n removeIcon: Remove,\n});\n\nexport const useItemerGroupContext = () => useContext(ItemerGroupContext);\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport type { ItemerGroupColumnWidth } from \"./types\";\n\ninterface ItemerGroupColumnProps {\n width?: ItemerGroupColumnWidth;\n children: React.ReactNode;\n}\n\n/**\n * Sizes one column of a row — a control in `ItemerGroupRow` or its header in\n * the label row. Both use this so headers always line up with their controls.\n *\n * - `width` omitted → `flex: 1`, i.e. every column takes an equal share.\n * - `number` → used as the flex grow factor.\n * - `\"auto\"` → the column keeps its control's intrinsic width and neither\n * grows nor shrinks (fixed-size controls such as `ItemerGroupPreview`).\n * - other `string` → used as `flex-basis` (e.g. `\"40%\"`). Columns may still\n * shrink, so percentages summing to 100% absorb the inter-column gaps\n * instead of overflowing the row.\n */\nexport const ItemerGroupColumn: React.FC<ItemerGroupColumnProps> = ({\n width,\n children,\n}) => {\n if (width === \"auto\") {\n return <Box flexShrink={0}>{children}</Box>;\n }\n\n if (typeof width === \"string\") {\n return (\n <Box\n minWidth={0}\n style={{ flexBasis: width, flexGrow: 0, flexShrink: 1 }}\n >\n {children}\n </Box>\n );\n }\n\n return (\n <Box flex={width ?? 1} minWidth={0}>\n {children}\n </Box>\n );\n};\n\nItemerGroupColumn.displayName = \"ItemerGroupColumn\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { IconButton } from \"@xsolla/xui-button\";\nimport { Drag } from \"@xsolla/xui-icons-base\";\nimport { useItemerGroupContext } from \"./ItemerGroupContext\";\nimport { ItemerGroupColumn } from \"./ItemerGroupColumn\";\nimport type { ItemerGroupRowProps } from \"./types\";\n\nconst REMOVE_ICON_SIZE = 20;\n\nexport const ItemerGroupRow: React.FC<ItemerGroupRowProps> = ({\n children,\n onRemove,\n className,\n}) => {\n const { theme } = useResolvedTheme({});\n const {\n draggable,\n rowCount,\n minRows,\n removeIcon: RemoveIcon,\n columnWidths,\n } = useItemerGroupContext();\n\n const columns = React.Children.toArray(children);\n\n // `rowCount` is 0 when the row is rendered outside an `ItemerGroup` — the\n // group size is unknown there, so only hide the button when the group is\n // provably at its minimum row count.\n const isAtMinRows = rowCount > 0 && rowCount <= minRows;\n const showRemoveButton = Boolean(onRemove) && !isAtMinRows;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8} className={className}>\n {draggable && rowCount > 1 && (\n <Box\n data-drag-handle=\"true\"\n width={28}\n height={28}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n style={{ cursor: \"grab\" }}\n >\n <Drag size={20} color={theme.colors.content.tertiary} />\n </Box>\n )}\n <Box\n flex={1}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={4}\n minWidth={0}\n >\n {columns.map((child, index) => (\n <ItemerGroupColumn key={index} width={columnWidths?.[index]}>\n {child}\n </ItemerGroupColumn>\n ))}\n {showRemoveButton && (\n <IconButton\n aria-label=\"Remove row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onRemove}\n icon={<RemoveIcon size={REMOVE_ICON_SIZE} />}\n />\n )}\n </Box>\n </Box>\n );\n};\n\nItemerGroupRow.displayName = \"ItemerGroupRow\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, isWeb } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, useId } from \"@xsolla/xui-core\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport type { ItemerGroupFileCellProps } from \"./types\";\n\n// Figma \"ItemergGroupUploaderCell\": input-like chrome with 8px left / 12px\n// right padding and an 8px gap between the name and the meta text.\nconst PADDING_LEFT = 8;\nconst PADDING_RIGHT = 12;\nconst CONTENT_GAP = 8;\n// Mirrors the error outline `Input` draws — 1px pulled inside the border box\n// so the cell does not grow when it becomes invalid.\nconst ERROR_OUTLINE_WIDTH = 1;\nconst ERROR_OUTLINE_OFFSET = -1;\n\n/**\n * Read-only row content for an uploaded file — the file name on the left and\n * an optional meta text (typically the size) on the right, styled like a\n * `size=\"sm\"` input so it lines up with other controls in the group.\n *\n * The cell is non-interactive by design: the user cannot edit the file name\n * despite the input-like chrome. Pass `errorMessage` to surface file-level\n * validation (e.g. \"file is too large\") below the cell, matching how `Input`\n * renders its own errors.\n *\n * Pair it with `ItemerGroupPreview` for a thumbnail column and with the group's\n * `actions` slot for an \"Upload file\" button.\n */\nexport const ItemerGroupFileCell: React.FC<ItemerGroupFileCellProps> = ({\n name,\n meta,\n error,\n errorMessage,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const inputColors = theme.colors.control.input;\n const sizeStyles = theme.sizing.input(\"sm\");\n\n // Sanitize useId() output to remove colons (e.g. :r0: -> r0) so the value is\n // a valid HTML id and ARIA reference.\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const errorId = `itemer-group-file-cell-${safeId}-error`;\n\n const isError = !!(errorMessage || error);\n const outlineColor = isError ? theme.colors.border.alert : undefined;\n\n return (\n <Box flexDirection=\"column\" gap={sizeStyles.fieldGap} width=\"100%\">\n <Box\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"space-between\"\n gap={CONTENT_GAP}\n height={sizeStyles.height}\n paddingLeft={PADDING_LEFT}\n paddingRight={PADDING_RIGHT}\n backgroundColor={inputColors.bg}\n borderWidth={1}\n borderStyle=\"solid\"\n borderColor={inputColors.border}\n borderRadius={theme.shape.input.sm.borderRadius}\n minWidth={0}\n aria-invalid={isError || undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n className={className}\n testID={testID}\n style={\n outlineColor\n ? isWeb\n ? {\n outline: `${ERROR_OUTLINE_WIDTH}px solid ${outlineColor}`,\n outlineOffset: `${ERROR_OUTLINE_OFFSET}px`,\n }\n : {\n borderColor: outlineColor,\n borderWidth: ERROR_OUTLINE_WIDTH,\n }\n : undefined\n }\n >\n <Typography\n variant=\"bodySm\"\n color={inputColors.text}\n noWrap\n title={name}\n style={{ minWidth: 0 }}\n >\n {name}\n </Typography>\n {meta && (\n <Typography\n variant=\"bodySm\"\n color={inputColors.placeholder}\n noWrap\n style={{ flexShrink: 0 }}\n >\n {meta}\n </Typography>\n )}\n </Box>\n {errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n};\n\nItemerGroupFileCell.displayName = \"ItemerGroupFileCell\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Spinner } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { FileText } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupPreviewProps } from \"./types\";\n\n// Figma \"ItemerGroupPreview\" — a 16:9 thumbnail matching the 40px row height.\nconst ITEMER_GROUP_PREVIEW_WIDTH = 77;\nconst ITEMER_GROUP_PREVIEW_HEIGHT = 40;\nconst PREVIEW_RADIUS = 4;\nconst PLACEHOLDER_ICON_SIZE = 20;\n// The loading tile keeps the placeholder chrome and swaps the file icon for a\n// brand spinner, so the row does not resize while the preview resolves.\nconst SPINNER_SIZE = 18;\nconst SPINNER_STROKE_WIDTH = 2;\n\n/**\n * Fixed-size 77×40 thumbnail for a file row. Renders, in order of precedence:\n * a spinner while `loading`, the image when `src` is set, and a neutral\n * placeholder with a file icon otherwise.\n *\n * Because the size is fixed, give its column `\"auto\"` in the parent group's\n * `columnWidths` (e.g. `columnWidths={[\"auto\", 1]}`) so it does not stretch.\n */\nexport const ItemerGroupPreview: React.FC<ItemerGroupPreviewProps> = ({\n src,\n alt = \"\",\n loading = false,\n loadingLabel = \"Loading preview\",\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n // `loading` wins over `src` so a stale thumbnail is never shown while a new\n // one is being fetched.\n const showImage = !loading && Boolean(src);\n\n return (\n <Box\n width={ITEMER_GROUP_PREVIEW_WIDTH}\n height={ITEMER_GROUP_PREVIEW_HEIGHT}\n flexShrink={0}\n borderRadius={PREVIEW_RADIUS}\n overflow=\"hidden\"\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor={showImage ? undefined : theme.colors.overlay.mono}\n className={className}\n testID={testID}\n >\n {loading ? (\n <Spinner\n size={SPINNER_SIZE}\n strokeWidth={SPINNER_STROKE_WIDTH}\n color={theme.colors.content.brand.primary}\n aria-label={loadingLabel}\n />\n ) : showImage ? (\n <Box\n as=\"img\"\n src={src}\n alt={alt}\n width=\"100%\"\n height=\"100%\"\n style={{ objectFit: \"cover\", display: \"block\" }}\n />\n ) : (\n <FileText\n size={PLACEHOLDER_ICON_SIZE}\n color={theme.colors.content.tertiary}\n />\n )}\n </Box>\n );\n};\n\nItemerGroupPreview.displayName = \"ItemerGroupPreview\";\n"],"mappings":"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","names":["React","React","React","styled","jsx","styled","styled","jsx","FilteredDiv","styled","Remove","jsx","jsx","Remove","React","React","useResolvedTheme","jsx","jsxs","useResolvedTheme","React","index","useResolvedTheme","Typography","jsx","jsxs","useResolvedTheme","jsx"]}
|
|
1
|
+
{"version":3,"sources":["../../src/ItemerGroup.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/Spinner.tsx","../../../../foundation/primitives-web/src/index.tsx","../../src/ItemerGroupContext.tsx","../../src/ItemerGroupColumn.tsx","../../src/ItemerGroupRow.tsx","../../src/ItemerGroupFileCell.tsx","../../src/ItemerGroupPreview.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { Button } from \"@xsolla/xui-button\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport { Plus, Minus, Remove } from \"@xsolla/xui-icons-base\";\nimport { ItemerGroupContext } from \"./ItemerGroupContext\";\nimport { ItemerGroupColumn } from \"./ItemerGroupColumn\";\nimport type { ItemerGroupProps, ItemerGroupRemoveButtonIcon } from \"./types\";\n\n// Size of the IconButton size=\"sm\" — used to reserve matching space in the label row\nconst REMOVE_BUTTON_SIZE = 40;\n\nconst removeIconByName = (name: ItemerGroupRemoveButtonIcon) =>\n name === \"minus\" ? Minus : Remove;\n\nexport const ItemerGroup: React.FC<ItemerGroupProps> = ({\n label,\n showLabel = true,\n children,\n draggable = false,\n minRows = 1,\n maxRows,\n removeButtonIcon = \"cross\",\n removeIcon,\n columnWidths,\n onAdd,\n addButtonLabel = \"Add line\",\n showAddButton,\n actions,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const rowCount = React.Children.toArray(children).length;\n // Figma: once the list is at its cap every \"add item\" affordance disappears —\n // the built-in add button and anything in `actions` (e.g. \"Upload file\").\n const isAtMaxRows = maxRows !== undefined && rowCount >= maxRows;\n const shouldShowAddButton =\n (showAddButton ?? Boolean(onAdd)) && !isAtMaxRows;\n const showActionRow =\n !isAtMaxRows && (shouldShowAddButton || Boolean(actions));\n const resolvedRemoveIcon = removeIcon ?? removeIconByName(removeButtonIcon);\n const contextValue = useMemo(\n () => ({\n draggable,\n rowCount,\n minRows,\n removeIcon: resolvedRemoveIcon,\n columnWidths,\n }),\n [draggable, rowCount, minRows, resolvedRemoveIcon, columnWidths]\n );\n\n const showDragSpacer = draggable && rowCount > 1;\n // Remove buttons are hidden while the group is at its minimum row count, so\n // the label row only reserves space for them while they can appear.\n const showRemoveSpacer = rowCount > minRows;\n\n const renderLabel = () => {\n if (!showLabel || !label) return null;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {Array.isArray(label) ? (\n <>\n <Box flex={1} flexDirection=\"row\" alignItems=\"flex-start\" gap={4}>\n {label.map((l, i) => (\n <ItemerGroupColumn key={i} width={columnWidths?.[i]}>\n <Typography\n variant=\"bodyXs\"\n color={theme.colors.content.secondary}\n >\n {l}\n </Typography>\n </ItemerGroupColumn>\n ))}\n </Box>\n {showRemoveSpacer && (\n <Box width={REMOVE_BUTTON_SIZE} flexShrink={0} />\n )}\n </>\n ) : (\n <Typography variant=\"bodyXs\" color={theme.colors.content.secondary}>\n {label}\n </Typography>\n )}\n </Box>\n );\n };\n\n return (\n <ItemerGroupContext.Provider value={contextValue}>\n <Box flexDirection=\"column\" gap={8} testID={testID} className={className}>\n <Box flexDirection=\"column\" gap={4}>\n {renderLabel()}\n {children}\n </Box>\n {showActionRow && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {shouldShowAddButton && (\n <Button\n variant=\"secondary\"\n tone=\"brand\"\n size=\"sm\"\n iconRight={<Plus size={16} />}\n onPress={onAdd}\n >\n {addButtonLabel}\n </Button>\n )}\n {actions}\n </Box>\n )}\n </Box>\n </ItemerGroupContext.Provider>\n );\n};\n\nItemerGroup.displayName = \"ItemerGroup\";\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: ${(props) => props.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 /* Only emit overflow-x/y when explicitly set. Defaulting them to\n visible after overflow would override the shorthand and break\n clipping (e.g. OtherCard bottom-right promo image). */\n overflow: ${(props) => props.overflow || \"visible\"};\n ${(props) =>\n props.overflowX != null ? `overflow-x: ${props.overflowX};` : \"\"}\n ${(props) =>\n props.overflowY != null ? `overflow-y: ${props.overflowY};` : \"\"}\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) =>\n props.opacity != null ? props.opacity : props.disabled ? 0.5 : 1};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n /* \\`background\\` is emitted before \\`background-color\\` so a caller passing\n both still gets backgroundColor as the winner. Use the shorthand for a\n layered fill (e.g. an overlay tint over a resting surface colour), which\n a single background-color cannot express. */\n &:hover {\n ${(props) =>\n props.hoverStyle?.background &&\n `background: ${props.hoverStyle.background};`}\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?.background &&\n `background: ${props.pressStyle.background};`}\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 data-testid={dataTestId || testID}\n style={{\n display: props.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 \"opacity\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n // `display` is a presentation attribute on SVG, so isPropValid lets it\n // through — but Box consumes it purely as CSS. Without this it lands on the\n // DOM node as a bogus `display=\"inline-flex\"` attribute.\n \"display\",\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 from \"react\";\nimport styled, { keyframes } from \"styled-components\";\nimport type { SpinnerProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst rotate = keyframes`\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n`;\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledSpinner = styled(FilteredDiv)<SpinnerProps>`\n width: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n height: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n border: ${(props) => props.strokeWidth || 2}px solid\n ${(props) => props.color || \"currentColor\"};\n border-bottom-color: transparent;\n border-radius: 50%;\n display: inline-block;\n box-sizing: border-box;\n animation: ${rotate} 1s linear infinite;\n`;\n\nexport const Spinner: React.FC<SpinnerProps> = ({\n role = \"status\",\n \"aria-label\": ariaLabel,\n \"aria-live\": ariaLive = \"polite\",\n \"aria-describedby\": ariaDescribedBy,\n testID,\n ...props\n}) => {\n return (\n <StyledSpinner\n role={role}\n aria-label={ariaLabel}\n aria-live={ariaLive}\n aria-describedby={ariaDescribedBy}\n data-testid={testID}\n {...props}\n />\n );\n};\n\nSpinner.displayName = \"Spinner\";\n","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","import { createContext, useContext } from \"react\";\nimport { Remove } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupColumnWidth, ItemerGroupRemoveIcon } from \"./types\";\n\ninterface ItemerGroupContextValue {\n draggable: boolean;\n /**\n * Number of rows in the group. `0` means the row is rendered outside an\n * `ItemerGroup`, so the row count is unknown.\n */\n rowCount: number;\n /**\n * Minimum number of rows the group keeps. Remove buttons are hidden while\n * `rowCount <= minRows`.\n */\n minRows: number;\n removeIcon: ItemerGroupRemoveIcon;\n columnWidths?: ItemerGroupColumnWidth[];\n}\n\nexport const ItemerGroupContext = createContext<ItemerGroupContextValue>({\n draggable: false,\n rowCount: 0,\n minRows: 1,\n removeIcon: Remove,\n});\n\nexport const useItemerGroupContext = () => useContext(ItemerGroupContext);\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport type { ItemerGroupColumnWidth } from \"./types\";\n\ninterface ItemerGroupColumnProps {\n width?: ItemerGroupColumnWidth;\n children: React.ReactNode;\n}\n\n/**\n * Sizes one column of a row — a control in `ItemerGroupRow` or its header in\n * the label row. Both use this so headers always line up with their controls.\n *\n * - `width` omitted → `flex: 1`, i.e. every column takes an equal share.\n * - `number` → used as the flex grow factor.\n * - `\"auto\"` → the column keeps its control's intrinsic width and neither\n * grows nor shrinks (fixed-size controls such as `ItemerGroupPreview`).\n * - other `string` → used as `flex-basis` (e.g. `\"40%\"`). Columns may still\n * shrink, so percentages summing to 100% absorb the inter-column gaps\n * instead of overflowing the row.\n */\nexport const ItemerGroupColumn: React.FC<ItemerGroupColumnProps> = ({\n width,\n children,\n}) => {\n if (width === \"auto\") {\n return <Box flexShrink={0}>{children}</Box>;\n }\n\n if (typeof width === \"string\") {\n return (\n <Box\n minWidth={0}\n style={{ flexBasis: width, flexGrow: 0, flexShrink: 1 }}\n >\n {children}\n </Box>\n );\n }\n\n return (\n <Box flex={width ?? 1} minWidth={0}>\n {children}\n </Box>\n );\n};\n\nItemerGroupColumn.displayName = \"ItemerGroupColumn\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { IconButton } from \"@xsolla/xui-button\";\nimport { Drag } from \"@xsolla/xui-icons-base\";\nimport { useItemerGroupContext } from \"./ItemerGroupContext\";\nimport { ItemerGroupColumn } from \"./ItemerGroupColumn\";\nimport type { ItemerGroupRowProps } from \"./types\";\n\nconst REMOVE_ICON_SIZE = 20;\n\nexport const ItemerGroupRow: React.FC<ItemerGroupRowProps> = ({\n children,\n onRemove,\n className,\n}) => {\n const { theme } = useResolvedTheme({});\n const {\n draggable,\n rowCount,\n minRows,\n removeIcon: RemoveIcon,\n columnWidths,\n } = useItemerGroupContext();\n\n const columns = React.Children.toArray(children);\n\n // `rowCount` is 0 when the row is rendered outside an `ItemerGroup` — the\n // group size is unknown there, so only hide the button when the group is\n // provably at its minimum row count.\n const isAtMinRows = rowCount > 0 && rowCount <= minRows;\n const showRemoveButton = Boolean(onRemove) && !isAtMinRows;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8} className={className}>\n {draggable && rowCount > 1 && (\n <Box\n data-drag-handle=\"true\"\n width={28}\n height={28}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n style={{ cursor: \"grab\" }}\n >\n <Drag size={20} color={theme.colors.content.tertiary} />\n </Box>\n )}\n <Box\n flex={1}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={4}\n minWidth={0}\n >\n {columns.map((child, index) => (\n <ItemerGroupColumn key={index} width={columnWidths?.[index]}>\n {child}\n </ItemerGroupColumn>\n ))}\n {showRemoveButton && (\n <IconButton\n aria-label=\"Remove row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onRemove}\n icon={<RemoveIcon size={REMOVE_ICON_SIZE} />}\n />\n )}\n </Box>\n </Box>\n );\n};\n\nItemerGroupRow.displayName = \"ItemerGroupRow\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, isWeb } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, useId } from \"@xsolla/xui-core\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport type { ItemerGroupFileCellProps } from \"./types\";\n\n// Figma \"ItemergGroupUploaderCell\": input-like chrome with 8px left / 12px\n// right padding and an 8px gap between the name and the meta text.\nconst PADDING_LEFT = 8;\nconst PADDING_RIGHT = 12;\nconst CONTENT_GAP = 8;\n// Mirrors the error outline `Input` draws — 1px pulled inside the border box\n// so the cell does not grow when it becomes invalid.\nconst ERROR_OUTLINE_WIDTH = 1;\nconst ERROR_OUTLINE_OFFSET = -1;\n\n/**\n * Read-only row content for an uploaded file — the file name on the left and\n * an optional meta text (typically the size) on the right, styled like a\n * `size=\"sm\"` input so it lines up with other controls in the group.\n *\n * The cell is non-interactive by design: the user cannot edit the file name\n * despite the input-like chrome. Pass `errorMessage` to surface file-level\n * validation (e.g. \"file is too large\") below the cell, matching how `Input`\n * renders its own errors.\n *\n * Pair it with `ItemerGroupPreview` for a thumbnail column and with the group's\n * `actions` slot for an \"Upload file\" button.\n */\nexport const ItemerGroupFileCell: React.FC<ItemerGroupFileCellProps> = ({\n name,\n meta,\n error,\n errorMessage,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const inputColors = theme.colors.control.input;\n const sizeStyles = theme.sizing.input(\"sm\");\n\n // Sanitize useId() output to remove colons (e.g. :r0: -> r0) so the value is\n // a valid HTML id and ARIA reference.\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const errorId = `itemer-group-file-cell-${safeId}-error`;\n\n const isError = !!(errorMessage || error);\n const outlineColor = isError ? theme.colors.border.alert : undefined;\n\n return (\n <Box flexDirection=\"column\" gap={sizeStyles.fieldGap} width=\"100%\">\n <Box\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"space-between\"\n gap={CONTENT_GAP}\n height={sizeStyles.height}\n paddingLeft={PADDING_LEFT}\n paddingRight={PADDING_RIGHT}\n backgroundColor={inputColors.bg}\n borderWidth={1}\n borderStyle=\"solid\"\n borderColor={inputColors.border}\n borderRadius={theme.shape.input.sm.borderRadius}\n minWidth={0}\n aria-invalid={isError || undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n className={className}\n testID={testID}\n style={\n outlineColor\n ? isWeb\n ? {\n outline: `${ERROR_OUTLINE_WIDTH}px solid ${outlineColor}`,\n outlineOffset: `${ERROR_OUTLINE_OFFSET}px`,\n }\n : {\n borderColor: outlineColor,\n borderWidth: ERROR_OUTLINE_WIDTH,\n }\n : undefined\n }\n >\n <Typography\n variant=\"bodySm\"\n color={inputColors.text}\n noWrap\n title={name}\n style={{ minWidth: 0 }}\n >\n {name}\n </Typography>\n {meta && (\n <Typography\n variant=\"bodySm\"\n color={inputColors.placeholder}\n noWrap\n style={{ flexShrink: 0 }}\n >\n {meta}\n </Typography>\n )}\n </Box>\n {errorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n};\n\nItemerGroupFileCell.displayName = \"ItemerGroupFileCell\";\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Spinner } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { FileText } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupPreviewProps } from \"./types\";\n\n// Figma \"ItemerGroupPreview\" — a 16:9 thumbnail matching the 40px row height.\nconst ITEMER_GROUP_PREVIEW_WIDTH = 77;\nconst ITEMER_GROUP_PREVIEW_HEIGHT = 40;\nconst PREVIEW_RADIUS = 4;\nconst PLACEHOLDER_ICON_SIZE = 20;\n// The loading tile keeps the placeholder chrome and swaps the file icon for a\n// brand spinner, so the row does not resize while the preview resolves.\nconst SPINNER_SIZE = 18;\nconst SPINNER_STROKE_WIDTH = 2;\n\n/**\n * Fixed-size 77×40 thumbnail for a file row. Renders, in order of precedence:\n * a spinner while `loading`, the image when `src` is set, and a neutral\n * placeholder with a file icon otherwise.\n *\n * Because the size is fixed, give its column `\"auto\"` in the parent group's\n * `columnWidths` (e.g. `columnWidths={[\"auto\", 1]}`) so it does not stretch.\n */\nexport const ItemerGroupPreview: React.FC<ItemerGroupPreviewProps> = ({\n src,\n alt = \"\",\n loading = false,\n loadingLabel = \"Loading preview\",\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n // `loading` wins over `src` so a stale thumbnail is never shown while a new\n // one is being fetched.\n const showImage = !loading && Boolean(src);\n\n return (\n <Box\n width={ITEMER_GROUP_PREVIEW_WIDTH}\n height={ITEMER_GROUP_PREVIEW_HEIGHT}\n flexShrink={0}\n borderRadius={PREVIEW_RADIUS}\n overflow=\"hidden\"\n alignItems=\"center\"\n justifyContent=\"center\"\n backgroundColor={showImage ? undefined : theme.colors.overlay.mono}\n className={className}\n testID={testID}\n >\n {loading ? (\n <Spinner\n size={SPINNER_SIZE}\n strokeWidth={SPINNER_STROKE_WIDTH}\n color={theme.colors.content.brand.primary}\n aria-label={loadingLabel}\n />\n ) : showImage ? (\n <Box\n as=\"img\"\n src={src}\n alt={alt}\n width=\"100%\"\n height=\"100%\"\n style={{ objectFit: \"cover\", display: \"block\" }}\n />\n ) : (\n <FileText\n size={PLACEHOLDER_ICON_SIZE}\n color={theme.colors.content.tertiary}\n />\n )}\n </Box>\n );\n};\n\nItemerGroupPreview.displayName = \"ItemerGroupPreview\";\n"],"mappings":"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","names":["React","React","React","styled","jsx","styled","styled","jsx","FilteredDiv","styled","Remove","jsx","jsx","Remove","React","React","useResolvedTheme","jsx","jsxs","useResolvedTheme","React","index","useResolvedTheme","Typography","jsx","jsxs","useResolvedTheme","jsx"]}
|