@coinbase/cds-mcp-server 8.66.2 → 9.0.0-rc.2

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.
Files changed (260) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/mcp-docs/mobile/components/AccordionItem.txt +4 -4
  3. package/mcp-docs/mobile/components/Alert.txt +2 -1
  4. package/mcp-docs/mobile/components/AreaChart.txt +40 -40
  5. package/mcp-docs/mobile/components/Avatar.txt +33 -33
  6. package/mcp-docs/mobile/components/AvatarButton.txt +35 -35
  7. package/mcp-docs/mobile/components/Banner.txt +55 -40
  8. package/mcp-docs/mobile/components/BarChart.txt +40 -40
  9. package/mcp-docs/mobile/components/Box.txt +34 -34
  10. package/mcp-docs/mobile/components/BrowserBar.txt +35 -35
  11. package/mcp-docs/mobile/components/Button.txt +52 -42
  12. package/mcp-docs/mobile/components/Calendar.txt +34 -34
  13. package/mcp-docs/mobile/components/Carousel.txt +48 -58
  14. package/mcp-docs/mobile/components/CartesianChart.txt +40 -40
  15. package/mcp-docs/mobile/components/CellMedia.txt +1 -1
  16. package/mcp-docs/mobile/components/Checkbox.txt +3 -3
  17. package/mcp-docs/mobile/components/CheckboxCell.txt +37 -37
  18. package/mcp-docs/mobile/components/CheckboxGroup.txt +4 -4
  19. package/mcp-docs/mobile/components/Chip.txt +39 -39
  20. package/mcp-docs/mobile/components/Coachmark.txt +39 -39
  21. package/mcp-docs/mobile/components/Collapsible.txt +2 -2
  22. package/mcp-docs/mobile/components/Combobox.txt +10 -10
  23. package/mcp-docs/mobile/components/ContainedAssetCard.txt +7 -7
  24. package/mcp-docs/mobile/components/ContentCard.txt +37 -37
  25. package/mcp-docs/mobile/components/ContentCardBody.txt +42 -42
  26. package/mcp-docs/mobile/components/ContentCardFooter.txt +34 -34
  27. package/mcp-docs/mobile/components/ContentCardHeader.txt +41 -41
  28. package/mcp-docs/mobile/components/ContentCell.txt +49 -49
  29. package/mcp-docs/mobile/components/ControlGroup.txt +36 -36
  30. package/mcp-docs/mobile/components/DataCard.txt +47 -47
  31. package/mcp-docs/mobile/components/DateInput.txt +25 -22
  32. package/mcp-docs/mobile/components/DatePicker.txt +25 -22
  33. package/mcp-docs/mobile/components/Divider.txt +33 -33
  34. package/mcp-docs/mobile/components/DotCount.txt +4 -2
  35. package/mcp-docs/mobile/components/DotStatusColor.txt +1 -1
  36. package/mcp-docs/mobile/components/DotSymbol.txt +6 -6
  37. package/mcp-docs/mobile/components/Fallback.txt +32 -32
  38. package/mcp-docs/mobile/components/FloatingAssetCard.txt +4 -4
  39. package/mcp-docs/mobile/components/HStack.txt +34 -34
  40. package/mcp-docs/mobile/components/HeroSquare.txt +1 -1
  41. package/mcp-docs/mobile/components/Icon.txt +3 -3
  42. package/mcp-docs/mobile/components/IconButton.txt +38 -58
  43. package/mcp-docs/mobile/components/InputChip.txt +39 -39
  44. package/mcp-docs/mobile/components/Interactable.txt +34 -34
  45. package/mcp-docs/mobile/components/Legend.txt +43 -41
  46. package/mcp-docs/mobile/components/LineChart.txt +40 -40
  47. package/mcp-docs/mobile/components/Link.txt +41 -38
  48. package/mcp-docs/mobile/components/ListCell.txt +52 -52
  49. package/mcp-docs/mobile/components/Lottie.txt +34 -34
  50. package/mcp-docs/mobile/components/LottieStatusAnimation.txt +2 -2
  51. package/mcp-docs/mobile/components/MediaCard.txt +41 -41
  52. package/mcp-docs/mobile/components/MediaChip.txt +39 -39
  53. package/mcp-docs/mobile/components/MessagingCard.txt +42 -42
  54. package/mcp-docs/mobile/components/Modal.txt +6 -2
  55. package/mcp-docs/mobile/components/ModalBody.txt +8 -8
  56. package/mcp-docs/mobile/components/ModalFooter.txt +33 -33
  57. package/mcp-docs/mobile/components/ModalHeader.txt +34 -34
  58. package/mcp-docs/mobile/components/MultiContentModule.txt +40 -40
  59. package/mcp-docs/mobile/components/NavigationTitle.txt +38 -36
  60. package/mcp-docs/mobile/components/NavigationTitleSelect.txt +38 -36
  61. package/mcp-docs/mobile/components/NudgeCard.txt +6 -6
  62. package/mcp-docs/mobile/components/Numpad.txt +37 -37
  63. package/mcp-docs/mobile/components/Overlay.txt +33 -33
  64. package/mcp-docs/mobile/components/PageFooter.txt +36 -30
  65. package/mcp-docs/mobile/components/PageHeader.txt +38 -32
  66. package/mcp-docs/mobile/components/PercentageBarChart.txt +40 -40
  67. package/mcp-docs/mobile/components/PeriodSelector.txt +39 -39
  68. package/mcp-docs/mobile/components/Pictogram.txt +1 -1
  69. package/mcp-docs/mobile/components/Point.txt +2 -2
  70. package/mcp-docs/mobile/components/PortalProvider.txt +2 -2
  71. package/mcp-docs/mobile/components/Pressable.txt +36 -36
  72. package/mcp-docs/mobile/components/ProgressBar.txt +2 -2
  73. package/mcp-docs/mobile/components/ProgressBarWithFixedLabels.txt +1 -1
  74. package/mcp-docs/mobile/components/ProgressBarWithFloatLabel.txt +1 -1
  75. package/mcp-docs/mobile/components/ProgressCircle.txt +3 -3
  76. package/mcp-docs/mobile/components/Radio.txt +3 -3
  77. package/mcp-docs/mobile/components/RadioCell.txt +37 -37
  78. package/mcp-docs/mobile/components/RadioGroup.txt +3 -3
  79. package/mcp-docs/mobile/components/ReferenceLine.txt +1 -1
  80. package/mcp-docs/mobile/components/RemoteImage.txt +6 -6
  81. package/mcp-docs/mobile/components/RemoteImageGroup.txt +1 -1
  82. package/mcp-docs/mobile/components/RollingNumber.txt +41 -39
  83. package/mcp-docs/mobile/components/Scrubber.txt +2 -2
  84. package/mcp-docs/mobile/components/SearchInput.txt +25 -22
  85. package/mcp-docs/mobile/components/SectionHeader.txt +7 -7
  86. package/mcp-docs/mobile/components/SegmentedTabs.txt +34 -34
  87. package/mcp-docs/mobile/components/Select.txt +3 -3
  88. package/mcp-docs/mobile/components/SelectAlpha.txt +10 -10
  89. package/mcp-docs/mobile/components/SelectChip.txt +42 -40
  90. package/mcp-docs/mobile/components/SelectChipAlpha.txt +11 -11
  91. package/mcp-docs/mobile/components/SelectOption.txt +10 -10
  92. package/mcp-docs/mobile/components/SlideButton.txt +40 -40
  93. package/mcp-docs/mobile/components/Spacer.txt +7 -7
  94. package/mcp-docs/mobile/components/Sparkline.txt +3 -3
  95. package/mcp-docs/mobile/components/SparklineGradient.txt +3 -3
  96. package/mcp-docs/mobile/components/SparklineInteractive.txt +6 -6
  97. package/mcp-docs/mobile/components/SparklineInteractiveHeader.txt +5 -5
  98. package/mcp-docs/mobile/components/Spinner.txt +2 -2
  99. package/mcp-docs/mobile/components/SpotIcon.txt +1 -1
  100. package/mcp-docs/mobile/components/SpotRectangle.txt +1 -1
  101. package/mcp-docs/mobile/components/SpotSquare.txt +1 -1
  102. package/mcp-docs/mobile/components/Stepper.txt +37 -36
  103. package/mcp-docs/mobile/components/Switch.txt +13 -3
  104. package/mcp-docs/mobile/components/TabIndicator.txt +1 -1
  105. package/mcp-docs/mobile/components/TabLabel.txt +39 -37
  106. package/mcp-docs/mobile/components/TabNavigation.txt +34 -34
  107. package/mcp-docs/mobile/components/TabbedChips.txt +34 -34
  108. package/mcp-docs/mobile/components/TabbedChipsAlpha.txt +34 -34
  109. package/mcp-docs/mobile/components/Tabs.txt +34 -34
  110. package/mcp-docs/mobile/components/Tag.txt +41 -41
  111. package/mcp-docs/mobile/components/Text.txt +51 -58
  112. package/mcp-docs/mobile/components/TextInput.txt +25 -22
  113. package/mcp-docs/mobile/components/ThemeProvider.txt +3 -1
  114. package/mcp-docs/mobile/components/Toast.txt +34 -34
  115. package/mcp-docs/mobile/components/Tooltip.txt +2 -2
  116. package/mcp-docs/mobile/components/TopNavBar.txt +9 -9
  117. package/mcp-docs/mobile/components/Tray.txt +5 -3
  118. package/mcp-docs/mobile/components/UpsellCard.txt +15 -14
  119. package/mcp-docs/mobile/components/VStack.txt +34 -34
  120. package/mcp-docs/mobile/components/XAxis.txt +1 -1
  121. package/mcp-docs/mobile/components/YAxis.txt +1 -1
  122. package/mcp-docs/mobile/getting-started/installation.txt +9 -3
  123. package/mcp-docs/mobile/hooks/useMergeRefs.txt +5 -5
  124. package/mcp-docs/mobile/routes.txt +1 -1
  125. package/mcp-docs/web/components/AccordionItem.txt +4 -4
  126. package/mcp-docs/web/components/Alert.txt +3 -2
  127. package/mcp-docs/web/components/AreaChart.txt +63 -63
  128. package/mcp-docs/web/components/Avatar.txt +49 -49
  129. package/mcp-docs/web/components/AvatarButton.txt +54 -324
  130. package/mcp-docs/web/components/Banner.txt +71 -55
  131. package/mcp-docs/web/components/BarChart.txt +58 -58
  132. package/mcp-docs/web/components/Box.txt +49 -312
  133. package/mcp-docs/web/components/Button.txt +62 -324
  134. package/mcp-docs/web/components/Calendar.txt +49 -49
  135. package/mcp-docs/web/components/Carousel.txt +65 -72
  136. package/mcp-docs/web/components/CartesianChart.txt +63 -63
  137. package/mcp-docs/web/components/CellMedia.txt +1 -1
  138. package/mcp-docs/web/components/Checkbox.txt +9 -7
  139. package/mcp-docs/web/components/CheckboxCell.txt +52 -52
  140. package/mcp-docs/web/components/CheckboxGroup.txt +3 -3
  141. package/mcp-docs/web/components/Chip.txt +51 -51
  142. package/mcp-docs/web/components/Coachmark.txt +55 -55
  143. package/mcp-docs/web/components/Collapsible.txt +2 -2
  144. package/mcp-docs/web/components/Combobox.txt +8 -8
  145. package/mcp-docs/web/components/ContainedAssetCard.txt +60 -55
  146. package/mcp-docs/web/components/ContentCard.txt +54 -317
  147. package/mcp-docs/web/components/ContentCardBody.txt +57 -318
  148. package/mcp-docs/web/components/ContentCardFooter.txt +49 -312
  149. package/mcp-docs/web/components/ContentCardHeader.txt +56 -318
  150. package/mcp-docs/web/components/ContentCell.txt +63 -322
  151. package/mcp-docs/web/components/ControlGroup.txt +50 -50
  152. package/mcp-docs/web/components/DataCard.txt +60 -60
  153. package/mcp-docs/web/components/DateInput.txt +54 -54
  154. package/mcp-docs/web/components/DatePicker.txt +54 -54
  155. package/mcp-docs/web/components/Divider.txt +49 -49
  156. package/mcp-docs/web/components/DotCount.txt +3 -1
  157. package/mcp-docs/web/components/DotStatusColor.txt +1 -1
  158. package/mcp-docs/web/components/DotSymbol.txt +6 -6
  159. package/mcp-docs/web/components/Dropdown.txt +3 -3
  160. package/mcp-docs/web/components/Fallback.txt +49 -312
  161. package/mcp-docs/web/components/FloatingAssetCard.txt +53 -53
  162. package/mcp-docs/web/components/FullscreenAlert.txt +1 -1
  163. package/mcp-docs/web/components/FullscreenModal.txt +5 -4
  164. package/mcp-docs/web/components/FullscreenModalLayout.txt +3 -2
  165. package/mcp-docs/web/components/Grid.txt +51 -314
  166. package/mcp-docs/web/components/GridColumn.txt +48 -311
  167. package/mcp-docs/web/components/HStack.txt +49 -312
  168. package/mcp-docs/web/components/HeroSquare.txt +1 -1
  169. package/mcp-docs/web/components/Icon.txt +51 -51
  170. package/mcp-docs/web/components/IconButton.txt +51 -341
  171. package/mcp-docs/web/components/InputChip.txt +51 -51
  172. package/mcp-docs/web/components/Interactable.txt +48 -319
  173. package/mcp-docs/web/components/Legend.txt +62 -62
  174. package/mcp-docs/web/components/LineChart.txt +63 -63
  175. package/mcp-docs/web/components/Link.txt +48 -318
  176. package/mcp-docs/web/components/ListCell.txt +66 -325
  177. package/mcp-docs/web/components/Lottie.txt +49 -49
  178. package/mcp-docs/web/components/LottieStatusAnimation.txt +2 -2
  179. package/mcp-docs/web/components/MediaCard.txt +53 -53
  180. package/mcp-docs/web/components/MediaChip.txt +51 -51
  181. package/mcp-docs/web/components/MessagingCard.txt +54 -54
  182. package/mcp-docs/web/components/Modal.txt +51 -50
  183. package/mcp-docs/web/components/ModalBody.txt +49 -49
  184. package/mcp-docs/web/components/ModalFooter.txt +49 -49
  185. package/mcp-docs/web/components/ModalHeader.txt +50 -50
  186. package/mcp-docs/web/components/MultiContentModule.txt +55 -316
  187. package/mcp-docs/web/components/NavigationBar.txt +53 -53
  188. package/mcp-docs/web/components/NavigationTitle.txt +103 -0
  189. package/mcp-docs/web/components/NavigationTitleSelect.txt +48 -48
  190. package/mcp-docs/web/components/NudgeCard.txt +53 -53
  191. package/mcp-docs/web/components/Overlay.txt +49 -49
  192. package/mcp-docs/web/components/PageFooter.txt +54 -48
  193. package/mcp-docs/web/components/PageHeader.txt +58 -52
  194. package/mcp-docs/web/components/Pagination.txt +49 -49
  195. package/mcp-docs/web/components/PercentageBarChart.txt +58 -58
  196. package/mcp-docs/web/components/PeriodSelector.txt +62 -62
  197. package/mcp-docs/web/components/Pictogram.txt +1 -1
  198. package/mcp-docs/web/components/Point.txt +5 -14
  199. package/mcp-docs/web/components/PopoverPanel.txt +1 -1
  200. package/mcp-docs/web/components/PortalProvider.txt +2 -2
  201. package/mcp-docs/web/components/Pressable.txt +48 -319
  202. package/mcp-docs/web/components/ProgressBar.txt +1 -1
  203. package/mcp-docs/web/components/ProgressCircle.txt +2 -2
  204. package/mcp-docs/web/components/Radio.txt +9 -7
  205. package/mcp-docs/web/components/RadioCell.txt +52 -52
  206. package/mcp-docs/web/components/RadioGroup.txt +3 -3
  207. package/mcp-docs/web/components/ReferenceLine.txt +2 -2
  208. package/mcp-docs/web/components/RemoteImage.txt +48 -48
  209. package/mcp-docs/web/components/RemoteImageGroup.txt +3 -3
  210. package/mcp-docs/web/components/RollingNumber.txt +51 -313
  211. package/mcp-docs/web/components/Scrubber.txt +2 -2
  212. package/mcp-docs/web/components/SearchInput.txt +56 -56
  213. package/mcp-docs/web/components/SectionHeader.txt +55 -55
  214. package/mcp-docs/web/components/SegmentedControl.txt +1 -1
  215. package/mcp-docs/web/components/SegmentedTabs.txt +49 -49
  216. package/mcp-docs/web/components/Select.txt +3 -3
  217. package/mcp-docs/web/components/SelectAlpha.txt +8 -8
  218. package/mcp-docs/web/components/SelectChip.txt +55 -55
  219. package/mcp-docs/web/components/SelectChipAlpha.txt +8 -8
  220. package/mcp-docs/web/components/SelectOption.txt +56 -56
  221. package/mcp-docs/web/components/Sidebar.txt +66 -56
  222. package/mcp-docs/web/components/SidebarItem.txt +10 -111
  223. package/mcp-docs/web/components/SidebarMoreMenu.txt +2 -2
  224. package/mcp-docs/web/components/Spacer.txt +55 -318
  225. package/mcp-docs/web/components/Sparkline.txt +3 -3
  226. package/mcp-docs/web/components/SparklineGradient.txt +3 -3
  227. package/mcp-docs/web/components/SparklineInteractive.txt +4 -4
  228. package/mcp-docs/web/components/SparklineInteractiveHeader.txt +4 -4
  229. package/mcp-docs/web/components/Spinner.txt +49 -49
  230. package/mcp-docs/web/components/SpotIcon.txt +1 -1
  231. package/mcp-docs/web/components/SpotRectangle.txt +1 -1
  232. package/mcp-docs/web/components/SpotSquare.txt +1 -1
  233. package/mcp-docs/web/components/Stepper.txt +53 -53
  234. package/mcp-docs/web/components/Switch.txt +21 -7
  235. package/mcp-docs/web/components/TabIndicator.txt +1 -1
  236. package/mcp-docs/web/components/TabLabel.txt +50 -50
  237. package/mcp-docs/web/components/TabNavigation.txt +48 -48
  238. package/mcp-docs/web/components/TabbedChips.txt +49 -49
  239. package/mcp-docs/web/components/TabbedChipsAlpha.txt +49 -49
  240. package/mcp-docs/web/components/Table.txt +4 -4
  241. package/mcp-docs/web/components/TableCaption.txt +1 -1
  242. package/mcp-docs/web/components/TableCell.txt +2 -2
  243. package/mcp-docs/web/components/TableRow.txt +1 -1
  244. package/mcp-docs/web/components/Tabs.txt +49 -49
  245. package/mcp-docs/web/components/Tag.txt +52 -52
  246. package/mcp-docs/web/components/Text.txt +49 -312
  247. package/mcp-docs/web/components/TextInput.txt +56 -56
  248. package/mcp-docs/web/components/ThemeProvider.txt +24 -4
  249. package/mcp-docs/web/components/TileButton.txt +48 -318
  250. package/mcp-docs/web/components/Toast.txt +51 -51
  251. package/mcp-docs/web/components/Tooltip.txt +3 -3
  252. package/mcp-docs/web/components/Tray.txt +2 -2
  253. package/mcp-docs/web/components/UpsellCard.txt +15 -14
  254. package/mcp-docs/web/components/VStack.txt +49 -312
  255. package/mcp-docs/web/components/XAxis.txt +1 -1
  256. package/mcp-docs/web/components/YAxis.txt +1 -1
  257. package/mcp-docs/web/getting-started/installation.txt +13 -5
  258. package/mcp-docs/web/hooks/useMergeRefs.txt +5 -5
  259. package/mcp-docs/web/routes.txt +1 -1
  260. package/package.json +1 -1
@@ -256,19 +256,19 @@ function Example() {
256
256
  | `alignItems` | `ResponsiveProp<center \| normal \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
257
257
  | `alignSelf` | `ResponsiveProp<center \| normal \| auto \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
258
258
  | `as` | `div` | No | `-` | The underlying element or component the polymorphic component will render. Changing as also changes the inherited native props (e.g. href for as=a) and the expected ref type. |
259
- | `aspectRatio` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
260
- | `background` | `currentColor \| fg \| fgMuted \| fgInverse \| fgPrimary \| fgWarning \| fgPositive \| fgNegative \| bg \| bgAlternate \| bgInverse \| bgOverlay \| bgElevation1 \| bgElevation2 \| bgPrimary \| bgPrimaryWash \| bgSecondary \| bgTertiary \| bgSecondaryWash \| bgNegative \| bgNegativeWash \| bgPositive \| bgPositiveWash \| bgWarning \| bgWarningWash \| bgLine \| bgLineHeavy \| bgLineInverse \| bgLinePrimary \| bgLinePrimarySubtle \| accentSubtleRed \| accentBoldRed \| accentSubtleGreen \| accentBoldGreen \| accentSubtleBlue \| accentBoldBlue \| accentSubtlePurple \| accentBoldPurple \| accentSubtleYellow \| accentBoldYellow \| accentSubtleGray \| accentBoldGray \| transparent` | No | `-` | - |
261
- | `borderBottomLeftRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
262
- | `borderBottomRightRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
263
- | `borderBottomWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500` | No | `-` | - |
264
- | `borderColor` | `currentColor \| fg \| fgMuted \| fgInverse \| fgPrimary \| fgWarning \| fgPositive \| fgNegative \| bg \| bgAlternate \| bgInverse \| bgOverlay \| bgElevation1 \| bgElevation2 \| bgPrimary \| bgPrimaryWash \| bgSecondary \| bgTertiary \| bgSecondaryWash \| bgNegative \| bgNegativeWash \| bgPositive \| bgPositiveWash \| bgWarning \| bgWarningWash \| bgLine \| bgLineHeavy \| bgLineInverse \| bgLinePrimary \| bgLinePrimarySubtle \| accentSubtleRed \| accentBoldRed \| accentSubtleGreen \| accentBoldGreen \| accentSubtleBlue \| accentBoldBlue \| accentSubtlePurple \| accentBoldPurple \| accentSubtleYellow \| accentBoldYellow \| accentSubtleGray \| accentBoldGray \| transparent` | No | `-` | - |
265
- | `borderEndWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500` | No | `-` | - |
266
- | `borderRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
267
- | `borderStartWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500` | No | `-` | - |
268
- | `borderTopLeftRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
269
- | `borderTopRightRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
270
- | `borderTopWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500` | No | `-` | - |
271
- | `borderWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500` | No | `-` | - |
259
+ | `aspectRatio` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto \| ResponsiveValue<AspectRatio \| undefined>` | No | `-` | - |
260
+ | `background` | `currentColor \| fg \| fgMuted \| fgInverse \| fgPrimary \| fgWarning \| fgPositive \| fgNegative \| bg \| bgAlternate \| bgInverse \| bgOverlay \| bgElevation1 \| bgElevation2 \| bgPrimary \| bgPrimaryWash \| bgSecondary \| bgTertiary \| bgSecondaryWash \| bgNegative \| bgNegativeWash \| bgPositive \| bgPositiveWash \| bgWarning \| bgWarningWash \| bgLine \| bgLineHeavy \| bgLineInverse \| bgLinePrimary \| bgLinePrimarySubtle \| accentSubtleRed \| accentBoldRed \| accentSubtleGreen \| accentBoldGreen \| accentSubtleBlue \| accentBoldBlue \| accentSubtlePurple \| accentBoldPurple \| accentSubtleYellow \| accentBoldYellow \| accentSubtleGray \| accentBoldGray \| transparent \| ResponsiveValue<Color \| undefined>` | No | `-` | - |
261
+ | `borderBottomLeftRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000 \| ResponsiveValue<BorderRadius \| undefined>` | No | `-` | - |
262
+ | `borderBottomRightRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000 \| ResponsiveValue<BorderRadius \| undefined>` | No | `-` | - |
263
+ | `borderBottomWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| ResponsiveValue<BorderWidth \| undefined>` | No | `-` | - |
264
+ | `borderColor` | `currentColor \| fg \| fgMuted \| fgInverse \| fgPrimary \| fgWarning \| fgPositive \| fgNegative \| bg \| bgAlternate \| bgInverse \| bgOverlay \| bgElevation1 \| bgElevation2 \| bgPrimary \| bgPrimaryWash \| bgSecondary \| bgTertiary \| bgSecondaryWash \| bgNegative \| bgNegativeWash \| bgPositive \| bgPositiveWash \| bgWarning \| bgWarningWash \| bgLine \| bgLineHeavy \| bgLineInverse \| bgLinePrimary \| bgLinePrimarySubtle \| accentSubtleRed \| accentBoldRed \| accentSubtleGreen \| accentBoldGreen \| accentSubtleBlue \| accentBoldBlue \| accentSubtlePurple \| accentBoldPurple \| accentSubtleYellow \| accentBoldYellow \| accentSubtleGray \| accentBoldGray \| transparent \| ResponsiveValue<Color \| undefined>` | No | `-` | - |
265
+ | `borderEndWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| ResponsiveValue<BorderWidth \| undefined>` | No | `-` | - |
266
+ | `borderRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000 \| ResponsiveValue<BorderRadius \| undefined>` | No | `-` | - |
267
+ | `borderStartWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| ResponsiveValue<BorderWidth \| undefined>` | No | `-` | - |
268
+ | `borderTopLeftRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000 \| ResponsiveValue<BorderRadius \| undefined>` | No | `-` | - |
269
+ | `borderTopRightRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000 \| ResponsiveValue<BorderRadius \| undefined>` | No | `-` | - |
270
+ | `borderTopWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| ResponsiveValue<BorderWidth \| undefined>` | No | `-` | - |
271
+ | `borderWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| ResponsiveValue<BorderWidth \| undefined>` | No | `-` | - |
272
272
  | `bordered` | `boolean` | No | `-` | Add a border around all sides of the box. |
273
273
  | `borderedBottom` | `boolean` | No | `-` | Add a border to the bottom side of the box. |
274
274
  | `borderedEnd` | `boolean` | No | `-` | Add a border to the trailing side of the box. |
@@ -278,35 +278,35 @@ function Example() {
278
278
  | `borderedVertical` | `boolean` | No | `-` | Add a border to the top and bottom sides of the box. |
279
279
  | `bottom` | `ResponsiveProp<Bottom<string \| number>>` | No | `-` | - |
280
280
  | `classNames` | `{ root?: string; tab?: string \| undefined; activeIndicator?: string \| undefined; } \| undefined` | No | `-` | Custom class names for individual elements of the SegmentedTabs component |
281
- | `color` | `currentColor \| fg \| fgMuted \| fgInverse \| fgPrimary \| fgWarning \| fgPositive \| fgNegative \| bg \| bgAlternate \| bgInverse \| bgOverlay \| bgElevation1 \| bgElevation2 \| bgPrimary \| bgPrimaryWash \| bgSecondary \| bgTertiary \| bgSecondaryWash \| bgNegative \| bgNegativeWash \| bgPositive \| bgPositiveWash \| bgWarning \| bgWarningWash \| bgLine \| bgLineHeavy \| bgLineInverse \| bgLinePrimary \| bgLinePrimarySubtle \| accentSubtleRed \| accentBoldRed \| accentSubtleGreen \| accentBoldGreen \| accentSubtleBlue \| accentBoldBlue \| accentSubtlePurple \| accentBoldPurple \| accentSubtleYellow \| accentBoldYellow \| accentSubtleGray \| accentBoldGray \| transparent` | No | `-` | - |
282
- | `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
281
+ | `color` | `currentColor \| fg \| fgMuted \| fgInverse \| fgPrimary \| fgWarning \| fgPositive \| fgNegative \| bg \| bgAlternate \| bgInverse \| bgOverlay \| bgElevation1 \| bgElevation2 \| bgPrimary \| bgPrimaryWash \| bgSecondary \| bgTertiary \| bgSecondaryWash \| bgNegative \| bgNegativeWash \| bgPositive \| bgPositiveWash \| bgWarning \| bgWarningWash \| bgLine \| bgLineHeavy \| bgLineInverse \| bgLinePrimary \| bgLinePrimarySubtle \| accentSubtleRed \| accentBoldRed \| accentSubtleGreen \| accentBoldGreen \| accentSubtleBlue \| accentBoldBlue \| accentSubtlePurple \| accentBoldPurple \| accentSubtleYellow \| accentBoldYellow \| accentSubtleGray \| accentBoldGray \| transparent \| ResponsiveValue<Color \| undefined>` | No | `-` | - |
282
+ | `columnGap` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
283
283
  | `dangerouslySetBackground` | `string` | No | `-` | - |
284
284
  | `disabled` | `boolean` | No | `-` | Disable interactions on all the tabs. |
285
285
  | `display` | `ResponsiveProp<grid \| revert \| none \| block \| inline \| inline-block \| flex \| inline-flex \| inline-grid \| contents \| flow-root \| list-item>` | No | `-` | - |
286
- | `elevation` | `0 \| 1 \| 2` | No | `-` | - |
286
+ | `elevation` | `0 \| 1 \| 2 \| ResponsiveValue<Elevation \| undefined>` | No | `-` | - |
287
287
  | `flexBasis` | `ResponsiveProp<FlexBasis<string \| number>>` | No | `-` | - |
288
288
  | `flexDirection` | `ResponsiveProp<column \| row \| row-reverse \| column-reverse>` | No | `-` | - |
289
- | `flexGrow` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
290
- | `flexShrink` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
289
+ | `flexGrow` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| ResponsiveValue<FlexGrow \| undefined>` | No | `-` | - |
290
+ | `flexShrink` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| ResponsiveValue<FlexShrink \| undefined>` | No | `-` | - |
291
291
  | `flexWrap` | `ResponsiveProp<nowrap \| wrap \| wrap-reverse>` | No | `-` | - |
292
292
  | `font` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
293
293
  | `fontFamily` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
294
294
  | `fontSize` | `ResponsiveProp<FontSize \| inherit>` | No | `-` | - |
295
295
  | `fontWeight` | `ResponsiveProp<FontWeight \| inherit>` | No | `-` | - |
296
- | `gap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
297
- | `grid` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
298
- | `gridArea` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
296
+ | `gap` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
297
+ | `grid` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| none \| ResponsiveValue<Grid \| undefined>` | No | `-` | - |
298
+ | `gridArea` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto \| ResponsiveValue<GridArea \| undefined>` | No | `-` | - |
299
299
  | `gridAutoColumns` | `ResponsiveProp<GridAutoColumns<string \| number>>` | No | `-` | - |
300
- | `gridAutoFlow` | `inherit \| revert \| row \| column \| -moz-initial \| initial \| revert-layer \| unset \| dense` | No | `-` | - |
300
+ | `gridAutoFlow` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| column \| dense \| row \| ResponsiveValue<GridAutoFlow \| undefined>` | No | `-` | - |
301
301
  | `gridAutoRows` | `ResponsiveProp<GridAutoRows<string \| number>>` | No | `-` | - |
302
- | `gridColumn` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
303
- | `gridColumnEnd` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
304
- | `gridColumnStart` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
305
- | `gridRow` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
306
- | `gridRowEnd` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
307
- | `gridRowStart` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
308
- | `gridTemplate` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
309
- | `gridTemplateAreas` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
302
+ | `gridColumn` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto \| ResponsiveValue<GridColumn \| undefined>` | No | `-` | - |
303
+ | `gridColumnEnd` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto \| ResponsiveValue<GridColumnEnd \| undefined>` | No | `-` | - |
304
+ | `gridColumnStart` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto \| ResponsiveValue<GridColumnStart \| undefined>` | No | `-` | - |
305
+ | `gridRow` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto \| ResponsiveValue<GridRow \| undefined>` | No | `-` | - |
306
+ | `gridRowEnd` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto \| ResponsiveValue<GridRowEnd \| undefined>` | No | `-` | - |
307
+ | `gridRowStart` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto \| ResponsiveValue<GridRowStart \| undefined>` | No | `-` | - |
308
+ | `gridTemplate` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| none \| ResponsiveValue<GridTemplate \| undefined>` | No | `-` | - |
309
+ | `gridTemplateAreas` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| none \| ResponsiveValue<GridTemplateAreas \| undefined>` | No | `-` | - |
310
310
  | `gridTemplateColumns` | `ResponsiveProp<GridTemplateColumns<string \| number>>` | No | `-` | - |
311
311
  | `gridTemplateRows` | `ResponsiveProp<GridTemplateRows<string \| number>>` | No | `-` | - |
312
312
  | `height` | `ResponsiveProp<Height<string \| number>>` | No | `-` | - |
@@ -314,32 +314,32 @@ function Example() {
314
314
  | `key` | `Key \| null` | No | `-` | - |
315
315
  | `left` | `ResponsiveProp<Left<string \| number>>` | No | `-` | - |
316
316
  | `lineHeight` | `ResponsiveProp<LineHeight \| inherit>` | No | `-` | - |
317
- | `margin` | `ResponsiveProp<0 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
318
- | `marginBottom` | `ResponsiveProp<0 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
319
- | `marginEnd` | `ResponsiveProp<0 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
320
- | `marginStart` | `ResponsiveProp<0 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
321
- | `marginTop` | `ResponsiveProp<0 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
322
- | `marginX` | `ResponsiveProp<0 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
323
- | `marginY` | `ResponsiveProp<0 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
317
+ | `margin` | `ResponsiveProp<0 \| -1 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
318
+ | `marginBottom` | `ResponsiveProp<0 \| -1 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
319
+ | `marginEnd` | `ResponsiveProp<0 \| -1 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
320
+ | `marginStart` | `ResponsiveProp<0 \| -1 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
321
+ | `marginTop` | `ResponsiveProp<0 \| -1 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
322
+ | `marginX` | `ResponsiveProp<0 \| -1 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
323
+ | `marginY` | `ResponsiveProp<0 \| -1 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
324
324
  | `maxHeight` | `ResponsiveProp<MaxHeight<string \| number>>` | No | `-` | - |
325
325
  | `maxWidth` | `ResponsiveProp<MaxWidth<string \| number>>` | No | `-` | - |
326
326
  | `minHeight` | `ResponsiveProp<MinHeight<string \| number>>` | No | `-` | - |
327
327
  | `minWidth` | `ResponsiveProp<MinWidth<string \| number>>` | No | `-` | - |
328
328
  | `onActiveTabElementChange` | `((element: HTMLElement \| null) => void)` | No | `-` | Optional callback to receive the active tab element. |
329
- | `opacity` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
329
+ | `opacity` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| ResponsiveValue<Opacity \| undefined>` | No | `-` | - |
330
330
  | `overflow` | `ResponsiveProp<hidden \| auto \| visible \| clip \| scroll>` | No | `-` | - |
331
- | `padding` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
332
- | `paddingBottom` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
333
- | `paddingEnd` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
334
- | `paddingStart` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
335
- | `paddingTop` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
336
- | `paddingX` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
337
- | `paddingY` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
331
+ | `padding` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
332
+ | `paddingBottom` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
333
+ | `paddingEnd` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
334
+ | `paddingStart` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
335
+ | `paddingTop` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
336
+ | `paddingX` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
337
+ | `paddingY` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
338
338
  | `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
339
339
  | `position` | `ResponsiveProp<fixed \| static \| relative \| absolute \| sticky>` | No | `-` | - |
340
- | `ref` | `null \| (instance: HTMLElement \| null) => void \| MutableRefObject<HTMLElement \| null>` | No | `-` | - |
340
+ | `ref` | `null \| (instance: HTMLElement \| null) => void \| RefObject<HTMLElement \| null>` | No | `-` | - |
341
341
  | `right` | `ResponsiveProp<Right<string \| number>>` | No | `-` | - |
342
- | `rowGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
342
+ | `rowGap` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
343
343
  | `style` | `CSSProperties` | No | `-` | - |
344
344
  | `styles` | `{ root?: CSSProperties; tab?: CSSProperties \| undefined; activeIndicator?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for individual elements of the SegmentedTabs component |
345
345
  | `testID` | `string` | No | `-` | Used to locate this element in unit and end-to-end tests. Under the hood, testID translates to data-testid on Web. On Mobile, testID stays the same - testID |
@@ -347,11 +347,11 @@ function Example() {
347
347
  | `textDecoration` | `ResponsiveProp<none \| underline \| overline \| line-through \| underline overline \| underline double>` | No | `-` | - |
348
348
  | `textTransform` | `ResponsiveProp<capitalize \| lowercase \| none \| uppercase>` | No | `-` | - |
349
349
  | `top` | `ResponsiveProp<Top<string \| number>>` | No | `-` | - |
350
- | `transform` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
350
+ | `transform` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| none \| ResponsiveValue<Transform \| undefined>` | No | `-` | - |
351
351
  | `userSelect` | `ResponsiveProp<text \| none \| auto \| all>` | No | `-` | - |
352
352
  | `visibility` | `ResponsiveProp<hidden \| visible>` | No | `-` | - |
353
353
  | `width` | `ResponsiveProp<Width<string \| number>>` | No | `-` | - |
354
- | `zIndex` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
354
+ | `zIndex` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto \| ResponsiveValue<ZIndex \| undefined>` | No | `-` | - |
355
355
 
356
356
 
357
357
  ## Styles
@@ -210,10 +210,10 @@ When using the `inside` label variant, you should always include a `placeholder`
210
210
  | `options` | `Record<RadioValue, ReactNode>` | Yes | `-` | Multiple choice options for the radio group. The object key represents the radio input value and the object value represents the radio option label. |
211
211
  | `controlColor` | `currentColor \| fg \| fgMuted \| fgInverse \| fgPrimary \| fgWarning \| fgPositive \| fgNegative \| bg \| bgAlternate \| bgInverse \| bgOverlay \| bgElevation1 \| bgElevation2 \| bgPrimary \| bgPrimaryWash \| bgSecondary \| bgTertiary \| bgSecondaryWash \| bgNegative \| bgNegativeWash \| bgPositive \| bgPositiveWash \| bgWarning \| bgWarningWash \| bgLine \| bgLineHeavy \| bgLineInverse \| bgLinePrimary \| bgLinePrimarySubtle \| accentSubtleRed \| accentBoldRed \| accentSubtleGreen \| accentBoldGreen \| accentSubtleBlue \| accentBoldBlue \| accentSubtlePurple \| accentBoldPurple \| accentSubtleYellow \| accentBoldYellow \| accentSubtleGray \| accentBoldGray \| transparent` | No | `bgPrimary` | Sets the checked/active color of each control in the group. |
212
212
  | `direction` | `horizontal \| vertical` | No | `vertical` | Direction a group of components should flow. |
213
- | `gap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | Gap to insert between siblings. |
214
- | `label` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Set a label summary for the group of radios. |
213
+ | `gap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | Gap to insert between siblings. |
214
+ | `label` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Set a label summary for the group of radios. |
215
215
  | `onChange` | `((value: RadioValue) => void)` | No | `-` | Handle change event when pressing on a radio option. |
216
- | `ref` | `null \| (instance: HTMLInputElement \| null) => void \| RefObject<HTMLInputElement>` | No | `-` | - |
216
+ | `ref` | `null \| (instance: HTMLInputElement \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<HTMLInputElement \| null>` | No | `-` | - |
217
217
  | `testID` | `string` | No | `-` | Used to locate this element in unit and end-to-end tests. Under the hood, testID translates to data-testid on Web. On Mobile, testID stays the same - testID |
218
218
  | `value` | `string` | No | `-` | Currently selected value. |
219
219
 
@@ -1415,23 +1415,23 @@ function CustomComponentExamples() {
1415
1415
  | `disableClickOutsideClose` | `boolean` | No | `-` | Whether clicking outside the dropdown should close it |
1416
1416
  | `disabled` | `boolean` | No | `false` | Toggles input interactability and opacity |
1417
1417
  | `emptyOptionsLabel` | `string` | No | `-` | Label displayed when there are no options available |
1418
- | `end` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | End-aligned content (e.g., value, status). Replaces the deprecated detail prop. |
1419
- | `endNode` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Adds content to the end of the inner input. Refer to diagram for location of endNode in InputStack component |
1418
+ | `end` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | End-aligned content (e.g., value, status). Replaces the deprecated detail prop. |
1419
+ | `endNode` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Adds content to the end of the inner input. Refer to diagram for location of endNode in InputStack component |
1420
1420
  | `font` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
1421
- | `helperText` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Helper text displayed below the select |
1421
+ | `helperText` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Helper text displayed below the select |
1422
1422
  | `hiddenSelectedOptionsLabel` | `string` | No | `-` | Label to show for showcasing count of hidden selected options |
1423
1423
  | `hideSelectAll` | `boolean` | No | `-` | Whether to hide the Select All option in multi-select mode |
1424
- | `label` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Label displayed above the control |
1424
+ | `label` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Label displayed above the control |
1425
1425
  | `labelVariant` | `inside \| outside` | No | `'outside'` | The variant of the label. Only used when compact is not true. |
1426
1426
  | `maxSelectedOptionsToShow` | `number` | No | `-` | Maximum number of selected options to show before truncating |
1427
- | `media` | `ReactElement` | No | `-` | Media rendered at the start of the cell (icon, avatar, image, etc). |
1427
+ | `media` | `ReactElement<unknown, string \| JSXElementConstructor<any>>` | No | `-` | Media rendered at the start of the cell (icon, avatar, image, etc). |
1428
1428
  | `open` | `boolean` | No | `-` | Controlled open state of the dropdown |
1429
- | `placeholder` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Placeholder text displayed when no option is selected |
1430
- | `ref` | `null \| (instance: SelectRef \| null) => void \| RefObject<SelectRef>` | No | `-` | - |
1429
+ | `placeholder` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Placeholder text displayed when no option is selected |
1430
+ | `ref` | `null \| (instance: SelectRef \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<SelectRef \| null>` | No | `-` | - |
1431
1431
  | `removeSelectedOptionAccessibilityLabel` | `string` | No | `-` | Accessibility label for each chip in a multi-select |
1432
1432
  | `selectAllLabel` | `string` | No | `-` | Label for the Select All option in multi-select mode |
1433
1433
  | `setOpen` | `((open: boolean \| ((open: boolean) => boolean)) => void)` | No | `-` | Callback to update the open state |
1434
- | `startNode` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Adds content to the start of the inner input. Refer to diagram for location of startNode in InputStack component |
1434
+ | `startNode` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Adds content to the start of the inner input. Refer to diagram for location of startNode in InputStack component |
1435
1435
  | `style` | `CSSProperties` | No | `-` | Inline styles for the root element |
1436
1436
  | `styles` | `{ root?: CSSProperties; control?: CSSProperties \| undefined; controlStartNode?: CSSProperties \| undefined; controlInputNode?: CSSProperties \| undefined; controlValueNode?: CSSProperties \| undefined; controlLabelNode?: CSSProperties \| undefined; controlHelperTextNode?: CSSProperties \| undefined; controlEndNode?: CSSProperties \| undefined; controlBlendStyles?: InteractableBlendStyles \| undefined; dropdown?: CSSProperties \| undefined; option?: CSSProperties \| undefined; optionCell?: CSSProperties \| undefined; optionContent?: CSSProperties \| undefined; optionLabel?: CSSProperties \| undefined; optionDescription?: CSSProperties \| undefined; optionBlendStyles?: InteractableBlendStyles \| undefined; selectAllDivider?: CSSProperties \| undefined; emptyContentsContainer?: CSSProperties \| undefined; emptyContentsText?: CSSProperties \| undefined; optionGroup?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for individual elements of the Select component |
1437
1437
  | `testID` | `string` | No | `-` | Test ID for the root element |
@@ -184,27 +184,27 @@ function SelectChipExample() {
184
184
 
185
185
  | Prop | Type | Required | Default | Description |
186
186
  | --- | --- | --- | --- | --- |
187
- | `content` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | Yes | `-` | - |
187
+ | `content` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | Yes | `-` | - |
188
188
  | `active` | `boolean` | No | `-` | Indicates that the control is being used to manipulate data elsewhere |
189
189
  | `alignContent` | `ResponsiveProp<center \| normal \| start \| end \| flex-start \| flex-end \| stretch \| baseline \| first baseline \| last baseline \| space-between \| space-around \| space-evenly>` | No | `-` | - |
190
190
  | `alignItems` | `ResponsiveProp<center \| normal \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
191
191
  | `alignSelf` | `ResponsiveProp<center \| normal \| auto \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
192
192
  | `as` | `button` | No | `-` | The underlying element or component the polymorphic component will render. Changing as also changes the inherited native props (e.g. href for as=a) and the expected ref type. |
193
- | `aspectRatio` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
193
+ | `aspectRatio` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto \| ResponsiveValue<AspectRatio \| undefined>` | No | `-` | - |
194
194
  | `background` | `currentColor \| fg \| fgMuted \| fgInverse \| fgPrimary \| fgWarning \| fgPositive \| fgNegative \| bg \| bgAlternate \| bgInverse \| bgOverlay \| bgElevation1 \| bgElevation2 \| bgPrimary \| bgPrimaryWash \| bgSecondary \| bgTertiary \| bgSecondaryWash \| bgNegative \| bgNegativeWash \| bgPositive \| bgPositiveWash \| bgWarning \| bgWarningWash \| bgLine \| bgLineHeavy \| bgLineInverse \| bgLinePrimary \| bgLinePrimarySubtle \| accentSubtleRed \| accentBoldRed \| accentSubtleGreen \| accentBoldGreen \| accentSubtleBlue \| accentBoldBlue \| accentSubtlePurple \| accentBoldPurple \| accentSubtleYellow \| accentBoldYellow \| accentSubtleGray \| accentBoldGray \| transparent` | No | `-` | Background color of the overlay (element being interacted with). |
195
195
  | `blendStyles` | `InteractableBlendStyles` | No | `-` | - |
196
196
  | `block` | `boolean` | No | `-` | Set element to block and expand to 100% width. Makes the Popover Subject fill the width of the parent container |
197
- | `borderBottomLeftRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
198
- | `borderBottomRightRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
199
- | `borderBottomWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500` | No | `-` | - |
200
- | `borderColor` | `currentColor \| fg \| fgMuted \| fgInverse \| fgPrimary \| fgWarning \| fgPositive \| fgNegative \| bg \| bgAlternate \| bgInverse \| bgOverlay \| bgElevation1 \| bgElevation2 \| bgPrimary \| bgPrimaryWash \| bgSecondary \| bgTertiary \| bgSecondaryWash \| bgNegative \| bgNegativeWash \| bgPositive \| bgPositiveWash \| bgWarning \| bgWarningWash \| bgLine \| bgLineHeavy \| bgLineInverse \| bgLinePrimary \| bgLinePrimarySubtle \| accentSubtleRed \| accentBoldRed \| accentSubtleGreen \| accentBoldGreen \| accentSubtleBlue \| accentBoldBlue \| accentSubtlePurple \| accentBoldPurple \| accentSubtleYellow \| accentBoldYellow \| accentSubtleGray \| accentBoldGray \| transparent` | No | `-` | Border color of the element. |
201
- | `borderEndWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500` | No | `-` | - |
202
- | `borderRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
203
- | `borderStartWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500` | No | `-` | - |
204
- | `borderTopLeftRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
205
- | `borderTopRightRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
206
- | `borderTopWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500` | No | `-` | - |
207
- | `borderWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500` | No | `-` | - |
197
+ | `borderBottomLeftRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000 \| ResponsiveValue<BorderRadius \| undefined>` | No | `-` | - |
198
+ | `borderBottomRightRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000 \| ResponsiveValue<BorderRadius \| undefined>` | No | `-` | - |
199
+ | `borderBottomWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| ResponsiveValue<BorderWidth \| undefined>` | No | `-` | - |
200
+ | `borderColor` | `currentColor \| fg \| fgMuted \| fgInverse \| fgPrimary \| fgWarning \| fgPositive \| fgNegative \| bg \| bgAlternate \| bgInverse \| bgOverlay \| bgElevation1 \| bgElevation2 \| bgPrimary \| bgPrimaryWash \| bgSecondary \| bgTertiary \| bgSecondaryWash \| bgNegative \| bgNegativeWash \| bgPositive \| bgPositiveWash \| bgWarning \| bgWarningWash \| bgLine \| bgLineHeavy \| bgLineInverse \| bgLinePrimary \| bgLinePrimarySubtle \| accentSubtleRed \| accentBoldRed \| accentSubtleGreen \| accentBoldGreen \| accentSubtleBlue \| accentBoldBlue \| accentSubtlePurple \| accentBoldPurple \| accentSubtleYellow \| accentBoldYellow \| accentSubtleGray \| accentBoldGray \| transparent \| ResponsiveValue<Color \| undefined>` | No | `-` | - |
201
+ | `borderEndWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| ResponsiveValue<BorderWidth \| undefined>` | No | `-` | - |
202
+ | `borderRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000 \| ResponsiveValue<BorderRadius \| undefined>` | No | `-` | - |
203
+ | `borderStartWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| ResponsiveValue<BorderWidth \| undefined>` | No | `-` | - |
204
+ | `borderTopLeftRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000 \| ResponsiveValue<BorderRadius \| undefined>` | No | `-` | - |
205
+ | `borderTopRightRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000 \| ResponsiveValue<BorderRadius \| undefined>` | No | `-` | - |
206
+ | `borderTopWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| ResponsiveValue<BorderWidth \| undefined>` | No | `-` | - |
207
+ | `borderWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| ResponsiveValue<BorderWidth \| undefined>` | No | `-` | - |
208
208
  | `bordered` | `boolean` | No | `-` | Add a border around all sides of the box. |
209
209
  | `borderedBottom` | `boolean` | No | `-` | Add a border to the bottom side of the box. |
210
210
  | `borderedEnd` | `boolean` | No | `-` | Add a border to the trailing side of the box. |
@@ -215,8 +215,8 @@ function SelectChipExample() {
215
215
  | `bottom` | `ResponsiveProp<Bottom<string \| number>>` | No | `-` | - |
216
216
  | `className` | `string` | No | `-` | Apply class names to the outer container. |
217
217
  | `classNames` | `{ root?: string; content?: string \| undefined; } \| undefined` | No | `-` | Custom class names for individual elements of the Chip component |
218
- | `color` | `currentColor \| fg \| fgMuted \| fgInverse \| fgPrimary \| fgWarning \| fgPositive \| fgNegative \| bg \| bgAlternate \| bgInverse \| bgOverlay \| bgElevation1 \| bgElevation2 \| bgPrimary \| bgPrimaryWash \| bgSecondary \| bgTertiary \| bgSecondaryWash \| bgNegative \| bgNegativeWash \| bgPositive \| bgPositiveWash \| bgWarning \| bgWarningWash \| bgLine \| bgLineHeavy \| bgLineInverse \| bgLinePrimary \| bgLinePrimarySubtle \| accentSubtleRed \| accentBoldRed \| accentSubtleGreen \| accentBoldGreen \| accentSubtleBlue \| accentBoldBlue \| accentSubtlePurple \| accentBoldPurple \| accentSubtleYellow \| accentBoldYellow \| accentSubtleGray \| accentBoldGray \| transparent` | No | `-` | - |
219
- | `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
218
+ | `color` | `currentColor \| fg \| fgMuted \| fgInverse \| fgPrimary \| fgWarning \| fgPositive \| fgNegative \| bg \| bgAlternate \| bgInverse \| bgOverlay \| bgElevation1 \| bgElevation2 \| bgPrimary \| bgPrimaryWash \| bgSecondary \| bgTertiary \| bgSecondaryWash \| bgNegative \| bgNegativeWash \| bgPositive \| bgPositiveWash \| bgWarning \| bgWarningWash \| bgLine \| bgLineHeavy \| bgLineInverse \| bgLinePrimary \| bgLinePrimarySubtle \| accentSubtleRed \| accentBoldRed \| accentSubtleGreen \| accentBoldGreen \| accentSubtleBlue \| accentBoldBlue \| accentSubtlePurple \| accentBoldPurple \| accentSubtleYellow \| accentBoldYellow \| accentSubtleGray \| accentBoldGray \| transparent \| ResponsiveValue<Color \| undefined>` | No | `-` | - |
219
+ | `columnGap` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
220
220
  | `compact` | `boolean` | No | `-` | Reduces spacing around Chip content |
221
221
  | `contentPosition` | `PopoverContentPositionConfig` | No | `-` | Override content positioning defaults |
222
222
  | `contentStyle` | `CSSProperties` | No | `-` | - |
@@ -227,33 +227,33 @@ function SelectChipExample() {
227
227
  | `disableTypeFocus` | `boolean` | No | `-` | Use for editable Search Input components to ensure focus is correctly applied |
228
228
  | `disabled` | `boolean` | No | `-` | Is the element currently disabled. Prevents the Dropdown menu from opening. Youll need to surface disabled state on the trigger manually. |
229
229
  | `display` | `ResponsiveProp<grid \| revert \| none \| block \| inline \| inline-block \| flex \| inline-flex \| inline-grid \| contents \| flow-root \| list-item>` | No | `-` | - |
230
- | `elevation` | `0 \| 1 \| 2` | No | `-` | - |
230
+ | `elevation` | `0 \| 1 \| 2 \| ResponsiveValue<Elevation \| undefined>` | No | `-` | - |
231
231
  | `enableMobileModal` | `boolean` | No | `-` | Enable to have Dropdown render its content inside a Modal as opposed to a relatively positioned Popover Ideal for mobile or smaller devices. |
232
- | `end` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | ReactNode placed after the value |
232
+ | `end` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | ReactNode placed after the value |
233
233
  | `flexBasis` | `ResponsiveProp<FlexBasis<string \| number>>` | No | `-` | - |
234
234
  | `flexDirection` | `ResponsiveProp<column \| row \| row-reverse \| column-reverse>` | No | `-` | - |
235
- | `flexGrow` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
236
- | `flexShrink` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
235
+ | `flexGrow` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| ResponsiveValue<FlexGrow \| undefined>` | No | `-` | - |
236
+ | `flexShrink` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| ResponsiveValue<FlexShrink \| undefined>` | No | `-` | - |
237
237
  | `flexWrap` | `ResponsiveProp<nowrap \| wrap \| wrap-reverse>` | No | `-` | - |
238
238
  | `focusable` | `boolean` | No | `-` | - |
239
239
  | `font` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
240
240
  | `fontFamily` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
241
241
  | `fontSize` | `ResponsiveProp<FontSize \| inherit>` | No | `-` | - |
242
242
  | `fontWeight` | `ResponsiveProp<FontWeight \| inherit>` | No | `-` | - |
243
- | `gap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
244
- | `grid` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
245
- | `gridArea` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
243
+ | `gap` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
244
+ | `grid` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| none \| ResponsiveValue<Grid \| undefined>` | No | `-` | - |
245
+ | `gridArea` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto \| ResponsiveValue<GridArea \| undefined>` | No | `-` | - |
246
246
  | `gridAutoColumns` | `ResponsiveProp<GridAutoColumns<string \| number>>` | No | `-` | - |
247
- | `gridAutoFlow` | `inherit \| revert \| row \| column \| -moz-initial \| initial \| revert-layer \| unset \| dense` | No | `-` | - |
247
+ | `gridAutoFlow` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| column \| dense \| row \| ResponsiveValue<GridAutoFlow \| undefined>` | No | `-` | - |
248
248
  | `gridAutoRows` | `ResponsiveProp<GridAutoRows<string \| number>>` | No | `-` | - |
249
- | `gridColumn` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
250
- | `gridColumnEnd` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
251
- | `gridColumnStart` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
252
- | `gridRow` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
253
- | `gridRowEnd` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
254
- | `gridRowStart` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
255
- | `gridTemplate` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
256
- | `gridTemplateAreas` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
249
+ | `gridColumn` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto \| ResponsiveValue<GridColumn \| undefined>` | No | `-` | - |
250
+ | `gridColumnEnd` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto \| ResponsiveValue<GridColumnEnd \| undefined>` | No | `-` | - |
251
+ | `gridColumnStart` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto \| ResponsiveValue<GridColumnStart \| undefined>` | No | `-` | - |
252
+ | `gridRow` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto \| ResponsiveValue<GridRow \| undefined>` | No | `-` | - |
253
+ | `gridRowEnd` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto \| ResponsiveValue<GridRowEnd \| undefined>` | No | `-` | - |
254
+ | `gridRowStart` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto \| ResponsiveValue<GridRowStart \| undefined>` | No | `-` | - |
255
+ | `gridTemplate` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| none \| ResponsiveValue<GridTemplate \| undefined>` | No | `-` | - |
256
+ | `gridTemplateAreas` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| none \| ResponsiveValue<GridTemplateAreas \| undefined>` | No | `-` | - |
257
257
  | `gridTemplateColumns` | `ResponsiveProp<GridTemplateColumns<string \| number>>` | No | `-` | - |
258
258
  | `gridTemplateRows` | `ResponsiveProp<GridTemplateRows<string \| number>>` | No | `-` | - |
259
259
  | `height` | `ResponsiveProp<Height<string \| number>>` | No | `-` | - |
@@ -262,42 +262,42 @@ function SelectChipExample() {
262
262
  | `key` | `Key \| null` | No | `-` | - |
263
263
  | `left` | `ResponsiveProp<Left<string \| number>>` | No | `-` | - |
264
264
  | `lineHeight` | `ResponsiveProp<LineHeight \| inherit>` | No | `-` | - |
265
- | `margin` | `ResponsiveProp<0 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
266
- | `marginBottom` | `ResponsiveProp<0 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
267
- | `marginEnd` | `ResponsiveProp<0 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
268
- | `marginStart` | `ResponsiveProp<0 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
269
- | `marginTop` | `ResponsiveProp<0 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
270
- | `marginX` | `ResponsiveProp<0 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
271
- | `marginY` | `ResponsiveProp<0 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
272
- | `maxHeight` | `((MaxHeight<string \| number> \| { base?: MaxHeight<string \| number>; phone?: MaxHeight<string \| number> \| undefined; tablet?: MaxHeight<string \| number> \| undefined; desktop?: MaxHeight<string \| number> \| undefined; }) & MaxHeight<string \| number>) \| undefined` | No | `300` | Can optionally pass a maxHeight. |
273
- | `maxWidth` | `((MaxWidth<string \| number> \| { base?: MaxWidth<string \| number>; phone?: MaxWidth<string \| number> \| undefined; tablet?: MaxWidth<string \| number> \| undefined; desktop?: MaxWidth<string \| number> \| undefined; }) & MaxWidth<string \| number>) \| undefined` | No | `200` | If text content overflows, it will get truncated with an ellipsis. Maximum width of input as a percentage string or number converted to pixels. |
265
+ | `margin` | `ResponsiveProp<0 \| -1 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
266
+ | `marginBottom` | `ResponsiveProp<0 \| -1 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
267
+ | `marginEnd` | `ResponsiveProp<0 \| -1 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
268
+ | `marginStart` | `ResponsiveProp<0 \| -1 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
269
+ | `marginTop` | `ResponsiveProp<0 \| -1 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
270
+ | `marginX` | `ResponsiveProp<0 \| -1 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
271
+ | `marginY` | `ResponsiveProp<0 \| -1 \| -5 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -2 \| -3 \| -4 \| -6 \| -7 \| -8 \| -9>` | No | `-` | - |
272
+ | `maxHeight` | `((MaxHeight<string \| number> \| ResponsiveValue<MaxHeight<string \| number>>) & MaxHeight<string \| number>) \| undefined` | No | `300` | Can optionally pass a maxHeight. |
273
+ | `maxWidth` | `((MaxWidth<string \| number> \| ResponsiveValue<MaxWidth<string \| number>>) & MaxWidth<string \| number>) \| undefined` | No | `200` | If text content overflows, it will get truncated with an ellipsis. Maximum width of input as a percentage string or number converted to pixels. |
274
274
  | `minHeight` | `ResponsiveProp<MinHeight<string \| number>>` | No | `-` | - |
275
- | `minWidth` | `((MinWidth<string \| number> \| { base?: MinWidth<string \| number>; phone?: MinWidth<string \| number> \| undefined; tablet?: MinWidth<string \| number> \| undefined; desktop?: MinWidth<string \| number> \| undefined; }) & MinWidth<string \| number>) \| undefined` | No | `-` | Minimum width of input as a percentage string or number converted to pixels. |
275
+ | `minWidth` | `((MinWidth<string \| number> \| ResponsiveValue<MinWidth<string \| number>>) & MinWidth<string \| number>) \| undefined` | No | `-` | Minimum width of input as a percentage string or number converted to pixels. |
276
276
  | `numberOfLines` | `number` | No | `1` | How many lines the text in the chip will be broken into. |
277
277
  | `onBlur` | `(() => void)` | No | `-` | Callback that fires when Dropdown or trigger are blurred |
278
278
  | `onChange` | `((newValue: string) => void) \| Dispatch<SetStateAction<string>>` | No | `-` | Callback that is fired whenever a select option is selected |
279
279
  | `onCloseMenu` | `(() => void)` | No | `-` | Callback that fires when Dropdown is closed |
280
280
  | `onOpenMenu` | `(() => void)` | No | `-` | Callback that fires when Dropdown is opened |
281
- | `opacity` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
281
+ | `opacity` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| ResponsiveValue<Opacity \| undefined>` | No | `-` | - |
282
282
  | `overflow` | `ResponsiveProp<hidden \| auto \| visible \| clip \| scroll>` | No | `-` | - |
283
- | `padding` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
284
- | `paddingBottom` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
285
- | `paddingEnd` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
286
- | `paddingStart` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
287
- | `paddingTop` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
288
- | `paddingX` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
289
- | `paddingY` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
283
+ | `padding` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
284
+ | `paddingBottom` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
285
+ | `paddingEnd` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
286
+ | `paddingStart` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
287
+ | `paddingTop` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
288
+ | `paddingX` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
289
+ | `paddingY` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
290
290
  | `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
291
291
  | `placeholder` | `string` | No | `-` | Placeholder text displayed inside of the input. Will be replaced if there is a value. |
292
292
  | `position` | `ResponsiveProp<fixed \| static \| relative \| absolute \| sticky>` | No | `-` | - |
293
293
  | `pressed` | `boolean` | No | `-` | Is the element being pressed. Primarily a mobile feature, but can be used on the web. |
294
- | `ref` | `((instance: unknown) => void) \| RefObject<unknown> \| null` | No | `-` | - |
294
+ | `ref` | `null \| RefObject<HTMLButtonElement \| null> \| (instance: HTMLButtonElement \| null) => void \| (() => VoidOrUndefinedOnly)` | No | `-` | Allows getting a ref to the component instance. Once the component unmounts, React will set ref.current to null (or call the ref with null if you passed a callback ref). |
295
295
  | `respectNegativeTabIndex` | `boolean` | No | `-` | If true, the focus trap will respect negative tabIndex values, removing them from the list of focusable elements. |
296
296
  | `restoreFocusOnUnmount` | `boolean` | No | `true` | If true, the focus trap will restore focus to the previously focused element when it unmounts. WARNING: If you disable this, you need to ensure that focus is restored properly so it doesnt end up on the body |
297
297
  | `right` | `ResponsiveProp<Right<string \| number>>` | No | `-` | - |
298
- | `rowGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
298
+ | `rowGap` | `0 \| 1 \| 5 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 2 \| 3 \| 4 \| 6 \| 7 \| 8 \| 9 \| ResponsiveValue<Space \| undefined>` | No | `-` | - |
299
299
  | `showOverlay` | `boolean` | No | `-` | Display an overlay over all content below the Popover menu |
300
- | `start` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | ReactNode placed before the value |
300
+ | `start` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | ReactNode placed before the value |
301
301
  | `style` | `CSSProperties` | No | `-` | - |
302
302
  | `styles` | `{ root?: CSSProperties; content?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for individual elements of the Chip component |
303
303
  | `testID` | `string` | No | `-` | Used to locate this element in unit and end-to-end tests. Under the hood, testID translates to data-testid on Web. On Mobile, testID stays the same - testID |
@@ -305,7 +305,7 @@ function SelectChipExample() {
305
305
  | `textDecoration` | `ResponsiveProp<none \| underline \| overline \| line-through \| underline overline \| underline double>` | No | `-` | - |
306
306
  | `textTransform` | `ResponsiveProp<capitalize \| lowercase \| none \| uppercase>` | No | `-` | - |
307
307
  | `top` | `ResponsiveProp<Top<string \| number>>` | No | `-` | - |
308
- | `transform` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
308
+ | `transform` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| none \| ResponsiveValue<Transform \| undefined>` | No | `-` | - |
309
309
  | `transparentWhileInactive` | `boolean` | No | `-` | Mark the background and border as transparent until the element is interacted with (hovered, pressed, etc). Must be used in conjunction with the pressed prop |
310
310
  | `transparentWhilePressed` | `boolean` | No | `-` | Mark the background and border as transparent even while element is interacted with (elevation underlay issue). Must be used in conjunction with the pressed prop |
311
311
  | `type` | `button \| reset \| submit` | No | `-` | - |
@@ -313,7 +313,7 @@ function SelectChipExample() {
313
313
  | `value` | `string` | No | `-` | Pass a value that will prepopulate the select input. This will replace the placeholder text. Default selected value, or preselected value |
314
314
  | `valueLabel` | `string` | No | `-` | Optional label for selected value when using a value/label object model |
315
315
  | `visibility` | `ResponsiveProp<hidden \| visible>` | No | `-` | - |
316
- | `width` | `((Width<string \| number> \| { base?: Width<string \| number>; phone?: Width<string \| number> \| undefined; tablet?: Width<string \| number> \| undefined; desktop?: Width<string \| number> \| undefined; }) & Width<string \| number>) \| undefined` | No | `100%` | Width of input as a percentage string or number converted to pixels. |
317
- | `zIndex` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
316
+ | `width` | `((Width<string \| number> \| ResponsiveValue<Width<string \| number>>) & Width<string \| number>) \| undefined` | No | `100%` | Width of input as a percentage string or number converted to pixels. |
317
+ | `zIndex` | `-moz-initial \| inherit \| initial \| revert \| revert-layer \| unset \| auto \| ResponsiveValue<ZIndex \| undefined>` | No | `-` | - |
318
318
 
319
319
 
@@ -503,26 +503,26 @@ function ExampleDisabled() {
503
503
  | `defaultOpen` | `boolean` | No | `-` | Initial open state when component mounts (uncontrolled mode) |
504
504
  | `disableClickOutsideClose` | `boolean` | No | `-` | Whether clicking outside the dropdown should close it |
505
505
  | `disabled` | `boolean` | No | `false` | Toggles input interactability and opacity |
506
- | `displayValue` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Override the displayed value in the chip control. Useful for avoiding truncation, especially in multi-select scenarios where multiple option labels might be too long to display. When provided, this value takes precedence over the default label generation. |
506
+ | `displayValue` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Override the displayed value in the chip control. Useful for avoiding truncation, especially in multi-select scenarios where multiple option labels might be too long to display. When provided, this value takes precedence over the default label generation. |
507
507
  | `emptyOptionsLabel` | `string` | No | `-` | Label displayed when there are no options available |
508
- | `end` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | End-aligned content (e.g., value, status). Replaces the deprecated detail prop. |
509
- | `endNode` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Adds content to the end of the inner input. Refer to diagram for location of endNode in InputStack component |
508
+ | `end` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | End-aligned content (e.g., value, status). Replaces the deprecated detail prop. |
509
+ | `endNode` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Adds content to the end of the inner input. Refer to diagram for location of endNode in InputStack component |
510
510
  | `font` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
511
511
  | `hiddenSelectedOptionsLabel` | `string` | No | `-` | Label to show for showcasing count of hidden selected options |
512
512
  | `hideSelectAll` | `boolean` | No | `-` | Whether to hide the Select All option in multi-select mode |
513
513
  | `invertColorScheme` | `boolean` | No | `false` | Invert the foreground and background colors to emphasize the Chip. Depending on your theme, it may be dangerous to use this prop in conjunction with transparentWhileInactive. |
514
- | `label` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Label displayed above the control |
514
+ | `label` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Label displayed above the control |
515
515
  | `maxSelectedOptionsToShow` | `number` | No | `-` | Maximum number of selected options to show before truncating |
516
516
  | `maxWidth` | `ResponsiveProp<MaxWidth<string \| number>>` | No | `200` | If text content overflows, it will get truncated with an ellipsis. |
517
- | `media` | `ReactElement` | No | `-` | Media rendered at the start of the cell (icon, avatar, image, etc). |
517
+ | `media` | `ReactElement<unknown, string \| JSXElementConstructor<any>>` | No | `-` | Media rendered at the start of the cell (icon, avatar, image, etc). |
518
518
  | `numberOfLines` | `number` | No | `1` | How many lines the text in the chip will be broken into. |
519
519
  | `open` | `boolean` | No | `-` | Controlled open state of the dropdown |
520
- | `placeholder` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Placeholder text displayed when no option is selected |
521
- | `ref` | `null \| (instance: SelectRef \| null) => void \| RefObject<SelectRef>` | No | `-` | - |
520
+ | `placeholder` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Placeholder text displayed when no option is selected |
521
+ | `ref` | `null \| (instance: SelectRef \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<SelectRef \| null>` | No | `-` | - |
522
522
  | `removeSelectedOptionAccessibilityLabel` | `string` | No | `-` | Accessibility label for each chip in a multi-select |
523
523
  | `selectAllLabel` | `string` | No | `-` | Label for the Select All option in multi-select mode |
524
524
  | `setOpen` | `((open: boolean \| ((open: boolean) => boolean)) => void)` | No | `-` | Callback to update the open state |
525
- | `startNode` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Adds content to the start of the inner input. Refer to diagram for location of startNode in InputStack component |
525
+ | `startNode` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Adds content to the start of the inner input. Refer to diagram for location of startNode in InputStack component |
526
526
  | `style` | `CSSProperties` | No | `-` | Inline styles for the root element |
527
527
  | `styles` | `{ root?: CSSProperties; control?: CSSProperties \| undefined; controlStartNode?: CSSProperties \| undefined; controlInputNode?: CSSProperties \| undefined; controlValueNode?: CSSProperties \| undefined; controlLabelNode?: CSSProperties \| undefined; controlHelperTextNode?: CSSProperties \| undefined; controlEndNode?: CSSProperties \| undefined; controlBlendStyles?: InteractableBlendStyles \| undefined; dropdown?: CSSProperties \| undefined; option?: CSSProperties \| undefined; optionCell?: CSSProperties \| undefined; optionContent?: CSSProperties \| undefined; optionLabel?: CSSProperties \| undefined; optionDescription?: CSSProperties \| undefined; optionBlendStyles?: InteractableBlendStyles \| undefined; selectAllDivider?: CSSProperties \| undefined; emptyContentsContainer?: CSSProperties \| undefined; emptyContentsText?: CSSProperties \| undefined; optionGroup?: CSSProperties \| undefined; } \| undefined` | No | `-` | Custom styles for individual elements of the Select component |
528
528
  | `testID` | `string` | No | `-` | Test ID for the root element |