@xsolla/xui-dropdown 0.157.0 → 0.158.0-pr306.1779437575

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.js CHANGED
@@ -239,6 +239,8 @@ var Text = ({
239
239
  numberOfLines,
240
240
  id,
241
241
  role,
242
+ testID,
243
+ "data-testid": dataTestId,
242
244
  style: styleProp,
243
245
  ...props
244
246
  }) => {
@@ -268,7 +270,7 @@ var Text = ({
268
270
  {
269
271
  style: baseStyle,
270
272
  numberOfLines,
271
- testID: id,
273
+ testID: dataTestId || testID || id,
272
274
  accessibilityRole,
273
275
  children
274
276
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.tsx","../../src/Dropdown.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx"],"sourcesContent":["export * from \"./Dropdown\";\n","import React, { useState, useRef, useEffect, useCallback } 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 DropdownProps extends ThemeOverrideProps {\n id?: string;\n trigger: React.ReactNode;\n children: React.ReactNode;\n isOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n /** Width of the dropdown menu (does not affect trigger width) */\n width?: string | number;\n /** Horizontal alignment of dropdown menu relative to trigger. Default: \"start\" */\n align?: \"start\" | \"end\";\n /** Accessible label for the dropdown menu */\n \"aria-label\"?: string;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\nexport const Dropdown = React.forwardRef<HTMLDivElement, DropdownProps>(\n (\n {\n id,\n trigger,\n children,\n isOpen: propIsOpen,\n onOpenChange,\n width = \"auto\",\n align = \"start\",\n \"aria-label\": ariaLabel,\n testID,\n themeMode,\n themeProductContext,\n },\n ref\n ) => {\n const [internalIsOpen, setInternalIsOpen] = useState(false);\n const isOpen = propIsOpen !== undefined ? propIsOpen : internalIsOpen;\n const containerRef = useRef<HTMLDivElement>(null);\n const triggerRef = useRef<HTMLDivElement>(null);\n const menuRef = useRef<HTMLDivElement>(null);\n\n // Merge forwarded ref with internal container ref\n React.useImperativeHandle(\n ref,\n () => containerRef.current as HTMLDivElement\n );\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n const closeMenu = useCallback(() => {\n if (propIsOpen === undefined) {\n setInternalIsOpen(false);\n }\n if (onOpenChange) onOpenChange(false);\n }, [propIsOpen, onOpenChange]);\n\n const toggleOpen = useCallback(() => {\n const nextOpen = !isOpen;\n if (propIsOpen === undefined) {\n setInternalIsOpen(nextOpen);\n }\n if (onOpenChange) onOpenChange(nextOpen);\n }, [isOpen, propIsOpen, onOpenChange]);\n\n // Safe focus helper for cross-platform compatibility\n const focusTrigger = useCallback(() => {\n if (typeof document !== \"undefined\" && triggerRef.current) {\n // Find the first focusable element within the trigger wrapper\n const focusable = triggerRef.current.querySelector<HTMLElement>(\n 'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])'\n );\n if (focusable) {\n focusable.focus();\n }\n }\n }, []);\n\n // Handle keyboard navigation\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === \"Escape\" && isOpen) {\n event.preventDefault();\n closeMenu();\n focusTrigger();\n } else if (event.key === \"Tab\" && isOpen) {\n closeMenu();\n // Also restore focus on Tab for consistent keyboard navigation\n focusTrigger();\n }\n },\n [isOpen, closeMenu, focusTrigger]\n );\n\n // Handle trigger keyboard events\n const handleTriggerKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n toggleOpen();\n } else if (event.key === \"ArrowDown\" && !isOpen) {\n event.preventDefault();\n if (propIsOpen === undefined) {\n setInternalIsOpen(true);\n }\n if (onOpenChange) onOpenChange(true);\n }\n },\n [isOpen, toggleOpen, propIsOpen, onOpenChange]\n );\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (\n containerRef.current &&\n !containerRef.current.contains(event.target as Node)\n ) {\n closeMenu();\n }\n };\n\n if (isOpen && typeof document !== \"undefined\") {\n document.addEventListener(\"mousedown\", handleClickOutside);\n }\n return () => {\n if (typeof document !== \"undefined\") {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n }\n };\n }, [isOpen, closeMenu]);\n\n return (\n <div\n ref={containerRef}\n id={id}\n style={{\n position: \"relative\",\n width: \"fit-content\",\n alignSelf: \"flex-start\",\n height: \"fit-content\",\n }}\n onKeyDown={handleKeyDown}\n data-testid={testID}\n >\n <div\n ref={triggerRef}\n onClick={toggleOpen}\n onKeyDown={handleTriggerKeyDown}\n aria-haspopup=\"menu\"\n aria-expanded={isOpen}\n >\n {trigger}\n </div>\n {isOpen && (\n <Box\n ref={menuRef}\n position=\"absolute\"\n top=\"100%\"\n {...(align === \"end\" ? { right: 0 } : { left: 0 })}\n marginTop={4}\n backgroundColor={theme.colors.background.secondary}\n borderColor={theme.colors.border.secondary}\n borderWidth={1}\n borderRadius={theme.radius.button}\n paddingVertical={4}\n role=\"menu\"\n {...(ariaLabel ? { \"aria-label\": ariaLabel } : {})}\n style={{\n zIndex: 1000,\n boxShadow: \"0 4px 12px rgba(0,0,0,0.1)\",\n ...(width === \"auto\" ? { minWidth: \"100%\" } : { width }),\n }}\n >\n {children}\n </Box>\n )}\n </div>\n );\n }\n);\n\nexport interface DropdownItemProps extends ThemeOverrideProps {\n children: React.ReactNode;\n onPress?: () => void;\n active?: boolean;\n /** Whether this item is selected (shows trailing checkmark with control/check/bg color) */\n selected?: boolean;\n disabled?: boolean;\n icon?: React.ReactNode;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\nexport const DropdownItem: React.FC<DropdownItemProps> = ({\n children,\n onPress,\n active,\n selected,\n disabled,\n icon,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const brandColors = theme.colors.control.brand.primary;\n const contentColors = theme.colors.content;\n\n // Determine background color\n const getBackgroundColor = () => {\n if (selected) {\n return brandColors?.bg || theme.colors.control.input.bg; // Cyan background for selected items\n }\n if (active) {\n return theme.colors.control.input.bgHover;\n }\n return \"transparent\";\n };\n\n // Determine text/icon color\n const getContentColor = () => {\n if (selected) {\n return contentColors?.on?.brand || theme.colors.content.primary; // Black text on cyan background\n }\n return theme.colors.content.secondary;\n };\n\n // Handle keyboard activation\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if ((event.key === \"Enter\" || event.key === \" \") && !disabled && onPress) {\n event.preventDefault();\n onPress();\n }\n };\n\n return (\n <Box\n onPress={!disabled ? onPress : undefined}\n paddingHorizontal={16}\n paddingVertical={8}\n flexDirection=\"row\"\n alignItems=\"center\"\n backgroundColor={getBackgroundColor()}\n hoverStyle={\n !disabled && !selected\n ? {\n backgroundColor: theme.colors.control.input.bgHover,\n }\n : undefined\n }\n role=\"menuitem\"\n tabIndex={disabled ? -1 : 0}\n aria-disabled={disabled}\n onKeyDown={handleKeyDown}\n testID={testID}\n style={{\n opacity: disabled ? 0.5 : 1,\n cursor: disabled ? \"not-allowed\" : \"pointer\",\n }}\n >\n {icon && (\n <Box marginRight={12} alignItems=\"center\" justifyContent=\"center\">\n {icon}\n </Box>\n )}\n <Box flex={1}>\n <Text color={getContentColor()} fontSize={14} fontWeight=\"400\">\n {children}\n </Text>\n </Box>\n </Box>\n );\n};\n\nDropdown.displayName = \"Dropdown\";\nDropdownItem.displayName = \"DropdownItem\";\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"],"mappings":"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","names":["import_react_native","import_jsx_runtime","RNText","import_jsx_runtime","React"]}
1
+ {"version":3,"sources":["../../src/index.tsx","../../src/Dropdown.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx"],"sourcesContent":["export * from \"./Dropdown\";\n","import React, { useState, useRef, useEffect, useCallback } 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 DropdownProps extends ThemeOverrideProps {\n id?: string;\n trigger: React.ReactNode;\n children: React.ReactNode;\n isOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n /** Width of the dropdown menu (does not affect trigger width) */\n width?: string | number;\n /** Horizontal alignment of dropdown menu relative to trigger. Default: \"start\" */\n align?: \"start\" | \"end\";\n /** Accessible label for the dropdown menu */\n \"aria-label\"?: string;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\nexport const Dropdown = React.forwardRef<HTMLDivElement, DropdownProps>(\n (\n {\n id,\n trigger,\n children,\n isOpen: propIsOpen,\n onOpenChange,\n width = \"auto\",\n align = \"start\",\n \"aria-label\": ariaLabel,\n testID,\n themeMode,\n themeProductContext,\n },\n ref\n ) => {\n const [internalIsOpen, setInternalIsOpen] = useState(false);\n const isOpen = propIsOpen !== undefined ? propIsOpen : internalIsOpen;\n const containerRef = useRef<HTMLDivElement>(null);\n const triggerRef = useRef<HTMLDivElement>(null);\n const menuRef = useRef<HTMLDivElement>(null);\n\n // Merge forwarded ref with internal container ref\n React.useImperativeHandle(\n ref,\n () => containerRef.current as HTMLDivElement\n );\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n const closeMenu = useCallback(() => {\n if (propIsOpen === undefined) {\n setInternalIsOpen(false);\n }\n if (onOpenChange) onOpenChange(false);\n }, [propIsOpen, onOpenChange]);\n\n const toggleOpen = useCallback(() => {\n const nextOpen = !isOpen;\n if (propIsOpen === undefined) {\n setInternalIsOpen(nextOpen);\n }\n if (onOpenChange) onOpenChange(nextOpen);\n }, [isOpen, propIsOpen, onOpenChange]);\n\n // Safe focus helper for cross-platform compatibility\n const focusTrigger = useCallback(() => {\n if (typeof document !== \"undefined\" && triggerRef.current) {\n // Find the first focusable element within the trigger wrapper\n const focusable = triggerRef.current.querySelector<HTMLElement>(\n 'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])'\n );\n if (focusable) {\n focusable.focus();\n }\n }\n }, []);\n\n // Handle keyboard navigation\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === \"Escape\" && isOpen) {\n event.preventDefault();\n closeMenu();\n focusTrigger();\n } else if (event.key === \"Tab\" && isOpen) {\n closeMenu();\n // Also restore focus on Tab for consistent keyboard navigation\n focusTrigger();\n }\n },\n [isOpen, closeMenu, focusTrigger]\n );\n\n // Handle trigger keyboard events\n const handleTriggerKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n toggleOpen();\n } else if (event.key === \"ArrowDown\" && !isOpen) {\n event.preventDefault();\n if (propIsOpen === undefined) {\n setInternalIsOpen(true);\n }\n if (onOpenChange) onOpenChange(true);\n }\n },\n [isOpen, toggleOpen, propIsOpen, onOpenChange]\n );\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (\n containerRef.current &&\n !containerRef.current.contains(event.target as Node)\n ) {\n closeMenu();\n }\n };\n\n if (isOpen && typeof document !== \"undefined\") {\n document.addEventListener(\"mousedown\", handleClickOutside);\n }\n return () => {\n if (typeof document !== \"undefined\") {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n }\n };\n }, [isOpen, closeMenu]);\n\n return (\n <div\n ref={containerRef}\n id={id}\n style={{\n position: \"relative\",\n width: \"fit-content\",\n alignSelf: \"flex-start\",\n height: \"fit-content\",\n }}\n onKeyDown={handleKeyDown}\n data-testid={testID}\n >\n <div\n ref={triggerRef}\n onClick={toggleOpen}\n onKeyDown={handleTriggerKeyDown}\n aria-haspopup=\"menu\"\n aria-expanded={isOpen}\n >\n {trigger}\n </div>\n {isOpen && (\n <Box\n ref={menuRef}\n position=\"absolute\"\n top=\"100%\"\n {...(align === \"end\" ? { right: 0 } : { left: 0 })}\n marginTop={4}\n backgroundColor={theme.colors.background.secondary}\n borderColor={theme.colors.border.secondary}\n borderWidth={1}\n borderRadius={theme.radius.button}\n paddingVertical={4}\n role=\"menu\"\n {...(ariaLabel ? { \"aria-label\": ariaLabel } : {})}\n style={{\n zIndex: 1000,\n boxShadow: \"0 4px 12px rgba(0,0,0,0.1)\",\n ...(width === \"auto\" ? { minWidth: \"100%\" } : { width }),\n }}\n >\n {children}\n </Box>\n )}\n </div>\n );\n }\n);\n\nexport interface DropdownItemProps extends ThemeOverrideProps {\n children: React.ReactNode;\n onPress?: () => void;\n active?: boolean;\n /** Whether this item is selected (shows trailing checkmark with control/check/bg color) */\n selected?: boolean;\n disabled?: boolean;\n icon?: React.ReactNode;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\nexport const DropdownItem: React.FC<DropdownItemProps> = ({\n children,\n onPress,\n active,\n selected,\n disabled,\n icon,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const brandColors = theme.colors.control.brand.primary;\n const contentColors = theme.colors.content;\n\n // Determine background color\n const getBackgroundColor = () => {\n if (selected) {\n return brandColors?.bg || theme.colors.control.input.bg; // Cyan background for selected items\n }\n if (active) {\n return theme.colors.control.input.bgHover;\n }\n return \"transparent\";\n };\n\n // Determine text/icon color\n const getContentColor = () => {\n if (selected) {\n return contentColors?.on?.brand || theme.colors.content.primary; // Black text on cyan background\n }\n return theme.colors.content.secondary;\n };\n\n // Handle keyboard activation\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if ((event.key === \"Enter\" || event.key === \" \") && !disabled && onPress) {\n event.preventDefault();\n onPress();\n }\n };\n\n return (\n <Box\n onPress={!disabled ? onPress : undefined}\n paddingHorizontal={16}\n paddingVertical={8}\n flexDirection=\"row\"\n alignItems=\"center\"\n backgroundColor={getBackgroundColor()}\n hoverStyle={\n !disabled && !selected\n ? {\n backgroundColor: theme.colors.control.input.bgHover,\n }\n : undefined\n }\n role=\"menuitem\"\n tabIndex={disabled ? -1 : 0}\n aria-disabled={disabled}\n onKeyDown={handleKeyDown}\n testID={testID}\n style={{\n opacity: disabled ? 0.5 : 1,\n cursor: disabled ? \"not-allowed\" : \"pointer\",\n }}\n >\n {icon && (\n <Box marginRight={12} alignItems=\"center\" justifyContent=\"center\">\n {icon}\n </Box>\n )}\n <Box flex={1}>\n <Text color={getContentColor()} fontSize={14} fontWeight=\"400\">\n {children}\n </Text>\n </Box>\n </Box>\n );\n};\n\nDropdown.displayName = \"Dropdown\";\nDropdownItem.displayName = \"DropdownItem\";\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 testID,\n \"data-testid\": dataTestId,\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={dataTestId || testID || id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n"],"mappings":"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","names":["import_react_native","import_jsx_runtime","RNText","import_jsx_runtime","React"]}
package/native/index.mjs CHANGED
@@ -209,6 +209,8 @@ var Text = ({
209
209
  numberOfLines,
210
210
  id,
211
211
  role,
212
+ testID,
213
+ "data-testid": dataTestId,
212
214
  style: styleProp,
213
215
  ...props
214
216
  }) => {
@@ -238,7 +240,7 @@ var Text = ({
238
240
  {
239
241
  style: baseStyle,
240
242
  numberOfLines,
241
- testID: id,
243
+ testID: dataTestId || testID || id,
242
244
  accessibilityRole,
243
245
  children
244
246
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Dropdown.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useCallback } 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 DropdownProps extends ThemeOverrideProps {\n id?: string;\n trigger: React.ReactNode;\n children: React.ReactNode;\n isOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n /** Width of the dropdown menu (does not affect trigger width) */\n width?: string | number;\n /** Horizontal alignment of dropdown menu relative to trigger. Default: \"start\" */\n align?: \"start\" | \"end\";\n /** Accessible label for the dropdown menu */\n \"aria-label\"?: string;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\nexport const Dropdown = React.forwardRef<HTMLDivElement, DropdownProps>(\n (\n {\n id,\n trigger,\n children,\n isOpen: propIsOpen,\n onOpenChange,\n width = \"auto\",\n align = \"start\",\n \"aria-label\": ariaLabel,\n testID,\n themeMode,\n themeProductContext,\n },\n ref\n ) => {\n const [internalIsOpen, setInternalIsOpen] = useState(false);\n const isOpen = propIsOpen !== undefined ? propIsOpen : internalIsOpen;\n const containerRef = useRef<HTMLDivElement>(null);\n const triggerRef = useRef<HTMLDivElement>(null);\n const menuRef = useRef<HTMLDivElement>(null);\n\n // Merge forwarded ref with internal container ref\n React.useImperativeHandle(\n ref,\n () => containerRef.current as HTMLDivElement\n );\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n const closeMenu = useCallback(() => {\n if (propIsOpen === undefined) {\n setInternalIsOpen(false);\n }\n if (onOpenChange) onOpenChange(false);\n }, [propIsOpen, onOpenChange]);\n\n const toggleOpen = useCallback(() => {\n const nextOpen = !isOpen;\n if (propIsOpen === undefined) {\n setInternalIsOpen(nextOpen);\n }\n if (onOpenChange) onOpenChange(nextOpen);\n }, [isOpen, propIsOpen, onOpenChange]);\n\n // Safe focus helper for cross-platform compatibility\n const focusTrigger = useCallback(() => {\n if (typeof document !== \"undefined\" && triggerRef.current) {\n // Find the first focusable element within the trigger wrapper\n const focusable = triggerRef.current.querySelector<HTMLElement>(\n 'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])'\n );\n if (focusable) {\n focusable.focus();\n }\n }\n }, []);\n\n // Handle keyboard navigation\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === \"Escape\" && isOpen) {\n event.preventDefault();\n closeMenu();\n focusTrigger();\n } else if (event.key === \"Tab\" && isOpen) {\n closeMenu();\n // Also restore focus on Tab for consistent keyboard navigation\n focusTrigger();\n }\n },\n [isOpen, closeMenu, focusTrigger]\n );\n\n // Handle trigger keyboard events\n const handleTriggerKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n toggleOpen();\n } else if (event.key === \"ArrowDown\" && !isOpen) {\n event.preventDefault();\n if (propIsOpen === undefined) {\n setInternalIsOpen(true);\n }\n if (onOpenChange) onOpenChange(true);\n }\n },\n [isOpen, toggleOpen, propIsOpen, onOpenChange]\n );\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (\n containerRef.current &&\n !containerRef.current.contains(event.target as Node)\n ) {\n closeMenu();\n }\n };\n\n if (isOpen && typeof document !== \"undefined\") {\n document.addEventListener(\"mousedown\", handleClickOutside);\n }\n return () => {\n if (typeof document !== \"undefined\") {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n }\n };\n }, [isOpen, closeMenu]);\n\n return (\n <div\n ref={containerRef}\n id={id}\n style={{\n position: \"relative\",\n width: \"fit-content\",\n alignSelf: \"flex-start\",\n height: \"fit-content\",\n }}\n onKeyDown={handleKeyDown}\n data-testid={testID}\n >\n <div\n ref={triggerRef}\n onClick={toggleOpen}\n onKeyDown={handleTriggerKeyDown}\n aria-haspopup=\"menu\"\n aria-expanded={isOpen}\n >\n {trigger}\n </div>\n {isOpen && (\n <Box\n ref={menuRef}\n position=\"absolute\"\n top=\"100%\"\n {...(align === \"end\" ? { right: 0 } : { left: 0 })}\n marginTop={4}\n backgroundColor={theme.colors.background.secondary}\n borderColor={theme.colors.border.secondary}\n borderWidth={1}\n borderRadius={theme.radius.button}\n paddingVertical={4}\n role=\"menu\"\n {...(ariaLabel ? { \"aria-label\": ariaLabel } : {})}\n style={{\n zIndex: 1000,\n boxShadow: \"0 4px 12px rgba(0,0,0,0.1)\",\n ...(width === \"auto\" ? { minWidth: \"100%\" } : { width }),\n }}\n >\n {children}\n </Box>\n )}\n </div>\n );\n }\n);\n\nexport interface DropdownItemProps extends ThemeOverrideProps {\n children: React.ReactNode;\n onPress?: () => void;\n active?: boolean;\n /** Whether this item is selected (shows trailing checkmark with control/check/bg color) */\n selected?: boolean;\n disabled?: boolean;\n icon?: React.ReactNode;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\nexport const DropdownItem: React.FC<DropdownItemProps> = ({\n children,\n onPress,\n active,\n selected,\n disabled,\n icon,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const brandColors = theme.colors.control.brand.primary;\n const contentColors = theme.colors.content;\n\n // Determine background color\n const getBackgroundColor = () => {\n if (selected) {\n return brandColors?.bg || theme.colors.control.input.bg; // Cyan background for selected items\n }\n if (active) {\n return theme.colors.control.input.bgHover;\n }\n return \"transparent\";\n };\n\n // Determine text/icon color\n const getContentColor = () => {\n if (selected) {\n return contentColors?.on?.brand || theme.colors.content.primary; // Black text on cyan background\n }\n return theme.colors.content.secondary;\n };\n\n // Handle keyboard activation\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if ((event.key === \"Enter\" || event.key === \" \") && !disabled && onPress) {\n event.preventDefault();\n onPress();\n }\n };\n\n return (\n <Box\n onPress={!disabled ? onPress : undefined}\n paddingHorizontal={16}\n paddingVertical={8}\n flexDirection=\"row\"\n alignItems=\"center\"\n backgroundColor={getBackgroundColor()}\n hoverStyle={\n !disabled && !selected\n ? {\n backgroundColor: theme.colors.control.input.bgHover,\n }\n : undefined\n }\n role=\"menuitem\"\n tabIndex={disabled ? -1 : 0}\n aria-disabled={disabled}\n onKeyDown={handleKeyDown}\n testID={testID}\n style={{\n opacity: disabled ? 0.5 : 1,\n cursor: disabled ? \"not-allowed\" : \"pointer\",\n }}\n >\n {icon && (\n <Box marginRight={12} alignItems=\"center\" justifyContent=\"center\">\n {icon}\n </Box>\n )}\n <Box flex={1}>\n <Text color={getContentColor()} fontSize={14} fontWeight=\"400\">\n {children}\n </Text>\n </Box>\n </Box>\n );\n};\n\nDropdown.displayName = \"Dropdown\";\nDropdownItem.displayName = \"DropdownItem\";\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"],"mappings":";AAAA,OAAO,SAAS,UAAU,QAAQ,WAAW,mBAAmB;;;ACChE;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OAKK;AA2ID;AAxIC,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;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;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;;;AC/LA;AAAA,EACE,QAAQ;AAAA,EAGR;AAAA,OACK;AAmEH,gBAAAA,YAAA;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,WAAW,QAAQ,SAAS;AAElD,QAAM,YAAuB;AAAA,IAC3B,OAAO,SAAS,eAAe;AAAA,IAC/B,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,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP;AAAA,MACA,QAAQ;AAAA,MACR;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;;;AF/EA,SAAS,wBAAiD;AAkIpD,SAYE,OAAAC,MAZF;AAhHC,IAAM,WAAW,MAAM;AAAA,EAC5B,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,IACA,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,EACF,GACA,QACG;AACH,UAAM,CAAC,gBAAgB,iBAAiB,IAAI,SAAS,KAAK;AAC1D,UAAM,SAAS,eAAe,SAAY,aAAa;AACvD,UAAM,eAAe,OAAuB,IAAI;AAChD,UAAM,aAAa,OAAuB,IAAI;AAC9C,UAAM,UAAU,OAAuB,IAAI;AAG3C,UAAM;AAAA,MACJ;AAAA,MACA,MAAM,aAAa;AAAA,IACrB;AACA,UAAM,EAAE,MAAM,IAAI,iBAAiB,EAAE,WAAW,oBAAoB,CAAC;AAErE,UAAM,YAAY,YAAY,MAAM;AAClC,UAAI,eAAe,QAAW;AAC5B,0BAAkB,KAAK;AAAA,MACzB;AACA,UAAI,aAAc,cAAa,KAAK;AAAA,IACtC,GAAG,CAAC,YAAY,YAAY,CAAC;AAE7B,UAAM,aAAa,YAAY,MAAM;AACnC,YAAM,WAAW,CAAC;AAClB,UAAI,eAAe,QAAW;AAC5B,0BAAkB,QAAQ;AAAA,MAC5B;AACA,UAAI,aAAc,cAAa,QAAQ;AAAA,IACzC,GAAG,CAAC,QAAQ,YAAY,YAAY,CAAC;AAGrC,UAAM,eAAe,YAAY,MAAM;AACrC,UAAI,OAAO,aAAa,eAAe,WAAW,SAAS;AAEzD,cAAM,YAAY,WAAW,QAAQ;AAAA,UACnC;AAAA,QACF;AACA,YAAI,WAAW;AACb,oBAAU,MAAM;AAAA,QAClB;AAAA,MACF;AAAA,IACF,GAAG,CAAC,CAAC;AAGL,UAAM,gBAAgB;AAAA,MACpB,CAAC,UAA+B;AAC9B,YAAI,MAAM,QAAQ,YAAY,QAAQ;AACpC,gBAAM,eAAe;AACrB,oBAAU;AACV,uBAAa;AAAA,QACf,WAAW,MAAM,QAAQ,SAAS,QAAQ;AACxC,oBAAU;AAEV,uBAAa;AAAA,QACf;AAAA,MACF;AAAA,MACA,CAAC,QAAQ,WAAW,YAAY;AAAA,IAClC;AAGA,UAAM,uBAAuB;AAAA,MAC3B,CAAC,UAA+B;AAC9B,YAAI,MAAM,QAAQ,WAAW,MAAM,QAAQ,KAAK;AAC9C,gBAAM,eAAe;AACrB,qBAAW;AAAA,QACb,WAAW,MAAM,QAAQ,eAAe,CAAC,QAAQ;AAC/C,gBAAM,eAAe;AACrB,cAAI,eAAe,QAAW;AAC5B,8BAAkB,IAAI;AAAA,UACxB;AACA,cAAI,aAAc,cAAa,IAAI;AAAA,QACrC;AAAA,MACF;AAAA,MACA,CAAC,QAAQ,YAAY,YAAY,YAAY;AAAA,IAC/C;AAEA,cAAU,MAAM;AACd,YAAM,qBAAqB,CAAC,UAAsB;AAChD,YACE,aAAa,WACb,CAAC,aAAa,QAAQ,SAAS,MAAM,MAAc,GACnD;AACA,oBAAU;AAAA,QACZ;AAAA,MACF;AAEA,UAAI,UAAU,OAAO,aAAa,aAAa;AAC7C,iBAAS,iBAAiB,aAAa,kBAAkB;AAAA,MAC3D;AACA,aAAO,MAAM;AACX,YAAI,OAAO,aAAa,aAAa;AACnC,mBAAS,oBAAoB,aAAa,kBAAkB;AAAA,QAC9D;AAAA,MACF;AAAA,IACF,GAAG,CAAC,QAAQ,SAAS,CAAC;AAEtB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL;AAAA,QACA,OAAO;AAAA,UACL,UAAU;AAAA,UACV,OAAO;AAAA,UACP,WAAW;AAAA,UACX,QAAQ;AAAA,QACV;AAAA,QACA,WAAW;AAAA,QACX,eAAa;AAAA,QAEb;AAAA,0BAAAA;AAAA,YAAC;AAAA;AAAA,cACC,KAAK;AAAA,cACL,SAAS;AAAA,cACT,WAAW;AAAA,cACX,iBAAc;AAAA,cACd,iBAAe;AAAA,cAEd;AAAA;AAAA,UACH;AAAA,UACC,UACC,gBAAAA;AAAA,YAAC;AAAA;AAAA,cACC,KAAK;AAAA,cACL,UAAS;AAAA,cACT,KAAI;AAAA,cACH,GAAI,UAAU,QAAQ,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE;AAAA,cAChD,WAAW;AAAA,cACX,iBAAiB,MAAM,OAAO,WAAW;AAAA,cACzC,aAAa,MAAM,OAAO,OAAO;AAAA,cACjC,aAAa;AAAA,cACb,cAAc,MAAM,OAAO;AAAA,cAC3B,iBAAiB;AAAA,cACjB,MAAK;AAAA,cACJ,GAAI,YAAY,EAAE,cAAc,UAAU,IAAI,CAAC;AAAA,cAChD,OAAO;AAAA,gBACL,QAAQ;AAAA,gBACR,WAAW;AAAA,gBACX,GAAI,UAAU,SAAS,EAAE,UAAU,OAAO,IAAI,EAAE,MAAM;AAAA,cACxD;AAAA,cAEC;AAAA;AAAA,UACH;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAcO,IAAM,eAA4C,CAAC;AAAA,EACxD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,MAAM,IAAI,iBAAiB,EAAE,WAAW,oBAAoB,CAAC;AACrE,QAAM,cAAc,MAAM,OAAO,QAAQ,MAAM;AAC/C,QAAM,gBAAgB,MAAM,OAAO;AAGnC,QAAM,qBAAqB,MAAM;AAC/B,QAAI,UAAU;AACZ,aAAO,aAAa,MAAM,MAAM,OAAO,QAAQ,MAAM;AAAA,IACvD;AACA,QAAI,QAAQ;AACV,aAAO,MAAM,OAAO,QAAQ,MAAM;AAAA,IACpC;AACA,WAAO;AAAA,EACT;AAGA,QAAM,kBAAkB,MAAM;AAC5B,QAAI,UAAU;AACZ,aAAO,eAAe,IAAI,SAAS,MAAM,OAAO,QAAQ;AAAA,IAC1D;AACA,WAAO,MAAM,OAAO,QAAQ;AAAA,EAC9B;AAGA,QAAM,gBAAgB,CAAC,UAA+B;AACpD,SAAK,MAAM,QAAQ,WAAW,MAAM,QAAQ,QAAQ,CAAC,YAAY,SAAS;AACxE,YAAM,eAAe;AACrB,cAAQ;AAAA,IACV;AAAA,EACF;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,CAAC,WAAW,UAAU;AAAA,MAC/B,mBAAmB;AAAA,MACnB,iBAAiB;AAAA,MACjB,eAAc;AAAA,MACd,YAAW;AAAA,MACX,iBAAiB,mBAAmB;AAAA,MACpC,YACE,CAAC,YAAY,CAAC,WACV;AAAA,QACE,iBAAiB,MAAM,OAAO,QAAQ,MAAM;AAAA,MAC9C,IACA;AAAA,MAEN,MAAK;AAAA,MACL,UAAU,WAAW,KAAK;AAAA,MAC1B,iBAAe;AAAA,MACf,WAAW;AAAA,MACX;AAAA,MACA,OAAO;AAAA,QACL,SAAS,WAAW,MAAM;AAAA,QAC1B,QAAQ,WAAW,gBAAgB;AAAA,MACrC;AAAA,MAEC;AAAA,gBACC,gBAAAA,KAAC,OAAI,aAAa,IAAI,YAAW,UAAS,gBAAe,UACtD,gBACH;AAAA,QAEF,gBAAAA,KAAC,OAAI,MAAM,GACT,0BAAAA,KAAC,QAAK,OAAO,gBAAgB,GAAG,UAAU,IAAI,YAAW,OACtD,UACH,GACF;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,SAAS,cAAc;AACvB,aAAa,cAAc;","names":["jsx","jsx"]}
1
+ {"version":3,"sources":["../../src/Dropdown.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useCallback } 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 DropdownProps extends ThemeOverrideProps {\n id?: string;\n trigger: React.ReactNode;\n children: React.ReactNode;\n isOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n /** Width of the dropdown menu (does not affect trigger width) */\n width?: string | number;\n /** Horizontal alignment of dropdown menu relative to trigger. Default: \"start\" */\n align?: \"start\" | \"end\";\n /** Accessible label for the dropdown menu */\n \"aria-label\"?: string;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\nexport const Dropdown = React.forwardRef<HTMLDivElement, DropdownProps>(\n (\n {\n id,\n trigger,\n children,\n isOpen: propIsOpen,\n onOpenChange,\n width = \"auto\",\n align = \"start\",\n \"aria-label\": ariaLabel,\n testID,\n themeMode,\n themeProductContext,\n },\n ref\n ) => {\n const [internalIsOpen, setInternalIsOpen] = useState(false);\n const isOpen = propIsOpen !== undefined ? propIsOpen : internalIsOpen;\n const containerRef = useRef<HTMLDivElement>(null);\n const triggerRef = useRef<HTMLDivElement>(null);\n const menuRef = useRef<HTMLDivElement>(null);\n\n // Merge forwarded ref with internal container ref\n React.useImperativeHandle(\n ref,\n () => containerRef.current as HTMLDivElement\n );\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n const closeMenu = useCallback(() => {\n if (propIsOpen === undefined) {\n setInternalIsOpen(false);\n }\n if (onOpenChange) onOpenChange(false);\n }, [propIsOpen, onOpenChange]);\n\n const toggleOpen = useCallback(() => {\n const nextOpen = !isOpen;\n if (propIsOpen === undefined) {\n setInternalIsOpen(nextOpen);\n }\n if (onOpenChange) onOpenChange(nextOpen);\n }, [isOpen, propIsOpen, onOpenChange]);\n\n // Safe focus helper for cross-platform compatibility\n const focusTrigger = useCallback(() => {\n if (typeof document !== \"undefined\" && triggerRef.current) {\n // Find the first focusable element within the trigger wrapper\n const focusable = triggerRef.current.querySelector<HTMLElement>(\n 'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])'\n );\n if (focusable) {\n focusable.focus();\n }\n }\n }, []);\n\n // Handle keyboard navigation\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === \"Escape\" && isOpen) {\n event.preventDefault();\n closeMenu();\n focusTrigger();\n } else if (event.key === \"Tab\" && isOpen) {\n closeMenu();\n // Also restore focus on Tab for consistent keyboard navigation\n focusTrigger();\n }\n },\n [isOpen, closeMenu, focusTrigger]\n );\n\n // Handle trigger keyboard events\n const handleTriggerKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n toggleOpen();\n } else if (event.key === \"ArrowDown\" && !isOpen) {\n event.preventDefault();\n if (propIsOpen === undefined) {\n setInternalIsOpen(true);\n }\n if (onOpenChange) onOpenChange(true);\n }\n },\n [isOpen, toggleOpen, propIsOpen, onOpenChange]\n );\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (\n containerRef.current &&\n !containerRef.current.contains(event.target as Node)\n ) {\n closeMenu();\n }\n };\n\n if (isOpen && typeof document !== \"undefined\") {\n document.addEventListener(\"mousedown\", handleClickOutside);\n }\n return () => {\n if (typeof document !== \"undefined\") {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n }\n };\n }, [isOpen, closeMenu]);\n\n return (\n <div\n ref={containerRef}\n id={id}\n style={{\n position: \"relative\",\n width: \"fit-content\",\n alignSelf: \"flex-start\",\n height: \"fit-content\",\n }}\n onKeyDown={handleKeyDown}\n data-testid={testID}\n >\n <div\n ref={triggerRef}\n onClick={toggleOpen}\n onKeyDown={handleTriggerKeyDown}\n aria-haspopup=\"menu\"\n aria-expanded={isOpen}\n >\n {trigger}\n </div>\n {isOpen && (\n <Box\n ref={menuRef}\n position=\"absolute\"\n top=\"100%\"\n {...(align === \"end\" ? { right: 0 } : { left: 0 })}\n marginTop={4}\n backgroundColor={theme.colors.background.secondary}\n borderColor={theme.colors.border.secondary}\n borderWidth={1}\n borderRadius={theme.radius.button}\n paddingVertical={4}\n role=\"menu\"\n {...(ariaLabel ? { \"aria-label\": ariaLabel } : {})}\n style={{\n zIndex: 1000,\n boxShadow: \"0 4px 12px rgba(0,0,0,0.1)\",\n ...(width === \"auto\" ? { minWidth: \"100%\" } : { width }),\n }}\n >\n {children}\n </Box>\n )}\n </div>\n );\n }\n);\n\nexport interface DropdownItemProps extends ThemeOverrideProps {\n children: React.ReactNode;\n onPress?: () => void;\n active?: boolean;\n /** Whether this item is selected (shows trailing checkmark with control/check/bg color) */\n selected?: boolean;\n disabled?: boolean;\n icon?: React.ReactNode;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\nexport const DropdownItem: React.FC<DropdownItemProps> = ({\n children,\n onPress,\n active,\n selected,\n disabled,\n icon,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const brandColors = theme.colors.control.brand.primary;\n const contentColors = theme.colors.content;\n\n // Determine background color\n const getBackgroundColor = () => {\n if (selected) {\n return brandColors?.bg || theme.colors.control.input.bg; // Cyan background for selected items\n }\n if (active) {\n return theme.colors.control.input.bgHover;\n }\n return \"transparent\";\n };\n\n // Determine text/icon color\n const getContentColor = () => {\n if (selected) {\n return contentColors?.on?.brand || theme.colors.content.primary; // Black text on cyan background\n }\n return theme.colors.content.secondary;\n };\n\n // Handle keyboard activation\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if ((event.key === \"Enter\" || event.key === \" \") && !disabled && onPress) {\n event.preventDefault();\n onPress();\n }\n };\n\n return (\n <Box\n onPress={!disabled ? onPress : undefined}\n paddingHorizontal={16}\n paddingVertical={8}\n flexDirection=\"row\"\n alignItems=\"center\"\n backgroundColor={getBackgroundColor()}\n hoverStyle={\n !disabled && !selected\n ? {\n backgroundColor: theme.colors.control.input.bgHover,\n }\n : undefined\n }\n role=\"menuitem\"\n tabIndex={disabled ? -1 : 0}\n aria-disabled={disabled}\n onKeyDown={handleKeyDown}\n testID={testID}\n style={{\n opacity: disabled ? 0.5 : 1,\n cursor: disabled ? \"not-allowed\" : \"pointer\",\n }}\n >\n {icon && (\n <Box marginRight={12} alignItems=\"center\" justifyContent=\"center\">\n {icon}\n </Box>\n )}\n <Box flex={1}>\n <Text color={getContentColor()} fontSize={14} fontWeight=\"400\">\n {children}\n </Text>\n </Box>\n </Box>\n );\n};\n\nDropdown.displayName = \"Dropdown\";\nDropdownItem.displayName = \"DropdownItem\";\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 testID,\n \"data-testid\": dataTestId,\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={dataTestId || testID || id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\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-dropdown",
3
- "version": "0.157.0",
3
+ "version": "0.158.0-pr306.1779437575",
4
4
  "main": "./web/index.js",
5
5
  "module": "./web/index.mjs",
6
6
  "types": "./web/index.d.ts",
@@ -13,11 +13,11 @@
13
13
  "test:coverage": "vitest run --coverage"
14
14
  },
15
15
  "dependencies": {
16
- "@xsolla/xui-button": "0.157.0",
17
- "@xsolla/xui-core": "0.157.0",
18
- "@xsolla/xui-divider": "0.157.0",
19
- "@xsolla/xui-icons": "0.157.0",
20
- "@xsolla/xui-primitives-core": "0.157.0"
16
+ "@xsolla/xui-button": "0.158.0-pr306.1779437575",
17
+ "@xsolla/xui-core": "0.158.0-pr306.1779437575",
18
+ "@xsolla/xui-divider": "0.158.0-pr306.1779437575",
19
+ "@xsolla/xui-icons": "0.158.0-pr306.1779437575",
20
+ "@xsolla/xui-primitives-core": "0.158.0-pr306.1779437575"
21
21
  },
22
22
  "peerDependencies": {
23
23
  "react": ">=16.8.0",
package/web/index.js CHANGED
@@ -250,7 +250,8 @@ var Box = import_react2.default.forwardRef(
250
250
  top: typeof props.top === "number" ? `${props.top}px` : props.top,
251
251
  left: typeof props.left === "number" ? `${props.left}px` : props.left,
252
252
  right: typeof props.right === "number" ? `${props.right}px` : props.right,
253
- bottom: typeof props.bottom === "number" ? `${props.bottom}px` : props.bottom
253
+ bottom: typeof props.bottom === "number" ? `${props.bottom}px` : props.bottom,
254
+ ...props.style
254
255
  }
255
256
  }
256
257
  );
@@ -307,6 +308,8 @@ var Text = ({
307
308
  className,
308
309
  id,
309
310
  role,
311
+ testID,
312
+ "data-testid": dataTestId,
310
313
  numberOfLines: _numberOfLines,
311
314
  ...props
312
315
  }) => {
@@ -317,7 +320,8 @@ var Text = ({
317
320
  style,
318
321
  className,
319
322
  id,
320
- role
323
+ role,
324
+ "data-testid": dataTestId || testID
321
325
  }
322
326
  );
323
327
  };
package/web/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.tsx","../../src/Dropdown.tsx","../../../../foundation/primitives-web/src/Box.tsx","../../../../foundation/primitives-web/src/filterDOMProps.ts","../../../../../node_modules/@emotion/memoize/dist/memoize.esm.js","../../../../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js","../../../../foundation/primitives-web/src/Text.tsx"],"sourcesContent":["export * from \"./Dropdown\";\n","import React, { useState, useRef, useEffect, useCallback } 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 DropdownProps extends ThemeOverrideProps {\n id?: string;\n trigger: React.ReactNode;\n children: React.ReactNode;\n isOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n /** Width of the dropdown menu (does not affect trigger width) */\n width?: string | number;\n /** Horizontal alignment of dropdown menu relative to trigger. Default: \"start\" */\n align?: \"start\" | \"end\";\n /** Accessible label for the dropdown menu */\n \"aria-label\"?: string;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\nexport const Dropdown = React.forwardRef<HTMLDivElement, DropdownProps>(\n (\n {\n id,\n trigger,\n children,\n isOpen: propIsOpen,\n onOpenChange,\n width = \"auto\",\n align = \"start\",\n \"aria-label\": ariaLabel,\n testID,\n themeMode,\n themeProductContext,\n },\n ref\n ) => {\n const [internalIsOpen, setInternalIsOpen] = useState(false);\n const isOpen = propIsOpen !== undefined ? propIsOpen : internalIsOpen;\n const containerRef = useRef<HTMLDivElement>(null);\n const triggerRef = useRef<HTMLDivElement>(null);\n const menuRef = useRef<HTMLDivElement>(null);\n\n // Merge forwarded ref with internal container ref\n React.useImperativeHandle(\n ref,\n () => containerRef.current as HTMLDivElement\n );\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n const closeMenu = useCallback(() => {\n if (propIsOpen === undefined) {\n setInternalIsOpen(false);\n }\n if (onOpenChange) onOpenChange(false);\n }, [propIsOpen, onOpenChange]);\n\n const toggleOpen = useCallback(() => {\n const nextOpen = !isOpen;\n if (propIsOpen === undefined) {\n setInternalIsOpen(nextOpen);\n }\n if (onOpenChange) onOpenChange(nextOpen);\n }, [isOpen, propIsOpen, onOpenChange]);\n\n // Safe focus helper for cross-platform compatibility\n const focusTrigger = useCallback(() => {\n if (typeof document !== \"undefined\" && triggerRef.current) {\n // Find the first focusable element within the trigger wrapper\n const focusable = triggerRef.current.querySelector<HTMLElement>(\n 'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])'\n );\n if (focusable) {\n focusable.focus();\n }\n }\n }, []);\n\n // Handle keyboard navigation\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === \"Escape\" && isOpen) {\n event.preventDefault();\n closeMenu();\n focusTrigger();\n } else if (event.key === \"Tab\" && isOpen) {\n closeMenu();\n // Also restore focus on Tab for consistent keyboard navigation\n focusTrigger();\n }\n },\n [isOpen, closeMenu, focusTrigger]\n );\n\n // Handle trigger keyboard events\n const handleTriggerKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n toggleOpen();\n } else if (event.key === \"ArrowDown\" && !isOpen) {\n event.preventDefault();\n if (propIsOpen === undefined) {\n setInternalIsOpen(true);\n }\n if (onOpenChange) onOpenChange(true);\n }\n },\n [isOpen, toggleOpen, propIsOpen, onOpenChange]\n );\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (\n containerRef.current &&\n !containerRef.current.contains(event.target as Node)\n ) {\n closeMenu();\n }\n };\n\n if (isOpen && typeof document !== \"undefined\") {\n document.addEventListener(\"mousedown\", handleClickOutside);\n }\n return () => {\n if (typeof document !== \"undefined\") {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n }\n };\n }, [isOpen, closeMenu]);\n\n return (\n <div\n ref={containerRef}\n id={id}\n style={{\n position: \"relative\",\n width: \"fit-content\",\n alignSelf: \"flex-start\",\n height: \"fit-content\",\n }}\n onKeyDown={handleKeyDown}\n data-testid={testID}\n >\n <div\n ref={triggerRef}\n onClick={toggleOpen}\n onKeyDown={handleTriggerKeyDown}\n aria-haspopup=\"menu\"\n aria-expanded={isOpen}\n >\n {trigger}\n </div>\n {isOpen && (\n <Box\n ref={menuRef}\n position=\"absolute\"\n top=\"100%\"\n {...(align === \"end\" ? { right: 0 } : { left: 0 })}\n marginTop={4}\n backgroundColor={theme.colors.background.secondary}\n borderColor={theme.colors.border.secondary}\n borderWidth={1}\n borderRadius={theme.radius.button}\n paddingVertical={4}\n role=\"menu\"\n {...(ariaLabel ? { \"aria-label\": ariaLabel } : {})}\n style={{\n zIndex: 1000,\n boxShadow: \"0 4px 12px rgba(0,0,0,0.1)\",\n ...(width === \"auto\" ? { minWidth: \"100%\" } : { width }),\n }}\n >\n {children}\n </Box>\n )}\n </div>\n );\n }\n);\n\nexport interface DropdownItemProps extends ThemeOverrideProps {\n children: React.ReactNode;\n onPress?: () => void;\n active?: boolean;\n /** Whether this item is selected (shows trailing checkmark with control/check/bg color) */\n selected?: boolean;\n disabled?: boolean;\n icon?: React.ReactNode;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\nexport const DropdownItem: React.FC<DropdownItemProps> = ({\n children,\n onPress,\n active,\n selected,\n disabled,\n icon,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const brandColors = theme.colors.control.brand.primary;\n const contentColors = theme.colors.content;\n\n // Determine background color\n const getBackgroundColor = () => {\n if (selected) {\n return brandColors?.bg || theme.colors.control.input.bg; // Cyan background for selected items\n }\n if (active) {\n return theme.colors.control.input.bgHover;\n }\n return \"transparent\";\n };\n\n // Determine text/icon color\n const getContentColor = () => {\n if (selected) {\n return contentColors?.on?.brand || theme.colors.content.primary; // Black text on cyan background\n }\n return theme.colors.content.secondary;\n };\n\n // Handle keyboard activation\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if ((event.key === \"Enter\" || event.key === \" \") && !disabled && onPress) {\n event.preventDefault();\n onPress();\n }\n };\n\n return (\n <Box\n onPress={!disabled ? onPress : undefined}\n paddingHorizontal={16}\n paddingVertical={8}\n flexDirection=\"row\"\n alignItems=\"center\"\n backgroundColor={getBackgroundColor()}\n hoverStyle={\n !disabled && !selected\n ? {\n backgroundColor: theme.colors.control.input.bgHover,\n }\n : undefined\n }\n role=\"menuitem\"\n tabIndex={disabled ? -1 : 0}\n aria-disabled={disabled}\n onKeyDown={handleKeyDown}\n testID={testID}\n style={{\n opacity: disabled ? 0.5 : 1,\n cursor: disabled ? \"not-allowed\" : \"pointer\",\n }}\n >\n {icon && (\n <Box marginRight={12} alignItems=\"center\" justifyContent=\"center\">\n {icon}\n </Box>\n )}\n <Box flex={1}>\n <Text color={getContentColor()} fontSize={14} fontWeight=\"400\">\n {children}\n </Text>\n </Box>\n </Box>\n );\n};\n\nDropdown.displayName = \"Dropdown\";\nDropdownItem.displayName = \"DropdownItem\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (props.disabled ? 0.5 : 1)};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n onError,\n onLoad,\n type,\n disabled,\n id,\n testID,\n \"data-testid\": dataTestId,\n ...props\n },\n ref\n ) => {\n // Handle as=\"img\" for rendering images with proper border-radius\n if (as === \"img\" && src) {\n return (\n <img\n src={src}\n alt={alt || \"\"}\n onError={onError}\n onLoad={onLoad}\n style={{\n display: \"block\",\n objectFit: \"cover\",\n width:\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width,\n height:\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height,\n borderRadius:\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius,\n position: props.position,\n top: typeof props.top === \"number\" ? `${props.top}px` : props.top,\n left:\n typeof props.left === \"number\" ? `${props.left}px` : props.left,\n right:\n typeof props.right === \"number\"\n ? `${props.right}px`\n : props.right,\n bottom:\n typeof props.bottom === \"number\"\n ? `${props.bottom}px`\n : props.bottom,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n elementType={as}\n id={id}\n type={as === \"button\" ? type || \"button\" : undefined}\n disabled={as === \"button\" ? disabled : undefined}\n onClick={onPress}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n role={role}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-current={ariaCurrent}\n aria-disabled={ariaDisabled}\n aria-busy={ariaBusy}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n aria-live={ariaLive}\n tabIndex={tabIndex !== undefined ? tabIndex : undefined}\n data-testid={dataTestId || testID}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport isPropValid from \"@emotion/is-prop-valid\";\n\n// Props that @emotion/is-prop-valid incorrectly treats as valid HTML.\n// These are React Native or component-specific props that match\n// valid HTML patterns (on* event handlers, SVG attributes).\nexport const ADDITIONAL_BLOCKED_PROPS = new Set([\n // RN-only event handlers (pass isPropValid's on* pattern)\n \"onPress\",\n \"onChangeText\",\n \"onLayout\",\n \"onMoveShouldSetResponder\",\n \"onResponderGrant\",\n \"onResponderMove\",\n \"onResponderRelease\",\n \"onResponderTerminate\",\n // SVG attributes that pass isPropValid\n \"strokeWidth\",\n // CSS properties that pass isPropValid but are used as component props\n \"overflow\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n]);\n\nfunction shouldForwardProp(key: string): boolean {\n if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;\n return isPropValid(key);\n}\n\n/**\n * Creates a React component that renders the given HTML tag\n * but filters out non-HTML props before they reach the DOM.\n *\n * Uses @emotion/is-prop-valid (same library styled-components v4\n * uses internally) to automatically block invalid HTML attributes,\n * plus a small blocklist for false positives (RN on* handlers, SVG attrs).\n *\n * Usage: `const FilteredDiv = createFilteredElement(\"div\");`\n * Then: `const StyledBox = styled(FilteredDiv)<BoxProps>\\`...\\`;`\n *\n * styled-components can still read ALL props for CSS interpolation,\n * but only valid HTML attributes are forwarded to the DOM element.\n */\nexport function createFilteredElement(defaultTag: string) {\n const Component = React.forwardRef<HTMLElement, Record<string, unknown>>(\n ({ children, elementType, ...props }, ref) => {\n const Tag = (elementType as string) || defaultTag;\n const htmlProps: Record<string, unknown> = {};\n for (const key of Object.keys(props)) {\n if (shouldForwardProp(key)) {\n htmlProps[key] = props[key];\n }\n }\n return React.createElement(\n Tag,\n { ref, ...htmlProps },\n children as React.ReactNode\n );\n }\n );\n Component.displayName = `Filtered(${defaultTag})`;\n return Component;\n}\n","function memoize(fn) {\n var cache = {};\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport default memoize;\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|inert|itemProp|itemScope|itemType|itemID|itemRef|on|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar index = memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport default index;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredSpan = createFilteredElement(\"span\");\n\nconst StyledText = styled(FilteredSpan)<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n"],"mappings":"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","names":["import_react","import_react","React","styled","React","import_styled_components","import_jsx_runtime","styled","import_jsx_runtime","React"]}
1
+ {"version":3,"sources":["../../src/index.tsx","../../src/Dropdown.tsx","../../../../foundation/primitives-web/src/Box.tsx","../../../../foundation/primitives-web/src/filterDOMProps.ts","../../../../../node_modules/@emotion/memoize/dist/memoize.esm.js","../../../../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js","../../../../foundation/primitives-web/src/Text.tsx"],"sourcesContent":["export * from \"./Dropdown\";\n","import React, { useState, useRef, useEffect, useCallback } 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 DropdownProps extends ThemeOverrideProps {\n id?: string;\n trigger: React.ReactNode;\n children: React.ReactNode;\n isOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n /** Width of the dropdown menu (does not affect trigger width) */\n width?: string | number;\n /** Horizontal alignment of dropdown menu relative to trigger. Default: \"start\" */\n align?: \"start\" | \"end\";\n /** Accessible label for the dropdown menu */\n \"aria-label\"?: string;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\nexport const Dropdown = React.forwardRef<HTMLDivElement, DropdownProps>(\n (\n {\n id,\n trigger,\n children,\n isOpen: propIsOpen,\n onOpenChange,\n width = \"auto\",\n align = \"start\",\n \"aria-label\": ariaLabel,\n testID,\n themeMode,\n themeProductContext,\n },\n ref\n ) => {\n const [internalIsOpen, setInternalIsOpen] = useState(false);\n const isOpen = propIsOpen !== undefined ? propIsOpen : internalIsOpen;\n const containerRef = useRef<HTMLDivElement>(null);\n const triggerRef = useRef<HTMLDivElement>(null);\n const menuRef = useRef<HTMLDivElement>(null);\n\n // Merge forwarded ref with internal container ref\n React.useImperativeHandle(\n ref,\n () => containerRef.current as HTMLDivElement\n );\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n const closeMenu = useCallback(() => {\n if (propIsOpen === undefined) {\n setInternalIsOpen(false);\n }\n if (onOpenChange) onOpenChange(false);\n }, [propIsOpen, onOpenChange]);\n\n const toggleOpen = useCallback(() => {\n const nextOpen = !isOpen;\n if (propIsOpen === undefined) {\n setInternalIsOpen(nextOpen);\n }\n if (onOpenChange) onOpenChange(nextOpen);\n }, [isOpen, propIsOpen, onOpenChange]);\n\n // Safe focus helper for cross-platform compatibility\n const focusTrigger = useCallback(() => {\n if (typeof document !== \"undefined\" && triggerRef.current) {\n // Find the first focusable element within the trigger wrapper\n const focusable = triggerRef.current.querySelector<HTMLElement>(\n 'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])'\n );\n if (focusable) {\n focusable.focus();\n }\n }\n }, []);\n\n // Handle keyboard navigation\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === \"Escape\" && isOpen) {\n event.preventDefault();\n closeMenu();\n focusTrigger();\n } else if (event.key === \"Tab\" && isOpen) {\n closeMenu();\n // Also restore focus on Tab for consistent keyboard navigation\n focusTrigger();\n }\n },\n [isOpen, closeMenu, focusTrigger]\n );\n\n // Handle trigger keyboard events\n const handleTriggerKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n toggleOpen();\n } else if (event.key === \"ArrowDown\" && !isOpen) {\n event.preventDefault();\n if (propIsOpen === undefined) {\n setInternalIsOpen(true);\n }\n if (onOpenChange) onOpenChange(true);\n }\n },\n [isOpen, toggleOpen, propIsOpen, onOpenChange]\n );\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (\n containerRef.current &&\n !containerRef.current.contains(event.target as Node)\n ) {\n closeMenu();\n }\n };\n\n if (isOpen && typeof document !== \"undefined\") {\n document.addEventListener(\"mousedown\", handleClickOutside);\n }\n return () => {\n if (typeof document !== \"undefined\") {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n }\n };\n }, [isOpen, closeMenu]);\n\n return (\n <div\n ref={containerRef}\n id={id}\n style={{\n position: \"relative\",\n width: \"fit-content\",\n alignSelf: \"flex-start\",\n height: \"fit-content\",\n }}\n onKeyDown={handleKeyDown}\n data-testid={testID}\n >\n <div\n ref={triggerRef}\n onClick={toggleOpen}\n onKeyDown={handleTriggerKeyDown}\n aria-haspopup=\"menu\"\n aria-expanded={isOpen}\n >\n {trigger}\n </div>\n {isOpen && (\n <Box\n ref={menuRef}\n position=\"absolute\"\n top=\"100%\"\n {...(align === \"end\" ? { right: 0 } : { left: 0 })}\n marginTop={4}\n backgroundColor={theme.colors.background.secondary}\n borderColor={theme.colors.border.secondary}\n borderWidth={1}\n borderRadius={theme.radius.button}\n paddingVertical={4}\n role=\"menu\"\n {...(ariaLabel ? { \"aria-label\": ariaLabel } : {})}\n style={{\n zIndex: 1000,\n boxShadow: \"0 4px 12px rgba(0,0,0,0.1)\",\n ...(width === \"auto\" ? { minWidth: \"100%\" } : { width }),\n }}\n >\n {children}\n </Box>\n )}\n </div>\n );\n }\n);\n\nexport interface DropdownItemProps extends ThemeOverrideProps {\n children: React.ReactNode;\n onPress?: () => void;\n active?: boolean;\n /** Whether this item is selected (shows trailing checkmark with control/check/bg color) */\n selected?: boolean;\n disabled?: boolean;\n icon?: React.ReactNode;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\nexport const DropdownItem: React.FC<DropdownItemProps> = ({\n children,\n onPress,\n active,\n selected,\n disabled,\n icon,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const brandColors = theme.colors.control.brand.primary;\n const contentColors = theme.colors.content;\n\n // Determine background color\n const getBackgroundColor = () => {\n if (selected) {\n return brandColors?.bg || theme.colors.control.input.bg; // Cyan background for selected items\n }\n if (active) {\n return theme.colors.control.input.bgHover;\n }\n return \"transparent\";\n };\n\n // Determine text/icon color\n const getContentColor = () => {\n if (selected) {\n return contentColors?.on?.brand || theme.colors.content.primary; // Black text on cyan background\n }\n return theme.colors.content.secondary;\n };\n\n // Handle keyboard activation\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if ((event.key === \"Enter\" || event.key === \" \") && !disabled && onPress) {\n event.preventDefault();\n onPress();\n }\n };\n\n return (\n <Box\n onPress={!disabled ? onPress : undefined}\n paddingHorizontal={16}\n paddingVertical={8}\n flexDirection=\"row\"\n alignItems=\"center\"\n backgroundColor={getBackgroundColor()}\n hoverStyle={\n !disabled && !selected\n ? {\n backgroundColor: theme.colors.control.input.bgHover,\n }\n : undefined\n }\n role=\"menuitem\"\n tabIndex={disabled ? -1 : 0}\n aria-disabled={disabled}\n onKeyDown={handleKeyDown}\n testID={testID}\n style={{\n opacity: disabled ? 0.5 : 1,\n cursor: disabled ? \"not-allowed\" : \"pointer\",\n }}\n >\n {icon && (\n <Box marginRight={12} alignItems=\"center\" justifyContent=\"center\">\n {icon}\n </Box>\n )}\n <Box flex={1}>\n <Text color={getContentColor()} fontSize={14} fontWeight=\"400\">\n {children}\n </Text>\n </Box>\n </Box>\n );\n};\n\nDropdown.displayName = \"Dropdown\";\nDropdownItem.displayName = \"DropdownItem\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (props.disabled ? 0.5 : 1)};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n onError,\n onLoad,\n type,\n disabled,\n id,\n testID,\n \"data-testid\": dataTestId,\n ...props\n },\n ref\n ) => {\n // Handle as=\"img\" for rendering images with proper border-radius\n if (as === \"img\" && src) {\n return (\n <img\n src={src}\n alt={alt || \"\"}\n onError={onError}\n onLoad={onLoad}\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 ...props.style,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n elementType={as}\n id={id}\n type={as === \"button\" ? type || \"button\" : undefined}\n disabled={as === \"button\" ? disabled : undefined}\n onClick={onPress}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n role={role}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-current={ariaCurrent}\n aria-disabled={ariaDisabled}\n aria-busy={ariaBusy}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n aria-live={ariaLive}\n tabIndex={tabIndex !== undefined ? tabIndex : undefined}\n data-testid={dataTestId || testID}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport isPropValid from \"@emotion/is-prop-valid\";\n\n// Props that @emotion/is-prop-valid incorrectly treats as valid HTML.\n// These are React Native or component-specific props that match\n// valid HTML patterns (on* event handlers, SVG attributes).\nexport const ADDITIONAL_BLOCKED_PROPS = new Set([\n // RN-only event handlers (pass isPropValid's on* pattern)\n \"onPress\",\n \"onChangeText\",\n \"onLayout\",\n \"onMoveShouldSetResponder\",\n \"onResponderGrant\",\n \"onResponderMove\",\n \"onResponderRelease\",\n \"onResponderTerminate\",\n // SVG attributes that pass isPropValid\n \"strokeWidth\",\n // CSS properties that pass isPropValid but are used as component props\n \"overflow\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n]);\n\nfunction shouldForwardProp(key: string): boolean {\n if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;\n return isPropValid(key);\n}\n\n/**\n * Creates a React component that renders the given HTML tag\n * but filters out non-HTML props before they reach the DOM.\n *\n * Uses @emotion/is-prop-valid (same library styled-components v4\n * uses internally) to automatically block invalid HTML attributes,\n * plus a small blocklist for false positives (RN on* handlers, SVG attrs).\n *\n * Usage: `const FilteredDiv = createFilteredElement(\"div\");`\n * Then: `const StyledBox = styled(FilteredDiv)<BoxProps>\\`...\\`;`\n *\n * styled-components can still read ALL props for CSS interpolation,\n * but only valid HTML attributes are forwarded to the DOM element.\n */\nexport function createFilteredElement(defaultTag: string) {\n const Component = React.forwardRef<HTMLElement, Record<string, unknown>>(\n ({ children, elementType, ...props }, ref) => {\n const Tag = (elementType as string) || defaultTag;\n const htmlProps: Record<string, unknown> = {};\n for (const key of Object.keys(props)) {\n if (shouldForwardProp(key)) {\n htmlProps[key] = props[key];\n }\n }\n return React.createElement(\n Tag,\n { ref, ...htmlProps },\n children as React.ReactNode\n );\n }\n );\n Component.displayName = `Filtered(${defaultTag})`;\n return Component;\n}\n","function memoize(fn) {\n var cache = {};\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport default memoize;\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|inert|itemProp|itemScope|itemType|itemID|itemRef|on|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar index = memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport default index;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredSpan = createFilteredElement(\"span\");\n\nconst StyledText = styled(FilteredSpan)<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n testID,\n \"data-testid\": dataTestId,\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 data-testid={dataTestId || testID}\n />\n );\n};\n"],"mappings":"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","names":["import_react","import_react","React","styled","React","import_styled_components","import_jsx_runtime","styled","import_jsx_runtime","React"]}
package/web/index.mjs CHANGED
@@ -213,7 +213,8 @@ var Box = React2.forwardRef(
213
213
  top: typeof props.top === "number" ? `${props.top}px` : props.top,
214
214
  left: typeof props.left === "number" ? `${props.left}px` : props.left,
215
215
  right: typeof props.right === "number" ? `${props.right}px` : props.right,
216
- bottom: typeof props.bottom === "number" ? `${props.bottom}px` : props.bottom
216
+ bottom: typeof props.bottom === "number" ? `${props.bottom}px` : props.bottom,
217
+ ...props.style
217
218
  }
218
219
  }
219
220
  );
@@ -270,6 +271,8 @@ var Text = ({
270
271
  className,
271
272
  id,
272
273
  role,
274
+ testID,
275
+ "data-testid": dataTestId,
273
276
  numberOfLines: _numberOfLines,
274
277
  ...props
275
278
  }) => {
@@ -280,7 +283,8 @@ var Text = ({
280
283
  style,
281
284
  className,
282
285
  id,
283
- role
286
+ role,
287
+ "data-testid": dataTestId || testID
284
288
  }
285
289
  );
286
290
  };
package/web/index.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Dropdown.tsx","../../../../foundation/primitives-web/src/Box.tsx","../../../../foundation/primitives-web/src/filterDOMProps.ts","../../../../../node_modules/@emotion/memoize/dist/memoize.esm.js","../../../../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js","../../../../foundation/primitives-web/src/Text.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useCallback } 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 DropdownProps extends ThemeOverrideProps {\n id?: string;\n trigger: React.ReactNode;\n children: React.ReactNode;\n isOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n /** Width of the dropdown menu (does not affect trigger width) */\n width?: string | number;\n /** Horizontal alignment of dropdown menu relative to trigger. Default: \"start\" */\n align?: \"start\" | \"end\";\n /** Accessible label for the dropdown menu */\n \"aria-label\"?: string;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\nexport const Dropdown = React.forwardRef<HTMLDivElement, DropdownProps>(\n (\n {\n id,\n trigger,\n children,\n isOpen: propIsOpen,\n onOpenChange,\n width = \"auto\",\n align = \"start\",\n \"aria-label\": ariaLabel,\n testID,\n themeMode,\n themeProductContext,\n },\n ref\n ) => {\n const [internalIsOpen, setInternalIsOpen] = useState(false);\n const isOpen = propIsOpen !== undefined ? propIsOpen : internalIsOpen;\n const containerRef = useRef<HTMLDivElement>(null);\n const triggerRef = useRef<HTMLDivElement>(null);\n const menuRef = useRef<HTMLDivElement>(null);\n\n // Merge forwarded ref with internal container ref\n React.useImperativeHandle(\n ref,\n () => containerRef.current as HTMLDivElement\n );\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n const closeMenu = useCallback(() => {\n if (propIsOpen === undefined) {\n setInternalIsOpen(false);\n }\n if (onOpenChange) onOpenChange(false);\n }, [propIsOpen, onOpenChange]);\n\n const toggleOpen = useCallback(() => {\n const nextOpen = !isOpen;\n if (propIsOpen === undefined) {\n setInternalIsOpen(nextOpen);\n }\n if (onOpenChange) onOpenChange(nextOpen);\n }, [isOpen, propIsOpen, onOpenChange]);\n\n // Safe focus helper for cross-platform compatibility\n const focusTrigger = useCallback(() => {\n if (typeof document !== \"undefined\" && triggerRef.current) {\n // Find the first focusable element within the trigger wrapper\n const focusable = triggerRef.current.querySelector<HTMLElement>(\n 'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])'\n );\n if (focusable) {\n focusable.focus();\n }\n }\n }, []);\n\n // Handle keyboard navigation\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === \"Escape\" && isOpen) {\n event.preventDefault();\n closeMenu();\n focusTrigger();\n } else if (event.key === \"Tab\" && isOpen) {\n closeMenu();\n // Also restore focus on Tab for consistent keyboard navigation\n focusTrigger();\n }\n },\n [isOpen, closeMenu, focusTrigger]\n );\n\n // Handle trigger keyboard events\n const handleTriggerKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n toggleOpen();\n } else if (event.key === \"ArrowDown\" && !isOpen) {\n event.preventDefault();\n if (propIsOpen === undefined) {\n setInternalIsOpen(true);\n }\n if (onOpenChange) onOpenChange(true);\n }\n },\n [isOpen, toggleOpen, propIsOpen, onOpenChange]\n );\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (\n containerRef.current &&\n !containerRef.current.contains(event.target as Node)\n ) {\n closeMenu();\n }\n };\n\n if (isOpen && typeof document !== \"undefined\") {\n document.addEventListener(\"mousedown\", handleClickOutside);\n }\n return () => {\n if (typeof document !== \"undefined\") {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n }\n };\n }, [isOpen, closeMenu]);\n\n return (\n <div\n ref={containerRef}\n id={id}\n style={{\n position: \"relative\",\n width: \"fit-content\",\n alignSelf: \"flex-start\",\n height: \"fit-content\",\n }}\n onKeyDown={handleKeyDown}\n data-testid={testID}\n >\n <div\n ref={triggerRef}\n onClick={toggleOpen}\n onKeyDown={handleTriggerKeyDown}\n aria-haspopup=\"menu\"\n aria-expanded={isOpen}\n >\n {trigger}\n </div>\n {isOpen && (\n <Box\n ref={menuRef}\n position=\"absolute\"\n top=\"100%\"\n {...(align === \"end\" ? { right: 0 } : { left: 0 })}\n marginTop={4}\n backgroundColor={theme.colors.background.secondary}\n borderColor={theme.colors.border.secondary}\n borderWidth={1}\n borderRadius={theme.radius.button}\n paddingVertical={4}\n role=\"menu\"\n {...(ariaLabel ? { \"aria-label\": ariaLabel } : {})}\n style={{\n zIndex: 1000,\n boxShadow: \"0 4px 12px rgba(0,0,0,0.1)\",\n ...(width === \"auto\" ? { minWidth: \"100%\" } : { width }),\n }}\n >\n {children}\n </Box>\n )}\n </div>\n );\n }\n);\n\nexport interface DropdownItemProps extends ThemeOverrideProps {\n children: React.ReactNode;\n onPress?: () => void;\n active?: boolean;\n /** Whether this item is selected (shows trailing checkmark with control/check/bg color) */\n selected?: boolean;\n disabled?: boolean;\n icon?: React.ReactNode;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\nexport const DropdownItem: React.FC<DropdownItemProps> = ({\n children,\n onPress,\n active,\n selected,\n disabled,\n icon,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const brandColors = theme.colors.control.brand.primary;\n const contentColors = theme.colors.content;\n\n // Determine background color\n const getBackgroundColor = () => {\n if (selected) {\n return brandColors?.bg || theme.colors.control.input.bg; // Cyan background for selected items\n }\n if (active) {\n return theme.colors.control.input.bgHover;\n }\n return \"transparent\";\n };\n\n // Determine text/icon color\n const getContentColor = () => {\n if (selected) {\n return contentColors?.on?.brand || theme.colors.content.primary; // Black text on cyan background\n }\n return theme.colors.content.secondary;\n };\n\n // Handle keyboard activation\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if ((event.key === \"Enter\" || event.key === \" \") && !disabled && onPress) {\n event.preventDefault();\n onPress();\n }\n };\n\n return (\n <Box\n onPress={!disabled ? onPress : undefined}\n paddingHorizontal={16}\n paddingVertical={8}\n flexDirection=\"row\"\n alignItems=\"center\"\n backgroundColor={getBackgroundColor()}\n hoverStyle={\n !disabled && !selected\n ? {\n backgroundColor: theme.colors.control.input.bgHover,\n }\n : undefined\n }\n role=\"menuitem\"\n tabIndex={disabled ? -1 : 0}\n aria-disabled={disabled}\n onKeyDown={handleKeyDown}\n testID={testID}\n style={{\n opacity: disabled ? 0.5 : 1,\n cursor: disabled ? \"not-allowed\" : \"pointer\",\n }}\n >\n {icon && (\n <Box marginRight={12} alignItems=\"center\" justifyContent=\"center\">\n {icon}\n </Box>\n )}\n <Box flex={1}>\n <Text color={getContentColor()} fontSize={14} fontWeight=\"400\">\n {children}\n </Text>\n </Box>\n </Box>\n );\n};\n\nDropdown.displayName = \"Dropdown\";\nDropdownItem.displayName = \"DropdownItem\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (props.disabled ? 0.5 : 1)};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n onError,\n onLoad,\n type,\n disabled,\n id,\n testID,\n \"data-testid\": dataTestId,\n ...props\n },\n ref\n ) => {\n // Handle as=\"img\" for rendering images with proper border-radius\n if (as === \"img\" && src) {\n return (\n <img\n src={src}\n alt={alt || \"\"}\n onError={onError}\n onLoad={onLoad}\n style={{\n display: \"block\",\n objectFit: \"cover\",\n width:\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width,\n height:\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height,\n borderRadius:\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius,\n position: props.position,\n top: typeof props.top === \"number\" ? `${props.top}px` : props.top,\n left:\n typeof props.left === \"number\" ? `${props.left}px` : props.left,\n right:\n typeof props.right === \"number\"\n ? `${props.right}px`\n : props.right,\n bottom:\n typeof props.bottom === \"number\"\n ? `${props.bottom}px`\n : props.bottom,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n elementType={as}\n id={id}\n type={as === \"button\" ? type || \"button\" : undefined}\n disabled={as === \"button\" ? disabled : undefined}\n onClick={onPress}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n role={role}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-current={ariaCurrent}\n aria-disabled={ariaDisabled}\n aria-busy={ariaBusy}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n aria-live={ariaLive}\n tabIndex={tabIndex !== undefined ? tabIndex : undefined}\n data-testid={dataTestId || testID}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport isPropValid from \"@emotion/is-prop-valid\";\n\n// Props that @emotion/is-prop-valid incorrectly treats as valid HTML.\n// These are React Native or component-specific props that match\n// valid HTML patterns (on* event handlers, SVG attributes).\nexport const ADDITIONAL_BLOCKED_PROPS = new Set([\n // RN-only event handlers (pass isPropValid's on* pattern)\n \"onPress\",\n \"onChangeText\",\n \"onLayout\",\n \"onMoveShouldSetResponder\",\n \"onResponderGrant\",\n \"onResponderMove\",\n \"onResponderRelease\",\n \"onResponderTerminate\",\n // SVG attributes that pass isPropValid\n \"strokeWidth\",\n // CSS properties that pass isPropValid but are used as component props\n \"overflow\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n]);\n\nfunction shouldForwardProp(key: string): boolean {\n if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;\n return isPropValid(key);\n}\n\n/**\n * Creates a React component that renders the given HTML tag\n * but filters out non-HTML props before they reach the DOM.\n *\n * Uses @emotion/is-prop-valid (same library styled-components v4\n * uses internally) to automatically block invalid HTML attributes,\n * plus a small blocklist for false positives (RN on* handlers, SVG attrs).\n *\n * Usage: `const FilteredDiv = createFilteredElement(\"div\");`\n * Then: `const StyledBox = styled(FilteredDiv)<BoxProps>\\`...\\`;`\n *\n * styled-components can still read ALL props for CSS interpolation,\n * but only valid HTML attributes are forwarded to the DOM element.\n */\nexport function createFilteredElement(defaultTag: string) {\n const Component = React.forwardRef<HTMLElement, Record<string, unknown>>(\n ({ children, elementType, ...props }, ref) => {\n const Tag = (elementType as string) || defaultTag;\n const htmlProps: Record<string, unknown> = {};\n for (const key of Object.keys(props)) {\n if (shouldForwardProp(key)) {\n htmlProps[key] = props[key];\n }\n }\n return React.createElement(\n Tag,\n { ref, ...htmlProps },\n children as React.ReactNode\n );\n }\n );\n Component.displayName = `Filtered(${defaultTag})`;\n return Component;\n}\n","function memoize(fn) {\n var cache = {};\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport default memoize;\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|inert|itemProp|itemScope|itemType|itemID|itemRef|on|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar index = memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport default index;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredSpan = createFilteredElement(\"span\");\n\nconst StyledText = styled(FilteredSpan)<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n numberOfLines: _numberOfLines,\n ...props\n}) => {\n return (\n <StyledText\n {...props}\n style={style}\n className={className}\n id={id}\n role={role}\n />\n );\n};\n"],"mappings":";AAAA,OAAOA,UAAS,UAAU,QAAQ,WAAW,mBAAmB;;;ACAhE,OAAOC,YAAW;AAClB,OAAO,YAAY;;;ACDnB,OAAO,WAAW;;;ACAlB,SAAS,QAAQ,IAAI;AACnB,MAAI,QAAQ,CAAC;AACb,SAAO,SAAU,KAAK;AACpB,QAAI,MAAM,GAAG,MAAM,OAAW,OAAM,GAAG,IAAI,GAAG,GAAG;AACjD,WAAO,MAAM,GAAG;AAAA,EAClB;AACF;AAEA,IAAO,sBAAQ;;;ACNf,IAAI,kBAAkB;AAEtB,IAAI,QAAQ;AAAA,EAAQ,SAAU,MAAM;AAClC,WAAO,gBAAgB,KAAK,IAAI,KAAK,KAAK,WAAW,CAAC,MAAM,OAEzD,KAAK,WAAW,CAAC,MAAM,OAEvB,KAAK,WAAW,CAAC,IAAI;AAAA,EAC1B;AAAA;AAEA;AAEA,IAAO,4BAAQ;;;AFRR,IAAM,2BAA2B,oBAAI,IAAI;AAAA;AAAA,EAE9C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC;AAED,SAAS,kBAAkB,KAAsB;AAC/C,MAAI,yBAAyB,IAAI,GAAG,EAAG,QAAO;AAC9C,SAAO,0BAAY,GAAG;AACxB;AAgBO,SAAS,sBAAsB,YAAoB;AACxD,QAAM,YAAY,MAAM;AAAA,IACtB,CAAC,EAAE,UAAU,aAAa,GAAG,MAAM,GAAG,QAAQ;AAC5C,YAAM,MAAO,eAA0B;AACvC,YAAM,YAAqC,CAAC;AAC5C,iBAAW,OAAO,OAAO,KAAK,KAAK,GAAG;AACpC,YAAI,kBAAkB,GAAG,GAAG;AAC1B,oBAAU,GAAG,IAAI,MAAM,GAAG;AAAA,QAC5B;AAAA,MACF;AACA,aAAO,MAAM;AAAA,QACX;AAAA,QACA,EAAE,KAAK,GAAG,UAAU;AAAA,QACpB;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACA,YAAU,cAAc,YAAY,UAAU;AAC9C,SAAO;AACT;;;ADsJQ;AAlNR,IAAM,cAAc,sBAAsB,KAAK;AAE/C,IAAM,YAAY,OAAO,WAAW;AAAA;AAAA;AAAA,sBAGd,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,eAClB,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,MAAMC,OAAM;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;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,GAAG;AAAA,EACL,GACA,QACG;AAEH,QAAI,OAAO,SAAS,KAAK;AACvB,aACE;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,KAAK,OAAO;AAAA,UACZ;AAAA,UACA;AAAA,UACA,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;AAAA,QACb;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,QAC9C,eAAa,cAAc;AAAA,QAC1B,GAAG;AAAA,QAEH;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,IAAI,cAAc;;;AI3RlB,OAAOC,aAAY;AAkCf,gBAAAC,YAAA;AA9BJ,IAAM,eAAe,sBAAsB,MAAM;AAEjD,IAAM,aAAaC,QAAO,YAAY;AAAA,WAC3B,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,gBAAAD;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,EACF;AAEJ;;;ALxCA,SAAS,wBAAiD;AAkIpD,SAYE,OAAAE,MAZF;AAhHC,IAAM,WAAWC,OAAM;AAAA,EAC5B,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,IACA,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,EACF,GACA,QACG;AACH,UAAM,CAAC,gBAAgB,iBAAiB,IAAI,SAAS,KAAK;AAC1D,UAAM,SAAS,eAAe,SAAY,aAAa;AACvD,UAAM,eAAe,OAAuB,IAAI;AAChD,UAAM,aAAa,OAAuB,IAAI;AAC9C,UAAM,UAAU,OAAuB,IAAI;AAG3C,IAAAA,OAAM;AAAA,MACJ;AAAA,MACA,MAAM,aAAa;AAAA,IACrB;AACA,UAAM,EAAE,MAAM,IAAI,iBAAiB,EAAE,WAAW,oBAAoB,CAAC;AAErE,UAAM,YAAY,YAAY,MAAM;AAClC,UAAI,eAAe,QAAW;AAC5B,0BAAkB,KAAK;AAAA,MACzB;AACA,UAAI,aAAc,cAAa,KAAK;AAAA,IACtC,GAAG,CAAC,YAAY,YAAY,CAAC;AAE7B,UAAM,aAAa,YAAY,MAAM;AACnC,YAAM,WAAW,CAAC;AAClB,UAAI,eAAe,QAAW;AAC5B,0BAAkB,QAAQ;AAAA,MAC5B;AACA,UAAI,aAAc,cAAa,QAAQ;AAAA,IACzC,GAAG,CAAC,QAAQ,YAAY,YAAY,CAAC;AAGrC,UAAM,eAAe,YAAY,MAAM;AACrC,UAAI,OAAO,aAAa,eAAe,WAAW,SAAS;AAEzD,cAAM,YAAY,WAAW,QAAQ;AAAA,UACnC;AAAA,QACF;AACA,YAAI,WAAW;AACb,oBAAU,MAAM;AAAA,QAClB;AAAA,MACF;AAAA,IACF,GAAG,CAAC,CAAC;AAGL,UAAM,gBAAgB;AAAA,MACpB,CAAC,UAA+B;AAC9B,YAAI,MAAM,QAAQ,YAAY,QAAQ;AACpC,gBAAM,eAAe;AACrB,oBAAU;AACV,uBAAa;AAAA,QACf,WAAW,MAAM,QAAQ,SAAS,QAAQ;AACxC,oBAAU;AAEV,uBAAa;AAAA,QACf;AAAA,MACF;AAAA,MACA,CAAC,QAAQ,WAAW,YAAY;AAAA,IAClC;AAGA,UAAM,uBAAuB;AAAA,MAC3B,CAAC,UAA+B;AAC9B,YAAI,MAAM,QAAQ,WAAW,MAAM,QAAQ,KAAK;AAC9C,gBAAM,eAAe;AACrB,qBAAW;AAAA,QACb,WAAW,MAAM,QAAQ,eAAe,CAAC,QAAQ;AAC/C,gBAAM,eAAe;AACrB,cAAI,eAAe,QAAW;AAC5B,8BAAkB,IAAI;AAAA,UACxB;AACA,cAAI,aAAc,cAAa,IAAI;AAAA,QACrC;AAAA,MACF;AAAA,MACA,CAAC,QAAQ,YAAY,YAAY,YAAY;AAAA,IAC/C;AAEA,cAAU,MAAM;AACd,YAAM,qBAAqB,CAAC,UAAsB;AAChD,YACE,aAAa,WACb,CAAC,aAAa,QAAQ,SAAS,MAAM,MAAc,GACnD;AACA,oBAAU;AAAA,QACZ;AAAA,MACF;AAEA,UAAI,UAAU,OAAO,aAAa,aAAa;AAC7C,iBAAS,iBAAiB,aAAa,kBAAkB;AAAA,MAC3D;AACA,aAAO,MAAM;AACX,YAAI,OAAO,aAAa,aAAa;AACnC,mBAAS,oBAAoB,aAAa,kBAAkB;AAAA,QAC9D;AAAA,MACF;AAAA,IACF,GAAG,CAAC,QAAQ,SAAS,CAAC;AAEtB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL;AAAA,QACA,OAAO;AAAA,UACL,UAAU;AAAA,UACV,OAAO;AAAA,UACP,WAAW;AAAA,UACX,QAAQ;AAAA,QACV;AAAA,QACA,WAAW;AAAA,QACX,eAAa;AAAA,QAEb;AAAA,0BAAAD;AAAA,YAAC;AAAA;AAAA,cACC,KAAK;AAAA,cACL,SAAS;AAAA,cACT,WAAW;AAAA,cACX,iBAAc;AAAA,cACd,iBAAe;AAAA,cAEd;AAAA;AAAA,UACH;AAAA,UACC,UACC,gBAAAA;AAAA,YAAC;AAAA;AAAA,cACC,KAAK;AAAA,cACL,UAAS;AAAA,cACT,KAAI;AAAA,cACH,GAAI,UAAU,QAAQ,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE;AAAA,cAChD,WAAW;AAAA,cACX,iBAAiB,MAAM,OAAO,WAAW;AAAA,cACzC,aAAa,MAAM,OAAO,OAAO;AAAA,cACjC,aAAa;AAAA,cACb,cAAc,MAAM,OAAO;AAAA,cAC3B,iBAAiB;AAAA,cACjB,MAAK;AAAA,cACJ,GAAI,YAAY,EAAE,cAAc,UAAU,IAAI,CAAC;AAAA,cAChD,OAAO;AAAA,gBACL,QAAQ;AAAA,gBACR,WAAW;AAAA,gBACX,GAAI,UAAU,SAAS,EAAE,UAAU,OAAO,IAAI,EAAE,MAAM;AAAA,cACxD;AAAA,cAEC;AAAA;AAAA,UACH;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAcO,IAAM,eAA4C,CAAC;AAAA,EACxD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,MAAM,IAAI,iBAAiB,EAAE,WAAW,oBAAoB,CAAC;AACrE,QAAM,cAAc,MAAM,OAAO,QAAQ,MAAM;AAC/C,QAAM,gBAAgB,MAAM,OAAO;AAGnC,QAAM,qBAAqB,MAAM;AAC/B,QAAI,UAAU;AACZ,aAAO,aAAa,MAAM,MAAM,OAAO,QAAQ,MAAM;AAAA,IACvD;AACA,QAAI,QAAQ;AACV,aAAO,MAAM,OAAO,QAAQ,MAAM;AAAA,IACpC;AACA,WAAO;AAAA,EACT;AAGA,QAAM,kBAAkB,MAAM;AAC5B,QAAI,UAAU;AACZ,aAAO,eAAe,IAAI,SAAS,MAAM,OAAO,QAAQ;AAAA,IAC1D;AACA,WAAO,MAAM,OAAO,QAAQ;AAAA,EAC9B;AAGA,QAAM,gBAAgB,CAAC,UAA+B;AACpD,SAAK,MAAM,QAAQ,WAAW,MAAM,QAAQ,QAAQ,CAAC,YAAY,SAAS;AACxE,YAAM,eAAe;AACrB,cAAQ;AAAA,IACV;AAAA,EACF;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,CAAC,WAAW,UAAU;AAAA,MAC/B,mBAAmB;AAAA,MACnB,iBAAiB;AAAA,MACjB,eAAc;AAAA,MACd,YAAW;AAAA,MACX,iBAAiB,mBAAmB;AAAA,MACpC,YACE,CAAC,YAAY,CAAC,WACV;AAAA,QACE,iBAAiB,MAAM,OAAO,QAAQ,MAAM;AAAA,MAC9C,IACA;AAAA,MAEN,MAAK;AAAA,MACL,UAAU,WAAW,KAAK;AAAA,MAC1B,iBAAe;AAAA,MACf,WAAW;AAAA,MACX;AAAA,MACA,OAAO;AAAA,QACL,SAAS,WAAW,MAAM;AAAA,QAC1B,QAAQ,WAAW,gBAAgB;AAAA,MACrC;AAAA,MAEC;AAAA,gBACC,gBAAAA,KAAC,OAAI,aAAa,IAAI,YAAW,UAAS,gBAAe,UACtD,gBACH;AAAA,QAEF,gBAAAA,KAAC,OAAI,MAAM,GACT,0BAAAA,KAAC,QAAK,OAAO,gBAAgB,GAAG,UAAU,IAAI,YAAW,OACtD,UACH,GACF;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,SAAS,cAAc;AACvB,aAAa,cAAc;","names":["React","React","React","styled","jsx","styled","jsx","React"]}
1
+ {"version":3,"sources":["../../src/Dropdown.tsx","../../../../foundation/primitives-web/src/Box.tsx","../../../../foundation/primitives-web/src/filterDOMProps.ts","../../../../../node_modules/@emotion/memoize/dist/memoize.esm.js","../../../../../node_modules/@emotion/is-prop-valid/dist/is-prop-valid.esm.js","../../../../foundation/primitives-web/src/Text.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useCallback } 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 DropdownProps extends ThemeOverrideProps {\n id?: string;\n trigger: React.ReactNode;\n children: React.ReactNode;\n isOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n /** Width of the dropdown menu (does not affect trigger width) */\n width?: string | number;\n /** Horizontal alignment of dropdown menu relative to trigger. Default: \"start\" */\n align?: \"start\" | \"end\";\n /** Accessible label for the dropdown menu */\n \"aria-label\"?: string;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\nexport const Dropdown = React.forwardRef<HTMLDivElement, DropdownProps>(\n (\n {\n id,\n trigger,\n children,\n isOpen: propIsOpen,\n onOpenChange,\n width = \"auto\",\n align = \"start\",\n \"aria-label\": ariaLabel,\n testID,\n themeMode,\n themeProductContext,\n },\n ref\n ) => {\n const [internalIsOpen, setInternalIsOpen] = useState(false);\n const isOpen = propIsOpen !== undefined ? propIsOpen : internalIsOpen;\n const containerRef = useRef<HTMLDivElement>(null);\n const triggerRef = useRef<HTMLDivElement>(null);\n const menuRef = useRef<HTMLDivElement>(null);\n\n // Merge forwarded ref with internal container ref\n React.useImperativeHandle(\n ref,\n () => containerRef.current as HTMLDivElement\n );\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n\n const closeMenu = useCallback(() => {\n if (propIsOpen === undefined) {\n setInternalIsOpen(false);\n }\n if (onOpenChange) onOpenChange(false);\n }, [propIsOpen, onOpenChange]);\n\n const toggleOpen = useCallback(() => {\n const nextOpen = !isOpen;\n if (propIsOpen === undefined) {\n setInternalIsOpen(nextOpen);\n }\n if (onOpenChange) onOpenChange(nextOpen);\n }, [isOpen, propIsOpen, onOpenChange]);\n\n // Safe focus helper for cross-platform compatibility\n const focusTrigger = useCallback(() => {\n if (typeof document !== \"undefined\" && triggerRef.current) {\n // Find the first focusable element within the trigger wrapper\n const focusable = triggerRef.current.querySelector<HTMLElement>(\n 'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])'\n );\n if (focusable) {\n focusable.focus();\n }\n }\n }, []);\n\n // Handle keyboard navigation\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === \"Escape\" && isOpen) {\n event.preventDefault();\n closeMenu();\n focusTrigger();\n } else if (event.key === \"Tab\" && isOpen) {\n closeMenu();\n // Also restore focus on Tab for consistent keyboard navigation\n focusTrigger();\n }\n },\n [isOpen, closeMenu, focusTrigger]\n );\n\n // Handle trigger keyboard events\n const handleTriggerKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n toggleOpen();\n } else if (event.key === \"ArrowDown\" && !isOpen) {\n event.preventDefault();\n if (propIsOpen === undefined) {\n setInternalIsOpen(true);\n }\n if (onOpenChange) onOpenChange(true);\n }\n },\n [isOpen, toggleOpen, propIsOpen, onOpenChange]\n );\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (\n containerRef.current &&\n !containerRef.current.contains(event.target as Node)\n ) {\n closeMenu();\n }\n };\n\n if (isOpen && typeof document !== \"undefined\") {\n document.addEventListener(\"mousedown\", handleClickOutside);\n }\n return () => {\n if (typeof document !== \"undefined\") {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n }\n };\n }, [isOpen, closeMenu]);\n\n return (\n <div\n ref={containerRef}\n id={id}\n style={{\n position: \"relative\",\n width: \"fit-content\",\n alignSelf: \"flex-start\",\n height: \"fit-content\",\n }}\n onKeyDown={handleKeyDown}\n data-testid={testID}\n >\n <div\n ref={triggerRef}\n onClick={toggleOpen}\n onKeyDown={handleTriggerKeyDown}\n aria-haspopup=\"menu\"\n aria-expanded={isOpen}\n >\n {trigger}\n </div>\n {isOpen && (\n <Box\n ref={menuRef}\n position=\"absolute\"\n top=\"100%\"\n {...(align === \"end\" ? { right: 0 } : { left: 0 })}\n marginTop={4}\n backgroundColor={theme.colors.background.secondary}\n borderColor={theme.colors.border.secondary}\n borderWidth={1}\n borderRadius={theme.radius.button}\n paddingVertical={4}\n role=\"menu\"\n {...(ariaLabel ? { \"aria-label\": ariaLabel } : {})}\n style={{\n zIndex: 1000,\n boxShadow: \"0 4px 12px rgba(0,0,0,0.1)\",\n ...(width === \"auto\" ? { minWidth: \"100%\" } : { width }),\n }}\n >\n {children}\n </Box>\n )}\n </div>\n );\n }\n);\n\nexport interface DropdownItemProps extends ThemeOverrideProps {\n children: React.ReactNode;\n onPress?: () => void;\n active?: boolean;\n /** Whether this item is selected (shows trailing checkmark with control/check/bg color) */\n selected?: boolean;\n disabled?: boolean;\n icon?: React.ReactNode;\n /** Test ID for testing frameworks */\n testID?: string;\n}\n\nexport const DropdownItem: React.FC<DropdownItemProps> = ({\n children,\n onPress,\n active,\n selected,\n disabled,\n icon,\n testID,\n themeMode,\n themeProductContext,\n}) => {\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const brandColors = theme.colors.control.brand.primary;\n const contentColors = theme.colors.content;\n\n // Determine background color\n const getBackgroundColor = () => {\n if (selected) {\n return brandColors?.bg || theme.colors.control.input.bg; // Cyan background for selected items\n }\n if (active) {\n return theme.colors.control.input.bgHover;\n }\n return \"transparent\";\n };\n\n // Determine text/icon color\n const getContentColor = () => {\n if (selected) {\n return contentColors?.on?.brand || theme.colors.content.primary; // Black text on cyan background\n }\n return theme.colors.content.secondary;\n };\n\n // Handle keyboard activation\n const handleKeyDown = (event: React.KeyboardEvent) => {\n if ((event.key === \"Enter\" || event.key === \" \") && !disabled && onPress) {\n event.preventDefault();\n onPress();\n }\n };\n\n return (\n <Box\n onPress={!disabled ? onPress : undefined}\n paddingHorizontal={16}\n paddingVertical={8}\n flexDirection=\"row\"\n alignItems=\"center\"\n backgroundColor={getBackgroundColor()}\n hoverStyle={\n !disabled && !selected\n ? {\n backgroundColor: theme.colors.control.input.bgHover,\n }\n : undefined\n }\n role=\"menuitem\"\n tabIndex={disabled ? -1 : 0}\n aria-disabled={disabled}\n onKeyDown={handleKeyDown}\n testID={testID}\n style={{\n opacity: disabled ? 0.5 : 1,\n cursor: disabled ? \"not-allowed\" : \"pointer\",\n }}\n >\n {icon && (\n <Box marginRight={12} alignItems=\"center\" justifyContent=\"center\">\n {icon}\n </Box>\n )}\n <Box flex={1}>\n <Text color={getContentColor()} fontSize={14} fontWeight=\"400\">\n {children}\n </Text>\n </Box>\n </Box>\n );\n};\n\nDropdown.displayName = \"Dropdown\";\nDropdownItem.displayName = \"DropdownItem\";\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport type { BoxProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredDiv = createFilteredElement(\"div\");\n\nconst StyledBox = styled(FilteredDiv)<BoxProps>`\n display: flex;\n box-sizing: border-box;\n background-color: ${(props) => props.backgroundColor || \"transparent\"};\n border-color: ${(props) => props.borderColor || \"transparent\"};\n border-width: ${(props) =>\n typeof props.borderWidth === \"number\"\n ? `${props.borderWidth}px`\n : props.borderWidth || 0};\n\n ${(props) =>\n props.borderBottomWidth !== undefined &&\n `\n border-bottom-width: ${typeof props.borderBottomWidth === \"number\" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};\n border-bottom-color: ${props.borderBottomColor || props.borderColor || \"transparent\"};\n border-bottom-style: solid;\n `}\n ${(props) =>\n props.borderTopWidth !== undefined &&\n `\n border-top-width: ${typeof props.borderTopWidth === \"number\" ? `${props.borderTopWidth}px` : props.borderTopWidth};\n border-top-color: ${props.borderTopColor || props.borderColor || \"transparent\"};\n border-top-style: solid;\n `}\n ${(props) =>\n props.borderLeftWidth !== undefined &&\n `\n border-left-width: ${typeof props.borderLeftWidth === \"number\" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};\n border-left-color: ${props.borderLeftColor || props.borderColor || \"transparent\"};\n border-left-style: solid;\n `}\n ${(props) =>\n props.borderRightWidth !== undefined &&\n `\n border-right-width: ${typeof props.borderRightWidth === \"number\" ? `${props.borderRightWidth}px` : props.borderRightWidth};\n border-right-color: ${props.borderRightColor || props.borderColor || \"transparent\"};\n border-right-style: solid;\n `}\n\n border-style: ${(props) =>\n props.borderStyle ||\n (props.borderWidth ||\n props.borderBottomWidth ||\n props.borderTopWidth ||\n props.borderLeftWidth ||\n props.borderRightWidth\n ? \"solid\"\n : \"none\")};\n border-radius: ${(props) =>\n typeof props.borderRadius === \"number\"\n ? `${props.borderRadius}px`\n : props.borderRadius || 0};\n height: ${(props) =>\n typeof props.height === \"number\"\n ? `${props.height}px`\n : props.height || \"auto\"};\n width: ${(props) =>\n typeof props.width === \"number\"\n ? `${props.width}px`\n : props.width || \"auto\"};\n min-width: ${(props) =>\n typeof props.minWidth === \"number\"\n ? `${props.minWidth}px`\n : props.minWidth || \"auto\"};\n min-height: ${(props) =>\n typeof props.minHeight === \"number\"\n ? `${props.minHeight}px`\n : props.minHeight || \"auto\"};\n max-width: ${(props) =>\n typeof props.maxWidth === \"number\"\n ? `${props.maxWidth}px`\n : props.maxWidth || \"none\"};\n max-height: ${(props) =>\n typeof props.maxHeight === \"number\"\n ? `${props.maxHeight}px`\n : props.maxHeight || \"none\"};\n\n padding: ${(props) =>\n typeof props.padding === \"number\"\n ? `${props.padding}px`\n : props.padding || 0};\n ${(props) =>\n props.paddingHorizontal &&\n `\n padding-left: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n padding-right: ${typeof props.paddingHorizontal === \"number\" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};\n `}\n ${(props) =>\n props.paddingVertical &&\n `\n padding-top: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n padding-bottom: ${typeof props.paddingVertical === \"number\" ? `${props.paddingVertical}px` : props.paddingVertical};\n `}\n ${(props) =>\n props.paddingTop !== undefined &&\n `padding-top: ${typeof props.paddingTop === \"number\" ? `${props.paddingTop}px` : props.paddingTop};`}\n ${(props) =>\n props.paddingBottom !== undefined &&\n `padding-bottom: ${typeof props.paddingBottom === \"number\" ? `${props.paddingBottom}px` : props.paddingBottom};`}\n ${(props) =>\n props.paddingLeft !== undefined &&\n `padding-left: ${typeof props.paddingLeft === \"number\" ? `${props.paddingLeft}px` : props.paddingLeft};`}\n ${(props) =>\n props.paddingRight !== undefined &&\n `padding-right: ${typeof props.paddingRight === \"number\" ? `${props.paddingRight}px` : props.paddingRight};`}\n\n margin: ${(props) =>\n typeof props.margin === \"number\" ? `${props.margin}px` : props.margin || 0};\n ${(props) =>\n props.marginTop !== undefined &&\n `margin-top: ${typeof props.marginTop === \"number\" ? `${props.marginTop}px` : props.marginTop};`}\n ${(props) =>\n props.marginBottom !== undefined &&\n `margin-bottom: ${typeof props.marginBottom === \"number\" ? `${props.marginBottom}px` : props.marginBottom};`}\n ${(props) =>\n props.marginLeft !== undefined &&\n `margin-left: ${typeof props.marginLeft === \"number\" ? `${props.marginLeft}px` : props.marginLeft};`}\n ${(props) =>\n props.marginRight !== undefined &&\n `margin-right: ${typeof props.marginRight === \"number\" ? `${props.marginRight}px` : props.marginRight};`}\n\n flex-direction: ${(props) => props.flexDirection || \"column\"};\n flex-wrap: ${(props) => props.flexWrap || \"nowrap\"};\n align-items: ${(props) => props.alignItems || \"stretch\"};\n justify-content: ${(props) => props.justifyContent || \"flex-start\"};\n cursor: ${(props) =>\n props.cursor\n ? props.cursor\n : props.onClick || props.onPress\n ? \"pointer\"\n : \"inherit\"};\n position: ${(props) => props.position || \"static\"};\n top: ${(props) =>\n typeof props.top === \"number\" ? `${props.top}px` : props.top};\n bottom: ${(props) =>\n typeof props.bottom === \"number\" ? `${props.bottom}px` : props.bottom};\n left: ${(props) =>\n typeof props.left === \"number\" ? `${props.left}px` : props.left};\n right: ${(props) =>\n typeof props.right === \"number\" ? `${props.right}px` : props.right};\n flex: ${(props) => props.flex};\n flex-shrink: ${(props) => props.flexShrink ?? 1};\n gap: ${(props) =>\n typeof props.gap === \"number\" ? `${props.gap}px` : props.gap || 0};\n align-self: ${(props) => props.alignSelf || \"auto\"};\n overflow: ${(props) => props.overflow || \"visible\"};\n overflow-x: ${(props) => props.overflowX || \"visible\"};\n overflow-y: ${(props) => props.overflowY || \"visible\"};\n z-index: ${(props) => props.zIndex};\n opacity: ${(props) => (props.disabled ? 0.5 : 1)};\n pointer-events: ${(props) => (props.disabled ? \"none\" : \"auto\")};\n\n &:hover {\n ${(props) =>\n props.hoverStyle?.backgroundColor &&\n `background-color: ${props.hoverStyle.backgroundColor};`}\n ${(props) =>\n props.hoverStyle?.borderColor &&\n `border-color: ${props.hoverStyle.borderColor};`}\n }\n\n &:active {\n ${(props) =>\n props.pressStyle?.backgroundColor &&\n `background-color: ${props.pressStyle.backgroundColor};`}\n }\n`;\n\nexport const Box = React.forwardRef<\n HTMLDivElement | HTMLButtonElement,\n BoxProps\n>(\n (\n {\n children,\n onPress,\n onKeyDown,\n onKeyUp,\n role,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-current\": ariaCurrent,\n \"aria-disabled\": ariaDisabled,\n \"aria-live\": ariaLive,\n \"aria-busy\": ariaBusy,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-expanded\": ariaExpanded,\n \"aria-haspopup\": ariaHasPopup,\n \"aria-pressed\": ariaPressed,\n \"aria-controls\": ariaControls,\n tabIndex,\n as,\n src,\n alt,\n onError,\n onLoad,\n type,\n disabled,\n id,\n testID,\n \"data-testid\": dataTestId,\n ...props\n },\n ref\n ) => {\n // Handle as=\"img\" for rendering images with proper border-radius\n if (as === \"img\" && src) {\n return (\n <img\n src={src}\n alt={alt || \"\"}\n onError={onError}\n onLoad={onLoad}\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 ...props.style,\n }}\n />\n );\n }\n\n return (\n <StyledBox\n ref={ref}\n elementType={as}\n id={id}\n type={as === \"button\" ? type || \"button\" : undefined}\n disabled={as === \"button\" ? disabled : undefined}\n onClick={onPress}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n role={role}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-current={ariaCurrent}\n aria-disabled={ariaDisabled}\n aria-busy={ariaBusy}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-pressed={ariaPressed}\n aria-controls={ariaControls}\n aria-live={ariaLive}\n tabIndex={tabIndex !== undefined ? tabIndex : undefined}\n data-testid={dataTestId || testID}\n {...props}\n >\n {children}\n </StyledBox>\n );\n }\n);\n\nBox.displayName = \"Box\";\n","import React from \"react\";\nimport isPropValid from \"@emotion/is-prop-valid\";\n\n// Props that @emotion/is-prop-valid incorrectly treats as valid HTML.\n// These are React Native or component-specific props that match\n// valid HTML patterns (on* event handlers, SVG attributes).\nexport const ADDITIONAL_BLOCKED_PROPS = new Set([\n // RN-only event handlers (pass isPropValid's on* pattern)\n \"onPress\",\n \"onChangeText\",\n \"onLayout\",\n \"onMoveShouldSetResponder\",\n \"onResponderGrant\",\n \"onResponderMove\",\n \"onResponderRelease\",\n \"onResponderTerminate\",\n // SVG attributes that pass isPropValid\n \"strokeWidth\",\n // CSS properties that pass isPropValid but are used as component props\n \"overflow\",\n \"cursor\",\n \"fontSize\",\n \"fontWeight\",\n \"fontFamily\",\n \"textDecoration\",\n]);\n\nfunction shouldForwardProp(key: string): boolean {\n if (ADDITIONAL_BLOCKED_PROPS.has(key)) return false;\n return isPropValid(key);\n}\n\n/**\n * Creates a React component that renders the given HTML tag\n * but filters out non-HTML props before they reach the DOM.\n *\n * Uses @emotion/is-prop-valid (same library styled-components v4\n * uses internally) to automatically block invalid HTML attributes,\n * plus a small blocklist for false positives (RN on* handlers, SVG attrs).\n *\n * Usage: `const FilteredDiv = createFilteredElement(\"div\");`\n * Then: `const StyledBox = styled(FilteredDiv)<BoxProps>\\`...\\`;`\n *\n * styled-components can still read ALL props for CSS interpolation,\n * but only valid HTML attributes are forwarded to the DOM element.\n */\nexport function createFilteredElement(defaultTag: string) {\n const Component = React.forwardRef<HTMLElement, Record<string, unknown>>(\n ({ children, elementType, ...props }, ref) => {\n const Tag = (elementType as string) || defaultTag;\n const htmlProps: Record<string, unknown> = {};\n for (const key of Object.keys(props)) {\n if (shouldForwardProp(key)) {\n htmlProps[key] = props[key];\n }\n }\n return React.createElement(\n Tag,\n { ref, ...htmlProps },\n children as React.ReactNode\n );\n }\n );\n Component.displayName = `Filtered(${defaultTag})`;\n return Component;\n}\n","function memoize(fn) {\n var cache = {};\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport default memoize;\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|inert|itemProp|itemScope|itemType|itemID|itemRef|on|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar index = memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport default index;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\nimport { createFilteredElement } from \"./filterDOMProps\";\n\nconst FilteredSpan = createFilteredElement(\"span\");\n\nconst StyledText = styled(FilteredSpan)<TextProps>`\n color: ${(props) => props.color || \"inherit\"};\n font-size: ${(props) =>\n typeof props.fontSize === \"number\"\n ? `${props.fontSize}px`\n : props.fontSize || \"inherit\"};\n font-weight: ${(props) => props.fontWeight || \"normal\"};\n font-family: ${(props) =>\n props.fontFamily ||\n '\"Aktiv Grotesk\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif'};\n line-height: ${(props) =>\n typeof props.lineHeight === \"number\"\n ? `${props.lineHeight}px`\n : props.lineHeight || \"inherit\"};\n white-space: ${(props) => props.whiteSpace || \"normal\"};\n text-align: ${(props) => props.textAlign || \"inherit\"};\n text-decoration: ${(props) => props.textDecoration || \"none\"};\n`;\n\nexport const Text: React.FC<TextProps> = ({\n style,\n className,\n id,\n role,\n testID,\n \"data-testid\": dataTestId,\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 data-testid={dataTestId || testID}\n />\n );\n};\n"],"mappings":"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","names":["React","React","React","styled","jsx","styled","jsx","React"]}