@xsolla/xui-select 0.135.0 → 0.137.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +3 -3
- package/web/index.js +98 -21
- package/web/index.js.map +1 -1
- package/web/index.mjs +87 -10
- package/web/index.mjs.map +1 -1
package/web/index.mjs
CHANGED
|
@@ -1,11 +1,83 @@
|
|
|
1
1
|
// src/Select.tsx
|
|
2
|
-
import
|
|
2
|
+
import React3, { useState, useRef, useEffect } from "react";
|
|
3
3
|
|
|
4
4
|
// ../primitives-web/src/Box.tsx
|
|
5
|
-
import
|
|
5
|
+
import React2 from "react";
|
|
6
6
|
import styled from "styled-components";
|
|
7
|
+
|
|
8
|
+
// ../primitives-web/src/filterDOMProps.ts
|
|
9
|
+
import React from "react";
|
|
10
|
+
|
|
11
|
+
// ../../node_modules/@emotion/memoize/dist/memoize.esm.js
|
|
12
|
+
function memoize(fn) {
|
|
13
|
+
var cache = {};
|
|
14
|
+
return function(arg) {
|
|
15
|
+
if (cache[arg] === void 0) cache[arg] = fn(arg);
|
|
16
|
+
return cache[arg];
|
|
17
|
+
};
|
|
18
|
+
}
|
|
19
|
+
var memoize_esm_default = memoize;
|
|
20
|
+
|
|
21
|
+
// ../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js
|
|
22
|
+
var reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|inert|itemProp|itemScope|itemType|itemID|itemRef|on|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/;
|
|
23
|
+
var index = memoize_esm_default(
|
|
24
|
+
function(prop) {
|
|
25
|
+
return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111 && prop.charCodeAt(1) === 110 && prop.charCodeAt(2) < 91;
|
|
26
|
+
}
|
|
27
|
+
/* Z+1 */
|
|
28
|
+
);
|
|
29
|
+
var is_prop_valid_esm_default = index;
|
|
30
|
+
|
|
31
|
+
// ../primitives-web/src/filterDOMProps.ts
|
|
32
|
+
var ADDITIONAL_BLOCKED_PROPS = /* @__PURE__ */ new Set([
|
|
33
|
+
// RN-only event handlers (pass isPropValid's on* pattern)
|
|
34
|
+
"onPress",
|
|
35
|
+
"onChangeText",
|
|
36
|
+
"onLayout",
|
|
37
|
+
"onMoveShouldSetResponder",
|
|
38
|
+
"onResponderGrant",
|
|
39
|
+
"onResponderMove",
|
|
40
|
+
"onResponderRelease",
|
|
41
|
+
"onResponderTerminate",
|
|
42
|
+
// SVG attributes that pass isPropValid
|
|
43
|
+
"strokeWidth",
|
|
44
|
+
// CSS properties that pass isPropValid but are used as component props
|
|
45
|
+
"overflow",
|
|
46
|
+
"cursor",
|
|
47
|
+
"fontSize",
|
|
48
|
+
"fontWeight",
|
|
49
|
+
"fontFamily",
|
|
50
|
+
"textDecoration"
|
|
51
|
+
]);
|
|
52
|
+
function shouldForwardProp(key) {
|
|
53
|
+
if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;
|
|
54
|
+
return is_prop_valid_esm_default(key);
|
|
55
|
+
}
|
|
56
|
+
function createFilteredElement(defaultTag) {
|
|
57
|
+
const Component = React.forwardRef(
|
|
58
|
+
({ children, elementType, ...props }, ref) => {
|
|
59
|
+
const Tag = elementType || defaultTag;
|
|
60
|
+
const htmlProps = {};
|
|
61
|
+
for (const key of Object.keys(props)) {
|
|
62
|
+
if (shouldForwardProp(key)) {
|
|
63
|
+
htmlProps[key] = props[key];
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
return React.createElement(
|
|
67
|
+
Tag,
|
|
68
|
+
{ ref, ...htmlProps },
|
|
69
|
+
children
|
|
70
|
+
);
|
|
71
|
+
}
|
|
72
|
+
);
|
|
73
|
+
Component.displayName = `Filtered(${defaultTag})`;
|
|
74
|
+
return Component;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
// ../primitives-web/src/Box.tsx
|
|
7
78
|
import { jsx } from "react/jsx-runtime";
|
|
8
|
-
var
|
|
79
|
+
var FilteredDiv = createFilteredElement("div");
|
|
80
|
+
var StyledBox = styled(FilteredDiv)`
|
|
9
81
|
display: flex;
|
|
10
82
|
box-sizing: border-box;
|
|
11
83
|
background-color: ${(props) => props.backgroundColor || "transparent"};
|
|
@@ -92,7 +164,7 @@ var StyledBox = styled.div`
|
|
|
92
164
|
${(props) => props.pressStyle?.backgroundColor && `background-color: ${props.pressStyle.backgroundColor};`}
|
|
93
165
|
}
|
|
94
166
|
`;
|
|
95
|
-
var Box =
|
|
167
|
+
var Box = React2.forwardRef(
|
|
96
168
|
({
|
|
97
169
|
children,
|
|
98
170
|
onPress,
|
|
@@ -117,6 +189,8 @@ var Box = React.forwardRef(
|
|
|
117
189
|
type,
|
|
118
190
|
disabled,
|
|
119
191
|
id,
|
|
192
|
+
testID,
|
|
193
|
+
"data-testid": dataTestId,
|
|
120
194
|
...props
|
|
121
195
|
}, ref) => {
|
|
122
196
|
if (as === "img" && src) {
|
|
@@ -144,7 +218,7 @@ var Box = React.forwardRef(
|
|
|
144
218
|
StyledBox,
|
|
145
219
|
{
|
|
146
220
|
ref,
|
|
147
|
-
as,
|
|
221
|
+
elementType: as,
|
|
148
222
|
id,
|
|
149
223
|
type: as === "button" ? type || "button" : void 0,
|
|
150
224
|
disabled: as === "button" ? disabled : void 0,
|
|
@@ -164,6 +238,7 @@ var Box = React.forwardRef(
|
|
|
164
238
|
"aria-controls": ariaControls,
|
|
165
239
|
"aria-live": ariaLive,
|
|
166
240
|
tabIndex: tabIndex !== void 0 ? tabIndex : void 0,
|
|
241
|
+
"data-testid": dataTestId || testID,
|
|
167
242
|
...props,
|
|
168
243
|
children
|
|
169
244
|
}
|
|
@@ -175,7 +250,8 @@ Box.displayName = "Box";
|
|
|
175
250
|
// ../primitives-web/src/Text.tsx
|
|
176
251
|
import styled2 from "styled-components";
|
|
177
252
|
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
178
|
-
var
|
|
253
|
+
var FilteredSpan = createFilteredElement("span");
|
|
254
|
+
var StyledText = styled2(FilteredSpan)`
|
|
179
255
|
color: ${(props) => props.color || "inherit"};
|
|
180
256
|
font-size: ${(props) => typeof props.fontSize === "number" ? `${props.fontSize}px` : props.fontSize || "inherit"};
|
|
181
257
|
font-weight: ${(props) => props.fontWeight || "normal"};
|
|
@@ -208,7 +284,8 @@ var Text = ({
|
|
|
208
284
|
// ../primitives-web/src/Icon.tsx
|
|
209
285
|
import styled3 from "styled-components";
|
|
210
286
|
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
211
|
-
var
|
|
287
|
+
var FilteredDiv2 = createFilteredElement("div");
|
|
288
|
+
var StyledIcon = styled3(FilteredDiv2)`
|
|
212
289
|
display: flex;
|
|
213
290
|
align-items: center;
|
|
214
291
|
justify-content: center;
|
|
@@ -713,7 +790,7 @@ var Select = ({
|
|
|
713
790
|
const isDisable = externalState === "disable" || disabled;
|
|
714
791
|
const isError = externalState === "error" || !!errorMessage;
|
|
715
792
|
const isFocus = externalState === "focus" || isOpen;
|
|
716
|
-
|
|
793
|
+
React3.useEffect(() => {
|
|
717
794
|
if (value !== void 0) {
|
|
718
795
|
setSelectedValue(value);
|
|
719
796
|
}
|
|
@@ -955,7 +1032,7 @@ var Select = ({
|
|
|
955
1032
|
}
|
|
956
1033
|
)
|
|
957
1034
|
}
|
|
958
|
-
) : filteredOptions.map((option,
|
|
1035
|
+
) : filteredOptions.map((option, index2) => {
|
|
959
1036
|
const optionValue = getOptionValue(option);
|
|
960
1037
|
const optionLabel = getOptionLabel(option);
|
|
961
1038
|
const isOptionDisabled = getOptionDisabled(option);
|
|
@@ -992,7 +1069,7 @@ var Select = ({
|
|
|
992
1069
|
}
|
|
993
1070
|
)
|
|
994
1071
|
},
|
|
995
|
-
|
|
1072
|
+
index2
|
|
996
1073
|
);
|
|
997
1074
|
})
|
|
998
1075
|
}
|