@coinbase/cds-mcp-server 8.21.8 → 8.22.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +12 -0
- package/mcp-docs/mobile/components/AreaChart.txt +39 -37
- package/mcp-docs/mobile/components/Avatar.txt +18 -18
- package/mcp-docs/mobile/components/AvatarButton.txt +19 -19
- package/mcp-docs/mobile/components/Banner.txt +62 -23
- package/mcp-docs/mobile/components/BarChart.txt +37 -35
- package/mcp-docs/mobile/components/Box.txt +18 -18
- package/mcp-docs/mobile/components/BrowserBar.txt +18 -18
- package/mcp-docs/mobile/components/Button.txt +19 -19
- package/mcp-docs/mobile/components/Carousel.txt +18 -18
- package/mcp-docs/mobile/components/CartesianChart.txt +75 -44
- package/mcp-docs/mobile/components/CheckboxCell.txt +19 -19
- package/mcp-docs/mobile/components/Chip.txt +20 -20
- package/mcp-docs/mobile/components/Coachmark.txt +18 -18
- package/mcp-docs/mobile/components/ContentCard.txt +18 -18
- package/mcp-docs/mobile/components/ContentCardBody.txt +18 -18
- package/mcp-docs/mobile/components/ContentCardFooter.txt +18 -18
- package/mcp-docs/mobile/components/ContentCardHeader.txt +18 -18
- package/mcp-docs/mobile/components/ContentCell.txt +18 -18
- package/mcp-docs/mobile/components/ControlGroup.txt +18 -18
- package/mcp-docs/mobile/components/DatePicker.txt +1 -1
- package/mcp-docs/mobile/components/Divider.txt +18 -18
- package/mcp-docs/mobile/components/DotCount.txt +1 -1
- package/mcp-docs/mobile/components/DotSymbol.txt +2 -2
- package/mcp-docs/mobile/components/Fallback.txt +18 -18
- package/mcp-docs/mobile/components/HStack.txt +18 -18
- package/mcp-docs/mobile/components/Icon.txt +6 -0
- package/mcp-docs/mobile/components/IconButton.txt +19 -19
- package/mcp-docs/mobile/components/InputChip.txt +20 -20
- package/mcp-docs/mobile/components/Interactable.txt +19 -19
- package/mcp-docs/mobile/components/LineChart.txt +1608 -898
- package/mcp-docs/mobile/components/Link.txt +18 -18
- package/mcp-docs/mobile/components/ListCell.txt +37 -19
- package/mcp-docs/mobile/components/Lottie.txt +18 -18
- package/mcp-docs/mobile/components/MediaChip.txt +20 -20
- package/mcp-docs/mobile/components/MultiContentModule.txt +18 -18
- package/mcp-docs/mobile/components/NavigationTitle.txt +18 -18
- package/mcp-docs/mobile/components/NavigationTitleSelect.txt +18 -18
- package/mcp-docs/mobile/components/Numpad.txt +18 -18
- package/mcp-docs/mobile/components/Overlay.txt +18 -18
- package/mcp-docs/mobile/components/PageFooter.txt +17 -17
- package/mcp-docs/mobile/components/PageHeader.txt +17 -17
- package/mcp-docs/mobile/components/PeriodSelector.txt +26 -26
- package/mcp-docs/mobile/components/Point.txt +203 -98
- package/mcp-docs/mobile/components/Pressable.txt +19 -19
- package/mcp-docs/mobile/components/ProgressBar.txt +1 -1
- package/mcp-docs/mobile/components/ProgressBarWithFixedLabels.txt +1 -1
- package/mcp-docs/mobile/components/ProgressBarWithFloatLabel.txt +1 -1
- package/mcp-docs/mobile/components/ProgressCircle.txt +1 -1
- package/mcp-docs/mobile/components/RadioCell.txt +19 -19
- package/mcp-docs/mobile/components/ReferenceLine.txt +197 -54
- package/mcp-docs/mobile/components/RollingNumber.txt +18 -18
- package/mcp-docs/mobile/components/Scrubber.txt +597 -79
- package/mcp-docs/mobile/components/SegmentedTabs.txt +18 -18
- package/mcp-docs/mobile/components/SelectAlpha.txt +1 -1
- package/mcp-docs/mobile/components/SelectChip.txt +20 -20
- package/mcp-docs/mobile/components/SlideButton.txt +19 -19
- package/mcp-docs/mobile/components/Spacer.txt +6 -6
- package/mcp-docs/mobile/components/SparklineInteractive.txt +3 -3
- package/mcp-docs/mobile/components/Spinner.txt +1 -1
- package/mcp-docs/mobile/components/Stepper.txt +18 -18
- package/mcp-docs/mobile/components/TabLabel.txt +18 -18
- package/mcp-docs/mobile/components/TabNavigation.txt +18 -18
- package/mcp-docs/mobile/components/TabbedChips.txt +18 -18
- package/mcp-docs/mobile/components/TabbedChipsAlpha.txt +1 -1
- package/mcp-docs/mobile/components/Tabs.txt +18 -18
- package/mcp-docs/mobile/components/Tag.txt +18 -18
- package/mcp-docs/mobile/components/Text.txt +18 -18
- package/mcp-docs/mobile/components/Toast.txt +18 -18
- package/mcp-docs/mobile/components/Tooltip.txt +17 -1
- package/mcp-docs/mobile/components/TopNavBar.txt +18 -18
- package/mcp-docs/mobile/components/VStack.txt +18 -18
- package/mcp-docs/mobile/components/XAxis.txt +86 -24
- package/mcp-docs/mobile/components/YAxis.txt +75 -17
- package/mcp-docs/mobile/routes.txt +1 -1
- package/mcp-docs/web/components/AreaChart.txt +523 -301
- package/mcp-docs/web/components/Avatar.txt +27 -27
- package/mcp-docs/web/components/AvatarButton.txt +28 -28
- package/mcp-docs/web/components/Banner.txt +71 -32
- package/mcp-docs/web/components/BarChart.txt +182 -313
- package/mcp-docs/web/components/Box.txt +28 -28
- package/mcp-docs/web/components/Button.txt +28 -28
- package/mcp-docs/web/components/Calendar.txt +27 -27
- package/mcp-docs/web/components/Carousel.txt +27 -27
- package/mcp-docs/web/components/CartesianChart.txt +62 -309
- package/mcp-docs/web/components/CheckboxCell.txt +25 -25
- package/mcp-docs/web/components/Chip.txt +27 -27
- package/mcp-docs/web/components/Coachmark.txt +27 -27
- package/mcp-docs/web/components/ContainedAssetCard.txt +27 -27
- package/mcp-docs/web/components/ContentCard.txt +28 -28
- package/mcp-docs/web/components/ContentCardBody.txt +28 -28
- package/mcp-docs/web/components/ContentCardFooter.txt +28 -28
- package/mcp-docs/web/components/ContentCardHeader.txt +28 -28
- package/mcp-docs/web/components/ContentCell.txt +28 -28
- package/mcp-docs/web/components/ControlGroup.txt +27 -27
- package/mcp-docs/web/components/Divider.txt +27 -27
- package/mcp-docs/web/components/Fallback.txt +28 -28
- package/mcp-docs/web/components/FloatingAssetCard.txt +27 -27
- package/mcp-docs/web/components/Grid.txt +28 -28
- package/mcp-docs/web/components/GridColumn.txt +27 -27
- package/mcp-docs/web/components/HStack.txt +28 -28
- package/mcp-docs/web/components/Icon.txt +27 -27
- package/mcp-docs/web/components/IconButton.txt +28 -28
- package/mcp-docs/web/components/InputChip.txt +27 -27
- package/mcp-docs/web/components/Interactable.txt +28 -28
- package/mcp-docs/web/components/LineChart.txt +1598 -1116
- package/mcp-docs/web/components/Link.txt +28 -28
- package/mcp-docs/web/components/ListCell.txt +48 -30
- package/mcp-docs/web/components/Lottie.txt +27 -27
- package/mcp-docs/web/components/MediaChip.txt +27 -27
- package/mcp-docs/web/components/Modal.txt +27 -27
- package/mcp-docs/web/components/ModalBody.txt +27 -27
- package/mcp-docs/web/components/ModalFooter.txt +27 -27
- package/mcp-docs/web/components/ModalHeader.txt +27 -27
- package/mcp-docs/web/components/MultiContentModule.txt +28 -28
- package/mcp-docs/web/components/NavigationBar.txt +5 -5
- package/mcp-docs/web/components/NudgeCard.txt +27 -27
- package/mcp-docs/web/components/Overlay.txt +27 -27
- package/mcp-docs/web/components/PageFooter.txt +26 -26
- package/mcp-docs/web/components/PageHeader.txt +26 -26
- package/mcp-docs/web/components/Pagination.txt +27 -27
- package/mcp-docs/web/components/PeriodSelector.txt +49 -49
- package/mcp-docs/web/components/Point.txt +228 -79
- package/mcp-docs/web/components/Pressable.txt +28 -28
- package/mcp-docs/web/components/RadioCell.txt +25 -25
- package/mcp-docs/web/components/ReferenceLine.txt +208 -60
- package/mcp-docs/web/components/RemoteImage.txt +26 -26
- package/mcp-docs/web/components/RollingNumber.txt +28 -28
- package/mcp-docs/web/components/Scrubber.txt +463 -68
- package/mcp-docs/web/components/SectionHeader.txt +27 -27
- package/mcp-docs/web/components/SegmentedTabs.txt +27 -27
- package/mcp-docs/web/components/SelectChip.txt +27 -27
- package/mcp-docs/web/components/SelectOption.txt +27 -27
- package/mcp-docs/web/components/Sidebar.txt +27 -27
- package/mcp-docs/web/components/SidebarItem.txt +27 -27
- package/mcp-docs/web/components/Spacer.txt +34 -34
- package/mcp-docs/web/components/SparklineInteractive.txt +1 -1
- package/mcp-docs/web/components/Spinner.txt +27 -27
- package/mcp-docs/web/components/Stepper.txt +27 -27
- package/mcp-docs/web/components/TabLabel.txt +27 -27
- package/mcp-docs/web/components/TabNavigation.txt +26 -26
- package/mcp-docs/web/components/TabbedChips.txt +26 -26
- package/mcp-docs/web/components/TabbedChipsAlpha.txt +1 -1
- package/mcp-docs/web/components/Tabs.txt +27 -27
- package/mcp-docs/web/components/Tag.txt +27 -27
- package/mcp-docs/web/components/Text.txt +28 -28
- package/mcp-docs/web/components/TileButton.txt +28 -28
- package/mcp-docs/web/components/Toast.txt +27 -27
- package/mcp-docs/web/components/Tooltip.txt +17 -1
- package/mcp-docs/web/components/VStack.txt +28 -28
- package/mcp-docs/web/components/XAxis.txt +86 -22
- package/mcp-docs/web/components/YAxis.txt +133 -89
- package/package.json +1 -1
|
@@ -244,7 +244,7 @@ function Example() {
|
|
|
244
244
|
| `borderedVertical` | `boolean` | No | `-` | Add a border to the top and bottom sides of the box. |
|
|
245
245
|
| `bottom` | `string \| number` | No | `-` | - |
|
|
246
246
|
| `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 | `-` | - |
|
|
247
|
-
| `columnGap` | `0 \| 1 \| 2 \|
|
|
247
|
+
| `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
248
248
|
| `dangerouslySetBackground` | `string` | No | `-` | - |
|
|
249
249
|
| `disabled` | `boolean` | No | `-` | Disable interactions on all the tabs. |
|
|
250
250
|
| `display` | `flex \| none` | No | `-` | - |
|
|
@@ -258,18 +258,18 @@ function Example() {
|
|
|
258
258
|
| `fontFamily` | `inherit \| FontFamily` | No | `-` | - |
|
|
259
259
|
| `fontSize` | `inherit \| FontSize` | No | `-` | - |
|
|
260
260
|
| `fontWeight` | `inherit \| FontWeight` | No | `-` | - |
|
|
261
|
-
| `gap` | `0 \| 1 \| 2 \|
|
|
261
|
+
| `gap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
262
262
|
| `height` | `string \| number` | No | `-` | - |
|
|
263
263
|
| `justifyContent` | `flex-start \| flex-end \| center \| space-between \| space-around \| space-evenly` | No | `-` | - |
|
|
264
264
|
| `left` | `string \| number` | No | `-` | - |
|
|
265
265
|
| `lineHeight` | `inherit \| LineHeight` | No | `-` | - |
|
|
266
|
-
| `margin` | `0 \| -1 \| -2 \| -
|
|
267
|
-
| `marginBottom` | `0 \| -1 \| -2 \| -
|
|
268
|
-
| `marginEnd` | `0 \| -1 \| -2 \| -
|
|
269
|
-
| `marginStart` | `0 \| -1 \| -2 \| -
|
|
270
|
-
| `marginTop` | `0 \| -1 \| -2 \| -
|
|
271
|
-
| `marginX` | `0 \| -1 \| -2 \| -
|
|
272
|
-
| `marginY` | `0 \| -1 \| -2 \| -
|
|
266
|
+
| `margin` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
267
|
+
| `marginBottom` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
268
|
+
| `marginEnd` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
269
|
+
| `marginStart` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
270
|
+
| `marginTop` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
271
|
+
| `marginX` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
272
|
+
| `marginY` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
273
273
|
| `maxHeight` | `string \| number` | No | `-` | - |
|
|
274
274
|
| `maxWidth` | `string \| number` | No | `-` | - |
|
|
275
275
|
| `minHeight` | `string \| number` | No | `-` | - |
|
|
@@ -289,18 +289,18 @@ function Example() {
|
|
|
289
289
|
| `onPointerUpCapture` | `((event: PointerEvent) => void)` | No | `-` | - |
|
|
290
290
|
| `opacity` | `number \| AnimatedNode` | No | `-` | - |
|
|
291
291
|
| `overflow` | `visible \| hidden \| scroll` | No | `-` | - |
|
|
292
|
-
| `padding` | `0 \| 1 \| 2 \|
|
|
293
|
-
| `paddingBottom` | `0 \| 1 \| 2 \|
|
|
294
|
-
| `paddingEnd` | `0 \| 1 \| 2 \|
|
|
295
|
-
| `paddingStart` | `0 \| 1 \| 2 \|
|
|
296
|
-
| `paddingTop` | `0 \| 1 \| 2 \|
|
|
297
|
-
| `paddingX` | `0 \| 1 \| 2 \|
|
|
298
|
-
| `paddingY` | `0 \| 1 \| 2 \|
|
|
292
|
+
| `padding` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
293
|
+
| `paddingBottom` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
294
|
+
| `paddingEnd` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
295
|
+
| `paddingStart` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
296
|
+
| `paddingTop` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
297
|
+
| `paddingX` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
298
|
+
| `paddingY` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
299
299
|
| `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
|
|
300
|
-
| `position` | `
|
|
300
|
+
| `position` | `static \| relative \| fixed \| absolute \| sticky` | No | `-` | - |
|
|
301
301
|
| `ref` | `null \| (instance: View \| null) => void \| MutableRefObject<View \| null>` | No | `-` | - |
|
|
302
302
|
| `right` | `string \| number` | No | `-` | - |
|
|
303
|
-
| `rowGap` | `0 \| 1 \| 2 \|
|
|
303
|
+
| `rowGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
304
304
|
| `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 | `-` | - |
|
|
305
305
|
| `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. |
|
|
306
306
|
| `textAlign` | `left \| right \| auto \| center \| justify` | No | `-` | - |
|
|
@@ -1234,7 +1234,7 @@ function CustomComponentExamples() {
|
|
|
1234
1234
|
| `selectAllLabel` | `string` | No | `-` | Label for the Select All option in multi-select mode |
|
|
1235
1235
|
| `setOpen` | `((open: boolean \| ((open: boolean) => boolean)) => void)` | No | `-` | Callback to update the open state |
|
|
1236
1236
|
| `startNode` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Adds content to the start of the inner input. Refer to diagram for location of startNode in InputStack component |
|
|
1237
|
-
| `style` | `null \| false \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<
|
|
1237
|
+
| `style` | `null \| false \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<ViewStyle \| Falsy \| RegisteredStyle<ViewStyle>>` | No | `-` | Inline styles for the root element |
|
|
1238
1238
|
| `styles` | `{ root?: StyleProp<ViewStyle>; control?: StyleProp<ViewStyle>; controlStartNode?: StyleProp<ViewStyle>; controlInputNode?: StyleProp<ViewStyle>; controlValueNode?: StyleProp<ViewStyle>; controlLabelNode?: StyleProp<ViewStyle>; controlHelperTextNode?: StyleProp<ViewStyle>; controlEndNode?: StyleProp<ViewStyle>; controlBlendStyles?: InteractableBlendStyles; dropdown?: StyleProp<ViewStyle>; option?: StyleProp<ViewStyle>; optionCell?: StyleProp<ViewStyle>; optionContent?: StyleProp<ViewStyle>; optionLabel?: StyleProp<ViewStyle>; optionDescription?: StyleProp<ViewStyle>; optionBlendStyles?: InteractableBlendStyles \| undefined; selectAllDivider?: StyleProp<ViewStyle>; emptyContentsContainer?: StyleProp<ViewStyle>; emptyContentsText?: StyleProp<ViewStyle>; } \| undefined` | No | `-` | Custom styles for different parts of the select |
|
|
1239
1239
|
| `testID` | `string` | No | `-` | Test ID for the root element |
|
|
1240
1240
|
| `type` | `single \| multi` | No | `-` | Whether the select allows single or multiple selections |
|
|
@@ -212,9 +212,9 @@ function SelectChipExample() {
|
|
|
212
212
|
| `borderedVertical` | `boolean` | No | `-` | Add a border to the top and bottom sides of the box. |
|
|
213
213
|
| `bottom` | `string \| number` | No | `-` | - |
|
|
214
214
|
| `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 | `-` | - |
|
|
215
|
-
| `columnGap` | `0 \| 1 \| 2 \|
|
|
215
|
+
| `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
216
216
|
| `compact` | `boolean` | No | `-` | Reduces spacing around Chip content |
|
|
217
|
-
| `contentStyle` | `null \| false \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<
|
|
217
|
+
| `contentStyle` | `null \| false \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<ViewStyle \| Falsy \| RegisteredStyle<ViewStyle>>` | No | `-` | Apply animated styles to the inner container. |
|
|
218
218
|
| `dangerouslySetBackground` | `string` | No | `-` | - |
|
|
219
219
|
| `debounceTime` | `number` | No | `500` | The amount of time to wait (in milliseconds) before invoking the debounced function. This prop is used in conjunction with the disableDebounce prop. The debounce function is configured to be invoked as soon as its called, but subsequent calls within the debounceTime period will be ignored. |
|
|
220
220
|
| `disableCapturePanGestureToDismiss` | `boolean` | No | `false` | Prevents the Drawer from capturing pan gestures on children. Set to true when using a ScrollView as a child |
|
|
@@ -233,7 +233,7 @@ function SelectChipExample() {
|
|
|
233
233
|
| `fontFamily` | `inherit \| FontFamily` | No | `-` | - |
|
|
234
234
|
| `fontSize` | `inherit \| FontSize` | No | `-` | - |
|
|
235
235
|
| `fontWeight` | `inherit \| FontWeight` | No | `-` | - |
|
|
236
|
-
| `gap` | `0 \| 1 \| 2 \|
|
|
236
|
+
| `gap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
237
237
|
| `handleBarAccessibilityLabel` | `string` | No | `-` | Accessibility label for handlebar |
|
|
238
238
|
| `hardwareAccelerated` | `boolean` | No | `-` | Controls whether to force hardware acceleration for the underlying window. |
|
|
239
239
|
| `height` | `string \| number` | No | `-` | - |
|
|
@@ -245,13 +245,13 @@ function SelectChipExample() {
|
|
|
245
245
|
| `left` | `string \| number` | No | `-` | - |
|
|
246
246
|
| `lineHeight` | `inherit \| LineHeight` | No | `-` | - |
|
|
247
247
|
| `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. |
|
|
248
|
-
| `margin` | `0 \| -1 \| -2 \| -
|
|
249
|
-
| `marginBottom` | `0 \| -1 \| -2 \| -
|
|
250
|
-
| `marginEnd` | `0 \| -1 \| -2 \| -
|
|
251
|
-
| `marginStart` | `0 \| -1 \| -2 \| -
|
|
252
|
-
| `marginTop` | `0 \| -1 \| -2 \| -
|
|
253
|
-
| `marginX` | `0 \| -1 \| -2 \| -
|
|
254
|
-
| `marginY` | `0 \| -1 \| -2 \| -
|
|
248
|
+
| `margin` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
249
|
+
| `marginBottom` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
250
|
+
| `marginEnd` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
251
|
+
| `marginStart` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
252
|
+
| `marginTop` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
253
|
+
| `marginX` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
254
|
+
| `marginY` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
255
255
|
| `maxHeight` | `string \| number` | No | `-` | - |
|
|
256
256
|
| `maxWidth` | `string \| number` | No | `200` | If text content overflows, it will get truncated with an ellipsis. |
|
|
257
257
|
| `minHeight` | `string \| number` | No | `-` | - |
|
|
@@ -281,26 +281,26 @@ function SelectChipExample() {
|
|
|
281
281
|
| `onVisibilityChange` | `((context: visible \| hidden) => void)` | No | `-` | Optional callback that, if provided, will be triggered when the Tray is toggled open/ closed If used for analytics, context (visible \| hidden) can be bundled with the event info to track whether the multiselect was toggled into or out of view |
|
|
282
282
|
| `opacity` | `number \| AnimatedNode` | No | `-` | - |
|
|
283
283
|
| `overflow` | `visible \| hidden \| scroll` | No | `-` | - |
|
|
284
|
-
| `padding` | `0 \| 1 \| 2 \|
|
|
285
|
-
| `paddingBottom` | `0 \| 1 \| 2 \|
|
|
286
|
-
| `paddingEnd` | `0 \| 1 \| 2 \|
|
|
287
|
-
| `paddingStart` | `0 \| 1 \| 2 \|
|
|
288
|
-
| `paddingTop` | `0 \| 1 \| 2 \|
|
|
289
|
-
| `paddingX` | `0 \| 1 \| 2 \|
|
|
290
|
-
| `paddingY` | `0 \| 1 \| 2 \|
|
|
284
|
+
| `padding` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
285
|
+
| `paddingBottom` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
286
|
+
| `paddingEnd` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
287
|
+
| `paddingStart` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
288
|
+
| `paddingTop` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
289
|
+
| `paddingX` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
290
|
+
| `paddingY` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
291
291
|
| `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
|
|
292
292
|
| `placeholder` | `string` | No | `-` | Placeholder text displayed inside of the input. Will be replaced if there is a value. |
|
|
293
|
-
| `position` | `
|
|
293
|
+
| `position` | `static \| relative \| fixed \| absolute \| sticky` | No | `-` | - |
|
|
294
294
|
| `presentationStyle` | `fullScreen \| pageSheet \| formSheet \| overFullScreen` | No | `-` | The presentationStyle determines the style of modal to show |
|
|
295
295
|
| `preventDismissGestures` | `boolean` | No | `false` | Prevents a user from dismissing the drawer by pressing the overlay or swiping |
|
|
296
296
|
| `preventHardwareBackBehaviorAndroid` | `boolean` | No | `false` | Prevents a user from dismissing the drawer by pressing hardware back button on Android |
|
|
297
297
|
| `ref` | `((instance: View \| null) => void) \| RefObject<View> \| null` | No | `-` | - |
|
|
298
298
|
| `right` | `string \| number` | No | `-` | - |
|
|
299
|
-
| `rowGap` | `0 \| 1 \| 2 \|
|
|
299
|
+
| `rowGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
300
300
|
| `start` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | ReactNode placed before the value |
|
|
301
301
|
| `statusBarTranslucent` | `boolean` | No | `-` | Determines whether your modal should go under the system statusbar. |
|
|
302
302
|
| `stickyFooter` | `ReactNode \| DrawerRenderChildren` | No | `-` | StickyFooter to be rendered at bottom of Drawer |
|
|
303
|
-
| `style` | `null \| false \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<
|
|
303
|
+
| `style` | `null \| false \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<ViewStyle \| Falsy \| RegisteredStyle<ViewStyle>>` | No | `-` | - |
|
|
304
304
|
| `styles` | `{ root?: StyleProp<ViewStyle>; content?: StyleProp<ViewStyle>; }` | No | `-` | Apply styles to the container and content. |
|
|
305
305
|
| `supportedOrientations` | `(portrait \| portrait-upside-down \| landscape \| landscape-left \| landscape-right)[]` | No | `-` | The supportedOrientations prop allows the modal to be rotated to any of the specified orientations. On iOS, the modal is still restricted by whats specified in your apps Info.plists UISupportedInterfaceOrientations field. |
|
|
306
306
|
| `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. |
|
|
@@ -238,8 +238,8 @@ function Example() {
|
|
|
238
238
|
| `checkedLabel` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Label or content shown when button is in checked state. |
|
|
239
239
|
| `children` | `((string \| number \| boolean \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal) & (string \| number \| boolean \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| ((state: PressableStateCallbackType) => ReactNode))) \| null` | No | `-` | Either children or a render prop that receives a boolean reflecting whether the component is currently pressed. |
|
|
240
240
|
| `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 | `-` | - |
|
|
241
|
-
| `columnGap` | `0 \| 1 \| 2 \|
|
|
242
|
-
| `contentStyle` | `null \| false \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<
|
|
241
|
+
| `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
242
|
+
| `contentStyle` | `null \| false \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<ViewStyle \| Falsy \| RegisteredStyle<ViewStyle>>` | No | `-` | Apply animated styles to the inner container. |
|
|
243
243
|
| `dangerouslySetBackground` | `string` | No | `-` | - |
|
|
244
244
|
| `debounceTime` | `number` | No | `500` | The amount of time to wait (in milliseconds) before invoking the debounced function. This prop is used in conjunction with the disableDebounce prop. The debounce function is configured to be invoked as soon as its called, but subsequent calls within the debounceTime period will be ignored. |
|
|
245
245
|
| `disableDebounce` | `boolean` | No | `-` | React Native is historically trash at debouncing touch events. This can cause a lot of unwanted behavior such as double navigations where we push a screen onto the stack 2 times. Debouncing the event 500 miliseconds, but taking the leading event prevents this effect and the accidental double-tap. |
|
|
@@ -257,19 +257,19 @@ function Example() {
|
|
|
257
257
|
| `fontFamily` | `inherit \| FontFamily` | No | `-` | - |
|
|
258
258
|
| `fontSize` | `inherit \| FontSize` | No | `-` | - |
|
|
259
259
|
| `fontWeight` | `inherit \| FontWeight` | No | `-` | - |
|
|
260
|
-
| `gap` | `0 \| 1 \| 2 \|
|
|
260
|
+
| `gap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
261
261
|
| `height` | `number` | No | `-` | Height of the entire button component (background and handle). If you pass a custom SlideButtonBackgroundComponent or SlideButtonHandleComponent, this property will be applied to both. |
|
|
262
262
|
| `justifyContent` | `flex-start \| flex-end \| center \| space-between \| space-around \| space-evenly` | No | `-` | - |
|
|
263
263
|
| `key` | `Key \| null` | No | `-` | - |
|
|
264
264
|
| `left` | `string \| number` | No | `-` | - |
|
|
265
265
|
| `lineHeight` | `inherit \| LineHeight` | No | `-` | - |
|
|
266
|
-
| `margin` | `0 \| -1 \| -2 \| -
|
|
267
|
-
| `marginBottom` | `0 \| -1 \| -2 \| -
|
|
268
|
-
| `marginEnd` | `0 \| -1 \| -2 \| -
|
|
269
|
-
| `marginStart` | `0 \| -1 \| -2 \| -
|
|
270
|
-
| `marginTop` | `0 \| -1 \| -2 \| -
|
|
271
|
-
| `marginX` | `0 \| -1 \| -2 \| -
|
|
272
|
-
| `marginY` | `0 \| -1 \| -2 \| -
|
|
266
|
+
| `margin` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
267
|
+
| `marginBottom` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
268
|
+
| `marginEnd` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
269
|
+
| `marginStart` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
270
|
+
| `marginTop` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
271
|
+
| `marginX` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
272
|
+
| `marginY` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
273
273
|
| `maxHeight` | `string \| number` | No | `-` | - |
|
|
274
274
|
| `maxWidth` | `string \| number` | No | `-` | - |
|
|
275
275
|
| `minHeight` | `string \| number` | No | `-` | - |
|
|
@@ -297,18 +297,18 @@ function Example() {
|
|
|
297
297
|
| `onSlideStart` | `(() => void)` | No | `-` | Callback function fired when the slide gesture begins. |
|
|
298
298
|
| `opacity` | `number \| AnimatedNode` | No | `-` | - |
|
|
299
299
|
| `overflow` | `visible \| hidden \| scroll` | No | `-` | - |
|
|
300
|
-
| `padding` | `0 \| 1 \| 2 \|
|
|
301
|
-
| `paddingBottom` | `0 \| 1 \| 2 \|
|
|
302
|
-
| `paddingEnd` | `0 \| 1 \| 2 \|
|
|
303
|
-
| `paddingStart` | `0 \| 1 \| 2 \|
|
|
304
|
-
| `paddingTop` | `0 \| 1 \| 2 \|
|
|
305
|
-
| `paddingX` | `0 \| 1 \| 2 \|
|
|
306
|
-
| `paddingY` | `0 \| 1 \| 2 \|
|
|
300
|
+
| `padding` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
301
|
+
| `paddingBottom` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
302
|
+
| `paddingEnd` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
303
|
+
| `paddingStart` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
304
|
+
| `paddingTop` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
305
|
+
| `paddingX` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
306
|
+
| `paddingY` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
307
307
|
| `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
|
|
308
|
-
| `position` | `
|
|
308
|
+
| `position` | `static \| relative \| fixed \| absolute \| sticky` | No | `-` | - |
|
|
309
309
|
| `ref` | `((instance: View \| null) => void) \| RefObject<View> \| null` | No | `-` | - |
|
|
310
310
|
| `right` | `string \| number` | No | `-` | - |
|
|
311
|
-
| `rowGap` | `0 \| 1 \| 2 \|
|
|
311
|
+
| `rowGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
312
312
|
| `startUncheckedNode` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Custom start node to render for the unchecked state of the handle, to replace the default arrow icon. |
|
|
313
313
|
| `styles` | `{ container?: StyleProp<ViewStyle>; background?: StyleProp<ViewStyle>; handle?: StyleProp<ViewStyle>; }` | No | `-` | Custom styles for the slide button. |
|
|
314
314
|
| `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. |
|
|
@@ -59,11 +59,11 @@ import { Spacer } from '@coinbase/cds-mobile/layout/Spacer'
|
|
|
59
59
|
| Prop | Type | Required | Default | Description |
|
|
60
60
|
| --- | --- | --- | --- | --- |
|
|
61
61
|
| `animated` | `boolean` | No | `-` | - |
|
|
62
|
-
| `horizontal` | `0 \| 1 \| 2 \|
|
|
63
|
-
| `maxHorizontal` | `0 \| 1 \| 2 \|
|
|
64
|
-
| `maxVertical` | `0 \| 1 \| 2 \|
|
|
65
|
-
| `minHorizontal` | `0 \| 1 \| 2 \|
|
|
66
|
-
| `minVertical` | `0 \| 1 \| 2 \|
|
|
62
|
+
| `horizontal` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | Padding in the horizontal direction |
|
|
63
|
+
| `maxHorizontal` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | Max padding in the horizontal direction |
|
|
64
|
+
| `maxVertical` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | Max padding in the vertical direction |
|
|
65
|
+
| `minHorizontal` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | Min padding in the horizontal direction |
|
|
66
|
+
| `minVertical` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | Min padding in the vertical direction |
|
|
67
67
|
| `onPointerCancel` | `((event: PointerEvent) => void)` | No | `-` | - |
|
|
68
68
|
| `onPointerCancelCapture` | `((event: PointerEvent) => void)` | No | `-` | - |
|
|
69
69
|
| `onPointerDown` | `((event: PointerEvent) => void)` | No | `-` | - |
|
|
@@ -78,6 +78,6 @@ import { Spacer } from '@coinbase/cds-mobile/layout/Spacer'
|
|
|
78
78
|
| `onPointerUpCapture` | `((event: PointerEvent) => void)` | No | `-` | - |
|
|
79
79
|
| `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 | `-` | - |
|
|
80
80
|
| `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. |
|
|
81
|
-
| `vertical` | `0 \| 1 \| 2 \|
|
|
81
|
+
| `vertical` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | Padding in the vertical direction |
|
|
82
82
|
|
|
83
83
|
|
|
@@ -137,7 +137,7 @@ You can also provide custom styles, such as to remove bottom padding from the he
|
|
|
137
137
|
| `formatHoverDate` | `((date: Date, period: Period) => string)` | No | `-` | Formats the date above the chart as you scrub. Omit this if you dont want to show the date as the user scrubs |
|
|
138
138
|
| `formatHoverPrice` | `((price: number) => string)` | No | `-` | Formats the price above the chart as you scrub. Omit this if you dont want to show the price as the user scrubs |
|
|
139
139
|
| `formatMinMaxLabel` | `ChartFormatAmount` | No | `-` | function used to format the amount of money used in the minMaxLabel |
|
|
140
|
-
| `gutter` | `0 \| 1 \| 2 \|
|
|
140
|
+
| `gutter` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `3` | The amount of padding to apply to the left and right of the chart. The chart width is calculated by (screen width - 2* gutter). |
|
|
141
141
|
| `headerNode` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Adds a header node above the chart. It will be placed next to the period selector on web. |
|
|
142
142
|
| `headerTestID` | `string` | No | `-` | Test ID for the header |
|
|
143
143
|
| `hideMinMaxLabel` | `boolean` | No | `false` | Hides the min and max label |
|
|
@@ -148,9 +148,9 @@ You can also provide custom styles, such as to remove bottom padding from the he
|
|
|
148
148
|
| `onScrubEnd` | `(() => void)` | No | `-` | Callback when a user finishes scrubbing |
|
|
149
149
|
| `onScrubStart` | `(() => void)` | No | `-` | Callback when the user starts scrubbing |
|
|
150
150
|
| `periodSelectorPlacement` | `above \| below` | No | `-` | Optional placement prop that position the period selector component above or below the chart |
|
|
151
|
-
| `style` | `null \| false \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<
|
|
151
|
+
| `style` | `null \| false \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<ViewStyle \| Falsy \| RegisteredStyle<ViewStyle>>` | No | `-` | Custom style for the root element. |
|
|
152
152
|
| `styles` | `{ header?: StyleProp<ViewStyle>; root?: StyleProp<ViewStyle>; }` | No | `-` | Custom styles for the component. |
|
|
153
|
-
| `timePeriodGutter` | `0 \| 1 \| 2 \|
|
|
153
|
+
| `timePeriodGutter` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | Optional gutter to add to the Period selector. This is useful if you choose to use the full screen width for the chart |
|
|
154
154
|
| `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. |
|
|
155
155
|
|
|
156
156
|
|
|
@@ -42,7 +42,7 @@ Large spinner
|
|
|
42
42
|
| `onPointerUp` | `((event: PointerEvent) => void)` | No | `-` | - |
|
|
43
43
|
| `onPointerUpCapture` | `((event: PointerEvent) => void)` | No | `-` | - |
|
|
44
44
|
| `size` | `number \| small \| large` | No | `-` | Size of the indicator. Small has a height of 20, large has a height of 36. enum(small, large) |
|
|
45
|
-
| `style` | `null \| false \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<
|
|
45
|
+
| `style` | `null \| false \| ViewStyle \| RegisteredStyle<ViewStyle> \| RecursiveArray<ViewStyle \| Falsy \| RegisteredStyle<ViewStyle>>` | No | `-` | - |
|
|
46
46
|
| `testID` | `string` | No | `-` | Used to locate this view in end-to-end tests. |
|
|
47
47
|
|
|
48
48
|
|
|
@@ -452,7 +452,7 @@ It accepts an object with the following optional keys:
|
|
|
452
452
|
| `borderedVertical` | `boolean` | No | `-` | Add a border to the top and bottom sides of the box. |
|
|
453
453
|
| `bottom` | `string \| number` | No | `-` | - |
|
|
454
454
|
| `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 | `-` | - |
|
|
455
|
-
| `columnGap` | `0 \| 1 \| 2 \|
|
|
455
|
+
| `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
456
456
|
| `complete` | `boolean` | No | `-` | Set this to true to visualize a completely filled/complete Stepper |
|
|
457
457
|
| `completedStepAccessibilityLabel` | `string` | No | `"Complete"` | An optional accessibility label used to announce a step as complete/visited. Useful for providing an internationalized label for this state. |
|
|
458
458
|
| `dangerouslySetBackground` | `string` | No | `-` | - |
|
|
@@ -468,18 +468,18 @@ It accepts an object with the following optional keys:
|
|
|
468
468
|
| `fontFamily` | `inherit \| FontFamily` | No | `-` | - |
|
|
469
469
|
| `fontSize` | `inherit \| FontSize` | No | `-` | - |
|
|
470
470
|
| `fontWeight` | `inherit \| FontWeight` | No | `-` | - |
|
|
471
|
-
| `gap` | `0 \| 1 \| 2 \|
|
|
471
|
+
| `gap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
472
472
|
| `height` | `string \| number` | No | `-` | - |
|
|
473
473
|
| `justifyContent` | `flex-start \| flex-end \| center \| space-between \| space-around \| space-evenly` | No | `-` | - |
|
|
474
474
|
| `left` | `string \| number` | No | `-` | - |
|
|
475
475
|
| `lineHeight` | `inherit \| LineHeight` | No | `-` | - |
|
|
476
|
-
| `margin` | `0 \| -1 \| -2 \| -
|
|
477
|
-
| `marginBottom` | `0 \| -1 \| -2 \| -
|
|
478
|
-
| `marginEnd` | `0 \| -1 \| -2 \| -
|
|
479
|
-
| `marginStart` | `0 \| -1 \| -2 \| -
|
|
480
|
-
| `marginTop` | `0 \| -1 \| -2 \| -
|
|
481
|
-
| `marginX` | `0 \| -1 \| -2 \| -
|
|
482
|
-
| `marginY` | `0 \| -1 \| -2 \| -
|
|
476
|
+
| `margin` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
477
|
+
| `marginBottom` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
478
|
+
| `marginEnd` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
479
|
+
| `marginStart` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
480
|
+
| `marginTop` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
481
|
+
| `marginX` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
482
|
+
| `marginY` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
483
483
|
| `maxHeight` | `string \| number` | No | `-` | - |
|
|
484
484
|
| `maxWidth` | `string \| number` | No | `-` | - |
|
|
485
485
|
| `minHeight` | `string \| number` | No | `-` | - |
|
|
@@ -498,19 +498,19 @@ It accepts an object with the following optional keys:
|
|
|
498
498
|
| `onPointerUpCapture` | `((event: PointerEvent) => void)` | No | `-` | - |
|
|
499
499
|
| `opacity` | `number \| AnimatedNode` | No | `-` | - |
|
|
500
500
|
| `overflow` | `visible \| hidden \| scroll` | No | `-` | - |
|
|
501
|
-
| `padding` | `0 \| 1 \| 2 \|
|
|
502
|
-
| `paddingBottom` | `0 \| 1 \| 2 \|
|
|
503
|
-
| `paddingEnd` | `0 \| 1 \| 2 \|
|
|
504
|
-
| `paddingStart` | `0 \| 1 \| 2 \|
|
|
505
|
-
| `paddingTop` | `0 \| 1 \| 2 \|
|
|
506
|
-
| `paddingX` | `0 \| 1 \| 2 \|
|
|
507
|
-
| `paddingY` | `0 \| 1 \| 2 \|
|
|
501
|
+
| `padding` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
502
|
+
| `paddingBottom` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
503
|
+
| `paddingEnd` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
504
|
+
| `paddingStart` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
505
|
+
| `paddingTop` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
506
|
+
| `paddingX` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
507
|
+
| `paddingY` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
508
508
|
| `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
|
|
509
|
-
| `position` | `
|
|
509
|
+
| `position` | `static \| relative \| fixed \| absolute \| sticky` | No | `-` | - |
|
|
510
510
|
| `progressSpringConfig` | `Partial<AnimationConfig>` | No | `-` | The spring config to use for the progress spring. |
|
|
511
511
|
| `ref` | `null \| (instance: View \| null) => void \| RefObject<View>` | No | `-` | - |
|
|
512
512
|
| `right` | `string \| number` | No | `-` | - |
|
|
513
|
-
| `rowGap` | `0 \| 1 \| 2 \|
|
|
513
|
+
| `rowGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
514
514
|
| `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 | `-` | - |
|
|
515
515
|
| `styles` | `{ root?: StyleProp<ViewStyle>; step?: StyleProp<ViewStyle>; substepContainer?: StyleProp<ViewStyle>; label?: StyleProp<ViewStyle>; progress?: StyleProp<ViewStyle>; icon?: StyleProp<ViewStyle>; header?: StyleProp<ViewStyle>; }` | No | `-` | Inline styles for specific child elements of Stepper |
|
|
516
516
|
| `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. |
|
|
@@ -66,7 +66,7 @@ import { TabLabel } from '@coinbase/cds-mobile/tabs/TabLabel'
|
|
|
66
66
|
| `bottom` | `string \| number` | No | `-` | - |
|
|
67
67
|
| `children` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | Display title to render as the TabLabel. |
|
|
68
68
|
| `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 | `-` | - |
|
|
69
|
-
| `columnGap` | `0 \| 1 \| 2 \|
|
|
69
|
+
| `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
70
70
|
| `count` | `number` | No | `-` | The number value to be shown in the dot. If count is <= 0, dot will not show up. |
|
|
71
71
|
| `dangerouslySetBackground` | `string \| OpaqueColorValue` | No | `-` | - |
|
|
72
72
|
| `dangerouslySetColor` | `string \| OpaqueColorValue` | No | `-` | - |
|
|
@@ -86,7 +86,7 @@ import { TabLabel } from '@coinbase/cds-mobile/tabs/TabLabel'
|
|
|
86
86
|
| `fontFamily` | `inherit \| FontFamily` | No | `-` | - |
|
|
87
87
|
| `fontSize` | `inherit \| FontSize` | No | `-` | - |
|
|
88
88
|
| `fontWeight` | `inherit \| FontWeight` | No | `-` | - |
|
|
89
|
-
| `gap` | `0 \| 1 \| 2 \|
|
|
89
|
+
| `gap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
90
90
|
| `height` | `string \| number` | No | `-` | - |
|
|
91
91
|
| `id` | `string` | No | `-` | Used to reference react managed views from native code. |
|
|
92
92
|
| `justifyContent` | `flex-start \| flex-end \| center \| space-between \| space-around \| space-evenly` | No | `-` | - |
|
|
@@ -94,13 +94,13 @@ import { TabLabel } from '@coinbase/cds-mobile/tabs/TabLabel'
|
|
|
94
94
|
| `lineBreakMode` | `middle \| head \| tail \| clip` | No | `-` | Line Break mode. Works only with numberOfLines. clip is working only for iOS |
|
|
95
95
|
| `lineBreakStrategyIOS` | `none \| standard \| hangul-word \| push-out` | No | `-` | Set line break strategy on iOS. |
|
|
96
96
|
| `lineHeight` | `inherit \| LineHeight` | No | `-` | - |
|
|
97
|
-
| `margin` | `0 \| -1 \| -2 \| -
|
|
98
|
-
| `marginBottom` | `0 \| -1 \| -2 \| -
|
|
99
|
-
| `marginEnd` | `0 \| -1 \| -2 \| -
|
|
100
|
-
| `marginStart` | `0 \| -1 \| -2 \| -
|
|
101
|
-
| `marginTop` | `0 \| -1 \| -2 \| -
|
|
102
|
-
| `marginX` | `0 \| -1 \| -2 \| -
|
|
103
|
-
| `marginY` | `0 \| -1 \| -2 \| -
|
|
97
|
+
| `margin` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
98
|
+
| `marginBottom` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
99
|
+
| `marginEnd` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
100
|
+
| `marginStart` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
101
|
+
| `marginTop` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
102
|
+
| `marginX` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
103
|
+
| `marginY` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
104
104
|
| `max` | `number` | No | `99` | If a badge count is greater than max, it will truncate the numbers so its max+ |
|
|
105
105
|
| `maxFontSizeMultiplier` | `number \| null` | No | `-` | Specifies largest possible scale a font can reach when allowFontScaling is enabled. Possible values: - null/undefined (default): inherit from the parent node or the global default (0) - 0: no max, ignore parent/global default - >= 1: sets the maxFontSizeMultiplier of this node to this value |
|
|
106
106
|
| `maxHeight` | `string \| number` | No | `-` | - |
|
|
@@ -120,17 +120,17 @@ import { TabLabel } from '@coinbase/cds-mobile/tabs/TabLabel'
|
|
|
120
120
|
| `onTextLayout` | `((event: NativeSyntheticEvent<TextLayoutEventData>) => void)` | No | `-` | Invoked on Text layout |
|
|
121
121
|
| `opacity` | `number \| AnimatedNode` | No | `-` | - |
|
|
122
122
|
| `overflow` | `visible \| hidden \| scroll` | No | `-` | - |
|
|
123
|
-
| `padding` | `0 \| 1 \| 2 \|
|
|
124
|
-
| `paddingBottom` | `0 \| 1 \| 2 \|
|
|
125
|
-
| `paddingEnd` | `0 \| 1 \| 2 \|
|
|
126
|
-
| `paddingStart` | `0 \| 1 \| 2 \|
|
|
127
|
-
| `paddingTop` | `0 \| 1 \| 2 \|
|
|
128
|
-
| `paddingX` | `0 \| 1 \| 2 \|
|
|
129
|
-
| `paddingY` | `0 \| 1 \| 2 \|
|
|
130
|
-
| `position` | `
|
|
123
|
+
| `padding` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
124
|
+
| `paddingBottom` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
125
|
+
| `paddingEnd` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
126
|
+
| `paddingStart` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
127
|
+
| `paddingTop` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
128
|
+
| `paddingX` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
129
|
+
| `paddingY` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
130
|
+
| `position` | `static \| relative \| fixed \| absolute \| sticky` | No | `-` | - |
|
|
131
131
|
| `renderEmptyNode` | `boolean` | No | `-` | - |
|
|
132
132
|
| `right` | `string \| number` | No | `-` | - |
|
|
133
|
-
| `rowGap` | `0 \| 1 \| 2 \|
|
|
133
|
+
| `rowGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
134
134
|
| `selectable` | `boolean` | No | `-` | Lets the user select text, to use the native copy and paste functionality. |
|
|
135
135
|
| `selectionColor` | `string \| OpaqueColorValue` | No | `-` | The highlight color of the text. |
|
|
136
136
|
| `style` | `false \| Value \| AnimatedInterpolation<string \| number> \| RegisteredStyle<TextStyle> \| WithAnimatedObject<TextStyle> \| WithAnimatedArray<Falsy \| TextStyle \| RegisteredStyle<TextStyle> \| RecursiveArray<Falsy \| TextStyle \| RegisteredStyle<TextStyle>> \| readonly (Falsy \| TextStyle \| RegisteredStyle<TextStyle>)[]> \| null` | No | `-` | - |
|
|
@@ -81,7 +81,7 @@ import A11y from './a11y.mdx';
|
|
|
81
81
|
| `borderedVertical` | `boolean` | No | `-` | Add a border to the top and bottom sides of the box. |
|
|
82
82
|
| `bottom` | `string \| number` | No | `-` | - |
|
|
83
83
|
| `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 | `-` | - |
|
|
84
|
-
| `columnGap` | `0 \| 1 \| 2 \|
|
|
84
|
+
| `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
85
85
|
| `dangerouslySetBackground` | `string` | No | `-` | - |
|
|
86
86
|
| `display` | `flex \| none` | No | `-` | - |
|
|
87
87
|
| `elevation` | `0 \| 1 \| 2` | No | `-` | Determines box shadow styles. Parent should have overflow set to visible to ensure styles are not clipped. |
|
|
@@ -94,19 +94,19 @@ import A11y from './a11y.mdx';
|
|
|
94
94
|
| `fontFamily` | `inherit \| FontFamily` | No | `-` | - |
|
|
95
95
|
| `fontSize` | `inherit \| FontSize` | No | `-` | - |
|
|
96
96
|
| `fontWeight` | `inherit \| FontWeight` | No | `-` | - |
|
|
97
|
-
| `gap` | `0 \| 1 \| 2 \|
|
|
97
|
+
| `gap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `4` | The spacing between Tabs |
|
|
98
98
|
| `height` | `string \| number` | No | `-` | - |
|
|
99
99
|
| `id` | `string` | No | `-` | - |
|
|
100
100
|
| `justifyContent` | `flex-start \| flex-end \| center \| space-between \| space-around \| space-evenly` | No | `-` | - |
|
|
101
101
|
| `left` | `string \| number` | No | `-` | - |
|
|
102
102
|
| `lineHeight` | `inherit \| LineHeight` | No | `-` | - |
|
|
103
|
-
| `margin` | `0 \| -1 \| -2 \| -
|
|
104
|
-
| `marginBottom` | `0 \| -1 \| -2 \| -
|
|
105
|
-
| `marginEnd` | `0 \| -1 \| -2 \| -
|
|
106
|
-
| `marginStart` | `0 \| -1 \| -2 \| -
|
|
107
|
-
| `marginTop` | `0 \| -1 \| -2 \| -
|
|
108
|
-
| `marginX` | `0 \| -1 \| -2 \| -
|
|
109
|
-
| `marginY` | `0 \| -1 \| -2 \| -
|
|
103
|
+
| `margin` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
104
|
+
| `marginBottom` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
105
|
+
| `marginEnd` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
106
|
+
| `marginStart` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
107
|
+
| `marginTop` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
108
|
+
| `marginX` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
109
|
+
| `marginY` | `0 \| -1 \| -2 \| -0.25 \| -0.5 \| -0.75 \| -1.5 \| -3 \| -4 \| -5 \| -6 \| -7 \| -8 \| -9 \| -10` | No | `-` | - |
|
|
110
110
|
| `maxHeight` | `string \| number` | No | `-` | - |
|
|
111
111
|
| `maxWidth` | `string \| number` | No | `-` | - |
|
|
112
112
|
| `minHeight` | `string \| number` | No | `-` | - |
|
|
@@ -114,21 +114,21 @@ import A11y from './a11y.mdx';
|
|
|
114
114
|
| `nextArrowAccessibilityLabel` | `string` | No | `-` | Web only. Accessibility label for the next arrow paddle (skip to end). |
|
|
115
115
|
| `opacity` | `number \| AnimatedNode` | No | `-` | - |
|
|
116
116
|
| `overflow` | `visible \| hidden \| scroll` | No | `-` | - |
|
|
117
|
-
| `padding` | `0 \| 1 \| 2 \|
|
|
118
|
-
| `paddingBottom` | `0 \| 1 \| 2 \|
|
|
119
|
-
| `paddingEnd` | `0 \| 1 \| 2 \|
|
|
120
|
-
| `paddingStart` | `0 \| 1 \| 2 \|
|
|
121
|
-
| `paddingTop` | `0 \| 1 \| 2 \|
|
|
122
|
-
| `paddingX` | `0 \| 1 \| 2 \|
|
|
123
|
-
| `paddingY` | `0 \| 1 \| 2 \|
|
|
117
|
+
| `padding` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
118
|
+
| `paddingBottom` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
119
|
+
| `paddingEnd` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
120
|
+
| `paddingStart` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
121
|
+
| `paddingTop` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
122
|
+
| `paddingX` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
123
|
+
| `paddingY` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
124
124
|
| `paddleStyle` | `CSSProperties` | No | `-` | Web only. Styling for the paddle icon buttons. Mobile does not have paddles. |
|
|
125
125
|
| `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
|
|
126
|
-
| `position` | `
|
|
126
|
+
| `position` | `static \| relative \| fixed \| absolute \| sticky` | No | `-` | - |
|
|
127
127
|
| `previousArrowAccessibilityLabel` | `string` | No | `-` | Web only. Accessibility label for the previous arrow paddle (skip to beginning). |
|
|
128
128
|
| `ref` | `null \| (instance: View \| null) => void \| MutableRefObject<View \| null>` | No | `-` | - |
|
|
129
129
|
| `right` | `string \| number` | No | `-` | - |
|
|
130
130
|
| `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 |
|
|
131
|
-
| `rowGap` | `0 \| 1 \| 2 \|
|
|
131
|
+
| `rowGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
132
132
|
| `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 | `-` | - |
|
|
133
133
|
| `testID` | `string` | No | `-` | Used to locate this element in unit and end-to-end tests. |
|
|
134
134
|
| `textAlign` | `left \| right \| auto \| center \| justify` | No | `-` | - |
|