@xsolla/xui-select 0.202.3 → 0.202.4

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/README.md CHANGED
@@ -2,57 +2,63 @@
2
2
 
3
3
  A cross-platform React select component for choosing from a list of predefined options with dropdown menu. Works on both React (web) and React Native.
4
4
  <!-- BEGIN:xui-mcp-instructions:select -->
5
- A Select lets users choose a single value from a predefined list of options. It is commonly used in forms, filters, settings, and toolbars where the set of valid choices is known in advance.
5
+ A single-value dropdown input that displays the current selection and opens a ContextMenu panel when clicked. Supports five sizes, an optional leading icon, a clear button, and an icon-only mode. The dropdown panel is powered by ContextMenu — see its documentation for option list composition, search, and behaviour.
6
6
 
7
7
  ### When to use
8
-
9
- When the user must pick exactly one value from a fixed, mutually exclusive list (country, currency, status, etc.)
10
- - When the list of options is known, finite, and does not require typing
8
+ - When the user must pick exactly one value from a fixed, mutually exclusive list — country, currency, status, category
9
+ - When the list of options is known, finite, and does not require typing to navigate
11
10
  - When vertical space is limited and showing every option (as with radio buttons) would be too large
11
+ - When the list is too long to show inline — use Select instead of radio buttons when there are more than 5–6 options
12
+ - In forms, filter bars, and settings panels where a compact single-line field is needed
12
13
  - As part of a larger form alongside other controls
13
14
 
14
15
  ### When not to use
15
-
16
- - When the user can choose more than one value — use a MultiSelect instead
17
- - When the list is long or the user benefits from typing to filter — use an Autocomplete instead
18
- - When the value is freeform text the user must type — use a TextArea instead
19
- - When there are only two or three options that should always stay visible — use Radio buttons or a Segmented instead
16
+ - When the user can choose more than one value — use Multiselect instead
17
+ - When the list is long or the user benefits from typing to filter — use Autocomplete / Combobox instead
18
+ - When the value is freeform text the user must type — use TextArea or Input instead
19
+ - When there are only 2–3 options that should always stay visible — use Radio buttons or ToggleButtonGroup instead
20
20
  - When the choice is a simple on/off — use a Switch or Checkbox instead
21
- - When the value is time or date — use an InputTime or DatePicker instead
21
+ - When the value is time or date — use InputTime or DatePicker instead
22
22
 
23
23
  ### Content guidelines
24
-
25
- Label each option clearly and concisely — one short phrase, no trailing punctuation.
26
-
27
- Use parallel structure across all options in the same group (all nouns, or all short phrases).
28
-
29
- Use Description to add clarifying context when the label alone is not sufficient.
30
-
31
- List options in a logical order — most common first, alphabetical, or by value.
32
-
33
- Avoid negative options (e.g. *"Do not notify me"*) — rephrase positively.
24
+ - Label text (placeholder) — use a concise instructional phrase: *"Select language"*, *"Choose currency"*, *"Pick a category"*. Avoid generic placeholders like *"Select…"* alone when a more specific hint is possible.
25
+ - Option labels — label each option clearly and concisely — one short phrase, no trailing punctuation. Use parallel structure across all options in the same list (all nouns, or all short phrases). Avoid negative options (e.g. *"Do not notify me"*) — rephrase positively.
26
+ - Option order — list options in a logical order: most common first, alphabetical, or by value. Never randomise.
27
+ - Option descriptions — use the ContextMenu Description slot to add clarifying context when the label alone is not sufficient — e.g. label *"Admin"*, description *"Full access to all settings"*.
28
+ - Selected value display — show the full option label as selected. If the label is very long and the field is narrow, truncate with ellipsis and show the full label in a tooltip on hover.
29
+ - Field label — always provide a visible label above the Select via FieldGroup. Do not rely on the placeholder text alone as the field identifier.
30
+ - Error messages — be specific:
31
+ - *"Please select a language"* (required, empty on submit)
32
+ - *"Selected option is no longer available"* (stale value)
33
+
34
+ Icon choice — use a left icon that represents the category being selected, not a generic dropdown indicator. The chevron already signals *"this opens a list."*
34
35
 
35
36
  ### Behaviour guidelines
36
-
37
- Only one radio in a group can be checked at a time — selecting one automatically unchecks the others.
38
-
39
- A radio cannot be unchecked by clicking it again. To clear a selection, a *"None"* or *"Reset"* option must be provided explicitly.
40
-
41
- Disable items remain visible but cannot be interacted with.
42
-
43
- The Error state is typically applied to all items in the group (or to the group container) when validation fails — not to individual items.
37
+ - Single selection — only one value can be selected at a time. Selecting a new option automatically replaces the previous selection. The value cannot be *"unselected"* by clicking it again — to clear the selection, provide an explicit clear button (Clear button=true) or a *"None"* / *"No selection"* option in the list.
38
+ - Opening — clicking the field or pressing Enter / Space / ↓ when focused opens the ContextMenu. The field transitions to State=Focus; the chevron rotates to point upward.
39
+ - Closing — the ContextMenu closes on: selecting an option, pressing Escape, clicking outside, or pressing Tab past the last option. On close, focus returns to the Select field.
40
+ - Selection — when the user selects an option from the ContextMenu, the field updates to Filled=True and the label shows the selected option's text. The dropdown closes immediately.
41
+ - Clear — clicking the clear button (✕) clears the selection (Filled=False), closes the dropdown if open, and returns focus to the field.
42
+ - Validation — validate on blur (when the field loses focus without a selection) or on form submit. Switch to State=Error with a specific message if a required field has no value. Clear the error when a value is selected.
43
+ - Placeholder — show placeholder text in Filled=False using Label text. The placeholder should describe what to select (e.g. *"Select a country"*, *"Choose language"*) rather than repeating the field label.
44
+ - Disabled — State=Disable prevents opening the dropdown. If a value is present, it remains visible in muted style. Provide a tooltip or nearby explanation if the reason for disabling is not obvious.
45
+ - ContextMenu size matching — the ContextMenu panel width should match or exceed the Select field width. Never open a narrower ContextMenu than the trigger field — options would be cut off.
44
46
 
45
47
  ### Accessibility
46
-
47
- Wrap the group in a <fieldset> with a <legend> that names the group, or use role=*"radiogroup"* with aria-labelledby.
48
-
49
- Each radio input should use role=*"radio"* with aria-checked=*"true"* or *"false"*.
50
-
51
- Apply aria-disabled=*"true"* to disabled items.
52
-
53
- Error messages should be linked to the group via aria-describedby.
54
-
55
- Never rely on color alone to communicate the error state — always show the error message text.
48
+ - Select must render as a <button> (or a <div> with role=*"combobox"*) with aria-haspopup=*"listbox"* and aria-expanded=*"true"* / *"false"* reflecting the open state.
49
+ - The field must have an accessible name via <label for> (from FieldGroup), aria-label, or aria-labelledby.
50
+ - When Icon only=True, aria-label on the field is mandatory — the label is hidden and the icon alone conveys no text to screen readers.
51
+ - When Filled=True, reflect the selected value in aria-label or ensure it is part of the field's visible text that screen readers can read: e.g. aria-label=*"Language: English"*.
52
+ - The clear button must have aria-label=*"Clear selection"* or aria-label=*"Clear [field name]"*.
53
+ - When State=Error, the error message must be linked via aria-describedby and placed in an aria-live=*"polite"* region.
54
+ - Keyboard navigation:
55
+ - Enter / Space / ↓ opens the dropdown
56
+ - ↑ / ↓ navigate options inside the ContextMenu
57
+ - Enter selects the focused option
58
+ - Escape closes without selecting; focus returns to the field
59
+ - Tab closes and moves to the next focusable element
60
+
61
+ The left icon must have aria-hidden=*"true"* when a label is also visible.
56
62
  <!-- END:xui-mcp-instructions:select -->
57
63
 
58
64
  ## Installation
package/native/index.js CHANGED
@@ -659,7 +659,12 @@ var Select = ({
659
659
  overflow: "scroll",
660
660
  style: {
661
661
  maxHeight: searchable ? maxHeight - 60 : maxHeight,
662
- ...isWeb ? { overflowY: "auto" } : {}
662
+ // overflowX pins the shorthand above, which otherwise scrolls both axes.
663
+ ...isWeb ? {
664
+ overflowY: "auto",
665
+ overflowX: "hidden",
666
+ scrollbarWidth: "none"
667
+ } : {}
663
668
  },
664
669
  children: filteredOptions.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
665
670
  Box,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.tsx","../../src/Select.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx","../../../../foundation/primitives-native/src/Icon.tsx","../../../../foundation/primitives-native/src/index.tsx","../../src/Portal.native.tsx"],"sourcesContent":["export * from \"./Select\";\n","import React, { useState, useRef, useEffect, useCallback } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon, isWeb, isNative } from \"@xsolla/xui-primitives\";\nimport {\n useModalId,\n useResolvedTheme,\n useOverlayLayer,\n LAYER_OFFSET,\n type ThemeOverrideProps,\n type ThemeMode,\n type ProductContext,\n} from \"@xsolla/xui-core\";\nimport { useClickOutside } from \"@xsolla/xui-hooks\";\nimport {\n ChevronDown,\n ChevronUp,\n ExclamationMarkCr,\n Remove,\n Search as SearchIcon,\n} from \"@xsolla/xui-icons-base\";\nimport { Portal } from \"./Portal\";\n\nexport interface SelectOption {\n label: string;\n value: any;\n disabled?: boolean;\n}\n\nexport interface SelectProps extends ThemeOverrideProps {\n value?: string;\n placeholder?: string;\n onPress?: () => void;\n size?: \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n state?: \"default\" | \"hover\" | \"focus\" | \"disable\" | \"error\";\n disabled?: boolean;\n label?: string;\n errorMessage?: string;\n iconLeft?: React.ReactNode;\n iconRight?: React.ReactNode;\n filled?: boolean;\n iconOnly?: boolean;\n options?: (string | SelectOption)[];\n onChange?: (value: string) => void;\n searchable?: boolean;\n searchPlaceholder?: string;\n noOptionsMessage?: string;\n /** Show a clear button to reset the selected value (field variant only) */\n clearable?: boolean;\n /** Called when the clear button is pressed */\n onClear?: () => void;\n maxHeight?: number;\n /**\n * Width of the dropdown popover. By default the popover matches the Select\n * trigger's width (`100%` of the field). Pass a number (px) or any CSS width\n * string (e.g. `320`, `\"24rem\"`) to size the popover independently of the\n * trigger — useful when option labels are wider than the field.\n */\n popoverWidth?: number | string;\n fullWidth?: boolean;\n testID?: string;\n /** Theme mode for the dropdown overlay. Defaults to themeMode when not set. */\n overlayThemeMode?: ThemeMode;\n /** Product context for the dropdown overlay. Defaults to themeProductContext when not set. */\n overlayThemeProductContext?: ProductContext;\n /** Preferred side for the dropdown. Default: \"bottom\". */\n side?: \"top\" | \"bottom\";\n /** When true, the dropdown flips to the opposite side when there isn't enough viewport space. Default: false. */\n autoFlip?: boolean;\n}\n\ninterface DropdownPosition {\n left: number;\n top?: number;\n bottom?: number;\n width: number;\n visible: boolean;\n}\n\nexport const Select: React.FC<SelectProps> = ({\n value,\n placeholder = \"Select\",\n onPress,\n size = \"md\",\n state: externalState,\n disabled = false,\n label,\n errorMessage,\n iconLeft,\n iconRight,\n filled = true,\n iconOnly = false,\n options = [],\n onChange,\n searchable = false,\n searchPlaceholder = \"Search\",\n noOptionsMessage = \"No results\",\n clearable = false,\n onClear,\n maxHeight = 300,\n popoverWidth,\n fullWidth = true,\n testID,\n themeMode,\n themeProductContext,\n overlayThemeMode,\n overlayThemeProductContext,\n side = \"bottom\",\n autoFlip = false,\n}) => {\n const { theme: rawTheme } = useResolvedTheme({\n themeMode,\n themeProductContext,\n });\n const theme = rawTheme as any;\n const { theme: rawOverlayTheme } = useResolvedTheme({\n themeMode: overlayThemeMode ?? themeMode,\n themeProductContext: overlayThemeProductContext ?? themeProductContext,\n });\n const overlayTheme = rawOverlayTheme as any;\n const modalId = useModalId();\n const overlayLayer = useOverlayLayer();\n const [isOpen, setIsOpen] = useState(false);\n const [selectedValue, setSelectedValue] = useState<string | undefined>(value);\n const [searchValue, setSearchValue] = useState(\"\");\n const [dropdownPosition, setDropdownPosition] =\n useState<DropdownPosition | null>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n const triggerRef = useRef<HTMLDivElement>(null);\n const dropdownRef = useRef<HTMLDivElement>(null);\n const selectedItemRef = useRef<HTMLDivElement>(null);\n const searchInputRef = useRef<HTMLInputElement>(null);\n // Stable IDs for ARIA relationships — lazy useState so it's computed once\n const [baseId] = useState(\n () => `xui-select-${Math.random().toString(36).slice(2, 9)}`\n );\n const labelId = `${baseId}-label`;\n const listboxId = `${baseId}-listbox`;\n\n const isDisable = externalState === \"disable\" || disabled;\n const isError = externalState === \"error\" || !!errorMessage;\n const isFocus = externalState === \"focus\" || isOpen;\n\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n const overlayInputColors = overlayTheme.colors.control.input;\n\n const updateDropdownPosition = useCallback(() => {\n if (!isWeb || !triggerRef.current || !dropdownRef.current) return;\n\n const triggerRect = triggerRef.current.getBoundingClientRect();\n // Read the actual rendered height — dropdown is in DOM (visibility: hidden) at this point\n const dropH = dropdownRef.current.getBoundingClientRect().height;\n const gap = sizeStyles.fieldGap;\n const viewportHeight = window.innerHeight;\n const spaceBelow = viewportHeight - triggerRect.bottom - gap;\n const spaceAbove = triggerRect.top - gap;\n\n const placeBelow = () =>\n setDropdownPosition({\n left: triggerRect.left,\n top: triggerRect.bottom + gap,\n width: triggerRect.width,\n visible: true,\n });\n\n const placeAbove = () =>\n setDropdownPosition({\n left: triggerRect.left,\n bottom: viewportHeight - triggerRect.top + gap,\n width: triggerRect.width,\n visible: true,\n });\n\n if (!autoFlip) {\n side === \"top\" ? placeAbove() : placeBelow();\n return;\n }\n\n // Auto-flip: prefer the requested side, flip only when there isn't enough room\n if (side === \"top\") {\n spaceAbove >= dropH || spaceAbove >= spaceBelow\n ? placeAbove()\n : placeBelow();\n } else {\n spaceBelow >= dropH || spaceBelow >= spaceAbove\n ? placeBelow()\n : placeAbove();\n }\n }, [sizeStyles.fieldGap, side, autoFlip]);\n\n useEffect(() => {\n if (value !== undefined) setSelectedValue(value);\n }, [value]);\n\n useEffect(() => {\n if (isFocus && selectedItemRef.current && dropdownRef.current) {\n const timeoutId = setTimeout(() => {\n const selectedItem = selectedItemRef.current;\n if (selectedItem && isWeb)\n selectedItem.scrollIntoView({ block: \"nearest\" });\n }, 0);\n return () => clearTimeout(timeoutId);\n }\n }, [isFocus]);\n\n // Keep the portaled dropdown anchored to the trigger (web only)\n // Positioning: runs whenever the dropdown becomes visible (covers both normal open\n // and forced-focus via the state prop). Resize repositions an already-open dropdown.\n useEffect(() => {\n if (!isWeb || !isFocus) return;\n updateDropdownPosition();\n window.addEventListener(\"resize\", updateDropdownPosition);\n return () => window.removeEventListener(\"resize\", updateDropdownPosition);\n }, [isFocus, updateDropdownPosition]);\n\n // Close-on-scroll: only active when the user has explicitly opened the dropdown\n // (isOpen=true), NOT when isFocus is forced via the state prop. This prevents\n // Storybook / forced-focus stories from closing immediately on ambient scroll events.\n // Scrolling inside the dropdown (the options list) is ignored.\n useEffect(() => {\n if (!isWeb || !isOpen) return;\n const closeOnScroll = (e: Event) => {\n if (dropdownRef.current?.contains(e.target as Node)) return;\n setIsOpen(false);\n };\n window.addEventListener(\"scroll\", closeOnScroll, true);\n return () => window.removeEventListener(\"scroll\", closeOnScroll, true);\n }, [isOpen]);\n\n useEffect(() => {\n if (isFocus && searchable) searchInputRef.current?.focus();\n }, [isFocus, searchable]);\n\n useEffect(() => {\n if (!isFocus) setSearchValue(\"\");\n }, [isFocus]);\n\n // Dropdown is portaled outside containerRef, so spare clicks that land in it\n useClickOutside(\n containerRef,\n useCallback((event: MouseEvent) => {\n const dropdownEl = dropdownRef.current;\n if (dropdownEl) {\n const path =\n typeof event.composedPath === \"function\" ? event.composedPath() : [];\n const insideDropdown = path.length\n ? path.includes(dropdownEl)\n : dropdownEl.contains(event.target as Node);\n if (insideDropdown) return;\n }\n setIsOpen(false);\n }, []),\n isWeb && isOpen\n );\n\n const getOptionLabel = (option: string | SelectOption) =>\n typeof option === \"string\" ? option : option.label;\n const getOptionValue = (option: string | SelectOption) =>\n typeof option === \"string\" ? option : option.value;\n const getOptionDisabled = (option: string | SelectOption) =>\n typeof option === \"string\" ? false : option.disabled || false;\n\n const filteredOptions =\n searchable && searchValue\n ? options.filter((option) =>\n getOptionLabel(option)\n .toLowerCase()\n .includes(searchValue.toLowerCase())\n )\n : options;\n\n const handlePress = () => {\n if (!isDisable) {\n if (onPress) onPress();\n setIsOpen(!isOpen);\n }\n };\n\n const handleSelect = (option: string | SelectOption) => {\n if (getOptionDisabled(option)) return;\n const val = getOptionValue(option);\n setSelectedValue(val);\n setIsOpen(false);\n if (onChange) onChange(val);\n };\n\n const handleClear = (e: React.MouseEvent) => {\n e.stopPropagation();\n if (isDisable) return;\n setSelectedValue(undefined);\n if (onChange) onChange(\"\");\n if (onClear) onClear();\n };\n\n const isHover = externalState === \"hover\";\n let backgroundColor = inputColors.bg;\n let borderColor = inputColors.border;\n\n if (isDisable) {\n backgroundColor = inputColors.bgDisable;\n borderColor = inputColors.borderDisable;\n } else if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n borderColor = isError\n ? theme.colors.border.alert\n : theme.colors.border.brand;\n } else if (isError) {\n borderColor = theme.colors.border.alert;\n } else if (isHover) {\n backgroundColor = inputColors.bgHover;\n borderColor = inputColors.borderHover;\n }\n\n if (filled === false && !isFocus && !isError && !isHover) {\n backgroundColor = \"transparent\";\n }\n\n const currentLabel = selectedValue\n ? getOptionLabel(\n options.find((o) => getOptionValue(o) === selectedValue) ||\n selectedValue\n )\n : placeholder;\n\n const textColor = isDisable\n ? inputColors.textDisable\n : selectedValue\n ? inputColors.text\n : inputColors.placeholder;\n const iconColor = isDisable\n ? inputColors.textDisable\n : inputColors.placeholder;\n\n const dropdownTop =\n sizeStyles.height +\n (label ? sizeStyles.fontSize + sizeStyles.fieldGap : 0) +\n sizeStyles.fieldGap;\n\n const dropdown = isFocus && options.length > 0 && (\n <Box\n ref={dropdownRef}\n id={listboxId}\n role=\"listbox\"\n aria-label={label || placeholder}\n data-modal-id={modalId}\n position={isNative ? \"absolute\" : undefined}\n top={isNative ? dropdownTop : undefined}\n width={isNative ? (popoverWidth ?? \"100%\") : undefined}\n backgroundColor={overlayTheme.colors.background.secondary}\n borderColor={overlayTheme.colors.border.secondary}\n borderWidth={1}\n borderRadius={overlayTheme.shape.contextMenu[size].borderRadius}\n style={{\n zIndex: overlayLayer + LAYER_OFFSET.popover,\n ...(isNative\n ? { elevation: 4 }\n : {\n position: \"fixed\",\n top:\n dropdownPosition?.top != null\n ? dropdownPosition.top\n : undefined,\n bottom:\n dropdownPosition?.bottom != null\n ? dropdownPosition.bottom\n : undefined,\n left: dropdownPosition?.left,\n width: popoverWidth ?? dropdownPosition?.width,\n boxShadow: \"0 4px 12px rgba(0,0,0,0.1)\",\n visibility: dropdownPosition?.visible ? \"visible\" : \"hidden\",\n }),\n minWidth:\n popoverWidth == null && iconOnly ? sizeStyles.height * 3 : undefined,\n }}\n >\n {/* Search Input - Outside scrollable area (web only) */}\n {searchable && !isNative && (\n <Box\n paddingHorizontal={sizeStyles.paddingHorizontal}\n paddingVertical={sizeStyles.paddingVertical}\n borderBottomWidth={1}\n borderColor={overlayTheme.colors.border.secondary}\n >\n <Box\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={sizeStyles.paddingHorizontal / 2}\n paddingHorizontal={4}\n >\n <Icon\n size={sizeStyles.iconSize - 2}\n color={overlayInputColors.placeholder}\n >\n <SearchIcon />\n </Icon>\n <Box\n as=\"input\"\n ref={searchInputRef}\n flex={1}\n type=\"text\"\n aria-label={searchPlaceholder}\n value={searchValue}\n onChange={(e: React.ChangeEvent<HTMLInputElement>) =>\n setSearchValue(e.target.value)\n }\n placeholder={searchPlaceholder}\n style={{\n border: \"none\",\n outline: \"none\",\n background: \"transparent\",\n color: overlayInputColors.text,\n fontSize: sizeStyles.fontSize,\n width: \"100%\",\n }}\n />\n </Box>\n </Box>\n )}\n\n {/* Options List - Scrollable */}\n <Box\n paddingVertical={4}\n overflow=\"scroll\"\n style={{\n maxHeight: searchable ? maxHeight - 60 : maxHeight,\n ...(isWeb ? { overflowY: \"auto\" } : {}),\n }}\n >\n {filteredOptions.length === 0 ? (\n <Box\n paddingVertical={sizeStyles.paddingVertical * 2}\n paddingHorizontal={sizeStyles.paddingHorizontal}\n alignItems=\"center\"\n >\n <Text\n color={overlayTheme.colors.content.tertiary}\n fontSize={sizeStyles.fontSize}\n >\n {noOptionsMessage}\n </Text>\n </Box>\n ) : (\n filteredOptions.map((option, index) => {\n const optionValue = getOptionValue(option);\n const optionLabel = getOptionLabel(option);\n const isOptionDisabled = getOptionDisabled(option);\n const isSelected = optionValue === selectedValue;\n const brandColors = overlayTheme.colors.control.brand.primary;\n const contentColors = overlayTheme.colors.content;\n return (\n <Box\n testID={testID}\n key={index}\n role=\"option\"\n aria-selected={isSelected}\n aria-disabled={isOptionDisabled || undefined}\n ref={isSelected ? selectedItemRef : undefined}\n paddingVertical={sizeStyles.paddingVertical}\n paddingHorizontal={sizeStyles.paddingHorizontal}\n onPress={\n isOptionDisabled ? undefined : () => handleSelect(option)\n }\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"space-between\"\n backgroundColor={isSelected ? brandColors.bg : \"transparent\"}\n style={{\n ...(isWeb\n ? {\n cursor: isOptionDisabled ? \"not-allowed\" : \"pointer\",\n }\n : {}),\n opacity: isOptionDisabled ? 0.5 : 1,\n }}\n hoverStyle={\n !isSelected && !isOptionDisabled\n ? { backgroundColor: overlayInputColors.bgHover }\n : undefined\n }\n >\n <Text\n color={\n isSelected\n ? contentColors.on.brand\n : overlayTheme.colors.content.secondary\n }\n fontSize={sizeStyles.fontSize}\n fontWeight=\"400\"\n >\n {optionLabel}\n </Text>\n </Box>\n );\n })\n )}\n </Box>\n </Box>\n );\n\n return (\n <Box\n testID={testID}\n ref={containerRef}\n flexDirection=\"column\"\n gap={sizeStyles.fieldGap}\n width={fullWidth ? \"100%\" : undefined}\n position=\"relative\"\n >\n {label && (\n <Text\n id={labelId}\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n )}\n <Box\n ref={triggerRef}\n onPress={handlePress}\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n aria-expanded={isFocus && options.length > 0}\n aria-controls={listboxId}\n aria-labelledby={label ? labelId : undefined}\n aria-disabled={isDisable || undefined}\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n borderRadius={sizeStyles.radius}\n height={sizeStyles.height}\n width={iconOnly ? sizeStyles.height : \"100%\"}\n paddingHorizontal={iconOnly ? 0 : sizeStyles.paddingHorizontal}\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent={iconOnly ? \"center\" : \"flex-start\"}\n gap={iconOnly ? 4 : sizeStyles.trailingGap}\n position=\"relative\"\n style={\n isWeb ? { cursor: isDisable ? \"not-allowed\" : \"pointer\" } : undefined\n }\n hoverStyle={\n !isDisable && !isFocus && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n {iconOnly ? (\n iconLeft && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={sizeStyles.iconSize} color={iconColor}>\n {iconLeft}\n </Icon>\n </Box>\n )\n ) : (\n <Box\n flexDirection=\"row\"\n alignItems=\"center\"\n flex={1}\n minWidth={0}\n gap={sizeStyles.contentGap}\n >\n {iconLeft && (\n <Box alignItems=\"center\" justifyContent=\"center\" flexShrink={0}>\n <Icon size={sizeStyles.iconSize} color={iconColor}>\n {iconLeft}\n </Icon>\n </Box>\n )}\n <Box\n flex={1}\n minWidth={0}\n height=\"100%\"\n justifyContent=\"center\"\n overflow=\"hidden\"\n overflowX=\"hidden\"\n overflowY=\"hidden\"\n >\n {/*\n `numberOfLines={1}` clamps the label to one line with a trailing\n ellipsis instead of letting a long value run past the field;\n `title` keeps the untruncated string readable on hover.\n */}\n <Text\n color={textColor}\n fontSize={sizeStyles.fontSize}\n numberOfLines={1}\n title={currentLabel}\n >\n {currentLabel}\n </Text>\n </Box>\n </Box>\n )}\n {/* Trailing controls never shrink, so a long label cannot displace them. */}\n <Box flexDirection=\"row\" alignItems=\"center\" gap={4} flexShrink={0}>\n {/* Clear button (field variant only) */}\n {clearable && !iconOnly && !isDisable && selectedValue && (\n <Box\n onPress={handleClear}\n alignItems=\"center\"\n justifyContent=\"center\"\n style={isWeb ? { cursor: \"pointer\" } : undefined}\n >\n <Remove\n size={sizeStyles.iconSize}\n color={iconColor}\n variant=\"line\"\n />\n </Box>\n )}\n\n {/* Error icon */}\n {isError && (\n <Icon\n size={sizeStyles.iconSize}\n color={theme.colors.content.alert.primary}\n >\n <ExclamationMarkCr />\n </Icon>\n )}\n {iconRight !== undefined ? (\n <Icon size={sizeStyles.iconSize} color={iconColor}>\n {iconRight}\n </Icon>\n ) : isFocus ? (\n <ChevronUp\n size={sizeStyles.iconSize}\n color={iconColor}\n variant=\"line\"\n />\n ) : (\n <ChevronDown\n size={sizeStyles.iconSize}\n color={iconColor}\n variant=\"line\"\n />\n )}\n </Box>\n </Box>\n\n {/* Dropdown Menu */}\n {isNative ? dropdown : <Portal>{dropdown}</Portal>}\n\n {isError && errorMessage && (\n <Text\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n};\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n AccessibilityRole,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleToAccessibilityRole: Record<string, AccessibilityRole> = {\n button: \"button\",\n link: \"link\",\n img: \"image\",\n image: \"image\",\n summary: \"summary\",\n switch: \"switch\",\n checkbox: \"checkbox\",\n radio: \"radio\",\n heading: \"header\",\n text: \"text\",\n search: \"search\",\n alert: \"alert\",\n none: \"none\",\n presentation: \"none\",\n progressbar: \"progressbar\",\n scrollbar: \"scrollbar\",\n adjustable: \"adjustable\",\n tab: \"tab\",\n menu: \"menu\",\n menuitem: \"menuitem\",\n list: \"list\",\n timer: \"timer\",\n};\n\n/** RN ViewStyle.gap is typed as number (Yoga gap), not DimensionValue. */\nconst toGapValue = (gap: number | string | undefined): number | undefined => {\n if (gap === undefined) return undefined;\n if (typeof gap === \"number\") return gap;\n const pxMatch = /^(\\d+(?:\\.\\d+)?)px$/.exec(gap);\n if (pxMatch) return Number(pxMatch[1]);\n const asNumber = Number(gap);\n return Number.isFinite(asNumber) ? asNumber : undefined;\n};\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 flexWrap,\n alignItems,\n justifyContent,\n alignSelf,\n position,\n top,\n bottom,\n left,\n right,\n width,\n minWidth,\n minHeight,\n maxWidth,\n maxHeight,\n flex,\n flexShrink,\n gap,\n overflow,\n opacity,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n disabled,\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 opacity: opacity ?? (disabled ? 0.5 : undefined),\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 flexWrap,\n alignItems,\n justifyContent,\n alignSelf,\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 flexShrink,\n gap: toGapValue(gap),\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Map web a11y props; drop the rest of the web-only attributes before\n // spreading onto RN hosts (unknown props warn at runtime).\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 \"aria-busy\": ariaBusy,\n className,\n \"data-testid\": _dataTestId,\n cursor: _cursor,\n type: _type,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n const accessibilityRole =\n (typeof role === \"string\" && roleToAccessibilityRole[role]) ||\n (as === \"button\" ? \"button\" : undefined);\n const isDisabled = Boolean(disabled || ariaDisabled);\n const accessibilityState = {\n disabled: isDisabled || undefined,\n busy: Boolean(ariaBusy) || undefined,\n };\n const accessibilityLiveRegion =\n ariaLive === \"polite\" || ariaLive === \"assertive\" ? ariaLive : undefined;\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 accessibilityLabel={typeof ariaLabel === \"string\" ? ariaLabel : alt}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n // Prefer Pressable whenever the node is interactive or explicitly a button,\n // so disabled / aria-disabled controls stay in the a11y tree as buttons.\n if (onPress || as === \"button\") {\n return (\n <Pressable\n onPress={!isDisabled && onPress ? onPress : undefined}\n disabled={isDisabled}\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 accessibilityRole={accessibilityRole}\n accessibilityLabel={\n typeof ariaLabel === \"string\" ? ariaLabel : undefined\n }\n accessibilityState={accessibilityState}\n accessibilityLiveRegion={accessibilityLiveRegion}\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 accessibilityRole={accessibilityRole}\n accessibilityLabel={typeof ariaLabel === \"string\" ? ariaLabel : undefined}\n accessibilityState={accessibilityState}\n accessibilityLiveRegion={accessibilityLiveRegion}\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","import React from \"react\";\nimport { View, ViewStyle } from \"react-native\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Icon: React.FC<IconProps> = ({\n children,\n color,\n size,\n testID,\n \"data-testid\": dataTestId,\n}) => {\n const style: ViewStyle = {\n width: typeof size === \"number\" ? size : undefined,\n height: typeof size === \"number\" ? size : undefined,\n alignItems: \"center\",\n justifyContent: \"center\",\n };\n\n // On native, we try to pass the color down to children (like Text primitives)\n // to mimic the CSS inheritance behavior of the web version.\n const childrenWithProps = React.Children.map(children, (child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n color: child.props.color || color,\n // Also pass size if child seems to be an icon that needs it\n size: child.props.size || size,\n });\n }\n return child;\n });\n\n return (\n <View style={style} testID={dataTestId || testID}>\n {childrenWithProps}\n </View>\n );\n};\n","export * from \"./Box\";\nexport * from \"./Text\";\nexport * from \"./Spinner\";\nexport * from \"./Icon\";\nexport * from \"./Divider\";\nexport * from \"./Input\";\nexport * from \"./TextArea\";\nexport * from \"./LinearGradient\";\n\nexport const isWeb = false;\nexport const isNative = true;\n","import { ReactNode } from \"react\";\n\ninterface PortalProps {\n children: ReactNode;\n}\n\nexport const Portal = ({ children }: PortalProps) => <>{children}</>;\n"],"mappings":"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","names":["import_react","import_react_native","import_jsx_runtime","RNText","import_react_native","import_jsx_runtime","React","import_jsx_runtime","import_jsx_runtime","SearchIcon"]}
1
+ {"version":3,"sources":["../../src/index.tsx","../../src/Select.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx","../../../../foundation/primitives-native/src/Icon.tsx","../../../../foundation/primitives-native/src/index.tsx","../../src/Portal.native.tsx"],"sourcesContent":["export * from \"./Select\";\n","import React, { useState, useRef, useEffect, useCallback } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon, isWeb, isNative } from \"@xsolla/xui-primitives\";\nimport {\n useModalId,\n useResolvedTheme,\n useOverlayLayer,\n LAYER_OFFSET,\n type ThemeOverrideProps,\n type ThemeMode,\n type ProductContext,\n} from \"@xsolla/xui-core\";\nimport { useClickOutside } from \"@xsolla/xui-hooks\";\nimport {\n ChevronDown,\n ChevronUp,\n ExclamationMarkCr,\n Remove,\n Search as SearchIcon,\n} from \"@xsolla/xui-icons-base\";\nimport { Portal } from \"./Portal\";\n\nexport interface SelectOption {\n label: string;\n value: any;\n disabled?: boolean;\n}\n\nexport interface SelectProps extends ThemeOverrideProps {\n value?: string;\n placeholder?: string;\n onPress?: () => void;\n size?: \"xl\" | \"lg\" | \"md\" | \"sm\" | \"xs\";\n state?: \"default\" | \"hover\" | \"focus\" | \"disable\" | \"error\";\n disabled?: boolean;\n label?: string;\n errorMessage?: string;\n iconLeft?: React.ReactNode;\n iconRight?: React.ReactNode;\n filled?: boolean;\n iconOnly?: boolean;\n options?: (string | SelectOption)[];\n onChange?: (value: string) => void;\n searchable?: boolean;\n searchPlaceholder?: string;\n noOptionsMessage?: string;\n /** Show a clear button to reset the selected value (field variant only) */\n clearable?: boolean;\n /** Called when the clear button is pressed */\n onClear?: () => void;\n maxHeight?: number;\n /**\n * Width of the dropdown popover. By default the popover matches the Select\n * trigger's width (`100%` of the field). Pass a number (px) or any CSS width\n * string (e.g. `320`, `\"24rem\"`) to size the popover independently of the\n * trigger — useful when option labels are wider than the field.\n */\n popoverWidth?: number | string;\n fullWidth?: boolean;\n testID?: string;\n /** Theme mode for the dropdown overlay. Defaults to themeMode when not set. */\n overlayThemeMode?: ThemeMode;\n /** Product context for the dropdown overlay. Defaults to themeProductContext when not set. */\n overlayThemeProductContext?: ProductContext;\n /** Preferred side for the dropdown. Default: \"bottom\". */\n side?: \"top\" | \"bottom\";\n /** When true, the dropdown flips to the opposite side when there isn't enough viewport space. Default: false. */\n autoFlip?: boolean;\n}\n\ninterface DropdownPosition {\n left: number;\n top?: number;\n bottom?: number;\n width: number;\n visible: boolean;\n}\n\nexport const Select: React.FC<SelectProps> = ({\n value,\n placeholder = \"Select\",\n onPress,\n size = \"md\",\n state: externalState,\n disabled = false,\n label,\n errorMessage,\n iconLeft,\n iconRight,\n filled = true,\n iconOnly = false,\n options = [],\n onChange,\n searchable = false,\n searchPlaceholder = \"Search\",\n noOptionsMessage = \"No results\",\n clearable = false,\n onClear,\n maxHeight = 300,\n popoverWidth,\n fullWidth = true,\n testID,\n themeMode,\n themeProductContext,\n overlayThemeMode,\n overlayThemeProductContext,\n side = \"bottom\",\n autoFlip = false,\n}) => {\n const { theme: rawTheme } = useResolvedTheme({\n themeMode,\n themeProductContext,\n });\n const theme = rawTheme as any;\n const { theme: rawOverlayTheme } = useResolvedTheme({\n themeMode: overlayThemeMode ?? themeMode,\n themeProductContext: overlayThemeProductContext ?? themeProductContext,\n });\n const overlayTheme = rawOverlayTheme as any;\n const modalId = useModalId();\n const overlayLayer = useOverlayLayer();\n const [isOpen, setIsOpen] = useState(false);\n const [selectedValue, setSelectedValue] = useState<string | undefined>(value);\n const [searchValue, setSearchValue] = useState(\"\");\n const [dropdownPosition, setDropdownPosition] =\n useState<DropdownPosition | null>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n const triggerRef = useRef<HTMLDivElement>(null);\n const dropdownRef = useRef<HTMLDivElement>(null);\n const selectedItemRef = useRef<HTMLDivElement>(null);\n const searchInputRef = useRef<HTMLInputElement>(null);\n // Stable IDs for ARIA relationships — lazy useState so it's computed once\n const [baseId] = useState(\n () => `xui-select-${Math.random().toString(36).slice(2, 9)}`\n );\n const labelId = `${baseId}-label`;\n const listboxId = `${baseId}-listbox`;\n\n const isDisable = externalState === \"disable\" || disabled;\n const isError = externalState === \"error\" || !!errorMessage;\n const isFocus = externalState === \"focus\" || isOpen;\n\n const sizeStyles = theme.sizing.input(size);\n const inputColors = theme.colors.control.input;\n const overlayInputColors = overlayTheme.colors.control.input;\n\n const updateDropdownPosition = useCallback(() => {\n if (!isWeb || !triggerRef.current || !dropdownRef.current) return;\n\n const triggerRect = triggerRef.current.getBoundingClientRect();\n // Read the actual rendered height — dropdown is in DOM (visibility: hidden) at this point\n const dropH = dropdownRef.current.getBoundingClientRect().height;\n const gap = sizeStyles.fieldGap;\n const viewportHeight = window.innerHeight;\n const spaceBelow = viewportHeight - triggerRect.bottom - gap;\n const spaceAbove = triggerRect.top - gap;\n\n const placeBelow = () =>\n setDropdownPosition({\n left: triggerRect.left,\n top: triggerRect.bottom + gap,\n width: triggerRect.width,\n visible: true,\n });\n\n const placeAbove = () =>\n setDropdownPosition({\n left: triggerRect.left,\n bottom: viewportHeight - triggerRect.top + gap,\n width: triggerRect.width,\n visible: true,\n });\n\n if (!autoFlip) {\n side === \"top\" ? placeAbove() : placeBelow();\n return;\n }\n\n // Auto-flip: prefer the requested side, flip only when there isn't enough room\n if (side === \"top\") {\n spaceAbove >= dropH || spaceAbove >= spaceBelow\n ? placeAbove()\n : placeBelow();\n } else {\n spaceBelow >= dropH || spaceBelow >= spaceAbove\n ? placeBelow()\n : placeAbove();\n }\n }, [sizeStyles.fieldGap, side, autoFlip]);\n\n useEffect(() => {\n if (value !== undefined) setSelectedValue(value);\n }, [value]);\n\n useEffect(() => {\n if (isFocus && selectedItemRef.current && dropdownRef.current) {\n const timeoutId = setTimeout(() => {\n const selectedItem = selectedItemRef.current;\n if (selectedItem && isWeb)\n selectedItem.scrollIntoView({ block: \"nearest\" });\n }, 0);\n return () => clearTimeout(timeoutId);\n }\n }, [isFocus]);\n\n // Keep the portaled dropdown anchored to the trigger (web only)\n // Positioning: runs whenever the dropdown becomes visible (covers both normal open\n // and forced-focus via the state prop). Resize repositions an already-open dropdown.\n useEffect(() => {\n if (!isWeb || !isFocus) return;\n updateDropdownPosition();\n window.addEventListener(\"resize\", updateDropdownPosition);\n return () => window.removeEventListener(\"resize\", updateDropdownPosition);\n }, [isFocus, updateDropdownPosition]);\n\n // Close-on-scroll: only active when the user has explicitly opened the dropdown\n // (isOpen=true), NOT when isFocus is forced via the state prop. This prevents\n // Storybook / forced-focus stories from closing immediately on ambient scroll events.\n // Scrolling inside the dropdown (the options list) is ignored.\n useEffect(() => {\n if (!isWeb || !isOpen) return;\n const closeOnScroll = (e: Event) => {\n if (dropdownRef.current?.contains(e.target as Node)) return;\n setIsOpen(false);\n };\n window.addEventListener(\"scroll\", closeOnScroll, true);\n return () => window.removeEventListener(\"scroll\", closeOnScroll, true);\n }, [isOpen]);\n\n useEffect(() => {\n if (isFocus && searchable) searchInputRef.current?.focus();\n }, [isFocus, searchable]);\n\n useEffect(() => {\n if (!isFocus) setSearchValue(\"\");\n }, [isFocus]);\n\n // Dropdown is portaled outside containerRef, so spare clicks that land in it\n useClickOutside(\n containerRef,\n useCallback((event: MouseEvent) => {\n const dropdownEl = dropdownRef.current;\n if (dropdownEl) {\n const path =\n typeof event.composedPath === \"function\" ? event.composedPath() : [];\n const insideDropdown = path.length\n ? path.includes(dropdownEl)\n : dropdownEl.contains(event.target as Node);\n if (insideDropdown) return;\n }\n setIsOpen(false);\n }, []),\n isWeb && isOpen\n );\n\n const getOptionLabel = (option: string | SelectOption) =>\n typeof option === \"string\" ? option : option.label;\n const getOptionValue = (option: string | SelectOption) =>\n typeof option === \"string\" ? option : option.value;\n const getOptionDisabled = (option: string | SelectOption) =>\n typeof option === \"string\" ? false : option.disabled || false;\n\n const filteredOptions =\n searchable && searchValue\n ? options.filter((option) =>\n getOptionLabel(option)\n .toLowerCase()\n .includes(searchValue.toLowerCase())\n )\n : options;\n\n const handlePress = () => {\n if (!isDisable) {\n if (onPress) onPress();\n setIsOpen(!isOpen);\n }\n };\n\n const handleSelect = (option: string | SelectOption) => {\n if (getOptionDisabled(option)) return;\n const val = getOptionValue(option);\n setSelectedValue(val);\n setIsOpen(false);\n if (onChange) onChange(val);\n };\n\n const handleClear = (e: React.MouseEvent) => {\n e.stopPropagation();\n if (isDisable) return;\n setSelectedValue(undefined);\n if (onChange) onChange(\"\");\n if (onClear) onClear();\n };\n\n const isHover = externalState === \"hover\";\n let backgroundColor = inputColors.bg;\n let borderColor = inputColors.border;\n\n if (isDisable) {\n backgroundColor = inputColors.bgDisable;\n borderColor = inputColors.borderDisable;\n } else if (isFocus) {\n backgroundColor = theme.colors.control.focus.bg;\n borderColor = isError\n ? theme.colors.border.alert\n : theme.colors.border.brand;\n } else if (isError) {\n borderColor = theme.colors.border.alert;\n } else if (isHover) {\n backgroundColor = inputColors.bgHover;\n borderColor = inputColors.borderHover;\n }\n\n if (filled === false && !isFocus && !isError && !isHover) {\n backgroundColor = \"transparent\";\n }\n\n const currentLabel = selectedValue\n ? getOptionLabel(\n options.find((o) => getOptionValue(o) === selectedValue) ||\n selectedValue\n )\n : placeholder;\n\n const textColor = isDisable\n ? inputColors.textDisable\n : selectedValue\n ? inputColors.text\n : inputColors.placeholder;\n const iconColor = isDisable\n ? inputColors.textDisable\n : inputColors.placeholder;\n\n const dropdownTop =\n sizeStyles.height +\n (label ? sizeStyles.fontSize + sizeStyles.fieldGap : 0) +\n sizeStyles.fieldGap;\n\n const dropdown = isFocus && options.length > 0 && (\n <Box\n ref={dropdownRef}\n id={listboxId}\n role=\"listbox\"\n aria-label={label || placeholder}\n data-modal-id={modalId}\n position={isNative ? \"absolute\" : undefined}\n top={isNative ? dropdownTop : undefined}\n width={isNative ? (popoverWidth ?? \"100%\") : undefined}\n backgroundColor={overlayTheme.colors.background.secondary}\n borderColor={overlayTheme.colors.border.secondary}\n borderWidth={1}\n borderRadius={overlayTheme.shape.contextMenu[size].borderRadius}\n style={{\n zIndex: overlayLayer + LAYER_OFFSET.popover,\n ...(isNative\n ? { elevation: 4 }\n : {\n position: \"fixed\",\n top:\n dropdownPosition?.top != null\n ? dropdownPosition.top\n : undefined,\n bottom:\n dropdownPosition?.bottom != null\n ? dropdownPosition.bottom\n : undefined,\n left: dropdownPosition?.left,\n width: popoverWidth ?? dropdownPosition?.width,\n boxShadow: \"0 4px 12px rgba(0,0,0,0.1)\",\n visibility: dropdownPosition?.visible ? \"visible\" : \"hidden\",\n }),\n minWidth:\n popoverWidth == null && iconOnly ? sizeStyles.height * 3 : undefined,\n }}\n >\n {/* Search Input - Outside scrollable area (web only) */}\n {searchable && !isNative && (\n <Box\n paddingHorizontal={sizeStyles.paddingHorizontal}\n paddingVertical={sizeStyles.paddingVertical}\n borderBottomWidth={1}\n borderColor={overlayTheme.colors.border.secondary}\n >\n <Box\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={sizeStyles.paddingHorizontal / 2}\n paddingHorizontal={4}\n >\n <Icon\n size={sizeStyles.iconSize - 2}\n color={overlayInputColors.placeholder}\n >\n <SearchIcon />\n </Icon>\n <Box\n as=\"input\"\n ref={searchInputRef}\n flex={1}\n type=\"text\"\n aria-label={searchPlaceholder}\n value={searchValue}\n onChange={(e: React.ChangeEvent<HTMLInputElement>) =>\n setSearchValue(e.target.value)\n }\n placeholder={searchPlaceholder}\n style={{\n border: \"none\",\n outline: \"none\",\n background: \"transparent\",\n color: overlayInputColors.text,\n fontSize: sizeStyles.fontSize,\n width: \"100%\",\n }}\n />\n </Box>\n </Box>\n )}\n\n {/* Options List - Scrollable */}\n <Box\n paddingVertical={4}\n overflow=\"scroll\"\n style={{\n maxHeight: searchable ? maxHeight - 60 : maxHeight,\n // overflowX pins the shorthand above, which otherwise scrolls both axes.\n ...(isWeb\n ? {\n overflowY: \"auto\",\n overflowX: \"hidden\",\n scrollbarWidth: \"none\" as const,\n }\n : {}),\n }}\n >\n {filteredOptions.length === 0 ? (\n <Box\n paddingVertical={sizeStyles.paddingVertical * 2}\n paddingHorizontal={sizeStyles.paddingHorizontal}\n alignItems=\"center\"\n >\n <Text\n color={overlayTheme.colors.content.tertiary}\n fontSize={sizeStyles.fontSize}\n >\n {noOptionsMessage}\n </Text>\n </Box>\n ) : (\n filteredOptions.map((option, index) => {\n const optionValue = getOptionValue(option);\n const optionLabel = getOptionLabel(option);\n const isOptionDisabled = getOptionDisabled(option);\n const isSelected = optionValue === selectedValue;\n const brandColors = overlayTheme.colors.control.brand.primary;\n const contentColors = overlayTheme.colors.content;\n return (\n <Box\n testID={testID}\n key={index}\n role=\"option\"\n aria-selected={isSelected}\n aria-disabled={isOptionDisabled || undefined}\n ref={isSelected ? selectedItemRef : undefined}\n paddingVertical={sizeStyles.paddingVertical}\n paddingHorizontal={sizeStyles.paddingHorizontal}\n onPress={\n isOptionDisabled ? undefined : () => handleSelect(option)\n }\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"space-between\"\n backgroundColor={isSelected ? brandColors.bg : \"transparent\"}\n style={{\n ...(isWeb\n ? {\n cursor: isOptionDisabled ? \"not-allowed\" : \"pointer\",\n }\n : {}),\n opacity: isOptionDisabled ? 0.5 : 1,\n }}\n hoverStyle={\n !isSelected && !isOptionDisabled\n ? { backgroundColor: overlayInputColors.bgHover }\n : undefined\n }\n >\n <Text\n color={\n isSelected\n ? contentColors.on.brand\n : overlayTheme.colors.content.secondary\n }\n fontSize={sizeStyles.fontSize}\n fontWeight=\"400\"\n >\n {optionLabel}\n </Text>\n </Box>\n );\n })\n )}\n </Box>\n </Box>\n );\n\n return (\n <Box\n testID={testID}\n ref={containerRef}\n flexDirection=\"column\"\n gap={sizeStyles.fieldGap}\n width={fullWidth ? \"100%\" : undefined}\n position=\"relative\"\n >\n {label && (\n <Text\n id={labelId}\n color={theme.colors.content.secondary}\n fontSize={sizeStyles.fontSize - 2}\n fontWeight=\"500\"\n >\n {label}\n </Text>\n )}\n <Box\n ref={triggerRef}\n onPress={handlePress}\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n aria-expanded={isFocus && options.length > 0}\n aria-controls={listboxId}\n aria-labelledby={label ? labelId : undefined}\n aria-disabled={isDisable || undefined}\n backgroundColor={backgroundColor}\n borderColor={borderColor}\n borderWidth={borderColor !== \"transparent\" ? 1 : 0}\n borderRadius={sizeStyles.radius}\n height={sizeStyles.height}\n width={iconOnly ? sizeStyles.height : \"100%\"}\n paddingHorizontal={iconOnly ? 0 : sizeStyles.paddingHorizontal}\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent={iconOnly ? \"center\" : \"flex-start\"}\n gap={iconOnly ? 4 : sizeStyles.trailingGap}\n position=\"relative\"\n style={\n isWeb ? { cursor: isDisable ? \"not-allowed\" : \"pointer\" } : undefined\n }\n hoverStyle={\n !isDisable && !isFocus && !isError\n ? {\n backgroundColor: inputColors.bgHover,\n borderColor: inputColors.borderHover,\n }\n : undefined\n }\n >\n {iconOnly ? (\n iconLeft && (\n <Box alignItems=\"center\" justifyContent=\"center\">\n <Icon size={sizeStyles.iconSize} color={iconColor}>\n {iconLeft}\n </Icon>\n </Box>\n )\n ) : (\n <Box\n flexDirection=\"row\"\n alignItems=\"center\"\n flex={1}\n minWidth={0}\n gap={sizeStyles.contentGap}\n >\n {iconLeft && (\n <Box alignItems=\"center\" justifyContent=\"center\" flexShrink={0}>\n <Icon size={sizeStyles.iconSize} color={iconColor}>\n {iconLeft}\n </Icon>\n </Box>\n )}\n <Box\n flex={1}\n minWidth={0}\n height=\"100%\"\n justifyContent=\"center\"\n overflow=\"hidden\"\n overflowX=\"hidden\"\n overflowY=\"hidden\"\n >\n {/*\n `numberOfLines={1}` clamps the label to one line with a trailing\n ellipsis instead of letting a long value run past the field;\n `title` keeps the untruncated string readable on hover.\n */}\n <Text\n color={textColor}\n fontSize={sizeStyles.fontSize}\n numberOfLines={1}\n title={currentLabel}\n >\n {currentLabel}\n </Text>\n </Box>\n </Box>\n )}\n {/* Trailing controls never shrink, so a long label cannot displace them. */}\n <Box flexDirection=\"row\" alignItems=\"center\" gap={4} flexShrink={0}>\n {/* Clear button (field variant only) */}\n {clearable && !iconOnly && !isDisable && selectedValue && (\n <Box\n onPress={handleClear}\n alignItems=\"center\"\n justifyContent=\"center\"\n style={isWeb ? { cursor: \"pointer\" } : undefined}\n >\n <Remove\n size={sizeStyles.iconSize}\n color={iconColor}\n variant=\"line\"\n />\n </Box>\n )}\n\n {/* Error icon */}\n {isError && (\n <Icon\n size={sizeStyles.iconSize}\n color={theme.colors.content.alert.primary}\n >\n <ExclamationMarkCr />\n </Icon>\n )}\n {iconRight !== undefined ? (\n <Icon size={sizeStyles.iconSize} color={iconColor}>\n {iconRight}\n </Icon>\n ) : isFocus ? (\n <ChevronUp\n size={sizeStyles.iconSize}\n color={iconColor}\n variant=\"line\"\n />\n ) : (\n <ChevronDown\n size={sizeStyles.iconSize}\n color={iconColor}\n variant=\"line\"\n />\n )}\n </Box>\n </Box>\n\n {/* Dropdown Menu */}\n {isNative ? dropdown : <Portal>{dropdown}</Portal>}\n\n {isError && errorMessage && (\n <Text\n color={theme.colors.content.alert.primary}\n fontSize={sizeStyles.fontSize - 2}\n style={{ lineHeight: sizeStyles.lineHeight + \"px\" }}\n >\n {errorMessage}\n </Text>\n )}\n </Box>\n );\n};\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n AccessibilityRole,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleToAccessibilityRole: Record<string, AccessibilityRole> = {\n button: \"button\",\n link: \"link\",\n img: \"image\",\n image: \"image\",\n summary: \"summary\",\n switch: \"switch\",\n checkbox: \"checkbox\",\n radio: \"radio\",\n heading: \"header\",\n text: \"text\",\n search: \"search\",\n alert: \"alert\",\n none: \"none\",\n presentation: \"none\",\n progressbar: \"progressbar\",\n scrollbar: \"scrollbar\",\n adjustable: \"adjustable\",\n tab: \"tab\",\n menu: \"menu\",\n menuitem: \"menuitem\",\n list: \"list\",\n timer: \"timer\",\n};\n\n/** RN ViewStyle.gap is typed as number (Yoga gap), not DimensionValue. */\nconst toGapValue = (gap: number | string | undefined): number | undefined => {\n if (gap === undefined) return undefined;\n if (typeof gap === \"number\") return gap;\n const pxMatch = /^(\\d+(?:\\.\\d+)?)px$/.exec(gap);\n if (pxMatch) return Number(pxMatch[1]);\n const asNumber = Number(gap);\n return Number.isFinite(asNumber) ? asNumber : undefined;\n};\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 flexWrap,\n alignItems,\n justifyContent,\n alignSelf,\n position,\n top,\n bottom,\n left,\n right,\n width,\n minWidth,\n minHeight,\n maxWidth,\n maxHeight,\n flex,\n flexShrink,\n gap,\n overflow,\n opacity,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n disabled,\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 opacity: opacity ?? (disabled ? 0.5 : undefined),\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 flexWrap,\n alignItems,\n justifyContent,\n alignSelf,\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 flexShrink,\n gap: toGapValue(gap),\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Map web a11y props; drop the rest of the web-only attributes before\n // spreading onto RN hosts (unknown props warn at runtime).\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 \"aria-busy\": ariaBusy,\n className,\n \"data-testid\": _dataTestId,\n cursor: _cursor,\n type: _type,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n const accessibilityRole =\n (typeof role === \"string\" && roleToAccessibilityRole[role]) ||\n (as === \"button\" ? \"button\" : undefined);\n const isDisabled = Boolean(disabled || ariaDisabled);\n const accessibilityState = {\n disabled: isDisabled || undefined,\n busy: Boolean(ariaBusy) || undefined,\n };\n const accessibilityLiveRegion =\n ariaLive === \"polite\" || ariaLive === \"assertive\" ? ariaLive : undefined;\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 accessibilityLabel={typeof ariaLabel === \"string\" ? ariaLabel : alt}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n // Prefer Pressable whenever the node is interactive or explicitly a button,\n // so disabled / aria-disabled controls stay in the a11y tree as buttons.\n if (onPress || as === \"button\") {\n return (\n <Pressable\n onPress={!isDisabled && onPress ? onPress : undefined}\n disabled={isDisabled}\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 accessibilityRole={accessibilityRole}\n accessibilityLabel={\n typeof ariaLabel === \"string\" ? ariaLabel : undefined\n }\n accessibilityState={accessibilityState}\n accessibilityLiveRegion={accessibilityLiveRegion}\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 accessibilityRole={accessibilityRole}\n accessibilityLabel={typeof ariaLabel === \"string\" ? ariaLabel : undefined}\n accessibilityState={accessibilityState}\n accessibilityLiveRegion={accessibilityLiveRegion}\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","import React from \"react\";\nimport { View, ViewStyle } from \"react-native\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Icon: React.FC<IconProps> = ({\n children,\n color,\n size,\n testID,\n \"data-testid\": dataTestId,\n}) => {\n const style: ViewStyle = {\n width: typeof size === \"number\" ? size : undefined,\n height: typeof size === \"number\" ? size : undefined,\n alignItems: \"center\",\n justifyContent: \"center\",\n };\n\n // On native, we try to pass the color down to children (like Text primitives)\n // to mimic the CSS inheritance behavior of the web version.\n const childrenWithProps = React.Children.map(children, (child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n color: child.props.color || color,\n // Also pass size if child seems to be an icon that needs it\n size: child.props.size || size,\n });\n }\n return child;\n });\n\n return (\n <View style={style} testID={dataTestId || testID}>\n {childrenWithProps}\n </View>\n );\n};\n","export * from \"./Box\";\nexport * from \"./Text\";\nexport * from \"./Spinner\";\nexport * from \"./Icon\";\nexport * from \"./Divider\";\nexport * from \"./Input\";\nexport * from \"./TextArea\";\nexport * from \"./LinearGradient\";\n\nexport const isWeb = false;\nexport const isNative = true;\n","import { ReactNode } from \"react\";\n\ninterface PortalProps {\n children: ReactNode;\n}\n\nexport const Portal = ({ children }: PortalProps) => <>{children}</>;\n"],"mappings":"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","names":["import_react","import_react_native","import_jsx_runtime","RNText","import_react_native","import_jsx_runtime","React","import_jsx_runtime","import_jsx_runtime","SearchIcon"]}
package/native/index.mjs CHANGED
@@ -641,7 +641,12 @@ var Select = ({
641
641
  overflow: "scroll",
642
642
  style: {
643
643
  maxHeight: searchable ? maxHeight - 60 : maxHeight,
644
- ...isWeb ? { overflowY: "auto" } : {}
644
+ // overflowX pins the shorthand above, which otherwise scrolls both axes.
645
+ ...isWeb ? {
646
+ overflowY: "auto",
647
+ overflowX: "hidden",
648
+ scrollbarWidth: "none"
649
+ } : {}
645
650
  },
646
651
  children: filteredOptions.length === 0 ? /* @__PURE__ */ jsx5(
647
652
  Box,