@xsolla/xui-b2b-collapsible 0.147.1
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 +32 -0
- package/native/index.d.ts +32 -0
- package/native/index.js +531 -0
- package/native/index.js.map +1 -0
- package/native/index.mjs +501 -0
- package/native/index.mjs.map +1 -0
- package/package.json +58 -0
- package/web/index.d.mts +32 -0
- package/web/index.d.ts +32 -0
- package/web/index.js +573 -0
- package/web/index.js.map +1 -0
- package/web/index.mjs +536 -0
- package/web/index.mjs.map +1 -0
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import { ReactNode } from 'react';
|
|
3
|
+
import { ThemeOverrideProps } from '@xsolla/xui-core';
|
|
4
|
+
|
|
5
|
+
type CollapsibleView = "without-surface" | "white-surface" | "grey-surface";
|
|
6
|
+
interface CollapsibleProps extends ThemeOverrideProps {
|
|
7
|
+
title: ReactNode;
|
|
8
|
+
caption?: ReactNode;
|
|
9
|
+
/** Optional icon shown in a 32×32 slot at the left of the trigger. */
|
|
10
|
+
icon?: ReactNode;
|
|
11
|
+
/** Optional content shown to the right of the text, before the chevron. */
|
|
12
|
+
trailing?: ReactNode;
|
|
13
|
+
view?: CollapsibleView;
|
|
14
|
+
/** Controlled open state. */
|
|
15
|
+
open?: boolean;
|
|
16
|
+
/** Initial open state for uncontrolled usage. */
|
|
17
|
+
defaultOpen?: boolean;
|
|
18
|
+
onOpenChange?: (open: boolean) => void;
|
|
19
|
+
children: ReactNode;
|
|
20
|
+
className?: string;
|
|
21
|
+
"aria-label"?: string;
|
|
22
|
+
/** @deprecated Use `onOpenChange` instead. */
|
|
23
|
+
onChange?: (isOpen: boolean) => void;
|
|
24
|
+
/** @deprecated Use `trailing` instead. */
|
|
25
|
+
statusIcon?: ReactNode;
|
|
26
|
+
/** @deprecated Use `caption` instead. */
|
|
27
|
+
description?: string;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
declare const Collapsible: react.ForwardRefExoticComponent<CollapsibleProps & react.RefAttributes<HTMLDivElement>>;
|
|
31
|
+
|
|
32
|
+
export { Collapsible, type CollapsibleProps, type CollapsibleView };
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import { ReactNode } from 'react';
|
|
3
|
+
import { ThemeOverrideProps } from '@xsolla/xui-core';
|
|
4
|
+
|
|
5
|
+
type CollapsibleView = "without-surface" | "white-surface" | "grey-surface";
|
|
6
|
+
interface CollapsibleProps extends ThemeOverrideProps {
|
|
7
|
+
title: ReactNode;
|
|
8
|
+
caption?: ReactNode;
|
|
9
|
+
/** Optional icon shown in a 32×32 slot at the left of the trigger. */
|
|
10
|
+
icon?: ReactNode;
|
|
11
|
+
/** Optional content shown to the right of the text, before the chevron. */
|
|
12
|
+
trailing?: ReactNode;
|
|
13
|
+
view?: CollapsibleView;
|
|
14
|
+
/** Controlled open state. */
|
|
15
|
+
open?: boolean;
|
|
16
|
+
/** Initial open state for uncontrolled usage. */
|
|
17
|
+
defaultOpen?: boolean;
|
|
18
|
+
onOpenChange?: (open: boolean) => void;
|
|
19
|
+
children: ReactNode;
|
|
20
|
+
className?: string;
|
|
21
|
+
"aria-label"?: string;
|
|
22
|
+
/** @deprecated Use `onOpenChange` instead. */
|
|
23
|
+
onChange?: (isOpen: boolean) => void;
|
|
24
|
+
/** @deprecated Use `trailing` instead. */
|
|
25
|
+
statusIcon?: ReactNode;
|
|
26
|
+
/** @deprecated Use `caption` instead. */
|
|
27
|
+
description?: string;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
declare const Collapsible: react.ForwardRefExoticComponent<CollapsibleProps & react.RefAttributes<HTMLDivElement>>;
|
|
31
|
+
|
|
32
|
+
export { Collapsible, type CollapsibleProps, type CollapsibleView };
|
package/native/index.js
ADDED
|
@@ -0,0 +1,531 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
|
|
30
|
+
// src/index.tsx
|
|
31
|
+
var index_exports = {};
|
|
32
|
+
__export(index_exports, {
|
|
33
|
+
Collapsible: () => Collapsible
|
|
34
|
+
});
|
|
35
|
+
module.exports = __toCommonJS(index_exports);
|
|
36
|
+
|
|
37
|
+
// src/Collapsible.tsx
|
|
38
|
+
var import_react2 = require("react");
|
|
39
|
+
|
|
40
|
+
// ../../foundation/primitives-native/src/Box.tsx
|
|
41
|
+
var import_react_native = require("react-native");
|
|
42
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
43
|
+
var Box = ({
|
|
44
|
+
children,
|
|
45
|
+
onPress,
|
|
46
|
+
onLayout,
|
|
47
|
+
onMoveShouldSetResponder,
|
|
48
|
+
onResponderGrant,
|
|
49
|
+
onResponderMove,
|
|
50
|
+
onResponderRelease,
|
|
51
|
+
onResponderTerminate,
|
|
52
|
+
backgroundColor,
|
|
53
|
+
borderColor,
|
|
54
|
+
borderWidth,
|
|
55
|
+
borderBottomWidth,
|
|
56
|
+
borderBottomColor,
|
|
57
|
+
borderTopWidth,
|
|
58
|
+
borderTopColor,
|
|
59
|
+
borderLeftWidth,
|
|
60
|
+
borderLeftColor,
|
|
61
|
+
borderRightWidth,
|
|
62
|
+
borderRightColor,
|
|
63
|
+
borderRadius,
|
|
64
|
+
borderStyle,
|
|
65
|
+
height,
|
|
66
|
+
padding,
|
|
67
|
+
paddingHorizontal,
|
|
68
|
+
paddingVertical,
|
|
69
|
+
margin,
|
|
70
|
+
marginTop,
|
|
71
|
+
marginBottom,
|
|
72
|
+
marginLeft,
|
|
73
|
+
marginRight,
|
|
74
|
+
flexDirection,
|
|
75
|
+
alignItems,
|
|
76
|
+
justifyContent,
|
|
77
|
+
position,
|
|
78
|
+
top,
|
|
79
|
+
bottom,
|
|
80
|
+
left,
|
|
81
|
+
right,
|
|
82
|
+
width,
|
|
83
|
+
minWidth,
|
|
84
|
+
minHeight,
|
|
85
|
+
maxWidth,
|
|
86
|
+
maxHeight,
|
|
87
|
+
flex,
|
|
88
|
+
overflow,
|
|
89
|
+
zIndex,
|
|
90
|
+
hoverStyle,
|
|
91
|
+
pressStyle,
|
|
92
|
+
style,
|
|
93
|
+
"data-testid": dataTestId,
|
|
94
|
+
testID,
|
|
95
|
+
as,
|
|
96
|
+
src,
|
|
97
|
+
alt,
|
|
98
|
+
...rest
|
|
99
|
+
}) => {
|
|
100
|
+
const getContainerStyle = (pressed) => ({
|
|
101
|
+
backgroundColor: pressed && pressStyle?.backgroundColor ? pressStyle.backgroundColor : backgroundColor,
|
|
102
|
+
borderColor,
|
|
103
|
+
borderWidth,
|
|
104
|
+
borderBottomWidth,
|
|
105
|
+
borderBottomColor,
|
|
106
|
+
borderTopWidth,
|
|
107
|
+
borderTopColor,
|
|
108
|
+
borderLeftWidth,
|
|
109
|
+
borderLeftColor,
|
|
110
|
+
borderRightWidth,
|
|
111
|
+
borderRightColor,
|
|
112
|
+
borderRadius,
|
|
113
|
+
borderStyle,
|
|
114
|
+
overflow,
|
|
115
|
+
zIndex,
|
|
116
|
+
height,
|
|
117
|
+
width,
|
|
118
|
+
minWidth,
|
|
119
|
+
minHeight,
|
|
120
|
+
maxWidth,
|
|
121
|
+
maxHeight,
|
|
122
|
+
padding,
|
|
123
|
+
paddingHorizontal,
|
|
124
|
+
paddingVertical,
|
|
125
|
+
margin,
|
|
126
|
+
marginTop,
|
|
127
|
+
marginBottom,
|
|
128
|
+
marginLeft,
|
|
129
|
+
marginRight,
|
|
130
|
+
flexDirection,
|
|
131
|
+
alignItems,
|
|
132
|
+
justifyContent,
|
|
133
|
+
position,
|
|
134
|
+
top,
|
|
135
|
+
bottom,
|
|
136
|
+
left,
|
|
137
|
+
right,
|
|
138
|
+
flex,
|
|
139
|
+
...style
|
|
140
|
+
});
|
|
141
|
+
const finalTestID = dataTestId || testID;
|
|
142
|
+
const {
|
|
143
|
+
role,
|
|
144
|
+
tabIndex,
|
|
145
|
+
onKeyDown,
|
|
146
|
+
onKeyUp,
|
|
147
|
+
"aria-label": _ariaLabel,
|
|
148
|
+
"aria-labelledby": _ariaLabelledBy,
|
|
149
|
+
"aria-current": _ariaCurrent,
|
|
150
|
+
"aria-disabled": _ariaDisabled,
|
|
151
|
+
"aria-live": _ariaLive,
|
|
152
|
+
className,
|
|
153
|
+
"data-testid": _dataTestId,
|
|
154
|
+
...nativeRest
|
|
155
|
+
} = rest;
|
|
156
|
+
if (as === "img" && src) {
|
|
157
|
+
const imageStyle = {
|
|
158
|
+
width,
|
|
159
|
+
height,
|
|
160
|
+
borderRadius,
|
|
161
|
+
position,
|
|
162
|
+
top,
|
|
163
|
+
bottom,
|
|
164
|
+
left,
|
|
165
|
+
right,
|
|
166
|
+
...style
|
|
167
|
+
};
|
|
168
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
169
|
+
import_react_native.Image,
|
|
170
|
+
{
|
|
171
|
+
source: { uri: src },
|
|
172
|
+
style: imageStyle,
|
|
173
|
+
testID: finalTestID,
|
|
174
|
+
resizeMode: "cover",
|
|
175
|
+
...nativeRest
|
|
176
|
+
}
|
|
177
|
+
);
|
|
178
|
+
}
|
|
179
|
+
if (onPress) {
|
|
180
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
181
|
+
import_react_native.Pressable,
|
|
182
|
+
{
|
|
183
|
+
onPress,
|
|
184
|
+
onLayout,
|
|
185
|
+
onMoveShouldSetResponder,
|
|
186
|
+
onResponderGrant,
|
|
187
|
+
onResponderMove,
|
|
188
|
+
onResponderRelease,
|
|
189
|
+
onResponderTerminate,
|
|
190
|
+
style: ({ pressed }) => getContainerStyle(pressed),
|
|
191
|
+
testID: finalTestID,
|
|
192
|
+
...nativeRest,
|
|
193
|
+
children
|
|
194
|
+
}
|
|
195
|
+
);
|
|
196
|
+
}
|
|
197
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
198
|
+
import_react_native.View,
|
|
199
|
+
{
|
|
200
|
+
style: getContainerStyle(),
|
|
201
|
+
testID: finalTestID,
|
|
202
|
+
onLayout,
|
|
203
|
+
onMoveShouldSetResponder,
|
|
204
|
+
onResponderGrant,
|
|
205
|
+
onResponderMove,
|
|
206
|
+
onResponderRelease,
|
|
207
|
+
onResponderTerminate,
|
|
208
|
+
...nativeRest,
|
|
209
|
+
children
|
|
210
|
+
}
|
|
211
|
+
);
|
|
212
|
+
};
|
|
213
|
+
|
|
214
|
+
// ../../foundation/primitives-native/src/Text.tsx
|
|
215
|
+
var import_react_native2 = require("react-native");
|
|
216
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
217
|
+
var roleMap = {
|
|
218
|
+
alert: "alert",
|
|
219
|
+
heading: "header",
|
|
220
|
+
button: "button",
|
|
221
|
+
link: "link",
|
|
222
|
+
text: "text"
|
|
223
|
+
};
|
|
224
|
+
var parseNumericValue = (value) => {
|
|
225
|
+
if (value === void 0) return void 0;
|
|
226
|
+
if (typeof value === "number") return value;
|
|
227
|
+
const parsed = parseFloat(value);
|
|
228
|
+
return isNaN(parsed) ? void 0 : parsed;
|
|
229
|
+
};
|
|
230
|
+
var Text = ({
|
|
231
|
+
children,
|
|
232
|
+
color,
|
|
233
|
+
fontSize,
|
|
234
|
+
fontWeight,
|
|
235
|
+
fontFamily,
|
|
236
|
+
textAlign,
|
|
237
|
+
lineHeight,
|
|
238
|
+
numberOfLines,
|
|
239
|
+
id,
|
|
240
|
+
role,
|
|
241
|
+
style: styleProp,
|
|
242
|
+
...props
|
|
243
|
+
}) => {
|
|
244
|
+
let resolvedFontFamily = fontFamily ? fontFamily.split(",")[0].replace(/['"]/g, "").trim() : void 0;
|
|
245
|
+
if (resolvedFontFamily === "Pilat Wide" || resolvedFontFamily === "Pilat Wide Bold" || resolvedFontFamily === "Aktiv Grotesk") {
|
|
246
|
+
resolvedFontFamily = void 0;
|
|
247
|
+
}
|
|
248
|
+
const incomingStyle = import_react_native2.StyleSheet.flatten(styleProp);
|
|
249
|
+
const baseStyle = {
|
|
250
|
+
color: color ?? incomingStyle?.color,
|
|
251
|
+
fontSize: typeof fontSize === "number" ? fontSize : void 0,
|
|
252
|
+
fontWeight,
|
|
253
|
+
fontFamily: resolvedFontFamily,
|
|
254
|
+
textDecorationLine: props.textDecoration,
|
|
255
|
+
textAlign: textAlign ?? incomingStyle?.textAlign,
|
|
256
|
+
lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),
|
|
257
|
+
marginTop: parseNumericValue(
|
|
258
|
+
incomingStyle?.marginTop
|
|
259
|
+
),
|
|
260
|
+
marginBottom: parseNumericValue(
|
|
261
|
+
incomingStyle?.marginBottom
|
|
262
|
+
)
|
|
263
|
+
};
|
|
264
|
+
const accessibilityRole = role ? roleMap[role] : void 0;
|
|
265
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
266
|
+
import_react_native2.Text,
|
|
267
|
+
{
|
|
268
|
+
style: baseStyle,
|
|
269
|
+
numberOfLines,
|
|
270
|
+
testID: id,
|
|
271
|
+
accessibilityRole,
|
|
272
|
+
children
|
|
273
|
+
}
|
|
274
|
+
);
|
|
275
|
+
};
|
|
276
|
+
|
|
277
|
+
// ../../foundation/primitives-native/src/Icon.tsx
|
|
278
|
+
var import_react = __toESM(require("react"));
|
|
279
|
+
var import_react_native3 = require("react-native");
|
|
280
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
281
|
+
var Icon = ({ children, color, size }) => {
|
|
282
|
+
const style = {
|
|
283
|
+
width: typeof size === "number" ? size : void 0,
|
|
284
|
+
height: typeof size === "number" ? size : void 0,
|
|
285
|
+
alignItems: "center",
|
|
286
|
+
justifyContent: "center"
|
|
287
|
+
};
|
|
288
|
+
const childrenWithProps = import_react.default.Children.map(children, (child) => {
|
|
289
|
+
if (import_react.default.isValidElement(child)) {
|
|
290
|
+
return import_react.default.cloneElement(child, {
|
|
291
|
+
color: child.props.color || color,
|
|
292
|
+
// Also pass size if child seems to be an icon that needs it
|
|
293
|
+
size: child.props.size || size
|
|
294
|
+
});
|
|
295
|
+
}
|
|
296
|
+
return child;
|
|
297
|
+
});
|
|
298
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_native3.View, { style, children: childrenWithProps });
|
|
299
|
+
};
|
|
300
|
+
|
|
301
|
+
// src/Collapsible.tsx
|
|
302
|
+
var import_xui_core = require("@xsolla/xui-core");
|
|
303
|
+
var import_xui_icons_base = require("@xsolla/xui-icons-base");
|
|
304
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
305
|
+
var PANEL_TRANSITION = "grid-template-rows 280ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
306
|
+
var CHEVRON_TRANSITION = "transform 280ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
307
|
+
var Collapsible = (0, import_react2.forwardRef)(
|
|
308
|
+
({
|
|
309
|
+
title,
|
|
310
|
+
caption: captionProp,
|
|
311
|
+
icon,
|
|
312
|
+
trailing: trailingProp,
|
|
313
|
+
view = "without-surface",
|
|
314
|
+
open: openProp,
|
|
315
|
+
defaultOpen = false,
|
|
316
|
+
onOpenChange,
|
|
317
|
+
children,
|
|
318
|
+
className,
|
|
319
|
+
"aria-label": ariaLabel,
|
|
320
|
+
themeMode,
|
|
321
|
+
themeProductContext,
|
|
322
|
+
// deprecated aliases
|
|
323
|
+
onChange,
|
|
324
|
+
statusIcon,
|
|
325
|
+
description,
|
|
326
|
+
...rest
|
|
327
|
+
}, ref) => {
|
|
328
|
+
const caption = captionProp ?? description;
|
|
329
|
+
const trailing = trailingProp ?? statusIcon;
|
|
330
|
+
const resolvedOnOpenChange = onOpenChange ?? onChange;
|
|
331
|
+
const panelIdRef = (0, import_react2.useRef)();
|
|
332
|
+
if (!panelIdRef.current) {
|
|
333
|
+
panelIdRef.current = `collapsible-panel-${Math.random().toString(36).slice(2, 10)}`;
|
|
334
|
+
}
|
|
335
|
+
const panelId = panelIdRef.current;
|
|
336
|
+
const { theme } = (0, import_xui_core.useResolvedTheme)({ themeMode, themeProductContext });
|
|
337
|
+
const sizing = theme.sizing.collapsibleB2b();
|
|
338
|
+
const isControlled = openProp !== void 0;
|
|
339
|
+
const [openState, setOpenState] = (0, import_react2.useState)(defaultOpen);
|
|
340
|
+
const open = isControlled ? openProp : openState;
|
|
341
|
+
const handleToggle = (0, import_react2.useCallback)(() => {
|
|
342
|
+
const next = !open;
|
|
343
|
+
if (!isControlled) setOpenState(next);
|
|
344
|
+
resolvedOnOpenChange?.(next);
|
|
345
|
+
}, [open, isControlled, resolvedOnOpenChange]);
|
|
346
|
+
const handleKeyDown = (0, import_react2.useCallback)(
|
|
347
|
+
(e) => {
|
|
348
|
+
if (e.key === "Enter") {
|
|
349
|
+
e.preventDefault();
|
|
350
|
+
handleToggle();
|
|
351
|
+
} else if (e.key === " ") {
|
|
352
|
+
e.preventDefault();
|
|
353
|
+
}
|
|
354
|
+
},
|
|
355
|
+
[handleToggle]
|
|
356
|
+
);
|
|
357
|
+
const handleKeyUp = (0, import_react2.useCallback)(
|
|
358
|
+
(e) => {
|
|
359
|
+
if (e.key === " ") {
|
|
360
|
+
e.preventDefault();
|
|
361
|
+
handleToggle();
|
|
362
|
+
}
|
|
363
|
+
},
|
|
364
|
+
[handleToggle]
|
|
365
|
+
);
|
|
366
|
+
const isWhite = view === "white-surface";
|
|
367
|
+
const isGrey = view === "grey-surface";
|
|
368
|
+
const isWithout = view === "without-surface";
|
|
369
|
+
const rootStyle = {
|
|
370
|
+
boxSizing: "border-box",
|
|
371
|
+
display: "flex",
|
|
372
|
+
flexDirection: "column",
|
|
373
|
+
overflow: "hidden",
|
|
374
|
+
backgroundColor: isWhite ? theme.colors.background.primary : isGrey ? theme.colors.overlay.mono : void 0,
|
|
375
|
+
borderRadius: !isWithout ? sizing.surfaceRadius : void 0,
|
|
376
|
+
borderBottom: isWithout ? `1px solid ${theme.colors.border.secondary}` : void 0
|
|
377
|
+
};
|
|
378
|
+
const cellStyle = {
|
|
379
|
+
boxSizing: "border-box",
|
|
380
|
+
display: "flex",
|
|
381
|
+
flexDirection: "row",
|
|
382
|
+
alignItems: "center",
|
|
383
|
+
gap: sizing.triggerGap,
|
|
384
|
+
width: "100%",
|
|
385
|
+
minHeight: isWithout ? sizing.triggerMinHeight : void 0,
|
|
386
|
+
padding: !isWithout ? sizing.triggerPadding : 0,
|
|
387
|
+
backgroundColor: isWhite ? theme.colors.background.primary : isGrey ? theme.colors.overlay.mono : void 0,
|
|
388
|
+
borderRadius: !isWithout ? open ? `${sizing.cellRadius}px ${sizing.cellRadius}px 0 0` : sizing.cellRadius : void 0,
|
|
389
|
+
borderBottom: open ? `1px solid ${theme.colors.border.secondary}` : void 0
|
|
390
|
+
};
|
|
391
|
+
const panelGridStyle = {
|
|
392
|
+
display: "grid",
|
|
393
|
+
gridTemplateRows: open ? "1fr" : "0fr",
|
|
394
|
+
transition: PANEL_TRANSITION,
|
|
395
|
+
width: "100%"
|
|
396
|
+
};
|
|
397
|
+
const panelInnerStyle = {
|
|
398
|
+
overflow: "hidden"
|
|
399
|
+
};
|
|
400
|
+
const panelContentStyle = {
|
|
401
|
+
boxSizing: "border-box",
|
|
402
|
+
width: "100%",
|
|
403
|
+
padding: sizing.panelPadding
|
|
404
|
+
};
|
|
405
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
406
|
+
Box,
|
|
407
|
+
{
|
|
408
|
+
ref,
|
|
409
|
+
"data-testid": "collapsible",
|
|
410
|
+
"data-open": open,
|
|
411
|
+
className,
|
|
412
|
+
width: "100%",
|
|
413
|
+
style: rootStyle,
|
|
414
|
+
...rest,
|
|
415
|
+
children: [
|
|
416
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
417
|
+
"div",
|
|
418
|
+
{
|
|
419
|
+
role: "button",
|
|
420
|
+
tabIndex: 0,
|
|
421
|
+
"aria-expanded": open,
|
|
422
|
+
"aria-controls": panelId,
|
|
423
|
+
"aria-label": ariaLabel ?? (typeof title === "string" ? title : void 0),
|
|
424
|
+
onClick: handleToggle,
|
|
425
|
+
onKeyDown: handleKeyDown,
|
|
426
|
+
onKeyUp: handleKeyUp,
|
|
427
|
+
style: { boxSizing: "border-box", width: "100%", cursor: "pointer" },
|
|
428
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { style: cellStyle, children: [
|
|
429
|
+
icon && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
430
|
+
"div",
|
|
431
|
+
{
|
|
432
|
+
onClick: (e) => e.stopPropagation(),
|
|
433
|
+
onKeyDown: (e) => e.stopPropagation(),
|
|
434
|
+
onKeyUp: (e) => e.stopPropagation(),
|
|
435
|
+
style: { flexShrink: 0, display: "flex", alignItems: "center" },
|
|
436
|
+
children: icon
|
|
437
|
+
}
|
|
438
|
+
),
|
|
439
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
440
|
+
"div",
|
|
441
|
+
{
|
|
442
|
+
style: {
|
|
443
|
+
flex: 1,
|
|
444
|
+
display: "flex",
|
|
445
|
+
flexDirection: "column",
|
|
446
|
+
alignItems: "flex-start",
|
|
447
|
+
gap: sizing.textGap,
|
|
448
|
+
minWidth: 0
|
|
449
|
+
},
|
|
450
|
+
children: [
|
|
451
|
+
typeof title === "string" || typeof title === "number" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
452
|
+
Text,
|
|
453
|
+
{
|
|
454
|
+
color: theme.colors.content.primary,
|
|
455
|
+
fontSize: sizing.titleFontSize,
|
|
456
|
+
lineHeight: sizing.titleLineHeight,
|
|
457
|
+
fontWeight: "500",
|
|
458
|
+
children: title
|
|
459
|
+
}
|
|
460
|
+
) : title,
|
|
461
|
+
caption !== void 0 && (typeof caption === "string" || typeof caption === "number" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
462
|
+
Text,
|
|
463
|
+
{
|
|
464
|
+
color: theme.colors.content.tertiary,
|
|
465
|
+
fontSize: sizing.captionFontSize,
|
|
466
|
+
lineHeight: sizing.captionLineHeight,
|
|
467
|
+
fontWeight: "400",
|
|
468
|
+
children: caption
|
|
469
|
+
}
|
|
470
|
+
) : caption)
|
|
471
|
+
]
|
|
472
|
+
}
|
|
473
|
+
),
|
|
474
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
475
|
+
"div",
|
|
476
|
+
{
|
|
477
|
+
style: {
|
|
478
|
+
display: "flex",
|
|
479
|
+
flexDirection: "row",
|
|
480
|
+
alignItems: "center",
|
|
481
|
+
gap: sizing.trailingGap,
|
|
482
|
+
flexShrink: 0
|
|
483
|
+
},
|
|
484
|
+
children: [
|
|
485
|
+
trailing && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
486
|
+
"div",
|
|
487
|
+
{
|
|
488
|
+
onClick: (e) => e.stopPropagation(),
|
|
489
|
+
onKeyDown: (e) => e.stopPropagation(),
|
|
490
|
+
onKeyUp: (e) => e.stopPropagation(),
|
|
491
|
+
style: { display: "flex", alignItems: "center" },
|
|
492
|
+
children: trailing
|
|
493
|
+
}
|
|
494
|
+
),
|
|
495
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
496
|
+
"div",
|
|
497
|
+
{
|
|
498
|
+
style: {
|
|
499
|
+
transform: open ? "rotate(180deg)" : "rotate(0deg)",
|
|
500
|
+
transition: CHEVRON_TRANSITION,
|
|
501
|
+
display: "flex",
|
|
502
|
+
alignItems: "center"
|
|
503
|
+
},
|
|
504
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
505
|
+
Icon,
|
|
506
|
+
{
|
|
507
|
+
color: theme.colors.content.primary,
|
|
508
|
+
size: sizing.chevronSize,
|
|
509
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_xui_icons_base.ChevronDown, {})
|
|
510
|
+
}
|
|
511
|
+
)
|
|
512
|
+
}
|
|
513
|
+
)
|
|
514
|
+
]
|
|
515
|
+
}
|
|
516
|
+
)
|
|
517
|
+
] })
|
|
518
|
+
}
|
|
519
|
+
),
|
|
520
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { id: panelId, style: panelGridStyle, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { style: panelInnerStyle, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { style: panelContentStyle, children }) }) })
|
|
521
|
+
]
|
|
522
|
+
}
|
|
523
|
+
);
|
|
524
|
+
}
|
|
525
|
+
);
|
|
526
|
+
Collapsible.displayName = "Collapsible";
|
|
527
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
528
|
+
0 && (module.exports = {
|
|
529
|
+
Collapsible
|
|
530
|
+
});
|
|
531
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/index.tsx","../../src/Collapsible.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx","../../../../foundation/primitives-native/src/Icon.tsx"],"sourcesContent":["export { Collapsible } from \"./Collapsible\";\nexport type { CollapsibleProps, CollapsibleView } from \"./types\";\n","import { forwardRef, useState, useCallback, useRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme } from \"@xsolla/xui-core\";\nimport { ChevronDown, ChevronUp } from \"@xsolla/xui-icons-base\";\nimport type { CollapsibleProps } from \"./types\";\n\nconst PANEL_TRANSITION =\n \"grid-template-rows 280ms cubic-bezier(0.4, 0, 0.2, 1)\";\nconst CHEVRON_TRANSITION = \"transform 280ms cubic-bezier(0.4, 0, 0.2, 1)\";\n\nexport const Collapsible = forwardRef<HTMLDivElement, CollapsibleProps>(\n (\n {\n title,\n caption: captionProp,\n icon,\n trailing: trailingProp,\n view = \"without-surface\",\n open: openProp,\n defaultOpen = false,\n onOpenChange,\n children,\n className,\n \"aria-label\": ariaLabel,\n themeMode,\n themeProductContext,\n // deprecated aliases\n onChange,\n statusIcon,\n description,\n ...rest\n },\n ref\n ) => {\n const caption = captionProp ?? description;\n const trailing = trailingProp ?? statusIcon;\n const resolvedOnOpenChange = onOpenChange ?? onChange;\n\n // Stable panel ID — React 16 compatible (no useId)\n const panelIdRef = useRef<string>();\n if (!panelIdRef.current) {\n panelIdRef.current = `collapsible-panel-${Math.random().toString(36).slice(2, 10)}`;\n }\n const panelId = panelIdRef.current;\n\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const sizing = theme.sizing.collapsibleB2b();\n\n const isControlled = openProp !== undefined;\n const [openState, setOpenState] = useState(defaultOpen);\n const open = isControlled ? openProp! : openState;\n\n const handleToggle = useCallback(() => {\n const next = !open;\n if (!isControlled) setOpenState(next);\n resolvedOnOpenChange?.(next);\n }, [open, isControlled, resolvedOnOpenChange]);\n\n const handleKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n if (e.key === \"Enter\") {\n e.preventDefault();\n handleToggle();\n } else if (e.key === \" \") {\n e.preventDefault();\n }\n },\n [handleToggle]\n );\n\n const handleKeyUp = useCallback(\n (e: React.KeyboardEvent) => {\n if (e.key === \" \") {\n e.preventDefault();\n handleToggle();\n }\n },\n [handleToggle]\n );\n\n const isWhite = view === \"white-surface\";\n const isGrey = view === \"grey-surface\";\n const isWithout = view === \"without-surface\";\n\n // Root is always column — avoids flex-direction flip that breaks width\n const rootStyle: React.CSSProperties = {\n boxSizing: \"border-box\",\n display: \"flex\",\n flexDirection: \"column\",\n overflow: \"hidden\",\n backgroundColor: isWhite\n ? theme.colors.background.primary\n : isGrey\n ? theme.colors.overlay.mono\n : undefined,\n borderRadius: !isWithout ? sizing.surfaceRadius : undefined,\n borderBottom: isWithout\n ? `1px solid ${theme.colors.border.secondary}`\n : undefined,\n };\n\n const cellStyle: React.CSSProperties = {\n boxSizing: \"border-box\",\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n gap: sizing.triggerGap,\n width: \"100%\",\n minHeight: isWithout ? sizing.triggerMinHeight : undefined,\n padding: !isWithout ? sizing.triggerPadding : 0,\n backgroundColor: isWhite\n ? theme.colors.background.primary\n : isGrey\n ? theme.colors.overlay.mono\n : undefined,\n borderRadius: !isWithout\n ? open\n ? `${sizing.cellRadius}px ${sizing.cellRadius}px 0 0`\n : sizing.cellRadius\n : undefined,\n borderBottom: open\n ? `1px solid ${theme.colors.border.secondary}`\n : undefined,\n };\n\n // grid-template-rows trick: 0fr (collapsed) ↔ 1fr (expanded)\n // The inner div has overflow:hidden so content is clipped during transition\n const panelGridStyle: React.CSSProperties = {\n display: \"grid\",\n gridTemplateRows: open ? \"1fr\" : \"0fr\",\n transition: PANEL_TRANSITION,\n width: \"100%\",\n };\n\n const panelInnerStyle: React.CSSProperties = {\n overflow: \"hidden\",\n };\n\n const panelContentStyle: React.CSSProperties = {\n boxSizing: \"border-box\",\n width: \"100%\",\n padding: sizing.panelPadding,\n };\n\n return (\n <Box\n ref={ref}\n data-testid=\"collapsible\"\n data-open={open}\n className={className}\n width=\"100%\"\n style={rootStyle}\n {...rest}\n >\n {/* Trigger */}\n <div\n role=\"button\"\n tabIndex={0}\n aria-expanded={open}\n aria-controls={panelId}\n aria-label={\n ariaLabel ?? (typeof title === \"string\" ? title : undefined)\n }\n onClick={handleToggle}\n onKeyDown={handleKeyDown}\n onKeyUp={handleKeyUp}\n style={{ boxSizing: \"border-box\", width: \"100%\", cursor: \"pointer\" }}\n >\n <div style={cellStyle}>\n {/* Left icon slot — consumer is responsible for icon/checkbox styling */}\n {icon && (\n <div\n onClick={(e) => e.stopPropagation()}\n onKeyDown={(e) => e.stopPropagation()}\n onKeyUp={(e) => e.stopPropagation()}\n style={{ flexShrink: 0, display: \"flex\", alignItems: \"center\" }}\n >\n {icon}\n </div>\n )}\n\n {/* Title + caption */}\n <div\n style={{\n flex: 1,\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"flex-start\",\n gap: sizing.textGap,\n minWidth: 0,\n }}\n >\n {typeof title === \"string\" || typeof title === \"number\" ? (\n <Text\n color={theme.colors.content.primary}\n fontSize={sizing.titleFontSize}\n lineHeight={sizing.titleLineHeight}\n fontWeight=\"500\"\n >\n {title}\n </Text>\n ) : (\n title\n )}\n {caption !== undefined &&\n (typeof caption === \"string\" || typeof caption === \"number\" ? (\n <Text\n color={theme.colors.content.tertiary}\n fontSize={sizing.captionFontSize}\n lineHeight={sizing.captionLineHeight}\n fontWeight=\"400\"\n >\n {caption}\n </Text>\n ) : (\n caption\n ))}\n </div>\n\n {/* Trailing slot + animated chevron */}\n <div\n style={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n gap: sizing.trailingGap,\n flexShrink: 0,\n }}\n >\n {trailing && (\n <div\n onClick={(e) => e.stopPropagation()}\n onKeyDown={(e) => e.stopPropagation()}\n onKeyUp={(e) => e.stopPropagation()}\n style={{ display: \"flex\", alignItems: \"center\" }}\n >\n {trailing}\n </div>\n )}\n <div\n style={{\n transform: open ? \"rotate(180deg)\" : \"rotate(0deg)\",\n transition: CHEVRON_TRANSITION,\n display: \"flex\",\n alignItems: \"center\",\n }}\n >\n <Icon\n color={theme.colors.content.primary}\n size={sizing.chevronSize}\n >\n <ChevronDown />\n </Icon>\n </div>\n </div>\n </div>\n </div>\n\n {/* Animated panel using grid-template-rows trick */}\n <div id={panelId} style={panelGridStyle}>\n <div style={panelInnerStyle}>\n <div style={panelContentStyle}>{children}</div>\n </div>\n </div>\n </Box>\n );\n }\n);\n\nCollapsible.displayName = \"Collapsible\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n flexDirection,\n alignItems,\n justifyContent,\n position,\n top,\n bottom,\n left,\n right,\n width,\n minWidth,\n minHeight,\n maxWidth,\n maxHeight,\n flex,\n overflow,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n minWidth: minWidth as DimensionValue,\n minHeight: minHeight as DimensionValue,\n maxWidth: maxWidth as DimensionValue,\n maxHeight: maxHeight as DimensionValue,\n padding: padding as DimensionValue,\n paddingHorizontal: paddingHorizontal as DimensionValue,\n paddingVertical: paddingVertical as DimensionValue,\n margin: margin as DimensionValue,\n marginTop: marginTop as DimensionValue,\n marginBottom: marginBottom as DimensionValue,\n marginLeft: marginLeft as DimensionValue,\n marginRight: marginRight as DimensionValue,\n flexDirection,\n alignItems,\n justifyContent,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Destructure and drop web-only props from rest before passing to RN components\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": _ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": _ariaDisabled,\n \"aria-live\": _ariaLive,\n className,\n \"data-testid\": _dataTestId,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n if (onPress) {\n return (\n <Pressable\n onPress={onPress}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\n","import React from \"react\";\nimport {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string | number | undefined\n): number | undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n style: styleProp,\n ...props\n}) => {\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n if (\n resolvedFontFamily === \"Pilat Wide\" ||\n resolvedFontFamily === \"Pilat Wide Bold\" ||\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const incomingStyle = StyleSheet.flatten(styleProp) as TextStyle | undefined;\n\n const baseStyle: TextStyle = {\n color: color ?? incomingStyle?.color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n textAlign: textAlign ?? incomingStyle?.textAlign,\n lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),\n marginTop: parseNumericValue(\n incomingStyle?.marginTop as number | string | undefined\n ),\n marginBottom: parseNumericValue(\n incomingStyle?.marginBottom as number | string | undefined\n ),\n };\n\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText\n style={baseStyle}\n numberOfLines={numberOfLines}\n testID={id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","import React from \"react\";\nimport { View, ViewStyle } from \"react-native\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Icon: React.FC<IconProps> = ({ children, color, size }) => {\n const style: ViewStyle = {\n width: typeof size === \"number\" ? size : undefined,\n height: typeof size === \"number\" ? size : undefined,\n alignItems: \"center\",\n justifyContent: \"center\",\n };\n\n // On native, we try to pass the color down to children (like Text primitives)\n // to mimic the CSS inheritance behavior of the web version.\n const childrenWithProps = React.Children.map(children, (child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n color: child.props.color || color,\n // Also pass size if child seems to be an icon that needs it\n size: child.props.size || size,\n });\n }\n return child;\n });\n\n return <View style={style}>{childrenWithProps}</View>;\n};\n"],"mappings":"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","names":["import_react","import_react_native","import_jsx_runtime","RNText","import_react_native","import_jsx_runtime","React","import_jsx_runtime"]}
|