@xsolla/xui-b2b-itemer-group 0.190.0 → 0.192.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/native/index.d.mts +16 -1
- package/native/index.d.ts +16 -1
- package/native/index.js +21 -10
- package/native/index.js.map +1 -1
- package/native/index.mjs +18 -7
- package/native/index.mjs.map +1 -1
- package/package.json +6 -6
- package/web/index.d.mts +16 -1
- package/web/index.d.ts +16 -1
- package/web/index.js +21 -10
- package/web/index.js.map +1 -1
- package/web/index.mjs +18 -7
- package/web/index.mjs.map +1 -1
package/native/index.d.mts
CHANGED
|
@@ -1,11 +1,25 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import React__default, { ReactNode } from 'react';
|
|
3
3
|
import { ThemeOverrideProps } from '@xsolla/xui-core';
|
|
4
|
+
import { BaseIconComponent } from '@xsolla/xui-icons-base';
|
|
4
5
|
|
|
6
|
+
/** Any `@xsolla/xui-icons-base` icon component for row remove buttons. Defaults to `Remove`. */
|
|
7
|
+
type ItemerGroupRemoveIcon = BaseIconComponent;
|
|
8
|
+
type ItemerGroupContentType = "input" | "select";
|
|
5
9
|
interface ItemerGroupProps extends ThemeOverrideProps {
|
|
6
10
|
label?: string | string[];
|
|
7
11
|
children?: ReactNode;
|
|
8
12
|
draggable?: boolean;
|
|
13
|
+
/**
|
|
14
|
+
* Row control layout — sets the default remove icon when `removeIcon` is omitted.
|
|
15
|
+
* `input` uses `Remove` (×); `select` uses `Minus` (−).
|
|
16
|
+
*/
|
|
17
|
+
contentType?: ItemerGroupContentType;
|
|
18
|
+
/**
|
|
19
|
+
* Icon component for row remove buttons — any export from `@xsolla/xui-icons-base`
|
|
20
|
+
* (e.g. `Remove`, `Minus`). Overrides the `contentType` default.
|
|
21
|
+
*/
|
|
22
|
+
removeIcon?: ItemerGroupRemoveIcon;
|
|
9
23
|
onAdd?: () => void;
|
|
10
24
|
addButtonLabel?: string;
|
|
11
25
|
showAddButton?: boolean;
|
|
@@ -26,7 +40,8 @@ declare const ItemerGroupRow: React__default.FC<ItemerGroupRowProps>;
|
|
|
26
40
|
interface ItemerGroupContextValue {
|
|
27
41
|
draggable: boolean;
|
|
28
42
|
rowCount: number;
|
|
43
|
+
removeIcon: ItemerGroupRemoveIcon;
|
|
29
44
|
}
|
|
30
45
|
declare const ItemerGroupContext: React.Context<ItemerGroupContextValue>;
|
|
31
46
|
|
|
32
|
-
export { ItemerGroup, ItemerGroupContext, type ItemerGroupProps, ItemerGroupRow, type ItemerGroupRowProps };
|
|
47
|
+
export { ItemerGroup, type ItemerGroupContentType, ItemerGroupContext, type ItemerGroupProps, type ItemerGroupRemoveIcon, ItemerGroupRow, type ItemerGroupRowProps };
|
package/native/index.d.ts
CHANGED
|
@@ -1,11 +1,25 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import React__default, { ReactNode } from 'react';
|
|
3
3
|
import { ThemeOverrideProps } from '@xsolla/xui-core';
|
|
4
|
+
import { BaseIconComponent } from '@xsolla/xui-icons-base';
|
|
4
5
|
|
|
6
|
+
/** Any `@xsolla/xui-icons-base` icon component for row remove buttons. Defaults to `Remove`. */
|
|
7
|
+
type ItemerGroupRemoveIcon = BaseIconComponent;
|
|
8
|
+
type ItemerGroupContentType = "input" | "select";
|
|
5
9
|
interface ItemerGroupProps extends ThemeOverrideProps {
|
|
6
10
|
label?: string | string[];
|
|
7
11
|
children?: ReactNode;
|
|
8
12
|
draggable?: boolean;
|
|
13
|
+
/**
|
|
14
|
+
* Row control layout — sets the default remove icon when `removeIcon` is omitted.
|
|
15
|
+
* `input` uses `Remove` (×); `select` uses `Minus` (−).
|
|
16
|
+
*/
|
|
17
|
+
contentType?: ItemerGroupContentType;
|
|
18
|
+
/**
|
|
19
|
+
* Icon component for row remove buttons — any export from `@xsolla/xui-icons-base`
|
|
20
|
+
* (e.g. `Remove`, `Minus`). Overrides the `contentType` default.
|
|
21
|
+
*/
|
|
22
|
+
removeIcon?: ItemerGroupRemoveIcon;
|
|
9
23
|
onAdd?: () => void;
|
|
10
24
|
addButtonLabel?: string;
|
|
11
25
|
showAddButton?: boolean;
|
|
@@ -26,7 +40,8 @@ declare const ItemerGroupRow: React__default.FC<ItemerGroupRowProps>;
|
|
|
26
40
|
interface ItemerGroupContextValue {
|
|
27
41
|
draggable: boolean;
|
|
28
42
|
rowCount: number;
|
|
43
|
+
removeIcon: ItemerGroupRemoveIcon;
|
|
29
44
|
}
|
|
30
45
|
declare const ItemerGroupContext: React.Context<ItemerGroupContextValue>;
|
|
31
46
|
|
|
32
|
-
export { ItemerGroup, ItemerGroupContext, type ItemerGroupProps, ItemerGroupRow, type ItemerGroupRowProps };
|
|
47
|
+
export { ItemerGroup, type ItemerGroupContentType, ItemerGroupContext, type ItemerGroupProps, type ItemerGroupRemoveIcon, ItemerGroupRow, type ItemerGroupRowProps };
|
package/native/index.js
CHANGED
|
@@ -217,23 +217,28 @@ var Box = ({
|
|
|
217
217
|
var import_xui_core = require("@xsolla/xui-core");
|
|
218
218
|
var import_xui_button = require("@xsolla/xui-button");
|
|
219
219
|
var import_xui_typography = require("@xsolla/xui-typography");
|
|
220
|
-
var
|
|
220
|
+
var import_xui_icons_base2 = require("@xsolla/xui-icons-base");
|
|
221
221
|
|
|
222
222
|
// src/ItemerGroupContext.tsx
|
|
223
223
|
var import_react = require("react");
|
|
224
|
+
var import_xui_icons_base = require("@xsolla/xui-icons-base");
|
|
224
225
|
var ItemerGroupContext = (0, import_react.createContext)({
|
|
225
226
|
draggable: false,
|
|
226
|
-
rowCount: 0
|
|
227
|
+
rowCount: 0,
|
|
228
|
+
removeIcon: import_xui_icons_base.Remove
|
|
227
229
|
});
|
|
228
230
|
var useItemerGroupContext = () => (0, import_react.useContext)(ItemerGroupContext);
|
|
229
231
|
|
|
230
232
|
// src/ItemerGroup.tsx
|
|
231
233
|
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
232
234
|
var REMOVE_BUTTON_SIZE = 40;
|
|
235
|
+
var defaultRemoveIconByContentType = (contentType) => contentType === "select" ? import_xui_icons_base2.Minus : import_xui_icons_base2.Remove;
|
|
233
236
|
var ItemerGroup = ({
|
|
234
237
|
label,
|
|
235
238
|
children,
|
|
236
239
|
draggable = false,
|
|
240
|
+
contentType = "input",
|
|
241
|
+
removeIcon,
|
|
237
242
|
onAdd,
|
|
238
243
|
addButtonLabel = "Add line",
|
|
239
244
|
showAddButton,
|
|
@@ -245,9 +250,10 @@ var ItemerGroup = ({
|
|
|
245
250
|
const { theme } = (0, import_xui_core.useResolvedTheme)({ themeMode, themeProductContext });
|
|
246
251
|
const shouldShowAddButton = showAddButton ?? Boolean(onAdd);
|
|
247
252
|
const rowCount = import_react2.default.Children.toArray(children).length;
|
|
253
|
+
const resolvedRemoveIcon = removeIcon ?? defaultRemoveIconByContentType(contentType);
|
|
248
254
|
const contextValue = (0, import_react2.useMemo)(
|
|
249
|
-
() => ({ draggable, rowCount }),
|
|
250
|
-
[draggable, rowCount]
|
|
255
|
+
() => ({ draggable, rowCount, removeIcon: resolvedRemoveIcon }),
|
|
256
|
+
[draggable, rowCount, resolvedRemoveIcon]
|
|
251
257
|
);
|
|
252
258
|
const showDragSpacer = draggable && rowCount > 1;
|
|
253
259
|
const renderLabel = () => {
|
|
@@ -280,7 +286,7 @@ var ItemerGroup = ({
|
|
|
280
286
|
variant: "secondary",
|
|
281
287
|
tone: "brand",
|
|
282
288
|
size: "sm",
|
|
283
|
-
iconRight: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
289
|
+
iconRight: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_xui_icons_base2.Plus, { size: 16 }),
|
|
284
290
|
onPress: onAdd,
|
|
285
291
|
children: addButtonLabel
|
|
286
292
|
}
|
|
@@ -293,8 +299,9 @@ ItemerGroup.displayName = "ItemerGroup";
|
|
|
293
299
|
// src/ItemerGroupRow.tsx
|
|
294
300
|
var import_xui_core2 = require("@xsolla/xui-core");
|
|
295
301
|
var import_xui_button2 = require("@xsolla/xui-button");
|
|
296
|
-
var
|
|
302
|
+
var import_xui_icons_base3 = require("@xsolla/xui-icons-base");
|
|
297
303
|
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
304
|
+
var REMOVE_ICON_SIZE = 20;
|
|
298
305
|
var ItemerGroupRow = ({
|
|
299
306
|
children,
|
|
300
307
|
onRemove,
|
|
@@ -302,7 +309,11 @@ var ItemerGroupRow = ({
|
|
|
302
309
|
className
|
|
303
310
|
}) => {
|
|
304
311
|
const { theme } = (0, import_xui_core2.useResolvedTheme)({});
|
|
305
|
-
const {
|
|
312
|
+
const {
|
|
313
|
+
draggable,
|
|
314
|
+
rowCount,
|
|
315
|
+
removeIcon: RemoveIcon
|
|
316
|
+
} = useItemerGroupContext();
|
|
306
317
|
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box, { flexDirection: "row", alignItems: "center", gap: 8, className, children: [
|
|
307
318
|
draggable && rowCount > 1 && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
308
319
|
Box,
|
|
@@ -314,7 +325,7 @@ var ItemerGroupRow = ({
|
|
|
314
325
|
justifyContent: "center",
|
|
315
326
|
flexShrink: 0,
|
|
316
327
|
style: { cursor: "grab" },
|
|
317
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
328
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_xui_icons_base3.Drag, { size: 20, color: theme.colors.content.tertiary })
|
|
318
329
|
}
|
|
319
330
|
),
|
|
320
331
|
/* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
|
@@ -335,7 +346,7 @@ var ItemerGroupRow = ({
|
|
|
335
346
|
tone: "mono",
|
|
336
347
|
size: "sm",
|
|
337
348
|
onPress: onAdd,
|
|
338
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
349
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_xui_icons_base3.Plus, { size: 20 })
|
|
339
350
|
}
|
|
340
351
|
),
|
|
341
352
|
onRemove && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
@@ -346,7 +357,7 @@ var ItemerGroupRow = ({
|
|
|
346
357
|
tone: "mono",
|
|
347
358
|
size: "sm",
|
|
348
359
|
onPress: onRemove,
|
|
349
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
360
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(RemoveIcon, { size: REMOVE_ICON_SIZE })
|
|
350
361
|
}
|
|
351
362
|
)
|
|
352
363
|
]
|
package/native/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/index.tsx","../../src/ItemerGroup.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../src/ItemerGroupContext.tsx","../../src/ItemerGroupRow.tsx"],"sourcesContent":["export { ItemerGroup } from \"./ItemerGroup\";\nexport { ItemerGroupRow } from \"./ItemerGroupRow\";\nexport { ItemerGroupContext } from \"./ItemerGroupContext\";\nexport type { ItemerGroupProps, ItemerGroupRowProps } from \"./types\";\n","import React, { useMemo } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { Button } from \"@xsolla/xui-button\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport { Plus } from \"@xsolla/xui-icons-base\";\nimport { ItemerGroupContext } from \"./ItemerGroupContext\";\nimport type { ItemerGroupProps } from \"./types\";\n\n// Size of the IconButton size=\"sm\" — used to reserve matching space in the label row\nconst REMOVE_BUTTON_SIZE = 40;\n\nexport const ItemerGroup: React.FC<ItemerGroupProps> = ({\n label,\n children,\n draggable = false,\n onAdd,\n addButtonLabel = \"Add line\",\n showAddButton,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const shouldShowAddButton = showAddButton ?? Boolean(onAdd);\n const rowCount = React.Children.toArray(children).length;\n const contextValue = useMemo(\n () => ({ draggable, rowCount }),\n [draggable, rowCount]\n );\n\n const showDragSpacer = draggable && rowCount > 1;\n\n const renderLabel = () => {\n if (!label) return null;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {Array.isArray(label) ? (\n <>\n <Box flex={1} flexDirection=\"row\" alignItems=\"flex-start\" gap={4}>\n {label.map((l, i) => (\n <Box flex={1} key={i}>\n <Typography\n variant=\"bodyXs\"\n color={theme.colors.content.secondary}\n >\n {l}\n </Typography>\n </Box>\n ))}\n </Box>\n <Box width={REMOVE_BUTTON_SIZE} flexShrink={0} />\n </>\n ) : (\n <Typography variant=\"bodyXs\" color={theme.colors.content.secondary}>\n {label}\n </Typography>\n )}\n </Box>\n );\n };\n\n return (\n <ItemerGroupContext.Provider value={contextValue}>\n <Box flexDirection=\"column\" gap={8} testID={testID} className={className}>\n <Box flexDirection=\"column\" gap={4}>\n {renderLabel()}\n {children}\n </Box>\n {shouldShowAddButton && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n <Button\n variant=\"secondary\"\n tone=\"brand\"\n size=\"sm\"\n iconRight={<Plus size={16} />}\n onPress={onAdd}\n >\n {addButtonLabel}\n </Button>\n </Box>\n )}\n </Box>\n </ItemerGroupContext.Provider>\n );\n};\n\nItemerGroup.displayName = \"ItemerGroup\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} 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 { createContext, useContext } from \"react\";\n\ninterface ItemerGroupContextValue {\n draggable: boolean;\n rowCount: number;\n}\n\nexport const ItemerGroupContext = createContext<ItemerGroupContextValue>({\n draggable: false,\n rowCount: 0,\n});\n\nexport const useItemerGroupContext = () => useContext(ItemerGroupContext);\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { IconButton } from \"@xsolla/xui-button\";\nimport { Drag, Plus, Remove } from \"@xsolla/xui-icons-base\";\nimport { useItemerGroupContext } from \"./ItemerGroupContext\";\nimport type { ItemerGroupRowProps } from \"./types\";\n\nexport const ItemerGroupRow: React.FC<ItemerGroupRowProps> = ({\n children,\n onRemove,\n onAdd,\n className,\n}) => {\n const { theme } = useResolvedTheme({});\n const { draggable, rowCount } = useItemerGroupContext();\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8} className={className}>\n {draggable && rowCount > 1 && (\n <Box\n data-drag-handle=\"true\"\n width={28}\n height={28}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n style={{ cursor: \"grab\" }}\n >\n <Drag size={20} color={theme.colors.content.tertiary} />\n </Box>\n )}\n <Box\n flex={1}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={4}\n minWidth={0}\n >\n {children}\n {onAdd && (\n <IconButton\n aria-label=\"Add row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onAdd}\n icon={<Plus size={20} />}\n />\n )}\n {onRemove && (\n <IconButton\n aria-label=\"Remove row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onRemove}\n icon={<Remove size={20} />}\n />\n )}\n </Box>\n </Box>\n );\n};\n\nItemerGroupRow.displayName = \"ItemerGroupRow\";\n"],"mappings":"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","names":["import_react","import_jsx_runtime","React","import_xui_core","import_xui_button","import_xui_icons_base","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../../src/index.tsx","../../src/ItemerGroup.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../src/ItemerGroupContext.tsx","../../src/ItemerGroupRow.tsx"],"sourcesContent":["export { ItemerGroup } from \"./ItemerGroup\";\nexport { ItemerGroupRow } from \"./ItemerGroupRow\";\nexport { ItemerGroupContext } from \"./ItemerGroupContext\";\nexport type {\n ItemerGroupProps,\n ItemerGroupRowProps,\n ItemerGroupRemoveIcon,\n ItemerGroupContentType,\n} from \"./types\";\n","import React, { useMemo } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { Button } from \"@xsolla/xui-button\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport { Plus, Minus, Remove } from \"@xsolla/xui-icons-base\";\nimport { ItemerGroupContext } from \"./ItemerGroupContext\";\nimport type { ItemerGroupContentType, ItemerGroupProps } from \"./types\";\n\n// Size of the IconButton size=\"sm\" — used to reserve matching space in the label row\nconst REMOVE_BUTTON_SIZE = 40;\n\nconst defaultRemoveIconByContentType = (contentType: ItemerGroupContentType) =>\n contentType === \"select\" ? Minus : Remove;\n\nexport const ItemerGroup: React.FC<ItemerGroupProps> = ({\n label,\n children,\n draggable = false,\n contentType = \"input\",\n removeIcon,\n onAdd,\n addButtonLabel = \"Add line\",\n showAddButton,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const shouldShowAddButton = showAddButton ?? Boolean(onAdd);\n const rowCount = React.Children.toArray(children).length;\n const resolvedRemoveIcon =\n removeIcon ?? defaultRemoveIconByContentType(contentType);\n const contextValue = useMemo(\n () => ({ draggable, rowCount, removeIcon: resolvedRemoveIcon }),\n [draggable, rowCount, resolvedRemoveIcon]\n );\n\n const showDragSpacer = draggable && rowCount > 1;\n\n const renderLabel = () => {\n if (!label) return null;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {Array.isArray(label) ? (\n <>\n <Box flex={1} flexDirection=\"row\" alignItems=\"flex-start\" gap={4}>\n {label.map((l, i) => (\n <Box flex={1} key={i}>\n <Typography\n variant=\"bodyXs\"\n color={theme.colors.content.secondary}\n >\n {l}\n </Typography>\n </Box>\n ))}\n </Box>\n <Box width={REMOVE_BUTTON_SIZE} flexShrink={0} />\n </>\n ) : (\n <Typography variant=\"bodyXs\" color={theme.colors.content.secondary}>\n {label}\n </Typography>\n )}\n </Box>\n );\n };\n\n return (\n <ItemerGroupContext.Provider value={contextValue}>\n <Box flexDirection=\"column\" gap={8} testID={testID} className={className}>\n <Box flexDirection=\"column\" gap={4}>\n {renderLabel()}\n {children}\n </Box>\n {shouldShowAddButton && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n <Button\n variant=\"secondary\"\n tone=\"brand\"\n size=\"sm\"\n iconRight={<Plus size={16} />}\n onPress={onAdd}\n >\n {addButtonLabel}\n </Button>\n </Box>\n )}\n </Box>\n </ItemerGroupContext.Provider>\n );\n};\n\nItemerGroup.displayName = \"ItemerGroup\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} 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 { createContext, useContext } from \"react\";\nimport { Remove } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupRemoveIcon } from \"./types\";\n\ninterface ItemerGroupContextValue {\n draggable: boolean;\n rowCount: number;\n removeIcon: ItemerGroupRemoveIcon;\n}\n\nexport const ItemerGroupContext = createContext<ItemerGroupContextValue>({\n draggable: false,\n rowCount: 0,\n removeIcon: Remove,\n});\n\nexport const useItemerGroupContext = () => useContext(ItemerGroupContext);\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { IconButton } from \"@xsolla/xui-button\";\nimport { Drag, Plus } from \"@xsolla/xui-icons-base\";\nimport { useItemerGroupContext } from \"./ItemerGroupContext\";\nimport type { ItemerGroupRowProps } from \"./types\";\n\nconst REMOVE_ICON_SIZE = 20;\n\nexport const ItemerGroupRow: React.FC<ItemerGroupRowProps> = ({\n children,\n onRemove,\n onAdd,\n className,\n}) => {\n const { theme } = useResolvedTheme({});\n const {\n draggable,\n rowCount,\n removeIcon: RemoveIcon,\n } = useItemerGroupContext();\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8} className={className}>\n {draggable && rowCount > 1 && (\n <Box\n data-drag-handle=\"true\"\n width={28}\n height={28}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n style={{ cursor: \"grab\" }}\n >\n <Drag size={20} color={theme.colors.content.tertiary} />\n </Box>\n )}\n <Box\n flex={1}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={4}\n minWidth={0}\n >\n {children}\n {onAdd && (\n <IconButton\n aria-label=\"Add row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onAdd}\n icon={<Plus size={20} />}\n />\n )}\n {onRemove && (\n <IconButton\n aria-label=\"Remove row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onRemove}\n icon={<RemoveIcon size={REMOVE_ICON_SIZE} />}\n />\n )}\n </Box>\n </Box>\n );\n};\n\nItemerGroupRow.displayName = \"ItemerGroupRow\";\n"],"mappings":"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","names":["import_react","import_xui_icons_base","import_jsx_runtime","React","import_xui_core","import_xui_button","import_xui_icons_base","import_jsx_runtime"]}
|
package/native/index.mjs
CHANGED
|
@@ -183,23 +183,28 @@ var Box = ({
|
|
|
183
183
|
import { useResolvedTheme } from "@xsolla/xui-core";
|
|
184
184
|
import { Button } from "@xsolla/xui-button";
|
|
185
185
|
import { Typography } from "@xsolla/xui-typography";
|
|
186
|
-
import { Plus } from "@xsolla/xui-icons-base";
|
|
186
|
+
import { Plus, Minus, Remove as Remove2 } from "@xsolla/xui-icons-base";
|
|
187
187
|
|
|
188
188
|
// src/ItemerGroupContext.tsx
|
|
189
189
|
import { createContext, useContext } from "react";
|
|
190
|
+
import { Remove } from "@xsolla/xui-icons-base";
|
|
190
191
|
var ItemerGroupContext = createContext({
|
|
191
192
|
draggable: false,
|
|
192
|
-
rowCount: 0
|
|
193
|
+
rowCount: 0,
|
|
194
|
+
removeIcon: Remove
|
|
193
195
|
});
|
|
194
196
|
var useItemerGroupContext = () => useContext(ItemerGroupContext);
|
|
195
197
|
|
|
196
198
|
// src/ItemerGroup.tsx
|
|
197
199
|
import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
198
200
|
var REMOVE_BUTTON_SIZE = 40;
|
|
201
|
+
var defaultRemoveIconByContentType = (contentType) => contentType === "select" ? Minus : Remove2;
|
|
199
202
|
var ItemerGroup = ({
|
|
200
203
|
label,
|
|
201
204
|
children,
|
|
202
205
|
draggable = false,
|
|
206
|
+
contentType = "input",
|
|
207
|
+
removeIcon,
|
|
203
208
|
onAdd,
|
|
204
209
|
addButtonLabel = "Add line",
|
|
205
210
|
showAddButton,
|
|
@@ -211,9 +216,10 @@ var ItemerGroup = ({
|
|
|
211
216
|
const { theme } = useResolvedTheme({ themeMode, themeProductContext });
|
|
212
217
|
const shouldShowAddButton = showAddButton ?? Boolean(onAdd);
|
|
213
218
|
const rowCount = React.Children.toArray(children).length;
|
|
219
|
+
const resolvedRemoveIcon = removeIcon ?? defaultRemoveIconByContentType(contentType);
|
|
214
220
|
const contextValue = useMemo(
|
|
215
|
-
() => ({ draggable, rowCount }),
|
|
216
|
-
[draggable, rowCount]
|
|
221
|
+
() => ({ draggable, rowCount, removeIcon: resolvedRemoveIcon }),
|
|
222
|
+
[draggable, rowCount, resolvedRemoveIcon]
|
|
217
223
|
);
|
|
218
224
|
const showDragSpacer = draggable && rowCount > 1;
|
|
219
225
|
const renderLabel = () => {
|
|
@@ -259,8 +265,9 @@ ItemerGroup.displayName = "ItemerGroup";
|
|
|
259
265
|
// src/ItemerGroupRow.tsx
|
|
260
266
|
import { useResolvedTheme as useResolvedTheme2 } from "@xsolla/xui-core";
|
|
261
267
|
import { IconButton } from "@xsolla/xui-button";
|
|
262
|
-
import { Drag, Plus as Plus2
|
|
268
|
+
import { Drag, Plus as Plus2 } from "@xsolla/xui-icons-base";
|
|
263
269
|
import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
270
|
+
var REMOVE_ICON_SIZE = 20;
|
|
264
271
|
var ItemerGroupRow = ({
|
|
265
272
|
children,
|
|
266
273
|
onRemove,
|
|
@@ -268,7 +275,11 @@ var ItemerGroupRow = ({
|
|
|
268
275
|
className
|
|
269
276
|
}) => {
|
|
270
277
|
const { theme } = useResolvedTheme2({});
|
|
271
|
-
const {
|
|
278
|
+
const {
|
|
279
|
+
draggable,
|
|
280
|
+
rowCount,
|
|
281
|
+
removeIcon: RemoveIcon
|
|
282
|
+
} = useItemerGroupContext();
|
|
272
283
|
return /* @__PURE__ */ jsxs2(Box, { flexDirection: "row", alignItems: "center", gap: 8, className, children: [
|
|
273
284
|
draggable && rowCount > 1 && /* @__PURE__ */ jsx3(
|
|
274
285
|
Box,
|
|
@@ -312,7 +323,7 @@ var ItemerGroupRow = ({
|
|
|
312
323
|
tone: "mono",
|
|
313
324
|
size: "sm",
|
|
314
325
|
onPress: onRemove,
|
|
315
|
-
icon: /* @__PURE__ */ jsx3(
|
|
326
|
+
icon: /* @__PURE__ */ jsx3(RemoveIcon, { size: REMOVE_ICON_SIZE })
|
|
316
327
|
}
|
|
317
328
|
)
|
|
318
329
|
]
|
package/native/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/ItemerGroup.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../src/ItemerGroupContext.tsx","../../src/ItemerGroupRow.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { Button } from \"@xsolla/xui-button\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport { Plus } from \"@xsolla/xui-icons-base\";\nimport { ItemerGroupContext } from \"./ItemerGroupContext\";\nimport type { ItemerGroupProps } from \"./types\";\n\n// Size of the IconButton size=\"sm\" — used to reserve matching space in the label row\nconst REMOVE_BUTTON_SIZE = 40;\n\nexport const ItemerGroup: React.FC<ItemerGroupProps> = ({\n label,\n children,\n draggable = false,\n onAdd,\n addButtonLabel = \"Add line\",\n showAddButton,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const shouldShowAddButton = showAddButton ?? Boolean(onAdd);\n const rowCount = React.Children.toArray(children).length;\n const contextValue = useMemo(\n () => ({ draggable, rowCount }),\n [draggable, rowCount]\n );\n\n const showDragSpacer = draggable && rowCount > 1;\n\n const renderLabel = () => {\n if (!label) return null;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {Array.isArray(label) ? (\n <>\n <Box flex={1} flexDirection=\"row\" alignItems=\"flex-start\" gap={4}>\n {label.map((l, i) => (\n <Box flex={1} key={i}>\n <Typography\n variant=\"bodyXs\"\n color={theme.colors.content.secondary}\n >\n {l}\n </Typography>\n </Box>\n ))}\n </Box>\n <Box width={REMOVE_BUTTON_SIZE} flexShrink={0} />\n </>\n ) : (\n <Typography variant=\"bodyXs\" color={theme.colors.content.secondary}>\n {label}\n </Typography>\n )}\n </Box>\n );\n };\n\n return (\n <ItemerGroupContext.Provider value={contextValue}>\n <Box flexDirection=\"column\" gap={8} testID={testID} className={className}>\n <Box flexDirection=\"column\" gap={4}>\n {renderLabel()}\n {children}\n </Box>\n {shouldShowAddButton && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n <Button\n variant=\"secondary\"\n tone=\"brand\"\n size=\"sm\"\n iconRight={<Plus size={16} />}\n onPress={onAdd}\n >\n {addButtonLabel}\n </Button>\n </Box>\n )}\n </Box>\n </ItemerGroupContext.Provider>\n );\n};\n\nItemerGroup.displayName = \"ItemerGroup\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} 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 { createContext, useContext } from \"react\";\n\ninterface ItemerGroupContextValue {\n draggable: boolean;\n rowCount: number;\n}\n\nexport const ItemerGroupContext = createContext<ItemerGroupContextValue>({\n draggable: false,\n rowCount: 0,\n});\n\nexport const useItemerGroupContext = () => useContext(ItemerGroupContext);\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { IconButton } from \"@xsolla/xui-button\";\nimport { Drag, Plus, Remove } from \"@xsolla/xui-icons-base\";\nimport { useItemerGroupContext } from \"./ItemerGroupContext\";\nimport type { ItemerGroupRowProps } from \"./types\";\n\nexport const ItemerGroupRow: React.FC<ItemerGroupRowProps> = ({\n children,\n onRemove,\n onAdd,\n className,\n}) => {\n const { theme } = useResolvedTheme({});\n const { draggable, rowCount } = useItemerGroupContext();\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8} className={className}>\n {draggable && rowCount > 1 && (\n <Box\n data-drag-handle=\"true\"\n width={28}\n height={28}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n style={{ cursor: \"grab\" }}\n >\n <Drag size={20} color={theme.colors.content.tertiary} />\n </Box>\n )}\n <Box\n flex={1}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={4}\n minWidth={0}\n >\n {children}\n {onAdd && (\n <IconButton\n aria-label=\"Add row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onAdd}\n icon={<Plus size={20} />}\n />\n )}\n {onRemove && (\n <IconButton\n aria-label=\"Remove row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onRemove}\n icon={<Remove size={20} />}\n />\n )}\n </Box>\n </Box>\n );\n};\n\nItemerGroupRow.displayName = \"ItemerGroupRow\";\n"],"mappings":"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","names":["jsx","useResolvedTheme","Plus","jsx","jsxs","useResolvedTheme","Plus"]}
|
|
1
|
+
{"version":3,"sources":["../../src/ItemerGroup.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../src/ItemerGroupContext.tsx","../../src/ItemerGroupRow.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { Button } from \"@xsolla/xui-button\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport { Plus, Minus, Remove } from \"@xsolla/xui-icons-base\";\nimport { ItemerGroupContext } from \"./ItemerGroupContext\";\nimport type { ItemerGroupContentType, ItemerGroupProps } from \"./types\";\n\n// Size of the IconButton size=\"sm\" — used to reserve matching space in the label row\nconst REMOVE_BUTTON_SIZE = 40;\n\nconst defaultRemoveIconByContentType = (contentType: ItemerGroupContentType) =>\n contentType === \"select\" ? Minus : Remove;\n\nexport const ItemerGroup: React.FC<ItemerGroupProps> = ({\n label,\n children,\n draggable = false,\n contentType = \"input\",\n removeIcon,\n onAdd,\n addButtonLabel = \"Add line\",\n showAddButton,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const shouldShowAddButton = showAddButton ?? Boolean(onAdd);\n const rowCount = React.Children.toArray(children).length;\n const resolvedRemoveIcon =\n removeIcon ?? defaultRemoveIconByContentType(contentType);\n const contextValue = useMemo(\n () => ({ draggable, rowCount, removeIcon: resolvedRemoveIcon }),\n [draggable, rowCount, resolvedRemoveIcon]\n );\n\n const showDragSpacer = draggable && rowCount > 1;\n\n const renderLabel = () => {\n if (!label) return null;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {Array.isArray(label) ? (\n <>\n <Box flex={1} flexDirection=\"row\" alignItems=\"flex-start\" gap={4}>\n {label.map((l, i) => (\n <Box flex={1} key={i}>\n <Typography\n variant=\"bodyXs\"\n color={theme.colors.content.secondary}\n >\n {l}\n </Typography>\n </Box>\n ))}\n </Box>\n <Box width={REMOVE_BUTTON_SIZE} flexShrink={0} />\n </>\n ) : (\n <Typography variant=\"bodyXs\" color={theme.colors.content.secondary}>\n {label}\n </Typography>\n )}\n </Box>\n );\n };\n\n return (\n <ItemerGroupContext.Provider value={contextValue}>\n <Box flexDirection=\"column\" gap={8} testID={testID} className={className}>\n <Box flexDirection=\"column\" gap={4}>\n {renderLabel()}\n {children}\n </Box>\n {shouldShowAddButton && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n <Button\n variant=\"secondary\"\n tone=\"brand\"\n size=\"sm\"\n iconRight={<Plus size={16} />}\n onPress={onAdd}\n >\n {addButtonLabel}\n </Button>\n </Box>\n )}\n </Box>\n </ItemerGroupContext.Provider>\n );\n};\n\nItemerGroup.displayName = \"ItemerGroup\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} 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 { createContext, useContext } from \"react\";\nimport { Remove } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupRemoveIcon } from \"./types\";\n\ninterface ItemerGroupContextValue {\n draggable: boolean;\n rowCount: number;\n removeIcon: ItemerGroupRemoveIcon;\n}\n\nexport const ItemerGroupContext = createContext<ItemerGroupContextValue>({\n draggable: false,\n rowCount: 0,\n removeIcon: Remove,\n});\n\nexport const useItemerGroupContext = () => useContext(ItemerGroupContext);\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { IconButton } from \"@xsolla/xui-button\";\nimport { Drag, Plus } from \"@xsolla/xui-icons-base\";\nimport { useItemerGroupContext } from \"./ItemerGroupContext\";\nimport type { ItemerGroupRowProps } from \"./types\";\n\nconst REMOVE_ICON_SIZE = 20;\n\nexport const ItemerGroupRow: React.FC<ItemerGroupRowProps> = ({\n children,\n onRemove,\n onAdd,\n className,\n}) => {\n const { theme } = useResolvedTheme({});\n const {\n draggable,\n rowCount,\n removeIcon: RemoveIcon,\n } = useItemerGroupContext();\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8} className={className}>\n {draggable && rowCount > 1 && (\n <Box\n data-drag-handle=\"true\"\n width={28}\n height={28}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n style={{ cursor: \"grab\" }}\n >\n <Drag size={20} color={theme.colors.content.tertiary} />\n </Box>\n )}\n <Box\n flex={1}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={4}\n minWidth={0}\n >\n {children}\n {onAdd && (\n <IconButton\n aria-label=\"Add row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onAdd}\n icon={<Plus size={20} />}\n />\n )}\n {onRemove && (\n <IconButton\n aria-label=\"Remove row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onRemove}\n icon={<RemoveIcon size={REMOVE_ICON_SIZE} />}\n />\n )}\n </Box>\n </Box>\n );\n};\n\nItemerGroupRow.displayName = \"ItemerGroupRow\";\n"],"mappings":"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","names":["Remove","jsx","Remove","useResolvedTheme","Plus","jsx","jsxs","useResolvedTheme","Plus"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@xsolla/xui-b2b-itemer-group",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.192.0",
|
|
4
4
|
"main": "./web/index.js",
|
|
5
5
|
"module": "./web/index.mjs",
|
|
6
6
|
"types": "./web/index.d.ts",
|
|
@@ -13,11 +13,11 @@
|
|
|
13
13
|
"test:coverage": "vitest run --coverage"
|
|
14
14
|
},
|
|
15
15
|
"dependencies": {
|
|
16
|
-
"@xsolla/xui-button": "0.
|
|
17
|
-
"@xsolla/xui-core": "0.
|
|
18
|
-
"@xsolla/xui-icons-base": "0.
|
|
19
|
-
"@xsolla/xui-primitives-core": "0.
|
|
20
|
-
"@xsolla/xui-typography": "0.
|
|
16
|
+
"@xsolla/xui-button": "0.192.0",
|
|
17
|
+
"@xsolla/xui-core": "0.192.0",
|
|
18
|
+
"@xsolla/xui-icons-base": "0.192.0",
|
|
19
|
+
"@xsolla/xui-primitives-core": "0.192.0",
|
|
20
|
+
"@xsolla/xui-typography": "0.192.0"
|
|
21
21
|
},
|
|
22
22
|
"peerDependencies": {
|
|
23
23
|
"react": ">=16.8.0",
|
package/web/index.d.mts
CHANGED
|
@@ -1,11 +1,25 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import React__default, { ReactNode } from 'react';
|
|
3
3
|
import { ThemeOverrideProps } from '@xsolla/xui-core';
|
|
4
|
+
import { BaseIconComponent } from '@xsolla/xui-icons-base';
|
|
4
5
|
|
|
6
|
+
/** Any `@xsolla/xui-icons-base` icon component for row remove buttons. Defaults to `Remove`. */
|
|
7
|
+
type ItemerGroupRemoveIcon = BaseIconComponent;
|
|
8
|
+
type ItemerGroupContentType = "input" | "select";
|
|
5
9
|
interface ItemerGroupProps extends ThemeOverrideProps {
|
|
6
10
|
label?: string | string[];
|
|
7
11
|
children?: ReactNode;
|
|
8
12
|
draggable?: boolean;
|
|
13
|
+
/**
|
|
14
|
+
* Row control layout — sets the default remove icon when `removeIcon` is omitted.
|
|
15
|
+
* `input` uses `Remove` (×); `select` uses `Minus` (−).
|
|
16
|
+
*/
|
|
17
|
+
contentType?: ItemerGroupContentType;
|
|
18
|
+
/**
|
|
19
|
+
* Icon component for row remove buttons — any export from `@xsolla/xui-icons-base`
|
|
20
|
+
* (e.g. `Remove`, `Minus`). Overrides the `contentType` default.
|
|
21
|
+
*/
|
|
22
|
+
removeIcon?: ItemerGroupRemoveIcon;
|
|
9
23
|
onAdd?: () => void;
|
|
10
24
|
addButtonLabel?: string;
|
|
11
25
|
showAddButton?: boolean;
|
|
@@ -26,7 +40,8 @@ declare const ItemerGroupRow: React__default.FC<ItemerGroupRowProps>;
|
|
|
26
40
|
interface ItemerGroupContextValue {
|
|
27
41
|
draggable: boolean;
|
|
28
42
|
rowCount: number;
|
|
43
|
+
removeIcon: ItemerGroupRemoveIcon;
|
|
29
44
|
}
|
|
30
45
|
declare const ItemerGroupContext: React.Context<ItemerGroupContextValue>;
|
|
31
46
|
|
|
32
|
-
export { ItemerGroup, ItemerGroupContext, type ItemerGroupProps, ItemerGroupRow, type ItemerGroupRowProps };
|
|
47
|
+
export { ItemerGroup, type ItemerGroupContentType, ItemerGroupContext, type ItemerGroupProps, type ItemerGroupRemoveIcon, ItemerGroupRow, type ItemerGroupRowProps };
|
package/web/index.d.ts
CHANGED
|
@@ -1,11 +1,25 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import React__default, { ReactNode } from 'react';
|
|
3
3
|
import { ThemeOverrideProps } from '@xsolla/xui-core';
|
|
4
|
+
import { BaseIconComponent } from '@xsolla/xui-icons-base';
|
|
4
5
|
|
|
6
|
+
/** Any `@xsolla/xui-icons-base` icon component for row remove buttons. Defaults to `Remove`. */
|
|
7
|
+
type ItemerGroupRemoveIcon = BaseIconComponent;
|
|
8
|
+
type ItemerGroupContentType = "input" | "select";
|
|
5
9
|
interface ItemerGroupProps extends ThemeOverrideProps {
|
|
6
10
|
label?: string | string[];
|
|
7
11
|
children?: ReactNode;
|
|
8
12
|
draggable?: boolean;
|
|
13
|
+
/**
|
|
14
|
+
* Row control layout — sets the default remove icon when `removeIcon` is omitted.
|
|
15
|
+
* `input` uses `Remove` (×); `select` uses `Minus` (−).
|
|
16
|
+
*/
|
|
17
|
+
contentType?: ItemerGroupContentType;
|
|
18
|
+
/**
|
|
19
|
+
* Icon component for row remove buttons — any export from `@xsolla/xui-icons-base`
|
|
20
|
+
* (e.g. `Remove`, `Minus`). Overrides the `contentType` default.
|
|
21
|
+
*/
|
|
22
|
+
removeIcon?: ItemerGroupRemoveIcon;
|
|
9
23
|
onAdd?: () => void;
|
|
10
24
|
addButtonLabel?: string;
|
|
11
25
|
showAddButton?: boolean;
|
|
@@ -26,7 +40,8 @@ declare const ItemerGroupRow: React__default.FC<ItemerGroupRowProps>;
|
|
|
26
40
|
interface ItemerGroupContextValue {
|
|
27
41
|
draggable: boolean;
|
|
28
42
|
rowCount: number;
|
|
43
|
+
removeIcon: ItemerGroupRemoveIcon;
|
|
29
44
|
}
|
|
30
45
|
declare const ItemerGroupContext: React.Context<ItemerGroupContextValue>;
|
|
31
46
|
|
|
32
|
-
export { ItemerGroup, ItemerGroupContext, type ItemerGroupProps, ItemerGroupRow, type ItemerGroupRowProps };
|
|
47
|
+
export { ItemerGroup, type ItemerGroupContentType, ItemerGroupContext, type ItemerGroupProps, type ItemerGroupRemoveIcon, ItemerGroupRow, type ItemerGroupRowProps };
|
package/web/index.js
CHANGED
|
@@ -294,23 +294,28 @@ Box.displayName = "Box";
|
|
|
294
294
|
var import_xui_core = require("@xsolla/xui-core");
|
|
295
295
|
var import_xui_button = require("@xsolla/xui-button");
|
|
296
296
|
var import_xui_typography = require("@xsolla/xui-typography");
|
|
297
|
-
var
|
|
297
|
+
var import_xui_icons_base2 = require("@xsolla/xui-icons-base");
|
|
298
298
|
|
|
299
299
|
// src/ItemerGroupContext.tsx
|
|
300
300
|
var import_react3 = require("react");
|
|
301
|
+
var import_xui_icons_base = require("@xsolla/xui-icons-base");
|
|
301
302
|
var ItemerGroupContext = (0, import_react3.createContext)({
|
|
302
303
|
draggable: false,
|
|
303
|
-
rowCount: 0
|
|
304
|
+
rowCount: 0,
|
|
305
|
+
removeIcon: import_xui_icons_base.Remove
|
|
304
306
|
});
|
|
305
307
|
var useItemerGroupContext = () => (0, import_react3.useContext)(ItemerGroupContext);
|
|
306
308
|
|
|
307
309
|
// src/ItemerGroup.tsx
|
|
308
310
|
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
309
311
|
var REMOVE_BUTTON_SIZE = 40;
|
|
312
|
+
var defaultRemoveIconByContentType = (contentType) => contentType === "select" ? import_xui_icons_base2.Minus : import_xui_icons_base2.Remove;
|
|
310
313
|
var ItemerGroup = ({
|
|
311
314
|
label,
|
|
312
315
|
children,
|
|
313
316
|
draggable = false,
|
|
317
|
+
contentType = "input",
|
|
318
|
+
removeIcon,
|
|
314
319
|
onAdd,
|
|
315
320
|
addButtonLabel = "Add line",
|
|
316
321
|
showAddButton,
|
|
@@ -322,9 +327,10 @@ var ItemerGroup = ({
|
|
|
322
327
|
const { theme } = (0, import_xui_core.useResolvedTheme)({ themeMode, themeProductContext });
|
|
323
328
|
const shouldShowAddButton = showAddButton ?? Boolean(onAdd);
|
|
324
329
|
const rowCount = import_react4.default.Children.toArray(children).length;
|
|
330
|
+
const resolvedRemoveIcon = removeIcon ?? defaultRemoveIconByContentType(contentType);
|
|
325
331
|
const contextValue = (0, import_react4.useMemo)(
|
|
326
|
-
() => ({ draggable, rowCount }),
|
|
327
|
-
[draggable, rowCount]
|
|
332
|
+
() => ({ draggable, rowCount, removeIcon: resolvedRemoveIcon }),
|
|
333
|
+
[draggable, rowCount, resolvedRemoveIcon]
|
|
328
334
|
);
|
|
329
335
|
const showDragSpacer = draggable && rowCount > 1;
|
|
330
336
|
const renderLabel = () => {
|
|
@@ -357,7 +363,7 @@ var ItemerGroup = ({
|
|
|
357
363
|
variant: "secondary",
|
|
358
364
|
tone: "brand",
|
|
359
365
|
size: "sm",
|
|
360
|
-
iconRight: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
366
|
+
iconRight: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_xui_icons_base2.Plus, { size: 16 }),
|
|
361
367
|
onPress: onAdd,
|
|
362
368
|
children: addButtonLabel
|
|
363
369
|
}
|
|
@@ -370,8 +376,9 @@ ItemerGroup.displayName = "ItemerGroup";
|
|
|
370
376
|
// src/ItemerGroupRow.tsx
|
|
371
377
|
var import_xui_core2 = require("@xsolla/xui-core");
|
|
372
378
|
var import_xui_button2 = require("@xsolla/xui-button");
|
|
373
|
-
var
|
|
379
|
+
var import_xui_icons_base3 = require("@xsolla/xui-icons-base");
|
|
374
380
|
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
381
|
+
var REMOVE_ICON_SIZE = 20;
|
|
375
382
|
var ItemerGroupRow = ({
|
|
376
383
|
children,
|
|
377
384
|
onRemove,
|
|
@@ -379,7 +386,11 @@ var ItemerGroupRow = ({
|
|
|
379
386
|
className
|
|
380
387
|
}) => {
|
|
381
388
|
const { theme } = (0, import_xui_core2.useResolvedTheme)({});
|
|
382
|
-
const {
|
|
389
|
+
const {
|
|
390
|
+
draggable,
|
|
391
|
+
rowCount,
|
|
392
|
+
removeIcon: RemoveIcon
|
|
393
|
+
} = useItemerGroupContext();
|
|
383
394
|
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Box, { flexDirection: "row", alignItems: "center", gap: 8, className, children: [
|
|
384
395
|
draggable && rowCount > 1 && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
385
396
|
Box,
|
|
@@ -391,7 +402,7 @@ var ItemerGroupRow = ({
|
|
|
391
402
|
justifyContent: "center",
|
|
392
403
|
flexShrink: 0,
|
|
393
404
|
style: { cursor: "grab" },
|
|
394
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
405
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_xui_icons_base3.Drag, { size: 20, color: theme.colors.content.tertiary })
|
|
395
406
|
}
|
|
396
407
|
),
|
|
397
408
|
/* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
|
@@ -412,7 +423,7 @@ var ItemerGroupRow = ({
|
|
|
412
423
|
tone: "mono",
|
|
413
424
|
size: "sm",
|
|
414
425
|
onPress: onAdd,
|
|
415
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
426
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_xui_icons_base3.Plus, { size: 20 })
|
|
416
427
|
}
|
|
417
428
|
),
|
|
418
429
|
onRemove && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
@@ -423,7 +434,7 @@ var ItemerGroupRow = ({
|
|
|
423
434
|
tone: "mono",
|
|
424
435
|
size: "sm",
|
|
425
436
|
onPress: onRemove,
|
|
426
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
437
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(RemoveIcon, { size: REMOVE_ICON_SIZE })
|
|
427
438
|
}
|
|
428
439
|
)
|
|
429
440
|
]
|
package/web/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/index.tsx","../../src/ItemerGroup.tsx","../../../../foundation/primitives-web/src/Box.tsx","../../../../foundation/primitives-web/src/filterDOMProps.ts","../../../../../node_modules/@emotion/memoize/dist/memoize.esm.js","../../../../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js","../../src/ItemerGroupContext.tsx","../../src/ItemerGroupRow.tsx"],"sourcesContent":["export { ItemerGroup } from \"./ItemerGroup\";\nexport { ItemerGroupRow } from \"./ItemerGroupRow\";\nexport { ItemerGroupContext } from \"./ItemerGroupContext\";\nexport type { ItemerGroupProps, ItemerGroupRowProps } from \"./types\";\n","import React, { useMemo } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { Button } from \"@xsolla/xui-button\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport { Plus } from \"@xsolla/xui-icons-base\";\nimport { ItemerGroupContext } from \"./ItemerGroupContext\";\nimport type { ItemerGroupProps } from \"./types\";\n\n// Size of the IconButton size=\"sm\" — used to reserve matching space in the label row\nconst REMOVE_BUTTON_SIZE = 40;\n\nexport const ItemerGroup: React.FC<ItemerGroupProps> = ({\n label,\n children,\n draggable = false,\n onAdd,\n addButtonLabel = \"Add line\",\n showAddButton,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const shouldShowAddButton = showAddButton ?? Boolean(onAdd);\n const rowCount = React.Children.toArray(children).length;\n const contextValue = useMemo(\n () => ({ draggable, rowCount }),\n [draggable, rowCount]\n );\n\n const showDragSpacer = draggable && rowCount > 1;\n\n const renderLabel = () => {\n if (!label) return null;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {Array.isArray(label) ? (\n <>\n <Box flex={1} flexDirection=\"row\" alignItems=\"flex-start\" gap={4}>\n {label.map((l, i) => (\n <Box flex={1} key={i}>\n <Typography\n variant=\"bodyXs\"\n color={theme.colors.content.secondary}\n >\n {l}\n </Typography>\n </Box>\n ))}\n </Box>\n <Box width={REMOVE_BUTTON_SIZE} flexShrink={0} />\n </>\n ) : (\n <Typography variant=\"bodyXs\" color={theme.colors.content.secondary}>\n {label}\n </Typography>\n )}\n </Box>\n );\n };\n\n return (\n <ItemerGroupContext.Provider value={contextValue}>\n <Box flexDirection=\"column\" gap={8} testID={testID} className={className}>\n <Box flexDirection=\"column\" gap={4}>\n {renderLabel()}\n {children}\n </Box>\n {shouldShowAddButton && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n <Button\n variant=\"secondary\"\n tone=\"brand\"\n size=\"sm\"\n iconRight={<Plus size={16} />}\n onPress={onAdd}\n >\n {addButtonLabel}\n </Button>\n </Box>\n )}\n </Box>\n </ItemerGroupContext.Provider>\n );\n};\n\nItemerGroup.displayName = \"ItemerGroup\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n 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 { createContext, useContext } from \"react\";\n\ninterface ItemerGroupContextValue {\n draggable: boolean;\n rowCount: number;\n}\n\nexport const ItemerGroupContext = createContext<ItemerGroupContextValue>({\n draggable: false,\n rowCount: 0,\n});\n\nexport const useItemerGroupContext = () => useContext(ItemerGroupContext);\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { IconButton } from \"@xsolla/xui-button\";\nimport { Drag, Plus, Remove } from \"@xsolla/xui-icons-base\";\nimport { useItemerGroupContext } from \"./ItemerGroupContext\";\nimport type { ItemerGroupRowProps } from \"./types\";\n\nexport const ItemerGroupRow: React.FC<ItemerGroupRowProps> = ({\n children,\n onRemove,\n onAdd,\n className,\n}) => {\n const { theme } = useResolvedTheme({});\n const { draggable, rowCount } = useItemerGroupContext();\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8} className={className}>\n {draggable && rowCount > 1 && (\n <Box\n data-drag-handle=\"true\"\n width={28}\n height={28}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n style={{ cursor: \"grab\" }}\n >\n <Drag size={20} color={theme.colors.content.tertiary} />\n </Box>\n )}\n <Box\n flex={1}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={4}\n minWidth={0}\n >\n {children}\n {onAdd && (\n <IconButton\n aria-label=\"Add row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onAdd}\n icon={<Plus size={20} />}\n />\n )}\n {onRemove && (\n <IconButton\n aria-label=\"Remove row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onRemove}\n icon={<Remove size={20} />}\n />\n )}\n </Box>\n </Box>\n );\n};\n\nItemerGroupRow.displayName = \"ItemerGroupRow\";\n"],"mappings":"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","names":["import_react","import_react","React","styled","React","import_react","import_jsx_runtime","React","import_xui_core","import_xui_button","import_xui_icons_base","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../../src/index.tsx","../../src/ItemerGroup.tsx","../../../../foundation/primitives-web/src/Box.tsx","../../../../foundation/primitives-web/src/filterDOMProps.ts","../../../../../node_modules/@emotion/memoize/dist/memoize.esm.js","../../../../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js","../../src/ItemerGroupContext.tsx","../../src/ItemerGroupRow.tsx"],"sourcesContent":["export { ItemerGroup } from \"./ItemerGroup\";\nexport { ItemerGroupRow } from \"./ItemerGroupRow\";\nexport { ItemerGroupContext } from \"./ItemerGroupContext\";\nexport type {\n ItemerGroupProps,\n ItemerGroupRowProps,\n ItemerGroupRemoveIcon,\n ItemerGroupContentType,\n} from \"./types\";\n","import React, { useMemo } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { Button } from \"@xsolla/xui-button\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport { Plus, Minus, Remove } from \"@xsolla/xui-icons-base\";\nimport { ItemerGroupContext } from \"./ItemerGroupContext\";\nimport type { ItemerGroupContentType, ItemerGroupProps } from \"./types\";\n\n// Size of the IconButton size=\"sm\" — used to reserve matching space in the label row\nconst REMOVE_BUTTON_SIZE = 40;\n\nconst defaultRemoveIconByContentType = (contentType: ItemerGroupContentType) =>\n contentType === \"select\" ? Minus : Remove;\n\nexport const ItemerGroup: React.FC<ItemerGroupProps> = ({\n label,\n children,\n draggable = false,\n contentType = \"input\",\n removeIcon,\n onAdd,\n addButtonLabel = \"Add line\",\n showAddButton,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const shouldShowAddButton = showAddButton ?? Boolean(onAdd);\n const rowCount = React.Children.toArray(children).length;\n const resolvedRemoveIcon =\n removeIcon ?? defaultRemoveIconByContentType(contentType);\n const contextValue = useMemo(\n () => ({ draggable, rowCount, removeIcon: resolvedRemoveIcon }),\n [draggable, rowCount, resolvedRemoveIcon]\n );\n\n const showDragSpacer = draggable && rowCount > 1;\n\n const renderLabel = () => {\n if (!label) return null;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {Array.isArray(label) ? (\n <>\n <Box flex={1} flexDirection=\"row\" alignItems=\"flex-start\" gap={4}>\n {label.map((l, i) => (\n <Box flex={1} key={i}>\n <Typography\n variant=\"bodyXs\"\n color={theme.colors.content.secondary}\n >\n {l}\n </Typography>\n </Box>\n ))}\n </Box>\n <Box width={REMOVE_BUTTON_SIZE} flexShrink={0} />\n </>\n ) : (\n <Typography variant=\"bodyXs\" color={theme.colors.content.secondary}>\n {label}\n </Typography>\n )}\n </Box>\n );\n };\n\n return (\n <ItemerGroupContext.Provider value={contextValue}>\n <Box flexDirection=\"column\" gap={8} testID={testID} className={className}>\n <Box flexDirection=\"column\" gap={4}>\n {renderLabel()}\n {children}\n </Box>\n {shouldShowAddButton && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n <Button\n variant=\"secondary\"\n tone=\"brand\"\n size=\"sm\"\n iconRight={<Plus size={16} />}\n onPress={onAdd}\n >\n {addButtonLabel}\n </Button>\n </Box>\n )}\n </Box>\n </ItemerGroupContext.Provider>\n );\n};\n\nItemerGroup.displayName = \"ItemerGroup\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n 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 { createContext, useContext } from \"react\";\nimport { Remove } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupRemoveIcon } from \"./types\";\n\ninterface ItemerGroupContextValue {\n draggable: boolean;\n rowCount: number;\n removeIcon: ItemerGroupRemoveIcon;\n}\n\nexport const ItemerGroupContext = createContext<ItemerGroupContextValue>({\n draggable: false,\n rowCount: 0,\n removeIcon: Remove,\n});\n\nexport const useItemerGroupContext = () => useContext(ItemerGroupContext);\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { IconButton } from \"@xsolla/xui-button\";\nimport { Drag, Plus } from \"@xsolla/xui-icons-base\";\nimport { useItemerGroupContext } from \"./ItemerGroupContext\";\nimport type { ItemerGroupRowProps } from \"./types\";\n\nconst REMOVE_ICON_SIZE = 20;\n\nexport const ItemerGroupRow: React.FC<ItemerGroupRowProps> = ({\n children,\n onRemove,\n onAdd,\n className,\n}) => {\n const { theme } = useResolvedTheme({});\n const {\n draggable,\n rowCount,\n removeIcon: RemoveIcon,\n } = useItemerGroupContext();\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8} className={className}>\n {draggable && rowCount > 1 && (\n <Box\n data-drag-handle=\"true\"\n width={28}\n height={28}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n style={{ cursor: \"grab\" }}\n >\n <Drag size={20} color={theme.colors.content.tertiary} />\n </Box>\n )}\n <Box\n flex={1}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={4}\n minWidth={0}\n >\n {children}\n {onAdd && (\n <IconButton\n aria-label=\"Add row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onAdd}\n icon={<Plus size={20} />}\n />\n )}\n {onRemove && (\n <IconButton\n aria-label=\"Remove row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onRemove}\n icon={<RemoveIcon size={REMOVE_ICON_SIZE} />}\n />\n )}\n </Box>\n </Box>\n );\n};\n\nItemerGroupRow.displayName = \"ItemerGroupRow\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,IAAAA,gBAA+B;;;ACA/B,IAAAC,gBAAkB;AAClB,+BAAmB;;;ACDnB,mBAAkB;;;ACAlB,SAAS,QAAQ,IAAI;AACnB,MAAI,QAAQ,CAAC;AACb,SAAO,SAAU,KAAK;AACpB,QAAI,MAAM,GAAG,MAAM,OAAW,OAAM,GAAG,IAAI,GAAG,GAAG;AACjD,WAAO,MAAM,GAAG;AAAA,EAClB;AACF;AAEA,IAAO,sBAAQ;;;ACNf,IAAI,kBAAkB;AAEtB,IAAI,QAAQ;AAAA,EAAQ,SAAU,MAAM;AAClC,WAAO,gBAAgB,KAAK,IAAI,KAAK,KAAK,WAAW,CAAC,MAAM,OAEzD,KAAK,WAAW,CAAC,MAAM,OAEvB,KAAK,WAAW,CAAC,IAAI;AAAA,EAC1B;AAAA;AAEA;AAEA,IAAO,4BAAQ;;;AFRR,IAAM,2BAA2B,oBAAI,IAAI;AAAA;AAAA,EAE9C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC;AAED,SAAS,kBAAkB,KAAsB;AAC/C,MAAI,yBAAyB,IAAI,GAAG,EAAG,QAAO;AAC9C,SAAO,0BAAY,GAAG;AACxB;AAgBO,SAAS,sBAAsB,YAAoB;AACxD,QAAM,YAAY,aAAAC,QAAM;AAAA,IACtB,CAAC,EAAE,UAAU,aAAa,GAAG,MAAM,GAAG,QAAQ;AAC5C,YAAM,MAAO,eAA0B;AACvC,YAAM,YAAqC,CAAC;AAC5C,iBAAW,OAAO,OAAO,KAAK,KAAK,GAAG;AACpC,YAAI,kBAAkB,GAAG,GAAG;AAC1B,oBAAU,GAAG,IAAI,MAAM,GAAG;AAAA,QAC5B;AAAA,MACF;AACA,aAAO,aAAAA,QAAM;AAAA,QACX;AAAA,QACA,EAAE,KAAK,GAAG,UAAU;AAAA,QACpB;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACA,YAAU,cAAc,YAAY,UAAU;AAC9C,SAAO;AACT;;;ADsJQ;AAlNR,IAAM,cAAc,sBAAsB,KAAK;AAE/C,IAAM,gBAAY,yBAAAC,SAAO,WAAW;AAAA;AAAA;AAAA,sBAGd,CAAC,UAAU,MAAM,mBAAmB,aAAa;AAAA,kBACrD,CAAC,UAAU,MAAM,eAAe,aAAa;AAAA,kBAC7C,CAAC,UACf,OAAO,MAAM,gBAAgB,WACzB,GAAG,MAAM,WAAW,OACpB,MAAM,eAAe,CAAC;AAAA;AAAA,IAE1B,CAAC,UACD,MAAM,sBAAsB,UAC5B;AAAA,2BACuB,OAAO,MAAM,sBAAsB,WAAW,GAAG,MAAM,iBAAiB,OAAO,MAAM,iBAAiB;AAAA,2BACtG,MAAM,qBAAqB,MAAM,eAAe,aAAa;AAAA;AAAA,GAErF;AAAA,IACC,CAAC,UACD,MAAM,mBAAmB,UACzB;AAAA,wBACoB,OAAO,MAAM,mBAAmB,WAAW,GAAG,MAAM,cAAc,OAAO,MAAM,cAAc;AAAA,wBAC7F,MAAM,kBAAkB,MAAM,eAAe,aAAa;AAAA;AAAA,GAE/E;AAAA,IACC,CAAC,UACD,MAAM,oBAAoB,UAC1B;AAAA,yBACqB,OAAO,MAAM,oBAAoB,WAAW,GAAG,MAAM,eAAe,OAAO,MAAM,eAAe;AAAA,yBAChG,MAAM,mBAAmB,MAAM,eAAe,aAAa;AAAA;AAAA,GAEjF;AAAA,IACC,CAAC,UACD,MAAM,qBAAqB,UAC3B;AAAA,0BACsB,OAAO,MAAM,qBAAqB,WAAW,GAAG,MAAM,gBAAgB,OAAO,MAAM,gBAAgB;AAAA,0BACnG,MAAM,oBAAoB,MAAM,eAAe,aAAa;AAAA;AAAA,GAEnF;AAAA;AAAA,kBAEe,CAAC,UACf,MAAM,gBACL,MAAM,eACP,MAAM,qBACN,MAAM,kBACN,MAAM,mBACN,MAAM,mBACF,UACA,OAAO;AAAA,mBACI,CAAC,UAChB,OAAO,MAAM,iBAAiB,WAC1B,GAAG,MAAM,YAAY,OACrB,MAAM,gBAAgB,CAAC;AAAA,YACnB,CAAC,UACT,OAAO,MAAM,WAAW,WACpB,GAAG,MAAM,MAAM,OACf,MAAM,UAAU,MAAM;AAAA,WACnB,CAAC,UACR,OAAO,MAAM,UAAU,WACnB,GAAG,MAAM,KAAK,OACd,MAAM,SAAS,MAAM;AAAA,eACd,CAAC,UACZ,OAAO,MAAM,aAAa,WACtB,GAAG,MAAM,QAAQ,OACjB,MAAM,YAAY,MAAM;AAAA,gBAChB,CAAC,UACb,OAAO,MAAM,cAAc,WACvB,GAAG,MAAM,SAAS,OAClB,MAAM,aAAa,MAAM;AAAA,eAClB,CAAC,UACZ,OAAO,MAAM,aAAa,WACtB,GAAG,MAAM,QAAQ,OACjB,MAAM,YAAY,MAAM;AAAA,gBAChB,CAAC,UACb,OAAO,MAAM,cAAc,WACvB,GAAG,MAAM,SAAS,OAClB,MAAM,aAAa,MAAM;AAAA;AAAA,aAEpB,CAAC,UACV,OAAO,MAAM,YAAY,WACrB,GAAG,MAAM,OAAO,OAChB,MAAM,WAAW,CAAC;AAAA,IACtB,CAAC,UACD,MAAM,qBACN;AAAA,oBACgB,OAAO,MAAM,sBAAsB,WAAW,GAAG,MAAM,iBAAiB,OAAO,MAAM,iBAAiB;AAAA,qBACrG,OAAO,MAAM,sBAAsB,WAAW,GAAG,MAAM,iBAAiB,OAAO,MAAM,iBAAiB;AAAA,GACxH;AAAA,IACC,CAAC,UACD,MAAM,mBACN;AAAA,mBACe,OAAO,MAAM,oBAAoB,WAAW,GAAG,MAAM,eAAe,OAAO,MAAM,eAAe;AAAA,sBAC7F,OAAO,MAAM,oBAAoB,WAAW,GAAG,MAAM,eAAe,OAAO,MAAM,eAAe;AAAA,GACnH;AAAA,IACC,CAAC,UACD,MAAM,eAAe,UACrB,gBAAgB,OAAO,MAAM,eAAe,WAAW,GAAG,MAAM,UAAU,OAAO,MAAM,UAAU,GAAG;AAAA,IACpG,CAAC,UACD,MAAM,kBAAkB,UACxB,mBAAmB,OAAO,MAAM,kBAAkB,WAAW,GAAG,MAAM,aAAa,OAAO,MAAM,aAAa,GAAG;AAAA,IAChH,CAAC,UACD,MAAM,gBAAgB,UACtB,iBAAiB,OAAO,MAAM,gBAAgB,WAAW,GAAG,MAAM,WAAW,OAAO,MAAM,WAAW,GAAG;AAAA,IACxG,CAAC,UACD,MAAM,iBAAiB,UACvB,kBAAkB,OAAO,MAAM,iBAAiB,WAAW,GAAG,MAAM,YAAY,OAAO,MAAM,YAAY,GAAG;AAAA;AAAA,YAEpG,CAAC,UACT,OAAO,MAAM,WAAW,WAAW,GAAG,MAAM,MAAM,OAAO,MAAM,UAAU,CAAC;AAAA,IAC1E,CAAC,UACD,MAAM,cAAc,UACpB,eAAe,OAAO,MAAM,cAAc,WAAW,GAAG,MAAM,SAAS,OAAO,MAAM,SAAS,GAAG;AAAA,IAChG,CAAC,UACD,MAAM,iBAAiB,UACvB,kBAAkB,OAAO,MAAM,iBAAiB,WAAW,GAAG,MAAM,YAAY,OAAO,MAAM,YAAY,GAAG;AAAA,IAC5G,CAAC,UACD,MAAM,eAAe,UACrB,gBAAgB,OAAO,MAAM,eAAe,WAAW,GAAG,MAAM,UAAU,OAAO,MAAM,UAAU,GAAG;AAAA,IACpG,CAAC,UACD,MAAM,gBAAgB,UACtB,iBAAiB,OAAO,MAAM,gBAAgB,WAAW,GAAG,MAAM,WAAW,OAAO,MAAM,WAAW,GAAG;AAAA;AAAA,oBAExF,CAAC,UAAU,MAAM,iBAAiB,QAAQ;AAAA,eAC/C,CAAC,UAAU,MAAM,YAAY,QAAQ;AAAA,iBACnC,CAAC,UAAU,MAAM,cAAc,SAAS;AAAA,qBACpC,CAAC,UAAU,MAAM,kBAAkB,YAAY;AAAA,YACxD,CAAC,UACT,MAAM,SACF,MAAM,SACN,MAAM,WAAW,MAAM,UACrB,YACA,SAAS;AAAA,cACL,CAAC,UAAU,MAAM,YAAY,QAAQ;AAAA,SAC1C,CAAC,UACN,OAAO,MAAM,QAAQ,WAAW,GAAG,MAAM,GAAG,OAAO,MAAM,GAAG;AAAA,YACpD,CAAC,UACT,OAAO,MAAM,WAAW,WAAW,GAAG,MAAM,MAAM,OAAO,MAAM,MAAM;AAAA,UAC/D,CAAC,UACP,OAAO,MAAM,SAAS,WAAW,GAAG,MAAM,IAAI,OAAO,MAAM,IAAI;AAAA,WACxD,CAAC,UACR,OAAO,MAAM,UAAU,WAAW,GAAG,MAAM,KAAK,OAAO,MAAM,KAAK;AAAA,UAC5D,CAAC,UAAU,MAAM,IAAI;AAAA,iBACd,CAAC,UAAU,MAAM,cAAc,CAAC;AAAA,SACxC,CAAC,UACN,OAAO,MAAM,QAAQ,WAAW,GAAG,MAAM,GAAG,OAAO,MAAM,OAAO,CAAC;AAAA,gBACrD,CAAC,UAAU,MAAM,aAAa,MAAM;AAAA,cACtC,CAAC,UAAU,MAAM,YAAY,SAAS;AAAA,gBACpC,CAAC,UAAU,MAAM,aAAa,SAAS;AAAA,gBACvC,CAAC,UAAU,MAAM,aAAa,SAAS;AAAA,aAC1C,CAAC,UAAU,MAAM,MAAM;AAAA,aACvB,CAAC,UAAW,MAAM,WAAW,MAAM,CAAE;AAAA,oBAC9B,CAAC,UAAW,MAAM,WAAW,SAAS,MAAO;AAAA;AAAA;AAAA,MAG3D,CAAC,UACD,MAAM,YAAY,mBAClB,qBAAqB,MAAM,WAAW,eAAe,GAAG;AAAA,MACxD,CAAC,UACD,MAAM,YAAY,eAClB,iBAAiB,MAAM,WAAW,WAAW,GAAG;AAAA;AAAA;AAAA;AAAA,MAIhD,CAAC,UACD,MAAM,YAAY,mBAClB,qBAAqB,MAAM,WAAW,eAAe,GAAG;AAAA;AAAA;AAIvD,IAAM,MAAM,cAAAC,QAAM;AAAA,EAIvB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB,aAAa;AAAA,IACb,aAAa;AAAA,IACb,oBAAoB;AAAA,IACpB,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,IACjB,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,GAAG;AAAA,EACL,GACA,QACG;AAEH,QAAI,OAAO,SAAS,KAAK;AACvB,aACE;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,KAAK,OAAO;AAAA,UACZ;AAAA,UACA;AAAA,UACA,OAAO;AAAA,YACL,SAAS;AAAA,YACT,WAAW;AAAA,YACX,OACE,OAAO,MAAM,UAAU,WACnB,GAAG,MAAM,KAAK,OACd,MAAM;AAAA,YACZ,QACE,OAAO,MAAM,WAAW,WACpB,GAAG,MAAM,MAAM,OACf,MAAM;AAAA,YACZ,cACE,OAAO,MAAM,iBAAiB,WAC1B,GAAG,MAAM,YAAY,OACrB,MAAM;AAAA,YACZ,UAAU,MAAM;AAAA,YAChB,KAAK,OAAO,MAAM,QAAQ,WAAW,GAAG,MAAM,GAAG,OAAO,MAAM;AAAA,YAC9D,MACE,OAAO,MAAM,SAAS,WAAW,GAAG,MAAM,IAAI,OAAO,MAAM;AAAA,YAC7D,OACE,OAAO,MAAM,UAAU,WACnB,GAAG,MAAM,KAAK,OACd,MAAM;AAAA,YACZ,QACE,OAAO,MAAM,WAAW,WACpB,GAAG,MAAM,MAAM,OACf,MAAM;AAAA,YACZ,GAAG,MAAM;AAAA,UACX;AAAA;AAAA,MACF;AAAA,IAEJ;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,aAAa;AAAA,QACb;AAAA,QACA,MAAM,OAAO,WAAW,QAAQ,WAAW;AAAA,QAC3C,UAAU,OAAO,WAAW,WAAW;AAAA,QACvC,SAAS;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA,cAAY;AAAA,QACZ,mBAAiB;AAAA,QACjB,gBAAc;AAAA,QACd,iBAAe;AAAA,QACf,aAAW;AAAA,QACX,oBAAkB;AAAA,QAClB,iBAAe;AAAA,QACf,iBAAe;AAAA,QACf,gBAAc;AAAA,QACd,iBAAe;AAAA,QACf,aAAW;AAAA,QACX,UAAU,aAAa,SAAY,WAAW;AAAA,QAC9C,eAAa,cAAc;AAAA,QAC1B,GAAG;AAAA,QAEH;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,IAAI,cAAc;;;AD1RlB,sBAAiC;AACjC,wBAAuB;AACvB,4BAA2B;AAC3B,IAAAC,yBAAoC;;;AKNpC,IAAAC,gBAA0C;AAC1C,4BAAuB;AAShB,IAAM,yBAAqB,6BAAuC;AAAA,EACvE,WAAW;AAAA,EACX,UAAU;AAAA,EACV,YAAY;AACd,CAAC;AAEM,IAAM,wBAAwB,UAAM,0BAAW,kBAAkB;;;AL+B7C,IAAAC,sBAAA;AApC3B,IAAM,qBAAqB;AAE3B,IAAM,iCAAiC,CAAC,gBACtC,gBAAgB,WAAW,+BAAQ;AAE9B,IAAM,cAA0C,CAAC;AAAA,EACtD;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,MAAM,QAAI,kCAAiB,EAAE,WAAW,oBAAoB,CAAC;AACrE,QAAM,sBAAsB,iBAAiB,QAAQ,KAAK;AAC1D,QAAM,WAAW,cAAAC,QAAM,SAAS,QAAQ,QAAQ,EAAE;AAClD,QAAM,qBACJ,cAAc,+BAA+B,WAAW;AAC1D,QAAM,mBAAe;AAAA,IACnB,OAAO,EAAE,WAAW,UAAU,YAAY,mBAAmB;AAAA,IAC7D,CAAC,WAAW,UAAU,kBAAkB;AAAA,EAC1C;AAEA,QAAM,iBAAiB,aAAa,WAAW;AAE/C,QAAM,cAAc,MAAM;AACxB,QAAI,CAAC,MAAO,QAAO;AAEnB,WACE,8CAAC,OAAI,eAAc,OAAM,YAAW,UAAS,KAAK,GAC/C;AAAA,wBAAkB,6CAAC,OAAI,OAAO,IAAI,YAAY,GAAG;AAAA,MACjD,MAAM,QAAQ,KAAK,IAClB,8EACE;AAAA,qDAAC,OAAI,MAAM,GAAG,eAAc,OAAM,YAAW,cAAa,KAAK,GAC5D,gBAAM,IAAI,CAAC,GAAG,MACb,6CAAC,OAAI,MAAM,GACT;AAAA,UAAC;AAAA;AAAA,YACC,SAAQ;AAAA,YACR,OAAO,MAAM,OAAO,QAAQ;AAAA,YAE3B;AAAA;AAAA,QACH,KANiB,CAOnB,CACD,GACH;AAAA,QACA,6CAAC,OAAI,OAAO,oBAAoB,YAAY,GAAG;AAAA,SACjD,IAEA,6CAAC,oCAAW,SAAQ,UAAS,OAAO,MAAM,OAAO,QAAQ,WACtD,iBACH;AAAA,OAEJ;AAAA,EAEJ;AAEA,SACE,6CAAC,mBAAmB,UAAnB,EAA4B,OAAO,cAClC,wDAAC,OAAI,eAAc,UAAS,KAAK,GAAG,QAAgB,WAClD;AAAA,kDAAC,OAAI,eAAc,UAAS,KAAK,GAC9B;AAAA,kBAAY;AAAA,MACZ;AAAA,OACH;AAAA,IACC,uBACC,8CAAC,OAAI,eAAc,OAAM,YAAW,UAAS,KAAK,GAC/C;AAAA,wBAAkB,6CAAC,OAAI,OAAO,IAAI,YAAY,GAAG;AAAA,MAClD;AAAA,QAAC;AAAA;AAAA,UACC,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,MAAK;AAAA,UACL,WAAW,6CAAC,+BAAK,MAAM,IAAI;AAAA,UAC3B,SAAS;AAAA,UAER;AAAA;AAAA,MACH;AAAA,OACF;AAAA,KAEJ,GACF;AAEJ;AAEA,YAAY,cAAc;;;AMhG1B,IAAAC,mBAAiC;AACjC,IAAAC,qBAA2B;AAC3B,IAAAC,yBAA2B;AA+BjB,IAAAC,sBAAA;AA3BV,IAAM,mBAAmB;AAElB,IAAM,iBAAgD,CAAC;AAAA,EAC5D;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,MAAM,QAAI,mCAAiB,CAAC,CAAC;AACrC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,YAAY;AAAA,EACd,IAAI,sBAAsB;AAE1B,SACE,8CAAC,OAAI,eAAc,OAAM,YAAW,UAAS,KAAK,GAAG,WAClD;AAAA,iBAAa,WAAW,KACvB;AAAA,MAAC;AAAA;AAAA,QACC,oBAAiB;AAAA,QACjB,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,YAAW;AAAA,QACX,gBAAe;AAAA,QACf,YAAY;AAAA,QACZ,OAAO,EAAE,QAAQ,OAAO;AAAA,QAExB,uDAAC,+BAAK,MAAM,IAAI,OAAO,MAAM,OAAO,QAAQ,UAAU;AAAA;AAAA,IACxD;AAAA,IAEF;AAAA,MAAC;AAAA;AAAA,QACC,MAAM;AAAA,QACN,eAAc;AAAA,QACd,YAAW;AAAA,QACX,KAAK;AAAA,QACL,UAAU;AAAA,QAET;AAAA;AAAA,UACA,SACC;AAAA,YAAC;AAAA;AAAA,cACC,cAAW;AAAA,cACX,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,MAAK;AAAA,cACL,SAAS;AAAA,cACT,MAAM,6CAAC,+BAAK,MAAM,IAAI;AAAA;AAAA,UACxB;AAAA,UAED,YACC;AAAA,YAAC;AAAA;AAAA,cACC,cAAW;AAAA,cACX,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,MAAK;AAAA,cACL,SAAS;AAAA,cACT,MAAM,6CAAC,cAAW,MAAM,kBAAkB;AAAA;AAAA,UAC5C;AAAA;AAAA;AAAA,IAEJ;AAAA,KACF;AAEJ;AAEA,eAAe,cAAc;","names":["import_react","import_react","React","styled","React","import_xui_icons_base","import_react","import_jsx_runtime","React","import_xui_core","import_xui_button","import_xui_icons_base","import_jsx_runtime"]}
|
package/web/index.mjs
CHANGED
|
@@ -256,23 +256,28 @@ Box.displayName = "Box";
|
|
|
256
256
|
import { useResolvedTheme } from "@xsolla/xui-core";
|
|
257
257
|
import { Button } from "@xsolla/xui-button";
|
|
258
258
|
import { Typography } from "@xsolla/xui-typography";
|
|
259
|
-
import { Plus } from "@xsolla/xui-icons-base";
|
|
259
|
+
import { Plus, Minus, Remove as Remove2 } from "@xsolla/xui-icons-base";
|
|
260
260
|
|
|
261
261
|
// src/ItemerGroupContext.tsx
|
|
262
262
|
import { createContext, useContext } from "react";
|
|
263
|
+
import { Remove } from "@xsolla/xui-icons-base";
|
|
263
264
|
var ItemerGroupContext = createContext({
|
|
264
265
|
draggable: false,
|
|
265
|
-
rowCount: 0
|
|
266
|
+
rowCount: 0,
|
|
267
|
+
removeIcon: Remove
|
|
266
268
|
});
|
|
267
269
|
var useItemerGroupContext = () => useContext(ItemerGroupContext);
|
|
268
270
|
|
|
269
271
|
// src/ItemerGroup.tsx
|
|
270
272
|
import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
271
273
|
var REMOVE_BUTTON_SIZE = 40;
|
|
274
|
+
var defaultRemoveIconByContentType = (contentType) => contentType === "select" ? Minus : Remove2;
|
|
272
275
|
var ItemerGroup = ({
|
|
273
276
|
label,
|
|
274
277
|
children,
|
|
275
278
|
draggable = false,
|
|
279
|
+
contentType = "input",
|
|
280
|
+
removeIcon,
|
|
276
281
|
onAdd,
|
|
277
282
|
addButtonLabel = "Add line",
|
|
278
283
|
showAddButton,
|
|
@@ -284,9 +289,10 @@ var ItemerGroup = ({
|
|
|
284
289
|
const { theme } = useResolvedTheme({ themeMode, themeProductContext });
|
|
285
290
|
const shouldShowAddButton = showAddButton ?? Boolean(onAdd);
|
|
286
291
|
const rowCount = React3.Children.toArray(children).length;
|
|
292
|
+
const resolvedRemoveIcon = removeIcon ?? defaultRemoveIconByContentType(contentType);
|
|
287
293
|
const contextValue = useMemo(
|
|
288
|
-
() => ({ draggable, rowCount }),
|
|
289
|
-
[draggable, rowCount]
|
|
294
|
+
() => ({ draggable, rowCount, removeIcon: resolvedRemoveIcon }),
|
|
295
|
+
[draggable, rowCount, resolvedRemoveIcon]
|
|
290
296
|
);
|
|
291
297
|
const showDragSpacer = draggable && rowCount > 1;
|
|
292
298
|
const renderLabel = () => {
|
|
@@ -332,8 +338,9 @@ ItemerGroup.displayName = "ItemerGroup";
|
|
|
332
338
|
// src/ItemerGroupRow.tsx
|
|
333
339
|
import { useResolvedTheme as useResolvedTheme2 } from "@xsolla/xui-core";
|
|
334
340
|
import { IconButton } from "@xsolla/xui-button";
|
|
335
|
-
import { Drag, Plus as Plus2
|
|
341
|
+
import { Drag, Plus as Plus2 } from "@xsolla/xui-icons-base";
|
|
336
342
|
import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
343
|
+
var REMOVE_ICON_SIZE = 20;
|
|
337
344
|
var ItemerGroupRow = ({
|
|
338
345
|
children,
|
|
339
346
|
onRemove,
|
|
@@ -341,7 +348,11 @@ var ItemerGroupRow = ({
|
|
|
341
348
|
className
|
|
342
349
|
}) => {
|
|
343
350
|
const { theme } = useResolvedTheme2({});
|
|
344
|
-
const {
|
|
351
|
+
const {
|
|
352
|
+
draggable,
|
|
353
|
+
rowCount,
|
|
354
|
+
removeIcon: RemoveIcon
|
|
355
|
+
} = useItemerGroupContext();
|
|
345
356
|
return /* @__PURE__ */ jsxs2(Box, { flexDirection: "row", alignItems: "center", gap: 8, className, children: [
|
|
346
357
|
draggable && rowCount > 1 && /* @__PURE__ */ jsx3(
|
|
347
358
|
Box,
|
|
@@ -385,7 +396,7 @@ var ItemerGroupRow = ({
|
|
|
385
396
|
tone: "mono",
|
|
386
397
|
size: "sm",
|
|
387
398
|
onPress: onRemove,
|
|
388
|
-
icon: /* @__PURE__ */ jsx3(
|
|
399
|
+
icon: /* @__PURE__ */ jsx3(RemoveIcon, { size: REMOVE_ICON_SIZE })
|
|
389
400
|
}
|
|
390
401
|
)
|
|
391
402
|
]
|
package/web/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/ItemerGroup.tsx","../../../../foundation/primitives-web/src/Box.tsx","../../../../foundation/primitives-web/src/filterDOMProps.ts","../../../../../node_modules/@emotion/memoize/dist/memoize.esm.js","../../../../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js","../../src/ItemerGroupContext.tsx","../../src/ItemerGroupRow.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { Button } from \"@xsolla/xui-button\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport { Plus } from \"@xsolla/xui-icons-base\";\nimport { ItemerGroupContext } from \"./ItemerGroupContext\";\nimport type { ItemerGroupProps } from \"./types\";\n\n// Size of the IconButton size=\"sm\" — used to reserve matching space in the label row\nconst REMOVE_BUTTON_SIZE = 40;\n\nexport const ItemerGroup: React.FC<ItemerGroupProps> = ({\n label,\n children,\n draggable = false,\n onAdd,\n addButtonLabel = \"Add line\",\n showAddButton,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const shouldShowAddButton = showAddButton ?? Boolean(onAdd);\n const rowCount = React.Children.toArray(children).length;\n const contextValue = useMemo(\n () => ({ draggable, rowCount }),\n [draggable, rowCount]\n );\n\n const showDragSpacer = draggable && rowCount > 1;\n\n const renderLabel = () => {\n if (!label) return null;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {Array.isArray(label) ? (\n <>\n <Box flex={1} flexDirection=\"row\" alignItems=\"flex-start\" gap={4}>\n {label.map((l, i) => (\n <Box flex={1} key={i}>\n <Typography\n variant=\"bodyXs\"\n color={theme.colors.content.secondary}\n >\n {l}\n </Typography>\n </Box>\n ))}\n </Box>\n <Box width={REMOVE_BUTTON_SIZE} flexShrink={0} />\n </>\n ) : (\n <Typography variant=\"bodyXs\" color={theme.colors.content.secondary}>\n {label}\n </Typography>\n )}\n </Box>\n );\n };\n\n return (\n <ItemerGroupContext.Provider value={contextValue}>\n <Box flexDirection=\"column\" gap={8} testID={testID} className={className}>\n <Box flexDirection=\"column\" gap={4}>\n {renderLabel()}\n {children}\n </Box>\n {shouldShowAddButton && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n <Button\n variant=\"secondary\"\n tone=\"brand\"\n size=\"sm\"\n iconRight={<Plus size={16} />}\n onPress={onAdd}\n >\n {addButtonLabel}\n </Button>\n </Box>\n )}\n </Box>\n </ItemerGroupContext.Provider>\n );\n};\n\nItemerGroup.displayName = \"ItemerGroup\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n 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 { createContext, useContext } from \"react\";\n\ninterface ItemerGroupContextValue {\n draggable: boolean;\n rowCount: number;\n}\n\nexport const ItemerGroupContext = createContext<ItemerGroupContextValue>({\n draggable: false,\n rowCount: 0,\n});\n\nexport const useItemerGroupContext = () => useContext(ItemerGroupContext);\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { IconButton } from \"@xsolla/xui-button\";\nimport { Drag, Plus, Remove } from \"@xsolla/xui-icons-base\";\nimport { useItemerGroupContext } from \"./ItemerGroupContext\";\nimport type { ItemerGroupRowProps } from \"./types\";\n\nexport const ItemerGroupRow: React.FC<ItemerGroupRowProps> = ({\n children,\n onRemove,\n onAdd,\n className,\n}) => {\n const { theme } = useResolvedTheme({});\n const { draggable, rowCount } = useItemerGroupContext();\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8} className={className}>\n {draggable && rowCount > 1 && (\n <Box\n data-drag-handle=\"true\"\n width={28}\n height={28}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n style={{ cursor: \"grab\" }}\n >\n <Drag size={20} color={theme.colors.content.tertiary} />\n </Box>\n )}\n <Box\n flex={1}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={4}\n minWidth={0}\n >\n {children}\n {onAdd && (\n <IconButton\n aria-label=\"Add row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onAdd}\n icon={<Plus size={20} />}\n />\n )}\n {onRemove && (\n <IconButton\n aria-label=\"Remove row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onRemove}\n icon={<Remove size={20} />}\n />\n )}\n </Box>\n </Box>\n );\n};\n\nItemerGroupRow.displayName = \"ItemerGroupRow\";\n"],"mappings":"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","names":["React","React","React","jsx","React","useResolvedTheme","Plus","jsx","jsxs","useResolvedTheme","Plus"]}
|
|
1
|
+
{"version":3,"sources":["../../src/ItemerGroup.tsx","../../../../foundation/primitives-web/src/Box.tsx","../../../../foundation/primitives-web/src/filterDOMProps.ts","../../../../../node_modules/@emotion/memoize/dist/memoize.esm.js","../../../../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js","../../src/ItemerGroupContext.tsx","../../src/ItemerGroupRow.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { Button } from \"@xsolla/xui-button\";\nimport { Typography } from \"@xsolla/xui-typography\";\nimport { Plus, Minus, Remove } from \"@xsolla/xui-icons-base\";\nimport { ItemerGroupContext } from \"./ItemerGroupContext\";\nimport type { ItemerGroupContentType, ItemerGroupProps } from \"./types\";\n\n// Size of the IconButton size=\"sm\" — used to reserve matching space in the label row\nconst REMOVE_BUTTON_SIZE = 40;\n\nconst defaultRemoveIconByContentType = (contentType: ItemerGroupContentType) =>\n contentType === \"select\" ? Minus : Remove;\n\nexport const ItemerGroup: React.FC<ItemerGroupProps> = ({\n label,\n children,\n draggable = false,\n contentType = \"input\",\n removeIcon,\n onAdd,\n addButtonLabel = \"Add line\",\n showAddButton,\n className,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const shouldShowAddButton = showAddButton ?? Boolean(onAdd);\n const rowCount = React.Children.toArray(children).length;\n const resolvedRemoveIcon =\n removeIcon ?? defaultRemoveIconByContentType(contentType);\n const contextValue = useMemo(\n () => ({ draggable, rowCount, removeIcon: resolvedRemoveIcon }),\n [draggable, rowCount, resolvedRemoveIcon]\n );\n\n const showDragSpacer = draggable && rowCount > 1;\n\n const renderLabel = () => {\n if (!label) return null;\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n {Array.isArray(label) ? (\n <>\n <Box flex={1} flexDirection=\"row\" alignItems=\"flex-start\" gap={4}>\n {label.map((l, i) => (\n <Box flex={1} key={i}>\n <Typography\n variant=\"bodyXs\"\n color={theme.colors.content.secondary}\n >\n {l}\n </Typography>\n </Box>\n ))}\n </Box>\n <Box width={REMOVE_BUTTON_SIZE} flexShrink={0} />\n </>\n ) : (\n <Typography variant=\"bodyXs\" color={theme.colors.content.secondary}>\n {label}\n </Typography>\n )}\n </Box>\n );\n };\n\n return (\n <ItemerGroupContext.Provider value={contextValue}>\n <Box flexDirection=\"column\" gap={8} testID={testID} className={className}>\n <Box flexDirection=\"column\" gap={4}>\n {renderLabel()}\n {children}\n </Box>\n {shouldShowAddButton && (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8}>\n {showDragSpacer && <Box width={28} flexShrink={0} />}\n <Button\n variant=\"secondary\"\n tone=\"brand\"\n size=\"sm\"\n iconRight={<Plus size={16} />}\n onPress={onAdd}\n >\n {addButtonLabel}\n </Button>\n </Box>\n )}\n </Box>\n </ItemerGroupContext.Provider>\n );\n};\n\nItemerGroup.displayName = \"ItemerGroup\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n 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 { createContext, useContext } from \"react\";\nimport { Remove } from \"@xsolla/xui-icons-base\";\nimport type { ItemerGroupRemoveIcon } from \"./types\";\n\ninterface ItemerGroupContextValue {\n draggable: boolean;\n rowCount: number;\n removeIcon: ItemerGroupRemoveIcon;\n}\n\nexport const ItemerGroupContext = createContext<ItemerGroupContextValue>({\n draggable: false,\n rowCount: 0,\n removeIcon: Remove,\n});\n\nexport const useItemerGroupContext = () => useContext(ItemerGroupContext);\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { IconButton } from \"@xsolla/xui-button\";\nimport { Drag, Plus } from \"@xsolla/xui-icons-base\";\nimport { useItemerGroupContext } from \"./ItemerGroupContext\";\nimport type { ItemerGroupRowProps } from \"./types\";\n\nconst REMOVE_ICON_SIZE = 20;\n\nexport const ItemerGroupRow: React.FC<ItemerGroupRowProps> = ({\n children,\n onRemove,\n onAdd,\n className,\n}) => {\n const { theme } = useResolvedTheme({});\n const {\n draggable,\n rowCount,\n removeIcon: RemoveIcon,\n } = useItemerGroupContext();\n\n return (\n <Box flexDirection=\"row\" alignItems=\"center\" gap={8} className={className}>\n {draggable && rowCount > 1 && (\n <Box\n data-drag-handle=\"true\"\n width={28}\n height={28}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n style={{ cursor: \"grab\" }}\n >\n <Drag size={20} color={theme.colors.content.tertiary} />\n </Box>\n )}\n <Box\n flex={1}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={4}\n minWidth={0}\n >\n {children}\n {onAdd && (\n <IconButton\n aria-label=\"Add row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onAdd}\n icon={<Plus size={20} />}\n />\n )}\n {onRemove && (\n <IconButton\n aria-label=\"Remove row\"\n variant=\"secondary\"\n tone=\"mono\"\n size=\"sm\"\n onPress={onRemove}\n icon={<RemoveIcon size={REMOVE_ICON_SIZE} />}\n />\n )}\n </Box>\n </Box>\n );\n};\n\nItemerGroupRow.displayName = \"ItemerGroupRow\";\n"],"mappings":"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","names":["React","React","React","Remove","jsx","Remove","React","useResolvedTheme","Plus","jsx","jsxs","useResolvedTheme","Plus"]}
|