@czi-sds/mcp 0.3.0 → 0.4.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.
Files changed (145) hide show
  1. package/data/component-props/Accordion.json +14 -15
  2. package/data/component-props/Alert.json +2 -44
  3. package/data/component-props/Autocomplete.json +14 -32
  4. package/data/component-props/Banner.json +11 -12
  5. package/data/component-props/Button.json +17 -82
  6. package/data/component-props/ButtonDropdown.json +26 -0
  7. package/data/component-props/ButtonIcon.json +4 -60
  8. package/data/component-props/ButtonToggle.json +2 -66
  9. package/data/component-props/Callout.json +11 -65
  10. package/data/component-props/CellBasic.json +28 -56
  11. package/data/component-props/CellComponent.json +4 -32
  12. package/data/component-props/CellHeader.json +13 -49
  13. package/data/component-props/ComplexFilter.json +24 -4
  14. package/data/component-props/ContentCard.json +66 -2
  15. package/data/component-props/Dialog.json +26 -0
  16. package/data/component-props/Dropdown.json +29 -67
  17. package/data/component-props/DropdownMenu.json +16 -56
  18. package/data/component-props/HeatmapChart.json +6 -87
  19. package/data/component-props/Icon.json +3 -8
  20. package/data/component-props/InputCheckbox.json +5 -53
  21. package/data/component-props/InputDropdown.json +11 -33
  22. package/data/component-props/InputRadio.json +5 -53
  23. package/data/component-props/InputSearch.json +6 -70
  24. package/data/component-props/InputSlider.json +21 -35
  25. package/data/component-props/InputText.json +7 -63
  26. package/data/component-props/InputToggle.json +5 -54
  27. package/data/component-props/Link.json +18 -0
  28. package/data/component-props/LoadingIndicator.json +1 -2
  29. package/data/component-props/MenuItem.json +11 -41
  30. package/data/component-props/MenuSelect.json +4 -67
  31. package/data/component-props/NavigationFooter.json +0 -8
  32. package/data/component-props/NavigationHeader.json +14 -65
  33. package/data/component-props/NavigationJumpTo.json +0 -40
  34. package/data/component-props/Notification.json +14 -58
  35. package/data/component-props/Pagination.json +8 -33
  36. package/data/component-props/Panel.json +4 -54
  37. package/data/component-props/SegmentedControl.json +0 -55
  38. package/data/component-props/TableRow.json +10 -38
  39. package/data/component-props/Tabs.json +18 -0
  40. package/data/component-props/Tag.json +10 -56
  41. package/data/component-props/TagFilter.json +0 -47
  42. package/data/component-props/Tooltip.json +12 -61
  43. package/data/component-props/TooltipCondensed.json +18 -0
  44. package/data/component-props/TooltipTable.json +0 -4
  45. package/data/zeroheight-exports/Accordion.md +167 -125
  46. package/data/zeroheight-exports/Banner.md +71 -48
  47. package/data/zeroheight-exports/Borders.md +72 -73
  48. package/data/zeroheight-exports/Buttons.md +375 -330
  49. package/data/zeroheight-exports/Callout.md +138 -116
  50. package/data/zeroheight-exports/Colors.md +254 -255
  51. package/data/zeroheight-exports/Content-Card.md +36 -37
  52. package/data/zeroheight-exports/Contributing-to-SDS.md +34 -35
  53. package/data/zeroheight-exports/Control-Inputs.md +289 -234
  54. package/data/zeroheight-exports/Corners.md +63 -64
  55. package/data/zeroheight-exports/Cover-page.md +0 -1
  56. package/data/zeroheight-exports/Dialog.md +237 -179
  57. package/data/zeroheight-exports/Downloads.md +10 -11
  58. package/data/zeroheight-exports/Drop-Shadows.md +40 -41
  59. package/data/zeroheight-exports/Dropdown-Input.md +158 -127
  60. package/data/zeroheight-exports/Dropdown-Menu.md +814 -718
  61. package/data/zeroheight-exports/Element-Status-Tracker.md +191 -192
  62. package/data/zeroheight-exports/Field-Inputs.md +149 -130
  63. package/data/zeroheight-exports/Filters.md +114 -94
  64. package/data/zeroheight-exports/Getting-Started.md +112 -249
  65. package/data/zeroheight-exports/Hero.md +43 -37
  66. package/data/zeroheight-exports/Icons.md +205 -206
  67. package/data/zeroheight-exports/Intent.md +6 -7
  68. package/data/zeroheight-exports/Introduction-to-Bases.md +8 -9
  69. package/data/zeroheight-exports/Introduction-to-Cells.md +11 -12
  70. package/data/zeroheight-exports/Introduction-to-DNA.md +8 -9
  71. package/data/zeroheight-exports/Introduction-to-Genes.md +8 -9
  72. package/data/zeroheight-exports/Introduction.md +52 -53
  73. package/data/zeroheight-exports/Link.md +50 -37
  74. package/data/zeroheight-exports/Lists.md +78 -63
  75. package/data/zeroheight-exports/Loading-Indicator.md +7 -8
  76. package/data/zeroheight-exports/Navigation.md +163 -142
  77. package/data/zeroheight-exports/Notification.md +132 -102
  78. package/data/zeroheight-exports/Panel.md +231 -115
  79. package/data/zeroheight-exports/Responsive-Design.md +35 -32
  80. package/data/zeroheight-exports/Search-Input.md +9 -10
  81. package/data/zeroheight-exports/Search.md +87 -104
  82. package/data/zeroheight-exports/Segmented-Control.md +68 -45
  83. package/data/zeroheight-exports/Spacing.md +210 -211
  84. package/data/zeroheight-exports/Table.md +414 -302
  85. package/data/zeroheight-exports/Tabs.md +126 -98
  86. package/data/zeroheight-exports/Tags.md +148 -118
  87. package/data/zeroheight-exports/Text-Link.md +32 -33
  88. package/data/zeroheight-exports/Theming.md +48 -29
  89. package/data/zeroheight-exports/Tooltips.md +253 -237
  90. package/data/zeroheight-exports/Typography.md +463 -464
  91. package/dist/stdio.js +44 -132
  92. package/package.json +3 -4
  93. package/data/component-props/Chip.json +0 -73
  94. package/data/component-props/List.json +0 -43
  95. package/data/component-props/Menu.json +0 -48
  96. package/data/component-props/Table.json +0 -26
  97. package/data/component-props-storybook/Accordion-storybook.json +0 -45
  98. package/data/component-props-storybook/Alert-storybook.json +0 -30
  99. package/data/component-props-storybook/Autocomplete-storybook.json +0 -67
  100. package/data/component-props-storybook/Banner-storybook.json +0 -78
  101. package/data/component-props-storybook/Button-storybook.json +0 -115
  102. package/data/component-props-storybook/ButtonDropdown-storybook.json +0 -73
  103. package/data/component-props-storybook/ButtonIcon-storybook.json +0 -60
  104. package/data/component-props-storybook/ButtonToggle-storybook.json +0 -68
  105. package/data/component-props-storybook/Callout-storybook.json +0 -90
  106. package/data/component-props-storybook/CellBasic-storybook.json +0 -138
  107. package/data/component-props-storybook/CellComponent-storybook.json +0 -48
  108. package/data/component-props-storybook/CellHeader-storybook.json +0 -71
  109. package/data/component-props-storybook/Chip-storybook.json +0 -26
  110. package/data/component-props-storybook/ComplexFilter-storybook.json +0 -60
  111. package/data/component-props-storybook/ContentCard-storybook.json +0 -175
  112. package/data/component-props-storybook/Dialog-storybook.json +0 -56
  113. package/data/component-props-storybook/Dropdown-storybook.json +0 -93
  114. package/data/component-props-storybook/DropdownMenu-storybook.json +0 -73
  115. package/data/component-props-storybook/HeatmapChart-storybook.json +0 -55
  116. package/data/component-props-storybook/Icon-storybook.json +0 -75
  117. package/data/component-props-storybook/InputCheckbox-storybook.json +0 -57
  118. package/data/component-props-storybook/InputDropdown-storybook.json +0 -80
  119. package/data/component-props-storybook/InputRadio-storybook.json +0 -56
  120. package/data/component-props-storybook/InputSearch-storybook.json +0 -55
  121. package/data/component-props-storybook/InputSlider-storybook.json +0 -55
  122. package/data/component-props-storybook/InputText-storybook.json +0 -59
  123. package/data/component-props-storybook/InputToggle-storybook.json +0 -42
  124. package/data/component-props-storybook/Link-storybook.json +0 -50
  125. package/data/component-props-storybook/List-storybook.json +0 -26
  126. package/data/component-props-storybook/LoadingIndicator-storybook.json +0 -34
  127. package/data/component-props-storybook/Menu-storybook.json +0 -26
  128. package/data/component-props-storybook/MenuItem-storybook.json +0 -74
  129. package/data/component-props-storybook/MenuSelect-storybook.json +0 -38
  130. package/data/component-props-storybook/NavigationFooter-storybook.json +0 -67
  131. package/data/component-props-storybook/NavigationHeader-storybook.json +0 -115
  132. package/data/component-props-storybook/NavigationJumpTo-storybook.json +0 -41
  133. package/data/component-props-storybook/Notification-storybook.json +0 -89
  134. package/data/component-props-storybook/Pagination-storybook.json +0 -50
  135. package/data/component-props-storybook/Panel-storybook.json +0 -52
  136. package/data/component-props-storybook/SegmentedControl-storybook.json +0 -30
  137. package/data/component-props-storybook/Table-storybook.json +0 -26
  138. package/data/component-props-storybook/TableHeader-storybook.json +0 -26
  139. package/data/component-props-storybook/TableRow-storybook.json +0 -62
  140. package/data/component-props-storybook/Tabs-storybook.json +0 -45
  141. package/data/component-props-storybook/Tag-storybook.json +0 -78
  142. package/data/component-props-storybook/TagFilter-storybook.json +0 -30
  143. package/data/component-props-storybook/Tooltip-storybook.json +0 -85
  144. package/data/component-props-storybook/TooltipCondensed-storybook.json +0 -38
  145. package/data/component-props-storybook/TooltipTable-storybook.json +0 -47
package/data/zeroheight-exports/Corners.md CHANGED
@@ -4,21 +4,21 @@ Corners (border radiuses) provide visual, and often functional, distinction and
4
4
 
5
5
  ### Types of Corners
6
6
 
7
- | **Example** | | **Corner Type** | | **Usage** |
8
- | --- | --- | --- | --- | --- |
9
- | | | Large Corner | | Rounded elements (for example: rounded Buttons and rounded Dropdown Inputs) |
10
- | | | Medium Corner | | Standard, default radius for corners in UI elements ( for example: square Buttons, Dialogs, square Tags, etc.) |
11
- | | | Small Corner | | Corners on elements that are smaller than 20px × 20px that need a square corner (for example: Checkboxes) |
12
- | | | No Set Corner | | Corners for elements without any radius (for example: backgrounds on Menu Items and Table Cells) |
7
+ | **Example** | | **Corner Type** | | **Usage** |
8
+ | ----------- | --- | --------------- | --- | -------------------------------------------------------------------------------------------------------------- |
9
+ | | | Large Corner | | Rounded elements (for example: rounded Buttons and rounded Dropdown Inputs) |
10
+ | | | Medium Corner | | Standard, default radius for corners in UI elements ( for example: square Buttons, Dialogs, square Tags, etc.) |
11
+ | | | Small Corner | | Corners on elements that are smaller than 20px × 20px that need a square corner (for example: Checkboxes) |
12
+ | | | No Set Corner | | Corners for elements without any radius (for example: backgrounds on Menu Items and Table Cells) |
13
13
 
14
14
  ### Corner Variables
15
15
 
16
- | **Visual** | | **Figma Variable** | | **CSS / SCSS Variables** | | **Value** |
17
- | --- | --- | --- | --- | --- | --- | --- |
18
- | | | `cornerL` | | `--sds-corner-l` `$sds-corner-l` | | `border-radius: 20px;` |
19
- | | | `cornerM` | | `--sds-corner-m` `$sds-corner-m` | | `border-radius: 4px;` |
20
- | | | `cornerS` | | `--sds-corner-s` `$sds-corner-s` | | `border-radius: 2px;` |
21
- | | | `cornerNone` | | `--sds-corner-none` `$sds-corner-none` | | `border-radius: 0px;` |
16
+ | **Visual** | | **Figma Variable** | | **CSS / SCSS Variables** | | **Value** |
17
+ | ---------- | --- | ------------------ | --- | -------------------------------------- | --- | ---------------------- |
18
+ | | | `cornerL` | | `--sds-corner-l` `$sds-corner-l` | | `border-radius: 20px;` |
19
+ | | | `cornerM` | | `--sds-corner-m` `$sds-corner-m` | | `border-radius: 4px;` |
20
+ | | | `cornerS` | | `--sds-corner-s` `$sds-corner-s` | | `border-radius: 2px;` |
21
+ | | | `cornerNone` | | `--sds-corner-none` `$sds-corner-none` | | `border-radius: 0px;` |
22
22
 
23
23
  ---
24
24
 
@@ -26,27 +26,27 @@ Corners (border radiuses) provide visual, and often functional, distinction and
26
26
 
27
27
  ### Types of Corners
28
28
 
29
- | **Example** | | **Corner Type** | | **Usage** |
30
- | --- | --- | --- | --- | --- |
31
- | | | Large Corner | | Rounded elements (such as Tags) |
32
- | | | Medium Corner | | UI elements with slightly rounded corners (such as Dropdown Menus) |
33
- | | | No Set Corner | | Standard, default radius for corners in UI elements (Square and Copy Buttons, Checkboxes, Dialogs, Tooltips, etc.) |
29
+ | **Example** | | **Corner Type** | | **Usage** |
30
+ | ----------- | --- | --------------- | --- | ------------------------------------------------------------------------------------------------------------------ |
31
+ | | | Large Corner | | Rounded elements (such as Tags) |
32
+ | | | Medium Corner | | UI elements with slightly rounded corners (such as Dropdown Menus) |
33
+ | | | No Set Corner | | Standard, default radius for corners in UI elements (Square and Copy Buttons, Checkboxes, Dialogs, Tooltips, etc.) |
34
34
 
35
35
  ### Corner Variables
36
36
 
37
- | **Visual** | | **Variable** | | **Value** |
38
- | --- | --- | --- | --- | --- |
39
- | | | `cornerL` | | `border-radius: 20px;` |
40
- | | | `cornerM` | | `border-radius: 4px;` |
41
- | | | `cornerNone` | | `border-radius: 0px;` |
37
+ | **Visual** | | **Variable** | | **Value** |
38
+ | ---------- | --- | ------------ | --- | ---------------------- |
39
+ | | | `cornerL` | | `border-radius: 20px;` |
40
+ | | | `cornerM` | | `border-radius: 4px;` |
41
+ | | | `cornerNone` | | `border-radius: 0px;` |
42
42
 
43
43
  ### Examples
44
44
 
45
- | **Example** | | **Corner Type** | | **Usage** |
46
- | --- | --- | --- | --- | --- |
47
- | | | Large Corner | | Rounded elements (Tags) |
48
- | | | Medium Corner | | Elements with slightly rounded corners (Dropdown Menus) |
49
- | | | No Set Corner | | Standard, default radius for corners in UI elements (Square and Copy Buttons, Checkboxes, Dialogs, Tooltips, etc.) |
45
+ | **Example** | | **Corner Type** | | **Usage** |
46
+ | ----------- | --- | --------------- | --- | ------------------------------------------------------------------------------------------------------------------ |
47
+ | | | Large Corner | | Rounded elements (Tags) |
48
+ | | | Medium Corner | | Elements with slightly rounded corners (Dropdown Menus) |
49
+ | | | No Set Corner | | Standard, default radius for corners in UI elements (Square and Copy Buttons, Checkboxes, Dialogs, Tooltips, etc.) |
50
50
 
51
51
  ---
52
52
 
@@ -54,30 +54,30 @@ Corners (border radiuses) provide visual, and often functional, distinction and
54
54
 
55
55
  ### Types of Corners
56
56
 
57
- | **Example** | | **Corner Type** | | **Usage** |
58
- | --- | --- | --- | --- | --- |
59
- | | | Large Corner | | Rounded elements (buttons and inputs) |
60
- | | | Medium Corner | | Standard, default radius for corners in UI elements (square buttons, form inputs, modals, tooltips, tags, etc.) |
61
- | | | Small Corner | | Corners on elements that are smaller than 20px × 20px. |
62
- | | | No Set Corner | | Corners on backgrounds for hovered dropdown menus and tables. |
57
+ | **Example** | | **Corner Type** | | **Usage** |
58
+ | ----------- | --- | --------------- | --- | --------------------------------------------------------------------------------------------------------------- |
59
+ | | | Large Corner | | Rounded elements (buttons and inputs) |
60
+ | | | Medium Corner | | Standard, default radius for corners in UI elements (square buttons, form inputs, modals, tooltips, tags, etc.) |
61
+ | | | Small Corner | | Corners on elements that are smaller than 20px × 20px. |
62
+ | | | No Set Corner | | Corners on backgrounds for hovered dropdown menus and tables. |
63
63
 
64
64
  ### Corner Variables
65
65
 
66
- | **Visual** | | **Variable** | | **Value** |
67
- | --- | --- | --- | --- | --- |
68
- | | | `cornerL` | | `border-radius: 20px;` |
69
- | | | `cornerM` | | `border-radius: 4px;` |
70
- | | | `cornerS` | | `border-radius: 2px;` |
71
- | | | `cornerNone` | | `border-radius: 0px;` |
66
+ | **Visual** | | **Variable** | | **Value** |
67
+ | ---------- | --- | ------------ | --- | ---------------------- |
68
+ | | | `cornerL` | | `border-radius: 20px;` |
69
+ | | | `cornerM` | | `border-radius: 4px;` |
70
+ | | | `cornerS` | | `border-radius: 2px;` |
71
+ | | | `cornerNone` | | `border-radius: 0px;` |
72
72
 
73
73
  ### Examples
74
74
 
75
- | **Example** | | **Corner Type** | | **Usage** |
76
- | --- | --- | --- | --- | --- |
77
- | | | Large Corner | | Rounded elements (buttons and inputs) |
78
- | | | Medium Corner | | Standard, default radius for corners in UI elements (square buttons, form inputs, modals, tooltips, tags, etc.) |
79
- | | | Small Corner | | Corners on elements that are smaller than 20px × 20px. |
80
- | | | No Set Corner | | Corners on backgrounds for hovered dropdown menus and tables. |
75
+ | **Example** | | **Corner Type** | | **Usage** |
76
+ | ----------- | --- | --------------- | --- | --------------------------------------------------------------------------------------------------------------- |
77
+ | | | Large Corner | | Rounded elements (buttons and inputs) |
78
+ | | | Medium Corner | | Standard, default radius for corners in UI elements (square buttons, form inputs, modals, tooltips, tags, etc.) |
79
+ | | | Small Corner | | Corners on elements that are smaller than 20px × 20px. |
80
+ | | | No Set Corner | | Corners on backgrounds for hovered dropdown menus and tables. |
81
81
 
82
82
  ---
83
83
 
@@ -85,28 +85,27 @@ Corners (border radiuses) provide visual, and often functional, distinction and
85
85
 
86
86
  ### Types of Corners
87
87
 
88
- | **Example** | | **Corner Type** | | **Usage** |
89
- | --- | --- | --- | --- | --- |
90
- | | | Large Corner | | Rounded elements (buttons and inputs) |
91
- | | | Medium Corner | | Standard, default radius for corners in UI elements (square buttons, form inputs, modals, tooltips, tags, etc.) |
92
- | | | Small Corner | | Corners on elements that are smaller than 20px × 20px. |
93
- | | | No Set Corner | | Corners on backgrounds for hovered dropdown menus and tables. |
88
+ | **Example** | | **Corner Type** | | **Usage** |
89
+ | ----------- | --- | --------------- | --- | --------------------------------------------------------------------------------------------------------------- |
90
+ | | | Large Corner | | Rounded elements (buttons and inputs) |
91
+ | | | Medium Corner | | Standard, default radius for corners in UI elements (square buttons, form inputs, modals, tooltips, tags, etc.) |
92
+ | | | Small Corner | | Corners on elements that are smaller than 20px × 20px. |
93
+ | | | No Set Corner | | Corners on backgrounds for hovered dropdown menus and tables. |
94
94
 
95
95
  ### Corner Variables
96
96
 
97
- | **Visual** | | **Variable** | | **Value** |
98
- | --- | --- | --- | --- | --- |
99
- | | | `cornerL` | | `border-radius: 20px;` |
100
- | | | `cornerM` | | `border-radius: 4px;` |
101
- | | | `cornerS` | | `border-radius: 2px;` |
102
- | | | `cornerNone` | | `border-radius: 0px;` |
97
+ | **Visual** | | **Variable** | | **Value** |
98
+ | ---------- | --- | ------------ | --- | ---------------------- |
99
+ | | | `cornerL` | | `border-radius: 20px;` |
100
+ | | | `cornerM` | | `border-radius: 4px;` |
101
+ | | | `cornerS` | | `border-radius: 2px;` |
102
+ | | | `cornerNone` | | `border-radius: 0px;` |
103
103
 
104
104
  ### Examples
105
105
 
106
- | **Example** | | **Corner Type** | | **Usage** |
107
- | --- | --- | --- | --- | --- |
108
- | | | Large Corner | | Rounded elements (buttons and inputs) |
109
- | | | Medium Corner | | Standard, default radius for corners in UI elements (square buttons, form inputs, modals, tooltips, tags, etc.) |
110
- | | | Small Corner | | Corners on elements that are smaller than 20px × 20px. |
111
- | | | No Set Corner | | Corners on backgrounds for hovered dropdown menus and tables. |
112
-
106
+ | **Example** | | **Corner Type** | | **Usage** |
107
+ | ----------- | --- | --------------- | --- | --------------------------------------------------------------------------------------------------------------- |
108
+ | | | Large Corner | | Rounded elements (buttons and inputs) |
109
+ | | | Medium Corner | | Standard, default radius for corners in UI elements (square buttons, form inputs, modals, tooltips, tags, etc.) |
110
+ | | | Small Corner | | Corners on elements that are smaller than 20px × 20px. |
111
+ | | | No Set Corner | | Corners on backgrounds for hovered dropdown menus and tables. |
package/data/zeroheight-exports/Cover-page.md CHANGED
@@ -1,4 +1,3 @@
1
1
  # Cover page
2
2
 
3
3
  The Science Design System supports the products and experiences that comprise CZI's suite of science applications. The system consists of design specs, components, resources, and working code, providing structure and guidance for anyone contributing to CZI's science products.
4
-