@xsolla/xui-tag-label 0.158.0 → 0.159.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/README.md CHANGED
@@ -11,14 +11,19 @@ npm install @xsolla/xui-tag-label
11
11
  ## Imports
12
12
 
13
13
  ```tsx
14
- import { TagLabel, type EntityType, type SubentityType, type StatusType } from '@xsolla/xui-tag-label';
14
+ import {
15
+ TagLabel,
16
+ type EntityType,
17
+ type SubentityType,
18
+ type StatusType,
19
+ } from "@xsolla/xui-tag-label";
15
20
  ```
16
21
 
17
22
  ## Quick start
18
23
 
19
24
  ```tsx
20
- import * as React from 'react';
21
- import { TagLabel } from '@xsolla/xui-tag-label';
25
+ import * as React from "react";
26
+ import { TagLabel } from "@xsolla/xui-tag-label";
22
27
 
23
28
  export default function QuickStart() {
24
29
  return (
@@ -38,28 +43,29 @@ export default function QuickStart() {
38
43
 
39
44
  ### `<TagLabel>`
40
45
 
41
- | Prop | Type | Default | Description |
42
- | --- | --- | --- | --- |
43
- | `entityType` | `"item" \| "product" \| "account"` | | Primary category. Drives icon and tinted background of the entity segment. |
44
- | `subentityType` | `SubentityType` | — | Detailed sub-category (e.g. `"skin"`, `"game"`, `"sdk"`). Hidden when `compact`. |
45
- | `icon` | `ReactNode` | — | Custom icon override for the entity segment. |
46
- | `series` | `string` | — | ID series prefix (e.g. `"XLA"`). |
47
- | `number` | `string` | — | ID number suffix (e.g. `"-001-001"`). |
48
- | `label` | `string` | — | Item label/name. Hidden when `compact`. |
49
- | `rarity` | `ReactNode` | — | Rarity icon segment. Hidden when `compact`. |
50
- | `status` | `"sale" \| "maintenance" \| "inactive"` | — | Status indicator segment. Hidden when `compact`. |
51
- | `compact` | `boolean` | `false` | Render the icon-only / minimal version. |
52
- | `children` | `ReactNode` | | Custom trailing-slot content. Hidden when `compact`. |
53
- | `style` | `CSSProperties` | — | Inline style overrides on the root container. |
46
+ | Prop | Type | Default | Description |
47
+ | --------------- | --------------------------------------- | ------- | ------------------------------------------------------------------------------------------------------------- |
48
+ | `testID` | `string` | — | Test ID for testing frameworks. On web this renders as `data-testid`; on React Native it renders as `testID`. |
49
+ | `entityType` | `"item" \| "product" \| "account"` | — | Primary category. Drives icon and tinted background of the entity segment. |
50
+ | `subentityType` | `SubentityType` | — | Detailed sub-category (e.g. `"skin"`, `"game"`, `"sdk"`). Hidden when `compact`. |
51
+ | `icon` | `ReactNode` | — | Custom icon override for the entity segment. |
52
+ | `series` | `string` | — | ID series prefix (e.g. `"XLA"`). |
53
+ | `number` | `string` | — | ID number suffix (e.g. `"-001-001"`). |
54
+ | `label` | `string` | — | Item label/name. Hidden when `compact`. |
55
+ | `rarity` | `ReactNode` | — | Rarity icon segment. Hidden when `compact`. |
56
+ | `status` | `"sale" \| "maintenance" \| "inactive"` | — | Status indicator segment. Hidden when `compact`. |
57
+ | `compact` | `boolean` | `false` | Render the icon-only / minimal version. |
58
+ | `children` | `ReactNode` | — | Custom trailing-slot content. Hidden when `compact`. |
59
+ | `style` | `CSSProperties` | — | Inline style overrides on the root container. |
54
60
 
55
61
  Inherits `ThemeOverrideProps` (`themeMode`, `themeProductContext`).
56
62
 
57
63
  ### Exported types
58
64
 
59
- | Type | Members |
60
- | --- | --- |
61
- | `EntityType` | `"item" \| "product" \| "account"` |
62
- | `StatusType` | `"sale" \| "maintenance" \| "inactive"` |
65
+ | Type | Members |
66
+ | --------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
67
+ | `EntityType` | `"item" \| "product" \| "account"` |
68
+ | `StatusType` | `"sale" \| "maintenance" \| "inactive"` |
63
69
  | `SubentityType` | `"skin" \| "in-game-item" \| "currency" \| "bundle" \| "lootbox" \| "game-key" \| "discount" \| "coupon" \| "game" \| "sdk" \| "plugin" \| "api" \| "service" \| "tool" \| "webshop" \| "app" \| "launcher" \| "library" \| "engine" \| "user" \| "developer" \| "influencer" \| "publisher" \| "settings"` |
64
70
 
65
71
  ## Anatomy
@@ -79,8 +85,8 @@ The tag is composed of optional segments rendered in this order:
79
85
  ### Compact
80
86
 
81
87
  ```tsx
82
- import * as React from 'react';
83
- import { TagLabel } from '@xsolla/xui-tag-label';
88
+ import * as React from "react";
89
+ import { TagLabel } from "@xsolla/xui-tag-label";
84
90
 
85
91
  export default function CompactTagLabel() {
86
92
  return <TagLabel entityType="item" series="XLA" number="-001-001" compact />;
@@ -90,12 +96,12 @@ export default function CompactTagLabel() {
90
96
  ### With status
91
97
 
92
98
  ```tsx
93
- import * as React from 'react';
94
- import { TagLabel } from '@xsolla/xui-tag-label';
99
+ import * as React from "react";
100
+ import { TagLabel } from "@xsolla/xui-tag-label";
95
101
 
96
102
  export default function TagLabelStatus() {
97
103
  return (
98
- <div style={{ display: 'flex', flexDirection: 'column', gap: 8 }}>
104
+ <div style={{ display: "flex", flexDirection: "column", gap: 8 }}>
99
105
  <TagLabel entityType="product" label="Adventure Pack" status="sale" />
100
106
  <TagLabel entityType="product" label="Dev Kit" status="maintenance" />
101
107
  <TagLabel entityType="account" label="User #42" status="inactive" />
@@ -107,8 +113,8 @@ export default function TagLabelStatus() {
107
113
  ### Custom trailing slot
108
114
 
109
115
  ```tsx
110
- import * as React from 'react';
111
- import { TagLabel } from '@xsolla/xui-tag-label';
116
+ import * as React from "react";
117
+ import { TagLabel } from "@xsolla/xui-tag-label";
112
118
 
113
119
  export default function TagLabelCustomSlot() {
114
120
  return (
@@ -27,6 +27,8 @@ interface TagLabelProps extends ThemeOverrideProps {
27
27
  children?: ReactNode;
28
28
  /** Custom styles */
29
29
  style?: any;
30
+ /** Test ID for testing frameworks */
31
+ testID?: string;
30
32
  }
31
33
  declare const TagLabel: React.FC<TagLabelProps>;
32
34
 
package/native/index.d.ts CHANGED
@@ -27,6 +27,8 @@ interface TagLabelProps extends ThemeOverrideProps {
27
27
  children?: ReactNode;
28
28
  /** Custom styles */
29
29
  style?: any;
30
+ /** Test ID for testing frameworks */
31
+ testID?: string;
30
32
  }
31
33
  declare const TagLabel: React.FC<TagLabelProps>;
32
34
 
package/native/index.js CHANGED
@@ -235,6 +235,8 @@ var Text = ({
235
235
  numberOfLines,
236
236
  id,
237
237
  role,
238
+ testID,
239
+ "data-testid": dataTestId,
238
240
  style: styleProp,
239
241
  ...props
240
242
  }) => {
@@ -264,7 +266,7 @@ var Text = ({
264
266
  {
265
267
  style: baseStyle,
266
268
  numberOfLines,
267
- testID: id,
269
+ testID: dataTestId || testID || id,
268
270
  accessibilityRole,
269
271
  children
270
272
  }
@@ -275,7 +277,13 @@ var Text = ({
275
277
  var import_react = __toESM(require("react"));
276
278
  var import_react_native3 = require("react-native");
277
279
  var import_jsx_runtime3 = require("react/jsx-runtime");
278
- var Icon = ({ children, color, size }) => {
280
+ var Icon = ({
281
+ children,
282
+ color,
283
+ size,
284
+ testID,
285
+ "data-testid": dataTestId
286
+ }) => {
279
287
  const style = {
280
288
  width: typeof size === "number" ? size : void 0,
281
289
  height: typeof size === "number" ? size : void 0,
@@ -292,7 +300,7 @@ var Icon = ({ children, color, size }) => {
292
300
  }
293
301
  return child;
294
302
  });
295
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_native3.View, { style, children: childrenWithProps });
303
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_native3.View, { style, testID: dataTestId || testID, children: childrenWithProps });
296
304
  };
297
305
 
298
306
  // src/TagLabel.tsx
@@ -592,6 +600,7 @@ var TagLabel = ({
592
600
  compact = false,
593
601
  children,
594
602
  style,
603
+ testID,
595
604
  themeMode,
596
605
  themeProductContext
597
606
  }) => {
@@ -599,6 +608,7 @@ var TagLabel = ({
599
608
  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
600
609
  Box,
601
610
  {
611
+ testID,
602
612
  flexDirection: "row",
603
613
  alignItems: "center",
604
614
  style: {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx","../../../../foundation/primitives-native/src/Icon.tsx","../../src/TagLabel.tsx"],"sourcesContent":["export * from \"./TagLabel\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n flexDirection,\n alignItems,\n justifyContent,\n position,\n top,\n bottom,\n left,\n right,\n width,\n minWidth,\n minHeight,\n maxWidth,\n maxHeight,\n flex,\n overflow,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n 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 alignItems,\n justifyContent,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Destructure and drop web-only props from rest before passing to RN components\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": _ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": _ariaDisabled,\n \"aria-live\": _ariaLive,\n className,\n \"data-testid\": _dataTestId,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n if (onPress) {\n return (\n <Pressable\n onPress={onPress}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\n","import React from \"react\";\nimport {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string | number | undefined\n): number | undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n style: styleProp,\n ...props\n}) => {\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n if (\n resolvedFontFamily === \"Pilat Wide\" ||\n resolvedFontFamily === \"Pilat Wide Bold\" ||\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const incomingStyle = StyleSheet.flatten(styleProp) as TextStyle | undefined;\n\n const baseStyle: TextStyle = {\n color: 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={id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","import React from \"react\";\nimport { View, ViewStyle } from \"react-native\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Icon: React.FC<IconProps> = ({ children, color, size }) => {\n const style: ViewStyle = {\n width: typeof size === \"number\" ? size : undefined,\n height: typeof size === \"number\" ? size : undefined,\n alignItems: \"center\",\n justifyContent: \"center\",\n };\n\n // On native, we try to pass the color down to children (like Text primitives)\n // to mimic the CSS inheritance behavior of the web version.\n const childrenWithProps = React.Children.map(children, (child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n color: child.props.color || color,\n // Also pass size if child seems to be an icon that needs it\n size: child.props.size || size,\n });\n }\n return child;\n });\n\n return <View style={style}>{childrenWithProps}</View>;\n};\n","import React, { type ReactNode } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\nimport { User, Settings, Info, X } from \"@xsolla/xui-icons\";\n\n// --- Types ---\n\nexport type EntityType = \"item\" | \"product\" | \"account\";\n\nexport type StatusType = \"sale\" | \"maintenance\" | \"inactive\";\n\nexport type SubentityType =\n | \"skin\"\n | \"in-game-item\"\n | \"currency\"\n | \"bundle\"\n | \"lootbox\"\n | \"game-key\"\n | \"discount\"\n | \"coupon\"\n | \"game\"\n | \"sdk\"\n | \"plugin\"\n | \"api\"\n | \"service\"\n | \"tool\"\n | \"webshop\"\n | \"app\"\n | \"launcher\"\n | \"library\"\n | \"engine\"\n | \"user\"\n | \"developer\"\n | \"influencer\"\n | \"publisher\"\n | \"settings\";\n\nexport interface TagLabelProps extends ThemeOverrideProps {\n /** Main entity type */\n entityType?: EntityType;\n /** Detailed sub-category */\n subentityType?: SubentityType;\n /** Custom icon for entity/subentity if needed */\n icon?: ReactNode;\n /** ID series (e.g. \"XLA\") */\n series?: string;\n /** ID number (e.g. \"-001-001\") */\n number?: string;\n /** Item label/name */\n label?: string;\n /** Rarity icon or indicator */\n rarity?: ReactNode;\n /** Status indicator */\n status?: StatusType;\n /** Whether to show the compact version */\n compact?: boolean;\n /** Custom content slot */\n children?: ReactNode;\n /** Custom styles */\n style?: any;\n}\n\n// --- Internal Segments ---\n\nconst SEGMENT_HEIGHT = 24;\n\nconst TagLabelEntitySegment: React.FC<{\n type: EntityType;\n compact?: boolean;\n icon?: ReactNode;\n theme: any;\n}> = ({ type, compact, icon, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.[type];\n\n if (!colors) return null;\n\n // Generic icon placeholders for now based on Figma intent\n const renderIcon = () => {\n if (icon) return icon;\n switch (type) {\n case \"item\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Cube placeholder\n case \"product\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Chip placeholder\n case \"account\":\n return <User size=\"100%\" />;\n }\n };\n\n if (compact) {\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={16} color={colors.textCompact || colors.text}>\n {renderIcon()}\n </Icon>\n </Box>\n );\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={2}\n paddingRight={4}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n <Icon size={20} color={colors.text}>\n {renderIcon()}\n </Icon>\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"500\"\n whiteSpace=\"nowrap\"\n >\n {type.charAt(0).toUpperCase() + type.slice(1)}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelSubentitySegment: React.FC<{\n type: SubentityType;\n theme: any;\n}> = ({ type, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.subentity;\n\n if (!colors || !type || typeof type !== \"string\") return null;\n\n // Icon mapping based on Figma\n const renderIcon = () => {\n switch (type) {\n case \"skin\":\n case \"in-game-item\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Pencil placeholder\n case \"game\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Controller placeholder\n case \"user\":\n return <User size=\"100%\" />;\n case \"settings\":\n return <Settings size=\"100%\" />;\n // ... more icons as needed\n default:\n return <Info size=\"100%\" />;\n }\n };\n\n const label = type\n .split(\"-\")\n .map((word) => word.charAt(0).toUpperCase() + word.slice(1))\n .join(\" \");\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={2}\n paddingRight={4}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n <Icon size={20} color={colors.text}>\n {renderIcon()}\n </Icon>\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"500\"\n whiteSpace=\"nowrap\"\n >\n {label}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelIdSegment: React.FC<{\n series?: string;\n number?: string;\n compact?: boolean;\n theme: any;\n}> = ({ series, number, compact, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.id;\n\n if (!colors) return null;\n\n if (compact) {\n return (\n <Box\n height={SEGMENT_HEIGHT}\n paddingLeft={4}\n paddingRight={6}\n flexDirection=\"row\"\n alignItems=\"center\"\n >\n {series && (\n <Text color={colors.textCompact} fontSize={14} fontWeight=\"400\">\n {series}\n </Text>\n )}\n {number && (\n <Text color={colors.textCompact} fontSize={14} fontWeight=\"400\">\n {number}\n </Text>\n )}\n </Box>\n );\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={4}\n paddingRight={6}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n {series && (\n <Box\n backgroundColor={colors.bgSeries}\n height={16}\n paddingHorizontal={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Text color={colors.textSeries} fontSize={14} fontWeight=\"500\">\n {series}\n </Text>\n </Box>\n )}\n {number && (\n <Text color={colors.textNumber} fontSize={14} fontWeight=\"500\">\n {number}\n </Text>\n )}\n </Box>\n );\n};\n\nconst TagLabelNameSegment: React.FC<{ label: string; theme: any }> = ({\n label,\n theme,\n}) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.name;\n\n if (!colors) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingHorizontal={4}\n justifyContent=\"center\"\n >\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"400\"\n whiteSpace=\"nowrap\"\n style={{\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n }}\n >\n {label}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelRaritySegment: React.FC<{ rarity: ReactNode; theme: any }> = ({\n rarity,\n theme,\n}) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.rarity;\n\n if (!colors) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingHorizontal={6}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={18} color={colors.text}>\n {rarity || <Info size=\"100%\" />}\n </Icon>\n </Box>\n );\n};\n\nconst TagLabelStatusSegment: React.FC<{ type: StatusType; theme: any }> = ({\n type,\n theme,\n}) => {\n let bg;\n let icon;\n\n if (!theme?.colors?.background) return null;\n\n switch (type) {\n case \"sale\":\n bg = theme.colors.background.warning?.primary;\n icon = <Info size=\"100%\" />; // Info placeholder\n break;\n case \"maintenance\":\n bg = theme.colors.background.success?.primary;\n icon = <Settings size=\"100%\" />;\n break;\n case \"inactive\":\n bg = theme.colors.background.alert?.primary;\n icon = <X size=\"100%\" />;\n break;\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n backgroundColor={bg}\n paddingHorizontal={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={20} color=\"black\">\n {icon}\n </Icon>\n </Box>\n );\n};\n\nconst TagLabelCustomSlot: React.FC<{ children: ReactNode; theme: any }> = ({\n children,\n theme,\n}) => {\n if (!theme?.colors?.background) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={theme.colors.background.secondary}\n paddingHorizontal={6}\n justifyContent=\"center\"\n >\n {typeof children === \"string\" ? (\n <Text\n color={theme?.colors?.content?.primary}\n fontSize={14}\n fontWeight=\"500\"\n >\n {children}\n </Text>\n ) : (\n children\n )}\n </Box>\n );\n};\n\n// --- Main Component ---\n\nexport const TagLabel: React.FC<TagLabelProps> = ({\n entityType,\n subentityType,\n icon,\n series,\n number,\n label,\n rarity,\n status,\n compact = false,\n children,\n style,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n return (\n <Box\n flexDirection=\"row\"\n alignItems=\"center\"\n style={{\n overflow: \"hidden\",\n borderRadius: 4, // Default radius from Figma\n ...style,\n }}\n >\n {entityType && (\n <TagLabelEntitySegment\n type={entityType}\n compact={compact}\n icon={icon}\n theme={theme}\n />\n )}\n\n {!compact && subentityType && (\n <TagLabelSubentitySegment type={subentityType} theme={theme} />\n )}\n\n {(series || number) && (\n <TagLabelIdSegment\n series={series}\n number={number}\n compact={compact}\n theme={theme}\n />\n )}\n\n {!compact && label && <TagLabelNameSegment label={label} theme={theme} />}\n\n {!compact && rarity && (\n <TagLabelRaritySegment rarity={rarity} theme={theme} />\n )}\n\n {!compact && status && (\n <TagLabelStatusSegment type={status} theme={theme} />\n )}\n\n {!compact && children && (\n <TagLabelCustomSlot theme={theme}>{children}</TagLabelCustomSlot>\n )}\n </Box>\n );\n};\n"],"mappings":"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","names":["import_react_native","import_jsx_runtime","RNText","import_react_native","import_jsx_runtime","React","import_jsx_runtime"]}
1
+ {"version":3,"sources":["../../src/index.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx","../../../../foundation/primitives-native/src/Icon.tsx","../../src/TagLabel.tsx"],"sourcesContent":["export * from \"./TagLabel\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n flexDirection,\n alignItems,\n justifyContent,\n position,\n top,\n bottom,\n left,\n right,\n width,\n minWidth,\n minHeight,\n maxWidth,\n maxHeight,\n flex,\n overflow,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n 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 alignItems,\n justifyContent,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Destructure and drop web-only props from rest before passing to RN components\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": _ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": _ariaDisabled,\n \"aria-live\": _ariaLive,\n className,\n \"data-testid\": _dataTestId,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n if (onPress) {\n return (\n <Pressable\n onPress={onPress}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\n","import React from \"react\";\nimport {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string | number | undefined\n): number | undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n 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 React from \"react\";\nimport { View, ViewStyle } from \"react-native\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Icon: React.FC<IconProps> = ({\n children,\n color,\n size,\n testID,\n \"data-testid\": dataTestId,\n}) => {\n const style: ViewStyle = {\n width: typeof size === \"number\" ? size : undefined,\n height: typeof size === \"number\" ? size : undefined,\n alignItems: \"center\",\n justifyContent: \"center\",\n };\n\n // On native, we try to pass the color down to children (like Text primitives)\n // to mimic the CSS inheritance behavior of the web version.\n const childrenWithProps = React.Children.map(children, (child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n color: child.props.color || color,\n // Also pass size if child seems to be an icon that needs it\n size: child.props.size || size,\n });\n }\n return child;\n });\n\n return (\n <View style={style} testID={dataTestId || testID}>\n {childrenWithProps}\n </View>\n );\n};\n","import React, { type ReactNode } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\nimport { User, Settings, Info, X } from \"@xsolla/xui-icons\";\n\n// --- Types ---\n\nexport type EntityType = \"item\" | \"product\" | \"account\";\n\nexport type StatusType = \"sale\" | \"maintenance\" | \"inactive\";\n\nexport type SubentityType =\n | \"skin\"\n | \"in-game-item\"\n | \"currency\"\n | \"bundle\"\n | \"lootbox\"\n | \"game-key\"\n | \"discount\"\n | \"coupon\"\n | \"game\"\n | \"sdk\"\n | \"plugin\"\n | \"api\"\n | \"service\"\n | \"tool\"\n | \"webshop\"\n | \"app\"\n | \"launcher\"\n | \"library\"\n | \"engine\"\n | \"user\"\n | \"developer\"\n | \"influencer\"\n | \"publisher\"\n | \"settings\";\n\nexport interface TagLabelProps extends ThemeOverrideProps {\n /** Main entity type */\n entityType?: EntityType;\n /** Detailed sub-category */\n subentityType?: SubentityType;\n /** Custom icon for entity/subentity if needed */\n icon?: ReactNode;\n /** ID series (e.g. \"XLA\") */\n series?: string;\n /** ID number (e.g. \"-001-001\") */\n number?: string;\n /** Item label/name */\n label?: string;\n /** Rarity icon or indicator */\n rarity?: ReactNode;\n /** Status indicator */\n status?: StatusType;\n /** Whether to show the compact version */\n compact?: boolean;\n /** Custom content slot */\n children?: ReactNode;\n /** Custom styles */\n style?: any;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\n// --- Internal Segments ---\n\nconst SEGMENT_HEIGHT = 24;\n\nconst TagLabelEntitySegment: React.FC<{\n type: EntityType;\n compact?: boolean;\n icon?: ReactNode;\n theme: any;\n}> = ({ type, compact, icon, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.[type];\n\n if (!colors) return null;\n\n // Generic icon placeholders for now based on Figma intent\n const renderIcon = () => {\n if (icon) return icon;\n switch (type) {\n case \"item\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Cube placeholder\n case \"product\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Chip placeholder\n case \"account\":\n return <User size=\"100%\" />;\n }\n };\n\n if (compact) {\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={16} color={colors.textCompact || colors.text}>\n {renderIcon()}\n </Icon>\n </Box>\n );\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={2}\n paddingRight={4}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n <Icon size={20} color={colors.text}>\n {renderIcon()}\n </Icon>\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"500\"\n whiteSpace=\"nowrap\"\n >\n {type.charAt(0).toUpperCase() + type.slice(1)}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelSubentitySegment: React.FC<{\n type: SubentityType;\n theme: any;\n}> = ({ type, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.subentity;\n\n if (!colors || !type || typeof type !== \"string\") return null;\n\n // Icon mapping based on Figma\n const renderIcon = () => {\n switch (type) {\n case \"skin\":\n case \"in-game-item\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Pencil placeholder\n case \"game\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Controller placeholder\n case \"user\":\n return <User size=\"100%\" />;\n case \"settings\":\n return <Settings size=\"100%\" />;\n // ... more icons as needed\n default:\n return <Info size=\"100%\" />;\n }\n };\n\n const label = type\n .split(\"-\")\n .map((word) => word.charAt(0).toUpperCase() + word.slice(1))\n .join(\" \");\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={2}\n paddingRight={4}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n <Icon size={20} color={colors.text}>\n {renderIcon()}\n </Icon>\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"500\"\n whiteSpace=\"nowrap\"\n >\n {label}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelIdSegment: React.FC<{\n series?: string;\n number?: string;\n compact?: boolean;\n theme: any;\n}> = ({ series, number, compact, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.id;\n\n if (!colors) return null;\n\n if (compact) {\n return (\n <Box\n height={SEGMENT_HEIGHT}\n paddingLeft={4}\n paddingRight={6}\n flexDirection=\"row\"\n alignItems=\"center\"\n >\n {series && (\n <Text color={colors.textCompact} fontSize={14} fontWeight=\"400\">\n {series}\n </Text>\n )}\n {number && (\n <Text color={colors.textCompact} fontSize={14} fontWeight=\"400\">\n {number}\n </Text>\n )}\n </Box>\n );\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={4}\n paddingRight={6}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n {series && (\n <Box\n backgroundColor={colors.bgSeries}\n height={16}\n paddingHorizontal={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Text color={colors.textSeries} fontSize={14} fontWeight=\"500\">\n {series}\n </Text>\n </Box>\n )}\n {number && (\n <Text color={colors.textNumber} fontSize={14} fontWeight=\"500\">\n {number}\n </Text>\n )}\n </Box>\n );\n};\n\nconst TagLabelNameSegment: React.FC<{ label: string; theme: any }> = ({\n label,\n theme,\n}) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.name;\n\n if (!colors) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingHorizontal={4}\n justifyContent=\"center\"\n >\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"400\"\n whiteSpace=\"nowrap\"\n style={{\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n }}\n >\n {label}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelRaritySegment: React.FC<{ rarity: ReactNode; theme: any }> = ({\n rarity,\n theme,\n}) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.rarity;\n\n if (!colors) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingHorizontal={6}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={18} color={colors.text}>\n {rarity || <Info size=\"100%\" />}\n </Icon>\n </Box>\n );\n};\n\nconst TagLabelStatusSegment: React.FC<{ type: StatusType; theme: any }> = ({\n type,\n theme,\n}) => {\n let bg;\n let icon;\n\n if (!theme?.colors?.background) return null;\n\n switch (type) {\n case \"sale\":\n bg = theme.colors.background.warning?.primary;\n icon = <Info size=\"100%\" />; // Info placeholder\n break;\n case \"maintenance\":\n bg = theme.colors.background.success?.primary;\n icon = <Settings size=\"100%\" />;\n break;\n case \"inactive\":\n bg = theme.colors.background.alert?.primary;\n icon = <X size=\"100%\" />;\n break;\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n backgroundColor={bg}\n paddingHorizontal={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={20} color=\"black\">\n {icon}\n </Icon>\n </Box>\n );\n};\n\nconst TagLabelCustomSlot: React.FC<{ children: ReactNode; theme: any }> = ({\n children,\n theme,\n}) => {\n if (!theme?.colors?.background) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={theme.colors.background.secondary}\n paddingHorizontal={6}\n justifyContent=\"center\"\n >\n {typeof children === \"string\" ? (\n <Text\n color={theme?.colors?.content?.primary}\n fontSize={14}\n fontWeight=\"500\"\n >\n {children}\n </Text>\n ) : (\n children\n )}\n </Box>\n );\n};\n\n// --- Main Component ---\n\nexport const TagLabel: React.FC<TagLabelProps> = ({\n entityType,\n subentityType,\n icon,\n series,\n number,\n label,\n rarity,\n status,\n compact = false,\n children,\n style,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n return (\n <Box\n testID={testID}\n flexDirection=\"row\"\n alignItems=\"center\"\n style={{\n overflow: \"hidden\",\n borderRadius: 4, // Default radius from Figma\n ...style,\n }}\n >\n {entityType && (\n <TagLabelEntitySegment\n type={entityType}\n compact={compact}\n icon={icon}\n theme={theme}\n />\n )}\n\n {!compact && subentityType && (\n <TagLabelSubentitySegment type={subentityType} theme={theme} />\n )}\n\n {(series || number) && (\n <TagLabelIdSegment\n series={series}\n number={number}\n compact={compact}\n theme={theme}\n />\n )}\n\n {!compact && label && <TagLabelNameSegment label={label} theme={theme} />}\n\n {!compact && rarity && (\n <TagLabelRaritySegment rarity={rarity} theme={theme} />\n )}\n\n {!compact && status && (\n <TagLabelStatusSegment type={status} theme={theme} />\n )}\n\n {!compact && children && (\n <TagLabelCustomSlot theme={theme}>{children}</TagLabelCustomSlot>\n )}\n </Box>\n );\n};\n"],"mappings":"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","names":["import_react_native","import_jsx_runtime","RNText","import_react_native","import_jsx_runtime","React","import_jsx_runtime"]}
package/native/index.mjs CHANGED
@@ -206,6 +206,8 @@ var Text = ({
206
206
  numberOfLines,
207
207
  id,
208
208
  role,
209
+ testID,
210
+ "data-testid": dataTestId,
209
211
  style: styleProp,
210
212
  ...props
211
213
  }) => {
@@ -235,7 +237,7 @@ var Text = ({
235
237
  {
236
238
  style: baseStyle,
237
239
  numberOfLines,
238
- testID: id,
240
+ testID: dataTestId || testID || id,
239
241
  accessibilityRole,
240
242
  children
241
243
  }
@@ -246,7 +248,13 @@ var Text = ({
246
248
  import React from "react";
247
249
  import { View as View2 } from "react-native";
248
250
  import { jsx as jsx3 } from "react/jsx-runtime";
249
- var Icon = ({ children, color, size }) => {
251
+ var Icon = ({
252
+ children,
253
+ color,
254
+ size,
255
+ testID,
256
+ "data-testid": dataTestId
257
+ }) => {
250
258
  const style = {
251
259
  width: typeof size === "number" ? size : void 0,
252
260
  height: typeof size === "number" ? size : void 0,
@@ -263,7 +271,7 @@ var Icon = ({ children, color, size }) => {
263
271
  }
264
272
  return child;
265
273
  });
266
- return /* @__PURE__ */ jsx3(View2, { style, children: childrenWithProps });
274
+ return /* @__PURE__ */ jsx3(View2, { style, testID: dataTestId || testID, children: childrenWithProps });
267
275
  };
268
276
 
269
277
  // src/TagLabel.tsx
@@ -563,6 +571,7 @@ var TagLabel = ({
563
571
  compact = false,
564
572
  children,
565
573
  style,
574
+ testID,
566
575
  themeMode,
567
576
  themeProductContext
568
577
  }) => {
@@ -570,6 +579,7 @@ var TagLabel = ({
570
579
  return /* @__PURE__ */ jsxs(
571
580
  Box,
572
581
  {
582
+ testID,
573
583
  flexDirection: "row",
574
584
  alignItems: "center",
575
585
  style: {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx","../../../../foundation/primitives-native/src/Icon.tsx","../../src/TagLabel.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n flexDirection,\n alignItems,\n justifyContent,\n position,\n top,\n bottom,\n left,\n right,\n width,\n minWidth,\n minHeight,\n maxWidth,\n maxHeight,\n flex,\n overflow,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n 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 alignItems,\n justifyContent,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Destructure and drop web-only props from rest before passing to RN components\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": _ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": _ariaDisabled,\n \"aria-live\": _ariaLive,\n className,\n \"data-testid\": _dataTestId,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n if (onPress) {\n return (\n <Pressable\n onPress={onPress}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\n","import React from \"react\";\nimport {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string | number | undefined\n): number | undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n style: styleProp,\n ...props\n}) => {\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n if (\n resolvedFontFamily === \"Pilat Wide\" ||\n resolvedFontFamily === \"Pilat Wide Bold\" ||\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const incomingStyle = StyleSheet.flatten(styleProp) as TextStyle | undefined;\n\n const baseStyle: TextStyle = {\n color: 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={id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","import React from \"react\";\nimport { View, ViewStyle } from \"react-native\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Icon: React.FC<IconProps> = ({ children, color, size }) => {\n const style: ViewStyle = {\n width: typeof size === \"number\" ? size : undefined,\n height: typeof size === \"number\" ? size : undefined,\n alignItems: \"center\",\n justifyContent: \"center\",\n };\n\n // On native, we try to pass the color down to children (like Text primitives)\n // to mimic the CSS inheritance behavior of the web version.\n const childrenWithProps = React.Children.map(children, (child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n color: child.props.color || color,\n // Also pass size if child seems to be an icon that needs it\n size: child.props.size || size,\n });\n }\n return child;\n });\n\n return <View style={style}>{childrenWithProps}</View>;\n};\n","import React, { type ReactNode } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\nimport { User, Settings, Info, X } from \"@xsolla/xui-icons\";\n\n// --- Types ---\n\nexport type EntityType = \"item\" | \"product\" | \"account\";\n\nexport type StatusType = \"sale\" | \"maintenance\" | \"inactive\";\n\nexport type SubentityType =\n | \"skin\"\n | \"in-game-item\"\n | \"currency\"\n | \"bundle\"\n | \"lootbox\"\n | \"game-key\"\n | \"discount\"\n | \"coupon\"\n | \"game\"\n | \"sdk\"\n | \"plugin\"\n | \"api\"\n | \"service\"\n | \"tool\"\n | \"webshop\"\n | \"app\"\n | \"launcher\"\n | \"library\"\n | \"engine\"\n | \"user\"\n | \"developer\"\n | \"influencer\"\n | \"publisher\"\n | \"settings\";\n\nexport interface TagLabelProps extends ThemeOverrideProps {\n /** Main entity type */\n entityType?: EntityType;\n /** Detailed sub-category */\n subentityType?: SubentityType;\n /** Custom icon for entity/subentity if needed */\n icon?: ReactNode;\n /** ID series (e.g. \"XLA\") */\n series?: string;\n /** ID number (e.g. \"-001-001\") */\n number?: string;\n /** Item label/name */\n label?: string;\n /** Rarity icon or indicator */\n rarity?: ReactNode;\n /** Status indicator */\n status?: StatusType;\n /** Whether to show the compact version */\n compact?: boolean;\n /** Custom content slot */\n children?: ReactNode;\n /** Custom styles */\n style?: any;\n}\n\n// --- Internal Segments ---\n\nconst SEGMENT_HEIGHT = 24;\n\nconst TagLabelEntitySegment: React.FC<{\n type: EntityType;\n compact?: boolean;\n icon?: ReactNode;\n theme: any;\n}> = ({ type, compact, icon, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.[type];\n\n if (!colors) return null;\n\n // Generic icon placeholders for now based on Figma intent\n const renderIcon = () => {\n if (icon) return icon;\n switch (type) {\n case \"item\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Cube placeholder\n case \"product\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Chip placeholder\n case \"account\":\n return <User size=\"100%\" />;\n }\n };\n\n if (compact) {\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={16} color={colors.textCompact || colors.text}>\n {renderIcon()}\n </Icon>\n </Box>\n );\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={2}\n paddingRight={4}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n <Icon size={20} color={colors.text}>\n {renderIcon()}\n </Icon>\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"500\"\n whiteSpace=\"nowrap\"\n >\n {type.charAt(0).toUpperCase() + type.slice(1)}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelSubentitySegment: React.FC<{\n type: SubentityType;\n theme: any;\n}> = ({ type, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.subentity;\n\n if (!colors || !type || typeof type !== \"string\") return null;\n\n // Icon mapping based on Figma\n const renderIcon = () => {\n switch (type) {\n case \"skin\":\n case \"in-game-item\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Pencil placeholder\n case \"game\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Controller placeholder\n case \"user\":\n return <User size=\"100%\" />;\n case \"settings\":\n return <Settings size=\"100%\" />;\n // ... more icons as needed\n default:\n return <Info size=\"100%\" />;\n }\n };\n\n const label = type\n .split(\"-\")\n .map((word) => word.charAt(0).toUpperCase() + word.slice(1))\n .join(\" \");\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={2}\n paddingRight={4}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n <Icon size={20} color={colors.text}>\n {renderIcon()}\n </Icon>\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"500\"\n whiteSpace=\"nowrap\"\n >\n {label}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelIdSegment: React.FC<{\n series?: string;\n number?: string;\n compact?: boolean;\n theme: any;\n}> = ({ series, number, compact, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.id;\n\n if (!colors) return null;\n\n if (compact) {\n return (\n <Box\n height={SEGMENT_HEIGHT}\n paddingLeft={4}\n paddingRight={6}\n flexDirection=\"row\"\n alignItems=\"center\"\n >\n {series && (\n <Text color={colors.textCompact} fontSize={14} fontWeight=\"400\">\n {series}\n </Text>\n )}\n {number && (\n <Text color={colors.textCompact} fontSize={14} fontWeight=\"400\">\n {number}\n </Text>\n )}\n </Box>\n );\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={4}\n paddingRight={6}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n {series && (\n <Box\n backgroundColor={colors.bgSeries}\n height={16}\n paddingHorizontal={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Text color={colors.textSeries} fontSize={14} fontWeight=\"500\">\n {series}\n </Text>\n </Box>\n )}\n {number && (\n <Text color={colors.textNumber} fontSize={14} fontWeight=\"500\">\n {number}\n </Text>\n )}\n </Box>\n );\n};\n\nconst TagLabelNameSegment: React.FC<{ label: string; theme: any }> = ({\n label,\n theme,\n}) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.name;\n\n if (!colors) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingHorizontal={4}\n justifyContent=\"center\"\n >\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"400\"\n whiteSpace=\"nowrap\"\n style={{\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n }}\n >\n {label}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelRaritySegment: React.FC<{ rarity: ReactNode; theme: any }> = ({\n rarity,\n theme,\n}) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.rarity;\n\n if (!colors) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingHorizontal={6}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={18} color={colors.text}>\n {rarity || <Info size=\"100%\" />}\n </Icon>\n </Box>\n );\n};\n\nconst TagLabelStatusSegment: React.FC<{ type: StatusType; theme: any }> = ({\n type,\n theme,\n}) => {\n let bg;\n let icon;\n\n if (!theme?.colors?.background) return null;\n\n switch (type) {\n case \"sale\":\n bg = theme.colors.background.warning?.primary;\n icon = <Info size=\"100%\" />; // Info placeholder\n break;\n case \"maintenance\":\n bg = theme.colors.background.success?.primary;\n icon = <Settings size=\"100%\" />;\n break;\n case \"inactive\":\n bg = theme.colors.background.alert?.primary;\n icon = <X size=\"100%\" />;\n break;\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n backgroundColor={bg}\n paddingHorizontal={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={20} color=\"black\">\n {icon}\n </Icon>\n </Box>\n );\n};\n\nconst TagLabelCustomSlot: React.FC<{ children: ReactNode; theme: any }> = ({\n children,\n theme,\n}) => {\n if (!theme?.colors?.background) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={theme.colors.background.secondary}\n paddingHorizontal={6}\n justifyContent=\"center\"\n >\n {typeof children === \"string\" ? (\n <Text\n color={theme?.colors?.content?.primary}\n fontSize={14}\n fontWeight=\"500\"\n >\n {children}\n </Text>\n ) : (\n children\n )}\n </Box>\n );\n};\n\n// --- Main Component ---\n\nexport const TagLabel: React.FC<TagLabelProps> = ({\n entityType,\n subentityType,\n icon,\n series,\n number,\n label,\n rarity,\n status,\n compact = false,\n children,\n style,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n return (\n <Box\n flexDirection=\"row\"\n alignItems=\"center\"\n style={{\n overflow: \"hidden\",\n borderRadius: 4, // Default radius from Figma\n ...style,\n }}\n >\n {entityType && (\n <TagLabelEntitySegment\n type={entityType}\n compact={compact}\n icon={icon}\n theme={theme}\n />\n )}\n\n {!compact && subentityType && (\n <TagLabelSubentitySegment type={subentityType} theme={theme} />\n )}\n\n {(series || number) && (\n <TagLabelIdSegment\n series={series}\n number={number}\n compact={compact}\n theme={theme}\n />\n )}\n\n {!compact && label && <TagLabelNameSegment label={label} theme={theme} />}\n\n {!compact && rarity && (\n <TagLabelRaritySegment rarity={rarity} theme={theme} />\n )}\n\n {!compact && status && (\n <TagLabelStatusSegment type={status} theme={theme} />\n )}\n\n {!compact && children && (\n <TagLabelCustomSlot theme={theme}>{children}</TagLabelCustomSlot>\n )}\n </Box>\n );\n};\n"],"mappings":"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","names":["jsx","View","jsx","jsx"]}
1
+ {"version":3,"sources":["../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx","../../../../foundation/primitives-native/src/Icon.tsx","../../src/TagLabel.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n flexDirection,\n alignItems,\n justifyContent,\n position,\n top,\n bottom,\n left,\n right,\n width,\n minWidth,\n minHeight,\n maxWidth,\n maxHeight,\n flex,\n overflow,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n 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 alignItems,\n justifyContent,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Destructure and drop web-only props from rest before passing to RN components\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": _ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": _ariaDisabled,\n \"aria-live\": _ariaLive,\n className,\n \"data-testid\": _dataTestId,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n if (onPress) {\n return (\n <Pressable\n onPress={onPress}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\n","import React from \"react\";\nimport {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string | number | undefined\n): number | undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n 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 React from \"react\";\nimport { View, ViewStyle } from \"react-native\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Icon: React.FC<IconProps> = ({\n children,\n color,\n size,\n testID,\n \"data-testid\": dataTestId,\n}) => {\n const style: ViewStyle = {\n width: typeof size === \"number\" ? size : undefined,\n height: typeof size === \"number\" ? size : undefined,\n alignItems: \"center\",\n justifyContent: \"center\",\n };\n\n // On native, we try to pass the color down to children (like Text primitives)\n // to mimic the CSS inheritance behavior of the web version.\n const childrenWithProps = React.Children.map(children, (child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n color: child.props.color || color,\n // Also pass size if child seems to be an icon that needs it\n size: child.props.size || size,\n });\n }\n return child;\n });\n\n return (\n <View style={style} testID={dataTestId || testID}>\n {childrenWithProps}\n </View>\n );\n};\n","import React, { type ReactNode } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\nimport { User, Settings, Info, X } from \"@xsolla/xui-icons\";\n\n// --- Types ---\n\nexport type EntityType = \"item\" | \"product\" | \"account\";\n\nexport type StatusType = \"sale\" | \"maintenance\" | \"inactive\";\n\nexport type SubentityType =\n | \"skin\"\n | \"in-game-item\"\n | \"currency\"\n | \"bundle\"\n | \"lootbox\"\n | \"game-key\"\n | \"discount\"\n | \"coupon\"\n | \"game\"\n | \"sdk\"\n | \"plugin\"\n | \"api\"\n | \"service\"\n | \"tool\"\n | \"webshop\"\n | \"app\"\n | \"launcher\"\n | \"library\"\n | \"engine\"\n | \"user\"\n | \"developer\"\n | \"influencer\"\n | \"publisher\"\n | \"settings\";\n\nexport interface TagLabelProps extends ThemeOverrideProps {\n /** Main entity type */\n entityType?: EntityType;\n /** Detailed sub-category */\n subentityType?: SubentityType;\n /** Custom icon for entity/subentity if needed */\n icon?: ReactNode;\n /** ID series (e.g. \"XLA\") */\n series?: string;\n /** ID number (e.g. \"-001-001\") */\n number?: string;\n /** Item label/name */\n label?: string;\n /** Rarity icon or indicator */\n rarity?: ReactNode;\n /** Status indicator */\n status?: StatusType;\n /** Whether to show the compact version */\n compact?: boolean;\n /** Custom content slot */\n children?: ReactNode;\n /** Custom styles */\n style?: any;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\n// --- Internal Segments ---\n\nconst SEGMENT_HEIGHT = 24;\n\nconst TagLabelEntitySegment: React.FC<{\n type: EntityType;\n compact?: boolean;\n icon?: ReactNode;\n theme: any;\n}> = ({ type, compact, icon, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.[type];\n\n if (!colors) return null;\n\n // Generic icon placeholders for now based on Figma intent\n const renderIcon = () => {\n if (icon) return icon;\n switch (type) {\n case \"item\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Cube placeholder\n case \"product\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Chip placeholder\n case \"account\":\n return <User size=\"100%\" />;\n }\n };\n\n if (compact) {\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={16} color={colors.textCompact || colors.text}>\n {renderIcon()}\n </Icon>\n </Box>\n );\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={2}\n paddingRight={4}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n <Icon size={20} color={colors.text}>\n {renderIcon()}\n </Icon>\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"500\"\n whiteSpace=\"nowrap\"\n >\n {type.charAt(0).toUpperCase() + type.slice(1)}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelSubentitySegment: React.FC<{\n type: SubentityType;\n theme: any;\n}> = ({ type, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.subentity;\n\n if (!colors || !type || typeof type !== \"string\") return null;\n\n // Icon mapping based on Figma\n const renderIcon = () => {\n switch (type) {\n case \"skin\":\n case \"in-game-item\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Pencil placeholder\n case \"game\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Controller placeholder\n case \"user\":\n return <User size=\"100%\" />;\n case \"settings\":\n return <Settings size=\"100%\" />;\n // ... more icons as needed\n default:\n return <Info size=\"100%\" />;\n }\n };\n\n const label = type\n .split(\"-\")\n .map((word) => word.charAt(0).toUpperCase() + word.slice(1))\n .join(\" \");\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={2}\n paddingRight={4}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n <Icon size={20} color={colors.text}>\n {renderIcon()}\n </Icon>\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"500\"\n whiteSpace=\"nowrap\"\n >\n {label}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelIdSegment: React.FC<{\n series?: string;\n number?: string;\n compact?: boolean;\n theme: any;\n}> = ({ series, number, compact, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.id;\n\n if (!colors) return null;\n\n if (compact) {\n return (\n <Box\n height={SEGMENT_HEIGHT}\n paddingLeft={4}\n paddingRight={6}\n flexDirection=\"row\"\n alignItems=\"center\"\n >\n {series && (\n <Text color={colors.textCompact} fontSize={14} fontWeight=\"400\">\n {series}\n </Text>\n )}\n {number && (\n <Text color={colors.textCompact} fontSize={14} fontWeight=\"400\">\n {number}\n </Text>\n )}\n </Box>\n );\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={4}\n paddingRight={6}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n {series && (\n <Box\n backgroundColor={colors.bgSeries}\n height={16}\n paddingHorizontal={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Text color={colors.textSeries} fontSize={14} fontWeight=\"500\">\n {series}\n </Text>\n </Box>\n )}\n {number && (\n <Text color={colors.textNumber} fontSize={14} fontWeight=\"500\">\n {number}\n </Text>\n )}\n </Box>\n );\n};\n\nconst TagLabelNameSegment: React.FC<{ label: string; theme: any }> = ({\n label,\n theme,\n}) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.name;\n\n if (!colors) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingHorizontal={4}\n justifyContent=\"center\"\n >\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"400\"\n whiteSpace=\"nowrap\"\n style={{\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n }}\n >\n {label}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelRaritySegment: React.FC<{ rarity: ReactNode; theme: any }> = ({\n rarity,\n theme,\n}) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.rarity;\n\n if (!colors) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingHorizontal={6}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={18} color={colors.text}>\n {rarity || <Info size=\"100%\" />}\n </Icon>\n </Box>\n );\n};\n\nconst TagLabelStatusSegment: React.FC<{ type: StatusType; theme: any }> = ({\n type,\n theme,\n}) => {\n let bg;\n let icon;\n\n if (!theme?.colors?.background) return null;\n\n switch (type) {\n case \"sale\":\n bg = theme.colors.background.warning?.primary;\n icon = <Info size=\"100%\" />; // Info placeholder\n break;\n case \"maintenance\":\n bg = theme.colors.background.success?.primary;\n icon = <Settings size=\"100%\" />;\n break;\n case \"inactive\":\n bg = theme.colors.background.alert?.primary;\n icon = <X size=\"100%\" />;\n break;\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n backgroundColor={bg}\n paddingHorizontal={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={20} color=\"black\">\n {icon}\n </Icon>\n </Box>\n );\n};\n\nconst TagLabelCustomSlot: React.FC<{ children: ReactNode; theme: any }> = ({\n children,\n theme,\n}) => {\n if (!theme?.colors?.background) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={theme.colors.background.secondary}\n paddingHorizontal={6}\n justifyContent=\"center\"\n >\n {typeof children === \"string\" ? (\n <Text\n color={theme?.colors?.content?.primary}\n fontSize={14}\n fontWeight=\"500\"\n >\n {children}\n </Text>\n ) : (\n children\n )}\n </Box>\n );\n};\n\n// --- Main Component ---\n\nexport const TagLabel: React.FC<TagLabelProps> = ({\n entityType,\n subentityType,\n icon,\n series,\n number,\n label,\n rarity,\n status,\n compact = false,\n children,\n style,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n return (\n <Box\n testID={testID}\n flexDirection=\"row\"\n alignItems=\"center\"\n style={{\n overflow: \"hidden\",\n borderRadius: 4, // Default radius from Figma\n ...style,\n }}\n >\n {entityType && (\n <TagLabelEntitySegment\n type={entityType}\n compact={compact}\n icon={icon}\n theme={theme}\n />\n )}\n\n {!compact && subentityType && (\n <TagLabelSubentitySegment type={subentityType} theme={theme} />\n )}\n\n {(series || number) && (\n <TagLabelIdSegment\n series={series}\n number={number}\n compact={compact}\n theme={theme}\n />\n )}\n\n {!compact && label && <TagLabelNameSegment label={label} theme={theme} />}\n\n {!compact && rarity && (\n <TagLabelRaritySegment rarity={rarity} theme={theme} />\n )}\n\n {!compact && status && (\n <TagLabelStatusSegment type={status} theme={theme} />\n )}\n\n {!compact && children && (\n <TagLabelCustomSlot theme={theme}>{children}</TagLabelCustomSlot>\n )}\n </Box>\n );\n};\n"],"mappings":"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","names":["jsx","View","jsx","jsx"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@xsolla/xui-tag-label",
3
- "version": "0.158.0",
3
+ "version": "0.159.0",
4
4
  "main": "./web/index.js",
5
5
  "module": "./web/index.mjs",
6
6
  "types": "./web/index.d.ts",
@@ -10,9 +10,9 @@
10
10
  "build:native": "PLATFORM=native tsup"
11
11
  },
12
12
  "dependencies": {
13
- "@xsolla/xui-core": "0.158.0",
14
- "@xsolla/xui-icons": "0.158.0",
15
- "@xsolla/xui-primitives-core": "0.158.0"
13
+ "@xsolla/xui-core": "0.159.0",
14
+ "@xsolla/xui-icons": "0.159.0",
15
+ "@xsolla/xui-primitives-core": "0.159.0"
16
16
  },
17
17
  "peerDependencies": {
18
18
  "react": ">=16.8.0",
package/web/index.d.mts CHANGED
@@ -27,6 +27,8 @@ interface TagLabelProps extends ThemeOverrideProps {
27
27
  children?: ReactNode;
28
28
  /** Custom styles */
29
29
  style?: any;
30
+ /** Test ID for testing frameworks */
31
+ testID?: string;
30
32
  }
31
33
  declare const TagLabel: React.FC<TagLabelProps>;
32
34
 
package/web/index.d.ts CHANGED
@@ -27,6 +27,8 @@ interface TagLabelProps extends ThemeOverrideProps {
27
27
  children?: ReactNode;
28
28
  /** Custom styles */
29
29
  style?: any;
30
+ /** Test ID for testing frameworks */
31
+ testID?: string;
30
32
  }
31
33
  declare const TagLabel: React.FC<TagLabelProps>;
32
34
 
package/web/index.js CHANGED
@@ -304,6 +304,8 @@ var Text = ({
304
304
  className,
305
305
  id,
306
306
  role,
307
+ testID,
308
+ "data-testid": dataTestId,
307
309
  numberOfLines: _numberOfLines,
308
310
  ...props
309
311
  }) => {
@@ -314,7 +316,8 @@ var Text = ({
314
316
  style,
315
317
  className,
316
318
  id,
317
- role
319
+ role,
320
+ "data-testid": dataTestId || testID
318
321
  }
319
322
  );
320
323
  };
@@ -338,8 +341,13 @@ var StyledIcon = (0, import_styled_components3.default)(FilteredDiv2)`
338
341
  stroke: currentColor;
339
342
  }
340
343
  `;
341
- var Icon = ({ children, ...props }) => {
342
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(StyledIcon, { ...props, children });
344
+ var Icon = ({
345
+ children,
346
+ testID,
347
+ "data-testid": dataTestId,
348
+ ...props
349
+ }) => {
350
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(StyledIcon, { "data-testid": dataTestId || testID, ...props, children });
343
351
  };
344
352
 
345
353
  // src/TagLabel.tsx
@@ -639,6 +647,7 @@ var TagLabel = ({
639
647
  compact = false,
640
648
  children,
641
649
  style,
650
+ testID,
642
651
  themeMode,
643
652
  themeProductContext
644
653
  }) => {
@@ -646,6 +655,7 @@ var TagLabel = ({
646
655
  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
647
656
  Box,
648
657
  {
658
+ testID,
649
659
  flexDirection: "row",
650
660
  alignItems: "center",
651
661
  style: {
package/web/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.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/Icon.tsx","../../src/TagLabel.tsx"],"sourcesContent":["export * from \"./TagLabel\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (props.disabled ? 0.5 : 1)};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n onError,\n onLoad,\n type,\n disabled,\n id,\n testID,\n \"data-testid\": dataTestId,\n ...props\n },\n ref\n ) => {\n // Handle as=\"img\" for rendering images with proper border-radius\n if (as === \"img\" && src) {\n return (\n <img\n src={src}\n alt={alt || \"\"}\n onError={onError}\n onLoad={onLoad}\n style={{\n display: \"block\",\n objectFit: \"cover\",\n width:\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width,\n height:\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height,\n borderRadius:\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius,\n position: props.position,\n top: typeof props.top === \"number\" ? `${props.top}px` : props.top,\n left:\n typeof props.left === \"number\" ? `${props.left}px` : props.left,\n right:\n typeof props.right === \"number\"\n ? `${props.right}px`\n : props.right,\n bottom:\n typeof props.bottom === \"number\"\n ? `${props.bottom}px`\n : props.bottom,\n ...props.style,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n elementType={as}\n id={id}\n type={as === \"button\" ? type || \"button\" : undefined}\n disabled={as === \"button\" ? disabled : undefined}\n onClick={onPress}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n role={role}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-current={ariaCurrent}\n aria-disabled={ariaDisabled}\n aria-busy={ariaBusy}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n aria-live={ariaLive}\n tabIndex={tabIndex !== undefined ? tabIndex : undefined}\n data-testid={dataTestId || testID}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport isPropValid from \"@emotion/is-prop-valid\";\n\n// Props that @emotion/is-prop-valid incorrectly treats as valid HTML.\n// These are React Native or component-specific props that match\n// valid HTML patterns (on* event handlers, SVG attributes).\nexport const ADDITIONAL_BLOCKED_PROPS = new Set([\n // RN-only event handlers (pass isPropValid's on* pattern)\n \"onPress\",\n \"onChangeText\",\n \"onLayout\",\n \"onMoveShouldSetResponder\",\n \"onResponderGrant\",\n \"onResponderMove\",\n \"onResponderRelease\",\n \"onResponderTerminate\",\n // SVG attributes that pass isPropValid\n \"strokeWidth\",\n // CSS properties that pass isPropValid but are used as component props\n \"overflow\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n]);\n\nfunction shouldForwardProp(key: string): boolean {\n if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;\n return isPropValid(key);\n}\n\n/**\n * Creates a React component that renders the given HTML tag\n * but filters out non-HTML props before they reach the DOM.\n *\n * Uses @emotion/is-prop-valid (same library styled-components v4\n * uses internally) to automatically block invalid HTML attributes,\n * plus a small blocklist for false positives (RN on* handlers, SVG attrs).\n *\n * Usage: `const FilteredDiv = createFilteredElement(\"div\");`\n * Then: `const StyledBox = styled(FilteredDiv)<BoxProps>\\`...\\`;`\n *\n * styled-components can still read ALL props for CSS interpolation,\n * but only valid HTML attributes are forwarded to the DOM element.\n */\nexport function createFilteredElement(defaultTag: string) {\n const Component = React.forwardRef<HTMLElement, Record<string, unknown>>(\n ({ children, elementType, ...props }, ref) => {\n const Tag = (elementType as string) || defaultTag;\n const htmlProps: Record<string, unknown> = {};\n for (const key of Object.keys(props)) {\n if (shouldForwardProp(key)) {\n htmlProps[key] = props[key];\n }\n }\n return React.createElement(\n Tag,\n { ref, ...htmlProps },\n children as React.ReactNode\n );\n }\n );\n Component.displayName = `Filtered(${defaultTag})`;\n return Component;\n}\n","function memoize(fn) {\n var cache = {};\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport default memoize;\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|inert|itemProp|itemScope|itemType|itemID|itemRef|on|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar index = memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport default index;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredSpan = createFilteredElement(\"span\");\n\nconst StyledText = styled(FilteredSpan)<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledIcon = styled(FilteredDiv)<IconProps>`\n display: flex;\n align-items: center;\n justify-content: center;\n width: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n height: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n color: ${(props) => props.color || \"currentColor\"};\n\n svg {\n width: 100%;\n height: 100%;\n fill: none;\n stroke: currentColor;\n }\n`;\n\nexport const Icon: React.FC<IconProps> = ({ children, ...props }) => {\n return <StyledIcon {...props}>{children}</StyledIcon>;\n};\n","import React, { type ReactNode } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\nimport { User, Settings, Info, X } from \"@xsolla/xui-icons\";\n\n// --- Types ---\n\nexport type EntityType = \"item\" | \"product\" | \"account\";\n\nexport type StatusType = \"sale\" | \"maintenance\" | \"inactive\";\n\nexport type SubentityType =\n | \"skin\"\n | \"in-game-item\"\n | \"currency\"\n | \"bundle\"\n | \"lootbox\"\n | \"game-key\"\n | \"discount\"\n | \"coupon\"\n | \"game\"\n | \"sdk\"\n | \"plugin\"\n | \"api\"\n | \"service\"\n | \"tool\"\n | \"webshop\"\n | \"app\"\n | \"launcher\"\n | \"library\"\n | \"engine\"\n | \"user\"\n | \"developer\"\n | \"influencer\"\n | \"publisher\"\n | \"settings\";\n\nexport interface TagLabelProps extends ThemeOverrideProps {\n /** Main entity type */\n entityType?: EntityType;\n /** Detailed sub-category */\n subentityType?: SubentityType;\n /** Custom icon for entity/subentity if needed */\n icon?: ReactNode;\n /** ID series (e.g. \"XLA\") */\n series?: string;\n /** ID number (e.g. \"-001-001\") */\n number?: string;\n /** Item label/name */\n label?: string;\n /** Rarity icon or indicator */\n rarity?: ReactNode;\n /** Status indicator */\n status?: StatusType;\n /** Whether to show the compact version */\n compact?: boolean;\n /** Custom content slot */\n children?: ReactNode;\n /** Custom styles */\n style?: any;\n}\n\n// --- Internal Segments ---\n\nconst SEGMENT_HEIGHT = 24;\n\nconst TagLabelEntitySegment: React.FC<{\n type: EntityType;\n compact?: boolean;\n icon?: ReactNode;\n theme: any;\n}> = ({ type, compact, icon, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.[type];\n\n if (!colors) return null;\n\n // Generic icon placeholders for now based on Figma intent\n const renderIcon = () => {\n if (icon) return icon;\n switch (type) {\n case \"item\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Cube placeholder\n case \"product\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Chip placeholder\n case \"account\":\n return <User size=\"100%\" />;\n }\n };\n\n if (compact) {\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={16} color={colors.textCompact || colors.text}>\n {renderIcon()}\n </Icon>\n </Box>\n );\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={2}\n paddingRight={4}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n <Icon size={20} color={colors.text}>\n {renderIcon()}\n </Icon>\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"500\"\n whiteSpace=\"nowrap\"\n >\n {type.charAt(0).toUpperCase() + type.slice(1)}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelSubentitySegment: React.FC<{\n type: SubentityType;\n theme: any;\n}> = ({ type, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.subentity;\n\n if (!colors || !type || typeof type !== \"string\") return null;\n\n // Icon mapping based on Figma\n const renderIcon = () => {\n switch (type) {\n case \"skin\":\n case \"in-game-item\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Pencil placeholder\n case \"game\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Controller placeholder\n case \"user\":\n return <User size=\"100%\" />;\n case \"settings\":\n return <Settings size=\"100%\" />;\n // ... more icons as needed\n default:\n return <Info size=\"100%\" />;\n }\n };\n\n const label = type\n .split(\"-\")\n .map((word) => word.charAt(0).toUpperCase() + word.slice(1))\n .join(\" \");\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={2}\n paddingRight={4}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n <Icon size={20} color={colors.text}>\n {renderIcon()}\n </Icon>\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"500\"\n whiteSpace=\"nowrap\"\n >\n {label}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelIdSegment: React.FC<{\n series?: string;\n number?: string;\n compact?: boolean;\n theme: any;\n}> = ({ series, number, compact, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.id;\n\n if (!colors) return null;\n\n if (compact) {\n return (\n <Box\n height={SEGMENT_HEIGHT}\n paddingLeft={4}\n paddingRight={6}\n flexDirection=\"row\"\n alignItems=\"center\"\n >\n {series && (\n <Text color={colors.textCompact} fontSize={14} fontWeight=\"400\">\n {series}\n </Text>\n )}\n {number && (\n <Text color={colors.textCompact} fontSize={14} fontWeight=\"400\">\n {number}\n </Text>\n )}\n </Box>\n );\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={4}\n paddingRight={6}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n {series && (\n <Box\n backgroundColor={colors.bgSeries}\n height={16}\n paddingHorizontal={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Text color={colors.textSeries} fontSize={14} fontWeight=\"500\">\n {series}\n </Text>\n </Box>\n )}\n {number && (\n <Text color={colors.textNumber} fontSize={14} fontWeight=\"500\">\n {number}\n </Text>\n )}\n </Box>\n );\n};\n\nconst TagLabelNameSegment: React.FC<{ label: string; theme: any }> = ({\n label,\n theme,\n}) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.name;\n\n if (!colors) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingHorizontal={4}\n justifyContent=\"center\"\n >\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"400\"\n whiteSpace=\"nowrap\"\n style={{\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n }}\n >\n {label}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelRaritySegment: React.FC<{ rarity: ReactNode; theme: any }> = ({\n rarity,\n theme,\n}) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.rarity;\n\n if (!colors) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingHorizontal={6}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={18} color={colors.text}>\n {rarity || <Info size=\"100%\" />}\n </Icon>\n </Box>\n );\n};\n\nconst TagLabelStatusSegment: React.FC<{ type: StatusType; theme: any }> = ({\n type,\n theme,\n}) => {\n let bg;\n let icon;\n\n if (!theme?.colors?.background) return null;\n\n switch (type) {\n case \"sale\":\n bg = theme.colors.background.warning?.primary;\n icon = <Info size=\"100%\" />; // Info placeholder\n break;\n case \"maintenance\":\n bg = theme.colors.background.success?.primary;\n icon = <Settings size=\"100%\" />;\n break;\n case \"inactive\":\n bg = theme.colors.background.alert?.primary;\n icon = <X size=\"100%\" />;\n break;\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n backgroundColor={bg}\n paddingHorizontal={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={20} color=\"black\">\n {icon}\n </Icon>\n </Box>\n );\n};\n\nconst TagLabelCustomSlot: React.FC<{ children: ReactNode; theme: any }> = ({\n children,\n theme,\n}) => {\n if (!theme?.colors?.background) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={theme.colors.background.secondary}\n paddingHorizontal={6}\n justifyContent=\"center\"\n >\n {typeof children === \"string\" ? (\n <Text\n color={theme?.colors?.content?.primary}\n fontSize={14}\n fontWeight=\"500\"\n >\n {children}\n </Text>\n ) : (\n children\n )}\n </Box>\n );\n};\n\n// --- Main Component ---\n\nexport const TagLabel: React.FC<TagLabelProps> = ({\n entityType,\n subentityType,\n icon,\n series,\n number,\n label,\n rarity,\n status,\n compact = false,\n children,\n style,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n return (\n <Box\n flexDirection=\"row\"\n alignItems=\"center\"\n style={{\n overflow: \"hidden\",\n borderRadius: 4, // Default radius from Figma\n ...style,\n }}\n >\n {entityType && (\n <TagLabelEntitySegment\n type={entityType}\n compact={compact}\n icon={icon}\n theme={theme}\n />\n )}\n\n {!compact && subentityType && (\n <TagLabelSubentitySegment type={subentityType} theme={theme} />\n )}\n\n {(series || number) && (\n <TagLabelIdSegment\n series={series}\n number={number}\n compact={compact}\n theme={theme}\n />\n )}\n\n {!compact && label && <TagLabelNameSegment label={label} theme={theme} />}\n\n {!compact && rarity && (\n <TagLabelRaritySegment rarity={rarity} theme={theme} />\n )}\n\n {!compact && status && (\n <TagLabelStatusSegment type={status} theme={theme} />\n )}\n\n {!compact && children && (\n <TagLabelCustomSlot theme={theme}>{children}</TagLabelCustomSlot>\n )}\n </Box>\n );\n};\n"],"mappings":"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","names":["import_react","React","styled","React","import_styled_components","import_jsx_runtime","styled","import_styled_components","import_jsx_runtime","FilteredDiv","styled","import_jsx_runtime"]}
1
+ {"version":3,"sources":["../../src/index.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/Icon.tsx","../../src/TagLabel.tsx"],"sourcesContent":["export * from \"./TagLabel\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (props.disabled ? 0.5 : 1)};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n onError,\n onLoad,\n type,\n disabled,\n id,\n testID,\n \"data-testid\": dataTestId,\n ...props\n },\n ref\n ) => {\n // Handle as=\"img\" for rendering images with proper border-radius\n if (as === \"img\" && src) {\n return (\n <img\n src={src}\n alt={alt || \"\"}\n onError={onError}\n onLoad={onLoad}\n style={{\n display: \"block\",\n objectFit: \"cover\",\n width:\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width,\n height:\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height,\n borderRadius:\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius,\n position: props.position,\n top: typeof props.top === \"number\" ? `${props.top}px` : props.top,\n left:\n typeof props.left === \"number\" ? `${props.left}px` : props.left,\n right:\n typeof props.right === \"number\"\n ? `${props.right}px`\n : props.right,\n bottom:\n typeof props.bottom === \"number\"\n ? `${props.bottom}px`\n : props.bottom,\n ...props.style,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n elementType={as}\n id={id}\n type={as === \"button\" ? type || \"button\" : undefined}\n disabled={as === \"button\" ? disabled : undefined}\n onClick={onPress}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n role={role}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-current={ariaCurrent}\n aria-disabled={ariaDisabled}\n aria-busy={ariaBusy}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n aria-live={ariaLive}\n tabIndex={tabIndex !== undefined ? tabIndex : undefined}\n data-testid={dataTestId || testID}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport isPropValid from \"@emotion/is-prop-valid\";\n\n// Props that @emotion/is-prop-valid incorrectly treats as valid HTML.\n// These are React Native or component-specific props that match\n// valid HTML patterns (on* event handlers, SVG attributes).\nexport const ADDITIONAL_BLOCKED_PROPS = new Set([\n // RN-only event handlers (pass isPropValid's on* pattern)\n \"onPress\",\n \"onChangeText\",\n \"onLayout\",\n \"onMoveShouldSetResponder\",\n \"onResponderGrant\",\n \"onResponderMove\",\n \"onResponderRelease\",\n \"onResponderTerminate\",\n // SVG attributes that pass isPropValid\n \"strokeWidth\",\n // CSS properties that pass isPropValid but are used as component props\n \"overflow\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n]);\n\nfunction shouldForwardProp(key: string): boolean {\n if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;\n return isPropValid(key);\n}\n\n/**\n * Creates a React component that renders the given HTML tag\n * but filters out non-HTML props before they reach the DOM.\n *\n * Uses @emotion/is-prop-valid (same library styled-components v4\n * uses internally) to automatically block invalid HTML attributes,\n * plus a small blocklist for false positives (RN on* handlers, SVG attrs).\n *\n * Usage: `const FilteredDiv = createFilteredElement(\"div\");`\n * Then: `const StyledBox = styled(FilteredDiv)<BoxProps>\\`...\\`;`\n *\n * styled-components can still read ALL props for CSS interpolation,\n * but only valid HTML attributes are forwarded to the DOM element.\n */\nexport function createFilteredElement(defaultTag: string) {\n const Component = React.forwardRef<HTMLElement, Record<string, unknown>>(\n ({ children, elementType, ...props }, ref) => {\n const Tag = (elementType as string) || defaultTag;\n const htmlProps: Record<string, unknown> = {};\n for (const key of Object.keys(props)) {\n if (shouldForwardProp(key)) {\n htmlProps[key] = props[key];\n }\n }\n return React.createElement(\n Tag,\n { ref, ...htmlProps },\n children as React.ReactNode\n );\n }\n );\n Component.displayName = `Filtered(${defaultTag})`;\n return Component;\n}\n","function memoize(fn) {\n var cache = {};\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport default memoize;\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|inert|itemProp|itemScope|itemType|itemID|itemRef|on|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar index = memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport default index;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredSpan = createFilteredElement(\"span\");\n\nconst StyledText = styled(FilteredSpan)<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n testID,\n \"data-testid\": dataTestId,\n numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n data-testid={dataTestId || testID}\n />\n );\n};\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledIcon = styled(FilteredDiv)<IconProps>`\n display: flex;\n align-items: center;\n justify-content: center;\n width: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n height: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n color: ${(props) => props.color || \"currentColor\"};\n\n svg {\n width: 100%;\n height: 100%;\n fill: none;\n stroke: currentColor;\n }\n`;\n\nexport const Icon: React.FC<IconProps> = ({\n children,\n testID,\n \"data-testid\": dataTestId,\n ...props\n}) => {\n return (\n <StyledIcon data-testid={dataTestId || testID} {...props}>\n {children}\n </StyledIcon>\n );\n};\n","import React, { type ReactNode } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\nimport { User, Settings, Info, X } from \"@xsolla/xui-icons\";\n\n// --- Types ---\n\nexport type EntityType = \"item\" | \"product\" | \"account\";\n\nexport type StatusType = \"sale\" | \"maintenance\" | \"inactive\";\n\nexport type SubentityType =\n | \"skin\"\n | \"in-game-item\"\n | \"currency\"\n | \"bundle\"\n | \"lootbox\"\n | \"game-key\"\n | \"discount\"\n | \"coupon\"\n | \"game\"\n | \"sdk\"\n | \"plugin\"\n | \"api\"\n | \"service\"\n | \"tool\"\n | \"webshop\"\n | \"app\"\n | \"launcher\"\n | \"library\"\n | \"engine\"\n | \"user\"\n | \"developer\"\n | \"influencer\"\n | \"publisher\"\n | \"settings\";\n\nexport interface TagLabelProps extends ThemeOverrideProps {\n /** Main entity type */\n entityType?: EntityType;\n /** Detailed sub-category */\n subentityType?: SubentityType;\n /** Custom icon for entity/subentity if needed */\n icon?: ReactNode;\n /** ID series (e.g. \"XLA\") */\n series?: string;\n /** ID number (e.g. \"-001-001\") */\n number?: string;\n /** Item label/name */\n label?: string;\n /** Rarity icon or indicator */\n rarity?: ReactNode;\n /** Status indicator */\n status?: StatusType;\n /** Whether to show the compact version */\n compact?: boolean;\n /** Custom content slot */\n children?: ReactNode;\n /** Custom styles */\n style?: any;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\n// --- Internal Segments ---\n\nconst SEGMENT_HEIGHT = 24;\n\nconst TagLabelEntitySegment: React.FC<{\n type: EntityType;\n compact?: boolean;\n icon?: ReactNode;\n theme: any;\n}> = ({ type, compact, icon, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.[type];\n\n if (!colors) return null;\n\n // Generic icon placeholders for now based on Figma intent\n const renderIcon = () => {\n if (icon) return icon;\n switch (type) {\n case \"item\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Cube placeholder\n case \"product\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Chip placeholder\n case \"account\":\n return <User size=\"100%\" />;\n }\n };\n\n if (compact) {\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={16} color={colors.textCompact || colors.text}>\n {renderIcon()}\n </Icon>\n </Box>\n );\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={2}\n paddingRight={4}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n <Icon size={20} color={colors.text}>\n {renderIcon()}\n </Icon>\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"500\"\n whiteSpace=\"nowrap\"\n >\n {type.charAt(0).toUpperCase() + type.slice(1)}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelSubentitySegment: React.FC<{\n type: SubentityType;\n theme: any;\n}> = ({ type, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.subentity;\n\n if (!colors || !type || typeof type !== \"string\") return null;\n\n // Icon mapping based on Figma\n const renderIcon = () => {\n switch (type) {\n case \"skin\":\n case \"in-game-item\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Pencil placeholder\n case \"game\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Controller placeholder\n case \"user\":\n return <User size=\"100%\" />;\n case \"settings\":\n return <Settings size=\"100%\" />;\n // ... more icons as needed\n default:\n return <Info size=\"100%\" />;\n }\n };\n\n const label = type\n .split(\"-\")\n .map((word) => word.charAt(0).toUpperCase() + word.slice(1))\n .join(\" \");\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={2}\n paddingRight={4}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n <Icon size={20} color={colors.text}>\n {renderIcon()}\n </Icon>\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"500\"\n whiteSpace=\"nowrap\"\n >\n {label}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelIdSegment: React.FC<{\n series?: string;\n number?: string;\n compact?: boolean;\n theme: any;\n}> = ({ series, number, compact, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.id;\n\n if (!colors) return null;\n\n if (compact) {\n return (\n <Box\n height={SEGMENT_HEIGHT}\n paddingLeft={4}\n paddingRight={6}\n flexDirection=\"row\"\n alignItems=\"center\"\n >\n {series && (\n <Text color={colors.textCompact} fontSize={14} fontWeight=\"400\">\n {series}\n </Text>\n )}\n {number && (\n <Text color={colors.textCompact} fontSize={14} fontWeight=\"400\">\n {number}\n </Text>\n )}\n </Box>\n );\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={4}\n paddingRight={6}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n {series && (\n <Box\n backgroundColor={colors.bgSeries}\n height={16}\n paddingHorizontal={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Text color={colors.textSeries} fontSize={14} fontWeight=\"500\">\n {series}\n </Text>\n </Box>\n )}\n {number && (\n <Text color={colors.textNumber} fontSize={14} fontWeight=\"500\">\n {number}\n </Text>\n )}\n </Box>\n );\n};\n\nconst TagLabelNameSegment: React.FC<{ label: string; theme: any }> = ({\n label,\n theme,\n}) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.name;\n\n if (!colors) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingHorizontal={4}\n justifyContent=\"center\"\n >\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"400\"\n whiteSpace=\"nowrap\"\n style={{\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n }}\n >\n {label}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelRaritySegment: React.FC<{ rarity: ReactNode; theme: any }> = ({\n rarity,\n theme,\n}) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.rarity;\n\n if (!colors) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingHorizontal={6}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={18} color={colors.text}>\n {rarity || <Info size=\"100%\" />}\n </Icon>\n </Box>\n );\n};\n\nconst TagLabelStatusSegment: React.FC<{ type: StatusType; theme: any }> = ({\n type,\n theme,\n}) => {\n let bg;\n let icon;\n\n if (!theme?.colors?.background) return null;\n\n switch (type) {\n case \"sale\":\n bg = theme.colors.background.warning?.primary;\n icon = <Info size=\"100%\" />; // Info placeholder\n break;\n case \"maintenance\":\n bg = theme.colors.background.success?.primary;\n icon = <Settings size=\"100%\" />;\n break;\n case \"inactive\":\n bg = theme.colors.background.alert?.primary;\n icon = <X size=\"100%\" />;\n break;\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n backgroundColor={bg}\n paddingHorizontal={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={20} color=\"black\">\n {icon}\n </Icon>\n </Box>\n );\n};\n\nconst TagLabelCustomSlot: React.FC<{ children: ReactNode; theme: any }> = ({\n children,\n theme,\n}) => {\n if (!theme?.colors?.background) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={theme.colors.background.secondary}\n paddingHorizontal={6}\n justifyContent=\"center\"\n >\n {typeof children === \"string\" ? (\n <Text\n color={theme?.colors?.content?.primary}\n fontSize={14}\n fontWeight=\"500\"\n >\n {children}\n </Text>\n ) : (\n children\n )}\n </Box>\n );\n};\n\n// --- Main Component ---\n\nexport const TagLabel: React.FC<TagLabelProps> = ({\n entityType,\n subentityType,\n icon,\n series,\n number,\n label,\n rarity,\n status,\n compact = false,\n children,\n style,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n return (\n <Box\n testID={testID}\n flexDirection=\"row\"\n alignItems=\"center\"\n style={{\n overflow: \"hidden\",\n borderRadius: 4, // Default radius from Figma\n ...style,\n }}\n >\n {entityType && (\n <TagLabelEntitySegment\n type={entityType}\n compact={compact}\n icon={icon}\n theme={theme}\n />\n )}\n\n {!compact && subentityType && (\n <TagLabelSubentitySegment type={subentityType} theme={theme} />\n )}\n\n {(series || number) && (\n <TagLabelIdSegment\n series={series}\n number={number}\n compact={compact}\n theme={theme}\n />\n )}\n\n {!compact && label && <TagLabelNameSegment label={label} theme={theme} />}\n\n {!compact && rarity && (\n <TagLabelRaritySegment rarity={rarity} theme={theme} />\n )}\n\n {!compact && status && (\n <TagLabelStatusSegment type={status} theme={theme} />\n )}\n\n {!compact && children && (\n <TagLabelCustomSlot theme={theme}>{children}</TagLabelCustomSlot>\n )}\n </Box>\n );\n};\n"],"mappings":"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","names":["import_react","React","styled","React","import_styled_components","import_jsx_runtime","styled","import_styled_components","import_jsx_runtime","FilteredDiv","styled","import_jsx_runtime"]}
package/web/index.mjs CHANGED
@@ -268,6 +268,8 @@ var Text = ({
268
268
  className,
269
269
  id,
270
270
  role,
271
+ testID,
272
+ "data-testid": dataTestId,
271
273
  numberOfLines: _numberOfLines,
272
274
  ...props
273
275
  }) => {
@@ -278,7 +280,8 @@ var Text = ({
278
280
  style,
279
281
  className,
280
282
  id,
281
- role
283
+ role,
284
+ "data-testid": dataTestId || testID
282
285
  }
283
286
  );
284
287
  };
@@ -302,8 +305,13 @@ var StyledIcon = styled3(FilteredDiv2)`
302
305
  stroke: currentColor;
303
306
  }
304
307
  `;
305
- var Icon = ({ children, ...props }) => {
306
- return /* @__PURE__ */ jsx3(StyledIcon, { ...props, children });
308
+ var Icon = ({
309
+ children,
310
+ testID,
311
+ "data-testid": dataTestId,
312
+ ...props
313
+ }) => {
314
+ return /* @__PURE__ */ jsx3(StyledIcon, { "data-testid": dataTestId || testID, ...props, children });
307
315
  };
308
316
 
309
317
  // src/TagLabel.tsx
@@ -603,6 +611,7 @@ var TagLabel = ({
603
611
  compact = false,
604
612
  children,
605
613
  style,
614
+ testID,
606
615
  themeMode,
607
616
  themeProductContext
608
617
  }) => {
@@ -610,6 +619,7 @@ var TagLabel = ({
610
619
  return /* @__PURE__ */ jsxs(
611
620
  Box,
612
621
  {
622
+ testID,
613
623
  flexDirection: "row",
614
624
  alignItems: "center",
615
625
  style: {
package/web/index.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../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/Icon.tsx","../../src/TagLabel.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (props.disabled ? 0.5 : 1)};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n onError,\n onLoad,\n type,\n disabled,\n id,\n testID,\n \"data-testid\": dataTestId,\n ...props\n },\n ref\n ) => {\n // Handle as=\"img\" for rendering images with proper border-radius\n if (as === \"img\" && src) {\n return (\n <img\n src={src}\n alt={alt || \"\"}\n onError={onError}\n onLoad={onLoad}\n style={{\n display: \"block\",\n objectFit: \"cover\",\n width:\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width,\n height:\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height,\n borderRadius:\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius,\n position: props.position,\n top: typeof props.top === \"number\" ? `${props.top}px` : props.top,\n left:\n typeof props.left === \"number\" ? `${props.left}px` : props.left,\n right:\n typeof props.right === \"number\"\n ? `${props.right}px`\n : props.right,\n bottom:\n typeof props.bottom === \"number\"\n ? `${props.bottom}px`\n : props.bottom,\n ...props.style,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n elementType={as}\n id={id}\n type={as === \"button\" ? type || \"button\" : undefined}\n disabled={as === \"button\" ? disabled : undefined}\n onClick={onPress}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n role={role}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-current={ariaCurrent}\n aria-disabled={ariaDisabled}\n aria-busy={ariaBusy}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n aria-live={ariaLive}\n tabIndex={tabIndex !== undefined ? tabIndex : undefined}\n data-testid={dataTestId || testID}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport isPropValid from \"@emotion/is-prop-valid\";\n\n// Props that @emotion/is-prop-valid incorrectly treats as valid HTML.\n// These are React Native or component-specific props that match\n// valid HTML patterns (on* event handlers, SVG attributes).\nexport const ADDITIONAL_BLOCKED_PROPS = new Set([\n // RN-only event handlers (pass isPropValid's on* pattern)\n \"onPress\",\n \"onChangeText\",\n \"onLayout\",\n \"onMoveShouldSetResponder\",\n \"onResponderGrant\",\n \"onResponderMove\",\n \"onResponderRelease\",\n \"onResponderTerminate\",\n // SVG attributes that pass isPropValid\n \"strokeWidth\",\n // CSS properties that pass isPropValid but are used as component props\n \"overflow\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n]);\n\nfunction shouldForwardProp(key: string): boolean {\n if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;\n return isPropValid(key);\n}\n\n/**\n * Creates a React component that renders the given HTML tag\n * but filters out non-HTML props before they reach the DOM.\n *\n * Uses @emotion/is-prop-valid (same library styled-components v4\n * uses internally) to automatically block invalid HTML attributes,\n * plus a small blocklist for false positives (RN on* handlers, SVG attrs).\n *\n * Usage: `const FilteredDiv = createFilteredElement(\"div\");`\n * Then: `const StyledBox = styled(FilteredDiv)<BoxProps>\\`...\\`;`\n *\n * styled-components can still read ALL props for CSS interpolation,\n * but only valid HTML attributes are forwarded to the DOM element.\n */\nexport function createFilteredElement(defaultTag: string) {\n const Component = React.forwardRef<HTMLElement, Record<string, unknown>>(\n ({ children, elementType, ...props }, ref) => {\n const Tag = (elementType as string) || defaultTag;\n const htmlProps: Record<string, unknown> = {};\n for (const key of Object.keys(props)) {\n if (shouldForwardProp(key)) {\n htmlProps[key] = props[key];\n }\n }\n return React.createElement(\n Tag,\n { ref, ...htmlProps },\n children as React.ReactNode\n );\n }\n );\n Component.displayName = `Filtered(${defaultTag})`;\n return Component;\n}\n","function memoize(fn) {\n var cache = {};\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport default memoize;\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|inert|itemProp|itemScope|itemType|itemID|itemRef|on|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar index = memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport default index;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredSpan = createFilteredElement(\"span\");\n\nconst StyledText = styled(FilteredSpan)<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledIcon = styled(FilteredDiv)<IconProps>`\n display: flex;\n align-items: center;\n justify-content: center;\n width: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n height: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n color: ${(props) => props.color || \"currentColor\"};\n\n svg {\n width: 100%;\n height: 100%;\n fill: none;\n stroke: currentColor;\n }\n`;\n\nexport const Icon: React.FC<IconProps> = ({ children, ...props }) => {\n return <StyledIcon {...props}>{children}</StyledIcon>;\n};\n","import React, { type ReactNode } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\nimport { User, Settings, Info, X } from \"@xsolla/xui-icons\";\n\n// --- Types ---\n\nexport type EntityType = \"item\" | \"product\" | \"account\";\n\nexport type StatusType = \"sale\" | \"maintenance\" | \"inactive\";\n\nexport type SubentityType =\n | \"skin\"\n | \"in-game-item\"\n | \"currency\"\n | \"bundle\"\n | \"lootbox\"\n | \"game-key\"\n | \"discount\"\n | \"coupon\"\n | \"game\"\n | \"sdk\"\n | \"plugin\"\n | \"api\"\n | \"service\"\n | \"tool\"\n | \"webshop\"\n | \"app\"\n | \"launcher\"\n | \"library\"\n | \"engine\"\n | \"user\"\n | \"developer\"\n | \"influencer\"\n | \"publisher\"\n | \"settings\";\n\nexport interface TagLabelProps extends ThemeOverrideProps {\n /** Main entity type */\n entityType?: EntityType;\n /** Detailed sub-category */\n subentityType?: SubentityType;\n /** Custom icon for entity/subentity if needed */\n icon?: ReactNode;\n /** ID series (e.g. \"XLA\") */\n series?: string;\n /** ID number (e.g. \"-001-001\") */\n number?: string;\n /** Item label/name */\n label?: string;\n /** Rarity icon or indicator */\n rarity?: ReactNode;\n /** Status indicator */\n status?: StatusType;\n /** Whether to show the compact version */\n compact?: boolean;\n /** Custom content slot */\n children?: ReactNode;\n /** Custom styles */\n style?: any;\n}\n\n// --- Internal Segments ---\n\nconst SEGMENT_HEIGHT = 24;\n\nconst TagLabelEntitySegment: React.FC<{\n type: EntityType;\n compact?: boolean;\n icon?: ReactNode;\n theme: any;\n}> = ({ type, compact, icon, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.[type];\n\n if (!colors) return null;\n\n // Generic icon placeholders for now based on Figma intent\n const renderIcon = () => {\n if (icon) return icon;\n switch (type) {\n case \"item\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Cube placeholder\n case \"product\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Chip placeholder\n case \"account\":\n return <User size=\"100%\" />;\n }\n };\n\n if (compact) {\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={16} color={colors.textCompact || colors.text}>\n {renderIcon()}\n </Icon>\n </Box>\n );\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={2}\n paddingRight={4}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n <Icon size={20} color={colors.text}>\n {renderIcon()}\n </Icon>\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"500\"\n whiteSpace=\"nowrap\"\n >\n {type.charAt(0).toUpperCase() + type.slice(1)}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelSubentitySegment: React.FC<{\n type: SubentityType;\n theme: any;\n}> = ({ type, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.subentity;\n\n if (!colors || !type || typeof type !== \"string\") return null;\n\n // Icon mapping based on Figma\n const renderIcon = () => {\n switch (type) {\n case \"skin\":\n case \"in-game-item\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Pencil placeholder\n case \"game\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Controller placeholder\n case \"user\":\n return <User size=\"100%\" />;\n case \"settings\":\n return <Settings size=\"100%\" />;\n // ... more icons as needed\n default:\n return <Info size=\"100%\" />;\n }\n };\n\n const label = type\n .split(\"-\")\n .map((word) => word.charAt(0).toUpperCase() + word.slice(1))\n .join(\" \");\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={2}\n paddingRight={4}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n <Icon size={20} color={colors.text}>\n {renderIcon()}\n </Icon>\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"500\"\n whiteSpace=\"nowrap\"\n >\n {label}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelIdSegment: React.FC<{\n series?: string;\n number?: string;\n compact?: boolean;\n theme: any;\n}> = ({ series, number, compact, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.id;\n\n if (!colors) return null;\n\n if (compact) {\n return (\n <Box\n height={SEGMENT_HEIGHT}\n paddingLeft={4}\n paddingRight={6}\n flexDirection=\"row\"\n alignItems=\"center\"\n >\n {series && (\n <Text color={colors.textCompact} fontSize={14} fontWeight=\"400\">\n {series}\n </Text>\n )}\n {number && (\n <Text color={colors.textCompact} fontSize={14} fontWeight=\"400\">\n {number}\n </Text>\n )}\n </Box>\n );\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={4}\n paddingRight={6}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n {series && (\n <Box\n backgroundColor={colors.bgSeries}\n height={16}\n paddingHorizontal={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Text color={colors.textSeries} fontSize={14} fontWeight=\"500\">\n {series}\n </Text>\n </Box>\n )}\n {number && (\n <Text color={colors.textNumber} fontSize={14} fontWeight=\"500\">\n {number}\n </Text>\n )}\n </Box>\n );\n};\n\nconst TagLabelNameSegment: React.FC<{ label: string; theme: any }> = ({\n label,\n theme,\n}) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.name;\n\n if (!colors) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingHorizontal={4}\n justifyContent=\"center\"\n >\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"400\"\n whiteSpace=\"nowrap\"\n style={{\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n }}\n >\n {label}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelRaritySegment: React.FC<{ rarity: ReactNode; theme: any }> = ({\n rarity,\n theme,\n}) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.rarity;\n\n if (!colors) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingHorizontal={6}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={18} color={colors.text}>\n {rarity || <Info size=\"100%\" />}\n </Icon>\n </Box>\n );\n};\n\nconst TagLabelStatusSegment: React.FC<{ type: StatusType; theme: any }> = ({\n type,\n theme,\n}) => {\n let bg;\n let icon;\n\n if (!theme?.colors?.background) return null;\n\n switch (type) {\n case \"sale\":\n bg = theme.colors.background.warning?.primary;\n icon = <Info size=\"100%\" />; // Info placeholder\n break;\n case \"maintenance\":\n bg = theme.colors.background.success?.primary;\n icon = <Settings size=\"100%\" />;\n break;\n case \"inactive\":\n bg = theme.colors.background.alert?.primary;\n icon = <X size=\"100%\" />;\n break;\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n backgroundColor={bg}\n paddingHorizontal={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={20} color=\"black\">\n {icon}\n </Icon>\n </Box>\n );\n};\n\nconst TagLabelCustomSlot: React.FC<{ children: ReactNode; theme: any }> = ({\n children,\n theme,\n}) => {\n if (!theme?.colors?.background) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={theme.colors.background.secondary}\n paddingHorizontal={6}\n justifyContent=\"center\"\n >\n {typeof children === \"string\" ? (\n <Text\n color={theme?.colors?.content?.primary}\n fontSize={14}\n fontWeight=\"500\"\n >\n {children}\n </Text>\n ) : (\n children\n )}\n </Box>\n );\n};\n\n// --- Main Component ---\n\nexport const TagLabel: React.FC<TagLabelProps> = ({\n entityType,\n subentityType,\n icon,\n series,\n number,\n label,\n rarity,\n status,\n compact = false,\n children,\n style,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n return (\n <Box\n flexDirection=\"row\"\n alignItems=\"center\"\n style={{\n overflow: \"hidden\",\n borderRadius: 4, // Default radius from Figma\n ...style,\n }}\n >\n {entityType && (\n <TagLabelEntitySegment\n type={entityType}\n compact={compact}\n icon={icon}\n theme={theme}\n />\n )}\n\n {!compact && subentityType && (\n <TagLabelSubentitySegment type={subentityType} theme={theme} />\n )}\n\n {(series || number) && (\n <TagLabelIdSegment\n series={series}\n number={number}\n compact={compact}\n theme={theme}\n />\n )}\n\n {!compact && label && <TagLabelNameSegment label={label} theme={theme} />}\n\n {!compact && rarity && (\n <TagLabelRaritySegment rarity={rarity} theme={theme} />\n )}\n\n {!compact && status && (\n <TagLabelStatusSegment type={status} theme={theme} />\n )}\n\n {!compact && children && (\n <TagLabelCustomSlot theme={theme}>{children}</TagLabelCustomSlot>\n )}\n </Box>\n );\n};\n"],"mappings":"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","names":["React","React","styled","jsx","styled","styled","jsx","FilteredDiv","styled","jsx"]}
1
+ {"version":3,"sources":["../../../../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/Icon.tsx","../../src/TagLabel.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (props.disabled ? 0.5 : 1)};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n onError,\n onLoad,\n type,\n disabled,\n id,\n testID,\n \"data-testid\": dataTestId,\n ...props\n },\n ref\n ) => {\n // Handle as=\"img\" for rendering images with proper border-radius\n if (as === \"img\" && src) {\n return (\n <img\n src={src}\n alt={alt || \"\"}\n onError={onError}\n onLoad={onLoad}\n style={{\n display: \"block\",\n objectFit: \"cover\",\n width:\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width,\n height:\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height,\n borderRadius:\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius,\n position: props.position,\n top: typeof props.top === \"number\" ? `${props.top}px` : props.top,\n left:\n typeof props.left === \"number\" ? `${props.left}px` : props.left,\n right:\n typeof props.right === \"number\"\n ? `${props.right}px`\n : props.right,\n bottom:\n typeof props.bottom === \"number\"\n ? `${props.bottom}px`\n : props.bottom,\n ...props.style,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n elementType={as}\n id={id}\n type={as === \"button\" ? type || \"button\" : undefined}\n disabled={as === \"button\" ? disabled : undefined}\n onClick={onPress}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n role={role}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-current={ariaCurrent}\n aria-disabled={ariaDisabled}\n aria-busy={ariaBusy}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n aria-live={ariaLive}\n tabIndex={tabIndex !== undefined ? tabIndex : undefined}\n data-testid={dataTestId || testID}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport isPropValid from \"@emotion/is-prop-valid\";\n\n// Props that @emotion/is-prop-valid incorrectly treats as valid HTML.\n// These are React Native or component-specific props that match\n// valid HTML patterns (on* event handlers, SVG attributes).\nexport const ADDITIONAL_BLOCKED_PROPS = new Set([\n // RN-only event handlers (pass isPropValid's on* pattern)\n \"onPress\",\n \"onChangeText\",\n \"onLayout\",\n \"onMoveShouldSetResponder\",\n \"onResponderGrant\",\n \"onResponderMove\",\n \"onResponderRelease\",\n \"onResponderTerminate\",\n // SVG attributes that pass isPropValid\n \"strokeWidth\",\n // CSS properties that pass isPropValid but are used as component props\n \"overflow\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n]);\n\nfunction shouldForwardProp(key: string): boolean {\n if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;\n return isPropValid(key);\n}\n\n/**\n * Creates a React component that renders the given HTML tag\n * but filters out non-HTML props before they reach the DOM.\n *\n * Uses @emotion/is-prop-valid (same library styled-components v4\n * uses internally) to automatically block invalid HTML attributes,\n * plus a small blocklist for false positives (RN on* handlers, SVG attrs).\n *\n * Usage: `const FilteredDiv = createFilteredElement(\"div\");`\n * Then: `const StyledBox = styled(FilteredDiv)<BoxProps>\\`...\\`;`\n *\n * styled-components can still read ALL props for CSS interpolation,\n * but only valid HTML attributes are forwarded to the DOM element.\n */\nexport function createFilteredElement(defaultTag: string) {\n const Component = React.forwardRef<HTMLElement, Record<string, unknown>>(\n ({ children, elementType, ...props }, ref) => {\n const Tag = (elementType as string) || defaultTag;\n const htmlProps: Record<string, unknown> = {};\n for (const key of Object.keys(props)) {\n if (shouldForwardProp(key)) {\n htmlProps[key] = props[key];\n }\n }\n return React.createElement(\n Tag,\n { ref, ...htmlProps },\n children as React.ReactNode\n );\n }\n );\n Component.displayName = `Filtered(${defaultTag})`;\n return Component;\n}\n","function memoize(fn) {\n var cache = {};\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport default memoize;\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|inert|itemProp|itemScope|itemType|itemID|itemRef|on|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar index = memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport default index;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredSpan = createFilteredElement(\"span\");\n\nconst StyledText = styled(FilteredSpan)<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n testID,\n \"data-testid\": dataTestId,\n numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n data-testid={dataTestId || testID}\n />\n );\n};\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledIcon = styled(FilteredDiv)<IconProps>`\n display: flex;\n align-items: center;\n justify-content: center;\n width: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n height: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n color: ${(props) => props.color || \"currentColor\"};\n\n svg {\n width: 100%;\n height: 100%;\n fill: none;\n stroke: currentColor;\n }\n`;\n\nexport const Icon: React.FC<IconProps> = ({\n children,\n testID,\n \"data-testid\": dataTestId,\n ...props\n}) => {\n return (\n <StyledIcon data-testid={dataTestId || testID} {...props}>\n {children}\n </StyledIcon>\n );\n};\n","import React, { type ReactNode } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\nimport { User, Settings, Info, X } from \"@xsolla/xui-icons\";\n\n// --- Types ---\n\nexport type EntityType = \"item\" | \"product\" | \"account\";\n\nexport type StatusType = \"sale\" | \"maintenance\" | \"inactive\";\n\nexport type SubentityType =\n | \"skin\"\n | \"in-game-item\"\n | \"currency\"\n | \"bundle\"\n | \"lootbox\"\n | \"game-key\"\n | \"discount\"\n | \"coupon\"\n | \"game\"\n | \"sdk\"\n | \"plugin\"\n | \"api\"\n | \"service\"\n | \"tool\"\n | \"webshop\"\n | \"app\"\n | \"launcher\"\n | \"library\"\n | \"engine\"\n | \"user\"\n | \"developer\"\n | \"influencer\"\n | \"publisher\"\n | \"settings\";\n\nexport interface TagLabelProps extends ThemeOverrideProps {\n /** Main entity type */\n entityType?: EntityType;\n /** Detailed sub-category */\n subentityType?: SubentityType;\n /** Custom icon for entity/subentity if needed */\n icon?: ReactNode;\n /** ID series (e.g. \"XLA\") */\n series?: string;\n /** ID number (e.g. \"-001-001\") */\n number?: string;\n /** Item label/name */\n label?: string;\n /** Rarity icon or indicator */\n rarity?: ReactNode;\n /** Status indicator */\n status?: StatusType;\n /** Whether to show the compact version */\n compact?: boolean;\n /** Custom content slot */\n children?: ReactNode;\n /** Custom styles */\n style?: any;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\n// --- Internal Segments ---\n\nconst SEGMENT_HEIGHT = 24;\n\nconst TagLabelEntitySegment: React.FC<{\n type: EntityType;\n compact?: boolean;\n icon?: ReactNode;\n theme: any;\n}> = ({ type, compact, icon, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.[type];\n\n if (!colors) return null;\n\n // Generic icon placeholders for now based on Figma intent\n const renderIcon = () => {\n if (icon) return icon;\n switch (type) {\n case \"item\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Cube placeholder\n case \"product\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Chip placeholder\n case \"account\":\n return <User size=\"100%\" />;\n }\n };\n\n if (compact) {\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={16} color={colors.textCompact || colors.text}>\n {renderIcon()}\n </Icon>\n </Box>\n );\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={2}\n paddingRight={4}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n <Icon size={20} color={colors.text}>\n {renderIcon()}\n </Icon>\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"500\"\n whiteSpace=\"nowrap\"\n >\n {type.charAt(0).toUpperCase() + type.slice(1)}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelSubentitySegment: React.FC<{\n type: SubentityType;\n theme: any;\n}> = ({ type, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.subentity;\n\n if (!colors || !type || typeof type !== \"string\") return null;\n\n // Icon mapping based on Figma\n const renderIcon = () => {\n switch (type) {\n case \"skin\":\n case \"in-game-item\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Pencil placeholder\n case \"game\":\n return (\n <Box\n style={{ width: 12, height: 12, backgroundColor: colors.text }}\n />\n ); // Controller placeholder\n case \"user\":\n return <User size=\"100%\" />;\n case \"settings\":\n return <Settings size=\"100%\" />;\n // ... more icons as needed\n default:\n return <Info size=\"100%\" />;\n }\n };\n\n const label = type\n .split(\"-\")\n .map((word) => word.charAt(0).toUpperCase() + word.slice(1))\n .join(\" \");\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={2}\n paddingRight={4}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n <Icon size={20} color={colors.text}>\n {renderIcon()}\n </Icon>\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"500\"\n whiteSpace=\"nowrap\"\n >\n {label}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelIdSegment: React.FC<{\n series?: string;\n number?: string;\n compact?: boolean;\n theme: any;\n}> = ({ series, number, compact, theme }) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.id;\n\n if (!colors) return null;\n\n if (compact) {\n return (\n <Box\n height={SEGMENT_HEIGHT}\n paddingLeft={4}\n paddingRight={6}\n flexDirection=\"row\"\n alignItems=\"center\"\n >\n {series && (\n <Text color={colors.textCompact} fontSize={14} fontWeight=\"400\">\n {series}\n </Text>\n )}\n {number && (\n <Text color={colors.textCompact} fontSize={14} fontWeight=\"400\">\n {number}\n </Text>\n )}\n </Box>\n );\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingLeft={4}\n paddingRight={6}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={2}\n >\n {series && (\n <Box\n backgroundColor={colors.bgSeries}\n height={16}\n paddingHorizontal={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Text color={colors.textSeries} fontSize={14} fontWeight=\"500\">\n {series}\n </Text>\n </Box>\n )}\n {number && (\n <Text color={colors.textNumber} fontSize={14} fontWeight=\"500\">\n {number}\n </Text>\n )}\n </Box>\n );\n};\n\nconst TagLabelNameSegment: React.FC<{ label: string; theme: any }> = ({\n label,\n theme,\n}) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.name;\n\n if (!colors) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingHorizontal={4}\n justifyContent=\"center\"\n >\n <Text\n color={colors.text}\n fontSize={14}\n fontWeight=\"400\"\n whiteSpace=\"nowrap\"\n style={{\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n }}\n >\n {label}\n </Text>\n </Box>\n );\n};\n\nconst TagLabelRaritySegment: React.FC<{ rarity: ReactNode; theme: any }> = ({\n rarity,\n theme,\n}) => {\n const tagLabel = theme?.colors?.control?.tagLabel;\n const colors = tagLabel?.rarity;\n\n if (!colors) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n backgroundColor={colors.bg}\n paddingHorizontal={6}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={18} color={colors.text}>\n {rarity || <Info size=\"100%\" />}\n </Icon>\n </Box>\n );\n};\n\nconst TagLabelStatusSegment: React.FC<{ type: StatusType; theme: any }> = ({\n type,\n theme,\n}) => {\n let bg;\n let icon;\n\n if (!theme?.colors?.background) return null;\n\n switch (type) {\n case \"sale\":\n bg = theme.colors.background.warning?.primary;\n icon = <Info size=\"100%\" />; // Info placeholder\n break;\n case \"maintenance\":\n bg = theme.colors.background.success?.primary;\n icon = <Settings size=\"100%\" />;\n break;\n case \"inactive\":\n bg = theme.colors.background.alert?.primary;\n icon = <X size=\"100%\" />;\n break;\n }\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n width={SEGMENT_HEIGHT}\n backgroundColor={bg}\n paddingHorizontal={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Icon size={20} color=\"black\">\n {icon}\n </Icon>\n </Box>\n );\n};\n\nconst TagLabelCustomSlot: React.FC<{ children: ReactNode; theme: any }> = ({\n children,\n theme,\n}) => {\n if (!theme?.colors?.background) return null;\n\n return (\n <Box\n height={SEGMENT_HEIGHT}\n backgroundColor={theme.colors.background.secondary}\n paddingHorizontal={6}\n justifyContent=\"center\"\n >\n {typeof children === \"string\" ? (\n <Text\n color={theme?.colors?.content?.primary}\n fontSize={14}\n fontWeight=\"500\"\n >\n {children}\n </Text>\n ) : (\n children\n )}\n </Box>\n );\n};\n\n// --- Main Component ---\n\nexport const TagLabel: React.FC<TagLabelProps> = ({\n entityType,\n subentityType,\n icon,\n series,\n number,\n label,\n rarity,\n status,\n compact = false,\n children,\n style,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n return (\n <Box\n testID={testID}\n flexDirection=\"row\"\n alignItems=\"center\"\n style={{\n overflow: \"hidden\",\n borderRadius: 4, // Default radius from Figma\n ...style,\n }}\n >\n {entityType && (\n <TagLabelEntitySegment\n type={entityType}\n compact={compact}\n icon={icon}\n theme={theme}\n />\n )}\n\n {!compact && subentityType && (\n <TagLabelSubentitySegment type={subentityType} theme={theme} />\n )}\n\n {(series || number) && (\n <TagLabelIdSegment\n series={series}\n number={number}\n compact={compact}\n theme={theme}\n />\n )}\n\n {!compact && label && <TagLabelNameSegment label={label} theme={theme} />}\n\n {!compact && rarity && (\n <TagLabelRaritySegment rarity={rarity} theme={theme} />\n )}\n\n {!compact && status && (\n <TagLabelStatusSegment type={status} theme={theme} />\n )}\n\n {!compact && children && (\n <TagLabelCustomSlot theme={theme}>{children}</TagLabelCustomSlot>\n )}\n </Box>\n );\n};\n"],"mappings":"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","names":["React","React","styled","jsx","styled","styled","jsx","FilteredDiv","styled","jsx"]}