@czi-sds/mcp 0.5.2 → 0.5.3

package/data/zeroheight-exports/Intent.md

@@ -28,6 +28,26 @@ The example below shows Intent Message displayed in conjunction with Text Input
 | Negative | Negative + Notice | Notice | Notice + Positive | Positive |
 | -------- | ----------------- | ------ | ----------------- | -------- |
 
+**IntentMessage_Example_Negative**
+
+---
+
+**IntentMessage_Example_Negative + Notice**
+
+---
+
+**IntentMessage_Example_Notice**
+
+---
+
+**IntentMessage_Example_Notice + Positive**
+
+---
+
+**IntentMessage_Example_Positive**
+
+---
+
 #### Intent Indicator
 
 The example below shows Intent Indicator displayed in conjunction with a range of Input types for reference. See the documentation for each Input component for examples specific to that Input type.
@@ -35,12 +55,32 @@ The example below shows Intent Indicator displayed in conjunction with a range o
 | Empty (Negative) | Negative | Notice | Positive |
 | ---------------- | -------- | ------ | -------- |
 
+**IntentIndicator_Example_Empty**
+
+---
+
+**IntentIndicator_Example_Negative**
+
+---
+
+**IntentIndicator_Example_Notice**
+
+---
+
+**IntentIndicator_Example_Positive**
+
+---
+
 ---
 
 ### Intent Spacing
 
 These rules establish how much margin should exist between and around elements.
 
+**Intent spacing**
+
+---
+
 ## Code
 
 > **Note:** Code details coming soon

package/data/zeroheight-exports/Link.md

@@ -19,6 +19,14 @@ Links come in two sizes: fontXs and fontS to align with SDS' most common body co
 
 > **Note:** When including an inline Link in your Figma designs, styles must be manually applied as there is no way to save the Link style in Figma as a text style. Use the Link Figma component for links that are not inline.
 
+**Preview_Link_Default**
+
+---
+
+**Preview_Link_Dashed**
+
+---
+
 ---
 
 ### Live Instance
@@ -36,6 +44,18 @@ Use Link – Default only when the Link is placed on `surface-primary`, `surface
 | Default | Hover | Pressed |
 | ------- | ----- | ------- |
 
+**Default Visual Example_Default**
+
+---
+
+**Default Visual Example_Hover**
+
+---
+
+**Default visual example_Pressed**
+
+---
+
 ---
 
 ### Link – Dashed
@@ -47,6 +67,18 @@ See Borders section for Link Underline details.
 | Default | Hover | Pressed |
 | ------- | ----- | ------- |
 
+**Dashed Visual Example_Default**
+
+---
+
+**Dashed Visual Example_Hover**
+
+---
+
+**Dashed Visual Example_Pressed**
+
+---
+
 #### Color Rules
 
 The color of Link – Dashed and its underline should match the color of the text used in the paragraph it is placed within.
@@ -54,6 +86,18 @@ The color of Link – Dashed and its underline should match the color of the tex
 | Primary Text | Secondary Text | On-fill Text |
 | ------------ | -------------- | ------------ |
 
+**Dashed Visual Example_Black Text**
+
+---
+
+**Dashed Visual Example_Gray500 text**
+
+---
+
+**Dashed Visual Example_White text**
+
+---
+
 ---
 
 ### Link Spacing Rules
@@ -62,6 +106,10 @@ These rules establish how much margin should exist between and around elements.
 
 > **Note:** The underline for Link – Dashed is spaced lower than the default text-decoration underline.
 
+**Dashed Text Link spacing**
+
+---
+
 ## Code
 
 > **Note:** The code examples below must install dependencies before displaying and may take extra time to load
@@ -191,15 +239,14 @@ root.render(
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Link</title>
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
     <link
-      href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap"
+      href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap"
       rel="stylesheet"
     />
     <link
-      href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;600&display=swap"
+      href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&display=swap"
       rel="stylesheet"
     />
   </head>
@@ -347,15 +394,14 @@ root.render(
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Link</title>
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
     <link
-      href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap"
+      href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap"
       rel="stylesheet"
     />
     <link
-      href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;600&display=swap"
+      href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&display=swap"
       rel="stylesheet"
     />
   </head>

package/data/zeroheight-exports/Lists.md

@@ -23,6 +23,22 @@ Use when the order of the list's content does not matter.
 | **bodyM** | **bodyS** | **bodyXs** | **bodyXxs** |
 | --------- | --------- | ---------- | ----------- |
 
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
 ### Ordered List
 
 Use when the list's content needs to be presented in a specific order or sequence.
@@ -30,6 +46,22 @@ Use when the list's content needs to be presented in a specific order or sequenc
 | **bodyM** | **bodyS** | **bodyXs** | **bodyXxs** |
 | --------- | --------- | ---------- | ----------- |
 
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
 ---
 
 ### List Spacing
@@ -39,6 +71,38 @@ Spacing between List Items changes based on the font mixin size used. See the ta
 | **bodyM** | **bodyS** | **bodyXs** | **bodyXxs** |
 | --------- | --------- | ---------- | ----------- |
 
+**UL_bodyM**
+
+---
+
+**UL_bodyS**
+
+---
+
+**UL_bodyXs**
+
+---
+
+**UL_bodyXxs**
+
+---
+
+---
+
+**OL_bodyM**
+
+---
+
+**OL_bodyS**
+
+---
+
+**OL_bodyXs**
+
+---
+
+**OL_bodyXxs**
+
 ---
 
 ## Code
@@ -81,6 +145,30 @@ Use when the order of the list's content does not matter.
 | **fontBodyL** | **fontBodyM** | **fontBodyS** | **fontBodyXs** | **fontBodyXxs** | **fontBodyXxxs** |
 | ------------- | ------------- | ------------- | -------------- | --------------- | ---------------- |
 
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
 
 
 ### Ordered List
@@ -90,6 +178,30 @@ Use when the list's content needs to be presented in a specific order or sequenc
 | **fontBodyL** | **fontBodyM** | **fontBodyS** | **fontBodyXs** | **fontBodyXxs** | **fontBodyXxxs** |
 | ------------- | ------------- | ------------- | -------------- | --------------- | ---------------- |
 
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
 ---
 
 ### List Spacing
@@ -99,6 +211,54 @@ Spacing between List Items changes based on the font mixin size used. See the ta
 | **fontBodyL** | **fontBodyM** | **fontBodyS** | **fontBodyXs** | **fontBodyXxs** | **fontBodyXxxs** |
 | ------------- | ------------- | ------------- | -------------- | --------------- | ---------------- |
 
+**UL_fontL**
+
+---
+
+**UL_fontM**
+
+---
+
+**UL_fontS**
+
+---
+
+**UL_fontXs**
+
+---
+
+**UL_fontXxs**
+
+---
+
+**UL_fontXxxs**
+
+---
+
+---
+
+**OL_fontL**
+
+---
+
+**OL_fontM**
+
+---
+
+**OL_fontS**
+
+---
+
+**OL_fontXs**
+
+---
+
+**OL_fontXxs**
+
+---
+
+**OL_fontXxxs**
+
 ---
 
 ## Code
@@ -141,6 +301,30 @@ Use when the order of the list's content does not matter.
 | **fontBodyL** | **fontBodyM** | **fontBodyS** | **fontBodyXs** | **fontBodyXxs** | **fontBodyXxxs** |
 | ------------- | ------------- | ------------- | -------------- | --------------- | ---------------- |
 
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
 
 
 ### Ordered List
@@ -150,6 +334,30 @@ Use when the list's content needs to be presented in a specific order or sequenc
 | **fontBodyL** | **fontBodyM** | **fontBodyS** | **fontBodyXs** | **fontBodyXxs** | **fontBodyXxxs** |
 | ------------- | ------------- | ------------- | -------------- | --------------- | ---------------- |
 
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
+**List**
+
+---
+
 ---
 
 ### List Spacing
@@ -159,6 +367,54 @@ Spacing between List Items changes based on the font mixin size used. See the ta
 | **fontBodyL** | **fontBodyM** | **fontBodyS** | **fontBodyXs** | **fontBodyXxs** | **fontBodyXxxs** |
 | ------------- | ------------- | ------------- | -------------- | --------------- | ---------------- |
 
+**UL_fontL**
+
+---
+
+**UL_fontM**
+
+---
+
+**UL_fontS**
+
+---
+
+**UL_fontXs**
+
+---
+
+**UL_fontXxs**
+
+---
+
+**UL_fontXxxs**
+
+---
+
+---
+
+**OL_fontL**
+
+---
+
+**OL_fontM**
+
+---
+
+**OL_fontS**
+
+---
+
+**OL_fontXs**
+
+---
+
+**OL_fontXxs**
+
+---
+
+**OL_fontXxxs**
+
 ---
 
 ## Code
@@ -189,6 +445,14 @@ Utilizing a list to present information makes it easier to digest or act upon wh
 
 There are two types of Lists—Unordered where the order of content does not matter and Ordered which communicate a specific sequence for the content. Use a header with either list type to help provide context to the content presented in the list.
 
+**Preview_List_Ordered**
+
+---
+
+**Preview_List_Unordered**
+
+---
+
 ---
 
 ### Live Instance
@@ -206,6 +470,30 @@ Use when the list's content needs to be presented in a specific order or sequenc
 | fontBodyL | fontBodyM | fontBodyS | fontBodyXs | fontBodyXxs | fontBodyXxxs |
 | --------- | --------- | --------- | ---------- | ----------- | ------------ |
 
+**List_Ordered_L**
+
+---
+
+**List_Ordered_M**
+
+---
+
+**List_Ordered_S**
+
+---
+
+**List_Ordered_Xs**
+
+---
+
+**List_Ordered_Xxs**
+
+---
+
+**List_Ordered_Xxxs**
+
+---
+
 ---
 
 ### List – Unordered
@@ -215,6 +503,30 @@ Use when the order of the list's content does not matter.
 | fontBodyL | fontBodyM | fontBodyS | fontBodyXs | fontBodyXxs | fontBodyXxxs |
 | --------- | --------- | --------- | ---------- | ----------- | ------------ |
 
+**List_Unordered_L**
+
+---
+
+**List_Unordered_M**
+
+---
+
+**List_Unordered_S**
+
+---
+
+**List_Unordered_Xs**
+
+---
+
+**List_Unordered_Xxs**
+
+---
+
+**List_Unordered_Xxxs**
+
+---
+
 ---
 
 ### List Spacing
@@ -224,6 +536,54 @@ Spacing between List Items changes based on the font size used. See the table be
 | fontBodyL | fontBodyM | fontBodyS | fontBodyXs | fontBodyXxs | fontBodyXxxs |
 | --------- | --------- | --------- | ---------- | ----------- | ------------ |
 
+**UL_fontL**
+
+---
+
+**UL_fontM**
+
+---
+
+**UL_fontS**
+
+---
+
+**UL_fontXs**
+
+---
+
+**UL_fontXxs**
+
+---
+
+**UL_fontXxxs**
+
+---
+
+**OL_fontL**
+
+---
+
+**OL_fontM**
+
+---
+
+**OL_fontS**
+
+---
+
+**OL_fontXs**
+
+---
+
+**OL_fontXxs**
+
+---
+
+**OL_fontXxxs**
+
+---
+
 ## Code
 
 > **Note:** The code examples below must install dependencies before displaying and may take extra time to load
@@ -383,15 +743,14 @@ root.render(
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Lists</title>
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
     <link
-      href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap"
+      href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap"
       rel="stylesheet"
     />
     <link
-      href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;600&display=swap"
+      href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&display=swap"
       rel="stylesheet"
     />
   </head>
@@ -593,15 +952,14 @@ root.render(
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Lists</title>
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
     <link
-      href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap"
+      href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap"
       rel="stylesheet"
     />
     <link
-      href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;600&display=swap"
+      href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&display=swap"
       rel="stylesheet"
     />
   </head>

package/data/zeroheight-exports/Loading-Indicator.md

@@ -11,12 +11,20 @@ Used in napari hub and napari.org to indicate when on-page components are loadin
 
 Note: icon spins.
 
+**LoadingIndicator**
+
+---
+
 ---
 
 ### Loading Indicator Spacing
 
 These rules establish how much margin should exist between and around elements.
 
+**Loading Indicator spacing**
+
+---
+
 
 
 ## Code