@telus-uds/components-base 1.16.0 → 1.18.0

package/component-docs.json

@@ -419,6 +419,80 @@
         "outlineColor": "color",
         "outlineWidth": "border"
       },
+      "QuickLinks": {
+        "list": "show",
+        "card": "show",
+        "dividers": "show",
+        "stackSpace": "integer",
+        "stackGap": "integer",
+        "stackJustify": "flexJustifyContent"
+      },
+      "QuickLinksCard": {
+        "flex": "integer",
+        "backgroundColor": "color",
+        "borderColor": "color",
+        "borderRadius": "radius",
+        "borderWidth": "border",
+        "paddingBottom": "size",
+        "paddingLeft": "size",
+        "paddingRight": "size",
+        "paddingTop": "size",
+        "minWidth": "size",
+        "shadow": "shadow"
+      },
+      "QuickLinksList": {
+        "dividerColor": "color",
+        "dividerSize": "border",
+        "iconMarginTop": "size",
+        "interItemMargin": "size",
+        "interItemMarginWithDivider": "size",
+        "itemBulletColor": "color",
+        "itemBulletContainerAlign": "textAlign",
+        "itemBulletContainerWidth": "size",
+        "itemBulletHeight": "size",
+        "itemBulletWidth": "size",
+        "itemFontName": "fontName",
+        "itemFontSize": "fontSize",
+        "itemFontWeight": "fontWeight",
+        "itemIconColor": "color",
+        "itemIconSize": "size",
+        "itemLineHeight": "lineHeight",
+        "listGutter": "size",
+        "backgroundColor": "color",
+        "paddingLeft": "size",
+        "paddingRight": "size",
+        "paddingTop": "size",
+        "paddingBottom": "size"
+      },
+      "QuickLinksButton": {
+        "borderColor": "color",
+        "borderWidth": "border",
+        "borderRadius": "radius",
+        "shadow": "shadow",
+        "fontSize": "fontSize",
+        "color": "color",
+        "lineHeight": "lineHeight",
+        "textAlign": "flexJustifyContent",
+        "alignSelf": "flexAlign",
+        "fontName": "fontName",
+        "fontWeight": "fontWeight",
+        "backgroundColor": "color",
+        "opacity": "opacity",
+        "paddingLeft": "size",
+        "paddingRight": "size",
+        "paddingTop": "size",
+        "paddingBottom": "size",
+        "width": "size",
+        "minWidth": "size",
+        "outerBorderColor": "color",
+        "outerBorderWidth": "border",
+        "outerBorderGap": "size",
+        "outerBackgroundColor": "color",
+        "icon": "icon",
+        "iconColor": "color",
+        "iconSize": "size",
+        "iconSpace": "integer"
+      },
       "Radio": {
         "checkedBackgroundColor": "color",
         "checkedSize": "size",
@@ -807,6 +881,24 @@
         "flexGrow": "integer",
         "flexShrink": "integer"
       },
+      "Timeline": {
+        "dotColor": "color",
+        "dotWidth": "size",
+        "dotBorderWidth": "border",
+        "timelineContainerDirection": "direction",
+        "timelineColor": "color",
+        "connectorWidth": "size",
+        "connectorHeight": "size",
+        "lineItemContainerDirection": "direction",
+        "lineContainerFlexSize": "integer",
+        "lineItemAlign": "flexAlign",
+        "lineItemDirection": "direction",
+        "lineItemMarginRight": "size",
+        "lineItemMarginBottom": "size",
+        "itemContentFlexSize": "integer",
+        "itemContentMarginRight": "size",
+        "itemContentMarginBottom": "size"
+      },
       "Tooltip": {
         "backgroundColor": "color",
         "paddingTop": "size",
@@ -1263,6 +1355,29 @@
           "type": "state"
         }
       },
+      "QuickLinksList": {
+        "hover": {
+          "description": "Currently web only. Applies when an interactive component's hover handler is triggered, such as on mouseover.",
+          "values": [
+            true
+          ],
+          "type": "state"
+        },
+        "focus": {
+          "description": "Currently only web has good support for this. Applies when an interactive component's focus handler is triggered, such as keyboard tabbing or selection.",
+          "values": [
+            true
+          ],
+          "type": "state"
+        },
+        "pressed": {
+          "description": "Applies while an interactive component is being physically pressed. Most visible on touchscreen taps; in React Native Web, this is visible on web mouse clicks only if the pressable is held down.",
+          "values": [
+            true
+          ],
+          "type": "state"
+        }
+      },
       "Radio": {
         "checked": {
           "description": "Corresponds to a selected state for a checkbox or radio",
@@ -4625,8 +4740,7 @@
           },
           "children": {
             "type": {
-              "name": "custom",
-              "raw": "componentPropType('ListItem')"
+              "name": "node"
             },
             "required": false,
             "description": ""
@@ -4797,8 +4911,7 @@
           },
           "children": {
             "type": {
-              "name": "custom",
-              "raw": "componentPropType('ListItem')"
+              "name": "node"
             },
             "required": false,
             "description": ""
@@ -5746,131 +5859,86 @@
         }
       }
     },
-    "Radio": {
+    "QuickLinks": {
       "docs": {
-        "description": "Basic Radio component.\n\n## Component API\n\nUse `label` prop to provide a label for the radio button. For a disabled `Radio` set the `inactive` prop to `true`.\n\n### Controlled version\n\nIf the radio button is controlled from outside, it needs to receive `checked` and `onChange` props.\n\n### Uncontrolled version\n\nIn case of uncontrolled radio button you can use `defaultChecked` prop to provide the initial value.\nWhenever the radio button gets toggled, it calls the `onChange` callback with the new value (boolean).\n\n### Using within forms\n\nYou can pass `name` and `value` props if you need a particular radio button to be a part of a radio group\non a form.\n\n### Validation\n\nYou can mark a radio button as failing validation by setting the `error` prop to `true`.\n\n## A11y guidelines\n\nRadio component accepts all the common accessibility props, but also sets some defaults, including\naccessibility role `'radio'` and accessibility state that depends on the other props (`checked`, `inactive`)\nor the internal state in case of uncontrolled radio button.",
+        "description": "QuickLinks renders a list of interactive items. How it renders these items depends on theme options:\n - If the theme returns `list` token as true, it renders an ordered list based on List\n - If the theme returns `button` token as true and `list` as false, it renders a wrapping horizontal bar of buttons\n - If the theme returns `card` token as true, it wraps the above with a `Card`.",
         "props": {
-          "error": {
+          "tag": {
             "defaultValue": {
-              "value": "false",
+              "value": "'ul'",
               "computed": false
             },
-            "type": {
-              "name": "bool"
-            },
-            "required": false,
-            "description": "Whether the underlying input triggered a validation error or not."
-          },
-          "checked": {
-            "type": {
-              "name": "bool"
-            },
-            "required": false,
-            "description": "Use `checked` for controlled Radio. For uncontrolled Radio, use the `defaultChecked` prop."
-          },
-          "defaultChecked": {
-            "type": {
-              "name": "bool"
-            },
-            "required": false,
-            "description": "Use `defaultChecked` to provide the initial value for an uncontrolled Radio."
-          },
-          "description": {
-            "type": {
-              "name": "string"
-            },
-            "required": false,
-            "description": "An optional radio button description."
-          },
-          "id": {
-            "type": {
-              "name": "string"
-            },
-            "required": false,
-            "description": "Radio button ID."
-          },
-          "inactive": {
-            "type": {
-              "name": "bool"
-            },
-            "required": false,
-            "description": "Whether the corresponding input is disabled or active."
-          },
-          "label": {
-            "type": {
-              "name": "string"
-            },
-            "required": false,
-            "description": "The label."
-          },
-          "name": {
             "type": {
               "name": "string"
             },
             "required": false,
-            "description": "Associate this radio button with a group (set as the name attribute)."
+            "description": ""
           },
-          "value": {
+          "tokens": {
             "type": {
-              "name": "union",
-              "value": [
-                {
-                  "name": "string"
-                },
-                {
-                  "name": "number"
-                },
-                {
-                  "name": "bool"
-                }
-              ]
+              "name": "custom",
+              "raw": {
+                "list": "show",
+                "card": "show",
+                "dividers": "show",
+                "stackSpace": "integer",
+                "stackGap": "integer",
+                "stackJustify": "flexJustifyContent"
+              }
             },
             "required": false,
-            "description": "The value. Must be unique within the group."
+            "description": ""
           },
-          "onChange": {
+          "cardTokens": {
             "type": {
-              "name": "func"
+              "name": "custom",
+              "raw": {
+                "flex": "integer",
+                "backgroundColor": "color",
+                "borderColor": "color",
+                "borderRadius": "radius",
+                "borderWidth": "border",
+                "paddingBottom": "size",
+                "paddingLeft": "size",
+                "paddingRight": "size",
+                "paddingTop": "size",
+                "minWidth": "size",
+                "shadow": "shadow"
+              }
             },
             "required": false,
-            "description": "Callback called when a controlled radio button gets interacted with."
+            "description": ""
           },
-          "tokens": {
+          "listTokens": {
             "type": {
               "name": "custom",
               "raw": {
-                "checkedBackgroundColor": "color",
-                "checkedSize": "size",
-                "containerBackgroundColor": "color",
-                "containerBorderRadius": "radius",
-                "containerOpacity": "opacity",
-                "containerPaddingBottom": "size",
-                "containerPaddingLeft": "size",
-                "containerPaddingRight": "size",
-                "containerPaddingTop": "size",
-                "containerShadow": "shadow",
-                "descriptionFontSize": "fontSize",
-                "descriptionLineHeight": "lineHeight",
-                "descriptionMarginLeft": "size",
-                "inputBackgroundColor": "color",
-                "inputBorderColor": "color",
-                "inputBorderWidth": "border",
-                "inputOutlineColor": "color",
-                "inputOutlineWidth": "border",
-                "inputSize": "size",
-                "outerBorderGap": "size",
-                "outerBorderWidth": "border",
-                "outerBorderColor": "color",
-                "labelColor": "color",
-                "labelFontName": "fontName",
-                "labelFontSize": "fontSize",
-                "labelFontWeight": "fontWeight",
-                "labelLineHeight": "lineHeight",
-                "labelMarginLeft": "size"
+                "dividerColor": "color",
+                "dividerSize": "border",
+                "iconMarginTop": "size",
+                "interItemMargin": "size",
+                "interItemMarginWithDivider": "size",
+                "itemBulletColor": "color",
+                "itemBulletContainerAlign": "textAlign",
+                "itemBulletContainerWidth": "size",
+                "itemBulletHeight": "size",
+                "itemBulletWidth": "size",
+                "itemFontName": "fontName",
+                "itemFontSize": "fontSize",
+                "itemFontWeight": "fontWeight",
+                "itemIconColor": "color",
+                "itemIconSize": "size",
+                "itemLineHeight": "lineHeight",
+                "listGutter": "size",
+                "backgroundColor": "color",
+                "paddingLeft": "size",
+                "paddingRight": "size",
+                "paddingTop": "size",
+                "paddingBottom": "size"
               }
             },
             "required": false,
-            "description": "Radio tokens."
+            "description": ""
           },
           "variant": {
             "type": {
@@ -5891,26 +5959,291 @@
               }
             },
             "required": false,
-            "description": "Radio variant."
+            "description": ""
+          },
+          "children": {
+            "type": {
+              "name": "node"
+            },
+            "required": false,
+            "description": ""
           }
         },
         "attributes": {
           "acceptsRNA11yProps": false
         }
-      }
-    },
-    "RadioCard": {
-      "docs": {
-        "description": "A Card that behaves like a radio button. Use when users select a single choice from mutually exclusive options\nwith need to show additional information for each option. The whole card is interactive as one item.\n\n## Component API\n\nUse `title` prop to provide a main description, and `children` for additional content. Avoid including\ninteractive elements within the RadioCard content.\n\nFor a disabled `RadioCard`, set the `inactive` prop to `true`.\n\n### Controlled version\n\nIf the radio card is controlled from outside, it needs to receive `checked` and `onChange` props.\n\n### Uncontrolled version\n\nIn case of uncontrolled radio card you can use `defaultChecked` prop to provide the initial value.\nWhenever the radio card gets toggled, it calls the `onChange` callback with the new value (boolean).\n\n### Using within forms\n\nYou can pass `name` and `value` props if you need a particular radio card to be a part of a radio group\non a form.\n\n### Validation\n\nYou can mark a radio card as failing validation by setting the `error` prop to `true`.\n\n## A11y guidelines\n\nRadio card accepts all the common accessibility props, but also sets some defaults, including\naccessibility role `'radio'` and accessibility state that depends on the other props (`checked`, `inactive`)\nor the internal state in case of uncontrolled radio button.",
-        "props": {
-          "title": {
-            "type": {
-              "name": "string"
-            },
-            "required": false,
-            "description": "Content to be displayed at the top of the card alongside the radio button"
-          },
-          "children": {
+      },
+      "Item": {
+        "docs": {
+          "description": "Public component exported as QuickLinks.Item, for use as children of QuickLinks.\n\nReceives props injected by QuickLinks and renders the appropriate child component.",
+          "props": {
+            "LinkRouter": {
+              "type": {
+                "name": "elementType"
+              },
+              "required": false,
+              "description": ""
+            },
+            "linkRouterProps": {
+              "type": {
+                "name": "object"
+              },
+              "required": false,
+              "description": ""
+            },
+            "tokens": {
+              "type": {
+                "name": "custom",
+                "raw": {
+                  "dividerColor": "color",
+                  "dividerSize": "border",
+                  "iconMarginTop": "size",
+                  "interItemMargin": "size",
+                  "interItemMarginWithDivider": "size",
+                  "itemBulletColor": "color",
+                  "itemBulletContainerAlign": "textAlign",
+                  "itemBulletContainerWidth": "size",
+                  "itemBulletHeight": "size",
+                  "itemBulletWidth": "size",
+                  "itemFontName": "fontName",
+                  "itemFontSize": "fontSize",
+                  "itemFontWeight": "fontWeight",
+                  "itemIconColor": "color",
+                  "itemIconSize": "size",
+                  "itemLineHeight": "lineHeight",
+                  "listGutter": "size",
+                  "backgroundColor": "color",
+                  "paddingLeft": "size",
+                  "paddingRight": "size",
+                  "paddingTop": "size",
+                  "paddingBottom": "size",
+                  "borderColor": "color",
+                  "borderWidth": "border",
+                  "borderRadius": "radius",
+                  "shadow": "shadow",
+                  "fontSize": "fontSize",
+                  "color": "color",
+                  "lineHeight": "lineHeight",
+                  "textAlign": "flexJustifyContent",
+                  "alignSelf": "flexAlign",
+                  "fontName": "fontName",
+                  "fontWeight": "fontWeight",
+                  "opacity": "opacity",
+                  "width": "size",
+                  "minWidth": "size",
+                  "outerBorderColor": "color",
+                  "outerBorderWidth": "border",
+                  "outerBorderGap": "size",
+                  "outerBackgroundColor": "color",
+                  "icon": "icon",
+                  "iconColor": "color",
+                  "iconSize": "size",
+                  "iconSpace": "integer"
+                }
+              },
+              "required": false,
+              "description": ""
+            },
+            "variant": {
+              "type": {
+                "name": "objectOf",
+                "value": {
+                  "name": "union",
+                  "value": [
+                    {
+                      "name": "string"
+                    },
+                    {
+                      "name": "number"
+                    },
+                    {
+                      "name": "bool"
+                    }
+                  ]
+                }
+              },
+              "required": false,
+              "description": ""
+            },
+            "children": {
+              "type": {
+                "name": "node"
+              },
+              "required": false,
+              "description": ""
+            }
+          },
+          "attributes": {
+            "acceptsRNA11yProps": false
+          }
+        }
+      }
+    },
+    "Radio": {
+      "docs": {
+        "description": "Basic Radio component.\n\n## Component API\n\nUse `label` prop to provide a label for the radio button. For a disabled `Radio` set the `inactive` prop to `true`.\n\n### Controlled version\n\nIf the radio button is controlled from outside, it needs to receive `checked` and `onChange` props.\n\n### Uncontrolled version\n\nIn case of uncontrolled radio button you can use `defaultChecked` prop to provide the initial value.\nWhenever the radio button gets toggled, it calls the `onChange` callback with the new value (boolean).\n\n### Using within forms\n\nYou can pass `name` and `value` props if you need a particular radio button to be a part of a radio group\non a form.\n\n### Validation\n\nYou can mark a radio button as failing validation by setting the `error` prop to `true`.\n\n## A11y guidelines\n\nRadio component accepts all the common accessibility props, but also sets some defaults, including\naccessibility role `'radio'` and accessibility state that depends on the other props (`checked`, `inactive`)\nor the internal state in case of uncontrolled radio button.",
+        "props": {
+          "error": {
+            "defaultValue": {
+              "value": "false",
+              "computed": false
+            },
+            "type": {
+              "name": "bool"
+            },
+            "required": false,
+            "description": "Whether the underlying input triggered a validation error or not."
+          },
+          "checked": {
+            "type": {
+              "name": "bool"
+            },
+            "required": false,
+            "description": "Use `checked` for controlled Radio. For uncontrolled Radio, use the `defaultChecked` prop."
+          },
+          "defaultChecked": {
+            "type": {
+              "name": "bool"
+            },
+            "required": false,
+            "description": "Use `defaultChecked` to provide the initial value for an uncontrolled Radio."
+          },
+          "description": {
+            "type": {
+              "name": "string"
+            },
+            "required": false,
+            "description": "An optional radio button description."
+          },
+          "id": {
+            "type": {
+              "name": "string"
+            },
+            "required": false,
+            "description": "Radio button ID."
+          },
+          "inactive": {
+            "type": {
+              "name": "bool"
+            },
+            "required": false,
+            "description": "Whether the corresponding input is disabled or active."
+          },
+          "label": {
+            "type": {
+              "name": "string"
+            },
+            "required": false,
+            "description": "The label."
+          },
+          "name": {
+            "type": {
+              "name": "string"
+            },
+            "required": false,
+            "description": "Associate this radio button with a group (set as the name attribute)."
+          },
+          "value": {
+            "type": {
+              "name": "union",
+              "value": [
+                {
+                  "name": "string"
+                },
+                {
+                  "name": "number"
+                },
+                {
+                  "name": "bool"
+                }
+              ]
+            },
+            "required": false,
+            "description": "The value. Must be unique within the group."
+          },
+          "onChange": {
+            "type": {
+              "name": "func"
+            },
+            "required": false,
+            "description": "Callback called when a controlled radio button gets interacted with."
+          },
+          "tokens": {
+            "type": {
+              "name": "custom",
+              "raw": {
+                "checkedBackgroundColor": "color",
+                "checkedSize": "size",
+                "containerBackgroundColor": "color",
+                "containerBorderRadius": "radius",
+                "containerOpacity": "opacity",
+                "containerPaddingBottom": "size",
+                "containerPaddingLeft": "size",
+                "containerPaddingRight": "size",
+                "containerPaddingTop": "size",
+                "containerShadow": "shadow",
+                "descriptionFontSize": "fontSize",
+                "descriptionLineHeight": "lineHeight",
+                "descriptionMarginLeft": "size",
+                "inputBackgroundColor": "color",
+                "inputBorderColor": "color",
+                "inputBorderWidth": "border",
+                "inputOutlineColor": "color",
+                "inputOutlineWidth": "border",
+                "inputSize": "size",
+                "outerBorderGap": "size",
+                "outerBorderWidth": "border",
+                "outerBorderColor": "color",
+                "labelColor": "color",
+                "labelFontName": "fontName",
+                "labelFontSize": "fontSize",
+                "labelFontWeight": "fontWeight",
+                "labelLineHeight": "lineHeight",
+                "labelMarginLeft": "size"
+              }
+            },
+            "required": false,
+            "description": "Radio tokens."
+          },
+          "variant": {
+            "type": {
+              "name": "objectOf",
+              "value": {
+                "name": "union",
+                "value": [
+                  {
+                    "name": "string"
+                  },
+                  {
+                    "name": "number"
+                  },
+                  {
+                    "name": "bool"
+                  }
+                ]
+              }
+            },
+            "required": false,
+            "description": "Radio variant."
+          }
+        },
+        "attributes": {
+          "acceptsRNA11yProps": false
+        }
+      }
+    },
+    "RadioCard": {
+      "docs": {
+        "description": "A Card that behaves like a radio button. Use when users select a single choice from mutually exclusive options\nwith need to show additional information for each option. The whole card is interactive as one item.\n\n## Component API\n\nUse `title` prop to provide a main description, and `children` for additional content. Avoid including\ninteractive elements within the RadioCard content.\n\nFor a disabled `RadioCard`, set the `inactive` prop to `true`.\n\n### Controlled version\n\nIf the radio card is controlled from outside, it needs to receive `checked` and `onChange` props.\n\n### Uncontrolled version\n\nIn case of uncontrolled radio card you can use `defaultChecked` prop to provide the initial value.\nWhenever the radio card gets toggled, it calls the `onChange` callback with the new value (boolean).\n\n### Using within forms\n\nYou can pass `name` and `value` props if you need a particular radio card to be a part of a radio group\non a form.\n\n### Validation\n\nYou can mark a radio card as failing validation by setting the `error` prop to `true`.\n\n## A11y guidelines\n\nRadio card accepts all the common accessibility props, but also sets some defaults, including\naccessibility role `'radio'` and accessibility state that depends on the other props (`checked`, `inactive`)\nor the internal state in case of uncontrolled radio button.",
+        "props": {
+          "title": {
+            "type": {
+              "name": "string"
+            },
+            "required": false,
+            "description": "Content to be displayed at the top of the card alongside the radio button"
+          },
+          "children": {
             "type": {
               "name": "union",
               "value": [
@@ -7704,6 +8037,261 @@
         }
       }
     },
+    "Timeline": {
+      "docs": {
+        "description": "Timeline is a component that displays either a horizontal or vertical list of the\nchildren components passed by props\n\n## Component API\n\n- `horizontal` In order to display the Component list horizontally\n\n\n## A11y guidelines\nTimeline link supports all the common a11y props.",
+        "props": {
+          "variant": {
+            "defaultValue": {
+              "value": "{}",
+              "computed": false
+            },
+            "type": {
+              "name": "objectOf",
+              "value": {
+                "name": "union",
+                "value": [
+                  {
+                    "name": "string"
+                  },
+                  {
+                    "name": "number"
+                  },
+                  {
+                    "name": "bool"
+                  }
+                ]
+              }
+            },
+            "required": false,
+            "description": ""
+          },
+          "tag": {
+            "defaultValue": {
+              "value": "'ul'",
+              "computed": false
+            },
+            "type": {
+              "name": "enum",
+              "value": [
+                {
+                  "value": "'h1'",
+                  "computed": false
+                },
+                {
+                  "value": "'h2'",
+                  "computed": false
+                },
+                {
+                  "value": "'h3'",
+                  "computed": false
+                },
+                {
+                  "value": "'h4'",
+                  "computed": false
+                },
+                {
+                  "value": "'h5'",
+                  "computed": false
+                },
+                {
+                  "value": "'h6'",
+                  "computed": false
+                },
+                {
+                  "value": "'article'",
+                  "computed": false
+                },
+                {
+                  "value": "'aside'",
+                  "computed": false
+                },
+                {
+                  "value": "'blockquote'",
+                  "computed": false
+                },
+                {
+                  "value": "'footer'",
+                  "computed": false
+                },
+                {
+                  "value": "'figure'",
+                  "computed": false
+                },
+                {
+                  "value": "'form'",
+                  "computed": false
+                },
+                {
+                  "value": "'header'",
+                  "computed": false
+                },
+                {
+                  "value": "'ul'",
+                  "computed": false
+                },
+                {
+                  "value": "'li'",
+                  "computed": false
+                },
+                {
+                  "value": "'main'",
+                  "computed": false
+                },
+                {
+                  "value": "'nav'",
+                  "computed": false
+                },
+                {
+                  "value": "'section'",
+                  "computed": false
+                },
+                {
+                  "value": "'label'",
+                  "computed": false
+                }
+              ]
+            },
+            "required": false,
+            "description": "Sets the HTML tag of the outer container and the children. By default `'li'` for the children\nand `'ul'` for the container\n\nIf either `tag` or `childrenTag` is overridden, the other should be too, to avoid producing invalid HTML."
+          },
+          "childrenTag": {
+            "defaultValue": {
+              "value": "'li'",
+              "computed": false
+            },
+            "type": {
+              "name": "enum",
+              "value": [
+                {
+                  "value": "'h1'",
+                  "computed": false
+                },
+                {
+                  "value": "'h2'",
+                  "computed": false
+                },
+                {
+                  "value": "'h3'",
+                  "computed": false
+                },
+                {
+                  "value": "'h4'",
+                  "computed": false
+                },
+                {
+                  "value": "'h5'",
+                  "computed": false
+                },
+                {
+                  "value": "'h6'",
+                  "computed": false
+                },
+                {
+                  "value": "'article'",
+                  "computed": false
+                },
+                {
+                  "value": "'aside'",
+                  "computed": false
+                },
+                {
+                  "value": "'blockquote'",
+                  "computed": false
+                },
+                {
+                  "value": "'footer'",
+                  "computed": false
+                },
+                {
+                  "value": "'figure'",
+                  "computed": false
+                },
+                {
+                  "value": "'form'",
+                  "computed": false
+                },
+                {
+                  "value": "'header'",
+                  "computed": false
+                },
+                {
+                  "value": "'ul'",
+                  "computed": false
+                },
+                {
+                  "value": "'li'",
+                  "computed": false
+                },
+                {
+                  "value": "'main'",
+                  "computed": false
+                },
+                {
+                  "value": "'nav'",
+                  "computed": false
+                },
+                {
+                  "value": "'section'",
+                  "computed": false
+                },
+                {
+                  "value": "'label'",
+                  "computed": false
+                }
+              ]
+            },
+            "required": false,
+            "description": ""
+          },
+          "tokens": {
+            "type": {
+              "name": "custom",
+              "raw": {
+                "dotColor": "color",
+                "dotWidth": "size",
+                "dotBorderWidth": "border",
+                "timelineContainerDirection": "direction",
+                "timelineColor": "color",
+                "connectorWidth": "size",
+                "connectorHeight": "size",
+                "lineItemContainerDirection": "direction",
+                "lineContainerFlexSize": "integer",
+                "lineItemAlign": "flexAlign",
+                "lineItemDirection": "direction",
+                "lineItemMarginRight": "size",
+                "lineItemMarginBottom": "size",
+                "itemContentFlexSize": "integer",
+                "itemContentMarginRight": "size",
+                "itemContentMarginBottom": "size"
+              }
+            },
+            "required": false,
+            "description": ""
+          },
+          "children": {
+            "type": {
+              "name": "arrayOf",
+              "value": {
+                "name": "node"
+              }
+            },
+            "required": true,
+            "description": "A list of components that will be rendered either horizontally or vertically"
+          },
+          "accessibilityLabel": {
+            "type": {
+              "name": "string"
+            },
+            "required": true,
+            "description": "A required accessibility label that needs to be passed to be used on List\nwhich is applied as normal for a React Native accessibilityLabel prop."
+          }
+        },
+        "attributes": {
+          "acceptsRNA11yProps": false
+        }
+      }
+    },
     "Tooltip": {
       "docs": {
         "description": "Tooltip provides a descriptive and detailed explanation or instructions. It can be used next to an input label\nto help a user fill it in, or as a standalone component.\n\nBy default the TooltipButton component will be used as a control for triggering the tooltip, but you may attach\na tooltip to any other component. A render function can be used to adjust the control's styling on state changes (hover, focus, etc.).\n\n### Positioning\nBy default a Tooltip will be automatically positioned in a way that ensures it fits within the viewport.\nYou may suggest a position with a prop - it will be used, unless the tooltip would end up outside the viewport.\n\n### Usage criteria\n- You may use one when the information is useful only to a small percentage of users (ie. tech savvy people wouldn't need this info).\n- Tooltips may also be useful when vertical space is an issue.",