@xsolla/xui-checkbox 0.136.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 +4 -4
- package/web/index.js +86 -10
- package/web/index.js.map +1 -1
- package/web/index.mjs +81 -5
- package/web/index.mjs.map +1 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@xsolla/xui-checkbox",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.137.0",
|
|
4
4
|
"main": "./web/index.js",
|
|
5
5
|
"module": "./web/index.mjs",
|
|
6
6
|
"types": "./web/index.d.ts",
|
|
@@ -13,9 +13,9 @@
|
|
|
13
13
|
"test:coverage": "vitest run --coverage"
|
|
14
14
|
},
|
|
15
15
|
"dependencies": {
|
|
16
|
-
"@xsolla/xui-core": "0.
|
|
17
|
-
"@xsolla/xui-icons": "0.
|
|
18
|
-
"@xsolla/xui-primitives-core": "0.
|
|
16
|
+
"@xsolla/xui-core": "0.137.0",
|
|
17
|
+
"@xsolla/xui-icons": "0.137.0",
|
|
18
|
+
"@xsolla/xui-primitives-core": "0.137.0"
|
|
19
19
|
},
|
|
20
20
|
"peerDependencies": {
|
|
21
21
|
"react": ">=16.8.0",
|
package/web/index.js
CHANGED
|
@@ -35,13 +35,85 @@ __export(index_exports, {
|
|
|
35
35
|
module.exports = __toCommonJS(index_exports);
|
|
36
36
|
|
|
37
37
|
// src/Checkbox.tsx
|
|
38
|
-
var
|
|
38
|
+
var import_react3 = require("react");
|
|
39
39
|
|
|
40
40
|
// ../primitives-web/src/Box.tsx
|
|
41
|
-
var
|
|
41
|
+
var import_react2 = __toESM(require("react"));
|
|
42
42
|
var import_styled_components = __toESM(require("styled-components"));
|
|
43
|
+
|
|
44
|
+
// ../primitives-web/src/filterDOMProps.ts
|
|
45
|
+
var import_react = __toESM(require("react"));
|
|
46
|
+
|
|
47
|
+
// ../../node_modules/@emotion/memoize/dist/memoize.esm.js
|
|
48
|
+
function memoize(fn) {
|
|
49
|
+
var cache = {};
|
|
50
|
+
return function(arg) {
|
|
51
|
+
if (cache[arg] === void 0) cache[arg] = fn(arg);
|
|
52
|
+
return cache[arg];
|
|
53
|
+
};
|
|
54
|
+
}
|
|
55
|
+
var memoize_esm_default = memoize;
|
|
56
|
+
|
|
57
|
+
// ../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js
|
|
58
|
+
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)-.*))$/;
|
|
59
|
+
var index = memoize_esm_default(
|
|
60
|
+
function(prop) {
|
|
61
|
+
return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111 && prop.charCodeAt(1) === 110 && prop.charCodeAt(2) < 91;
|
|
62
|
+
}
|
|
63
|
+
/* Z+1 */
|
|
64
|
+
);
|
|
65
|
+
var is_prop_valid_esm_default = index;
|
|
66
|
+
|
|
67
|
+
// ../primitives-web/src/filterDOMProps.ts
|
|
68
|
+
var ADDITIONAL_BLOCKED_PROPS = /* @__PURE__ */ new Set([
|
|
69
|
+
// RN-only event handlers (pass isPropValid's on* pattern)
|
|
70
|
+
"onPress",
|
|
71
|
+
"onChangeText",
|
|
72
|
+
"onLayout",
|
|
73
|
+
"onMoveShouldSetResponder",
|
|
74
|
+
"onResponderGrant",
|
|
75
|
+
"onResponderMove",
|
|
76
|
+
"onResponderRelease",
|
|
77
|
+
"onResponderTerminate",
|
|
78
|
+
// SVG attributes that pass isPropValid
|
|
79
|
+
"strokeWidth",
|
|
80
|
+
// CSS properties that pass isPropValid but are used as component props
|
|
81
|
+
"overflow",
|
|
82
|
+
"cursor",
|
|
83
|
+
"fontSize",
|
|
84
|
+
"fontWeight",
|
|
85
|
+
"fontFamily",
|
|
86
|
+
"textDecoration"
|
|
87
|
+
]);
|
|
88
|
+
function shouldForwardProp(key) {
|
|
89
|
+
if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;
|
|
90
|
+
return is_prop_valid_esm_default(key);
|
|
91
|
+
}
|
|
92
|
+
function createFilteredElement(defaultTag) {
|
|
93
|
+
const Component = import_react.default.forwardRef(
|
|
94
|
+
({ children, elementType, ...props }, ref) => {
|
|
95
|
+
const Tag = elementType || defaultTag;
|
|
96
|
+
const htmlProps = {};
|
|
97
|
+
for (const key of Object.keys(props)) {
|
|
98
|
+
if (shouldForwardProp(key)) {
|
|
99
|
+
htmlProps[key] = props[key];
|
|
100
|
+
}
|
|
101
|
+
}
|
|
102
|
+
return import_react.default.createElement(
|
|
103
|
+
Tag,
|
|
104
|
+
{ ref, ...htmlProps },
|
|
105
|
+
children
|
|
106
|
+
);
|
|
107
|
+
}
|
|
108
|
+
);
|
|
109
|
+
Component.displayName = `Filtered(${defaultTag})`;
|
|
110
|
+
return Component;
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
// ../primitives-web/src/Box.tsx
|
|
43
114
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
44
|
-
var
|
|
115
|
+
var FilteredDiv = createFilteredElement("div");
|
|
116
|
+
var StyledBox = (0, import_styled_components.default)(FilteredDiv)`
|
|
45
117
|
display: flex;
|
|
46
118
|
box-sizing: border-box;
|
|
47
119
|
background-color: ${(props) => props.backgroundColor || "transparent"};
|
|
@@ -128,7 +200,7 @@ var StyledBox = import_styled_components.default.div`
|
|
|
128
200
|
${(props) => props.pressStyle?.backgroundColor && `background-color: ${props.pressStyle.backgroundColor};`}
|
|
129
201
|
}
|
|
130
202
|
`;
|
|
131
|
-
var Box =
|
|
203
|
+
var Box = import_react2.default.forwardRef(
|
|
132
204
|
({
|
|
133
205
|
children,
|
|
134
206
|
onPress,
|
|
@@ -153,6 +225,8 @@ var Box = import_react.default.forwardRef(
|
|
|
153
225
|
type,
|
|
154
226
|
disabled,
|
|
155
227
|
id,
|
|
228
|
+
testID,
|
|
229
|
+
"data-testid": dataTestId,
|
|
156
230
|
...props
|
|
157
231
|
}, ref) => {
|
|
158
232
|
if (as === "img" && src) {
|
|
@@ -180,7 +254,7 @@ var Box = import_react.default.forwardRef(
|
|
|
180
254
|
StyledBox,
|
|
181
255
|
{
|
|
182
256
|
ref,
|
|
183
|
-
as,
|
|
257
|
+
elementType: as,
|
|
184
258
|
id,
|
|
185
259
|
type: as === "button" ? type || "button" : void 0,
|
|
186
260
|
disabled: as === "button" ? disabled : void 0,
|
|
@@ -200,6 +274,7 @@ var Box = import_react.default.forwardRef(
|
|
|
200
274
|
"aria-controls": ariaControls,
|
|
201
275
|
"aria-live": ariaLive,
|
|
202
276
|
tabIndex: tabIndex !== void 0 ? tabIndex : void 0,
|
|
277
|
+
"data-testid": dataTestId || testID,
|
|
203
278
|
...props,
|
|
204
279
|
children
|
|
205
280
|
}
|
|
@@ -211,7 +286,8 @@ Box.displayName = "Box";
|
|
|
211
286
|
// ../primitives-web/src/Text.tsx
|
|
212
287
|
var import_styled_components2 = __toESM(require("styled-components"));
|
|
213
288
|
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
214
|
-
var
|
|
289
|
+
var FilteredSpan = createFilteredElement("span");
|
|
290
|
+
var StyledText = (0, import_styled_components2.default)(FilteredSpan)`
|
|
215
291
|
color: ${(props) => props.color || "inherit"};
|
|
216
292
|
font-size: ${(props) => typeof props.fontSize === "number" ? `${props.fontSize}px` : props.fontSize || "inherit"};
|
|
217
293
|
font-weight: ${(props) => props.fontWeight || "normal"};
|
|
@@ -293,7 +369,7 @@ var descriptionLineHeightMap = {
|
|
|
293
369
|
lg: 18,
|
|
294
370
|
xl: 18
|
|
295
371
|
};
|
|
296
|
-
var Checkbox = (0,
|
|
372
|
+
var Checkbox = (0, import_react3.forwardRef)(
|
|
297
373
|
function Checkbox2({
|
|
298
374
|
children,
|
|
299
375
|
size = "md",
|
|
@@ -312,8 +388,8 @@ var Checkbox = (0, import_react2.forwardRef)(
|
|
|
312
388
|
themeProductContext
|
|
313
389
|
}, ref) {
|
|
314
390
|
const { theme } = (0, import_xui_core.useResolvedTheme)({ themeMode, themeProductContext });
|
|
315
|
-
const containerRef = (0,
|
|
316
|
-
const [internalChecked, setInternalChecked] = (0,
|
|
391
|
+
const containerRef = (0, import_react3.useRef)(null);
|
|
392
|
+
const [internalChecked, setInternalChecked] = (0, import_react3.useState)(false);
|
|
317
393
|
const rawId = (0, import_xui_core.useId)();
|
|
318
394
|
const safeId = rawId.replace(/:/g, "");
|
|
319
395
|
const checkboxId = providedId || `checkbox-${safeId}`;
|
|
@@ -322,7 +398,7 @@ var Checkbox = (0, import_react2.forwardRef)(
|
|
|
322
398
|
const errorId = `${checkboxId}-error`;
|
|
323
399
|
const isControlled = checked !== void 0;
|
|
324
400
|
const isChecked = isControlled ? checked : internalChecked;
|
|
325
|
-
(0,
|
|
401
|
+
(0, import_react3.useImperativeHandle)(
|
|
326
402
|
ref,
|
|
327
403
|
() => ({
|
|
328
404
|
focus: () => containerRef.current?.focus(),
|
package/web/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/index.tsx","../../src/Checkbox.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx"],"sourcesContent":["export * from \"./Checkbox\";\n","import React, {\n forwardRef,\n useRef,\n useState,\n useImperativeHandle,\n} from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport {\n useResolvedTheme,\n useId,\n type ThemeOverrideProps,\n} from \"@xsolla/xui-core\";\nimport { Check, Minus } from \"@xsolla/xui-icons\";\n\ntype ComponentSize = \"sm\" | \"md\" | \"lg\" | \"xl\";\n\nexport interface CheckboxProps extends ThemeOverrideProps {\n /** Content/label to display next to the checkbox */\n children?: React.ReactNode;\n /** Size of the checkbox */\n size?: ComponentSize;\n /** Whether the checkbox is checked */\n checked?: boolean;\n /** The indeterminate checked state of checkbox */\n indeterminate?: boolean;\n /** Additional descriptive text below the label */\n description?: string;\n /** Error message to display (also highlights control as invalid) */\n errorMessage?: string;\n /** Highlight control as invalid without message */\n error?: boolean;\n /** Whether the checkbox is disabled */\n disabled?: boolean;\n /** Name attribute for the checkbox */\n name?: string;\n /** Value attribute for the checkbox */\n value?: string;\n /** Callback when the checkbox value changes */\n onChange?: (e: {\n target: { checked: boolean; name?: string; value?: string };\n }) => void;\n /** Unique identifier for the checkbox */\n id?: string;\n /** Accessible label for screen readers when no visible label */\n \"aria-label\"?: string;\n}\n\n// Ref type that works for both web and native\nexport interface CheckboxRef {\n focus: () => void;\n blur: () => void;\n}\n\n// Icon sizes for each component size\nconst iconSizeMap: Record<ComponentSize, number> = {\n sm: 12,\n md: 14,\n lg: 16,\n xl: 18,\n};\n\n// Checkbox box sizes\nconst checkboxSizeMap: Record<ComponentSize, number> = {\n sm: 16,\n md: 18,\n lg: 20,\n xl: 22,\n};\n\n// Label gap sizes (gap between checkbox and text)\nconst labelGapMap: Record<ComponentSize, number> = {\n sm: 8,\n md: 8,\n lg: 10,\n xl: 12,\n};\n\n// Text gap sizes (gap between label and description/error)\nconst textGapMap: Record<ComponentSize, number> = {\n sm: 0,\n md: 2,\n lg: 2,\n xl: 4,\n};\n\n// Font sizes for label (from Figma)\nconst fontSizeMap: Record<ComponentSize, number> = {\n sm: 14,\n md: 16,\n lg: 18,\n xl: 18,\n};\n\n// Line height for label (matches checkbox height for vertical centering)\nconst lineHeightMap: Record<ComponentSize, number> = {\n sm: 16,\n md: 18,\n lg: 20,\n xl: 22,\n};\n\n// Font sizes for description/error\nconst descriptionFontSizeMap: Record<ComponentSize, number> = {\n sm: 12,\n md: 14,\n lg: 16,\n xl: 16,\n};\n\n// Line height for description/error\nconst descriptionLineHeightMap: Record<ComponentSize, number> = {\n sm: 14,\n md: 16,\n lg: 18,\n xl: 18,\n};\n\nexport const Checkbox = forwardRef<CheckboxRef, CheckboxProps>(\n function Checkbox(\n {\n children,\n size = \"md\",\n checked,\n indeterminate = false,\n description,\n errorMessage,\n error,\n disabled,\n name,\n value,\n onChange,\n id: providedId,\n \"aria-label\": ariaLabel,\n themeMode,\n themeProductContext,\n },\n ref\n ) {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const containerRef = useRef<HTMLDivElement>(null);\n\n // Internal state for uncontrolled mode\n const [internalChecked, setInternalChecked] = useState(false);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const checkboxId = providedId || `checkbox-${safeId}`;\n const labelId = `${checkboxId}-label`;\n const descriptionId = `${checkboxId}-description`;\n const errorId = `${checkboxId}-error`;\n\n // Determine if controlled or uncontrolled\n const isControlled = checked !== undefined;\n const isChecked = isControlled ? checked : internalChecked;\n\n // Expose focus/blur methods via ref\n useImperativeHandle(\n ref,\n () => ({\n focus: () => containerRef.current?.focus(),\n blur: () => containerRef.current?.blur(),\n }),\n []\n );\n\n // Handle toggle for both controlled and uncontrolled modes\n const handleToggle = () => {\n if (disabled) return;\n\n // If indeterminate, always set to checked (true) for predictable UX\n const newChecked = indeterminate ? true : !isChecked;\n\n if (!isControlled) {\n setInternalChecked(newChecked);\n }\n\n onChange?.({\n target: {\n checked: newChecked,\n name,\n value,\n },\n });\n };\n\n // Handle keyboard interaction\n const handleKeyDown = (event: React.KeyboardEvent) => {\n const key = event.key;\n // Normalize Space key detection across browsers\n const isSpace = key === \" \" || key === \"Spacebar\" || key === \"Space\";\n if (isSpace || key === \"Enter\") {\n event.preventDefault();\n handleToggle();\n }\n };\n\n const isError = !!(errorMessage || error);\n const hasTexts = !!children || !!description;\n const isShowErrorMessage = !!errorMessage && hasTexts;\n const isCheckedOrIndeterminate = isChecked || indeterminate;\n\n // Build aria-describedby value\n // Only reference IDs of elements that are actually rendered\n const ariaDescribedByParts: string[] = [];\n if (description) ariaDescribedByParts.push(descriptionId);\n if (isShowErrorMessage) ariaDescribedByParts.push(errorId);\n const ariaDescribedBy =\n ariaDescribedByParts.length > 0\n ? ariaDescribedByParts.join(\" \")\n : undefined;\n\n // Resolve Colors from Theme\n const checkColors = theme.colors.control.check;\n const faintColors = theme.colors.control.faint;\n const textColors = theme.colors.control.text;\n const contentColors = theme.colors.content;\n const borderColors = theme.colors.border;\n\n /**\n * Get checkbox background color based on state\n */\n const getCheckboxBgColor = () => {\n if (disabled) {\n return checkColors.bgDisable;\n }\n if (isCheckedOrIndeterminate) {\n return checkColors.bg;\n }\n return faintColors.bg;\n };\n\n /**\n * Get checkbox border color\n */\n const getBorderColor = () => {\n if (isError && !isCheckedOrIndeterminate) {\n return borderColors.alert;\n }\n if (isCheckedOrIndeterminate && !disabled) {\n return checkColors.bg;\n }\n return faintColors.border;\n };\n\n /**\n * Get label text color\n */\n const getLabelColor = () => {\n if (disabled) return textColors.disable;\n return textColors.primary;\n };\n\n /**\n * Get description text color\n */\n const getDescriptionColor = () => {\n if (disabled) return textColors.disable;\n return contentColors.tertiary;\n };\n\n /**\n * Get error message text color\n */\n const getErrorMessageColor = () => {\n return contentColors.alert.primary;\n };\n\n /**\n * Get checkmark/minus icon color\n */\n const getIconColor = () => {\n if (disabled) return textColors.disable;\n return checkColors.icon;\n };\n\n // Determine aria-checked value\n const getAriaChecked = (): \"true\" | \"false\" | \"mixed\" => {\n if (indeterminate) return \"mixed\";\n return isChecked ? \"true\" : \"false\";\n };\n\n return (\n <Box\n id={checkboxId}\n ref={containerRef}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={labelGapMap[size]}\n onPress={handleToggle}\n disabled={disabled}\n role=\"checkbox\"\n aria-checked={getAriaChecked()}\n aria-disabled={disabled || undefined}\n aria-invalid={isError || undefined}\n aria-describedby={ariaDescribedBy}\n aria-labelledby={children ? labelId : undefined}\n aria-label={!children ? ariaLabel : undefined}\n tabIndex={disabled ? -1 : 0}\n onKeyDown={handleKeyDown}\n data-testid=\"checkbox\"\n >\n {/* Custom checkbox visual */}\n <Box\n width={checkboxSizeMap[size]}\n height={checkboxSizeMap[size]}\n backgroundColor={getCheckboxBgColor()}\n borderColor={getBorderColor()}\n borderWidth={2}\n borderRadius={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n hoverStyle={\n !disabled\n ? {\n backgroundColor: isCheckedOrIndeterminate\n ? checkColors.bgHover\n : faintColors.bgHover,\n borderColor:\n isError && !isCheckedOrIndeterminate\n ? borderColors.alert\n : isCheckedOrIndeterminate\n ? checkColors.bgHover\n : faintColors.borderHover,\n }\n : undefined\n }\n data-testid=\"checkbox__box\"\n >\n {isCheckedOrIndeterminate &&\n (indeterminate ? (\n <Minus size={iconSizeMap[size]} color={getIconColor()} />\n ) : (\n <Check size={iconSizeMap[size]} color={getIconColor()} />\n ))}\n </Box>\n\n {/* Label, Description & Error Message */}\n {hasTexts && (\n <Box\n flexDirection=\"column\"\n alignItems=\"flex-start\"\n gap={textGapMap[size]}\n >\n {children && (\n <Text\n id={labelId}\n color={getLabelColor()}\n fontSize={fontSizeMap[size]}\n lineHeight={lineHeightMap[size]}\n fontWeight={400}\n data-testid=\"checkbox__label\"\n >\n {children}\n </Text>\n )}\n {description && (\n <Text\n id={descriptionId}\n color={getDescriptionColor()}\n fontSize={descriptionFontSizeMap[size]}\n lineHeight={descriptionLineHeightMap[size]}\n data-testid=\"checkbox__description\"\n >\n {description}\n </Text>\n )}\n {isShowErrorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={getErrorMessageColor()}\n fontSize={descriptionFontSizeMap[size]}\n lineHeight={descriptionLineHeightMap[size]}\n data-testid=\"checkbox__error\"\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n )}\n </Box>\n );\n }\n);\n\nCheckbox.displayName = \"Checkbox\";\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 max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (props.disabled ? 0.5 : 1)};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n 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 '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n"],"mappings":"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","names":["import_react","styled","React","import_styled_components","import_jsx_runtime","styled","import_jsx_runtime","Checkbox"]}
|
|
1
|
+
{"version":3,"sources":["../../src/index.tsx","../../src/Checkbox.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/filterDOMProps.ts","../../../../node_modules/@emotion/memoize/dist/memoize.esm.js","../../../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js","../../../primitives-web/src/Text.tsx"],"sourcesContent":["export * from \"./Checkbox\";\n","import React, {\n forwardRef,\n useRef,\n useState,\n useImperativeHandle,\n} from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport {\n useResolvedTheme,\n useId,\n type ThemeOverrideProps,\n} from \"@xsolla/xui-core\";\nimport { Check, Minus } from \"@xsolla/xui-icons\";\n\ntype ComponentSize = \"sm\" | \"md\" | \"lg\" | \"xl\";\n\nexport interface CheckboxProps extends ThemeOverrideProps {\n /** Content/label to display next to the checkbox */\n children?: React.ReactNode;\n /** Size of the checkbox */\n size?: ComponentSize;\n /** Whether the checkbox is checked */\n checked?: boolean;\n /** The indeterminate checked state of checkbox */\n indeterminate?: boolean;\n /** Additional descriptive text below the label */\n description?: string;\n /** Error message to display (also highlights control as invalid) */\n errorMessage?: string;\n /** Highlight control as invalid without message */\n error?: boolean;\n /** Whether the checkbox is disabled */\n disabled?: boolean;\n /** Name attribute for the checkbox */\n name?: string;\n /** Value attribute for the checkbox */\n value?: string;\n /** Callback when the checkbox value changes */\n onChange?: (e: {\n target: { checked: boolean; name?: string; value?: string };\n }) => void;\n /** Unique identifier for the checkbox */\n id?: string;\n /** Accessible label for screen readers when no visible label */\n \"aria-label\"?: string;\n}\n\n// Ref type that works for both web and native\nexport interface CheckboxRef {\n focus: () => void;\n blur: () => void;\n}\n\n// Icon sizes for each component size\nconst iconSizeMap: Record<ComponentSize, number> = {\n sm: 12,\n md: 14,\n lg: 16,\n xl: 18,\n};\n\n// Checkbox box sizes\nconst checkboxSizeMap: Record<ComponentSize, number> = {\n sm: 16,\n md: 18,\n lg: 20,\n xl: 22,\n};\n\n// Label gap sizes (gap between checkbox and text)\nconst labelGapMap: Record<ComponentSize, number> = {\n sm: 8,\n md: 8,\n lg: 10,\n xl: 12,\n};\n\n// Text gap sizes (gap between label and description/error)\nconst textGapMap: Record<ComponentSize, number> = {\n sm: 0,\n md: 2,\n lg: 2,\n xl: 4,\n};\n\n// Font sizes for label (from Figma)\nconst fontSizeMap: Record<ComponentSize, number> = {\n sm: 14,\n md: 16,\n lg: 18,\n xl: 18,\n};\n\n// Line height for label (matches checkbox height for vertical centering)\nconst lineHeightMap: Record<ComponentSize, number> = {\n sm: 16,\n md: 18,\n lg: 20,\n xl: 22,\n};\n\n// Font sizes for description/error\nconst descriptionFontSizeMap: Record<ComponentSize, number> = {\n sm: 12,\n md: 14,\n lg: 16,\n xl: 16,\n};\n\n// Line height for description/error\nconst descriptionLineHeightMap: Record<ComponentSize, number> = {\n sm: 14,\n md: 16,\n lg: 18,\n xl: 18,\n};\n\nexport const Checkbox = forwardRef<CheckboxRef, CheckboxProps>(\n function Checkbox(\n {\n children,\n size = \"md\",\n checked,\n indeterminate = false,\n description,\n errorMessage,\n error,\n disabled,\n name,\n value,\n onChange,\n id: providedId,\n \"aria-label\": ariaLabel,\n themeMode,\n themeProductContext,\n },\n ref\n ) {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const containerRef = useRef<HTMLDivElement>(null);\n\n // Internal state for uncontrolled mode\n const [internalChecked, setInternalChecked] = useState(false);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const checkboxId = providedId || `checkbox-${safeId}`;\n const labelId = `${checkboxId}-label`;\n const descriptionId = `${checkboxId}-description`;\n const errorId = `${checkboxId}-error`;\n\n // Determine if controlled or uncontrolled\n const isControlled = checked !== undefined;\n const isChecked = isControlled ? checked : internalChecked;\n\n // Expose focus/blur methods via ref\n useImperativeHandle(\n ref,\n () => ({\n focus: () => containerRef.current?.focus(),\n blur: () => containerRef.current?.blur(),\n }),\n []\n );\n\n // Handle toggle for both controlled and uncontrolled modes\n const handleToggle = () => {\n if (disabled) return;\n\n // If indeterminate, always set to checked (true) for predictable UX\n const newChecked = indeterminate ? true : !isChecked;\n\n if (!isControlled) {\n setInternalChecked(newChecked);\n }\n\n onChange?.({\n target: {\n checked: newChecked,\n name,\n value,\n },\n });\n };\n\n // Handle keyboard interaction\n const handleKeyDown = (event: React.KeyboardEvent) => {\n const key = event.key;\n // Normalize Space key detection across browsers\n const isSpace = key === \" \" || key === \"Spacebar\" || key === \"Space\";\n if (isSpace || key === \"Enter\") {\n event.preventDefault();\n handleToggle();\n }\n };\n\n const isError = !!(errorMessage || error);\n const hasTexts = !!children || !!description;\n const isShowErrorMessage = !!errorMessage && hasTexts;\n const isCheckedOrIndeterminate = isChecked || indeterminate;\n\n // Build aria-describedby value\n // Only reference IDs of elements that are actually rendered\n const ariaDescribedByParts: string[] = [];\n if (description) ariaDescribedByParts.push(descriptionId);\n if (isShowErrorMessage) ariaDescribedByParts.push(errorId);\n const ariaDescribedBy =\n ariaDescribedByParts.length > 0\n ? ariaDescribedByParts.join(\" \")\n : undefined;\n\n // Resolve Colors from Theme\n const checkColors = theme.colors.control.check;\n const faintColors = theme.colors.control.faint;\n const textColors = theme.colors.control.text;\n const contentColors = theme.colors.content;\n const borderColors = theme.colors.border;\n\n /**\n * Get checkbox background color based on state\n */\n const getCheckboxBgColor = () => {\n if (disabled) {\n return checkColors.bgDisable;\n }\n if (isCheckedOrIndeterminate) {\n return checkColors.bg;\n }\n return faintColors.bg;\n };\n\n /**\n * Get checkbox border color\n */\n const getBorderColor = () => {\n if (isError && !isCheckedOrIndeterminate) {\n return borderColors.alert;\n }\n if (isCheckedOrIndeterminate && !disabled) {\n return checkColors.bg;\n }\n return faintColors.border;\n };\n\n /**\n * Get label text color\n */\n const getLabelColor = () => {\n if (disabled) return textColors.disable;\n return textColors.primary;\n };\n\n /**\n * Get description text color\n */\n const getDescriptionColor = () => {\n if (disabled) return textColors.disable;\n return contentColors.tertiary;\n };\n\n /**\n * Get error message text color\n */\n const getErrorMessageColor = () => {\n return contentColors.alert.primary;\n };\n\n /**\n * Get checkmark/minus icon color\n */\n const getIconColor = () => {\n if (disabled) return textColors.disable;\n return checkColors.icon;\n };\n\n // Determine aria-checked value\n const getAriaChecked = (): \"true\" | \"false\" | \"mixed\" => {\n if (indeterminate) return \"mixed\";\n return isChecked ? \"true\" : \"false\";\n };\n\n return (\n <Box\n id={checkboxId}\n ref={containerRef}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={labelGapMap[size]}\n onPress={handleToggle}\n disabled={disabled}\n role=\"checkbox\"\n aria-checked={getAriaChecked()}\n aria-disabled={disabled || undefined}\n aria-invalid={isError || undefined}\n aria-describedby={ariaDescribedBy}\n aria-labelledby={children ? labelId : undefined}\n aria-label={!children ? ariaLabel : undefined}\n tabIndex={disabled ? -1 : 0}\n onKeyDown={handleKeyDown}\n data-testid=\"checkbox\"\n >\n {/* Custom checkbox visual */}\n <Box\n width={checkboxSizeMap[size]}\n height={checkboxSizeMap[size]}\n backgroundColor={getCheckboxBgColor()}\n borderColor={getBorderColor()}\n borderWidth={2}\n borderRadius={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n hoverStyle={\n !disabled\n ? {\n backgroundColor: isCheckedOrIndeterminate\n ? checkColors.bgHover\n : faintColors.bgHover,\n borderColor:\n isError && !isCheckedOrIndeterminate\n ? borderColors.alert\n : isCheckedOrIndeterminate\n ? checkColors.bgHover\n : faintColors.borderHover,\n }\n : undefined\n }\n data-testid=\"checkbox__box\"\n >\n {isCheckedOrIndeterminate &&\n (indeterminate ? (\n <Minus size={iconSizeMap[size]} color={getIconColor()} />\n ) : (\n <Check size={iconSizeMap[size]} color={getIconColor()} />\n ))}\n </Box>\n\n {/* Label, Description & Error Message */}\n {hasTexts && (\n <Box\n flexDirection=\"column\"\n alignItems=\"flex-start\"\n gap={textGapMap[size]}\n >\n {children && (\n <Text\n id={labelId}\n color={getLabelColor()}\n fontSize={fontSizeMap[size]}\n lineHeight={lineHeightMap[size]}\n fontWeight={400}\n data-testid=\"checkbox__label\"\n >\n {children}\n </Text>\n )}\n {description && (\n <Text\n id={descriptionId}\n color={getDescriptionColor()}\n fontSize={descriptionFontSizeMap[size]}\n lineHeight={descriptionLineHeightMap[size]}\n data-testid=\"checkbox__description\"\n >\n {description}\n </Text>\n )}\n {isShowErrorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={getErrorMessageColor()}\n fontSize={descriptionFontSizeMap[size]}\n lineHeight={descriptionLineHeightMap[size]}\n data-testid=\"checkbox__error\"\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n )}\n </Box>\n );\n }\n);\n\nCheckbox.displayName = \"Checkbox\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (props.disabled ? 0.5 : 1)};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n type,\n disabled,\n id,\n testID,\n \"data-testid\": dataTestId,\n ...props\n },\n ref\n ) => {\n // Handle as=\"img\" for rendering images with proper border-radius\n if (as === \"img\" && src) {\n return (\n <img\n src={src}\n alt={alt || \"\"}\n 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 elementType={as}\n id={id}\n type={as === \"button\" ? type || \"button\" : undefined}\n disabled={as === \"button\" ? disabled : undefined}\n onClick={onPress}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n role={role}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-current={ariaCurrent}\n aria-disabled={ariaDisabled}\n aria-busy={ariaBusy}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n aria-live={ariaLive}\n tabIndex={tabIndex !== undefined ? tabIndex : undefined}\n data-testid={dataTestId || testID}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport isPropValid from \"@emotion/is-prop-valid\";\n\n// Props that @emotion/is-prop-valid incorrectly treats as valid HTML.\n// These are React Native or component-specific props that match\n// valid HTML patterns (on* event handlers, SVG attributes).\nexport const ADDITIONAL_BLOCKED_PROPS = new Set([\n // RN-only event handlers (pass isPropValid's on* pattern)\n \"onPress\",\n \"onChangeText\",\n \"onLayout\",\n \"onMoveShouldSetResponder\",\n \"onResponderGrant\",\n \"onResponderMove\",\n \"onResponderRelease\",\n \"onResponderTerminate\",\n // SVG attributes that pass isPropValid\n \"strokeWidth\",\n // CSS properties that pass isPropValid but are used as component props\n \"overflow\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n]);\n\nfunction shouldForwardProp(key: string): boolean {\n if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;\n return isPropValid(key);\n}\n\n/**\n * Creates a React component that renders the given HTML tag\n * but filters out non-HTML props before they reach the DOM.\n *\n * Uses @emotion/is-prop-valid (same library styled-components v4\n * uses internally) to automatically block invalid HTML attributes,\n * plus a small blocklist for false positives (RN on* handlers, SVG attrs).\n *\n * Usage: `const FilteredDiv = createFilteredElement(\"div\");`\n * Then: `const StyledBox = styled(FilteredDiv)<BoxProps>\\`...\\`;`\n *\n * styled-components can still read ALL props for CSS interpolation,\n * but only valid HTML attributes are forwarded to the DOM element.\n */\nexport function createFilteredElement(defaultTag: string) {\n const Component = React.forwardRef<HTMLElement, Record<string, unknown>>(\n ({ children, elementType, ...props }, ref) => {\n const Tag = (elementType as string) || defaultTag;\n const htmlProps: Record<string, unknown> = {};\n for (const key of Object.keys(props)) {\n if (shouldForwardProp(key)) {\n htmlProps[key] = props[key];\n }\n }\n return React.createElement(\n Tag,\n { ref, ...htmlProps },\n children as React.ReactNode\n );\n }\n );\n Component.displayName = `Filtered(${defaultTag})`;\n return Component;\n}\n","function memoize(fn) {\n var cache = {};\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport default memoize;\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|inert|itemProp|itemScope|itemType|itemID|itemRef|on|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar index = memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport default index;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredSpan = createFilteredElement(\"span\");\n\nconst StyledText = styled(FilteredSpan)<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n"],"mappings":"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","names":["import_react","import_react","React","styled","React","import_styled_components","import_jsx_runtime","styled","import_jsx_runtime","Checkbox"]}
|
package/web/index.mjs
CHANGED
|
@@ -7,10 +7,82 @@ import {
|
|
|
7
7
|
} from "react";
|
|
8
8
|
|
|
9
9
|
// ../primitives-web/src/Box.tsx
|
|
10
|
-
import
|
|
10
|
+
import React2 from "react";
|
|
11
11
|
import styled from "styled-components";
|
|
12
|
+
|
|
13
|
+
// ../primitives-web/src/filterDOMProps.ts
|
|
14
|
+
import React from "react";
|
|
15
|
+
|
|
16
|
+
// ../../node_modules/@emotion/memoize/dist/memoize.esm.js
|
|
17
|
+
function memoize(fn) {
|
|
18
|
+
var cache = {};
|
|
19
|
+
return function(arg) {
|
|
20
|
+
if (cache[arg] === void 0) cache[arg] = fn(arg);
|
|
21
|
+
return cache[arg];
|
|
22
|
+
};
|
|
23
|
+
}
|
|
24
|
+
var memoize_esm_default = memoize;
|
|
25
|
+
|
|
26
|
+
// ../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js
|
|
27
|
+
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)-.*))$/;
|
|
28
|
+
var index = memoize_esm_default(
|
|
29
|
+
function(prop) {
|
|
30
|
+
return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111 && prop.charCodeAt(1) === 110 && prop.charCodeAt(2) < 91;
|
|
31
|
+
}
|
|
32
|
+
/* Z+1 */
|
|
33
|
+
);
|
|
34
|
+
var is_prop_valid_esm_default = index;
|
|
35
|
+
|
|
36
|
+
// ../primitives-web/src/filterDOMProps.ts
|
|
37
|
+
var ADDITIONAL_BLOCKED_PROPS = /* @__PURE__ */ new Set([
|
|
38
|
+
// RN-only event handlers (pass isPropValid's on* pattern)
|
|
39
|
+
"onPress",
|
|
40
|
+
"onChangeText",
|
|
41
|
+
"onLayout",
|
|
42
|
+
"onMoveShouldSetResponder",
|
|
43
|
+
"onResponderGrant",
|
|
44
|
+
"onResponderMove",
|
|
45
|
+
"onResponderRelease",
|
|
46
|
+
"onResponderTerminate",
|
|
47
|
+
// SVG attributes that pass isPropValid
|
|
48
|
+
"strokeWidth",
|
|
49
|
+
// CSS properties that pass isPropValid but are used as component props
|
|
50
|
+
"overflow",
|
|
51
|
+
"cursor",
|
|
52
|
+
"fontSize",
|
|
53
|
+
"fontWeight",
|
|
54
|
+
"fontFamily",
|
|
55
|
+
"textDecoration"
|
|
56
|
+
]);
|
|
57
|
+
function shouldForwardProp(key) {
|
|
58
|
+
if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;
|
|
59
|
+
return is_prop_valid_esm_default(key);
|
|
60
|
+
}
|
|
61
|
+
function createFilteredElement(defaultTag) {
|
|
62
|
+
const Component = React.forwardRef(
|
|
63
|
+
({ children, elementType, ...props }, ref) => {
|
|
64
|
+
const Tag = elementType || defaultTag;
|
|
65
|
+
const htmlProps = {};
|
|
66
|
+
for (const key of Object.keys(props)) {
|
|
67
|
+
if (shouldForwardProp(key)) {
|
|
68
|
+
htmlProps[key] = props[key];
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
return React.createElement(
|
|
72
|
+
Tag,
|
|
73
|
+
{ ref, ...htmlProps },
|
|
74
|
+
children
|
|
75
|
+
);
|
|
76
|
+
}
|
|
77
|
+
);
|
|
78
|
+
Component.displayName = `Filtered(${defaultTag})`;
|
|
79
|
+
return Component;
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
// ../primitives-web/src/Box.tsx
|
|
12
83
|
import { jsx } from "react/jsx-runtime";
|
|
13
|
-
var
|
|
84
|
+
var FilteredDiv = createFilteredElement("div");
|
|
85
|
+
var StyledBox = styled(FilteredDiv)`
|
|
14
86
|
display: flex;
|
|
15
87
|
box-sizing: border-box;
|
|
16
88
|
background-color: ${(props) => props.backgroundColor || "transparent"};
|
|
@@ -97,7 +169,7 @@ var StyledBox = styled.div`
|
|
|
97
169
|
${(props) => props.pressStyle?.backgroundColor && `background-color: ${props.pressStyle.backgroundColor};`}
|
|
98
170
|
}
|
|
99
171
|
`;
|
|
100
|
-
var Box =
|
|
172
|
+
var Box = React2.forwardRef(
|
|
101
173
|
({
|
|
102
174
|
children,
|
|
103
175
|
onPress,
|
|
@@ -122,6 +194,8 @@ var Box = React.forwardRef(
|
|
|
122
194
|
type,
|
|
123
195
|
disabled,
|
|
124
196
|
id,
|
|
197
|
+
testID,
|
|
198
|
+
"data-testid": dataTestId,
|
|
125
199
|
...props
|
|
126
200
|
}, ref) => {
|
|
127
201
|
if (as === "img" && src) {
|
|
@@ -149,7 +223,7 @@ var Box = React.forwardRef(
|
|
|
149
223
|
StyledBox,
|
|
150
224
|
{
|
|
151
225
|
ref,
|
|
152
|
-
as,
|
|
226
|
+
elementType: as,
|
|
153
227
|
id,
|
|
154
228
|
type: as === "button" ? type || "button" : void 0,
|
|
155
229
|
disabled: as === "button" ? disabled : void 0,
|
|
@@ -169,6 +243,7 @@ var Box = React.forwardRef(
|
|
|
169
243
|
"aria-controls": ariaControls,
|
|
170
244
|
"aria-live": ariaLive,
|
|
171
245
|
tabIndex: tabIndex !== void 0 ? tabIndex : void 0,
|
|
246
|
+
"data-testid": dataTestId || testID,
|
|
172
247
|
...props,
|
|
173
248
|
children
|
|
174
249
|
}
|
|
@@ -180,7 +255,8 @@ Box.displayName = "Box";
|
|
|
180
255
|
// ../primitives-web/src/Text.tsx
|
|
181
256
|
import styled2 from "styled-components";
|
|
182
257
|
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
183
|
-
var
|
|
258
|
+
var FilteredSpan = createFilteredElement("span");
|
|
259
|
+
var StyledText = styled2(FilteredSpan)`
|
|
184
260
|
color: ${(props) => props.color || "inherit"};
|
|
185
261
|
font-size: ${(props) => typeof props.fontSize === "number" ? `${props.fontSize}px` : props.fontSize || "inherit"};
|
|
186
262
|
font-weight: ${(props) => props.fontWeight || "normal"};
|
package/web/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Checkbox.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx"],"sourcesContent":["import React, {\n forwardRef,\n useRef,\n useState,\n useImperativeHandle,\n} from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport {\n useResolvedTheme,\n useId,\n type ThemeOverrideProps,\n} from \"@xsolla/xui-core\";\nimport { Check, Minus } from \"@xsolla/xui-icons\";\n\ntype ComponentSize = \"sm\" | \"md\" | \"lg\" | \"xl\";\n\nexport interface CheckboxProps extends ThemeOverrideProps {\n /** Content/label to display next to the checkbox */\n children?: React.ReactNode;\n /** Size of the checkbox */\n size?: ComponentSize;\n /** Whether the checkbox is checked */\n checked?: boolean;\n /** The indeterminate checked state of checkbox */\n indeterminate?: boolean;\n /** Additional descriptive text below the label */\n description?: string;\n /** Error message to display (also highlights control as invalid) */\n errorMessage?: string;\n /** Highlight control as invalid without message */\n error?: boolean;\n /** Whether the checkbox is disabled */\n disabled?: boolean;\n /** Name attribute for the checkbox */\n name?: string;\n /** Value attribute for the checkbox */\n value?: string;\n /** Callback when the checkbox value changes */\n onChange?: (e: {\n target: { checked: boolean; name?: string; value?: string };\n }) => void;\n /** Unique identifier for the checkbox */\n id?: string;\n /** Accessible label for screen readers when no visible label */\n \"aria-label\"?: string;\n}\n\n// Ref type that works for both web and native\nexport interface CheckboxRef {\n focus: () => void;\n blur: () => void;\n}\n\n// Icon sizes for each component size\nconst iconSizeMap: Record<ComponentSize, number> = {\n sm: 12,\n md: 14,\n lg: 16,\n xl: 18,\n};\n\n// Checkbox box sizes\nconst checkboxSizeMap: Record<ComponentSize, number> = {\n sm: 16,\n md: 18,\n lg: 20,\n xl: 22,\n};\n\n// Label gap sizes (gap between checkbox and text)\nconst labelGapMap: Record<ComponentSize, number> = {\n sm: 8,\n md: 8,\n lg: 10,\n xl: 12,\n};\n\n// Text gap sizes (gap between label and description/error)\nconst textGapMap: Record<ComponentSize, number> = {\n sm: 0,\n md: 2,\n lg: 2,\n xl: 4,\n};\n\n// Font sizes for label (from Figma)\nconst fontSizeMap: Record<ComponentSize, number> = {\n sm: 14,\n md: 16,\n lg: 18,\n xl: 18,\n};\n\n// Line height for label (matches checkbox height for vertical centering)\nconst lineHeightMap: Record<ComponentSize, number> = {\n sm: 16,\n md: 18,\n lg: 20,\n xl: 22,\n};\n\n// Font sizes for description/error\nconst descriptionFontSizeMap: Record<ComponentSize, number> = {\n sm: 12,\n md: 14,\n lg: 16,\n xl: 16,\n};\n\n// Line height for description/error\nconst descriptionLineHeightMap: Record<ComponentSize, number> = {\n sm: 14,\n md: 16,\n lg: 18,\n xl: 18,\n};\n\nexport const Checkbox = forwardRef<CheckboxRef, CheckboxProps>(\n function Checkbox(\n {\n children,\n size = \"md\",\n checked,\n indeterminate = false,\n description,\n errorMessage,\n error,\n disabled,\n name,\n value,\n onChange,\n id: providedId,\n \"aria-label\": ariaLabel,\n themeMode,\n themeProductContext,\n },\n ref\n ) {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const containerRef = useRef<HTMLDivElement>(null);\n\n // Internal state for uncontrolled mode\n const [internalChecked, setInternalChecked] = useState(false);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const checkboxId = providedId || `checkbox-${safeId}`;\n const labelId = `${checkboxId}-label`;\n const descriptionId = `${checkboxId}-description`;\n const errorId = `${checkboxId}-error`;\n\n // Determine if controlled or uncontrolled\n const isControlled = checked !== undefined;\n const isChecked = isControlled ? checked : internalChecked;\n\n // Expose focus/blur methods via ref\n useImperativeHandle(\n ref,\n () => ({\n focus: () => containerRef.current?.focus(),\n blur: () => containerRef.current?.blur(),\n }),\n []\n );\n\n // Handle toggle for both controlled and uncontrolled modes\n const handleToggle = () => {\n if (disabled) return;\n\n // If indeterminate, always set to checked (true) for predictable UX\n const newChecked = indeterminate ? true : !isChecked;\n\n if (!isControlled) {\n setInternalChecked(newChecked);\n }\n\n onChange?.({\n target: {\n checked: newChecked,\n name,\n value,\n },\n });\n };\n\n // Handle keyboard interaction\n const handleKeyDown = (event: React.KeyboardEvent) => {\n const key = event.key;\n // Normalize Space key detection across browsers\n const isSpace = key === \" \" || key === \"Spacebar\" || key === \"Space\";\n if (isSpace || key === \"Enter\") {\n event.preventDefault();\n handleToggle();\n }\n };\n\n const isError = !!(errorMessage || error);\n const hasTexts = !!children || !!description;\n const isShowErrorMessage = !!errorMessage && hasTexts;\n const isCheckedOrIndeterminate = isChecked || indeterminate;\n\n // Build aria-describedby value\n // Only reference IDs of elements that are actually rendered\n const ariaDescribedByParts: string[] = [];\n if (description) ariaDescribedByParts.push(descriptionId);\n if (isShowErrorMessage) ariaDescribedByParts.push(errorId);\n const ariaDescribedBy =\n ariaDescribedByParts.length > 0\n ? ariaDescribedByParts.join(\" \")\n : undefined;\n\n // Resolve Colors from Theme\n const checkColors = theme.colors.control.check;\n const faintColors = theme.colors.control.faint;\n const textColors = theme.colors.control.text;\n const contentColors = theme.colors.content;\n const borderColors = theme.colors.border;\n\n /**\n * Get checkbox background color based on state\n */\n const getCheckboxBgColor = () => {\n if (disabled) {\n return checkColors.bgDisable;\n }\n if (isCheckedOrIndeterminate) {\n return checkColors.bg;\n }\n return faintColors.bg;\n };\n\n /**\n * Get checkbox border color\n */\n const getBorderColor = () => {\n if (isError && !isCheckedOrIndeterminate) {\n return borderColors.alert;\n }\n if (isCheckedOrIndeterminate && !disabled) {\n return checkColors.bg;\n }\n return faintColors.border;\n };\n\n /**\n * Get label text color\n */\n const getLabelColor = () => {\n if (disabled) return textColors.disable;\n return textColors.primary;\n };\n\n /**\n * Get description text color\n */\n const getDescriptionColor = () => {\n if (disabled) return textColors.disable;\n return contentColors.tertiary;\n };\n\n /**\n * Get error message text color\n */\n const getErrorMessageColor = () => {\n return contentColors.alert.primary;\n };\n\n /**\n * Get checkmark/minus icon color\n */\n const getIconColor = () => {\n if (disabled) return textColors.disable;\n return checkColors.icon;\n };\n\n // Determine aria-checked value\n const getAriaChecked = (): \"true\" | \"false\" | \"mixed\" => {\n if (indeterminate) return \"mixed\";\n return isChecked ? \"true\" : \"false\";\n };\n\n return (\n <Box\n id={checkboxId}\n ref={containerRef}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={labelGapMap[size]}\n onPress={handleToggle}\n disabled={disabled}\n role=\"checkbox\"\n aria-checked={getAriaChecked()}\n aria-disabled={disabled || undefined}\n aria-invalid={isError || undefined}\n aria-describedby={ariaDescribedBy}\n aria-labelledby={children ? labelId : undefined}\n aria-label={!children ? ariaLabel : undefined}\n tabIndex={disabled ? -1 : 0}\n onKeyDown={handleKeyDown}\n data-testid=\"checkbox\"\n >\n {/* Custom checkbox visual */}\n <Box\n width={checkboxSizeMap[size]}\n height={checkboxSizeMap[size]}\n backgroundColor={getCheckboxBgColor()}\n borderColor={getBorderColor()}\n borderWidth={2}\n borderRadius={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n hoverStyle={\n !disabled\n ? {\n backgroundColor: isCheckedOrIndeterminate\n ? checkColors.bgHover\n : faintColors.bgHover,\n borderColor:\n isError && !isCheckedOrIndeterminate\n ? borderColors.alert\n : isCheckedOrIndeterminate\n ? checkColors.bgHover\n : faintColors.borderHover,\n }\n : undefined\n }\n data-testid=\"checkbox__box\"\n >\n {isCheckedOrIndeterminate &&\n (indeterminate ? (\n <Minus size={iconSizeMap[size]} color={getIconColor()} />\n ) : (\n <Check size={iconSizeMap[size]} color={getIconColor()} />\n ))}\n </Box>\n\n {/* Label, Description & Error Message */}\n {hasTexts && (\n <Box\n flexDirection=\"column\"\n alignItems=\"flex-start\"\n gap={textGapMap[size]}\n >\n {children && (\n <Text\n id={labelId}\n color={getLabelColor()}\n fontSize={fontSizeMap[size]}\n lineHeight={lineHeightMap[size]}\n fontWeight={400}\n data-testid=\"checkbox__label\"\n >\n {children}\n </Text>\n )}\n {description && (\n <Text\n id={descriptionId}\n color={getDescriptionColor()}\n fontSize={descriptionFontSizeMap[size]}\n lineHeight={descriptionLineHeightMap[size]}\n data-testid=\"checkbox__description\"\n >\n {description}\n </Text>\n )}\n {isShowErrorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={getErrorMessageColor()}\n fontSize={descriptionFontSizeMap[size]}\n lineHeight={descriptionLineHeightMap[size]}\n data-testid=\"checkbox__error\"\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n )}\n </Box>\n );\n }\n);\n\nCheckbox.displayName = \"Checkbox\";\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 max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (props.disabled ? 0.5 : 1)};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n 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 '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n"],"mappings":"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","names":["styled","jsx","jsx","Checkbox"]}
|
|
1
|
+
{"version":3,"sources":["../../src/Checkbox.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/filterDOMProps.ts","../../../../node_modules/@emotion/memoize/dist/memoize.esm.js","../../../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js","../../../primitives-web/src/Text.tsx"],"sourcesContent":["import React, {\n forwardRef,\n useRef,\n useState,\n useImperativeHandle,\n} from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport {\n useResolvedTheme,\n useId,\n type ThemeOverrideProps,\n} from \"@xsolla/xui-core\";\nimport { Check, Minus } from \"@xsolla/xui-icons\";\n\ntype ComponentSize = \"sm\" | \"md\" | \"lg\" | \"xl\";\n\nexport interface CheckboxProps extends ThemeOverrideProps {\n /** Content/label to display next to the checkbox */\n children?: React.ReactNode;\n /** Size of the checkbox */\n size?: ComponentSize;\n /** Whether the checkbox is checked */\n checked?: boolean;\n /** The indeterminate checked state of checkbox */\n indeterminate?: boolean;\n /** Additional descriptive text below the label */\n description?: string;\n /** Error message to display (also highlights control as invalid) */\n errorMessage?: string;\n /** Highlight control as invalid without message */\n error?: boolean;\n /** Whether the checkbox is disabled */\n disabled?: boolean;\n /** Name attribute for the checkbox */\n name?: string;\n /** Value attribute for the checkbox */\n value?: string;\n /** Callback when the checkbox value changes */\n onChange?: (e: {\n target: { checked: boolean; name?: string; value?: string };\n }) => void;\n /** Unique identifier for the checkbox */\n id?: string;\n /** Accessible label for screen readers when no visible label */\n \"aria-label\"?: string;\n}\n\n// Ref type that works for both web and native\nexport interface CheckboxRef {\n focus: () => void;\n blur: () => void;\n}\n\n// Icon sizes for each component size\nconst iconSizeMap: Record<ComponentSize, number> = {\n sm: 12,\n md: 14,\n lg: 16,\n xl: 18,\n};\n\n// Checkbox box sizes\nconst checkboxSizeMap: Record<ComponentSize, number> = {\n sm: 16,\n md: 18,\n lg: 20,\n xl: 22,\n};\n\n// Label gap sizes (gap between checkbox and text)\nconst labelGapMap: Record<ComponentSize, number> = {\n sm: 8,\n md: 8,\n lg: 10,\n xl: 12,\n};\n\n// Text gap sizes (gap between label and description/error)\nconst textGapMap: Record<ComponentSize, number> = {\n sm: 0,\n md: 2,\n lg: 2,\n xl: 4,\n};\n\n// Font sizes for label (from Figma)\nconst fontSizeMap: Record<ComponentSize, number> = {\n sm: 14,\n md: 16,\n lg: 18,\n xl: 18,\n};\n\n// Line height for label (matches checkbox height for vertical centering)\nconst lineHeightMap: Record<ComponentSize, number> = {\n sm: 16,\n md: 18,\n lg: 20,\n xl: 22,\n};\n\n// Font sizes for description/error\nconst descriptionFontSizeMap: Record<ComponentSize, number> = {\n sm: 12,\n md: 14,\n lg: 16,\n xl: 16,\n};\n\n// Line height for description/error\nconst descriptionLineHeightMap: Record<ComponentSize, number> = {\n sm: 14,\n md: 16,\n lg: 18,\n xl: 18,\n};\n\nexport const Checkbox = forwardRef<CheckboxRef, CheckboxProps>(\n function Checkbox(\n {\n children,\n size = \"md\",\n checked,\n indeterminate = false,\n description,\n errorMessage,\n error,\n disabled,\n name,\n value,\n onChange,\n id: providedId,\n \"aria-label\": ariaLabel,\n themeMode,\n themeProductContext,\n },\n ref\n ) {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const containerRef = useRef<HTMLDivElement>(null);\n\n // Internal state for uncontrolled mode\n const [internalChecked, setInternalChecked] = useState(false);\n\n // Generate unique IDs for accessibility\n const rawId = useId();\n const safeId = rawId.replace(/:/g, \"\");\n const checkboxId = providedId || `checkbox-${safeId}`;\n const labelId = `${checkboxId}-label`;\n const descriptionId = `${checkboxId}-description`;\n const errorId = `${checkboxId}-error`;\n\n // Determine if controlled or uncontrolled\n const isControlled = checked !== undefined;\n const isChecked = isControlled ? checked : internalChecked;\n\n // Expose focus/blur methods via ref\n useImperativeHandle(\n ref,\n () => ({\n focus: () => containerRef.current?.focus(),\n blur: () => containerRef.current?.blur(),\n }),\n []\n );\n\n // Handle toggle for both controlled and uncontrolled modes\n const handleToggle = () => {\n if (disabled) return;\n\n // If indeterminate, always set to checked (true) for predictable UX\n const newChecked = indeterminate ? true : !isChecked;\n\n if (!isControlled) {\n setInternalChecked(newChecked);\n }\n\n onChange?.({\n target: {\n checked: newChecked,\n name,\n value,\n },\n });\n };\n\n // Handle keyboard interaction\n const handleKeyDown = (event: React.KeyboardEvent) => {\n const key = event.key;\n // Normalize Space key detection across browsers\n const isSpace = key === \" \" || key === \"Spacebar\" || key === \"Space\";\n if (isSpace || key === \"Enter\") {\n event.preventDefault();\n handleToggle();\n }\n };\n\n const isError = !!(errorMessage || error);\n const hasTexts = !!children || !!description;\n const isShowErrorMessage = !!errorMessage && hasTexts;\n const isCheckedOrIndeterminate = isChecked || indeterminate;\n\n // Build aria-describedby value\n // Only reference IDs of elements that are actually rendered\n const ariaDescribedByParts: string[] = [];\n if (description) ariaDescribedByParts.push(descriptionId);\n if (isShowErrorMessage) ariaDescribedByParts.push(errorId);\n const ariaDescribedBy =\n ariaDescribedByParts.length > 0\n ? ariaDescribedByParts.join(\" \")\n : undefined;\n\n // Resolve Colors from Theme\n const checkColors = theme.colors.control.check;\n const faintColors = theme.colors.control.faint;\n const textColors = theme.colors.control.text;\n const contentColors = theme.colors.content;\n const borderColors = theme.colors.border;\n\n /**\n * Get checkbox background color based on state\n */\n const getCheckboxBgColor = () => {\n if (disabled) {\n return checkColors.bgDisable;\n }\n if (isCheckedOrIndeterminate) {\n return checkColors.bg;\n }\n return faintColors.bg;\n };\n\n /**\n * Get checkbox border color\n */\n const getBorderColor = () => {\n if (isError && !isCheckedOrIndeterminate) {\n return borderColors.alert;\n }\n if (isCheckedOrIndeterminate && !disabled) {\n return checkColors.bg;\n }\n return faintColors.border;\n };\n\n /**\n * Get label text color\n */\n const getLabelColor = () => {\n if (disabled) return textColors.disable;\n return textColors.primary;\n };\n\n /**\n * Get description text color\n */\n const getDescriptionColor = () => {\n if (disabled) return textColors.disable;\n return contentColors.tertiary;\n };\n\n /**\n * Get error message text color\n */\n const getErrorMessageColor = () => {\n return contentColors.alert.primary;\n };\n\n /**\n * Get checkmark/minus icon color\n */\n const getIconColor = () => {\n if (disabled) return textColors.disable;\n return checkColors.icon;\n };\n\n // Determine aria-checked value\n const getAriaChecked = (): \"true\" | \"false\" | \"mixed\" => {\n if (indeterminate) return \"mixed\";\n return isChecked ? \"true\" : \"false\";\n };\n\n return (\n <Box\n id={checkboxId}\n ref={containerRef}\n flexDirection=\"row\"\n alignItems=\"flex-start\"\n gap={labelGapMap[size]}\n onPress={handleToggle}\n disabled={disabled}\n role=\"checkbox\"\n aria-checked={getAriaChecked()}\n aria-disabled={disabled || undefined}\n aria-invalid={isError || undefined}\n aria-describedby={ariaDescribedBy}\n aria-labelledby={children ? labelId : undefined}\n aria-label={!children ? ariaLabel : undefined}\n tabIndex={disabled ? -1 : 0}\n onKeyDown={handleKeyDown}\n data-testid=\"checkbox\"\n >\n {/* Custom checkbox visual */}\n <Box\n width={checkboxSizeMap[size]}\n height={checkboxSizeMap[size]}\n backgroundColor={getCheckboxBgColor()}\n borderColor={getBorderColor()}\n borderWidth={2}\n borderRadius={2}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n hoverStyle={\n !disabled\n ? {\n backgroundColor: isCheckedOrIndeterminate\n ? checkColors.bgHover\n : faintColors.bgHover,\n borderColor:\n isError && !isCheckedOrIndeterminate\n ? borderColors.alert\n : isCheckedOrIndeterminate\n ? checkColors.bgHover\n : faintColors.borderHover,\n }\n : undefined\n }\n data-testid=\"checkbox__box\"\n >\n {isCheckedOrIndeterminate &&\n (indeterminate ? (\n <Minus size={iconSizeMap[size]} color={getIconColor()} />\n ) : (\n <Check size={iconSizeMap[size]} color={getIconColor()} />\n ))}\n </Box>\n\n {/* Label, Description & Error Message */}\n {hasTexts && (\n <Box\n flexDirection=\"column\"\n alignItems=\"flex-start\"\n gap={textGapMap[size]}\n >\n {children && (\n <Text\n id={labelId}\n color={getLabelColor()}\n fontSize={fontSizeMap[size]}\n lineHeight={lineHeightMap[size]}\n fontWeight={400}\n data-testid=\"checkbox__label\"\n >\n {children}\n </Text>\n )}\n {description && (\n <Text\n id={descriptionId}\n color={getDescriptionColor()}\n fontSize={descriptionFontSizeMap[size]}\n lineHeight={descriptionLineHeightMap[size]}\n data-testid=\"checkbox__description\"\n >\n {description}\n </Text>\n )}\n {isShowErrorMessage && (\n <Text\n id={errorId}\n role=\"alert\"\n color={getErrorMessageColor()}\n fontSize={descriptionFontSizeMap[size]}\n lineHeight={descriptionLineHeightMap[size]}\n data-testid=\"checkbox__error\"\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n )}\n </Box>\n );\n }\n);\n\nCheckbox.displayName = \"Checkbox\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (props.disabled ? 0.5 : 1)};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n type,\n disabled,\n id,\n testID,\n \"data-testid\": dataTestId,\n ...props\n },\n ref\n ) => {\n // Handle as=\"img\" for rendering images with proper border-radius\n if (as === \"img\" && src) {\n return (\n <img\n src={src}\n alt={alt || \"\"}\n 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 elementType={as}\n id={id}\n type={as === \"button\" ? type || \"button\" : undefined}\n disabled={as === \"button\" ? disabled : undefined}\n onClick={onPress}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n role={role}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-current={ariaCurrent}\n aria-disabled={ariaDisabled}\n aria-busy={ariaBusy}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n aria-live={ariaLive}\n tabIndex={tabIndex !== undefined ? tabIndex : undefined}\n data-testid={dataTestId || testID}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport isPropValid from \"@emotion/is-prop-valid\";\n\n// Props that @emotion/is-prop-valid incorrectly treats as valid HTML.\n// These are React Native or component-specific props that match\n// valid HTML patterns (on* event handlers, SVG attributes).\nexport const ADDITIONAL_BLOCKED_PROPS = new Set([\n // RN-only event handlers (pass isPropValid's on* pattern)\n \"onPress\",\n \"onChangeText\",\n \"onLayout\",\n \"onMoveShouldSetResponder\",\n \"onResponderGrant\",\n \"onResponderMove\",\n \"onResponderRelease\",\n \"onResponderTerminate\",\n // SVG attributes that pass isPropValid\n \"strokeWidth\",\n // CSS properties that pass isPropValid but are used as component props\n \"overflow\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n]);\n\nfunction shouldForwardProp(key: string): boolean {\n if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;\n return isPropValid(key);\n}\n\n/**\n * Creates a React component that renders the given HTML tag\n * but filters out non-HTML props before they reach the DOM.\n *\n * Uses @emotion/is-prop-valid (same library styled-components v4\n * uses internally) to automatically block invalid HTML attributes,\n * plus a small blocklist for false positives (RN on* handlers, SVG attrs).\n *\n * Usage: `const FilteredDiv = createFilteredElement(\"div\");`\n * Then: `const StyledBox = styled(FilteredDiv)<BoxProps>\\`...\\`;`\n *\n * styled-components can still read ALL props for CSS interpolation,\n * but only valid HTML attributes are forwarded to the DOM element.\n */\nexport function createFilteredElement(defaultTag: string) {\n const Component = React.forwardRef<HTMLElement, Record<string, unknown>>(\n ({ children, elementType, ...props }, ref) => {\n const Tag = (elementType as string) || defaultTag;\n const htmlProps: Record<string, unknown> = {};\n for (const key of Object.keys(props)) {\n if (shouldForwardProp(key)) {\n htmlProps[key] = props[key];\n }\n }\n return React.createElement(\n Tag,\n { ref, ...htmlProps },\n children as React.ReactNode\n );\n }\n );\n Component.displayName = `Filtered(${defaultTag})`;\n return Component;\n}\n","function memoize(fn) {\n var cache = {};\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport default memoize;\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|inert|itemProp|itemScope|itemType|itemID|itemRef|on|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar index = memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport default index;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredSpan = createFilteredElement(\"span\");\n\nconst StyledText = styled(FilteredSpan)<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n"],"mappings":"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","names":["React","React","styled","jsx","styled","jsx","Checkbox"]}
|