@coinbase/cds-mcp-server 9.6.1 → 9.6.3

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 (94) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/mcp-docs/mobile/components/Alert.txt +2 -3
  3. package/mcp-docs/mobile/components/AreaChart.txt +1 -2
  4. package/mcp-docs/mobile/components/Banner.txt +2 -3
  5. package/mcp-docs/mobile/components/BarChart.txt +1 -2
  6. package/mcp-docs/mobile/components/Box.txt +1 -2
  7. package/mcp-docs/mobile/components/Button.txt +3 -4
  8. package/mcp-docs/mobile/components/Calendar.txt +1 -2
  9. package/mcp-docs/mobile/components/Carousel.txt +1 -2
  10. package/mcp-docs/mobile/components/CartesianChart.txt +1 -2
  11. package/mcp-docs/mobile/components/CellMedia.txt +1 -1
  12. package/mcp-docs/mobile/components/Checkbox.txt +1 -1
  13. package/mcp-docs/mobile/components/CheckboxCell.txt +1 -1
  14. package/mcp-docs/mobile/components/CheckboxGroup.txt +1 -1
  15. package/mcp-docs/mobile/components/Chip.txt +1 -2
  16. package/mcp-docs/mobile/components/Coachmark.txt +1 -2
  17. package/mcp-docs/mobile/components/Collapsible.txt +1 -2
  18. package/mcp-docs/mobile/components/ContentCard.txt +1 -2
  19. package/mcp-docs/mobile/components/ContentCardBody.txt +1 -2
  20. package/mcp-docs/mobile/components/ContentCardFooter.txt +1 -2
  21. package/mcp-docs/mobile/components/ContentCardHeader.txt +1 -2
  22. package/mcp-docs/mobile/components/ControlGroup.txt +1 -1
  23. package/mcp-docs/mobile/components/DataCard.txt +1 -2
  24. package/mcp-docs/mobile/components/DateInput.txt +4 -5
  25. package/mcp-docs/mobile/components/DatePicker.txt +4 -5
  26. package/mcp-docs/mobile/components/DotSymbol.txt +1 -1
  27. package/mcp-docs/mobile/components/HStack.txt +1 -2
  28. package/mcp-docs/mobile/components/HeroSquare.txt +1 -1
  29. package/mcp-docs/mobile/components/Icon.txt +1 -1
  30. package/mcp-docs/mobile/components/IconButton.txt +2 -3
  31. package/mcp-docs/mobile/components/InputChip.txt +1 -2
  32. package/mcp-docs/mobile/components/Legend.txt +1 -2
  33. package/mcp-docs/mobile/components/LineChart.txt +1 -2
  34. package/mcp-docs/mobile/components/Link.txt +1 -1
  35. package/mcp-docs/mobile/components/Lottie.txt +1 -2
  36. package/mcp-docs/mobile/components/MediaCard.txt +1 -2
  37. package/mcp-docs/mobile/components/MediaChip.txt +1 -2
  38. package/mcp-docs/mobile/components/MessagingCard.txt +1 -2
  39. package/mcp-docs/mobile/components/Modal.txt +1 -2
  40. package/mcp-docs/mobile/components/MultiContentModule.txt +1 -2
  41. package/mcp-docs/mobile/components/NavigationTitle.txt +1 -1
  42. package/mcp-docs/mobile/components/NavigationTitleSelect.txt +1 -1
  43. package/mcp-docs/mobile/components/NudgeCard.txt +1 -1
  44. package/mcp-docs/mobile/components/Numpad.txt +1 -2
  45. package/mcp-docs/mobile/components/PageFooter.txt +1 -2
  46. package/mcp-docs/mobile/components/PageHeader.txt +1 -2
  47. package/mcp-docs/mobile/components/PercentageBarChart.txt +1 -2
  48. package/mcp-docs/mobile/components/PeriodSelector.txt +1 -2
  49. package/mcp-docs/mobile/components/Pictogram.txt +1 -1
  50. package/mcp-docs/mobile/components/Pressable.txt +1 -2
  51. package/mcp-docs/mobile/components/ProgressBar.txt +1 -2
  52. package/mcp-docs/mobile/components/ProgressCircle.txt +1 -2
  53. package/mcp-docs/mobile/components/Radio.txt +1 -1
  54. package/mcp-docs/mobile/components/RadioCell.txt +1 -1
  55. package/mcp-docs/mobile/components/RadioGroup.txt +1 -1
  56. package/mcp-docs/mobile/components/RemoteImage.txt +1 -1
  57. package/mcp-docs/mobile/components/RollingNumber.txt +2 -3
  58. package/mcp-docs/mobile/components/Scrubber.txt +1 -2
  59. package/mcp-docs/mobile/components/SearchInput.txt +4 -5
  60. package/mcp-docs/mobile/components/SectionHeader.txt +1 -2
  61. package/mcp-docs/mobile/components/SegmentedTabs.txt +1 -1
  62. package/mcp-docs/mobile/components/Select.txt +1 -1
  63. package/mcp-docs/mobile/components/SelectChip.txt +1 -2
  64. package/mcp-docs/mobile/components/SlideButton.txt +1 -2
  65. package/mcp-docs/mobile/components/Sparkline.txt +1 -2
  66. package/mcp-docs/mobile/components/SparklineGradient.txt +1 -2
  67. package/mcp-docs/mobile/components/SparklineInteractiveHeader.txt +1 -2
  68. package/mcp-docs/mobile/components/Stepper.txt +1 -1
  69. package/mcp-docs/mobile/components/Switch.txt +1 -2
  70. package/mcp-docs/mobile/components/TabIndicator.txt +1 -2
  71. package/mcp-docs/mobile/components/TabLabel.txt +1 -1
  72. package/mcp-docs/mobile/components/TabNavigation.txt +1 -1
  73. package/mcp-docs/mobile/components/TabbedChips.txt +1 -1
  74. package/mcp-docs/mobile/components/TabbedChipsAlpha.txt +1 -1
  75. package/mcp-docs/mobile/components/Tabs.txt +1 -1
  76. package/mcp-docs/mobile/components/Tag.txt +3 -4
  77. package/mcp-docs/mobile/components/Text.txt +2 -3
  78. package/mcp-docs/mobile/components/TextInput.txt +4 -5
  79. package/mcp-docs/mobile/components/Toast.txt +1 -2
  80. package/mcp-docs/mobile/components/Tray.txt +1 -2
  81. package/mcp-docs/mobile/components/VStack.txt +1 -2
  82. package/mcp-docs/web/components/Alert.txt +1 -1
  83. package/mcp-docs/web/components/Banner.txt +1 -1
  84. package/mcp-docs/web/components/Button.txt +2 -2
  85. package/mcp-docs/web/components/CellMedia.txt +1 -1
  86. package/mcp-docs/web/components/DotSymbol.txt +1 -1
  87. package/mcp-docs/web/components/FullscreenAlert.txt +1 -1
  88. package/mcp-docs/web/components/HeroSquare.txt +1 -1
  89. package/mcp-docs/web/components/Icon.txt +1 -1
  90. package/mcp-docs/web/components/NudgeCard.txt +1 -1
  91. package/mcp-docs/web/components/Pictogram.txt +1 -1
  92. package/mcp-docs/web/components/Tag.txt +2 -2
  93. package/mcp-docs/web/components/TileButton.txt +1 -1
  94. package/package.json +1 -1
@@ -284,7 +284,6 @@ const TransactionalNumpadExample = () => {
284
284
  | `gap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
285
285
  | `height` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
286
286
  | `justifyContent` | `flex-start \| flex-end \| center \| space-between \| space-around \| space-evenly` | No | `-` | - |
287
- | `key` | `Key \| null` | No | `-` | - |
288
287
  | `left` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
289
288
  | `lineHeight` | `inherit \| LineHeight` | No | `-` | - |
290
289
  | `margin` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
@@ -322,7 +321,7 @@ const TransactionalNumpadExample = () => {
322
321
  | `paddingY` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
323
322
  | `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
324
323
  | `position` | `absolute \| relative \| static` | No | `-` | - |
325
- | `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). |
324
+ | `ref` | `null \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<View \| null>` | No | `-` | - |
326
325
  | `right` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
327
326
  | `rowGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
328
327
  | `separator` | `string` | No | `-` | - |
@@ -135,7 +135,6 @@ function LegalTextPageFooter() {
135
135
  | `gap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
136
136
  | `height` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
137
137
  | `justifyContent` | `flex-start \| flex-end \| center \| space-between \| space-around \| space-evenly` | No | `-` | - |
138
- | `key` | `Key \| null` | No | `-` | - |
139
138
  | `left` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
140
139
  | `legalText` | `string` | No | `-` | Optional legal text rendered below the action in a pre-styled caption. Centered on mobile. |
141
140
  | `lineHeight` | `inherit \| LineHeight` | No | `-` | - |
@@ -173,7 +172,7 @@ function LegalTextPageFooter() {
173
172
  | `paddingY` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
174
173
  | `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
175
174
  | `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). |
175
+ | `ref` | `null \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<View \| null>` | No | `-` | - |
177
176
  | `right` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
178
177
  | `rowGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
179
178
  | `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 | `-` | - |
@@ -137,7 +137,6 @@ function Example() {
137
137
  | `gap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
138
138
  | `height` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
139
139
  | `justifyContent` | `flex-start \| flex-end \| center \| space-between \| space-around \| space-evenly` | No | `-` | - |
140
- | `key` | `Key \| null` | No | `-` | - |
141
140
  | `left` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
142
141
  | `lineHeight` | `inherit \| LineHeight` | No | `-` | - |
143
142
  | `margin` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
@@ -174,7 +173,7 @@ function Example() {
174
173
  | `paddingY` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
175
174
  | `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
176
175
  | `position` | `absolute \| relative \| static` | No | `-` | - |
177
- | `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). |
176
+ | `ref` | `null \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<View \| null>` | No | `-` | - |
178
177
  | `right` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
179
178
  | `rowGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
180
179
  | `start` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Optional. Accepts a ReactNode. Used for placing primary content on the left side of the page header, such as a header title, logo, or icon button. |
@@ -746,7 +746,6 @@ function BuyVsSellExample() {
746
746
  | `height` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
747
747
  | `inset` | `number \| Partial<ChartInset>` | No | `0` | Inset around the entire chart (outside the axes). |
748
748
  | `justifyContent` | `flex-start \| flex-end \| center \| space-between \| space-around \| space-evenly` | No | `-` | - |
749
- | `key` | `Key \| null` | No | `-` | - |
750
749
  | `layout` | `horizontal \| vertical` | No | `'horizontal'` | Chart layout - describes the direction bars/areas grow. - vertical: Bars grow vertically. X is category axis, Y is value axis. - horizontal (default): Bars grow horizontally. Y is category axis, X is value axis. |
751
750
  | `left` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
752
751
  | `legend` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Whether to show the legend or a custom legend element. - true renders the default Legend component - A React element renders that element as the legend - false or omitted hides the legend |
@@ -787,7 +786,7 @@ function BuyVsSellExample() {
787
786
  | `paddingY` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
788
787
  | `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
789
788
  | `position` | `absolute \| relative \| static` | No | `-` | - |
790
- | `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). |
789
+ | `ref` | `null \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<View \| null>` | No | `-` | - |
791
790
  | `right` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
792
791
  | `roundBaseline` | `boolean` | No | `true` | Whether to round the baseline of a bar (where the value is 0). |
793
792
  | `rowGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
@@ -265,7 +265,6 @@ function Example() {
265
265
  | `gap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
266
266
  | `height` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
267
267
  | `justifyContent` | `flex-start \| flex-end \| center \| space-between \| space-around \| space-evenly` | No | `-` | - |
268
- | `key` | `Key \| null` | No | `-` | - |
269
268
  | `left` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
270
269
  | `lineHeight` | `inherit \| LineHeight` | No | `-` | - |
271
270
  | `margin` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
@@ -303,7 +302,7 @@ function Example() {
303
302
  | `paddingY` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
304
303
  | `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
305
304
  | `position` | `absolute \| relative \| static` | No | `absolute` | - |
306
- | `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). |
305
+ | `ref` | `null \| (instance: any) => void \| (() => VoidOrUndefinedOnly) \| RefObject<any>` | No | `-` | - |
307
306
  | `right` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
308
307
  | `rowGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
309
308
  | `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 | `-` | - |
@@ -64,7 +64,7 @@ const customTheme = {
64
64
 
65
65
  | Prop | Type | Required | Default | Description |
66
66
  | --- | --- | --- | --- | --- |
67
- | `name` | `key \| done \| loop \| cardSuccess \| warning \| error \| add \| arrowsUpDown \| browser \| calculator \| calendar \| checkmark \| clock \| coinbaseOneLogo \| crystalBallInsight \| derivativesProduct \| download \| email \| gasFees \| identityCard \| instantUnstakingClock \| laptop \| learningRewardsProduct \| lock \| passport \| paypal \| phone \| pieChartData \| pieChartWithArrow \| planet \| robot \| safe \| securityKey \| settings \| shield \| support \| taxes \| tokenSales \| trading \| verifiedPools \| wallet \| 2fa \| accountsNavigation \| accreditedInvestor \| addCard \| addPayment \| addPhone \| addressBook \| addToWatchlist \| addWallet \| advancedTradingDesktop \| advancedTradingNavigation \| advancedTradingRebates \| agent \| alerts \| alertsCoinbaseOne \| analyticsNavigation \| apartOfDropsNft \| applyForHigherLimits \| apyInterest \| assetEncryption \| assetHubNavigation \| assetManagement \| assetManagementNavigation \| assetMeasurements \| assetMovement \| authenticationApp \| authenticator \| authenticatorAlt \| authenticatorProgress \| avatarAa \| avatarAb \| avatarAc \| avatarAd \| avatarAe \| avatarAf \| avatarAg \| avatarAh \| avatarAi \| avatarAj \| avatarBa \| avatarBb \| avatarBc \| avatarBd \| avatarBe \| avatarBf \| avatarBg \| avatarBh \| avatarBi \| avatarBj \| avatarCa \| avatarCb \| avatarCc \| avatarCd \| avatarCe \| avatarCf \| avatarCg \| avatarCh \| avatarCi \| avatarCj \| avatarDa \| avatarDb \| avatarDc \| avatarDd \| avatarDe \| avatarDf \| avatarDg \| avatarDh \| avatarDi \| avatarDj \| avatarEa \| avatarEb \| avatarEc \| avatarEd \| avatarEe \| avatarEf \| avatarEg \| avatarEh \| avatarEi \| avatarEj \| avatarFa \| avatarFb \| avatarFc \| avatarFd \| avatarFe \| avatarFf \| avatarFg \| avatarFh \| avatarFi \| avatarFj \| avatarGa \| avatarGb \| avatarGc \| avatarGd \| avatarGe \| avatarGf \| avatarGg \| avatarGh \| avatarGi \| avatarGj \| avatarHa \| avatarHb \| avatarHc \| avatarHd \| avatarHe \| avatarHf \| avatarHg \| avatarHh \| avatarHi \| avatarHj \| avatarIa \| avatarIb \| avatarIc \| avatarId \| avatarIe \| avatarIf \| avatarIg \| avatarIh \| avatarIi \| avatarIj \| avatarJa \| avatarJb \| avatarJc \| avatarJd \| avatarJe \| avatarJf \| avatarJg \| avatarJh \| avatarJi \| avatarJj \| barChart \| baseAscend \| baseCertificateStar \| baseChartSmall \| baseChatBubbleHeart \| baseCheckSmall \| baseCoinCryptoSmall \| baseCoinNetworkSmall \| baseCoinStack \| baseCoinStar \| baseComet \| baseComputer \| baseConfetti \| baseConnectApps \| baseConnectSmall \| baseCreatorCoin \| baseDecentralizationSmall \| baseDiamondSmall \| baseDiamondTrophy \| baseDoor \| baseEarnedBadge \| baseEmptySmall \| baseErrorButterflySmall \| baseErrorSmall \| baseExchange \| baseFire \| baseGem \| baseGlobe \| baseHandStar \| baseLayout \| baseLightningbolt \| baseLoadingSmall \| baseLocationSmall \| baseLogo \| baseLogoNavigation \| baseMedal \| baseMessaging \| baseMintNftSmall \| baseNetworkSmall \| baseNftSmall \| basePaycoinSmall \| basePeopleSmall \| basePiechartSmall \| basePlant \| basePower \| baseRibbon \| baseRocket \| baseRockon \| baseSaved \| baseSecuritySmall \| baseSendSmall \| baseSignin \| baseSmile \| baseStack \| baseStar \| baseTargetSmall \| baseTile \| bigBtcSend \| bitcoin \| bitcoinPizza \| bitcoinRewards \| bitcoinWhitePaper \| blockchainConnection \| bonusFivePercent \| bonusTwoPercent \| borrowCoins \| borrowingLending \| borrowNavigation \| browserMultiPlatform \| browserTransaction \| btcOneHundred \| bundle \| businessProduct \| calendarCaution \| calendarHighlight \| candleSticksGraph \| cardBlocked \| cardDeclined \| cardNavigation \| cb1BankTransfers \| chart \| chat \| cloudNavigation \| coinbaseLogoAdvancedBrand \| coinbaseLogoNavigation \| coinbaseOneAuthenticator \| coinbaseOneChat \| coinbaseOneEarn \| coinbaseOneEarnCoins \| coinbaseOneEarnCoinsLogo \| coinbaseOneFiat \| coinbaseOneProductIcon \| coinbaseOneProductInvestWeekly \| coinbaseOneRefreshed \| coinbaseOneShield \| coinbaseOneTrade \| coinbaseOneTrusted \| coinbaseOneUnlimitedRewards \| coinbaseUnlockOffers \| coinbaseWalletApp \| coinFocus \| coinShare \| coldStorageCheck \| collectionOfAssets \| commerceCheckout \| commerceInvoice \| commerceNavigation \| commodities \| completeQuiz \| complianceNavigation \| congratulations \| connectNavigation \| contactInfo \| controlWalletStorage \| creative \| creditCard \| crypto101 \| cryptoCard \| cryptoCoins \| cryptoFolder \| custodialJourney \| custodyNavigation \| dataMarketplaceNavigation \| decentralizationEverything \| decentralizedExchange \| decentralizedIdentity \| decentralizedWeb3 \| defiEarnMoment \| delegate \| delegateNavigation \| derivativesNavigation \| developerPlatformNavigation \| developerSDKNavigation \| directDepositNavigation \| dollarShowcase \| driversLicense \| driversLicenseWheel \| earnCoins \| earnGraph \| earnNavigation \| easyToUse \| economyGlobal \| emailAndMessages \| enableVoting \| envelope \| ethereumFocus \| ethRewards \| ethStaking \| ethStakingChart \| ethStakingRewards \| ethToken \| exchangeNavigation \| explore \| fast \| faucetNavigation \| feesRestriction \| fiat \| finance \| findYourSelection \| formDownload \| futures \| futuresCoinbaseOne \| gem \| genericCountryIDCard \| getStarted \| giftbox \| globalConnections \| globalPayments \| globalTransactions \| googleAuthenticator \| governance \| hardwareWallet \| helpCenterNavigation \| higherLimits \| holdingCoin \| idBlock \| idError \| idVerification \| increaseLimits \| inrTrade \| institutionalNavigation \| institutions \| instoAccount \| instoAddressBook \| instoAdvancedTradingRebates \| instoApyInterest \| instoAuthenticatorProgress \| instoBorrowCoins \| instoBorrowingLending \| instoBrowserMultiPlatform \| instoCoinbaseOneShield \| instoCoinFocus \| instoCrypto101 \| instoDecentralizationEverything \| instoDecentralizedExchange \| instoDecentralizedWeb3 \| instoDelegate \| instoEarnCoins \| instoEarnGraph \| instoEasyToUse \| instoEth \| instoEthRewards \| instoEthStakingChart \| instoFiat \| instoGem \| instoGlobalConnections \| instoKey \| instoMonitoringPerformance \| instoNftLibrary \| instoPasswordWalletLocked \| instoprimeMobileApp \| instoRestaking \| instoRiskStaking \| instoSecuredAssets \| instoSelfCustodyWallet \| instoStakingGraph \| instoTrading \| instoWalletWarning \| internationalExchangeNavigation \| internet \| investGraph \| laptopCharts \| laptopVideo \| layerNetworks \| leadGraph \| learn \| learningRewardsNavigation \| lightbulbLearn \| lightningNetworkSend \| linkYourAccount \| listingFees \| locationUsa \| lowFees \| manageWeb3SignersAcct \| miningCoins \| mintedNft \| mobileCharts \| mobileError \| mobileNotifcation \| mobileSuccess \| mobileWarning \| moneyCrypto \| moneyEarn \| moneySwift \| monitoringPerformance \| moreThanBitcoin \| multiAccountsAndCards \| multiPlatform \| multipleAssets \| musicAndSounds \| myNumberCard \| newTradeError \| newUserChecklistBuyCrypto \| newUserChecklistCompleteAccount \| newUserChecklistVerifyId \| nftAvatar \| nftLibrary \| nftNavigation \| noAnnualFee \| noNftFound \| notificationHubAnalysis \| notificationHubNews \| notificationHubPortfolio \| notificationHubSocial \| notifications \| noVisibility \| noWiFi \| orders \| outage \| partialCoins \| participateNavigation \| passwordWalletLocked \| payNavigation \| peerToPeer \| pieChart \| pieChartWithArrowBlue \| pizza \| pluginBrowser \| podium \| positiveReviews \| predictionMarkets \| premiumInvestor \| priceTracking \| primeMobileApp \| primeNavigation \| privateClientNavigation \| proNavigation \| protectionPlan \| queryTransactNavigation \| receipt \| recurringPurchases \| restaking \| reviewAndAdd \| rewardsNavigation \| riskStaking \| rosettaNavigation \| securedAssets \| security \| securityCoinShield \| seedPhrase \| selectAddNft \| selfCustodyWallet \| selfServe \| sellSendAnytime \| sendPaymentToOthers \| settled \| sideChainSide \| signInNavigation \| smsAuthenticate \| sparkleCoinbaseOne \| ssnCard \| stableCoinMetaphor \| stacking \| stakingGraph \| standWithCryptoLogoNavigation \| startToday \| strongInfo \| strongWarning \| successPhone \| supportChat \| takeQuiz \| target \| taxBeta \| taxCenterNavigation \| taxesArrangement \| taxSeason \| timingCheck \| tokenBaskets \| transferSend \| transistor \| trendingAssets \| trusted \| tryAgainLater \| twoBonus \| typeScript \| ubiKey \| usaProduct \| usdcEarn \| usdcInterest \| usdcLoan \| usdcLogo \| usdcRewards \| usdcRewardsRibbon \| usdcToken \| venturesNavigation \| videoCalendar \| videoContent \| waiting \| waitingForConsensus \| walletAsServiceNavigation \| walletDeposit \| walletError \| walletExchange \| walletLinkNavigation \| walletLogoNavigation \| walletNavigation \| walletPassword \| walletSuccess \| walletWarning \| winBTC \| worldwide \| wrapEth` | Yes | `-` | Name of illustration as defined in Figma |
67
+ | `name` | `done \| loop \| cardSuccess \| warning \| error \| add \| arrowsUpDown \| browser \| calculator \| calendar \| checkmark \| clock \| coinbaseOneLogo \| crystalBallInsight \| derivativesProduct \| download \| email \| gasFees \| identityCard \| instantUnstakingClock \| key \| laptop \| learningRewardsProduct \| lock \| passport \| paypal \| phone \| pieChartData \| pieChartWithArrow \| planet \| robot \| safe \| securityKey \| settings \| shield \| support \| taxes \| tokenSales \| trading \| verifiedPools \| wallet \| 2fa \| accountsNavigation \| accreditedInvestor \| addCard \| addPayment \| addPhone \| addressBook \| addToWatchlist \| addWallet \| advancedTradingDesktop \| advancedTradingNavigation \| advancedTradingRebates \| agent \| alerts \| alertsCoinbaseOne \| analyticsNavigation \| apartOfDropsNft \| applyForHigherLimits \| apyInterest \| assetEncryption \| assetHubNavigation \| assetManagement \| assetManagementNavigation \| assetMeasurements \| assetMovement \| authenticationApp \| authenticator \| authenticatorAlt \| authenticatorProgress \| avatarAa \| avatarAb \| avatarAc \| avatarAd \| avatarAe \| avatarAf \| avatarAg \| avatarAh \| avatarAi \| avatarAj \| avatarBa \| avatarBb \| avatarBc \| avatarBd \| avatarBe \| avatarBf \| avatarBg \| avatarBh \| avatarBi \| avatarBj \| avatarCa \| avatarCb \| avatarCc \| avatarCd \| avatarCe \| avatarCf \| avatarCg \| avatarCh \| avatarCi \| avatarCj \| avatarDa \| avatarDb \| avatarDc \| avatarDd \| avatarDe \| avatarDf \| avatarDg \| avatarDh \| avatarDi \| avatarDj \| avatarEa \| avatarEb \| avatarEc \| avatarEd \| avatarEe \| avatarEf \| avatarEg \| avatarEh \| avatarEi \| avatarEj \| avatarFa \| avatarFb \| avatarFc \| avatarFd \| avatarFe \| avatarFf \| avatarFg \| avatarFh \| avatarFi \| avatarFj \| avatarGa \| avatarGb \| avatarGc \| avatarGd \| avatarGe \| avatarGf \| avatarGg \| avatarGh \| avatarGi \| avatarGj \| avatarHa \| avatarHb \| avatarHc \| avatarHd \| avatarHe \| avatarHf \| avatarHg \| avatarHh \| avatarHi \| avatarHj \| avatarIa \| avatarIb \| avatarIc \| avatarId \| avatarIe \| avatarIf \| avatarIg \| avatarIh \| avatarIi \| avatarIj \| avatarJa \| avatarJb \| avatarJc \| avatarJd \| avatarJe \| avatarJf \| avatarJg \| avatarJh \| avatarJi \| avatarJj \| barChart \| baseAscend \| baseCertificateStar \| baseChartSmall \| baseChatBubbleHeart \| baseCheckSmall \| baseCoinCryptoSmall \| baseCoinNetworkSmall \| baseCoinStack \| baseCoinStar \| baseComet \| baseComputer \| baseConfetti \| baseConnectApps \| baseConnectSmall \| baseCreatorCoin \| baseDecentralizationSmall \| baseDiamondSmall \| baseDiamondTrophy \| baseDoor \| baseEarnedBadge \| baseEmptySmall \| baseErrorButterflySmall \| baseErrorSmall \| baseExchange \| baseFire \| baseGem \| baseGlobe \| baseHandStar \| baseLayout \| baseLightningbolt \| baseLoadingSmall \| baseLocationSmall \| baseLogo \| baseLogoNavigation \| baseMedal \| baseMessaging \| baseMintNftSmall \| baseNetworkSmall \| baseNftSmall \| basePaycoinSmall \| basePeopleSmall \| basePiechartSmall \| basePlant \| basePower \| baseRibbon \| baseRocket \| baseRockon \| baseSaved \| baseSecuritySmall \| baseSendSmall \| baseSignin \| baseSmile \| baseStack \| baseStar \| baseTargetSmall \| baseTile \| bigBtcSend \| bitcoin \| bitcoinPizza \| bitcoinRewards \| bitcoinWhitePaper \| blockchainConnection \| bonusFivePercent \| bonusTwoPercent \| borrowCoins \| borrowingLending \| borrowNavigation \| browserMultiPlatform \| browserTransaction \| btcOneHundred \| bundle \| businessProduct \| calendarCaution \| calendarHighlight \| candleSticksGraph \| cardBlocked \| cardDeclined \| cardNavigation \| cb1BankTransfers \| chart \| chat \| cloudNavigation \| coinbaseLogoAdvancedBrand \| coinbaseLogoNavigation \| coinbaseOneAuthenticator \| coinbaseOneChat \| coinbaseOneEarn \| coinbaseOneEarnCoins \| coinbaseOneEarnCoinsLogo \| coinbaseOneFiat \| coinbaseOneProductIcon \| coinbaseOneProductInvestWeekly \| coinbaseOneRefreshed \| coinbaseOneShield \| coinbaseOneTrade \| coinbaseOneTrusted \| coinbaseOneUnlimitedRewards \| coinbaseUnlockOffers \| coinbaseWalletApp \| coinFocus \| coinShare \| coldStorageCheck \| collectionOfAssets \| commerceCheckout \| commerceInvoice \| commerceNavigation \| commodities \| completeQuiz \| complianceNavigation \| congratulations \| connectNavigation \| contactInfo \| controlWalletStorage \| creative \| creditCard \| crypto101 \| cryptoCard \| cryptoCoins \| cryptoFolder \| custodialJourney \| custodyNavigation \| dataMarketplaceNavigation \| decentralizationEverything \| decentralizedExchange \| decentralizedIdentity \| decentralizedWeb3 \| defiEarnMoment \| delegate \| delegateNavigation \| derivativesNavigation \| developerPlatformNavigation \| developerSDKNavigation \| directDepositNavigation \| dollarShowcase \| driversLicense \| driversLicenseWheel \| earnCoins \| earnGraph \| earnNavigation \| easyToUse \| economyGlobal \| emailAndMessages \| enableVoting \| envelope \| ethereumFocus \| ethRewards \| ethStaking \| ethStakingChart \| ethStakingRewards \| ethToken \| exchangeNavigation \| explore \| fast \| faucetNavigation \| feesRestriction \| fiat \| finance \| findYourSelection \| formDownload \| futures \| futuresCoinbaseOne \| gem \| genericCountryIDCard \| getStarted \| giftbox \| globalConnections \| globalPayments \| globalTransactions \| googleAuthenticator \| governance \| hardwareWallet \| helpCenterNavigation \| higherLimits \| holdingCoin \| idBlock \| idError \| idVerification \| increaseLimits \| inrTrade \| institutionalNavigation \| institutions \| instoAccount \| instoAddressBook \| instoAdvancedTradingRebates \| instoApyInterest \| instoAuthenticatorProgress \| instoBorrowCoins \| instoBorrowingLending \| instoBrowserMultiPlatform \| instoCoinbaseOneShield \| instoCoinFocus \| instoCrypto101 \| instoDecentralizationEverything \| instoDecentralizedExchange \| instoDecentralizedWeb3 \| instoDelegate \| instoEarnCoins \| instoEarnGraph \| instoEasyToUse \| instoEth \| instoEthRewards \| instoEthStakingChart \| instoFiat \| instoGem \| instoGlobalConnections \| instoKey \| instoMonitoringPerformance \| instoNftLibrary \| instoPasswordWalletLocked \| instoprimeMobileApp \| instoRestaking \| instoRiskStaking \| instoSecuredAssets \| instoSelfCustodyWallet \| instoStakingGraph \| instoTrading \| instoWalletWarning \| internationalExchangeNavigation \| internet \| investGraph \| laptopCharts \| laptopVideo \| layerNetworks \| leadGraph \| learn \| learningRewardsNavigation \| lightbulbLearn \| lightningNetworkSend \| linkYourAccount \| listingFees \| locationUsa \| lowFees \| manageWeb3SignersAcct \| miningCoins \| mintedNft \| mobileCharts \| mobileError \| mobileNotifcation \| mobileSuccess \| mobileWarning \| moneyCrypto \| moneyEarn \| moneySwift \| monitoringPerformance \| moreThanBitcoin \| multiAccountsAndCards \| multiPlatform \| multipleAssets \| musicAndSounds \| myNumberCard \| newTradeError \| newUserChecklistBuyCrypto \| newUserChecklistCompleteAccount \| newUserChecklistVerifyId \| nftAvatar \| nftLibrary \| nftNavigation \| noAnnualFee \| noNftFound \| notificationHubAnalysis \| notificationHubNews \| notificationHubPortfolio \| notificationHubSocial \| notifications \| noVisibility \| noWiFi \| orders \| outage \| partialCoins \| participateNavigation \| passwordWalletLocked \| payNavigation \| peerToPeer \| pieChart \| pieChartWithArrowBlue \| pizza \| pluginBrowser \| podium \| positiveReviews \| predictionMarkets \| premiumInvestor \| priceTracking \| primeMobileApp \| primeNavigation \| privateClientNavigation \| proNavigation \| protectionPlan \| queryTransactNavigation \| receipt \| recurringPurchases \| restaking \| reviewAndAdd \| rewardsNavigation \| riskStaking \| rosettaNavigation \| securedAssets \| security \| securityCoinShield \| seedPhrase \| selectAddNft \| selfCustodyWallet \| selfServe \| sellSendAnytime \| sendPaymentToOthers \| settled \| sideChainSide \| signInNavigation \| smsAuthenticate \| sparkleCoinbaseOne \| ssnCard \| stableCoinMetaphor \| stacking \| stakingGraph \| standWithCryptoLogoNavigation \| startToday \| strongInfo \| strongWarning \| successPhone \| supportChat \| takeQuiz \| target \| taxBeta \| taxCenterNavigation \| taxesArrangement \| taxSeason \| timingCheck \| tokenBaskets \| transferSend \| transistor \| trendingAssets \| trusted \| tryAgainLater \| twoBonus \| typeScript \| ubiKey \| usaProduct \| usdcEarn \| usdcInterest \| usdcLoan \| usdcLogo \| usdcRewards \| usdcRewardsRibbon \| usdcToken \| venturesNavigation \| videoCalendar \| videoContent \| waiting \| waitingForConsensus \| walletAsServiceNavigation \| walletDeposit \| walletError \| walletExchange \| walletLinkNavigation \| walletLogoNavigation \| walletNavigation \| walletPassword \| walletSuccess \| walletWarning \| winBTC \| worldwide \| wrapEth` | Yes | `-` | Name of illustration as defined in Figma |
68
68
  | `applyTheme` | `boolean` | No | `-` | Apply the theme to the illustration |
69
69
  | `dimension` | `48x48 \| 64x64` | No | `-` | HeroSquare Default: 240x240 SpotSquare Default: 96x96 Pictogram Default: 48x48 SpotRectangle Default: 240x120 |
70
70
  | `fallback` | `ReactElement<unknown, string \| JSXElementConstructor<any>> \| null` | No | `null` | Fallback element to render if unable to find an illustration with the matching name |
@@ -140,7 +140,6 @@ On web, all [ARIA attributes](https://developer.mozilla.org/en-US/docs/Web/Acces
140
140
  | `height` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
141
141
  | `hitSlop` | `number \| Insets \| null` | No | `-` | Additional distance outside of this view in which a press is detected. |
142
142
  | `justifyContent` | `flex-start \| flex-end \| center \| space-between \| space-around \| space-evenly` | No | `-` | - |
143
- | `key` | `Key \| null` | No | `-` | - |
144
143
  | `left` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
145
144
  | `lineHeight` | `inherit \| LineHeight` | No | `-` | - |
146
145
  | `loading` | `boolean` | No | `-` | Is the element currenty loading. When set to true, will disable element from press and keyboard events Is the element currenty loading. |
@@ -193,7 +192,7 @@ On web, all [ARIA attributes](https://developer.mozilla.org/en-US/docs/Web/Acces
193
192
  | `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
194
193
  | `position` | `absolute \| relative \| static` | No | `-` | - |
195
194
  | `pressRetentionOffset` | `number \| Insets \| null` | No | `-` | Additional distance outside of this view in which a touch is considered a press before onPressOut is triggered. |
196
- | `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). |
195
+ | `ref` | `null \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<View \| null>` | No | `-` | - |
197
196
  | `right` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
198
197
  | `rowGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
199
198
  | `style` | `StyleProp<ViewStyle> \| ((state: PressableStateCallbackType) => StyleProp<ViewStyle>)` | No | `-` | Either view styles or a function that receives a boolean reflecting whether the component is currently pressed and returns view styles. |
@@ -132,11 +132,10 @@ function Example() {
132
132
  | `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 | `primary` | Custom progress color. |
133
133
  | `disableAnimateOnMount` | `boolean` | No | `false` | Disable animation on component mount |
134
134
  | `disabled` | `boolean` | No | `-` | Toggle used to show a disabled progress visualization |
135
- | `key` | `Key \| null` | No | `-` | - |
136
135
  | `onAnimationEnd` | `(() => void)` | No | `-` | Callback fired when the progress animation ends. |
137
136
  | `onAnimationStart` | `(() => void)` | No | `-` | Callback fired when the progress animation starts. |
138
137
  | `progress` | `number` | No | `-` | Number between 0-1 representing the progress percentage |
139
- | `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). |
138
+ | `ref` | `null \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<View \| null>` | No | `-` | - |
140
139
  | `style` | `null \| false \| \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<Falsy \| ViewStyle \| RegisteredStyle<ViewStyle>>` | No | `-` | - |
141
140
  | `styles` | `{ root?: StyleProp<ViewStyle>; progress?: StyleProp<ViewStyle>; }` | No | `-` | Custom styles for individual elements of the ProgressBar component |
142
141
  | `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 |
@@ -306,11 +306,10 @@ function Example() {
306
306
  | `hideContent` | `boolean` | No | `-` | Toggle used to hide the content node rendered inside the circle. |
307
307
  | `hideText` | `boolean` | No | `-` | - |
308
308
  | `indeterminate` | `boolean` | No | `-` | Toggle used to show an indeterminate progress circle. |
309
- | `key` | `Key \| null` | No | `-` | - |
310
309
  | `onAnimationEnd` | `(() => void)` | No | `-` | Callback fired when the progress animation ends. |
311
310
  | `onAnimationStart` | `(() => void)` | No | `-` | Callback fired when the progress animation starts. |
312
311
  | `progress` | `number` | No | `-` | Number between 0-1 representing the progress percentage |
313
- | `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). |
312
+ | `ref` | `null \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<View \| null>` | No | `-` | - |
314
313
  | `size` | `number` | No | `-` | Optional size in px for the visualization. This is useful if the visualization is used in an HStack. If this is omitted the visualization will fill the parent width or height. Since its a circular visualization it will fill the smaller of the parent width or height |
315
314
  | `style` | `null \| false \| \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<Falsy \| ViewStyle \| RegisteredStyle<ViewStyle>>` | No | `-` | - |
316
315
  | `styles` | `{ root?: StyleProp<ViewStyle>; svgContainer?: StyleProp<ViewStyle>; svg?: StyleProp<ViewStyle>; textContainer?: StyleProp<ViewStyle>; progress?: Partial<CircleProps>; circle?: Partial<CircleProps> \| undefined; } \| undefined` | No | `-` | Custom styles for individual elements of the ProgressCircle component |
@@ -238,7 +238,7 @@ function AccessibleRadio() {
238
238
  | `onPointerUpCapture` | `((event: PointerEvent) => void)` | No | `-` | - |
239
239
  | `onPress` | `((event: GestureResponderEvent) => void) \| null` | No | `-` | Called when a single tap gesture is detected. |
240
240
  | `readOnly` | `boolean` | No | `-` | Set the control to ready-only. Similar effect as disabled. |
241
- | `ref` | `null \| RefObject<View \| null> \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly)` | No | `-` | - |
241
+ | `ref` | `null \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<View \| null>` | No | `-` | - |
242
242
  | `style` | `ViewStyle` | No | `-` | - |
243
243
  | `testID` | `string` | No | `-` | Used to locate this view in end-to-end tests. 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 |
244
244
  | `value` | `string` | No | `-` | Value of the option. Useful for multiple choice. |
@@ -181,7 +181,7 @@ function CustomRadioCellExample() {
181
181
  | `pressedBorderColor` | `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 | `-` | - |
182
182
  | `pressedBorderWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500` | No | `-` | - |
183
183
  | `readOnly` | `boolean` | No | `-` | Set the control to ready-only. Similar effect as disabled. |
184
- | `ref` | `null \| (instance: View \| null) => void \| RefObject<View \| null>` | No | `-` | - |
184
+ | `ref` | `null \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<View \| null>` | No | `-` | - |
185
185
  | `right` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
186
186
  | `rowGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
187
187
  | `styles` | `{ root?: StyleProp<ViewStyle>; radioContainer?: StyleProp<ViewStyle>; contentContainer?: StyleProp<ViewStyle>; title?: StyleProp<TextStyle>; description?: StyleProp<TextStyle>; }` | No | `-` | - |
@@ -257,7 +257,7 @@ function AdvancedCustomColors() {
257
257
  | `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. |
258
258
  | `onChange` | `((value: RadioValue, checked?: boolean \| undefined) => void) \| undefined` | No | `-` | Handle change event when pressing on a radio option. |
259
259
  | `radioAccessibilityLabel` | `string` | No | `-` | A11Y label to indicate order of radio buttons when focused on one button |
260
- | `ref` | `null \| RefObject<View \| null> \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly)` | No | `-` | - |
260
+ | `ref` | `null \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<View \| null>` | No | `-` | - |
261
261
  | `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 |
262
262
  | `value` | `string` | No | `-` | Currently selected value. |
263
263
 
@@ -92,7 +92,7 @@ If no images are shown, RemoteImage will show a default Fallback. Be aware that
92
92
  | `progressiveRenderingEnabled` | `boolean` | No | `-` | - |
93
93
  | `referrerPolicy` | `no-referrer \| no-referrer-when-downgrade \| origin \| origin-when-cross-origin \| same-origin \| strict-origin \| strict-origin-when-cross-origin \| unsafe-url` | No | `-` | A string indicating which referrer to use when fetching the resource. Similar to referrerpolicy from HTML. See https://reactnative.dev/docs/image#referrerpolicy |
94
94
  | `resizeMethod` | `none \| auto \| scale \| resize` | No | `-` | The mechanism that should be used to resize the image when the images dimensions differ from the image views dimensions. Defaults to auto. - auto: Use heuristics to pick between resize and scale. - resize: A software operation which changes the encoded image in memory before it gets decoded. This should be used instead of scale when the image is much larger than the view. - scale: The image gets drawn downscaled or upscaled. Compared to resize, scale is faster (usually hardware accelerated) and produces higher quality images. This should be used if the image is smaller than the view. It should also be used if the image is slightly bigger than the view. - none: No sampling is performed and the image is displayed in its full resolution. This should only be used in rare circumstances because it is considered unsafe as Android will throw a runtime exception when trying to render images that consume too much memory. More details about resize and scale can be found at http://frescolib.org/docs/resizing-rotating.html. |
95
- | `resizeMode` | `repeat \| none \| center \| stretch \| contain \| cover` | No | `-` | Determines how to resize the image when the frame doesnt match the raw image dimensions. cover: Scale the image uniformly (maintain the images aspect ratio) so that both dimensions (width and height) of the image will be equal to or larger than the corresponding dimension of the view (minus padding). contain: Scale the image uniformly (maintain the images aspect ratio) so that both dimensions (width and height) of the image will be equal to or less than the corresponding dimension of the view (minus padding). stretch: Scale width and height independently, This may change the aspect ratio of the src. repeat: Repeat the image to cover the frame of the view. The image will keep its size and aspect ratio. (iOS only) center: Scale the image down so that it is completely visible, if bigger than the area of the view. The image will not be scaled up. none: Do not resize the image. The image will be displayed at its intrinsic size. |
95
+ | `resizeMode` | `none \| center \| stretch \| contain \| cover \| repeat` | No | `-` | Determines how to resize the image when the frame doesnt match the raw image dimensions. cover: Scale the image uniformly (maintain the images aspect ratio) so that both dimensions (width and height) of the image will be equal to or larger than the corresponding dimension of the view (minus padding). contain: Scale the image uniformly (maintain the images aspect ratio) so that both dimensions (width and height) of the image will be equal to or less than the corresponding dimension of the view (minus padding). stretch: Scale width and height independently, This may change the aspect ratio of the src. repeat: Repeat the image to cover the frame of the view. The image will keep its size and aspect ratio. (iOS only) center: Scale the image down so that it is completely visible, if bigger than the area of the view. The image will not be scaled up. none: Do not resize the image. The image will be displayed at its intrinsic size. |
96
96
  | `shape` | `rectangle \| circle \| squircle \| square \| hexagon` | No | `square` | Shape of RemoteImage |
97
97
  | `shouldApplyDarkModeEnhacements` | `boolean` | No | `-` | - |
98
98
  | `size` | `s \| m \| l \| xl \| xxl \| xxxl` | No | `m` | Size for a given RemoteImage. If width or height is not defined, it will set size = m as default |
@@ -734,7 +734,7 @@ ValueSection
734
734
  | `columnGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
735
735
  | `dangerouslySetBackground` | `string \| OpaqueColorValue` | No | `-` | - |
736
736
  | `dangerouslySetColor` | `string \| OpaqueColorValue` | No | `-` | - |
737
- | `dataDetectorType` | `link \| none \| all \| email \| phoneNumber \| null` | No | `-` | Determines the types of data converted to clickable URLs in the text element. By default no data types are detected. |
737
+ | `dataDetectorType` | `none \| all \| link \| email \| phoneNumber \| null` | No | `-` | Determines the types of data converted to clickable URLs in the text element. By default no data types are detected. |
738
738
  | `digitTransitionVariant` | `every \| single` | No | `'every'` | Style of digit transition animation. - every: Rolls through every intermediate digit (e.g., 1→2→3→...→9). - single: Rolls directly to the new digit without showing intermediates (e.g., 1→9). |
739
739
  | `disabled` | `boolean` | No | `-` | Add disabled opacity style to text Specifies the disabled state of the text view for testing purposes. |
740
740
  | `display` | `flex \| none \| contents` | No | `-` | - |
@@ -758,7 +758,6 @@ ValueSection
758
758
  | `height` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
759
759
  | `id` | `string` | No | `-` | Used to reference react managed views from native code. |
760
760
  | `justifyContent` | `flex-start \| flex-end \| center \| space-between \| space-around \| space-evenly` | No | `-` | - |
761
- | `key` | `Key \| null` | No | `-` | - |
762
761
  | `left` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
763
762
  | `lineBreakMode` | `middle \| clip \| head \| tail` | No | `-` | Line Break mode. Works only with numberOfLines. clip is working only for iOS |
764
763
  | `lineBreakStrategyIOS` | `none \| standard \| hangul-word \| push-out` | No | `-` | Set line break strategy on iOS. |
@@ -802,7 +801,7 @@ ValueSection
802
801
  | `positivePulseColor` | `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 | `'fgPositive'` | Color token used for positive numeric changes. |
803
802
  | `prefix` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Content rendered before the formatted value. |
804
803
  | `pressRetentionOffset` | `{ top: number; left: number; bottom: number; right: number; }` | No | `-` | Defines how far your touch may move off of the button, before deactivating the button. |
805
- | `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). |
804
+ | `ref` | `null \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<View \| null>` | No | `-` | - |
806
805
  | `renderEmptyNode` | `boolean` | No | `-` | - |
807
806
  | `right` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
808
807
  | `rowGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
@@ -1011,14 +1011,13 @@ function MatchupBeaconLabels() {
1011
1011
  | `hideLine` | `boolean` | No | `-` | Hides the scrubber line. |
1012
1012
  | `hideOverlay` | `boolean` | No | `-` | Hides the overlay rect which obscures data beyond the scrubber position. |
1013
1013
  | `idlePulse` | `boolean` | No | `-` | Pulse the beacons while at rest. |
1014
- | `key` | `Key \| null` | No | `-` | - |
1015
1014
  | `label` | `string \| SkParagraph \| ((dataIndex: number) => string \| SkParagraph)` | No | `-` | Label text displayed above the scrubber line. Can be a static string or a function that receives the current dataIndex. |
1016
1015
  | `labelBoundsInset` | `number \| ChartInset` | No | `{ top: 4, bottom: 20, left: 12, right: 12 } when labelElevated is true, otherwise none` | Bounds inset for the scrubber line label to prevent cutoff at chart edges. |
1017
1016
  | `labelElevated` | `boolean` | No | `-` | Whether to elevate the label with a shadow. When true, applies elevation and automatically adds bounds to keep label within chart area. |
1018
1017
  | `labelFont` | `display1 \| display2 \| display3 \| title1 \| title2 \| title3 \| title4 \| headline \| body \| label1 \| label2 \| caption \| legal` | No | `-` | Font style for the scrubber line label. |
1019
1018
  | `lineStroke` | `string` | No | `-` | Stroke color for the scrubber line. |
1020
1019
  | `overlayOffset` | `number` | No | `2` | Offset of the overlay rect relative to the drawing area. Useful for when scrubbing over lines, where the stroke width would cause part of the line to be visible. |
1021
- | `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). |
1020
+ | `ref` | `null \| (instance: ScrubberBeaconGroupRef \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<ScrubberBeaconGroupRef \| null>` | No | `-` | - |
1022
1021
  | `seriesIds` | `string[]` | No | `-` | Array of series IDs to highlight when scrubbing with scrubber beacons. By default, all series will be highlighted. |
1023
1022
  | `transitions` | `{ enter?: Transition \| null; update?: Transition \| null \| undefined; pulse?: Transition \| undefined; pulseRepeatDelay?: number \| undefined; } \| undefined` | No | `-` | Transition configuration for the scrubber. Controls enter, update, and pulse animations for beacons and beacon labels. |
1024
1023
 
@@ -136,7 +136,7 @@ function SearchInputVariants() {
136
136
  | `enableColorSurge` | `boolean` | No | `-` | Enable Color Surge motion |
137
137
  | `enablesReturnKeyAutomatically` | `boolean` | No | `-` | If true, the keyboard disables the return key when there is no text and automatically enables it when there is text. The default value is false. |
138
138
  | `end` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `undefined` | Set the end node Adds content to the end of the inner input. Refer to diagram for location of endNode in InputStack component |
139
- | `enterKeyHint` | `search \| done \| go \| next \| send \| previous \| enter` | No | `-` | Determines what text should be shown to the return key on virtual keyboards. Has precedence over the returnKeyType prop. |
139
+ | `enterKeyHint` | `done \| search \| go \| next \| send \| previous \| enter` | No | `-` | Determines what text should be shown to the return key on virtual keyboards. Has precedence over the returnKeyType prop. |
140
140
  | `focusedBorderWidth` | `0 \| 100 \| 200 \| 300 \| 400 \| 500` | No | `borderWidth` | Additional border width when focused. |
141
141
  | `font` | `display1 \| display2 \| display3 \| title1 \| title2 \| title3 \| title4 \| headline \| body \| label1 \| label2 \| caption \| legal` | No | `body` | Typography font token for the field (passed through to NativeInput as font), same token family as align. |
142
142
  | `height` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | Height of input |
@@ -150,8 +150,7 @@ function SearchInputVariants() {
150
150
  | `inputAccessoryViewButtonLabel` | `string` | No | `-` | An optional label that overrides the default input accessory view button label. |
151
151
  | `inputAccessoryViewID` | `string` | No | `-` | Used to connect to an InputAccessoryView. Not part of react-natives documentation, but present in examples and code. See https://reactnative.dev/docs/inputaccessoryview for more information. |
152
152
  | `inputBackground` | `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 | `'bg'` | Background color of the input |
153
- | `inputMode` | `search \| none \| text \| email \| tel \| url \| numeric \| decimal` | No | `-` | Works like the inputmode attribute in HTML, it determines which keyboard to open, e.g. numeric and has precedence over keyboardType. |
154
- | `key` | `Key \| null` | No | `-` | - |
153
+ | `inputMode` | `none \| text \| search \| email \| tel \| url \| numeric \| decimal` | No | `-` | Works like the inputmode attribute in HTML, it determines which keyboard to open, e.g. numeric and has precedence over keyboardType. |
155
154
  | `keyboardAppearance` | `light \| default \| dark` | No | `-` | Determines the color of the keyboard. |
156
155
  | `keyboardType` | `default \| url \| number-pad \| decimal-pad \| numeric \| email-address \| phone-pad \| visible-password \| ascii-capable \| numbers-and-punctuation \| name-phone-pad \| twitter \| web-search` | No | `-` | enum(default, numeric, email-address, ascii-capable, numbers-and-punctuation, url, number-pad, phone-pad, name-phone-pad, decimal-pad, twitter, web-search, visible-password) Determines which keyboard to open, e.g.numeric. The following values work across platforms: - default - numeric - email-address - phone-pad The following values work on iOS: - ascii-capable - numbers-and-punctuation - url - number-pad - name-phone-pad - decimal-pad - twitter - web-search The following values work on Android: - visible-password |
157
156
  | `label` | `string` | No | `-` | Short messageArea indicating purpose of input |
@@ -198,10 +197,10 @@ function SearchInputVariants() {
198
197
  | `placeholder` | `string` | No | `-` | Placeholder text displayed inside of the input. Will be replaced if there is a value. The string that will be rendered before text input has been entered |
199
198
  | `placeholderTextColor` | `string \| OpaqueColorValue` | No | `-` | The text color of the placeholder string |
200
199
  | `readOnly` | `boolean` | No | `-` | When true, the value cannot be edited but the control may remain focusable (unlike disabled). If true, text is not editable. The default value is false. |
201
- | `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). |
200
+ | `ref` | `null \| (instance: TextInput \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<TextInput \| null>` | No | `-` | - |
202
201
  | `rejectResponderTermination` | `boolean \| null` | No | `-` | If true, allows TextInput to pass touch events to the parent component. This allows components to be swipeable from the TextInput on iOS, as is the case on Android by default. If false, TextInput always asks to handle the input (except when disabled). |
203
202
  | `returnKeyLabel` | `string` | No | `-` | Sets the return key to the label. Use it instead of returnKeyType. |
204
- | `returnKeyType` | `join \| search \| done \| none \| default \| go \| next \| send \| previous \| google \| route \| yahoo \| emergency-call` | No | `-` | enum(default, go, google, join, next, route, search, send, yahoo, done, emergency-call) Determines how the return key should look. |
203
+ | `returnKeyType` | `join \| done \| none \| search \| default \| go \| next \| send \| previous \| google \| route \| yahoo \| emergency-call` | No | `-` | enum(default, go, google, join, next, route, search, send, yahoo, done, emergency-call) Determines how the return key should look. |
205
204
  | `scrollEnabled` | `boolean` | No | `-` | If false, scrolling of the text view will be disabled. The default value is true. Only works with multiline={true} |
206
205
  | `secureTextEntry` | `boolean` | No | `-` | If true, the text input obscures the text entered so that sensitive text like passwords stay secure. The default value is false. |
207
206
  | `selectTextOnFocus` | `boolean` | No | `-` | If true, all text will automatically be selected on focus |
@@ -198,8 +198,7 @@ Note: The mobile version of SectionHeader is optimized for touch interactions an
198
198
  | `end` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | - |
199
199
  | `icon` | `string \| number \| bigint \| boolean \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode> \| null` | No | `-` | - |
200
200
  | `iconActive` | `boolean` | No | `-` | Whether the icon is active |
201
- | `key` | `Key \| null` | No | `-` | - |
202
- | `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). |
201
+ | `ref` | `null \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<View \| null>` | No | `-` | - |
203
202
  | `start` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | - |
204
203
  | `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 |
205
204
 
@@ -388,7 +388,7 @@ function Example() {
388
388
  | `paddingY` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
389
389
  | `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
390
390
  | `position` | `absolute \| relative \| static` | No | `-` | - |
391
- | `ref` | `null \| (instance: View \| null) => void \| RefObject<View \| null>` | No | `-` | - |
391
+ | `ref` | `null \| RefObject<View \| null> \| (instance: View \| null) => void` | No | `-` | - |
392
392
  | `right` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
393
393
  | `rowGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
394
394
  | `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 | `-` | - |
@@ -187,7 +187,7 @@ When using the `inside` label variant, you should always include a `placeholder`
187
187
  | `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. |
188
188
  | `onChange` | `((value: RadioValue, checked?: boolean \| undefined) => void) \| undefined` | No | `-` | Handle change event when pressing on a radio option. |
189
189
  | `radioAccessibilityLabel` | `string` | No | `-` | A11Y label to indicate order of radio buttons when focused on one button |
190
- | `ref` | `null \| RefObject<View \| null> \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly)` | No | `-` | - |
190
+ | `ref` | `null \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<View \| null>` | No | `-` | - |
191
191
  | `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 |
192
192
  | `value` | `string` | No | `-` | Currently selected value. |
193
193
 
@@ -250,7 +250,6 @@ function SelectChipExample() {
250
250
  | `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. |
251
251
  | `inverted` | `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. |
252
252
  | `justifyContent` | `flex-start \| flex-end \| center \| space-between \| space-around \| space-evenly` | No | `-` | - |
253
- | `key` | `Key \| null` | No | `-` | - |
254
253
  | `left` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
255
254
  | `lineHeight` | `inherit \| LineHeight` | No | `-` | - |
256
255
  | `loading` | `boolean` | No | `-` | Is the element currenty loading. When set to true, will disable element from press and keyboard events Is the element currenty loading. |
@@ -305,7 +304,7 @@ function SelectChipExample() {
305
304
  | `preventDismissGestures` | `boolean` | No | `-` | Prevents a user from dismissing the drawer by pressing the overlay or swiping |
306
305
  | `preventHardwareBackBehaviorAndroid` | `boolean` | No | `-` | Prevents a user from dismissing the drawer by pressing hardware back button on Android |
307
306
  | `reduceMotion` | `boolean` | No | `-` | When true, the drawer opens and closes with an opacity fade instead of a slide animation. Swipe-to-dismiss gestures remain enabled and use the slide transform so the drawer follows the users finger naturally. |
308
- | `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). |
307
+ | `ref` | `null \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<View \| null>` | No | `-` | - |
309
308
  | `right` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
310
309
  | `rowGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
311
310
  | `start` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | ReactNode placed before the value |
@@ -401,7 +401,6 @@ function Example() {
401
401
  | `gap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
402
402
  | `height` | `number \| AnimatedNode & number` | No | `40px for compact variant, 56px for regular variant` | Height of the entire button component (background and handle). If you pass a custom SlideButtonBackgroundComponent or SlideButtonHandleComponent, this property will be applied to both. |
403
403
  | `justifyContent` | `flex-start \| flex-end \| center \| space-between \| space-around \| space-evenly` | No | `-` | - |
404
- | `key` | `Key \| null` | No | `-` | - |
405
404
  | `left` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
406
405
  | `lineHeight` | `inherit \| LineHeight` | No | `-` | - |
407
406
  | `margin` | `0 \| -1 \| -2 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10 \| -0.25 \| -0.5 \| -0.75 \| -1.5` | No | `-` | - |
@@ -447,7 +446,7 @@ function Example() {
447
446
  | `paddingY` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
448
447
  | `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
449
448
  | `position` | `absolute \| relative \| static` | No | `-` | - |
450
- | `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). |
449
+ | `ref` | `null \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<View \| null>` | No | `-` | - |
451
450
  | `right` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
452
451
  | `rowGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
453
452
  | `startUncheckedNode` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Custom start node to render for the unchecked state of the handle, to replace the default arrow icon. |
@@ -116,9 +116,8 @@ function Example() {
116
116
  | `background` | `string` | No | `-` | - |
117
117
  | `children` | `null \| false \| ReactElement<SparklineAreaBaseProps, string \| JSXElementConstructor<any>> \| OptionalElement<SparklineAreaBaseProps>[]` | No | `-` | an optional SparklineArea that can be used to fill in the Sparkline |
118
118
  | `fillType` | `dotted \| gradient \| gradientDotted` | No | `'dotted'` | Type of fill to use for the area |
119
- | `key` | `Key \| null` | No | `-` | - |
120
119
  | `path` | `string` | No | `-` | Svg path as string. CDS offers a useSparklinePath which is useful to generate this string. This is accessible via import { useSparklinePath } from @coinbase/cds-common/visualizations/useSparklinePath;. Alternatively, you can use product tailored tooling to generate the SVG path. This component only requires a valid path string is provided. |
121
- | `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). |
120
+ | `ref` | `Ref<Path \| null>` | No | `-` | - |
122
121
  | `strokeType` | `solid \| gradient` | No | `'solid'` | Type of stroke to use for the line - gradient: Gradient colored stroke line - solid: Solid colored stroke line |
123
122
  | `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 |
124
123
  | `yAxisScalingFactor` | `number` | No | `-` | Scales the sparkline to show more or less variance. Use a number less than 1 for less variance and a number greater than 1 for more variance. If you use a number greater than 1 it may clip the boundaries of the sparkline. |
@@ -100,9 +100,8 @@ function Example() {
100
100
  | `background` | `string` | No | `-` | - |
101
101
  | `children` | `null \| false \| ReactElement<SparklineAreaBaseProps, string \| JSXElementConstructor<any>> \| OptionalElement<SparklineAreaBaseProps>[]` | No | `-` | an optional SparklineArea that can be used to fill in the Sparkline |
102
102
  | `fillType` | `dotted \| gradient \| gradientDotted` | No | `'dotted'` | Type of fill to use for the area |
103
- | `key` | `Key \| null` | No | `-` | - |
104
103
  | `path` | `string` | No | `-` | Svg path as string. CDS offers a useSparklinePath which is useful to generate this string. This is accessible via import { useSparklinePath } from @coinbase/cds-common/visualizations/useSparklinePath;. Alternatively, you can use product tailored tooling to generate the SVG path. This component only requires a valid path string is provided. |
105
- | `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). |
104
+ | `ref` | `Ref<Path \| null>` | No | `-` | - |
106
105
  | `strokeType` | `solid \| gradient` | No | `'solid'` | Type of stroke to use for the line - gradient: Gradient colored stroke line - solid: Solid colored stroke line |
107
106
  | `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 |
108
107
  | `yAxisScalingFactor` | `number` | No | `-` | Scales the sparkline to show more or less variance. Use a number less than 1 for less variance and a number greater than 1 for more variance. If you use a number greater than 1 it may clip the boundaries of the sparkline. |
@@ -112,9 +112,8 @@ The fill will be added by default
112
112
  | `compact` | `boolean` | No | `-` | Reduce the font size used for the header itself. |
113
113
  | `defaultLabel` | `string` | No | `-` | Default label, changing this prop has no effect once the default is rendered. |
114
114
  | `defaultSubHead` | `SparklineInteractiveSubHead` | No | `-` | Default SubHead, changing this prop has no effect once the default is rendered. |
115
- | `key` | `Key \| null` | No | `-` | - |
116
115
  | `labelNode` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Adds a label node that allows React components. If you use this node then you cannot use the text based label that supports updates. |
117
- | `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). |
116
+ | `ref` | `null \| (instance: SparklineInteractiveHeaderRef \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<SparklineInteractiveHeaderRef \| null>` | No | `-` | - |
118
117
  | `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 |
119
118
  | `trailing` | `null \| string \| number \| bigint \| false \| true \| ReactElement<unknown, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| Promise<AwaitedReactNode>` | No | `-` | Adds content next to the header. This is useful for interactive buttons |
120
119
 
@@ -605,7 +605,7 @@ It accepts an object with the following optional keys:
605
605
  | `position` | `absolute \| relative \| static` | No | `-` | - |
606
606
  | `progressSpringConfig` | `Partial<AnimationConfig>` | No | `-` | - |
607
607
  | `progressTimingConfig` | `TimingConfig` | No | `-` | The timing config to use for the progress animation. |
608
- | `ref` | `null \| RefObject<View \| null> \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly)` | No | `-` | - |
608
+ | `ref` | `null \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<View \| null>` | No | `-` | - |
609
609
  | `right` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
610
610
  | `rowGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
611
611
  | `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 | `-` | - |
@@ -93,7 +93,6 @@ function ElevationSwitchDemo() {
93
93
  | `disabled` | `boolean` | No | `-` | Disable user interaction. |
94
94
  | `elevation` | `0 \| 1 \| 2` | No | `-` | Sets the elevation/drop shadow of the control. |
95
95
  | `indeterminate` | `boolean` | No | `-` | Enable indeterminate state. Useful when you want to indicate that sub-items of a control are partially filled. |
96
- | `key` | `Key \| null` | No | `-` | - |
97
96
  | `onChange` | `((value: string, checked?: boolean \| undefined) => void) \| undefined` | No | `-` | Toggle control selected state. |
98
97
  | `onPointerCancel` | `((event: PointerEvent) => void)` | No | `-` | - |
99
98
  | `onPointerCancelCapture` | `((event: PointerEvent) => void)` | No | `-` | - |
@@ -109,7 +108,7 @@ function ElevationSwitchDemo() {
109
108
  | `onPointerUpCapture` | `((event: PointerEvent) => void)` | No | `-` | - |
110
109
  | `onPress` | `((event: GestureResponderEvent) => void) \| null` | No | `-` | Called when a single tap gesture is detected. |
111
110
  | `readOnly` | `boolean` | No | `-` | Set the control to ready-only. Similar effect as disabled. |
112
- | `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). |
111
+ | `ref` | `null \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<View \| null>` | No | `-` | - |
113
112
  | `style` | `ViewStyle` | No | `-` | - |
114
113
  | `styles` | `{ root?: StyleProp<ViewStyle>; control?: StyleProp<ViewStyle>; }` | No | `-` | Slot-level styles for Switch. |
115
114
  | `testID` | `string` | No | `-` | Used to locate this view in end-to-end tests. 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 |
@@ -43,8 +43,7 @@ function TabIndicatorExample() {
43
43
  | `width` | `number` | Yes | `-` | The width of the active TabLabel. |
44
44
  | `x` | `number` | Yes | `-` | The xPosition of the active TabLabel. |
45
45
  | `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 | `: 'bg'` | This should always match the background color of the parent container |
46
- | `key` | `Key \| null` | No | `-` | - |
47
- | `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). |
46
+ | `ref` | `null \| (instance: View \| null) => void \| (() => VoidOrUndefinedOnly) \| RefObject<View \| null>` | No | `-` | - |
48
47
  | `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 |
49
48
 
50
49
 
@@ -72,7 +72,7 @@ import { TabLabel } from '@coinbase/cds-mobile/tabs/TabLabel'
72
72
  | `count` | `number` | No | `-` | The number value to be shown in the dot. If count is <= 0, dot will not show up. |
73
73
  | `dangerouslySetBackground` | `string \| OpaqueColorValue` | No | `-` | - |
74
74
  | `dangerouslySetColor` | `string \| OpaqueColorValue` | No | `-` | - |
75
- | `dataDetectorType` | `link \| none \| all \| email \| phoneNumber \| null` | No | `-` | Determines the types of data converted to clickable URLs in the text element. By default no data types are detected. |
75
+ | `dataDetectorType` | `none \| all \| link \| email \| phoneNumber \| null` | No | `-` | Determines the types of data converted to clickable URLs in the text element. By default no data types are detected. |
76
76
  | `disabled` | `boolean` | No | `-` | Add disabled opacity style to text Specifies the disabled state of the text view for testing purposes. |
77
77
  | `display` | `flex \| none \| contents` | No | `-` | - |
78
78
  | `dynamicTypeRamp` | `title1 \| title2 \| title3 \| headline \| body \| caption2 \| caption1 \| footnote \| subheadline \| callout \| largeTitle` | No | `-` | The Dynamic Type scale ramp to apply to this element on iOS. |
@@ -127,7 +127,7 @@ import A11y from './a11y.mdx';
127
127
  | `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
128
128
  | `position` | `absolute \| relative \| static` | No | `-` | - |
129
129
  | `previousArrowAccessibilityLabel` | `string` | No | `-` | Web only. Accessibility label for the previous arrow paddle (skip to beginning). |
130
- | `ref` | `null \| (instance: View \| null) => void \| RefObject<View \| null>` | No | `-` | - |
130
+ | `ref` | `null \| RefObject<View \| null> \| (instance: View \| null) => void` | No | `-` | - |
131
131
  | `right` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
132
132
  | `role` | `radiogroup \| tablist` | No | `tablist` | Used to generate a11y attributes for the Tabs If TabNavigation is used to display options that will filter data, use radiogroup If TabNavigation is used to display a list of pages or views, use tablist |
133
133
  | `rowGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
@@ -126,7 +126,7 @@ function TabbedChipsExample() {
126
126
  | `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
127
127
  | `position` | `absolute \| relative \| static` | No | `-` | - |
128
128
  | `previousArrowAccessibilityLabel` | `string` | No | `-` | Web only. Accessibility label for the previous arrow paddle (skip to beginning). |
129
- | `ref` | `null \| (instance: View \| null) => void \| RefObject<View \| null>` | No | `-` | - |
129
+ | `ref` | `null \| RefObject<View \| null> \| (instance: View \| null) => void` | No | `-` | - |
130
130
  | `right` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
131
131
  | `role` | `radiogroup \| tablist` | No | `tablist` | Used to generate a11y attributes for the Tabs If TabNavigation is used to display options that will filter data, use radiogroup If TabNavigation is used to display a list of pages or views, use tablist |
132
132
  | `rowGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
@@ -263,7 +263,7 @@ render(<Example />);
263
263
  | `paddingY` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
264
264
  | `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
265
265
  | `position` | `absolute \| relative \| static` | No | `-` | - |
266
- | `ref` | `null \| (instance: View \| null) => void \| RefObject<View \| null>` | No | `-` | - |
266
+ | `ref` | `null \| RefObject<View \| null> \| (instance: View \| null) => void` | No | `-` | - |
267
267
  | `right` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
268
268
  | `rowGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
269
269
  | `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 | `-` | - |
@@ -324,7 +324,7 @@ function Example() {
324
324
  | `paddingY` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
325
325
  | `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
326
326
  | `position` | `absolute \| relative \| static` | No | `absolute` | - |
327
- | `ref` | `null \| (instance: View \| null) => void \| RefObject<View \| null>` | No | `-` | - |
327
+ | `ref` | `null \| RefObject<View \| null> \| (instance: View \| null) => void` | No | `-` | - |
328
328
  | `right` | `null \| number \| AnimatedNode \| auto \| ${number}%` | No | `-` | - |
329
329
  | `rowGap` | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10 \| 0.25 \| 0.5 \| 0.75 \| 1.5` | No | `-` | - |
330
330
  | `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 | `-` | - |