@xsolla/xui-radio 0.127.0 → 0.129.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/native/index.d.mts +2 -1
- package/native/index.d.ts +2 -1
- package/native/index.js +13 -3
- package/native/index.js.map +1 -1
- package/native/index.mjs +14 -4
- package/native/index.mjs.map +1 -1
- package/package.json +3 -3
- package/web/index.d.mts +2 -1
- package/web/index.d.ts +2 -1
- package/web/index.js +6 -2
- package/web/index.js.map +1 -1
- package/web/index.mjs +7 -3
- package/web/index.mjs.map +1 -1
package/native/index.d.mts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { ThemeOverrideProps } from '@xsolla/xui-core';
|
|
2
3
|
|
|
3
|
-
interface RadioProps {
|
|
4
|
+
interface RadioProps extends ThemeOverrideProps {
|
|
4
5
|
/** Size of the radio button */
|
|
5
6
|
size?: "sm" | "md" | "lg" | "xl";
|
|
6
7
|
/** Whether the radio button is checked */
|
package/native/index.d.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { ThemeOverrideProps } from '@xsolla/xui-core';
|
|
2
3
|
|
|
3
|
-
interface RadioProps {
|
|
4
|
+
interface RadioProps extends ThemeOverrideProps {
|
|
4
5
|
/** Size of the radio button */
|
|
5
6
|
size?: "sm" | "md" | "lg" | "xl";
|
|
6
7
|
/** Whether the radio button is checked */
|
package/native/index.js
CHANGED
|
@@ -67,6 +67,10 @@ var Box = ({
|
|
|
67
67
|
left,
|
|
68
68
|
right,
|
|
69
69
|
width,
|
|
70
|
+
minWidth,
|
|
71
|
+
minHeight,
|
|
72
|
+
maxWidth,
|
|
73
|
+
maxHeight,
|
|
70
74
|
flex,
|
|
71
75
|
overflow,
|
|
72
76
|
zIndex,
|
|
@@ -98,6 +102,10 @@ var Box = ({
|
|
|
98
102
|
zIndex,
|
|
99
103
|
height,
|
|
100
104
|
width,
|
|
105
|
+
minWidth,
|
|
106
|
+
minHeight,
|
|
107
|
+
maxWidth,
|
|
108
|
+
maxHeight,
|
|
101
109
|
padding,
|
|
102
110
|
paddingHorizontal,
|
|
103
111
|
paddingVertical,
|
|
@@ -226,7 +234,7 @@ var Text = ({
|
|
|
226
234
|
}
|
|
227
235
|
const incomingStyle = import_react_native2.StyleSheet.flatten(styleProp);
|
|
228
236
|
const baseStyle = {
|
|
229
|
-
color,
|
|
237
|
+
color: color ?? incomingStyle?.color,
|
|
230
238
|
fontSize: typeof fontSize === "number" ? fontSize : void 0,
|
|
231
239
|
fontWeight,
|
|
232
240
|
fontFamily: resolvedFontFamily,
|
|
@@ -275,9 +283,11 @@ var Radio = ({
|
|
|
275
283
|
onPress,
|
|
276
284
|
onValueChange,
|
|
277
285
|
"aria-label": ariaLabel,
|
|
278
|
-
"aria-labelledby": ariaLabelledBy
|
|
286
|
+
"aria-labelledby": ariaLabelledBy,
|
|
287
|
+
themeMode,
|
|
288
|
+
themeProductContext
|
|
279
289
|
}) => {
|
|
280
|
-
const { theme } = (0, import_xui_core.
|
|
290
|
+
const { theme } = (0, import_xui_core.useResolvedTheme)({ themeMode, themeProductContext });
|
|
281
291
|
const radioGroup = useRadioGroup();
|
|
282
292
|
const size = propSize || radioGroup.size || "md";
|
|
283
293
|
const checked = propChecked !== void 0 ? propChecked : radioGroup.value !== void 0 && value !== void 0 ? radioGroup.value === value : false;
|
package/native/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/index.tsx","../../../primitives-native/src/Box.tsx","../../../primitives-native/src/Text.tsx","../../src/Radio.tsx"],"sourcesContent":["export * from \"./Radio\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n flexDirection,\n alignItems,\n justifyContent,\n position,\n top,\n bottom,\n left,\n right,\n width,\n flex,\n overflow,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n padding: padding as DimensionValue,\n paddingHorizontal: paddingHorizontal as DimensionValue,\n paddingVertical: paddingVertical as DimensionValue,\n margin: margin as DimensionValue,\n marginTop: marginTop as DimensionValue,\n marginBottom: marginBottom as DimensionValue,\n marginLeft: marginLeft as DimensionValue,\n marginRight: marginRight as DimensionValue,\n flexDirection,\n alignItems,\n justifyContent,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Destructure and drop web-only props from rest before passing to RN components\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": _ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": _ariaDisabled,\n \"aria-live\": _ariaLive,\n className,\n \"data-testid\": _dataTestId,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n if (onPress) {\n return (\n <Pressable\n onPress={onPress}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\n","import React from \"react\";\nimport {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string | number | undefined\n): number | undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n style: styleProp,\n ...props\n}) => {\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n if (\n resolvedFontFamily === \"Pilat Wide\" ||\n resolvedFontFamily === \"Pilat Wide Bold\" ||\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const incomingStyle = StyleSheet.flatten(styleProp) as TextStyle | undefined;\n\n const baseStyle: TextStyle = {\n color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n textAlign: textAlign ?? incomingStyle?.textAlign,\n lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),\n marginTop: parseNumericValue(\n incomingStyle?.marginTop as number | string | undefined\n ),\n marginBottom: parseNumericValue(\n incomingStyle?.marginBottom as number | string | undefined\n ),\n };\n\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText\n style={baseStyle}\n numberOfLines={numberOfLines}\n testID={id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem } from \"@xsolla/xui-core\";\n\nexport interface RadioProps {\n /** Size of the radio button */\n size?: \"sm\" | \"md\" | \"lg\" | \"xl\";\n /** Whether the radio button is checked */\n checked?: boolean;\n /** Value of the radio button (for RadioGroup) */\n value?: string;\n /** Visual state of the radio button */\n state?: \"default\" | \"hover\" | \"disable\" | \"error\";\n /** Whether the radio button is disabled */\n disabled?: boolean;\n /** Label text to display next to the radio button */\n label?: string;\n /** Description text to display below the label */\n description?: string;\n /** Error label text to display when state is 'error' */\n errorLabel?: string;\n /** Callback when the radio button is pressed */\n onPress?: () => void;\n /** Callback when the radio button value changes (for compatibility with Checkbox-like APIs) */\n onValueChange?: (value: boolean) => void;\n /** Accessible label for screen readers (if label is not provided) */\n \"aria-label\"?: string;\n /** ID of element that labels this radio */\n \"aria-labelledby\"?: string;\n}\n\n// Mocking useRadioGroup here to avoid circular dependency in local dev\n// In a real monorepo this might be handled via a shared types or core package\ndeclare const require: (id: string) => any;\nconst useRadioGroup = () => {\n try {\n return require(\"@xsolla/xui-radio-group\").useRadioGroup();\n } catch {\n return {};\n }\n};\n\nexport const Radio: React.FC<RadioProps> = ({\n size: propSize,\n checked: propChecked,\n value,\n state = \"default\",\n disabled = false,\n label,\n description,\n errorLabel,\n onPress,\n onValueChange,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n}) => {\n const { theme } = useDesignSystem();\n const radioGroup = useRadioGroup();\n\n const size = propSize || radioGroup.size || \"md\";\n const checked =\n propChecked !== undefined\n ? propChecked\n : radioGroup.value !== undefined && value !== undefined\n ? radioGroup.value === value\n : false;\n const isDisable = state === \"disable\" || disabled || radioGroup.disabled;\n const isError = state === \"error\";\n const showErrorLabel = isError && errorLabel;\n\n // Resolve Sizing\n const sizing = theme.sizing.radio(size);\n\n // Resolve Colors from Theme\n const checkColors = theme.colors.control.check;\n const textColors = theme.colors.control.text;\n\n const handlePress = () => {\n if (!isDisable) {\n if (onPress) {\n onPress();\n }\n if (radioGroup.onChange && value !== undefined) {\n radioGroup.onChange(value);\n }\n if (onValueChange) {\n onValueChange(!checked);\n }\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if (!isDisable && event.key === \" \") {\n event.preventDefault(); // Prevent scrolling on Space\n handlePress();\n }\n };\n\n const getBgColor = () => {\n if (isDisable) return checkColors.bgDisable;\n if (checked) return checkColors.bg;\n return theme.colors.control.faint.bg;\n };\n\n const getBorderColor = () => {\n if (isError && !checked) return theme.colors.border.alert;\n return \"transparent\";\n };\n\n const getTextColor = () => {\n if (isDisable) return textColors.disable;\n return textColors.primary;\n };\n\n const getDotColor = () => {\n // Disabled state uses disabled text color for dot\n if (isDisable) return textColors.disable;\n // Default state uses check text color for dot\n return checkColors.icon;\n };\n\n const dotSize = sizing.size * 0.44; // Approx 8px for 18px total size, matching Figma's 27.78% inset\n\n const getHoverStyle = () => {\n if (isDisable) return undefined;\n\n if (checked) {\n return {\n backgroundColor: checkColors.bgHover,\n };\n } else if (isError) {\n // Error + Unchecked: hover background, maintain red border\n return {\n backgroundColor: theme.colors.control.faint.bgHover,\n borderColor: theme.colors.border.alert,\n borderWidth: sizing.borderWidth,\n };\n } else {\n return {\n backgroundColor: theme.colors.control.faint.bgHover,\n borderColor: theme.colors.control.faint.borderHover,\n borderWidth: sizing.borderWidth,\n };\n }\n };\n\n return (\n <Box\n role=\"radio\"\n aria-checked={checked}\n aria-disabled={isDisable || undefined}\n aria-invalid={isError || undefined}\n aria-label={\n ariaLabelledBy\n ? undefined\n : ariaLabel || (label ? undefined : \"Radio button\")\n }\n aria-labelledby={ariaLabelledBy}\n tabIndex={isDisable ? -1 : 0}\n flexDirection=\"row\"\n alignItems={description || showErrorLabel ? \"flex-start\" : \"center\"}\n gap={sizing.labelGap}\n onPress={handlePress}\n onKeyDown={handleKeyDown}\n cursor={!isDisable ? \"pointer\" : \"default\"}\n >\n <Box\n width={sizing.size}\n height={sizing.size}\n backgroundColor={getBgColor()}\n borderColor={getBorderColor()}\n borderWidth={isError && !checked ? sizing.borderWidth : 0}\n borderRadius={999}\n alignItems=\"center\"\n justifyContent=\"center\"\n hoverStyle={getHoverStyle()}\n >\n {checked && (\n <Box\n width={dotSize}\n height={dotSize}\n backgroundColor={getDotColor()}\n borderRadius={999}\n />\n )}\n </Box>\n\n {(label || description || showErrorLabel) && (\n <Box flexDirection=\"column\" gap={sizing.textGap}>\n {label && (\n <Text\n color={getTextColor()}\n fontSize={sizing.fontSize}\n lineHeight={sizing.lineHeight}\n fontWeight=\"400\"\n >\n {label}\n </Text>\n )}\n {description && (\n <Text\n color={theme.colors.content.tertiary}\n fontSize={sizing.descriptionFontSize}\n lineHeight={sizing.descriptionLineHeight}\n >\n {description}\n </Text>\n )}\n {showErrorLabel && (\n <Text\n color={theme.colors.content.alert.primary}\n fontSize={sizing.descriptionFontSize}\n lineHeight={sizing.descriptionLineHeight}\n >\n {errorLabel}\n </Text>\n )}\n </Box>\n )}\n </Box>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACCA,0BAQO;AAmID;AAhIC,IAAM,MAA0B,CAAC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,oBAAoB,CAAC,aAAkC;AAAA,IAC3D,iBACE,WAAW,YAAY,kBACnB,WAAW,kBACX;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAI;AAAA,EACN;AAEA,QAAM,cAAc,cAAc;AAIlC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB,aAAa;AAAA,IACb;AAAA,IACA,eAAe;AAAA,IACf,GAAG;AAAA,EACL,IAAI;AAGJ,MAAI,OAAO,SAAS,KAAK;AACvB,UAAM,aAAyB;AAAA,MAC7B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAI;AAAA,IACN;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,QAAQ,EAAE,KAAK,IAAI;AAAA,QACnB,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,YAAW;AAAA,QACV,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AAEA,MAAI,SAAS;AACX,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,OAAO,CAAC,EAAE,QAAQ,MAAM,kBAAkB,OAAO;AAAA,QACjD,QAAQ;AAAA,QACP,GAAG;AAAA,QAEH;AAAA;AAAA,IACH;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,kBAAkB;AAAA,MACzB,QAAQ;AAAA,MACR;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;;;ACvLA,IAAAA,uBAKO;AAmEH,IAAAC,sBAAA;AAhEJ,IAAM,UAA6C;AAAA,EACjD,OAAO;AAAA,EACP,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,MAAM;AACR;AAEA,IAAM,oBAAoB,CACxB,UACuB;AACvB,MAAI,UAAU,OAAW,QAAO;AAChC,MAAI,OAAO,UAAU,SAAU,QAAO;AACtC,QAAM,SAAS,WAAW,KAAK;AAC/B,SAAO,MAAM,MAAM,IAAI,SAAY;AACrC;AAEO,IAAM,OAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,GAAG;AACL,MAAM;AACJ,MAAI,qBAAqB,aACrB,WAAW,MAAM,GAAG,EAAE,CAAC,EAAE,QAAQ,SAAS,EAAE,EAAE,KAAK,IACnD;AAEJ,MACE,uBAAuB,gBACvB,uBAAuB,qBACvB,uBAAuB,iBACvB;AACA,yBAAqB;AAAA,EACvB;AAEA,QAAM,gBAAgB,gCAAW,QAAQ,SAAS;AAElD,QAAM,YAAuB;AAAA,IAC3B;AAAA,IACA,UAAU,OAAO,aAAa,WAAW,WAAW;AAAA,IACpD;AAAA,IACA,YAAY;AAAA,IACZ,oBAAoB,MAAM;AAAA,IAC1B,WAAW,aAAa,eAAe;AAAA,IACvC,YAAY,kBAAkB,cAAc,eAAe,UAAU;AAAA,IACrE,WAAW;AAAA,MACT,eAAe;AAAA,IACjB;AAAA,IACA,cAAc;AAAA,MACZ,eAAe;AAAA,IACjB;AAAA,EACF;AAEA,QAAM,oBAAoB,OAAO,QAAQ,IAAI,IAAI;AAEjD,SACE;AAAA,IAAC,qBAAAC;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,MACP;AAAA,MACA,QAAQ;AAAA,MACR;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;;;AC/EA,sBAAgC;AAgLtB,IAAAC,sBAAA;AAhJV,IAAM,gBAAgB,MAAM;AAC1B,MAAI;AACF,WAAO,QAAQ,yBAAyB,EAAE,cAAc;AAAA,EAC1D,QAAQ;AACN,WAAO,CAAC;AAAA,EACV;AACF;AAEO,IAAM,QAA8B,CAAC;AAAA,EAC1C,MAAM;AAAA,EACN,SAAS;AAAA,EACT;AAAA,EACA,QAAQ;AAAA,EACR,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,mBAAmB;AACrB,MAAM;AACJ,QAAM,EAAE,MAAM,QAAI,iCAAgB;AAClC,QAAM,aAAa,cAAc;AAEjC,QAAM,OAAO,YAAY,WAAW,QAAQ;AAC5C,QAAM,UACJ,gBAAgB,SACZ,cACA,WAAW,UAAU,UAAa,UAAU,SAC1C,WAAW,UAAU,QACrB;AACR,QAAM,YAAY,UAAU,aAAa,YAAY,WAAW;AAChE,QAAM,UAAU,UAAU;AAC1B,QAAM,iBAAiB,WAAW;AAGlC,QAAM,SAAS,MAAM,OAAO,MAAM,IAAI;AAGtC,QAAM,cAAc,MAAM,OAAO,QAAQ;AACzC,QAAM,aAAa,MAAM,OAAO,QAAQ;AAExC,QAAM,cAAc,MAAM;AACxB,QAAI,CAAC,WAAW;AACd,UAAI,SAAS;AACX,gBAAQ;AAAA,MACV;AACA,UAAI,WAAW,YAAY,UAAU,QAAW;AAC9C,mBAAW,SAAS,KAAK;AAAA,MAC3B;AACA,UAAI,eAAe;AACjB,sBAAc,CAAC,OAAO;AAAA,MACxB;AAAA,IACF;AAAA,EACF;AAEA,QAAM,gBAAgB,CAAC,UAA+B;AACpD,QAAI,CAAC,aAAa,MAAM,QAAQ,KAAK;AACnC,YAAM,eAAe;AACrB,kBAAY;AAAA,IACd;AAAA,EACF;AAEA,QAAM,aAAa,MAAM;AACvB,QAAI,UAAW,QAAO,YAAY;AAClC,QAAI,QAAS,QAAO,YAAY;AAChC,WAAO,MAAM,OAAO,QAAQ,MAAM;AAAA,EACpC;AAEA,QAAM,iBAAiB,MAAM;AAC3B,QAAI,WAAW,CAAC,QAAS,QAAO,MAAM,OAAO,OAAO;AACpD,WAAO;AAAA,EACT;AAEA,QAAM,eAAe,MAAM;AACzB,QAAI,UAAW,QAAO,WAAW;AACjC,WAAO,WAAW;AAAA,EACpB;AAEA,QAAM,cAAc,MAAM;AAExB,QAAI,UAAW,QAAO,WAAW;AAEjC,WAAO,YAAY;AAAA,EACrB;AAEA,QAAM,UAAU,OAAO,OAAO;AAE9B,QAAM,gBAAgB,MAAM;AAC1B,QAAI,UAAW,QAAO;AAEtB,QAAI,SAAS;AACX,aAAO;AAAA,QACL,iBAAiB,YAAY;AAAA,MAC/B;AAAA,IACF,WAAW,SAAS;AAElB,aAAO;AAAA,QACL,iBAAiB,MAAM,OAAO,QAAQ,MAAM;AAAA,QAC5C,aAAa,MAAM,OAAO,OAAO;AAAA,QACjC,aAAa,OAAO;AAAA,MACtB;AAAA,IACF,OAAO;AACL,aAAO;AAAA,QACL,iBAAiB,MAAM,OAAO,QAAQ,MAAM;AAAA,QAC5C,aAAa,MAAM,OAAO,QAAQ,MAAM;AAAA,QACxC,aAAa,OAAO;AAAA,MACtB;AAAA,IACF;AAAA,EACF;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,gBAAc;AAAA,MACd,iBAAe,aAAa;AAAA,MAC5B,gBAAc,WAAW;AAAA,MACzB,cACE,iBACI,SACA,cAAc,QAAQ,SAAY;AAAA,MAExC,mBAAiB;AAAA,MACjB,UAAU,YAAY,KAAK;AAAA,MAC3B,eAAc;AAAA,MACd,YAAY,eAAe,iBAAiB,eAAe;AAAA,MAC3D,KAAK,OAAO;AAAA,MACZ,SAAS;AAAA,MACT,WAAW;AAAA,MACX,QAAQ,CAAC,YAAY,YAAY;AAAA,MAEjC;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,OAAO;AAAA,YACd,QAAQ,OAAO;AAAA,YACf,iBAAiB,WAAW;AAAA,YAC5B,aAAa,eAAe;AAAA,YAC5B,aAAa,WAAW,CAAC,UAAU,OAAO,cAAc;AAAA,YACxD,cAAc;AAAA,YACd,YAAW;AAAA,YACX,gBAAe;AAAA,YACf,YAAY,cAAc;AAAA,YAEzB,qBACC;AAAA,cAAC;AAAA;AAAA,gBACC,OAAO;AAAA,gBACP,QAAQ;AAAA,gBACR,iBAAiB,YAAY;AAAA,gBAC7B,cAAc;AAAA;AAAA,YAChB;AAAA;AAAA,QAEJ;AAAA,SAEE,SAAS,eAAe,mBACxB,8CAAC,OAAI,eAAc,UAAS,KAAK,OAAO,SACrC;AAAA,mBACC;AAAA,YAAC;AAAA;AAAA,cACC,OAAO,aAAa;AAAA,cACpB,UAAU,OAAO;AAAA,cACjB,YAAY,OAAO;AAAA,cACnB,YAAW;AAAA,cAEV;AAAA;AAAA,UACH;AAAA,UAED,eACC;AAAA,YAAC;AAAA;AAAA,cACC,OAAO,MAAM,OAAO,QAAQ;AAAA,cAC5B,UAAU,OAAO;AAAA,cACjB,YAAY,OAAO;AAAA,cAElB;AAAA;AAAA,UACH;AAAA,UAED,kBACC;AAAA,YAAC;AAAA;AAAA,cACC,OAAO,MAAM,OAAO,QAAQ,MAAM;AAAA,cAClC,UAAU,OAAO;AAAA,cACjB,YAAY,OAAO;AAAA,cAElB;AAAA;AAAA,UACH;AAAA,WAEJ;AAAA;AAAA;AAAA,EAEJ;AAEJ;","names":["import_react_native","import_jsx_runtime","RNText","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../../src/index.tsx","../../../primitives-native/src/Box.tsx","../../../primitives-native/src/Text.tsx","../../src/Radio.tsx"],"sourcesContent":["export * from \"./Radio\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n flexDirection,\n alignItems,\n justifyContent,\n position,\n top,\n bottom,\n left,\n right,\n width,\n minWidth,\n minHeight,\n maxWidth,\n maxHeight,\n flex,\n overflow,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n minWidth: minWidth as DimensionValue,\n minHeight: minHeight as DimensionValue,\n maxWidth: maxWidth as DimensionValue,\n maxHeight: maxHeight as DimensionValue,\n padding: padding as DimensionValue,\n paddingHorizontal: paddingHorizontal as DimensionValue,\n paddingVertical: paddingVertical as DimensionValue,\n margin: margin as DimensionValue,\n marginTop: marginTop as DimensionValue,\n marginBottom: marginBottom as DimensionValue,\n marginLeft: marginLeft as DimensionValue,\n marginRight: marginRight as DimensionValue,\n flexDirection,\n alignItems,\n justifyContent,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Destructure and drop web-only props from rest before passing to RN components\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": _ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": _ariaDisabled,\n \"aria-live\": _ariaLive,\n className,\n \"data-testid\": _dataTestId,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n if (onPress) {\n return (\n <Pressable\n onPress={onPress}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\n","import React from \"react\";\nimport {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string | number | undefined\n): number | undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n style: styleProp,\n ...props\n}) => {\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n if (\n resolvedFontFamily === \"Pilat Wide\" ||\n resolvedFontFamily === \"Pilat Wide Bold\" ||\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const incomingStyle = StyleSheet.flatten(styleProp) as TextStyle | undefined;\n\n const baseStyle: TextStyle = {\n color: color ?? incomingStyle?.color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n textAlign: textAlign ?? incomingStyle?.textAlign,\n lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),\n marginTop: parseNumericValue(\n incomingStyle?.marginTop as number | string | undefined\n ),\n marginBottom: parseNumericValue(\n incomingStyle?.marginBottom as number | string | undefined\n ),\n };\n\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText\n style={baseStyle}\n numberOfLines={numberOfLines}\n testID={id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\n\nexport interface RadioProps extends ThemeOverrideProps {\n /** Size of the radio button */\n size?: \"sm\" | \"md\" | \"lg\" | \"xl\";\n /** Whether the radio button is checked */\n checked?: boolean;\n /** Value of the radio button (for RadioGroup) */\n value?: string;\n /** Visual state of the radio button */\n state?: \"default\" | \"hover\" | \"disable\" | \"error\";\n /** Whether the radio button is disabled */\n disabled?: boolean;\n /** Label text to display next to the radio button */\n label?: string;\n /** Description text to display below the label */\n description?: string;\n /** Error label text to display when state is 'error' */\n errorLabel?: string;\n /** Callback when the radio button is pressed */\n onPress?: () => void;\n /** Callback when the radio button value changes (for compatibility with Checkbox-like APIs) */\n onValueChange?: (value: boolean) => void;\n /** Accessible label for screen readers (if label is not provided) */\n \"aria-label\"?: string;\n /** ID of element that labels this radio */\n \"aria-labelledby\"?: string;\n}\n\n// Mocking useRadioGroup here to avoid circular dependency in local dev\n// In a real monorepo this might be handled via a shared types or core package\ndeclare const require: (id: string) => any;\nconst useRadioGroup = () => {\n try {\n return require(\"@xsolla/xui-radio-group\").useRadioGroup();\n } catch {\n return {};\n }\n};\n\nexport const Radio: React.FC<RadioProps> = ({\n size: propSize,\n checked: propChecked,\n value,\n state = \"default\",\n disabled = false,\n label,\n description,\n errorLabel,\n onPress,\n onValueChange,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const radioGroup = useRadioGroup();\n\n const size = propSize || radioGroup.size || \"md\";\n const checked =\n propChecked !== undefined\n ? propChecked\n : radioGroup.value !== undefined && value !== undefined\n ? radioGroup.value === value\n : false;\n const isDisable = state === \"disable\" || disabled || radioGroup.disabled;\n const isError = state === \"error\";\n const showErrorLabel = isError && errorLabel;\n\n // Resolve Sizing\n const sizing = theme.sizing.radio(size);\n\n // Resolve Colors from Theme\n const checkColors = theme.colors.control.check;\n const textColors = theme.colors.control.text;\n\n const handlePress = () => {\n if (!isDisable) {\n if (onPress) {\n onPress();\n }\n if (radioGroup.onChange && value !== undefined) {\n radioGroup.onChange(value);\n }\n if (onValueChange) {\n onValueChange(!checked);\n }\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if (!isDisable && event.key === \" \") {\n event.preventDefault(); // Prevent scrolling on Space\n handlePress();\n }\n };\n\n const getBgColor = () => {\n if (isDisable) return checkColors.bgDisable;\n if (checked) return checkColors.bg;\n return theme.colors.control.faint.bg;\n };\n\n const getBorderColor = () => {\n if (isError && !checked) return theme.colors.border.alert;\n return \"transparent\";\n };\n\n const getTextColor = () => {\n if (isDisable) return textColors.disable;\n return textColors.primary;\n };\n\n const getDotColor = () => {\n // Disabled state uses disabled text color for dot\n if (isDisable) return textColors.disable;\n // Default state uses check text color for dot\n return checkColors.icon;\n };\n\n const dotSize = sizing.size * 0.44; // Approx 8px for 18px total size, matching Figma's 27.78% inset\n\n const getHoverStyle = () => {\n if (isDisable) return undefined;\n\n if (checked) {\n return {\n backgroundColor: checkColors.bgHover,\n };\n } else if (isError) {\n // Error + Unchecked: hover background, maintain red border\n return {\n backgroundColor: theme.colors.control.faint.bgHover,\n borderColor: theme.colors.border.alert,\n borderWidth: sizing.borderWidth,\n };\n } else {\n return {\n backgroundColor: theme.colors.control.faint.bgHover,\n borderColor: theme.colors.control.faint.borderHover,\n borderWidth: sizing.borderWidth,\n };\n }\n };\n\n return (\n <Box\n role=\"radio\"\n aria-checked={checked}\n aria-disabled={isDisable || undefined}\n aria-invalid={isError || undefined}\n aria-label={\n ariaLabelledBy\n ? undefined\n : ariaLabel || (label ? undefined : \"Radio button\")\n }\n aria-labelledby={ariaLabelledBy}\n tabIndex={isDisable ? -1 : 0}\n flexDirection=\"row\"\n alignItems={description || showErrorLabel ? \"flex-start\" : \"center\"}\n gap={sizing.labelGap}\n onPress={handlePress}\n onKeyDown={handleKeyDown}\n cursor={!isDisable ? \"pointer\" : \"default\"}\n >\n <Box\n width={sizing.size}\n height={sizing.size}\n backgroundColor={getBgColor()}\n borderColor={getBorderColor()}\n borderWidth={isError && !checked ? sizing.borderWidth : 0}\n borderRadius={999}\n alignItems=\"center\"\n justifyContent=\"center\"\n hoverStyle={getHoverStyle()}\n >\n {checked && (\n <Box\n width={dotSize}\n height={dotSize}\n backgroundColor={getDotColor()}\n borderRadius={999}\n />\n )}\n </Box>\n\n {(label || description || showErrorLabel) && (\n <Box flexDirection=\"column\" gap={sizing.textGap}>\n {label && (\n <Text\n color={getTextColor()}\n fontSize={sizing.fontSize}\n lineHeight={sizing.lineHeight}\n fontWeight=\"400\"\n >\n {label}\n </Text>\n )}\n {description && (\n <Text\n color={theme.colors.content.tertiary}\n fontSize={sizing.descriptionFontSize}\n lineHeight={sizing.descriptionLineHeight}\n >\n {description}\n </Text>\n )}\n {showErrorLabel && (\n <Text\n color={theme.colors.content.alert.primary}\n fontSize={sizing.descriptionFontSize}\n lineHeight={sizing.descriptionLineHeight}\n >\n {errorLabel}\n </Text>\n )}\n </Box>\n )}\n </Box>\n );\n};\n"],"mappings":"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","names":["import_react_native","import_jsx_runtime","RNText","import_jsx_runtime"]}
|
package/native/index.mjs
CHANGED
|
@@ -52,6 +52,10 @@ var Box = ({
|
|
|
52
52
|
left,
|
|
53
53
|
right,
|
|
54
54
|
width,
|
|
55
|
+
minWidth,
|
|
56
|
+
minHeight,
|
|
57
|
+
maxWidth,
|
|
58
|
+
maxHeight,
|
|
55
59
|
flex,
|
|
56
60
|
overflow,
|
|
57
61
|
zIndex,
|
|
@@ -83,6 +87,10 @@ var Box = ({
|
|
|
83
87
|
zIndex,
|
|
84
88
|
height,
|
|
85
89
|
width,
|
|
90
|
+
minWidth,
|
|
91
|
+
minHeight,
|
|
92
|
+
maxWidth,
|
|
93
|
+
maxHeight,
|
|
86
94
|
padding,
|
|
87
95
|
paddingHorizontal,
|
|
88
96
|
paddingVertical,
|
|
@@ -214,7 +222,7 @@ var Text = ({
|
|
|
214
222
|
}
|
|
215
223
|
const incomingStyle = StyleSheet.flatten(styleProp);
|
|
216
224
|
const baseStyle = {
|
|
217
|
-
color,
|
|
225
|
+
color: color ?? incomingStyle?.color,
|
|
218
226
|
fontSize: typeof fontSize === "number" ? fontSize : void 0,
|
|
219
227
|
fontWeight,
|
|
220
228
|
fontFamily: resolvedFontFamily,
|
|
@@ -242,7 +250,7 @@ var Text = ({
|
|
|
242
250
|
};
|
|
243
251
|
|
|
244
252
|
// src/Radio.tsx
|
|
245
|
-
import {
|
|
253
|
+
import { useResolvedTheme } from "@xsolla/xui-core";
|
|
246
254
|
import { jsx as jsx3, jsxs } from "react/jsx-runtime";
|
|
247
255
|
var useRadioGroup = () => {
|
|
248
256
|
try {
|
|
@@ -263,9 +271,11 @@ var Radio = ({
|
|
|
263
271
|
onPress,
|
|
264
272
|
onValueChange,
|
|
265
273
|
"aria-label": ariaLabel,
|
|
266
|
-
"aria-labelledby": ariaLabelledBy
|
|
274
|
+
"aria-labelledby": ariaLabelledBy,
|
|
275
|
+
themeMode,
|
|
276
|
+
themeProductContext
|
|
267
277
|
}) => {
|
|
268
|
-
const { theme } =
|
|
278
|
+
const { theme } = useResolvedTheme({ themeMode, themeProductContext });
|
|
269
279
|
const radioGroup = useRadioGroup();
|
|
270
280
|
const size = propSize || radioGroup.size || "md";
|
|
271
281
|
const checked = propChecked !== void 0 ? propChecked : radioGroup.value !== void 0 && value !== void 0 ? radioGroup.value === value : false;
|
package/native/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../primitives-native/src/Box.tsx","../../../primitives-native/src/Text.tsx","../../src/Radio.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n flexDirection,\n alignItems,\n justifyContent,\n position,\n top,\n bottom,\n left,\n right,\n width,\n flex,\n overflow,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n padding: padding as DimensionValue,\n paddingHorizontal: paddingHorizontal as DimensionValue,\n paddingVertical: paddingVertical as DimensionValue,\n margin: margin as DimensionValue,\n marginTop: marginTop as DimensionValue,\n marginBottom: marginBottom as DimensionValue,\n marginLeft: marginLeft as DimensionValue,\n marginRight: marginRight as DimensionValue,\n flexDirection,\n alignItems,\n justifyContent,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Destructure and drop web-only props from rest before passing to RN components\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": _ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": _ariaDisabled,\n \"aria-live\": _ariaLive,\n className,\n \"data-testid\": _dataTestId,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n if (onPress) {\n return (\n <Pressable\n onPress={onPress}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\n","import React from \"react\";\nimport {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string | number | undefined\n): number | undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n style: styleProp,\n ...props\n}) => {\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n if (\n resolvedFontFamily === \"Pilat Wide\" ||\n resolvedFontFamily === \"Pilat Wide Bold\" ||\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const incomingStyle = StyleSheet.flatten(styleProp) as TextStyle | undefined;\n\n const baseStyle: TextStyle = {\n color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n textAlign: textAlign ?? incomingStyle?.textAlign,\n lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),\n marginTop: parseNumericValue(\n incomingStyle?.marginTop as number | string | undefined\n ),\n marginBottom: parseNumericValue(\n incomingStyle?.marginBottom as number | string | undefined\n ),\n };\n\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText\n style={baseStyle}\n numberOfLines={numberOfLines}\n testID={id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem } from \"@xsolla/xui-core\";\n\nexport interface RadioProps {\n /** Size of the radio button */\n size?: \"sm\" | \"md\" | \"lg\" | \"xl\";\n /** Whether the radio button is checked */\n checked?: boolean;\n /** Value of the radio button (for RadioGroup) */\n value?: string;\n /** Visual state of the radio button */\n state?: \"default\" | \"hover\" | \"disable\" | \"error\";\n /** Whether the radio button is disabled */\n disabled?: boolean;\n /** Label text to display next to the radio button */\n label?: string;\n /** Description text to display below the label */\n description?: string;\n /** Error label text to display when state is 'error' */\n errorLabel?: string;\n /** Callback when the radio button is pressed */\n onPress?: () => void;\n /** Callback when the radio button value changes (for compatibility with Checkbox-like APIs) */\n onValueChange?: (value: boolean) => void;\n /** Accessible label for screen readers (if label is not provided) */\n \"aria-label\"?: string;\n /** ID of element that labels this radio */\n \"aria-labelledby\"?: string;\n}\n\n// Mocking useRadioGroup here to avoid circular dependency in local dev\n// In a real monorepo this might be handled via a shared types or core package\ndeclare const require: (id: string) => any;\nconst useRadioGroup = () => {\n try {\n return require(\"@xsolla/xui-radio-group\").useRadioGroup();\n } catch {\n return {};\n }\n};\n\nexport const Radio: React.FC<RadioProps> = ({\n size: propSize,\n checked: propChecked,\n value,\n state = \"default\",\n disabled = false,\n label,\n description,\n errorLabel,\n onPress,\n onValueChange,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n}) => {\n const { theme } = useDesignSystem();\n const radioGroup = useRadioGroup();\n\n const size = propSize || radioGroup.size || \"md\";\n const checked =\n propChecked !== undefined\n ? propChecked\n : radioGroup.value !== undefined && value !== undefined\n ? radioGroup.value === value\n : false;\n const isDisable = state === \"disable\" || disabled || radioGroup.disabled;\n const isError = state === \"error\";\n const showErrorLabel = isError && errorLabel;\n\n // Resolve Sizing\n const sizing = theme.sizing.radio(size);\n\n // Resolve Colors from Theme\n const checkColors = theme.colors.control.check;\n const textColors = theme.colors.control.text;\n\n const handlePress = () => {\n if (!isDisable) {\n if (onPress) {\n onPress();\n }\n if (radioGroup.onChange && value !== undefined) {\n radioGroup.onChange(value);\n }\n if (onValueChange) {\n onValueChange(!checked);\n }\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if (!isDisable && event.key === \" \") {\n event.preventDefault(); // Prevent scrolling on Space\n handlePress();\n }\n };\n\n const getBgColor = () => {\n if (isDisable) return checkColors.bgDisable;\n if (checked) return checkColors.bg;\n return theme.colors.control.faint.bg;\n };\n\n const getBorderColor = () => {\n if (isError && !checked) return theme.colors.border.alert;\n return \"transparent\";\n };\n\n const getTextColor = () => {\n if (isDisable) return textColors.disable;\n return textColors.primary;\n };\n\n const getDotColor = () => {\n // Disabled state uses disabled text color for dot\n if (isDisable) return textColors.disable;\n // Default state uses check text color for dot\n return checkColors.icon;\n };\n\n const dotSize = sizing.size * 0.44; // Approx 8px for 18px total size, matching Figma's 27.78% inset\n\n const getHoverStyle = () => {\n if (isDisable) return undefined;\n\n if (checked) {\n return {\n backgroundColor: checkColors.bgHover,\n };\n } else if (isError) {\n // Error + Unchecked: hover background, maintain red border\n return {\n backgroundColor: theme.colors.control.faint.bgHover,\n borderColor: theme.colors.border.alert,\n borderWidth: sizing.borderWidth,\n };\n } else {\n return {\n backgroundColor: theme.colors.control.faint.bgHover,\n borderColor: theme.colors.control.faint.borderHover,\n borderWidth: sizing.borderWidth,\n };\n }\n };\n\n return (\n <Box\n role=\"radio\"\n aria-checked={checked}\n aria-disabled={isDisable || undefined}\n aria-invalid={isError || undefined}\n aria-label={\n ariaLabelledBy\n ? undefined\n : ariaLabel || (label ? undefined : \"Radio button\")\n }\n aria-labelledby={ariaLabelledBy}\n tabIndex={isDisable ? -1 : 0}\n flexDirection=\"row\"\n alignItems={description || showErrorLabel ? \"flex-start\" : \"center\"}\n gap={sizing.labelGap}\n onPress={handlePress}\n onKeyDown={handleKeyDown}\n cursor={!isDisable ? \"pointer\" : \"default\"}\n >\n <Box\n width={sizing.size}\n height={sizing.size}\n backgroundColor={getBgColor()}\n borderColor={getBorderColor()}\n borderWidth={isError && !checked ? sizing.borderWidth : 0}\n borderRadius={999}\n alignItems=\"center\"\n justifyContent=\"center\"\n hoverStyle={getHoverStyle()}\n >\n {checked && (\n <Box\n width={dotSize}\n height={dotSize}\n backgroundColor={getDotColor()}\n borderRadius={999}\n />\n )}\n </Box>\n\n {(label || description || showErrorLabel) && (\n <Box flexDirection=\"column\" gap={sizing.textGap}>\n {label && (\n <Text\n color={getTextColor()}\n fontSize={sizing.fontSize}\n lineHeight={sizing.lineHeight}\n fontWeight=\"400\"\n >\n {label}\n </Text>\n )}\n {description && (\n <Text\n color={theme.colors.content.tertiary}\n fontSize={sizing.descriptionFontSize}\n lineHeight={sizing.descriptionLineHeight}\n >\n {description}\n </Text>\n )}\n {showErrorLabel && (\n <Text\n color={theme.colors.content.alert.primary}\n fontSize={sizing.descriptionFontSize}\n lineHeight={sizing.descriptionLineHeight}\n >\n {errorLabel}\n </Text>\n )}\n </Box>\n )}\n </Box>\n );\n};\n"],"mappings":"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","names":["jsx","jsx"]}
|
|
1
|
+
{"version":3,"sources":["../../../primitives-native/src/Box.tsx","../../../primitives-native/src/Text.tsx","../../src/Radio.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n flexDirection,\n alignItems,\n justifyContent,\n position,\n top,\n bottom,\n left,\n right,\n width,\n minWidth,\n minHeight,\n maxWidth,\n maxHeight,\n flex,\n overflow,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n minWidth: minWidth as DimensionValue,\n minHeight: minHeight as DimensionValue,\n maxWidth: maxWidth as DimensionValue,\n maxHeight: maxHeight as DimensionValue,\n padding: padding as DimensionValue,\n paddingHorizontal: paddingHorizontal as DimensionValue,\n paddingVertical: paddingVertical as DimensionValue,\n margin: margin as DimensionValue,\n marginTop: marginTop as DimensionValue,\n marginBottom: marginBottom as DimensionValue,\n marginLeft: marginLeft as DimensionValue,\n marginRight: marginRight as DimensionValue,\n flexDirection,\n alignItems,\n justifyContent,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Destructure and drop web-only props from rest before passing to RN components\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": _ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": _ariaDisabled,\n \"aria-live\": _ariaLive,\n className,\n \"data-testid\": _dataTestId,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n if (onPress) {\n return (\n <Pressable\n onPress={onPress}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\n","import React from \"react\";\nimport {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string | number | undefined\n): number | undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n style: styleProp,\n ...props\n}) => {\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n if (\n resolvedFontFamily === \"Pilat Wide\" ||\n resolvedFontFamily === \"Pilat Wide Bold\" ||\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const incomingStyle = StyleSheet.flatten(styleProp) as TextStyle | undefined;\n\n const baseStyle: TextStyle = {\n color: color ?? incomingStyle?.color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n textAlign: textAlign ?? incomingStyle?.textAlign,\n lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),\n marginTop: parseNumericValue(\n incomingStyle?.marginTop as number | string | undefined\n ),\n marginBottom: parseNumericValue(\n incomingStyle?.marginBottom as number | string | undefined\n ),\n };\n\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText\n style={baseStyle}\n numberOfLines={numberOfLines}\n testID={id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\n\nexport interface RadioProps extends ThemeOverrideProps {\n /** Size of the radio button */\n size?: \"sm\" | \"md\" | \"lg\" | \"xl\";\n /** Whether the radio button is checked */\n checked?: boolean;\n /** Value of the radio button (for RadioGroup) */\n value?: string;\n /** Visual state of the radio button */\n state?: \"default\" | \"hover\" | \"disable\" | \"error\";\n /** Whether the radio button is disabled */\n disabled?: boolean;\n /** Label text to display next to the radio button */\n label?: string;\n /** Description text to display below the label */\n description?: string;\n /** Error label text to display when state is 'error' */\n errorLabel?: string;\n /** Callback when the radio button is pressed */\n onPress?: () => void;\n /** Callback when the radio button value changes (for compatibility with Checkbox-like APIs) */\n onValueChange?: (value: boolean) => void;\n /** Accessible label for screen readers (if label is not provided) */\n \"aria-label\"?: string;\n /** ID of element that labels this radio */\n \"aria-labelledby\"?: string;\n}\n\n// Mocking useRadioGroup here to avoid circular dependency in local dev\n// In a real monorepo this might be handled via a shared types or core package\ndeclare const require: (id: string) => any;\nconst useRadioGroup = () => {\n try {\n return require(\"@xsolla/xui-radio-group\").useRadioGroup();\n } catch {\n return {};\n }\n};\n\nexport const Radio: React.FC<RadioProps> = ({\n size: propSize,\n checked: propChecked,\n value,\n state = \"default\",\n disabled = false,\n label,\n description,\n errorLabel,\n onPress,\n onValueChange,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const radioGroup = useRadioGroup();\n\n const size = propSize || radioGroup.size || \"md\";\n const checked =\n propChecked !== undefined\n ? propChecked\n : radioGroup.value !== undefined && value !== undefined\n ? radioGroup.value === value\n : false;\n const isDisable = state === \"disable\" || disabled || radioGroup.disabled;\n const isError = state === \"error\";\n const showErrorLabel = isError && errorLabel;\n\n // Resolve Sizing\n const sizing = theme.sizing.radio(size);\n\n // Resolve Colors from Theme\n const checkColors = theme.colors.control.check;\n const textColors = theme.colors.control.text;\n\n const handlePress = () => {\n if (!isDisable) {\n if (onPress) {\n onPress();\n }\n if (radioGroup.onChange && value !== undefined) {\n radioGroup.onChange(value);\n }\n if (onValueChange) {\n onValueChange(!checked);\n }\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if (!isDisable && event.key === \" \") {\n event.preventDefault(); // Prevent scrolling on Space\n handlePress();\n }\n };\n\n const getBgColor = () => {\n if (isDisable) return checkColors.bgDisable;\n if (checked) return checkColors.bg;\n return theme.colors.control.faint.bg;\n };\n\n const getBorderColor = () => {\n if (isError && !checked) return theme.colors.border.alert;\n return \"transparent\";\n };\n\n const getTextColor = () => {\n if (isDisable) return textColors.disable;\n return textColors.primary;\n };\n\n const getDotColor = () => {\n // Disabled state uses disabled text color for dot\n if (isDisable) return textColors.disable;\n // Default state uses check text color for dot\n return checkColors.icon;\n };\n\n const dotSize = sizing.size * 0.44; // Approx 8px for 18px total size, matching Figma's 27.78% inset\n\n const getHoverStyle = () => {\n if (isDisable) return undefined;\n\n if (checked) {\n return {\n backgroundColor: checkColors.bgHover,\n };\n } else if (isError) {\n // Error + Unchecked: hover background, maintain red border\n return {\n backgroundColor: theme.colors.control.faint.bgHover,\n borderColor: theme.colors.border.alert,\n borderWidth: sizing.borderWidth,\n };\n } else {\n return {\n backgroundColor: theme.colors.control.faint.bgHover,\n borderColor: theme.colors.control.faint.borderHover,\n borderWidth: sizing.borderWidth,\n };\n }\n };\n\n return (\n <Box\n role=\"radio\"\n aria-checked={checked}\n aria-disabled={isDisable || undefined}\n aria-invalid={isError || undefined}\n aria-label={\n ariaLabelledBy\n ? undefined\n : ariaLabel || (label ? undefined : \"Radio button\")\n }\n aria-labelledby={ariaLabelledBy}\n tabIndex={isDisable ? -1 : 0}\n flexDirection=\"row\"\n alignItems={description || showErrorLabel ? \"flex-start\" : \"center\"}\n gap={sizing.labelGap}\n onPress={handlePress}\n onKeyDown={handleKeyDown}\n cursor={!isDisable ? \"pointer\" : \"default\"}\n >\n <Box\n width={sizing.size}\n height={sizing.size}\n backgroundColor={getBgColor()}\n borderColor={getBorderColor()}\n borderWidth={isError && !checked ? sizing.borderWidth : 0}\n borderRadius={999}\n alignItems=\"center\"\n justifyContent=\"center\"\n hoverStyle={getHoverStyle()}\n >\n {checked && (\n <Box\n width={dotSize}\n height={dotSize}\n backgroundColor={getDotColor()}\n borderRadius={999}\n />\n )}\n </Box>\n\n {(label || description || showErrorLabel) && (\n <Box flexDirection=\"column\" gap={sizing.textGap}>\n {label && (\n <Text\n color={getTextColor()}\n fontSize={sizing.fontSize}\n lineHeight={sizing.lineHeight}\n fontWeight=\"400\"\n >\n {label}\n </Text>\n )}\n {description && (\n <Text\n color={theme.colors.content.tertiary}\n fontSize={sizing.descriptionFontSize}\n lineHeight={sizing.descriptionLineHeight}\n >\n {description}\n </Text>\n )}\n {showErrorLabel && (\n <Text\n color={theme.colors.content.alert.primary}\n fontSize={sizing.descriptionFontSize}\n lineHeight={sizing.descriptionLineHeight}\n >\n {errorLabel}\n </Text>\n )}\n </Box>\n )}\n </Box>\n );\n};\n"],"mappings":"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","names":["jsx","jsx"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@xsolla/xui-radio",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.129.0",
|
|
4
4
|
"main": "./web/index.js",
|
|
5
5
|
"module": "./web/index.mjs",
|
|
6
6
|
"types": "./web/index.d.ts",
|
|
@@ -13,8 +13,8 @@
|
|
|
13
13
|
"test:coverage": "vitest run --coverage"
|
|
14
14
|
},
|
|
15
15
|
"dependencies": {
|
|
16
|
-
"@xsolla/xui-core": "0.
|
|
17
|
-
"@xsolla/xui-primitives-core": "0.
|
|
16
|
+
"@xsolla/xui-core": "0.129.0",
|
|
17
|
+
"@xsolla/xui-primitives-core": "0.129.0"
|
|
18
18
|
},
|
|
19
19
|
"peerDependencies": {
|
|
20
20
|
"react": ">=16.8.0",
|
package/web/index.d.mts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { ThemeOverrideProps } from '@xsolla/xui-core';
|
|
2
3
|
|
|
3
|
-
interface RadioProps {
|
|
4
|
+
interface RadioProps extends ThemeOverrideProps {
|
|
4
5
|
/** Size of the radio button */
|
|
5
6
|
size?: "sm" | "md" | "lg" | "xl";
|
|
6
7
|
/** Whether the radio button is checked */
|
package/web/index.d.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { ThemeOverrideProps } from '@xsolla/xui-core';
|
|
2
3
|
|
|
3
|
-
interface RadioProps {
|
|
4
|
+
interface RadioProps extends ThemeOverrideProps {
|
|
4
5
|
/** Size of the radio button */
|
|
5
6
|
size?: "sm" | "md" | "lg" | "xl";
|
|
6
7
|
/** Whether the radio button is checked */
|
package/web/index.js
CHANGED
|
@@ -72,6 +72,8 @@ var StyledBox = import_styled_components.default.div`
|
|
|
72
72
|
width: ${(props) => typeof props.width === "number" ? `${props.width}px` : props.width || "auto"};
|
|
73
73
|
min-width: ${(props) => typeof props.minWidth === "number" ? `${props.minWidth}px` : props.minWidth || "auto"};
|
|
74
74
|
min-height: ${(props) => typeof props.minHeight === "number" ? `${props.minHeight}px` : props.minHeight || "auto"};
|
|
75
|
+
max-width: ${(props) => typeof props.maxWidth === "number" ? `${props.maxWidth}px` : props.maxWidth || "none"};
|
|
76
|
+
max-height: ${(props) => typeof props.maxHeight === "number" ? `${props.maxHeight}px` : props.maxHeight || "none"};
|
|
75
77
|
|
|
76
78
|
padding: ${(props) => typeof props.padding === "number" ? `${props.padding}px` : props.padding || 0};
|
|
77
79
|
${(props) => props.paddingHorizontal && `
|
|
@@ -258,9 +260,11 @@ var Radio = ({
|
|
|
258
260
|
onPress,
|
|
259
261
|
onValueChange,
|
|
260
262
|
"aria-label": ariaLabel,
|
|
261
|
-
"aria-labelledby": ariaLabelledBy
|
|
263
|
+
"aria-labelledby": ariaLabelledBy,
|
|
264
|
+
themeMode,
|
|
265
|
+
themeProductContext
|
|
262
266
|
}) => {
|
|
263
|
-
const { theme } = (0, import_xui_core.
|
|
267
|
+
const { theme } = (0, import_xui_core.useResolvedTheme)({ themeMode, themeProductContext });
|
|
264
268
|
const radioGroup = useRadioGroup();
|
|
265
269
|
const size = propSize || radioGroup.size || "md";
|
|
266
270
|
const checked = propChecked !== void 0 ? propChecked : radioGroup.value !== void 0 && value !== void 0 ? radioGroup.value === value : false;
|
package/web/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/index.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx","../../src/Radio.tsx"],"sourcesContent":["export * from \"./Radio\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledBox = styled.div<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (props.disabled ? 0.5 : 1)};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n type,\n disabled,\n id,\n ...props\n },\n ref\n ) => {\n // Handle as=\"img\" for rendering images with proper border-radius\n if (as === \"img\" && src) {\n return (\n <img\n src={src}\n alt={alt || \"\"}\n style={{\n display: \"block\",\n objectFit: \"cover\",\n width:\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width,\n height:\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height,\n borderRadius:\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius,\n position: props.position,\n top: typeof props.top === \"number\" ? `${props.top}px` : props.top,\n left:\n typeof props.left === \"number\" ? `${props.left}px` : props.left,\n right:\n typeof props.right === \"number\"\n ? `${props.right}px`\n : props.right,\n bottom:\n typeof props.bottom === \"number\"\n ? `${props.bottom}px`\n : props.bottom,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n as={as}\n id={id}\n type={as === \"button\" ? type || \"button\" : undefined}\n disabled={as === \"button\" ? disabled : undefined}\n onClick={onPress}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n role={role}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-current={ariaCurrent}\n aria-disabled={ariaDisabled}\n aria-busy={ariaBusy}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n aria-live={ariaLive}\n tabIndex={tabIndex !== undefined ? tabIndex : undefined}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledText = styled.span<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"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","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem } from \"@xsolla/xui-core\";\n\nexport interface RadioProps {\n /** Size of the radio button */\n size?: \"sm\" | \"md\" | \"lg\" | \"xl\";\n /** Whether the radio button is checked */\n checked?: boolean;\n /** Value of the radio button (for RadioGroup) */\n value?: string;\n /** Visual state of the radio button */\n state?: \"default\" | \"hover\" | \"disable\" | \"error\";\n /** Whether the radio button is disabled */\n disabled?: boolean;\n /** Label text to display next to the radio button */\n label?: string;\n /** Description text to display below the label */\n description?: string;\n /** Error label text to display when state is 'error' */\n errorLabel?: string;\n /** Callback when the radio button is pressed */\n onPress?: () => void;\n /** Callback when the radio button value changes (for compatibility with Checkbox-like APIs) */\n onValueChange?: (value: boolean) => void;\n /** Accessible label for screen readers (if label is not provided) */\n \"aria-label\"?: string;\n /** ID of element that labels this radio */\n \"aria-labelledby\"?: string;\n}\n\n// Mocking useRadioGroup here to avoid circular dependency in local dev\n// In a real monorepo this might be handled via a shared types or core package\ndeclare const require: (id: string) => any;\nconst useRadioGroup = () => {\n try {\n return require(\"@xsolla/xui-radio-group\").useRadioGroup();\n } catch {\n return {};\n }\n};\n\nexport const Radio: React.FC<RadioProps> = ({\n size: propSize,\n checked: propChecked,\n value,\n state = \"default\",\n disabled = false,\n label,\n description,\n errorLabel,\n onPress,\n onValueChange,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n}) => {\n const { theme } = useDesignSystem();\n const radioGroup = useRadioGroup();\n\n const size = propSize || radioGroup.size || \"md\";\n const checked =\n propChecked !== undefined\n ? propChecked\n : radioGroup.value !== undefined && value !== undefined\n ? radioGroup.value === value\n : false;\n const isDisable = state === \"disable\" || disabled || radioGroup.disabled;\n const isError = state === \"error\";\n const showErrorLabel = isError && errorLabel;\n\n // Resolve Sizing\n const sizing = theme.sizing.radio(size);\n\n // Resolve Colors from Theme\n const checkColors = theme.colors.control.check;\n const textColors = theme.colors.control.text;\n\n const handlePress = () => {\n if (!isDisable) {\n if (onPress) {\n onPress();\n }\n if (radioGroup.onChange && value !== undefined) {\n radioGroup.onChange(value);\n }\n if (onValueChange) {\n onValueChange(!checked);\n }\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if (!isDisable && event.key === \" \") {\n event.preventDefault(); // Prevent scrolling on Space\n handlePress();\n }\n };\n\n const getBgColor = () => {\n if (isDisable) return checkColors.bgDisable;\n if (checked) return checkColors.bg;\n return theme.colors.control.faint.bg;\n };\n\n const getBorderColor = () => {\n if (isError && !checked) return theme.colors.border.alert;\n return \"transparent\";\n };\n\n const getTextColor = () => {\n if (isDisable) return textColors.disable;\n return textColors.primary;\n };\n\n const getDotColor = () => {\n // Disabled state uses disabled text color for dot\n if (isDisable) return textColors.disable;\n // Default state uses check text color for dot\n return checkColors.icon;\n };\n\n const dotSize = sizing.size * 0.44; // Approx 8px for 18px total size, matching Figma's 27.78% inset\n\n const getHoverStyle = () => {\n if (isDisable) return undefined;\n\n if (checked) {\n return {\n backgroundColor: checkColors.bgHover,\n };\n } else if (isError) {\n // Error + Unchecked: hover background, maintain red border\n return {\n backgroundColor: theme.colors.control.faint.bgHover,\n borderColor: theme.colors.border.alert,\n borderWidth: sizing.borderWidth,\n };\n } else {\n return {\n backgroundColor: theme.colors.control.faint.bgHover,\n borderColor: theme.colors.control.faint.borderHover,\n borderWidth: sizing.borderWidth,\n };\n }\n };\n\n return (\n <Box\n role=\"radio\"\n aria-checked={checked}\n aria-disabled={isDisable || undefined}\n aria-invalid={isError || undefined}\n aria-label={\n ariaLabelledBy\n ? undefined\n : ariaLabel || (label ? undefined : \"Radio button\")\n }\n aria-labelledby={ariaLabelledBy}\n tabIndex={isDisable ? -1 : 0}\n flexDirection=\"row\"\n alignItems={description || showErrorLabel ? \"flex-start\" : \"center\"}\n gap={sizing.labelGap}\n onPress={handlePress}\n onKeyDown={handleKeyDown}\n cursor={!isDisable ? \"pointer\" : \"default\"}\n >\n <Box\n width={sizing.size}\n height={sizing.size}\n backgroundColor={getBgColor()}\n borderColor={getBorderColor()}\n borderWidth={isError && !checked ? sizing.borderWidth : 0}\n borderRadius={999}\n alignItems=\"center\"\n justifyContent=\"center\"\n hoverStyle={getHoverStyle()}\n >\n {checked && (\n <Box\n width={dotSize}\n height={dotSize}\n backgroundColor={getDotColor()}\n borderRadius={999}\n />\n )}\n </Box>\n\n {(label || description || showErrorLabel) && (\n <Box flexDirection=\"column\" gap={sizing.textGap}>\n {label && (\n <Text\n color={getTextColor()}\n fontSize={sizing.fontSize}\n lineHeight={sizing.lineHeight}\n fontWeight=\"400\"\n >\n {label}\n </Text>\n )}\n {description && (\n <Text\n color={theme.colors.content.tertiary}\n fontSize={sizing.descriptionFontSize}\n lineHeight={sizing.descriptionLineHeight}\n >\n {description}\n </Text>\n )}\n {showErrorLabel && (\n <Text\n color={theme.colors.content.alert.primary}\n fontSize={sizing.descriptionFontSize}\n lineHeight={sizing.descriptionLineHeight}\n >\n {errorLabel}\n </Text>\n )}\n </Box>\n )}\n </Box>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAAkB;AAClB,+BAAmB;AAuMX;AApMR,IAAM,YAAY,yBAAAA,QAAO;AAAA;AAAA;AAAA,sBAGH,CAAC,UAAU,MAAM,mBAAmB,aAAa;AAAA,kBACrD,CAAC,UAAU,MAAM,eAAe,aAAa;AAAA,kBAC7C,CAAC,UACf,OAAO,MAAM,gBAAgB,WACzB,GAAG,MAAM,WAAW,OACpB,MAAM,eAAe,CAAC;AAAA;AAAA,IAE1B,CAAC,UACD,MAAM,sBAAsB,UAC5B;AAAA,2BACuB,OAAO,MAAM,sBAAsB,WAAW,GAAG,MAAM,iBAAiB,OAAO,MAAM,iBAAiB;AAAA,2BACtG,MAAM,qBAAqB,MAAM,eAAe,aAAa;AAAA;AAAA,GAErF;AAAA,IACC,CAAC,UACD,MAAM,mBAAmB,UACzB;AAAA,wBACoB,OAAO,MAAM,mBAAmB,WAAW,GAAG,MAAM,cAAc,OAAO,MAAM,cAAc;AAAA,wBAC7F,MAAM,kBAAkB,MAAM,eAAe,aAAa;AAAA;AAAA,GAE/E;AAAA,IACC,CAAC,UACD,MAAM,oBAAoB,UAC1B;AAAA,yBACqB,OAAO,MAAM,oBAAoB,WAAW,GAAG,MAAM,eAAe,OAAO,MAAM,eAAe;AAAA,yBAChG,MAAM,mBAAmB,MAAM,eAAe,aAAa;AAAA;AAAA,GAEjF;AAAA,IACC,CAAC,UACD,MAAM,qBAAqB,UAC3B;AAAA,0BACsB,OAAO,MAAM,qBAAqB,WAAW,GAAG,MAAM,gBAAgB,OAAO,MAAM,gBAAgB;AAAA,0BACnG,MAAM,oBAAoB,MAAM,eAAe,aAAa;AAAA;AAAA,GAEnF;AAAA;AAAA,kBAEe,CAAC,UACf,MAAM,gBACL,MAAM,eACP,MAAM,qBACN,MAAM,kBACN,MAAM,mBACN,MAAM,mBACF,UACA,OAAO;AAAA,mBACI,CAAC,UAChB,OAAO,MAAM,iBAAiB,WAC1B,GAAG,MAAM,YAAY,OACrB,MAAM,gBAAgB,CAAC;AAAA,YACnB,CAAC,UACT,OAAO,MAAM,WAAW,WACpB,GAAG,MAAM,MAAM,OACf,MAAM,UAAU,MAAM;AAAA,WACnB,CAAC,UACR,OAAO,MAAM,UAAU,WACnB,GAAG,MAAM,KAAK,OACd,MAAM,SAAS,MAAM;AAAA,eACd,CAAC,UACZ,OAAO,MAAM,aAAa,WACtB,GAAG,MAAM,QAAQ,OACjB,MAAM,YAAY,MAAM;AAAA,gBAChB,CAAC,UACb,OAAO,MAAM,cAAc,WACvB,GAAG,MAAM,SAAS,OAClB,MAAM,aAAa,MAAM;AAAA;AAAA,aAEpB,CAAC,UACV,OAAO,MAAM,YAAY,WACrB,GAAG,MAAM,OAAO,OAChB,MAAM,WAAW,CAAC;AAAA,IACtB,CAAC,UACD,MAAM,qBACN;AAAA,oBACgB,OAAO,MAAM,sBAAsB,WAAW,GAAG,MAAM,iBAAiB,OAAO,MAAM,iBAAiB;AAAA,qBACrG,OAAO,MAAM,sBAAsB,WAAW,GAAG,MAAM,iBAAiB,OAAO,MAAM,iBAAiB;AAAA,GACxH;AAAA,IACC,CAAC,UACD,MAAM,mBACN;AAAA,mBACe,OAAO,MAAM,oBAAoB,WAAW,GAAG,MAAM,eAAe,OAAO,MAAM,eAAe;AAAA,sBAC7F,OAAO,MAAM,oBAAoB,WAAW,GAAG,MAAM,eAAe,OAAO,MAAM,eAAe;AAAA,GACnH;AAAA,IACC,CAAC,UACD,MAAM,eAAe,UACrB,gBAAgB,OAAO,MAAM,eAAe,WAAW,GAAG,MAAM,UAAU,OAAO,MAAM,UAAU,GAAG;AAAA,IACpG,CAAC,UACD,MAAM,kBAAkB,UACxB,mBAAmB,OAAO,MAAM,kBAAkB,WAAW,GAAG,MAAM,aAAa,OAAO,MAAM,aAAa,GAAG;AAAA,IAChH,CAAC,UACD,MAAM,gBAAgB,UACtB,iBAAiB,OAAO,MAAM,gBAAgB,WAAW,GAAG,MAAM,WAAW,OAAO,MAAM,WAAW,GAAG;AAAA,IACxG,CAAC,UACD,MAAM,iBAAiB,UACvB,kBAAkB,OAAO,MAAM,iBAAiB,WAAW,GAAG,MAAM,YAAY,OAAO,MAAM,YAAY,GAAG;AAAA;AAAA,YAEpG,CAAC,UACT,OAAO,MAAM,WAAW,WAAW,GAAG,MAAM,MAAM,OAAO,MAAM,UAAU,CAAC;AAAA,IAC1E,CAAC,UACD,MAAM,cAAc,UACpB,eAAe,OAAO,MAAM,cAAc,WAAW,GAAG,MAAM,SAAS,OAAO,MAAM,SAAS,GAAG;AAAA,IAChG,CAAC,UACD,MAAM,iBAAiB,UACvB,kBAAkB,OAAO,MAAM,iBAAiB,WAAW,GAAG,MAAM,YAAY,OAAO,MAAM,YAAY,GAAG;AAAA,IAC5G,CAAC,UACD,MAAM,eAAe,UACrB,gBAAgB,OAAO,MAAM,eAAe,WAAW,GAAG,MAAM,UAAU,OAAO,MAAM,UAAU,GAAG;AAAA,IACpG,CAAC,UACD,MAAM,gBAAgB,UACtB,iBAAiB,OAAO,MAAM,gBAAgB,WAAW,GAAG,MAAM,WAAW,OAAO,MAAM,WAAW,GAAG;AAAA;AAAA,oBAExF,CAAC,UAAU,MAAM,iBAAiB,QAAQ;AAAA,eAC/C,CAAC,UAAU,MAAM,YAAY,QAAQ;AAAA,iBACnC,CAAC,UAAU,MAAM,cAAc,SAAS;AAAA,qBACpC,CAAC,UAAU,MAAM,kBAAkB,YAAY;AAAA,YACxD,CAAC,UACT,MAAM,SACF,MAAM,SACN,MAAM,WAAW,MAAM,UACrB,YACA,SAAS;AAAA,cACL,CAAC,UAAU,MAAM,YAAY,QAAQ;AAAA,SAC1C,CAAC,UACN,OAAO,MAAM,QAAQ,WAAW,GAAG,MAAM,GAAG,OAAO,MAAM,GAAG;AAAA,YACpD,CAAC,UACT,OAAO,MAAM,WAAW,WAAW,GAAG,MAAM,MAAM,OAAO,MAAM,MAAM;AAAA,UAC/D,CAAC,UACP,OAAO,MAAM,SAAS,WAAW,GAAG,MAAM,IAAI,OAAO,MAAM,IAAI;AAAA,WACxD,CAAC,UACR,OAAO,MAAM,UAAU,WAAW,GAAG,MAAM,KAAK,OAAO,MAAM,KAAK;AAAA,UAC5D,CAAC,UAAU,MAAM,IAAI;AAAA,iBACd,CAAC,UAAU,MAAM,cAAc,CAAC;AAAA,SACxC,CAAC,UACN,OAAO,MAAM,QAAQ,WAAW,GAAG,MAAM,GAAG,OAAO,MAAM,OAAO,CAAC;AAAA,gBACrD,CAAC,UAAU,MAAM,aAAa,MAAM;AAAA,cACtC,CAAC,UAAU,MAAM,YAAY,SAAS;AAAA,gBACpC,CAAC,UAAU,MAAM,aAAa,SAAS;AAAA,gBACvC,CAAC,UAAU,MAAM,aAAa,SAAS;AAAA,aAC1C,CAAC,UAAU,MAAM,MAAM;AAAA,aACvB,CAAC,UAAW,MAAM,WAAW,MAAM,CAAE;AAAA,oBAC9B,CAAC,UAAW,MAAM,WAAW,SAAS,MAAO;AAAA;AAAA;AAAA,MAG3D,CAAC,UACD,MAAM,YAAY,mBAClB,qBAAqB,MAAM,WAAW,eAAe,GAAG;AAAA,MACxD,CAAC,UACD,MAAM,YAAY,eAClB,iBAAiB,MAAM,WAAW,WAAW,GAAG;AAAA;AAAA;AAAA;AAAA,MAIhD,CAAC,UACD,MAAM,YAAY,mBAClB,qBAAqB,MAAM,WAAW,eAAe,GAAG;AAAA;AAAA;AAIvD,IAAM,MAAM,aAAAC,QAAM;AAAA,EAIvB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB,aAAa;AAAA,IACb,aAAa;AAAA,IACb,oBAAoB;AAAA,IACpB,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,IACjB,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AAEH,QAAI,OAAO,SAAS,KAAK;AACvB,aACE;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,KAAK,OAAO;AAAA,UACZ,OAAO;AAAA,YACL,SAAS;AAAA,YACT,WAAW;AAAA,YACX,OACE,OAAO,MAAM,UAAU,WACnB,GAAG,MAAM,KAAK,OACd,MAAM;AAAA,YACZ,QACE,OAAO,MAAM,WAAW,WACpB,GAAG,MAAM,MAAM,OACf,MAAM;AAAA,YACZ,cACE,OAAO,MAAM,iBAAiB,WAC1B,GAAG,MAAM,YAAY,OACrB,MAAM;AAAA,YACZ,UAAU,MAAM;AAAA,YAChB,KAAK,OAAO,MAAM,QAAQ,WAAW,GAAG,MAAM,GAAG,OAAO,MAAM;AAAA,YAC9D,MACE,OAAO,MAAM,SAAS,WAAW,GAAG,MAAM,IAAI,OAAO,MAAM;AAAA,YAC7D,OACE,OAAO,MAAM,UAAU,WACnB,GAAG,MAAM,KAAK,OACd,MAAM;AAAA,YACZ,QACE,OAAO,MAAM,WAAW,WACpB,GAAG,MAAM,MAAM,OACf,MAAM;AAAA,UACd;AAAA;AAAA,MACF;AAAA,IAEJ;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA,MAAM,OAAO,WAAW,QAAQ,WAAW;AAAA,QAC3C,UAAU,OAAO,WAAW,WAAW;AAAA,QACvC,SAAS;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA,cAAY;AAAA,QACZ,mBAAiB;AAAA,QACjB,gBAAc;AAAA,QACd,iBAAe;AAAA,QACf,aAAW;AAAA,QACX,oBAAkB;AAAA,QAClB,iBAAe;AAAA,QACf,iBAAe;AAAA,QACf,gBAAc;AAAA,QACd,iBAAe;AAAA,QACf,aAAW;AAAA,QACX,UAAU,aAAa,SAAY,WAAW;AAAA,QAC7C,GAAG;AAAA,QAEH;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,IAAI,cAAc;;;ACzQlB,IAAAC,4BAAmB;AA+Bf,IAAAC,sBAAA;AA5BJ,IAAM,aAAa,0BAAAC,QAAO;AAAA,WACf,CAAC,UAAU,MAAM,SAAS,SAAS;AAAA,eAC/B,CAAC,UACZ,OAAO,MAAM,aAAa,WACtB,GAAG,MAAM,QAAQ,OACjB,MAAM,YAAY,SAAS;AAAA,iBAClB,CAAC,UAAU,MAAM,cAAc,QAAQ;AAAA,iBACvC,CAAC,UACd,MAAM,cACN,sGAAsG;AAAA,iBACzF,CAAC,UACd,OAAO,MAAM,eAAe,WACxB,GAAG,MAAM,UAAU,OACnB,MAAM,cAAc,SAAS;AAAA,iBACpB,CAAC,UAAU,MAAM,cAAc,QAAQ;AAAA,gBACxC,CAAC,UAAU,MAAM,aAAa,SAAS;AAAA,qBAClC,CAAC,UAAU,MAAM,kBAAkB,MAAM;AAAA;AAGvD,IAAM,OAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf,GAAG;AACL,MAAM;AACJ,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,EACF;AAEJ;;;ACrCA,sBAAgC;AAgLtB,IAAAC,sBAAA;AAhJV,IAAM,gBAAgB,MAAM;AAC1B,MAAI;AACF,WAAO,QAAQ,yBAAyB,EAAE,cAAc;AAAA,EAC1D,QAAQ;AACN,WAAO,CAAC;AAAA,EACV;AACF;AAEO,IAAM,QAA8B,CAAC;AAAA,EAC1C,MAAM;AAAA,EACN,SAAS;AAAA,EACT;AAAA,EACA,QAAQ;AAAA,EACR,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,mBAAmB;AACrB,MAAM;AACJ,QAAM,EAAE,MAAM,QAAI,iCAAgB;AAClC,QAAM,aAAa,cAAc;AAEjC,QAAM,OAAO,YAAY,WAAW,QAAQ;AAC5C,QAAM,UACJ,gBAAgB,SACZ,cACA,WAAW,UAAU,UAAa,UAAU,SAC1C,WAAW,UAAU,QACrB;AACR,QAAM,YAAY,UAAU,aAAa,YAAY,WAAW;AAChE,QAAM,UAAU,UAAU;AAC1B,QAAM,iBAAiB,WAAW;AAGlC,QAAM,SAAS,MAAM,OAAO,MAAM,IAAI;AAGtC,QAAM,cAAc,MAAM,OAAO,QAAQ;AACzC,QAAM,aAAa,MAAM,OAAO,QAAQ;AAExC,QAAM,cAAc,MAAM;AACxB,QAAI,CAAC,WAAW;AACd,UAAI,SAAS;AACX,gBAAQ;AAAA,MACV;AACA,UAAI,WAAW,YAAY,UAAU,QAAW;AAC9C,mBAAW,SAAS,KAAK;AAAA,MAC3B;AACA,UAAI,eAAe;AACjB,sBAAc,CAAC,OAAO;AAAA,MACxB;AAAA,IACF;AAAA,EACF;AAEA,QAAM,gBAAgB,CAAC,UAA+B;AACpD,QAAI,CAAC,aAAa,MAAM,QAAQ,KAAK;AACnC,YAAM,eAAe;AACrB,kBAAY;AAAA,IACd;AAAA,EACF;AAEA,QAAM,aAAa,MAAM;AACvB,QAAI,UAAW,QAAO,YAAY;AAClC,QAAI,QAAS,QAAO,YAAY;AAChC,WAAO,MAAM,OAAO,QAAQ,MAAM;AAAA,EACpC;AAEA,QAAM,iBAAiB,MAAM;AAC3B,QAAI,WAAW,CAAC,QAAS,QAAO,MAAM,OAAO,OAAO;AACpD,WAAO;AAAA,EACT;AAEA,QAAM,eAAe,MAAM;AACzB,QAAI,UAAW,QAAO,WAAW;AACjC,WAAO,WAAW;AAAA,EACpB;AAEA,QAAM,cAAc,MAAM;AAExB,QAAI,UAAW,QAAO,WAAW;AAEjC,WAAO,YAAY;AAAA,EACrB;AAEA,QAAM,UAAU,OAAO,OAAO;AAE9B,QAAM,gBAAgB,MAAM;AAC1B,QAAI,UAAW,QAAO;AAEtB,QAAI,SAAS;AACX,aAAO;AAAA,QACL,iBAAiB,YAAY;AAAA,MAC/B;AAAA,IACF,WAAW,SAAS;AAElB,aAAO;AAAA,QACL,iBAAiB,MAAM,OAAO,QAAQ,MAAM;AAAA,QAC5C,aAAa,MAAM,OAAO,OAAO;AAAA,QACjC,aAAa,OAAO;AAAA,MACtB;AAAA,IACF,OAAO;AACL,aAAO;AAAA,QACL,iBAAiB,MAAM,OAAO,QAAQ,MAAM;AAAA,QAC5C,aAAa,MAAM,OAAO,QAAQ,MAAM;AAAA,QACxC,aAAa,OAAO;AAAA,MACtB;AAAA,IACF;AAAA,EACF;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,gBAAc;AAAA,MACd,iBAAe,aAAa;AAAA,MAC5B,gBAAc,WAAW;AAAA,MACzB,cACE,iBACI,SACA,cAAc,QAAQ,SAAY;AAAA,MAExC,mBAAiB;AAAA,MACjB,UAAU,YAAY,KAAK;AAAA,MAC3B,eAAc;AAAA,MACd,YAAY,eAAe,iBAAiB,eAAe;AAAA,MAC3D,KAAK,OAAO;AAAA,MACZ,SAAS;AAAA,MACT,WAAW;AAAA,MACX,QAAQ,CAAC,YAAY,YAAY;AAAA,MAEjC;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,OAAO;AAAA,YACd,QAAQ,OAAO;AAAA,YACf,iBAAiB,WAAW;AAAA,YAC5B,aAAa,eAAe;AAAA,YAC5B,aAAa,WAAW,CAAC,UAAU,OAAO,cAAc;AAAA,YACxD,cAAc;AAAA,YACd,YAAW;AAAA,YACX,gBAAe;AAAA,YACf,YAAY,cAAc;AAAA,YAEzB,qBACC;AAAA,cAAC;AAAA;AAAA,gBACC,OAAO;AAAA,gBACP,QAAQ;AAAA,gBACR,iBAAiB,YAAY;AAAA,gBAC7B,cAAc;AAAA;AAAA,YAChB;AAAA;AAAA,QAEJ;AAAA,SAEE,SAAS,eAAe,mBACxB,8CAAC,OAAI,eAAc,UAAS,KAAK,OAAO,SACrC;AAAA,mBACC;AAAA,YAAC;AAAA;AAAA,cACC,OAAO,aAAa;AAAA,cACpB,UAAU,OAAO;AAAA,cACjB,YAAY,OAAO;AAAA,cACnB,YAAW;AAAA,cAEV;AAAA;AAAA,UACH;AAAA,UAED,eACC;AAAA,YAAC;AAAA;AAAA,cACC,OAAO,MAAM,OAAO,QAAQ;AAAA,cAC5B,UAAU,OAAO;AAAA,cACjB,YAAY,OAAO;AAAA,cAElB;AAAA;AAAA,UACH;AAAA,UAED,kBACC;AAAA,YAAC;AAAA;AAAA,cACC,OAAO,MAAM,OAAO,QAAQ,MAAM;AAAA,cAClC,UAAU,OAAO;AAAA,cACjB,YAAY,OAAO;AAAA,cAElB;AAAA;AAAA,UACH;AAAA,WAEJ;AAAA;AAAA;AAAA,EAEJ;AAEJ;","names":["styled","React","import_styled_components","import_jsx_runtime","styled","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../../src/index.tsx","../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx","../../src/Radio.tsx"],"sourcesContent":["export * from \"./Radio\";\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","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\n\nexport interface RadioProps extends ThemeOverrideProps {\n /** Size of the radio button */\n size?: \"sm\" | \"md\" | \"lg\" | \"xl\";\n /** Whether the radio button is checked */\n checked?: boolean;\n /** Value of the radio button (for RadioGroup) */\n value?: string;\n /** Visual state of the radio button */\n state?: \"default\" | \"hover\" | \"disable\" | \"error\";\n /** Whether the radio button is disabled */\n disabled?: boolean;\n /** Label text to display next to the radio button */\n label?: string;\n /** Description text to display below the label */\n description?: string;\n /** Error label text to display when state is 'error' */\n errorLabel?: string;\n /** Callback when the radio button is pressed */\n onPress?: () => void;\n /** Callback when the radio button value changes (for compatibility with Checkbox-like APIs) */\n onValueChange?: (value: boolean) => void;\n /** Accessible label for screen readers (if label is not provided) */\n \"aria-label\"?: string;\n /** ID of element that labels this radio */\n \"aria-labelledby\"?: string;\n}\n\n// Mocking useRadioGroup here to avoid circular dependency in local dev\n// In a real monorepo this might be handled via a shared types or core package\ndeclare const require: (id: string) => any;\nconst useRadioGroup = () => {\n try {\n return require(\"@xsolla/xui-radio-group\").useRadioGroup();\n } catch {\n return {};\n }\n};\n\nexport const Radio: React.FC<RadioProps> = ({\n size: propSize,\n checked: propChecked,\n value,\n state = \"default\",\n disabled = false,\n label,\n description,\n errorLabel,\n onPress,\n onValueChange,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const radioGroup = useRadioGroup();\n\n const size = propSize || radioGroup.size || \"md\";\n const checked =\n propChecked !== undefined\n ? propChecked\n : radioGroup.value !== undefined && value !== undefined\n ? radioGroup.value === value\n : false;\n const isDisable = state === \"disable\" || disabled || radioGroup.disabled;\n const isError = state === \"error\";\n const showErrorLabel = isError && errorLabel;\n\n // Resolve Sizing\n const sizing = theme.sizing.radio(size);\n\n // Resolve Colors from Theme\n const checkColors = theme.colors.control.check;\n const textColors = theme.colors.control.text;\n\n const handlePress = () => {\n if (!isDisable) {\n if (onPress) {\n onPress();\n }\n if (radioGroup.onChange && value !== undefined) {\n radioGroup.onChange(value);\n }\n if (onValueChange) {\n onValueChange(!checked);\n }\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if (!isDisable && event.key === \" \") {\n event.preventDefault(); // Prevent scrolling on Space\n handlePress();\n }\n };\n\n const getBgColor = () => {\n if (isDisable) return checkColors.bgDisable;\n if (checked) return checkColors.bg;\n return theme.colors.control.faint.bg;\n };\n\n const getBorderColor = () => {\n if (isError && !checked) return theme.colors.border.alert;\n return \"transparent\";\n };\n\n const getTextColor = () => {\n if (isDisable) return textColors.disable;\n return textColors.primary;\n };\n\n const getDotColor = () => {\n // Disabled state uses disabled text color for dot\n if (isDisable) return textColors.disable;\n // Default state uses check text color for dot\n return checkColors.icon;\n };\n\n const dotSize = sizing.size * 0.44; // Approx 8px for 18px total size, matching Figma's 27.78% inset\n\n const getHoverStyle = () => {\n if (isDisable) return undefined;\n\n if (checked) {\n return {\n backgroundColor: checkColors.bgHover,\n };\n } else if (isError) {\n // Error + Unchecked: hover background, maintain red border\n return {\n backgroundColor: theme.colors.control.faint.bgHover,\n borderColor: theme.colors.border.alert,\n borderWidth: sizing.borderWidth,\n };\n } else {\n return {\n backgroundColor: theme.colors.control.faint.bgHover,\n borderColor: theme.colors.control.faint.borderHover,\n borderWidth: sizing.borderWidth,\n };\n }\n };\n\n return (\n <Box\n role=\"radio\"\n aria-checked={checked}\n aria-disabled={isDisable || undefined}\n aria-invalid={isError || undefined}\n aria-label={\n ariaLabelledBy\n ? undefined\n : ariaLabel || (label ? undefined : \"Radio button\")\n }\n aria-labelledby={ariaLabelledBy}\n tabIndex={isDisable ? -1 : 0}\n flexDirection=\"row\"\n alignItems={description || showErrorLabel ? \"flex-start\" : \"center\"}\n gap={sizing.labelGap}\n onPress={handlePress}\n onKeyDown={handleKeyDown}\n cursor={!isDisable ? \"pointer\" : \"default\"}\n >\n <Box\n width={sizing.size}\n height={sizing.size}\n backgroundColor={getBgColor()}\n borderColor={getBorderColor()}\n borderWidth={isError && !checked ? sizing.borderWidth : 0}\n borderRadius={999}\n alignItems=\"center\"\n justifyContent=\"center\"\n hoverStyle={getHoverStyle()}\n >\n {checked && (\n <Box\n width={dotSize}\n height={dotSize}\n backgroundColor={getDotColor()}\n borderRadius={999}\n />\n )}\n </Box>\n\n {(label || description || showErrorLabel) && (\n <Box flexDirection=\"column\" gap={sizing.textGap}>\n {label && (\n <Text\n color={getTextColor()}\n fontSize={sizing.fontSize}\n lineHeight={sizing.lineHeight}\n fontWeight=\"400\"\n >\n {label}\n </Text>\n )}\n {description && (\n <Text\n color={theme.colors.content.tertiary}\n fontSize={sizing.descriptionFontSize}\n lineHeight={sizing.descriptionLineHeight}\n >\n {description}\n </Text>\n )}\n {showErrorLabel && (\n <Text\n color={theme.colors.content.alert.primary}\n fontSize={sizing.descriptionFontSize}\n lineHeight={sizing.descriptionLineHeight}\n >\n {errorLabel}\n </Text>\n )}\n </Box>\n )}\n </Box>\n );\n};\n"],"mappings":"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","names":["styled","React","import_styled_components","import_jsx_runtime","styled","import_jsx_runtime"]}
|
package/web/index.mjs
CHANGED
|
@@ -43,6 +43,8 @@ var StyledBox = styled.div`
|
|
|
43
43
|
width: ${(props) => typeof props.width === "number" ? `${props.width}px` : props.width || "auto"};
|
|
44
44
|
min-width: ${(props) => typeof props.minWidth === "number" ? `${props.minWidth}px` : props.minWidth || "auto"};
|
|
45
45
|
min-height: ${(props) => typeof props.minHeight === "number" ? `${props.minHeight}px` : props.minHeight || "auto"};
|
|
46
|
+
max-width: ${(props) => typeof props.maxWidth === "number" ? `${props.maxWidth}px` : props.maxWidth || "none"};
|
|
47
|
+
max-height: ${(props) => typeof props.maxHeight === "number" ? `${props.maxHeight}px` : props.maxHeight || "none"};
|
|
46
48
|
|
|
47
49
|
padding: ${(props) => typeof props.padding === "number" ? `${props.padding}px` : props.padding || 0};
|
|
48
50
|
${(props) => props.paddingHorizontal && `
|
|
@@ -208,7 +210,7 @@ var Text = ({
|
|
|
208
210
|
};
|
|
209
211
|
|
|
210
212
|
// src/Radio.tsx
|
|
211
|
-
import {
|
|
213
|
+
import { useResolvedTheme } from "@xsolla/xui-core";
|
|
212
214
|
import { jsx as jsx3, jsxs } from "react/jsx-runtime";
|
|
213
215
|
var useRadioGroup = () => {
|
|
214
216
|
try {
|
|
@@ -229,9 +231,11 @@ var Radio = ({
|
|
|
229
231
|
onPress,
|
|
230
232
|
onValueChange,
|
|
231
233
|
"aria-label": ariaLabel,
|
|
232
|
-
"aria-labelledby": ariaLabelledBy
|
|
234
|
+
"aria-labelledby": ariaLabelledBy,
|
|
235
|
+
themeMode,
|
|
236
|
+
themeProductContext
|
|
233
237
|
}) => {
|
|
234
|
-
const { theme } =
|
|
238
|
+
const { theme } = useResolvedTheme({ themeMode, themeProductContext });
|
|
235
239
|
const radioGroup = useRadioGroup();
|
|
236
240
|
const size = propSize || radioGroup.size || "md";
|
|
237
241
|
const checked = propChecked !== void 0 ? propChecked : radioGroup.value !== void 0 && value !== void 0 ? radioGroup.value === value : false;
|
package/web/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx","../../src/Radio.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledBox = styled.div<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (props.disabled ? 0.5 : 1)};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n type,\n disabled,\n id,\n ...props\n },\n ref\n ) => {\n // Handle as=\"img\" for rendering images with proper border-radius\n if (as === \"img\" && src) {\n return (\n <img\n src={src}\n alt={alt || \"\"}\n style={{\n display: \"block\",\n objectFit: \"cover\",\n width:\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width,\n height:\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height,\n borderRadius:\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius,\n position: props.position,\n top: typeof props.top === \"number\" ? `${props.top}px` : props.top,\n left:\n typeof props.left === \"number\" ? `${props.left}px` : props.left,\n right:\n typeof props.right === \"number\"\n ? `${props.right}px`\n : props.right,\n bottom:\n typeof props.bottom === \"number\"\n ? `${props.bottom}px`\n : props.bottom,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n as={as}\n id={id}\n type={as === \"button\" ? type || \"button\" : undefined}\n disabled={as === \"button\" ? disabled : undefined}\n onClick={onPress}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n role={role}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-current={ariaCurrent}\n aria-disabled={ariaDisabled}\n aria-busy={ariaBusy}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n aria-live={ariaLive}\n tabIndex={tabIndex !== undefined ? tabIndex : undefined}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst StyledText = styled.span<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"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","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem } from \"@xsolla/xui-core\";\n\nexport interface RadioProps {\n /** Size of the radio button */\n size?: \"sm\" | \"md\" | \"lg\" | \"xl\";\n /** Whether the radio button is checked */\n checked?: boolean;\n /** Value of the radio button (for RadioGroup) */\n value?: string;\n /** Visual state of the radio button */\n state?: \"default\" | \"hover\" | \"disable\" | \"error\";\n /** Whether the radio button is disabled */\n disabled?: boolean;\n /** Label text to display next to the radio button */\n label?: string;\n /** Description text to display below the label */\n description?: string;\n /** Error label text to display when state is 'error' */\n errorLabel?: string;\n /** Callback when the radio button is pressed */\n onPress?: () => void;\n /** Callback when the radio button value changes (for compatibility with Checkbox-like APIs) */\n onValueChange?: (value: boolean) => void;\n /** Accessible label for screen readers (if label is not provided) */\n \"aria-label\"?: string;\n /** ID of element that labels this radio */\n \"aria-labelledby\"?: string;\n}\n\n// Mocking useRadioGroup here to avoid circular dependency in local dev\n// In a real monorepo this might be handled via a shared types or core package\ndeclare const require: (id: string) => any;\nconst useRadioGroup = () => {\n try {\n return require(\"@xsolla/xui-radio-group\").useRadioGroup();\n } catch {\n return {};\n }\n};\n\nexport const Radio: React.FC<RadioProps> = ({\n size: propSize,\n checked: propChecked,\n value,\n state = \"default\",\n disabled = false,\n label,\n description,\n errorLabel,\n onPress,\n onValueChange,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n}) => {\n const { theme } = useDesignSystem();\n const radioGroup = useRadioGroup();\n\n const size = propSize || radioGroup.size || \"md\";\n const checked =\n propChecked !== undefined\n ? propChecked\n : radioGroup.value !== undefined && value !== undefined\n ? radioGroup.value === value\n : false;\n const isDisable = state === \"disable\" || disabled || radioGroup.disabled;\n const isError = state === \"error\";\n const showErrorLabel = isError && errorLabel;\n\n // Resolve Sizing\n const sizing = theme.sizing.radio(size);\n\n // Resolve Colors from Theme\n const checkColors = theme.colors.control.check;\n const textColors = theme.colors.control.text;\n\n const handlePress = () => {\n if (!isDisable) {\n if (onPress) {\n onPress();\n }\n if (radioGroup.onChange && value !== undefined) {\n radioGroup.onChange(value);\n }\n if (onValueChange) {\n onValueChange(!checked);\n }\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if (!isDisable && event.key === \" \") {\n event.preventDefault(); // Prevent scrolling on Space\n handlePress();\n }\n };\n\n const getBgColor = () => {\n if (isDisable) return checkColors.bgDisable;\n if (checked) return checkColors.bg;\n return theme.colors.control.faint.bg;\n };\n\n const getBorderColor = () => {\n if (isError && !checked) return theme.colors.border.alert;\n return \"transparent\";\n };\n\n const getTextColor = () => {\n if (isDisable) return textColors.disable;\n return textColors.primary;\n };\n\n const getDotColor = () => {\n // Disabled state uses disabled text color for dot\n if (isDisable) return textColors.disable;\n // Default state uses check text color for dot\n return checkColors.icon;\n };\n\n const dotSize = sizing.size * 0.44; // Approx 8px for 18px total size, matching Figma's 27.78% inset\n\n const getHoverStyle = () => {\n if (isDisable) return undefined;\n\n if (checked) {\n return {\n backgroundColor: checkColors.bgHover,\n };\n } else if (isError) {\n // Error + Unchecked: hover background, maintain red border\n return {\n backgroundColor: theme.colors.control.faint.bgHover,\n borderColor: theme.colors.border.alert,\n borderWidth: sizing.borderWidth,\n };\n } else {\n return {\n backgroundColor: theme.colors.control.faint.bgHover,\n borderColor: theme.colors.control.faint.borderHover,\n borderWidth: sizing.borderWidth,\n };\n }\n };\n\n return (\n <Box\n role=\"radio\"\n aria-checked={checked}\n aria-disabled={isDisable || undefined}\n aria-invalid={isError || undefined}\n aria-label={\n ariaLabelledBy\n ? undefined\n : ariaLabel || (label ? undefined : \"Radio button\")\n }\n aria-labelledby={ariaLabelledBy}\n tabIndex={isDisable ? -1 : 0}\n flexDirection=\"row\"\n alignItems={description || showErrorLabel ? \"flex-start\" : \"center\"}\n gap={sizing.labelGap}\n onPress={handlePress}\n onKeyDown={handleKeyDown}\n cursor={!isDisable ? \"pointer\" : \"default\"}\n >\n <Box\n width={sizing.size}\n height={sizing.size}\n backgroundColor={getBgColor()}\n borderColor={getBorderColor()}\n borderWidth={isError && !checked ? sizing.borderWidth : 0}\n borderRadius={999}\n alignItems=\"center\"\n justifyContent=\"center\"\n hoverStyle={getHoverStyle()}\n >\n {checked && (\n <Box\n width={dotSize}\n height={dotSize}\n backgroundColor={getDotColor()}\n borderRadius={999}\n />\n )}\n </Box>\n\n {(label || description || showErrorLabel) && (\n <Box flexDirection=\"column\" gap={sizing.textGap}>\n {label && (\n <Text\n color={getTextColor()}\n fontSize={sizing.fontSize}\n lineHeight={sizing.lineHeight}\n fontWeight=\"400\"\n >\n {label}\n </Text>\n )}\n {description && (\n <Text\n color={theme.colors.content.tertiary}\n fontSize={sizing.descriptionFontSize}\n lineHeight={sizing.descriptionLineHeight}\n >\n {description}\n </Text>\n )}\n {showErrorLabel && (\n <Text\n color={theme.colors.content.alert.primary}\n fontSize={sizing.descriptionFontSize}\n lineHeight={sizing.descriptionLineHeight}\n >\n {errorLabel}\n </Text>\n )}\n </Box>\n )}\n </Box>\n );\n};\n"],"mappings":"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","names":["styled","jsx","jsx"]}
|
|
1
|
+
{"version":3,"sources":["../../../primitives-web/src/Box.tsx","../../../primitives-web/src/Text.tsx","../../src/Radio.tsx"],"sourcesContent":["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","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport { useResolvedTheme, type ThemeOverrideProps } from \"@xsolla/xui-core\";\n\nexport interface RadioProps extends ThemeOverrideProps {\n /** Size of the radio button */\n size?: \"sm\" | \"md\" | \"lg\" | \"xl\";\n /** Whether the radio button is checked */\n checked?: boolean;\n /** Value of the radio button (for RadioGroup) */\n value?: string;\n /** Visual state of the radio button */\n state?: \"default\" | \"hover\" | \"disable\" | \"error\";\n /** Whether the radio button is disabled */\n disabled?: boolean;\n /** Label text to display next to the radio button */\n label?: string;\n /** Description text to display below the label */\n description?: string;\n /** Error label text to display when state is 'error' */\n errorLabel?: string;\n /** Callback when the radio button is pressed */\n onPress?: () => void;\n /** Callback when the radio button value changes (for compatibility with Checkbox-like APIs) */\n onValueChange?: (value: boolean) => void;\n /** Accessible label for screen readers (if label is not provided) */\n \"aria-label\"?: string;\n /** ID of element that labels this radio */\n \"aria-labelledby\"?: string;\n}\n\n// Mocking useRadioGroup here to avoid circular dependency in local dev\n// In a real monorepo this might be handled via a shared types or core package\ndeclare const require: (id: string) => any;\nconst useRadioGroup = () => {\n try {\n return require(\"@xsolla/xui-radio-group\").useRadioGroup();\n } catch {\n return {};\n }\n};\n\nexport const Radio: React.FC<RadioProps> = ({\n size: propSize,\n checked: propChecked,\n value,\n state = \"default\",\n disabled = false,\n label,\n description,\n errorLabel,\n onPress,\n onValueChange,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const radioGroup = useRadioGroup();\n\n const size = propSize || radioGroup.size || \"md\";\n const checked =\n propChecked !== undefined\n ? propChecked\n : radioGroup.value !== undefined && value !== undefined\n ? radioGroup.value === value\n : false;\n const isDisable = state === \"disable\" || disabled || radioGroup.disabled;\n const isError = state === \"error\";\n const showErrorLabel = isError && errorLabel;\n\n // Resolve Sizing\n const sizing = theme.sizing.radio(size);\n\n // Resolve Colors from Theme\n const checkColors = theme.colors.control.check;\n const textColors = theme.colors.control.text;\n\n const handlePress = () => {\n if (!isDisable) {\n if (onPress) {\n onPress();\n }\n if (radioGroup.onChange && value !== undefined) {\n radioGroup.onChange(value);\n }\n if (onValueChange) {\n onValueChange(!checked);\n }\n }\n };\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if (!isDisable && event.key === \" \") {\n event.preventDefault(); // Prevent scrolling on Space\n handlePress();\n }\n };\n\n const getBgColor = () => {\n if (isDisable) return checkColors.bgDisable;\n if (checked) return checkColors.bg;\n return theme.colors.control.faint.bg;\n };\n\n const getBorderColor = () => {\n if (isError && !checked) return theme.colors.border.alert;\n return \"transparent\";\n };\n\n const getTextColor = () => {\n if (isDisable) return textColors.disable;\n return textColors.primary;\n };\n\n const getDotColor = () => {\n // Disabled state uses disabled text color for dot\n if (isDisable) return textColors.disable;\n // Default state uses check text color for dot\n return checkColors.icon;\n };\n\n const dotSize = sizing.size * 0.44; // Approx 8px for 18px total size, matching Figma's 27.78% inset\n\n const getHoverStyle = () => {\n if (isDisable) return undefined;\n\n if (checked) {\n return {\n backgroundColor: checkColors.bgHover,\n };\n } else if (isError) {\n // Error + Unchecked: hover background, maintain red border\n return {\n backgroundColor: theme.colors.control.faint.bgHover,\n borderColor: theme.colors.border.alert,\n borderWidth: sizing.borderWidth,\n };\n } else {\n return {\n backgroundColor: theme.colors.control.faint.bgHover,\n borderColor: theme.colors.control.faint.borderHover,\n borderWidth: sizing.borderWidth,\n };\n }\n };\n\n return (\n <Box\n role=\"radio\"\n aria-checked={checked}\n aria-disabled={isDisable || undefined}\n aria-invalid={isError || undefined}\n aria-label={\n ariaLabelledBy\n ? undefined\n : ariaLabel || (label ? undefined : \"Radio button\")\n }\n aria-labelledby={ariaLabelledBy}\n tabIndex={isDisable ? -1 : 0}\n flexDirection=\"row\"\n alignItems={description || showErrorLabel ? \"flex-start\" : \"center\"}\n gap={sizing.labelGap}\n onPress={handlePress}\n onKeyDown={handleKeyDown}\n cursor={!isDisable ? \"pointer\" : \"default\"}\n >\n <Box\n width={sizing.size}\n height={sizing.size}\n backgroundColor={getBgColor()}\n borderColor={getBorderColor()}\n borderWidth={isError && !checked ? sizing.borderWidth : 0}\n borderRadius={999}\n alignItems=\"center\"\n justifyContent=\"center\"\n hoverStyle={getHoverStyle()}\n >\n {checked && (\n <Box\n width={dotSize}\n height={dotSize}\n backgroundColor={getDotColor()}\n borderRadius={999}\n />\n )}\n </Box>\n\n {(label || description || showErrorLabel) && (\n <Box flexDirection=\"column\" gap={sizing.textGap}>\n {label && (\n <Text\n color={getTextColor()}\n fontSize={sizing.fontSize}\n lineHeight={sizing.lineHeight}\n fontWeight=\"400\"\n >\n {label}\n </Text>\n )}\n {description && (\n <Text\n color={theme.colors.content.tertiary}\n fontSize={sizing.descriptionFontSize}\n lineHeight={sizing.descriptionLineHeight}\n >\n {description}\n </Text>\n )}\n {showErrorLabel && (\n <Text\n color={theme.colors.content.alert.primary}\n fontSize={sizing.descriptionFontSize}\n lineHeight={sizing.descriptionLineHeight}\n >\n {errorLabel}\n </Text>\n )}\n </Box>\n )}\n </Box>\n );\n};\n"],"mappings":"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","names":["styled","jsx","jsx"]}
|