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

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 (261) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/mcp-docs/mobile/components/AccordionItem.txt +4 -4
  3. package/mcp-docs/mobile/components/Alert.txt +3 -2
  4. package/mcp-docs/mobile/components/AreaChart.txt +42 -42
  5. package/mcp-docs/mobile/components/Avatar.txt +35 -35
  6. package/mcp-docs/mobile/components/AvatarButton.txt +37 -37
  7. package/mcp-docs/mobile/components/Banner.txt +57 -42
  8. package/mcp-docs/mobile/components/BarChart.txt +42 -42
  9. package/mcp-docs/mobile/components/Box.txt +36 -36
  10. package/mcp-docs/mobile/components/BrowserBar.txt +37 -37
  11. package/mcp-docs/mobile/components/Button.txt +54 -44
  12. package/mcp-docs/mobile/components/Calendar.txt +36 -36
  13. package/mcp-docs/mobile/components/Carousel.txt +50 -60
  14. package/mcp-docs/mobile/components/CartesianChart.txt +42 -42
  15. package/mcp-docs/mobile/components/CellMedia.txt +2 -2
  16. package/mcp-docs/mobile/components/Checkbox.txt +3 -3
  17. package/mcp-docs/mobile/components/CheckboxCell.txt +39 -39
  18. package/mcp-docs/mobile/components/CheckboxGroup.txt +4 -4
  19. package/mcp-docs/mobile/components/Chip.txt +41 -41
  20. package/mcp-docs/mobile/components/Coachmark.txt +41 -41
  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 +39 -39
  25. package/mcp-docs/mobile/components/ContentCardBody.txt +44 -44
  26. package/mcp-docs/mobile/components/ContentCardFooter.txt +36 -36
  27. package/mcp-docs/mobile/components/ContentCardHeader.txt +43 -43
  28. package/mcp-docs/mobile/components/ContentCell.txt +51 -51
  29. package/mcp-docs/mobile/components/ControlGroup.txt +38 -38
  30. package/mcp-docs/mobile/components/DataCard.txt +49 -49
  31. package/mcp-docs/mobile/components/DateInput.txt +27 -24
  32. package/mcp-docs/mobile/components/DatePicker.txt +27 -24
  33. package/mcp-docs/mobile/components/Divider.txt +35 -35
  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 +34 -34
  38. package/mcp-docs/mobile/components/FloatingAssetCard.txt +4 -4
  39. package/mcp-docs/mobile/components/HStack.txt +36 -36
  40. package/mcp-docs/mobile/components/HeroSquare.txt +2 -2
  41. package/mcp-docs/mobile/components/Icon.txt +3 -3
  42. package/mcp-docs/mobile/components/IconButton.txt +40 -60
  43. package/mcp-docs/mobile/components/InputChip.txt +41 -41
  44. package/mcp-docs/mobile/components/Interactable.txt +36 -36
  45. package/mcp-docs/mobile/components/Legend.txt +45 -43
  46. package/mcp-docs/mobile/components/LineChart.txt +42 -42
  47. package/mcp-docs/mobile/components/Link.txt +44 -41
  48. package/mcp-docs/mobile/components/ListCell.txt +54 -54
  49. package/mcp-docs/mobile/components/Lottie.txt +36 -36
  50. package/mcp-docs/mobile/components/LottieStatusAnimation.txt +2 -2
  51. package/mcp-docs/mobile/components/MediaCard.txt +43 -43
  52. package/mcp-docs/mobile/components/MediaChip.txt +41 -41
  53. package/mcp-docs/mobile/components/MessagingCard.txt +44 -44
  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 +35 -35
  57. package/mcp-docs/mobile/components/ModalHeader.txt +36 -36
  58. package/mcp-docs/mobile/components/MultiContentModule.txt +42 -42
  59. package/mcp-docs/mobile/components/NavigationTitle.txt +41 -39
  60. package/mcp-docs/mobile/components/NavigationTitleSelect.txt +41 -39
  61. package/mcp-docs/mobile/components/NudgeCard.txt +7 -7
  62. package/mcp-docs/mobile/components/Numpad.txt +39 -39
  63. package/mcp-docs/mobile/components/Overlay.txt +35 -35
  64. package/mcp-docs/mobile/components/PageFooter.txt +38 -32
  65. package/mcp-docs/mobile/components/PageHeader.txt +40 -34
  66. package/mcp-docs/mobile/components/PercentageBarChart.txt +42 -42
  67. package/mcp-docs/mobile/components/PeriodSelector.txt +41 -41
  68. package/mcp-docs/mobile/components/Pictogram.txt +2 -2
  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 +38 -38
  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 +39 -39
  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 +44 -42
  83. package/mcp-docs/mobile/components/Scrubber.txt +2 -2
  84. package/mcp-docs/mobile/components/SearchInput.txt +27 -24
  85. package/mcp-docs/mobile/components/SectionHeader.txt +7 -7
  86. package/mcp-docs/mobile/components/SegmentedTabs.txt +36 -36
  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 +44 -42
  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 +42 -42
  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 +2 -2
  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 +39 -38
  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 +42 -40
  106. package/mcp-docs/mobile/components/TabNavigation.txt +36 -36
  107. package/mcp-docs/mobile/components/TabbedChips.txt +36 -36
  108. package/mcp-docs/mobile/components/TabbedChipsAlpha.txt +36 -36
  109. package/mcp-docs/mobile/components/Tabs.txt +36 -36
  110. package/mcp-docs/mobile/components/Tag.txt +43 -43
  111. package/mcp-docs/mobile/components/Text.txt +54 -61
  112. package/mcp-docs/mobile/components/TextInput.txt +27 -24
  113. package/mcp-docs/mobile/components/ThemeProvider.txt +3 -1
  114. package/mcp-docs/mobile/components/Toast.txt +36 -36
  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 +36 -36
  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 +4 -3
  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 +2 -2
  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 +2 -2
  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 +54 -54
  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 +2 -2
  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 +2 -2
  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/TableCellFallback.txt +2 -2
  244. package/mcp-docs/web/components/TableRow.txt +1 -1
  245. package/mcp-docs/web/components/Tabs.txt +49 -49
  246. package/mcp-docs/web/components/Tag.txt +52 -52
  247. package/mcp-docs/web/components/Text.txt +49 -312
  248. package/mcp-docs/web/components/TextInput.txt +56 -56
  249. package/mcp-docs/web/components/ThemeProvider.txt +24 -4
  250. package/mcp-docs/web/components/TileButton.txt +49 -319
  251. package/mcp-docs/web/components/Toast.txt +51 -51
  252. package/mcp-docs/web/components/Tooltip.txt +3 -3
  253. package/mcp-docs/web/components/Tray.txt +2 -2
  254. package/mcp-docs/web/components/UpsellCard.txt +15 -14
  255. package/mcp-docs/web/components/VStack.txt +49 -312
  256. package/mcp-docs/web/components/XAxis.txt +1 -1
  257. package/mcp-docs/web/components/YAxis.txt +1 -1
  258. package/mcp-docs/web/getting-started/installation.txt +13 -5
  259. package/mcp-docs/web/hooks/useMergeRefs.txt +5 -5
  260. package/mcp-docs/web/routes.txt +1 -1
  261. package/package.json +1 -1
@@ -122,15 +122,15 @@ function Example() {
122
122
 
123
123
  | Prop | Type | Required | Default | Description |
124
124
  | --- | --- | --- | --- | --- |
125
- | `header` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | Yes | `-` | Header to display Remote Image or other content. |
126
- | `title` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | Yes | `-` | Text or ReactNode to be displayed in TextHeadline |
127
- | `children` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Children to be rendered in the card |
128
- | `description` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Content to be displayed below the title |
129
- | `maxWidth` | `string \| number` | No | `-` | - |
130
- | `minWidth` | `string \| number` | No | `-` | - |
125
+ | `header` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | Yes | `-` | Header to display Remote Image or other content. |
126
+ | `title` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | Yes | `-` | Text or ReactNode to be displayed in TextHeadline |
127
+ | `children` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Children to be rendered in the card |
128
+ | `description` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Content to be displayed below the title |
129
+ | `maxWidth` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
130
+ | `minWidth` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
131
131
  | `onPress` | `((event: GestureResponderEvent) => void) \| null` | No | `-` | Called when a single tap gesture is detected. |
132
132
  | `size` | `s \| l` | No | `'s'` | Variant for card size. Can be small or large. |
133
- | `subtitle` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Text or ReactNode to be displayed above Title |
133
+ | `subtitle` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Text or ReactNode to be displayed above Title |
134
134
  | `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 |
135
135
 
136
136
 
@@ -140,7 +140,7 @@ function Example() {
140
140
 
141
141
  ### With Background
142
142
 
143
- Apply a background color to the card using the `background` prop. When using a background, consider using `variant="tertiary"` on buttons.
143
+ Apply a background color to the card using the `background` prop. When using a background, consider using `variant="inverse"` on buttons.
144
144
 
145
145
  ```jsx
146
146
  function Example() {
@@ -167,7 +167,7 @@ function Example() {
167
167
  <RemoteImage source={{ uri: assets.eth.imageUrl }} />
168
168
  <RemoteImage source={{ uri: assets.polygon.imageUrl }} />
169
169
  </RemoteImageGroup>
170
- <Button compact variant="tertiary">
170
+ <Button compact variant="inverse">
171
171
  Share
172
172
  </Button>
173
173
  </ContentCardFooter>
@@ -289,7 +289,7 @@ function AccessibleCard() {
289
289
  </Text>
290
290
  <Button
291
291
  compact
292
- variant="tertiary"
292
+ variant="inverse"
293
293
  onPress={() => console.log('Button pressed - navigating...')}
294
294
  >
295
295
  View Details
@@ -342,14 +342,14 @@ When customizing card backgrounds, ensure sufficient color contrast between text
342
342
  | `borderedStart` | `boolean` | No | `-` | Add a border to the leading side of the box. |
343
343
  | `borderedTop` | `boolean` | No | `-` | Add a border to the top side of the box. |
344
344
  | `borderedVertical` | `boolean` | No | `-` | Add a border to the top and bottom sides of the box. |
345
- | `bottom` | `string \| number` | No | `-` | - |
345
+ | `bottom` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
346
346
  | `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 | `-` | - |
347
- | `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
347
+ | `columnGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
348
348
  | `dangerouslySetBackground` | `string` | No | `-` | - |
349
- | `display` | `flex \| none` | No | `-` | - |
349
+ | `display` | `flex \| none \| contents` | No | `-` | - |
350
350
  | `elevation` | `0 \| 1 \| 2` | No | `-` | Determines box shadow styles. Parent should have overflow set to visible to ensure styles are not clipped. |
351
- | `flexBasis` | `string \| number` | No | `-` | - |
352
- | `flexDirection` | `row \| column \| row-reverse \| column-reverse` | No | `-` | - |
351
+ | `flexBasis` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
352
+ | `flexDirection` | `column \| row \| row-reverse \| column-reverse` | No | `-` | - |
353
353
  | `flexGrow` | `number` | No | `-` | - |
354
354
  | `flexShrink` | `number` | No | `-` | - |
355
355
  | `flexWrap` | `wrap \| nowrap \| wrap-reverse` | No | `-` | - |
@@ -357,23 +357,23 @@ When customizing card backgrounds, ensure sufficient color contrast between text
357
357
  | `fontFamily` | `inherit \| FontFamily` | No | `-` | - |
358
358
  | `fontSize` | `inherit \| FontSize` | No | `-` | - |
359
359
  | `fontWeight` | `inherit \| FontWeight` | No | `-` | - |
360
- | `gap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
361
- | `height` | `string \| number` | No | `-` | - |
360
+ | `gap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
361
+ | `height` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
362
362
  | `justifyContent` | `flex-start \| flex-end \| center \| space-between \| space-around \| space-evenly` | No | `-` | - |
363
363
  | `key` | `Key \| null` | No | `-` | - |
364
- | `left` | `string \| number` | No | `-` | - |
364
+ | `left` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
365
365
  | `lineHeight` | `inherit \| LineHeight` | No | `-` | - |
366
- | `margin` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
367
- | `marginBottom` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
368
- | `marginEnd` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
369
- | `marginStart` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
370
- | `marginTop` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
371
- | `marginX` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
372
- | `marginY` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
373
- | `maxHeight` | `string \| number` | No | `-` | - |
374
- | `maxWidth` | `string \| number` | No | `-` | - |
375
- | `minHeight` | `string \| number` | No | `-` | - |
376
- | `minWidth` | `string \| number` | No | `-` | - |
366
+ | `margin` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
367
+ | `marginBottom` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
368
+ | `marginEnd` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
369
+ | `marginStart` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
370
+ | `marginTop` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
371
+ | `marginX` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
372
+ | `marginY` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
373
+ | `maxHeight` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
374
+ | `maxWidth` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
375
+ | `minHeight` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
376
+ | `minWidth` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
377
377
  | `onPointerCancel` | `((event: PointerEvent) => void)` | No | `-` | - |
378
378
  | `onPointerCancelCapture` | `((event: PointerEvent) => void)` | No | `-` | - |
379
379
  | `onPointerDown` | `((event: PointerEvent) => void)` | No | `-` | - |
@@ -388,28 +388,28 @@ When customizing card backgrounds, ensure sufficient color contrast between text
388
388
  | `onPointerUpCapture` | `((event: PointerEvent) => void)` | No | `-` | - |
389
389
  | `opacity` | `number \| AnimatedNode` | No | `-` | - |
390
390
  | `overflow` | `visible \| hidden \| scroll` | No | `-` | - |
391
- | `padding` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
392
- | `paddingBottom` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
393
- | `paddingEnd` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
394
- | `paddingStart` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
395
- | `paddingTop` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
396
- | `paddingX` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
397
- | `paddingY` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
391
+ | `padding` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
392
+ | `paddingBottom` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
393
+ | `paddingEnd` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
394
+ | `paddingStart` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
395
+ | `paddingTop` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
396
+ | `paddingX` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
397
+ | `paddingY` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
398
398
  | `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
399
- | `position` | `static \| relative \| fixed \| absolute \| sticky` | No | `-` | - |
400
- | `ref` | `((instance: View \| null) => void) \| RefObject<View> \| null` | No | `-` | - |
401
- | `right` | `string \| number` | No | `-` | - |
402
- | `rowGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
403
- | `style` | `false \| RegisteredStyle<ViewStyle> \| Value \| AnimatedInterpolation<string \| number> \| WithAnimatedObject<ViewStyle> \| WithAnimatedArray<Falsy \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<Falsy \| ViewStyle \| RegisteredStyle<ViewStyle>> \| readonly (Falsy \| ViewStyle \| RegisteredStyle<ViewStyle>)[]> \| null` | No | `-` | - |
404
- | `testID` | `string` | No | `-` | Used to locate this element in unit and end-to-end tests. Used to locate this view in end-to-end tests. |
399
+ | `position` | `absolute \| relative \| static` | No | `-` | - |
400
+ | `ref` | `null \| RefObject<View \| null> \| (instance: View \| 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). |
401
+ | `right` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
402
+ | `rowGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
403
+ | `style` | `false \| \| RegisteredStyle<ViewStyle> \| Value \| AnimatedInterpolation<string \| number> \| WithAnimatedObject<ViewStyle> \| WithAnimatedArray<Falsy \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<Falsy \| ViewStyle \| RegisteredStyle<ViewStyle>> \| readonly (Falsy \| ViewStyle \| RegisteredStyle<ViewStyle>)[]> \| null` | No | `-` | - |
404
+ | `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 Used to locate this view in end-to-end tests. |
405
405
  | `textAlign` | `left \| right \| auto \| center \| justify` | No | `-` | - |
406
406
  | `textDecorationLine` | `none \| underline \| line-through \| underline line-through` | No | `-` | - |
407
407
  | `textDecorationStyle` | `solid \| dotted \| dashed \| double` | No | `-` | - |
408
408
  | `textTransform` | `none \| capitalize \| uppercase \| lowercase` | No | `-` | - |
409
- | `top` | `string \| number` | No | `-` | - |
410
- | `transform` | `string \| (({ scaleX: AnimatableNumericValue; } & { scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ scaleY: AnimatableNumericValue; } & { scaleX?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ translateX: AnimatableNumericValue \| ${number}%; } & { scaleX?: undefined; scaleY?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ translateY: AnimatableNumericValue \| ${number}%; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ perspective: AnimatableNumericValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotate: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotateX: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotateY: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotateZ: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ scale: AnimatableNumericValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ skewX: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ skewY: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; matrix?: undefined; }) \| ({ matrix: AnimatableNumericValue[]; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; }))[]` | No | `-` | - |
411
- | `userSelect` | `none \| auto \| text \| contain \| all` | No | `-` | - |
412
- | `width` | `string \| number` | No | `-` | - |
409
+ | `top` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
410
+ | `transform` | `string \| readonly (({ scaleX: AnimatableNumericValue; } & { scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ scaleY: AnimatableNumericValue; } & { scaleX?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ translateX: AnimatableNumericValue \| ${number}%; } & { scaleX?: undefined; scaleY?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ translateY: AnimatableNumericValue \| ${number}%; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ perspective: AnimatableNumericValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotate: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotateX: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotateY: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotateZ: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ scale: AnimatableNumericValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ skewX: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ skewY: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; matrix?: undefined; }) \| ({ matrix: AnimatableNumericValue[]; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; }))[]` | No | `-` | - |
411
+ | `userSelect` | `auto \| none \| text \| contain \| all` | No | `-` | - |
412
+ | `width` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
413
413
  | `zIndex` | `number` | No | `-` | - |
414
414
 
415
415
 
@@ -33,7 +33,7 @@ function Example() {
33
33
  font="label2"
34
34
  accessibilityLabel="Up 5.12%"
35
35
  as="p"
36
- dangerouslySetColor={`rgb(${spectrum.green70})`}
36
+ style={{ color: `rgb(${spectrum.green70})` }}
37
37
  >
38
38
  ↗ 5.12%
39
39
  </Text>
@@ -124,7 +124,7 @@ function Example() {
124
124
  <Text font="legal" color="fgMuted">
125
125
  P&L
126
126
  </Text>
127
- <Text font="title3" dangerouslySetColor={`rgb(${spectrum.green70})`}>
127
+ <Text font="title3" style={{ color: `rgb(${spectrum.green70})` }}>
128
128
  +$890
129
129
  </Text>
130
130
  </VStack>
@@ -145,7 +145,7 @@ function Example() {
145
145
  | `animated` | `boolean` | No | `-` | - |
146
146
  | `aspectRatio` | `string \| number` | No | `-` | - |
147
147
  | `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 | `-` | - |
148
- | `body` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | - |
148
+ | `body` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | - |
149
149
  | `borderBottomLeftRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
150
150
  | `borderBottomRightRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
151
151
  | `borderBottomWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500` | No | `-` | - |
@@ -164,16 +164,16 @@ function Example() {
164
164
  | `borderedStart` | `boolean` | No | `-` | Add a border to the leading side of the box. |
165
165
  | `borderedTop` | `boolean` | No | `-` | Add a border to the top side of the box. |
166
166
  | `borderedVertical` | `boolean` | No | `-` | Add a border to the top and bottom sides of the box. |
167
- | `bottom` | `string \| number` | No | `-` | - |
168
- | `children` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Custom content to display below the main content box (title/description/media). Use this when you need to render custom content that doesnt fit the standard media/title/description layout. |
167
+ | `bottom` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
168
+ | `children` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Custom content to display below the main content box (title/description/media). Use this when you need to render custom content that doesnt fit the standard media/title/description layout. |
169
169
  | `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 | `-` | - |
170
- | `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
170
+ | `columnGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
171
171
  | `dangerouslySetBackground` | `string` | No | `-` | - |
172
- | `description` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Text or React node to display as the card description. Use a Text component to override default color and font. |
173
- | `display` | `flex \| none` | No | `-` | - |
172
+ | `description` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Text or React node to display as the card description. Use a Text component to override default color and font. |
173
+ | `display` | `flex \| none \| contents` | No | `-` | - |
174
174
  | `elevation` | `0 \| 1 \| 2` | No | `-` | Determines box shadow styles. Parent should have overflow set to visible to ensure styles are not clipped. |
175
- | `flexBasis` | `string \| number` | No | `-` | - |
176
- | `flexDirection` | `row \| column \| row-reverse \| column-reverse` | No | `-` | - |
175
+ | `flexBasis` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
176
+ | `flexDirection` | `column \| row \| row-reverse \| column-reverse` | No | `-` | - |
177
177
  | `flexGrow` | `number` | No | `-` | - |
178
178
  | `flexShrink` | `number` | No | `-` | - |
179
179
  | `flexWrap` | `wrap \| nowrap \| wrap-reverse` | No | `-` | - |
@@ -181,27 +181,27 @@ function Example() {
181
181
  | `fontFamily` | `inherit \| FontFamily` | No | `-` | - |
182
182
  | `fontSize` | `inherit \| FontSize` | No | `-` | - |
183
183
  | `fontWeight` | `inherit \| FontWeight` | No | `-` | - |
184
- | `gap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
185
- | `height` | `string \| number` | No | `-` | - |
184
+ | `gap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
185
+ | `height` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
186
186
  | `justifyContent` | `flex-start \| flex-end \| center \| space-between \| space-around \| space-evenly` | No | `-` | - |
187
187
  | `key` | `Key \| null` | No | `-` | - |
188
- | `label` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | - |
189
- | `left` | `string \| number` | No | `-` | - |
188
+ | `label` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | - |
189
+ | `left` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
190
190
  | `lineHeight` | `inherit \| LineHeight` | No | `-` | - |
191
- | `margin` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
192
- | `marginBottom` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
193
- | `marginEnd` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
194
- | `marginStart` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
195
- | `marginTop` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
196
- | `marginX` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
197
- | `marginY` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
198
- | `maxHeight` | `string \| number` | No | `-` | - |
199
- | `maxWidth` | `string \| number` | No | `-` | - |
200
- | `media` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | React node to display as media content (e.g., Image or RemoteImage). |
191
+ | `margin` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
192
+ | `marginBottom` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
193
+ | `marginEnd` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
194
+ | `marginStart` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
195
+ | `marginTop` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
196
+ | `marginX` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
197
+ | `marginY` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
198
+ | `maxHeight` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
199
+ | `maxWidth` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
200
+ | `media` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | React node to display as media content (e.g., Image or RemoteImage). |
201
201
  | `mediaPlacement` | `top \| bottom \| end \| start` | No | `'top'` | Placement of the media content relative to the text content. |
202
202
  | `mediaPosition` | `top \| bottom \| left \| right` | No | `-` | - |
203
- | `minHeight` | `string \| number` | No | `-` | - |
204
- | `minWidth` | `string \| number` | No | `-` | - |
203
+ | `minHeight` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
204
+ | `minWidth` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
205
205
  | `onPointerCancel` | `((event: PointerEvent) => void)` | No | `-` | - |
206
206
  | `onPointerCancelCapture` | `((event: PointerEvent) => void)` | No | `-` | - |
207
207
  | `onPointerDown` | `((event: PointerEvent) => void)` | No | `-` | - |
@@ -216,30 +216,30 @@ function Example() {
216
216
  | `onPointerUpCapture` | `((event: PointerEvent) => void)` | No | `-` | - |
217
217
  | `opacity` | `number \| AnimatedNode` | No | `-` | - |
218
218
  | `overflow` | `visible \| hidden \| scroll` | No | `-` | - |
219
- | `padding` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
220
- | `paddingBottom` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
221
- | `paddingEnd` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
222
- | `paddingStart` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
223
- | `paddingTop` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
224
- | `paddingX` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
225
- | `paddingY` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
219
+ | `padding` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
220
+ | `paddingBottom` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
221
+ | `paddingEnd` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
222
+ | `paddingStart` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
223
+ | `paddingTop` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
224
+ | `paddingX` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
225
+ | `paddingY` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
226
226
  | `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
227
- | `position` | `static \| relative \| fixed \| absolute \| sticky` | No | `-` | - |
228
- | `ref` | `((instance: View \| null) => void) \| RefObject<View> \| null` | No | `-` | - |
229
- | `right` | `string \| number` | No | `-` | - |
230
- | `rowGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
231
- | `style` | `false \| RegisteredStyle<ViewStyle> \| Value \| AnimatedInterpolation<string \| number> \| WithAnimatedObject<ViewStyle> \| WithAnimatedArray<Falsy \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<Falsy \| ViewStyle \| RegisteredStyle<ViewStyle>> \| readonly (Falsy \| ViewStyle \| RegisteredStyle<ViewStyle>)[]> \| null` | No | `-` | - |
227
+ | `position` | `absolute \| relative \| static` | No | `-` | - |
228
+ | `ref` | `null \| RefObject<View \| null> \| (instance: View \| 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). |
229
+ | `right` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
230
+ | `rowGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
231
+ | `style` | `false \| \| RegisteredStyle<ViewStyle> \| Value \| AnimatedInterpolation<string \| number> \| WithAnimatedObject<ViewStyle> \| WithAnimatedArray<Falsy \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<Falsy \| ViewStyle \| RegisteredStyle<ViewStyle>> \| readonly (Falsy \| ViewStyle \| RegisteredStyle<ViewStyle>)[]> \| null` | No | `-` | - |
232
232
  | `styles` | `{ root?: StyleProp<ViewStyle>; contentContainer?: StyleProp<ViewStyle>; textContainer?: StyleProp<ViewStyle>; mediaContainer?: StyleProp<ViewStyle>; }` | No | `-` | - |
233
- | `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 Used to locate this element in unit and end-to-end tests. Used to locate this view in end-to-end tests. |
233
+ | `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 Used to locate this view in end-to-end tests. |
234
234
  | `textAlign` | `left \| right \| auto \| center \| justify` | No | `-` | - |
235
235
  | `textDecorationLine` | `none \| underline \| line-through \| underline line-through` | No | `-` | - |
236
236
  | `textDecorationStyle` | `solid \| dotted \| dashed \| double` | No | `-` | - |
237
237
  | `textTransform` | `none \| capitalize \| uppercase \| lowercase` | No | `-` | - |
238
- | `title` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Text or React node to display as the card title. Use a Text component to override default color and font. |
239
- | `top` | `string \| number` | No | `-` | - |
240
- | `transform` | `string \| (({ scaleX: AnimatableNumericValue; } & { scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ scaleY: AnimatableNumericValue; } & { scaleX?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ translateX: AnimatableNumericValue \| ${number}%; } & { scaleX?: undefined; scaleY?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ translateY: AnimatableNumericValue \| ${number}%; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ perspective: AnimatableNumericValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotate: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotateX: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotateY: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotateZ: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ scale: AnimatableNumericValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ skewX: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ skewY: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; matrix?: undefined; }) \| ({ matrix: AnimatableNumericValue[]; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; }))[]` | No | `-` | - |
241
- | `userSelect` | `none \| auto \| text \| contain \| all` | No | `-` | - |
242
- | `width` | `string \| number` | No | `-` | - |
238
+ | `title` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Text or React node to display as the card title. Use a Text component to override default color and font. |
239
+ | `top` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
240
+ | `transform` | `string \| readonly (({ scaleX: AnimatableNumericValue; } & { scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ scaleY: AnimatableNumericValue; } & { scaleX?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ translateX: AnimatableNumericValue \| ${number}%; } & { scaleX?: undefined; scaleY?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ translateY: AnimatableNumericValue \| ${number}%; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ perspective: AnimatableNumericValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotate: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotateX: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotateY: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotateZ: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ scale: AnimatableNumericValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ skewX: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ skewY: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; matrix?: undefined; }) \| ({ matrix: AnimatableNumericValue[]; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; }))[]` | No | `-` | - |
241
+ | `userSelect` | `auto \| none \| text \| contain \| all` | No | `-` | - |
242
+ | `width` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
243
243
  | `zIndex` | `number` | No | `-` | - |
244
244
 
245
245
 
@@ -118,14 +118,14 @@ function Example() {
118
118
  | `borderedStart` | `boolean` | No | `-` | Add a border to the leading side of the box. |
119
119
  | `borderedTop` | `boolean` | No | `-` | Add a border to the top side of the box. |
120
120
  | `borderedVertical` | `boolean` | No | `-` | Add a border to the top and bottom sides of the box. |
121
- | `bottom` | `string \| number` | No | `-` | - |
121
+ | `bottom` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
122
122
  | `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 | `-` | - |
123
- | `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
123
+ | `columnGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
124
124
  | `dangerouslySetBackground` | `string` | No | `-` | - |
125
- | `display` | `flex \| none` | No | `-` | - |
125
+ | `display` | `flex \| none \| contents` | No | `-` | - |
126
126
  | `elevation` | `0 \| 1 \| 2` | No | `-` | Determines box shadow styles. Parent should have overflow set to visible to ensure styles are not clipped. |
127
- | `flexBasis` | `string \| number` | No | `-` | - |
128
- | `flexDirection` | `row \| column \| row-reverse \| column-reverse` | No | `-` | - |
127
+ | `flexBasis` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
128
+ | `flexDirection` | `column \| row \| row-reverse \| column-reverse` | No | `-` | - |
129
129
  | `flexGrow` | `number` | No | `-` | - |
130
130
  | `flexShrink` | `number` | No | `-` | - |
131
131
  | `flexWrap` | `wrap \| nowrap \| wrap-reverse` | No | `-` | - |
@@ -133,23 +133,23 @@ function Example() {
133
133
  | `fontFamily` | `inherit \| FontFamily` | No | `-` | - |
134
134
  | `fontSize` | `inherit \| FontSize` | No | `-` | - |
135
135
  | `fontWeight` | `inherit \| FontWeight` | No | `-` | - |
136
- | `gap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
137
- | `height` | `string \| number` | No | `-` | - |
136
+ | `gap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
137
+ | `height` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
138
138
  | `justifyContent` | `flex-start \| flex-end \| center \| space-between \| space-around \| space-evenly` | No | `-` | - |
139
139
  | `key` | `Key \| null` | No | `-` | - |
140
- | `left` | `string \| number` | No | `-` | - |
140
+ | `left` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
141
141
  | `lineHeight` | `inherit \| LineHeight` | No | `-` | - |
142
- | `margin` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
143
- | `marginBottom` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
144
- | `marginEnd` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
145
- | `marginStart` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
146
- | `marginTop` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
147
- | `marginX` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
148
- | `marginY` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
149
- | `maxHeight` | `string \| number` | No | `-` | - |
150
- | `maxWidth` | `string \| number` | No | `-` | - |
151
- | `minHeight` | `string \| number` | No | `-` | - |
152
- | `minWidth` | `string \| number` | No | `-` | - |
142
+ | `margin` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
143
+ | `marginBottom` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
144
+ | `marginEnd` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
145
+ | `marginStart` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
146
+ | `marginTop` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
147
+ | `marginX` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
148
+ | `marginY` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
149
+ | `maxHeight` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
150
+ | `maxWidth` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
151
+ | `minHeight` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
152
+ | `minWidth` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
153
153
  | `onPointerCancel` | `((event: PointerEvent) => void)` | No | `-` | - |
154
154
  | `onPointerCancelCapture` | `((event: PointerEvent) => void)` | No | `-` | - |
155
155
  | `onPointerDown` | `((event: PointerEvent) => void)` | No | `-` | - |
@@ -164,28 +164,28 @@ function Example() {
164
164
  | `onPointerUpCapture` | `((event: PointerEvent) => void)` | No | `-` | - |
165
165
  | `opacity` | `number \| AnimatedNode` | No | `-` | - |
166
166
  | `overflow` | `visible \| hidden \| scroll` | No | `-` | - |
167
- | `padding` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
168
- | `paddingBottom` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
169
- | `paddingEnd` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
170
- | `paddingStart` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
171
- | `paddingTop` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
172
- | `paddingX` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
173
- | `paddingY` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
167
+ | `padding` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
168
+ | `paddingBottom` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
169
+ | `paddingEnd` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
170
+ | `paddingStart` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
171
+ | `paddingTop` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
172
+ | `paddingX` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
173
+ | `paddingY` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
174
174
  | `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
175
- | `position` | `static \| relative \| fixed \| absolute \| sticky` | No | `-` | - |
176
- | `ref` | `((instance: View \| null) => void) \| RefObject<View> \| null` | No | `-` | - |
177
- | `right` | `string \| number` | No | `-` | - |
178
- | `rowGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
179
- | `style` | `false \| RegisteredStyle<ViewStyle> \| Value \| AnimatedInterpolation<string \| number> \| WithAnimatedObject<ViewStyle> \| WithAnimatedArray<Falsy \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<Falsy \| ViewStyle \| RegisteredStyle<ViewStyle>> \| readonly (Falsy \| ViewStyle \| RegisteredStyle<ViewStyle>)[]> \| null` | No | `-` | - |
180
- | `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 Used to locate this element in unit and end-to-end tests. Used to locate this view in end-to-end tests. |
175
+ | `position` | `absolute \| relative \| static` | No | `-` | - |
176
+ | `ref` | `null \| RefObject<View \| null> \| (instance: View \| 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). |
177
+ | `right` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
178
+ | `rowGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
179
+ | `style` | `false \| \| RegisteredStyle<ViewStyle> \| Value \| AnimatedInterpolation<string \| number> \| WithAnimatedObject<ViewStyle> \| WithAnimatedArray<Falsy \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<Falsy \| ViewStyle \| RegisteredStyle<ViewStyle>> \| readonly (Falsy \| ViewStyle \| RegisteredStyle<ViewStyle>)[]> \| null` | No | `-` | - |
180
+ | `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 Used to locate this view in end-to-end tests. |
181
181
  | `textAlign` | `left \| right \| auto \| center \| justify` | No | `-` | - |
182
182
  | `textDecorationLine` | `none \| underline \| line-through \| underline line-through` | No | `-` | - |
183
183
  | `textDecorationStyle` | `solid \| dotted \| dashed \| double` | No | `-` | - |
184
184
  | `textTransform` | `none \| capitalize \| uppercase \| lowercase` | No | `-` | - |
185
- | `top` | `string \| number` | No | `-` | - |
186
- | `transform` | `string \| (({ scaleX: AnimatableNumericValue; } & { scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ scaleY: AnimatableNumericValue; } & { scaleX?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ translateX: AnimatableNumericValue \| ${number}%; } & { scaleX?: undefined; scaleY?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ translateY: AnimatableNumericValue \| ${number}%; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ perspective: AnimatableNumericValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotate: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotateX: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotateY: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotateZ: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ scale: AnimatableNumericValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ skewX: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ skewY: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; matrix?: undefined; }) \| ({ matrix: AnimatableNumericValue[]; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; }))[]` | No | `-` | - |
187
- | `userSelect` | `none \| auto \| text \| contain \| all` | No | `-` | - |
188
- | `width` | `string \| number` | No | `-` | - |
185
+ | `top` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
186
+ | `transform` | `string \| readonly (({ scaleX: AnimatableNumericValue; } & { scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ scaleY: AnimatableNumericValue; } & { scaleX?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ translateX: AnimatableNumericValue \| ${number}%; } & { scaleX?: undefined; scaleY?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ translateY: AnimatableNumericValue \| ${number}%; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ perspective: AnimatableNumericValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotate: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotateX: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotateY: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ rotateZ: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ scale: AnimatableNumericValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; skewX?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ skewX: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewY?: undefined; matrix?: undefined; }) \| ({ skewY: AnimatableStringValue; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; matrix?: undefined; }) \| ({ matrix: AnimatableNumericValue[]; } & { scaleX?: undefined; scaleY?: undefined; translateX?: undefined; translateY?: undefined; perspective?: undefined; rotate?: undefined; rotateX?: undefined; rotateY?: undefined; rotateZ?: undefined; scale?: undefined; skewX?: undefined; skewY?: undefined; }))[]` | No | `-` | - |
187
+ | `userSelect` | `auto \| none \| text \| contain \| all` | No | `-` | - |
188
+ | `width` | `null \| number \| auto \| AnimatedNode \| ${number}%` | No | `-` | - |
189
189
  | `zIndex` | `number` | No | `-` | - |
190
190
 
191
191