@czi-sds/mcp 0.16.0 → 0.18.0
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/README.md +2 -1
- package/data/component-docs/Accordion.md +291 -0
- package/data/component-docs/Autocomplete.md +525 -0
- package/data/component-docs/Banner.md +231 -0
- package/data/component-docs/Button.md +224 -0
- package/data/component-docs/ButtonDropdown.md +256 -0
- package/data/component-docs/ButtonGroup.md +320 -0
- package/data/component-docs/ButtonToggle.md +397 -0
- package/data/component-docs/Callout.md +268 -0
- package/data/component-docs/CellBasic.md +122 -0
- package/data/component-docs/CellComponent.md +63 -0
- package/data/component-docs/CellHeader.md +128 -0
- package/data/component-docs/ComplexFilter.md +294 -0
- package/data/component-docs/ContentCard.md +406 -0
- package/data/component-docs/Dialog.md +651 -0
- package/data/component-docs/Dropdown.md +155 -0
- package/data/component-docs/DropdownMenu.md +949 -0
- package/data/component-docs/HeatmapChart.md +782 -0
- package/data/component-docs/Hero.md +363 -0
- package/data/component-docs/Icon.md +283 -0
- package/data/component-docs/InputCheckbox.md +205 -0
- package/data/component-docs/InputDropdown.md +482 -0
- package/data/component-docs/InputRadio.md +173 -0
- package/data/component-docs/InputSearch.md +81 -0
- package/data/component-docs/InputSlider.md +189 -0
- package/data/component-docs/InputText.md +110 -0
- package/data/component-docs/InputToggle.md +141 -0
- package/data/component-docs/IntentMessage.md +293 -0
- package/data/component-docs/Legend.md +442 -0
- package/data/component-docs/Link.md +23 -0
- package/data/component-docs/List.md +300 -0
- package/data/component-docs/LoadingIndicator.md +198 -0
- package/data/component-docs/Menu.md +298 -0
- package/data/component-docs/MenuItem.md +100 -0
- package/data/component-docs/NavigationFooter.md +165 -0
- package/data/component-docs/NavigationHeader.md +500 -0
- package/data/component-docs/NavigationJumpTo.md +414 -0
- package/data/component-docs/Notification.md +288 -0
- package/data/component-docs/Pagination.md +67 -0
- package/data/component-docs/Panel.md +636 -0
- package/data/component-docs/Popover.md +448 -0
- package/data/component-docs/PreComposedTable.md +2947 -0
- package/data/component-docs/ProteinStructureViewer.md +1044 -0
- package/data/component-docs/SegmentedControl.md +396 -0
- package/data/component-docs/StackedBarChart.md +475 -0
- package/data/component-docs/Table.md +2000 -0
- package/data/component-docs/TableHeader.md +53 -0
- package/data/component-docs/TableRow.md +74 -0
- package/data/component-docs/Tabs.md +455 -0
- package/data/component-docs/Tag.md +647 -0
- package/data/component-docs/TagFilter.md +131 -0
- package/data/component-docs/Tooltip.md +561 -0
- package/data/component-docs/TooltipCondensed.md +203 -0
- package/data/component-docs/TooltipTable.md +145 -0
- package/data/component-docs/index.json +267 -0
- package/data/component-list.json +2 -5
- package/data/component-props/Accordion.json +31 -11
- package/data/component-props/Alert.json +3 -3
- package/data/component-props/Autocomplete.json +150 -15
- package/data/component-props/Banner.json +31 -17
- package/data/component-props/Button.json +45 -20
- package/data/component-props/ButtonDropdown.json +36 -17
- package/data/component-props/ButtonDropdownLegacy.json +11 -11
- package/data/component-props/ButtonGroup.json +32 -11
- package/data/component-props/ButtonIcon.json +10 -10
- package/data/component-props/ButtonLegacy.json +19 -19
- package/data/component-props/ButtonToggle.json +32 -19
- package/data/component-props/ButtonToggleLegacy.json +11 -11
- package/data/component-props/Callout.json +58 -17
- package/data/component-props/CellBasic.json +94 -41
- package/data/component-props/CellComponent.json +23 -7
- package/data/component-props/CellHeader.json +62 -19
- package/data/component-props/ComplexFilter.json +52 -21
- package/data/component-props/ContentCard.json +70 -47
- package/data/component-props/Dialog.json +47 -14
- package/data/component-props/Dropdown.json +68 -31
- package/data/component-props/DropdownMenu.json +128 -23
- package/data/component-props/HeatmapChart.json +88 -12
- package/data/component-props/Hero.json +80 -39
- package/data/component-props/Icon.json +20 -9
- package/data/component-props/InputCheckbox.json +36 -14
- package/data/component-props/InputDropdown.json +75 -27
- package/data/component-props/InputRadio.json +31 -13
- package/data/component-props/InputSearch.json +41 -18
- package/data/component-props/InputSlider.json +46 -19
- package/data/component-props/InputText.json +26 -19
- package/data/component-props/InputToggle.json +26 -9
- package/data/component-props/IntentMessage.json +38 -9
- package/data/component-props/Link.json +13 -7
- package/data/component-props/LoadingIndicator.json +11 -3
- package/data/component-props/MenuItem.json +38 -19
- package/data/component-props/MenuSelect.json +8 -8
- package/data/component-props/NavigationFooter.json +49 -19
- package/data/component-props/NavigationHeader.json +150 -37
- package/data/component-props/NavigationJumpTo.json +33 -7
- package/data/component-props/Notification.json +39 -21
- package/data/component-props/Pagination.json +39 -11
- package/data/component-props/Panel.json +62 -9
- package/data/component-props/Popover.json +80 -7
- package/data/component-props/PreComposedTable.json +99 -27
- package/data/component-props/ProteinStructureViewer.json +117 -0
- package/data/component-props/SegmentedControl.json +42 -3
- package/data/component-props/StackedBarChart.json +116 -42
- package/data/component-props/TableRow.json +38 -19
- package/data/component-props/Tabs.json +66 -9
- package/data/component-props/Tag.json +34 -17
- package/data/component-props/TagFilter.json +10 -3
- package/data/component-props/Tooltip.json +49 -18
- package/data/component-props/TooltipCondensed.json +18 -9
- package/data/component-props/TooltipTable.json +17 -7
- package/data/resources/{zeroheight-rules.md → documentation-rules.md} +43 -30
- package/data/resources/figma-rules.md +2 -2
- package/data/tailwind.json +20 -14
- package/dist/stdio.js +112 -208
- package/package.json +9 -5
- package/data/component-props/ButtonDropdownV2.json +0 -34
- package/data/component-props/ButtonNew.json +0 -47
- package/data/component-props/ButtonToggleV2.json +0 -44
- package/data/component-props/ButtonV2.json +0 -43
- package/data/zeroheight-cache.json +0 -10259
- package/data/zeroheight-exports/Accordion.md +0 -774
- package/data/zeroheight-exports/Banner.md +0 -691
- package/data/zeroheight-exports/Borders.md +0 -117
- package/data/zeroheight-exports/Buttons.md +0 -1854
- package/data/zeroheight-exports/Callout.md +0 -931
- package/data/zeroheight-exports/Colors.md +0 -1755
- package/data/zeroheight-exports/Content-Card.md +0 -309
- package/data/zeroheight-exports/Contributing-to-SDS.md +0 -98
- package/data/zeroheight-exports/Control-Inputs.md +0 -2818
- package/data/zeroheight-exports/Corners.md +0 -104
- package/data/zeroheight-exports/Cover-page.md +0 -3
- package/data/zeroheight-exports/Dialog.md +0 -1367
- package/data/zeroheight-exports/Downloads.md +0 -236
- package/data/zeroheight-exports/Drop-Shadows.md +0 -79
- package/data/zeroheight-exports/Dropdown-Input.md +0 -1776
- package/data/zeroheight-exports/Dropdown-Menus.md +0 -913
- package/data/zeroheight-exports/Element-Status-Tracker.md +0 -267
- package/data/zeroheight-exports/Field-Inputs.md +0 -1405
- package/data/zeroheight-exports/Filters.md +0 -1111
- package/data/zeroheight-exports/Getting-Started.md +0 -1157
- package/data/zeroheight-exports/Hero.md +0 -414
- package/data/zeroheight-exports/Icons.md +0 -2067
- package/data/zeroheight-exports/Intent.md +0 -86
- package/data/zeroheight-exports/Introduction-to-Bases.md +0 -35
- package/data/zeroheight-exports/Introduction-to-Cells.md +0 -35
- package/data/zeroheight-exports/Introduction-to-DNA.md +0 -35
- package/data/zeroheight-exports/Introduction-to-Genes.md +0 -35
- package/data/zeroheight-exports/Introduction.md +0 -115
- package/data/zeroheight-exports/Link.md +0 -432
- package/data/zeroheight-exports/Lists.md +0 -986
- package/data/zeroheight-exports/Loading-Indicator.md +0 -41
- package/data/zeroheight-exports/Navigation.md +0 -1190
- package/data/zeroheight-exports/Notification.md +0 -1038
- package/data/zeroheight-exports/Panel.md +0 -1030
- package/data/zeroheight-exports/README.md +0 -122
- package/data/zeroheight-exports/Responsive-Design.md +0 -330
- package/data/zeroheight-exports/Search-Input.md +0 -91
- package/data/zeroheight-exports/Search.md +0 -822
- package/data/zeroheight-exports/Segmented-Control.md +0 -609
- package/data/zeroheight-exports/Spacing.md +0 -297
- package/data/zeroheight-exports/Table.md +0 -5345
- package/data/zeroheight-exports/Tabs.md +0 -1324
- package/data/zeroheight-exports/Tags.md +0 -1545
- package/data/zeroheight-exports/Text-Link.md +0 -268
- package/data/zeroheight-exports/Theming.md +0 -362
- package/data/zeroheight-exports/Tooltips.md +0 -2015
- package/data/zeroheight-exports/Typography.md +0 -800
|
@@ -2,43 +2,43 @@
|
|
|
2
2
|
"ButtonLegacy": {
|
|
3
3
|
"props": {
|
|
4
4
|
"endIcon": {
|
|
5
|
-
"
|
|
5
|
+
"description": "Element placed after the children.",
|
|
6
6
|
"isRequired": false,
|
|
7
|
-
"
|
|
7
|
+
"type": "ReactNode"
|
|
8
8
|
},
|
|
9
9
|
"icon": {
|
|
10
|
-
"
|
|
11
|
-
"
|
|
10
|
+
"isRequired": true,
|
|
11
|
+
"type": "ReactElement"
|
|
12
12
|
},
|
|
13
13
|
"isAllCaps": {
|
|
14
|
-
"
|
|
15
|
-
"
|
|
14
|
+
"isRequired": false,
|
|
15
|
+
"type": "boolean"
|
|
16
16
|
},
|
|
17
17
|
"onClick": {
|
|
18
|
-
"
|
|
19
|
-
"
|
|
18
|
+
"isRequired": false,
|
|
19
|
+
"type": "function"
|
|
20
20
|
},
|
|
21
21
|
"sdsSize": {
|
|
22
|
-
"
|
|
23
|
-
"
|
|
22
|
+
"isRequired": false,
|
|
23
|
+
"type": "\"small\" | \"large\" | \"medium\""
|
|
24
24
|
},
|
|
25
25
|
"sdsStyle": {
|
|
26
|
-
"
|
|
27
|
-
"
|
|
26
|
+
"isRequired": true,
|
|
27
|
+
"type": "\"square\" | \"rounded\" | \"icon\" | \"minimal\""
|
|
28
28
|
},
|
|
29
29
|
"sdsType": {
|
|
30
|
-
"
|
|
31
|
-
"
|
|
30
|
+
"isRequired": false,
|
|
31
|
+
"type": "\"primary\" | \"secondary\" | \"destructive\" | \"tertiary\""
|
|
32
32
|
},
|
|
33
33
|
"startIcon": {
|
|
34
|
-
"
|
|
34
|
+
"description": "Element placed before the children.",
|
|
35
35
|
"isRequired": false,
|
|
36
|
-
"
|
|
36
|
+
"type": "ReactNode"
|
|
37
37
|
},
|
|
38
38
|
"text": {
|
|
39
|
-
"
|
|
40
|
-
"
|
|
39
|
+
"isRequired": false,
|
|
40
|
+
"type": "any"
|
|
41
41
|
}
|
|
42
42
|
}
|
|
43
43
|
}
|
|
44
|
-
}
|
|
44
|
+
}
|
|
@@ -2,43 +2,56 @@
|
|
|
2
2
|
"ButtonToggle": {
|
|
3
3
|
"props": {
|
|
4
4
|
"backgroundAppearance": {
|
|
5
|
-
"
|
|
6
|
-
"
|
|
5
|
+
"defaultValue": "matchBackground",
|
|
6
|
+
"description": "Button's prop, telling the toggle which surface it sits on so it can pick colors with enough contrast.",
|
|
7
|
+
"isRequired": false,
|
|
8
|
+
"type": "\"matchBackground\" | \"dark\""
|
|
7
9
|
},
|
|
8
10
|
"children": {
|
|
9
|
-
"
|
|
11
|
+
"description": "The content of the component.",
|
|
10
12
|
"isRequired": false,
|
|
11
|
-
"
|
|
13
|
+
"type": "ReactNode"
|
|
12
14
|
},
|
|
13
15
|
"disabled": {
|
|
14
|
-
"
|
|
15
|
-
"isRequired": false,
|
|
16
|
+
"defaultValue": false,
|
|
16
17
|
"description": "If `true`, the component is disabled.",
|
|
17
|
-
"
|
|
18
|
+
"isRequired": false,
|
|
19
|
+
"type": "boolean"
|
|
18
20
|
},
|
|
19
21
|
"startIcon": {
|
|
20
|
-
"
|
|
22
|
+
"description": "Required. The icon displayed within the component. Pass the SDS Icon\ncomponent, for example `<Icon sdsIcon=\"Search\" sdsSize=\"s\" />`.",
|
|
21
23
|
"isRequired": true,
|
|
22
|
-
"
|
|
24
|
+
"type": "ReactElement"
|
|
23
25
|
},
|
|
24
26
|
"size": {
|
|
25
|
-
"
|
|
26
|
-
"isRequired": false,
|
|
27
|
+
"defaultValue": "medium",
|
|
27
28
|
"description": "The size of the component.\n`small` is equivalent to the dense button styling.",
|
|
28
|
-
"
|
|
29
|
+
"isRequired": false,
|
|
30
|
+
"type": "\"small\" | \"large\" | \"medium\""
|
|
29
31
|
},
|
|
30
32
|
"sdsType": {
|
|
31
|
-
"
|
|
32
|
-
"
|
|
33
|
+
"defaultValue": "primary",
|
|
34
|
+
"description": "Color scheme of the button. Primary uses the accent color in the on stage, secondary stays neutral. Set it explicitly: the on stage resolves its colors before Button applies this default, so an omitted value draws the neutral treatment over a button that is otherwise primary. Button's \"destructive\" is inherited by the type but has no on-stage treatment, so it should not be used here.",
|
|
35
|
+
"isRequired": false,
|
|
36
|
+
"type": "\"primary\" | \"secondary\" | \"destructive\""
|
|
33
37
|
},
|
|
34
38
|
"sdsStyle": {
|
|
35
|
-
"
|
|
36
|
-
"
|
|
39
|
+
"defaultValue": "solid",
|
|
40
|
+
"description": "Style of the button. ButtonToggle inherits Button's default of \"solid\", but toggles are designed around \"outline\" and \"minimal\", so set one of those explicitly.",
|
|
41
|
+
"isRequired": false,
|
|
42
|
+
"type": "\"outline\" | \"solid\" | \"minimal\""
|
|
37
43
|
},
|
|
38
44
|
"sdsStage": {
|
|
39
|
-
"
|
|
40
|
-
"
|
|
45
|
+
"defaultValue": "off",
|
|
46
|
+
"description": "Controls the toggle stage. The component is fully controlled, so keep this value in state and update it from onClick.",
|
|
47
|
+
"isRequired": false,
|
|
48
|
+
"type": "\"off\" | \"on\""
|
|
49
|
+
},
|
|
50
|
+
"onClick": {
|
|
51
|
+
"description": "Callback fired when the button is clicked.",
|
|
52
|
+
"isRequired": false,
|
|
53
|
+
"type": "function"
|
|
41
54
|
}
|
|
42
55
|
}
|
|
43
56
|
}
|
|
44
|
-
}
|
|
57
|
+
}
|
|
@@ -2,26 +2,26 @@
|
|
|
2
2
|
"ButtonToggleLegacy": {
|
|
3
3
|
"props": {
|
|
4
4
|
"disabled": {
|
|
5
|
-
"
|
|
5
|
+
"description": "If `true`, the component is disabled.",
|
|
6
6
|
"isRequired": false,
|
|
7
|
-
"
|
|
7
|
+
"type": "boolean"
|
|
8
8
|
},
|
|
9
9
|
"icon": {
|
|
10
|
-
"
|
|
11
|
-
"
|
|
10
|
+
"isRequired": true,
|
|
11
|
+
"type": "ReactElement"
|
|
12
12
|
},
|
|
13
13
|
"sdsSize": {
|
|
14
|
-
"
|
|
15
|
-
"
|
|
14
|
+
"isRequired": false,
|
|
15
|
+
"type": "\"small\" | \"large\" | \"medium\""
|
|
16
16
|
},
|
|
17
17
|
"sdsStage": {
|
|
18
|
-
"
|
|
19
|
-
"
|
|
18
|
+
"isRequired": false,
|
|
19
|
+
"type": "\"off\" | \"on\""
|
|
20
20
|
},
|
|
21
21
|
"sdsType": {
|
|
22
|
-
"
|
|
23
|
-
"
|
|
22
|
+
"isRequired": false,
|
|
23
|
+
"type": "\"primary\" | \"secondary\""
|
|
24
24
|
}
|
|
25
25
|
}
|
|
26
26
|
}
|
|
27
|
-
}
|
|
27
|
+
}
|
|
@@ -2,38 +2,79 @@
|
|
|
2
2
|
"Callout": {
|
|
3
3
|
"props": {
|
|
4
4
|
"autoDismiss": {
|
|
5
|
-
"
|
|
6
|
-
"isRequired": false
|
|
5
|
+
"description": "Dismisses the Callout on a timer. A number sets the delay in milliseconds, and true uses 8000. Leave it unset to keep the Callout visible until it is dismissed another way.",
|
|
6
|
+
"isRequired": false,
|
|
7
|
+
"type": "number | false | true"
|
|
7
8
|
},
|
|
8
9
|
"body": {
|
|
9
|
-
"
|
|
10
|
-
"isRequired": false
|
|
10
|
+
"description": "The Callout body, shown beneath the title.",
|
|
11
|
+
"isRequired": false,
|
|
12
|
+
"type": "ReactNode"
|
|
11
13
|
},
|
|
12
14
|
"hideBody": {
|
|
13
|
-
"
|
|
14
|
-
"
|
|
15
|
+
"defaultValue": false,
|
|
16
|
+
"description": "If set to true, hides the Callout body and centers the icon against the remaining content.",
|
|
17
|
+
"isRequired": false,
|
|
18
|
+
"type": "boolean"
|
|
15
19
|
},
|
|
16
20
|
"hideTitle": {
|
|
17
|
-
"
|
|
18
|
-
"
|
|
21
|
+
"defaultValue": false,
|
|
22
|
+
"description": "If set to true, hides the Callout title.",
|
|
23
|
+
"isRequired": false,
|
|
24
|
+
"type": "boolean"
|
|
19
25
|
},
|
|
20
26
|
"icon": {
|
|
21
|
-
"
|
|
27
|
+
"description": "Override the icon displayed before the children.\nUnless provided, the icon is mapped to the value of the `severity` prop.\nSet to `false` to remove the `icon`.",
|
|
22
28
|
"isRequired": false,
|
|
23
|
-
"
|
|
29
|
+
"type": "ReactNode"
|
|
24
30
|
},
|
|
25
31
|
"intent": {
|
|
26
|
-
"
|
|
27
|
-
"isRequired": true
|
|
32
|
+
"description": "Required. Sets both the color of the component and the icon it defaults to.",
|
|
33
|
+
"isRequired": true,
|
|
34
|
+
"type": "\"info\" | \"accent\" | \"negative\" | \"notice\" | \"positive\""
|
|
28
35
|
},
|
|
29
36
|
"sdsStyle": {
|
|
30
|
-
"
|
|
31
|
-
"
|
|
37
|
+
"defaultValue": "persistent",
|
|
38
|
+
"description": "Defines the style of the Callout: - \"persistent\": Cannot be closed. - \"expandable\": Includes a chevron icon that toggles the children in and out of view. - \"dismissible\": Includes an “x” icon for manual dismissal.",
|
|
39
|
+
"isRequired": false,
|
|
40
|
+
"type": "\"dismissible\" | \"persistent\" | \"expandable\""
|
|
32
41
|
},
|
|
33
42
|
"title": {
|
|
34
|
-
"
|
|
35
|
-
"isRequired": false
|
|
43
|
+
"description": "The Callout title.",
|
|
44
|
+
"isRequired": false,
|
|
45
|
+
"type": "string"
|
|
46
|
+
},
|
|
47
|
+
"children": {
|
|
48
|
+
"description": "The content of the component.",
|
|
49
|
+
"isRequired": false,
|
|
50
|
+
"type": "ReactNode"
|
|
51
|
+
},
|
|
52
|
+
"extraContent": {
|
|
53
|
+
"description": "The same slot as `children`, for callers that would rather pass it as a\nprop. Both render when both are given, `children` first.",
|
|
54
|
+
"isRequired": false,
|
|
55
|
+
"type": "ReactNode"
|
|
56
|
+
},
|
|
57
|
+
"sdsIconProps": {
|
|
58
|
+
"description": "Props forwarded to the Icon component when icon is given as a name.",
|
|
59
|
+
"isRequired": false,
|
|
60
|
+
"type": "Partial<IconProps>"
|
|
61
|
+
},
|
|
62
|
+
"sdsStage": {
|
|
63
|
+
"defaultValue": "open",
|
|
64
|
+
"description": "The stage an expandable Callout starts in. It is only the initial value; the chevron takes over from there.",
|
|
65
|
+
"isRequired": false,
|
|
66
|
+
"type": "\"open\" | \"closed\""
|
|
67
|
+
},
|
|
68
|
+
"dismissed": {
|
|
69
|
+
"description": "Hides the Callout when set to true. Changing it back to false brings the Callout back, which is how a dismissed Callout is restored.",
|
|
70
|
+
"isRequired": false,
|
|
71
|
+
"type": "boolean"
|
|
72
|
+
},
|
|
73
|
+
"onClose": {
|
|
74
|
+
"description": "Callback fired when the component requests to be closed.\nWhen provided and no `action` prop is set, a close icon button is displayed that triggers the callback when clicked.\n@param event The event source of the callback.",
|
|
75
|
+
"isRequired": false,
|
|
76
|
+
"type": "(event: SyntheticEvent<Element, Event>) => void"
|
|
36
77
|
}
|
|
37
78
|
}
|
|
38
79
|
}
|
|
39
|
-
}
|
|
80
|
+
}
|
|
@@ -1,82 +1,135 @@
|
|
|
1
1
|
{
|
|
2
2
|
"CellBasic": {
|
|
3
3
|
"props": {
|
|
4
|
-
"component": {
|
|
5
|
-
"type": "\"symbol\" | \"object\" | \"cite\" | \"data\" | \"form\" | \"label\" | \"pattern\" | \"span\" | \"summary\" | \"slot\" | \"style\" | \"title\" | \"center\" | \"link\" | \"a\" | \"abbr\" | \"address\" | \"area\" | \"article\" | \"aside\" | \"audio\" | \"b\" | \"base\" | \"bdi\" | \"bdo\" | \"big\" | \"blockquote\" | \"body\" | \"br\" | \"button\" | \"canvas\" | \"caption\" | \"code\" | \"col\" | \"colgroup\" | \"datalist\" | \"dd\" | \"del\" | \"details\" | \"dfn\" | \"dialog\" | \"div\" | \"dl\" | \"dt\" | \"em\" | \"embed\" | \"fieldset\" | \"figcaption\" | \"figure\" | \"footer\" | \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" | \"head\" | \"header\" | \"hgroup\" | \"hr\" | \"html\" | \"i\" | \"iframe\" | \"img\" | \"input\" | \"ins\" | \"kbd\" | \"keygen\" | \"legend\" | \"li\" | \"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\" | \"script\" | \"section\" | \"select\" | \"small\" | \"source\" | \"strong\" | \"sub\" | \"sup\" | \"table\" | \"template\" | \"tbody\" | \"td\" | \"textarea\" | \"tfoot\" | \"th\" | \"thead\" | \"time\" | \"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\" | \"polygon\" | \"polyline\" | \"radialGradient\" | \"rect\" | \"set\" | \"stop\" | \"switch\" | \"text\" | \"textPath\" | \"tspan\" | \"use\" | \"view\" | \"ComponentClass",
|
|
6
|
-
"isRequired": false
|
|
7
|
-
},
|
|
8
4
|
"horizontalAlign": {
|
|
9
|
-
"
|
|
10
|
-
"
|
|
5
|
+
"defaultValue": "left",
|
|
6
|
+
"description": "Horizontal alignment of cell content. There is no \"center\". Use CellComponent if a cell needs centered content.",
|
|
7
|
+
"isRequired": false,
|
|
8
|
+
"type": "\"left\" | \"right\""
|
|
11
9
|
},
|
|
12
10
|
"icon": {
|
|
13
|
-
"
|
|
14
|
-
"isRequired": false
|
|
11
|
+
"description": "Places an icon to the left of the cell text. Expects an SDS Icon or another SVG element.",
|
|
12
|
+
"isRequired": false,
|
|
13
|
+
"type": "ReactElement"
|
|
15
14
|
},
|
|
16
15
|
"iconVerticalAlign": {
|
|
17
|
-
"
|
|
18
|
-
"
|
|
16
|
+
"defaultValue": "top",
|
|
17
|
+
"description": "Vertical alignment of the icon component.",
|
|
18
|
+
"isRequired": false,
|
|
19
|
+
"type": "\"center\" | \"bottom\" | \"top\""
|
|
19
20
|
},
|
|
20
21
|
"primaryText": {
|
|
21
|
-
"
|
|
22
|
-
"isRequired": true
|
|
22
|
+
"description": "Primary text value.",
|
|
23
|
+
"isRequired": true,
|
|
24
|
+
"type": "string"
|
|
23
25
|
},
|
|
24
26
|
"primaryTextComponentSlotBottom": {
|
|
25
|
-
"
|
|
26
|
-
"
|
|
27
|
+
"defaultValue": null,
|
|
28
|
+
"description": "Component slot below primary text. This will only show if there is no secondary or tertiary text. Remove the default values of secondary and tertiary text to see this in action.",
|
|
29
|
+
"isRequired": false,
|
|
30
|
+
"type": "ReactNode"
|
|
27
31
|
},
|
|
28
32
|
"primaryTextComponentSlotRight": {
|
|
29
|
-
"
|
|
30
|
-
"
|
|
33
|
+
"defaultValue": null,
|
|
34
|
+
"description": "Component slot to the right of primary text",
|
|
35
|
+
"isRequired": false,
|
|
36
|
+
"type": "ReactNode"
|
|
31
37
|
},
|
|
32
38
|
"primaryTextWrapLineCount": {
|
|
33
|
-
"
|
|
34
|
-
"
|
|
39
|
+
"defaultValue": 3,
|
|
40
|
+
"description": "Number of text wrap lines for primary text.",
|
|
41
|
+
"isRequired": false,
|
|
42
|
+
"type": "number"
|
|
35
43
|
},
|
|
36
44
|
"secondaryText": {
|
|
37
|
-
"
|
|
38
|
-
"isRequired": false
|
|
45
|
+
"description": "Secondary Text.",
|
|
46
|
+
"isRequired": false,
|
|
47
|
+
"type": "string"
|
|
39
48
|
},
|
|
40
49
|
"secondaryTextWrapLineCount": {
|
|
41
|
-
"
|
|
42
|
-
"
|
|
50
|
+
"defaultValue": 1,
|
|
51
|
+
"description": "Number of text wrap lines for secondary text.",
|
|
52
|
+
"isRequired": false,
|
|
53
|
+
"type": "number"
|
|
43
54
|
},
|
|
44
55
|
"shouldShowTooltipOnHover": {
|
|
45
|
-
"
|
|
46
|
-
"
|
|
56
|
+
"defaultValue": true,
|
|
57
|
+
"description": "When true the cell is wrapped in a Tooltip whose title is primaryText and whose subtitle is secondaryText. Turn it off for cells whose text is already fully visible, otherwise every cell in the table has a tooltip.",
|
|
58
|
+
"isRequired": false,
|
|
59
|
+
"type": "boolean"
|
|
47
60
|
},
|
|
48
61
|
"shouldShowUnderlineOnHover": {
|
|
49
|
-
"
|
|
50
|
-
"
|
|
62
|
+
"defaultValue": false,
|
|
63
|
+
"description": "Underlines primaryText on hover. Inside a PreComposedTable the underline also appears when any cell in the row is hovered.",
|
|
64
|
+
"isRequired": false,
|
|
65
|
+
"type": "boolean"
|
|
51
66
|
},
|
|
52
67
|
"shouldTextWrap": {
|
|
53
|
-
"
|
|
54
|
-
"
|
|
68
|
+
"defaultValue": true,
|
|
69
|
+
"description": "When true, each text clamps to its wrap line count. When false, text stays on one line and truncates with an ellipsis instead.",
|
|
70
|
+
"isRequired": false,
|
|
71
|
+
"type": "boolean"
|
|
55
72
|
},
|
|
56
73
|
"tabularNums": {
|
|
57
|
-
"
|
|
58
|
-
"
|
|
74
|
+
"defaultValue": false,
|
|
75
|
+
"description": "Renders digits at a fixed width so numbers line up column to column. Worth turning on for any numeric column.",
|
|
76
|
+
"isRequired": false,
|
|
77
|
+
"type": "boolean"
|
|
59
78
|
},
|
|
60
79
|
"tertiaryText": {
|
|
61
|
-
"
|
|
62
|
-
"isRequired": false
|
|
80
|
+
"description": "Tertiary Text.",
|
|
81
|
+
"isRequired": false,
|
|
82
|
+
"type": "string"
|
|
63
83
|
},
|
|
64
84
|
"tertiaryTextWrapLineCount": {
|
|
65
|
-
"
|
|
66
|
-
"
|
|
85
|
+
"defaultValue": 1,
|
|
86
|
+
"description": "Number of text wrap lines for tertiary text.",
|
|
87
|
+
"isRequired": false,
|
|
88
|
+
"type": "number"
|
|
67
89
|
},
|
|
68
90
|
"tooltipProps": {
|
|
69
|
-
"
|
|
70
|
-
"isRequired": false
|
|
91
|
+
"description": "Passed to the Tooltip, and overrides the defaults the cell sets (title, subtitle, arrow, dark style, no leave delay).",
|
|
92
|
+
"isRequired": false,
|
|
93
|
+
"type": "Partial<TooltipProps>"
|
|
71
94
|
},
|
|
72
95
|
"verticalAlign": {
|
|
73
|
-
"
|
|
74
|
-
"
|
|
96
|
+
"defaultValue": "top",
|
|
97
|
+
"description": "Vertical alignment of the cell content.",
|
|
98
|
+
"isRequired": false,
|
|
99
|
+
"type": "\"center\" | \"bottom\" | \"top\""
|
|
75
100
|
},
|
|
76
101
|
"width": {
|
|
77
|
-
"
|
|
78
|
-
"isRequired": false
|
|
102
|
+
"description": "Lands on the rendered cell as the HTML width attribute, so a number is read as pixels. Browsers treat it as the width of the whole column, and take it as a minimum rather than a promise.",
|
|
103
|
+
"isRequired": false,
|
|
104
|
+
"type": "string | number"
|
|
105
|
+
},
|
|
106
|
+
"as": {
|
|
107
|
+
"defaultValue": "td",
|
|
108
|
+
"description": "The element the cell renders as. Use \"th\" for a row header cell inside tbody.",
|
|
109
|
+
"isRequired": false,
|
|
110
|
+
"type": "\"symbol\" | \"object\" | \"style\" | \"button\" | \"div\" | \"a\" | \"abbr\" | \"address\" | \"area\" | \"article\" | \"aside\" | \"audio\" | \"b\" | \"base\" | \"bdi\" | \"bdo\" | \"big\" | \"blockquote\" | \"body\" | \"br\" | \"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>"
|
|
111
|
+
},
|
|
112
|
+
"extraRightPadding": {
|
|
113
|
+
"defaultValue": 0,
|
|
114
|
+
"description": "Extra pixels of right padding, added only when horizontalAlign is \"right\". Useful for leaving room for a scrollbar or a pinned column edge.",
|
|
115
|
+
"isRequired": false,
|
|
116
|
+
"type": "number"
|
|
117
|
+
},
|
|
118
|
+
"link": {
|
|
119
|
+
"description": "Wraps the cell content in an anchor pointing here. The text keeps the cell's own color rather than link styling.",
|
|
120
|
+
"isRequired": false,
|
|
121
|
+
"type": "string"
|
|
122
|
+
},
|
|
123
|
+
"linkComponent": {
|
|
124
|
+
"description": "The component the link renders as, for routers that supply their own link (React Router's Link, for example).",
|
|
125
|
+
"isRequired": false,
|
|
126
|
+
"type": "\"symbol\" | \"object\" | \"style\" | \"button\" | \"div\" | \"a\" | \"abbr\" | \"address\" | \"area\" | \"article\" | \"aside\" | \"audio\" | \"b\" | \"base\" | \"bdi\" | \"bdo\" | \"big\" | \"blockquote\" | \"body\" | \"br\" | \"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>"
|
|
127
|
+
},
|
|
128
|
+
"linkProps": {
|
|
129
|
+
"description": "Props passed to the anchor rendered by link.",
|
|
130
|
+
"isRequired": false,
|
|
131
|
+
"type": "AnchorHTMLAttributes<HTMLAnchorElement>"
|
|
79
132
|
}
|
|
80
133
|
}
|
|
81
134
|
}
|
|
82
|
-
}
|
|
135
|
+
}
|
|
@@ -2,17 +2,33 @@
|
|
|
2
2
|
"CellComponent": {
|
|
3
3
|
"props": {
|
|
4
4
|
"horizontalAlign": {
|
|
5
|
-
"
|
|
6
|
-
"
|
|
5
|
+
"defaultValue": "left",
|
|
6
|
+
"description": "Specifies the horizontal alignment of the cell content.",
|
|
7
|
+
"isRequired": false,
|
|
8
|
+
"type": "\"center\" | \"left\" | \"right\""
|
|
7
9
|
},
|
|
8
10
|
"verticalAlign": {
|
|
9
|
-
"
|
|
10
|
-
"
|
|
11
|
+
"defaultValue": "top",
|
|
12
|
+
"description": "Specifies the vertical alignment of the cell content.",
|
|
13
|
+
"isRequired": false,
|
|
14
|
+
"type": "\"center\" | \"bottom\" | \"top\""
|
|
11
15
|
},
|
|
12
16
|
"width": {
|
|
13
|
-
"
|
|
14
|
-
"isRequired": false
|
|
17
|
+
"description": "Lands on the rendered cell as the HTML width attribute, so a number is read as pixels. Browsers treat it as the width of the whole column, and take it as a minimum rather than a promise.",
|
|
18
|
+
"isRequired": false,
|
|
19
|
+
"type": "string | number"
|
|
20
|
+
},
|
|
21
|
+
"as": {
|
|
22
|
+
"defaultValue": "td",
|
|
23
|
+
"description": "The element the cell renders as.",
|
|
24
|
+
"isRequired": false,
|
|
25
|
+
"type": "\"symbol\" | \"object\" | \"style\" | \"button\" | \"div\" | \"a\" | \"abbr\" | \"address\" | \"area\" | \"article\" | \"aside\" | \"audio\" | \"b\" | \"base\" | \"bdi\" | \"bdo\" | \"big\" | \"blockquote\" | \"body\" | \"br\" | \"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>"
|
|
26
|
+
},
|
|
27
|
+
"children": {
|
|
28
|
+
"description": "The cell's content. Unlike CellBasic, which takes text through primaryText, this cell renders whatever you put inside it.",
|
|
29
|
+
"isRequired": false,
|
|
30
|
+
"type": "React.ReactNode"
|
|
15
31
|
}
|
|
16
32
|
}
|
|
17
33
|
}
|
|
18
|
-
}
|
|
34
|
+
}
|