@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
|
@@ -87,7 +87,7 @@ function Example() {
|
|
|
87
87
|
| `alignItems` | `ResponsiveProp<center \| normal \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
|
|
88
88
|
| `alignSelf` | `ResponsiveProp<center \| normal \| auto \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
|
|
89
89
|
| `as` | `div` | No | `-` | - |
|
|
90
|
-
| `aspectRatio` |
|
|
90
|
+
| `aspectRatio` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
91
91
|
| `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 | `-` | - |
|
|
92
92
|
| `borderBottomLeftRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
|
|
93
93
|
| `borderBottomRightRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
|
|
@@ -109,10 +109,10 @@ function Example() {
|
|
|
109
109
|
| `borderedVertical` | `boolean` | No | `-` | Add a border to the top and bottom sides of the box. |
|
|
110
110
|
| `bottom` | `ResponsiveProp<Bottom<string \| number>>` | No | `-` | - |
|
|
111
111
|
| `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 | `-` | - |
|
|
112
|
-
| `columnGap` | `0 \|
|
|
112
|
+
| `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
113
113
|
| `dangerouslyDisableResponsiveness` | `boolean` | No | `false` | Disable responsiveness so it maintains the same UI across different viewports. |
|
|
114
114
|
| `dangerouslySetBackground` | `string` | No | `-` | - |
|
|
115
|
-
| `dangerouslySetPosition` | `
|
|
115
|
+
| `dangerouslySetPosition` | `static \| relative \| fixed \| absolute \| sticky` | No | `-` | Set the position for the modal dialogue |
|
|
116
116
|
| `disableFocusTrap` | `boolean` | No | `false` | Set disableFocusTrap to disable keyboard listeners responsible for focus trap behavior This can be useful for scenarios like Yubikey 2fa |
|
|
117
117
|
| `disableOverlayPress` | `boolean` | No | `false` | Disable overlay click that closes the Modal |
|
|
118
118
|
| `disablePortal` | `boolean` | No | `-` | Disable React portal integration |
|
|
@@ -120,28 +120,28 @@ function Example() {
|
|
|
120
120
|
| `elevation` | `0 \| 1 \| 2` | No | `-` | - |
|
|
121
121
|
| `flexBasis` | `ResponsiveProp<FlexBasis<string \| number>>` | No | `-` | - |
|
|
122
122
|
| `flexDirection` | `ResponsiveProp<column \| row \| row-reverse \| column-reverse>` | No | `-` | - |
|
|
123
|
-
| `flexGrow` |
|
|
124
|
-
| `flexShrink` |
|
|
123
|
+
| `flexGrow` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
124
|
+
| `flexShrink` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
125
125
|
| `flexWrap` | `ResponsiveProp<nowrap \| wrap \| wrap-reverse>` | No | `-` | - |
|
|
126
126
|
| `focusTabIndexElements` | `boolean` | No | `false` | Allow any element with tabIndex attribute to be focusable in FocusTrap, rather than only focusing specific interactive element types like button. This can be useful when having long content in a Modal. |
|
|
127
127
|
| `font` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
|
|
128
128
|
| `fontFamily` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
|
|
129
129
|
| `fontSize` | `ResponsiveProp<FontSize \| inherit>` | No | `-` | - |
|
|
130
130
|
| `fontWeight` | `ResponsiveProp<FontWeight \| inherit>` | No | `-` | - |
|
|
131
|
-
| `gap` | `0 \|
|
|
132
|
-
| `grid` |
|
|
133
|
-
| `gridArea` |
|
|
131
|
+
| `gap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
132
|
+
| `grid` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
133
|
+
| `gridArea` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
134
134
|
| `gridAutoColumns` | `ResponsiveProp<GridAutoColumns<string \| number>>` | No | `-` | - |
|
|
135
|
-
| `gridAutoFlow` |
|
|
135
|
+
| `gridAutoFlow` | `inherit \| revert \| row \| column \| -moz-initial \| initial \| revert-layer \| unset \| dense` | No | `-` | - |
|
|
136
136
|
| `gridAutoRows` | `ResponsiveProp<GridAutoRows<string \| number>>` | No | `-` | - |
|
|
137
|
-
| `gridColumn` |
|
|
138
|
-
| `gridColumnEnd` |
|
|
139
|
-
| `gridColumnStart` |
|
|
140
|
-
| `gridRow` |
|
|
141
|
-
| `gridRowEnd` |
|
|
142
|
-
| `gridRowStart` |
|
|
143
|
-
| `gridTemplate` |
|
|
144
|
-
| `gridTemplateAreas` |
|
|
137
|
+
| `gridColumn` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
138
|
+
| `gridColumnEnd` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
139
|
+
| `gridColumnStart` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
140
|
+
| `gridRow` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
141
|
+
| `gridRowEnd` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
142
|
+
| `gridRowStart` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
143
|
+
| `gridTemplate` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
144
|
+
| `gridTemplateAreas` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
145
145
|
| `gridTemplateColumns` | `ResponsiveProp<GridTemplateColumns<string \| number>>` | No | `-` | - |
|
|
146
146
|
| `gridTemplateRows` | `ResponsiveProp<GridTemplateRows<string \| number>>` | No | `-` | - |
|
|
147
147
|
| `height` | `ResponsiveProp<Height<string \| number>>` | No | `-` | - |
|
|
@@ -165,22 +165,22 @@ function Example() {
|
|
|
165
165
|
| `minWidth` | `ResponsiveProp<MinWidth<string \| number>>` | No | `-` | - |
|
|
166
166
|
| `onChange` | `FormEventHandler<HTMLDivElement>` | No | `-` | - |
|
|
167
167
|
| `onDidClose` | `((() => void) & (() => void))` | No | `-` | Callback fired after the component is closed. |
|
|
168
|
-
| `opacity` |
|
|
168
|
+
| `opacity` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
169
169
|
| `overflow` | `ResponsiveProp<hidden \| auto \| visible \| clip \| scroll>` | No | `-` | - |
|
|
170
|
-
| `padding` | `0 \|
|
|
171
|
-
| `paddingBottom` | `0 \|
|
|
172
|
-
| `paddingEnd` | `0 \|
|
|
173
|
-
| `paddingStart` | `0 \|
|
|
174
|
-
| `paddingTop` | `0 \|
|
|
175
|
-
| `paddingX` | `0 \|
|
|
176
|
-
| `paddingY` | `0 \|
|
|
170
|
+
| `padding` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
171
|
+
| `paddingBottom` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
172
|
+
| `paddingEnd` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
173
|
+
| `paddingStart` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
174
|
+
| `paddingTop` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
175
|
+
| `paddingX` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
176
|
+
| `paddingY` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
177
177
|
| `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
|
|
178
178
|
| `position` | `ResponsiveProp<fixed \| static \| relative \| absolute \| sticky>` | No | `-` | - |
|
|
179
179
|
| `ref` | `((instance: ModalRefBaseProps \| null) => void) \| RefObject<ModalRefBaseProps> \| null` | No | `-` | - |
|
|
180
180
|
| `restoreFocusOnUnmount` | `boolean` | No | `true` | If true, the focus trap will restore focus to the previously focused element when it unmounts. WARNING: If you disable this, you need to ensure that focus is restored properly so it doesnt end up on the body |
|
|
181
181
|
| `right` | `ResponsiveProp<Right<string \| number>>` | No | `-` | - |
|
|
182
182
|
| `role` | `dialog \| alertdialog` | No | `-` | WAI-ARIA Roles |
|
|
183
|
-
| `rowGap` | `0 \|
|
|
183
|
+
| `rowGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
184
184
|
| `shouldCloseOnEscPress` | `boolean` | No | `true` | If pressing the esc key should close the modal |
|
|
185
185
|
| `style` | `CSSProperties` | No | `-` | - |
|
|
186
186
|
| `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 |
|
|
@@ -188,7 +188,7 @@ function Example() {
|
|
|
188
188
|
| `textDecoration` | `ResponsiveProp<none \| underline \| overline \| line-through \| underline overline \| underline double>` | No | `-` | - |
|
|
189
189
|
| `textTransform` | `ResponsiveProp<capitalize \| lowercase \| none \| uppercase>` | No | `-` | - |
|
|
190
190
|
| `top` | `ResponsiveProp<Top<string \| number>>` | No | `-` | - |
|
|
191
|
-
| `transform` |
|
|
191
|
+
| `transform` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
192
192
|
| `userSelect` | `ResponsiveProp<text \| none \| auto \| all>` | No | `-` | - |
|
|
193
193
|
| `visibility` | `ResponsiveProp<hidden \| visible>` | No | `-` | - |
|
|
194
194
|
| `width` | `ResponsiveProp<Width<string \| number>>` | No | `-` | - |
|
|
@@ -20,7 +20,7 @@ Check [Modal](/components/overlay/Modal) for usage examples
|
|
|
20
20
|
| `alignItems` | `ResponsiveProp<center \| normal \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
|
|
21
21
|
| `alignSelf` | `ResponsiveProp<center \| normal \| auto \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
|
|
22
22
|
| `as` | `div` | No | `-` | - |
|
|
23
|
-
| `aspectRatio` |
|
|
23
|
+
| `aspectRatio` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
24
24
|
| `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 | `-` | - |
|
|
25
25
|
| `borderBottomLeftRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
|
|
26
26
|
| `borderBottomRightRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
|
|
@@ -42,33 +42,33 @@ Check [Modal](/components/overlay/Modal) for usage examples
|
|
|
42
42
|
| `borderedVertical` | `boolean` | No | `-` | Add a border to the top and bottom sides of the box. |
|
|
43
43
|
| `bottom` | `ResponsiveProp<Bottom<string \| number>>` | No | `-` | - |
|
|
44
44
|
| `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 | `-` | - |
|
|
45
|
-
| `columnGap` | `0 \|
|
|
45
|
+
| `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
46
46
|
| `dangerouslySetBackground` | `string` | No | `-` | - |
|
|
47
47
|
| `display` | `ResponsiveProp<grid \| revert \| none \| block \| inline \| inline-block \| flex \| inline-flex \| inline-grid \| contents \| flow-root \| list-item>` | No | `-` | - |
|
|
48
48
|
| `elevation` | `0 \| 1 \| 2` | No | `-` | - |
|
|
49
49
|
| `flexBasis` | `ResponsiveProp<FlexBasis<string \| number>>` | No | `-` | - |
|
|
50
50
|
| `flexDirection` | `ResponsiveProp<column \| row \| row-reverse \| column-reverse>` | No | `column` | - |
|
|
51
|
-
| `flexGrow` |
|
|
52
|
-
| `flexShrink` |
|
|
51
|
+
| `flexGrow` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `1` | - |
|
|
52
|
+
| `flexShrink` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
53
53
|
| `flexWrap` | `ResponsiveProp<nowrap \| wrap \| wrap-reverse>` | No | `-` | - |
|
|
54
54
|
| `font` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
|
|
55
55
|
| `fontFamily` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
|
|
56
56
|
| `fontSize` | `ResponsiveProp<FontSize \| inherit>` | No | `-` | - |
|
|
57
57
|
| `fontWeight` | `ResponsiveProp<FontWeight \| inherit>` | No | `-` | - |
|
|
58
|
-
| `gap` | `0 \|
|
|
59
|
-
| `grid` |
|
|
60
|
-
| `gridArea` |
|
|
58
|
+
| `gap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
59
|
+
| `grid` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
60
|
+
| `gridArea` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
61
61
|
| `gridAutoColumns` | `ResponsiveProp<GridAutoColumns<string \| number>>` | No | `-` | - |
|
|
62
|
-
| `gridAutoFlow` |
|
|
62
|
+
| `gridAutoFlow` | `inherit \| revert \| row \| column \| -moz-initial \| initial \| revert-layer \| unset \| dense` | No | `-` | - |
|
|
63
63
|
| `gridAutoRows` | `ResponsiveProp<GridAutoRows<string \| number>>` | No | `-` | - |
|
|
64
|
-
| `gridColumn` |
|
|
65
|
-
| `gridColumnEnd` |
|
|
66
|
-
| `gridColumnStart` |
|
|
67
|
-
| `gridRow` |
|
|
68
|
-
| `gridRowEnd` |
|
|
69
|
-
| `gridRowStart` |
|
|
70
|
-
| `gridTemplate` |
|
|
71
|
-
| `gridTemplateAreas` |
|
|
64
|
+
| `gridColumn` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
65
|
+
| `gridColumnEnd` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
66
|
+
| `gridColumnStart` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
67
|
+
| `gridRow` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
68
|
+
| `gridRowEnd` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
69
|
+
| `gridRowStart` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
70
|
+
| `gridTemplate` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
71
|
+
| `gridTemplateAreas` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
72
72
|
| `gridTemplateColumns` | `ResponsiveProp<GridTemplateColumns<string \| number>>` | No | `-` | - |
|
|
73
73
|
| `gridTemplateRows` | `ResponsiveProp<GridTemplateRows<string \| number>>` | No | `-` | - |
|
|
74
74
|
| `height` | `ResponsiveProp<Height<string \| number>>` | No | `-` | - |
|
|
@@ -88,30 +88,30 @@ Check [Modal](/components/overlay/Modal) for usage examples
|
|
|
88
88
|
| `minHeight` | `ResponsiveProp<MinHeight<string \| number>>` | No | `-` | - |
|
|
89
89
|
| `minWidth` | `ResponsiveProp<MinWidth<string \| number>>` | No | `-` | - |
|
|
90
90
|
| `onChange` | `FormEventHandler<HTMLDivElement>` | No | `-` | - |
|
|
91
|
-
| `opacity` |
|
|
91
|
+
| `opacity` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
92
92
|
| `overflow` | `ResponsiveProp<hidden \| auto \| visible \| clip \| scroll>` | No | `auto` | - |
|
|
93
|
-
| `padding` | `0 \|
|
|
94
|
-
| `paddingBottom` | `0 \|
|
|
95
|
-
| `paddingEnd` | `0 \|
|
|
96
|
-
| `paddingStart` | `0 \|
|
|
97
|
-
| `paddingTop` | `0 \|
|
|
98
|
-
| `paddingX` | `0 \|
|
|
99
|
-
| `paddingY` | `0 \|
|
|
93
|
+
| `padding` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
94
|
+
| `paddingBottom` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
95
|
+
| `paddingEnd` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
96
|
+
| `paddingStart` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
97
|
+
| `paddingTop` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
98
|
+
| `paddingX` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `3` | - |
|
|
99
|
+
| `paddingY` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
100
100
|
| `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
|
|
101
101
|
| `position` | `ResponsiveProp<fixed \| static \| relative \| absolute \| sticky>` | No | `-` | - |
|
|
102
102
|
| `ref` | `null \| string \| RefObject<HTMLDivElement> \| (instance: HTMLDivElement \| null) => void` | 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). |
|
|
103
103
|
| `right` | `ResponsiveProp<Right<string \| number>>` | No | `-` | - |
|
|
104
|
-
| `rowGap` | `0 \|
|
|
104
|
+
| `rowGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
105
105
|
| `style` | `CSSProperties` | No | `-` | - |
|
|
106
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 |
|
|
107
107
|
| `textAlign` | `ResponsiveProp<center \| start \| end \| justify>` | No | `-` | - |
|
|
108
108
|
| `textDecoration` | `ResponsiveProp<none \| underline \| overline \| line-through \| underline overline \| underline double>` | No | `-` | - |
|
|
109
109
|
| `textTransform` | `ResponsiveProp<capitalize \| lowercase \| none \| uppercase>` | No | `-` | - |
|
|
110
110
|
| `top` | `ResponsiveProp<Top<string \| number>>` | No | `-` | - |
|
|
111
|
-
| `transform` |
|
|
111
|
+
| `transform` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
112
112
|
| `userSelect` | `ResponsiveProp<text \| none \| auto \| all>` | No | `-` | - |
|
|
113
113
|
| `visibility` | `ResponsiveProp<hidden \| visible>` | No | `-` | - |
|
|
114
114
|
| `width` | `ResponsiveProp<Width<string \| number>>` | No | `-` | - |
|
|
115
|
-
| `zIndex` |
|
|
115
|
+
| `zIndex` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
116
116
|
|
|
117
117
|
|
|
@@ -21,7 +21,7 @@ Check [Modal](/components/overlay/Modal) for usage examples
|
|
|
21
21
|
| `alignItems` | `ResponsiveProp<center \| normal \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
|
|
22
22
|
| `alignSelf` | `ResponsiveProp<center \| normal \| auto \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
|
|
23
23
|
| `as` | `div` | No | `-` | - |
|
|
24
|
-
| `aspectRatio` |
|
|
24
|
+
| `aspectRatio` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
25
25
|
| `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 | `-` | - |
|
|
26
26
|
| `borderBottomLeftRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
|
|
27
27
|
| `borderBottomRightRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
|
|
@@ -43,33 +43,33 @@ Check [Modal](/components/overlay/Modal) for usage examples
|
|
|
43
43
|
| `borderedVertical` | `boolean` | No | `-` | Add a border to the top and bottom sides of the box. |
|
|
44
44
|
| `bottom` | `ResponsiveProp<Bottom<string \| number>>` | No | `-` | - |
|
|
45
45
|
| `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 | `-` | - |
|
|
46
|
-
| `columnGap` | `0 \|
|
|
46
|
+
| `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
47
47
|
| `dangerouslySetBackground` | `string` | No | `-` | - |
|
|
48
48
|
| `display` | `ResponsiveProp<grid \| revert \| none \| block \| inline \| inline-block \| flex \| inline-flex \| inline-grid \| contents \| flow-root \| list-item>` | No | `-` | - |
|
|
49
49
|
| `elevation` | `0 \| 1 \| 2` | No | `-` | - |
|
|
50
50
|
| `flexBasis` | `ResponsiveProp<FlexBasis<string \| number>>` | No | `-` | - |
|
|
51
51
|
| `flexDirection` | `ResponsiveProp<column \| row \| row-reverse \| column-reverse>` | No | `-` | - |
|
|
52
|
-
| `flexGrow` |
|
|
53
|
-
| `flexShrink` |
|
|
52
|
+
| `flexGrow` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
53
|
+
| `flexShrink` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
54
54
|
| `flexWrap` | `ResponsiveProp<nowrap \| wrap \| wrap-reverse>` | No | `-` | - |
|
|
55
55
|
| `font` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
|
|
56
56
|
| `fontFamily` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
|
|
57
57
|
| `fontSize` | `ResponsiveProp<FontSize \| inherit>` | No | `-` | - |
|
|
58
58
|
| `fontWeight` | `ResponsiveProp<FontWeight \| inherit>` | No | `-` | - |
|
|
59
|
-
| `gap` | `0 \|
|
|
60
|
-
| `grid` |
|
|
61
|
-
| `gridArea` |
|
|
59
|
+
| `gap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `2` | - |
|
|
60
|
+
| `grid` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
61
|
+
| `gridArea` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
62
62
|
| `gridAutoColumns` | `ResponsiveProp<GridAutoColumns<string \| number>>` | No | `-` | - |
|
|
63
|
-
| `gridAutoFlow` |
|
|
63
|
+
| `gridAutoFlow` | `inherit \| revert \| row \| column \| -moz-initial \| initial \| revert-layer \| unset \| dense` | No | `-` | - |
|
|
64
64
|
| `gridAutoRows` | `ResponsiveProp<GridAutoRows<string \| number>>` | No | `-` | - |
|
|
65
|
-
| `gridColumn` |
|
|
66
|
-
| `gridColumnEnd` |
|
|
67
|
-
| `gridColumnStart` |
|
|
68
|
-
| `gridRow` |
|
|
69
|
-
| `gridRowEnd` |
|
|
70
|
-
| `gridRowStart` |
|
|
71
|
-
| `gridTemplate` |
|
|
72
|
-
| `gridTemplateAreas` |
|
|
65
|
+
| `gridColumn` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
66
|
+
| `gridColumnEnd` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
67
|
+
| `gridColumnStart` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
68
|
+
| `gridRow` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
69
|
+
| `gridRowEnd` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
70
|
+
| `gridRowStart` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
71
|
+
| `gridTemplate` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
72
|
+
| `gridTemplateAreas` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
73
73
|
| `gridTemplateColumns` | `ResponsiveProp<GridTemplateColumns<string \| number>>` | No | `-` | - |
|
|
74
74
|
| `gridTemplateRows` | `ResponsiveProp<GridTemplateRows<string \| number>>` | No | `-` | - |
|
|
75
75
|
| `height` | `ResponsiveProp<Height<string \| number>>` | No | `-` | - |
|
|
@@ -89,20 +89,20 @@ Check [Modal](/components/overlay/Modal) for usage examples
|
|
|
89
89
|
| `minHeight` | `ResponsiveProp<MinHeight<string \| number>>` | No | `-` | - |
|
|
90
90
|
| `minWidth` | `ResponsiveProp<MinWidth<string \| number>>` | No | `-` | - |
|
|
91
91
|
| `onChange` | `FormEventHandler<HTMLDivElement>` | No | `-` | - |
|
|
92
|
-
| `opacity` |
|
|
92
|
+
| `opacity` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
93
93
|
| `overflow` | `ResponsiveProp<hidden \| auto \| visible \| clip \| scroll>` | No | `-` | - |
|
|
94
|
-
| `padding` | `0 \|
|
|
95
|
-
| `paddingBottom` | `0 \|
|
|
96
|
-
| `paddingEnd` | `0 \|
|
|
97
|
-
| `paddingStart` | `0 \|
|
|
98
|
-
| `paddingTop` | `0 \|
|
|
99
|
-
| `paddingX` | `0 \|
|
|
100
|
-
| `paddingY` | `0 \|
|
|
94
|
+
| `padding` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
95
|
+
| `paddingBottom` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
96
|
+
| `paddingEnd` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
97
|
+
| `paddingStart` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
98
|
+
| `paddingTop` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
99
|
+
| `paddingX` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `3` | - |
|
|
100
|
+
| `paddingY` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `2` | - |
|
|
101
101
|
| `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
|
|
102
102
|
| `position` | `ResponsiveProp<fixed \| static \| relative \| absolute \| sticky>` | No | `-` | - |
|
|
103
103
|
| `ref` | `RefObject<HTMLDivElement> \| ((instance: HTMLDivElement \| null) => void) \| null` | No | `-` | - |
|
|
104
104
|
| `right` | `ResponsiveProp<Right<string \| number>>` | No | `-` | - |
|
|
105
|
-
| `rowGap` | `0 \|
|
|
105
|
+
| `rowGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
106
106
|
| `secondaryAction` | `ReactElement<SharedProps & Pick<SharedAccessibilityProps, accessibilityLabel> & { variant?: ButtonVariant; disabled?: boolean \| undefined; loading?: boolean \| undefined; transparent?: boolean \| undefined; block?: boolean \| undefined; compact?: boolean \| undefined; children: ReactNode; start?: ReactNode; startIcon?: IconName \| undefined; startIconActive?: boolean \| undefined; end?: ReactNode; endIcon?: IconName \| undefined; endIconActive?: boolean \| undefined; flush?: start \| end \| undefined; name?: string \| undefined; noScaleOnPress?: boolean \| undefined; numberOfLines?: number \| undefined; } & Omit<PressableBaseProps, children \| testID \| accessibilityLabel \| transparent \| name \| block \| start \| end \| loading \| variant \| startIcon \| startIconActive \| numberOfLines \| disabled \| noScaleOnPress \| compact \| endIcon \| endIconActive \| flush> & { onClick?: MouseEventHandler<Element> \| undefined; }, string \| JSXElementConstructor<any>> \| undefined` | No | `-` | Secondary action button |
|
|
107
107
|
| `style` | `CSSProperties` | No | `-` | - |
|
|
108
108
|
| `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 |
|
|
@@ -110,10 +110,10 @@ Check [Modal](/components/overlay/Modal) for usage examples
|
|
|
110
110
|
| `textDecoration` | `ResponsiveProp<none \| underline \| overline \| line-through \| underline overline \| underline double>` | No | `-` | - |
|
|
111
111
|
| `textTransform` | `ResponsiveProp<capitalize \| lowercase \| none \| uppercase>` | No | `-` | - |
|
|
112
112
|
| `top` | `ResponsiveProp<Top<string \| number>>` | No | `-` | - |
|
|
113
|
-
| `transform` |
|
|
113
|
+
| `transform` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
114
114
|
| `userSelect` | `ResponsiveProp<text \| none \| auto \| all>` | No | `-` | - |
|
|
115
115
|
| `visibility` | `ResponsiveProp<hidden \| visible>` | No | `-` | - |
|
|
116
116
|
| `width` | `ResponsiveProp<Width<string \| number>>` | No | `100%` | - |
|
|
117
|
-
| `zIndex` |
|
|
117
|
+
| `zIndex` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
118
118
|
|
|
119
119
|
|
|
@@ -20,7 +20,7 @@ Check [Modal](/components/overlay/Modal) for usage examples
|
|
|
20
20
|
| `alignItems` | `ResponsiveProp<center \| normal \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `center` | - |
|
|
21
21
|
| `alignSelf` | `ResponsiveProp<center \| normal \| auto \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
|
|
22
22
|
| `as` | `div` | No | `-` | - |
|
|
23
|
-
| `aspectRatio` |
|
|
23
|
+
| `aspectRatio` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
24
24
|
| `backAccessibilityHint` | `string` | No | `-` | Sets an accessible hint or description for the back button. On web, maps to aria-describedby and lists the id(s) of the element(s) that describe the element on which the attribute is set. On mobile, a string that helps users understand what will happen when they perform an action on the accessibility element when that result is not clear from the accessibility label. |
|
|
25
25
|
| `backAccessibilityLabel` | `string` | No | `-` | Sets an accessible label for the back button. On web, maps to aria-label and defines a string value that labels an interactive element. On mobile, VoiceOver will read this string when a user selects the associated element. |
|
|
26
26
|
| `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 | `-` | - |
|
|
@@ -46,33 +46,33 @@ Check [Modal](/components/overlay/Modal) for usage examples
|
|
|
46
46
|
| `closeAccessibilityHint` | `string` | No | `-` | Sets an accessible hint or description for the close button. On web, maps to aria-describedby and lists the id(s) of the element(s) that describe the element on which the attribute is set. On mobile, a string that helps users understand what will happen when they perform an action on the accessibility element when that result is not clear from the accessibility label. |
|
|
47
47
|
| `closeAccessibilityLabel` | `string` | No | `-` | Sets an accessible label for the close button. On web, maps to aria-label and defines a string value that labels an interactive element. On mobile, VoiceOver will read this string when a user selects the associated element. |
|
|
48
48
|
| `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 | `-` | - |
|
|
49
|
-
| `columnGap` | `0 \|
|
|
49
|
+
| `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
50
50
|
| `dangerouslySetBackground` | `string` | No | `-` | - |
|
|
51
51
|
| `display` | `ResponsiveProp<grid \| revert \| none \| block \| inline \| inline-block \| flex \| inline-flex \| inline-grid \| contents \| flow-root \| list-item>` | No | `-` | - |
|
|
52
52
|
| `elevation` | `0 \| 1 \| 2` | No | `-` | - |
|
|
53
53
|
| `flexBasis` | `ResponsiveProp<FlexBasis<string \| number>>` | No | `-` | - |
|
|
54
54
|
| `flexDirection` | `ResponsiveProp<column \| row \| row-reverse \| column-reverse>` | No | `-` | - |
|
|
55
|
-
| `flexGrow` |
|
|
56
|
-
| `flexShrink` |
|
|
55
|
+
| `flexGrow` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
56
|
+
| `flexShrink` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
57
57
|
| `flexWrap` | `ResponsiveProp<nowrap \| wrap \| wrap-reverse>` | No | `-` | - |
|
|
58
58
|
| `font` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
|
|
59
59
|
| `fontFamily` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
|
|
60
60
|
| `fontSize` | `ResponsiveProp<FontSize \| inherit>` | No | `-` | - |
|
|
61
61
|
| `fontWeight` | `ResponsiveProp<FontWeight \| inherit>` | No | `-` | - |
|
|
62
|
-
| `gap` | `0 \|
|
|
63
|
-
| `grid` |
|
|
64
|
-
| `gridArea` |
|
|
62
|
+
| `gap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
63
|
+
| `grid` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
64
|
+
| `gridArea` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
65
65
|
| `gridAutoColumns` | `ResponsiveProp<GridAutoColumns<string \| number>>` | No | `-` | - |
|
|
66
|
-
| `gridAutoFlow` |
|
|
66
|
+
| `gridAutoFlow` | `inherit \| revert \| row \| column \| -moz-initial \| initial \| revert-layer \| unset \| dense` | No | `-` | - |
|
|
67
67
|
| `gridAutoRows` | `ResponsiveProp<GridAutoRows<string \| number>>` | No | `-` | - |
|
|
68
|
-
| `gridColumn` |
|
|
69
|
-
| `gridColumnEnd` |
|
|
70
|
-
| `gridColumnStart` |
|
|
71
|
-
| `gridRow` |
|
|
72
|
-
| `gridRowEnd` |
|
|
73
|
-
| `gridRowStart` |
|
|
74
|
-
| `gridTemplate` |
|
|
75
|
-
| `gridTemplateAreas` |
|
|
68
|
+
| `gridColumn` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
69
|
+
| `gridColumnEnd` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
70
|
+
| `gridColumnStart` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
71
|
+
| `gridRow` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
72
|
+
| `gridRowEnd` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
73
|
+
| `gridRowStart` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
74
|
+
| `gridTemplate` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
75
|
+
| `gridTemplateAreas` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
76
76
|
| `gridTemplateColumns` | `ResponsiveProp<GridTemplateColumns<string \| number>>` | No | `-` | - |
|
|
77
77
|
| `gridTemplateRows` | `ResponsiveProp<GridTemplateRows<string \| number>>` | No | `-` | - |
|
|
78
78
|
| `height` | `ResponsiveProp<Height<string \| number>>` | No | `-` | - |
|
|
@@ -93,20 +93,20 @@ Check [Modal](/components/overlay/Modal) for usage examples
|
|
|
93
93
|
| `minWidth` | `ResponsiveProp<MinWidth<string \| number>>` | No | `-` | - |
|
|
94
94
|
| `onBackButtonClick` | `MouseEventHandler<Element>` | No | `-` | Handles back button press |
|
|
95
95
|
| `onChange` | `FormEventHandler<HTMLDivElement>` | No | `-` | - |
|
|
96
|
-
| `opacity` |
|
|
96
|
+
| `opacity` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
97
97
|
| `overflow` | `ResponsiveProp<hidden \| auto \| visible \| clip \| scroll>` | No | `-` | - |
|
|
98
|
-
| `padding` | `0 \|
|
|
99
|
-
| `paddingBottom` | `0 \|
|
|
100
|
-
| `paddingEnd` | `0 \|
|
|
101
|
-
| `paddingStart` | `0 \|
|
|
102
|
-
| `paddingTop` | `0 \|
|
|
103
|
-
| `paddingX` | `0 \|
|
|
104
|
-
| `paddingY` | `0 \|
|
|
98
|
+
| `padding` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
99
|
+
| `paddingBottom` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
100
|
+
| `paddingEnd` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
101
|
+
| `paddingStart` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
102
|
+
| `paddingTop` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
103
|
+
| `paddingX` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `3` | - |
|
|
104
|
+
| `paddingY` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `2` | - |
|
|
105
105
|
| `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
|
|
106
106
|
| `position` | `ResponsiveProp<fixed \| static \| relative \| absolute \| sticky>` | No | `-` | - |
|
|
107
107
|
| `ref` | `RefObject<HTMLDivElement> \| ((instance: HTMLDivElement \| null) => void) \| null` | No | `-` | - |
|
|
108
108
|
| `right` | `ResponsiveProp<Right<string \| number>>` | No | `-` | - |
|
|
109
|
-
| `rowGap` | `0 \|
|
|
109
|
+
| `rowGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
110
110
|
| `style` | `CSSProperties` | No | `-` | - |
|
|
111
111
|
| `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 |
|
|
112
112
|
| `textAlign` | `ResponsiveProp<center \| start \| end \| justify>` | No | `-` | - |
|
|
@@ -114,10 +114,10 @@ Check [Modal](/components/overlay/Modal) for usage examples
|
|
|
114
114
|
| `textTransform` | `ResponsiveProp<capitalize \| lowercase \| none \| uppercase>` | No | `-` | - |
|
|
115
115
|
| `title` | `string` | No | `-` | Title of the Modal |
|
|
116
116
|
| `top` | `ResponsiveProp<Top<string \| number>>` | No | `-` | - |
|
|
117
|
-
| `transform` |
|
|
117
|
+
| `transform` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
118
118
|
| `userSelect` | `ResponsiveProp<text \| none \| auto \| all>` | No | `-` | - |
|
|
119
119
|
| `visibility` | `ResponsiveProp<hidden \| visible>` | No | `-` | - |
|
|
120
120
|
| `width` | `ResponsiveProp<Width<string \| number>>` | No | `-` | - |
|
|
121
|
-
| `zIndex` |
|
|
121
|
+
| `zIndex` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
122
122
|
|
|
123
123
|
|
|
@@ -280,8 +280,8 @@ function Example() {
|
|
|
280
280
|
| `alignContent` | `ResponsiveProp<center \| normal \| start \| end \| flex-start \| flex-end \| stretch \| baseline \| first baseline \| last baseline \| space-between \| space-around \| space-evenly>` | No | `-` | - |
|
|
281
281
|
| `alignItems` | `ResponsiveProp<center \| normal \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
|
|
282
282
|
| `alignSelf` | `ResponsiveProp<center \| normal \| auto \| start \| end \| flex-start \| flex-end \| self-start \| self-end \| stretch \| baseline \| first baseline \| last baseline>` | No | `-` | - |
|
|
283
|
-
| `as` | `symbol \| object \| style \|
|
|
284
|
-
| `aspectRatio` |
|
|
283
|
+
| `as` | `symbol \| object \| style \| div \| a \| abbr \| address \| area \| article \| aside \| audio \| b \| base \| bdi \| bdo \| big \| blockquote \| body \| br \| button \| canvas \| caption \| center \| cite \| code \| col \| colgroup \| data \| datalist \| dd \| del \| details \| dfn \| dialog \| dl \| dt \| em \| embed \| fieldset \| figcaption \| figure \| footer \| form \| h1 \| h2 \| h3 \| h4 \| h5 \| h6 \| head \| header \| hgroup \| hr \| html \| i \| iframe \| img \| input \| ins \| kbd \| keygen \| label \| legend \| li \| link \| main \| map \| mark \| menu \| menuitem \| meta \| meter \| nav \| noindex \| noscript \| ol \| optgroup \| option \| output \| p \| param \| picture \| pre \| progress \| q \| rp \| rt \| ruby \| s \| samp \| search \| slot \| script \| section \| select \| small \| source \| span \| strong \| sub \| summary \| sup \| table \| template \| tbody \| td \| textarea \| tfoot \| th \| thead \| time \| title \| tr \| track \| u \| ul \| var \| video \| wbr \| webview \| svg \| animate \| animateMotion \| animateTransform \| circle \| clipPath \| defs \| desc \| ellipse \| feBlend \| feColorMatrix \| feComponentTransfer \| feComposite \| feConvolveMatrix \| feDiffuseLighting \| feDisplacementMap \| feDistantLight \| feDropShadow \| feFlood \| feFuncA \| feFuncB \| feFuncG \| feFuncR \| feGaussianBlur \| feImage \| feMerge \| feMergeNode \| feMorphology \| feOffset \| fePointLight \| feSpecularLighting \| feSpotLight \| feTile \| feTurbulence \| filter \| foreignObject \| g \| image \| line \| linearGradient \| marker \| mask \| metadata \| mpath \| path \| pattern \| polygon \| polyline \| radialGradient \| rect \| set \| stop \| switch \| text \| textPath \| tspan \| use \| view \| ComponentClass<any, any> \| FunctionComponent<any>` | No | `-` | - |
|
|
284
|
+
| `aspectRatio` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
285
285
|
| `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 | `-` | - |
|
|
286
286
|
| `borderBottomLeftRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
|
|
287
287
|
| `borderBottomRightRadius` | `0 \| 100 \| 200 \| 300 \| 400 \| 500 \| 600 \| 700 \| 800 \| 900 \| 1000` | No | `-` | - |
|
|
@@ -304,7 +304,7 @@ function Example() {
|
|
|
304
304
|
| `bottom` | `ResponsiveProp<Bottom<string \| number>>` | No | `-` | - |
|
|
305
305
|
| `children` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | ReactNode to be displayed at the middle of the module |
|
|
306
306
|
| `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 | `-` | - |
|
|
307
|
-
| `columnGap` | `0 \|
|
|
307
|
+
| `columnGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
308
308
|
| `dangerouslySetBackground` | `string` | No | `-` | - |
|
|
309
309
|
| `description` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | ReactNode or Text to be displayed in TextBody to provide details about the module |
|
|
310
310
|
| `display` | `ResponsiveProp<grid \| revert \| none \| block \| inline \| inline-block \| flex \| inline-flex \| inline-grid \| contents \| flow-root \| list-item>` | No | `-` | - |
|
|
@@ -312,27 +312,27 @@ function Example() {
|
|
|
312
312
|
| `end` | `null \| string \| number \| false \| true \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal` | No | `-` | ReactNode to display at the end |
|
|
313
313
|
| `flexBasis` | `ResponsiveProp<FlexBasis<string \| number>>` | No | `-` | - |
|
|
314
314
|
| `flexDirection` | `ResponsiveProp<column \| row \| row-reverse \| column-reverse>` | No | `-` | - |
|
|
315
|
-
| `flexGrow` |
|
|
316
|
-
| `flexShrink` |
|
|
315
|
+
| `flexGrow` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
316
|
+
| `flexShrink` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
317
317
|
| `flexWrap` | `ResponsiveProp<nowrap \| wrap \| wrap-reverse>` | No | `-` | - |
|
|
318
318
|
| `font` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
|
|
319
319
|
| `fontFamily` | `ResponsiveProp<FontFamily \| inherit>` | No | `-` | - |
|
|
320
320
|
| `fontSize` | `ResponsiveProp<FontSize \| inherit>` | No | `-` | - |
|
|
321
321
|
| `fontWeight` | `ResponsiveProp<FontWeight \| inherit>` | No | `-` | - |
|
|
322
|
-
| `gap` | `0 \|
|
|
323
|
-
| `grid` |
|
|
324
|
-
| `gridArea` |
|
|
322
|
+
| `gap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
323
|
+
| `grid` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
324
|
+
| `gridArea` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
325
325
|
| `gridAutoColumns` | `ResponsiveProp<GridAutoColumns<string \| number>>` | No | `-` | - |
|
|
326
|
-
| `gridAutoFlow` |
|
|
326
|
+
| `gridAutoFlow` | `inherit \| revert \| row \| column \| -moz-initial \| initial \| revert-layer \| unset \| dense` | No | `-` | - |
|
|
327
327
|
| `gridAutoRows` | `ResponsiveProp<GridAutoRows<string \| number>>` | No | `-` | - |
|
|
328
|
-
| `gridColumn` |
|
|
329
|
-
| `gridColumnEnd` |
|
|
330
|
-
| `gridColumnStart` |
|
|
331
|
-
| `gridRow` |
|
|
332
|
-
| `gridRowEnd` |
|
|
333
|
-
| `gridRowStart` |
|
|
334
|
-
| `gridTemplate` |
|
|
335
|
-
| `gridTemplateAreas` |
|
|
328
|
+
| `gridColumn` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
329
|
+
| `gridColumnEnd` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
330
|
+
| `gridColumnStart` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
331
|
+
| `gridRow` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
332
|
+
| `gridRowEnd` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
333
|
+
| `gridRowStart` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
334
|
+
| `gridTemplate` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
335
|
+
| `gridTemplateAreas` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
336
336
|
| `gridTemplateColumns` | `ResponsiveProp<GridTemplateColumns<string \| number>>` | No | `-` | - |
|
|
337
337
|
| `gridTemplateRows` | `ResponsiveProp<GridTemplateRows<string \| number>>` | No | `-` | - |
|
|
338
338
|
| `height` | `ResponsiveProp<Height<string \| number>>` | No | `-` | - |
|
|
@@ -351,31 +351,31 @@ function Example() {
|
|
|
351
351
|
| `minHeight` | `ResponsiveProp<MinHeight<string \| number>>` | No | `-` | - |
|
|
352
352
|
| `minWidth` | `ResponsiveProp<MinWidth<string \| number>>` | No | `-` | - |
|
|
353
353
|
| `onActionPress` | `MouseEventHandler<Element>` | No | `-` | Callback fired when the action button pressed and cannot be used when action is a React Element |
|
|
354
|
-
| `opacity` |
|
|
354
|
+
| `opacity` | `inherit \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
355
355
|
| `overflow` | `ResponsiveProp<hidden \| auto \| visible \| clip \| scroll>` | No | `-` | - |
|
|
356
|
-
| `padding` | `0 \|
|
|
357
|
-
| `paddingBottom` | `0 \|
|
|
358
|
-
| `paddingEnd` | `0 \|
|
|
359
|
-
| `paddingStart` | `0 \|
|
|
360
|
-
| `paddingTop` | `0 \|
|
|
361
|
-
| `paddingX` | `0 \|
|
|
362
|
-
| `paddingY` | `0 \|
|
|
356
|
+
| `padding` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
357
|
+
| `paddingBottom` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
358
|
+
| `paddingEnd` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
359
|
+
| `paddingStart` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
360
|
+
| `paddingTop` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
361
|
+
| `paddingX` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
362
|
+
| `paddingY` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
363
363
|
| `pictogram` | `string \| number \| boolean \| ReactElement<any, string \| JSXElementConstructor<any>> \| Iterable<ReactNode> \| ReactPortal \| null` | No | `-` | Illustration pictogram name or ReacNode to be displayed at the start of an module |
|
|
364
364
|
| `pin` | `top \| bottom \| left \| right \| all` | No | `-` | Direction in which to absolutely pin the box. |
|
|
365
365
|
| `position` | `ResponsiveProp<fixed \| static \| relative \| absolute \| sticky>` | No | `-` | - |
|
|
366
366
|
| `ref` | `any` | No | `-` | - |
|
|
367
367
|
| `right` | `ResponsiveProp<Right<string \| number>>` | No | `-` | - |
|
|
368
|
-
| `rowGap` | `0 \|
|
|
368
|
+
| `rowGap` | `0 \| 1 \| 2 \| 0.25 \| 0.5 \| 0.75 \| 1.5 \| 3 \| 4 \| 5 \| 6 \| 7 \| 8 \| 9 \| 10` | No | `-` | - |
|
|
369
369
|
| `style` | `CSSProperties` | No | `-` | - |
|
|
370
370
|
| `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 |
|
|
371
371
|
| `textAlign` | `ResponsiveProp<center \| start \| end \| justify>` | No | `-` | - |
|
|
372
372
|
| `textDecoration` | `ResponsiveProp<none \| underline \| overline \| line-through \| underline overline \| underline double>` | No | `-` | - |
|
|
373
373
|
| `textTransform` | `ResponsiveProp<capitalize \| lowercase \| none \| uppercase>` | No | `-` | - |
|
|
374
374
|
| `top` | `ResponsiveProp<Top<string \| number>>` | No | `-` | - |
|
|
375
|
-
| `transform` |
|
|
375
|
+
| `transform` | `inherit \| none \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
376
376
|
| `userSelect` | `ResponsiveProp<text \| none \| auto \| all>` | No | `-` | - |
|
|
377
377
|
| `visibility` | `ResponsiveProp<hidden \| visible>` | No | `-` | - |
|
|
378
378
|
| `width` | `ResponsiveProp<Width<string \| number>>` | No | `-` | - |
|
|
379
|
-
| `zIndex` |
|
|
379
|
+
| `zIndex` | `inherit \| auto \| revert \| -moz-initial \| initial \| revert-layer \| unset` | No | `-` | - |
|
|
380
380
|
|
|
381
381
|
|