@xsolla/xui-status-web 0.64.0-pr56.1768348754

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/index.d.mts ADDED
@@ -0,0 +1,32 @@
1
+ import React, { ReactNode } from 'react';
2
+ import { BoxProps } from '@xsolla/xui-primitives-core';
3
+
4
+ type LabelType = "primary" | "dot-color";
5
+ type DotSize = "sm" | "md" | "lg";
6
+ type StatusPalette = "default" | "success" | "warning" | "alert" | "neutral";
7
+ interface StatusProps extends Omit<BoxProps, "size"> {
8
+ /**
9
+ * Property to specify the content of the status.
10
+ */
11
+ children?: ReactNode;
12
+ /**
13
+ * Property to specify the label of the group.
14
+ */
15
+ size?: DotSize;
16
+ /**
17
+ * Status palette (color)
18
+ */
19
+ palette?: StatusPalette;
20
+ /**
21
+ * Label color
22
+ */
23
+ labelType?: LabelType;
24
+ /**
25
+ * Whether to uppercase the label text
26
+ */
27
+ uppercase?: boolean;
28
+ }
29
+
30
+ declare const Status: React.ForwardRefExoticComponent<StatusProps & React.RefAttributes<any>>;
31
+
32
+ export { type DotSize, type LabelType, Status, type StatusPalette, type StatusProps };
package/index.d.ts ADDED
@@ -0,0 +1,32 @@
1
+ import React, { ReactNode } from 'react';
2
+ import { BoxProps } from '@xsolla/xui-primitives-core';
3
+
4
+ type LabelType = "primary" | "dot-color";
5
+ type DotSize = "sm" | "md" | "lg";
6
+ type StatusPalette = "default" | "success" | "warning" | "alert" | "neutral";
7
+ interface StatusProps extends Omit<BoxProps, "size"> {
8
+ /**
9
+ * Property to specify the content of the status.
10
+ */
11
+ children?: ReactNode;
12
+ /**
13
+ * Property to specify the label of the group.
14
+ */
15
+ size?: DotSize;
16
+ /**
17
+ * Status palette (color)
18
+ */
19
+ palette?: StatusPalette;
20
+ /**
21
+ * Label color
22
+ */
23
+ labelType?: LabelType;
24
+ /**
25
+ * Whether to uppercase the label text
26
+ */
27
+ uppercase?: boolean;
28
+ }
29
+
30
+ declare const Status: React.ForwardRefExoticComponent<StatusProps & React.RefAttributes<any>>;
31
+
32
+ export { type DotSize, type LabelType, Status, type StatusPalette, type StatusProps };
package/index.js ADDED
@@ -0,0 +1,569 @@
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
+ Status: () => Status
34
+ });
35
+ module.exports = __toCommonJS(index_exports);
36
+
37
+ // src/Status.tsx
38
+ var import_react4 = require("react");
39
+
40
+ // ../primitives-web/src/Box.tsx
41
+ var import_react = __toESM(require("react"));
42
+ var import_styled_components = __toESM(require("styled-components"));
43
+ var import_jsx_runtime = require("react/jsx-runtime");
44
+ var StyledBox = import_styled_components.default.div`
45
+ display: flex;
46
+ box-sizing: border-box;
47
+ background-color: ${(props) => props.backgroundColor || "transparent"};
48
+ border-color: ${(props) => props.borderColor || "transparent"};
49
+ border-width: ${(props) => typeof props.borderWidth === "number" ? `${props.borderWidth}px` : props.borderWidth || 0};
50
+
51
+ ${(props) => props.borderBottomWidth !== void 0 && `
52
+ border-bottom-width: ${typeof props.borderBottomWidth === "number" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};
53
+ border-bottom-color: ${props.borderBottomColor || props.borderColor || "transparent"};
54
+ border-bottom-style: solid;
55
+ `}
56
+ ${(props) => props.borderTopWidth !== void 0 && `
57
+ border-top-width: ${typeof props.borderTopWidth === "number" ? `${props.borderTopWidth}px` : props.borderTopWidth};
58
+ border-top-color: ${props.borderTopColor || props.borderColor || "transparent"};
59
+ border-top-style: solid;
60
+ `}
61
+ ${(props) => props.borderLeftWidth !== void 0 && `
62
+ border-left-width: ${typeof props.borderLeftWidth === "number" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};
63
+ border-left-color: ${props.borderLeftColor || props.borderColor || "transparent"};
64
+ border-left-style: solid;
65
+ `}
66
+ ${(props) => props.borderRightWidth !== void 0 && `
67
+ border-right-width: ${typeof props.borderRightWidth === "number" ? `${props.borderRightWidth}px` : props.borderRightWidth};
68
+ border-right-color: ${props.borderRightColor || props.borderColor || "transparent"};
69
+ border-right-style: solid;
70
+ `}
71
+
72
+ border-style: ${(props) => props.borderStyle || (props.borderWidth || props.borderBottomWidth || props.borderTopWidth || props.borderLeftWidth || props.borderRightWidth ? "solid" : "none")};
73
+ border-radius: ${(props) => typeof props.borderRadius === "number" ? `${props.borderRadius}px` : props.borderRadius || 0};
74
+ height: ${(props) => typeof props.height === "number" ? `${props.height}px` : props.height || "auto"};
75
+ width: ${(props) => typeof props.width === "number" ? `${props.width}px` : props.width || "auto"};
76
+ min-width: ${(props) => typeof props.minWidth === "number" ? `${props.minWidth}px` : props.minWidth || "auto"};
77
+ min-height: ${(props) => typeof props.minHeight === "number" ? `${props.minHeight}px` : props.minHeight || "auto"};
78
+
79
+ padding: ${(props) => typeof props.padding === "number" ? `${props.padding}px` : props.padding || 0};
80
+ ${(props) => props.paddingHorizontal && `
81
+ padding-left: ${typeof props.paddingHorizontal === "number" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};
82
+ padding-right: ${typeof props.paddingHorizontal === "number" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};
83
+ `}
84
+ ${(props) => props.paddingVertical && `
85
+ padding-top: ${typeof props.paddingVertical === "number" ? `${props.paddingVertical}px` : props.paddingVertical};
86
+ padding-bottom: ${typeof props.paddingVertical === "number" ? `${props.paddingVertical}px` : props.paddingVertical};
87
+ `}
88
+ ${(props) => props.paddingTop !== void 0 && `padding-top: ${typeof props.paddingTop === "number" ? `${props.paddingTop}px` : props.paddingTop};`}
89
+ ${(props) => props.paddingBottom !== void 0 && `padding-bottom: ${typeof props.paddingBottom === "number" ? `${props.paddingBottom}px` : props.paddingBottom};`}
90
+ ${(props) => props.paddingLeft !== void 0 && `padding-left: ${typeof props.paddingLeft === "number" ? `${props.paddingLeft}px` : props.paddingLeft};`}
91
+ ${(props) => props.paddingRight !== void 0 && `padding-right: ${typeof props.paddingRight === "number" ? `${props.paddingRight}px` : props.paddingRight};`}
92
+
93
+ margin: ${(props) => typeof props.margin === "number" ? `${props.margin}px` : props.margin || 0};
94
+ ${(props) => props.marginTop !== void 0 && `margin-top: ${typeof props.marginTop === "number" ? `${props.marginTop}px` : props.marginTop};`}
95
+ ${(props) => props.marginBottom !== void 0 && `margin-bottom: ${typeof props.marginBottom === "number" ? `${props.marginBottom}px` : props.marginBottom};`}
96
+ ${(props) => props.marginLeft !== void 0 && `margin-left: ${typeof props.marginLeft === "number" ? `${props.marginLeft}px` : props.marginLeft};`}
97
+ ${(props) => props.marginRight !== void 0 && `margin-right: ${typeof props.marginRight === "number" ? `${props.marginRight}px` : props.marginRight};`}
98
+
99
+ flex-direction: ${(props) => props.flexDirection || "column"};
100
+ flex-wrap: ${(props) => props.flexWrap || "nowrap"};
101
+ align-items: ${(props) => props.alignItems || "stretch"};
102
+ justify-content: ${(props) => props.justifyContent || "flex-start"};
103
+ cursor: ${(props) => props.cursor ? props.cursor : props.onClick || props.onPress ? "pointer" : "inherit"};
104
+ position: ${(props) => props.position || "static"};
105
+ top: ${(props) => typeof props.top === "number" ? `${props.top}px` : props.top};
106
+ bottom: ${(props) => typeof props.bottom === "number" ? `${props.bottom}px` : props.bottom};
107
+ left: ${(props) => typeof props.left === "number" ? `${props.left}px` : props.left};
108
+ right: ${(props) => typeof props.right === "number" ? `${props.right}px` : props.right};
109
+ flex: ${(props) => props.flex};
110
+ flex-shrink: ${(props) => props.flexShrink ?? 1};
111
+ gap: ${(props) => typeof props.gap === "number" ? `${props.gap}px` : props.gap || 0};
112
+ align-self: ${(props) => props.alignSelf || "auto"};
113
+ overflow: ${(props) => props.overflow || "visible"};
114
+ overflow-x: ${(props) => props.overflowX || "visible"};
115
+ overflow-y: ${(props) => props.overflowY || "visible"};
116
+ z-index: ${(props) => props.zIndex};
117
+ opacity: ${(props) => props.disabled ? 0.5 : 1};
118
+ pointer-events: ${(props) => props.disabled ? "none" : "auto"};
119
+
120
+ &:hover {
121
+ ${(props) => props.hoverStyle?.backgroundColor && `background-color: ${props.hoverStyle.backgroundColor};`}
122
+ ${(props) => props.hoverStyle?.borderColor && `border-color: ${props.hoverStyle.borderColor};`}
123
+ }
124
+
125
+ &:active {
126
+ ${(props) => props.pressStyle?.backgroundColor && `background-color: ${props.pressStyle.backgroundColor};`}
127
+ }
128
+ `;
129
+ var Box = import_react.default.forwardRef(
130
+ ({
131
+ children,
132
+ onPress,
133
+ onKeyDown,
134
+ onKeyUp,
135
+ role,
136
+ "aria-label": ariaLabel,
137
+ "aria-labelledby": ariaLabelledBy,
138
+ "aria-current": ariaCurrent,
139
+ "aria-disabled": ariaDisabled,
140
+ "aria-live": ariaLive,
141
+ "aria-busy": ariaBusy,
142
+ "aria-describedby": ariaDescribedBy,
143
+ "aria-expanded": ariaExpanded,
144
+ "aria-haspopup": ariaHasPopup,
145
+ "aria-pressed": ariaPressed,
146
+ "aria-controls": ariaControls,
147
+ tabIndex,
148
+ as,
149
+ src,
150
+ alt,
151
+ type,
152
+ disabled,
153
+ id,
154
+ ...props
155
+ }, ref) => {
156
+ if (as === "img" && src) {
157
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
158
+ "img",
159
+ {
160
+ src,
161
+ alt: alt || "",
162
+ style: {
163
+ display: "block",
164
+ objectFit: "cover",
165
+ width: typeof props.width === "number" ? `${props.width}px` : props.width,
166
+ height: typeof props.height === "number" ? `${props.height}px` : props.height,
167
+ borderRadius: typeof props.borderRadius === "number" ? `${props.borderRadius}px` : props.borderRadius,
168
+ position: props.position,
169
+ top: typeof props.top === "number" ? `${props.top}px` : props.top,
170
+ left: typeof props.left === "number" ? `${props.left}px` : props.left,
171
+ right: typeof props.right === "number" ? `${props.right}px` : props.right,
172
+ bottom: typeof props.bottom === "number" ? `${props.bottom}px` : props.bottom
173
+ }
174
+ }
175
+ );
176
+ }
177
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
178
+ StyledBox,
179
+ {
180
+ ref,
181
+ as,
182
+ id,
183
+ type: as === "button" ? type || "button" : void 0,
184
+ disabled: as === "button" ? disabled : void 0,
185
+ onClick: onPress,
186
+ onKeyDown,
187
+ onKeyUp,
188
+ role,
189
+ "aria-label": ariaLabel,
190
+ "aria-labelledby": ariaLabelledBy,
191
+ "aria-current": ariaCurrent,
192
+ "aria-disabled": ariaDisabled,
193
+ "aria-busy": ariaBusy,
194
+ "aria-describedby": ariaDescribedBy,
195
+ "aria-expanded": ariaExpanded,
196
+ "aria-haspopup": ariaHasPopup,
197
+ "aria-pressed": ariaPressed,
198
+ "aria-controls": ariaControls,
199
+ "aria-live": ariaLive,
200
+ tabIndex: tabIndex !== void 0 ? tabIndex : void 0,
201
+ ...props,
202
+ children
203
+ }
204
+ );
205
+ }
206
+ );
207
+ Box.displayName = "Box";
208
+
209
+ // ../primitives-web/src/Text.tsx
210
+ var import_styled_components2 = __toESM(require("styled-components"));
211
+ var import_jsx_runtime2 = require("react/jsx-runtime");
212
+ var StyledText = import_styled_components2.default.span`
213
+ color: ${(props) => props.color || "inherit"};
214
+ font-size: ${(props) => typeof props.fontSize === "number" ? `${props.fontSize}px` : props.fontSize || "inherit"};
215
+ font-weight: ${(props) => props.fontWeight || "normal"};
216
+ font-family: ${(props) => props.fontFamily || '"Pilat Wide Bold", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important'};
217
+ line-height: ${(props) => typeof props.lineHeight === "number" ? `${props.lineHeight}px` : props.lineHeight || "inherit"};
218
+ white-space: ${(props) => props.whiteSpace || "normal"};
219
+ text-align: ${(props) => props.textAlign || "inherit"};
220
+ text-decoration: ${(props) => props.textDecoration || "none"};
221
+ `;
222
+ var Text = ({
223
+ style,
224
+ className,
225
+ id,
226
+ role,
227
+ ...props
228
+ }) => {
229
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
230
+ StyledText,
231
+ {
232
+ ...props,
233
+ style,
234
+ className,
235
+ id,
236
+ role
237
+ }
238
+ );
239
+ };
240
+
241
+ // ../primitives-web/src/Spinner.tsx
242
+ var import_styled_components3 = __toESM(require("styled-components"));
243
+ var import_jsx_runtime3 = require("react/jsx-runtime");
244
+ var rotate = import_styled_components3.keyframes`
245
+ from {
246
+ transform: rotate(0deg);
247
+ }
248
+ to {
249
+ transform: rotate(360deg);
250
+ }
251
+ `;
252
+ var StyledSpinner = import_styled_components3.default.div`
253
+ width: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
254
+ height: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
255
+ border: ${(props) => props.strokeWidth || 2}px solid
256
+ ${(props) => props.color || "currentColor"};
257
+ border-bottom-color: transparent;
258
+ border-radius: 50%;
259
+ display: inline-block;
260
+ box-sizing: border-box;
261
+ animation: ${rotate} 1s linear infinite;
262
+ `;
263
+ var Spinner = ({
264
+ role = "status",
265
+ "aria-label": ariaLabel,
266
+ "aria-live": ariaLive = "polite",
267
+ "aria-describedby": ariaDescribedBy,
268
+ testID,
269
+ ...props
270
+ }) => {
271
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
272
+ StyledSpinner,
273
+ {
274
+ role,
275
+ "aria-label": ariaLabel,
276
+ "aria-live": ariaLive,
277
+ "aria-describedby": ariaDescribedBy,
278
+ "data-testid": testID,
279
+ ...props
280
+ }
281
+ );
282
+ };
283
+ Spinner.displayName = "Spinner";
284
+
285
+ // ../primitives-web/src/Icon.tsx
286
+ var import_styled_components4 = __toESM(require("styled-components"));
287
+ var import_jsx_runtime4 = require("react/jsx-runtime");
288
+ var StyledIcon = import_styled_components4.default.div`
289
+ display: flex;
290
+ align-items: center;
291
+ justify-content: center;
292
+ width: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
293
+ height: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
294
+ color: ${(props) => props.color || "currentColor"};
295
+
296
+ svg {
297
+ width: 100%;
298
+ height: 100%;
299
+ fill: none;
300
+ stroke: currentColor;
301
+ }
302
+ `;
303
+
304
+ // ../primitives-web/src/Divider.tsx
305
+ var import_styled_components5 = __toESM(require("styled-components"));
306
+ var import_jsx_runtime5 = require("react/jsx-runtime");
307
+ var StyledDivider = import_styled_components5.default.div`
308
+ background-color: ${(props) => props.dashStroke ? "transparent" : props.color || "rgba(255, 255, 255, 0.15)"};
309
+ width: ${(props) => props.vertical ? typeof props.width === "number" ? `${props.width}px` : props.width || "1px" : "100%"};
310
+ height: ${(props) => props.vertical ? "100%" : typeof props.height === "number" ? `${props.height}px` : props.height || "1px"};
311
+
312
+ ${(props) => props.dashStroke && `
313
+ border-style: dashed;
314
+ border-color: ${props.color || "rgba(255, 255, 255, 0.15)"};
315
+ border-width: 0;
316
+ ${props.vertical ? `
317
+ border-left-width: ${typeof props.width === "number" ? `${props.width}px` : props.width || "1px"};
318
+ height: 100%;
319
+ ` : `
320
+ border-top-width: ${typeof props.height === "number" ? `${props.height}px` : props.height || "1px"};
321
+ width: 100%;
322
+ `}
323
+ `}
324
+ `;
325
+
326
+ // ../primitives-web/src/Input.tsx
327
+ var import_react2 = require("react");
328
+ var import_styled_components6 = __toESM(require("styled-components"));
329
+ var import_jsx_runtime6 = require("react/jsx-runtime");
330
+ var StyledInput = import_styled_components6.default.input`
331
+ background: transparent;
332
+ border: none;
333
+ outline: none;
334
+ width: 100%;
335
+ height: 100%;
336
+ padding: 0;
337
+ margin: 0;
338
+ color: ${(props) => props.color || "inherit"};
339
+ font-size: ${(props) => typeof props.fontSize === "number" ? `${props.fontSize}px` : props.fontSize || "inherit"};
340
+ font-family: inherit;
341
+ text-align: inherit;
342
+
343
+ &::placeholder {
344
+ color: ${(props) => props.placeholderTextColor || "rgba(255, 255, 255, 0.5)"};
345
+ }
346
+
347
+ &:disabled {
348
+ cursor: not-allowed;
349
+ }
350
+ `;
351
+ var InputPrimitive = (0, import_react2.forwardRef)(
352
+ ({
353
+ value,
354
+ placeholder,
355
+ onChange,
356
+ onChangeText,
357
+ onFocus,
358
+ onBlur,
359
+ onKeyDown,
360
+ disabled,
361
+ secureTextEntry,
362
+ style,
363
+ color,
364
+ fontSize,
365
+ placeholderTextColor,
366
+ maxLength,
367
+ name,
368
+ type,
369
+ inputMode,
370
+ autoComplete,
371
+ id,
372
+ "aria-invalid": ariaInvalid,
373
+ "aria-describedby": ariaDescribedBy,
374
+ "aria-labelledby": ariaLabelledBy,
375
+ "aria-label": ariaLabel,
376
+ "aria-disabled": ariaDisabled,
377
+ "data-testid": dataTestId,
378
+ ...rest
379
+ }, ref) => {
380
+ const handleChange = (e) => {
381
+ if (onChange) {
382
+ onChange(e);
383
+ }
384
+ if (onChangeText) {
385
+ onChangeText(e.target.value);
386
+ }
387
+ };
388
+ const inputValue = value !== void 0 ? value : "";
389
+ return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
390
+ StyledInput,
391
+ {
392
+ ref,
393
+ id,
394
+ value: inputValue,
395
+ name,
396
+ placeholder,
397
+ onChange: handleChange,
398
+ onFocus,
399
+ onBlur,
400
+ onKeyDown,
401
+ disabled,
402
+ type: secureTextEntry ? "password" : type || "text",
403
+ inputMode,
404
+ autoComplete,
405
+ style,
406
+ color,
407
+ fontSize,
408
+ placeholderTextColor,
409
+ maxLength,
410
+ "aria-invalid": ariaInvalid,
411
+ "aria-describedby": ariaDescribedBy,
412
+ "aria-labelledby": ariaLabelledBy,
413
+ "aria-label": ariaLabel,
414
+ "aria-disabled": ariaDisabled,
415
+ "data-testid": dataTestId,
416
+ ...rest
417
+ }
418
+ );
419
+ }
420
+ );
421
+ InputPrimitive.displayName = "InputPrimitive";
422
+
423
+ // ../primitives-web/src/TextArea.tsx
424
+ var import_react3 = require("react");
425
+ var import_styled_components7 = __toESM(require("styled-components"));
426
+ var import_jsx_runtime7 = require("react/jsx-runtime");
427
+ var StyledTextArea = import_styled_components7.default.textarea`
428
+ background: transparent;
429
+ border: none;
430
+ outline: none;
431
+ width: 100%;
432
+ height: 100%;
433
+ padding: 0;
434
+ margin: 0;
435
+ color: ${(props) => props.color || "inherit"};
436
+ font-size: ${(props) => typeof props.fontSize === "number" ? `${props.fontSize}px` : props.fontSize || "inherit"};
437
+ font-family: inherit;
438
+ text-align: inherit;
439
+ resize: none;
440
+
441
+ &::placeholder {
442
+ color: ${(props) => props.placeholderTextColor || "rgba(255, 255, 255, 0.5)"};
443
+ }
444
+
445
+ &:disabled {
446
+ cursor: not-allowed;
447
+ }
448
+ `;
449
+ var TextAreaPrimitive = (0, import_react3.forwardRef)(
450
+ ({
451
+ value,
452
+ placeholder,
453
+ onChangeText,
454
+ onFocus,
455
+ onBlur,
456
+ onKeyDown,
457
+ disabled,
458
+ style,
459
+ color,
460
+ fontSize,
461
+ placeholderTextColor,
462
+ maxLength,
463
+ rows
464
+ }, ref) => {
465
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
466
+ StyledTextArea,
467
+ {
468
+ ref,
469
+ value,
470
+ placeholder,
471
+ onChange: (e) => onChangeText?.(e.target.value),
472
+ onFocus,
473
+ onBlur,
474
+ onKeyDown,
475
+ disabled,
476
+ style,
477
+ color,
478
+ fontSize,
479
+ placeholderTextColor,
480
+ maxLength,
481
+ rows
482
+ }
483
+ );
484
+ }
485
+ );
486
+ TextAreaPrimitive.displayName = "TextAreaPrimitive";
487
+
488
+ // src/Status.tsx
489
+ var import_xui_core = require("@xsolla/xui-core");
490
+ var import_jsx_runtime8 = require("react/jsx-runtime");
491
+ var dotSizeMap = {
492
+ sm: 4,
493
+ md: 6,
494
+ lg: 8
495
+ };
496
+ var getDotColor = (palette, theme) => {
497
+ switch (palette) {
498
+ case "success":
499
+ return theme.colors.content.success.primary;
500
+ case "warning":
501
+ return theme.colors.content.warning.primary;
502
+ case "alert":
503
+ return theme.colors.content.alert.primary;
504
+ case "neutral":
505
+ return theme.colors.content.neutral.primary;
506
+ default:
507
+ return theme.colors.content.tertiary;
508
+ }
509
+ };
510
+ var Status = (0, import_react4.forwardRef)(
511
+ ({
512
+ children,
513
+ palette = "default",
514
+ size = "md",
515
+ labelType = "primary",
516
+ uppercase = true,
517
+ ...rest
518
+ }, ref) => {
519
+ const { theme } = (0, import_xui_core.useDesignSystem)();
520
+ const dotSize = dotSizeMap[size];
521
+ const dotColor = getDotColor(palette, theme);
522
+ const labelColor = labelType === "dot-color" ? dotColor : theme.colors.content.primary;
523
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
524
+ Box,
525
+ {
526
+ ...rest,
527
+ ref,
528
+ display: "inline-flex",
529
+ flexDirection: "row",
530
+ alignItems: "center",
531
+ justifyContent: "center",
532
+ children: [
533
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
534
+ Box,
535
+ {
536
+ width: dotSize,
537
+ height: dotSize,
538
+ borderRadius: 50,
539
+ backgroundColor: dotColor
540
+ }
541
+ ),
542
+ children && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
543
+ Text,
544
+ {
545
+ color: labelColor,
546
+ fontSize: 12,
547
+ fontWeight: "400",
548
+ marginLeft: dotSize,
549
+ style: {
550
+ lineHeight: "16px",
551
+ textTransform: uppercase ? "uppercase" : "none",
552
+ display: "flex",
553
+ alignItems: "center",
554
+ justifyContent: "center"
555
+ },
556
+ children
557
+ }
558
+ )
559
+ ]
560
+ }
561
+ );
562
+ }
563
+ );
564
+ Status.displayName = "Status";
565
+ // Annotate the CommonJS export names for ESM import in node:
566
+ 0 && (module.exports = {
567
+ Status
568
+ });
569
+ //# sourceMappingURL=index.js.map
package/index.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/index.tsx","../../src/Status.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx","../../../primitives-web/src/Spinner.tsx","../../../primitives-web/src/Icon.tsx","../../../primitives-web/src/Divider.tsx","../../../primitives-web/src/Input.tsx","../../../primitives-web/src/TextArea.tsx"],"sourcesContent":["export * from \"./Status\";\nexport * from \"./types\";\n","import React, { forwardRef } from \"react\";\n// @ts-ignore - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem } from \"@xsolla/xui-core\";\nimport type { LabelType, StatusPalette, StatusProps } from \"./types\";\n\nconst dotSizeMap = {\n sm: 4,\n md: 6,\n lg: 8,\n};\n\nconst getDotColor = (palette: StatusPalette, theme: any) => {\n switch (palette) {\n case \"success\":\n return theme.colors.content.success.primary;\n case \"warning\":\n return theme.colors.content.warning.primary;\n case \"alert\":\n return theme.colors.content.alert.primary;\n case \"neutral\":\n return theme.colors.content.neutral.primary;\n default:\n return theme.colors.content.tertiary; // control_text_disabled equivalent\n }\n};\n\nexport const Status = forwardRef<any, StatusProps>(\n (\n {\n children,\n palette = \"default\",\n size = \"md\",\n labelType = \"primary\",\n uppercase = true,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const dotSize = dotSizeMap[size];\n const dotColor = getDotColor(palette, theme);\n const labelColor =\n labelType === \"dot-color\" ? dotColor : theme.colors.content.primary;\n\n return (\n <Box\n {...rest}\n ref={ref}\n display=\"inline-flex\"\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Box\n width={dotSize}\n height={dotSize}\n borderRadius={50}\n backgroundColor={dotColor}\n />\n {children && (\n <Text\n color={labelColor}\n fontSize={12}\n fontWeight=\"400\"\n marginLeft={dotSize}\n style={{\n lineHeight: \"16px\",\n textTransform: uppercase ? \"uppercase\" : \"none\",\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n }}\n >\n {children}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nStatus.displayName = \"Status\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledBox = styled.div<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\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 type,\n disabled,\n id,\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 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 }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n as={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 {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledText = styled.span<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Pilat Wide Bold\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif !important'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n","import React from \"react\";\nimport styled, { keyframes } from \"styled-components\";\nimport type { SpinnerProps } from \"@xsolla/xui-primitives-core\";\n\nconst rotate = keyframes`\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n`;\n\nconst StyledSpinner = styled.div<SpinnerProps>`\n width: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n height: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n border: ${(props) => props.strokeWidth || 2}px solid\n ${(props) => props.color || \"currentColor\"};\n border-bottom-color: transparent;\n border-radius: 50%;\n display: inline-block;\n box-sizing: border-box;\n animation: ${rotate} 1s linear infinite;\n`;\n\nexport const Spinner: React.FC<SpinnerProps> = ({\n role = \"status\",\n \"aria-label\": ariaLabel,\n \"aria-live\": ariaLive = \"polite\",\n \"aria-describedby\": ariaDescribedBy,\n testID,\n ...props\n}) => {\n return (\n <StyledSpinner\n role={role}\n aria-label={ariaLabel}\n aria-live={ariaLive}\n aria-describedby={ariaDescribedBy}\n data-testid={testID}\n {...props}\n />\n );\n};\n\nSpinner.displayName = \"Spinner\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledIcon = styled.div<IconProps>`\n display: flex;\n align-items: center;\n justify-content: center;\n width: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n height: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n color: ${(props) => props.color || \"currentColor\"};\n\n svg {\n width: 100%;\n height: 100%;\n fill: none;\n stroke: currentColor;\n }\n`;\n\nexport const Icon: React.FC<IconProps> = ({ children, ...props }) => {\n return <StyledIcon {...props}>{children}</StyledIcon>;\n};\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { DividerProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledDivider = styled.div<DividerProps>`\n background-color: ${(props) =>\n props.dashStroke\n ? \"transparent\"\n : props.color || \"rgba(255, 255, 255, 0.15)\"};\n width: ${(props) =>\n props.vertical\n ? typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"1px\"\n : \"100%\"};\n height: ${(props) =>\n props.vertical\n ? \"100%\"\n : typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"1px\"};\n\n ${(props) =>\n props.dashStroke &&\n `\n border-style: dashed;\n border-color: ${props.color || \"rgba(255, 255, 255, 0.15)\"};\n border-width: 0;\n ${\n props.vertical\n ? `\n border-left-width: ${typeof props.width === \"number\" ? `${props.width}px` : props.width || \"1px\"};\n height: 100%;\n `\n : `\n border-top-width: ${typeof props.height === \"number\" ? `${props.height}px` : props.height || \"1px\"};\n width: 100%;\n `\n }\n `}\n`;\n\nexport const Divider: React.FC<DividerProps> = (props) => {\n return <StyledDivider {...props} />;\n};\n","import React, { forwardRef } from \"react\";\nimport styled from \"styled-components\";\nimport { InputPrimitiveProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledInput = styled.input<InputPrimitiveProps>`\n background: transparent;\n border: none;\n outline: none;\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-family: inherit;\n text-align: inherit;\n\n &::placeholder {\n color: ${(props) =>\n props.placeholderTextColor || \"rgba(255, 255, 255, 0.5)\"};\n }\n\n &:disabled {\n cursor: not-allowed;\n }\n`;\n\nexport const InputPrimitive = forwardRef<HTMLInputElement, InputPrimitiveProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onFocus,\n onBlur,\n onKeyDown,\n disabled,\n secureTextEntry,\n style,\n color,\n fontSize,\n placeholderTextColor,\n maxLength,\n name,\n type,\n inputMode,\n autoComplete,\n id,\n \"aria-invalid\": ariaInvalid,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-label\": ariaLabel,\n \"aria-disabled\": ariaDisabled,\n \"data-testid\": dataTestId,\n ...rest\n },\n ref\n ) => {\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(e.target.value);\n }\n };\n\n // Always pass value to make it a controlled input\n const inputValue = value !== undefined ? value : \"\";\n\n return (\n <StyledInput\n ref={ref}\n id={id}\n value={inputValue}\n name={name}\n placeholder={placeholder}\n onChange={handleChange}\n onFocus={onFocus}\n onBlur={onBlur}\n onKeyDown={onKeyDown}\n disabled={disabled}\n type={secureTextEntry ? \"password\" : type || \"text\"}\n inputMode={inputMode}\n autoComplete={autoComplete}\n style={style}\n color={color}\n fontSize={fontSize}\n placeholderTextColor={placeholderTextColor}\n maxLength={maxLength}\n aria-invalid={ariaInvalid}\n aria-describedby={ariaDescribedBy}\n aria-labelledby={ariaLabelledBy}\n aria-label={ariaLabel}\n aria-disabled={ariaDisabled}\n data-testid={dataTestId}\n {...rest}\n />\n );\n }\n);\n\nInputPrimitive.displayName = \"InputPrimitive\";\n","import React, { forwardRef } from \"react\";\nimport styled from \"styled-components\";\nimport { TextAreaPrimitiveProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledTextArea = styled.textarea<TextAreaPrimitiveProps>`\n background: transparent;\n border: none;\n outline: none;\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-family: inherit;\n text-align: inherit;\n resize: none;\n\n &::placeholder {\n color: ${(props) =>\n props.placeholderTextColor || \"rgba(255, 255, 255, 0.5)\"};\n }\n\n &:disabled {\n cursor: not-allowed;\n }\n`;\n\nexport const TextAreaPrimitive = forwardRef<\n HTMLTextAreaElement,\n TextAreaPrimitiveProps\n>(\n (\n {\n value,\n placeholder,\n onChangeText,\n onFocus,\n onBlur,\n onKeyDown,\n disabled,\n style,\n color,\n fontSize,\n placeholderTextColor,\n maxLength,\n rows,\n },\n ref\n ) => {\n return (\n <StyledTextArea\n ref={ref}\n value={value}\n placeholder={placeholder}\n onChange={(e) => onChangeText?.(e.target.value)}\n onFocus={onFocus}\n onBlur={onBlur}\n onKeyDown={onKeyDown}\n disabled={disabled}\n style={style}\n color={color}\n fontSize={fontSize}\n placeholderTextColor={placeholderTextColor}\n maxLength={maxLength}\n rows={rows}\n />\n );\n }\n);\n\nTextAreaPrimitive.displayName = \"TextAreaPrimitive\";\n"],"mappings":"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","names":["import_react","styled","React","import_styled_components","import_jsx_runtime","styled","import_styled_components","import_jsx_runtime","styled","import_styled_components","import_jsx_runtime","styled","import_styled_components","import_jsx_runtime","styled","import_react","import_styled_components","import_jsx_runtime","styled","import_react","import_styled_components","import_jsx_runtime","styled","import_jsx_runtime"]}
package/index.mjs ADDED
@@ -0,0 +1,532 @@
1
+ // src/Status.tsx
2
+ import { forwardRef as forwardRef3 } from "react";
3
+
4
+ // ../primitives-web/src/Box.tsx
5
+ import React from "react";
6
+ import styled from "styled-components";
7
+ import { jsx } from "react/jsx-runtime";
8
+ var StyledBox = styled.div`
9
+ display: flex;
10
+ box-sizing: border-box;
11
+ background-color: ${(props) => props.backgroundColor || "transparent"};
12
+ border-color: ${(props) => props.borderColor || "transparent"};
13
+ border-width: ${(props) => typeof props.borderWidth === "number" ? `${props.borderWidth}px` : props.borderWidth || 0};
14
+
15
+ ${(props) => props.borderBottomWidth !== void 0 && `
16
+ border-bottom-width: ${typeof props.borderBottomWidth === "number" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};
17
+ border-bottom-color: ${props.borderBottomColor || props.borderColor || "transparent"};
18
+ border-bottom-style: solid;
19
+ `}
20
+ ${(props) => props.borderTopWidth !== void 0 && `
21
+ border-top-width: ${typeof props.borderTopWidth === "number" ? `${props.borderTopWidth}px` : props.borderTopWidth};
22
+ border-top-color: ${props.borderTopColor || props.borderColor || "transparent"};
23
+ border-top-style: solid;
24
+ `}
25
+ ${(props) => props.borderLeftWidth !== void 0 && `
26
+ border-left-width: ${typeof props.borderLeftWidth === "number" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};
27
+ border-left-color: ${props.borderLeftColor || props.borderColor || "transparent"};
28
+ border-left-style: solid;
29
+ `}
30
+ ${(props) => props.borderRightWidth !== void 0 && `
31
+ border-right-width: ${typeof props.borderRightWidth === "number" ? `${props.borderRightWidth}px` : props.borderRightWidth};
32
+ border-right-color: ${props.borderRightColor || props.borderColor || "transparent"};
33
+ border-right-style: solid;
34
+ `}
35
+
36
+ border-style: ${(props) => props.borderStyle || (props.borderWidth || props.borderBottomWidth || props.borderTopWidth || props.borderLeftWidth || props.borderRightWidth ? "solid" : "none")};
37
+ border-radius: ${(props) => typeof props.borderRadius === "number" ? `${props.borderRadius}px` : props.borderRadius || 0};
38
+ height: ${(props) => typeof props.height === "number" ? `${props.height}px` : props.height || "auto"};
39
+ width: ${(props) => typeof props.width === "number" ? `${props.width}px` : props.width || "auto"};
40
+ min-width: ${(props) => typeof props.minWidth === "number" ? `${props.minWidth}px` : props.minWidth || "auto"};
41
+ min-height: ${(props) => typeof props.minHeight === "number" ? `${props.minHeight}px` : props.minHeight || "auto"};
42
+
43
+ padding: ${(props) => typeof props.padding === "number" ? `${props.padding}px` : props.padding || 0};
44
+ ${(props) => props.paddingHorizontal && `
45
+ padding-left: ${typeof props.paddingHorizontal === "number" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};
46
+ padding-right: ${typeof props.paddingHorizontal === "number" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};
47
+ `}
48
+ ${(props) => props.paddingVertical && `
49
+ padding-top: ${typeof props.paddingVertical === "number" ? `${props.paddingVertical}px` : props.paddingVertical};
50
+ padding-bottom: ${typeof props.paddingVertical === "number" ? `${props.paddingVertical}px` : props.paddingVertical};
51
+ `}
52
+ ${(props) => props.paddingTop !== void 0 && `padding-top: ${typeof props.paddingTop === "number" ? `${props.paddingTop}px` : props.paddingTop};`}
53
+ ${(props) => props.paddingBottom !== void 0 && `padding-bottom: ${typeof props.paddingBottom === "number" ? `${props.paddingBottom}px` : props.paddingBottom};`}
54
+ ${(props) => props.paddingLeft !== void 0 && `padding-left: ${typeof props.paddingLeft === "number" ? `${props.paddingLeft}px` : props.paddingLeft};`}
55
+ ${(props) => props.paddingRight !== void 0 && `padding-right: ${typeof props.paddingRight === "number" ? `${props.paddingRight}px` : props.paddingRight};`}
56
+
57
+ margin: ${(props) => typeof props.margin === "number" ? `${props.margin}px` : props.margin || 0};
58
+ ${(props) => props.marginTop !== void 0 && `margin-top: ${typeof props.marginTop === "number" ? `${props.marginTop}px` : props.marginTop};`}
59
+ ${(props) => props.marginBottom !== void 0 && `margin-bottom: ${typeof props.marginBottom === "number" ? `${props.marginBottom}px` : props.marginBottom};`}
60
+ ${(props) => props.marginLeft !== void 0 && `margin-left: ${typeof props.marginLeft === "number" ? `${props.marginLeft}px` : props.marginLeft};`}
61
+ ${(props) => props.marginRight !== void 0 && `margin-right: ${typeof props.marginRight === "number" ? `${props.marginRight}px` : props.marginRight};`}
62
+
63
+ flex-direction: ${(props) => props.flexDirection || "column"};
64
+ flex-wrap: ${(props) => props.flexWrap || "nowrap"};
65
+ align-items: ${(props) => props.alignItems || "stretch"};
66
+ justify-content: ${(props) => props.justifyContent || "flex-start"};
67
+ cursor: ${(props) => props.cursor ? props.cursor : props.onClick || props.onPress ? "pointer" : "inherit"};
68
+ position: ${(props) => props.position || "static"};
69
+ top: ${(props) => typeof props.top === "number" ? `${props.top}px` : props.top};
70
+ bottom: ${(props) => typeof props.bottom === "number" ? `${props.bottom}px` : props.bottom};
71
+ left: ${(props) => typeof props.left === "number" ? `${props.left}px` : props.left};
72
+ right: ${(props) => typeof props.right === "number" ? `${props.right}px` : props.right};
73
+ flex: ${(props) => props.flex};
74
+ flex-shrink: ${(props) => props.flexShrink ?? 1};
75
+ gap: ${(props) => typeof props.gap === "number" ? `${props.gap}px` : props.gap || 0};
76
+ align-self: ${(props) => props.alignSelf || "auto"};
77
+ overflow: ${(props) => props.overflow || "visible"};
78
+ overflow-x: ${(props) => props.overflowX || "visible"};
79
+ overflow-y: ${(props) => props.overflowY || "visible"};
80
+ z-index: ${(props) => props.zIndex};
81
+ opacity: ${(props) => props.disabled ? 0.5 : 1};
82
+ pointer-events: ${(props) => props.disabled ? "none" : "auto"};
83
+
84
+ &:hover {
85
+ ${(props) => props.hoverStyle?.backgroundColor && `background-color: ${props.hoverStyle.backgroundColor};`}
86
+ ${(props) => props.hoverStyle?.borderColor && `border-color: ${props.hoverStyle.borderColor};`}
87
+ }
88
+
89
+ &:active {
90
+ ${(props) => props.pressStyle?.backgroundColor && `background-color: ${props.pressStyle.backgroundColor};`}
91
+ }
92
+ `;
93
+ var Box = React.forwardRef(
94
+ ({
95
+ children,
96
+ onPress,
97
+ onKeyDown,
98
+ onKeyUp,
99
+ role,
100
+ "aria-label": ariaLabel,
101
+ "aria-labelledby": ariaLabelledBy,
102
+ "aria-current": ariaCurrent,
103
+ "aria-disabled": ariaDisabled,
104
+ "aria-live": ariaLive,
105
+ "aria-busy": ariaBusy,
106
+ "aria-describedby": ariaDescribedBy,
107
+ "aria-expanded": ariaExpanded,
108
+ "aria-haspopup": ariaHasPopup,
109
+ "aria-pressed": ariaPressed,
110
+ "aria-controls": ariaControls,
111
+ tabIndex,
112
+ as,
113
+ src,
114
+ alt,
115
+ type,
116
+ disabled,
117
+ id,
118
+ ...props
119
+ }, ref) => {
120
+ if (as === "img" && src) {
121
+ return /* @__PURE__ */ jsx(
122
+ "img",
123
+ {
124
+ src,
125
+ alt: alt || "",
126
+ style: {
127
+ display: "block",
128
+ objectFit: "cover",
129
+ width: typeof props.width === "number" ? `${props.width}px` : props.width,
130
+ height: typeof props.height === "number" ? `${props.height}px` : props.height,
131
+ borderRadius: typeof props.borderRadius === "number" ? `${props.borderRadius}px` : props.borderRadius,
132
+ position: props.position,
133
+ top: typeof props.top === "number" ? `${props.top}px` : props.top,
134
+ left: typeof props.left === "number" ? `${props.left}px` : props.left,
135
+ right: typeof props.right === "number" ? `${props.right}px` : props.right,
136
+ bottom: typeof props.bottom === "number" ? `${props.bottom}px` : props.bottom
137
+ }
138
+ }
139
+ );
140
+ }
141
+ return /* @__PURE__ */ jsx(
142
+ StyledBox,
143
+ {
144
+ ref,
145
+ as,
146
+ id,
147
+ type: as === "button" ? type || "button" : void 0,
148
+ disabled: as === "button" ? disabled : void 0,
149
+ onClick: onPress,
150
+ onKeyDown,
151
+ onKeyUp,
152
+ role,
153
+ "aria-label": ariaLabel,
154
+ "aria-labelledby": ariaLabelledBy,
155
+ "aria-current": ariaCurrent,
156
+ "aria-disabled": ariaDisabled,
157
+ "aria-busy": ariaBusy,
158
+ "aria-describedby": ariaDescribedBy,
159
+ "aria-expanded": ariaExpanded,
160
+ "aria-haspopup": ariaHasPopup,
161
+ "aria-pressed": ariaPressed,
162
+ "aria-controls": ariaControls,
163
+ "aria-live": ariaLive,
164
+ tabIndex: tabIndex !== void 0 ? tabIndex : void 0,
165
+ ...props,
166
+ children
167
+ }
168
+ );
169
+ }
170
+ );
171
+ Box.displayName = "Box";
172
+
173
+ // ../primitives-web/src/Text.tsx
174
+ import styled2 from "styled-components";
175
+ import { jsx as jsx2 } from "react/jsx-runtime";
176
+ var StyledText = styled2.span`
177
+ color: ${(props) => props.color || "inherit"};
178
+ font-size: ${(props) => typeof props.fontSize === "number" ? `${props.fontSize}px` : props.fontSize || "inherit"};
179
+ font-weight: ${(props) => props.fontWeight || "normal"};
180
+ font-family: ${(props) => props.fontFamily || '"Pilat Wide Bold", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important'};
181
+ line-height: ${(props) => typeof props.lineHeight === "number" ? `${props.lineHeight}px` : props.lineHeight || "inherit"};
182
+ white-space: ${(props) => props.whiteSpace || "normal"};
183
+ text-align: ${(props) => props.textAlign || "inherit"};
184
+ text-decoration: ${(props) => props.textDecoration || "none"};
185
+ `;
186
+ var Text = ({
187
+ style,
188
+ className,
189
+ id,
190
+ role,
191
+ ...props
192
+ }) => {
193
+ return /* @__PURE__ */ jsx2(
194
+ StyledText,
195
+ {
196
+ ...props,
197
+ style,
198
+ className,
199
+ id,
200
+ role
201
+ }
202
+ );
203
+ };
204
+
205
+ // ../primitives-web/src/Spinner.tsx
206
+ import styled3, { keyframes } from "styled-components";
207
+ import { jsx as jsx3 } from "react/jsx-runtime";
208
+ var rotate = keyframes`
209
+ from {
210
+ transform: rotate(0deg);
211
+ }
212
+ to {
213
+ transform: rotate(360deg);
214
+ }
215
+ `;
216
+ var StyledSpinner = styled3.div`
217
+ width: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
218
+ height: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
219
+ border: ${(props) => props.strokeWidth || 2}px solid
220
+ ${(props) => props.color || "currentColor"};
221
+ border-bottom-color: transparent;
222
+ border-radius: 50%;
223
+ display: inline-block;
224
+ box-sizing: border-box;
225
+ animation: ${rotate} 1s linear infinite;
226
+ `;
227
+ var Spinner = ({
228
+ role = "status",
229
+ "aria-label": ariaLabel,
230
+ "aria-live": ariaLive = "polite",
231
+ "aria-describedby": ariaDescribedBy,
232
+ testID,
233
+ ...props
234
+ }) => {
235
+ return /* @__PURE__ */ jsx3(
236
+ StyledSpinner,
237
+ {
238
+ role,
239
+ "aria-label": ariaLabel,
240
+ "aria-live": ariaLive,
241
+ "aria-describedby": ariaDescribedBy,
242
+ "data-testid": testID,
243
+ ...props
244
+ }
245
+ );
246
+ };
247
+ Spinner.displayName = "Spinner";
248
+
249
+ // ../primitives-web/src/Icon.tsx
250
+ import styled4 from "styled-components";
251
+ import { jsx as jsx4 } from "react/jsx-runtime";
252
+ var StyledIcon = styled4.div`
253
+ display: flex;
254
+ align-items: center;
255
+ justify-content: center;
256
+ width: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
257
+ height: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
258
+ color: ${(props) => props.color || "currentColor"};
259
+
260
+ svg {
261
+ width: 100%;
262
+ height: 100%;
263
+ fill: none;
264
+ stroke: currentColor;
265
+ }
266
+ `;
267
+
268
+ // ../primitives-web/src/Divider.tsx
269
+ import styled5 from "styled-components";
270
+ import { jsx as jsx5 } from "react/jsx-runtime";
271
+ var StyledDivider = styled5.div`
272
+ background-color: ${(props) => props.dashStroke ? "transparent" : props.color || "rgba(255, 255, 255, 0.15)"};
273
+ width: ${(props) => props.vertical ? typeof props.width === "number" ? `${props.width}px` : props.width || "1px" : "100%"};
274
+ height: ${(props) => props.vertical ? "100%" : typeof props.height === "number" ? `${props.height}px` : props.height || "1px"};
275
+
276
+ ${(props) => props.dashStroke && `
277
+ border-style: dashed;
278
+ border-color: ${props.color || "rgba(255, 255, 255, 0.15)"};
279
+ border-width: 0;
280
+ ${props.vertical ? `
281
+ border-left-width: ${typeof props.width === "number" ? `${props.width}px` : props.width || "1px"};
282
+ height: 100%;
283
+ ` : `
284
+ border-top-width: ${typeof props.height === "number" ? `${props.height}px` : props.height || "1px"};
285
+ width: 100%;
286
+ `}
287
+ `}
288
+ `;
289
+
290
+ // ../primitives-web/src/Input.tsx
291
+ import { forwardRef } from "react";
292
+ import styled6 from "styled-components";
293
+ import { jsx as jsx6 } from "react/jsx-runtime";
294
+ var StyledInput = styled6.input`
295
+ background: transparent;
296
+ border: none;
297
+ outline: none;
298
+ width: 100%;
299
+ height: 100%;
300
+ padding: 0;
301
+ margin: 0;
302
+ color: ${(props) => props.color || "inherit"};
303
+ font-size: ${(props) => typeof props.fontSize === "number" ? `${props.fontSize}px` : props.fontSize || "inherit"};
304
+ font-family: inherit;
305
+ text-align: inherit;
306
+
307
+ &::placeholder {
308
+ color: ${(props) => props.placeholderTextColor || "rgba(255, 255, 255, 0.5)"};
309
+ }
310
+
311
+ &:disabled {
312
+ cursor: not-allowed;
313
+ }
314
+ `;
315
+ var InputPrimitive = forwardRef(
316
+ ({
317
+ value,
318
+ placeholder,
319
+ onChange,
320
+ onChangeText,
321
+ onFocus,
322
+ onBlur,
323
+ onKeyDown,
324
+ disabled,
325
+ secureTextEntry,
326
+ style,
327
+ color,
328
+ fontSize,
329
+ placeholderTextColor,
330
+ maxLength,
331
+ name,
332
+ type,
333
+ inputMode,
334
+ autoComplete,
335
+ id,
336
+ "aria-invalid": ariaInvalid,
337
+ "aria-describedby": ariaDescribedBy,
338
+ "aria-labelledby": ariaLabelledBy,
339
+ "aria-label": ariaLabel,
340
+ "aria-disabled": ariaDisabled,
341
+ "data-testid": dataTestId,
342
+ ...rest
343
+ }, ref) => {
344
+ const handleChange = (e) => {
345
+ if (onChange) {
346
+ onChange(e);
347
+ }
348
+ if (onChangeText) {
349
+ onChangeText(e.target.value);
350
+ }
351
+ };
352
+ const inputValue = value !== void 0 ? value : "";
353
+ return /* @__PURE__ */ jsx6(
354
+ StyledInput,
355
+ {
356
+ ref,
357
+ id,
358
+ value: inputValue,
359
+ name,
360
+ placeholder,
361
+ onChange: handleChange,
362
+ onFocus,
363
+ onBlur,
364
+ onKeyDown,
365
+ disabled,
366
+ type: secureTextEntry ? "password" : type || "text",
367
+ inputMode,
368
+ autoComplete,
369
+ style,
370
+ color,
371
+ fontSize,
372
+ placeholderTextColor,
373
+ maxLength,
374
+ "aria-invalid": ariaInvalid,
375
+ "aria-describedby": ariaDescribedBy,
376
+ "aria-labelledby": ariaLabelledBy,
377
+ "aria-label": ariaLabel,
378
+ "aria-disabled": ariaDisabled,
379
+ "data-testid": dataTestId,
380
+ ...rest
381
+ }
382
+ );
383
+ }
384
+ );
385
+ InputPrimitive.displayName = "InputPrimitive";
386
+
387
+ // ../primitives-web/src/TextArea.tsx
388
+ import { forwardRef as forwardRef2 } from "react";
389
+ import styled7 from "styled-components";
390
+ import { jsx as jsx7 } from "react/jsx-runtime";
391
+ var StyledTextArea = styled7.textarea`
392
+ background: transparent;
393
+ border: none;
394
+ outline: none;
395
+ width: 100%;
396
+ height: 100%;
397
+ padding: 0;
398
+ margin: 0;
399
+ color: ${(props) => props.color || "inherit"};
400
+ font-size: ${(props) => typeof props.fontSize === "number" ? `${props.fontSize}px` : props.fontSize || "inherit"};
401
+ font-family: inherit;
402
+ text-align: inherit;
403
+ resize: none;
404
+
405
+ &::placeholder {
406
+ color: ${(props) => props.placeholderTextColor || "rgba(255, 255, 255, 0.5)"};
407
+ }
408
+
409
+ &:disabled {
410
+ cursor: not-allowed;
411
+ }
412
+ `;
413
+ var TextAreaPrimitive = forwardRef2(
414
+ ({
415
+ value,
416
+ placeholder,
417
+ onChangeText,
418
+ onFocus,
419
+ onBlur,
420
+ onKeyDown,
421
+ disabled,
422
+ style,
423
+ color,
424
+ fontSize,
425
+ placeholderTextColor,
426
+ maxLength,
427
+ rows
428
+ }, ref) => {
429
+ return /* @__PURE__ */ jsx7(
430
+ StyledTextArea,
431
+ {
432
+ ref,
433
+ value,
434
+ placeholder,
435
+ onChange: (e) => onChangeText?.(e.target.value),
436
+ onFocus,
437
+ onBlur,
438
+ onKeyDown,
439
+ disabled,
440
+ style,
441
+ color,
442
+ fontSize,
443
+ placeholderTextColor,
444
+ maxLength,
445
+ rows
446
+ }
447
+ );
448
+ }
449
+ );
450
+ TextAreaPrimitive.displayName = "TextAreaPrimitive";
451
+
452
+ // src/Status.tsx
453
+ import { useDesignSystem } from "@xsolla/xui-core";
454
+ import { jsx as jsx8, jsxs } from "react/jsx-runtime";
455
+ var dotSizeMap = {
456
+ sm: 4,
457
+ md: 6,
458
+ lg: 8
459
+ };
460
+ var getDotColor = (palette, theme) => {
461
+ switch (palette) {
462
+ case "success":
463
+ return theme.colors.content.success.primary;
464
+ case "warning":
465
+ return theme.colors.content.warning.primary;
466
+ case "alert":
467
+ return theme.colors.content.alert.primary;
468
+ case "neutral":
469
+ return theme.colors.content.neutral.primary;
470
+ default:
471
+ return theme.colors.content.tertiary;
472
+ }
473
+ };
474
+ var Status = forwardRef3(
475
+ ({
476
+ children,
477
+ palette = "default",
478
+ size = "md",
479
+ labelType = "primary",
480
+ uppercase = true,
481
+ ...rest
482
+ }, ref) => {
483
+ const { theme } = useDesignSystem();
484
+ const dotSize = dotSizeMap[size];
485
+ const dotColor = getDotColor(palette, theme);
486
+ const labelColor = labelType === "dot-color" ? dotColor : theme.colors.content.primary;
487
+ return /* @__PURE__ */ jsxs(
488
+ Box,
489
+ {
490
+ ...rest,
491
+ ref,
492
+ display: "inline-flex",
493
+ flexDirection: "row",
494
+ alignItems: "center",
495
+ justifyContent: "center",
496
+ children: [
497
+ /* @__PURE__ */ jsx8(
498
+ Box,
499
+ {
500
+ width: dotSize,
501
+ height: dotSize,
502
+ borderRadius: 50,
503
+ backgroundColor: dotColor
504
+ }
505
+ ),
506
+ children && /* @__PURE__ */ jsx8(
507
+ Text,
508
+ {
509
+ color: labelColor,
510
+ fontSize: 12,
511
+ fontWeight: "400",
512
+ marginLeft: dotSize,
513
+ style: {
514
+ lineHeight: "16px",
515
+ textTransform: uppercase ? "uppercase" : "none",
516
+ display: "flex",
517
+ alignItems: "center",
518
+ justifyContent: "center"
519
+ },
520
+ children
521
+ }
522
+ )
523
+ ]
524
+ }
525
+ );
526
+ }
527
+ );
528
+ Status.displayName = "Status";
529
+ export {
530
+ Status
531
+ };
532
+ //# sourceMappingURL=index.mjs.map
package/index.mjs.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/Status.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx","../../../primitives-web/src/Spinner.tsx","../../../primitives-web/src/Icon.tsx","../../../primitives-web/src/Divider.tsx","../../../primitives-web/src/Input.tsx","../../../primitives-web/src/TextArea.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\n// @ts-ignore - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem } from \"@xsolla/xui-core\";\nimport type { LabelType, StatusPalette, StatusProps } from \"./types\";\n\nconst dotSizeMap = {\n sm: 4,\n md: 6,\n lg: 8,\n};\n\nconst getDotColor = (palette: StatusPalette, theme: any) => {\n switch (palette) {\n case \"success\":\n return theme.colors.content.success.primary;\n case \"warning\":\n return theme.colors.content.warning.primary;\n case \"alert\":\n return theme.colors.content.alert.primary;\n case \"neutral\":\n return theme.colors.content.neutral.primary;\n default:\n return theme.colors.content.tertiary; // control_text_disabled equivalent\n }\n};\n\nexport const Status = forwardRef<any, StatusProps>(\n (\n {\n children,\n palette = \"default\",\n size = \"md\",\n labelType = \"primary\",\n uppercase = true,\n ...rest\n },\n ref\n ) => {\n const { theme } = useDesignSystem();\n const dotSize = dotSizeMap[size];\n const dotColor = getDotColor(palette, theme);\n const labelColor =\n labelType === \"dot-color\" ? dotColor : theme.colors.content.primary;\n\n return (\n <Box\n {...rest}\n ref={ref}\n display=\"inline-flex\"\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"center\"\n >\n <Box\n width={dotSize}\n height={dotSize}\n borderRadius={50}\n backgroundColor={dotColor}\n />\n {children && (\n <Text\n color={labelColor}\n fontSize={12}\n fontWeight=\"400\"\n marginLeft={dotSize}\n style={{\n lineHeight: \"16px\",\n textTransform: uppercase ? \"uppercase\" : \"none\",\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n }}\n >\n {children}\n </Text>\n )}\n </Box>\n );\n }\n);\n\nStatus.displayName = \"Status\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledBox = styled.div<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\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 type,\n disabled,\n id,\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 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 }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n as={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 {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledText = styled.span<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Pilat Wide Bold\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif !important'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n","import React from \"react\";\nimport styled, { keyframes } from \"styled-components\";\nimport type { SpinnerProps } from \"@xsolla/xui-primitives-core\";\n\nconst rotate = keyframes`\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n`;\n\nconst StyledSpinner = styled.div<SpinnerProps>`\n width: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n height: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n border: ${(props) => props.strokeWidth || 2}px solid\n ${(props) => props.color || \"currentColor\"};\n border-bottom-color: transparent;\n border-radius: 50%;\n display: inline-block;\n box-sizing: border-box;\n animation: ${rotate} 1s linear infinite;\n`;\n\nexport const Spinner: React.FC<SpinnerProps> = ({\n role = \"status\",\n \"aria-label\": ariaLabel,\n \"aria-live\": ariaLive = \"polite\",\n \"aria-describedby\": ariaDescribedBy,\n testID,\n ...props\n}) => {\n return (\n <StyledSpinner\n role={role}\n aria-label={ariaLabel}\n aria-live={ariaLive}\n aria-describedby={ariaDescribedBy}\n data-testid={testID}\n {...props}\n />\n );\n};\n\nSpinner.displayName = \"Spinner\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledIcon = styled.div<IconProps>`\n display: flex;\n align-items: center;\n justify-content: center;\n width: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n height: ${(props) =>\n typeof props.size === \"number\" ? `${props.size}px` : props.size || \"24px\"};\n color: ${(props) => props.color || \"currentColor\"};\n\n svg {\n width: 100%;\n height: 100%;\n fill: none;\n stroke: currentColor;\n }\n`;\n\nexport const Icon: React.FC<IconProps> = ({ children, ...props }) => {\n return <StyledIcon {...props}>{children}</StyledIcon>;\n};\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { DividerProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledDivider = styled.div<DividerProps>`\n background-color: ${(props) =>\n props.dashStroke\n ? \"transparent\"\n : props.color || \"rgba(255, 255, 255, 0.15)\"};\n width: ${(props) =>\n props.vertical\n ? typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"1px\"\n : \"100%\"};\n height: ${(props) =>\n props.vertical\n ? \"100%\"\n : typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"1px\"};\n\n ${(props) =>\n props.dashStroke &&\n `\n border-style: dashed;\n border-color: ${props.color || \"rgba(255, 255, 255, 0.15)\"};\n border-width: 0;\n ${\n props.vertical\n ? `\n border-left-width: ${typeof props.width === \"number\" ? `${props.width}px` : props.width || \"1px\"};\n height: 100%;\n `\n : `\n border-top-width: ${typeof props.height === \"number\" ? `${props.height}px` : props.height || \"1px\"};\n width: 100%;\n `\n }\n `}\n`;\n\nexport const Divider: React.FC<DividerProps> = (props) => {\n return <StyledDivider {...props} />;\n};\n","import React, { forwardRef } from \"react\";\nimport styled from \"styled-components\";\nimport { InputPrimitiveProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledInput = styled.input<InputPrimitiveProps>`\n background: transparent;\n border: none;\n outline: none;\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-family: inherit;\n text-align: inherit;\n\n &::placeholder {\n color: ${(props) =>\n props.placeholderTextColor || \"rgba(255, 255, 255, 0.5)\"};\n }\n\n &:disabled {\n cursor: not-allowed;\n }\n`;\n\nexport const InputPrimitive = forwardRef<HTMLInputElement, InputPrimitiveProps>(\n (\n {\n value,\n placeholder,\n onChange,\n onChangeText,\n onFocus,\n onBlur,\n onKeyDown,\n disabled,\n secureTextEntry,\n style,\n color,\n fontSize,\n placeholderTextColor,\n maxLength,\n name,\n type,\n inputMode,\n autoComplete,\n id,\n \"aria-invalid\": ariaInvalid,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-label\": ariaLabel,\n \"aria-disabled\": ariaDisabled,\n \"data-testid\": dataTestId,\n ...rest\n },\n ref\n ) => {\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n if (onChange) {\n onChange(e);\n }\n if (onChangeText) {\n onChangeText(e.target.value);\n }\n };\n\n // Always pass value to make it a controlled input\n const inputValue = value !== undefined ? value : \"\";\n\n return (\n <StyledInput\n ref={ref}\n id={id}\n value={inputValue}\n name={name}\n placeholder={placeholder}\n onChange={handleChange}\n onFocus={onFocus}\n onBlur={onBlur}\n onKeyDown={onKeyDown}\n disabled={disabled}\n type={secureTextEntry ? \"password\" : type || \"text\"}\n inputMode={inputMode}\n autoComplete={autoComplete}\n style={style}\n color={color}\n fontSize={fontSize}\n placeholderTextColor={placeholderTextColor}\n maxLength={maxLength}\n aria-invalid={ariaInvalid}\n aria-describedby={ariaDescribedBy}\n aria-labelledby={ariaLabelledBy}\n aria-label={ariaLabel}\n aria-disabled={ariaDisabled}\n data-testid={dataTestId}\n {...rest}\n />\n );\n }\n);\n\nInputPrimitive.displayName = \"InputPrimitive\";\n","import React, { forwardRef } from \"react\";\nimport styled from \"styled-components\";\nimport { TextAreaPrimitiveProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledTextArea = styled.textarea<TextAreaPrimitiveProps>`\n background: transparent;\n border: none;\n outline: none;\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-family: inherit;\n text-align: inherit;\n resize: none;\n\n &::placeholder {\n color: ${(props) =>\n props.placeholderTextColor || \"rgba(255, 255, 255, 0.5)\"};\n }\n\n &:disabled {\n cursor: not-allowed;\n }\n`;\n\nexport const TextAreaPrimitive = forwardRef<\n HTMLTextAreaElement,\n TextAreaPrimitiveProps\n>(\n (\n {\n value,\n placeholder,\n onChangeText,\n onFocus,\n onBlur,\n onKeyDown,\n disabled,\n style,\n color,\n fontSize,\n placeholderTextColor,\n maxLength,\n rows,\n },\n ref\n ) => {\n return (\n <StyledTextArea\n ref={ref}\n value={value}\n placeholder={placeholder}\n onChange={(e) => onChangeText?.(e.target.value)}\n onFocus={onFocus}\n onBlur={onBlur}\n onKeyDown={onKeyDown}\n disabled={disabled}\n style={style}\n color={color}\n fontSize={fontSize}\n placeholderTextColor={placeholderTextColor}\n maxLength={maxLength}\n rows={rows}\n />\n );\n }\n);\n\nTextAreaPrimitive.displayName = \"TextAreaPrimitive\";\n"],"mappings":"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","names":["forwardRef","styled","jsx","styled","jsx","styled","jsx","styled","jsx","styled","jsx","forwardRef","styled","jsx","jsx","forwardRef"]}
package/package.json ADDED
@@ -0,0 +1,24 @@
1
+ {
2
+ "name": "@xsolla/xui-status-web",
3
+ "version": "0.64.0-pr56.1768348754",
4
+ "main": "./index.js",
5
+ "module": "./index.mjs",
6
+ "types": "./index.d.ts",
7
+ "scripts": {
8
+ "build": "yarn build:web && yarn build:native",
9
+ "build:web": "PLATFORM=web tsup src/index.tsx --format esm,cjs --dts --env.PLATFORM web --clean",
10
+ "build:native": "PLATFORM=native tsup src/index.tsx --format esm,cjs --dts --env.PLATFORM native --clean"
11
+ },
12
+ "dependencies": {
13
+ "@xsolla/xui-core": "0.64.0-pr56.1768348754",
14
+ "@xsolla/xui-primitives-core": "0.64.0-pr56.1768348754"
15
+ },
16
+ "peerDependencies": {
17
+ "react": ">=16.8.0",
18
+ "styled-components": ">=4"
19
+ },
20
+ "devDependencies": {
21
+ "tsup": "^8.0.0"
22
+ },
23
+ "license": "MIT"
24
+ }